@getflip/swirl-components 0.339.0 → 0.340.0

package/dist/cjs/swirl-popover_2.cjs.entry.js

@@ -1,21 +1,27 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
-const floatingUi_dom_esm = require('./floating-ui.dom.esm-3e7933b7.js');
-const bodyScrollLock_esm = require('./bodyScrollLock.esm-f29f1a77.js');
-const index$1 = require('./index-9f94303c.js');
-const utils = require('./utils-4f225daf.js');
+var index = require('./index-Cks2WRVX.js');
+var floatingUi_dom_browser_min = require('./floating-ui.dom.browser.min-PA1q-Uql.js');
+var bodyScrollLock_esm = require('./bodyScrollLock.esm-DMDeaEpJ.js');
+var index$1 = require('./index-DcAhLZUH.js');
+var utils = require('./utils-Br2wWntR.js');
 
 const swirlPopoverCss = ":host{position:relative;z-index:var(--s-z-40)}:host *{box-sizing:border-box}:host{--swirl-resource-list-item-background-default:var(\n    --s-surface-overlay-default\n  );--swirl-resource-list-item-background-hovered:var(\n    --s-surface-overlay-hovered\n  );--swirl-resource-list-item-background-pressed:var(\n    --s-surface-overlay-pressed\n  )}.popover--active:not(.popover--closing) .popover__backdrop{animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__backdrop{animation:none}}.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-slide-in}@media (min-width: 768px){.popover--active:not(.popover--closing) .popover__content{transform-origin:top left;animation:0.15s popover-fade-scale-in-xy}}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__content{animation:none}}.popover--closing .popover__backdrop{animation:0.15s popover-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--closing .popover__backdrop{animation:none}}.popover--closing .popover__content{animation:0.15s popover-slide-out;animation-fill-mode:forwards}@media (min-width: 768px){.popover--closing .popover__content{animation:0.15s popover-fade-out}}@media (prefers-reduced-motion){.popover--closing .popover__content{animation:none}}.popover--inactive .popover__content{display:none}@media (max-width: 767px){.popover--fullscreen-bottom-sheet.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--fullscreen-bottom-sheet.popover--active:not(.popover--closing) .popover__content{animation:none}}.popover--fullscreen-bottom-sheet.popover--closing .popover__content{animation:0.15s popover-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--fullscreen-bottom-sheet.popover--closing .popover__content{animation:none}}.popover--fullscreen-bottom-sheet .popover__backdrop{display:none}.popover--fullscreen-bottom-sheet .popover__content{top:0;border-top-left-radius:0;border-top-right-radius:0}.popover--fullscreen-bottom-sheet .popover__scroll-container{height:100%;max-height:none;padding-top:0;padding-bottom:0}.popover--fullscreen-bottom-sheet .popover__handle{display:none}}@media (min-width: 768px){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-scale-in-y}}@media (prefers-reduced-motion){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{animation:none}}@media (min-width: 768px){.popover--animation-fade-in.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-in}}@media (prefers-reduced-motion){.popover--animation-fade-in.popover--active:not(.popover--closing) .popover__content{animation:none}}@media (min-width: 768px){.popover--transparent .popover__content{background-color:transparent;box-shadow:none}}@media (min-width: 768px){.popover--transparent .popover__scroll-container{padding:0}}.popover__backdrop{position:fixed;z-index:0;background-color:rgba(0, 0, 0, 0.2);animation:0.15s popover-backdrop-fade-in;inset:0}@media (prefers-reduced-motion){.popover__backdrop{animation:none}}@media (min-width: 768px){.popover__backdrop{display:none}}.popover__content{position:fixed;z-index:2;right:0;bottom:0;left:0;overflow:hidden;border-top-left-radius:var(--s-border-radius-xl);border-top-right-radius:var(--s-border-radius-xl);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.popover__content{right:unset;bottom:unset;left:unset;max-width:22.5rem;border-radius:var(--s-border-radius-base);animation:none;box-shadow:var(--s-shadow-level-2)}}.popover__scroll-container{overflow-x:hidden;overflow-y:auto;width:100%;max-height:90vh;padding-top:var(--s-space-24);padding-bottom:var(--s-space-24);overscroll-behavior:contain}@media (min-width: 768px){.popover__scroll-container{max-height:22rem;padding-top:0;padding-bottom:0}}@media (min-width: 768px){.popover--padded .popover__scroll-container{padding:var(--s-space-4)}}.popover__handle{position:absolute;top:var(--s-space-8);left:50%;width:2.5rem;height:0.375rem;border-radius:0.1875rem;background-color:var(--s-border-default);transform:translatex(-50%)}@media (min-width: 768px){.popover__handle{display:none}}@keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}";
-const SwirlPopoverStyle0 = swirlPopoverCss;
 
 const SwirlPopover = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.popoverClose = index.createEvent(this, "popoverClose", 7);
         this.popoverOpen = index.createEvent(this, "popoverOpen", 7);
