smoothly 0.1.106 → 0.1.109

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 (33) hide show
  1. package/dist/cjs/loader.cjs.js +1 -1
  2. package/dist/cjs/{smoothly-accordion_48.cjs.entry.js → smoothly-accordion_49.cjs.entry.js} +91 -66
  3. package/dist/cjs/smoothly-display-demo.cjs.entry.js +1 -1
  4. package/dist/cjs/smoothly-input-date-range.cjs.entry.js +2 -2
  5. package/dist/cjs/smoothly-input-date.cjs.entry.js +10 -6
  6. package/dist/cjs/smoothly-skeleton.cjs.entry.js +27 -0
  7. package/dist/cjs/smoothly.cjs.js +1 -1
  8. package/dist/collection/collection-manifest.json +1 -0
  9. package/dist/collection/components/display-demo/index.js +12 -0
  10. package/dist/collection/components/input-date/index.js +29 -8
  11. package/dist/collection/components/input-date-range/index.js +3 -3
  12. package/dist/collection/components/input-date-range/style.css +5 -1
  13. package/dist/collection/components/skeleton/index.js +128 -0
  14. package/dist/collection/components/skeleton/style.css +53 -0
  15. package/dist/custom-elements/index.d.ts +6 -0
  16. package/dist/custom-elements/index.js +99 -72
  17. package/dist/esm/loader.js +1 -1
  18. package/dist/esm/{smoothly-accordion_48.entry.js → smoothly-accordion_49.entry.js} +91 -67
  19. package/dist/esm/smoothly-display-demo.entry.js +1 -1
  20. package/dist/esm/smoothly-input-date-range.entry.js +2 -2
  21. package/dist/esm/smoothly-input-date.entry.js +10 -6
  22. package/dist/esm/smoothly-skeleton.entry.js +23 -0
  23. package/dist/esm/smoothly.js +1 -1
  24. package/dist/smoothly/{p-c43da6c0.entry.js → p-33e9a4f3.entry.js} +1 -1
  25. package/dist/smoothly/smoothly-display-demo.entry.js +1 -1
  26. package/dist/smoothly/smoothly-input-date-range.entry.js +2 -2
  27. package/dist/smoothly/smoothly-input-date.entry.js +10 -6
  28. package/dist/smoothly/smoothly-skeleton.entry.js +23 -0
  29. package/dist/smoothly/smoothly.esm.js +1 -1
  30. package/dist/types/components/input-date/index.d.ts +1 -0
  31. package/dist/types/components/skeleton/index.d.ts +10 -0
  32. package/dist/types/components.d.ts +27 -0
  33. package/package.json +1 -1
