@helixui/library 0.1.0

package/dist/shared/hx-split-button-hBPl-zRv.js

@@ -0,0 +1,542 @@
+import { css as m, LitElement as v, html as d } from "lit";
+import { query as c, state as x, property as u, customElement as g } from "lit/decorators.js";
+import { classMap as h } from "lit/directives/class-map.js";
+import { t as f } from "./lit-Dpo7RLp4.js";
+const _ = m`
+  :host {
+    display: inline-block;
+    position: relative;
+  }
+
+  :host([disabled]) {
+    pointer-events: none;
+    opacity: var(--hx-opacity-disabled, 0.5);
+  }
+
+  /* ─── Container ─── */
+
+  .split-button {
+    display: inline-flex;
+    align-items: stretch;
+    position: relative;
+  }
+
+  /* ─── Primary Button ─── */
+
+  .split-button__primary {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--hx-space-2, 0.5rem);
+    border: var(--hx-border-width-thin, 1px) solid var(--hx-split-button-border-color, transparent);
+    border-right: none;
+    border-radius: var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem)) 0 0
+      var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem));
+    background-color: var(--hx-split-button-bg, var(--hx-color-primary-500, #2563eb));
+    color: var(--hx-split-button-color, var(--hx-color-neutral-0, #ffffff));
+    font-family: var(--hx-split-button-font-family, var(--hx-font-family-sans, sans-serif));
+    font-weight: var(--hx-split-button-font-weight, var(--hx-font-weight-semibold, 600));
+    line-height: var(--hx-line-height-tight, 1.25);
+    cursor: pointer;
+    transition:
+      background-color var(--hx-transition-fast, 150ms ease),
+      color var(--hx-transition-fast, 150ms ease),
+      border-color var(--hx-transition-fast, 150ms ease),
+      box-shadow var(--hx-transition-fast, 150ms ease);
+    text-decoration: none;
+    white-space: nowrap;
+    user-select: none;
+    -webkit-user-select: none;
+    flex: 1 1 auto;
+  }
+
+  .split-button__primary:focus-visible {
+    outline: var(--hx-focus-ring-width, 2px) solid
+      var(--hx-split-button-focus-ring-color, var(--hx-focus-ring-color, #2563eb));
+    outline-offset: var(--hx-focus-ring-offset, 2px);
+    z-index: 1;
+    position: relative;
+  }
+
+  .split-button__primary:hover {
+    filter: brightness(var(--hx-filter-brightness-hover, 0.9));
+  }
+
+  .split-button__primary:active {
+    filter: brightness(var(--hx-filter-brightness-active, 0.8));
+  }
+
+  .split-button__primary[disabled] {
+    cursor: not-allowed;
+  }
+
+  /* ─── Trigger Button ─── */
+
+  .split-button__trigger {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    border: var(--hx-border-width-thin, 1px) solid var(--hx-split-button-border-color, transparent);
+    border-left: var(--hx-border-width-thin, 1px) solid
+      var(--hx-split-button-divider-color, var(--hx-color-primary-400, #3b82f6));
+    border-radius: 0 var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem))
+      var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem)) 0;
+    background-color: var(--hx-split-button-bg, var(--hx-color-primary-500, #2563eb));
+    color: var(--hx-split-button-color, var(--hx-color-neutral-0, #ffffff));
+    cursor: pointer;
+    transition:
+      background-color var(--hx-transition-fast, 150ms ease),
+      box-shadow var(--hx-transition-fast, 150ms ease);
+    user-select: none;
+    -webkit-user-select: none;
+  }
+
+  .split-button__trigger:focus-visible {
+    outline: var(--hx-focus-ring-width, 2px) solid
+      var(--hx-split-button-focus-ring-color, var(--hx-focus-ring-color, #2563eb));
+    outline-offset: var(--hx-focus-ring-offset, 2px);
+    z-index: 1;
+    position: relative;
+  }
+
+  .split-button__trigger:hover {
+    filter: brightness(var(--hx-filter-brightness-hover, 0.9));
+  }
+
+  .split-button__trigger:active {
+    filter: brightness(var(--hx-filter-brightness-active, 0.8));
+  }
+
+  .split-button__trigger[disabled] {
+    cursor: not-allowed;
+  }
+
+  /* ─── Trigger Icon ─── */
+
+  .split-button__chevron {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    transition: transform var(--hx-transition-fast, 150ms ease);
+  }
+
+  .split-button__chevron--open {
+    transform: rotate(180deg);
+  }
+
+  /* ─── Size Variants ─── */
+
+  /* sm */
+  .split-button--sm .split-button__primary {
+    padding: var(--hx-space-1, 0.25rem) var(--hx-space-3, 0.75rem);
+    font-size: var(--hx-font-size-sm, 0.875rem);
+    min-height: var(--hx-size-8, 2rem);
+  }
+
+  .split-button--sm .split-button__trigger {
+    padding: var(--hx-space-1, 0.25rem) var(--hx-space-2, 0.5rem);
+    min-height: var(--hx-size-8, 2rem);
+  }
+
+  /* md */
+  .split-button--md .split-button__primary {
+    padding: var(--hx-space-2, 0.5rem) var(--hx-space-4, 1rem);
+    font-size: var(--hx-font-size-md, 1rem);
+    min-height: var(--hx-size-10, 2.5rem);
+  }
+
+  .split-button--md .split-button__trigger {
+    padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);
+    min-height: var(--hx-size-10, 2.5rem);
+  }
+
+  /* lg */
+  .split-button--lg .split-button__primary {
+    padding: var(--hx-space-3, 0.75rem) var(--hx-space-6, 1.5rem);
+    font-size: var(--hx-font-size-lg, 1.125rem);
+    min-height: var(--hx-size-12, 3rem);
+  }
+
+  .split-button--lg .split-button__trigger {
+    padding: var(--hx-space-3, 0.75rem) var(--hx-space-4, 1rem);
+    min-height: var(--hx-size-12, 3rem);
+  }
+
+  /* ─── Variant: primary ─── */
+
+  .split-button--primary .split-button__primary,
+  .split-button--primary .split-button__trigger {
+    --hx-split-button-bg: var(--hx-color-primary-500, #2563eb);
+    --hx-split-button-color: var(--hx-color-neutral-0, #ffffff);
+    --hx-split-button-border-color: transparent;
+    --hx-split-button-divider-color: var(--hx-color-primary-400, #3b82f6);
+  }
+
+  /* ─── Variant: secondary ─── */
+
+  .split-button--secondary .split-button__primary,
+  .split-button--secondary .split-button__trigger {
+    --hx-split-button-bg: transparent;
+    --hx-split-button-color: var(--hx-color-primary-500, #2563eb);
+    --hx-split-button-border-color: var(--hx-color-primary-500, #2563eb);
+    --hx-split-button-divider-color: var(--hx-color-primary-300, #93c5fd);
+  }
+
+  .split-button--secondary .split-button__primary:hover,
+  .split-button--secondary .split-button__trigger:hover {
+    --hx-split-button-bg: var(--hx-color-primary-50, #eff6ff);
+    filter: none;
+  }
+
+  /* ─── Variant: tertiary ─── */
+
+  .split-button--tertiary .split-button__primary,
+  .split-button--tertiary .split-button__trigger {
+    --hx-split-button-bg: var(--hx-color-neutral-100, #f1f5f9);
+    --hx-split-button-color: var(--hx-color-neutral-900, #0f172a);
+    --hx-split-button-border-color: transparent;
+    --hx-split-button-divider-color: var(--hx-color-neutral-300, #cbd5e1);
+  }
+
+  .split-button--tertiary .split-button__primary:hover,
+  .split-button--tertiary .split-button__trigger:hover {
+    --hx-split-button-bg: var(--hx-color-neutral-200, #e2e8f0);
+    filter: none;
+  }
+
+  /* ─── Variant: danger ─── */
+
+  .split-button--danger .split-button__primary,
+  .split-button--danger .split-button__trigger {
+    --hx-split-button-bg: var(--hx-color-error-500, #dc2626);
+    --hx-split-button-color: var(--hx-color-neutral-0, #ffffff);
+    --hx-split-button-border-color: transparent;
+    --hx-split-button-divider-color: var(--hx-color-error-400, #f87171);
+  }
+
+  .split-button--danger .split-button__primary:hover,
+  .split-button--danger .split-button__trigger:hover {
+    --hx-split-button-bg: var(--hx-color-error-600, #b91c1c);
+    filter: none;
+  }
+
+  /* ─── Variant: ghost ─── */
+
+  .split-button--ghost .split-button__primary,
+  .split-button--ghost .split-button__trigger {
+    --hx-split-button-bg: transparent;
+    --hx-split-button-color: var(--hx-color-primary-500, #2563eb);
+    --hx-split-button-border-color: transparent;
+    --hx-split-button-divider-color: var(--hx-color-primary-200, #bfdbfe);
+  }
+
+  .split-button--ghost .split-button__primary:hover,
+  .split-button--ghost .split-button__trigger:hover {
+    --hx-split-button-bg: var(--hx-color-neutral-100, #f1f5f9);
+    filter: none;
+  }
+
+  /* ─── Variant: outline ─── */
+
+  .split-button--outline .split-button__primary,
+  .split-button--outline .split-button__trigger {
+    --hx-split-button-bg: transparent;
+    --hx-split-button-color: var(--hx-color-neutral-900, #0f172a);
+    --hx-split-button-border-color: var(--hx-color-neutral-300, #cbd5e1);
+    --hx-split-button-divider-color: var(--hx-color-neutral-300, #cbd5e1);
+  }
+
+  .split-button--outline .split-button__primary:hover,
+  .split-button--outline .split-button__trigger:hover {
+    --hx-split-button-bg: var(--hx-color-neutral-50, #f8fafc);
+    filter: none;
+  }
+
+  /* ─── Dropdown Menu Panel ─── */
+
+  @keyframes hx-split-button-menu-open {
+    from {
+      opacity: 0;
+      transform: translateY(-4px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  .split-button__menu {
+    display: none;
+    position: absolute;
+    top: calc(100% + var(--hx-space-1, 0.25rem));
+    inset-inline-end: 0;
+    min-width: 100%;
+    max-height: var(--hx-split-button-menu-max-height, 18rem);
+    overflow-y: auto;
+    background-color: var(--hx-split-button-menu-bg, var(--hx-color-neutral-0, #ffffff));
+    border: var(--hx-border-width-thin, 1px) solid
+      var(--hx-split-button-menu-border-color, var(--hx-color-neutral-200, #e2e8f0));
+    border-radius: var(--hx-split-button-menu-border-radius, var(--hx-border-radius-md, 0.375rem));
+    box-shadow: var(
+      --hx-split-button-menu-shadow,
+      0 4px 6px -1px var(--hx-overlay-black-10, rgba(0, 0, 0, 0.1)),
+      0 2px 4px -2px var(--hx-overlay-black-10, rgba(0, 0, 0, 0.1))
+    );
+    padding: var(--hx-space-1, 0.25rem);
+    z-index: var(--hx-z-index-dropdown, 200);
+  }
+
+  .split-button__menu--open {
+    display: block;
+    animation: hx-split-button-menu-open var(--hx-transition-fast, 150ms ease);
+  }
+
+  /* ─── Reduced Motion ─── */
+
+  @media (prefers-reduced-motion: reduce) {
+    .split-button__primary,
+    .split-button__trigger,
+    .split-button__chevron {
+      transition: none;
+    }
+
+    .split-button__menu--open {
+      animation: none;
+    }
+  }
+`;
+var y = Object.defineProperty, w = Object.getOwnPropertyDescriptor, n = (t, r, e, s) => {
+  for (var o = s > 1 ? void 0 : s ? w(r, e) : r, a = t.length - 1, l; a >= 0; a--)
+    (l = t[a]) && (o = (s ? l(r, e, o) : l(o)) || o);
+  return s && o && y(r, e, o), o;
+};
+let k = 0, i = class extends v {
+  constructor() {
+    super(...arguments), this._open = !1, this.variant = "primary", this.size = "md", this.disabled = !1, this.label = void 0, this.triggerLabel = "More actions", this.menuLabel = "Secondary actions", this._menuId = `hx-split-button-menu-${++k}`, this._handleOutsideClick = (t) => {
+      if (!this._open) return;
+      const r = t.target;
+      !this.contains(r) && r !== this && this._closeMenu();
+    }, this._handleDocumentKeydown = (t) => {
+      this._open && t.key === "Tab" && this._closeMenu();
+    };
+  }
+  // ─── Lifecycle ───
+  connectedCallback() {
+    super.connectedCallback(), document.addEventListener("click", this._handleOutsideClick), document.addEventListener("keydown", this._handleDocumentKeydown);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), document.removeEventListener("click", this._handleOutsideClick), document.removeEventListener("keydown", this._handleDocumentKeydown);
+  }
+  // ─── Primary Button Handlers ───
+  _handlePrimaryClick(t) {
+    if (this.disabled) {
+      t.preventDefault(), t.stopPropagation();
+      return;
+    }
+    this.dispatchEvent(
+      new CustomEvent("hx-click", {
+        bubbles: !0,
+        composed: !0,
+        detail: { originalEvent: t }
+      })
+    );
+  }
+  _handlePrimaryKeydown(t) {
+    this.disabled || t.key === "ArrowDown" && (t.preventDefault(), this._openMenu());
+  }
+  // ─── Trigger Button Handlers ───
+  _handleTriggerClick(t) {
+    if (this.disabled) {
+      t.preventDefault(), t.stopPropagation();
+      return;
+    }
+    t.stopPropagation(), this._toggleMenu();
+  }
+  _handleTriggerKeydown(t) {
+    this.disabled || t.key === "ArrowDown" && (t.preventDefault(), this._openMenu());
+  }
+  // ─── Menu Key Navigation ───
+  _handleMenuKeydown(t) {
+    var s, o, a, l, b;
+    const r = this._getMenuItems();
+    if (r.length === 0) return;
+    const e = r.findIndex((p) => p === document.activeElement);
+    switch (t.key) {
+      case "ArrowDown": {
+        t.preventDefault();
+        const p = e < r.length - 1 ? e + 1 : 0;
+        (s = r[p]) == null || s.focus();
+        break;
+      }
+      case "ArrowUp": {
+        t.preventDefault();
+        const p = e > 0 ? e - 1 : r.length - 1;
+        (o = r[p]) == null || o.focus();
+        break;
+      }
+      case "Escape": {
+        t.preventDefault(), this._closeMenu(), (a = this._triggerButton) == null || a.focus();
+        break;
+      }
+      case "Home": {
+        t.preventDefault(), (l = r[0]) == null || l.focus();
+        break;
+      }
+      case "End": {
+        t.preventDefault(), (b = r[r.length - 1]) == null || b.focus();
+        break;
+      }
+    }
+  }
+  // ─── Menu Item Selection ───
+  _handleMenuItemSelect(t) {
+    var o, a;
+    const r = t;
+    this._closeMenu(), (o = this._triggerButton) == null || o.focus();
+    const e = r.detail.item, s = ((a = e == null ? void 0 : e.textContent) == null ? void 0 : a.trim()) ?? "";
+    this.dispatchEvent(
+      new CustomEvent("hx-select", {
+        bubbles: !0,
+        composed: !0,
+        detail: { value: r.detail.value, label: s }
+      })
+    );
+  }
+  // ─── Menu Helpers ───
+  _openMenu() {
+    this._open || (this._open = !0, this.updateComplete.then(() => {
+      var r;
+      (r = this._getMenuItems()[0]) == null || r.focus();
+    }).catch(() => {
+    }));
+  }
+  _closeMenu() {
+    this._open = !1;
+  }
+  _toggleMenu() {
+    this._open ? this._closeMenu() : this._openMenu();
+  }
+  /**
+   * Returns the enabled hx-menu-item host elements assigned to the `menu` slot.
+   * HelixMenuItem overrides focus() to delegate to its inner element, so calling
+   * .focus() on hosts works correctly. document.activeElement returns the host
+   * element when the inner shadow element has focus, enabling correct index tracking.
+   */
+  _getMenuItems() {
+    var r;
+    const t = (r = this.shadowRoot) == null ? void 0 : r.querySelector('slot[name="menu"]');
+    return t ? t.assignedElements({ flatten: !0 }).filter(
+      (e) => e.tagName.toLowerCase() === "hx-menu-item" && !e.disabled
+    ) : [];
+  }
+  // ─── Render ───
+  render() {
+    const t = {
+      "split-button": !0,
+      [`split-button--${this.variant}`]: !0,
+      [`split-button--${this.size}`]: !0
+    }, r = {
+      "split-button__menu": !0,
+      "split-button__menu--open": this._open
+    }, e = {
+      "split-button__chevron": !0,
+      "split-button__chevron--open": this._open
+    };
+    return d`
+      <div class=${h(t)}>
+        <!-- Primary action button -->
+        <button
+          part="button"
+          class="split-button__primary"
+          ?disabled=${this.disabled}
+          type="button"
+          @click=${this._handlePrimaryClick}
+          @keydown=${this._handlePrimaryKeydown}
+        >
+          ${this.label !== void 0 ? this.label : d`<slot></slot>`}
+        </button>
+
+        <!-- Dropdown trigger button -->
+        <button
+          part="trigger"
+          class="split-button__trigger"
+          ?disabled=${this.disabled}
+          aria-haspopup="menu"
+          aria-expanded=${this._open ? "true" : "false"}
+          aria-controls=${this._menuId}
+          aria-label=${this.triggerLabel}
+          type="button"
+          @click=${this._handleTriggerClick}
+          @keydown=${this._handleTriggerKeydown}
+        >
+          <span class=${h(e)} aria-hidden="true">
+            <svg
+              width="12"
+              height="8"
+              viewBox="0 0 12 8"
+              fill="none"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M1 1.5L6 6.5L11 1.5"
+                stroke="currentColor"
+                stroke-width="1.5"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              />
+            </svg>
+          </span>
+        </button>
+
+        <!-- Dropdown menu panel -->
+        <div
+          part="menu"
+          id=${this._menuId}
+          class=${h(r)}
+          role="menu"
+          aria-label=${this.menuLabel}
+          @keydown=${this._handleMenuKeydown}
+          @hx-item-select=${this._handleMenuItemSelect}
+        >
+          <slot name="menu"></slot>
+        </div>
+      </div>
+    `;
+  }
+};
+i.styles = [f, _];
+n([
+  c(".split-button__menu")
+], i.prototype, "_menuPanel", 2);
+n([
+  c(".split-button__trigger")
+], i.prototype, "_triggerButton", 2);
+n([
+  x()
+], i.prototype, "_open", 2);
+n([
+  u({ type: String, reflect: !0 })
+], i.prototype, "variant", 2);
+n([
+  u({ type: String, reflect: !0, attribute: "hx-size" })
+], i.prototype, "size", 2);
+n([
+  u({ type: Boolean, reflect: !0 })
+], i.prototype, "disabled", 2);
+n([
+  u({ type: String })
+], i.prototype, "label", 2);
+n([
+  u({ type: String, attribute: "trigger-label" })
+], i.prototype, "triggerLabel", 2);
+n([
+  u({ type: String, attribute: "menu-label" })
+], i.prototype, "menuLabel", 2);
+i = n([
+  g("hx-split-button")
+], i);
+export {
+  i as H
+};
+//# sourceMappingURL=hx-split-button-hBPl-zRv.js.map