+        this.animation = "scale-in-xy";
+        this.enableFlip = true;
+        this.maxHeight = "22rem";
+        this.offset = 8;
+        this.padded = true;
+        this.placement = "bottom-start";
+        this.returnFocusToTrigger = true;
+        this.active = false;
+        this.closing = false;
         this.toggle = (event) => {
             event.stopPropagation();
             if (this.active) {
@@ -45,9 +51,9 @@ const SwirlPopover = class {
                 ? { mainAxis: this.offset, crossAxis: 0 }
                 : { mainAxis: this.offset[0], crossAxis: this.offset[1] };
             const middleware = this.enableFlip
-                ? [floatingUi_dom_esm.offset(offsetOptions), floatingUi_dom_esm.shift(), floatingUi_dom_esm.flip()]
-                : [floatingUi_dom_esm.offset(offsetOptions), floatingUi_dom_esm.shift()];
-            this.position = await floatingUi_dom_esm.computePosition(this.triggerEl, this.contentContainer, {
+                ? [floatingUi_dom_browser_min.D(offsetOptions), floatingUi_dom_browser_min.k(), floatingUi_dom_browser_min.b()]
+                : [floatingUi_dom_browser_min.D(offsetOptions), floatingUi_dom_browser_min.k()];
+            this.position = await floatingUi_dom_browser_min.P(this.triggerEl, this.contentContainer, {
                 middleware,
                 placement: this.placement,
                 strategy: "fixed",
@@ -56,24 +62,6 @@ const SwirlPopover = class {
         this.onCloseButtonClick = () => {
             this.close();
         };
-        this.animation = "scale-in-xy";
-        this.disableScrollLock = undefined;
-        this.enableFlip = true;
-        this.fullscreenBottomSheet = undefined;
-        this.label = undefined;
-        this.maxHeight = "22rem";
-        this.offset = 8;
-        this.padded = true;
-        this.popoverId = undefined;
-        this.placement = "bottom-start";
-        this.returnFocusToTrigger = true;
-        this.transparent = undefined;
-        this.trigger = undefined;
-        this.triggerContainer = undefined;
-        this.useContainerWidth = undefined;
-        this.active = false;
-        this.closing = false;
-        this.position = undefined;
     }
     componentDidLoad() {
         this.connectTrigger();
@@ -176,7 +164,7 @@ const SwirlPopover = class {
             if (this.disableAutoUpdate) {
                 this.disableAutoUpdate();
             }
-            this.disableAutoUpdate = floatingUi_dom_esm.autoUpdate(this.triggerEl, this.contentContainer, () => this.reposition());
+            this.disableAutoUpdate = floatingUi_dom_browser_min.N(this.triggerEl, this.contentContainer, () => this.reposition());
             this.scrollContainer.scrollTop = 0;
             this.lockBodyScroll();
         });
@@ -280,14 +268,17 @@ const SwirlPopover = class {
     }
     get el() { return index.getElement(this); }
 };
-SwirlPopover.style = SwirlPopoverStyle0;
+SwirlPopover.style = swirlPopoverCss;
 
 const swirlPopoverTriggerCss = ".sc-swirl-popover-trigger-h{display:contents}";
-const SwirlPopoverTriggerStyle0 = swirlPopoverTriggerCss;
 
 const SwirlPopoverTrigger = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        this.hidePopoverWhenInvisible = true;
+        this.setAriaAttributes = true;
+        this.triggerOnClick = true;
+        this.triggerOnHover = false;
         this.triggerIsActive = false;
         this.popoverMouseEnter = () => {
             this.stopHoverLingerTimer();
@@ -364,14 +355,6 @@ const SwirlPopoverTrigger = class {
                 triggerEl.setAttribute("aria-haspopup", "dialog");
             }
         };
-        this.hidePopoverWhenInvisible = true;
-        this.parentScrollContainer = undefined;
-        this.setAriaAttributes = true;
-        this.swirlPopover = undefined;
-        this.triggerOnClick = true;
-        this.triggerOnHover = false;
-        this.hoverLingerDuration = undefined;
-        this.hoverDelay = undefined;
     }
     componentDidLoad() {
         this.updateTriggerElAriaAttributes();
@@ -453,7 +436,7 @@ const SwirlPopoverTrigger = class {
         "triggerOnHover": ["watchHover"]
     }; }
 };
-SwirlPopoverTrigger.style = SwirlPopoverTriggerStyle0;
+SwirlPopoverTrigger.style = swirlPopoverTriggerCss;
 
 exports.swirl_popover = SwirlPopover;
 exports.swirl_popover_trigger = SwirlPopoverTrigger;

package/dist/cjs/swirl-progress-indicator.cjs.entry.js

@@ -1,17 +1,13 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
-const index$1 = require('./index-9f94303c.js');
+var index = require('./index-Cks2WRVX.js');
+var index$1 = require('./index-DcAhLZUH.js');
 
 const swirlProgressIndicatorCss = ":host{display:block;width:100%}:host *{box-sizing:border-box}:host(.circle){display:inline-flex;width:auto}.progress-indicator--variant-bar{display:block;width:100%;height:0.25rem;border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.progress-indicator--variant-bar::-webkit-progress-bar{border-radius:0.125rem;background-color:var(--s-surface-raised-default)}.progress-indicator--variant-bar::-webkit-progress-value{border-radius:0.125rem;background-color:var(--s-border-highlight);-webkit-transition:width 0.25s;transition:width 0.25s}.progress-indicator--variant-bar::-moz-progress-bar{height:0.25rem;border-radius:0.125rem;background-color:var(--s-border-highlight);-moz-transition:width 0.25s;transition:width 0.25s}@media (prefers-reduced-motion){.progress-indicator--variant-bar::-moz-progress-bar{-moz-transition:none;transition:none}}.progress-indicator--variant-bar.progress-indicator--size-s{height:0.125rem}.progress-indicator--variant-bar.progress-indicator--size-s::-webkit-progress-bar{border-radius:0.0625rem}.progress-indicator--variant-bar.progress-indicator--size-s::-webkit-progress-value{border-radius:0.0625rem}.progress-indicator--variant-bar.progress-indicator--size-s::-moz-progress-bar{height:0.125rem;border-radius:0.0625rem}.progress-indicator--variant-circle{position:relative;display:inline-flex;overflow:hidden;width:3rem;height:3rem}.progress-indicator--variant-circle.progress-indicator--size-s{width:1.5rem;height:1.5rem}.progress-indicator__circle{position:absolute;width:100%;height:100%;transform:rotate(-90deg);inset:0}.progress-indicator__circle-background{stroke:var(--s-border-default);stroke-linecap:round}.progress-indicator__circle-value{transition:stroke-dashoffset 0.25s;stroke:var(--s-interactive-primary-default);stroke-linecap:round}@media (prefers-reduced-motion){.progress-indicator__circle-value{transition:none}}";
-const SwirlProgressIndicatorStyle0 = swirlProgressIndicatorCss;
 
 const SwirlProgressIndicator = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.label = undefined;
         this.size = "m";
         this.value = 0;
         this.variant = "bar";
@@ -25,6 +21,6 @@ const SwirlProgressIndicator = class {
         return (index.h(index.Host, { key: '03dd7eb8c9e4e7c15654249259be651bd67505b1', class: this.variant }, this.variant === "bar" && (index.h("progress", { key: '284be63a571d9fb55173aeda76ccbec9490ef09f', "aria-label": this.label, "aria-valuemax": 100, "aria-valuemin": 0, "aria-valuenow": this.value, class: className, max: 100, value: this.value })), this.variant === "circle" && (index.h("span", { key: 'd773f3a50487dd319dde7295ac4a4dcc603ef80f', role: "progressbar", "aria-label": this.label, "aria-valuemax": 100, "aria-valuemin": 0, "aria-valuenow": this.value, class: className }, index.h("svg", { key: 'e32adc1eb7ad3341c7b0a7295dbb0092f2b540bc', class: "progress-indicator__circle", focusable: "false", viewBox: `0 0 ${(radius + strokeWidth) * 2} ${(radius + strokeWidth) * 2}` }, index.h("circle", { key: 'f0536f927e68273dea67d2daea326409848e562e', class: "progress-indicator__circle-background", cx: radius + strokeWidth, cy: radius + strokeWidth, r: radius, fill: "none", "stroke-width": strokeWidth }), index.h("circle", { key: 'dfaf605e805372c8d94a820018b0095842b8c769', class: "progress-indicator__circle-value", cx: radius + strokeWidth, cy: radius + strokeWidth, r: radius, fill: "none", "stroke-width": strokeWidth, "stroke-dasharray": circumference, "stroke-dashoffset": dashOffset }))))));
     }
 };
-SwirlProgressIndicator.style = SwirlProgressIndicatorStyle0;
+SwirlProgressIndicator.style = swirlProgressIndicatorCss;
 
 exports.swirl_progress_indicator = SwirlProgressIndicator;

package/dist/cjs/swirl-radio-group.cjs.entry.js

@@ -1,18 +1,13 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
+var index = require('./index-Cks2WRVX.js');
 
 const swirlRadioGroupCss = ".sc-swirl-radio-group-h{display:block}.sc-swirl-radio-group-h *.sc-swirl-radio-group{box-sizing:border-box}.radio-group.sc-swirl-radio-group{display:flex;flex-direction:column;gap:var(--s-space-12)}";
-const SwirlRadioGroupStyle0 = swirlRadioGroupCss;
 
 const SwirlRadioGroup = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.valueChange = index.createEvent(this, "valueChange", 7);
-        this.swirlAriaDescribedby = undefined;
-        this.value = undefined;
     }
     componentDidLoad() {
         this.radioButtons = Array.from(this.el.querySelectorAll("swirl-radio"));
@@ -51,6 +46,6 @@ const SwirlRadioGroup = class {
     }
     get el() { return index.getElement(this); }
 };
-SwirlRadioGroup.style = SwirlRadioGroupStyle0;
+SwirlRadioGroup.style = swirlRadioGroupCss;
 
 exports.swirl_radio_group = SwirlRadioGroup;

package/dist/cjs/swirl-radio.cjs.entry.js

@@ -1,31 +1,21 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
-const index$1 = require('./index-9f94303c.js');
+var index = require('./index-Cks2WRVX.js');
+var index$1 = require('./index-DcAhLZUH.js');
 
 const swirlRadioCss = ".sc-swirl-radio-h{display:inline-flex}.sc-swirl-radio-h *.sc-swirl-radio{box-sizing:border-box}.radio.sc-swirl-radio{display:inline-flex;line-height:var(--s-line-height-base);cursor:pointer}.radio.sc-swirl-radio:focus-within .radio__box.sc-swirl-radio{box-shadow:0 0 0 0.0625rem var(--s-background-default),\n      0 0 0 0.1875rem var(--s-focus-default)}.radio--variant-card.sc-swirl-radio{width:100%;padding:var(--s-space-16);border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm);background-color:var(--s-surface)}.radio--variant-card.sc-swirl-radio:focus-within{box-shadow:0 0 0 0.125rem var(--s-background-default),\n      0 0 0 0.25rem var(--s-focus-default)}.radio--variant-card.sc-swirl-radio:focus-within .radio__box.sc-swirl-radio{box-shadow:none}.radio--variant-card.sc-swirl-radio:hover:not(.radio--disabled){background-color:var(--s-surface-hovered)}.radio--variant-card.sc-swirl-radio:active:not(.radio--disabled){background-color:var(--s-surface-pressed)}.radio--variant-card.radio--checked.sc-swirl-radio:not(.radio--disabled){border-color:var(--s-border-highlight)}.radio--variant-card.radio--invalid.sc-swirl-radio:not(.radio--disabled){border-color:var(--s-border-critical)}.radio--checked.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{border-color:var(--s-interactive-primary-hovered);background-color:var(--s-interactive-primary-hovered)}.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio{position:relative;border-color:var(--s-icon-highlight);background-color:var(--s-icon-highlight)}.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio:after{position:absolute;top:50%;left:50%;width:0.5rem;height:0.5rem;border-radius:50%;background-color:var(--s-background-default);content:\"\";transform:translate3d(-50%, -50%, 0)}.radio--invalid.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio,.radio--invalid.radio--indeterminate.sc-swirl-radio .radio__box.sc-swirl-radio{background-color:var(--s-icon-critical)}.radio--invalid.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-critical)}.radio--disabled.sc-swirl-radio{cursor:default}.radio--disabled.radio--checked.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled);background-color:transparent}.radio--disabled.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled);background-color:var(--s-background-default)}.radio--disabled.radio--checked.sc-swirl-radio .radio__box.sc-swirl-radio:after{background-color:var(--s-icon-disabled)}.radio--disabled.sc-swirl-radio .radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{background-color:transparent}.radio--disabled.sc-swirl-radio .radio__box.sc-swirl-radio{border-color:var(--s-icon-disabled)}.radio--disabled.sc-swirl-radio .radio__description.sc-swirl-radio,.radio--disabled.sc-swirl-radio .radio__label.sc-swirl-radio{color:var(--s-text-disabled)}.radio__control.sc-swirl-radio{position:relative;display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2);flex-shrink:0}.radio__control.sc-swirl-radio:hover .radio__box.sc-swirl-radio{background-color:var(--s-action-neutral-hovered)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__control.sc-swirl-radio{width:1.375rem;height:1.375rem}}.radio__box.sc-swirl-radio{position:relative;display:flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:50%}.radio__label-container.sc-swirl-radio{display:inline-flex;margin-left:var(--s-space-8);padding-top:var(--s-space-2);flex-direction:column}.radio__label.sc-swirl-radio{display:flex;align-items:center;font-weight:var(--s-font-weight-medium);gap:var(--s-space-8)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__label.sc-swirl-radio{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.radio__description.sc-swirl-radio{color:var(--s-text-subdued)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.radio__description.sc-swirl-radio{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}";
-const SwirlRadioStyle0 = swirlRadioCss;
 
 const SwirlRadio = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.valueChange = index.createEvent(this, "valueChange", 7);
+        this.checked = false;
+        this.disabled = false;
+        this.variant = "default";
         this.onChange = () => {
             this.checked = true;
             this.valueChange.emit(this.value);
         };
-        this.checked = false;
-        this.description = undefined;
-        this.disabled = false;
-        this.inputId = undefined;
-        this.inputName = undefined;
-        this.invalid = undefined;
-        this.label = undefined;
-        this.tooltip = undefined;
-        this.value = undefined;
-        this.variant = "default";
     }
     getAriaCheckedLabel(checked, unchecked) {
         if (checked) {
@@ -50,6 +40,6 @@ const SwirlRadio = class {
         return (index.h(index.Host, { key: 'cf9589a6d96249e9f17c7194226c714e64c7b81d', style: { width: this.variant === "card" ? "100%" : undefined } }, index.h("label", { key: 'f7912093f0adf0ab2de0a2b55e40fc655d6248a4', class: className, htmlFor: this.inputId }, index.h("span", { key: '3aeb823a9d1ede0084639e2dc9df0b8894ca23cb', class: "radio__control" }, index.h("swirl-visually-hidden", { key: 'a92863db127af8610d88f734a1e3ab1b15d407c4' }, index.h("input", { key: 'b287f603742d1238f48ea93bd0e6caea51f20a4e', "aria-checked": ariaCheckedLabel, "aria-invalid": ariaInvalid, checked: checked, class: "radio__input", disabled: this.disabled, id: this.inputId, name: this.inputName, onChange: this.onChange, type: "radio", value: this.value })), index.h("span", { key: '312bb88f1c4580e67ed926d96528f21148c94f17', "aria-hidden": "true", class: "radio__box" })), index.h("span", { key: '029e15ddc28cfe54d34ac1abd00d377999c32a6f', class: "radio__label-container" }, this.label && (index.h("span", { key: '26cb7e3431533570dfdf16b16816114551f5f347', class: "radio__label" }, this.label, this.tooltip && (index.h("swirl-tooltip", { key: '4f03b751d579d251a066b17bfc5773d20c554945', content: this.tooltip, position: "top" }, index.h("swirl-icon-help", { key: 'dd93e1a9e4adbf509a19dfd37d425a781fa1cc7b', color: "default", size: 20, tabIndex: 0 }))))), this.description && (index.h("span", { key: 'd32d935f4f811e17c7afb70fa717e40ceadd177f', class: "radio__description", innerHTML: this.description }))))));
     }
 };
-SwirlRadio.style = SwirlRadioStyle0;
+SwirlRadio.style = swirlRadioCss;
 
 exports.swirl_radio = SwirlRadio;

package/dist/cjs/swirl-resource-list-file-item.cjs.entry.js

@@ -1,27 +1,19 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
-const index$1 = require('./index-9f94303c.js');
-const mediaQuery_service = require('./media-query.service-aad2b3b1.js');
-require('./utils-4f225daf.js');
+var index = require('./index-Cks2WRVX.js');
+var index$1 = require('./index-DcAhLZUH.js');
+var mediaQuery_service = require('./media-query.service-DRPgROAV.js');
+require('./utils-Br2wWntR.js');
 
 const swirlResourceListFileItemCss = ".sc-swirl-resource-list-file-item-h{display:block;width:100%}.sc-swirl-resource-list-file-item-h *.sc-swirl-resource-list-file-item{box-sizing:border-box}.resource-list-file-item.sc-swirl-resource-list-file-item{position:relative;display:flex;width:100%;padding:var(--s-space-12) var(--s-space-16);align-items:center;background-color:var(--s-background-default);line-height:var(--s-line-height-base);gap:var(--s-space-12)}.resource-list-file-item.sc-swirl-resource-list-file-item:focus{outline:none}.resource-list-file-item.sc-swirl-resource-list-file-item:focus-visible{background-color:var(--s-background-hovered)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-file-item.sc-swirl-resource-list-file-item{padding:var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.resource-list-file-item--has-control.sc-swirl-resource-list-file-item .resource-list-file-item__label-container.sc-swirl-resource-list-file-item{padding-right:calc(var(--s-space-12) + 2.5rem)}.resource-list-file-item__icon.sc-swirl-resource-list-file-item{width:1.5rem;height:1.5rem;color:var(--s-icon-highlight)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-file-item__icon.sc-swirl-resource-list-file-item{width:1.25rem;height:1.25rem}}.resource-list-file-item__label-container.sc-swirl-resource-list-file-item{position:relative;display:flex;min-width:0;min-height:2.875rem;flex-grow:1;justify-content:center;flex-direction:column}.resource-list-file-item__label-container.sc-swirl-resource-list-file-item:after{position:absolute;right:0;bottom:calc(-1 * var(--s-space-12));left:0;height:0.0625rem;background-color:var(--s-border-default);content:\"\"}.resource-list-file-item__label.sc-swirl-resource-list-file-item{overflow:hidden;font-weight:var(--s-font-weight-medium);white-space:nowrap;text-overflow:ellipsis}.resource-list-file-item__description.sc-swirl-resource-list-file-item{overflow:hidden;margin-top:var(--s-space-2);color:var(--s-text-subdued);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);white-space:nowrap;text-overflow:ellipsis}.resource-list-file-item__error-message.sc-swirl-resource-list-file-item{margin-top:var(--s-space-2)}.resource-list-file-item__remove-button.sc-swirl-resource-list-file-item{position:absolute;top:50%;right:var(--s-space-16);display:inline-flex;transform:translateY(-50%)}.resource-list-file-item__spinner.sc-swirl-resource-list-file-item{position:absolute;top:50%;right:var(--s-space-24);display:inline-flex;transform:translateY(-50%)}";
-const SwirlResourceListFileItemStyle0 = swirlResourceListFileItemCss;
 
 const SwirlResourceListFileItem = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.remove = index.createEvent(this, "remove", 7);
-        this.mediaQueryUnsubscribe = () => { };
-        this.description = undefined;
-        this.errorMessage = undefined;
         this.icon = "<swirl-icon-file></swirl-icon-file>";
-        this.label = undefined;
-        this.loading = undefined;
-        this.removable = undefined;
         this.removeButtonLabel = "Remove file";
+        this.mediaQueryUnsubscribe = () => { };
     }
     componentDidLoad() {
         this.mediaQueryUnsubscribe = mediaQuery_service.DesktopMediaQuery.subscribe((isDesktop) => {
@@ -49,6 +41,6 @@ const SwirlResourceListFileItem = class {
         return (index.h(index.Host, { key: '22cb962b750b62682294f6df4bbc73d76a68b94a', role: "row" }, index.h("div", { key: '3090e6d1030b9a8368739a9e60864aae35402e45', class: className, part: "resource-list-file-item", role: "gridcell" }, index.h("span", { key: '07ed66da5858bd948895f82e63af413e6e8e0aa0', class: "resource-list-file-item__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) }), index.h("span", { key: '6e5f2b533d21c82fa773696d009d53833ddb7a65', class: "resource-list-file-item__label-container" }, index.h("span", { key: 'd7cef3c61a7a568d1e5ae6ee34fc095509c30ccb', class: "resource-list-file-item__label", id: "label" }, this.label), showDescription && (index.h("span", { key: '0a3b309fa387376098ab9432a63edbb5ff2cd4b2', class: "resource-list-file-item__description" }, this.description)), showError && (index.h("span", { key: 'cbeac102c0cca4fbfd381aa9ac75077bb019d9cc', "aria-live": "polite", class: "resource-list-file-item__error-message" }, index.h("swirl-inline-error", { key: '809a5a0f888ea61c41828a7072cb16e54b69d468', message: this.errorMessage, size: "s" })))), showSpinner && (index.h("span", { key: 'd79a6f4a9f6eed5ed7bf311773b2e9f82ea3ac96', class: "resource-list-file-item__spinner" }, index.h("swirl-spinner", { key: 'f644089da4ad3b26db45cd723615899d8dcd5acc', size: "s" }))), showRemoveButton && (index.h("span", { key: 'da8305a643f0a52457b19855e3f0a662d3188485', class: "resource-list-file-item__remove-button" }, index.h("swirl-button", { key: 'b2f80c7addccaec363b3d3905a96489a3d482108', hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.removeButtonLabel, onClick: this.remove.emit }))))));
     }
 };
-SwirlResourceListFileItem.style = SwirlResourceListFileItemStyle0;
+SwirlResourceListFileItem.style = swirlResourceListFileItemCss;
 
 exports.swirl_resource_list_file_item = SwirlResourceListFileItem;

package/dist/cjs/swirl-resource-list-section.cjs.entry.js

@@ -1,16 +1,12 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
+var index = require('./index-Cks2WRVX.js');
 
 const swirlResourceListSectionCss = ":host{display:block;width:100%}:host *{box-sizing:border-box}.resource-list-section-label{display:flex;padding:var(--s-space-8);color:var(--s-text-subdued);font-weight:var(--s-font-weight-medium);font-size:var(--s-font-size-base);line-height:var(--s-line-height-lg)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-section-label{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}";
-const SwirlResourceListSectionStyle0 = swirlResourceListSectionCss;
 
 const SwirlResourceListSection = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.label = undefined;
         this.separatorSpacing = "4";
         this.spacing = "0";
         this.hasSeparator = false;
@@ -19,6 +15,6 @@ const SwirlResourceListSection = class {
         return (index.h(index.Host, { key: 'da112e2332e282c1435f25165c65a6e8bd491471' }, this.hasSeparator && (index.h("swirl-separator", { key: 'bc057a044dfd68689199602e6390534c95274d6b', spacing: this.separatorSpacing })), index.h("div", { key: 'aac0c9b006fb7ad630ac01e2bf8ccd9164084890', "aria-labelledby": "label", role: "rowgroup" }, index.h("span", { key: 'e16de91e1999d22bdb29f1d2a52a898c11db5d16', id: "label", class: "resource-list-section-label", part: "resource-list-section-label" }, this.label), index.h("swirl-stack", { key: 'a327774755e9f9f9f2564f99c7cee627e9868d5e', spacing: this.spacing }, index.h("slot", { key: '14e1a3a56b7252334ba00e9864db570785f8656b' })))));
     }
 };
-SwirlResourceListSection.style = SwirlResourceListSectionStyle0;
+SwirlResourceListSection.style = swirlResourceListSectionCss;
 
 exports.swirl_resource_list_section = SwirlResourceListSection;

package/dist/cjs/swirl-search.cjs.entry.js

@@ -1,14 +1,11 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
-const index$1 = require('./index-9f94303c.js');
-const mediaQuery_service = require('./media-query.service-aad2b3b1.js');
-require('./utils-4f225daf.js');
+var index = require('./index-Cks2WRVX.js');
+var index$1 = require('./index-DcAhLZUH.js');
+var mediaQuery_service = require('./media-query.service-DRPgROAV.js');
+require('./utils-Br2wWntR.js');
 
 const swirlSearchCss = ".sc-swirl-search-h{display:flex;width:100%}.sc-swirl-search-h *.sc-swirl-search{box-sizing:border-box}.search.sc-swirl-search{position:relative;display:flex;width:100%}.search--variant-outline.sc-swirl-search .search__input.sc-swirl-search{background-color:transparent;box-shadow:inset 0 0 0 var(--s-border-width-default) var(--s-border-strong)}.search--disabled.sc-swirl-search .search__icon.sc-swirl-search{color:var(--s-icon-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search{color:var(--s-text-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search::-moz-placeholder{color:var(--s-text-disabled)}.search--disabled.sc-swirl-search .search__input.sc-swirl-search::placeholder{color:var(--s-text-disabled)}.search__icon.sc-swirl-search{position:absolute;top:50%;left:var(--s-space-12);display:inline-flex;width:1.5rem;height:1.5rem;color:var(--s-icon-default);transform:translateY(-50%)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.search__icon.sc-swirl-search{width:1.25rem;height:1.25rem}}.search__input.sc-swirl-search{width:100%;height:2.5rem;padding-top:var(--s-space-8);padding-right:calc(var(--s-space-12) + 1.5rem + var(--s-space-8));padding-bottom:var(--s-space-8);padding-left:calc(var(--s-space-12) + 1.5rem + var(--s-space-8));border:none;border-radius:var(--s-border-radius-base);color:var(--s-text-default);background-color:var(--s-surface-raised-default);font:inherit;line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.search__input.sc-swirl-search:focus:not(:focus-visible){outline:none}.search__input.sc-swirl-search:focus-visible{outline-color:var(--s-focus-default)}.search__input.sc-swirl-search::-moz-placeholder{color:var(--s-text-subdued)}.search__input.sc-swirl-search::placeholder{color:var(--s-text-subdued)}.search__input.sc-swirl-search::-webkit-search-decoration,.search__input.sc-swirl-search::-webkit-search-cancel-button,.search__input.sc-swirl-search::-webkit-search-results-button,.search__input.sc-swirl-search::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.search__input.sc-swirl-search:not(:-moz-placeholder-shown)+.search__clear-button.sc-swirl-search{display:inline-flex}.search__input.sc-swirl-search:not(:placeholder-shown)+.search__clear-button.sc-swirl-search{display:inline-flex}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.search__input.sc-swirl-search{height:2.25rem;padding-left:calc(var(--s-space-8) + 1.5rem + var(--s-space-8));font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.search__clear-button.sc-swirl-search{position:absolute;top:50%;right:var(--s-space-12);display:none;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer;transform:translateY(-50%)}";
-const SwirlSearchStyle0 = swirlSearchCss;
 
 const SwirlSearch = class {
     constructor(hostRef) {
@@ -17,6 +14,9 @@ const SwirlSearch = class {
         this.inputFocus = index.createEvent(this, "inputFocus", 7);
         this.inputInput = index.createEvent(this, "inputInput", 7);
         this.valueChange = index.createEvent(this, "valueChange", 7);
+        this.clearButtonLabel = "Clear search term";
+        this.placeholder = "Search …";
+        this.variant = "filled";
         this.mediaQueryUnsubscribe = () => { };
         this.clear = () => {
             this.input.value = "";
@@ -35,15 +35,6 @@ const SwirlSearch = class {
         this.onInput = (event) => {
             this.inputInput.emit(event.target.value);
         };
-        this.autoFocus = undefined;
-        this.clearButtonLabel = "Clear search term";
-        this.disabled = undefined;
-        this.inputName = undefined;
-        this.inputId = undefined;
-        this.label = undefined;
-        this.placeholder = "Search …";
-        this.value = undefined;
-        this.variant = "filled";
     }
     componentDidLoad() {
         this.mediaQueryUnsubscribe = mediaQuery_service.DesktopMediaQuery.subscribe((isDesktop) => {
@@ -79,6 +70,6 @@ const SwirlSearch = class {
         return (index.h(index.Host, { key: '04565f70f475e763ae203358d16845ea9048145f' }, index.h("span", { key: 'b3993d970a907f89cb2baecacd7b19591e67aae5', class: className, ref: (el) => (this.iconEl = el) }, index.h("swirl-icon-search", { key: '8b6c8242900b52324da59c927c30de575c7c8bdc', "aria-hidden": "true", class: "search__icon" }), index.h("input", { key: '782d6bfade76cfb681779b575642b296b2fe63b4', "aria-disabled": this.disabled ? "true" : undefined, "aria-label": this.label, autoComplete: "off", autoFocus: this.autoFocus, class: "search__input", disabled: this.disabled, id: this.inputId, inputMode: "search", name: this.inputName, onBlur: this.onBlur, onChange: this.onChange, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.input = el), type: "search", value: this.value }), !this.disabled && (index.h("button", { key: '1bfe8bd2cdf2f0b81e6be946f0f44869a89decfd', "aria-label": this.clearButtonLabel, class: "search__clear-button", onClick: this.clear, type: "button" }, index.h("swirl-icon-cancel", { key: '4a67f82e770ac52ca730182218c0ff58b9bc2ad3' }))))));
     }
 };
-SwirlSearch.style = SwirlSearchStyle0;
+SwirlSearch.style = swirlSearchCss;
 
 exports.swirl_search = SwirlSearch;

package/dist/cjs/swirl-select.cjs.entry.js

@@ -1,19 +1,21 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
-const index$1 = require('./index-9f94303c.js');
-const utils = require('./utils-4f225daf.js');
+var index = require('./index-Cks2WRVX.js');
+var index$1 = require('./index-DcAhLZUH.js');
+var utils = require('./utils-Br2wWntR.js');
 
 const swirlSelectCss = ".sc-swirl-select-h{display:block;width:100%}.sc-swirl-select-h *.sc-swirl-select{box-sizing:border-box}.select.sc-swirl-select{position:relative;display:flex;width:100%}.select.sc-swirl-select .sc-swirl-select::part(popover__content){margin-top:var(--s-space-16)}@media (min-width: 768px){.select.sc-swirl-select .sc-swirl-select::part(popover__scroll-container){padding-top:0}}.select--placement-top-start.sc-swirl-select .sc-swirl-select::part(popover__content){margin-top:-2.25rem}.select--multi.sc-swirl-select .select__input.sc-swirl-select{position:absolute;width:100%;height:100%;pointer-events:none;opacity:0}.select--multi.sc-swirl-select .select__multi-select-values.sc-swirl-select{display:flex}.select--disabled.sc-swirl-select .select__input.sc-swirl-select{color:var(--s-text-disabled)}.select--disabled.sc-swirl-select .select__indicator.sc-swirl-select{color:var(--s-icon-disabled)}.select--inline.sc-swirl-select .select__indicator.sc-swirl-select{transform:translateY(-50%)}.select--standalone.sc-swirl-select{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.select--standalone.sc-swirl-select .select__indicator.sc-swirl-select{position:relative;top:auto;right:auto;cursor:pointer;transform:none}.select--standalone.sc-swirl-select .select__input.sc-swirl-select{padding-right:var(--s-space-8);font-weight:var(--s-font-weight-medium);cursor:pointer}.select--standalone.sc-swirl-select .select__value-container.sc-swirl-select{width:-webkit-min-content;width:-moz-min-content;width:min-content}.select--search-loading.sc-swirl-select .select__search-input.sc-swirl-select{padding-right:calc(var(--s-space-12) + 1.5rem + var(--s-space-8))}.select__resize-helper.sc-swirl-select{display:block;width:auto;height:0;margin:0;padding:0;padding-right:calc(1.5rem + var(--s-space-8));padding-right:var(--s-space-8);font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left;white-space:pre;white-space:pre;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__resize-helper.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__input.sc-swirl-select{display:block;overflow:hidden;width:100%;height:1.25rem;margin:0;padding:0;padding-right:calc(1.5rem + var(--s-space-8));border:none;background-color:transparent;font:inherit;line-height:var(--s-line-height-base);text-align:left;white-space:nowrap;text-overflow:ellipsis;cursor:default}.select__input.sc-swirl-select:focus{outline:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__input.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__multi-select-values.sc-swirl-select{display:none;overflow:hidden;width:100%;min-height:1.25rem;padding-right:calc(1.5rem + var(--s-space-8));flex-wrap:wrap;flex-shrink:0;gap:var(--s-space-8)}.select__multi-select-values.sc-swirl-select .sc-swirl-select::part(tag){height:1.25rem;padding:0 var(--s-space-4)}.select__indicator.sc-swirl-select{position:absolute;top:50%;right:0;display:inline-flex;color:var(--s-icon-default);transform:translateY(calc(-50% - var(--s-space-8)))}.select__search.sc-swirl-select{position:relative;display:flex;width:100%;padding:0.0625rem var(--s-space-8);border-bottom:0.0625rem solid var(--s-border-default);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.select__search.sc-swirl-select{position:sticky;z-index:1;top:0;padding-top:var(--s-space-8);padding-right:0.0625rem;padding-left:0.0625rem}}.select__search-icon.sc-swirl-select{position:absolute;top:50%;left:calc(var(--s-space-8) * 2);display:inline-flex;color:var(--s-icon-default);transform:translateY(-50%)}@media (min-width: 768px){.select__search-icon.sc-swirl-select{left:var(--s-space-12);margin-top:var(--s-space-4);padding:0.0625rem}}.select__search-input.sc-swirl-select{width:100%;height:2.5rem;padding-right:var(--s-space-12);padding-left:calc(var(--s-space-12) + 1.25rem + var(--s-space-8));align-items:center;border:none;color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.select__search-input.sc-swirl-select:focus:not(:focus-visible){outline:none}.select__search-input.sc-swirl-select:focus-visible{outline-color:var(--s-focus-default)}.select__search-input.sc-swirl-select::-moz-placeholder{color:var(--s-text-subdued)}.select__search-input.sc-swirl-select::placeholder{color:var(--s-text-subdued)}.select__search-input.sc-swirl-select::-webkit-search-decoration,.select__search-input.sc-swirl-select::-webkit-search-cancel-button,.select__search-input.sc-swirl-select::-webkit-search-results-button,.select__search-input.sc-swirl-select::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.select__search-input.sc-swirl-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.select__search-spinner.sc-swirl-select{position:absolute;top:50%;right:var(--s-space-12);display:inline-flex;transform:translateY(-50%)}@media (min-width: 768px){.select__search-spinner.sc-swirl-select{margin-top:var(--s-space-4)}}.select__empty-list-label.sc-swirl-select{padding:var(--s-space-12) var(--s-space-12) 0}.select__empty-list-label.sc-swirl-select:not(:only-child){display:none}@media (min-width: 768px){.select__empty-list-label.sc-swirl-select{padding:var(--s-space-12) var(--s-space-12) var(--s-space-8)}}";
-const SwirlSelectStyle0 = swirlSelectCss;
 
 const SwirlSelect = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.searchChange = index.createEvent(this, "searchChange", 7);
         this.valueChange = index.createEvent(this, "valueChange", 7);
+        this.allowDeselect = true;
+        this.emptyListLabel = "No results found.";
+        this.searchInputLabel = "Search options";
+        this.selectId = Math.round(Math.random() * 1000000).toString();
+        this.options = [];
         this.select = (event) => {
             event.stopPropagation();
             this.value = event.detail;
@@ -64,25 +66,6 @@ const SwirlSelect = class {
         this.onSearchInput = (event) => {
             this.searchChange.emit(event.target.value);
         };
-        this.allowDeselect = true;
-        this.disabled = undefined;
-        this.emptyListLabel = "No results found.";
-        this.inline = undefined;
-        this.invalid = undefined;
-        this.label = undefined;
-        this.multiSelect = undefined;
-        this.required = undefined;
-        this.searchInputLabel = "Search options";
-        this.searchLoading = undefined;
-        this.searchPlaceholder = undefined;
-        this.selectId = Math.round(Math.random() * 1000000).toString();
-        this.standalone = undefined;
-        this.swirlAriaDescribedby = undefined;
-        this.value = undefined;
-        this.withSearch = undefined;
-        this.options = [];
-        this.open = undefined;
-        this.placement = undefined;
     }
     componentWillLoad() {
         queueMicrotask(() => {
@@ -154,6 +137,6 @@ const SwirlSelect = class {
         "value": ["onValueChange"]
     }; }
 };
-SwirlSelect.style = SwirlSelectStyle0;
+SwirlSelect.style = swirlSelectCss;
 
 exports.swirl_select = SwirlSelect;

package/dist/cjs/swirl-separator.cjs.entry.js

@@ -1,19 +1,15 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
-const index$1 = require('./index-9f94303c.js');
+var index = require('./index-Cks2WRVX.js');
+var index$1 = require('./index-DcAhLZUH.js');
 
 const swirlSeparatorCss = ":host{display:flex;width:100%;align-items:center;gap:var(--s-space-8)}:host *{box-sizing:border-box}:host(.separator--orientation-vertical){display:inline-flex;width:auto;flex-direction:column}:host(.separator--orientation-vertical) .separator__line{width:var(--s-border-width-default);height:100%;min-height:1.125rem}:host(.separator--color-strong) .separator__line{background-color:var(--s-border-strong)}:host(.separator--color-strong) .separator__label{color:var(--s-text-subdued)}:host(.separator--color-highlight) .separator__line{background-color:var(--s-border-highlight)}:host(.separator--color-highlight) .separator__label{color:var(--s-text-highlight)}.separator__line{display:block;width:100%;height:var(--s-border-width-default);background-color:var(--s-border-default)}.separator__label{flex-shrink:0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-size:var(--s-font-size-sm);color:var(--s-text-disabled)}";
-const SwirlSeparatorStyle0 = swirlSeparatorCss;
 
 const SwirlSeparator = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.borderColor = "default";
         this.color = "default";
-        this.label = undefined;
         this.orientation = "horizontal";
         this.spacing = "8";
     }
@@ -40,6 +36,6 @@ const SwirlSeparator = class {
         return (index.h(index.Host, { key: '2bb244ed44ae203e950deeacf824108dd5dca113', "aria-orientation": this.orientation, class: className, role: "separator", style: styles }, index.h("span", { key: '88d7f7383d3083f70164fb93548835085e15ce20', class: "separator__line" }), this.label && (index.h(index.Fragment, { key: '8f7500a0c14d5bfee5c7cf62839dac69c6587013' }, index.h("span", { key: '4be755e74288cf1f298f8a4c52da1205104c8752', class: "separator__label" }, this.label), index.h("span", { key: '8f2296aa2bb0480a971480618f9765c1a967ea8d', class: "separator__line" })))));
     }
 };
-SwirlSeparator.style = SwirlSeparatorStyle0;
+SwirlSeparator.style = swirlSeparatorCss;
 
 exports.swirl_separator = SwirlSeparator;

package/dist/cjs/swirl-shell-layout.cjs.entry.js

@@ -1,14 +1,11 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-2c919933.js');
-const index$1 = require('./index-9f94303c.js');
-const focusTrap_esm = require('./focus-trap.esm-a1e3774c.js');
-const utils = require('./utils-4f225daf.js');
+var index = require('./index-Cks2WRVX.js');
+var index$1 = require('./index-DcAhLZUH.js');
+var focusTrap_esm = require('./focus-trap.esm-kePK98yh.js');
+var utils = require('./utils-Br2wWntR.js');
 
 const swirlShellLayoutCss = ".sc-swirl-shell-layout-h{--swirl-shell-background:var(--s-surface-sunken-default);--swirl-shell-text-color:var(--s-text-default);--swirl-shell-header-height:3.25rem;--swirl-shell-collapsed-nav-width:4rem;--swirl-shell-extended-nav-width:18rem;--swirl-shell-sidebar-width:21rem;display:flex;width:100%;height:100%}.sc-swirl-shell-layout-h *.sc-swirl-shell-layout{box-sizing:border-box}.shell-layout.sc-swirl-shell-layout{display:grid;overflow:hidden;width:100%;min-height:100%;background-color:var(--swirl-shell-background);transition:grid-template-columns 0.1s;grid-template-columns:0 1fr 0;grid-template-rows:1fr;grid-template-areas:\"nav main\"}@media (prefers-reduced-motion){.shell-layout.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout.sc-swirl-shell-layout{padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);-moz-column-gap:var(--s-space-8);column-gap:var(--s-space-8);grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr 0;grid-template-rows:var(--swirl-shell-header-height) 1fr;grid-template-areas:\"header header header\"\n      \"nav main sidebar\"}}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout{border-bottom:none;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-action-primary-hovered)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-action-primary-pressed)}.shell-layout--branded-header.sc-swirl-shell-layout .shell-layout__header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-action-primary-default)}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{scrollbar-width:none}.shell-layout--navigation-collapsed.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout::-webkit-scrollbar{width:0;background:transparent;-webkit-appearance:none}}.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout--navigation-collapsed .shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul,.shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{max-width:100%;max-height:3rem;flex-basis:100%}@media (min-width: 992px){.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr 0}}@media (min-width: 1440px){.shell-layout--sidebar-active.shell-layout--navigation-collapsed.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-collapsed-nav-width) 1fr var(\n          --swirl-shell-sidebar-width\n        )}}@media (min-width: 1440px){.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__main.sc-swirl-shell-layout{width:100%}}.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__sidebar.sc-swirl-shell-layout{overflow:initial}@media (min-width: 992px){.shell-layout--sidebar-active.sc-swirl-shell-layout .shell-layout__sidebar-body.sc-swirl-shell-layout{border:0.0625rem solid var(--s-border-default);transform:translate3d(0, 0, 0)}}@media (min-width: 1440px){.shell-layout--sidebar-active.sc-swirl-shell-layout{grid-template-columns:var(--swirl-shell-extended-nav-width) 1fr var(\n        --swirl-shell-sidebar-width\n      )}}.sc-swirl-shell-layout:not(.shell-layout--sidebar-active) .shell-layout__sidebar.sc-swirl-shell-layout{animation:shell-layout-no-overflow-after-transition 0.1s;animation-fill-mode:forwards}.shell-layout--sidebar-scrollable.sc-swirl-shell-layout:not(.shell-layout--sidebar-scrolled-to-top) .shell-layout__sidebar-app-bar.sc-swirl-shell-layout{border-bottom-color:var(--s-border-default)}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:translate3d(0, 0, 0);box-shadow:var(--s-shadow-level-3)}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__nav.sc-swirl-shell-layout{transform:none;box-shadow:none}}.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:block}@media (min-width: 992px){.shell-layout--mobile-navigation-active.sc-swirl-shell-layout .shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{display:none}}.shell-layout--has-secondary-nav.sc-swirl-shell-layout .shell-layout__secondary-nav.sc-swirl-shell-layout{display:block}.shell-layout--secondary-nav-collapsed.sc-swirl-shell-layout .shell-layout__secondary-nav-items.sc-swirl-shell-layout{display:none}.shell-layout__header.sc-swirl-shell-layout{position:relative;display:none;width:calc(100% + var(--s-space-8));padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;color:var(--swirl-shell-text-color);grid-area:header}@media (min-width: 992px){.shell-layout__header.sc-swirl-shell-layout{display:flex}}.shell-layout__skip-link.sc-swirl-shell-layout{position:absolute;z-index:9;top:0;left:0;padding:var(--s-space-4);border:none;color:var(--swirl-shell-text-color);background-color:var(--swirl-shell-background);font:inherit;cursor:pointer}.shell-layout__skip-link.sc-swirl-shell-layout:not(:focus):not(:active){position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(50%)}.shell-layout__header-left.sc-swirl-shell-layout{display:flex;padding-left:var(--s-space-2);flex-basis:8rem;flex-shrink:0;align-items:center;gap:var(--s-space-8)}.shell-layout__header-right.sc-swirl-shell-layout{--swirl-ghost-button-background-default:var(--s-surface-sunken-default);--swirl-ghost-button-background-hovered:var(--s-surface-sunken-hovered);--swirl-ghost-button-background-pressed:var(--s-surface-sunken-pressed);display:flex;flex-basis:8rem;flex-shrink:0;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__logo.sc-swirl-shell-layout{display:flex;flex-grow:1;justify-content:center;align-items:center}.shell-layout__logo.sc-swirl-shell-layout-s>a{display:flex}.shell-layout__logo.sc-swirl-shell-layout-s>a img,.shell-layout__logo.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__header-tool.sc-swirl-shell-layout{position:relative;width:2.25rem;height:2.25rem;padding:var(--s-space-8);flex-shrink:0;border:none;border-radius:var(--s-border-radius-sm);color:var(--swirl-shell-text-color);background-color:var(--s-surface-sunken-default);font:inherit;cursor:pointer}.shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-surface-sunken-hovered)}.shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-surface-sunken-pressed)}.shell-layout__header-tool.sc-swirl-shell-layout:focus{outline:none}.shell-layout__header-tool.sc-swirl-shell-layout:focus-visible{box-shadow:0 0 0 0.125rem var(--s-focus-default)}.shell-layout__header-tool.sc-swirl-shell-layout swirl-badge.sc-swirl-shell-layout{--swirl-badge-border-color:var(--s-surface-sunken-default);position:absolute;top:var(--s-space-2);right:var(--s-space-2);padding-right:var(--s-space-2);transform:translate3d(0.1875rem, 0, 0)}.shell-layout__sidebar-toggle.sc-swirl-shell-layout{display:none}@media (min-width: 992px){.shell-layout__sidebar-toggle.sc-swirl-shell-layout{display:block}}.shell-layout__nav.sc-swirl-shell-layout{position:fixed;z-index:9;top:0;bottom:0;left:0;overflow-x:hidden;overflow-y:auto;width:100%;max-width:18.75rem;color:var(--swirl-shell-text-color);background-color:var(--s-surface-overlay-default);transition:transform 0.1s, box-shadow 0.1s, width 0.1s;transform:translate3d(-100%, 0, 0);grid-area:nav}@media (prefers-reduced-motion){.shell-layout__nav.sc-swirl-shell-layout{transition:none}}@media (min-width: 992px){.shell-layout__nav.sc-swirl-shell-layout{position:relative;max-width:none;padding-top:0;padding-right:var(--s-space-4);padding-bottom:var(--s-space-8);padding-left:var(--s-space-12);background-color:var(--swirl-shell-background);transform:none;box-shadow:none;inset:auto}}.shell-layout__mobile-header.sc-swirl-shell-layout{display:flex;min-height:3.5rem;margin-bottom:var(--s-space-8);padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);justify-content:space-between;align-items:center;border-bottom:0.0625rem solid var(--s-border-default)}.shell-layout__mobile-header.sc-swirl-shell-layout-s>img{max-height:1.75rem}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout{background-color:var(--s-surface-overlay-default)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:hover{background-color:var(--s-surface-overlay-hovered)}.shell-layout__mobile-header.sc-swirl-shell-layout .shell-layout__header-tool.sc-swirl-shell-layout:active{background-color:var(--s-surface-overlay-pressed)}@media (min-width: 992px){.shell-layout__mobile-header.sc-swirl-shell-layout{display:none}}.shell-layout__mobile-header-tools.sc-swirl-shell-layout{display:flex;justify-content:flex-end;align-items:center;gap:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout{padding:var(--s-space-8)}.shell-layout__nav-body.sc-swirl-shell-layout-s ul{margin:0;padding:0;list-style:none}.shell-layout__nav-body.sc-swirl-shell-layout-s li{display:flex}@media (min-width: 992px){.shell-layout__nav-body.sc-swirl-shell-layout{padding:0}}.shell-layout__mobile-nav-backdrop.sc-swirl-shell-layout{position:fixed;z-index:8;display:none;background-color:rgba(0, 0, 0, 0.25);animation:shell-layout-backdrop-fade-in 0.1s;inset:0}.shell-layout__secondary-nav.sc-swirl-shell-layout{display:none}.shell-layout__secondary-nav-items.sc-swirl-shell-layout-s>ul,.shell-layout__secondary-nav-items .sc-swirl-shell-layout-s>ul{display:flex;flex-direction:column;gap:var(--s-space-2)}.shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul,.shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul{flex-wrap:wrap;flex-direction:row;gap:var(--s-space-16)}.shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul,.shell-layout__secondary-nav-items--grid-view.sc-swirl-shell-layout-s>ul>*,.shell-layout__secondary-nav-items--grid-view .sc-swirl-shell-layout-s>ul>*{min-width:0;max-height:none;flex-basis:calc(50% - var(--s-space-8))}.shell-layout__main.sc-swirl-shell-layout{overflow:hidden;background-color:var(--s-background-default);grid-area:main}@media (min-width: 992px){.shell-layout__main.sc-swirl-shell-layout{width:calc(100% + var(--s-space-8));border:0.0625rem solid var(--s-border-default);border-radius:var(--s-border-radius-sm)}}.shell-layout__sidebar.sc-swirl-shell-layout{position:relative;display:none;min-height:0;grid-area:sidebar}@media (min-width: 992px){.shell-layout__sidebar.sc-swirl-shell-layout{display:block}}.shell-layout__sidebar-body.sc-swirl-shell-layout{z-index:1;display:flex;width:var(--swirl-shell-sidebar-width);height:100%;border-radius:var(--s-border-radius-sm);background-color:var(--s-background-default);flex-direction:column}@media (min-width: 992px){.shell-layout__sidebar-body.sc-swirl-shell-layout{position:absolute;top:0;right:0;bottom:0;transition:transform 0.1s;transform:translate3d(calc(100% + var(--s-space-24)), 0, 0);box-shadow:var(--s-shadow-level-3)}}@media (min-width: 1440px){.shell-layout__sidebar-body.sc-swirl-shell-layout{position:relative;transform:none;box-shadow:none;inset:auto}}@media (prefers-reduced-motion){.shell-layout__sidebar-body.sc-swirl-shell-layout{transition:none}}.shell-layout__sidebar-app-bar.sc-swirl-shell-layout{flex-grow:0;flex-shrink:0;border-bottom:var(--s-border-width-default) solid transparent}.shell-layout__sidebar-content.sc-swirl-shell-layout{overflow:auto;flex-grow:1}@keyframes shell-layout-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes shell-layout-no-overflow-after-transition{0%{overflow:initial}99%{overflow:initial}100%{overflow:hidden}}";
-const SwirlShellLayoutStyle0 = swirlShellLayoutCss;
 
 const SECONDARY_NAVIGATION_COLLAPSE_STORAGE_KEY = "SWIRL_SHELL_SECONDARY_NAVIGATION_COLLAPSE_STATE";
 const SECONDARY_NAVIGATION_VIEW_STORAGE_KEY = "SWIRL_SHELL_SECONDARY_NAVIGATION_VIEW_STATE";
@@ -19,6 +16,26 @@ const SwirlShellLayout = class {
         index.registerInstance(this, hostRef);
         this.sidebarToggleClick = index.createEvent(this, "sidebarToggleClick", 7);
         this.skipLinkClick = index.createEvent(this, "skipLinkClick", 7);
+        this.browserBackButtonLabel = "Navigate back";
+        this.browserForwardButtonLabel = "Navigate forward";
+        this.collapseNavigationButtonLabel = "Collapse navigation";
+        this.enableSecondaryNavGridLayout = true;
+        this.expandNavigationButtonLabel = "Expand navigation";
+        this.gridNavLayoutToggleLabel = "Grid";
+        this.hideMobileNavigationButtonLabel = "Close navigation";
+        this.listNavLayoutToggleLabel = "List";
+        this.navigationLabel = "Main";
+        this.secondaryNavCollapseLabel = "Show less";
+        this.secondaryNavExpandLabel = "Show more";
+        this.sidebarToggleIcon = "notifications";
+        this.sidebarToggleLabel = "Toggle sidebar";
+        this.skipLinkLabel = "Skip to main content";
+        this.isDesktopViewport = true;
+        this.secondaryNavView = "list";
+        this.sidebarScrollState = {
+            scrollable: false,
+            scrolledToTop: false,
+        };
         this.collectNavItems = () => {
             this.mainNavItems = Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='nav'], [slot='nav'] swirl-shell-navigation-item"));
             this.secondaryNavItems = Array.from(this.el.querySelectorAll("swirl-shell-navigation-item[slot='secondary-nav'], [slot='secondary-nav'] swirl-shell-navigation-item"));
@@ -50,33 +67,6 @@ const SwirlShellLayout = class {
         this.onSidebarScroll = utils.debounce(() => {
             this.updateSidebarScrollState();
         }, 16);
-        this.brandedHeader = undefined;
-        this.browserBackButtonLabel = "Navigate back";
-        this.browserForwardButtonLabel = "Navigate forward";
-        this.collapseNavigationButtonLabel = "Collapse navigation";
-        this.enableSecondaryNavGridLayout = true;
-        this.expandNavigationButtonLabel = "Expand navigation";
-        this.gridNavLayoutToggleLabel = "Grid";
-        this.hideMobileNavigationButtonLabel = "Close navigation";
-        this.listNavLayoutToggleLabel = "List";
-        this.navigationLabel = "Main";
-        this.secondaryNavCollapseLabel = "Show less";
-        this.secondaryNavExpandLabel = "Show more";
-        this.sidebarActive = undefined;
-        this.sidebarToggleBadge = undefined;
-        this.sidebarToggleBadgeAriaLabel = undefined;
-        this.sidebarToggleIcon = "notifications";
-        this.sidebarToggleLabel = "Toggle sidebar";
-        this.skipLinkLabel = "Skip to main content";
-        this.isDesktopViewport = true;
-        this.mobileNavigationActive = undefined;
-        this.navigationCollapsed = undefined;
-        this.secondaryNavCollapsed = undefined;
-        this.secondaryNavView = "list";
-        this.sidebarScrollState = {
-            scrollable: false,
-            scrolledToTop: false,
-        };
     }
     componentWillLoad() {
         this.isDesktopViewport = utils.isDesktopViewport();
@@ -239,6 +229,6 @@ const SwirlShellLayout = class {
         "sidebarActive": ["watchSidebarActive"]
     }; }
 };
-SwirlShellLayout.style = SwirlShellLayoutStyle0;
+SwirlShellLayout.style = swirlShellLayoutCss;
 
 exports.swirl_shell_layout = SwirlShellLayout;