{"version":3,"sources":["ToggleSwitch.tsx"],"sourcesContent":["import { template } from \"uix/html/template.ts\";\nimport { Component } from \"uix/components/Component.ts\";\n\nexport type ToggleEvent = CustomEventInit<{checked: boolean, originalEvent: Event}>;\nexport type ToggleSwitchOptions = {\n\tchecked?: boolean | Ref<boolean>;\n\tsize?: number;\n\tlabel?: Ref<string> | string | HTMLElement | {on: Ref<string> | string | HTMLElement, off: Ref<string> | string | HTMLElement};\n\tontoggle?: (value: boolean) => void;\n}\n\n@template(function({size}) {\n\tconst id = `switch-${crypto.randomUUID()}`;\n\tconst checked = this.properties?.checked ?? false;\n\treturn <div id=\"toggle-switch\" class=\"unyt-toggle-switch\" stylesheet={\"./ToggleSwitch.css?\"}>\n\t\t{this.properties?.label ? <label id=\"label\" class=\"label\" for={id}>\n\t\t\t{this.getLabel(val(checked))}\n\t\t</label> : null}\n\t\t<label class=\"toggle-switch\" for={id} style={{\n\t\t\t[size ? \"--size\" : \"\"]: size ?? 0\n\t\t}}>\n\t\t\t<input\n\t\t\t\tid={id}\n\t\t\t\ttype=\"checkbox\"\n\t\t\t\tchecked={checked}/>\n\t\t\t<span class=\"slider\"/>\n\t\t</label>\n\t</div>\n})\n\n@standalone({inheritedFields: [\"properties\"]})\nexport class ToggleSwitch extends Component<ToggleSwitchOptions> {\n\t@id label!: HTMLElement;\n\n\tprotected override onCreate(): void | Promise<void> {\n\t\tif (this.properties.label instanceof Element)\n\t\t\t// @ts-ignore $\n\t\t\tdelete this.properties.label;\n\t}\n\n\tprivate getSwitch() {\n\t\treturn this.querySelector<HTMLInputElement>(\"input[type='checkbox']\")!;\n\t}\n\tprivate getLabel(checked?: boolean) {\n\t\tconst label = this.properties?.label;\n\t\tif (!label)\n\t\t\treturn null;\n\t\tif (label instanceof HTMLElement || typeof label === \"string\" || (\n\t\t\t// @ts-ignore $\n\t\t\tglobalThis.Datex?.Pointer &&\n\t\t\t// @ts-ignore $\n\t\t\tlabel instanceof globalThis.Datex?.Pointer\n\t\t)) return label as HTMLElement | string;\n\t\tconst isChecked = checked === undefined ? this.isChecked() : checked;\n\t\treturn isChecked ? \n\t\t\tlabel.on :\n\t\t\tlabel.off ?? '';\n\t}\n\t\n\tpublic setChecked(val: boolean) {\n\t\tconst input = this.getSwitch();\n\t\tif (input)\n\t\t\tinput.checked = val;\n\t\tthis.updateLabel();\n\t}\n\n\tpublic isChecked(): boolean {\n\t\tconst input = this.getSwitch();\n\t\treturn input?.checked ?? false;\n\t}\n\n\tpublic onToggle(callback: (value: boolean)=>void) {\n\t\tthis.addEventListener(\"toggle\", (_: ToggleEvent) => callback(this.isChecked()));\n\t}\n\n\tprivate updateLabel() {\n\t\tif (this.label) {\n\t\t\tconst newLabel = this.getLabel();\n\t\t\tif (newLabel !== null)\n\t\t\t\tthis.label.replaceChildren((newLabel ?? '') as string);\n\t\t}\n\t}\n\n\tprotected override onDisplay(): void|Promise<void> {\n\t\tif (this.properties.ontoggle)\n\t\t\tthis.onToggle((e) => this.properties.ontoggle!(e));\n\t\tthis.getSwitch()?.addEventListener(\"input\", (e) => {\n\t\t\tthis.updateLabel();\n\t\t\te.stopImmediatePropagation();\n\t\t\tthis.dispatchEvent(new CustomEvent(\"toggle\", {\n\t\t\t\tdetail: {\n\t\t\t\t\tchecked: this.isChecked(),\n\t\t\t\t\toriginalEvent: e\n\t\t\t\t}\n\t\t\t}));\n\t\t});\n\t}\n}"],"names":["Component","label","template","size","id","crypto","randomUUID","checked","properties","div","class","stylesheet","for","getLabel","val","style","input","type","span","standalone","inheritedFields","ToggleSwitch","onCreate","Element","getSwitch","querySelector","HTMLElement","globalThis","Datex","Pointer","isChecked","undefined","on","off","setChecked","updateLabel","onToggle","callback","addEventListener","_","newLabel","replaceChildren","onDisplay","ontoggle","e","stopImmediatePropagation","dispatchEvent","CustomEvent","detail","originalEvent"],"mappings":"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","sourceRoot":"/lib/unyt-components-0.0.17/elements/toggle-switch/","file":"ToggleSwitch.tsx"}