npm - smoothly - Versions diffs - 1.2.1-alpha.48 → 1.2.1-alpha.49 - Mend

smoothly 1.2.1-alpha.48 → 1.2.1-alpha.49

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (431) hide show

package/dist/components/{p-971ff797.js.map → p-0ea6c8fd.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-971ff797.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,MAAM,QAAQ,GAAG,6sCAA6sC,CAAC;AAC/tC,4CAAe,QAAQ;;MCUV,iBAAiB;;;;wBACa,EAAE;;wBAET,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC;;IAE3D,cAAc,CAAC,KAAwC;QACtD,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAA;KAC5B;IAED,oBAAoB,CAAC,KAAuC;QAC3D,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAA;KAClD;IAED,MAAM,iBAAiB;QACtB,MAAM,QAAQ,GAAG,MAAMA,KAAU,CAAC,uCAAuC,CAAC,CAAA;QAC1E,IAAI,CAAC,IAAI;YACR,QAAQ,CAAC,MAAM,IAAI,GAAG;gBACtB,CAAC,MAAM,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,GAAQ;;oBAAK,wCACzC,GAAG,KACN,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAC9D,MAAM,kCAAO,GAAG,KAAE,KAAK,EAAE,MAAA,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,mCAAI,EAAE,KACjD,KAAK,EAAE,MAAA,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,mCAAI,EAAE,KAC9B;iBAAA,CAAC,CAAA;KACJ;IAED,MAAM;QACL,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAIC,MAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,CAAA;QACtE,QACC,EAAC,IAAI,uDACJ,yEAAkB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,UAAU,GAAG,EACjD,0EACC,+EACC,UAAU,EAAE,EAAE,CAAC,gBAAgB,GAAG,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,EACvD,IAAI,EAAC,KAAK,EACV,OAAO,EAAC,eAAe,EACvB,IAAI,EAAC,KAAK,GACT,EACF,+EACC,UAAU,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,EAC5C,IAAI,EAAC,KAAK,EACV,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,KAAK,GACT,EACF,+EACC,UAAU,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,EACjD,IAAI,EAAC,iBAAiB,EACtB,OAAO,EAAC,mBAAmB,EAC3B,IAAI,EAAC,KAAK,GACT,EACF,+EACC,UAAU,EAAE,EAAE,OAAO,EAAE,YAAY,EAAE,EACrC,GAAG,QACH,MAAM,QACN,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,cAAc,EACtB,IAAI,EAAC,KAAK,GACT,EACF,+EAAwB,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,aAAa,EAAC,IAAI,EAAC,KAAK,EAAC,QAAQ,EAAE,KAAK,IACxG,IAAI,CAAC,IAAI;YACT,MAAM,CAAC,MAAM,CACZ,IAAI,CAAC,IAAI,CAAC,MAAM,CACf,CAAC,CAAC,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,mCAAQ,CAAC,KAAE,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,GAAG,GAAG,MAAK,CAAC,CAAC,EAC/D,EAAE,CACF,CACD,CAAC,GAAG,CACJ,GAAG;;gBACF,OAAA,CAAA,MAAA,GAAG,CAAC,MAAM,0CAAE,IAAI,MACf,qBAAe,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,IAAI,IAChD,GAAG,CAAC,MAAM,CAAC,IAAI,CACD,CAChB,CAAA;aAAA,CACF,CACsB,EACzB,4DAAK,IAAI,EAAC,QAAQ,IACjB,sEAAe,KAAK,EAAC,QAAQ,IAC5B,+EAAwB,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,aAAa,EAAC,QAAQ,UACtF,IAAI,CAAC,IAAI;YACT,MAAM,CAAC,MAAM,CACZ,IAAI,CAAC,IAAI,CAAC,MAAM,CACf,CAAC,CAAC,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,mCAAQ,CAAC,KAAE,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,GAAG,GAAG,MAAK,CAAC,CAAC,EAC/D,EAAE,CACF,CACD,CAAC,GAAG,CACJ,GAAG;;gBACF,OAAA,CAAA,MAAA,GAAG,CAAC,MAAM,0CAAE,IAAI,MACf,qBAAe,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,IAAI,IAChD,GAAG,CAAC,MAAM,CAAC,IAAI,CACD,CAChB,CAAA;aAAA,CACF,CACsB,EACzB,+EAAwB,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAC,OAAO,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,EAAE,KAAK,IACxF,IAAI,CAAC,IAAI;YACT,MAAM,CAAC,MAAM,CACZ,IAAI,CAAC,IAAI,CAAC,MAAM,CAAsB,CAAC,CAAC,EAAE,GAAG,MAAM,GAAG,CAAC,KAAK,mCAAQ,CAAC,KAAE,CAAC,GAAG,CAAC,KAAK,GAAG,GAAG,MAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CACnG,CAAC,GAAG,CACJ,GAAG,IACF,GAAG,CAAC,KAAK,KACR,qBAAe,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,GAAG,CAAC,KAAK,IAC1C,GAAG,CAAC,KAAK,CACK,CAChB,CACF,CACsB,EACzB,+EACC,UAAU,EAAC,QAAQ,EACnB,KAAK,EAAC,OAAO,EACb,QAAQ,EAAC,cAAc,EACvB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,OAAO,IACX,MAAM,CAAC,IAAI,CACX,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC;aAClB,IAAI,EAAE;aACN,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,sCAAW,CAAC,KAAE,CAAC,IAAI,GAAG,IAAI,IAAG,EAAE,EAAE,CAAC,CACnD,CAAC,OAAO,CAAC,IAAI,KACb,qBAAe,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,IAAI,IACrC,IAAI,CACU,CAChB,CAAC,CACsB,EACzB,8EAAuB,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,MAAM,GAAG,EACtD,8EAAuB,KAAK,EAAC,aAAa,EAAC,QAAQ,EAAC,aAAa,GAAG,CACrD,CACX,CACW,EACjB,CAAC,IAAI,IACL,sBAAsB,KAEtB,2BAAqB,OAAO,EAAE,CAAC,IAC9B,oCACC,mCACC,oCAA2B,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAA4B,EACjF,4CAA0D,EAC1D,2CAAyD,EACzD,4CAA0D,CACjC,CACA,EAC1B,IAAI,CAAC,GAAG,CAAC,GAAG,KACZ,mCACC,oCAA2B,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,CAAC,CAA4B,EAChF,+CACE,GAAG,CAAC,KAAK,EACV,WAAK,IAAI,EAAC,QAAQ,iBAAW,GAAG,CAAC,OAAO,CAAO,CACV,EACtC,+CACE,GAAG,CAAC,IAAI,EACT,WAAK,IAAI,EAAC,QAAQ,iBAAW,GAAG,CAAC,OAAO,CAAO,CACV,EACtC,oCACC,wBAAkB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAC,KAAK,GAAoB,CACzD,CACF,CAC1B,CAAC,EACF,oCACC,mCACC,gCAA0B,IAAI,EAAE,CAAC,IAChC,wBACC,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,aACN,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC,MAAM,GAAG,GAC3F,EAAE,GAAqB,CACE,CACF,CACA,CACN,CACtB,CACK,EACP;KACD;;;;;;;AAEF,MAAM,KAAK,GAA6B;IACvC,eAAe,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC;IACxD,SAAS,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,CAAC;IACxD,gBAAgB,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC;IAC7D,MAAM,EAAE,CAAC,WAAW,EAAE,WAAW,EAAE,YAAY,CAAC;CAChD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["http.fetch","selectively.filter"],"sources":["src/components/next/demo/filtered/style.css?tag=smoothly-next-table-demo-filtered&encapsulation=scoped","src/components/next/demo/filtered/index.tsx"],"sourcesContent":[":host {\n\tdisplay: grid;\n\tgrid-template-columns: auto auto;\n\tgrid-template-areas:\n\t\t\"header filter\"\n\t\t\"main main\";\n\tmargin-bottom: 50em;\n}\n\n:host>smoothly-display {\n\tfont-size: 2em;\n\tgrid-area: header;\n}\n\n:host>smoothly-filter {\n\tmargin-left: auto;\n\tgrid-area: filter;\n\theight: fit-content;\n}\n\n:host>* {\n\tmargin-bottom: 2rem;\n\tgrid-area: main;\n}\n\n:host>smoothly-next-table {\n\tgrid-template-columns: min-content repeat(calc(var(--columns) - 1), auto);\n}\n\nsmoothly-next-table>smoothly-next-table-row>smoothly-next-table-cell:nth-of-type(2),\n:host>smoothly-next-table>smoothly-next-table-head>smoothly-next-table-row>smoothly-next-table-cell:nth-of-type(4) {\n\tjustify-content: end;\n}\n","import { Component, ComponentWillLoad, h, Host, Listen, State } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\nimport { http } from \"cloudly-http\"\nimport { Selector } from \"../../../table/Selector\"\nimport { Cat } from \"./Root\"\n\n@Component({\n\ttag: \"smoothly-next-table-demo-filtered\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class TableDemoFiltered implements ComponentWillLoad {\n\t@State() criteria: selectively.Criteria = {}\n\t@State() cats?: Cat[] \| false\n\t@State() selector: Selector<Cat> = Selector.create(\"breed\")\n\t@Listen(\"smoothlyFilter\")\n\tonFilterUpdate(event: CustomEvent<selectively.Criteria>) {\n\t\tevent.stopPropagation()\n\t\tthis.criteria = event.detail\n\t}\n\t@Listen(\"smoothlyInput\")\n\tsmoothlyInputHandler(event: CustomEvent<Record<string, any>>) {\n\t\tevent.stopPropagation()\n\t\tthis.selector = this.selector.handle(event.detail)\n\t}\n\n\tasync componentWillLoad(): Promise<void> {\n\t\tconst response = await http.fetch(\"https://catfact.ninja/breeds?limit=15\")\n\t\tthis.cats =\n\t\t\tresponse.status == 200 &&\n\t\t\t(await response.body).data.map((cat: any) => ({\n\t\t\t\t...cat,\n\t\t\t\tprice: [...cat.breed].reduce((r, c) => r + c.charCodeAt(0), 0),\n\t\t\t\tnested: { ...cat, names: names[cat.country] ?? [] },\n\t\t\t\tnames: names[cat.country] ?? [],\n\t\t\t}))\n\t}\n\n\trender() {\n\t\tconst cats = this.cats && selectively.filter(this.criteria, this.cats)\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-display type=\"text\" value=\"Filtered\" />\n\t\t\t\t<smoothly-filter>\n\t\t\t\t\t<smoothly-filter-toggle\n\t\t\t\t\t\tproperties={{ [\"nested.pattern\"]: \"Ticked\", breed: \"\" }}\n\t\t\t\t\t\ticon=\"add\"\n\t\t\t\t\t\ttoolTip=\"Nested Ticked\"\n\t\t\t\t\t\tslot=\"bar\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-filter-toggle\n\t\t\t\t\t\tproperties={{ pattern: \"Ticked\", breed: \"\" }}\n\t\t\t\t\t\ticon=\"paw\"\n\t\t\t\t\t\ttoolTip=\"Ticked cats\"\n\t\t\t\t\t\tslot=\"bar\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-filter-toggle\n\t\t\t\t\t\tproperties={{ breed: \"Bombay\", pattern: \"Solid\" }}\n\t\t\t\t\t\ticon=\"radio-button-on\"\n\t\t\t\t\t\ttoolTip=\"Solid bombay cats\"\n\t\t\t\t\t\tslot=\"bar\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-filter-toggle\n\t\t\t\t\t\tproperties={{ pattern: \"Colorpoint\" }}\n\t\t\t\t\t\tnot\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon=\"alert\"\n\t\t\t\t\t\ttoolTip=\"Colored cats\"\n\t\t\t\t\t\tslot=\"bar\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-filter-select menuHeight=\"5items\" label=\"coat\" property=\"nested.coat\" slot=\"bar\" multiple={false}>\n\t\t\t\t\t\t{this.cats &&\n\t\t\t\t\t\t\tObject.values(\n\t\t\t\t\t\t\t\tthis.cats.reduce<Record<string, Cat>>(\n\t\t\t\t\t\t\t\t\t(r, cat) => (cat.nested ? { ...r, [cat.nested.coat]: cat } : r),\n\t\t\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t).map(\n\t\t\t\t\t\t\t\tcat =>\n\t\t\t\t\t\t\t\t\tcat.nested?.coat && (\n\t\t\t\t\t\t\t\t\t\t<smoothly-item slot=\"items\" value={cat.nested.coat}>\n\t\t\t\t\t\t\t\t\t\t\t{cat.nested.coat}\n\t\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</smoothly-filter-select>\n\t\t\t\t\t<div slot=\"detail\">\n\t\t\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t\t\t<smoothly-filter-select menuHeight=\"5items\" label=\"coat\" property=\"nested.coat\" multiple>\n\t\t\t\t\t\t\t\t{this.cats &&\n\t\t\t\t\t\t\t\t\tObject.values(\n\t\t\t\t\t\t\t\t\t\tthis.cats.reduce<Record<string, Cat>>(\n\t\t\t\t\t\t\t\t\t\t\t(r, cat) => (cat.nested ? { ...r, [cat.nested.coat]: cat } : r),\n\t\t\t\t\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t).map(\n\t\t\t\t\t\t\t\t\t\tcat =>\n\t\t\t\t\t\t\t\t\t\t\tcat.nested?.coat && (\n\t\t\t\t\t\t\t\t\t\t\t\t<smoothly-item slot=\"items\" value={cat.nested.coat}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{cat.nested.coat}\n\t\t\t\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</smoothly-filter-select>\n\t\t\t\t\t\t\t<smoothly-filter-select menuHeight=\"5items\" label=\"breed\" property=\"breed\" multiple={false}>\n\t\t\t\t\t\t\t\t{this.cats &&\n\t\t\t\t\t\t\t\t\tObject.values(\n\t\t\t\t\t\t\t\t\t\tthis.cats.reduce<Record<string, Cat>>((r, cat) => (cat.breed ? { ...r, [cat.breed]: cat } : r), {})\n\t\t\t\t\t\t\t\t\t).map(\n\t\t\t\t\t\t\t\t\t\tcat =>\n\t\t\t\t\t\t\t\t\t\t\tcat.breed && (\n\t\t\t\t\t\t\t\t\t\t\t\t<smoothly-item slot=\"items\" value={cat.breed}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{cat.breed}\n\t\t\t\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</smoothly-filter-select>\n\t\t\t\t\t\t\t<smoothly-filter-select\n\t\t\t\t\t\t\t\tmenuHeight=\"5items\"\n\t\t\t\t\t\t\t\tlabel=\"names\"\n\t\t\t\t\t\t\t\tproperty=\"nested.names\"\n\t\t\t\t\t\t\t\tmultiple={true}\n\t\t\t\t\t\t\t\ttype=\"array\">\n\t\t\t\t\t\t\t\t{Object.keys(\n\t\t\t\t\t\t\t\t\tObject.values(names)\n\t\t\t\t\t\t\t\t\t\t.flat()\n\t\t\t\t\t\t\t\t\t\t.reduce((r, name) => ({ ...r, [name]: true }), {})\n\t\t\t\t\t\t\t\t).flatMap(name => (\n\t\t\t\t\t\t\t\t\t<smoothly-item slot=\"items\" value={name}>\n\t\t\t\t\t\t\t\t\t\t{name}\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-filter-select>\n\t\t\t\t\t\t\t<smoothly-filter-input label=\"Coat\" property=\"coat\" />\n\t\t\t\t\t\t\t<smoothly-filter-input label=\"Nested Coat\" property=\"nested.coat\" />\n\t\t\t\t\t\t</smoothly-form>\n\t\t\t\t\t</div>\n\t\t\t\t</smoothly-filter>\n\t\t\t\t{!cats ? (\n\t\t\t\t\t\"Failed to load data.\"\n\t\t\t\t) : (\n\t\t\t\t\t<smoothly-next-table columns={4}>\n\t\t\t\t\t\t<smoothly-next-table-head>\n\t\t\t\t\t\t\t<smoothly-next-table-row>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>{this.selector.render(cats)}</smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>Breed</smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>Coat</smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>Price</smoothly-next-table-cell>\n\t\t\t\t\t\t\t</smoothly-next-table-row>\n\t\t\t\t\t\t</smoothly-next-table-head>\n\t\t\t\t\t\t{cats.map(cat => (\n\t\t\t\t\t\t\t<smoothly-next-table-row>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>{this.selector.render(cat)}</smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-expandable-cell>\n\t\t\t\t\t\t\t\t\t{cat.breed}\n\t\t\t\t\t\t\t\t\t<div slot=\"detail\">Country: {cat.country}</div>\n\t\t\t\t\t\t\t\t</smoothly-next-table-expandable-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-expandable-cell>\n\t\t\t\t\t\t\t\t\t{cat.coat}\n\t\t\t\t\t\t\t\t\t<div slot=\"detail\">Pattern: {cat.pattern}</div>\n\t\t\t\t\t\t\t\t</smoothly-next-table-expandable-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t\t<smoothly-display type=\"price\" value={cat.price} currency=\"SEK\"></smoothly-display>\n\t\t\t\t\t\t\t\t</smoothly-next-table-cell>\n\t\t\t\t\t\t\t</smoothly-next-table-row>\n\t\t\t\t\t\t))}\n\t\t\t\t\t\t<smoothly-next-table-foot>\n\t\t\t\t\t\t\t<smoothly-next-table-row>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell span={3}>\n\t\t\t\t\t\t\t\t\t<smoothly-display\n\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\tvalue={`Selected: ${\n\t\t\t\t\t\t\t\t\t\t\tthis.selector.selected.length != 0 ? this.selector.selected.length : cats ? cats.length : \"?\"\n\t\t\t\t\t\t\t\t\t\t}`}></smoothly-display>\n\t\t\t\t\t\t\t\t</smoothly-next-table-cell>\n\t\t\t\t\t\t\t</smoothly-next-table-row>\n\t\t\t\t\t\t</smoothly-next-table-foot>\n\t\t\t\t\t</smoothly-next-table>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n}\nconst names: Record<string, string[]> = {\n\t\"United States\": [\"bill\", \"bob\", \"brad\", \"joe\", \"molly\"],\n\tAustralia: [\"nigel\", \"bruce\", \"sheila\", \"brad\", \"shane\"],\n\t\"United Kingdom\": [\"nigel\", \"james\", \"molly\", \"shane\", \"bob\"],\n\tGreece: [\"dionysius\", \"demetrius\", \"polikarpos\"],\n}\n"],"version":3}
1	+ {"file":"p-0ea6c8fd.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,MAAM,QAAQ,GAAG,6sCAA6sC,CAAC;AAC/tC,4CAAe,QAAQ;;MCUV,iBAAiB;;;;wBACa,EAAE;;wBAET,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC;;IAE3D,cAAc,CAAC,KAAwC;QACtD,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAA;KAC5B;IAED,oBAAoB,CAAC,KAAuC;QAC3D,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAA;KAClD;IAED,MAAM,iBAAiB;QACtB,MAAM,QAAQ,GAAG,MAAMA,KAAU,CAAC,uCAAuC,CAAC,CAAA;QAC1E,IAAI,CAAC,IAAI;YACR,QAAQ,CAAC,MAAM,IAAI,GAAG;gBACtB,CAAC,MAAM,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,GAAQ;;oBAAK,wCACzC,GAAG,KACN,KAAK,EAAE,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAC9D,MAAM,kCAAO,GAAG,KAAE,KAAK,EAAE,MAAA,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,mCAAI,EAAE,KACjD,KAAK,EAAE,MAAA,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,mCAAI,EAAE,KAC9B;iBAAA,CAAC,CAAA;KACJ;IAED,MAAM;QACL,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAIC,MAAkB,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,CAAA;QACtE,QACC,EAAC,IAAI,uDACJ,yEAAkB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,UAAU,GAAG,EACjD,0EACC,+EACC,UAAU,EAAE,EAAE,CAAC,gBAAgB,GAAG,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,EACvD,IAAI,EAAC,KAAK,EACV,OAAO,EAAC,eAAe,EACvB,IAAI,EAAC,KAAK,GACT,EACF,+EACC,UAAU,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,EAC5C,IAAI,EAAC,KAAK,EACV,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,KAAK,GACT,EACF,+EACC,UAAU,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,EACjD,IAAI,EAAC,iBAAiB,EACtB,OAAO,EAAC,mBAAmB,EAC3B,IAAI,EAAC,KAAK,GACT,EACF,+EACC,UAAU,EAAE,EAAE,OAAO,EAAE,YAAY,EAAE,EACrC,GAAG,QACH,MAAM,QACN,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,cAAc,EACtB,IAAI,EAAC,KAAK,GACT,EACF,+EAAwB,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,aAAa,EAAC,IAAI,EAAC,KAAK,EAAC,QAAQ,EAAE,KAAK,IACxG,IAAI,CAAC,IAAI;YACT,MAAM,CAAC,MAAM,CACZ,IAAI,CAAC,IAAI,CAAC,MAAM,CACf,CAAC,CAAC,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,mCAAQ,CAAC,KAAE,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,GAAG,GAAG,MAAK,CAAC,CAAC,EAC/D,EAAE,CACF,CACD,CAAC,GAAG,CACJ,GAAG;;gBACF,OAAA,CAAA,MAAA,GAAG,CAAC,MAAM,0CAAE,IAAI,MACf,qBAAe,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,IAAI,IAChD,GAAG,CAAC,MAAM,CAAC,IAAI,CACD,CAChB,CAAA;aAAA,CACF,CACsB,EACzB,4DAAK,IAAI,EAAC,QAAQ,IACjB,sEAAe,KAAK,EAAC,QAAQ,IAC5B,+EAAwB,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,aAAa,EAAC,QAAQ,UACtF,IAAI,CAAC,IAAI;YACT,MAAM,CAAC,MAAM,CACZ,IAAI,CAAC,IAAI,CAAC,MAAM,CACf,CAAC,CAAC,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,mCAAQ,CAAC,KAAE,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,GAAG,GAAG,MAAK,CAAC,CAAC,EAC/D,EAAE,CACF,CACD,CAAC,GAAG,CACJ,GAAG;;gBACF,OAAA,CAAA,MAAA,GAAG,CAAC,MAAM,0CAAE,IAAI,MACf,qBAAe,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,IAAI,IAChD,GAAG,CAAC,MAAM,CAAC,IAAI,CACD,CAChB,CAAA;aAAA,CACF,CACsB,EACzB,+EAAwB,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAC,OAAO,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,EAAE,KAAK,IACxF,IAAI,CAAC,IAAI;YACT,MAAM,CAAC,MAAM,CACZ,IAAI,CAAC,IAAI,CAAC,MAAM,CAAsB,CAAC,CAAC,EAAE,GAAG,MAAM,GAAG,CAAC,KAAK,mCAAQ,CAAC,KAAE,CAAC,GAAG,CAAC,KAAK,GAAG,GAAG,MAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CACnG,CAAC,GAAG,CACJ,GAAG,IACF,GAAG,CAAC,KAAK,KACR,qBAAe,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,GAAG,CAAC,KAAK,IAC1C,GAAG,CAAC,KAAK,CACK,CAChB,CACF,CACsB,EACzB,+EACC,UAAU,EAAC,QAAQ,EACnB,KAAK,EAAC,OAAO,EACb,QAAQ,EAAC,cAAc,EACvB,QAAQ,EAAE,IAAI,EACd,IAAI,EAAC,OAAO,IACX,MAAM,CAAC,IAAI,CACX,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC;aAClB,IAAI,EAAE;aACN,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,sCAAW,CAAC,KAAE,CAAC,IAAI,GAAG,IAAI,IAAG,EAAE,EAAE,CAAC,CACnD,CAAC,OAAO,CAAC,IAAI,KACb,qBAAe,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,IAAI,IACrC,IAAI,CACU,CAChB,CAAC,CACsB,EACzB,8EAAuB,KAAK,EAAC,MAAM,EAAC,QAAQ,EAAC,MAAM,GAAG,EACtD,8EAAuB,KAAK,EAAC,aAAa,EAAC,QAAQ,EAAC,aAAa,GAAG,CACrD,CACX,CACW,EACjB,CAAC,IAAI,IACL,sBAAsB,KAEtB,2BAAqB,OAAO,EAAE,CAAC,IAC9B,oCACC,mCACC,oCAA2B,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAA4B,EACjF,4CAA0D,EAC1D,2CAAyD,EACzD,4CAA0D,CACjC,CACA,EAC1B,IAAI,CAAC,GAAG,CAAC,GAAG,KACZ,mCACC,oCAA2B,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,CAAC,CAA4B,EAChF,+CACE,GAAG,CAAC,KAAK,EACV,WAAK,IAAI,EAAC,QAAQ,iBAAW,GAAG,CAAC,OAAO,CAAO,CACV,EACtC,+CACE,GAAG,CAAC,IAAI,EACT,WAAK,IAAI,EAAC,QAAQ,iBAAW,GAAG,CAAC,OAAO,CAAO,CACV,EACtC,oCACC,wBAAkB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAC,KAAK,GAAoB,CACzD,CACF,CAC1B,CAAC,EACF,oCACC,mCACC,gCAA0B,IAAI,EAAE,CAAC,IAChC,wBACC,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,aACN,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC,MAAM,GAAG,GAC3F,EAAE,GAAqB,CACE,CACF,CACA,CACN,CACtB,CACK,EACP;KACD;;;;;;;AAEF,MAAM,KAAK,GAA6B;IACvC,eAAe,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC;IACxD,SAAS,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,CAAC;IACxD,gBAAgB,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC;IAC7D,MAAM,EAAE,CAAC,WAAW,EAAE,WAAW,EAAE,YAAY,CAAC;CAChD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["http.fetch","selectively.filter"],"sources":["src/components/next/demo/filtered/style.css?tag=smoothly-next-table-demo-filtered&encapsulation=scoped","src/components/next/demo/filtered/index.tsx"],"sourcesContent":[":host {\n\tdisplay: grid;\n\tgrid-template-columns: auto auto;\n\tgrid-template-areas:\n\t\t\"header filter\"\n\t\t\"main main\";\n\tmargin-bottom: 50em;\n}\n\n:host>smoothly-display {\n\tfont-size: 2em;\n\tgrid-area: header;\n}\n\n:host>smoothly-filter {\n\tmargin-left: auto;\n\tgrid-area: filter;\n\theight: fit-content;\n}\n\n:host>* {\n\tmargin-bottom: 2rem;\n\tgrid-area: main;\n}\n\n:host>smoothly-next-table {\n\tgrid-template-columns: min-content repeat(calc(var(--columns) - 1), auto);\n}\n\nsmoothly-next-table>smoothly-next-table-row>smoothly-next-table-cell:nth-of-type(2),\n:host>smoothly-next-table>smoothly-next-table-head>smoothly-next-table-row>smoothly-next-table-cell:nth-of-type(4) {\n\tjustify-content: end;\n}\n","import { Component, ComponentWillLoad, h, Host, Listen, State } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\nimport { http } from \"cloudly-http\"\nimport { Selector } from \"../../../table/Selector\"\nimport { Cat } from \"./Root\"\n\n@Component({\n\ttag: \"smoothly-next-table-demo-filtered\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class TableDemoFiltered implements ComponentWillLoad {\n\t@State() criteria: selectively.Criteria = {}\n\t@State() cats?: Cat[] \| false\n\t@State() selector: Selector<Cat> = Selector.create(\"breed\")\n\t@Listen(\"smoothlyFilter\")\n\tonFilterUpdate(event: CustomEvent<selectively.Criteria>) {\n\t\tevent.stopPropagation()\n\t\tthis.criteria = event.detail\n\t}\n\t@Listen(\"smoothlyInput\")\n\tsmoothlyInputHandler(event: CustomEvent<Record<string, any>>) {\n\t\tevent.stopPropagation()\n\t\tthis.selector = this.selector.handle(event.detail)\n\t}\n\n\tasync componentWillLoad(): Promise<void> {\n\t\tconst response = await http.fetch(\"https://catfact.ninja/breeds?limit=15\")\n\t\tthis.cats =\n\t\t\tresponse.status == 200 &&\n\t\t\t(await response.body).data.map((cat: any) => ({\n\t\t\t\t...cat,\n\t\t\t\tprice: [...cat.breed].reduce((r, c) => r + c.charCodeAt(0), 0),\n\t\t\t\tnested: { ...cat, names: names[cat.country] ?? [] },\n\t\t\t\tnames: names[cat.country] ?? [],\n\t\t\t}))\n\t}\n\n\trender() {\n\t\tconst cats = this.cats && selectively.filter(this.criteria, this.cats)\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-display type=\"text\" value=\"Filtered\" />\n\t\t\t\t<smoothly-filter>\n\t\t\t\t\t<smoothly-filter-toggle\n\t\t\t\t\t\tproperties={{ [\"nested.pattern\"]: \"Ticked\", breed: \"\" }}\n\t\t\t\t\t\ticon=\"add\"\n\t\t\t\t\t\ttoolTip=\"Nested Ticked\"\n\t\t\t\t\t\tslot=\"bar\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-filter-toggle\n\t\t\t\t\t\tproperties={{ pattern: \"Ticked\", breed: \"\" }}\n\t\t\t\t\t\ticon=\"paw\"\n\t\t\t\t\t\ttoolTip=\"Ticked cats\"\n\t\t\t\t\t\tslot=\"bar\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-filter-toggle\n\t\t\t\t\t\tproperties={{ breed: \"Bombay\", pattern: \"Solid\" }}\n\t\t\t\t\t\ticon=\"radio-button-on\"\n\t\t\t\t\t\ttoolTip=\"Solid bombay cats\"\n\t\t\t\t\t\tslot=\"bar\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-filter-toggle\n\t\t\t\t\t\tproperties={{ pattern: \"Colorpoint\" }}\n\t\t\t\t\t\tnot\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon=\"alert\"\n\t\t\t\t\t\ttoolTip=\"Colored cats\"\n\t\t\t\t\t\tslot=\"bar\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-filter-select menuHeight=\"5items\" label=\"coat\" property=\"nested.coat\" slot=\"bar\" multiple={false}>\n\t\t\t\t\t\t{this.cats &&\n\t\t\t\t\t\t\tObject.values(\n\t\t\t\t\t\t\t\tthis.cats.reduce<Record<string, Cat>>(\n\t\t\t\t\t\t\t\t\t(r, cat) => (cat.nested ? { ...r, [cat.nested.coat]: cat } : r),\n\t\t\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t).map(\n\t\t\t\t\t\t\t\tcat =>\n\t\t\t\t\t\t\t\t\tcat.nested?.coat && (\n\t\t\t\t\t\t\t\t\t\t<smoothly-item slot=\"items\" value={cat.nested.coat}>\n\t\t\t\t\t\t\t\t\t\t\t{cat.nested.coat}\n\t\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</smoothly-filter-select>\n\t\t\t\t\t<div slot=\"detail\">\n\t\t\t\t\t\t<smoothly-form looks=\"border\">\n\t\t\t\t\t\t\t<smoothly-filter-select menuHeight=\"5items\" label=\"coat\" property=\"nested.coat\" multiple>\n\t\t\t\t\t\t\t\t{this.cats &&\n\t\t\t\t\t\t\t\t\tObject.values(\n\t\t\t\t\t\t\t\t\t\tthis.cats.reduce<Record<string, Cat>>(\n\t\t\t\t\t\t\t\t\t\t\t(r, cat) => (cat.nested ? { ...r, [cat.nested.coat]: cat } : r),\n\t\t\t\t\t\t\t\t\t\t\t{}\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t).map(\n\t\t\t\t\t\t\t\t\t\tcat =>\n\t\t\t\t\t\t\t\t\t\t\tcat.nested?.coat && (\n\t\t\t\t\t\t\t\t\t\t\t\t<smoothly-item slot=\"items\" value={cat.nested.coat}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{cat.nested.coat}\n\t\t\t\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</smoothly-filter-select>\n\t\t\t\t\t\t\t<smoothly-filter-select menuHeight=\"5items\" label=\"breed\" property=\"breed\" multiple={false}>\n\t\t\t\t\t\t\t\t{this.cats &&\n\t\t\t\t\t\t\t\t\tObject.values(\n\t\t\t\t\t\t\t\t\t\tthis.cats.reduce<Record<string, Cat>>((r, cat) => (cat.breed ? { ...r, [cat.breed]: cat } : r), {})\n\t\t\t\t\t\t\t\t\t).map(\n\t\t\t\t\t\t\t\t\t\tcat =>\n\t\t\t\t\t\t\t\t\t\t\tcat.breed && (\n\t\t\t\t\t\t\t\t\t\t\t\t<smoothly-item slot=\"items\" value={cat.breed}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{cat.breed}\n\t\t\t\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</smoothly-filter-select>\n\t\t\t\t\t\t\t<smoothly-filter-select\n\t\t\t\t\t\t\t\tmenuHeight=\"5items\"\n\t\t\t\t\t\t\t\tlabel=\"names\"\n\t\t\t\t\t\t\t\tproperty=\"nested.names\"\n\t\t\t\t\t\t\t\tmultiple={true}\n\t\t\t\t\t\t\t\ttype=\"array\">\n\t\t\t\t\t\t\t\t{Object.keys(\n\t\t\t\t\t\t\t\t\tObject.values(names)\n\t\t\t\t\t\t\t\t\t\t.flat()\n\t\t\t\t\t\t\t\t\t\t.reduce((r, name) => ({ ...r, [name]: true }), {})\n\t\t\t\t\t\t\t\t).flatMap(name => (\n\t\t\t\t\t\t\t\t\t<smoothly-item slot=\"items\" value={name}>\n\t\t\t\t\t\t\t\t\t\t{name}\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-filter-select>\n\t\t\t\t\t\t\t<smoothly-filter-input label=\"Coat\" property=\"coat\" />\n\t\t\t\t\t\t\t<smoothly-filter-input label=\"Nested Coat\" property=\"nested.coat\" />\n\t\t\t\t\t\t</smoothly-form>\n\t\t\t\t\t</div>\n\t\t\t\t</smoothly-filter>\n\t\t\t\t{!cats ? (\n\t\t\t\t\t\"Failed to load data.\"\n\t\t\t\t) : (\n\t\t\t\t\t<smoothly-next-table columns={4}>\n\t\t\t\t\t\t<smoothly-next-table-head>\n\t\t\t\t\t\t\t<smoothly-next-table-row>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>{this.selector.render(cats)}</smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>Breed</smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>Coat</smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>Price</smoothly-next-table-cell>\n\t\t\t\t\t\t\t</smoothly-next-table-row>\n\t\t\t\t\t\t</smoothly-next-table-head>\n\t\t\t\t\t\t{cats.map(cat => (\n\t\t\t\t\t\t\t<smoothly-next-table-row>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>{this.selector.render(cat)}</smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-expandable-cell>\n\t\t\t\t\t\t\t\t\t{cat.breed}\n\t\t\t\t\t\t\t\t\t<div slot=\"detail\">Country: {cat.country}</div>\n\t\t\t\t\t\t\t\t</smoothly-next-table-expandable-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-expandable-cell>\n\t\t\t\t\t\t\t\t\t{cat.coat}\n\t\t\t\t\t\t\t\t\t<div slot=\"detail\">Pattern: {cat.pattern}</div>\n\t\t\t\t\t\t\t\t</smoothly-next-table-expandable-cell>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell>\n\t\t\t\t\t\t\t\t\t<smoothly-display type=\"price\" value={cat.price} currency=\"SEK\"></smoothly-display>\n\t\t\t\t\t\t\t\t</smoothly-next-table-cell>\n\t\t\t\t\t\t\t</smoothly-next-table-row>\n\t\t\t\t\t\t))}\n\t\t\t\t\t\t<smoothly-next-table-foot>\n\t\t\t\t\t\t\t<smoothly-next-table-row>\n\t\t\t\t\t\t\t\t<smoothly-next-table-cell span={3}>\n\t\t\t\t\t\t\t\t\t<smoothly-display\n\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\tvalue={`Selected: ${\n\t\t\t\t\t\t\t\t\t\t\tthis.selector.selected.length != 0 ? this.selector.selected.length : cats ? cats.length : \"?\"\n\t\t\t\t\t\t\t\t\t\t}`}></smoothly-display>\n\t\t\t\t\t\t\t\t</smoothly-next-table-cell>\n\t\t\t\t\t\t\t</smoothly-next-table-row>\n\t\t\t\t\t\t</smoothly-next-table-foot>\n\t\t\t\t\t</smoothly-next-table>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n}\nconst names: Record<string, string[]> = {\n\t\"United States\": [\"bill\", \"bob\", \"brad\", \"joe\", \"molly\"],\n\tAustralia: [\"nigel\", \"bruce\", \"sheila\", \"brad\", \"shane\"],\n\t\"United Kingdom\": [\"nigel\", \"james\", \"molly\", \"shane\", \"bob\"],\n\tGreece: [\"dionysius\", \"demetrius\", \"polikarpos\"],\n}\n"],"version":3}

