@bigbinary/neeto-atoms 1.0.47 → 1.0.48

package/dist/{DataTable-DX5y8WcM.js → DataTable-CHxdhAU2.js}

@@ -3233,12 +3233,13 @@ const getResizeColumnStyle = ({
   enableResize,
   pinned,
   pinnedStart,
-  pinnedEnd
+  pinnedEnd,
+  percentageWidth
 }) => ({
-  width: isLastDataCol ? void 0 : size,
+  width: isLastDataCol ? void 0 : percentageWidth && !isSelectionCol ? percentageWidth : size,
   ...enableResize ? {
     minWidth: size,
-    ...!isSelectionCol && !isLastDataCol ? { maxWidth: size } : {}
+    ...!isSelectionCol && !isLastDataCol && !percentageWidth ? { maxWidth: size } : {}
   } : {},
   ...pinned === "left" ? { left: pinnedStart } : {},
   ...pinned === "right" ? { right: pinnedEnd } : {}
@@ -3649,16 +3650,22 @@ const useColumnResize = ({
     };
   }, [enabled, scrollContainerRef]);
   useLayoutEffect(() => {
-    if (!enabled || containerWidth === 0) return;
+    if (!enabled) return;
+    const container = scrollContainerRef.current;
+    const measuredWidth = Math.max(
+      container ? Math.round(container.clientWidth) : 0,
+      containerWidth
+    );
+    if (measuredWidth === 0) return;
     const leafColumns = table.getAllLeafColumns().filter((col) => col.id !== "_selection");
     let reservedWidth = 0;
     if (hasSelectionColumn) {
-      const firstTh = scrollContainerRef.current?.querySelector("thead th");
+      const firstTh = container?.querySelector("thead th");
       if (firstTh) {
         reservedWidth = firstTh.getBoundingClientRect().width;
       }
     }
-    const availableWidth = containerWidth - reservedWidth;
+    const availableWidth = measuredWidth - reservedWidth;
     let userResizedTotal = 0;
     let autoDefaultTotal = 0;
     const visibleIds = new Set(leafColumns.map((col) => col.id));
@@ -4205,6 +4212,8 @@ const DataTable = ({
   const leafColumns = table.getVisibleLeafColumns();
   const lastLeftPinnedId = leafColumns.filter((col) => col.getIsPinned() === "left").at(-1)?.id;
   const firstRightPinnedId = leafColumns.filter((col) => col.getIsPinned() === "right").at(0)?.id;
+  const hasProportionalSizing = enableColumnResize && Object.keys(columnSizing).length > 0;
+  const totalDefaultSize = hasProportionalSizing ? 0 : leafColumns.filter((col) => col.id !== "_selection").reduce((sum, col) => sum + (col.columnDef.size ?? 150), 0);
   return /* @__PURE__ */ jsxs("div", { className: cn("relative flex min-h-0 w-full flex-col", className), children: [
     loading && /* @__PURE__ */ jsx(LoadingOverlay, {}),
     (showSelectAllCallout || showAllSelectedCallout) && /* @__PURE__ */ jsx(
@@ -4256,7 +4265,8 @@ const DataTable = ({
                     enableResize: enableColumnResize,
                     pinned: isPinned,
                     pinnedStart: header.column.getStart("left"),
-                    pinnedEnd: header.column.getAfter("right")
+                    pinnedEnd: header.column.getAfter("right"),
+                    percentageWidth: !hasProportionalSizing && totalDefaultSize > 0 ? `${(header.column.columnDef.size ?? 150) / totalDefaultSize * 100}%` : void 0
                   }),
                   onClick: header.column.getCanSort() ? header.column.getToggleSortingHandler() : void 0,
                   children: [
@@ -4329,7 +4339,8 @@ const DataTable = ({
                       enableResize: enableColumnResize,
                       pinned: isPinned,
                       pinnedStart: cell.column.getStart("left"),
-                      pinnedEnd: cell.column.getAfter("right")
+                      pinnedEnd: cell.column.getAfter("right"),
+                      percentageWidth: !hasProportionalSizing && totalDefaultSize > 0 ? `${(cell.column.columnDef.size ?? 150) / totalDefaultSize * 100}%` : void 0
                     }),
                     children: flexRender(
                       cell.column.columnDef.cell,
@@ -4357,4 +4368,4 @@ const DataTable = ({
 };
 
 export { DataTable as D, useColumnPinning as a, useColumnVisibility as b, useTablePagination as c, useTableSelection as d, useTableSort as e, useColumnOrdering as u };
-//# sourceMappingURL=DataTable-DX5y8WcM.js.map
+//# sourceMappingURL=DataTable-CHxdhAU2.js.map