@atom-learning/components 6.4.2 → 6.5.0

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

@@ -1,2 +1,117 @@
-import{v4 as W}from"@lukeed/uuid";import{useReactTable as j,getCoreRowModel as q,getPaginationRowModel as H,getSortedRowModel as K,getFilteredRowModel as Q,getExpandedRowModel as X}from"@tanstack/react-table";import*as e from"react";import Y from"use-deep-compare-effect";import{AsyncDataState as i}from"./DataTable.types.js";import{getNewAsyncData as Z}from"./getNewAsyncData.js";import{usePagination as _}from"./usePagination.js";import{useSortByColumn as $}from"./useSorting.js";const M=e.createContext(null),ee=({columns:l,data:n=[],getAsyncData:t,defaultSort:T,initialState:g=void 0,disabledRows:x,enableRowSelection:u,onRowSelectionChange:h,children:F})=>{const C=e.useRef(W()),[d,c]=e.useState({results:n??[],total:(n==null?void 0:n.length)??0}),[P,I]=e.useState({}),[N,A]=e.useState({}),[L,G]=e.useState({top:null,bottom:null,offsetTop:0,isVisible:!0}),{isPaginated:s,applyPagination:D,paginationState:a,setPaginationState:z}=_(g==null?void 0:g.pagination),[y,S]=e.useState(i.NONE),[b,k]=e.useState(""),{setIsSortable:B,isSortable:w,sorting:r,setSorting:J}=$(T),m=e.useCallback(async o=>{if(t)try{S(i.PENDING);const R=await Z(t,o,a,r,b);c(R),S(i.FULFILLED)}catch{S(i.REJECTED)}},[t,a==null?void 0:a.pageIndex,a==null?void 0:a.pageSize,r,b]);e.useEffect(()=>{m({})},[m]),Y(()=>{n&&c({results:n,total:n.length})},[n]);const p=()=>d.total,E=j({columns:l,data:d.results,pageCount:t&&a?Math.ceil(p()/a.pageSize):-1,initialState:g,state:{sorting:r,globalFilter:b,pagination:a,rowSelection:P,expanded:N},manualPagination:t&&s,manualSorting:t&&s,enableSorting:y!==i.PENDING,enableGlobalFilter:!t,enableRowSelection:u,onExpandedChange:A,getSubRows:o=>o.subRows,onRowSelectionChange:o=>{h&&h(o),I(o)},getCoreRowModel:q(),getPaginationRowModel:s?H():void 0,getSortedRowModel:w||r.length?K():void 0,getFilteredRowModel:Q(),getExpandedRowModel:X(),onPaginationChange:s?z:void 0,onSortingChange:J,onGlobalFilterChange:k,globalFilterFn:(o,R,V)=>{const v=U=>U.toLowerCase().includes(V.toLowerCase());if(o.depth>0)return!0;const f=o.getValue(R);switch(typeof f){case"string":return v(f);case"boolean":case"number":return v(String(f));default:return!1}}}),O=e.useMemo(()=>({...E,columns:l,data:d,setData:c,setIsSortable:B,applyPagination:D,getTotalRows:p,isSortable:w,asyncDataState:y,runAsyncData:m,hasAsyncData:!!t,disabledRows:x,enableRowSelection:u,rowSelection:P,tablePosition:L,setTablePosition:G,tableId:C.current}),[E,D,p,w,u,C,t]);return e.createElement(M.Provider,{value:O},F)},te=()=>{const l=e.useContext(M);if(!l)throw new Error("useDataTable can only be called from inside a DataTableProvider");return l};export{ee as DataTableProvider,te as useDataTable};
-//# sourceMappingURL=DataTableContext.js.map
+import { AsyncDataState as e } from "./DataTable.types.js";
+import { getNewAsyncData as t } from "./getNewAsyncData.js";
+import { usePagination as n } from "./usePagination.js";
+import { useSortByColumn as r } from "./useSorting.js";
+import * as i from "react";
+import { v4 as a } from "@lukeed/uuid";
+import { getCoreRowModel as o, getExpandedRowModel as s, getFilteredRowModel as c, getPaginationRowModel as l, getSortedRowModel as u, useReactTable as d } from "@tanstack/react-table";
+import f from "use-deep-compare-effect";
+//#region src/components/data-table/DataTableContext.tsx
+var p = i.createContext(null), m = ({ columns: m, data: h = [], getAsyncData: g, defaultSort: _, initialState: v = void 0, disabledRows: y, enableRowSelection: b, onRowSelectionChange: x, children: S }) => {
+	let C = i.useRef(a()), [w, T] = i.useState({
+		results: h ?? [],
+		total: h?.length ?? 0
+	}), [E, D] = i.useState({}), [O, k] = i.useState({}), [A, j] = i.useState({
+		top: null,
+		bottom: null,
+		offsetTop: 0,
+		isVisible: !0
+	}), { isPaginated: M, applyPagination: N, paginationState: P, setPaginationState: F } = n(v?.pagination), [I, L] = i.useState(e.NONE), [R, z] = i.useState(""), { setIsSortable: B, isSortable: V, sorting: H, setSorting: U } = r(_), W = i.useCallback(async (n) => {
+		if (g) try {
+			L(e.PENDING), T(await t(g, n, P, H, R)), L(e.FULFILLED);
+		} catch {
+			L(e.REJECTED);
+		}
+	}, [
+		g,
+		P?.pageIndex,
+		P?.pageSize,
+		H,
+		R
+	]);
+	i.useEffect(() => {
+		W({});
+	}, [W]), f(() => {
+		h && T({
+			results: h,
+			total: h.length
+		});
+	}, [h]);
+	let G = () => w.total, K = d({
+		columns: m,
+		data: w.results,
+		pageCount: g && P ? Math.ceil(G() / P.pageSize) : -1,
+		initialState: v,
+		state: {
+			sorting: H,
+			globalFilter: R,
+			pagination: P,
+			rowSelection: E,
+			expanded: O
+		},
+		manualPagination: g && M,
+		manualSorting: g && M,
+		enableSorting: I !== e.PENDING,
+		enableGlobalFilter: !g,
+		enableRowSelection: b,
+		onExpandedChange: k,
+		getSubRows: (e) => e.subRows,
+		onRowSelectionChange: (e) => {
+			x && x(e), D(e);
+		},
+		getCoreRowModel: o(),
+		getPaginationRowModel: M ? l() : void 0,
+		getSortedRowModel: V || H.length ? u() : void 0,
+		getFilteredRowModel: c(),
+		getExpandedRowModel: s(),
+		onPaginationChange: M ? F : void 0,
+		onSortingChange: U,
+		onGlobalFilterChange: z,
+		globalFilterFn: (e, t, n) => {
+			let r = (e) => e.toLowerCase().includes(n.toLowerCase());
+			if (e.depth > 0) return !0;
+			let i = e.getValue(t);
+			switch (typeof i) {
+				case "string": return r(i);
+				case "boolean":
+				case "number": return r(String(i));
+				default: return !1;
+			}
+		}
+	}), q = i.useMemo(() => ({
+		...K,
+		columns: m,
+		data: w,
+		setData: T,
+		setIsSortable: B,
+		applyPagination: N,
+		getTotalRows: G,
+		isSortable: V,
+		asyncDataState: I,
+		runAsyncData: W,
+		hasAsyncData: !!g,
+		disabledRows: y,
+		enableRowSelection: b,
+		rowSelection: E,
+		tablePosition: A,
+		setTablePosition: j,
+		tableId: C.current
+	}), [
+		K,
+		N,
+		G,
+		V,
+		b,
+		C,
+		g
+	]);
+	return /* @__PURE__ */ i.createElement(p.Provider, { value: q }, S);
+}, h = () => {
+	let e = i.useContext(p);
+	if (!e) throw Error("useDataTable can only be called from inside a DataTableProvider");
+	return e;
+};
+//#endregion
+export { m as DataTableProvider, h as useDataTable };
+
+//# sourceMappingURL=DataTableContext.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableContext.js","sources":["../../../src/components/data-table/DataTableContext.tsx"],"sourcesContent":["import { v4 as uuid } from '@lukeed/uuid'\nimport type {\n  ExpandedState,\n  OnChangeFn,\n  PaginationState,\n  Row,\n  RowSelectionState\n} from '@tanstack/react-table'\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table'\nimport * as React from 'react'\nimport useDeepCompareEffect from 'use-deep-compare-effect'\n\nimport {\n  AsyncDataState,\n  DataTableContextType,\n  InitialState,\n  TableData,\n  TablePosition,\n  TAsyncDataOptions,\n  TAsyncDataResult,\n  TDefaultSort,\n  TGetAsyncData\n} from './DataTable.types'\nimport { getNewAsyncData } from './getNewAsyncData'\nimport { usePagination } from './usePagination'\nimport { useSortByColumn } from './useSorting'\n\nconst DataTableContext =\n  React.createContext<DataTableContextType<unknown> | null>(null)\n\ntype DataTableProviderProps = {\n  columns\n  defaultSort?: TDefaultSort\n  children: React.ReactNode\n  initialState?: InitialState\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  onRowSelectionChange?: OnChangeFn<RowSelectionState>\n} & (\n  | { data: TableData; getAsyncData?: never }\n  | { data?: never; getAsyncData: TGetAsyncData }\n)\n\nexport const DataTableProvider = ({\n  columns,\n  data: dataProp = [],\n  getAsyncData,\n  defaultSort,\n  initialState = undefined,\n  disabledRows,\n  enableRowSelection,\n  onRowSelectionChange,\n  children\n}: DataTableProviderProps): JSX.Element => {\n  const tableId = React.useRef(uuid())\n\n  const [data, setData] = React.useState<TAsyncDataResult>({\n    results: dataProp ?? [],\n    total: dataProp?.length ?? 0\n  })\n\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({})\n  const [expanded, setExpanded] = React.useState<ExpandedState>({})\n\n  const [tablePosition, setTablePosition] = React.useState<TablePosition>({\n    top: null,\n    bottom: null,\n    offsetTop: 0,\n    isVisible: true\n  })\n\n  const { isPaginated, applyPagination, paginationState, setPaginationState } =\n    usePagination(initialState?.pagination)\n\n  const [asyncDataState, setAsyncDataState] = React.useState<AsyncDataState>(\n    AsyncDataState.NONE\n  )\n\n  const [globalFilter, setGlobalFilter] = React.useState<string>('')\n\n  const { setIsSortable, isSortable, sorting, setSorting } =\n    useSortByColumn(defaultSort)\n\n  const runAsyncData = React.useCallback(\n    async (overrideAsyncDataOptions: Partial<TAsyncDataOptions>) => {\n      if (!getAsyncData) return\n\n      try {\n        setAsyncDataState(AsyncDataState.PENDING)\n\n        const newData = await getNewAsyncData(\n          getAsyncData,\n          overrideAsyncDataOptions,\n          paginationState as PaginationState,\n          sorting,\n          globalFilter\n        )\n\n        setData(newData as TAsyncDataResult)\n        setAsyncDataState(AsyncDataState.FULFILLED)\n      } catch (_error) {\n        setAsyncDataState(AsyncDataState.REJECTED)\n      }\n    },\n    [\n      getAsyncData,\n      paginationState?.pageIndex,\n      paginationState?.pageSize,\n      sorting,\n      globalFilter\n    ]\n  )\n\n  React.useEffect(() => {\n    runAsyncData({})\n  }, [runAsyncData])\n\n  useDeepCompareEffect(() => {\n    if (!dataProp) return\n\n    setData({ results: dataProp, total: dataProp.length })\n  }, [dataProp])\n\n  const getTotalRows = () => data.total\n\n  const table = useReactTable<unknown>({\n    columns,\n    data: data.results,\n    pageCount:\n      getAsyncData && paginationState\n        ? Math.ceil(getTotalRows() / paginationState.pageSize)\n        : -1,\n    initialState: initialState,\n    state: {\n      sorting,\n      globalFilter,\n      pagination: paginationState,\n      rowSelection,\n      expanded\n    },\n    manualPagination: getAsyncData && isPaginated,\n    manualSorting: getAsyncData && isPaginated,\n    enableSorting: asyncDataState !== AsyncDataState.PENDING,\n    enableGlobalFilter: !getAsyncData,\n    enableRowSelection,\n    onExpandedChange: setExpanded,\n    getSubRows: (row: Row<unknown>) => row.subRows,\n    onRowSelectionChange: (updaterOrValue) => {\n      if (onRowSelectionChange) onRowSelectionChange(updaterOrValue)\n      setRowSelection(updaterOrValue)\n    },\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: isPaginated ? getPaginationRowModel() : undefined,\n    getSortedRowModel:\n      isSortable || sorting.length ? getSortedRowModel() : undefined,\n    getFilteredRowModel: getFilteredRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    onPaginationChange: isPaginated ? setPaginationState : undefined,\n    onSortingChange: setSorting,\n    onGlobalFilterChange: setGlobalFilter,\n    globalFilterFn: (row, columnId, filterValue) => {\n      const checkFilterMatchesCell = (cellValue: string) =>\n        cellValue.toLowerCase().includes(filterValue.toLowerCase())\n\n      const isSubRow = row.depth > 0\n\n      if (isSubRow) return true\n\n      const value = row.getValue(columnId)\n      switch (typeof value) {\n        case 'string':\n          return checkFilterMatchesCell(value)\n        case 'boolean':\n        case 'number':\n          return checkFilterMatchesCell(String(value))\n        default:\n          return false\n      }\n    }\n  })\n\n  const value: DataTableContextType = React.useMemo(() => {\n    return {\n      ...table,\n      columns,\n      data,\n      setData,\n      setIsSortable,\n      applyPagination,\n      getTotalRows,\n      isSortable,\n      asyncDataState,\n      runAsyncData,\n      hasAsyncData: !!getAsyncData,\n      disabledRows,\n      enableRowSelection,\n      rowSelection,\n      tablePosition,\n      setTablePosition,\n      tableId: tableId.current\n    }\n  }, [\n    table,\n    applyPagination,\n    getTotalRows,\n    isSortable,\n    enableRowSelection,\n    tableId,\n    getAsyncData\n  ])\n\n  return (\n    <DataTableContext.Provider value={value}>\n      {children}\n    </DataTableContext.Provider>\n  )\n}\n\nexport const useDataTable = <T extends Record<string, unknown>>() => {\n  const context = React.useContext(DataTableContext) as DataTableContextType<T>\n\n  if (!context)\n    throw new Error(\n      'useDataTable can only be called from inside a DataTableProvider'\n    )\n\n  return context\n}\n"],"names":["DataTableContext","React","DataTableProvider","columns","dataProp","getAsyncData","defaultSort","initialState","disabledRows","enableRowSelection","onRowSelectionChange","children","tableId","uuid","data","setData","rowSelection","setRowSelection","expanded","setExpanded","tablePosition","setTablePosition","isPaginated","applyPagination","paginationState","setPaginationState","usePagination","asyncDataState","setAsyncDataState","AsyncDataState","globalFilter","setGlobalFilter","setIsSortable","isSortable","sorting","setSorting","useSortByColumn","runAsyncData","overrideAsyncDataOptions","newData","getNewAsyncData","useDeepCompareEffect","getTotalRows","table","useReactTable","row","updaterOrValue","getCoreRowModel","getPaginationRowModel","getSortedRowModel","getFilteredRowModel","getExpandedRowModel","columnId","filterValue","checkFilterMatchesCell","cellValue","value","useDataTable","context"],"mappings":"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"}
+{"version":3,"file":"DataTableContext.js","names":[],"sources":["../../../src/components/data-table/DataTableContext.tsx"],"sourcesContent":["import { v4 as uuid } from '@lukeed/uuid'\nimport type {\n  ExpandedState,\n  OnChangeFn,\n  PaginationState,\n  Row,\n  RowSelectionState\n} from '@tanstack/react-table'\nimport {\n  getCoreRowModel,\n  getExpandedRowModel,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable\n} from '@tanstack/react-table'\nimport * as React from 'react'\nimport useDeepCompareEffect from 'use-deep-compare-effect'\n\nimport {\n  AsyncDataState,\n  DataTableContextType,\n  InitialState,\n  TableData,\n  TablePosition,\n  TAsyncDataOptions,\n  TAsyncDataResult,\n  TDefaultSort,\n  TGetAsyncData\n} from './DataTable.types'\nimport { getNewAsyncData } from './getNewAsyncData'\nimport { usePagination } from './usePagination'\nimport { useSortByColumn } from './useSorting'\n\nconst DataTableContext =\n  React.createContext<DataTableContextType<unknown> | null>(null)\n\ntype DataTableProviderProps = {\n  columns\n  defaultSort?: TDefaultSort\n  children: React.ReactNode\n  initialState?: InitialState\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  onRowSelectionChange?: OnChangeFn<RowSelectionState>\n} & (\n  | { data: TableData; getAsyncData?: never }\n  | { data?: never; getAsyncData: TGetAsyncData }\n)\n\nexport const DataTableProvider = ({\n  columns,\n  data: dataProp = [],\n  getAsyncData,\n  defaultSort,\n  initialState = undefined,\n  disabledRows,\n  enableRowSelection,\n  onRowSelectionChange,\n  children\n}: DataTableProviderProps): JSX.Element => {\n  const tableId = React.useRef(uuid())\n\n  const [data, setData] = React.useState<TAsyncDataResult>({\n    results: dataProp ?? [],\n    total: dataProp?.length ?? 0\n  })\n\n  const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({})\n  const [expanded, setExpanded] = React.useState<ExpandedState>({})\n\n  const [tablePosition, setTablePosition] = React.useState<TablePosition>({\n    top: null,\n    bottom: null,\n    offsetTop: 0,\n    isVisible: true\n  })\n\n  const { isPaginated, applyPagination, paginationState, setPaginationState } =\n    usePagination(initialState?.pagination)\n\n  const [asyncDataState, setAsyncDataState] = React.useState<AsyncDataState>(\n    AsyncDataState.NONE\n  )\n\n  const [globalFilter, setGlobalFilter] = React.useState<string>('')\n\n  const { setIsSortable, isSortable, sorting, setSorting } =\n    useSortByColumn(defaultSort)\n\n  const runAsyncData = React.useCallback(\n    async (overrideAsyncDataOptions: Partial<TAsyncDataOptions>) => {\n      if (!getAsyncData) return\n\n      try {\n        setAsyncDataState(AsyncDataState.PENDING)\n\n        const newData = await getNewAsyncData(\n          getAsyncData,\n          overrideAsyncDataOptions,\n          paginationState as PaginationState,\n          sorting,\n          globalFilter\n        )\n\n        setData(newData as TAsyncDataResult)\n        setAsyncDataState(AsyncDataState.FULFILLED)\n      } catch (_error) {\n        setAsyncDataState(AsyncDataState.REJECTED)\n      }\n    },\n    [\n      getAsyncData,\n      paginationState?.pageIndex,\n      paginationState?.pageSize,\n      sorting,\n      globalFilter\n    ]\n  )\n\n  React.useEffect(() => {\n    runAsyncData({})\n  }, [runAsyncData])\n\n  useDeepCompareEffect(() => {\n    if (!dataProp) return\n\n    setData({ results: dataProp, total: dataProp.length })\n  }, [dataProp])\n\n  const getTotalRows = () => data.total\n\n  const table = useReactTable<unknown>({\n    columns,\n    data: data.results,\n    pageCount:\n      getAsyncData && paginationState\n        ? Math.ceil(getTotalRows() / paginationState.pageSize)\n        : -1,\n    initialState: initialState,\n    state: {\n      sorting,\n      globalFilter,\n      pagination: paginationState,\n      rowSelection,\n      expanded\n    },\n    manualPagination: getAsyncData && isPaginated,\n    manualSorting: getAsyncData && isPaginated,\n    enableSorting: asyncDataState !== AsyncDataState.PENDING,\n    enableGlobalFilter: !getAsyncData,\n    enableRowSelection,\n    onExpandedChange: setExpanded,\n    getSubRows: (row: Row<unknown>) => row.subRows,\n    onRowSelectionChange: (updaterOrValue) => {\n      if (onRowSelectionChange) onRowSelectionChange(updaterOrValue)\n      setRowSelection(updaterOrValue)\n    },\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: isPaginated ? getPaginationRowModel() : undefined,\n    getSortedRowModel:\n      isSortable || sorting.length ? getSortedRowModel() : undefined,\n    getFilteredRowModel: getFilteredRowModel(),\n    getExpandedRowModel: getExpandedRowModel(),\n    onPaginationChange: isPaginated ? setPaginationState : undefined,\n    onSortingChange: setSorting,\n    onGlobalFilterChange: setGlobalFilter,\n    globalFilterFn: (row, columnId, filterValue) => {\n      const checkFilterMatchesCell = (cellValue: string) =>\n        cellValue.toLowerCase().includes(filterValue.toLowerCase())\n\n      const isSubRow = row.depth > 0\n\n      if (isSubRow) return true\n\n      const value = row.getValue(columnId)\n      switch (typeof value) {\n        case 'string':\n          return checkFilterMatchesCell(value)\n        case 'boolean':\n        case 'number':\n          return checkFilterMatchesCell(String(value))\n        default:\n          return false\n      }\n    }\n  })\n\n  const value: DataTableContextType = React.useMemo(() => {\n    return {\n      ...table,\n      columns,\n      data,\n      setData,\n      setIsSortable,\n      applyPagination,\n      getTotalRows,\n      isSortable,\n      asyncDataState,\n      runAsyncData,\n      hasAsyncData: !!getAsyncData,\n      disabledRows,\n      enableRowSelection,\n      rowSelection,\n      tablePosition,\n      setTablePosition,\n      tableId: tableId.current\n    }\n  }, [\n    table,\n    applyPagination,\n    getTotalRows,\n    isSortable,\n    enableRowSelection,\n    tableId,\n    getAsyncData\n  ])\n\n  return (\n    <DataTableContext.Provider value={value}>\n      {children}\n    </DataTableContext.Provider>\n  )\n}\n\nexport const useDataTable = <T extends Record<string, unknown>>() => {\n  const context = React.useContext(DataTableContext) as DataTableContextType<T>\n\n  if (!context)\n    throw new Error(\n      'useDataTable can only be called from inside a DataTableProvider'\n    )\n\n  return context\n}\n"],"mappings":"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"}

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

