smoothly 1.0.0-alpha.112 → 1.0.0-alpha.113

package/dist/cjs/loader.cjs.js

@@ -2,7 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-43af753b.js');
+const index = require('./index-6ae370b4.js');
+require('./Observers-6450f075.js');
 
 /*
  Stencil Client Patch Esm v2.22.3 | MIT Licensed | https://stenciljs.com
@@ -14,7 +15,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy(JSON.parse("[[\"smoothly-accordion_67.cjs\",[[0,\"smoothly-app-demo\",{\"baseUrl\":[1,\"base-url\"]}],[0,\"smoothly-input-demo\",null,[[0,\"selectionChanged\",\"handleSelectionChanged\"]]],[2,\"smoothly-table-demo\"],[0,\"smoothly-display-demo\"],[4,\"smoothly-app\",{\"label\":[1],\"color\":[1],\"menuOpen\":[1540,\"menu-open\"],\"selected\":[32]},[[8,\"popstate\",\"locationChangeHandler\"],[0,\"smoothlyRoomSelected\",\"roomSelectedHandler\"],[0,\"smoothlyRoomLoaded\",\"roomLoadedHandler\"],[8,\"click\",\"clickHandler\"]]],[0,\"smoothly-button-demo\"],[0,\"smoothly-dialog-demo\"],[2,\"smoothly-select-demo\"],[6,\"smoothly-app-room\",{\"label\":[513],\"icon\":[513],\"path\":[1],\"to\":[1],\"selected\":[1540],\"getContent\":[64],\"setSelected\":[64]}],[2,\"smoothly-icon-demo\"],[2,\"smoothly-table-testing\",{\"counter\":[32]}],[2,\"smoothly-picker-demo\",{\"data\":[32],\"change\":[32]},[[0,\"smoothlyFormSubmit\",\"submitHandler\"]]],[2,\"smoothly-table-demo-filtered\",{\"criteria\":[32],\"data\":[32],\"selector\":[32]},[[0,\"filters\",\"onFilterUpdate\"],[2,\"smoothlyInput\",\"smoothlyInputHandler\"]]],[6,\"smoothly-input-date\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"value\":[1025],\"open\":[1028],\"max\":[1025],\"min\":[1025],\"showLabel\":[516,\"show-label\"],\"disabled\":[1028],\"clear\":[64]},[[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"dateSet\",\"dateSetHandler\"]]],[2,\"smoothly-input-date-range\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"value\":[1025],\"start\":[1025],\"end\":[1025],\"max\":[1025],\"min\":[1025],\"open\":[1028],\"showLabel\":[516,\"show-label\"],\"labelStart\":[1,\"label-start\"],\"labelEnd\":[1,\"label-end\"],\"clear\":[64]},[[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"startChanged\",\"onStartChanged\"],[0,\"endChanged\",\"onEndChanged\"],[0,\"dateRangeSet\",\"onDateRangeSet\"]]],[6,\"smoothly-notifier\",{\"notices\":[32]},[[0,\"notice\",\"onNotice\"],[0,\"remove\",\"onRemove\"]]],[6,\"smoothly-dialog\",{\"color\":[513],\"open\":[1540],\"closable\":[516],\"header\":[513]},[[0,\"trigger\",\"TriggerListener\"]]],[2,\"smoothly-burger\",{\"visible\":[1540],\"open\":[1540],\"mediaQuery\":[513,\"media-query\"],\"history\":[32]},[[0,\"click\",\"clickHandler\"],[9,\"resize\",\"resizeHandler\"]]],[6,\"smoothly-checkbox\",{\"size\":[1],\"checked\":[1540],\"intermediate\":[1540],\"name\":[1],\"value\":[8],\"disabled\":[516],\"t\":[32],\"toggle\":[64],\"clear\":[64]}],[6,\"smoothly-input-file\",{\"accept\":[1],\"color\":[1537],\"looks\":[1537],\"camera\":[513],\"name\":[513],\"showLabel\":[516,\"show-label\"],\"value\":[1040],\"placeholder\":[1537],\"dragging\":[32],\"clear\":[64]}],[6,\"smoothly-radio-button-item\",{\"value\":[8],\"selected\":[1540],\"color\":[513]}],[6,\"smoothly-summary\",{\"open\":[1540],\"color\":[1],\"fill\":[1],\"size\":[1]}],[1,\"smoothly-toggle-switch\",{\"selected\":[1540],\"disabled\":[516],\"size\":[513],\"name\":[1],\"value\":[8]}],[0,\"smoothly-urlencoded\",{\"data\":[1]}],[6,\"smoothly-accordion\",{\"value\":[1025],\"removeItem\":[64]},[[0,\"smoothlyOpen\",\"handleOpenClose\"],[0,\"smoothlyClose\",\"handleOpenClose\"],[0,\"smoothlyAccordionItemWillLoad\",\"onAccordionItemDidLoad\"]]],[6,\"smoothly-accordion-item\",{\"name\":[1],\"brand\":[1],\"open\":[1540]}],[2,\"smoothly-display-amount\",{\"amount\":[8],\"currency\":[1],\"toInteger\":[4,\"to-integer\"]}],[2,\"smoothly-frame\",{\"url\":[1],\"name\":[1],\"origin\":[1],\"send\":[64]}],[6,\"smoothly-popup\",{\"visible\":[1540],\"direction\":[1537],\"cssVariables\":[32]}],[6,\"smoothly-quiet\",{\"color\":[1]}],[6,\"smoothly-radio\",{\"name\":[1],\"value\":[1],\"checked\":[1540],\"tab\":[2]}],[6,\"smoothly-radio-button\",{\"name\":[1],\"value\":[1032],\"deselectable\":[516],\"decoration\":[513]},[[2,\"radioItemSelectInternal\",\"radioSelectHandler\"]]],[2,\"smoothly-skeleton\",{\"widths\":[16],\"width\":[1025],\"color\":[1],\"period\":[2],\"distance\":[1],\"align\":[513]}],[2,\"smoothly-svg\",{\"url\":[513],\"size\":[513],\"color\":[1]}],[6,\"smoothly-toggle\",{\"selected\":[1540],\"shape\":[513],\"disabled\":[516],\"name\":[1],\"value\":[8]},[[0,\"click\",\"onClick\"]]],[1,\"smoothly-filter\",{\"placeholder\":[1025],\"criteria\":[1040],\"inputValue\":[1032,\"input-value\"],\"expanded\":[32],\"freeSearchValue\":[32],\"clear\":[64]},[[0,\"filter\",\"filterHandler\"]]],[6,\"smoothly-picker\",{\"looks\":[1537],\"name\":[513],\"open\":[1540],\"mutable\":[516],\"multiple\":[516],\"readonly\":[516],\"validator\":[16],\"selected\":[32],\"display\":[32],\"clear\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyPickerMenuLoaded\",\"menuLoadedHandler\"],[0,\"smoothlyPickerOptionLoaded\",\"optionLoadedHandler\"],[0,\"smoothlyPickerOptionChange\",\"optionChangeHandler\"],[8,\"click\",\"clickHandler\"],[8,\"focusin\",\"focusHandler\"]]],[1,\"smoothly-filter-input\",{\"name\":[513],\"value\":[1025],\"type\":[513],\"required\":[1540],\"minLength\":[2,\"min-length\"],\"showLabel\":[516,\"show-label\"],\"maxLength\":[2,\"max-length\"],\"autocomplete\":[4],\"pattern\":[16],\"placeholder\":[1],\"disabled\":[4],\"readonly\":[516],\"currency\":[513],\"comparison\":[1],\"criteria\":[32],\"clear\":[64]}],[2,\"smoothly-back-to-top\",{\"opacity\":[1],\"bottom\":[1],\"right\":[1],\"visible\":[32]}],[6,\"smoothly-input-clear\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"size\":[513],\"shape\":[513],\"display\":[1540],\"type\":[513]},[[0,\"click\",\"clickHandler\"]]],[6,\"smoothly-tab\",{\"label\":[1],\"open\":[1540]},[[0,\"click\",\"onClick\"]]],[6,\"smoothly-tab-switch\",{\"selectedElement\":[32]},[[0,\"expansionOpen\",\"openChanged\"]]],[6,\"smoothly-table-expandable-row\",{\"align\":[1],\"open\":[1540],\"allowSpotlight\":[32],\"spotlight\":[32]},[[0,\"smoothlyTableLoad\",\"handleTableLoaded\"]]],[6,\"smoothly-table-footer\"],[0,\"smoothly-tuple\",{\"tuple\":[16]}],[6,\"smoothly-picker-menu\",{\"looks\":[1],\"multiple\":[516],\"mutable\":[516],\"readonly\":[516],\"validator\":[16],\"backend\":[32],\"options\":[32],\"created\":[32],\"search\":[32],\"valid\":[32],\"display\":[32]},[[0,\"smoothlyPickerOptionLoad\",\"optionLoadHandler\"],[0,\"smoothlyPickerOptionLoaded\",\"optionLoadedHandler\"],[0,\"smoothlyPickerOptionChange\",\"optionChangeHandler\"],[0,\"smoothlySlotEmpty\",\"emptyDisplayHandler\"]]],[2,\"smoothly-calendar\",{\"month\":[1025],\"value\":[1025],\"start\":[1025],\"end\":[1025],\"max\":[1025],\"min\":[1025],\"doubleInput\":[516,\"double-input\"],\"firstSelected\":[32]}],[6,\"smoothly-table-cell\"],[6,\"smoothly-table-expandable-cell\",{\"align\":[1],\"open\":[1540],\"allowSpotlight\":[32],\"spotlight\":[32]},[[0,\"click\",\"onClick\"],[0,\"smoothlyTableLoad\",\"handleTableLoaded\"]]],[2,\"smoothly-display\",{\"type\":[1],\"value\":[8],\"currency\":[1],\"country\":[1],\"format\":[16]}],[6,\"smoothly-table\",{\"root\":[1540],\"color\":[1537],\"align\":[513],\"open\":[1540]},[[0,\"smoothlyExpandableLoad\",\"handleExpandableLoaded\"],[0,\"smoothlyExpandableChange\",\"handleExpandableState\"],[0,\"smoothlySpotlightChange\",\"handleSpotlightState\"],[0,\"smoothlyNestedTable\",\"handleNestedTable\"],[0,\"smoothlyExpansionLoad\",\"handleEvents\"],[0,\"smoothlyExpansionOpen\",\"handleEvents\"]]],[6,\"smoothly-table-header\",{\"name\":[1]}],[6,\"smoothly-table-row\",{\"open\":[1540]},[[0,\"smoothlyExpansionLoad\",\"onExpansionLoad\"],[0,\"smoothlyExpandableChange\",\"onExpansionChange\"],[0,\"smoothlyExpansionOpen\",\"onExpansionOpen\"]]],[2,\"smoothly-input-month\",{\"value\":[1025]}],[1,\"smoothly-picker-option\",{\"selected\":[1540],\"visible\":[1540],\"value\":[1032],\"search\":[1040],\"readonly\":[32],\"slotted\":[32],\"clickHandler\":[64]}],[6,\"smoothly-slot-elements\",{\"clone\":[4],\"nodes\":[1040]}],[6,\"smoothly-submit\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"size\":[513],\"shape\":[513],\"prevent\":[4]},[[0,\"click\",\"clickHandler\"]]],[6,\"smoothly-input-select\",{\"name\":[1],\"color\":[1537],\"looks\":[1537],\"type\":[1537],\"showSelected\":[1540,\"show-selected\"],\"initialPrompt\":[1,\"initial-prompt\"],\"initialValue\":[8,\"initial-value\"],\"opened\":[32],\"selectedElement\":[32],\"missing\":[32],\"filter\":[32],\"reset\":[64]},[[0,\"click\",\"onClick\"],[0,\"itemSelected\",\"onItemSelected\"],[0,\"keydown\",\"onKeyDown\"]]],[6,\"smoothly-item\",{\"value\":[8],\"selected\":[1540],\"marked\":[1540],\"filter\":[64]},[[0,\"click\",\"onClick\"]]],[6,\"smoothly-slotted-elements\",{\"clone\":[4]}],[4,\"smoothly-form\",{\"color\":[1537],\"value\":[1040],\"looks\":[513],\"name\":[1],\"method\":[1],\"action\":[1],\"processing\":[1540],\"prevent\":[4],\"changed\":[1540],\"notice\":[32],\"submit\":[64],\"clear\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlySubmit\",\"smoothlySubmitHandler\"],[0,\"smoothlyInputLoad\",\"SmoothlyInputLoadHandler\"]]],[6,\"smoothly-button\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"size\":[513],\"shape\":[513],\"link\":[1]}],[2,\"smoothly-spinner\",{\"active\":[516],\"size\":[513]}],[2,\"smoothly-notification\",{\"notice\":[16],\"closable\":[4],\"icon\":[4],\"tick\":[32]},[[0,\"trigger\",\"onTrigger\"]]],[6,\"smoothly-trigger\",{\"color\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"name\":[1],\"value\":[8]},[[0,\"click\",\"onClick\"]]],[6,\"smoothly-input\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"value\":[1032],\"type\":[513],\"required\":[1540],\"minLength\":[1026,\"min-length\"],\"showLabel\":[516,\"show-label\"],\"maxLength\":[1026,\"max-length\"],\"autocomplete\":[1028],\"pattern\":[1040],\"placeholder\":[1537],\"disabled\":[1028],\"readonly\":[1540],\"currency\":[513],\"changed\":[1540],\"initialValue\":[32],\"clear\":[64],\"getFormData\":[64],\"setKeepFocusOnReRender\":[64],\"setSelectionRange\":[64]},[[0,\"smoothlyInputLoad\",\"SmoothlyInputLoadHandler\"]]],[2,\"smoothly-icon\",{\"color\":[513],\"fill\":[513],\"name\":[513],\"size\":[513],\"toolTip\":[1,\"tool-tip\"],\"document\":[32]}]]],[\"smoothly-addresses.cjs\",[[2,\"smoothly-addresses\",{\"value\":[16],\"editable\":[16]}]]],[\"smoothly-color.cjs\",[[6,\"smoothly-color\",{\"color\":[513]}]]],[\"smoothly-country.cjs\",[[2,\"smoothly-country\",{\"value\":[1],\"text\":[1],\"language\":[32]}]]],[\"smoothly-display-date-time.cjs\",[[2,\"smoothly-display-date-time\",{\"datetime\":[1]}]]],[\"smoothly-google-font.cjs\",[[2,\"smoothly-google-font\",{\"value\":[1]}]]],[\"smoothly-radio-group.cjs\",[[4,\"smoothly-radio-group\",{\"orientation\":[513]}]]],[\"smoothly-reorder.cjs\",[[0,\"smoothly-reorder\"]]],[\"smoothly-trigger-sink.cjs\",[[6,\"smoothly-trigger-sink\",{\"context\":[16],\"destination\":[1],\"filter\":[1]},[[0,\"trigger\",\"TriggerListener\"]]]]],[\"smoothly-trigger-source.cjs\",[[6,\"smoothly-trigger-source\",{\"listen\":[1]}]]],[\"smoothly-address-display.cjs\",[[2,\"smoothly-address-display\",{\"value\":[16],\"editable\":[4]}]]],[\"smoothly-address.cjs\",[[2,\"smoothly-address\",{\"value\":[16],\"editable\":[4]}]]]]"), options);
+  return index.bootstrapLazy(JSON.parse("[[\"smoothly-accordion_67.cjs\",[[0,\"smoothly-app-demo\",{\"baseUrl\":[1,\"base-url\"]}],[0,\"smoothly-input-demo\",null,[[0,\"selectionChanged\",\"handleSelectionChanged\"]]],[2,\"smoothly-table-demo\"],[0,\"smoothly-display-demo\"],[4,\"smoothly-app\",{\"label\":[1],\"color\":[1],\"menuOpen\":[1540,\"menu-open\"],\"selected\":[32]},[[8,\"popstate\",\"locationChangeHandler\"],[0,\"smoothlyRoomSelected\",\"roomSelectedHandler\"],[0,\"smoothlyRoomLoaded\",\"roomLoadedHandler\"],[8,\"click\",\"clickHandler\"]]],[0,\"smoothly-button-demo\"],[0,\"smoothly-dialog-demo\"],[2,\"smoothly-select-demo\"],[6,\"smoothly-app-room\",{\"label\":[513],\"icon\":[513],\"path\":[1],\"to\":[1],\"selected\":[1540],\"getContent\":[64],\"setSelected\":[64]}],[2,\"smoothly-icon-demo\"],[2,\"smoothly-table-testing\",{\"counter\":[32]}],[2,\"smoothly-picker-demo\",{\"data\":[32],\"change\":[32]},[[0,\"smoothlyFormSubmit\",\"submitHandler\"]]],[2,\"smoothly-table-demo-filtered\",{\"criteria\":[32],\"data\":[32],\"selector\":[32]},[[0,\"filters\",\"onFilterUpdate\"],[2,\"smoothlyInput\",\"smoothlyInputHandler\"]]],[6,\"smoothly-input-date\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"value\":[1025],\"open\":[1028],\"max\":[1025],\"min\":[1025],\"showLabel\":[516,\"show-label\"],\"disabled\":[1028],\"clear\":[64]},[[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"dateSet\",\"dateSetHandler\"]]],[2,\"smoothly-input-date-range\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"value\":[1025],\"start\":[1025],\"end\":[1025],\"max\":[1025],\"min\":[1025],\"open\":[1028],\"showLabel\":[516,\"show-label\"],\"labelStart\":[1,\"label-start\"],\"labelEnd\":[1,\"label-end\"],\"clear\":[64]},[[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"startChanged\",\"onStartChanged\"],[0,\"endChanged\",\"onEndChanged\"],[0,\"dateRangeSet\",\"onDateRangeSet\"]]],[6,\"smoothly-notifier\",{\"notices\":[32]},[[0,\"notice\",\"onNotice\"],[0,\"remove\",\"onRemove\"]]],[6,\"smoothly-dialog\",{\"color\":[513],\"open\":[1540],\"closable\":[516],\"header\":[513]},[[0,\"trigger\",\"TriggerListener\"]]],[2,\"smoothly-burger\",{\"visible\":[1540],\"open\":[1540],\"mediaQuery\":[513,\"media-query\"],\"history\":[32]},[[0,\"click\",\"clickHandler\"],[9,\"resize\",\"resizeHandler\"]]],[6,\"smoothly-checkbox\",{\"size\":[1],\"checked\":[1540],\"intermediate\":[1540],\"name\":[1],\"value\":[8],\"disabled\":[516],\"t\":[32],\"toggle\":[64],\"clear\":[64]}],[6,\"smoothly-input-file\",{\"accept\":[1],\"color\":[1537],\"looks\":[1537],\"camera\":[513],\"name\":[513],\"showLabel\":[516,\"show-label\"],\"value\":[1040],\"placeholder\":[1537],\"dragging\":[32],\"clear\":[64]}],[6,\"smoothly-radio-button-item\",{\"value\":[8],\"selected\":[1540],\"color\":[513]}],[6,\"smoothly-summary\",{\"open\":[1540],\"color\":[1],\"fill\":[1],\"size\":[1]}],[1,\"smoothly-toggle-switch\",{\"selected\":[1540],\"disabled\":[516],\"size\":[513],\"name\":[1],\"value\":[8]}],[0,\"smoothly-urlencoded\",{\"data\":[1]}],[6,\"smoothly-accordion\",{\"value\":[1025],\"removeItem\":[64]},[[0,\"smoothlyOpen\",\"handleOpenClose\"],[0,\"smoothlyClose\",\"handleOpenClose\"],[0,\"smoothlyAccordionItemWillLoad\",\"onAccordionItemDidLoad\"]]],[6,\"smoothly-accordion-item\",{\"name\":[1],\"brand\":[1],\"open\":[1540]}],[2,\"smoothly-display-amount\",{\"amount\":[8],\"currency\":[1],\"toInteger\":[4,\"to-integer\"]}],[2,\"smoothly-frame\",{\"url\":[1],\"name\":[1],\"origin\":[1],\"send\":[64]}],[6,\"smoothly-popup\",{\"visible\":[1540],\"direction\":[1537],\"cssVariables\":[32]}],[6,\"smoothly-quiet\",{\"color\":[1]}],[6,\"smoothly-radio\",{\"name\":[1],\"value\":[1],\"checked\":[1540],\"tab\":[2]}],[6,\"smoothly-radio-button\",{\"name\":[1],\"value\":[1032],\"deselectable\":[516],\"decoration\":[513]},[[2,\"radioItemSelectInternal\",\"radioSelectHandler\"]]],[2,\"smoothly-skeleton\",{\"widths\":[16],\"width\":[1025],\"color\":[1],\"period\":[2],\"distance\":[1],\"align\":[513]}],[2,\"smoothly-svg\",{\"url\":[513],\"size\":[513],\"color\":[1]}],[6,\"smoothly-toggle\",{\"selected\":[1540],\"shape\":[513],\"disabled\":[516],\"name\":[1],\"value\":[8]},[[0,\"click\",\"onClick\"]]],[1,\"smoothly-filter\",{\"placeholder\":[1025],\"criteria\":[1040],\"inputValue\":[1032,\"input-value\"],\"expanded\":[32],\"freeSearchValue\":[32],\"clear\":[64]},[[0,\"filter\",\"filterHandler\"]]],[6,\"smoothly-picker\",{\"looks\":[1537],\"name\":[513],\"open\":[1540],\"mutable\":[516],\"multiple\":[516],\"readonly\":[516],\"validator\":[16],\"selected\":[32],\"display\":[32],\"clear\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyPickerMenuLoaded\",\"menuLoadedHandler\"],[0,\"smoothlyPickerOptionLoaded\",\"optionLoadedHandler\"],[0,\"smoothlyPickerOptionChange\",\"optionChangeHandler\"],[8,\"click\",\"clickHandler\"],[8,\"focusin\",\"focusHandler\"]]],[1,\"smoothly-filter-input\",{\"name\":[513],\"value\":[1025],\"type\":[513],\"required\":[1540],\"minLength\":[2,\"min-length\"],\"showLabel\":[516,\"show-label\"],\"maxLength\":[2,\"max-length\"],\"autocomplete\":[4],\"pattern\":[16],\"placeholder\":[1],\"disabled\":[4],\"readonly\":[516],\"currency\":[513],\"comparison\":[1],\"criteria\":[32],\"clear\":[64]}],[2,\"smoothly-back-to-top\",{\"opacity\":[1],\"bottom\":[1],\"right\":[1],\"visible\":[32]}],[6,\"smoothly-input-clear\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"disabled\":[1540],\"size\":[513],\"shape\":[513],\"display\":[1540],\"type\":[513]},[[0,\"click\",\"clickHandler\"]]],[6,\"smoothly-tab\",{\"label\":[1],\"open\":[1540]},[[0,\"click\",\"onClick\"]]],[6,\"smoothly-tab-switch\",{\"selectedElement\":[32]},[[0,\"expansionOpen\",\"openChanged\"]]],[6,\"smoothly-table-expandable-row\",{\"align\":[1],\"open\":[1540],\"allowSpotlight\":[32],\"spotlight\":[32]},[[0,\"smoothlyTableLoad\",\"handleTableLoaded\"]]],[6,\"smoothly-table-footer\"],[0,\"smoothly-tuple\",{\"tuple\":[16]}],[6,\"smoothly-picker-menu\",{\"looks\":[1],\"open\":[516],\"multiple\":[516],\"mutable\":[516],\"readonly\":[516],\"validator\":[16],\"backend\":[32],\"options\":[32],\"created\":[32],\"search\":[32],\"valid\":[32],\"display\":[32],\"flip\":[32],\"flipChecked\":[32]},[[9,\"scroll\",\"scrollHandler\"],[0,\"smoothlyPickerOptionLoad\",\"optionLoadHandler\"],[0,\"smoothlyPickerOptionLoaded\",\"optionLoadedHandler\"],[0,\"smoothlyPickerOptionChange\",\"optionChangeHandler\"],[0,\"smoothlySlotEmpty\",\"emptyDisplayHandler\"]]],[2,\"smoothly-calendar\",{\"month\":[1025],\"value\":[1025],\"start\":[1025],\"end\":[1025],\"max\":[1025],\"min\":[1025],\"doubleInput\":[516,\"double-input\"],\"firstSelected\":[32]}],[6,\"smoothly-table-cell\"],[6,\"smoothly-table-expandable-cell\",{\"align\":[1],\"open\":[1540],\"allowSpotlight\":[32],\"spotlight\":[32]},[[0,\"click\",\"onClick\"],[0,\"smoothlyTableLoad\",\"handleTableLoaded\"]]],[2,\"smoothly-display\",{\"type\":[1],\"value\":[8],\"currency\":[1],\"country\":[1],\"format\":[16]}],[6,\"smoothly-table\",{\"root\":[1540],\"color\":[1537],\"align\":[513],\"open\":[1540]},[[0,\"smoothlyExpandableLoad\",\"handleExpandableLoaded\"],[0,\"smoothlyExpandableChange\",\"handleExpandableState\"],[0,\"smoothlySpotlightChange\",\"handleSpotlightState\"],[0,\"smoothlyNestedTable\",\"handleNestedTable\"],[0,\"smoothlyExpansionLoad\",\"handleEvents\"],[0,\"smoothlyExpansionOpen\",\"handleEvents\"]]],[6,\"smoothly-table-header\",{\"name\":[1]}],[6,\"smoothly-table-row\",{\"open\":[1540]},[[0,\"smoothlyExpansionLoad\",\"onExpansionLoad\"],[0,\"smoothlyExpandableChange\",\"onExpansionChange\"],[0,\"smoothlyExpansionOpen\",\"onExpansionOpen\"]]],[2,\"smoothly-input-month\",{\"value\":[1025]}],[1,\"smoothly-picker-option\",{\"selected\":[1540],\"visible\":[1540],\"value\":[1032],\"search\":[1040],\"position\":[514],\"readonly\":[32],\"slotted\":[32],\"clickHandler\":[64]}],[6,\"smoothly-slot-elements\",{\"clone\":[4],\"nodes\":[1040]}],[6,\"smoothly-submit\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"size\":[513],\"shape\":[513],\"prevent\":[4]},[[0,\"click\",\"clickHandler\"]]],[6,\"smoothly-input-select\",{\"name\":[1],\"color\":[1537],\"looks\":[1537],\"type\":[1537],\"showSelected\":[1540,\"show-selected\"],\"initialPrompt\":[1,\"initial-prompt\"],\"initialValue\":[8,\"initial-value\"],\"opened\":[32],\"selectedElement\":[32],\"missing\":[32],\"filter\":[32],\"reset\":[64]},[[0,\"click\",\"onClick\"],[0,\"itemSelected\",\"onItemSelected\"],[0,\"keydown\",\"onKeyDown\"]]],[6,\"smoothly-item\",{\"value\":[8],\"selected\":[1540],\"marked\":[1540],\"filter\":[64]},[[0,\"click\",\"onClick\"]]],[6,\"smoothly-slotted-elements\",{\"clone\":[4]}],[4,\"smoothly-form\",{\"color\":[1537],\"value\":[1040],\"looks\":[513],\"name\":[1],\"method\":[1],\"action\":[1],\"processing\":[1540],\"prevent\":[4],\"changed\":[1540],\"notice\":[32],\"submit\":[64],\"clear\":[64]},[[0,\"smoothlyInputLooks\",\"smoothlyInputLooksHandler\"],[0,\"smoothlyInput\",\"smoothlyInputHandler\"],[0,\"smoothlySubmit\",\"smoothlySubmitHandler\"],[0,\"smoothlyInputLoad\",\"SmoothlyInputLoadHandler\"]]],[6,\"smoothly-button\",{\"color\":[513],\"expand\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"size\":[513],\"shape\":[513],\"link\":[1]}],[2,\"smoothly-spinner\",{\"active\":[516],\"size\":[513]}],[2,\"smoothly-notification\",{\"notice\":[16],\"closable\":[4],\"icon\":[4],\"tick\":[32]},[[0,\"trigger\",\"onTrigger\"]]],[6,\"smoothly-trigger\",{\"color\":[513],\"fill\":[513],\"disabled\":[516],\"type\":[513],\"name\":[1],\"value\":[8]},[[0,\"click\",\"onClick\"]]],[6,\"smoothly-input\",{\"color\":[1537],\"looks\":[1537],\"name\":[513],\"value\":[1032],\"type\":[513],\"required\":[1540],\"minLength\":[1026,\"min-length\"],\"showLabel\":[516,\"show-label\"],\"maxLength\":[1026,\"max-length\"],\"autocomplete\":[1028],\"pattern\":[1040],\"placeholder\":[1537],\"disabled\":[1028],\"readonly\":[1540],\"currency\":[513],\"changed\":[1540],\"initialValue\":[32],\"clear\":[64],\"getFormData\":[64],\"setKeepFocusOnReRender\":[64],\"setSelectionRange\":[64]},[[0,\"smoothlyInputLoad\",\"SmoothlyInputLoadHandler\"]]],[2,\"smoothly-icon\",{\"color\":[513],\"fill\":[513],\"name\":[513],\"size\":[513],\"toolTip\":[1,\"tool-tip\"],\"document\":[32]}]]],[\"smoothly-addresses.cjs\",[[2,\"smoothly-addresses\",{\"value\":[16],\"editable\":[16]}]]],[\"smoothly-color.cjs\",[[6,\"smoothly-color\",{\"color\":[513]}]]],[\"smoothly-country.cjs\",[[2,\"smoothly-country\",{\"value\":[1],\"text\":[1],\"language\":[32]}]]],[\"smoothly-display-date-time.cjs\",[[2,\"smoothly-display-date-time\",{\"datetime\":[1]}]]],[\"smoothly-google-font.cjs\",[[2,\"smoothly-google-font\",{\"value\":[1]}]]],[\"smoothly-radio-group.cjs\",[[4,\"smoothly-radio-group\",{\"orientation\":[513]}]]],[\"smoothly-reorder.cjs\",[[0,\"smoothly-reorder\"]]],[\"smoothly-trigger-sink.cjs\",[[6,\"smoothly-trigger-sink\",{\"context\":[16],\"destination\":[1],\"filter\":[1]},[[0,\"trigger\",\"TriggerListener\"]]]]],[\"smoothly-trigger-source.cjs\",[[6,\"smoothly-trigger-source\",{\"listen\":[1]}]]],[\"smoothly-address-display.cjs\",[[2,\"smoothly-address-display\",{\"value\":[16],\"editable\":[4]}]]],[\"smoothly-address.cjs\",[[2,\"smoothly-address\",{\"value\":[16],\"editable\":[4]}]]]]"), options);
   });
 };
 

package/dist/cjs/loader.cjs.js.map

@@ -1 +1 @@
-{"file":"loader.cjs.js","mappings":";;;;;;AAAA;AACA;AACA;AAGA,MAAM,QAAQ,GAAG,MAAM;AAevB,IAAI,OAAOA,oBAAc,EAAE,CAAC;AAC5B,CAAC;;ACjBW,MAAC,oBAAoB,GAAG,CAAC,GAAG,EAAE,OAAO,KAAK;AACtD,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,OAAO,CAAC,OAAO,EAAE,CAAC;AAC9D,EAAE,OAAO,QAAQ,EAAE,CAAC,IAAI,CAAC,MAAM;AAE/B,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,GAAG,CAAC,CAAC;AACL;;;;;","names":["promiseResolve","bootstrapLazy"],"sources":["./node_modules/@stencil/core/internal/client/patch-esm.js","@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Esm v2.22.3 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD } from '@stencil/core/internal/app-data';\nimport { CSS, plt, win, promiseResolve } from '@stencil/core';\nconst patchEsm = () => {\n    // NOTE!! This fn cannot use async/await!\n    // @ts-ignore\n    if (BUILD.cssVarShim && !(CSS && CSS.supports && CSS.supports('color', 'var(--c)'))) {\n        // @ts-ignore\n        return import(/* webpackChunkName: \"polyfills-css-shim\" */ './css-shim.js').then(() => {\n            if ((plt.$cssShim$ = win.__cssshim)) {\n                return plt.$cssShim$.i();\n            }\n            else {\n                // for better minification\n                return 0;\n            }\n        });\n    }\n    return promiseResolve();\n};\nexport { patchEsm };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchEsm } from '@stencil/core/internal/client/patch-esm';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = (win, options) => {\n  if (typeof window === 'undefined') return Promise.resolve();\n  return patchEsm().then(() => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n  });\n};\n"],"version":3}
+{"file":"loader.cjs.js","mappings":";;;;;;;AAAA;AACA;AACA;AAGA,MAAM,QAAQ,GAAG,MAAM;AAevB,IAAI,OAAOA,oBAAc,EAAE,CAAC;AAC5B,CAAC;;ACjBW,MAAC,oBAAoB,GAAG,CAAC,GAAG,EAAE,OAAO,KAAK;AACtD,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,OAAO,CAAC,OAAO,EAAE,CAAC;AAC9D,EAAE,OAAO,QAAQ,EAAE,CAAC,IAAI,CAAC,MAAM;AAE/B,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,GAAG,CAAC,CAAC;AACL;;;;;","names":["promiseResolve","bootstrapLazy"],"sources":["./node_modules/@stencil/core/internal/client/patch-esm.js","@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Esm v2.22.3 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD } from '@stencil/core/internal/app-data';\nimport { CSS, plt, win, promiseResolve } from '@stencil/core';\nconst patchEsm = () => {\n    // NOTE!! This fn cannot use async/await!\n    // @ts-ignore\n    if (BUILD.cssVarShim && !(CSS && CSS.supports && CSS.supports('color', 'var(--c)'))) {\n        // @ts-ignore\n        return import(/* webpackChunkName: \"polyfills-css-shim\" */ './css-shim.js').then(() => {\n            if ((plt.$cssShim$ = win.__cssshim)) {\n                return plt.$cssShim$.i();\n            }\n            else {\n                // for better minification\n                return 0;\n            }\n        });\n    }\n    return promiseResolve();\n};\nexport { patchEsm };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchEsm } from '@stencil/core/internal/client/patch-esm';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = (win, options) => {\n  if (typeof window === 'undefined') return Promise.resolve();\n  return patchEsm().then(() => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n  });\n};\n"],"version":3}

package/dist/cjs/smoothly-accordion_67.cjs.entry.js

@@ -2,11 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-43af753b.js');
+const index = require('./index-6ae370b4.js');
 const Data = require('./Data-e345d3cd.js');
 require('./GoogleFont-6c4f0da1.js');
 const redirect = require('./redirect-2e5d4524.js');
 const getLanguage = require('./getLanguage-f547104a.js');
+const Observers$1 = require('./Observers-6450f075.js');
+
+function global$1 () {
+  return { Observers: Observers$1.Observers };
+}
 
 const styleCss$Z = "smoothly-accordion-item.sc-smoothly-accordion{border:1px solid rgb(var(--smoothly-dark-color));border-bottom:none}smoothly-accordion-item.sc-smoothly-accordion:first-of-type{border-top-left-radius:4px;border-top-right-radius:4px;margin-top:0.4em}smoothly-accordion-item.sc-smoothly-accordion:last-of-type{border-bottom-left-radius:4px;border-bottom-right-radius:4px;border-bottom:1px solid rgb(var(--smoothly-dark-color));margin-bottom:0.6em}smoothly-accordion-item[open].sc-smoothly-accordion{border-color:rgb(var(--smoothly-primary-color));border-bottom:1px solid rgb(var(--smoothly-primary-color))}smoothly-accordion-item[open].sc-smoothly-accordion+smoothly-accordion-item.sc-smoothly-accordion{border-top:none}";
 
@@ -28409,7 +28414,7 @@ const Notifier = class {
 };
 Notifier.style = styleCss$w;
 
-const styleCss$v = ".sc-smoothly-picker-h{box-sizing:border-box}.sc-smoothly-picker-h[looks=\"border\"].sc-smoothly-picker-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-picker-h{border:rgb(var(--text-color, var(--smoothly-color-contrast))) solid 1px}.sc-smoothly-picker-h[looks=\"line\"].sc-smoothly-picker-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-picker-h{border-bottom:rgb(var(--text-color, var(--smoothly-color-contrast))) solid 1px}.sc-smoothly-picker-h[looks=\"grid\"].sc-smoothly-picker-s>smoothly-picker-menu smoothly-input,[looks=\"grid\"].sc-smoothly-picker-h{border:rgba(var(--text-color, var(--smoothly-color-contrast)), .5) solid .5px}.sc-smoothly-picker-h{display:flex;position:relative;width:max-content;padding:1.2em 0.7em 0.2em 0.8em;background-color:rgb(var(--background-color, var(--smoothly-color-shade)))}.sc-smoothly-picker-h:not([open]) smoothly-picker-menu.sc-smoothly-picker{display:none}smoothly-slot-elements.sc-smoothly-picker{white-space:nowrap}.selected.sc-smoothly-picker{position:relative;display:flex;align-items:center;gap:1rem;width:100%;overflow:hidden;text-overflow:ellipsis;margin-right:2px}.selected.sc-smoothly-picker::after{content:\"\";position:absolute;top:0;bottom:0;right:0;width:2ch;background:linear-gradient(90deg, rgba(var(--background-color, var(--smoothly-color-shade)), 0) 0%, rgba(var(--background-color, var(--smoothly-color-shade)), 1) 100%)}.selected.sc-smoothly-picker *.sc-smoothly-picker{display:none}.label.sc-smoothly-picker{position:absolute;left:0.4rem;top:0.6rem;color:rgb(var(--text-color, var(--smoothly-color-contrast)));opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.selected.sc-smoothly-picker:not(:empty)+.label.sc-smoothly-picker{top:0.4em;transform:scale(0.6)}";
+const styleCss$v = ".sc-smoothly-picker-h{box-sizing:border-box}.sc-smoothly-picker-h[looks=\"border\"].sc-smoothly-picker-s>smoothly-picker-menu smoothly-input,[looks=\"border\"].sc-smoothly-picker-h{border:rgb(var(--text-color, var(--smoothly-color-contrast))) solid 1px}.sc-smoothly-picker-h[looks=\"line\"].sc-smoothly-picker-s>smoothly-picker-menu smoothly-input,[looks=\"line\"].sc-smoothly-picker-h{border-bottom:rgb(var(--text-color, var(--smoothly-color-contrast))) solid 1px}.sc-smoothly-picker-h[looks=\"grid\"].sc-smoothly-picker-s>smoothly-picker-menu smoothly-input,[looks=\"grid\"].sc-smoothly-picker-h{border:rgba(var(--text-color, var(--smoothly-color-contrast)), .5) solid .5px}.sc-smoothly-picker-h{display:flex;position:relative;width:max-content;padding:1.2em 0.7em 0.2em 0.8em;background-color:rgb(var(--background-color, var(--smoothly-color-shade)))}smoothly-slot-elements.sc-smoothly-picker{white-space:nowrap}.selected.sc-smoothly-picker{position:relative;display:flex;align-items:center;gap:1rem;width:100%;overflow:hidden;text-overflow:ellipsis;margin-right:2px}.selected.sc-smoothly-picker::after{content:\"\";position:absolute;top:0;bottom:0;right:0;width:2ch;background:linear-gradient(90deg, rgba(var(--background-color, var(--smoothly-color-shade)), 0) 0%, rgba(var(--background-color, var(--smoothly-color-shade)), 1) 100%)}.selected.sc-smoothly-picker *.sc-smoothly-picker{display:none}.label.sc-smoothly-picker{position:absolute;left:0.4rem;top:0.6rem;color:rgb(var(--text-color, var(--smoothly-color-contrast)));opacity:0.8;user-select:none;cursor:inherit;transform-origin:top left;transition:transform 100ms ease}.selected.sc-smoothly-picker:not(:empty)+.label.sc-smoothly-picker{top:0.4em;transform:scale(0.6)}";
 
 const SmoothlyPicker = class {
   constructor(hostRef) {
@@ -28480,7 +28485,7 @@ const SmoothlyPicker = class {
     this.selected.forEach(option => option.selected && option.element.clickHandler());
   }
   render() {
-    return (index.h(index.Host, null, index.h("smoothly-slot-elements", { class: "selected", nodes: this.display }), index.h("span", { class: "label" }, index.h("slot", { name: "label" })), index.h("button", { type: "button" }, index.h("smoothly-icon", { size: "tiny", name: this.open ? "caret-down-outline" : "caret-forward-outline" })), index.h("smoothly-picker-menu", { looks: this.looks, onClick: e => e.stopPropagation(), multiple: this.multiple, mutable: this.mutable, readonly: this.readonly, validator: this.validator }, index.h("slot", { name: "search", slot: "search" }), index.h("slot", { name: "display", slot: "display" }), index.h("slot", null))));
+    return (index.h(index.Host, null, index.h("smoothly-slot-elements", { class: "selected", nodes: this.display }), index.h("span", { class: "label" }, index.h("slot", { name: "label" })), index.h("button", { type: "button" }, index.h("smoothly-icon", { size: "tiny", name: this.open ? "caret-down-outline" : "caret-forward-outline" })), index.h("smoothly-picker-menu", { open: this.open, looks: this.looks, onClick: e => e.stopPropagation(), multiple: this.multiple, mutable: this.mutable, readonly: this.readonly, validator: this.validator }, index.h("slot", { name: "search", slot: "search" }), index.h("slot", { name: "display", slot: "display" }), index.h("slot", null))));
   }
   get element() { return index.getElement(this); }
   static get watchers() { return {
@@ -28548,13 +28553,14 @@ const SmoothlyPickerDemo = class {
     }), this.data.options.map(email => {
       var _a;
       return (index.h("smoothly-picker-option", { key: email, value: email, search: [(_a = this.users[email]) !== null && _a !== void 0 ? _a : []].flat() }, index.h("span", null, this.users[email]), index.h("span", { slot: "label" }, email), index.h("smoothly-icon", { size: "tiny", slot: "display", name: "person-outline" })));
-    })), index.h("smoothly-submit", { size: "icon", slot: "submit" }, index.h("smoothly-icon", { name: "checkmark-circle" })), index.h("smoothly-input-clear", { type: "form", color: "danger", fill: "solid", slot: "clear" }, "Clear")), index.h("h5", null, "uncontrolled inputs"), index.h("smoothly-form", { onSmoothlyFormSubmit: e => console.log("submitted", e.detail), looks: "line" }, index.h("smoothly-input", { name: "purpose", type: "text" }, "Purpose"), index.h("smoothly-picker", { multiple: true, mutable: true, name: "emails", validator: validateEmail }, index.h("span", { slot: "label" }, "Emails"), index.h("span", { slot: "search" }, "Search"), index.h("smoothly-picker-option", { value: "james@rocket.com" }, "james@rocket.com"), index.h("smoothly-picker-option", { selected: true, value: "jessie@rocket.com" }, "jessie@rocket.com"), index.h("smoothly-picker-option", { value: "giovanni@rocket.com" }, "giovanni@rocket.com")), index.h("smoothly-submit", { slot: "submit" }, "Submit"), index.h("smoothly-input-clear", { type: "form", color: "danger", fill: "solid", slot: "clear" }, "Clear"), index.h("smoothly-picker", { name: "shape" }, index.h("span", { slot: "label" }, "Shape"), index.h("span", { slot: "search" }, "Search"), index.h("smoothly-picker-option", { value: "circle" }, index.h("span", { slot: "label" }, "Circle"), index.h("smoothly-icon", { size: "tiny", name: "ellipse-outline" })), index.h("smoothly-picker-option", { value: "cube" }, index.h("span", { slot: "label" }, "Cube"), index.h("smoothly-icon", { size: "tiny", name: "cube-outline" })), index.h("smoothly-picker-option", { value: "square", selected: true }, index.h("span", { slot: "label" }, "Square"), index.h("smoothly-icon", { size: "tiny", name: "square-outline" }))), index.h("smoothly-picker", { multiple: true, readonly: true, name: "animals" }, index.h("span", { slot: "label" }, "Animals"), index.h("span", { slot: "search" }, "Search"), index.h("smoothly-picker-option", { selected: true, value: "cat" }, "Cat"), index.h("smoothly-picker-option", { value: "dog" }, "Dog"), index.h("smoothly-picker-option", { value: "fish" }, "Fish")))));
+    })), index.h("smoothly-submit", { size: "icon", slot: "submit" }, index.h("smoothly-icon", { name: "checkmark-circle" })), index.h("smoothly-input-clear", { type: "form", color: "danger", fill: "solid", slot: "clear" }, "Clear")), index.h("h5", null, "uncontrolled inputs"), index.h("smoothly-form", { onSmoothlyFormSubmit: e => console.log("submitted", e.detail), looks: "line" }, index.h("smoothly-input", { name: "purpose", type: "text" }, "Purpose"), index.h("smoothly-picker", { multiple: true, mutable: true, name: "emails", validator: validateEmail }, index.h("span", { slot: "label" }, "Emails"), index.h("span", { slot: "search" }, "Search"), index.h("smoothly-picker-option", { value: "james@rocket.com" }, "james@rocket.com"), index.h("smoothly-picker-option", { selected: true, value: "jessie@rocket.com" }, "jessie@rocket.com"), index.h("smoothly-picker-option", { value: "giovanni@rocket.com" }, "giovanni@rocket.com")), index.h("smoothly-submit", { slot: "submit" }, "Submit"), index.h("smoothly-input-clear", { type: "form", color: "danger", fill: "solid", slot: "clear" }, "Clear"), index.h("smoothly-picker", { name: "shape" }, index.h("span", { slot: "label" }, "Shape"), index.h("span", { slot: "search" }, "Search"), index.h("smoothly-picker-option", { value: "circle" }, index.h("span", { slot: "label" }, "Circle"), index.h("smoothly-icon", { size: "tiny", name: "ellipse-outline" })), index.h("smoothly-picker-option", { value: "cube" }, index.h("span", { slot: "label" }, "Cube"), index.h("smoothly-icon", { size: "tiny", name: "cube-outline" })), index.h("smoothly-picker-option", { value: "square", selected: true }, index.h("span", { slot: "label" }, "Square"), index.h("smoothly-icon", { size: "tiny", name: "square-outline" }))), index.h("smoothly-picker", { multiple: true, readonly: true, name: "animals" }, index.h("span", { slot: "label" }, "Animals"), index.h("span", { slot: "search" }, "Search"), index.h("smoothly-picker-option", { selected: true, value: "cat" }, "Cat"), index.h("smoothly-picker-option", { value: "dog" }, "Dog"), index.h("smoothly-picker-option", { value: "fish" }, "Fish"))), index.h("smoothly-picker", { looks: "border", name: "icon" }, index.h("span", { slot: "label" }, "Icon"), index.h("span", { slot: "search" }, "Search"), index.h("smoothly-picker-option", { value: "circle" }, index.h("span", { slot: "label" }, "Circle"), index.h("smoothly-icon", { size: "tiny", name: "ellipse-outline" })), index.h("smoothly-picker-option", { value: "cube" }, index.h("span", { slot: "label" }, "Cube"), index.h("smoothly-icon", { size: "tiny", name: "cube-outline" })), index.h("smoothly-picker-option", { value: "square", selected: true }, index.h("span", { slot: "label" }, "Square"), index.h("smoothly-icon", { size: "tiny", name: "square-outline" })), index.h("smoothly-picker-option", { value: "airplane" }, index.h("span", { slot: "label" }, "Airplane"), index.h("smoothly-icon", { size: "tiny", name: "airplane-outline" })), index.h("smoothly-picker-option", { value: "alarm" }, index.h("span", { slot: "label" }, "Alarm"), index.h("smoothly-icon", { size: "tiny", name: "alarm-outline" })), index.h("smoothly-picker-option", { value: "archive" }, index.h("span", { slot: "label" }, "Archive"), index.h("smoothly-icon", { size: "tiny", name: "archive-outline" })), index.h("smoothly-picker-option", { value: "bag" }, index.h("span", { slot: "label" }, "Bag"), index.h("smoothly-icon", { size: "tiny", name: "bag-outline" })), index.h("smoothly-picker-option", { value: "cafe" }, index.h("span", { slot: "label" }, "Cafe"), index.h("smoothly-icon", { size: "tiny", name: "cafe-outline" })), index.h("smoothly-picker-option", { value: "disc" }, index.h("span", { slot: "label" }, "Disc"), index.h("smoothly-icon", { size: "tiny", name: "disc-outline" })), index.h("smoothly-picker-option", { value: "earth" }, index.h("span", { slot: "label" }, "Earth"), index.h("smoothly-icon", { size: "tiny", name: "earth-outline" })), index.h("smoothly-picker-option", { value: "fast-food" }, index.h("span", { slot: "label" }, "Fast food"), index.h("smoothly-icon", { size: "tiny", name: "fast-food-outline" })))));
   }
 };
 SmoothlyPickerDemo.style = styleCss$u;
 
