simple-table-core 0.6.6 → 0.6.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Animate.d.ts +1 -1
- package/dist/components/SimpleTable/TableContent.d.ts +1 -1
- package/dist/components/SimpleTable/TableHeader.d.ts +1 -1
- package/dist/components/SimpleTable/TableHorizontalScrollbar.d.ts +4 -2
- package/dist/hooks/useScrollbarVisibility.d.ts +3 -1
- package/dist/hooks/useWidthSync.d.ts +5 -1
- package/dist/index.es.js +2 -0
- package/dist/index.es.js.map +1 -0
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -0
- package/dist/types/HeaderObject.d.ts +2 -3
- package/dist/types/SharedTableProps.d.ts +2 -1
- package/dist/types/TableBodyProps.d.ts +2 -0
- package/package.json +13 -3
|
@@ -7,9 +7,9 @@ interface AnimateProps {
|
|
|
7
7
|
draggedHeaderRef?: RefObject<HeaderObject | null>;
|
|
8
8
|
headersRef: RefObject<HeaderObject[]>;
|
|
9
9
|
isBody?: boolean;
|
|
10
|
+
mainBodyRef: RefObject<HTMLDivElement | null>;
|
|
10
11
|
pauseAnimation?: boolean;
|
|
11
12
|
rowIndex: number;
|
|
12
|
-
tableRef: RefObject<HTMLDivElement | null>;
|
|
13
13
|
}
|
|
14
14
|
declare const AnimateWrapper: ({ allowAnimations, children, ...props }: AnimateProps & {
|
|
15
15
|
allowAnimations: boolean;
|
|
@@ -9,5 +9,5 @@ interface TableContentProps extends Omit<TableHeaderProps, OmittedTableProps>, O
|
|
|
9
9
|
isRowExpanded: (rowId: string | number) => boolean;
|
|
10
10
|
onExpandRowClick: (rowIndex: number) => void;
|
|
11
11
|
}
|
|
12
|
-
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,
|
|
12
|
+
declare const TableContent: ({ allowAnimations, columnResizing, currentRows, draggable, draggedHeaderRef, editColumns, forceUpdate, getBorderClass, handleMouseDown, handleMouseOver, headersRef, hiddenColumns, hoveredHeaderRef, isRowExpanded, isSelected, isTopLeftCell, isWidthDragging, mainBodyRef, onCellChange, onExpandRowClick, onSort, onTableHeaderDragEnd, pinnedLeftRef, pinnedRightRef, scrollbarHorizontalRef, scrollbarWidth, selectableColumns, setIsWidthDragging, setSelectedCells, shouldPaginate, sort, sortDownIcon, sortUpIcon, tableBodyContainerRef, }: TableContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
13
|
export default TableContent;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import TableHeaderProps from "../../types/TableHeaderProps";
|
|
2
|
-
declare const TableHeader: ({ allowAnimations, columnResizing, currentRows, draggable, draggedHeaderRef, forceUpdate, headerContainerRef, headersRef, hiddenColumns, hoveredHeaderRef, isWidthDragging, mainTemplateColumns, onSort, onTableHeaderDragEnd, pinnedLeftColumns, pinnedLeftTemplateColumns, pinnedRightColumns, pinnedRightTemplateColumns, selectableColumns, setIsWidthDragging, setSelectedCells, shouldDisplayLastColumnCell, sort, sortDownIcon, sortUpIcon,
|
|
2
|
+
declare const TableHeader: ({ allowAnimations, columnResizing, currentRows, draggable, draggedHeaderRef, forceUpdate, headerContainerRef, headersRef, hiddenColumns, hoveredHeaderRef, isWidthDragging, mainTemplateColumns, onSort, onTableHeaderDragEnd, pinnedLeftColumns, pinnedLeftTemplateColumns, pinnedRightColumns, pinnedRightTemplateColumns, selectableColumns, setIsWidthDragging, setSelectedCells, shouldDisplayLastColumnCell, sort, sortDownIcon, sortUpIcon, mainBodyRef, }: TableHeaderProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default TableHeader;
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import { RefObject } from "react";
|
|
2
2
|
import HeaderObject from "../../types/HeaderObject";
|
|
3
|
-
declare const TableHorizontalScrollbar: ({ headersRef, pinnedLeftRef, pinnedRightRef,
|
|
3
|
+
declare const TableHorizontalScrollbar: ({ headersRef, mainBodyRef, pinnedLeftRef, pinnedRightRef, scrollbarHorizontalRef, tableContentWidth, }: {
|
|
4
4
|
headersRef: RefObject<HeaderObject[]>;
|
|
5
|
+
mainBodyRef: RefObject<HTMLDivElement | null>;
|
|
5
6
|
pinnedLeftRef: RefObject<HTMLDivElement | null>;
|
|
6
7
|
pinnedRightRef: RefObject<HTMLDivElement | null>;
|
|
7
|
-
|
|
8
|
+
scrollbarHorizontalRef: RefObject<HTMLDivElement | null>;
|
|
9
|
+
tableContentWidth: number;
|
|
8
10
|
}) => import("react/jsx-runtime").JSX.Element | null;
|
|
9
11
|
export default TableHorizontalScrollbar;
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { RefObject } from "react";
|
|
2
|
-
declare const useScrollbarVisibility: ({ headerContainerRef, mainSectionRef, }: {
|
|
2
|
+
declare const useScrollbarVisibility: ({ headerContainerRef, mainSectionRef, scrollbarHorizontalRef, scrollbarWidth, }: {
|
|
3
3
|
headerContainerRef?: RefObject<HTMLElement | null> | undefined;
|
|
4
4
|
mainSectionRef?: RefObject<HTMLElement | null> | undefined;
|
|
5
|
+
scrollbarHorizontalRef?: RefObject<HTMLElement | null> | undefined;
|
|
6
|
+
scrollbarWidth: number;
|
|
5
7
|
}) => void;
|
|
6
8
|
export default useScrollbarVisibility;
|
|
@@ -1,3 +1,7 @@
|
|
|
1
1
|
import { RefObject } from "react";
|
|
2
|
-
declare const useWidthSync: (
|
|
2
|
+
declare const useWidthSync: ({ callback, ref, widthAttribute, }: {
|
|
3
|
+
callback: (width: number) => void;
|
|
4
|
+
ref: RefObject<HTMLElement | null>;
|
|
5
|
+
widthAttribute: "offsetWidth" | "scrollWidth";
|
|
6
|
+
}) => void;
|
|
3
7
|
export default useWidthSync;
|
package/dist/index.es.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
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 b,createRef as g,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),b=o>1,g=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(b?"":"disabled"),onClick:function(){return f(o-1)},disabled:!b},{children:s})),n("button",p({className:"st-next-prev-btn ".concat(g?"":"disabled"),onClick:function(){return f(o+1)},disabled:!g},{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"})}))},z=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(z,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,b=o(l),g=b[0],f=b[1];return a?e("div",p({className:"st-column-editor ".concat(g?"open":""," ").concat(d),onClick:function(){return function(e){f(e)}(!g)}},{children:[n("div",p({className:"st-column-editor-text"},{children:t})),n(E,{headers:s,open:g,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 --st-after-width: 11.01px;\n --st-resize-handle-width: 3px;\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: var(--slate-50);\n --st-scrollbar-thumb-color: var(--slate-300);\n\n --st-border-color: var(--gray-300);\n --st-odd-row-background-color: var(--white);\n --st-even-row-background-color: var(--white);\n --st-header-background-color: var(--white);\n --st-dragging-background-color: var(--gray-200);\n --st-selected-cell-background-color: var(--blue-200);\n --st-selected-first-cell-background-color: var(--blue-200);\n --st-footer-background-color: var(--white);\n --st-cell-color: var(--gray-800);\n --st-cell-odd-row-color: var(--gray-700);\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);\n --st-selected-cell-color: var(--gray-900);\n --st-selected-first-cell-color: var(--gray-900);\n --st-resize-handle-color: var(--blue-300);\n --st-separator-border-color: var(--slate-100);\n --st-last-group-row-separator-border-color: var(--slate-300);\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-600);\n --st-checkbox-checked-border-color: var(--blue-600);\n --st-column-editor-background-color: var(--white);\n --st-column-editor-popout-background-color: var(--white);\n --st-button-hover-background-color: var(--gray-200);\n --st-button-active-background-color: var(--blue-800);\n --st-font-family: "Roboto", sans-serif;\n --st-editable-cell-focus-border-color: var(--blue-600);\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: var(--slate-800);\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: var(--slate-950);\n --st-scrollbar-thumb-color: var(--slate-200);\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: var(--purple-100);\n --st-scrollbar-thumb-color: var(--purple-300);\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: var(--orange-200);\n --st-scrollbar-thumb-color: var(--orange-300);\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: var(--yellow-100);\n --st-scrollbar-thumb-color: var(--yellow-300);\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: var(--slate-800);\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: var(--cyan-100);\n --st-scrollbar-thumb-color: var(--cyan-300);\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: var(--green-100);\n --st-scrollbar-thumb-color: var(--green-400);\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: var(--amber-100);\n --st-scrollbar-thumb-color: var(--amber-300);\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: var(--pink-50);\n --st-scrollbar-thumb-color: var(--pink-300);\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: var(--gray-200);\n --st-scrollbar-thumb-color: var(--gray-400);\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 flex: 1;\n position: relative;\n display: flex;\n width: 100%;\n min-height: 0;\n}\n.st-table-content {\n display: flex;\n flex-direction: column;\n}\n\n/* Header */\n.st-header-container {\n display: flex;\n}\n\n.st-header-container.st-header-scroll-padding::after {\n content: "";\n display: block;\n width: var(--st-after-width, default-width);\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 border-right: var(--st-border-width) solid var(--st-border-color);\n}\n.st-horizontal-scrollbar-right {\n border-left: var(--st-border-width) solid var(--st-border-color);\n}\n.st-horizontal-scrollbar-left,\n.st-horizontal-scrollbar-right {\n background-color: var(--st-scrollbar-bg-color);\n height: 100%;\n}\n.st-horizontal-scrollbar-middle {\n overflow-x: scroll;\n height: 12px;\n}\n.st-horizontal-scrollbar-middle > div {\n height: 1px;\n}\n\n.st-horizontal-scrollbar-container {\n flex-shrink: 0;\n display: flex;\n align-items: center;\n border-top: var(--st-border-width) solid var(--st-border-color);\n}\n\n.st-horizontal-scrollbar-container > div {\n display: flex;\n align-items: center;\n height: 100%;\n}\n\n.st-horizontal-scrollbar-container.st-header-scroll-padding::after {\n content: "";\n display: block;\n width: var(--st-after-width, default-width);\n flex-shrink: 0;\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 D,H=function(e){var n=e.accessor,r=e.rowIndex;return"cell-".concat(n,"-").concat(r)},S=function(e){var n=e.hiddenColumns,r=e.header,o=e.pinned;return n[r.accessor]?null:!o&&!r.pinned||r.pinned===o||null},N=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)}})},B=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)}})},M=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(N,{onBlur:s,onChange:l,value:a}):"number"==typeof a?n(B,{defaultValue:a,onBlur:s,onChange:l}):null})},T=0,O=function(){return function(e){var n=e.callback,r=e.callbackProps,o=e.limit,t=Date.now();(0===T||t-T>=o)&&(T=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,b=Math.sqrt(Math.pow(i-P.screenX,2)+Math.pow(u-P.screenY,2));s.current=t;var g=m([],a.current,!0),f=g.findIndex((function(e){var n;return e.accessor===(null===(n=o.current)||void 0===n?void 0:n.accessor)})),v=g.findIndex((function(e){return e.accessor===t.accessor})),p=g.splice(f,1)[0];if(g.splice(v,0,p),!(l||t.accessor===(null===(n=o.current)||void 0===n?void 0:n.accessor)||null===o.current||b<10||void 0===f||void 0===v||JSON.stringify(g)===JSON.stringify(a.current))){var h=Date.now();JSON.stringify(g)===JSON.stringify(d)&&h-A<800&&b<50||(A=h,P={screenX:i,screenY:u},c(g))}}},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,b=r.depth,g=r.draggedHeaderRef,f=r.header,v=r.headersRef,h=r.hoveredHeaderRef,m=r.isRowExpanded,w=r.isSelected,k=r.isTopLeftCell,R=r.onCellChange,z=r.onExpandRowClick,E=r.onMouseDown,I=r.onMouseOver,D=r.onTableHeaderDragEnd,S=r.row,N=r.rowIndex,L=i(y),B=L.rows,T=L.tableRows,A=o(u),P=A[0],U=A[1],j=o(!1),V=j[0],X=j[1],G=W({draggedHeaderRef:g,headersRef:v,hoveredHeaderRef:h,onTableHeaderDragEnd:D}).handleDragOver,F=O(),J=Boolean(null==f?void 0:f.isEditable),Y=N%2==0,q="st-cell ".concat(b>0&&f.expandable?"st-cell-depth-".concat(b):""," ").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,B,null===(a=S.rowMeta)||void 0===a?void 0:a.rowId,T]);return V?n("div",p({className:"st-cell-editing ".concat(Y?"st-cell-odd-row":"st-cell-even-row"),id:H({accessor:f.accessor,rowIndex:N+1})},{children:n(M,{onChange:function(e){var n;U(e),null==R||R({accessor:f.accessor,newValue:e,newRowIndex:N,originalRowIndex:null===(n=S.rowMeta)||void 0===n?void 0:n.rowId,row:S})},setIsEditing:X,value:P})})):e("div",p({className:q,id:H({accessor:f.accessor,rowIndex:N+1}),onDoubleClick:function(){return f.isEditable&&X(!0)},onMouseDown:function(){return E(N,d)},onMouseOver:function(){return I(N,d)},onDragOver:function(e){return F({callback:G,callbackProps:{event:e,hoveredHeader:f},limit:50})},ref:t},{children:[f.expandable&&c?m(S.rowMeta.rowId)?n("div",p({className:"st-sort-icon-container",onClick:function(){return z(S.rowMeta.rowId)}},{children:n(C,{className:"st-sort-icon"})})):n("div",p({className:"st-sort-icon-container",onClick:function(){return z(S.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":"")})},X=function(e){var o=e.allowAnimations,t=e.children,a=h(e,["allowAnimations","children"]);return o?n(G,p({},a,{children:t})):n(r,{children:t})},G=function(e){var a=e.allowHorizontalAnimate,s=void 0===a||a,c=e.children,d=e.draggedHeaderRef,i=e.headersRef,b=e.isBody,g=e.mainBodyRef,f=e.pauseAnimation,v=e.rowIndex,p=t(!1),h=o({}),m=h[0],w=h[1],k=t({}),x=i.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(H({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:v});JSON.stringify(e)!==JSON.stringify(m)&&(k.current=m,w(e))}}),[m,x,d,b,v]),u((function(){var e=g.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,g]),l((function(){f||p.current||Object.keys(k.current).length&&x&&x.forEach((function(e){var n=document.getElementById(H({accessor:e.accessor,rowIndex:v}));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,b,f,k,v]),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(X,p({allowAnimations:y.allowAnimations,allowHorizontalAnimate:y.shouldPaginate,draggedHeaderRef:y.draggedHeaderRef,headersRef:y.headersRef,isBody:!0,mainBodyRef:y.mainBodyRef,pauseAnimation:y.isWidthDragging,rowIndex:k+1},{children:[0!==k&&n(V,{lastGroupRow:f}),s.map((function(e,n){if(!S({hiddenColumns:c,header:e,pinned:m}))return null;var r=w.rowData[e.accessor];return e.cellRenderer&&(r=e.cellRenderer(w)),b(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:g(),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,g=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:[b(F,p({},f,{depth:c,lastGroupRow:u,key:i,pinned:g,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:g,props:f,row:e},r)}))]})},Y=function(e){e.headerContainerRef;var r=e.isRowExpanded,o=e.onExpandRowClick,a=e.pinned,s=e.rows,c=e.sectionRef,d=e.templateColumns,i=h(e,["headerContainerRef","isRowExpanded","onExpandRowClick","pinned","rows","sectionRef","templateColumns"]),u=a?"st-table-body-pinned-".concat(a):"st-table-body-main",b=t(0);l((function(){b.current=0}));var g=function(){return b.current++};return n("div",p({className:u,ref:c,style:{gridTemplateColumns:d}},{children:s.map((function(e,t){var l,s;return n(J,{getNextRowIndex:g,index:t,lastGroupRow:Boolean(null===(s=null===(l=e.rowMeta)||void 0===l?void 0:l.children)||void 0===s?void 0:s.length),pinned:a,props:p(p({},i),{isRowExpanded:r,onExpandRowClick:o}),row:e},t)}))}))},q=function(r){var t=r.currentRows,a=r.headerContainerRef,s=r.isRowExpanded,c=r.mainBodyRef,d=r.mainTemplateColumns,i=r.onExpandRowClick,u=r.pinnedLeftColumns,b=r.pinnedLeftRef,g=r.pinnedLeftTemplateColumns,f=r.pinnedRightColumns,v=r.pinnedRightRef,h=r.pinnedRightTemplateColumns,m=r.scrollbarHorizontalRef,w=r.scrollbarWidth,k=r.tableBodyContainerRef;return function(e){var n=e.headerContainerRef,r=e.mainSectionRef,t=e.scrollbarHorizontalRef,a=e.scrollbarWidth,s=o(!1),c=s[0],d=s[1];l((function(){var e=null==n?void 0:n.current,r=null==t?void 0:t.current;if(c&&e)return e.classList.add("st-header-scroll-padding"),null==r||r.classList.add("st-header-scroll-padding"),e.style.setProperty("--st-after-width","".concat(a,"px")),null==r||r.style.setProperty("--st-after-width","".concat(a,"px")),function(){e.classList.remove("st-header-scroll-padding"),null==r||r.classList.remove("st-header-scroll-padding")}}),[n,c,t,a]),l((function(){var e=null==n?void 0:n.current,o=null==r?void 0:r.current;if(o&&e){var t=function(){if(o){var e=o.scrollHeight>o.clientHeight;d(e)}};t();var a=new ResizeObserver((function(){t()}));return a.observe(o),function(){o&&a.unobserve(o)}}}),[n,r])}({headerContainerRef:a,mainSectionRef:k,scrollbarHorizontalRef:m,scrollbarWidth:w}),e("div",p({className:"st-table-body-container",ref:k},{children:[u.length>0&&n(Y,p({},r,{rows:t,templateColumns:g,pinned:"left",sectionRef:b,isRowExpanded:s,onExpandRowClick:i})),n(Y,p({},r,{rows:t,templateColumns:d,sectionRef:c,isRowExpanded:s,onExpandRowClick:i})),f.length>0&&n(Y,p({},r,{rows:t,templateColumns:h,pinned:"right",sectionRef:v,isRowExpanded:s,onExpandRowClick:i}))]}))},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,b=r.headersRef,g=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,z=o(!1),E=z[0],I=z[1],D=null===(a=b.current)||void 0===a?void 0:a[f],S=Boolean(null==D?void 0:D.isSortable),N="st-header-cell ".concat(D===g.current?"st-hovered":""," ").concat(E?"st-dragging":""," ").concat(S?"clickable":""," ").concat(d&&!S?"draggable":""," ").concat("right"===(null==D?void 0:D.align)?"right-aligned":""),L=W({draggedHeaderRef:i,headersRef:b,hoveredHeaderRef:g,onTableHeaderDragEnd:h}),B=L.handleDragStart,M=L.handleDragEnd,T=W({draggedHeaderRef:i,headersRef:b,hoveredHeaderRef:g,onTableHeaderDragEnd:h}).handleDragOver,A=O(),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)}}),[]),!D)return null;var U=s&&n("div",{className:"st-header-resize-handle",onMouseDown:function(e){A({callback:K,callbackProps:{event:e,forceUpdate:u,header:D,headersRef:b,index:f,setIsWidthDragging:k},limit:10})}});return e("div",p({className:N,id:H({accessor:D.accessor,rowIndex:0}),onDragOver:function(e){A({callback:T,callbackProps:{event:e,hoveredHeader:D},limit:50})},ref:t,style:{width:D.width}},{children:[m&&U,n("div",p({className:"st-header-label",draggable:d,onClick:function(e){return P({event:e,header:D})},onDragEnd:function(e){e.preventDefault(),I(!1),M()},onDragStart:function(e){d&&D&&function(e){I(!0),B(e)}(D)},onMouseEnter:function(){return document.body.style.overflow="hidden"},onMouseLeave:function(){return document.body.style.overflow="auto"}},{children:null==D?void 0:D.label})),y&&y.key.accessor===D.accessor&&e("div",p({className:"st-sort-icon-container",onClick:function(e){return P({event:e,header:D})}},{children:["ascending"===y.direction&&C&&C,"descending"===y.direction&&R&&R]})),!m&&U]}))})),Q=function(e,n){l((function(){if(e.current){var r=e.current,o=function(){var e,o=null==r?void 0:r.scrollLeft;void 0!==o&&(null===(e=n.current)||void 0===e||e.scrollTo(o,0))};return r.addEventListener("scroll",o),function(){null==r||r.removeEventListener("scroll",o)}}}),[e,n])},Z=function(r){var o,a,l,s=r.allowAnimations,c=r.columnResizing,d=r.currentRows,i=r.draggable,u=r.draggedHeaderRef,b=r.forceUpdate,f=r.headerContainerRef,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,z=r.pinnedRightColumns,E=r.pinnedRightTemplateColumns,I=r.selectableColumns,D=r.setIsWidthDragging,H=r.setSelectedCells,N=r.shouldDisplayLastColumnCell,L=r.sort,B=r.sortDownIcon,M=r.sortUpIcon,T=r.mainBodyRef,O=t(null);Q(T,O);return e("div",p({className:"st-header-container",ref:f},{children:[R.length>0&&n("div",p({className:"st-header-pinned-left",style:{gridTemplateColumns:C}},{children:n(X,p({allowAnimations:s,draggedHeaderRef:u,headersRef:v,mainBodyRef:T,pauseAnimation:w,rowIndex:0},{children:null===(o=v.current)||void 0===o?void 0:o.map((function(e,r){return S({hiddenColumns:h,header:e,pinned:"left"})?n($,{columnResizing:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:b,headersRef:v,hoveredHeaderRef:m,index:r,onSort:x,onTableHeaderDragEnd:y,ref:g(),selectableColumns:I,setIsWidthDragging:D,setSelectedCells:H,sort:L,sortDownIcon:B,sortUpIcon:M},e.accessor):null}))}))})),n("div",p({className:"st-header-main",onScroll:function(e){var n,r,o=null===(n=O.current)||void 0===n?void 0:n.scrollLeft;void 0!==o&&(null===(r=T.current)||void 0===r||r.scrollTo(o,0))},ref:O,style:{gridTemplateColumns:k}},{children:e(X,p({allowAnimations:s,draggedHeaderRef:u,headersRef:v,mainBodyRef:T,pauseAnimation:w,rowIndex:0},{children:[null===(a=v.current)||void 0===a?void 0:a.map((function(e,r){return S({hiddenColumns:h,header:e})?n($,{columnResizing:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:b,headersRef:v,hoveredHeaderRef:m,index:r,onSort:x,onTableHeaderDragEnd:y,ref:g(),selectableColumns:I,setIsWidthDragging:D,setSelectedCells:H,sort:L,sortDownIcon:B,sortUpIcon:M},e.accessor):null})),n(j,{ref:g(),visible:N})]}))})),z.length>0&&n("div",p({className:"st-header-pinned-right",style:{gridTemplateColumns:E}},{children:e(X,p({allowAnimations:s,draggedHeaderRef:u,headersRef:v,mainBodyRef:T,pauseAnimation:w,rowIndex:0},{children:[null===(l=v.current)||void 0===l?void 0:l.map((function(e,r){return S({hiddenColumns:h,header:e,pinned:"right"})?n($,{columnResizing:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:b,headersRef:v,hoveredHeaderRef:m,index:r,onSort:x,onTableHeaderDragEnd:y,reverse:!0,ref:g(),selectableColumns:I,setIsWidthDragging:D,setSelectedCells:H,sort:L,sortDownIcon:B,sortUpIcon:M},e.accessor):null})),n(j,{ref:g(),visible:N})]}))}))]}))},_=function(r){var o=r.allowAnimations,a=r.columnResizing,l=r.currentRows,c=r.draggable,d=r.draggedHeaderRef,i=r.editColumns,u=r.forceUpdate,b=r.getBorderClass,g=r.handleMouseDown,f=r.handleMouseOver,v=r.headersRef,h=r.hiddenColumns,m=r.hoveredHeaderRef,w=r.isRowExpanded,k=r.isSelected,x=r.isTopLeftCell,y=r.isWidthDragging,R=r.mainBodyRef,C=r.onCellChange,z=r.onExpandRowClick,E=r.onSort,I=r.onTableHeaderDragEnd,D=r.pinnedLeftRef,H=r.pinnedRightRef,S=r.scrollbarHorizontalRef,N=r.scrollbarWidth,L=r.selectableColumns,B=r.setIsWidthDragging,M=r.setSelectedCells,T=r.shouldPaginate,O=r.sort,A=r.sortDownIcon,P=r.sortUpIcon,W=r.tableBodyContainerRef,U=t(null),j=v.current.filter((function(e){return!e.hide&&!e.pinned})),V=s((function(){return!!R.current&&j.reduce((function(e,n){return e+n.width}),0)<R.current.clientWidth}),[j,R]),X=v.current.filter((function(e){return"left"===e.pinned&&!0!==e.hide})),G=v.current.filter((function(e){return"right"===e.pinned&&!0!==e.hide})),F=s((function(){return"".concat(X.map((function(e){return"".concat(e.width,"px")})).join(" "))}),[X]),J=s((function(){return"".concat(j.filter((function(e){return!0!==h[e.accessor]})).map((function(e){return"".concat(e.width,"px")})).join(" ")," 1fr")}),[j,h]),Y=s((function(){return"".concat(G.map((function(e){return"".concat(e.width,"px")})).join(" "))}),[G]),K={allowAnimations:o,columnResizing:a,currentRows:l,draggable:c,draggedHeaderRef:d,forceUpdate:u,headerContainerRef:U,headersRef:v,hiddenColumns:h,hoveredHeaderRef:m,isWidthDragging:y,mainBodyRef:R,mainTemplateColumns:J,onSort:E,onTableHeaderDragEnd:I,pinnedLeftColumns:X,pinnedLeftTemplateColumns:F,pinnedRightColumns:G,pinnedRightTemplateColumns:Y,selectableColumns:L,setIsWidthDragging:B,setSelectedCells:M,shouldDisplayLastColumnCell:V,sort:O,sortDownIcon:A,sortUpIcon:P,tableBodyContainerRef:W},$={allowAnimations:o,currentRows:l,draggedHeaderRef:d,getBorderClass:b,handleMouseDown:g,handleMouseOver:f,headerContainerRef:U,headers:v.current,headersRef:v,hiddenColumns:h,hoveredHeaderRef:m,isRowExpanded:w,isSelected:k,isTopLeftCell:x,isWidthDragging:y,mainBodyRef:R,mainTemplateColumns:J,onCellChange:C,onExpandRowClick:z,onTableHeaderDragEnd:I,pinnedLeftColumns:X,pinnedLeftRef:D,pinnedLeftTemplateColumns:F,pinnedRightColumns:G,pinnedRightRef:H,pinnedRightTemplateColumns:Y,scrollbarHorizontalRef:S,scrollbarWidth:N,shouldDisplayLastColumnCell:V,shouldPaginate:T,tableBodyContainerRef:W};return e("div",p({className:"st-table-content",style:{width:i?"calc(100% - 27.5px)":"100%"}},{children:[n(Z,p({},K)),n(q,p({},$))]}))},ee=function(e){var n=e.callback,r=e.ref,o=e.widthAttribute;l((function(){var e=r.current;if(e){var t=function(){n(e[o]||0)};t();var a=new ResizeObserver((function(){t()}));return a.observe(e),function(){return a.disconnect()}}}),[n,r,o])},ne=function(r){r.headersRef;var a=r.mainBodyRef,l=r.pinnedLeftRef,s=r.pinnedRightRef,c=r.scrollbarHorizontalRef,d=r.tableContentWidth,i=o(0),u=i[0],b=i[1],g=o(0),f=g[0],v=g[1],h=o(0),m=h[0],w=h[1],k=t(null);return ee({widthAttribute:"offsetWidth",callback:b,ref:l}),ee({widthAttribute:"scrollWidth",callback:w,ref:a}),ee({widthAttribute:"offsetWidth",callback:v,ref:s}),Q(a,k),!a.current||a.current.scrollWidth<=a.current.clientWidth?null:n("div",p({className:"st-horizontal-scrollbar-container",ref:c},{children:e("div",p({style:{width:d}},{children:[u>0&&n("div",{className:"st-horizontal-scrollbar-left",style:{flexShrink:0,width:u}}),m>0&&n("div",p({className:"st-horizontal-scrollbar-middle",onScroll:function(e){var n=e.target.scrollLeft;void 0!==n&&a.current&&a.current.scrollTo({left:n,behavior:"auto"})},ref:k},{children:n("div",{style:{width:m}})})),f>0&&n("div",{className:"st-horizontal-scrollbar-right",style:{flexShrink:0,minWidth:f}})]}))}))},re=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"}(D||(D={}));var oe=function(r){var c=r.allowAnimations,d=void 0!==c&&c,i=r.columnEditorPosition,b=void 0===i?D.Right:i,g=r.columnEditorText,f=void 0===g?"Columns":g,h=r.columnResizing,m=void 0!==h&&h,z=r.defaultHeaders,E=r.draggable,H=void 0!==E&&E,S=r.editColumns,N=void 0!==S&&S,L=r.editColumnsInitOpen,B=void 0!==L&&L,M=r.height,T=r.hideFooter,O=void 0!==T&&T,A=r.nextIcon,P=void 0===A?n(x,{className:"st-next-prev-icon"}):A,W=r.onCellChange,U=r.prevIcon,j=void 0===U?n(k,{className:"st-next-prev-icon"}):U,V=r.rows,X=r.rowsPerPage,G=void 0===X?10:X,F=r.selectableCells,J=void 0!==F&&F,Y=r.selectableColumns,q=void 0!==Y&&Y,K=r.shouldPaginate,$=void 0!==K&&K,Q=r.sortDownIcon,Z=void 0===Q?n(C,{className:"st-sort-icon"}):Q,ee=r.sortUpIcon,oe=void 0===ee?n(R,{className:"st-sort-icon"}):ee,te=r.theme,ae=void 0===te?"light":te,le=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}(V)})),se=le[0],ce=le[1],de=s((function(){return V.map((function(e,n){return p(p({},e),{originalRowIndex:n})}))}),[V]),ie=t(null),ue=t(z),be=t(null),ge=t(null),fe=t(null),ve=t(null),pe=t(null),he=t(null),me=o(!1),we=me[0],ke=me[1],xe=o(1),ye=xe[0],Re=xe[1],Ce=o(0),ze=Ce[0],Ee=Ce[1],Ie=o(0),De=Ie[0],He=Ie[1],Se=re(de,ue.current),Ne=Se.sort,Le=Se.setSort,Be=Se.sortedRows,Me=Se.hiddenColumns,Te=Se.setHiddenColumns,Oe=a((function(e){var n=String(e);ce((function(e){var r=new Set(e);return r.has(n)?r.delete(n):r.add(n),r}))}),[]),Ae=a((function(e){return se.has(String(e))}),[se]),Pe=v((function(e){return e+1}),0)[1],We=function(e){var n=e.selectableCells,r=e.headers,c=e.rows,d=o(new Set),i=d[0],u=d[1],b=t(!1),g=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&&(b.current=!0,g.current={row:o,col:r},u(new Set(["".concat(o,"-").concat(r)])))},handleMouseOver:function(e,r){if(n&&b.current&&g.current){for(var o=new Set,t=Math.min(g.current.row,e),a=Math.max(g.current.row,e),l=Math.min(g.current.col,r),s=Math.max(g.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(){b.current=!1,g.current=null},isSelected:v,getBorderClass:p,isTopLeftCell:h,setSelectedCells:u}}({selectableCells:J,headers:ue.current,rows:Be}),Ue=We.handleMouseDown,je=We.handleMouseOver,Ve=We.handleMouseUp,Xe=We.isSelected,Ge=We.getBorderClass,Fe=We.isTopLeftCell,Je=We.setSelectedCells,Ye=s((function(){return $?Be.slice((ye-1)*G,ye*G):Be}),[ye,G,$,Be]),qe=a((function(e,n){Le((function(r){return(null==r?void 0:r.key.accessor)!==n?{key:ue.current[e],direction:"ascending"}:"ascending"===(null==r?void 0:r.direction)?{key:ue.current[e],direction:"descending"}:null}))}),[Le]),Ke=a((function(e){ue.current=e,Pe()}),[]);return l((function(){var e=function(e){var n=e.target;n.closest(".st-cell")||q&&(n.classList.contains("st-header-cell")||n.classList.contains("st-header-label"))||Je(new Set)};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[q,Je]),u((function(){if(he.current){var e=he.current.offsetWidth-he.current.clientWidth,n=he.current.clientWidth;Ee(e),He(n)}}),[]),n(y.Provider,p({value:{rows:V,tableRows:de}},{children:e("div",p({className:"st-wrapper theme-".concat(ae),style:M?{height:M}:{}},{children:[e("div",p({className:"st-table-wrapper-container"},{children:[e("div",p({className:"st-table-wrapper",onMouseUp:Ve,onMouseLeave:Ve},{children:[n(_,{allowAnimations:d,columnResizing:m,currentRows:Ye,draggable:H,draggedHeaderRef:ie,editColumns:N,forceUpdate:Pe,getBorderClass:Ge,handleMouseDown:Ue,handleMouseOver:je,headers:ue.current,headersRef:ue,hiddenColumns:Me,hoveredHeaderRef:be,isRowExpanded:Ae,isSelected:Xe,isTopLeftCell:Fe,isWidthDragging:we,mainBodyRef:ge,onCellChange:W,onExpandRowClick:Oe,onSort:qe,onTableHeaderDragEnd:Ke,pinnedLeftRef:fe,pinnedRightRef:ve,scrollbarHorizontalRef:pe,scrollbarWidth:ze,selectableColumns:q,setIsWidthDragging:ke,setSelectedCells:Je,shouldPaginate:$,sort:Ne,sortDownIcon:Z,sortUpIcon:oe,tableBodyContainerRef:he}),n(I,{columnEditorText:f,editColumns:N,editColumnsInitOpen:B,headers:ue.current,hiddenColumns:Me,position:b,setHiddenColumns:Te})]})),n(ne,{headersRef:ue,mainBodyRef:ge,pinnedLeftRef:fe,pinnedRightRef:ve,scrollbarHorizontalRef:pe,tableContentWidth:De})]})),n(w,{currentPage:ye,hideFooter:O,nextIcon:P,onPageChange:Re,prevIcon:j,rowsPerPage:G,shouldPaginate:$,totalRows:Be.length})]}))}))};oe.defaultProps={allowAnimations:!1,columnEditorPosition:D.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 te=f(oe);export{te as SimpleTable};
|
|
2
|
+
//# sourceMappingURL=index.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n"],"names":["css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode"],"mappings":"q+HAAA,SAAqBA,EAAKC,QACX,IAARA,IAAiBA,EAAM,CAAA,GAC5B,IAAIC,EAAWD,EAAIC,SAEnB,GAAKF,GAA2B,oBAAbG,SAAnB,CAEA,IAAIC,EAAOD,SAASC,MAAQD,SAASE,qBAAqB,QAAQ,GAC9DC,EAAQH,SAASI,cAAc,SACnCD,EAAME,KAAO,WAEI,QAAbN,GACEE,EAAKK,WACPL,EAAKM,aAAaJ,EAAOF,EAAKK,YAKhCL,EAAKO,YAAYL,GAGfA,EAAMM,WACRN,EAAMM,WAAWC,QAAUb,EAE3BM,EAAMK,YAAYR,SAASW,eAAed,GAnBY,CAqB1D"}
|
package/dist/index.js
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
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 flex: 1;\n position: relative;\n display: flex;\n width: 100%;\n min-height: 0;\n}\n.st-table-content {\n display: flex;\n flex-direction: column;\n}\n\n/* Header */\n.st-header-container {\n display: flex;\n}\n\n.st-header-container.st-header-scroll-padding::after {\n content: "";\n display: block;\n width: 11.01px;\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 flex-shrink: 0;\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){e.headerContainerRef;var r=e.isRowExpanded,o=e.onExpandRowClick,a=e.pinned,s=e.rows,c=e.sectionRef,d=e.templateColumns,i=h(e,["headerContainerRef","isRowExpanded","onExpandRowClick","pinned","rows","sectionRef","templateColumns"]),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:c,style:{gridTemplateColumns:d}},{children:s.map((function(e,t){var l,s;return n(J,{getNextRowIndex:b,index:t,lastGroupRow:Boolean(null===(s=null===(l=e.rowMeta)||void 0===l?void 0:l.children)||void 0===s?void 0:s.length),pinned:a,props:p(p({},i),{isRowExpanded:r,onExpandRowClick:o}),row:e},t)}))}))},q=function(r){var a=t(null),s=r.currentRows,c=r.headerContainerRef,d=r.isRowExpanded,i=r.mainTemplateColumns,u=r.onExpandRowClick,g=r.pinnedLeftColumns,b=r.pinnedLeftRef,f=r.pinnedLeftTemplateColumns,v=r.pinnedRightColumns,h=r.pinnedRightRef,m=r.pinnedRightTemplateColumns,w=r.tableRef;return function(e){var n=e.headerContainerRef,r=e.mainSectionRef,t=o(!1),a=t[0],s=t[1];l((function(){var e=null==n?void 0:n.current;if(a&&e)return e.classList.add("st-header-scroll-padding"),function(){e.classList.remove("st-header-scroll-padding")}}),[n,a]),l((function(){var e=null==n?void 0:n.current,o=null==r?void 0:r.current;if(o&&e){var t=function(){if(o){var e=o.scrollHeight>o.clientHeight;console.log(o),s(e)}};t();var a=new ResizeObserver((function(){t()}));return a.observe(o),function(){o&&a.unobserve(o)}}}),[n,r])}({headerContainerRef:c,mainSectionRef:a}),e("div",p({className:"st-table-body-container",ref:a},{children:[g.length>0&&n(Y,p({},r,{rows:s,templateColumns:f,pinned:"left",sectionRef:b,isRowExpanded:d,onExpandRowClick:u})),n(Y,p({},r,{rows:s,templateColumns:i,sectionRef:w,isRowExpanded:d,onExpandRowClick:u})),v.length>0&&n(Y,p({},r,{rows:s,templateColumns:m,pinned:"right",sectionRef:h,isRowExpanded:d,onExpandRowClick:u}))]}))},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(e,n){l((function(){if(e.current){var r=e.current,o=function(){var e,o=null==r?void 0:r.scrollLeft;void 0!==o&&(null===(e=n.current)||void 0===e||e.scrollTo(o,0))};return r.addEventListener("scroll",o),function(){null==r||r.removeEventListener("scroll",o)}}}),[e,n])},Z=function(r){var o,a,l,s=r.allowAnimations,c=r.columnResizing,d=r.currentRows,i=r.draggable,u=r.draggedHeaderRef,g=r.forceUpdate,f=r.headerContainerRef,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);Q(O,B);return e("div",p({className:"st-header-container",ref:f},{children:[R.length>0&&n("div",p({className:"st-header-pinned-left",style:{gridTemplateColumns:C}},{children:n(G,p({allowAnimations:s,draggedHeaderRef:u,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:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:g,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:s,draggedHeaderRef:u,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:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:g,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:s,draggedHeaderRef:u,headersRef:v,pauseAnimation:w,rowIndex:0,tableRef:O},{children:[null===(l=v.current)||void 0===l?void 0:l.map((function(e,r){return N({hiddenColumns:h,header:e,pinned:"right"})?n($,{columnResizing:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:g,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})]}))}))]}))},_=function(r){var o=r.allowAnimations,a=r.columnResizing,l=r.currentRows,c=r.draggable,d=r.draggedHeaderRef,i=r.editColumns,u=r.forceUpdate,g=r.getBorderClass,b=r.handleMouseDown,f=r.handleMouseOver,v=r.headersRef,h=r.hiddenColumns,m=r.hoveredHeaderRef,w=r.isRowExpanded,k=r.isSelected,x=r.isTopLeftCell,y=r.isWidthDragging,R=r.onCellChange,C=r.onExpandRowClick,D=r.onSort,E=r.onTableHeaderDragEnd,I=r.pinnedLeftRef,z=r.pinnedRightRef,S=r.selectableColumns,N=r.setIsWidthDragging,H=r.setSelectedCells,L=r.shouldPaginate,M=r.sort,T=r.sortDownIcon,O=r.sortUpIcon,B=r.tableRef,A=t(null),P=v.current.filter((function(e){return!e.hide&&!e.pinned})),W=s((function(){return!!B.current&&P.reduce((function(e,n){return e+n.width}),0)<B.current.clientWidth}),[P,B]),U=v.current.filter((function(e){return"left"===e.pinned&&!0!==e.hide})),j=v.current.filter((function(e){return"right"===e.pinned&&!0!==e.hide})),V=s((function(){return"".concat(U.map((function(e){return"".concat(e.width,"px")})).join(" "))}),[U]),G=s((function(){return"".concat(P.filter((function(e){return!0!==h[e.accessor]})).map((function(e){return"".concat(e.width,"px")})).join(" ")," 1fr")}),[P,h]),X=s((function(){return"".concat(j.map((function(e){return"".concat(e.width,"px")})).join(" "))}),[j]),F={allowAnimations:o,columnResizing:a,currentRows:l,draggable:c,draggedHeaderRef:d,forceUpdate:u,headerContainerRef:A,headersRef:v,hiddenColumns:h,hoveredHeaderRef:m,isWidthDragging:y,mainTemplateColumns:G,onSort:D,onTableHeaderDragEnd:E,pinnedLeftColumns:U,pinnedLeftTemplateColumns:V,pinnedRightColumns:j,pinnedRightTemplateColumns:X,selectableColumns:S,setIsWidthDragging:N,setSelectedCells:H,shouldDisplayLastColumnCell:W,sort:M,sortDownIcon:T,sortUpIcon:O,tableRef:B},J={allowAnimations:o,currentRows:l,draggedHeaderRef:d,getBorderClass:g,handleMouseDown:b,handleMouseOver:f,headerContainerRef:A,headers:v.current,headersRef:v,hiddenColumns:h,hoveredHeaderRef:m,isRowExpanded:w,isSelected:k,isTopLeftCell:x,isWidthDragging:y,mainTemplateColumns:G,onCellChange:R,onExpandRowClick:C,onTableHeaderDragEnd:E,pinnedLeftColumns:U,pinnedLeftRef:I,pinnedLeftTemplateColumns:V,pinnedRightColumns:j,pinnedRightRef:z,pinnedRightTemplateColumns:X,shouldDisplayLastColumnCell:W,shouldPaginate:L,tableRef:B};return e("div",p({className:"st-table-content",style:{width:i?"calc(100% - 27.5px)":"100%"}},{children:[n(Z,p({},F)),n(q,p({},J))]}))},ee=function(e,n){l((function(){var r=e.current;if(r){var o=function(){n((null==r?void 0:r.scrollWidth)||0)};o();var t=new ResizeObserver((function(){o()}));return t.observe(r),function(){return t.disconnect()}}}),[n,e])},ne=function(r){r.headersRef;var a=r.pinnedLeftRef,l=r.pinnedRightRef,s=r.tableRef,c=o(0),d=c[0],i=c[1],u=o(0),g=u[0],b=u[1],f=o(0),v=f[0],h=f[1],m=t(null);return ee(a,i),ee(s,h),ee(l,b),Q(s,m),!s.current||s.current.scrollWidth<=s.current.clientWidth?null:e("div",p({className:"st-horizontal-scrollbar-container"},{children:[d>0&&n("div",{className:"st-horizontal-scrollbar-left",style:{flexShrink:0,width:d}}),v>0&&n("div",p({className:"st-horizontal-scrollbar-middle",onScroll:function(){var e,n,r=null===(e=m.current)||void 0===e?void 0:e.scrollLeft;void 0!==r&&(null===(n=s.current)||void 0===n||n.scrollTo(r,0))},ref:m,style:{width:v}},{children:n("div",{style:{width:v}})})),g>0&&n("div",{className:"st-horizontal-scrollbar-right",style:{flexShrink:0,width:g}})]}))},re=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 oe=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"}):$,Z=r.sortUpIcon,ee=void 0===Z?n(R,{className:"st-sort-icon"}):Z,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=re(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(_,{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:ee,tableRef:de}),n(I,{columnEditorText:b,editColumns:N,editColumnsInitOpen:L,headers:fe.current,hiddenColumns:De,position:u,setHiddenColumns:Ee})]})),n(ne,{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})]}))}))};oe.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 te=f(oe);export{te as SimpleTable};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),r=function(){return r=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},r.apply(this,arguments)};function o(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 t(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 a=function(n){var o=n.currentPage,t=n.hideFooter,a=n.nextIcon,l=n.onPageChange,s=n.prevIcon,c=n.rowsPerPage,d=n.shouldPaginate,i=n.totalRows,u=Math.ceil(i/c),b=o>1,f=o<u,g=function(e){e>=1&&e<=u&&l(e)};return t||!d?null:e.jsxs("div",r({className:"st-footer"},{children:[e.jsx("button",r({className:"st-next-prev-btn ".concat(b?"":"disabled"),onClick:function(){return g(o-1)},disabled:!b},{children:s})),e.jsx("button",r({className:"st-next-prev-btn ".concat(f?"":"disabled"),onClick:function(){return g(o+1)},disabled:!f},{children:a})),Array.from({length:u},(function(n,t){return e.jsx("button",r({onClick:function(){return g(t+1)},className:"st-page-btn ".concat(o===t+1?"active":"")},{children:t+1}),t)}))]}))},l=function(n){var o=n.className;return e.jsx("svg",r({className:o,viewBox:"0 0 24 24",width:"24",height:"24",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{d:"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"})}))},s=function(n){var o=n.className;return e.jsx("svg",r({className:o,viewBox:"0 0 24 24",width:"24",height:"24",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{d:"M8.59 16.59L10 18l6-6-6-6-1.41 1.41L13.17 12z"})}))},c=n.createContext({rows:[],tableRows:[]}),d=function(n){var o=n.className;return e.jsx("svg",r({className:o,viewBox:"0 0 20 20",width:"20",height:"20",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{d:"M5.41 11.41L10 6.83l4.59 4.58L16 10l-6-6-6 6z"})}))},i=function(n){var o=n.className;return e.jsx("svg",r({className:o,viewBox:"0 0 20 20",width:"20",height:"20",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{d:"M5.41 7.59L10 12.17l4.59-4.58L16 9l-6 6-6-6z"})}))},u=function(o){var t=o.checked,a=void 0!==t&&t,l=o.children,s=o.onChange,c=n.useState(a),d=c[0],i=c[1];return e.jsxs("label",r({className:"st-checkbox-label"},{children:[e.jsx("input",{checked:d,className:"st-checkbox-input",onChange:function(){var e=!d;i(e),s&&s(e)},type:"checkbox"}),e.jsx("span",r({className:"st-checkbox-custom ".concat(d?"st-checked":"")},{children:d&&e.jsx("span",{className:"st-checkbox-checkmark"})})),l]}))},b=function(n){var o=n.headers,t=n.open,a=n.position;n.setOpen;var l=n.setHiddenColumns,s=n.hiddenColumns,c="left"===a?"left":"";return e.jsx("div",r({className:"st-column-editor-popout ".concat(t?"open":""," ").concat(c),onClick:function(e){return e.stopPropagation()}},{children:e.jsx("div",r({className:"st-column-editor-popout-content"},{children:o.map((function(n,o){return e.jsx(u,r({checked:s[n.accessor],onChange:function(e){var o;return l(r(r({},s),((o={})[n.accessor]=e,o)))}},{children:n.label}),o)}))}))}))},f=function(o){var t=o.columnEditorText,a=o.editColumns,l=o.editColumnsInitOpen,s=o.headers,c=o.position,d=void 0===c?"right":c,i=o.setHiddenColumns,u=o.hiddenColumns,f=n.useState(l),g=f[0],v=f[1];return a?e.jsxs("div",r({className:"st-column-editor ".concat(g?"open":""," ").concat(d),onClick:function(){return function(e){v(e)}(!g)}},{children:[e.jsx("div",r({className:"st-column-editor-text"},{children:t})),e.jsx(b,{headers:s,open:g,position:d,setOpen:v,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 --st-after-width: 11.01px;\n --st-resize-handle-width: 3px;\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: var(--slate-50);\n --st-scrollbar-thumb-color: var(--slate-300);\n\n --st-border-color: var(--gray-300);\n --st-odd-row-background-color: var(--white);\n --st-even-row-background-color: var(--white);\n --st-header-background-color: var(--white);\n --st-dragging-background-color: var(--gray-200);\n --st-selected-cell-background-color: var(--blue-200);\n --st-selected-first-cell-background-color: var(--blue-200);\n --st-footer-background-color: var(--white);\n --st-cell-color: var(--gray-800);\n --st-cell-odd-row-color: var(--gray-700);\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);\n --st-selected-cell-color: var(--gray-900);\n --st-selected-first-cell-color: var(--gray-900);\n --st-resize-handle-color: var(--blue-300);\n --st-separator-border-color: var(--slate-100);\n --st-last-group-row-separator-border-color: var(--slate-300);\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-600);\n --st-checkbox-checked-border-color: var(--blue-600);\n --st-column-editor-background-color: var(--white);\n --st-column-editor-popout-background-color: var(--white);\n --st-button-hover-background-color: var(--gray-200);\n --st-button-active-background-color: var(--blue-800);\n --st-font-family: "Roboto", sans-serif;\n --st-editable-cell-focus-border-color: var(--blue-600);\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: var(--slate-800);\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: var(--slate-950);\n --st-scrollbar-thumb-color: var(--slate-200);\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: var(--purple-100);\n --st-scrollbar-thumb-color: var(--purple-300);\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: var(--orange-200);\n --st-scrollbar-thumb-color: var(--orange-300);\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: var(--yellow-100);\n --st-scrollbar-thumb-color: var(--yellow-300);\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: var(--slate-800);\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: var(--cyan-100);\n --st-scrollbar-thumb-color: var(--cyan-300);\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: var(--green-100);\n --st-scrollbar-thumb-color: var(--green-400);\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: var(--amber-100);\n --st-scrollbar-thumb-color: var(--amber-300);\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: var(--pink-50);\n --st-scrollbar-thumb-color: var(--pink-300);\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: var(--gray-200);\n --st-scrollbar-thumb-color: var(--gray-400);\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 flex: 1;\n position: relative;\n display: flex;\n width: 100%;\n min-height: 0;\n}\n.st-table-content {\n display: flex;\n flex-direction: column;\n}\n\n/* Header */\n.st-header-container {\n display: flex;\n}\n\n.st-header-container.st-header-scroll-padding::after {\n content: "";\n display: block;\n width: var(--st-after-width, default-width);\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 border-right: var(--st-border-width) solid var(--st-border-color);\n}\n.st-horizontal-scrollbar-right {\n border-left: var(--st-border-width) solid var(--st-border-color);\n}\n.st-horizontal-scrollbar-left,\n.st-horizontal-scrollbar-right {\n background-color: var(--st-scrollbar-bg-color);\n height: 100%;\n}\n.st-horizontal-scrollbar-middle {\n overflow-x: scroll;\n height: 12px;\n}\n.st-horizontal-scrollbar-middle > div {\n height: 1px;\n}\n\n.st-horizontal-scrollbar-container {\n flex-shrink: 0;\n display: flex;\n align-items: center;\n border-top: var(--st-border-width) solid var(--st-border-color);\n}\n\n.st-horizontal-scrollbar-container > div {\n display: flex;\n align-items: center;\n height: 100%;\n}\n\n.st-horizontal-scrollbar-container.st-header-scroll-padding::after {\n content: "";\n display: block;\n width: var(--st-after-width, default-width);\n flex-shrink: 0;\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 g,v=function(e){var n=e.accessor,r=e.rowIndex;return"cell-".concat(n,"-").concat(r)},p=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(n){var o=n.value,t=n.onBlur,a=n.onChange;return e.jsxs("select",r({value:o.toString(),onBlur:t,onChange:function(e){var n=e.target.value;a("true"===n)}},{children:[e.jsx("option",r({value:"true"},{children:"True"})),e.jsx("option",r({value:"false"},{children:"False"}))]}))},m=function(r){var o=r.defaultValue,t=r.onBlur,a=r.onChange,l=n.useRef(null);return e.jsx("input",{className:"editable-cell-input",ref:l,autoFocus:!0,type:"text",defaultValue:null!=o?o:"",onBlur:t,onChange:function(e){var n=e.target.value;a(n)}})},w=function(r){var o=r.defaultValue,t=r.onBlur,a=r.onChange,l=n.useRef(null);return e.jsx("input",{className:"editable-cell-input",ref:l,autoFocus:!0,defaultValue:o.toString(),onBlur:t,onChange:function(e){var n=e.target.value;/^\d*\.?\d*$/.test(n)&&a(n)}})},x=function(n){var r=n.onChange,o=n.setIsEditing,t=n.value,a=function(e){null==r||r(e)},l=function(){o(!1)};return e.jsx(e.Fragment,{children:"string"==typeof t||null==t?e.jsx(m,{defaultValue:t,onBlur:l,onChange:a}):"boolean"==typeof t?e.jsx(h,{onBlur:l,onChange:a,value:t}):"number"==typeof t?e.jsx(w,{defaultValue:t,onBlur:l,onChange:a}):null})},k=0,y=function(){return function(e){var n=e.callback,r=e.callbackProps,o=e.limit,t=Date.now();(0===k||t-k>=o)&&(k=t,n(r))}},R=Date.now(),C={screenX:0,screenY:0},j=function(e){var r,o,a=e.draggedHeaderRef,l=e.headersRef,s=e.hoveredHeaderRef,c=e.onTableHeaderDragEnd,d=(r=l.current,o=n.useRef(r),n.useEffect((function(){o.current=r}),[r]),o.current);return{handleDragStart:function(e){a.current=e,R=Date.now()},handleDragOver:function(e){var n,r=e.event,o=e.hoveredHeader;if(r.preventDefault(),l.current){var i=r.currentTarget.getAnimations().some((function(e){return"running"===e.playState})),u=r.screenX,b=r.screenY,f=Math.sqrt(Math.pow(u-C.screenX,2)+Math.pow(b-C.screenY,2));s.current=o;var g=t([],l.current,!0),v=g.findIndex((function(e){var n;return e.accessor===(null===(n=a.current)||void 0===n?void 0:n.accessor)})),p=g.findIndex((function(e){return e.accessor===o.accessor})),h=g.splice(v,1)[0];if(g.splice(p,0,h),!(i||o.accessor===(null===(n=a.current)||void 0===n?void 0:n.accessor)||null===a.current||f<10||void 0===v||void 0===p||JSON.stringify(g)===JSON.stringify(l.current))){var m=Date.now();JSON.stringify(g)===JSON.stringify(d)&&m-R<800&&f<50||(R=m,C={screenX:u,screenY:b},c(g))}}},handleDragEnd:function(){a.current=null,s.current=null}}},E=n.forwardRef((function(o,t){var a,l=o.borderClass,d=o.cellHasChildren,u=o.colIndex,b=o.content,f=o.depth,g=o.draggedHeaderRef,p=o.header,h=o.headersRef,m=o.hoveredHeaderRef,w=o.isRowExpanded,k=o.isSelected,R=o.isTopLeftCell,C=o.onCellChange,E=o.onExpandRowClick,S=o.onMouseDown,z=o.onMouseOver,I=o.onTableHeaderDragEnd,D=o.row,H=o.rowIndex,N=n.useContext(c),M=N.rows,L=N.tableRows,B=n.useState(b),T=B[0],O=B[1],A=n.useState(!1),P=A[0],W=A[1],U=j({draggedHeaderRef:g,headersRef:h,hoveredHeaderRef:m,onTableHeaderDragEnd:I}).handleDragOver,V=y(),F=Boolean(null==p?void 0:p.isEditable),X=H%2==0,G="st-cell ".concat(f>0&&p.expandable?"st-cell-depth-".concat(f):""," ").concat(k?R?"st-cell-selected-first-cell ".concat(l):"st-cell-selected ".concat(l):""," ").concat(X?"st-cell-odd-row":"st-cell-even-row"," ").concat(F?"clickable":""," ").concat("right"===p.align?"right-aligned":"");n.useEffect((function(){"object"!=typeof b&&O(b)}),[b]),n.useEffect((function(){}),[p.accessor,T,M,null===(a=D.rowMeta)||void 0===a?void 0:a.rowId,L]);return P?e.jsx("div",r({className:"st-cell-editing ".concat(X?"st-cell-odd-row":"st-cell-even-row"),id:v({accessor:p.accessor,rowIndex:H+1})},{children:e.jsx(x,{onChange:function(e){var n;O(e),null==C||C({accessor:p.accessor,newValue:e,newRowIndex:H,originalRowIndex:null===(n=D.rowMeta)||void 0===n?void 0:n.rowId,row:D})},setIsEditing:W,value:T})})):e.jsxs("div",r({className:G,id:v({accessor:p.accessor,rowIndex:H+1}),onDoubleClick:function(){return p.isEditable&&W(!0)},onMouseDown:function(){return S(H,u)},onMouseOver:function(){return z(H,u)},onDragOver:function(e){return V({callback:U,callbackProps:{event:e,hoveredHeader:p},limit:50})},ref:t},{children:[p.expandable&&d?w(D.rowMeta.rowId)?e.jsx("div",r({className:"st-sort-icon-container",onClick:function(){return E(D.rowMeta.rowId)}},{children:e.jsx(i,{className:"st-sort-icon"})})):e.jsx("div",r({className:"st-sort-icon-container",onClick:function(){return E(D.rowMeta.rowId)}},{children:e.jsx(s,{className:"st-sort-icon"})})):null,e.jsx("span",{children:T})]}))})),S=n.forwardRef((function(n,r){return n.visible?e.jsx("div",{className:"st-cell",ref:r}):e.jsx("div",{ref:r})})),z=function(n){var r=n.lastGroupRow;return e.jsx("div",{className:"st-row-separator ".concat(r?"st-last-group-row":"")})},I=function(n){var t=n.allowAnimations,a=n.children,l=o(n,["allowAnimations","children"]);return t?e.jsx(D,r({},l,{children:a})):e.jsx(e.Fragment,{children:a})},D=function(r){var o=r.allowHorizontalAnimate,t=void 0===o||o,a=r.children,l=r.draggedHeaderRef,s=r.headersRef,c=r.isBody,d=r.mainBodyRef,i=r.pauseAnimation,u=r.rowIndex,b=n.useRef(!1),f=n.useState({}),g=f[0],p=f[1],h=n.useRef({}),m=s.current;return n.useLayoutEffect((function(){if(m){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(v({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:m,draggedHeaderRef:l,rowIndex:u});JSON.stringify(e)!==JSON.stringify(g)&&(h.current=g,p(e))}}),[g,m,l,c,u]),n.useLayoutEffect((function(){var e=d.current,n=function(){b.current=!0},r=function(){b.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)}}),[l,d]),n.useEffect((function(){i||b.current||Object.keys(h.current).length&&m&&m.forEach((function(e){var n=document.getElementById(v({accessor:e.accessor,rowIndex:u}));if(n){var r=h.current[e.accessor],o=g[e.accessor];if(r&&o){var a=r.left-o.left,l=t?0:r.top-o.top,s=Math.abs(a),c=Math.abs(l);(s>10||c>10)&&requestAnimationFrame((function(){n.style.transform="translate(".concat(a,"px, ").concat(l,"px)"),n.style.transition="transform 0s",requestAnimationFrame((function(){n.style.transform="",n.style.transition="transform ".concat(400,"ms ease-out")}))}))}}}))}),[t,g,m,c,i,h,u]),e.jsx(e.Fragment,{children:a})},H=function(t){var a,l=t.getBorderClass,s=t.handleMouseDown,c=t.handleMouseOver,d=t.headers,i=t.hiddenColumns,u=t.isRowExpanded,b=t.isSelected,f=t.isTopLeftCell,g=t.lastGroupRow,v=t.onExpandRowClick,h=t.pinned,m=t.row,w=t.rowIndex,x=t.shouldDisplayLastColumnCell,k=o(t,["getBorderClass","handleMouseDown","handleMouseOver","headers","hiddenColumns","isRowExpanded","isSelected","isTopLeftCell","lastGroupRow","onExpandRowClick","pinned","row","rowIndex","shouldDisplayLastColumnCell"]),y=null===(a=m.rowMeta)||void 0===a?void 0:a.children;return e.jsxs(I,r({allowAnimations:k.allowAnimations,allowHorizontalAnimate:k.shouldPaginate,draggedHeaderRef:k.draggedHeaderRef,headersRef:k.headersRef,isBody:!0,mainBodyRef:k.mainBodyRef,pauseAnimation:k.isWidthDragging,rowIndex:w+1},{children:[0!==w&&e.jsx(z,{lastGroupRow:g}),d.map((function(e,o){if(!p({hiddenColumns:i,header:e,pinned:h}))return null;var t=m.rowData[e.accessor];return e.cellRenderer&&(t=e.cellRenderer(m)),n.createElement(E,r({},k,{borderClass:l(w,o),cellHasChildren:((null==y?void 0:y.length)||0)>0,colIndex:o,content:t,header:e,isRowExpanded:u,isSelected:b(w,o),isTopLeftCell:f(w,o),key:o,onExpandRowClick:v,onMouseDown:function(){return s({rowIndex:w,colIndex:o})},onMouseOver:function(){return c(w,o)},row:m,rowIndex:w}))})),e.jsx(S,{ref:n.createRef(),visible:x})]}))},N=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,g=o.row,v=((null===(a=null===(t=g.rowMeta)||void 0===t?void 0:t.children)||void 0===a?void 0:a.length)||0)>0,p=d(),h=(null===(l=g.rowMeta)||void 0===l?void 0:l.children)||[];return e.jsxs(e.Fragment,{children:[n.createElement(H,r({},f,{depth:c,lastGroupRow:u,key:i,pinned:b,row:g,rowIndex:p})),v&&f.isRowExpanded(g.rowMeta.rowId)&&h.map((function(n,r){return e.jsx(N,{depth:c+1,getNextRowIndex:d,index:r,pinned:b,props:f,row:n},r)}))]})},M=function(t){t.headerContainerRef;var a=t.isRowExpanded,l=t.onExpandRowClick,s=t.pinned,c=t.rows,d=t.sectionRef,i=t.templateColumns,u=o(t,["headerContainerRef","isRowExpanded","onExpandRowClick","pinned","rows","sectionRef","templateColumns"]),b=s?"st-table-body-pinned-".concat(s):"st-table-body-main",f=n.useRef(0);n.useEffect((function(){f.current=0}));var g=function(){return f.current++};return e.jsx("div",r({className:b,ref:d,style:{gridTemplateColumns:i}},{children:c.map((function(n,o){var t,c;return e.jsx(N,{getNextRowIndex:g,index:o,lastGroupRow:Boolean(null===(c=null===(t=n.rowMeta)||void 0===t?void 0:t.children)||void 0===c?void 0:c.length),pinned:s,props:r(r({},u),{isRowExpanded:a,onExpandRowClick:l}),row:n},o)}))}))},L=function(o){var t=o.currentRows,a=o.headerContainerRef,l=o.isRowExpanded,s=o.mainBodyRef,c=o.mainTemplateColumns,d=o.onExpandRowClick,i=o.pinnedLeftColumns,u=o.pinnedLeftRef,b=o.pinnedLeftTemplateColumns,f=o.pinnedRightColumns,g=o.pinnedRightRef,v=o.pinnedRightTemplateColumns,p=o.scrollbarHorizontalRef,h=o.scrollbarWidth,m=o.tableBodyContainerRef;return function(e){var r=e.headerContainerRef,o=e.mainSectionRef,t=e.scrollbarHorizontalRef,a=e.scrollbarWidth,l=n.useState(!1),s=l[0],c=l[1];n.useEffect((function(){var e=null==r?void 0:r.current,n=null==t?void 0:t.current;if(s&&e)return e.classList.add("st-header-scroll-padding"),null==n||n.classList.add("st-header-scroll-padding"),e.style.setProperty("--st-after-width","".concat(a,"px")),null==n||n.style.setProperty("--st-after-width","".concat(a,"px")),function(){e.classList.remove("st-header-scroll-padding"),null==n||n.classList.remove("st-header-scroll-padding")}}),[r,s,t,a]),n.useEffect((function(){var e=null==r?void 0:r.current,n=null==o?void 0:o.current;if(n&&e){var t=function(){if(n){var e=n.scrollHeight>n.clientHeight;c(e)}};t();var a=new ResizeObserver((function(){t()}));return a.observe(n),function(){n&&a.unobserve(n)}}}),[r,o])}({headerContainerRef:a,mainSectionRef:m,scrollbarHorizontalRef:p,scrollbarWidth:h}),e.jsxs("div",r({className:"st-table-body-container",ref:m},{children:[i.length>0&&e.jsx(M,r({},o,{rows:t,templateColumns:b,pinned:"left",sectionRef:u,isRowExpanded:l,onExpandRowClick:d})),e.jsx(M,r({},o,{rows:t,templateColumns:c,sectionRef:s,isRowExpanded:l,onExpandRowClick:d})),f.length>0&&e.jsx(M,r({},o,{rows:t,templateColumns:v,pinned:"right",sectionRef:g,isRowExpanded:l,onExpandRowClick:d}))]}))},B=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)}},T=n.forwardRef((function(o,t){var a,l=o.columnResizing,s=o.currentRows,c=o.draggable,d=o.draggedHeaderRef,i=o.forceUpdate,u=o.headersRef,b=o.hoveredHeaderRef,f=o.index,g=o.onSort,p=o.onTableHeaderDragEnd,h=o.reverse,m=o.selectableColumns,w=o.setIsWidthDragging,x=o.setSelectedCells,k=o.sort,R=o.sortDownIcon,C=o.sortUpIcon,E=n.useState(!1),S=E[0],z=E[1],I=null===(a=u.current)||void 0===a?void 0:a[f],D=Boolean(null==I?void 0:I.isSortable),H="st-header-cell ".concat(I===b.current?"st-hovered":""," ").concat(S?"st-dragging":""," ").concat(D?"clickable":""," ").concat(c&&!D?"draggable":""," ").concat("right"===(null==I?void 0:I.align)?"right-aligned":""),N=j({draggedHeaderRef:d,headersRef:u,hoveredHeaderRef:b,onTableHeaderDragEnd:p}),M=N.handleDragStart,L=N.handleDragEnd,T=j({draggedHeaderRef:d,headersRef:u,hoveredHeaderRef:b,onTableHeaderDragEnd:p}).handleDragOver,O=y(),A=function(e){var n=e.event,r=e.header;if(m){var o=s.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&&g(f,r.accessor)};if(n.useEffect((function(){var e=function(e){e.preventDefault(),e.dataTransfer.dropEffect="move"};return document.addEventListener("dragover",e),function(){document.removeEventListener("dragover",e)}}),[]),!I)return null;var P=l&&e.jsx("div",{className:"st-header-resize-handle",onMouseDown:function(e){O({callback:B,callbackProps:{event:e,forceUpdate:i,header:I,headersRef:u,index:f,setIsWidthDragging:w},limit:10})}});return e.jsxs("div",r({className:H,id:v({accessor:I.accessor,rowIndex:0}),onDragOver:function(e){O({callback:T,callbackProps:{event:e,hoveredHeader:I},limit:50})},ref:t,style:{width:I.width}},{children:[h&&P,e.jsx("div",r({className:"st-header-label",draggable:c,onClick:function(e){return A({event:e,header:I})},onDragEnd:function(e){e.preventDefault(),z(!1),L()},onDragStart:function(e){c&&I&&function(e){z(!0),M(e)}(I)},onMouseEnter:function(){return document.body.style.overflow="hidden"},onMouseLeave:function(){return document.body.style.overflow="auto"}},{children:null==I?void 0:I.label})),k&&k.key.accessor===I.accessor&&e.jsxs("div",r({className:"st-sort-icon-container",onClick:function(e){return A({event:e,header:I})}},{children:["ascending"===k.direction&&C&&C,"descending"===k.direction&&R&&R]})),!h&&P]}))})),O=function(e,r){n.useEffect((function(){if(e.current){var n=e.current,o=function(){var e,o=null==n?void 0:n.scrollLeft;void 0!==o&&(null===(e=r.current)||void 0===e||e.scrollTo(o,0))};return n.addEventListener("scroll",o),function(){null==n||n.removeEventListener("scroll",o)}}}),[e,r])},A=function(o){var t,a,l,s=o.allowAnimations,c=o.columnResizing,d=o.currentRows,i=o.draggable,u=o.draggedHeaderRef,b=o.forceUpdate,f=o.headerContainerRef,g=o.headersRef,v=o.hiddenColumns,h=o.hoveredHeaderRef,m=o.isWidthDragging,w=o.mainTemplateColumns,x=o.onSort,k=o.onTableHeaderDragEnd,y=o.pinnedLeftColumns,R=o.pinnedLeftTemplateColumns,C=o.pinnedRightColumns,j=o.pinnedRightTemplateColumns,E=o.selectableColumns,z=o.setIsWidthDragging,D=o.setSelectedCells,H=o.shouldDisplayLastColumnCell,N=o.sort,M=o.sortDownIcon,L=o.sortUpIcon,B=o.mainBodyRef,A=n.useRef(null);O(B,A);return e.jsxs("div",r({className:"st-header-container",ref:f},{children:[y.length>0&&e.jsx("div",r({className:"st-header-pinned-left",style:{gridTemplateColumns:R}},{children:e.jsx(I,r({allowAnimations:s,draggedHeaderRef:u,headersRef:g,mainBodyRef:B,pauseAnimation:m,rowIndex:0},{children:null===(t=g.current)||void 0===t?void 0:t.map((function(r,o){return p({hiddenColumns:v,header:r,pinned:"left"})?e.jsx(T,{columnResizing:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:b,headersRef:g,hoveredHeaderRef:h,index:o,onSort:x,onTableHeaderDragEnd:k,ref:n.createRef(),selectableColumns:E,setIsWidthDragging:z,setSelectedCells:D,sort:N,sortDownIcon:M,sortUpIcon:L},r.accessor):null}))}))})),e.jsx("div",r({className:"st-header-main",onScroll:function(e){var n,r,o=null===(n=A.current)||void 0===n?void 0:n.scrollLeft;void 0!==o&&(null===(r=B.current)||void 0===r||r.scrollTo(o,0))},ref:A,style:{gridTemplateColumns:w}},{children:e.jsxs(I,r({allowAnimations:s,draggedHeaderRef:u,headersRef:g,mainBodyRef:B,pauseAnimation:m,rowIndex:0},{children:[null===(a=g.current)||void 0===a?void 0:a.map((function(r,o){return p({hiddenColumns:v,header:r})?e.jsx(T,{columnResizing:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:b,headersRef:g,hoveredHeaderRef:h,index:o,onSort:x,onTableHeaderDragEnd:k,ref:n.createRef(),selectableColumns:E,setIsWidthDragging:z,setSelectedCells:D,sort:N,sortDownIcon:M,sortUpIcon:L},r.accessor):null})),e.jsx(S,{ref:n.createRef(),visible:H})]}))})),C.length>0&&e.jsx("div",r({className:"st-header-pinned-right",style:{gridTemplateColumns:j}},{children:e.jsxs(I,r({allowAnimations:s,draggedHeaderRef:u,headersRef:g,mainBodyRef:B,pauseAnimation:m,rowIndex:0},{children:[null===(l=g.current)||void 0===l?void 0:l.map((function(r,o){return p({hiddenColumns:v,header:r,pinned:"right"})?e.jsx(T,{columnResizing:c,currentRows:d,draggable:i,draggedHeaderRef:u,forceUpdate:b,headersRef:g,hoveredHeaderRef:h,index:o,onSort:x,onTableHeaderDragEnd:k,reverse:!0,ref:n.createRef(),selectableColumns:E,setIsWidthDragging:z,setSelectedCells:D,sort:N,sortDownIcon:M,sortUpIcon:L},r.accessor):null})),e.jsx(S,{ref:n.createRef(),visible:H})]}))}))]}))},P=function(o){var t=o.allowAnimations,a=o.columnResizing,l=o.currentRows,s=o.draggable,c=o.draggedHeaderRef,d=o.editColumns,i=o.forceUpdate,u=o.getBorderClass,b=o.handleMouseDown,f=o.handleMouseOver,g=o.headersRef,v=o.hiddenColumns,p=o.hoveredHeaderRef,h=o.isRowExpanded,m=o.isSelected,w=o.isTopLeftCell,x=o.isWidthDragging,k=o.mainBodyRef,y=o.onCellChange,R=o.onExpandRowClick,C=o.onSort,j=o.onTableHeaderDragEnd,E=o.pinnedLeftRef,S=o.pinnedRightRef,z=o.scrollbarHorizontalRef,I=o.scrollbarWidth,D=o.selectableColumns,H=o.setIsWidthDragging,N=o.setSelectedCells,M=o.shouldPaginate,B=o.sort,T=o.sortDownIcon,O=o.sortUpIcon,P=o.tableBodyContainerRef,W=n.useRef(null),U=g.current.filter((function(e){return!e.hide&&!e.pinned})),V=n.useMemo((function(){return!!k.current&&U.reduce((function(e,n){return e+n.width}),0)<k.current.clientWidth}),[U,k]),F=g.current.filter((function(e){return"left"===e.pinned&&!0!==e.hide})),X=g.current.filter((function(e){return"right"===e.pinned&&!0!==e.hide})),G=n.useMemo((function(){return"".concat(F.map((function(e){return"".concat(e.width,"px")})).join(" "))}),[F]),J=n.useMemo((function(){return"".concat(U.filter((function(e){return!0!==v[e.accessor]})).map((function(e){return"".concat(e.width,"px")})).join(" ")," 1fr")}),[U,v]),q=n.useMemo((function(){return"".concat(X.map((function(e){return"".concat(e.width,"px")})).join(" "))}),[X]),Y={allowAnimations:t,columnResizing:a,currentRows:l,draggable:s,draggedHeaderRef:c,forceUpdate:i,headerContainerRef:W,headersRef:g,hiddenColumns:v,hoveredHeaderRef:p,isWidthDragging:x,mainBodyRef:k,mainTemplateColumns:J,onSort:C,onTableHeaderDragEnd:j,pinnedLeftColumns:F,pinnedLeftTemplateColumns:G,pinnedRightColumns:X,pinnedRightTemplateColumns:q,selectableColumns:D,setIsWidthDragging:H,setSelectedCells:N,shouldDisplayLastColumnCell:V,sort:B,sortDownIcon:T,sortUpIcon:O,tableBodyContainerRef:P},K={allowAnimations:t,currentRows:l,draggedHeaderRef:c,getBorderClass:u,handleMouseDown:b,handleMouseOver:f,headerContainerRef:W,headers:g.current,headersRef:g,hiddenColumns:v,hoveredHeaderRef:p,isRowExpanded:h,isSelected:m,isTopLeftCell:w,isWidthDragging:x,mainBodyRef:k,mainTemplateColumns:J,onCellChange:y,onExpandRowClick:R,onTableHeaderDragEnd:j,pinnedLeftColumns:F,pinnedLeftRef:E,pinnedLeftTemplateColumns:G,pinnedRightColumns:X,pinnedRightRef:S,pinnedRightTemplateColumns:q,scrollbarHorizontalRef:z,scrollbarWidth:I,shouldDisplayLastColumnCell:V,shouldPaginate:M,tableBodyContainerRef:P};return e.jsxs("div",r({className:"st-table-content",style:{width:d?"calc(100% - 27.5px)":"100%"}},{children:[e.jsx(A,r({},Y)),e.jsx(L,r({},K))]}))},W=function(e){var r=e.callback,o=e.ref,t=e.widthAttribute;n.useEffect((function(){var e=o.current;if(e){var n=function(){r(e[t]||0)};n();var a=new ResizeObserver((function(){n()}));return a.observe(e),function(){return a.disconnect()}}}),[r,o,t])},U=function(o){o.headersRef;var t=o.mainBodyRef,a=o.pinnedLeftRef,l=o.pinnedRightRef,s=o.scrollbarHorizontalRef,c=o.tableContentWidth,d=n.useState(0),i=d[0],u=d[1],b=n.useState(0),f=b[0],g=b[1],v=n.useState(0),p=v[0],h=v[1],m=n.useRef(null);return W({widthAttribute:"offsetWidth",callback:u,ref:a}),W({widthAttribute:"scrollWidth",callback:h,ref:t}),W({widthAttribute:"offsetWidth",callback:g,ref:l}),O(t,m),!t.current||t.current.scrollWidth<=t.current.clientWidth?null:e.jsx("div",r({className:"st-horizontal-scrollbar-container",ref:s},{children:e.jsxs("div",r({style:{width:c}},{children:[i>0&&e.jsx("div",{className:"st-horizontal-scrollbar-left",style:{flexShrink:0,width:i}}),p>0&&e.jsx("div",r({className:"st-horizontal-scrollbar-middle",onScroll:function(e){var n=e.target.scrollLeft;void 0!==n&&t.current&&t.current.scrollTo({left:n,behavior:"auto"})},ref:m},{children:e.jsx("div",{style:{width:p}})})),f>0&&e.jsx("div",{className:"st-horizontal-scrollbar-right",style:{flexShrink:0,minWidth:f}})]}))}))},V=function(e,r){var o=n.useState(null),a=o[0],l=o[1],s=n.useState({}),c=s[0],d=s[1],i=n.useMemo((function(){if(!a)return e;var n=function(e,n,r){var o=r?r.key:e[0],a="ascending";return r&&r.key.accessor===o.accessor&&"ascending"===r.direction&&(a="descending"),{sortedData:t([],n,!0).sort((function(e,n){var r,t,l,s,c=null!==(t=null===(r=null==e?void 0:e.rowData)||void 0===r?void 0:r[o.accessor])&&void 0!==t?t:"",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"===a?1:-1:c>d?"ascending"===a?-1:1:0})),newSortConfig:{key:o,direction:a}}}(r,e,a).sortedData;return n}),[e,a,r]);return{sort:a,setSort:l,sortedRows:i,hiddenColumns:c,setHiddenColumns:d}};!function(e){e.Left="left",e.Right="right"}(g||(g={}));var F=function(o){var t=o.allowAnimations,u=void 0!==t&&t,b=o.columnEditorPosition,v=void 0===b?g.Right:b,p=o.columnEditorText,h=void 0===p?"Columns":p,m=o.columnResizing,w=void 0!==m&&m,x=o.defaultHeaders,k=o.draggable,y=void 0!==k&&k,R=o.editColumns,C=void 0!==R&&R,j=o.editColumnsInitOpen,E=void 0!==j&&j,S=o.height,z=o.hideFooter,I=void 0!==z&&z,D=o.nextIcon,H=void 0===D?e.jsx(s,{className:"st-next-prev-icon"}):D,N=o.onCellChange,M=o.prevIcon,L=void 0===M?e.jsx(l,{className:"st-next-prev-icon"}):M,B=o.rows,T=o.rowsPerPage,O=void 0===T?10:T,A=o.selectableCells,W=void 0!==A&&A,F=o.selectableColumns,X=void 0!==F&&F,G=o.shouldPaginate,J=void 0!==G&&G,q=o.sortDownIcon,Y=void 0===q?e.jsx(i,{className:"st-sort-icon"}):q,K=o.sortUpIcon,_=void 0===K?e.jsx(d,{className:"st-sort-icon"}):K,$=o.theme,Q=void 0===$?"light":$,Z=n.useState((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}(B)})),ee=Z[0],ne=Z[1],re=n.useMemo((function(){return B.map((function(e,n){return r(r({},e),{originalRowIndex:n})}))}),[B]),oe=n.useRef(null),te=n.useRef(x),ae=n.useRef(null),le=n.useRef(null),se=n.useRef(null),ce=n.useRef(null),de=n.useRef(null),ie=n.useRef(null),ue=n.useState(!1),be=ue[0],fe=ue[1],ge=n.useState(1),ve=ge[0],pe=ge[1],he=n.useState(0),me=he[0],we=he[1],xe=n.useState(0),ke=xe[0],ye=xe[1],Re=V(re,te.current),Ce=Re.sort,je=Re.setSort,Ee=Re.sortedRows,Se=Re.hiddenColumns,ze=Re.setHiddenColumns,Ie=n.useCallback((function(e){var n=String(e);ne((function(e){var r=new Set(e);return r.has(n)?r.delete(n):r.add(n),r}))}),[]),De=n.useCallback((function(e){return ee.has(String(e))}),[ee]),He=n.useReducer((function(e){return e+1}),0)[1],Ne=function(e){var r=e.selectableCells,o=e.headers,t=e.rows,a=n.useState(new Set),l=a[0],s=a[1],c=n.useRef(!1),d=n.useRef(null),i=n.useCallback((function(){var e=Array.from(l).reduce((function(e,n){var r=n.split("-").map(Number),a=r[0],l=r[1];return e[a]||(e[a]=[]),e[a][l]=t[a][o[l].accessor],e}),{}),n=Object.values(e).map((function(e){return Object.values(e).join("\t")})).join("\n");navigator.clipboard.writeText(n)}),[l,t,o]);n.useEffect((function(){var e=function(e){(e.ctrlKey||e.metaKey)&&"c"===e.key&&i()};return document.addEventListener("keydown",e),function(){document.removeEventListener("keydown",e)}}),[i]);var u=n.useCallback((function(e,n){return l.has("".concat(e,"-").concat(n))}),[l]),b=n.useCallback((function(e,n){var r=[];return u(e-1,n)||r.push("st-selected-top-border"),u(e+1,n)||r.push("st-selected-bottom-border"),u(e,n-1)||r.push("st-selected-left-border"),u(e,n+1)||r.push("st-selected-right-border"),r.join(" ")}),[u]),f=n.useMemo((function(){var e=Math.min.apply(Math,Array.from(l).map((function(e){return parseInt(e.split("-")[0])}))),n=Math.min.apply(Math,Array.from(l).map((function(e){return parseInt(e.split("-")[1])})));return function(r,o){return r===e&&o===n}}),[l]);return{selectedCells:l,handleMouseDown:function(e){var n=e.colIndex,o=e.rowIndex;r&&(c.current=!0,d.current={row:o,col:n},s(new Set(["".concat(o,"-").concat(n)])))},handleMouseOver:function(e,n){if(r&&c.current&&d.current){for(var o=new Set,t=Math.min(d.current.row,e),a=Math.max(d.current.row,e),l=Math.min(d.current.col,n),i=Math.max(d.current.col,n),u=t;u<=a;u++)for(var b=l;b<=i;b++)o.add("".concat(u,"-").concat(b));s(o)}},handleMouseUp:function(){c.current=!1,d.current=null},isSelected:u,getBorderClass:b,isTopLeftCell:f,setSelectedCells:s}}({selectableCells:W,headers:te.current,rows:Ee}),Me=Ne.handleMouseDown,Le=Ne.handleMouseOver,Be=Ne.handleMouseUp,Te=Ne.isSelected,Oe=Ne.getBorderClass,Ae=Ne.isTopLeftCell,Pe=Ne.setSelectedCells,We=n.useMemo((function(){return J?Ee.slice((ve-1)*O,ve*O):Ee}),[ve,O,J,Ee]),Ue=n.useCallback((function(e,n){je((function(r){return(null==r?void 0:r.key.accessor)!==n?{key:te.current[e],direction:"ascending"}:"ascending"===(null==r?void 0:r.direction)?{key:te.current[e],direction:"descending"}:null}))}),[je]),Ve=n.useCallback((function(e){te.current=e,He()}),[]);return n.useEffect((function(){var e=function(e){var n=e.target;n.closest(".st-cell")||X&&(n.classList.contains("st-header-cell")||n.classList.contains("st-header-label"))||Pe(new Set)};return document.addEventListener("mousedown",e),function(){document.removeEventListener("mousedown",e)}}),[X,Pe]),n.useLayoutEffect((function(){if(ie.current){var e=ie.current.offsetWidth-ie.current.clientWidth,n=ie.current.clientWidth;we(e),ye(n)}}),[]),e.jsx(c.Provider,r({value:{rows:B,tableRows:re}},{children:e.jsxs("div",r({className:"st-wrapper theme-".concat(Q),style:S?{height:S}:{}},{children:[e.jsxs("div",r({className:"st-table-wrapper-container"},{children:[e.jsxs("div",r({className:"st-table-wrapper",onMouseUp:Be,onMouseLeave:Be},{children:[e.jsx(P,{allowAnimations:u,columnResizing:w,currentRows:We,draggable:y,draggedHeaderRef:oe,editColumns:C,forceUpdate:He,getBorderClass:Oe,handleMouseDown:Me,handleMouseOver:Le,headers:te.current,headersRef:te,hiddenColumns:Se,hoveredHeaderRef:ae,isRowExpanded:De,isSelected:Te,isTopLeftCell:Ae,isWidthDragging:be,mainBodyRef:le,onCellChange:N,onExpandRowClick:Ie,onSort:Ue,onTableHeaderDragEnd:Ve,pinnedLeftRef:se,pinnedRightRef:ce,scrollbarHorizontalRef:de,scrollbarWidth:me,selectableColumns:X,setIsWidthDragging:fe,setSelectedCells:Pe,shouldPaginate:J,sort:Ce,sortDownIcon:Y,sortUpIcon:_,tableBodyContainerRef:ie}),e.jsx(f,{columnEditorText:h,editColumns:C,editColumnsInitOpen:E,headers:te.current,hiddenColumns:Se,position:v,setHiddenColumns:ze})]})),e.jsx(U,{headersRef:te,mainBodyRef:le,pinnedLeftRef:se,pinnedRightRef:ce,scrollbarHorizontalRef:de,tableContentWidth:ke})]})),e.jsx(a,{currentPage:ve,hideFooter:I,nextIcon:H,onPageChange:pe,prevIcon:L,rowsPerPage:O,shouldPaginate:J,totalRows:Ee.length})]}))}))};F.defaultProps={allowAnimations:!1,columnEditorPosition:g.Right,columnEditorText:"Columns",columnResizing:!1,defaultHeaders:[],draggable:!1,editColumns:!1,editColumnsInitOpen:!1,height:"",hideFooter:!1,nextIcon:e.jsx(s,{className:"st-next-prev-icon"}),onCellChange:function(){},prevIcon:e.jsx(l,{className:"st-next-prev-icon"}),rows:[],rowsPerPage:10,selectableCells:!1,selectableColumns:!1,shouldPaginate:!1,sortDownIcon:e.jsx(i,{className:"st-sort-icon"}),sortUpIcon:e.jsx(d,{className:"st-sort-icon"}),theme:"light"};var X=n.memo(F);exports.SimpleTable=X;
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../node_modules/style-inject/dist/style-inject.es.js"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n"],"names":["css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode"],"mappings":"w7HAAA,SAAqBA,EAAKC,QACX,IAARA,IAAiBA,EAAM,CAAA,GAC5B,IAAIC,EAAWD,EAAIC,SAEnB,GAAKF,GAA2B,oBAAbG,SAAnB,CAEA,IAAIC,EAAOD,SAASC,MAAQD,SAASE,qBAAqB,QAAQ,GAC9DC,EAAQH,SAASI,cAAc,SACnCD,EAAME,KAAO,WAEI,QAAbN,GACEE,EAAKK,WACPL,EAAKM,aAAaJ,EAAOF,EAAKK,YAKhCL,EAAKO,YAAYL,GAGfA,EAAMM,WACRN,EAAMM,WAAWC,QAAUb,EAE3BM,EAAMK,YAAYR,SAASW,eAAed,GAnBY,CAqB1D"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { ReactNode } from "react";
|
|
2
|
+
import Row from "./Row";
|
|
2
3
|
type HeaderObject = {
|
|
3
4
|
accessor: string;
|
|
4
5
|
align?: "left" | "center" | "right";
|
|
5
|
-
cellRenderer?: (row:
|
|
6
|
-
[key: string]: any;
|
|
7
|
-
}) => ReactNode;
|
|
6
|
+
cellRenderer?: (row: Row) => ReactNode;
|
|
8
7
|
expandable?: boolean;
|
|
9
8
|
hide?: boolean;
|
|
10
9
|
isEditable?: boolean;
|
|
@@ -8,6 +8,7 @@ interface SharedTableProps {
|
|
|
8
8
|
hiddenColumns: Record<string, boolean>;
|
|
9
9
|
hoveredHeaderRef: RefObject<HeaderObject | null>;
|
|
10
10
|
isWidthDragging: boolean;
|
|
11
|
+
mainBodyRef: RefObject<HTMLDivElement | null>;
|
|
11
12
|
mainTemplateColumns: string;
|
|
12
13
|
onTableHeaderDragEnd: (newHeaders: HeaderObject[]) => void;
|
|
13
14
|
pinnedLeftColumns: HeaderObject[];
|
|
@@ -15,6 +16,6 @@ interface SharedTableProps {
|
|
|
15
16
|
pinnedRightColumns: HeaderObject[];
|
|
16
17
|
pinnedRightTemplateColumns: string;
|
|
17
18
|
shouldDisplayLastColumnCell: boolean;
|
|
18
|
-
|
|
19
|
+
tableBodyContainerRef: RefObject<HTMLDivElement | null>;
|
|
19
20
|
}
|
|
20
21
|
export default SharedTableProps;
|
|
@@ -17,6 +17,8 @@ interface TableBodyProps extends SharedTableProps {
|
|
|
17
17
|
onExpandRowClick: (rowIndex: number) => void;
|
|
18
18
|
pinnedLeftRef: RefObject<HTMLDivElement | null>;
|
|
19
19
|
pinnedRightRef: RefObject<HTMLDivElement | null>;
|
|
20
|
+
scrollbarHorizontalRef: RefObject<HTMLDivElement | null>;
|
|
21
|
+
scrollbarWidth: number;
|
|
20
22
|
shouldPaginate: boolean;
|
|
21
23
|
}
|
|
22
24
|
export default TableBodyProps;
|
package/package.json
CHANGED
|
@@ -1,9 +1,16 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "simple-table-core",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.8",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"module": "dist/index.es.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
|
+
"exports": {
|
|
8
|
+
".": {
|
|
9
|
+
"import": "./dist/index.es.js",
|
|
10
|
+
"require": "./dist/index.js",
|
|
11
|
+
"types": "./dist/index.d.ts"
|
|
12
|
+
}
|
|
13
|
+
},
|
|
7
14
|
"license": "MIT",
|
|
8
15
|
"files": [
|
|
9
16
|
"dist"
|
|
@@ -20,11 +27,14 @@
|
|
|
20
27
|
"spreadsheet",
|
|
21
28
|
"spreadsheet-react"
|
|
22
29
|
],
|
|
30
|
+
"peerDependencies": {
|
|
31
|
+
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
32
|
+
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
|
|
33
|
+
},
|
|
23
34
|
"dependencies": {
|
|
24
35
|
"@storybook/addon-a11y": "^8.6.2",
|
|
25
36
|
"@storybook/addon-controls": "^8.6.2",
|
|
26
|
-
"@storybook/addon-docs": "^8.6.2"
|
|
27
|
-
"react": "^19.0.0"
|
|
37
|
+
"@storybook/addon-docs": "^8.6.2"
|
|
28
38
|
},
|
|
29
39
|
"devDependencies": {
|
|
30
40
|
"@babel/preset-react": "^7.25.7",
|