smoothly 1.2.1-alpha.61 → 1.2.1-alpha.62

package/dist/collection/components/table/head/index.js

@@ -22,7 +22,7 @@ export class SmoothlyTableHead {
         (_a = this.scrollParent) === null || _a === void 0 ? void 0 : _a.removeEventListener("scroll", this.onScroll);
     }
     render() {
-        return (h(Host, { key: '41c6d5bdd8154fe41e23e02dfb148ce12d7851aa', class: { scrolled: !!this.scrolled } }, h("slot", { key: '5ffb97a60df91262717fbe003f2b15c55f30b15f' })));
+        return (h(Host, { key: 'b6bfb1f382f927b434e0007568170daf00f63c75', class: { scrolled: !!this.scrolled } }, h("slot", { key: 'd37d97f75e41498348e2d1ba12e6bf86187edb1f' })));
     }
     static get is() { return "smoothly-table-head"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/table/index.js

@@ -10,7 +10,7 @@ export class SmoothlyTable {
         event.stopPropagation();
     }
     render() {
-        return (h(Host, { key: '6abc41beffc6b45c81580243f0d32236042728b3', style: { "--columns": this.columns.toString() } }, h("slot", { key: 'ffb8dcff192d54ff1a72c72547912f97e71ef122' })));
+        return (h(Host, { key: '9910a52a5c47f2aa29f68eb62cd451c4a03b2257', style: { "--columns": this.columns.toString() } }, h("slot", { key: 'd439efe423eb6dbcc8612ea135710225f036efaa' })));
     }
     static get is() { return "smoothly-table"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/table/row/index.js

@@ -13,7 +13,7 @@ export class SmoothlyTableRow {
                 event.target != cell && cell.close();
     }
     render() {
-        return (h(Host, { key: 'bb7d869d99acaf7b2fd0bd79173334a606061022' }, h("slot", { key: 'c6c020ec62114685afb24671d1ae111cf5a0ff1b' })));
+        return (h(Host, { key: '84924ddbf8eb1970ba47a5eaf91c918d8bcb3c06' }, h("slot", { key: '7e100fae4fa251b97011f7fce663917e026b44e5' })));
     }
     static get is() { return "smoothly-table-row"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/tabs/demo/index.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class SmoothlyTabsDemo {
     render() {
-        return (h("smoothly-tabs", { key: '69a84a806d5519b41761596d3450e6f3d8022a4a' }, h("smoothly-tab", { key: '7ea729f8704ea18140450d0b622bf890d06eef0b', label: "test1", open: true }, "Hello world!"), h("smoothly-tab", { key: '8ba37d82f2bc9fdca7e37d2ac94ad28216619bde', label: "test2" }, "this is a test message!"), h("smoothly-tab", { key: '142a60c893adc79c1e89d5cccb4f142940948c90', label: "test3" }, "this is a test message again!")));
+        return (h("smoothly-tabs", { key: '4a00dd7c436dbf3d9abe9433b99638af102cf7ec' }, h("smoothly-tab", { key: '7c12f03057817a6bb970ae5b6f94d6d0e3fbdf01', label: "test1", open: true }, "Hello world!"), h("smoothly-tab", { key: '2a6045a36eb91238215cfea7d02ce7e57663412d', label: "test2" }, "this is a test message!"), h("smoothly-tab", { key: '6fa4537914d989e47aad7eac348435ea97746e82', label: "test3" }, "this is a test message again!")));
     }
     static get is() { return "smoothly-tabs-demo"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/tabs/index.js

@@ -21,7 +21,7 @@ export class SmoothlyTabs {
             old.open = false;
     }
     render() {
-        return (h(Host, { key: 'ea00c7f57eab3dda4df7967760defddde82e2ed0', style: { "--tabs": `${this.tabs.length}` } }, h("slot", { key: '8792ebb5ca91ad7423de98c5f9cb0f99e2d87325' })));
+        return (h(Host, { key: 'f17ec6be41e37bd9f3c4c13034bdcd6de9a7b9b4', style: { "--tabs": `${this.tabs.length}` } }, h("slot", { key: '49300e34edd48016137690fa43d621225bf2ddea' })));
     }
     static get is() { return "smoothly-tabs"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/tabs/tab/index.js

@@ -30,7 +30,7 @@ export class SmoothlyTab {
         }
     }
     render() {
-        return (h(Host, { key: '177a26489e58248688e4f615de43b1e06d0efcdd' }, h("div", { key: 'beb3f0c27000c4283695beddcaf7c30a5bcd74c0' }, h("label", { key: '2dbe51fdfee9ca51de3ec008e14811464cbd330c' }, this.label)), h("div", { key: '9714a66b42ac315da8ef9623b44691a23553b955', hidden: !this.open }, h("slot", { key: '787f590aa4701413d4ab8e5141fc1ad10ea2eeff' }))));
+        return (h(Host, { key: 'cf40ac0574fdd7f01bc314ae73fadba15bfbe85b' }, h("div", { key: '4bc51b1667b0e5e9d859e9ee56cb60e595d3834b' }, h("label", { key: '82086748d110f0b960196cc23c6293926e136edf' }, this.label)), h("div", { key: 'e82a249814fda484771336d830f5ed2b63205da9', hidden: !this.open }, h("slot", { key: '3b57b209692f6a98d826c53154ae98e8a6201dee' }))));
     }
     static get is() { return "smoothly-tab"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/theme/color/index.js

@@ -4,7 +4,7 @@ export class SmoothlyThemeColor {
         this.color = undefined;
     }
     render() {
-        return (h(Host, { key: '73d669c49fccff8dafed12e8f857c6556d2b73b7' }, this.color, ["tint", "color", "shade"].map(variant => (h("smoothly-theme-color-variant", { title: `${this.color} ${variant}`, color: this.color, variant: variant })))));
+        return (h(Host, { key: 'c4d5fc173ffb6f2eabf51c7857cf058ed1d1fe2c' }, this.color, ["tint", "color", "shade"].map(variant => (h("smoothly-theme-color-variant", { title: `${this.color} ${variant}`, color: this.color, variant: variant })))));
     }
     static get is() { return "smoothly-theme-color"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/theme/demo/index.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyThemeDemo {
     render() {
-        return (h(Host, { key: '3355b78af80fa211bf0f73a0f108b8b71b553ad1' }, h("h2", { key: '7e8cc8d2ba8b157f3a31cf3abb9e53c76257fb08' }, "Theme"), h("smoothly-theme-picker", { key: 'f7c44b1511d4259059bfd9fb19f47d1ce26e19ae' }, h("smoothly-item", { key: '13e431c3dd07f385b841a0172cae10826d97f268', selected: true, value: "assets/style/smoothly.css" }, "Smoothly"), h("smoothly-item", { key: '4e318c9a7c9ae7b59557ff07dc1e36fd9b110e78', value: "https://app.issuefab.com/assets/style/index.css" }, "Issuefab"), h("smoothly-item", { key: '60cb9a6db0695b08ab313553113beaf0cad24e7d', value: "https://app.proquse.com/assets/style/index.css" }, "Proquse"), h("smoothly-item", { key: '489a1e89509050ebcb8455cc9e3bfbd22e29e245', value: "https://app.weekmeter.com/assets/style/index.css" }, "Weekmeter"), h("smoothly-item", { key: '5ac8c7204a076adcdcddd1881bb63cb61949709a', value: "https://dash.pax2pay.app/p2pdash.css" }, "Pax2Pay Dashboard"), h("smoothly-item", { key: '7798c582895794c11d88f5947890f68b07e98b4d', value: "https://ui.pax2pay.app/assets/style/pax2pay.css" }, "Pax2Pay Portal"), h("smoothly-item", { key: 'a789c18c71cdeeb6904077d54c8098d1a80aafcf', value: "https://theme.payfunc.com/intergiro/index.css" }, "Intergiro Monitor"), h("smoothly-item", { key: '0a986aa17adada44feb7951a1526401625856ca2', value: "https://theme.payfunc.com/light/index.css" }, "Payfunc Light"), h("smoothly-item", { key: '84015d4aa4d1328cec770b42c5ea0480685a863a', value: "https://theme.payfunc.com/dark/index.css" }, "Payfunc Dark")), h("span", { key: 'cd2450a4de4f3280deec36ab7c1edc09c92b394d' }, h("smoothly-theme-colors", { key: '65f5a8d82f38d4414ad6cc20a19df461137cd611' }), h("smoothly-theme-guide", { key: '95ccec8e0eff12608a2e1f656122ffc83a8bb487' })), h("smoothly-button", { key: 'a274d5f37ae276ef51ac471c2492647a95bd4747', type: "link", link: "/redirect" }, "To redirect"), h("smoothly-button", { key: '53ef2e1f9fa3ca98dd3b45b64755f3d70e8a4e91', type: "link", link: "/redirect" }, "To /redirect"), h("smoothly-button", { key: '32614a4431806e998a5c96b74d1444cb06aec539', type: "link", link: new URL("/redirect", window.location.origin).href }, "To new URL(\"redirect\")"), h("smoothly-button", { key: '33292c78195c3be5ac3ac4f4e2a1bb261fbb35a7', type: "link", link: "redirect/nested" }, "To redirect nested")));
+        return (h(Host, { key: '4463a636e45a126ba2fb062048ebd0b9fb3f687d' }, h("h2", { key: 'c2a7009ee3887c027ae7b7bf005d913036685e64' }, "Theme"), h("smoothly-theme-picker", { key: '0a446c485965bef46174bbc3c43fbc80abbeb29f' }, h("smoothly-item", { key: '1cd98a7c5a46aec65ffb22d125f788a0d84524f3', selected: true, value: "assets/style/smoothly.css" }, "Smoothly"), h("smoothly-item", { key: '420c81c9b4fdde7d753d17dd89ea766b63cac4b7', value: "https://app.issuefab.com/assets/style/index.css" }, "Issuefab"), h("smoothly-item", { key: 'be405af1795f5a5f5880c43176d927eae4e7ed8c', value: "https://app.proquse.com/assets/style/index.css" }, "Proquse"), h("smoothly-item", { key: '2873d44164cb6e8684096edb6f0cb48dddc00499', value: "https://app.weekmeter.com/assets/style/index.css" }, "Weekmeter"), h("smoothly-item", { key: 'f4074f3ff99ae23d74f9afd182f50bdca5975189', value: "https://dash.pax2pay.app/p2pdash.css" }, "Pax2Pay Dashboard"), h("smoothly-item", { key: 'e29a9eabce4fe47d563cd332f6ac1f9694255e0e', value: "https://ui.pax2pay.app/assets/style/pax2pay.css" }, "Pax2Pay Portal"), h("smoothly-item", { key: '605c81cabec58d8bf0effbba978124cc2edc18dc', value: "https://theme.payfunc.com/intergiro/index.css" }, "Intergiro Monitor"), h("smoothly-item", { key: '89cd4a4fde0377438f9b0774ef5cde8d12ad3de6', value: "https://theme.payfunc.com/light/index.css" }, "Payfunc Light"), h("smoothly-item", { key: '80a0348fd0d5d123ae21e3553402cbd45cfc354f', value: "https://theme.payfunc.com/dark/index.css" }, "Payfunc Dark")), h("span", { key: '8984c5ecbab2d30da873861d05dde2e33d9e91b5' }, h("smoothly-theme-colors", { key: 'b5cb68f62cdd11e8a5b5487c62680f5a1b955593' }), h("smoothly-theme-guide", { key: 'caae0dccd337a1f7f3f59dac6cf616fe2058d3b9' })), h("smoothly-button", { key: '68ca23965a74ba537d3b3c011d70b8039990fe30', type: "link", link: "/redirect" }, "To redirect"), h("smoothly-button", { key: '71ba1deab1a40617e628c555f81b8414d7900542', type: "link", link: "/redirect" }, "To /redirect"), h("smoothly-button", { key: '8e4aff63e4a8b24aa875d277e6f0ad2c6b8c4960', type: "link", link: new URL("/redirect", window.location.origin).href }, "To new URL(\"redirect\")"), h("smoothly-button", { key: '24bb491c61fd7b4321936a31d3936067155d284c', type: "link", link: "redirect/nested" }, "To redirect nested")));
     }
     static get is() { return "smoothly-theme-demo"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/theme/guide/index.js

@@ -2,14 +2,14 @@ import { h } from "@stencil/core";
 export class SmoothlyThemeColors {
     render() {
         return [
-            h("smoothly-display", { key: 'abe16e5da831c37fe67d692e269f9a8e36fd6d76' }, "Tint is used as background to highlight, for example hovering an item in the select menu."),
-            h("br", { key: '767fb4f3d7caf3db61652ddf130836fb612956f0' }),
-            h("smoothly-display", { key: 'ea00d4efab52f3fd20bced1d2dacd60fca11df29' }, "Color is used as a normal background or as a background to show that something is selected, for example a selected item in the select menu."),
-            h("br", { key: '76ebb191d5cf25196171da5625da1c0d8343a903' }),
-            h("smoothly-display", { key: '4546f155145ac4620b4801c4bf011d50a6d1561e' }, "Shade is used as border and for symbols in buttons. It works as a semi-low contrast against color and tint."),
-            h("br", { key: '5510232d9153a5a8c5bcfea2b9eebb222385d7c0' }),
-            h("smoothly-display", { key: '064049e7637a179654d50690057d024a61d8c3ac' }, "One can use the ", "<smoothly-color>", " component to switch between what color set is used.", " "),
-            h("br", { key: '9138ef0c371b29f199e9c35a841a5c2ba7c8f374' }),
+            h("smoothly-display", { key: 'e02cf3d9a55c0f8bf5027f808870e1b3050be8b5' }, "Tint is used as background to highlight, for example hovering an item in the select menu."),
+            h("br", { key: '817c11793839a6ae6ba3c95d17bf4d259e3ba0f2' }),
+            h("smoothly-display", { key: '2e94e10374c983af3d5e182fafa79a23297a1963' }, "Color is used as a normal background or as a background to show that something is selected, for example a selected item in the select menu."),
+            h("br", { key: 'e66a23032469185cfbb4ff72e9269503e0dfe208' }),
+            h("smoothly-display", { key: 'd439e1e3c0376c104497ced7089fbe5353b95cf7' }, "Shade is used as border and for symbols in buttons. It works as a semi-low contrast against color and tint."),
+            h("br", { key: 'da226714d31e8bb16901982c3d76760479556603' }),
+            h("smoothly-display", { key: 'dea4cf61a7aea11560d67ac2edef565c981958e7' }, "One can use the ", "<smoothly-color>", " component to switch between what color set is used.", " "),
+            h("br", { key: '5ac250dadb2c47de1399c1c5f5d7aacf9cb05c3d' }),
         ];
     }
     static get is() { return "smoothly-theme-guide"; }

package/dist/collection/components/theme/picker/index.js

@@ -4,11 +4,11 @@ export class SmoothlyThemePicker {
         this.element = "smoothly-css";
     }
     render() {
-        return (h(Host, { key: '1f304bc0806c407954e1326ec8e0bea77634dd30' }, h("smoothly-input-select", { key: '6887bc24589b7583d62c89414b35b7013d1bcc16', name: "theme", looks: "border", onSmoothlyInput: e => {
+        return (h(Host, { key: 'd689a1c952e70cce86dc2aa27e794b087bf49b69' }, h("smoothly-input-select", { key: '04a1ef8bf253bd7bc3799d219de7ebe7dd220e1b', 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: '968fbc24fef73477248ab5d6769273bb9aa214bf', slot: "label" }, "Select theme"), h("slot", { key: 'ea4c60a9e51f8182afabd7cd36f1ebe96a4ffd4c' }))));
+            } }, h("label", { key: '0b294f2161e7862a2aaaf47b806a057aa1d1bdf5', slot: "label" }, "Select theme"), h("slot", { key: '69e0dff8b9a96a9b13a986d2a61773de46fe9ef6' }))));
     }
     static get is() { return "smoothly-theme-picker"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toggle-switch/demo/index.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SmoothlyToggleSwitchDemo {
     render() {
-        return (h(Host, { key: '034df80277fff91ed0585359d0f3b64f1f5c9c8e' }, h("h4", { key: '16f9ecad7723baea045eb24319b4b3cdcf966fef' }, "Toggle switches"), h("div", { key: 'cc8130abb7122fc8615e6a48b09c7f67d049c3f3' }, h("p", { key: '0178c74f8e5449dc20b4d1aa374b663e042af53b' }, "Checkmark"), h("span", { key: '3b726271f6c8c844a2f7d9a324831c6943e90956' }, h("p", { key: '2a7a689c3f391b79adb249ed2853359946325d72' }, "Tiny"), h("smoothly-toggle-switch", { key: 'a9cf4be78c2ca5e9ce5c39a460f4121bcec0a79a', disabled: false, size: "tiny" })), h("span", { key: 'df61c6928bc53490c27a657544cb2f7ca71a0d23' }, h("p", { key: '349855d3b168786f2bd6c66e24641454d740b4d5' }, "Small"), h("smoothly-toggle-switch", { key: 'ad339c40028b8d048e25a4ab091d043a2cf6d71f', disabled: false, size: "small" })), h("span", { key: '6470f379e0acb7e9540ff3d087ae2983f0663c7b' }, h("p", { key: '4e306c9124460d5eb53f9ab7f8e437d8f4340f04' }, "Standard"), h("smoothly-toggle-switch", { key: '11b62ea374d656318a287acc5cebc73dbbf2afce', disabled: false })), h("span", { key: '53f0080164ef7be32973e53c21925c93dc991796' }, h("p", { key: '8f8ba1f7ab8ab16f2af0fa9a108c8e31b68c928c' }, "Large"), h("smoothly-toggle-switch", { key: '83b19601e1d27d35c1e9ac274788ca10662a9d0f', disabled: false, size: "large" })), h("p", { key: 'f51a2baf2857d05999dac55264de877c90e1a128' }, "Colors checkmark"), h("span", { key: 'a1341c2cd8d7d02d16f3c9448b39d85d48005c5d' }, h("p", { key: 'd3f1a11fbca6c9a1e004e75b5410aabaac8cc1e0' }, "Danger"), h("smoothly-toggle-switch", { key: 'f02376cda82d5525e7b01ba02365378c559dea90', color: "danger", disabled: false, size: "small" })), h("span", { key: '0829cb311306cefecebe45c1b6775c9747b1827c' }, h("p", { key: 'fda09a19dd1fd5b46888e98056ffbdc6ff2688ed' }, "Primary color"), h("smoothly-toggle-switch", { key: 'f34131d23e8f6a94279e2082f1eb1bb73fa67c6c', color: "primary", disabled: false, size: "small" })), h("span", { key: 'ddf09d917b4507029a899f002187160caf30a60e' }, h("p", { key: '568eb5c4b551d5246b004dad6ee8b6d061aaa5ed' }, "Secondary color"), h("smoothly-toggle-switch", { key: '2c16e6df2ff55a66ee1cc50569a6adee5e308363', color: "secondary", disabled: false, size: "small" })), h("p", { key: '6b19804cc0bac96ee73309c06dab17a65a9d03f9' }), h("p", { key: 'eec933175db979be637e49048aa1cb35de8cd07c' }, "Colors no checkmark"), h("span", { key: 'c14007f332ef1cc4227446815f2fa0a576be6b34' }, h("p", { key: '4ff13a71c30d846deca9faa95c61e98d8fc52336' }, "Danger"), h("smoothly-toggle-switch", { key: '3d2d4c7a9f5523974eb8d1ab5dc46ee9789e212f', checkmark: false, color: "danger", disabled: false, size: "small" })), h("span", { key: '56aca91c3cd95a47849964c31a016aff430e54da' }, h("p", { key: '9139f972a24c3e35f23545d366b5be60a14e5d7c' }, "Primary color"), h("smoothly-toggle-switch", { key: '80be9774b24dd43b3011988403d6beacf56d874c', checkmark: false, color: "primary", disabled: false, size: "small" })), h("span", { key: '3fb5d92da50b6f7e339428fc46acc34ff221603d' }, h("p", { key: '346022141746c076d723705433b6032fdff04648' }, "Secondary color"), h("smoothly-toggle-switch", { key: 'd477c6ca4234534120bf9422f1c1ad17baa9c2d1', checkmark: false, color: "secondary", disabled: false, size: "small" })))));
+        return (h(Host, { key: '8f8fb58880229cff50b5d44aee4b24d82dc321fe' }, h("h4", { key: '2ae31009038d1278b2ce0b7d50ef2317fb44d7ff' }, "Toggle switches"), h("div", { key: '9f8445bc0d0a5337a403def1fffa04be6faa40d6' }, h("p", { key: '634a07c5efac19248b1ae558a376dc6aa8eb38f5' }, "Checkmark"), h("span", { key: '49bf90cc365d832852494e1ca4965d521c8cd22a' }, h("p", { key: '91bdeb807b38b678b4cd74b481b197237bf9bb38' }, "Tiny"), h("smoothly-toggle-switch", { key: '13c22571b68e3d81c9f15ac30dd6e14d8a6b35ce', disabled: false, size: "tiny" })), h("span", { key: '941a1d57831c661b9514282283360e8975af32fa' }, h("p", { key: '53d710f9750058fe393e7b9b5fe4d31b12bd7b68' }, "Small"), h("smoothly-toggle-switch", { key: 'ae3ac2490f83c3077b15d85fcac8f7e5ac0a2d42', disabled: false, size: "small" })), h("span", { key: '34257d9b67e40cf072711fc847ca9dfb5f91c512' }, h("p", { key: 'be1801aafa7a7450f6dc792ac235f1c34f24710a' }, "Standard"), h("smoothly-toggle-switch", { key: '827cddf2c771e838007062414cef66473d4d39ea', disabled: false })), h("span", { key: 'c780dd94b09336dee3172a54a8149d63c3a62f9a' }, h("p", { key: '2bcfd7698897e96f0b37ee74cf38425d91c34ee1' }, "Large"), h("smoothly-toggle-switch", { key: '9c78c336ac234985630f609046e6f0d26864bcad', disabled: false, size: "large" })), h("p", { key: '6f7566af469a3afe52fc826cab71dc7b4c7b62d1' }, "Colors checkmark"), h("span", { key: '7d756353704fff2ab7be10e2be69756d8197ea88' }, h("p", { key: '49c67182d54a79c2053603905dab1bd0ecb71dee' }, "Danger"), h("smoothly-toggle-switch", { key: 'ee31817b353790e30365ca051afe9f0253037825', color: "danger", disabled: false, size: "small" })), h("span", { key: 'b02a27a21cafc770c6ed8eba5b776bbdcf6c1978' }, h("p", { key: '317c681c35af7d7d2fc7a994b1f2508197f99872' }, "Primary color"), h("smoothly-toggle-switch", { key: 'e65dfed030c63f77e8d6f593673809614ff2ba00', color: "primary", disabled: false, size: "small" })), h("span", { key: 'fb5086478316b6152d33c2100f49fcc465ca3d3b' }, h("p", { key: '41daa24ba72db875cc7b7af2c7f581aac5e7feef' }, "Secondary color"), h("smoothly-toggle-switch", { key: 'd39f57ed3d556ae37f2e8b0c41e1f325ebdb5603', color: "secondary", disabled: false, size: "small" })), h("p", { key: '0511afe9519a8c039c59e87a680f62fdc47654f0' }), h("p", { key: '625c4f5688027b5abeffb31f0dd7dcde1d66c97e' }, "Colors no checkmark"), h("span", { key: '54ecca2b5044cba4d698350dcbdc7f6ccf89c955' }, h("p", { key: '88c097beeac20c152c03bf300568fb17ed4fd706' }, "Danger"), h("smoothly-toggle-switch", { key: '3f057efb84145a6b1da57551aa69abb0aaaa0cd5', checkmark: false, color: "danger", disabled: false, size: "small" })), h("span", { key: 'f57ab262e99e374dd0170aff629f9141dc217113' }, h("p", { key: '1c1345999a38cabf4d8a62790740125bd9d5e983' }, "Primary color"), h("smoothly-toggle-switch", { key: '0e24546adf85da1be29927407fa8c94c1cdae1af', checkmark: false, color: "primary", disabled: false, size: "small" })), h("span", { key: '60a5ad8bcc7b92b9362cca69c205e340390443c8' }, h("p", { key: '8fddc28615785cafb8b095fb688ae214380fc8a0' }, "Secondary color"), h("smoothly-toggle-switch", { key: 'e051cad9467cd9a8d286fdfdb178d50980ba262c', checkmark: false, color: "secondary", disabled: false, size: "small" })))));
     }
     static get is() { return "smoothly-toggle-switch-demo"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toggle-switch/index.js

@@ -13,7 +13,7 @@ export class SmoothlyToggleSwitch {
         this.smoothlyToggleSwitchChange.emit(this.selected);
     }
     render() {
-        return (h(Host, { key: '398be7261835e65200aa85d11e3b1397f437d0da' }, h("button", { key: '88d40c975f2cde83e8531f14253c65c3452a724c', type: "button", disabled: this.disabled, onClick: () => this.handleClick() }, h("smoothly-icon", { key: 'effb2050447b0cd6e70d402d06ba3f27e0462d5c', color: this.color, name: !this.checkmark ? "ellipse" : this.selected ? "checkmark-circle" : "close-circle", fill: "clear", class: { selected: this.selected } }))));
+        return (h(Host, { key: '2b49a561fc51305ad11b09d2d8512ae24a1dc365' }, h("button", { key: '01c61f4dcdd8e576da06f7ecc30ddca01168c0ea', type: "button", disabled: this.disabled, onClick: () => this.handleClick() }, h("smoothly-icon", { key: '5dae0fb3fe4f570bc8c343eed1ad27f0a075d6ff', color: this.color, name: !this.checkmark ? "ellipse" : this.selected ? "checkmark-circle" : "close-circle", fill: "clear", class: { selected: this.selected } }))));
     }
     static get is() { return "smoothly-toggle-switch"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toggle-switch/style.css

@@ -1,15 +1,12 @@
 :host {
 	display: block;
-	width: 3.6em;
-	height: 1.8em;
 }
 :host > button {
 	width: 100%;
 	height: 100%;
 	display: flex;
-	justify-content: center;
 	align-items: center;
-	position: relative;
+	padding-inline: 0;
 	cursor: pointer;
 	border: none;
 	border-radius: 3em;
@@ -22,11 +19,8 @@
 	display: flex;
 	justify-content: flex-start;
 	align-items: center;
-	position: absolute;
-	left: 0;
 	fill: rgb(var(--smoothly-color-contrast));
 	stroke: rgb(var(--smoothly-color-contrast));
-	font-size: 1.2em;
 	transition: 100ms ease-in-out;
 }
 :host([selected][checkmark]) > button > smoothly-icon{
@@ -43,23 +37,21 @@
 	transform: translateX(100%);
 }
 :host([size=tiny]) {
-	width: 2.4em;
-	height: 1.2em;
+	--height: 1.25rem;
 }
 :host([size=small]) {
-	width: 3.05em;
-	height: 1.5em;
+	--height: 1.5rem;
 }
-:host([size=large]) {
-	width: 5.2em;
-	height: 2.5em;
+:host([size=default]) {
+	--height: 2rem;
 }
-:host([size=tiny]) > button > smoothly-icon {
-	font-size: .8em;
+:host([size=large]) {
+	--height: 2.5rem;
 }
-:host([size=small]) > button > smoothly-icon {
-	font-size: 1em;
+:host {
+	height: var(--height);
+	width: calc(var(--height) * 2);
 }
-:host([size=large]) > button > smoothly-icon {
-	font-size: 1.75em;
+:host > button > smoothly-icon {
+	--smoothly-icon-size: var(--height);
 }

package/dist/collection/components/trigger/index.js

@@ -20,7 +20,7 @@ export class SmoothlyTrigger {
                 result = this.disabled ? (h("slot", null)) : (h("a", { onClick: e => this.onClick(e) }, h("slot", null)));
                 break;
             case "button":
-                result = (h("button", { key: '7da8c40d448d1b53c81d638f0b1684e4577aa49a', disabled: this.disabled, name: this.name }, h("slot", { key: '587236afa7d7602b912b374ec5651e3efb528364' })));
+                result = (h("button", { key: '6dcc500b529d05dd5dab24dae03f5329f20e2e9b', disabled: this.disabled, name: this.name }, h("slot", { key: '8821fe6e52e1f4504b1803936fc7029963bfaefc' })));
                 break;
         }
         return result;

package/dist/collection/components/trigger/sink/index.js

@@ -19,7 +19,7 @@ export class SmoothlyTriggerSink {
         }
     }
     render() {
-        return h("slot", { key: '05691d1b33e0e33e808cfb3f34719de721fc4689' });
+        return h("slot", { key: 'fcb5f32d466ba65bc2d0cb54bb298c2eaf935350' });
     }
     static get is() { return "smoothly-trigger-sink"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/trigger/source/index.js

@@ -13,7 +13,7 @@ export class SmoothlyTriggerSource {
         }, window);
     }
     render() {
-        return h("slot", { key: '9c41efd11c61ca225a5ee79d6559b43249ebdb25' });
+        return h("slot", { key: 'a95a22a6c9a94567d9ec1705399495f97cca1b64' });
     }
     static get is() { return "smoothly-trigger-source"; }
     static get encapsulation() { return "scoped"; }

package/dist/components/{p-e02f5eef.js → p-0156d1ac.js}

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, h } from './p-f765921a.js';
-import { d as defineCustomElement$5 } from './p-49f90785.js';
-import { d as defineCustomElement$4 } from './p-db95d66d.js';
-import { d as defineCustomElement$3 } from './p-68b77df6.js';
-import { d as defineCustomElement$2 } from './p-2020cb82.js';
-import { d as defineCustomElement$1 } from './p-b4bb3e74.js';
+import { d as defineCustomElement$5 } from './p-1cc8de56.js';
+import { d as defineCustomElement$4 } from './p-92144b1e.js';
+import { d as defineCustomElement$3 } from './p-65801f7e.js';
+import { d as defineCustomElement$2 } from './p-21601376.js';
+import { d as defineCustomElement$1 } from './p-d9989605.js';
 
 const styleCss = "";
 const SmoothlyThemeGuideStyle0 = styleCss;
@@ -15,14 +15,14 @@ const SmoothlyThemeColors = proxyCustomElement(class SmoothlyThemeColors extends
     }
     render() {
         return [
-            h("smoothly-display", { key: 'abe16e5da831c37fe67d692e269f9a8e36fd6d76' }, "Tint is used as background to highlight, for example hovering an item in the select menu."),
-            h("br", { key: '767fb4f3d7caf3db61652ddf130836fb612956f0' }),
-            h("smoothly-display", { key: 'ea00d4efab52f3fd20bced1d2dacd60fca11df29' }, "Color is used as a normal background or as a background to show that something is selected, for example a selected item in the select menu."),
-            h("br", { key: '76ebb191d5cf25196171da5625da1c0d8343a903' }),
-            h("smoothly-display", { key: '4546f155145ac4620b4801c4bf011d50a6d1561e' }, "Shade is used as border and for symbols in buttons. It works as a semi-low contrast against color and tint."),
-            h("br", { key: '5510232d9153a5a8c5bcfea2b9eebb222385d7c0' }),
-            h("smoothly-display", { key: '064049e7637a179654d50690057d024a61d8c3ac' }, "One can use the ", "<smoothly-color>", " component to switch between what color set is used.", " "),
-            h("br", { key: '9138ef0c371b29f199e9c35a841a5c2ba7c8f374' }),
+            h("smoothly-display", { key: 'e02cf3d9a55c0f8bf5027f808870e1b3050be8b5' }, "Tint is used as background to highlight, for example hovering an item in the select menu."),
+            h("br", { key: '817c11793839a6ae6ba3c95d17bf4d259e3ba0f2' }),
+            h("smoothly-display", { key: '2e94e10374c983af3d5e182fafa79a23297a1963' }, "Color is used as a normal background or as a background to show that something is selected, for example a selected item in the select menu."),
+            h("br", { key: 'e66a23032469185cfbb4ff72e9269503e0dfe208' }),
+            h("smoothly-display", { key: 'd439e1e3c0376c104497ced7089fbe5353b95cf7' }, "Shade is used as border and for symbols in buttons. It works as a semi-low contrast against color and tint."),
+            h("br", { key: 'da226714d31e8bb16901982c3d76760479556603' }),
+            h("smoothly-display", { key: 'dea4cf61a7aea11560d67ac2edef565c981958e7' }, "One can use the ", "<smoothly-color>", " component to switch between what color set is used.", " "),
+            h("br", { key: '5ac250dadb2c47de1399c1c5f5d7aacf9cb05c3d' }),
         ];
     }
     static get style() { return SmoothlyThemeGuideStyle0; }
@@ -69,4 +69,4 @@ defineCustomElement();
 
 export { SmoothlyThemeColors as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-e02f5eef.js.map
+//# sourceMappingURL=p-0156d1ac.js.map

package/dist/components/{p-e02f5eef.js.map → p-0156d1ac.js.map}

@@ -1 +1 @@
-{"file":"p-e02f5eef.js","mappings":";;;;;;;AAAA,MAAM,QAAQ,GAAG,EAAE,CAAC;AACpB,iCAAe,QAAQ;;MCMV,mBAAmB;;;;;IAC/B,MAAM;QACL,OAAO;YACN,uKAEmB;YACnB,4DAAM;YACN,yNAGmB;YACnB,4DAAM;YACN,yLAEmB;YACnB,4DAAM;YACN,+FACkB,kBAAkB,0DAAsD,GAAG,CAC1E;YACnB,4DAAM;SACN,CAAA;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/theme/guide/style.css?tag=smoothly-theme-guide&encapsulation=scoped","src/components/theme/guide/index.tsx"],"sourcesContent":["","import { Component, h } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-theme-guide\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyThemeColors {\n\trender() {\n\t\treturn [\n\t\t\t<smoothly-display>\n\t\t\t\tTint is used as background to highlight, for example hovering an item in the select menu.\n\t\t\t</smoothly-display>,\n\t\t\t<br />,\n\t\t\t<smoothly-display>\n\t\t\t\tColor is used as a normal background or as a background to show that something is selected, for example a\n\t\t\t\tselected item in the select menu.\n\t\t\t</smoothly-display>,\n\t\t\t<br />,\n\t\t\t<smoothly-display>\n\t\t\t\tShade is used as border and for symbols in buttons. It works as a semi-low contrast against color and tint.\n\t\t\t</smoothly-display>,\n\t\t\t<br />,\n\t\t\t<smoothly-display>\n\t\t\t\tOne can use the {\"<smoothly-color>\"} component to switch between what color set is used.{\" \"}\n\t\t\t</smoothly-display>,\n\t\t\t<br />,\n\t\t]\n\t}\n}\n"],"version":3}
+{"file":"p-0156d1ac.js","mappings":";;;;;;;AAAA,MAAM,QAAQ,GAAG,EAAE,CAAC;AACpB,iCAAe,QAAQ;;MCMV,mBAAmB;;;;;IAC/B,MAAM;QACL,OAAO;YACN,uKAEmB;YACnB,4DAAM;YACN,yNAGmB;YACnB,4DAAM;YACN,yLAEmB;YACnB,4DAAM;YACN,+FACkB,kBAAkB,0DAAsD,GAAG,CAC1E;YACnB,4DAAM;SACN,CAAA;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/theme/guide/style.css?tag=smoothly-theme-guide&encapsulation=scoped","src/components/theme/guide/index.tsx"],"sourcesContent":["","import { Component, h } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-theme-guide\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyThemeColors {\n\trender() {\n\t\treturn [\n\t\t\t<smoothly-display>\n\t\t\t\tTint is used as background to highlight, for example hovering an item in the select menu.\n\t\t\t</smoothly-display>,\n\t\t\t<br />,\n\t\t\t<smoothly-display>\n\t\t\t\tColor is used as a normal background or as a background to show that something is selected, for example a\n\t\t\t\tselected item in the select menu.\n\t\t\t</smoothly-display>,\n\t\t\t<br />,\n\t\t\t<smoothly-display>\n\t\t\t\tShade is used as border and for symbols in buttons. It works as a semi-low contrast against color and tint.\n\t\t\t</smoothly-display>,\n\t\t\t<br />,\n\t\t\t<smoothly-display>\n\t\t\t\tOne can use the {\"<smoothly-color>\"} component to switch between what color set is used.{\" \"}\n\t\t\t</smoothly-display>,\n\t\t\t<br />,\n\t\t]\n\t}\n}\n"],"version":3}

package/dist/components/{p-42f2126d.js → p-08ff9613.js}

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f765921a.js';
-import { I as Input, S as SmoothlyForm } from './p-cf4e20eb.js';
+import { I as Input, S as SmoothlyForm } from './p-85c2a76c.js';
 import { E as Editable } from './p-2eca5316.js';
 import { d as defineCustomElement$2 } from './p-d4bf90ef.js';
-import { d as defineCustomElement$1 } from './p-eafc7555.js';
+import { d as defineCustomElement$1 } from './p-24934ba0.js';
 
 const styleCss = "[color=default].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-default-color);--smoothly-color-contrast:var(--smoothly-default-contrast);--smoothly-color-shade:var(--smoothly-default-shade);--smoothly-color-tint:var(--smoothly-default-tint)}[color=primary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-primary-color);--smoothly-color-contrast:var(--smoothly-primary-contrast);--smoothly-color-shade:var(--smoothly-primary-shade);--smoothly-color-tint:var(--smoothly-primary-tint)}[color=secondary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-secondary-color);--smoothly-color-contrast:var(--smoothly-secondary-contrast);--smoothly-color-shade:var(--smoothly-secondary-shade);--smoothly-color-tint:var(--smoothly-secondary-tint)}[color=tertiary].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-tertiary-color);--smoothly-color-contrast:var(--smoothly-tertiary-contrast);--smoothly-color-shade:var(--smoothly-tertiary-shade);--smoothly-color-tint:var(--smoothly-tertiary-tint)}[color=success].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-success-color);--smoothly-color-contrast:var(--smoothly-success-contrast);--smoothly-color-shade:var(--smoothly-success-shade);--smoothly-color-tint:var(--smoothly-success-tint)}[color=warning].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-warning-color);--smoothly-color-contrast:var(--smoothly-warning-contrast);--smoothly-color-shade:var(--smoothly-warning-shade);--smoothly-color-tint:var(--smoothly-warning-tint)}[color=danger].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-danger-color);--smoothly-color-contrast:var(--smoothly-danger-contrast);--smoothly-color-shade:var(--smoothly-danger-shade);--smoothly-color-tint:var(--smoothly-danger-tint)}[color=light].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-light-color);--smoothly-color-contrast:var(--smoothly-light-contrast);--smoothly-color-shade:var(--smoothly-light-shade);--smoothly-color-tint:var(--smoothly-light-tint)}[color=medium].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-medium-color);--smoothly-color-contrast:var(--smoothly-medium-contrast);--smoothly-color-shade:var(--smoothly-medium-shade);--smoothly-color-tint:var(--smoothly-medium-tint)}[color=dark].sc-smoothly-input-reset{--smoothly-color:var(--smoothly-dark-color);--smoothly-color-contrast:var(--smoothly-dark-contrast);--smoothly-color-shade:var(--smoothly-dark-shade);--smoothly-color-tint:var(--smoothly-dark-tint)}.sc-smoothly-input-reset-h{--smoothly-button-border-radius:0.5rem;display:inline-block;box-sizing:border-box;border-radius:var(--smoothly-button-border-radius);cursor:pointer;border:none;outline:none;position:relative}[shape=rounded].sc-smoothly-input-reset-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-reset-h{display:inline}[disabled].sc-smoothly-input-reset-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-reset-h>a.sc-smoothly-input-reset,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:110%;font-weight:400;border:1px solid transparent;outline:none;background-color:transparent;cursor:pointer;display:inline-flex;gap:0.5rem;box-sizing:border-box}.sc-smoothly-input-reset-h>a.sc-smoothly-input-reset:empty,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:empty{border-width:0}.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-reset-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-reset{padding:0.8em;min-width:8em}.sc-smoothly-input-reset-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-reset{padding:0.6em}[size=icon].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{padding:0.5em}[type=button].sc-smoothly-input-reset-h>a.sc-smoothly-input-reset{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:100%}[size=large].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{font-size:130%}.sc-smoothly-input-reset-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-reset-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-reset-h{width:100%}[expand=full].sc-smoothly-input-reset-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset{background-color:transparent;color:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));border-color:rgb(var(--smoothly-button-foreground))}.sc-smoothly-input-reset-h:not([fill=clear])>button.sc-smoothly-input-reset:hover,.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:focus-visible,[fill=outline].sc-smoothly-input-reset-h:active>button.sc-smoothly-input-reset::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:hover::before,[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:focus-within::before,[fill=outline].sc-smoothly-input-reset-h>button.sc-smoothly-input-reset:active::before{content:\"\";position:absolute;border:2px solid rgb(var(--smoothly-button-focus-border));inset:-1px;border-radius:var(--smoothly-button-border-radius)}.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:hover,.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:focus-visible,.sc-smoothly-input-reset-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-reset:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-reset-h>button.sc-smoothly-input-reset,.sc-smoothly-input-reset-h.sc-smoothly-input-reset-s>smoothly-icon,.sc-smoothly-input-reset-h .sc-smoothly-input-reset-s>smoothly-icon{color:rgb(var(--smoothly-button-foreground));stroke:rgb(var(--smoothly-button-foreground));fill:rgb(var(--smoothly-button-foreground))}[hidden].sc-smoothly-input-reset-h{display:none}.sc-smoothly-input-reset-h:not([display]){display:none}.sc-smoothly-input-reset-h[type=\"input\"].sc-smoothly-input-reset-s>smoothly-button>button{cursor:pointer;filter:opacity(60%);--smoothly-button-foreground:var(--smoothly-input-foreground);background-color:transparent}.sc-smoothly-input-reset-h.sc-smoothly-input-reset-s>smoothly-button>button>*+smoothly-icon{display:none}[disabled].sc-smoothly-input-reset-h{cursor:not-allowed}.sc-smoothly-input-reset-h[type=\"input\"]:hover.sc-smoothly-input-reset-s>smoothly-icon,.sc-smoothly-input-reset-h[type=\"input\"]:hover .sc-smoothly-input-reset-s>smoothly-icon{cursor:pointer;filter:opacity(100%)}";
 const SmoothlyInputResetStyle0 = styleCss;
@@ -47,7 +47,7 @@ const SmoothlyInputReset = proxyCustomElement(class SmoothlyInputReset extends H
     }
     render() {
         var _a;
-        return (h(Host, { key: '1f2b1af44599e1f880fa59c186a66fe46cd85b9a', title: this.tooltip }, h("smoothly-button", { key: '84e22d1382ae7836442859fe4bee9d61737cb75f', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined), onClick: event => this.clickHandler(event) }, h("slot", { key: '7ce4e59101629024cef25297a24b601d633cf108' }), h("smoothly-icon", { key: '04e73ec95bcbcc095dd2a1bd0c423b7c0e4afd38', flip: "x", name: "refresh-outline", size: "tiny" }))));
+        return (h(Host, { key: 'ddf4d620b1e0a0ff24f3ebaa02d310d44ffcbe16', title: this.tooltip }, h("smoothly-button", { key: '6275117e110e26ca2a335384da1ffcc16bf14195', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined), onClick: event => this.clickHandler(event) }, h("slot", { key: 'b3161df742bcd93d8c14e693e35403a3939b10ef' }), h("smoothly-icon", { key: 'a2fe246a617475efda9604db8526d7aa7b7b546e', flip: "x", name: "refresh-outline", size: "tiny" }))));
     }
     static get style() { return SmoothlyInputResetStyle0; }
 }, [6, "smoothly-input-reset", {
@@ -88,4 +88,4 @@ defineCustomElement();
 
 export { SmoothlyInputReset as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-42f2126d.js.map
+//# sourceMappingURL=p-08ff9613.js.map

package/dist/components/{p-42f2126d.js.map → p-08ff9613.js.map}

@@ -1 +1 @@
-{"file":"p-42f2126d.js","mappings":";;;;;;AAAA,MAAM,QAAQ,GAAG,s1NAAs1N,CAAC;AACx2N,iCAAe,QAAQ;;MCUV,kBAAkB;;;;;;;;wBAKqB,KAAK;oBACiB,MAAM;;uBAE7B,IAAI;oBACJ,OAAO;uBACvC,OAAO;;IAIzB,MAAM,iBAAiB;QACtB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,MAAM;YACjC,IAAI,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE;gBACrC,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;gBACpB,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAA;gBACrC,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,OAAM,CAAC;oBAC/B,IAAI,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE;wBAChB,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,QAAQ,GAAG,KAAK,GAAG,CAAC,CAAC,OAAO,CAAA;qBAC7C;oBACD,IAAI,CAAC,YAAY,YAAY,EAAE;wBAC9B,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAA;wBAC1B,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,CAAC,CAAC,OAAO,CAAA;qBAClD;iBACD,CAAC,CAAA;aACF;SACD,CAAC,CAAA;KACF;IAED,YAAY,CAAC,KAAiB;;QAC7B,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,MAAA,IAAI,CAAC,MAAM,0CAAE,KAAK,EAAE,CAAA;QACpB,IAAI,CAAC,MAAM,YAAY,YAAY,IAAI,IAAI,CAAC,cAAc,KAAI,MAAA,IAAI,CAAC,MAAM,0CAAE,IAAI,CAAC,KAAK,CAAC,CAAA,CAAA;KACtF;IACD,MAAM;;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,OAAO,IACxB,wEACC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,oCAAK,IAAI,CAAC,IAAI,IAAI,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC,EAC/D,OAAO,EAAE,KAAK,IAAI,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,IAC1C,8DAAQ,EACR,sEAAe,IAAI,EAAC,GAAG,EAAC,IAAI,EAAC,iBAAiB,EAAC,IAAI,EAAC,MAAM,GAAG,CAC5C,CACZ,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/input/reset/style.css?tag=smoothly-input-reset&encapsulation=scoped","src/components/input/reset/index.tsx"],"sourcesContent":["@import \"../../button/style.css\";\n\n:host(:not([display])) {\n\tdisplay: none;\n}\n\n:host([type=\"input\"])::slotted(smoothly-button>button) {\n\tcursor: pointer;\n\tfilter: opacity(60%);\n\t--smoothly-button-foreground: var(--smoothly-input-foreground);\n\tbackground-color: transparent;\n}\n\n:host::slotted(smoothly-button>button > * > * + smoothly-icon) {\n\tdisplay: none;\n}\n\n:host([disabled]) {\n\tcursor: not-allowed\n}\n\n:host([type=\"input\"]):hover ::slotted(smoothly-icon) {\n\tcursor: pointer;\n\tfilter: opacity(100%);\n}\n","import { Component, Event, EventEmitter, h, Host, Listen, Prop } from \"@stencil/core\"\nimport { Color, Fill } from \"../../../model\"\nimport { SmoothlyForm } from \"../../form\"\nimport { Editable } from \"../Editable\"\nimport { Input } from \"../Input\"\n\n@Component({\n\ttag: \"smoothly-input-reset\",\n\tstyleUrl: \"./style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputReset {\n\treadonlyAtLoad: boolean\n\t@Prop() color?: Color\n\t@Prop({ reflect: true }) expand?: \"block\" | \"full\"\n\t@Prop({ reflect: true }) fill?: Fill\n\t@Prop({ reflect: true, mutable: true }) disabled = false\n\t@Prop({ reflect: true }) size: \"flexible\" | \"small\" | \"large\" | \"icon\" = \"icon\"\n\t@Prop({ reflect: true }) shape?: \"rounded\"\n\t@Prop({ reflect: true, mutable: true }) display = true\n\t@Prop({ reflect: true }) type: \"form\" | \"input\" = \"input\"\n\t@Prop() tooltip = \"Reset\"\n\tprivate parent?: Editable.Element\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: Editable) => void>\n\n\tasync componentWillLoad() {\n\t\tthis.smoothlyInputLoad.emit(parent => {\n\t\t\tif (Editable.Element.type.is(parent)) {\n\t\t\t\tthis.parent = parent\n\t\t\t\tthis.readonlyAtLoad = parent.readonly\n\t\t\t\tparent.listen(\"changed\", async p => {\n\t\t\t\t\tif (Input.is(p)) {\n\t\t\t\t\t\tthis.display = p.readonly ? false : p.changed\n\t\t\t\t\t}\n\t\t\t\t\tif (p instanceof SmoothlyForm) {\n\t\t\t\t\t\tthis.display = !p.readonly\n\t\t\t\t\t\tthis.disabled = !this.readonlyAtLoad && !p.changed\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t}\n\t\t})\n\t}\n\t@Listen(\"click\")\n\tclickHandler(event: MouseEvent) {\n\t\tevent.stopPropagation()\n\t\tthis.parent?.reset()\n\t\tthis.parent instanceof SmoothlyForm && this.readonlyAtLoad && this.parent?.edit(false)\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<Host title={this.tooltip}>\n\t\t\t\t<smoothly-button\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\tsize={this.size}\n\t\t\t\t\ttype={\"button\"}\n\t\t\t\t\tshape={this.shape}\n\t\t\t\t\texpand={this.expand}\n\t\t\t\t\tcolor={this.color}\n\t\t\t\t\tfill={this.fill ?? (this.type == \"input\" ? \"clear\" : undefined)}\n\t\t\t\t\tonClick={event => this.clickHandler(event)}>\n\t\t\t\t\t<slot />\n\t\t\t\t\t<smoothly-icon flip=\"x\" name=\"refresh-outline\" size=\"tiny\" />\n\t\t\t\t</smoothly-button>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-08ff9613.js","mappings":";;;;;;AAAA,MAAM,QAAQ,GAAG,s1NAAs1N,CAAC;AACx2N,iCAAe,QAAQ;;MCUV,kBAAkB;;;;;;;;wBAKqB,KAAK;oBACiB,MAAM;;uBAE7B,IAAI;oBACJ,OAAO;uBACvC,OAAO;;IAIzB,MAAM,iBAAiB;QACtB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,MAAM;YACjC,IAAI,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE;gBACrC,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;gBACpB,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAA;gBACrC,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,OAAM,CAAC;oBAC/B,IAAI,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE;wBAChB,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,QAAQ,GAAG,KAAK,GAAG,CAAC,CAAC,OAAO,CAAA;qBAC7C;oBACD,IAAI,CAAC,YAAY,YAAY,EAAE;wBAC9B,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAA;wBAC1B,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,CAAC,CAAC,OAAO,CAAA;qBAClD;iBACD,CAAC,CAAA;aACF;SACD,CAAC,CAAA;KACF;IAED,YAAY,CAAC,KAAiB;;QAC7B,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,MAAA,IAAI,CAAC,MAAM,0CAAE,KAAK,EAAE,CAAA;QACpB,IAAI,CAAC,MAAM,YAAY,YAAY,IAAI,IAAI,CAAC,cAAc,KAAI,MAAA,IAAI,CAAC,MAAM,0CAAE,IAAI,CAAC,KAAK,CAAC,CAAA,CAAA;KACtF;IACD,MAAM;;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,OAAO,IACxB,wEACC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,oCAAK,IAAI,CAAC,IAAI,IAAI,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC,EAC/D,OAAO,EAAE,KAAK,IAAI,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,IAC1C,8DAAQ,EACR,sEAAe,IAAI,EAAC,GAAG,EAAC,IAAI,EAAC,iBAAiB,EAAC,IAAI,EAAC,MAAM,GAAG,CAC5C,CACZ,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/input/reset/style.css?tag=smoothly-input-reset&encapsulation=scoped","src/components/input/reset/index.tsx"],"sourcesContent":["@import \"../../button/style.css\";\n\n:host(:not([display])) {\n\tdisplay: none;\n}\n\n:host([type=\"input\"])::slotted(smoothly-button>button) {\n\tcursor: pointer;\n\tfilter: opacity(60%);\n\t--smoothly-button-foreground: var(--smoothly-input-foreground);\n\tbackground-color: transparent;\n}\n\n:host::slotted(smoothly-button>button > * > * + smoothly-icon) {\n\tdisplay: none;\n}\n\n:host([disabled]) {\n\tcursor: not-allowed\n}\n\n:host([type=\"input\"]):hover ::slotted(smoothly-icon) {\n\tcursor: pointer;\n\tfilter: opacity(100%);\n}\n","import { Component, Event, EventEmitter, h, Host, Listen, Prop } from \"@stencil/core\"\nimport { Color, Fill } from \"../../../model\"\nimport { SmoothlyForm } from \"../../form\"\nimport { Editable } from \"../Editable\"\nimport { Input } from \"../Input\"\n\n@Component({\n\ttag: \"smoothly-input-reset\",\n\tstyleUrl: \"./style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputReset {\n\treadonlyAtLoad: boolean\n\t@Prop() color?: Color\n\t@Prop({ reflect: true }) expand?: \"block\" | \"full\"\n\t@Prop({ reflect: true }) fill?: Fill\n\t@Prop({ reflect: true, mutable: true }) disabled = false\n\t@Prop({ reflect: true }) size: \"flexible\" | \"small\" | \"large\" | \"icon\" = \"icon\"\n\t@Prop({ reflect: true }) shape?: \"rounded\"\n\t@Prop({ reflect: true, mutable: true }) display = true\n\t@Prop({ reflect: true }) type: \"form\" | \"input\" = \"input\"\n\t@Prop() tooltip = \"Reset\"\n\tprivate parent?: Editable.Element\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: Editable) => void>\n\n\tasync componentWillLoad() {\n\t\tthis.smoothlyInputLoad.emit(parent => {\n\t\t\tif (Editable.Element.type.is(parent)) {\n\t\t\t\tthis.parent = parent\n\t\t\t\tthis.readonlyAtLoad = parent.readonly\n\t\t\t\tparent.listen(\"changed\", async p => {\n\t\t\t\t\tif (Input.is(p)) {\n\t\t\t\t\t\tthis.display = p.readonly ? false : p.changed\n\t\t\t\t\t}\n\t\t\t\t\tif (p instanceof SmoothlyForm) {\n\t\t\t\t\t\tthis.display = !p.readonly\n\t\t\t\t\t\tthis.disabled = !this.readonlyAtLoad && !p.changed\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t}\n\t\t})\n\t}\n\t@Listen(\"click\")\n\tclickHandler(event: MouseEvent) {\n\t\tevent.stopPropagation()\n\t\tthis.parent?.reset()\n\t\tthis.parent instanceof SmoothlyForm && this.readonlyAtLoad && this.parent?.edit(false)\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<Host title={this.tooltip}>\n\t\t\t\t<smoothly-button\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\tsize={this.size}\n\t\t\t\t\ttype={\"button\"}\n\t\t\t\t\tshape={this.shape}\n\t\t\t\t\texpand={this.expand}\n\t\t\t\t\tcolor={this.color}\n\t\t\t\t\tfill={this.fill ?? (this.type == \"input\" ? \"clear\" : undefined)}\n\t\t\t\t\tonClick={event => this.clickHandler(event)}>\n\t\t\t\t\t<slot />\n\t\t\t\t\t<smoothly-icon flip=\"x\" name=\"refresh-outline\" size=\"tiny\" />\n\t\t\t\t</smoothly-button>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-e966bb8a.js → p-09f490eb.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h } from './p-f765921a.js';
-import { d as defineCustomElement$2 } from './p-2b3160e5.js';
-import { d as defineCustomElement$1 } from './p-e15e5a5d.js';
+import { d as defineCustomElement$2 } from './p-a10dfe73.js';
+import { d as defineCustomElement$1 } from './p-2b457d53.js';
 
 const styleCss = ".sc-smoothly-table-filler-row-h{grid-column:1 / -1}";
 const SmoothlyTableFillerRowStyle0 = styleCss;
@@ -11,7 +11,7 @@ const SmoothlyTableFillerRow = proxyCustomElement(class SmoothlyTableFillerRow e
         this.__registerHost();
     }
     render() {
-        return (h("smoothly-table-row", { key: 'e26b7e2c9919bbf73eeacc011495aafe6bc92f7a' }, h("smoothly-table-cell", { key: 'a08e1a043dd889387501763e9252b2c64ba69189' }, h("slot", { key: 'bdf8d877395cf921935e824cb1fc8a5ee8ac34e3' }))));
+        return (h("smoothly-table-row", { key: '487cc599f66e2256280eba9623a90c089489d1f6' }, h("smoothly-table-cell", { key: '4ad4fb2d4bd3ff44bf6a62d20489cf7607f5d7ca' }, h("slot", { key: 'b1b8b30cdca397452636e65e2ff2f0c2e8624d42' }))));
     }
     static get style() { return SmoothlyTableFillerRowStyle0; }
 }, [6, "smoothly-table-filler-row"]);
@@ -42,4 +42,4 @@ defineCustomElement();
 
 export { SmoothlyTableFillerRow as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-e966bb8a.js.map
+//# sourceMappingURL=p-09f490eb.js.map

package/dist/components/{p-e966bb8a.js.map → p-09f490eb.js.map}

@@ -1 +1 @@
-{"file":"p-e966bb8a.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,qDAAqD,CAAC;AACvE,qCAAe,QAAQ;;MCMV,sBAAsB;;;;;IAClC,MAAM;QACL,QACC,6EACC,8EACC,8DAAQ,CACa,CACF,EACrB;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/table/filler-row/style.css?tag=smoothly-table-filler-row&encapsulation=scoped","src/components/table/filler-row/index.tsx"],"sourcesContent":[":host {\n\tgrid-column: 1 / -1;\n}\n","import { Component, h, VNode } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-table-filler-row\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTableFillerRow {\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<smoothly-table-row>\n\t\t\t\t<smoothly-table-cell>\n\t\t\t\t\t<slot />\n\t\t\t\t</smoothly-table-cell>\n\t\t\t</smoothly-table-row>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-09f490eb.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,qDAAqD,CAAC;AACvE,qCAAe,QAAQ;;MCMV,sBAAsB;;;;;IAClC,MAAM;QACL,QACC,6EACC,8EACC,8DAAQ,CACa,CACF,EACrB;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/table/filler-row/style.css?tag=smoothly-table-filler-row&encapsulation=scoped","src/components/table/filler-row/index.tsx"],"sourcesContent":[":host {\n\tgrid-column: 1 / -1;\n}\n","import { Component, h, VNode } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-table-filler-row\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTableFillerRow {\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<smoothly-table-row>\n\t\t\t\t<smoothly-table-cell>\n\t\t\t\t\t<slot />\n\t\t\t\t</smoothly-table-cell>\n\t\t\t</smoothly-table-row>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-8f0f82cd.js → p-0a200b85.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h } from './p-f765921a.js';
-import { d as defineCustomElement$2 } from './p-d305739c.js';
-import { d as defineCustomElement$1 } from './p-259613c8.js';
+import { d as defineCustomElement$2 } from './p-9832d3b5.js';
+import { d as defineCustomElement$1 } from './p-8789a504.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%}";
 const SmoothlyTabsDemoStyle0 = styleCss;
@@ -11,7 +11,7 @@ const SmoothlyTabsDemo = proxyCustomElement(class SmoothlyTabsDemo extends H {
         this.__registerHost();
     }
     render() {
-        return (h("smoothly-tabs", { key: '69a84a806d5519b41761596d3450e6f3d8022a4a' }, h("smoothly-tab", { key: '7ea729f8704ea18140450d0b622bf890d06eef0b', label: "test1", open: true }, "Hello world!"), h("smoothly-tab", { key: '8ba37d82f2bc9fdca7e37d2ac94ad28216619bde', label: "test2" }, "this is a test message!"), h("smoothly-tab", { key: '142a60c893adc79c1e89d5cccb4f142940948c90', label: "test3" }, "this is a test message again!")));
+        return (h("smoothly-tabs", { key: '4a00dd7c436dbf3d9abe9433b99638af102cf7ec' }, h("smoothly-tab", { key: '7c12f03057817a6bb970ae5b6f94d6d0e3fbdf01', label: "test1", open: true }, "Hello world!"), h("smoothly-tab", { key: '2a6045a36eb91238215cfea7d02ce7e57663412d', label: "test2" }, "this is a test message!"), h("smoothly-tab", { key: '6fa4537914d989e47aad7eac348435ea97746e82', label: "test3" }, "this is a test message again!")));
     }
     static get style() { return SmoothlyTabsDemoStyle0; }
 }, [2, "smoothly-tabs-demo"]);
@@ -42,4 +42,4 @@ defineCustomElement();
 
 export { SmoothlyTabsDemo as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-8f0f82cd.js.map
+//# sourceMappingURL=p-0a200b85.js.map

package/dist/components/{p-8f0f82cd.js.map → p-0a200b85.js.map}

@@ -1 +1 @@
-{"file":"p-8f0f82cd.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,gLAAgL,CAAC;AAClM,+BAAe,QAAQ;;MCMV,gBAAgB;;;;;IAC5B,MAAM;QACL,QACC,wEACC,qEAAc,KAAK,EAAC,OAAO,EAAC,IAAI,yBAEjB,EACf,qEAAc,KAAK,EAAC,OAAO,8BAAuC,EAClE,qEAAc,KAAK,EAAC,OAAO,oCAA6C,CACzD,EAChB;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}\n","import { Component, h } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-tabs-demo\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTabsDemo {\n\trender() {\n\t\treturn (\n\t\t\t<smoothly-tabs>\n\t\t\t\t<smoothly-tab label=\"test1\" open>\n\t\t\t\t\tHello world!\n\t\t\t\t</smoothly-tab>\n\t\t\t\t<smoothly-tab label=\"test2\">this is a test message!</smoothly-tab>\n\t\t\t\t<smoothly-tab label=\"test3\">this is a test message again!</smoothly-tab>\n\t\t\t</smoothly-tabs>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-0a200b85.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,gLAAgL,CAAC;AAClM,+BAAe,QAAQ;;MCMV,gBAAgB;;;;;IAC5B,MAAM;QACL,QACC,wEACC,qEAAc,KAAK,EAAC,OAAO,EAAC,IAAI,yBAEjB,EACf,qEAAc,KAAK,EAAC,OAAO,8BAAuC,EAClE,qEAAc,KAAK,EAAC,OAAO,oCAA6C,CACzD,EAChB;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}\n","import { Component, h } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-tabs-demo\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTabsDemo {\n\trender() {\n\t\treturn (\n\t\t\t<smoothly-tabs>\n\t\t\t\t<smoothly-tab label=\"test1\" open>\n\t\t\t\t\tHello world!\n\t\t\t\t</smoothly-tab>\n\t\t\t\t<smoothly-tab label=\"test2\">this is a test message!</smoothly-tab>\n\t\t\t\t<smoothly-tab label=\"test3\">this is a test message again!</smoothly-tab>\n\t\t\t</smoothly-tabs>\n\t\t)\n\t}\n}\n"],"version":3}