@acronis-platform/ui-react 4.0.0 → 4.1.0

package/dist/components/ui/toggle-group/toggle-group.js

@@ -1,47 +1,29 @@
-import { jsx as t } from "react/jsx-runtime";
-import * as s from "react";
-import { Toggle as i } from "@base-ui/react/toggle";
-import { ToggleGroup as l } from "@base-ui/react/toggle-group";
-import { cn as a } from "../../../lib/utils.js";
-const n = a(
-  "inline-flex h-9 select-none items-center justify-center gap-2 rounded-md border border-transparent bg-transparent px-3 text-sm font-medium text-[var(--ui-text-on-surface-primary)] transition-colors outline-none",
-  "not-disabled:hover:bg-[var(--ui-background-surface-hover)]",
-  "focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)]",
-  "data-pressed:bg-[var(--ui-background-surface-active)] data-pressed:text-[var(--ui-text-on-surface-primary)]",
-  "disabled:pointer-events-none disabled:opacity-50"
-), g = s.forwardRef(({ className: e, ...r }, o) => /* @__PURE__ */ t(
-  i,
-  {
-    ref: o,
-    className: a(n, e),
-    ...r
-  }
-));
-g.displayName = "Toggle";
-const m = s.forwardRef(({ className: e, ...r }, o) => /* @__PURE__ */ t(
-  l,
-  {
-    ref: o,
-    className: a(
-      "inline-flex items-center gap-1 data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch",
-      e
-    ),
-    ...r
-  }
-));
-m.displayName = "ToggleGroup";
-const c = s.forwardRef(({ className: e, ...r }, o) => /* @__PURE__ */ t(
-  i,
-  {
-    ref: o,
-    className: a(n, e),
-    ...r
-  }
-));
+"use client";
+import { cn as e } from "../../../lib/utils.js";
+import * as t from "react";
+import { jsx as n } from "react/jsx-runtime";
+import { Toggle as r } from "@base-ui/react/toggle";
+import { ToggleGroup as i } from "@base-ui/react/toggle-group";
+//#region src/components/ui/toggle-group/toggle-group.tsx
+var a = e("inline-flex h-9 select-none items-center justify-center gap-2 rounded-md border border-transparent bg-transparent px-3 text-sm font-medium text-[var(--ui-text-on-surface-primary)] transition-colors outline-none", "not-disabled:hover:bg-[var(--ui-background-surface-hover)]", "focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)]", "data-pressed:bg-[var(--ui-background-surface-active)] data-pressed:text-[var(--ui-text-on-surface-primary)]", "disabled:pointer-events-none disabled:opacity-50"), o = t.forwardRef(({ className: t, ...i }, o) => /* @__PURE__ */ n(r, {
+	ref: o,
+	className: e(a, t),
+	...i
+}));
+o.displayName = "Toggle";
+var s = t.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ n(i, {
+	ref: a,
+	className: e("inline-flex items-center gap-1 data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch", t),
+	...r
+}));
+s.displayName = "ToggleGroup";
+var c = t.forwardRef(({ className: t, ...i }, o) => /* @__PURE__ */ n(r, {
+	ref: o,
+	className: e(a, t),
+	...i
+}));
 c.displayName = "ToggleGroupItem";
-export {
-  g as Toggle,
-  m as ToggleGroup,
-  c as ToggleGroupItem
-};
-//# sourceMappingURL=toggle-group.js.map
+//#endregion
+export { o as Toggle, s as ToggleGroup, c as ToggleGroupItem };
+
+//# sourceMappingURL=toggle-group.js.map

package/dist/components/ui/toggle-group/toggle-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-group.js","sources":["../../../../src/components/ui/toggle-group/toggle-group.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Toggle as TogglePrimitive } from '@base-ui/react/toggle';\nimport { ToggleGroup as ToggleGroupPrimitive } from '@base-ui/react/toggle-group';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform`'s `toggle-group`, on Base UI's Toggle /\n// ToggleGroup. No `--ui-toggle-*` tier — semantic tokens. The shared item style is\n// transparent when idle, the hover surface on hover, and the active surface +\n// foreground when pressed (legacy's `bg-muted` hover is near-white in ui-react, so\n// hover uses the visible surface-hover and the pressed state uses surface-active so\n// it reads as selected, distinct from hover).\nconst toggleItemClassName = cn(\n  'inline-flex h-9 select-none items-center justify-center gap-2 rounded-md border border-transparent bg-transparent px-3 text-sm font-medium text-[var(--ui-text-on-surface-primary)] transition-colors outline-none',\n  'not-disabled:hover:bg-[var(--ui-background-surface-hover)]',\n  'focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)]',\n  'data-pressed:bg-[var(--ui-background-surface-active)] data-pressed:text-[var(--ui-text-on-surface-primary)]',\n  'disabled:pointer-events-none disabled:opacity-50'\n);\n\nconst Toggle = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentPropsWithoutRef<typeof TogglePrimitive>\n>(({ className, ...props }, ref) => (\n  <TogglePrimitive\n    ref={ref}\n    className={cn(toggleItemClassName, className)}\n    {...props}\n  />\n));\nToggle.displayName = 'Toggle';\n\nconst ToggleGroup = React.forwardRef<\n  React.ComponentRef<typeof ToggleGroupPrimitive>,\n  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive>\n>(({ className, ...props }, ref) => (\n  <ToggleGroupPrimitive\n    ref={ref}\n    className={cn(\n      'inline-flex items-center gap-1 data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch',\n      className\n    )}\n    {...props}\n  />\n));\nToggleGroup.displayName = 'ToggleGroup';\n\nconst ToggleGroupItem = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentPropsWithoutRef<typeof TogglePrimitive>\n>(({ className, ...props }, ref) => (\n  <TogglePrimitive\n    ref={ref}\n    className={cn(toggleItemClassName, className)}\n    {...props}\n  />\n));\nToggleGroupItem.displayName = 'ToggleGroupItem';\n\nexport { Toggle, ToggleGroup, ToggleGroupItem };\n"],"names":["toggleItemClassName","cn","Toggle","React","className","props","ref","jsx","TogglePrimitive","ToggleGroup","ToggleGroupPrimitive","ToggleGroupItem"],"mappings":";;;;;AAcA,MAAMA,IAAsBC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEMC,IAASC,EAAM,WAGnB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAACC;AAAAA,EAAA;AAAA,IACC,KAAAF;AAAA,IACA,WAAWL,EAAGD,GAAqBI,CAAS;AAAA,IAC3C,GAAGC;AAAA,EAAA;AACN,CACD;AACDH,EAAO,cAAc;AAErB,MAAMO,IAAcN,EAAM,WAGxB,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAACG;AAAAA,EAAA;AAAA,IACC,KAAAJ;AAAA,IACA,WAAWL;AAAA,MACT;AAAA,MACAG;AAAA,IAAA;AAAA,IAED,GAAGC;AAAA,EAAA;AACN,CACD;AACDI,EAAY,cAAc;AAE1B,MAAME,IAAkBR,EAAM,WAG5B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAACC;AAAAA,EAAA;AAAA,IACC,KAAAF;AAAA,IACA,WAAWL,EAAGD,GAAqBI,CAAS;AAAA,IAC3C,GAAGC;AAAA,EAAA;AACN,CACD;AACDM,EAAgB,cAAc;"}
+{"version":3,"file":"toggle-group.js","names":[],"sources":["../../../../src/components/ui/toggle-group/toggle-group.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Toggle as TogglePrimitive } from '@base-ui/react/toggle';\nimport { ToggleGroup as ToggleGroupPrimitive } from '@base-ui/react/toggle-group';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform`'s `toggle-group`, on Base UI's Toggle /\n// ToggleGroup. No `--ui-toggle-*` tier — semantic tokens. The shared item style is\n// transparent when idle, the hover surface on hover, and the active surface +\n// foreground when pressed (legacy's `bg-muted` hover is near-white in ui-react, so\n// hover uses the visible surface-hover and the pressed state uses surface-active so\n// it reads as selected, distinct from hover).\nconst toggleItemClassName = cn(\n  'inline-flex h-9 select-none items-center justify-center gap-2 rounded-md border border-transparent bg-transparent px-3 text-sm font-medium text-[var(--ui-text-on-surface-primary)] transition-colors outline-none',\n  'not-disabled:hover:bg-[var(--ui-background-surface-hover)]',\n  'focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)]',\n  'data-pressed:bg-[var(--ui-background-surface-active)] data-pressed:text-[var(--ui-text-on-surface-primary)]',\n  'disabled:pointer-events-none disabled:opacity-50'\n);\n\nconst Toggle = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentPropsWithoutRef<typeof TogglePrimitive>\n>(({ className, ...props }, ref) => (\n  <TogglePrimitive\n    ref={ref}\n    className={cn(toggleItemClassName, className)}\n    {...props}\n  />\n));\nToggle.displayName = 'Toggle';\n\nconst ToggleGroup = React.forwardRef<\n  React.ComponentRef<typeof ToggleGroupPrimitive>,\n  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive>\n>(({ className, ...props }, ref) => (\n  <ToggleGroupPrimitive\n    ref={ref}\n    className={cn(\n      'inline-flex items-center gap-1 data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch',\n      className\n    )}\n    {...props}\n  />\n));\nToggleGroup.displayName = 'ToggleGroup';\n\nconst ToggleGroupItem = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentPropsWithoutRef<typeof TogglePrimitive>\n>(({ className, ...props }, ref) => (\n  <TogglePrimitive\n    ref={ref}\n    className={cn(toggleItemClassName, className)}\n    {...props}\n  />\n));\nToggleGroupItem.displayName = 'ToggleGroupItem';\n\nexport { Toggle, ToggleGroup, ToggleGroupItem };\n"],"mappings":";;;;;;;AAcA,IAAM,IAAsB,EAC1B,sNACA,8DACA,qEACA,+GACA,kDACF,GAEM,IAAS,EAAM,YAGlB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,GAAD;CACO;CACL,WAAW,EAAG,GAAqB,CAAS;CAC5C,GAAI;AACL,CAAA,CACF;AACD,EAAO,cAAc;AAErB,IAAM,IAAc,EAAM,YAGvB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,GAAD;CACO;CACL,WAAW,EACT,iHACA,CACF;CACA,GAAI;AACL,CAAA,CACF;AACD,EAAY,cAAc;AAE1B,IAAM,IAAkB,EAAM,YAG3B,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,GAAD;CACO;CACL,WAAW,EAAG,GAAqB,CAAS;CAC5C,GAAI;AACL,CAAA,CACF;AACD,EAAgB,cAAc"}