package/dist/components/{p-2f737371.js → p-1390a195.js} RENAMED Viewed

@@ -2,30 +2,30 @@ import { p as proxyCustomElement, H, h, d as Host } from './p-f765921a.js';
 import { C as Color } from './p-8e1e509d.js';
 import './p-390767c7.js';
 import './p-47ea6b68.js';
-import { L as Looks, d as defineCustomElement$h } from './p-08d0d254.js';
+import { L as Looks, d as defineCustomElement$h } from './p-de7367c4.js';
 import { d as defineCustomElement$o } from './p-7d0eafb0.js';
-import { d as defineCustomElement$n } from './p-666206c5.js';
+import { d as defineCustomElement$n } from './p-5d648150.js';
 import { d as defineCustomElement$m } from './p-4f80c811.js';
 import { d as defineCustomElement$l } from './p-f770567b.js';
 import { d as defineCustomElement$k } from './p-96acfe2c.js';
 import { d as defineCustomElement$j } from './p-f46dd8e4.js';
 import { d as defineCustomElement$i } from './p-4c6fe645.js';
-import { d as defineCustomElement$g } from './p-4922697f.js';
-import { d as defineCustomElement$f } from './p-2b19c666.js';
-import { d as defineCustomElement$e } from './p-ddf9d2aa.js';
-import { d as defineCustomElement$d } from './p-75de9c9a.js';
-import { d as defineCustomElement$c } from './p-cd448401.js';
-import { d as defineCustomElement$b } from './p-c446b8ad.js';
-import { d as defineCustomElement$a } from './p-22f4742d.js';
-import { d as defineCustomElement$9 } from './p-515ab07d.js';
-import { d as defineCustomElement$8 } from './p-046dcaa0.js';
-import { d as defineCustomElement$7 } from './p-b3a66468.js';
-import { d as defineCustomElement$6 } from './p-78fd29c9.js';
-import { d as defineCustomElement$5 } from './p-9d011d36.js';
-import { d as defineCustomElement$4 } from './p-db26eba4.js';
-import { d as defineCustomElement$3 } from './p-edcdcc51.js';
-import { d as defineCustomElement$2 } from './p-c77944e7.js';
-import { d as defineCustomElement$1 } from './p-dd5d9674.js';
+import { d as defineCustomElement$g } from './p-8e748704.js';
+import { d as defineCustomElement$f } from './p-1cd836ca.js';
+import { d as defineCustomElement$e } from './p-bad6a2f9.js';
+import { d as defineCustomElement$d } from './p-d8318156.js';
+import { d as defineCustomElement$c } from './p-575b902b.js';
+import { d as defineCustomElement$b } from './p-9caf65ff.js';
+import { d as defineCustomElement$a } from './p-4b05e229.js';
+import { d as defineCustomElement$9 } from './p-864278eb.js';
+import { d as defineCustomElement$8 } from './p-751259e1.js';
+import { d as defineCustomElement$7 } from './p-c0796b72.js';
+import { d as defineCustomElement$6 } from './p-b1e386db.js';
+import { d as defineCustomElement$5 } from './p-67b8cf78.js';
+import { d as defineCustomElement$4 } from './p-7c727d4f.js';
+import { d as defineCustomElement$3 } from './p-38ce18a1.js';
+import { d as defineCustomElement$2 } from './p-62c1780b.js';
+import { d as defineCustomElement$1 } from './p-4f911ef7.js';
 const styleCss = ".sc-smoothly-input-demo-standard-h{width:50%;margin:auto}.sc-smoothly-input-demo-standard-h h2.sc-smoothly-input-demo-standard,.sc-smoothly-input-demo-standard-h p.sc-smoothly-input-demo-standard{margin:.5rem 0}div.input-wrapper.sc-smoothly-input-demo-standard{display:grid;margin-top:1rem;grid-template-columns:2fr 1fr;gap:1rem;position:relative;justify-content:space-around}div.input-wrapper.sc-smoothly-input-demo-standard>[name].sc-smoothly-input-demo-standard{grid-column:1 / 2}div.input-wrapper.sc-smoothly-input-demo-standard>.width.sc-smoothly-input-demo-standard{width:100%;text-align:center;border-bottom:1px dashed black}div.input-wrapper.sc-smoothly-input-demo-standard>.height.sc-smoothly-input-demo-standard{align-content:center;grid-column:2 / 3;border-left:1px dashed black;padding-left:1rem;content:\"hello\"}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard{width:0.5rem;grid-column:1 / 2;white-space:nowrap;overflow:visible;position:relative;cursor:default}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard::before{content:\"\";position:absolute;width:100%;top:1.5rem;bottom:-1rem;border:1px  dashed black;z-index:2}div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard:hover::before{bottom:-100vh}.vertical.sc-smoothly-input-demo-standard-h{width:100%;row-gap:0;position:relative}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard{display:grid;grid-template-columns:repeat(auto-fill, 14rem);gap:.5rem}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.width.sc-smoothly-input-demo-standard,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.height.sc-smoothly-input-demo-standard,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.left-padding.sc-smoothly-input-demo-standard{display:none}.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.guide-lines.sc-smoothly-input-demo-standard::before,.vertical.sc-smoothly-input-demo-standard-h>div.input-wrapper.sc-smoothly-input-demo-standard>.guide-lines.sc-smoothly-input-demo-standard::after{content:\"\";pointer-events:none;right:0;width:100vw;position:absolute;z-index:2;border-top:1px dotted black}.sc-smoothly-input-demo-standard-h:not(.vertical) .guide-lines.sc-smoothly-input-demo-standard{display:none}.guide-lines.sc-smoothly-input-demo-standard{text-align:end;justify-self:center;align-content:center}.guide-lines.sc-smoothly-input-demo-standard::before{top:1rem}.guide-lines.sc-smoothly-input-demo-standard::after{top:2rem}.guide-lines.show-label.sc-smoothly-input-demo-standard::before{top:1.05rem}.guide-lines.show-label.sc-smoothly-input-demo-standard::after{top:2.3rem}";
 const SmoothlyInputDemoStandardStyle0 = styleCss;
