@alfadocs/ui-kit 0.73.0 → 0.77.0

package/dist/_chunks/data-table-tabs-BEUXiRlu.js

@@ -0,0 +1,710 @@
+import { jsxs as L, jsx as b } from "react/jsx-runtime";
+import { useMemo as ie, useCallback as u, useRef as f, useEffect as be, forwardRef as Se, useId as De, useState as ue, useImperativeHandle as Fe } from "react";
+import * as oe from "@radix-ui/react-tabs";
+import { a as Z, c as Ie } from "./index-D2ZczOXr.js";
+import { useTranslation as ke } from "react-i18next";
+import { I as de } from "./icon-button-C_kbcd7I.js";
+import { P as ce } from "./popover-Cc0a69sw.js";
+import { T as je } from "./text-input-CUvCb6ST.js";
+import { u as ze } from "./use-direction-Dp8h70PP.js";
+import { u as Ke } from "./registry-DvAUVLHh.js";
+import { u as ye } from "./use-controllable-state-BiY4xTzM.js";
+import { X as we } from "./x-B5YnXwCz.js";
+import { P as Me } from "./plus-DzMQ_c6b.js";
+import { C as Pe } from "./check-DrFSN__t.js";
+const qe = {
+  id: "data-table-tabs",
+  capabilities: ["select_single", "view_change"],
+  state: {
+    activeTabId: {
+      type: "string | null",
+      descriptionKey: "ui.agent.dataTableTabs.state.activeTabId",
+      description: "Id of the currently-active saved-filter tab.",
+      read: (r) => r.getActiveTabId()
+    },
+    tabs: {
+      type: "Array<{ id, label }>",
+      descriptionKey: "ui.agent.dataTableTabs.state.tabs",
+      description: "The saved-filter tabs, in strip order (ids + labels).",
+      read: (r) => r.getTabs().map(({ id: o, label: g }) => ({ id: o, label: g }))
+    }
+  },
+  actions: {
+    select_tab: {
+      // Applies a saved filter model — a view change, like apply_filter.
+      safety: "read",
+      argsType: "{ id: string }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          id: { type: "string", description: "Tab id to activate." }
+        },
+        required: ["id"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.dataTableTabs.actions.selectTab",
+      description: "Activate a saved-filter tab: snapshots the outgoing tab, applies the incoming filter model to the table.",
+      invoke: (r, o) => {
+        r.selectTab(o.id);
+      }
+    },
+    get_tabs: {
+      safety: "read",
+      returns: "Array<{ id: string, label: string }>",
+      returnsSchema: {
+        type: "array",
+        items: {
+          type: "object",
+          properties: {
+            id: { type: "string" },
+            label: { type: "string" }
+          },
+          required: ["id", "label"]
+        }
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.dataTableTabs.actions.getTabs",
+      description: "Return the saved-filter tabs (ids + labels) in order.",
+      invoke: (r) => r.getTabs().map(({ id: o, label: g }) => ({ id: o, label: g }))
+    },
+    add_tab: {
+      safety: "write",
+      argsType: "{ label?: string }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          label: {
+            type: "string",
+            description: "Display name for the new tab. Defaults to a numbered name."
+          }
+        },
+        required: []
+      },
+      idempotent: !1,
+      descriptionKey: "ui.agent.dataTableTabs.actions.addTab",
+      description: "Add a new tab capturing the table's current filter model, and activate it. Returns the new tab id.",
+      returns: "string",
+      returnsSchema: { type: "string" },
+      invoke: (r, o) => r.addTab(o.label)
+    },
+    rename_tab: {
+      safety: "write",
+      argsType: "{ id: string, label: string }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          id: { type: "string", description: "Tab id to rename." },
+          label: { type: "string", description: "New display name." }
+        },
+        required: ["id", "label"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.dataTableTabs.actions.renameTab",
+      description: "Rename a saved-filter tab. No-op on locked tabs and empty labels.",
+      invoke: (r, o) => {
+        r.renameTab(o.id, o.label);
+      }
+    },
+    remove_tab: {
+      // Removes a saved filter permanently — destructive, do not downgrade.
+      safety: "destructive",
+      argsType: "{ id: string }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          id: { type: "string", description: "Tab id to remove." }
+        },
+        required: ["id"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.dataTableTabs.actions.removeTab",
+      description: "Remove a saved-filter tab (its saved filter is lost). No-op on locked tabs and the last remaining tab.",
+      invoke: (r, o) => {
+        r.removeTab(o.id);
+      }
+    }
+  },
+  domHooks: {
+    root: { attr: "data-component", value: "data-table-tabs" },
+    instanceId: { attr: "data-component-id", sourceProp: "id" },
+    item: { attr: "data-tab-id" }
+  }
+};
+let xe = 0;
+function Le() {
+  try {
+    if (typeof crypto < "u" && "randomUUID" in crypto)
+      return crypto.randomUUID();
+  } catch {
+  }
+  return xe += 1, `tab-${xe}`;
+}
+function le(r) {
+  return typeof r == "object" && r !== null && !Array.isArray(r) && Object.getPrototypeOf(r) !== null;
+}
+function Oe(r) {
+  return !le(r) || r.v !== 1 || !Array.isArray(r.tabs) ? !1 : r.tabs.every(
+    (o) => le(o) && typeof o.id == "string" && typeof o.label == "string" && le(o.filterModel)
+  );
+}
+function Ve(r) {
+  var J, Q;
+  const {
+    getTable: o,
+    tabs: g,
+    defaultTabs: k,
+    onTabsChange: R,
+    activeTabId: ee,
+    defaultActiveTabId: te,
+    onActiveTabChange: ae,
+    persistKey: z,
+    captureQuickFilter: x = !1,
+    applyOnActivate: A = !0,
+    maxTabs: O = 8,
+    createTab: N,
+    makeTabId: V = Le
+  } = r, { t: _ } = ke(), $ = g !== void 0, E = ie(() => k && k.length > 0 ? k : [
+    {
+      id: "default",
+      label: _("dataTableTabs.newTabName", { number: 1 }),
+      filterModel: {}
+    }
+  ], []), W = ie(() => {
+    if (!z || $ || typeof window > "u")
+      return null;
+    try {
+      const t = window.localStorage.getItem(`data-table-tabs:${z}`);
+      if (!t) return null;
+      const a = JSON.parse(t);
+      return Oe(a) ? a.tabs : null;
+    } catch {
+      return null;
+    }
+  }, []), [U, G] = ye({
+    value: g,
+    defaultValue: W ?? E,
+    onChange: R
+  }), C = ie(() => U ?? E, [U, E]), y = u(
+    (t) => {
+      const a = t(p.current);
+      if (p.current = a, G(a), z && !$)
+        try {
+          const n = { v: 1, tabs: a };
+          window.localStorage.setItem(
+            `data-table-tabs:${z}`,
+            JSON.stringify(n)
+          );
+        } catch {
+        }
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [G, z, $]
+  ), [ne, S] = ye({
+    value: ee,
+    defaultValue: te ?? ((J = C[0]) == null ? void 0 : J.id) ?? "default",
+    onChange: ae
+  }), l = ne ?? ((Q = C[0]) == null ? void 0 : Q.id) ?? "default", p = f(C);
+  p.current = C;
+  const m = f(l);
+  m.current = l;
+  const H = f(!1), T = f(o);
+  T.current = o;
+  const K = u(() => {
+    const t = T.current();
+    if (!t) return;
+    const a = t.getFilter() ?? {}, n = x ? (() => {
+      var s;
+      const d = (s = t.getRawApi()) == null ? void 0 : s.getGridOption("quickFilterText");
+      return typeof d == "string" && d.length > 0 ? d : void 0;
+    })() : void 0;
+    y(
+      (d) => d.map(
+        (s) => s.id === m.current ? {
+          ...s,
+          filterModel: a,
+          ...x ? { quickFilter: n } : {}
+        } : s
+      )
+    );
+  }, [x, y]), I = u(
+    (t) => {
+      if (!t) return;
+      const a = T.current();
+      if (a) {
+        H.current = !0;
+        try {
+          a.setFilter(t.filterModel ?? {});
+          const n = a.getRawApi();
+          x && (n == null || n.setGridOption("quickFilterText", t.quickFilter ?? "")), n == null || n.onFilterChanged();
+        } finally {
+          H.current = !1;
+        }
+      }
+    },
+    [x]
+  );
+  be(() => {
+    let t;
+    const a = () => {
+      H.current || K();
+    }, n = (c) => {
+      const D = c.getRawApi();
+      if (!D) return !1;
+      if (D.addEventListener("filterChanged", a), t = () => D.removeEventListener("filterChanged", a), A) {
+        const F = p.current.find(
+          (j) => j.id === m.current
+        );
+        F && (Object.keys(F.filterModel ?? {}).length > 0 || x && F.quickFilter) && I(F);
+      }
+      return !0;
+    }, d = T.current();
+    if (d && n(d)) return () => t == null ? void 0 : t();
+    const s = window.setInterval(() => {
+      const c = T.current();
+      c && n(c) && window.clearInterval(s);
+    }, 50);
+    return () => {
+      window.clearInterval(s), t == null || t();
+    };
+  }, [A, I, K, x]);
+  const v = u(
+    (t) => {
+      if (t === m.current) return;
+      const a = p.current.find((n) => n.id === t);
+      a && (K(), S(t), m.current = t, A && I(a));
+    },
+    [A, I, K, S]
+  ), M = u(
+    (t, a) => {
+      var s;
+      if (p.current.length >= O) return m.current;
+      const n = p.current.length + 1, d = N ? N(n) : {
+        id: V(),
+        label: t ?? _("dataTableTabs.newTabName", { number: n }),
+        // New tab = copy of the CURRENT live model, so the grid view does
+        // not jump on add — the natural gesture is "save my current
+        // filter as a tab".
+        filterModel: a ?? ((s = T.current()) == null ? void 0 : s.getFilter()) ?? {}
+      };
+      return y((c) => [...c, d]), S(d.id), m.current = d.id, d.id;
+    },
+    [N, V, O, S, y, _]
+  ), B = u(
+    (t, a) => {
+      const n = a.trim();
+      n && y(
+        (d) => d.map(
+          (s) => s.id === t && !s.locked ? { ...s, label: n } : s
+        )
+      );
+    },
+    [y]
+  ), P = u(
+    (t) => {
+      const a = p.current, n = a.find((c) => c.id === t);
+      if (!n || n.locked || a.length <= 1) return;
+      const d = a.findIndex((c) => c.id === t), s = a.filter((c) => c.id !== t);
+      if (y(() => s), m.current === t) {
+        const c = s[Math.max(0, d - 1)];
+        c && (S(c.id), m.current = c.id, A && I(c));
+      }
+    },
+    [A, I, S, y]
+  ), q = u(() => p.current, []), Y = u(() => m.current, []);
+  return {
+    tabs: C,
+    activeTabId: l,
+    selectTab: v,
+    addTab: M,
+    renameTab: B,
+    removeTab: P,
+    atCapacity: C.length >= O,
+    getTabsSnapshot: q,
+    getActiveTabIdSnapshot: Y
+  };
+}
+const _e = Ie(
+  [
+    // The strip scrolls horizontally when tabs overflow; focusable tabs inside
+    // (with an inset focus ring, below) satisfy scrollable-region-focusable.
+    // No baseline border and no leading padding: the first tab sits flush with
+    // the table's inline-start edge and the active tab merges straight into the
+    // grid header below — the table's own rounded top is the only edge drawn.
+    "ds:flex ds:items-end ds:gap-[var(--spacing-2xs)] ds:overflow-x-auto",
+    "ds:pe-[var(--spacing-2xs)]"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        md: "",
+        lg: ""
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), $e = Ie(
+  [
+    // `group` so the pointer-only ✕ can reveal on hover/focus/active; `relative`
+    // so that ✕ can be absolutely positioned in the trailing padding (below).
+    "ds:group ds:relative ds:inline-flex ds:items-center ds:justify-center",
+    "ds:whitespace-nowrap ds:select-none ds:cursor-pointer ds:shrink-0",
+    // Logical top corners so the leading corner can be squared in either text
+    // direction (see the first-tab override + the grid corner below). Inactive
+    // tabs take a crisp white fill so they read clearly against a warm page
+    // instead of dissolving into it; muted text keeps them clearly unselected.
+    // (Focus ring is INSET — see FOCUS_RING — so the scroll container never
+    // clips it and the flush-leading first tab keeps its ring.)
+    "ds:[border-start-start-radius:var(--radius-md)] ds:[border-start-end-radius:var(--radius-md)]",
+    "ds:bg-background ds:text-muted-foreground",
+    // Match the grid header's eyebrow treatment (uppercase, tracked, medium):
+    // the strip reads as one unit with the header below. `text-transform` is
+    // display-only — the stored label keeps its case for the rename editor, and
+    // uppercase is a no-op on caseless scripts (Arabic, CJK).
+    "ds:font-medium ds:uppercase ds:tracking-[var(--letter-spacing-uppercase)]",
+    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
+    "ds:hover:bg-muted/40 ds:hover:text-foreground",
+    // NOTE: the focus ring is applied by the component (see FOCUS_RING), gated
+    // on keyboard modality — Radix focuses the trigger on click, which would
+    // otherwise show a `:focus-visible` ring on a plain mouse selection.
+    // Active = the table header surface (`--muted`): a 1px downward pull fuses
+    // it into one continuous grey sheet with the grid header below. That fuse
+    // (grey fill + foreground text) is the whole selection cue — no accent bar.
+    "ds:data-[state=active]:bg-muted ds:data-[state=active]:text-foreground",
+    "ds:data-[state=active]:z-[1]",
+    "ds:data-[state=active]:[margin-block-end:-1px]",
+    "ds:disabled:pointer-events-none ds:disabled:opacity-50"
+  ].join(" "),
+  {
+    variants: {
+      size: {
+        // Symmetric inline padding so the label centres and every tab matches,
+        // removable or not; the ✕ lives in the trailing padding (absolute).
+        md: "ds:h-10 ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:text-[length:var(--font-size-2xs)]",
+        lg: "ds:h-12 ds:ps-[var(--spacing-lg)] ds:pe-[var(--spacing-lg)] ds:text-[length:var(--font-size-xs)]"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), Ee = "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-ring ds:focus-visible:[outline-offset:calc(-1*var(--focus-ring-width))]";
+function Ue() {
+  const [r, o] = ue(!1);
+  return be(() => {
+    const g = () => o((R) => R || !0), k = () => o((R) => R && !1);
+    return document.addEventListener("keydown", g, !0), document.addEventListener("pointerdown", k, !0), () => {
+      document.removeEventListener("keydown", g, !0), document.removeEventListener("pointerdown", k, !0);
+    };
+  }, []), r;
+}
+const Ge = Se(function({
+  getTable: o,
+  tabs: g,
+  defaultTabs: k,
+  onTabsChange: R,
+  activeTabId: ee,
+  defaultActiveTabId: te,
+  onActiveTabChange: ae,
+  persistKey: z,
+  captureQuickFilter: x = !1,
+  applyOnActivate: A = !0,
+  allowAdd: O = !0,
+  allowRename: N = !0,
+  allowRemove: V = !0,
+  maxTabs: _ = 8,
+  createTab: $,
+  makeTabId: E,
+  renameOnAdd: W = !0,
+  size: U = "md",
+  id: G,
+  className: C,
+  "aria-label": y,
+  children: ne
+}, S) {
+  const { t: l } = ke(), p = f(null), m = ze(p), H = Ue(), T = De(), K = `${T}-panel`, I = `${T}-hint`, {
+    tabs: v,
+    activeTabId: M,
+    selectTab: B,
+    addTab: P,
+    renameTab: q,
+    removeTab: Y,
+    atCapacity: J,
+    getTabsSnapshot: Q,
+    getActiveTabIdSnapshot: t
+  } = Ve({
+    getTable: o,
+    tabs: g,
+    defaultTabs: k,
+    onTabsChange: R,
+    activeTabId: ee,
+    defaultActiveTabId: te,
+    onActiveTabChange: ae,
+    persistKey: z,
+    captureQuickFilter: x,
+    applyOnActivate: A,
+    maxTabs: _,
+    createTab: $,
+    makeTabId: E
+  }), [a, n] = ue(null), d = f(null), s = v.find((e) => e.id === a), [c, D] = ue("");
+  be(() => {
+    if (!c) return;
+    const e = setTimeout(() => D(""), 3e3);
+    return () => clearTimeout(e);
+  }, [c]);
+  const F = f(/* @__PURE__ */ new Map()), j = u((e) => {
+    requestAnimationFrame(() => {
+      var i;
+      (i = F.current.get(e)) == null || i.focus();
+    });
+  }, []), pe = u(
+    (e) => N && !e.locked,
+    [N]
+  ), re = u(
+    (e) => V && !e.locked && v.length > 1,
+    [V, v.length]
+  ), se = u(
+    (e) => {
+      pe(e) && n(e.id);
+    },
+    [pe]
+  ), Re = u(() => {
+    var e;
+    if (a) {
+      const i = ((e = d.current) == null ? void 0 : e.value) ?? "";
+      i.trim() && (q(a, i), D(
+        l("dataTableTabs.announce.renamed", { name: i.trim() })
+      ));
+    }
+    n(null);
+  }, [a, q, l]), me = u(() => n(null), []), Ae = u(() => {
+    const e = l("dataTableTabs.newTabName", { number: v.length + 1 }), i = P();
+    D(l("dataTableTabs.announce.added", { name: e })), W && N ? n(i) : j(i);
+  }, [P, N, j, W, l, v.length]), X = u(
+    (e) => {
+      if (!re(e)) return;
+      const i = v.findIndex((h) => h.id === e.id), w = v.filter((h) => h.id !== e.id)[Math.max(0, i - 1)];
+      Y(e.id), D(l("dataTableTabs.announce.removed", { name: e.label })), w && j(w.id);
+    },
+    [re, j, Y, l, v]
+  ), Ne = u(
+    (e, i) => {
+      e.key === "Delete" || e.key === "Backspace" ? (e.preventDefault(), X(i)) : e.key === "F2" && (e.preventDefault(), se(i));
+    },
+    [X, se]
+  ), fe = f(B);
+  fe.current = B;
+  const ge = f(P);
+  ge.current = P;
+  const Te = f(q);
+  Te.current = q;
+  const ve = f(X);
+  ve.current = X;
+  const he = f({
+    getTabs: () => Q(),
+    getActiveTabId: () => t() ?? null,
+    selectTab: (e) => fe.current(e),
+    addTab: (e, i) => ge.current(e, i),
+    renameTab: (e, i) => Te.current(e, i),
+    removeTab: (e) => {
+      const i = Q().find((w) => w.id === e);
+      i && ve.current(i);
+    }
+  });
+  Fe(S, () => he.current, []), Ke(qe, he.current, G);
+  const Ce = `${T}-tab-${M}`;
+  return /* @__PURE__ */ L(
+    "div",
+    {
+      ref: p,
+      "data-component": "data-table-tabs",
+      "data-component-id": G,
+      className: Z("ds:flex ds:min-w-0 ds:flex-col", C),
+      children: [
+        /* @__PURE__ */ L(
+          ce.Root,
+          {
+            open: a !== null,
+            onOpenChange: (e) => {
+              e || me();
+            },
+            children: [
+              /* @__PURE__ */ L(
+                oe.Root,
+                {
+                  value: M,
+                  onValueChange: B,
+                  orientation: "horizontal",
+                  activationMode: "manual",
+                  dir: m,
+                  children: [
+                    /* @__PURE__ */ L("div", { className: "ds:flex ds:items-end ds:gap-[var(--spacing-2xs)]", children: [
+                      /* @__PURE__ */ b(
+                        oe.List,
+                        {
+                          "aria-label": y ?? l("dataTableTabs.tablistLabel"),
+                          "aria-describedby": I,
+                          className: Z(
+                            _e({ size: U }),
+                            "ds:min-w-0 ds:flex-initial"
+                          ),
+                          children: v.map((e, i) => {
+                            const w = /* @__PURE__ */ L(
+                              oe.Trigger,
+                              {
+                                ref: (h) => {
+                                  h ? F.current.set(e.id, h) : F.current.delete(e.id);
+                                },
+                                value: e.id,
+                                id: `${T}-tab-${e.id}`,
+                                "aria-controls": K,
+                                "data-tab-id": e.id,
+                                className: Z(
+                                  $e({ size: U }),
+                                  // The leading tab sits flush in the panel's leading-top
+                                  // corner: square that corner (and the grid's, below) so
+                                  // the leading edge is one straight line with no cut-in.
+                                  i === 0 && "ds:[border-start-start-radius:0]",
+                                  // Keyboard-only focus ring; in pointer mode suppress the
+                                  // UA default outline that Radix's click-focus would show.
+                                  H ? Ee : "ds:focus-visible:outline-none"
+                                ),
+                                onKeyDown: (h) => Ne(h, e),
+                                onDoubleClick: () => se(e),
+                                children: [
+                                  /* @__PURE__ */ b("span", { className: "ds:max-w-[12rem] ds:truncate", children: e.label }),
+                                  re(e) && // Visual-only dismiss — pointer removal fires here;
+                                  // keyboard removal is Delete/Backspace on the trigger.
+                                  // No role/tabIndex: interactive content inside <button>
+                                  // is invalid HTML (kit TabsTrigger precedent). Absolutely
+                                  // positioned in the trailing padding and hidden until the
+                                  // tab is hovered/focused or active, so it reserves no flow
+                                  // space — every tab keeps the same symmetric padding
+                                  // whether or not it can be removed, and labels never
+                                  // reflow when it reveals.
+                                  /* @__PURE__ */ b(
+                                    "span",
+                                    {
+                                      "aria-hidden": "true",
+                                      className: Z(
+                                        "ds:absolute ds:end-[var(--spacing-2xs)] ds:top-1/2 ds:-translate-y-1/2",
+                                        "ds:inline-flex ds:items-center ds:justify-center",
+                                        "ds:size-3.5 ds:rounded-[var(--radius-sm)]",
+                                        "ds:opacity-0 ds:transition-opacity ds:motion-reduce:transition-none",
+                                        "ds:group-hover:opacity-100 ds:group-focus-visible:opacity-100",
+                                        "ds:group-data-[state=active]:opacity-100",
+                                        "ds:hover:bg-muted-foreground/20"
+                                      ),
+                                      onPointerDown: (h) => {
+                                        h.stopPropagation(), h.preventDefault(), X(e);
+                                      },
+                                      children: /* @__PURE__ */ b(we, { className: "ds:size-3" })
+                                    }
+                                  )
+                                ]
+                              },
+                              e.id
+                            );
+                            return a === e.id ? /* @__PURE__ */ b(ce.Anchor, { asChild: !0, children: w }, e.id) : w;
+                          })
+                        }
+                      ),
+                      O && /* @__PURE__ */ b(
+                        de,
+                        {
+                          intent: "ghost",
+                          size: "sm",
+                          icon: /* @__PURE__ */ b(Me, { "aria-hidden": "true" }),
+                          tooltip: l(J ? "dataTableTabs.maxTabsReached" : "dataTableTabs.addTab"),
+                          disabled: J,
+                          className: "ds:mb-[var(--spacing-2xs)] ds:shrink-0",
+                          onClick: Ae
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ b(
+                      "div",
+                      {
+                        role: "tabpanel",
+                        id: K,
+                        "aria-labelledby": Ce,
+                        className: "ds:min-w-0 ds:[&_.ag-root-wrapper]:[border-start-start-radius:0]",
+                        children: ne
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ b(
+                ce.Content,
+                {
+                  side: "bottom",
+                  align: "start",
+                  "aria-label": l("dataTableTabs.rename.title"),
+                  className: "ds:w-64",
+                  onCloseAutoFocus: (e) => {
+                    e.preventDefault(), s ? j(s.id) : M && j(M);
+                  },
+                  onOpenAutoFocus: (e) => {
+                    var i, w;
+                    e.preventDefault(), (i = d.current) == null || i.focus(), (w = d.current) == null || w.select();
+                  },
+                  children: /* @__PURE__ */ L(
+                    "form",
+                    {
+                      className: "ds:flex ds:items-center ds:gap-[var(--spacing-2xs)]",
+                      onSubmit: (e) => {
+                        e.preventDefault(), Re();
+                      },
+                      children: [
+                        /* @__PURE__ */ b(
+                          je,
+                          {
+                            ref: d,
+                            size: "sm",
+                            "aria-label": l("dataTableTabs.rename.inputLabel"),
+                            defaultValue: (s == null ? void 0 : s.label) ?? "",
+                            maxLength: 60,
+                            className: "ds:min-w-0 ds:flex-1"
+                          }
+                        ),
+                        /* @__PURE__ */ b(
+                          de,
+                          {
+                            type: "submit",
+                            intent: "ghost",
+                            size: "sm",
+                            icon: /* @__PURE__ */ b(Pe, { "aria-hidden": "true" }),
+                            tooltip: l("dataTableTabs.rename.save")
+                          }
+                        ),
+                        /* @__PURE__ */ b(
+                          de,
+                          {
+                            type: "button",
+                            intent: "ghost",
+                            size: "sm",
+                            icon: /* @__PURE__ */ b(we, { "aria-hidden": "true" }),
+                            tooltip: l("dataTableTabs.rename.cancel"),
+                            onClick: me
+                          }
+                        )
+                      ]
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ b("span", { id: I, className: "ds:sr-only", children: l("dataTableTabs.hint") }),
+        /* @__PURE__ */ b("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: c })
+      ]
+    }
+  );
+});
+Ge.displayName = "DataTableTabs";
+export {
+  Ge as D,
+  _e as a,
+  $e as b,
+  qe as d
+};
+//# sourceMappingURL=data-table-tabs-BEUXiRlu.js.map