package/dist/components/ui/toolbar/toolbar.js

@@ -1,204 +1,131 @@
-import { jsx as l, jsxs as C } from "react/jsx-runtime";
-import * as i from "react";
-import { Toolbar as R } from "@base-ui/react/toolbar";
-import { cn as T } from "../../../lib/utils.js";
-import { Button as E } from "../button/button.js";
-import { DropdownMenu as _, DropdownMenuTrigger as F, DropdownMenuContent as I, DropdownMenuItem as P } from "../dropdown-menu/dropdown-menu.js";
-import { ButtonMenu as A } from "../button-menu/button-menu.js";
-const k = i.createContext(!1), j = i.forwardRef(
-  ({ className: r, disabled: t, ...n }, c) => /* @__PURE__ */ l(k.Provider, { value: !!t, children: /* @__PURE__ */ l(
-    "fieldset",
-    {
-      ref: c,
-      className: T(
-        "m-0 flex min-w-0 items-center gap-4 border-0 p-0",
-        r
-      ),
-      disabled: t,
-      ...n
-    }
-  ) })
-);
-j.displayName = "Toolbar";
-const X = i.forwardRef(
-  ({ className: r, ...t }, n) => /* @__PURE__ */ l(
-    "div",
-    {
-      ref: n,
-      className: T(
-        "flex grow shrink-0 items-center justify-end gap-2 whitespace-nowrap",
-        r
-      ),
-      ...t
-    }
-  )
-);
-X.displayName = "ToolbarActions";
-const M = 16;
-function G(r, t, n, c) {
-  const d = r.length;
-  if (d === 0) return 0;
-  if (r.reduce((u, p) => u + p, 0) + n * (d - 1) <= c) return d;
-  let o = t, s = 0;
-  for (let u = 0; u < d; u++) {
-    const p = o + r[u] + n;
-    if (p > c) break;
-    o = p, s++;
-  }
-  return s;
+import { cn as e } from "../../../lib/utils.js";
+import { Button as t } from "../button/button.js";
+import { ButtonMenu as n } from "../button-menu/button-menu.js";
+import { DropdownMenu as r, DropdownMenuContent as i, DropdownMenuItem as a, DropdownMenuTrigger as o } from "../dropdown-menu/dropdown-menu.js";
+import * as s from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Toolbar as u } from "@base-ui/react/toolbar";
+//#region src/components/ui/toolbar/toolbar.tsx
+var d = s.createContext(!1), f = s.forwardRef(({ className: t, disabled: n, ...r }, i) => /* @__PURE__ */ c(d.Provider, {
+	value: !!n,
+	children: /* @__PURE__ */ c("fieldset", {
+		ref: i,
+		className: e("m-0 flex min-w-0 items-center gap-4 border-0 p-0", t),
+		disabled: n,
+		...r
+	})
+}));
+f.displayName = "Toolbar";
+var p = s.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ c("div", {
+	ref: r,
+	className: e("flex grow shrink-0 items-center justify-end gap-2 whitespace-nowrap", t),
+	...n
+}));
+p.displayName = "ToolbarActions";
+var m = 16;
+function h(e, t, n, r) {
+	let i = e.length;
+	if (i === 0) return 0;
+	if (e.reduce((e, t) => e + t, 0) + n * (i - 1) <= r) return i;
+	let a = t, o = 0;
+	for (let t = 0; t < i; t++) {
+		let i = a + e[t] + n;
+		if (i > r) break;
+		a = i, o++;
+	}
+	return o;
 }
