smoothly 1.3.0 → 1.5.0

package/dist/components/{p-cf692cc2.js → p-5e242cbd.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-f765921a.js';
-import { d as defineCustomElement$1 } from './p-1f5357e1.js';
+import { d as defineCustomElement$1 } from './p-ca85bc1d.js';
 
 const styleCss = ".sc-smoothly-lazy-h{display:block}";
 const SmoothlyLazyStyle0 = styleCss;
@@ -16,7 +16,7 @@ const SmoothlyLazy = proxyCustomElement(class SmoothlyLazy extends H {
         this.show = true;
     }
     render() {
-        return (h(Host, { key: '0f6d1d415c90aa8891873c229585e7e2a5fd9ff1' }, h("slot", { key: 'f1f8c6da2e7b3d76433853365b54dbdb9a54bf45', name: "before" }), h("smoothly-load-more", { key: '3308f6e409f6b4fbd4f0e9eecaf6481d2c9b1a51', onSmoothlyLoadMore: e => this.loadMoreHandler(e) }), this.show && (typeof this.content == "function" ? h(this.content, null) : this.content), h("slot", { key: '2581dc862b138ddc60fbd581e9b16404d9b22ce8' })));
+        return (h(Host, { key: '450f3f9b10d1c1ce6b707ee7436d14b91a02f7ff' }, h("slot", { key: '30b4468cc7527a4fc6adbd35a80217503be8618b', name: "before" }), h("smoothly-load-more", { key: '878a61f0086a5def6ad24eaa4fa6092e49a60415', onSmoothlyLoadMore: e => this.loadMoreHandler(e) }), this.show && (typeof this.content == "function" ? h(this.content, null) : this.content), h("slot", { key: 'f5e9b745ba2369f7150a88714a5129ff4ffc7a79' })));
     }
     static get style() { return SmoothlyLazyStyle0; }
 }, [6, "smoothly-lazy", {
@@ -45,4 +45,4 @@ defineCustomElement();
 
 export { SmoothlyLazy as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-cf692cc2.js.map
+//# sourceMappingURL=p-5e242cbd.js.map

package/dist/components/{p-cf692cc2.js.map → p-5e242cbd.js.map}

@@ -1 +1 @@
-{"file":"p-cf692cc2.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,oCAAoC,CAAC;AACtD,2BAAe,QAAQ;;MCMV,YAAY;;;;oBACQ,KAAK;;;IAGrC,eAAe,CAAC,KAA0B;QACzC,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;KAChB;IAED,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,6DAAM,IAAI,EAAC,QAAQ,GAAG,EACtB,2EAAoB,kBAAkB,EAAE,CAAC,IAAI,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,GAAI,EACvE,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,OAAO,IAAI,UAAU,GAAG,EAAC,IAAI,CAAC,OAAO,OAAG,GAAG,IAAI,CAAC,OAAO,CAAC,EACnF,8DAAQ,CACF,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/lazy/style.css?tag=smoothly-lazy&encapsulation=scoped","src/components/lazy/index.tsx"],"sourcesContent":[":host {\n\tdisplay: block;\n}\n","import { Component, FunctionalComponent, h, Host, Prop, VNode } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-lazy\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyLazy {\n\t@Prop({ mutable: true }) show = false\n\t@Prop() content?: VNode | FunctionalComponent\n\n\tloadMoreHandler(event: CustomEvent<string>): void {\n\t\tevent.stopPropagation()\n\t\tthis.show = true\n\t}\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<slot name=\"before\" />\n\t\t\t\t<smoothly-load-more onSmoothlyLoadMore={e => this.loadMoreHandler(e)} />\n\t\t\t\t{this.show && (typeof this.content == \"function\" ? <this.content /> : this.content)}\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-5e242cbd.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,oCAAoC,CAAC;AACtD,2BAAe,QAAQ;;MCMV,YAAY;;;;oBACQ,KAAK;;;IAGrC,eAAe,CAAC,KAA0B;QACzC,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;KAChB;IAED,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,6DAAM,IAAI,EAAC,QAAQ,GAAG,EACtB,2EAAoB,kBAAkB,EAAE,CAAC,IAAI,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,GAAI,EACvE,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,OAAO,IAAI,UAAU,GAAG,EAAC,IAAI,CAAC,OAAO,OAAG,GAAG,IAAI,CAAC,OAAO,CAAC,EACnF,8DAAQ,CACF,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/lazy/style.css?tag=smoothly-lazy&encapsulation=scoped","src/components/lazy/index.tsx"],"sourcesContent":[":host {\n\tdisplay: block;\n}\n","import { Component, FunctionalComponent, h, Host, Prop, VNode } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-lazy\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyLazy {\n\t@Prop({ mutable: true }) show = false\n\t@Prop() content?: VNode | FunctionalComponent\n\n\tloadMoreHandler(event: CustomEvent<string>): void {\n\t\tevent.stopPropagation()\n\t\tthis.show = true\n\t}\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<slot name=\"before\" />\n\t\t\t\t<smoothly-load-more onSmoothlyLoadMore={e => this.loadMoreHandler(e)} />\n\t\t\t\t{this.show && (typeof this.content == \"function\" ? <this.content /> : this.content)}\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-671e09bf.js → p-627c3fc7.js}

@@ -1,11 +1,11 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-f765921a.js';
-import { d as defineCustomElement$7 } from './p-0eacf5f4.js';
-import { d as defineCustomElement$6 } from './p-9253f214.js';
+import { d as defineCustomElement$7 } from './p-c98922f4.js';
+import { d as defineCustomElement$6 } from './p-d0953a9e.js';
 import { d as defineCustomElement$5 } from './p-d8e3f8c5.js';
-import { d as defineCustomElement$4 } from './p-e6eca6ea.js';
-import { d as defineCustomElement$3 } from './p-a74a5a51.js';
-import { d as defineCustomElement$2 } from './p-a91db04a.js';
-import { d as defineCustomElement$1 } from './p-d4e83a45.js';
+import { d as defineCustomElement$4 } from './p-a09be6d8.js';
+import { d as defineCustomElement$3 } from './p-18e35dd4.js';
+import { d as defineCustomElement$2 } from './p-3024abfc.js';
+import { d as defineCustomElement$1 } from './p-b121c0da.js';
 
 const styleCss = ".sc-smoothly-dialog-demo-h>smoothly-button.sc-smoothly-dialog-demo{display:block;margin-block:2rem}";
 const SmoothlyDialogDemoStyle0 = styleCss;
@@ -19,7 +19,7 @@ const SmoothlyDialogDemo = proxyCustomElement(class SmoothlyDialogDemo extends H
         this.showFrame = false;
     }
     render() {
-        return (h(Host, { key: 'f7ae2fc97658b0aa8c08755714792ec4399224da' }, h("smoothly-button", { key: 'f99ac0d5c89394052b2d6faab955d8b2634e2b5f', fill: "solid", color: "light", onClick: () => (this.openModal = true) }, "Open Modal"), h("smoothly-button", { key: '8e6a1ff75c6469816cdd206fe6afa2c8eead8684', fill: "solid", color: "light", onClick: () => (this.openTallModal = true) }, "Open Modal with long text and top-aligned."), h("smoothly-button", { key: 'c8af4a1887f7f2c005926bec9032038e1fa43d3b', fill: "solid", color: "light", onClick: () => (this.showFrame = !this.showFrame) }, "Show Frame"), h("smoothly-modal", { key: '534b00fc5e74c9539ba8106b0c9cf382463448b3', closable: true, open: this.openModal, onSmoothlyModalChange: e => (this.openModal = e.detail) }, h("h2", { key: '82a998800b4e7ea57210a3116cdf35eec00aa952', slot: "header" }, "Modal"), h("span", { key: 'edeb8eaa859444f30e3f95b76fab7db2b322683f' }, "Are you sure you want to confirm this action?"), h("smoothly-button", { key: '50a4de7de97c55783fdd3e8167ec9fac4395d16a', slot: "actions", color: "success" }, "Confirm"), h("smoothly-button", { key: 'd4740cdac6527a55b692c04dd70ad17fefbe7eb8', slot: "actions", color: "light", fill: "outline", onClick: () => (this.openModal = false) }, "Cancel")), h("smoothly-modal", { key: '0beaeb3ab4f2af395a3aa0257674f38f55faabd6', closable: true, open: this.openTallModal, onSmoothlyModalChange: e => (this.openTallModal = e.detail), align: "top" }, h("h2", { key: '453c4ded8638235b6dc0ff5c043b57d37995be4d', slot: "header" }, "Modal"), h("smoothly-summary", { key: '871fc4ad53812e7331093c43dee851b14d33f726' }, h("div", { key: '720c732d6f03309304d677b6292b853ac38257f8', slot: "summary" }, "Lorem ipsum"), h("div", { key: '2e5632e1402f5ff2830e63dc56be723549c2a90e', slot: "content" }, Array.from({ length: 10 }).map(() => (h("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."))))), h("smoothly-button", { key: '5fb59dab67d31d2783855d1e0c4f67197a7eaa04', slot: "actions", color: "light", fill: "outline", onClick: () => (this.openTallModal = false) }, "Cancel")), this.showFrame && (h("smoothly-dialog", { key: '939b4f257b01be10467dc90b45801402df5f70e3', closable: true }, h("smoothly-frame", { key: '83c2ac363001992a0673506df8317b30b487ff60', url: "https://www.wikipedia.org/", name: "parent", style: { height: "80vh" } })))));
+        return (h(Host, { key: '171296f92ec571930bcc4bca7a2bbd433943d302' }, h("smoothly-button", { key: '31d7764ddb4163c83d1d5cd53bc664bde022521d', fill: "solid", color: "light", onClick: () => (this.openModal = true) }, "Open Modal"), h("smoothly-button", { key: '58ead69323e970d926b3b3f0e57b2f5340d7c956', fill: "solid", color: "light", onClick: () => (this.openTallModal = true) }, "Open Modal with long text and top-aligned."), h("smoothly-button", { key: '57939b58cfbb5e2d2081b2436094041eb1074e87', fill: "solid", color: "light", onClick: () => (this.showFrame = !this.showFrame) }, "Show Frame"), h("smoothly-modal", { key: 'eba2703ab68ac9a767640493bd91aaeaa84c2256', closable: true, open: this.openModal, onSmoothlyModalChange: e => (this.openModal = e.detail) }, h("h2", { key: '66557105cc449a37951e52271a184324333c310f', slot: "header" }, "Modal"), h("span", { key: '273f211df20373f6622994141102e780a7b3ee53' }, "Are you sure you want to confirm this action?"), h("smoothly-button", { key: '7710589cbd7be4649c8ea355cba53bed95ecb414', slot: "actions", color: "success" }, "Confirm"), h("smoothly-button", { key: '580de2b26b8b169209b7f2afa3446749a42d55ff', slot: "actions", color: "light", fill: "outline", onClick: () => (this.openModal = false) }, "Cancel")), h("smoothly-modal", { key: '4293aa516d024c7deb849686b1c9b1d2cbde50c4', closable: true, open: this.openTallModal, onSmoothlyModalChange: e => (this.openTallModal = e.detail), align: "top" }, h("h2", { key: 'd5172b9f596b4dc05a1c66014c3dac4feda1fbcd', slot: "header" }, "Modal"), h("smoothly-summary", { key: '92b695be01a78bf00e70a60ef132092979617f79' }, h("div", { key: '2b1b7d17992a2d635a1a261c3768ce8f64b4f10a', slot: "summary" }, "Lorem ipsum"), h("div", { key: 'ca2a2ec987eb6049eb3a7fa609a7d3b77aacca48', slot: "content" }, Array.from({ length: 10 }).map(() => (h("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."))))), h("smoothly-button", { key: 'c1e0641f4631dd6cc21a695f0ffee7e2851e50bb', slot: "actions", color: "light", fill: "outline", onClick: () => (this.openTallModal = false) }, "Cancel")), this.showFrame && (h("smoothly-dialog", { key: '28d4f53e28c7e32bef9746362fce97cfb21cb442', closable: true }, h("smoothly-frame", { key: '61011e045d9a740f3937a1cdc83e0fb97c1d552b', url: "https://www.wikipedia.org/", name: "parent", style: { height: "80vh" } })))));
     }
     static get style() { return SmoothlyDialogDemoStyle0; }
 }, [2, "smoothly-dialog-demo", {
@@ -79,4 +79,4 @@ defineCustomElement();
 
 export { SmoothlyDialogDemo as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-671e09bf.js.map
+//# sourceMappingURL=p-627c3fc7.js.map

package/dist/components/{p-671e09bf.js.map → p-627c3fc7.js.map}

@@ -1 +1 @@
-{"file":"p-671e09bf.js","mappings":";;;;;;;;;AAAA,MAAM,QAAQ,GAAG,qGAAqG,CAAC;AACvH,iCAAe,QAAQ;;MCMV,kBAAkB;;;;yBACT,KAAK;6BACD,KAAK;yBACT,KAAK;;IAE1B,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,wEAAiB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,iBAEhE,EAClB,wEAAiB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,iDAEpE,EAClB,wEAAiB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,iBAE3E,EAElB,uEAAgB,QAAQ,QAAC,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,qBAAqB,EAAE,CAAC,KAAK,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,MAAM,CAAC,IACrG,2DAAI,IAAI,EAAC,QAAQ,YAAW,EAC5B,+GAA0D,EAC1D,wEAAiB,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,SAAS,cAE7B,EAClB,wEAAiB,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,aAElF,CACF,EAEjB,uEACC,QAAQ,QACR,IAAI,EAAE,IAAI,CAAC,aAAa,EACxB,qBAAqB,EAAE,CAAC,KAAK,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,MAAM,CAAC,EAC3D,KAAK,EAAC,KAAK,IACX,2DAAI,IAAI,EAAC,QAAQ,YAAW,EAC5B,2EACC,4DAAK,IAAI,EAAC,SAAS,kBAAkB,EACrC,4DAAK,IAAI,EAAC,SAAS,IACjB,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,OAC/B,6cAMI,CACJ,CAAC,CACG,CACY,EACnB,wEAAiB,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,aAEtF,CACF,EAEhB,IAAI,CAAC,SAAS,KACd,wEAAiB,QAAQ,UACxB,uEAAgB,GAAG,EAAC,4BAA4B,EAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,GAAI,CAC3E,CAClB,CACK,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/dialog/demo/style.css?tag=smoothly-dialog-demo&encapsulation=scoped","src/components/dialog/demo/index.tsx"],"sourcesContent":["\n:host > smoothly-button {\n\tdisplay: block;\n\tmargin-block: 2rem;\n}\n","import { Component, h, Host, State } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-dialog-demo\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyDialogDemo {\n\t@State() openModal = false\n\t@State() openTallModal = false\n\t@State() showFrame = false\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-button fill=\"solid\" color=\"light\" onClick={() => (this.openModal = true)}>\n\t\t\t\t\tOpen Modal\n\t\t\t\t</smoothly-button>\n\t\t\t\t<smoothly-button fill=\"solid\" color=\"light\" onClick={() => (this.openTallModal = true)}>\n\t\t\t\t\tOpen Modal with long text and top-aligned.\n\t\t\t\t</smoothly-button>\n\t\t\t\t<smoothly-button fill=\"solid\" color=\"light\" onClick={() => (this.showFrame = !this.showFrame)}>\n\t\t\t\t\tShow Frame\n\t\t\t\t</smoothly-button>\n\n\t\t\t\t<smoothly-modal closable open={this.openModal} onSmoothlyModalChange={e => (this.openModal = e.detail)}>\n\t\t\t\t\t<h2 slot=\"header\">Modal</h2>\n\t\t\t\t\t<span>Are you sure you want to confirm this action?</span>\n\t\t\t\t\t<smoothly-button slot=\"actions\" color=\"success\">\n\t\t\t\t\t\tConfirm\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t\t<smoothly-button slot=\"actions\" color=\"light\" fill=\"outline\" onClick={() => (this.openModal = false)}>\n\t\t\t\t\t\tCancel\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t</smoothly-modal>\n\n\t\t\t\t<smoothly-modal\n\t\t\t\t\tclosable\n\t\t\t\t\topen={this.openTallModal}\n\t\t\t\t\tonSmoothlyModalChange={e => (this.openTallModal = e.detail)}\n\t\t\t\t\talign=\"top\">\n\t\t\t\t\t<h2 slot=\"header\">Modal</h2>\n\t\t\t\t\t<smoothly-summary>\n\t\t\t\t\t\t<div slot=\"summary\">Lorem ipsum</div>\n\t\t\t\t\t\t<div slot=\"content\">\n\t\t\t\t\t\t\t{Array.from({ length: 10 }).map(() => (\n\t\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et\n\t\t\t\t\t\t\t\t\tdolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut\n\t\t\t\t\t\t\t\t\taliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum\n\t\t\t\t\t\t\t\t\tdolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui\n\t\t\t\t\t\t\t\t\tofficia deserunt mollit anim id est laborum.\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-button slot=\"actions\" color=\"light\" fill=\"outline\" onClick={() => (this.openTallModal = false)}>\n\t\t\t\t\t\tCancel\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t</smoothly-modal>\n\n\t\t\t\t{this.showFrame && (\n\t\t\t\t\t<smoothly-dialog closable>\n\t\t\t\t\t\t<smoothly-frame url=\"https://www.wikipedia.org/\" name=\"parent\" style={{ height: \"80vh\" }} />\n\t\t\t\t\t</smoothly-dialog>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-627c3fc7.js","mappings":";;;;;;;;;AAAA,MAAM,QAAQ,GAAG,qGAAqG,CAAC;AACvH,iCAAe,QAAQ;;MCMV,kBAAkB;;;;yBACT,KAAK;6BACD,KAAK;yBACT,KAAK;;IAE1B,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,wEAAiB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,iBAEhE,EAClB,wEAAiB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,iDAEpE,EAClB,wEAAiB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,iBAE3E,EAElB,uEAAgB,QAAQ,QAAC,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,qBAAqB,EAAE,CAAC,KAAK,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,MAAM,CAAC,IACrG,2DAAI,IAAI,EAAC,QAAQ,YAAW,EAC5B,+GAA0D,EAC1D,wEAAiB,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,SAAS,cAE7B,EAClB,wEAAiB,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,aAElF,CACF,EAEjB,uEACC,QAAQ,QACR,IAAI,EAAE,IAAI,CAAC,aAAa,EACxB,qBAAqB,EAAE,CAAC,KAAK,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,MAAM,CAAC,EAC3D,KAAK,EAAC,KAAK,IACX,2DAAI,IAAI,EAAC,QAAQ,YAAW,EAC5B,2EACC,4DAAK,IAAI,EAAC,SAAS,kBAAkB,EACrC,4DAAK,IAAI,EAAC,SAAS,IACjB,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,OAC/B,6cAMI,CACJ,CAAC,CACG,CACY,EACnB,wEAAiB,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,aAEtF,CACF,EAEhB,IAAI,CAAC,SAAS,KACd,wEAAiB,QAAQ,UACxB,uEAAgB,GAAG,EAAC,4BAA4B,EAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,GAAI,CAC3E,CAClB,CACK,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/dialog/demo/style.css?tag=smoothly-dialog-demo&encapsulation=scoped","src/components/dialog/demo/index.tsx"],"sourcesContent":["\n:host > smoothly-button {\n\tdisplay: block;\n\tmargin-block: 2rem;\n}\n","import { Component, h, Host, State } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-dialog-demo\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyDialogDemo {\n\t@State() openModal = false\n\t@State() openTallModal = false\n\t@State() showFrame = false\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-button fill=\"solid\" color=\"light\" onClick={() => (this.openModal = true)}>\n\t\t\t\t\tOpen Modal\n\t\t\t\t</smoothly-button>\n\t\t\t\t<smoothly-button fill=\"solid\" color=\"light\" onClick={() => (this.openTallModal = true)}>\n\t\t\t\t\tOpen Modal with long text and top-aligned.\n\t\t\t\t</smoothly-button>\n\t\t\t\t<smoothly-button fill=\"solid\" color=\"light\" onClick={() => (this.showFrame = !this.showFrame)}>\n\t\t\t\t\tShow Frame\n\t\t\t\t</smoothly-button>\n\n\t\t\t\t<smoothly-modal closable open={this.openModal} onSmoothlyModalChange={e => (this.openModal = e.detail)}>\n\t\t\t\t\t<h2 slot=\"header\">Modal</h2>\n\t\t\t\t\t<span>Are you sure you want to confirm this action?</span>\n\t\t\t\t\t<smoothly-button slot=\"actions\" color=\"success\">\n\t\t\t\t\t\tConfirm\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t\t<smoothly-button slot=\"actions\" color=\"light\" fill=\"outline\" onClick={() => (this.openModal = false)}>\n\t\t\t\t\t\tCancel\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t</smoothly-modal>\n\n\t\t\t\t<smoothly-modal\n\t\t\t\t\tclosable\n\t\t\t\t\topen={this.openTallModal}\n\t\t\t\t\tonSmoothlyModalChange={e => (this.openTallModal = e.detail)}\n\t\t\t\t\talign=\"top\">\n\t\t\t\t\t<h2 slot=\"header\">Modal</h2>\n\t\t\t\t\t<smoothly-summary>\n\t\t\t\t\t\t<div slot=\"summary\">Lorem ipsum</div>\n\t\t\t\t\t\t<div slot=\"content\">\n\t\t\t\t\t\t\t{Array.from({ length: 10 }).map(() => (\n\t\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et\n\t\t\t\t\t\t\t\t\tdolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut\n\t\t\t\t\t\t\t\t\taliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum\n\t\t\t\t\t\t\t\t\tdolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui\n\t\t\t\t\t\t\t\t\tofficia deserunt mollit anim id est laborum.\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-button slot=\"actions\" color=\"light\" fill=\"outline\" onClick={() => (this.openTallModal = false)}>\n\t\t\t\t\t\tCancel\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t</smoothly-modal>\n\n\t\t\t\t{this.showFrame && (\n\t\t\t\t\t<smoothly-dialog closable>\n\t\t\t\t\t\t<smoothly-frame url=\"https://www.wikipedia.org/\" name=\"parent\" style={{ height: \"80vh\" }} />\n\t\t\t\t\t</smoothly-dialog>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-183f3712.js → p-6396cebd.js}

@@ -1,14 +1,14 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-f765921a.js';
-import { d as defineCustomElement$a } from './p-11cc925c.js';
-import { d as defineCustomElement$9 } from './p-ff99dcde.js';
-import { d as defineCustomElement$8 } from './p-51cb1946.js';
-import { d as defineCustomElement$7 } from './p-21601376.js';
-import { d as defineCustomElement$6 } from './p-d9989605.js';
-import { d as defineCustomElement$5 } from './p-e6eca6ea.js';
-import { d as defineCustomElement$4 } from './p-0fb1eac0.js';
-import { d as defineCustomElement$3 } from './p-7b8d9ec5.js';
-import { d as defineCustomElement$2 } from './p-3062590d.js';
-import { d as defineCustomElement$1 } from './p-194c03be.js';
+import { d as defineCustomElement$a } from './p-065cbcf5.js';
+import { d as defineCustomElement$9 } from './p-b235b5aa.js';
+import { d as defineCustomElement$8 } from './p-d3c8be66.js';
+import { d as defineCustomElement$7 } from './p-5bf78c75.js';
+import { d as defineCustomElement$6 } from './p-d8bd7cc0.js';
+import { d as defineCustomElement$5 } from './p-a09be6d8.js';
+import { d as defineCustomElement$4 } from './p-cef759f2.js';
+import { d as defineCustomElement$3 } from './p-3609c2f0.js';
+import { d as defineCustomElement$2 } from './p-b3cfa9a5.js';
+import { d as defineCustomElement$1 } from './p-d1462fc3.js';
 
 const SmoothlyInputColorDemo = proxyCustomElement(class SmoothlyInputColorDemo extends H {
     constructor() {
@@ -16,7 +16,7 @@ const SmoothlyInputColorDemo = proxyCustomElement(class SmoothlyInputColorDemo e
         this.__registerHost();
     }
     render() {
-        return (h(Host, { key: '425472ef4f686d52c44e4d3a929be66d78823b26' }, h("h2", { key: '621c263cd20e5e1e31b26e184c9691b7b16ad282' }, "Color"), h("smoothly-input-color", { key: '2aece7d05a7fa18b83ca8830096a78bb105c8f85', name: "color" }, "Choose color")));
+        return (h(Host, { key: '6c0f77709d1ab40676d2214ec1a0e1545baf1e5b' }, h("h2", { key: 'a5840477e827a305d2441f157a67936afe48397f' }, "Color"), h("smoothly-input-color", { key: 'b4c59fbfcaacd9c2561264ca5bad49a5c15d2c1f', name: "color" }, "Choose color")));
     }
     static get style() { return "style.css"; }
 }, [0, "smoothly-input-color-demo"]);
@@ -87,4 +87,4 @@ defineCustomElement();
 
 export { SmoothlyInputColorDemo as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-183f3712.js.map
+//# sourceMappingURL=p-6396cebd.js.map

package/dist/components/{p-183f3712.js.map → p-6396cebd.js.map}

@@ -1 +1 @@
-{"file":"p-183f3712.js","mappings":";;;;;;;;;;;;MAMa,sBAAsB;;;;;IAClC,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,qEAAc,EACd,6EAAsB,IAAI,EAAC,OAAO,mBAAoC,CAChE,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/input/color/demo/index.tsx"],"sourcesContent":["import { Component, h, Host } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-input-color-demo\",\n\tstyles: \"style.css\",\n})\nexport class SmoothlyInputColorDemo {\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Color</h2>\n\t\t\t\t<smoothly-input-color name=\"color\">Choose color</smoothly-input-color>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-6396cebd.js","mappings":";;;;;;;;;;;;MAMa,sBAAsB;;;;;IAClC,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,qEAAc,EACd,6EAAsB,IAAI,EAAC,OAAO,mBAAoC,CAChE,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/input/color/demo/index.tsx"],"sourcesContent":["import { Component, h, Host } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-input-color-demo\",\n\tstyles: \"style.css\",\n})\nexport class SmoothlyInputColorDemo {\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Color</h2>\n\t\t\t\t<smoothly-input-color name=\"color\">Choose color</smoothly-input-color>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-065742a9.js → p-68c91da3.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-f765921a.js';
 import { A as And, P as Property, I as Includes, b as property, i as includes, a as and } from './p-caf09da9.js';
-import { d as defineCustomElement$2 } from './p-e6eca6ea.js';
-import { d as defineCustomElement$1 } from './p-0fb1eac0.js';
+import { d as defineCustomElement$2 } from './p-a09be6d8.js';
+import { d as defineCustomElement$1 } from './p-cef759f2.js';
 
 const styleCss = ".sc-smoothly-filter-input-h{display:contents}.sc-smoothly-filter-input-h>smoothly-input.sc-smoothly-filter-input{flex-grow:1;min-width:10em;flex-basis:40%}";
 const SmoothlyFilterInputStyle0 = styleCss;
@@ -73,7 +73,7 @@ const SmoothlyFilterInput = proxyCustomElement(class SmoothlyFilterInput extends
             (rest.length == 0 || (!!criteria.criteria && this.findInstanceOf(criteria.criteria, rest.join(".")))));
     }
     render() {
-        return (h("smoothly-input", { key: 'b9c0bad8ca30d5e45e9686b52f8536cf8b0f3a29', name: this.property, value: this.needle, type: this.type, placeholder: this.placeholder, onSmoothlyBlur: e => e.stopPropagation(), onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => this.inputHandler(e) }, this.label, h("slot", { key: 'b6bda14b39abfb507ce5a83f0cf95efb218d7c36' })));
+        return (h("smoothly-input", { key: '397b2b9127c595d02cab01ee179da26eeb1d4c80', name: this.property, value: this.needle, type: this.type, placeholder: this.placeholder, onSmoothlyBlur: e => e.stopPropagation(), onSmoothlyFormDisable: e => e.stopPropagation(), onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyInput: e => this.inputHandler(e) }, this.label, h("slot", { key: '6cc2c8a4815cdbcfa837c6b0f6eb66a16979bd0d' })));
     }
     static get style() { return SmoothlyFilterInputStyle0; }
 }, [6, "smoothly-filter-input", {
@@ -109,4 +109,4 @@ defineCustomElement();
 
 export { SmoothlyFilterInput as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-065742a9.js.map
+//# sourceMappingURL=p-68c91da3.js.map

package/dist/components/{p-065742a9.js.map → p-68c91da3.js.map}

@@ -1 +1 @@
-{"file":"p-065742a9.js","mappings":";;;;;AAAA,MAAM,QAAQ,GAAG,6JAA6J,CAAC;AAC/K,kCAAe,QAAQ;;MCSV,mBAAmB;;;;;;QAC/B,SAAI,GAAgB,MAAM,CAAA;sBACc,EAAE;;;;;IAM1C,gBAAgB;QACf,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;KACtD;IACD,MAAM,CAAC,UAAgC;;QACtC,IAAI,UAAU,YAAYA,GAAe,IAAI,UAAU,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;YACvE,KAAK,MAAM,IAAI,IAAI,UAAU,CAAC,KAAK,EAAE;gBACpC,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAA;gBACrD,IAAI,QAAQ,EAAE;oBACb,IAAI,CAAC,MAAM,GAAG,MAAA,QAAQ,CAAC,MAAM,mCAAI,EAAE,CAAA;oBACnC,MAAK;iBACL;aACD;;YAED,IAAI,CAAC,MAAM,GAAG,EAAE,CAAA;KACjB;IACO,UAAU,CAAC,QAAsC,EAAE,GAAW;QACrE,MAAM,CAAC,QAAQ,EAAE,GAAG,IAAI,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;QAC1C,QACC,CAAC,QAAQ,YAAYC,QAAoB;YACxC,QAAQ,CAAC,IAAI,IAAI,QAAQ;aACxB,CAAC,QAAQ,CAAC,QAAQ,YAAYC,QAAoB,IAAI,QAAQ,CAAC,QAAQ;iBACtE,QAAQ,CAAC,QAAQ,YAAYD,QAAoB,IAAI,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;YAC5G,SAAS,EACT;KACD;IACD,YAAY,CAAC,KAA0C;QACtD,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QAC1C,MAAM,UAAU,GAAsB,CAAC,QAA8B;YACpE,IAAI,MAAM,GAAyB,QAAQ,CAAA;YAC3C,MAAM,WAAW,GAAG,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,GAAG,SAAS,CAAA;YACjE,IAAI,MAAM,YAAYD,GAAe,EAAE;gBACtC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,IAAI,CAAC,cAAc,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAA;gBAChF,CAAC,WAAW;sBACT,KAAK,IAAI,CAAC,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;sBAC5C,KAAK,IAAI,CAAC,CAAC;0BACX,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC;2BAC7B,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,WAAW,CAAC,CAAA;gBACtC,MAAM,GAAGG,GAAe,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;aACzC;YACD,OAAO,MAAM,CAAA;SACb,CAAA;QACD,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;KACzD;IACO,WAAW,CAAC,MAAc;QACjC,OAAO,IAAI,CAAC,QAAQ;aAClB,KAAK,CAAC,GAAG,CAAC;aACV,WAAW,CAAC,CAAC,CAAmB,EAAE,CAAC,KAAKC,QAAoB,CAAC,CAAC,EAAE,CAAC,CAAC,EAAEC,QAAoB,CAAC,MAAM,CAAC,CAAC,CAAA;KACnG;IACD,cAAc,CAAC,QAA8B,EAAE,QAAgB;QAC9D,MAAM,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;QAC1C,QACC,QAAQ,YAAYJ,QAAoB;YACxC,QAAQ,CAAC,IAAI,IAAI,GAAG;aACnB,IAAI,CAAC,MAAM,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,QAAQ,IAAI,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EACrG;KACD;IAED,MAAM;QACL,QACC,uEACC,IAAI,EAAE,IAAI,CAAC,QAAQ,EACnB,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,cAAc,EAAE,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,EACxC,qBAAqB,EAAE,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,EAC/C,mBAAmB,EAAE,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,EAC7C,gBAAgB,EAAE,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,EAC1C,eAAe,EAAE,CAAC,IAAI,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IACzC,IAAI,CAAC,KAAK,EACX,8DAAQ,CACQ,EACjB;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["selectively.And","selectively.Property","selectively.Includes","selectively.and","selectively.property","selectively.includes"],"sources":["src/components/filter/input/style.css?tag=smoothly-filter-input&encapsulation=scoped","src/components/filter/input/index.tsx"],"sourcesContent":[":host {\n\tdisplay: contents;\n}\n\n:host>smoothly-input {\n\tflex-grow: 1;\n\tmin-width: 10em;\n\tflex-basis: 40%;\n}\n","import { Component, Event, EventEmitter, h, Prop, State } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\nimport { tidily } from \"tidily\"\nimport { Filter } from \"../Filter\"\n\n@Component({\n\ttag: \"smoothly-filter-input\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyFilterInput implements Filter {\n\ttype: tidily.Type = \"text\"\n\t@State() needle: selectively.Criteria = \"\"\n\t@Prop() label: string\n\t@Prop() property: string\n\t@Prop() placeholder: string\n\t@Event() smoothlyFilterUpdate: EventEmitter<Filter.Update>\n\t@Event() smoothlyFilterManipulate: EventEmitter<Filter.Manipulate>\n\tcomponentDidLoad() {\n\t\tthis.smoothlyFilterUpdate.emit(this.update.bind(this))\n\t}\n\tupdate(expression: selectively.Criteria): void {\n\t\tif (expression instanceof selectively.And && expression.rules.length > 0)\n\t\t\tfor (const rule of expression.rules) {\n\t\t\t\tconst criteria = this.isCriteria(rule, this.property)\n\t\t\t\tif (criteria) {\n\t\t\t\t\tthis.needle = criteria.needle ?? \"\"\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t}\n\t\telse\n\t\t\tthis.needle = \"\"\n\t}\n\tprivate isCriteria(criteria: selectively.Rule | undefined, key: string): selectively.Includes | undefined {\n\t\tconst [property, ...rest] = key.split(\".\")\n\t\treturn (\n\t\t\t(criteria instanceof selectively.Property &&\n\t\t\t\tcriteria.name == property &&\n\t\t\t\t((criteria.criteria instanceof selectively.Includes && criteria.criteria) ||\n\t\t\t\t\t(criteria.criteria instanceof selectively.Property && this.isCriteria(criteria.criteria, rest.join(\".\"))))) ||\n\t\t\tundefined\n\t\t)\n\t}\n\tinputHandler(event: CustomEvent<Record<string, string>>) {\n\t\tevent.stopPropagation()\n\t\tconst needle = event.detail[this.property]\n\t\tconst manipulate: Filter.Manipulate = (criteria: selectively.Criteria): selectively.Criteria => {\n\t\t\tlet result: selectively.Criteria = criteria\n\t\t\tconst newCriteria = needle ? this.getCriteria(needle) : undefined\n\t\t\tif (result instanceof selectively.And) {\n\t\t\t\tconst index = result.rules.findIndex(r => this.findInstanceOf(r, this.property))\n\t\t\t\t!newCriteria\n\t\t\t\t\t? index != -1 && result.rules.splice(index, 1)\n\t\t\t\t\t: index == -1\n\t\t\t\t\t? result.rules.push(newCriteria)\n\t\t\t\t\t: (result.rules[index] = newCriteria)\n\t\t\t\tresult = selectively.and(...result.rules)\n\t\t\t}\n\t\t\treturn result\n\t\t}\n\t\tthis.smoothlyFilterManipulate.emit(manipulate.bind(this))\n\t}\n\tprivate getCriteria(needle: string): selectively.Rule | undefined {\n\t\treturn this.property\n\t\t\t.split(\".\")\n\t\t\t.reduceRight((r: selectively.Rule, e) => selectively.property(e, r), selectively.includes(needle))\n\t}\n\tfindInstanceOf(criteria: selectively.Criteria, property: string): boolean {\n\t\tconst [key, ...rest] = property.split(\".\")\n\t\treturn (\n\t\t\tcriteria instanceof selectively.Property &&\n\t\t\tcriteria.name == key &&\n\t\t\t(rest.length == 0 || (!!criteria.criteria && this.findInstanceOf(criteria.criteria, rest.join(\".\"))))\n\t\t)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<smoothly-input\n\t\t\t\tname={this.property}\n\t\t\t\tvalue={this.needle}\n\t\t\t\ttype={this.type}\n\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\tonSmoothlyBlur={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyFormDisable={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyInputLoad={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyChange={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyInput={e => this.inputHandler(e)}>\n\t\t\t\t{this.label}\n\t\t\t\t<slot />\n\t\t\t</smoothly-input>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-68c91da3.js","mappings":"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","names":["selectively.And","selectively.Property","selectively.Includes","selectively.and","selectively.property","selectively.includes"],"sources":["src/components/filter/input/style.css?tag=smoothly-filter-input&encapsulation=scoped","src/components/filter/input/index.tsx"],"sourcesContent":[":host {\n\tdisplay: contents;\n}\n\n:host>smoothly-input {\n\tflex-grow: 1;\n\tmin-width: 10em;\n\tflex-basis: 40%;\n}\n","import { Component, Event, EventEmitter, h, Prop, State } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\nimport { tidily } from \"tidily\"\nimport { Filter } from \"../Filter\"\n\n@Component({\n\ttag: \"smoothly-filter-input\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyFilterInput implements Filter {\n\ttype: tidily.Type = \"text\"\n\t@State() needle: selectively.Criteria = \"\"\n\t@Prop() label: string\n\t@Prop() property: string\n\t@Prop() placeholder: string\n\t@Event() smoothlyFilterUpdate: EventEmitter<Filter.Update>\n\t@Event() smoothlyFilterManipulate: EventEmitter<Filter.Manipulate>\n\tcomponentDidLoad() {\n\t\tthis.smoothlyFilterUpdate.emit(this.update.bind(this))\n\t}\n\tupdate(expression: selectively.Criteria): void {\n\t\tif (expression instanceof selectively.And && expression.rules.length > 0)\n\t\t\tfor (const rule of expression.rules) {\n\t\t\t\tconst criteria = this.isCriteria(rule, this.property)\n\t\t\t\tif (criteria) {\n\t\t\t\t\tthis.needle = criteria.needle ?? \"\"\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t}\n\t\telse\n\t\t\tthis.needle = \"\"\n\t}\n\tprivate isCriteria(criteria: selectively.Rule | undefined, key: string): selectively.Includes | undefined {\n\t\tconst [property, ...rest] = key.split(\".\")\n\t\treturn (\n\t\t\t(criteria instanceof selectively.Property &&\n\t\t\t\tcriteria.name == property &&\n\t\t\t\t((criteria.criteria instanceof selectively.Includes && criteria.criteria) ||\n\t\t\t\t\t(criteria.criteria instanceof selectively.Property && this.isCriteria(criteria.criteria, rest.join(\".\"))))) ||\n\t\t\tundefined\n\t\t)\n\t}\n\tinputHandler(event: CustomEvent<Record<string, string>>) {\n\t\tevent.stopPropagation()\n\t\tconst needle = event.detail[this.property]\n\t\tconst manipulate: Filter.Manipulate = (criteria: selectively.Criteria): selectively.Criteria => {\n\t\t\tlet result: selectively.Criteria = criteria\n\t\t\tconst newCriteria = needle ? this.getCriteria(needle) : undefined\n\t\t\tif (result instanceof selectively.And) {\n\t\t\t\tconst index = result.rules.findIndex(r => this.findInstanceOf(r, this.property))\n\t\t\t\t!newCriteria\n\t\t\t\t\t? index != -1 && result.rules.splice(index, 1)\n\t\t\t\t\t: index == -1\n\t\t\t\t\t? result.rules.push(newCriteria)\n\t\t\t\t\t: (result.rules[index] = newCriteria)\n\t\t\t\tresult = selectively.and(...result.rules)\n\t\t\t}\n\t\t\treturn result\n\t\t}\n\t\tthis.smoothlyFilterManipulate.emit(manipulate.bind(this))\n\t}\n\tprivate getCriteria(needle: string): selectively.Rule | undefined {\n\t\treturn this.property\n\t\t\t.split(\".\")\n\t\t\t.reduceRight((r: selectively.Rule, e) => selectively.property(e, r), selectively.includes(needle))\n\t}\n\tfindInstanceOf(criteria: selectively.Criteria, property: string): boolean {\n\t\tconst [key, ...rest] = property.split(\".\")\n\t\treturn (\n\t\t\tcriteria instanceof selectively.Property &&\n\t\t\tcriteria.name == key &&\n\t\t\t(rest.length == 0 || (!!criteria.criteria && this.findInstanceOf(criteria.criteria, rest.join(\".\"))))\n\t\t)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<smoothly-input\n\t\t\t\tname={this.property}\n\t\t\t\tvalue={this.needle}\n\t\t\t\ttype={this.type}\n\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\tonSmoothlyBlur={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyFormDisable={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyInputLoad={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyChange={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyInput={e => this.inputHandler(e)}>\n\t\t\t\t{this.label}\n\t\t\t\t<slot />\n\t\t\t</smoothly-input>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/p-72b6a817.js

@@ -0,0 +1,54 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-f765921a.js';
+import { d as defineCustomElement$3 } from './p-c98922f4.js';
+import { d as defineCustomElement$2 } from './p-3989ef69.js';
+import { d as defineCustomElement$1 } from './p-03c91070.js';
+
+const styleCss = ".sc-smoothly-tabs-demo-h{display:block}[hidden].sc-smoothly-tabs-demo-h{display:none}.sc-smoothly-tabs-demo-h>*.sc-smoothly-tabs-demo{margin:auto;max-width:1200px;width:100%;margin-block:5rem}.sc-smoothly-tabs-demo-h code.sc-smoothly-tabs-demo{color:rgb(var(--smoothly-medium-contrast));background-color:rgb(var(--smoothly-medium-color));padding-inline:0.25rem;border-radius:0.25rem}";
+const SmoothlyTabsDemoStyle0 = styleCss;
+
+const SmoothlyTabsDemo = proxyCustomElement(class SmoothlyTabsDemo extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.extraTab = undefined;
+    }
+    render() {
+        return (h(Host, { key: 'ec145eb00524cda91498766b9e9ae7ca715bc494' }, h("smoothly-tabs", { key: '70c47302b686767345d82bf8f011847cf75efad4', tabs: "multiple" }, h("smoothly-tab", { key: '83426f550c4539852669d3577b8573be151dad32', label: "Single Tab", open: true }, h("strong", { key: 'd89e2642d9087f71f46fffda20d3e8ef092c3ade' }, "Single Tab content here."), " If only one tab is available setting ", h("code", { key: '8a1a80fafe9780cacfe835f6875f8a2763086d93' }, "tabs"), " to", " ", h("code", { key: '89aec94fd33241f34d7d34d465452c3dbfae9f0b' }, "\"multiple\""), " will hide the tab navigation and display the single tab's content directly.", !this.extraTab && (h("div", { key: 'efedaf74ed8f139dd4b00ee29d745b0ce00cc20a' }, h("smoothly-button", { key: 'c4a0b3d4fda1a72ad38a2f38afddfe010ddfd67a', color: "primary", onClick: () => (this.extraTab = true) }, "Click to add extra tab")))), this.extraTab && (h("smoothly-tab", { key: '239808e72e00bac39bd2c7684bce82dcad374765', label: "Extra tab" }, "When there are more then one tab, the tab navigation will show."))), h("smoothly-tabs", { key: 'f56e37f6c69e9a290cfa392626ee62a1e4a7ca68' }, h("smoothly-tab", { key: '608024b94967df590fbd45fbb93b8c0bd28e1385', label: "test1", open: true }, "Hello world!"), h("smoothly-tab", { key: 'b7039d33a48fe68268d192d3a4486eb65e500ee2', label: "test2" }, "this is a test message!"), h("smoothly-tab", { key: '412e749f9ed6625d7ba22ed9378c60ee52d7b70b', label: "test3" }, "this is a test message again!"))));
+    }
+    static get style() { return SmoothlyTabsDemoStyle0; }
+}, [2, "smoothly-tabs-demo", {
+        "extraTab": [32]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["smoothly-tabs-demo", "smoothly-button", "smoothly-tab", "smoothly-tabs"];
+    components.forEach(tagName => { switch (tagName) {
+        case "smoothly-tabs-demo":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SmoothlyTabsDemo);
+            }
+            break;
+        case "smoothly-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "smoothly-tab":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "smoothly-tabs":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { SmoothlyTabsDemo as S, defineCustomElement as d };
+
+//# sourceMappingURL=p-72b6a817.js.map

package/dist/components/p-72b6a817.js.map

@@ -0,0 +1 @@
+{"file":"p-72b6a817.js","mappings":";;;;;AAAA,MAAM,QAAQ,GAAG,iYAAiY,CAAC;AACnZ,+BAAe,QAAQ;;MCMV,gBAAgB;;;;;;IAG5B,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,sEAAe,IAAI,EAAC,UAAU,IAC7B,qEAAc,KAAK,EAAC,YAAY,EAAC,IAAI,UACpC,4FAAyC,4CAAsC,sEAAiB,SAAI,GAAG,EACvG,8EAAuB,kFACtB,CAAC,IAAI,CAAC,QAAQ,KACd,8DACC,wEAAiB,KAAK,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,6BAEpD,CACb,CACN,CACa,EACd,IAAI,CAAC,QAAQ,KACb,qEAAc,KAAK,EAAC,WAAW,sEAEhB,CACf,CACc,EAEhB,wEACC,qEAAc,KAAK,EAAC,OAAO,EAAC,IAAI,yBAEjB,EACf,qEAAc,KAAK,EAAC,OAAO,8BAAuC,EAClE,qEAAc,KAAK,EAAC,OAAO,oCAA6C,CACzD,CACV,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/tabs/demo/style.css?tag=smoothly-tabs-demo&encapsulation=scoped","src/components/tabs/demo/index.tsx"],"sourcesContent":[":host {\n\tdisplay: block;\n}\n:host[hidden] {\n\tdisplay: none;\n}\n:host > * {\n\tmargin: auto;\n\tmax-width: 1200px;\n\twidth: 100%;\n\tmargin-block: 5rem;\n}\n:host code {\n\tcolor: rgb(var(--smoothly-medium-contrast));\n\tbackground-color: rgb(var(--smoothly-medium-color));\n\tpadding-inline: 0.25rem;\n\tborder-radius: 0.25rem;\n}\n","import { Component, h, Host, State } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-tabs-demo\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTabsDemo {\n\t@State() extraTab: boolean\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-tabs tabs=\"multiple\">\n\t\t\t\t\t<smoothly-tab label=\"Single Tab\" open>\n\t\t\t\t\t\t<strong>Single Tab content here.</strong> If only one tab is available setting <code>tabs</code> to{\" \"}\n\t\t\t\t\t\t<code>\"multiple\"</code> will hide the tab navigation and display the single tab's content directly.\n\t\t\t\t\t\t{!this.extraTab && (\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t<smoothly-button color=\"primary\" onClick={() => (this.extraTab = true)}>\n\t\t\t\t\t\t\t\t\tClick to add extra tab\n\t\t\t\t\t\t\t\t</smoothly-button>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</smoothly-tab>\n\t\t\t\t\t{this.extraTab && (\n\t\t\t\t\t\t<smoothly-tab label=\"Extra tab\">\n\t\t\t\t\t\t\tWhen there are more then one tab, the tab navigation will show.\n\t\t\t\t\t\t</smoothly-tab>\n\t\t\t\t\t)}\n\t\t\t\t</smoothly-tabs>\n\n\t\t\t\t<smoothly-tabs>\n\t\t\t\t\t<smoothly-tab label=\"test1\" open>\n\t\t\t\t\t\tHello world!\n\t\t\t\t\t</smoothly-tab>\n\t\t\t\t\t<smoothly-tab label=\"test2\">this is a test message!</smoothly-tab>\n\t\t\t\t\t<smoothly-tab label=\"test3\">this is a test message again!</smoothly-tab>\n\t\t\t\t</smoothly-tabs>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-047f6a2c.js → p-7b0de261.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-f765921a.js';
-import { d as defineCustomElement$3 } from './p-e6eca6ea.js';
-import { d as defineCustomElement$2 } from './p-8b2f08c5.js';
-import { d as defineCustomElement$1 } from './p-90d81e79.js';
+import { d as defineCustomElement$3 } from './p-a09be6d8.js';
+import { d as defineCustomElement$2 } from './p-9e3806ff.js';
+import { d as defineCustomElement$1 } from './p-da4c10d0.js';
 
 const styleCss = "";
 const SmoothlyThemePickerStyle0 = styleCss;
@@ -13,11 +13,11 @@ const SmoothlyThemePicker = proxyCustomElement(class SmoothlyThemePicker extends
         this.element = "smoothly-css";
     }
     render() {
-        return (h(Host, { key: '884915de7a2490ba82b24a3d5899f2d7fd57b4ef' }, h("smoothly-input-select", { key: 'e7d58eb34326c0ccdcf7596bdd99c8d93df67ded', name: "theme", looks: "border", onSmoothlyInput: e => {
+        return (h(Host, { key: '5a994ebf276306118d92bb477b5dcf04cffd0614' }, h("smoothly-input-select", { key: '98ef8a2da6f5b00f60367874705a8836ba7176cf', name: "theme", looks: "border", onSmoothlyInput: e => {
                 const element = document.querySelector(`#${this.element}`);
                 if (element instanceof HTMLLinkElement && typeof e.detail.theme == "string")
                     element.href = e.detail.theme;
-            } }, h("label", { key: '15d5e8b012d6277cc06d74f1d0e7e99296478515', slot: "label" }, "Select theme"), h("slot", { key: '2b53a278576015e7af789ff1f8097d85855e16e1' }))));
+            } }, h("label", { key: 'de252bb3867e0f59efb66136b6fc7850805bdfea', slot: "label" }, "Select theme"), h("slot", { key: 'f30571604c2c60256ef3f4e4ee57fbf394d7af63' }))));
     }
     static get style() { return SmoothlyThemePickerStyle0; }
 }, [6, "smoothly-theme-picker", {
@@ -55,4 +55,4 @@ defineCustomElement();
 
 export { SmoothlyThemePicker as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-047f6a2c.js.map
+//# sourceMappingURL=p-7b0de261.js.map

package/dist/components/{p-047f6a2c.js.map → p-7b0de261.js.map}

@@ -1 +1 @@
-{"file":"p-047f6a2c.js","mappings":";;;;;AAAA,MAAM,QAAQ,GAAG,EAAE,CAAC;AACpB,kCAAe,QAAQ;;MCMV,mBAAmB;;;;uBACb,cAAc;;IAChC,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,8EACC,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,QAAQ,EACd,eAAe,EAAE,CAAC;gBACjB,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC,CAAA;gBAC1D,IAAI,OAAO,YAAY,eAAe,IAAI,OAAO,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,QAAQ;oBAC1E,OAAO,CAAC,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAA;aAC9B,IACD,8DAAO,IAAI,EAAC,OAAO,mBAAqB,EACxC,8DAAQ,CACe,CAClB,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/theme/picker/style.css?tag=smoothly-theme-picker&encapsulation=scoped","src/components/theme/picker/index.tsx"],"sourcesContent":["","import { Component, h, Host, Prop } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-theme-picker\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyThemePicker {\n\t@Prop() element = \"smoothly-css\"\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-input-select\n\t\t\t\t\tname=\"theme\"\n\t\t\t\t\tlooks=\"border\"\n\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\tconst element = document.querySelector(`#${this.element}`)\n\t\t\t\t\t\tif (element instanceof HTMLLinkElement && typeof e.detail.theme == \"string\")\n\t\t\t\t\t\t\telement.href = e.detail.theme\n\t\t\t\t\t}}>\n\t\t\t\t\t<label slot=\"label\">Select theme</label>\n\t\t\t\t\t<slot />\n\t\t\t\t</smoothly-input-select>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-7b0de261.js","mappings":";;;;;AAAA,MAAM,QAAQ,GAAG,EAAE,CAAC;AACpB,kCAAe,QAAQ;;MCMV,mBAAmB;;;;uBACb,cAAc;;IAChC,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,8EACC,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,QAAQ,EACd,eAAe,EAAE,CAAC;gBACjB,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC,CAAA;gBAC1D,IAAI,OAAO,YAAY,eAAe,IAAI,OAAO,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,QAAQ;oBAC1E,OAAO,CAAC,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAA;aAC9B,IACD,8DAAO,IAAI,EAAC,OAAO,mBAAqB,EACxC,8DAAQ,CACe,CAClB,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/theme/picker/style.css?tag=smoothly-theme-picker&encapsulation=scoped","src/components/theme/picker/index.tsx"],"sourcesContent":["","import { Component, h, Host, Prop } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-theme-picker\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyThemePicker {\n\t@Prop() element = \"smoothly-css\"\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-input-select\n\t\t\t\t\tname=\"theme\"\n\t\t\t\t\tlooks=\"border\"\n\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\tconst element = document.querySelector(`#${this.element}`)\n\t\t\t\t\t\tif (element instanceof HTMLLinkElement && typeof e.detail.theme == \"string\")\n\t\t\t\t\t\t\telement.href = e.detail.theme\n\t\t\t\t\t}}>\n\t\t\t\t\t<label slot=\"label\">Select theme</label>\n\t\t\t\t\t<slot />\n\t\t\t\t</smoothly-input-select>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-10e9b56f.js → p-7b9c60c5.js}

@@ -3,20 +3,20 @@ import { I as Icon, C as Color, F as Fill } from './p-57ac5d1b.js';
 import './p-390767c7.js';
 import { N as Notice } from './p-ef01331e.js';
 import './p-47ea6b68.js';
-import { d as defineCustomElement$e } from './p-0eacf5f4.js';
-import { d as defineCustomElement$d } from './p-11cc925c.js';
-import { d as defineCustomElement$c } from './p-ff99dcde.js';
-import { d as defineCustomElement$b } from './p-51cb1946.js';
-import { d as defineCustomElement$a } from './p-21601376.js';
-import { d as defineCustomElement$9 } from './p-d9989605.js';
-import { d as defineCustomElement$8 } from './p-16c06f14.js';
-import { d as defineCustomElement$7 } from './p-e6eca6ea.js';
-import { d as defineCustomElement$6 } from './p-0fb1eac0.js';
-import { d as defineCustomElement$5 } from './p-8ac400d5.js';
-import { d as defineCustomElement$4 } from './p-3062590d.js';
-import { d as defineCustomElement$3 } from './p-8b2f08c5.js';
-import { d as defineCustomElement$2 } from './p-90d81e79.js';
-import { d as defineCustomElement$1 } from './p-f21f43d1.js';
+import { d as defineCustomElement$e } from './p-c98922f4.js';
+import { d as defineCustomElement$d } from './p-065cbcf5.js';
+import { d as defineCustomElement$c } from './p-b235b5aa.js';
+import { d as defineCustomElement$b } from './p-d3c8be66.js';
+import { d as defineCustomElement$a } from './p-5bf78c75.js';
+import { d as defineCustomElement$9 } from './p-d8bd7cc0.js';
+import { d as defineCustomElement$8 } from './p-ed1e7da4.js';
+import { d as defineCustomElement$7 } from './p-a09be6d8.js';
+import { d as defineCustomElement$6 } from './p-cef759f2.js';
+import { d as defineCustomElement$5 } from './p-56fc01bf.js';
+import { d as defineCustomElement$4 } from './p-b3cfa9a5.js';
+import { d as defineCustomElement$3 } from './p-9e3806ff.js';
+import { d as defineCustomElement$2 } from './p-da4c10d0.js';
+import { d as defineCustomElement$1 } from './p-18451fa9.js';
 
 const styleCss = ".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 SmoothlyIconDemoStyle0 = styleCss;
@@ -31,7 +31,7 @@ const SmoothlyIconDemo = proxyCustomElement(class SmoothlyIconDemo extends H {
         this.props = {};
     }
     render() {
-        return (h(Host, { key: '62708f079ddee486734d33e49e50ae2558cc52d7' }, h("h2", { key: '9daf63fea24f813509180b6da99d1989aad4448b' }, "Filter and Variants"), h("smoothly-form", { key: '6ae13747e710a0e95782f87fc202ccda48db3824', onSmoothlyFormInput: e => (this.display = e.detail) }, h("smoothly-input", { key: '4d206c676a1a629331aa1492254c766566135ede', name: "filter" }, "Filter"), h("smoothly-input-select", { key: '1dc08cd1e052453d4aa7e27fba2d65609a49f866', name: "variant" }, h("span", { key: '646c1e579d8cb2e679c77a8835f620cb5e7dcaa9', slot: "label" }, "Variant"), h("smoothly-item", { key: 'cddbecdb6a46aa56e29a70179003e92afdf21ef4', value: "outline" }, "outline"), h("smoothly-item", { key: '3121ff8590e82394c3bbf2c352e56fd7f0c3e048', value: "sharp" }, "sharp"), h("smoothly-input-clear", { key: 'affa09805a787591ad55073219a04e1083a70848', slot: "end" }))), h("h2", { key: 'da00f6dafde8079b44e962bd4a51fab57b5769cf' }, "Props"), h("smoothly-form", { key: '420c4c62dc31e8606475afd0754f535f7ae550c2', onSmoothlyFormInput: e => (this.props = e.detail) }, h("smoothly-input-select", { key: '5843a6d6eeeced970126d5f602693fa365c2492f', name: "color" }, h("span", { key: '770f177f71499fa8274523241b97f4162a4bafb2', slot: "label" }, "Color"), Color.values.map(color => (h("smoothly-item", { value: color, color: color }, color))), h("smoothly-input-clear", { key: 'c2ce6484987455f4a9db213c9737489e86283a33', slot: "end" })), h("smoothly-input-select", { key: 'c5b32eb509f543b213845dca10df50df9f04e8e8', name: "fill" }, h("span", { key: '3d94614bc074a46b2f687f934377b31f727c7917', slot: "label" }, "Fill"), Fill.values.map(fill => (h("smoothly-item", { value: fill }, fill))), h("smoothly-input-clear", { key: '40957b700c25fb1a27402667666bafe0cd0cc182', slot: "end" })), h("smoothly-input-select", { key: 'cbef37a017be99621df6698d57eddd3b6975df0c', name: "flip" }, h("span", { key: 'd384e098cb6b58c141e98fbb37e28f00669e7884', slot: "label" }, "Flip"), h("smoothly-item", { key: '3990c09061387a8aea7753103db56e08fb5c4f20', value: "x" }, "x"), h("smoothly-item", { key: 'a8e48ae9700a50c1340bbb05706386335441de24', value: "y" }, "y"), h("smoothly-input-clear", { key: '984009c27202699fb8bfe6aad99886087afddfcb', slot: "end" })), h("smoothly-input-select", { key: 'b192607f8615cac74df64ed1afda16ca5a88c884', name: "size" }, h("span", { key: '899b2324d9993983766fb24ee175d8bfa758dbe5', slot: "label" }, "Size"), h("smoothly-item", { key: '56e975109e10df35375eee193081e96c58d104fa', value: "tiny" }, "tiny"), h("smoothly-item", { key: '9d9d204e20db7f1447f38947dd30521bcd68f5f0', value: "small" }, "small"), h("smoothly-item", { key: '9d1216f79b2ab0f66cfc395eebddf8d88be3f6f5', value: "medium" }, "medium"), h("smoothly-item", { key: '67e4f4bc0df6baa70ee927eaa0a275fdd3aef8d7', value: "large" }, "large"), h("smoothly-item", { key: '42580e58183e763f425e375c42940d8613f0946a', value: "xlarge" }, "xlarge"), h("smoothly-input-clear", { key: '11188b6cb463578b0253d694b097a13af0e842c5', slot: "end" })), h("smoothly-input-range", { key: '250cb6caf4a697ab7a7c4af16e0611858a0cdec8', name: "rotate", step: 1, min: -180, max: 180, value: 0 }, "Rotate", h("smoothly-input-clear", { key: '01eef0ab611eaec82527f731f7423ad023af7507', slot: "end" }))), h("h1", { key: '69996c44ed040941e07bad3191edbf8f65d321a0' }, "Icons"), h("div", { key: 'c66af90970b454464bef605bc942ee1ea9796ec5', class: "icons" }, [
+        return (h(Host, { key: 'a0706709d49ae4e3beea0bb5a592cce83dbdfc50' }, h("h2", { key: 'c4058a68fd71e6c1a659f997815902225772e0ce' }, "Filter and Variants"), h("smoothly-form", { key: '2a7206c94f5bd868954ef2bbab2c16ba5ec701be', onSmoothlyFormInput: e => (this.display = e.detail) }, h("smoothly-input", { key: 'c81c786a01c0c9101c4c2669dde4891fcc8d79bd', name: "filter" }, "Filter"), h("smoothly-input-select", { key: '21d064354e488eedaf0f4d837324d6473edffd99', name: "variant" }, h("span", { key: '8e770299b884f6920949df5386e8eb2a1b68c057', slot: "label" }, "Variant"), h("smoothly-item", { key: 'b29db45415e020b3170d75a5b114c826e9d88454', value: "outline" }, "outline"), h("smoothly-item", { key: '9d032a3f19743194c46b68b5e9ee58e4d13d15dc', value: "sharp" }, "sharp"), h("smoothly-input-clear", { key: '32adc83b75e1cba0af54469866681129265c108d', slot: "end" }))), h("h2", { key: 'b7261752dc07d9859f217cdd79769e490b950ee0' }, "Props"), h("smoothly-form", { key: '3e34648bfa6bf8628974bbda25db0132bef60982', onSmoothlyFormInput: e => (this.props = e.detail) }, h("smoothly-input-select", { key: 'fe612d11a476b67e7ac7535df7a06eed6676545b', name: "color" }, h("span", { key: 'a8774f195af193c7bf455e3f1ee746c83393de2d', slot: "label" }, "Color"), Color.values.map(color => (h("smoothly-item", { value: color, color: color }, color))), h("smoothly-input-clear", { key: 'cb96ef4ea25111b19a8a32f61ebda4d48aed061f', slot: "end" })), h("smoothly-input-select", { key: '8be80163691b4843d40152e228ccf837b28d902c', name: "fill" }, h("span", { key: '7a4ad5ab5d75fdb994d7dd51e27fe0f3048024cf', slot: "label" }, "Fill"), Fill.values.map(fill => (h("smoothly-item", { value: fill }, fill))), h("smoothly-input-clear", { key: '6e945d2ce1769e1b97b4f28cfb52aa4f5c288e01', slot: "end" })), h("smoothly-input-select", { key: '3cb368e15af0312dfa6cb64ddea95b06d1f8aa7f', name: "flip" }, h("span", { key: '8622114e3082f040179d53ea261d17f585a29c5b', slot: "label" }, "Flip"), h("smoothly-item", { key: '41940930aed4abfafb6b50713dc133f2cd34c9c5', value: "x" }, "x"), h("smoothly-item", { key: '9d151f226cf4aa1bcf82415b74341259f9f78b24', value: "y" }, "y"), h("smoothly-input-clear", { key: '72975515ddf54f1fd7dab600ef080ee8498c07bb', slot: "end" })), h("smoothly-input-select", { key: '4ba83461e4023c99ef94fcf0c351ac98e70e0cea', name: "size" }, h("span", { key: 'ea31df439d850779406fa35094e68c590e3c8add', slot: "label" }, "Size"), h("smoothly-item", { key: 'b27300ba82640e5ee2e78b712417aa96c7bb6093', value: "tiny" }, "tiny"), h("smoothly-item", { key: '0e5de1cc80c0a336c4dfc1b77e21f6593483fe44', value: "small" }, "small"), h("smoothly-item", { key: '2d71100ccd666e7e53c40ad9dcb24094d6316ba6', value: "medium" }, "medium"), h("smoothly-item", { key: 'b5dc3ca6278d607f91df771c39c67f2b73ee0a86', value: "large" }, "large"), h("smoothly-item", { key: '9dfba645effcec688557c2bed05c44698dd0159b', value: "xlarge" }, "xlarge"), h("smoothly-input-clear", { key: 'e23d58562e554d6096a44feabaf4365c800c82f3', slot: "end" })), h("smoothly-input-range", { key: 'e6076caecd252d6185fc88c8f5dd13b544d115e9', name: "rotate", step: 1, min: -180, max: 180, value: 0 }, "Rotate", h("smoothly-input-clear", { key: '47d878d21777308baffba2529d08aa1a7a85954c', slot: "end" }))), h("h1", { key: '8f9791fe61a60dcb595332f08387d297caf25d9a' }, "Icons"), h("div", { key: 'b85cbd6ffe7d5a3cdacba67227114ffc6ecd641b', class: "icons" }, [
             ...Icon.Name.values
                 .filter(name => !this.display.filter || name.includes(this.display.filter))
                 .map((name) => (this.display.variant ? `${name}-${this.display.variant}` : name)),
@@ -133,4 +133,4 @@ defineCustomElement();
 
 export { SmoothlyIconDemo as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-10e9b56f.js.map
+//# sourceMappingURL=p-7b9c60c5.js.map

package/dist/components/{p-10e9b56f.js.map → p-7b9c60c5.js.map}

@@ -1 +1 @@
-{"file":"p-10e9b56f.js","mappings":"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","names":[],"sources":["src/components/icon/demo/style.css?tag=smoothly-icon-demo&encapsulation=scoped","src/components/icon/demo/index.tsx"],"sourcesContent":[":host {\n\tdisplay: block;\n\twidth: clamp(200px, 100%, 1200px);\n\tmargin: auto;\n}\n:host([hidden]) {\n\tdisplay: none;\n}\n:host > div {\n\tdisplay: flex;\n\tflex-flow: row wrap;\n}\n\n:host > div > smoothly-icon {\n\tpadding: 1rem;\n\tposition: relative;\n}\n\n:host > div > smoothly-icon:hover {\n\tscale: 1.5;\n}\n\n:host > div > smoothly-icon:hover::after {\n\tcontent: attr(data-name);\n\tposition: absolute;\n\twhite-space: nowrap;\n\tbottom: 100%;\n\tbackground: rgb(var(--smoothly-default-contrast));\n\tcolor: rgb(var(--smoothly-default-color));\n\tpadding: 0.25rem 1rem;\n\tz-index: 1;\n\tpointer-events: none;\n}\n","import { Component, Event, EventEmitter, h, Host, State } from \"@stencil/core\"\nimport { Color, Fill, Icon, Notice } from \"../../../model\"\n@Component({\n\ttag: \"smoothly-icon-demo\",\n\tstyleUrl: \"./style.css\",\n\tscoped: true,\n})\nexport class SmoothlyIconDemo {\n\tpage = 0\n\n\t@State() display: { filter?: string; variant?: \"outline\" | \"sharp\" } = {}\n\t@State() props: {\n\t\tcolor?: Color\n\t\tfill?: Fill\n\t\tflip?: \"x\" | \"y\"\n\t\tsize?: \"tiny\" | \"small\" | \"medium\" | \"large\" | \"xlarge\"\n\t\trotate?: number\n\t} = {}\n\t@Event() notice: EventEmitter<Notice>\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Filter and Variants</h2>\n\t\t\t\t<smoothly-form onSmoothlyFormInput={e => (this.display = e.detail)}>\n\t\t\t\t\t<smoothly-input name=\"filter\">Filter</smoothly-input>\n\t\t\t\t\t<smoothly-input-select name=\"variant\">\n\t\t\t\t\t\t<span slot=\"label\">Variant</span>\n\t\t\t\t\t\t<smoothly-item value={\"outline\"}>outline</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"sharp\"}>sharp</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Props</h2>\n\t\t\t\t<smoothly-form onSmoothlyFormInput={e => (this.props = e.detail)}>\n\t\t\t\t\t<smoothly-input-select name={\"color\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>Color</span>\n\t\t\t\t\t\t{Color.values.map(color => (\n\t\t\t\t\t\t\t<smoothly-item value={color} color={color}>\n\t\t\t\t\t\t\t\t{color}\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t))}\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name={\"fill\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>Fill</span>\n\t\t\t\t\t\t{Fill.values.map(fill => (\n\t\t\t\t\t\t\t<smoothly-item value={fill}>{fill}</smoothly-item>\n\t\t\t\t\t\t))}\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name=\"flip\">\n\t\t\t\t\t\t<span slot={\"label\"}>Flip</span>\n\t\t\t\t\t\t<smoothly-item value={\"x\"}>x</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"y\"}>y</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name={\"size\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>Size</span>\n\t\t\t\t\t\t<smoothly-item value={\"tiny\"}>tiny</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"small\"}>small</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"medium\"}>medium</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"large\"}>large</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"xlarge\"}>xlarge</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-range name=\"rotate\" step={1} min={-180} max={180} value={0}>\n\t\t\t\t\t\tRotate\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h1>Icons</h1>\n\t\t\t\t<div class=\"icons\">\n\t\t\t\t\t{[\n\t\t\t\t\t\t...Icon.Name.values\n\t\t\t\t\t\t\t.filter(name => !this.display.filter || name.includes(this.display.filter))\n\t\t\t\t\t\t\t.map((name): Icon => (this.display.variant ? `${name}-${this.display.variant}` : name)),\n\t\t\t\t\t\t...Icon.Logo.values.filter(name => !this.display.filter || name.includes(this.display.filter)),\n\t\t\t\t\t].map(name => (\n\t\t\t\t\t\t<smoothly-icon\n\t\t\t\t\t\t\tname={name}\n\t\t\t\t\t\t\ttoolTip={name}\n\t\t\t\t\t\t\tdata-name={name}\n\t\t\t\t\t\t\tcolor={this.props.color}\n\t\t\t\t\t\t\tfill={this.props.fill}\n\t\t\t\t\t\t\tflip={this.props.flip}\n\t\t\t\t\t\t\tsize={this.props.size}\n\t\t\t\t\t\t\trotate={this.props.rotate}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tnavigator.clipboard.writeText(name)\n\t\t\t\t\t\t\t\tthis.notice.emit(Notice.succeeded(`Copied \"${name}\"`))\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-7b9c60c5.js","mappings":";;;;;;;;;;;;;;;;;;;;AAAA,MAAM,QAAQ,GAAG,8uBAA8uB,CAAC;AAChwB,+BAAe,QAAQ;;MCMV,gBAAgB;;;;;QAC5B,SAAI,GAAG,CAAC,CAAA;uBAE+D,EAAE;qBAOrE,EAAE;;IAGN,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,mFAA4B,EAC5B,sEAAe,mBAAmB,EAAE,CAAC,KAAK,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,MAAM,CAAC,IACjE,uEAAgB,IAAI,EAAC,QAAQ,aAAwB,EACrD,8EAAuB,IAAI,EAAC,SAAS,IACpC,6DAAM,IAAI,EAAC,OAAO,cAAe,EACjC,sEAAe,KAAK,EAAE,SAAS,cAAyB,EACxD,sEAAe,KAAK,EAAE,OAAO,YAAuB,EACpD,6EAAsB,IAAI,EAAE,KAAK,GAAI,CACd,CACT,EAChB,qEAAc,EACd,sEAAe,mBAAmB,EAAE,CAAC,KAAK,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,IAC/D,8EAAuB,IAAI,EAAE,OAAO,IACnC,6DAAM,IAAI,EAAE,OAAO,YAAc,EAChC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,KACtB,qBAAe,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,IACvC,KAAK,CACS,CAChB,CAAC,EACF,6EAAsB,IAAI,EAAE,KAAK,GAAI,CACd,EACxB,8EAAuB,IAAI,EAAE,MAAM,IAClC,6DAAM,IAAI,EAAE,OAAO,WAAa,EAC/B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,KACpB,qBAAe,KAAK,EAAE,IAAI,IAAG,IAAI,CAAiB,CAClD,CAAC,EACF,6EAAsB,IAAI,EAAE,KAAK,GAAI,CACd,EACxB,8EAAuB,IAAI,EAAC,MAAM,IACjC,6DAAM,IAAI,EAAE,OAAO,WAAa,EAChC,sEAAe,KAAK,EAAE,GAAG,QAAmB,EAC5C,sEAAe,KAAK,EAAE,GAAG,QAAmB,EAC5C,6EAAsB,IAAI,EAAE,KAAK,GAAI,CACd,EACxB,8EAAuB,IAAI,EAAE,MAAM,IAClC,6DAAM,IAAI,EAAE,OAAO,WAAa,EAChC,sEAAe,KAAK,EAAE,MAAM,WAAsB,EAClD,sEAAe,KAAK,EAAE,OAAO,YAAuB,EACpD,sEAAe,KAAK,EAAE,QAAQ,aAAwB,EACtD,sEAAe,KAAK,EAAE,OAAO,YAAuB,EACpD,sEAAe,KAAK,EAAE,QAAQ,aAAwB,EACtD,6EAAsB,IAAI,EAAE,KAAK,GAAI,CACd,EACxB,6EAAsB,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC,cAEzE,6EAAsB,IAAI,EAAE,KAAK,GAAI,CACf,CACR,EAChB,qEAAc,EACd,4DAAK,KAAK,EAAC,OAAO,IAChB;YACA,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM;iBACjB,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;iBAC1E,GAAG,CAAC,CAAC,IAAI,MAAY,IAAI,CAAC,OAAO,CAAC,OAAO,GAAG,GAAG,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,CAAC;YACxF,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;SAC9F,CAAC,GAAG,CAAC,IAAI,KACT,qBACC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,IAAI,eACF,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EACrB,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EACzB,OAAO,EAAE;gBACR,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,CAAA;gBACnC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,IAAI,GAAG,CAAC,CAAC,CAAA;aACtD,GACA,CACF,CAAC,CACG,CACA,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/icon/demo/style.css?tag=smoothly-icon-demo&encapsulation=scoped","src/components/icon/demo/index.tsx"],"sourcesContent":[":host {\n\tdisplay: block;\n\twidth: clamp(200px, 100%, 1200px);\n\tmargin: auto;\n}\n:host([hidden]) {\n\tdisplay: none;\n}\n:host > div {\n\tdisplay: flex;\n\tflex-flow: row wrap;\n}\n\n:host > div > smoothly-icon {\n\tpadding: 1rem;\n\tposition: relative;\n}\n\n:host > div > smoothly-icon:hover {\n\tscale: 1.5;\n}\n\n:host > div > smoothly-icon:hover::after {\n\tcontent: attr(data-name);\n\tposition: absolute;\n\twhite-space: nowrap;\n\tbottom: 100%;\n\tbackground: rgb(var(--smoothly-default-contrast));\n\tcolor: rgb(var(--smoothly-default-color));\n\tpadding: 0.25rem 1rem;\n\tz-index: 1;\n\tpointer-events: none;\n}\n","import { Component, Event, EventEmitter, h, Host, State } from \"@stencil/core\"\nimport { Color, Fill, Icon, Notice } from \"../../../model\"\n@Component({\n\ttag: \"smoothly-icon-demo\",\n\tstyleUrl: \"./style.css\",\n\tscoped: true,\n})\nexport class SmoothlyIconDemo {\n\tpage = 0\n\n\t@State() display: { filter?: string; variant?: \"outline\" | \"sharp\" } = {}\n\t@State() props: {\n\t\tcolor?: Color\n\t\tfill?: Fill\n\t\tflip?: \"x\" | \"y\"\n\t\tsize?: \"tiny\" | \"small\" | \"medium\" | \"large\" | \"xlarge\"\n\t\trotate?: number\n\t} = {}\n\t@Event() notice: EventEmitter<Notice>\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Filter and Variants</h2>\n\t\t\t\t<smoothly-form onSmoothlyFormInput={e => (this.display = e.detail)}>\n\t\t\t\t\t<smoothly-input name=\"filter\">Filter</smoothly-input>\n\t\t\t\t\t<smoothly-input-select name=\"variant\">\n\t\t\t\t\t\t<span slot=\"label\">Variant</span>\n\t\t\t\t\t\t<smoothly-item value={\"outline\"}>outline</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"sharp\"}>sharp</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h2>Props</h2>\n\t\t\t\t<smoothly-form onSmoothlyFormInput={e => (this.props = e.detail)}>\n\t\t\t\t\t<smoothly-input-select name={\"color\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>Color</span>\n\t\t\t\t\t\t{Color.values.map(color => (\n\t\t\t\t\t\t\t<smoothly-item value={color} color={color}>\n\t\t\t\t\t\t\t\t{color}\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t))}\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name={\"fill\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>Fill</span>\n\t\t\t\t\t\t{Fill.values.map(fill => (\n\t\t\t\t\t\t\t<smoothly-item value={fill}>{fill}</smoothly-item>\n\t\t\t\t\t\t))}\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name=\"flip\">\n\t\t\t\t\t\t<span slot={\"label\"}>Flip</span>\n\t\t\t\t\t\t<smoothly-item value={\"x\"}>x</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"y\"}>y</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-select name={\"size\"}>\n\t\t\t\t\t\t<span slot={\"label\"}>Size</span>\n\t\t\t\t\t\t<smoothly-item value={\"tiny\"}>tiny</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"small\"}>small</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"medium\"}>medium</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"large\"}>large</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value={\"xlarge\"}>xlarge</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<smoothly-input-range name=\"rotate\" step={1} min={-180} max={180} value={0}>\n\t\t\t\t\t\tRotate\n\t\t\t\t\t\t<smoothly-input-clear slot={\"end\"} />\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t</smoothly-form>\n\t\t\t\t<h1>Icons</h1>\n\t\t\t\t<div class=\"icons\">\n\t\t\t\t\t{[\n\t\t\t\t\t\t...Icon.Name.values\n\t\t\t\t\t\t\t.filter(name => !this.display.filter || name.includes(this.display.filter))\n\t\t\t\t\t\t\t.map((name): Icon => (this.display.variant ? `${name}-${this.display.variant}` : name)),\n\t\t\t\t\t\t...Icon.Logo.values.filter(name => !this.display.filter || name.includes(this.display.filter)),\n\t\t\t\t\t].map(name => (\n\t\t\t\t\t\t<smoothly-icon\n\t\t\t\t\t\t\tname={name}\n\t\t\t\t\t\t\ttoolTip={name}\n\t\t\t\t\t\t\tdata-name={name}\n\t\t\t\t\t\t\tcolor={this.props.color}\n\t\t\t\t\t\t\tfill={this.props.fill}\n\t\t\t\t\t\t\tflip={this.props.flip}\n\t\t\t\t\t\t\tsize={this.props.size}\n\t\t\t\t\t\t\trotate={this.props.rotate}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tnavigator.clipboard.writeText(name)\n\t\t\t\t\t\t\t\tthis.notice.emit(Notice.succeeded(`Copied \"${name}\"`))\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-ecbadf51.js → p-840a2e6c.js}

@@ -1,34 +1,34 @@
 import { p as proxyCustomElement, H, h, F as Fragment, d as Host } from './p-f765921a.js';
 import { R as RGB } from './p-57ac5d1b.js';
-import { d as defineCustomElement$t } from './p-0eacf5f4.js';
-import { d as defineCustomElement$s } from './p-a4614623.js';
-import { d as defineCustomElement$r } from './p-182310f5.js';
-import { d as defineCustomElement$q } from './p-11cc925c.js';
-import { d as defineCustomElement$p } from './p-ff99dcde.js';
-import { d as defineCustomElement$o } from './p-51cb1946.js';
-import { d as defineCustomElement$n } from './p-21601376.js';
-import { d as defineCustomElement$m } from './p-d9989605.js';
-import { d as defineCustomElement$l } from './p-16c06f14.js';
-import { d as defineCustomElement$k } from './p-e6eca6ea.js';
-import { d as defineCustomElement$j } from './p-0fb1eac0.js';
-import { d as defineCustomElement$i } from './p-fd158b77.js';
-import { d as defineCustomElement$h } from './p-7b8d9ec5.js';
-import { d as defineCustomElement$g } from './p-97254dfe.js';
-import { d as defineCustomElement$f } from './p-3a1f5e8b.js';
-import { d as defineCustomElement$e } from './p-eba2af2b.js';
-import { d as defineCustomElement$d } from './p-95439799.js';
-import { d as defineCustomElement$c } from './p-b1d28f3f.js';
-import { d as defineCustomElement$b } from './p-3217c7b5.js';
-import { d as defineCustomElement$a } from './p-5a0e167d.js';
-import { d as defineCustomElement$9 } from './p-3062590d.js';
-import { d as defineCustomElement$8 } from './p-8b2f08c5.js';
-import { d as defineCustomElement$7 } from './p-5bee4bdc.js';
-import { d as defineCustomElement$6 } from './p-90d81e79.js';
-import { d as defineCustomElement$5 } from './p-f21f43d1.js';
-import { d as defineCustomElement$4 } from './p-a91db04a.js';
-import { d as defineCustomElement$3 } from './p-9184ede6.js';
-import { d as defineCustomElement$2 } from './p-0ce90bf9.js';
-import { d as defineCustomElement$1 } from './p-194c03be.js';
+import { d as defineCustomElement$t } from './p-c98922f4.js';
+import { d as defineCustomElement$s } from './p-e5627b06.js';
+import { d as defineCustomElement$r } from './p-a57e7345.js';
+import { d as defineCustomElement$q } from './p-065cbcf5.js';
+import { d as defineCustomElement$p } from './p-b235b5aa.js';
+import { d as defineCustomElement$o } from './p-d3c8be66.js';
+import { d as defineCustomElement$n } from './p-5bf78c75.js';
+import { d as defineCustomElement$m } from './p-d8bd7cc0.js';
+import { d as defineCustomElement$l } from './p-ed1e7da4.js';
+import { d as defineCustomElement$k } from './p-a09be6d8.js';
+import { d as defineCustomElement$j } from './p-cef759f2.js';
+import { d as defineCustomElement$i } from './p-d1dcafa9.js';
+import { d as defineCustomElement$h } from './p-3609c2f0.js';
+import { d as defineCustomElement$g } from './p-2c9a8b37.js';
+import { d as defineCustomElement$f } from './p-03be2708.js';
+import { d as defineCustomElement$e } from './p-50847f24.js';
+import { d as defineCustomElement$d } from './p-1e8fa07d.js';
+import { d as defineCustomElement$c } from './p-c3d52c12.js';
+import { d as defineCustomElement$b } from './p-ba76192d.js';
+import { d as defineCustomElement$a } from './p-d81a3a84.js';
+import { d as defineCustomElement$9 } from './p-b3cfa9a5.js';
+import { d as defineCustomElement$8 } from './p-9e3806ff.js';
+import { d as defineCustomElement$7 } from './p-e9e71692.js';
+import { d as defineCustomElement$6 } from './p-da4c10d0.js';
+import { d as defineCustomElement$5 } from './p-18451fa9.js';
+import { d as defineCustomElement$4 } from './p-3024abfc.js';
+import { d as defineCustomElement$3 } from './p-3989ef69.js';
+import { d as defineCustomElement$2 } from './p-03c91070.js';
+import { d as defineCustomElement$1 } from './p-d1462fc3.js';
 
 const styleCss = ".sc-smoothly-form-demo-pet-h{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:auto auto;grid-column-gap:2rem}.sc-smoothly-form-demo-pet-h smoothly-input-checkbox[name=\"hasOwner\"].sc-smoothly-form-demo-pet,.sc-smoothly-form-demo-pet-h>smoothly-form.sc-smoothly-form-demo-pet smoothly-summary.sc-smoothly-form-demo-pet,.sc-smoothly-form-demo-pet-h>smoothly-form.sc-smoothly-form-demo-pet smoothly-tabs.sc-smoothly-form-demo-pet{flex-basis:100%}";
 const SmoothlyFormDemoPetStyle0 = styleCss;
@@ -43,10 +43,10 @@ const SmoothlyFormDemoPet = proxyCustomElement(class SmoothlyFormDemoPet extends
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: 'ca731e714eb7d3c9027c8eaacccf0ef611917de7' }, h("h2", { key: '6b4198cb4bc6f85810f4559fcfa97b8aa1948d76' }, "Pet"), h("h3", { key: '8877db7feccc2c437df73f4b9d1df2c0d9e9397f' }, "Value"), h("smoothly-form", { key: '817548dbe700db117d066032605e83e89bae52f9', looks: "border", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)), onSmoothlyFormInput: e => (this.value = Object.assign({}, e.detail)) }, h("smoothly-input", { key: '159422b05784af942138ba2b73c663988a981795', type: "text", name: "name.first" }, "Name"), h("smoothly-input", { key: 'a63d1fee5a11efff76f921e18cf7905473a41715', type: "integer", name: "age" }, "Age (Years)"), h("smoothly-input-checkbox", { key: '8ad23527074d579b7ba39e9d39ba25c458173114', name: "hasOwner", onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
+        return (h(Host, { key: 'a18d5c4d14929268195fcd13712e653abee7ce4c' }, h("h2", { key: '0357eb46ceb9160a5e7c0301134d5ccec5dbecb1' }, "Pet"), h("h3", { key: '7f0ab35101334386099c65cd327e2db657ce81ca' }, "Value"), h("smoothly-form", { key: 'c5d882668e047eeaade1c61ba6faab1d12db7b7f', looks: "border", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)), onSmoothlyFormInput: e => (this.value = Object.assign({}, e.detail)) }, h("smoothly-input", { key: 'd2e45273c5ce4defe229bbd9602a6a61a807afe2', type: "text", name: "name.first" }, "Name"), h("smoothly-input", { key: '4f4ca5d95583b231a08972da2e97ab4207529257', type: "integer", name: "age" }, "Age (Years)"), h("smoothly-input-checkbox", { key: '471443d6c675415da6a3c623b7bc91c3b6d39742', name: "hasOwner", onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
                 this.hasOwner = e.detail.hasOwner;
                 e.stopPropagation();
-            } }, "Has Owner"), this.hasOwner && (h(Fragment, { key: 'fc45ad128e8f79b37745c32f67d1ba7e8b1c4fbf' }, h("smoothly-input", { key: '86d389e5e7b0d28d0df399400085729f6471716c', type: "text", name: "owner.firstName", value: this.owner.firstName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { firstName: e.detail["owner.firstName"] })) }, "Owner First Name"), h("smoothly-input", { key: 'cd62d7fb931c4400103fcc9d9a053a05fa85e487', type: "text", name: "owner.lastName", value: this.owner.lastName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { lastName: e.detail["owner.lastName"] })) }, "Owner Last Name"), h("smoothly-input-file", { key: 'a2896030432f228ad920cdeb4ba5858622ec80c5', name: "owner.picture" }, h("span", { key: '24617088152871d9ccdaec6090a8f373d91f23bd', slot: "label" }, "Owner picture")), h("smoothly-input-date", { key: '0401cc3c3323b07f71276a072319a30325200c3a', name: "owner.birthday", value: this.owner.birthday, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { birthday: e.detail["owner.birthday"] })) }, "Owner birthday"), h("smoothly-input-date-range", { key: '157925e70ec5003e368a04d598974017ed09ebb4', name: "owner.ownedRange", start: (_a = this.owner.ownedRange) === null || _a === void 0 ? void 0 : _a.start, end: (_b = this.owner.ownedRange) === null || _b === void 0 ? void 0 : _b.end, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { ownedRange: e.detail["owner.ownedRange"] })) }, "Owner ownedRange"), h("smoothly-input-range", { key: 'ddb0c2ce68a4217fc9888bd5cfd1ba23f86070c7', name: "owner.height", step: 1, max: 250, value: this.owner.height, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { height: e.detail["owner.height"] })) }, "Owner's Height"), h("smoothly-input-select", { key: 'c8c5da0249521e8531c89a7b8b3ac763d87efb41', name: "owner.favoriteHat" }, h("span", { key: 'a80454815d98de8211d0811be4f4e010eb5fea1d', slot: "label" }, "Owner's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index, selected: this.owner.favoriteHat == value }, value)))), h("smoothly-input-color", { key: 'e89472883061c53b0f8eb697ee7780fddd438426', name: "owner.favoriteColor", value: this.owner.favoriteColor ? RGB.toHex(this.owner.favoriteColor) : undefined, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoriteColor: e.detail["owner.favoriteColor"] })) }, "Owner's Favorite Color"), h("smoothly-input-radio", { key: '50c7b642ea08b27fd6f2a29d1cd1985b13f14789', name: "owner.favoritePizza", value: this.owner.favoritePizza, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoritePizza: e.detail["owner.favoritePizza"] })) }, h("span", { key: 'baa6df6905dd70e4572b91ee17d599c75a593c91', slot: "label" }, "Owner's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '5bb00bd662f3c4e537ce4fd107845b8d5abf09fd', name: "owner.hasPet", checked: this.owner.hasPet, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { hasPet: e.detail["owner.hasPet"] })) }, "Has Pet"))), h("smoothly-summary", { key: '4a3fc4cd07aa3873945c3ab974f99d037e3fbbda' }, h("span", { key: '0afdd64ca5682fbffd32bd276ad1754347be7c22', slot: "summary" }, "Summary"), h("div", { key: '495ef4c2d75d1643bc4f60dba3ce24d4b59cbe74', slot: "content" }, h("smoothly-input", { key: 'b62901460412b55658e0ecf9684dcf228c9b8aeb', type: "price", name: "summary.price", currency: "EUR" }, "Summary Price"), h("smoothly-input-file", { key: 'f5bbe653d7d76f849d407ed5412e7fd74738cf67', name: "summary.picture" }, h("span", { key: 'f895d5cd3508e1d0584c4b0f27b55a782f400185', slot: "label" }, "Summary picture")), h("smoothly-input-date", { key: '0954c449c3dde1535e41b5b7ef8c68769c41bc92', name: "summary.birthday" }, "Summary birthday"), h("smoothly-input-date-range", { key: '517776b35be90839508d52ef064ab6f60666ac04', name: "summary.ownedRange" }, "Summary ownedRange"), h("smoothly-input-range", { key: '9177373ede95dd28367e3da1ee1f1f9320f8d3b3', name: "summary.height", label: "Height" }), h("smoothly-input-select", { key: 'b49a7896448c2d40440e5ab6cec301d73d873669', name: "summary.favoriteHat" }, h("span", { key: '50efd70498341500f18cbc37beaaa36fabb8dfa1', slot: "label" }, "Summary's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index }, value)))), h("smoothly-input-month", { key: '3855402ed77dd5d6e8e2e3e5d83928df72846a6e', name: "summary.month" }, h("span", { key: '2a19d1c8ca76b2a9e161c1ddff12574157074994', slot: "month-label" }, "Summary month")), h("smoothly-input-color", { key: '5860b2f19faf59a89dc7ec927580eec8c87cbb4a', name: "summary.color" }, "Summary Color"), h("smoothly-input-radio", { key: 'ed742b746ecd09c0a68b239b020a0d5c98a055a7', name: "summary.favoritePizza" }, h("span", { key: '658d7669cad7375204a0b8da4e811859d79ce8ac', slot: "label" }, "Summary's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '5b6e99bdbf96c73a979dbf896e283e04c7e5914c', name: "summary.hasPet" }, "Has Pet"))), h("smoothly-tabs", { key: '4f491e665758c320d52b1296eb9bb7497697b626' }, h("smoothly-tab", { key: 'a0bf8af72607a286852fc39001708de27bf2e150', label: "Dog" }, h("smoothly-input", { key: 'ad8d73982d3791688cac56360b7924747af0110e', type: "text", name: "dog.breed" }, "Breed"), h("smoothly-input-file", { key: '8e5248bf2108046ca6cbdd8ec0185d2cb9aec86c', name: "dog.picture" }, h("span", { key: 'a4250a2ad68960d8842266cab470a91809c7b245', slot: "label" }, "Dog picture")), h("smoothly-input-date-time", { key: '27a696243ca01d4cab3367300967196372fd952a', name: "dog.lastWalk" }, "Time of last walk"), h("smoothly-input-date", { key: 'c06d1ef75c940488c6016976e017718279efbb58', name: "dog.birthday" }, "Dog birthday"), h("smoothly-input-date-range", { key: '62f5fb72529d8b243979a389861e9927c7a7e470', name: "dog.dateRange" }, "Dog date range"), h("smoothly-input-select", { key: 'abfe59ab4c9e1f78b34664c6a17e0e3301757632', name: "dog.favoriteHat" }, h("span", { key: '54cbc4f6e9a219883a7d24562a5558a79cb45c11', slot: "label" }, "Dog's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index }, value)))), h("smoothly-input-color", { key: '4b92479885ffe3f6457946214192c5301298d421', name: "dog.favoriteColor" }, "Dog's Favorite Color"), h("smoothly-input-radio", { key: 'e3c13c05702f5d50c9cfa5911a6b5d97d760b1be', name: "dog.favoritePizza" }, h("span", { key: '32b8daa4d676b59d95f0c2668991c4849090098c', slot: "label" }, "Dog's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '7bee52a70d21bafa0850dd7f9281e257b68557d8', name: "dog.hasPet" }, "Has Pet")), h("smoothly-tab", { key: '2adff795ab3cca5271c365a2d90ac515db6379d6', label: "Cat", open: true }, h("smoothly-input", { key: '17b9bf37e745b6e535dde50decd7b7128e67c07c', name: "cat.favoriteFood" }, "Favorite Food"))), h("smoothly-input-submit", { key: '905da98d7ab630b43cf07c21a2cd78fb20b2ba64', size: "icon", slot: "submit", color: "success", fill: "solid" })), h("smoothly-display", { key: '7cfb16ec38bb5c1929ac6e77ced637c1241e979f', type: "json", value: this.value })));
+            } }, "Has Owner"), this.hasOwner && (h(Fragment, { key: 'f1681976cacf93aa7fa738d9f46d07a977f2598e' }, h("smoothly-input", { key: 'b2cd9517d1c0ff3f30255222e7cd7c81795d0963', type: "text", name: "owner.firstName", value: this.owner.firstName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { firstName: e.detail["owner.firstName"] })) }, "Owner First Name"), h("smoothly-input", { key: '6ae4a20be64e8e361d4aff737bc97c7e5e0f5fba', type: "text", name: "owner.lastName", value: this.owner.lastName, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { lastName: e.detail["owner.lastName"] })) }, "Owner Last Name"), h("smoothly-input-file", { key: 'bf2a7442b03901a499c917632f7e371f77876d14', name: "owner.picture" }, h("span", { key: '316b8244fdc16e1421ff397f8bae5fca23ef298b', slot: "label" }, "Owner picture")), h("smoothly-input-date", { key: '26ed4d312009d365d0f8377a02ffc264c09513e8', name: "owner.birthday", value: this.owner.birthday, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { birthday: e.detail["owner.birthday"] })) }, "Owner birthday"), h("smoothly-input-date-range", { key: '94038dc278f1f2d845645f4d11da5cf0732a681b', name: "owner.ownedRange", start: (_a = this.owner.ownedRange) === null || _a === void 0 ? void 0 : _a.start, end: (_b = this.owner.ownedRange) === null || _b === void 0 ? void 0 : _b.end, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { ownedRange: e.detail["owner.ownedRange"] })) }, "Owner ownedRange"), h("smoothly-input-range", { key: '954d3b9369243b66708a3621b87af070dc74c309', name: "owner.height", step: 1, max: 250, value: this.owner.height, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { height: e.detail["owner.height"] })) }, "Owner's Height"), h("smoothly-input-select", { key: '5733e2d2217ccc963265a87572b40448c920dc02', name: "owner.favoriteHat" }, h("span", { key: '1ea7549b5edcd448434da347d79b7f1452f285c8', slot: "label" }, "Owner's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index, selected: this.owner.favoriteHat == value }, value)))), h("smoothly-input-color", { key: '52c0e5c0c2591c44a98d25c856ee4ed7b30d664f', name: "owner.favoriteColor", value: this.owner.favoriteColor ? RGB.toHex(this.owner.favoriteColor) : undefined, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoriteColor: e.detail["owner.favoriteColor"] })) }, "Owner's Favorite Color"), h("smoothly-input-radio", { key: '5eb8772e00bf998a3afbef72a58b92b0508d1212', name: "owner.favoritePizza", value: this.owner.favoritePizza, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { favoritePizza: e.detail["owner.favoritePizza"] })) }, h("span", { key: '4976b880777c43be895af8624c68d30e74601aa0', slot: "label" }, "Owner's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: 'ed66290cbea3e2ceb5ae2db1a35236edf095bf88', name: "owner.hasPet", checked: this.owner.hasPet, onSmoothlyInput: e => (this.owner = Object.assign(Object.assign({}, this.owner), { hasPet: e.detail["owner.hasPet"] })) }, "Has Pet"))), h("smoothly-summary", { key: '15531c02a00038be14f92110635eabe7cbd91ee8' }, h("span", { key: 'cc8feedb365cc7309abb5e3c6615460a9bc9d51a', slot: "summary" }, "Summary"), h("div", { key: '86881f2206f8b6e668f30725abb59073cdde9bad', slot: "content" }, h("smoothly-input", { key: '8ae806180e0a3d7742d89ee0ee867de0a3154309', type: "price", name: "summary.price", currency: "EUR" }, "Summary Price"), h("smoothly-input-file", { key: '241fe3c82beb3c5cdd5f11ebe46e047e17c9b793', name: "summary.picture" }, h("span", { key: '4c8564d04eab9f0dd365676e61a591330d6a8377', slot: "label" }, "Summary picture")), h("smoothly-input-date", { key: '7314238424905e58a4b55cf71a9dcac6bcfb2037', name: "summary.birthday" }, "Summary birthday"), h("smoothly-input-date-range", { key: '9c4f11e07a21b09ebf9a16522ff4b7ea1737de93', name: "summary.ownedRange" }, "Summary ownedRange"), h("smoothly-input-range", { key: 'f1b14b7089e1a878c3ecd59619eae564c475a88b', name: "summary.height", label: "Height" }), h("smoothly-input-select", { key: '2ff53bd36442606dfe4edbd312000cf3dc27f7d4', name: "summary.favoriteHat" }, h("span", { key: 'c1639a257b254fa95e150c5331f6619cece2e271', slot: "label" }, "Summary's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index }, value)))), h("smoothly-input-month", { key: '3e9e26fea7233fed804cbaa4e47416f10b502e6a', name: "summary.month" }, h("span", { key: '55a0b4755c339c923ba1303f1633569cbfccde47', slot: "month-label" }, "Summary month")), h("smoothly-input-color", { key: '0b877be6d38d3830a02573ac31ae43f0d4e9d37f', name: "summary.color" }, "Summary Color"), h("smoothly-input-radio", { key: '2173726df1607df4e35595db8cc0b73da5a9be4a', name: "summary.favoritePizza" }, h("span", { key: 'af0ed6de4a2b0f43a0e03fa1053781e84355465d', slot: "label" }, "Summary's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: '3f101db40c6c9ba210413b95d77e4b2a92b59796', name: "summary.hasPet" }, "Has Pet"))), h("smoothly-tabs", { key: '7b94e0f32cf078215bdf1f6f8595de03dd6a9040' }, h("smoothly-tab", { key: 'fe043b8af808d30bae169cefdc81ca0df9f18979', label: "Dog" }, h("smoothly-input", { key: '882a63607ea9f8785c37b9474a748c34a9f5fbdb', type: "text", name: "dog.breed" }, "Breed"), h("smoothly-input-file", { key: '28e53f4ed82779b99dcb9bb28c2428321a299bdb', name: "dog.picture" }, h("span", { key: 'b0cda5a32d911bec1fbbc5a6986f49bc5fc4b484', slot: "label" }, "Dog picture")), h("smoothly-input-date-time", { key: 'cd4403ef213dc3085cb7ac5c3cdf2a58b1fc0c41', name: "dog.lastWalk" }, "Time of last walk"), h("smoothly-input-date", { key: '32047b040c0044fb34c0d75e30832c85b3ace4f5', name: "dog.birthday" }, "Dog birthday"), h("smoothly-input-date-range", { key: '38f674332427fe13994fc9b54b99cc34f839a344', name: "dog.dateRange" }, "Dog date range"), h("smoothly-input-select", { key: '8b384c2815f3fd6a6f4490b404bc05ef69386325', name: "dog.favoriteHat" }, h("span", { key: 'a1e78f6458fe7718f9c9ab540fbe42fe2d486f96', slot: "label" }, "Dog's Favorite Hat"), ["🎩 top hat", "🧢 cap", "👒 sun hat", "❌ none"].map((value, index) => (h("smoothly-item", { value: value, key: index }, value)))), h("smoothly-input-color", { key: '4126a474816acd625a5f3cc535f3f6088f44ad88', name: "dog.favoriteColor" }, "Dog's Favorite Color"), h("smoothly-input-radio", { key: '15f4faae549f42b0fd97ae3d12ead05d18f6356c', name: "dog.favoritePizza" }, h("span", { key: '8004907412ece6876d8a8b82f491a2748d909fe7', slot: "label" }, "Dog's Favorite Pizza"), ["vesuvio", "capricciosa", "quattro formaggi"].map((value, index) => (h("smoothly-input-radio-item", { value: value, key: index }, value)))), h("smoothly-input-checkbox", { key: 'f2e4751841dfa757f34e0aef0cde72475fccd451', name: "dog.hasPet" }, "Has Pet")), h("smoothly-tab", { key: 'c80492cade2d4e60d6858dfcabcd22d8e9a7afcd', label: "Cat", open: true }, h("smoothly-input", { key: '074d3b030c92792efb5dc64731acc4ee6937b013', name: "cat.favoriteFood" }, "Favorite Food"))), h("smoothly-input-submit", { key: 'fc2e297badc699b4dfa0acd208e79278437b149f', size: "icon", slot: "submit", color: "success", fill: "solid" })), h("smoothly-display", { key: 'b50600e5c51b8ab0d34bc45b9f0b97cbda54edc3', type: "json", value: this.value })));
     }
     static get style() { return SmoothlyFormDemoPetStyle0; }
 }, [2, "smoothly-form-demo-pet", {
@@ -216,4 +216,4 @@ defineCustomElement();
 
 export { SmoothlyFormDemoPet as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-ecbadf51.js.map
+//# sourceMappingURL=p-840a2e6c.js.map