@@ -26,7 +26,7 @@ const defineCustomElements = (win, options) => {
26
26
  if (typeof window === 'undefined') return Promise.resolve();
27
27
  return patchEsm().then(() => {
28
28
  globalScripts();
29
- return bootstrapLazy([["smoothly-app-demo",[[0,"smoothly-app-demo",{"baseUrl":[1,"base-url"]}]]],["smoothly-google-font",[[2,"smoothly-google-font",{"value":[1]}]]],["smoothly-radio-group",[[4,"smoothly-radio-group",{"orientation":[513]}]]],["smoothly-reorder",[[0,"smoothly-reorder"]]],["smoothly-trigger-sink",[[6,"smoothly-trigger-sink",{"context":[16],"destination":[1],"filter":[1]},[[0,"trigger","TriggerListener"]]]]],["smoothly-trigger-source",[[6,"smoothly-trigger-source",{"listen":[1]}]]],["smoothly-input-demo",[[0,"smoothly-input-demo"]]],["smoothly-select-demo",[[2,"smoothly-select-demo",null,[[0,"selectionChanged","handleSelectionChanged"]]]]],["smoothly-display-demo",[[0,"smoothly-display-demo"]]],["smoothly-table-demo",[[2,"smoothly-table-demo"]]],["smoothly-app",[[4,"smoothly-app",{"color":[1]}]]],["smoothly-dialog-demo",[[0,"smoothly-dialog-demo"]]],["smoothly-icon-demo",[[2,"smoothly-icon-demo"]]],["smoothly-room",[[4,"smoothly-room",{"label":[1],"icon":[1],"path":[1],"to":[1]}]]],["smoothly-input-date-range",[[2,"smoothly-input-date-range",{"value":[1025],"start":[1025],"end":[1025],"max":[1025],"min":[1025],"open":[1028],"showLabel":[516,"show-label"]},[[0,"startChanged","onStartChanged"],[0,"endChanged","onEndChanged"],[0,"dateRangeSet","onDateRangeSet"]]]]],["smoothly-notifier",[[6,"smoothly-notifier",{"notices":[32]},[[0,"notice","onNotice"],[0,"remove","onRemove"]]]]],["smoothly-picker",[[1,"smoothly-picker",{"maxMenuHeight":[1,"max-menu-height"],"maxHeight":[1,"max-height"],"emptyMenuLabel":[1025,"empty-menu-label"],"multiple":[516],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectionName":[1025,"selection-name"],"isOpen":[32]},[[0,"optionSelect","optionSelectHander"]]]]],["smoothly-dialog",[[6,"smoothly-dialog",{"color":[513],"open":[1540],"closable":[516],"header":[513]},[[0,"trigger","TriggerListener"]]]]],["smoothly-backtotop",[[2,"smoothly-backtotop",{"opacity":[1],"bottom":[1],"right":[1],"visible":[32]}]]],["smoothly-checkbox",[[2,"smoothly-checkbox",{"selectAll":[4,"select-all"],"size":[1],"intermediate":[1540],"selected":[1540],"disabled":[1540],"t":[32]}]]],["smoothly-submit",[[6,"smoothly-submit",{"processing":[1540],"color":[513],"expand":[513],"fill":[513],"disabled":[516],"prevent":[4],"submit":[64]},[[0,"click","handleSubmit"]]]]],["smoothly-tuple",[[0,"smoothly-tuple",{"tuple":[16]}]]],["smoothly-urlencoded",[[0,"smoothly-urlencoded",{"data":[1]}]]],["smoothly-accordion",[[6,"smoothly-accordion",{"value":[1025]},[[0,"smoothlyOpen","handleOpenClose"],[0,"smoothlyClose","handleOpenClose"],[0,"smoothlyAccordionItemDidLoad","onAccordionItemDidLoad"],[0,"smoothlyAccordionItemDidUnload","onAccordionItemDidUnload"]]]]],["smoothly-accordion-item",[[6,"smoothly-accordion-item",{"name":[1],"brand":[1],"open":[1540]}]]],["smoothly-display-amount",[[2,"smoothly-display-amount",{"amount":[8],"currency":[1]}]]],["smoothly-frame",[[2,"smoothly-frame",{"url":[1],"name":[1],"origin":[1],"send":[64]}]]],["smoothly-popup",[[6,"smoothly-popup",{"visible":[1540],"direction":[1537],"cssVariables":[32]}]]],["smoothly-quiet",[[6,"smoothly-quiet",{"color":[1]}]]],["smoothly-radio",[[6,"smoothly-radio",{"name":[1],"value":[1],"checked":[1540],"tabIndex":[2,"tab-index"]}]]],["smoothly-select",[[6,"smoothly-select",{"identifier":[1],"background":[513],"value":[1025]}]]],["smoothly-tab",[[6,"smoothly-tab",{"label":[1],"open":[1540]},[[0,"click","onClick"]]]]],["smoothly-tab-switch",[[6,"smoothly-tab-switch",{"selectedElement":[32]},[[0,"expansionOpen","openChanged"]]]]],["smoothly-table",[[6,"smoothly-table",null,[[0,"sort","onSort"]]]]],["smoothly-table-cell",[[6,"smoothly-table-cell"]]],["smoothly-table-expandable-cell",[[6,"smoothly-table-expandable-cell",{"align":[1],"open":[1540],"beginOpen":[32]},[[0,"click","onClick"]]]]],["smoothly-table-expandable-row",[[6,"smoothly-table-expandable-row",null,[[0,"expansionLoaded","onExpansionLoaded"],[0,"expansionOpen","onDetailsLoaded"]]]]],["smoothly-table-header",[[6,"smoothly-table-header",{"name":[1],"sortDirection":[1025,"sort-direction"]},[[0,"click","onClick"]]]]],["smoothly-table-row",[[6,"smoothly-table-row",{"align":[1],"open":[1540],"beginOpen":[32]},[[0,"click","onClick"]]]]],["smoothly-icon",[[2,"smoothly-icon",{"color":[513],"fill":[513],"name":[1],"size":[513],"toolTip":[1,"tool-tip"],"document":[32]}]]],["smoothly-input-date",[[6,"smoothly-input-date",{"value":[1025],"open":[1028],"max":[1025],"min":[1025]},[[0,"dateSet","dateSetHandler"]]]]],["smoothly-notification",[[2,"smoothly-notification",{"notice":[16],"tick":[32]},[[0,"trigger","onTrigger"]]]]],["smoothly-menu-options",[[1,"smoothly-menu-options",{"emptyMenuLabel":[1025,"empty-menu-label"],"maxMenuHeight":[1,"max-menu-height"],"order":[4],"optionStyle":[8,"option-style"],"options":[1040],"resetHighlightOnOptionsChange":[1028,"reset-highlight-on-options-change"],"filteredOptions":[32],"highlightIndex":[32],"moveHighlight":[64],"setHighlight":[64],"getHighlighted":[64],"filterOptions":[64]},[[0,"optionHover","optionHoverHandler"]]]]],["smoothly-display",[[2,"smoothly-display",{"type":[1],"value":[8],"currency":[1],"country":[1]}]]],["smoothly-display-date-time",[[2,"smoothly-display-date-time",{"datetime":[1]}]]],["smoothly-option",[[1,"smoothly-option",{"aliases":[513],"dataHighlight":[1540,"data-highlight"],"name":[1537],"value":[1537],"divider":[1540]}]]],["smoothly-spinner",[[2,"smoothly-spinner",{"active":[516],"size":[513]}]]],["smoothly-selector",[[6,"smoothly-selector",{"opened":[32],"selectedElement":[32],"missing":[32],"filter":[32]},[[0,"click","onClick"],[0,"itemSelected","onItemSelected"],[0,"keydown","onKeyDown"]]]]],["smoothly-item",[[6,"smoothly-item",{"value":[8],"selected":[1540],"filter":[64]},[[0,"click","onClick"]]]]],["smoothly-calendar",[[2,"smoothly-calendar",{"month":[1025],"value":[1025],"start":[1025],"end":[1025],"max":[1025],"min":[1025],"doubleInput":[516,"double-input"],"firstSelected":[32]}]]],["smoothly-input",[[6,"smoothly-input",{"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":[1025],"disabled":[1028],"currency":[513],"getFormData":[64],"setKeepFocusOnReRender":[64],"setSelectionRange":[64]}]]],["smoothly-input-month",[[2,"smoothly-input-month",{"value":[1025]}]]],["smoothly-trigger",[[6,"smoothly-trigger",{"color":[513],"expand":[513],"fill":[513],"disabled":[516],"type":[513],"name":[1],"value":[8]},[[0,"click","onClick"]]]]]], options);
29
+ return bootstrapLazy([["smoothly-app-demo",[[0,"smoothly-app-demo",{"baseUrl":[1,"base-url"]}]]],["smoothly-google-font",[[2,"smoothly-google-font",{"value":[1]}]]],["smoothly-radio-group",[[4,"smoothly-radio-group",{"orientation":[513]}]]],["smoothly-reorder",[[0,"smoothly-reorder"]]],["smoothly-trigger-sink",[[6,"smoothly-trigger-sink",{"context":[16],"destination":[1],"filter":[1]},[[0,"trigger","TriggerListener"]]]]],["smoothly-trigger-source",[[6,"smoothly-trigger-source",{"listen":[1]}]]],["smoothly-input-demo",[[0,"smoothly-input-demo"]]],["smoothly-select-demo",[[2,"smoothly-select-demo",null,[[0,"selectionChanged","handleSelectionChanged"]]]]],["smoothly-display-demo",[[0,"smoothly-display-demo"]]],["smoothly-table-demo",[[2,"smoothly-table-demo"]]],["smoothly-app",[[4,"smoothly-app",{"color":[1]}]]],["smoothly-dialog-demo",[[0,"smoothly-dialog-demo"]]],["smoothly-icon-demo",[[2,"smoothly-icon-demo"]]],["smoothly-room",[[4,"smoothly-room",{"label":[1],"icon":[1],"path":[1],"to":[1]}]]],["smoothly-input-date-range",[[2,"smoothly-input-date-range",{"value":[1025],"start":[1025],"end":[1025],"max":[1025],"min":[1025],"open":[1028],"showLabel":[516,"show-label"]},[[0,"startChanged","onStartChanged"],[0,"endChanged","onEndChanged"],[0,"dateRangeSet","onDateRangeSet"]]]]],["smoothly-notifier",[[6,"smoothly-notifier",{"notices":[32]},[[0,"notice","onNotice"],[0,"remove","onRemove"]]]]],["smoothly-picker",[[1,"smoothly-picker",{"maxMenuHeight":[1,"max-menu-height"],"maxHeight":[1,"max-height"],"emptyMenuLabel":[1025,"empty-menu-label"],"multiple":[516],"optionStyle":[8,"option-style"],"options":[16],"labelSetting":[513,"label-setting"],"label":[513],"selections":[1040],"selectNoneName":[1025,"select-none-name"],"selectionName":[1025,"selection-name"],"isOpen":[32]},[[0,"optionSelect","optionSelectHander"]]]]],["smoothly-dialog",[[6,"smoothly-dialog",{"color":[513],"open":[1540],"closable":[516],"header":[513]},[[0,"trigger","TriggerListener"]]]]],["smoothly-backtotop",[[2,"smoothly-backtotop",{"opacity":[1],"bottom":[1],"right":[1],"visible":[32]}]]],["smoothly-checkbox",[[2,"smoothly-checkbox",{"selectAll":[4,"select-all"],"size":[1],"intermediate":[1540],"selected":[1540],"disabled":[1540],"t":[32]}]]],["smoothly-submit",[[6,"smoothly-submit",{"processing":[1540],"color":[513],"expand":[513],"fill":[513],"disabled":[516],"prevent":[4],"submit":[64]},[[0,"click","handleSubmit"]]]]],["smoothly-urlencoded",[[0,"smoothly-urlencoded",{"data":[1]}]]],["smoothly-accordion",[[6,"smoothly-accordion",{"value":[1025]},[[0,"smoothlyOpen","handleOpenClose"],[0,"smoothlyClose","handleOpenClose"],[0,"smoothlyAccordionItemDidLoad","onAccordionItemDidLoad"],[0,"smoothlyAccordionItemDidUnload","onAccordionItemDidUnload"]]]]],["smoothly-accordion-item",[[6,"smoothly-accordion-item",{"name":[1],"brand":[1],"open":[1540]}]]],["smoothly-display-amount",[[2,"smoothly-display-amount",{"amount":[8],"currency":[1]}]]],["smoothly-frame",[[2,"smoothly-frame",{"url":[1],"name":[1],"origin":[1],"send":[64]}]]],["smoothly-popup",[[6,"smoothly-popup",{"visible":[1540],"direction":[1537],"cssVariables":[32]}]]],["smoothly-quiet",[[6,"smoothly-quiet",{"color":[1]}]]],["smoothly-radio",[[6,"smoothly-radio",{"name":[1],"value":[1],"checked":[1540],"tabIndex":[2,"tab-index"]}]]],["smoothly-select",[[6,"smoothly-select",{"identifier":[1],"background":[513],"value":[1025]}]]],["smoothly-skeleton",[[2,"smoothly-skeleton",{"widths":[16],"width":[1],"color":[1],"period":[2],"distance":[1],"align":[513]}]]],["smoothly-tab",[[6,"smoothly-tab",{"label":[1],"open":[1540]},[[0,"click","onClick"]]]]],["smoothly-tab-switch",[[6,"smoothly-tab-switch",{"selectedElement":[32]},[[0,"expansionOpen","openChanged"]]]]],["smoothly-table",[[6,"smoothly-table",null,[[0,"sort","onSort"]]]]],["smoothly-table-cell",[[6,"smoothly-table-cell"]]],["smoothly-table-expandable-cell",[[6,"smoothly-table-expandable-cell",{"align":[1],"open":[1540],"beginOpen":[32]},[[0,"click","onClick"]]]]],["smoothly-table-expandable-row",[[6,"smoothly-table-expandable-row",null,[[0,"expansionLoaded","onExpansionLoaded"],[0,"expansionOpen","onDetailsLoaded"]]]]],["smoothly-table-header",[[6,"smoothly-table-header",{"name":[1],"sortDirection":[1025,"sort-direction"]},[[0,"click","onClick"]]]]],["smoothly-table-row",[[6,"smoothly-table-row",{"align":[1],"open":[1540],"beginOpen":[32]},[[0,"click","onClick"]]]]],["smoothly-icon",[[2,"smoothly-icon",{"color":[513],"fill":[513],"name":[1],"size":[513],"toolTip":[1,"tool-tip"],"document":[32]}]]],["smoothly-input-date",[[6,"smoothly-input-date",{"value":[1025],"open":[1028],"max":[1025],"min":[1025],"disabled":[1028]},[[0,"dateSet","dateSetHandler"]]]]],["smoothly-notification",[[2,"smoothly-notification",{"notice":[16],"tick":[32]},[[0,"trigger","onTrigger"]]]]],["smoothly-menu-options",[[1,"smoothly-menu-options",{"emptyMenuLabel":[1025,"empty-menu-label"],"maxMenuHeight":[1,"max-menu-height"],"order":[4],"optionStyle":[8,"option-style"],"options":[1040],"resetHighlightOnOptionsChange":[1028,"reset-highlight-on-options-change"],"filteredOptions":[32],"highlightIndex":[32],"moveHighlight":[64],"setHighlight":[64],"getHighlighted":[64],"filterOptions":[64]},[[0,"optionHover","optionHoverHandler"]]]]],["smoothly-display",[[2,"smoothly-display",{"type":[1],"value":[8],"currency":[1],"country":[1]}]]],["smoothly-display-date-time",[[2,"smoothly-display-date-time",{"datetime":[1]}]]],["smoothly-tuple",[[0,"smoothly-tuple",{"tuple":[16]}]]],["smoothly-option",[[1,"smoothly-option",{"aliases":[513],"dataHighlight":[1540,"data-highlight"],"name":[1537],"value":[1537],"divider":[1540]}]]],["smoothly-spinner",[[2,"smoothly-spinner",{"active":[516],"size":[513]}]]],["smoothly-selector",[[6,"smoothly-selector",{"opened":[32],"selectedElement":[32],"missing":[32],"filter":[32]},[[0,"click","onClick"],[0,"itemSelected","onItemSelected"],[0,"keydown","onKeyDown"]]]]],["smoothly-item",[[6,"smoothly-item",{"value":[8],"selected":[1540],"filter":[64]},[[0,"click","onClick"]]]]],["smoothly-calendar",[[2,"smoothly-calendar",{"month":[1025],"value":[1025],"start":[1025],"end":[1025],"max":[1025],"min":[1025],"doubleInput":[516,"double-input"],"firstSelected":[32]}]]],["smoothly-input",[[6,"smoothly-input",{"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":[1025],"disabled":[1028],"currency":[513],"getFormData":[64],"setKeepFocusOnReRender":[64],"setSelectionRange":[64]}]]],["smoothly-input-month",[[2,"smoothly-input-month",{"value":[1025]}]]],["smoothly-trigger",[[6,"smoothly-trigger",{"color":[513],"expand":[513],"fill":[513],"disabled":[516],"type":[513],"name":[1],"value":[8]},[[0,"click","onClick"]]]]]], options);
30
30
  });
31
31
  };
32
32
 
@@ -3,7 +3,7 @@ import { A as App, N as Notice } from './Notice-819c6f49.js';
3
3
  import { T as Trigger, M as Message } from './Trigger-d7b181ec.js';
4
4
  import './GoogleFont-8474516b.js';
5
5
 
6
- const styleCss$E = "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}";
6
+ const styleCss$F = "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}";
7
7
 
8
8
  let SmoothlyAccordion = class {
9
9
  constructor(hostRef) {
@@ -49,9 +49,9 @@ let SmoothlyAccordion = class {
49
49
  "value": ["valueChanged"]
50
50
  }; }
51
51
  };
52
- SmoothlyAccordion.style = styleCss$E;
52
+ SmoothlyAccordion.style = styleCss$F;
53
53
 
54
- const styleCss$D = ".sc-smoothly-accordion-item-h{display:block}[hidden].sc-smoothly-accordion-item-h{display:none}details.sc-smoothly-accordion-item{padding:0}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>span.sc-smoothly-accordion-item{float:right;margin:0.2em;font-size:60%}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item{font-size:120%;list-style-type:none;cursor:pointer;padding:0.4em;color:rgb(var(--smoothly-text-tint))}details.sc-smoothly-accordion-item>fieldset.sc-smoothly-accordion-item{border:none;margin:0;padding:0}[open].sc-smoothly-accordion-item-h>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item::-webkit-details-marker{display:none}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{width:1em;height:auto;margin-bottom:-0.2em;margin-right:0.4em}[open].sc-smoothly-accordion-item-h>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{fill:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-accordion-item-h:not([open])>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{fill:rgb(var(--smoothly-text-tint))}";
54
+ const styleCss$E = ".sc-smoothly-accordion-item-h{display:block}[hidden].sc-smoothly-accordion-item-h{display:none}details.sc-smoothly-accordion-item{padding:0}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>span.sc-smoothly-accordion-item{float:right;margin:0.2em;font-size:60%}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item{font-size:120%;list-style-type:none;cursor:pointer;padding:0.4em;color:rgb(var(--smoothly-text-tint))}details.sc-smoothly-accordion-item>fieldset.sc-smoothly-accordion-item{border:none;margin:0;padding:0}[open].sc-smoothly-accordion-item-h>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item::-webkit-details-marker{display:none}details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{width:1em;height:auto;margin-bottom:-0.2em;margin-right:0.4em}[open].sc-smoothly-accordion-item-h>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{fill:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-accordion-item-h:not([open])>details.sc-smoothly-accordion-item>summary.sc-smoothly-accordion-item>svg.sc-smoothly-accordion-item{fill:rgb(var(--smoothly-text-tint))}";
55
55
 
56
56
  let SmoothlyAccordionItem = class {
57
57
  constructor(hostRef) {
@@ -96,9 +96,9 @@ let SmoothlyAccordionItem = class {
96
96
  "open": ["openChanged"]
97
97
  }; }
98
98
  };
99
- SmoothlyAccordionItem.style = styleCss$D;
99
+ SmoothlyAccordionItem.style = styleCss$E;
100
100
 
101
- const styleCss$C = "smoothly-app{display:block;scrollbar-width:none}smoothly-app[hidden]{display:none}smoothly-app[color=default],smoothly-app:not([color]){--smoothly-app-background:var(--smoothly-default-color);--smoothly-app-color:var(--smoothly-default-contrast);--smoothly-app-hover-background:var(--smoothly-primary-color);--smoothly-app-hover-color:var(--smoothly-primary-contrast);--smoothly-app-shadow:var(--smoothly-default-shadow)}smoothly-app[color=primary]{--smoothly-app-background:var(--smoothly-primary-shade);--smoothly-app-color:var(--smoothly-primary-contrast);--smoothly-app-hover-background:var(--smoothly-secondary-color);--smoothly-app-hover-color:var(--smoothly-secondary-contrast);--smoothly-app-shadow:var(--smoothly-primary-shadow)}smoothly-app[color=secondary]{--smoothly-app-background:var(--smoothly-secondary-shade);--smoothly-app-color:var(--smoothly-secondary-contrast);--smoothly-app-hover-background:var(--smoothly-primary-color);--smoothly-app-hover-color:var(--smoothly-primary-contrast);--smoothly-app-shadow:var(--smoothly-secondary-shadow)}smoothly-app[color=tertiary],smoothly-app[color=success],smoothly-app[color=warning],smoothly-app[color=danger]{--smoothly-app-background:var(--smoothly-color-shade);--smoothly-app-color:var(--smoothly-color-contrast);--smoothly-app-hover-background:var(--smoothly-default-shade);--smoothly-app-hover-color:var(--smoothly-default-contrast);--smoothly-app-shadow:var(--smoothly-color-shadow)}smoothly-app>smoothly-notifier>header{position:fixed;top:0;left:0;width:100%;z-index:5;height:90px;background-color:rgb(var(--smoothly-app-background));color:rgba(var(--smoothly-medium-color));fill:rgb(var(--smoothly-medium-color));stroke:rgb(var(--smoothly-medium-color));display:flex;font-size:18px;justify-content:space-between;align-items:center;box-shadow:0 2px 5px 0 rgba(var(--smoothly-app-shadow));border-bottom:1px solid rgba(var(--smoothly-dark-color))}smoothly-app>smoothly-notifier>header a{color:inherit;text-decoration:inherit}smoothly-app>smoothly-notifier>header>nav{flex-shrink:0;width:100%;flex-shrink:2}smoothly-app>smoothly-notifier>header>h1,smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul,smoothly-app>smoothly-notifier>header>nav>ul>li,smoothly-app>smoothly-notifier>header>nav>ul>li>*:not(a){display:flex;height:100%;margin:0}smoothly-app>smoothly-notifier>header>h1{margin-left:60px}smoothly-app>smoothly-notifier>header>h1>a{overflow:hidden;user-select:none;height:200%;display:flex;align-self:center;size:100%;background-position-y:center}smoothly-app>smoothly-notifier>header>nav>ul>li a{line-height:1.6cm}smoothly-app>smoothly-notifier>header>nav>ul{width:100%}smoothly-app>smoothly-notifier>header>[slot=\"header\"]{display:flex;margin-right:34.25px;justify-content:flex-end;border:0}smoothly-app>smoothly-notifier>header>[slot=\"header\"]>a{display:flex;align-self:center;border-width:0;align-items:center;margin-right:62.25px}smoothly-app>smoothly-notifier>header>[slot=\"header\"]>a>smoothly-icon{fill:rgb(var(--smoothly-primary-shade));stroke:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-shade))}smoothly-app>smoothly-notifier>header>nav>ul>li a{display:flex;height:36px;margin:0 0.4cm;text-decoration:none}smoothly-app>smoothly-notifier>header>nav>ul>li>a{display:flex;align-items:center;align-self:center;margin-bottom:2px}smoothly-app>smoothly-notifier>header>nav>ul>li smoothly-trigger.sc-smoothly-trigger-h{border:0}smoothly-app>smoothly-notifier>header>nav>ul>li>a>smoothly-icon>svg{fill:rgb(var(--smoothly-medium-color));stroke:rgb(var(--smoothly-medium-color));color:rgb(var(--smoothly-medium-color));align-items:center;display:flex}smoothly-app>smoothly-notifier>header>nav>ul>li>a:hover>smoothly-icon>svg,smoothly-app>smoothly-notifier>header>nav>ul>li>a.active>smoothly-icon>svg{color:rgb(var(--smoothly-app-color));stroke:rgb(var(--smoothly-app-color));fill:rgb(var(--smoothly-app-color))}smoothly-app>smoothly-notifier>header>nav>ul>li>smoothly-trigger.active a>smoothly-icon,smoothly-app>smoothly-notifier>header>nav>ul>li>smoothly-trigger:hover a>smoothly-icon,smoothly-app>smoothly-notifier>header>nav>ul>li a:hover,smoothly-app>smoothly-notifier>header>nav>ul>li a.active{border-bottom:2px solid rgb(var(--smoothly-app-color));margin-bottom:0px;border-bottom-width:2px;color:rgb(var(--smoothly-app-color));stroke:rgb(var(--smoothly-app-color));fill:rgb(var(--smoothly-app-color))}smoothly-app>smoothly-notifier>content{position:relative;top:90px}";
101
+ const styleCss$D = "smoothly-app{display:block;scrollbar-width:none}smoothly-app[hidden]{display:none}smoothly-app[color=default],smoothly-app:not([color]){--smoothly-app-background:var(--smoothly-default-color);--smoothly-app-color:var(--smoothly-default-contrast);--smoothly-app-hover-background:var(--smoothly-primary-color);--smoothly-app-hover-color:var(--smoothly-primary-contrast);--smoothly-app-shadow:var(--smoothly-default-shadow)}smoothly-app[color=primary]{--smoothly-app-background:var(--smoothly-primary-shade);--smoothly-app-color:var(--smoothly-primary-contrast);--smoothly-app-hover-background:var(--smoothly-secondary-color);--smoothly-app-hover-color:var(--smoothly-secondary-contrast);--smoothly-app-shadow:var(--smoothly-primary-shadow)}smoothly-app[color=secondary]{--smoothly-app-background:var(--smoothly-secondary-shade);--smoothly-app-color:var(--smoothly-secondary-contrast);--smoothly-app-hover-background:var(--smoothly-primary-color);--smoothly-app-hover-color:var(--smoothly-primary-contrast);--smoothly-app-shadow:var(--smoothly-secondary-shadow)}smoothly-app[color=tertiary],smoothly-app[color=success],smoothly-app[color=warning],smoothly-app[color=danger]{--smoothly-app-background:var(--smoothly-color-shade);--smoothly-app-color:var(--smoothly-color-contrast);--smoothly-app-hover-background:var(--smoothly-default-shade);--smoothly-app-hover-color:var(--smoothly-default-contrast);--smoothly-app-shadow:var(--smoothly-color-shadow)}smoothly-app>smoothly-notifier>header{position:fixed;top:0;left:0;width:100%;z-index:5;height:90px;background-color:rgb(var(--smoothly-app-background));color:rgba(var(--smoothly-medium-color));fill:rgb(var(--smoothly-medium-color));stroke:rgb(var(--smoothly-medium-color));display:flex;font-size:18px;justify-content:space-between;align-items:center;box-shadow:0 2px 5px 0 rgba(var(--smoothly-app-shadow));border-bottom:1px solid rgba(var(--smoothly-dark-color))}smoothly-app>smoothly-notifier>header a{color:inherit;text-decoration:inherit}smoothly-app>smoothly-notifier>header>nav{flex-shrink:0;width:100%;flex-shrink:2}smoothly-app>smoothly-notifier>header>h1,smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul,smoothly-app>smoothly-notifier>header>nav>ul>li,smoothly-app>smoothly-notifier>header>nav>ul>li>*:not(a){display:flex;height:100%;margin:0}smoothly-app>smoothly-notifier>header>h1{margin-left:60px}smoothly-app>smoothly-notifier>header>h1>a{overflow:hidden;user-select:none;height:200%;display:flex;align-self:center;size:100%;background-position-y:center}smoothly-app>smoothly-notifier>header>nav>ul>li a{line-height:1.6cm}smoothly-app>smoothly-notifier>header>nav>ul{width:100%}smoothly-app>smoothly-notifier>header>[slot=\"header\"]{display:flex;margin-right:34.25px;justify-content:flex-end;border:0}smoothly-app>smoothly-notifier>header>[slot=\"header\"]>a{display:flex;align-self:center;border-width:0;align-items:center;margin-right:62.25px}smoothly-app>smoothly-notifier>header>[slot=\"header\"]>a>smoothly-icon{fill:rgb(var(--smoothly-primary-shade));stroke:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-shade))}smoothly-app>smoothly-notifier>header>nav>ul>li a{display:flex;height:36px;margin:0 0.4cm;text-decoration:none}smoothly-app>smoothly-notifier>header>nav>ul>li>a{display:flex;align-items:center;align-self:center;margin-bottom:2px}smoothly-app>smoothly-notifier>header>nav>ul>li smoothly-trigger.sc-smoothly-trigger-h{border:0}smoothly-app>smoothly-notifier>header>nav>ul>li>a>smoothly-icon>svg{fill:rgb(var(--smoothly-medium-color));stroke:rgb(var(--smoothly-medium-color));color:rgb(var(--smoothly-medium-color));align-items:center;display:flex}smoothly-app>smoothly-notifier>header>nav>ul>li>a:hover>smoothly-icon>svg,smoothly-app>smoothly-notifier>header>nav>ul>li>a.active>smoothly-icon>svg{color:rgb(var(--smoothly-app-color));stroke:rgb(var(--smoothly-app-color));fill:rgb(var(--smoothly-app-color))}smoothly-app>smoothly-notifier>header>nav>ul>li>smoothly-trigger.active a>smoothly-icon,smoothly-app>smoothly-notifier>header>nav>ul>li>smoothly-trigger:hover a>smoothly-icon,smoothly-app>smoothly-notifier>header>nav>ul>li a:hover,smoothly-app>smoothly-notifier>header>nav>ul>li a.active{border-bottom:2px solid rgb(var(--smoothly-app-color));margin-bottom:0px;border-bottom-width:2px;color:rgb(var(--smoothly-app-color));stroke:rgb(var(--smoothly-app-color));fill:rgb(var(--smoothly-app-color))}smoothly-app>smoothly-notifier>content{position:relative;top:90px}";
102
102
 
103
103
  let SmoothlyApp = class {
104
104
  constructor(hostRef) {
@@ -108,7 +108,7 @@ let SmoothlyApp = class {
108
108
  return (h("smoothly-notifier", null, h("slot", null)));
109
109
  }
110
110
  };
111
- SmoothlyApp.style = styleCss$C;
111
+ SmoothlyApp.style = styleCss$D;
112
112
 
113
113
  let SmoothlyAppDemo = class {
114
114
  constructor(hostRef) {
@@ -131,7 +131,7 @@ let SmoothlyAppDemo = class {
131
131
  }
132
132
  };
133
133
 
134
- const styleCss$B = ".sc-smoothly-backtotop-h{background-color:rgba(var(--smoothly-default-color), 1);opacity:var(--opacity);pointer-events:var(--pointer-events);transition:opacity 400ms;z-index:3;border-radius:50%;box-shadow:var(--smoothly-shadow);height:3rem;width:3rem;position:fixed;bottom:var(--bottom);right:var(--right);outline:none;cursor:pointer;display:flex;justify-content:center;align-items:center}";
134
+ const styleCss$C = ".sc-smoothly-backtotop-h{background-color:rgba(var(--smoothly-default-color), 1);opacity:var(--opacity);pointer-events:var(--pointer-events);transition:opacity 400ms;z-index:3;border-radius:50%;box-shadow:var(--smoothly-shadow);height:3rem;width:3rem;position:fixed;bottom:var(--bottom);right:var(--right);outline:none;cursor:pointer;display:flex;justify-content:center;align-items:center}";
135
135
 
136
136
  let SmoothlyBacktotop = class {
137
137
  constructor(hostRef) {
@@ -159,7 +159,7 @@ let SmoothlyBacktotop = class {
159
159
  }) }, h("smoothly-icon", { name: "chevron-up-outline" })));
160
160
  }
161
161
  };
162
- SmoothlyBacktotop.style = styleCss$B;
162
+ SmoothlyBacktotop.style = styleCss$C;
163
163
 
164
164
  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
165
165
 
@@ -18854,7 +18854,7 @@ function years(current) {
18854
18854
  return result;
18855
18855
  }
18856
18856
 
18857
- const styleCss$A = ".sc-smoothly-calendar-h{display:block;--other-month-opacity:0.5}.sc-smoothly-calendar-h>smoothly-input-month.sc-smoothly-calendar{width:calc(100% - 1em);padding:0.5em 0.5em 0 0.5em}th.sc-smoothly-calendar,td.sc-smoothly-calendar{text-align:center;padding:0.5em;min-width:2em;background-color:rgb(var(--smoothly-default-shade));cursor:pointer;user-select:none}td.currentMonth.sc-smoothly-calendar{color:rgb(var(--smoothly-default-contrast))}td.sc-smoothly-calendar:not(.currentMonth){color:rgba(var(--smoothly-default-contrast), var(--other-month-opacity))}td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).selected,td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).dateRange,td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).selected,td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).dateRange{color:rgba(var(--smoothly-default-contrast))}td.sc-smoothly-calendar:nth-child(6),td.sc-smoothly-calendar:nth-child(7){color:rgb(var(--smoothly-danger-tint))}td.sc-smoothly-calendar:nth-child(6):not(.currentMonth),td.sc-smoothly-calendar:nth-child(7):not(.currentMonth){color:rgba(var(--smoothly-danger-tint), var(--other-month-opacity))}td.sc-smoothly-calendar:not(.selected,.disable).sc-smoothly-calendar:hover{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}td.selected.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}td.sc-smoothly-calendar:not(.selected,.dateRange).sc-smoothly-calendar:not(:hover).today{background:rgb(var(--smoothly-dark-tint));color:rgb(var(--smoothly-dark-contrast))}td.dateRange.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}td.disable.sc-smoothly-calendar{cursor:not-allowed;background-color:rgb(var(--smoothly-default-tint), 0.5);color:rgb(var(--smoothly-default-contrast), 0.5)}";
18857
+ const styleCss$B = ".sc-smoothly-calendar-h{display:block;--other-month-opacity:0.5}.sc-smoothly-calendar-h>smoothly-input-month.sc-smoothly-calendar{width:calc(100% - 1em);padding:0.5em 0.5em 0 0.5em}th.sc-smoothly-calendar,td.sc-smoothly-calendar{text-align:center;padding:0.5em;min-width:2em;background-color:rgb(var(--smoothly-default-shade));cursor:pointer;user-select:none}td.currentMonth.sc-smoothly-calendar{color:rgb(var(--smoothly-default-contrast))}td.sc-smoothly-calendar:not(.currentMonth){color:rgba(var(--smoothly-default-contrast), var(--other-month-opacity))}td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).selected,td.sc-smoothly-calendar:nth-child(6):not(.currentMonth).dateRange,td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).selected,td.sc-smoothly-calendar:nth-child(7):not(.currentMonth).dateRange{color:rgba(var(--smoothly-default-contrast))}td.sc-smoothly-calendar:nth-child(6),td.sc-smoothly-calendar:nth-child(7){color:rgb(var(--smoothly-danger-tint))}td.sc-smoothly-calendar:nth-child(6):not(.currentMonth),td.sc-smoothly-calendar:nth-child(7):not(.currentMonth){color:rgba(var(--smoothly-danger-tint), var(--other-month-opacity))}td.sc-smoothly-calendar:not(.selected,.disable).sc-smoothly-calendar:hover{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}td.selected.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color))}td.sc-smoothly-calendar:not(.selected,.dateRange).sc-smoothly-calendar:not(:hover).today{background:rgb(var(--smoothly-dark-tint));color:rgb(var(--smoothly-dark-contrast))}td.dateRange.sc-smoothly-calendar{color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-tint))}td.disable.sc-smoothly-calendar{cursor:not-allowed;background-color:rgb(var(--smoothly-default-tint), 0.5);color:rgb(var(--smoothly-default-contrast), 0.5)}";
18858
18858
 
18859
18859
  let Calendar = class {
18860
18860
  constructor(hostRef) {
@@ -18937,7 +18937,7 @@ let Calendar = class {
18937
18937
  "end": ["onEnd"]
18938
18938
  }; }
18939
18939
  };
18940
- Calendar.style = styleCss$A;
18940
+ Calendar.style = styleCss$B;
18941
18941
 
18942
18942
  var CallingCode_1 = createCommonjsModule(function (module, exports) {
18943
18943
  Object.defineProperty(exports, "__esModule", { value: true });
@@ -37349,7 +37349,7 @@ function create(language) {
37349
37349
  }, language);
37350
37350
  }
37351
37351
 
37352
- const styleCss$z = ".sc-smoothly-checkbox-h{display:block}[hidden].sc-smoothly-checkbox-h{display:none}smoothly-icon.sc-smoothly-checkbox{cursor:pointer}smoothly-icon.sc-smoothly-checkbox:nth-child(2){position:absolute;transform:scaleX(0.6)}[disabled].sc-smoothly-checkbox-h smoothly-icon.sc-smoothly-checkbox{stroke:rgba(var(--smoothly-color-contrast), 0.3)}";
37352
+ const styleCss$A = ".sc-smoothly-checkbox-h{display:block}[hidden].sc-smoothly-checkbox-h{display:none}smoothly-icon.sc-smoothly-checkbox{cursor:pointer}smoothly-icon.sc-smoothly-checkbox:nth-child(2){position:absolute;transform:scaleX(0.6)}[disabled].sc-smoothly-checkbox-h smoothly-icon.sc-smoothly-checkbox{stroke:rgba(var(--smoothly-color-contrast), 0.3)}";
37353
37353
 
37354
37354
  let SmoothlyCheckbox = class {
37355
37355
  constructor(hostRef) {
@@ -37376,9 +37376,9 @@ let SmoothlyCheckbox = class {
37376
37376
  }
37377
37377
  get element() { return getElement(this); }
37378
37378
  };
37379
- SmoothlyCheckbox.style = styleCss$z;
37379
+ SmoothlyCheckbox.style = styleCss$A;
37380
37380
 
37381
- const styleCss$y = ".sc-smoothly-dialog-h{display:block;position:fixed;left:0;top:0;width:100%;height:100%;z-index:1;background:rgba(var(--smoothly-default-color), var(--smoothly-semitransparent)) !important}[hidden].sc-smoothly-dialog-h{display:none}.sc-smoothly-dialog-h>header.sc-smoothly-dialog{border-top-left-radius:8px;border-top-right-radius:8px;margin-top:2em;color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color));border-color:rgb(var(--smoothly-primary-color))}.sc-smoothly-dialog-h:not([header]) header.sc-smoothly-dialog{border:none}.sc-smoothly-dialog-h>*.sc-smoothly-dialog{position:relative;color:rgb(var(--smoothly-default-contrast));background-color:rgb(var(--smoothly-default-color));border-color:rgb(var(--smoothly-color));border-width:1px;border-style:solid;max-width:40em;width:calc(100vw - 4em - 2px);max-height:calc(100vh - 6em - 2px);height:auto;margin-left:auto;margin-right:auto;border-collapse:collapse}.sc-smoothly-dialog-h>main.sc-smoothly-dialog{border-bottom-left-radius:8px;border-bottom-right-radius:8px;margin-bottom:2em;border:1px solid rgb(var(--smoothly-default-contrast));box-sizing:border-box;overflow:hidden}.sc-smoothly-dialog-h:not([header]) main.sc-smoothly-dialog{border-radius:8px}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog{position:absolute;right:-2em;top:-2em;z-index:1;border-color:transparent}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog:hover{border-color:transparent}.sc-smoothly-dialog-h smoothly-icon.sc-smoothly-dialog{background-color:rgb(var(--smoothly-color));border-radius:50%}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>*.sc-smoothly-dialog{margin:10px}";
37381
+ const styleCss$z = ".sc-smoothly-dialog-h{display:block;position:fixed;left:0;top:0;width:100%;height:100%;z-index:1;background:rgba(var(--smoothly-default-color), var(--smoothly-semitransparent)) !important}[hidden].sc-smoothly-dialog-h{display:none}.sc-smoothly-dialog-h>header.sc-smoothly-dialog{border-top-left-radius:8px;border-top-right-radius:8px;margin-top:2em;color:rgb(var(--smoothly-primary-contrast));background:rgb(var(--smoothly-primary-color));border-color:rgb(var(--smoothly-primary-color))}.sc-smoothly-dialog-h:not([header]) header.sc-smoothly-dialog{border:none}.sc-smoothly-dialog-h>*.sc-smoothly-dialog{position:relative;color:rgb(var(--smoothly-default-contrast));background-color:rgb(var(--smoothly-default-color));border-color:rgb(var(--smoothly-color));border-width:1px;border-style:solid;max-width:40em;width:calc(100vw - 4em - 2px);max-height:calc(100vh - 6em - 2px);height:auto;margin-left:auto;margin-right:auto;border-collapse:collapse}.sc-smoothly-dialog-h>main.sc-smoothly-dialog{border-bottom-left-radius:8px;border-bottom-right-radius:8px;margin-bottom:2em;border:1px solid rgb(var(--smoothly-default-contrast));box-sizing:border-box;overflow:hidden}.sc-smoothly-dialog-h:not([header]) main.sc-smoothly-dialog{border-radius:8px}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog{position:absolute;right:-2em;top:-2em;z-index:1;border-color:transparent}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>smoothly-trigger.sc-smoothly-dialog:hover{border-color:transparent}.sc-smoothly-dialog-h smoothly-icon.sc-smoothly-dialog{background-color:rgb(var(--smoothly-color));border-radius:50%}.sc-smoothly-dialog-h>*.sc-smoothly-dialog>*.sc-smoothly-dialog{margin:10px}";
37382
37382
 
37383
37383
  let SmoothlyDialog = class {
37384
37384
  constructor(hostRef) {
@@ -37405,7 +37405,7 @@ let SmoothlyDialog = class {
37405
37405
  }
37406
37406
  render() { return h(Host, this.hostData(), this.__stencil_render()); }
37407
37407
  };
37408
- SmoothlyDialog.style = styleCss$y;
37408
+ SmoothlyDialog.style = styleCss$z;
37409
37409
 
37410
37410
  let SmoothlyDialogDemo = class {
37411
37411
  constructor(hostRef) {
@@ -38991,7 +38991,7 @@ Object.defineProperty(exports, "StateEditor", { enumerable: true, get: function
38991
38991
  //# sourceMappingURL=index.js.map
38992
38992
  });
38993
38993
 
38994
- const styleCss$x = ".sc-smoothly-display-h{display:block}[hidden].sc-smoothly-display-h{display:none}";
38994
+ const styleCss$y = ".sc-smoothly-display-h{display:block}[hidden].sc-smoothly-display-h{display:none}";
38995
38995
 
38996
38996
  let SmoothlyDisplay = class {
38997
38997
  constructor(hostRef) {
@@ -39020,9 +39020,9 @@ let SmoothlyDisplay = class {
39020
39020
  return result;
39021
39021
  }
39022
39022
  };
39023
- SmoothlyDisplay.style = styleCss$x;
39023
+ SmoothlyDisplay.style = styleCss$y;
39024
39024
 
39025
- const styleCss$w = ".sc-smoothly-display-amount-h{display:block}[hidden].sc-smoothly-display-amount-h{display:none}";
39025
+ const styleCss$x = ".sc-smoothly-display-amount-h{display:block}[hidden].sc-smoothly-display-amount-h{display:none}";
39026
39026
 
39027
39027
  let SmoothlyDisplayAmount = class {
39028
39028
  constructor(hostRef) {
@@ -39070,9 +39070,9 @@ let SmoothlyDisplayAmount = class {
39070
39070
  ];
39071
39071
  }
39072
39072
  };
39073
- SmoothlyDisplayAmount.style = styleCss$w;
39073
+ SmoothlyDisplayAmount.style = styleCss$x;
39074
39074
 
39075
- const styleCss$v = ".sc-smoothly-display-date-time-h{display:block}[hidden].sc-smoothly-display-date-time-h{display:none}";
39075
+ const styleCss$w = ".sc-smoothly-display-date-time-h{display:block}[hidden].sc-smoothly-display-date-time-h{display:none}";
39076
39076
 
39077
39077
  let SmoothlyDisplayDateTime = class {
39078
39078
  constructor(hostRef) {
@@ -39083,7 +39083,7 @@ let SmoothlyDisplayDateTime = class {
39083
39083
  return [datetime[0], " ", datetime[1]];
39084
39084
  }
39085
39085
  };
39086
- SmoothlyDisplayDateTime.style = styleCss$v;
39086
+ SmoothlyDisplayDateTime.style = styleCss$w;
39087
39087
 
39088
39088
  let SmoothlyDisplayDemo = class {
39089
39089
  constructor(hostRef) {
@@ -39096,12 +39096,12 @@ let SmoothlyDisplayDemo = class {
39096
39096
  }
39097
39097
  render() {
39098
39098
  return [
39099
- h("main", null, h("smoothly-popup", null, h("div", null, "Popup, click me"), h("div", { color: "dark", slot: "popup" }, "1 line popup")), h("smoothly-display-date-time", { datetime: "2019-08-15T08:08:17.65Z" }), h("dl", null, h("dt", null, "text"), h("dd", null, h("smoothly-display", { type: "text", value: "text" })), h("dt", null, "postal code"), h("dd", null, h("smoothly-display", { type: "postal-code", value: "752 31" })), h("dt", null, "password"), h("dd", null, h("smoothly-display", { type: "password", value: "password" })), h("dt", null, "email"), h("dd", null, h("smoothly-display", { type: "email", value: "test@example.com" })), h("dt", null, "price"), h("dd", null, h("smoothly-display", { type: "price", value: "13.37", currency: "SEK" })), h("dt", null, "percent"), h("dd", null, h("smoothly-display", { type: "percent", value: "42" })), h("dt", null, "phone"), h("dd", null, h("smoothly-display", { type: "phone", value: "0101881108" })), h("dt", null, "card number"), h("dd", null, h("smoothly-display", { type: "card-number", value: "4111111111111111" })), h("dt", null, "card expires"), h("dd", null, h("smoothly-display", { type: "card-expires", value: "7/22" })), h("dt", null, "card csc"), h("dd", null, h("smoothly-display", { type: "card-csc", value: "987" })), h("dt", null, "Quiet"), h("dd", null, h("smoothly-quiet", { color: "dark" }, "-"))), h("smoothly-urlencoded", { data: "hej=hopp&tjena=moss" }), h("div", { style: { display: "flex", justifyContent: "space-between" } }, h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup stuff that has a lot of text")), h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup with a bunch of text."))), h("p", null, "Test of diffrent kinds of notifier:"), h("button", { onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { onClick: () => this.noticeWarning(Notice.succeded("This is a test success notice.")) }, "success"), h("button", { onClick: () => this.noticeWarning(Notice.failed("This is a test danger notice.")) }, "danger"), h("button", { onClick: () => this.noticeWarning(Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), h("button", { onClick: () => this.noticeWarning(Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay"), h("div", { style: { position: "relative", height: "10em" } }, "Large Spinner", h("smoothly-spinner", { active: true, size: "large", style: { "--background-color": "255,255,255", "--background-opacity": "0.2", "--spinner-color": "0,130,0", } })), h("div", { style: { position: "relative", height: "10em" } }, "Medium Spinner", h("smoothly-spinner", { active: true, size: "medium" })), h("div", { style: { position: "relative", height: "10em" } }, "Small Spinner", h("smoothly-spinner", { active: true, size: "small" }))),
39099
+ h("main", null, h("smoothly-popup", null, h("div", null, "Popup, click me"), h("div", { color: "dark", slot: "popup" }, "1 line popup")), h("smoothly-display-date-time", { datetime: "2019-08-15T08:08:17.65Z" }), h("dl", null, h("dt", null, "text"), h("dd", null, h("smoothly-display", { type: "text", value: "text" })), h("dt", null, "postal code"), h("dd", null, h("smoothly-display", { type: "postal-code", value: "752 31" })), h("dt", null, "password"), h("dd", null, h("smoothly-display", { type: "password", value: "password" })), h("dt", null, "email"), h("dd", null, h("smoothly-display", { type: "email", value: "test@example.com" })), h("dt", null, "price"), h("dd", null, h("smoothly-display", { type: "price", value: "13.37", currency: "SEK" })), h("dt", null, "percent"), h("dd", null, h("smoothly-display", { type: "percent", value: "42" })), h("dt", null, "phone"), h("dd", null, h("smoothly-display", { type: "phone", value: "0101881108" })), h("dt", null, "card number"), h("dd", null, h("smoothly-display", { type: "card-number", value: "4111111111111111" })), h("dt", null, "card expires"), h("dd", null, h("smoothly-display", { type: "card-expires", value: "7/22" })), h("dt", null, "card csc"), h("dd", null, h("smoothly-display", { type: "card-csc", value: "987" })), h("dt", null, "Quiet"), h("dd", null, h("smoothly-quiet", { color: "dark" }, "-"))), h("smoothly-skeleton", { period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { period: 3, distance: "20rem", color: "200,200,255" }), h("smoothly-skeleton", { period: 3, distance: "20rem", color: "var(--smoothly-warning-color)" }), h("smoothly-skeleton", { period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "center", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem", width: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-skeleton", { align: "right", period: 3, distance: "20rem" }), h("smoothly-urlencoded", { data: "hej=hopp&tjena=moss" }), h("div", { style: { display: "flex", justifyContent: "space-between" } }, h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup stuff that has a lot of text")), h("smoothly-popup", { direction: "down" }, "Click for popup", h("span", { slot: "popup", color: "dark", style: { whiteSpace: "nowrap" } }, "Some popup with a bunch of text."))), h("p", null, "Test of diffrent kinds of notifier:"), h("button", { onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { onClick: () => this.noticeWarning(Notice.succeded("This is a test success notice.")) }, "success"), h("button", { onClick: () => this.noticeWarning(Notice.failed("This is a test danger notice.")) }, "danger"), h("button", { onClick: () => this.noticeWarning(Notice.execute("This is a test execute notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "execute"), h("button", { onClick: () => this.noticeWarning(Notice.delay("This is a test delay notice.", () => new Promise(resolve => window.setTimeout(() => resolve([true, "This went great"]), 3000)))) }, "delay"), h("div", { style: { position: "relative", height: "10em" } }, "Large Spinner", h("smoothly-spinner", { active: true, size: "large", style: { "--background-color": "255,255,255", "--background-opacity": "0.2", "--spinner-color": "0,130,0", } })), h("div", { style: { position: "relative", height: "10em" } }, "Medium Spinner", h("smoothly-spinner", { active: true, size: "medium" })), h("div", { style: { position: "relative", height: "10em" } }, "Small Spinner", h("smoothly-spinner", { active: true, size: "small" }))),
39100
39100
  ];
39101
39101
  }
39102
39102
  };
39103
39103
 
39104
- const styleCss$u = ".sc-smoothly-frame-h{display:block;width:100%;height:100%}[hidden].sc-smoothly-frame-h{display:none}.sc-smoothly-frame-h>iframe.sc-smoothly-frame{border:none;padding:none;margin:none}";
39104
+ const styleCss$v = ".sc-smoothly-frame-h{display:block;width:100%;height:100%}[hidden].sc-smoothly-frame-h{display:none}.sc-smoothly-frame-h>iframe.sc-smoothly-frame{border:none;padding:none;margin:none}";
39105
39105
 
39106
39106
  let SmoothlyFrame = class {
39107
39107
  constructor(hostRef) {
@@ -39140,9 +39140,9 @@ let SmoothlyFrame = class {
39140
39140
  }
39141
39141
  get element() { return getElement(this); }
39142
39142
  };
39143
- SmoothlyFrame.style = styleCss$u;
39143
+ SmoothlyFrame.style = styleCss$v;
39144
39144
 
39145
- const styleCss$t = "[size].sc-smoothly-icon-h{background:none}.sc-smoothly-icon-h{display:block}[hidden].sc-smoothly-icon-h{display:none}[size=tiny].sc-smoothly-icon-h{width:1.2em;height:1.2em}[size=small].sc-smoothly-icon-h{width:1.4em;height:1.4em}[size=medium].sc-smoothly-icon-h{width:1.8em;height:1.8em}[size=large].sc-smoothly-icon-h{width:2.8em;height:2.8em}[size=xlarge].sc-smoothly-icon-h{width:4em;height:4em}";
39145
+ const styleCss$u = "[size].sc-smoothly-icon-h{background:none}.sc-smoothly-icon-h{display:block}[hidden].sc-smoothly-icon-h{display:none}[size=tiny].sc-smoothly-icon-h{width:1.2em;height:1.2em}[size=small].sc-smoothly-icon-h{width:1.4em;height:1.4em}[size=medium].sc-smoothly-icon-h{width:1.8em;height:1.8em}[size=large].sc-smoothly-icon-h{width:2.8em;height:2.8em}[size=xlarge].sc-smoothly-icon-h{width:4em;height:4em}";
39146
39146
 
39147
39147
  let SmoothlyIcon = class {
39148
39148
  constructor(hostRef) {
@@ -39185,9 +39185,9 @@ let SmoothlyIcon = class {
39185
39185
  render() { return h(Host, this.hostData(), this.__stencil_render()); }
39186
39186
  };
39187
39187
  SmoothlyIcon.cache = {};
39188
- SmoothlyIcon.style = styleCss$t;
39188
+ SmoothlyIcon.style = styleCss$u;
39189
39189
 
39190
- const styleCss$s = "icon-demo.sc-smoothly-icon-demo{display:block}icon-demo[hidden].sc-smoothly-icon-demo{display:none}icon-demo.sc-smoothly-icon-demo>content.sc-smoothly-icon-demo{display:flex;flex-flow:row wrap}icon-demo.sc-smoothly-icon-demo>content.sc-smoothly-icon-demo>*.sc-smoothly-icon-demo{margin:1cm}";
39190
+ const styleCss$t = "icon-demo.sc-smoothly-icon-demo{display:block}icon-demo[hidden].sc-smoothly-icon-demo{display:none}icon-demo.sc-smoothly-icon-demo>content.sc-smoothly-icon-demo{display:flex;flex-flow:row wrap}icon-demo.sc-smoothly-icon-demo>content.sc-smoothly-icon-demo>*.sc-smoothly-icon-demo{margin:1cm}";
39191
39191
 
39192
39192
  let SmoothlyIconDemo = class {
39193
39193
  constructor(hostRef) {
@@ -39669,9 +39669,9 @@ let SmoothlyIconDemo = class {
39669
39669
  ];
39670
39670
  }
39671
39671
  };
39672
- SmoothlyIconDemo.style = styleCss$s;
39672
+ SmoothlyIconDemo.style = styleCss$t;
39673
39673
 
39674
- const styleCss$r = ".sc-smoothly-input-h{display:block;position:relative;font-weight:var(--smoothly-font-weight);padding:var(--padding);overflow:hidden;background-color:rgb(var(--background-color));color:rgb(var(--text-color, var(--smoothly-default-contrast)))}[hidden].sc-smoothly-input-h{display:none}.sc-smoothly-input-h>div.sc-smoothly-input{position:relative;width:100%;height:100%}label.sc-smoothly-input{position:absolute;left:0.4em;top:0.6em;color:rgb(var(--text-color, var(--smoothly-default-contrast)));opacity:0.8;user-select:none;cursor:inherit;transition:transform 0.1s;transform-origin:top left;transition-timing-function:ease}.sc-smoothly-input-h:not([show-label]) label.sc-smoothly-input{display:none}.sc-smoothly-input-h:not([show-label]) input.sc-smoothly-input{padding:0.6em 0.2em 0.6em 0.2em}input.sc-smoothly-input{padding:1em 0.2em 0.2em 0.2em;box-sizing:border-box;width:100%;height:100%;background:none;border:0;z-index:1;position:relative;font-size:1rem;font-family:var(--smoothly-font-family);background-color:rgb(var(--background-color))}smoothly-icon.sc-smoothly-input{display:none;position:absolute;right:0.2em;top:0.6em}input.sc-smoothly-input:invalid+label.sc-smoothly-input+smoothly-icon.sc-smoothly-input{display:block}.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input{z-index:1;pointer-events:none}.has-value.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input,.sc-smoothly-input-h:focus-within>div.sc-smoothly-input>label.sc-smoothly-input{top:0.4em;transform:scale(0.6)}input.sc-smoothly-input:focus{outline:none}input.sc-smoothly-input:-webkit-autofill,input.sc-smoothly-input:-webkit-autofill:hover,input.sc-smoothly-input:-webkit-autofill:focus,input.sc-smoothly-input:-webkit-autofill:active{box-shadow:0 0 0 40em rgb(var(--background-color)) inset;-webkit-box-shadow:0 0 0 40em rgb(var(--background-color)) inset}input.sc-smoothly-input:-webkit-autofill,input.sc-smoothly-input:-webkit-autofill+label.sc-smoothly-input{-webkit-text-fill-color:rgb(var(--text-color, var(--smoothly-default-contrast)))}";
39674
+ const styleCss$s = ".sc-smoothly-input-h{display:block;position:relative;font-weight:var(--smoothly-font-weight);padding:var(--padding);overflow:hidden;background-color:rgb(var(--background-color));color:rgb(var(--text-color, var(--smoothly-default-contrast)))}[hidden].sc-smoothly-input-h{display:none}.sc-smoothly-input-h>div.sc-smoothly-input{position:relative;width:100%;height:100%}label.sc-smoothly-input{position:absolute;left:0.4em;top:0.6em;color:rgb(var(--text-color, var(--smoothly-default-contrast)));opacity:0.8;user-select:none;cursor:inherit;transition:transform 0.1s;transform-origin:top left;transition-timing-function:ease}.sc-smoothly-input-h:not([show-label]) label.sc-smoothly-input{display:none}.sc-smoothly-input-h:not([show-label]) input.sc-smoothly-input{padding:0.6em 0.2em 0.6em 0.2em}input.sc-smoothly-input{padding:1em 0.2em 0.2em 0.2em;box-sizing:border-box;width:100%;height:100%;background:none;border:0;z-index:1;position:relative;font-size:1rem;font-family:var(--smoothly-font-family);background-color:rgb(var(--background-color))}smoothly-icon.sc-smoothly-input{display:none;position:absolute;right:0.2em;top:0.6em}input.sc-smoothly-input:invalid+label.sc-smoothly-input+smoothly-icon.sc-smoothly-input{display:block}.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input{z-index:1;pointer-events:none}.has-value.sc-smoothly-input-h>div.sc-smoothly-input>label.sc-smoothly-input,.sc-smoothly-input-h:focus-within>div.sc-smoothly-input>label.sc-smoothly-input{top:0.4em;transform:scale(0.6)}input.sc-smoothly-input:focus{outline:none}input.sc-smoothly-input:-webkit-autofill,input.sc-smoothly-input:-webkit-autofill:hover,input.sc-smoothly-input:-webkit-autofill:focus,input.sc-smoothly-input:-webkit-autofill:active{box-shadow:0 0 0 40em rgb(var(--background-color)) inset;-webkit-box-shadow:0 0 0 40em rgb(var(--background-color)) inset}input.sc-smoothly-input:-webkit-autofill,input.sc-smoothly-input:-webkit-autofill+label.sc-smoothly-input{-webkit-text-fill-color:rgb(var(--text-color, var(--smoothly-default-contrast)))}";
39675
39675
 
39676
39676
  let SmoothlyInput = class {
39677
39677
  constructor(hostRef) {
@@ -39861,9 +39861,9 @@ function getLocale() {
39861
39861
  const result = navigator.language;
39862
39862
  return dist$3.Locale.is(result) ? result : dist$3.Language.is(result) ? dist$3.Locale.toLocale(result) : undefined;
39863
39863
  }
39864
- SmoothlyInput.style = styleCss$r;
39864
+ SmoothlyInput.style = styleCss$s;
39865
39865
 
39866
- const styleCss$q = ".sc-smoothly-input-date-h{position:relative}nav.sc-smoothly-input-date{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-h>div.sc-smoothly-input-date{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date>.arrow.sc-smoothly-input-date{position:absolute;z-index:9;transform:translate(2em, -.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}";
39866
+ const styleCss$r = ".sc-smoothly-input-date-h{position:relative}nav.sc-smoothly-input-date{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-h>div.sc-smoothly-input-date{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-h>nav.sc-smoothly-input-date>.arrow.sc-smoothly-input-date{position:absolute;z-index:9;transform:translate(2em, -.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}";
39867
39867
 
39868
39868
  let InputDate = class {
39869
39869
  constructor(hostRef) {
@@ -39880,21 +39880,25 @@ let InputDate = class {
39880
39880
  render() {
39881
39881
  var _a;
39882
39882
  return [
39883
- h("smoothly-input", { onClick: () => (this.open = !this.open), type: "date", value: this.value, onSmoothlyChanged: e => (this.value = e.detail.value) }, h("slot", null)),
39884
- this.open ? h("div", { onClick: () => (this.open = false) }) : [],
39885
- this.open ? (h("nav", null, h("div", { class: "arrow" }), h("smoothly-calendar", { doubleInput: false, value: (_a = this.value) !== null && _a !== void 0 ? _a : dist$3.Date.now(), onValueChanged: event => {
39886
- this.value = event.detail;
39887
- event.stopPropagation();
39888
- }, max: this.max, min: this.min }))) : ([]),
39883
+ h("smoothly-input", { onClick: () => (this.open = !this.open), disabled: this.disabled, type: "date", value: this.value, onSmoothlyChanged: e => (this.value = e.detail.value) }, h("slot", null)),
39884
+ this.open && !this.disabled
39885
+ ? [
39886
+ h("div", { onClick: () => (this.open = false) }),
39887
+ h("nav", null, h("div", { class: "arrow" }), h("smoothly-calendar", { doubleInput: false, value: (_a = this.value) !== null && _a !== void 0 ? _a : dist$3.Date.now(), onValueChanged: event => {
39888
+ this.value = event.detail;
39889
+ event.stopPropagation();
39890
+ }, max: this.max, min: this.min })),
39891
+ ]
39892
+ : [],
39889
39893
  ];
39890
39894
  }
39891
39895
  static get watchers() { return {
39892
39896
  "value": ["onStart"]
39893
39897
  }; }
39894
39898
  };
39895
- InputDate.style = styleCss$q;
39899
+ InputDate.style = styleCss$r;
39896
39900
 
39897
- const styleCss$p = ".sc-smoothly-input-date-range-h{position:relative;display:block}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-range-h>div.sc-smoothly-input-date-range{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range>.arrow.sc-smoothly-input-date-range{position:absolute;z-index:9;transform:translate(10em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range{display:flex}smoothly-input.sc-smoothly-input-date-range{border-radius:var(--border-radius, none);background-color:var(--background, transparent);width:var(--input-width)}span.sc-smoothly-input-date-range{padding:0.5em 0.2em 0.5em 0.2em;align-self:center}";
39901
+ const styleCss$q = ".sc-smoothly-input-date-range-h{position:relative;display:block;width:fit-content}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range{position:absolute;z-index:10;top:3.5em;background-color:rgb(var(--smoothly-default-shade));max-width:22em}.sc-smoothly-input-date-range-h>div.sc-smoothly-input-date-range{position:fixed;top:0px;left:0px;right:0px;bottom:0px;width:100vw;height:100vh;z-index:2}.sc-smoothly-input-date-range-h>nav.sc-smoothly-input-date-range>.arrow.sc-smoothly-input-date-range{position:absolute;z-index:9;transform:translate(10em, -0.55em) rotate(45deg);width:1em;height:1em;background-color:rgb(var(--smoothly-default-shade))}.sc-smoothly-input-date-range-h>section.sc-smoothly-input-date-range{display:flex;background-color:var(--background, transparent);border-radius:0.25rem;cursor:pointer}smoothly-input.sc-smoothly-input-date-range{border-radius:var(--border-radius, none);background-color:transparent;width:var(--input-width)}span.sc-smoothly-input-date-range{padding:0.5em 0.2em 0.5em 0.2em;align-self:center}";
39898
39902
 
39899
39903
  let InputDateRange = class {
39900
39904
  constructor(hostRef) {
@@ -39921,7 +39925,7 @@ let InputDateRange = class {
39921
39925
  render() {
39922
39926
  var _a;
39923
39927
  return [
39924
- h("section", null, h("smoothly-input", { onClick: () => (this.open = !this.open), type: "date", value: this.start, showLabel: this.showLabel, onSmoothlyChanged: e => (this.start = e.detail.value) }, "from"), h("span", null, "\u2013"), h("smoothly-input", { onClick: () => (this.open = !this.open), type: "date", showLabel: this.showLabel, value: this.end, onSmoothlyChanged: e => (this.end = e.detail.value) }, "to")),
39928
+ h("section", { onClick: () => (this.open = !this.open) }, h("smoothly-input", { type: "date", value: this.start, showLabel: this.showLabel, onSmoothlyChanged: e => (this.start = e.detail.value) }, "from"), h("span", null, "\u2013"), h("smoothly-input", { type: "date", showLabel: this.showLabel, value: this.end, onSmoothlyChanged: e => (this.end = e.detail.value) }, "to")),
39925
39929
  this.open ? h("div", { onClick: () => (this.open = false) }) : [],
39926
39930
  this.open ? (h("nav", null, h("div", { class: "arrow" }), h("smoothly-calendar", { doubleInput: true, value: (_a = this.value) !== null && _a !== void 0 ? _a : dist$3.Date.now(), onValueChanged: event => {
39927
39931
  this.value = event.detail;
@@ -39933,7 +39937,7 @@ let InputDateRange = class {
39933
39937
  "value": ["onValue"]
39934
39938
  }; }
39935
39939
  };
39936
- InputDateRange.style = styleCss$p;
39940
+ InputDateRange.style = styleCss$q;
39937
39941
 
39938
39942
  let SmoothlyInputDemo = class {
39939
39943
  constructor(hostRef) {
@@ -39947,7 +39951,7 @@ let SmoothlyInputDemo = class {
39947
39951
  }
39948
39952
  };
39949
39953
 
39950
- const styleCss$o = ".sc-smoothly-input-month-h{display:flex;justify-content:space-between;font-size:large}smoothly-icon.sc-smoothly-input-month{font-size:smaller}";
39954
+ const styleCss$p = ".sc-smoothly-input-month-h{display:flex;justify-content:space-between;font-size:large}smoothly-icon.sc-smoothly-input-month{font-size:smaller}";
39951
39955
 
39952
39956
  let MonthSelector = class {
39953
39957
  constructor(hostRef) {
@@ -39976,9 +39980,9 @@ let MonthSelector = class {
39976
39980
  "value": ["onValueChanged"]
39977
39981
  }; }
39978
39982
  };
39979
- MonthSelector.style = styleCss$o;
39983
+ MonthSelector.style = styleCss$p;
39980
39984
 
39981
- const styleCss$n = "[selected].sc-smoothly-item-h{background-color:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-item-h{padding:.5em;cursor:pointer;background-color:rgb(var(--smoothly-default-shade));color:rgb(var(--smoothly-default-contrast));border:rgb(var(--smoothly-default-shade) solid 1px)}.sc-smoothly-item-h:hover{background-color:rgb(var(--smoothly-primary-color));color:rgb(var(--smoothly-primary-contrast))}";
39985
+ const styleCss$o = "[selected].sc-smoothly-item-h{background-color:rgb(var(--smoothly-primary-shade));color:rgb(var(--smoothly-primary-contrast))}.sc-smoothly-item-h{padding:.5em;cursor:pointer;background-color:rgb(var(--smoothly-default-shade));color:rgb(var(--smoothly-default-contrast));border:rgb(var(--smoothly-default-shade) solid 1px)}.sc-smoothly-item-h:hover{background-color:rgb(var(--smoothly-primary-color));color:rgb(var(--smoothly-primary-contrast))}";
39982
39986
 
39983
39987
  let Item = class {
39984
39988
  constructor(hostRef) {
@@ -40012,9 +40016,9 @@ let Item = class {
40012
40016
  "selected": ["onSelectedChanged"]
40013
40017
  }; }
40014
40018
  };
40015
- Item.style = styleCss$n;
40019
+ Item.style = styleCss$o;
40016
40020
 
40017
- const styleCss$m = ":host{max-height:300px;width:85%;max-height:var(--max-menu-height);box-sizing:border-box;background-color:rgb(var(--smoothly-default-color));border-radius:0.25em;color:rgb(var(--smoothly-primary-color));stroke:rgb(var(--smoothly-primary-color));fill:rgb(var(--smoothly-primary-color));box-shadow:0px 2px 24px rgba(64, 60, 57, 0.08), inset 0px 0px 1px rgba(64, 60, 57, 0.4);overflow-y:auto;cursor:pointer}:host:first-child{margin:10em}";
40021
+ const styleCss$n = ":host{max-height:300px;width:85%;max-height:var(--max-menu-height);box-sizing:border-box;background-color:rgb(var(--smoothly-default-color));border-radius:0.25em;color:rgb(var(--smoothly-primary-color));stroke:rgb(var(--smoothly-primary-color));fill:rgb(var(--smoothly-primary-color));box-shadow:0px 2px 24px rgba(64, 60, 57, 0.08), inset 0px 0px 1px rgba(64, 60, 57, 0.4);overflow-y:auto;cursor:pointer}:host:first-child{margin:10em}";
40018
40022
 
40019
40023
  let SmoothlyMenuOptions = class {
40020
40024
  constructor(hostRef) {
@@ -40113,9 +40117,9 @@ let SmoothlyMenuOptions = class {
40113
40117
  "options": ["optionsChangeHandler"]
40114
40118
  }; }
40115
40119
  };
40116
- SmoothlyMenuOptions.style = styleCss$m;
40120
+ SmoothlyMenuOptions.style = styleCss$n;
40117
40121
 
40118
- const styleCss$l = ".sc-smoothly-notification-h{display:block;min-width:32.6%;min-height:3em;border-radius:5px;margin:0.5em}[hidden].sc-smoothly-notification-h{display:none}smoothly-trigger.sc-smoothly-notification{float:right;text-align:right;margin-right:0.2em}";
40122
+ const styleCss$m = ".sc-smoothly-notification-h{display:block;min-width:32.6%;min-height:3em;border-radius:5px;margin:0.5em}[hidden].sc-smoothly-notification-h{display:none}smoothly-trigger.sc-smoothly-notification{float:right;text-align:right;margin-right:0.2em}";
40119
40123
 
40120
40124
  let Notification = class {
40121
40125
  constructor(hostRef) {
@@ -40173,9 +40177,9 @@ let Notification = class {
40173
40177
  "notice": ["onUpdatedNotice"]
40174
40178
  }; }
40175
40179
  };
40176
- Notification.style = styleCss$l;
40180
+ Notification.style = styleCss$m;
40177
40181
 
40178
- const styleCss$k = ".sc-smoothly-notifier-h{display:block}[hidden].sc-smoothly-notifier-h{display:none}.sc-smoothly-notifier-h>aside.sc-smoothly-notifier{display:flex;flex-wrap:wrap-reverse;align-content:stretch;justify-content:flex-start;position:fixed;bottom:3em;left:0;text-align:center;width:100%;z-index:3}";
40182
+ const styleCss$l = ".sc-smoothly-notifier-h{display:block}[hidden].sc-smoothly-notifier-h{display:none}.sc-smoothly-notifier-h>aside.sc-smoothly-notifier{display:flex;flex-wrap:wrap-reverse;align-content:stretch;justify-content:flex-start;position:fixed;bottom:3em;left:0;text-align:center;width:100%;z-index:3}";
40179
40183
 
40180
40184
  let Notifier = class {
40181
40185
  constructor(hostRef) {
@@ -40195,9 +40199,9 @@ let Notifier = class {
40195
40199
  ];
40196
40200
  }
40197
40201
  };
40198
- Notifier.style = styleCss$k;
40202
+ Notifier.style = styleCss$l;
40199
40203
 
40200
- const styleCss$j = ":host{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;padding:0.7em 1em;margin-left:1px;margin-right:1px;background-color:transparent;position:relative}:host([data-highlight]){background-color:rgb(var(--smoothly-default-shade))}:host>div.middle{padding-left:0.5em;flex-shrink:1;width:100%}:host([divider]){margin-bottom:0.5em}::slotted([slot=right]){font-style:italic;white-space:nowrap}:host([divider])::after{position:absolute;height:1px;width:100%;left:0;bottom:-0.25em;content:\"\";background-color:rgba(var(--smoothly-dark-color))}";
40204
+ const styleCss$k = ":host{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;padding:0.7em 1em;margin-left:1px;margin-right:1px;background-color:transparent;position:relative}:host([data-highlight]){background-color:rgb(var(--smoothly-default-shade))}:host>div.middle{padding-left:0.5em;flex-shrink:1;width:100%}:host([divider]){margin-bottom:0.5em}::slotted([slot=right]){font-style:italic;white-space:nowrap}:host([divider])::after{position:absolute;height:1px;width:100%;left:0;bottom:-0.25em;content:\"\";background-color:rgba(var(--smoothly-dark-color))}";
40201
40205
 
40202
40206
  let SmoothlyOption = class {
40203
40207
  constructor(hostRef) {
@@ -40221,9 +40225,9 @@ let SmoothlyOption = class {
40221
40225
  }
40222
40226
  get element() { return getElement(this); }
40223
40227
  };
40224
- SmoothlyOption.style = styleCss$j;
40228
+ SmoothlyOption.style = styleCss$k;
40225
40229
 
40226
- const styleCss$i = ":host{--background-color:var(--smoothly-default-color), 1;--color:var(--smoothly-secondary-contrast);--border-color:var(--smoothly-default-shade), 1;--border-highlight-color:var(--smoothly-secondary-contrast), 1;--label-color:var(--smoothly-secondary-contrast), 0.8;--selected-item-border-radius:0.25rem;--selected-item-background-color:var(--smoothly-secondary-color), 1;--selected-item-color:255, 255, 255, 1}:host{display:block;position:relative;background-color:rgba(var(--background-color));width:100%;cursor:pointer;--intergiro-transition:border-color 200ms cubic-bezier(0.645, 0.045, 0.355, 1);transition:var(--intergiro-transition);border:1px solid rgb(var(--border-color));margin:1px;height:40px;border-radius:0.25rem}:host(:focus-within){border-color:rgb(var(--smoothly-primary-shade));border-width:2px;margin:0px}:host>div{display:flex;background-color:transparent;min-height:40px;align-items:center;align-self:center;border:none;max-height:var(--max-height)}:host>div .icons>smoothly-icon{flex-shrink:0;padding-left:0.6em;stroke:rgba(var(--color), 0.4);fill:rgba(var(--color), 0.4);width:1.5em !important;height:1.5em !important}:host>div .icons>smoothly-icon:hover{fill:rgba(var(--color), 1)}:host>div input{width:100%;background-color:transparent;outline:none;border:none;cursor:pointer;color:rgb(var(--color));padding:0 0.6em;font-family:var(--smoothly-font-family);font-size:1.05em}:host>div input::placeholder{opacity:1;text-overflow:ellipsis}:host([is-open])>div input{color:rgb(var(--smoothly-medium-color))}:host(:not(:focus-within)[multiple]) ul>li:last-child{position:absolute;pointer-events:none}:host([label=\"\"]) ul,:host:not([label]) ul,:host([label-setting=hide]) ul{padding-top:0.1em;padding-bottom:0.1em}label{padding-left:0.6em;white-space:nowrap;color:rgba(var(--label-color));transition:var(--intergiro-transition);font-family:var(--smoothly-font-family);pointer-events:none;transform-origin:left}:host([has-selection]) label{display:var(--label-display)}:host([has-selection]) label,:host(:focus-within) label{display:none}:host(:hover) smoothly-icon[data-arrow],:host(:focus-within) smoothly-icon[data-arrow]{stroke:rgba(var(--color), 1)}:host smoothly-icon[data-arrow]{pointer-events:none}:host smoothly-icon{flex-shrink:0;width:1em;height:1em}:host(:not([is-open])) smoothly-icon.up,:host([is-open]) smoothly-icon.down{display:none}smoothly-icon.search{display:flex;align-self:center;padding-left:0.8em}smoothly-icon.up,smoothly-icon.down{display:flex;align-self:center;padding-right:0.8em;stroke:rgb(var(--smoothly-primary-shade))}:host smoothly-menu-options{margin-top:0.5em;padding-top:0.5em;padding-bottom:0.5em;position:absolute;z-index:1}:host(:not([is-open]))>smoothly-menu-options{display:none}";
40230
+ const styleCss$j = ":host{--background-color:var(--smoothly-default-color), 1;--color:var(--smoothly-secondary-contrast);--border-color:var(--smoothly-default-shade), 1;--border-highlight-color:var(--smoothly-secondary-contrast), 1;--label-color:var(--smoothly-secondary-contrast), 0.8;--selected-item-border-radius:0.25rem;--selected-item-background-color:var(--smoothly-secondary-color), 1;--selected-item-color:255, 255, 255, 1}:host{display:block;position:relative;background-color:rgba(var(--background-color));width:100%;cursor:pointer;--intergiro-transition:border-color 200ms cubic-bezier(0.645, 0.045, 0.355, 1);transition:var(--intergiro-transition);border:1px solid rgb(var(--border-color));margin:1px;height:40px;border-radius:0.25rem}:host(:focus-within){border-color:rgb(var(--smoothly-primary-shade));border-width:2px;margin:0px}:host>div{display:flex;background-color:transparent;min-height:40px;align-items:center;align-self:center;border:none;max-height:var(--max-height)}:host>div .icons>smoothly-icon{flex-shrink:0;padding-left:0.6em;stroke:rgba(var(--color), 0.4);fill:rgba(var(--color), 0.4);width:1.5em !important;height:1.5em !important}:host>div .icons>smoothly-icon:hover{fill:rgba(var(--color), 1)}:host>div input{width:100%;background-color:transparent;outline:none;border:none;cursor:pointer;color:rgb(var(--color));padding:0 0.6em;font-family:var(--smoothly-font-family);font-size:1.05em}:host>div input::placeholder{opacity:1;text-overflow:ellipsis}:host([is-open])>div input{color:rgb(var(--smoothly-medium-color))}:host(:not(:focus-within)[multiple]) ul>li:last-child{position:absolute;pointer-events:none}:host([label=\"\"]) ul,:host:not([label]) ul,:host([label-setting=hide]) ul{padding-top:0.1em;padding-bottom:0.1em}label{padding-left:0.6em;white-space:nowrap;color:rgba(var(--label-color));transition:var(--intergiro-transition);font-family:var(--smoothly-font-family);pointer-events:none;transform-origin:left}:host([has-selection]) label{display:var(--label-display)}:host([has-selection]) label,:host(:focus-within) label{display:none}:host(:hover) smoothly-icon[data-arrow],:host(:focus-within) smoothly-icon[data-arrow]{stroke:rgba(var(--color), 1)}:host smoothly-icon[data-arrow]{pointer-events:none}:host smoothly-icon{flex-shrink:0;width:1em;height:1em}:host(:not([is-open])) smoothly-icon.up,:host([is-open]) smoothly-icon.down{display:none}smoothly-icon.search{display:flex;align-self:center;padding-left:0.8em}smoothly-icon.up,smoothly-icon.down{display:flex;align-self:center;padding-right:0.8em;stroke:rgb(var(--smoothly-primary-shade))}:host smoothly-menu-options{margin-top:0.5em;padding-top:0.5em;padding-bottom:0.5em;position:absolute;z-index:1}:host(:not([is-open]))>smoothly-menu-options{display:none}";
40227
40231
 
40228
40232
  let SmoothlyPicker = class {
40229
40233
  constructor(hostRef) {
@@ -40365,9 +40369,9 @@ let SmoothlyPicker = class {
40365
40369
  "isOpen": ["isOpenChangeHander"]
40366
40370
  }; }
40367
40371
  };
40368
- SmoothlyPicker.style = styleCss$i;
40372
+ SmoothlyPicker.style = styleCss$j;
40369
40373
 
40370
- const styleCss$h = ".sc-smoothly-popup-h{display:inline-flex;position:relative}[hidden].sc-smoothly-popup-h{display:none}.sc-smoothly-popup-h:not([visible]) aside.sc-smoothly-popup{display:none}.sc-smoothly-popup-h aside.sc-smoothly-popup{display:inline;position:absolute;padding:0.3em;left:var(--left);right:var(--right);background-color:rgb(238, 238, 238);border-color:rgb(238, 238, 238);border-style:solid;border-width:0.1em;border-radius:0.6em;z-index:3}[direction=down].sc-smoothly-popup-h aside.sc-smoothly-popup{top:2.2em;box-shadow:6px 5px 9px -9px black, 5px 6px 9px -9px black}[direction=up].sc-smoothly-popup-h aside.sc-smoothly-popup{bottom:2.2em;box-shadow:-6px -5px 9px -9px black, -5px -6px 9px -9px black}.sc-smoothly-popup-h:not([visible]) .background.sc-smoothly-popup{display:none}.sc-smoothly-popup-h .background.sc-smoothly-popup{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2}.sc-smoothly-popup-h:not([visible]) .arrow.sc-smoothly-popup{display:none}.sc-smoothly-popup-h .arrow.sc-smoothly-popup{background-color:rgb(238, 238, 238);border-color:rgb(238, 238, 238);z-index:2;content:\"\";position:absolute;width:12px;height:12px;transform:rotate(45deg);left:calc(var(--left) + 1em);right:calc(var(--right) + 1em)}[direction=down].sc-smoothly-popup-h .arrow.sc-smoothly-popup{top:2em;border-top-style:solid;border-top-width:1px;border-left-style:solid;border-left-width:1px}[direction=up].sc-smoothly-popup-h .arrow.sc-smoothly-popup{bottom:2em;border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px}.sc-smoothly-popup-h .pointer.sc-smoothly-popup{cursor:pointer}";
40374
+ const styleCss$i = ".sc-smoothly-popup-h{display:inline-flex;position:relative}[hidden].sc-smoothly-popup-h{display:none}.sc-smoothly-popup-h:not([visible]) aside.sc-smoothly-popup{display:none}.sc-smoothly-popup-h aside.sc-smoothly-popup{display:inline;position:absolute;padding:0.3em;left:var(--left);right:var(--right);background-color:rgb(238, 238, 238);border-color:rgb(238, 238, 238);border-style:solid;border-width:0.1em;border-radius:0.6em;z-index:3}[direction=down].sc-smoothly-popup-h aside.sc-smoothly-popup{top:2.2em;box-shadow:6px 5px 9px -9px black, 5px 6px 9px -9px black}[direction=up].sc-smoothly-popup-h aside.sc-smoothly-popup{bottom:2.2em;box-shadow:-6px -5px 9px -9px black, -5px -6px 9px -9px black}.sc-smoothly-popup-h:not([visible]) .background.sc-smoothly-popup{display:none}.sc-smoothly-popup-h .background.sc-smoothly-popup{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2}.sc-smoothly-popup-h:not([visible]) .arrow.sc-smoothly-popup{display:none}.sc-smoothly-popup-h .arrow.sc-smoothly-popup{background-color:rgb(238, 238, 238);border-color:rgb(238, 238, 238);z-index:2;content:\"\";position:absolute;width:12px;height:12px;transform:rotate(45deg);left:calc(var(--left) + 1em);right:calc(var(--right) + 1em)}[direction=down].sc-smoothly-popup-h .arrow.sc-smoothly-popup{top:2em;border-top-style:solid;border-top-width:1px;border-left-style:solid;border-left-width:1px}[direction=up].sc-smoothly-popup-h .arrow.sc-smoothly-popup{bottom:2em;border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px}.sc-smoothly-popup-h .pointer.sc-smoothly-popup{cursor:pointer}";
40371
40375
 
40372
40376
  let SmoothlyPopup = class {
40373
40377
  constructor(hostRef) {
@@ -40396,9 +40400,9 @@ let SmoothlyPopup = class {
40396
40400
  return (h(Host, { style: Object.assign({}, this.cssVariables) }, h("content", { class: "pointer", onClick: () => this.onClick() }, h("slot", null)), h("div", { class: "background", onClick: () => this.onClick() }), h("div", { class: "arrow", onClick: () => this.onClick() }), h("aside", { ref: el => (this.aside = el) }, h("slot", { name: "popup" }))));
40397
40401
  }
40398
40402
  };
40399
- SmoothlyPopup.style = styleCss$h;
40403
+ SmoothlyPopup.style = styleCss$i;
40400
40404
 
40401
- const styleCss$g = ".sc-smoothly-quiet-h{opacity:0.5}";
40405
+ const styleCss$h = ".sc-smoothly-quiet-h{opacity:0.5}";
40402
40406
 
40403
40407
  let SmoothlyQuiet = class {
40404
40408
  constructor(hostRef) {
@@ -40408,9 +40412,9 @@ let SmoothlyQuiet = class {
40408
40412
  return (h(Host, { color: this.color }, h("slot", null)));
40409
40413
  }
40410
40414
  };
40411
- SmoothlyQuiet.style = styleCss$g;
40415
+ SmoothlyQuiet.style = styleCss$h;
40412
40416
 
40413
- const styleCss$f = ".sc-smoothly-radio-h{display:block;position:relative}[hidden].sc-smoothly-radio-h{display:none}label.sc-smoothly-radio{display:block;width:calc(100% - 2 * 0.4em);padding:0.2em 0.4em 0.2em 0.4em}input[type=radio].sc-smoothly-radio{position:absolute;left:0;top:0;width:calc(100%);height:100%;margin:0;appearance:none;-webkit-appearance:none}input[type=radio].sc-smoothly-radio~label.sc-smoothly-radio{border:1px solid rgb(var(--smoothly-default-color));color:rgba(var(--smoothly-default-contrast), 0.5);background:rgb(var(--smoothly-default-color))}input[type=radio].sc-smoothly-radio:checked~label.sc-smoothly-radio{background-color:rgb(var(--smoothly-default-shade));color:rgb(var(--smoothly-default-contrast))}";
40417
+ const styleCss$g = ".sc-smoothly-radio-h{display:block;position:relative}[hidden].sc-smoothly-radio-h{display:none}label.sc-smoothly-radio{display:block;width:calc(100% - 2 * 0.4em);padding:0.2em 0.4em 0.2em 0.4em}input[type=radio].sc-smoothly-radio{position:absolute;left:0;top:0;width:calc(100%);height:100%;margin:0;appearance:none;-webkit-appearance:none}input[type=radio].sc-smoothly-radio~label.sc-smoothly-radio{border:1px solid rgb(var(--smoothly-default-color));color:rgba(var(--smoothly-default-contrast), 0.5);background:rgb(var(--smoothly-default-color))}input[type=radio].sc-smoothly-radio:checked~label.sc-smoothly-radio{background-color:rgb(var(--smoothly-default-shade));color:rgb(var(--smoothly-default-contrast))}";
40414
40418
 
40415
40419
  let SmoothlyRadio = class {
40416
40420
  constructor(hostRef) {
@@ -40429,7 +40433,7 @@ let SmoothlyRadio = class {
40429
40433
  ];
40430
40434
  }
40431
40435
  };
40432
- SmoothlyRadio.style = styleCss$f;
40436
+ SmoothlyRadio.style = styleCss$g;
40433
40437
 
40434
40438
  let SmoothlyRoom = class {
40435
40439
  constructor(hostRef) {
@@ -40440,7 +40444,7 @@ let SmoothlyRoom = class {
40440
40444
  }
40441
40445
  };
40442
40446
 
40443
- const styleCss$e = ".sc-smoothly-select-h{display:block}[hidden].sc-smoothly-select-h{display:none}select.sc-smoothly-select{min-width:1.5em;padding-top:0.5em;border:none;-webkit-appearance:none;background-color:rgb(var(--smoothly-color));padding:0.3em}select.sc-smoothly-select>option.sc-smoothly-select{background-color:inherit}select.sc-smoothly-select:focus{outline:none}";
40447
+ const styleCss$f = ".sc-smoothly-select-h{display:block}[hidden].sc-smoothly-select-h{display:none}select.sc-smoothly-select{min-width:1.5em;padding-top:0.5em;border:none;-webkit-appearance:none;background-color:rgb(var(--smoothly-color));padding:0.3em}select.sc-smoothly-select>option.sc-smoothly-select{background-color:inherit}select.sc-smoothly-select:focus{outline:none}";
40444
40448
 
40445
40449
  let SmoothlySelect = class {
40446
40450
  constructor(hostRef) {
@@ -40462,9 +40466,9 @@ let SmoothlySelect = class {
40462
40466
  ];
40463
40467
  }
40464
40468
  };
40465
- SmoothlySelect.style = styleCss$e;
40469
+ SmoothlySelect.style = styleCss$f;
40466
40470
 
40467
- const styleCss$d = ".sc-smoothly-select-demo-h{display:block}[hidden].sc-smoothly-select-demo-h{display:none}button.sc-smoothly-select-demo:focus{outline:none}smoothly-selector.sc-smoothly-select-demo{outline:none}";
40471
+ const styleCss$e = ".sc-smoothly-select-demo-h{display:block}[hidden].sc-smoothly-select-demo-h{display:none}button.sc-smoothly-select-demo:focus{outline:none}smoothly-selector.sc-smoothly-select-demo{outline:none}";
40468
40472
 
40469
40473
  let SmoothlySelectDemo = class {
40470
40474
  constructor(hostRef) {
@@ -40541,9 +40545,9 @@ let SmoothlySelectDemo = class {
40541
40545
  ];
40542
40546
  }
40543
40547
  };
40544
- SmoothlySelectDemo.style = styleCss$d;
40548
+ SmoothlySelectDemo.style = styleCss$e;
40545
40549
 
40546
- const styleCss$c = ".sc-smoothly-selector-h{position:relative;height:100%}.sc-smoothly-selector-h>main.sc-smoothly-selector,.sc-smoothly-selector-h>main.sc-smoothly-selector>*.sc-smoothly-selector{height:100%;display:flex;align-items:center}.sc-smoothly-selector-h>div.sc-smoothly-selector>nav.sc-smoothly-selector{display:flex;flex-direction:column;position:absolute;z-index:10}.sc-smoothly-selector-h>aside.sc-smoothly-selector{position:absolute;top:0;left:5em;z-index:10;background-color:rgb(var(--smoothly-tertiary-color));color:rgb(var(--smoothly-tertiary-contrast));height:20px;border-radius:5px;padding:5px;display:flex;align-items:center}.missing.sc-smoothly-selector-h>aside.sc-smoothly-selector{background-color:rgb(var(--smoothly-warning-color));color:rgb(var(--smoothly-warning-contast))}.hidden.sc-smoothly-selector{display:none}.sc-smoothly-selector-h>section.sc-smoothly-selector{position:fixed;top:0px;left:0px;width:100vw;height:100vh;z-index:10}";
40550
+ const styleCss$d = ".sc-smoothly-selector-h{position:relative;height:100%}.sc-smoothly-selector-h>main.sc-smoothly-selector,.sc-smoothly-selector-h>main.sc-smoothly-selector>*.sc-smoothly-selector{height:100%;display:flex;align-items:center}.sc-smoothly-selector-h>div.sc-smoothly-selector>nav.sc-smoothly-selector{display:flex;flex-direction:column;position:absolute;z-index:10}.sc-smoothly-selector-h>aside.sc-smoothly-selector{position:absolute;top:0;left:5em;z-index:10;background-color:rgb(var(--smoothly-tertiary-color));color:rgb(var(--smoothly-tertiary-contrast));height:20px;border-radius:5px;padding:5px;display:flex;align-items:center}.missing.sc-smoothly-selector-h>aside.sc-smoothly-selector{background-color:rgb(var(--smoothly-warning-color));color:rgb(var(--smoothly-warning-contast))}.hidden.sc-smoothly-selector{display:none}.sc-smoothly-selector-h>section.sc-smoothly-selector{position:fixed;top:0px;left:0px;width:100vw;height:100vh;z-index:10}";
40547
40551
 
40548
40552
  let Selector = class {
40549
40553
  constructor(hostRef) {
@@ -40653,7 +40657,27 @@ function isItem(value) {
40653
40657
  (typeof value.selected == "boolean" || value.selected == undefined) &&
40654
40658
  typeof value.filter == "function");
40655
40659
  }
40656
- Selector.style = styleCss$c;
40660
+ Selector.style = styleCss$d;
40661
+
40662
+ const styleCss$c = ".sc-smoothly-skeleton-h{display:block;height:1rem}.sc-smoothly-skeleton-h::before{content:\"\";display:block;width:var(--width);height:100%;border-radius:0.4rem;background-image:linear-gradient(90deg, rgb(var(--color, var(--smoothly-dark-color))) 0, transparent 2.5rem, rgb(var(--color, var(--smoothly-dark-color))) 5rem);background-size:calc(var(--distance) + 5rem);animation-duration:var(--period, 1.6s);animation-iteration-count:infinite;animation-timing-function:linear;animation-name:shine-lines-left}@keyframes shine-lines-left{0%{background-position:-5rem}40%,100%{background-position:var(--distance)}}[align=center].sc-smoothly-skeleton-h::before{margin:0 auto;animation-name:shine-lines-center}@keyframes shine-lines-center{0%{background-position:calc((var(--width) - var(--distance)) / 2 - 5rem)}40%,100%{background-position:calc(var(--width) + (var(--distance) - var(--width)) / 2)}}[align=right].sc-smoothly-skeleton-h::before{margin:0;margin-left:auto;animation-name:shine-lines-right}@keyframes shine-lines-right{0%{background-position:calc(var(--width) - var(--distance) - 5rem)}40%,100%{background-position:var(--width)}}";
40663
+
40664
+ let SmoothlySkeleton = class {
40665
+ constructor(hostRef) {
40666
+ registerInstance(this, hostRef);
40667
+ this.widths = ["8rem", "9rem", "10rem"];
40668
+ this.align = "left";
40669
+ }
40670
+ componentWillLoad() {
40671
+ var _a;
40672
+ this.width = (_a = this.width) !== null && _a !== void 0 ? _a : this.widths[Math.floor(Math.random() * this.widths.length)];
40673
+ }
40674
+ render() {
40675
+ var _a;
40676
+ const cssVariables = Object.assign(Object.assign({ "--width": this.width, "--distance": (_a = this.distance) !== null && _a !== void 0 ? _a : "10rem" }, (this.color ? { "--color": this.color } : undefined)), (this.period ? { "--period": this.period + "s" } : undefined));
40677
+ return h(Host, { style: cssVariables });
40678
+ }
40679
+ };
40680
+ SmoothlySkeleton.style = styleCss$c;
40657
40681
 
40658
40682
  const styleCss$b = ".sc-smoothly-spinner-h:not([active]){display:none}[hidden].sc-smoothly-spinner-h{display:none}.sc-smoothly-spinner-h{display:block;stroke:rgb(var(--spinner-color, var(--smoothly-primary-tint)));position:absolute;inset:0;width:100%;height:100%;background-color:rgba(var(--background-color, var(--smoothly-default-color)), var(--background-opacity, var(--smoothly-semitransparent, 0.8)))}.sc-smoothly-spinner-h svg.sc-smoothly-spinner{position:absolute;left:calc(50% - var(--size) / 2);top:calc(50% - var(--size) / 2);width:var(--size);animation:SPIN-SVG 1.4s linear infinite}.sc-smoothly-spinner-h svg.sc-smoothly-spinner circle.sc-smoothly-spinner{transform-origin:center;animation:SPIN-CIRCLE 1.4s ease-in-out infinite;stroke-dasharray:187;stroke-dashoffset:0}@keyframes SPIN-SVG{0%{transform:rotate(0deg)}100%{transform:rotate(270deg)}}@keyframes SPIN-CIRCLE{0%{stroke-dashoffset:187}50%{stroke-dashoffset:46.75;transform:rotate(135deg)}100%{stroke-dashoffset:187;transform:rotate(450deg)}}";
40659
40683
 
@@ -41004,4 +41028,4 @@ let Urlencoded = class {
41004
41028
  }
41005
41029
  };
41006
41030
 
41007
- export { SmoothlyAccordion as smoothly_accordion, SmoothlyAccordionItem as smoothly_accordion_item, SmoothlyApp as smoothly_app, SmoothlyAppDemo as smoothly_app_demo, SmoothlyBacktotop as smoothly_backtotop, Calendar as smoothly_calendar, SmoothlyCheckbox as smoothly_checkbox, SmoothlyDialog as smoothly_dialog, SmoothlyDialogDemo as smoothly_dialog_demo, SmoothlyDisplay as smoothly_display, SmoothlyDisplayAmount as smoothly_display_amount, SmoothlyDisplayDateTime as smoothly_display_date_time, SmoothlyDisplayDemo as smoothly_display_demo, SmoothlyFrame as smoothly_frame, SmoothlyIcon as smoothly_icon, SmoothlyIconDemo as smoothly_icon_demo, SmoothlyInput as smoothly_input, InputDate as smoothly_input_date, InputDateRange as smoothly_input_date_range, SmoothlyInputDemo as smoothly_input_demo, MonthSelector as smoothly_input_month, Item as smoothly_item, SmoothlyMenuOptions as smoothly_menu_options, Notification as smoothly_notification, Notifier as smoothly_notifier, SmoothlyOption as smoothly_option, SmoothlyPicker as smoothly_picker, SmoothlyPopup as smoothly_popup, SmoothlyQuiet as smoothly_quiet, SmoothlyRadio as smoothly_radio, SmoothlyRoom as smoothly_room, SmoothlySelect as smoothly_select, SmoothlySelectDemo as smoothly_select_demo, Selector as smoothly_selector, SmoothlySpinner as smoothly_spinner, SmoothlySubmit as smoothly_submit, SmoothlyTab as smoothly_tab, SmoothlyTabSwitch as smoothly_tab_switch, Table as smoothly_table, TableCell as smoothly_table_cell, TableDemo as smoothly_table_demo, TableExpandableCell as smoothly_table_expandable_cell, TableExpandableRow as smoothly_table_expandable_row, TableHeader as smoothly_table_header, TableRow as smoothly_table_row, SmoothlyTrigger as smoothly_trigger, SmoothlyTuple as smoothly_tuple, Urlencoded as smoothly_urlencoded };
41031
+ export { SmoothlyAccordion as smoothly_accordion, SmoothlyAccordionItem as smoothly_accordion_item, SmoothlyApp as smoothly_app, SmoothlyAppDemo as smoothly_app_demo, SmoothlyBacktotop as smoothly_backtotop, Calendar as smoothly_calendar, SmoothlyCheckbox as smoothly_checkbox, SmoothlyDialog as smoothly_dialog, SmoothlyDialogDemo as smoothly_dialog_demo, SmoothlyDisplay as smoothly_display, SmoothlyDisplayAmount as smoothly_display_amount, SmoothlyDisplayDateTime as smoothly_display_date_time, SmoothlyDisplayDemo as smoothly_display_demo, SmoothlyFrame as smoothly_frame, SmoothlyIcon as smoothly_icon, SmoothlyIconDemo as smoothly_icon_demo, SmoothlyInput as smoothly_input, InputDate as smoothly_input_date, InputDateRange as smoothly_input_date_range, SmoothlyInputDemo as smoothly_input_demo, MonthSelector as smoothly_input_month, Item as smoothly_item, SmoothlyMenuOptions as smoothly_menu_options, Notification as smoothly_notification, Notifier as smoothly_notifier, SmoothlyOption as smoothly_option, SmoothlyPicker as smoothly_picker, SmoothlyPopup as smoothly_popup, SmoothlyQuiet as smoothly_quiet, SmoothlyRadio as smoothly_radio, SmoothlyRoom as smoothly_room, SmoothlySelect as smoothly_select, SmoothlySelectDemo as smoothly_select_demo, Selector as smoothly_selector, SmoothlySkeleton as smoothly_skeleton, SmoothlySpinner as smoothly_spinner, SmoothlySubmit as smoothly_submit, SmoothlyTab as smoothly_tab, SmoothlyTabSwitch as smoothly_tab_switch, Table as smoothly_table, TableCell as smoothly_table_cell, TableDemo as smoothly_table_demo, TableExpandableCell as smoothly_table_expandable_cell, TableExpandableRow as smoothly_table_expandable_row, TableHeader as smoothly_table_header, TableRow as smoothly_table_row, SmoothlyTrigger as smoothly_trigger, SmoothlyTuple as smoothly_tuple, Urlencoded as smoothly_urlencoded };