-function V(r) {
-  const t = Array.from(r.childNodes).filter(
-    (o) => {
-      var s;
-      return o.nodeType === Node.ELEMENT_NODE || o.nodeType === Node.TEXT_NODE && !!((s = o.textContent) != null && s.trim());
-    }
-  );
-  if (t.length === 0) return r.getBoundingClientRect().width;
-  const n = getComputedStyle(r), c = parseFloat(n.columnGap) || 0, d = (parseFloat(n.paddingLeft) || 0) + (parseFloat(n.paddingRight) || 0) + (parseFloat(n.borderLeftWidth) || 0) + (parseFloat(n.borderRightWidth) || 0);
-  return t.map((o) => {
-    if (o.nodeType === Node.TEXT_NODE) {
-      const s = document.createRange();
-      return s.selectNodeContents(o), s.getBoundingClientRect().width;
-    }
-    return o.getBoundingClientRect().width;
-  }).reduce((o, s) => o + s, 0) + c * (t.length - 1) + d;
+function g(e) {
+	let t = Array.from(e.childNodes).filter((e) => e.nodeType === Node.ELEMENT_NODE || e.nodeType === Node.TEXT_NODE && !!e.textContent?.trim());
+	if (t.length === 0) return e.getBoundingClientRect().width;
+	let n = getComputedStyle(e), r = parseFloat(n.columnGap) || 0, i = (parseFloat(n.paddingLeft) || 0) + (parseFloat(n.paddingRight) || 0) + (parseFloat(n.borderLeftWidth) || 0) + (parseFloat(n.borderRightWidth) || 0);
+	return t.map((e) => {
+		if (e.nodeType === Node.TEXT_NODE) {
+			let t = document.createRange();
+			return t.selectNodeContents(e), t.getBoundingClientRect().width;
+		}
+		return e.getBoundingClientRect().width;
+	}).reduce((e, t) => e + t, 0) + r * (t.length - 1) + i;
 }
-function z(...r) {
-  return (t) => {
-    for (const n of r)
-      n && (typeof n == "function" ? n(t) : n.current = t);
-  };
+function _(...e) {
+	return (t) => {
+		for (let n of e) n && (typeof n == "function" ? n(t) : n.current = t);
+	};
 }
-const $ = i.forwardRef(
-  ({ className: r, actions: t, moreActionsLabel: n = "More actions", ...c }, d) => {
-    const f = i.useRef(null), o = i.useRef(
-      /* @__PURE__ */ new Map()
-    ), s = i.useRef(null), [u, p] = i.useState(t.length), [B, v] = i.useState(!1), m = i.useContext(k), D = B && !m;
-    i.useEffect(() => {
-      m && v(!1);
-    }, [m]);
-    const y = i.useCallback(() => {
-      var x;
-      const e = f.current, a = e == null ? void 0 : e.parentElement;
-      if (!e || !a) return;
-      const g = Array.from(a.children).filter((h) => h !== e).reduce((h, w) => h + V(w), 0), b = Math.max(a.children.length - 1, 0), W = a.clientWidth - g - M * b, L = t.map(
-        (h) => {
-          var w;
-          return ((w = o.current.get(h.key)) == null ? void 0 : w.getBoundingClientRect().width) ?? 0;
-        }
-      ), S = ((x = s.current) == null ? void 0 : x.getBoundingClientRect().width) ?? 0;
-      p(
-        G(
-          L,
-          S,
-          M,
-          W
-        )
-      );
-    }, [t]);
-    i.useLayoutEffect(() => {
-      var g;
-      y();
-      const e = (g = f.current) == null ? void 0 : g.parentElement;
-      if (!e) return;
-      const a = new ResizeObserver(y);
-      return a.observe(e), Array.from(e.children).forEach((b) => {
-        b !== f.current && a.observe(b);
-      }), () => a.disconnect();
-    }, [y, t]);
-    const O = t.slice(0, u), N = t.slice(u);
-    return /* @__PURE__ */ C(
-      R.Root,
-      {
-        ref: z(f, d),
-        className: T(
-          // `overflow-hidden` clips the invisible measurement clone below —
-          // it's `position: absolute` + `visibility: hidden`, which keeps
-          // contributing to this element's scrollable overflow (and thus a
-          // real horizontal scrollbar on a narrow container/page) unless
-          // something in the ancestor chain clips it. Visible content is
-          // already sized to fit `availableWidth` by the collapse math, so
-          // clipping never affects anything actually shown.
-          "relative flex min-w-0 flex-nowrap items-center gap-4 overflow-hidden",
-          r
-        ),
-        ...c,
-        children: [
-          O.map((e) => /* @__PURE__ */ l(
-            R.Button,
-            {
-              disabled: e.disabled,
-              focusableWhenDisabled: !e.disabled,
-              onClick: e.onSelect,
-              render: /* @__PURE__ */ l(E, { variant: "ghost", children: e.label })
-            },
-            e.key
-          )),
-          N.length > 0 && /* @__PURE__ */ C(
-            _,
-            {
-              open: D,
-              onOpenChange: v,
-              disabled: m,
-              children: [
-                /* @__PURE__ */ l(
-                  R.Button,
-                  {
-                    render: /* @__PURE__ */ l(
-                      F,
-                      {
-                        render: /* @__PURE__ */ l(A, { variant: "secondary", children: n })
-                      }
-                    )
-                  }
-                ),
-                /* @__PURE__ */ l(I, { align: "start", children: N.map((e) => /* @__PURE__ */ l(
-                  P,
-                  {
-                    disabled: e.disabled || m,
-                    onClick: e.onSelect,
-                    children: e.label
-                  },
-                  e.key
-                )) })
-              ]
-            }
-          ),
-          /* @__PURE__ */ C(
-            "div",
-            {
-              "aria-hidden": !0,
-              inert: !0,
-              className: "pointer-events-none invisible absolute start-0 top-0 flex items-center gap-4",
-              children: [
-                t.map((e) => /* @__PURE__ */ l(
-                  E,
-                  {
-                    ref: (a) => {
-                      o.current.set(e.key, a);
-                    },
-                    variant: "ghost",
-                    tabIndex: -1,
-                    children: e.label
-                  },
-                  e.key
-                )),
-                /* @__PURE__ */ l(A, { ref: s, variant: "secondary", tabIndex: -1, children: n })
-              ]
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-$.displayName = "ToolbarActionList";
-export {
-  j as Toolbar,
-  $ as ToolbarActionList,
-  X as ToolbarActions,
-  G as computeVisibleActionCount,
-  V as measureNaturalWidth
-};
-//# sourceMappingURL=toolbar.js.map
+var v = s.forwardRef(({ className: f, actions: p, moreActionsLabel: v = "More actions", ...y }, b) => {
+	let x = s.useRef(null), S = s.useRef(/* @__PURE__ */ new Map()), C = s.useRef(null), [w, T] = s.useState(p.length), [E, D] = s.useState(!1), O = s.useContext(d), k = E && !O;
+	s.useEffect(() => {
+		O && D(!1);
+	}, [O]);
+	let A = s.useCallback(() => {
+		let e = x.current, t = e?.parentElement;
+		if (!e || !t) return;
+		let n = Array.from(t.children).filter((t) => t !== e).reduce((e, t) => e + g(t), 0), r = Math.max(t.children.length - 1, 0), i = t.clientWidth - n - m * r, a = p.map((e) => S.current.get(e.key)?.getBoundingClientRect().width ?? 0), o = C.current?.getBoundingClientRect().width ?? 0;
+		T(h(a, o, m, i));
+	}, [p]);
+	s.useLayoutEffect(() => {
+		A();
+		let e = x.current?.parentElement;
+		if (!e) return;
+		let t = new ResizeObserver(A);
+		return t.observe(e), Array.from(e.children).forEach((e) => {
+			e !== x.current && t.observe(e);
+		}), () => t.disconnect();
+	}, [A, p]);
+	let j = p.slice(0, w), M = p.slice(w);
+	return /* @__PURE__ */ l(u.Root, {
+		ref: _(x, b),
+		className: e("relative flex min-w-0 flex-nowrap items-center gap-4 overflow-hidden", f),
+		...y,
+		children: [
+			j.map((e) => /* @__PURE__ */ c(u.Button, {
+				disabled: e.disabled,
+				focusableWhenDisabled: !e.disabled,
+				onClick: e.onSelect,
+				render: /* @__PURE__ */ c(t, {
+					variant: "ghost",
+					children: e.label
+				})
+			}, e.key)),
+			M.length > 0 && /* @__PURE__ */ l(r, {
+				open: k,
+				onOpenChange: D,
+				disabled: O,
+				children: [/* @__PURE__ */ c(u.Button, { render: /* @__PURE__ */ c(o, { render: /* @__PURE__ */ c(n, {
+					variant: "secondary",
+					children: v
+				}) }) }), /* @__PURE__ */ c(i, {
+					align: "start",
+					children: M.map((e) => /* @__PURE__ */ c(a, {
+						disabled: e.disabled || O,
+						onClick: e.onSelect,
+						children: e.label
+					}, e.key))
+				})]
+			}),
+			/* @__PURE__ */ l("div", {
+				"aria-hidden": !0,
+				inert: !0,
+				className: "pointer-events-none invisible absolute start-0 top-0 flex items-center gap-4",
+				children: [p.map((e) => /* @__PURE__ */ c(t, {
+					ref: (t) => {
+						S.current.set(e.key, t);
+					},
+					variant: "ghost",
+					tabIndex: -1,
+					children: e.label
+				}, e.key)), /* @__PURE__ */ c(n, {
+					ref: C,
+					variant: "secondary",
+					tabIndex: -1,
+					children: v
+				})]
+			})
+		]
+	});
+});
+v.displayName = "ToolbarActionList";
+//#endregion
+export { f as Toolbar, v as ToolbarActionList, p as ToolbarActions, h as computeVisibleActionCount, g as measureNaturalWidth };
+
+//# sourceMappingURL=toolbar.js.map

package/dist/components/ui/toolbar/toolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"toolbar.js","sources":["../../../../src/components/ui/toolbar/toolbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Toolbar as ToolbarPrimitive } from '@base-ui/react/toolbar';\n\nimport { cn } from '@/lib/utils';\nimport { Button } from '../button';\nimport { ButtonMenu } from '../button-menu';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from '../dropdown-menu';\n\n// Mirrors the Figma \"Toolbar\" component (node 3897:7199): a horizontal action\n// row — list actions, an optional overflow control (e.g. a `ButtonMenu`), and\n// an optional trailing area (`ToolbarActions`: a status text or a selection\n// counter + action) — typically shown above/below a list or table when rows\n// are selected or bulk actions are available. Every action is an existing\n// `Button`/`ButtonMenu` instance in Figma, so this component only lays them\n// out and carries no dedicated `--ui-toolbar-*` token tier; the 16px\n// inter-item gap is the Figma `gap/gap-16` semantic token, left un-tokenized —\n// same precedent as `FilterSearch`'s identical gap.\n//\n// The Figma `state: active | disabled` variant is the native `disabled`\n// attribute here: the root renders as a `<fieldset>` (reset to look like a\n// flex row) so every nested `Button`/`ButtonMenu` disables via the platform's\n// own fieldset-disables-descendants behavior — no prop-drilling into\n// arbitrary children required.\n//\n// `min-w-0` is required, not cosmetic: browsers give `<fieldset>` an\n// intrinsic `min-width: min-content` that Tailwind's reset doesn't touch, so\n// without it the fieldset refuses to shrink below its content's natural\n// width. `ToolbarActionList`'s collapse math reads this fieldset's own\n// `clientWidth` as \"available space\" — without `min-w-0` the fieldset\n// balloons to fit every action before that measurement ever runs, so it\n// always measures \"everything fits\" and the row never collapses.\n\n// The fieldset cascade only reaches descendants, so anything a nested part\n// renders in a portal (see `ToolbarActionList`'s overflow menu) has to learn\n// the disabled state another way. This carries it in React, deliberately\n// rather than reading the fieldset's `disabled` attribute back out of the DOM:\n// an out-of-React side channel (a MutationObserver on the attribute) resolves\n// one render *after* the fact, so the portal renders enabled for a beat, and\n// its `setState` lands outside React's own scheduling — which under React 19's\n// act environment is intermittently never flushed at all, leaving the portal\n// enabled forever.\nconst ToolbarDisabledContext = React.createContext(false);\n\nexport type ToolbarProps = React.ComponentPropsWithoutRef<'fieldset'>;\n\nconst Toolbar = React.forwardRef<HTMLFieldSetElement, ToolbarProps>(\n  ({ className, disabled, ...props }, ref) => (\n    <ToolbarDisabledContext.Provider value={!!disabled}>\n      <fieldset\n        ref={ref}\n        className={cn(\n          'm-0 flex min-w-0 items-center gap-4 border-0 p-0',\n          className\n        )}\n        disabled={disabled}\n        {...props}\n      />\n    </ToolbarDisabledContext.Provider>\n  )\n);\nToolbar.displayName = 'Toolbar';\n\n// Trailing, right-aligned area — a status text (e.g. \"25 of 1250 items\n// loaded\") or a selection counter + action (e.g. \"6 items selected: Deselect\").\n// 8px inter-child gap matches the Figma Counter part's own gap. `whitespace-nowrap`\n// is required, not cosmetic: the Figma \"Counter\" part is always single-line, but a\n// plain-text child (e.g. a `<span>`) defaults to `white-space: normal` — without\n// this, the text wraps mid-phrase once the row shrinks below its content's natural\n// width (`white-space` is inherited, so it cascades to children without them\n// needing their own override).\n//\n// `grow shrink-0` (not `flex-1`, which also shrinks): this area must grow to fill\n// leftover space so `justify-end` can right-align it, but must never shrink below\n// its own content's natural width. `ToolbarActionList`'s auto-collapse math reads\n// this element's *rendered* width as the space it needs to reserve — if it could\n// shrink, that measurement would be a moving target (less room reserved than the\n// content actually needs), so the actions row would under-collapse and this area's\n// (nowrap, unshrinkable) content would overflow past its own box instead.\nexport type ToolbarActionsProps = React.ComponentPropsWithoutRef<'div'>;\n\nconst ToolbarActions = React.forwardRef<HTMLDivElement, ToolbarActionsProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={cn(\n        'flex grow shrink-0 items-center justify-end gap-2 whitespace-nowrap',\n        className\n      )}\n      {...props}\n    />\n  )\n);\nToolbarActions.displayName = 'ToolbarActions';\n\n// Matches the `gap-4` utility used on both this component's row and\n// Toolbar's own root — keep in sync if either class changes.\nconst ACTION_LIST_GAP_PX = 16;\n\n// Pure so the collapse math is unit-testable without mocking layout/ResizeObserver.\n// Greedily fits as many leading items as possible into `availableWidth`; the\n// instant not everything fits, reserves `moreWidth` (+ one gap) for the\n// overflow trigger before fitting items.\nexport function computeVisibleActionCount(\n  itemWidths: number[],\n  moreWidth: number,\n  gap: number,\n  availableWidth: number\n): number {\n  const total = itemWidths.length;\n  if (total === 0) return 0;\n\n  const fullWidth =\n    itemWidths.reduce((sum, width) => sum + width, 0) + gap * (total - 1);\n  if (fullWidth <= availableWidth) return total;\n\n  let used = moreWidth;\n  let count = 0;\n  for (let i = 0; i < total; i++) {\n    const next = used + itemWidths[i] + gap;\n    if (next > availableWidth) break;\n    used = next;\n    count++;\n  }\n  return count;\n}\n\n// A grown sibling's own `getBoundingClientRect()` reflects its flex-grown\n// box, not the space its content actually needs — reading that would make\n// `measure()`'s \"available space\" calculation self-referential (see below),\n// so this reads the sibling's *content nodes* instead: normal (non-growing)\n// flex children report their natural width regardless of how large the\n// parent's box has grown to fill leftover row space. Bare text (e.g.\n// `<ToolbarActions>25 selected</ToolbarActions>` with no wrapping element)\n// renders as a `Text` node rather than an `Element`, so `children` alone\n// would miss it and fall through to the self-referential branch this\n// function exists to avoid — a `Range` measures that text's own rendered\n// width the same way `getBoundingClientRect()` does for an element.\n//\n// The sibling's own padding/border don't grow with flex-grow (only the free\n// space between content and box edge does), so they're safe to add back on\n// top of the content sum — unlike the box's own `getBoundingClientRect()`,\n// which is self-referential.\n//\n// Exported (like `computeVisibleActionCount`) so this is unit-testable\n// without mocking layout/ResizeObserver.\nexport function measureNaturalWidth(el: Element): number {\n  const nodes = Array.from(el.childNodes).filter(\n    (node): node is ChildNode =>\n      node.nodeType === Node.ELEMENT_NODE ||\n      (node.nodeType === Node.TEXT_NODE && !!node.textContent?.trim())\n  );\n  if (nodes.length === 0) return el.getBoundingClientRect().width;\n\n  const style = getComputedStyle(el);\n  const gap = parseFloat(style.columnGap) || 0;\n  const ownPaddingAndBorder =\n    (parseFloat(style.paddingLeft) || 0) +\n    (parseFloat(style.paddingRight) || 0) +\n    (parseFloat(style.borderLeftWidth) || 0) +\n    (parseFloat(style.borderRightWidth) || 0);\n  const widths = nodes.map((node) => {\n    if (node.nodeType === Node.TEXT_NODE) {\n      const range = document.createRange();\n      range.selectNodeContents(node);\n      return range.getBoundingClientRect().width;\n    }\n    return (node as Element).getBoundingClientRect().width;\n  });\n\n  return (\n    widths.reduce((sum, width) => sum + width, 0) +\n    gap * (nodes.length - 1) +\n    ownPaddingAndBorder\n  );\n}\n\nfunction mergeRefs<T>(\n  ...refs: Array<React.Ref<T> | undefined>\n): React.RefCallback<T> {\n  return (node) => {\n    for (const ref of refs) {\n      if (!ref) continue;\n      if (typeof ref === 'function') ref(node);\n      else (ref as React.RefObject<T | null>).current = node;\n    }\n  };\n}\n\nexport interface ToolbarActionListItem {\n  /** Stable identity — used as the React key in both the row and the overflow menu. */\n  key: string;\n  /** Rendered as the visible ghost Button's label, and the overflow menu item's label. */\n  label: React.ReactNode;\n  onSelect?: () => void;\n  disabled?: boolean;\n}\n\nexport interface ToolbarActionListProps\n  extends Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> {\n  /** Ordered list of actions; trailing ones collapse into \"More actions\" first. */\n  actions: ToolbarActionListItem[];\n  /** Label for the overflow trigger. */\n  moreActionsLabel?: React.ReactNode;\n}\n\n// Mirrors the Figma \"ListActions\" part, but drives its `hasMoreActions`\n// overflow menu from measured available width instead of a static boolean —\n// the breakpoints spec (node 6262:28276) requires that \"if there is no space\n// for all Toolbar actions, then last actions must be hidden under More\n// actions.\" Renders every action as a ghost Button until they no longer fit\n// the row, then moves the trailing ones into a ButtonMenu + DropdownMenu\n// (same trigger Figma's `hasMoreActions` variant shows). An invisible clone\n// of every action + the trigger is kept mounted purely to measure natural\n// widths, since a hidden item can't report its own size.\n//\n// The root and each visible action/trigger are Base UI's `Toolbar.Root`/\n// `Toolbar.Button` (`@base-ui/react/toolbar`), giving the row the WAI-ARIA\n// toolbar pattern for free: one Tab stop, arrow-key roving-tabindex between\n// actions and into the overflow trigger. Base UI's `Toolbar.Root` does not\n// forward `enableHomeAndEndKeys` to its underlying composite, so Home/End\n// are not supported here — this is a Base UI limitation, not a choice made\n// in this component. `Toolbar.Button` composes\n// via `render` the same way `DropdownMenuTrigger`/`ButtonMenu` already do\n// below — it merges its own composite/keydown/disabled props onto whatever\n// element you pass. `focusableWhenDisabled={!action.disabled}` opts a\n// disabled action out of Base UI's default APG toolbar treatment (disabled\n// items normally stay focusable via `aria-disabled`, skippable with Tab) so\n// it matches every other disabled `Button` in this library: a real native\n// `disabled` button, unreachable via Tab or arrow keys. This MUST stay\n// conditional on `action.disabled` — `Toolbar.Root` builds its\n// `disabledIndices` list from `focusableWhenDisabled` alone, regardless of\n// the item's actual disabled state, so passing a bare `false` here disables\n// every index and silently breaks arrow-key navigation for the whole row.\n//\n// The invisible measurement clones stay plain `Button`/`ButtonMenu` (not\n// `Toolbar.Button`): registering them too would double-count hidden items in\n// the roving-tabindex list. This is scoped to the action list only —\n// `Toolbar`'s own `<fieldset>` disabled-cascade (see above) is\n// intentionally untouched; Base UI's `Fieldset.Root` strips the native\n// `disabled` attribute in favor of a context other Base UI Field-aware\n// components consume, which `Button`/`ButtonMenu` don't, so it would silently\n// break the \"disabling the toolbar disables every nested control\" guarantee.\nconst ToolbarActionList = React.forwardRef<\n  HTMLDivElement,\n  ToolbarActionListProps\n>(\n  (\n    { className, actions, moreActionsLabel = 'More actions', ...props },\n    forwardedRef\n  ) => {\n    const containerRef = React.useRef<HTMLDivElement>(null);\n    const itemRefs = React.useRef<Map<string, HTMLButtonElement | null>>(\n      new Map()\n    );\n    const moreRef = React.useRef<HTMLButtonElement>(null);\n    const [visibleCount, setVisibleCount] = React.useState(actions.length);\n    const [moreMenuOpen, setMoreMenuOpen] = React.useState(false);\n    // The overflow menu renders in a portal, outside the ancestor\n    // `<fieldset>`'s DOM subtree, so the native disabled-cascade (see\n    // `Toolbar` above) never reaches its items — they read the state off\n    // context instead, so a menu already open when the toolbar becomes\n    // disabled gets closed, and its items stay disabled even if forced open\n    // again (e.g. via a ref).\n    const ancestorDisabled = React.useContext(ToolbarDisabledContext);\n\n    // Gating the `open` prop (rather than only resetting the state below)\n    // closes the menu in the very commit the toolbar becomes disabled — an\n    // effect would leave it open for one frame.\n    const menuOpen = moreMenuOpen && !ancestorDisabled;\n\n    // Still clear the stored state, or re-enabling the toolbar would pop the\n    // menu back open on its own.\n    React.useEffect(() => {\n      if (ancestorDisabled) setMoreMenuOpen(false);\n    }, [ancestorDisabled]);\n\n    const measure = React.useCallback(() => {\n      const container = containerRef.current;\n      const parent = container?.parentElement;\n      if (!container || !parent) return;\n\n      const siblingsWidth = Array.from(parent.children)\n        .filter((child) => child !== container)\n        .reduce((sum, el) => sum + measureNaturalWidth(el), 0);\n      const gapCount = Math.max(parent.children.length - 1, 0);\n      const available =\n        parent.clientWidth - siblingsWidth - ACTION_LIST_GAP_PX * gapCount;\n\n      // Keyed by `action.key`, not index — an index-keyed array would keep\n      // stale entries (and a stale length) when `actions` shrinks, since\n      // React only nulls out the removed clones' refs without truncating it.\n      const itemWidths = actions.map(\n        (action) =>\n          itemRefs.current.get(action.key)?.getBoundingClientRect().width ?? 0\n      );\n      const moreWidth = moreRef.current?.getBoundingClientRect().width ?? 0;\n\n      setVisibleCount(\n        computeVisibleActionCount(\n          itemWidths,\n          moreWidth,\n          ACTION_LIST_GAP_PX,\n          available\n        )\n      );\n    }, [actions]);\n\n    React.useLayoutEffect(() => {\n      measure();\n      const parent = containerRef.current?.parentElement;\n      if (!parent) return;\n      const observer = new ResizeObserver(measure);\n      observer.observe(parent);\n      // A sibling like `ToolbarActions` is `shrink-0`, so its own border-box\n      // grows with its content (e.g. a \"6 items selected\" counter ticking\n      // up) even while `parent`'s box stays fixed — a ResizeObserver bound\n      // only to `parent` never fires for that case, so `measure()` goes\n      // stale and the row silently overflows instead of collapsing further.\n      // Observing every sibling directly catches that box-size change too.\n      Array.from(parent.children).forEach((sibling) => {\n        if (sibling !== containerRef.current) observer.observe(sibling);\n      });\n      return () => observer.disconnect();\n    }, [measure, actions]);\n\n    const visibleActions = actions.slice(0, visibleCount);\n    const hiddenActions = actions.slice(visibleCount);\n\n    return (\n      <ToolbarPrimitive.Root\n        ref={mergeRefs(containerRef, forwardedRef)}\n        className={cn(\n          // `overflow-hidden` clips the invisible measurement clone below —\n          // it's `position: absolute` + `visibility: hidden`, which keeps\n          // contributing to this element's scrollable overflow (and thus a\n          // real horizontal scrollbar on a narrow container/page) unless\n          // something in the ancestor chain clips it. Visible content is\n          // already sized to fit `availableWidth` by the collapse math, so\n          // clipping never affects anything actually shown.\n          'relative flex min-w-0 flex-nowrap items-center gap-4 overflow-hidden',\n          className\n        )}\n        {...props}\n      >\n        {visibleActions.map((action) => (\n          <ToolbarPrimitive.Button\n            key={action.key}\n            disabled={action.disabled}\n            focusableWhenDisabled={!action.disabled}\n            onClick={action.onSelect}\n            render={<Button variant=\"ghost\">{action.label}</Button>}\n          />\n        ))}\n        {hiddenActions.length > 0 && (\n          <DropdownMenu\n            open={menuOpen}\n            onOpenChange={setMoreMenuOpen}\n            disabled={ancestorDisabled}\n          >\n            <ToolbarPrimitive.Button\n              render={\n                <DropdownMenuTrigger\n                  render={\n                    <ButtonMenu variant=\"secondary\">\n                      {moreActionsLabel}\n                    </ButtonMenu>\n                  }\n                />\n              }\n            />\n            <DropdownMenuContent align=\"start\">\n              {hiddenActions.map((action) => (\n                <DropdownMenuItem\n                  key={action.key}\n                  disabled={action.disabled || ancestorDisabled}\n                  onClick={action.onSelect}\n                >\n                  {action.label}\n                </DropdownMenuItem>\n              ))}\n            </DropdownMenuContent>\n          </DropdownMenu>\n        )}\n        <div\n          aria-hidden\n          inert\n          className=\"pointer-events-none invisible absolute start-0 top-0 flex items-center gap-4\"\n        >\n          {actions.map((action) => (\n            <Button\n              key={action.key}\n              ref={(el) => {\n                itemRefs.current.set(action.key, el);\n              }}\n              variant=\"ghost\"\n              tabIndex={-1}\n            >\n              {action.label}\n            </Button>\n          ))}\n          <ButtonMenu ref={moreRef} variant=\"secondary\" tabIndex={-1}>\n            {moreActionsLabel}\n          </ButtonMenu>\n        </div>\n      </ToolbarPrimitive.Root>\n    );\n  }\n);\nToolbarActionList.displayName = 'ToolbarActionList';\n\nexport { Toolbar, ToolbarActions, ToolbarActionList };\n"],"names":["ToolbarDisabledContext","React","Toolbar","className","disabled","props","ref","jsx","cn","ToolbarActions","ACTION_LIST_GAP_PX","computeVisibleActionCount","itemWidths","moreWidth","gap","availableWidth","total","sum","width","used","count","i","next","measureNaturalWidth","el","nodes","node","_a","style","ownPaddingAndBorder","range","mergeRefs","refs","ToolbarActionList","actions","moreActionsLabel","forwardedRef","containerRef","itemRefs","moreRef","visibleCount","setVisibleCount","moreMenuOpen","setMoreMenuOpen","ancestorDisabled","menuOpen","measure","container","parent","siblingsWidth","child","gapCount","available","action","observer","sibling","visibleActions","hiddenActions","jsxs","ToolbarPrimitive","Button","DropdownMenu","DropdownMenuTrigger","ButtonMenu","DropdownMenuContent","DropdownMenuItem"],"mappings":"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"}
+{"version":3,"file":"toolbar.js","names":[],"sources":["../../../../src/components/ui/toolbar/toolbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Toolbar as ToolbarPrimitive } from '@base-ui/react/toolbar';\n\nimport { cn } from '@/lib/utils';\nimport { Button } from '../button';\nimport { ButtonMenu } from '../button-menu';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from '../dropdown-menu';\n\n// Mirrors the Figma \"Toolbar\" component (node 3897:7199): a horizontal action\n// row — list actions, an optional overflow control (e.g. a `ButtonMenu`), and\n// an optional trailing area (`ToolbarActions`: a status text or a selection\n// counter + action) — typically shown above/below a list or table when rows\n// are selected or bulk actions are available. Every action is an existing\n// `Button`/`ButtonMenu` instance in Figma, so this component only lays them\n// out and carries no dedicated `--ui-toolbar-*` token tier; the 16px\n// inter-item gap is the Figma `gap/gap-16` semantic token, left un-tokenized —\n// same precedent as `FilterSearch`'s identical gap.\n//\n// The Figma `state: active | disabled` variant is the native `disabled`\n// attribute here: the root renders as a `<fieldset>` (reset to look like a\n// flex row) so every nested `Button`/`ButtonMenu` disables via the platform's\n// own fieldset-disables-descendants behavior — no prop-drilling into\n// arbitrary children required.\n//\n// `min-w-0` is required, not cosmetic: browsers give `<fieldset>` an\n// intrinsic `min-width: min-content` that Tailwind's reset doesn't touch, so\n// without it the fieldset refuses to shrink below its content's natural\n// width. `ToolbarActionList`'s collapse math reads this fieldset's own\n// `clientWidth` as \"available space\" — without `min-w-0` the fieldset\n// balloons to fit every action before that measurement ever runs, so it\n// always measures \"everything fits\" and the row never collapses.\n\n// The fieldset cascade only reaches descendants, so anything a nested part\n// renders in a portal (see `ToolbarActionList`'s overflow menu) has to learn\n// the disabled state another way. This carries it in React, deliberately\n// rather than reading the fieldset's `disabled` attribute back out of the DOM:\n// an out-of-React side channel (a MutationObserver on the attribute) resolves\n// one render *after* the fact, so the portal renders enabled for a beat, and\n// its `setState` lands outside React's own scheduling — which under React 19's\n// act environment is intermittently never flushed at all, leaving the portal\n// enabled forever.\nconst ToolbarDisabledContext = React.createContext(false);\n\nexport type ToolbarProps = React.ComponentPropsWithoutRef<'fieldset'>;\n\nconst Toolbar = React.forwardRef<HTMLFieldSetElement, ToolbarProps>(\n  ({ className, disabled, ...props }, ref) => (\n    <ToolbarDisabledContext.Provider value={!!disabled}>\n      <fieldset\n        ref={ref}\n        className={cn(\n          'm-0 flex min-w-0 items-center gap-4 border-0 p-0',\n          className\n        )}\n        disabled={disabled}\n        {...props}\n      />\n    </ToolbarDisabledContext.Provider>\n  )\n);\nToolbar.displayName = 'Toolbar';\n\n// Trailing, right-aligned area — a status text (e.g. \"25 of 1250 items\n// loaded\") or a selection counter + action (e.g. \"6 items selected: Deselect\").\n// 8px inter-child gap matches the Figma Counter part's own gap. `whitespace-nowrap`\n// is required, not cosmetic: the Figma \"Counter\" part is always single-line, but a\n// plain-text child (e.g. a `<span>`) defaults to `white-space: normal` — without\n// this, the text wraps mid-phrase once the row shrinks below its content's natural\n// width (`white-space` is inherited, so it cascades to children without them\n// needing their own override).\n//\n// `grow shrink-0` (not `flex-1`, which also shrinks): this area must grow to fill\n// leftover space so `justify-end` can right-align it, but must never shrink below\n// its own content's natural width. `ToolbarActionList`'s auto-collapse math reads\n// this element's *rendered* width as the space it needs to reserve — if it could\n// shrink, that measurement would be a moving target (less room reserved than the\n// content actually needs), so the actions row would under-collapse and this area's\n// (nowrap, unshrinkable) content would overflow past its own box instead.\nexport type ToolbarActionsProps = React.ComponentPropsWithoutRef<'div'>;\n\nconst ToolbarActions = React.forwardRef<HTMLDivElement, ToolbarActionsProps>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={cn(\n        'flex grow shrink-0 items-center justify-end gap-2 whitespace-nowrap',\n        className\n      )}\n      {...props}\n    />\n  )\n);\nToolbarActions.displayName = 'ToolbarActions';\n\n// Matches the `gap-4` utility used on both this component's row and\n// Toolbar's own root — keep in sync if either class changes.\nconst ACTION_LIST_GAP_PX = 16;\n\n// Pure so the collapse math is unit-testable without mocking layout/ResizeObserver.\n// Greedily fits as many leading items as possible into `availableWidth`; the\n// instant not everything fits, reserves `moreWidth` (+ one gap) for the\n// overflow trigger before fitting items.\nexport function computeVisibleActionCount(\n  itemWidths: number[],\n  moreWidth: number,\n  gap: number,\n  availableWidth: number\n): number {\n  const total = itemWidths.length;\n  if (total === 0) return 0;\n\n  const fullWidth =\n    itemWidths.reduce((sum, width) => sum + width, 0) + gap * (total - 1);\n  if (fullWidth <= availableWidth) return total;\n\n  let used = moreWidth;\n  let count = 0;\n  for (let i = 0; i < total; i++) {\n    const next = used + itemWidths[i] + gap;\n    if (next > availableWidth) break;\n    used = next;\n    count++;\n  }\n  return count;\n}\n\n// A grown sibling's own `getBoundingClientRect()` reflects its flex-grown\n// box, not the space its content actually needs — reading that would make\n// `measure()`'s \"available space\" calculation self-referential (see below),\n// so this reads the sibling's *content nodes* instead: normal (non-growing)\n// flex children report their natural width regardless of how large the\n// parent's box has grown to fill leftover row space. Bare text (e.g.\n// `<ToolbarActions>25 selected</ToolbarActions>` with no wrapping element)\n// renders as a `Text` node rather than an `Element`, so `children` alone\n// would miss it and fall through to the self-referential branch this\n// function exists to avoid — a `Range` measures that text's own rendered\n// width the same way `getBoundingClientRect()` does for an element.\n//\n// The sibling's own padding/border don't grow with flex-grow (only the free\n// space between content and box edge does), so they're safe to add back on\n// top of the content sum — unlike the box's own `getBoundingClientRect()`,\n// which is self-referential.\n//\n// Exported (like `computeVisibleActionCount`) so this is unit-testable\n// without mocking layout/ResizeObserver.\nexport function measureNaturalWidth(el: Element): number {\n  const nodes = Array.from(el.childNodes).filter(\n    (node): node is ChildNode =>\n      node.nodeType === Node.ELEMENT_NODE ||\n      (node.nodeType === Node.TEXT_NODE && !!node.textContent?.trim())\n  );\n  if (nodes.length === 0) return el.getBoundingClientRect().width;\n\n  const style = getComputedStyle(el);\n  const gap = parseFloat(style.columnGap) || 0;\n  const ownPaddingAndBorder =\n    (parseFloat(style.paddingLeft) || 0) +\n    (parseFloat(style.paddingRight) || 0) +\n    (parseFloat(style.borderLeftWidth) || 0) +\n    (parseFloat(style.borderRightWidth) || 0);\n  const widths = nodes.map((node) => {\n    if (node.nodeType === Node.TEXT_NODE) {\n      const range = document.createRange();\n      range.selectNodeContents(node);\n      return range.getBoundingClientRect().width;\n    }\n    return (node as Element).getBoundingClientRect().width;\n  });\n\n  return (\n    widths.reduce((sum, width) => sum + width, 0) +\n    gap * (nodes.length - 1) +\n    ownPaddingAndBorder\n  );\n}\n\nfunction mergeRefs<T>(\n  ...refs: Array<React.Ref<T> | undefined>\n): React.RefCallback<T> {\n  return (node) => {\n    for (const ref of refs) {\n      if (!ref) continue;\n      if (typeof ref === 'function') ref(node);\n      else (ref as React.RefObject<T | null>).current = node;\n    }\n  };\n}\n\nexport interface ToolbarActionListItem {\n  /** Stable identity — used as the React key in both the row and the overflow menu. */\n  key: string;\n  /** Rendered as the visible ghost Button's label, and the overflow menu item's label. */\n  label: React.ReactNode;\n  onSelect?: () => void;\n  disabled?: boolean;\n}\n\nexport interface ToolbarActionListProps\n  extends Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> {\n  /** Ordered list of actions; trailing ones collapse into \"More actions\" first. */\n  actions: ToolbarActionListItem[];\n  /** Label for the overflow trigger. */\n  moreActionsLabel?: React.ReactNode;\n}\n\n// Mirrors the Figma \"ListActions\" part, but drives its `hasMoreActions`\n// overflow menu from measured available width instead of a static boolean —\n// the breakpoints spec (node 6262:28276) requires that \"if there is no space\n// for all Toolbar actions, then last actions must be hidden under More\n// actions.\" Renders every action as a ghost Button until they no longer fit\n// the row, then moves the trailing ones into a ButtonMenu + DropdownMenu\n// (same trigger Figma's `hasMoreActions` variant shows). An invisible clone\n// of every action + the trigger is kept mounted purely to measure natural\n// widths, since a hidden item can't report its own size.\n//\n// The root and each visible action/trigger are Base UI's `Toolbar.Root`/\n// `Toolbar.Button` (`@base-ui/react/toolbar`), giving the row the WAI-ARIA\n// toolbar pattern for free: one Tab stop, arrow-key roving-tabindex between\n// actions and into the overflow trigger. Base UI's `Toolbar.Root` does not\n// forward `enableHomeAndEndKeys` to its underlying composite, so Home/End\n// are not supported here — this is a Base UI limitation, not a choice made\n// in this component. `Toolbar.Button` composes\n// via `render` the same way `DropdownMenuTrigger`/`ButtonMenu` already do\n// below — it merges its own composite/keydown/disabled props onto whatever\n// element you pass. `focusableWhenDisabled={!action.disabled}` opts a\n// disabled action out of Base UI's default APG toolbar treatment (disabled\n// items normally stay focusable via `aria-disabled`, skippable with Tab) so\n// it matches every other disabled `Button` in this library: a real native\n// `disabled` button, unreachable via Tab or arrow keys. This MUST stay\n// conditional on `action.disabled` — `Toolbar.Root` builds its\n// `disabledIndices` list from `focusableWhenDisabled` alone, regardless of\n// the item's actual disabled state, so passing a bare `false` here disables\n// every index and silently breaks arrow-key navigation for the whole row.\n//\n// The invisible measurement clones stay plain `Button`/`ButtonMenu` (not\n// `Toolbar.Button`): registering them too would double-count hidden items in\n// the roving-tabindex list. This is scoped to the action list only —\n// `Toolbar`'s own `<fieldset>` disabled-cascade (see above) is\n// intentionally untouched; Base UI's `Fieldset.Root` strips the native\n// `disabled` attribute in favor of a context other Base UI Field-aware\n// components consume, which `Button`/`ButtonMenu` don't, so it would silently\n// break the \"disabling the toolbar disables every nested control\" guarantee.\nconst ToolbarActionList = React.forwardRef<\n  HTMLDivElement,\n  ToolbarActionListProps\n>(\n  (\n    { className, actions, moreActionsLabel = 'More actions', ...props },\n    forwardedRef\n  ) => {\n    const containerRef = React.useRef<HTMLDivElement>(null);\n    const itemRefs = React.useRef<Map<string, HTMLButtonElement | null>>(\n      new Map()\n    );\n    const moreRef = React.useRef<HTMLButtonElement>(null);\n    const [visibleCount, setVisibleCount] = React.useState(actions.length);\n    const [moreMenuOpen, setMoreMenuOpen] = React.useState(false);\n    // The overflow menu renders in a portal, outside the ancestor\n    // `<fieldset>`'s DOM subtree, so the native disabled-cascade (see\n    // `Toolbar` above) never reaches its items — they read the state off\n    // context instead, so a menu already open when the toolbar becomes\n    // disabled gets closed, and its items stay disabled even if forced open\n    // again (e.g. via a ref).\n    const ancestorDisabled = React.useContext(ToolbarDisabledContext);\n\n    // Gating the `open` prop (rather than only resetting the state below)\n    // closes the menu in the very commit the toolbar becomes disabled — an\n    // effect would leave it open for one frame.\n    const menuOpen = moreMenuOpen && !ancestorDisabled;\n\n    // Still clear the stored state, or re-enabling the toolbar would pop the\n    // menu back open on its own.\n    React.useEffect(() => {\n      if (ancestorDisabled) setMoreMenuOpen(false);\n    }, [ancestorDisabled]);\n\n    const measure = React.useCallback(() => {\n      const container = containerRef.current;\n      const parent = container?.parentElement;\n      if (!container || !parent) return;\n\n      const siblingsWidth = Array.from(parent.children)\n        .filter((child) => child !== container)\n        .reduce((sum, el) => sum + measureNaturalWidth(el), 0);\n      const gapCount = Math.max(parent.children.length - 1, 0);\n      const available =\n        parent.clientWidth - siblingsWidth - ACTION_LIST_GAP_PX * gapCount;\n\n      // Keyed by `action.key`, not index — an index-keyed array would keep\n      // stale entries (and a stale length) when `actions` shrinks, since\n      // React only nulls out the removed clones' refs without truncating it.\n      const itemWidths = actions.map(\n        (action) =>\n          itemRefs.current.get(action.key)?.getBoundingClientRect().width ?? 0\n      );\n      const moreWidth = moreRef.current?.getBoundingClientRect().width ?? 0;\n\n      setVisibleCount(\n        computeVisibleActionCount(\n          itemWidths,\n          moreWidth,\n          ACTION_LIST_GAP_PX,\n          available\n        )\n      );\n    }, [actions]);\n\n    React.useLayoutEffect(() => {\n      measure();\n      const parent = containerRef.current?.parentElement;\n      if (!parent) return;\n      const observer = new ResizeObserver(measure);\n      observer.observe(parent);\n      // A sibling like `ToolbarActions` is `shrink-0`, so its own border-box\n      // grows with its content (e.g. a \"6 items selected\" counter ticking\n      // up) even while `parent`'s box stays fixed — a ResizeObserver bound\n      // only to `parent` never fires for that case, so `measure()` goes\n      // stale and the row silently overflows instead of collapsing further.\n      // Observing every sibling directly catches that box-size change too.\n      Array.from(parent.children).forEach((sibling) => {\n        if (sibling !== containerRef.current) observer.observe(sibling);\n      });\n      return () => observer.disconnect();\n    }, [measure, actions]);\n\n    const visibleActions = actions.slice(0, visibleCount);\n    const hiddenActions = actions.slice(visibleCount);\n\n    return (\n      <ToolbarPrimitive.Root\n        ref={mergeRefs(containerRef, forwardedRef)}\n        className={cn(\n          // `overflow-hidden` clips the invisible measurement clone below —\n          // it's `position: absolute` + `visibility: hidden`, which keeps\n          // contributing to this element's scrollable overflow (and thus a\n          // real horizontal scrollbar on a narrow container/page) unless\n          // something in the ancestor chain clips it. Visible content is\n          // already sized to fit `availableWidth` by the collapse math, so\n          // clipping never affects anything actually shown.\n          'relative flex min-w-0 flex-nowrap items-center gap-4 overflow-hidden',\n          className\n        )}\n        {...props}\n      >\n        {visibleActions.map((action) => (\n          <ToolbarPrimitive.Button\n            key={action.key}\n            disabled={action.disabled}\n            focusableWhenDisabled={!action.disabled}\n            onClick={action.onSelect}\n            render={<Button variant=\"ghost\">{action.label}</Button>}\n          />\n        ))}\n        {hiddenActions.length > 0 && (\n          <DropdownMenu\n            open={menuOpen}\n            onOpenChange={setMoreMenuOpen}\n            disabled={ancestorDisabled}\n          >\n            <ToolbarPrimitive.Button\n              render={\n                <DropdownMenuTrigger\n                  render={\n                    <ButtonMenu variant=\"secondary\">\n                      {moreActionsLabel}\n                    </ButtonMenu>\n                  }\n                />\n              }\n            />\n            <DropdownMenuContent align=\"start\">\n              {hiddenActions.map((action) => (\n                <DropdownMenuItem\n                  key={action.key}\n                  disabled={action.disabled || ancestorDisabled}\n                  onClick={action.onSelect}\n                >\n                  {action.label}\n                </DropdownMenuItem>\n              ))}\n            </DropdownMenuContent>\n          </DropdownMenu>\n        )}\n        <div\n          aria-hidden\n          inert\n          className=\"pointer-events-none invisible absolute start-0 top-0 flex items-center gap-4\"\n        >\n          {actions.map((action) => (\n            <Button\n              key={action.key}\n              ref={(el) => {\n                itemRefs.current.set(action.key, el);\n              }}\n              variant=\"ghost\"\n              tabIndex={-1}\n            >\n              {action.label}\n            </Button>\n          ))}\n          <ButtonMenu ref={moreRef} variant=\"secondary\" tabIndex={-1}>\n            {moreActionsLabel}\n          </ButtonMenu>\n        </div>\n      </ToolbarPrimitive.Root>\n    );\n  }\n);\nToolbarActionList.displayName = 'ToolbarActionList';\n\nexport { Toolbar, ToolbarActions, ToolbarActionList };\n"],"mappings":"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"}