simple-table-core 0.6.2 → 0.6.3

package/dist/components/Animate.d.ts

@@ -1,9 +1,17 @@
-import { RefObject } from "react";
+import React, { RefObject } from "react";
+import HeaderObject from "../types/HeaderObject";
+export declare const TEST_KEY = "productId";
 interface AnimateProps {
     allowHorizontalAnimate?: boolean;
-    children: any;
+    children: React.ReactNode | React.ReactNode[];
+    draggedHeaderRef?: RefObject<HeaderObject | null>;
+    headersRef: RefObject<HeaderObject[]>;
+    isBody?: boolean;
     pauseAnimation?: boolean;
-    tableRef: RefObject<HTMLDivElement>;
+    rowIndex: number;
+    tableRef: RefObject<HTMLDivElement | null>;
 }
-declare const Animate: ({ allowHorizontalAnimate, children, pauseAnimation, tableRef, }: AnimateProps) => any;
-export default Animate;
+declare const AnimateWrapper: ({ allowAnimations, children, ...props }: AnimateProps & {
+    allowAnimations: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+export default AnimateWrapper;

package/dist/components/SimpleTable/PinnedLeftColumns.d.ts

@@ -0,0 +1,2 @@
+declare const PinnedLeftColumns: () => import("react/jsx-runtime").JSX.Element;
+export default PinnedLeftColumns;

package/dist/components/SimpleTable/PinnedRightColumns.d.ts

@@ -0,0 +1,2 @@
+declare const PinnedRightColumns: () => import("react/jsx-runtime").JSX.Element;
+export default PinnedRightColumns;

package/dist/components/SimpleTable/RenderCells.d.ts

@@ -0,0 +1,16 @@
+import Row from "../../types/Row";
+import HeaderObject from "../../types/HeaderObject";
+import TableBodyProps from "../../types/TableBodyProps";
+declare const RenderCells: ({ getBorderClass, handleMouseDown, handleMouseOver, headers, hiddenColumns, isRowExpanded, isSelected, isTopLeftCell, lastGroupRow, onExpandRowClick, pinned, row, rowIndex, shouldDisplayLastColumnCell, ...props }: {
+    depth: number;
+    headers: HeaderObject[];
+    hiddenColumns: Record<string, boolean>;
+    isRowExpanded: (rowId: string | number) => boolean;
+    lastGroupRow?: boolean | undefined;
+    onExpandRowClick: (rowIndex: number) => void;
+    pinned?: "left" | "right" | undefined;
+    row: Row;
+    rowIndex: number;
+    shouldDisplayLastColumnCell: boolean;
+} & Omit<TableBodyProps, "currentRows">) => import("react/jsx-runtime").JSX.Element;
+export default RenderCells;

package/dist/components/SimpleTable/SimpleTable.d.ts

@@ -1,56 +1,60 @@
 import { ReactNode } from "react";
 import HeaderObject from "../../types/HeaderObject";
-import CellValue from "../../types/CellValue";
 import CellChangeProps from "../../types/CellChangeProps";
 import "../../styles/simple-table.css";
 import Theme from "../../types/Theme";
-interface SpreadsheetProps {
-  columnEditorPosition?: "left" | "right";
-  columnEditorText?: string;
-  columnResizing?: boolean;
-  defaultHeaders: HeaderObject[];
-  draggable?: boolean;
-  editColumns?: boolean;
-  height?: string;
-  hideFooter?: boolean;
-  nextIcon?: ReactNode;
-  onCellChange?: ({
-    accessor,
-    newValue,
-    originalRowIndex,
-    row,
-  }: CellChangeProps) => void;
-  prevIcon?: ReactNode;
-  rows: {
-    [key: string]: CellValue;
-  }[];
-  rowsPerPage?: number;
-  selectableCells?: boolean;
-  selectableColumns?: boolean;
-  shouldPaginate?: boolean;
-  sortDownIcon?: ReactNode;
-  sortUpIcon?: ReactNode;
-  theme?: Theme;
+import Row from "../../types/Row";
+declare enum ColumnEditorPosition {
+    Left = "left",
+    Right = "right"
 }
-declare const SimpleTable: ({
-  columnEditorPosition,
-  columnEditorText,
-  columnResizing,
-  defaultHeaders,
-  draggable,
-  editColumns,
-  height,
-  hideFooter,
-  nextIcon,
-  onCellChange,
-  prevIcon,
-  rows,
-  rowsPerPage,
-  selectableCells,
-  selectableColumns,
-  shouldPaginate,
-  sortDownIcon,
-  sortUpIcon,
-  theme,
-}: SpreadsheetProps) => import("react/jsx-runtime").JSX.Element;
-export default SimpleTable;
+interface SimpleTableProps {
+    allowAnimations?: boolean;
+    columnEditorPosition?: ColumnEditorPosition;
+    columnEditorText?: string;
+    columnResizing?: boolean;
+    defaultHeaders: HeaderObject[];
+    draggable?: boolean;
+    editColumns?: boolean;
+    editColumnsInitOpen?: boolean;
+    height?: string;
+    hideFooter?: boolean;
+    nextIcon?: ReactNode;
+    onCellChange?: ({ accessor, newValue, originalRowIndex, row }: CellChangeProps) => void;
+    prevIcon?: ReactNode;
+    rows: Row[];
+    rowsPerPage?: number;
+    selectableCells?: boolean;
+    selectableColumns?: boolean;
+    shouldPaginate?: boolean;
+    sortDownIcon?: ReactNode;
+    sortUpIcon?: ReactNode;
+    theme?: Theme;
+}
+declare const _default: import("react").MemoExoticComponent<{
+    ({ allowAnimations, columnEditorPosition, columnEditorText, columnResizing, defaultHeaders, draggable, editColumns, editColumnsInitOpen, height, hideFooter, nextIcon, onCellChange, prevIcon, rows, rowsPerPage, selectableCells, selectableColumns, shouldPaginate, sortDownIcon, sortUpIcon, theme, }: SimpleTableProps): import("react/jsx-runtime").JSX.Element;
+    defaultProps: {
+        allowAnimations: boolean;
+        columnEditorPosition: ColumnEditorPosition;
+        columnEditorText: string;
+        columnResizing: boolean;
+        defaultHeaders: never[];
+        draggable: boolean;
+        editColumns: boolean;
+        editColumnsInitOpen: boolean;
+        height: string;
+        hideFooter: boolean;
+        nextIcon: import("react/jsx-runtime").JSX.Element;
+        onCellChange: () => void;
+        prevIcon: import("react/jsx-runtime").JSX.Element;
+        rows: never[];
+        rowsPerPage: number;
+        selectableCells: boolean;
+        selectableColumns: boolean;
+        shouldPaginate: boolean;
+        sortDownIcon: import("react/jsx-runtime").JSX.Element;
+        sortUpIcon: import("react/jsx-runtime").JSX.Element;
+        theme: string;
+    };
+}>;
+export default _default;

package/dist/components/SimpleTable/TableBody.d.ts

@@ -1,25 +1,3 @@
-import { RefObject } from "react";
-import HeaderObject from "../../types/HeaderObject";
-import CellChangeProps from "../../types/CellChangeProps";
-import { MouseDownProps } from "../../hooks/useSelection";
-interface TableBodyProps {
-    currentRows: {
-        [key: string]: any;
-    }[];
-    getBorderClass: (rowIndex: number, columnIndex: number) => string;
-    handleMouseDown: (props: MouseDownProps) => void;
-    handleMouseOver: (rowIndex: number, columnIndex: number) => void;
-    headers: HeaderObject[];
-    hiddenColumns: Record<string, boolean>;
-    isSelected: (rowIndex: number, columnIndex: number) => boolean;
-    isTopLeftCell: (rowIndex: number, columnIndex: number) => boolean;
-    isWidthDragging: boolean;
-    onCellChange?: (props: CellChangeProps) => void;
-    shouldDisplayLastColumnCell: boolean;
-    shouldPaginate: boolean;
-    tableRef: RefObject<HTMLDivElement>;
-}
-declare const TableBody: ({ currentRows, getBorderClass, handleMouseDown, handleMouseOver, headers, hiddenColumns, isSelected, isTopLeftCell, isWidthDragging, onCellChange, shouldDisplayLastColumnCell, shouldPaginate, tableRef, }: TableBodyProps & {
-    shouldDisplayLastColumnCell: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
+import TableBodyProps from "../../types/TableBodyProps";
+declare const TableBody: (props: TableBodyProps) => import("react/jsx-runtime").JSX.Element;
 export default TableBody;

package/dist/components/SimpleTable/TableCell.d.ts

@@ -1,21 +1,4 @@
 /// <reference types="react" />
-import HeaderObject from "../../types/HeaderObject";
-import CellChangeProps from "../../types/CellChangeProps";
-import CellValue from "../../types/CellValue";
-interface TableCellProps {
-    borderClass: string;
-    colIndex: number;
-    content: CellValue;
-    header: HeaderObject;
-    isSelected: boolean;
-    isTopLeftCell: boolean;
-    onCellChange?: (props: CellChangeProps) => void;
-    onMouseDown: (rowIndex: number, colIndex: number) => void;
-    onMouseOver: (rowIndex: number, colIndex: number) => void;
-    row: {
-        [key: string]: CellValue;
-    };
-    rowIndex: number;
-}
-declare const TableCell: import("react").ForwardRefExoticComponent<TableCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
+import TableCellProps from "../../types/TableCellProps";
+declare const TableCell: import("react").ForwardRefExoticComponent<TableCellProps & import("react").RefAttributes<HTMLDivElement>>;
 export default TableCell;

package/dist/components/SimpleTable/TableColumnEditor/TableColumnEditor.d.ts

@@ -4,6 +4,7 @@ type TableColumnEditorProps = {
     headers: HeaderObject[];
     columnEditorText: string;
     editColumns: boolean;
+    editColumnsInitOpen: boolean;
     position: "left" | "right";
     setHiddenColumns: Dispatch<SetStateAction<{
         [key: string]: boolean;
@@ -12,5 +13,5 @@ type TableColumnEditorProps = {
         [key: string]: boolean;
     };
 };
-declare const TableColumnEditor: ({ columnEditorText, editColumns, headers, position, setHiddenColumns, hiddenColumns, }: TableColumnEditorProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const TableColumnEditor: ({ columnEditorText, editColumns, editColumnsInitOpen, headers, position, setHiddenColumns, hiddenColumns, }: TableColumnEditorProps) => import("react/jsx-runtime").JSX.Element | null;
 export default TableColumnEditor;

package/dist/components/SimpleTable/TableContent.d.ts

@@ -0,0 +1,13 @@
+import { RefObject } from "react";
+import TableBodyProps from "../../types/TableBodyProps";
+import TableHeaderProps from "../../types/TableHeaderProps";
+type OmittedTableProps = "shouldDisplayLastColumnCell" | "pinnedLeftColumns" | "pinnedRightColumns" | "mainTemplateColumns" | "pinnedLeftTemplateColumns" | "pinnedRightTemplateColumns";
+interface TableContentProps extends Omit<TableHeaderProps, OmittedTableProps>, Omit<TableBodyProps, OmittedTableProps> {
+    editColumns: boolean;
+    pinnedLeftRef: RefObject<HTMLDivElement | null>;
+    pinnedRightRef: RefObject<HTMLDivElement | null>;
+    isRowExpanded: (rowId: string | number) => boolean;
+    onExpandRowClick: (rowIndex: number) => void;
+}
+declare const TableContent: ({ allowAnimations, columnResizing, currentRows, draggable, draggedHeaderRef, editColumns, forceUpdate, getBorderClass, handleMouseDown, handleMouseOver, headersRef, hiddenColumns, hoveredHeaderRef, isRowExpanded, isSelected, isTopLeftCell, isWidthDragging, onCellChange, onExpandRowClick, onSort, onTableHeaderDragEnd, pinnedLeftRef, pinnedRightRef, selectableColumns, setIsWidthDragging, setSelectedCells, shouldPaginate, sort, sortDownIcon, sortUpIcon, tableRef, }: TableContentProps) => import("react/jsx-runtime").JSX.Element;
+export default TableContent;

package/dist/components/SimpleTable/TableHeader.d.ts

@@ -1,26 +1,3 @@
-import { Dispatch, ReactNode, RefObject, SetStateAction } from "react";
-import HeaderObject from "../../types/HeaderObject";
-import SortConfig from "../../types/SortConfig";
-import OnSortProps from "../../types/OnSortProps";
-import Row from "../../types/Row";
-interface TableHeaderProps {
-    columnResizing: boolean;
-    currentRows: Row[];
-    draggable: boolean;
-    forceUpdate: () => void;
-    headersRef: React.RefObject<HeaderObject[]>;
-    hiddenColumns: Record<string, boolean>;
-    isWidthDragging: boolean;
-    onSort: OnSortProps;
-    onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
-    selectableColumns: boolean;
-    setIsWidthDragging: Dispatch<SetStateAction<boolean>>;
-    setSelectedCells: Dispatch<React.SetStateAction<Set<string>>>;
-    shouldDisplayLastColumnCell: boolean;
-    sort: SortConfig | null;
-    sortDownIcon?: ReactNode;
-    sortUpIcon?: ReactNode;
-    tableRef: RefObject<HTMLDivElement>;
-}
-declare const TableHeader: ({ columnResizing, currentRows, draggable, forceUpdate, headersRef, hiddenColumns, isWidthDragging, onSort, onTableHeaderDragEnd, selectableColumns, setIsWidthDragging, setSelectedCells, shouldDisplayLastColumnCell, sort, sortDownIcon, sortUpIcon, tableRef, }: TableHeaderProps) => import("react/jsx-runtime").JSX.Element;
+import TableHeaderProps from "../../types/TableHeaderProps";
+declare const TableHeader: ({ allowAnimations, columnResizing, currentRows, draggable, draggedHeaderRef, forceUpdate, headersRef, hiddenColumns, hoveredHeaderRef, isWidthDragging, mainTemplateColumns, onSort, onTableHeaderDragEnd, pinnedLeftColumns, pinnedLeftTemplateColumns, pinnedRightColumns, pinnedRightTemplateColumns, selectableColumns, setIsWidthDragging, setSelectedCells, shouldDisplayLastColumnCell, sort, sortDownIcon, sortUpIcon, tableRef, }: TableHeaderProps) => import("react/jsx-runtime").JSX.Element;
 export default TableHeader;

package/dist/components/SimpleTable/TableHeaderCell.d.ts

@@ -14,6 +14,7 @@ interface TableHeaderCellProps {
     index: number;
     onSort: OnSortProps;
     onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
+    reverse?: boolean;
     selectableColumns: boolean;
     setIsWidthDragging: Dispatch<SetStateAction<boolean>>;
     setSelectedCells: Dispatch<React.SetStateAction<Set<string>>>;

package/dist/components/SimpleTable/TableHorizontalScrollbar.d.ts

@@ -0,0 +1,9 @@
+import { RefObject } from "react";
+import HeaderObject from "../../types/HeaderObject";
+declare const TableHorizontalScrollbar: ({ headersRef, pinnedLeftRef, pinnedRightRef, tableRef, }: {
+    headersRef: RefObject<HeaderObject[]>;
+    pinnedLeftRef: RefObject<HTMLDivElement | null>;
+    pinnedRightRef: RefObject<HTMLDivElement | null>;
+    tableRef: RefObject<HTMLDivElement | null>;
+}) => import("react/jsx-runtime").JSX.Element;
+export default TableHorizontalScrollbar;

package/dist/components/SimpleTable/TableRow.d.ts

@@ -0,0 +1,14 @@
+import Row from "../../types/Row";
+import TableBodyProps from "../../types/TableBodyProps";
+declare const TableRow: ({ depth, getNextRowIndex, index, lastGroupRow, pinned, props, row, }: {
+    depth?: number | undefined;
+    getNextRowIndex: () => number;
+    index: number;
+    lastGroupRow?: boolean | undefined;
+    pinned?: "left" | "right" | undefined;
+    props: Omit<TableBodyProps, "currentRows"> & {
+        onExpandRowClick: (rowIndex: number) => void;
+    };
+    row: Row;
+}) => import("react/jsx-runtime").JSX.Element;
+export default TableRow;

package/dist/components/SimpleTable/TableRowSeparator.d.ts

@@ -1,2 +1,4 @@
-declare const TableRowSeparator: () => import("react/jsx-runtime").JSX.Element;
+declare const TableRowSeparator: ({ lastGroupRow }: {
+    lastGroupRow?: boolean | undefined;
+}) => import("react/jsx-runtime").JSX.Element;
 export default TableRowSeparator;

package/dist/components/SimpleTable/TableSection.d.ts

@@ -0,0 +1,12 @@
+import Row from "../../types/Row";
+import { RefObject } from "react";
+import TableBodyProps from "../../types/TableBodyProps";
+declare const TableSection: ({ rows, templateColumns, pinned, sectionRef, isRowExpanded, onExpandRowClick, ...props }: {
+    rows: Row[];
+    templateColumns: string;
+    pinned?: "left" | "right" | undefined;
+    sectionRef?: RefObject<HTMLDivElement | null> | undefined;
+    isRowExpanded: (rowId: string | number) => boolean;
+    onExpandRowClick: (rowIndex: number) => void;
+} & Omit<TableBodyProps, "currentRows">) => import("react/jsx-runtime").JSX.Element;
+export default TableSection;

package/dist/consts/general-consts.d.ts

@@ -0,0 +1 @@
+export declare const DRAG_THROTTLE_LIMIT = 50;

package/dist/context/TableContext.d.ts

@@ -1,11 +1,7 @@
 /// <reference types="react" />
-import CellValue from "../types/CellValue";
+import Row from "../types/Row";
 declare const TableContext: import("react").Context<{
-    rows: {
-        [key: string]: CellValue;
-    }[];
-    tableRows: {
-        [key: string]: CellValue;
-    }[];
+    rows: Row[];
+    tableRows: Row[];
 }>;
 export default TableContext;

package/dist/helpers/calculateBoundingBoxes.d.ts

@@ -1,13 +1,11 @@
-import { ReactNode } from "react";
-interface BoundingBox {
-    bottom: number;
-    height: number;
-    left: number;
-    right: number;
-    top: number;
-    width: number;
-}
-declare const calculateBoundingBoxes: (children: ReactNode) => {
-    [key: string]: BoundingBox;
+import { MutableRefObject } from "react";
+import BoundingBox from "../types/BoundingBox";
+import HeaderObject from "../types/HeaderObject";
+declare const calculateBoundingBoxes: ({ currentHeaders, draggedHeaderRef, rowIndex, }: {
+    currentHeaders: HeaderObject[];
+    draggedHeaderRef?: MutableRefObject<HeaderObject | null> | undefined;
+    rowIndex: number;
+}) => {
+    [key: string]: false | BoundingBox;
 };
 export default calculateBoundingBoxes;

package/dist/hooks/useDragHandler.d.ts

@@ -0,0 +1,12 @@
+import { DragEvent } from "react";
+import HeaderObject from "../types/HeaderObject";
+import DragHandlerProps from "../types/DragHandlerProps";
+declare const useDragHandler: ({ draggedHeaderRef, headersRef, hoveredHeaderRef, onTableHeaderDragEnd, }: DragHandlerProps) => {
+    handleDragStart: (header: HeaderObject) => void;
+    handleDragOver: ({ event, hoveredHeader, }: {
+        event: DragEvent<HTMLDivElement>;
+        hoveredHeader: HeaderObject;
+    }) => void;
+    handleDragEnd: () => void;
+};
+export default useDragHandler;

package/dist/hooks/usePrevious.d.ts

@@ -1,2 +1,2 @@
-declare const usePrevious: (value: any) => undefined;
+declare const usePrevious: <T>(value: T) => T;
 export default usePrevious;

package/dist/hooks/useSortableData.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import HeaderObject from "../types/HeaderObject";
+import Row from "../types/Row";
+import SortConfig from "../types/SortConfig";
+declare const useSortableData: (tableRows: Row[], headers: HeaderObject[]) => {
+    sort: SortConfig | null;
+    setSort: import("react").Dispatch<import("react").SetStateAction<SortConfig | null>>;
+    sortedRows: Row[];
+    hiddenColumns: Record<string, boolean>;
+    setHiddenColumns: import("react").Dispatch<import("react").SetStateAction<Record<string, boolean>>>;
+};
+export default useSortableData;

package/dist/index.js

@@ -1 +1 @@
-import{jsxs as e,jsx as r,Fragment as n}from"react/jsx-runtime";import o,{useState as t,useRef as a,useCallback as l,useEffect as c,useMemo as s,Children as d,useLayoutEffect as i,forwardRef as u,createRef as b,createContext as v,useContext as f,Fragment as g,useReducer as p}from"react";var h=function(){return h=Object.assign||function(e){for(var r,n=1,o=arguments.length;n<o;n++)for(var t in r=arguments[n])Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t]);return e},h.apply(this,arguments)};function m(e,r,n){if(n||2===arguments.length)for(var o,t=0,a=r.length;t<a;t++)!o&&t in r||(o||(o=Array.prototype.slice.call(r,0,t)),o[t]=r[t]);return e.concat(o||Array.prototype.slice.call(r))}"function"==typeof SuppressedError&&SuppressedError;var k=function(e){var r={};return d.forEach(e,(function(e){if(e&&e.ref&&e.ref.current){var n=e.ref.current.getBoundingClientRect();r[e.key]=n}})),r},w=function(e){var r,n,l=e.allowHorizontalAnimate,s=void 0===l||l,d=e.children,u=e.pauseAnimation,b=e.tableRef,v=a(!1),f=t({}),g=f[0],p=f[1],h=t({}),m=h[0],w=h[1],x=(r=d,n=a(),c((function(){n.current=r}),[r]),n.current);return i((function(){var e=k(d);p(e)}),[d]),i((function(){var e=k(x);w(e);var r=b.current,n=function(){v.current=!0;var e=k(x);p(e),w(e)},o=function(){v.current=!1};return null==r||r.addEventListener("scroll",n),null==r||r.addEventListener("scrollend",o),function(){null==r||r.removeEventListener("scroll",n),null==r||r.removeEventListener("scrollend",o)}}),[x,b]),c((function(){u||v.current||Object.keys(m).length&&o.Children.forEach(d,(function(e){if(e){var r=e.ref.current,n=m[e.key],o=g[e.key];if(n&&o){var t=n.left-o.left,a=s?0:n.top-o.top,l=Math.abs(t),c=Math.abs(a);(l>10||c>10)&&requestAnimationFrame((function(){r.style.transform="translate(".concat(t,"px, ").concat(a,"px)"),r.style.transition="transform 0s, opacity 0s",requestAnimationFrame((function(){r.style.transform="",r.style.transition="transform 300ms ease-out, opacity 300ms ease-out"}))}))}}}))}),[s,g,d,u,m]),d},x=!1,y=function(e){var r=e.draggedHeaderRef,n=e.headersRef,o=e.hoveredHeaderRef,t=e.onTableHeaderDragEnd;return{handleDragStart:function(e){r.current=e},handleDragOver:function(e){!function(e){var a;if(!x&&(o.current=e,e.accessor!==(null===(a=r.current)||void 0===a?void 0:a.accessor)&&null!==r.current&&!x)){if(x=!0,!n.current)return;var l=m([],n.current,!0),c=l.findIndex((function(e){var n;return e.accessor===(null===(n=r.current)||void 0===n?void 0:n.accessor)})),s=l.findIndex((function(r){return r.accessor===e.accessor}));if(void 0===c||void 0===s)return;var d=l.splice(c,1)[0];l.splice(s,0,d),JSON.stringify(l)!==JSON.stringify(n.current)&&setTimeout((function(){t(l),setTimeout((function(){x=!1}),500)}),50)}}(e)},handleDragEnd:function(){r.current=null,o.current=null}}},C=function(e,r){var n=!0,o=!0;return function(){for(var t=[],a=0;a<arguments.length;a++)t[a]=arguments[a];if(n)return n=!1,void setTimeout((function(){return o=!1}),r);o||(e.apply(this,t),o=!0,setTimeout((function(){return o=!1}),r))}},z=u((function(n,o){var l,s=n.columnResizing,d=n.currentRows,i=n.draggable,u=n.draggedHeaderRef,b=n.forceUpdate,v=n.headersRef,f=n.hoveredHeaderRef,g=n.index,p=n.onSort,m=n.onTableHeaderDragEnd,k=n.selectableColumns,w=n.setIsWidthDragging,x=n.setSelectedCells,z=n.sort,N=n.sortDownIcon,R=n.sortUpIcon,D=a({pageX:0,pageY:0}),S=t(!1),I=S[0],E=S[1],A=null===(l=v.current)||void 0===l?void 0:l[g],M=Boolean(null==A?void 0:A.isSortable),L="st-header-cell ".concat(A===f.current?"st-hovered":""," ").concat(I?"st-dragging":""," ").concat(M?"clickable":""," ").concat(i&&!M?"draggable":""),T=y({draggedHeaderRef:u,headersRef:v,hoveredHeaderRef:f,onTableHeaderDragEnd:m}),B=T.handleDragStart,O=T.handleDragOver,H=T.handleDragEnd,P=a(C((function(e){O(e)}),100)).current,j=function(e){var r=e.event,n=e.header;if(k){var o=d.length,t=Array.from({length:o},(function(e,r){return"".concat(r,"-").concat(g)})),a=function(e,r){var n=new Set,t=Math.min(e,r),a=Math.max(e,r);return Array.from({length:o}).forEach((function(e,r){Array.from({length:a-t+1}).forEach((function(e,o){n.add("".concat(r,"-").concat(t+o))}))})),n};r.shiftKey?x((function(e){var r,n=Number(null===(r=Array.from(e)[0])||void 0===r?void 0:r.split("-")[1]),o=Number(t[0].split("-")[1]);return n===o?new Set(t):n>o?a(o,n):a(n,o)})):x(new Set(t))}else n.isSortable&&p(g,n.accessor)};return c((function(){var e=function(e){var r=new Image;r.src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs=",e.dataTransfer.setDragImage(r,0,0)};return document.addEventListener("dragend",e,!1),function(){document.removeEventListener("dragend",e)}}),[]),A?e("div",h({className:L,ref:o,style:{width:A.width}},{children:[r("div",h({className:"st-header-label",draggable:i,onClick:function(e){return j({event:e,header:A})},onDragStart:function(e){i&&A&&(e.dataTransfer.dropEffect="move",function(e){E(!0),B(e)}(A))},onDragOver:function(e){return function(e,r){e.preventDefault(),e.dataTransfer.dropEffect="move";var n=e.pageX,o=e.pageY;n===D.current.pageX&&o===D.current.pageY||(D.current={pageX:n,pageY:o},P(r,e))}(e,A)},onDragEnd:function(e){e.preventDefault(),e.dataTransfer.dropEffect="move",E(!1),H()},onMouseEnter:function(){return document.body.style.overflow="hidden"},onMouseLeave:function(){return document.body.style.overflow="auto"}},{children:null==A?void 0:A.label})),z&&z.key.accessor===A.accessor&&e("div",h({className:"st-sort-icon-container",onClick:function(e){return j({event:e,header:A})}},{children:["ascending"===z.direction&&R&&R,"descending"===z.direction&&N&&N]})),s&&r("div",{className:"st-header-resize-handle",onMouseDown:function(e){w(!0),e.preventDefault();var r=e.clientX;if(A){var n=A.width,o=C((function(e){var o=Math.max(n+(e.clientX-r),40);A&&(v.current[g].width=o,b())}),10),t=function(){document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",t),w(!1)};document.addEventListener("mousemove",o),document.addEventListener("mouseup",t)}}})]})):null})),N=u((function(e,n){return e.visible?r("div",{className:"st-cell",ref:n}):r("div",{ref:n})})),R=function(o){var t,l=o.columnResizing,c=o.currentRows,s=o.draggable,d=o.forceUpdate,i=o.headersRef,u=o.hiddenColumns,v=o.isWidthDragging,f=o.onSort,g=o.onTableHeaderDragEnd,p=o.selectableColumns,m=o.setIsWidthDragging,k=o.setSelectedCells,x=o.shouldDisplayLastColumnCell,y=o.sort,C=o.sortDownIcon,R=o.sortUpIcon,D=o.tableRef,S=a(null),I=a(null);return r(n,{children:e(w,h({pauseAnimation:v,tableRef:D},{children:[null===(t=i.current)||void 0===t?void 0:t.map((function(e,n){return u[e.accessor]?null:r(z,{columnResizing:l,currentRows:c,draggable:s,draggedHeaderRef:S,forceUpdate:d,headersRef:i,hoveredHeaderRef:I,index:n,onSort:f,onTableHeaderDragEnd:g,ref:b(),selectableColumns:p,setIsWidthDragging:m,setSelectedCells:k,sort:y,sortDownIcon:C,sortUpIcon:R},e.accessor)})),r(N,{ref:b(),visible:x})]}))})},D=function(n){var o=n.value,t=n.onBlur,a=n.onChange;return e("select",h({value:o.toString(),onBlur:t,onChange:function(e){var r=e.target.value;a("true"===r)}},{children:[r("option",h({value:"true"},{children:"True"})),r("option",h({value:"false"},{children:"False"}))]}))},S=function(e){var n=e.defaultValue,o=e.onBlur,t=e.onChange,l=a(null);return r("input",{className:"editable-cell-input",ref:l,autoFocus:!0,type:"text",defaultValue:null!=n?n:"",onBlur:o,onChange:function(e){var r=e.target.value;t(r)}})},I=function(e){var n=e.defaultValue,o=e.onBlur,t=e.onChange,l=a(null);return r("input",{className:"editable-cell-input",ref:l,autoFocus:!0,defaultValue:n.toString(),onBlur:o,onChange:function(e){var r=e.target.value;/^\d*\.?\d*$/.test(r)&&t(r)}})},E=function(e){var o=e.onChange,t=e.setIsEditing,a=e.value,l=function(e){null==o||o(e)},c=function(){t(!1)};return r(n,{children:"string"==typeof a||null==a?r(S,{defaultValue:a,onBlur:c,onChange:l}):"boolean"==typeof a?r(D,{onBlur:c,onChange:l,value:a}):"number"==typeof a?r(I,{defaultValue:a,onBlur:c,onChange:l}):null})},A=v({rows:[],tableRows:[]}),M=u((function(e,n){var o=e.borderClass,a=e.colIndex,l=e.content,s=e.header,d=e.isSelected,i=e.isTopLeftCell,u=e.onCellChange,b=e.onMouseDown,v=e.onMouseOver,g=e.row,p=e.rowIndex,m=f(A),k=m.rows,w=m.tableRows,x=t(l),y=x[0],C=x[1],z=t(!1),N=z[0],R=z[1],D=Boolean(null==s?void 0:s.isEditable),S=p%2==0,I="st-cell ".concat(d?i?"st-cell-selected-first-cell ".concat(o):"st-cell-selected ".concat(o):""," ").concat(S?"st-cell-odd-row":"st-cell-even-row"," ").concat(D?"clickable":"");c((function(){C(l)}),[l]),c((function(){if(void 0!==g.originalRowIndex&&"number"==typeof g.originalRowIndex){var e=k[g.originalRowIndex];e[s.accessor]!==y?C(e[s.accessor]):w[g.originalRowIndex][s.accessor]=y}}),[s.accessor,y,k,g.originalRowIndex,w]);return r("div",N?h({className:"st-cell-editing ".concat(S?"st-cell-odd-row":"st-cell-even-row")},{children:r(E,{onChange:function(e){C(e),null==u||u({accessor:s.accessor,newValue:e,newRowIndex:p,originalRowIndex:g.originalRowIndex,row:g})},setIsEditing:R,value:y})}):h({className:I,onDoubleClick:function(){return s.isEditable&&R(!0)},onMouseDown:function(){return b(p,a)},onMouseOver:function(){return v(p,a)},ref:n},{children:y}))})),L=function(){return r("div",{className:"st-row-separator"})},T=function(o){var t=o.currentRows,a=o.getBorderClass,l=o.handleMouseDown,c=o.handleMouseOver,s=o.headers,d=o.hiddenColumns,i=o.isSelected,u=o.isTopLeftCell,v=o.isWidthDragging,f=o.onCellChange,p=o.shouldDisplayLastColumnCell,m=o.shouldPaginate,k=o.tableRef;return r(n,{children:t.map((function(n,o){return e(g,{children:[e(w,h({allowHorizontalAnimate:m,pauseAnimation:v,tableRef:k},{children:[s.map((function(e,t){if(d[e.accessor])return null;var s=n[e.accessor];return e.cellRenderer&&(s=e.cellRenderer(n)),r(M,{borderClass:a(o,t),colIndex:t,content:s,header:e,isSelected:i(o,t),isTopLeftCell:u(o,t),onCellChange:f,onMouseDown:function(){return l({rowIndex:o,colIndex:t})},onMouseOver:function(){return c(o,t)},ref:b(),row:n,rowIndex:o},e.accessor)})),r(N,{ref:b(),visible:p})]})),o!==t.length-1&&r(L,{})]},n.originalRowIndex)}))})},B=function(n){var o=n.currentPage,t=n.hideFooter,a=n.nextIcon,l=n.onPageChange,c=n.prevIcon,s=n.rowsPerPage,d=n.shouldPaginate,i=n.totalRows,u=Math.ceil(i/s),b=o>1,v=o<u,f=function(e){e>=1&&e<=u&&l(e)};return t||!d?null:e("div",h({className:"st-footer"},{children:[r("button",h({className:"st-next-prev-btn ".concat(b?"":"disabled"),onClick:function(){return f(o-1)},disabled:!b},{children:c})),r("button",h({className:"st-next-prev-btn ".concat(v?"":"disabled"),onClick:function(){return f(o+1)},disabled:!v},{children:a})),Array.from({length:u},(function(e,n){return r("button",h({onClick:function(){return f(n+1)},className:"st-page-btn ".concat(o===n+1?"active":"")},{children:n+1}),n)}))]}))},O=function(e){var n=e.className;return r("svg",h({className:n,viewBox:"0 0 24 24",width:"24",height:"24",xmlns:"http://www.w3.org/2000/svg"},{children:r("path",{d:"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"})}))},H=function(e){var n=e.className;return r("svg",h({className:n,viewBox:"0 0 24 24",width:"24",height:"24",xmlns:"http://www.w3.org/2000/svg"},{children:r("path",{d:"M8.59 16.59L10 18l6-6-6-6-1.41 1.41L13.17 12z"})}))},P=function(e){var n=e.className;return r("svg",h({className:n,viewBox:"0 0 20 20",width:"20",height:"20",xmlns:"http://www.w3.org/2000/svg"},{children:r("path",{d:"M5.41 11.41L10 6.83l4.59 4.58L16 10l-6-6-6 6z"})}))},j=function(e){var n=e.className;return r("svg",h({className:n,viewBox:"0 0 20 20",width:"20",height:"20",xmlns:"http://www.w3.org/2000/svg"},{children:r("path",{d:"M5.41 7.59L10 12.17l4.59-4.58L16 9l-6 6-6-6z"})}))},U=function(n){var o=n.checked,a=void 0!==o&&o,l=n.children,c=n.onChange,s=t(a),d=s[0],i=s[1];return e("label",h({className:"st-checkbox-label"},{children:[r("input",{checked:d,className:"st-checkbox-input",onChange:function(){var e=!d;i(e),c&&c(e)},type:"checkbox"}),r("span",h({className:"st-checkbox-custom ".concat(d?"st-checked":"")},{children:d&&r("span",{className:"st-checkbox-checkmark"})})),l]}))},X=function(e){var n=e.headers,o=e.open,t=e.position;e.setOpen;var a=e.setHiddenColumns,l=e.hiddenColumns,c="left"===t?"left":"";return r("div",h({className:"st-column-editor-popout ".concat(o?"open":""," ").concat(c),onClick:function(e){return e.stopPropagation()}},{children:r("div",h({className:"st-column-editor-popout-content"},{children:n.map((function(e,n){return r(U,h({checked:l[e.accessor],onChange:function(r){var n;return a(h(h({},l),((n={})[e.accessor]=r,n)))}},{children:e.label}),n)}))}))}))},V=function(n){var o=n.columnEditorText,a=n.editColumns,l=n.headers,c=n.position,s=void 0===c?"right":c,d=n.setHiddenColumns,i=n.hiddenColumns,u=t(!1),b=u[0],v=u[1];return a?e("div",h({className:"st-column-editor ".concat(b?"open":""," ").concat(s),onClick:function(){return function(e){v(e)}(!b)}},{children:[r("div",h({className:"st-column-editor-text"},{children:o})),r(X,{headers:l,open:b,position:s,setOpen:v,setHiddenColumns:d,hiddenColumns:i})]})):null};!function(e,r){void 0===r&&(r={});var n=r.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css","top"===n&&o.firstChild?o.insertBefore(t,o.firstChild):o.appendChild(t),t.styleSheet?t.styleSheet.cssText=e:t.appendChild(document.createTextNode(e))}}(':root {\n  /* Customizable Variables */\n  --st-border-radius: 4px;\n  --st-border-width: 1px;\n  --st-cell-padding: 8px;\n\n  /* New Variables for Theming */\n  --st-font-size: 1rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 700;\n  --st-transition-duration: 0.3s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 4px;\n  --st-spacing-medium: 8px;\n  --st-spacing-large: 16px;\n\n  /* Tailwind Colors */\n  --white: #fff;\n  --black: #000;\n\n  --slate-50: #f8fafc;\n  --slate-100: #f1f5f9;\n  --slate-200: #e2e8f0;\n  --slate-300: #cbd5e1;\n  --slate-400: #94a3b8;\n  --slate-500: #64748b;\n  --slate-600: #475569;\n  --slate-700: #334155;\n  --slate-800: #1e293b;\n  --slate-900: #0f172a;\n  --slate-950: #020617;\n\n  --gray-50: #f9fafb;\n  --gray-100: #f3f4f6;\n  --gray-200: #e5e7eb;\n  --gray-300: #d1d5db;\n  --gray-400: #9ca3af;\n  --gray-500: #6b7280;\n  --gray-600: #4b5563;\n  --gray-700: #374151;\n  --gray-800: #1f2937;\n  --gray-900: #111827;\n  --gray-950: #030712;\n\n  --zinc-50: #fafafa;\n  --zinc-100: #f4f4f5;\n  --zinc-200: #e4e4e7;\n  --zinc-300: #d4d4d8;\n  --zinc-400: #a1a1aa;\n  --zinc-500: #71717a;\n  --zinc-600: #52525b;\n  --zinc-700: #3f3f46;\n  --zinc-800: #27272a;\n  --zinc-900: #18181b;\n  --zinc-950: #09090b;\n\n  --neutral-50: #fafafa;\n  --neutral-100: #f5f5f5;\n  --neutral-200: #e5e5e5;\n  --neutral-300: #d4d4d4;\n  --neutral-400: #a3a3a3;\n  --neutral-500: #737373;\n  --neutral-600: #525252;\n  --neutral-700: #404040;\n  --neutral-800: #262626;\n  --neutral-900: #171717;\n  --neutral-950: #0a0a0a;\n\n  --stone-50: #fafaf9;\n  --stone-100: #f5f5f4;\n  --stone-200: #e7e5e4;\n  --stone-300: #d6d3d1;\n  --stone-400: #a8a29e;\n  --stone-500: #78716c;\n  --stone-600: #57534e;\n  --stone-700: #44403c;\n  --stone-800: #292524;\n  --stone-900: #1c1917;\n  --stone-950: #0c0a09;\n\n  --red-50: #fef2f2;\n  --red-100: #fee2e2;\n  --red-200: #fecaca;\n  --red-300: #fca5a5;\n  --red-400: #f87171;\n  --red-500: #ef4444;\n  --red-600: #dc2626;\n  --red-700: #b91c1c;\n  --red-800: #991b1b;\n  --red-900: #7f1d1d;\n  --red-950: #450a0a;\n\n  --orange-50: #fff7ed;\n  --orange-100: #ffedd5;\n  --orange-200: #fed7aa;\n  --orange-300: #fdba74;\n  --orange-400: #fb923c;\n  --orange-500: #f97316;\n  --orange-600: #ea580c;\n  --orange-700: #c2410c;\n  --orange-800: #9a3412;\n  --orange-900: #7c2d12;\n  --orange-950: #431407;\n\n  --amber-50: #fffbeb;\n  --amber-100: #fef3c7;\n  --amber-200: #fde68a;\n  --amber-300: #fcd34d;\n  --amber-400: #fbbf24;\n  --amber-500: #f59e0b;\n  --amber-600: #d97706;\n  --amber-700: #b45309;\n  --amber-800: #92400e;\n  --amber-900: #78350f;\n  --amber-950: #451a03;\n\n  --yellow-50: #fefce8;\n  --yellow-100: #fef9c3;\n  --yellow-200: #fef08a;\n  --yellow-300: #fde047;\n  --yellow-400: #facc15;\n  --yellow-500: #eab308;\n  --yellow-600: #ca8a04;\n  --yellow-700: #a16207;\n  --yellow-800: #854d0e;\n  --yellow-900: #713f12;\n  --yellow-950: #422006;\n\n  --lime-50: #f7fee7;\n  --lime-100: #ecfccb;\n  --lime-200: #d9f99d;\n  --lime-300: #bef264;\n  --lime-400: #a3e635;\n  --lime-500: #84cc16;\n  --lime-600: #65a30d;\n  --lime-700: #4d7c0f;\n  --lime-800: #3f6212;\n  --lime-900: #365314;\n  --lime-950: #1a2e05;\n\n  --green-50: #f0fdf4;\n  --green-100: #dcfce7;\n  --green-200: #bbf7d0;\n  --green-300: #86efac;\n  --green-400: #4ade80;\n  --green-500: #22c55e;\n  --green-600: #16a34a;\n  --green-700: #15803d;\n  --green-800: #166534;\n  --green-900: #14532d;\n  --green-950: #052e16;\n\n  --emerald-50: #ecfdf5;\n  --emerald-100: #d1fae5;\n  --emerald-200: #a7f3d0;\n  --emerald-300: #6ee7b7;\n  --emerald-400: #34d399;\n  --emerald-500: #10b981;\n  --emerald-600: #059669;\n  --emerald-700: #047857;\n  --emerald-800: #065f46;\n  --emerald-900: #064e3b;\n  --emerald-950: #022c22;\n\n  --teal-50: #f0fdfa;\n  --teal-100: #ccfbf1;\n  --teal-200: #99f6e4;\n  --teal-300: #5eead4;\n  --teal-400: #2dd4bf;\n  --teal-500: #14b8a6;\n  --teal-600: #0d9488;\n  --teal-700: #0f766e;\n  --teal-800: #115e59;\n  --teal-900: #134e4a;\n  --teal-950: #042f2e;\n\n  --cyan-50: #ecfeff;\n  --cyan-100: #cffafe;\n  --cyan-200: #a5f3fc;\n  --cyan-300: #67e8f9;\n  --cyan-400: #22d3ee;\n  --cyan-500: #06b6d4;\n  --cyan-600: #0891b2;\n  --cyan-700: #0e7490;\n  --cyan-800: #155e75;\n  --cyan-900: #164e63;\n  --cyan-950: #083344;\n\n  --sky-50: #f0f9ff;\n  --sky-100: #e0f2fe;\n  --sky-200: #bae6fd;\n  --sky-300: #7dd3fc;\n  --sky-400: #38bdf8;\n  --sky-500: #0ea5e9;\n  --sky-600: #0284c7;\n  --sky-700: #0369a1;\n  --sky-800: #075985;\n  --sky-900: #0c4a6e;\n  --sky-950: #082f49;\n\n  --blue-50: #eff6ff;\n  --blue-100: #dbeafe;\n  --blue-200: #bfdbfe;\n  --blue-300: #93c5fd;\n  --blue-400: #60a5fa;\n  --blue-500: #3b82f6;\n  --blue-600: #2563eb;\n  --blue-700: #1d4ed8;\n  --blue-800: #1e40af;\n  --blue-900: #1e3a8a;\n  --blue-950: #172554;\n\n  --indigo-50: #eef2ff;\n  --indigo-100: #e0e7ff;\n  --indigo-200: #c7d2fe;\n  --indigo-300: #a5b4fc;\n  --indigo-400: #818cf8;\n  --indigo-500: #6366f1;\n  --indigo-600: #4f46e5;\n  --indigo-700: #4338ca;\n  --indigo-800: #3730a3;\n  --indigo-900: #312e81;\n  --indigo-950: #1e1b4b;\n\n  --violet-50: #f5f3ff;\n  --violet-100: #ede9fe;\n  --violet-200: #ddd6fe;\n  --violet-300: #c4b5fd;\n  --violet-400: #a78bfa;\n  --violet-500: #8b5cf6;\n  --violet-600: #7c3aed;\n  --violet-700: #6d28d9;\n  --violet-800: #5b21b6;\n  --violet-900: #4c1d95;\n  --violet-950: #2e1065;\n\n  --purple-50: #faf5ff;\n  --purple-100: #f3e8ff;\n  --purple-200: #e9d5ff;\n  --purple-300: #d8b4fe;\n  --purple-400: #c084fc;\n  --purple-500: #a855f7;\n  --purple-600: #9333ea;\n  --purple-700: #7e22ce;\n  --purple-800: #6b21a8;\n  --purple-900: #581c87;\n  --purple-950: #3b0764;\n\n  --fuchsia-50: #fdf4ff;\n  --fuchsia-100: #fae8ff;\n  --fuchsia-200: #f5d0fe;\n  --fuchsia-300: #f0abfc;\n  --fuchsia-400: #e879f9;\n  --fuchsia-500: #d946ef;\n  --fuchsia-600: #c026d3;\n  --fuchsia-700: #a21caf;\n  --fuchsia-800: #86198f;\n  --fuchsia-900: #701a75;\n  --fuchsia-950: #4a044e;\n\n  --pink-50: #fdf2f8;\n  --pink-100: #fce7f3;\n  --pink-200: #fbcfe8;\n  --pink-300: #f9a8d4;\n  --pink-400: #f472b6;\n  --pink-500: #ec4899;\n  --pink-600: #db2777;\n  --pink-700: #be185d;\n  --pink-800: #9d174d;\n  --pink-900: #831843;\n  --pink-950: #500724;\n\n  --rose-50: #fff1f2;\n  --rose-100: #ffe4e6;\n  --rose-200: #fecdd3;\n  --rose-300: #fda4af;\n  --rose-400: #fb7185;\n  --rose-500: #f43f5e;\n  --rose-600: #e11d48;\n  --rose-700: #be123c;\n  --rose-800: #9f1239;\n  --rose-900: #881337;\n  --rose-950: #4c0519;\n}\n\n.theme-light {\n  --st-border-color: var(--blue-400);\n  --st-odd-row-background-color: var(--blue-50);\n  --st-even-row-background-color: var(--blue-100);\n  --st-header-background-color: var(--blue-200);\n  --st-dragging-background-color: var(--blue-300);\n  --st-selected-cell-background-color: var(--blue-300);\n  --st-selected-first-cell-background-color: var(--amber-200);\n  --st-footer-background-color: var(--blue-50);\n  --st-cell-color: var(--slate-800);\n  --st-cell-odd-row-color: var(--slate-700);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.1),\n    0 2px 4px -1px var(--black / 0.06);\n  --st-selected-cell-color: var(--slate-900);\n  --st-selected-first-cell-color: var(--slate-900);\n  --st-resize-handle-color: var(--blue-500);\n  --st-separator-border-color: var(--blue-400);\n  --st-selected-border-top-color: var(--blue-600);\n  --st-selected-border-bottom-color: var(--blue-600);\n  --st-selected-border-left-color: var(--blue-600);\n  --st-selected-border-right-color: var(--blue-600);\n  --st-checkbox-checked-background-color: var(--blue-500);\n  --st-checkbox-checked-border-color: var(--blue-500);\n  --st-column-editor-background-color: var(--blue-50);\n  --st-column-editor-popout-background-color: var(--blue-50);\n  --st-button-hover-background-color: var(--blue-200);\n  --st-button-active-background-color: var(--blue-300);\n  --st-font-family: "Nunito", sans-serif;\n  --st-editable-cell-focus-border-color: var(--blue-500);\n}\n\n.theme-dark {\n  --st-border-color: var(--slate-800);\n  --st-odd-row-background-color: var(--slate-800);\n  --st-even-row-background-color: var(--slate-900);\n  --st-header-background-color: var(--slate-700);\n  --st-dragging-background-color: var(--blue-800);\n  --st-selected-cell-background-color: var(--blue-700);\n  --st-selected-first-cell-background-color: var(--amber-700);\n  --st-footer-background-color: var(--slate-900);\n  --st-cell-color: var(--white);\n  --st-cell-odd-row-color: var(--slate-300);\n  --st-shadow: 0 1px 3px 0 var(--white / 0.1), 0 1px 2px -1px var(--white / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--white / 0.1),\n    0 2px 4px -1px var(--white / 0.06);\n  --st-selected-cell-color: var(--white);\n  --st-selected-first-cell-color: var(--white);\n  --st-resize-handle-color: var(--slate-600);\n  --st-separator-border-color: var(--slate-700);\n  --st-selected-border-top-color: var(--blue-700);\n  --st-selected-border-bottom-color: var(--blue-700);\n  --st-selected-border-left-color: var(--blue-700);\n  --st-selected-border-right-color: var(--blue-700);\n  --st-checkbox-checked-background-color: var(--blue-700);\n  --st-checkbox-checked-border-color: var(--blue-700);\n  --st-column-editor-background-color: var(--slate-800);\n  --st-column-editor-popout-background-color: var(--slate-800);\n  --st-button-hover-background-color: var(--slate-600);\n  --st-button-active-background-color: var(--slate-700);\n  --st-font-family: "Open Sans", sans-serif;\n  --st-editable-cell-focus-border-color: var(--slate-600);\n}\n\n.theme-high-contrast {\n  --st-border-color: var(--slate-900);\n  --st-odd-row-background-color: var(--slate-50);\n  --st-even-row-background-color: var(--slate-900);\n  --st-header-background-color: var(--slate-900);\n  --st-dragging-background-color: var(--yellow-500);\n  --st-selected-cell-background-color: var(--slate-900);\n  --st-selected-first-cell-background-color: var(--red-500);\n  --st-footer-background-color: var(--slate-900);\n  --st-cell-color: var(--white);\n  --st-cell-odd-row-color: var(--slate-900);\n  --st-shadow: none;\n  --st-shadow-hover: none;\n  --st-selected-cell-color: var(--white);\n  --st-selected-first-cell-color: var(--white);\n  --st-resize-handle-color: var(--white);\n  --st-separator-border-color: var(--slate-900);\n  --st-selected-border-top-color: var(--orange-600);\n  --st-selected-border-bottom-color: var(--orange-600);\n  --st-selected-border-left-color: var(--orange-600);\n  --st-selected-border-right-color: var(--orange-600);\n  --st-checkbox-checked-background-color: var(--slate-50);\n  --st-checkbox-checked-border-color: var(--slate-50);\n  --st-column-editor-background-color: var(--slate-900);\n  --st-column-editor-popout-background-color: var(--slate-900);\n  --st-button-hover-background-color: var(--slate-50);\n  --st-button-active-background-color: var(--slate-900);\n  --st-font-family: "Arial", sans-serif;\n  --st-editable-cell-focus-border-color: var(--orange-600);\n}\n\n.theme-pastel {\n  --st-border-color: var(--purple-200);\n  --st-odd-row-background-color: var(--purple-50);\n  --st-even-row-background-color: var(--blue-50);\n  --st-header-background-color: var(--blue-50);\n  --st-dragging-background-color: var(--cyan-50);\n  --st-selected-cell-background-color: var(--orange-50);\n  --st-selected-first-cell-background-color: var(--amber-50);\n  --st-footer-background-color: var(--purple-50);\n  --st-cell-color: var(--slate-600);\n  --st-cell-odd-row-color: var(--slate-700);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.1),\n    0 2px 4px -1px var(--black / 0.06);\n  --st-selected-cell-color: var(--slate-600);\n  --st-selected-first-cell-color: var(--slate-600);\n  --st-resize-handle-color: var(--purple-200);\n  --st-separator-border-color: var(--purple-200);\n  --st-selected-border-top-color: var(--amber-500);\n  --st-selected-border-bottom-color: var(--amber-500);\n  --st-selected-border-left-color: var(--amber-500);\n  --st-selected-border-right-color: var(--amber-500);\n  --st-checkbox-checked-background-color: var(--purple-200);\n  --st-checkbox-checked-border-color: var(--purple-200);\n  --st-column-editor-background-color: var(--purple-50);\n  --st-column-editor-popout-background-color: var(--purple-50);\n  --st-button-hover-background-color: var(--purple-100);\n  --st-button-active-background-color: var(--purple-200);\n  --st-font-family: "Comic Sans MS", cursive, sans-serif;\n  --st-editable-cell-focus-border-color: var(--purple-300);\n}\n\n.theme-vibrant {\n  --st-border-color: var(--orange-500);\n  --st-odd-row-background-color: var(--orange-100);\n  --st-even-row-background-color: var(--orange-200);\n  --st-header-background-color: var(--orange-300);\n  --st-dragging-background-color: var(--blue-300);\n  --st-selected-cell-background-color: var(--blue-400);\n  --st-selected-first-cell-background-color: var(--amber-300);\n  --st-footer-background-color: var(--orange-50);\n  --st-cell-color: var(--orange-900);\n  --st-cell-odd-row-color: var(--orange-800);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.2), 0 1px 2px -1px var(--black / 0.2);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.2),\n    0 2px 4px -1px var(--black / 0.1);\n  --st-selected-cell-color: var(--orange-900);\n  --st-selected-first-cell-color: var(--orange-900);\n  --st-resize-handle-color: var(--orange-400);\n  --st-separator-border-color: var(--orange-500);\n  --st-selected-border-top-color: var(--orange-700);\n  --st-selected-border-bottom-color: var(--orange-700);\n  --st-selected-border-left-color: var(--orange-700);\n  --st-selected-border-right-color: var(--orange-700);\n  --st-checkbox-checked-background-color: var(--orange-500);\n  --st-checkbox-checked-border-color: var(--orange-500);\n  --st-column-editor-background-color: var(--orange-100);\n  --st-column-editor-popout-background-color: var(--orange-100);\n  --st-button-hover-background-color: var(--orange-300);\n  --st-button-active-background-color: var(--orange-400);\n  --st-font-family: "Lobster", cursive;\n  --st-editable-cell-focus-border-color: var(--orange-600);\n}\n\n.theme-solarized-light {\n  --st-border-color: var(--yellow-300);\n  --st-odd-row-background-color: var(--yellow-50);\n  --st-even-row-background-color: var(--yellow-200);\n  --st-header-background-color: var(--yellow-200);\n  --st-dragging-background-color: var(--yellow-300);\n  --st-selected-cell-background-color: var(--slate-400);\n  --st-selected-first-cell-background-color: var(--amber-600);\n  --st-footer-background-color: var(--yellow-50);\n  --st-cell-color: var(--slate-600);\n  --st-cell-odd-row-color: var(--slate-700);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.1),\n    0 2px 4px -1px var(--black / 0.06);\n  --st-selected-cell-color: var(--slate-600);\n  --st-selected-first-cell-color: var(--slate-600);\n  --st-resize-handle-color: var(--slate-400);\n  --st-separator-border-color: var(--yellow-300);\n  --st-selected-border-top-color: var(--yellow-600);\n  --st-selected-border-bottom-color: var(--yellow-600);\n  --st-selected-border-left-color: var(--yellow-600);\n  --st-selected-border-right-color: var(--yellow-600);\n  --st-checkbox-checked-background-color: var(--slate-400);\n  --st-checkbox-checked-border-color: var(--slate-400);\n  --st-column-editor-background-color: var(--yellow-200);\n  --st-column-editor-popout-background-color: var(--yellow-200);\n  --st-button-hover-background-color: var(--yellow-200);\n  --st-button-active-background-color: var(--slate-400);\n  --st-font-family: "Georgia", serif;\n  --st-editable-cell-focus-border-color: var(--yellow-400);\n}\n\n.theme-solarized-dark {\n  --st-border-color: var(--slate-800);\n  --st-odd-row-background-color: var(--slate-900);\n  --st-even-row-background-color: var(--slate-800);\n  --st-header-background-color: var(--slate-800);\n  --st-dragging-background-color: var(--slate-800);\n  --st-selected-cell-background-color: var(--slate-600);\n  --st-selected-first-cell-background-color: var(--amber-600);\n  --st-footer-background-color: var(--slate-900);\n  --st-cell-color: var(--slate-300);\n  --st-cell-odd-row-color: var(--slate-400);\n  --st-shadow: 0 1px 3px 0 var(--white / 0.1), 0 1px 2px -1px var(--white / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--white / 0.1),\n    0 2px 4px -1px var(--white / 0.06);\n  --st-selected-cell-color: var(--slate-300);\n  --st-selected-first-cell-color: var(--slate-300);\n  --st-resize-handle-color: var(--slate-600);\n  --st-separator-border-color: var(--slate-800);\n  --st-selected-border-top-color: var(--blue-800);\n  --st-selected-border-bottom-color: var(--blue-800);\n  --st-selected-border-left-color: var(--blue-800);\n  --st-selected-border-right-color: var(--blue-800);\n  --st-checkbox-checked-background-color: var(--slate-600);\n  --st-checkbox-checked-border-color: var(--slate-600);\n  --st-column-editor-background-color: var(--slate-800);\n  --st-column-editor-popout-background-color: var(--slate-800);\n  --st-button-hover-background-color: var(--slate-600);\n  --st-button-active-background-color: var(--slate-800);\n  --st-font-family: "Courier New", monospace;\n  --st-editable-cell-focus-border-color: var(--blue-800);\n}\n\n.theme-ocean {\n  --st-border-color: var(--cyan-700);\n  --st-odd-row-background-color: var(--cyan-50);\n  --st-even-row-background-color: var(--cyan-100);\n  --st-header-background-color: var(--cyan-100);\n  --st-dragging-background-color: var(--cyan-300);\n  --st-selected-cell-background-color: var(--cyan-700);\n  --st-selected-first-cell-background-color: var(--slate-900);\n  --st-footer-background-color: var(--cyan-50);\n  --st-cell-color: var(--slate-900);\n  --st-cell-odd-row-color: var(--cyan-700);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.1),\n    0 2px 4px -1px var(--black / 0.06);\n  --st-selected-cell-color: var(--slate-900);\n  --st-selected-first-cell-color: var(--slate-900);\n  --st-resize-handle-color: var(--cyan-300);\n  --st-separator-border-color: var(--cyan-700);\n  --st-selected-border-top-color: var(--blue-700);\n  --st-selected-border-bottom-color: var(--blue-700);\n  --st-selected-border-left-color: var(--blue-700);\n  --st-selected-border-right-color: var(--blue-700);\n  --st-checkbox-checked-background-color: var(--cyan-700);\n  --st-checkbox-checked-border-color: var(--cyan-700);\n  --st-column-editor-background-color: var(--cyan-100);\n  --st-column-editor-popout-background-color: var(--cyan-100);\n  --st-button-hover-background-color: var(--cyan-300);\n  --st-button-active-background-color: var(--cyan-700);\n  --st-font-family: "Verdana", sans-serif;\n  --st-editable-cell-focus-border-color: var(--cyan-500);\n}\n\n.theme-forest {\n  --st-border-color: var(--green-800);\n  --st-odd-row-background-color: var(--green-50);\n  --st-even-row-background-color: var(--green-100);\n  --st-header-background-color: var(--green-100);\n  --st-dragging-background-color: var(--green-400);\n  --st-selected-cell-background-color: var(--green-700);\n  --st-selected-first-cell-background-color: var(--green-900);\n  --st-footer-background-color: var(--green-50);\n  --st-cell-color: var(--green-900);\n  --st-cell-odd-row-color: var(--green-700);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.1),\n    0 2px 4px -1px var(--black / 0.06);\n  --st-selected-cell-color: var(--green-900);\n  --st-selected-first-cell-color: var(--green-900);\n  --st-resize-handle-color: var(--green-400);\n  --st-separator-border-color: var(--green-800);\n  --st-selected-border-top-color: var(--green-600);\n  --st-selected-border-bottom-color: var(--green-600);\n  --st-selected-border-left-color: var(--green-600);\n  --st-selected-border-right-color: var(--green-600);\n  --st-checkbox-checked-background-color: var(--green-700);\n  --st-checkbox-checked-border-color: var(--green-700);\n  --st-column-editor-background-color: var(--green-100);\n  --st-column-editor-popout-background-color: var(--green-100);\n  --st-button-hover-background-color: var(--green-400);\n  --st-button-active-background-color: var(--green-700);\n  --st-font-family: "Tahoma", sans-serif;\n  --st-editable-cell-focus-border-color: var(--green-600);\n}\n\n.theme-desert {\n  --st-border-color: var(--amber-600);\n  --st-odd-row-background-color: var(--amber-50);\n  --st-even-row-background-color: var(--amber-100);\n  --st-header-background-color: var(--amber-100);\n  --st-dragging-background-color: var(--amber-300);\n  --st-selected-cell-background-color: var(--amber-600);\n  --st-selected-first-cell-background-color: var(--amber-800);\n  --st-footer-background-color: var(--amber-50);\n  --st-cell-color: var(--amber-800);\n  --st-cell-odd-row-color: var(--amber-600);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.1),\n    0 2px 4px -1px var(--black / 0.06);\n  --st-selected-cell-color: var(--amber-800);\n  --st-selected-first-cell-color: var(--amber-800);\n  --st-resize-handle-color: var(--amber-300);\n  --st-separator-border-color: var(--amber-600);\n  --st-selected-border-top-color: var(--amber-700);\n  --st-selected-border-bottom-color: var(--amber-700);\n  --st-selected-border-left-color: var(--amber-700);\n  --st-selected-border-right-color: var(--amber-700);\n  --st-checkbox-checked-background-color: var(--amber-600);\n  --st-checkbox-checked-border-color: var(--amber-600);\n  --st-column-editor-background-color: var(--amber-100);\n  --st-column-editor-popout-background-color: var(--amber-100);\n  --st-button-hover-background-color: var(--amber-300);\n  --st-button-active-background-color: var(--amber-600);\n  --st-font-family: "Times New Roman", serif;\n  --st-editable-cell-focus-border-color: var(--amber-700);\n}\n\n.theme-bubblegum {\n  --st-border-color: var(--pink-500);\n  --st-odd-row-background-color: var(--pink-50);\n  --st-even-row-background-color: var(--pink-100);\n  --st-header-background-color: var(--pink-200);\n  --st-dragging-background-color: var(--pink-300);\n  --st-selected-cell-background-color: var(--pink-400);\n  --st-selected-first-cell-background-color: var(--pink-600);\n  --st-footer-background-color: var(--pink-50);\n  --st-cell-color: var(--pink-900);\n  --st-cell-odd-row-color: var(--pink-800);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.1),\n    0 2px 4px -1px var(--black / 0.06);\n  --st-selected-cell-color: var(--pink-900);\n  --st-selected-first-cell-color: var(--pink-900);\n  --st-resize-handle-color: var(--pink-400);\n  --st-separator-border-color: var(--pink-500);\n  --st-selected-border-top-color: var(--pink-700);\n  --st-selected-border-bottom-color: var(--pink-700);\n  --st-selected-border-left-color: var(--pink-700);\n  --st-selected-border-right-color: var(--pink-700);\n  --st-checkbox-checked-background-color: var(--pink-500);\n  --st-checkbox-checked-border-color: var(--pink-500);\n  --st-column-editor-background-color: var(--pink-100);\n  --st-column-editor-popout-background-color: var(--pink-100);\n  --st-button-hover-background-color: var(--pink-300);\n  --st-button-active-background-color: var(--pink-400);\n  --st-font-family: "Pacifico", cursive;\n  --st-editable-cell-focus-border-color: var(--pink-600);\n}\n\n.theme-90s {\n  --st-border-color: var(--gray-500);\n  --st-odd-row-background-color: var(--gray-100);\n  --st-even-row-background-color: var(--gray-200);\n  --st-header-background-color: var(--gray-300);\n  --st-dragging-background-color: var(--gray-400);\n  --st-selected-cell-background-color: var(--gray-500);\n  --st-selected-first-cell-background-color: var(--gray-600);\n  --st-footer-background-color: var(--gray-100);\n  --st-cell-color: var(--gray-900);\n  --st-cell-odd-row-color: var(--gray-800);\n  --st-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-shadow-hover: 0 4px 6px -1px var(--black / 0.1),\n    0 2px 4px -1px var(--black / 0.06);\n  --st-selected-cell-color: var(--gray-900);\n  --st-selected-first-cell-color: var(--gray-900);\n  --st-resize-handle-color: var(--gray-400);\n  --st-separator-border-color: var(--gray-500);\n  --st-selected-border-top-color: var(--gray-700);\n  --st-selected-border-bottom-color: var(--gray-700);\n  --st-selected-border-left-color: var(--gray-700);\n  --st-selected-border-right-color: var(--gray-700);\n  --st-checkbox-checked-background-color: var(--gray-500);\n  --st-checkbox-checked-border-color: var(--gray-500);\n  --st-column-editor-background-color: var(--gray-200);\n  --st-column-editor-popout-background-color: var(--gray-200);\n  --st-button-hover-background-color: var(--gray-300);\n  --st-button-active-background-color: var(--gray-400);\n  --st-font-family: "Courier New", monospace;\n  --st-editable-cell-focus-border-color: var(--gray-600);\n}\n\n/* Global styles */\n* {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  font-family: var(--st-font-family);\n}\n\n/* Apply Nunito as the default font */\nbody {\n  font-size: var(--st-font-size);\n  font-weight: var(--st-font-weight-normal);\n}\n\n/* Wrapper for the table */\n.st-wrapper {\n  position: relative;\n  border: var(--st-border-width) solid var(--st-border-color);\n  border-radius: var(--st-border-radius);\n  max-height: 100dvh;\n  overflow: hidden;\n}\n\n.st-table-wrapper {\n  position: relative;\n  display: flex;\n  width: max-content;\n  overflow: visible;\n  height: 100%;\n  width: 100%;\n}\n\n/* Main table styling */\n.st-table {\n  position: relative;\n  display: grid;\n  border-collapse: collapse;\n  table-layout: auto;\n  white-space: nowrap;\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n}\n\n/* Styles for table header cells */\n.st-header-cell {\n  position: sticky;\n  top: 0;\n  background-color: var(--st-header-background-color);\n  z-index: 1;\n  font-weight: var(--st-font-weight-bold);\n\n  display: flex;\n  align-items: center;\n  gap: var(--st-spacing-small);\n  border-top: var(--st-border-width) solid transparent;\n  border-bottom: var(--st-border-width) solid var(--st-border-color);\n}\n.st-header-cell.clickable {\n  cursor: pointer;\n}\n.st-header-cell.draggable {\n  cursor: grab;\n}\n\n/* Common styles for table header and cells */\n.st-header-cell,\n.st-cell {\n  color: var(--slate-800);\n  overflow: hidden;\n}\n\n.st-cell.clickable {\n  cursor: pointer;\n}\n\n.st-header-cell,\n.st-cell,\n.st-cell-editing {\n  width: 100%;\n  height: 40px;\n}\n\n.st-cell-editing {\n  position: relative;\n}\n\n.st-header-label {\n  flex: 1;\n  color: var(--st-cell-color);\n}\n\n.st-header-label,\n.st-cell {\n  user-select: none;\n  padding: var(--st-cell-padding);\n  text-align: left;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  width: 100%;\n}\n.st-cell {\n  position: relative;\n  border: var(--st-border-width) solid transparent;\n}\n.st-sort-icon-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n\n.st-sort-icon {\n  fill: var(--slate-500);\n}\n\n.st-header-resize-handle {\n  top: 0;\n  right: 0;\n  width: 5px;\n  height: 20px;\n  cursor: col-resize;\n  background-color: var(--st-resize-handle-color);\n  border-radius: 0.25rem;\n}\n\n.st-row-separator {\n  height: 1px;\n  background-color: var(--st-separator-border-color);\n  grid-column: 1 / -1;\n}\n.st-cell-even-row {\n  background-color: var(--st-even-row-background-color);\n}\n\n.st-cell-odd-row:not(.st-cell-selected) {\n  background-color: var(--st-odd-row-background-color);\n  color: var(--st-cell-odd-row-color);\n}\n.st-cell:not(.st-cell-odd-row):not(.st-cell-selected) {\n  background-color: var(--st-even-row-background-color);\n  color: var(--st-cell-color);\n}\n\n/* Style for a cell when it is being dragged */\n.st-dragging {\n  background-color: var(--st-dragging-background-color);\n}\n\n/* Style for selected table cells */\n.st-cell-selected {\n  background-color: var(--st-selected-cell-background-color);\n  color: var(--st-selected-cell-color);\n}\n\n/* Style for the first selected table cell */\n.st-cell-selected-first {\n  background-color: var(--st-selected-first-cell-background-color);\n  color: var(--st-selected-first-cell-color);\n}\n\n/* Border for selected cells */\n.st-selected-top-border {\n  border-top: var(--st-border-width) solid var(--st-selected-border-top-color);\n}\n\n.st-selected-bottom-border {\n  border-bottom: var(--st-border-width) solid\n    var(--st-selected-border-bottom-color);\n}\n\n.st-selected-left-border {\n  border-left: var(--st-border-width) solid var(--st-selected-border-left-color);\n}\n\n.st-selected-right-border {\n  border-right: var(--st-border-width) solid\n    var(--st-selected-border-right-color);\n}\n\n.st-footer {\n  display: flex;\n  align-items: center;\n  background-color: var(--st-footer-background-color);\n  padding: var(--st-spacing-medium);\n  border-top: var(--st-border-width) solid var(--st-border-color);\n}\n\n.st-next-prev-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--st-spacing-small);\n  cursor: pointer;\n  background-color: transparent;\n  border: none;\n  border-radius: var(--st-border-radius);\n  transition: background-color var(--st-transition-duration)\n    var(--st-transition-ease);\n}\n.st-next-prev-btn {\n  fill: var(--slate-600);\n}\n.disabled > .st-next-prev-icon {\n  cursor: not-allowed;\n  fill: var(--slate-400);\n}\n\n.st-next-prev-btn:not(.disabled):hover {\n  background-color: var(--slate-100);\n}\n\n.st-page-btn {\n  margin-left: var(--st-spacing-small);\n  padding: var(--st-spacing-small);\n  cursor: pointer;\n  background-color: transparent;\n  color: var(--slate-600);\n  border: none;\n  border-radius: var(--st-border-radius);\n  transition: background-color var(--st-transition-duration)\n    var(--st-transition-ease);\n}\n\n.st-page-btn:hover {\n  background-color: var(--st-button-hover-background-color);\n}\n\n.st-page-btn.active {\n  background-color: var(--st-button-active-background-color);\n  color: white;\n}\n\n.editable-cell-input {\n  position: absolute;\n  top: 0;\n  left: 0;\n  border-radius: var(--st-border-radius);\n  border: var(--st-border-width) solid var(--st-border-color);\n  box-shadow: var(--st-shadow);\n  z-index: 1;\n  outline: none;\n  height: 100%;\n  width: 100%;\n  padding: var(--st-cell-padding);\n  font-size: var(--st-font-size);\n}\n.editable-cell-input:focus {\n  border: var(--st-border-width) solid\n    var(--st-editable-cell-focus-border-color);\n}\n.st-column-editor {\n  position: relative;\n  user-select: none;\n  background: var(--st-footer-background-color);\n  border-left: var(--st-border-width) solid var(--st-border-color);\n  cursor: pointer;\n  color: var(--slate-500);\n}\n\n.st-column-editor-text {\n  padding: var(--st-spacing-medium) var(--st-spacing-small);\n  writing-mode: vertical-rl;\n  z-index: 2;\n}\n\n.st-column-editor.open,\n.st-column-editor.open .st-column-editor-text {\n  background-color: var(--st-column-editor-background-color);\n}\n\n.st-column-editor-popout {\n  position: absolute;\n  top: 0;\n  right: calc(100% + 1px);\n  z-index: 1;\n  height: 100%;\n  background-color: var(--st-column-editor-popout-background-color);\n  transition: width var(--st-transition-duration) var(--st-transition-ease);\n  overflow: hidden;\n  width: 0;\n}\n.st-column-editor-popout-content {\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  gap: var(--st-spacing-small);\n  padding: var(--st-spacing-medium) var(--st-spacing-small);\n  border-left: var(--st-border-width) solid var(--st-border-color);\n  height: 100%;\n}\n\n.st-column-editor-popout.open {\n  width: 200px;\n}\n\n.st-column-editor-popout.left {\n  transform: translateX(-100%);\n}\n\n.st-column-editor-popout.open.left {\n  transform: translateX(0);\n}\n\n/* Checkbox styles */\n.st-checkbox-label {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  gap: var(--st-spacing-medium);\n}\n\n.st-checkbox-input {\n  display: none; /* Hide the default checkbox */\n}\n\n.st-checkbox-custom {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  border: var(--st-border-width) solid var(--slate-300);\n  border-radius: var(--st-border-radius);\n  background-color: white;\n  transition: background-color var(--st-transition-duration)\n      var(--st-transition-ease),\n    border-color var(--st-transition-duration) var(--st-transition-ease);\n}\n\n.st-checkbox-custom.st-checked {\n  background-color: var(--st-checkbox-checked-background-color);\n  border-color: var(--st-checkbox-checked-border-color);\n}\n\n.st-checkbox-checkmark {\n  width: 6px;\n  height: 11px;\n  border: solid white;\n  border-width: 0 2px 2px 0;\n  transform: rotate(45deg);\n}\n\n@keyframes slide-in-left {\n  from {\n    transform: translateX(-100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n\n@keyframes slide-in-right {\n  from {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n');var W=function(e){if(!document.querySelector('link[data-font="'.concat(e,'"]'))){var r=document.createElement("link");r.rel="stylesheet",r.href="https://fonts.googleapis.com/css2?family=".concat(e.replace(/ /g,"+"),":wght@400;700&display=swap"),r.setAttribute("data-font",e),document.head.appendChild(r)}},F=function(n){var o=n.columnEditorPosition,d=void 0===o?"right":o,i=n.columnEditorText,u=void 0===i?"Columns":i,b=n.columnResizing,v=void 0!==b&&b,f=n.defaultHeaders,g=n.draggable,k=void 0!==g&&g,w=n.editColumns,x=void 0!==w&&w,y=n.height,C=n.hideFooter,z=void 0!==C&&C,N=n.nextIcon,D=void 0===N?r(H,{className:"st-next-prev-icon"}):N,S=n.onCellChange,I=n.prevIcon,E=void 0===I?r(O,{className:"st-next-prev-icon"}):I,M=n.rows,L=n.rowsPerPage,U=void 0===L?10:L,X=n.selectableCells,F=void 0!==X&&X,G=n.selectableColumns,Y=void 0!==G&&G,q=n.shouldPaginate,K=void 0!==q&&q,Q=n.sortDownIcon,J=void 0===Q?r(j,{className:"st-sort-icon"}):Q,$=n.sortUpIcon,Z=void 0===$?r(P,{className:"st-sort-icon"}):$,_=n.theme,ee=void 0===_?"light":_;c((function(){switch(ee){case"light":default:W("Nunito");break;case"dark":W("Open Sans");break;case"pastel":W("Comic Sans MS");break;case"vibrant":W("Lobster");break;case"solarized-light":case"solarized-dark":W("Georgia");break;case"desert":W("Times New Roman");break;case"forest":W("Tahoma");break;case"ocean":W("Verdana");break;case"bubblegum":W("Pacifico");break;case"90s":W("Courier New")}}),[ee]);var re=s((function(){return M.map((function(e,r){return h(h({},e),{originalRowIndex:r})}))}),[M]),ne=a(null),oe=t(!1),te=oe[0],ae=oe[1],le=a(f),ce=t(null),se=ce[0],de=ce[1],ie=t({}),ue=ie[0],be=ie[1],ve=t(1),fe=ve[0],ge=ve[1],pe=s((function(){if(!se)return re;var e=function(e,r,n){var o=n?n.key:e[0],t="ascending";return n&&n.key.accessor===o.accessor&&"ascending"===n.direction&&(t="descending"),{sortedData:m([],r,!0).sort((function(e,r){return e[o.accessor]<r[o.accessor]?"ascending"===t?1:-1:e[o.accessor]>r[o.accessor]?"ascending"===t?-1:1:0})),newSortConfig:{key:o,direction:t}}}(le.current,re,se).sortedData;return e}),[re,se]),he=p((function(e){return e+1}),0)[1],me=function(e){var r=e.selectableCells,n=e.headers,o=e.rows,d=t(new Set),i=d[0],u=d[1],b=a(!1),v=a(null),f=l((function(){var e=Array.from(i).reduce((function(e,r){var t=r.split("-").map(Number),a=t[0],l=t[1];return e[a]||(e[a]=[]),e[a][l]=o[a][n[l].accessor],e}),{}),r=Object.values(e).map((function(e){return Object.values(e).join("\t")})).join("\n");navigator.clipboard.writeText(r)}),[i,o,n]);c((function(){var e=function(e){(e.ctrlKey||e.metaKey)&&"c"===e.key&&f()};return document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}),[f]);var g=l((function(e,r){return i.has("".concat(e,"-").concat(r))}),[i]),p=l((function(e,r){var n=[];return g(e-1,r)||n.push("st-selected-top-border"),g(e+1,r)||n.push("st-selected-bottom-border"),g(e,r-1)||n.push("st-selected-left-border"),g(e,r+1)||n.push("st-selected-right-border"),n.join(" ")}),[g]),h=s((function(){var e=Math.min.apply(Math,Array.from(i).map((function(e){return parseInt(e.split("-")[0])}))),r=Math.min.apply(Math,Array.from(i).map((function(e){return parseInt(e.split("-")[1])})));return function(n,o){return n===e&&o===r}}),[i]);return{selectedCells:i,handleMouseDown:function(e){var n=e.colIndex,o=e.rowIndex;r&&(b.current=!0,v.current={row:o,col:n},u(new Set(["".concat(o,"-").concat(n)])))},handleMouseOver:function(e,n){if(r&&b.current&&v.current){for(var o=new Set,t=Math.min(v.current.row,e),a=Math.max(v.current.row,e),l=Math.min(v.current.col,n),c=Math.max(v.current.col,n),s=t;s<=a;s++)for(var d=l;d<=c;d++)o.add("".concat(s,"-").concat(d));u(o)}},handleMouseUp:function(){b.current=!1,v.current=null},isSelected:g,getBorderClass:p,isTopLeftCell:h,setSelectedCells:u}}({selectableCells:F,headers:le.current,rows:pe}),ke=me.handleMouseDown,we=me.handleMouseOver,xe=me.handleMouseUp,ye=me.isSelected,Ce=me.getBorderClass,ze=me.isTopLeftCell,Ne=me.setSelectedCells,Re=le.current.filter((function(e){return!e.hide})),De=s((function(){return!!ne.current&&Re.reduce((function(e,r){return e+r.width}),0)<ne.current.clientWidth}),[Re]),Se=K?pe.slice((fe-1)*U,fe*U):pe;c((function(){var e=function(e){var r=e.target;r.closest(".st-cell")||Y&&(r.classList.contains("st-header-cell")||r.classList.contains("st-header-label"))||Ne(new Set)};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[Y,Ne]);var Ie=s((function(){return"".concat(Re.filter((function(e){return!0!==ue[e.accessor]})).map((function(e){return"".concat(e.width,"px")})).join(" ")," 1fr")}),[Re,ue]);return r(A.Provider,h({value:{rows:M,tableRows:re}},{children:e("div",h({className:"st-wrapper theme-".concat(ee),style:y?{height:y}:{}},{children:[e("div",h({className:"st-table-wrapper"},{children:[e("div",h({className:"st-table",onMouseUp:xe,onMouseLeave:xe,ref:ne,style:{gridTemplateColumns:Ie}},{children:[r(R,{columnResizing:v,currentRows:Se,draggable:k,forceUpdate:he,headersRef:le,hiddenColumns:ue,isWidthDragging:te,onSort:function(e,r){de((function(n){return(null==n?void 0:n.key.accessor)!==r?{key:le.current[e],direction:"ascending"}:"ascending"===(null==n?void 0:n.direction)?{key:le.current[e],direction:"descending"}:null}))},onTableHeaderDragEnd:function(e){le.current=e,he()},selectableColumns:Y,setIsWidthDragging:ae,setSelectedCells:Ne,shouldDisplayLastColumnCell:De,sort:se,sortDownIcon:J,sortUpIcon:Z,tableRef:ne}),r(T,{currentRows:Se,getBorderClass:Ce,handleMouseDown:ke,handleMouseOver:we,headers:le.current,hiddenColumns:ue,isSelected:ye,isTopLeftCell:ze,isWidthDragging:te,onCellChange:S,shouldDisplayLastColumnCell:De,shouldPaginate:K,tableRef:ne})]})),r(V,{headers:le.current,columnEditorText:u,editColumns:x,position:d,setHiddenColumns:be,hiddenColumns:ue})]})),r(B,{currentPage:fe,hideFooter:z,nextIcon:D,onPageChange:ge,prevIcon:E,rowsPerPage:U,shouldPaginate:K,totalRows:pe.length})]}))}))};export{F as SimpleTable};
+import{jsxs as e,jsx as n,Fragment as r}from"react/jsx-runtime";import{useState as o,useRef as t,useCallback as a,useEffect as l,useMemo as s,createContext as c,forwardRef as d,useContext as i,useLayoutEffect as u,createElement as g,createRef as b,memo as f,useReducer as v}from"react";var p=function(){return p=Object.assign||function(e){for(var n,r=1,o=arguments.length;r<o;r++)for(var t in n=arguments[r])Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t]);return e},p.apply(this,arguments)};function h(e,n){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&n.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var t=0;for(o=Object.getOwnPropertySymbols(e);t<o.length;t++)n.indexOf(o[t])<0&&Object.prototype.propertyIsEnumerable.call(e,o[t])&&(r[o[t]]=e[o[t]])}return r}function m(e,n,r){if(r||2===arguments.length)for(var o,t=0,a=n.length;t<a;t++)!o&&t in n||(o||(o=Array.prototype.slice.call(n,0,t)),o[t]=n[t]);return e.concat(o||Array.prototype.slice.call(n))}"function"==typeof SuppressedError&&SuppressedError;var w=function(r){var o=r.currentPage,t=r.hideFooter,a=r.nextIcon,l=r.onPageChange,s=r.prevIcon,c=r.rowsPerPage,d=r.shouldPaginate,i=r.totalRows,u=Math.ceil(i/c),g=o>1,b=o<u,f=function(e){e>=1&&e<=u&&l(e)};return t||!d?null:e("div",p({className:"st-footer"},{children:[n("button",p({className:"st-next-prev-btn ".concat(g?"":"disabled"),onClick:function(){return f(o-1)},disabled:!g},{children:s})),n("button",p({className:"st-next-prev-btn ".concat(b?"":"disabled"),onClick:function(){return f(o+1)},disabled:!b},{children:a})),Array.from({length:u},(function(e,r){return n("button",p({onClick:function(){return f(r+1)},className:"st-page-btn ".concat(o===r+1?"active":"")},{children:r+1}),r)}))]}))},k=function(e){var r=e.className;return n("svg",p({className:r,viewBox:"0 0 24 24",width:"24",height:"24",xmlns:"http://www.w3.org/2000/svg"},{children:n("path",{d:"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"})}))},x=function(e){var r=e.className;return n("svg",p({className:r,viewBox:"0 0 24 24",width:"24",height:"24",xmlns:"http://www.w3.org/2000/svg"},{children:n("path",{d:"M8.59 16.59L10 18l6-6-6-6-1.41 1.41L13.17 12z"})}))},y=c({rows:[],tableRows:[]}),R=function(e){var r=e.className;return n("svg",p({className:r,viewBox:"0 0 20 20",width:"20",height:"20",xmlns:"http://www.w3.org/2000/svg"},{children:n("path",{d:"M5.41 11.41L10 6.83l4.59 4.58L16 10l-6-6-6 6z"})}))},C=function(e){var r=e.className;return n("svg",p({className:r,viewBox:"0 0 20 20",width:"20",height:"20",xmlns:"http://www.w3.org/2000/svg"},{children:n("path",{d:"M5.41 7.59L10 12.17l4.59-4.58L16 9l-6 6-6-6z"})}))},D=function(r){var t=r.checked,a=void 0!==t&&t,l=r.children,s=r.onChange,c=o(a),d=c[0],i=c[1];return e("label",p({className:"st-checkbox-label"},{children:[n("input",{checked:d,className:"st-checkbox-input",onChange:function(){var e=!d;i(e),s&&s(e)},type:"checkbox"}),n("span",p({className:"st-checkbox-custom ".concat(d?"st-checked":"")},{children:d&&n("span",{className:"st-checkbox-checkmark"})})),l]}))},E=function(e){var r=e.headers,o=e.open,t=e.position;e.setOpen;var a=e.setHiddenColumns,l=e.hiddenColumns,s="left"===t?"left":"";return n("div",p({className:"st-column-editor-popout ".concat(o?"open":""," ").concat(s),onClick:function(e){return e.stopPropagation()}},{children:n("div",p({className:"st-column-editor-popout-content"},{children:r.map((function(e,r){return n(D,p({checked:l[e.accessor],onChange:function(n){var r;return a(p(p({},l),((r={})[e.accessor]=n,r)))}},{children:e.label}),r)}))}))}))},I=function(r){var t=r.columnEditorText,a=r.editColumns,l=r.editColumnsInitOpen,s=r.headers,c=r.position,d=void 0===c?"right":c,i=r.setHiddenColumns,u=r.hiddenColumns,g=o(l),b=g[0],f=g[1];return a?e("div",p({className:"st-column-editor ".concat(b?"open":""," ").concat(d),onClick:function(){return function(e){f(e)}(!b)}},{children:[n("div",p({className:"st-column-editor-text"},{children:t})),n(E,{headers:s,open:b,position:d,setOpen:f,setHiddenColumns:i,hiddenColumns:u})]})):null};!function(e,n){void 0===n&&(n={});var r=n.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],t=document.createElement("style");t.type="text/css","top"===r&&o.firstChild?o.insertBefore(t,o.firstChild):o.appendChild(t),t.styleSheet?t.styleSheet.cssText=e:t.appendChild(document.createTextNode(e))}}(':root {\n  /* New Variables for Theming */\n  --st-resize-handle-width: 3px;\n\n  --st-border-radius: 4px;\n  --st-border-width: 1px;\n  --st-cell-padding: 8px;\n  --st-font-size: 1rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 700;\n  --st-transition-duration: 0.3s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 4px;\n  --st-spacing-medium: 8px;\n  --st-spacing-large: 16px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  /* Tailwind Colors */\n  --white: #fff;\n  --black: #000;\n\n  --slate-50: #f8fafc;\n  --slate-100: #f1f5f9;\n  --slate-200: #e2e8f0;\n  --slate-300: #cbd5e1;\n  --slate-400: #94a3b8;\n  --slate-500: #64748b;\n  --slate-600: #475569;\n  --slate-700: #334155;\n  --slate-800: #1e293b;\n  --slate-900: #0f172a;\n  --slate-950: #020617;\n\n  --gray-50: #f9fafb;\n  --gray-100: #f3f4f6;\n  --gray-200: #e5e7eb;\n  --gray-300: #d1d5db;\n  --gray-400: #9ca3af;\n  --gray-500: #6b7280;\n  --gray-600: #4b5563;\n  --gray-700: #374151;\n  --gray-800: #1f2937;\n  --gray-900: #111827;\n  --gray-950: #030712;\n\n  --zinc-50: #fafafa;\n  --zinc-100: #f4f4f5;\n  --zinc-200: #e4e4e7;\n  --zinc-300: #d4d4d8;\n  --zinc-400: #a1a1aa;\n  --zinc-500: #71717a;\n  --zinc-600: #52525b;\n  --zinc-700: #3f3f46;\n  --zinc-800: #27272a;\n  --zinc-900: #18181b;\n  --zinc-950: #09090b;\n\n  --neutral-50: #fafafa;\n  --neutral-100: #f5f5f5;\n  --neutral-200: #e5e5e5;\n  --neutral-300: #d4d4d4;\n  --neutral-400: #a3a3a3;\n  --neutral-500: #737373;\n  --neutral-600: #525252;\n  --neutral-700: #404040;\n  --neutral-800: #262626;\n  --neutral-900: #171717;\n  --neutral-950: #0a0a0a;\n\n  --stone-50: #fafaf9;\n  --stone-100: #f5f5f4;\n  --stone-200: #e7e5e4;\n  --stone-300: #d6d3d1;\n  --stone-400: #a8a29e;\n  --stone-500: #78716c;\n  --stone-600: #57534e;\n  --stone-700: #44403c;\n  --stone-800: #292524;\n  --stone-900: #1c1917;\n  --stone-950: #0c0a09;\n\n  --red-50: #fef2f2;\n  --red-100: #fee2e2;\n  --red-200: #fecaca;\n  --red-300: #fca5a5;\n  --red-400: #f87171;\n  --red-500: #ef4444;\n  --red-600: #dc2626;\n  --red-700: #b91c1c;\n  --red-800: #991b1b;\n  --red-900: #7f1d1d;\n  --red-950: #450a0a;\n\n  --orange-50: #fff7ed;\n  --orange-100: #ffedd5;\n  --orange-200: #fed7aa;\n  --orange-300: #fdba74;\n  --orange-400: #fb923c;\n  --orange-500: #f97316;\n  --orange-600: #ea580c;\n  --orange-700: #c2410c;\n  --orange-800: #9a3412;\n  --orange-900: #7c2d12;\n  --orange-950: #431407;\n\n  --amber-50: #fffbeb;\n  --amber-100: #fef3c7;\n  --amber-200: #fde68a;\n  --amber-300: #fcd34d;\n  --amber-400: #fbbf24;\n  --amber-500: #f59e0b;\n  --amber-600: #d97706;\n  --amber-700: #b45309;\n  --amber-800: #92400e;\n  --amber-900: #78350f;\n  --amber-950: #451a03;\n\n  --yellow-50: #fefce8;\n  --yellow-100: #fef9c3;\n  --yellow-200: #fef08a;\n  --yellow-300: #fde047;\n  --yellow-400: #facc15;\n  --yellow-500: #eab308;\n  --yellow-600: #ca8a04;\n  --yellow-700: #a16207;\n  --yellow-800: #854d0e;\n  --yellow-900: #713f12;\n  --yellow-950: #422006;\n\n  --lime-50: #f7fee7;\n  --lime-100: #ecfccb;\n  --lime-200: #d9f99d;\n  --lime-300: #bef264;\n  --lime-400: #a3e635;\n  --lime-500: #84cc16;\n  --lime-600: #65a30d;\n  --lime-700: #4d7c0f;\n  --lime-800: #3f6212;\n  --lime-900: #365314;\n  --lime-950: #1a2e05;\n\n  --green-50: #f0fdf4;\n  --green-100: #dcfce7;\n  --green-200: #bbf7d0;\n  --green-300: #86efac;\n  --green-400: #4ade80;\n  --green-500: #22c55e;\n  --green-600: #16a34a;\n  --green-700: #15803d;\n  --green-800: #166534;\n  --green-900: #14532d;\n  --green-950: #052e16;\n\n  --emerald-50: #ecfdf5;\n  --emerald-100: #d1fae5;\n  --emerald-200: #a7f3d0;\n  --emerald-300: #6ee7b7;\n  --emerald-400: #34d399;\n  --emerald-500: #10b981;\n  --emerald-600: #059669;\n  --emerald-700: #047857;\n  --emerald-800: #065f46;\n  --emerald-900: #064e3b;\n  --emerald-950: #022c22;\n\n  --teal-50: #f0fdfa;\n  --teal-100: #ccfbf1;\n  --teal-200: #99f6e4;\n  --teal-300: #5eead4;\n  --teal-400: #2dd4bf;\n  --teal-500: #14b8a6;\n  --teal-600: #0d9488;\n  --teal-700: #0f766e;\n  --teal-800: #115e59;\n  --teal-900: #134e4a;\n  --teal-950: #042f2e;\n\n  --cyan-50: #ecfeff;\n  --cyan-100: #cffafe;\n  --cyan-200: #a5f3fc;\n  --cyan-300: #67e8f9;\n  --cyan-400: #22d3ee;\n  --cyan-500: #06b6d4;\n  --cyan-600: #0891b2;\n  --cyan-700: #0e7490;\n  --cyan-800: #155e75;\n  --cyan-900: #164e63;\n  --cyan-950: #083344;\n\n  --sky-50: #f0f9ff;\n  --sky-100: #e0f2fe;\n  --sky-200: #bae6fd;\n  --sky-300: #7dd3fc;\n  --sky-400: #38bdf8;\n  --sky-500: #0ea5e9;\n  --sky-600: #0284c7;\n  --sky-700: #0369a1;\n  --sky-800: #075985;\n  --sky-900: #0c4a6e;\n  --sky-950: #082f49;\n\n  --blue-50: #eff6ff;\n  --blue-100: #dbeafe;\n  --blue-200: #bfdbfe;\n  --blue-300: #93c5fd;\n  --blue-400: #60a5fa;\n  --blue-500: #3b82f6;\n  --blue-600: #2563eb;\n  --blue-700: #1d4ed8;\n  --blue-800: #1e40af;\n  --blue-900: #1e3a8a;\n  --blue-950: #172554;\n\n  --indigo-50: #eef2ff;\n  --indigo-100: #e0e7ff;\n  --indigo-200: #c7d2fe;\n  --indigo-300: #a5b4fc;\n  --indigo-400: #818cf8;\n  --indigo-500: #6366f1;\n  --indigo-600: #4f46e5;\n  --indigo-700: #4338ca;\n  --indigo-800: #3730a3;\n  --indigo-900: #312e81;\n  --indigo-950: #1e1b4b;\n\n  --violet-50: #f5f3ff;\n  --violet-100: #ede9fe;\n  --violet-200: #ddd6fe;\n  --violet-300: #c4b5fd;\n  --violet-400: #a78bfa;\n  --violet-500: #8b5cf6;\n  --violet-600: #7c3aed;\n  --violet-700: #6d28d9;\n  --violet-800: #5b21b6;\n  --violet-900: #4c1d95;\n  --violet-950: #2e1065;\n\n  --purple-50: #faf5ff;\n  --purple-100: #f3e8ff;\n  --purple-200: #e9d5ff;\n  --purple-300: #d8b4fe;\n  --purple-400: #c084fc;\n  --purple-500: #a855f7;\n  --purple-600: #9333ea;\n  --purple-700: #7e22ce;\n  --purple-800: #6b21a8;\n  --purple-900: #581c87;\n  --purple-950: #3b0764;\n\n  --fuchsia-50: #fdf4ff;\n  --fuchsia-100: #fae8ff;\n  --fuchsia-200: #f5d0fe;\n  --fuchsia-300: #f0abfc;\n  --fuchsia-400: #e879f9;\n  --fuchsia-500: #d946ef;\n  --fuchsia-600: #c026d3;\n  --fuchsia-700: #a21caf;\n  --fuchsia-800: #86198f;\n  --fuchsia-900: #701a75;\n  --fuchsia-950: #4a044e;\n\n  --pink-50: #fdf2f8;\n  --pink-100: #fce7f3;\n  --pink-200: #fbcfe8;\n  --pink-300: #f9a8d4;\n  --pink-400: #f472b6;\n  --pink-500: #ec4899;\n  --pink-600: #db2777;\n  --pink-700: #be185d;\n  --pink-800: #9d174d;\n  --pink-900: #831843;\n  --pink-950: #500724;\n\n  --rose-50: #fff1f2;\n  --rose-100: #ffe4e6;\n  --rose-200: #fecdd3;\n  --rose-300: #fda4af;\n  --rose-400: #fb7185;\n  --rose-500: #f43f5e;\n  --rose-600: #e11d48;\n  --rose-700: #be123c;\n  --rose-800: #9f1239;\n  --rose-900: #881337;\n  --rose-950: #4c0519;\n}\n\n.theme-light {\n  /* Base Variables */\n  --st-border-radius: 4px;\n  --st-border-width: 1px;\n  --st-cell-padding: 8px;\n  --st-font-size: 0.875rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.2s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 4px;\n  --st-spacing-medium: 8px;\n  --st-spacing-large: 16px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--gray-300); /* Light gray for borders */\n  --st-odd-row-background-color: var(--white); /* White for odd rows */\n  --st-even-row-background-color: var(--white); /* White for even rows */\n  --st-header-background-color: var(--white); /* Deep blue for headers */\n  --st-dragging-background-color: var(--gray-200); /* Light gray for dragging */\n  --st-selected-cell-background-color: var(--blue-200); /* Gold for selected cells */\n  --st-selected-first-cell-background-color: var(--blue-200); /* Gold for first selected cell */\n  --st-footer-background-color: var(--white); /* White for footer */\n  --st-cell-color: var(--gray-800); /* Dark gray for cell text */\n  --st-cell-odd-row-color: var(--gray-700); /* Slightly lighter gray for odd row text */\n  --st-edit-cell-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05), 0 1px 1px -1px rgba(0, 0, 0, 0.05); /* Subtle shadow */\n  --st-selected-cell-color: var(--gray-900); /* Darker gray for selected cell text */\n  --st-selected-first-cell-color: var(--gray-900); /* Darker gray for first selected cell text */\n  --st-resize-handle-color: var(--blue-300); /* Darker blue for resize handles */\n  --st-separator-border-color: var(--slate-100); /* Light gray for separators */\n  --st-last-group-row-separator-border-color: var(--slate-300); /* Light gray for separators */\n  --st-selected-border-top-color: var(--blue-600); /* Darker blue for selected borders */\n  --st-selected-border-bottom-color: var(--blue-600);\n  --st-selected-border-left-color: var(--blue-600);\n  --st-selected-border-right-color: var(--blue-600);\n  --st-checkbox-checked-background-color: var(--blue-600); /* Darker blue for checked checkboxes */\n  --st-checkbox-checked-border-color: var(--blue-600);\n  --st-column-editor-background-color: var(--white); /* White for column editor */\n  --st-column-editor-popout-background-color: var(--white); /* White for popout editor */\n  --st-button-hover-background-color: var(--gray-200); /* Light gray for button hover */\n  --st-button-active-background-color: var(--blue-800); /* Deep blue for button active */\n  --st-font-family: "Roboto", sans-serif; /* Professional font */\n  --st-editable-cell-focus-border-color: var(--blue-600); /* Darker blue for editable cell focus */\n}\n\n.theme-dark {\n  /* Base Variables */\n  --st-border-radius: 6px;\n  --st-border-width: 1px;\n  --st-cell-padding: 10px;\n  --st-font-size: 0.875rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.2s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 6px;\n  --st-spacing-medium: 10px;\n  --st-spacing-large: 20px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-600);\n\n  --st-border-color: var(--slate-800);\n  --st-odd-row-background-color: var(--slate-800);\n  --st-even-row-background-color: var(--slate-900);\n  --st-header-background-color: var(--slate-700);\n  --st-dragging-background-color: var(--blue-800);\n  --st-selected-cell-background-color: var(--blue-700);\n  --st-selected-first-cell-background-color: var(--amber-700);\n  --st-footer-background-color: var(--slate-900);\n  --st-cell-color: var(--white);\n  --st-cell-odd-row-color: var(--slate-300);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--white / 0.1), 0 1px 2px -1px var(--white / 0.1);\n  --st-selected-cell-color: var(--white);\n  --st-selected-first-cell-color: var(--white);\n  --st-resize-handle-color: var(--slate-600);\n  --st-separator-border-color: var(--slate-500);\n  --st-last-group-row-separator-border-color: var(--slate-700);\n  --st-selected-border-top-color: var(--blue-700);\n  --st-selected-border-bottom-color: var(--blue-700);\n  --st-selected-border-left-color: var(--blue-700);\n  --st-selected-border-right-color: var(--blue-700);\n  --st-checkbox-checked-background-color: var(--blue-700);\n  --st-checkbox-checked-border-color: var(--blue-700);\n  --st-column-editor-background-color: var(--slate-800);\n  --st-column-editor-popout-background-color: var(--slate-800);\n  --st-button-hover-background-color: var(--slate-600);\n  --st-button-active-background-color: var(--slate-700);\n  --st-font-family: "Open Sans", sans-serif;\n  --st-editable-cell-focus-border-color: var(--slate-600);\n}\n\n.theme-high-contrast {\n  /* Base Variables */\n  --st-border-radius: 0;\n  --st-border-width: 2px;\n  --st-cell-padding: 12px;\n  --st-font-size: 1rem;\n  --st-font-weight-normal: 500;\n  --st-font-weight-bold: 800;\n  --st-transition-duration: 0s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.7;\n  --st-spacing-small: 8px;\n  --st-spacing-medium: 12px;\n  --st-spacing-large: 24px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: #000000;\n\n  --st-border-color: var(--slate-900);\n  --st-odd-row-background-color: var(--slate-50);\n  --st-even-row-background-color: var(--slate-900);\n  --st-header-background-color: var(--slate-900);\n  --st-dragging-background-color: var(--yellow-500);\n  --st-selected-cell-background-color: var(--slate-900);\n  --st-selected-first-cell-background-color: var(--red-500);\n  --st-footer-background-color: var(--slate-900);\n  --st-cell-color: var(--white);\n  --st-cell-odd-row-color: var(--slate-900);\n  --st-edit-cell-shadow: none;\n  --st-selected-cell-color: var(--white);\n  --st-selected-first-cell-color: var(--white);\n  --st-resize-handle-color: var(--white);\n  --st-separator-border-color: var(--slate-200);\n  --st-last-group-row-separator-border-color: var(--slate-900);\n  --st-selected-border-top-color: var(--orange-600);\n  --st-selected-border-bottom-color: var(--orange-600);\n  --st-selected-border-left-color: var(--orange-600);\n  --st-selected-border-right-color: var(--orange-600);\n  --st-checkbox-checked-background-color: var(--slate-50);\n  --st-checkbox-checked-border-color: var(--slate-50);\n  --st-column-editor-background-color: var(--slate-900);\n  --st-column-editor-popout-background-color: var(--slate-900);\n  --st-button-hover-background-color: var(--slate-50);\n  --st-button-active-background-color: var(--slate-900);\n  --st-font-family: "Arial", sans-serif;\n  --st-editable-cell-focus-border-color: var(--orange-600);\n}\n\n.theme-pastel {\n  /* Base Variables */\n  --st-border-radius: 8px;\n  --st-border-width: 1px;\n  --st-cell-padding: 10px;\n  --st-font-size: 0.9rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.3s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 6px;\n  --st-spacing-medium: 10px;\n  --st-spacing-large: 20px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--purple-200);\n  --st-odd-row-background-color: var(--purple-50);\n  --st-even-row-background-color: var(--blue-50);\n  --st-header-background-color: var(--blue-50);\n  --st-dragging-background-color: var(--cyan-50);\n  --st-selected-cell-background-color: var(--orange-50);\n  --st-selected-first-cell-background-color: var(--amber-50);\n  --st-footer-background-color: var(--purple-50);\n  --st-cell-color: var(--slate-600);\n  --st-cell-odd-row-color: var(--slate-700);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-selected-cell-color: var(--slate-600);\n  --st-selected-first-cell-color: var(--slate-600);\n  --st-resize-handle-color: var(--purple-200);\n  --st-separator-border-color: var(--purple-200);\n  --st-last-group-row-separator-border-color: var(--purple-500);\n  --st-selected-border-top-color: var(--amber-500);\n  --st-selected-border-bottom-color: var(--amber-500);\n  --st-selected-border-left-color: var(--amber-500);\n  --st-selected-border-right-color: var(--amber-500);\n  --st-checkbox-checked-background-color: var(--purple-200);\n  --st-checkbox-checked-border-color: var(--purple-200);\n  --st-column-editor-background-color: var(--purple-50);\n  --st-column-editor-popout-background-color: var(--purple-50);\n  --st-button-hover-background-color: var(--purple-100);\n  --st-button-active-background-color: var(--purple-200);\n  --st-font-family: "Comic Sans MS", cursive, sans-serif;\n  --st-editable-cell-focus-border-color: var(--purple-300);\n}\n\n.theme-vibrant {\n  /* Base Variables */\n  --st-border-radius: 12px;\n  --st-border-width: 2px;\n  --st-cell-padding: 12px;\n  --st-font-size: 1rem;\n  --st-font-weight-normal: 500;\n  --st-font-weight-bold: 700;\n  --st-transition-duration: 0.3s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 8px;\n  --st-spacing-medium: 12px;\n  --st-spacing-large: 24px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--orange-500);\n  --st-odd-row-background-color: var(--orange-100);\n  --st-even-row-background-color: var(--orange-200);\n  --st-header-background-color: var(--orange-300);\n  --st-dragging-background-color: var(--blue-300);\n  --st-selected-cell-background-color: var(--blue-400);\n  --st-selected-first-cell-background-color: var(--amber-300);\n  --st-footer-background-color: var(--orange-50);\n  --st-cell-color: var(--orange-900);\n  --st-cell-odd-row-color: var(--orange-800);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--black / 0.2), 0 1px 2px -1px var(--black / 0.2);\n  --st-selected-cell-color: var(--orange-900);\n  --st-selected-first-cell-color: var(--orange-900);\n  --st-resize-handle-color: var(--orange-400);\n  --st-separator-border-color: var(--orange-200);\n  --st-last-group-row-separator-border-color: var(--orange-500);\n  --st-selected-border-top-color: var(--orange-700);\n  --st-selected-border-bottom-color: var(--orange-700);\n  --st-selected-border-left-color: var(--orange-700);\n  --st-selected-border-right-color: var(--orange-700);\n  --st-checkbox-checked-background-color: var(--orange-500);\n  --st-checkbox-checked-border-color: var(--orange-500);\n  --st-column-editor-background-color: var(--orange-100);\n  --st-column-editor-popout-background-color: var(--orange-100);\n  --st-button-hover-background-color: var(--orange-300);\n  --st-button-active-background-color: var(--orange-400);\n  --st-font-family: "Lobster", cursive;\n  --st-editable-cell-focus-border-color: var(--orange-600);\n}\n\n.theme-solarized-light {\n  /* Base Variables */\n  --st-border-radius: 4px;\n  --st-border-width: 1px;\n  --st-cell-padding: 8px;\n  --st-font-size: 0.875rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.2s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 4px;\n  --st-spacing-medium: 8px;\n  --st-spacing-large: 16px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--yellow-300);\n  --st-odd-row-background-color: var(--yellow-50);\n  --st-even-row-background-color: var(--yellow-200);\n  --st-header-background-color: var(--yellow-200);\n  --st-dragging-background-color: var(--yellow-300);\n  --st-selected-cell-background-color: var(--slate-400);\n  --st-selected-first-cell-background-color: var(--amber-600);\n  --st-footer-background-color: var(--yellow-50);\n  --st-cell-color: var(--slate-600);\n  --st-cell-odd-row-color: var(--slate-700);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-selected-cell-color: var(--slate-600);\n  --st-selected-first-cell-color: var(--slate-600);\n  --st-resize-handle-color: var(--slate-400);\n  --st-separator-border-color: var(--yellow-300);\n  --st-last-group-row-separator-border-color: var(--yellow-500);\n  --st-selected-border-top-color: var(--yellow-600);\n  --st-selected-border-bottom-color: var(--yellow-600);\n  --st-selected-border-left-color: var(--yellow-600);\n  --st-selected-border-right-color: var(--yellow-600);\n  --st-checkbox-checked-background-color: var(--slate-400);\n  --st-checkbox-checked-border-color: var(--slate-400);\n  --st-column-editor-background-color: var(--yellow-200);\n  --st-column-editor-popout-background-color: var(--yellow-200);\n  --st-button-hover-background-color: var(--yellow-200);\n  --st-button-active-background-color: var(--slate-400);\n  --st-font-family: "Georgia", serif;\n  --st-editable-cell-focus-border-color: var(--yellow-400);\n}\n\n.theme-solarized-dark {\n  /* Base Variables */\n  --st-border-radius: 4px;\n  --st-border-width: 1px;\n  --st-cell-padding: 8px;\n  --st-font-size: 0.875rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.2s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 4px;\n  --st-spacing-medium: 8px;\n  --st-spacing-large: 16px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-600);\n\n  --st-border-color: var(--slate-800);\n  --st-odd-row-background-color: var(--slate-900);\n  --st-even-row-background-color: var(--slate-800);\n  --st-header-background-color: var(--slate-800);\n  --st-dragging-background-color: var(--slate-800);\n  --st-selected-cell-background-color: var(--slate-600);\n  --st-selected-first-cell-background-color: var(--amber-600);\n  --st-footer-background-color: var(--slate-900);\n  --st-cell-color: var(--slate-300);\n  --st-cell-odd-row-color: var(--slate-400);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--white / 0.1), 0 1px 2px -1px var(--white / 0.1);\n  --st-selected-cell-color: var(--slate-300);\n  --st-selected-first-cell-color: var(--slate-300);\n  --st-resize-handle-color: var(--slate-600);\n  --st-separator-border-color: var(--slate-400);\n  --st-last-group-row-separator-border-color: var(--slate-600);\n  --st-selected-border-top-color: var(--blue-800);\n  --st-selected-border-bottom-color: var(--blue-800);\n  --st-selected-border-left-color: var(--blue-800);\n  --st-selected-border-right-color: var(--blue-800);\n  --st-checkbox-checked-background-color: var(--slate-600);\n  --st-checkbox-checked-border-color: var(--slate-600);\n  --st-column-editor-background-color: var(--slate-800);\n  --st-column-editor-popout-background-color: var(--slate-800);\n  --st-button-hover-background-color: var(--slate-600);\n  --st-button-active-background-color: var(--slate-800);\n  --st-font-family: "Courier New", monospace;\n  --st-editable-cell-focus-border-color: var(--blue-800);\n}\n\n.theme-ocean {\n  /* Base Variables */\n  --st-border-radius: 6px;\n  --st-border-width: 1px;\n  --st-cell-padding: 10px;\n  --st-font-size: 0.9rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.3s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 6px;\n  --st-spacing-medium: 10px;\n  --st-spacing-large: 20px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--cyan-700);\n  --st-odd-row-background-color: var(--cyan-50);\n  --st-even-row-background-color: var(--cyan-100);\n  --st-header-background-color: var(--cyan-100);\n  --st-dragging-background-color: var(--cyan-300);\n  --st-selected-cell-background-color: var(--cyan-700);\n  --st-selected-first-cell-background-color: var(--slate-900);\n  --st-footer-background-color: var(--cyan-50);\n  --st-cell-color: var(--slate-900);\n  --st-cell-odd-row-color: var(--cyan-700);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-selected-cell-color: var(--slate-900);\n  --st-selected-first-cell-color: var(--slate-900);\n  --st-resize-handle-color: var(--cyan-300);\n  --st-separator-border-color: var(--cyan-200);\n  --st-last-group-row-separator-border-color: var(--cyan-500);\n  --st-selected-border-top-color: var(--blue-700);\n  --st-selected-border-bottom-color: var(--blue-700);\n  --st-selected-border-left-color: var(--blue-700);\n  --st-selected-border-right-color: var(--blue-700);\n  --st-checkbox-checked-background-color: var(--cyan-700);\n  --st-checkbox-checked-border-color: var(--cyan-700);\n  --st-column-editor-background-color: var(--cyan-100);\n  --st-column-editor-popout-background-color: var(--cyan-100);\n  --st-button-hover-background-color: var(--cyan-300);\n  --st-button-active-background-color: var(--cyan-700);\n  --st-font-family: "Verdana", sans-serif;\n  --st-editable-cell-focus-border-color: var(--cyan-500);\n}\n\n.theme-forest {\n  /* Base Variables */\n  --st-border-radius: 4px;\n  --st-border-width: 1px;\n  --st-cell-padding: 8px;\n  --st-font-size: 0.875rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.2s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 4px;\n  --st-spacing-medium: 8px;\n  --st-spacing-large: 16px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--green-800);\n  --st-odd-row-background-color: var(--green-50);\n  --st-even-row-background-color: var(--green-100);\n  --st-header-background-color: var(--green-100);\n  --st-dragging-background-color: var(--green-400);\n  --st-selected-cell-background-color: var(--green-700);\n  --st-selected-first-cell-background-color: var(--green-900);\n  --st-footer-background-color: var(--green-50);\n  --st-cell-color: var(--green-900);\n  --st-cell-odd-row-color: var(--green-700);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-selected-cell-color: var(--green-900);\n  --st-selected-first-cell-color: var(--green-900);\n  --st-resize-handle-color: var(--green-400);\n  --st-separator-border-color: var(--green-200);\n  --st-last-group-row-separator-border-color: var(--green-500);\n  --st-selected-border-top-color: var(--green-600);\n  --st-selected-border-bottom-color: var(--green-600);\n  --st-selected-border-left-color: var(--green-600);\n  --st-selected-border-right-color: var(--green-600);\n  --st-checkbox-checked-background-color: var(--green-700);\n  --st-checkbox-checked-border-color: var(--green-700);\n  --st-column-editor-background-color: var(--green-100);\n  --st-column-editor-popout-background-color: var(--green-100);\n  --st-button-hover-background-color: var(--green-400);\n  --st-button-active-background-color: var(--green-700);\n  --st-font-family: "Tahoma", sans-serif;\n  --st-editable-cell-focus-border-color: var(--green-600);\n}\n\n.theme-desert {\n  /* Base Variables */\n  --st-border-radius: 8px;\n  --st-border-width: 1px;\n  --st-cell-padding: 10px;\n  --st-font-size: 0.9rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.3s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 6px;\n  --st-spacing-medium: 10px;\n  --st-spacing-large: 20px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--amber-600);\n  --st-odd-row-background-color: var(--amber-50);\n  --st-even-row-background-color: var(--amber-100);\n  --st-header-background-color: var(--amber-100);\n  --st-dragging-background-color: var(--amber-300);\n  --st-selected-cell-background-color: var(--amber-600);\n  --st-selected-first-cell-background-color: var(--amber-800);\n  --st-footer-background-color: var(--amber-50);\n  --st-cell-color: var(--amber-800);\n  --st-cell-odd-row-color: var(--amber-600);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-selected-cell-color: var(--amber-800);\n  --st-selected-first-cell-color: var(--amber-800);\n  --st-resize-handle-color: var(--amber-300);\n  --st-separator-border-color: var(--amber-200);\n  --st-last-group-row-separator-border-color: var(--amber-500);\n  --st-selected-border-top-color: var(--amber-700);\n  --st-selected-border-bottom-color: var(--amber-700);\n  --st-selected-border-left-color: var(--amber-700);\n  --st-selected-border-right-color: var(--amber-700);\n  --st-checkbox-checked-background-color: var(--amber-600);\n  --st-checkbox-checked-border-color: var(--amber-600);\n  --st-column-editor-background-color: var(--amber-100);\n  --st-column-editor-popout-background-color: var(--amber-100);\n  --st-button-hover-background-color: var(--amber-300);\n  --st-button-active-background-color: var(--amber-600);\n  --st-font-family: "Times New Roman", serif;\n  --st-editable-cell-focus-border-color: var(--amber-700);\n}\n\n.theme-bubblegum {\n  /* Base Variables */\n  --st-border-radius: 16px;\n  --st-border-width: 2px;\n  --st-cell-padding: 12px;\n  --st-font-size: 1rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 600;\n  --st-transition-duration: 0.3s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 8px;\n  --st-spacing-medium: 12px;\n  --st-spacing-large: 24px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--pink-500);\n  --st-odd-row-background-color: var(--pink-50);\n  --st-even-row-background-color: var(--pink-100);\n  --st-header-background-color: var(--pink-200);\n  --st-dragging-background-color: var(--pink-300);\n  --st-selected-cell-background-color: var(--pink-400);\n  --st-selected-first-cell-background-color: var(--pink-600);\n  --st-footer-background-color: var(--pink-50);\n  --st-cell-color: var(--pink-900);\n  --st-cell-odd-row-color: var(--pink-800);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-selected-cell-color: var(--pink-900);\n  --st-selected-first-cell-color: var(--pink-900);\n  --st-resize-handle-color: var(--pink-400);\n  --st-separator-border-color: var(--pink-200);\n  --st-last-group-row-separator-border-color: var(--pink-500);\n  --st-selected-border-top-color: var(--pink-700);\n  --st-selected-border-bottom-color: var(--pink-700);\n  --st-selected-border-left-color: var(--pink-700);\n  --st-selected-border-right-color: var(--pink-700);\n  --st-checkbox-checked-background-color: var(--pink-500);\n  --st-checkbox-checked-border-color: var(--pink-500);\n  --st-column-editor-background-color: var(--pink-100);\n  --st-column-editor-popout-background-color: var(--pink-100);\n  --st-button-hover-background-color: var(--pink-300);\n  --st-button-active-background-color: var(--pink-400);\n  --st-font-family: "Pacifico", cursive;\n  --st-editable-cell-focus-border-color: var(--pink-600);\n}\n\n.theme-90s {\n  /* Base Variables */\n  --st-border-radius: 0;\n  --st-border-width: 2px;\n  --st-cell-padding: 8px;\n  --st-font-size: 0.875rem;\n  --st-font-weight-normal: 400;\n  --st-font-weight-bold: 700;\n  --st-transition-duration: 0.1s;\n  --st-transition-ease: ease;\n  --st-opacity-disabled: 0.5;\n  --st-spacing-small: 4px;\n  --st-spacing-medium: 8px;\n  --st-spacing-large: 16px;\n  --st-scrollbar-bg-color: transparent;\n  --st-scrollbar-thumb-color: var(--slate-200);\n\n  --st-border-color: var(--gray-500);\n  --st-odd-row-background-color: var(--gray-100);\n  --st-even-row-background-color: var(--gray-200);\n  --st-header-background-color: var(--gray-300);\n  --st-dragging-background-color: var(--gray-400);\n  --st-selected-cell-background-color: var(--gray-500);\n  --st-selected-first-cell-background-color: var(--gray-600);\n  --st-footer-background-color: var(--gray-100);\n  --st-cell-color: var(--gray-900);\n  --st-cell-odd-row-color: var(--gray-800);\n  --st-edit-cell-shadow: 0 1px 3px 0 var(--black / 0.1), 0 1px 2px -1px var(--black / 0.1);\n  --st-selected-cell-color: var(--gray-900);\n  --st-selected-first-cell-color: var(--gray-900);\n  --st-resize-handle-color: var(--gray-400);\n  --st-separator-border-color: var(--gray-200);\n  --st-last-group-row-separator-border-color: var(--gray-500);\n  --st-selected-border-top-color: var(--gray-700);\n  --st-selected-border-bottom-color: var(--gray-700);\n  --st-selected-border-left-color: var(--gray-700);\n  --st-selected-border-right-color: var(--gray-700);\n  --st-checkbox-checked-background-color: var(--gray-500);\n  --st-checkbox-checked-border-color: var(--gray-500);\n  --st-column-editor-background-color: var(--gray-200);\n  --st-column-editor-popout-background-color: var(--gray-200);\n  --st-button-hover-background-color: var(--gray-300);\n  --st-button-active-background-color: var(--gray-400);\n  --st-font-family: "Courier New", monospace;\n  --st-editable-cell-focus-border-color: var(--gray-600);\n}\n\n/* Global styles */\n* {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  font-family: var(--st-font-family);\n  scrollbar-color: var(--st-scrollbar-thumb-color) var(--st-scrollbar-bg-color);\n  scrollbar-width: thin;\n}\n\n/* Apply Nunito as the default font */\nbody {\n  font-size: var(--st-font-size);\n  font-weight: var(--st-font-weight-normal);\n}\n\n/* Wrapper for the table */\n.st-wrapper {\n  position: relative;\n  border: var(--st-border-width) solid var(--st-border-color);\n  border-radius: var(--st-border-radius);\n  max-height: 100dvh;\n  overflow: hidden;\n}\n\n.st-table-wrapper-container {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n.st-table-wrapper {\n  position: relative;\n  display: flex;\n  overflow: auto;\n  height: 100%;\n  width: 100%;\n}\n.st-table-content {\n  display: flex;\n  flex-direction: column;\n}\n\n/* Header */\n.st-table-header-container {\n  display: flex;\n}\n\n.st-table-header-container::after {\n  content: "";\n  display: block;\n  width: 11px;\n  flex-shrink: 0;\n  background-color: var(--st-header-background-color);\n  border-bottom: var(--st-border-width) solid var(--st-border-color);\n}\n\n.st-header-pinned-left,\n.st-header-main,\n.st-header-pinned-right {\n  display: grid;\n}\n.st-header-pinned-left {\n  border-right: var(--st-border-width) solid var(--st-border-color);\n}\n.st-header-pinned-right {\n  border-left: var(--st-border-width) solid var(--st-border-color);\n}\n.st-header-main {\n  overflow: auto;\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n}\n.st-header-main::-webkit-scrollbar {\n  display: none;\n}\n\n/* Body */\n.st-table-body-container {\n  display: flex;\n  width: 100%;\n  overflow: auto;\n  height: max-content;\n  /* min-height: calc(100% - 40px); */\n}\n.st-table-body-main,\n.st-table-body-pinned-left,\n.st-table-body-pinned-right {\n  display: grid;\n  height: max-content;\n  /* min-height 100% - table header height */\n  /* min-height: calc(100% - 40px); */\n}\n.st-table-body-pinned-left {\n  border-right: var(--st-border-width) solid var(--st-border-color);\n}\n.st-table-body-main {\n  overflow: auto;\n  scrollbar-width: none;\n}\n\n.st-table-body-pinned-right {\n  border-left: var(--st-border-width) solid var(--st-border-color);\n}\n\n/* Styles for table header cells */\n.st-header-cell {\n  position: sticky;\n  top: 0;\n  background-color: var(--st-header-background-color);\n  z-index: 1;\n  font-weight: var(--st-font-weight-bold);\n\n  display: flex;\n  align-items: center;\n  gap: var(--st-spacing-small);\n  border-top: var(--st-border-width) solid transparent;\n  border-bottom: var(--st-border-width) solid var(--st-border-color);\n}\n.st-header-cell.clickable {\n  cursor: pointer;\n}\n.st-header-cell.draggable {\n  cursor: grab;\n}\n\n/* Common styles for table header and cells */\n.st-header-cell,\n.st-cell {\n  display: flex;\n  align-items: center;\n  color: var(--slate-800);\n  overflow: hidden;\n  gap: var(--st-spacing-small);\n  /* mix-blend-mode: multiply; */\n}\n.st-header-cell.right-aligned,\n.st-cell.right-aligned {\n  justify-content: flex-end;\n  text-align: right;\n}\n.st-cell.right-aligned {\n  padding-right: calc(var(--st-cell-padding) + var(--st-spacing-small) + var(--st-resize-handle-width));\n}\n.st-header-cell.right-aligned > .st-header-label {\n  text-align: right;\n}\n\n.st-cell.clickable {\n  cursor: pointer;\n}\n\n.st-header-cell,\n.st-cell,\n.st-cell-editing {\n  width: 100%;\n  height: 40px;\n}\n\n.st-cell-editing {\n  position: relative;\n}\n\n.st-header-label {\n  flex: 1;\n  color: var(--st-cell-color);\n}\n\n.st-header-label,\n.st-cell {\n  user-select: none;\n  padding: var(--st-cell-padding);\n  text-align: left;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  width: 100%;\n}\n.st-cell {\n  position: relative;\n  border: var(--st-border-width) solid transparent;\n}\n\n.st-cell-depth-1 {\n  padding-left: calc(var(--st-cell-padding) * 4);\n}\n.st-cell-depth-2 {\n  padding-left: calc(var(--st-cell-padding) * 5);\n}\n.st-cell-depth-3 {\n  padding-left: calc(var(--st-cell-padding) * 6);\n}\n.st-cell-depth-4 {\n  padding-left: calc(var(--st-cell-padding) * 7);\n}\n.st-cell-depth-5 {\n  padding-left: calc(var(--st-cell-padding) * 8);\n}\n.st-cell-depth-6 {\n  padding-left: calc(var(--st-cell-padding) * 9);\n}\n.st-cell-depth-7 {\n  padding-left: calc(var(--st-cell-padding) * 10);\n}\n\n.st-sort-icon-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n\n.st-sort-icon {\n  fill: var(--slate-500);\n}\n\n.st-header-resize-handle {\n  top: 0;\n  right: 0;\n  width: var(--st-resize-handle-width);\n  height: 12px;\n  cursor: col-resize;\n  background-color: var(--st-resize-handle-color);\n}\n\n.st-row-separator {\n  height: 1px;\n  background-color: var(--st-separator-border-color);\n  grid-column: 1 / -1;\n}\n.st-row-separator.st-last-group-row {\n  background-color: var(--st-last-group-row-separator-border-color);\n}\n.st-cell-even-row {\n  background-color: var(--st-even-row-background-color);\n}\n\n.st-cell-odd-row:not(.st-cell-selected) {\n  background-color: var(--st-odd-row-background-color);\n  color: var(--st-cell-odd-row-color);\n}\n.st-cell:not(.st-cell-odd-row):not(.st-cell-selected) {\n  color: var(--st-cell-color);\n}\n.st-last-group-row {\n}\n\n/* Style for a cell when it is being dragged */\n.st-dragging {\n  background-color: var(--st-dragging-background-color);\n}\n\n/* Style for selected table cells */\n.st-cell-selected {\n  background-color: var(--st-selected-cell-background-color);\n  color: var(--st-selected-cell-color);\n}\n\n/* Style for the first selected table cell */\n.st-cell-selected-first {\n  background-color: var(--st-selected-first-cell-background-color);\n  color: var(--st-selected-first-cell-color);\n}\n\n/* Border for selected cells */\n.st-selected-top-border {\n  border-top: var(--st-border-width) solid var(--st-selected-border-top-color);\n}\n\n.st-selected-bottom-border {\n  border-bottom: var(--st-border-width) solid var(--st-selected-border-bottom-color);\n}\n\n.st-selected-left-border {\n  border-left: var(--st-border-width) solid var(--st-selected-border-left-color);\n}\n\n.st-selected-right-border {\n  border-right: var(--st-border-width) solid var(--st-selected-border-right-color);\n}\n\n.st-horizontal-scrollbar-left,\n.st-horizontal-scrollbar-right {\n  background-color: var(--st-scrollbar-bg-color);\n}\n.st-horizontal-scrollbar-middle {\n  overflow-x: scroll;\n}\n.st-horizontal-scrollbar-middle > div {\n  padding-bottom: 0.01px;\n  transform: translateY(1px);\n}\n\n.st-horizontal-scrollbar-container {\n  display: flex;\n  align-items: center;\n}\n.st-footer {\n  display: flex;\n  align-items: center;\n  background-color: var(--st-footer-background-color);\n  padding: var(--st-spacing-medium);\n  border-top: var(--st-border-width) solid var(--st-border-color);\n}\n\n.st-next-prev-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--st-spacing-small);\n  cursor: pointer;\n  background-color: transparent;\n  border: none;\n  border-radius: var(--st-border-radius);\n  transition: background-color var(--st-transition-duration) var(--st-transition-ease);\n}\n.st-next-prev-btn {\n  fill: var(--slate-600);\n}\n.disabled > .st-next-prev-icon {\n  cursor: not-allowed;\n  fill: var(--slate-400);\n}\n\n.st-next-prev-btn:not(.disabled):hover {\n  background-color: var(--slate-100);\n}\n\n.st-page-btn {\n  margin-left: var(--st-spacing-small);\n  padding: var(--st-spacing-small);\n  cursor: pointer;\n  background-color: transparent;\n  color: var(--slate-600);\n  border: none;\n  border-radius: var(--st-border-radius);\n  transition: background-color var(--st-transition-duration) var(--st-transition-ease);\n}\n\n.st-page-btn:hover {\n  background-color: var(--st-button-hover-background-color);\n}\n\n.st-page-btn.active {\n  background-color: var(--st-button-active-background-color);\n  color: white;\n}\n\n.editable-cell-input {\n  position: absolute;\n  top: 0;\n  left: 0;\n  border-radius: var(--st-border-radius);\n  border: var(--st-border-width) solid var(--st-border-color);\n  box-shadow: var(--st-edit-cell-shadow-color);\n  z-index: 1;\n  outline: none;\n  height: 100%;\n  width: 100%;\n  padding: var(--st-cell-padding);\n  font-size: var(--st-font-size);\n}\n.editable-cell-input:focus {\n  border: var(--st-border-width) solid var(--st-editable-cell-focus-border-color);\n}\n.st-column-editor {\n  position: relative;\n  user-select: none;\n  background: var(--st-footer-background-color);\n  border-left: var(--st-border-width) solid var(--st-border-color);\n  cursor: pointer;\n  color: var(--slate-500);\n  flex-shrink: 0;\n}\n\n.st-column-editor-text {\n  padding: var(--st-spacing-medium) var(--st-spacing-small);\n  writing-mode: vertical-rl;\n  z-index: 2;\n}\n\n.st-column-editor.open,\n.st-column-editor.open .st-column-editor-text {\n  background-color: var(--st-column-editor-background-color);\n}\n\n.st-column-editor-popout {\n  position: absolute;\n  top: 0;\n  right: calc(100% + 1px);\n  z-index: 1;\n  height: 100%;\n  background-color: var(--st-column-editor-popout-background-color);\n  transition: width var(--st-transition-duration) var(--st-transition-ease);\n  overflow: hidden;\n  width: 0;\n}\n.st-column-editor-popout-content {\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  gap: var(--st-spacing-small);\n  padding: var(--st-spacing-medium) var(--st-spacing-small);\n  border-left: var(--st-border-width) solid var(--st-border-color);\n  height: 100%;\n}\n\n.st-column-editor-popout.open {\n  width: 200px;\n}\n\n.st-column-editor-popout.left {\n  transform: translateX(-100%);\n}\n\n.st-column-editor-popout.open.left {\n  transform: translateX(0);\n}\n\n/* Checkbox styles */\n.st-checkbox-label {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  gap: var(--st-spacing-medium);\n}\n\n.st-checkbox-input {\n  display: none; /* Hide the default checkbox */\n}\n\n.st-checkbox-custom {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  border: var(--st-border-width) solid var(--slate-300);\n  border-radius: var(--st-border-radius);\n  background-color: white;\n  transition: background-color var(--st-transition-duration) var(--st-transition-ease),\n    border-color var(--st-transition-duration) var(--st-transition-ease);\n}\n\n.st-checkbox-custom.st-checked {\n  background-color: var(--st-checkbox-checked-background-color);\n  border-color: var(--st-checkbox-checked-border-color);\n}\n\n.st-checkbox-checkmark {\n  width: 6px;\n  height: 11px;\n  border: solid white;\n  border-width: 0 2px 2px 0;\n  transform: rotate(45deg);\n}\n\n@keyframes slide-in-left {\n  from {\n    transform: translateX(-100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n\n@keyframes slide-in-right {\n  from {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(0);\n  }\n}\n\n/* Group Header Styles */\n.st-group-header {\n  background-color: var(--st-header-background-color);\n  cursor: pointer;\n  user-select: none;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  border-bottom: var(--st-border-width) solid var(--st-border-color);\n  color: var(--st-cell-color);\n  font-weight: var(--st-font-weight-bold);\n  transition: background-color var(--st-transition-duration) var(--st-transition-ease);\n}\n\n.st-group-header:hover {\n  background-color: var(--st-button-hover-background-color);\n}\n\n.st-group-header-content {\n  display: flex;\n  align-items: center;\n  gap: var(--st-spacing-medium);\n}\n\n.st-group-toggle-icon {\n  font-size: 0.8em;\n  width: 16px;\n  height: 16px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.st-group-name {\n  font-weight: var(--st-font-weight-bold);\n}\n\n.st-group-count {\n  color: var(--st-cell-odd-row-color);\n  font-size: 0.9em;\n}\n\n/* Animation for expand/collapse */\n.st-group-header.expanded .st-group-toggle-icon {\n  transform: rotate(0deg);\n  transition: transform var(--st-transition-duration) var(--st-transition-ease);\n}\n\n.st-group-header.collapsed .st-group-toggle-icon {\n  transform: rotate(-90deg);\n  transition: transform var(--st-transition-duration) var(--st-transition-ease);\n}\n');var z,S=function(e){var n=e.accessor,r=e.rowIndex;return"cell-".concat(n,"-").concat(r)},N=function(e){var n=e.hiddenColumns,r=e.header,o=e.pinned;return n[r.accessor]?null:!o&&!r.pinned||r.pinned===o||null},H=function(r){var o=r.value,t=r.onBlur,a=r.onChange;return e("select",p({value:o.toString(),onBlur:t,onChange:function(e){var n=e.target.value;a("true"===n)}},{children:[n("option",p({value:"true"},{children:"True"})),n("option",p({value:"false"},{children:"False"}))]}))},L=function(e){var r=e.defaultValue,o=e.onBlur,a=e.onChange,l=t(null);return n("input",{className:"editable-cell-input",ref:l,autoFocus:!0,type:"text",defaultValue:null!=r?r:"",onBlur:o,onChange:function(e){var n=e.target.value;a(n)}})},M=function(e){var r=e.defaultValue,o=e.onBlur,a=e.onChange,l=t(null);return n("input",{className:"editable-cell-input",ref:l,autoFocus:!0,defaultValue:r.toString(),onBlur:o,onChange:function(e){var n=e.target.value;/^\d*\.?\d*$/.test(n)&&a(n)}})},T=function(e){var o=e.onChange,t=e.setIsEditing,a=e.value,l=function(e){null==o||o(e)},s=function(){t(!1)};return n(r,{children:"string"==typeof a||null==a?n(L,{defaultValue:a,onBlur:s,onChange:l}):"boolean"==typeof a?n(H,{onBlur:s,onChange:l,value:a}):"number"==typeof a?n(M,{defaultValue:a,onBlur:s,onChange:l}):null})},O=0,B=function(){return function(e){var n=e.callback,r=e.callbackProps,o=e.limit,t=Date.now();(0===O||t-O>=o)&&(O=t,n(r))}},A=Date.now(),P={screenX:0,screenY:0},W=function(e){var n,r,o=e.draggedHeaderRef,a=e.headersRef,s=e.hoveredHeaderRef,c=e.onTableHeaderDragEnd,d=(n=a.current,r=t(n),l((function(){r.current=n}),[n]),r.current);return{handleDragStart:function(e){o.current=e,A=Date.now()},handleDragOver:function(e){var n,r=e.event,t=e.hoveredHeader;if(r.preventDefault(),a.current){var l=r.currentTarget.getAnimations().some((function(e){return"running"===e.playState})),i=r.screenX,u=r.screenY,g=Math.sqrt(Math.pow(i-P.screenX,2)+Math.pow(u-P.screenY,2));s.current=t;var b=m([],a.current,!0),f=b.findIndex((function(e){var n;return e.accessor===(null===(n=o.current)||void 0===n?void 0:n.accessor)})),v=b.findIndex((function(e){return e.accessor===t.accessor})),p=b.splice(f,1)[0];if(b.splice(v,0,p),!(l||t.accessor===(null===(n=o.current)||void 0===n?void 0:n.accessor)||null===o.current||g<10||void 0===f||void 0===v||JSON.stringify(b)===JSON.stringify(a.current))){var h=Date.now();JSON.stringify(b)===JSON.stringify(d)&&h-A<800&&g<50||(A=h,P={screenX:i,screenY:u},c(b))}}},handleDragEnd:function(){o.current=null,s.current=null}}},U=d((function(r,t){var a,s=r.borderClass,c=r.cellHasChildren,d=r.colIndex,u=r.content,g=r.depth,b=r.draggedHeaderRef,f=r.header,v=r.headersRef,h=r.hoveredHeaderRef,m=r.isRowExpanded,w=r.isSelected,k=r.isTopLeftCell,R=r.onCellChange,D=r.onExpandRowClick,E=r.onMouseDown,I=r.onMouseOver,z=r.onTableHeaderDragEnd,N=r.row,H=r.rowIndex,L=i(y),M=L.rows,O=L.tableRows,A=o(u),P=A[0],U=A[1],j=o(!1),V=j[0],G=j[1],X=W({draggedHeaderRef:b,headersRef:v,hoveredHeaderRef:h,onTableHeaderDragEnd:z}).handleDragOver,F=B(),J=Boolean(null==f?void 0:f.isEditable),Y=H%2==0,q="st-cell ".concat(g>0&&f.expandable?"st-cell-depth-".concat(g):""," ").concat(w?k?"st-cell-selected-first-cell ".concat(s):"st-cell-selected ".concat(s):""," ").concat(Y?"st-cell-odd-row":"st-cell-even-row"," ").concat(J?"clickable":""," ").concat("right"===f.align?"right-aligned":"");l((function(){"object"!=typeof u&&U(u)}),[u]),l((function(){}),[f.accessor,P,M,null===(a=N.rowMeta)||void 0===a?void 0:a.rowId,O]);return V?n("div",p({className:"st-cell-editing ".concat(Y?"st-cell-odd-row":"st-cell-even-row"),id:S({accessor:f.accessor,rowIndex:H+1})},{children:n(T,{onChange:function(e){var n;U(e),null==R||R({accessor:f.accessor,newValue:e,newRowIndex:H,originalRowIndex:null===(n=N.rowMeta)||void 0===n?void 0:n.rowId,row:N})},setIsEditing:G,value:P})})):e("div",p({className:q,id:S({accessor:f.accessor,rowIndex:H+1}),onDoubleClick:function(){return f.isEditable&&G(!0)},onMouseDown:function(){return E(H,d)},onMouseOver:function(){return I(H,d)},onDragOver:function(e){return F({callback:X,callbackProps:{event:e,hoveredHeader:f},limit:50})},ref:t},{children:[f.expandable&&c?m(N.rowMeta.rowId)?n("div",p({className:"st-sort-icon-container",onClick:function(){return D(N.rowMeta.rowId)}},{children:n(C,{className:"st-sort-icon"})})):n("div",p({className:"st-sort-icon-container",onClick:function(){return D(N.rowMeta.rowId)}},{children:n(x,{className:"st-sort-icon"})})):null,n("span",{children:P})]}))})),j=d((function(e,r){return e.visible?n("div",{className:"st-cell",ref:r}):n("div",{ref:r})})),V=function(e){var r=e.lastGroupRow;return n("div",{className:"st-row-separator ".concat(r?"st-last-group-row":"")})},G=function(e){var o=e.allowAnimations,t=e.children,a=h(e,["allowAnimations","children"]);return o?n(X,p({},a,{children:t})):n(r,{children:t})},X=function(e){var a=e.allowHorizontalAnimate,s=void 0===a||a,c=e.children,d=e.draggedHeaderRef,i=e.isBody,g=e.pauseAnimation,b=e.rowIndex,f=e.tableRef,v=e.headersRef,p=t(!1),h=o({}),m=h[0],w=h[1],k=t({}),x=v.current;return u((function(){if(x){var e=function(e){var n=e.currentHeaders,r=e.draggedHeaderRef,o=e.rowIndex,t={};return n.forEach((function(e){var n;if(e){var a=document.getElementById(S({accessor:e.accessor,rowIndex:o}));if(a){var l=a.getAnimations().some((function(e){return"running"===e.playState})),s=a.getBoundingClientRect();l&&(null===(n=null==r?void 0:r.current)||void 0===n?void 0:n.accessor)!==e.accessor?t[e.accessor]=!1:t[e.accessor]=s}}})),t}({currentHeaders:x,draggedHeaderRef:d,rowIndex:b});JSON.stringify(e)!==JSON.stringify(m)&&(k.current=m,w(e))}}),[m,x,d,i,b]),u((function(){var e=f.current,n=function(){p.current=!0},r=function(){p.current=!1};return null==e||e.addEventListener("scroll",n),null==e||e.addEventListener("scrollend",r),function(){null==e||e.removeEventListener("scroll",n),null==e||e.removeEventListener("scrollend",r)}}),[d,f]),l((function(){g||p.current||Object.keys(k.current).length&&x&&x.forEach((function(e){var n=document.getElementById(S({accessor:e.accessor,rowIndex:b}));if(n){var r=k.current[e.accessor],o=m[e.accessor];if(r&&o){var t=r.left-o.left,a=s?0:r.top-o.top,l=Math.abs(t),c=Math.abs(a);(l>10||c>10)&&requestAnimationFrame((function(){n.style.transform="translate(".concat(t,"px, ").concat(a,"px)"),n.style.transition="transform 0s",requestAnimationFrame((function(){n.style.transform="",n.style.transition="transform ".concat(400,"ms ease-out")}))}))}}}))}),[s,m,x,i,g,k,b]),n(r,{children:c})},F=function(r){var o,t=r.getBorderClass,a=r.handleMouseDown,l=r.handleMouseOver,s=r.headers,c=r.hiddenColumns,d=r.isRowExpanded,i=r.isSelected,u=r.isTopLeftCell,f=r.lastGroupRow,v=r.onExpandRowClick,m=r.pinned,w=r.row,k=r.rowIndex,x=r.shouldDisplayLastColumnCell,y=h(r,["getBorderClass","handleMouseDown","handleMouseOver","headers","hiddenColumns","isRowExpanded","isSelected","isTopLeftCell","lastGroupRow","onExpandRowClick","pinned","row","rowIndex","shouldDisplayLastColumnCell"]),R=null===(o=w.rowMeta)||void 0===o?void 0:o.children;return e(G,p({allowAnimations:y.allowAnimations,allowHorizontalAnimate:y.shouldPaginate,draggedHeaderRef:y.draggedHeaderRef,headersRef:y.headersRef,isBody:!0,pauseAnimation:y.isWidthDragging,rowIndex:k+1,tableRef:y.tableRef},{children:[0!==k&&n(V,{lastGroupRow:f}),s.map((function(e,n){if(!N({hiddenColumns:c,header:e,pinned:m}))return null;var r=w.rowData[e.accessor];return e.cellRenderer&&(r=e.cellRenderer(w)),g(U,p({},y,{borderClass:t(k,n),cellHasChildren:((null==R?void 0:R.length)||0)>0,colIndex:n,content:r,header:e,isRowExpanded:d,isSelected:i(k,n),isTopLeftCell:u(k,n),key:n,onExpandRowClick:v,onMouseDown:function(){return a({rowIndex:k,colIndex:n})},onMouseOver:function(){return l(k,n)},row:w,rowIndex:k}))})),n(j,{ref:b(),visible:x})]}))},J=function(o){var t,a,l,s=o.depth,c=void 0===s?0:s,d=o.getNextRowIndex,i=o.index,u=o.lastGroupRow,b=o.pinned,f=o.props,v=o.row,h=((null===(a=null===(t=v.rowMeta)||void 0===t?void 0:t.children)||void 0===a?void 0:a.length)||0)>0,m=d(),w=(null===(l=v.rowMeta)||void 0===l?void 0:l.children)||[];return e(r,{children:[g(F,p({},f,{depth:c,lastGroupRow:u,key:i,pinned:b,row:v,rowIndex:m})),h&&f.isRowExpanded(v.rowMeta.rowId)&&w.map((function(e,r){return n(J,{depth:c+1,getNextRowIndex:d,index:r,pinned:b,props:f,row:e},r)}))]})},Y=function(e){var r=e.rows,o=e.templateColumns,a=e.pinned,s=e.sectionRef,c=e.isRowExpanded,d=e.onExpandRowClick,i=h(e,["rows","templateColumns","pinned","sectionRef","isRowExpanded","onExpandRowClick"]),u=a?"st-table-body-pinned-".concat(a):"st-table-body-main",g=t(0);l((function(){g.current=0}));var b=function(){return g.current++};return n("div",p({className:u,ref:s,style:{gridTemplateColumns:o}},{children:r.map((function(e,r){var o,t;return n(J,{getNextRowIndex:b,index:r,lastGroupRow:Boolean(null===(t=null===(o=e.rowMeta)||void 0===o?void 0:o.children)||void 0===t?void 0:t.length),pinned:a,props:p(p({},i),{isRowExpanded:c,onExpandRowClick:d}),row:e},r)}))}))},q=function(r){var o=r.currentRows,t=r.isRowExpanded,a=r.mainTemplateColumns,l=r.onExpandRowClick,s=r.pinnedLeftColumns,c=r.pinnedLeftRef,d=r.pinnedLeftTemplateColumns,i=r.pinnedRightColumns,u=r.pinnedRightRef,g=r.pinnedRightTemplateColumns,b=r.tableRef;return e("div",p({className:"st-table-body-container"},{children:[s.length>0&&n(Y,p({},r,{rows:o,templateColumns:d,pinned:"left",sectionRef:c,isRowExpanded:t,onExpandRowClick:l})),n(Y,p({},r,{rows:o,templateColumns:a,sectionRef:b,isRowExpanded:t,onExpandRowClick:l})),i.length>0&&n(Y,p({},r,{rows:o,templateColumns:g,pinned:"right",sectionRef:u,isRowExpanded:t,onExpandRowClick:l}))]}))},K=function(e){var n=e.event,r=e.forceUpdate,o=e.header,t=e.headersRef,a=e.index;e.reverse;var l=e.setIsWidthDragging;l(!0),n.preventDefault();var s=n.clientX;if(o){var c=o.width,d=function(e){var n=Math.max(c+(e.clientX-s),40);o&&t.current&&(t.current[a].width=n,r())},i=function(){document.removeEventListener("mousemove",d),document.removeEventListener("mouseup",i),l(!1)};document.addEventListener("mousemove",d),document.addEventListener("mouseup",i)}},$=d((function(r,t){var a,s=r.columnResizing,c=r.currentRows,d=r.draggable,i=r.draggedHeaderRef,u=r.forceUpdate,g=r.headersRef,b=r.hoveredHeaderRef,f=r.index,v=r.onSort,h=r.onTableHeaderDragEnd,m=r.reverse,w=r.selectableColumns,k=r.setIsWidthDragging,x=r.setSelectedCells,y=r.sort,R=r.sortDownIcon,C=r.sortUpIcon,D=o(!1),E=D[0],I=D[1],z=null===(a=g.current)||void 0===a?void 0:a[f],N=Boolean(null==z?void 0:z.isSortable),H="st-header-cell ".concat(z===b.current?"st-hovered":""," ").concat(E?"st-dragging":""," ").concat(N?"clickable":""," ").concat(d&&!N?"draggable":""," ").concat("right"===(null==z?void 0:z.align)?"right-aligned":""),L=W({draggedHeaderRef:i,headersRef:g,hoveredHeaderRef:b,onTableHeaderDragEnd:h}),M=L.handleDragStart,T=L.handleDragEnd,O=W({draggedHeaderRef:i,headersRef:g,hoveredHeaderRef:b,onTableHeaderDragEnd:h}).handleDragOver,A=B(),P=function(e){var n=e.event,r=e.header;if(w){var o=c.length,t=Array.from({length:o},(function(e,n){return"".concat(n,"-").concat(f)})),a=function(e,n){var r=new Set,t=Math.min(e,n),a=Math.max(e,n);return Array.from({length:o}).forEach((function(e,n){Array.from({length:a-t+1}).forEach((function(e,o){r.add("".concat(n,"-").concat(t+o))}))})),r};n.shiftKey?x((function(e){var n,r=Number(null===(n=Array.from(e)[0])||void 0===n?void 0:n.split("-")[1]),o=Number(t[0].split("-")[1]);return r===o?new Set(t):r>o?a(o,r):a(r,o)})):x(new Set(t))}else r.isSortable&&v(f,r.accessor)};if(l((function(){var e=function(e){e.preventDefault(),e.dataTransfer.dropEffect="move"};return document.addEventListener("dragover",e),function(){document.removeEventListener("dragover",e)}}),[]),!z)return null;var U=s&&n("div",{className:"st-header-resize-handle",onMouseDown:function(e){A({callback:K,callbackProps:{event:e,forceUpdate:u,header:z,headersRef:g,index:f,setIsWidthDragging:k},limit:10})}});return e("div",p({className:H,id:S({accessor:z.accessor,rowIndex:0}),onDragOver:function(e){A({callback:O,callbackProps:{event:e,hoveredHeader:z},limit:50})},ref:t,style:{width:z.width}},{children:[m&&U,n("div",p({className:"st-header-label",draggable:d,onClick:function(e){return P({event:e,header:z})},onDragEnd:function(e){e.preventDefault(),I(!1),T()},onDragStart:function(e){d&&z&&function(e){I(!0),M(e)}(z)},onMouseEnter:function(){return document.body.style.overflow="hidden"},onMouseLeave:function(){return document.body.style.overflow="auto"}},{children:null==z?void 0:z.label})),y&&y.key.accessor===z.accessor&&e("div",p({className:"st-sort-icon-container",onClick:function(e){return P({event:e,header:z})}},{children:["ascending"===y.direction&&C&&C,"descending"===y.direction&&R&&R]})),!m&&U]}))})),Q=function(r){var o,a,s,c=r.allowAnimations,d=r.columnResizing,i=r.currentRows,u=r.draggable,g=r.draggedHeaderRef,f=r.forceUpdate,v=r.headersRef,h=r.hiddenColumns,m=r.hoveredHeaderRef,w=r.isWidthDragging,k=r.mainTemplateColumns,x=r.onSort,y=r.onTableHeaderDragEnd,R=r.pinnedLeftColumns,C=r.pinnedLeftTemplateColumns,D=r.pinnedRightColumns,E=r.pinnedRightTemplateColumns,I=r.selectableColumns,z=r.setIsWidthDragging,S=r.setSelectedCells,H=r.shouldDisplayLastColumnCell,L=r.sort,M=r.sortDownIcon,T=r.sortUpIcon,O=r.tableRef,B=t(null);l((function(){if(O.current){var e=O.current,n=function(){var n,r=null==e?void 0:e.scrollLeft;void 0!==r&&(null===(n=B.current)||void 0===n||n.scrollTo(r,0))};return e.addEventListener("scroll",n),function(){null==e||e.removeEventListener("scroll",n)}}}),[O]);return e("div",p({className:"st-table-header-container"},{children:[R.length>0&&n("div",p({className:"st-header-pinned-left",style:{gridTemplateColumns:C}},{children:n(G,p({allowAnimations:c,draggedHeaderRef:g,headersRef:v,pauseAnimation:w,rowIndex:0,tableRef:O},{children:null===(o=v.current)||void 0===o?void 0:o.map((function(e,r){return N({hiddenColumns:h,header:e,pinned:"left"})?n($,{columnResizing:d,currentRows:i,draggable:u,draggedHeaderRef:g,forceUpdate:f,headersRef:v,hoveredHeaderRef:m,index:r,onSort:x,onTableHeaderDragEnd:y,ref:b(),selectableColumns:I,setIsWidthDragging:z,setSelectedCells:S,sort:L,sortDownIcon:M,sortUpIcon:T},e.accessor):null}))}))})),n("div",p({className:"st-header-main",onScroll:function(e){var n,r,o=null===(n=B.current)||void 0===n?void 0:n.scrollLeft;void 0!==o&&(null===(r=O.current)||void 0===r||r.scrollTo(o,0))},ref:B,style:{gridTemplateColumns:k}},{children:e(G,p({allowAnimations:c,draggedHeaderRef:g,headersRef:v,pauseAnimation:w,rowIndex:0,tableRef:O},{children:[null===(a=v.current)||void 0===a?void 0:a.map((function(e,r){return N({hiddenColumns:h,header:e})?n($,{columnResizing:d,currentRows:i,draggable:u,draggedHeaderRef:g,forceUpdate:f,headersRef:v,hoveredHeaderRef:m,index:r,onSort:x,onTableHeaderDragEnd:y,ref:b(),selectableColumns:I,setIsWidthDragging:z,setSelectedCells:S,sort:L,sortDownIcon:M,sortUpIcon:T},e.accessor):null})),n(j,{ref:b(),visible:H})]}))})),D.length>0&&n("div",p({className:"st-header-pinned-right",style:{gridTemplateColumns:E}},{children:e(G,p({allowAnimations:c,draggedHeaderRef:g,headersRef:v,pauseAnimation:w,rowIndex:0,tableRef:O},{children:[null===(s=v.current)||void 0===s?void 0:s.map((function(e,r){return N({hiddenColumns:h,header:e,pinned:"right"})?n($,{columnResizing:d,currentRows:i,draggable:u,draggedHeaderRef:g,forceUpdate:f,headersRef:v,hoveredHeaderRef:m,index:r,onSort:x,onTableHeaderDragEnd:y,reverse:!0,ref:b(),selectableColumns:I,setIsWidthDragging:z,setSelectedCells:S,sort:L,sortDownIcon:M,sortUpIcon:T},e.accessor):null})),n(j,{ref:b(),visible:H})]}))}))]}))},Z=function(r){var o=r.allowAnimations,t=r.columnResizing,a=r.currentRows,l=r.draggable,c=r.draggedHeaderRef,d=r.editColumns,i=r.forceUpdate,u=r.getBorderClass,g=r.handleMouseDown,b=r.handleMouseOver,f=r.headersRef,v=r.hiddenColumns,h=r.hoveredHeaderRef,m=r.isRowExpanded,w=r.isSelected,k=r.isTopLeftCell,x=r.isWidthDragging,y=r.onCellChange,R=r.onExpandRowClick,C=r.onSort,D=r.onTableHeaderDragEnd,E=r.pinnedLeftRef,I=r.pinnedRightRef,z=r.selectableColumns,S=r.setIsWidthDragging,N=r.setSelectedCells,H=r.shouldPaginate,L=r.sort,M=r.sortDownIcon,T=r.sortUpIcon,O=r.tableRef,B=f.current.filter((function(e){return!e.hide&&!e.pinned})),A=s((function(){return!!O.current&&B.reduce((function(e,n){return e+n.width}),0)<O.current.clientWidth}),[B,O]),P=f.current.filter((function(e){return"left"===e.pinned&&!0!==e.hide})),W=f.current.filter((function(e){return"right"===e.pinned&&!0!==e.hide})),U=s((function(){return"".concat(P.map((function(e){return"".concat(e.width,"px")})).join(" "))}),[P]),j=s((function(){return"".concat(B.filter((function(e){return!0!==v[e.accessor]})).map((function(e){return"".concat(e.width,"px")})).join(" ")," 1fr")}),[B,v]),V=s((function(){return"".concat(W.map((function(e){return"".concat(e.width,"px")})).join(" "))}),[W]),G={allowAnimations:o,columnResizing:t,currentRows:a,draggable:l,draggedHeaderRef:c,forceUpdate:i,headersRef:f,hiddenColumns:v,hoveredHeaderRef:h,isWidthDragging:x,mainTemplateColumns:j,onSort:C,onTableHeaderDragEnd:D,pinnedLeftColumns:P,pinnedLeftTemplateColumns:U,pinnedRightColumns:W,pinnedRightTemplateColumns:V,selectableColumns:z,setIsWidthDragging:S,setSelectedCells:N,shouldDisplayLastColumnCell:A,sort:L,sortDownIcon:M,sortUpIcon:T,tableRef:O},X={allowAnimations:o,currentRows:a,draggedHeaderRef:c,getBorderClass:u,handleMouseDown:g,handleMouseOver:b,headers:f.current,headersRef:f,hiddenColumns:v,hoveredHeaderRef:h,isRowExpanded:m,isSelected:w,isTopLeftCell:k,isWidthDragging:x,mainTemplateColumns:j,onCellChange:y,onExpandRowClick:R,onTableHeaderDragEnd:D,pinnedLeftColumns:P,pinnedLeftRef:E,pinnedLeftTemplateColumns:U,pinnedRightColumns:W,pinnedRightRef:I,pinnedRightTemplateColumns:V,shouldDisplayLastColumnCell:A,shouldPaginate:H,tableRef:O};return e("div",p({className:"st-table-content",style:{width:d?"calc(100% - 27.5px)":"100%"}},{children:[n(Q,p({},G)),n(q,p({},X))]}))},_=function(r){r.headersRef;var a=r.pinnedLeftRef,s=r.pinnedRightRef,c=r.tableRef,d=o(0),i=d[0],u=d[1],g=o(0),b=g[0],f=g[1],v=o(0),h=v[0],m=v[1],w=t(null);return l((function(){if(a.current){var e=function(){var e;u((null===(e=a.current)||void 0===e?void 0:e.scrollWidth)||0)};e();var n=new ResizeObserver((function(){e()}));return n.observe(a.current),function(){return n.disconnect()}}}),[a]),l((function(){if(c.current){var e=function(){var e;m((null===(e=c.current)||void 0===e?void 0:e.scrollWidth)||0)};e();var n=new ResizeObserver((function(){e()}));return n.observe(c.current),function(){return n.disconnect()}}}),[c]),l((function(){if(s.current){var e=function(){var e;f((null===(e=s.current)||void 0===e?void 0:e.scrollWidth)||0)};e();var n=new ResizeObserver((function(){e()}));return n.observe(s.current),function(){return n.disconnect()}}}),[s]),l((function(){if(c.current){var e=c.current,n=function(){var n,r=null==e?void 0:e.scrollLeft;void 0!==r&&(null===(n=w.current)||void 0===n||n.scrollTo(r,0))};return e.addEventListener("scroll",n),function(){null==e||e.removeEventListener("scroll",n)}}}),[c]),e("div",p({className:"st-horizontal-scrollbar-container"},{children:[i>0&&n("div",{className:"st-horizontal-scrollbar-left",style:{flexShrink:0,width:i}}),h>0&&n("div",p({className:"st-horizontal-scrollbar-middle",onScroll:function(){var e,n,r=null===(e=w.current)||void 0===e?void 0:e.scrollLeft;void 0!==r&&(null===(n=c.current)||void 0===n||n.scrollTo(r,0))},ref:w,style:{width:h}},{children:n("div",{style:{width:h}})})),b>0&&n("div",{className:"st-horizontal-scrollbar-right",style:{flexShrink:0,width:b}})]}))},ee=function(e,n){var r=o(null),t=r[0],a=r[1],l=o({}),c=l[0],d=l[1],i=s((function(){if(!t)return e;var r=function(e,n,r){var o=r?r.key:e[0],t="ascending";return r&&r.key.accessor===o.accessor&&"ascending"===r.direction&&(t="descending"),{sortedData:m([],n,!0).sort((function(e,n){var r,a,l,s,c=null!==(a=null===(r=null==e?void 0:e.rowData)||void 0===r?void 0:r[o.accessor])&&void 0!==a?a:"",d=null!==(s=null===(l=null==n?void 0:n.rowData)||void 0===l?void 0:l[o.accessor])&&void 0!==s?s:"";return c<d?"ascending"===t?1:-1:c>d?"ascending"===t?-1:1:0})),newSortConfig:{key:o,direction:t}}}(n,e,t).sortedData;return r}),[e,t,n]);return{sort:t,setSort:a,sortedRows:i,hiddenColumns:c,setHiddenColumns:d}};!function(e){e.Left="left",e.Right="right"}(z||(z={}));var ne=function(r){var c=r.allowAnimations,d=void 0!==c&&c,i=r.columnEditorPosition,u=void 0===i?z.Right:i,g=r.columnEditorText,b=void 0===g?"Columns":g,f=r.columnResizing,h=void 0!==f&&f,m=r.defaultHeaders,D=r.draggable,E=void 0!==D&&D,S=r.editColumns,N=void 0!==S&&S,H=r.editColumnsInitOpen,L=void 0!==H&&H,M=r.height,T=r.hideFooter,O=void 0!==T&&T,B=r.nextIcon,A=void 0===B?n(x,{className:"st-next-prev-icon"}):B,P=r.onCellChange,W=r.prevIcon,U=void 0===W?n(k,{className:"st-next-prev-icon"}):W,j=r.rows,V=r.rowsPerPage,G=void 0===V?10:V,X=r.selectableCells,F=void 0!==X&&X,J=r.selectableColumns,Y=void 0!==J&&J,q=r.shouldPaginate,K=void 0!==q&&q,$=r.sortDownIcon,Q=void 0===$?n(C,{className:"st-sort-icon"}):$,ne=r.sortUpIcon,re=void 0===ne?n(R,{className:"st-sort-icon"}):ne,oe=r.theme,te=void 0===oe?"light":oe,ae=o((function(){return function(e){var n=new Set,r=function(e){var o;e.rowMeta.isExpanded&&n.add(e.rowMeta.rowId.toString()),null===(o=e.rowMeta.children)||void 0===o||o.forEach(r)};return e.forEach(r),n}(j)})),le=ae[0],se=ae[1],ce=s((function(){return j.map((function(e,n){return p(p({},e),{originalRowIndex:n})}))}),[j]),de=t(null),ie=t(null),ue=t(null),ge=t(null),be=t(null),fe=t(m),ve=o(!1),pe=ve[0],he=ve[1],me=o(1),we=me[0],ke=me[1],xe=ee(ce,fe.current),ye=xe.sort,Re=xe.setSort,Ce=xe.sortedRows,De=xe.hiddenColumns,Ee=xe.setHiddenColumns,Ie=a((function(e){var n=String(e);se((function(e){var r=new Set(e);return r.has(n)?r.delete(n):r.add(n),r}))}),[]),ze=a((function(e){return le.has(String(e))}),[le]),Se=v((function(e){return e+1}),0)[1],Ne=function(e){var n=e.selectableCells,r=e.headers,c=e.rows,d=o(new Set),i=d[0],u=d[1],g=t(!1),b=t(null),f=a((function(){var e=Array.from(i).reduce((function(e,n){var o=n.split("-").map(Number),t=o[0],a=o[1];return e[t]||(e[t]=[]),e[t][a]=c[t][r[a].accessor],e}),{}),n=Object.values(e).map((function(e){return Object.values(e).join("\t")})).join("\n");navigator.clipboard.writeText(n)}),[i,c,r]);l((function(){var e=function(e){(e.ctrlKey||e.metaKey)&&"c"===e.key&&f()};return document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}),[f]);var v=a((function(e,n){return i.has("".concat(e,"-").concat(n))}),[i]),p=a((function(e,n){var r=[];return v(e-1,n)||r.push("st-selected-top-border"),v(e+1,n)||r.push("st-selected-bottom-border"),v(e,n-1)||r.push("st-selected-left-border"),v(e,n+1)||r.push("st-selected-right-border"),r.join(" ")}),[v]),h=s((function(){var e=Math.min.apply(Math,Array.from(i).map((function(e){return parseInt(e.split("-")[0])}))),n=Math.min.apply(Math,Array.from(i).map((function(e){return parseInt(e.split("-")[1])})));return function(r,o){return r===e&&o===n}}),[i]);return{selectedCells:i,handleMouseDown:function(e){var r=e.colIndex,o=e.rowIndex;n&&(g.current=!0,b.current={row:o,col:r},u(new Set(["".concat(o,"-").concat(r)])))},handleMouseOver:function(e,r){if(n&&g.current&&b.current){for(var o=new Set,t=Math.min(b.current.row,e),a=Math.max(b.current.row,e),l=Math.min(b.current.col,r),s=Math.max(b.current.col,r),c=t;c<=a;c++)for(var d=l;d<=s;d++)o.add("".concat(c,"-").concat(d));u(o)}},handleMouseUp:function(){g.current=!1,b.current=null},isSelected:v,getBorderClass:p,isTopLeftCell:h,setSelectedCells:u}}({selectableCells:F,headers:fe.current,rows:Ce}),He=Ne.handleMouseDown,Le=Ne.handleMouseOver,Me=Ne.handleMouseUp,Te=Ne.isSelected,Oe=Ne.getBorderClass,Be=Ne.isTopLeftCell,Ae=Ne.setSelectedCells,Pe=s((function(){return K?Ce.slice((we-1)*G,we*G):Ce}),[we,G,K,Ce]),We=a((function(e,n){Re((function(r){return(null==r?void 0:r.key.accessor)!==n?{key:fe.current[e],direction:"ascending"}:"ascending"===(null==r?void 0:r.direction)?{key:fe.current[e],direction:"descending"}:null}))}),[Re]),Ue=a((function(e){fe.current=e,Se()}),[]);return l((function(){var e=function(e){var n=e.target;n.closest(".st-cell")||Y&&(n.classList.contains("st-header-cell")||n.classList.contains("st-header-label"))||Ae(new Set)};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[Y,Ae]),n(y.Provider,p({value:{rows:j,tableRows:ce}},{children:e("div",p({className:"st-wrapper theme-".concat(te),style:M?{height:M}:{}},{children:[e("div",p({className:"st-table-wrapper-container"},{children:[e("div",p({className:"st-table-wrapper",onMouseUp:Me,onMouseLeave:Me},{children:[n(Z,{allowAnimations:d,columnResizing:h,currentRows:Pe,draggable:E,draggedHeaderRef:ie,editColumns:N,forceUpdate:Se,getBorderClass:Oe,handleMouseDown:He,handleMouseOver:Le,headers:fe.current,headersRef:fe,hiddenColumns:De,hoveredHeaderRef:ue,isRowExpanded:ze,isSelected:Te,isTopLeftCell:Be,isWidthDragging:pe,onCellChange:P,onExpandRowClick:Ie,onSort:We,onTableHeaderDragEnd:Ue,pinnedLeftRef:ge,pinnedRightRef:be,selectableColumns:Y,setIsWidthDragging:he,setSelectedCells:Ae,shouldPaginate:K,sort:ye,sortDownIcon:Q,sortUpIcon:re,tableRef:de}),n(I,{columnEditorText:b,editColumns:N,editColumnsInitOpen:L,headers:fe.current,hiddenColumns:De,position:u,setHiddenColumns:Ee})]})),n(_,{headersRef:fe,pinnedLeftRef:ge,pinnedRightRef:be,tableRef:de})]})),n(w,{currentPage:we,hideFooter:O,nextIcon:A,onPageChange:ke,prevIcon:U,rowsPerPage:G,shouldPaginate:K,totalRows:Ce.length})]}))}))};ne.defaultProps={allowAnimations:!1,columnEditorPosition:z.Right,columnEditorText:"Columns",columnResizing:!1,defaultHeaders:[],draggable:!1,editColumns:!1,editColumnsInitOpen:!1,height:"",hideFooter:!1,nextIcon:n(x,{className:"st-next-prev-icon"}),onCellChange:function(){},prevIcon:n(k,{className:"st-next-prev-icon"}),rows:[],rowsPerPage:10,selectableCells:!1,selectableColumns:!1,shouldPaginate:!1,sortDownIcon:n(C,{className:"st-sort-icon"}),sortUpIcon:n(R,{className:"st-sort-icon"}),theme:"light"};var re=f(ne);export{re as SimpleTable};

package/dist/types/BoundingBox.d.ts

@@ -0,0 +1,11 @@
+type BoundingBox = {
+    bottom: number;
+    height: number;
+    left: number;
+    right: number;
+    top: number;
+    width: number;
+    x: number;
+    y: number;
+};
+export default BoundingBox;

package/dist/types/CellChangeProps.d.ts

@@ -1,11 +1,10 @@
 import CellValue from "./CellValue";
+import Row from "./Row";
 type CellChangeProps = {
     accessor: any;
     newRowIndex: number;
     newValue: CellValue;
     originalRowIndex: number;
-    row: {
-        [key: string]: CellValue;
-    };
+    row: Row;
 };
 export default CellChangeProps;

package/dist/types/DragHandlerProps.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import HeaderObject from "./HeaderObject";
+type useDragHandlerProps = {
+    draggedHeaderRef: React.MutableRefObject<HeaderObject | null>;
+    headersRef: React.RefObject<HeaderObject[]>;
+    hoveredHeaderRef: React.MutableRefObject<HeaderObject | null>;
+    onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
+};
+export default useDragHandlerProps;

package/dist/types/GroupedRow.d.ts

@@ -0,0 +1,8 @@
+import CellValue from "./CellValue";
+interface GroupedRow {
+    children?: GroupedRow[];
+    isExpanded?: boolean;
+    isGroup?: boolean;
+    [key: string]: CellValue | GroupedRow[];
+}
+export default GroupedRow;

package/dist/types/HeaderObject.d.ts

@@ -1,13 +1,16 @@
 import { ReactNode } from "react";
 type HeaderObject = {
     accessor: string;
+    align?: "left" | "center" | "right";
     cellRenderer?: (row: {
         [key: string]: any;
     }) => ReactNode;
+    expandable?: boolean;
     hide?: boolean;
     isEditable?: boolean;
     isSortable?: boolean;
     label: string;
+    pinned?: "left" | "right";
     type?: "string" | "number" | "boolean" | "date" | "enum";
     width: number;
 };

package/dist/types/Row.d.ts

@@ -1,4 +1,12 @@
+import CellValue from "./CellValue";
 type Row = {
-    [key: string]: any;
+    rowMeta: {
+        children?: Row[];
+        isExpanded?: boolean;
+        rowId: number;
+    };
+    rowData: {
+        [key: string]: CellValue;
+    };
 };
 export default Row;

package/dist/types/SharedTableProps.d.ts

@@ -0,0 +1,19 @@
+import { RefObject } from "react";
+import HeaderObject from "./HeaderObject";
+interface SharedTableProps {
+    allowAnimations: boolean;
+    draggedHeaderRef: RefObject<HeaderObject | null>;
+    headersRef: RefObject<HeaderObject[]>;
+    hiddenColumns: Record<string, boolean>;
+    hoveredHeaderRef: RefObject<HeaderObject | null>;
+    isWidthDragging: boolean;
+    mainTemplateColumns: string;
+    onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
+    pinnedLeftColumns: HeaderObject[];
+    pinnedLeftTemplateColumns: string;
+    pinnedRightColumns: HeaderObject[];
+    pinnedRightTemplateColumns: string;
+    shouldDisplayLastColumnCell: boolean;
+    tableRef: RefObject<HTMLDivElement | null>;
+}
+export default SharedTableProps;

package/dist/types/TableBodyProps.d.ts

@@ -0,0 +1,22 @@
+import { RefObject } from "react";
+import { MouseDownProps } from "../hooks/useSelection";
+import CellChangeProps from "./CellChangeProps";
+import HeaderObject from "./HeaderObject";
+import SharedTableProps from "./SharedTableProps";
+import Row from "./Row";
+interface TableBodyProps extends SharedTableProps {
+    currentRows: Row[];
+    getBorderClass: (rowIndex: number, columnIndex: number) => string;
+    handleMouseDown: (props: MouseDownProps) => void;
+    handleMouseOver: (rowIndex: number, columnIndex: number) => void;
+    headers: HeaderObject[];
+    isRowExpanded: (rowId: string | number) => boolean;
+    isSelected: (rowIndex: number, columnIndex: number) => boolean;
+    isTopLeftCell: (rowIndex: number, columnIndex: number) => boolean;
+    onCellChange?: (props: CellChangeProps) => void;
+    onExpandRowClick: (rowIndex: number) => void;
+    pinnedLeftRef: RefObject<HTMLDivElement | null>;
+    pinnedRightRef: RefObject<HTMLDivElement | null>;
+    shouldPaginate: boolean;
+}
+export default TableBodyProps;

package/dist/types/TableCellProps.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode, RefObject } from "react";
+import HeaderObject from "./HeaderObject";
+import CellChangeProps from "./CellChangeProps";
+import CellValue from "./CellValue";
+import Row from "./Row";
+export interface TableCellProps {
+    borderClass: string;
+    cellHasChildren: boolean;
+    colIndex: number;
+    content: CellValue | ReactNode;
+    depth: number;
+    draggedHeaderRef: RefObject<HeaderObject | null>;
+    header: HeaderObject;
+    headersRef: RefObject<HeaderObject[]>;
+    hoveredHeaderRef: RefObject<HeaderObject | null>;
+    isRowExpanded: (rowId: string | number) => boolean;
+    isSelected: boolean;
+    isTopLeftCell: boolean;
+    onCellChange?: (props: CellChangeProps) => void;
+    onExpandRowClick: (rowIndex: number) => void;
+    onMouseDown: (rowIndex: number, colIndex: number) => void;
+    onMouseOver: (rowIndex: number, colIndex: number) => void;
+    onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
+    row: Row;
+    rowIndex: number;
+    shouldDisplayLastColumnCell?: boolean;
+}
+export default TableCellProps;

package/dist/types/TableHeaderProps.d.ts

@@ -0,0 +1,21 @@
+import { SetStateAction } from "react";
+import { Dispatch } from "react";
+import { ReactNode } from "react";
+import SortConfig from "./SortConfig";
+import Row from "./Row";
+import SharedTableProps from "./SharedTableProps";
+import OnSortProps from "./OnSortProps";
+interface TableHeaderProps extends SharedTableProps {
+    columnResizing: boolean;
+    currentRows: Row[];
+    draggable: boolean;
+    forceUpdate: () => void;
+    onSort: OnSortProps;
+    selectableColumns: boolean;
+    setIsWidthDragging: Dispatch<SetStateAction<boolean>>;
+    setSelectedCells: Dispatch<React.SetStateAction<Set<string>>>;
+    sort: SortConfig | null;
+    sortDownIcon?: ReactNode;
+    sortUpIcon?: ReactNode;
+}
+export default TableHeaderProps;

package/dist/types/TableRowProps.d.ts

@@ -0,0 +1,31 @@
+import { RefObject } from "react";
+import CellChangeProps from "./CellChangeProps";
+import HeaderObject from "./HeaderObject";
+import { MouseDownProps } from "../hooks/useSelection";
+import Row from "./Row";
+type TableRowProps = {
+    allowAnimations: boolean;
+    currentRows: {
+        [key: string]: any;
+    }[];
+    draggedHeaderRef: RefObject<HeaderObject | null>;
+    getBorderClass: (rowIndex: number, columnIndex: number) => string;
+    handleMouseDown: (props: MouseDownProps) => void;
+    handleMouseOver: (rowIndex: number, columnIndex: number) => void;
+    headers: HeaderObject[];
+    headersRef: RefObject<HeaderObject[]>;
+    hiddenColumns: Record<string, boolean>;
+    hoveredHeaderRef: RefObject<HeaderObject | null>;
+    isSelected: (rowIndex: number, columnIndex: number) => boolean;
+    isTopLeftCell: (rowIndex: number, columnIndex: number) => boolean;
+    isWidthDragging: boolean;
+    onCellChange?: (props: CellChangeProps) => void;
+    onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
+    onToggleGroup: (rowId: number) => void;
+    row: Row;
+    rowIndex: number;
+    shouldDisplayLastColumnCell: boolean;
+    shouldPaginate: boolean;
+    tableRef: RefObject<HTMLDivElement | null>;
+};
+export default TableRowProps;

package/dist/utils/cellUtils.d.ts

@@ -0,0 +1,10 @@
+import HeaderObject from "../types/HeaderObject";
+export declare const getCellId: ({ accessor, rowIndex, }: {
+    accessor: string;
+    rowIndex: number;
+}) => string;
+export declare const displayCell: ({ hiddenColumns, header, pinned, }: {
+    hiddenColumns: Record<string, boolean>;
+    header: HeaderObject;
+    pinned?: "left" | "right" | undefined;
+}) => true | null;

package/dist/utils/formatters.d.ts

@@ -0,0 +1,3 @@
+export declare const formatDate: (dateString: string) => string;
+export declare const formatCurrency: (value: number) => string;
+export declare const formatLargeNumber: (value: number) => string;

package/dist/utils/performanceUtils.d.ts

@@ -1 +1,7 @@
-export declare const throttle: (func: (...args: any[]) => void, limit: number) => (this: any, ...args: any[]) => void;
+import HeaderObject from "../types/HeaderObject";
+export declare const useThrottle: () => ({ callback, callbackProps, limit, }: {
+    callback: (callbackProps: any) => void;
+    callbackProps: any;
+    limit: number;
+}) => void;
+export declare const logArrayDifferences: (original: HeaderObject[], updated: HeaderObject[]) => void;

package/dist/utils/sortUtils.d.ts

@@ -1,13 +1,20 @@
+import { Dispatch, SetStateAction } from "react";
 import HeaderObject from "../types/HeaderObject";
 import SortConfig from "../types/SortConfig";
-export declare const handleSort: (headers: HeaderObject[], rows: {
-    [key: string]: any;
-}[], sortConfig: SortConfig) => {
-    sortedData: {
-        [key: string]: any;
-    }[];
+import Row from "../types/Row";
+export declare const handleSort: (headers: HeaderObject[], rows: Row[], sortConfig: SortConfig) => {
+    sortedData: Row[];
     newSortConfig: {
         key: HeaderObject;
         direction: string;
     };
 };
+export declare const handleResizeStart: ({ event, forceUpdate, header, headersRef, index, reverse, setIsWidthDragging, }: {
+    event: MouseEvent;
+    forceUpdate: () => void;
+    header: HeaderObject;
+    headersRef: React.RefObject<HeaderObject[]>;
+    index: number;
+    reverse?: boolean | undefined;
+    setIsWidthDragging: Dispatch<SetStateAction<boolean>>;
+}) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "simple-table-core",
-  "version": "0.6.2",
+  "version": "0.6.3",
   "main": "dist/index.js",
   "module": "dist/index.es.js",
   "types": "dist/index.d.ts",

package/dist/consts/SampleData.d.ts

@@ -1,3 +0,0 @@
-import HeaderObject from "../types/HeaderObject";
-export declare const SAMPLE_HEADERS: HeaderObject[];
-export declare const inventoryData: any[];

package/dist/hooks/useTableHeaderCell.d.ts

@@ -1,14 +0,0 @@
-/// <reference types="react" />
-import HeaderObject from "../types/HeaderObject";
-interface UseTableHeaderCellProps {
-    draggedHeaderRef: React.MutableRefObject<HeaderObject | null>;
-    headersRef: React.RefObject<HeaderObject[]>;
-    hoveredHeaderRef: React.MutableRefObject<HeaderObject | null>;
-    onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
-}
-declare const useTableHeaderCell: ({ draggedHeaderRef, headersRef, hoveredHeaderRef, onTableHeaderDragEnd, }: UseTableHeaderCellProps) => {
-    handleDragStart: (header: HeaderObject) => void;
-    handleDragOver: (hoveredHeader: HeaderObject) => void;
-    handleDragEnd: () => void;
-};
-export default useTableHeaderCell;