@boostdev/design-system-components 1.1.0 → 1.1.2

package/dist/{web-components.js → web-components/chunk-LGEZYFUU.js}

@@ -1,3 +1,48 @@
+// node_modules/.pnpm/@lit+reactive-element@2.1.2/node_modules/@lit/reactive-element/node/css-tag.js
+var t = globalThis;
+var e = t.ShadowRoot && (void 0 === t.ShadyCSS || t.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype;
+var s = /* @__PURE__ */ Symbol();
+var o = /* @__PURE__ */ new WeakMap();
+var n = class {
+  constructor(t3, e3, o5) {
+    if (this._$cssResult$ = true, o5 !== s) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    this.cssText = t3, this.t = e3;
+  }
+  get styleSheet() {
+    let t3 = this.o;
+    const s4 = this.t;
+    if (e && void 0 === t3) {
+      const e3 = void 0 !== s4 && 1 === s4.length;
+      e3 && (t3 = o.get(s4)), void 0 === t3 && ((this.o = t3 = new CSSStyleSheet()).replaceSync(this.cssText), e3 && o.set(s4, t3));
+    }
+    return t3;
+  }
+  toString() {
+    return this.cssText;
+  }
+};
+var r = (t3) => new n("string" == typeof t3 ? t3 : t3 + "", void 0, s);
+var i = (t3, ...e3) => {
+  const o5 = 1 === t3.length ? t3[0] : e3.reduce((e4, s4, o6) => e4 + ((t4) => {
+    if (true === t4._$cssResult$) return t4.cssText;
+    if ("number" == typeof t4) return t4;
+    throw Error("Value passed to 'css' function must be a 'css' function result: " + t4 + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
+  })(s4) + t3[o6 + 1], t3[0]);
+  return new n(o5, t3, s);
+};
+var S = (s4, o5) => {
+  if (e) s4.adoptedStyleSheets = o5.map((t3) => t3 instanceof CSSStyleSheet ? t3 : t3.styleSheet);
+  else for (const e3 of o5) {
+    const o6 = document.createElement("style"), n4 = t.litNonce;
+    void 0 !== n4 && o6.setAttribute("nonce", n4), o6.textContent = e3.cssText, s4.appendChild(o6);
+  }
+};
+var c = e || void 0 === t.CSSStyleSheet ? (t3) => t3 : (t3) => t3 instanceof CSSStyleSheet ? ((t4) => {
+  let e3 = "";
+  for (const s4 of t4.cssRules) e3 += s4.cssText;
+  return r(e3);
+})(t3) : t3;
+
 // node_modules/.pnpm/@lit-labs+ssr-dom-shim@1.5.1/node_modules/@lit-labs/ssr-dom-shim/lib/element-internals.js
 var ElementInternalsShim = class ElementInternals {
   get shadowRoot() {
@@ -384,7 +429,7 @@ Object.defineProperties(EventShim.prototype, {
   stopPropagation: enumerableProperty,
   isTrusted: enumerableProperty
 });
-var CustomEventShim = (_b = class CustomEvent2 extends EventShim {
+var CustomEventShim = (_b = class CustomEvent extends EventShim {
   constructor(type, options = {}) {
     super(type, options);
     _CustomEvent_detail.set(this, void 0);
@@ -593,57 +638,12 @@ Make sure to test your application with a production build as repeat registratio
   }
 };
 var CustomElementRegistryShimWithRealType = CustomElementRegistry;
-var customElements2 = new CustomElementRegistryShimWithRealType();
-
-// node_modules/.pnpm/@lit+reactive-element@2.1.2/node_modules/@lit/reactive-element/node/css-tag.js
-var t = globalThis;
-var e = t.ShadowRoot && (void 0 === t.ShadyCSS || t.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype;
-var s = /* @__PURE__ */ Symbol();
-var o = /* @__PURE__ */ new WeakMap();
-var n = class {
-  constructor(t3, e3, o5) {
-    if (this._$cssResult$ = true, o5 !== s) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
-    this.cssText = t3, this.t = e3;
-  }
-  get styleSheet() {
-    let t3 = this.o;
-    const s4 = this.t;
-    if (e && void 0 === t3) {
-      const e3 = void 0 !== s4 && 1 === s4.length;
-      e3 && (t3 = o.get(s4)), void 0 === t3 && ((this.o = t3 = new CSSStyleSheet()).replaceSync(this.cssText), e3 && o.set(s4, t3));
-    }
-    return t3;
-  }
-  toString() {
-    return this.cssText;
-  }
-};
-var r = (t3) => new n("string" == typeof t3 ? t3 : t3 + "", void 0, s);
-var i = (t3, ...e3) => {
-  const o5 = 1 === t3.length ? t3[0] : e3.reduce((e4, s4, o6) => e4 + ((t4) => {
-    if (true === t4._$cssResult$) return t4.cssText;
-    if ("number" == typeof t4) return t4;
-    throw Error("Value passed to 'css' function must be a 'css' function result: " + t4 + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
-  })(s4) + t3[o6 + 1], t3[0]);
-  return new n(o5, t3, s);
-};
-var S = (s4, o5) => {
-  if (e) s4.adoptedStyleSheets = o5.map((t3) => t3 instanceof CSSStyleSheet ? t3 : t3.styleSheet);
-  else for (const e3 of o5) {
-    const o6 = document.createElement("style"), n4 = t.litNonce;
-    void 0 !== n4 && o6.setAttribute("nonce", n4), o6.textContent = e3.cssText, s4.appendChild(o6);
-  }
-};
-var c = e || void 0 === t.CSSStyleSheet ? (t3) => t3 : (t3) => t3 instanceof CSSStyleSheet ? ((t4) => {
-  let e3 = "";
-  for (const s4 of t4.cssRules) e3 += s4.cssText;
-  return r(e3);
-})(t3) : t3;
+var customElements = new CustomElementRegistryShimWithRealType();
 
 // node_modules/.pnpm/@lit+reactive-element@2.1.2/node_modules/@lit/reactive-element/node/reactive-element.js
 var { is: h, defineProperty: r2, getOwnPropertyDescriptor: o2, getOwnPropertyNames: n2, getOwnPropertySymbols: a, getPrototypeOf: c2 } = Object;
 var l = globalThis;
-l.customElements ??= customElements2;
+l.customElements ??= customElements;
 var p = l.trustedTypes;
 var d = p ? p.emptyScript : "";
 var u = l.reactiveElementPolyfillSupport;
@@ -1146,808 +1146,36 @@ var o4 = s3.litElementPolyfillSupport;
 o4?.({ LitElement: i3 });
 (s3.litElementVersions ??= []).push("4.2.2");
 
-// src/web-components/ui/bds-badge.ts
-var BdsBadge = class extends i3 {
-  static styles = i`
-    :host {
-      display: inline-flex;
-    }
-
-    .badge {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      padding: var(--bds-space_xxs) var(--bds-space_xs);
-      border-radius: var(--badge_radius, 2em);
-      font-size: var(--badge_font-size, var(--bds-font_size--body--s));
-      font-weight: var(--bds-font_weight--semibold);
-      line-height: 1;
-      white-space: nowrap;
-      background-color: var(--badge_bg, var(--bds-color_blue));
-      color: var(--badge_text, var(--bds-color_on-blue));
-    }
-
-    /* Variant overrides */
-    :host([variant='primary']) .badge {
-      --badge_bg:   var(--bds-color_interactive);
-      --badge_text: var(--bds-color_on-interactive);
-    }
-
-    :host([variant='secondary']) .badge {
-      --badge_bg:   var(--bds-color_bg);
-      --badge_text: var(--bds-color_on-bg);
-    }
-
-    :host([variant='success']) .badge {
-      --badge_bg:   var(--bds-color_success);
-      --badge_text: var(--bds-color_on-success);
-    }
-
-    :host([variant='error']) .badge {
-      --badge_bg:   var(--bds-color_error);
-      --badge_text: var(--bds-color_on-error);
-    }
-
-    :host([variant='warning']) .badge {
-      --badge_bg:   var(--bds-color_warning);
-      --badge_text: var(--bds-color_on-warning);
-    }
-  `;
-  static properties = {
-    variant: { type: String, reflect: true }
-  };
-  constructor() {
-    super();
-    this.variant = "primary";
-  }
-  render() {
-    return T`<span class="badge"><slot></slot></span>`;
-  }
-};
-customElements.define("bds-badge", BdsBadge);
-
-// src/web-components/interaction/bds-button.ts
-var BdsButton = class extends i3 {
-  static styles = i`
-    @keyframes fadeZoom {
-      0%, 100% { opacity: 1; transform: scale(1); }
-      50%       { opacity: 0.75; transform: scale(1.15); }
-    }
-
-    @keyframes pulse {
-      0%   { transform: scale(1);    box-shadow: 0 0 0 0    rgb(from var(--button_pulse-color, var(--button_color, var(--bds-color_green))) r g b / 50%); }
-      70%  { transform: scale(1.01); box-shadow: 0 0 0 var(--bds-space_m) rgb(from var(--button_pulse-color, var(--button_color, var(--bds-color_green))) r g b / 0%); }
-      100% { transform: scale(1);    box-shadow: 0 0 0 0    rgb(from var(--button_pulse-color, var(--button_color, var(--bds-color_green))) r g b / 0%); }
-    }
-
-    :host {
-      display: inline-flex;
-    }
-
-    .button,
-    .button[href] {
-      all: unset;
-      position: relative;
-      font: inherit;
-      padding-inline: var(--bds-space_l);
-      display: inline-flex;
-      gap: var(--bds-space_xs);
-      border-radius: var(--button_border_radius--s, var(--bds-border_radius--s));
-      align-items: center;
-      cursor: pointer;
-      justify-content: center;
-      height: var(--button_height, 3em);
-      font-size: var(--button_font-size, inherit);
-      white-space: nowrap;
-      line-height: 1;
-
-      --button_color:    var(--bds-color_green);
-      --button_on-color: var(--bds-color_on-green);
-
-      background-color: var(--button_bg, var(--button_color));
-      color: var(--button_text, var(--button_on-color));
-      border: var(--button_border, none);
-      --bdc_color: transparent;
-
-      outline: var(--bdc-outline_width) solid var(--bdc_color);
-      outline-offset: var(--bdc-outline_offset);
-      transition: var(--bds-animation_transition),
-                  --bdc_color var(--bds-animation_transition-duration) var(--bds-animation_easing);
-    }
-
-    .button[href] {
-      text-decoration: none;
-    }
-
-    /* Variants */
-    .button.ghost {
-      --button_bg:   transparent;
-      --button_text: var(--button_color);
-      --bdc_color:   var(--button_color);
-    }
-
-    /* Sizes */
-    .button.small {
-      --button_height:    2.25em;
-      --button_font-size: var(--bds-font_size--body--s);
-      --button_border_radius--s: var(--bds-border_radius--xs);
-      padding-inline: var(--bds-space_m);
-    }
-
-    .button.medium {
-      --button_height: 3em;
-      padding-inline: var(--bds-space_l);
-    }
-
-    .button.large {
-      --button_font-size: var(--bds-font_size--heading-3);
-      --button_border_radius--s: var(--bds-border_radius--m);
-      padding-inline: var(--bds-space_xl);
-    }
-
-    /* Pulse */
-    .button.has-pulse {
-      animation: pulse 3s infinite;
-    }
-
-    /* SVG icon colour */
-    .button svg {
-      --icon__stroke: currentcolor;
-      fill: currentcolor;
-      color: currentcolor;
-      flex-shrink: 0;
-    }
-
-    /* Icon slots — hidden by default, shown when slot has content */
-    .icon-start,
-    .icon-end {
-      display: none;
-      align-items: center;
-    }
-
-    .icon-start.has-content {
-      display: flex;
-      margin-inline-start: calc(var(--bds-space_s) * -1);
-      transition: var(--bds-animation_transition);
-    }
-
-    .icon-end.has-content {
-      display: flex;
-      margin-inline-end: calc(var(--bds-space_s) * -1);
-      transition: var(--bds-animation_transition);
-    }
-
-    /* Hover icon animation */
-    @media (hover: hover) and (pointer: fine) {
-      .button:hover .icon-start svg,
-      .button:hover .icon-end svg {
-        animation: fadeZoom 2s ease-out infinite;
-      }
-
-      /* Default hover */
-      .button.default:hover {
-        --button_bg:          var(--bds-color_bg);
-        --button_text:        var(--bds-color_interactive);
-        --button_pulse-color: var(--bds-color_interactive);
-        --bdc_color:          currentcolor;
-      }
-
-      /* Ghost hover */
-      .button.ghost:hover {
-        --button_bg:   var(--button_color);
-        --button_text: var(--button_on-color);
-        --bdc_color:   transparent;
-      }
-    }
-
-    /* Focus visible */
-    .button:focus-visible {
-      outline: var(--bds-outline_default);
-      outline-offset: var(--bds-outline_offset);
-      border-radius: var(--bds-border_radius--s);
-    }
-
-    /* Disabled */
-    .button:disabled,
-    .button[aria-disabled='true'] {
-      opacity: 0.5;
-      cursor: not-allowed;
-      pointer-events: none;
-    }
-  `;
-  static properties = {
-    variant: { type: String, reflect: true },
-    size: { type: String, reflect: true },
-    disabled: { type: Boolean, reflect: true },
-    href: { type: String },
-    target: { type: String },
-    rel: { type: String },
-    hasPulse: { type: Boolean, attribute: "has-pulse", reflect: true },
-    type: { type: String },
-    ariaLabel: { type: String, attribute: "aria-label" },
-    // Internal state
-    _iconStartFilled: { state: true },
-    _iconEndFilled: { state: true }
-  };
-  constructor() {
-    super();
-    this.variant = "default";
-    this.size = "medium";
-    this.disabled = false;
-    this.hasPulse = false;
-    this.type = "button";
-    this.ariaLabel = null;
-    this._iconStartFilled = false;
-    this._iconEndFilled = false;
-  }
-  _onIconSlotChange(e3, position) {
-    const slot = e3.target;
-    const filled = slot.assignedNodes({ flatten: true }).length > 0;
-    if (position === "start") {
-      this._iconStartFilled = filled;
-    } else {
-      this._iconEndFilled = filled;
-    }
-  }
-  get _classes() {
-    return `button ${this.variant} ${this.size}${this.hasPulse ? " has-pulse" : ""}`;
-  }
-  _handleAnchorClick(e3) {
-    if (this.disabled) {
-      e3.preventDefault();
-    }
-  }
-  _iconSlot(position) {
-    const filled = position === "start" ? this._iconStartFilled : this._iconEndFilled;
-    return T`
-      <span class="icon-${position} ${filled ? "has-content" : ""}">
-        <slot name="icon-${position}" @slotchange=${(e3) => this._onIconSlotChange(e3, position)}></slot>
-      </span>
-    `;
-  }
-  render() {
-    if (this.href) {
-      return T`
-        <a
-          class=${this._classes}
-          href=${this.disabled ? A : this.href}
-          target=${this.target ?? A}
-          rel=${this.rel ?? A}
-          aria-disabled=${this.disabled ? "true" : A}
-          tabindex=${this.disabled ? "-1" : A}
-          aria-label=${this.ariaLabel ?? A}
-          @click=${this._handleAnchorClick}
-        >
-          ${this._iconSlot("start")}
-          <slot></slot>
-          ${this._iconSlot("end")}
-        </a>
-      `;
-    }
-    return T`
-      <button
-        class=${this._classes}
-        type=${this.type}
-        ?disabled=${this.disabled}
-        aria-label=${this.ariaLabel ?? A}
-      >
-        ${this._iconSlot("start")}
-        <slot></slot>
-        ${this._iconSlot("end")}
-      </button>
-    `;
-  }
-};
-customElements.define("bds-button", BdsButton);
-
-// src/web-components/ui/bds-alert.ts
-var BdsAlert = class extends i3 {
-  static styles = i`
-    :host {
-      display: block;
-    }
-
-    .alert {
-      display: flex;
-      align-items: flex-start;
-      gap: var(--bds-space_s);
-      padding: var(--bds-space_m);
-      border-radius: var(--bds-border_radius--s);
-      border-inline-start: var(--bds-space_s) solid var(--alert_border, var(--bds-color_blue));
-      background-color: var(--alert_bg, var(--bds-color_blue--subtle));
-      color: var(--alert_text, var(--bds-color_on-blue--subtle));
-      font-size: var(--bds-font_size--body);
-      line-height: var(--bds-font_line-height--body);
-    }
-
-    /* Variant colours */
-    :host([variant='info']) .alert {
-      --alert_bg:     var(--bds-color_blue--subtle);
-      --alert_text:   var(--bds-color_on-blue--subtle);
-      --alert_border: var(--bds-color_blue);
-    }
-
-    :host([variant='success']) .alert {
-      --alert_bg:     var(--bds-color_success--subtle);
-      --alert_text:   var(--bds-color_on-success--subtle);
-      --alert_border: var(--bds-color_success);
-    }
-
-    :host([variant='warning']) .alert {
-      --alert_bg:     var(--bds-color_orange--subtle);
-      --alert_text:   var(--bds-color_on-orange--subtle);
-      --alert_border: var(--bds-color_warning);
-    }
-
-    :host([variant='error']) .alert {
-      --alert_bg:     rgb(from var(--bds-color_error) r g b / 12%);
-      --alert_text:   var(--bds-color_on-bg);
-      --alert_border: var(--bds-color_error);
-    }
-
-    /* Icon slot wrapper — hidden unless slot has content */
-    .icon {
-      display: none;
-      align-items: center;
-      flex-shrink: 0;
-      margin-block-start: 0.1em;
-    }
-
-    .icon.has-content {
-      display: flex;
-    }
-
-    /* Content area */
-    .content {
-      flex: 1;
-      display: flex;
-      flex-direction: column;
-      gap: var(--bds-space_xxs);
-    }
-
-    .title {
-      font-weight: var(--bds-font_weight--semibold);
-      font-size: var(--bds-font_size--body);
-    }
-
-    /* Dismiss button */
-    .dismiss {
-      all: unset;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      flex-shrink: 0;
-      cursor: pointer;
-      color: currentcolor;
-      transition: var(--bds-animation_transition);
-      border-radius: 50%;
-      --bdc_color: currentcolor;
-      outline: var(--bdc-outline_width) solid var(--bdc_color);
-      outline-offset: var(--bdc-outline_offset);
-    }
-
-    .dismiss svg {
-      width: 1rem;
-      height: 1rem;
-    }
-
-    .dismiss:focus-visible {
-      outline: var(--bds-outline_default);
-      outline-offset: var(--bds-outline_offset);
-    }
-
-    @media (hover: hover) and (pointer: fine) {
-      .dismiss:hover {
-        opacity: 0.7;
-      }
-    }
-  `;
-  static properties = {
-    variant: { type: String, reflect: true },
-    title: { type: String },
-    dismissible: { type: Boolean, reflect: true },
-    _iconFilled: { state: true }
-  };
-  constructor() {
-    super();
-    this.variant = "info";
-    this.title = "";
-    this.dismissible = false;
-    this._iconFilled = false;
-  }
-  _onIconSlotChange(e3) {
-    const slot = e3.target;
-    this._iconFilled = slot.assignedNodes({ flatten: true }).length > 0;
-  }
-  get _isUrgent() {
-    return this.variant === "error" || this.variant === "warning";
-  }
-  _handleDismiss() {
-    this.dispatchEvent(new CustomEvent("bds-dismiss", { bubbles: true, composed: true }));
-  }
-  render() {
-    return T`
-      <div
-        class="alert"
-        role=${this._isUrgent ? "alert" : "status"}
-        aria-live=${this._isUrgent ? "assertive" : "polite"}
-        aria-atomic="true"
-      >
-        <span class="icon ${this._iconFilled ? "has-content" : ""}" aria-hidden="true">
-          <slot name="icon" @slotchange=${this._onIconSlotChange}></slot>
-        </span>
-        <div class="content">
-          ${this.title ? T`<strong class="title">${this.title}</strong>` : A}
-          <div><slot></slot></div>
-        </div>
-        ${this.dismissible ? T`
-              <button
-                type="button"
-                class="dismiss"
-                @click=${this._handleDismiss}
-                aria-label="Dismiss alert"
-              >
-                <svg aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                  <path stroke-linecap="round" stroke-linejoin="round" d="M18 6L6 18M6 6l12 12" />
-                </svg>
-              </button>
-            ` : A}
-      </div>
-    `;
-  }
-};
-customElements.define("bds-alert", BdsAlert);
-
-// src/web-components/interaction/bds-popover.ts
-var BdsPopover = class extends i3 {
-  static styles = i`
-    :host {
-      display: inline-flex;
-      position: relative;
-    }
-
-    /* The wrapper IS the CSS anchor — anchor-name resolves via the custom
-       property injected on :host in connectedCallback(), so each instance
-       gets its own unique name without colliding with siblings. */
-    .wrapper {
-      display: inline-flex;
-      anchor-name: var(--bds-popover-anchor);
-    }
-
-    .panel {
-      display: none;
-      position: absolute;
-      position-anchor: var(--bds-popover-anchor);
-      margin: 0;
-      overflow-y: auto;
-      z-index: var(--popover_z-index, 100);
-      min-width: 12rem;
-      padding: var(--bds-space_m);
-      border-radius: var(--bds-border_radius--s);
-      background-color: var(--popover_color, var(--bds-color_bg));
-      box-shadow: var(--popover_shadow, var(--bds-shadow_m));
-      color: var(--popover_on-color, var(--bds-color_on-bg));
-      font-size: var(--bds-font_size--body);
-    }
-
-    .panel.open {
-      display: block;
-    }
-
-    /* Primary placements */
-
-    .panel[data-placement='bottom'] {
-      top: anchor(bottom);
-      left: anchor(left);
-      margin-top: var(--bds-space_xs, 8px);
-      position-try-fallbacks: --bds-popover-top, --bds-popover-right, --bds-popover-left;
-    }
-
-    .panel[data-placement='top'] {
-      bottom: anchor(top);
-      left: anchor(left);
-      margin-bottom: var(--bds-space_xs, 8px);
-      position-try-fallbacks: --bds-popover-bottom, --bds-popover-right, --bds-popover-left;
-    }
-
-    .panel[data-placement='right'] {
-      top: anchor(top);
-      left: anchor(right);
-      margin-left: var(--bds-space_xs, 8px);
-      position-try-fallbacks: --bds-popover-left, --bds-popover-bottom, --bds-popover-top;
-    }
-
-    .panel[data-placement='left'] {
-      top: anchor(top);
-      right: anchor(left);
-      margin-right: var(--bds-space_xs, 8px);
-      position-try-fallbacks: --bds-popover-right, --bds-popover-bottom, --bds-popover-top;
-    }
-
-    /* Fallback placements */
-
-    @position-try --bds-popover-bottom {
-      top: anchor(bottom);
-      right: unset;
-      bottom: unset;
-      left: anchor(left);
-      margin: 0;
-      margin-top: var(--bds-space_xs, 8px);
-    }
-
-    @position-try --bds-popover-top {
-      top: unset;
-      right: unset;
-      bottom: anchor(top);
-      left: anchor(left);
-      margin: 0;
-      margin-bottom: var(--bds-space_xs, 8px);
-    }
-
-    @position-try --bds-popover-right {
-      top: anchor(top);
-      right: unset;
-      bottom: unset;
-      left: anchor(right);
-      margin: 0;
-      margin-left: var(--bds-space_xs, 8px);
-    }
-
-    @position-try --bds-popover-left {
-      top: anchor(top);
-      right: anchor(left);
-      bottom: unset;
-      left: unset;
-      margin: 0;
-      margin-right: var(--bds-space_xs, 8px);
-    }
-  `;
-  static properties = {
-    placement: { type: String, reflect: true },
-    open: { type: Boolean, reflect: true }
-  };
-  _anchorName;
-  constructor() {
-    super();
-    this.placement = "bottom";
-    this.open = false;
-    const uid = Math.random().toString(36).slice(2, 8);
-    this._anchorName = `--bds-popover-${uid}`;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    this.style.setProperty("--bds-popover-anchor", this._anchorName);
-    document.addEventListener("keydown", this._onKeydown);
-    document.addEventListener("mousedown", this._onOutsideClick);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    document.removeEventListener("keydown", this._onKeydown);
-    document.removeEventListener("mousedown", this._onOutsideClick);
-  }
-  _onKeydown = (e3) => {
-    if (this.open && e3.key === "Escape") this._close();
-  };
-  _onOutsideClick = (e3) => {
-    if (this.open && !this.contains(e3.target)) this._close();
-  };
-  _toggle() {
-    if (this.open) {
-      this._close();
-    } else {
-      this._open();
-    }
-  }
-  _open() {
-    this.open = true;
-    this.dispatchEvent(new CustomEvent("bds-open", { bubbles: true, composed: true }));
-  }
-  _close() {
-    this.open = false;
-    this.dispatchEvent(new CustomEvent("bds-close", { bubbles: true, composed: true }));
-  }
-  render() {
-    return T`
-      <span class="wrapper">
-        <slot name="trigger" @click=${this._toggle}></slot>
-      </span>
-      <div
-        class="panel ${this.open ? "open" : ""}"
-        data-placement=${this.placement}
-        role="region"
-        aria-label="Popover"
-      >
-        <slot></slot>
-      </div>
-    `;
-  }
-};
-customElements.define("bds-popover", BdsPopover);
-
-// src/web-components/interaction/bds-toast-provider.ts
-var BdsToastProvider = class extends i3 {
-  static styles = i`
-    :host {
-      display: contents;
-    }
-
-    .container {
-      /* Reset UA popover defaults */
-      position: fixed;
-      inset: unset;
-      bottom: var(--bds-space_xl, 2rem);
-      right: var(--bds-space_xl, 2rem);
-      display: flex;
-      flex-direction: column;
-      gap: var(--bds-space_m, 1rem);
-      border: none;
-      padding: 0;
-      background: transparent;
-    }
-
-    .toast {
-      padding: var(--bds-space_m) var(--bds-space_l);
-      background-color: var(--toast_color, var(--bds-color_bg));
-      color: var(--toast_on-color, var(--bds-color_on-bg));
-      border-radius: var(--bds-border_radius--s);
-      box-shadow: var(--bds-shadow_s);
-      display: flex;
-      align-items: center;
-      gap: var(--bds-space_m);
-      min-width: 300px;
-    }
-
-    .toast.--variant_success {
-      --toast_color:    var(--bds-color_success);
-      --toast_on-color: var(--bds-color_on-success);
-    }
-
-    .toast.--variant_warning {
-      --toast_color:    var(--bds-color_warning);
-      --toast_on-color: var(--bds-color_on-warning);
-    }
-
-    .toast.--variant_info {
-      --toast_color:    var(--bds-color_bg--subtle);
-      --toast_on-color: var(--bds-color_on-bg--subtle);
-    }
-
-    .toast.--variant_error {
-      --toast_color:    var(--bds-color_error);
-      --toast_on-color: var(--bds-color_on-error);
-    }
-
-    .message {
-      flex: 1;
-    }
-
-    .close {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      flex-shrink: 0;
-      width: 1.25rem;
-      height: 1.25rem;
-      padding: 0;
-      background: none;
-      border: none;
-      cursor: pointer;
-      color: var(--toast_on-color);
-    }
-
-    .close svg {
-      width: 1rem;
-      height: 1rem;
-    }
-  `;
-  static properties = {
-    _toasts: { state: true }
-  };
-  constructor() {
-    super();
-    this._toasts = [];
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    document.addEventListener("bds-show-toast", this._onShowToastEvent);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback();
-    document.removeEventListener("bds-show-toast", this._onShowToastEvent);
-  }
-  // Sync the popover's top-layer visibility with the toast queue —
-  // mirrors Toast.tsx's useEffect([toasts.length]).
-  updated() {
-    const container = this.shadowRoot?.querySelector("[popover]");
-    if (!container) return;
-    if (this._toasts.length > 0) {
-      container.showPopover?.();
-    } else {
-      try {
-        container.hidePopover?.();
-      } catch {
-      }
-    }
-  }
-  showToast(message, variant = "info") {
-    const id = Math.random().toString(36).slice(2, 9);
-    this._toasts = [...this._toasts, { id, message, variant }];
-    setTimeout(() => this._removeToast(id), 5e3);
-  }
-  _removeToast(id) {
-    this._toasts = this._toasts.filter((t3) => t3.id !== id);
-  }
-  _onShowToastEvent = (e3) => {
-    const { message, variant } = e3.detail ?? {};
-    if (message) this.showToast(message, variant);
-  };
-  static show(message, variant) {
-    const provider = document.querySelector("bds-toast-provider");
-    provider?.showToast(message, variant ?? "info");
-  }
-  render() {
-    return T`
-      <slot></slot>
-      <div
-        popover="manual"
-        role="region"
-        aria-label="Notifications"
-        class="container"
-      >
-        ${this._toasts.map((t3) => T`
-          <div
-            class="toast --variant_${t3.variant}"
-            role="status"
-            aria-live="polite"
-            aria-atomic="true"
-          >
-            <span class="message">${t3.message}</span>
-            <button
-              type="button"
-              class="close"
-              @click=${() => this._removeToast(t3.id)}
-              aria-label="Dismiss"
-            >
-              <svg aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                <path stroke-linecap="round" stroke-linejoin="round" d="M18 6L6 18M6 6l12 12" />
-              </svg>
-            </button>
-          </div>
-        `)}
-      </div>
-    `;
-  }
-};
-customElements.define("bds-toast-provider", BdsToastProvider);
 export {
-  BdsAlert,
-  BdsBadge,
-  BdsButton,
-  BdsPopover,
-  BdsToastProvider
+  i,
+  T,
+  b2 as b,
+  w,
+  A,
+  i3 as i2
 };
 /*! Bundled license information:
 
-@lit-labs/ssr-dom-shim/lib/element-internals.js:
-@lit-labs/ssr-dom-shim/lib/events.js:
+@lit/reactive-element/node/css-tag.js:
+@lit-labs/ssr-dom-shim/index.js:
   (**
    * @license
-   * Copyright 2023 Google LLC
+   * Copyright 2019 Google LLC
    * SPDX-License-Identifier: BSD-3-Clause
    *)
 
-@lit-labs/ssr-dom-shim/lib/css.js:
+@lit-labs/ssr-dom-shim/lib/element-internals.js:
+@lit-labs/ssr-dom-shim/lib/events.js:
   (**
    * @license
-   * Copyright 2024 Google LLC
+   * Copyright 2023 Google LLC
    * SPDX-License-Identifier: BSD-3-Clause
    *)
 
-@lit-labs/ssr-dom-shim/index.js:
-@lit/reactive-element/node/css-tag.js:
+@lit-labs/ssr-dom-shim/lib/css.js:
   (**
    * @license
-   * Copyright 2019 Google LLC
+   * Copyright 2024 Google LLC
    * SPDX-License-Identifier: BSD-3-Clause
    *)