@@ -1,2 +1,9 @@
-import{flexRender as l}from"@tanstack/react-table";import*as t from"react";import{Table as o}from"../table/Table.js";const m=({cell:e})=>t.createElement(o.Cell,{key:e.id},l(e.column.columnDef.cell,e.getContext()));export{m as DataTableDataCell};
-//# sourceMappingURL=DataTableDataCell.js.map
+import { Table as e } from "../table/Table.js";
+import * as t from "react";
+import { flexRender as n } from "@tanstack/react-table";
+//#region src/components/data-table/DataTableDataCell.tsx
+var r = ({ cell: r }) => /* @__PURE__ */ t.createElement(e.Cell, { key: r.id }, n(r.column.columnDef.cell, r.getContext()));
+//#endregion
+export { r as DataTableDataCell };
+
+//# sourceMappingURL=DataTableDataCell.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableDataCell.js","sources":["../../../src/components/data-table/DataTableDataCell.tsx"],"sourcesContent":["import type { Cell } from '@tanstack/react-table'\nimport { flexRender } from '@tanstack/react-table'\nimport * as React from 'react'\n\nimport { Table } from '../table/Table'\n\ntype DataTableDataCellProps = {\n  cell: Cell<Record<string, unknown>, unknown>\n}\n\nexport const DataTableDataCell = ({ cell }: DataTableDataCellProps) => {\n  return (\n    <Table.Cell key={cell.id}>\n      {flexRender(cell.column.columnDef.cell, cell.getContext())}\n    </Table.Cell>\n  )\n}\n"],"names":["DataTableDataCell","cell","React","Table","flexRender"],"mappings":"qHAUO,MAAMA,EAAoB,CAAC,CAAE,KAAAC,CAAK,IAErCC,EAAA,cAACC,EAAM,KAAN,CAAW,IAAKF,EAAK,EAAA,EACnBG,EAAWH,EAAK,OAAO,UAAU,KAAMA,EAAK,YAAY,CAC3D"}
+{"version":3,"file":"DataTableDataCell.js","names":[],"sources":["../../../src/components/data-table/DataTableDataCell.tsx"],"sourcesContent":["import type { Cell } from '@tanstack/react-table'\nimport { flexRender } from '@tanstack/react-table'\nimport * as React from 'react'\n\nimport { Table } from '../table/Table'\n\ntype DataTableDataCellProps = {\n  cell: Cell<Record<string, unknown>, unknown>\n}\n\nexport const DataTableDataCell = ({ cell }: DataTableDataCellProps) => {\n  return (\n    <Table.Cell key={cell.id}>\n      {flexRender(cell.column.columnDef.cell, cell.getContext())}\n    </Table.Cell>\n  )\n}\n"],"mappings":";;;;AAUA,IAAa,KAAqB,EAAE,cAEhC,kBAAA,cAAC,EAAM,MAAP,EAAY,KAAK,EAAK,IAET,EADV,EAAW,EAAK,OAAO,UAAU,MAAM,EAAK,YAAY,CAAC,CAC/C"}

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

