@getflip/swirl-components 0.12.0 → 0.14.0

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
 require('./_commonjsHelpers-a5111d61.js');
 

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
 require('./_commonjsHelpers-a5111d61.js');
 
@@ -12,9 +12,6 @@ const SwirlSwitch = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.valueChange = index.createEvent(this, "valueChange", 7);
-    this.checked = false;
-    this.disabled = false;
-    this.size = "m";
     this.dragging = false;
     this.recentlyDragged = false;
     this.onChange = () => {
@@ -71,6 +68,13 @@ const SwirlSwitch = class {
       }
       this.thumb.style.left = `${pos}px`;
     };
+    this.checked = false;
+    this.disabled = false;
+    this.inputId = undefined;
+    this.inputName = undefined;
+    this.label = undefined;
+    this.size = "m";
+    this.value = undefined;
   }
   onWindowPointerUp() {
     this.onEndDrag();

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
 require('./_commonjsHelpers-a5111d61.js');
 
@@ -11,6 +11,9 @@ const swirlTabCss = ":host{display:block;width:100%}:host *{box-sizing:border-bo
 const SwirlTab = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.active = undefined;
+    this.label = undefined;
+    this.tabId = undefined;
   }
   render() {
     const className = index$1.classnames("tab", { "tab--active": this.active });

package/dist/cjs/swirl-table-cell.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 
 const swirlTableCellCss = ":host{display:flex;overflow:auto;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);flex-basis:0;flex-grow:1;flex-shrink:1;align-items:center;background-color:var(--s-background-default);word-break:break-word;-webkit-hyphens:auto;hyphens:auto;transition:box-shadow 0.15s}:host(.table-cell--has-shadow-right){box-shadow:var(--swirl-table-sticky-right-shadow)}:host(.table-cell--has-shadow-left){box-shadow:var(--swirl-table-sticky-left-shadow)}:host(:first-child){border-left:var(--s-border-width-default) solid var(--s-border-default)}:host(:last-child){border-right:var(--s-border-width-default) solid var(--s-border-default)}:host *{box-sizing:border-box}";
 

package/dist/cjs/swirl-table-column.cjs.entry.js

@@ -2,14 +2,19 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 
 const swirlTableColumnCss = ":host{display:flex;overflow:hidden;padding-top:var(--s-space-12);padding-right:var(--s-space-16);padding-bottom:var(--s-space-12);padding-left:var(--s-space-16);flex-basis:0;flex-grow:1;flex-shrink:1;align-items:center;border-top:var(--s-border-width-default) solid var(--s-border-default);border-bottom:var(--s-border-width-default) solid var(--s-border-default);color:var(--s-text-subdued);background-color:var(--s-background-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);white-space:nowrap;letter-spacing:var(--s-letter-spacing-tighter);text-overflow:ellipsis;transition:box-shadow 0.15s;gap:var(--s-space-8)}:host(:first-child){border-left:var(--s-border-width-default) solid var(--s-border-default)}:host(:last-child){border-right:var(--s-border-width-default) solid var(--s-border-default)}:host(.table-column--has-shadow-right){box-shadow:var(--swirl-table-sticky-right-shadow)}:host(.table-column--has-shadow-left){box-shadow:var(--swirl-table-sticky-left-shadow)}:host *{box-sizing:border-box}.table-column__sort-indicator{display:inline-flex;width:1.25rem;height:1.25rem;flex-grow:0;flex-shrink:0}";
 
 const SwirlTableColumn = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.sort = undefined;
+    this.sortable = undefined;
+    this.maxWidth = undefined;
     this.minWidth = "fit-content";
+    this.sticky = undefined;
+    this.width = undefined;
   }
   render() {
     const styles = {

package/dist/cjs/swirl-table-row-group.cjs.entry.js

@@ -2,13 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 
 const swirlTableRowGroupCss = ":host{position:relative;z-index:1;display:block}:host *{box-sizing:border-box}.table-row-group__header-row{padding:var(--s-space-12) var(--s-space-16);border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-surface-raised-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm)}@media (min-width: 768px){.table-row-group__label{position:sticky;left:var(--s-space-16)}}";
 
 const SwirlTableRowGroup = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.label = undefined;
   }
   render() {
     const rowspan = this.el.querySelectorAll("swirl-table-row").length;

package/dist/cjs/swirl-table-row.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
 require('./_commonjsHelpers-a5111d61.js');
 
@@ -11,6 +11,8 @@ const swirlTableRowCss = ":host{display:flex}:host(.table-row--highlighted){--sw
 const SwirlTableRow = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.highlighted = undefined;
+    this.index = undefined;
   }
   render() {
     const className = index$1.classnames("table-row", {

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

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
-const utils = require('./utils-9c9476b4.js');
+const index = require('./index-83363034.js');
+const utils = require('./utils-a07ee0db.js');
 
 /* global setTimeout, clearTimeout */
 
@@ -81,7 +81,6 @@ const swirlTableCss = ":host{position:relative;display:block}:host *{box-sizing:
 const SwirlTable = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.emptyStateLabel = "No results found.";
     this.updateLayout = dist(async () => {
       await this.resetEmptyRowStyles();
       await this.resetRowGroupStyles();
@@ -95,6 +94,13 @@ const SwirlTable = class {
     this.onScroll = () => {
       this.updateScrolledState();
     };
+    this.caption = undefined;
+    this.emptyStateLabel = "No results found.";
+    this.label = undefined;
+    this.empty = undefined;
+    this.scrollable = undefined;
+    this.scrolled = undefined;
+    this.scrolledToEnd = undefined;
   }
   async componentDidRender() {
     await this.updateLayout();

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
 require('./_commonjsHelpers-a5111d61.js');
 
@@ -23,6 +23,9 @@ const SwirlTabs = class {
         this.activateNextTab();
       }
     };
+    this.initialTab = undefined;
+    this.label = undefined;
+    this.activeTab = undefined;
   }
   componentWillLoad() {
     this.collectTabs();

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
 require('./_commonjsHelpers-a5111d61.js');
 
@@ -12,12 +12,14 @@ const SwirlTag = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.remove = index.createEvent(this, "remove", 7);
-    this.intent = "default";
-    this.removalButtonLabel = "Remove";
     this.onRemove = (event) => {
       var _a;
       (_a = this.remove) === null || _a === void 0 ? void 0 : _a.emit(event);
     };
+    this.intent = "default";
+    this.label = undefined;
+    this.removable = undefined;
+    this.removalButtonLabel = "Remove";
   }
   render() {
     const className = index$1.classnames("tag", `tag--intent-${this.intent}`);

package/dist/cjs/swirl-text-input.cjs.entry.js

@@ -2,12 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
-const utils = require('./utils-9c9476b4.js');
+const utils = require('./utils-a07ee0db.js');
 require('./_commonjsHelpers-a5111d61.js');
 
-const swirlTextInputCss = ".sc-swirl-text-input-h{display:block;width:100%}.sc-swirl-text-input-h *.sc-swirl-text-input{box-sizing:border-box}.text-input.sc-swirl-text-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);font:inherit;line-height:var(--s-line-height-sm)}.text-input--clearable.sc-swirl-text-input,.text-input--type-number.sc-swirl-text-input,.text-input--type-password.sc-swirl-text-input{padding-right:calc(1.5rem + var(--s-space-8))}.text-input--show-password.sc-swirl-text-input .text-input__input.sc-swirl-text-input{width:100%}.text-input--disabled.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{color:var(--s-text-disabled)}.text-input__input.sc-swirl-text-input{display:inline-flex;width:100%;max-height:13.75rem;margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);resize:none;caret-color:var(--s-border-highlight)}.text-input__input.sc-swirl-text-input:focus{outline:none}.text-input__input.sc-swirl-text-input:disabled{color:var(--s-text-disabled);background-color:transparent}.text-input__input.sc-swirl-text-input::-webkit-outer-spin-button,.text-input__input.sc-swirl-text-input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.text-input__input[type=\"number\"].sc-swirl-text-input{-moz-appearance:textfield}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__input.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}input.text-input__input.sc-swirl-text-input:not([type=\"password\"]){width:0.25rem;min-width:0.25rem}.text-input--disable-dynamic-width.sc-swirl-text-input input.text-input__input.sc-swirl-text-input:not([type=\"password\"]){width:100%;min-width:0}.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__clear-button.sc-swirl-text-input:focus:not(:focus-visible),.text-input__password-toggle.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__clear-button.sc-swirl-text-input:focus-visible,.text-input__password-toggle.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{top:-0.625rem}}.text-input__stepper.sc-swirl-text-input{position:absolute;top:-1.4375rem;right:0;display:flex;flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__stepper.sc-swirl-text-input{top:-1.25rem}}.text-input__step-button.sc-swirl-text-input{display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__step-button.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__step-button.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}.text-input__character-counter.sc-swirl-text-input{position:absolute;top:-1.375rem;right:0;display:flex;color:var(--s-text-subdued);line-height:var(--s-line-height-sm);flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__character-counter.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input__prefix.sc-swirl-text-input{padding-right:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}.text-input__suffix.sc-swirl-text-input{padding-left:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}";
+const swirlTextInputCss = ".sc-swirl-text-input-h{display:block;width:100%}.sc-swirl-text-input-h *.sc-swirl-text-input{box-sizing:border-box}.text-input.sc-swirl-text-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);font:inherit;line-height:var(--s-line-height-sm)}.text-input--clearable.sc-swirl-text-input,.text-input--type-number.sc-swirl-text-input,.text-input--type-password.sc-swirl-text-input{padding-right:calc(1.5rem + var(--s-space-8))}.text-input--show-password.sc-swirl-text-input .text-input__input.sc-swirl-text-input{width:100%}.text-input--disabled.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{color:var(--s-text-disabled)}.text-input--inline.sc-swirl-text-input .text-input__stepper.sc-swirl-text-input{display:none}.text-input--inline.sc-swirl-text-input .text-input__clear-button.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__password-toggle.sc-swirl-text-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--inline.sc-swirl-text-input .text-input__clear-button.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__password-toggle.sc-swirl-text-input{top:0}}.text-input--inline.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{top:0}.text-input__input.sc-swirl-text-input{display:inline-flex;width:100%;max-height:13.75rem;margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);resize:none;caret-color:var(--s-border-highlight)}.text-input__input.sc-swirl-text-input:focus{outline:none}.text-input__input.sc-swirl-text-input:disabled{color:var(--s-text-disabled);background-color:transparent}.text-input__input.sc-swirl-text-input::-webkit-outer-spin-button,.text-input__input.sc-swirl-text-input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.text-input__input[type=\"number\"].sc-swirl-text-input{-moz-appearance:textfield}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__input.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}input.text-input__input.sc-swirl-text-input:not([type=\"password\"]){width:0.25rem;min-width:0.25rem}.text-input--disable-dynamic-width.sc-swirl-text-input input.text-input__input.sc-swirl-text-input:not([type=\"password\"]){width:100%;min-width:0}.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__clear-button.sc-swirl-text-input:focus:not(:focus-visible),.text-input__password-toggle.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__clear-button.sc-swirl-text-input:focus-visible,.text-input__password-toggle.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{top:-0.625rem}}.text-input__stepper.sc-swirl-text-input{position:absolute;top:-1.4375rem;right:0;display:flex;flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__stepper.sc-swirl-text-input{top:-1.25rem}}.text-input__step-button.sc-swirl-text-input{display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__step-button.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__step-button.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}.text-input__character-counter.sc-swirl-text-input{position:absolute;top:-1.375rem;right:0;display:flex;color:var(--s-text-subdued);line-height:var(--s-line-height-sm);flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__character-counter.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input__prefix.sc-swirl-text-input{padding-right:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}.text-input__suffix.sc-swirl-text-input{padding-left:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}";
 
 const SwirlTextInput = class {
   constructor(hostRef) {
@@ -15,13 +15,6 @@ const SwirlTextInput = class {
     this.inputBlur = index.createEvent(this, "inputBlur", 7);
     this.inputFocus = index.createEvent(this, "inputFocus", 7);
     this.valueChange = index.createEvent(this, "valueChange", 7);
-    this.autoComplete = "on";
-    this.clearButtonLabel = "Clear input";
-    this.rows = 1;
-    this.passwordToggleLabel = "Toggle password display";
-    this.type = "text";
-    this.iconSize = 24;
-    this.showPassword = false;
     this.desktopMediaQuery = utils.getDesktopMediaQuery();
     this.desktopMediaQueryHandler = (event) => {
       this.updateIconSize(event.matches);
@@ -85,6 +78,36 @@ const SwirlTextInput = class {
       }
       this.showPassword = !this.showPassword;
     };
+    this.autoComplete = "on";
+    this.autoFocus = undefined;
+    this.autoSelect = undefined;
+    this.clearable = undefined;
+    this.clearButtonLabel = "Clear input";
+    this.disabled = undefined;
+    this.disableDynamicWidth = undefined;
+    this.swirlAriaAutocomplete = undefined;
+    this.swirlAriaControls = undefined;
+    this.swirlAriaDescribedby = undefined;
+    this.swirlAriaExpanded = undefined;
+    this.swirlRole = undefined;
+    this.inline = undefined;
+    this.invalid = undefined;
+    this.maxLength = undefined;
+    this.max = undefined;
+    this.min = undefined;
+    this.mode = undefined;
+    this.prefixLabel = undefined;
+    this.required = undefined;
+    this.rows = 1;
+    this.showCharacterCounter = undefined;
+    this.spellCheck = undefined;
+    this.suffixLabel = undefined;
+    this.step = undefined;
+    this.passwordToggleLabel = "Toggle password display";
+    this.type = "text";
+    this.value = undefined;
+    this.iconSize = 24;
+    this.showPassword = false;
   }
   componentDidLoad() {
     var _a, _b;
@@ -140,6 +163,7 @@ const SwirlTextInput = class {
       "text-input--clearable": this.clearable,
       "text-input--disabled": this.disabled,
       "text-input--disable-dynamic-width": this.disableDynamicWidth,
+      "text-input--inline": this.inline,
       "text-input--show-password": this.type === "password" && this.showPassword,
     });
     return (index.h(index.Host, null, index.h("div", { class: className }, this.prefixLabel && (index.h("span", { class: "text-input__prefix" }, this.prefixLabel)), index.h(Tag, { "aria-autocomplete": this.swirlAriaAutocomplete, "aria-controls": this.swirlAriaControls, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-expanded": this.swirlAriaExpanded, "aria-invalid": ariaInvalid, autoComplete: this.autoComplete, autoFocus: this.autoFocus, class: "text-input__input", disabled: this.disabled, inputMode: this.mode, maxLength: this.maxLength, max: this.type === "number" ? this.max : undefined, min: this.type === "number" ? this.min : undefined, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, onKeyPress: this.onKeyPress, ref: (el) => (this.inputEl = el), required: this.required, role: this.swirlRole, rows: this.rows > 1 ? this.rows : undefined, spellcheck: this.spellCheck, step: this.type === "number" ? this.step : undefined, type: type, value: this.rows === 1 ? this.value : undefined }, this.rows > 1 && this.value), this.suffixLabel && (index.h("span", { class: "text-input__suffix" }, this.suffixLabel)), showClearButton && (index.h("button", { "aria-label": this.clearButtonLabel, class: "text-input__clear-button", onClick: this.clear, type: "button" }, index.h("swirl-icon-cancel", { size: this.iconSize }))), showPasswordToggle && (index.h("button", { "aria-label": this.passwordToggleLabel, class: "text-input__password-toggle", onClick: this.togglePassword, type: "button" }, this.showPassword ? (index.h("swirl-icon-visibility-off", { size: this.iconSize })) : (index.h("swirl-icon-visibility", { size: this.iconSize })))), showStepper && (index.h("span", { class: "text-input__stepper" }, index.h("button", { "aria-hidden": "true", class: "text-input__step-button", onClick: this.increaseValue, tabIndex: -1, type: "button" }, index.h("swirl-icon-expand-less", { size: this.iconSize })), index.h("button", { "aria-hidden": "true", class: "text-input__step-button", onClick: this.decreaseValue, tabIndex: -1, type: "button" }, index.h("swirl-icon-expand-more", { size: this.iconSize })))), this.showCharacterCounter && (index.h("span", { class: "text-input__character-counter" }, ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, " ", Boolean(this.maxLength) ? `/ ${this.maxLength}` : "")))));

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

@@ -2,27 +2,43 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
+const balancetext = require('./balancetext-7a0bdee3.js');
 require('./_commonjsHelpers-a5111d61.js');
 
-const swirlTextCss = ":host{display:block;max-width:100%}:host *{box-sizing:border-box}.text{margin:0;padding:0}.text--align-start{text-align:start}.text--align-center{text-align:center}.text--align-end{text-align:end}.text--color-default{color:var(--s-text-default)}.text--color-subdued{color:var(--s-text-subdued)}.text--color-critical{color:var(--s-text-critical)}.text--color-success{color:var(--s-text-success)}.text--color-warning{color:var(--s-text-warning)}.text--size-sm{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}.text--size-base{font-size:var(--s-font-size-base);line-height:var(--s-line-height-base)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text--size-base{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text--size-lg{font-size:var(--s-font-size-lg);line-height:var(--s-line-height-lg)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text--size-lg{font-size:var(--s-font-size-base);line-height:var(--s-line-height-base)}}.text--weight-normal{font-weight:var(--s-font-weight-normal)}.text--weight-medium{font-weight:var(--s-font-weight-medium)}.text--weight-semibold{font-weight:var(--s-font-weight-semibold)}.text--weight-bold{font-weight:var(--s-font-weight-bold)}.text--font-style-normal{font-style:normal}.text--font-style-italic{font-style:italic}.text--truncate{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}";
+const swirlTextCss = ".sc-swirl-text-h{display:block;max-width:100%}.sc-swirl-text-h *.sc-swirl-text{box-sizing:border-box}.text.sc-swirl-text{margin:0;padding:0}.text--align-start.sc-swirl-text{text-align:start}.text--align-center.sc-swirl-text{text-align:center}.text--align-end.sc-swirl-text{text-align:end}.text--color-default.sc-swirl-text{color:var(--s-text-default)}.text--color-subdued.sc-swirl-text{color:var(--s-text-subdued)}.text--color-critical.sc-swirl-text{color:var(--s-text-critical)}.text--color-success.sc-swirl-text{color:var(--s-text-success)}.text--color-warning.sc-swirl-text{color:var(--s-text-warning)}.text--size-sm.sc-swirl-text{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}.text--size-base.sc-swirl-text{font-size:var(--s-font-size-base);line-height:var(--s-line-height-base)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text--size-base.sc-swirl-text{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text--size-lg.sc-swirl-text{font-size:var(--s-font-size-lg);line-height:var(--s-line-height-lg)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text--size-lg.sc-swirl-text{font-size:var(--s-font-size-base);line-height:var(--s-line-height-base)}}.text--weight-normal.sc-swirl-text{font-weight:var(--s-font-weight-normal)}.text--weight-medium.sc-swirl-text{font-weight:var(--s-font-weight-medium)}.text--weight-semibold.sc-swirl-text{font-weight:var(--s-font-weight-semibold)}.text--weight-bold.sc-swirl-text{font-weight:var(--s-font-weight-bold)}.text--font-style-normal.sc-swirl-text{font-style:normal}.text--font-style-italic.sc-swirl-text{font-style:italic}.text--truncate.sc-swirl-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}";
 
 const SwirlText = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.align = "start";
     this.as = "p";
+    this.balance = undefined;
     this.color = "default";
     this.fontStyle = "normal";
     this.size = "base";
+    this.truncate = undefined;
     this.weight = "normal";
   }
+  componentDidRender() {
+    this.rebalance();
+  }
+  onWindowResize() {
+    this.rebalance();
+  }
+  rebalance() {
+    if (!this.balance || !Boolean(this.textEl)) {
+      return;
+    }
+    balancetext.balancetext(this.textEl);
+  }
   render() {
     const Tag = this.as;
     const className = index$1.classnames("text", `text--align-${this.align}`, `text--color-${this.color}`, `text--font-style-${this.fontStyle}`, `text--size-${this.size}`, `text--weight-${this.weight}`, { "text--truncate": this.truncate });
-    return (index.h(index.Host, null, index.h(Tag, { class: className, part: className }, index.h("slot", null))));
+    return (index.h(index.Host, null, index.h(Tag, { class: className, ref: (el) => (this.textEl = el) }, index.h("slot", null))));
   }
+  get el() { return index.getElement(this); }
 };
 SwirlText.style = swirlTextCss;
 

package/dist/cjs/swirl-theme-provider.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 
 /**
  * A simple guard function:
@@ -245,6 +245,7 @@ const SwirlThemeProvider = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.themeChange = index.createEvent(this, "themeChange", 7);
+    this.config = undefined;
   }
   componentWillLoad() {
     this.resolveConfig();

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
 require('./_commonjsHelpers-a5111d61.js');
 
@@ -11,8 +11,10 @@ const swirlThumbnailCss = ":host{display:inline-flex}:host *{box-sizing:border-b
 const SwirlThumbnail = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.alt = undefined;
     this.format = "landscape";
     this.size = "m";
+    this.src = undefined;
   }
   render() {
     const className = index$1.classnames("thumbnail", `thumbnail--format-${this.format}`, `thumbnail--size-${this.size}`);

package/dist/cjs/swirl-toast-provider.cjs.entry.js

@@ -2,15 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 
 const SwirlToastProvider = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.toasts = [];
     this.onDismiss = (event) => {
       this.toasts = [...this.toasts].filter((toast) => toast.toastId !== event.detail);
     };
+    this.globalDuration = undefined;
+    this.toasts = [];
   }
   /**
    * Clear all toasts

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

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
-const utils = require('./utils-9c9476b4.js');
+const utils = require('./utils-a07ee0db.js');
 require('./_commonjsHelpers-a5111d61.js');
 
 const swirlToastCss = ":host{display:flex}:host *{box-sizing:border-box}.toast{display:flex;width:100%;max-width:28rem;padding:var(--s-space-16);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);box-shadow:var(--s-shadow-level-2)}.toast--intent-critical{background-color:var(--s-surface-critical-default)}.toast--intent-success{background-color:var(--s-surface-success-default)}.toast__icon{display:inline-flex;margin-top:calc(-1 * var(--s-space-2));margin-right:0.625rem;flex-shrink:0}.toast__icon ::part(icon){color:var(--s-icon-on-status)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__icon{margin-top:0}}.toast__content{flex-grow:1;line-height:var(--s-line-height-base);text-align:left;align-self:flex-start}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.toast__content{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.toast__dismiss-button{display:inline-flex;min-width:1.5rem;height:1.5rem;margin-top:calc(-1 * var(--s-space-2));margin-left:var(--s-space-16);padding:0;flex-shrink:0;justify-content:center;align-items:center;border:none;color:var(--s-text-on-status);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-semibold);cursor:pointer}.toast__dismiss-button ::part(icon){color:var(--s-icon-on-status)}";
@@ -13,8 +13,6 @@ const SwirlToast = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.dismiss = index.createEvent(this, "dismiss", 7);
-    this.accessibleDismissLabel = "Dismiss";
-    this.intent = "default";
     this.desktopMediaQuery = utils.getDesktopMediaQuery();
     this.desktopMediaQueryHandler = (event) => {
       this.forceIconProps(event.matches);
@@ -22,6 +20,13 @@ const SwirlToast = class {
     this.onDismiss = () => {
       this.dismiss.emit(this.toastId);
     };
+    this.accessibleDismissLabel = "Dismiss";
+    this.content = undefined;
+    this.dismissLabel = undefined;
+    this.duration = undefined;
+    this.icon = undefined;
+    this.intent = "default";
+    this.toastId = undefined;
   }
   watchDuration() {
     this.startTimer();

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

@@ -2,17 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
-const floatingUi_dom_esm = require('./floating-ui.dom.esm-75453e4e.js');
+const index = require('./index-83363034.js');
+const floatingUi_dom_esm = require('./floating-ui.dom.esm-35943202.js');
 
 const swirlTooltipCss = ":host{display:inline-flex}:host *{box-sizing:border-box}.tooltip{display:inline-flex}.tooltip .tooltip__reference{display:inline-flex}.tooltip__popper{position:fixed;z-index:var(--s-z-40);max-width:17.5rem}.tooltip__bubble{position:relative;display:block;padding-top:var(--s-space-8);padding-right:var(--s-space-12);padding-bottom:var(--s-space-8);padding-left:var(--s-space-12);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);line-height:var(--s-line-height-base);-webkit-animation:tooltip-fade-in 0.1s;animation:tooltip-fade-in 0.1s}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tooltip__bubble{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.tooltip__arrow{position:absolute;width:0.5rem;height:0.5rem;background-color:var(--s-surface-neutral-default)}@-webkit-keyframes tooltip-fade-in{from{opacity:0}to{opacity:1}}@keyframes tooltip-fade-in{from{opacity:0}to{opacity:1}}";
 
 const SwirlTooltip = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.delay = 300;
-    this.position = "top";
-    this.visible = false;
     this.onKeydown = (event) => {
       if (event.code === "Escape") {
         this.hide();
@@ -87,6 +84,11 @@ const SwirlTooltip = class {
         };
       }
     };
+    this.content = undefined;
+    this.delay = 300;
+    this.position = "top";
+    this.actualPosition = undefined;
+    this.visible = false;
   }
   watchPosition() {
     this.updateOptions();

package/dist/cjs/swirl-tree-navigation-item.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 const index$1 = require('./index-e038b0f7.js');
 require('./_commonjsHelpers-a5111d61.js');
 
@@ -17,6 +17,9 @@ const SwirlTreeNavigationItem = class {
         this.el.click();
       }
     };
+    this.active = undefined;
+    this.icon = undefined;
+    this.label = undefined;
   }
   render() {
     const className = index$1.classnames("tree-navigation-item", {

package/dist/cjs/swirl-video-thumbnail.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 
 const swirlVideoThumbnailCss = ":host {\n  display: flex;\n  width: 100%;\n}\n\n  :host * {\n    box-sizing: border-box;\n  }\n\n.video-thumbnail {\n  position: relative;\n  display: inline-flex;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  container-type: inline-size;\n  container-name: video-thumbnail;\n}\n\n.video-thumbnail:after {\n    position: absolute;\n    background-color: rgba(0, 0, 0, 0.05);\n    content: \"\";\n    inset: 0;\n  }\n\n.video-thumbnail:focus:not(:focus-visible) {\n    outline: none;\n  }\n\n.video-thumbnail:focus-visible {\n    outline-color: var(--s-focus-default);\n    outline-offset: var(--s-space-4);\n  }\n\n.video-thumbnail__image {\n  width: 100%;\n}\n\n.video-thumbnail__duration {\n  position: absolute;\n  bottom: var(--s-space-8);\n  left: var(--s-space-8);\n  padding: var(--s-space-2) var(--s-space-8);\n  border-radius: var(--s-border-radius-sm);\n  color: var(--s-text-on-image);\n  background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),\n    rgba(255, 255, 255, 0.1);\n  font-size: var(--s-font-size-sm);\n  font-weight: var(--s-font-weight-medium);\n  line-height: var(--s-line-height-sm);\n  letter-spacing: var(--s-letter-spacing-tighter);\n}\n\n.video-thumbnail__play-icon {\n  position: absolute;\n  z-index: 1;\n  top: 50%;\n  left: 50%;\n  width: 2.5rem;\n  height: 2.5rem;\n  transform: translate3d(-50%, -50%, 0);\n}\n\n@container video-thumbnail (min-width: 448px) {\n  .video-thumbnail__play-icon {\n    width: 3.5rem;\n    height: 4.5rem;\n  }\n}\n";
 
@@ -10,6 +10,9 @@ const SwirlVideoThumbnail = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.durationLabel = "Duration";
+    this.duration = undefined;
+    this.label = undefined;
+    this.src = undefined;
   }
   render() {
     return (index.h(index.Host, null, index.h("button", { "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", null, this.durationLabel), this.duration)), index.h("svg", { class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));

package/dist/cjs/swirl-visually-hidden.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-72831c5f.js');
+const index = require('./index-83363034.js');
 
 const swirlVisuallyHiddenCss = ":host{position:absolute;display:inline;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;word-wrap:normal;clip:rect(0, 0, 0, 0)}";
 

package/dist/cjs/{utils-9c9476b4.js → utils-a07ee0db.js}

@@ -1,5 +1,22 @@
 'use strict';
 
+function closestPassShadow(node, selector) {
+  if (!node) {
+    return null;
+  }
+  if (node instanceof ShadowRoot) {
+    return closestPassShadow(node.host, selector);
+  }
+  if (node instanceof HTMLElement) {
+    if (node.matches(selector)) {
+      return node;
+    }
+    else {
+      return closestPassShadow(node.parentNode, selector);
+    }
+  }
+  return closestPassShadow(node.parentNode, selector);
+}
 const getDesktopMediaQuery = () => document.documentElement.classList.contains("disable-desktop-style-tweaks")
   ? window.matchMedia(null)
   : window.matchMedia("(min-width: 992px) and (max-width: 1439px) and (hover: hover), (min-width: 1440px)");
@@ -67,6 +84,7 @@ function querySelectorAllDeep(root, selector) {
   return matches;
 }
 
+exports.closestPassShadow = closestPassShadow;
 exports.debounce = debounce;
 exports.getDesktopMediaQuery = getDesktopMediaQuery;
 exports.getVisibleHeight = getVisibleHeight;