package/dist/shared/hx-split-button-hBPl-zRv.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-split-button-hBPl-zRv.js","sources":["../../src/components/hx-split-button/hx-split-button.styles.ts","../../src/components/hx-split-button/hx-split-button.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixSplitButtonStyles = css`\n  :host {\n    display: inline-block;\n    position: relative;\n  }\n\n  :host([disabled]) {\n    pointer-events: none;\n    opacity: var(--hx-opacity-disabled, 0.5);\n  }\n\n  /* ─── Container ─── */\n\n  .split-button {\n    display: inline-flex;\n    align-items: stretch;\n    position: relative;\n  }\n\n  /* ─── Primary Button ─── */\n\n  .split-button__primary {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--hx-space-2, 0.5rem);\n    border: var(--hx-border-width-thin, 1px) solid var(--hx-split-button-border-color, transparent);\n    border-right: none;\n    border-radius: var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem)) 0 0\n      var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem));\n    background-color: var(--hx-split-button-bg, var(--hx-color-primary-500, #2563eb));\n    color: var(--hx-split-button-color, var(--hx-color-neutral-0, #ffffff));\n    font-family: var(--hx-split-button-font-family, var(--hx-font-family-sans, sans-serif));\n    font-weight: var(--hx-split-button-font-weight, var(--hx-font-weight-semibold, 600));\n    line-height: var(--hx-line-height-tight, 1.25);\n    cursor: pointer;\n    transition:\n      background-color var(--hx-transition-fast, 150ms ease),\n      color var(--hx-transition-fast, 150ms ease),\n      border-color var(--hx-transition-fast, 150ms ease),\n      box-shadow var(--hx-transition-fast, 150ms ease);\n    text-decoration: none;\n    white-space: nowrap;\n    user-select: none;\n    -webkit-user-select: none;\n    flex: 1 1 auto;\n  }\n\n  .split-button__primary:focus-visible {\n    outline: var(--hx-focus-ring-width, 2px) solid\n      var(--hx-split-button-focus-ring-color, var(--hx-focus-ring-color, #2563eb));\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n    z-index: 1;\n    position: relative;\n  }\n\n  .split-button__primary:hover {\n    filter: brightness(var(--hx-filter-brightness-hover, 0.9));\n  }\n\n  .split-button__primary:active {\n    filter: brightness(var(--hx-filter-brightness-active, 0.8));\n  }\n\n  .split-button__primary[disabled] {\n    cursor: not-allowed;\n  }\n\n  /* ─── Trigger Button ─── */\n\n  .split-button__trigger {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    border: var(--hx-border-width-thin, 1px) solid var(--hx-split-button-border-color, transparent);\n    border-left: var(--hx-border-width-thin, 1px) solid\n      var(--hx-split-button-divider-color, var(--hx-color-primary-400, #3b82f6));\n    border-radius: 0 var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem))\n      var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem)) 0;\n    background-color: var(--hx-split-button-bg, var(--hx-color-primary-500, #2563eb));\n    color: var(--hx-split-button-color, var(--hx-color-neutral-0, #ffffff));\n    cursor: pointer;\n    transition:\n      background-color var(--hx-transition-fast, 150ms ease),\n      box-shadow var(--hx-transition-fast, 150ms ease);\n    user-select: none;\n    -webkit-user-select: none;\n  }\n\n  .split-button__trigger:focus-visible {\n    outline: var(--hx-focus-ring-width, 2px) solid\n      var(--hx-split-button-focus-ring-color, var(--hx-focus-ring-color, #2563eb));\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n    z-index: 1;\n    position: relative;\n  }\n\n  .split-button__trigger:hover {\n    filter: brightness(var(--hx-filter-brightness-hover, 0.9));\n  }\n\n  .split-button__trigger:active {\n    filter: brightness(var(--hx-filter-brightness-active, 0.8));\n  }\n\n  .split-button__trigger[disabled] {\n    cursor: not-allowed;\n  }\n\n  /* ─── Trigger Icon ─── */\n\n  .split-button__chevron {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    transition: transform var(--hx-transition-fast, 150ms ease);\n  }\n\n  .split-button__chevron--open {\n    transform: rotate(180deg);\n  }\n\n  /* ─── Size Variants ─── */\n\n  /* sm */\n  .split-button--sm .split-button__primary {\n    padding: var(--hx-space-1, 0.25rem) var(--hx-space-3, 0.75rem);\n    font-size: var(--hx-font-size-sm, 0.875rem);\n    min-height: var(--hx-size-8, 2rem);\n  }\n\n  .split-button--sm .split-button__trigger {\n    padding: var(--hx-space-1, 0.25rem) var(--hx-space-2, 0.5rem);\n    min-height: var(--hx-size-8, 2rem);\n  }\n\n  /* md */\n  .split-button--md .split-button__primary {\n    padding: var(--hx-space-2, 0.5rem) var(--hx-space-4, 1rem);\n    font-size: var(--hx-font-size-md, 1rem);\n    min-height: var(--hx-size-10, 2.5rem);\n  }\n\n  .split-button--md .split-button__trigger {\n    padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);\n    min-height: var(--hx-size-10, 2.5rem);\n  }\n\n  /* lg */\n  .split-button--lg .split-button__primary {\n    padding: var(--hx-space-3, 0.75rem) var(--hx-space-6, 1.5rem);\n    font-size: var(--hx-font-size-lg, 1.125rem);\n    min-height: var(--hx-size-12, 3rem);\n  }\n\n  .split-button--lg .split-button__trigger {\n    padding: var(--hx-space-3, 0.75rem) var(--hx-space-4, 1rem);\n    min-height: var(--hx-size-12, 3rem);\n  }\n\n  /* ─── Variant: primary ─── */\n\n  .split-button--primary .split-button__primary,\n  .split-button--primary .split-button__trigger {\n    --hx-split-button-bg: var(--hx-color-primary-500, #2563eb);\n    --hx-split-button-color: var(--hx-color-neutral-0, #ffffff);\n    --hx-split-button-border-color: transparent;\n    --hx-split-button-divider-color: var(--hx-color-primary-400, #3b82f6);\n  }\n\n  /* ─── Variant: secondary ─── */\n\n  .split-button--secondary .split-button__primary,\n  .split-button--secondary .split-button__trigger {\n    --hx-split-button-bg: transparent;\n    --hx-split-button-color: var(--hx-color-primary-500, #2563eb);\n    --hx-split-button-border-color: var(--hx-color-primary-500, #2563eb);\n    --hx-split-button-divider-color: var(--hx-color-primary-300, #93c5fd);\n  }\n\n  .split-button--secondary .split-button__primary:hover,\n  .split-button--secondary .split-button__trigger:hover {\n    --hx-split-button-bg: var(--hx-color-primary-50, #eff6ff);\n    filter: none;\n  }\n\n  /* ─── Variant: tertiary ─── */\n\n  .split-button--tertiary .split-button__primary,\n  .split-button--tertiary .split-button__trigger {\n    --hx-split-button-bg: var(--hx-color-neutral-100, #f1f5f9);\n    --hx-split-button-color: var(--hx-color-neutral-900, #0f172a);\n    --hx-split-button-border-color: transparent;\n    --hx-split-button-divider-color: var(--hx-color-neutral-300, #cbd5e1);\n  }\n\n  .split-button--tertiary .split-button__primary:hover,\n  .split-button--tertiary .split-button__trigger:hover {\n    --hx-split-button-bg: var(--hx-color-neutral-200, #e2e8f0);\n    filter: none;\n  }\n\n  /* ─── Variant: danger ─── */\n\n  .split-button--danger .split-button__primary,\n  .split-button--danger .split-button__trigger {\n    --hx-split-button-bg: var(--hx-color-error-500, #dc2626);\n    --hx-split-button-color: var(--hx-color-neutral-0, #ffffff);\n    --hx-split-button-border-color: transparent;\n    --hx-split-button-divider-color: var(--hx-color-error-400, #f87171);\n  }\n\n  .split-button--danger .split-button__primary:hover,\n  .split-button--danger .split-button__trigger:hover {\n    --hx-split-button-bg: var(--hx-color-error-600, #b91c1c);\n    filter: none;\n  }\n\n  /* ─── Variant: ghost ─── */\n\n  .split-button--ghost .split-button__primary,\n  .split-button--ghost .split-button__trigger {\n    --hx-split-button-bg: transparent;\n    --hx-split-button-color: var(--hx-color-primary-500, #2563eb);\n    --hx-split-button-border-color: transparent;\n    --hx-split-button-divider-color: var(--hx-color-primary-200, #bfdbfe);\n  }\n\n  .split-button--ghost .split-button__primary:hover,\n  .split-button--ghost .split-button__trigger:hover {\n    --hx-split-button-bg: var(--hx-color-neutral-100, #f1f5f9);\n    filter: none;\n  }\n\n  /* ─── Variant: outline ─── */\n\n  .split-button--outline .split-button__primary,\n  .split-button--outline .split-button__trigger {\n    --hx-split-button-bg: transparent;\n    --hx-split-button-color: var(--hx-color-neutral-900, #0f172a);\n    --hx-split-button-border-color: var(--hx-color-neutral-300, #cbd5e1);\n    --hx-split-button-divider-color: var(--hx-color-neutral-300, #cbd5e1);\n  }\n\n  .split-button--outline .split-button__primary:hover,\n  .split-button--outline .split-button__trigger:hover {\n    --hx-split-button-bg: var(--hx-color-neutral-50, #f8fafc);\n    filter: none;\n  }\n\n  /* ─── Dropdown Menu Panel ─── */\n\n  @keyframes hx-split-button-menu-open {\n    from {\n      opacity: 0;\n      transform: translateY(-4px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  .split-button__menu {\n    display: none;\n    position: absolute;\n    top: calc(100% + var(--hx-space-1, 0.25rem));\n    inset-inline-end: 0;\n    min-width: 100%;\n    max-height: var(--hx-split-button-menu-max-height, 18rem);\n    overflow-y: auto;\n    background-color: var(--hx-split-button-menu-bg, var(--hx-color-neutral-0, #ffffff));\n    border: var(--hx-border-width-thin, 1px) solid\n      var(--hx-split-button-menu-border-color, var(--hx-color-neutral-200, #e2e8f0));\n    border-radius: var(--hx-split-button-menu-border-radius, var(--hx-border-radius-md, 0.375rem));\n    box-shadow: var(\n      --hx-split-button-menu-shadow,\n      0 4px 6px -1px var(--hx-overlay-black-10, rgba(0, 0, 0, 0.1)),\n      0 2px 4px -2px var(--hx-overlay-black-10, rgba(0, 0, 0, 0.1))\n    );\n    padding: var(--hx-space-1, 0.25rem);\n    z-index: var(--hx-z-index-dropdown, 200);\n  }\n\n  .split-button__menu--open {\n    display: block;\n    animation: hx-split-button-menu-open var(--hx-transition-fast, 150ms ease);\n  }\n\n  /* ─── Reduced Motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .split-button__primary,\n    .split-button__trigger,\n    .split-button__chevron {\n      transition: none;\n    }\n\n    .split-button__menu--open {\n      animation: none;\n    }\n  }\n`;\n","import { LitElement, html } from 'lit';\nimport { customElement, property, state, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixSplitButtonStyles } from './hx-split-button.styles.js';\nimport type { HelixMenuItem } from '../hx-menu/hx-menu-item.js';\n\n// Module-level counter for stable, SSR-safe IDs (avoids Math.random() hydration mismatch)\nlet _hxSplitButtonIdCounter = 0;\n\n/**\n * A split button combining a primary action button with an attached dropdown\n * menu for secondary actions. Implements the ARIA menu button pattern for\n * full keyboard and screen reader support.\n *\n * @summary Primary action button with attached dropdown menu for secondary actions.\n *\n * @tag hx-split-button\n *\n * @slot - Primary button label text.\n * @slot menu - `hx-menu-item` children rendered in the dropdown panel.\n *\n * @fires {CustomEvent<{originalEvent: MouseEvent}>} hx-click - Dispatched when\n *   the primary button is clicked and is not disabled.\n * @fires {CustomEvent<{value: string; label: string}>} hx-select - Dispatched when\n *   a menu item is selected from the dropdown.\n *\n * @csspart button - The primary action button element.\n * @csspart trigger - The dropdown trigger button element.\n * @csspart menu - The dropdown menu panel.\n *\n * @cssprop [--hx-split-button-menu-max-height=18rem] - Maximum height of the dropdown menu panel before scrolling.\n * @cssprop [--hx-split-button-bg=var(--hx-color-primary-500)] - Background color for both buttons.\n * @cssprop [--hx-split-button-color=var(--hx-color-neutral-0)] - Text/icon color for both buttons.\n * @cssprop [--hx-split-button-border-color=transparent] - Border color.\n * @cssprop [--hx-split-button-border-radius=var(--hx-border-radius-md)] - Border radius.\n * @cssprop [--hx-split-button-divider-color=var(--hx-color-primary-400)] - Color of the divider between primary and trigger.\n * @cssprop [--hx-split-button-font-family=var(--hx-font-family-sans)] - Font family.\n * @cssprop [--hx-split-button-font-weight=var(--hx-font-weight-semibold)] - Font weight.\n * @cssprop [--hx-split-button-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-split-button-menu-bg=var(--hx-color-neutral-0)] - Dropdown menu background.\n * @cssprop [--hx-split-button-menu-border-color=var(--hx-color-neutral-200)] - Dropdown menu border color.\n * @cssprop [--hx-split-button-menu-border-radius=var(--hx-border-radius-md)] - Dropdown menu border radius.\n * @cssprop [--hx-split-button-menu-shadow] - Dropdown menu box shadow.\n */\n@customElement('hx-split-button')\nexport class HelixSplitButton extends LitElement {\n  static override styles = [tokenStyles, helixSplitButtonStyles];\n\n  // ─── Internal References ───\n\n  @query('.split-button__menu')\n  private _menuPanel!: HTMLElement;\n\n  @query('.split-button__trigger')\n  private _triggerButton!: HTMLButtonElement;\n\n  // ─── Internal State ───\n\n  @state() private _open = false;\n\n  // ─── Public Properties ───\n\n  /**\n   * Visual style variant of the split button.\n   * @attr variant\n   */\n  @property({ type: String, reflect: true })\n  variant: 'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost' | 'outline' = 'primary';\n\n  /**\n   * Size of the split button.\n   * @attr hx-size\n   */\n  @property({ type: String, reflect: true, attribute: 'hx-size' })\n  size: 'sm' | 'md' | 'lg' = 'md';\n\n  /**\n   * Whether the split button is disabled. Both the primary button and the\n   * trigger are disabled when this is true.\n   * @attr disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Primary button label text. When set, overrides the default slot content.\n   * @attr label\n   */\n  @property({ type: String })\n  label: string | undefined = undefined;\n\n  /**\n   * Accessible label for the dropdown trigger button. Override for localization.\n   * @attr trigger-label\n   */\n  @property({ type: String, attribute: 'trigger-label' })\n  triggerLabel = 'More actions';\n\n  /**\n   * Accessible label for the dropdown menu panel. Override for localization.\n   * @attr menu-label\n   */\n  @property({ type: String, attribute: 'menu-label' })\n  menuLabel = 'Secondary actions';\n\n  // ─── Unique IDs ───\n\n  private readonly _menuId = `hx-split-button-menu-${++_hxSplitButtonIdCounter}`;\n\n  // ─── Lifecycle ───\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    document.addEventListener('click', this._handleOutsideClick);\n    document.addEventListener('keydown', this._handleDocumentKeydown);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    document.removeEventListener('click', this._handleOutsideClick);\n    document.removeEventListener('keydown', this._handleDocumentKeydown);\n  }\n\n  // ─── Outside-click / document keydown ───\n\n  private readonly _handleOutsideClick = (e: MouseEvent): void => {\n    if (!this._open) return;\n    const target = e.target as Node;\n    if (!this.contains(target) && target !== this) {\n      this._closeMenu();\n    }\n  };\n\n  private readonly _handleDocumentKeydown = (e: KeyboardEvent): void => {\n    if (!this._open) return;\n    if (e.key === 'Tab') {\n      this._closeMenu();\n    }\n  };\n\n  // ─── Primary Button Handlers ───\n\n  private _handlePrimaryClick(e: MouseEvent): void {\n    if (this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n\n    /**\n     * Dispatched when the primary button is clicked.\n     * @event hx-click\n     */\n    this.dispatchEvent(\n      new CustomEvent<{ originalEvent: MouseEvent }>('hx-click', {\n        bubbles: true,\n        composed: true,\n        detail: { originalEvent: e },\n      }),\n    );\n  }\n\n  private _handlePrimaryKeydown(e: KeyboardEvent): void {\n    if (this.disabled) return;\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      this._openMenu();\n    }\n  }\n\n  // ─── Trigger Button Handlers ───\n\n  private _handleTriggerClick(e: MouseEvent): void {\n    if (this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n    // Stop propagation so _handleOutsideClick does not immediately close.\n    e.stopPropagation();\n    this._toggleMenu();\n  }\n\n  private _handleTriggerKeydown(e: KeyboardEvent): void {\n    if (this.disabled) return;\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      this._openMenu();\n    }\n  }\n\n  // ─── Menu Key Navigation ───\n\n  private _handleMenuKeydown(e: KeyboardEvent): void {\n    const items = this._getMenuItems();\n    if (items.length === 0) return;\n\n    // document.activeElement returns the hx-menu-item host element when its\n    // inner shadow DOM element has focus, which matches items[] directly.\n    const currentIndex = items.findIndex((item) => item === document.activeElement);\n\n    switch (e.key) {\n      case 'ArrowDown': {\n        e.preventDefault();\n        const next = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n        items[next]?.focus();\n        break;\n      }\n      case 'ArrowUp': {\n        e.preventDefault();\n        const prev = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n        items[prev]?.focus();\n        break;\n      }\n      case 'Escape': {\n        e.preventDefault();\n        this._closeMenu();\n        this._triggerButton?.focus();\n        break;\n      }\n      case 'Home': {\n        e.preventDefault();\n        items[0]?.focus();\n        break;\n      }\n      case 'End': {\n        e.preventDefault();\n        items[items.length - 1]?.focus();\n        break;\n      }\n    }\n  }\n\n  // ─── Menu Item Selection ───\n\n  private _handleMenuItemSelect(e: Event): void {\n    const custom = e as CustomEvent<{ item: HelixMenuItem; value: string }>;\n    this._closeMenu();\n    this._triggerButton?.focus();\n\n    const item = custom.detail.item;\n    const label = item?.textContent?.trim() ?? '';\n\n    /**\n     * Dispatched when a menu item is selected.\n     * @event hx-select\n     */\n    this.dispatchEvent(\n      new CustomEvent<{ value: string; label: string }>('hx-select', {\n        bubbles: true,\n        composed: true,\n        detail: { value: custom.detail.value, label },\n      }),\n    );\n  }\n\n  // ─── Menu Helpers ───\n\n  private _openMenu(): void {\n    if (this._open) return;\n    this._open = true;\n    // Focus the first enabled menu item after the panel renders\n    this.updateComplete\n      .then(() => {\n        const items = this._getMenuItems();\n        items[0]?.focus();\n      })\n      .catch(() => undefined);\n  }\n\n  private _closeMenu(): void {\n    this._open = false;\n  }\n\n  private _toggleMenu(): void {\n    if (this._open) {\n      this._closeMenu();\n    } else {\n      this._openMenu();\n    }\n  }\n\n  /**\n   * Returns the enabled hx-menu-item host elements assigned to the `menu` slot.\n   * HelixMenuItem overrides focus() to delegate to its inner element, so calling\n   * .focus() on hosts works correctly. document.activeElement returns the host\n   * element when the inner shadow element has focus, enabling correct index tracking.\n   */\n  private _getMenuItems(): HelixMenuItem[] {\n    const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"menu\"]');\n    if (!slot) return [];\n\n    return slot\n      .assignedElements({ flatten: true })\n      .filter(\n        (el): el is HelixMenuItem =>\n          el.tagName.toLowerCase() === 'hx-menu-item' && !(el as HelixMenuItem).disabled,\n      );\n  }\n\n  // ─── Render ───\n\n  override render() {\n    const containerClasses = {\n      'split-button': true,\n      [`split-button--${this.variant}`]: true,\n      [`split-button--${this.size}`]: true,\n    };\n\n    const menuClasses = {\n      'split-button__menu': true,\n      'split-button__menu--open': this._open,\n    };\n\n    const chevronClasses = {\n      'split-button__chevron': true,\n      'split-button__chevron--open': this._open,\n    };\n\n    return html`\n      <div class=${classMap(containerClasses)}>\n        <!-- Primary action button -->\n        <button\n          part=\"button\"\n          class=\"split-button__primary\"\n          ?disabled=${this.disabled}\n          type=\"button\"\n          @click=${this._handlePrimaryClick}\n          @keydown=${this._handlePrimaryKeydown}\n        >\n          ${this.label !== undefined ? this.label : html`<slot></slot>`}\n        </button>\n\n        <!-- Dropdown trigger button -->\n        <button\n          part=\"trigger\"\n          class=\"split-button__trigger\"\n          ?disabled=${this.disabled}\n          aria-haspopup=\"menu\"\n          aria-expanded=${this._open ? 'true' : 'false'}\n          aria-controls=${this._menuId}\n          aria-label=${this.triggerLabel}\n          type=\"button\"\n          @click=${this._handleTriggerClick}\n          @keydown=${this._handleTriggerKeydown}\n        >\n          <span class=${classMap(chevronClasses)} aria-hidden=\"true\">\n            <svg\n              width=\"12\"\n              height=\"8\"\n              viewBox=\"0 0 12 8\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M1 1.5L6 6.5L11 1.5\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.5\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </span>\n        </button>\n\n        <!-- Dropdown menu panel -->\n        <div\n          part=\"menu\"\n          id=${this._menuId}\n          class=${classMap(menuClasses)}\n          role=\"menu\"\n          aria-label=${this.menuLabel}\n          @keydown=${this._handleMenuKeydown}\n          @hx-item-select=${this._handleMenuItemSelect}\n        >\n          <slot name=\"menu\"></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-split-button': HelixSplitButton;\n  }\n}\n"],"names":["helixSplitButtonStyles","css","_hxSplitButtonIdCounter","HelixSplitButton","LitElement","e","target","items","currentIndex","item","next","_a","prev","_b","_c","_d","_e","custom","label","slot","el","containerClasses","menuClasses","chevronClasses","html","classMap","tokenStyles","__decorateClass","query","state","property","customElement"],"mappings":";;;;AAEO,MAAMA,IAAyBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAA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"}