-const styleCss$t = ".sc-smoothly-picker-menu-h{display:flex;flex-direction:column;gap:0.5rem;position:absolute;z-index:4;top:100%;left:-1px;right:-1px;background-color:rgb(var(--background-color, var(--smoothly-color-shade)));padding:0.5rem;border:rgb(var(--text-color, var(--smoothly-color-contrast))) solid 1px}.list.sc-smoothly-picker-menu{display:grid;grid-template-columns:auto 1fr auto;align-items:center;row-gap:0.5ch;overflow:auto;max-height:calc(1.75rem * 10 + 0.5ch * 9);padding-right:0.5rem}.hide.sc-smoothly-picker-menu{display:none}.controls.sc-smoothly-picker-menu{display:grid;grid-template-columns:1fr auto;gap:0.5rem;transition:grid-template-columns 200ms linear}.controls.sc-smoothly-picker-menu>button.sc-smoothly-picker-menu:disabled{opacity:0.3}";
+const styleCss$t = ".sc-smoothly-picker-menu-h{display:flex;flex-direction:column;gap:0.5rem;position:absolute;z-index:4;left:-1px;right:-1px;min-width:max-content;background-color:rgb(var(--background-color, var(--smoothly-color-shade)));padding:0.5rem;border:rgb(var(--text-color, var(--smoothly-color-contrast))) solid 1px}.sc-smoothly-picker-menu-h:not(.flip){top:100%}.flip.sc-smoothly-picker-menu-h{bottom:100%}.sc-smoothly-picker-menu-h:not([open]){display:none}.sc-smoothly-picker-menu-h .list.sc-smoothly-picker-menu{display:grid;grid-template-columns:auto 1fr auto;align-items:center;row-gap:0.5ch;overflow-y:auto;max-height:calc(1.75rem * 10 + 0.5ch * 9);padding-right:0.5rem;padding-bottom:0.25rem}.sc-smoothly-picker-menu-h .hide.sc-smoothly-picker-menu{display:none}.sc-smoothly-picker-menu-h .controls.sc-smoothly-picker-menu{display:grid;grid-template-columns:1fr auto;gap:0.5rem;transition:grid-template-columns 200ms linear}.sc-smoothly-picker-menu-h .controls.sc-smoothly-picker-menu>button.sc-smoothly-picker-menu:disabled{opacity:0.3}";
 
