@getflip/swirl-components-react 0.512.0 → 0.514.0

package/dist/swirl-resource-list-item.entry.0e0c800e.js

@@ -0,0 +1,102 @@
+import { r as k, c as n, h as e, H as x, g as y } from "./index.e0c6d71c.js";
+import { c as C } from "./index-orsBiyT_.fc4357c3.js";
+import { D as B } from "./media-query.service-CCYT6DU8.f0931fdc.js";
+import "react";
+import "react-dom";
+import "./utils-CCck-DTo.e4e43b6a.js";
+const z = () => '.sc-swirl-resource-list-item-h{position:relative;display:block;width:100%}.sc-swirl-resource-list-item-h *.sc-swirl-resource-list-item{box-sizing:border-box}[aria-selected="true"].sc-swirl-resource-list-item-h .resource-list-item.sc-swirl-resource-list-item{background-color:var(--swirl-resource-list-item-background-hovered)}[aria-selected="true"].sc-swirl-resource-list-item-h .resource-list-item.sc-swirl-resource-list-item .resource-list-item__media.sc-swirl-resource-list-item,[aria-selected="true"].sc-swirl-resource-list-item-h .resource-list-item.sc-swirl-resource-list-item .resource-list-item__meta.sc-swirl-resource-list-item{--swirl-avatar-background-color:var(--s-surface-raised-hovered)}.swirl-resource-list-item--drag.sc-swirl-resource-list-item-h{border-radius:var(--s-border-radius-sm);background-color:var(--s-translucent-medium-pressed)}.resource-list-item.sc-swirl-resource-list-item{position:relative;width:100%;display:flex;overflow:hidden;padding:var(--s-space-12) var(--s-space-8);gap:var(--s-space-12);border-radius:var(--s-border-radius-sm);background-color:var(--swirl-resource-list-item-background-default);--swirl-badge-border-color:transparent}.resource-list-item.sc-swirl-resource-list-item:has(.resource-list-item__content:focus-visible){background-color:var(--swirl-resource-list-item-background-hovered);outline-color:var(--s-focus-default);outline-style:solid;outline-width:0.125rem;z-index:1}.resource-list-item.sc-swirl-resource-list-item:not(.resource-list-item--has-control) .resource-list-item__control.sc-swirl-resource-list-item{display:none}.resource-list-item--interactive.sc-swirl-resource-list-item{cursor:pointer}.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{cursor:pointer}.resource-list-item--interactive.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item:disabled{cursor:default}.resource-list-item--interactive.resource-list-item--disabled.sc-swirl-resource-list-item{cursor:default}.resource-list-item--interactive.sc-swirl-resource-list-item:hover:not(.resource-list-item--disabled),.resource-list-item--interactive.sc-swirl-resource-list-item:focus-visible:not(.resource-list-item--disabled){background-color:var(--swirl-resource-list-item-background-hovered)}.resource-list-item--interactive.sc-swirl-resource-list-item:hover:not(.resource-list-item--disabled) .resource-list-item__media.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item:hover:not(.resource-list-item--disabled) .resource-list-item__meta.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item:focus-visible:not(.resource-list-item--disabled) .resource-list-item__media.sc-swirl-resource-list-item,.resource-list-item--interactive.sc-swirl-resource-list-item:focus-visible:not(.resource-list-item--disabled) .resource-list-item__meta.sc-swirl-resource-list-item{--swirl-avatar-background-color:var(--s-surface-raised-hovered)}.resource-list-item--interactive.sc-swirl-resource-list-item:active:not(.resource-list-item--disabled){background-color:var(--swirl-resource-list-item-background-pressed)}.resource-list-item--active.sc-swirl-resource-list-item{--swirl-badge-border-color:var(     --swirl-resource-list-item-background-hovered   );background-color:var(--swirl-resource-list-item-background-hovered)}.resource-list-item--checked.sc-swirl-resource-list-item .resource-list-item__checkbox.sc-swirl-resource-list-item{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.resource-list-item--compact.sc-swirl-resource-list-item{padding:var(--s-space-8)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item--compact.sc-swirl-resource-list-item{padding:var(--s-space-8)}}.resource-list-item--compact.sc-swirl-resource-list-item .resource-list-item__label-container.sc-swirl-resource-list-item{min-height:2rem}@media (min-width: 768px){.resource-list-item--selectable.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{padding-left:calc(var(--s-space-16) + 1.5rem + var(--s-space-12))}}.resource-list-item--selectable.sc-swirl-resource-list-item .resource-list-item__label-container.sc-swirl-resource-list-item{padding-right:calc(var(--s-space-16) + 1.5rem + var(--s-space-12))}@media (min-width: 768px){.resource-list-item--selectable.sc-swirl-resource-list-item .resource-list-item__label-container.sc-swirl-resource-list-item{padding-right:var(--s-space-16)}}.resource-list-item--label-weight-medium.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{font-weight:var(--s-font-weight-medium)}.resource-list-item--label-weight-semibold.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{font-weight:var(--s-font-weight-semibold)}.resource-list-item--label-weight-bold.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{font-weight:var(--s-font-weight-bold)}@media (hover: hover){.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:hover .resource-list-item__control.sc-swirl-resource-list-item,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus .resource-list-item__control.sc-swirl-resource-list-item,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus-within .resource-list-item__control.sc-swirl-resource-list-item{pointer-events:auto;opacity:1;position:static;transform:none;margin:calc(-1 * var(--s-space-4)) 0}.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:hover .resource-list-item__meta.sc-swirl-resource-list-item,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus .resource-list-item__meta.sc-swirl-resource-list-item,.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item:focus-within .resource-list-item__meta.sc-swirl-resource-list-item{margin-right:0;padding-right:0}.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item .resource-list-item__meta.sc-swirl-resource-list-item{margin-right:calc(-1 * var(--s-space-16));padding-right:var(--s-space-16);transition:margin 0.1s}.resource-list-item--show-control-on-focus.sc-swirl-resource-list-item .resource-list-item__control.sc-swirl-resource-list-item{pointer-events:none;opacity:0;position:absolute;top:50%;right:var(--s-space-8);transform:translateY(-50%);transition:opacity 0.1s}}.resource-list-item--draggable.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{padding-left:calc(var(--s-space-12) * 2 + 1.5rem)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item--draggable.sc-swirl-resource-list-item .resource-list-item__content.sc-swirl-resource-list-item{padding-left:calc(var(--s-space-12) * 2 + 1rem)}}.resource-list-item--dragging.sc-swirl-resource-list-item{z-index:1;border-radius:var(--s-border-radius-s);background-color:var(--s-state-pressed);box-shadow:0 0.0625rem 0.125rem rgba(25, 26, 28, 0.08),     0 0.25rem 2rem rgba(25, 26, 28, 0.16)}.resource-list-item--dragging.sc-swirl-resource-list-item:hover:not(.resource-list-item--disabled){background-color:var(--s-state-pressed)}.resource-list-item--disabled.resource-list-item--checked.sc-swirl-resource-list-item .resource-list-item__checkbox.sc-swirl-resource-list-item{border-color:var(--s-icon-disabled);background-color:var(--s-icon-disabled)}.resource-list-item--disabled.sc-swirl-resource-list-item .resource-list-item__checkbox.sc-swirl-resource-list-item{border-color:var(--s-icon-disabled);background-color:transparent}.resource-list-item--disabled.sc-swirl-resource-list-item .resource-list-item__checkbox-icon.sc-swirl-resource-list-item{color:var(--s-text-on-status)}.resource-list-item--wrap-description.sc-swirl-resource-list-item .resource-list-item__description.sc-swirl-resource-list-item{white-space:normal}.resource-list-item--wrap-label.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{white-space:normal}.resource-list-item--wrap-label-max-lines.sc-swirl-resource-list-item .resource-list-item__label.sc-swirl-resource-list-item{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;white-space:normal}.resource-list-item__content.sc-swirl-resource-list-item{--swirl-avatar-group-border-color:transparent;display:flex;width:100%;min-width:0;margin:0;padding:0;align-items:flex-start;border:none;color:var(--s-text-default);background:none;font:inherit;line-height:var(--s-line-height-sm);text-align:left;text-decoration:none;gap:var(--s-space-12)}.resource-list-item__content.sc-swirl-resource-list-item:focus,.resource-list-item__content.sc-swirl-resource-list-item:focus-visible{outline:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item__content.sc-swirl-resource-list-item{line-height:var(--s-line-height-base)}}.resource-list-item__media.sc-swirl-resource-list-item{display:inline-flex;flex-shrink:0}.resource-list-item__label-container.sc-swirl-resource-list-item{position:relative;display:flex;height:100%;min-width:0;min-height:3rem;padding-right:var(--s-space-16);justify-content:center;flex-direction:column}.resource-list-item__label.sc-swirl-resource-list-item{overflow:hidden;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);white-space:nowrap;text-overflow:ellipsis}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item__label.sc-swirl-resource-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.resource-list-item__description.sc-swirl-resource-list-item{overflow:hidden;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-item__menu-trigger.sc-swirl-resource-list-item{position:absolute;top:50%;right:var(--s-space-16);transform:translateY(-50%)}.resource-list-item__control.sc-swirl-resource-list-item{align-self:center}.resource-list-item__checkbox.sc-swirl-resource-list-item{position:absolute;top:50%;right:var(--s-space-16);display:flex;width:1.125rem;height:1.125rem;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s);transform:translateY(-50%);pointer-events:none}@media (min-width: 768px){.resource-list-item__checkbox.sc-swirl-resource-list-item{right:auto;left:calc(var(--s-space-16) - var(--s-space-2))}}.resource-list-item__checkbox-icon.sc-swirl-resource-list-item{display:inline-flex;width:1.0625rem;height:1.0625rem}.resource-list-item__checkbox-icon.sc-swirl-resource-list-item>*.sc-swirl-resource-list-item::part(icon),.resource-list-item__checkbox-icon.sc-swirl-resource-list-item>*.sc-swirl-resource-list-item [part~="icon"]{width:1.0625rem;height:1.0625rem}.resource-list-item__meta.sc-swirl-resource-list-item{display:flex;align-items:flex-end;color:var(--s-text-subdued);font-size:var(--s-font-size-sm);flex-direction:column;align-self:flex-start;gap:var(--s-space-2)}.resource-list-item__meta.sc-swirl-resource-list-item:not(:has(.resource-list-item__meta-text)){align-self:center}.resource-list-item__meta-text.sc-swirl-resource-list-item{line-height:var(--s-line-height-base);margin-top:var(--s-space-2);white-space:nowrap}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.resource-list-item__meta-text.sc-swirl-resource-list-item{line-height:var(--s-line-height-sm);margin-top:var(--s-space-4)}}.resource-list-item__badges.sc-swirl-resource-list-item{display:inline-flex;width:-moz-max-content;width:max-content}.resource-list-item__drag-handle.sc-swirl-resource-list-item{position:absolute;z-index:1;top:50%;left:var(--s-space-4);display:inline-flex;margin:0;padding:var(--s-space-8);flex-shrink:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:grab;transform:translateY(-50%)}.resource-list-item__drag-handle.sc-swirl-resource-list-item:active{cursor:grabbing}.resource-list-item__drag-handle.sc-swirl-resource-list-item:focus:not(:focus-visible){outline:none}.resource-list-item__drag-handle.sc-swirl-resource-list-item:focus-visible{outline-color:var(--s-focus-default)}', M = class {
+  constructor(i) {
+    k(this, i), this.toggleDrag = n(this, "toggleDrag", 7), this.valueChange = n(this, "valueChange", 7), this.checked = !1, this.dragHandleDescription = "Press spacebar to toggle grab", this.dragHandleLabel = "Move item", this.interactive = !0, this.labelWeight = "medium", this.labelTooltipPosition = "top", this.menuTriggerLabel = "Options", this.hasMedia = !1, this.iconSize = 24, this.elementId = crypto.randomUUID(), this.mediaQueryUnsubscribe = () => {
+    }, this.onClick = () => {
+      !this.selectable || (this.checked = !this.checked, this.valueChange.emit(this.checked));
+    }, this.onBlur = () => {
+      this.makeControlUnfocusable();
+    }, this.onFocus = () => {
+      this.makeControlFocusable();
+    }, this.onMenuTriggerClick = (s) => {
+      this.disabled && !Boolean(this.href) && s.stopPropagation();
+    }, this.onDragHandleKeyDown = (s) => {
+      (s.code === "Space" || s.code === "Enter") && (s.preventDefault(), this.toggleDrag.emit(this.el));
+    }, this.onControlClick = (s) => {
+      s.preventDefault(), s.stopPropagation();
+    };
+  }
+  componentWillLoad() {
+    this.updateMediaState();
+  }
+  componentDidLoad() {
+    var i;
+    this.parentSemantics = (i = this.el.closest("swirl-resource-list")) == null ? void 0 : i.semantics, this.mediaQueryUnsubscribe = B.subscribe((s) => {
+      this.forceIconProps(s), this.updateIconSize(s);
+    }), this.makeControlUnfocusable(), Boolean(this.menuTriggerId) && console.warn('[Swirl] The "menu-trigger-id" prop of swirl-resource-list-item is deprecated and will be removed with the next major release. Please use the "control" slot to add a menu button instead. https://swirl-storybook.flip-app.dev/?path=/docs/components-swirlresourcelistitem--docs');
+  }
+  disconnectedCallback() {
+    this.mediaQueryUnsubscribe();
+  }
+  get hasBadges() {
+    return Boolean(this.el.querySelector("[slot='badges']"));
+  }
+  get showMeta() {
+    return (Boolean(this.meta) || this.hasBadges) && !this.selectable;
+  }
+  forceIconProps(i) {
+    var t;
+    const s = (t = this.iconEl) == null ? void 0 : t.children[0];
+    s == null || s.setAttribute("size", i ? "20" : "24");
+  }
+  updateIconSize(i) {
+    this.iconSize = i ? 20 : 24;
+  }
+  updateMediaState() {
+    const i = this.el.querySelector('[slot="media"]'), s = Boolean(i);
+    s !== this.hasMedia && (this.hasMedia = s);
+  }
+  getControl() {
+    return this.el.querySelector('[slot="control"] button');
+  }
+  makeControlFocusable() {
+    if (this.parentSemantics !== "grid")
+      return;
+    const i = this.getControl();
+    !Boolean(i) || (i.tabIndex = 0);
+  }
+  makeControlUnfocusable() {
+    if (this.parentSemantics !== "grid")
+      return;
+    const i = this.getControl();
+    !Boolean(i) || (i.tabIndex = -1);
+  }
+  render() {
+    var a;
+    const i = !this.interactive && !this.selectable ? "div" : Boolean(this.href) && !this.selectable ? "a" : "button", s = i === "a", t = this.disabled && !Boolean(this.href), u = this.hasBadges, r = this.el.querySelector("[slot='control']"), m = Boolean(this.menuTriggerId) || r, d = this.interactive && Boolean(this.href) ? this.href : void 0, h = r && (Boolean(this.meta) || u), b = Boolean(this.menuTriggerId) && !Boolean(this.meta) && !this.selectable, o = this.showMeta, w = Boolean(this.swirlAriaLabel) ? this.swirlAriaLabel : this.label, g = this.selectable ? String(this.checked) : void 0, p = this.interactive && this.selectable ? "checkbox" : void 0, l = this.el.closest('[role="grid"]') ? "row" : "listitem", f = l === "row" ? "gridcell" : void 0, v = {
+      minHeight: (a = this.labelMinHeight) != null ? a : void 0
+    }, c = () => e("span", { key: "0b35b69c7eea749dd1dffc868456f2e601bad7a0", class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : void 0, style: {
+      "-webkit-line-clamp": this.labelWrapMaxLines ? String(this.labelWrapMaxLines) : void 0
+    } }, !this.allowHtml && this.label), _ = C("resource-list-item", `resource-list-item--label-weight-${this.labelWeight}`, {
+      "resource-list-item--active": this.active,
+      "resource-list-item--checked": this.checked,
+      "resource-list-item--compact": this.compact,
+      "resource-list-item--disabled": this.disabled,
+      "resource-list-item--draggable": this.allowDrag,
+      "resource-list-item--dragging": this.dragging,
+      "resource-list-item--has-control": r,
+      "resource-list-item--has-menu": m,
+      "resource-list-item--hide-divider": this.hideDivider,
+      "resource-list-item--interactive": this.interactive || this.selectable,
+      "resource-list-item--selectable": this.selectable,
+      "resource-list-item--show-control-on-focus": h,
+      "resource-list-item--show-meta": o,
+      "resource-list-item--wrap-description": this.descriptionWrap,
+      "resource-list-item--wrap-label": this.labelWrap,
+      "resource-list-item--wrap-label-max-lines": this.labelWrapMaxLines
+    });
+    return e(x, { key: "d329f9ef6cdaf4023d6a5df9d6e0cd3cfa9e26b6", role: l }, e("div", { key: "07bff2d23bf0013826485ca2d0a8b857524becee", class: _, role: f, onClick: this.onClick }, e(i, { key: "1fcbaccaf0756677d6fab4fd52f8d4e586839c32", "aria-checked": g, "aria-current": this.swirlAriaCurrent, "aria-disabled": t ? "true" : void 0, "aria-label": w, "aria-labelledby": Boolean(this.swirlAriaLabel) ? void 0 : this.elementId, class: "resource-list-item__content", style: { alignItems: this.alignItems }, href: d, rel: s ? this.rel : void 0, target: s ? this.target : void 0, disabled: t, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: p, tabIndex: 0, type: i === "button" ? "button" : void 0 }, this.hasMedia && e("span", { key: "71f5d32761fb09bc8038f73386a2e55ad91ec6c8", class: "resource-list-item__media" }, e("slot", { key: "eb594a830502b82de33bc28f2a915f9e2bbe6cbe", name: "media" })), e("span", { key: "03eb343cd1677dde782b0162995a4258d46ea0cc", class: "resource-list-item__label-container", style: v }, this.labelTooltip ? e("swirl-tooltip", { content: this.labelTooltip, position: this.labelTooltipPosition }, c()) : c(), this.description && e("span", { key: "5850efd095ffccaf36c9f9938d85085883eafded", class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : void 0 }, !this.allowHtml && this.description))), this.selectable && e("span", { key: "f367152fa99ef06fd98f71adb64179029fca3367", "aria-hidden": "true", class: "resource-list-item__checkbox" }, e("span", { key: "85bc143b0c7ff8092647bb0cf2f6390b5689e28a", class: "resource-list-item__checkbox-icon" }, this.checked && e("swirl-icon-check-strong", { key: "3398015241d1adc77aea9adfca7a1660d68c7ced" }))), o && e("span", { key: "c69cf4b8f0e3baba00790d7fc6ed0ea36b1b2646", class: "resource-list-item__meta" }, this.meta && e("span", { key: "b0f2dd8939fcfd0a331060707aeba8a47ae57250", class: "resource-list-item__meta-text" }, this.meta), e("span", { key: "8e9669209effb96480a859748ea5e88a277533e4", class: "resource-list-item__badges" }, e("slot", { key: "4f3cf237d0111120e7b0909eb4b1c9f6d2e431ec", name: "badges" }))), e("span", { key: "127b1fecd3a1dad2e967eec020d1f7c38ec21ae4", class: "resource-list-item__control", onClick: this.onControlClick }, e("slot", { key: "c514af51cbbb95d87267ec9b0093130135c7d9d2", name: "control" })), b && e("swirl-popover-trigger", { key: "b553147ce831d4530f6459459d4f027f2205bd6f", swirlPopover: this.menuTriggerId }, e("swirl-button", { key: "17a41af912f0f56386d5286c533ab52fe043d59e", "aria-disabled": t ? "true" : void 0, class: "resource-list-item__menu-trigger", disabled: t, hideLabel: !0, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick }))), this.allowDrag && e("button", { key: "27cad993506ad4e7e06e60826ce08036f894a7a7", "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, e("swirl-icon-drag-handle", { key: "78ea4c0122d2748613ad518c3154f746a916f7f7", size: this.iconSize })));
+  }
+  get el() {
+    return y(this);
+  }
+};
+M.style = z();
+export {
+  M as swirl_resource_list_item
+};

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

@@ -0,0 +1,19 @@
+import { r as t, h as e, H as a, g as r } from "./index.e0c6d71c.js";
+import "react";
+import "react-dom";
+const o = () => ":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)}}", l = class {
+  constructor(s) {
+    t(this, s), this.separatorSpacing = "4", this.spacing = "0", this.hasSeparator = !1;
+  }
+  render() {
+    const s = this.el.closest('[role="grid"]') ? "rowgroup" : "listitem", i = s === "listitem" ? "list" : void 0;
+    return e(a, { key: "329e592c37425f581bb9a562f7f6281c59263866" }, this.hasSeparator && e("swirl-separator", { key: "034cba7f0be02ee595c5267f50890c3a1a39b023", spacing: this.separatorSpacing, semantics: "none" }), e("div", { key: "ffcff5e6a7394f72c20522a65ef8457de4347ade", "aria-labelledby": "label", role: s }, e("span", { key: "59039962c56b2ccbe476751c382b4f640ee9bb97", id: "label", class: "resource-list-section-label", part: "resource-list-section-label" }, this.label), e("swirl-stack", { key: "b85608917f92c76f1e1b97d46323f22d0de294e3", spacing: this.spacing, swirlAriaRole: i }, e("slot", { key: "aeaac547c7406f128e8e1692713d2c9d5ffa2fd3" }))));
+  }
+  get el() {
+    return r(this);
+  }
+};
+l.style = o();
+export {
+  l as swirl_resource_list_section
+};

package/dist/swirl-resource-list.entry.04de4e91.js

@@ -0,0 +1,161 @@
+import { r as l, c as d, h as r, H as g, g as c } from "./index.e0c6d71c.js";
+import { S as h } from "./sortable.esm-CMrz6687.dac971cd.js";
+import "react";
+import "react-dom";
+const m = () => ".sc-swirl-resource-list-h{display:block;width:100%}.sc-swirl-resource-list-h *.sc-swirl-resource-list{box-sizing:border-box}", u = class {
+  constructor(t) {
+    l(this, t), this.itemDrop = d(this, "itemDrop", 7), this.assistiveTextItemGrabbed = "Item grabbed. Use arrow keys to move item up or down. Use spacebar to save position.", this.assistiveTextItemMoving = "Current position:", this.assistiveTextItemMoved = "Item moved. New position:", this.semantics = "grid", this.spacing = "0", this.listId = crypto.randomUUID(), this.focusedIndex = 0, this.componentLoaded = !1, this.toggleDrag = (e) => {
+      const s = e.detail;
+      Boolean(this.dragging) ? this.stopDrag(s) : this.startDrag(s);
+    }, this.startDrag = (e) => {
+      this.dragging = e, this.draggingStartIndex = this.getItemIndex(this.dragging), e.setAttribute("dragging", "true");
+      const s = this.getItemIndex(this.dragging);
+      this.focusItemAtIndex(s), this.assistiveText = this.assistiveTextItemGrabbed;
+    }, this.stopDrag = (e) => {
+      const s = this.getItemIndex(this.dragging);
+      this.dragging = void 0, e.removeAttribute("dragging"), this.assistiveText = `${this.assistiveTextItemMoved} ${s + 1}`, this.itemDrop.emit({ item: e, oldIndex: this.draggingStartIndex, newIndex: s }), this.draggingStartIndex = void 0;
+    }, this.onKeyDown = (e) => {
+      if (this.semantics === "grid" && !Boolean(this.dragging))
+        if (e.code === "ArrowDown")
+          e.preventDefault(), this.focusItemAtIndex((this.focusedIndex + 1) % this.items.length);
+        else if (e.code === "ArrowUp") {
+          e.preventDefault();
+          const s = this.focusedIndex === 0 ? this.items.length - 1 : this.focusedIndex - 1;
+          this.focusItemAtIndex(s);
+        } else if (e.code === "Enter" && Boolean(this.controllingElement)) {
+          const s = this.items[this.focusedIndex];
+          if (!Boolean(s) || !s.isConnected)
+            return;
+          e.stopPropagation(), e.preventDefault(), s.click();
+        } else
+          e.code === "Home" ? (e.preventDefault(), this.focusItemAtIndex(0)) : e.code === "End" && (e.preventDefault(), this.focusItemAtIndex(this.items.length - 1));
+      if (Boolean(this.dragging)) {
+        if (e.code === "ArrowDown")
+          e.preventDefault(), this.moveDraggedItemDown();
+        else if (e.code === "ArrowUp")
+          e.preventDefault(), this.moveDraggedItemUp();
+        else if (e.code === "Space" || e.code === "Enter") {
+          const s = e.composedPath()[0];
+          s != null && s.classList.contains("resource-list-item__drag-handle") || (e.preventDefault(), this.stopDrag(this.dragging));
+        }
+      }
+    };
+  }
+  connectedCallback() {
+    this.componentLoaded && (this.observeSlotChanges(), this.collectItems(), this.setupControllingElement(), this.setItemAllowDragState());
+  }
+  componentDidLoad() {
+    this.observeSlotChanges(), this.collectItems(), this.setupControllingElement(), this.setItemAllowDragState(), this.setupDragDrop(), this.setSectionSpacingAndSeparator(), this.componentLoaded = !0;
+  }
+  componentDidRender() {
+    this.setupDragDrop();
+  }
+  disconnectedCallback() {
+    var t, e, s;
+    (t = this.sortable) == null || t.destroy(), (e = this.observer) == null || e.disconnect(), (s = this.controllingElement) == null || s.removeEventListener("keydown", this.onKeyDown), this.removeToggleDragListeners();
+  }
+  observeSlotChanges() {
+    var t;
+    (t = this.observer) == null || t.disconnect(), this.observer = new MutationObserver(() => {
+      this.collectItems(), this.setItemAllowDragState(), this.setSectionSpacingAndSeparator();
+    }), this.observer.observe(this.el, {
+      childList: !0,
+      characterData: !0,
+      subtree: !0
+    });
+  }
+  watchAllowDrag() {
+    this.setItemAllowDragState(), this.setupDragDrop();
+  }
+  async resetFocus() {
+    var t;
+    this.focusedIndex = 0, this.removeItemsFromTabOrder(), this.enableItemFocus(this.items[0]), Boolean(this.controllingElement) && ((t = this.items[0]) == null || t.setAttribute("aria-selected", "true"));
+  }
+  collectItems() {
+    var t;
+    this.removeToggleDragListeners(), this.items = Array.from(this.el.querySelectorAll("swirl-resource-list-item, swirl-resource-list-file-item, [data-resource-list-item]")).filter((e) => e.isConnected), this.sections = Array.from(this.el.querySelectorAll("swirl-resource-list-section")).filter((e) => e.isConnected), this.removeItemsFromTabOrder(), this.enableItemFocus(this.items[this.focusedIndex]), Boolean(this.controllingElement) && ((t = this.items[0]) == null || t.setAttribute("aria-selected", "true"));
+  }
+  setupControllingElement() {
+    !Boolean(this.controllingElement) || (this.controllingElement.setAttribute("aria-controls", this.listId), this.controllingElement.setAttribute("role", "combobox"), this.controllingElement.setAttribute("aria-autocomplete", "list"), this.controllingElement.addEventListener("keydown", this.onKeyDown));
+  }
+  getItemIndex(t) {
+    return this.items.map((e) => e).findIndex((e) => e === t);
+  }
+  removeItemsFromTabOrder() {
+    this.semantics === "grid" && this.items.forEach((t) => {
+      const e = t == null ? void 0 : t.querySelector(".resource-list-item__content, .resource-list-file-item, [data-resource-list-item-button]"), s = t == null ? void 0 : t.querySelector(".resource-list-item__drag-handle");
+      Boolean(this.controllingElement) && t.setAttribute("aria-selected", "false"), e == null || e.setAttribute("tabIndex", "-1"), s == null || s.setAttribute("tabIndex", "-1");
+    });
+  }
+  removeToggleDragListeners() {
+    var t;
+    (t = this.items) == null || t.forEach((e) => {
+      e.removeEventListener("toggleDrag", this.toggleDrag);
+    });
+  }
+  setItemAllowDragState() {
+    this.allowDrag ? this.items.filter((t) => this.sections.every((e) => !e.contains(t))).forEach((t) => {
+      t.setAttribute("allow-drag", "true"), t.addEventListener("toggleDrag", this.toggleDrag);
+    }) : this.items.forEach((t) => {
+      t.removeAttribute("allow-drag"), t.removeEventListener("toggleDrag", this.toggleDrag);
+    });
+  }
+  setupDragDrop() {
+    Boolean(this.sortable) && this.sortable.destroy(), this.allowDrag && (this.sortable = h.create(this.gridEl, {
+      animation: 150,
+      draggable: "swirl-resource-list-item",
+      dragClass: "swirl-resource-list-item--drag",
+      handle: ".resource-list-item__drag-handle",
+      onEnd: (t) => {
+        this.itemDrop.emit({
+          item: t.item,
+          oldIndex: t.oldDraggableIndex,
+          newIndex: t.newDraggableIndex
+        });
+      }
+    }));
+  }
+  enableItemFocus(t, e) {
+    if (!Boolean(t) || Boolean(this.controllingElement))
+      return;
+    const s = t.querySelector(".resource-list-item__content, .resource-list-file-item, [data-resource-list-item-button]"), i = t.querySelector(".resource-list-item__drag-handle");
+    Boolean(i) && i.setAttribute("tabIndex", "0"), Boolean(s) && (s.setAttribute("tabIndex", "0"), e && !Boolean(this.controllingElement) && s.focus());
+  }
+  focusItemAtIndex(t) {
+    this.removeItemsFromTabOrder();
+    const e = this.items[t];
+    !Boolean(e) || !e.isConnected || (this.enableItemFocus(e, !Boolean(this.controllingElement)), Boolean(this.controllingElement) && (e.setAttribute("aria-selected", "true"), e.scrollIntoView({ block: "nearest" })), this.focusedIndex = t);
+  }
+  moveDraggedItemDown() {
+    const t = this.dragging.nextElementSibling;
+    !Boolean(t) || (t.after(this.dragging), this.collectItems(), this.focusItemAtIndex(this.getItemIndex(this.dragging)), this.assistiveText = `${this.assistiveTextItemMoving} ${this.getItemIndex(this.dragging) + 1}`);
+  }
+  moveDraggedItemUp() {
+    const t = this.dragging.previousElementSibling;
+    !Boolean(t) || (t.before(this.dragging), this.collectItems(), this.focusItemAtIndex(this.getItemIndex(this.dragging)), this.assistiveText = `${this.assistiveTextItemMoving} ${this.getItemIndex(this.dragging) + 1}`);
+  }
+  setSectionSpacingAndSeparator() {
+    this.sections.forEach((t, e) => {
+      var s;
+      e === 0 && ((s = t.previousElementSibling) == null ? void 0 : s.tagName) !== "SWIRL-RESOURCE-LIST-ITEM" && (t.hasSeparator = !1), t.spacing = this.spacing;
+    });
+  }
+  render() {
+    var t, e, s, i, o, n;
+    return r(g, { key: "b5e4d53782d0d41c43d81f7222201f03d28cc282", onKeyDown: this.onKeyDown }, r("swirl-visually-hidden", { key: "1b9112ef866b5095c1c9f47f96cd0b7c61db8e04", role: "alert" }, this.assistiveText), r("swirl-box", { key: "cf1605239d7a736f924ee3bef04180a5d49d1d25", paddingBlockEnd: (t = this.paddingBlockEnd) != null ? t : this.padding, paddingBlockStart: (e = this.paddingBlockStart) != null ? e : this.padding, paddingInlineEnd: (i = (s = this.paddingInlineEnd) != null ? s : this.padding) != null ? i : "8", paddingInlineStart: (n = (o = this.paddingInlineStart) != null ? o : this.padding) != null ? n : "8" }, r("swirl-stack", { key: "a9176dd03792be73814a33cc9d3eab7740702f2b", "aria-label": this.label, class: "resource-list", id: this.listId, ref: (a) => this.gridEl = a, role: this.semantics, spacing: this.spacing }, r("slot", { key: "0c1335249b5e423ffd422591573ec08a5cf53f74" }))));
+  }
+  get el() {
+    return c(this);
+  }
+  static get watchers() {
+    return {
+      allowDrag: [{
+        watchAllowDrag: 0
+      }]
+    };
+  }
+};
+u.style = m();
+export {
+  u as swirl_resource_list
+};

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

@@ -0,0 +1,51 @@
+import { r as i, c as r, h as a, H as t } from "./index.e0c6d71c.js";
+import { c } from "./index-orsBiyT_.fc4357c3.js";
+import { D as h } from "./media-query.service-CCYT6DU8.f0931fdc.js";
+import "react";
+import "react-dom";
+import "./utils-CCck-DTo.e4e43b6a.js";
+const o = () => ".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--variant-ghost.sc-swirl-search .search__input.sc-swirl-search{background-color:transparent}.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%)}", l = class {
+  constructor(e) {
+    i(this, e), this.clear = r(this, "clear", 7), this.inputBlur = r(this, "inputBlur", 7), this.inputFocus = r(this, "inputFocus", 7), this.inputInput = r(this, "inputInput", 7), this.valueChange = r(this, "valueChange", 7), this.clearButtonLabel = "Clear search term", this.placeholder = "Search \u2026", this.variant = "filled", this.clearable = !0, this.mediaQueryUnsubscribe = () => {
+    }, this.handleClear = () => {
+      this.input.value = "", this.input.focus(), this.valueChange.emit(""), this.clear.emit();
+    }, this.onBlur = (s) => {
+      this.inputBlur.emit(s);
+    }, this.onChange = (s) => {
+      this.valueChange.emit(s.target.value);
+    }, this.onFocus = (s) => {
+      this.inputFocus.emit(s);
+    }, this.onInput = (s) => {
+      this.inputInput.emit(s.target.value);
+    };
+  }
+  componentDidLoad() {
+    this.mediaQueryUnsubscribe = h.subscribe((e) => {
+      this.forceIconProps(e);
+    }), this.autoFocus && setTimeout(() => {
+      this.input.focus();
+    });
+  }
+  disconnectedCallback() {
+    this.mediaQueryUnsubscribe();
+  }
+  forceIconProps(e) {
+    if (!Boolean(this.iconEl))
+      return;
+    const s = this.iconEl.children[0];
+    s == null || s.setAttribute("size", e ? "20" : "24");
+  }
+  onKeyDown(e) {
+    (e.code === "KeyK" || e.code === "Slash") && (e.ctrlKey || e.metaKey) && this.input.focus();
+  }
+  render() {
+    const e = c("search", `search--variant-${this.variant}`, {
+      "search--disabled": this.disabled
+    });
+    return a(t, { key: "9aac9c281431aa153ffa70eae161a26255ccfda7" }, a("span", { key: "eb01350e9f67d7c2aa0788d3ef3c8d11684d0727", class: e, ref: (s) => this.iconEl = s }, a("swirl-icon-search", { key: "6acb05b4c0955289341cae0c21c2dd75e6c11fa2", "aria-hidden": "true", class: "search__icon" }), a("input", { key: "6a2055aeab25053c580416a42d4793d8bcaefcd2", "aria-disabled": this.disabled ? "true" : void 0, "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: (s) => this.input = s, type: "search", value: this.value }), !this.disabled && this.clearable && a("button", { key: "f62084a923fbef39a502cab37bc55a2e60f975af", "aria-label": this.clearButtonLabel, class: "search__clear-button", onClick: this.handleClear, type: "button" }, a("swirl-icon-cancel", { key: "05ad58ac988d42b8fc5589c70b74a72ea2bc293f" }))));
+  }
+};
+l.style = o();
+export {
+  l as swirl_search
+};

package/dist/swirl-select.entry.4cd34639.js

@@ -0,0 +1,145 @@
+import { r as p, c as o, h as a, H as d, g as u } from "./index.e0c6d71c.js";
+import { c as f } from "./index-orsBiyT_.fc4357c3.js";
+import { q as w } from "./utils-CCck-DTo.e4e43b6a.js";
+import "react";
+import "react-dom";
+const m = () => '.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),.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),.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:-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:-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;pointer-events: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),.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)));pointer-events:none}.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)}@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:transparent;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__popover.sc-swirl-select::part(popover__scroll-container),.select__popover.sc-swirl-select [part~="popover__scroll-container"]{padding:0;overflow:hidden;display:flex;flex-direction:column}.select__popover.sc-swirl-select .select__search.sc-swirl-select{flex-shrink:0}.select__popover.sc-swirl-select .select__option-list.sc-swirl-select{padding:var(--s-space-4);overflow:auto;min-height:0}.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)}}', g = class {
+  constructor(e) {
+    p(this, e), this.searchChange = o(this, "searchChange", 7), this.valueChange = o(this, "valueChange", 7), this.allowDeselect = !0, this.emptyListLabel = "No results found.", this.searchInputLabel = "Search options", this.selectId = Math.round(Math.random() * 1e6).toString(), this.options = [], this.typeaheadBuffer = "", this.select = (s) => {
+      s.stopPropagation(), this.value = s.detail, this.multiSelect || this.swirlPopover.close();
+    }, this.unselectOption = (s) => {
+      !this.allowDeselect || (this.value = this.value.filter((t) => t !== s));
+    }, this.onSlotChange = () => {
+      this.updateOptions();
+    }, this.onOpen = (s) => {
+      var t, l;
+      this.placement = (t = s.detail.position) == null ? void 0 : t.placement, this.open = !0, this.typeaheadBuffer = "", clearTimeout(this.typeaheadTimeout), this.withSearch && Boolean(this.searchInput) ? this.searchInput.focus() : (l = this.optionList.querySelector('[tabIndex="0"]')) == null || l.focus();
+    }, this.onClose = () => {
+      Boolean(this.searchInput) && (this.searchInput.value = "", this.searchChange.emit("")), this.typeaheadBuffer = "", clearTimeout(this.typeaheadTimeout), this.open = !1, this.input.focus();
+    }, this.onKeyDown = (s) => {
+      var t;
+      if (s.code === "Space" || s.code === "Enter") {
+        if (s.target === this.searchInput)
+          return;
+        s.preventDefault(), this.swirlPopover.open(this.el);
+      } else
+        s.code === "ArrowDown" && s.target === this.searchInput ? (t = this.optionList.querySelector('[tabIndex="0"]')) == null || t.focus() : this.isTypeaheadKey(s) && (s.preventDefault(), s.stopPropagation(), this.handleTypeahead(s.key));
+    }, this.onSearchInput = (s) => {
+      this.searchChange.emit(s.target.value);
+    };
+  }
+  componentWillLoad() {
+    queueMicrotask(() => {
+      this.updateOptions(), this.observeSlotChanges();
+    });
+  }
+  disconnectedCallback() {
+    var e;
+    (e = this.observer) == null || e.disconnect(), clearTimeout(this.typeaheadTimeout);
+  }
+  onWindowFocusIn(e) {
+    e.target === this.el.querySelector("input") && e.stopImmediatePropagation();
+  }
+  onValueChange(e, s) {
+    (e == null ? void 0 : e.length) === (s == null ? void 0 : s.length) && (e == null ? void 0 : e.every((l) => s == null ? void 0 : s.includes(l))) || this.valueChange.emit(this.value);
+  }
+  async selectSearchInput() {
+    var e;
+    (e = this.searchInput) == null || e.select();
+  }
+  async focusSearchInput() {
+    var e;
+    (e = this.searchInput) == null || e.focus();
+  }
+  observeSlotChanges() {
+    this.observer = new MutationObserver(() => {
+      this.updateOptions();
+    }), this.observer.observe(this.el, {
+      childList: !0,
+      subtree: !0
+    });
+  }
+  updateOptions() {
+    this.options = w(this.el, "swirl-option-list-item");
+  }
+  isTypeaheadKey(e) {
+    return e.target === this.searchInput || e.metaKey || e.ctrlKey || e.altKey ? !1 : e.key.length === 1 && e.key !== " ";
+  }
+  handleTypeahead(e) {
+    const s = e.toLowerCase();
+    if (clearTimeout(this.typeaheadTimeout), this.typeaheadBuffer.length > 0 && [...this.typeaheadBuffer].every((l) => l === s))
+      this.typeaheadBuffer += s, this.cycleTypeahead(s);
+    else {
+      const l = this.typeaheadBuffer.length > 1 && new Set(this.typeaheadBuffer).size === 1;
+      this.typeaheadBuffer = l ? s : this.typeaheadBuffer + s, this.prefixMatchTypeahead(this.typeaheadBuffer) || (this.typeaheadBuffer = s, this.prefixMatchTypeahead(this.typeaheadBuffer));
+    }
+    this.typeaheadTimeout = setTimeout(() => {
+      this.typeaheadBuffer = "";
+    }, 500);
+  }
+  cycleTypeahead(e) {
+    const t = this.options.filter((c) => !c.disabled).filter((c) => {
+      var i;
+      return (i = c.label) == null ? void 0 : i.toLowerCase().startsWith(e);
+    });
+    if (t.length === 0)
+      return;
+    const l = this.getTypeaheadAnchorValue(), n = (t.findIndex((c) => c.value === l) + 1) % t.length;
+    this.applyTypeaheadMatch(t[n]);
+  }
+  prefixMatchTypeahead(e) {
+    const t = this.options.filter((l) => !l.disabled).find((l) => {
+      var r;
+      return (r = l.label) == null ? void 0 : r.toLowerCase().startsWith(e);
+    });
+    return t ? (this.applyTypeaheadMatch(t), !0) : !1;
+  }
+  getTypeaheadAnchorValue() {
+    var e;
+    if (this.open) {
+      const s = this.options.find((t) => t.querySelector('[role="option"][tabindex="0"]'));
+      return s == null ? void 0 : s.value;
+    }
+    return (e = this.value) == null ? void 0 : e[this.value.length - 1];
+  }
+  applyTypeaheadMatch(e) {
+    this.open && this.optionList.focusItemWithValue(e.value);
+  }
+  getValueLabel() {
+    var e;
+    return Boolean(this.value) ? (e = this.value) == null ? void 0 : e.map((s) => {
+      var t;
+      return (t = this.options.find((l) => l.value === s)) == null ? void 0 : t.label;
+    }).join(", ") : "";
+  }
+  render() {
+    var n, c;
+    const e = this.getValueLabel(), s = this.invalid === !0 || this.invalid === !1 ? String(this.invalid) : void 0, t = this.el.closest("swirl-form-control"), l = this.standalone ? [-8, 0] : (t == null ? void 0 : t.inline) || (t == null ? void 0 : t.labelPosition) === "outside" ? [0, -12] : [0, -16], r = f("select", `select--placement-${this.placement}`, {
+      "select--disabled": this.disabled,
+      "select--inline": this.inline,
+      "select--multi": this.multiSelect,
+      "select--search-loading": this.searchLoading,
+      "select--standalone": this.standalone
+    });
+    return a(d, { key: "2b9fca4f4c00e6a3e184709ee82a7820c7951286", onKeyDown: this.onKeyDown }, a("div", { key: "7dd6f4ea938071f9992ef180ef6532eb4a75a1eb", class: r }, a("swirl-popover-trigger", { key: "5fd6a6db40da9e22d18bb9feab320f877e7da5c8", swirlPopover: this.swirlPopover, setAriaAttributes: !1 }, a("swirl-stack", { key: "ab76a0c93dfb57d4d3a178d06da943016cf42a05", class: "select__value-container" }, this.standalone && a("span", { key: "2723b9b441fab0cd61d4ac722215ccaa52081731", "aria-hidden": "true", class: "select__resize-helper" }, e), a("input", { key: "cf35d62d5c173ce4fc2429cd74ff1ba3a8dec507", "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : void 0, "aria-invalid": s, class: "select__input", disabled: this.disabled, readOnly: !0, ref: (i) => this.input = i, type: "text", value: e }))), a("span", { key: "9b3a13851466a8c99393d0f172451c27e6548d50", class: "select__multi-select-values" }, (c = (n = this.value) == null ? void 0 : n.map((i) => this.options.find((h) => h.value === i))) == null ? void 0 : c.map((i) => a("swirl-tag", {
+      "aria-hidden": "true",
+      label: i == null ? void 0 : i.label,
+      onRemove: () => this.unselectOption(i == null ? void 0 : i.value),
+      removable: !this.disabled && this.allowDeselect && !(i != null && i.disabled)
+    }))), a("span", { key: "ea5c7e78919be6ada69da1c81634288ba6eb91b0", class: "select__indicator" }, this.open ? a("swirl-icon-expand-less", { size: this.standalone ? 20 : 24 }) : a("swirl-icon-expand-more", { size: this.standalone ? 20 : 24 })), a("swirl-popover", { key: "533ef9d636cd2849d589aa1e9d3c26ed6f1a076e", animation: "scale-in-y", class: "select__popover", id: `select-options-${this.selectId}`, label: this.label, offset: l, onPopoverClose: this.onClose, onPopoverOpen: this.onOpen, ref: (i) => this.swirlPopover = i, useContainerWidth: this.standalone ? !1 : "swirl-form-control" }, this.withSearch && a("div", { key: "0aa952a4905895624cc46fda2c75dee6e0c937cb", class: "select__search" }, a("swirl-icon-search", { key: "eabba87afddb738d59eec4159f00ff5af472365c", class: "select__search-icon", size: 20 }), a("input", { key: "98282413122ab3b55758827d21135af4f9110c41", "aria-label": this.searchInputLabel, class: "select__search-input", onInput: this.onSearchInput, placeholder: this.searchPlaceholder, ref: (i) => this.searchInput = i, type: "search" }), this.searchLoading && a("swirl-spinner", { key: "62df1ed878ae161b0f5dbb121335133c15d8bd6c", class: "select__search-spinner", size: "s" })), a("swirl-option-list", { key: "943348eca9a3725e30006b36e33752d6d88ea02b", class: "select__option-list", allowDeselect: this.allowDeselect, onValueChange: this.select, multiSelect: this.multiSelect, ref: (i) => this.optionList = i, value: this.value }, !this.searchLoading && a("div", { key: "23e175a7c56c43f1ef7d4302db51777d8486e695", "aria-disabled": "true", class: "select__empty-list-label", role: "option" }, a("swirl-text", { key: "9421e8973e9a3b9e973e0e4c2a24a6335d96545c", color: "subdued", weight: "medium" }, this.emptyListLabel)), a("slot", { key: "fbe6034f293a404be70766edc42af52c9d704d6d", onSlotchange: this.onSlotChange })))));
+  }
+  get el() {
+    return u(this);
+  }
+  static get watchers() {
+    return {
+      value: [{
+        onValueChange: 0
+      }]
+    };
+  }
+};
+g.style = m();
+export {
+  g as swirl_select
+};

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

@@ -0,0 +1,29 @@
+import { r as e, h as r, F as s, H as i } from "./index.e0c6d71c.js";
+import { c as l } from "./index-orsBiyT_.fc4357c3.js";
+import "react";
+import "react-dom";
+const n = () => ":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-critical) .separator__line{background-color:var(--s-border-critical)}:host(.separator--color-critical) .separator__label{color:var(--s-text-subdued)}: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-on-translucent)}.separator__label{flex-shrink:0;width:-moz-fit-content;width:fit-content;font-size:var(--s-font-size-sm);color:var(--s-text-disabled)}", c = class {
+  constructor(a) {
+    e(this, a), this.borderColor = "default", this.color = "default", this.orientation = "horizontal", this.semantics = "separator", this.spacing = "8";
+  }
+  componentWillLoad() {
+    this.forceColor();
+  }
+  forceColor() {
+    this.borderColor !== "default" && (console.warn('[Swirl] The "borderColor" prop of swirl-separator is deprecated and will be removed with the next major release. Please use the "color" prop to achieve the same result.'), this.color = this.borderColor);
+  }
+  render() {
+    const a = this.orientation === "horizontal" ? {
+      paddingTop: `var(--s-space-${this.spacing})`,
+      paddingBottom: `var(--s-space-${this.spacing})`
+    } : {
+      paddingRight: `var(--s-space-${this.spacing})`,
+      paddingLeft: `var(--s-space-${this.spacing})`
+    }, o = l("separator", `separator--color-${this.color}`, `separator--orientation-${this.orientation}`), t = this.semantics === "separator" ? { "aria-orientation": this.orientation } : {};
+    return r(i, { key: "23acb3a29638b92737838e75a54d7616e6c9150e", ...t, class: o, role: this.semantics, style: a }, r("span", { key: "3ebf80f47fb36438403551f560db91ecf7d7e559", class: "separator__line" }), this.label && r(s, { key: "84ac7960ba714ab27559751c11bd7c4b56ac3176" }, r("span", { key: "6f8dc3ad3bde938789e28ad05c67da657262a4d1", class: "separator__label" }, this.label), r("span", { key: "63ddb77ea887a890bb1731d12a939783b592e21a", class: "separator__line" })));
+  }
+};
+c.style = n();
+export {
+  c as swirl_separator
+};