npm - smoothly - Versions diffs - 1.122.0 → 1.124.0 - Mend

smoothly 1.122.0 → 1.124.0

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

Files changed (366) hide show

package/dist/cjs/smoothly-submit.cjs.entry.js CHANGED Viewed

@@ -29,7 +29,7 @@ const SmoothlySubmit = class {
         (_a = this.parent) === null || _a === void 0 ? void 0 : _a.submit();
     }
     render() {
-        return (index.h(Submittable.Button, { key: '1bf07e4fa1cb07457467d9a1ff354a789d198351', disabled: this.disabled, type: this.type }, index.h("slot", { key: 'cfa1b6e14321cb83f410d2e897160fc9dfe029f0' })));
+        return (index.h(Submittable.Button, { key: '1d6d731855d4808f3a9f8af883d610db1d42632a', disabled: this.disabled, type: this.type }, index.h("slot", { key: 'ba3bd494d44ab7329ff1546a69988b91f20863b5' })));
     }
 };
 SmoothlySubmit.style = styleCss();

package/dist/cjs/smoothly-trigger-sink.cjs.entry.js CHANGED Viewed

@@ -24,7 +24,7 @@ const SmoothlyTriggerSink = class {
         }
     }
     render() {
-        return index.h("slot", { key: 'a4cf9c0d1480244dd05e88e8689d8aebd5177d09' });
+        return index.h("slot", { key: '51375c910fa0240a9466fa95bc06f3084b3f1eae' });
     }
 };
 SmoothlyTriggerSink.style = styleCss();

package/dist/cjs/smoothly-trigger-source.cjs.entry.js CHANGED Viewed

@@ -23,7 +23,7 @@ const SmoothlyTriggerSource = class {
         }, window);
     }
     render() {
-        return index.h("slot", { key: '5c9a3d827ccb03e4af75c6fdc51443bc21da9ee9' });
+        return index.h("slot", { key: '53bc731dcf567c61175d6959b5f9bcd9849ba6d0' });
     }
     get element() { return index.getElement(this); }
 };

