smoothly 1.121.0 → 1.122.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/smoothly-app_99.cjs.entry.js +6 -6
- package/dist/cjs/smoothly-app_99.cjs.entry.js.map +1 -1
- package/dist/collection/components/input/range/demo/index.js +1 -1
- package/dist/collection/components/input/range/demo/index.js.map +1 -1
- package/dist/collection/components/input/range/index.js +4 -4
- package/dist/collection/components/input/range/index.js.map +1 -1
- package/dist/collection/components/input/range/style.css +1 -1
- package/dist/components/{p-C0Vb-3iG.js → p-B1VLjp0y.js} +2 -2
- package/dist/components/{p-DZ4052aB.js → p-BbtmZQlk.js} +2 -2
- package/dist/components/{p-BbI_Odg-.js → p-CDbQFx9i.js} +2 -2
- package/dist/components/{p-DUoSHWe1.js → p-CYxd1Pkd.js} +2 -2
- package/dist/components/{p-y6VfFBKz.js → p-CaQWZMN4.js} +2 -2
- package/dist/components/p-Cfvi2T1F.js +2 -0
- package/dist/components/{p-D97PTGAK.js.map → p-Cfvi2T1F.js.map} +1 -1
- package/dist/components/{p-ChiRe9cW.js → p-Ch1HU37X.js} +2 -2
- package/dist/components/{p-CM72sJqO.js → p-Ch5M1RA7.js} +2 -2
- package/dist/components/{p-CrDAs9xy.js → p-CsTmaH-Y.js} +2 -2
- package/dist/components/{p-j4UEmpTa.js → p-PwCtk_DY.js} +2 -2
- package/dist/components/{p-j4UEmpTa.js.map → p-PwCtk_DY.js.map} +1 -1
- package/dist/components/{p-BrBilp2f.js → p-WvQaS_J6.js} +2 -2
- package/dist/components/smoothly-app-demo.js +1 -1
- package/dist/components/smoothly-form-demo-all.js +1 -1
- package/dist/components/smoothly-form-demo-pet.js +1 -1
- package/dist/components/smoothly-form-demo.js +1 -1
- package/dist/components/smoothly-icon-demo.js +1 -1
- package/dist/components/smoothly-input-checkbox-demo.js +1 -1
- package/dist/components/smoothly-input-color-demo.js +1 -1
- package/dist/components/smoothly-input-color.js +1 -1
- package/dist/components/smoothly-input-demo-standard.js +1 -1
- package/dist/components/smoothly-input-demo-user-input.js +1 -1
- package/dist/components/smoothly-input-demo.js +1 -1
- package/dist/components/smoothly-input-range-demo.js +1 -1
- package/dist/components/smoothly-input-range.js +1 -1
- package/dist/esm/smoothly-app_99.entry.js +6 -6
- package/dist/esm/smoothly-app_99.entry.js.map +1 -1
- package/dist/smoothly/{p-baf5063c.entry.js → p-2ea46d26.entry.js} +2 -2
- package/dist/smoothly/{p-baf5063c.entry.js.map → p-2ea46d26.entry.js.map} +1 -1
- package/dist/smoothly/smoothly.esm.js +1 -1
- package/package.json +1 -1
- package/dist/components/p-D97PTGAK.js +0 -2
- /package/dist/components/{p-C0Vb-3iG.js.map → p-B1VLjp0y.js.map} +0 -0
- /package/dist/components/{p-DZ4052aB.js.map → p-BbtmZQlk.js.map} +0 -0
- /package/dist/components/{p-BbI_Odg-.js.map → p-CDbQFx9i.js.map} +0 -0
- /package/dist/components/{p-DUoSHWe1.js.map → p-CYxd1Pkd.js.map} +0 -0
- /package/dist/components/{p-y6VfFBKz.js.map → p-CaQWZMN4.js.map} +0 -0
- /package/dist/components/{p-ChiRe9cW.js.map → p-Ch1HU37X.js.map} +0 -0
- /package/dist/components/{p-CM72sJqO.js.map → p-Ch5M1RA7.js.map} +0 -0
- /package/dist/components/{p-CrDAs9xy.js.map → p-CsTmaH-Y.js.map} +0 -0
- /package/dist/components/{p-BrBilp2f.js.map → p-WvQaS_J6.js.map} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { h, Host } from "@stencil/core";
|
|
2
2
|
export class SmoothlyInputRangeDemo {
|
|
3
3
|
render() {
|
|
4
|
-
return (h(Host, { key: '850a5ea8cc3b512e2661333525b28eb5019287b3' }, h("h2", { key: '0a0f623f23a6739f5aeb96c4b5f1679e9e0fcb34' }, "Range"), h("h3", { key: '53535b3d6a89421a97851d0bd9fae947cc13b9ac' }, "Phone Number"), h("smoothly-input-range", { key: '87041e028b3e3679261c04f13a0a191f382a19a5', name: "first", min: 700000000, max: 799999999, step: 1, label: "Phone Number" }), h("h3", { key: '9875d80de18b17eca10c223004f8860e49057b8d' }, "Stars out of ten"), h("smoothly-input-range", { key: '45a7669fc4115edec078db9d7d02038f5ebd0b7d', name: "stars", max: 10, step: 1, label: "Stars" }), h("h3", { key: '7b0dfeef448af88731df524c2616062d97fade53' }, "Percent"), h("smoothly-input-range", { key: '16cc894decd70155beb121fd8ca3d6e4e743f3b3', name: "percent", type: "percent", max: 1, step: 0.01, label: "Percent" }), h("h3", { key: 'f71216975dea018c658b0501eb20cf266750e210' }, "With icon at start and clear button"), h("smoothly-input-range", { key: '2acb17d8d7173d3c8f2cbddf7b0626fba989fdb0', step: 1, name: "withClear", label: "Select" }, h("smoothly-icon", { key: '773be31ffa04141dac37b6a9b54fde28c1499cf2', name: "checkmark-circle", slot: "start" }), h("smoothly-input-clear", { key: 'c72262a6951103b03fa1af298a94152937e76338', size: "icon", slot: "end" })), h("h3", { key: 'de256bcef1e529daf7df1f49c5874def1e5e6248' }, "Dual (start / end)"), h("smoothly-input-range", { key: '0021e39e8db099b1afa54c9716e6923f535a2a05', dual: true, min: 90.86, max: 10000000, step: 1, name: "dualRange", label: "Range" }), h("h3", { key: 'add2d05dc7abb04da120eaea454b8ea2bd2cc552' }, "Dual percent"), h("smoothly-input-range", { key: '
|
|
4
|
+
return (h(Host, { key: '850a5ea8cc3b512e2661333525b28eb5019287b3' }, h("h2", { key: '0a0f623f23a6739f5aeb96c4b5f1679e9e0fcb34' }, "Range"), h("h3", { key: '53535b3d6a89421a97851d0bd9fae947cc13b9ac' }, "Phone Number"), h("smoothly-input-range", { key: '87041e028b3e3679261c04f13a0a191f382a19a5', name: "first", min: 700000000, max: 799999999, step: 1, label: "Phone Number" }), h("h3", { key: '9875d80de18b17eca10c223004f8860e49057b8d' }, "Stars out of ten"), h("smoothly-input-range", { key: '45a7669fc4115edec078db9d7d02038f5ebd0b7d', name: "stars", max: 10, step: 1, label: "Stars" }), h("h3", { key: '7b0dfeef448af88731df524c2616062d97fade53' }, "Percent"), h("smoothly-input-range", { key: '16cc894decd70155beb121fd8ca3d6e4e743f3b3', name: "percent", type: "percent", max: 1, step: 0.01, label: "Percent" }), h("h3", { key: 'f71216975dea018c658b0501eb20cf266750e210' }, "With icon at start and clear button"), h("smoothly-input-range", { key: '2acb17d8d7173d3c8f2cbddf7b0626fba989fdb0', step: 1, name: "withClear", label: "Select" }, h("smoothly-icon", { key: '773be31ffa04141dac37b6a9b54fde28c1499cf2', name: "checkmark-circle", slot: "start" }), h("smoothly-input-clear", { key: 'c72262a6951103b03fa1af298a94152937e76338', size: "icon", slot: "end" })), h("h3", { key: 'de256bcef1e529daf7df1f49c5874def1e5e6248' }, "Dual (start / end)"), h("smoothly-input-range", { key: '0021e39e8db099b1afa54c9716e6923f535a2a05', dual: true, min: 90.86, max: 10000000, step: 1, name: "dualRange", label: "Range" }), h("h3", { key: 'add2d05dc7abb04da120eaea454b8ea2bd2cc552' }, "Dual percent"), h("smoothly-input-range", { key: '199cdddf49337ffb96121ecc851e02523357007d', dual: true, name: "dualRangePercent", type: "percent", min: 0, max: 1, step: 0.01 }, h("smoothly-input-clear", { key: '7518efbb06a3c36182ddbfa8b22c8d3c960ef808', size: "icon", slot: "end" }))));
|
|
5
5
|
}
|
|
6
6
|
static get is() { return "smoothly-input-range-demo"; }
|
|
7
7
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/input/range/demo/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAKlD,MAAM,OAAO,sBAAsB;IAClC,MAAM;QACL,OAAO,CACN,EAAC,IAAI;YACJ,qEAAc;YACd,4EAAqB;YACrB,6EAAsB,IAAI,EAAC,OAAO,EAAC,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,cAAc,GAAI;YACrG,gFAAyB;YACzB,6EAAsB,IAAI,EAAC,OAAO,EAAC,GAAG,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,GAAI;YACvE,uEAAgB;YAChB,6EAAsB,IAAI,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,GAAI;YAC5F,mGAA4C;YAC5C,6EAAsB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,QAAQ;gBAC7D,sEAAe,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,OAAO,GAAG;gBACtD,6EAAsB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,GAAG,CACzB;YACvB,kFAA2B;YAC3B,6EAAsB,IAAI,QAAC,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,OAAO,GAAG;YAChG,4EAAqB;YACrB,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/input/range/demo/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAKlD,MAAM,OAAO,sBAAsB;IAClC,MAAM;QACL,OAAO,CACN,EAAC,IAAI;YACJ,qEAAc;YACd,4EAAqB;YACrB,6EAAsB,IAAI,EAAC,OAAO,EAAC,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,cAAc,GAAI;YACrG,gFAAyB;YACzB,6EAAsB,IAAI,EAAC,OAAO,EAAC,GAAG,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,GAAI;YACvE,uEAAgB;YAChB,6EAAsB,IAAI,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,GAAI;YAC5F,mGAA4C;YAC5C,6EAAsB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,QAAQ;gBAC7D,sEAAe,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,OAAO,GAAG;gBACtD,6EAAsB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,GAAG,CACzB;YACvB,kFAA2B;YAC3B,6EAAsB,IAAI,QAAC,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,OAAO,GAAG;YAChG,4EAAqB;YACrB,6EAAsB,IAAI,QAAC,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI;gBAC3F,6EAAsB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,GAAG,CACzB,CACjB,CACP,CAAA;IACF,CAAC;;CACD","sourcesContent":["import { Component, h, Host } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-input-range-demo\",\n})\nexport class SmoothlyInputRangeDemo {\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Range</h2>\n\t\t\t\t<h3>Phone Number</h3>\n\t\t\t\t<smoothly-input-range name=\"first\" min={700000000} max={799999999} step={1} label={\"Phone Number\"} />\n\t\t\t\t<h3>Stars out of ten</h3>\n\t\t\t\t<smoothly-input-range name=\"stars\" max={10} step={1} label={\"Stars\"} />\n\t\t\t\t<h3>Percent</h3>\n\t\t\t\t<smoothly-input-range name=\"percent\" type=\"percent\" max={1} step={0.01} label={\"Percent\"} />\n\t\t\t\t<h3>With icon at start and clear button</h3>\n\t\t\t\t<smoothly-input-range step={1} name=\"withClear\" label=\"Select\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t</smoothly-input-range>\n\t\t\t\t<h3>Dual (start / end)</h3>\n\t\t\t\t<smoothly-input-range dual min={90.86} max={10000000} step={1} name=\"dualRange\" label=\"Range\" />\n\t\t\t\t<h3>Dual percent</h3>\n\t\t\t\t<smoothly-input-range dual name=\"dualRangePercent\" type=\"percent\" min={0} max={1} step={0.01}>\n\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t</smoothly-input-range>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}
|
|
@@ -159,7 +159,7 @@ export class SmoothlyInputRange {
|
|
|
159
159
|
];
|
|
160
160
|
}
|
|
161
161
|
renderField(part, value) {
|
|
162
|
-
return (h("smoothly-input", { ref: e => (part == "start" ? (this.startInput = e) : (this.endInput = e)), class: part, color: this.color, name: `${this.name}-${part}`, showLabel: true, type: this.type, onSmoothlyBlur: e => (e.stopPropagation(), this.commitField(part)), onSmoothlyKeydown: e => void (e.detail.key == "Enter" && this.commitField(part)), onSmoothlyInput: e => e.stopPropagation(), onSmoothlyUserInput: e => e.stopPropagation(), value: this.type == "percent" ? value : value === null || value === void 0 ? void 0 : value.toString(), readonly: this.readonly, disabled: this.disabled, right: part == "start" }, part == "start" ? "From" : "To"));
|
|
162
|
+
return (h("smoothly-input", { ref: e => (part == "start" ? (this.startInput = e) : (this.endInput = e)), class: part, color: this.color, name: `${this.name}-${part}`, showLabel: true, type: this.type, onSmoothlyBlur: e => (e.stopPropagation(), this.commitField(part)), onSmoothlyKeydown: e => void (e.detail.key == "Enter" && this.commitField(part)), onSmoothlyInput: e => e.stopPropagation(), onSmoothlyUserInput: e => e.stopPropagation(), value: this.type == "percent" ? value : value === null || value === void 0 ? void 0 : value.toString(), readonly: this.readonly, disabled: this.disabled, right: part == "start" }, `${this.label ? this.label : ""} ${part == "start" ? "From" : "To"}`));
|
|
163
163
|
}
|
|
164
164
|
renderRangeInput(part, value) {
|
|
165
165
|
var _a;
|
|
@@ -179,11 +179,11 @@ export class SmoothlyInputRange {
|
|
|
179
179
|
}, value: value !== null && value !== void 0 ? value : (part == "start" ? this.min : this.max) }));
|
|
180
180
|
}
|
|
181
181
|
render() {
|
|
182
|
-
return (h(Host, { key: '
|
|
182
|
+
return (h(Host, { key: '7e69877d633e5cd9052202f8e556018053101b34', class: {
|
|
183
183
|
"output-side-right": this.outputSide === "right",
|
|
184
|
-
"show-label": this.outputSide === "left" && !!this.label,
|
|
184
|
+
"show-label": this.dual || (this.outputSide === "left" && !!this.label),
|
|
185
185
|
dual: this.dual,
|
|
186
|
-
} }, h("slot", { key: '
|
|
186
|
+
} }, h("slot", { key: 'dc821324171d047270222d1b127887f28311fe5b', name: "start" }), h("div", { key: '29c8fc53b306df07ed0781a4fb8f8650a8f04d45' }, h("label", { key: '44505c248cff4062e54c1383cebdec3c2dd3ac5f', htmlFor: this.name }, this.label), this.dual ? this.renderDual() : this.renderSingle()), h("slot", { key: 'd65e624e57acc9da5b14409d5ffe2bb1717449fd', name: "end" })));
|
|
187
187
|
}
|
|
188
188
|
static get is() { return "smoothly-input-range"; }
|
|
189
189
|
static get encapsulation() { return "scoped"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/range/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tComponent,\n\tComponentWillLoad,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tMethod,\n\tProp,\n\tState,\n\tVNode,\n\tWatch,\n} from \"@stencil/core\"\nimport { tidily } from \"tidily\"\nimport { Color } from \"../../../model\"\nimport { Clearable } from \"../Clearable\"\nimport { Editable } from \"../Editable\"\nimport { Input } from \"../Input\"\nimport { Looks } from \"../Looks\"\nimport { Range } from \"./Range\"\n\n@Component({\n\ttag: \"smoothly-input-range\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputRange implements Input, Clearable, Editable, ComponentWillLoad {\n\tparent: Editable | undefined\n\tisDifferentFromInitial = false\n\tprivate observer = Editable.Observer.create(this)\n\tprivate input?: HTMLSmoothlyInputElement\n\tprivate startInput?: HTMLSmoothlyInputElement\n\tprivate endInput?: HTMLSmoothlyInputElement\n\tprivate initialValue: Range.Value | undefined = undefined\n\tprivate sliding = false\n\t@Element() element: HTMLSmoothlyInputRangeElement\n\t@Prop({ mutable: true }) value: Range.Value | undefined = undefined\n\t@Prop() dual = false\n\t@Prop({ reflect: true, mutable: true }) looks?: Looks\n\t@Prop({ reflect: true, mutable: true }) color?: Color\n\t@Prop({ mutable: true }) defined = false\n\t@Prop({ reflect: true, mutable: true }) readonly = false\n\t@Prop({ reflect: true }) disabled?: boolean\n\t@Prop() type: Extract<tidily.Type, \"text\" | \"percent\"> = \"text\"\n\t@Prop() min = 0\n\t@Prop() max = 100\n\t@Prop({ reflect: true }) name = \"range\"\n\t@Prop() step?: number\n\t@Prop() outputSide: \"right\" | \"left\" = \"left\"\n\t@Prop() label: string\n\t@State() showInput = false\n\t@Event() smoothlyInputLooks: EventEmitter<(looks?: Looks, color?: Color) => void>\n\t@Event() smoothlyInput: EventEmitter<Record<string, any>>\n\t@Event() smoothlyUserInput: EventEmitter<Input.UserInput>\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: Editable) => void>\n\t@Event() smoothlyFormDisable: EventEmitter<(disabled: boolean) => void>\n\tcomponentWillLoad(): void | Promise<void> {\n\t\tthis.smoothlyInputLooks.emit((looks, color) => ((this.looks = this.looks ?? looks), (this.color = color)))\n\t\tthis.smoothlyInputLoad.emit(parent => (this.parent = parent))\n\t\t!this.readonly && this.smoothlyFormDisable.emit(readonly => (this.readonly = readonly))\n\t\tif (this.dual && !Range.is(this.value)) {\n\t\t\tthis.initialValue = { start: this.min, end: this.max }\n\t\t\tthis.value = this.initialValue\n\t\t} else {\n\t\t\tthis.value && (this.initialValue = this.value)\n\t\t\tthis.valueChanged()\n\t\t}\n\t}\n\t@Listen(\"smoothlyInputLoad\")\n\tsmoothlyInputLoadHandler(event: CustomEvent<(parent: SmoothlyInputRange) => void>) {\n\t\tInput.registerSubAction(this, event)\n\t}\n\t@Listen(\"smoothlyInputLooks\")\n\tsmoothlyInputLooksHandler(event: CustomEvent<(looks: Looks) => void>): void {\n\t\tif (event.target != this.element) {\n\t\t\tevent.stopPropagation()\n\t\t}\n\t}\n\tasync disconnectedCallback() {\n\t\tif (!this.element.isConnected) {\n\t\t\tawait this.unregister()\n\t\t}\n\t}\n\t@Watch(\"name\")\n\tnameChange(_: string | undefined, oldName: string | undefined) {\n\t\tInput.formRename(this, oldName)\n\t}\n\t@Method()\n\tasync register() {\n\t\tInput.formAdd(this)\n\t}\n\t@Method()\n\tasync unregister() {\n\t\tInput.formRemove(this)\n\t}\n\t@Method()\n\tasync getValue(): Promise<Range.Value | undefined> {\n\t\treturn this.value\n\t}\n\t@Method()\n\tasync clear(): Promise<void> {\n\t\tthis.value = undefined\n\t}\n\t@Method()\n\tasync listen(listener: Editable.Observer.Listener): Promise<void> {\n\t\tthis.observer.subscribe(listener)\n\t}\n\t@Method()\n\tasync edit(editable: boolean): Promise<void> {\n\t\tthis.readonly = !editable\n\t}\n\t@Method()\n\tasync reset(): Promise<void> {\n\t\tthis.value = this.initialValue\n\t}\n\t@Method()\n\tasync setInitialValue(): Promise<void> {\n\t\tthis.initialValue = this.value\n\t\tthis.isDifferentFromInitial = false\n\t\tthis.valueChanged()\n\t}\n\t@Watch(\"value\")\n\tvalueChanged(): void {\n\t\tconst normalized = Range.normalize(this.value, this.step)\n\t\tif (!Range.equals(normalized, this.value)) {\n\t\t\tthis.value = normalized\n\t\t\treturn\n\t\t}\n\t\tthis.isDifferentFromInitial = !Range.equals(this.initialValue, this.value)\n\t\tthis.defined = Range.defined(this.value)\n\t\tif (!this.sliding) {\n\t\t\tthis.observer.publish()\n\t\t\tthis.smoothlyInput.emit({ [this.name]: this.value })\n\t\t}\n\t}\n\t@Watch(\"disabled\")\n\t@Watch(\"readonly\")\n\twatchingReadonly(): void {\n\t\tthis.observer.publish()\n\t}\n\tsetValue(value: number | undefined): void {\n\t\tif (value == undefined || Number.isNaN(value)) {\n\t\t\tthis.value = undefined\n\t\t} else if (value < this.min) {\n\t\t\tthis.value = this.min\n\t\t} else if (value > this.max) {\n\t\t\tthis.value = this.max\n\t\t} else {\n\t\t\tthis.value = value\n\t\t}\n\t\tthis.input && (this.input.value = this.type == \"text\" ? (this.value as number)?.toString() : (this.value as number))\n\t}\n\tsetRange(part: \"start\" | \"end\", value: number | undefined): void {\n\t\tconst current = Range.is(this.value) ? this.value : { start: this.min, end: this.max }\n\t\tconst resolved = value == undefined || Number.isNaN(value) ? (part == \"start\" ? this.min : this.max) : value\n\t\tconst next = Range.setPart(current, part, resolved, this.min, this.max)\n\t\tif (Range.equals(next, this.value)) {\n\t\t\treturn\n\t\t}\n\t\tthis.value = next\n\t\tconst field = part == \"start\" ? this.startInput : this.endInput\n\t\tconst bound = next[part]\n\t\tfield && (field.value = this.type == \"text\" ? bound.toString() : bound)\n\t\t!this.sliding && this.smoothlyUserInput.emit({ name: this.name, value: this.value })\n\t}\n\tprivate async commitField(part: \"start\" | \"end\"): Promise<void> {\n\t\tconst field = part == \"start\" ? this.startInput : this.endInput\n\t\tthis.setRange(part, field ? Number(await field.getValue()) : undefined)\n\t\tconst bound = Range.is(this.value) ? this.value[part] : undefined\n\t\tfield?.setValue(this.type == \"text\" ? bound?.toString() : bound)\n\t}\n\n\tprivate renderSingle(): VNode[] {\n\t\treturn [\n\t\t\t<smoothly-input\n\t\t\t\tref={e => (this.input = e)}\n\t\t\t\tlooks={undefined}\n\t\t\t\tcolor={this.color}\n\t\t\t\tname={this.name}\n\t\t\t\tshowLabel={this.outputSide === \"left\" && !!this.label}\n\t\t\t\ttype={this.type}\n\t\t\t\tonSmoothlyInputLoad={async e => (\n\t\t\t\t\te.stopPropagation(),\n\t\t\t\t\tthis.setValue(Input.Element.is(e.target) ? Number(await e.target.getValue()) : undefined)\n\t\t\t\t)}\n\t\t\t\tonSmoothlyBlur={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyInput={async e => {\n\t\t\t\t\te.stopPropagation()\n\t\t\t\t\tthis.setValue(Input.Element.is(e.target) ? Number(await e.target.getValue()) : undefined)\n\t\t\t\t}}\n\t\t\t\tvalue={this.type == \"percent\" ? (this.value as number) : (this.value as number)?.toString()}\n\t\t\t\tplaceholder={this.outputSide === \"right\" ? \"-\" : undefined}\n\t\t\t\treadonly={this.readonly}\n\t\t\t\tdisabled={this.disabled}>\n\t\t\t\t{this.label}\n\t\t\t</smoothly-input>,\n\t\t\t<smoothly-display label={(this.type == \"percent\" ? this.min * 100 : this.min).toString()} />,\n\t\t\t<input\n\t\t\t\tname={this.name}\n\t\t\t\tpart=\"range\"\n\t\t\t\ttype=\"range\"\n\t\t\t\tmin={this.min}\n\t\t\t\tmax={this.max}\n\t\t\t\tstep={this.step ?? \"any\"}\n\t\t\t\tdisabled={this.readonly || this.disabled}\n\t\t\t\tonInput={event => {\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tthis.sliding = true\n\t\t\t\t\tthis.setValue((event.target as HTMLInputElement).valueAsNumber)\n\t\t\t\t}}\n\t\t\t\tonChange={event => {\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tthis.sliding = false\n\t\t\t\t\tthis.observer.publish()\n\t\t\t\t\tthis.smoothlyInput.emit({ [this.name]: this.value })\n\t\t\t\t\tthis.smoothlyUserInput.emit({ name: this.name, value: this.value })\n\t\t\t\t}}\n\t\t\t\tvalue={(this.value as number) ?? this.min}\n\t\t\t/>,\n\t\t\t<smoothly-display label={(this.type == \"percent\" ? this.max * 100 : this.max).toString()} />,\n\t\t]\n\t}\n\tprivate renderDual(): VNode[] {\n\t\tconst range = Range.is(this.value) ? this.value : { start: this.min, end: this.max }\n\t\tconst left = Range.percent(range.start, this.min, this.max)\n\t\tconst right = 100 - Range.percent(range.end, this.min, this.max)\n\t\treturn [\n\t\t\tthis.renderField(\"start\", range.start),\n\t\t\t<div class=\"track\" part=\"track\">\n\t\t\t\t<div class=\"fill\" part=\"fill\" style={{ left: `${left}%`, right: `${right}%` }} />\n\t\t\t\t{this.renderRangeInput(\"start\", range.start)}\n\t\t\t\t{this.renderRangeInput(\"end\", range.end)}\n\t\t\t</div>,\n\t\t\tthis.renderField(\"end\", range.end),\n\t\t]\n\t}\n\tprivate renderField(part: \"start\" | \"end\", value: number): VNode {\n\t\treturn (\n\t\t\t<smoothly-input\n\t\t\t\tref={e => (part == \"start\" ? (this.startInput = e) : (this.endInput = e))}\n\t\t\t\tclass={part}\n\t\t\t\tcolor={this.color}\n\t\t\t\tname={`${this.name}-${part}`}\n\t\t\t\tshowLabel={true}\n\t\t\t\ttype={this.type}\n\t\t\t\tonSmoothlyBlur={e => (e.stopPropagation(), this.commitField(part))}\n\t\t\t\tonSmoothlyKeydown={e => void (e.detail.key == \"Enter\" && this.commitField(part))}\n\t\t\t\tonSmoothlyInput={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyUserInput={e => e.stopPropagation()}\n\t\t\t\tvalue={this.type == \"percent\" ? value : value?.toString()}\n\t\t\t\treadonly={this.readonly}\n\t\t\t\tdisabled={this.disabled}\n\t\t\t\tright={part == \"start\"}>\n\t\t\t\t{part == \"start\" ? \"From\" : \"To\"}\n\t\t\t</smoothly-input>\n\t\t)\n\t}\n\tprivate renderRangeInput(part: \"start\" | \"end\", value: number): VNode {\n\t\treturn (\n\t\t\t<input\n\t\t\t\tpart={part == \"start\" ? \"range range-start\" : \"range range-end\"}\n\t\t\t\ttype=\"range\"\n\t\t\t\tmin={this.min}\n\t\t\t\tmax={this.max}\n\t\t\t\tstep={this.step ?? \"any\"}\n\t\t\t\tdisabled={this.readonly || this.disabled}\n\t\t\t\tonInput={event => {\n\t\t\t\t\tconst input = event.target as HTMLInputElement\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tthis.sliding = true\n\t\t\t\t\tthis.setRange(part, input.valueAsNumber)\n\t\t\t\t\tconst bound = Range.is(this.value) ? this.value[part] : undefined\n\t\t\t\t\tbound != undefined && (input.value = String(bound))\n\t\t\t\t}}\n\t\t\t\tonChange={event => {\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tthis.sliding = false\n\t\t\t\t\tthis.observer.publish()\n\t\t\t\t\tthis.smoothlyInput.emit({ [this.name]: this.value })\n\t\t\t\t\tthis.smoothlyUserInput.emit({ name: this.name, value: this.value })\n\t\t\t\t}}\n\t\t\t\tvalue={value ?? (part == \"start\" ? this.min : this.max)}\n\t\t\t/>\n\t\t)\n\t}\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t\"output-side-right\": this.outputSide === \"right\",\n\t\t\t\t\t\"show-label\": this.outputSide === \"left\" && !!this.label,\n\t\t\t\t\tdual: this.dual,\n\t\t\t\t}}>\n\t\t\t\t<slot name=\"start\" />\n\t\t\t\t<div>\n\t\t\t\t\t<label htmlFor={this.name}>{this.label}</label>\n\t\t\t\t\t{this.dual ? this.renderDual() : this.renderSingle()}\n\t\t\t\t</div>\n\t\t\t\t<slot name=\"end\" />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/range/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n\tComponent,\n\tComponentWillLoad,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tMethod,\n\tProp,\n\tState,\n\tVNode,\n\tWatch,\n} from \"@stencil/core\"\nimport { tidily } from \"tidily\"\nimport { Color } from \"../../../model\"\nimport { Clearable } from \"../Clearable\"\nimport { Editable } from \"../Editable\"\nimport { Input } from \"../Input\"\nimport { Looks } from \"../Looks\"\nimport { Range } from \"./Range\"\n\n@Component({\n\ttag: \"smoothly-input-range\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputRange implements Input, Clearable, Editable, ComponentWillLoad {\n\tparent: Editable | undefined\n\tisDifferentFromInitial = false\n\tprivate observer = Editable.Observer.create(this)\n\tprivate input?: HTMLSmoothlyInputElement\n\tprivate startInput?: HTMLSmoothlyInputElement\n\tprivate endInput?: HTMLSmoothlyInputElement\n\tprivate initialValue: Range.Value | undefined = undefined\n\tprivate sliding = false\n\t@Element() element: HTMLSmoothlyInputRangeElement\n\t@Prop({ mutable: true }) value: Range.Value | undefined = undefined\n\t@Prop() dual = false\n\t@Prop({ reflect: true, mutable: true }) looks?: Looks\n\t@Prop({ reflect: true, mutable: true }) color?: Color\n\t@Prop({ mutable: true }) defined = false\n\t@Prop({ reflect: true, mutable: true }) readonly = false\n\t@Prop({ reflect: true }) disabled?: boolean\n\t@Prop() type: Extract<tidily.Type, \"text\" | \"percent\"> = \"text\"\n\t@Prop() min = 0\n\t@Prop() max = 100\n\t@Prop({ reflect: true }) name = \"range\"\n\t@Prop() step?: number\n\t@Prop() outputSide: \"right\" | \"left\" = \"left\"\n\t@Prop() label: string\n\t@State() showInput = false\n\t@Event() smoothlyInputLooks: EventEmitter<(looks?: Looks, color?: Color) => void>\n\t@Event() smoothlyInput: EventEmitter<Record<string, any>>\n\t@Event() smoothlyUserInput: EventEmitter<Input.UserInput>\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: Editable) => void>\n\t@Event() smoothlyFormDisable: EventEmitter<(disabled: boolean) => void>\n\tcomponentWillLoad(): void | Promise<void> {\n\t\tthis.smoothlyInputLooks.emit((looks, color) => ((this.looks = this.looks ?? looks), (this.color = color)))\n\t\tthis.smoothlyInputLoad.emit(parent => (this.parent = parent))\n\t\t!this.readonly && this.smoothlyFormDisable.emit(readonly => (this.readonly = readonly))\n\t\tif (this.dual && !Range.is(this.value)) {\n\t\t\tthis.initialValue = { start: this.min, end: this.max }\n\t\t\tthis.value = this.initialValue\n\t\t} else {\n\t\t\tthis.value && (this.initialValue = this.value)\n\t\t\tthis.valueChanged()\n\t\t}\n\t}\n\t@Listen(\"smoothlyInputLoad\")\n\tsmoothlyInputLoadHandler(event: CustomEvent<(parent: SmoothlyInputRange) => void>) {\n\t\tInput.registerSubAction(this, event)\n\t}\n\t@Listen(\"smoothlyInputLooks\")\n\tsmoothlyInputLooksHandler(event: CustomEvent<(looks: Looks) => void>): void {\n\t\tif (event.target != this.element) {\n\t\t\tevent.stopPropagation()\n\t\t}\n\t}\n\tasync disconnectedCallback() {\n\t\tif (!this.element.isConnected) {\n\t\t\tawait this.unregister()\n\t\t}\n\t}\n\t@Watch(\"name\")\n\tnameChange(_: string | undefined, oldName: string | undefined) {\n\t\tInput.formRename(this, oldName)\n\t}\n\t@Method()\n\tasync register() {\n\t\tInput.formAdd(this)\n\t}\n\t@Method()\n\tasync unregister() {\n\t\tInput.formRemove(this)\n\t}\n\t@Method()\n\tasync getValue(): Promise<Range.Value | undefined> {\n\t\treturn this.value\n\t}\n\t@Method()\n\tasync clear(): Promise<void> {\n\t\tthis.value = undefined\n\t}\n\t@Method()\n\tasync listen(listener: Editable.Observer.Listener): Promise<void> {\n\t\tthis.observer.subscribe(listener)\n\t}\n\t@Method()\n\tasync edit(editable: boolean): Promise<void> {\n\t\tthis.readonly = !editable\n\t}\n\t@Method()\n\tasync reset(): Promise<void> {\n\t\tthis.value = this.initialValue\n\t}\n\t@Method()\n\tasync setInitialValue(): Promise<void> {\n\t\tthis.initialValue = this.value\n\t\tthis.isDifferentFromInitial = false\n\t\tthis.valueChanged()\n\t}\n\t@Watch(\"value\")\n\tvalueChanged(): void {\n\t\tconst normalized = Range.normalize(this.value, this.step)\n\t\tif (!Range.equals(normalized, this.value)) {\n\t\t\tthis.value = normalized\n\t\t\treturn\n\t\t}\n\t\tthis.isDifferentFromInitial = !Range.equals(this.initialValue, this.value)\n\t\tthis.defined = Range.defined(this.value)\n\t\tif (!this.sliding) {\n\t\t\tthis.observer.publish()\n\t\t\tthis.smoothlyInput.emit({ [this.name]: this.value })\n\t\t}\n\t}\n\t@Watch(\"disabled\")\n\t@Watch(\"readonly\")\n\twatchingReadonly(): void {\n\t\tthis.observer.publish()\n\t}\n\tsetValue(value: number | undefined): void {\n\t\tif (value == undefined || Number.isNaN(value)) {\n\t\t\tthis.value = undefined\n\t\t} else if (value < this.min) {\n\t\t\tthis.value = this.min\n\t\t} else if (value > this.max) {\n\t\t\tthis.value = this.max\n\t\t} else {\n\t\t\tthis.value = value\n\t\t}\n\t\tthis.input && (this.input.value = this.type == \"text\" ? (this.value as number)?.toString() : (this.value as number))\n\t}\n\tsetRange(part: \"start\" | \"end\", value: number | undefined): void {\n\t\tconst current = Range.is(this.value) ? this.value : { start: this.min, end: this.max }\n\t\tconst resolved = value == undefined || Number.isNaN(value) ? (part == \"start\" ? this.min : this.max) : value\n\t\tconst next = Range.setPart(current, part, resolved, this.min, this.max)\n\t\tif (Range.equals(next, this.value)) {\n\t\t\treturn\n\t\t}\n\t\tthis.value = next\n\t\tconst field = part == \"start\" ? this.startInput : this.endInput\n\t\tconst bound = next[part]\n\t\tfield && (field.value = this.type == \"text\" ? bound.toString() : bound)\n\t\t!this.sliding && this.smoothlyUserInput.emit({ name: this.name, value: this.value })\n\t}\n\tprivate async commitField(part: \"start\" | \"end\"): Promise<void> {\n\t\tconst field = part == \"start\" ? this.startInput : this.endInput\n\t\tthis.setRange(part, field ? Number(await field.getValue()) : undefined)\n\t\tconst bound = Range.is(this.value) ? this.value[part] : undefined\n\t\tfield?.setValue(this.type == \"text\" ? bound?.toString() : bound)\n\t}\n\n\tprivate renderSingle(): VNode[] {\n\t\treturn [\n\t\t\t<smoothly-input\n\t\t\t\tref={e => (this.input = e)}\n\t\t\t\tlooks={undefined}\n\t\t\t\tcolor={this.color}\n\t\t\t\tname={this.name}\n\t\t\t\tshowLabel={this.outputSide === \"left\" && !!this.label}\n\t\t\t\ttype={this.type}\n\t\t\t\tonSmoothlyInputLoad={async e => (\n\t\t\t\t\te.stopPropagation(),\n\t\t\t\t\tthis.setValue(Input.Element.is(e.target) ? Number(await e.target.getValue()) : undefined)\n\t\t\t\t)}\n\t\t\t\tonSmoothlyBlur={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyInput={async e => {\n\t\t\t\t\te.stopPropagation()\n\t\t\t\t\tthis.setValue(Input.Element.is(e.target) ? Number(await e.target.getValue()) : undefined)\n\t\t\t\t}}\n\t\t\t\tvalue={this.type == \"percent\" ? (this.value as number) : (this.value as number)?.toString()}\n\t\t\t\tplaceholder={this.outputSide === \"right\" ? \"-\" : undefined}\n\t\t\t\treadonly={this.readonly}\n\t\t\t\tdisabled={this.disabled}>\n\t\t\t\t{this.label}\n\t\t\t</smoothly-input>,\n\t\t\t<smoothly-display label={(this.type == \"percent\" ? this.min * 100 : this.min).toString()} />,\n\t\t\t<input\n\t\t\t\tname={this.name}\n\t\t\t\tpart=\"range\"\n\t\t\t\ttype=\"range\"\n\t\t\t\tmin={this.min}\n\t\t\t\tmax={this.max}\n\t\t\t\tstep={this.step ?? \"any\"}\n\t\t\t\tdisabled={this.readonly || this.disabled}\n\t\t\t\tonInput={event => {\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tthis.sliding = true\n\t\t\t\t\tthis.setValue((event.target as HTMLInputElement).valueAsNumber)\n\t\t\t\t}}\n\t\t\t\tonChange={event => {\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tthis.sliding = false\n\t\t\t\t\tthis.observer.publish()\n\t\t\t\t\tthis.smoothlyInput.emit({ [this.name]: this.value })\n\t\t\t\t\tthis.smoothlyUserInput.emit({ name: this.name, value: this.value })\n\t\t\t\t}}\n\t\t\t\tvalue={(this.value as number) ?? this.min}\n\t\t\t/>,\n\t\t\t<smoothly-display label={(this.type == \"percent\" ? this.max * 100 : this.max).toString()} />,\n\t\t]\n\t}\n\tprivate renderDual(): VNode[] {\n\t\tconst range = Range.is(this.value) ? this.value : { start: this.min, end: this.max }\n\t\tconst left = Range.percent(range.start, this.min, this.max)\n\t\tconst right = 100 - Range.percent(range.end, this.min, this.max)\n\t\treturn [\n\t\t\tthis.renderField(\"start\", range.start),\n\t\t\t<div class=\"track\" part=\"track\">\n\t\t\t\t<div class=\"fill\" part=\"fill\" style={{ left: `${left}%`, right: `${right}%` }} />\n\t\t\t\t{this.renderRangeInput(\"start\", range.start)}\n\t\t\t\t{this.renderRangeInput(\"end\", range.end)}\n\t\t\t</div>,\n\t\t\tthis.renderField(\"end\", range.end),\n\t\t]\n\t}\n\tprivate renderField(part: \"start\" | \"end\", value: number): VNode {\n\t\treturn (\n\t\t\t<smoothly-input\n\t\t\t\tref={e => (part == \"start\" ? (this.startInput = e) : (this.endInput = e))}\n\t\t\t\tclass={part}\n\t\t\t\tcolor={this.color}\n\t\t\t\tname={`${this.name}-${part}`}\n\t\t\t\tshowLabel={true}\n\t\t\t\ttype={this.type}\n\t\t\t\tonSmoothlyBlur={e => (e.stopPropagation(), this.commitField(part))}\n\t\t\t\tonSmoothlyKeydown={e => void (e.detail.key == \"Enter\" && this.commitField(part))}\n\t\t\t\tonSmoothlyInput={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyUserInput={e => e.stopPropagation()}\n\t\t\t\tvalue={this.type == \"percent\" ? value : value?.toString()}\n\t\t\t\treadonly={this.readonly}\n\t\t\t\tdisabled={this.disabled}\n\t\t\t\tright={part == \"start\"}>\n\t\t\t\t{`${this.label ? this.label : \"\"} ${part == \"start\" ? \"From\" : \"To\"}`}\n\t\t\t</smoothly-input>\n\t\t)\n\t}\n\tprivate renderRangeInput(part: \"start\" | \"end\", value: number): VNode {\n\t\treturn (\n\t\t\t<input\n\t\t\t\tpart={part == \"start\" ? \"range range-start\" : \"range range-end\"}\n\t\t\t\ttype=\"range\"\n\t\t\t\tmin={this.min}\n\t\t\t\tmax={this.max}\n\t\t\t\tstep={this.step ?? \"any\"}\n\t\t\t\tdisabled={this.readonly || this.disabled}\n\t\t\t\tonInput={event => {\n\t\t\t\t\tconst input = event.target as HTMLInputElement\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tthis.sliding = true\n\t\t\t\t\tthis.setRange(part, input.valueAsNumber)\n\t\t\t\t\tconst bound = Range.is(this.value) ? this.value[part] : undefined\n\t\t\t\t\tbound != undefined && (input.value = String(bound))\n\t\t\t\t}}\n\t\t\t\tonChange={event => {\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tthis.sliding = false\n\t\t\t\t\tthis.observer.publish()\n\t\t\t\t\tthis.smoothlyInput.emit({ [this.name]: this.value })\n\t\t\t\t\tthis.smoothlyUserInput.emit({ name: this.name, value: this.value })\n\t\t\t\t}}\n\t\t\t\tvalue={value ?? (part == \"start\" ? this.min : this.max)}\n\t\t\t/>\n\t\t)\n\t}\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={{\n\t\t\t\t\t\"output-side-right\": this.outputSide === \"right\",\n\t\t\t\t\t\"show-label\": this.dual || (this.outputSide === \"left\" && !!this.label),\n\t\t\t\t\tdual: this.dual,\n\t\t\t\t}}>\n\t\t\t\t<slot name=\"start\" />\n\t\t\t\t<div>\n\t\t\t\t\t<label htmlFor={this.name}>{this.label}</label>\n\t\t\t\t\t{this.dual ? this.renderDual() : this.renderSingle()}\n\t\t\t\t</div>\n\t\t\t\t<slot name=\"end\" />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as o,H as s,h as t,d as e,t as m}from"./p-BsZrGTcp.js";import{d as a}from"./p-CN3iME9d.js";import{d as r}from"./p-DG2pfnCV.js";import{d as l}from"./p-uFR5K4vd.js";import{d as i}from"./p-DvZK__s-.js";import{d as c}from"./p-F8qX8ZuL.js";import{d as p}from"./p-DFSiKg4M.js";import{d as n}from"./p-o8kM0Soe.js";import{d as y}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{p as o,H as s,h as t,d as e,t as m}from"./p-BsZrGTcp.js";import{d as a}from"./p-CN3iME9d.js";import{d as r}from"./p-DG2pfnCV.js";import{d as l}from"./p-uFR5K4vd.js";import{d as i}from"./p-DvZK__s-.js";import{d as c}from"./p-F8qX8ZuL.js";import{d as p}from"./p-DFSiKg4M.js";import{d as n}from"./p-o8kM0Soe.js";import{d as y}from"./p-CaQWZMN4.js";import{d}from"./p-PwCtk_DY.js";import{d as f}from"./p-BsHachOX.js";const u=o(class o extends s{constructor(o){super();if(o!==false){this.__registerHost()}}render(){return t(e,{key:"9ad04e1aa481ec3ad05d6487a25ab69202d2a8bf"},t("h2",{key:"cc47b241d3bb3e43752a3b0ec2e72144b2955bfa"},"Color"),t("smoothly-input-color",{key:"db081098c0eb29a73c9a708df96b48fd77425796",name:"color"},"Choose color"))}static get style(){return`style.css`}},[0,"smoothly-input-color-demo"]);function h(){if(typeof customElements==="undefined"){return}const o=["smoothly-input-color-demo","smoothly-display","smoothly-display-json","smoothly-display-json-object","smoothly-display-json-primitive","smoothly-display-json-record-key","smoothly-icon","smoothly-input","smoothly-input-color","smoothly-input-range","smoothly-toggle-switch"];o.forEach((o=>{switch(o){case"smoothly-input-color-demo":if(!customElements.get(m(o))){customElements.define(m(o),u)}break;case"smoothly-display":if(!customElements.get(m(o))){a()}break;case"smoothly-display-json":if(!customElements.get(m(o))){r()}break;case"smoothly-display-json-object":if(!customElements.get(m(o))){l()}break;case"smoothly-display-json-primitive":if(!customElements.get(m(o))){i()}break;case"smoothly-display-json-record-key":if(!customElements.get(m(o))){c()}break;case"smoothly-icon":if(!customElements.get(m(o))){p()}break;case"smoothly-input":if(!customElements.get(m(o))){n()}break;case"smoothly-input-color":if(!customElements.get(m(o))){y()}break;case"smoothly-input-range":if(!customElements.get(m(o))){d()}break;case"smoothly-toggle-switch":if(!customElements.get(m(o))){f()}break}}))}h();export{u as S,h as d};
|
|
2
|
+
//# sourceMappingURL=p-B1VLjp0y.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as o,H as e,c as s,h as t,F as a,d as l,t as m}from"./p-BsZrGTcp.js";import{I as c,C as i,F as d}from"./p-Br0kWrBT.js";import"./p-BVKhAhsB.js";import{N as r}from"./p-Bq3C8g8G.js";import"./p-DoFURPl2.js";import{d as n}from"./p-mmAi00ak.js";import{d as y}from"./p-CN3iME9d.js";import{d as f}from"./p-DG2pfnCV.js";import{d as h}from"./p-uFR5K4vd.js";import{d as b}from"./p-DvZK__s-.js";import{d as p}from"./p-F8qX8ZuL.js";import{d as u}from"./p-vvQg46ti.js";import{d as k}from"./p-DFSiKg4M.js";import{d as g}from"./p-o8kM0Soe.js";import{d as v}from"./p-BX-sEZyq.js";import{d as j}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{p as o,H as e,c as s,h as t,F as a,d as l,t as m}from"./p-BsZrGTcp.js";import{I as c,C as i,F as d}from"./p-Br0kWrBT.js";import"./p-BVKhAhsB.js";import{N as r}from"./p-Bq3C8g8G.js";import"./p-DoFURPl2.js";import{d as n}from"./p-mmAi00ak.js";import{d as y}from"./p-CN3iME9d.js";import{d as f}from"./p-DG2pfnCV.js";import{d as h}from"./p-uFR5K4vd.js";import{d as b}from"./p-DvZK__s-.js";import{d as p}from"./p-F8qX8ZuL.js";import{d as u}from"./p-vvQg46ti.js";import{d as k}from"./p-DFSiKg4M.js";import{d as g}from"./p-o8kM0Soe.js";import{d as v}from"./p-BX-sEZyq.js";import{d as j}from"./p-PwCtk_DY.js";import{d as E}from"./p-BplZiuMF.js";import{d as $}from"./p-CVdJ19AA.js";import{d as C}from"./p-DvOr53No.js";const F=()=>`.sc-smoothly-icon-demo-h{display:block;width:clamp(200px, 100%, 1200px);margin:auto}[hidden].sc-smoothly-icon-demo-h{display:none}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo{display:flex;flex-flow:row wrap}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo{padding:1rem;position:relative}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo:hover{scale:1.5}.sc-smoothly-icon-demo-h>div.sc-smoothly-icon-demo>smoothly-icon.sc-smoothly-icon-demo:hover::after{content:attr(data-name);position:absolute;white-space:nowrap;bottom:100%;background:rgb(var(--smoothly-default-contrast));color:rgb(var(--smoothly-default-color));padding:0.25rem 1rem;z-index:1;pointer-events:none}`;const x=o(class o extends e{constructor(o){super();if(o!==false){this.__registerHost()}this.notice=s(this,"notice");this.page=0;this.display={};this.props={}}render(){return t(l,{key:"8fbea784d2ed3e61eed53bbde4bf62acd7c00c33"},t("h2",{key:"e0ffda5c80cffb4a5819b69889980d43dc873c5c"},"Filter and Variants"),t("smoothly-form",{key:"9734546f38e2bc3aa1136ec2d60ca919f96b7c78",looks:"grid",onSmoothlyFormInput:o=>this.display=o.detail},t("smoothly-input",{key:"fb615bfa1bb32cde349e9461eb7c95db4561c5f1",name:"filter"},"Filter"),t("smoothly-input-select",{key:"63402507181804347642d78531856b217174951a",name:"variant"},t("span",{key:"d301e5204b7ce8bc4d3d31ab5c0ced12f1e3d893",slot:"label"},"Variant"),t("smoothly-item",{key:"fca79aa0f519c2c9823c0fc08dba8fc7d017c184",value:"outline"},"outline"),t("smoothly-item",{key:"78f2882358c54452f4ce56f976bed73fcade9b4f",value:"sharp"},"sharp"),t("smoothly-input-clear",{key:"1f3d317162149b9abd016a5f329d69ac05683646",slot:"end"}))),t("h2",{key:"3e894f0b4aa610c5a8267a183277e272f4855a9b"},"Props"),t("smoothly-form",{key:"694c7a9bd59edbea5823eb04156dc16e0bae9712",looks:"grid",onSmoothlyFormInput:o=>{this.props=o.detail;console.log("props",this.props)}},t("smoothly-input-select",{key:"0c3057a4f67a05e690ff3b063c930465016d8dd6",name:"color"},t("span",{key:"ae91aea176ba10c3da98a60c3063ec0f43167bff",slot:"label"},"Color"),i.values.map((o=>t("smoothly-item",{value:o},t("span",{style:{background:`rgb(var(--smoothly-${o}-color))`,"margin-right":"0.5rem",width:"2.5rem",height:"2.5rem"}}),t("span",null,o)))),t("smoothly-input-clear",{key:"22657bf293b433e392d57a06ca7ae2301c50676d",slot:"end"})),t("smoothly-input-select",{key:"a3cb883bd3ce072da544acb7c4a9d23de599d63f",name:"fill"},t("span",{key:"f2332f34ea7fd13b2722addacbb8ccb0a02a005e",slot:"label"},"Fill"),d.values.map((o=>t("smoothly-item",{value:o},o))),t("smoothly-input-clear",{key:"8518dae156b2233616eaaa468421a05c8f34025f",slot:"end"})),t("smoothly-input-select",{key:"0c684a06181b5e3aba3e9285c27e5dfc95b11fba",name:"customColor",menuHeight:"12items",ordered:true},t("span",{key:"bdf65faa5cc2d6ac46c2d8f57d12f6c980dbed4f",slot:"label"},"Custom Color"),i.values.flatMap((o=>t(a,null,["tint","color","shade","contrast"].map((e=>t("smoothly-item",{value:`--smoothly-${o}-${e}`},t("span",{style:{background:`rgb(var(--smoothly-${o}-${e}))`,"margin-right":"0.5rem",width:"2.5rem",height:"2.5rem"}}),t("span",null,`rgb(var(--smoothly-${o}-${e}))`)))))))),t("smoothly-input-select",{key:"38e1df15f3e5756a231ea13ae7e603ad729cbfd5",name:"customBackground",menuHeight:"12items",ordered:true},t("span",{key:"034a6c1102fcfc4f84802b652ae4773daedcc79a",slot:"label"},"Custom Background"),i.values.flatMap((o=>t(a,null,["tint","color","shade","contrast"].map((e=>t("smoothly-item",{value:`--smoothly-${o}-${e}`},t("span",{style:{background:`rgb(var(--smoothly-${o}-${e}))`,"margin-right":"0.5rem",width:"2.5rem",height:"2.5rem"}}),t("span",null,`rgb(var(--smoothly-${o}-${e}))`)))))))),t("smoothly-input-select",{key:"bf07ed563c77658d9c8627794932cf807d4d497c",name:"flip"},t("span",{key:"f117c483d18de238eb575e23c358ecd54eec249f",slot:"label"},"Flip"),t("smoothly-item",{key:"d8d6d1da3ede777093bfb6882c4a34a498b109d1",value:"x"},"x"),t("smoothly-item",{key:"fb202fe8bf15b614abacc3778e49f2a9da67abd8",value:"y"},"y"),t("smoothly-input-clear",{key:"c6067ab01e51359091f41c82f315aa36aad09ad4",slot:"end"})),t("smoothly-input-select",{key:"9ba36e95d18097099035b4a11182091e1e7e2287",name:"size"},t("span",{key:"571f9a1953f6b3f22d18f0dd591c9743d3818687",slot:"label"},"Size"),t("smoothly-item",{key:"c38f009d2fb5df14dc7c5dbde70538f8ae5b3e04",value:"tiny"},"tiny"),t("smoothly-item",{key:"800ae091d06fe8f3f9a728ad4ac63b67a7141200",value:"small"},"small"),t("smoothly-item",{key:"b24d245d0614bae7fc0c125824c7cf6ad3a11aa2",value:"medium"},"medium"),t("smoothly-item",{key:"8fdb8c8686a36898c63d6981ef44fc2348e6018e",value:"large"},"large"),t("smoothly-item",{key:"a1d2a033d0531ca802a3241f0f7bfe3b9ab6faf6",value:"xlarge"},"xlarge"),t("smoothly-input-clear",{key:"b72340bf5146665b425c1debb51dcf46bab08a72",slot:"end"})),t("smoothly-input-range",{key:"b39307e3bd9fb244dd56b4de51f392b3522cd39d",name:"rotate",step:1,min:-180,max:180,value:0},"Rotate",t("smoothly-input-clear",{key:"b73479f5999155b57a18c1adaf4dd2a06f98fab5",slot:"end"}))),t("h1",{key:"d9423d81faff0144d5d67a1a15af7395dec71c13"},"Icons"),t("div",{key:"26499ec293ff6772322d9853841d33ad1c0a1195",class:"icons"},[...c.Name.values.filter((o=>!this.display.filter||o.includes(this.display.filter))).map((o=>this.display.variant?`${o}-${this.display.variant}`:o)),...c.Logo.values.filter((o=>!this.display.filter||o.includes(this.display.filter)))].map((o=>t("smoothly-icon",{name:o,tooltip:o,"data-name":o,color:this.props.color,style:{fill:this.props["customColor"]?`rgb(var(${this.props["customColor"]}))`:"",color:this.props["customColor"]?`rgb(var(${this.props["customColor"]}))`:"",background:this.props["customBackground"]?`rgb(var(${this.props["customBackground"]}))`:""},fill:this.props.fill,flip:this.props.flip,size:this.props.size,rotate:this.props.rotate,onClick:()=>{navigator.clipboard.writeText(o);this.notice.emit(r.succeeded(`Copied "${o}"`))}})))))}static get style(){return F()}},[2,"smoothly-icon-demo",{display:[32],props:[32]}]);function w(){if(typeof customElements==="undefined"){return}const o=["smoothly-icon-demo","smoothly-button","smoothly-display","smoothly-display-json","smoothly-display-json-object","smoothly-display-json-primitive","smoothly-display-json-record-key","smoothly-form","smoothly-icon","smoothly-input","smoothly-input-clear","smoothly-input-range","smoothly-input-select","smoothly-item","smoothly-spinner"];o.forEach((o=>{switch(o){case"smoothly-icon-demo":if(!customElements.get(m(o))){customElements.define(m(o),x)}break;case"smoothly-button":if(!customElements.get(m(o))){n()}break;case"smoothly-display":if(!customElements.get(m(o))){y()}break;case"smoothly-display-json":if(!customElements.get(m(o))){f()}break;case"smoothly-display-json-object":if(!customElements.get(m(o))){h()}break;case"smoothly-display-json-primitive":if(!customElements.get(m(o))){b()}break;case"smoothly-display-json-record-key":if(!customElements.get(m(o))){p()}break;case"smoothly-form":if(!customElements.get(m(o))){u()}break;case"smoothly-icon":if(!customElements.get(m(o))){k()}break;case"smoothly-input":if(!customElements.get(m(o))){g()}break;case"smoothly-input-clear":if(!customElements.get(m(o))){v()}break;case"smoothly-input-range":if(!customElements.get(m(o))){j()}break;case"smoothly-input-select":if(!customElements.get(m(o))){E()}break;case"smoothly-item":if(!customElements.get(m(o))){$()}break;case"smoothly-spinner":if(!customElements.get(m(o))){C()}break}}))}w();export{x as S,w as d};
|
|
2
|
+
//# sourceMappingURL=p-BbtmZQlk.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as t,c as o,h as a,d as s,t as c}from"./p-BsZrGTcp.js";import{i as m}from"./p-BVKhAhsB.js";import{d}from"./p-CCwzp3Kg.js";import{d as l}from"./p-mmAi00ak.js";import{d as i}from"./p-Cl8L61mt.js";import{d as b}from"./p-CHjWijPI.js";import{d as f}from"./p-BE5E3Jm6.js";import{d as n}from"./p-CN3iME9d.js";import{d as y}from"./p-DG2pfnCV.js";import{d as r}from"./p-uFR5K4vd.js";import{d as u}from"./p-DvZK__s-.js";import{d as h}from"./p-F8qX8ZuL.js";import{d as p}from"./p-vvQg46ti.js";import{d as k}from"./p-DFSiKg4M.js";import{d as v}from"./p-o8kM0Soe.js";import{d as j}from"./p-Dd9tz4Tj.js";import{d as g}from"./p-BX-sEZyq.js";import{d as E}from"./p-y6VfFBKz.js";import{d as x}from"./p-C0Vb-3iG.js";import{d as S}from"./p-CtVEKtM6.js";import{d as C}from"./p-DbQqZdoI.js";import{d as w}from"./p-KZeR_6LG.js";import{d as D}from"./p-BSHxNVcQ.js";import{d as z}from"./p-tD13Ef_1.js";import{d as L}from"./p-ChiRe9cW.js";import{d as A}from"./p-DUoSHWe1.js";import{d as I}from"./p-gEWA_tZo.js";import{d as M}from"./p-MqffyRVU.js";import{d as B}from"./p-CKD_8Dn1.js";import{d as F}from"./p-wjlHVReJ.js";import{d as N}from"./p-4Xn3Nprv.js";import{d as K}from"./p-j4UEmpTa.js";import{d as H}from"./p-D97PTGAK.js";import{d as V}from"./p-C22G-tNF.js";import{d as Z}from"./p-BplZiuMF.js";import{d as R}from"./p-BLdivqFr.js";import{d as G}from"./p-CVdJ19AA.js";import{d as J}from"./p-DvOr53No.js";import{d as T}from"./p-Cs0CtSI2.js";import{d as _}from"./p-2Y5tLcQ1.js";import{d as q}from"./p-BsHachOX.js";const Q=()=>`.sc-smoothly-input-demo-h{display:flex;flex-direction:column;margin-top:2em;margin-bottom:10rem}.sc-smoothly-input-demo-h .select-div-row.sc-smoothly-input-demo{display:flex}.sc-smoothly-input-demo-h .select-div-row.sc-smoothly-input-demo smoothly-input.sc-smoothly-input-demo{flex:1}smoothly-input-demo-standard.sc-smoothly-input-demo{margin-bottom:2rem}div.inputs.sc-smoothly-input-demo{max-width:min(calc(100% - 2rem), 56rem);margin:auto}div.inputs.sc-smoothly-input-demo>h2.sc-smoothly-input-demo:not(:first-child){padding-top:3em;margin-top:3em;border-top:1px solid black}.checkbox-group.sc-smoothly-input-demo{display:flex;gap:1.5em;align-items:center;background-color:rgb(var(--smoothly-input-background))}.select-div.sc-smoothly-input-demo{display:flex;gap:1em;flex-wrap:wrap}.select-div.sc-smoothly-input-demo>*.sc-smoothly-input-demo{flex-grow:1;min-width:min(100%, var(--smoothly-form-input-min-width, 18rem));flex-basis:40%}`;const U=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.smoothlyUrlUpdate=o(this,"smoothlyUrlUpdate");this.duration={hours:8};this.alphanumeric="!@##";this.numbers=[1,2,3,4,5,6,7,8,9]}render(){return a(s,{key:"9abde760302f7d14296fc58d56b168ccd992c88a"},a("smoothly-input-demo-standard",{key:"7145773de0c84eab437b1dc065202dc2cb19b37a"}),a("smoothly-input-date-demo",{key:"c0304ad310674ae499009d58ddce974f7412c33f"}),a("smoothly-input-demo-user-input",{key:"efde7d5d40929dcc96890f54a91797d0251db2bc"}),a("smoothly-input-demo-radio",{key:"9cde328a31101ee88b7ac3fd7f86abb00b8aedca"}),a("div",{key:"066262aa80f355d87120622b163621c209b0f43c",class:"inputs"},a("h2",{key:"bc38dbe23f7eb3611cac8cf83c5ce0634cb4e722"},"Calendar"),a("smoothly-input-date",{key:"f56708f29f4fa6158ea18b55d806215ee414c599",name:"some-date"},"Calendar"),a("smoothly-input-date-time",{key:"5fe8d855011464f877d70981663f27980080c16a",name:"someDateTime",value:m.DateTime.now()},"DateTime"),a("h2",{key:"f060f3978aeb3707d20c26cdf03724ffb8b25220"},"Date Range"),a("smoothly-input-date-range",{key:"397960f5adb2f9cdb84883e4a4a73134054e23be",name:"testing",start:m.Date.now(),end:m.Date.nextMonth(m.Date.now()),min:"2021-10-01",max:"2025-01-31"}),a("smoothly-input-date-range",{key:"37e2a88696a6c59498b203a00067c96028b8b7a9",name:"testing",start:m.Date.now(),end:m.Date.nextMonth(m.Date.now()),min:"2021-10-10",max:"2024-12-30"},a("smoothly-input-reset",{key:"e50dcde7cd3ce5a5286f5a9e6dfd8bbee00be2f9",slot:"end",size:"icon"})),a("smoothly-input-date-range",{key:"ab99b94f110b3861c6b0350e555442325332f42a",looks:"grid",start:m.Date.now(),end:m.Date.nextMonth(m.Date.now()),min:"2021-10-10",max:"2025-12-30",showLabel:false,style:{"--smoothly-input-border-radius":"0.5rem"}},a("smoothly-input-clear",{key:"7f6081c65f5280584d04b6ce8f7905ac77634a3e",slot:"end",size:"icon"})),a("h2",{key:"37f34f036ee7dc8fb75c4c00659da25e601ff5b1"},"Date"),a("smoothly-input-date",{key:"511529a03ebe91114a24ac5a1942bf2007e1c338"},"Date"),a("smoothly-input-date",{key:"f0b777d7e776387614b9cbeb866f91fd20c86710",showLabel:false,value:"2021-10-28",max:"2021-12-30",min:"2021-10-10"},"Date"),a("smoothly-input-date",{key:"11c9d53699c3f56ab059fcc4ae23ae3ede7c3ef7",value:"2021-10-28"},"Date",a("smoothly-input-reset",{key:"d8f02f6d1c3a5866f9666199b8dff8bffa2f020a",slot:"end",size:"icon"})),a("smoothly-input-date",{key:"b818db6b9c7b7a3e52bd110795f814f440eab4f7",value:"2021-10-28"},"Date",a("smoothly-input-clear",{key:"c099251b5d2925af72bf10d4e897f4102f62be43",slot:"end",size:"icon"})),a("h2",{key:"8033cbfa7ee22ca7440d58952676a43f092c1304"},"Select"),a("div",{key:"1de49162035bde4ab43a46cea27a2e4ef016c784",class:"select-div"},a("smoothly-input-select",{key:"2d2acbd594c6a260b1bd571f00a35e53db9f904f",name:"select-dessert",looks:"border"},a("label",{key:"4a1ebbb1757580ebfba6c58651fa8207a186274c",slot:"label"},"Select with clear button"),a("smoothly-item",{key:"10fe2d4eec5af17e61f704b594be8a700dde57e8",value:"1"},"Ice cream"),a("smoothly-item",{key:"50f3be0902fa5d9989e0827df63cbbc1e4969a4e",value:"2"},"Sponge cake"),a("smoothly-item",{key:"54d4950affc3378a23311d30f01a6b75877921a8",value:"3",disabled:true},"Disabled Item"),a("smoothly-item",{key:"2b669d8c3138b6bef8b2c0a5b0a17f07ea2b1fc3",value:"4"},"Cookie"),a("smoothly-item",{key:"1d222cd2827315a43f1d8412777f2deab42c707e",value:"5"},"Croissant"),a("smoothly-item",{key:"f5582ec1306d69273508415467d56ef166d59592",value:"6"},"Chocolate fondue"),a("smoothly-input-clear",{key:"903c91c69080f05179a1d4c5c4176f651bbac1a7",size:"icon",slot:"end"})),a("smoothly-input-select",{key:"a73b2cdcca14bddac369727f65113cfe2e36f9c8",multiple:true,name:"select-dessert-multiple",looks:"border"},a("label",{key:"264c0c5c870d69ccd4acd552c0c69b75bdf41322",slot:"label"},"Select multiple with reset button"),a("smoothly-item",{key:"1b013b6fce5892e21cec768704c1c7847f9c2d6b",value:"ice cream"},"Ice cream"),a("smoothly-item",{key:"cbf0fb98cd04b4c21d56c4640ebc7fea61de1b8e",value:"sponge cake"},"Sponge cake"),a("smoothly-item",{key:"5244238b76c116e31888c36887b3f4ac5c88f2d0",selected:true,value:"cookie"},"Cookie"),a("smoothly-item",{key:"665cd5efa69f937a8de2e16549f6b5030f87aadd",value:"croissant"},"Croissant"),a("smoothly-item",{key:"f33f606105a30eadeb8ad91d1d098b59f03f1de2",selected:true,value:"chocolate fondue"},"Chocolate fondue"),a("smoothly-input-reset",{key:"903d7955210a152bdd397bf011ede1bdff121949",size:"icon",slot:"end"})),a("smoothly-input-select",{key:"a3b64c46106cc3059130d7c3a91d7f490d1d2751",name:"spirit-animals",looks:"border",mutable:true},a("label",{key:"a004cf922bae1aad8f4df3af6898096e965cfc6a",slot:"label"},"Select or add new options"),a("smoothly-item",{key:"4aa4ef91d108edb11936203365632dfc604e6973",value:"manatee"},"Manatee"),a("smoothly-item",{key:"12985b2fd02dec4a942274c1ecd0b8d64045fb62",selected:true,value:"cthulu"},"Cthulu")),a("smoothly-input-select",{key:"926065319fff2eb3024955686991469cf4128a36",name:"select-icon",clearable:false,showSelected:false},a("smoothly-item",{key:"1ac998cba750b6779c9d2159cef8245ab915f528",value:"folder",selected:true},a("smoothly-icon",{key:"30d4832563d4b16c0bbb77cb33e0da404b743090",size:"small",name:"folder-outline"})),a("smoothly-item",{key:"b04f79adc06b65369baed20874f53ef04a33f80f",value:"camera"},a("smoothly-icon",{key:"b16eaceb42a9e0b56587ce78e8cfdc6452dddd7b",size:"small",name:"camera-outline"}))),a("smoothly-input-select",{key:"5e225cc4758897b81015db7495c7d7a224776e53",ordered:true,menuHeight:"7.5items",placeholder:"Select...",name:"select-month"},a("label",{key:"4b9bcc2a3fe30dabc8669888a19ce86f369cc41e",slot:"label"},"Alphabet ordered select"),Array.from({length:26}).map(((e,t)=>String.fromCharCode(t+65))).map((e=>a("smoothly-item",{value:e,selected:e=="H"},e)))),a("smoothly-input-select",{key:"a171d4ffb8e1bfc698f0fc9ae4ed69e98ced36c9",multiple:true,menuHeight:"7.5items",placeholder:"Select...",name:"select-month"},a("label",{key:"a23c78b0a859472f5e0123b0c02c010911417369",slot:"label"},"Month multiple select"),a("smoothly-item",{key:"a733057d56e91b60e5baa989e26dddbd91e0241a",value:"1"},"January"),a("smoothly-item",{key:"376d92471d5d2eaa9dd88812a8fc583153410198",value:"2"},"February"),a("smoothly-item",{key:"7a1fce8efd0b7974e5528a5fa5662c1dfd778394",value:"3"},"March"),a("smoothly-item",{key:"cb9baf077486cb9bcdbbf89649530a5e0d6063c7",value:"4"},"April"),a("smoothly-item",{key:"0a3473edcc3c472a629ba3d8a79f902acb2e26f3",value:"5"},"May"),a("smoothly-item",{key:"5fdae912db41bffabf3b295d2c3032277dffaa94",value:"6"},"June"),a("smoothly-item",{key:"80047591254fd32dc669b14753e4786d43d3c97d",value:"7"},"July"),a("smoothly-item",{key:"c9df20403a3c394c64aba952b9fedf32e79ccb4d",value:"8"},"August"),a("smoothly-item",{key:"68313242691a68d57283d668fe9b515793737c7e",value:"9"},"September"),a("smoothly-item",{key:"443d7a691c41599d0d89db84b537eb1f257ef517",value:"10"},"October"),a("smoothly-item",{key:"9744bb0bda7582ad2b8b1f90fdf8032258463c54",value:"11"},"November"),a("smoothly-item",{key:"a96a75320e5c546549c4fa35f4176f35a82f5441",value:"12"},"December")),a("div",{key:"3e7603380ceba63da34a828e2516632da73e39c4",class:"select-div-row"},a("smoothly-input-select",{key:"408634ba59447206b05b3cd1fd1cc33d1eb8c65d",name:"select-icon",clearable:false,showSelected:false},a("smoothly-item",{key:"ee676953d6e5787b02d09f18296c90f0de191c1d",value:"folder",selected:true},a("smoothly-icon",{key:"a904b9c0a3606d2427f70b0de7038c58e126eb8f",size:"small",name:"folder-outline"})),a("smoothly-item",{key:"3005772f6f0db186e465eaa8cdf0664acc8df98a",value:"camera"},a("smoothly-icon",{key:"d6d6da52e16928ffae5914bb57c5d507dcd753d7",size:"small",name:"camera-outline"})),a("smoothly-item",{key:"e7f997b52e887a470a300bde751cb2972a8a6d1c",value:"boat"},a("smoothly-icon",{key:"7d2fa7593473fea8a742b06451b86234dc2c984f",size:"small",name:"boat-outline"}))),a("smoothly-input-select",{key:"72b7dd2b8193e7daa76e87e2b2c0229e6542b95d",name:"select-number",clearable:false},this.numbers.map((e=>a("smoothly-item",{value:"number",selected:e===3},e)))),a("smoothly-input",{key:"2eaf99ab88e42d799677b83d1e7cac4bf27b2cab",name:"name",value:"Sten Qvist"},"Name"))),a("h2",{key:"bdf117c705543939f57d4f8c001b9bd6b0f6d419"},"Duration"),a("smoothly-input",{key:"8c58c7e2d86e031ffb41a6a46fc738bd87d73a8d",name:"duration",type:"duration",placeholder:"hh:mm",value:this.duration,onSmoothlyInput:e=>this.duration=e.detail.duration},"Duration"),a("smoothly-input",{key:"0e0b25be2290f7adfc1dc72807e11791965a1ad8",name:"duration",type:"duration",value:this.duration,placeholder:"-hh:mm",onSmoothlyInput:e=>{const t=e.detail.duration;this.duration=t}},"Duration"),a("h2",{key:"ed1c66a6809ae277a848826be61161405e712e89"},"Integer with Min/Max"),a("smoothly-input",{key:"220dca7d4c2fe1111025b6e44d23a40d105efe89",name:"days",type:"integer",min:0,max:365},"Days per year (0-365)"),a("smoothly-input",{key:"e2b1ae2d00b98366ee26f02d37915e319736f002",name:"hour",type:"integer",min:0,max:23},"Hours per day (0-23)"),a("smoothly-input",{key:"1ecd944814b02bbd94314507d76bea0f988352f4",name:"minute",type:"integer",min:0,max:59},"Minutes per hour (0-59)"),a("smoothly-input",{key:"b8990cc9cad14d470ca47ab3c6c04b4f685a0c55",name:"minute",type:"integer",min:18,max:120},"Age (18-120)"),a("h2",{key:"2a747aa7ff1fb76fa374c730b59802c8f3a508cd"},"Invalid text with warning icon and tooltip"),a("smoothly-input",{key:"817b52d0ef2e31056e8ee8a7faab79990797c732",copyable:true,name:"alphanumeric",invalid:!/^[a-zA-Z0-9]+$/.test(this.alphanumeric),errorMessage:"Only alphanumeric allowed",value:this.alphanumeric,onSmoothlyInput:e=>this.alphanumeric=e.detail.alphanumeric},"Alphanumeric"),a("h2",{key:"cd628bebd9e2b9de77eb82b0f9591cfe8d7b3ca2"},"Identifiers"),a("smoothly-input",{key:"fe1d2d89f25cd8a60fd537bfb5a9580548491604",type:"identifier-code"},"Code"),a("smoothly-input",{key:"14d47570684ca9165381718becda2f318c9c88bf",type:"identifier-attribute"},"Attribute"),a("smoothly-input",{key:"fb5ed7f2a284640369bf648a548161d233756dd5",type:"identifier-snake"},"Snake"),a("smoothly-input",{key:"cde9cde9c787d99c0eaf75085f0567139b8130c8",type:"identifier-pascal"},"Pascal"),a("smoothly-input",{key:"509c743780e2d2f0d759ab3cff67893318256443",type:"identifier-camel"},"Camel"),a("h2",{key:"81ea90cb970b799945d3aeb14b70bb8184d911e4"},"Input Alternatives"),a("smoothly-input",{key:"01ba72593f0e056a20d87c8722e2bc4317932962",type:"text",name:"name.last"},a("smoothly-icon",{key:"70491c3ed08d7f0d13a3cd8eba72e47fa1de1008",name:"checkmark-circle",slot:"start"}),"First Name"),a("smoothly-input",{key:"ab3a45839ee4d8bacfac8ca96bcd7ec260ce36d9",type:"text",name:"name.first"},"Last Name",a("smoothly-icon",{key:"a7996638a9ec278f74d967e0fcb03dcaf4445315",name:"checkmark-circle",slot:"end"})),a("smoothly-input",{key:"f524fc067947a8637a1c416a74d3de0c37744255",type:"text",name:"name.first",placeholder:"Smith"},"Last Name",a("smoothly-icon",{key:"ec440199d9625155037e1cd9e614266748997f7a",name:"checkmark-circle",slot:"end"})),a("smoothly-input",{key:"27cc6d614a7bae4893462b5e708cb663bcffcec1",placeholder:"test"}),a("smoothly-input-submit",{key:"789ee37616c3c27e8e6414992be1f9ee2117a5d3",slot:"submit",fill:"solid",onSubmit:e=>alert(e),color:"success"}),a("h4",{key:"5c256926b8f451dca0b5297992f6a6312a2f5494"},"Smoothly checkboxes"),a("div",{key:"6650b3b1b27d5fbca72ef5679f03d11c3c5cc1a7",class:"checkbox-group"},a("smoothly-input-checkbox",{key:"9030dedf496556b87212376fbd15617f6abebf48",disabled:true,name:"first-checkbox"},a("smoothly-icon",{key:"e3a47da2376066cdfc082fbf4100adf340b70f36",name:"checkmark-circle",slot:"start",size:"tiny"}),"First"),a("smoothly-input-checkbox",{key:"d86dbe0e70d983c82791caf5729ed0510df48b4d",name:"second-checkbox",checked:true},a("smoothly-icon",{key:"28505106b36406f9a24fdd0f8f27dea211544f38",name:"checkmark-circle",slot:"start",size:"tiny"}),"second",a("smoothly-input-clear",{key:"7240cc38a40cfe3ca5ee3cdbb5ae971ebbf23efb",size:"icon",slot:"end"})),a("smoothly-input-checkbox",{key:"64df44307f15d6ca5878b5933b847931973a4bd4",name:"third-checkbox"},"3rd")),a("h4",{key:"d6cd694e036d14b16241a4664ed9e9a6b9257c80"},"Smoothly Radio Buttons"),a("smoothly-input-radio",{key:"43f5fe05e6889b3f009a85a996ca9f3df8418d85",clearable:true,name:"radioFirstInput"},a("smoothly-icon",{key:"67303cd42725a67937687862934c5eb4efb08617",name:"checkmark-circle",slot:"start"}),a("label",{key:"20faf3230a26de4d0578cc142212f849447826b0",slot:"label"},"Clearable"),a("smoothly-input-radio-item",{key:"c8f0663f1aca55d837179e535675837b8c5dc486",value:"first"},"Label 1"),a("smoothly-input-radio-item",{key:"f699d87b7edd1e815068671279f6454a071dd26f",selected:true,value:"second"},"Label 2"),a("smoothly-input-radio-item",{key:"6c76a26cbcf6c0279ea178a8c2fa5cb70d592614",value:"third"},"Label 3"),a("smoothly-input-clear",{key:"146770892b8d84fe6686d7d360b2c119271b068e",size:"icon",slot:"end"})),a("smoothly-input-radio",{key:"d15590998dacc095683e2a2149bd4d0008458c6c",name:"radioSecondInput"},a("label",{key:"91206150e39f16cc6b63c27e936e0890d085dd3c",slot:"label"},"Not clearable"),a("smoothly-input-radio-item",{key:"4be57f196fceca8c421b1a76539383e583815d47",value:"first"},"Label 1"),a("smoothly-input-radio-item",{key:"64fb53d589cbc3c41d2716bcd0a94e0852b61984",value:"second"},"Label 2"),a("smoothly-input-radio-item",{key:"cfd1618ca1085b04f892a0f7c41c3ba015817f8e",value:"third"},"Label 3"),a("smoothly-input-radio-item",{key:"5204c85dc39eb90eb2203f7bc95465fd3505e0ee",value:"fourth"},"Label 4"),a("smoothly-input-radio-item",{key:"7beb685e25cd77b0c4ee67d52c08d3dda77bbb43",value:"fifth"},"Label 5"),a("smoothly-input-radio-item",{key:"2e540abce5ef3a5ef00f9bf66e28d4dcc2dcf033",value:"sixth"},"Label 6")),a("smoothly-input-range-demo",{key:"0734d3ef8222645914a3de1baca3a564658155b2"}),a("smoothly-input-color-demo",{key:"4efc6abf40e3b21f406e0bc0c56e0b1549bf7c62"}),a("smoothly-input-price-demo",{key:"bd457e1f8ac312ee0feb1685bee15b7ec9cfd451"}),a("smoothly-back-to-top",{key:"a1795f547d9bcfc820f76df3e60f9611a8d654e8"})))}static get style(){return Q()}},[2,"smoothly-input-demo",{duration:[32],alphanumeric:[32]}]);function O(){if(typeof customElements==="undefined"){return}const e=["smoothly-input-demo","smoothly-back-to-top","smoothly-button","smoothly-button-confirm","smoothly-calendar","smoothly-date-text","smoothly-display","smoothly-display-json","smoothly-display-json-object","smoothly-display-json-primitive","smoothly-display-json-record-key","smoothly-form","smoothly-icon","smoothly-input","smoothly-input-checkbox","smoothly-input-clear","smoothly-input-color","smoothly-input-color-demo","smoothly-input-date","smoothly-input-date-demo","smoothly-input-date-range","smoothly-input-date-time","smoothly-input-demo-radio","smoothly-input-demo-standard","smoothly-input-demo-user-input","smoothly-input-file","smoothly-input-month","smoothly-input-price-demo","smoothly-input-radio","smoothly-input-radio-item","smoothly-input-range","smoothly-input-range-demo","smoothly-input-reset","smoothly-input-select","smoothly-input-submit","smoothly-item","smoothly-spinner","smoothly-tab","smoothly-tabs","smoothly-toggle-switch"];e.forEach((e=>{switch(e){case"smoothly-input-demo":if(!customElements.get(c(e))){customElements.define(c(e),U)}break;case"smoothly-back-to-top":if(!customElements.get(c(e))){d()}break;case"smoothly-button":if(!customElements.get(c(e))){l()}break;case"smoothly-button-confirm":if(!customElements.get(c(e))){i()}break;case"smoothly-calendar":if(!customElements.get(c(e))){b()}break;case"smoothly-date-text":if(!customElements.get(c(e))){f()}break;case"smoothly-display":if(!customElements.get(c(e))){n()}break;case"smoothly-display-json":if(!customElements.get(c(e))){y()}break;case"smoothly-display-json-object":if(!customElements.get(c(e))){r()}break;case"smoothly-display-json-primitive":if(!customElements.get(c(e))){u()}break;case"smoothly-display-json-record-key":if(!customElements.get(c(e))){h()}break;case"smoothly-form":if(!customElements.get(c(e))){p()}break;case"smoothly-icon":if(!customElements.get(c(e))){k()}break;case"smoothly-input":if(!customElements.get(c(e))){v()}break;case"smoothly-input-checkbox":if(!customElements.get(c(e))){j()}break;case"smoothly-input-clear":if(!customElements.get(c(e))){g()}break;case"smoothly-input-color":if(!customElements.get(c(e))){E()}break;case"smoothly-input-color-demo":if(!customElements.get(c(e))){x()}break;case"smoothly-input-date":if(!customElements.get(c(e))){S()}break;case"smoothly-input-date-demo":if(!customElements.get(c(e))){C()}break;case"smoothly-input-date-range":if(!customElements.get(c(e))){w()}break;case"smoothly-input-date-time":if(!customElements.get(c(e))){D()}break;case"smoothly-input-demo-radio":if(!customElements.get(c(e))){z()}break;case"smoothly-input-demo-standard":if(!customElements.get(c(e))){L()}break;case"smoothly-input-demo-user-input":if(!customElements.get(c(e))){A()}break;case"smoothly-input-file":if(!customElements.get(c(e))){I()}break;case"smoothly-input-month":if(!customElements.get(c(e))){M()}break;case"smoothly-input-price-demo":if(!customElements.get(c(e))){B()}break;case"smoothly-input-radio":if(!customElements.get(c(e))){F()}break;case"smoothly-input-radio-item":if(!customElements.get(c(e))){N()}break;case"smoothly-input-range":if(!customElements.get(c(e))){K()}break;case"smoothly-input-range-demo":if(!customElements.get(c(e))){H()}break;case"smoothly-input-reset":if(!customElements.get(c(e))){V()}break;case"smoothly-input-select":if(!customElements.get(c(e))){Z()}break;case"smoothly-input-submit":if(!customElements.get(c(e))){R()}break;case"smoothly-item":if(!customElements.get(c(e))){G()}break;case"smoothly-spinner":if(!customElements.get(c(e))){J()}break;case"smoothly-tab":if(!customElements.get(c(e))){T()}break;case"smoothly-tabs":if(!customElements.get(c(e))){_()}break;case"smoothly-toggle-switch":if(!customElements.get(c(e))){q()}break}}))}O();export{U as S,O as d};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{p as e,H as t,c as o,h as a,d as s,t as c}from"./p-BsZrGTcp.js";import{i as m}from"./p-BVKhAhsB.js";import{d}from"./p-CCwzp3Kg.js";import{d as l}from"./p-mmAi00ak.js";import{d as i}from"./p-Cl8L61mt.js";import{d as f}from"./p-CHjWijPI.js";import{d as b}from"./p-BE5E3Jm6.js";import{d as n}from"./p-CN3iME9d.js";import{d as y}from"./p-DG2pfnCV.js";import{d as r}from"./p-uFR5K4vd.js";import{d as u}from"./p-DvZK__s-.js";import{d as h}from"./p-F8qX8ZuL.js";import{d as p}from"./p-vvQg46ti.js";import{d as k}from"./p-DFSiKg4M.js";import{d as v}from"./p-o8kM0Soe.js";import{d as j}from"./p-Dd9tz4Tj.js";import{d as g}from"./p-BX-sEZyq.js";import{d as E}from"./p-CaQWZMN4.js";import{d as x}from"./p-B1VLjp0y.js";import{d as C}from"./p-CtVEKtM6.js";import{d as S}from"./p-DbQqZdoI.js";import{d as w}from"./p-KZeR_6LG.js";import{d as D}from"./p-BSHxNVcQ.js";import{d as L}from"./p-tD13Ef_1.js";import{d as z}from"./p-Ch1HU37X.js";import{d as I}from"./p-CYxd1Pkd.js";import{d as M}from"./p-gEWA_tZo.js";import{d as A}from"./p-MqffyRVU.js";import{d as N}from"./p-CKD_8Dn1.js";import{d as B}from"./p-wjlHVReJ.js";import{d as F}from"./p-4Xn3Nprv.js";import{d as Z}from"./p-PwCtk_DY.js";import{d as H}from"./p-Cfvi2T1F.js";import{d as K}from"./p-C22G-tNF.js";import{d as V}from"./p-BplZiuMF.js";import{d as _}from"./p-BLdivqFr.js";import{d as J}from"./p-CVdJ19AA.js";import{d as Q}from"./p-DvOr53No.js";import{d as R}from"./p-Cs0CtSI2.js";import{d as q}from"./p-2Y5tLcQ1.js";import{d as T}from"./p-BsHachOX.js";const X=()=>`.sc-smoothly-input-demo-h{display:flex;flex-direction:column;margin-top:2em;margin-bottom:10rem}.sc-smoothly-input-demo-h .select-div-row.sc-smoothly-input-demo{display:flex}.sc-smoothly-input-demo-h .select-div-row.sc-smoothly-input-demo smoothly-input.sc-smoothly-input-demo{flex:1}smoothly-input-demo-standard.sc-smoothly-input-demo{margin-bottom:2rem}div.inputs.sc-smoothly-input-demo{max-width:min(calc(100% - 2rem), 56rem);margin:auto}div.inputs.sc-smoothly-input-demo>h2.sc-smoothly-input-demo:not(:first-child){padding-top:3em;margin-top:3em;border-top:1px solid black}.checkbox-group.sc-smoothly-input-demo{display:flex;gap:1.5em;align-items:center;background-color:rgb(var(--smoothly-input-background))}.select-div.sc-smoothly-input-demo{display:flex;gap:1em;flex-wrap:wrap}.select-div.sc-smoothly-input-demo>*.sc-smoothly-input-demo{flex-grow:1;min-width:min(100%, var(--smoothly-form-input-min-width, 18rem));flex-basis:40%}`;const G=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.smoothlyUrlUpdate=o(this,"smoothlyUrlUpdate");this.duration={hours:8};this.alphanumeric="!@##";this.numbers=[1,2,3,4,5,6,7,8,9]}render(){return a(s,{key:"9abde760302f7d14296fc58d56b168ccd992c88a"},a("smoothly-input-demo-standard",{key:"7145773de0c84eab437b1dc065202dc2cb19b37a"}),a("smoothly-input-date-demo",{key:"c0304ad310674ae499009d58ddce974f7412c33f"}),a("smoothly-input-demo-user-input",{key:"efde7d5d40929dcc96890f54a91797d0251db2bc"}),a("smoothly-input-demo-radio",{key:"9cde328a31101ee88b7ac3fd7f86abb00b8aedca"}),a("div",{key:"066262aa80f355d87120622b163621c209b0f43c",class:"inputs"},a("h2",{key:"bc38dbe23f7eb3611cac8cf83c5ce0634cb4e722"},"Calendar"),a("smoothly-input-date",{key:"f56708f29f4fa6158ea18b55d806215ee414c599",name:"some-date"},"Calendar"),a("smoothly-input-date-time",{key:"5fe8d855011464f877d70981663f27980080c16a",name:"someDateTime",value:m.DateTime.now()},"DateTime"),a("h2",{key:"f060f3978aeb3707d20c26cdf03724ffb8b25220"},"Date Range"),a("smoothly-input-date-range",{key:"397960f5adb2f9cdb84883e4a4a73134054e23be",name:"testing",start:m.Date.now(),end:m.Date.nextMonth(m.Date.now()),min:"2021-10-01",max:"2025-01-31"}),a("smoothly-input-date-range",{key:"37e2a88696a6c59498b203a00067c96028b8b7a9",name:"testing",start:m.Date.now(),end:m.Date.nextMonth(m.Date.now()),min:"2021-10-10",max:"2024-12-30"},a("smoothly-input-reset",{key:"e50dcde7cd3ce5a5286f5a9e6dfd8bbee00be2f9",slot:"end",size:"icon"})),a("smoothly-input-date-range",{key:"ab99b94f110b3861c6b0350e555442325332f42a",looks:"grid",start:m.Date.now(),end:m.Date.nextMonth(m.Date.now()),min:"2021-10-10",max:"2025-12-30",showLabel:false,style:{"--smoothly-input-border-radius":"0.5rem"}},a("smoothly-input-clear",{key:"7f6081c65f5280584d04b6ce8f7905ac77634a3e",slot:"end",size:"icon"})),a("h2",{key:"37f34f036ee7dc8fb75c4c00659da25e601ff5b1"},"Date"),a("smoothly-input-date",{key:"511529a03ebe91114a24ac5a1942bf2007e1c338"},"Date"),a("smoothly-input-date",{key:"f0b777d7e776387614b9cbeb866f91fd20c86710",showLabel:false,value:"2021-10-28",max:"2021-12-30",min:"2021-10-10"},"Date"),a("smoothly-input-date",{key:"11c9d53699c3f56ab059fcc4ae23ae3ede7c3ef7",value:"2021-10-28"},"Date",a("smoothly-input-reset",{key:"d8f02f6d1c3a5866f9666199b8dff8bffa2f020a",slot:"end",size:"icon"})),a("smoothly-input-date",{key:"b818db6b9c7b7a3e52bd110795f814f440eab4f7",value:"2021-10-28"},"Date",a("smoothly-input-clear",{key:"c099251b5d2925af72bf10d4e897f4102f62be43",slot:"end",size:"icon"})),a("h2",{key:"8033cbfa7ee22ca7440d58952676a43f092c1304"},"Select"),a("div",{key:"1de49162035bde4ab43a46cea27a2e4ef016c784",class:"select-div"},a("smoothly-input-select",{key:"2d2acbd594c6a260b1bd571f00a35e53db9f904f",name:"select-dessert",looks:"border"},a("label",{key:"4a1ebbb1757580ebfba6c58651fa8207a186274c",slot:"label"},"Select with clear button"),a("smoothly-item",{key:"10fe2d4eec5af17e61f704b594be8a700dde57e8",value:"1"},"Ice cream"),a("smoothly-item",{key:"50f3be0902fa5d9989e0827df63cbbc1e4969a4e",value:"2"},"Sponge cake"),a("smoothly-item",{key:"54d4950affc3378a23311d30f01a6b75877921a8",value:"3",disabled:true},"Disabled Item"),a("smoothly-item",{key:"2b669d8c3138b6bef8b2c0a5b0a17f07ea2b1fc3",value:"4"},"Cookie"),a("smoothly-item",{key:"1d222cd2827315a43f1d8412777f2deab42c707e",value:"5"},"Croissant"),a("smoothly-item",{key:"f5582ec1306d69273508415467d56ef166d59592",value:"6"},"Chocolate fondue"),a("smoothly-input-clear",{key:"903c91c69080f05179a1d4c5c4176f651bbac1a7",size:"icon",slot:"end"})),a("smoothly-input-select",{key:"a73b2cdcca14bddac369727f65113cfe2e36f9c8",multiple:true,name:"select-dessert-multiple",looks:"border"},a("label",{key:"264c0c5c870d69ccd4acd552c0c69b75bdf41322",slot:"label"},"Select multiple with reset button"),a("smoothly-item",{key:"1b013b6fce5892e21cec768704c1c7847f9c2d6b",value:"ice cream"},"Ice cream"),a("smoothly-item",{key:"cbf0fb98cd04b4c21d56c4640ebc7fea61de1b8e",value:"sponge cake"},"Sponge cake"),a("smoothly-item",{key:"5244238b76c116e31888c36887b3f4ac5c88f2d0",selected:true,value:"cookie"},"Cookie"),a("smoothly-item",{key:"665cd5efa69f937a8de2e16549f6b5030f87aadd",value:"croissant"},"Croissant"),a("smoothly-item",{key:"f33f606105a30eadeb8ad91d1d098b59f03f1de2",selected:true,value:"chocolate fondue"},"Chocolate fondue"),a("smoothly-input-reset",{key:"903d7955210a152bdd397bf011ede1bdff121949",size:"icon",slot:"end"})),a("smoothly-input-select",{key:"a3b64c46106cc3059130d7c3a91d7f490d1d2751",name:"spirit-animals",looks:"border",mutable:true},a("label",{key:"a004cf922bae1aad8f4df3af6898096e965cfc6a",slot:"label"},"Select or add new options"),a("smoothly-item",{key:"4aa4ef91d108edb11936203365632dfc604e6973",value:"manatee"},"Manatee"),a("smoothly-item",{key:"12985b2fd02dec4a942274c1ecd0b8d64045fb62",selected:true,value:"cthulu"},"Cthulu")),a("smoothly-input-select",{key:"926065319fff2eb3024955686991469cf4128a36",name:"select-icon",clearable:false,showSelected:false},a("smoothly-item",{key:"1ac998cba750b6779c9d2159cef8245ab915f528",value:"folder",selected:true},a("smoothly-icon",{key:"30d4832563d4b16c0bbb77cb33e0da404b743090",size:"small",name:"folder-outline"})),a("smoothly-item",{key:"b04f79adc06b65369baed20874f53ef04a33f80f",value:"camera"},a("smoothly-icon",{key:"b16eaceb42a9e0b56587ce78e8cfdc6452dddd7b",size:"small",name:"camera-outline"}))),a("smoothly-input-select",{key:"5e225cc4758897b81015db7495c7d7a224776e53",ordered:true,menuHeight:"7.5items",placeholder:"Select...",name:"select-month"},a("label",{key:"4b9bcc2a3fe30dabc8669888a19ce86f369cc41e",slot:"label"},"Alphabet ordered select"),Array.from({length:26}).map(((e,t)=>String.fromCharCode(t+65))).map((e=>a("smoothly-item",{value:e,selected:e=="H"},e)))),a("smoothly-input-select",{key:"a171d4ffb8e1bfc698f0fc9ae4ed69e98ced36c9",multiple:true,menuHeight:"7.5items",placeholder:"Select...",name:"select-month"},a("label",{key:"a23c78b0a859472f5e0123b0c02c010911417369",slot:"label"},"Month multiple select"),a("smoothly-item",{key:"a733057d56e91b60e5baa989e26dddbd91e0241a",value:"1"},"January"),a("smoothly-item",{key:"376d92471d5d2eaa9dd88812a8fc583153410198",value:"2"},"February"),a("smoothly-item",{key:"7a1fce8efd0b7974e5528a5fa5662c1dfd778394",value:"3"},"March"),a("smoothly-item",{key:"cb9baf077486cb9bcdbbf89649530a5e0d6063c7",value:"4"},"April"),a("smoothly-item",{key:"0a3473edcc3c472a629ba3d8a79f902acb2e26f3",value:"5"},"May"),a("smoothly-item",{key:"5fdae912db41bffabf3b295d2c3032277dffaa94",value:"6"},"June"),a("smoothly-item",{key:"80047591254fd32dc669b14753e4786d43d3c97d",value:"7"},"July"),a("smoothly-item",{key:"c9df20403a3c394c64aba952b9fedf32e79ccb4d",value:"8"},"August"),a("smoothly-item",{key:"68313242691a68d57283d668fe9b515793737c7e",value:"9"},"September"),a("smoothly-item",{key:"443d7a691c41599d0d89db84b537eb1f257ef517",value:"10"},"October"),a("smoothly-item",{key:"9744bb0bda7582ad2b8b1f90fdf8032258463c54",value:"11"},"November"),a("smoothly-item",{key:"a96a75320e5c546549c4fa35f4176f35a82f5441",value:"12"},"December")),a("div",{key:"3e7603380ceba63da34a828e2516632da73e39c4",class:"select-div-row"},a("smoothly-input-select",{key:"408634ba59447206b05b3cd1fd1cc33d1eb8c65d",name:"select-icon",clearable:false,showSelected:false},a("smoothly-item",{key:"ee676953d6e5787b02d09f18296c90f0de191c1d",value:"folder",selected:true},a("smoothly-icon",{key:"a904b9c0a3606d2427f70b0de7038c58e126eb8f",size:"small",name:"folder-outline"})),a("smoothly-item",{key:"3005772f6f0db186e465eaa8cdf0664acc8df98a",value:"camera"},a("smoothly-icon",{key:"d6d6da52e16928ffae5914bb57c5d507dcd753d7",size:"small",name:"camera-outline"})),a("smoothly-item",{key:"e7f997b52e887a470a300bde751cb2972a8a6d1c",value:"boat"},a("smoothly-icon",{key:"7d2fa7593473fea8a742b06451b86234dc2c984f",size:"small",name:"boat-outline"}))),a("smoothly-input-select",{key:"72b7dd2b8193e7daa76e87e2b2c0229e6542b95d",name:"select-number",clearable:false},this.numbers.map((e=>a("smoothly-item",{value:"number",selected:e===3},e)))),a("smoothly-input",{key:"2eaf99ab88e42d799677b83d1e7cac4bf27b2cab",name:"name",value:"Sten Qvist"},"Name"))),a("h2",{key:"bdf117c705543939f57d4f8c001b9bd6b0f6d419"},"Duration"),a("smoothly-input",{key:"8c58c7e2d86e031ffb41a6a46fc738bd87d73a8d",name:"duration",type:"duration",placeholder:"hh:mm",value:this.duration,onSmoothlyInput:e=>this.duration=e.detail.duration},"Duration"),a("smoothly-input",{key:"0e0b25be2290f7adfc1dc72807e11791965a1ad8",name:"duration",type:"duration",value:this.duration,placeholder:"-hh:mm",onSmoothlyInput:e=>{const t=e.detail.duration;this.duration=t}},"Duration"),a("h2",{key:"ed1c66a6809ae277a848826be61161405e712e89"},"Integer with Min/Max"),a("smoothly-input",{key:"220dca7d4c2fe1111025b6e44d23a40d105efe89",name:"days",type:"integer",min:0,max:365},"Days per year (0-365)"),a("smoothly-input",{key:"e2b1ae2d00b98366ee26f02d37915e319736f002",name:"hour",type:"integer",min:0,max:23},"Hours per day (0-23)"),a("smoothly-input",{key:"1ecd944814b02bbd94314507d76bea0f988352f4",name:"minute",type:"integer",min:0,max:59},"Minutes per hour (0-59)"),a("smoothly-input",{key:"b8990cc9cad14d470ca47ab3c6c04b4f685a0c55",name:"minute",type:"integer",min:18,max:120},"Age (18-120)"),a("h2",{key:"2a747aa7ff1fb76fa374c730b59802c8f3a508cd"},"Invalid text with warning icon and tooltip"),a("smoothly-input",{key:"817b52d0ef2e31056e8ee8a7faab79990797c732",copyable:true,name:"alphanumeric",invalid:!/^[a-zA-Z0-9]+$/.test(this.alphanumeric),errorMessage:"Only alphanumeric allowed",value:this.alphanumeric,onSmoothlyInput:e=>this.alphanumeric=e.detail.alphanumeric},"Alphanumeric"),a("h2",{key:"cd628bebd9e2b9de77eb82b0f9591cfe8d7b3ca2"},"Identifiers"),a("smoothly-input",{key:"fe1d2d89f25cd8a60fd537bfb5a9580548491604",type:"identifier-code"},"Code"),a("smoothly-input",{key:"14d47570684ca9165381718becda2f318c9c88bf",type:"identifier-attribute"},"Attribute"),a("smoothly-input",{key:"fb5ed7f2a284640369bf648a548161d233756dd5",type:"identifier-snake"},"Snake"),a("smoothly-input",{key:"cde9cde9c787d99c0eaf75085f0567139b8130c8",type:"identifier-pascal"},"Pascal"),a("smoothly-input",{key:"509c743780e2d2f0d759ab3cff67893318256443",type:"identifier-camel"},"Camel"),a("h2",{key:"81ea90cb970b799945d3aeb14b70bb8184d911e4"},"Input Alternatives"),a("smoothly-input",{key:"01ba72593f0e056a20d87c8722e2bc4317932962",type:"text",name:"name.last"},a("smoothly-icon",{key:"70491c3ed08d7f0d13a3cd8eba72e47fa1de1008",name:"checkmark-circle",slot:"start"}),"First Name"),a("smoothly-input",{key:"ab3a45839ee4d8bacfac8ca96bcd7ec260ce36d9",type:"text",name:"name.first"},"Last Name",a("smoothly-icon",{key:"a7996638a9ec278f74d967e0fcb03dcaf4445315",name:"checkmark-circle",slot:"end"})),a("smoothly-input",{key:"f524fc067947a8637a1c416a74d3de0c37744255",type:"text",name:"name.first",placeholder:"Smith"},"Last Name",a("smoothly-icon",{key:"ec440199d9625155037e1cd9e614266748997f7a",name:"checkmark-circle",slot:"end"})),a("smoothly-input",{key:"27cc6d614a7bae4893462b5e708cb663bcffcec1",placeholder:"test"}),a("smoothly-input-submit",{key:"789ee37616c3c27e8e6414992be1f9ee2117a5d3",slot:"submit",fill:"solid",onSubmit:e=>alert(e),color:"success"}),a("h4",{key:"5c256926b8f451dca0b5297992f6a6312a2f5494"},"Smoothly checkboxes"),a("div",{key:"6650b3b1b27d5fbca72ef5679f03d11c3c5cc1a7",class:"checkbox-group"},a("smoothly-input-checkbox",{key:"9030dedf496556b87212376fbd15617f6abebf48",disabled:true,name:"first-checkbox"},a("smoothly-icon",{key:"e3a47da2376066cdfc082fbf4100adf340b70f36",name:"checkmark-circle",slot:"start",size:"tiny"}),"First"),a("smoothly-input-checkbox",{key:"d86dbe0e70d983c82791caf5729ed0510df48b4d",name:"second-checkbox",checked:true},a("smoothly-icon",{key:"28505106b36406f9a24fdd0f8f27dea211544f38",name:"checkmark-circle",slot:"start",size:"tiny"}),"second",a("smoothly-input-clear",{key:"7240cc38a40cfe3ca5ee3cdbb5ae971ebbf23efb",size:"icon",slot:"end"})),a("smoothly-input-checkbox",{key:"64df44307f15d6ca5878b5933b847931973a4bd4",name:"third-checkbox"},"3rd")),a("h4",{key:"d6cd694e036d14b16241a4664ed9e9a6b9257c80"},"Smoothly Radio Buttons"),a("smoothly-input-radio",{key:"43f5fe05e6889b3f009a85a996ca9f3df8418d85",clearable:true,name:"radioFirstInput"},a("smoothly-icon",{key:"67303cd42725a67937687862934c5eb4efb08617",name:"checkmark-circle",slot:"start"}),a("label",{key:"20faf3230a26de4d0578cc142212f849447826b0",slot:"label"},"Clearable"),a("smoothly-input-radio-item",{key:"c8f0663f1aca55d837179e535675837b8c5dc486",value:"first"},"Label 1"),a("smoothly-input-radio-item",{key:"f699d87b7edd1e815068671279f6454a071dd26f",selected:true,value:"second"},"Label 2"),a("smoothly-input-radio-item",{key:"6c76a26cbcf6c0279ea178a8c2fa5cb70d592614",value:"third"},"Label 3"),a("smoothly-input-clear",{key:"146770892b8d84fe6686d7d360b2c119271b068e",size:"icon",slot:"end"})),a("smoothly-input-radio",{key:"d15590998dacc095683e2a2149bd4d0008458c6c",name:"radioSecondInput"},a("label",{key:"91206150e39f16cc6b63c27e936e0890d085dd3c",slot:"label"},"Not clearable"),a("smoothly-input-radio-item",{key:"4be57f196fceca8c421b1a76539383e583815d47",value:"first"},"Label 1"),a("smoothly-input-radio-item",{key:"64fb53d589cbc3c41d2716bcd0a94e0852b61984",value:"second"},"Label 2"),a("smoothly-input-radio-item",{key:"cfd1618ca1085b04f892a0f7c41c3ba015817f8e",value:"third"},"Label 3"),a("smoothly-input-radio-item",{key:"5204c85dc39eb90eb2203f7bc95465fd3505e0ee",value:"fourth"},"Label 4"),a("smoothly-input-radio-item",{key:"7beb685e25cd77b0c4ee67d52c08d3dda77bbb43",value:"fifth"},"Label 5"),a("smoothly-input-radio-item",{key:"2e540abce5ef3a5ef00f9bf66e28d4dcc2dcf033",value:"sixth"},"Label 6")),a("smoothly-input-range-demo",{key:"0734d3ef8222645914a3de1baca3a564658155b2"}),a("smoothly-input-color-demo",{key:"4efc6abf40e3b21f406e0bc0c56e0b1549bf7c62"}),a("smoothly-input-price-demo",{key:"bd457e1f8ac312ee0feb1685bee15b7ec9cfd451"}),a("smoothly-back-to-top",{key:"a1795f547d9bcfc820f76df3e60f9611a8d654e8"})))}static get style(){return X()}},[2,"smoothly-input-demo",{duration:[32],alphanumeric:[32]}]);function O(){if(typeof customElements==="undefined"){return}const e=["smoothly-input-demo","smoothly-back-to-top","smoothly-button","smoothly-button-confirm","smoothly-calendar","smoothly-date-text","smoothly-display","smoothly-display-json","smoothly-display-json-object","smoothly-display-json-primitive","smoothly-display-json-record-key","smoothly-form","smoothly-icon","smoothly-input","smoothly-input-checkbox","smoothly-input-clear","smoothly-input-color","smoothly-input-color-demo","smoothly-input-date","smoothly-input-date-demo","smoothly-input-date-range","smoothly-input-date-time","smoothly-input-demo-radio","smoothly-input-demo-standard","smoothly-input-demo-user-input","smoothly-input-file","smoothly-input-month","smoothly-input-price-demo","smoothly-input-radio","smoothly-input-radio-item","smoothly-input-range","smoothly-input-range-demo","smoothly-input-reset","smoothly-input-select","smoothly-input-submit","smoothly-item","smoothly-spinner","smoothly-tab","smoothly-tabs","smoothly-toggle-switch"];e.forEach((e=>{switch(e){case"smoothly-input-demo":if(!customElements.get(c(e))){customElements.define(c(e),G)}break;case"smoothly-back-to-top":if(!customElements.get(c(e))){d()}break;case"smoothly-button":if(!customElements.get(c(e))){l()}break;case"smoothly-button-confirm":if(!customElements.get(c(e))){i()}break;case"smoothly-calendar":if(!customElements.get(c(e))){f()}break;case"smoothly-date-text":if(!customElements.get(c(e))){b()}break;case"smoothly-display":if(!customElements.get(c(e))){n()}break;case"smoothly-display-json":if(!customElements.get(c(e))){y()}break;case"smoothly-display-json-object":if(!customElements.get(c(e))){r()}break;case"smoothly-display-json-primitive":if(!customElements.get(c(e))){u()}break;case"smoothly-display-json-record-key":if(!customElements.get(c(e))){h()}break;case"smoothly-form":if(!customElements.get(c(e))){p()}break;case"smoothly-icon":if(!customElements.get(c(e))){k()}break;case"smoothly-input":if(!customElements.get(c(e))){v()}break;case"smoothly-input-checkbox":if(!customElements.get(c(e))){j()}break;case"smoothly-input-clear":if(!customElements.get(c(e))){g()}break;case"smoothly-input-color":if(!customElements.get(c(e))){E()}break;case"smoothly-input-color-demo":if(!customElements.get(c(e))){x()}break;case"smoothly-input-date":if(!customElements.get(c(e))){C()}break;case"smoothly-input-date-demo":if(!customElements.get(c(e))){S()}break;case"smoothly-input-date-range":if(!customElements.get(c(e))){w()}break;case"smoothly-input-date-time":if(!customElements.get(c(e))){D()}break;case"smoothly-input-demo-radio":if(!customElements.get(c(e))){L()}break;case"smoothly-input-demo-standard":if(!customElements.get(c(e))){z()}break;case"smoothly-input-demo-user-input":if(!customElements.get(c(e))){I()}break;case"smoothly-input-file":if(!customElements.get(c(e))){M()}break;case"smoothly-input-month":if(!customElements.get(c(e))){A()}break;case"smoothly-input-price-demo":if(!customElements.get(c(e))){N()}break;case"smoothly-input-radio":if(!customElements.get(c(e))){B()}break;case"smoothly-input-radio-item":if(!customElements.get(c(e))){F()}break;case"smoothly-input-range":if(!customElements.get(c(e))){Z()}break;case"smoothly-input-range-demo":if(!customElements.get(c(e))){H()}break;case"smoothly-input-reset":if(!customElements.get(c(e))){K()}break;case"smoothly-input-select":if(!customElements.get(c(e))){V()}break;case"smoothly-input-submit":if(!customElements.get(c(e))){_()}break;case"smoothly-item":if(!customElements.get(c(e))){J()}break;case"smoothly-spinner":if(!customElements.get(c(e))){Q()}break;case"smoothly-tab":if(!customElements.get(c(e))){R()}break;case"smoothly-tabs":if(!customElements.get(c(e))){q()}break;case"smoothly-toggle-switch":if(!customElements.get(c(e))){T()}break}}))}O();export{G as S,O as d};
|
|
2
|
+
//# sourceMappingURL=p-CDbQFx9i.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as t,h as o,d as s,t as a}from"./p-BsZrGTcp.js";import{i}from"./p-BVKhAhsB.js";import{d as m}from"./p-mmAi00ak.js";import{d as n}from"./p-CHjWijPI.js";import{d as r}from"./p-BE5E3Jm6.js";import{d as c}from"./p-CN3iME9d.js";import{d as l}from"./p-DG2pfnCV.js";import{d}from"./p-uFR5K4vd.js";import{d as h}from"./p-DvZK__s-.js";import{d as u}from"./p-F8qX8ZuL.js";import{d as p}from"./p-DFSiKg4M.js";import{d as f}from"./p-o8kM0Soe.js";import{d as y}from"./p-Dd9tz4Tj.js";import{d as b}from"./p-
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{p as e,H as t,h as o,d as s,t as a}from"./p-BsZrGTcp.js";import{i}from"./p-BVKhAhsB.js";import{d as m}from"./p-mmAi00ak.js";import{d as n}from"./p-CHjWijPI.js";import{d as r}from"./p-BE5E3Jm6.js";import{d as c}from"./p-CN3iME9d.js";import{d as l}from"./p-DG2pfnCV.js";import{d}from"./p-uFR5K4vd.js";import{d as h}from"./p-DvZK__s-.js";import{d as u}from"./p-F8qX8ZuL.js";import{d as p}from"./p-DFSiKg4M.js";import{d as f}from"./p-o8kM0Soe.js";import{d as y}from"./p-Dd9tz4Tj.js";import{d as b}from"./p-CaQWZMN4.js";import{d as k}from"./p-CtVEKtM6.js";import{d as j}from"./p-KZeR_6LG.js";import{d as g}from"./p-BSHxNVcQ.js";import{d as x}from"./p-MqffyRVU.js";import{d as E}from"./p-wjlHVReJ.js";import{d as v}from"./p-4Xn3Nprv.js";import{d as C}from"./p-PwCtk_DY.js";import{d as I}from"./p-BplZiuMF.js";import{d as S}from"./p-CVdJ19AA.js";import{d as U}from"./p-BsHachOX.js";const w=()=>`.sc-smoothly-input-demo-user-input-h{max-width:min(100%, 56rem);margin-inline:auto;display:grid;grid-template-columns:12rem 1fr;gap:1rem}.sc-smoothly-input-demo-user-input-h>div.sc-smoothly-input-demo-user-input{grid-column:1 / -1}@media (max-width: 48rem){.sc-smoothly-input-demo-user-input-h{grid-template-columns:1fr}}`;const N=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.values=["zero","one","two","three","four","five"];this.colors=["#ff0000","#00ff00","#0000ff","#ffff00","#00ffff","#ff00ff"]}increment(e){return e===undefined?0:(e+1)%this.values.length}render(){var e,t;return o(s,{key:"3835c578ea7d246169e793bf4aa2c7a51fa5363d"},o("div",{key:"7b58c28df58685c05871b3b2e0ac1be312929ade"},o("h2",{key:"51ad8ea9e3aac7d2b86c8fd174f3e9a48697c15e"},"User Input Event"),o("p",{key:"47cea5b74881ab7616adfae6ebce65da42dbb313"},"These inputs demonstrate how user input is handled. The ",o("code",{key:"2866d17687a295b23b453f5b1379e5e66bcbff41"},"smoothlyUserInput")," event fires only when the user interacts with an input, not when its value is changed programmatically (such as by clicking the buttons above).",o("br",{key:"e16f064c937a6f9308630304c583ea341f832ad9"}),"Check the console to see the details of each ",o("code",{key:"78979ae82ed46d5a06a595e02df97ba33c89d2c0"},"smoothlyUserInput")," event.")),o("smoothly-button",{key:"138b41ca59399b09ff53e52b129ae97748ed387f",color:"tertiary",onClick:()=>this.textIndex=this.increment(this.textIndex)},"Change text"),o("smoothly-input",{key:"7d09fa4861e311009ab12e3c60002de3301927ec",looks:"border",name:"demo-user-input-text",value:this.textIndex===undefined?"":this.values[this.textIndex],onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)},"Text input"),o("smoothly-button",{key:"0d502c95cb5db26bdce3ba41d15556da80d64433",onClick:()=>this.selectIndex=this.increment(this.selectIndex),color:"tertiary"},"Next select item"),o("smoothly-input-select",{key:"435dd06d5ce59811c106ca7c69b6dfa1be50c12a",looks:"border",name:"demo-user-input-select",onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)},o("span",{key:"33a6bd3e72cf03ec750a14924a837b7e684a8773",slot:"label"},"Select input"),this.values.map(((e,t)=>o("smoothly-item",{value:t,selected:t==this.selectIndex},e)))),o("smoothly-button",{key:"21adcb09ac47b9478957c45905170a860c49e1a8",color:"tertiary",onClick:()=>this.checkboxChecked=!this.checkboxChecked},"Toggle checkbox"),o("smoothly-input-checkbox",{key:"359e7c7c033b09f9245ebc6be57bd34219d78ecf",looks:"border",name:"demo-user-input-checkbox",checked:this.checkboxChecked,onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)},"Checkbox input"),o("smoothly-button",{key:"51fa448a76d00d5f1998ad57f03d21a054e8113a",color:"tertiary",onClick:()=>this.radioIndex=this.increment(this.radioIndex)},"Next radio item"),o("smoothly-input-radio",{key:"b59321ca66af38b90a01d2eb3d0e17f18a904095",looks:"border",name:"demo-user-input-radio",onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)},o("span",{key:"fc5fb9f656c6c6e999a552dced58d28a8acd1ef8",slot:"label"},"Radio input"),this.values.map(((e,t)=>o("smoothly-input-radio-item",{value:e,selected:t==this.radioIndex},e)))),o("smoothly-button",{key:"b200be8a41c98d4f219a9f3530f3558fa971689c",color:"tertiary",onClick:()=>this.rangeValue=this.increment(this.rangeValue)},"Next range value"),o("smoothly-input-range",{key:"dd284aa8c1ea6ad1cf4f0881250c105cb2a6ff0c",looks:"border",name:"demo-user-input-range",step:1,min:0,max:this.values.length,value:this.rangeValue,label:"Range Input",onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)}),o("smoothly-button",{key:"20cc5a84fa556220aef39a2ae15ae412ea2fef0c",color:"tertiary",onClick:()=>this.colorIndex=this.increment(this.colorIndex)},"Next color"),o("smoothly-input-color",{key:"7590af1c0425b6219743d81726e05164b970187c",looks:"border",name:"demo-user-input-color",value:typeof this.colorIndex=="number"?this.colors[this.colorIndex]:undefined,onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)},"Color input"),o("smoothly-button",{key:"3b3cc2b584fc194bd1386a710cbbbbf50e2968fc",color:"tertiary",onClick:()=>this.dateValue=this.dateValue?i.Date.next(this.dateValue):i.Date.now()},"Next day"),o("smoothly-input-date",{key:"f38b4dd2f3e9bbf56f998ba8ede15b3c47b8dfee",looks:"border",name:"demo-user-input-date",value:this.dateValue,onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)},"Date input"),o("smoothly-button",{key:"dc47c4b5003bfe3c2b9408d56a2b0646fa7d60b9",color:"tertiary",onClick:()=>this.datetimeValue=this.datetimeValue?i.DateTime.nextDay(this.datetimeValue):i.DateTime.now()},"Next date time"),o("smoothly-input-date-time",{key:"564c412728fabb0a62c8344fb4f8f833805eda2a",looks:"border",name:"demo-user-input-datetime",value:this.datetimeValue,onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)},"Date time input"),o("smoothly-button",{key:"4028e3bc5a9625b4c0d302c1e856f618bf59fb22",color:"tertiary",onClick:()=>this.dateRangeValue=this.dateRangeValue?{start:i.Date.next(this.dateRangeValue.start),end:i.Date.next(this.dateRangeValue.end)}:{start:i.Date.now(),end:i.Date.next(i.Date.now(),10)}},"Next date range"),o("smoothly-input-date-range",{key:"6416081389e857c3c18d2fad0dc11159a2aa93a6",looks:"border",name:"demo-user-input-daterange",start:(e=this.dateRangeValue)===null||e===void 0?void 0:e.start,end:(t=this.dateRangeValue)===null||t===void 0?void 0:t.end,onSmoothlyUserInput:e=>console.debug(e.type,e.detail.name,e.detail.value)},"Date range input"))}static get style(){return w()}},[2,"smoothly-input-demo-user-input",{textIndex:[32],selectIndex:[32],checkboxChecked:[32],radioIndex:[32],rangeValue:[32],colorIndex:[32],dateValue:[32],datetimeValue:[32],dateRangeValue:[32]}]);function V(){if(typeof customElements==="undefined"){return}const e=["smoothly-input-demo-user-input","smoothly-button","smoothly-calendar","smoothly-date-text","smoothly-display","smoothly-display-json","smoothly-display-json-object","smoothly-display-json-primitive","smoothly-display-json-record-key","smoothly-icon","smoothly-input","smoothly-input-checkbox","smoothly-input-color","smoothly-input-date","smoothly-input-date-range","smoothly-input-date-time","smoothly-input-month","smoothly-input-radio","smoothly-input-radio-item","smoothly-input-range","smoothly-input-select","smoothly-item","smoothly-toggle-switch"];e.forEach((e=>{switch(e){case"smoothly-input-demo-user-input":if(!customElements.get(a(e))){customElements.define(a(e),N)}break;case"smoothly-button":if(!customElements.get(a(e))){m()}break;case"smoothly-calendar":if(!customElements.get(a(e))){n()}break;case"smoothly-date-text":if(!customElements.get(a(e))){r()}break;case"smoothly-display":if(!customElements.get(a(e))){c()}break;case"smoothly-display-json":if(!customElements.get(a(e))){l()}break;case"smoothly-display-json-object":if(!customElements.get(a(e))){d()}break;case"smoothly-display-json-primitive":if(!customElements.get(a(e))){h()}break;case"smoothly-display-json-record-key":if(!customElements.get(a(e))){u()}break;case"smoothly-icon":if(!customElements.get(a(e))){p()}break;case"smoothly-input":if(!customElements.get(a(e))){f()}break;case"smoothly-input-checkbox":if(!customElements.get(a(e))){y()}break;case"smoothly-input-color":if(!customElements.get(a(e))){b()}break;case"smoothly-input-date":if(!customElements.get(a(e))){k()}break;case"smoothly-input-date-range":if(!customElements.get(a(e))){j()}break;case"smoothly-input-date-time":if(!customElements.get(a(e))){g()}break;case"smoothly-input-month":if(!customElements.get(a(e))){x()}break;case"smoothly-input-radio":if(!customElements.get(a(e))){E()}break;case"smoothly-input-radio-item":if(!customElements.get(a(e))){v()}break;case"smoothly-input-range":if(!customElements.get(a(e))){C()}break;case"smoothly-input-select":if(!customElements.get(a(e))){I()}break;case"smoothly-item":if(!customElements.get(a(e))){S()}break;case"smoothly-toggle-switch":if(!customElements.get(a(e))){U()}break}}))}V();export{N as S,V as d};
|
|
2
|
+
//# sourceMappingURL=p-CYxd1Pkd.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as o,H as t,c as s,h as l,d as i,t as r}from"./p-BsZrGTcp.js";import{C as n}from"./p-Br0kWrBT.js";import"./p-BVKhAhsB.js";import"./p-DoFURPl2.js";import{E as e}from"./p-iQDU7l2c.js";import{I as h}from"./p-vvQg46ti.js";import{d as c}from"./p-CN3iME9d.js";import{d as a}from"./p-DG2pfnCV.js";import{d as u}from"./p-uFR5K4vd.js";import{d}from"./p-DvZK__s-.js";import{d as m}from"./p-F8qX8ZuL.js";import{d as p}from"./p-DFSiKg4M.js";import{d as y}from"./p-o8kM0Soe.js";import{d as b}from"./p-j4UEmpTa.js";import{d as g}from"./p-BsHachOX.js";const v=()=>`.sc-smoothly-input-color-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}[looks="border"].sc-smoothly-input-color-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks="border"].sc-smoothly-input-color-h:not([readonly]):not([disabled]):focus-within{outline:2px solid rgb(var(--smoothly-input-border-focus))}[looks="border"][readonly].sc-smoothly-input-color-h{border:transparent solid 1px}[looks="line"].sc-smoothly-input-color-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px;position:relative}[looks="line"][readonly].sc-smoothly-input-color-h{border-bottom:transparent solid 1px}[looks="line"].sc-smoothly-input-color-h:not([readonly]):not([disabled]):focus-within::before{content:"";position:absolute;inset:0;pointer-events:none;border-bottom:2px solid rgb(var(--smoothly-input-border-focus));z-index:10}[looks="grid"].sc-smoothly-input-color-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks="grid"][readonly].sc-smoothly-input-color-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks="grid"].sc-smoothly-input-color-h:not([readonly]):not([disabled]):focus-within{position:relative;box-shadow:0px 0px 0px 2px rgb(var(--smoothly-input-border-focus));outline:none;z-index:10}[looks="transparent"].sc-smoothly-input-color-h{border:none}[looks="transparent"][readonly].sc-smoothly-input-color-h,[looks="transparent"].sc-smoothly-input-color-h:not(:focus-within){background-color:transparent}[looks="transparent"][readonly].sc-smoothly-input-color-h>input.sc-smoothly-input-color,[looks="transparent"].sc-smoothly-input-color-h:not(:focus-within)>input.sc-smoothly-input-color{background-color:transparent}[looks="transparent"].sc-smoothly-input-color-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}[disabled].sc-smoothly-input-color-h{cursor:not-allowed;--smoothly-input-foreground:var(--smoothly-input-disabled-foreground);--smoothly-input-background:var(--smoothly-input-disabled-background);--smoothly-input-border:var(--smoothly-input-disabled-border)}.sc-smoothly-input-color-h.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h .label.sc-smoothly-input-color{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}[right].sc-smoothly-input-color-h .label.sc-smoothly-input-color{transform-origin:top right}.sc-smoothly-input-color-h.floating-label.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.floating-label .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.has-value.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.has-value .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[placeholder].sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[placeholder] .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[readonly].sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[readonly] .sc-smoothly-input-color-s>[slot=label],.floating-label.sc-smoothly-input-color-h .label.sc-smoothly-input-color,.has-value.sc-smoothly-input-color-h .label.sc-smoothly-input-color,.has-text.sc-smoothly-input-color-h .label.sc-smoothly-input-color,[placeholder].sc-smoothly-input-color-h .label.sc-smoothly-input-color,[readonly].sc-smoothly-input-color-h .label.sc-smoothly-input-color,.sc-smoothly-input-color-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-color{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-color-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-color{display:none}.sc-smoothly-input-color-h smoothly-icon.smoothly-invalid.sc-smoothly-input-color{fill:rgb(var(--smoothly-input-invalid-icon, var(--smoothly-danger-color)))}.sc-smoothly-input-color-h{display:flex;position:relative;background-color:rgb(var(--smoothly-input-background));align-items:center;justify-content:center}.sc-smoothly-input-color-h>smoothly-input.sc-smoothly-input-color{width:100%;--input-min-height:calc(var(--input-min-height) - 2px);--smoothly-input-border-focus:none}.sc-smoothly-input-color-h div.color-sample.sc-smoothly-input-color{height:2em;width:3em;margin-right:0.5rem;background-color:var(--hexCode);outline:1px solid rgb(var(--smoothly-input-border));border-radius:3px}.sc-smoothly-input-color-h smoothly-icon[name=options-outline].sc-smoothly-input-color{padding-right:var(--input-padding-side)}[readonly].sc-smoothly-input-color-h smoothly-icon[name=options-outline].sc-smoothly-input-color,[disabled].sc-smoothly-input-color-h smoothly-icon[name=options-outline].sc-smoothly-input-color{display:none}.sc-smoothly-input-color-h:not([readonly]):not([disabled]) smoothly-icon[name=options-outline].sc-smoothly-input-color{cursor:pointer}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color{background-color:rgb(var(--smoothly-input-background));position:absolute;padding:1rem 0 1rem 2.5rem;top:calc(var(--element-height) + .8em);left:0;box-sizing:border-box;z-index:20;border:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color::before{content:"";transform:translate(2em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-input-background));border-top:1px solid rgb(var(--smoothly-input-border));border-left:1px solid rgb(var(--smoothly-input-border));position:absolute;z-index:100;top:0em}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color>smoothly-toggle-switch.sc-smoothly-input-color{margin-left:auto;margin-right:1em;margin-bottom:1em}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color{padding:.5em 0}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color label.sc-smoothly-input-color{width:4em}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(255, var(--rgb-g), var(--rgb-b)), rgb(0, var(--rgb-g), var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(255, var(--rgb-g), var(--rgb-b)), rgb(0, var(--rgb-g), var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-moz-range-thumb{background-color:red}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-webkit-slider-thumb{background-color:red}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(var(--rgb-r), 255, var(--rgb-b)), rgb(var(--rgb-r), 0, var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(var(--rgb-r), 255, var(--rgb-b)), rgb(var(--rgb-r), 0, var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-moz-range-thumb{background-color:green}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-webkit-slider-thumb{background-color:green}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(var(--rgb-r), var(--rgb-g), 255), rgb(var(--rgb-r), var(--rgb-g), 0))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(var(--rgb-r), var(--rgb-g), 255), rgb(var(--rgb-r), var(--rgb-g), 0))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-moz-range-thumb{background-color:blue}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-webkit-slider-thumb{background-color:blue}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right in hsl longer hue, red, red)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right in hsl longer hue, red, red)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-webkit-slider-thumb{background-color:hsl(var(--hsl-h), 100%, 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-moz-range-thumb{background-color:hsl(var(--hsl-h), 100%, 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right, hsl(var(--hsl-h), 0%, 50%), hsl(var(--hsl-h), 100%, 50%))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right, hsl(var(--hsl-h), 0%, 50%), hsl(var(--hsl-h), 100%, 50%))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-moz-range-thumb{background-color:hsl(var(--hsl-h), var(--hsl-s), 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-webkit-slider-thumb{background-color:hsl(var(--hsl-h), var(--hsl-s), 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right, black, white)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right, black, white)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-moz-range-thumb{background-color:#777}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-webkit-slider-thumb{background-color:#777}`;const f=o(class o extends t{constructor(o){super();if(o!==false){this.__registerHost()}this.smoothlyInputLooks=s(this,"smoothlyInputLooks");this.smoothlyInput=s(this,"smoothlyInput");this.smoothlyUserInput=s(this,"smoothlyUserInput");this.smoothlyInputLoad=s(this,"smoothlyInputLoad");this.smoothlyFormDisable=s(this,"smoothlyFormDisable");this.isDifferentFromInitial=false;this.observer=e.Observer.create(this);this.rgb={r:undefined,g:undefined,b:undefined};this.hsl={h:undefined,s:undefined,l:undefined};this.value=undefined;this.readonly=false;this.output="rgb";this.showLabel=true;this.open=false;this.sliderMode="rgb"}async componentWillLoad(){this.value&&this.setInitialValue();this.value&&(this.rgb=n.Hex.toRGB(this.value));this.smoothlyInputLooks.emit(((o,t)=>{var s;return this.looks=(s=this.looks)!==null&&s!==void 0?s:o,this.color=t}));this.smoothlyInput.emit({[this.name]:await this.getValue()});this.smoothlyInputLoad.emit((o=>this.parent=o));!this.readonly&&this.smoothlyFormDisable.emit((o=>this.readonly=o))}smoothlyInputLooksHandler(o){if(o.target!=this.element){o.stopPropagation()}}smoothlyInputLoadHandler(o){h.registerSubAction(this,o)}onWindowClick(o){!o.composedPath().includes(this.element)&&this.open&&(this.open=!this.open)}async disconnectedCallback(){if(!this.element.isConnected){await this.unregister()}}nameChange(o,t){h.formRename(this,t)}watchingReadonly(){this.observer.publish()}async register(){h.formAdd(this)}async unregister(){h.formRemove(this)}async getValue(){return this.output==="rgb"?{r:this.rgb.r===undefined?undefined:Math.round(this.rgb.r),g:this.rgb.g===undefined?undefined:Math.round(this.rgb.g),b:this.rgb.b===undefined?undefined:Math.round(this.rgb.b)}:this.value?this.value:undefined}async clear(){this.rgb={r:undefined,g:undefined,b:undefined};this.hsl={h:undefined,s:undefined,l:undefined};this.value=undefined}async listen(o){this.observer.subscribe(o)}async edit(o){this.readonly=!o;this.open=false}async reset(){this.value=this.initialValue;this.open=false}async setInitialValue(){this.initialValue=this.value;this.open=false}async valueChanged(){this.isDifferentFromInitial=this.initialValue!==this.value;this.smoothlyInput.emit({[this.name]:await this.getValue()});this.observer.publish()}handleSwitchMode(o){o.stopPropagation();this.sliderMode=o.detail?"hsl":"rgb";if(this.sliderMode==="rgb"){this.value&&(this.rgb=n.Hex.toRGB(this.value))}else{this.value&&(this.hsl=n.RGB.toHSL(n.Hex.toRGB(this.value)))}}async hexInputHandler(o){if(o!==this.value){if(o&&n.Hex.type.is(o)){if(this.sliderMode==="hsl"||this.rgb.r===undefined){this.rgb=n.Hex.toRGB(o)}if(this.sliderMode==="rgb"||this.hsl.h===undefined){this.hsl=n.RGB.toHSL(n.Hex.toRGB(o))}}else if(!o||!n.Hex.type.is(o)){this.rgb={r:undefined,g:undefined,b:undefined};this.hsl={h:undefined,s:undefined,l:undefined}}this.value=o;this.smoothlyUserInput.emit({name:this.name,value:await this.getValue()})}}sliderInputHandler(o){var t;o.stopPropagation();const s=Object.keys(o.detail)[0];let l=this.sliderMode==="rgb"?this.rgb:this.hsl;if(!(o.detail[s]===undefined)){for(const i of Object.keys(l)){if(i===s){l=Object.assign(Object.assign({},l),{[i]:i==="s"||i==="l"?+((t=o.detail[s])!==null&&t!==void 0?t:0)*100:o.detail[s]})}else if(l[i]===undefined){l=Object.assign(Object.assign({},l),{[i]:0})}}if(this.sliderMode==="rgb"){this.rgb=Object.assign({},l);this.hsl=n.RGB.toHSL(this.rgb);this.hexInputHandler(n.RGB.toHex(this.rgb))}else{this.hsl=Object.assign({},l);this.rgb=n.HSL.toRGB(this.hsl);this.hexInputHandler(n.RGB.toHex(n.HSL.toRGB(this.hsl)))}}}openDropdown(){this.open=!this.open}render(){var o,t,s,r,n,e;return l(i,{key:"4db4d9329eaee9cad54871a66e4ea406e04a5b92",style:{"--hexCode":this.value,"--rgb-r":`${Math.round((o=this.rgb.r)!==null&&o!==void 0?o:0)}`,"--rgb-g":`${Math.round((t=this.rgb.g)!==null&&t!==void 0?t:0)}`,"--rgb-b":`${Math.round((s=this.rgb.b)!==null&&s!==void 0?s:0)}`,"--hsl-h":`${Math.round((r=this.hsl.h)!==null&&r!==void 0?r:0)}`,"--hsl-s":`${Math.round((n=this.hsl.s)!==null&&n!==void 0?n:0)}%`,"--hsl-l":`${Math.round((e=this.hsl.l)!==null&&e!==void 0?e:0)}%`,"--element-height":`${this.element.clientHeight}px`}},l("smoothly-input",{key:"d3fe0aeedcd45bacc1d38e75d7d5e97be3992a34",value:this.value,color:this.color,looks:undefined,name:this.name,type:"hex-color",readonly:this.readonly,disabled:this.disabled,showLabel:this.showLabel,onSmoothlyInput:o=>(o===null||o===void 0?void 0:o.stopPropagation(),this.hexInputHandler(o.detail[this.name]))},l("slot",{key:"77f78c79097fc43d15b453044170290e25c1bfc2"})),l("div",{key:"f8c144c3cfdc9ef249c941f492b009030eb97dda",class:"color-sample"}),l("smoothly-icon",{key:"8d29d95ef7cbc08cdf429088e9f005a02544ecad",color:this.color,name:"options-outline",size:"small",onClick:()=>!this.readonly&&!this.disabled&&this.openDropdown()}),l("div",{key:"8efce2fd4ca6fbde9968bddd60b54cb6e097091e"},l("slot",{key:"fd99776b1a150dd549d69e013124308ab6d2f16f",name:"end"})),this.open&&!this.readonly&&!this.disabled&&l("div",{key:"67b8c3fb973292a65257eedb64ac7a01044843d2",class:"rgb-sliders"},l("smoothly-toggle-switch",{key:"f576c2ce5b277209b94c8560e559299c715ea1e1",title:`${this.sliderMode==="rgb"?"To HSL":"To RGB"}`,onSmoothlyToggleSwitchChange:o=>this.handleSwitchMode(o),size:"tiny",checkmark:false,selected:this.sliderMode==="hsl"}),Object.entries(this.rgb).map((([o,t])=>l("smoothly-input-range",{style:this.sliderMode!="rgb"?{display:"none"}:{},name:o,min:0,max:255,color:undefined,type:"text",value:t,step:1,outputSide:"right",onSmoothlyInput:o=>this.sliderInputHandler(o),onSmoothlyUserInput:o=>o.stopPropagation(),label:o.toUpperCase()}))),Object.entries(this.hsl).map((([o,t])=>l("smoothly-input-range",{style:this.sliderMode!="hsl"?{display:"none"}:{},name:o,min:0,max:o==="h"?359:1,color:undefined,type:o==="s"||o==="l"?"percent":"text",value:(o==="s"||o==="l")&&t?t/100:t,step:o==="s"||o==="l"?.01:1,outputSide:"right",onSmoothlyInput:o=>this.sliderInputHandler(o),onSmoothlyUserInput:o=>o.stopPropagation(),label:o.toUpperCase()})))))}get element(){return this}static get watchers(){return{name:[{nameChange:0}],disabled:[{watchingReadonly:0}],readonly:[{watchingReadonly:0}],value:[{valueChanged:0}]}}static get style(){return v()}},[262,"smoothly-input-color",{value:[1025],looks:[1537],color:[1537],readonly:[1540],disabled:[516],output:[1],name:[513],showLabel:[516,"show-label"],open:[32],sliderMode:[32],register:[64],unregister:[64],getValue:[64],clear:[64],listen:[64],edit:[64],reset:[64],setInitialValue:[64]},[[0,"smoothlyInputLooks","smoothlyInputLooksHandler"],[0,"smoothlyInputLoad","smoothlyInputLoadHandler"],[8,"click","onWindowClick"]],{name:[{nameChange:0}],disabled:[{watchingReadonly:0}],readonly:[{watchingReadonly:0}],value:[{valueChanged:0}]}]);function k(){if(typeof customElements==="undefined"){return}const o=["smoothly-input-color","smoothly-display","smoothly-display-json","smoothly-display-json-object","smoothly-display-json-primitive","smoothly-display-json-record-key","smoothly-icon","smoothly-input","smoothly-input-range","smoothly-toggle-switch"];o.forEach((o=>{switch(o){case"smoothly-input-color":if(!customElements.get(r(o))){customElements.define(r(o),f)}break;case"smoothly-display":if(!customElements.get(r(o))){c()}break;case"smoothly-display-json":if(!customElements.get(r(o))){a()}break;case"smoothly-display-json-object":if(!customElements.get(r(o))){u()}break;case"smoothly-display-json-primitive":if(!customElements.get(r(o))){d()}break;case"smoothly-display-json-record-key":if(!customElements.get(r(o))){m()}break;case"smoothly-icon":if(!customElements.get(r(o))){p()}break;case"smoothly-input":if(!customElements.get(r(o))){y()}break;case"smoothly-input-range":if(!customElements.get(r(o))){b()}break;case"smoothly-toggle-switch":if(!customElements.get(r(o))){g()}break}}))}k();export{f as S,k as d};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{p as o,H as t,c as s,h as l,d as i,t as r}from"./p-BsZrGTcp.js";import{C as n}from"./p-Br0kWrBT.js";import"./p-BVKhAhsB.js";import"./p-DoFURPl2.js";import{E as e}from"./p-iQDU7l2c.js";import{I as h}from"./p-vvQg46ti.js";import{d as c}from"./p-CN3iME9d.js";import{d as a}from"./p-DG2pfnCV.js";import{d as u}from"./p-uFR5K4vd.js";import{d}from"./p-DvZK__s-.js";import{d as m}from"./p-F8qX8ZuL.js";import{d as p}from"./p-DFSiKg4M.js";import{d as y}from"./p-o8kM0Soe.js";import{d as b}from"./p-PwCtk_DY.js";import{d as g}from"./p-BsHachOX.js";const v=()=>`.sc-smoothly-input-color-h{--input-padding-side:.5rem;--input-value-padding-top:1.25rem;--input-value-padding-bottom:.25rem;--input-min-height:3rem;min-height:var(--input-min-height);box-sizing:border-box;border-radius:var(--smoothly-input-border-radius)}[looks="border"].sc-smoothly-input-color-h{border:rgb(var(--smoothly-input-border)) solid 1px}[looks="border"].sc-smoothly-input-color-h:not([readonly]):not([disabled]):focus-within{outline:2px solid rgb(var(--smoothly-input-border-focus))}[looks="border"][readonly].sc-smoothly-input-color-h{border:transparent solid 1px}[looks="line"].sc-smoothly-input-color-h{border-bottom:rgb(var(--smoothly-input-border)) solid 1px;position:relative}[looks="line"][readonly].sc-smoothly-input-color-h{border-bottom:transparent solid 1px}[looks="line"].sc-smoothly-input-color-h:not([readonly]):not([disabled]):focus-within::before{content:"";position:absolute;inset:0;pointer-events:none;border-bottom:2px solid rgb(var(--smoothly-input-border-focus));z-index:10}[looks="grid"].sc-smoothly-input-color-h{flex-grow:1;flex-basis:40%;box-shadow:0px 0px 0px 1px rgb(var(--smoothly-input-border));border:none}[looks="grid"][readonly].sc-smoothly-input-color-h{box-shadow:0px 0px 0px 1px rgba(var(--smoothly-input-border-readonly))}[looks="grid"].sc-smoothly-input-color-h:not([readonly]):not([disabled]):focus-within{position:relative;box-shadow:0px 0px 0px 2px rgb(var(--smoothly-input-border-focus));outline:none;z-index:10}[looks="transparent"].sc-smoothly-input-color-h{border:none}[looks="transparent"][readonly].sc-smoothly-input-color-h,[looks="transparent"].sc-smoothly-input-color-h:not(:focus-within){background-color:transparent}[looks="transparent"][readonly].sc-smoothly-input-color-h>input.sc-smoothly-input-color,[looks="transparent"].sc-smoothly-input-color-h:not(:focus-within)>input.sc-smoothly-input-color{background-color:transparent}[looks="transparent"].sc-smoothly-input-color-h:not([readonly]):focus-within{outline:1px solid rgb(var(--smoothly-input-border))}[disabled].sc-smoothly-input-color-h{cursor:not-allowed;--smoothly-input-foreground:var(--smoothly-input-disabled-foreground);--smoothly-input-background:var(--smoothly-input-disabled-background);--smoothly-input-border:var(--smoothly-input-disabled-border)}.sc-smoothly-input-color-h.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h .label.sc-smoothly-input-color{position:absolute;top:.6rem;opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}[right].sc-smoothly-input-color-h .label.sc-smoothly-input-color{transform-origin:top right}.sc-smoothly-input-color-h.floating-label.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.floating-label .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.has-value.sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h.has-value .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[placeholder].sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[placeholder] .sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[readonly].sc-smoothly-input-color-s>[slot=label],.sc-smoothly-input-color-h[readonly] .sc-smoothly-input-color-s>[slot=label],.floating-label.sc-smoothly-input-color-h .label.sc-smoothly-input-color,.has-value.sc-smoothly-input-color-h .label.sc-smoothly-input-color,.has-text.sc-smoothly-input-color-h .label.sc-smoothly-input-color,[placeholder].sc-smoothly-input-color-h .label.sc-smoothly-input-color,[readonly].sc-smoothly-input-color-h .label.sc-smoothly-input-color,.sc-smoothly-input-color-h:not([readonly]):focus-within .label.float-on-focus.sc-smoothly-input-color{top:.2rem;transform:scale(0.8)}.sc-smoothly-input-color-h:not([show-label]):not(.show-label) .label.sc-smoothly-input-color{display:none}.sc-smoothly-input-color-h smoothly-icon.smoothly-invalid.sc-smoothly-input-color{fill:rgb(var(--smoothly-input-invalid-icon, var(--smoothly-danger-color)))}.sc-smoothly-input-color-h{display:flex;position:relative;background-color:rgb(var(--smoothly-input-background));align-items:center;justify-content:center}.sc-smoothly-input-color-h>smoothly-input.sc-smoothly-input-color{width:100%;--input-min-height:calc(var(--input-min-height) - 2px);--smoothly-input-border-focus:none}.sc-smoothly-input-color-h div.color-sample.sc-smoothly-input-color{height:2em;width:3em;margin-right:0.5rem;background-color:var(--hexCode);outline:1px solid rgb(var(--smoothly-input-border));border-radius:3px}.sc-smoothly-input-color-h smoothly-icon[name=options-outline].sc-smoothly-input-color{padding-right:var(--input-padding-side)}[readonly].sc-smoothly-input-color-h smoothly-icon[name=options-outline].sc-smoothly-input-color,[disabled].sc-smoothly-input-color-h smoothly-icon[name=options-outline].sc-smoothly-input-color{display:none}.sc-smoothly-input-color-h:not([readonly]):not([disabled]) smoothly-icon[name=options-outline].sc-smoothly-input-color{cursor:pointer}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color{background-color:rgb(var(--smoothly-input-background));position:absolute;padding:1rem 0 1rem 2.5rem;top:calc(var(--element-height) + .8em);left:0;box-sizing:border-box;z-index:20;border:1px solid rgb(var(--smoothly-input-border))}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color::before{content:"";transform:translate(2em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-input-background));border-top:1px solid rgb(var(--smoothly-input-border));border-left:1px solid rgb(var(--smoothly-input-border));position:absolute;z-index:100;top:0em}.sc-smoothly-input-color-h>div.rgb-sliders.sc-smoothly-input-color>smoothly-toggle-switch.sc-smoothly-input-color{margin-left:auto;margin-right:1em;margin-bottom:1em}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color{padding:.5em 0}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color label.sc-smoothly-input-color{width:4em}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(255, var(--rgb-g), var(--rgb-b)), rgb(0, var(--rgb-g), var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(255, var(--rgb-g), var(--rgb-b)), rgb(0, var(--rgb-g), var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-moz-range-thumb{background-color:red}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=r].sc-smoothly-input-color::-webkit-slider-thumb{background-color:red}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(var(--rgb-r), 255, var(--rgb-b)), rgb(var(--rgb-r), 0, var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(var(--rgb-r), 255, var(--rgb-b)), rgb(var(--rgb-r), 0, var(--rgb-b)))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-moz-range-thumb{background-color:green}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=g].sc-smoothly-input-color::-webkit-slider-thumb{background-color:green}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to left, rgb(var(--rgb-r), var(--rgb-g), 255), rgb(var(--rgb-r), var(--rgb-g), 0))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to left, rgb(var(--rgb-r), var(--rgb-g), 255), rgb(var(--rgb-r), var(--rgb-g), 0))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-moz-range-thumb{background-color:blue}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=b].sc-smoothly-input-color::-webkit-slider-thumb{background-color:blue}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right in hsl longer hue, red, red)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right in hsl longer hue, red, red)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-webkit-slider-thumb{background-color:hsl(var(--hsl-h), 100%, 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=h].sc-smoothly-input-color::-moz-range-thumb{background-color:hsl(var(--hsl-h), 100%, 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right, hsl(var(--hsl-h), 0%, 50%), hsl(var(--hsl-h), 100%, 50%))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right, hsl(var(--hsl-h), 0%, 50%), hsl(var(--hsl-h), 100%, 50%))}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-moz-range-thumb{background-color:hsl(var(--hsl-h), var(--hsl-s), 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=s].sc-smoothly-input-color::-webkit-slider-thumb{background-color:hsl(var(--hsl-h), var(--hsl-s), 50%)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-moz-range-track{background:linear-gradient(to right, black, white)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-webkit-slider-runnable-track{background:linear-gradient(to right, black, white)}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-moz-range-thumb{background-color:#777}div.rgb-sliders.sc-smoothly-input-color smoothly-input-range.sc-smoothly-input-color>div.sc-smoothly-input-color>input[name=l].sc-smoothly-input-color::-webkit-slider-thumb{background-color:#777}`;const f=o(class o extends t{constructor(o){super();if(o!==false){this.__registerHost()}this.smoothlyInputLooks=s(this,"smoothlyInputLooks");this.smoothlyInput=s(this,"smoothlyInput");this.smoothlyUserInput=s(this,"smoothlyUserInput");this.smoothlyInputLoad=s(this,"smoothlyInputLoad");this.smoothlyFormDisable=s(this,"smoothlyFormDisable");this.isDifferentFromInitial=false;this.observer=e.Observer.create(this);this.rgb={r:undefined,g:undefined,b:undefined};this.hsl={h:undefined,s:undefined,l:undefined};this.value=undefined;this.readonly=false;this.output="rgb";this.showLabel=true;this.open=false;this.sliderMode="rgb"}async componentWillLoad(){this.value&&this.setInitialValue();this.value&&(this.rgb=n.Hex.toRGB(this.value));this.smoothlyInputLooks.emit(((o,t)=>{var s;return this.looks=(s=this.looks)!==null&&s!==void 0?s:o,this.color=t}));this.smoothlyInput.emit({[this.name]:await this.getValue()});this.smoothlyInputLoad.emit((o=>this.parent=o));!this.readonly&&this.smoothlyFormDisable.emit((o=>this.readonly=o))}smoothlyInputLooksHandler(o){if(o.target!=this.element){o.stopPropagation()}}smoothlyInputLoadHandler(o){h.registerSubAction(this,o)}onWindowClick(o){!o.composedPath().includes(this.element)&&this.open&&(this.open=!this.open)}async disconnectedCallback(){if(!this.element.isConnected){await this.unregister()}}nameChange(o,t){h.formRename(this,t)}watchingReadonly(){this.observer.publish()}async register(){h.formAdd(this)}async unregister(){h.formRemove(this)}async getValue(){return this.output==="rgb"?{r:this.rgb.r===undefined?undefined:Math.round(this.rgb.r),g:this.rgb.g===undefined?undefined:Math.round(this.rgb.g),b:this.rgb.b===undefined?undefined:Math.round(this.rgb.b)}:this.value?this.value:undefined}async clear(){this.rgb={r:undefined,g:undefined,b:undefined};this.hsl={h:undefined,s:undefined,l:undefined};this.value=undefined}async listen(o){this.observer.subscribe(o)}async edit(o){this.readonly=!o;this.open=false}async reset(){this.value=this.initialValue;this.open=false}async setInitialValue(){this.initialValue=this.value;this.open=false}async valueChanged(){this.isDifferentFromInitial=this.initialValue!==this.value;this.smoothlyInput.emit({[this.name]:await this.getValue()});this.observer.publish()}handleSwitchMode(o){o.stopPropagation();this.sliderMode=o.detail?"hsl":"rgb";if(this.sliderMode==="rgb"){this.value&&(this.rgb=n.Hex.toRGB(this.value))}else{this.value&&(this.hsl=n.RGB.toHSL(n.Hex.toRGB(this.value)))}}async hexInputHandler(o){if(o!==this.value){if(o&&n.Hex.type.is(o)){if(this.sliderMode==="hsl"||this.rgb.r===undefined){this.rgb=n.Hex.toRGB(o)}if(this.sliderMode==="rgb"||this.hsl.h===undefined){this.hsl=n.RGB.toHSL(n.Hex.toRGB(o))}}else if(!o||!n.Hex.type.is(o)){this.rgb={r:undefined,g:undefined,b:undefined};this.hsl={h:undefined,s:undefined,l:undefined}}this.value=o;this.smoothlyUserInput.emit({name:this.name,value:await this.getValue()})}}sliderInputHandler(o){var t;o.stopPropagation();const s=Object.keys(o.detail)[0];let l=this.sliderMode==="rgb"?this.rgb:this.hsl;if(!(o.detail[s]===undefined)){for(const i of Object.keys(l)){if(i===s){l=Object.assign(Object.assign({},l),{[i]:i==="s"||i==="l"?+((t=o.detail[s])!==null&&t!==void 0?t:0)*100:o.detail[s]})}else if(l[i]===undefined){l=Object.assign(Object.assign({},l),{[i]:0})}}if(this.sliderMode==="rgb"){this.rgb=Object.assign({},l);this.hsl=n.RGB.toHSL(this.rgb);this.hexInputHandler(n.RGB.toHex(this.rgb))}else{this.hsl=Object.assign({},l);this.rgb=n.HSL.toRGB(this.hsl);this.hexInputHandler(n.RGB.toHex(n.HSL.toRGB(this.hsl)))}}}openDropdown(){this.open=!this.open}render(){var o,t,s,r,n,e;return l(i,{key:"4db4d9329eaee9cad54871a66e4ea406e04a5b92",style:{"--hexCode":this.value,"--rgb-r":`${Math.round((o=this.rgb.r)!==null&&o!==void 0?o:0)}`,"--rgb-g":`${Math.round((t=this.rgb.g)!==null&&t!==void 0?t:0)}`,"--rgb-b":`${Math.round((s=this.rgb.b)!==null&&s!==void 0?s:0)}`,"--hsl-h":`${Math.round((r=this.hsl.h)!==null&&r!==void 0?r:0)}`,"--hsl-s":`${Math.round((n=this.hsl.s)!==null&&n!==void 0?n:0)}%`,"--hsl-l":`${Math.round((e=this.hsl.l)!==null&&e!==void 0?e:0)}%`,"--element-height":`${this.element.clientHeight}px`}},l("smoothly-input",{key:"d3fe0aeedcd45bacc1d38e75d7d5e97be3992a34",value:this.value,color:this.color,looks:undefined,name:this.name,type:"hex-color",readonly:this.readonly,disabled:this.disabled,showLabel:this.showLabel,onSmoothlyInput:o=>(o===null||o===void 0?void 0:o.stopPropagation(),this.hexInputHandler(o.detail[this.name]))},l("slot",{key:"77f78c79097fc43d15b453044170290e25c1bfc2"})),l("div",{key:"f8c144c3cfdc9ef249c941f492b009030eb97dda",class:"color-sample"}),l("smoothly-icon",{key:"8d29d95ef7cbc08cdf429088e9f005a02544ecad",color:this.color,name:"options-outline",size:"small",onClick:()=>!this.readonly&&!this.disabled&&this.openDropdown()}),l("div",{key:"8efce2fd4ca6fbde9968bddd60b54cb6e097091e"},l("slot",{key:"fd99776b1a150dd549d69e013124308ab6d2f16f",name:"end"})),this.open&&!this.readonly&&!this.disabled&&l("div",{key:"67b8c3fb973292a65257eedb64ac7a01044843d2",class:"rgb-sliders"},l("smoothly-toggle-switch",{key:"f576c2ce5b277209b94c8560e559299c715ea1e1",title:`${this.sliderMode==="rgb"?"To HSL":"To RGB"}`,onSmoothlyToggleSwitchChange:o=>this.handleSwitchMode(o),size:"tiny",checkmark:false,selected:this.sliderMode==="hsl"}),Object.entries(this.rgb).map((([o,t])=>l("smoothly-input-range",{style:this.sliderMode!="rgb"?{display:"none"}:{},name:o,min:0,max:255,color:undefined,type:"text",value:t,step:1,outputSide:"right",onSmoothlyInput:o=>this.sliderInputHandler(o),onSmoothlyUserInput:o=>o.stopPropagation(),label:o.toUpperCase()}))),Object.entries(this.hsl).map((([o,t])=>l("smoothly-input-range",{style:this.sliderMode!="hsl"?{display:"none"}:{},name:o,min:0,max:o==="h"?359:1,color:undefined,type:o==="s"||o==="l"?"percent":"text",value:(o==="s"||o==="l")&&t?t/100:t,step:o==="s"||o==="l"?.01:1,outputSide:"right",onSmoothlyInput:o=>this.sliderInputHandler(o),onSmoothlyUserInput:o=>o.stopPropagation(),label:o.toUpperCase()})))))}get element(){return this}static get watchers(){return{name:[{nameChange:0}],disabled:[{watchingReadonly:0}],readonly:[{watchingReadonly:0}],value:[{valueChanged:0}]}}static get style(){return v()}},[262,"smoothly-input-color",{value:[1025],looks:[1537],color:[1537],readonly:[1540],disabled:[516],output:[1],name:[513],showLabel:[516,"show-label"],open:[32],sliderMode:[32],register:[64],unregister:[64],getValue:[64],clear:[64],listen:[64],edit:[64],reset:[64],setInitialValue:[64]},[[0,"smoothlyInputLooks","smoothlyInputLooksHandler"],[0,"smoothlyInputLoad","smoothlyInputLoadHandler"],[8,"click","onWindowClick"]],{name:[{nameChange:0}],disabled:[{watchingReadonly:0}],readonly:[{watchingReadonly:0}],value:[{valueChanged:0}]}]);function k(){if(typeof customElements==="undefined"){return}const o=["smoothly-input-color","smoothly-display","smoothly-display-json","smoothly-display-json-object","smoothly-display-json-primitive","smoothly-display-json-record-key","smoothly-icon","smoothly-input","smoothly-input-range","smoothly-toggle-switch"];o.forEach((o=>{switch(o){case"smoothly-input-color":if(!customElements.get(r(o))){customElements.define(r(o),f)}break;case"smoothly-display":if(!customElements.get(r(o))){c()}break;case"smoothly-display-json":if(!customElements.get(r(o))){a()}break;case"smoothly-display-json-object":if(!customElements.get(r(o))){u()}break;case"smoothly-display-json-primitive":if(!customElements.get(r(o))){d()}break;case"smoothly-display-json-record-key":if(!customElements.get(r(o))){m()}break;case"smoothly-icon":if(!customElements.get(r(o))){p()}break;case"smoothly-input":if(!customElements.get(r(o))){y()}break;case"smoothly-input-range":if(!customElements.get(r(o))){b()}break;case"smoothly-toggle-switch":if(!customElements.get(r(o))){g()}break}}))}k();export{f as S,k as d};
|
|
2
|
+
//# sourceMappingURL=p-CaQWZMN4.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{p as e,H as t,h as s,d as a,t as o}from"./p-BsZrGTcp.js";import{d as m}from"./p-mmAi00ak.js";import{d as n}from"./p-CN3iME9d.js";import{d as c}from"./p-DG2pfnCV.js";import{d}from"./p-uFR5K4vd.js";import{d as r}from"./p-DvZK__s-.js";import{d as l}from"./p-F8qX8ZuL.js";import{d as i}from"./p-DFSiKg4M.js";import{d as f}from"./p-o8kM0Soe.js";import{d as p}from"./p-BX-sEZyq.js";import{d as b}from"./p-PwCtk_DY.js";const y=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}}render(){return s(a,{key:"850a5ea8cc3b512e2661333525b28eb5019287b3"},s("h2",{key:"0a0f623f23a6739f5aeb96c4b5f1679e9e0fcb34"},"Range"),s("h3",{key:"53535b3d6a89421a97851d0bd9fae947cc13b9ac"},"Phone Number"),s("smoothly-input-range",{key:"87041e028b3e3679261c04f13a0a191f382a19a5",name:"first",min:7e8,max:799999999,step:1,label:"Phone Number"}),s("h3",{key:"9875d80de18b17eca10c223004f8860e49057b8d"},"Stars out of ten"),s("smoothly-input-range",{key:"45a7669fc4115edec078db9d7d02038f5ebd0b7d",name:"stars",max:10,step:1,label:"Stars"}),s("h3",{key:"7b0dfeef448af88731df524c2616062d97fade53"},"Percent"),s("smoothly-input-range",{key:"16cc894decd70155beb121fd8ca3d6e4e743f3b3",name:"percent",type:"percent",max:1,step:.01,label:"Percent"}),s("h3",{key:"f71216975dea018c658b0501eb20cf266750e210"},"With icon at start and clear button"),s("smoothly-input-range",{key:"2acb17d8d7173d3c8f2cbddf7b0626fba989fdb0",step:1,name:"withClear",label:"Select"},s("smoothly-icon",{key:"773be31ffa04141dac37b6a9b54fde28c1499cf2",name:"checkmark-circle",slot:"start"}),s("smoothly-input-clear",{key:"c72262a6951103b03fa1af298a94152937e76338",size:"icon",slot:"end"})),s("h3",{key:"de256bcef1e529daf7df1f49c5874def1e5e6248"},"Dual (start / end)"),s("smoothly-input-range",{key:"0021e39e8db099b1afa54c9716e6923f535a2a05",dual:true,min:90.86,max:1e7,step:1,name:"dualRange",label:"Range"}),s("h3",{key:"add2d05dc7abb04da120eaea454b8ea2bd2cc552"},"Dual percent"),s("smoothly-input-range",{key:"199cdddf49337ffb96121ecc851e02523357007d",dual:true,name:"dualRangePercent",type:"percent",min:0,max:1,step:.01},s("smoothly-input-clear",{key:"7518efbb06a3c36182ddbfa8b22c8d3c960ef808",size:"icon",slot:"end"})))}},[0,"smoothly-input-range-demo"]);function u(){if(typeof customElements==="undefined"){return}const e=["smoothly-input-range-demo","smoothly-button","smoothly-display","smoothly-display-json","smoothly-display-json-object","smoothly-display-json-primitive","smoothly-display-json-record-key","smoothly-icon","smoothly-input","smoothly-input-clear","smoothly-input-range"];e.forEach((e=>{switch(e){case"smoothly-input-range-demo":if(!customElements.get(o(e))){customElements.define(o(e),y)}break;case"smoothly-button":if(!customElements.get(o(e))){m()}break;case"smoothly-display":if(!customElements.get(o(e))){n()}break;case"smoothly-display-json":if(!customElements.get(o(e))){c()}break;case"smoothly-display-json-object":if(!customElements.get(o(e))){d()}break;case"smoothly-display-json-primitive":if(!customElements.get(o(e))){r()}break;case"smoothly-display-json-record-key":if(!customElements.get(o(e))){l()}break;case"smoothly-icon":if(!customElements.get(o(e))){i()}break;case"smoothly-input":if(!customElements.get(o(e))){f()}break;case"smoothly-input-clear":if(!customElements.get(o(e))){p()}break;case"smoothly-input-range":if(!customElements.get(o(e))){b()}break}}))}u();export{y as S,u as d};
|
|
2
|
+
//# sourceMappingURL=p-Cfvi2T1F.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["SmoothlyInputRangeDemo","__stencil_proxyCustomElement","HTMLElement","render","h","Host","key","name","min","max","step","label","type","slot","size","dual"],"sources":["src/components/input/range/demo/index.tsx"],"sourcesContent":["import { Component, h, Host } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-input-range-demo\",\n})\nexport class SmoothlyInputRangeDemo {\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Range</h2>\n\t\t\t\t<h3>Phone Number</h3>\n\t\t\t\t<smoothly-input-range name=\"first\" min={700000000} max={799999999} step={1} label={\"Phone Number\"} />\n\t\t\t\t<h3>Stars out of ten</h3>\n\t\t\t\t<smoothly-input-range name=\"stars\" max={10} step={1} label={\"Stars\"} />\n\t\t\t\t<h3>Percent</h3>\n\t\t\t\t<smoothly-input-range name=\"percent\" type=\"percent\" max={1} step={0.01} label={\"Percent\"} />\n\t\t\t\t<h3>With icon at start and clear button</h3>\n\t\t\t\t<smoothly-input-range step={1} name=\"withClear\" label=\"Select\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t</smoothly-input-range>\n\t\t\t\t<h3>Dual (start / end)</h3>\n\t\t\t\t<smoothly-input-range dual min={90.86} max={10000000} step={1} name=\"dualRange\" label=\"Range\" />\n\t\t\t\t<h3>Dual percent</h3>\n\t\t\t\t<smoothly-input-range
|
|
1
|
+
{"version":3,"names":["SmoothlyInputRangeDemo","__stencil_proxyCustomElement","HTMLElement","render","h","Host","key","name","min","max","step","label","type","slot","size","dual"],"sources":["src/components/input/range/demo/index.tsx"],"sourcesContent":["import { Component, h, Host } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-input-range-demo\",\n})\nexport class SmoothlyInputRangeDemo {\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Range</h2>\n\t\t\t\t<h3>Phone Number</h3>\n\t\t\t\t<smoothly-input-range name=\"first\" min={700000000} max={799999999} step={1} label={\"Phone Number\"} />\n\t\t\t\t<h3>Stars out of ten</h3>\n\t\t\t\t<smoothly-input-range name=\"stars\" max={10} step={1} label={\"Stars\"} />\n\t\t\t\t<h3>Percent</h3>\n\t\t\t\t<smoothly-input-range name=\"percent\" type=\"percent\" max={1} step={0.01} label={\"Percent\"} />\n\t\t\t\t<h3>With icon at start and clear button</h3>\n\t\t\t\t<smoothly-input-range step={1} name=\"withClear\" label=\"Select\">\n\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t</smoothly-input-range>\n\t\t\t\t<h3>Dual (start / end)</h3>\n\t\t\t\t<smoothly-input-range dual min={90.86} max={10000000} step={1} name=\"dualRange\" label=\"Range\" />\n\t\t\t\t<h3>Dual percent</h3>\n\t\t\t\t<smoothly-input-range dual name=\"dualRangePercent\" type=\"percent\" min={0} max={1} step={0.01}>\n\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t</smoothly-input-range>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"mappings":"yaAKaA,EAAsBC,EAAA,MAAAD,UAAAE,E,4DAClC,MAAAC,GACC,OACCC,EAACC,EAAI,CAAAC,IAAA,4CACJF,EAAA,MAAAE,IAAA,qDACAF,EAAA,MAAAE,IAAA,4DACAF,EAAA,wBAAAE,IAAA,2CAAsBC,KAAK,QAAQC,IAAK,IAAWC,IAAK,UAAWC,KAAM,EAAGC,MAAO,iBACnFP,EAAA,MAAAE,IAAA,gEACAF,EAAA,wBAAAE,IAAA,2CAAsBC,KAAK,QAAQE,IAAK,GAAIC,KAAM,EAAGC,MAAO,UAC5DP,EAAA,MAAAE,IAAA,uDACAF,EAAA,wBAAAE,IAAA,2CAAsBC,KAAK,UAAUK,KAAK,UAAUH,IAAK,EAAGC,KAAM,IAAMC,MAAO,YAC/EP,EAAA,MAAAE,IAAA,mFACAF,EAAA,wBAAAE,IAAA,2CAAsBI,KAAM,EAAGH,KAAK,YAAYI,MAAM,UACrDP,EAAA,iBAAAE,IAAA,2CAAeC,KAAK,mBAAmBM,KAAK,UAC5CT,EAAA,wBAAAE,IAAA,2CAAsBQ,KAAK,OAAOD,KAAK,SAExCT,EAAA,MAAAE,IAAA,kEACAF,EAAA,wBAAAE,IAAA,2CAAsBS,KAAI,KAACP,IAAK,MAAOC,IAAK,IAAUC,KAAM,EAAGH,KAAK,YAAYI,MAAM,UACtFP,EAAA,MAAAE,IAAA,4DACAF,EAAA,wBAAAE,IAAA,2CAAsBS,KAAI,KAACR,KAAK,mBAAmBK,KAAK,UAAUJ,IAAK,EAAGC,IAAK,EAAGC,KAAM,KACvFN,EAAA,wBAAAE,IAAA,2CAAsBQ,KAAK,OAAOD,KAAK,S","ignoreList":[]}
|