@@ -1,2 +1,13 @@
-import*as r from"react";import{EmptyState as m}from"../empty-state/EmptyState.js";import{AsyncDataState as n}from"./DataTable.types.js";import{useDataTable as l}from"./DataTableContext.js";const p=({children:t,...a})=>{const{asyncDataState:e,getTotalRows:o}=l();return e!==n.PENDING&&o()===0?r.createElement(m,{...a},t):null};export{p as DataTableEmptyState};
-//# sourceMappingURL=DataTableEmptyState.js.map
+import { AsyncDataState as e } from "./DataTable.types.js";
+import { useDataTable as t } from "./DataTableContext.js";
+import { EmptyState as n } from "../empty-state/EmptyState.js";
+import * as r from "react";
+//#region src/components/data-table/DataTableEmptyState.tsx
+var i = ({ children: i, ...a }) => {
+	let { asyncDataState: o, getTotalRows: s } = t();
+	return o !== e.PENDING && s() === 0 ? /* @__PURE__ */ r.createElement(n, a, i) : null;
+};
+//#endregion
+export { i as DataTableEmptyState };
+
+//# sourceMappingURL=DataTableEmptyState.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableEmptyState.js","sources":["../../../src/components/data-table/DataTableEmptyState.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { EmptyState } from '../empty-state/EmptyState'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\ntype DataTableEmptyStateProps = React.ComponentProps<typeof EmptyState>\n\nexport const DataTableEmptyState = ({\n  children,\n  ...rest\n}: DataTableEmptyStateProps) => {\n  const { asyncDataState, getTotalRows } = useDataTable()\n\n  const isPending = asyncDataState === AsyncDataState.PENDING\n  const isEmpty = !isPending && getTotalRows() === 0\n\n  if (!isEmpty) return null\n\n  return <EmptyState {...rest}>{children}</EmptyState>\n}\n"],"names":["DataTableEmptyState","children","rest","asyncDataState","getTotalRows","useDataTable","AsyncDataState","React","EmptyState"],"mappings":"mMAQaA,EAAsB,CAAC,CAClC,SAAAC,EACA,GAAGC,CACL,IAAgC,CAC9B,KAAM,CAAE,eAAAC,EAAgB,aAAAC,CAAa,EAAIC,EAAa,EAKtD,OAHkBF,IAAmBG,EAAe,SACtBF,EAAa,IAAM,EAI1CG,EAAA,cAACC,EAAA,CAAY,GAAGN,CAAAA,EAAOD,CAAS,EAFlB,IAGvB"}
+{"version":3,"file":"DataTableEmptyState.js","names":[],"sources":["../../../src/components/data-table/DataTableEmptyState.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { EmptyState } from '../empty-state/EmptyState'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\ntype DataTableEmptyStateProps = React.ComponentProps<typeof EmptyState>\n\nexport const DataTableEmptyState = ({\n  children,\n  ...rest\n}: DataTableEmptyStateProps) => {\n  const { asyncDataState, getTotalRows } = useDataTable()\n\n  const isPending = asyncDataState === AsyncDataState.PENDING\n  const isEmpty = !isPending && getTotalRows() === 0\n\n  if (!isEmpty) return null\n\n  return <EmptyState {...rest}>{children}</EmptyState>\n}\n"],"mappings":";;;;;AAQA,IAAa,KAAuB,EAClC,aACA,GAAG,QAC2B;CAC9B,IAAM,EAAE,mBAAgB,oBAAiB,GAAc;AAOvD,QALkB,MAAmB,EAAe,WACtB,GAAc,KAAK,IAI1C,kBAAA,cAAC,GAAe,GAAO,EAAsB,GAF/B"}

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

@@ -1,2 +1,11 @@
-import{AsyncDataState as e}from"./DataTable.types.js";import{useDataTable as n}from"./DataTableContext.js";const o=({children:a})=>{const{asyncDataState:t,runAsyncData:r}=n();return t!==e.REJECTED?null:a(r)};export{o as DataTableError};
-//# sourceMappingURL=DataTableError.js.map
+import { AsyncDataState as e } from "./DataTable.types.js";
+import { useDataTable as t } from "./DataTableContext.js";
+//#region src/components/data-table/DataTableError.tsx
+var n = ({ children: n }) => {
+	let { asyncDataState: r, runAsyncData: i } = t();
+	return r === e.REJECTED ? n(i) : null;
+};
+//#endregion
+export { n as DataTableError };
+
+//# sourceMappingURL=DataTableError.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableError.js","sources":["../../../src/components/data-table/DataTableError.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { AsyncDataState, DataTableContextType } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\nexport const DataTableError = ({\n  children\n}: {\n  children: (retry?: DataTableContextType['runAsyncData']) => React.ReactElement\n}) => {\n  const { asyncDataState, runAsyncData } = useDataTable()\n\n  if (asyncDataState !== AsyncDataState.REJECTED) return null\n\n  return children(runAsyncData)\n}\n"],"names":["DataTableError","children","asyncDataState","runAsyncData","useDataTable","AsyncDataState"],"mappings":"2GAKO,MAAMA,EAAiB,CAAC,CAC7B,SAAAC,CACF,IAEM,CACJ,KAAM,CAAE,eAAAC,EAAgB,aAAAC,CAAa,EAAIC,EAAa,EAEtD,OAAIF,IAAmBG,EAAe,SAAiB,KAEhDJ,EAASE,CAAY,CAC9B"}
+{"version":3,"file":"DataTableError.js","names":[],"sources":["../../../src/components/data-table/DataTableError.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { AsyncDataState, DataTableContextType } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\nexport const DataTableError = ({\n  children\n}: {\n  children: (retry?: DataTableContextType['runAsyncData']) => React.ReactElement\n}) => {\n  const { asyncDataState, runAsyncData } = useDataTable()\n\n  if (asyncDataState !== AsyncDataState.REJECTED) return null\n\n  return children(runAsyncData)\n}\n"],"mappings":";;;AAKA,IAAa,KAAkB,EAC7B,kBAGI;CACJ,IAAM,EAAE,mBAAgB,oBAAiB,GAAc;AAIvD,QAFI,MAAmB,EAAe,WAE/B,EAAS,EAAa,GAF0B"}

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

@@ -1,2 +1,29 @@
-import*as e from"react";import{debounce as f}from"throttle-debounce";import{OptionalVisuallyHiddenWrapper as d}from"../../utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.js";import{Label as g}from"../label/Label.js";import{SearchInput as h}from"../search-input/SearchInput.js";import{AsyncDataState as D}from"./DataTable.types.js";import{useDataTable as E}from"./DataTableContext.js";const F=({onChange:a,label:t,hideLabel:r=!1,...n})=>{const{setGlobalFilter:o,getState:m,resetPagination:i,getTotalRows:s,asyncDataState:c}=E(),{globalFilter:p}=m();if(c!==D.PENDING&&s()===0)return null;const u=f(250,l=>{const{target:{value:b}}=l;a==null||a(l),i(),o(b)});return e.createElement(e.Fragment,null,e.createElement(d,{hidden:r},e.createElement(g,{htmlFor:t,className:"mb-3"},t)),e.createElement(h,{...n,defaultValue:p,onChange:u,name:t}))};export{F as DataTableGlobalFilter};
-//# sourceMappingURL=DataTableGlobalFilter.js.map
+import { Label as e } from "../label/Label.js";
+import { AsyncDataState as t } from "./DataTable.types.js";
+import { useDataTable as n } from "./DataTableContext.js";
+import { OptionalVisuallyHiddenWrapper as r } from "../../utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper.js";
+import { SearchInput as i } from "../search-input/SearchInput.js";
+import * as a from "react";
+import { debounce as o } from "throttle-debounce";
+//#region src/components/data-table/DataTableGlobalFilter.tsx
+var s = ({ onChange: s, label: c, hideLabel: l = !1, ...u }) => {
+	let { setGlobalFilter: d, getState: f, resetPagination: p, getTotalRows: m, asyncDataState: h } = n(), { globalFilter: g } = f();
+	if (h !== t.PENDING && m() === 0) return null;
+	let _ = o(250, (e) => {
+		let { target: { value: t } } = e;
+		s?.(e), p(), d(t);
+	});
+	return /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(r, { hidden: l }, /* @__PURE__ */ a.createElement(e, {
+		htmlFor: c,
+		className: "mb-3"
+	}, c)), /* @__PURE__ */ a.createElement(i, {
+		...u,
+		defaultValue: g,
+		onChange: _,
+		name: c
+	}));
+};
+//#endregion
+export { s as DataTableGlobalFilter };
+
+//# sourceMappingURL=DataTableGlobalFilter.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableGlobalFilter.js","sources":["../../../src/components/data-table/DataTableGlobalFilter.tsx"],"sourcesContent":["import * as React from 'react'\nimport { debounce } from 'throttle-debounce'\n\nimport { OptionalVisuallyHiddenWrapper } from '../../utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper'\nimport { Label } from '../label/Label'\nimport { SearchInput } from '../search-input/SearchInput'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\ntype DataTableSearchProps = React.ComponentProps<typeof SearchInput> & {\n  label: string\n  hideLabel?: boolean\n}\nexport const DataTableGlobalFilter = ({\n  onChange,\n  label,\n  hideLabel = false,\n  ...props\n}: DataTableSearchProps) => {\n  const {\n    setGlobalFilter,\n    getState,\n    resetPagination,\n    getTotalRows,\n    asyncDataState\n  } = useDataTable()\n  const { globalFilter } = getState()\n\n  const isPending = asyncDataState === AsyncDataState.PENDING\n  const isEmpty = !isPending && getTotalRows() === 0\n\n  if (isEmpty) return null\n\n  const handleChange = debounce(250, (event) => {\n    const {\n      target: { value }\n    } = event\n\n    onChange?.(event)\n    resetPagination()\n    setGlobalFilter(value)\n  })\n\n  return (\n    <>\n      <OptionalVisuallyHiddenWrapper hidden={hideLabel}>\n        <Label htmlFor={label} className=\"mb-3\">\n          {label}\n        </Label>\n      </OptionalVisuallyHiddenWrapper>\n      <SearchInput\n        {...props}\n        defaultValue={globalFilter}\n        onChange={handleChange}\n        name={label}\n      />\n    </>\n  )\n}\n"],"names":["DataTableGlobalFilter","onChange","label","hideLabel","props","setGlobalFilter","getState","resetPagination","getTotalRows","asyncDataState","useDataTable","globalFilter","AsyncDataState","handleChange","debounce","event","value","React","OptionalVisuallyHiddenWrapper","Label","SearchInput"],"mappings":"yZAaO,MAAMA,EAAwB,CAAC,CACpC,SAAAC,EACA,MAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,IAA4B,CAC1B,KAAM,CACJ,gBAAAC,EACA,SAAAC,EACA,gBAAAC,EACA,aAAAC,EACA,eAAAC,CACF,EAAIC,EACE,EAAA,CAAE,aAAAC,CAAa,EAAIL,EAKzB,EAAA,GAHkBG,IAAmBG,EAAe,SACtBJ,EAAmB,IAAA,EAEpC,OAAO,KAEpB,MAAMK,EAAeC,EAAS,IAAMC,GAAU,CAC5C,KAAM,CACJ,OAAQ,CAAE,MAAAC,CAAM,CAClB,EAAID,EAEJd,GAAA,MAAAA,EAAWc,CAAAA,EACXR,IACAF,EAAgBW,CAAK,CACvB,CAAC,EAED,OACEC,EAAA,cAAAA,EAAA,SACEA,KAAAA,EAAA,cAACC,EAAA,CAA8B,OAAQf,CACrCc,EAAAA,EAAA,cAACE,EAAA,CAAM,QAASjB,EAAO,UAAU,MAAA,EAC9BA,CACH,CACF,EACAe,EAAA,cAACG,EAAA,CACE,GAAGhB,EACJ,aAAcO,EACd,SAAUE,EACV,KAAMX,CAAAA,CACR,CACF,CAEJ"}
+{"version":3,"file":"DataTableGlobalFilter.js","names":[],"sources":["../../../src/components/data-table/DataTableGlobalFilter.tsx"],"sourcesContent":["import * as React from 'react'\nimport { debounce } from 'throttle-debounce'\n\nimport { OptionalVisuallyHiddenWrapper } from '../../utilities/optional-visually-hidden-wrapper/OptionalVisuallyHiddenWrapper'\nimport { Label } from '../label/Label'\nimport { SearchInput } from '../search-input/SearchInput'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\ntype DataTableSearchProps = React.ComponentProps<typeof SearchInput> & {\n  label: string\n  hideLabel?: boolean\n}\nexport const DataTableGlobalFilter = ({\n  onChange,\n  label,\n  hideLabel = false,\n  ...props\n}: DataTableSearchProps) => {\n  const {\n    setGlobalFilter,\n    getState,\n    resetPagination,\n    getTotalRows,\n    asyncDataState\n  } = useDataTable()\n  const { globalFilter } = getState()\n\n  const isPending = asyncDataState === AsyncDataState.PENDING\n  const isEmpty = !isPending && getTotalRows() === 0\n\n  if (isEmpty) return null\n\n  const handleChange = debounce(250, (event) => {\n    const {\n      target: { value }\n    } = event\n\n    onChange?.(event)\n    resetPagination()\n    setGlobalFilter(value)\n  })\n\n  return (\n    <>\n      <OptionalVisuallyHiddenWrapper hidden={hideLabel}>\n        <Label htmlFor={label} className=\"mb-3\">\n          {label}\n        </Label>\n      </OptionalVisuallyHiddenWrapper>\n      <SearchInput\n        {...props}\n        defaultValue={globalFilter}\n        onChange={handleChange}\n        name={label}\n      />\n    </>\n  )\n}\n"],"mappings":";;;;;;;;AAaA,IAAa,KAAyB,EACpC,aACA,UACA,eAAY,IACZ,GAAG,QACuB;CAC1B,IAAM,EACJ,oBACA,aACA,oBACA,iBACA,sBACE,GAAc,EACZ,EAAE,oBAAiB,GAAU;AAKnC,KAHkB,MAAmB,EAAe,WACtB,GAAc,KAAK,EAEpC,QAAO;CAEpB,IAAM,IAAe,EAAS,MAAM,MAAU;EAC5C,IAAM,EACJ,QAAQ,EAAE,eACR;AAIJ,EAFA,IAAW,EAAM,EACjB,GAAiB,EACjB,EAAgB,EAAM;GACtB;AAEF,QACE,kBAAA,cAAA,EAAA,UAAA,MACE,kBAAA,cAAC,GAAD,EAA+B,QAAQ,GAIP,EAH9B,kBAAA,cAAC,GAAD;EAAO,SAAS;EAAO,WAAU;EAEzB,EADL,EACK,CACsB,EAChC,kBAAA,cAAC,GAAD;EACE,GAAI;EACJ,cAAc;EACd,UAAU;EACV,MAAM;EACN,CAAA,CACD"}

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