package/dist/cjs/smoothly.cjs.js CHANGED Viewed

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy(JSON.parse("[[\"smoothly-app_99.cjs\",[[0,\"smoothly-app-demo\",{\"baseUrl\":[1,\"base-url\"]},[[8,\"smoothlyUrlChange\",\"urlChangeHandler\"]]],[2,\"smoothly-form-demo\"],[2,\"smoothly-input-demo\",{\"duration\":[32],\"alphanumeric\":[32]}],[2,\"smoothly-table-demo\"],[0,\"smoothly-button-demo\"],[2,\"smoothly-icon-demo\",{\"display\":[32],\"props\":[32]}],[2,\"smoothly-theme-demo\"],[0,\"smoothly-display-demo\",{\"downloadingSpinner\":[32]}],[2,\"smoothly-dialog-demo\",{\"openModal\":[32],\"openTallModal\":[32],\"showFrame\":[32]}],[260,\"smoothly-app\",{\"label\":[513],\"color\":[1],\"home\":[1],\"menuOpen\":[1540,\"menu-open\"],\"navBreakpoint\":[513,\"nav-breakpoint\"],\"mobileMode\":[32],\"selected\":[32],\"selectRoom\":[64]},[[8,\"popstate\",\"locationChangeHandler\"],[0,\"smoothlyRoomSelect\",\"roomSelectedHandler\"],[0,\"smoothlyRoomLoad\",\"roomLoadedHandler\"],[8,\"click\",\"clickHandler\"]],{\"selected\":[{\"selectedChanged\":0}]}],[262,\"smoothly-app-room\",{\"label\":[513],\"icon\":[513],\"disabled\":[516],\"path\":[1],\"selected\":[1540],\"content\":[16],\"paths\":[32],\"mobileMode\":[32],\"setMobileMode\":[64],\"getContent\":[64],\"setSelected\":[64]},[[8,\"smoothlyUrlUpdate\",\"setQuery\"]]],[2,\"smoothly-tabs-demo\",{\"extraTab1\":[32],\"extraTab2\":[32]}],[0,\"smoothly-notifier-demo\"],[2,\"smoothly-form-demo-pet\",{\"hasOwner\":[32],\"owner\":[32],\"value\":[32]}],[2,\"smoothly-input-demo-standard\",{\"duration\":[32],\"options\":[32]}],[2,\"smoothly-form-demo-all\"],[2,\"smoothly-input-demo-user-input\",{\"textIndex\":[32],\"selectIndex\":[32],\"checkboxChecked\":[32],\"radioIndex\":[32],\"rangeValue\":[32],\"colorIndex\":[32],\"dateValue\":[32],\"datetimeValue\":[32],\"dateRangeValue\":[32]}],[2,\"smoothly-form-demo-transparent\"],[2,\"smoothly-table-demo-group\"],[2,\"smoothly-form-demo-schedule\"],[2,\"smoothly-form-demo-typed\"],[2,\"smoothly-table-demo-colspan\"],[2,\"smoothly-table-demo-nested-no-cell\",{\"loadingIndex\":[32],\"loadedRows\":[32]}],[2,\"smoothly-form-demo-controlled\",{\"name\":[32],\"currency\":[32],\"date\":[32]},null,{\"name\":[{\"nameChanged\":0}]}],[2,\"smoothly-form-demo-date\"],[2,\"smoothly-form-demo-date-range\"],[2,\"smoothly-table-demo-filler-row\",{\"cats\":[32]}],[2,\"smoothly-table-demo-simple\"],[2,\"smoothly-button-demo-standard\",{\"props\":[32],\"heightText\":[32],\"lastButton\":[32]},null,{\"props\":[{\"updateInputHeightText\":0}]}],[2,\"smoothly-input-date-demo\",{\"date\":[32],\"alwaysShowGuide\":[32]}],[0,\"smoothly-input-color-demo\"],[0,\"smoothly-input-range-demo\"],[2,\"smoothly-form-demo-login\"],[2,\"smoothly-form-demo-prices\"],[2,\"smoothly-form-demo-card\"],[0,\"smoothly-display-demo-json\"],[2,\"smoothly-input-demo-radio\",{\"selected\":[32]},null,{\"selected\":[{\"selectedChange\":0}]}],[2,\"smoothly-theme-guide\"],[2,\"smoothly-input-price-demo\",{\"currencies\":[32],\"currency\":[32]}],[262,\"smoothly-notifier\",{\"icon\":[4],\"notices\":[32]},[[0,\"notice\",\"onNotice\"],[0,\"remove\",\"onRemove\"]]],[262,\"smoothly-theme-picker\",{\"element\":[1]}],[262,\"smoothly-dialog\",{\"color\":[513],\"open\":[1540],\"closable\":[516],\"header\":[513]},[[0,\"trigger\",\"TriggerListener\"]]],[2,\"smoothly-theme-colors\"],[2,\"smoothly-toggle-switch-demo\"],[2,\"smoothly-burger\",{\"open\":[1540]},[[0,\"click\",\"clickHandler\"]],{\"open\":[{\"openChanged\":0}]}],[262,\"smoothly-modal\",{\"open\":[1540],\"closable\":[516],\"align\":[513],\"closeModal\":[64],\"openModal\":[64]},null,{\"open\":[{\"openChanged\":0}]}],[2,\"smoothly-frame\",{\"url\":[1],\"name\":[513],\"origin\":[1],\"send\":[64]}],[262,\"smoothly-label\",{\"hue\":[2],\"description\":[1],\"shape\":[513]}],[2,\"smoothly-table-demo-nested-no-cell-inner\",{\"data\":[16]}],[2,\"smoothly-notification\",{\"notice\":[16],\"closable\":[4],\"icon\":[4],\"tick\":[32]},[[0,\"trigger\",\"onTrigger\"]],{\"notice\":[{\"onUpdatedNotice\":0}]}],[262,\"smoothly-table-filler-row\"],[2,\"smoothly-back-to-top\",{\"opacity\":[1],\"bottom\":[1],\"right\":[1],\"visible\":[32]}],[262,\"smoothly-summary\",{\"open\":[1540]}],[2,\"smoothly-theme-color\",{\"color\":[1]}],[262,\"smoothly-table-row-group\",{\"align\":[516],\"open\":[1540]}],[262,\"smoothly-table-foot\"],[2,\"smoothly-theme-color-variant\",{\"color\":[513],\"variant\":[513]}],[262,\"smoothly-input-edit\",{\"color\":[1],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"display\":[1540],\"shape\":[513],\"type\":[513],\"size\":[513],\"tooltip\":[1]},[[0,\"click\",\"clickHandler\"]]],[262,\"smoothly-lazy\",{\"show\":[1028],\"content\":[16]}],[262,\"smoothly-table-expandable-cell\",{\"span\":[514],\"open\":[1540],\"close\":[64]},null,{\"open\":[{\"openChange\":0}]}],[262,\"smoothly-table-expandable-row\",{\"open\":[1540]},null,{\"open\":[{\"openChange\":0}]}],[262,\"smoothly-input-date-time\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"readonly\":[1540],\"disabled\":[516],\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"value\":[1025],\"open\":[1028],\"showLabel\":[516,\"show-label\"],\"min\":[1],\"max\":[1],\"date\":[32],\"hour\":[32],\"minute\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"listen\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[8,\"click\",\"onWindowClick\"]],{\"name\":[{\"nameChange\":0}],\"date\":[{\"handleChange\":0}],\"hour\":[{\"handleChange\":0}],\"minute\":[{\"handleChange\":0}],\"value\":[{\"valueChange\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}]}],[2,\"smoothly-load-more\",{\"triggerMode\":[1,\"trigger-mode\"],\"name\":[1],\"multiple\":[4],\"inView\":[32]}],[262,\"smoothly-tab\",{\"label\":[1],\"name\":[1],\"tooltip\":[1],\"open\":[1540],\"disabled\":[516]},[[0,\"smoothlyInputLoad\",\"onInputLoad\"],[0,\"smoothlyInput\",\"onInputLoad\"]],{\"open\":[{\"openHandler\":0}]}],[262,\"smoothly-tabs\",{\"tabs\":[513],\"numberOfTabs\":[2,\"number-of-tabs\"],\"tabElements\":[32],\"selectedElement\":[32],\"removeTab\":[64]},[[0,\"smoothlyTabLoad\",\"onInputLoad\"],[0,\"smoothlyTabOpen\",\"openChanged\"]],{\"selectedElement\":[{\"onSelectedChange\":0}]}],[262,\"smoothly-trigger\",{\"color\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"name\":[1],\"value\":[8]},[[0,\"click\",\"onClick\"]]],[262,\"smoothly-table-cell\",{\"span\":[514]}],[262,\"smoothly-input-file\",{\"readonly\":[1540],\"disabled\":[516],\"accept\":[1],\"color\":[1537],\"looks\":[1537],\"camera\":[513],\"name\":[513],\"showLabel\":[516,\"show-label\"],\"value\":[1040],\"placeholder\":[1537],\"dragging\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64],\"binary\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"]],{\"name\":[{\"nameChange\":0}],\"value\":[{\"valueChanged\":0}]}],[262,\"smoothly-table\",{\"columns\":[2]},[[0,\"smoothlyTableExpandableRowChange\",\"smoothlyTableExpandableRowChange\"],[0,\"smoothlyTableExpandableCellChange\",\"smoothlyTableExpandableCellChange\"]]],[262,\"smoothly-table-body\"],[262,\"smoothly-table-head\",{\"scrolled\":[32],\"depth\":[32]}],[262,\"smoothly-input-color\",{\"value\":[1025],\"looks\":[1537],\"color\":[1537],\"readonly\":[1540],\"disabled\":[516],\"output\":[1],\"name\":[513],\"showLabel\":[516,\"show-label\"],\"open\":[32],\"sliderMode\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[8,\"click\",\"onWindowClick\"]],{\"name\":[{\"nameChange\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}],\"value\":[{\"valueChanged\":0}]}],[262,\"smoothly-table-row\",null,[[0,\"smoothlyTableExpandableCellRegister\",\"smoothlyTableExpandableCellRegisterHandler\"],[0,\"smoothlyTableExpandableCellChange\",\"smoothlyTableExpandableCellChangeHandler\"]]],[262,\"smoothly-input-date-range\",{\"locale\":[513],\"name\":[513],\"color\":[1537],\"looks\":[1537],\"readonly\":[1540],\"disabled\":[516],\"showLabel\":[516,\"show-label\"],\"start\":[1025],\"end\":[1025],\"placeholder\":[513],\"alwaysShowGuide\":[516,\"always-show-guide\"],\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"max\":[1],\"min\":[1],\"open\":[32],\"startHasText\":[32],\"endHasText\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64],\"clear\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[8,\"click\",\"onWindowClick\"]],{\"start\":[{\"startChanged\":0}],\"end\":[{\"endChanged\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}],\"name\":[{\"nameChange\":0}]}],[262,\"smoothly-input-checkbox\",{\"name\":[513],\"readonly\":[1540],\"disabled\":[516],\"checked\":[1540],\"value\":[16],\"looks\":[1537],\"color\":[1537],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"]],{\"name\":[{\"nameChange\":0}],\"disabled\":[{\"handleDisabledChange\":0}],\"readonly\":[{\"handleDisabledChange\":0}],\"checked\":[{\"elementCheck\":0}]}],[262,\"smoothly-input-range\",{\"value\":[1026],\"dual\":[4],\"looks\":[1537],\"color\":[1537],\"defined\":[1028],\"readonly\":[1540],\"disabled\":[516],\"type\":[1],\"min\":[2],\"max\":[2],\"name\":[513],\"step\":[2],\"outputSide\":[1,\"output-side\"],\"label\":[1],\"showInput\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"]],{\"name\":[{\"nameChange\":0}],\"value\":[{\"valueChanged\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}]}],[262,\"smoothly-input-date\",{\"locale\":[513],\"color\":[1537],\"looks\":[1537],\"name\":[513],\"readonly\":[1540],\"disabled\":[516],\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"placeholder\":[513],\"alwaysShowGuide\":[516,\"always-show-guide\"],\"value\":[1025],\"open\":[1028],\"max\":[1025],\"min\":[1025],\"showLabel\":[516,\"show-label\"],\"hasText\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"listen\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[8,\"click\",\"onWindowClick\"],[0,\"smoothlyDateSet\",\"dateSetHandler\"]],{\"name\":[{\"nameChange\":0}],\"value\":[{\"onValueChange\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}]}],[262,\"smoothly-input-clear\",{\"color\":[1],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"size\":[513],\"shape\":[513],\"display\":[1540],\"type\":[513],\"tooltip\":[1]},[[0,\"click\",\"clickHandler\"]]],[262,\"smoothly-input-reset\",{\"color\":[1],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"size\":[513],\"shape\":[513],\"display\":[1540],\"type\":[513],\"tooltip\":[1]},[[0,\"click\",\"clickHandler\"]]],[262,\"smoothly-input-radio-item\",{\"value\":[1032],\"selected\":[1540],\"looks\":[1537],\"name\":[1025],\"disabled\":[32]}],[2,\"smoothly-toggle-switch\",{\"checkmark\":[516],\"selected\":[1540],\"disabled\":[516],\"size\":[513],\"color\":[513],\"fill\":[513]}],[262,\"smoothly-input-radio\",{\"value\":[1032],\"looks\":[1537],\"color\":[1537],\"direction\":[513],\"clearable\":[4],\"readonly\":[1540],\"disabled\":[516],\"name\":[513],\"showLabel\":[516,\"show-label\"],\"listen\":[64],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyRadioItemRegister\",\"handleRegister\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"smoothlyRadioItemSelect\",\"smoothlyRadioInputHandler\"]],{\"name\":[{\"nameChange\":0}],\"value\":[{\"valueChanged\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}]}],[262,\"smoothly-input-submit\",{\"delete\":[516],\"color\":[1],\"icon\":[8],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"display\":[1540],\"shape\":[513],\"size\":[513],\"tooltip\":[1]}],[2,\"smoothly-date-text\",{\"locale\":[1],\"readonly\":[516],\"disabled\":[516],\"showLabel\":[516,\"show-label\"],\"value\":[1],\"parts\":[32],\"order\":[32],\"separator\":[32],\"focusedIndex\":[32],\"setValue\":[64],\"select\":[64],\"deselect\":[64]},[[0,\"beforeinput\",\"beforeInputHandler\"],[2,\"input\",\"inputHandler\"]],{\"parts\":[{\"partsHandler\":0}],\"focusedIndex\":[{\"focusedIndexHandler\":0}]}],[262,\"smoothly-calendar\",{\"month\":[1025],\"value\":[1025],\"start\":[1],\"end\":[1],\"max\":[1025],\"min\":[1025],\"doubleInput\":[516,\"double-input\"],\"startInternal\":[32],\"endInternal\":[32],\"jumpTo\":[64]},null,{\"start\":[{\"onStart\":0}],\"end\":[{\"onEnd\":0}]}],[262,\"smoothly-button-confirm\",{\"color\":[1],\"name\":[513],\"doubleClickTime\":[2,\"double-click-time\"],\"expand\":[513],\"fill\":[1],\"disabled\":[516],\"shape\":[1],\"size\":[1],\"clickTimeStamp\":[32]}],[262,\"smoothly-input-month\",{\"readonly\":[1540],\"color\":[513],\"looks\":[1537],\"name\":[513],\"value\":[1025],\"max\":[1025],\"min\":[1025],\"next\":[516],\"previous\":[516],\"inCalendar\":[516,\"in-calendar\"],\"showLabel\":[516,\"show-label\"],\"allowPreviousMonth\":[32],\"allowNextMonth\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"]],{\"value\":[{\"valueChanged\":0},{\"setAllowPreviousMonth\":0},{\"setAllowNextMonth\":0}],\"min\":[{\"setAllowPreviousMonth\":0}],\"max\":[{\"setAllowNextMonth\":0}],\"name\":[{\"nameChange\":0}]}],[260,\"smoothly-form\",{\"color\":[1537],\"value\":[1040],\"action\":[1],\"validator\":[16],\"type\":[1],\"readonly\":[1028],\"looks\":[513],\"name\":[513],\"prevent\":[4],\"processing\":[1040],\"removeInput\":[64],\"listen\":[64],\"submit\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlyKeydown\",\"smoothlyKeydownHandler\"],[8,\"smoothlyFormSubmit\",\"windowSubmitHandler\"],[0,\"smoothlyFormSubmit\",\"submitHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"smoothlyFormDisable\",\"smoothlyFormDisableHandler\"]],{\"value\":[{\"watchValue\":0}],\"readonly\":[{\"watchReadonly\":0}]}],[2,\"smoothly-display\",{\"type\":[1],\"label\":[1],\"value\":[8],\"collapseDepth\":[2,\"collapse-depth\"],\"toInteger\":[4,\"to-integer\"],\"currency\":[1],\"country\":[1],\"format\":[16]}],[2,\"smoothly-display-json\",{\"value\":[8],\"collapseDepth\":[2,\"collapse-depth\"]}],[262,\"smoothly-input\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"value\":[1032],\"type\":[513],\"required\":[516],\"showLabel\":[516,\"show-label\"],\"autocomplete\":[1],\"placeholder\":[513],\"disabled\":[516],\"readonly\":[1540],\"toInteger\":[4,\"to-integer\"],\"currency\":[513],\"min\":[2],\"max\":[2],\"pad\":[2],\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"copyable\":[516],\"right\":[516],\"initialValue\":[32],\"state\":[32],\"copied\":[32],\"getValue\":[64],\"setValue\":[64],\"setFocus\":[64],\"setSelection\":[64],\"listen\":[64],\"register\":[64],\"unregister\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64],\"setCustomInitialValue\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"input\",\"onEvent\"],[0,\"beforeinput\",\"onEvent\"]],{\"name\":[{\"nameChange\":0}],\"currency\":[{\"typeChange\":0}],\"type\":[{\"typeChange\":0}],\"state\":[{\"stateChange\":0}],\"value\":[{\"valueChange\":0}],\"disabled\":[{\"readonlyChange\":0}],\"readonly\":[{\"readonlyChange\":0}]}],[2,\"smoothly-spinner\",{\"size\":[513],\"overlay\":[516]}],[262,\"smoothly-input-select\",{\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"name\":[513],\"color\":[1537],\"looks\":[1537],\"showLabel\":[516,\"show-label\"],\"showSelected\":[1540,\"show-selected\"],\"readonly\":[1540],\"disabled\":[516],\"inCalendar\":[516,\"in-calendar\"],\"ordered\":[516],\"multiple\":[516],\"clearable\":[4],\"defined\":[1028],\"placeholder\":[520],\"menuHeight\":[1,\"menu-height\"],\"required\":[4],\"searchDisabled\":[4,\"search-disabled\"],\"mutable\":[4],\"open\":[32],\"selected\":[32],\"filter\":[32],\"addedItems\":[32],\"display\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"getItems\":[64],\"listen\":[64],\"reset\":[64],\"clear\":[64],\"edit\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[8,\"click\",\"onWindowClick\"],[0,\"smoothlyItemDOMChange\",\"onItemDomChange\"],[0,\"smoothlyItemSelect\",\"onItemSelect\"]],{\"name\":[{\"nameChange\":0}],\"selected\":[{\"onSelectedChange\":0}],\"required\":[{\"onRequiredChange\":0}],\"filter\":[{\"onFilterChange\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}],\"open\":[{\"onClosed\":0}]}],[2,\"smoothly-display-json-object\",{\"value\":[16],\"collapseDepth\":[2,\"collapse-depth\"],\"open\":[32],\"empty\":[32]}],[2,\"smoothly-display-json-primitive\",{\"value\":[8]}],[2,\"smoothly-display-json-record-key\",{\"value\":[8]}],[262,\"smoothly-item\",{\"value\":[8],\"selected\":[1540],\"marked\":[1540],\"disabled\":[516],\"deselectable\":[4],\"filter\":[64]},[[0,\"click\",\"clickHandler\"]],{\"selected\":[{\"selectedWatcher\":0}]}],[262,\"smoothly-button\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"tooltip\":[513],\"disabled\":[516],\"type\":[513],\"size\":[513],\"shape\":[513],\"link\":[1]}],[2,\"smoothly-icon\",{\"color\":[513],\"fill\":[513],\"name\":[513],\"size\":[513],\"rotate\":[514],\"flip\":[513],\"tooltip\":[1],\"latestPromise\":[32]},null,{\"tooltip\":[{\"nameChanged\":0}],\"name\":[{\"nameChanged\":0}]}]]],[\"smoothly-input-checkbox-demo.cjs\",[[2,\"smoothly-input-checkbox-demo\"]]],[\"smoothly-checkbox.cjs\",[[262,\"smoothly-checkbox\",{\"size\":[1],\"checked\":[1540],\"intermediate\":[1540],\"unavailable\":[516],\"disabled\":[516],\"name\":[513],\"value\":[8],\"t\":[32],\"toggle\":[64],\"clear\":[64]},null,{\"checked\":[{\"unavailableChanged\":0}],\"unavailable\":[{\"unavailableChanged\":0}]}]]],[\"smoothly-color.cjs\",[[262,\"smoothly-color\",{\"color\":[513]}]]],[\"smoothly-country.cjs\",[[2,\"smoothly-country\",{\"value\":[1],\"text\":[1],\"language\":[32]}]]],[\"smoothly-submit.cjs\",[[262,\"smoothly-submit\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"size\":[513],\"shape\":[513],\"prevent\":[4]},[[0,\"click\",\"clickHandler\"]]]]],[\"smoothly-trigger-sink.cjs\",[[262,\"smoothly-trigger-sink\",{\"context\":[16],\"destination\":[1],\"filter\":[1]},[[0,\"trigger\",\"TriggerListener\"]]]]],[\"smoothly-trigger-source.cjs\",[[262,\"smoothly-trigger-source\",{\"listen\":[1]}]]]]"), options);
+  return index.bootstrapLazy(JSON.parse("[[\"smoothly-app_99.cjs\",[[0,\"smoothly-app-demo\",{\"baseUrl\":[1,\"base-url\"]},[[8,\"smoothlyUrlChange\",\"urlChangeHandler\"]]],[2,\"smoothly-form-demo\"],[2,\"smoothly-input-demo\",{\"duration\":[32],\"alphanumeric\":[32]}],[2,\"smoothly-table-demo\"],[0,\"smoothly-button-demo\"],[2,\"smoothly-icon-demo\",{\"display\":[32],\"props\":[32]}],[2,\"smoothly-theme-demo\"],[0,\"smoothly-display-demo\",{\"downloadingSpinner\":[32]}],[2,\"smoothly-dialog-demo\",{\"openModal\":[32],\"openTallModal\":[32],\"showFrame\":[32]}],[260,\"smoothly-app\",{\"label\":[513],\"color\":[1],\"home\":[1],\"menuOpen\":[1540,\"menu-open\"],\"navBreakpoint\":[513,\"nav-breakpoint\"],\"mobileMode\":[32],\"selected\":[32],\"selectRoom\":[64]},[[8,\"popstate\",\"locationChangeHandler\"],[0,\"smoothlyRoomSelect\",\"roomSelectedHandler\"],[0,\"smoothlyRoomLoad\",\"roomLoadedHandler\"],[8,\"click\",\"clickHandler\"]],{\"selected\":[{\"selectedChanged\":0}]}],[262,\"smoothly-app-room\",{\"label\":[513],\"icon\":[513],\"disabled\":[516],\"path\":[1],\"selected\":[1540],\"content\":[16],\"paths\":[32],\"mobileMode\":[32],\"setMobileMode\":[64],\"getContent\":[64],\"setSelected\":[64]},[[8,\"smoothlyUrlUpdate\",\"setQuery\"]]],[2,\"smoothly-tabs-demo\",{\"extraTab1\":[32],\"extraTab2\":[32]}],[0,\"smoothly-notifier-demo\"],[2,\"smoothly-form-demo-pet\",{\"hasOwner\":[32],\"owner\":[32],\"value\":[32]}],[2,\"smoothly-input-demo-standard\",{\"duration\":[32],\"options\":[32]}],[2,\"smoothly-form-demo-all\"],[2,\"smoothly-input-demo-user-input\",{\"textIndex\":[32],\"selectIndex\":[32],\"checkboxChecked\":[32],\"radioIndex\":[32],\"rangeValue\":[32],\"colorIndex\":[32],\"dateValue\":[32],\"datetimeValue\":[32],\"dateRangeValue\":[32]}],[2,\"smoothly-form-demo-transparent\"],[2,\"smoothly-table-demo-group\"],[2,\"smoothly-form-demo-schedule\"],[2,\"smoothly-form-demo-typed\"],[2,\"smoothly-table-demo-colspan\"],[2,\"smoothly-table-demo-nested-no-cell\",{\"loadingIndex\":[32],\"loadedRows\":[32]}],[2,\"smoothly-form-demo-controlled\",{\"name\":[32],\"currency\":[32],\"date\":[32]},null,{\"name\":[{\"nameChanged\":0}]}],[2,\"smoothly-form-demo-date\"],[2,\"smoothly-form-demo-date-range\"],[2,\"smoothly-table-demo-filler-row\",{\"cats\":[32]}],[2,\"smoothly-table-demo-simple\"],[2,\"smoothly-button-demo-standard\",{\"props\":[32],\"heightText\":[32],\"lastButton\":[32]},null,{\"props\":[{\"updateInputHeightText\":0}]}],[2,\"smoothly-input-date-demo\",{\"date\":[32],\"alwaysShowGuide\":[32]}],[0,\"smoothly-input-color-demo\"],[0,\"smoothly-input-range-demo\"],[2,\"smoothly-form-demo-login\"],[2,\"smoothly-form-demo-prices\"],[2,\"smoothly-form-demo-card\"],[0,\"smoothly-display-demo-json\"],[2,\"smoothly-input-demo-radio\",{\"selected\":[32]},null,{\"selected\":[{\"selectedChange\":0}]}],[2,\"smoothly-theme-guide\"],[2,\"smoothly-input-price-demo\",{\"currencies\":[32],\"currency\":[32]}],[262,\"smoothly-notifier\",{\"icon\":[4],\"notices\":[32]},[[0,\"notice\",\"onNotice\"],[0,\"remove\",\"onRemove\"]]],[262,\"smoothly-theme-picker\",{\"element\":[1]}],[262,\"smoothly-dialog\",{\"color\":[513],\"open\":[1540],\"closable\":[516],\"header\":[513]},[[0,\"trigger\",\"TriggerListener\"]]],[2,\"smoothly-theme-colors\"],[2,\"smoothly-toggle-switch-demo\"],[2,\"smoothly-burger\",{\"open\":[1540]},[[0,\"click\",\"clickHandler\"]],{\"open\":[{\"openChanged\":0}]}],[262,\"smoothly-modal\",{\"open\":[1540],\"closable\":[516],\"align\":[513],\"closeModal\":[64],\"openModal\":[64]},null,{\"open\":[{\"openChanged\":0}]}],[2,\"smoothly-frame\",{\"url\":[1],\"name\":[513],\"origin\":[1],\"send\":[64]}],[262,\"smoothly-label\",{\"hue\":[2],\"description\":[1],\"shape\":[513]}],[2,\"smoothly-table-demo-nested-no-cell-inner\",{\"data\":[16]}],[2,\"smoothly-notification\",{\"notice\":[16],\"closable\":[4],\"icon\":[4],\"tick\":[32]},[[0,\"trigger\",\"onTrigger\"]],{\"notice\":[{\"onUpdatedNotice\":0}]}],[262,\"smoothly-table-filler-row\"],[2,\"smoothly-back-to-top\",{\"opacity\":[1],\"bottom\":[1],\"right\":[1],\"visible\":[32]}],[262,\"smoothly-summary\",{\"open\":[1540]}],[2,\"smoothly-theme-color\",{\"color\":[1]}],[262,\"smoothly-table-row-group\",{\"align\":[516],\"open\":[1540]}],[262,\"smoothly-table-foot\"],[2,\"smoothly-theme-color-variant\",{\"color\":[513],\"variant\":[513]}],[262,\"smoothly-input-edit\",{\"color\":[1],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"display\":[1540],\"shape\":[513],\"type\":[513],\"size\":[513],\"tooltip\":[1]},[[0,\"click\",\"clickHandler\"]]],[262,\"smoothly-lazy\",{\"show\":[1028],\"content\":[16]}],[262,\"smoothly-table-expandable-cell\",{\"span\":[514],\"open\":[1540],\"close\":[64]},null,{\"open\":[{\"openChange\":0}]}],[262,\"smoothly-table-expandable-row\",{\"open\":[1540]},null,{\"open\":[{\"openChange\":0}]}],[262,\"smoothly-input-date-time\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"readonly\":[1540],\"disabled\":[516],\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"value\":[1025],\"open\":[1028],\"showLabel\":[516,\"show-label\"],\"min\":[1],\"max\":[1],\"date\":[32],\"hour\":[32],\"minute\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"listen\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[8,\"click\",\"onWindowClick\"]],{\"name\":[{\"nameChange\":0}],\"date\":[{\"handleChange\":0}],\"hour\":[{\"handleChange\":0}],\"minute\":[{\"handleChange\":0}],\"value\":[{\"valueChange\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}]}],[2,\"smoothly-load-more\",{\"triggerMode\":[1,\"trigger-mode\"],\"name\":[1],\"multiple\":[4],\"inView\":[32]}],[262,\"smoothly-tab\",{\"label\":[1],\"name\":[1],\"tooltip\":[1],\"open\":[1540],\"disabled\":[516]},[[0,\"smoothlyInputLoad\",\"onInputLoad\"],[0,\"smoothlyInput\",\"onInputLoad\"]],{\"open\":[{\"openHandler\":0}]}],[262,\"smoothly-tabs\",{\"tabs\":[513],\"numberOfTabs\":[2,\"number-of-tabs\"],\"tabElements\":[32],\"selectedElement\":[32],\"removeTab\":[64]},[[0,\"smoothlyTabLoad\",\"onInputLoad\"],[0,\"smoothlyTabOpen\",\"openChanged\"]],{\"selectedElement\":[{\"onSelectedChange\":0}]}],[262,\"smoothly-trigger\",{\"color\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"name\":[1],\"value\":[8]},[[0,\"click\",\"onClick\"]]],[262,\"smoothly-table-cell\",{\"span\":[514]}],[262,\"smoothly-input-file\",{\"readonly\":[1540],\"disabled\":[516],\"accept\":[1],\"color\":[1537],\"looks\":[1537],\"camera\":[513],\"name\":[513],\"showLabel\":[516,\"show-label\"],\"value\":[1040],\"placeholder\":[1537],\"dragging\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64],\"binary\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"]],{\"name\":[{\"nameChange\":0}],\"value\":[{\"valueChanged\":0}]}],[262,\"smoothly-table\",{\"columns\":[2]},[[0,\"smoothlyTableExpandableRowChange\",\"smoothlyTableExpandableRowChange\"],[0,\"smoothlyTableExpandableCellChange\",\"smoothlyTableExpandableCellChange\"]]],[262,\"smoothly-table-body\"],[262,\"smoothly-table-head\",{\"scrolled\":[32],\"depth\":[32]}],[262,\"smoothly-input-color\",{\"value\":[1025],\"looks\":[1537],\"color\":[1537],\"readonly\":[1540],\"disabled\":[516],\"output\":[1],\"name\":[513],\"showLabel\":[516,\"show-label\"],\"open\":[32],\"sliderMode\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[8,\"click\",\"onWindowClick\"]],{\"name\":[{\"nameChange\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}],\"value\":[{\"valueChanged\":0}]}],[262,\"smoothly-table-row\",null,[[0,\"smoothlyTableExpandableCellRegister\",\"smoothlyTableExpandableCellRegisterHandler\"],[0,\"smoothlyTableExpandableCellChange\",\"smoothlyTableExpandableCellChangeHandler\"]]],[262,\"smoothly-input-date-range\",{\"locale\":[513],\"name\":[513],\"color\":[1537],\"looks\":[1537],\"readonly\":[1540],\"disabled\":[516],\"showLabel\":[516,\"show-label\"],\"start\":[1025],\"end\":[1025],\"placeholder\":[513],\"alwaysShowGuide\":[516,\"always-show-guide\"],\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"max\":[1],\"min\":[1],\"open\":[32],\"startHasText\":[32],\"endHasText\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64],\"clear\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[8,\"click\",\"onWindowClick\"]],{\"start\":[{\"startChanged\":0}],\"end\":[{\"endChanged\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}],\"name\":[{\"nameChange\":0}]}],[262,\"smoothly-input-checkbox\",{\"name\":[513],\"readonly\":[1540],\"disabled\":[516],\"checked\":[1540],\"value\":[16],\"looks\":[1537],\"color\":[1537],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"]],{\"name\":[{\"nameChange\":0}],\"disabled\":[{\"handleDisabledChange\":0}],\"readonly\":[{\"handleDisabledChange\":0}],\"checked\":[{\"elementCheck\":0}]}],[262,\"smoothly-input-range\",{\"value\":[1026],\"dual\":[4],\"looks\":[1537],\"color\":[1537],\"defined\":[1028],\"readonly\":[1540],\"disabled\":[516],\"type\":[1],\"min\":[2],\"max\":[2],\"name\":[513],\"step\":[2],\"outputSide\":[1,\"output-side\"],\"label\":[1],\"showInput\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"]],{\"name\":[{\"nameChange\":0}],\"value\":[{\"valueChanged\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}]}],[262,\"smoothly-input-date\",{\"locale\":[513],\"color\":[1537],\"looks\":[1537],\"name\":[513],\"readonly\":[1540],\"disabled\":[516],\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"placeholder\":[513],\"alwaysShowGuide\":[516,\"always-show-guide\"],\"value\":[1025],\"open\":[1028],\"max\":[1025],\"min\":[1025],\"showLabel\":[516,\"show-label\"],\"hasText\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"listen\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[8,\"click\",\"onWindowClick\"],[0,\"smoothlyDateSet\",\"dateSetHandler\"]],{\"name\":[{\"nameChange\":0}],\"value\":[{\"onValueChange\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}]}],[262,\"smoothly-input-clear\",{\"color\":[1],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"size\":[513],\"shape\":[513],\"display\":[1540],\"type\":[513],\"tooltip\":[1]},[[0,\"click\",\"clickHandler\"]]],[262,\"smoothly-input-reset\",{\"color\":[1],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"size\":[513],\"shape\":[513],\"display\":[1540],\"type\":[513],\"tooltip\":[1]},[[0,\"click\",\"clickHandler\"]]],[262,\"smoothly-input-radio-item\",{\"value\":[1032],\"selected\":[1540],\"looks\":[1537],\"name\":[1025],\"disabled\":[32]}],[2,\"smoothly-toggle-switch\",{\"checkmark\":[516],\"selected\":[1540],\"disabled\":[516],\"size\":[513],\"color\":[513],\"fill\":[513]}],[262,\"smoothly-input-radio\",{\"value\":[1032],\"looks\":[1537],\"color\":[1537],\"direction\":[513],\"clearable\":[4],\"readonly\":[1540],\"disabled\":[516],\"name\":[513],\"showLabel\":[516,\"show-label\"],\"listen\":[64],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyRadioItemRegister\",\"handleRegister\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"smoothlyRadioItemSelect\",\"smoothlyRadioInputHandler\"]],{\"name\":[{\"nameChange\":0}],\"value\":[{\"valueChanged\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}]}],[262,\"smoothly-input-submit\",{\"delete\":[516],\"color\":[1],\"icon\":[8],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"display\":[1540],\"shape\":[513],\"size\":[513],\"tooltip\":[1]}],[2,\"smoothly-date-text\",{\"locale\":[1],\"readonly\":[516],\"disabled\":[516],\"showLabel\":[516,\"show-label\"],\"value\":[1],\"parts\":[32],\"order\":[32],\"separator\":[32],\"focusedIndex\":[32],\"setValue\":[64],\"select\":[64],\"deselect\":[64]},[[0,\"beforeinput\",\"beforeInputHandler\"],[2,\"input\",\"inputHandler\"]],{\"parts\":[{\"partsHandler\":0}],\"focusedIndex\":[{\"focusedIndexHandler\":0}]}],[262,\"smoothly-calendar\",{\"month\":[1025],\"value\":[1025],\"start\":[1],\"end\":[1],\"max\":[1025],\"min\":[1025],\"doubleInput\":[516,\"double-input\"],\"startInternal\":[32],\"endInternal\":[32],\"jumpTo\":[64]},null,{\"start\":[{\"onStart\":0}],\"end\":[{\"onEnd\":0}]}],[262,\"smoothly-button-confirm\",{\"color\":[1],\"name\":[513],\"doubleClickTime\":[2,\"double-click-time\"],\"expand\":[513],\"fill\":[1],\"disabled\":[516],\"shape\":[1],\"size\":[1],\"clickTimeStamp\":[32]}],[262,\"smoothly-input-month\",{\"readonly\":[1540],\"color\":[513],\"looks\":[1537],\"name\":[513],\"value\":[1025],\"max\":[1025],\"min\":[1025],\"next\":[516],\"previous\":[516],\"inCalendar\":[516,\"in-calendar\"],\"showLabel\":[516,\"show-label\"],\"allowPreviousMonth\":[32],\"allowNextMonth\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"clear\":[64],\"listen\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"]],{\"value\":[{\"valueChanged\":0},{\"setAllowPreviousMonth\":0},{\"setAllowNextMonth\":0}],\"min\":[{\"setAllowPreviousMonth\":0}],\"max\":[{\"setAllowNextMonth\":0}],\"name\":[{\"nameChange\":0}]}],[260,\"smoothly-form\",{\"color\":[1537],\"value\":[1040],\"action\":[1],\"validator\":[16],\"type\":[1],\"readonly\":[1028],\"looks\":[513],\"name\":[513],\"prevent\":[4],\"processing\":[1040],\"removeInput\":[64],\"listen\":[64],\"submit\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlyKeydown\",\"smoothlyKeydownHandler\"],[8,\"smoothlyFormSubmit\",\"windowSubmitHandler\"],[0,\"smoothlyFormSubmit\",\"submitHandler\"],[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"smoothlyFormDisable\",\"smoothlyFormDisableHandler\"]],{\"value\":[{\"watchValue\":0}],\"readonly\":[{\"watchReadonly\":0}]}],[2,\"smoothly-display\",{\"type\":[1],\"label\":[1],\"value\":[8],\"collapseDepth\":[2,\"collapse-depth\"],\"toInteger\":[4,\"to-integer\"],\"currency\":[1],\"country\":[1],\"format\":[16]}],[2,\"smoothly-display-json\",{\"value\":[8],\"collapseDepth\":[2,\"collapse-depth\"]}],[262,\"smoothly-input\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"value\":[1032],\"type\":[513],\"required\":[516],\"showLabel\":[516,\"show-label\"],\"autocomplete\":[1],\"placeholder\":[513],\"disabled\":[516],\"readonly\":[1540],\"toInteger\":[4,\"to-integer\"],\"currency\":[513],\"min\":[2],\"max\":[2],\"pad\":[2],\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"copyable\":[516],\"right\":[516],\"initialValue\":[32],\"state\":[32],\"copied\":[32],\"getValue\":[64],\"setValue\":[64],\"setFocus\":[64],\"setSelection\":[64],\"listen\":[64],\"register\":[64],\"unregister\":[64],\"clear\":[64],\"edit\":[64],\"reset\":[64],\"setInitialValue\":[64],\"setCustomInitialValue\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[0,\"input\",\"onEvent\"],[0,\"beforeinput\",\"onEvent\"]],{\"name\":[{\"nameChange\":0}],\"currency\":[{\"typeChange\":0}],\"type\":[{\"typeChange\":0}],\"state\":[{\"stateChange\":0}],\"value\":[{\"valueChange\":0}],\"disabled\":[{\"readonlyChange\":0}],\"readonly\":[{\"readonlyChange\":0}]}],[2,\"smoothly-spinner\",{\"size\":[513],\"overlay\":[516]}],[262,\"smoothly-input-select\",{\"invalid\":[516],\"errorMessage\":[513,\"error-message\"],\"name\":[513],\"color\":[1537],\"looks\":[1537],\"showLabel\":[516,\"show-label\"],\"showSelected\":[1540,\"show-selected\"],\"readonly\":[1540],\"disabled\":[516],\"inCalendar\":[516,\"in-calendar\"],\"ordered\":[516],\"multiple\":[516],\"clearable\":[4],\"defined\":[1028],\"placeholder\":[520],\"menuHeight\":[1,\"menu-height\"],\"required\":[4],\"searchDisabled\":[4,\"search-disabled\"],\"isSearchPersistent\":[4,\"is-search-persistent\"],\"searchPlaceholder\":[1,\"search-placeholder\"],\"mutable\":[4],\"open\":[32],\"selected\":[32],\"filter\":[32],\"addedItems\":[32],\"display\":[32],\"register\":[64],\"unregister\":[64],\"getValue\":[64],\"getItems\":[64],\"listen\":[64],\"reset\":[64],\"clear\":[64],\"edit\":[64],\"setInitialValue\":[64]},[[0,\"smoothlyInputLoad\",\"smoothlyInputLoadHandler\"],[8,\"click\",\"onWindowClick\"],[0,\"smoothlyItemDOMChange\",\"onItemDomChange\"],[0,\"smoothlyItemSelect\",\"onItemSelect\"]],{\"name\":[{\"nameChange\":0}],\"selected\":[{\"onSelectedChange\":0}],\"required\":[{\"onRequiredChange\":0}],\"filter\":[{\"onFilterChange\":0}],\"disabled\":[{\"watchingReadonly\":0}],\"readonly\":[{\"watchingReadonly\":0}],\"open\":[{\"onClosed\":0}]}],[2,\"smoothly-display-json-object\",{\"value\":[16],\"collapseDepth\":[2,\"collapse-depth\"],\"open\":[32],\"empty\":[32]}],[2,\"smoothly-display-json-primitive\",{\"value\":[8]}],[2,\"smoothly-display-json-record-key\",{\"value\":[8]}],[262,\"smoothly-item\",{\"value\":[8],\"selected\":[1540],\"marked\":[1540],\"disabled\":[516],\"deselectable\":[4],\"filter\":[64]},[[0,\"click\",\"clickHandler\"]],{\"selected\":[{\"selectedWatcher\":0}]}],[262,\"smoothly-button\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"tooltip\":[513],\"disabled\":[516],\"type\":[513],\"size\":[513],\"shape\":[513],\"link\":[1]}],[2,\"smoothly-icon\",{\"color\":[513],\"fill\":[513],\"name\":[513],\"size\":[513],\"rotate\":[514],\"flip\":[513],\"tooltip\":[1],\"latestPromise\":[32]},null,{\"tooltip\":[{\"nameChanged\":0}],\"name\":[{\"nameChanged\":0}]}]]],[\"smoothly-input-checkbox-demo.cjs\",[[2,\"smoothly-input-checkbox-demo\"]]],[\"smoothly-checkbox.cjs\",[[262,\"smoothly-checkbox\",{\"size\":[1],\"checked\":[1540],\"intermediate\":[1540],\"unavailable\":[516],\"disabled\":[516],\"name\":[513],\"value\":[8],\"t\":[32],\"toggle\":[64],\"clear\":[64]},null,{\"checked\":[{\"unavailableChanged\":0}],\"unavailable\":[{\"unavailableChanged\":0}]}]]],[\"smoothly-color.cjs\",[[262,\"smoothly-color\",{\"color\":[513]}]]],[\"smoothly-country.cjs\",[[2,\"smoothly-country\",{\"value\":[1],\"text\":[1],\"language\":[32]}]]],[\"smoothly-submit.cjs\",[[262,\"smoothly-submit\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"size\":[513],\"shape\":[513],\"prevent\":[4]},[[0,\"click\",\"clickHandler\"]]]]],[\"smoothly-trigger-sink.cjs\",[[262,\"smoothly-trigger-sink\",{\"context\":[16],\"destination\":[1],\"filter\":[1]},[[0,\"trigger\",\"TriggerListener\"]]]]],[\"smoothly-trigger-source.cjs\",[[262,\"smoothly-trigger-source\",{\"listen\":[1]}]]]]"), options);
 });
 exports.setNonce = index.setNonce;

