@epilot/volt-ui-experimental-griffel 0.2.3 → 0.3.0

package/dist/components/data-table/data-table-column-visibility.js

@@ -1,11 +1,11 @@
-import { jsxs as l, jsx as t } from "react/jsx-runtime";
-import * as b from "react";
-import { shorthands as n } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/index.js";
-import { makeVoltStyles as w } from "../../styles/make-styles.js";
-import { Button as D } from "../button/button.js";
-import { DropdownMenu as y, DropdownMenuTrigger as C, DropdownMenuContent as x, DropdownMenuLabel as T, DropdownMenuSeparator as M, DropdownMenuCheckboxItem as V } from "../dropdown-menu/dropdown-menu.js";
-import { useDataTable as v } from "./hooks/use-data-table.js";
-const S = (r) => /* @__PURE__ */ t(
+import { j as e } from "../../vendor/react/jsx-dev-runtime.js";
+import * as g from "react";
+import { shorthands as t } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/index.js";
+import { makeVoltStyles as x } from "../../styles/make-styles.js";
+import { Button as v } from "../button/button.js";
+import { DropdownMenu as N, DropdownMenuTrigger as w, DropdownMenuContent as q, DropdownMenuLabel as D, DropdownMenuSeparator as y, DropdownMenuCheckboxItem as V } from "../dropdown-menu/dropdown-menu.js";
+import { useDataTable as k } from "./hooks/use-data-table.js";
+const C = (a) => /* @__PURE__ */ e.jsxDEV(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -13,10 +13,22 @@ const S = (r) => /* @__PURE__ */ t(
     height: "20",
     viewBox: "0 -960 960 960",
     fill: "currentColor",
-    ...r,
-    children: /* @__PURE__ */ t("path", { d: "M413.09-65.87q-16.26 0-28.68-9.85Q372-85.56 370-101.83l-15-94.56q-15.61-5.31-34.07-15.89-18.45-10.59-31.63-21.33l-85.43 40q-15.7 6.57-31.96 1.78-16.26-4.78-24.82-20.04l-65.92-118.7q-9.13-14.13-5.34-30.1 3.78-15.98 17.47-26.11l79.44-59q-1.44-7.31-1.94-17.11-.5-9.81-.5-17.11 0-7.3.5-17.11.5-9.8 1.94-17.11L93.3-572.65q-14.26-10.13-17.76-26.11-3.5-15.98 5.63-30.67l65.92-118.7q8.56-14.13 24.54-19.48 15.98-5.35 31.67 1.22l87.13 40q12.61-10.18 30.79-20.48 18.17-10.3 33.78-15.17l15-95.57q2-16.83 14.41-26.96 12.42-10.13 28.68-10.13h133.82q16.26 0 28.68 10.13Q588-874.44 590-857.61l15 94.57q15.61 5.87 34.28 15.67 18.68 9.8 31.42 20.98l85.43-40q15.7-6.57 31.46-1.22 15.76 5.35 24.32 19.48l67.48 118.7q8.57 14.69 5.07 31.17-3.5 16.48-17.76 25.61l-80 56.43q1.43 8.31 2.21 18.11.79 9.81.79 18.11 0 8.3-.79 17.61-.78 9.3-2.21 17.61l80 57.43q14.26 9.13 17.76 25.61 3.5 16.48-5.07 31.17l-66.48 118.7q-8.56 14.7-24.54 19.76-15.98 5.07-31.67-1.5l-86.57-40q-13.17 10.74-30.85 21.55-17.67 10.8-34.28 15.67l-15 94.56q-2 16.27-14.41 26.11-12.42 9.85-28.68 9.85H413.09Zm27.43-79.22h78.39l14.57-111.43q33.56-8 63.91-25 30.35-17 54.35-42.7l106 46 34.91-64.65-92.87-67.87q4-17.56 6.78-34.63 2.79-17.06 2.79-34.63 0-17.57-2.29-34.63-2.28-17.07-7.28-34.63l93.44-67.87-35.48-64.65-105.44 46q-23-27.13-53.13-45.48-30.13-18.35-65.69-22.78l-14-110.87h-78.96l-13.43 110.87q-35.13 6.43-65.76 24.28-30.63 17.85-54.2 43.98l-104.87-46-35.48 64.65 92.31 67.3q-4 17.57-6.79 34.92-2.78 17.34-2.78 34.91 0 17.57 2.78 35.2 2.79 17.63 6.79 34.63l-92.31 67.3 35.48 64.65 104.87-46q24.57 25.13 55.2 42.7 30.63 17.56 64.76 25.56l13.43 110.87ZM478.87-350q54 0 92-38t38-92q0-54-38-92t-92-38q-54 0-92 38t-38 92q0 54 38 92t92 38ZM480-480Z" })
-  }
-), k = w({
+    ...a,
+    children: /* @__PURE__ */ e.jsxDEV("path", { d: "M413.09-65.87q-16.26 0-28.68-9.85Q372-85.56 370-101.83l-15-94.56q-15.61-5.31-34.07-15.89-18.45-10.59-31.63-21.33l-85.43 40q-15.7 6.57-31.96 1.78-16.26-4.78-24.82-20.04l-65.92-118.7q-9.13-14.13-5.34-30.1 3.78-15.98 17.47-26.11l79.44-59q-1.44-7.31-1.94-17.11-.5-9.81-.5-17.11 0-7.3.5-17.11.5-9.8 1.94-17.11L93.3-572.65q-14.26-10.13-17.76-26.11-3.5-15.98 5.63-30.67l65.92-118.7q8.56-14.13 24.54-19.48 15.98-5.35 31.67 1.22l87.13 40q12.61-10.18 30.79-20.48 18.17-10.3 33.78-15.17l15-95.57q2-16.83 14.41-26.96 12.42-10.13 28.68-10.13h133.82q16.26 0 28.68 10.13Q588-874.44 590-857.61l15 94.57q15.61 5.87 34.28 15.67 18.68 9.8 31.42 20.98l85.43-40q15.7-6.57 31.46-1.22 15.76 5.35 24.32 19.48l67.48 118.7q8.57 14.69 5.07 31.17-3.5 16.48-17.76 25.61l-80 56.43q1.43 8.31 2.21 18.11.79 9.81.79 18.11 0 8.3-.79 17.61-.78 9.3-2.21 17.61l80 57.43q14.26 9.13 17.76 25.61 3.5 16.48-5.07 31.17l-66.48 118.7q-8.56 14.7-24.54 19.76-15.98 5.07-31.67-1.5l-86.57-40q-13.17 10.74-30.85 21.55-17.67 10.8-34.28 15.67l-15 94.56q-2 16.27-14.41 26.11-12.42 9.85-28.68 9.85H413.09Zm27.43-79.22h78.39l14.57-111.43q33.56-8 63.91-25 30.35-17 54.35-42.7l106 46 34.91-64.65-92.87-67.87q4-17.56 6.78-34.63 2.79-17.06 2.79-34.63 0-17.57-2.29-34.63-2.28-17.07-7.28-34.63l93.44-67.87-35.48-64.65-105.44 46q-23-27.13-53.13-45.48-30.13-18.35-65.69-22.78l-14-110.87h-78.96l-13.43 110.87q-35.13 6.43-65.76 24.28-30.63 17.85-54.2 43.98l-104.87-46-35.48 64.65 92.31 67.3q-4 17.57-6.79 34.92-2.78 17.34-2.78 34.91 0 17.57 2.78 35.2 2.79 17.63 6.79 34.63l-92.31 67.3 35.48 64.65 104.87-46q24.57 25.13 55.2 42.7 30.63 17.56 64.76 25.56l13.43 110.87ZM478.87-350q54 0 92-38t38-92q0-54-38-92t-92-38q-54 0-92 38t-38 92q0 54 38 92t92 38ZM480-480Z" }, void 0, !1, {
+      fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+      lineNumber: 27,
+      columnNumber: 5
+    }, void 0)
+  },
+  void 0,
+  !1,
+  {
+    fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+    lineNumber: 19,
+    columnNumber: 3
+  },
+  void 0
+), j = x({
   icon: {
     width: "1rem",
     height: "1rem"
@@ -25,55 +37,102 @@ const S = (r) => /* @__PURE__ */ t(
     position: "absolute",
     width: "1px",
     height: "1px",
-    ...n.padding(0),
-    ...n.margin("-1px"),
-    ...n.overflow("hidden"),
+    ...t.padding(0),
+    ...t.margin("-1px"),
+    ...t.overflow("hidden"),
     clip: "rect(0, 0, 0, 0)",
     whiteSpace: "nowrap"
   }
-}), B = b.forwardRef(function({ icon: d, trigger: h, label: o, contentClassName: m, align: c = "end", ...p }, q) {
-  const { table: f } = v(), a = k(), s = f.getAllColumns().filter((e) => e.getCanHide());
-  return s.length === 0 ? null : /* @__PURE__ */ l(y, { ref: q, ...p, children: [
-    /* @__PURE__ */ t(C, { asChild: !0, children: h ?? /* @__PURE__ */ l(
-      D,
+}), Z = g.forwardRef(function({ icon: n, trigger: m, label: s, contentClassName: u, align: c = "end", ...b }, d) {
+  const { table: p } = k(), r = j(), o = p.getAllColumns().filter((l) => l.getCanHide());
+  return o.length === 0 ? null : /* @__PURE__ */ e.jsxDEV(N, { ref: d, ...b, children: [
+    /* @__PURE__ */ e.jsxDEV(w, { asChild: !0, children: m ?? /* @__PURE__ */ e.jsxDEV(
+      v,
       {
         variant: "tertiary",
         size: "sm",
         "data-fs-element": "DataTable-ColumnVisibility-Trigger",
         children: [
-          d ?? /* @__PURE__ */ t(S, { className: a.icon }),
-          /* @__PURE__ */ t("span", { className: a.srOnly, children: o })
+          n ?? /* @__PURE__ */ e.jsxDEV(C, { className: r.icon }, void 0, !1, {
+            fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+            lineNumber: 93,
+            columnNumber: 22
+          }, this),
+          /* @__PURE__ */ e.jsxDEV("span", { className: r.srOnly, children: s }, void 0, !1, {
+            fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+            lineNumber: 94,
+            columnNumber: 13
+          }, this)
         ]
-      }
-    ) }),
-    /* @__PURE__ */ l(
-      x,
+      },
+      void 0,
+      !0,
+      {
+        fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+        lineNumber: 88,
+        columnNumber: 11
+      },
+      this
+    ) }, void 0, !1, {
+      fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+      lineNumber: 86,
+      columnNumber: 7
+    }, this),
+    /* @__PURE__ */ e.jsxDEV(
+      q,
       {
         align: c,
-        className: m,
+        className: u,
         "data-fs-element": "DataTable-ColumnVisibility-Content",
         children: [
-          /* @__PURE__ */ t(T, { children: o }),
-          /* @__PURE__ */ t(M, {}),
-          s.map((e) => {
-            const i = e.columnDef.meta, g = (i == null ? void 0 : i.visibilityLabel) ?? (typeof e.columnDef.header == "string" ? e.columnDef.header : e.id);
-            return /* @__PURE__ */ t(
+          /* @__PURE__ */ e.jsxDEV(D, { children: s }, void 0, !1, {
+            fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+            lineNumber: 103,
+            columnNumber: 9
+          }, this),
+          /* @__PURE__ */ e.jsxDEV(y, {}, void 0, !1, {
+            fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+            lineNumber: 104,
+            columnNumber: 9
+          }, this),
+          o.map((l) => {
+            const i = l.columnDef.meta, f = (i == null ? void 0 : i.visibilityLabel) ?? (typeof l.columnDef.header == "string" ? l.columnDef.header : l.id);
+            return /* @__PURE__ */ e.jsxDEV(
               V,
               {
-                checked: e.getIsVisible(),
-                onCheckedChange: (u) => e.toggleVisibility(!!u),
+                checked: l.getIsVisible(),
+                onCheckedChange: (h) => l.toggleVisibility(!!h),
                 "data-fs-element": "DataTable-ColumnVisibility-Item",
-                children: g
+                children: f
+              },
+              l.id,
+              !1,
+              {
+                fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+                lineNumber: 118,
+                columnNumber: 13
               },
-              e.id
+              this
             );
           })
         ]
-      }
+      },
+      void 0,
+      !0,
+      {
+        fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+        lineNumber: 98,
+        columnNumber: 7
+      },
+      this
     )
-  ] });
+  ] }, void 0, !0, {
+    fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-column-visibility.tsx",
+    lineNumber: 85,
+    columnNumber: 5
+  }, this);
 });
 export {
-  B as DataTableColumnVisibility
+  Z as DataTableColumnVisibility
 };
 //# sourceMappingURL=data-table-column-visibility.js.map

package/dist/components/data-table/data-table-column-visibility.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-table-column-visibility.js","sources":["../../../src/components/data-table/data-table-column-visibility.tsx"],"sourcesContent":["import * as React from \"react\"\nimport type { ComponentProps, ReactNode, SVGProps } from \"react\"\nimport { shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport { Button } from \"../button/button\"\nimport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"../dropdown-menu/dropdown-menu\"\nimport { useDataTable } from \"./hooks/use-data-table\"\n\n// Settings/gear icon (default)\nconst IconSettings = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"20\"\n    height=\"20\"\n    viewBox=\"0 -960 960 960\"\n    fill=\"currentColor\"\n    {...props}\n  >\n    <path d=\"M413.09-65.87q-16.26 0-28.68-9.85Q372-85.56 370-101.83l-15-94.56q-15.61-5.31-34.07-15.89-18.45-10.59-31.63-21.33l-85.43 40q-15.7 6.57-31.96 1.78-16.26-4.78-24.82-20.04l-65.92-118.7q-9.13-14.13-5.34-30.1 3.78-15.98 17.47-26.11l79.44-59q-1.44-7.31-1.94-17.11-.5-9.81-.5-17.11 0-7.3.5-17.11.5-9.8 1.94-17.11L93.3-572.65q-14.26-10.13-17.76-26.11-3.5-15.98 5.63-30.67l65.92-118.7q8.56-14.13 24.54-19.48 15.98-5.35 31.67 1.22l87.13 40q12.61-10.18 30.79-20.48 18.17-10.3 33.78-15.17l15-95.57q2-16.83 14.41-26.96 12.42-10.13 28.68-10.13h133.82q16.26 0 28.68 10.13Q588-874.44 590-857.61l15 94.57q15.61 5.87 34.28 15.67 18.68 9.8 31.42 20.98l85.43-40q15.7-6.57 31.46-1.22 15.76 5.35 24.32 19.48l67.48 118.7q8.57 14.69 5.07 31.17-3.5 16.48-17.76 25.61l-80 56.43q1.43 8.31 2.21 18.11.79 9.81.79 18.11 0 8.3-.79 17.61-.78 9.3-2.21 17.61l80 57.43q14.26 9.13 17.76 25.61 3.5 16.48-5.07 31.17l-66.48 118.7q-8.56 14.7-24.54 19.76-15.98 5.07-31.67-1.5l-86.57-40q-13.17 10.74-30.85 21.55-17.67 10.8-34.28 15.67l-15 94.56q-2 16.27-14.41 26.11-12.42 9.85-28.68 9.85H413.09Zm27.43-79.22h78.39l14.57-111.43q33.56-8 63.91-25 30.35-17 54.35-42.7l106 46 34.91-64.65-92.87-67.87q4-17.56 6.78-34.63 2.79-17.06 2.79-34.63 0-17.57-2.29-34.63-2.28-17.07-7.28-34.63l93.44-67.87-35.48-64.65-105.44 46q-23-27.13-53.13-45.48-30.13-18.35-65.69-22.78l-14-110.87h-78.96l-13.43 110.87q-35.13 6.43-65.76 24.28-30.63 17.85-54.2 43.98l-104.87-46-35.48 64.65 92.31 67.3q-4 17.57-6.79 34.92-2.78 17.34-2.78 34.91 0 17.57 2.78 35.2 2.79 17.63 6.79 34.63l-92.31 67.3 35.48 64.65 104.87-46q24.57 25.13 55.2 42.7 30.63 17.56 64.76 25.56l13.43 110.87ZM478.87-350q54 0 92-38t38-92q0-54-38-92t-92-38q-54 0-92 38t-38 92q0 54 38 92t92 38ZM480-480Z\" />\n  </svg>\n)\n\nconst useStyles = makeVoltStyles({\n  icon: {\n    width: \"1rem\",\n    height: \"1rem\",\n  },\n  srOnly: {\n    position: \"absolute\",\n    width: \"1px\",\n    height: \"1px\",\n    ...shorthands.padding(0),\n    ...shorthands.margin(\"-1px\"),\n    ...shorthands.overflow(\"hidden\"),\n    clip: \"rect(0, 0, 0, 0)\",\n    whiteSpace: \"nowrap\",\n  },\n})\n\nexport type DataTableColumnVisibilityProps = {\n  /** Custom icon for the default trigger button. Falls back to settings gear icon. */\n  icon?: ReactNode\n  /** Custom trigger element. Defaults to a settings icon button. */\n  trigger?: ReactNode\n  /** Label shown at top of dropdown and as screen reader text for default trigger. Required for i18n. */\n  label: string\n  /** Additional class name for the dropdown content */\n  contentClassName?: string\n  /** Alignment of dropdown relative to trigger. Default: \"end\" */\n  align?: \"start\" | \"center\" | \"end\"\n} & Omit<ComponentProps<typeof DropdownMenu>, \"children\">\n\n/**\n * A dropdown menu for toggling column visibility in DataTable.\n * Shows checkboxes for each column that can be hidden.\n * Place in DataTableToolbar for consistent layout.\n */\nexport const DataTableColumnVisibility = React.forwardRef<\n  HTMLElement,\n  DataTableColumnVisibilityProps\n>(function DataTableColumnVisibility(\n  { icon, trigger, label, contentClassName, align = \"end\", ...props },\n  ref\n) {\n  const { table } = useDataTable()\n  const styles = useStyles()\n\n  // Get columns that can be hidden (excludes selection column, etc.)\n  const columns = table.getAllColumns().filter((column) => column.getCanHide())\n\n  // If no hideable columns, don't render anything\n  if (columns.length === 0) {\n    return null\n  }\n\n  return (\n    <DropdownMenu ref={ref} {...props}>\n      <DropdownMenuTrigger asChild>\n        {trigger ?? (\n          <Button\n            variant=\"tertiary\"\n            size=\"sm\"\n            data-fs-element=\"DataTable-ColumnVisibility-Trigger\"\n          >\n            {icon ?? <IconSettings className={styles.icon} />}\n            <span className={styles.srOnly}>{label}</span>\n          </Button>\n        )}\n      </DropdownMenuTrigger>\n      <DropdownMenuContent\n        align={align}\n        className={contentClassName}\n        data-fs-element=\"DataTable-ColumnVisibility-Content\"\n      >\n        <DropdownMenuLabel>{label}</DropdownMenuLabel>\n        <DropdownMenuSeparator />\n        {columns.map((column) => {\n          // Get column header text for display\n          // Priority: meta.visibilityLabel > string header > column.id\n          const columnMeta = column.columnDef.meta as\n            | { visibilityLabel?: string }\n            | undefined\n          const headerText =\n            columnMeta?.visibilityLabel ??\n            (typeof column.columnDef.header === \"string\"\n              ? column.columnDef.header\n              : column.id)\n\n          return (\n            <DropdownMenuCheckboxItem\n              key={column.id}\n              checked={column.getIsVisible()}\n              onCheckedChange={(value) => column.toggleVisibility(!!value)}\n              data-fs-element=\"DataTable-ColumnVisibility-Item\"\n            >\n              {headerText}\n            </DropdownMenuCheckboxItem>\n          )\n        })}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  )\n})\n"],"names":["IconSettings","props","jsx","useStyles","makeVoltStyles","shorthands","DataTableColumnVisibility","React","icon","trigger","label","contentClassName","align","ref","table","useDataTable","styles","columns","column","jsxs","DropdownMenu","DropdownMenuTrigger","Button","DropdownMenuContent","DropdownMenuLabel","DropdownMenuSeparator","columnMeta","headerText","DropdownMenuCheckboxItem","value"],"mappings":";;;;;;;AAiBA,MAAMA,IAAe,CAACC,MACpB,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACJ,GAAGD;AAAA,IAEJ,UAAA,gBAAAC,EAAC,QAAA,EAAK,GAAE,iqDAAA,CAAiqD;AAAA,EAAA;AAC3qD,GAGIC,IAAYC,EAAe;AAAA,EAC/B,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,EAAA;AAAA,EAEV,QAAQ;AAAA,IACN,UAAU;AAAA,IACV,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,GAAGC,EAAW,QAAQ,CAAC;AAAA,IACvB,GAAGA,EAAW,OAAO,MAAM;AAAA,IAC3B,GAAGA,EAAW,SAAS,QAAQ;AAAA,IAC/B,MAAM;AAAA,IACN,YAAY;AAAA,EAAA;AAEhB,CAAC,GAoBYC,IAA4BC,EAAM,WAG7C,SACA,EAAE,MAAAC,GAAM,SAAAC,GAAS,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,IAAQ,OAAO,GAAGX,EAAA,GAC5DY,GACA;AACA,QAAM,EAAE,OAAAC,EAAA,IAAUC,EAAA,GACZC,IAASb,EAAA,GAGTc,IAAUH,EAAM,cAAA,EAAgB,OAAO,CAACI,MAAWA,EAAO,YAAY;AAG5E,SAAID,EAAQ,WAAW,IACd,OAIP,gBAAAE,EAACC,GAAA,EAAa,KAAAP,GAAW,GAAGZ,GAC1B,UAAA;AAAA,IAAA,gBAAAC,EAACmB,GAAA,EAAoB,SAAO,IACzB,UAAAZ,KACC,gBAAAU;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,mBAAgB;AAAA,QAEf,UAAA;AAAA,UAAAd,KAAQ,gBAAAN,EAACF,GAAA,EAAa,WAAWgB,EAAO,MAAM;AAAA,UAC/C,gBAAAd,EAAC,QAAA,EAAK,WAAWc,EAAO,QAAS,UAAAN,EAAA,CAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAG7C;AAAA,IACA,gBAAAS;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,OAAAX;AAAA,QACA,WAAWD;AAAA,QACX,mBAAgB;AAAA,QAEhB,UAAA;AAAA,UAAA,gBAAAT,EAACsB,KAAmB,UAAAd,EAAA,CAAM;AAAA,4BACzBe,GAAA,EAAsB;AAAA,UACtBR,EAAQ,IAAI,CAACC,MAAW;AAGvB,kBAAMQ,IAAaR,EAAO,UAAU,MAG9BS,KACJD,KAAA,gBAAAA,EAAY,qBACX,OAAOR,EAAO,UAAU,UAAW,WAChCA,EAAO,UAAU,SACjBA,EAAO;AAEb,mBACE,gBAAAhB;AAAA,cAAC0B;AAAA,cAAA;AAAA,gBAEC,SAASV,EAAO,aAAA;AAAA,gBAChB,iBAAiB,CAACW,MAAUX,EAAO,iBAAiB,CAAC,CAACW,CAAK;AAAA,gBAC3D,mBAAgB;AAAA,gBAEf,UAAAF;AAAA,cAAA;AAAA,cALIT,EAAO;AAAA,YAAA;AAAA,UAQlB,CAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ,CAAC;"}
+{"version":3,"file":"data-table-column-visibility.js","sources":["../../../src/components/data-table/data-table-column-visibility.tsx"],"sourcesContent":["import * as React from \"react\"\nimport type { ComponentProps, ReactNode, SVGProps } from \"react\"\nimport { shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport { Button } from \"../button/button\"\nimport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"../dropdown-menu/dropdown-menu\"\nimport { useDataTable } from \"./hooks/use-data-table\"\n\n// Settings/gear icon (default)\nconst IconSettings = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"20\"\n    height=\"20\"\n    viewBox=\"0 -960 960 960\"\n    fill=\"currentColor\"\n    {...props}\n  >\n    <path d=\"M413.09-65.87q-16.26 0-28.68-9.85Q372-85.56 370-101.83l-15-94.56q-15.61-5.31-34.07-15.89-18.45-10.59-31.63-21.33l-85.43 40q-15.7 6.57-31.96 1.78-16.26-4.78-24.82-20.04l-65.92-118.7q-9.13-14.13-5.34-30.1 3.78-15.98 17.47-26.11l79.44-59q-1.44-7.31-1.94-17.11-.5-9.81-.5-17.11 0-7.3.5-17.11.5-9.8 1.94-17.11L93.3-572.65q-14.26-10.13-17.76-26.11-3.5-15.98 5.63-30.67l65.92-118.7q8.56-14.13 24.54-19.48 15.98-5.35 31.67 1.22l87.13 40q12.61-10.18 30.79-20.48 18.17-10.3 33.78-15.17l15-95.57q2-16.83 14.41-26.96 12.42-10.13 28.68-10.13h133.82q16.26 0 28.68 10.13Q588-874.44 590-857.61l15 94.57q15.61 5.87 34.28 15.67 18.68 9.8 31.42 20.98l85.43-40q15.7-6.57 31.46-1.22 15.76 5.35 24.32 19.48l67.48 118.7q8.57 14.69 5.07 31.17-3.5 16.48-17.76 25.61l-80 56.43q1.43 8.31 2.21 18.11.79 9.81.79 18.11 0 8.3-.79 17.61-.78 9.3-2.21 17.61l80 57.43q14.26 9.13 17.76 25.61 3.5 16.48-5.07 31.17l-66.48 118.7q-8.56 14.7-24.54 19.76-15.98 5.07-31.67-1.5l-86.57-40q-13.17 10.74-30.85 21.55-17.67 10.8-34.28 15.67l-15 94.56q-2 16.27-14.41 26.11-12.42 9.85-28.68 9.85H413.09Zm27.43-79.22h78.39l14.57-111.43q33.56-8 63.91-25 30.35-17 54.35-42.7l106 46 34.91-64.65-92.87-67.87q4-17.56 6.78-34.63 2.79-17.06 2.79-34.63 0-17.57-2.29-34.63-2.28-17.07-7.28-34.63l93.44-67.87-35.48-64.65-105.44 46q-23-27.13-53.13-45.48-30.13-18.35-65.69-22.78l-14-110.87h-78.96l-13.43 110.87q-35.13 6.43-65.76 24.28-30.63 17.85-54.2 43.98l-104.87-46-35.48 64.65 92.31 67.3q-4 17.57-6.79 34.92-2.78 17.34-2.78 34.91 0 17.57 2.78 35.2 2.79 17.63 6.79 34.63l-92.31 67.3 35.48 64.65 104.87-46q24.57 25.13 55.2 42.7 30.63 17.56 64.76 25.56l13.43 110.87ZM478.87-350q54 0 92-38t38-92q0-54-38-92t-92-38q-54 0-92 38t-38 92q0 54 38 92t92 38ZM480-480Z\" />\n  </svg>\n)\n\nconst useStyles = makeVoltStyles({\n  icon: {\n    width: \"1rem\",\n    height: \"1rem\",\n  },\n  srOnly: {\n    position: \"absolute\",\n    width: \"1px\",\n    height: \"1px\",\n    ...shorthands.padding(0),\n    ...shorthands.margin(\"-1px\"),\n    ...shorthands.overflow(\"hidden\"),\n    clip: \"rect(0, 0, 0, 0)\",\n    whiteSpace: \"nowrap\",\n  },\n})\n\nexport type DataTableColumnVisibilityProps = {\n  /** Custom icon for the default trigger button. Falls back to settings gear icon. */\n  icon?: ReactNode\n  /** Custom trigger element. Defaults to a settings icon button. */\n  trigger?: ReactNode\n  /** Label shown at top of dropdown and as screen reader text for default trigger. Required for i18n. */\n  label: string\n  /** Additional class name for the dropdown content */\n  contentClassName?: string\n  /** Alignment of dropdown relative to trigger. Default: \"end\" */\n  align?: \"start\" | \"center\" | \"end\"\n} & Omit<ComponentProps<typeof DropdownMenu>, \"children\">\n\n/**\n * A dropdown menu for toggling column visibility in DataTable.\n * Shows checkboxes for each column that can be hidden.\n * Place in DataTableToolbar for consistent layout.\n */\nexport const DataTableColumnVisibility = React.forwardRef<\n  HTMLElement,\n  DataTableColumnVisibilityProps\n>(function DataTableColumnVisibility(\n  { icon, trigger, label, contentClassName, align = \"end\", ...props },\n  ref\n) {\n  const { table } = useDataTable()\n  const styles = useStyles()\n\n  // Get columns that can be hidden (excludes selection column, etc.)\n  const columns = table.getAllColumns().filter((column) => column.getCanHide())\n\n  // If no hideable columns, don't render anything\n  if (columns.length === 0) {\n    return null\n  }\n\n  return (\n    <DropdownMenu ref={ref} {...props}>\n      <DropdownMenuTrigger asChild>\n        {trigger ?? (\n          <Button\n            variant=\"tertiary\"\n            size=\"sm\"\n            data-fs-element=\"DataTable-ColumnVisibility-Trigger\"\n          >\n            {icon ?? <IconSettings className={styles.icon} />}\n            <span className={styles.srOnly}>{label}</span>\n          </Button>\n        )}\n      </DropdownMenuTrigger>\n      <DropdownMenuContent\n        align={align}\n        className={contentClassName}\n        data-fs-element=\"DataTable-ColumnVisibility-Content\"\n      >\n        <DropdownMenuLabel>{label}</DropdownMenuLabel>\n        <DropdownMenuSeparator />\n        {columns.map((column) => {\n          // Get column header text for display\n          // Priority: meta.visibilityLabel > string header > column.id\n          const columnMeta = column.columnDef.meta as\n            | { visibilityLabel?: string }\n            | undefined\n          const headerText =\n            columnMeta?.visibilityLabel ??\n            (typeof column.columnDef.header === \"string\"\n              ? column.columnDef.header\n              : column.id)\n\n          return (\n            <DropdownMenuCheckboxItem\n              key={column.id}\n              checked={column.getIsVisible()}\n              onCheckedChange={(value) => column.toggleVisibility(!!value)}\n              data-fs-element=\"DataTable-ColumnVisibility-Item\"\n            >\n              {headerText}\n            </DropdownMenuCheckboxItem>\n          )\n        })}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  )\n})\n"],"names":["IconSettings","props","jsxDEV","this","useStyles","makeVoltStyles","shorthands","DataTableColumnVisibility","React","icon","trigger","label","contentClassName","align","ref","table","useDataTable","styles","columns","column","DropdownMenu","DropdownMenuTrigger","Button","DropdownMenuContent","DropdownMenuLabel","DropdownMenuSeparator","columnMeta","headerText","DropdownMenuCheckboxItem","value"],"mappings":"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"}

package/dist/components/data-table/data-table-content.js

@@ -1,21 +1,21 @@
-import { jsx as r, jsxs as O, Fragment as _ } from "react/jsx-runtime";
-import * as A from "react";
-import { useRef as S, useState as z, useCallback as R, useEffect as I, useMemo as l } from "react";
-import { flushSync as N } from "react-dom";
-import { shorthands as U } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/index.js";
-import { SLOT_ATTR as y } from "../../packages/volt-runtime/dist/renderer/contract.js";
-import { mergeClasses as $ } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
-import { makeVoltStyles as j } from "../../styles/make-styles.js";
-import { leadingSm as k, textSm as q } from "../../tokens/index.js";
-import { DataTableContentContext as P } from "./data-table-context.js";
-import { DataTableHeader as Q } from "./data-table-header.js";
-import { DataTableBody as G } from "./data-table-body.js";
-import { useDataTable as J } from "./hooks/use-data-table.js";
-const K = 150, X = j({
+import { j as a } from "../../vendor/react/jsx-dev-runtime.js";
+import * as H from "react";
+import { useRef as C, useState as S, useCallback as v, useEffect as B, useMemo as r } from "react";
+import { flushSync as F } from "react-dom";
+import { shorthands as M } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/index.js";
+import { SLOT_ATTR as N } from "../../packages/volt-runtime/dist/renderer/contract.js";
+import { mergeClasses as O } from "../../packages/volt-runtime/dist/vendor/@griffel/core/src/mergeClasses.js";
+import { makeVoltStyles as _ } from "../../styles/make-styles.js";
+import { leadingSm as A, textSm as I } from "../../tokens/index.js";
+import { DataTableContentContext as $ } from "./data-table-context.js";
+import { DataTableHeader as q } from "./data-table-header.js";
+import { DataTableBody as P } from "./data-table-body.js";
+import { useDataTable as Q } from "./hooks/use-data-table.js";
+const G = 150, J = _({
   container: {
     position: "relative",
     width: "100%",
-    ...U.overflow("auto")
+    ...M.overflow("auto")
   },
   resizing: {
     cursor: "col-resize",
@@ -25,76 +25,108 @@ const K = 150, X = j({
     tableLayout: "fixed",
     borderCollapse: "separate",
     borderSpacing: 0,
-    fontSize: q,
-    lineHeight: k
+    fontSize: I,
+    lineHeight: A
   }
-}), dt = A.forwardRef(function({ children: T, className: x }, a) {
-  var p;
-  const c = X(), { table: e, disableColumnResizing: W } = J(), D = !W && ((p = e.getState().columnSizingInfo) == null ? void 0 : p.isResizingColumn), f = S(null), u = S(null), [o, v] = z(!1), [m, w] = z(0), L = R(
-    (t) => {
-      f.current = t, typeof a == "function" ? a(t) : a && (a.current = t);
+}), me = H.forwardRef(function({ children: R, className: z }, l) {
+  var h;
+  const c = J(), { table: t, disableColumnResizing: D } = Q(), y = !D && ((h = t.getState().columnSizingInfo) == null ? void 0 : h.isResizingColumn), d = C(null), m = C(null), [o, w] = S(!1), [u, T] = S(0), V = v(
+    (e) => {
+      d.current = e, typeof l == "function" ? l(e) : l && (l.current = e);
     },
-    [a]
+    [l]
   );
-  I(() => {
-    const t = f.current;
-    if (!t || typeof ResizeObserver > "u") return;
+  B(() => {
+    const e = d.current;
+    if (!e || typeof ResizeObserver > "u") return;
     const n = new ResizeObserver((i) => {
-      w(i[0].contentRect.width);
+      T(i[0].contentRect.width);
     });
-    return n.observe(t), () => n.disconnect();
+    return n.observe(e), () => n.disconnect();
   }, []);
-  const b = R(() => {
-    if (u.current && !o) {
-      const t = u.current.querySelectorAll(
+  const b = v(() => {
+    if (m.current && !o) {
+      const e = m.current.querySelectorAll(
         "th:not([data-spacer])"
-      ), n = e.getVisibleLeafColumns();
-      if (t.length === n.length) {
+      ), n = t.getVisibleLeafColumns();
+      if (e.length === n.length) {
         const i = {};
-        t.forEach((d, M) => {
-          const C = n[M];
-          C && (i[C.id] = Math.round(
-            d.getBoundingClientRect().width
+        e.forEach((f, L) => {
+          const x = n[L];
+          x && (i[x.id] = Math.round(
+            f.getBoundingClientRect().width
           ));
-        }), N(() => {
-          v(!0), e.setColumnSizing((d) => ({ ...d, ...i }));
+        }), F(() => {
+          w(!0), t.setColumnSizing((f) => ({ ...f, ...i }));
         });
       }
     }
-  }, [e, o]), V = e.getState().columnSizing, H = e.getState().columnVisibility, s = l(() => e.getVisibleLeafColumns().reduce((n, i) => n + (i.getSize() ?? K), 0), [e, V, H]), h = 4, B = l(() => o ? s ? `${s}px` : `calc(100% - ${h}px)` : `calc(100% - ${h}px)`, [o, s]), g = l(() => !o || !m ? 0 : Math.max(0, m - s), [o, m, s]), E = T ?? /* @__PURE__ */ O(_, { children: [
-    /* @__PURE__ */ r(Q, {}),
-    /* @__PURE__ */ r(G, {})
-  ] }), F = l(
+  }, [t, o]), E = t.getState().columnSizing, W = t.getState().columnVisibility, s = r(() => t.getVisibleLeafColumns().reduce((n, i) => n + (i.getSize() ?? G), 0), [t, E, W]), p = 4, U = r(() => o ? s ? `${s}px` : `calc(100% - ${p}px)` : `calc(100% - ${p}px)`, [o, s]), g = r(() => !o || !u ? 0 : Math.max(0, u - s), [o, u, s]), j = R ?? /* @__PURE__ */ a.jsxDEV(a.Fragment, { children: [
+    /* @__PURE__ */ a.jsxDEV(q, {}, void 0, !1, {
+      fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-content.tsx",
+      lineNumber: 148,
+      columnNumber: 7
+    }, this),
+    /* @__PURE__ */ a.jsxDEV(P, {}, void 0, !1, {
+      fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-content.tsx",
+      lineNumber: 149,
+      columnNumber: 7
+    }, this)
+  ] }, void 0, !0, {
+    fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-content.tsx",
+    lineNumber: 147,
+    columnNumber: 5
+  }, this), k = r(
     () => ({ syncColumnWidthsBeforeResize: b, spacerWidth: g }),
     [b, g]
   );
-  return /* @__PURE__ */ r(P.Provider, { value: F, children: /* @__PURE__ */ r(
+  return /* @__PURE__ */ a.jsxDEV($.Provider, { value: k, children: /* @__PURE__ */ a.jsxDEV(
     "div",
     {
-      ref: L,
+      ref: V,
       "data-slot": "data-table-content",
-      [y]: "data-table-content",
+      [N]: "data-table-content",
       "data-fs-element": "DataTable-Content",
-      className: $(
+      className: O(
         c.container,
-        D && c.resizing,
-        x
+        y && c.resizing,
+        z
       ),
-      children: /* @__PURE__ */ r(
+      children: /* @__PURE__ */ a.jsxDEV(
         "table",
         {
-          ref: u,
+          ref: m,
           "data-slot": "table",
-          [y]: "table",
+          [N]: "table",
           className: c.table,
-          style: { width: B },
-          children: E
-        }
+          style: { width: U },
+          children: j
+        },
+        void 0,
+        !1,
+        {
+          fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-content.tsx",
+          lineNumber: 171,
+          columnNumber: 9
+        },
+        this
       )
-    }
-  ) });
+    },
+    void 0,
+    !1,
+    {
+      fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-content.tsx",
+      lineNumber: 160,
+      columnNumber: 7
+    },
+    this
+  ) }, void 0, !1, {
+    fileName: "/Users/wilianmolinari/repos/volt-ui-rollout/release/packages/experimental-griffel/src/components/data-table/data-table-content.tsx",
+    lineNumber: 159,
+    columnNumber: 5
+  }, this);
 });
 export {
-  dt as DataTableContent
+  me as DataTableContent
 };
 //# sourceMappingURL=data-table-content.js.map

package/dist/components/data-table/data-table-content.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-table-content.js","sources":["../../../src/components/data-table/data-table-content.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { useRef, useMemo, useCallback, useState, useEffect } from \"react\"\nimport { flushSync } from \"react-dom\"\nimport type { ReactNode } from \"react\"\nimport { mergeClasses, shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport { useDataTable } from \"./hooks\"\nimport { DataTableContentContext } from \"./data-table-context\"\nimport { DataTableHeader } from \"./data-table-header\"\nimport { DataTableBody } from \"./data-table-body\"\n\n// TanStack Table's default column width\nconst DEFAULT_COLUMN_WIDTH = 150\n\nconst useStyles = makeVoltStyles({\n  container: {\n    position: \"relative\",\n    width: \"100%\",\n    ...shorthands.overflow(\"auto\"),\n  },\n  resizing: {\n    cursor: \"col-resize\",\n    userSelect: \"none\",\n  },\n  table: {\n    tableLayout: \"fixed\",\n    borderCollapse: \"separate\",\n    borderSpacing: 0,\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n  },\n})\n\nexport type DataTableContentProps = {\n  /** Children to render inside the table (DataTableHeader, DataTableBody) */\n  children?: ReactNode\n  /** Additional class name */\n  className?: string\n}\n\n/**\n * Container component for DataTable that handles the table structure.\n * If no children are provided, renders DataTableHeader and DataTableBody by default.\n */\nexport const DataTableContent = React.forwardRef<\n  HTMLDivElement,\n  DataTableContentProps\n>(function DataTableContent({ children, className }, ref) {\n  const styles = useStyles()\n  const { table, disableColumnResizing } = useDataTable()\n  const enableColumnResizing = !disableColumnResizing\n\n  const isResizing =\n    enableColumnResizing && table.getState().columnSizingInfo?.isResizingColumn\n  const internalContainerRef = useRef<HTMLDivElement>(null!)\n  const tableRef = useRef<HTMLTableElement>(null)\n  const [hasSyncedWidths, setHasSyncedWidths] = useState(false)\n  const [containerWidth, setContainerWidth] = useState(0)\n\n  // Attach ref to internal ref or forwarded ref\n  const handleRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      internalContainerRef.current = node!\n      if (typeof ref === \"function\") {\n        ref(node)\n      } else if (ref) {\n        ;(ref as React.MutableRefObject<HTMLDivElement | null>).current = node\n      }\n    },\n    [ref]\n  )\n\n  // Track container width for spacer calculation\n  useEffect(() => {\n    const container = internalContainerRef.current\n    if (!container || typeof ResizeObserver === \"undefined\") return\n\n    const observer = new ResizeObserver((entries) => {\n      setContainerWidth(entries[0].contentRect.width)\n    })\n    observer.observe(container)\n    return () => observer.disconnect()\n  }, [])\n\n  // Sync visual column widths to stored widths BEFORE resize starts\n  const syncColumnWidthsBeforeResize = useCallback(() => {\n    if (tableRef.current && !hasSyncedWidths) {\n      const headerCells = tableRef.current.querySelectorAll(\n        \"th:not([data-spacer])\"\n      )\n      const columns = table.getVisibleLeafColumns()\n\n      if (headerCells.length === columns.length) {\n        const newSizing: Record<string, number> = {}\n\n        headerCells.forEach((cell, index) => {\n          const column = columns[index]\n          if (column) {\n            newSizing[column.id] = Math.round(\n              cell.getBoundingClientRect().width\n            )\n          }\n        })\n\n        flushSync(() => {\n          setHasSyncedWidths(true)\n          table.setColumnSizing((prev) => ({ ...prev, ...newSizing }))\n        })\n      }\n    }\n  }, [table, hasSyncedWidths])\n\n  // Get column sizing and visibility state to trigger recalculation\n  const columnSizing = table.getState().columnSizing\n  const columnVisibility = table.getState().columnVisibility\n\n  // Calculate total column width from visible columns\n  const calculatedColumnSum = useMemo(() => {\n    const totalWidth = table.getVisibleLeafColumns().reduce((sum, col) => {\n      return sum + (col.getSize() ?? DEFAULT_COLUMN_WIDTH)\n    }, 0)\n    return totalWidth\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [table, columnSizing, columnVisibility])\n\n  const WIDTH_BUFFER = 4\n  const tableWidth = useMemo(() => {\n    if (!hasSyncedWidths) {\n      return `calc(100% - ${WIDTH_BUFFER}px)`\n    }\n    return calculatedColumnSum\n      ? `${calculatedColumnSum}px`\n      : `calc(100% - ${WIDTH_BUFFER}px)`\n  }, [hasSyncedWidths, calculatedColumnSum])\n\n  // Calculate spacer width to fill remaining container space after resize\n  const spacerWidth = useMemo(() => {\n    if (!hasSyncedWidths || !containerWidth) return 0\n    return Math.max(0, containerWidth - calculatedColumnSum)\n  }, [hasSyncedWidths, containerWidth, calculatedColumnSum])\n\n  // If no children, render default header + body\n  const content = children ?? (\n    <>\n      <DataTableHeader />\n      <DataTableBody />\n    </>\n  )\n\n  const contentContextValue = useMemo(\n    () => ({ syncColumnWidthsBeforeResize, spacerWidth }),\n    [syncColumnWidthsBeforeResize, spacerWidth]\n  )\n\n  return (\n    <DataTableContentContext.Provider value={contentContextValue}>\n      <div\n        ref={handleRef}\n        data-slot=\"data-table-content\"\n        {...{ [SLOT_ATTR]: \"data-table-content\" }}\n        data-fs-element=\"DataTable-Content\"\n        className={mergeClasses(\n          styles.container,\n          isResizing && styles.resizing,\n          className\n        )}\n      >\n        <table\n          ref={tableRef}\n          data-slot=\"table\"\n          {...{ [SLOT_ATTR]: \"table\" }}\n          className={styles.table}\n          style={{ width: tableWidth }}\n        >\n          {content}\n        </table>\n      </div>\n    </DataTableContentContext.Provider>\n  )\n})\n"],"names":["DEFAULT_COLUMN_WIDTH","useStyles","makeVoltStyles","shorthands","tokens.textSm","tokens.leadingSm","DataTableContent","React","children","className","ref","styles","table","disableColumnResizing","useDataTable","isResizing","_a","internalContainerRef","useRef","tableRef","hasSyncedWidths","setHasSyncedWidths","useState","containerWidth","setContainerWidth","handleRef","useCallback","node","useEffect","container","observer","entries","syncColumnWidthsBeforeResize","headerCells","columns","newSizing","cell","index","column","flushSync","prev","columnSizing","columnVisibility","calculatedColumnSum","useMemo","sum","col","WIDTH_BUFFER","tableWidth","spacerWidth","content","jsxs","Fragment","jsx","DataTableHeader","DataTableBody","contentContextValue","DataTableContentContext","SLOT_ATTR","mergeClasses"],"mappings":"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"}
+{"version":3,"file":"data-table-content.js","sources":["../../../src/components/data-table/data-table-content.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { useRef, useMemo, useCallback, useState, useEffect } from \"react\"\nimport { flushSync } from \"react-dom\"\nimport type { ReactNode } from \"react\"\nimport { mergeClasses, shorthands } from \"@epilot/volt-ui-runtime\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeVoltStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport { useDataTable } from \"./hooks\"\nimport { DataTableContentContext } from \"./data-table-context\"\nimport { DataTableHeader } from \"./data-table-header\"\nimport { DataTableBody } from \"./data-table-body\"\n\n// TanStack Table's default column width\nconst DEFAULT_COLUMN_WIDTH = 150\n\nconst useStyles = makeVoltStyles({\n  container: {\n    position: \"relative\",\n    width: \"100%\",\n    ...shorthands.overflow(\"auto\"),\n  },\n  resizing: {\n    cursor: \"col-resize\",\n    userSelect: \"none\",\n  },\n  table: {\n    tableLayout: \"fixed\",\n    borderCollapse: \"separate\",\n    borderSpacing: 0,\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n  },\n})\n\nexport type DataTableContentProps = {\n  /** Children to render inside the table (DataTableHeader, DataTableBody) */\n  children?: ReactNode\n  /** Additional class name */\n  className?: string\n}\n\n/**\n * Container component for DataTable that handles the table structure.\n * If no children are provided, renders DataTableHeader and DataTableBody by default.\n */\nexport const DataTableContent = React.forwardRef<\n  HTMLDivElement,\n  DataTableContentProps\n>(function DataTableContent({ children, className }, ref) {\n  const styles = useStyles()\n  const { table, disableColumnResizing } = useDataTable()\n  const enableColumnResizing = !disableColumnResizing\n\n  const isResizing =\n    enableColumnResizing && table.getState().columnSizingInfo?.isResizingColumn\n  const internalContainerRef = useRef<HTMLDivElement>(null!)\n  const tableRef = useRef<HTMLTableElement>(null)\n  const [hasSyncedWidths, setHasSyncedWidths] = useState(false)\n  const [containerWidth, setContainerWidth] = useState(0)\n\n  // Attach ref to internal ref or forwarded ref\n  const handleRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      internalContainerRef.current = node!\n      if (typeof ref === \"function\") {\n        ref(node)\n      } else if (ref) {\n        ;(ref as React.MutableRefObject<HTMLDivElement | null>).current = node\n      }\n    },\n    [ref]\n  )\n\n  // Track container width for spacer calculation\n  useEffect(() => {\n    const container = internalContainerRef.current\n    if (!container || typeof ResizeObserver === \"undefined\") return\n\n    const observer = new ResizeObserver((entries) => {\n      setContainerWidth(entries[0].contentRect.width)\n    })\n    observer.observe(container)\n    return () => observer.disconnect()\n  }, [])\n\n  // Sync visual column widths to stored widths BEFORE resize starts\n  const syncColumnWidthsBeforeResize = useCallback(() => {\n    if (tableRef.current && !hasSyncedWidths) {\n      const headerCells = tableRef.current.querySelectorAll(\n        \"th:not([data-spacer])\"\n      )\n      const columns = table.getVisibleLeafColumns()\n\n      if (headerCells.length === columns.length) {\n        const newSizing: Record<string, number> = {}\n\n        headerCells.forEach((cell, index) => {\n          const column = columns[index]\n          if (column) {\n            newSizing[column.id] = Math.round(\n              cell.getBoundingClientRect().width\n            )\n          }\n        })\n\n        flushSync(() => {\n          setHasSyncedWidths(true)\n          table.setColumnSizing((prev) => ({ ...prev, ...newSizing }))\n        })\n      }\n    }\n  }, [table, hasSyncedWidths])\n\n  // Get column sizing and visibility state to trigger recalculation\n  const columnSizing = table.getState().columnSizing\n  const columnVisibility = table.getState().columnVisibility\n\n  // Calculate total column width from visible columns\n  const calculatedColumnSum = useMemo(() => {\n    const totalWidth = table.getVisibleLeafColumns().reduce((sum, col) => {\n      return sum + (col.getSize() ?? DEFAULT_COLUMN_WIDTH)\n    }, 0)\n    return totalWidth\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [table, columnSizing, columnVisibility])\n\n  const WIDTH_BUFFER = 4\n  const tableWidth = useMemo(() => {\n    if (!hasSyncedWidths) {\n      return `calc(100% - ${WIDTH_BUFFER}px)`\n    }\n    return calculatedColumnSum\n      ? `${calculatedColumnSum}px`\n      : `calc(100% - ${WIDTH_BUFFER}px)`\n  }, [hasSyncedWidths, calculatedColumnSum])\n\n  // Calculate spacer width to fill remaining container space after resize\n  const spacerWidth = useMemo(() => {\n    if (!hasSyncedWidths || !containerWidth) return 0\n    return Math.max(0, containerWidth - calculatedColumnSum)\n  }, [hasSyncedWidths, containerWidth, calculatedColumnSum])\n\n  // If no children, render default header + body\n  const content = children ?? (\n    <>\n      <DataTableHeader />\n      <DataTableBody />\n    </>\n  )\n\n  const contentContextValue = useMemo(\n    () => ({ syncColumnWidthsBeforeResize, spacerWidth }),\n    [syncColumnWidthsBeforeResize, spacerWidth]\n  )\n\n  return (\n    <DataTableContentContext.Provider value={contentContextValue}>\n      <div\n        ref={handleRef}\n        data-slot=\"data-table-content\"\n        {...{ [SLOT_ATTR]: \"data-table-content\" }}\n        data-fs-element=\"DataTable-Content\"\n        className={mergeClasses(\n          styles.container,\n          isResizing && styles.resizing,\n          className\n        )}\n      >\n        <table\n          ref={tableRef}\n          data-slot=\"table\"\n          {...{ [SLOT_ATTR]: \"table\" }}\n          className={styles.table}\n          style={{ width: tableWidth }}\n        >\n          {content}\n        </table>\n      </div>\n    </DataTableContentContext.Provider>\n  )\n})\n"],"names":["DEFAULT_COLUMN_WIDTH","useStyles","makeVoltStyles","shorthands","tokens.textSm","tokens.leadingSm","DataTableContent","React","children","className","ref","styles","table","disableColumnResizing","useDataTable","isResizing","_a","internalContainerRef","useRef","tableRef","hasSyncedWidths","setHasSyncedWidths","useState","containerWidth","setContainerWidth","handleRef","useCallback","node","useEffect","container","observer","entries","syncColumnWidthsBeforeResize","headerCells","columns","newSizing","cell","index","column","flushSync","prev","columnSizing","columnVisibility","calculatedColumnSum","useMemo","sum","col","WIDTH_BUFFER","tableWidth","spacerWidth","content","jsxDEV","Fragment","DataTableHeader","DataTableBody","contentContextValue","DataTableContentContext","SLOT_ATTR","mergeClasses"],"mappings":"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"}