@versini/ui-datagrid 0.3.7 → 0.3.8

package/dist/DataGrid/DataGrid.js

@@ -1,13 +1,13 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo, useState } from "react";
 import { BlurEffects } from "../DataGridConstants/DataGridConstants.js";
+import { getDataGridClasses } from "../utilities/classes.js";
 import { DataGridContext } from "./DataGridContext.js";
-import { getDataGridClasses } from "./utilities.js";
 
 ;// CONCATENATED MODULE: external "react/jsx-runtime"
 
@@ -15,9 +15,9 @@ import { getDataGridClasses } from "./utilities.js";
 
 ;// CONCATENATED MODULE: external "../DataGridConstants/DataGridConstants.js"
 
-;// CONCATENATED MODULE: external "./DataGridContext.js"
+;// CONCATENATED MODULE: external "../utilities/classes.js"
 
-;// CONCATENATED MODULE: external "./utilities.js"
+;// CONCATENATED MODULE: external "./DataGridContext.js"
 
 ;// CONCATENATED MODULE: ./src/DataGrid/DataGrid.tsx
 
@@ -42,9 +42,9 @@ import { getDataGridClasses } from "./utilities.js";
 	 */ const [headerHeight, setHeaderHeight] = useState(0);
     const [footerHeight, setFooterHeight] = useState(0);
     /**
-	 * Track measured column widths from the body. Used by sticky header/footer
-	 * to sync column widths since absolutely positioned elements can't use
-	 * CSS subgrid.
+	 * Track measured column widths from the body. Used by sticky header/footer to
+	 * sync column widths since absolutely positioned elements can't use CSS
+	 * subgrid.
 	 */ const [measuredColumnWidths, setMeasuredColumnWidths] = useState([]);
     /**
 	 * Registration callbacks with stable references. Called by

package/dist/DataGrid/DataGridContext.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGrid/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridAnimated/AnimatedWrapper.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridAnimated/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridAnimated/useAnimatedHeight.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridBody/DataGridBody.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 
@@ -32,17 +32,19 @@ import { CellWrapper } from "../DataGridConstants/index.js";
     const bodyRef = useRef(null);
     /**
 	 * Measure column widths from the first body row's cells. This is needed
-	 * because sticky header/footer are absolutely positioned and can't use
-	 * CSS subgrid. We measure the body cells (which ARE in the grid flow)
-	 * and report the widths so header/footer can use the same pixel values.
+	 * because sticky header/footer are absolutely positioned and can't use CSS
+	 * subgrid. We measure the body cells (which ARE in the grid flow) and report
+	 * the widths so header/footer can use the same pixel values.
 	 */ useLayoutEffect(()=>{
         const element = bodyRef.current;
         const needsMeasurement = ctx.columns && (ctx.stickyHeader || ctx.stickyFooter);
         if (!element || !needsMeasurement || !ctx.setMeasuredColumnWidths) {
             return;
         }
-        // Find the first row and its cells once, reuse for both measurement and observation
-        const firstRow = element.querySelector('[role="row"]');
+        /**
+		 * Find the first row and its cells once, reuse for both measurement and
+		 * observation.
+		 */ const firstRow = element.querySelector('[role="row"]');
         if (!firstRow) {
             return;
         }
@@ -51,19 +53,19 @@ import { CellWrapper } from "../DataGridConstants/index.js";
             return;
         }
         const measureColumns = ()=>{
-            // Measure each cell's width
+            // Measure each cell's width.
             const widths = Array.from(cells).map((cell)=>cell.getBoundingClientRect().width);
             ctx.setMeasuredColumnWidths?.(widths);
         };
-        // Initial measurement
+        // Initial measurement.
         measureColumns();
-        // Set up ResizeObserver to re-measure when cells resize
+        // Set up ResizeObserver to re-measure when cells resize.
         const observer = new ResizeObserver(()=>{
             measureColumns();
         });
-        // Observe the body element for any size changes
+        // Observe the body element for any size changes.
         observer.observe(element);
-        // Also observe the first row's cells directly for more accurate updates
+        // Also observe the first row's cells directly for more accurate updates.
         for (const cell of cells){
             observer.observe(cell);
         }

package/dist/DataGridBody/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridCell/DataGridCell.d.ts

@@ -1,12 +1,2 @@
 import type { DataGridCellProps } from "../DataGrid/DataGridTypes";
-import { type CellWrapperType, type ThemeMode } from "../DataGridConstants";
-export declare const getCellClasses: ({ cellWrapper, className, compact, align, mode, borderLeft, borderRight, }: {
-    cellWrapper?: CellWrapperType;
-    className?: string;
-    mode?: ThemeMode;
-    compact?: boolean;
-    align?: "left" | "center" | "right";
-    borderLeft?: boolean;
-    borderRight?: boolean;
-}) => string;
 export declare const DataGridCell: ({ className, children, align, borderLeft, borderRight, colSpan, style, ...rest }: DataGridCellProps) => import("react/jsx-runtime").JSX.Element;

package/dist/DataGridCell/DataGridCell.js

@@ -1,76 +1,22 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 
 import { jsx } from "react/jsx-runtime";
-import { clsx } from "clsx";
 import { DataGridContext } from "../DataGrid/DataGridContext.js";
-import { CellWrapper } from "../DataGridConstants/index.js";
+import { getCellClasses, getCellRole } from "../utilities/classes.js";
 
 ;// CONCATENATED MODULE: external "react/jsx-runtime"
 
-;// CONCATENATED MODULE: external "clsx"
-
 ;// CONCATENATED MODULE: external "../DataGrid/DataGridContext.js"
 
-;// CONCATENATED MODULE: external "../DataGridConstants/index.js"
+;// CONCATENATED MODULE: external "../utilities/classes.js"
 
 ;// CONCATENATED MODULE: ./src/DataGridCell/DataGridCell.tsx
 
 
 
-
-const getCellClasses = ({ cellWrapper, className, compact, align, mode, borderLeft, borderRight })=>{
-    const isHeader = cellWrapper === CellWrapper.HEADER;
-    const mainClasses = clsx(// Base padding.
-    {
-        "px-2 py-1": compact,
-        "px-4 py-3": !compact
-    }, // Text alignment.
-    {
-        "text-left justify-start": align === "left" || !align,
-        "text-center justify-center": align === "center",
-        "text-right justify-end": align === "right"
-    }, // Header/footer specific styles.
-    {
-        "font-semibold": isHeader
-    }, /**
-		 * Active row indicator (left border on first cell only).
-		 * Uses CSS group-data-[active] to detect when parent row has data-active attribute.
-		 * The `first:` variant ensures only the first cell in the row shows the indicator.
-		 */ "first:group-data-[active]:relative", "first:group-data-[active]:before:absolute first:group-data-[active]:before:left-0 first:group-data-[active]:before:top-0 first:group-data-[active]:before:bottom-0 first:group-data-[active]:before:w-1", "first:group-data-[active]:self-stretch first:group-data-[active]:flex first:group-data-[active]:items-center", // Active indicator color based on theme mode.
-    {
-        "first:group-data-[active]:before:bg-table-active-dark": mode === "dark",
-        "first:group-data-[active]:before:bg-table-active-light": mode === "light",
-        "first:group-data-[active]:before:bg-table-active-dark dark:first:group-data-[active]:before:bg-table-active-light": mode === "system",
-        "first:group-data-[active]:before:bg-table-active-light dark:first:group-data-[active]:before:bg-table-active-dark": mode === "alt-system"
-    }, /**
-		 * Vertical borders. self-stretch ensures border spans full row height in
-		 * grid layout. When stretching, use flex + items-center to maintain
-		 * vertical centering of content.
-		 */ {
-        "self-stretch flex items-center": borderLeft || borderRight,
-        "border-l border-l-table-dark": borderLeft && mode === "dark",
-        "border-l border-l-table-light": borderLeft && mode === "light",
-        "border-l border-l-table-dark dark:border-l-table-light": borderLeft && mode === "system",
-        "border-l border-l-table-light dark:border-l-table-dark": borderLeft && mode === "alt-system",
-        "border-r border-r-table-dark": borderRight && mode === "dark",
-        "border-r border-r-table-light": borderRight && mode === "light",
-        "border-r border-r-table-dark dark:border-r-table-light": borderRight && mode === "system",
-        "border-r border-r-table-light dark:border-r-table-dark": borderRight && mode === "alt-system"
-    }, className);
-    return mainClasses;
-};
-/**
- * Returns the appropriate ARIA role for the cell based on the cell wrapper
- * type.
- */ const getCellRole = (cellWrapper)=>{
-    if (cellWrapper === CellWrapper.HEADER) {
-        return "columnheader";
-    }
-    return "gridcell";
-};
 /* =============================================================================
  * DataGridCell
  * ========================================================================== */ const DataGridCell = ({ className, children, align, borderLeft, borderRight, colSpan, style, ...rest })=>{
@@ -102,4 +48,4 @@ const getCellClasses = ({ cellWrapper, className, compact, align, mode, borderLe
     });
 };
 
-export { DataGridCell, getCellClasses };
+export { DataGridCell };

package/dist/DataGridCell/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridCellSort/DataGridCellSort.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 
@@ -8,7 +8,7 @@ import { ButtonSort_private } from "@versini/ui-button/private";
 import { IconSort, IconSortDown, IconSortUp } from "@versini/ui-icons";
 import clsx from "clsx";
 import { DataGridContext } from "../DataGrid/DataGridContext.js";
-import { getCellClasses } from "../DataGridCell/DataGridCell.js";
+import { getCellClasses } from "../utilities/classes.js";
 
 ;// CONCATENATED MODULE: external "react/jsx-runtime"
 
@@ -20,7 +20,7 @@ import { getCellClasses } from "../DataGridCell/DataGridCell.js";
 
 ;// CONCATENATED MODULE: external "../DataGrid/DataGridContext.js"
 
-;// CONCATENATED MODULE: external "../DataGridCell/DataGridCell.js"
+;// CONCATENATED MODULE: external "../utilities/classes.js"
 
 ;// CONCATENATED MODULE: ./src/DataGridCellSort/DataGridCellSort.tsx
 

package/dist/DataGridCellSort/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridConstants/DataGridConstants.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridConstants/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridFooter/DataGridFooter.d.ts

@@ -1,19 +1,4 @@
 import type { DataGridFooterProps } from "../DataGrid/DataGridTypes";
-import { type BlurEffect, type ThemeMode } from "../DataGridConstants/DataGridConstants";
-/**
- * Generates classes for the DataGridFooter.
- *
- * When columns are provided (subgrid mode), uses display:contents so the footer
- * doesn't break the parent grid flow.
- *
- */
-export declare const getFooterClasses: ({ className, stickyFooter, mode, blurEffect, hasColumns, }: {
-    mode: ThemeMode;
-    blurEffect?: BlurEffect;
-    className?: string;
-    hasColumns?: boolean;
-    stickyFooter?: boolean;
-}) => string;
 export declare const DataGridFooter: {
     ({ className, children, ...rest }: DataGridFooterProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/dist/DataGridFooter/DataGridFooter.js

@@ -1,66 +1,30 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 
 import { jsx } from "react/jsx-runtime";
-import clsx from "clsx";
 import { useEffect, useLayoutEffect, useRef } from "react";
-import { getHeaderFooterBackgroundClasses, getStickyBlurClasses } from "../common/utilities.js";
 import { DataGridContext } from "../DataGrid/DataGridContext.js";
-import { BlurEffects, CellWrapper } from "../DataGridConstants/DataGridConstants.js";
+import { CellWrapper } from "../DataGridConstants/DataGridConstants.js";
+import { getFooterClasses } from "../utilities/classes.js";
 
 ;// CONCATENATED MODULE: external "react/jsx-runtime"
 
-;// CONCATENATED MODULE: external "clsx"
-
 ;// CONCATENATED MODULE: external "react"
 
-;// CONCATENATED MODULE: external "../common/utilities.js"
-
 ;// CONCATENATED MODULE: external "../DataGrid/DataGridContext.js"
 
 ;// CONCATENATED MODULE: external "../DataGridConstants/DataGridConstants.js"
 
-;// CONCATENATED MODULE: ./src/DataGridFooter/DataGridFooter.tsx
+;// CONCATENATED MODULE: external "../utilities/classes.js"
 
+;// CONCATENATED MODULE: ./src/DataGridFooter/DataGridFooter.tsx
 
 
 
 
 
-/**
- * Generates classes for the DataGridFooter.
- *
- * When columns are provided (subgrid mode), uses display:contents so the footer
- * doesn't break the parent grid flow.
- *
- */ const getFooterClasses = ({ className, stickyFooter, mode, blurEffect, hasColumns })=>{
-    /**
-	 * When columns are provided and not sticky, use display:contents so the
-	 * rowgroup doesn't interfere with the grid flow. The rows will use subgrid.
-	 */ if (hasColumns && !stickyFooter) {
-        return clsx("contents", className);
-    }
-    const hasBlur = Boolean(blurEffect && blurEffect !== BlurEffects.NONE);
-    return clsx("flex flex-col", {
-        /**
-			 * Absolute positioning like Panel's footer: absolute left-0 right-0 z-20
-			 * bottom-0 rounded-b-lg to match the wrapper's rounded-lg corners.
-			 */ "absolute left-0 right-0 z-20 bottom-0 rounded-b-lg": stickyFooter,
-        // Shadow for visual depth (upward glow).
-        "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": stickyFooter && mode === "dark",
-        "shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem] dark:shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": stickyFooter && mode === "system",
-        "shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem]": stickyFooter && mode === "light",
-        "shadow-[rgb(65_65_65_/30%)_0_-0.5rem_1rem] dark:shadow-[rgb(190_190_190_/20%)_0_-0.5rem_1rem]": stickyFooter && mode === "alt-system"
-    }, getHeaderFooterBackgroundClasses({
-        mode,
-        hasBlur,
-        sticky: Boolean(stickyFooter)
-    }), stickyFooter && getStickyBlurClasses({
-        blurEffect
-    }), className);
-};
 /* =============================================================================
  * DataGridFooter
  * ========================================================================== */ const DataGridFooter = ({ className, children, ...rest })=>{
@@ -133,4 +97,4 @@ DataGridFooter.displayName = "DataGridFooter";
     });
 };
 
-export { DataGridFooter, getFooterClasses };
+export { DataGridFooter };

package/dist/DataGridFooter/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridHeader/DataGridHeader.d.ts

@@ -1,31 +1,4 @@
 import type { DataGridHeaderProps } from "../DataGrid/DataGridTypes";
-import { type BlurEffect, type ThemeMode } from "../DataGridConstants/DataGridConstants";
-/**
- * Generates classes for the DataGridHeader wrapper.
- *
- * When stickyHeader is true, uses position:absolute so the header overlays the
- * scrollbar area. The parent DataGrid auto-detects caption presence and applies
- * appropriate padding to the scrollable content.
- *
- * When columns are provided (subgrid mode) and not sticky, uses
- * display:contents so the header doesn't break the parent grid flow.
- *
- */
-export declare const getHeaderClasses: ({ className, stickyHeader, mode, blurEffect, hasColumns, }: {
-    mode: ThemeMode;
-    blurEffect?: BlurEffect;
-    className?: string;
-    hasColumns?: boolean;
-    stickyHeader?: boolean;
-}) => string;
-/**
- * Generates classes for the caption element inside DataGridHeader. When
- * hasColumns is true (subgrid mode), adds col-span-full to span all columns.
- */
-export declare const getCaptionClasses: ({ captionClassName, hasColumns, }: {
-    captionClassName?: string;
-    hasColumns?: boolean;
-}) => string;
 export declare const DataGridHeader: {
     ({ caption, captionClassName, className, children, ...rest }: DataGridHeaderProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/dist/DataGridHeader/DataGridHeader.js

@@ -1,78 +1,30 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 
 import { jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
 import { useEffect, useId, useLayoutEffect, useRef } from "react";
-import { getHeaderFooterBackgroundClasses, getHeaderFooterCopyClasses, getStickyBlurClasses } from "../common/utilities.js";
 import { DataGridContext } from "../DataGrid/DataGridContext.js";
-import { BlurEffects, CellWrapper } from "../DataGridConstants/DataGridConstants.js";
+import { CellWrapper } from "../DataGridConstants/DataGridConstants.js";
+import { getCaptionClasses, getHeaderClasses } from "../utilities/classes.js";
 
 ;// CONCATENATED MODULE: external "react/jsx-runtime"
 
-;// CONCATENATED MODULE: external "clsx"
-
 ;// CONCATENATED MODULE: external "react"
 
-;// CONCATENATED MODULE: external "../common/utilities.js"
-
 ;// CONCATENATED MODULE: external "../DataGrid/DataGridContext.js"
 
 ;// CONCATENATED MODULE: external "../DataGridConstants/DataGridConstants.js"
 
-;// CONCATENATED MODULE: ./src/DataGridHeader/DataGridHeader.tsx
+;// CONCATENATED MODULE: external "../utilities/classes.js"
 
+;// CONCATENATED MODULE: ./src/DataGridHeader/DataGridHeader.tsx
 
 
 
 
 
-/**
- * Generates classes for the DataGridHeader wrapper.
- *
- * When stickyHeader is true, uses position:absolute so the header overlays the
- * scrollbar area. The parent DataGrid auto-detects caption presence and applies
- * appropriate padding to the scrollable content.
- *
- * When columns are provided (subgrid mode) and not sticky, uses
- * display:contents so the header doesn't break the parent grid flow.
- *
- */ const getHeaderClasses = ({ className, stickyHeader, mode, blurEffect, hasColumns })=>{
-    const hasBlur = Boolean(blurEffect && blurEffect !== BlurEffects.NONE);
-    /**
-	 * When columns are provided and not sticky, use display:contents so the
-	 * rowgroup doesn't interfere with the grid flow. The rows will use subgrid.
-	 */ if (hasColumns && !stickyHeader) {
-        return clsx("contents", getHeaderFooterBackgroundClasses({
-            mode,
-            hasBlur,
-            sticky: Boolean(stickyHeader)
-        }), getHeaderFooterCopyClasses({
-            mode
-        }), className);
-    }
-    return clsx("flex flex-col", {
-        // Absolute positioning to overlay scrollbar, matching footer behavior.
-        "absolute left-0 right-0 z-20 top-0 rounded-t-lg": stickyHeader
-    }, getHeaderFooterBackgroundClasses({
-        mode,
-        hasBlur,
-        sticky: Boolean(stickyHeader)
-    }), getHeaderFooterCopyClasses({
-        mode
-    }), stickyHeader && getStickyBlurClasses({
-        blurEffect
-    }), className);
-};
-/**
- * Generates classes for the caption element inside DataGridHeader. When
- * hasColumns is true (subgrid mode), adds col-span-full to span all columns.
- */ const getCaptionClasses = ({ captionClassName, hasColumns })=>{
-    return clsx("py-2 text-sm text-center font-bold", // In subgrid mode, caption needs to span all columns.
-    hasColumns && "col-span-full", captionClassName);
-};
 /* =============================================================================
  * DataGridHeader
  * ========================================================================== */ const DataGridHeader = ({ caption, captionClassName, className, children, ...rest })=>{
@@ -174,4 +126,4 @@ DataGridHeader.displayName = "DataGridHeader";
     });
 };
 
-export { DataGridHeader, getCaptionClasses, getHeaderClasses };
+export { DataGridHeader };

package/dist/DataGridHeader/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridInfinite/InfiniteScrollMarker.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridInfinite/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridInfinite/useInfiniteScroll.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 

package/dist/DataGridRow/DataGridRow.js

@@ -1,55 +1,30 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */
 
 import { jsx } from "react/jsx-runtime";
-import clsx from "clsx";
 import react from "react";
 import { DataGridContext } from "../DataGrid/DataGridContext.js";
 import { CellWrapper } from "../DataGridConstants/index.js";
+import { getRowClasses } from "../utilities/classes.js";
 
 ;// CONCATENATED MODULE: external "react/jsx-runtime"
 
-;// CONCATENATED MODULE: external "clsx"
-
 ;// CONCATENATED MODULE: external "react"
 
 ;// CONCATENATED MODULE: external "../DataGrid/DataGridContext.js"
 
 ;// CONCATENATED MODULE: external "../DataGridConstants/index.js"
 
+;// CONCATENATED MODULE: external "../utilities/classes.js"
+
 ;// CONCATENATED MODULE: ./src/DataGridRow/DataGridRow.tsx
 
 
 
 
 
-const getRowClasses = ({ mode, className, cellWrapper })=>{
-    // Always use CSS Grid for proper column alignment, with vertical centering.
-    // `group` enables child cells to use group-data-[active] for active row indicator.
-    const layoutClass = "group grid items-center";
-    if (cellWrapper === CellWrapper.HEADER || cellWrapper === CellWrapper.FOOTER) {
-        /**
-		 * When in a sticky header/footer, don't apply background to row since the
-		 * background is applied to the rowgroup for blur effect to work.
-		 */ return clsx(layoutClass, className);
-    }
-    return clsx(layoutClass, "border-b last:border-0", {
-        "border-table-dark": mode === "dark" || mode === "system",
-        "border-table-light": mode === "light" || mode === "alt-system",
-        "dark:border-table-light": mode === "system",
-        "dark:border-table-dark": mode === "alt-system",
-        "odd:bg-table-dark-odd even:bg-table-dark-even": mode === "dark",
-        "hover:bg-table-dark-hover": mode === "dark",
-        "odd:bg-table-light-odd even:bg-table-light-even": mode === "light",
-        "hover:bg-table-light-hover": mode === "light",
-        "odd:bg-table-dark-odd even:bg-table-dark-even dark:odd:bg-table-light-odd dark:even:bg-table-light-even": mode === "system",
-        "hover:bg-table-dark-hover dark:hover:bg-table-light-hover": mode === "system",
-        "odd:bg-table-light-odd even:bg-table-light-even dark:odd:bg-table-dark-odd dark:even:bg-table-dark-even": mode === "alt-system",
-        "hover:bg-table-light-hover dark::hover:bg-table-dark-hover": mode === "alt-system"
-    }, className);
-};
 /* =============================================================================
  * DataGridRow
  * ========================================================================== */ const DataGridRow = ({ className, children, active, style: userStyle, ...rest })=>{
@@ -79,11 +54,12 @@ const getRowClasses = ({ mode, className, cellWrapper })=>{
 				 */ let rowStyle;
             if (columns) {
                 if (isInStickyContext) {
-                    // Sticky elements can't use subgrid.
-                    // Use measured widths from body if available for perfect alignment.
-                    // Also check that widths are valid (non-zero) - in test environments
-                    // or before layout, measurements may be zero.
-                    const hasValidMeasurements = measuredColumnWidths && measuredColumnWidths.length === columns.length && measuredColumnWidths.some((w)=>w > 0);
+                    /**
+						 * Sticky elements can't use subgrid. Use measured widths from body if
+						 * available for perfect alignment. Also check that widths are valid
+						 * (non-zero) - in test environments or before layout, measurements may be
+						 * zero.
+						 */ const hasValidMeasurements = measuredColumnWidths && measuredColumnWidths.length === columns.length && measuredColumnWidths.some((w)=>w > 0);
                     if (hasValidMeasurements) {
                         rowStyle = {
                             gridTemplateColumns: measuredColumnWidths.map((w)=>`${w}px`).join(" ")

package/dist/DataGridRow/index.js

@@ -1,5 +1,5 @@
 /*!
-  @versini/ui-datagrid v0.3.7
+  @versini/ui-datagrid v0.3.8
   © 2026 gizmette.com
 */