@@ -52,7 +52,7 @@ const SmoothlyInputDemoStandard = proxyCustomElement(class SmoothlyInputDemoStan
     }
     render() {
         const placeholder = this.options.placeholder ? "placeholder" : undefined;
-        return (h(Host, { key: '044fa8c4b9d8f5e7bfc3e57e4ec8c5549da8a011', class: { vertical: !!this.options.vertical } }, h("div", { key: '3662aa7286e3c71ee96b38446ed734c370ad11fe', class: "description" }, h("h2", { key: '831d2d5567a4a520b02730521c8e81a2973eaf5c' }, "Input Standard"), h("p", { key: '05480bcb96442c64da4323f707781d27e3aae2ee' }, "Height of input should be ", h("code", { key: '6c6c7ac45af02f09c11b1a4d62a5164e426a94ec' }, "3rem"), " including border. This is should result in a 48 pixel height at 100% zoom, assuming a root font-size of 16 pixels."), h("smoothly-form", { key: '0ce7d4bd476dfd902f835e858ab5f6ebe645a16f', looks: "grid", onSmoothlyFormInput: (e) => (this.options = e.detail) }, h("smoothly-input-select", { key: '25f2571c6d3f5ddbc9efd0899756024010e2773d', name: "looks" }, h("span", { key: 'ec4db36ee38f76903ff8df4379af65f2f0766646', slot: "label" }, "Looks"), Looks.types.map(l => (h("smoothly-item", { value: l }, l)))), h("smoothly-input-checkbox", { key: 'ebb2fc0c074c89af17e6df50d38a4caef91024bf', name: "readonly" }, "Readonly"), h("smoothly-input-select", { key: 'bd5cef034392cebc5c6000cd43b7c473368421b0', name: "color" }, h("span", { key: 'b6722cf63cb9f995f829704c21833e20d5d31232', slot: "label" }, "Color"), Color.types.map(c => (h("smoothly-item", { value: c }, h("span", { color: c }, c)))), h("smoothly-input-clear", { key: 'd29d56ccb184ff45572f0b67e6a341a9a1ba2825', slot: "end" })), h("smoothly-input-checkbox", { key: '83d811121a1be17b1fed20014014e5c3c556881e', name: "vertical" }, "Vertical Layout"), h("smoothly-input-checkbox", { key: '68aac64ededa8b02b761f3cd56cb3d6f31b45bdb', name: "showLabel", checked: this.options.showLabel }, "Show Label"), h("smoothly-input-checkbox", { key: '128e2f5022cf0cedc5d2f69195e16458b9fc8c61', name: "placeholder", checked: this.options.placeholder }, "Placeholder"), h("smoothly-input-range", { key: '787c162c2497211a78a0b68d44f6329d0858371b', label: "Border Radius (rem)", name: "borderRadius", value: this.options.borderRadius, min: 0, max: 2, step: 0.25 }))), h("div", { key: '35c08c03e943a73a875ed852d739d738db13fabf', class: "input-wrapper", style: { "--smoothly-input-border-radius": `${this.options.borderRadius}rem` } }, h("div", { key: 'a0564063144d6db7656baff3776990e1ddf7fe70', class: "width" }, "100%"), h("div", { key: 'af1770e8636f7f4864b1e9f8d79d21310fc6d5a5', class: "left-padding" }, "0.5rem - left padding"), h("smoothly-input", { key: '684c9e2fb3f232b3a13b7f87dda970a273e06ffe', name: "text", looks: this.options.looks, placeholder: placeholder, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: '56e2def6fb71ab72d3a3f156d674c4f0130b56d8' }, "Text"), h("smoothly-input-clear", { key: '7eba7d6a4953d6198e1fda0ed2fdadc97b1ea3c1', slot: "end" })), h("div", { key: '78a7aae500ccc6197dfc64190a8b5e282adbdb35', class: "height" }), h("smoothly-input-select", { key: '064cbc97f54d9efea21c318c5598c2ea9e6a321e', name: "month", looks: this.options.looks, placeholder: placeholder, readonly: this.options.readonly, color: this.options.color }, this.options.showLabel && h("label", { key: 'ca332bfd4e40666e4454a9b10115f8adc345f6be', slot: "label" }, "Select"), h("smoothly-item", { key: 'c93d3bdbb3f77f4599552638a535bec594847468', value: "1" }, "January"), h("smoothly-item", { key: '0c3d8ecce9c8dff3fe3ac0c13fcbc1d85a8a3d84', value: "2" }, "February"), h("smoothly-item", { key: '47f2a838b2f26507d7f52559f5655dd0f6796b1d', value: "3" }, "March"), h("smoothly-item", { key: '42a4dfe12c71630f4896003dde6b8acd96b02655', value: "4" }, "April"), h("smoothly-item", { key: '4bb5861ee318b39b3ac1fa35ecd4f9b640a8229e', value: "5" }, "May"), h("smoothly-item", { key: '3c43648f442f21c2856d4220aef7f1f622c70507', value: "6" }, "June"), h("smoothly-item", { key: 'd470ea78848fb51a989655d6de6c722cd2aaa9e8', value: "7" }, "July"), h("smoothly-item", { key: '5bf658eb99e5d7ea1db8013de92f23e381d2f8b0', value: "8" }, "August"), h("smoothly-item", { key: 'd494ba5400321c08a46bb542717f734d49d5417d', value: "9" }, "September"), h("smoothly-item", { key: 'c75a04e1aaef26dc8ab3869671db48d2e39c097c', value: "10" }, "October"), h("smoothly-item", { key: '9c996849ae914f908d0719a7cf08415b7509e951', value: "11" }, "November"), h("smoothly-item", { key: '1bbdcd5845e428fbfeb91d773c0198ffb9c1cc60', value: "12" }, "December"), h("smoothly-input-clear", { key: 'cc274431a7236faef0147eef2c29c70403ae44b5', slot: "end" })), h("div", { key: '965e84ff3436d07777084992f391349e3e4e0969', class: "height" }), h("smoothly-input-checkbox", { key: 'e25d58dee03f22d22708da8a26783944da473b19', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color }, "Check"), h("div", { key: 'f429538b28976aa446799e160a909f7b57c69ce9', class: "height" }), h("smoothly-input-radio", { key: '9854849f5c559481ca4c2b9e94f3b690f3818d0b', name: "radio", clearable: true, looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && h("label", { key: '318f3a3e48ce06b6af452f717cdc63ca1e3257c7', slot: "label" }, "Radio"), h("smoothly-input-radio-item", { key: 'cb47131f2fbbca8f080277e9185a726f59a8f831', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: '221e96bbddd2cfff9f587d1ff4fb1b87cae9bc9f', selected: true, value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: 'e55e72b32046dd8ad8a7cfcb1c851a98ecc90fec', value: "third" }, "Label 3"), h("smoothly-input-clear", { key: '091bd8d97c1181c7cc279e1d3ae9308734408f07', slot: "end" })), h("div", { key: 'db06d7584c5aa208ee858e53f9ed5d0c5e0d95ba', class: "height" }), h("smoothly-input-file", { key: '39b93bde42d37989305380fba2979d33eded3156', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, placeholder: placeholder, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: '9c6247a33d43de0e5ed649515f33109caeacbe06', slot: "label" }, "File"), h("smoothly-input-clear", { key: '1671d4ce52d245ee1e4cb0985e74dfc358e7c881', slot: "end" })), h("div", { key: '07677318b0ebcb654d4cdb53440380e1ad37e7a0', class: "height" }), h("smoothly-input-range", { key: '4e284dec0fc57a37eb4ab06d32d01d10ed3a5c6f', name: "range", label: this.options.showLabel ? "Range" : undefined, looks: this.options.looks, readonly: this.options.readonly, color: this.options.color }, h("smoothly-input-clear", { key: 'cdbb48fd450975c3781c6b95bad242634fa080c1', slot: "end" })), h("div", { key: 'c24c1881a74e91831c2e4559ae13505d1027d376', class: "height" }), h("smoothly-input-color", { key: 'b617db1b66a73dfd298aa6a17b48b0a537eec64a', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: '21e5c0b4f020c63031da90d7668f70d659eb2bd4' }, "Color"), h("smoothly-input-clear", { key: '33b518103b68f12837a4ee25d5f72ccfcbb3b8e7', slot: "end" })), h("div", { key: 'e7706aa12b6cfabc23ae1d9499641d5b3df6bda2', class: "height" }), h("smoothly-input-date", { key: '47c0964845648b7ff59eafc7d9080692b11f8614', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: '0a85480963e8f78279a9ee5751643576de0c7c26' }, "Date"), h("smoothly-input-clear", { key: '3f1b5355882e84c53bfd571be1ee73754f257bcc', slot: "end" })), h("div", { key: '35a82c5f250b6e4d24ece68a0b02c01e53272441', class: "height" }), h("smoothly-input-date-range", { key: '8c06cad779884cadeaaced5c5f934b16776fca70', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, placeholder: placeholder, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: 'a08d77047d018b960f60754359229a3681f2ce03' }, "Date Range"), h("smoothly-input-clear", { key: '8ba119dc695c705749677ff7eafa7bde2d5eeb5f', slot: "end" })), h("div", { key: '216ac78045d830384411de3d5d2f4ee3bd4bca41', class: "height" }), h("div", { key: '24241b7d95382f3a3cd509e86d4a784195c825ff', class: { "guide-lines": true, "show-label": !!this.options.showLabel } }, this.options.showLabel ? "Aligned labels & values" : "Center values"))));
+        return (h(Host, { key: '784cd389b73ec998cfc33687554c6ce89652079d', class: { vertical: !!this.options.vertical } }, h("div", { key: '922dcb022d6102729c23cf6b3e4eb9d181104791', class: "description" }, h("h2", { key: '25394f0be9723506febc2d87d1fd5c4120b4ca39' }, "Input Standard"), h("p", { key: '062ca48b69560e7237a419f182bf77dd5d549698' }, "Height of input should be ", h("code", { key: '6f3d6eb77059d1e485b802b4882720980077c0b3' }, "3rem"), " including border. This is should result in a 48 pixel height at 100% zoom, assuming a root font-size of 16 pixels."), h("smoothly-form", { key: '04bcc3858224312058187a41bfb6f99ca314aa44', looks: "grid", onSmoothlyFormInput: (e) => (this.options = e.detail) }, h("smoothly-input-select", { key: '0d2abfaec915f58a4f43024fab1723d597fd2dc5', name: "looks" }, h("span", { key: 'ef60b294b701aedeb1540007cc0e6c4f7fc196e7', slot: "label" }, "Looks"), Looks.types.map(l => (h("smoothly-item", { value: l }, l)))), h("smoothly-input-checkbox", { key: '49f2bf14f8ad5734097b0aa7e58b5216d803be62', name: "readonly" }, "Readonly"), h("smoothly-input-select", { key: 'b4da34fe37a43cc44a6f5a779740e793724fc446', name: "color" }, h("span", { key: '40ab845ccf5250bce39c7f70d76c093cffc93c26', slot: "label" }, "Color"), Color.types.map(c => (h("smoothly-item", { value: c }, h("span", { color: c }, c)))), h("smoothly-input-clear", { key: '4506d88ad3a4a4863b48ce00bca5b40d48204cb3', slot: "end" })), h("smoothly-input-checkbox", { key: '8d20deeda95a6afbbd75a4788963fe6cb21e34a0', name: "vertical" }, "Vertical Layout"), h("smoothly-input-checkbox", { key: 'fab8770e50db7c6263fe5dd8768c5a049e3005ad', name: "showLabel", checked: this.options.showLabel }, "Show Label"), h("smoothly-input-checkbox", { key: 'a3f6d6aced12a9d905f5b3f73530dc145735a17f', name: "placeholder", checked: this.options.placeholder }, "Placeholder"), h("smoothly-input-range", { key: '6685791a655b9de1499a1f738fc5197ecb9a67a0', label: "Border Radius (rem)", name: "borderRadius", value: this.options.borderRadius, min: 0, max: 2, step: 0.25 }))), h("div", { key: '1b4d02bdb4dc4c1e992eeb6040ae158e2748d50f', class: "input-wrapper", style: { "--smoothly-input-border-radius": `${this.options.borderRadius}rem` } }, h("div", { key: '2608d0af230ddc45a5e305f5cd50306d7944f13f', class: "width" }, "100%"), h("div", { key: '2f86b418dc79ec24e6f76c8f66351dd5d06acb6d', class: "left-padding" }, "0.5rem - left padding"), h("smoothly-input", { key: '5d2355bd0874b9717f29a347042b855caf3735e2', name: "text", looks: this.options.looks, placeholder: placeholder, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: 'df7abc3274a87b70abd7e440fc93f778e9e88d77' }, "Text"), h("smoothly-input-clear", { key: '88e2456ddb005705f7ba71cd60bec4cf9ee95f8d', slot: "end" })), h("div", { key: '44e12dede8311dd568518f72c42530b3ecfb66af', class: "height" }), h("smoothly-input-select", { key: '5019fe1b9518e783aa7da0e7fc2a5a83dc93a128', name: "month", looks: this.options.looks, placeholder: placeholder, readonly: this.options.readonly, color: this.options.color }, this.options.showLabel && h("label", { key: '0cb0541a87e4dcca91ce0d80dafdba72f85b9e03', slot: "label" }, "Select"), h("smoothly-item", { key: 'e5b3071fea883db86b9e231f4b2c20732173536c', value: "1" }, "January"), h("smoothly-item", { key: '495795fabf01a9070b762cd66e5ed770f228bf4d', value: "2" }, "February"), h("smoothly-item", { key: 'faaac29a98b1ec33c26bdf5f6514a76412f32228', value: "3" }, "March"), h("smoothly-item", { key: 'b1426ae59bb51ade1e7dad20fb6e1949b3a5c0f8', value: "4" }, "April"), h("smoothly-item", { key: 'e9d3f4dfe7ee79709e5a8b290a7fd9518fde709e', value: "5" }, "May"), h("smoothly-item", { key: '4d4d17f2c6fc5bd16287bc4b61fc98e647745839', value: "6" }, "June"), h("smoothly-item", { key: 'bf85ab8cc41ce12e4f39128fc346354e90e4a818', value: "7" }, "July"), h("smoothly-item", { key: '4ac673d58a2720c0faa744d48d6396e3b1bde9dd', value: "8" }, "August"), h("smoothly-item", { key: '1d9f93d1104446b13c7acd9600d17644f1e1b0b3', value: "9" }, "September"), h("smoothly-item", { key: '4c7879c0c8f1fb4a1e5fffdac85d70fddbee6be1', value: "10" }, "October"), h("smoothly-item", { key: '39af8225cc806f8ecd6baef04179bd8641c4f45c', value: "11" }, "November"), h("smoothly-item", { key: '91181c350899880d8d557464eb2d73233a745725', value: "12" }, "December"), h("smoothly-input-clear", { key: '38bf44afab753632846ae8f1e06da14396a069d2', slot: "end" })), h("div", { key: 'f3f4a148d023e69f350d584f676f3f9230d50b81', class: "height" }), h("smoothly-input-checkbox", { key: '04145e3352cb19b808b667bc7f915aa4ed11b139', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color }, "Check"), h("div", { key: '9730c4383240e7dfd827f6363a51af1e20f2b0d2', class: "height" }), h("smoothly-input-radio", { key: '80016b96d58dd97c3e76b1a58896011005793bc5', name: "radio", clearable: true, looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && h("label", { key: 'e352df7b302d99455e10aba7dec3c80c463c8d12', slot: "label" }, "Radio"), h("smoothly-input-radio-item", { key: '1f64692c6c834c37ceb0a13ab68dc65468cba491', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: '003bddef9a78f0380abd81a12c3588b52c5f3a96', selected: true, value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: '4846a126e904c491bcb8377ee6a00911777d882e', value: "third" }, "Label 3"), h("smoothly-input-clear", { key: 'b14968dc755270099340bfccf8a1909155fb9211', slot: "end" })), h("div", { key: 'cb18de85115b554d5e9d4e1490531a7083dd8a77', class: "height" }), h("smoothly-input-file", { key: 'b97675882d95e04f8692c5b3460b4ccabfc1e975', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, placeholder: placeholder, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: '7fa640ef3e6db9e981dcab96857df59cec8e576d', slot: "label" }, "File"), h("smoothly-input-clear", { key: 'c0a80dea47043e132bff876dddbdcf0283c7c998', slot: "end" })), h("div", { key: '29b5b4dbfc7b547cc6defb6dd3d7971d92d3a57e', class: "height" }), h("smoothly-input-range", { key: '2913c10df0c8f821f96e6380c96c142322e2beaf', name: "range", label: this.options.showLabel ? "Range" : undefined, looks: this.options.looks, readonly: this.options.readonly, color: this.options.color }, h("smoothly-input-clear", { key: '2927d9e4292279ffe1d3e0d430214764e3112535', slot: "end" })), h("div", { key: '76d623669ac24a878c40044d96182d84e8e9dddc', class: "height" }), h("smoothly-input-color", { key: '2e2bf08a782668b937eec20119d59245486a3b8c', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: 'b152d46dd05edd95214cd4bc00feda7e14102a92' }, "Color"), h("smoothly-input-clear", { key: '688575ba0e75c9fd8089a51618b3df6691e0b6d0', slot: "end" })), h("div", { key: 'a288a016a8aba3a666004d1745af57a9a49c4a84', class: "height" }), h("smoothly-input-date", { key: '50c9171499d5ee91181babfcaeb01884483e5430', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: '3a738742111958ee0b4e520d3882bfc122f25764' }, "Date"), h("smoothly-input-clear", { key: '1eb81c4f1c3d838825d02cde5dab3ec1c778203b', slot: "end" })), h("div", { key: 'b2ef4db841230f6b80bc540c7f37ff1aeebb6cab', class: "height" }), h("smoothly-input-date-range", { key: 'f64d6d45d5efd6f3c19a5f8739b43b7bfcee5de3', looks: this.options.looks, readonly: this.options.readonly, color: this.options.color, placeholder: placeholder, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: 'd419575d64589b4b2817b90fd2ae4f0d3440880e' }, "Date Range"), h("smoothly-input-clear", { key: '3e305c54a0d42326b5eea572ce62f3dccb15cc6c', slot: "end" })), h("div", { key: '96094b6ec9150edb1f8c5a64f51b3646296be49c', class: "height" }), h("div", { key: '2bce35052b55dc97f8da3e995110cbb2a22fde28', class: { "guide-lines": true, "show-label": !!this.options.showLabel } }, this.options.showLabel ? "Aligned labels & values" : "Center values"))));
     }
     get element() { return this; }
     static get style() { return SmoothlyInputDemoStandardStyle0; }