@@ -1,2 +1,54 @@
-import h from"clsx";import*as t from"react";import{Table as n}from"../table/Table.js";import{useDataTable as D}from"./DataTableContext.js";import{DataTableHeaderCell as N}from"./DataTableHeaderCell.js";import{DataTableSelectAllRowsCheckbox as A}from"./DataTableSelectAllRowsCheckbox.js";const F=({sortable:u=!0,theme:p="light",isSticky:s=!1,stickyOffset:a=0,showTotalInFirstColumn:y,totalSuffix:v,style:E,className:S,...T})=>{var c;const{getHeaderGroups:_,setIsSortable:f,enableRowSelection:w,getCanSomeRowsExpand:R,tablePosition:e,setTablePosition:g}=D();t.useEffect(()=>{f(u)},[u,f]);const o=t.useRef(null),i=t.useRef(null),x=t.useRef(0),[m,C]=t.useState(0),[H,d]=t.useState(!1),b=(c=o==null?void 0:o.current)==null?void 0:c.closest("thead");if(b&&(e==null?void 0:e.offsetTop)===null){const l=b.getBoundingClientRect().height,r=a+l;e&&g({...e,offsetTop:r||0})}return t.useEffect(()=>{if(s&&(!i.current&&o.current&&(i.current=o.current.closest("table")),i.current&&(e==null?void 0:e.top)!==null&&(e==null?void 0:e.bottom)!==null)){const l=(e==null?void 0:e.top)!=null&&(e==null?void 0:e.bottom)!=null&&e.top<a&&e.bottom>100?-e.top+a:0;l!==0&&d(!0),x.current=l,C(l),requestAnimationFrame(()=>{d(!1)})}},[s,a,e]),t.createElement(n.Header,{theme:p,style:{...E,"--header-offset":`${m}px`},...T,className:h("relative","z-3","[&_tr:not(:last-child)>th]:border-b-none","[&_tr:not(:first-child)>th]:rounded-none!",S)},_().map(l=>t.createElement(n.Row,{key:l.id,ref:o,className:s&&m!==0?h("translate-y-(--header-offset)",H?"delay-0ms opacity-0 transition-none":"delay-150ms opacity-100 transition-opacity duration-100","[&_th]:last:before:absolute","[&_th]:last:before:bottom-0","[&_th]:last:before:pointer-events-none","[&_th]:last:before:right-0","[&_th]:last:before:shadow-sm","[&_th]:last:before:top-0","[&_th]:last:before:w-full"):void 0},R()&&t.createElement(n.HeaderCell,{className:"w-10"}),w&&t.createElement(n.HeaderCell,{className:"w-10"},t.createElement(A,null)),l.headers.map((r,k)=>t.createElement(N,{header:r,key:r.id,includeTotal:k===0&&y,totalSuffix:v})))))};export{F as DataTableHead};
-//# sourceMappingURL=DataTableHead.js.map
+import { Table as e } from "../table/Table.js";
+import { useDataTable as t } from "./DataTableContext.js";
+import { DataTableHeaderCell as n } from "./DataTableHeaderCell.js";
+import { DataTableSelectAllRowsCheckbox as r } from "./DataTableSelectAllRowsCheckbox.js";
+import i from "clsx";
+import * as a from "react";
+//#region src/components/data-table/DataTableHead.tsx
+var o = ({ sortable: o = !0, theme: s = "light", isSticky: c = !1, stickyOffset: l = 0, showTotalInFirstColumn: u, totalSuffix: d, style: f, className: p, ...m }) => {
+	let { getHeaderGroups: h, setIsSortable: g, enableRowSelection: _, getCanSomeRowsExpand: v, tablePosition: y, setTablePosition: b } = t();
+	a.useEffect(() => {
+		g(o);
+	}, [o, g]);
+	let x = a.useRef(null), S = a.useRef(null), C = a.useRef(0), [w, T] = a.useState(0), [E, D] = a.useState(!1), O = x?.current?.closest("thead");
+	if (O && y?.offsetTop === null) {
+		let e = l + O.getBoundingClientRect().height;
+		y && b({
+			...y,
+			offsetTop: e || 0
+		});
+	}
+	return a.useEffect(() => {
+		if (c && (!S.current && x.current && (S.current = x.current.closest("table")), S.current && y?.top !== null && y?.bottom !== null)) {
+			let e = y?.top != null && y?.bottom != null && y.top < l && y.bottom > 100 ? -y.top + l : 0;
+			e !== 0 && D(!0), C.current = e, T(e), requestAnimationFrame(() => {
+				D(!1);
+			});
+		}
+	}, [
+		c,
+		l,
+		y
+	]), /* @__PURE__ */ a.createElement(e.Header, {
+		theme: s,
+		style: {
+			...f,
+			"--header-offset": `${w}px`
+		},
+		...m,
+		className: i("relative", "z-3", "[&_tr:not(:last-child)>th]:border-b-none", "[&_tr:not(:first-child)>th]:rounded-none!", p)
+	}, h().map((t) => /* @__PURE__ */ a.createElement(e.Row, {
+		key: t.id,
+		ref: x,
+		className: c && w !== 0 ? i("translate-y-(--header-offset)", E ? "delay-0ms opacity-0 transition-none" : "delay-150ms opacity-100 transition-opacity duration-100", "[&_th]:last:before:absolute", "[&_th]:last:before:bottom-0", "[&_th]:last:before:pointer-events-none", "[&_th]:last:before:right-0", "[&_th]:last:before:shadow-sm", "[&_th]:last:before:top-0", "[&_th]:last:before:w-full") : void 0
+	}, v() && /* @__PURE__ */ a.createElement(e.HeaderCell, { className: "w-10" }), _ && /* @__PURE__ */ a.createElement(e.HeaderCell, { className: "w-10" }, /* @__PURE__ */ a.createElement(r, null)), t.headers.map((e, t) => /* @__PURE__ */ a.createElement(n, {
+		header: e,
+		key: e.id,
+		includeTotal: t === 0 && u,
+		totalSuffix: d
+	})))));
+};
+//#endregion
+export { o as DataTableHead };
+
+//# sourceMappingURL=DataTableHead.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableHead.js","sources":["../../../src/components/data-table/DataTableHead.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Table } from '../table/Table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableHeaderCell } from './DataTableHeaderCell'\nimport { DataTableSelectAllRowsCheckbox } from './DataTableSelectAllRowsCheckbox'\n\ntype DataTableHeadProps = Omit<\n  React.ComponentProps<typeof Table.Header>,\n  'children'\n> & {\n  sortable?: boolean\n  isSticky?: boolean\n  stickyOffset?: number\n  showTotalInFirstColumn?: boolean\n  totalSuffix?: string\n}\n\nexport const DataTableHead = ({\n  sortable = true,\n  theme = 'light',\n  isSticky = false,\n  stickyOffset = 0,\n  showTotalInFirstColumn,\n  totalSuffix,\n  style,\n  className,\n  ...props\n}: DataTableHeadProps): React.ReactElement => {\n  const {\n    getHeaderGroups,\n    setIsSortable,\n    enableRowSelection,\n    getCanSomeRowsExpand,\n    tablePosition,\n    setTablePosition\n  } = useDataTable()\n\n  React.useEffect(() => {\n    setIsSortable(sortable)\n  }, [sortable, setIsSortable])\n\n  const tableHeaderRowRef = React.useRef<HTMLTableRowElement>(null)\n  const tableRef = React.useRef<HTMLTableElement | null>(null)\n  const headerOffsetRef = React.useRef(0)\n\n  const [headerOffset, setHeaderOffset] = React.useState<number>(0)\n  const [headerHide, setHeaderHide] = React.useState<boolean>(false)\n\n  const tableHeadElement = tableHeaderRowRef?.current?.closest('thead')\n\n  if (tableHeadElement && tablePosition?.offsetTop === null) {\n    const tableHeadHeight = tableHeadElement.getBoundingClientRect().height\n    const intersectionOffset = stickyOffset + tableHeadHeight\n    if (tablePosition) {\n      setTablePosition({ ...tablePosition, offsetTop: intersectionOffset || 0 })\n    }\n  }\n\n  React.useEffect(() => {\n    if (!isSticky) return\n\n    if (!tableRef.current && tableHeaderRowRef.current) {\n      tableRef.current = tableHeaderRowRef.current.closest(\n        'table'\n      ) as HTMLTableElement | null\n    }\n\n    if (tableRef.current) {\n      if (tablePosition?.top !== null && tablePosition?.bottom !== null) {\n        const newOffset =\n          tablePosition?.top != null &&\n          tablePosition?.bottom != null &&\n          tablePosition.top < stickyOffset &&\n          tablePosition.bottom > 100\n            ? -tablePosition.top + stickyOffset\n            : 0\n\n        if (newOffset !== 0) setHeaderHide(true)\n\n        headerOffsetRef.current = newOffset\n        setHeaderOffset(newOffset)\n\n        requestAnimationFrame(() => {\n          setHeaderHide(false)\n        })\n      }\n    }\n  }, [isSticky, stickyOffset, tablePosition])\n\n  return (\n    <Table.Header\n      theme={theme}\n      style={{\n        ...style,\n        '--header-offset': `${headerOffset}px`\n      }}\n      {...props}\n      className={clsx(\n        'relative',\n        'z-3',\n        '[&_tr:not(:last-child)>th]:border-b-none',\n        '[&_tr:not(:first-child)>th]:rounded-none!',\n        className\n      )}\n    >\n      {getHeaderGroups().map((headerGroup) => {\n        return (\n          <Table.Row\n            key={headerGroup.id}\n            ref={tableHeaderRowRef}\n            className={\n              isSticky && headerOffset !== 0\n                ? clsx(\n                    'translate-y-(--header-offset)',\n                    headerHide\n                      ? 'delay-0ms opacity-0 transition-none'\n                      : 'delay-150ms opacity-100 transition-opacity duration-100',\n                    '[&_th]:last:before:absolute',\n                    '[&_th]:last:before:bottom-0',\n                    '[&_th]:last:before:pointer-events-none',\n                    '[&_th]:last:before:right-0',\n                    '[&_th]:last:before:shadow-sm',\n                    '[&_th]:last:before:top-0',\n                    '[&_th]:last:before:w-full'\n                  )\n                : undefined\n            }\n          >\n            {getCanSomeRowsExpand() && <Table.HeaderCell className=\"w-10\" />}\n            {enableRowSelection && (\n              <Table.HeaderCell className=\"w-10\">\n                <DataTableSelectAllRowsCheckbox />\n              </Table.HeaderCell>\n            )}\n            {headerGroup.headers.map((header, index) => (\n              <DataTableHeaderCell\n                header={header}\n                key={header.id}\n                includeTotal={index === 0 && showTotalInFirstColumn}\n                totalSuffix={totalSuffix}\n              />\n            ))}\n          </Table.Row>\n        )\n      })}\n    </Table.Header>\n  )\n}\n"],"names":["DataTableHead","sortable","theme","isSticky","stickyOffset","showTotalInFirstColumn","totalSuffix","style","className","props","_a","getHeaderGroups","setIsSortable","enableRowSelection","getCanSomeRowsExpand","tablePosition","setTablePosition","useDataTable","React","tableHeaderRowRef","tableRef","headerOffsetRef","headerOffset","setHeaderOffset","headerHide","setHeaderHide","tableHeadElement","tableHeadHeight","intersectionOffset","newOffset","Table","clsx","headerGroup","DataTableSelectAllRowsCheckbox","header","index","DataTableHeaderCell"],"mappings":"qSAmBaA,EAAgB,CAAC,CAC5B,SAAAC,EAAW,GACX,MAAAC,EAAQ,QACR,SAAAC,EAAW,GACX,aAAAC,EAAe,EACf,uBAAAC,EACA,YAAAC,EACA,MAAAC,EACA,UAAAC,EACA,GAAGC,CACL,IAA8C,CA7B9C,IAAAC,EA8BE,KAAM,CACJ,gBAAAC,EACA,cAAAC,EACA,mBAAAC,EACA,qBAAAC,EACA,cAAAC,EACA,iBAAAC,CACF,EAAIC,IAEJC,EAAM,UAAU,IAAM,CACpBN,EAAcX,CAAQ,CACxB,EAAG,CAACA,EAAUW,CAAa,CAAC,EAE5B,MAAMO,EAAoBD,EAAM,OAA4B,IAAI,EAC1DE,EAAWF,EAAM,OAAgC,IAAI,EACrDG,EAAkBH,EAAM,OAAO,CAAC,EAEhC,CAACI,EAAcC,CAAe,EAAIL,EAAM,SAAiB,CAAC,EAC1D,CAACM,EAAYC,CAAa,EAAIP,EAAM,SAAkB,EAAK,EAE3DQ,GAAmBhB,EAAAS,GAAA,KAAAA,OAAAA,EAAmB,UAAnB,KAAAT,OAAAA,EAA4B,QAAQ,OAE7D,EAAA,GAAIgB,IAAoBX,GAAA,KAAA,OAAAA,EAAe,aAAc,KAAM,CACzD,MAAMY,EAAkBD,EAAiB,wBAAwB,OAC3DE,EAAqBxB,EAAeuB,EACtCZ,GACFC,EAAiB,CAAE,GAAGD,EAAe,UAAWa,GAAsB,CAAE,CAAC,CAE7E,CAEA,OAAAV,EAAM,UAAU,IAAM,CACpB,GAAKf,IAED,CAACiB,EAAS,SAAWD,EAAkB,UACzCC,EAAS,QAAUD,EAAkB,QAAQ,QAC3C,OACF,GAGEC,EAAS,UACPL,GAAA,KAAAA,OAAAA,EAAe,OAAQ,OAAQA,GAAA,KAAAA,OAAAA,EAAe,UAAW,MAAM,CACjE,MAAMc,GACJd,GAAA,KAAAA,OAAAA,EAAe,MAAO,OACtBA,GAAA,KAAAA,OAAAA,EAAe,SAAU,MACzBA,EAAc,IAAMX,GACpBW,EAAc,OAAS,IACnB,CAACA,EAAc,IAAMX,EACrB,EAEFyB,IAAc,GAAGJ,EAAc,EAAI,EAEvCJ,EAAgB,QAAUQ,EAC1BN,EAAgBM,CAAS,EAEzB,sBAAsB,IAAM,CAC1BJ,EAAc,EAAK,CACrB,CAAC,CACH,CAEJ,EAAG,CAACtB,EAAUC,EAAcW,CAAa,CAAC,EAGxCG,EAAA,cAACY,EAAM,OAAN,CACC,MAAO5B,EACP,MAAO,CACL,GAAGK,EACH,kBAAmB,GAAGe,CAAY,IACpC,EACC,GAAGb,EACJ,UAAWsB,EACT,WACA,MACA,2CACA,4CACAvB,CACF,GAECG,EAAgB,EAAE,IAAKqB,GAEpBd,EAAA,cAACY,EAAM,IAAN,CACC,IAAKE,EAAY,GACjB,IAAKb,EACL,UACEhB,GAAYmB,IAAiB,EACzBS,EACE,gCACAP,EACI,sCACA,0DACJ,8BACA,8BACA,yCACA,6BACA,+BACA,2BACA,2BACF,EACA,QAGLV,KAA0BI,EAAA,cAACY,EAAM,WAAN,CAAiB,UAAU,MAAO,CAAA,EAC7DjB,GACCK,EAAA,cAACY,EAAM,WAAN,CAAiB,UAAU,MAAA,EAC1BZ,EAAA,cAACe,EAAA,IAA+B,CAClC,EAEDD,EAAY,QAAQ,IAAI,CAACE,EAAQC,IAChCjB,EAAA,cAACkB,EAAA,CACC,OAAQF,EACR,IAAKA,EAAO,GACZ,aAAcC,IAAU,GAAK9B,EAC7B,YAAaC,CAAAA,CACf,CACD,CACH,CAEH,CACH,CAEJ"}
+{"version":3,"file":"DataTableHead.js","names":[],"sources":["../../../src/components/data-table/DataTableHead.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { Table } from '../table/Table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableHeaderCell } from './DataTableHeaderCell'\nimport { DataTableSelectAllRowsCheckbox } from './DataTableSelectAllRowsCheckbox'\n\ntype DataTableHeadProps = Omit<\n  React.ComponentProps<typeof Table.Header>,\n  'children'\n> & {\n  sortable?: boolean\n  isSticky?: boolean\n  stickyOffset?: number\n  showTotalInFirstColumn?: boolean\n  totalSuffix?: string\n}\n\nexport const DataTableHead = ({\n  sortable = true,\n  theme = 'light',\n  isSticky = false,\n  stickyOffset = 0,\n  showTotalInFirstColumn,\n  totalSuffix,\n  style,\n  className,\n  ...props\n}: DataTableHeadProps): React.ReactElement => {\n  const {\n    getHeaderGroups,\n    setIsSortable,\n    enableRowSelection,\n    getCanSomeRowsExpand,\n    tablePosition,\n    setTablePosition\n  } = useDataTable()\n\n  React.useEffect(() => {\n    setIsSortable(sortable)\n  }, [sortable, setIsSortable])\n\n  const tableHeaderRowRef = React.useRef<HTMLTableRowElement>(null)\n  const tableRef = React.useRef<HTMLTableElement | null>(null)\n  const headerOffsetRef = React.useRef(0)\n\n  const [headerOffset, setHeaderOffset] = React.useState<number>(0)\n  const [headerHide, setHeaderHide] = React.useState<boolean>(false)\n\n  const tableHeadElement = tableHeaderRowRef?.current?.closest('thead')\n\n  if (tableHeadElement && tablePosition?.offsetTop === null) {\n    const tableHeadHeight = tableHeadElement.getBoundingClientRect().height\n    const intersectionOffset = stickyOffset + tableHeadHeight\n    if (tablePosition) {\n      setTablePosition({ ...tablePosition, offsetTop: intersectionOffset || 0 })\n    }\n  }\n\n  React.useEffect(() => {\n    if (!isSticky) return\n\n    if (!tableRef.current && tableHeaderRowRef.current) {\n      tableRef.current = tableHeaderRowRef.current.closest(\n        'table'\n      ) as HTMLTableElement | null\n    }\n\n    if (tableRef.current) {\n      if (tablePosition?.top !== null && tablePosition?.bottom !== null) {\n        const newOffset =\n          tablePosition?.top != null &&\n          tablePosition?.bottom != null &&\n          tablePosition.top < stickyOffset &&\n          tablePosition.bottom > 100\n            ? -tablePosition.top + stickyOffset\n            : 0\n\n        if (newOffset !== 0) setHeaderHide(true)\n\n        headerOffsetRef.current = newOffset\n        setHeaderOffset(newOffset)\n\n        requestAnimationFrame(() => {\n          setHeaderHide(false)\n        })\n      }\n    }\n  }, [isSticky, stickyOffset, tablePosition])\n\n  return (\n    <Table.Header\n      theme={theme}\n      style={{\n        ...style,\n        '--header-offset': `${headerOffset}px`\n      }}\n      {...props}\n      className={clsx(\n        'relative',\n        'z-3',\n        '[&_tr:not(:last-child)>th]:border-b-none',\n        '[&_tr:not(:first-child)>th]:rounded-none!',\n        className\n      )}\n    >\n      {getHeaderGroups().map((headerGroup) => {\n        return (\n          <Table.Row\n            key={headerGroup.id}\n            ref={tableHeaderRowRef}\n            className={\n              isSticky && headerOffset !== 0\n                ? clsx(\n                    'translate-y-(--header-offset)',\n                    headerHide\n                      ? 'delay-0ms opacity-0 transition-none'\n                      : 'delay-150ms opacity-100 transition-opacity duration-100',\n                    '[&_th]:last:before:absolute',\n                    '[&_th]:last:before:bottom-0',\n                    '[&_th]:last:before:pointer-events-none',\n                    '[&_th]:last:before:right-0',\n                    '[&_th]:last:before:shadow-sm',\n                    '[&_th]:last:before:top-0',\n                    '[&_th]:last:before:w-full'\n                  )\n                : undefined\n            }\n          >\n            {getCanSomeRowsExpand() && <Table.HeaderCell className=\"w-10\" />}\n            {enableRowSelection && (\n              <Table.HeaderCell className=\"w-10\">\n                <DataTableSelectAllRowsCheckbox />\n              </Table.HeaderCell>\n            )}\n            {headerGroup.headers.map((header, index) => (\n              <DataTableHeaderCell\n                header={header}\n                key={header.id}\n                includeTotal={index === 0 && showTotalInFirstColumn}\n                totalSuffix={totalSuffix}\n              />\n            ))}\n          </Table.Row>\n        )\n      })}\n    </Table.Header>\n  )\n}\n"],"mappings":";;;;;;;AAmBA,IAAa,KAAiB,EAC5B,cAAW,IACX,WAAQ,SACR,cAAW,IACX,kBAAe,GACf,2BACA,gBACA,UACA,cACA,GAAG,QACyC;CAC5C,IAAM,EACJ,oBACA,kBACA,uBACA,yBACA,kBACA,wBACE,GAAc;AAElB,GAAM,gBAAgB;AACpB,IAAc,EAAS;IACtB,CAAC,GAAU,EAAc,CAAC;CAE7B,IAAM,IAAoB,EAAM,OAA4B,KAAK,EAC3D,IAAW,EAAM,OAAgC,KAAK,EACtD,IAAkB,EAAM,OAAO,EAAE,EAEjC,CAAC,GAAc,KAAmB,EAAM,SAAiB,EAAE,EAC3D,CAAC,GAAY,KAAiB,EAAM,SAAkB,GAAM,EAE5D,IAAmB,GAAmB,SAAS,QAAQ,QAAQ;AAErE,KAAI,KAAoB,GAAe,cAAc,MAAM;EAEzD,IAAM,IAAqB,IADH,EAAiB,uBAAuB,CAAC;AAEjE,EAAI,KACF,EAAiB;GAAE,GAAG;GAAe,WAAW,KAAsB;GAAG,CAAC;;AAmC9E,QA/BA,EAAM,gBAAgB;AACf,YAED,CAAC,EAAS,WAAW,EAAkB,YACzC,EAAS,UAAU,EAAkB,QAAQ,QAC3C,QACD,GAGC,EAAS,WACP,GAAe,QAAQ,QAAQ,GAAe,WAAW,OAAM;GACjE,IAAM,IACJ,GAAe,OAAO,QACtB,GAAe,UAAU,QACzB,EAAc,MAAM,KACpB,EAAc,SAAS,MACnB,CAAC,EAAc,MAAM,IACrB;AAON,GALI,MAAc,KAAG,EAAc,GAAK,EAExC,EAAgB,UAAU,GAC1B,EAAgB,EAAU,EAE1B,4BAA4B;AAC1B,MAAc,GAAM;KACpB;;IAGL;EAAC;EAAU;EAAc;EAAc,CAAC,EAGzC,kBAAA,cAAC,EAAM,QAAP;EACS;EACP,OAAO;GACL,GAAG;GACH,mBAAmB,GAAG,EAAa;GACpC;EACD,GAAI;EACJ,WAAW,EACT,YACA,OACA,4CACA,6CACA,EACD;EA0CY,EAxCZ,GAAiB,CAAC,KAAK,MAEpB,kBAAA,cAAC,EAAM,KAAP;EACE,KAAK,EAAY;EACjB,KAAK;EACL,WACE,KAAY,MAAiB,IACzB,EACE,iCACA,IACI,wCACA,2DACJ,+BACA,+BACA,0CACA,8BACA,gCACA,4BACA,4BACD,GACD,KAAA;EAiBI,EAdT,GAAsB,IAAI,kBAAA,cAAC,EAAM,YAAP,EAAkB,WAAU,QAAS,CAAA,EAC/D,KACC,kBAAA,cAAC,EAAM,YAAP,EAAkB,WAAU,QAET,EADjB,kBAAA,cAAC,GAAA,KAAiC,CACjB,EAEpB,EAAY,QAAQ,KAAK,GAAQ,MAChC,kBAAA,cAAC,GAAD;EACU;EACR,KAAK,EAAO;EACZ,cAAc,MAAU,KAAK;EAChB;EACb,CAAA,CACF,CACQ,CAEd,CACW"}

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

