@solibo/solibo-ui 1.0.21 → 1.0.23

package/dist/components/controls/index.js

@@ -1,18 +1,18 @@
 import { jsxs as G, jsx as v } from "react/jsx-runtime";
 import { t as Y } from "../../classix-DG18itHa.js";
-import { Children as Z, isValidElement as ee, cloneElement as P, useRef as E, useState as te, useCallback as ne, useLayoutEffect as ie } from "react";
+import { Children as Z, isValidElement as ee, cloneElement as P, useRef as M, useState as te, useCallback as ne, useLayoutEffect as ie } from "react";
 import { Button as re } from "../button/index.js";
 import { a as T, M as oe } from "../../menu-popover-DQHDIw-8.js";
-import '../../assets/index34.css';const de = "_controls_1bkuq_13", se = "_inline_1bkuq_43", ce = "_embedded_1bkuq_48", ae = "_fixed_1bkuq_49", le = "_adaptive_1bkuq_60", ue = "_measurement_1bkuq_65", f = {
+import '../../assets/index34.css';const de = "_controls_t1re6_13", se = "_inline_t1re6_43", ce = "_embedded_t1re6_48", ae = "_fixed_t1re6_49", le = "_adaptive_t1re6_60", ue = "_measurement_t1re6_65", f = {
   controls: de,
-  default: "_default_1bkuq_28",
+  default: "_default_t1re6_28",
   inline: se,
   embedded: ce,
   fixed: ae,
   adaptive: le,
   measurement: ue,
-  "non-button-content": "_non-button-content_1bkuq_99",
-  "overflow-trigger": "_overflow-trigger_1bkuq_128"
+  "non-button-content": "_non-button-content_t1re6_99",
+  "overflow-trigger": "_overflow-trigger_t1re6_128"
 }, me = {
   primary: 3,
   danger: 2,
@@ -50,7 +50,7 @@ const h = (d, i) => {
 }, be = (d, i) => {
   const n = d.parentElement;
   if (!n) return;
-  const g = n.getBoundingClientRect(), o = getComputedStyle(n), r = g.width || n.clientWidth, M = g.left + h(o, "borderLeftWidth") + h(o, "paddingLeft"), y = g.left + r - h(o, "borderRightWidth") - h(o, "paddingRight"), _ = Array.from(n.children).slice(0, Array.from(n.children).indexOf(d)), W = _.reduce((m, l) => Math.max(m, l.getBoundingClientRect().right), M), c = _.length > 0 ? h(o, "columnGap") : 0, a = Math.max(0, y - W - c), x = (i == null ? void 0 : i.parent) === n ? Math.max(0, r - i.parentWidth) : 0;
+  const g = n.getBoundingClientRect(), o = getComputedStyle(n), r = g.width || n.clientWidth, C = g.left + h(o, "borderLeftWidth") + h(o, "paddingLeft"), B = g.left + r - h(o, "borderRightWidth") - h(o, "paddingRight"), _ = Array.from(n.children).slice(0, Array.from(n.children).indexOf(d)), W = _.reduce((m, l) => Math.max(m, l.getBoundingClientRect().right), C), c = _.length > 0 ? h(o, "columnGap") : 0, a = Math.max(0, B - W - c), x = (i == null ? void 0 : i.parent) === n ? Math.max(0, r - i.parentWidth) : 0;
   return {
     availableWidth: x > 0 ? Math.max(a, ((i == null ? void 0 : i.availableWidth) ?? 0) + x) : a,
     parent: n,
@@ -63,10 +63,10 @@ const h = (d, i) => {
   overflow: g,
   overflowAccessibleLabel: o = "More actions",
   variant: r = "default",
-  ...M
+  ...C
 }) => {
-  const y = Z.toArray(d), _ = [], W = [];
-  y.forEach((e) => {
+  const B = Z.toArray(d), _ = [], W = [];
+  B.forEach((e) => {
     ee(e) && e.type === re ? _.push(e) : W.push(e);
   });
   const c = _.map((e, s) => ({
@@ -78,10 +78,10 @@ const h = (d, i) => {
     index: s
   }) => P(e, {
     key: e.key ?? s
-  })), a = r === "embedded" || r === "fixed" && g === "menu", x = typeof n == "number" && Number.isFinite(n) ? Math.floor(n) : 0, m = r === "embedded" && x > 0 ? Math.min(c.length, x) : c.length, l = E(null), A = E(void 0), N = E(null), B = E(null), [q, C] = te(m), p = ne(() => {
-    var j, I, D;
+  })), a = r === "embedded" || r === "fixed" && g === "menu", x = typeof n == "number" && Number.isFinite(n) ? Math.floor(n) : 0, m = r === "embedded" && x > 0 ? Math.min(c.length, x) : c.length, l = M(null), A = M(void 0), N = M(null), E = M(null), [z, S] = te(m), p = ne(() => {
+    var I, q, D;
     if (!a) {
-      C(m);
+      S(m);
       return;
     }
     const e = l.current, s = N.current;
@@ -90,19 +90,19 @@ const h = (d, i) => {
     if (!R) return;
     const b = w.slice(0, c.length).map((t) => t.getBoundingClientRect().width);
     if (b.length !== c.length) return;
-    const u = getComputedStyle(e), H = h(u, "paddingLeft") + h(u, "paddingRight") + h(u, "borderLeftWidth") + h(u, "borderRightWidth"), J = ge(u.maxWidth), k = r === "embedded" ? be(e, A.current) : void 0;
-    k && (A.current = k);
-    const K = (k == null ? void 0 : k.availableWidth) ?? ((j = e.parentElement) == null ? void 0 : j.clientWidth) ?? 0, Q = ((I = window.visualViewport) == null ? void 0 : I.width) ?? document.documentElement.clientWidth, F = Math.min(...[J, K, Q].filter((t) => typeof t == "number" && Number.isFinite(t) && t > 0));
-    if (!Number.isFinite(F)) return;
-    const V = Math.max(0, F - H), O = ((D = B.current) == null ? void 0 : D.getBoundingClientRect().width) ?? 0, U = b.reduce((t, X) => t + X, 0);
-    if (m === c.length && O + U <= V) {
-      C((t) => t === m ? t : m);
+    const u = getComputedStyle(e), H = h(u, "paddingLeft") + h(u, "paddingRight") + h(u, "borderLeftWidth") + h(u, "borderRightWidth"), J = ge(u.maxWidth), y = r === "embedded" ? be(e, A.current) : void 0;
+    y && (A.current = y);
+    const K = (y == null ? void 0 : y.availableWidth) ?? ((I = e.parentElement) == null ? void 0 : I.clientWidth) ?? 0, Q = ((q = window.visualViewport) == null ? void 0 : q.width) ?? document.documentElement.clientWidth, V = Math.min(...[J, K, Q].filter((t) => typeof t == "number" && Number.isFinite(t) && t > 0));
+    if (!Number.isFinite(V)) return;
+    const O = Math.max(0, V - H), L = ((D = E.current) == null ? void 0 : D.getBoundingClientRect().width) ?? 0, U = b.reduce((t, X) => t + X, 0);
+    if (m === c.length && L + U <= O) {
+      S((t) => t === m ? t : m);
       return;
     }
-    let L = O + R.getBoundingClientRect().width, S = 0;
-    for (let t = 0; t < m && !(L + b[t] > V); t += 1)
-      L += b[t], S = t + 1;
-    C((t) => t === S ? t : S);
+    let j = L + R.getBoundingClientRect().width, k = 0;
+    for (let t = 0; t < m && !(j + b[t] > O); t += 1)
+      j += b[t], k = t + 1;
+    S((t) => t === k ? t : k);
   }, [a, c.length, r, m]);
   if (ie(() => {
     var s, w, R, b;
@@ -110,14 +110,14 @@ const h = (d, i) => {
     const e = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(p);
     return l.current && (e == null || e.observe(l.current)), (s = l.current) != null && s.parentElement && (e == null || e.observe(l.current.parentElement)), r === "embedded" && ((w = l.current) != null && w.parentElement) && Array.from(l.current.parentElement.children).forEach((u) => {
       u !== l.current && (e == null || e.observe(u));
-    }), B.current && (e == null || e.observe(B.current)), window.addEventListener("resize", p), (R = window.visualViewport) == null || R.addEventListener("resize", p), (b = document.fonts) == null || b.ready.then(p), () => {
+    }), E.current && (e == null || e.observe(E.current)), window.addEventListener("resize", p), (R = window.visualViewport) == null || R.addEventListener("resize", p), (b = document.fonts) == null || b.ready.then(p), () => {
       var u;
       e == null || e.disconnect(), window.removeEventListener("resize", p), (u = window.visualViewport) == null || u.removeEventListener("resize", p);
     };
-  }, [a, d, p, r]), y.length === 0)
+  }, [a, d, p, r]), B.length === 0)
     return null;
-  const $ = a ? c.slice(0, q) : c, z = a ? c.slice(q) : [];
-  return /* @__PURE__ */ G("div", { "data-component": "controls", "data-dynamic-position": r === "fixed" ? !0 : void 0, className: Y(f.controls, fe[r], a && f.adaptive, i), ref: l, ...M, children: [
+  const $ = a ? c.slice(0, z) : c, F = a ? c.slice(z) : [];
+  return /* @__PURE__ */ G("div", { "data-component": "controls", "data-dynamic-position": r === "fixed" ? !0 : void 0, "data-adaptive": a ? !0 : void 0, className: Y(f.controls, fe[r], a && f.adaptive, i), ref: l, ...C, children: [
     a && /* @__PURE__ */ G("div", { "aria-hidden": "true", className: f.measurement, ref: N, children: [
       c.map((e, s) => P(e, {
         "aria-hidden": !0,
@@ -129,9 +129,9 @@ const h = (d, i) => {
       })),
       /* @__PURE__ */ v(T, { triggerAccessibleLabel: o, children: null })
     ] }),
-    r !== "embedded" && W.length > 0 && /* @__PURE__ */ v("span", { className: f["non-button-content"], ref: B, children: W }),
+    r !== "embedded" && W.length > 0 && /* @__PURE__ */ v("span", { className: f["non-button-content"], ref: E, children: W }),
     $,
-    z.length > 0 && /* @__PURE__ */ v("span", { className: f["overflow-trigger"], children: /* @__PURE__ */ v(pe, { buttons: z, menuAccessibleLabel: o, triggerAccessibleLabel: o }) })
+    F.length > 0 && /* @__PURE__ */ v("span", { className: f["overflow-trigger"], children: /* @__PURE__ */ v(pe, { buttons: F, menuAccessibleLabel: o, triggerAccessibleLabel: o }) })
   ] });
 };
 export {

package/dist/components/controls/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport { type MenuAction, MenuActionList } from '../menu/action-list';\nimport { MenuPopover } from '../menu/menu-popover';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n  primary: 3,\n  danger: 2,\n  secondary: 1,\n  tertiary: 0,\n  simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n  default: styles.default,\n  embedded: styles.embedded,\n  fixed: styles.fixed,\n  inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n  children?: React.ReactNode;\n  maxVisibleButtons?: number;\n  overflow?: 'menu';\n  overflowAccessibleLabel?: string;\n  variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n  buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nfunction OverflowMenu({\n  buttons,\n  menuAccessibleLabel,\n  triggerAccessibleLabel,\n}: {\n  buttons: React.ReactElement<ButtonProps>[];\n  menuAccessibleLabel: string;\n  triggerAccessibleLabel: string;\n}) {\n  const actions: MenuAction<React.ReactElement<ButtonProps>>[] = buttons.map((button) => ({\n    button,\n    isDanger: button.props.variant === 'danger',\n    value: button,\n  }));\n\n  return (\n    <MenuPopover triggerAccessibleLabel={triggerAccessibleLabel}>\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={() => close()}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n}\n\nconst numericStyle = (style: CSSStyleDeclaration, property: keyof CSSStyleDeclaration) => {\n  const value = Number.parseFloat(String(style[property]));\n  return Number.isFinite(value) ? value : 0;\n};\n\nconst pixelStyle = (value: string) => {\n  if (!value.trim().endsWith('px')) return undefined;\n  const parsedValue = Number.parseFloat(value);\n  return Number.isFinite(parsedValue) ? parsedValue : undefined;\n};\n\ntype EmbeddedLayout = {\n  availableWidth: number;\n  parent: HTMLElement;\n  parentWidth: number;\n};\n\nconst availableWidthToRight = (\n  controls: HTMLDivElement,\n  previousLayout?: EmbeddedLayout\n): EmbeddedLayout | undefined => {\n  const parent = controls.parentElement;\n  if (!parent) return undefined;\n\n  const parentRect = parent.getBoundingClientRect();\n  const parentStyle = getComputedStyle(parent);\n  const parentWidth = parentRect.width || parent.clientWidth;\n  const contentLeft =\n    parentRect.left +\n    numericStyle(parentStyle, 'borderLeftWidth') +\n    numericStyle(parentStyle, 'paddingLeft');\n  const contentRight =\n    parentRect.left +\n    parentWidth -\n    numericStyle(parentStyle, 'borderRightWidth') -\n    numericStyle(parentStyle, 'paddingRight');\n  const precedingSiblings = Array.from(parent.children).slice(\n    0,\n    Array.from(parent.children).indexOf(controls)\n  );\n  const occupiedRight = precedingSiblings.reduce(\n    (right, sibling) => Math.max(right, sibling.getBoundingClientRect().right),\n    contentLeft\n  );\n  const gap = precedingSiblings.length > 0 ? numericStyle(parentStyle, 'columnGap') : 0;\n\n  const measuredAvailableWidth = Math.max(0, contentRight - occupiedRight - gap);\n  const parentWidthIncrease =\n    previousLayout?.parent === parent ? Math.max(0, parentWidth - previousLayout.parentWidth) : 0;\n\n  return {\n    availableWidth:\n      parentWidthIncrease > 0\n        ? Math.max(\n            measuredAvailableWidth,\n            (previousLayout?.availableWidth ?? 0) + parentWidthIncrease\n          )\n        : measuredAvailableWidth,\n    parent,\n    parentWidth,\n  };\n};\n\nexport const Controls = ({\n  children,\n  className,\n  maxVisibleButtons,\n  overflow,\n  overflowAccessibleLabel = 'More actions',\n  variant = 'default',\n  ...props\n}: ControlsProps) => {\n  const childArray = Children.toArray(children);\n  const buttons: React.ReactElement<ButtonProps>[] = [];\n  const nonButtons: React.ReactNode[] = [];\n\n  childArray.forEach((child) => {\n    if (isValidElement<ButtonProps>(child) && child.type === Button) {\n      buttons.push(child);\n    } else {\n      nonButtons.push(child);\n    }\n  });\n\n  const sortedButtons = buttons\n    .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n    .sort((a, b) => a.rank - b.rank || a.index - b.index)\n    .map(({ button, index }) =>\n      cloneElement(button, {\n        key: button.key ?? index,\n      })\n    );\n\n  const adaptive = variant === 'embedded' || (variant === 'fixed' && overflow === 'menu');\n  const normalizedMaxVisibleButtons =\n    typeof maxVisibleButtons === 'number' && Number.isFinite(maxVisibleButtons)\n      ? Math.floor(maxVisibleButtons)\n      : 0;\n  const visibleButtonLimit =\n    variant === 'embedded' && normalizedMaxVisibleButtons > 0\n      ? Math.min(sortedButtons.length, normalizedMaxVisibleButtons)\n      : sortedButtons.length;\n  const controlsRef = useRef<HTMLDivElement>(null);\n  const embeddedLayoutRef = useRef<EmbeddedLayout>(undefined);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const nonButtonsRef = useRef<HTMLSpanElement>(null);\n  const [visibleButtonCount, setVisibleButtonCount] = useState(visibleButtonLimit);\n\n  const updateOverflow = useCallback(() => {\n    if (!adaptive) {\n      setVisibleButtonCount(visibleButtonLimit);\n      return;\n    }\n\n    const controls = controlsRef.current;\n    const measurement = measurementRef.current;\n    if (!controls || !measurement) return;\n\n    const measurementButtons = Array.from(\n      measurement.querySelectorAll<HTMLElement>('[data-component=\"button\"]')\n    );\n    const trigger = measurementButtons.at(-1);\n    if (!trigger) return;\n\n    const buttonWidths = measurementButtons\n      .slice(0, sortedButtons.length)\n      .map((button) => button.getBoundingClientRect().width);\n    if (buttonWidths.length !== sortedButtons.length) return;\n\n    const style = getComputedStyle(controls);\n    const horizontalChrome =\n      numericStyle(style, 'paddingLeft') +\n      numericStyle(style, 'paddingRight') +\n      numericStyle(style, 'borderLeftWidth') +\n      numericStyle(style, 'borderRightWidth');\n    const configuredMaxWidth = pixelStyle(style.maxWidth);\n    const embeddedLayout =\n      variant === 'embedded'\n        ? availableWidthToRight(controls, embeddedLayoutRef.current)\n        : undefined;\n    if (embeddedLayout) embeddedLayoutRef.current = embeddedLayout;\n    const layoutWidth = embeddedLayout?.availableWidth ?? controls.parentElement?.clientWidth ?? 0;\n    const viewportWidth = window.visualViewport?.width ?? document.documentElement.clientWidth;\n    const outerAvailableWidth = Math.min(\n      ...[configuredMaxWidth, layoutWidth, viewportWidth].filter(\n        (width): width is number => typeof width === 'number' && Number.isFinite(width) && width > 0\n      )\n    );\n    if (!Number.isFinite(outerAvailableWidth)) return;\n\n    const availableWidth = Math.max(0, outerAvailableWidth - horizontalChrome);\n    const prefixWidth = nonButtonsRef.current?.getBoundingClientRect().width ?? 0;\n    const actionWidth = buttonWidths.reduce((total, width) => total + width, 0);\n\n    if (\n      visibleButtonLimit === sortedButtons.length &&\n      prefixWidth + actionWidth <= availableWidth\n    ) {\n      setVisibleButtonCount((current) =>\n        current === visibleButtonLimit ? current : visibleButtonLimit\n      );\n      return;\n    }\n\n    let usedWidth = prefixWidth + trigger.getBoundingClientRect().width;\n    let nextVisibleButtonCount = 0;\n    for (let index = 0; index < visibleButtonLimit; index += 1) {\n      if (usedWidth + buttonWidths[index] > availableWidth) break;\n      usedWidth += buttonWidths[index];\n      nextVisibleButtonCount = index + 1;\n    }\n\n    setVisibleButtonCount((current) =>\n      current === nextVisibleButtonCount ? current : nextVisibleButtonCount\n    );\n  }, [adaptive, sortedButtons.length, variant, visibleButtonLimit]);\n\n  useLayoutEffect(() => {\n    updateOverflow();\n\n    if (!adaptive) return undefined;\n\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(updateOverflow);\n    if (controlsRef.current) observer?.observe(controlsRef.current);\n    if (controlsRef.current?.parentElement) observer?.observe(controlsRef.current.parentElement);\n    if (variant === 'embedded' && controlsRef.current?.parentElement) {\n      Array.from(controlsRef.current.parentElement.children).forEach((sibling) => {\n        if (sibling !== controlsRef.current) observer?.observe(sibling);\n      });\n    }\n    if (nonButtonsRef.current) observer?.observe(nonButtonsRef.current);\n\n    window.addEventListener('resize', updateOverflow);\n    window.visualViewport?.addEventListener('resize', updateOverflow);\n    void document.fonts?.ready.then(updateOverflow);\n\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener('resize', updateOverflow);\n      window.visualViewport?.removeEventListener('resize', updateOverflow);\n    };\n  }, [adaptive, children, updateOverflow, variant]);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  const visibleButtons = adaptive ? sortedButtons.slice(0, visibleButtonCount) : sortedButtons;\n  const overflowedButtons = adaptive ? sortedButtons.slice(visibleButtonCount) : [];\n\n  return (\n    <div\n      data-component='controls'\n      data-dynamic-position={variant === 'fixed' ? true : undefined}\n      className={cx(styles.controls, variants[variant], adaptive && styles.adaptive, className)}\n      ref={controlsRef}\n      {...props}\n    >\n      {adaptive && (\n        <div\n          aria-hidden='true'\n          className={styles.measurement}\n          ref={measurementRef}\n        >\n          {sortedButtons.map((button, index) =>\n            cloneElement(button, {\n              'aria-hidden': true,\n              id: undefined,\n              key: `measure-${String(button.key ?? index)}`,\n              onClick: undefined,\n              ref: undefined,\n              tabIndex: -1,\n            })\n          )}\n          <MenuPopover triggerAccessibleLabel={overflowAccessibleLabel}>{null}</MenuPopover>\n        </div>\n      )}\n      {variant !== 'embedded' && nonButtons.length > 0 && (\n        <span\n          className={styles['non-button-content']}\n          ref={nonButtonsRef}\n        >\n          {nonButtons}\n        </span>\n      )}\n      {visibleButtons}\n      {overflowedButtons.length > 0 && (\n        <span className={styles['overflow-trigger']}>\n          <OverflowMenu\n            buttons={overflowedButtons}\n            menuAccessibleLabel={overflowAccessibleLabel}\n            triggerAccessibleLabel={overflowAccessibleLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n};\n"],"names":["buttonVariantOrder","primary","danger","secondary","tertiary","simple","variants","default","styles","embedded","fixed","inline","getButtonRank","button","props","variant","OverflowMenu","buttons","menuAccessibleLabel","triggerAccessibleLabel","actions","map","isDanger","value","jsx","MenuPopover","close","initialFocus","MenuActionList","numericStyle","style","property","Number","parseFloat","String","isFinite","pixelStyle","trim","endsWith","parsedValue","undefined","availableWidthToRight","controls","previousLayout","parent","parentElement","parentRect","getBoundingClientRect","parentStyle","getComputedStyle","parentWidth","width","clientWidth","contentLeft","left","contentRight","precedingSiblings","Array","from","children","slice","indexOf","occupiedRight","reduce","right","sibling","Math","max","gap","length","measuredAvailableWidth","parentWidthIncrease","availableWidth","Controls","className","maxVisibleButtons","overflow","overflowAccessibleLabel","childArray","Children","toArray","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","index","rank","sort","a","b","cloneElement","key","adaptive","normalizedMaxVisibleButtons","floor","visibleButtonLimit","min","controlsRef","useRef","embeddedLayoutRef","measurementRef","nonButtonsRef","visibleButtonCount","setVisibleButtonCount","useState","updateOverflow","useCallback","current","measurement","measurementButtons","querySelectorAll","trigger","at","buttonWidths","horizontalChrome","configuredMaxWidth","maxWidth","embeddedLayout","layoutWidth","viewportWidth","window","visualViewport","document","documentElement","outerAvailableWidth","filter","prefixWidth","actionWidth","total","usedWidth","nextVisibleButtonCount","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","fonts","ready","then","disconnect","removeEventListener","visibleButtons","overflowedButtons","jsxs","cx","id","onClick","ref","tabIndex"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport { type MenuAction, MenuActionList } from '../menu/action-list';\nimport { MenuPopover } from '../menu/menu-popover';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n  primary: 3,\n  danger: 2,\n  secondary: 1,\n  tertiary: 0,\n  simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n  default: styles.default,\n  embedded: styles.embedded,\n  fixed: styles.fixed,\n  inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n  children?: React.ReactNode;\n  maxVisibleButtons?: number;\n  overflow?: 'menu';\n  overflowAccessibleLabel?: string;\n  variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n  buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nfunction OverflowMenu({\n  buttons,\n  menuAccessibleLabel,\n  triggerAccessibleLabel,\n}: {\n  buttons: React.ReactElement<ButtonProps>[];\n  menuAccessibleLabel: string;\n  triggerAccessibleLabel: string;\n}) {\n  const actions: MenuAction<React.ReactElement<ButtonProps>>[] = buttons.map((button) => ({\n    button,\n    isDanger: button.props.variant === 'danger',\n    value: button,\n  }));\n\n  return (\n    <MenuPopover triggerAccessibleLabel={triggerAccessibleLabel}>\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={() => close()}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n}\n\nconst numericStyle = (style: CSSStyleDeclaration, property: keyof CSSStyleDeclaration) => {\n  const value = Number.parseFloat(String(style[property]));\n  return Number.isFinite(value) ? value : 0;\n};\n\nconst pixelStyle = (value: string) => {\n  if (!value.trim().endsWith('px')) return undefined;\n  const parsedValue = Number.parseFloat(value);\n  return Number.isFinite(parsedValue) ? parsedValue : undefined;\n};\n\ntype EmbeddedLayout = {\n  availableWidth: number;\n  parent: HTMLElement;\n  parentWidth: number;\n};\n\nconst availableWidthToRight = (\n  controls: HTMLDivElement,\n  previousLayout?: EmbeddedLayout\n): EmbeddedLayout | undefined => {\n  const parent = controls.parentElement;\n  if (!parent) return undefined;\n\n  const parentRect = parent.getBoundingClientRect();\n  const parentStyle = getComputedStyle(parent);\n  const parentWidth = parentRect.width || parent.clientWidth;\n  const contentLeft =\n    parentRect.left +\n    numericStyle(parentStyle, 'borderLeftWidth') +\n    numericStyle(parentStyle, 'paddingLeft');\n  const contentRight =\n    parentRect.left +\n    parentWidth -\n    numericStyle(parentStyle, 'borderRightWidth') -\n    numericStyle(parentStyle, 'paddingRight');\n  const precedingSiblings = Array.from(parent.children).slice(\n    0,\n    Array.from(parent.children).indexOf(controls)\n  );\n  const occupiedRight = precedingSiblings.reduce(\n    (right, sibling) => Math.max(right, sibling.getBoundingClientRect().right),\n    contentLeft\n  );\n  const gap = precedingSiblings.length > 0 ? numericStyle(parentStyle, 'columnGap') : 0;\n\n  const measuredAvailableWidth = Math.max(0, contentRight - occupiedRight - gap);\n  const parentWidthIncrease =\n    previousLayout?.parent === parent ? Math.max(0, parentWidth - previousLayout.parentWidth) : 0;\n\n  return {\n    availableWidth:\n      parentWidthIncrease > 0\n        ? Math.max(\n            measuredAvailableWidth,\n            (previousLayout?.availableWidth ?? 0) + parentWidthIncrease\n          )\n        : measuredAvailableWidth,\n    parent,\n    parentWidth,\n  };\n};\n\nexport const Controls = ({\n  children,\n  className,\n  maxVisibleButtons,\n  overflow,\n  overflowAccessibleLabel = 'More actions',\n  variant = 'default',\n  ...props\n}: ControlsProps) => {\n  const childArray = Children.toArray(children);\n  const buttons: React.ReactElement<ButtonProps>[] = [];\n  const nonButtons: React.ReactNode[] = [];\n\n  childArray.forEach((child) => {\n    if (isValidElement<ButtonProps>(child) && child.type === Button) {\n      buttons.push(child);\n    } else {\n      nonButtons.push(child);\n    }\n  });\n\n  const sortedButtons = buttons\n    .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n    .sort((a, b) => a.rank - b.rank || a.index - b.index)\n    .map(({ button, index }) =>\n      cloneElement(button, {\n        key: button.key ?? index,\n      })\n    );\n\n  const adaptive = variant === 'embedded' || (variant === 'fixed' && overflow === 'menu');\n  const normalizedMaxVisibleButtons =\n    typeof maxVisibleButtons === 'number' && Number.isFinite(maxVisibleButtons)\n      ? Math.floor(maxVisibleButtons)\n      : 0;\n  const visibleButtonLimit =\n    variant === 'embedded' && normalizedMaxVisibleButtons > 0\n      ? Math.min(sortedButtons.length, normalizedMaxVisibleButtons)\n      : sortedButtons.length;\n  const controlsRef = useRef<HTMLDivElement>(null);\n  const embeddedLayoutRef = useRef<EmbeddedLayout>(undefined);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const nonButtonsRef = useRef<HTMLSpanElement>(null);\n  const [visibleButtonCount, setVisibleButtonCount] = useState(visibleButtonLimit);\n\n  const updateOverflow = useCallback(() => {\n    if (!adaptive) {\n      setVisibleButtonCount(visibleButtonLimit);\n      return;\n    }\n\n    const controls = controlsRef.current;\n    const measurement = measurementRef.current;\n    if (!controls || !measurement) return;\n\n    const measurementButtons = Array.from(\n      measurement.querySelectorAll<HTMLElement>('[data-component=\"button\"]')\n    );\n    const trigger = measurementButtons.at(-1);\n    if (!trigger) return;\n\n    const buttonWidths = measurementButtons\n      .slice(0, sortedButtons.length)\n      .map((button) => button.getBoundingClientRect().width);\n    if (buttonWidths.length !== sortedButtons.length) return;\n\n    const style = getComputedStyle(controls);\n    const horizontalChrome =\n      numericStyle(style, 'paddingLeft') +\n      numericStyle(style, 'paddingRight') +\n      numericStyle(style, 'borderLeftWidth') +\n      numericStyle(style, 'borderRightWidth');\n    const configuredMaxWidth = pixelStyle(style.maxWidth);\n    const embeddedLayout =\n      variant === 'embedded'\n        ? availableWidthToRight(controls, embeddedLayoutRef.current)\n        : undefined;\n    if (embeddedLayout) embeddedLayoutRef.current = embeddedLayout;\n    const layoutWidth = embeddedLayout?.availableWidth ?? controls.parentElement?.clientWidth ?? 0;\n    const viewportWidth = window.visualViewport?.width ?? document.documentElement.clientWidth;\n    const outerAvailableWidth = Math.min(\n      ...[configuredMaxWidth, layoutWidth, viewportWidth].filter(\n        (width): width is number => typeof width === 'number' && Number.isFinite(width) && width > 0\n      )\n    );\n    if (!Number.isFinite(outerAvailableWidth)) return;\n\n    const availableWidth = Math.max(0, outerAvailableWidth - horizontalChrome);\n    const prefixWidth = nonButtonsRef.current?.getBoundingClientRect().width ?? 0;\n    const actionWidth = buttonWidths.reduce((total, width) => total + width, 0);\n\n    if (\n      visibleButtonLimit === sortedButtons.length &&\n      prefixWidth + actionWidth <= availableWidth\n    ) {\n      setVisibleButtonCount((current) =>\n        current === visibleButtonLimit ? current : visibleButtonLimit\n      );\n      return;\n    }\n\n    let usedWidth = prefixWidth + trigger.getBoundingClientRect().width;\n    let nextVisibleButtonCount = 0;\n    for (let index = 0; index < visibleButtonLimit; index += 1) {\n      if (usedWidth + buttonWidths[index] > availableWidth) break;\n      usedWidth += buttonWidths[index];\n      nextVisibleButtonCount = index + 1;\n    }\n\n    setVisibleButtonCount((current) =>\n      current === nextVisibleButtonCount ? current : nextVisibleButtonCount\n    );\n  }, [adaptive, sortedButtons.length, variant, visibleButtonLimit]);\n\n  useLayoutEffect(() => {\n    updateOverflow();\n\n    if (!adaptive) return undefined;\n\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(updateOverflow);\n    if (controlsRef.current) observer?.observe(controlsRef.current);\n    if (controlsRef.current?.parentElement) observer?.observe(controlsRef.current.parentElement);\n    if (variant === 'embedded' && controlsRef.current?.parentElement) {\n      Array.from(controlsRef.current.parentElement.children).forEach((sibling) => {\n        if (sibling !== controlsRef.current) observer?.observe(sibling);\n      });\n    }\n    if (nonButtonsRef.current) observer?.observe(nonButtonsRef.current);\n\n    window.addEventListener('resize', updateOverflow);\n    window.visualViewport?.addEventListener('resize', updateOverflow);\n    void document.fonts?.ready.then(updateOverflow);\n\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener('resize', updateOverflow);\n      window.visualViewport?.removeEventListener('resize', updateOverflow);\n    };\n  }, [adaptive, children, updateOverflow, variant]);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  const visibleButtons = adaptive ? sortedButtons.slice(0, visibleButtonCount) : sortedButtons;\n  const overflowedButtons = adaptive ? sortedButtons.slice(visibleButtonCount) : [];\n\n  return (\n    <div\n      data-component='controls'\n      data-dynamic-position={variant === 'fixed' ? true : undefined}\n      data-adaptive={adaptive ? true : undefined}\n      className={cx(styles.controls, variants[variant], adaptive && styles.adaptive, className)}\n      ref={controlsRef}\n      {...props}\n    >\n      {adaptive && (\n        <div\n          aria-hidden='true'\n          className={styles.measurement}\n          ref={measurementRef}\n        >\n          {sortedButtons.map((button, index) =>\n            cloneElement(button, {\n              'aria-hidden': true,\n              id: undefined,\n              key: `measure-${String(button.key ?? index)}`,\n              onClick: undefined,\n              ref: undefined,\n              tabIndex: -1,\n            })\n          )}\n          <MenuPopover triggerAccessibleLabel={overflowAccessibleLabel}>{null}</MenuPopover>\n        </div>\n      )}\n      {variant !== 'embedded' && nonButtons.length > 0 && (\n        <span\n          className={styles['non-button-content']}\n          ref={nonButtonsRef}\n        >\n          {nonButtons}\n        </span>\n      )}\n      {visibleButtons}\n      {overflowedButtons.length > 0 && (\n        <span className={styles['overflow-trigger']}>\n          <OverflowMenu\n            buttons={overflowedButtons}\n            menuAccessibleLabel={overflowAccessibleLabel}\n            triggerAccessibleLabel={overflowAccessibleLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n};\n"],"names":["buttonVariantOrder","primary","danger","secondary","tertiary","simple","variants","default","styles","embedded","fixed","inline","getButtonRank","button","props","variant","OverflowMenu","buttons","menuAccessibleLabel","triggerAccessibleLabel","actions","map","isDanger","value","jsx","MenuPopover","close","initialFocus","MenuActionList","numericStyle","style","property","Number","parseFloat","String","isFinite","pixelStyle","trim","endsWith","parsedValue","undefined","availableWidthToRight","controls","previousLayout","parent","parentElement","parentRect","getBoundingClientRect","parentStyle","getComputedStyle","parentWidth","width","clientWidth","contentLeft","left","contentRight","precedingSiblings","Array","from","children","slice","indexOf","occupiedRight","reduce","right","sibling","Math","max","gap","length","measuredAvailableWidth","parentWidthIncrease","availableWidth","Controls","className","maxVisibleButtons","overflow","overflowAccessibleLabel","childArray","Children","toArray","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","index","rank","sort","a","b","cloneElement","key","adaptive","normalizedMaxVisibleButtons","floor","visibleButtonLimit","min","controlsRef","useRef","embeddedLayoutRef","measurementRef","nonButtonsRef","visibleButtonCount","setVisibleButtonCount","useState","updateOverflow","useCallback","current","measurement","measurementButtons","querySelectorAll","trigger","at","buttonWidths","horizontalChrome","configuredMaxWidth","maxWidth","embeddedLayout","layoutWidth","viewportWidth","window","visualViewport","document","documentElement","outerAvailableWidth","filter","prefixWidth","actionWidth","total","usedWidth","nextVisibleButtonCount","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","fonts","ready","then","disconnect","removeEventListener","visibleButtons","overflowedButtons","jsxs","cx","id","onClick","ref","tabIndex"],"mappings":";;;;;;;;;;;;;;;GAgBMA,KAAqB;AAAA,EACzBC,SAAS;AAAA,EACTC,QAAQ;AAAA,EACRC,WAAW;AAAA,EACXC,UAAU;AAAA,EACVC,QAAQ;AACV,GAEMC,KAAW;AAAA,EACfC,SAASC,EAAOD;AAAAA,EAChBE,UAAUD,EAAOC;AAAAA,EACjBC,OAAOF,EAAOE;AAAAA,EACdC,QAAQH,EAAOG;AACjB,GAUMC,KAAgBA,CAACC,MACrBb,GAAmBa,EAAOC,MAAMC,WAAW,WAAW;AAExD,SAASC,GAAa;AAAA,EACpBC,SAAAA;AAAAA,EACAC,qBAAAA;AAAAA,EACAC,wBAAAA;AAKF,GAAG;AACD,QAAMC,IAAyDH,EAAQI,IAAKR,CAAAA,OAAY;AAAA,IACtFA,QAAAA;AAAAA,IACAS,UAAUT,EAAOC,MAAMC,YAAY;AAAA,IACnCQ,OAAOV;AAAAA,EAAAA,EACP;AAEF,SACE,gBAAAW,EAACC,GAAA,EAAY,wBAAAN,GAA+C,kBAAA,gBACzD,UAAA,CAAC;AAAA,IAAEO,OAAAA;AAAAA,IAAOC,cAAAA;AAAAA,EAAAA,MACT,gBAAAH,EAACI,IAAA,EACC,SAAAR,GACA,cAAAO,GACA,qBAAAT,GACA,UAAU,MAAMQ,EAAAA,GAChB,mBAAiB,GAAA,CAAA,EAAA,CAGvB;AAEJ;AAEA,MAAMG,IAAeA,CAACC,GAA4BC,MAAwC;AACxF,QAAMR,IAAQS,OAAOC,WAAWC,OAAOJ,EAAMC,CAAQ,CAAC,CAAC;AACvD,SAAOC,OAAOG,SAASZ,CAAK,IAAIA,IAAQ;AAC1C,GAEMa,KAAaA,CAACb,MAAkB;AACpC,MAAI,CAACA,EAAMc,KAAAA,EAAOC,SAAS,IAAI,EAAG;AAClC,QAAMC,IAAcP,OAAOC,WAAWV,CAAK;AAC3C,SAAOS,OAAOG,SAASI,CAAW,IAAIA,IAAcC;AACtD,GAQMC,KAAwBA,CAC5BC,GACAC,MAC+B;AAC/B,QAAMC,IAASF,EAASG;AACxB,MAAI,CAACD,EAAQ;AAEb,QAAME,IAAaF,EAAOG,sBAAAA,GACpBC,IAAcC,iBAAiBL,CAAM,GACrCM,IAAcJ,EAAWK,SAASP,EAAOQ,aACzCC,IACJP,EAAWQ,OACXzB,EAAamB,GAAa,iBAAiB,IAC3CnB,EAAamB,GAAa,aAAa,GACnCO,IACJT,EAAWQ,OACXJ,IACArB,EAAamB,GAAa,kBAAkB,IAC5CnB,EAAamB,GAAa,cAAc,GACpCQ,IAAoBC,MAAMC,KAAKd,EAAOe,QAAQ,EAAEC,MACpD,GACAH,MAAMC,KAAKd,EAAOe,QAAQ,EAAEE,QAAQnB,CAAQ,CAC9C,GACMoB,IAAgBN,EAAkBO,OACtC,CAACC,GAAOC,MAAYC,KAAKC,IAAIH,GAAOC,EAAQlB,sBAAAA,EAAwBiB,KAAK,GACzEX,CACF,GACMe,IAAMZ,EAAkBa,SAAS,IAAIxC,EAAamB,GAAa,WAAW,IAAI,GAE9EsB,IAAyBJ,KAAKC,IAAI,GAAGZ,IAAeO,IAAgBM,CAAG,GACvEG,KACJ5B,KAAAA,gBAAAA,EAAgBC,YAAWA,IAASsB,KAAKC,IAAI,GAAGjB,IAAcP,EAAeO,WAAW,IAAI;AAE9F,SAAO;AAAA,IACLsB,gBACED,IAAsB,IAClBL,KAAKC,IACHG,KACC3B,KAAAA,gBAAAA,EAAgB6B,mBAAkB,KAAKD,CAC1C,IACAD;AAAAA,IACN1B,QAAAA;AAAAA,IACAM,aAAAA;AAAAA,EAAAA;AAEJ,GAEauB,KAAWA,CAAC;AAAA,EACvBd,UAAAA;AAAAA,EACAe,WAAAA;AAAAA,EACAC,mBAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,yBAAAA,IAA0B;AAAA,EAC1B9D,SAAAA,IAAU;AAAA,EACV,GAAGD;AACU,MAAM;AACnB,QAAMgE,IAAaC,EAASC,QAAQrB,CAAQ,GACtC1C,IAA6C,CAAA,GAC7CgE,IAAgC,CAAA;AAEtCH,EAAAA,EAAWI,QAASC,CAAAA,MAAU;AAC5B,IAAIC,GAA4BD,CAAK,KAAKA,EAAME,SAASC,KACvDrE,EAAQsE,KAAKJ,CAAK,IAElBF,EAAWM,KAAKJ,CAAK;AAAA,EAEzB,CAAC;AAED,QAAMK,IAAgBvE,EACnBI,IAAI,CAACR,GAAQ4E,OAAW;AAAA,IAAE5E,QAAAA;AAAAA,IAAQ4E,OAAAA;AAAAA,IAAOC,MAAM9E,GAAcC,CAAM;AAAA,EAAA,EAAI,EACvE8E,KAAK,CAACC,GAAGC,MAAMD,EAAEF,OAAOG,EAAEH,QAAQE,EAAEH,QAAQI,EAAEJ,KAAK,EACnDpE,IAAI,CAAC;AAAA,IAAER,QAAAA;AAAAA,IAAQ4E,OAAAA;AAAAA,EAAAA,MACdK,EAAajF,GAAQ;AAAA,IACnBkF,KAAKlF,EAAOkF,OAAON;AAAAA,EAAAA,CACpB,CACH,GAEIO,IAAWjF,MAAY,cAAeA,MAAY,WAAW6D,MAAa,QAC1EqB,IACJ,OAAOtB,KAAsB,YAAY3C,OAAOG,SAASwC,CAAiB,IACtET,KAAKgC,MAAMvB,CAAiB,IAC5B,GACAwB,IACJpF,MAAY,cAAckF,IAA8B,IACpD/B,KAAKkC,IAAIZ,EAAcnB,QAAQ4B,CAA2B,IAC1DT,EAAcnB,QACdgC,IAAcC,EAAuB,IAAI,GACzCC,IAAoBD,EAAuB9D,MAAS,GACpDgE,IAAiBF,EAAuB,IAAI,GAC5CG,IAAgBH,EAAwB,IAAI,GAC5C,CAACI,GAAoBC,CAAqB,IAAIC,GAAST,CAAkB,GAEzEU,IAAiBC,GAAY,MAAM;;AACvC,QAAI,CAACd,GAAU;AACbW,MAAAA,EAAsBR,CAAkB;AACxC;AAAA,IACF;AAEA,UAAMzD,IAAW2D,EAAYU,SACvBC,IAAcR,EAAeO;AACnC,QAAI,CAACrE,KAAY,CAACsE,EAAa;AAE/B,UAAMC,IAAqBxD,MAAMC,KAC/BsD,EAAYE,iBAA8B,2BAA2B,CACvE,GACMC,IAAUF,EAAmBG,GAAG,EAAE;AACxC,QAAI,CAACD,EAAS;AAEd,UAAME,IAAeJ,EAClBrD,MAAM,GAAG4B,EAAcnB,MAAM,EAC7BhD,IAAKR,CAAAA,MAAWA,EAAOkC,sBAAAA,EAAwBI,KAAK;AACvD,QAAIkE,EAAahD,WAAWmB,EAAcnB,OAAQ;AAElD,UAAMvC,IAAQmB,iBAAiBP,CAAQ,GACjC4E,IACJzF,EAAaC,GAAO,aAAa,IACjCD,EAAaC,GAAO,cAAc,IAClCD,EAAaC,GAAO,iBAAiB,IACrCD,EAAaC,GAAO,kBAAkB,GAClCyF,IAAqBnF,GAAWN,EAAM0F,QAAQ,GAC9CC,IACJ1G,MAAY,aACR0B,GAAsBC,GAAU6D,EAAkBQ,OAAO,IACzDvE;AACN,IAAIiF,QAAkCV,UAAUU;AAChD,UAAMC,KAAcD,KAAAA,gBAAAA,EAAgBjD,qBAAkB9B,IAAAA,EAASG,kBAATH,gBAAAA,EAAwBU,gBAAe,GACvFuE,MAAgBC,IAAAA,OAAOC,mBAAPD,gBAAAA,EAAuBzE,UAAS2E,SAASC,gBAAgB3E,aACzE4E,IAAsB9D,KAAKkC,IAC/B,GAAG,CAACmB,GAAoBG,GAAaC,CAAa,EAAEM,OAClD,CAAC9E,MAA2B,OAAOA,KAAU,YAAYnB,OAAOG,SAASgB,CAAK,KAAKA,IAAQ,CAC7F,CACF;AACA,QAAI,CAACnB,OAAOG,SAAS6F,CAAmB,EAAG;AAE3C,UAAMxD,IAAiBN,KAAKC,IAAI,GAAG6D,IAAsBV,CAAgB,GACnEY,MAAczB,IAAAA,EAAcM,YAAdN,gBAAAA,EAAuB1D,wBAAwBI,UAAS,GACtEgF,IAAcd,EAAatD,OAAO,CAACqE,GAAOjF,MAAUiF,IAAQjF,GAAO,CAAC;AAE1E,QACEgD,MAAuBX,EAAcnB,UACrC6D,IAAcC,KAAe3D,GAC7B;AACAmC,MAAAA,EAAuBI,CAAAA,MACrBA,MAAYZ,IAAqBY,IAAUZ,CAC7C;AACA;AAAA,IACF;AAEA,QAAIkC,IAAYH,IAAcf,EAAQpE,sBAAAA,EAAwBI,OAC1DmF,IAAyB;AAC7B,aAAS7C,IAAQ,GAAGA,IAAQU,KACtBkC,EAAAA,IAAYhB,EAAa5B,CAAK,IAAIjB,IADQiB,KAAS;AAEvD4C,MAAAA,KAAahB,EAAa5B,CAAK,GAC/B6C,IAAyB7C,IAAQ;AAGnCkB,IAAAA,EAAuBI,CAAAA,MACrBA,MAAYuB,IAAyBvB,IAAUuB,CACjD;AAAA,EACF,GAAG,CAACtC,GAAUR,EAAcnB,QAAQtD,GAASoF,CAAkB,CAAC;AA6BhE,MA3BAoC,GAAgB,MAAM;;AAGpB,QAFA1B,EAAAA,GAEI,CAACb,EAAU;AAEf,UAAMwC,IACJ,OAAOC,iBAAmB,MAAcjG,SAAY,IAAIiG,eAAe5B,CAAc;AACvF,WAAIR,EAAYU,YAASyB,KAAAA,QAAAA,EAAUE,QAAQrC,EAAYU,YACnDV,IAAAA,EAAYU,YAAZV,QAAAA,EAAqBxD,iCAAyB6F,QAAQrC,EAAYU,QAAQlE,iBAC1E9B,MAAY,gBAAcsF,IAAAA,EAAYU,YAAZV,QAAAA,EAAqBxD,kBACjDY,MAAMC,KAAK2C,EAAYU,QAAQlE,cAAcc,QAAQ,EAAEuB,QAASjB,CAAAA,MAAY;AAC1E,MAAIA,MAAYoC,EAAYU,YAASyB,KAAAA,QAAAA,EAAUE,QAAQzE;AAAAA,IACzD,CAAC,GAECwC,EAAcM,YAASyB,KAAAA,QAAAA,EAAUE,QAAQjC,EAAcM,WAE3Da,OAAOe,iBAAiB,UAAU9B,CAAc,IAChDe,IAAAA,OAAOC,mBAAPD,QAAAA,EAAuBe,iBAAiB,UAAU9B,KAC7CiB,IAAAA,SAASc,UAATd,QAAAA,EAAgBe,MAAMC,KAAKjC,IAEzB,MAAM;;AACX2B,MAAAA,KAAAA,QAAAA,EAAUO,cACVnB,OAAOoB,oBAAoB,UAAUnC,CAAc,IACnDe,IAAAA,OAAOC,mBAAPD,QAAAA,EAAuBoB,oBAAoB,UAAUnC;AAAAA,IACvD;AAAA,EACF,GAAG,CAACb,GAAUrC,GAAUkD,GAAgB9F,CAAO,CAAC,GAE5C+D,EAAWT,WAAW;AACxB,WAAO;AAGT,QAAM4E,IAAiBjD,IAAWR,EAAc5B,MAAM,GAAG8C,CAAkB,IAAIlB,GACzE0D,IAAoBlD,IAAWR,EAAc5B,MAAM8C,CAAkB,IAAI,CAAA;AAE/E,SACE,gBAAAyC,EAAC,OAAA,EACC,kBAAe,YACf,yBAAuBpI,MAAY,UAAU,KAAOyB,QACpD,iBAAewD,IAAW,KAAOxD,QACjC,WAAW4G,EAAG5I,EAAOkC,UAAUpC,GAASS,CAAO,GAAGiF,KAAYxF,EAAOwF,UAAUtB,CAAS,GACxF,KAAK2B,GACL,GAAIvF,GAEHkF,UAAAA;AAAAA,IAAAA,KACC,gBAAAmD,EAAC,SACC,eAAY,QACZ,WAAW3I,EAAOwG,aAClB,KAAKR,GAEJhB,UAAAA;AAAAA,MAAAA,EAAcnE,IAAI,CAACR,GAAQ4E,MAC1BK,EAAajF,GAAQ;AAAA,QACnB,eAAe;AAAA,QACfwI,IAAI7G;AAAAA,QACJuD,KAAK,WAAW7D,OAAOrB,EAAOkF,OAAON,CAAK,CAAC;AAAA,QAC3C6D,SAAS9G;AAAAA,QACT+G,KAAK/G;AAAAA,QACLgH,UAAU;AAAA,MAAA,CACX,CACH;AAAA,MACA,gBAAAhI,EAACC,GAAA,EAAY,wBAAwBoD,GAA0B,UAAA,KAAA,CAAK;AAAA,IAAA,GACtE;AAAA,IAED9D,MAAY,cAAckE,EAAWZ,SAAS,KAC7C,gBAAA7C,EAAC,QAAA,EACC,WAAWhB,EAAO,oBAAoB,GACtC,KAAKiG,GAEJxB,UAAAA,GACH;AAAA,IAEDgE;AAAAA,IACAC,EAAkB7E,SAAS,KAC1B,gBAAA7C,EAAC,QAAA,EAAK,WAAWhB,EAAO,kBAAkB,GACxC,UAAA,gBAAAgB,EAACR,MACC,SAASkI,GACT,qBAAqBrE,GACrB,wBAAwBA,GAAwB,EAAA,CAEpD;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/dialog/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index36.css');const e=require("react/jsx-runtime"),P=require("../../classix-5H4IWnMA.cjs"),a=require("react"),j=require("../button/index.cjs"),T=require("../icon/index.cjs"),E="_dialog_gog2p_3",F="_close_gog2p_24",M="_fullscreen_gog2p_35",S="_structured_gog2p_56",X="_header_gog2p_62",Y="_content_gog2p_73",w="_controls_gog2p_81",s={dialog:E,close:F,fullscreen:M,structured:S,header:X,content:Y,controls:w},p=c=>a.Children.toArray(c).some(o=>a.isValidElement(o)?o.type===j.Button&&o.props.variant==="danger"?!0:p(o.props.children):!1),A=({children:c,className:o,controls:l,fullscreen:g=!1,header:f,onCancel:i,onClick:u,onClose:d,open:n=!1,setOpen:r,...B})=>{const _=a.useRef(null),m=p(l),h=g||f!=null||l!=null;a.useEffect(()=>{const t=_.current;t&&(n&&!t.open?t.showModal():!n&&t.open&&t.close())},[n]);const b=t=>{i==null||i(t),!(t.defaultPrevented||!r)&&(t.preventDefault(),r(!1))},q=t=>{if(u==null||u(t),m||t.defaultPrevented||t.target!==t.currentTarget||!r)return;const{bottom:N,left:R,right:D,top:k}=t.currentTarget.getBoundingClientRect();(t.clientX<R||t.clientX>D||t.clientY<k||t.clientY>N)&&r(!1)},y=t=>{d==null||d(t),n&&(r==null||r(!1))},x=r&&!m?e.jsx(j.Button,{"aria-label":"Close dialog",className:s.close,onClick:()=>r(!1),variant:"simple",children:e.jsx(T.Icon,{name:"x"})}):null;return e.jsx("dialog",{className:P.t(s.dialog,h&&s.structured,g&&s.fullscreen,o),onCancel:b,onClick:q,onClose:y,ref:_,...B,"data-component":"dialog",children:h?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:s.header,children:[f,x]}),e.jsx("div",{className:s.content,children:c}),l!=null&&e.jsx("div",{className:s.controls,children:l})]}):e.jsxs(e.Fragment,{children:[x,c]})})};exports.Dialog=A;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index36.css');const e=require("react/jsx-runtime"),P=require("../../classix-5H4IWnMA.cjs"),a=require("react"),j=require("../button/index.cjs"),T=require("../icon/index.cjs"),E="_dialog_10cs4_3",F="_close_10cs4_24",M="_fullscreen_10cs4_35",S="_structured_10cs4_56",X="_header_10cs4_62",Y="_content_10cs4_73",w="_controls_10cs4_81",r={dialog:E,close:F,fullscreen:M,structured:S,header:X,content:Y,controls:w},B=l=>a.Children.toArray(l).some(c=>a.isValidElement(c)?c.type===j.Button&&c.props.variant==="danger"?!0:B(c.props.children):!1),A=({children:l,className:c,controls:o,fullscreen:f=!1,header:_,onCancel:i,onClick:u,onClose:d,open:n=!1,setOpen:s,...b})=>{const g=a.useRef(null),m=B(o),h=f||_!=null||o!=null;a.useEffect(()=>{const t=g.current;t&&(n&&!t.open?t.showModal():!n&&t.open&&t.close())},[n]);const q=t=>{i==null||i(t),!(t.defaultPrevented||!s)&&(t.preventDefault(),s(!1))},y=t=>{if(u==null||u(t),m||t.defaultPrevented||t.target!==t.currentTarget||!s)return;const{bottom:R,left:D,right:k,top:p}=t.currentTarget.getBoundingClientRect();(t.clientX<D||t.clientX>k||t.clientY<p||t.clientY>R)&&s(!1)},N=t=>{d==null||d(t),n&&(s==null||s(!1))},x=s&&!m?e.jsx(j.Button,{"aria-label":"Close dialog",className:r.close,onClick:()=>s(!1),variant:"simple",children:e.jsx(T.Icon,{name:"x"})}):null;return e.jsx("dialog",{className:P.t(r.dialog,h&&r.structured,f&&r.fullscreen,c),onCancel:q,onClick:y,onClose:N,ref:g,...b,"data-component":"dialog",children:h?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:r.header,children:[_,x]}),e.jsx("div",{className:r.content,children:l}),o!=null&&e.jsx("div",{className:r.controls,children:o})]}):e.jsxs(e.Fragment,{children:[x,l]})})};exports.Dialog=A;
 //# sourceMappingURL=index.cjs.map

package/dist/components/dialog/index.js

@@ -3,7 +3,7 @@ import { t as X } from "../../classix-DG18itHa.js";
 import N, { useRef as Y, useEffect as w } from "react";
 import { Button as x } from "../button/index.js";
 import { Icon as A } from "../icon/index.js";
-import '../../assets/index36.css';const F = "_dialog_gog2p_3", I = "_close_gog2p_24", M = "_fullscreen_gog2p_35", V = "_structured_gog2p_56", q = "_header_gog2p_62", z = "_content_gog2p_73", G = "_controls_gog2p_81", l = {
+import '../../assets/index36.css';const F = "_dialog_10cs4_3", I = "_close_10cs4_24", M = "_fullscreen_10cs4_35", V = "_structured_10cs4_56", q = "_header_10cs4_62", z = "_content_10cs4_73", G = "_controls_10cs4_81", c = {
   dialog: F,
   close: I,
   fullscreen: M,
@@ -11,28 +11,28 @@ import '../../assets/index36.css';const F = "_dialog_gog2p_3", I = "_close_gog2p
   header: q,
   content: z,
   controls: G
-}, R = (c) => N.Children.toArray(c).some((o) => N.isValidElement(o) ? o.type === x && o.props.variant === "danger" ? !0 : R(o.props.children) : !1), U = ({
-  children: c,
-  className: o,
-  controls: a,
+}, R = (s) => N.Children.toArray(s).some((l) => N.isValidElement(l) ? l.type === x && l.props.variant === "danger" ? !0 : R(l.props.children) : !1), U = ({
+  children: s,
+  className: l,
+  controls: o,
   fullscreen: f = !1,
-  header: g,
+  header: _,
   onCancel: n,
   onClick: i,
   onClose: d,
-  open: s = !1,
+  open: a = !1,
   setOpen: t,
   ...k
 }) => {
-  const _ = Y(null), m = R(a), h = f || g != null || a != null;
+  const m = Y(null), g = R(o), h = f || _ != null || o != null;
   w(() => {
-    const r = _.current;
-    r && (s && !r.open ? r.showModal() : !s && r.open && r.close());
-  }, [s]);
+    const r = m.current;
+    r && (a && !r.open ? r.showModal() : !a && r.open && r.close());
+  }, [a]);
   const y = (r) => {
     n == null || n(r), !(r.defaultPrevented || !t) && (r.preventDefault(), t(!1));
   }, D = (r) => {
-    if (i == null || i(r), m || r.defaultPrevented || r.target !== r.currentTarget || !t) return;
+    if (i == null || i(r), g || r.defaultPrevented || r.target !== r.currentTarget || !t) return;
     const {
       bottom: j,
       left: E,
@@ -41,18 +41,18 @@ import '../../assets/index36.css';const F = "_dialog_gog2p_3", I = "_close_gog2p
     } = r.currentTarget.getBoundingClientRect();
     (r.clientX < E || r.clientX > P || r.clientY < T || r.clientY > j) && t(!1);
   }, b = (r) => {
-    d == null || d(r), s && (t == null || t(!1));
-  }, p = t && !m ? /* @__PURE__ */ e(x, { "aria-label": "Close dialog", className: l.close, onClick: () => t(!1), variant: "simple", children: /* @__PURE__ */ e(A, { name: "x" }) }) : null;
-  return /* @__PURE__ */ e("dialog", { className: X(l.dialog, h && l.structured, f && l.fullscreen, o), onCancel: y, onClick: D, onClose: b, ref: _, ...k, "data-component": "dialog", children: h ? /* @__PURE__ */ u(B, { children: [
-    /* @__PURE__ */ u("div", { className: l.header, children: [
-      g,
+    d == null || d(r), a && (t == null || t(!1));
+  }, p = t && !g ? /* @__PURE__ */ e(x, { "aria-label": "Close dialog", className: c.close, onClick: () => t(!1), variant: "simple", children: /* @__PURE__ */ e(A, { name: "x" }) }) : null;
+  return /* @__PURE__ */ e("dialog", { className: X(c.dialog, h && c.structured, f && c.fullscreen, l), onCancel: y, onClick: D, onClose: b, ref: m, ...k, "data-component": "dialog", children: h ? /* @__PURE__ */ u(B, { children: [
+    /* @__PURE__ */ u("div", { className: c.header, children: [
+      _,
       p
     ] }),
-    /* @__PURE__ */ e("div", { className: l.content, children: c }),
-    a != null && /* @__PURE__ */ e("div", { className: l.controls, children: a })
+    /* @__PURE__ */ e("div", { className: c.content, children: s }),
+    o != null && /* @__PURE__ */ e("div", { className: c.controls, children: o })
   ] }) : /* @__PURE__ */ u(B, { children: [
     p,
-    c
+    s
   ] }) });
 };
 export {

package/dist/components/dropdown/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index37.css');const l=require("react/jsx-runtime"),g=require("../../classix-5H4IWnMA.cjs"),a=require("react"),F=require("../button/index.cjs"),de=require("../../icons-Lq3pr85X.cjs"),X=require("../../index-BOiGSTKz.cjs"),pe=require("../list/index.cjs"),E=require("../../index-CXge5nFf.cjs");function V(t){return typeof t=="string"||typeof t=="number"?String(t):Array.isArray(t)?t.map(V).join(" "):a.isValidElement(t)?V(t.props.children):""}function fe(t){return a.isValidElement(t)&&t.type==="option"}function me(t){return a.isValidElement(t)&&t.type==="optgroup"}function be(t){return a.isValidElement(t)&&t.type===a.Fragment}function _e(t){return a.isValidElement(t)&&t.type===E.Select}function W(t,i,r=!1){const s=[];return a.Children.forEach(t,n=>{if(be(n))s.push(...W(n.props.children,i,r));else if(fe(n)){const c=V(n.props.children).trim(),f=n.props.value!=null?String(n.props.value):c;s.push({disabled:r||!!n.props.disabled,groupLabel:i,hidden:!!n.props.hidden,isPlaceholder:!!(n.props.hidden&&f===""),label:n.props.children,selected:!!n.props.selected,text:c,value:f})}else me(n)&&s.push(...W(n.props.children,n.props.label,r||!!n.props.disabled))}),s}function he(t){const i=t.trim();if(!i)return null;const s=[.../[*?]/.test(i)?i:`*${i}*`].map(n=>n==="*"?".*":n==="?"?".":n.replace(/[|\\{}()[\]^$+.,]/g,"\\$&")).join("");return new RegExp(`^${s}$`,"i")}function ye(t,i){const r=he(i),s=t.filter(n=>!n.hidden&&!n.isPlaceholder);return r?s.filter(n=>r.test([n.groupLabel,n.text,n.value].filter(Boolean).join(" "))):s}function xe(t,i){return t.find(r=>r.value===i)??t.find(r=>r.isPlaceholder)??t[0]}function ge(t,i,r){var s,n;return i!=null?String(i):r!=null?String(r):((s=t.find(c=>c.selected))==null?void 0:s.value)??((n=t[0])==null?void 0:n.value)??""}function je(t){if(_e(t)){const{children:i,placeholder:r,...s}=t.props;return{children:l.jsxs(l.Fragment,{children:[r&&l.jsx("option",{hidden:!0,value:"",children:r}),i]}),props:s}}return{children:t.props.children,props:t.props}}const ve="_combobox_jkdyb_3",we="_dropdown_jkdyb_27",ke="_empty_jkdyb_30",Se="_group_jkdyb_31",Ne="_placeholder_jkdyb_32",Ce="_filter_jkdyb_40",Ee="_native_jkdyb_52",Ve="_option_jkdyb_62",Le="_options_jkdyb_84",Re="_panel_jkdyb_108",$e="_selected_jkdyb_132",Be="_text_jkdyb_136",Ie="_trigger_jkdyb_144",qe="_minimal_jkdyb_180",Pe="_inline_jkdyb_235",De="_label_jkdyb_267",o={combobox:ve,"combobox-input":"_combobox-input_jkdyb_12",dropdown:we,empty:ke,group:Se,placeholder:Ne,filter:Ce,native:Ee,option:Ve,options:Le,panel:Re,selected:$e,text:Be,trigger:Ie,minimal:qe,inline:Pe,label:De,"inline-field":"_inline-field_jkdyb_273"};function Y(t,i){return{"--icon-svg":de.iconSVG(t).replace("currentColor",i)}}const Fe=({children:t,className:i,combobox:r=!1,createOption:s,emptyLabel:n="No matches found",label:c,renderOption:f,searchPlaceholder:L="Filter",selectedItems:Z,variant:h="default",...ee})=>{const R=je(t),{defaultValue:te,onChange:$,value:B,...ne}=R.props,j=E.sanitizeSelectProps(ne),{className:re,...se}=j,M=a.useRef(null),Q=a.useRef(null),v=a.useId(),z=a.useRef(null),m=a.useRef(null),y=W(R.children),x=B!=null,I=ge(y,B,te),[q,P]=a.useState(()=>I),[u,p]=a.useState(!1),[w,k]=a.useState(""),S=x?String(B):q,O={default:E.resolveColor("--colors-semantic-content-secondary"),white:E.resolveColor("--color-white","white")},T=h==="minimal"?O.white:O.default,N=xe(y,S),le=Y("chevron",T),oe=Y("search",T),A=ye(y,w),b=w.trim(),C=!!(r&&s&&b&&s.isValid(b)),ie=c&&h==="inline"?X.formatInlineLabel(c):c,G=e=>e?(f==null?void 0:f({groupLabel:e.groupLabel,isSelected:e.value===S,label:e.label,text:e.text,value:e.value}))??e.label:"Select an option";a.useEffect(()=>{!x&&!y.some(e=>e.value===q)&&P(I)},[I,q,x,y]),a.useEffect(()=>{var e;if(!u){k("");return}(e=m.current)==null||e.focus()},[u]),a.useEffect(()=>{if(!u)return;const e=d=>{var _;(_=Q.current)!=null&&_.contains(d.target)||p(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[u]);const ae=e=>{x||P(e.target.value),$==null||$(e)},D=()=>{var e;p(!1),r||(e=M.current)==null||e.focus()},K=()=>{var e;k(""),p(!0),(e=m.current)==null||e.focus()},H=()=>{!s||!C||(s.onCreate(b),K())},ce=e=>{var U;x||P(e);const d=z.current;if(!d){D();return}const _=(U=Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype,"value"))==null?void 0:U.set;_==null||_.call(d,e),d.dispatchEvent(new Event("change",{bubbles:!0})),r?K():D()},ue=e=>{e.key==="Escape"&&D(),e.key==="Enter"&&e.target===m.current&&C&&(e.preventDefault(),H())},J=l.jsxs("div",{className:g.t(o.dropdown,h==="inline"&&o.inline,h==="minimal"&&o.minimal,i),onKeyDown:ue,ref:Q,...ee,children:[l.jsx("select",{...se,"aria-hidden":"true",className:g.t(o.native,re),onChange:ae,ref:z,tabIndex:-1,value:S,children:R.children}),r?l.jsxs("div",{className:o.combobox,onClick:()=>{var e;return(e=m.current)==null?void 0:e.focus()},children:[Z,l.jsx("input",{"aria-autocomplete":"list","aria-expanded":u,"aria-label":j["aria-label"]??c??L,className:o["combobox-input"],disabled:j.disabled,onChange:e=>{k(e.target.value),p(!0)},onClick:()=>p(!0),onFocus:()=>p(!0),placeholder:L||void 0,ref:m,role:"combobox",type:"text",value:w})]}):l.jsx(F.Button,{"aria-expanded":u,"aria-haspopup":"dialog","aria-labelledby":c?`${v} ${v}-value`:void 0,className:g.t(o.trigger,(N==null?void 0:N.isPlaceholder)&&o.placeholder),"data-open":u?"true":void 0,disabled:j.disabled,onClick:()=>p(e=>!e),ref:M,style:le,variant:"tertiary",children:l.jsx("span",{className:o.text,id:`${v}-value`,children:G(N)})}),u&&l.jsxs("div",{className:o.panel,children:[!r&&l.jsx(X.Input,{"aria-label":"Filter",className:o.filter,icon:"search",onChange:e=>k(e.target.value),placeholder:L,ref:m,style:oe,type:"search",value:w}),l.jsxs(pe.List,{"aria-label":"Dropdown",className:o.options,children:[A.map(e=>{const d=e.value===S;return l.jsx("li",{"data-component":"dropdown",children:l.jsxs(F.Button,{"aria-label":d?`${e.text}, selected`:e.text,className:g.t(o.option,d&&o.selected),disabled:e.disabled,onClick:()=>ce(e.value),variant:"tertiary",children:[l.jsx("span",{className:o.text,children:G(e)}),e.groupLabel&&l.jsx("small",{className:o.group,children:e.groupLabel})]})},`${e.groupLabel??"root"}-${e.value}`)}),C&&s&&l.jsx("li",{children:l.jsx(F.Button,{"aria-label":V(s.render(b))||b,className:o.option,onClick:H,variant:"tertiary",children:l.jsx("span",{className:o.text,children:s.render(b)})})}),A.length===0&&!C&&l.jsx("li",{className:o.empty,children:n})]})]})]});return c?l.jsxs("div",{className:g.t(o.label,h==="inline"&&o["inline-field"]),"data-component":"dropdown",children:[l.jsx("span",{id:v,children:ie}),J]}):J};exports.Dropdown=Fe;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index37.css');const l=require("react/jsx-runtime"),g=require("../../classix-5H4IWnMA.cjs"),a=require("react"),F=require("../button/index.cjs"),de=require("../../icons-Lq3pr85X.cjs"),X=require("../../index-BOiGSTKz.cjs"),pe=require("../list/index.cjs"),E=require("../../index-BlnG4Rbh.cjs");function V(t){return typeof t=="string"||typeof t=="number"?String(t):Array.isArray(t)?t.map(V).join(" "):a.isValidElement(t)?V(t.props.children):""}function fe(t){return a.isValidElement(t)&&t.type==="option"}function me(t){return a.isValidElement(t)&&t.type==="optgroup"}function be(t){return a.isValidElement(t)&&t.type===a.Fragment}function _e(t){return a.isValidElement(t)&&t.type===E.Select}function W(t,i,r=!1){const s=[];return a.Children.forEach(t,n=>{if(be(n))s.push(...W(n.props.children,i,r));else if(fe(n)){const c=V(n.props.children).trim(),f=n.props.value!=null?String(n.props.value):c;s.push({disabled:r||!!n.props.disabled,groupLabel:i,hidden:!!n.props.hidden,isPlaceholder:!!(n.props.hidden&&f===""),label:n.props.children,selected:!!n.props.selected,text:c,value:f})}else me(n)&&s.push(...W(n.props.children,n.props.label,r||!!n.props.disabled))}),s}function he(t){const i=t.trim();if(!i)return null;const s=[.../[*?]/.test(i)?i:`*${i}*`].map(n=>n==="*"?".*":n==="?"?".":n.replace(/[|\\{}()[\]^$+.,]/g,"\\$&")).join("");return new RegExp(`^${s}$`,"i")}function ye(t,i){const r=he(i),s=t.filter(n=>!n.hidden&&!n.isPlaceholder);return r?s.filter(n=>r.test([n.groupLabel,n.text,n.value].filter(Boolean).join(" "))):s}function xe(t,i){return t.find(r=>r.value===i)??t.find(r=>r.isPlaceholder)??t[0]}function ge(t,i,r){var s,n;return i!=null?String(i):r!=null?String(r):((s=t.find(c=>c.selected))==null?void 0:s.value)??((n=t[0])==null?void 0:n.value)??""}function je(t){if(_e(t)){const{children:i,placeholder:r,...s}=t.props;return{children:l.jsxs(l.Fragment,{children:[r&&l.jsx("option",{hidden:!0,value:"",children:r}),i]}),props:s}}return{children:t.props.children,props:t.props}}const ve="_combobox_jkdyb_3",we="_dropdown_jkdyb_27",ke="_empty_jkdyb_30",Se="_group_jkdyb_31",Ne="_placeholder_jkdyb_32",Ce="_filter_jkdyb_40",Ee="_native_jkdyb_52",Ve="_option_jkdyb_62",Le="_options_jkdyb_84",Re="_panel_jkdyb_108",$e="_selected_jkdyb_132",Be="_text_jkdyb_136",Ie="_trigger_jkdyb_144",qe="_minimal_jkdyb_180",Pe="_inline_jkdyb_235",De="_label_jkdyb_267",o={combobox:ve,"combobox-input":"_combobox-input_jkdyb_12",dropdown:we,empty:ke,group:Se,placeholder:Ne,filter:Ce,native:Ee,option:Ve,options:Le,panel:Re,selected:$e,text:Be,trigger:Ie,minimal:qe,inline:Pe,label:De,"inline-field":"_inline-field_jkdyb_273"};function Y(t,i){return{"--icon-svg":de.iconSVG(t).replace("currentColor",i)}}const Fe=({children:t,className:i,combobox:r=!1,createOption:s,emptyLabel:n="No matches found",label:c,renderOption:f,searchPlaceholder:L="Filter",selectedItems:Z,variant:h="default",...ee})=>{const R=je(t),{defaultValue:te,onChange:$,value:B,...ne}=R.props,j=E.sanitizeSelectProps(ne),{className:re,...se}=j,M=a.useRef(null),Q=a.useRef(null),v=a.useId(),z=a.useRef(null),m=a.useRef(null),y=W(R.children),x=B!=null,I=ge(y,B,te),[q,P]=a.useState(()=>I),[u,p]=a.useState(!1),[w,k]=a.useState(""),S=x?String(B):q,O={default:E.resolveColor("--colors-semantic-content-secondary"),white:E.resolveColor("--color-white","white")},T=h==="minimal"?O.white:O.default,N=xe(y,S),le=Y("chevron",T),oe=Y("search",T),A=ye(y,w),b=w.trim(),C=!!(r&&s&&b&&s.isValid(b)),ie=c&&h==="inline"?X.formatInlineLabel(c):c,G=e=>e?(f==null?void 0:f({groupLabel:e.groupLabel,isSelected:e.value===S,label:e.label,text:e.text,value:e.value}))??e.label:"Select an option";a.useEffect(()=>{!x&&!y.some(e=>e.value===q)&&P(I)},[I,q,x,y]),a.useEffect(()=>{var e;if(!u){k("");return}(e=m.current)==null||e.focus()},[u]),a.useEffect(()=>{if(!u)return;const e=d=>{var _;(_=Q.current)!=null&&_.contains(d.target)||p(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[u]);const ae=e=>{x||P(e.target.value),$==null||$(e)},D=()=>{var e;p(!1),r||(e=M.current)==null||e.focus()},K=()=>{var e;k(""),p(!0),(e=m.current)==null||e.focus()},H=()=>{!s||!C||(s.onCreate(b),K())},ce=e=>{var U;x||P(e);const d=z.current;if(!d){D();return}const _=(U=Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype,"value"))==null?void 0:U.set;_==null||_.call(d,e),d.dispatchEvent(new Event("change",{bubbles:!0})),r?K():D()},ue=e=>{e.key==="Escape"&&D(),e.key==="Enter"&&e.target===m.current&&C&&(e.preventDefault(),H())},J=l.jsxs("div",{className:g.t(o.dropdown,h==="inline"&&o.inline,h==="minimal"&&o.minimal,i),onKeyDown:ue,ref:Q,...ee,children:[l.jsx("select",{...se,"aria-hidden":"true",className:g.t(o.native,re),onChange:ae,ref:z,tabIndex:-1,value:S,children:R.children}),r?l.jsxs("div",{className:o.combobox,onClick:()=>{var e;return(e=m.current)==null?void 0:e.focus()},children:[Z,l.jsx("input",{"aria-autocomplete":"list","aria-expanded":u,"aria-label":j["aria-label"]??c??L,className:o["combobox-input"],disabled:j.disabled,onChange:e=>{k(e.target.value),p(!0)},onClick:()=>p(!0),onFocus:()=>p(!0),placeholder:L||void 0,ref:m,role:"combobox",type:"text",value:w})]}):l.jsx(F.Button,{"aria-expanded":u,"aria-haspopup":"dialog","aria-labelledby":c?`${v} ${v}-value`:void 0,className:g.t(o.trigger,(N==null?void 0:N.isPlaceholder)&&o.placeholder),"data-open":u?"true":void 0,disabled:j.disabled,onClick:()=>p(e=>!e),ref:M,style:le,variant:"tertiary",children:l.jsx("span",{className:o.text,id:`${v}-value`,children:G(N)})}),u&&l.jsxs("div",{className:o.panel,children:[!r&&l.jsx(X.Input,{"aria-label":"Filter",className:o.filter,icon:"search",onChange:e=>k(e.target.value),placeholder:L,ref:m,style:oe,type:"search",value:w}),l.jsxs(pe.List,{"aria-label":"Dropdown",className:o.options,children:[A.map(e=>{const d=e.value===S;return l.jsx("li",{"data-component":"dropdown",children:l.jsxs(F.Button,{"aria-label":d?`${e.text}, selected`:e.text,className:g.t(o.option,d&&o.selected),disabled:e.disabled,onClick:()=>ce(e.value),variant:"tertiary",children:[l.jsx("span",{className:o.text,children:G(e)}),e.groupLabel&&l.jsx("small",{className:o.group,children:e.groupLabel})]})},`${e.groupLabel??"root"}-${e.value}`)}),C&&s&&l.jsx("li",{children:l.jsx(F.Button,{"aria-label":V(s.render(b))||b,className:o.option,onClick:H,variant:"tertiary",children:l.jsx("span",{className:o.text,children:s.render(b)})})}),A.length===0&&!C&&l.jsx("li",{className:o.empty,children:n})]})]})]});return c?l.jsxs("div",{className:g.t(o.label,h==="inline"&&o["inline-field"]),"data-component":"dropdown",children:[l.jsx("span",{id:v,children:ie}),J]}):J};exports.Dropdown=Fe;
 //# sourceMappingURL=index.cjs.map

package/dist/components/dropdown/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/dropdown/options.tsx","../../../src/components/dropdown/index.tsx"],"sourcesContent":["import React, { Children, isValidElement } from 'react';\n\nimport { Select, type SelectProps } from '@/components/select';\n\ntype NativeSelectProps = Omit<React.ComponentPropsWithoutRef<'select'>, 'children' | 'multiple'> & {\n  children: React.ReactNode;\n  multiple?: false;\n};\n\ntype NativeSelectElement = React.ReactElement<NativeSelectProps, 'select'>;\ntype WrappedSelectElement = React.ReactElement<SelectProps, typeof Select>;\n\nexport type DropdownSelectElement = NativeSelectElement | WrappedSelectElement;\n\nexport type DropdownOption = {\n  disabled: boolean;\n  groupLabel?: string;\n  hidden: boolean;\n  isPlaceholder: boolean;\n  label: React.ReactNode;\n  selected: boolean;\n  text: string;\n  value: string;\n};\n\nexport type DropdownRenderOption = Pick<\n  DropdownOption,\n  'groupLabel' | 'label' | 'text' | 'value'\n> & {\n  isSelected: boolean;\n};\n\nexport function getNodeText(node: React.ReactNode): string {\n  if (typeof node === 'string' || typeof node === 'number') return String(node);\n  if (Array.isArray(node)) return node.map(getNodeText).join(' ');\n  if (isValidElement<{ children?: React.ReactNode }>(node)) return getNodeText(node.props.children);\n  return '';\n}\n\nfunction isOptionElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'option'>, 'option'> {\n  return isValidElement(node) && node.type === 'option';\n}\n\nfunction isOptGroupElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'optgroup'>, 'optgroup'> {\n  return isValidElement(node) && node.type === 'optgroup';\n}\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }, typeof React.Fragment> {\n  return isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction isWrappedSelectElement(node: React.ReactNode): node is WrappedSelectElement {\n  return isValidElement(node) && node.type === Select;\n}\n\nexport function extractOptions(\n  children: React.ReactNode,\n  groupLabel?: string,\n  groupDisabled = false\n): DropdownOption[] {\n  const options: DropdownOption[] = [];\n\n  Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      options.push(...extractOptions(child.props.children, groupLabel, groupDisabled));\n    } else if (isOptionElement(child)) {\n      const text = getNodeText(child.props.children).trim();\n      const value = child.props.value != null ? String(child.props.value) : text;\n      options.push({\n        disabled: groupDisabled || Boolean(child.props.disabled),\n        groupLabel,\n        hidden: Boolean(child.props.hidden),\n        isPlaceholder: Boolean(child.props.hidden && value === ''),\n        label: child.props.children,\n        selected: Boolean(child.props.selected),\n        text,\n        value,\n      });\n    } else if (isOptGroupElement(child)) {\n      options.push(\n        ...extractOptions(\n          child.props.children,\n          child.props.label,\n          groupDisabled || Boolean(child.props.disabled)\n        )\n      );\n    }\n  });\n\n  return options;\n}\n\nfunction buildWildcardMatcher(query: string) {\n  const trimmedQuery = query.trim();\n  if (!trimmedQuery) return null;\n\n  const wildcardQuery = /[*?]/.test(trimmedQuery) ? trimmedQuery : `*${trimmedQuery}*`;\n  const expression = [...wildcardQuery]\n    .map((character) => {\n      if (character === '*') return '.*';\n      if (character === '?') return '.';\n      return character.replace(/[|\\\\{}()[\\]^$+.,]/g, '\\\\$&');\n    })\n    .join('');\n\n  return new RegExp(`^${expression}$`, 'i');\n}\n\nexport function filterOptions(options: DropdownOption[], query: string) {\n  const matcher = buildWildcardMatcher(query);\n  const selectableOptions = options.filter((option) => !option.hidden && !option.isPlaceholder);\n  return matcher\n    ? selectableOptions.filter((option) =>\n        matcher.test([option.groupLabel, option.text, option.value].filter(Boolean).join(' '))\n      )\n    : selectableOptions;\n}\n\nexport function getDisplayOption(options: DropdownOption[], selectedValue: string) {\n  return (\n    options.find((option) => option.value === selectedValue) ??\n    options.find((option) => option.isPlaceholder) ??\n    options[0]\n  );\n}\n\nexport function getInitialValue(\n  options: DropdownOption[],\n  value?: NativeSelectProps['value'],\n  defaultValue?: NativeSelectProps['defaultValue']\n) {\n  if (value != null) return String(value);\n  if (defaultValue != null) return String(defaultValue);\n  return options.find((option) => option.selected)?.value ?? options[0]?.value ?? '';\n}\n\nexport function normalizeSelectElement(selectElement: DropdownSelectElement) {\n  if (isWrappedSelectElement(selectElement)) {\n    const { children, placeholder, ...props } = selectElement.props;\n    return {\n      children: (\n        <>\n          {placeholder && (\n            <option\n              hidden\n              value=''\n            >\n              {placeholder}\n            </option>\n          )}\n          {children}\n        </>\n      ),\n      props,\n    };\n  }\n\n  return { children: selectElement.props.children, props: selectElement.props };\n}\n","import cx from 'classix';\nimport React, { useEffect, useId, useRef, useState } from 'react';\n\nimport { Button } from '@/components/button';\nimport { type IconName, iconSVG } from '@/components/icon/icons';\nimport { Input } from '@/components/input';\nimport { List } from '@/components/list';\nimport { sanitizeSelectProps } from '@/components/select/sanitize-select-props';\nimport { resolveColor } from '@/lib/color';\nimport { formatInlineLabel } from '@/lib/text';\n\nimport {\n  type DropdownOption,\n  type DropdownRenderOption,\n  type DropdownSelectElement,\n  extractOptions,\n  filterOptions,\n  getDisplayOption,\n  getInitialValue,\n  getNodeText,\n  normalizeSelectElement,\n} from './options';\nimport styles from './styles.module.css';\n\nexport type { DropdownRenderOption } from './options';\n\nexport type DropdownCreateOption = {\n  isValid: (value: string) => boolean;\n  onCreate: (value: string) => void;\n  render: (value: string) => React.ReactNode;\n};\n\nexport type DropdownProps = Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> & {\n  children: DropdownSelectElement;\n  combobox?: boolean;\n  createOption?: DropdownCreateOption;\n  emptyLabel?: string;\n  label?: string;\n  renderOption?: (option: DropdownRenderOption) => React.ReactNode;\n  searchPlaceholder?: string;\n  selectedItems?: React.ReactNode;\n  variant?: 'default' | 'inline' | 'minimal';\n};\n\ntype withVars = React.CSSProperties & {\n  '--icon-svg'?: string;\n};\n\nfunction getIconWithVars(icon: IconName, color: string): withVars {\n  return {\n    '--icon-svg': iconSVG(icon).replace('currentColor', color),\n  };\n}\n\nexport const Dropdown = ({\n  children: selectElement,\n  className,\n  combobox = false,\n  createOption,\n  emptyLabel = 'No matches found',\n  label,\n  renderOption,\n  searchPlaceholder = 'Filter',\n  selectedItems,\n  variant = 'default',\n  ...props\n}: DropdownProps) => {\n  const normalizedSelect = normalizeSelectElement(selectElement);\n  const { defaultValue, onChange, value, ...restSelectProps } = normalizedSelect.props;\n  const selectProps = sanitizeSelectProps(restSelectProps);\n  const { className: selectClassName, ...nativeSelectProps } = selectProps;\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const labelId = useId();\n  const nativeSelectRef = useRef<HTMLSelectElement>(null);\n  const searchRef = useRef<HTMLInputElement>(null);\n  const options = extractOptions(normalizedSelect.children);\n  const isControlled = value != null;\n  const initialValue = getInitialValue(options, value, defaultValue);\n  const [internalValue, setInternalValue] = useState(() => initialValue);\n  const [isOpen, setIsOpen] = useState(false);\n  const [query, setQuery] = useState('');\n  const selectedValue = isControlled ? String(value) : internalValue;\n  const iconColors = {\n    default: resolveColor('--colors-semantic-content-secondary'),\n    white: resolveColor('--color-white', 'white'),\n  };\n  const dropdownIconColor = variant === 'minimal' ? iconColors.white : iconColors.default;\n  const displayOption = getDisplayOption(options, selectedValue);\n  const triggerWithVars = getIconWithVars('chevron', dropdownIconColor);\n  const filterWithVars = getIconWithVars('search', dropdownIconColor);\n  const filteredOptions = filterOptions(options, query);\n  const customValue = query.trim();\n  const canCreateOption = Boolean(\n    combobox && createOption && customValue && createOption.isValid(customValue)\n  );\n  const displayLabel = label && variant === 'inline' ? formatInlineLabel(label) : label;\n  const renderDropdownOption = (option: DropdownOption | undefined) => {\n    if (!option) return 'Select an option';\n\n    return (\n      renderOption?.({\n        groupLabel: option.groupLabel,\n        isSelected: option.value === selectedValue,\n        label: option.label,\n        text: option.text,\n        value: option.value,\n      }) ?? option.label\n    );\n  };\n\n  useEffect(() => {\n    if (!isControlled && !options.some((option) => option.value === internalValue)) {\n      setInternalValue(initialValue);\n    }\n  }, [initialValue, internalValue, isControlled, options]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      setQuery('');\n      return;\n    }\n\n    searchRef.current?.focus();\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      return;\n    }\n\n    const handlePointerDown = (event: MouseEvent) => {\n      if (!containerRef.current?.contains(event.target as Node)) {\n        setIsOpen(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handlePointerDown);\n\n    return () => {\n      document.removeEventListener('mousedown', handlePointerDown);\n    };\n  }, [isOpen]);\n\n  const handleNativeChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n    if (!isControlled) {\n      setInternalValue(event.target.value);\n    }\n\n    onChange?.(event);\n  };\n\n  const closeMenu = () => {\n    setIsOpen(false);\n    if (!combobox) {\n      buttonRef.current?.focus();\n    }\n  };\n\n  const continueComboboxSelection = () => {\n    setQuery('');\n    setIsOpen(true);\n    searchRef.current?.focus();\n  };\n\n  const commitCustomValue = () => {\n    if (!createOption || !canCreateOption) return;\n\n    createOption.onCreate(customValue);\n    continueComboboxSelection();\n  };\n\n  const commitValue = (nextValue: string) => {\n    if (!isControlled) {\n      setInternalValue(nextValue);\n    }\n\n    const nativeSelect = nativeSelectRef.current;\n\n    if (!nativeSelect) {\n      closeMenu();\n      return;\n    }\n\n    const valueSetter = Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, 'value')?.set;\n\n    valueSetter?.call(nativeSelect, nextValue);\n    nativeSelect.dispatchEvent(new Event('change', { bubbles: true }));\n    if (combobox) {\n      continueComboboxSelection();\n    } else {\n      closeMenu();\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'Escape') {\n      closeMenu();\n    }\n\n    if (event.key === 'Enter' && event.target === searchRef.current && canCreateOption) {\n      event.preventDefault();\n      commitCustomValue();\n    }\n  };\n\n  const dropdown = (\n    <div\n      className={cx(\n        styles.dropdown,\n        variant === 'inline' && styles.inline,\n        variant === 'minimal' && styles.minimal,\n        className\n      )}\n      onKeyDown={handleKeyDown}\n      ref={containerRef}\n      {...props}\n    >\n      <select\n        {...nativeSelectProps}\n        aria-hidden='true'\n        className={cx(styles.native, selectClassName)}\n        onChange={handleNativeChange}\n        ref={nativeSelectRef}\n        tabIndex={-1}\n        value={selectedValue}\n      >\n        {normalizedSelect.children}\n      </select>\n      {combobox ? (\n        <div\n          className={styles.combobox}\n          onClick={() => searchRef.current?.focus()}\n        >\n          {selectedItems}\n          <input\n            aria-autocomplete='list'\n            aria-expanded={isOpen}\n            aria-label={selectProps['aria-label'] ?? label ?? searchPlaceholder}\n            className={styles['combobox-input']}\n            disabled={selectProps.disabled}\n            onChange={(event) => {\n              setQuery(event.target.value);\n              setIsOpen(true);\n            }}\n            onClick={() => setIsOpen(true)}\n            onFocus={() => setIsOpen(true)}\n            placeholder={searchPlaceholder || undefined}\n            ref={searchRef}\n            role='combobox'\n            type='text'\n            value={query}\n          />\n        </div>\n      ) : (\n        <Button\n          aria-expanded={isOpen}\n          aria-haspopup='dialog'\n          aria-labelledby={label ? `${labelId} ${labelId}-value` : undefined}\n          className={cx(styles.trigger, displayOption?.isPlaceholder && styles.placeholder)}\n          data-open={isOpen ? 'true' : undefined}\n          disabled={selectProps.disabled}\n          onClick={() => setIsOpen((currentValue) => !currentValue)}\n          ref={buttonRef}\n          style={triggerWithVars}\n          variant='tertiary'\n        >\n          <span\n            className={styles.text}\n            id={`${labelId}-value`}\n          >\n            {renderDropdownOption(displayOption)}\n          </span>\n        </Button>\n      )}\n      {isOpen && (\n        <div className={styles.panel}>\n          {!combobox && (\n            <Input\n              aria-label='Filter'\n              className={styles.filter}\n              icon='search'\n              onChange={(event) => setQuery(event.target.value)}\n              placeholder={searchPlaceholder}\n              ref={searchRef}\n              style={filterWithVars}\n              type='search'\n              value={query}\n            />\n          )}\n          <List\n            aria-label='Dropdown'\n            className={styles.options}\n          >\n            {filteredOptions.map((option) => {\n              const isSelected = option.value === selectedValue;\n\n              return (\n                <li key={`${option.groupLabel ?? 'root'}-${option.value}`}>\n                  <Button\n                    aria-label={isSelected ? `${option.text}, selected` : option.text}\n                    className={cx(styles.option, isSelected && styles.selected)}\n                    disabled={option.disabled}\n                    onClick={() => commitValue(option.value)}\n                    variant='tertiary'\n                  >\n                    <span className={styles.text}>{renderDropdownOption(option)}</span>\n                    {option.groupLabel && (\n                      <small className={styles.group}>{option.groupLabel}</small>\n                    )}\n                  </Button>\n                </li>\n              );\n            })}\n            {canCreateOption && createOption && (\n              <li>\n                <Button\n                  aria-label={getNodeText(createOption.render(customValue)) || customValue}\n                  className={styles.option}\n                  onClick={commitCustomValue}\n                  variant='tertiary'\n                >\n                  <span className={styles.text}>{createOption.render(customValue)}</span>\n                </Button>\n              </li>\n            )}\n            {filteredOptions.length === 0 && !canCreateOption && (\n              <li className={styles.empty}>{emptyLabel}</li>\n            )}\n          </List>\n        </div>\n      )}\n    </div>\n  );\n\n  return label ? (\n    <div className={cx(styles.label, variant === 'inline' && styles['inline-field'])}>\n      <span id={labelId}>{displayLabel}</span>\n      {dropdown}\n    </div>\n  ) : (\n    dropdown\n  );\n};\n"],"names":["getNodeText","node","String","Array","isArray","map","join","isValidElement","props","children","isOptionElement","type","isOptGroupElement","isFragmentElement","React","Fragment","isWrappedSelectElement","Select","extractOptions","groupLabel","groupDisabled","options","Children","forEach","child","push","text","trim","value","disabled","Boolean","hidden","isPlaceholder","label","selected","buildWildcardMatcher","query","trimmedQuery","expression","test","character","replace","RegExp","filterOptions","matcher","selectableOptions","filter","option","getDisplayOption","selectedValue","find","getInitialValue","defaultValue","normalizeSelectElement","selectElement","placeholder","jsxs","getIconWithVars","icon","color","iconSVG","Dropdown","className","combobox","createOption","emptyLabel","renderOption","searchPlaceholder","selectedItems","variant","normalizedSelect","onChange","restSelectProps","selectProps","sanitizeSelectProps","selectClassName","nativeSelectProps","buttonRef","useRef","containerRef","labelId","useId","nativeSelectRef","searchRef","isControlled","initialValue","internalValue","setInternalValue","useState","isOpen","setIsOpen","setQuery","iconColors","default","resolveColor","white","dropdownIconColor","displayOption","triggerWithVars","filterWithVars","filteredOptions","customValue","canCreateOption","isValid","displayLabel","formatInlineLabel","renderDropdownOption","isSelected","useEffect","some","current","focus","handlePointerDown","event","contains","target","document","addEventListener","removeEventListener","handleNativeChange","closeMenu","continueComboboxSelection","commitCustomValue","onCreate","commitValue","nextValue","nativeSelect","valueSetter","Object","getOwnPropertyDescriptor","HTMLSelectElement","prototype","set","call","dispatchEvent","Event","bubbles","handleKeyDown","key","preventDefault","dropdown","cx","styles","inline","minimal","jsx","native","undefined","Button","trigger","currentValue","panel","Input","List","group","render","length","empty"],"mappings":"oWAgCO,SAASA,EAAYC,EAA+B,CACzD,OAAI,OAAOA,GAAS,UAAY,OAAOA,GAAS,SAAiBC,OAAOD,CAAI,EACxEE,MAAMC,QAAQH,CAAI,EAAUA,EAAKI,IAAIL,CAAW,EAAEM,KAAK,GAAG,EAC1DC,EAAAA,eAA+CN,CAAI,EAAUD,EAAYC,EAAKO,MAAMC,QAAQ,EACzF,EACT,CAEA,SAASC,GACPT,EACgF,CAChF,OAAOM,EAAAA,eAAeN,CAAI,GAAKA,EAAKU,OAAS,QAC/C,CAEA,SAASC,GACPX,EACoF,CACpF,OAAOM,EAAAA,eAAeN,CAAI,GAAKA,EAAKU,OAAS,UAC/C,CAEA,SAASE,GACPZ,EACmF,CACnF,OAAOM,EAAAA,eAAeN,CAAI,GAAKA,EAAKU,OAASG,EAAMC,QACrD,CAEA,SAASC,GAAuBf,EAAqD,CACnF,OAAOM,EAAAA,eAAeN,CAAI,GAAKA,EAAKU,OAASM,EAAAA,MAC/C,CAEO,SAASC,EACdT,EACAU,EACAC,EAAgB,GACE,CAClB,MAAMC,EAA4B,CAAA,EAElCC,OAAAA,EAAAA,SAASC,QAAQd,EAAWe,GAAU,CACpC,GAAIX,GAAkBW,CAAK,EACzBH,EAAQI,KAAK,GAAGP,EAAeM,EAAMhB,MAAMC,SAAUU,EAAYC,CAAa,CAAC,UACtEV,GAAgBc,CAAK,EAAG,CACjC,MAAME,EAAO1B,EAAYwB,EAAMhB,MAAMC,QAAQ,EAAEkB,KAAAA,EACzCC,EAAQJ,EAAMhB,MAAMoB,OAAS,KAAO1B,OAAOsB,EAAMhB,MAAMoB,KAAK,EAAIF,EACtEL,EAAQI,KAAK,CACXI,SAAUT,GAAiBU,EAAQN,EAAMhB,MAAMqB,SAC/CV,WAAAA,EACAY,OAAQD,EAAQN,EAAMhB,MAAMuB,OAC5BC,cAAeF,GAAQN,EAAMhB,MAAMuB,QAAUH,IAAU,IACvDK,MAAOT,EAAMhB,MAAMC,SACnByB,SAAUJ,EAAQN,EAAMhB,MAAM0B,SAC9BR,KAAAA,EACAE,MAAAA,CAAAA,CACD,CACH,MAAWhB,GAAkBY,CAAK,GAChCH,EAAQI,KACN,GAAGP,EACDM,EAAMhB,MAAMC,SACZe,EAAMhB,MAAMyB,MACZb,GAAiBU,EAAQN,EAAMhB,MAAMqB,QACvC,CACF,CAEJ,CAAC,EAEMR,CACT,CAEA,SAASc,GAAqBC,EAAe,CAC3C,MAAMC,EAAeD,EAAMT,KAAAA,EAC3B,GAAI,CAACU,EAAc,OAAO,KAG1B,MAAMC,EAAa,CAAC,GADE,OAAOC,KAAKF,CAAY,EAAIA,EAAe,IAAIA,CAAY,GAC7C,EACjChC,IAAKmC,GACAA,IAAc,IAAY,KAC1BA,IAAc,IAAY,IACvBA,EAAUC,QAAQ,qBAAsB,MAAM,CACtD,EACAnC,KAAK,EAAE,EAEV,OAAO,IAAIoC,OAAO,IAAIJ,CAAU,IAAK,GAAG,CAC1C,CAEO,SAASK,GAActB,EAA2Be,EAAe,CACtE,MAAMQ,EAAUT,GAAqBC,CAAK,EACpCS,EAAoBxB,EAAQyB,OAAQC,GAAW,CAACA,EAAOhB,QAAU,CAACgB,EAAOf,aAAa,EAC5F,OAAOY,EACHC,EAAkBC,OAAQC,GACxBH,EAAQL,KAAK,CAACQ,EAAO5B,WAAY4B,EAAOrB,KAAMqB,EAAOnB,KAAK,EAAEkB,OAAOhB,OAAO,EAAExB,KAAK,GAAG,CAAC,CACvF,EACAuC,CACN,CAEO,SAASG,GAAiB3B,EAA2B4B,EAAuB,CACjF,OACE5B,EAAQ6B,KAAMH,GAAWA,EAAOnB,QAAUqB,CAAa,GACvD5B,EAAQ6B,KAAMH,GAAWA,EAAOf,aAAa,GAC7CX,EAAQ,CAAC,CAEb,CAEO,SAAS8B,GACd9B,EACAO,EACAwB,EACA,SACA,OAAIxB,GAAS,KAAa1B,OAAO0B,CAAK,EAClCwB,GAAgB,KAAalD,OAAOkD,CAAY,IAC7C/B,EAAAA,EAAQ6B,KAAMH,GAAWA,EAAOb,QAAQ,IAAxCb,YAAAA,EAA2CO,UAASP,EAAAA,EAAQ,CAAC,IAATA,YAAAA,EAAYO,QAAS,EAClF,CAEO,SAASyB,GAAuBC,EAAsC,CAC3E,GAAItC,GAAuBsC,CAAa,EAAG,CACzC,KAAM,CAAE7C,SAAAA,EAAU8C,YAAAA,EAAa,GAAG/C,CAAAA,EAAU8C,EAAc9C,MAC1D,MAAO,CACLC,SACE+C,EAAAA,KAAAzC,WAAA,CACGwC,SAAAA,CAAAA,SACE,SAAA,CACC,OAAM,GACN,MAAM,GAELA,SAAAA,EACH,EAED9C,CAAAA,EACH,EAEFD,MAAAA,CAAAA,CAEJ,CAEA,MAAO,CAAEC,SAAU6C,EAAc9C,MAAMC,SAAUD,MAAO8C,EAAc9C,KAAAA,CACxE,snBCpHA,SAASiD,EAAgBC,EAAgBC,EAAyB,CAChE,MAAO,CACL,aAAcC,GAAAA,QAAQF,CAAI,EAAEjB,QAAQ,eAAgBkB,CAAK,CAAA,CAE7D,CAEO,MAAME,GAAWA,CAAC,CACvBpD,SAAU6C,EACVQ,UAAAA,EACAC,SAAAA,EAAW,GACXC,aAAAA,EACAC,WAAAA,EAAa,mBACbhC,MAAAA,EACAiC,aAAAA,EACAC,kBAAAA,EAAoB,SACpBC,cAAAA,EACAC,QAAAA,EAAU,UACV,GAAG7D,EACU,IAAM,CACnB,MAAM8D,EAAmBjB,GAAuBC,CAAa,EACvD,CAAEF,aAAAA,GAAcmB,SAAAA,EAAU3C,MAAAA,EAAO,GAAG4C,EAAAA,EAAoBF,EAAiB9D,MACzEiE,EAAcC,EAAAA,oBAAoBF,EAAe,EACjD,CAAEV,UAAWa,GAAiB,GAAGC,EAAAA,EAAsBH,EACvDI,EAAYC,EAAAA,OAA0B,IAAI,EAC1CC,EAAeD,EAAAA,OAAuB,IAAI,EAC1CE,EAAUC,EAAAA,MAAAA,EACVC,EAAkBJ,EAAAA,OAA0B,IAAI,EAChDK,EAAYL,EAAAA,OAAyB,IAAI,EACzCzD,EAAUH,EAAeoD,EAAiB7D,QAAQ,EAClD2E,EAAexD,GAAS,KACxByD,EAAelC,GAAgB9B,EAASO,EAAOwB,EAAY,EAC3D,CAACkC,EAAeC,CAAgB,EAAIC,EAAAA,SAAS,IAAMH,CAAY,EAC/D,CAACI,EAAQC,CAAS,EAAIF,EAAAA,SAAS,EAAK,EACpC,CAACpD,EAAOuD,CAAQ,EAAIH,EAAAA,SAAS,EAAE,EAC/BvC,EAAgBmC,EAAelF,OAAO0B,CAAK,EAAI0D,EAC/CM,EAAa,CACjBC,QAASC,EAAAA,aAAa,qCAAqC,EAC3DC,MAAOD,EAAAA,aAAa,gBAAiB,OAAO,CAAA,EAExCE,EAAoB3B,IAAY,UAAYuB,EAAWG,MAAQH,EAAWC,QAC1EI,EAAgBjD,GAAiB3B,EAAS4B,CAAa,EACvDiD,GAAkBzC,EAAgB,UAAWuC,CAAiB,EAC9DG,GAAiB1C,EAAgB,SAAUuC,CAAiB,EAC5DI,EAAkBzD,GAActB,EAASe,CAAK,EAC9CiE,EAAcjE,EAAMT,KAAAA,EACpB2E,EAAkBxE,GACtBiC,GAAYC,GAAgBqC,GAAerC,EAAauC,QAAQF,CAAW,GAEvEG,GAAevE,GAASoC,IAAY,SAAWoC,EAAAA,kBAAkBxE,CAAK,EAAIA,EAC1EyE,EAAwB3D,GACvBA,GAGHmB,GAAAA,YAAAA,EAAe,CACb/C,WAAY4B,EAAO5B,WACnBwF,WAAY5D,EAAOnB,QAAUqB,EAC7BhB,MAAOc,EAAOd,MACdP,KAAMqB,EAAOrB,KACbE,MAAOmB,EAAOnB,KAAAA,KACVmB,EAAOd,MATK,mBAatB2E,EAAAA,UAAU,IAAM,CACV,CAACxB,GAAgB,CAAC/D,EAAQwF,KAAM9D,GAAWA,EAAOnB,QAAU0D,CAAa,GAC3EC,EAAiBF,CAAY,CAEjC,EAAG,CAACA,EAAcC,EAAeF,EAAc/D,CAAO,CAAC,EAEvDuF,EAAAA,UAAU,IAAM,OACd,GAAI,CAACnB,EAAQ,CACXE,EAAS,EAAE,EACX,MACF,EAEAR,EAAAA,EAAU2B,UAAV3B,MAAAA,EAAmB4B,OACrB,EAAG,CAACtB,CAAM,CAAC,EAEXmB,EAAAA,UAAU,IAAM,CACd,GAAI,CAACnB,EACH,OAGF,MAAMuB,EAAqBC,GAAsB,QAC1ClC,EAAAA,EAAa+B,UAAb/B,MAAAA,EAAsBmC,SAASD,EAAME,SACxCzB,EAAU,EAAK,CAEnB,EAEA0B,gBAASC,iBAAiB,YAAaL,CAAiB,EAEjD,IAAM,CACXI,SAASE,oBAAoB,YAAaN,CAAiB,CAC7D,CACF,EAAG,CAACvB,CAAM,CAAC,EAEX,MAAM8B,GAAsBN,GAAgD,CACrE7B,GACHG,EAAiB0B,EAAME,OAAOvF,KAAK,EAGrC2C,GAAAA,MAAAA,EAAW0C,EACb,EAEMO,EAAYA,IAAM,OACtB9B,EAAU,EAAK,EACV3B,IACHc,EAAAA,EAAUiC,UAAVjC,MAAAA,EAAmBkC,OAEvB,EAEMU,EAA4BA,IAAM,OACtC9B,EAAS,EAAE,EACXD,EAAU,EAAI,GACdP,EAAAA,EAAU2B,UAAV3B,MAAAA,EAAmB4B,OACrB,EAEMW,EAAoBA,IAAM,CAC1B,CAAC1D,GAAgB,CAACsC,IAEtBtC,EAAa2D,SAAStB,CAAW,EACjCoB,EAAAA,EACF,EAEMG,GAAeC,GAAsB,OACpCzC,GACHG,EAAiBsC,CAAS,EAG5B,MAAMC,EAAe5C,EAAgB4B,QAErC,GAAI,CAACgB,EAAc,CACjBN,EAAAA,EACA,MACF,CAEA,MAAMO,GAAcC,EAAAA,OAAOC,yBAAyBC,kBAAkBC,UAAW,OAAO,IAApEH,YAAAA,EAAuEI,IAE3FL,GAAAA,MAAAA,EAAaM,KAAKP,EAAcD,GAChCC,EAAaQ,cAAc,IAAIC,MAAM,SAAU,CAAEC,QAAS,EAAA,CAAM,CAAC,EAC7DzE,EACF0D,EAAAA,EAEAD,EAAAA,CAEJ,EAEMiB,GAAiBxB,GAA+C,CAChEA,EAAMyB,MAAQ,UAChBlB,EAAAA,EAGEP,EAAMyB,MAAQ,SAAWzB,EAAME,SAAWhC,EAAU2B,SAAWR,IACjEW,EAAM0B,eAAAA,EACNjB,EAAAA,EAEJ,EAEMkB,SACH,MAAA,CACC,UAAWC,IACTC,EAAOF,SACPvE,IAAY,UAAYyE,EAAOC,OAC/B1E,IAAY,WAAayE,EAAOE,QAChClF,CACF,EACA,UAAW2E,GACX,IAAK1D,EACL,GAAIvE,GAEJ,SAAA,CAAAyI,EAAAA,IAAC,SAAA,CACC,GAAIrE,GACJ,cAAY,OACZ,UAAWiE,EAAAA,EAAGC,EAAOI,OAAQvE,EAAe,EAC5C,SAAU4C,GACV,IAAKrC,EACL,SAAU,GACV,MAAOjC,EAENqB,WAAiB7D,QAAAA,CACpB,EACCsD,EACCP,EAAAA,KAAC,MAAA,CACC,UAAWsF,EAAO/E,SAClB,QAAS,IAAA,OAAMoB,OAAAA,EAAAA,EAAU2B,UAAV3B,YAAAA,EAAmB4B,SAEjC3C,SAAAA,CAAAA,EACD6E,MAAC,SACC,oBAAkB,OAClB,gBAAexD,EACf,aAAYhB,EAAY,YAAY,GAAKxC,GAASkC,EAClD,UAAW2E,EAAO,gBAAgB,EAClC,SAAUrE,EAAY5C,SACtB,SAAWoF,GAAU,CACnBtB,EAASsB,EAAME,OAAOvF,KAAK,EAC3B8D,EAAU,EAAI,CAChB,EACA,QAAS,IAAMA,EAAU,EAAI,EAC7B,QAAS,IAAMA,EAAU,EAAI,EAC7B,YAAavB,GAAqBgF,OAClC,IAAKhE,EACL,KAAK,WACL,KAAK,OACL,MAAO/C,CAAAA,CAAM,CAAA,CAAA,CAEjB,EAEA6G,EAAAA,IAACG,EAAAA,OAAA,CACC,gBAAe3D,EACf,gBAAc,SACd,kBAAiBxD,EAAQ,GAAG+C,CAAO,IAAIA,CAAO,SAAWmE,OACzD,UAAWN,EAAAA,EAAGC,EAAOO,SAASpD,GAAAA,YAAAA,EAAejE,gBAAiB8G,EAAOvF,WAAW,EAChF,YAAWkC,EAAS,OAAS0D,OAC7B,SAAU1E,EAAY5C,SACtB,QAAS,IAAM6D,EAAW4D,GAAiB,CAACA,CAAY,EACxD,IAAKzE,EACL,MAAOqB,GACP,QAAQ,WAER,SAAA+C,MAAC,OAAA,CACC,UAAWH,EAAOpH,KAClB,GAAI,GAAGsD,CAAO,SAEb0B,SAAAA,EAAqBT,CAAa,CAAA,CACrC,CAAA,CACF,EAEDR,GACCjC,EAAAA,KAAC,MAAA,CAAI,UAAWsF,EAAOS,MACpB,SAAA,CAAA,CAACxF,GACAkF,EAAAA,IAACO,EAAAA,MAAA,CACC,aAAW,SACX,UAAWV,EAAOhG,OAClB,KAAK,SACL,SAAWmE,GAAUtB,EAASsB,EAAME,OAAOvF,KAAK,EAChD,YAAauC,EACb,IAAKgB,EACL,MAAOgB,GACP,KAAK,SACL,MAAO/D,CAAAA,CAAM,SAGhBqH,GAAAA,KAAA,CACC,aAAW,WACX,UAAWX,EAAOzH,QAEjB+E,SAAAA,CAAAA,EAAgB/F,IAAK0C,GAAW,CAC/B,MAAM4D,EAAa5D,EAAOnB,QAAUqB,EAEpC,OACEgG,EAAAA,IAAC,KAAA,CAAyD,iBAAA,WACxD,gBAACG,EAAAA,OAAA,CACC,aAAYzC,EAAa,GAAG5D,EAAOrB,IAAI,aAAeqB,EAAOrB,KAC7D,UAAWmH,EAAAA,EAAGC,EAAO/F,OAAQ4D,GAAcmC,EAAO5G,QAAQ,EAC1D,SAAUa,EAAOlB,SACjB,QAAS,IAAM+F,GAAY7E,EAAOnB,KAAK,EACvC,QAAQ,WAER,SAAA,CAAAqH,MAAC,QAAK,UAAWH,EAAOpH,KAAOgF,SAAAA,EAAqB3D,CAAM,EAAE,EAC3DA,EAAO5B,YACN8H,MAAC,QAAA,CAAM,UAAWH,EAAOY,MAAQ3G,WAAO5B,UAAAA,CAAW,CAAA,EAEvD,CAAA,EAZO,GAAG4B,EAAO5B,YAAc,MAAM,IAAI4B,EAAOnB,KAAK,EAavD,CAEJ,CAAC,EACA0E,GAAmBtC,GAClBiF,MAAC,KAAA,CACC,SAAAA,EAAAA,IAACG,SAAA,CACC,aAAYpJ,EAAYgE,EAAa2F,OAAOtD,CAAW,CAAC,GAAKA,EAC7D,UAAWyC,EAAO/F,OAClB,QAAS2E,EACT,QAAQ,WAER,eAAC,OAAA,CAAK,UAAWoB,EAAOpH,KAAOsC,SAAAA,EAAa2F,OAAOtD,CAAW,CAAA,CAAE,EAClE,EACF,EAEDD,EAAgBwD,SAAW,GAAK,CAACtD,SAC/B,KAAA,CAAG,UAAWwC,EAAOe,MAAQ5F,SAAAA,CAAAA,CAAW,CAAA,CAAA,CAE7C,CAAA,CAAA,CACF,CAAA,EAEJ,EAGF,OAAOhC,EACLuB,EAAAA,KAAC,MAAA,CAAI,UAAWqF,EAAAA,EAAGC,EAAO7G,MAAOoC,IAAY,UAAYyE,EAAO,cAAc,CAAC,EAAE,iBAAA,WAC/E,SAAA,CAAAG,EAAAA,IAAC,OAAA,CAAK,GAAIjE,EAAUwB,SAAAA,GAAa,EAChCoC,CAAAA,CAAAA,CACH,EAEAA,CAEJ"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/dropdown/options.tsx","../../../src/components/dropdown/index.tsx"],"sourcesContent":["import React, { Children, isValidElement } from 'react';\n\nimport { Select, type SelectProps } from '@/components/select';\n\ntype NativeSelectProps = Omit<React.ComponentPropsWithoutRef<'select'>, 'children' | 'multiple'> & {\n  children: React.ReactNode;\n  multiple?: false;\n};\n\ntype NativeSelectElement = React.ReactElement<NativeSelectProps, 'select'>;\ntype WrappedSelectElement = React.ReactElement<SelectProps, typeof Select>;\n\nexport type DropdownSelectElement = NativeSelectElement | WrappedSelectElement;\n\nexport type DropdownOption = {\n  disabled: boolean;\n  groupLabel?: string;\n  hidden: boolean;\n  isPlaceholder: boolean;\n  label: React.ReactNode;\n  selected: boolean;\n  text: string;\n  value: string;\n};\n\nexport type DropdownRenderOption = Pick<\n  DropdownOption,\n  'groupLabel' | 'label' | 'text' | 'value'\n> & {\n  isSelected: boolean;\n};\n\nexport function getNodeText(node: React.ReactNode): string {\n  if (typeof node === 'string' || typeof node === 'number') return String(node);\n  if (Array.isArray(node)) return node.map(getNodeText).join(' ');\n  if (isValidElement<{ children?: React.ReactNode }>(node)) return getNodeText(node.props.children);\n  return '';\n}\n\nfunction isOptionElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'option'>, 'option'> {\n  return isValidElement(node) && node.type === 'option';\n}\n\nfunction isOptGroupElement(\n  node: React.ReactNode\n): node is React.ReactElement<React.ComponentPropsWithoutRef<'optgroup'>, 'optgroup'> {\n  return isValidElement(node) && node.type === 'optgroup';\n}\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }, typeof React.Fragment> {\n  return isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction isWrappedSelectElement(node: React.ReactNode): node is WrappedSelectElement {\n  return isValidElement(node) && node.type === Select;\n}\n\nexport function extractOptions(\n  children: React.ReactNode,\n  groupLabel?: string,\n  groupDisabled = false\n): DropdownOption[] {\n  const options: DropdownOption[] = [];\n\n  Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      options.push(...extractOptions(child.props.children, groupLabel, groupDisabled));\n    } else if (isOptionElement(child)) {\n      const text = getNodeText(child.props.children).trim();\n      const value = child.props.value != null ? String(child.props.value) : text;\n      options.push({\n        disabled: groupDisabled || Boolean(child.props.disabled),\n        groupLabel,\n        hidden: Boolean(child.props.hidden),\n        isPlaceholder: Boolean(child.props.hidden && value === ''),\n        label: child.props.children,\n        selected: Boolean(child.props.selected),\n        text,\n        value,\n      });\n    } else if (isOptGroupElement(child)) {\n      options.push(\n        ...extractOptions(\n          child.props.children,\n          child.props.label,\n          groupDisabled || Boolean(child.props.disabled)\n        )\n      );\n    }\n  });\n\n  return options;\n}\n\nfunction buildWildcardMatcher(query: string) {\n  const trimmedQuery = query.trim();\n  if (!trimmedQuery) return null;\n\n  const wildcardQuery = /[*?]/.test(trimmedQuery) ? trimmedQuery : `*${trimmedQuery}*`;\n  const expression = [...wildcardQuery]\n    .map((character) => {\n      if (character === '*') return '.*';\n      if (character === '?') return '.';\n      return character.replace(/[|\\\\{}()[\\]^$+.,]/g, '\\\\$&');\n    })\n    .join('');\n\n  return new RegExp(`^${expression}$`, 'i');\n}\n\nexport function filterOptions(options: DropdownOption[], query: string) {\n  const matcher = buildWildcardMatcher(query);\n  const selectableOptions = options.filter((option) => !option.hidden && !option.isPlaceholder);\n  return matcher\n    ? selectableOptions.filter((option) =>\n        matcher.test([option.groupLabel, option.text, option.value].filter(Boolean).join(' '))\n      )\n    : selectableOptions;\n}\n\nexport function getDisplayOption(options: DropdownOption[], selectedValue: string) {\n  return (\n    options.find((option) => option.value === selectedValue) ??\n    options.find((option) => option.isPlaceholder) ??\n    options[0]\n  );\n}\n\nexport function getInitialValue(\n  options: DropdownOption[],\n  value?: NativeSelectProps['value'],\n  defaultValue?: NativeSelectProps['defaultValue']\n) {\n  if (value != null) return String(value);\n  if (defaultValue != null) return String(defaultValue);\n  return options.find((option) => option.selected)?.value ?? options[0]?.value ?? '';\n}\n\nexport function normalizeSelectElement(selectElement: DropdownSelectElement) {\n  if (isWrappedSelectElement(selectElement)) {\n    const { children, placeholder, ...props } = selectElement.props;\n    return {\n      children: (\n        <>\n          {placeholder && (\n            <option\n              hidden\n              value=''\n            >\n              {placeholder}\n            </option>\n          )}\n          {children}\n        </>\n      ),\n      props,\n    };\n  }\n\n  return { children: selectElement.props.children, props: selectElement.props };\n}\n","import cx from 'classix';\nimport React, { useEffect, useId, useRef, useState } from 'react';\n\nimport { Button } from '@/components/button';\nimport { type IconName, iconSVG } from '@/components/icon/icons';\nimport { Input } from '@/components/input';\nimport { List } from '@/components/list';\nimport { sanitizeSelectProps } from '@/components/select/sanitize-select-props';\nimport { resolveColor } from '@/utils/color';\nimport { formatInlineLabel } from '@/utils/text';\n\nimport {\n  type DropdownOption,\n  type DropdownRenderOption,\n  type DropdownSelectElement,\n  extractOptions,\n  filterOptions,\n  getDisplayOption,\n  getInitialValue,\n  getNodeText,\n  normalizeSelectElement,\n} from './options';\nimport styles from './styles.module.css';\n\nexport type { DropdownRenderOption } from './options';\n\nexport type DropdownCreateOption = {\n  isValid: (value: string) => boolean;\n  onCreate: (value: string) => void;\n  render: (value: string) => React.ReactNode;\n};\n\nexport type DropdownProps = Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> & {\n  children: DropdownSelectElement;\n  combobox?: boolean;\n  createOption?: DropdownCreateOption;\n  emptyLabel?: string;\n  label?: string;\n  renderOption?: (option: DropdownRenderOption) => React.ReactNode;\n  searchPlaceholder?: string;\n  selectedItems?: React.ReactNode;\n  variant?: 'default' | 'inline' | 'minimal';\n};\n\ntype withVars = React.CSSProperties & {\n  '--icon-svg'?: string;\n};\n\nfunction getIconWithVars(icon: IconName, color: string): withVars {\n  return {\n    '--icon-svg': iconSVG(icon).replace('currentColor', color),\n  };\n}\n\nexport const Dropdown = ({\n  children: selectElement,\n  className,\n  combobox = false,\n  createOption,\n  emptyLabel = 'No matches found',\n  label,\n  renderOption,\n  searchPlaceholder = 'Filter',\n  selectedItems,\n  variant = 'default',\n  ...props\n}: DropdownProps) => {\n  const normalizedSelect = normalizeSelectElement(selectElement);\n  const { defaultValue, onChange, value, ...restSelectProps } = normalizedSelect.props;\n  const selectProps = sanitizeSelectProps(restSelectProps);\n  const { className: selectClassName, ...nativeSelectProps } = selectProps;\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const labelId = useId();\n  const nativeSelectRef = useRef<HTMLSelectElement>(null);\n  const searchRef = useRef<HTMLInputElement>(null);\n  const options = extractOptions(normalizedSelect.children);\n  const isControlled = value != null;\n  const initialValue = getInitialValue(options, value, defaultValue);\n  const [internalValue, setInternalValue] = useState(() => initialValue);\n  const [isOpen, setIsOpen] = useState(false);\n  const [query, setQuery] = useState('');\n  const selectedValue = isControlled ? String(value) : internalValue;\n  const iconColors = {\n    default: resolveColor('--colors-semantic-content-secondary'),\n    white: resolveColor('--color-white', 'white'),\n  };\n  const dropdownIconColor = variant === 'minimal' ? iconColors.white : iconColors.default;\n  const displayOption = getDisplayOption(options, selectedValue);\n  const triggerWithVars = getIconWithVars('chevron', dropdownIconColor);\n  const filterWithVars = getIconWithVars('search', dropdownIconColor);\n  const filteredOptions = filterOptions(options, query);\n  const customValue = query.trim();\n  const canCreateOption = Boolean(\n    combobox && createOption && customValue && createOption.isValid(customValue)\n  );\n  const displayLabel = label && variant === 'inline' ? formatInlineLabel(label) : label;\n  const renderDropdownOption = (option: DropdownOption | undefined) => {\n    if (!option) return 'Select an option';\n\n    return (\n      renderOption?.({\n        groupLabel: option.groupLabel,\n        isSelected: option.value === selectedValue,\n        label: option.label,\n        text: option.text,\n        value: option.value,\n      }) ?? option.label\n    );\n  };\n\n  useEffect(() => {\n    if (!isControlled && !options.some((option) => option.value === internalValue)) {\n      setInternalValue(initialValue);\n    }\n  }, [initialValue, internalValue, isControlled, options]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      setQuery('');\n      return;\n    }\n\n    searchRef.current?.focus();\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      return;\n    }\n\n    const handlePointerDown = (event: MouseEvent) => {\n      if (!containerRef.current?.contains(event.target as Node)) {\n        setIsOpen(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handlePointerDown);\n\n    return () => {\n      document.removeEventListener('mousedown', handlePointerDown);\n    };\n  }, [isOpen]);\n\n  const handleNativeChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n    if (!isControlled) {\n      setInternalValue(event.target.value);\n    }\n\n    onChange?.(event);\n  };\n\n  const closeMenu = () => {\n    setIsOpen(false);\n    if (!combobox) {\n      buttonRef.current?.focus();\n    }\n  };\n\n  const continueComboboxSelection = () => {\n    setQuery('');\n    setIsOpen(true);\n    searchRef.current?.focus();\n  };\n\n  const commitCustomValue = () => {\n    if (!createOption || !canCreateOption) return;\n\n    createOption.onCreate(customValue);\n    continueComboboxSelection();\n  };\n\n  const commitValue = (nextValue: string) => {\n    if (!isControlled) {\n      setInternalValue(nextValue);\n    }\n\n    const nativeSelect = nativeSelectRef.current;\n\n    if (!nativeSelect) {\n      closeMenu();\n      return;\n    }\n\n    const valueSetter = Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, 'value')?.set;\n\n    valueSetter?.call(nativeSelect, nextValue);\n    nativeSelect.dispatchEvent(new Event('change', { bubbles: true }));\n    if (combobox) {\n      continueComboboxSelection();\n    } else {\n      closeMenu();\n    }\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (event.key === 'Escape') {\n      closeMenu();\n    }\n\n    if (event.key === 'Enter' && event.target === searchRef.current && canCreateOption) {\n      event.preventDefault();\n      commitCustomValue();\n    }\n  };\n\n  const dropdown = (\n    <div\n      className={cx(\n        styles.dropdown,\n        variant === 'inline' && styles.inline,\n        variant === 'minimal' && styles.minimal,\n        className\n      )}\n      onKeyDown={handleKeyDown}\n      ref={containerRef}\n      {...props}\n    >\n      <select\n        {...nativeSelectProps}\n        aria-hidden='true'\n        className={cx(styles.native, selectClassName)}\n        onChange={handleNativeChange}\n        ref={nativeSelectRef}\n        tabIndex={-1}\n        value={selectedValue}\n      >\n        {normalizedSelect.children}\n      </select>\n      {combobox ? (\n        <div\n          className={styles.combobox}\n          onClick={() => searchRef.current?.focus()}\n        >\n          {selectedItems}\n          <input\n            aria-autocomplete='list'\n            aria-expanded={isOpen}\n            aria-label={selectProps['aria-label'] ?? label ?? searchPlaceholder}\n            className={styles['combobox-input']}\n            disabled={selectProps.disabled}\n            onChange={(event) => {\n              setQuery(event.target.value);\n              setIsOpen(true);\n            }}\n            onClick={() => setIsOpen(true)}\n            onFocus={() => setIsOpen(true)}\n            placeholder={searchPlaceholder || undefined}\n            ref={searchRef}\n            role='combobox'\n            type='text'\n            value={query}\n          />\n        </div>\n      ) : (\n        <Button\n          aria-expanded={isOpen}\n          aria-haspopup='dialog'\n          aria-labelledby={label ? `${labelId} ${labelId}-value` : undefined}\n          className={cx(styles.trigger, displayOption?.isPlaceholder && styles.placeholder)}\n          data-open={isOpen ? 'true' : undefined}\n          disabled={selectProps.disabled}\n          onClick={() => setIsOpen((currentValue) => !currentValue)}\n          ref={buttonRef}\n          style={triggerWithVars}\n          variant='tertiary'\n        >\n          <span\n            className={styles.text}\n            id={`${labelId}-value`}\n          >\n            {renderDropdownOption(displayOption)}\n          </span>\n        </Button>\n      )}\n      {isOpen && (\n        <div className={styles.panel}>\n          {!combobox && (\n            <Input\n              aria-label='Filter'\n              className={styles.filter}\n              icon='search'\n              onChange={(event) => setQuery(event.target.value)}\n              placeholder={searchPlaceholder}\n              ref={searchRef}\n              style={filterWithVars}\n              type='search'\n              value={query}\n            />\n          )}\n          <List\n            aria-label='Dropdown'\n            className={styles.options}\n          >\n            {filteredOptions.map((option) => {\n              const isSelected = option.value === selectedValue;\n\n              return (\n                <li key={`${option.groupLabel ?? 'root'}-${option.value}`}>\n                  <Button\n                    aria-label={isSelected ? `${option.text}, selected` : option.text}\n                    className={cx(styles.option, isSelected && styles.selected)}\n                    disabled={option.disabled}\n                    onClick={() => commitValue(option.value)}\n                    variant='tertiary'\n                  >\n                    <span className={styles.text}>{renderDropdownOption(option)}</span>\n                    {option.groupLabel && (\n                      <small className={styles.group}>{option.groupLabel}</small>\n                    )}\n                  </Button>\n                </li>\n              );\n            })}\n            {canCreateOption && createOption && (\n              <li>\n                <Button\n                  aria-label={getNodeText(createOption.render(customValue)) || customValue}\n                  className={styles.option}\n                  onClick={commitCustomValue}\n                  variant='tertiary'\n                >\n                  <span className={styles.text}>{createOption.render(customValue)}</span>\n                </Button>\n              </li>\n            )}\n            {filteredOptions.length === 0 && !canCreateOption && (\n              <li className={styles.empty}>{emptyLabel}</li>\n            )}\n          </List>\n        </div>\n      )}\n    </div>\n  );\n\n  return label ? (\n    <div className={cx(styles.label, variant === 'inline' && styles['inline-field'])}>\n      <span id={labelId}>{displayLabel}</span>\n      {dropdown}\n    </div>\n  ) : (\n    dropdown\n  );\n};\n"],"names":["getNodeText","node","String","Array","isArray","map","join","isValidElement","props","children","isOptionElement","type","isOptGroupElement","isFragmentElement","React","Fragment","isWrappedSelectElement","Select","extractOptions","groupLabel","groupDisabled","options","Children","forEach","child","push","text","trim","value","disabled","Boolean","hidden","isPlaceholder","label","selected","buildWildcardMatcher","query","trimmedQuery","expression","test","character","replace","RegExp","filterOptions","matcher","selectableOptions","filter","option","getDisplayOption","selectedValue","find","getInitialValue","defaultValue","normalizeSelectElement","selectElement","placeholder","jsxs","getIconWithVars","icon","color","iconSVG","Dropdown","className","combobox","createOption","emptyLabel","renderOption","searchPlaceholder","selectedItems","variant","normalizedSelect","onChange","restSelectProps","selectProps","sanitizeSelectProps","selectClassName","nativeSelectProps","buttonRef","useRef","containerRef","labelId","useId","nativeSelectRef","searchRef","isControlled","initialValue","internalValue","setInternalValue","useState","isOpen","setIsOpen","setQuery","iconColors","default","resolveColor","white","dropdownIconColor","displayOption","triggerWithVars","filterWithVars","filteredOptions","customValue","canCreateOption","isValid","displayLabel","formatInlineLabel","renderDropdownOption","isSelected","useEffect","some","current","focus","handlePointerDown","event","contains","target","document","addEventListener","removeEventListener","handleNativeChange","closeMenu","continueComboboxSelection","commitCustomValue","onCreate","commitValue","nextValue","nativeSelect","valueSetter","Object","getOwnPropertyDescriptor","HTMLSelectElement","prototype","set","call","dispatchEvent","Event","bubbles","handleKeyDown","key","preventDefault","dropdown","cx","styles","inline","minimal","jsx","native","undefined","Button","trigger","currentValue","panel","Input","List","group","render","length","empty"],"mappings":"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"}

package/dist/components/dropdown/index.js

@@ -5,7 +5,7 @@ import { Button as M } from "../button/index.js";
 import { i as ye } from "../../icons-BkaMeh-J.js";
 import { f as ge, I as ve } from "../../index-DMGGDV9J.js";
 import { List as xe } from "../list/index.js";
-import { S as ke, s as we, r as ee } from "../../index-Rm3D-iwf.js";
+import { S as ke, s as we, r as ee } from "../../index-BAxpgMzb.js";
 import '../../assets/index37.css';function I(t) {
   return typeof t == "string" || typeof t == "number" ? String(t) : Array.isArray(t) ? t.map(I).join(" ") : x(t) ? I(t.props.children) : "";
 }