+const Observers = global$1().Observers;
 function* chain(...iterables) {
   for (const iterable of iterables)
     yield* iterable;
@@ -28576,6 +28582,7 @@ const SmoothlyPickerMenu = class {
     this.notice = index.createEvent(this, "notice", 7);
     this.smoothlyPickerMenuLoaded = index.createEvent(this, "smoothlyPickerMenuLoaded", 7);
     this.looks = undefined;
+    this.open = false;
     this.multiple = false;
     this.mutable = false;
     this.readonly = false;
@@ -28586,6 +28593,19 @@ const SmoothlyPickerMenu = class {
     this.search = "";
     this.valid = false;
     this.display = undefined;
+    this.flip = false;
+    this.flipChecked = false;
+  }
+  componentWillLoad() {
+    if (!Observers.has(this.element)) {
+      const threshold = 0.4;
+      Observers.set(this.element, new IntersectionObserver(entries => {
+        var _a, _b;
+        return ((_b = (_a = entries.find(entry => entry.target == this.element)) === null || _a === void 0 ? void 0 : _a.intersectionRatio) !== null && _b !== void 0 ? _b : 0) < threshold &&
+          !this.flipChecked &&
+          ((this.flip = !this.flip), (this.flipChecked = true));
+      }, { threshold }));
+    }
   }
   componentDidLoad() {
     this.smoothlyPickerMenuLoaded.emit({
@@ -28615,10 +28635,27 @@ const SmoothlyPickerMenu = class {
       },
     });
   }
+  disconnectedCallback() {
+    var _a;
+    if (!this.element.parentElement) {
+      (_a = Observers.get(this.element)) === null || _a === void 0 ? void 0 : _a.disconnect();
+      Observers.remove(this.element);
+    }
+  }
+  openChange() {
+    const observer = Observers.get(this.element);
+    if (this.open)
+      observer === null || observer === void 0 ? void 0 : observer.observe(this.element);
+    else
+      observer === null || observer === void 0 ? void 0 : observer.unobserve(this.element);
+  }
   readonlyChanged() {
     for (const option of chain(this.options.values(), this.backend.values()))
       option.set.readonly(this.readonly);
   }
+  scrollHandler() {
+    this.flipChecked = false;
+  }
   optionLoadHandler(event) {
     if (!this.listElement || !event.composedPath().includes(this.listElement)) {
       event.stopPropagation();
@@ -28703,16 +28740,19 @@ const SmoothlyPickerMenu = class {
     event.detail.set.nodes(this.display);
   }
   render() {
-    return (index.h(index.Host, { class: { valid: this.valid } }, index.h("smoothly-slotted-elements", { class: "hide", onSmoothlySlottedChange: e => (this.display = e.detail) }, index.h("slot", { name: "display" })), index.h("div", { class: "hide" }, index.h("slot", null), Array.from(this.created.values(), option => (index.h("smoothly-picker-option", { key: option.value, value: option.value, selected: option.selected }, option.value, index.h("smoothly-slot-elements", { slot: "display", nodes: this.display }))))), index.h("div", { class: "controls" }, index.h("smoothly-input", { ref: e => (this.searchElement = e), name: "search", value: this.search, looks: this.looks, onKeyDown: e => this.keyDownHandler(e), onSmoothlyInput: e => this.inputHandler(e), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyBlur: e => e.stopPropagation() }, index.h("slot", { name: "search" })), this.mutable && !this.readonly ? (index.h("button", { onClick: () => this.addHandler(), disabled: !this.valid, type: "button" }, index.h("smoothly-icon", { name: "add-outline" }))) : null), index.h("div", { class: "list", ref: e => (this.listElement = e) }, Array.from(this.backend.values()).map(option => (index.h("smoothly-slot-elements", { ref: e => restoreListener(e, option), clone: false, nodes: option.clone }))))));
+    return (index.h(index.Host, { class: { valid: this.valid, flip: this.flip } }, index.h("smoothly-slotted-elements", { class: "hide", onSmoothlySlottedChange: e => (this.display = e.detail) }, index.h("slot", { name: "display" })), index.h("div", { class: "hide" }, index.h("slot", null), Array.from(this.created.values(), option => (index.h("smoothly-picker-option", { key: option.value, value: option.value, selected: option.selected }, option.value, index.h("smoothly-slot-elements", { slot: "display", nodes: this.display }))))), index.h("div", { class: "controls" }, index.h("smoothly-input", { ref: e => (this.searchElement = e), name: "search", value: this.search, looks: this.looks, onKeyDown: e => this.keyDownHandler(e), onSmoothlyInput: e => this.inputHandler(e), onSmoothlyChange: e => e.stopPropagation(), onSmoothlyBlur: e => e.stopPropagation() }, index.h("slot", { name: "search" })), this.mutable && !this.readonly ? (index.h("button", { onClick: () => this.addHandler(), disabled: !this.valid, type: "button" }, index.h("smoothly-icon", { name: "add-outline" }))) : null), index.h("div", { class: "list", ref: e => (this.listElement = e) }, Array.from(this.backend.values())
+      .sort((a, b) => a.position - b.position)
+      .map(option => (index.h("smoothly-slot-elements", { ref: e => restoreListener(e, option), clone: false, nodes: option.clone }))))));
   }
   get element() { return index.getElement(this); }
   static get watchers() { return {
+    "open": ["openChange"],
     "readonly": ["readonlyChanged"]
   }; }
 };
 SmoothlyPickerMenu.style = styleCss$t;
 
-const styleCss$s = ":host{display:contents}:host(:not([visible])){display:none}:host>*{cursor:pointer;padding:0.25ch 0.5rem}.display{padding-left:0}button{color:unset;background-color:inherit;border:none;padding-right:0}.content{display:flex;column-gap:1rem;flex-wrap:wrap;justify-content:space-between}";
+const styleCss$s = ":host{display:contents}:host(:not([visible])){display:none}:host>*{cursor:pointer;padding:0.25ch 0.5rem}:host .display{padding-left:0}:host button{color:unset;background-color:inherit;border:none;padding-right:0}:host .content{display:flex;column-gap:1rem;justify-content:space-between}";
 
 var __rest = (undefined && undefined.__rest) || function (s, e) {
   var t = {};
@@ -28736,10 +28776,12 @@ const SmoothlyPickerOption = class {
     this.visible = true;
     this.value = undefined;
     this.search = [];
+    this.position = -1;
     this.readonly = false;
     this.slotted = [];
   }
   get option() {
+    var _a;
     return {
       element: this.element,
       selected: this.selected,
@@ -28748,6 +28790,9 @@ const SmoothlyPickerOption = class {
       search: this.search,
       value: this.value,
       slotted: this.slotted,
+      position: this.position >= 0 || !((_a = this.element.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement)
+        ? this.position
+        : Array.from(this.element.parentElement.parentElement.children).indexOf(this.element.parentElement),
       set: {
         selected: selected => (this.selected = selected),
         readonly: readonly => (this.readonly = readonly),
@@ -28779,10 +28824,11 @@ const SmoothlyPickerOption = class {
       this.selected = !this.selected;
   }
   render() {
-    return (index.h(index.Host, { class: { visible: this.visible }, onClick: () => this.clickHandler() }, index.h("div", { class: "display" }, index.h("slot", { name: "display" })), index.h("div", { class: "content" }, index.h("smoothly-slotted-elements", { onSmoothlySlottedChange: e => this.slottedChangeHandler(e), clone: true }, index.h("slot", null)), index.h("slot", { name: "label" })), index.h("button", { type: "button" }, index.h("smoothly-icon", { name: this.selected ? "checkbox-outline" : "square-outline" }))));
+    return (index.h(index.Host, { class: { visible: this.visible }, onClick: () => this.clickHandler() }, index.h("div", { part: "display", class: "display" }, index.h("slot", { name: "display" })), index.h("div", { part: "content", class: "content" }, index.h("smoothly-slotted-elements", { onSmoothlySlottedChange: e => this.slottedChangeHandler(e), clone: true }, index.h("slot", null)), index.h("slot", { name: "label" })), index.h("button", { type: "button" }, index.h("smoothly-icon", { name: this.selected ? "checkbox-outline" : "square-outline" }))));
   }
   get element() { return index.getElement(this); }
   static get watchers() { return {
+    "position": ["emitChange"],
     "selected": ["emitChange"],
     "slotted": ["emitChange"]
   }; }