package/dist/collection/components/input/demo/date/index.js CHANGED Viewed

@@ -5,7 +5,7 @@ export class SmoothlyInputDateDemo {
         this.alwaysShowGuide = false;
     }
     render() {
-        return (h(Host, { key: 'cbba15250597a6d89b26f48ae9e79d6fced8e48d' }, h("div", { key: '15e49388b292c871a95ef08c250e60211bd7da69' }, h("h2", { key: '5027fbeaad76df66416ad518ba62e5d406f9aec2' }, "Date input"), h("p", { key: 'e0fda7a58506997767f4f8fd3fee8adf14ce482f' }, "Different locales formatting the same date"), h("smoothly-button", { key: '0b83e9e07173233d5a071a4799069b59dbbcf641', color: "primary", onClick: () => (this.date = this.date ? isoly.Date.next(this.date) : isoly.Date.now()) }, "Set date"), h("smoothly-input-checkbox", { key: '237b78757e9984326376f0e9dc838f4481d02930', looks: "transparent", onSmoothlyUserInput: e => {
+        return (h(Host, { key: '9602907d9ae0152643b48455bdd21da2a8a91a50' }, h("div", { key: '2e9244031f62cb552fff12fd107050c42065bc1d' }, h("h2", { key: '26b155267a35157e779724e7b805496aa01d61e5' }, "Date input"), h("p", { key: 'b2f4a4d204e681869e2a3067b4f08bfd53700077' }, "Different locales formatting the same date"), h("smoothly-button", { key: '2e8e18bc20722b720f6f26b5c720cf31c6ba236b', color: "primary", onClick: () => (this.date = this.date ? isoly.Date.next(this.date) : isoly.Date.now()) }, "Set date"), h("smoothly-input-checkbox", { key: '13101795d8056cad4581762357226c669181f56b', looks: "transparent", onSmoothlyUserInput: e => {
                 this.alwaysShowGuide = e.detail.value;
                 console.log(this.alwaysShowGuide);
             } }, "Always Show Guide")), ["en-US", "en-GB", "de-DE", "se-SE"].map(locale => (h(Fragment, null, h("smoothly-input-date", { locale: locale, name: locale, looks: "border", value: this.date, alwaysShowGuide: this.alwaysShowGuide }, locale, h("smoothly-input-clear", { slot: "end" })), h("smoothly-input-date-range", { locale: locale, name: locale + "-range", looks: "border", start: this.date, end: this.date ? isoly.Date.next(this.date) : undefined, alwaysShowGuide: this.alwaysShowGuide }, locale, " Range", h("smoothly-input-clear", { slot: "end" })))))));

package/dist/collection/components/input/demo/index.js CHANGED Viewed

@@ -11,10 +11,10 @@ export class SmoothlyInputDemo {
                 "--smoothly-input-border-radius": "0.5rem",
             } }, h("smoothly-input-clear", { key: '7f6081c65f5280584d04b6ce8f7905ac77634a3e', slot: "end", size: "icon" })), h("h2", { key: '37f34f036ee7dc8fb75c4c00659da25e601ff5b1' }, "Date"), h("smoothly-input-date", { key: '511529a03ebe91114a24ac5a1942bf2007e1c338' }, "Date"), h("smoothly-input-date", { key: 'f0b777d7e776387614b9cbeb866f91fd20c86710', showLabel: false, value: "2021-10-28", max: "2021-12-30", min: "2021-10-10" }, "Date"), h("smoothly-input-date", { key: '11c9d53699c3f56ab059fcc4ae23ae3ede7c3ef7', value: "2021-10-28" }, "Date", h("smoothly-input-reset", { key: 'd8f02f6d1c3a5866f9666199b8dff8bffa2f020a', slot: "end", size: "icon" })), h("smoothly-input-date", { key: 'b818db6b9c7b7a3e52bd110795f814f440eab4f7', value: "2021-10-28" }, "Date", h("smoothly-input-clear", { key: 'c099251b5d2925af72bf10d4e897f4102f62be43', slot: "end", size: "icon" })), h("h2", { key: '8033cbfa7ee22ca7440d58952676a43f092c1304' }, "Select"), h("div", { key: '1de49162035bde4ab43a46cea27a2e4ef016c784', class: "select-div" }, h("smoothly-input-select", { key: '2d2acbd594c6a260b1bd571f00a35e53db9f904f', name: "select-dessert", looks: "border" }, h("label", { key: '4a1ebbb1757580ebfba6c58651fa8207a186274c', slot: "label" }, "Select with clear button"), h("smoothly-item", { key: '10fe2d4eec5af17e61f704b594be8a700dde57e8', value: "1" }, "Ice cream"), h("smoothly-item", { key: '50f3be0902fa5d9989e0827df63cbbc1e4969a4e', value: "2" }, "Sponge cake"), h("smoothly-item", { key: '54d4950affc3378a23311d30f01a6b75877921a8', value: "3", disabled: true }, "Disabled Item"), h("smoothly-item", { key: '2b669d8c3138b6bef8b2c0a5b0a17f07ea2b1fc3', value: "4" }, "Cookie"), h("smoothly-item", { key: '1d222cd2827315a43f1d8412777f2deab42c707e', value: "5" }, "Croissant"), h("smoothly-item", { key: 'f5582ec1306d69273508415467d56ef166d59592', value: "6" }, "Chocolate fondue"), h("smoothly-input-clear", { key: '903c91c69080f05179a1d4c5c4176f651bbac1a7', size: "icon", slot: "end" })), h("smoothly-input-select", { key: 'a73b2cdcca14bddac369727f65113cfe2e36f9c8', multiple: true, name: "select-dessert-multiple", looks: "border" }, h("label", { key: '264c0c5c870d69ccd4acd552c0c69b75bdf41322', slot: "label" }, "Select multiple with reset button"), h("smoothly-item", { key: '1b013b6fce5892e21cec768704c1c7847f9c2d6b', value: "ice cream" }, "Ice cream"), h("smoothly-item", { key: 'cbf0fb98cd04b4c21d56c4640ebc7fea61de1b8e', value: "sponge cake" }, "Sponge cake"), h("smoothly-item", { key: '5244238b76c116e31888c36887b3f4ac5c88f2d0', selected: true, value: "cookie" }, "Cookie"), h("smoothly-item", { key: '665cd5efa69f937a8de2e16549f6b5030f87aadd', value: "croissant" }, "Croissant"), h("smoothly-item", { key: 'f33f606105a30eadeb8ad91d1d098b59f03f1de2', selected: true, value: "chocolate fondue" }, "Chocolate fondue"), h("smoothly-input-reset", { key: '903d7955210a152bdd397bf011ede1bdff121949', size: "icon", slot: "end" })), h("smoothly-input-select", { key: 'a3b64c46106cc3059130d7c3a91d7f490d1d2751', name: "spirit-animals", looks: "border", mutable: true }, h("label", { key: 'a004cf922bae1aad8f4df3af6898096e965cfc6a', slot: "label" }, "Select or add new options"), h("smoothly-item", { key: '4aa4ef91d108edb11936203365632dfc604e6973', value: "manatee" }, "Manatee"), h("smoothly-item", { key: '12985b2fd02dec4a942274c1ecd0b8d64045fb62', selected: true, value: "cthulu" }, "Cthulu")), h("smoothly-input-select", { key: '926065319fff2eb3024955686991469cf4128a36', name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { key: '1ac998cba750b6779c9d2159cef8245ab915f528', value: "folder", selected: true }, h("smoothly-icon", { key: '30d4832563d4b16c0bbb77cb33e0da404b743090', size: "small", name: "folder-outline" })), h("smoothly-item", { key: 'b04f79adc06b65369baed20874f53ef04a33f80f', value: "camera" }, h("smoothly-icon", { key: 'b16eaceb42a9e0b56587ce78e8cfdc6452dddd7b', size: "small", name: "camera-outline" }))), h("smoothly-input-select", { key: '5e225cc4758897b81015db7495c7d7a224776e53', ordered: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, h("label", { key: '4b9bcc2a3fe30dabc8669888a19ce86f369cc41e', slot: "label" }, "Alphabet ordered select"), Array.from({ length: 26 })
             .map((_, i) => String.fromCharCode(i + 65))
-            .map(char => (h("smoothly-item", { value: char, selected: char == "H" }, char)))), h("smoothly-input-select", { key: 'a171d4ffb8e1bfc698f0fc9ae4ed69e98ced36c9', multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, h("label", { key: 'a23c78b0a859472f5e0123b0c02c010911417369', slot: "label" }, "Month multiple select"), h("smoothly-item", { key: 'a733057d56e91b60e5baa989e26dddbd91e0241a', value: "1" }, "January"), h("smoothly-item", { key: '376d92471d5d2eaa9dd88812a8fc583153410198', value: "2" }, "February"), h("smoothly-item", { key: '7a1fce8efd0b7974e5528a5fa5662c1dfd778394', value: "3" }, "March"), h("smoothly-item", { key: 'cb9baf077486cb9bcdbbf89649530a5e0d6063c7', value: "4" }, "April"), h("smoothly-item", { key: '0a3473edcc3c472a629ba3d8a79f902acb2e26f3', value: "5" }, "May"), h("smoothly-item", { key: '5fdae912db41bffabf3b295d2c3032277dffaa94', value: "6" }, "June"), h("smoothly-item", { key: '80047591254fd32dc669b14753e4786d43d3c97d', value: "7" }, "July"), h("smoothly-item", { key: 'c9df20403a3c394c64aba952b9fedf32e79ccb4d', value: "8" }, "August"), h("smoothly-item", { key: '68313242691a68d57283d668fe9b515793737c7e', value: "9" }, "September"), h("smoothly-item", { key: '443d7a691c41599d0d89db84b537eb1f257ef517', value: "10" }, "October"), h("smoothly-item", { key: '9744bb0bda7582ad2b8b1f90fdf8032258463c54', value: "11" }, "November"), h("smoothly-item", { key: 'a96a75320e5c546549c4fa35f4176f35a82f5441', value: "12" }, "December")), h("div", { key: '3e7603380ceba63da34a828e2516632da73e39c4', class: "select-div-row" }, h("smoothly-input-select", { key: '408634ba59447206b05b3cd1fd1cc33d1eb8c65d', name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { key: 'ee676953d6e5787b02d09f18296c90f0de191c1d', value: "folder", selected: true }, h("smoothly-icon", { key: 'a904b9c0a3606d2427f70b0de7038c58e126eb8f', size: "small", name: "folder-outline" })), h("smoothly-item", { key: '3005772f6f0db186e465eaa8cdf0664acc8df98a', value: "camera" }, h("smoothly-icon", { key: 'd6d6da52e16928ffae5914bb57c5d507dcd753d7', size: "small", name: "camera-outline" })), h("smoothly-item", { key: 'e7f997b52e887a470a300bde751cb2972a8a6d1c', value: "boat" }, h("smoothly-icon", { key: '7d2fa7593473fea8a742b06451b86234dc2c984f', size: "small", name: "boat-outline" }))), h("smoothly-input-select", { key: '72b7dd2b8193e7daa76e87e2b2c0229e6542b95d', name: "select-number", clearable: false }, this.numbers.map(number => (h("smoothly-item", { value: "number", selected: number === 3 }, number)))), h("smoothly-input", { key: '2eaf99ab88e42d799677b83d1e7cac4bf27b2cab', name: "name", value: "Sten Qvist" }, "Name"))), h("h2", { key: 'bdf117c705543939f57d4f8c001b9bd6b0f6d419' }, "Duration"), h("smoothly-input", { key: '8c58c7e2d86e031ffb41a6a46fc738bd87d73a8d', name: "duration", type: "duration", placeholder: "hh:mm", value: this.duration, onSmoothlyInput: e => (this.duration = e.detail.duration) }, "Duration"), h("smoothly-input", { key: '0e0b25be2290f7adfc1dc72807e11791965a1ad8', name: "duration", type: "duration", value: this.duration, placeholder: "-hh:mm", onSmoothlyInput: e => {
+            .map(char => (h("smoothly-item", { value: char, selected: char == "H" }, char)))), h("smoothly-input-select", { key: 'a171d4ffb8e1bfc698f0fc9ae4ed69e98ced36c9', multiple: true, menuHeight: "7.5items", placeholder: "Select...", name: "select-month" }, h("label", { key: 'a23c78b0a859472f5e0123b0c02c010911417369', slot: "label" }, "Month multiple select"), h("smoothly-item", { key: 'a733057d56e91b60e5baa989e26dddbd91e0241a', value: "1" }, "January"), h("smoothly-item", { key: '376d92471d5d2eaa9dd88812a8fc583153410198', value: "2" }, "February"), h("smoothly-item", { key: '7a1fce8efd0b7974e5528a5fa5662c1dfd778394', value: "3" }, "March"), h("smoothly-item", { key: 'cb9baf077486cb9bcdbbf89649530a5e0d6063c7', value: "4" }, "April"), h("smoothly-item", { key: '0a3473edcc3c472a629ba3d8a79f902acb2e26f3', value: "5" }, "May"), h("smoothly-item", { key: '5fdae912db41bffabf3b295d2c3032277dffaa94', value: "6" }, "June"), h("smoothly-item", { key: '80047591254fd32dc669b14753e4786d43d3c97d', value: "7" }, "July"), h("smoothly-item", { key: 'c9df20403a3c394c64aba952b9fedf32e79ccb4d', value: "8" }, "August"), h("smoothly-item", { key: '68313242691a68d57283d668fe9b515793737c7e', value: "9" }, "September"), h("smoothly-item", { key: '443d7a691c41599d0d89db84b537eb1f257ef517', value: "10" }, "October"), h("smoothly-item", { key: '9744bb0bda7582ad2b8b1f90fdf8032258463c54', value: "11" }, "November"), h("smoothly-item", { key: 'a96a75320e5c546549c4fa35f4176f35a82f5441', value: "12" }, "December")), h("div", { key: 'd873c1eec59cde6d8922fe4a50e243a63cab66c5', class: "select-div-row" }, h("smoothly-input-select", { key: '50e5308ef0fd5c89c0ef0994a1614e633a3d79e0', name: "select-icon", clearable: false, showSelected: false }, h("smoothly-item", { key: 'a2126b796f28e4c49dd55ca407bfe9c2d71a732a', value: "folder", selected: true }, h("smoothly-icon", { key: '9e59ce322358f4648b7b2cf603f4fa0bbee5e7e6', size: "small", name: "folder-outline" })), h("smoothly-item", { key: 'c5695fa853b6cd50323c0bb19b179e66241f7c6e', value: "camera" }, h("smoothly-icon", { key: '63fc661e772f7b8f425d1aa3acb7d151169e0ca8', size: "small", name: "camera-outline" })), h("smoothly-item", { key: 'beaa91042b1183a2fe5eb9f84309cddab6cdaf74', value: "boat" }, h("smoothly-icon", { key: '9214d9c9c794dc289f1d99e65877a05a92be2c51', size: "small", name: "boat-outline" }))), h("smoothly-input-select", { key: '9f1f41dce39f38e5fe63e5d771be4ea768732018', name: "select-number", clearable: false }, this.numbers.map(number => (h("smoothly-item", { value: "number", selected: number === 3 }, number)))), h("smoothly-input", { key: '73f079ee5dc954e5274c0d4506687186e985ebc7', name: "name", value: "Sten Qvist" }, "Name")), h("smoothly-input-select", { key: 'f180ea82340d92cfd514a8f02b0610de97955db6', name: "persistent-search", isSearchPersistent: true, menuHeight: "7.5items", searchPlaceholder: "Not here? Type to search." }, h("label", { key: '0bb5a665c356d9262946b012e97e5ebfa6e3a2cc', slot: "label" }, "Persistent Search select"), this.numbers.map(number => (h("smoothly-item", { value: number }, number))))), h("h2", { key: 'aa748593e7a304b916fe003db3574355e861f91f' }, "Duration"), h("smoothly-input", { key: '6665cf5c786a67bfd315ca5e698201a28ac58bd9', name: "duration", type: "duration", placeholder: "hh:mm", value: this.duration, onSmoothlyInput: e => (this.duration = e.detail.duration) }, "Duration"), h("smoothly-input", { key: 'acc1524d8f3d81b502f152b9c4a4269f04ec28a3', name: "duration", type: "duration", value: this.duration, placeholder: "-hh:mm", onSmoothlyInput: e => {
                 const duration = e.detail.duration;
                 this.duration = duration;
-            } }, "Duration"), h("h2", { key: 'ed1c66a6809ae277a848826be61161405e712e89' }, "Integer with Min/Max"), h("smoothly-input", { key: '220dca7d4c2fe1111025b6e44d23a40d105efe89', name: "days", type: "integer", min: 0, max: 365 }, "Days per year (0-365)"), h("smoothly-input", { key: 'e2b1ae2d00b98366ee26f02d37915e319736f002', name: "hour", type: "integer", min: 0, max: 23 }, "Hours per day (0-23)"), h("smoothly-input", { key: '1ecd944814b02bbd94314507d76bea0f988352f4', name: "minute", type: "integer", min: 0, max: 59 }, "Minutes per hour (0-59)"), h("smoothly-input", { key: 'b8990cc9cad14d470ca47ab3c6c04b4f685a0c55', name: "minute", type: "integer", min: 18, max: 120 }, "Age (18-120)"), h("h2", { key: '2a747aa7ff1fb76fa374c730b59802c8f3a508cd' }, "Invalid text with warning icon and tooltip"), h("smoothly-input", { key: '817b52d0ef2e31056e8ee8a7faab79990797c732', copyable: true, name: "alphanumeric", invalid: !/^[a-zA-Z0-9]+$/.test(this.alphanumeric), errorMessage: "Only alphanumeric allowed", value: this.alphanumeric, onSmoothlyInput: e => (this.alphanumeric = e.detail.alphanumeric) }, "Alphanumeric"), h("h2", { key: 'cd628bebd9e2b9de77eb82b0f9591cfe8d7b3ca2' }, "Identifiers"), h("smoothly-input", { key: 'fe1d2d89f25cd8a60fd537bfb5a9580548491604', type: "identifier-code" }, "Code"), h("smoothly-input", { key: '14d47570684ca9165381718becda2f318c9c88bf', type: "identifier-attribute" }, "Attribute"), h("smoothly-input", { key: 'fb5ed7f2a284640369bf648a548161d233756dd5', type: "identifier-snake" }, "Snake"), h("smoothly-input", { key: 'cde9cde9c787d99c0eaf75085f0567139b8130c8', type: "identifier-pascal" }, "Pascal"), h("smoothly-input", { key: '509c743780e2d2f0d759ab3cff67893318256443', type: "identifier-camel" }, "Camel"), h("h2", { key: '81ea90cb970b799945d3aeb14b70bb8184d911e4' }, "Input Alternatives"), h("smoothly-input", { key: '01ba72593f0e056a20d87c8722e2bc4317932962', type: "text", name: "name.last" }, h("smoothly-icon", { key: '70491c3ed08d7f0d13a3cd8eba72e47fa1de1008', name: "checkmark-circle", slot: "start" }), "First Name"), h("smoothly-input", { key: 'ab3a45839ee4d8bacfac8ca96bcd7ec260ce36d9', type: "text", name: "name.first" }, "Last Name", h("smoothly-icon", { key: 'a7996638a9ec278f74d967e0fcb03dcaf4445315', name: "checkmark-circle", slot: "end" })), h("smoothly-input", { key: 'f524fc067947a8637a1c416a74d3de0c37744255', type: "text", name: "name.first", placeholder: "Smith" }, "Last Name", h("smoothly-icon", { key: 'ec440199d9625155037e1cd9e614266748997f7a', name: "checkmark-circle", slot: "end" })), h("smoothly-input", { key: '27cc6d614a7bae4893462b5e708cb663bcffcec1', placeholder: "test" }), h("smoothly-input-submit", { key: '789ee37616c3c27e8e6414992be1f9ee2117a5d3', slot: "submit", fill: "solid", onSubmit: (e) => alert(e), color: "success" }), h("h4", { key: '5c256926b8f451dca0b5297992f6a6312a2f5494' }, "Smoothly checkboxes"), h("div", { key: '6650b3b1b27d5fbca72ef5679f03d11c3c5cc1a7', class: "checkbox-group" }, h("smoothly-input-checkbox", { key: '9030dedf496556b87212376fbd15617f6abebf48', disabled: true, name: "first-checkbox" }, h("smoothly-icon", { key: 'e3a47da2376066cdfc082fbf4100adf340b70f36', name: "checkmark-circle", slot: "start", size: "tiny" }), "First"), h("smoothly-input-checkbox", { key: 'd86dbe0e70d983c82791caf5729ed0510df48b4d', name: "second-checkbox", checked: true }, h("smoothly-icon", { key: '28505106b36406f9a24fdd0f8f27dea211544f38', name: "checkmark-circle", slot: "start", size: "tiny" }), "second", h("smoothly-input-clear", { key: '7240cc38a40cfe3ca5ee3cdbb5ae971ebbf23efb', size: "icon", slot: "end" })), h("smoothly-input-checkbox", { key: '64df44307f15d6ca5878b5933b847931973a4bd4', name: "third-checkbox" }, "3rd")), h("h4", { key: 'd6cd694e036d14b16241a4664ed9e9a6b9257c80' }, "Smoothly Radio Buttons"), h("smoothly-input-radio", { key: '43f5fe05e6889b3f009a85a996ca9f3df8418d85', clearable: true, name: "radioFirstInput" }, h("smoothly-icon", { key: '67303cd42725a67937687862934c5eb4efb08617', name: "checkmark-circle", slot: "start" }), h("label", { key: '20faf3230a26de4d0578cc142212f849447826b0', slot: "label" }, "Clearable"), h("smoothly-input-radio-item", { key: 'c8f0663f1aca55d837179e535675837b8c5dc486', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: 'f699d87b7edd1e815068671279f6454a071dd26f', selected: true, value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: '6c76a26cbcf6c0279ea178a8c2fa5cb70d592614', value: "third" }, "Label 3"), h("smoothly-input-clear", { key: '146770892b8d84fe6686d7d360b2c119271b068e', size: "icon", slot: "end" })), h("smoothly-input-radio", { key: 'd15590998dacc095683e2a2149bd4d0008458c6c', name: "radioSecondInput" }, h("label", { key: '91206150e39f16cc6b63c27e936e0890d085dd3c', slot: "label" }, "Not clearable"), h("smoothly-input-radio-item", { key: '4be57f196fceca8c421b1a76539383e583815d47', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: '64fb53d589cbc3c41d2716bcd0a94e0852b61984', value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: 'cfd1618ca1085b04f892a0f7c41c3ba015817f8e', value: "third" }, "Label 3"), h("smoothly-input-radio-item", { key: '5204c85dc39eb90eb2203f7bc95465fd3505e0ee', value: "fourth" }, "Label 4"), h("smoothly-input-radio-item", { key: '7beb685e25cd77b0c4ee67d52c08d3dda77bbb43', value: "fifth" }, "Label 5"), h("smoothly-input-radio-item", { key: '2e540abce5ef3a5ef00f9bf66e28d4dcc2dcf033', value: "sixth" }, "Label 6")), h("smoothly-input-range-demo", { key: '0734d3ef8222645914a3de1baca3a564658155b2' }), h("smoothly-input-color-demo", { key: '4efc6abf40e3b21f406e0bc0c56e0b1549bf7c62' }), h("smoothly-input-price-demo", { key: 'bd457e1f8ac312ee0feb1685bee15b7ec9cfd451' }), h("smoothly-back-to-top", { key: 'a1795f547d9bcfc820f76df3e60f9611a8d654e8' }))));
+            } }, "Duration"), h("h2", { key: 'ec697e0d8a4c08cf76096f8ecea3cf928ac8ffed' }, "Integer with Min/Max"), h("smoothly-input", { key: 'd93e6fcb19b42a47bfb083731678f70aa29e6b91', name: "days", type: "integer", min: 0, max: 365 }, "Days per year (0-365)"), h("smoothly-input", { key: '5e08ee5eacadbe550677ed2f80bf120d31f330bb', name: "hour", type: "integer", min: 0, max: 23 }, "Hours per day (0-23)"), h("smoothly-input", { key: 'dd76431b7c0aab1d449d1008e4b8f304e569981f', name: "minute", type: "integer", min: 0, max: 59 }, "Minutes per hour (0-59)"), h("smoothly-input", { key: '9f505d2068e98d936255a2077ce4a7fe10120237', name: "minute", type: "integer", min: 18, max: 120 }, "Age (18-120)"), h("h2", { key: '0e6dfdc5d485752df47122337bb0e15b052cde03' }, "Invalid text with warning icon and tooltip"), h("smoothly-input", { key: '0c015c17a330733637adbd5e60fed447f4224456', copyable: true, name: "alphanumeric", invalid: !/^[a-zA-Z0-9]+$/.test(this.alphanumeric), errorMessage: "Only alphanumeric allowed", value: this.alphanumeric, onSmoothlyInput: e => (this.alphanumeric = e.detail.alphanumeric) }, "Alphanumeric"), h("h2", { key: '3443f52822907571e8f158e8fbd5ee31db147e0c' }, "Identifiers"), h("smoothly-input", { key: '04f0103307050d20d7a3c8aac48f872b7bed47a9', type: "identifier-code" }, "Code"), h("smoothly-input", { key: 'ada6bccee4f18ce4cb4f43bacc170bdcac4e5f8d', type: "identifier-attribute" }, "Attribute"), h("smoothly-input", { key: 'd1dd0cd0fb145e64da7622e650d08068034234d7', type: "identifier-snake" }, "Snake"), h("smoothly-input", { key: '6bb9c33e28690ad8ba5910f57f4323b17380bd4d', type: "identifier-pascal" }, "Pascal"), h("smoothly-input", { key: 'c6d0145666d97941bf4e3cc3f000dcf7df622456', type: "identifier-camel" }, "Camel"), h("h2", { key: 'a0fd68fd64318c72d4fb5617999eb28434f46acb' }, "Input Alternatives"), h("smoothly-input", { key: 'b258a367eb583950f4e88462759553304b34ab5f', type: "text", name: "name.last" }, h("smoothly-icon", { key: '6680c161daaa98a7eefb134fa6ac01e057a4cda8', name: "checkmark-circle", slot: "start" }), "First Name"), h("smoothly-input", { key: 'c3fbc85c3dd1548a2e13dfefb72e999c2e540af3', type: "text", name: "name.first" }, "Last Name", h("smoothly-icon", { key: 'b870dd9c6a9ec3c8cff7eb0d72b8ff8d01ff4787', name: "checkmark-circle", slot: "end" })), h("smoothly-input", { key: '56483f22dadebefc68a137ef7ea47c201455f9ac', type: "text", name: "name.first", placeholder: "Smith" }, "Last Name", h("smoothly-icon", { key: 'ab1a1418475389089a04e781020fdec0843db208', name: "checkmark-circle", slot: "end" })), h("smoothly-input", { key: '235e4ba12e66afc201a687d67ba68c09e47c6ae3', placeholder: "test" }), h("smoothly-input-submit", { key: '6cd11548c4da7a358b0c41fc17872173fb5542ed', slot: "submit", fill: "solid", onSubmit: (e) => alert(e), color: "success" }), h("h4", { key: '6426ff9a5dcd88a79a0e25f8131a905111e1100d' }, "Smoothly checkboxes"), h("div", { key: '2ee293c7ee7cc7028cc5a64c7514089f6e513970', class: "checkbox-group" }, h("smoothly-input-checkbox", { key: '04543bfef656a978cfa97278be15ee98ac340226', disabled: true, name: "first-checkbox" }, h("smoothly-icon", { key: 'd6364cf232eb21eb05d8c0d2c561b5f83c2bfc22', name: "checkmark-circle", slot: "start", size: "tiny" }), "First"), h("smoothly-input-checkbox", { key: '6002b3d4d656de70f45268684091700bb51a34d9', name: "second-checkbox", checked: true }, h("smoothly-icon", { key: 'a62dede44cee8482cedf454666d74eadcae5b648', name: "checkmark-circle", slot: "start", size: "tiny" }), "second", h("smoothly-input-clear", { key: 'efa5fb6d1c0b98657fcdb2f767a1b540cfbe64c2', size: "icon", slot: "end" })), h("smoothly-input-checkbox", { key: '7e9bae820feaf07266c5855521656fb77795f213', name: "third-checkbox" }, "3rd")), h("h4", { key: '5e82e2cabd6bfba777cb525f9327f8d0b44bb0a4' }, "Smoothly Radio Buttons"), h("smoothly-input-radio", { key: '2f509cac6e45fede44fb781e0d89e3641cbe7087', clearable: true, name: "radioFirstInput" }, h("smoothly-icon", { key: '3d8d785ab281ced175b9eff30588e456b9d467c8', name: "checkmark-circle", slot: "start" }), h("label", { key: '7818d1cd7adf436e618c2c1657a9cdb703bd9872', slot: "label" }, "Clearable"), h("smoothly-input-radio-item", { key: '8dcef2f957dec38a75138907c0f7b90dfd60eb06', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: '8abcba992493b5a48c52e83354accb5cd811600e', selected: true, value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: '258b7a4eeed806d90bf532232204c5816138f0e3', value: "third" }, "Label 3"), h("smoothly-input-clear", { key: '8162121c8509d4dbfa817f8da1ce83e772635eae', size: "icon", slot: "end" })), h("smoothly-input-radio", { key: '1fb58d1a85229c423cfcdc3cc9dda03e2656a156', name: "radioSecondInput" }, h("label", { key: 'aa058078296bf6bdb306014dbb2bfff8f4ea4127', slot: "label" }, "Not clearable"), h("smoothly-input-radio-item", { key: 'a5705cd459d7d23a673bebb2922d96b05886b174', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: 'eaf40dd525cc87eb6945c2f2c13fa3bc88a87b8a', value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: '804cab03ddaaa8117ede9be9c64a7702a6a80e9e', value: "third" }, "Label 3"), h("smoothly-input-radio-item", { key: '5fb7e710781e5fbb151dc7e1375e558f2f5b31d6', value: "fourth" }, "Label 4"), h("smoothly-input-radio-item", { key: '8eb82275acfeb773ed48a3a16e9185655811f1ac', value: "fifth" }, "Label 5"), h("smoothly-input-radio-item", { key: 'ca59f13504dabd0cbfe5f990df73b4d1cf3fba40', value: "sixth" }, "Label 6")), h("smoothly-input-range-demo", { key: 'fb8307d6c518fcb16fe272cbedba69c5a824b631' }), h("smoothly-input-color-demo", { key: '3a5e50a5f2aee26c49a2f0ffd879f6efe6717697' }), h("smoothly-input-price-demo", { key: '69c1564a1952541b35af40a5675029b32bc43256' }), h("smoothly-back-to-top", { key: '574445159a65c986532d39d381a37a606cde04b0' }))));
     }
     static get is() { return "smoothly-input-demo"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/input/demo/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/demo/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAC9E,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAA;AAO7B,MAAM,OAAO,iBAAiB;IAL9B;QAMU,aAAQ,GAAmB,EAAE,KAAK,EAAE,CAAC,EAAE,CAAA;QACvC,iBAAY,GAAW,MAAM,CAAA;QAC9B,YAAO,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;KA+P7C;IA5PA,MAAM;QACL,OAAO,CACN,EAAC,IAAI;YACJ,sFAAgC;YAChC,kFAA4B;YAC5B,wFAAkC;YAClC,mFAA6B;YAC7B,4DAAK,KAAK,EAAC,QAAQ;gBAClB,wEAAiB;gBACjB,4EAAqB,IAAI,EAAC,WAAW,eAA+B;gBACpE,iFAA0B,IAAI,EAAC,cAAc,EAAC,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,eAE9C;gBAC3B,0EAAmB;gBACnB,kFACC,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,EACvB,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,EAC3C,GAAG,EAAC,YAAY,EAChB,GAAG,EAAC,YAAY,GACf;gBACF,kFACC,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,EACvB,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,EAC3C,GAAG,EAAC,YAAY,EAChB,GAAG,EAAC,YAAY;oBAChB,6EAAsB,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,GAAG,CACpB;gBAC5B,kFACC,KAAK,EAAC,MAAM,EACZ,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,EACvB,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,EAC3C,GAAG,EAAC,YAAY,EAChB,GAAG,EAAC,YAAY,EAChB,SAAS,EAAE,KAAK,EAChB,KAAK,EAAE;wBACN,gCAAgC,EAAE,QAAQ;qBAC1C;oBACD,6EAAsB,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,GAAG,CACpB;gBAC5B,oEAAa;gBACb,qFAA+C;gBAC/C,4EAAqB,SAAS,EAAE,KAAK,EAAE,KAAK,EAAC,YAAY,EAAC,GAAG,EAAC,YAAY,EAAC,GAAG,EAAC,YAAY,WAErE;gBACtB,4EAAqB,KAAK,EAAC,YAAY;;oBAEtC,6EAAsB,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,GAAG,CAC1B;gBACtB,4EAAqB,KAAK,EAAC,YAAY;;oBAEtC,6EAAsB,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,GAAG,CAC1B;gBACtB,sEAAe;gBACf,4DAAK,KAAK,EAAC,YAAY;oBACtB,8EAAuB,IAAI,EAAC,gBAAgB,EAAC,KAAK,EAAC,QAAQ;wBAC1D,8DAAO,IAAI,EAAC,OAAO,+BAAiC;wBACpD,sEAAe,KAAK,EAAC,GAAG,gBAA0B;wBAClD,sEAAe,KAAK,EAAC,GAAG,kBAA4B;wBACpD,sEAAe,KAAK,EAAC,GAAG,EAAC,QAAQ,0BAEjB;wBAChB,sEAAe,KAAK,EAAC,GAAG,aAAuB;wBAC/C,sEAAe,KAAK,EAAC,GAAG,gBAA0B;wBAClD,sEAAe,KAAK,EAAC,GAAG,uBAAiC;wBACzD,6EAAsB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,GAAG,CACxB;oBACxB,8EAAuB,QAAQ,QAAC,IAAI,EAAC,yBAAyB,EAAC,KAAK,EAAC,QAAQ;wBAC5E,8DAAO,IAAI,EAAC,OAAO,wCAA0C;wBAC7D,sEAAe,KAAK,EAAC,WAAW,gBAA0B;wBAC1D,sEAAe,KAAK,EAAC,aAAa,kBAA4B;wBAC9D,sEAAe,QAAQ,QAAC,KAAK,EAAC,QAAQ,aAEtB;wBAChB,sEAAe,KAAK,EAAC,WAAW,gBAA0B;wBAC1D,sEAAe,QAAQ,QAAC,KAAK,EAAC,kBAAkB,uBAEhC;wBAChB,6EAAsB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,GAAG,CACxB;oBACxB,8EAAuB,IAAI,EAAC,gBAAgB,EAAC,KAAK,EAAC,QAAQ,EAAC,OAAO;wBAClE,8DAAO,IAAI,EAAC,OAAO,gCAAkC;wBACrD,sEAAe,KAAK,EAAC,SAAS,cAAwB;wBACtD,sEAAe,QAAQ,QAAC,KAAK,EAAC,QAAQ,aAEtB,CACO;oBACxB,8EAAuB,IAAI,EAAC,aAAa,EAAC,SAAS,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK;wBAC9E,sEAAe,KAAK,EAAC,QAAQ,EAAC,QAAQ;4BACrC,sEAAe,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,gBAAgB,GAAG,CACrC;wBAChB,sEAAe,KAAK,EAAC,QAAQ;4BAC5B,sEAAe,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,gBAAgB,GAAG,CACrC,CACO;oBACxB,8EAAuB,OAAO,QAAC,UAAU,EAAC,UAAU,EAAC,WAAW,EAAC,WAAW,EAAC,IAAI,EAAC,cAAc;wBAC/F,8DAAO,IAAI,EAAC,OAAO,8BAAgC;wBAClD,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC;6BACzB,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC;6BAC1C,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACZ,qBAAe,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,IAAI,GAAG,IAC/C,IAAI,CACU,CAChB,CAAC,CACoB;oBACxB,8EAAuB,QAAQ,QAAC,UAAU,EAAC,UAAU,EAAC,WAAW,EAAC,WAAW,EAAC,IAAI,EAAC,cAAc;wBAChG,8DAAO,IAAI,EAAC,OAAO,4BAA8B;wBACjD,sEAAe,KAAK,EAAC,GAAG,cAAwB;wBAChD,sEAAe,KAAK,EAAC,GAAG,eAAyB;wBACjD,sEAAe,KAAK,EAAC,GAAG,YAAsB;wBAC9C,sEAAe,KAAK,EAAC,GAAG,YAAsB;wBAC9C,sEAAe,KAAK,EAAC,GAAG,UAAoB;wBAC5C,sEAAe,KAAK,EAAC,GAAG,WAAqB;wBAC7C,sEAAe,KAAK,EAAC,GAAG,WAAqB;wBAC7C,sEAAe,KAAK,EAAC,GAAG,aAAuB;wBAC/C,sEAAe,KAAK,EAAC,GAAG,gBAA0B;wBAClD,sEAAe,KAAK,EAAC,IAAI,cAAwB;wBACjD,sEAAe,KAAK,EAAC,IAAI,eAAyB;wBAClD,sEAAe,KAAK,EAAC,IAAI,eAAyB,CAC3B;oBACxB,4DAAK,KAAK,EAAC,gBAAgB;wBAC1B,8EAAuB,IAAI,EAAC,aAAa,EAAC,SAAS,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK;4BAC9E,sEAAe,KAAK,EAAC,QAAQ,EAAC,QAAQ;gCACrC,sEAAe,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,gBAAgB,GAAG,CACrC;4BAChB,sEAAe,KAAK,EAAC,QAAQ;gCAC5B,sEAAe,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,gBAAgB,GAAG,CACrC;4BAChB,sEAAe,KAAK,EAAC,MAAM;gCAC1B,sEAAe,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,cAAc,GAAG,CACnC,CACO;wBACxB,8EAAuB,IAAI,EAAC,eAAe,EAAC,SAAS,EAAE,KAAK,IAC1D,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAC3B,qBAAe,KAAK,EAAC,QAAQ,EAAC,QAAQ,EAAE,MAAM,KAAK,CAAC,IAClD,MAAM,CACQ,CAChB,CAAC,CACqB;wBACxB,uEAAgB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,YAAY,WAE7B,CACZ,CACD;gBACN,wEAAiB;gBACjB,uEACC,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,UAAU,EACf,WAAW,EAAC,OAAO,EACnB,KAAK,EAAE,IAAI,CAAC,QAAQ,EACpB,eAAe,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,eAEzC;gBACjB,uEACC,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,IAAI,CAAC,QAAQ,EACpB,WAAW,EAAC,QAAQ,EACpB,eAAe,EAAE,CAAC,CAAC,EAAE;wBACpB,MAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAA;wBAClC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAA;oBACzB,CAAC,eAEe;gBACjB,oFAA6B;gBAC7B,uEAAgB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,4BAE1C;gBACjB,uEAAgB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,2BAEzC;gBACjB,uEAAgB,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,8BAE3C;gBACjB,uEAAgB,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,mBAE7C;gBACjB,0GAAmD;gBAEnD,uEACC,QAAQ,QACR,IAAI,EAAC,cAAc,EACnB,OAAO,EAAE,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,EAClD,YAAY,EAAE,2BAA2B,EACzC,KAAK,EAAE,IAAI,CAAC,YAAY,EACxB,eAAe,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,MAAM,CAAC,YAAY,CAAC,mBAEjD;gBAEjB,2EAAoB;gBACpB,uEAAgB,IAAI,EAAC,iBAAiB,WAAsB;gBAC5D,uEAAgB,IAAI,EAAC,sBAAsB,gBAA2B;gBACtE,uEAAgB,IAAI,EAAC,kBAAkB,YAAuB;gBAC9D,uEAAgB,IAAI,EAAC,mBAAmB,aAAwB;gBAChE,uEAAgB,IAAI,EAAC,kBAAkB,YAAuB;gBAC9D,kFAA2B;gBAC3B,uEAAgB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,WAAW;oBAC3C,sEAAe,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,OAAO,GAAG;iCAEtC;gBACjB,uEAAgB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,YAAY;;oBAE5C,sEAAe,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,KAAK,GAAG,CACpC;gBACjB,uEAAgB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,YAAY,EAAC,WAAW,EAAC,OAAO;;oBAEhE,sEAAe,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,KAAK,GAAG,CACpC;gBACjB,uEAAgB,WAAW,EAAC,MAAM,GAAG;gBACrC,8EAAuB,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,QAAQ,EAAE,CAAC,CAAQ,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,EAAC,SAAS,GAAG;gBACtG,mFAA4B;gBAC5B,4DAAK,KAAK,EAAC,gBAAgB;oBAC1B,gFAAyB,QAAQ,QAAC,IAAI,EAAC,gBAAgB;wBACtD,sEAAe,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,MAAM,GAAG;gCAEzC;oBAC1B,gFAAyB,IAAI,EAAC,iBAAiB,EAAC,OAAO;wBACtD,sEAAe,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,MAAM,GAAG;;wBAElE,6EAAsB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,GAAG,CACtB;oBAC1B,gFAAyB,IAAI,EAAC,gBAAgB,UAA8B,CACvE;gBACN,sFAA+B;gBAC/B,6EAAsB,SAAS,QAAC,IAAI,EAAC,iBAAiB;oBACrD,sEAAe,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,OAAO,GAAG;oBACtD,8DAAO,IAAI,EAAC,OAAO,gBAAkB;oBACrC,kFAA2B,KAAK,EAAE,OAAO,cAAqC;oBAC9E,kFAA2B,QAAQ,QAAC,KAAK,EAAE,QAAQ,cAEvB;oBAC5B,kFAA2B,KAAK,EAAE,OAAO,cAAqC;oBAC9E,6EAAsB,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,GAAG,CACzB;gBACvB,6EAAsB,IAAI,EAAC,kBAAkB;oBAC5C,8DAAO,IAAI,EAAC,OAAO,oBAAsB;oBACzC,kFAA2B,KAAK,EAAE,OAAO,cAAqC;oBAC9E,kFAA2B,KAAK,EAAE,QAAQ,cAAqC;oBAC/E,kFAA2B,KAAK,EAAE,OAAO,cAAqC;oBAC9E,kFAA2B,KAAK,EAAE,QAAQ,cAAqC;oBAC/E,kFAA2B,KAAK,EAAE,OAAO,cAAqC;oBAC9E,kFAA2B,KAAK,EAAE,OAAO,cAAqC,CACxD;gBACvB,mFAA6B;gBAC7B,mFAA6B;gBAC7B,mFAA6B;gBAC7B,8EAAwB,CACnB,CACA,CACP,CAAA;IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Event, EventEmitter, h, Host, State } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\n\n@Component({\n\ttag: \"smoothly-input-demo\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputDemo {\n\t@State() duration: isoly.TimeSpan = { hours: 8 }\n\t@State() alphanumeric: string = \"!@##\"\n\tprivate numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9]\n\t@Event() smoothlyUrlUpdate: EventEmitter<{ path: string; query?: string }>\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-input-demo-standard />\n\t\t\t\t<smoothly-input-date-demo />\n\t\t\t\t<smoothly-input-demo-user-input />\n\t\t\t\t<smoothly-input-demo-radio />\n\t\t\t\t<div class=\"inputs\">\n\t\t\t\t\t<h2>Calendar</h2>\n\t\t\t\t\t<smoothly-input-date name=\"some-date\">Calendar</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date-time name=\"someDateTime\" value={isoly.DateTime.now()}>\n\t\t\t\t\t\tDateTime\n\t\t\t\t\t</smoothly-input-date-time>\n\t\t\t\t\t<h2>Date Range</h2>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"testing\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-01\"\n\t\t\t\t\t\tmax=\"2025-01-31\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"testing\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2024-12-30\">\n\t\t\t\t\t\t<smoothly-input-reset slot=\"end\" size=\"icon\" />\n\t\t\t\t\t</smoothly-input-date-range>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tlooks=\"grid\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\t\t\tshowLabel={false}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\"--smoothly-input-border-radius\": \"0.5rem\",\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" size=\"icon\" />\n\t\t\t\t\t</smoothly-input-date-range>\n\t\t\t\t\t<h2>Date</h2>\n\t\t\t\t\t<smoothly-input-date>Date</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date showLabel={false} value=\"2021-10-28\" max=\"2021-12-30\" min=\"2021-10-10\">\n\t\t\t\t\t\tDate\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date value=\"2021-10-28\">\n\t\t\t\t\t\tDate\n\t\t\t\t\t\t<smoothly-input-reset slot=\"end\" size=\"icon\" />\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date value=\"2021-10-28\">\n\t\t\t\t\t\tDate\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" size=\"icon\" />\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<h2>Select</h2>\n\t\t\t\t\t<div class=\"select-div\">\n\t\t\t\t\t\t<smoothly-input-select name=\"select-dessert\" looks=\"border\">\n\t\t\t\t\t\t\t<label slot=\"label\">Select with clear button</label>\n\t\t\t\t\t\t\t<smoothly-item value=\"1\">Ice cream</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"2\">Sponge cake</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"3\" disabled>\n\t\t\t\t\t\t\t\tDisabled Item\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"4\">Cookie</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"5\">Croissant</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"6\">Chocolate fondue</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select multiple name=\"select-dessert-multiple\" looks=\"border\">\n\t\t\t\t\t\t\t<label slot=\"label\">Select multiple with reset button</label>\n\t\t\t\t\t\t\t<smoothly-item value=\"ice cream\">Ice cream</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"sponge cake\">Sponge cake</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item selected value=\"cookie\">\n\t\t\t\t\t\t\t\tCookie\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"croissant\">Croissant</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item selected value=\"chocolate fondue\">\n\t\t\t\t\t\t\t\tChocolate fondue\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\" />\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select name=\"spirit-animals\" looks=\"border\" mutable>\n\t\t\t\t\t\t\t<label slot=\"label\">Select or add new options</label>\n\t\t\t\t\t\t\t<smoothly-item value=\"manatee\">Manatee</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item selected value=\"cthulu\">\n\t\t\t\t\t\t\t\tCthulu\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select name=\"select-icon\" clearable={false} showSelected={false}>\n\t\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select ordered menuHeight=\"7.5items\" placeholder=\"Select...\" name=\"select-month\">\n\t\t\t\t\t\t\t<label slot=\"label\">Alphabet ordered select</label>\n\t\t\t\t\t\t\t{Array.from({ length: 26 })\n\t\t\t\t\t\t\t\t.map((_, i) => String.fromCharCode(i + 65))\n\t\t\t\t\t\t\t\t.map(char => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value={char} selected={char == \"H\"}>\n\t\t\t\t\t\t\t\t\t\t{char}\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</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select multiple menuHeight=\"7.5items\" placeholder=\"Select...\" name=\"select-month\">\n\t\t\t\t\t\t\t<label slot=\"label\">Month multiple select</label>\n\t\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<div class=\"select-div-row\">\n\t\t\t\t\t\t\t<smoothly-input-select name=\"select-icon\" clearable={false} showSelected={false}>\n\t\t\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t<smoothly-item value=\"boat\">\n\t\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"boat-outline\" />\n\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input-select name=\"select-number\" clearable={false}>\n\t\t\t\t\t\t\t\t{this.numbers.map(number => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value=\"number\" selected={number === 3}>\n\t\t\t\t\t\t\t\t\t\t{number}\n\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input name=\"name\" value=\"Sten Qvist\">\n\t\t\t\t\t\t\t\tName\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t<h2>Duration</h2>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"duration\"\n\t\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\t\tplaceholder=\"hh:mm\"\n\t\t\t\t\t\tvalue={this.duration}\n\t\t\t\t\t\tonSmoothlyInput={e => (this.duration = e.detail.duration)}>\n\t\t\t\t\t\tDuration\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"duration\"\n\t\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\t\tvalue={this.duration}\n\t\t\t\t\t\tplaceholder=\"-hh:mm\"\n\t\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\t\tconst duration = e.detail.duration\n\t\t\t\t\t\t\tthis.duration = duration\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tDuration\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<h2>Integer with Min/Max</h2>\n\t\t\t\t\t<smoothly-input name=\"days\" type=\"integer\" min={0} max={365}>\n\t\t\t\t\t\tDays per year (0-365)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"hour\" type=\"integer\" min={0} max={23}>\n\t\t\t\t\t\tHours per day (0-23)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"minute\" type=\"integer\" min={0} max={59}>\n\t\t\t\t\t\tMinutes per hour (0-59)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"minute\" type=\"integer\" min={18} max={120}>\n\t\t\t\t\t\tAge (18-120)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<h2>Invalid text with warning icon and tooltip</h2>\n\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tcopyable\n\t\t\t\t\t\tname=\"alphanumeric\"\n\t\t\t\t\t\tinvalid={!/^[a-zA-Z0-9]+$/.test(this.alphanumeric)}\n\t\t\t\t\t\terrorMessage={\"Only alphanumeric allowed\"}\n\t\t\t\t\t\tvalue={this.alphanumeric}\n\t\t\t\t\t\tonSmoothlyInput={e => (this.alphanumeric = e.detail.alphanumeric)}>\n\t\t\t\t\t\tAlphanumeric\n\t\t\t\t\t</smoothly-input>\n\n\t\t\t\t\t<h2>Identifiers</h2>\n\t\t\t\t\t<smoothly-input type=\"identifier-code\">Code</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-attribute\">Attribute</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-snake\">Snake</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-pascal\">Pascal</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-camel\">Camel</smoothly-input>\n\t\t\t\t\t<h2>Input Alternatives</h2>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\" />\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\" placeholder=\"Smith\">\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\" />\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input placeholder=\"test\" />\n\t\t\t\t\t<smoothly-input-submit slot=\"submit\" fill=\"solid\" onSubmit={(e: Event) => alert(e)} color=\"success\" />\n\t\t\t\t\t<h4>Smoothly checkboxes</h4>\n\t\t\t\t\t<div class=\"checkbox-group\">\n\t\t\t\t\t\t<smoothly-input-checkbox disabled name=\"first-checkbox\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" size=\"tiny\" />\n\t\t\t\t\t\t\tFirst\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"second-checkbox\" checked>\n\t\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" size=\"tiny\" />\n\t\t\t\t\t\t\tsecond\n\t\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"third-checkbox\">3rd</smoothly-input-checkbox>\n\t\t\t\t\t</div>\n\t\t\t\t\t<h4>Smoothly Radio Buttons</h4>\n\t\t\t\t\t<smoothly-input-radio clearable name=\"radioFirstInput\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t\t<label slot=\"label\">Clearable</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 size=\"icon\" slot=\"end\" />\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-radio name=\"radioSecondInput\">\n\t\t\t\t\t\t<label slot=\"label\">Not clearable</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 value={\"second\"}>Label 2</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-radio-item value={\"fourth\"}>Label 4</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item value={\"fifth\"}>Label 5</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item value={\"sixth\"}>Label 6</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-range-demo />\n\t\t\t\t\t<smoothly-input-color-demo />\n\t\t\t\t\t<smoothly-input-price-demo />\n\t\t\t\t\t<smoothly-back-to-top />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/input/demo/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Host, State } from \"@stencil/core\"\nimport { isoly } from \"isoly\"\n\n@Component({\n\ttag: \"smoothly-input-demo\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyInputDemo {\n\t@State() duration: isoly.TimeSpan = { hours: 8 }\n\t@State() alphanumeric: string = \"!@##\"\n\tprivate numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9]\n\t@Event() smoothlyUrlUpdate: EventEmitter<{ path: string; query?: string }>\n\n\trender() {\n\t\treturn (\n\t\t\t<Host>\n\t\t\t\t<smoothly-input-demo-standard />\n\t\t\t\t<smoothly-input-date-demo />\n\t\t\t\t<smoothly-input-demo-user-input />\n\t\t\t\t<smoothly-input-demo-radio />\n\t\t\t\t<div class=\"inputs\">\n\t\t\t\t\t<h2>Calendar</h2>\n\t\t\t\t\t<smoothly-input-date name=\"some-date\">Calendar</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date-time name=\"someDateTime\" value={isoly.DateTime.now()}>\n\t\t\t\t\t\tDateTime\n\t\t\t\t\t</smoothly-input-date-time>\n\t\t\t\t\t<h2>Date Range</h2>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"testing\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-01\"\n\t\t\t\t\t\tmax=\"2025-01-31\"\n\t\t\t\t\t/>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tname=\"testing\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2024-12-30\">\n\t\t\t\t\t\t<smoothly-input-reset slot=\"end\" size=\"icon\" />\n\t\t\t\t\t</smoothly-input-date-range>\n\t\t\t\t\t<smoothly-input-date-range\n\t\t\t\t\t\tlooks=\"grid\"\n\t\t\t\t\t\tstart={isoly.Date.now()}\n\t\t\t\t\t\tend={isoly.Date.nextMonth(isoly.Date.now())}\n\t\t\t\t\t\tmin=\"2021-10-10\"\n\t\t\t\t\t\tmax=\"2025-12-30\"\n\t\t\t\t\t\tshowLabel={false}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\"--smoothly-input-border-radius\": \"0.5rem\",\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" size=\"icon\" />\n\t\t\t\t\t</smoothly-input-date-range>\n\t\t\t\t\t<h2>Date</h2>\n\t\t\t\t\t<smoothly-input-date>Date</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date showLabel={false} value=\"2021-10-28\" max=\"2021-12-30\" min=\"2021-10-10\">\n\t\t\t\t\t\tDate\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date value=\"2021-10-28\">\n\t\t\t\t\t\tDate\n\t\t\t\t\t\t<smoothly-input-reset slot=\"end\" size=\"icon\" />\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<smoothly-input-date value=\"2021-10-28\">\n\t\t\t\t\t\tDate\n\t\t\t\t\t\t<smoothly-input-clear slot=\"end\" size=\"icon\" />\n\t\t\t\t\t</smoothly-input-date>\n\t\t\t\t\t<h2>Select</h2>\n\t\t\t\t\t<div class=\"select-div\">\n\t\t\t\t\t\t<smoothly-input-select name=\"select-dessert\" looks=\"border\">\n\t\t\t\t\t\t\t<label slot=\"label\">Select with clear button</label>\n\t\t\t\t\t\t\t<smoothly-item value=\"1\">Ice cream</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"2\">Sponge cake</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"3\" disabled>\n\t\t\t\t\t\t\t\tDisabled Item\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"4\">Cookie</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"5\">Croissant</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"6\">Chocolate fondue</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select multiple name=\"select-dessert-multiple\" looks=\"border\">\n\t\t\t\t\t\t\t<label slot=\"label\">Select multiple with reset button</label>\n\t\t\t\t\t\t\t<smoothly-item value=\"ice cream\">Ice cream</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"sponge cake\">Sponge cake</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item selected value=\"cookie\">\n\t\t\t\t\t\t\t\tCookie\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"croissant\">Croissant</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item selected value=\"chocolate fondue\">\n\t\t\t\t\t\t\t\tChocolate fondue\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-input-reset size=\"icon\" slot=\"end\" />\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select name=\"spirit-animals\" looks=\"border\" mutable>\n\t\t\t\t\t\t\t<label slot=\"label\">Select or add new options</label>\n\t\t\t\t\t\t\t<smoothly-item value=\"manatee\">Manatee</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item selected value=\"cthulu\">\n\t\t\t\t\t\t\t\tCthulu\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select name=\"select-icon\" clearable={false} showSelected={false}>\n\t\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select ordered menuHeight=\"7.5items\" placeholder=\"Select...\" name=\"select-month\">\n\t\t\t\t\t\t\t<label slot=\"label\">Alphabet ordered select</label>\n\t\t\t\t\t\t\t{Array.from({ length: 26 })\n\t\t\t\t\t\t\t\t.map((_, i) => String.fromCharCode(i + 65))\n\t\t\t\t\t\t\t\t.map(char => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value={char} selected={char == \"H\"}>\n\t\t\t\t\t\t\t\t\t\t{char}\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</smoothly-input-select>\n\t\t\t\t\t\t<smoothly-input-select multiple menuHeight=\"7.5items\" placeholder=\"Select...\" name=\"select-month\">\n\t\t\t\t\t\t\t<label slot=\"label\">Month multiple select</label>\n\t\t\t\t\t\t\t<smoothly-item value=\"1\">January</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"2\">February</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"3\">March</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"4\">April</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"5\">May</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"6\">June</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"7\">July</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"8\">August</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"9\">September</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"10\">October</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"11\">November</smoothly-item>\n\t\t\t\t\t\t\t<smoothly-item value=\"12\">December</smoothly-item>\n\t\t\t\t\t\t</smoothly-input-select>\n\n\t\t\t\t\t\t<div class=\"select-div-row\">\n\t\t\t\t\t\t\t<smoothly-input-select name=\"select-icon\" clearable={false} showSelected={false}>\n\t\t\t\t\t\t\t\t<smoothly-item value=\"folder\" selected>\n\t\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"folder-outline\" />\n\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t<smoothly-item value=\"camera\">\n\t\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"camera-outline\" />\n\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t<smoothly-item value=\"boat\">\n\t\t\t\t\t\t\t\t\t<smoothly-icon size=\"small\" name=\"boat-outline\" />\n\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input-select name=\"select-number\" clearable={false}>\n\t\t\t\t\t\t\t\t{this.numbers.map(number => (\n\t\t\t\t\t\t\t\t\t<smoothly-item value=\"number\" selected={number === 3}>\n\t\t\t\t\t\t\t\t\t\t{number}\n\t\t\t\t\t\t\t\t\t</smoothly-item>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</smoothly-input-select>\n\t\t\t\t\t\t\t<smoothly-input name=\"name\" value=\"Sten Qvist\">\n\t\t\t\t\t\t\t\tName\n\t\t\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<smoothly-input-select\n\t\t\t\t\t\t\tname=\"persistent-search\"\n\t\t\t\t\t\t\tisSearchPersistent\n\t\t\t\t\t\t\tmenuHeight=\"7.5items\"\n\t\t\t\t\t\t\tsearchPlaceholder=\"Not here? Type to search.\">\n\t\t\t\t\t\t\t<label slot=\"label\">Persistent Search select</label>\n\t\t\t\t\t\t\t{this.numbers.map(number => (\n\t\t\t\t\t\t\t\t<smoothly-item value={number}>{number}</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</div>\n\t\t\t\t\t<h2>Duration</h2>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"duration\"\n\t\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\t\tplaceholder=\"hh:mm\"\n\t\t\t\t\t\tvalue={this.duration}\n\t\t\t\t\t\tonSmoothlyInput={e => (this.duration = e.detail.duration)}>\n\t\t\t\t\t\tDuration\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tname=\"duration\"\n\t\t\t\t\t\ttype=\"duration\"\n\t\t\t\t\t\tvalue={this.duration}\n\t\t\t\t\t\tplaceholder=\"-hh:mm\"\n\t\t\t\t\t\tonSmoothlyInput={e => {\n\t\t\t\t\t\t\tconst duration = e.detail.duration\n\t\t\t\t\t\t\tthis.duration = duration\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tDuration\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<h2>Integer with Min/Max</h2>\n\t\t\t\t\t<smoothly-input name=\"days\" type=\"integer\" min={0} max={365}>\n\t\t\t\t\t\tDays per year (0-365)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"hour\" type=\"integer\" min={0} max={23}>\n\t\t\t\t\t\tHours per day (0-23)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"minute\" type=\"integer\" min={0} max={59}>\n\t\t\t\t\t\tMinutes per hour (0-59)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input name=\"minute\" type=\"integer\" min={18} max={120}>\n\t\t\t\t\t\tAge (18-120)\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<h2>Invalid text with warning icon and tooltip</h2>\n\n\t\t\t\t\t<smoothly-input\n\t\t\t\t\t\tcopyable\n\t\t\t\t\t\tname=\"alphanumeric\"\n\t\t\t\t\t\tinvalid={!/^[a-zA-Z0-9]+$/.test(this.alphanumeric)}\n\t\t\t\t\t\terrorMessage={\"Only alphanumeric allowed\"}\n\t\t\t\t\t\tvalue={this.alphanumeric}\n\t\t\t\t\t\tonSmoothlyInput={e => (this.alphanumeric = e.detail.alphanumeric)}>\n\t\t\t\t\t\tAlphanumeric\n\t\t\t\t\t</smoothly-input>\n\n\t\t\t\t\t<h2>Identifiers</h2>\n\t\t\t\t\t<smoothly-input type=\"identifier-code\">Code</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-attribute\">Attribute</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-snake\">Snake</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-pascal\">Pascal</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"identifier-camel\">Camel</smoothly-input>\n\t\t\t\t\t<h2>Input Alternatives</h2>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.last\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t\tFirst Name\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\">\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\" />\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input type=\"text\" name=\"name.first\" placeholder=\"Smith\">\n\t\t\t\t\t\tLast Name\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"end\" />\n\t\t\t\t\t</smoothly-input>\n\t\t\t\t\t<smoothly-input placeholder=\"test\" />\n\t\t\t\t\t<smoothly-input-submit slot=\"submit\" fill=\"solid\" onSubmit={(e: Event) => alert(e)} color=\"success\" />\n\t\t\t\t\t<h4>Smoothly checkboxes</h4>\n\t\t\t\t\t<div class=\"checkbox-group\">\n\t\t\t\t\t\t<smoothly-input-checkbox disabled name=\"first-checkbox\">\n\t\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" size=\"tiny\" />\n\t\t\t\t\t\t\tFirst\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"second-checkbox\" checked>\n\t\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" size=\"tiny\" />\n\t\t\t\t\t\t\tsecond\n\t\t\t\t\t\t\t<smoothly-input-clear size=\"icon\" slot=\"end\" />\n\t\t\t\t\t\t</smoothly-input-checkbox>\n\t\t\t\t\t\t<smoothly-input-checkbox name=\"third-checkbox\">3rd</smoothly-input-checkbox>\n\t\t\t\t\t</div>\n\t\t\t\t\t<h4>Smoothly Radio Buttons</h4>\n\t\t\t\t\t<smoothly-input-radio clearable name=\"radioFirstInput\">\n\t\t\t\t\t\t<smoothly-icon name=\"checkmark-circle\" slot=\"start\" />\n\t\t\t\t\t\t<label slot=\"label\">Clearable</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 size=\"icon\" slot=\"end\" />\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-radio name=\"radioSecondInput\">\n\t\t\t\t\t\t<label slot=\"label\">Not clearable</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 value={\"second\"}>Label 2</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-radio-item value={\"fourth\"}>Label 4</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item value={\"fifth\"}>Label 5</smoothly-input-radio-item>\n\t\t\t\t\t\t<smoothly-input-radio-item value={\"sixth\"}>Label 6</smoothly-input-radio-item>\n\t\t\t\t\t</smoothly-input-radio>\n\t\t\t\t\t<smoothly-input-range-demo />\n\t\t\t\t\t<smoothly-input-color-demo />\n\t\t\t\t\t<smoothly-input-price-demo />\n\t\t\t\t\t<smoothly-back-to-top />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}

package/dist/collection/components/input/demo/price/index.js CHANGED Viewed

@@ -6,7 +6,7 @@ export class SmoothlyInputPriceDemo {
         this.currency = "USD";
     }
     render() {
-        return (h(Host, { key: '2643df3e90deb2ae7492de2e95307210c9d96a1a' }, h("h2", { key: '8d7c08032c0fd5d42ea0a4b83bbc789ee12ad60c' }, "State demo on smoothly-input"), h("p", { key: '7bd734e458356493b22a048bf6b3cc33eb089a88' }, "This demo/test the internal state of the smoothly-input component."), h("p", { key: '9129cc133c3e16c1473ce93c4bf4e85f02e1dc76' }, "The currency of the price should update when switching between the currencies."), h("smoothly-input-radio", { key: '100da1f7a7e0a4e8ccb610211dc1ef0f9a324853', name: "currency", onSmoothlyInput: e => (this.currency = isoly.Currency.is(e.detail.currency) ? e.detail.currency : undefined) }, this.currencies.map(currency => (h("smoothly-input-radio-item", { key: currency, selected: currency == this.currency, value: currency }, currency)))), h("smoothly-input", { key: 'b60680c3c0a27ab6e1616844da966aaf5add80fe', type: "price", currency: this.currency }, "price")));
+        return (h(Host, { key: 'c7b07f8d277b3a91da7389f15338e1c3ceeb71e6' }, h("h2", { key: '1ff6b680677204eb802cb3fe21ed533903c17cca' }, "State demo on smoothly-input"), h("p", { key: '5e322e242eb2ef3dc4400e59745e8cf806126735' }, "This demo/test the internal state of the smoothly-input component."), h("p", { key: '839cebc0650dbe161f76620a62809a3213f11889' }, "The currency of the price should update when switching between the currencies."), h("smoothly-input-radio", { key: 'ef6d1e619f0ae3598de284efa24bcfcebcc92e13', name: "currency", onSmoothlyInput: e => (this.currency = isoly.Currency.is(e.detail.currency) ? e.detail.currency : undefined) }, this.currencies.map(currency => (h("smoothly-input-radio-item", { key: currency, selected: currency == this.currency, value: currency }, currency)))), h("smoothly-input", { key: '36eb82850d2472f5e9e02c88bbdcda3a9a4a8184', type: "price", currency: this.currency }, "price")));
     }
     static get is() { return "smoothly-input-price-demo"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/input/demo/radio/index.js CHANGED Viewed

@@ -4,7 +4,7 @@ export class SmoothlyInputDemoRadio {
         console.log("selected", this.selected);
     }
     render() {
-        return (h(Host, { key: '1d9b9369e8ab2eaef5660633873c4e9d6688446c' }, h("h2", { key: '3ce4a937fed4e899be4becf616b328eb3bbf6807' }, "radio input - column direction"), h("smoothly-input-radio", { key: '3f99a12df3e65d6e43ca7c1f592dc4c358b4f173', name: "radio", direction: "column", onSmoothlyInput: e => (this.selected = e.detail.radio) }, h("smoothly-input-radio-item", { key: 'feda533691060ea6c92b08268e5ce977b535e8cb', value: "1" }, h("span", { key: '3635ace507b96b4596f612244f47bd52fa4efbde' }, "Option 1"), h("span", { key: 'fed88b7f85dcb5f40bd76defb20d337945ae1973', slot: "detail" }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")), h("smoothly-input-radio-item", { key: '4973ad139be68dadadf3632b10734a70cd9dadec', value: "2", selected: true }, h("span", { key: '0c00fc9d3fe743d98322e37b04d250207ccb86dd' }, "Option 2"), h("div", { key: 'd2eda29ea9aabb04c4f017b7cb9f3500033efc38', slot: "detail" }, h("smoothly-tabs", { key: 'df82602edfa7865c748dfc801b275ee6ad420798' }, h("smoothly-tab", { key: '5d0d4ad5de30797b4146bbd3b49f3d437eeb7be0', label: "Dog", name: "dog", open: true }, "\uD83D\uDC15"), h("smoothly-tab", { key: '96c1e24f24443f3ca5ed9110c1f61bfe83e77922', label: "Cat", name: "cat" }, "\uD83D\uDC08"), h("smoothly-tab", { key: 'fec1d4386c7221ed7164f89b0c4b74caac413a54', label: "Rat", name: "rat" }, "\uD83D\uDC00")))))));
+        return (h(Host, { key: 'c5f13f1f1719524fa54e2b506974c031693361a2' }, h("h2", { key: '16b9142736583c06f5d4fdccb7f2cb3883ad15b2' }, "radio input - column direction"), h("smoothly-input-radio", { key: 'fd8665109263a23b2a8b1f57888388cb232f1307', name: "radio", direction: "column", onSmoothlyInput: e => (this.selected = e.detail.radio) }, h("smoothly-input-radio-item", { key: '7509bdba2358b4ce60e121dfaa76874ad388f6a0', value: "1" }, h("span", { key: 'd8ed1cf2ba7e979239e35286b561151f81ffe220' }, "Option 1"), h("span", { key: 'e87b5fb84fef10c368acc6ed0dc77a5dd2f6e2c5', slot: "detail" }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")), h("smoothly-input-radio-item", { key: 'c76b0016d8f9c519166b121642bea547a0f1ca19', value: "2", selected: true }, h("span", { key: 'e573119b6a2be32a078de84bc4941f1f3a9ee76c' }, "Option 2"), h("div", { key: 'f7b4e4bcf85bd8cacc52d119e6cae9925fb6474a', slot: "detail" }, h("smoothly-tabs", { key: '75bf5aafdbd8f4186f70f12af13c4bbbdc4e6a43' }, h("smoothly-tab", { key: 'c02c4b6d471fb5b37dff0758b53d5dde4e1b705a', label: "Dog", name: "dog", open: true }, "\uD83D\uDC15"), h("smoothly-tab", { key: '83e8e9179dac5f74d87ca5c9011a77d2c8185b3d', label: "Cat", name: "cat" }, "\uD83D\uDC08"), h("smoothly-tab", { key: '4be8b9bc53065ed86c0a46b337aeb961bd040006', label: "Rat", name: "rat" }, "\uD83D\uDC00")))))));
     }
     static get is() { return "smoothly-input-demo-radio"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/input/demo/standard/index.js CHANGED Viewed

@@ -20,7 +20,7 @@ export class SmoothlyInputDemoStandard {
         });
     }
     render() {
-        return (h(Host, { key: '54cf2b88dfb0ae3326c332e0d608b5e2aab4e2af' }, h("div", { key: 'c549a1f2bf55faa1db79e85170fd5106269400d0', class: "description" }, h("h2", { key: '4cd8be6f457b84c4363c93262a0a8c57d6ad794a' }, "Input Standard"), h("p", { key: 'd704b09fb11c51a92fa618c106039ed01695ce58' }, "Height of input should be ", h("code", { key: 'abee88ddb4d762af1cde9a6f7c94ad13fd069152' }, "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: '0922d6713e44cffa51cc253e94fb1ae98a823f24', looks: "grid", onSmoothlyFormInput: (e) => (this.options = e.detail) }, h("smoothly-input-select", { key: '1cdba85a6cddb32a49a763394b8cdb7b36d2c24a', name: "color" }, h("span", { key: '58013cb8ab43cc7cc05f6ab58670ec5f41eab179', slot: "label" }, "Color"), Color.values.map(c => (h("smoothly-item", { value: c }, h("span", { color: c }, c)))), h("smoothly-input-clear", { key: '0eae109840ebc9b0101fb08f7daa61253826da9c', slot: "end" })), h("smoothly-input-select", { key: 'f48cf9bd8f86d1eb5e68e3383bf9178ea27b5f22', name: "looks" }, h("span", { key: 'd6f665f4cbc8e871229312e611180bc0bf9607d1', slot: "label" }, "Looks"), Looks.values.map(l => (h("smoothly-item", { value: l }, l)))), h("smoothly-input-range", { key: '955d191d8da75e9dace4c57e6f6f3d427bdac864', label: "Border Radius (rem)", name: "borderRadius", min: 0, max: 2, step: 0.25 }), h("smoothly-input-checkbox", { key: 'cbd64dab264df038bf40efa6c2d8733f6c767185', name: "readonly" }, "Readonly"), h("smoothly-input-checkbox", { key: 'e5a2a80fba021019871563ac7197360060ccb451', name: "disabled" }, "Disabled"), h("smoothly-input-checkbox", { key: 'f1bca93555a7cc9fa7a56a39e6bbdfc5b7570edc', name: "invalid" }, "Invalid"), h("smoothly-input", { key: '15361ba7d104e800e627aebc52d8fff1623782b9', name: "errorMessage", value: "This is not a valid value" }, "Error Message"), h("smoothly-input-checkbox", { key: '649cc21e6575e27e765e17443678f14ac73ba84f', name: "showLabel", checked: true }, "Show Label"), h("smoothly-input", { key: '59125e661fdf79f98c9d5a0f8f2c97eeb52f2b52', name: "placeholder" }, "Placeholder"), h("smoothly-input-checkbox", { key: 'bc3803d7f0e97f5f8b7c863153aa0ce0d382e1de', name: "alwaysShowGuide" }, "Always Show Guide (for date inputs)"))), h("div", { key: '44d87477325a59e8b62c1f7ce3a29cdc29705916', class: "input-wrapper", style: { "--smoothly-input-border-radius": `${this.options.borderRadius}rem` } }, h("div", { key: '0adfeb398a2f6f969d206cb46eb4776808fd4fc9', class: "width" }, "width: 100%"), h("div", { key: '1e617acd8e12c75a00259062602a8ef8775651cf', class: "left-padding" }, "padding-left: 0.5rem"), h("smoothly-input", { key: '9521d2afdc06788925f96c2d0702fd3f00466359', name: "text", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, showLabel: this.options.showLabel, placeholder: this.options.placeholder }, this.options.showLabel && h("span", { key: '75e835255286d02e1b8185902b4df7fc2b0a1147' }, "Text"), h("smoothly-input-clear", { key: 'ddd739321caa1aad97518efcde5068fef178b456', slot: "end" })), h("div", { key: 'a4ad7dae327fc4cf6fb5caa803f388f31d06ecff', class: "height" }), h("smoothly-input-select", { key: 'f231934cefc5d3821b6f520e72ce616c8df1edf2', name: "month", color: this.options.color, looks: this.options.looks, menuHeight: "6.7items", readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, placeholder: this.options.placeholder }, this.options.showLabel && h("label", { key: 'a2b4eebb1dea9f2d1b22fd1be6b93a93b0597f7c', slot: "label" }, "Select"), h("smoothly-item", { key: '1fb2b0202b27ce56ca8e2fa06caed522ff0b5b3a', value: "1" }, "January"), h("smoothly-item", { key: '72aa6742664a98052cc7141e5a687b1cf813faff', value: "2" }, "February"), h("smoothly-item", { key: '27a92cf4d1d270763606d11a1b2b863d714a18b9', value: "3" }, "March"), h("smoothly-item", { key: '376e37b6c878d72052c0567c7ea8c5ddaedde42c', value: "4" }, "April"), h("smoothly-item", { key: 'ee5cb30a384b68ac775d4f2dd14d999876cc6e01', value: "5" }, "May"), h("smoothly-item", { key: '1cccb653d2ba1e1c26f71b9d6d8d21b10c21640b', value: "6" }, "June"), h("smoothly-item", { key: '53d755ca36cda89d4940b7870a2deab407b4aa8e', value: "7" }, "July"), h("smoothly-item", { key: 'bd2d030a7572e8deab0c4fb4bb5d46909e2152f5', value: "8" }, "August"), h("smoothly-item", { key: '4aced24179d7ea64fd2e2974d121ede5530cbc4e', value: "9" }, "September"), h("smoothly-item", { key: '175e1169c83cc572769b74b6e3423ed8c2cf16ff', value: "10" }, "October"), h("smoothly-item", { key: 'c9c658f19451bb0fa45deb3b1474ea26d303ec6d', value: "11" }, "November"), h("smoothly-item", { key: '02072c3b0f758a906a37c389d74dc9d1f5afd448', value: "12" }, "December"), h("smoothly-input-clear", { key: '363af4a49d65196a12635c968b2c8c4af91a056f', slot: "end" })), h("div", { key: 'c81bee8b491579b8707397127ecbf54f3539034b', class: "height" }), h("smoothly-input-checkbox", { key: 'edf6953cc408b492b44e68c62607a530a8874438', name: "checkbox", checked: true, color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled }, "Check", h("smoothly-input-reset", { key: 'eb5e4c9ac0a1589a42aa19923232cfe13fa64361', slot: "end" })), h("div", { key: '97202244d11753ea46184bec8c5b9dfe31e2e0d3', class: "height" }), h("smoothly-input-radio", { key: '8302f3b0ed032f66c75c286b4f0cf4aae285c35a', name: "radio", clearable: true, color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, showLabel: this.options.showLabel }, this.options.showLabel && h("label", { key: 'cd39ed8dc900e22b6efa93e2ef5b4255dad1660d', slot: "label" }, "Radio"), h("smoothly-input-radio-item", { key: '8bb8c65b1e90e4e442de1d1329965112667d2eba', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: '933fbb50487b72cd8f1ecc196547de5aee5e1e3a', selected: true, value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: '6ae375b8ea906bc5f8cfa8f8407a9aee8eb29ab0', value: "third" }, "Label 3"), h("smoothly-input-clear", { key: '78c245bd8bf62b9df6937d572f3f815e84cd9bd3', slot: "end" })), h("div", { key: 'f5df508ced55175718eaa0f19431f900ff0d2788', class: "height" }), h("smoothly-input-file", { key: '5d4ae4418d3f7013cf22f8fb0f78bd93f0ecb979', name: "file", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, showLabel: this.options.showLabel, placeholder: this.options.placeholder }, this.options.showLabel && h("span", { key: 'd462612c0e9e13643f4a7df616edcbee8f006b1d', slot: "label" }, "File"), h("smoothly-input-clear", { key: 'ffc7bd441f3dff66eacb3ed51f5844d63aee7ef5', slot: "end" })), h("div", { key: 'c29124164ed913c99cfe804486c354ffa7653132', class: "height" }), h("smoothly-input-range", { key: '6aa933677354590b9ddd1f95fea3a1cf541f7696', name: "range", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, label: this.options.showLabel ? "Range" : undefined }, h("smoothly-input-clear", { key: '46d9c421bf413d7af9f4a8d2cdd695600af7ded5', slot: "end" })), h("div", { key: '93acf05936faabd3aa658e2ea7bb9dcf012d908d', class: "height" }), h("smoothly-input-color", { key: '93b1fe1b0383b938248d54827bf9983a9914b3ef', name: "color", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: 'b796f92deb8e0d60d1ac58cd8106009e2ed1c2cd' }, "Color"), h("smoothly-input-clear", { key: 'b28f8a1870a419d0afe6cfa8e0f9fc7302909e86', slot: "end" })), h("div", { key: 'aea88b754fff22bae5ab652fbcd1a41d9c8cf895', class: "height" }), h("smoothly-input-date", { key: '1c910d8bc7eb1d7348afc5206d6d934e645cec82', name: "date", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, showLabel: this.options.showLabel, placeholder: this.options.placeholder, alwaysShowGuide: this.options.alwaysShowGuide }, this.options.showLabel && h("span", { key: 'ba7c7b9530c8890283b2357bb21e92bc25d64f7f' }, "Date"), h("smoothly-input-clear", { key: '6abc2e55907861115339e3e13171751c0db11bac', slot: "end" })), h("div", { key: '164956934ba95e7edaf0631840da001d195ac246', class: "height" }), h("smoothly-input-date-time", { key: '6cfe15912a517a36a9398bb9aaa8bf0d18a67171', name: "dateTime", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, showLabel: this.options.showLabel }, "DateTime", h("smoothly-input-clear", { key: '79304b822a99ca3c24573e6383bf53855352ce0e', slot: "end" })), h("div", { key: '8a7d1e32a5e7599813f9e3e1c6e53ccfcb0ac546', class: "height" }), h("smoothly-input-date-range", { key: 'ad46ae4f0436a0387daf5a8f4dd9f408d96454f8', name: "dateRange", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, placeholder: this.options.placeholder, alwaysShowGuide: this.options.alwaysShowGuide, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: 'f2855738add5a20423d72a6faeacf9184feb27af' }, "Date Range"), h("smoothly-input-clear", { key: 'f84b6db52dafa6b2c85f8cb807daf0c6199007a1', slot: "end" })), h("div", { key: '54f5a41d2d404c7d17ab212ddbd07c85a2b45966', class: "height" }))));
+        return (h(Host, { key: '565969b29cb4026161d464de5f1098867eb349da' }, h("div", { key: '8dfe9097349f2a7e7d6213f21148451d67f3a2dc', class: "description" }, h("h2", { key: 'ab251407c1b18d95ab4acd9c2a16ce528b8e1916' }, "Input Standard"), h("p", { key: '9991d8aa06f8c0315473506dc96abea6c32a95f5' }, "Height of input should be ", h("code", { key: 'f35b5bae310077317f25a440dee0fb91b7ad1c49' }, "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: '834178266280b7dfe37ab9294846ce7344f7ffa2', looks: "grid", onSmoothlyFormInput: (e) => (this.options = e.detail) }, h("smoothly-input-select", { key: '173b6aa75c138f16a6f39a8153c53520e1cb4667', name: "color" }, h("span", { key: 'ca1d64b4cdbc55de31e0b8e3debba0bcb1062283', slot: "label" }, "Color"), Color.values.map(c => (h("smoothly-item", { value: c }, h("span", { color: c }, c)))), h("smoothly-input-clear", { key: '725b080604c10861eca04ffb2b031743f7dde0c7', slot: "end" })), h("smoothly-input-select", { key: '3b095e076235b0bd7c8668def6b357a807e573bf', name: "looks" }, h("span", { key: '8394ea2aaa44301db48cbf85539721b76bfcae8c', slot: "label" }, "Looks"), Looks.values.map(l => (h("smoothly-item", { value: l }, l)))), h("smoothly-input-range", { key: '04621b7e3fe74a983f5827cfbbf7dffd62c01b0d', label: "Border Radius (rem)", name: "borderRadius", min: 0, max: 2, step: 0.25 }), h("smoothly-input-checkbox", { key: '7845252b0f9628b6c8ddaaddf6e603b5c793a564', name: "readonly" }, "Readonly"), h("smoothly-input-checkbox", { key: '11160109586cc4bff53de12230c200a739bb2855', name: "disabled" }, "Disabled"), h("smoothly-input-checkbox", { key: '38a61ebe5da7cc5fafc56cf311ed821c66ad58d3', name: "invalid" }, "Invalid"), h("smoothly-input", { key: '7371362ea0fe16f777d816ed26c2bbd96b9c6531', name: "errorMessage", value: "This is not a valid value" }, "Error Message"), h("smoothly-input-checkbox", { key: 'e405da1dd51a6b741fd284e3b84fd272bff1e5f5', name: "showLabel", checked: true }, "Show Label"), h("smoothly-input", { key: 'c9042135f21280ad38eae8ea1b15e810650a34cb', name: "placeholder" }, "Placeholder"), h("smoothly-input-checkbox", { key: 'c43ee5611eed8d05392b8af7bb51289cc7c81252', name: "alwaysShowGuide" }, "Always Show Guide (for date inputs)"))), h("div", { key: 'bbeb50ec5367e51297a5636d7e98b19e1e943079', class: "input-wrapper", style: { "--smoothly-input-border-radius": `${this.options.borderRadius}rem` } }, h("div", { key: 'ab3ed4cd95f58bcdeee1a606ca93228a80a23e60', class: "width" }, "width: 100%"), h("div", { key: '1c0e7739a2c085b5795143700e407b75b00c4119', class: "left-padding" }, "padding-left: 0.5rem"), h("smoothly-input", { key: '66c1e55882d9eac4827a612f1e2bc23d647ab3e5', name: "text", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, showLabel: this.options.showLabel, placeholder: this.options.placeholder }, this.options.showLabel && h("span", { key: '138636342ba55fe7123c2c2a6c20d9dfb4ee5f60' }, "Text"), h("smoothly-input-clear", { key: '3b3a28fb80a525f59eb268807b2343c0719af331', slot: "end" })), h("div", { key: 'e5ae5e25f0e038678c2e51c5de7b15df9f50995e', class: "height" }), h("smoothly-input-select", { key: 'd4e65e0e5ec3ffa9a20982853b8ec4eeccf944d9', name: "month", color: this.options.color, looks: this.options.looks, menuHeight: "6.7items", readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, placeholder: this.options.placeholder }, this.options.showLabel && h("label", { key: '6aebe9d702f31518eaac40a18d5fd576c59e9375', slot: "label" }, "Select"), h("smoothly-item", { key: '3313ee1b456498764ec67d2c315d341188be997f', value: "1" }, "January"), h("smoothly-item", { key: '8f401f914c7dba15ff927d0630b4f981b46fbff5', value: "2" }, "February"), h("smoothly-item", { key: 'e92167e28806a39e68648aa87b9c4b428f0c22c8', value: "3" }, "March"), h("smoothly-item", { key: '2ed2bccc780279cdeb5c9ec14ee774547735bb3b', value: "4" }, "April"), h("smoothly-item", { key: 'f4c9e6138ec0f470b86057cc8f472d14ea38a6ee', value: "5" }, "May"), h("smoothly-item", { key: '86666e444e49a4fad6a0e62d7572159a7b530cd5', value: "6" }, "June"), h("smoothly-item", { key: 'aa409f39093a8c2cdf8577834928d62b94a82a5c', value: "7" }, "July"), h("smoothly-item", { key: '98ca4aefcc72bb0b62f9fef6a2a06d97fa19c636', value: "8" }, "August"), h("smoothly-item", { key: 'ac4236a6dc21b2b52b57b983a622552751321aed', value: "9" }, "September"), h("smoothly-item", { key: 'b6aa81c1adc8b28bc306f850b3b35f3d01026935', value: "10" }, "October"), h("smoothly-item", { key: '9067b78e9a5c8024321ed20c9c11403f6171124e', value: "11" }, "November"), h("smoothly-item", { key: 'f4a2448b92497773440a7602f96c2f007bba6bf4', value: "12" }, "December"), h("smoothly-input-clear", { key: 'bda865a858903d63b0c0f3b599aabdfbd11ff906', slot: "end" })), h("div", { key: 'c4c21ffe5abb9a278e58495d148488cb2fa0efb7', class: "height" }), h("smoothly-input-checkbox", { key: 'd329acedf41e7a97dbd9722b47b0bbb685c03fd1', name: "checkbox", checked: true, color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled }, "Check", h("smoothly-input-reset", { key: 'b65bbc409d050d7530a141d0ba27b67a9ef02b95', slot: "end" })), h("div", { key: '6ce56c0613de52c5e7ea9cca1625386d36e39c9f', class: "height" }), h("smoothly-input-radio", { key: '9ac8654a0369a7a3e1f5d4e6021d19f65c481151', name: "radio", clearable: true, color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, showLabel: this.options.showLabel }, this.options.showLabel && h("label", { key: '834e8faeb267255422065b193872a9a55e8f21fa', slot: "label" }, "Radio"), h("smoothly-input-radio-item", { key: '6a9c64355615f74973d23d31d226a41653cf04f0', value: "first" }, "Label 1"), h("smoothly-input-radio-item", { key: '90aeffb2a08bb1a4ead6fac140022e1fbb6562de', selected: true, value: "second" }, "Label 2"), h("smoothly-input-radio-item", { key: '659a872eb48ec26a4dfdd8865b79d47378d266b6', value: "third" }, "Label 3"), h("smoothly-input-clear", { key: '2b852706751a90a1954596dbeeabc7d10c1e62a3', slot: "end" })), h("div", { key: '35ae222dd32c0a24f5047c589b1240b3e1dbadc2', class: "height" }), h("smoothly-input-file", { key: 'd2c1b6df5cf570bf46874c9472ed3ceef60729b8', name: "file", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, showLabel: this.options.showLabel, placeholder: this.options.placeholder }, this.options.showLabel && h("span", { key: 'c076b435acdd7a14a6a377bb3f9772904736caf7', slot: "label" }, "File"), h("smoothly-input-clear", { key: '20e32d6fbac42c4617b5aaffca12f1e68f09156f', slot: "end" })), h("div", { key: 'bf99bffecc00feebaa1027ec7f99bcd51d7661f6', class: "height" }), h("smoothly-input-range", { key: 'e266bbb8ceb3dcf33bbe745d43a108d40fe97d96', name: "range", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, label: this.options.showLabel ? "Range" : undefined }, h("smoothly-input-clear", { key: '329f737f8c88d1c68f62d0227293cbff2668b903', slot: "end" })), h("div", { key: '5f5e44e62c2658812f79fff1ceb47f2fc70e0018', class: "height" }), h("smoothly-input-color", { key: '8c39c11aa2d6551e67658f6b17a2be577bfc0be2', name: "color", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: '69ff977d1d74c9c1575930668cdd8cd25c63cb7a' }, "Color"), h("smoothly-input-clear", { key: '62ef604e4ac15e5808151c44d951c9ee14fcfcc4', slot: "end" })), h("div", { key: '5f2cf9fcffd64dc04a7f92c812e8eb74d4574d7b', class: "height" }), h("smoothly-input-date", { key: 'f9778ed78fafb18e5786c522a3dbac2b8a29941f', name: "date", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, showLabel: this.options.showLabel, placeholder: this.options.placeholder, alwaysShowGuide: this.options.alwaysShowGuide }, this.options.showLabel && h("span", { key: '71cd8a2aaff8724eb2cd1f61312939cde42628ba' }, "Date"), h("smoothly-input-clear", { key: '3a457f21009edb59edda1486cd15861e3f477441', slot: "end" })), h("div", { key: '1adc30f659052cc8a4bcb39d9f7ae9ee098c8d46', class: "height" }), h("smoothly-input-date-time", { key: 'dd2744ca25ad41f47e74c1fcdcd18a35d6727cab', name: "dateTime", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, showLabel: this.options.showLabel }, "DateTime", h("smoothly-input-clear", { key: '79d65744abdb53f4ba552e804ed8c4b7876289a5', slot: "end" })), h("div", { key: '0c9fa58c169272bc1cfe98760c977d898123f195', class: "height" }), h("smoothly-input-date-range", { key: '8d0530766b4278c9a0e1bf752c5201a8a1150cb8', name: "dateRange", color: this.options.color, looks: this.options.looks, readonly: this.options.readonly, disabled: this.options.disabled, invalid: this.options.invalid, errorMessage: this.options.errorMessage, placeholder: this.options.placeholder, alwaysShowGuide: this.options.alwaysShowGuide, showLabel: this.options.showLabel }, this.options.showLabel && h("span", { key: 'ced591c321b40cb26ac60adc79c9aef515ba84d4' }, "Date Range"), h("smoothly-input-clear", { key: '126e55235695f0e2ce4bee0c4a9f51699dd9ef63', slot: "end" })), h("div", { key: '30cfa18368611c241479cbfc0f6c4de2067a0e41', class: "height" }))));
     }
     static get is() { return "smoothly-input-demo-standard"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/input/demo/user-input/index.js CHANGED Viewed

@@ -10,11 +10,11 @@ export class SmoothlyInputDemoUserInput {
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: '3835c578ea7d246169e793bf4aa2c7a51fa5363d' }, h("div", { key: '7b58c28df58685c05871b3b2e0ac1be312929ade' }, h("h2", { key: '51ad8ea9e3aac7d2b86c8fd174f3e9a48697c15e' }, "User Input Event"), h("p", { key: '47cea5b74881ab7616adfae6ebce65da42dbb313' }, "These inputs demonstrate how user input is handled. The ", h("code", { key: '2866d17687a295b23b453f5b1379e5e66bcbff41' }, "smoothlyUserInput"), " event fires only when the user interacts with an input, not when its value is changed programmatically (such as by clicking the buttons above).", h("br", { key: 'e16f064c937a6f9308630304c583ea341f832ad9' }), "Check the console to see the details of each ", h("code", { key: '78979ae82ed46d5a06a595e02df97ba33c89d2c0' }, "smoothlyUserInput"), " event.")), h("smoothly-button", { key: '138b41ca59399b09ff53e52b129ae97748ed387f', color: "tertiary", onClick: () => (this.textIndex = this.increment(this.textIndex)) }, "Change text"), h("smoothly-input", { key: '7d09fa4861e311009ab12e3c60002de3301927ec', looks: "border", name: "demo-user-input-text", value: this.textIndex === undefined ? "" : this.values[this.textIndex], onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Text input"), h("smoothly-button", { key: '0d502c95cb5db26bdce3ba41d15556da80d64433', onClick: () => (this.selectIndex = this.increment(this.selectIndex)), color: "tertiary" }, "Next select item"), h("smoothly-input-select", { key: '435dd06d5ce59811c106ca7c69b6dfa1be50c12a', looks: "border", name: "demo-user-input-select", onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, h("span", { key: '33a6bd3e72cf03ec750a14924a837b7e684a8773', slot: "label" }, "Select input"), this.values.map((value, index) => (h("smoothly-item", { value: index, selected: index == this.selectIndex }, value)))), h("smoothly-button", { key: '21adcb09ac47b9478957c45905170a860c49e1a8', color: "tertiary", onClick: () => (this.checkboxChecked = !this.checkboxChecked) }, "Toggle checkbox"), h("smoothly-input-checkbox", { key: '359e7c7c033b09f9245ebc6be57bd34219d78ecf', looks: "border", name: "demo-user-input-checkbox", checked: this.checkboxChecked, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Checkbox input"), h("smoothly-button", { key: '51fa448a76d00d5f1998ad57f03d21a054e8113a', color: "tertiary", onClick: () => (this.radioIndex = this.increment(this.radioIndex)) }, "Next radio item"), h("smoothly-input-radio", { key: 'b59321ca66af38b90a01d2eb3d0e17f18a904095', looks: "border", name: "demo-user-input-radio", onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, h("span", { key: 'fc5fb9f656c6c6e999a552dced58d28a8acd1ef8', slot: "label" }, "Radio input"), this.values.map((value, index) => (h("smoothly-input-radio-item", { value: value, selected: index == this.radioIndex }, value)))), h("smoothly-button", { key: 'b200be8a41c98d4f219a9f3530f3558fa971689c', color: "tertiary", onClick: () => (this.rangeValue = this.increment(this.rangeValue)) }, "Next range value"), h("smoothly-input-range", { key: 'dd284aa8c1ea6ad1cf4f0881250c105cb2a6ff0c', looks: "border", name: "demo-user-input-range", step: 1, min: 0, max: this.values.length, value: this.rangeValue, label: "Range Input", onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }), h("smoothly-button", { key: '20cc5a84fa556220aef39a2ae15ae412ea2fef0c', color: "tertiary", onClick: () => (this.colorIndex = this.increment(this.colorIndex)) }, "Next color"), h("smoothly-input-color", { key: '7590af1c0425b6219743d81726e05164b970187c', looks: "border", name: "demo-user-input-color", value: typeof this.colorIndex == "number" ? this.colors[this.colorIndex] : undefined, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Color input"), h("smoothly-button", { key: '3b3cc2b584fc194bd1386a710cbbbbf50e2968fc', color: "tertiary", onClick: () => (this.dateValue = this.dateValue ? isoly.Date.next(this.dateValue) : isoly.Date.now()) }, "Next day"), h("smoothly-input-date", { key: 'f38b4dd2f3e9bbf56f998ba8ede15b3c47b8dfee', looks: "border", name: "demo-user-input-date", value: this.dateValue, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Date input"), h("smoothly-button", { key: 'dc47c4b5003bfe3c2b9408d56a2b0646fa7d60b9', color: "tertiary", onClick: () => (this.datetimeValue = this.datetimeValue
+        return (h(Host, { key: 'f2a4d41e58f06ede6a72fb3f8b172ffba324ba1d' }, h("div", { key: '6730bc3f89a2d8a01d2225b520709d8ccf3e7890' }, h("h2", { key: '8894c809fd95504f8f01579a11a975b8f143c656' }, "User Input Event"), h("p", { key: '741a6f7d9baf8b8bda50330141d87a0160d7bacb' }, "These inputs demonstrate how user input is handled. The ", h("code", { key: '467a82db0e06629f333754223ce39645339d777d' }, "smoothlyUserInput"), " event fires only when the user interacts with an input, not when its value is changed programmatically (such as by clicking the buttons above).", h("br", { key: 'ab05e1e07d915dbc118a72a9bdd0e6a091bb21f1' }), "Check the console to see the details of each ", h("code", { key: 'efa4627f8e89c03732e2dcab4d1fdce5d0ac1ef6' }, "smoothlyUserInput"), " event.")), h("smoothly-button", { key: '2dd9580d4ef091d5c2c6a0591b9318ebb7359fe2', color: "tertiary", onClick: () => (this.textIndex = this.increment(this.textIndex)) }, "Change text"), h("smoothly-input", { key: '0f616b3fd91d0b759f3dbb5d8c8c3ff8f46347b8', looks: "border", name: "demo-user-input-text", value: this.textIndex === undefined ? "" : this.values[this.textIndex], onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Text input"), h("smoothly-button", { key: '190d254c825bd58806a35853aff82a48a7e80f7a', onClick: () => (this.selectIndex = this.increment(this.selectIndex)), color: "tertiary" }, "Next select item"), h("smoothly-input-select", { key: '1f8241f1cbd29d9c72b91c064d00960fcf8e67be', looks: "border", name: "demo-user-input-select", onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, h("span", { key: '0ee1caf5240b16279f225e77c61eec8ddfa9af96', slot: "label" }, "Select input"), this.values.map((value, index) => (h("smoothly-item", { value: index, selected: index == this.selectIndex }, value)))), h("smoothly-button", { key: 'ab912c84539c520b0822afcba1f467ad486a3502', color: "tertiary", onClick: () => (this.checkboxChecked = !this.checkboxChecked) }, "Toggle checkbox"), h("smoothly-input-checkbox", { key: '4561b0608b11b9da9acaa0dd48d80284994bbdba', looks: "border", name: "demo-user-input-checkbox", checked: this.checkboxChecked, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Checkbox input"), h("smoothly-button", { key: 'aaae7c8f2458babc9631388b0e968528fd138148', color: "tertiary", onClick: () => (this.radioIndex = this.increment(this.radioIndex)) }, "Next radio item"), h("smoothly-input-radio", { key: 'f70403edaf65e8ff1358461a0d773e1aaeee8718', looks: "border", name: "demo-user-input-radio", onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, h("span", { key: '9c8c3237fdf0ff4aac2dbbf6c7c1b9832993929b', slot: "label" }, "Radio input"), this.values.map((value, index) => (h("smoothly-input-radio-item", { value: value, selected: index == this.radioIndex }, value)))), h("smoothly-button", { key: '8eae0440201647bbceb3ad3464ddadbaefc4ea38', color: "tertiary", onClick: () => (this.rangeValue = this.increment(this.rangeValue)) }, "Next range value"), h("smoothly-input-range", { key: 'ff18785f22364aa89c709f0a156c3c824e802a26', looks: "border", name: "demo-user-input-range", step: 1, min: 0, max: this.values.length, value: this.rangeValue, label: "Range Input", onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }), h("smoothly-button", { key: 'd6bdc4a1471dccd98a001044bf22375e38c11279', color: "tertiary", onClick: () => (this.colorIndex = this.increment(this.colorIndex)) }, "Next color"), h("smoothly-input-color", { key: 'c65c8a43e19bb1502da3098d57288d139ffe2faf', looks: "border", name: "demo-user-input-color", value: typeof this.colorIndex == "number" ? this.colors[this.colorIndex] : undefined, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Color input"), h("smoothly-button", { key: '6d0f8d7e46b889fcbc94d5dd79b274fc623cd7ba', color: "tertiary", onClick: () => (this.dateValue = this.dateValue ? isoly.Date.next(this.dateValue) : isoly.Date.now()) }, "Next day"), h("smoothly-input-date", { key: '3e2c83fc75562f0d755cb5440bc2d1aa539dcde9', looks: "border", name: "demo-user-input-date", value: this.dateValue, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Date input"), h("smoothly-button", { key: 'c9db4d875e2fcb1f913fcd941f6d9ba9eb6393ee', color: "tertiary", onClick: () => (this.datetimeValue = this.datetimeValue
                 ? isoly.DateTime.nextDay(this.datetimeValue)
-                : isoly.DateTime.now()) }, "Next date time"), h("smoothly-input-date-time", { key: '564c412728fabb0a62c8344fb4f8f833805eda2a', looks: "border", name: "demo-user-input-datetime", value: this.datetimeValue, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Date time input"), h("smoothly-button", { key: '4028e3bc5a9625b4c0d302c1e856f618bf59fb22', color: "tertiary", onClick: () => (this.dateRangeValue = this.dateRangeValue
+                : isoly.DateTime.now()) }, "Next date time"), h("smoothly-input-date-time", { key: '2a582db04d01beb54682436d3663a0adeeeb897f', looks: "border", name: "demo-user-input-datetime", value: this.datetimeValue, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Date time input"), h("smoothly-button", { key: 'c1623f533dc310005f206282f3ba11a6697b15ca', color: "tertiary", onClick: () => (this.dateRangeValue = this.dateRangeValue
                 ? { start: isoly.Date.next(this.dateRangeValue.start), end: isoly.Date.next(this.dateRangeValue.end) }
-                : { start: isoly.Date.now(), end: isoly.Date.next(isoly.Date.now(), 10) }) }, "Next date range"), h("smoothly-input-date-range", { key: '6416081389e857c3c18d2fad0dc11159a2aa93a6', looks: "border", name: "demo-user-input-daterange", start: (_a = this.dateRangeValue) === null || _a === void 0 ? void 0 : _a.start, end: (_b = this.dateRangeValue) === null || _b === void 0 ? void 0 : _b.end, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Date range input")));
+                : { start: isoly.Date.now(), end: isoly.Date.next(isoly.Date.now(), 10) }) }, "Next date range"), h("smoothly-input-date-range", { key: 'f884728adae7e57072deef782aab61f8b57d8147', looks: "border", name: "demo-user-input-daterange", start: (_a = this.dateRangeValue) === null || _a === void 0 ? void 0 : _a.start, end: (_b = this.dateRangeValue) === null || _b === void 0 ? void 0 : _b.end, onSmoothlyUserInput: e => console.debug(e.type, e.detail.name, e.detail.value) }, "Date range input")));
     }
     static get is() { return "smoothly-input-demo-user-input"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/input/edit/index.js CHANGED Viewed

@@ -24,7 +24,7 @@ export class SmoothlyInputEdit {
     }
     render() {
         var _a;
-        return (h(Host, { key: '5a29f86218e6badfd620668a6c506fd9a028710d', title: this.tooltip }, h("smoothly-button", { key: '3fd484afcf17e8fd985b38fbc0b04c4520e584c5', 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: 'b3c2a52b3b1548816d6c6ff935cf0aa61acbfa64' }), h("smoothly-icon", { key: '3858475de79ce842dd4c1e5b7007281d7af36d5d', class: "default", name: "create-outline", size: "tiny" }))));
+        return (h(Host, { key: '66d55a905800c79f0233f8b6bdecabaad8cb1f1c', title: this.tooltip }, h("smoothly-button", { key: 'b0223593b49e61f9a6c4b3bd2401318493e6c1eb', 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: '0b70d6c8b09bcdd5925ee9f68bcdd4d9da849cf0' }), h("smoothly-icon", { key: 'dc4374413867b160df4d4f7bdeda25fded4fd59c', class: "default", name: "create-outline", size: "tiny" }))));
     }
     static get is() { return "smoothly-input-edit"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/input/file/index.js CHANGED Viewed

@@ -104,7 +104,7 @@ export class SmoothlyInputFile {
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '6ea6dc53a6eb337bb6c5f87535cfbb4cc51d4233', class: { dragging: this.dragging, "has-value": !!this.value }, tabindex: this.disabled ? undefined : 0, onClick: (e) => this.clickHandler(e), onDragOver: (e) => this.dragOverHandler(e), onDragEnter: (e) => this.dragEnterHandler(e) }, h("label", { key: '8d1c4b21e5dcf4dc4e4c02a5d6492964fa25df0a' }, h("slot", { key: 'd29618d938fa828877f7bc08885c8ae0ddb84583', name: "label" })), h("div", { key: 'ad66b522311cf41cf03477c9e6eb3654f5c5acc2', class: "input" }, h("smoothly-button", { key: '11e2a2d526d1667817115fa8145353b0fc8ea4c1', disabled: this.disabled, type: "button", color: this.color, fill: "clear", size: "flexible" }, h("slot", { key: 'ddea3b18a6d43d4347da9a9c6b0b3657399f4ff5', name: "button" })), h("span", { key: '5390e1365f1d6d46828330d0a25917f973a90b59' }, (_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : this.placeholder), h("div", { key: '1056e639ed54e7945ac316122deb893415d0f427', class: "drag-overlay", onDrop: e => this.dropHandler(e), onDragLeave: e => this.dragLeaveHandler(e) }, h("smoothly-icon", { key: 'fc737003eaa5939ca734fb56961a5652500ae663', name: "document-attach-outline" })), h("input", { key: 'b4e6d41f124ee2eb3b9348cc91fda0ec9df3be48', ref: element => (this.input = element), type: "file", disabled: this.disabled, capture: this.camera == "back" ? "environment" : "user", accept: (_c = this.accept) !== null && _c !== void 0 ? _c : (!this.camera ? undefined : "image/jpeg"), files: this.files, onInput: e => this.inputHandler(e) })), h("span", { key: '02db98c3712e669dc3934be7f148746744dbaae3', onClick: (e) => e.stopPropagation() }, h("slot", { key: '0fa43441ac10f081ecae36f6a56d199534e72de1', name: "end" }))));
+        return (h(Host, { key: 'd63c83a8c7d482b7c210c1fded958380954f3b82', class: { dragging: this.dragging, "has-value": !!this.value }, tabindex: this.disabled ? undefined : 0, onClick: (e) => this.clickHandler(e), onDragOver: (e) => this.dragOverHandler(e), onDragEnter: (e) => this.dragEnterHandler(e) }, h("label", { key: 'cf5fa329f49e4872149c93e8efc9f83878a89bac' }, h("slot", { key: 'efe68f3fba462c6b2a9ef1a597ea4eb49f0e504c', name: "label" })), h("div", { key: '8e34635be73902eaec3468afb87680daf40ac39e', class: "input" }, h("smoothly-button", { key: '23f3be8ca6a8bd78a261ebc79802d7a817a6f4e4', disabled: this.disabled, type: "button", color: this.color, fill: "clear", size: "flexible" }, h("slot", { key: '51844c80711695c452a2dd651b7c6c1536daab2f', name: "button" })), h("span", { key: 'bdb73c10af8ccf56429e0c5e5e8a535f9059ccbf' }, (_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : this.placeholder), h("div", { key: '818709c47b75b7ca86af458c911b2836541a3a88', class: "drag-overlay", onDrop: e => this.dropHandler(e), onDragLeave: e => this.dragLeaveHandler(e) }, h("smoothly-icon", { key: 'b12c7d64c0b184214abd9b102f7a35c871dfee0c', name: "document-attach-outline" })), h("input", { key: 'a636dedfdb289f59476fe9310abaf1d1045c90e5', ref: element => (this.input = element), type: "file", disabled: this.disabled, capture: this.camera == "back" ? "environment" : "user", accept: (_c = this.accept) !== null && _c !== void 0 ? _c : (!this.camera ? undefined : "image/jpeg"), files: this.files, onInput: e => this.inputHandler(e) })), h("span", { key: 'cde8d6765cf6e954504878ffd787df8796c553ec', onClick: (e) => e.stopPropagation() }, h("slot", { key: 'd258247cd13eddc30354c1f10322b82636b7eab2', name: "end" }))));
     }
     static get is() { return "smoothly-input-file"; }
     static get encapsulation() { return "scoped"; }