@@ -197,4 +197,4 @@ defineCustomElement();
 export { SmoothlyInputDemoStandard as S, defineCustomElement as d };
-//# sourceMappingURL=p-2f737371.js.map
+//# sourceMappingURL=p-1390a195.js.map

package/dist/components/{p-2f737371.js.map → p-1390a195.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-2f737371.js","mappings":"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","names":[],"sources":["src/components/input/demo/standard/style.css?tag=smoothly-input-demo-standard&encapsulation=scoped","src/components/input/demo/standard/index.tsx"],"sourcesContent":[":host {\n\twidth: 50%;\n\tmargin: auto;\n}\n\n:host h2,\n:host p {\n\tmargin: .5rem 0;\n}\ndiv.input-wrapper {\n\tdisplay: grid;\n\tmargin-top: 1rem;\n\tgrid-template-columns: 2fr 1fr;\n\tgap: 1rem;\n\tposition: relative;\n\tjustify-content: space-around;\n}\ndiv.input-wrapper > [name] {\n\tgrid-column: 1 / 2;\n}\ndiv.input-wrapper > .width {\n\twidth: 100%;\n\ttext-align: center;\n\tborder-bottom: 1px dashed black;\n}\ndiv.input-wrapper > .height {\n\talign-content: center;\n\tgrid-column: 2 / 3;\n\tborder-left: 1px dashed black;\n\tpadding-left: 1rem;\n\tcontent: \"hello\";\n}\ndiv.input-wrapper > .left-padding {\n\twidth: 0.5rem;\n\tgrid-column: 1 / 2;\n\twhite-space: nowrap;\n\toverflow: visible;\n\tposition: relative;\n\tcursor: default;\n}\ndiv.input-wrapper > .left-padding::before {\n\tcontent: \"\";\n\tposition: absolute;\n\twidth: 100%;\n\ttop: 1.5rem;\n\tbottom: -1rem;\n\tborder: 1px dashed black;\n\tz-index: 2;\n}\ndiv.input-wrapper > .left-padding:hover::before { \n\tbottom: -100vh;\n}\n\n\n/* --- vertical --- */\n\n:host.vertical {\n\twidth: 100%;\n\trow-gap: 0;\n\tposition: relative;\n}\n:host.vertical > div.input-wrapper {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fill, 14rem);\n\tgap: .5rem;\n}\n:host.vertical > div.input-wrapper > .width,\n:host.vertical > div.input-wrapper > .height,\n:host.vertical > div.input-wrapper > .left-padding {\n\tdisplay: none;\n}\n\n\n:host.vertical > div.input-wrapper > .guide-lines::before,\n:host.vertical > div.input-wrapper > .guide-lines::after {\n\tcontent: \"\";\n\tpointer-events: none;\n\tright: 0;\n\twidth: 100vw;\n\tposition: absolute;\n\tz-index: 2;\n\tborder-top: 1px dotted black;\n}\n\n:host:not(.vertical) .guide-lines {\n\tdisplay: none;\n}\n\n.guide-lines {\n\ttext-align: end;\n\tjustify-self: center;\n align-content: center;\n}\n\n.guide-lines::before {\n\ttop: 1rem;\n}\n.guide-lines::after {\n\ttop: 2rem;\n}\n.guide-lines.show-label::before {\n\ttop: 1.05rem;\n}\n.guide-lines.show-label::after {\n\ttop: 2.3rem;\n}\n","import { Component, Element, h, Host, State } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\nimport { Color } from \"../../../../model\"\nimport { Looks } from \"../../Looks\"\n\ntype Options = {\n\tlooks?: Looks\n\treadonly?: boolean\n\tcolor?: Color\n\tvertical?: boolean\n\tshowLabel?: boolean\n\tplaceholder?: boolean\n\tborderRadius?: number\n}\n\n@Component({\n\ttag: \"smoothly-input-demo-standard\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputDemoStandard {\n\t@Element() element: HTMLElement\n\t@State() duration: isoly.TimeSpan = { hours: 8 }\n\t@State() options: Options = { showLabel: true }\n\n\tconnectedCallback() {\n\t\tthis.updateInputHeightText()\n\t}\n\tcomponentDidRender() {\n\t\tthis.updateInputHeightText()\n\t}\n\n\tupdateInputHeightText() {\n\t\tconst rootFontSize = Number(getComputedStyle(document.documentElement).fontSize.replace(\"px\", \"\"))\n\t\tthis.element.querySelectorAll(\".height\").forEach((el: HTMLDivElement) => {\n\t\t\tconst height = el.clientHeight\n\t\t\tel.innerHTML = `<b>${height / rootFontSize}rem</b> (${height}pixels)`\n\t\t})\n\t}\n\n\trender() {\n\t\tconst placeholder = this.options.placeholder ? \"placeholder\" : undefined\n\t\treturn (\n\t\t\t<Host class={{ vertical: !!this.options.vertical }}>\n\t\t\t\t<div class=\"description\">\n\t\t\t\t\t<h2>Input Standard</h2>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tHeight of input should be <code>3rem</code> including border. This is should result in a 48 pixel height at\n\t\t\t\t\t\t100% zoom, assuming a root font-size of 16 pixels.\n\t\t\t\t\t</p>\n\t\t\t\t\t<smoothly-form looks={\"grid\"} onSmoothlyFormInput={(e: CustomEvent<Options>) => (this.options = e.detail)}>\n\t\t\t\t\t\t<smoothly-input-select name=\"looks\">\n\t\t\t\t\t\t\t<span slot=\"label\">Looks</span>\n\t\t\t\t\t\t\t{Looks.types.map(l => (\n\t\t\t\t\t\t\t\t<smoothly-item value={l}>{l}</smoothly-item>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"readonly\">Readonly</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-select name=\"color\">\n\t\t\t\t\t\t\t<span slot=\"label\">Color</span>\n\t\t\t\t\t\t\t{Color.types.map(c => (\n\t\t\t\t\t\t\t\t<smoothly-item value={c}>\n\t\t\t\t\t\t\t\t\t<span color={c}>{c}</span>\n\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"vertical\">Vertical Layout</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"showLabel\" checked={this.options.showLabel}>\n\t\t\t\t\t\t\tShow Label\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"placeholder\" checked={this.options.placeholder}>\n\t\t\t\t\t\t\tPlaceholder\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-range\n\t\t\t\t\t\t\tlabel={\"Border Radius (rem)\"}\n\t\t\t\t\t\t\tname={\"borderRadius\"}\n\t\t\t\t\t\t\tvalue={this.options.borderRadius}\n\t\t\t\t\t\t\tmin={0}\n\t\t\t\t\t\t\tmax={2}\n\t\t\t\t\t\t\tstep={0.25}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</smoothly-form>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"input-wrapper\" style={{ \"--smoothly-input-border-radius\": `${this.options.borderRadius}rem` }}>\n\t\t\t\t\t<div class=\"width\">100%</div>\n\t\t\t\t\t<div class=\"left-padding\">0.5rem - left padding</div>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"text\"\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span>Text</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-select\n\t\t\t\t\t\tname=\"month\"\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}>\n\t\t\t\t\t\t{this.options.showLabel && <label slot=\"label\">Select</label>}\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-checkbox\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}>\n\t\t\t\t\t\tCheck\n\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-radio\n\t\t\t\t\t\tname=\"radio\"\n\t\t\t\t\t\tclearable\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <label slot=\"label\">Radio</label>}\n\t\t\t\t\t\t<smoothly-input-radio-item value={\"first\"}>Label 1</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item selected value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item value={\"third\"}>Label 3</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-file\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span slot={\"label\"}>File</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-range\n\t\t\t\t\t\tname={\"range\"}\n\t\t\t\t\t\tlabel={this.options.showLabel ? \"Range\" : undefined}\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}>\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-color\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span>Color</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-color>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-date\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span>Date</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span>Date Range</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-date-range>\n\t\t\t\t\t<div class=\"height\"></div>\n\t\t\t\t\t<div class={{ \"guide-lines\": true, \"show-label\": !!this.options.showLabel }}>\n\t\t\t\t\t\t{this.options.showLabel ? \"Aligned labels & values\" : \"Center values\"}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
1	+ {"file":"p-1390a195.js","mappings":"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","names":[],"sources":["src/components/input/demo/standard/style.css?tag=smoothly-input-demo-standard&encapsulation=scoped","src/components/input/demo/standard/index.tsx"],"sourcesContent":[":host {\n\twidth: 50%;\n\tmargin: auto;\n}\n\n:host h2,\n:host p {\n\tmargin: .5rem 0;\n}\ndiv.input-wrapper {\n\tdisplay: grid;\n\tmargin-top: 1rem;\n\tgrid-template-columns: 2fr 1fr;\n\tgap: 1rem;\n\tposition: relative;\n\tjustify-content: space-around;\n}\ndiv.input-wrapper > [name] {\n\tgrid-column: 1 / 2;\n}\ndiv.input-wrapper > .width {\n\twidth: 100%;\n\ttext-align: center;\n\tborder-bottom: 1px dashed black;\n}\ndiv.input-wrapper > .height {\n\talign-content: center;\n\tgrid-column: 2 / 3;\n\tborder-left: 1px dashed black;\n\tpadding-left: 1rem;\n\tcontent: \"hello\";\n}\ndiv.input-wrapper > .left-padding {\n\twidth: 0.5rem;\n\tgrid-column: 1 / 2;\n\twhite-space: nowrap;\n\toverflow: visible;\n\tposition: relative;\n\tcursor: default;\n}\ndiv.input-wrapper > .left-padding::before {\n\tcontent: \"\";\n\tposition: absolute;\n\twidth: 100%;\n\ttop: 1.5rem;\n\tbottom: -1rem;\n\tborder: 1px dashed black;\n\tz-index: 2;\n}\ndiv.input-wrapper > .left-padding:hover::before { \n\tbottom: -100vh;\n}\n\n\n/* --- vertical --- */\n\n:host.vertical {\n\twidth: 100%;\n\trow-gap: 0;\n\tposition: relative;\n}\n:host.vertical > div.input-wrapper {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(auto-fill, 14rem);\n\tgap: .5rem;\n}\n:host.vertical > div.input-wrapper > .width,\n:host.vertical > div.input-wrapper > .height,\n:host.vertical > div.input-wrapper > .left-padding {\n\tdisplay: none;\n}\n\n\n:host.vertical > div.input-wrapper > .guide-lines::before,\n:host.vertical > div.input-wrapper > .guide-lines::after {\n\tcontent: \"\";\n\tpointer-events: none;\n\tright: 0;\n\twidth: 100vw;\n\tposition: absolute;\n\tz-index: 2;\n\tborder-top: 1px dotted black;\n}\n\n:host:not(.vertical) .guide-lines {\n\tdisplay: none;\n}\n\n.guide-lines {\n\ttext-align: end;\n\tjustify-self: center;\n align-content: center;\n}\n\n.guide-lines::before {\n\ttop: 1rem;\n}\n.guide-lines::after {\n\ttop: 2rem;\n}\n.guide-lines.show-label::before {\n\ttop: 1.05rem;\n}\n.guide-lines.show-label::after {\n\ttop: 2.3rem;\n}\n","import { Component, Element, h, Host, State } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\nimport { Color } from \"../../../../model\"\nimport { Looks } from \"../../Looks\"\n\ntype Options = {\n\tlooks?: Looks\n\treadonly?: boolean\n\tcolor?: Color\n\tvertical?: boolean\n\tshowLabel?: boolean\n\tplaceholder?: boolean\n\tborderRadius?: number\n}\n\n@Component({\n\ttag: \"smoothly-input-demo-standard\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputDemoStandard {\n\t@Element() element: HTMLElement\n\t@State() duration: isoly.TimeSpan = { hours: 8 }\n\t@State() options: Options = { showLabel: true }\n\n\tconnectedCallback() {\n\t\tthis.updateInputHeightText()\n\t}\n\tcomponentDidRender() {\n\t\tthis.updateInputHeightText()\n\t}\n\n\tupdateInputHeightText() {\n\t\tconst rootFontSize = Number(getComputedStyle(document.documentElement).fontSize.replace(\"px\", \"\"))\n\t\tthis.element.querySelectorAll(\".height\").forEach((el: HTMLDivElement) => {\n\t\t\tconst height = el.clientHeight\n\t\t\tel.innerHTML = `<b>${height / rootFontSize}rem</b> (${height}pixels)`\n\t\t})\n\t}\n\n\trender() {\n\t\tconst placeholder = this.options.placeholder ? \"placeholder\" : undefined\n\t\treturn (\n\t\t\t<Host class={{ vertical: !!this.options.vertical }}>\n\t\t\t\t<div class=\"description\">\n\t\t\t\t\t<h2>Input Standard</h2>\n\t\t\t\t\t<p>\n\t\t\t\t\t\tHeight of input should be <code>3rem</code> including border. This is should result in a 48 pixel height at\n\t\t\t\t\t\t100% zoom, assuming a root font-size of 16 pixels.\n\t\t\t\t\t</p>\n\t\t\t\t\t<smoothly-form looks={\"grid\"} onSmoothlyFormInput={(e: CustomEvent<Options>) => (this.options = e.detail)}>\n\t\t\t\t\t\t<smoothly-input-select name=\"looks\">\n\t\t\t\t\t\t\t<span slot=\"label\">Looks</span>\n\t\t\t\t\t\t\t{Looks.types.map(l => (\n\t\t\t\t\t\t\t\t<smoothly-item value={l}>{l}</smoothly-item>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"readonly\">Readonly</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-select name=\"color\">\n\t\t\t\t\t\t\t<span slot=\"label\">Color</span>\n\t\t\t\t\t\t\t{Color.types.map(c => (\n\t\t\t\t\t\t\t\t<smoothly-item value={c}>\n\t\t\t\t\t\t\t\t\t<span color={c}>{c}</span>\n\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"vertical\">Vertical Layout</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"showLabel\" checked={this.options.showLabel}>\n\t\t\t\t\t\t\tShow Label\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"placeholder\" checked={this.options.placeholder}>\n\t\t\t\t\t\t\tPlaceholder\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-range\n\t\t\t\t\t\t\tlabel={\"Border Radius (rem)\"}\n\t\t\t\t\t\t\tname={\"borderRadius\"}\n\t\t\t\t\t\t\tvalue={this.options.borderRadius}\n\t\t\t\t\t\t\tmin={0}\n\t\t\t\t\t\t\tmax={2}\n\t\t\t\t\t\t\tstep={0.25}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</smoothly-form>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"input-wrapper\" style={{ \"--smoothly-input-border-radius\": `${this.options.borderRadius}rem` }}>\n\t\t\t\t\t<div class=\"width\">100%</div>\n\t\t\t\t\t<div class=\"left-padding\">0.5rem - left padding</div>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"text\"\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span>Text</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-select\n\t\t\t\t\t\tname=\"month\"\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}>\n\t\t\t\t\t\t{this.options.showLabel && <label slot=\"label\">Select</label>}\n\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-checkbox\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}>\n\t\t\t\t\t\tCheck\n\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-radio\n\t\t\t\t\t\tname=\"radio\"\n\t\t\t\t\t\tclearable\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <label slot=\"label\">Radio</label>}\n\t\t\t\t\t\t<smoothly-input-radio-item value={\"first\"}>Label 1</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item selected value={\"second\"}>\n\t\t\t\t\t\t\tLabel 2\n\t\t\t\t\t\t</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item value={\"third\"}>Label 3</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-file\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span slot={\"label\"}>File</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-file>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-range\n\t\t\t\t\t\tname={\"range\"}\n\t\t\t\t\t\tlabel={this.options.showLabel ? \"Range\" : undefined}\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}>\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-range>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-color\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span>Color</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-color>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-date\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span>Date</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<div class=\"height\"></div>\n\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tlooks={this.options.looks}\n\t\t\t\t\t\treadonly={this.options.readonly}\n\t\t\t\t\t\tcolor={this.options.color}\n\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\tshowLabel={this.options.showLabel}>\n\t\t\t\t\t\t{this.options.showLabel && <span>Date Range</span>}\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" />\n\t\t\t\t\t</smoothly-input-date-range>\n\t\t\t\t\t<div class=\"height\"></div>\n\t\t\t\t\t<div class={{ \"guide-lines\": true, \"show-label\": !!this.options.showLabel }}>\n\t\t\t\t\t\t{this.options.showLabel ? \"Aligned labels & values\" : \"Center values\"}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-7a45faec.js → p-172f7392.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f765921a.js';
 import { E as Editable } from './p-b0d7a2e6.js';
 import { d as defineCustomElement$2 } from './p-7d0eafb0.js';
-import { d as defineCustomElement$1 } from './p-4922697f.js';
+import { d as defineCustomElement$1 } from './p-8e748704.js';
 const styleCss = "[color=default].sc-smoothly-input-edit{--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-edit{--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-edit{--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-edit{--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-edit{--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-edit{--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-edit{--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-edit{--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-edit{--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-edit{--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-edit-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-edit-h{--smoothly-button-border-radius:2rem}[type=link].sc-smoothly-input-edit-h{display:inline}[disabled].sc-smoothly-input-edit-h{opacity:0.5;pointer-events:none}.sc-smoothly-input-edit-h>a.sc-smoothly-input-edit,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{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-edit-h>a.sc-smoothly-input-edit:empty,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:empty{border-width:0}.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-weight:bold;justify-content:center;height:100%;width:100%;border-radius:var(--smoothly-button-border-radius);align-items:center}.sc-smoothly-input-edit-h:not([size=icon]):not([size=flexible])>button.sc-smoothly-input-edit{padding:0.8em;min-width:8em}.sc-smoothly-input-edit-h:not([size=icon]):not([size=flexible]):has(smoothly-icon)>button.sc-smoothly-input-edit{padding:0.6em}[size=icon].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{padding:0.5em}[type=button].sc-smoothly-input-edit-h>a.sc-smoothly-input-edit{text-align:center;text-decoration:inherit;width:calc(100% - 0.6em)}[size=small].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-size:100%}[size=large].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{font-size:130%}.sc-smoothly-input-edit-h:not([size=icon]){min-width:8em}[size=flexible].sc-smoothly-input-edit-h{min-width:unset;padding:0;margin:0;display:flex;justify-content:center;align-items:center}[size=flexible].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{min-width:unset;padding:0;margin:0}[expand].sc-smoothly-input-edit-h{width:100%}[expand=full].sc-smoothly-input-edit-h{border-left:none;border-right:none;--smoothly-button-border-radius:0}[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit{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-edit-h:not([fill=clear])>button.sc-smoothly-input-edit:hover,.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:focus-visible,[fill=outline].sc-smoothly-input-edit-h:active>button.sc-smoothly-input-edit::before{border-color:rgb(var(--smoothly-button-focus-color))}[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:hover::before,[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit:focus-within::before,[fill=outline].sc-smoothly-input-edit-h>button.sc-smoothly-input-edit: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-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:hover,.sc-smoothly-input-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:focus-visible,.sc-smoothly-input-edit-h:not([fill=clear]):not([fill=outline])>button.sc-smoothly-input-edit:active{background:rgb(var(--smoothly-button-hover-background))}.sc-smoothly-input-edit-h>button.sc-smoothly-input-edit,.sc-smoothly-input-edit-h.sc-smoothly-input-edit-s>smoothly-icon,.sc-smoothly-input-edit-h .sc-smoothly-input-edit-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-edit-h{display:none}.sc-smoothly-input-edit-h:not([display]){display:none}[editable].sc-smoothly-input-edit-h{opacity:0.5}.sc-smoothly-input-edit-h[type=\"input\"].sc-smoothly-input-edit-s>smoothly-button>button{cursor:pointer;filter:opacity(60%);--smoothly-button-foreground:var(--smoothly-input-foreground);background-color:transparent}.sc-smoothly-input-edit-h smoothly-icon.default.sc-smoothly-input-edit{transform:translate(.1em, -.1em)}.sc-smoothly-input-edit-h.sc-smoothly-input-edit-s>button>*+smoothly-icon{display:none}";
 const SmoothlyInputEditStyle0 = styleCss;
@@ -37,7 +37,7 @@ const SmoothlyInputEdit = proxyCustomElement(class SmoothlyInputEdit extends H {
     }
     render() {
         var _a;
-        return (h(Host, { key: '0b15d6fa5f06856dcf50fa85e6c70574cfb8f22e', title: this.toolTip }, h("smoothly-button", { key: 'ac8f4e69cc564c1c580b8d9650626f9c34486d0e', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined) }, h("slot", { key: 'dedf30644a1b42cfdf39be7df53094457da4e698' }), h("smoothly-icon", { key: 'f1237a29936486379e732f82f47595643e45596f', class: "default", name: "create-outline", size: "tiny" }))));
+        return (h(Host, { key: 'c4187c46bdcb80dac6991e3b3e72cb04a1f019db', title: this.toolTip }, h("smoothly-button", { key: '44d5368b74918d0686d13f03a5c915630e5a80e7', disabled: this.disabled, size: this.size, type: "button", shape: this.shape, expand: this.expand, color: this.color, fill: (_a = this.fill) !== null && _a !== void 0 ? _a : (this.type == "input" ? "clear" : undefined) }, h("slot", { key: 'fcdc2c3e243dd00405415fc700a466a62e4b3c1a' }), h("smoothly-icon", { key: 'b653b0fb812c845b15d56096052e2672e019aadf', class: "default", name: "create-outline", size: "tiny" }))));
     }
     static get style() { return SmoothlyInputEditStyle0; }
 }, [6, "smoothly-input-edit", {
@@ -78,4 +78,4 @@ defineCustomElement();
 export { SmoothlyInputEdit as S, defineCustomElement as d };
-//# sourceMappingURL=p-7a45faec.js.map
+//# sourceMappingURL=p-172f7392.js.map

package/dist/components/{p-7a45faec.js.map → p-172f7392.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~7a45faec~~.js","mappings":";;;;;AAAA,MAAM,QAAQ,GAAG,qoNAAqoN,CAAC;AACvpN,gCAAe,QAAQ;;MCQV,iBAAiB;;;;;qBAEL,UAAU;;;wBAGiB,KAAK;uBACN,IAAI;;oBAEJ,OAAO;;uBAEvC,MAAM;;IAExB,iBAAiB;QAChB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,MAAM;YACjC,IAAI,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE;gBAC7B,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;gBACpB,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,OAAM,CAAC;oBAC/B,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,QAAQ,CAAA;iBACzB,CAAC,CAAA;aACF;SACD,CAAC,CAAA;KACF;IAED,YAAY;;QACX,MAAA,IAAI,CAAC,MAAM,0CAAE,IAAI,CAAC,IAAI,CAAC,CAAA;KACvB;IAED,MAAM;;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,OAAO,IACxB,wEACC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,oCAAK,IAAI,CAAC,IAAI,IAAI,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC,IAC/D,8DAAQ,EACR,sEAAe,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,GAAG,CAClD,CACZ,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/input/edit/style.css?tag=smoothly-input-edit&encapsulation=scoped","src/components/input/edit/index.tsx"],"sourcesContent":["@import \"../../button/style.css\";\n\n:host(:not([display])) {\n\tdisplay: none;\n}\n\n:host([editable]){\n\topacity: 0.5;\n}\n\n:host([type=\"input\"])::slotted(smoothly-button>button) {\n\tcursor: pointer;\n\tfilter: opacity(60%);\n\t--smoothly-button-foreground: var(--smoothly-input-foreground);\n\tbackground-color: transparent;\n}\n\n:host smoothly-icon.default {\n\ttransform: translate(.1em, -.1em);\n}\n\n:host::slotted(button > * > * + smoothly-icon) {\n\tdisplay: none;\n}\n","import { Component, ComponentWillLoad, Event, EventEmitter, h, Host, Listen, Prop, VNode } from \"@stencil/core\"\nimport { Color, Fill } from \"../../../model\"\nimport { Editable } from \"../Editable\"\n\n@Component({\n\ttag: \"smoothly-input-edit\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputEdit implements ComponentWillLoad {\n\tprivate parent?: Editable\n\t@Prop() color?: Color = \"tertiary\"\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 = true\n\t@Prop({ reflect: true }) shape?: \"rounded\"\n\t@Prop({ reflect: true }) type: \"form\" \| \"input\" = \"input\"\n\t@Prop({ reflect: true }) size: \"flexible\" \| \"small\" \| \"large\" \| \"icon\"\n\t@Prop() toolTip = \"Edit\"\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: Editable) => void>\n\tcomponentWillLoad(): void {\n\t\tthis.smoothlyInputLoad.emit(parent => {\n\t\t\tif (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})\n\t\t\t}\n\t\t})\n\t}\n\t@Listen(\"click\")\n\tclickHandler() {\n\t\tthis.parent?.edit(true)\n\t}\n\n\trender(): VNode \| VNode[] {\n\t\treturn (\n\t\t\t<Host title={this.toolTip}>\n\t\t\t\t<smoothly-button\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\tsize={this.size}\n\t\t\t\t\ttype={\"button\"}\n\t\t\t\t\tshape={this.shape}\n\t\t\t\t\texpand={this.expand}\n\t\t\t\t\tcolor={this.color}\n\t\t\t\t\tfill={this.fill ?? (this.type == \"input\" ? \"clear\" : undefined)}>\n\t\t\t\t\t<slot />\n\t\t\t\t\t<smoothly-icon class=\"default\" name=\"create-outline\" size=\"tiny\" />\n\t\t\t\t</smoothly-button>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
1	+ {"file":"p-172f7392.js","mappings":";;;;;AAAA,MAAM,QAAQ,GAAG,qoNAAqoN,CAAC;AACvpN,gCAAe,QAAQ;;MCQV,iBAAiB;;;;;qBAEL,UAAU;;;wBAGiB,KAAK;uBACN,IAAI;;oBAEJ,OAAO;;uBAEvC,MAAM;;IAExB,iBAAiB;QAChB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,MAAM;YACjC,IAAI,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE;gBAC7B,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;gBACpB,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,OAAM,CAAC;oBAC/B,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,QAAQ,CAAA;iBACzB,CAAC,CAAA;aACF;SACD,CAAC,CAAA;KACF;IAED,YAAY;;QACX,MAAA,IAAI,CAAC,MAAM,0CAAE,IAAI,CAAC,IAAI,CAAC,CAAA;KACvB;IAED,MAAM;;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,OAAO,IACxB,wEACC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,oCAAK,IAAI,CAAC,IAAI,IAAI,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC,IAC/D,8DAAQ,EACR,sEAAe,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,GAAG,CAClD,CACZ,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/input/edit/style.css?tag=smoothly-input-edit&encapsulation=scoped","src/components/input/edit/index.tsx"],"sourcesContent":["@import \"../../button/style.css\";\n\n:host(:not([display])) {\n\tdisplay: none;\n}\n\n:host([editable]){\n\topacity: 0.5;\n}\n\n:host([type=\"input\"])::slotted(smoothly-button>button) {\n\tcursor: pointer;\n\tfilter: opacity(60%);\n\t--smoothly-button-foreground: var(--smoothly-input-foreground);\n\tbackground-color: transparent;\n}\n\n:host smoothly-icon.default {\n\ttransform: translate(.1em, -.1em);\n}\n\n:host::slotted(button > * > * + smoothly-icon) {\n\tdisplay: none;\n}\n","import { Component, ComponentWillLoad, Event, EventEmitter, h, Host, Listen, Prop, VNode } from \"@stencil/core\"\nimport { Color, Fill } from \"../../../model\"\nimport { Editable } from \"../Editable\"\n\n@Component({\n\ttag: \"smoothly-input-edit\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputEdit implements ComponentWillLoad {\n\tprivate parent?: Editable\n\t@Prop() color?: Color = \"tertiary\"\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 = true\n\t@Prop({ reflect: true }) shape?: \"rounded\"\n\t@Prop({ reflect: true }) type: \"form\" \| \"input\" = \"input\"\n\t@Prop({ reflect: true }) size: \"flexible\" \| \"small\" \| \"large\" \| \"icon\"\n\t@Prop() toolTip = \"Edit\"\n\t@Event() smoothlyInputLoad: EventEmitter<(parent: Editable) => void>\n\tcomponentWillLoad(): void {\n\t\tthis.smoothlyInputLoad.emit(parent => {\n\t\t\tif (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})\n\t\t\t}\n\t\t})\n\t}\n\t@Listen(\"click\")\n\tclickHandler() {\n\t\tthis.parent?.edit(true)\n\t}\n\n\trender(): VNode \| VNode[] {\n\t\treturn (\n\t\t\t<Host title={this.toolTip}>\n\t\t\t\t<smoothly-button\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\tsize={this.size}\n\t\t\t\t\ttype={\"button\"}\n\t\t\t\t\tshape={this.shape}\n\t\t\t\t\texpand={this.expand}\n\t\t\t\t\tcolor={this.color}\n\t\t\t\t\tfill={this.fill ?? (this.type == \"input\" ? \"clear\" : undefined)}>\n\t\t\t\t\t<slot />\n\t\t\t\t\t<smoothly-icon class=\"default\" name=\"create-outline\" size=\"tiny\" />\n\t\t\t\t</smoothly-button>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-040802e2.js → p-192dca7c.js} RENAMED Viewed

@@ -28,7 +28,7 @@ const SmoothlyTabs = proxyCustomElement(class SmoothlyTabs extends H {
             old.open = false;
     }
     render() {
-        return (h(Host, { key: '13265df1e5924c455ab8b94b2e1d3942722120c5', style: { "--tabs": `${this.tabs.length}` } }, h("slot", { key: 'ef457b562f8ea6c2d00f52c1049ae644bc0fadba' })));
+        return (h(Host, { key: '62320fc166667791415c62201ecf1401858ee49c', style: { "--tabs": `${this.tabs.length}` } }, h("slot", { key: '12f62cda12d9dd8d6a9359fd9248fcd50fe42ff5' })));
     }
     get element() { return this; }
     static get watchers() { return {
@@ -58,4 +58,4 @@ defineCustomElement();
 export { SmoothlyTabs as S, defineCustomElement as d };
-//# sourceMappingURL=p-040802e2.js.map
+//# sourceMappingURL=p-192dca7c.js.map

package/dist/components/{p-040802e2.js.map → p-192dca7c.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~040802e2~~.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,gHAAgH,CAAC;AAClI,2BAAe,QAAQ;;MCMV,YAAY;;;;;oBAEO,EAAE;;;IAKjC,WAAW,CAAC,KAAkB;QAC7B,IAAI,KAAK,CAAC,MAAM,YAAYA,CAAW,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;YAC7E,IAAI,CAAC,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,CAAA;SACxC;KACD;IAGD,WAAW,CAAC,KAAkB;QAC7B,IAAI,KAAK,CAAC,MAAM,IAAI,IAAI,CAAC,OAAO,EAAE;YACjC,KAAK,CAAC,eAAe,EAAE,CAAA;YACvB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,MAAgC,CAAA;YAC7D,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAA;SACvC;KACD;IAED,gBAAgB,CAAC,KAA6B,EAAE,GAA2B;QAC1E,IAAI,GAAG;YACN,GAAG,CAAC,IAAI,GAAG,KAAK,CAAA;KACjB;IAED,MAAM;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,IAC/C,8DAAa,CACP,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["HTMLElement"],"sources":["src/components/tabs/style.css?tag=smoothly-tabs&encapsulation=scoped","src/components/tabs/index.tsx"],"sourcesContent":[":host {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(var(--tabs), auto);\n\tgrid-template-rows: auto auto;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Listen, State, Watch } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-tabs\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTabs {\n\t@Element() element: HTMLSmoothlyTabsElement\n\t@State() tabs: HTMLElement[] = []\n\t@State() selectedElement: HTMLSmoothlyTabElement\n\t@Event() smoothlyTabOpen: EventEmitter<string>\n\n\t@Listen(\"smoothlyTabLoad\")\n\tonInputLoad(event: CustomEvent) {\n\t\tif (event.target instanceof HTMLElement && !this.tabs.includes(event.target)) {\n\t\t\tthis.tabs = [...this.tabs, event.target]\n\t\t}\n\t}\n\n\t@Listen(\"smoothlyTabOpen\")\n\topenChanged(event: CustomEvent) {\n\t\tif (event.target != this.element) {\n\t\t\tevent.stopPropagation()\n\t\t\tthis.selectedElement = event.target as HTMLSmoothlyTabElement\n\t\t\tthis.smoothlyTabOpen.emit(event.detail)\n\t\t}\n\t}\n\t@Watch(\"selectedElement\")\n\tonSelectedChange(value: HTMLSmoothlyTabElement, old: HTMLSmoothlyTabElement) {\n\t\tif (old)\n\t\t\told.open = false\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host style={{ \"--tabs\": `${this.tabs.length}` }}>\n\t\t\t\t<slot></slot>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
1	+ {"file":"p-192dca7c.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,gHAAgH,CAAC;AAClI,2BAAe,QAAQ;;MCMV,YAAY;;;;;oBAEO,EAAE;;;IAKjC,WAAW,CAAC,KAAkB;QAC7B,IAAI,KAAK,CAAC,MAAM,YAAYA,CAAW,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;YAC7E,IAAI,CAAC,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,CAAA;SACxC;KACD;IAGD,WAAW,CAAC,KAAkB;QAC7B,IAAI,KAAK,CAAC,MAAM,IAAI,IAAI,CAAC,OAAO,EAAE;YACjC,KAAK,CAAC,eAAe,EAAE,CAAA;YACvB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,MAAgC,CAAA;YAC7D,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAA;SACvC;KACD;IAED,gBAAgB,CAAC,KAA6B,EAAE,GAA2B;QAC1E,IAAI,GAAG;YACN,GAAG,CAAC,IAAI,GAAG,KAAK,CAAA;KACjB;IAED,MAAM;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,IAC/C,8DAAa,CACP,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["HTMLElement"],"sources":["src/components/tabs/style.css?tag=smoothly-tabs&encapsulation=scoped","src/components/tabs/index.tsx"],"sourcesContent":[":host {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(var(--tabs), auto);\n\tgrid-template-rows: auto auto;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Listen, State, Watch } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-tabs\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyTabs {\n\t@Element() element: HTMLSmoothlyTabsElement\n\t@State() tabs: HTMLElement[] = []\n\t@State() selectedElement: HTMLSmoothlyTabElement\n\t@Event() smoothlyTabOpen: EventEmitter<string>\n\n\t@Listen(\"smoothlyTabLoad\")\n\tonInputLoad(event: CustomEvent) {\n\t\tif (event.target instanceof HTMLElement && !this.tabs.includes(event.target)) {\n\t\t\tthis.tabs = [...this.tabs, event.target]\n\t\t}\n\t}\n\n\t@Listen(\"smoothlyTabOpen\")\n\topenChanged(event: CustomEvent) {\n\t\tif (event.target != this.element) {\n\t\t\tevent.stopPropagation()\n\t\t\tthis.selectedElement = event.target as HTMLSmoothlyTabElement\n\t\t\tthis.smoothlyTabOpen.emit(event.detail)\n\t\t}\n\t}\n\t@Watch(\"selectedElement\")\n\tonSelectedChange(value: HTMLSmoothlyTabElement, old: HTMLSmoothlyTabElement) {\n\t\tif (old)\n\t\t\told.open = false\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host style={{ \"--tabs\": `${this.tabs.length}` }}>\n\t\t\t\t<slot></slot>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-46e6dd30.js → p-19580a07.js} RENAMED Viewed

@@ -16,7 +16,7 @@ const SmoothlyNextTable = proxyCustomElement(class SmoothlyNextTable extends H {
         event.stopPropagation();
     }
     render() {
-        return (h(Host, { key: '30a81a52c27638385185481bf9c0f256d15a3297', style: { "--columns": this.columns.toString() } }, h("slot", { key: '912dc85f766b048986cbaddd696219c8ef5d57d5' })));
+        return (h(Host, { key: 'e538ea342947d71e09285019a9e38e778ecaa055', style: { "--columns": this.columns.toString() } }, h("slot", { key: 'c2b934edc4f7d7fe82fd65d5db9814298a17bbc7' })));
     }
     static get style() { return SmoothlyNextTableStyle0; }
 }, [6, "smoothly-next-table", {
@@ -39,4 +39,4 @@ defineCustomElement();
 export { SmoothlyNextTable as S, defineCustomElement as d };
-//# sourceMappingURL=p-46e6dd30.js.map
+//# sourceMappingURL=p-19580a07.js.map

package/dist/components/{p-46e6dd30.js.map → p-19580a07.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~46e6dd30~~.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,gOAAgO,CAAC;AAClP,gCAAe,QAAQ;;MCOV,iBAAiB;;;;uBACX,CAAC;;IAGnB,oCAAoC,CAAC,KAA0D;QAC9F,KAAK,CAAC,eAAe,EAAE,CAAA;KACvB;IAGD,qCAAqC,CAAC,KAA0D;QAC/F,KAAK,CAAC,eAAe,EAAE,CAAA;KACvB;IAED,MAAM;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAE,WAAW,EAAE,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,IACpD,8DAAQ,CACF,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/next/table/style.css?tag=smoothly-next-table&encapsulation=scoped","src/components/next/table/index.tsx"],"sourcesContent":[":host {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(var(--columns), auto);\n\tcolor: rgb(var(--smoothly-table-foreground));\n\tstroke: rgb(var(--smoothly-table-foreground));\n\tfill: rgb(var(--smoothly-table-foreground));\n}\n","import { Component, h, Host, Listen, Prop, VNode } from \"@stencil/core\"\nimport { SmoothlyNextTableExpandableCellCustomEvent } from \"../../../components\"\n\n@Component({\n\ttag: \"smoothly-next-table\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyNextTable {\n\t@Prop() columns = 1\n\n\t@Listen(\"smoothlyNextTableExpandableRowChange\")\n\tsmoothlyNextTableExpandableRowChange(event: SmoothlyNextTableExpandableCellCustomEvent<boolean>): void {\n\t\tevent.stopPropagation()\n\t}\n\n\t@Listen(\"smoothlyNextTableExpandableCellChange\")\n\tsmoothlyNextTableExpandableCellChange(event: SmoothlyNextTableExpandableCellCustomEvent<boolean>): void {\n\t\tevent.stopPropagation()\n\t}\n\n\trender(): VNode \| VNode[] {\n\t\treturn (\n\t\t\t<Host style={{ \"--columns\": this.columns.toString() }}>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
1	+ {"file":"p-19580a07.js","mappings":";;AAAA,MAAM,QAAQ,GAAG,gOAAgO,CAAC;AAClP,gCAAe,QAAQ;;MCOV,iBAAiB;;;;uBACX,CAAC;;IAGnB,oCAAoC,CAAC,KAA0D;QAC9F,KAAK,CAAC,eAAe,EAAE,CAAA;KACvB;IAGD,qCAAqC,CAAC,KAA0D;QAC/F,KAAK,CAAC,eAAe,EAAE,CAAA;KACvB;IAED,MAAM;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAE,WAAW,EAAE,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,IACpD,8DAAQ,CACF,EACP;KACD;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/next/table/style.css?tag=smoothly-next-table&encapsulation=scoped","src/components/next/table/index.tsx"],"sourcesContent":[":host {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(var(--columns), auto);\n\tcolor: rgb(var(--smoothly-table-foreground));\n\tstroke: rgb(var(--smoothly-table-foreground));\n\tfill: rgb(var(--smoothly-table-foreground));\n}\n","import { Component, h, Host, Listen, Prop, VNode } from \"@stencil/core\"\nimport { SmoothlyNextTableExpandableCellCustomEvent } from \"../../../components\"\n\n@Component({\n\ttag: \"smoothly-next-table\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyNextTable {\n\t@Prop() columns = 1\n\n\t@Listen(\"smoothlyNextTableExpandableRowChange\")\n\tsmoothlyNextTableExpandableRowChange(event: SmoothlyNextTableExpandableCellCustomEvent<boolean>): void {\n\t\tevent.stopPropagation()\n\t}\n\n\t@Listen(\"smoothlyNextTableExpandableCellChange\")\n\tsmoothlyNextTableExpandableCellChange(event: SmoothlyNextTableExpandableCellCustomEvent<boolean>): void {\n\t\tevent.stopPropagation()\n\t}\n\n\trender(): VNode \| VNode[] {\n\t\treturn (\n\t\t\t<Host style={{ \"--columns\": this.columns.toString() }}>\n\t\t\t\t<slot />\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/{p-2b19c666.js → p-1cd836ca.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-f765921a.js';
 import { a as get, S as Selection, b as State, c as StateEditor, g as getLocale } from './p-ebf469aa.js';
-import { I as Input } from './p-08d0d254.js';
-import { d as defineCustomElement$1 } from './p-4922697f.js';
+import { I as Input } from './p-de7367c4.js';
+import { d as defineCustomElement$1 } from './p-8e748704.js';
 var Deep;
 (function (Deep) {
@@ -387,7 +387,7 @@ const SmoothlyInput = proxyCustomElement(class SmoothlyInput extends H {
     }
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        return (h(Host, { key: 'd570a6df90112060966459ec070cc49670988162', class: { "has-value": ((_a = this.state) === null || _a === void 0 ? void 0 : _a.value) != undefined && ((_b = this.state) === null || _b === void 0 ? void 0 : _b.value) != "" }, onclick: () => { var _a; return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.focus(); } }, h("slot", { key: '99187b7b55f338947c3103d411069a6f5d04eaef', name: "start" }), h("div", { key: 'f0ff9602882718a92f178b29f7e702bc94076876' }, h("div", { key: 'f6f9d41e20311c5d21748eb4f2ef4ba43cf85114', class: "ghost" }, h("div", { key: 'a14612b0fe61fe024951bea1b5168a95efb73e33', class: "value" }, (_c = this.state) === null || _c === void 0 ? void 0 : _c.value), h("div", { key: 'd99405f3f2d1d6f5f6e62907e52eb397fdb02d82', class: "remainder" }, (_d = this.state) === null || _d === void 0 ? void 0 : _d.remainder)), h("input", { key: 'fabb2edec07c6a48503013ddc72f44e342b09d93', ref: (el) => (this.inputElement = el), color: this.color, name: this.name, type: (_e = this.state) === null || _e === void 0 ? void 0 : _e.type, inputmode: (_f = this.state) === null || _f === void 0 ? void 0 : _f.inputmode, placeholder: this.placeholder, required: this.required, autocomplete: (_g = this.autocomplete) !== null && _g !== void 0 ? _g : (_h = this.state) === null || _h === void 0 ? void 0 : _h.autocomplete, disabled: this.disabled, readOnly: this.readonly, pattern: ((_j = this.state) === null || _j === void 0 ? void 0 : _j.pattern) && ((_k = this.state) === null || _k === void 0 ? void 0 : _k.pattern.source), onKeyDown: event => {
+        return (h(Host, { key: '3fc905423d5254b46e48b2f433ea0339d00fcf19', class: { "has-value": ((_a = this.state) === null || _a === void 0 ? void 0 : _a.value) != undefined && ((_b = this.state) === null || _b === void 0 ? void 0 : _b.value) != "" }, onclick: () => { var _a; return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.focus(); } }, h("slot", { key: '61d0acc825f8c09c416320291991a9f7e8747635', name: "start" }), h("div", { key: '80a86d79a71c2e3706925fd2afcd1d4173784cfd' }, h("div", { key: '87275f36e4fdf6d02e85bec867b8d7d538e16269', class: "ghost" }, h("div", { key: '51ad2aabffe421d21f67b0f7c2353c3ee83f75e1', class: "value" }, (_c = this.state) === null || _c === void 0 ? void 0 : _c.value), h("div", { key: '3fa1c2a8ab779dd79de96a63425d5b5830ec9b38', class: "remainder" }, (_d = this.state) === null || _d === void 0 ? void 0 : _d.remainder)), h("input", { key: 'fa6c3c58f831f5a2f45786d2ed28244c9151d510', ref: (el) => (this.inputElement = el), color: this.color, name: this.name, type: (_e = this.state) === null || _e === void 0 ? void 0 : _e.type, inputmode: (_f = this.state) === null || _f === void 0 ? void 0 : _f.inputmode, placeholder: this.placeholder, required: this.required, autocomplete: (_g = this.autocomplete) !== null && _g !== void 0 ? _g : (_h = this.state) === null || _h === void 0 ? void 0 : _h.autocomplete, disabled: this.disabled, readOnly: this.readonly, pattern: ((_j = this.state) === null || _j === void 0 ? void 0 : _j.pattern) && ((_k = this.state) === null || _k === void 0 ? void 0 : _k.pattern.source), onKeyDown: event => {
                 this.state = this.stateHandler.onKeyDown(event, this.state);
                 if (event.key == "Enter")
                     this.smoothlyBlur.emit();
@@ -400,7 +400,7 @@ const SmoothlyInput = proxyCustomElement(class SmoothlyInput extends H {
                     if (Deep.notEqual(lastValue, this.stateHandler.getValue(this.state)))
                         this.smoothlyChange.emit({ [this.name]: this.stateHandler.getValue(this.state) });
                 }
-            } }), h("label", { key: '5ab290082747dad2c901ad348a680f6b47c0b52c', class: "label float-on-focus", htmlFor: this.name }, h("slot", { key: '0b2125cc9efef1d8e4bf279295429d0e40468080' })), h("smoothly-icon", { key: '75e73932b48bfebd2ba219c4ed02f0dc20d13d64', name: "alert-circle", color: "danger", fill: "clear", size: "small", toolTip: this.errorMessage })), h("slot", { key: 'f7bef2a0a645b33d96d2ee5873c2de29b7f35124', name: "end" })));
+            } }), h("label", { key: 'd5028b886068594878aafe45fbd0717ffb8fe967', class: "label float-on-focus", htmlFor: this.name }, h("slot", { key: 'a7d06eddc4e537e75097bb884cb04335a9094002' })), h("smoothly-icon", { key: '37a6af033a22bed6ec0ab7935826b9bb8bfe4b98', name: "alert-circle", color: "danger", fill: "clear", size: "small", toolTip: this.errorMessage })), h("slot", { key: 'ffeffc908bd319a22aa0c1d43ef4851e218275c1', name: "end" })));
     }
     get element() { return this; }
     static get watchers() { return {
@@ -470,4 +470,4 @@ defineCustomElement();
 export { SmoothlyInput as S, defineCustomElement as d };
-//# sourceMappingURL=p-2b19c666.js.map
+//# sourceMappingURL=p-1cd836ca.js.map