smoothly 1.0.0-alpha.76 → 1.0.0-alpha.78

package/dist/esm/loader.js

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

package/dist/esm/smoothly-accordion_66.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, g as getElement, c as createEvent, H as Host } from './index-c196715a.js';
+import { r as registerInstance, h, g as getElement, c as createEvent, H as Host } from './index-258984d3.js';
 import { T as Trigger, D as Data, M as Message } from './Data-77d2bdbe.js';
 import './GoogleFont-8474516b.js';
 import { r as redirect, N as Notice } from './redirect-1e0be743.js';
@@ -105,7 +105,7 @@ const SmoothlyAccordionItem = class {
 };
 SmoothlyAccordionItem.style = styleCss$X;
 
-const styleCss$W = "smoothly-app{display:block;scrollbar-width:none}smoothly-app[hidden]{display:none}smoothly-app>smoothly-notifier{background:none}smoothly-app>smoothly-notifier>header{background:rgba(var(--smoothly-color));color:rgba(var(--smoothly-color-contrast))}smoothly-app>smoothly-notifier>header{position:fixed;top:0;left:0;width:100%;z-index:5;height:5rem;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 5px 0 rgba(var(--smoothly-dark-shadow));border-bottom:1px solid rgba(var(--smoothly-dark-color))}smoothly-app>smoothly-notifier>header>nav{width:100%;flex-shrink:2}smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{display:flex;height:100%;margin:0}smoothly-app>smoothly-notifier>header>h1{margin-left:3.8rem;margin-bottom:0.8em;display:flex;height:100%}smoothly-app>smoothly-notifier>header>h1>a{display:inline-block;align-self:center;size:100%;background-position-y:center;text-decoration:none;white-space:nowrap}smoothly-app>smoothly-notifier>header>nav>ul li a{line-height:1.6cm}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>nav>ul>[slot=nav-start]{height:fit-content;padding:0.5em 0em;margin-top:1em}smoothly-app>smoothly-notifier>header>nav>ul>[slot=nav-end]{width:fit-content;gap:0.5em;align-self:center;height:fit-content;margin-left:10em}smoothly-app>smoothly-notifier>header>nav>ul li a{display:flex;height:2.3rem;text-decoration:none;align-items:center;align-self:center}smoothly-app>smoothly-notifier>main{position:relative;top:5rem}@media screen and (max-width: 900px){smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{width:10em;top:2.5rem;position:absolute;right:0;flex-direction:column}smoothly-app>smoothly-notifier>header>nav>ul li{margin-right:0;margin-bottom:1em;background-color:rgba(var(--smoothly-color));width:100%}smoothly-app>smoothly-notifier>header>nav>ul smoothly-burger{position:absolute;top:0;right:0}smoothly-app>smoothly-notifier>header>nav>ul>[slot=nav-start]{display:none}smoothly-app>smoothly-notifier>header>nav>ul>[slot=nav-end]{margin-left:3em;width:10em;padding:1.5em;background-color:rgba(var(--smoothly-color))}}.true:not([menuOpen]){display:none}";
+const styleCss$W = "smoothly-app{display:block;scrollbar-width:none}smoothly-app[hidden]{display:none}smoothly-app>smoothly-notifier{background:none}smoothly-app>smoothly-notifier>header{background:rgba(var(--smoothly-color));color:rgba(var(--smoothly-color-contrast))}smoothly-app>smoothly-notifier>header{position:fixed;top:0;left:0;width:100%;z-index:5;height:5rem;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 5px 0 rgba(var(--smoothly-dark-shadow));border-bottom:1px solid rgba(var(--smoothly-dark-color))}smoothly-app>smoothly-notifier>header>nav{width:100%;flex-shrink:2}smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{display:flex;height:100%;margin:0}smoothly-app>smoothly-notifier>header>h1{margin-left:3.8rem;margin-bottom:0.8em;display:flex;height:100%}smoothly-app>smoothly-notifier>header>h1>a{display:inline-block;align-self:center;size:100%;background-position-y:center;text-decoration:none;white-space:nowrap}smoothly-app>smoothly-notifier>header>nav>ul li a{line-height:1.6cm}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>nav>ul>[slot=nav-start]{height:fit-content;padding:0.5em 0em;margin-top:1em}smoothly-app>smoothly-notifier>header>nav>ul>[slot=nav-end]{width:fit-content;gap:0.5em;align-self:center;height:fit-content;margin-left:10em}smoothly-app>smoothly-notifier>header>nav>ul li a{display:flex;height:2.3rem;text-decoration:none;align-items:center;align-self:center}smoothly-app>smoothly-notifier>main{position:relative;top:5rem}@media screen and (max-width: 900px){smoothly-app>smoothly-notifier>header>nav,smoothly-app>smoothly-notifier>header>nav>ul{width:10em;top:2.5rem;position:absolute;right:0;flex-direction:column}smoothly-app>smoothly-notifier>header>nav>ul li{margin-right:0;margin-bottom:1em;background-color:rgba(var(--smoothly-color));width:100%}smoothly-app>smoothly-notifier>header>nav>ul smoothly-burger{position:absolute;top:0;right:0}smoothly-app>smoothly-notifier>header>nav>ul>[slot=nav-start]{display:none}smoothly-app>smoothly-notifier>header>nav>ul>[slot=nav-end]{margin-left:3em;width:10em;padding:1.5em;background-color:rgba(var(--smoothly-color))}}nav:not(.menuOpen){display:none}";
 
 const SmoothlyApp = class {
   constructor(hostRef) {
@@ -134,7 +134,7 @@ const SmoothlyApp = class {
   }
   burgerStatusHandler(event) {
     event.stopPropagation();
-    this.menuOpen = event.detail ? true : false;
+    this.menuOpen = event.detail;
   }
   async locationChangeHandler(event) {
     var _a;
@@ -153,7 +153,7 @@ const SmoothlyApp = class {
     this.rooms[event.target.path.toString()] = { element: event.target };
   }
   render() {
-    return (h("smoothly-notifier", null, h("header", { color: this.color }, h("h1", null, h("a", { href: "" }, this.label)), h("slot", { name: "header" }), h("nav", { class: this.menuOpen.toString() }, h("ul", null, h("slot", { name: "nav-start" }), h("slot", null, " "), h("slot", { name: "nav-end" }))), h("smoothly-burger", null)), h("main", { ref: e => (this.mainElement = e) })));
+    return (h("smoothly-notifier", null, h("header", { color: this.color }, h("h1", null, h("a", { href: "" }, this.label)), h("slot", { name: "header" }), h("nav", { class: { menuOpen: this.menuOpen } }, h("ul", null, h("slot", { name: "nav-start" }), h("slot", null, " "), h("slot", { name: "nav-end" }))), h("smoothly-burger", { onNavStatus: e => this.burgerStatusHandler(e) })), h("main", { ref: e => (this.mainElement = e) })));
   }
   static get watchers() { return {
     "selected": ["selectedChanged"]
@@ -1457,39 +1457,48 @@ const SmoothlyBacktotop = class {
 };
 SmoothlyBacktotop.style = styleCss$U;
 
-const styleCss$T = "[visible].sc-smoothly-burger-h{display:flex;justify-content:center;align-items:center;height:100%}[visible].sc-smoothly-burger-h .burger.sc-smoothly-burger smoothly-icon.sc-smoothly-burger{font-size:1.7em;cursor:pointer;margin-right:1em}.sc-smoothly-burger-h:not([visible]){display:none}[open].sc-smoothly-burger-h smoothly-icon.sc-smoothly-burger{transform:rotate(0deg);transition:transform 100ms ease-in-out}.sc-smoothly-burger-h:not([open]) smoothly-icon.sc-smoothly-burger{transform:rotate(-90deg);transition:transform 100ms ease-in-out}";
+const styleCss$T = "[visible].sc-smoothly-burger-h{display:flex;justify-content:center;align-items:center;height:100%}[visible].sc-smoothly-burger-h .burger.sc-smoothly-burger smoothly-icon.sc-smoothly-burger{font-size:1.7em;cursor:pointer;margin-right:1em}.sc-smoothly-burger-h:not([visible]){display:none}.sc-smoothly-burger-h:not([open]) smoothly-icon.sc-smoothly-burger{transform:rotate(0deg);transition:transform 100ms ease-in-out}[open].sc-smoothly-burger-h smoothly-icon.sc-smoothly-burger{transform:rotate(-90deg);transition:transform 100ms ease-in-out}";
 
 const SmoothlyBurger = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.burgerStatus = createEvent(this, "burgerStatus", 7);
+    this.navStatus = createEvent(this, "navStatus", 7);
     this.visible = undefined;
-    this.open = undefined;
+    this.open = false;
     this.mediaQuery = "(max-width: 900px)";
+    this.history = undefined;
   }
   componentWillLoad() {
-    const windowsize = window.innerWidth;
-    windowsize > 900 ? (this.visible = false) : (this.visible = true);
+    this.history = window.matchMedia(this.mediaQuery).matches;
+    if (!window.matchMedia(this.mediaQuery).matches)
+      this.visible = false;
+    else
+      this.visible = true;
+    this.navStatus.emit(!this.visible);
   }
-  closedHandler() {
-    this.burgerStatus.emit(this.open);
+  openChanged() {
+    this.navStatus.emit(this.open);
   }
   resizeHandler() {
-    const reduced = window.matchMedia(this.mediaQuery).matches;
-    if (reduced) {
-      this.visible = true;
-      this.open = true;
-    }
-    else {
-      this.visible = false;
-      this.open = false;
+    const result = window.matchMedia(this.mediaQuery).matches;
+    if (result != this.history) {
+      if (result) {
+        this.visible = true;
+        this.open = false;
+      }
+      else {
+        this.visible = false;
+        this.open = false;
+      }
+      this.navStatus.emit(!this.visible);
     }
+    this.history = result;
   }
   render() {
-    return (h(Host, null, h("span", { class: "burger", onClick: () => (this.open = !this.open) }, h("smoothly-icon", { name: "menu" }, " "))));
+    return (h(Host, null, h("span", { class: "burger", onClick: () => (this.open = !this.open) }, h("smoothly-icon", { name: "menu" }))));
   }
   static get watchers() { return {
-    "open": ["closedHandler"]
+    "open": ["openChanged"]
   }; }
 };
 SmoothlyBurger.style = styleCss$T;
@@ -22136,7 +22145,7 @@ const SmoothlyDisplayDemo = class {
   }
   render() {
     return [
-      h("main", null, h("fieldset", null, h("h2", null, "Smoothly display"), 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, "display amount without decimals"), h("dd", null, h("smoothly-display-amount", { amount: 200, currency: "SEK", toInteger: true })), h("dt", null, "display amount with decimals if they are set, otherwise no decimal"), h("dd", null, h("smoothly-display-amount", { amount: 200.20, currency: "SEK", toInteger: true })), h("dt", null, "display amount with decimals"), h("dd", null, h("smoothly-display-amount", { amount: 200.20, 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, "date"), h("dd", null, h("smoothly-display", { type: "date", value: "2022-07-07" })), h("dt", null, "date time"), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "short", day: "numeric", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T02:02:02Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "long", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit" }, value: "2022-07-07T02:02:02Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "2-digit", day: "2-digit", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T12:22:24Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "numeric", day: "numeric", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T12:22:24Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "short", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric", hour: "2-digit", minute: "2-digit", second: "2-digit", timeZone: "Europe/Stockholm" }, value: "2022-07-07T12:15Z" })), h("dt", null, "Deprecated display date time"), h("dt", null, "Display amount"), h("dd", null, h("smoothly-display-amount", { currency: "SEK", amount: "1289.5" })), h("dt", null, "Quiet"), h("dd", null, h("smoothly-quiet", { color: "dark" }, "-")))), h("fieldset", null, h("h2", null, "Smoothly skeleton"), 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("fieldset", null, h("h2", null, "Smoothly URL encoded"), h("smoothly-urlencoded", { data: "hej=hopp&tjena=moss" })), h("fieldset", null, h("h2", null, "Smoothly popup"), 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("smoothly-popup", null, h("div", null, "Popup, click me"), h("div", { color: "dark", slot: "popup" }, "1 line popup"))), h("fieldset", null, h("h2", null, "Test of different kinds of notifier"), h("button", { onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { onClick: () => this.noticeWarning(Notice.succeeded("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("fieldset", null, h("h2", null, "Smoothly spinner"), 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" })), h("div", { style: { position: "absolute", left: "500px", top: "150px" } }, h("smoothly-svg", { url: "https://theme.payfunc.com/intergiro/animated-logo.svg" }))), h("fieldset", null, h("h2", null, "Smoothly summary"), h("smoothly-summary", { color: "light", fill: "clear", size: "large" }, h("p", { slot: "summary" }, "Some title"), h("p", { slot: "content" }, "Some content")), h("smoothly-summary", { color: "light", fill: "clear", size: "large" }, h("p", { slot: "summary" }, "Some title"), h("p", { slot: "content" }, "Some content")), h("smoothly-summary", { color: "danger", fill: "clear" }, h("div", { slot: "summary", style: { display: "flex", gap: "0.3rem" } }, h("span", null, "Person"), h("smoothly-icon", { name: "person", color: "light", fill: "clear", size: "tiny" })), h("p", { slot: "content" }, "Some person information.")), h("smoothly-summary", { color: "danger", fill: "clear", open: true, onSmoothlySummaryOpen: e => console.log("summary is open?", e.detail) }, h("p", { slot: "summary" }, "Some other title"), h("p", { slot: "content" }, "A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.")))),
+      h("main", null, h("fieldset", null, h("h2", null, "Smoothly display"), 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, "display amount without decimals"), h("dd", null, h("smoothly-display-amount", { amount: 200, currency: "SEK", toInteger: true })), h("dt", null, "display amount with decimals if they are set, otherwise no decimal"), h("dd", null, h("smoothly-display-amount", { amount: 200.20, currency: "SEK", toInteger: true })), h("dt", null, "display amount with decimals"), h("dd", null, h("smoothly-display-amount", { amount: 200.20, 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, "date"), h("dd", null, h("smoothly-display", { type: "date", value: "2022-07-07" })), h("dt", null, "date time"), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "short", day: "numeric", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T02:02:02Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "long", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit" }, value: "2022-07-07T02:02:02Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "2-digit", day: "2-digit", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T12:22:24Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "numeric", day: "numeric", hour: "numeric", minute: "numeric", second: "numeric" }, value: "2022-07-07T12:22:24Z" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "numeric", month: "short", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric" }, value: "2022-07-07T00:00+02:00" })), h("dd", null, h("smoothly-display", { type: "date-time", format: { year: "2-digit", month: "numeric", day: "numeric", hour: "2-digit", minute: "2-digit", second: "2-digit", timeZone: "Europe/Stockholm" }, value: "2022-07-07T12:15Z" })), h("dt", null, "Deprecated display date time"), h("dt", null, "Display amount"), h("dd", null, h("smoothly-display-amount", { currency: "SEK", amount: "1289.5" })), h("dt", null, "Quiet"), h("dd", null, h("smoothly-quiet", { color: "dark" }, "-")))), h("fieldset", null, h("h2", null, "Smoothly skeleton"), 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("fieldset", null, h("h2", null, "Smoothly URL encoded"), h("smoothly-urlencoded", { data: "hej=hopp&tjena=moss" })), h("fieldset", null, h("h2", null, "Smoothly popup"), 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("smoothly-popup", null, h("div", null, "Popup, click me"), h("div", { color: "dark", slot: "popup" }, "1 line popup"))), h("fieldset", null, h("h2", null, "Test of different kinds of notifier"), h("button", { onClick: () => this.noticeWarning(Notice.warn("This is a test warning notice.")) }, "warning"), h("button", { onClick: () => this.noticeWarning(Notice.succeeded("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("fieldset", null, h("h2", null, "Smoothly spinner"), 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" })), h("div", { style: { position: "absolute", left: "500px", top: "150px" } }, h("smoothly-svg", { url: "https://theme.payfunc.com/intergiro/animated-logo.svg" }))), h("fieldset", null, h("h2", null, "Smoothly summary"), h("smoothly-summary", { color: "light", fill: "clear", size: "large" }, h("p", { slot: "summary" }, "Some title"), h("p", { slot: "content" }, "Some content")), h("smoothly-summary", { color: "light", fill: "clear", size: "large" }, h("p", { slot: "summary" }, "Some title"), h("p", { slot: "content" }, "Some content")), h("smoothly-summary", { color: "danger", fill: "clear" }, h("div", { slot: "summary", style: { display: "flex", gap: "0.3rem" } }, h("span", null, "Person"), h("smoothly-icon", { name: "person", color: "light", fill: "clear", size: "tiny" })), h("p", { slot: "content" }, "Some person information.")), h("smoothly-summary", { color: "danger", fill: "clear", open: true }, h("p", { slot: "summary" }, "Some other title"), h("p", { slot: "content" }, "A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.A lot more content, yes please. A lot more content, yes please. A lot more content, yes please. A lot more content, yes please.")))),
     ];
   }
 };