smoothly 1.2.1-alpha.55 → 1.2.1-alpha.56

package/dist/components/{p-fca663c0.js → p-45800269.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f765921a.js';
-import { d as defineCustomElement$1 } from './p-8e748704.js';
+import { d as defineCustomElement$1 } from './p-7f7c4cf3.js';
 
 const styleCss = ".sc-smoothly-table-expandable-cell-h{display:table-cell;padding:0.3rem 0.5rem 0.3rem 0.2rem;cursor:pointer;line-height:1.5rem}.sc-smoothly-table-expandable-cell-h:not([open]){box-shadow:0 1px 0 0 rgb(var(--smoothly-color-shade)), 0 1px 0 0 rgb(var(--smoothly-color-shade)) inset}[open].sc-smoothly-table-expandable-cell-h{position:relative;z-index:3;background-color:rgb(var(--smoothly-color));box-shadow:1px 0 0 0 rgb(var(--smoothly-color-shade)) inset, -1px 0 0 0 rgb(var(--smoothly-color-shade)) inset, 0 1px 0 0 rgb(var(--smoothly-color-shade)) inset}.sc-smoothly-table-expandable-cell-h>div.sc-smoothly-table-expandable-cell>smoothly-icon.sc-smoothly-table-expandable-cell{width:1em;padding-right:0.3rem;transition:transform 0.2s, opacity 0.1s;display:flex;height:auto;aspect-ratio:1 / 1;align-self:center;opacity:0.3}.sc-smoothly-table-expandable-cell-h:hover>div.sc-smoothly-table-expandable-cell>smoothly-icon.sc-smoothly-table-expandable-cell{opacity:1}[open].sc-smoothly-table-expandable-cell-h>div.sc-smoothly-table-expandable-cell>smoothly-icon.sc-smoothly-table-expandable-cell{transform:rotate(90deg) translateX(3px)}.sc-smoothly-table-expandable-cell-h>div.sc-smoothly-table-expandable-cell{display:grid;grid-template-columns:auto 1fr;align-items:center}.sc-smoothly-table-expandable-cell-h:not([open])>tr.sc-smoothly-table-expandable-cell>td.sc-smoothly-table-expandable-cell{display:none}smoothly-table-row>tr>td.sc-smoothly-table-expandable-cell-s>*{--expansion-width:1.5rem;--expansion-border-width:3px;position:relative;background-color:rgb(var(--smoothly-color));width:calc(100% + 3rem - 1px);top:1px;left:calc(-1 * var(--expansion-width) + 1px);box-sizing:border-box;padding:0.5rem calc(var(--expansion-width) - 1px);border-bottom:1px solid rgb(var(--smoothly-color-shade))}smoothly-table-row>tr.spotlight>td.sc-smoothly-table-expandable-cell-s>*{box-shadow:calc(var(--expansion-border-width)) 0 0 0 rgb(var(--smoothly-tertiary-color)) inset}smoothly-table-row>tr:not(.spotlight)>td.sc-smoothly-table-expandable-cell-s>*{box-shadow:-1px 0 0 0 rgb(var(--smoothly-tertiary-color)), 1px 0 0 0 rgb(var(--smoothly-tertiary-color))}smoothly-table-row>tr>td.sc-smoothly-table-expandable-cell-s>*::before{content:\"\";position:absolute;display:flex;top:-1px;bottom:0;left:-1px;width:calc(var(--expansion-width) + 1px);border-top:1px solid rgb(var(--smoothly-color-shade))}smoothly-table-row>tr>td.sc-smoothly-table-expandable-cell-s>*::after{content:\"\";position:absolute;display:flex;top:-1px;bottom:0;right:0;width:calc(var(--expansion-width) - 1px);border-top:1px solid rgb(var(--smoothly-color-shade));border-right:1px solid rgb(var(--smoothly-color-shade))}smoothly-table[align=bottom] .sc-smoothly-table-expandable-cell-h{vertical-align:bottom}smoothly-table[align=middle] .sc-smoothly-table-expandable-cell-h{vertical-align:middle}smoothly-table[align=top] .sc-smoothly-table-expandable-cell-h{vertical-align:top}";
 const SmoothlyTableExpandableCellStyle0 = styleCss;
@@ -47,7 +47,7 @@ const TableExpandableCell = proxyCustomElement(class TableExpandableCell extends
         event.detail(this.element);
     }
     render() {
-        return (h(Host, { key: '808fd676f21ae7f63189c1ed769f5726b5caa72f' }, h("div", { key: '14a42d8a10b2b360dcc0cd0a229a580e04737abd' }, h("smoothly-icon", { key: '135e8aaf4323b690e97213b08e8b5535d6c8f145', name: "caret-forward-outline" }), h("slot", { key: '7f483ac11de8750c332a430abc0557be90ea37bd' })), h("tr", { key: 'a7a95e974d4ab556715f89376c9284f947bf3052', class: { spotlight: this.spotlight }, ref: e => (this.expansionElement = e) }, h("td", { key: 'a9e6d2127b555bd6b91cfbba9af1bb12ac2d5977', colSpan: 999 }, h("slot", { key: 'fb3c0654386bffd51f0e666508431a53965195e1', name: "detail" })))));
+        return (h(Host, { key: 'f411536e1e40a6e88dfe7a9c7629c5b58564f7b5' }, h("div", { key: '9d6a7345f698eb817ffffe47193e4a65db4befb8' }, h("smoothly-icon", { key: '18c56a090eb5c1badb143ee5eae67c96599f2ba6', name: "caret-forward-outline" }), h("slot", { key: 'fa98b3e1e3b995427630691dea8af39cef643da7' })), h("tr", { key: 'dbcac9fc20df892fbf8442e44b7d57599ced4acc', class: { spotlight: this.spotlight }, ref: e => (this.expansionElement = e) }, h("td", { key: '7cfd2871877b0a9f6d98f1211eff4c66f1143c8d', colSpan: 999 }, h("slot", { key: '09d2d7c4e768455c322f19042184c17fcebfa44a', name: "detail" })))));
     }
     get element() { return this; }
     static get watchers() { return {
@@ -85,4 +85,4 @@ defineCustomElement();
 
 export { TableExpandableCell as T, defineCustomElement as d };
 
-//# sourceMappingURL=p-fca663c0.js.map
+//# sourceMappingURL=p-45800269.js.map

package/dist/components/{p-fca663c0.js.map → p-45800269.js.map}

@@ -1 +1 @@
-{"file":"p-fca663c0.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,y3FAAy3F,CAAC;AAC34F,0CAAe,QAAQ;;MCkBV,mBAAmB;;;;;;;;8BAIL,IAAI;yBACT,IAAI;;;IAOzB,WAAW,CAAC,KAAc;QACzB,IAAI,IAAI,CAAC,gBAAgB;YACxB,IAAI,KAAK;gBACR,IAAI,CAAC,SAAS,GAAG,IAAI,CAAA;;gBAErB,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;QAC5C,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC7C;IAGD,eAAe;QACd,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,cAAc,CAAA;KACjD;IACD,iBAAiB;QAChB,IAAI,CAAC,qBAAqB,CAAC,IAAI,EAAE,CAAA;QACjC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC;YAChC,cAAc,EAAE,CAAC,OAAgB,MAAM,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;SACrE,CAAC,CAAA;KACF;IACD,kBAAkB;QACjB,IAAI,IAAI,CAAC,SAAS,EAAE;YACnB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAA;YACtB,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;SACtD;KACD;IAED,OAAO;QACN,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAA;KACtB;IAED,iBAAiB,CAAC,KAAgD;QACjE,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;KAC1B;IACD,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,8DACC,sEAAe,IAAI,EAAC,uBAAuB,GAAiB,EAC5D,8DAAa,CACR,EACN,2DAAI,KAAK,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC,IAC9E,2DAAI,OAAO,EAAE,GAAG,IACf,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACD,CACC,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/table/expandable/cell/style.css?tag=smoothly-table-expandable-cell&encapsulation=scoped","src/components/table/expandable/cell/index.tsx"],"sourcesContent":[":host {\n\tdisplay: table-cell;\n\tpadding: 0.3rem 0.5rem 0.3rem 0.2rem;\n\tcursor: pointer;\n\tline-height: 1.5rem;\n}\n:host:not([open]) {\n\tbox-shadow: 0 1px 0 0 rgb(var(--smoothly-color-shade)), 0 1px 0 0 rgb(var(--smoothly-color-shade)) inset;\n}\n:host[open] {\n\tposition: relative;\n\tz-index: 3;\n\tbackground-color: rgb(var(--smoothly-color));\n\tbox-shadow: 1px 0 0 0 rgb(var(--smoothly-color-shade)) inset, -1px 0 0 0 rgb(var(--smoothly-color-shade)) inset, 0 1px 0 0 rgb(var(--smoothly-color-shade)) inset;\n}\n:host > div > smoothly-icon {\n\twidth: 1em;\n\tpadding-right: 0.3rem;\n\ttransition: transform 0.2s, opacity 0.1s;\n\tdisplay: flex;\n\theight: auto;\n\taspect-ratio: 1 / 1;\n\talign-self: center;\n\topacity: 0.3;\n}\n:host:hover > div > smoothly-icon {\n\topacity: 1;\n}\n:host[open] > div > smoothly-icon {\n\ttransform: rotate(90deg) translateX(3px);\n}\n:host > div {\n\tdisplay: grid;\n\tgrid-template-columns: auto 1fr;\n\talign-items: center;\n}\n:host:not([open]) > tr > td {\n\tdisplay: none;\n}\nsmoothly-table-row > tr > td::slotted(*) {\n\t--expansion-width: 1.5rem;\n\t--expansion-border-width: 3px;\n\tposition: relative;\n\tbackground-color: rgb(var(--smoothly-color));\n\twidth: calc(100% + 3rem - 1px);\n\ttop: 1px;\n\tleft: calc(-1 * var(--expansion-width) + 1px);\n\tbox-sizing: border-box;\n\tpadding: 0.5rem calc(var(--expansion-width) - 1px);\n\tborder-bottom: 1px solid rgb(var(--smoothly-color-shade));\n}\nsmoothly-table-row > tr.spotlight > td::slotted(*) {\n\tbox-shadow: calc(var(--expansion-border-width)) 0 0 0 rgb(var(--smoothly-tertiary-color)) inset;\n}\nsmoothly-table-row > tr:not(.spotlight) > td::slotted(*) {\n\tbox-shadow: -1px 0 0 0 rgb(var(--smoothly-tertiary-color)), 1px 0 0 0 rgb(var(--smoothly-tertiary-color));\n}\nsmoothly-table-row > tr > td::slotted(*)::before {\n\tcontent: \"\";\n\tposition: absolute;\n\tdisplay: flex;\n\ttop: -1px;\n\tbottom: 0;\n\tleft: -1px;\n\twidth: calc(var(--expansion-width) + 1px);\n\tborder-top: 1px solid rgb(var(--smoothly-color-shade));\n}\nsmoothly-table-row > tr > td::slotted(*)::after {\n\tcontent: \"\";\n\tposition: absolute;\n\tdisplay: flex;\n\ttop: -1px;\n\tbottom: 0;\n\tright: 0;\n\twidth: calc(var(--expansion-width) - 1px);\n\tborder-top: 1px solid rgb(var(--smoothly-color-shade));\n\tborder-right: 1px solid rgb(var(--smoothly-color-shade));\n}\n\nsmoothly-table[align=bottom] :host {\n\tvertical-align: bottom;\n}\nsmoothly-table[align=middle] :host {\n\tvertical-align: middle;\n}\nsmoothly-table[align=top] :host {\n\tvertical-align: top;\n}\n","import {\n\tComponent,\n\tComponentWillLoad,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tState,\n\tWatch,\n} from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-table-expandable-cell\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class TableExpandableCell implements ComponentWillLoad {\n\tprivate expansionElement?: HTMLTableRowElement\n\tprivate beginOpen: boolean\n\t@Element() element: HTMLSmoothlyTableExpandableCellElement\n\t@State() allowSpotlight = true\n\t@State() spotlight = true\n\t@Prop({ mutable: true, reflect: true }) open: boolean\n\t@Event() smoothlyExpansionOpen: EventEmitter<HTMLElement>\n\t@Event() smoothlyExpansionLoad: EventEmitter<void>\n\t@Event() smoothlyExpandableChange: EventEmitter<boolean>\n\t@Event() smoothlyExpandableLoad: EventEmitter<{ allowSpotlight: (allowed: boolean) => void }>\n\t@Watch(\"open\")\n\topenChanged(value: boolean) {\n\t\tif (this.expansionElement)\n\t\t\tif (value)\n\t\t\t\tthis.beginOpen = true\n\t\t\telse\n\t\t\t\tthis.element.append(this.expansionElement)\n\t\tthis.smoothlyExpandableChange.emit(this.open)\n\t}\n\t@Watch(\"open\")\n\t@Watch(\"allowSpotlight\")\n\thandleSpotlight() {\n\t\tthis.spotlight = this.open && this.allowSpotlight\n\t}\n\tcomponentWillLoad(): void {\n\t\tthis.smoothlyExpansionLoad.emit()\n\t\tthis.smoothlyExpandableLoad.emit({\n\t\t\tallowSpotlight: (allowed: boolean) => (this.allowSpotlight = allowed),\n\t\t})\n\t}\n\tcomponentDidRender(): void {\n\t\tif (this.beginOpen) {\n\t\t\tthis.beginOpen = false\n\t\t\tthis.smoothlyExpansionOpen.emit(this.expansionElement)\n\t\t}\n\t}\n\t@Listen(\"click\")\n\tonClick() {\n\t\tthis.open = !this.open\n\t}\n\t@Listen(\"smoothlyTableLoad\")\n\thandleTableLoaded(event: CustomEvent<(owner: EventTarget) => void>) {\n\t\tevent.stopPropagation()\n\t\tevent.detail(this.element)\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<smoothly-icon name=\"caret-forward-outline\"></smoothly-icon>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t\t<tr class={{ spotlight: this.spotlight }} ref={e => (this.expansionElement = e)}>\n\t\t\t\t\t<td colSpan={999}>\n\t\t\t\t\t\t<slot name=\"detail\"></slot>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-45800269.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,y3FAAy3F,CAAC;AAC34F,0CAAe,QAAQ;;MCkBV,mBAAmB;;;;;;;;8BAIL,IAAI;yBACT,IAAI;;;IAOzB,WAAW,CAAC,KAAc;QACzB,IAAI,IAAI,CAAC,gBAAgB;YACxB,IAAI,KAAK;gBACR,IAAI,CAAC,SAAS,GAAG,IAAI,CAAA;;gBAErB,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;QAC5C,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC7C;IAGD,eAAe;QACd,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,cAAc,CAAA;KACjD;IACD,iBAAiB;QAChB,IAAI,CAAC,qBAAqB,CAAC,IAAI,EAAE,CAAA;QACjC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC;YAChC,cAAc,EAAE,CAAC,OAAgB,MAAM,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;SACrE,CAAC,CAAA;KACF;IACD,kBAAkB;QACjB,IAAI,IAAI,CAAC,SAAS,EAAE;YACnB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAA;YACtB,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;SACtD;KACD;IAED,OAAO;QACN,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAA;KACtB;IAED,iBAAiB,CAAC,KAAgD;QACjE,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;KAC1B;IACD,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,8DACC,sEAAe,IAAI,EAAC,uBAAuB,GAAiB,EAC5D,8DAAa,CACR,EACN,2DAAI,KAAK,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC,IAC9E,2DAAI,OAAO,EAAE,GAAG,IACf,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACD,CACC,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/table/expandable/cell/style.css?tag=smoothly-table-expandable-cell&encapsulation=scoped","src/components/table/expandable/cell/index.tsx"],"sourcesContent":[":host {\n\tdisplay: table-cell;\n\tpadding: 0.3rem 0.5rem 0.3rem 0.2rem;\n\tcursor: pointer;\n\tline-height: 1.5rem;\n}\n:host:not([open]) {\n\tbox-shadow: 0 1px 0 0 rgb(var(--smoothly-color-shade)), 0 1px 0 0 rgb(var(--smoothly-color-shade)) inset;\n}\n:host[open] {\n\tposition: relative;\n\tz-index: 3;\n\tbackground-color: rgb(var(--smoothly-color));\n\tbox-shadow: 1px 0 0 0 rgb(var(--smoothly-color-shade)) inset, -1px 0 0 0 rgb(var(--smoothly-color-shade)) inset, 0 1px 0 0 rgb(var(--smoothly-color-shade)) inset;\n}\n:host > div > smoothly-icon {\n\twidth: 1em;\n\tpadding-right: 0.3rem;\n\ttransition: transform 0.2s, opacity 0.1s;\n\tdisplay: flex;\n\theight: auto;\n\taspect-ratio: 1 / 1;\n\talign-self: center;\n\topacity: 0.3;\n}\n:host:hover > div > smoothly-icon {\n\topacity: 1;\n}\n:host[open] > div > smoothly-icon {\n\ttransform: rotate(90deg) translateX(3px);\n}\n:host > div {\n\tdisplay: grid;\n\tgrid-template-columns: auto 1fr;\n\talign-items: center;\n}\n:host:not([open]) > tr > td {\n\tdisplay: none;\n}\nsmoothly-table-row > tr > td::slotted(*) {\n\t--expansion-width: 1.5rem;\n\t--expansion-border-width: 3px;\n\tposition: relative;\n\tbackground-color: rgb(var(--smoothly-color));\n\twidth: calc(100% + 3rem - 1px);\n\ttop: 1px;\n\tleft: calc(-1 * var(--expansion-width) + 1px);\n\tbox-sizing: border-box;\n\tpadding: 0.5rem calc(var(--expansion-width) - 1px);\n\tborder-bottom: 1px solid rgb(var(--smoothly-color-shade));\n}\nsmoothly-table-row > tr.spotlight > td::slotted(*) {\n\tbox-shadow: calc(var(--expansion-border-width)) 0 0 0 rgb(var(--smoothly-tertiary-color)) inset;\n}\nsmoothly-table-row > tr:not(.spotlight) > td::slotted(*) {\n\tbox-shadow: -1px 0 0 0 rgb(var(--smoothly-tertiary-color)), 1px 0 0 0 rgb(var(--smoothly-tertiary-color));\n}\nsmoothly-table-row > tr > td::slotted(*)::before {\n\tcontent: \"\";\n\tposition: absolute;\n\tdisplay: flex;\n\ttop: -1px;\n\tbottom: 0;\n\tleft: -1px;\n\twidth: calc(var(--expansion-width) + 1px);\n\tborder-top: 1px solid rgb(var(--smoothly-color-shade));\n}\nsmoothly-table-row > tr > td::slotted(*)::after {\n\tcontent: \"\";\n\tposition: absolute;\n\tdisplay: flex;\n\ttop: -1px;\n\tbottom: 0;\n\tright: 0;\n\twidth: calc(var(--expansion-width) - 1px);\n\tborder-top: 1px solid rgb(var(--smoothly-color-shade));\n\tborder-right: 1px solid rgb(var(--smoothly-color-shade));\n}\n\nsmoothly-table[align=bottom] :host {\n\tvertical-align: bottom;\n}\nsmoothly-table[align=middle] :host {\n\tvertical-align: middle;\n}\nsmoothly-table[align=top] :host {\n\tvertical-align: top;\n}\n","import {\n\tComponent,\n\tComponentWillLoad,\n\tElement,\n\tEvent,\n\tEventEmitter,\n\th,\n\tHost,\n\tListen,\n\tProp,\n\tState,\n\tWatch,\n} from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-table-expandable-cell\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class TableExpandableCell implements ComponentWillLoad {\n\tprivate expansionElement?: HTMLTableRowElement\n\tprivate beginOpen: boolean\n\t@Element() element: HTMLSmoothlyTableExpandableCellElement\n\t@State() allowSpotlight = true\n\t@State() spotlight = true\n\t@Prop({ mutable: true, reflect: true }) open: boolean\n\t@Event() smoothlyExpansionOpen: EventEmitter<HTMLElement>\n\t@Event() smoothlyExpansionLoad: EventEmitter<void>\n\t@Event() smoothlyExpandableChange: EventEmitter<boolean>\n\t@Event() smoothlyExpandableLoad: EventEmitter<{ allowSpotlight: (allowed: boolean) => void }>\n\t@Watch(\"open\")\n\topenChanged(value: boolean) {\n\t\tif (this.expansionElement)\n\t\t\tif (value)\n\t\t\t\tthis.beginOpen = true\n\t\t\telse\n\t\t\t\tthis.element.append(this.expansionElement)\n\t\tthis.smoothlyExpandableChange.emit(this.open)\n\t}\n\t@Watch(\"open\")\n\t@Watch(\"allowSpotlight\")\n\thandleSpotlight() {\n\t\tthis.spotlight = this.open && this.allowSpotlight\n\t}\n\tcomponentWillLoad(): void {\n\t\tthis.smoothlyExpansionLoad.emit()\n\t\tthis.smoothlyExpandableLoad.emit({\n\t\t\tallowSpotlight: (allowed: boolean) => (this.allowSpotlight = allowed),\n\t\t})\n\t}\n\tcomponentDidRender(): void {\n\t\tif (this.beginOpen) {\n\t\t\tthis.beginOpen = false\n\t\t\tthis.smoothlyExpansionOpen.emit(this.expansionElement)\n\t\t}\n\t}\n\t@Listen(\"click\")\n\tonClick() {\n\t\tthis.open = !this.open\n\t}\n\t@Listen(\"smoothlyTableLoad\")\n\thandleTableLoaded(event: CustomEvent<(owner: EventTarget) => void>) {\n\t\tevent.stopPropagation()\n\t\tevent.detail(this.element)\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div>\n\t\t\t\t\t<smoothly-icon name=\"caret-forward-outline\"></smoothly-icon>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t\t<tr class={{ spotlight: this.spotlight }} ref={e => (this.expansionElement = e)}>\n\t\t\t\t\t<td colSpan={999}>\n\t\t\t\t\t\t<slot name=\"detail\"></slot>\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-405d6f00.js → p-4bbdd1c9.js}

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, h } from './p-f765921a.js';
-import { d as defineCustomElement$5 } from './p-f9cb46a5.js';
-import { d as defineCustomElement$4 } from './p-8e748704.js';
-import { d as defineCustomElement$3 } from './p-b8e2c001.js';
-import { d as defineCustomElement$2 } from './p-2f3b4735.js';
-import { d as defineCustomElement$1 } from './p-2245665c.js';
+import { d as defineCustomElement$5 } from './p-131461c4.js';
+import { d as defineCustomElement$4 } from './p-7f7c4cf3.js';
+import { d as defineCustomElement$3 } from './p-03b62a84.js';
+import { d as defineCustomElement$2 } from './p-c7be31eb.js';
+import { d as defineCustomElement$1 } from './p-4da92b01.js';
 
 const styleCss = "smoothly-app{--header-height:5rem;display:block}smoothly-app>smoothly-notifier>main{height:calc(100dvh - var(--header-height))}smoothly-app[hidden]{display:none}smoothly-app>smoothly-notifier{height:100%;background:none}header:has(smoothly-burger[visible])>nav>ul smoothly-app-room{width:100%;height:4em}smoothly-app>smoothly-notifier>header{position:sticky;top:0;z-index:5;width:100%;height:var(--header-height);display:flex;justify-content:space-between;box-sizing:border-box;align-items:center;box-shadow:0 1px 0 0 rgb(var(--smoothly-color-shade))}smoothly-app>smoothly-notifier>header>nav{width:100%;flex-shrink:2;height:100%}smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{display:flex;margin:0}smoothly-app:not([label])>smoothly-notifier>header>h1{display:none}smoothly-app>smoothly-notifier>header>h1{margin-left:1rem;margin-bottom:0.8em;display:flex;height:100%}smoothly-app>smoothly-notifier>header>h1>a{display:inline-block;align-self:center;size:100%;background-position-y:center;text-decoration:none;white-space:nowrap}smoothly-app>smoothly-notifier>header>nav>ul{width:100%}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container{display:flex;align-items:center;height:100%}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container{display:flex;align-items:center;height:100%;margin-left:auto;margin-right:1rem}smoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-end\"]{width:fit-content;align-self:center;height:fit-content;margin-left:10rem}smoothly-app>smoothly-notifier>header>nav>ul li a{display:flex;height:2.3rem;text-decoration:none;align-items:center;align-self:center}@media screen and (max-width: 900px){smoothly-app>smoothly-notifier>header>nav{width:fit-content;max-width:100%;top:100%;position:absolute;max-height:calc(100dvh - var(--header-height));overflow-y:scroll;right:0;height:auto}smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{flex-direction:column;background-color:rgba(var(--smoothly-color))}smoothly-app>smoothly-notifier>header>nav>ul{padding:1.5rem;box-sizing:border-box}smoothly-app>smoothly-notifier>header>nav>ul li{margin-right:0;width:100%}smoothly-app>smoothly-notifier>header>smoothly-burger{position:absolute;top:0;right:0}smoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-start\"]{display:none}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container,smoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container{flex-direction:column;margin:0;align-items:start;justify-content:center}smoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container>*:last-child{margin-bottom:1em}}smoothly-app>smoothly-notifier>header>nav:not(.menu-open){display:none}smoothly-app>smoothly-notifier>main>div{overflow-y:scroll;height:100%}";
 const SmoothlyAppStyle0 = styleCss;
@@ -134,4 +134,4 @@ defineCustomElement();
 
 export { SmoothlyApp as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-405d6f00.js.map
+//# sourceMappingURL=p-4bbdd1c9.js.map

package/dist/components/{p-405d6f00.js.map → p-4bbdd1c9.js.map}

@@ -1 +1 @@
-{"file":"p-405d6f00.js","mappings":"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","names":[],"sources":["src/components/app/style.css?tag=smoothly-app","src/components/app/index.tsx"],"sourcesContent":["smoothly-app {\n\t--header-height: 5rem;\n\tdisplay: block;\n}\n\nsmoothly-app>smoothly-notifier>main {\n\theight: calc(100dvh - var(--header-height));\n}\n\nsmoothly-app[hidden] {\n\tdisplay: none;\n}\n\nsmoothly-app>smoothly-notifier {\n\theight: 100%;\n\tbackground: none;\n}\n\nheader:has(smoothly-burger[visible])>nav>ul smoothly-app-room {\n\twidth: 100%;\n\theight: 4em;\n}\n\nsmoothly-app>smoothly-notifier>header {\n\tposition: sticky;\n\ttop: 0;\n\tz-index: 5;\n\twidth: 100%;\n\theight: var(--header-height);\n\tdisplay: flex;\n\tjustify-content: space-between;\n\tbox-sizing: border-box;\n\talign-items: center;\n\tbox-shadow: 0 1px 0 0 rgb(var(--smoothly-color-shade));\n}\n\nsmoothly-app>smoothly-notifier>header>nav {\n\twidth: 100%;\n\tflex-shrink: 2;\n\theight: 100%;\n}\n\nsmoothly-app>smoothly-notifier>header>nav,\nsmoothly-app>smoothly-notifier>header>nav>ul {\n\tdisplay: flex;\n\tmargin: 0;\n}\n\nsmoothly-app:not([label])>smoothly-notifier>header>h1 {\n\tdisplay: none;\n}\nsmoothly-app>smoothly-notifier>header>h1 {\n\tmargin-left: 1rem;\n\tmargin-bottom: 0.8em;\n\tdisplay: flex;\n\theight: 100%;\n}\n\nsmoothly-app>smoothly-notifier>header>h1>a {\n\tdisplay: inline-block;\n\talign-self: center;\n\tsize: 100%;\n\tbackground-position-y: center;\n\ttext-decoration: none;\n\twhite-space: nowrap;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul {\n\twidth: 100%;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container {\n\tdisplay: flex;\n\talign-items: center;\n\theight: 100%;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container {\n\tdisplay: flex;\n\talign-items: center;\n\theight: 100%;\n\tmargin-left: auto;\n\tmargin-right: 1rem;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-end\"] {\n\twidth: fit-content;\n\talign-self: center;\n\theight: fit-content;\n\tmargin-left: 10rem;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul li a {\n\tdisplay: flex;\n\theight: 2.3rem;\n\ttext-decoration: none;\n\talign-items: center;\n\talign-self: center;\n}\n\n@media screen and (max-width: 900px) {\n\tsmoothly-app>smoothly-notifier>header>nav {\n\t\twidth: fit-content;\n\t\tmax-width: 100%;\n\t\ttop: 100%;\n\t\tposition: absolute;\n\t\tmax-height: calc(100dvh - var(--header-height));\n\t\toverflow-y: scroll;\n\t\tright: 0;\n\t\theight: auto;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav,\n\tsmoothly-app>smoothly-notifier>header>nav>ul {\n\t\tflex-direction: column;\n\t\tbackground-color: rgba(var(--smoothly-color));\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul {\n\t\tpadding: 1.5rem;\n\t\tbox-sizing: border-box;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul li {\n\t\tmargin-right: 0;\n\t\twidth: 100%;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>smoothly-burger {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-start\"] {\n\t\tdisplay: none;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container,\n\tsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container {\n\t\tflex-direction: column;\n\t\tmargin: 0;\n\t\talign-items: start;\n\t\tjustify-content: center;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container>*:last-child {\n\t\tmargin-bottom: 1em;\n\t}\n}\n\nsmoothly-app>smoothly-notifier>header>nav:not(.menu-open) {\n\tdisplay: none;\n}\n\nsmoothly-app>smoothly-notifier>main>div {\n\toverflow-y: scroll;\n\theight: 100%;\n}\n","import { Component, h, Listen, Method, Prop, State, Watch } from \"@stencil/core\"\nimport { SmoothlyAppRoomCustomEvent } from \"../../components\"\nimport { Color } from \"../../model\"\n\ntype Room = {\n\telement: HTMLSmoothlyAppRoomElement\n}\n@Component({\n\ttag: \"smoothly-app\",\n\tstyleUrl: \"style.css\",\n\tscoped: false,\n})\nexport class SmoothlyApp {\n\t@Prop({ reflect: true }) label?: string\n\t@Prop() color: Color\n\t@Prop() home?: string\n\t@Prop({ mutable: true, reflect: true }) menuOpen = false\n\t@State() selected?: Room\n\tprivate burgerVisibility: boolean\n\tprivate burgerElement?: HTMLElement\n\tprivate navElement?: HTMLElement\n\tmainElement?: HTMLElement\n\trooms: Record<string, Room | undefined> = {}\n\tasync componentDidRender() {\n\t\tif (!this.selected && !window.location.search)\n\t\t\t(this.home && this.rooms[this.home]\n\t\t\t\t? this.rooms[this.home]\n\t\t\t\t: Object.values(this.rooms).find(room => !room?.element.disabled)\n\t\t\t)?.element.setSelected(true)\n\t}\n\t@Method()\n\tasync selectRoom(path: string) {\n\t\tthis.rooms[path]?.element.setSelected(true)\n\t}\n\t@Watch(\"selected\")\n\tasync selectedChanged() {\n\t\tObject.values(this.rooms).forEach(\n\t\t\troom => room?.element.path != this.selected?.element.path && room?.element.setSelected(false)\n\t\t)\n\t\tconst content = await this.selected?.element.getContent()\n\t\tif (this.mainElement && content) {\n\t\t\tthis.mainElement.innerHTML = \"\"\n\t\t\tthis.mainElement.appendChild(content)\n\t\t}\n\t}\n\tburgerVisibilityHandler(event: CustomEvent<boolean>) {\n\t\tthis.burgerVisibility = event.detail\n\t}\n\tburgerStatusHandler(event: CustomEvent<boolean>) {\n\t\tevent.stopPropagation()\n\t\tthis.menuOpen = event.detail\n\t}\n\t@Listen(\"popstate\", { target: \"window\" })\n\tasync locationChangeHandler(event: PopStateEvent) {\n\t\tthis.rooms[event.state.smoothlyPath]?.element.setSelected(true, { history: true })\n\t}\n\t@Listen(\"smoothlyRoomSelected\")\n\troomSelectedHandler(event: SmoothlyAppRoomCustomEvent<{ history: boolean }>) {\n\t\tthis.selected = { element: event.target }\n\t\tif (this.burgerVisibility)\n\t\t\tthis.menuOpen = false\n\t\tif (!event.detail.history) {\n\t\t\tconst path = this.selected.element.path.toString()\n\t\t\tconst location = new URL(window.location.pathname == path ? window.location.href : window.location.origin)\n\t\t\tlocation.pathname = path\n\t\t\twindow.history.pushState({ smoothlyPath: path }, \"\", location.href)\n\t\t}\n\t}\n\t@Listen(\"smoothlyRoomLoaded\")\n\troomLoadedHandler(event: SmoothlyAppRoomCustomEvent<{ selected: boolean }>) {\n\t\tconst room = (this.rooms[event.target.path.toString()] = { element: event.target })\n\t\tif (room.element.selected) {\n\t\t\tthis.selected = room\n\t\t\twindow.history.replaceState({ smoothlyPath: room.element.path }, \"\", window.location.href)\n\t\t}\n\t}\n\t@Listen(\"click\", { target: \"window\" })\n\tclickHandler(event: MouseEvent) {\n\t\tif (this.burgerVisibility)\n\t\t\tif (event.composedPath().some(e => e == this.burgerElement || e == this.navElement))\n\t\t\t\t!this.menuOpen\n\t\t\telse\n\t\t\t\tthis.menuOpen = false\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<smoothly-notifier>\n\t\t\t\t<header color={this.color}>\n\t\t\t\t\t<h1>\n\t\t\t\t\t\t<a href={\"\"}>{this.label}</a>\n\t\t\t\t\t</h1>\n\t\t\t\t\t<slot name=\"header\" />\n\t\t\t\t\t<nav ref={e => (this.navElement = e)} class={{ \"menu-open\": this.menuOpen }}>\n\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t<div class={\"nav-start-container\"}>\n\t\t\t\t\t\t\t\t<slot name=\"nav-start\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t\t<div class={\"nav-end-container\"}>\n\t\t\t\t\t\t\t\t<slot name=\"nav-end\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</nav>\n\t\t\t\t\t<smoothly-burger\n\t\t\t\t\t\tref={e => (this.burgerElement = e)}\n\t\t\t\t\t\topen={this.menuOpen}\n\t\t\t\t\t\tonSmoothlyNavStatus={e => this.burgerStatusHandler(e)}\n\t\t\t\t\t\tonSmoothlyVisibleStatus={e => this.burgerVisibilityHandler(e)}\n\t\t\t\t\t/>\n\t\t\t\t</header>\n\t\t\t\t<main ref={e => (this.mainElement = e)} />\n\t\t\t</smoothly-notifier>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-4bbdd1c9.js","mappings":"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","names":[],"sources":["src/components/app/style.css?tag=smoothly-app","src/components/app/index.tsx"],"sourcesContent":["smoothly-app {\n\t--header-height: 5rem;\n\tdisplay: block;\n}\n\nsmoothly-app>smoothly-notifier>main {\n\theight: calc(100dvh - var(--header-height));\n}\n\nsmoothly-app[hidden] {\n\tdisplay: none;\n}\n\nsmoothly-app>smoothly-notifier {\n\theight: 100%;\n\tbackground: none;\n}\n\nheader:has(smoothly-burger[visible])>nav>ul smoothly-app-room {\n\twidth: 100%;\n\theight: 4em;\n}\n\nsmoothly-app>smoothly-notifier>header {\n\tposition: sticky;\n\ttop: 0;\n\tz-index: 5;\n\twidth: 100%;\n\theight: var(--header-height);\n\tdisplay: flex;\n\tjustify-content: space-between;\n\tbox-sizing: border-box;\n\talign-items: center;\n\tbox-shadow: 0 1px 0 0 rgb(var(--smoothly-color-shade));\n}\n\nsmoothly-app>smoothly-notifier>header>nav {\n\twidth: 100%;\n\tflex-shrink: 2;\n\theight: 100%;\n}\n\nsmoothly-app>smoothly-notifier>header>nav,\nsmoothly-app>smoothly-notifier>header>nav>ul {\n\tdisplay: flex;\n\tmargin: 0;\n}\n\nsmoothly-app:not([label])>smoothly-notifier>header>h1 {\n\tdisplay: none;\n}\nsmoothly-app>smoothly-notifier>header>h1 {\n\tmargin-left: 1rem;\n\tmargin-bottom: 0.8em;\n\tdisplay: flex;\n\theight: 100%;\n}\n\nsmoothly-app>smoothly-notifier>header>h1>a {\n\tdisplay: inline-block;\n\talign-self: center;\n\tsize: 100%;\n\tbackground-position-y: center;\n\ttext-decoration: none;\n\twhite-space: nowrap;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul {\n\twidth: 100%;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container {\n\tdisplay: flex;\n\talign-items: center;\n\theight: 100%;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container {\n\tdisplay: flex;\n\talign-items: center;\n\theight: 100%;\n\tmargin-left: auto;\n\tmargin-right: 1rem;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-end\"] {\n\twidth: fit-content;\n\talign-self: center;\n\theight: fit-content;\n\tmargin-left: 10rem;\n}\n\nsmoothly-app>smoothly-notifier>header>nav>ul li a {\n\tdisplay: flex;\n\theight: 2.3rem;\n\ttext-decoration: none;\n\talign-items: center;\n\talign-self: center;\n}\n\n@media screen and (max-width: 900px) {\n\tsmoothly-app>smoothly-notifier>header>nav {\n\t\twidth: fit-content;\n\t\tmax-width: 100%;\n\t\ttop: 100%;\n\t\tposition: absolute;\n\t\tmax-height: calc(100dvh - var(--header-height));\n\t\toverflow-y: scroll;\n\t\tright: 0;\n\t\theight: auto;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav,\n\tsmoothly-app>smoothly-notifier>header>nav>ul {\n\t\tflex-direction: column;\n\t\tbackground-color: rgba(var(--smoothly-color));\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul {\n\t\tpadding: 1.5rem;\n\t\tbox-sizing: border-box;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul li {\n\t\tmargin-right: 0;\n\t\twidth: 100%;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>smoothly-burger {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul>[slot=\"nav-start\"] {\n\t\tdisplay: none;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container,\n\tsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-end-container {\n\t\tflex-direction: column;\n\t\tmargin: 0;\n\t\talign-items: start;\n\t\tjustify-content: center;\n\t}\n\n\tsmoothly-app>smoothly-notifier>header>nav>ul>div.nav-start-container>*:last-child {\n\t\tmargin-bottom: 1em;\n\t}\n}\n\nsmoothly-app>smoothly-notifier>header>nav:not(.menu-open) {\n\tdisplay: none;\n}\n\nsmoothly-app>smoothly-notifier>main>div {\n\toverflow-y: scroll;\n\theight: 100%;\n}\n","import { Component, h, Listen, Method, Prop, State, Watch } from \"@stencil/core\"\nimport { SmoothlyAppRoomCustomEvent } from \"../../components\"\nimport { Color } from \"../../model\"\n\ntype Room = {\n\telement: HTMLSmoothlyAppRoomElement\n}\n@Component({\n\ttag: \"smoothly-app\",\n\tstyleUrl: \"style.css\",\n\tscoped: false,\n})\nexport class SmoothlyApp {\n\t@Prop({ reflect: true }) label?: string\n\t@Prop() color: Color\n\t@Prop() home?: string\n\t@Prop({ mutable: true, reflect: true }) menuOpen = false\n\t@State() selected?: Room\n\tprivate burgerVisibility: boolean\n\tprivate burgerElement?: HTMLElement\n\tprivate navElement?: HTMLElement\n\tmainElement?: HTMLElement\n\trooms: Record<string, Room | undefined> = {}\n\tasync componentDidRender() {\n\t\tif (!this.selected && !window.location.search)\n\t\t\t(this.home && this.rooms[this.home]\n\t\t\t\t? this.rooms[this.home]\n\t\t\t\t: Object.values(this.rooms).find(room => !room?.element.disabled)\n\t\t\t)?.element.setSelected(true)\n\t}\n\t@Method()\n\tasync selectRoom(path: string) {\n\t\tthis.rooms[path]?.element.setSelected(true)\n\t}\n\t@Watch(\"selected\")\n\tasync selectedChanged() {\n\t\tObject.values(this.rooms).forEach(\n\t\t\troom => room?.element.path != this.selected?.element.path && room?.element.setSelected(false)\n\t\t)\n\t\tconst content = await this.selected?.element.getContent()\n\t\tif (this.mainElement && content) {\n\t\t\tthis.mainElement.innerHTML = \"\"\n\t\t\tthis.mainElement.appendChild(content)\n\t\t}\n\t}\n\tburgerVisibilityHandler(event: CustomEvent<boolean>) {\n\t\tthis.burgerVisibility = event.detail\n\t}\n\tburgerStatusHandler(event: CustomEvent<boolean>) {\n\t\tevent.stopPropagation()\n\t\tthis.menuOpen = event.detail\n\t}\n\t@Listen(\"popstate\", { target: \"window\" })\n\tasync locationChangeHandler(event: PopStateEvent) {\n\t\tthis.rooms[event.state.smoothlyPath]?.element.setSelected(true, { history: true })\n\t}\n\t@Listen(\"smoothlyRoomSelected\")\n\troomSelectedHandler(event: SmoothlyAppRoomCustomEvent<{ history: boolean }>) {\n\t\tthis.selected = { element: event.target }\n\t\tif (this.burgerVisibility)\n\t\t\tthis.menuOpen = false\n\t\tif (!event.detail.history) {\n\t\t\tconst path = this.selected.element.path.toString()\n\t\t\tconst location = new URL(window.location.pathname == path ? window.location.href : window.location.origin)\n\t\t\tlocation.pathname = path\n\t\t\twindow.history.pushState({ smoothlyPath: path }, \"\", location.href)\n\t\t}\n\t}\n\t@Listen(\"smoothlyRoomLoaded\")\n\troomLoadedHandler(event: SmoothlyAppRoomCustomEvent<{ selected: boolean }>) {\n\t\tconst room = (this.rooms[event.target.path.toString()] = { element: event.target })\n\t\tif (room.element.selected) {\n\t\t\tthis.selected = room\n\t\t\twindow.history.replaceState({ smoothlyPath: room.element.path }, \"\", window.location.href)\n\t\t}\n\t}\n\t@Listen(\"click\", { target: \"window\" })\n\tclickHandler(event: MouseEvent) {\n\t\tif (this.burgerVisibility)\n\t\t\tif (event.composedPath().some(e => e == this.burgerElement || e == this.navElement))\n\t\t\t\t!this.menuOpen\n\t\t\telse\n\t\t\t\tthis.menuOpen = false\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<smoothly-notifier>\n\t\t\t\t<header color={this.color}>\n\t\t\t\t\t<h1>\n\t\t\t\t\t\t<a href={\"\"}>{this.label}</a>\n\t\t\t\t\t</h1>\n\t\t\t\t\t<slot name=\"header\" />\n\t\t\t\t\t<nav ref={e => (this.navElement = e)} class={{ \"menu-open\": this.menuOpen }}>\n\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t<div class={\"nav-start-container\"}>\n\t\t\t\t\t\t\t\t<slot name=\"nav-start\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t\t<div class={\"nav-end-container\"}>\n\t\t\t\t\t\t\t\t<slot name=\"nav-end\" />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</nav>\n\t\t\t\t\t<smoothly-burger\n\t\t\t\t\t\tref={e => (this.burgerElement = e)}\n\t\t\t\t\t\topen={this.menuOpen}\n\t\t\t\t\t\tonSmoothlyNavStatus={e => this.burgerStatusHandler(e)}\n\t\t\t\t\t\tonSmoothlyVisibleStatus={e => this.burgerVisibilityHandler(e)}\n\t\t\t\t\t/>\n\t\t\t\t</header>\n\t\t\t\t<main ref={e => (this.mainElement = e)} />\n\t\t\t</smoothly-notifier>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-2245665c.js → p-4da92b01.js}

@@ -27,7 +27,7 @@ const SmoothlyTrigger = proxyCustomElement(class SmoothlyTrigger extends H {
                 result = this.disabled ? (h("slot", null)) : (h("a", { onClick: e => this.onClick(e) }, h("slot", null)));
                 break;
             case "button":
-                result = (h("button", { key: '479c644915049bed07210f0d3af39c53972ffe75', disabled: this.disabled, name: this.name }, h("slot", { key: '0fd43622722659b0066b97965400ea1a054cebf5' })));
+                result = (h("button", { key: '9f90f57a800588f874792965f1342ac8fd9da77d', disabled: this.disabled, name: this.name }, h("slot", { key: 'fc127bbbf5abe08d2fa85682f475e79bf9bc3aad' })));
                 break;
         }
         return result;
@@ -58,4 +58,4 @@ defineCustomElement();
 
 export { SmoothlyTrigger as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-2245665c.js.map
+//# sourceMappingURL=p-4da92b01.js.map

package/dist/components/{p-2245665c.js.map → p-4da92b01.js.map}

@@ -1 +1 @@
-{"file":"p-2245665c.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,stBAAstB,CAAC;AACxuB,8BAAe,QAAQ;;MCOV,eAAe;;;;;;;wBAGS,KAAK;oBACU,QAAQ;;;;IAM3D,OAAO,CAAC,CAAU;QACjB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAA;QACzD,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,CAAC,CAAC,cAAc,EAAE,CAAA;KAClB;IACD,MAAM;QACL,IAAI,MAAmB,CAAA;QACvB,QAAQ,IAAI,CAAC,IAAI;YAChB,KAAK,MAAM;gBACV,MAAM,GAAG,IAAI,CAAC,QAAQ,IACrB,eAAa,KAEb,SAAG,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAC/B,eAAa,CACV,CACJ,CAAA;gBACD,MAAK;YACN,KAAK,QAAQ;gBACZ,MAAM,IACL,+DAAQ,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAC/C,8DAAa,CACL,CACT,CAAA;gBACD,MAAK;SACN;QACD,OAAO,MAAM,CAAA;KACb;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/trigger/style.css?tag=smoothly-trigger&encapsulation=scoped","src/components/trigger/index.tsx"],"sourcesContent":[":host {\n\tdisplay: block;\n\tborder-style: solid;\n\tborder-width: 1px;\n\tborder-radius: 3px;\n}\n:host[hidden] {\n\tdisplay: none;\n}\n:host[disabled] {\n\topacity: 0.5;\n}\n:host > button {\n\tborder-color: transparent;\n\tbackground-color: transparent;\n\tpadding: 0.2em 0.3em;\n\tfont-size: 110%;\n\tfont-weight: 400;\n}\n:host:not([disabled]):hover,\n:host:not([disabled]):focus,\n:host:not([disabled]):active {\n\tborder-color: var(--smoothly-trigger-border);\n}\n:host[expand=full] > button,\n:host[expand=block] > button {\n\twidth: 100%;\n}\n:host[expand=full] {\n\tborder-left: none;\n\tborder-right: none;\n}\n","import { Component, Event, EventEmitter, h, Listen, Prop } from \"@stencil/core\"\nimport { Color, Fill, Trigger } from \"../../model\"\n\n@Component({\n\ttag: \"smoothly-trigger\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTrigger {\n\t@Prop({ reflect: true }) color: Color | undefined\n\t@Prop({ reflect: true }) fill: Fill\n\t@Prop({ reflect: true }) disabled = false\n\t@Prop({ reflect: true }) type: \"link\" | \"button\" = \"button\"\n\t@Prop() name: string\n\t@Prop() value?: any\n\t@Event() trigger: EventEmitter<Trigger>\n\n\t@Listen(\"click\")\n\tonClick(e: UIEvent) {\n\t\tthis.trigger.emit({ name: this.name, value: this.value })\n\t\te.stopPropagation()\n\t\te.preventDefault()\n\t}\n\trender() {\n\t\tlet result: HTMLElement\n\t\tswitch (this.type) {\n\t\t\tcase \"link\":\n\t\t\t\tresult = this.disabled ? (\n\t\t\t\t\t<slot></slot>\n\t\t\t\t) : (\n\t\t\t\t\t<a onClick={e => this.onClick(e)}>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</a>\n\t\t\t\t)\n\t\t\t\tbreak\n\t\t\tcase \"button\":\n\t\t\t\tresult = (\n\t\t\t\t\t<button disabled={this.disabled} name={this.name}>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</button>\n\t\t\t\t)\n\t\t\t\tbreak\n\t\t}\n\t\treturn result\n\t}\n}\n"],"version":3}
+{"file":"p-4da92b01.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,stBAAstB,CAAC;AACxuB,8BAAe,QAAQ;;MCOV,eAAe;;;;;;;wBAGS,KAAK;oBACU,QAAQ;;;;IAM3D,OAAO,CAAC,CAAU;QACjB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,CAAA;QACzD,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,CAAC,CAAC,cAAc,EAAE,CAAA;KAClB;IACD,MAAM;QACL,IAAI,MAAmB,CAAA;QACvB,QAAQ,IAAI,CAAC,IAAI;YAChB,KAAK,MAAM;gBACV,MAAM,GAAG,IAAI,CAAC,QAAQ,IACrB,eAAa,KAEb,SAAG,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAC/B,eAAa,CACV,CACJ,CAAA;gBACD,MAAK;YACN,KAAK,QAAQ;gBACZ,MAAM,IACL,+DAAQ,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAC/C,8DAAa,CACL,CACT,CAAA;gBACD,MAAK;SACN;QACD,OAAO,MAAM,CAAA;KACb;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/trigger/style.css?tag=smoothly-trigger&encapsulation=scoped","src/components/trigger/index.tsx"],"sourcesContent":[":host {\n\tdisplay: block;\n\tborder-style: solid;\n\tborder-width: 1px;\n\tborder-radius: 3px;\n}\n:host[hidden] {\n\tdisplay: none;\n}\n:host[disabled] {\n\topacity: 0.5;\n}\n:host > button {\n\tborder-color: transparent;\n\tbackground-color: transparent;\n\tpadding: 0.2em 0.3em;\n\tfont-size: 110%;\n\tfont-weight: 400;\n}\n:host:not([disabled]):hover,\n:host:not([disabled]):focus,\n:host:not([disabled]):active {\n\tborder-color: var(--smoothly-trigger-border);\n}\n:host[expand=full] > button,\n:host[expand=block] > button {\n\twidth: 100%;\n}\n:host[expand=full] {\n\tborder-left: none;\n\tborder-right: none;\n}\n","import { Component, Event, EventEmitter, h, Listen, Prop } from \"@stencil/core\"\nimport { Color, Fill, Trigger } from \"../../model\"\n\n@Component({\n\ttag: \"smoothly-trigger\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTrigger {\n\t@Prop({ reflect: true }) color: Color | undefined\n\t@Prop({ reflect: true }) fill: Fill\n\t@Prop({ reflect: true }) disabled = false\n\t@Prop({ reflect: true }) type: \"link\" | \"button\" = \"button\"\n\t@Prop() name: string\n\t@Prop() value?: any\n\t@Event() trigger: EventEmitter<Trigger>\n\n\t@Listen(\"click\")\n\tonClick(e: UIEvent) {\n\t\tthis.trigger.emit({ name: this.name, value: this.value })\n\t\te.stopPropagation()\n\t\te.preventDefault()\n\t}\n\trender() {\n\t\tlet result: HTMLElement\n\t\tswitch (this.type) {\n\t\t\tcase \"link\":\n\t\t\t\tresult = this.disabled ? (\n\t\t\t\t\t<slot></slot>\n\t\t\t\t) : (\n\t\t\t\t\t<a onClick={e => this.onClick(e)}>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</a>\n\t\t\t\t)\n\t\t\t\tbreak\n\t\t\tcase \"button\":\n\t\t\t\tresult = (\n\t\t\t\t\t<button disabled={this.disabled} name={this.name}>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</button>\n\t\t\t\t)\n\t\t\t\tbreak\n\t\t}\n\t\treturn result\n\t}\n}\n"],"version":3}

package/dist/components/{p-6f5a2d5b.js → p-54b99067.js}

@@ -16,7 +16,7 @@ const SmoothlyNextTableRowGroup = proxyCustomElement(class SmoothlyNextTableRowG
         this.smoothlyNextTableRowGroupChange.emit(this.open);
     }
     render() {
-        return (h(Host, { key: '43a82196fdfd80f0f919a4f62191c3361f41cba0' }, h("div", { key: '9919bacabb6794dd9a71925d7743c37ff2d805ea', onClick: () => this.clickHandler() }, h("div", { key: '71d0b9c9f93d826e623ce5e0a38af321e72c13d8' }, h("slot", { key: '52a00599eceebc5d1f4eb1db8eae7ffaa6ece430', name: "start" })), h("div", { key: '35a90ff17f0f195cce6b894235ab15e4575854c9' }, h("slot", { key: '0634ab63a3b9194337b37665b48a74c774348ddc', name: "end" }))), h("div", { key: '122e07656e70d691387319b1d674d952323be40d' }, h("slot", { key: 'cfcc0518333e93fa47391fdd6371662e9cbd42d8' }))));
+        return (h(Host, { key: 'e8fe944298d963c42b3be3ca591718065ffc1a10' }, h("div", { key: 'd20a811f2f428a88ca5d40c0a13d5f1830920737', onClick: () => this.clickHandler() }, h("div", { key: '0334061d3030bbe6e639ce39824fe6d6dc16c194' }, h("slot", { key: 'c503323239ebd3c4f4c7eb2dcc71e7ed8aa9ee53', name: "start" })), h("div", { key: '03eb020a4fbd59212089a8cd963d4ddd32750a78' }, h("slot", { key: 'f0caca039c2d1b074b0dcfa508f15c0bacb2a206', name: "end" }))), h("div", { key: '12a61061ae740af8b67057f086c2f89da12910de' }, h("slot", { key: '1d5716ab78a61626330058350483e460c85681fd' }))));
     }
     static get style() { return SmoothlyNextTableRowGroupStyle0; }
 }, [6, "smoothly-next-table-row-group", {
@@ -40,4 +40,4 @@ defineCustomElement();
 
 export { SmoothlyNextTableRowGroup as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-6f5a2d5b.js.map
+//# sourceMappingURL=p-54b99067.js.map

package/dist/components/{p-6f5a2d5b.js.map → p-54b99067.js.map}

@@ -1 +1 @@
-{"file":"p-6f5a2d5b.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,6wFAA6wF,CAAC;AAC/xF,wCAAe,QAAQ;;MCMV,yBAAyB;;;;;qBACJ,KAAK;oBACS,KAAK;;IAGpD,YAAY;QACX,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAA;QACtB,IAAI,CAAC,+BAA+B,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KACpD;IAED,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,4DAAK,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,IACtC,8DACC,6DAAM,IAAI,EAAE,OAAO,GAAI,CAClB,EACN,8DACC,6DAAM,IAAI,EAAE,KAAK,GAAI,CAChB,CACD,EACN,8DACC,8DAAQ,CACH,CACA,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/next/table/group/style.css?tag=smoothly-next-table-row-group&encapsulation=scoped","src/components/next/table/group/index.tsx"],"sourcesContent":[":host {\n\tgrid-column: 1 / -1;\n\tdisplay: grid;\n\tgrid-template-columns: subgrid;\n\tmargin-top: 1px;\n}\n:host > div:first-child {\n\tgrid-column: 1 / -1;\n\tdisplay: grid;\n\tposition: relative;\n\tcursor: pointer;\n}\n:host > div:last-child {\n\tgrid-column: 1 / -1;\n\tdisplay: grid;\n\tgrid-template-columns: subgrid;\n}\n\n:host[align] > div:first-child {\n\tgrid-template-columns: subgrid;\n}\n:host[align] > div:first-child > div {\n\tdisplay: contents;\n}\n:host[align] > div:first-child > div > * {\n\tpadding: 0.3rem 1.1rem;\n}\n\n:host:not([align]) > div:first-child {\n\tgrid-column: 1 / -1;\n\tdisplay: grid;\n\tgrid-template-columns: repeat(2, auto);\n\tjustify-content: space-between;\n\tpadding: 0.3rem 1.1rem;\n}\n:host:not([align]) > div:first-child > div:first-child {\n\tjustify-self: start;\n\tdisplay: flex;\n\tgap: 1rem;\n}\n:host:not([align]) > div:first-child > div:last-child {\n\tjustify-self: end;\n\tdisplay: flex;\n\tgap: 1rem;\n}\n\n:host:not([open]) {\n\tgrid-template-rows: auto 0fr;\n}\n:host:not([open]) > div:last-child {\n\tgrid-row: 2;\n\toverflow: hidden;\n}\n\n:host > div:first-child > div:first-child::before {\n\tcontent: '';\n\tdisplay: flex;\n\tposition: absolute;\n\ttop: 50%;\n\ttranslate: 0 -50%;\n\tleft: 0.3em;\n\theight: 0.4em;\n\twidth: 0.4em;\n\tborder-bottom: 1px solid rgb(var(--smoothly-default-contrast));\n\tborder-right: 1px solid rgb(var(--smoothly-default-contrast));\n\ttransition: rotate 200ms ease-in-out;\n\trotate: -45deg;\n\topacity: 0.3;\n}\n:host > div:first-child:hover > div:first-child::before {\n\topacity: 1;\n}\n:host[open] > div:first-child > div:first-child::before {\n\trotate: 45deg;\n}\n\n:host > div:first-child {\n\tbackground-color: rgb(var(--smoothly-default-tint));\n}\n:host > div:first-child {\n\tborder-bottom: 1px solid rgb(var(--smoothly-default-shade));\n}\n:host > div:first-child:hover {\n\tbackground-color: rgb(var(--smoothly-default-shade));\n}\n","import { Component, Event, EventEmitter, h, Host, Prop, VNode } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-next-table-row-group\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyNextTableRowGroup {\n\t@Prop({ reflect: true }) align = false\n\t@Prop({ reflect: true, mutable: true }) open = false\n\t@Event() smoothlyNextTableRowGroupChange: EventEmitter<boolean>\n\n\tclickHandler(): void {\n\t\tthis.open = !this.open\n\t\tthis.smoothlyNextTableRowGroupChange.emit(this.open)\n\t}\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div onClick={() => this.clickHandler()}>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<slot name={\"start\"} />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<slot name={\"end\"} />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-54b99067.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,6wFAA6wF,CAAC;AAC/xF,wCAAe,QAAQ;;MCMV,yBAAyB;;;;;qBACJ,KAAK;oBACS,KAAK;;IAGpD,YAAY;QACX,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAA;QACtB,IAAI,CAAC,+BAA+B,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KACpD;IAED,MAAM;QACL,QACC,EAAC,IAAI,uDACJ,4DAAK,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,IACtC,8DACC,6DAAM,IAAI,EAAE,OAAO,GAAI,CAClB,EACN,8DACC,6DAAM,IAAI,EAAE,KAAK,GAAI,CAChB,CACD,EACN,8DACC,8DAAQ,CACH,CACA,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/next/table/group/style.css?tag=smoothly-next-table-row-group&encapsulation=scoped","src/components/next/table/group/index.tsx"],"sourcesContent":[":host {\n\tgrid-column: 1 / -1;\n\tdisplay: grid;\n\tgrid-template-columns: subgrid;\n\tmargin-top: 1px;\n}\n:host > div:first-child {\n\tgrid-column: 1 / -1;\n\tdisplay: grid;\n\tposition: relative;\n\tcursor: pointer;\n}\n:host > div:last-child {\n\tgrid-column: 1 / -1;\n\tdisplay: grid;\n\tgrid-template-columns: subgrid;\n}\n\n:host[align] > div:first-child {\n\tgrid-template-columns: subgrid;\n}\n:host[align] > div:first-child > div {\n\tdisplay: contents;\n}\n:host[align] > div:first-child > div > * {\n\tpadding: 0.3rem 1.1rem;\n}\n\n:host:not([align]) > div:first-child {\n\tgrid-column: 1 / -1;\n\tdisplay: grid;\n\tgrid-template-columns: repeat(2, auto);\n\tjustify-content: space-between;\n\tpadding: 0.3rem 1.1rem;\n}\n:host:not([align]) > div:first-child > div:first-child {\n\tjustify-self: start;\n\tdisplay: flex;\n\tgap: 1rem;\n}\n:host:not([align]) > div:first-child > div:last-child {\n\tjustify-self: end;\n\tdisplay: flex;\n\tgap: 1rem;\n}\n\n:host:not([open]) {\n\tgrid-template-rows: auto 0fr;\n}\n:host:not([open]) > div:last-child {\n\tgrid-row: 2;\n\toverflow: hidden;\n}\n\n:host > div:first-child > div:first-child::before {\n\tcontent: '';\n\tdisplay: flex;\n\tposition: absolute;\n\ttop: 50%;\n\ttranslate: 0 -50%;\n\tleft: 0.3em;\n\theight: 0.4em;\n\twidth: 0.4em;\n\tborder-bottom: 1px solid rgb(var(--smoothly-default-contrast));\n\tborder-right: 1px solid rgb(var(--smoothly-default-contrast));\n\ttransition: rotate 200ms ease-in-out;\n\trotate: -45deg;\n\topacity: 0.3;\n}\n:host > div:first-child:hover > div:first-child::before {\n\topacity: 1;\n}\n:host[open] > div:first-child > div:first-child::before {\n\trotate: 45deg;\n}\n\n:host > div:first-child {\n\tbackground-color: rgb(var(--smoothly-default-tint));\n}\n:host > div:first-child {\n\tborder-bottom: 1px solid rgb(var(--smoothly-default-shade));\n}\n:host > div:first-child:hover {\n\tbackground-color: rgb(var(--smoothly-default-shade));\n}\n","import { Component, Event, EventEmitter, h, Host, Prop, VNode } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-next-table-row-group\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyNextTableRowGroup {\n\t@Prop({ reflect: true }) align = false\n\t@Prop({ reflect: true, mutable: true }) open = false\n\t@Event() smoothlyNextTableRowGroupChange: EventEmitter<boolean>\n\n\tclickHandler(): void {\n\t\tthis.open = !this.open\n\t\tthis.smoothlyNextTableRowGroupChange.emit(this.open)\n\t}\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<div onClick={() => this.clickHandler()}>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<slot name={\"start\"} />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<slot name={\"end\"} />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-8f277683.js → p-558481f1.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-f765921a.js';
-import { I as Input } from './p-6f3fa567.js';
-import { d as defineCustomElement$1 } from './p-8e748704.js';
+import { I as Input } from './p-7c13984b.js';
+import { d as defineCustomElement$1 } from './p-7f7c4cf3.js';
 
 const styleCss = ".sc-smoothly-summary-h{display:grid;grid-template-columns:auto 1fr;column-gap:0.3rem}.sc-smoothly-summary-h>details.sc-smoothly-summary{display:contents}.sc-smoothly-summary-h>details.sc-smoothly-summary>summary.sc-smoothly-summary{display:grid;grid-template-columns:subgrid;grid-column:1/-1;list-style:none;align-items:center;cursor:pointer}.sc-smoothly-summary-h>details.sc-smoothly-summary>summary.sc-smoothly-summary>smoothly-icon.sc-smoothly-summary{transition:transform 0.2s, opacity 0.1s;opacity:0.3}.sc-smoothly-summary-h>details.sc-smoothly-summary>summary.sc-smoothly-summary:hover>smoothly-icon.sc-smoothly-summary{opacity:1}.sc-smoothly-summary-h>details[open].sc-smoothly-summary>summary.sc-smoothly-summary>smoothly-icon.sc-smoothly-summary{transform:rotate(90deg)}.sc-smoothly-summary-h>details.sc-smoothly-summary-s>[slot=content]{grid-column:2}@media (prefers-reduced-motion){.sc-smoothly-summary-h>details.sc-smoothly-summary>summary.sc-smoothly-summary>smoothly-icon.sc-smoothly-summary{transition:none}}@supports selector(details::details-content){.sc-smoothly-summary-h>details.sc-smoothly-summary::details-content{grid-column:2}}";
 const SmoothlySummaryStyle0 = styleCss;
@@ -33,7 +33,7 @@ const SmoothlySummary = proxyCustomElement(class SmoothlySummary extends H {
         }
     }
     render() {
-        return (h("details", { key: 'ee64137eb2602f80947c504919436f8915ca11d8', onToggle: e => this.toggleHandler(e), open: this.open }, h("summary", { key: '3825bd22d7d067d5b7db61516bde33c76aa95d44' }, h("smoothly-icon", { key: 'eb261691c802689273ea6c0aaaf93ae02a9bc2be', name: "caret-forward", color: this.color, fill: this.fill, size: this.size }), h("slot", { key: '5fd15219e08d9b609bc514f76c8ae0ebc5d116e6', name: "summary" })), h("slot", { key: '0425b325aa241a80081023ce4e99d280092608d0', name: "content" })));
+        return (h("details", { key: 'db42c69d9d5c12ebf3f4cd44304827a479ada63f', onToggle: e => this.toggleHandler(e), open: this.open }, h("summary", { key: '3c0552d3df2469fb2464612fdad04d7b37aea3d2' }, h("smoothly-icon", { key: '1b48642f6cabdcbd8b8e74ff9547c52ee7c8e386', name: "caret-forward", color: this.color, fill: this.fill, size: this.size }), h("slot", { key: '19df2566c29cf0d306ccb59255ae5d2cea8979a1', name: "summary" })), h("slot", { key: 'a250c33f1a121c4edd454d74a0f0d127a4e61491', name: "content" })));
     }
     static get style() { return SmoothlySummaryStyle0; }
 }, [6, "smoothly-summary", {
@@ -64,4 +64,4 @@ defineCustomElement();
 
 export { SmoothlySummary as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-8f277683.js.map
+//# sourceMappingURL=p-558481f1.js.map

package/dist/components/{p-8f277683.js.map → p-558481f1.js.map}

@@ -1 +1 @@
-{"file":"p-8f277683.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,ioCAAioC,CAAC;AACnpC,8BAAe,QAAQ;;MCOV,eAAe;;;;;QACnB,WAAM,GAAkC,EAAE,CAAA;oBACH,KAAK;;oBAE/B,OAAO;oBAC0B,MAAM;;IAG5D,MAAM,aAAa,CAAC,KAAY;QAC/B,IAAI,KAAK,CAAC,MAAM,YAAY,kBAAkB,EAAE;YAC/C,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA;YAC7B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;YACxC,IAAI,CAAC,IAAI;kBACN,MAAM,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;kBAC5E,MAAM,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC,CAAC,CAAA;SACjF;KACD;IAID,WAAW,CAAC,KAAkB;QAC7B,IAAI,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;YACnC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,MAAM,CAAA;YAC7C,IAAI,CAAC,IAAI,CAAC,IAAI;gBACb,KAAK,CAAC,eAAe,EAAE,CAAA;SACxB;KACD;IAED,MAAM;QACL,QACC,gEAAS,QAAQ,EAAE,CAAC,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAC7D,kEACC,sEAAe,IAAI,EAAC,eAAe,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,EAC3F,6DAAM,IAAI,EAAC,SAAS,GAAG,CACd,EACV,6DAAM,IAAI,EAAC,SAAS,GAAG,CACd,EACV;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/summary/style.css?tag=smoothly-summary&encapsulation=scoped","src/components/summary/index.tsx"],"sourcesContent":[":host {\n\tdisplay: grid;\n\tgrid-template-columns: auto 1fr;\n\tcolumn-gap: 0.3rem;\n}\n\n:host>details {\n\tdisplay: contents;\n}\n\n:host>details>summary {\n\tdisplay: grid;\n\tgrid-template-columns: subgrid;\n\tgrid-column: 1/-1;\n\tlist-style: none;\n\talign-items: center;\n\tcursor: pointer;\n}\n\n:host>details>summary>smoothly-icon {\n\ttransition: transform 0.2s, opacity 0.1s;\n\topacity: 0.3;\n}\n\n:host>details>summary:hover>smoothly-icon {\n\topacity: 1;\n}\n\n:host>details[open]>summary>smoothly-icon {\n\ttransform: rotate(90deg);\n}\n\n:host>details::slotted([slot=content]) {\n\tgrid-column: 2;\n}\n\n@media (prefers-reduced-motion) { \n\t:host>details>summary>smoothly-icon {\n\t\ttransition: none;\n\t}\n}\n /* chromium specific */\n@supports selector(details::details-content) {\n\t:host>details::details-content {\n\t\tgrid-column: 2;\n\t}\n}\n","import { Component, Event, EventEmitter, h, Listen, Prop } from \"@stencil/core\"\nimport { Color, Fill } from \"../../model\"\nimport { Input } from \"../input/Input\"\n@Component({\n\ttag: \"smoothly-summary\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlySummary {\n\tprivate inputs: Record<string, Input.Element> = {}\n\t@Prop({ mutable: true, reflect: true }) open = false\n\t@Prop() color: Color\n\t@Prop() fill: Fill = \"solid\"\n\t@Prop() size: \"tiny\" | \"small\" | \"medium\" | \"large\" = \"tiny\"\n\t@Event() smoothlySummaryOpen: EventEmitter<boolean>\n\n\tasync toggleHandler(event: Event) {\n\t\tif (event.target instanceof HTMLDetailsElement) {\n\t\t\tthis.open = event.target.open\n\t\t\tthis.smoothlySummaryOpen.emit(this.open)\n\t\t\tthis.open\n\t\t\t\t? await Promise.all(Object.values(this.inputs).map(input => input.register()))\n\t\t\t\t: await Promise.all(Object.values(this.inputs).map(input => input.unregister()))\n\t\t}\n\t}\n\n\t@Listen(\"smoothlyInputLoad\")\n\t@Listen(\"smoothlyInput\")\n\tonInputLoad(event: CustomEvent) {\n\t\tif (Input.Element.is(event.target)) {\n\t\t\tthis.inputs[event.target.name] = event.target\n\t\t\tif (!this.open)\n\t\t\t\tevent.stopPropagation()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<details onToggle={e => this.toggleHandler(e)} open={this.open}>\n\t\t\t\t<summary>\n\t\t\t\t\t<smoothly-icon name=\"caret-forward\" color={this.color} fill={this.fill} size={this.size} />\n\t\t\t\t\t<slot name=\"summary\" />\n\t\t\t\t</summary>\n\t\t\t\t<slot name=\"content\" />\n\t\t\t</details>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-558481f1.js","mappings":";;;;AAAA,MAAM,QAAQ,GAAG,ioCAAioC,CAAC;AACnpC,8BAAe,QAAQ;;MCOV,eAAe;;;;;QACnB,WAAM,GAAkC,EAAE,CAAA;oBACH,KAAK;;oBAE/B,OAAO;oBAC0B,MAAM;;IAG5D,MAAM,aAAa,CAAC,KAAY;QAC/B,IAAI,KAAK,CAAC,MAAM,YAAY,kBAAkB,EAAE;YAC/C,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA;YAC7B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;YACxC,IAAI,CAAC,IAAI;kBACN,MAAM,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;kBAC5E,MAAM,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,KAAK,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC,CAAC,CAAA;SACjF;KACD;IAID,WAAW,CAAC,KAAkB;QAC7B,IAAI,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;YACnC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,MAAM,CAAA;YAC7C,IAAI,CAAC,IAAI,CAAC,IAAI;gBACb,KAAK,CAAC,eAAe,EAAE,CAAA;SACxB;KACD;IAED,MAAM;QACL,QACC,gEAAS,QAAQ,EAAE,CAAC,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAC7D,kEACC,sEAAe,IAAI,EAAC,eAAe,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,EAC3F,6DAAM,IAAI,EAAC,SAAS,GAAG,CACd,EACV,6DAAM,IAAI,EAAC,SAAS,GAAG,CACd,EACV;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/summary/style.css?tag=smoothly-summary&encapsulation=scoped","src/components/summary/index.tsx"],"sourcesContent":[":host {\n\tdisplay: grid;\n\tgrid-template-columns: auto 1fr;\n\tcolumn-gap: 0.3rem;\n}\n\n:host>details {\n\tdisplay: contents;\n}\n\n:host>details>summary {\n\tdisplay: grid;\n\tgrid-template-columns: subgrid;\n\tgrid-column: 1/-1;\n\tlist-style: none;\n\talign-items: center;\n\tcursor: pointer;\n}\n\n:host>details>summary>smoothly-icon {\n\ttransition: transform 0.2s, opacity 0.1s;\n\topacity: 0.3;\n}\n\n:host>details>summary:hover>smoothly-icon {\n\topacity: 1;\n}\n\n:host>details[open]>summary>smoothly-icon {\n\ttransform: rotate(90deg);\n}\n\n:host>details::slotted([slot=content]) {\n\tgrid-column: 2;\n}\n\n@media (prefers-reduced-motion) { \n\t:host>details>summary>smoothly-icon {\n\t\ttransition: none;\n\t}\n}\n /* chromium specific */\n@supports selector(details::details-content) {\n\t:host>details::details-content {\n\t\tgrid-column: 2;\n\t}\n}\n","import { Component, Event, EventEmitter, h, Listen, Prop } from \"@stencil/core\"\nimport { Color, Fill } from \"../../model\"\nimport { Input } from \"../input/Input\"\n@Component({\n\ttag: \"smoothly-summary\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlySummary {\n\tprivate inputs: Record<string, Input.Element> = {}\n\t@Prop({ mutable: true, reflect: true }) open = false\n\t@Prop() color: Color\n\t@Prop() fill: Fill = \"solid\"\n\t@Prop() size: \"tiny\" | \"small\" | \"medium\" | \"large\" = \"tiny\"\n\t@Event() smoothlySummaryOpen: EventEmitter<boolean>\n\n\tasync toggleHandler(event: Event) {\n\t\tif (event.target instanceof HTMLDetailsElement) {\n\t\t\tthis.open = event.target.open\n\t\t\tthis.smoothlySummaryOpen.emit(this.open)\n\t\t\tthis.open\n\t\t\t\t? await Promise.all(Object.values(this.inputs).map(input => input.register()))\n\t\t\t\t: await Promise.all(Object.values(this.inputs).map(input => input.unregister()))\n\t\t}\n\t}\n\n\t@Listen(\"smoothlyInputLoad\")\n\t@Listen(\"smoothlyInput\")\n\tonInputLoad(event: CustomEvent) {\n\t\tif (Input.Element.is(event.target)) {\n\t\t\tthis.inputs[event.target.name] = event.target\n\t\t\tif (!this.open)\n\t\t\t\tevent.stopPropagation()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<details onToggle={e => this.toggleHandler(e)} open={this.open}>\n\t\t\t\t<summary>\n\t\t\t\t\t<smoothly-icon name=\"caret-forward\" color={this.color} fill={this.fill} size={this.size} />\n\t\t\t\t\t<slot name=\"summary\" />\n\t\t\t\t</summary>\n\t\t\t\t<slot name=\"content\" />\n\t\t\t</details>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-d0d172ed.js → p-58d5e72e.js}

@@ -1,33 +1,33 @@
 import { p as proxyCustomElement, H, h, F as Fragment, d as Host } from './p-f765921a.js';
 import { R as RGB } from './p-8e1e509d.js';
 import { d as defineCustomElement$s } from './p-7d0eafb0.js';
-import { d as defineCustomElement$r } from './p-8e13449b.js';
-import { d as defineCustomElement$q } from './p-c8f16f2f.js';
+import { d as defineCustomElement$r } from './p-cb083b20.js';
+import { d as defineCustomElement$q } from './p-7962c1af.js';
 import { d as defineCustomElement$p } from './p-4f80c811.js';
 import { d as defineCustomElement$o } from './p-f770567b.js';
 import { d as defineCustomElement$n } from './p-96acfe2c.js';
 import { d as defineCustomElement$m } from './p-f46dd8e4.js';
 import { d as defineCustomElement$l } from './p-4c6fe645.js';
-import { d as defineCustomElement$k } from './p-6f3fa567.js';
-import { d as defineCustomElement$j } from './p-8e748704.js';
-import { d as defineCustomElement$i } from './p-0ac899b2.js';
-import { d as defineCustomElement$h } from './p-9cb820c5.js';
-import { d as defineCustomElement$g } from './p-6acdcb78.js';
-import { d as defineCustomElement$f } from './p-17794f14.js';
-import { d as defineCustomElement$e } from './p-b95db1c4.js';
-import { d as defineCustomElement$d } from './p-4290c3dc.js';
-import { d as defineCustomElement$c } from './p-285fe73a.js';
-import { d as defineCustomElement$b } from './p-20881197.js';
-import { d as defineCustomElement$a } from './p-56235c3f.js';
-import { d as defineCustomElement$9 } from './p-2dcd7532.js';
-import { d as defineCustomElement$8 } from './p-036a11dd.js';
-import { d as defineCustomElement$7 } from './p-9088d27f.js';
-import { d as defineCustomElement$6 } from './p-9040a584.js';
-import { d as defineCustomElement$5 } from './p-dfde995c.js';
-import { d as defineCustomElement$4 } from './p-8f277683.js';
-import { d as defineCustomElement$3 } from './p-78f4df54.js';
-import { d as defineCustomElement$2 } from './p-635413e0.js';
-import { d as defineCustomElement$1 } from './p-b83c0cdb.js';
+import { d as defineCustomElement$k } from './p-7c13984b.js';
+import { d as defineCustomElement$j } from './p-7f7c4cf3.js';
+import { d as defineCustomElement$i } from './p-d2aa1c38.js';
+import { d as defineCustomElement$h } from './p-aabc0016.js';
+import { d as defineCustomElement$g } from './p-c5ebb66b.js';
+import { d as defineCustomElement$f } from './p-a4c683f7.js';
+import { d as defineCustomElement$e } from './p-2240500f.js';
+import { d as defineCustomElement$d } from './p-07b733ab.js';
+import { d as defineCustomElement$c } from './p-194be519.js';
+import { d as defineCustomElement$b } from './p-a73d4047.js';
+import { d as defineCustomElement$a } from './p-e2de28a2.js';
+import { d as defineCustomElement$9 } from './p-07d3ec9e.js';
+import { d as defineCustomElement$8 } from './p-7d547395.js';
+import { d as defineCustomElement$7 } from './p-5bf952c5.js';
+import { d as defineCustomElement$6 } from './p-4325ac30.js';
+import { d as defineCustomElement$5 } from './p-1070ed11.js';
+import { d as defineCustomElement$4 } from './p-558481f1.js';
+import { d as defineCustomElement$3 } from './p-9a61768f.js';
+import { d as defineCustomElement$2 } from './p-f815774c.js';
+import { d as defineCustomElement$1 } from './p-358396f3.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;
@@ -42,10 +42,10 @@ const SmoothlyFormDemoPet = proxyCustomElement(class SmoothlyFormDemoPet extends
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: 'f926cc45f0cc0291f2c24c7b398606a85b50d234' }, h("h2", { key: 'fb0ba15fe080450f09989315d3c145028217b692' }, "Pet"), h("h3", { key: 'd3dccbcc9b23b2cd8218936424e17a278feea2a4' }, "Value"), h("smoothly-form", { key: 'bf16fa9747ed9b5a6a0208cb6f412b3203077de7', looks: "border", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)), onSmoothlyFormInput: e => (this.value = Object.assign({}, e.detail)) }, h("smoothly-input", { key: '517b4234109763201875c4894ab5e9627f7f4abc', type: "text", name: "name.first" }, "Name"), h("smoothly-input", { key: 'ee6ac67d9818a76c10462980c445ca33ae46638b', type: "integer", name: "age" }, "Age (Years)"), h("smoothly-input-checkbox", { key: '28b630a35af9ce0976bbb7057c4fdbb4c47cef58', name: "hasOwner", onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
+        return (h(Host, { key: 'db081d6ec048537567ff4c3de3efb80f02e875a9' }, h("h2", { key: '152ec589606c14d600458d16edd6aa2c45366007' }, "Pet"), h("h3", { key: '51ccb3e2d3a10b11579fa24ae5998a10ed2e656c' }, "Value"), h("smoothly-form", { key: 'b1e76f0e962498c312fb61b2198f27e177eedeea', looks: "border", onSmoothlyFormSubmit: (e) => alert(JSON.stringify(e.detail)), onSmoothlyFormInput: e => (this.value = Object.assign({}, e.detail)) }, h("smoothly-input", { key: 'c60c6da48f5e5c62b84a934dd908f18278bd5a7a', type: "text", name: "name.first" }, "Name"), h("smoothly-input", { key: '92cf53c5a0fc3dbb9d1f7b042c6600458524cfd7', type: "integer", name: "age" }, "Age (Years)"), h("smoothly-input-checkbox", { key: 'e4e9f551b36342ac128b5c189e372add1453be38', name: "hasOwner", onSmoothlyInputLoad: e => e.stopPropagation(), onSmoothlyInput: e => {
                 this.hasOwner = e.detail.hasOwner;
                 e.stopPropagation();
-            } }, "Has Owner"), this.hasOwner && (h(Fragment, { key: '8ee49fcf125cd50beaf4fcf593a16b58778e76cb' }, h("smoothly-input", { key: 'bfafcac88d20b89c67e5d1e222812f2851888633', 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: '874b59bc35579337167b159cd64a80be4504bb2f', 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: '8a489e5bb6483336c2977a5f8b64220ea29ebbdf', name: "owner.picture" }, h("span", { key: 'e457cee963a8060ecfc4b6beeabf0457dd45c496', slot: "label" }, "Owner picture")), h("smoothly-input-date", { key: 'a6485e71de11cde954fb55f0a08013e9674c83b6', 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: '43ecabe7e035de133f1394ddfab21b0ca8866a2b', 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: '5586a1e0ad8d9c76dc918f23b15ff653006ab436', 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: '418a7a9e76171c20d948c4175ed079b235c57f55', name: "owner.favoriteHat" }, h("span", { key: '7be6a6723da871f52ca827f8e65d6c0416caf881', 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: '7d10d88c10060bdd6c686febed826ad0684fdda4', 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: '51ae6d26dc3472dc34bc039f0a149e87d3a2f2f5', 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: 'af419a86d160c269862e474de0c5e354453fd8a2', 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: '003b5e3f6ed34ec8d73f2dccb1482350d2c25f86', 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: 'bb73afe0dd4b31f56ea336b9dc103367cdc627e3' }, h("span", { key: 'd8f5a03c901be8a2aa586011a0faef34ce712d5c', slot: "summary" }, "Summary"), h("div", { key: 'f7083c2d68d2e8d44ea3eb39a4f308816bdcda9a', slot: "content" }, h("smoothly-input", { key: 'b2efc307607f9933eec46f9b7a2c1fa9cc4d6cca', type: "price", name: "summary.price", currency: "EUR" }, "Summary Price"), h("smoothly-input-file", { key: '0de58d7552d6fe19d3338251d7160d8fa07e4f41', name: "summary.picture" }, h("span", { key: 'f617802b638f635a38d60561098e14844dd22d50', slot: "label" }, "Summary picture")), h("smoothly-input-date", { key: '12f8e38b0be8b6d4448a1a210b279f234723d089', name: "summary.birthday" }, "Summary birthday"), h("smoothly-input-date-range", { key: '4183ad71048f2a2b83d9a3cc15c342e70d32eb36', name: "summary.ownedRange" }, "Summary ownedRange"), h("smoothly-input-range", { key: '88abf4bf85b3789e5392f1ae50e2131f86f524a1', name: "summary.height", label: "Height" }), h("smoothly-input-select", { key: '163c4d30504d2d440bb4e31d42e54286d2ea4d30', name: "summary.favoriteHat" }, h("span", { key: 'b803a9d4b5c969f74cf649495ff29b80dc7eca32', 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: 'd4120f7272df1eddf403cd56b8433cb6ca4528a6', name: "summary.month" }, h("span", { key: '2cb8eef31ee0980ccb7418d42517b4df6cedaf91', slot: "month-label" }, "Summary month")), h("smoothly-input-color", { key: '6e3a63f405b74d88d42bbe5f957fee1ba0f9502e', name: "summary.color" }, "Summary Color"), h("smoothly-input-radio", { key: '176ac40da54721997c43d0a81666acb4998b37b7', name: "summary.favoritePizza" }, h("span", { key: '6871e57f0b47cd6d69f675728cbc8adc04eb07ea', 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: '80670e084705b6dd89313fac93cc9cae199e4d49', name: "summary.hasPet" }, "Has Pet"))), h("smoothly-tabs", { key: '54adf6f72e5e47c87420b590c1ee0339917b2443' }, h("smoothly-tab", { key: 'bc35a89b5e79189f358204e3dc3f53ff56d36fd5', label: "Dog" }, h("smoothly-input", { key: '9cc578a69ab318b029a3e2ed911b8c44fa43a198', type: "text", name: "dog.breed" }, "Breed"), h("smoothly-input-file", { key: 'da49e55084302c59403e396216a5662814467d0e', name: "dog.picture" }, h("span", { key: '4ba608f3e2ba497a71912385898053e412c8bfe4', slot: "label" }, "Dog picture")), h("smoothly-input-date", { key: '0e9aeebaed1e5bc84995008be8fc9f35ea1b251d', name: "dog.birthday" }, "Dog birthday"), h("smoothly-input-date-range", { key: '6e199a7d72c816a069b7ba1ac71880f82f8b82d2', name: "dog.dateRange" }, "Dog date range"), h("smoothly-input-select", { key: 'e381b1b0f5f15f043135c7c50278a45aad11e70c', name: "dog.favoriteHat" }, h("span", { key: 'd4e77a11d6a6967816ad157048917c37c00e6cff', 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: '0a5c74e5716ea1d46e56d0923f60265ecb9645a8', name: "dog.favoriteColor" }, "Dog's Favorite Color"), h("smoothly-input-radio", { key: 'ccc2fcde4138d6c8873694a197358a89dd203f26', name: "dog.favoritePizza" }, h("span", { key: '97bbceaef27ee84dba00348edc30e88f04b9f274', 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: '3fa75d1646e6d15e466452f0c65e4ddf5fbc4f36', name: "dog.hasPet" }, "Has Pet")), h("smoothly-tab", { key: '1eeffd514378ffe9cc3e0119c3544cd498408116', label: "Cat", open: true }, h("smoothly-input", { key: '65ad05667b91c90fd7a220a40b7e7a44e12dfda3', name: "cat.favoriteFood" }, "Favorite Food"))), h("smoothly-input-submit", { key: 'f52d5879ac3c5f9ff62fad15f2f047b631771151', size: "icon", slot: "submit", color: "success", fill: "solid" })), h("smoothly-display", { key: '2eef08cbc4914369df28029689e3e74b63923507', type: "json", value: this.value })));
+            } }, "Has Owner"), this.hasOwner && (h(Fragment, { key: 'd4e41bd4f0ea384e45d3c7b0ebcfc8fef0c8a273' }, h("smoothly-input", { key: 'a8f6dec76b80683428d77f30c3e444a883d1afc7', 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: '7556e46fc24f10f1ca8252d3759e13ef6be294e7', 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: 'eb895e44123c07d936fbdca933b873aa20eed521', name: "owner.picture" }, h("span", { key: '8b44d1b0e331113f3d9c994edd860bcbbaa0235a', slot: "label" }, "Owner picture")), h("smoothly-input-date", { key: '5ea7342881dc271817826891f9e4007d4d1f1389', 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: '6209c4291574f87a35c1904defebd4cbde66290c', 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: 'b9dc7ac7da7ff8593e1a2e4a4d328dd81dfc5992', 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: '21d3858ea701a6286251ae44371b2dbb9c370412', name: "owner.favoriteHat" }, h("span", { key: '2e8cef55162db373af79645a4b5e374a6b40bbb2', 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: '24133d180e198e554b63de26bc3323cbe3744601', 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: '274fb656b13bde70abea4fa35eb688cdf46eacb8', 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: 'df83a30c36b5177a23d8763d5e66611db3bbe697', 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: '5a733c0b2ff06ddad303ec77097775d4a42fadb5', 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: '6d2fcc2affe9250787419dce8157912339803fee' }, h("span", { key: 'b589d7b6ca57d95b621d827cfb5927db3faca50b', slot: "summary" }, "Summary"), h("div", { key: 'd4d1293918327030bdee186d4ca5a55682b3703c', slot: "content" }, h("smoothly-input", { key: '5959e26fe56c7347f7c15a17cdfd4f2acdfb9fef', type: "price", name: "summary.price", currency: "EUR" }, "Summary Price"), h("smoothly-input-file", { key: 'd1bb869132deb842aa805655d552906c80858ec8', name: "summary.picture" }, h("span", { key: 'f8b1915acdd0d42eb33978fcb02f662d65a8f2ab', slot: "label" }, "Summary picture")), h("smoothly-input-date", { key: 'b64e66df7956ab1a05197fe2d51e44361f984c0e', name: "summary.birthday" }, "Summary birthday"), h("smoothly-input-date-range", { key: '5466ee7830e653a6f6db25961645c9ab203ccb51', name: "summary.ownedRange" }, "Summary ownedRange"), h("smoothly-input-range", { key: '7ce763b3bef80bc5e0e0206c7f66fec8631d29d6', name: "summary.height", label: "Height" }), h("smoothly-input-select", { key: '83b72df95cff68356940bdaec14fc5afb136fc36', name: "summary.favoriteHat" }, h("span", { key: 'f8b6d174307542335f4da99192b8aaf6c85c9aec', 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: 'b75782058ca787708a313135fc1e8bb152e6b3c3', name: "summary.month" }, h("span", { key: '696e8468f1f4ed059418e8ce73630f2e342bbddc', slot: "month-label" }, "Summary month")), h("smoothly-input-color", { key: '8e667d352bd2c206980b6104c67f9ae2c5a99966', name: "summary.color" }, "Summary Color"), h("smoothly-input-radio", { key: 'd1aaf397f6b3ab4f09334b5a7bb29dc8d21c6ddd', name: "summary.favoritePizza" }, h("span", { key: 'f3b6a36b33d5a57ae90fed082e49f64009f918cd', 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: 'a3623c6c863c01ececceb3662bc28e866bb02624', name: "summary.hasPet" }, "Has Pet"))), h("smoothly-tabs", { key: '560c301f9084430a3116610ecac87526c4c75fe3' }, h("smoothly-tab", { key: 'a6daa32792c96cc28522f8be2bedd0cb55c0fd11', label: "Dog" }, h("smoothly-input", { key: '7d49e5553a141bddea389bf51dd84a9c77bcefe6', type: "text", name: "dog.breed" }, "Breed"), h("smoothly-input-file", { key: 'aa8ad2af83ad5f74e7094cddde1ad86232708335', name: "dog.picture" }, h("span", { key: 'ba9254c5c1e741d44136d0f6cbb28d5f4f0dafc4', slot: "label" }, "Dog picture")), h("smoothly-input-date", { key: '8e49fb563376bd4349e7151a8ef4292fffa2badd', name: "dog.birthday" }, "Dog birthday"), h("smoothly-input-date-range", { key: '5a8b95b3fa01a59a7e6cfe32c0158b10d6548805', name: "dog.dateRange" }, "Dog date range"), h("smoothly-input-select", { key: '9db97eab10483487370a2eea58a7b4c69bf1d6c4', name: "dog.favoriteHat" }, h("span", { key: '84f01e17a57d9bc3ce1c6c7e3973ebddf6ec1388', 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: '40b05d29bf1fce02de12100fd649d3c24313b104', name: "dog.favoriteColor" }, "Dog's Favorite Color"), h("smoothly-input-radio", { key: 'e7477ef30a27eced86023fd8463c8982e3c949cd', name: "dog.favoritePizza" }, h("span", { key: 'f58e1ccc4ddabc64df4f567ea3b279075acb17e8', 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: 'f02baf4ffd3456d15eda802c1f701e941bf74c08', name: "dog.hasPet" }, "Has Pet")), h("smoothly-tab", { key: 'cffe512b4e6ac0a4c9ca085de43e1924e3778b7b', label: "Cat", open: true }, h("smoothly-input", { key: 'f7196eec6788c2f294ff6743bb4360e1a57b0a14', name: "cat.favoriteFood" }, "Favorite Food"))), h("smoothly-input-submit", { key: 'f4912e7af63e667a438d389a82cd4292fdcdaf7d', size: "icon", slot: "submit", color: "success", fill: "solid" })), h("smoothly-display", { key: 'fa69764806f0a1ba82cc066aedcc1ce9e18e0a50', type: "json", value: this.value })));
     }
     static get style() { return SmoothlyFormDemoPetStyle0; }
 }, [2, "smoothly-form-demo-pet", {
@@ -210,4 +210,4 @@ defineCustomElement();
 
 export { SmoothlyFormDemoPet as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-d0d172ed.js.map
+//# sourceMappingURL=p-58d5e72e.js.map

package/dist/components/{p-d0d172ed.js.map → p-58d5e72e.js.map}

@@ -1 +1 @@
-{"file":"p-d0d172ed.js","mappings":"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","names":[],"sources":["src/components/form/demo/pet/style.css?tag=smoothly-form-demo-pet&encapsulation=scoped","src/components/form/demo/pet/index.tsx"],"sourcesContent":["\n:host {\n\tdisplay: grid;\n\tgrid-template-columns: 2fr 1fr;\n\tgrid-template-rows: auto auto;\n\tgrid-column-gap: 2rem;\n}\n\n:host smoothly-input-checkbox[name=\"hasOwner\"],\n:host > smoothly-form smoothly-summary,\n:host > smoothly-form smoothly-tabs {\n\tflex-basis: 100%;\n}\n","import { Component, Fragment, h, Host, State, VNode } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\nimport { RGB } from \"../../../../model/Color/RGB\"\n\n@Component({\n\ttag: \"smoothly-form-demo-pet\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyFormDemoPet {\n\t@State() hasOwner = false\n\t@State() owner: {\n\t\tfirstName?: string\n\t\tlastName?: string\n\t\tbirthday?: string\n\t\townedRange?: isoly.DateRange\n\t\theight?: number\n\t\tfavoriteHat?: string\n\t\tfavoriteColor?: RGB\n\t\tfavoritePizza?: string\n\t\thasPet?: boolean\n\t} = {}\n\t@State() value: any\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Pet</h2>\n\t\t\t\t<h3>Value</h3>\n\t\t\t\t<smoothly-form\n\t\t\t\t\tlooks=\"border\"\n\t\t\t\t\tonSmoothlyFormSubmit={(e: CustomEvent) => alert(JSON.stringify(e.detail))}\n\t\t\t\t\tonSmoothlyFormInput={e => (this.value = { ...e.detail })}>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\t\tName\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"integer\" name=\"age\">\n\t\t\t\t\t\tAge (Years)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-checkbox\n\t\t\t\t\t\tname=\"hasOwner\"\n\t\t\t\t\t\tonSmoothlyInputLoad={e => e.stopPropagation()}\n\t\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\t\tthis.hasOwner = e.detail.hasOwner as boolean\n\t\t\t\t\t\t\te.stopPropagation()\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tHas Owner\n\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t{this.hasOwner && (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tname=\"owner.firstName\"\n\t\t\t\t\t\t\t\tvalue={this.owner.firstName}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, firstName: e.detail[\"owner.firstName\"] })}>\n\t\t\t\t\t\t\t\tOwner First Name\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tname=\"owner.lastName\"\n\t\t\t\t\t\t\t\tvalue={this.owner.lastName}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, lastName: e.detail[\"owner.lastName\"] })}>\n\t\t\t\t\t\t\t\tOwner Last Name\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t\t<smoothly-input-file name=\"owner.picture\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Owner picture</span>\n\t\t\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t\t\t<smoothly-input-date\n\t\t\t\t\t\t\t\tname=\"owner.birthday\"\n\t\t\t\t\t\t\t\tvalue={this.owner.birthday}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, birthday: e.detail[\"owner.birthday\"] })}>\n\t\t\t\t\t\t\t\tOwner birthday\n\t\t\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\t\t\tname=\"owner.ownedRange\"\n\t\t\t\t\t\t\t\tstart={this.owner.ownedRange?.start}\n\t\t\t\t\t\t\t\tend={this.owner.ownedRange?.end}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, ownedRange: e.detail[\"owner.ownedRange\"] })}>\n\t\t\t\t\t\t\t\tOwner ownedRange\n\t\t\t\t\t\t\t</smoothly-input-date-range>\n\t\t\t\t\t\t\t<smoothly-input-range\n\t\t\t\t\t\t\t\tname=\"owner.height\"\n\t\t\t\t\t\t\t\tstep={1}\n\t\t\t\t\t\t\t\tmax={250}\n\t\t\t\t\t\t\t\tvalue={this.owner.height}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, height: e.detail[\"owner.height\"] })}>\n\t\t\t\t\t\t\t\tOwner's Height\n\t\t\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t\t\t<smoothly-input-select name=\"owner.favoriteHat\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Owner's Favorite Hat</span>\n\t\t\t\t\t\t\t\t{[\"🎩 top hat\", \"🧢 cap\", \"👒 sun hat\", \"❌ none\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value={value} key={index} selected={this.owner.favoriteHat == value}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input-color\n\t\t\t\t\t\t\t\tname=\"owner.favoriteColor\"\n\t\t\t\t\t\t\t\tvalue={this.owner.favoriteColor ? RGB.toHex(this.owner.favoriteColor) : undefined}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, favoriteColor: e.detail[\"owner.favoriteColor\"] })}>\n\t\t\t\t\t\t\t\tOwner's Favorite Color\n\t\t\t\t\t\t\t</smoothly-input-color>\n\t\t\t\t\t\t\t<smoothly-input-radio\n\t\t\t\t\t\t\t\tname=\"owner.favoritePizza\"\n\t\t\t\t\t\t\t\tvalue={this.owner.favoritePizza}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e =>\n\t\t\t\t\t\t\t\t\t(this.owner = { ...this.owner, favoritePizza: e.detail[\"owner.favoritePizza\"] as string })\n\t\t\t\t\t\t\t\t}>\n\t\t\t\t\t\t\t\t<span slot=\"label\">Owner's Favorite Pizza</span>\n\t\t\t\t\t\t\t\t{[\"vesuvio\", \"capricciosa\", \"quattro formaggi\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-input-radio-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t\t\t<smoothly-input-checkbox\n\t\t\t\t\t\t\t\tname=\"owner.hasPet\"\n\t\t\t\t\t\t\t\tchecked={this.owner.hasPet}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, hasPet: e.detail[\"owner.hasPet\"] as boolean })}>\n\t\t\t\t\t\t\t\tHas Pet\n\t\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t)}\n\t\t\t\t\t<smoothly-summary>\n\t\t\t\t\t\t<span slot=\"summary\">Summary</span>\n\t\t\t\t\t\t<div slot=\"content\">\n\t\t\t\t\t\t\t<smoothly-input type=\"price\" name=\"summary.price\" currency=\"EUR\">\n\t\t\t\t\t\t\t\tSummary Price\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t\t<smoothly-input-file name=\"summary.picture\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Summary picture</span>\n\t\t\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t\t\t<smoothly-input-date name=\"summary.birthday\">Summary birthday</smoothly-input-date>\n\t\t\t\t\t\t\t<smoothly-input-date-range name=\"summary.ownedRange\">Summary ownedRange</smoothly-input-date-range>\n\t\t\t\t\t\t\t<smoothly-input-range name=\"summary.height\" label={\"Height\"} />\n\t\t\t\t\t\t\t<smoothly-input-select name=\"summary.favoriteHat\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Summary's Favorite Hat</span>\n\t\t\t\t\t\t\t\t{[\"🎩 top hat\", \"🧢 cap\", \"👒 sun hat\", \"❌ none\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input-month name=\"summary.month\">\n\t\t\t\t\t\t\t\t<span slot={\"month-label\"}>Summary month</span>\n\t\t\t\t\t\t\t</smoothly-input-month>\n\t\t\t\t\t\t\t<smoothly-input-color name=\"summary.color\">Summary Color</smoothly-input-color>\n\t\t\t\t\t\t\t<smoothly-input-radio name=\"summary.favoritePizza\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Summary's Favorite Pizza</span>\n\t\t\t\t\t\t\t\t{[\"vesuvio\", \"capricciosa\", \"quattro formaggi\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-input-radio-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t\t\t<smoothly-input-checkbox name=\"summary.hasPet\">Has Pet</smoothly-input-checkbox>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-tabs>\n\t\t\t\t\t\t<smoothly-tab label=\"Dog\">\n\t\t\t\t\t\t\t<smoothly-input type={\"text\"} name=\"dog.breed\">\n\t\t\t\t\t\t\t\tBreed\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t\t<smoothly-input-file name=\"dog.picture\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Dog picture</span>\n\t\t\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t\t\t<smoothly-input-date name=\"dog.birthday\">Dog birthday</smoothly-input-date>\n\t\t\t\t\t\t\t<smoothly-input-date-range name=\"dog.dateRange\">Dog date range</smoothly-input-date-range>\n\t\t\t\t\t\t\t<smoothly-input-select name=\"dog.favoriteHat\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Dog's Favorite Hat</span>\n\t\t\t\t\t\t\t\t{[\"🎩 top hat\", \"🧢 cap\", \"👒 sun hat\", \"❌ none\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input-color name=\"dog.favoriteColor\">Dog's Favorite Color</smoothly-input-color>\n\t\t\t\t\t\t\t<smoothly-input-radio name=\"dog.favoritePizza\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Dog's Favorite Pizza</span>\n\t\t\t\t\t\t\t\t{[\"vesuvio\", \"capricciosa\", \"quattro formaggi\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-input-radio-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t\t\t<smoothly-input-checkbox name=\"dog.hasPet\">Has Pet</smoothly-input-checkbox>\n\t\t\t\t\t\t</smoothly-tab>\n\t\t\t\t\t\t<smoothly-tab label=\"Cat\" open>\n\t\t\t\t\t\t\t<smoothly-input name={\"cat.favoriteFood\"}>Favorite Food</smoothly-input>\n\t\t\t\t\t\t</smoothly-tab>\n\t\t\t\t\t</smoothly-tabs>\n\t\t\t\t\t<smoothly-input-submit size=\"icon\" slot=\"submit\" color=\"success\" fill=\"solid\" />\n\t\t\t\t</smoothly-form>\n\t\t\t\t<smoothly-display type=\"json\" value={this.value} />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"p-58d5e72e.js","mappings":"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","names":[],"sources":["src/components/form/demo/pet/style.css?tag=smoothly-form-demo-pet&encapsulation=scoped","src/components/form/demo/pet/index.tsx"],"sourcesContent":["\n:host {\n\tdisplay: grid;\n\tgrid-template-columns: 2fr 1fr;\n\tgrid-template-rows: auto auto;\n\tgrid-column-gap: 2rem;\n}\n\n:host smoothly-input-checkbox[name=\"hasOwner\"],\n:host > smoothly-form smoothly-summary,\n:host > smoothly-form smoothly-tabs {\n\tflex-basis: 100%;\n}\n","import { Component, Fragment, h, Host, State, VNode } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\nimport { RGB } from \"../../../../model/Color/RGB\"\n\n@Component({\n\ttag: \"smoothly-form-demo-pet\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyFormDemoPet {\n\t@State() hasOwner = false\n\t@State() owner: {\n\t\tfirstName?: string\n\t\tlastName?: string\n\t\tbirthday?: string\n\t\townedRange?: isoly.DateRange\n\t\theight?: number\n\t\tfavoriteHat?: string\n\t\tfavoriteColor?: RGB\n\t\tfavoritePizza?: string\n\t\thasPet?: boolean\n\t} = {}\n\t@State() value: any\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<h2>Pet</h2>\n\t\t\t\t<h3>Value</h3>\n\t\t\t\t<smoothly-form\n\t\t\t\t\tlooks=\"border\"\n\t\t\t\t\tonSmoothlyFormSubmit={(e: CustomEvent) => alert(JSON.stringify(e.detail))}\n\t\t\t\t\tonSmoothlyFormInput={e => (this.value = { ...e.detail })}>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\t\tName\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"integer\" name=\"age\">\n\t\t\t\t\t\tAge (Years)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input-checkbox\n\t\t\t\t\t\tname=\"hasOwner\"\n\t\t\t\t\t\tonSmoothlyInputLoad={e => e.stopPropagation()}\n\t\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\t\tthis.hasOwner = e.detail.hasOwner as boolean\n\t\t\t\t\t\t\te.stopPropagation()\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tHas Owner\n\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t{this.hasOwner && (\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tname=\"owner.firstName\"\n\t\t\t\t\t\t\t\tvalue={this.owner.firstName}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, firstName: e.detail[\"owner.firstName\"] })}>\n\t\t\t\t\t\t\t\tOwner First Name\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tname=\"owner.lastName\"\n\t\t\t\t\t\t\t\tvalue={this.owner.lastName}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, lastName: e.detail[\"owner.lastName\"] })}>\n\t\t\t\t\t\t\t\tOwner Last Name\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t\t<smoothly-input-file name=\"owner.picture\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Owner picture</span>\n\t\t\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t\t\t<smoothly-input-date\n\t\t\t\t\t\t\t\tname=\"owner.birthday\"\n\t\t\t\t\t\t\t\tvalue={this.owner.birthday}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, birthday: e.detail[\"owner.birthday\"] })}>\n\t\t\t\t\t\t\t\tOwner birthday\n\t\t\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\t\t\tname=\"owner.ownedRange\"\n\t\t\t\t\t\t\t\tstart={this.owner.ownedRange?.start}\n\t\t\t\t\t\t\t\tend={this.owner.ownedRange?.end}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, ownedRange: e.detail[\"owner.ownedRange\"] })}>\n\t\t\t\t\t\t\t\tOwner ownedRange\n\t\t\t\t\t\t\t</smoothly-input-date-range>\n\t\t\t\t\t\t\t<smoothly-input-range\n\t\t\t\t\t\t\t\tname=\"owner.height\"\n\t\t\t\t\t\t\t\tstep={1}\n\t\t\t\t\t\t\t\tmax={250}\n\t\t\t\t\t\t\t\tvalue={this.owner.height}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, height: e.detail[\"owner.height\"] })}>\n\t\t\t\t\t\t\t\tOwner's Height\n\t\t\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t\t\t<smoothly-input-select name=\"owner.favoriteHat\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Owner's Favorite Hat</span>\n\t\t\t\t\t\t\t\t{[\"🎩 top hat\", \"🧢 cap\", \"👒 sun hat\", \"❌ none\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value={value} key={index} selected={this.owner.favoriteHat == value}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input-color\n\t\t\t\t\t\t\t\tname=\"owner.favoriteColor\"\n\t\t\t\t\t\t\t\tvalue={this.owner.favoriteColor ? RGB.toHex(this.owner.favoriteColor) : undefined}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, favoriteColor: e.detail[\"owner.favoriteColor\"] })}>\n\t\t\t\t\t\t\t\tOwner's Favorite Color\n\t\t\t\t\t\t\t</smoothly-input-color>\n\t\t\t\t\t\t\t<smoothly-input-radio\n\t\t\t\t\t\t\t\tname=\"owner.favoritePizza\"\n\t\t\t\t\t\t\t\tvalue={this.owner.favoritePizza}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e =>\n\t\t\t\t\t\t\t\t\t(this.owner = { ...this.owner, favoritePizza: e.detail[\"owner.favoritePizza\"] as string })\n\t\t\t\t\t\t\t\t}>\n\t\t\t\t\t\t\t\t<span slot=\"label\">Owner's Favorite Pizza</span>\n\t\t\t\t\t\t\t\t{[\"vesuvio\", \"capricciosa\", \"quattro formaggi\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-input-radio-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t\t\t<smoothly-input-checkbox\n\t\t\t\t\t\t\t\tname=\"owner.hasPet\"\n\t\t\t\t\t\t\t\tchecked={this.owner.hasPet}\n\t\t\t\t\t\t\t\tonSmoothlyInput={e => (this.owner = { ...this.owner, hasPet: e.detail[\"owner.hasPet\"] as boolean })}>\n\t\t\t\t\t\t\t\tHas Pet\n\t\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t)}\n\t\t\t\t\t<smoothly-summary>\n\t\t\t\t\t\t<span slot=\"summary\">Summary</span>\n\t\t\t\t\t\t<div slot=\"content\">\n\t\t\t\t\t\t\t<smoothly-input type=\"price\" name=\"summary.price\" currency=\"EUR\">\n\t\t\t\t\t\t\t\tSummary Price\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t\t<smoothly-input-file name=\"summary.picture\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Summary picture</span>\n\t\t\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t\t\t<smoothly-input-date name=\"summary.birthday\">Summary birthday</smoothly-input-date>\n\t\t\t\t\t\t\t<smoothly-input-date-range name=\"summary.ownedRange\">Summary ownedRange</smoothly-input-date-range>\n\t\t\t\t\t\t\t<smoothly-input-range name=\"summary.height\" label={\"Height\"} />\n\t\t\t\t\t\t\t<smoothly-input-select name=\"summary.favoriteHat\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Summary's Favorite Hat</span>\n\t\t\t\t\t\t\t\t{[\"🎩 top hat\", \"🧢 cap\", \"👒 sun hat\", \"❌ none\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input-month name=\"summary.month\">\n\t\t\t\t\t\t\t\t<span slot={\"month-label\"}>Summary month</span>\n\t\t\t\t\t\t\t</smoothly-input-month>\n\t\t\t\t\t\t\t<smoothly-input-color name=\"summary.color\">Summary Color</smoothly-input-color>\n\t\t\t\t\t\t\t<smoothly-input-radio name=\"summary.favoritePizza\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Summary's Favorite Pizza</span>\n\t\t\t\t\t\t\t\t{[\"vesuvio\", \"capricciosa\", \"quattro formaggi\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-input-radio-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t\t\t<smoothly-input-checkbox name=\"summary.hasPet\">Has Pet</smoothly-input-checkbox>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</smoothly-summary>\n\t\t\t\t\t<smoothly-tabs>\n\t\t\t\t\t\t<smoothly-tab label=\"Dog\">\n\t\t\t\t\t\t\t<smoothly-input type={\"text\"} name=\"dog.breed\">\n\t\t\t\t\t\t\t\tBreed\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t\t<smoothly-input-file name=\"dog.picture\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Dog picture</span>\n\t\t\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t\t\t<smoothly-input-date name=\"dog.birthday\">Dog birthday</smoothly-input-date>\n\t\t\t\t\t\t\t<smoothly-input-date-range name=\"dog.dateRange\">Dog date range</smoothly-input-date-range>\n\t\t\t\t\t\t\t<smoothly-input-select name=\"dog.favoriteHat\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Dog's Favorite Hat</span>\n\t\t\t\t\t\t\t\t{[\"🎩 top hat\", \"🧢 cap\", \"👒 sun hat\", \"❌ none\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input-color name=\"dog.favoriteColor\">Dog's Favorite Color</smoothly-input-color>\n\t\t\t\t\t\t\t<smoothly-input-radio name=\"dog.favoritePizza\">\n\t\t\t\t\t\t\t\t<span slot=\"label\">Dog's Favorite Pizza</span>\n\t\t\t\t\t\t\t\t{[\"vesuvio\", \"capricciosa\", \"quattro formaggi\"].map((value, index) => (\n\t\t\t\t\t\t\t\t\t<smoothly-input-radio-item value={value} key={index}>\n\t\t\t\t\t\t\t\t\t\t{value}\n\t\t\t\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t\t\t<smoothly-input-checkbox name=\"dog.hasPet\">Has Pet</smoothly-input-checkbox>\n\t\t\t\t\t\t</smoothly-tab>\n\t\t\t\t\t\t<smoothly-tab label=\"Cat\" open>\n\t\t\t\t\t\t\t<smoothly-input name={\"cat.favoriteFood\"}>Favorite Food</smoothly-input>\n\t\t\t\t\t\t</smoothly-tab>\n\t\t\t\t\t</smoothly-tabs>\n\t\t\t\t\t<smoothly-input-submit size=\"icon\" slot=\"submit\" color=\"success\" fill=\"solid\" />\n\t\t\t\t</smoothly-form>\n\t\t\t\t<smoothly-display type=\"json\" value={this.value} />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-9088d27f.js → p-5bf952c5.js}

@@ -1,10 +1,13 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f765921a.js';
 import { T as Type } from './p-d471066b.js';
+import { D as Data } from './p-8e1e509d.js';
+import './p-390767c7.js';
+import './p-47ea6b68.js';
 import { E as Editable } from './p-b0d7a2e6.js';
 import { S as Submittable } from './p-66744584.js';
 import { d as defineCustomElement$3 } from './p-7d0eafb0.js';
-import { d as defineCustomElement$2 } from './p-8e13449b.js';
-import { d as defineCustomElement$1 } from './p-8e748704.js';
+import { d as defineCustomElement$2 } from './p-cb083b20.js';
+import { d as defineCustomElement$1 } from './p-7f7c4cf3.js';
 
 const styleCss = "[color=default].sc-smoothly-input-submit{--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-submit{--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-submit{--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-submit{--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-submit{--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-submit{--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-submit{--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-submit{--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-submit{--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-submit{--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-submit-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-submit-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-submit-h{display:inline}[disabled].sc-smoothly-input-submit-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-submit-h>a.sc-smoothly-input-submit,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{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-submit-h>a.sc-smoothly-input-submit:empty,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:empty{border-width:0}.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-submit-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-submit{padding:0.8em;min-width:8em}.sc-smoothly-input-submit-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-submit{padding:0.6em}[size=icon].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{padding:0.5em}[type=button].sc-smoothly-input-submit-h>a.sc-smoothly-input-submit{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-size:100%}[size=large].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{font-size:130%}.sc-smoothly-input-submit-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-submit-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-submit-h{width:100%}[expand=full].sc-smoothly-input-submit-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit{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-submit-h:not([fill=clear])>button.sc-smoothly-input-submit:hover,.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:focus-visible,[fill=outline].sc-smoothly-input-submit-h:active>button.sc-smoothly-input-submit::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:hover::before,[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit:focus-within::before,[fill=outline].sc-smoothly-input-submit-h>button.sc-smoothly-input-submit: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-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:hover,.sc-smoothly-input-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:focus-visible,.sc-smoothly-input-submit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-submit:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-submit-h>button.sc-smoothly-input-submit,.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-icon,.sc-smoothly-input-submit-h .sc-smoothly-input-submit-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-submit-h{display:none}.sc-smoothly-input-submit-h{display:flex}.sc-smoothly-input-submit-h:not([display]){display:none}.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-button button>*+smoothly-icon,.sc-smoothly-input-submit-h.sc-smoothly-input-submit-s>smoothly-button-confirm button>*+smoothly-icon{display:none}[disabled].sc-smoothly-input-submit-h{cursor:not-allowed}";
 const SmoothlyInputSubmitStyle0 = styleCss;
@@ -35,7 +38,7 @@ const SmoothlyInputSubmit = proxyCustomElement(class SmoothlyInputSubmit extends
                     this.disabled =
                         !this.delete &&
                             (p.readonly ||
-                                ("validator" in p && p.validator instanceof Type && !((_a = p.validator) === null || _a === void 0 ? void 0 : _a.is(p.value))) ||
+                                ("validator" in p && p.validator instanceof Type && !((_a = p.validator) === null || _a === void 0 ? void 0 : _a.is(Data.convertArrays(p.value)))) ||
                                 !p.changed);
                 });
             }
@@ -47,7 +50,7 @@ const SmoothlyInputSubmit = proxyCustomElement(class SmoothlyInputSubmit extends
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: '33df276e2d84fe4f5919d32837ba35239c8ac8e2', title: this.toolTip }, this.delete == true ? (h("smoothly-button-confirm", { size: this.size, shape: this.shape, expand: this.expand, color: (_a = this.color) !== null && _a !== void 0 ? _a : "danger", fill: this.fill, onSmoothlyConfirm: () => this.clickHandler() }, h("slot", null), h("smoothly-icon", { name: "trash-outline", fill: "solid", size: "tiny" }))) : (h("smoothly-button", { disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: (_b = this.color) !== null && _b !== void 0 ? _b : "success", fill: this.fill, onClick: () => this.clickHandler() }, h("slot", null), this.icon && h("smoothly-icon", { name: this.icon, fill: "solid", size: "tiny" })))));
+        return (h(Host, { key: 'f659d9fcff6418ed79a26b588a0b2392a85affa2', title: this.toolTip }, this.delete == true ? (h("smoothly-button-confirm", { size: this.size, shape: this.shape, expand: this.expand, color: (_a = this.color) !== null && _a !== void 0 ? _a : "danger", fill: this.fill, onSmoothlyConfirm: () => this.clickHandler() }, h("slot", null), h("smoothly-icon", { name: "trash-outline", fill: "solid", size: "tiny" }))) : (h("smoothly-button", { disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: (_b = this.color) !== null && _b !== void 0 ? _b : "success", fill: this.fill, onClick: () => this.clickHandler() }, h("slot", null), this.icon && h("smoothly-icon", { name: this.icon, fill: "solid", size: "tiny" })))));
     }
     static get style() { return SmoothlyInputSubmitStyle0; }
 }, [6, "smoothly-input-submit", {
@@ -94,4 +97,4 @@ defineCustomElement();
 
 export { SmoothlyInputSubmit as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-9088d27f.js.map
+//# sourceMappingURL=p-5bf952c5.js.map

package/dist/components/p-5bf952c5.js.map

@@ -0,0 +1 @@
+{"file":"p-5bf952c5.js","mappings":";;;;;;;;;;;AAAA,MAAM,QAAQ,GAAG,6nNAA6nN,CAAC;AAC/oN,kCAAe,QAAQ;;MCUV,mBAAmB;;;;;sBAEG,KAAK;;oBAEV,mBAAmB;;;wBAGG,KAAK;uBACN,KAAK;;oBAEkB,MAAM;uBAC7D,IAAI,CAAC,MAAM,GAAG,QAAQ,GAAG,QAAQ;;IAEnD,iBAAiB;QAChB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,MAAM;YACjC,IAAI,WAAW,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE;gBACvD,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;gBACpB,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,OAAM,CAAC;;oBAC/B,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAA;oBAC1B,IAAI,CAAC,QAAQ;wBACZ,CAAC,IAAI,CAAC,MAAM;6BACX,CAAC,CAAC,QAAQ;iCACT,WAAW,IAAI,CAAC,IAAI,CAAC,CAAC,SAAS,YAAYA,IAAS,IAAI,EAAC,MAAA,CAAC,CAAC,SAAS,0CAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAA,CAAC;gCACvG,CAAC,CAAC,CAAC,OAAO,CAAC,CAAA;iBACb,CAAC,CAAA;aACF;SACD,CAAC,CAAA;KACF;IACD,YAAY;;QACX,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;KAChC;IAED,MAAM;;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,OAAO,IACvB,IAAI,CAAC,MAAM,IAAI,IAAI,IACnB,+BACC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,MAAA,IAAI,CAAC,KAAK,mCAAI,QAAQ,EAC7B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,iBAAiB,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,IAC5C,eAAQ,EACR,qBAAe,IAAI,EAAC,eAAe,EAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,MAAM,GAAG,CACtC,KAE1B,uBACC,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,MAAA,IAAI,CAAC,KAAK,mCAAI,SAAS,EAC9B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,IAClC,eAAQ,EACP,IAAI,CAAC,IAAI,IAAI,qBAAe,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,MAAM,GAAG,CACxD,CAClB,CACK,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["isly.Type"],"sources":["src/components/input/submit/style.css?tag=smoothly-input-submit&encapsulation=scoped","src/components/input/submit/index.tsx"],"sourcesContent":["@import \"../../button/style.css\"; \n\n:host {\n\tdisplay: flex;\n}\n\n:host(:not([display])) {\n\tdisplay: none;\n}\n\n:host::slotted(smoothly-button button > * > * + smoothly-icon),\n:host::slotted(smoothly-button-confirm button > * > * + smoothly-icon) {\n\tdisplay: none;\n}\n\n:host([disabled]) {\n\tcursor: not-allowed\n}\n","import { Component, ComponentWillLoad, Event, EventEmitter, h, Host, Prop, VNode } from \"@stencil/core\"\nimport { isly } from \"isly\"\nimport { Color, Data, Fill, Icon } from \"../../../model\"\nimport { Editable } from \"../Editable\"\nimport { Submittable } from \"../Submittable\"\n\n@Component({\n\ttag: \"smoothly-input-submit\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputSubmit implements ComponentWillLoad {\n\tprivate parent?: Submittable & Editable\n\t@Prop({ reflect: true }) delete = false\n\t@Prop() color?: Color\n\t@Prop() icon: Icon | false = \"checkmark-outline\"\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, mutable: true }) display = false\n\t@Prop({ reflect: true }) shape?: \"rounded\"\n\t@Prop({ reflect: true }) size: \"flexible\" | \"small\" | \"large\" | \"icon\" = \"icon\"\n\t@Prop() toolTip = this.delete ? \"Remove\" : \"Submit\"\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: Editable) => void>\n\tcomponentWillLoad(): void {\n\t\tthis.smoothlyInputLoad.emit(parent => {\n\t\t\tif (Submittable.is(parent) && Editable.type.is(parent)) {\n\t\t\t\tthis.parent = parent\n\t\t\t\tparent.listen(\"changed\", async p => {\n\t\t\t\t\tthis.display = !p.readonly\n\t\t\t\t\tthis.disabled =\n\t\t\t\t\t\t!this.delete &&\n\t\t\t\t\t\t(p.readonly ||\n\t\t\t\t\t\t\t(\"validator\" in p && p.validator instanceof isly.Type && !p.validator?.is(Data.convertArrays(p.value))) ||\n\t\t\t\t\t\t\t!p.changed)\n\t\t\t\t})\n\t\t\t}\n\t\t})\n\t}\n\tclickHandler() {\n\t\tthis.parent?.submit(this.delete)\n\t}\n\n\trender(): VNode | VNode[] {\n\t\treturn (\n\t\t\t<Host title={this.toolTip}>\n\t\t\t\t{this.delete == true ? (\n\t\t\t\t\t<smoothly-button-confirm\n\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\tshape={this.shape}\n\t\t\t\t\t\texpand={this.expand}\n\t\t\t\t\t\tcolor={this.color ?? \"danger\"}\n\t\t\t\t\t\tfill={this.fill}\n\t\t\t\t\t\tonSmoothlyConfirm={() => this.clickHandler()}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t<smoothly-icon name=\"trash-outline\" fill=\"solid\" size=\"tiny\" />\n\t\t\t\t\t</smoothly-button-confirm>\n\t\t\t\t) : (\n\t\t\t\t\t<smoothly-button\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\ttype={\"button\"}\n\t\t\t\t\t\tshape={this.shape}\n\t\t\t\t\t\texpand={this.expand}\n\t\t\t\t\t\tcolor={this.color ?? \"success\"}\n\t\t\t\t\t\tfill={this.fill}\n\t\t\t\t\t\tonClick={() => this.clickHandler()}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t{this.icon && <smoothly-icon name={this.icon} fill=\"solid\" size=\"tiny\" />}\n\t\t\t\t\t</smoothly-button>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-df19616b.js → p-5da33c08.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-062a6fe4.js';
+import { d as defineCustomElement$1 } from './p-0c8bbdc3.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: '6d3776a5b82bcd822ce9e144d567125b753981d8' }, h("slot", { key: 'cf51537136436b81f1998409b95cf2eef163ad34', name: "before" }), h("smoothly-load-more", { key: '3a3ab2f1da07dfee6852171e9d6c247654960f94', onSmoothlyLoadMore: e => this.loadMoreHandler(e) }), this.show && (typeof this.content == "function" ? h(this.content, null) : this.content), h("slot", { key: '790b1f9ee1cabcfb3ef99003594cd092228d8e0c' })));
+        return (h(Host, { key: 'de115abe3101a1fa5d32e3ae3cef919afca90ea4' }, h("slot", { key: '61aa5f412fbbeca1c1b2f9bafde7d87bca0a94b9', name: "before" }), h("smoothly-load-more", { key: '6c3bd20f8f1b0d2b8900dcbb640f33dd76c7452a', onSmoothlyLoadMore: e => this.loadMoreHandler(e) }), this.show && (typeof this.content == "function" ? h(this.content, null) : this.content), h("slot", { key: 'f0b6bd381a12f5270797494a6eb414c38763e5fd' })));
     }
     static get style() { return SmoothlyLazyStyle0; }
 }, [6, "smoothly-lazy", {
@@ -45,4 +45,4 @@ defineCustomElement();
 
 export { SmoothlyLazy as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-df19616b.js.map
+//# sourceMappingURL=p-5da33c08.js.map

package/dist/components/{p-df19616b.js.map → p-5da33c08.js.map}

@@ -1 +1 @@
-{"file":"p-df19616b.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-5da33c08.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}