@@ -1,2 +1,60 @@
-import{ArrowUp as x,ArrowDown as h}from"@atom-learning/icons";import{flexRender as E}from"@tanstack/react-table";import m from"clsx";import*as t from"react";import{useHover as D}from"react-aria";import{styled as c}from"../../styled.js";import{Icon as N}from"../icon/Icon.js";import{Table as T}from"../table/Table.js";import{Text as k}from"../text/Text.js";import{useDataTable as C}from"./DataTableContext.js";const H=c(k,{base:["text-grey-600","whitespace-nowrap","hidden","min-[800px]:block"]}),z=c(T.HeaderCell,{base:[],variants:{isSortable:{true:["*:relative","before:absolute","before:bg-primary-100","before:duration-200","before:ease-in","before:inset-0","before:opacity-0","before:transition-opacity","cursor-pointer","hover:before:opacity-50","relative"]}}}),I={asc:x,desc:h},j=({direction:e})=>t.createElement(N,{is:I[e],size:"sm",className:"stroke-primary-900 absolute left-1"}),A=({header:e,includeTotal:p=!1,totalSuffix:f="items",children:K,className:d,...b})=>{var l,n;const s=e.column.getIsSorted(),{isSortable:o,getRowModel:u}=C(),a=e.column.getCanSort(),g=(n=(l=u())==null?void 0:l.rows)==null?void 0:n.length,{hoverProps:v,isHovered:y}=D({}),S=(r,w)=>{(r.key==="Enter"||r.key===" ")&&(r.preventDefault(),w(r))},i=e.column.getToggleSortingHandler();return t.createElement(z,{isSortable:o&&a,colSpan:e.colSpan,onClick:o&&a&&i?i:void 0,onKeyDown:r=>o&&a&&i&&S(r,i),tabIndex:o&&a?0:-1,...v,className:d,...b},t.createElement("div",{className:m("flex","gap-1","items-center",e.colSpan>1?"justify-center":"justify-start")},E(e.column.columnDef.header,e.getContext()),s&&o&&t.createElement("div",{className:m("flex","items-center","relative","size-6","ml-2",y?"bg-primary-200":"bg-primary-100","rounded-sm")},t.createElement(j,{direction:s})),p&&t.createElement(H,{size:"sm",weight:"normal"},"(",g," ",f,")")))};export{A as DataTableHeaderCell};
-//# sourceMappingURL=DataTableHeaderCell.js.map
+import { styled as e } from "../../styled.js";
+import { Icon as t } from "../icon/Icon.js";
+import { Text as n } from "../text/Text.js";
+import { Table as r } from "../table/Table.js";
+import { useDataTable as i } from "./DataTableContext.js";
+import a from "clsx";
+import * as o from "react";
+import { ArrowDown as s, ArrowUp as c } from "@atom-learning/icons";
+import { flexRender as l } from "@tanstack/react-table";
+import { useHover as u } from "react-aria";
+//#region src/components/data-table/DataTableHeaderCell.tsx
+var d = e(n, { base: [
+	"text-grey-600",
+	"whitespace-nowrap",
+	"hidden",
+	"min-[800px]:block"
+] }), f = e(r.HeaderCell, {
+	base: [],
+	variants: { isSortable: { true: [
+		"*:relative",
+		"before:absolute",
+		"before:bg-primary-100",
+		"before:duration-200",
+		"before:ease-in",
+		"before:inset-0",
+		"before:opacity-0",
+		"before:transition-opacity",
+		"cursor-pointer",
+		"hover:before:opacity-50",
+		"relative"
+	] } }
+}), p = {
+	asc: c,
+	desc: s
+}, m = ({ direction: e }) => /* @__PURE__ */ o.createElement(t, {
+	is: p[e],
+	size: "sm",
+	className: "stroke-primary-900 absolute left-1"
+}), h = ({ header: e, includeTotal: t = !1, totalSuffix: n = "items", children: r, className: s, ...c }) => {
+	let p = e.column.getIsSorted(), { isSortable: h, getRowModel: g } = i(), _ = e.column.getCanSort(), v = g()?.rows?.length, { hoverProps: y, isHovered: b } = u({}), x = (e, t) => {
+		(e.key === "Enter" || e.key === " ") && (e.preventDefault(), t(e));
+	}, S = e.column.getToggleSortingHandler();
+	return /* @__PURE__ */ o.createElement(f, {
+		isSortable: h && _,
+		colSpan: e.colSpan,
+		onClick: h && _ && S ? S : void 0,
+		onKeyDown: (e) => h && _ && S && x(e, S),
+		tabIndex: h && _ ? 0 : -1,
+		...y,
+		className: s,
+		...c
+	}, /* @__PURE__ */ o.createElement("div", { className: a("flex", "gap-1", "items-center", e.colSpan > 1 ? "justify-center" : "justify-start") }, l(e.column.columnDef.header, e.getContext()), p && h && /* @__PURE__ */ o.createElement("div", { className: a("flex", "items-center", "relative", "size-6", "ml-2", b ? "bg-primary-200" : "bg-primary-100", "rounded-sm") }, /* @__PURE__ */ o.createElement(m, { direction: p })), t && /* @__PURE__ */ o.createElement(d, {
+		size: "sm",
+		weight: "normal"
+	}, "(", v, " ", n, ")")));
+};
+//#endregion
+export { h as DataTableHeaderCell };
+
+//# sourceMappingURL=DataTableHeaderCell.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableHeaderCell.js","sources":["../../../src/components/data-table/DataTableHeaderCell.tsx"],"sourcesContent":["import { ArrowDown, ArrowUp } from '@atom-learning/icons'\nimport type { Header } from '@tanstack/react-table'\nimport { flexRender } from '@tanstack/react-table'\nimport clsx from 'clsx'\nimport * as React from 'react'\nimport { useHover } from 'react-aria'\n\nimport { styled } from '~/styled'\n\nimport { Icon } from '../icon/Icon'\nimport { Table } from '../table/Table'\nimport { Text } from '../text/Text'\nimport { useDataTable } from './DataTableContext'\n\ntype DataTableHeaderProps = React.ComponentProps<typeof Table.HeaderCell> & {\n  header: Header<Record<string, unknown>, unknown>\n  includeTotal?: boolean\n  totalSuffix?: string\n}\n\nconst StyledCount = styled(Text, {\n  base: ['text-grey-600', 'whitespace-nowrap', 'hidden', 'min-[800px]:block']\n})\n\nconst StyledTableHeaderCell = styled(Table.HeaderCell, {\n  base: [],\n  variants: {\n    isSortable: {\n      true: [\n        '*:relative',\n        'before:absolute',\n        'before:bg-primary-100',\n        'before:duration-200',\n        'before:ease-in',\n        'before:inset-0',\n        'before:opacity-0',\n        'before:transition-opacity',\n        'cursor-pointer',\n        'hover:before:opacity-50',\n        'relative'\n      ]\n    }\n  }\n})\n\nconst sortIcons = {\n  asc: ArrowUp,\n  desc: ArrowDown\n}\n\nconst SortIcon = ({ direction }: { direction: 'asc' | 'desc' }) => (\n  <Icon\n    is={sortIcons[direction]}\n    size=\"sm\"\n    className=\"stroke-primary-900 absolute left-1\"\n  />\n)\n\nexport const DataTableHeaderCell = ({\n  header,\n  includeTotal = false,\n  totalSuffix = 'items',\n  children,\n  className,\n  ...props\n}: DataTableHeaderProps) => {\n  const sortDirection = header.column.getIsSorted()\n  const { isSortable: isSortableTable, getRowModel } = useDataTable()\n  // false for display columns, e.g. \"Actions\"\n  const isDataColumn = header.column.getCanSort()\n\n  const totalRows = getRowModel()?.rows?.length\n\n  const { hoverProps, isHovered } = useHover({})\n\n  const handleKeyDown = (\n    event: React.KeyboardEvent<HTMLTableCellElement>,\n    callback: (event: unknown) => void | undefined\n  ) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      callback(event as unknown)\n    }\n  }\n\n  const headerSortingHandler = header.column.getToggleSortingHandler()\n\n  return (\n    <StyledTableHeaderCell\n      isSortable={isSortableTable && isDataColumn}\n      colSpan={header.colSpan}\n      onClick={\n        isSortableTable && isDataColumn && headerSortingHandler\n          ? headerSortingHandler\n          : undefined\n      }\n      onKeyDown={(event) =>\n        isSortableTable &&\n        isDataColumn &&\n        headerSortingHandler &&\n        handleKeyDown(event, headerSortingHandler)\n      }\n      tabIndex={isSortableTable && isDataColumn ? 0 : -1}\n      {...hoverProps}\n      className={className}\n      {...props}\n    >\n      <div\n        className={clsx(\n          'flex',\n          'gap-1',\n          'items-center',\n          header.colSpan > 1 ? 'justify-center' : 'justify-start'\n        )}\n      >\n        {flexRender(header.column.columnDef.header, header.getContext())}\n        {sortDirection && isSortableTable && (\n          <div\n            className={clsx(\n              'flex',\n              'items-center',\n              'relative',\n              'size-6',\n              'ml-2',\n              isHovered ? 'bg-primary-200' : 'bg-primary-100',\n              'rounded-sm'\n            )}\n          >\n            <SortIcon direction={sortDirection} />\n          </div>\n        )}\n        {includeTotal && (\n          <StyledCount size=\"sm\" weight=\"normal\">\n            ({totalRows} {totalSuffix})\n          </StyledCount>\n        )}\n      </div>\n    </StyledTableHeaderCell>\n  )\n}\n"],"names":["StyledCount","styled","Text","StyledTableHeaderCell","Table","sortIcons","ArrowUp","ArrowDown","SortIcon","direction","React","Icon","DataTableHeaderCell","header","includeTotal","totalSuffix","children","className","props","_a","_b","sortDirection","isSortableTable","getRowModel","useDataTable","isDataColumn","totalRows","hoverProps","isHovered","useHover","handleKeyDown","event","callback","headerSortingHandler","clsx","flexRender"],"mappings":"yZAoBA,MAAMA,EAAcC,EAAOC,EAAM,CAC/B,KAAM,CAAC,gBAAiB,oBAAqB,SAAU,mBAAmB,CAC5E,CAAC,EAEKC,EAAwBF,EAAOG,EAAM,WAAY,CACrD,KAAM,GACN,SAAU,CACR,WAAY,CACV,KAAM,CACJ,aACA,kBACA,wBACA,sBACA,iBACA,iBACA,mBACA,4BACA,iBACA,0BACA,UACF,CACF,CACF,CACF,CAAC,EAEKC,EAAY,CAChB,IAAKC,EACL,KAAMC,CACR,EAEMC,EAAW,CAAC,CAAE,UAAAC,CAAU,IAC5BC,EAAA,cAACC,EAAA,CACC,GAAIN,EAAUI,CAAS,EACvB,KAAK,KACL,UAAU,qCACZ,EAGWG,EAAsB,CAAC,CAClC,OAAAC,EACA,aAAAC,EAAe,GACf,YAAAC,EAAc,QACd,SAAAC,EACA,UAAAC,EACA,GAAGC,CACL,IAA4B,CAjE5B,IAAAC,EAAAC,EAkEE,MAAMC,EAAgBR,EAAO,OAAO,YAAY,EAC1C,CAAE,WAAYS,EAAiB,YAAAC,CAAY,EAAIC,IAE/CC,EAAeZ,EAAO,OAAO,WAE7Ba,EAAAA,GAAYN,GAAAD,EAAAI,EAAA,IAAA,KAAA,OAAAJ,EAAe,OAAf,KAAAC,OAAAA,EAAqB,OAEjC,CAAE,WAAAO,EAAY,UAAAC,CAAU,EAAIC,EAAS,CAAE,CAAA,EAEvCC,EAAgB,CACpBC,EACAC,IACG,EACCD,EAAM,MAAQ,SAAWA,EAAM,MAAQ,OACzCA,EAAM,eACNC,EAAAA,EAASD,CAAgB,EAE7B,EAEME,EAAuBpB,EAAO,OAAO,wBAAA,EAE3C,OACEH,EAAA,cAACP,EAAA,CACC,WAAYmB,GAAmBG,EAC/B,QAASZ,EAAO,QAChB,QACES,GAAmBG,GAAgBQ,EAC/BA,EACA,OAEN,UAAYF,GACVT,GACAG,GACAQ,GACAH,EAAcC,EAAOE,CAAoB,EAE3C,SAAUX,GAAmBG,EAAe,EAAI,GAC/C,GAAGE,EACJ,UAAWV,EACV,GAAGC,CAAAA,EAEJR,EAAA,cAAC,MACC,CAAA,UAAWwB,EACT,OACA,QACA,eACArB,EAAO,QAAU,EAAI,iBAAmB,eAC1C,CAECsB,EAAAA,EAAWtB,EAAO,OAAO,UAAU,OAAQA,EAAO,YAAY,EAC9DQ,GAAiBC,GAChBZ,EAAA,cAAC,MAAA,CACC,UAAWwB,EACT,OACA,eACA,WACA,SACA,OACAN,EAAY,iBAAmB,iBAC/B,YACF,GAEAlB,EAAA,cAACF,EAAA,CAAS,UAAWa,CAAe,CAAA,CACtC,EAEDP,GACCJ,EAAA,cAACV,EAAA,CAAY,KAAK,KAAK,OAAO,QAAS,EAAA,IACnC0B,EAAU,IAAEX,EAAY,GAC5B,CAEJ,CACF,CAEJ"}
+{"version":3,"file":"DataTableHeaderCell.js","names":[],"sources":["../../../src/components/data-table/DataTableHeaderCell.tsx"],"sourcesContent":["import { ArrowDown, ArrowUp } from '@atom-learning/icons'\nimport type { Header } from '@tanstack/react-table'\nimport { flexRender } from '@tanstack/react-table'\nimport clsx from 'clsx'\nimport * as React from 'react'\nimport { useHover } from 'react-aria'\n\nimport { styled } from '~/styled'\n\nimport { Icon } from '../icon/Icon'\nimport { Table } from '../table/Table'\nimport { Text } from '../text/Text'\nimport { useDataTable } from './DataTableContext'\n\ntype DataTableHeaderProps = React.ComponentProps<typeof Table.HeaderCell> & {\n  header: Header<Record<string, unknown>, unknown>\n  includeTotal?: boolean\n  totalSuffix?: string\n}\n\nconst StyledCount = styled(Text, {\n  base: ['text-grey-600', 'whitespace-nowrap', 'hidden', 'min-[800px]:block']\n})\n\nconst StyledTableHeaderCell = styled(Table.HeaderCell, {\n  base: [],\n  variants: {\n    isSortable: {\n      true: [\n        '*:relative',\n        'before:absolute',\n        'before:bg-primary-100',\n        'before:duration-200',\n        'before:ease-in',\n        'before:inset-0',\n        'before:opacity-0',\n        'before:transition-opacity',\n        'cursor-pointer',\n        'hover:before:opacity-50',\n        'relative'\n      ]\n    }\n  }\n})\n\nconst sortIcons = {\n  asc: ArrowUp,\n  desc: ArrowDown\n}\n\nconst SortIcon = ({ direction }: { direction: 'asc' | 'desc' }) => (\n  <Icon\n    is={sortIcons[direction]}\n    size=\"sm\"\n    className=\"stroke-primary-900 absolute left-1\"\n  />\n)\n\nexport const DataTableHeaderCell = ({\n  header,\n  includeTotal = false,\n  totalSuffix = 'items',\n  children,\n  className,\n  ...props\n}: DataTableHeaderProps) => {\n  const sortDirection = header.column.getIsSorted()\n  const { isSortable: isSortableTable, getRowModel } = useDataTable()\n  // false for display columns, e.g. \"Actions\"\n  const isDataColumn = header.column.getCanSort()\n\n  const totalRows = getRowModel()?.rows?.length\n\n  const { hoverProps, isHovered } = useHover({})\n\n  const handleKeyDown = (\n    event: React.KeyboardEvent<HTMLTableCellElement>,\n    callback: (event: unknown) => void | undefined\n  ) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      callback(event as unknown)\n    }\n  }\n\n  const headerSortingHandler = header.column.getToggleSortingHandler()\n\n  return (\n    <StyledTableHeaderCell\n      isSortable={isSortableTable && isDataColumn}\n      colSpan={header.colSpan}\n      onClick={\n        isSortableTable && isDataColumn && headerSortingHandler\n          ? headerSortingHandler\n          : undefined\n      }\n      onKeyDown={(event) =>\n        isSortableTable &&\n        isDataColumn &&\n        headerSortingHandler &&\n        handleKeyDown(event, headerSortingHandler)\n      }\n      tabIndex={isSortableTable && isDataColumn ? 0 : -1}\n      {...hoverProps}\n      className={className}\n      {...props}\n    >\n      <div\n        className={clsx(\n          'flex',\n          'gap-1',\n          'items-center',\n          header.colSpan > 1 ? 'justify-center' : 'justify-start'\n        )}\n      >\n        {flexRender(header.column.columnDef.header, header.getContext())}\n        {sortDirection && isSortableTable && (\n          <div\n            className={clsx(\n              'flex',\n              'items-center',\n              'relative',\n              'size-6',\n              'ml-2',\n              isHovered ? 'bg-primary-200' : 'bg-primary-100',\n              'rounded-sm'\n            )}\n          >\n            <SortIcon direction={sortDirection} />\n          </div>\n        )}\n        {includeTotal && (\n          <StyledCount size=\"sm\" weight=\"normal\">\n            ({totalRows} {totalSuffix})\n          </StyledCount>\n        )}\n      </div>\n    </StyledTableHeaderCell>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAoBA,IAAM,IAAc,EAAO,GAAM,EAC/B,MAAM;CAAC;CAAiB;CAAqB;CAAU;CAAoB,EAC5E,CAAC,EAEI,IAAwB,EAAO,EAAM,YAAY;CACrD,MAAM,EAAE;CACR,UAAU,EACR,YAAY,EACV,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,EACF,EACF;CACF,CAAC,EAEI,IAAY;CAChB,KAAK;CACL,MAAM;CACP,EAEK,KAAY,EAAE,mBAClB,kBAAA,cAAC,GAAD;CACE,IAAI,EAAU;CACd,MAAK;CACL,WAAU;CACV,CAAA,EAGS,KAAuB,EAClC,WACA,kBAAe,IACf,iBAAc,SACd,aACA,cACA,GAAG,QACuB;CAC1B,IAAM,IAAgB,EAAO,OAAO,aAAa,EAC3C,EAAE,YAAY,GAAiB,mBAAgB,GAAc,EAE7D,IAAe,EAAO,OAAO,YAAY,EAEzC,IAAY,GAAa,EAAE,MAAM,QAEjC,EAAE,eAAY,iBAAc,EAAS,EAAE,CAAC,EAExC,KACJ,GACA,MACG;AACH,GAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,SACzC,EAAM,gBAAgB,EACtB,EAAS,EAAiB;IAIxB,IAAuB,EAAO,OAAO,yBAAyB;AAEpE,QACE,kBAAA,cAAC,GAAD;EACE,YAAY,KAAmB;EAC/B,SAAS,EAAO;EAChB,SACE,KAAmB,KAAgB,IAC/B,IACA,KAAA;EAEN,YAAY,MACV,KACA,KACA,KACA,EAAc,GAAO,EAAqB;EAE5C,UAAU,KAAmB,IAAe,IAAI;EAChD,GAAI;EACO;EACX,GAAI;EAgCkB,EA9BtB,kBAAA,cAAC,OAAD,EACE,WAAW,EACT,QACA,SACA,gBACA,EAAO,UAAU,IAAI,mBAAmB,gBACzC,EAuBG,EArBH,EAAW,EAAO,OAAO,UAAU,QAAQ,EAAO,YAAY,CAAC,EAC/D,KAAiB,KAChB,kBAAA,cAAC,OAAD,EACE,WAAW,EACT,QACA,gBACA,YACA,UACA,QACA,IAAY,mBAAmB,kBAC/B,aACD,EAGG,EADJ,kBAAA,cAAC,GAAD,EAAU,WAAW,GAAiB,CAAA,CAClC,EAEP,KACC,kBAAA,cAAC,GAAD;EAAa,MAAK;EAAK,QAAO;EAEhB,EAFyB,KACnC,GAAU,KAAE,GAAY,IACd,CAEZ,CACgB"}

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

@@ -1,2 +1,21 @@
-import*as e from"react";import{styled as o}from"../../styled.js";import{Loader as r}from"../loader/Loader.js";import{AsyncDataState as m}from"./DataTable.types.js";import{useDataTable as s}from"./DataTableContext.js";const n=o(r,{base:["absolute","left-1/2","top-1/2","-translate-x-1/2","-translate-y-1/2","z-1"]}),l=t=>{const{asyncDataState:a}=s();return a!==m.PENDING?null:e.createElement(n,{...t})};export{l as DataTableLoading};
-//# sourceMappingURL=DataTableLoading.js.map
+import { styled as e } from "../../styled.js";
+import { Loader as t } from "../loader/Loader.js";
+import { AsyncDataState as n } from "./DataTable.types.js";
+import { useDataTable as r } from "./DataTableContext.js";
+import * as i from "react";
+//#region src/components/data-table/DataTableLoading.tsx
+var a = e(t, { base: [
+	"absolute",
+	"left-1/2",
+	"top-1/2",
+	"-translate-x-1/2",
+	"-translate-y-1/2",
+	"z-1"
+] }), o = (e) => {
+	let { asyncDataState: t } = r();
+	return t === n.PENDING ? /* @__PURE__ */ i.createElement(a, e) : null;
+};
+//#endregion
+export { o as DataTableLoading };
+
+//# sourceMappingURL=DataTableLoading.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableLoading.js","sources":["../../../src/components/data-table/DataTableLoading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Loader } from '../loader/Loader'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\nconst PendingState = styled(Loader, {\n  base: [\n    'absolute',\n    'left-1/2',\n    'top-1/2',\n    '-translate-x-1/2',\n    '-translate-y-1/2',\n    'z-1'\n  ]\n})\n\nexport const DataTableLoading = (\n  props: React.ComponentProps<typeof PendingState>\n) => {\n  const { asyncDataState } = useDataTable()\n\n  if (asyncDataState !== AsyncDataState.PENDING) return null\n\n  return <PendingState {...props} />\n}\n"],"names":["PendingState","styled","Loader","DataTableLoading","props","asyncDataState","useDataTable","AsyncDataState","React"],"mappings":"yNAQA,MAAMA,EAAeC,EAAOC,EAAQ,CAClC,KAAM,CACJ,WACA,WACA,UACA,mBACA,mBACA,KACF,CACF,CAAC,EAEYC,EACXC,GACG,CACH,KAAM,CAAE,eAAAC,CAAe,EAAIC,IAE3B,OAAID,IAAmBE,EAAe,QAAgB,KAE/CC,EAAA,cAACR,EAAA,CAAc,GAAGI,CAAAA,CAAO,CAClC"}
+{"version":3,"file":"DataTableLoading.js","names":[],"sources":["../../../src/components/data-table/DataTableLoading.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Loader } from '../loader/Loader'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\n\nconst PendingState = styled(Loader, {\n  base: [\n    'absolute',\n    'left-1/2',\n    'top-1/2',\n    '-translate-x-1/2',\n    '-translate-y-1/2',\n    'z-1'\n  ]\n})\n\nexport const DataTableLoading = (\n  props: React.ComponentProps<typeof PendingState>\n) => {\n  const { asyncDataState } = useDataTable()\n\n  if (asyncDataState !== AsyncDataState.PENDING) return null\n\n  return <PendingState {...props} />\n}\n"],"mappings":";;;;;;AAQA,IAAM,IAAe,EAAO,GAAQ,EAClC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC,EAEW,KACX,MACG;CACH,IAAM,EAAE,sBAAmB,GAAc;AAIzC,QAFI,MAAmB,EAAe,UAE/B,kBAAA,cAAC,GAAiB,EAAS,GAFoB"}

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

@@ -1,2 +1,23 @@
-import*as y from"react";import{Text as f}from"../text/Text.js";import{useDataTable as v}from"./DataTableContext.js";const w={sorted_by:"Sorted by",ascending:"ascending",descending:"descending",separator:"-"},D=({copy:i,...c})=>{var o,r;const{getState:l,columns:g,getRowModel:m,rowSelection:$}=v(),{sorting:s}=l(),b=s.length>0,d=(r=(o=m())==null?void 0:o.rows)==null?void 0:r.length,n=Object.keys($||{}).length,t={...w,...i},p=e=>{const a=g.find(h=>h.id===e);return(a==null?void 0:a.header)||e},u=e=>`${t.separator} ${t.sorted_by} ${p(e[0].id)} ${e[0].desc?t.descending:t.ascending}`;return y.createElement(f,{weight:"bold",...c},`${n||d} ${(n||d)===1?"item":"items"} ${n?"selected":""} ${b?u(s):""}`)};export{D as DataTableMetaData};
-//# sourceMappingURL=DataTableMetaData.js.map
+import { Text as e } from "../text/Text.js";
+import { useDataTable as t } from "./DataTableContext.js";
+import * as n from "react";
+//#region src/components/data-table/DataTableMetaData.tsx
+var r = {
+	sorted_by: "Sorted by",
+	ascending: "ascending",
+	descending: "descending",
+	separator: "-"
+}, i = ({ copy: i, ...a }) => {
+	let { getState: o, columns: s, getRowModel: c, rowSelection: l } = t(), { sorting: u } = o(), d = u.length > 0, f = c()?.rows?.length, p = Object.keys(l || {}).length, m = {
+		...r,
+		...i
+	}, h = (e) => s.find((t) => t.id === e)?.header || e, g = (e) => `${m.separator} ${m.sorted_by} ${h(e[0].id)} ${e[0].desc ? m.descending : m.ascending}`;
+	return /* @__PURE__ */ n.createElement(e, {
+		weight: "bold",
+		...a
+	}, `${p || f} ${(p || f) === 1 ? "item" : "items"} ${p ? "selected" : ""} ${d ? g(u) : ""}`);
+};
+//#endregion
+export { i as DataTableMetaData };
+
+//# sourceMappingURL=DataTableMetaData.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataTableMetaData.js","sources":["../../../src/components/data-table/DataTableMetaData.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '../text/Text'\nimport { useDataTable } from './DataTableContext'\n\nconst defaultCopy = {\n  sorted_by: 'Sorted by',\n  ascending: 'ascending',\n  descending: 'descending',\n  separator: '-'\n}\n\nexport const DataTableMetaData = ({\n  copy,\n  ...rest\n}: React.ComponentProps<typeof Text> & {\n  copy?: {\n    sorted_by?: string\n    ascending?: string\n    descending?: string\n    separator?: string\n  }\n  sortLabel?: string\n}) => {\n  const { getState, columns, getRowModel, rowSelection } = useDataTable()\n  const { sorting } = getState()\n  const isSorted = sorting.length > 0\n\n  const totalRows = getRowModel()?.rows?.length\n\n  const selectedRows = Object.keys(rowSelection || {}).length\n\n  const copyMerged = { ...defaultCopy, ...copy }\n\n  const getColumnDisplayName = (id: string) => {\n    const sortedColumn = columns.find((col) => col.id === id)\n    return sortedColumn?.header || id\n  }\n\n  const getSortingString = (sorting) => {\n    return `${copyMerged.separator} ${\n      copyMerged.sorted_by\n    } ${getColumnDisplayName(sorting[0].id)} ${\n      sorting[0].desc ? copyMerged.descending : copyMerged.ascending\n    }`\n  }\n\n  return (\n    <Text weight=\"bold\" {...rest}>{`${selectedRows || totalRows} ${\n      (selectedRows || totalRows) === 1 ? 'item' : 'items'\n    } ${selectedRows ? 'selected' : ''} ${\n      isSorted ? getSortingString(sorting) : ''\n    }`}</Text>\n  )\n}\n"],"names":["defaultCopy","DataTableMetaData","copy","rest","_a","_b","getState","columns","getRowModel","rowSelection","useDataTable","sorting","isSorted","totalRows","selectedRows","copyMerged","getColumnDisplayName","id","sortedColumn","col","getSortingString","React","Text"],"mappings":"oHAKA,MAAMA,EAAc,CAClB,UAAW,YACX,UAAW,YACX,WAAY,aACZ,UAAW,GACb,EAEaC,EAAoB,CAAC,CAChC,KAAAC,EACA,GAAGC,CACL,IAQM,CAvBN,IAAAC,EAAAC,EAwBE,KAAM,CAAE,SAAAC,EAAU,QAAAC,EAAS,YAAAC,EAAa,aAAAC,CAAa,EAAIC,EAAa,EAChE,CAAE,QAAAC,CAAQ,EAAIL,EACdM,EAAAA,EAAWD,EAAQ,OAAS,EAE5BE,GAAYR,GAAAD,EAAAI,EAAY,IAAZ,KAAAJ,OAAAA,EAAe,OAAf,KAAAC,OAAAA,EAAqB,OAEjCS,EAAe,OAAO,KAAKL,GAAgB,CAAE,CAAA,EAAE,OAE/CM,EAAa,CAAE,GAAGf,EAAa,GAAGE,CAAK,EAEvCc,EAAwBC,GAAe,CAC3C,MAAMC,EAAeX,EAAQ,KAAMY,GAAQA,EAAI,KAAOF,CAAE,EACxD,OAAOC,GAAA,KAAAA,OAAAA,EAAc,SAAUD,CACjC,EAEMG,EAAoBT,GACjB,GAAGI,EAAW,SAAS,IAC5BA,EAAW,SACb,IAAIC,EAAqBL,EAAQ,CAAC,EAAE,EAAE,CAAC,IACrCA,EAAQ,CAAC,EAAE,KAAOI,EAAW,WAAaA,EAAW,SACvD,GAGF,OACEM,EAAA,cAACC,EAAA,CAAK,OAAO,OAAQ,GAAGnB,CAAO,EAAA,GAAGW,GAAgBD,CAAS,KACxDC,GAAgBD,KAAe,EAAI,OAAS,OAC/C,IAAIC,EAAe,WAAa,EAAE,IAChCF,EAAWQ,EAAiBT,CAAO,EAAI,EACzC,EAAG,CAEP"}
+{"version":3,"file":"DataTableMetaData.js","names":[],"sources":["../../../src/components/data-table/DataTableMetaData.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Text } from '../text/Text'\nimport { useDataTable } from './DataTableContext'\n\nconst defaultCopy = {\n  sorted_by: 'Sorted by',\n  ascending: 'ascending',\n  descending: 'descending',\n  separator: '-'\n}\n\nexport const DataTableMetaData = ({\n  copy,\n  ...rest\n}: React.ComponentProps<typeof Text> & {\n  copy?: {\n    sorted_by?: string\n    ascending?: string\n    descending?: string\n    separator?: string\n  }\n  sortLabel?: string\n}) => {\n  const { getState, columns, getRowModel, rowSelection } = useDataTable()\n  const { sorting } = getState()\n  const isSorted = sorting.length > 0\n\n  const totalRows = getRowModel()?.rows?.length\n\n  const selectedRows = Object.keys(rowSelection || {}).length\n\n  const copyMerged = { ...defaultCopy, ...copy }\n\n  const getColumnDisplayName = (id: string) => {\n    const sortedColumn = columns.find((col) => col.id === id)\n    return sortedColumn?.header || id\n  }\n\n  const getSortingString = (sorting) => {\n    return `${copyMerged.separator} ${\n      copyMerged.sorted_by\n    } ${getColumnDisplayName(sorting[0].id)} ${\n      sorting[0].desc ? copyMerged.descending : copyMerged.ascending\n    }`\n  }\n\n  return (\n    <Text weight=\"bold\" {...rest}>{`${selectedRows || totalRows} ${\n      (selectedRows || totalRows) === 1 ? 'item' : 'items'\n    } ${selectedRows ? 'selected' : ''} ${isSorted ? getSortingString(sorting) : ''}`}</Text>\n  )\n}\n"],"mappings":";;;;AAKA,IAAM,IAAc;CAClB,WAAW;CACX,WAAW;CACX,YAAY;CACZ,WAAW;CACZ,EAEY,KAAqB,EAChC,SACA,GAAG,QASC;CACJ,IAAM,EAAE,aAAU,YAAS,gBAAa,oBAAiB,GAAc,EACjE,EAAE,eAAY,GAAU,EACxB,IAAW,EAAQ,SAAS,GAE5B,IAAY,GAAa,EAAE,MAAM,QAEjC,IAAe,OAAO,KAAK,KAAgB,EAAE,CAAC,CAAC,QAE/C,IAAa;EAAE,GAAG;EAAa,GAAG;EAAM,EAExC,KAAwB,MACP,EAAQ,MAAM,MAAQ,EAAI,OAAO,EAAG,EACpC,UAAU,GAG3B,KAAoB,MACjB,GAAG,EAAW,UAAU,GAC7B,EAAW,UACZ,GAAG,EAAqB,EAAQ,GAAG,GAAG,CAAC,GACtC,EAAQ,GAAG,OAAO,EAAW,aAAa,EAAW;AAIzD,QACE,kBAAA,cAAC,GAAD;EAAM,QAAO;EAAO,GAAI;EAEiE,EAF1D,GAAG,KAAgB,EAAU,IACzD,KAAgB,OAAe,IAAI,SAAS,QAC9C,GAAG,IAAe,aAAa,GAAG,GAAG,IAAW,EAAiB,EAAQ,GAAG,KAAY"}