@customafk/lunas-ui 0.1.93 → 0.1.95

package/dist/features/tables/index.d.cts

@@ -1,7 +1,8 @@
-import { t as Input } from "../../input-B2Y92Ylo.cjs";
-import * as react_jsx_runtime350 from "react/jsx-runtime";
-import * as react241 from "react";
-import { AccessorKeyColumnDef, ColumnPinningState, RowData, RowSelectionState, Table } from "@tanstack/react-table";
+import { t as AnyEntity } from "../../types-Bd0JePtp.cjs";
+import { t as Input } from "../../input-VtO0d8O-.cjs";
+import * as react_jsx_runtime333 from "react/jsx-runtime";
+import * as react255 from "react";
+import { AccessorKeyColumnDef, CellContext, Column, ColumnPinningPosition, ColumnPinningState, Header, HeaderGroup, Row, RowSelectionState, Table } from "@tanstack/react-table";
 import { VirtualItem, Virtualizer } from "@tanstack/react-virtual";
 
 //#region packages/components/features/tables/components/atoms/badge-display.d.ts
@@ -72,7 +73,7 @@ type Props$1 = {
   size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
   value: number | string | null | undefined;
 };
-declare const UITableStatisticDisplay: react241.MemoExoticComponent<({
+declare const UITableStatisticDisplay: react255.MemoExoticComponent<({
   decimalSeparator,
   groupSeparator,
   prefix: Prefix,
@@ -82,7 +83,7 @@ declare const UITableStatisticDisplay: react241.MemoExoticComponent<({
   showTrailingZeros,
   size,
   value
-}: Props$1) => react_jsx_runtime350.JSX.Element>;
+}: Props$1) => react_jsx_runtime333.JSX.Element>;
 //#endregion
 //#region packages/components/features/tables/components/atoms/user.d.ts
 type Props = {
@@ -92,56 +93,174 @@ type Props = {
 };
 declare const UITableUserDataDisplay: React.FC<Props>;
 //#endregion
-//#region packages/components/features/tables/components/table.d.ts
-declare const UITableWrapper: React.FC<React.PropsWithChildren<React.ComponentProps<'div'>>>;
-declare const UITableFooter: React.FC<React.PropsWithChildren>;
-declare const UITableContainer: React.FC<React.PropsWithChildren>;
-//#endregion
-//#region packages/components/features/tables/components/table/filter.d.ts
-declare const UITableFilter: () => react_jsx_runtime350.JSX.Element;
-//#endregion
 //#region packages/components/features/tables/types.d.ts
-type TUITableColumn<TData extends RowData> = Pick<AccessorKeyColumnDef<TData, unknown>, 'id' | 'accessorKey' | 'size' | 'maxSize' | 'minSize' | 'header' | 'cell' | 'meta'> & {
+type RowData<TData extends RowData<AnyEntity>> = {
+  [x: string | number | symbol]: AnyEntity;
+  subRows?: TData[] | undefined;
+};
+type TUITableEmptyDisplay = {
+  isFetching?: boolean;
+  isEmpty?: boolean;
+};
+type TUITableWrapper = React.PropsWithChildren<React.ComponentProps<'div'>>;
+type TUITableInnerWrapper = React.PropsWithChildren<React.ComponentProps<'div'>>;
+type TUITableInnerTable = React.PropsWithChildren<React.ComponentProps<'table'>>;
+type TUITableHead = React.PropsWithChildren<React.ComponentProps<'thead'>>;
+type TUITableHeadCellOption = {
+  isPinned?: ColumnPinningPosition;
+  isVisible?: boolean;
+  className?: string;
+  onLeftPin?: (pos: ColumnPinningPosition) => void;
+  onRightPin?: (pos: ColumnPinningPosition) => void;
+  onUnpin?: (pos: ColumnPinningPosition) => void;
+  onToggleVisibility?: (props: AnyEntity) => void;
+};
+type TUITableHeadCellSelect = React.ComponentProps<'th'> & {
+  isPinned?: ColumnPinningPosition;
+  isAllRowsSelected?: boolean;
+  onToggleAllRowsSelected?: (value?: boolean) => void;
+};
+type TUITableHeadRow = React.PropsWithChildren<React.ComponentProps<'tr'> & {
+  headerGroup: HeaderGroup<unknown>;
+  onToggleAllRowsSelected?: (value?: boolean) => void;
+}>;
+type TUITableHeadCell = React.PropsWithChildren<React.ComponentProps<'th'> & {
+  isVisible?: boolean;
+  isPinned?: ColumnPinningPosition;
+  isFirstCell?: boolean;
+  isLastCell?: boolean;
+  isOptionsVisible?: boolean;
+  headerId?: string;
+  headerColumn?: Column<unknown, unknown>;
+  onColumnPin?: (pos: ColumnPinningPosition) => void;
+  onToggleVisibility?: (value?: boolean) => void;
+}>;
+type TUITableBody = React.PropsWithChildren<React.ComponentProps<'tbody'> & {
+  isFetching?: boolean;
+  isEmpty?: boolean;
+  height: string;
+}>;
+type TUITableRow = React.ComponentProps<'tr'> & {
+  row: Row<AnyEntity>;
+  isSelected?: boolean;
+  virtualRowIndex: number;
+  virtualRowStart: number;
+};
+type TUITableCellSelect = React.ComponentProps<'td'> & {
+  isPinned?: ColumnPinningPosition;
+  isSelected?: boolean;
+  onToggleRowSelected?: (value?: boolean) => void;
+};
+type TUITableCellActions = React.ComponentProps<'td'> & {
+  virtualRowIndex: number;
+  column?: Column<unknown, unknown>;
+  getContext: () => CellContext<unknown, unknown>;
+};
+type TUITableCell = React.ComponentProps<'td'> & {
+  isPinned?: ColumnPinningPosition;
+  isFirstCell?: boolean;
+  isLastCell?: boolean;
+  colId?: string;
+  cellId?: string;
+  position?: 'start' | 'center' | 'end';
+  column?: Column<unknown, unknown>;
+  getContext: () => CellContext<unknown, unknown>;
+};
+type TUITableFooter = React.PropsWithChildren<React.ComponentProps<'tfoot'>>;
+type TUITableLoadMore = React.PropsWithChildren<React.ComponentProps<'tr'> & {
+  virtualRowIndex: number;
+  virtualRowStart: number;
+  fetchMoreData?: () => void | Promise<void>;
+}>;
+type TUITableColumn<TData extends RowData<TData>> = Pick<AccessorKeyColumnDef<TData, AnyEntity>, 'id' | 'accessorKey' | 'size' | 'maxSize' | 'minSize' | 'header' | 'cell' | 'meta'> & {
   meta?: {
-    position: 'start' | 'center' | 'end';
+    position?: 'start' | 'center' | 'end';
+    fitContent?: boolean;
   };
 };
-type TTableContext<TData extends RowData> = {
+type TTableContext<TData extends RowData<TData>> = {
   title: string;
   table: Table<TData>;
-  data: TData[];
   isEmpty: boolean;
   isFetching?: boolean;
   isRefetching?: boolean;
   totalRows?: number;
-  rowSelection: RowSelectionState;
-  columnPinning: ColumnPinningState;
   fetchMoreData?: () => void | Promise<void>;
 };
-type TTableClickRow<TData extends RowData, TKey extends keyof TData = keyof TData> = {
+type TTableInnerWrapperContext = {
+  innerWrapperId: string;
+};
+type TTableInnerTableContext = {
+  table: Table<AnyEntity>;
+  innerTableId: string;
+  totalSize: number;
+};
+type TTableHeadRowContext = {
+  isAllRowsSelected: boolean;
+  columnPinningState: ColumnPinningState;
+  leftPinnedHeaders: Header<AnyEntity, unknown>[];
+  rightPinnedHeaders: Header<AnyEntity, unknown>[];
+  onToggleAllRowsSelected?: (value?: boolean) => void;
+};
+type TTableBodyContext = {
+  isFetching: boolean;
+  isEmpty: boolean;
+  rowSelectionState: RowSelectionState;
+};
+type TTableRowContext<TData extends RowData<TData> = RowData<AnyEntity>, TKey extends keyof TData = keyof TData> = {
   keyOfClickRow?: TKey;
-  onClickRow?: (rowIndex: number, rowId?: TData[TKey]) => void;
+  isAllRowsSelected?: boolean;
+  columnPinningState: ColumnPinningState;
+  onClickRow?: (rowIndex: number, rowId?: AnyEntity) => void;
+  leftPinnedHeaders?: Header<TData, unknown>[];
+  rightPinnedHeaders?: Header<TData, unknown>[];
 };
 type TTableVirtualizerContext = {
   rowVirtualizer: Virtualizer<HTMLDivElement, HTMLTableRowElement>;
   virtualItems: VirtualItem[];
 };
-type TableProviderProps<TData extends RowData, TKey extends keyof TData> = {
+type TableProviderProps<TData extends RowData<TData>, TKey extends keyof TData = keyof TData, TColumns extends ReadonlyArray<TUITableColumn<TData>> = TUITableColumn<TData>[]> = {
   title: string;
   isFetching?: boolean;
   isRefetching?: boolean;
   data: TData[];
-  columns: TUITableColumn<TData>[];
+  columns: TColumns;
   totalRows?: number;
   fetchMoreData?: () => void | Promise<void>;
-  leftPinnedColumns?: string[];
-  rightPinnedColumns?: string[];
-  keyOfClickRow?: TTableClickRow<TData, TKey>['keyOfClickRow'];
-  onClickRow?: TTableClickRow<TData, TKey>['onClickRow'];
+  leftPinnedColumns?: Array<TColumns[number]['accessorKey']>;
+  rightPinnedColumns?: Array<TColumns[number]['accessorKey']> | string[];
+  keyOfClickRow?: TTableRowContext<TData, TKey>['keyOfClickRow'];
+  onClickRow?: TTableRowContext<TData, TKey>['onClickRow'];
+  onRowSelection?: (rowSelection: RowSelectionState) => void;
+  onColumnPinning?: (columnPinning: ColumnPinningState) => void;
 };
 //#endregion
+//#region packages/components/features/tables/components/common.d.ts
+declare const UITableHeadCellOption: react255.NamedExoticComponent<TUITableHeadCellOption>;
+declare const UITableHeadCellSelect: react255.NamedExoticComponent<TUITableHeadCellSelect>;
+declare const UITableEmptyDisplay: react255.NamedExoticComponent<TUITableEmptyDisplay>;
+declare const UITableWrapper: react255.NamedExoticComponent<TUITableWrapper>;
+declare const UITableInnerWrapper: react255.NamedExoticComponent<TUITableInnerWrapper>;
+declare const UITableInnerTable: react255.NamedExoticComponent<TUITableInnerTable>;
+declare const UITableHead: react255.NamedExoticComponent<TUITableHead>;
+declare const UITableHeadRow: react255.NamedExoticComponent<TUITableHeadRow>;
+declare const UITableHeadCell: react255.NamedExoticComponent<TUITableHeadCell>;
+declare const UITableBody: react255.NamedExoticComponent<TUITableBody>;
+declare const UITableRow: react255.NamedExoticComponent<TUITableRow>;
+declare const UITableCellSelect: react255.NamedExoticComponent<TUITableCellSelect>;
+declare const UITableCellActions: react255.NamedExoticComponent<TUITableCellActions>;
+declare const UITableCell: react255.NamedExoticComponent<TUITableCell>;
+declare const UITableFooter: react255.NamedExoticComponent<TUITableFooter>;
+declare const UITableLoadMore: react255.NamedExoticComponent<TUITableLoadMore>;
+//#endregion
+//#region packages/components/features/tables/components/table.d.ts
+declare const UITableContainer: React.FC<React.PropsWithChildren>;
+//#endregion
+//#region packages/components/features/tables/components/table/filter.d.ts
+declare const UITableFilter: () => react_jsx_runtime333.JSX.Element;
+//#endregion
 //#region packages/components/features/tables/components/table/provider.d.ts
-declare const UITableProvider: <TData extends RowData, TKey extends keyof TData>({
+declare const UITableProvider: <TData extends RowData<TData> = RowData<AnyEntity>, TKey extends keyof TData = keyof TData, TColumns extends ReadonlyArray<TUITableColumn<TData>> = TUITableColumn<TData>[]>({
   title,
   isFetching,
   isRefetching,
@@ -152,9 +271,11 @@ declare const UITableProvider: <TData extends RowData, TKey extends keyof TData>
   rightPinnedColumns,
   keyOfClickRow,
   onClickRow,
+  onRowSelection,
+  onColumnPinning,
   fetchMoreData,
   children
-}: React.PropsWithChildren<TableProviderProps<TData, TKey>>) => react_jsx_runtime350.JSX.Element;
+}: React.PropsWithChildren<TableProviderProps<TData, TKey, TColumns>>) => react_jsx_runtime333.JSX.Element;
 //#endregion
 //#region packages/components/features/tables/components/table/tooltip.d.ts
 declare const UITableTooltipFilter: React.FC<Omit<React.ComponentProps<typeof Input>, 'className'> & {
@@ -167,5 +288,5 @@ declare const UITableTooltipActions: React.FC<{
 }>;
 declare const UITableTooltip: React.FC<React.PropsWithChildren>;
 //#endregion
-export { TTableClickRow, TTableContext, TTableVirtualizerContext, TUITableColumn, TableProviderProps, UITableBadgeDisplay, UITableBooleanDisplay, UITableContainer, UITableDateDisplay, UITableDescriptionDisplay, UITableFilter, UITableFooter, UITableMoreButton, UITableNameDisplay, UITablePermalink, UITablePhoneNumberDisplay, UITableProvider, UITableRemoveButton, UITableStatisticDisplay, UITableTooltip, UITableTooltipActions, UITableTooltipFilter, UITableUserDataDisplay, UITableWrapper };
+export { RowData, TTableBodyContext, TTableContext, TTableHeadRowContext, TTableInnerTableContext, TTableInnerWrapperContext, TTableRowContext, TTableVirtualizerContext, TUITableBody, TUITableCell, TUITableCellActions, TUITableCellSelect, TUITableColumn, TUITableEmptyDisplay, TUITableFooter, TUITableHead, TUITableHeadCell, TUITableHeadCellOption, TUITableHeadCellSelect, TUITableHeadRow, TUITableInnerTable, TUITableInnerWrapper, TUITableLoadMore, TUITableRow, TUITableWrapper, TableProviderProps, UITableBadgeDisplay, UITableBody, UITableBooleanDisplay, UITableCell, UITableCellActions, UITableCellSelect, UITableContainer, UITableDateDisplay, UITableDescriptionDisplay, UITableEmptyDisplay, UITableFilter, UITableFooter, UITableHead, UITableHeadCell, UITableHeadCellOption, UITableHeadCellSelect, UITableHeadRow, UITableInnerTable, UITableInnerWrapper, UITableLoadMore, UITableMoreButton, UITableNameDisplay, UITablePermalink, UITablePhoneNumberDisplay, UITableProvider, UITableRemoveButton, UITableRow, UITableStatisticDisplay, UITableTooltip, UITableTooltipActions, UITableTooltipFilter, UITableUserDataDisplay, UITableWrapper };
 //# sourceMappingURL=index.d.cts.map

package/dist/features/tables/index.d.mts

@@ -1,7 +1,8 @@
-import { t as Input } from "../../input-B6-pu-dE.mjs";
-import * as react_jsx_runtime350 from "react/jsx-runtime";
-import * as react241 from "react";
-import { AccessorKeyColumnDef, ColumnPinningState, RowData, RowSelectionState, Table } from "@tanstack/react-table";
+import { t as AnyEntity } from "../../types-BpHcqlOI.mjs";
+import { t as Input } from "../../input-Dv7UKl6Z.mjs";
+import * as react267 from "react";
+import * as react_jsx_runtime346 from "react/jsx-runtime";
+import { AccessorKeyColumnDef, CellContext, Column, ColumnPinningPosition, ColumnPinningState, Header, HeaderGroup, Row, RowSelectionState, Table } from "@tanstack/react-table";
 import { VirtualItem, Virtualizer } from "@tanstack/react-virtual";
 
 //#region packages/components/features/tables/components/atoms/badge-display.d.ts
@@ -72,7 +73,7 @@ type Props$1 = {
   size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
   value: number | string | null | undefined;
 };
-declare const UITableStatisticDisplay: react241.MemoExoticComponent<({
+declare const UITableStatisticDisplay: react267.MemoExoticComponent<({
   decimalSeparator,
   groupSeparator,
   prefix: Prefix,
@@ -82,7 +83,7 @@ declare const UITableStatisticDisplay: react241.MemoExoticComponent<({
   showTrailingZeros,
   size,
   value
-}: Props$1) => react_jsx_runtime350.JSX.Element>;
+}: Props$1) => react_jsx_runtime346.JSX.Element>;
 //#endregion
 //#region packages/components/features/tables/components/atoms/user.d.ts
 type Props = {
@@ -92,56 +93,174 @@ type Props = {
 };
 declare const UITableUserDataDisplay: React.FC<Props>;
 //#endregion
-//#region packages/components/features/tables/components/table.d.ts
-declare const UITableWrapper: React.FC<React.PropsWithChildren<React.ComponentProps<'div'>>>;
-declare const UITableFooter: React.FC<React.PropsWithChildren>;
-declare const UITableContainer: React.FC<React.PropsWithChildren>;
-//#endregion
-//#region packages/components/features/tables/components/table/filter.d.ts
-declare const UITableFilter: () => react_jsx_runtime350.JSX.Element;
-//#endregion
 //#region packages/components/features/tables/types.d.ts
-type TUITableColumn<TData extends RowData> = Pick<AccessorKeyColumnDef<TData, unknown>, 'id' | 'accessorKey' | 'size' | 'maxSize' | 'minSize' | 'header' | 'cell' | 'meta'> & {
+type RowData<TData extends RowData<AnyEntity>> = {
+  [x: string | number | symbol]: AnyEntity;
+  subRows?: TData[] | undefined;
+};
+type TUITableEmptyDisplay = {
+  isFetching?: boolean;
+  isEmpty?: boolean;
+};
+type TUITableWrapper = React.PropsWithChildren<React.ComponentProps<'div'>>;
+type TUITableInnerWrapper = React.PropsWithChildren<React.ComponentProps<'div'>>;
+type TUITableInnerTable = React.PropsWithChildren<React.ComponentProps<'table'>>;
+type TUITableHead = React.PropsWithChildren<React.ComponentProps<'thead'>>;
+type TUITableHeadCellOption = {
+  isPinned?: ColumnPinningPosition;
+  isVisible?: boolean;
+  className?: string;
+  onLeftPin?: (pos: ColumnPinningPosition) => void;
+  onRightPin?: (pos: ColumnPinningPosition) => void;
+  onUnpin?: (pos: ColumnPinningPosition) => void;
+  onToggleVisibility?: (props: AnyEntity) => void;
+};
+type TUITableHeadCellSelect = React.ComponentProps<'th'> & {
+  isPinned?: ColumnPinningPosition;
+  isAllRowsSelected?: boolean;
+  onToggleAllRowsSelected?: (value?: boolean) => void;
+};
+type TUITableHeadRow = React.PropsWithChildren<React.ComponentProps<'tr'> & {
+  headerGroup: HeaderGroup<unknown>;
+  onToggleAllRowsSelected?: (value?: boolean) => void;
+}>;
+type TUITableHeadCell = React.PropsWithChildren<React.ComponentProps<'th'> & {
+  isVisible?: boolean;
+  isPinned?: ColumnPinningPosition;
+  isFirstCell?: boolean;
+  isLastCell?: boolean;
+  isOptionsVisible?: boolean;
+  headerId?: string;
+  headerColumn?: Column<unknown, unknown>;
+  onColumnPin?: (pos: ColumnPinningPosition) => void;
+  onToggleVisibility?: (value?: boolean) => void;
+}>;
+type TUITableBody = React.PropsWithChildren<React.ComponentProps<'tbody'> & {
+  isFetching?: boolean;
+  isEmpty?: boolean;
+  height: string;
+}>;
+type TUITableRow = React.ComponentProps<'tr'> & {
+  row: Row<AnyEntity>;
+  isSelected?: boolean;
+  virtualRowIndex: number;
+  virtualRowStart: number;
+};
+type TUITableCellSelect = React.ComponentProps<'td'> & {
+  isPinned?: ColumnPinningPosition;
+  isSelected?: boolean;
+  onToggleRowSelected?: (value?: boolean) => void;
+};
+type TUITableCellActions = React.ComponentProps<'td'> & {
+  virtualRowIndex: number;
+  column?: Column<unknown, unknown>;
+  getContext: () => CellContext<unknown, unknown>;
+};
+type TUITableCell = React.ComponentProps<'td'> & {
+  isPinned?: ColumnPinningPosition;
+  isFirstCell?: boolean;
+  isLastCell?: boolean;
+  colId?: string;
+  cellId?: string;
+  position?: 'start' | 'center' | 'end';
+  column?: Column<unknown, unknown>;
+  getContext: () => CellContext<unknown, unknown>;
+};
+type TUITableFooter = React.PropsWithChildren<React.ComponentProps<'tfoot'>>;
+type TUITableLoadMore = React.PropsWithChildren<React.ComponentProps<'tr'> & {
+  virtualRowIndex: number;
+  virtualRowStart: number;
+  fetchMoreData?: () => void | Promise<void>;
+}>;
+type TUITableColumn<TData extends RowData<TData>> = Pick<AccessorKeyColumnDef<TData, AnyEntity>, 'id' | 'accessorKey' | 'size' | 'maxSize' | 'minSize' | 'header' | 'cell' | 'meta'> & {
   meta?: {
-    position: 'start' | 'center' | 'end';
+    position?: 'start' | 'center' | 'end';
+    fitContent?: boolean;
   };
 };
-type TTableContext<TData extends RowData> = {
+type TTableContext<TData extends RowData<TData>> = {
   title: string;
   table: Table<TData>;
-  data: TData[];
   isEmpty: boolean;
   isFetching?: boolean;
   isRefetching?: boolean;
   totalRows?: number;
-  rowSelection: RowSelectionState;
-  columnPinning: ColumnPinningState;
   fetchMoreData?: () => void | Promise<void>;
 };
-type TTableClickRow<TData extends RowData, TKey extends keyof TData = keyof TData> = {
+type TTableInnerWrapperContext = {
+  innerWrapperId: string;
+};
+type TTableInnerTableContext = {
+  table: Table<AnyEntity>;
+  innerTableId: string;
+  totalSize: number;
+};
+type TTableHeadRowContext = {
+  isAllRowsSelected: boolean;
+  columnPinningState: ColumnPinningState;
+  leftPinnedHeaders: Header<AnyEntity, unknown>[];
+  rightPinnedHeaders: Header<AnyEntity, unknown>[];
+  onToggleAllRowsSelected?: (value?: boolean) => void;
+};
+type TTableBodyContext = {
+  isFetching: boolean;
+  isEmpty: boolean;
+  rowSelectionState: RowSelectionState;
+};
+type TTableRowContext<TData extends RowData<TData> = RowData<AnyEntity>, TKey extends keyof TData = keyof TData> = {
   keyOfClickRow?: TKey;
-  onClickRow?: (rowIndex: number, rowId?: TData[TKey]) => void;
+  isAllRowsSelected?: boolean;
+  columnPinningState: ColumnPinningState;
+  onClickRow?: (rowIndex: number, rowId?: AnyEntity) => void;
+  leftPinnedHeaders?: Header<TData, unknown>[];
+  rightPinnedHeaders?: Header<TData, unknown>[];
 };
 type TTableVirtualizerContext = {
   rowVirtualizer: Virtualizer<HTMLDivElement, HTMLTableRowElement>;
   virtualItems: VirtualItem[];
 };
-type TableProviderProps<TData extends RowData, TKey extends keyof TData> = {
+type TableProviderProps<TData extends RowData<TData>, TKey extends keyof TData = keyof TData, TColumns extends ReadonlyArray<TUITableColumn<TData>> = TUITableColumn<TData>[]> = {
   title: string;
   isFetching?: boolean;
   isRefetching?: boolean;
   data: TData[];
-  columns: TUITableColumn<TData>[];
+  columns: TColumns;
   totalRows?: number;
   fetchMoreData?: () => void | Promise<void>;
-  leftPinnedColumns?: string[];
-  rightPinnedColumns?: string[];
-  keyOfClickRow?: TTableClickRow<TData, TKey>['keyOfClickRow'];
-  onClickRow?: TTableClickRow<TData, TKey>['onClickRow'];
+  leftPinnedColumns?: Array<TColumns[number]['accessorKey']>;
+  rightPinnedColumns?: Array<TColumns[number]['accessorKey']> | string[];
+  keyOfClickRow?: TTableRowContext<TData, TKey>['keyOfClickRow'];
+  onClickRow?: TTableRowContext<TData, TKey>['onClickRow'];
+  onRowSelection?: (rowSelection: RowSelectionState) => void;
+  onColumnPinning?: (columnPinning: ColumnPinningState) => void;
 };
 //#endregion
+//#region packages/components/features/tables/components/common.d.ts
+declare const UITableHeadCellOption: react267.NamedExoticComponent<TUITableHeadCellOption>;
+declare const UITableHeadCellSelect: react267.NamedExoticComponent<TUITableHeadCellSelect>;
+declare const UITableEmptyDisplay: react267.NamedExoticComponent<TUITableEmptyDisplay>;
+declare const UITableWrapper: react267.NamedExoticComponent<TUITableWrapper>;
+declare const UITableInnerWrapper: react267.NamedExoticComponent<TUITableInnerWrapper>;
+declare const UITableInnerTable: react267.NamedExoticComponent<TUITableInnerTable>;
+declare const UITableHead: react267.NamedExoticComponent<TUITableHead>;
+declare const UITableHeadRow: react267.NamedExoticComponent<TUITableHeadRow>;
+declare const UITableHeadCell: react267.NamedExoticComponent<TUITableHeadCell>;
+declare const UITableBody: react267.NamedExoticComponent<TUITableBody>;
+declare const UITableRow: react267.NamedExoticComponent<TUITableRow>;
+declare const UITableCellSelect: react267.NamedExoticComponent<TUITableCellSelect>;
+declare const UITableCellActions: react267.NamedExoticComponent<TUITableCellActions>;
+declare const UITableCell: react267.NamedExoticComponent<TUITableCell>;
+declare const UITableFooter: react267.NamedExoticComponent<TUITableFooter>;
+declare const UITableLoadMore: react267.NamedExoticComponent<TUITableLoadMore>;
+//#endregion
+//#region packages/components/features/tables/components/table.d.ts
+declare const UITableContainer: React.FC<React.PropsWithChildren>;
+//#endregion
+//#region packages/components/features/tables/components/table/filter.d.ts
+declare const UITableFilter: () => react_jsx_runtime346.JSX.Element;
+//#endregion
 //#region packages/components/features/tables/components/table/provider.d.ts
-declare const UITableProvider: <TData extends RowData, TKey extends keyof TData>({
+declare const UITableProvider: <TData extends RowData<TData> = RowData<AnyEntity>, TKey extends keyof TData = keyof TData, TColumns extends ReadonlyArray<TUITableColumn<TData>> = TUITableColumn<TData>[]>({
   title,
   isFetching,
   isRefetching,
@@ -152,9 +271,11 @@ declare const UITableProvider: <TData extends RowData, TKey extends keyof TData>
   rightPinnedColumns,
   keyOfClickRow,
   onClickRow,
+  onRowSelection,
+  onColumnPinning,
   fetchMoreData,
   children
-}: React.PropsWithChildren<TableProviderProps<TData, TKey>>) => react_jsx_runtime350.JSX.Element;
+}: React.PropsWithChildren<TableProviderProps<TData, TKey, TColumns>>) => react_jsx_runtime346.JSX.Element;
 //#endregion
 //#region packages/components/features/tables/components/table/tooltip.d.ts
 declare const UITableTooltipFilter: React.FC<Omit<React.ComponentProps<typeof Input>, 'className'> & {
@@ -167,5 +288,5 @@ declare const UITableTooltipActions: React.FC<{
 }>;
 declare const UITableTooltip: React.FC<React.PropsWithChildren>;
 //#endregion
-export { TTableClickRow, TTableContext, TTableVirtualizerContext, TUITableColumn, TableProviderProps, UITableBadgeDisplay, UITableBooleanDisplay, UITableContainer, UITableDateDisplay, UITableDescriptionDisplay, UITableFilter, UITableFooter, UITableMoreButton, UITableNameDisplay, UITablePermalink, UITablePhoneNumberDisplay, UITableProvider, UITableRemoveButton, UITableStatisticDisplay, UITableTooltip, UITableTooltipActions, UITableTooltipFilter, UITableUserDataDisplay, UITableWrapper };
+export { RowData, TTableBodyContext, TTableContext, TTableHeadRowContext, TTableInnerTableContext, TTableInnerWrapperContext, TTableRowContext, TTableVirtualizerContext, TUITableBody, TUITableCell, TUITableCellActions, TUITableCellSelect, TUITableColumn, TUITableEmptyDisplay, TUITableFooter, TUITableHead, TUITableHeadCell, TUITableHeadCellOption, TUITableHeadCellSelect, TUITableHeadRow, TUITableInnerTable, TUITableInnerWrapper, TUITableLoadMore, TUITableRow, TUITableWrapper, TableProviderProps, UITableBadgeDisplay, UITableBody, UITableBooleanDisplay, UITableCell, UITableCellActions, UITableCellSelect, UITableContainer, UITableDateDisplay, UITableDescriptionDisplay, UITableEmptyDisplay, UITableFilter, UITableFooter, UITableHead, UITableHeadCell, UITableHeadCellOption, UITableHeadCellSelect, UITableHeadRow, UITableInnerTable, UITableInnerWrapper, UITableLoadMore, UITableMoreButton, UITableNameDisplay, UITablePermalink, UITablePhoneNumberDisplay, UITableProvider, UITableRemoveButton, UITableRow, UITableStatisticDisplay, UITableTooltip, UITableTooltipActions, UITableTooltipFilter, UITableUserDataDisplay, UITableWrapper };
 //# sourceMappingURL=index.d.mts.map

package/dist/features/tables/index.mjs

@@ -1,2 +1,2 @@
-import"../../button.variants-DBOg9vCn.mjs";import{t as e}from"../../button-BlQN92Jt.mjs";import{t}from"../../flex-_tvOU0u1.mjs";import{t as n}from"../../paragraph-C83yi9US.mjs";import{t as r}from"../../date-Bznq86tY.mjs";import{t as i}from"../../badge-CJ-SG_OK.mjs";import{i as a,n as o,r as s,t as c}from"../../tooltip-Dd1torAV.mjs";import{n as l,t as u}from"../../avatar-DjCXs3FZ.mjs";import{t as d}from"../../separator-CWar33xc.mjs";import{a as f,d as p,h as m,i as h,r as g,t as _,u as v}from"../../dropdown-menu-BwcDzb4B.mjs";import{t as y}from"../../checkbox-D4K3ZATY.mjs";import{n as b,r as x,t as S}from"../../resizable-BfkKNflf.mjs";import{t as ee}from"../../input-CqN74taK.mjs";import{cn as C}from"@customafk/react-toolkit/utils";import{Fragment as te,jsx as w,jsxs as T}from"react/jsx-runtime";import{ArrowRightIcon as ne,BoxIcon as re,CheckIcon as ie,CirclePlus as ae,Columns4Icon as oe,DownloadIcon as se,EllipsisVerticalIcon as ce,ExternalLinkIcon as E,EyeOffIcon as le,ListFilterIcon as ue,ListFilterPlus as de,LoaderIcon as D,MinusIcon as O,MoreVerticalIcon as fe,MoveLeftIcon as pe,MoveRightIcon as me,PinOffIcon as he,RefreshCwIcon as ge,SearchIcon as _e,Trash2Icon as ve,UserRoundIcon as k,XIcon as A}from"lucide-react";import{Activity as j,createContext as M,memo as N,use as P,useCallback as F,useEffect as ye,useMemo as I,useRef as be,useState as L}from"react";import{colorHashLight as xe}from"@customafk/react-toolkit/color-hash";import{flexRender as R,getCoreRowModel as Se,getExpandedRowModel as Ce,getGroupedRowModel as we,useReactTable as Te}from"@tanstack/react-table";import{useVirtualizer as Ee}from"@tanstack/react-virtual";import{useDebounceCallback as De}from"@customafk/react-toolkit/hooks/useDebounceCallback";const z=()=>T(`div`,{className:`flex gap-0 text-text-positive-weak`,children:[w(O,{size:16}),w(O,{size:16})]}),Oe=({label:e,onClick:t,onRemove:n})=>e?n?T(`div`,{className:`flex w-fit gap-x-0.5 rounded-full border border-border py-1 pr-2 pl-3 text-text-positive text-xs shadow-xs`,onClick:e=>{t?.(),e.stopPropagation(),e.preventDefault()},children:[e,w(`button`,{className:`cursor-pointer text-text-positive-weak hover:text-text-positive-strong`,onClick:e=>{n?.(),e.stopPropagation(),e.preventDefault()},children:w(A,{size:12})})]}):w(`button`,{className:`w-fit rounded-full border border-border px-3 py-1 text-text-positive text-xs shadow-xs`,onClick:e=>{t?.(),e.stopPropagation(),e.preventDefault()},children:e}):w(z,{}),ke=({value:e})=>e==null?w(z,{}):e===!1?w(`div`,{className:`text-danger-strong`,children:w(A,{})}):w(`div`,{className:`text-success-strong`,children:w(ie,{})}),Ae=({date:e})=>e==null?w(z,{}):w(s,{children:T(c,{children:[w(a,{asChild:!0,children:w(i,{className:`h-fit`,children:w(r,{date:e,format:`medium`,className:`font-normal text-white`})})}),w(o,{className:`rounded`,children:w(r,{date:e,format:`full`,showTime:!0,className:`font-medium text-text-negative text-xs`})})]})}),je=({content:e})=>e==null?w(z,{}):T(c,{children:[w(a,{asChild:!0,children:w(`div`,{className:`line-clamp-2 whitespace-pre-line break-all text-start text-[13px] text-text-positive-weak`,children:e})}),w(o,{align:`start`,className:`h-fit min-w-48 max-w-80 pt-4`,children:T(`div`,{className:`flex flex-col gap-y-2`,children:[w(`p`,{className:`whitespace-pre-line text-wrap break-keep`,children:e}),T(`p`,{className:`w-full text-end`,children:[e.toString().length,` chars`]})]})})]}),Me=({items:t=[]})=>T(_,{children:[w(m,{asChild:!0,children:w(e,{size:`sm`,variant:`ghost`,color:`secondary`,className:`size-9 rounded-full`,children:w(fe,{})})}),w(g,{children:w(h,{children:t.map(e=>w(f,{className:`px-3`,onSelect:t=>{e.onClick(e.id),t.stopPropagation()},children:e.label},e.id))})})]}),Ne=({name:e})=>e?T(c,{children:[w(a,{children:w(n,{variant:`sm`,className:`line-clamp-2 w-full truncate text-wrap pb-px text-start text-sm`,children:e})}),w(o,{align:`start`,className:`h-fit min-w-48 max-w-80 pt-4`,children:T(`div`,{className:`flex flex-col gap-y-2`,children:[w(`p`,{className:`whitespace-pre-line text-wrap break-keep`,children:e}),T(`p`,{className:`w-full text-end`,children:[e.length,` chars`]})]})})]}):w(z,{}),Pe=({href:e,label:t})=>T(`a`,{href:e,target:`_blank`,className:`inline-flex items-center gap-1 truncate text-primary text-sm underline`,rel:`noopener noreferrer`,children:[w(`span`,{children:t||e}),w(E,{size:14})]}),Fe=({value:e})=>T(c,{children:[w(a,{asChild:!0,children:w(`p`,{className:`font-number text-secondary-foreground text-sm tabular-nums`,children:e.replace(/(\d{3})(\d{3})(\d{4})/,`($1) $2-$3`)})}),w(o,{align:`start`,children:w(`p`,{className:`tabular-nums`,children:e.slice(1).replace(/(\d{2})(\d{3})(\d{4})/,`(00) (+84) ($1) $2-$3`)})})]}),Ie=({title:t,onClick:n})=>T(c,{children:[w(a,{children:w(e,{type:`button`,variant:`ghost`,color:`danger`,size:`icon`,onClick:F(async e=>{e.preventDefault(),e.stopPropagation(),await n?.()},[n]),children:w(ve,{})})}),w(o,{children:w(`p`,{children:t||`Remove item from list table`})})]}),Le=(e,t,n)=>{let r=10**t;switch(n){case`floor`:return Math.floor(e*r)/r;case`ceil`:return Math.ceil(e*r)/r;default:return Math.round(e*r)/r}},B=N(({decimalSeparator:e=`.`,groupSeparator:n=`,`,prefix:r,suffix:i,precision:a,roundingMode:o=`round`,showTrailingZeros:s=!1,size:c=`lg`,value:l=0})=>{let u=I(()=>{let e={};return typeof a==`number`&&a>=0&&s&&(e.minimumFractionDigits=a),e.maximumFractionDigits=a,e},[a,s]),d=F(e=>{let t=e;return typeof a==`number`&&a>=0&&(t=Le(e,a,o)),t.toLocaleString(`en-US`,u)},[o,u,a]),f=I(()=>{if(typeof l==`number`)return Number.isNaN(l)||!Number.isFinite(l)?`N/A`:d(l);if(typeof l==`string`){let e=l.trim();if(!e)return`N/A`;let t=Number(e);return Number.isNaN(t)||!Number.isFinite(t)?`N/A`:d(t)}return`N/A`},[l,d]),p=I(()=>e===`.`&&n===`,`?f:f.replace(/,/g,n).replace(/\./g,e),[f,e,n]);return p===`0`||p===`N/A`||!p?w(z,{}):T(t,{padding:`none`,className:C(`font-number text-lg text-secondary-foreground tabular-nums`,c===`xs`&&`text-xs`,c===`sm`&&`text-sm`,c===`md`&&`text-base`,c===`lg`&&`text-lg`,c===`xl`&&`text-xl`),children:[r,w(`p`,{children:p}),i]})});B.displayName=`UITableStatisticDisplay`;const Re=({uuid:e,username:r,email:i})=>T(t,{wrap:!1,gap:`sm`,padding:`none`,children:[!e&&w(u,{className:`size-10 shadow-card`,children:w(l,{className:`bg-muted-weak`,children:w(k,{size:28,className:`text-text-negative`})})}),e&&w(u,{className:`size-10 shadow-card`,children:w(l,{style:{backgroundColor:xe.hex(e)},children:w(k,{size:28,className:`text-white`})})}),T(t,{vertical:!0,padding:`none`,gap:`none`,align:`start`,children:[w(n,{className:`font-medium text-sm text-text-positive-weak`,children:r??`Unknown User`}),w(n,{variant:`sm`,className:`mt-0! text-text-positive-weak text-xs`,children:i})]})]}),V=M(null),ze=()=>{let e=P(V);if(!e)throw Error(`useUITableClickRowContext must be used within a TableClickRowProvider`);return e},H=M(null),U=()=>{let e=P(H);if(!e)throw Error(`useTableContext must be used within a TableProvider`);return e},W=e=>{let t=e.getIsPinned();return{zIndex:t?20:void 0,left:t===`left`?`${e.getStart(`left`)}px`:void 0,right:t===`right`?`${e.getAfter(`right`)}px`:void 0}},Be=({className:e,children:t,...n})=>w(`div`,{"data-slot":`table-wrapper`,className:`relative m-0 flex size-full flex-col flex-nowrap items-start justify-start gap-2 py-2.5 text-sm`,...n,children:t}),G=N(({children:e})=>w(`thead`,{"data-slot":`table-header`,style:{zIndex:20},className:C(`sticky top-0 grid bg-muted-bg-subtle text-[13px] text-text-positive-weak`,`[&_tr:not(:last-child)_td]:border-b`,`[&_th]:flex`,`[&_th]:h-9`,`[&_th]:select-none`,`[&_th]:items-center`,`[&_th]:whitespace-nowrap`,`[&_th]:border-border`,`[&_th]:font-medium`,`[&_th]:text-left`,`[&_th]:align-middle`,`[&_th]:last:border-r-0`,`[&_th]:first:border-l-0`,`[&_tr_th:not([data-pinned=false])]:bg-muted-bg-subtle`),children:e}));G.displayName=`TableHeader`;const K=N(({children:e})=>w(`tr`,{"data-slot":`table-header-row`,className:`flex w-full border-border border-b shadow`,children:e}));K.displayName=`TableHeaderRow`;const Ve=({header:e,isPinned:t,isResizing:n,isAllRowsSelected:r,children:i,...a})=>{let o=e.getContext().table.getLeftHeaderGroups()[0].headers,s=e.getContext().table.getRightHeaderGroups()[0].headers,c=o[o.length-1]?.id,l=s[0]?.id,u=W(e.column),d=`calc(var(--header-${e.id}-size) * 1px)`;return e.id===`select`?w(`th`,{"data-slot":`table-header-cell`,style:{...u,width:60},className:C(t?`sticky`:`relative`),...a,children:w(`div`,{className:`absolute inset-0 flex items-center justify-center`,children:w(y,{"aria-label":`Select All Rows`,checked:r,onCheckedChange:t=>{e.getContext().table.toggleAllRowsSelected(!!t)}})})}):T(`th`,{"data-slot":`table-header-cell`,"data-pinned":t,style:{...u,width:d},colSpan:e.colSpan,className:C(`group relative`,t?`sticky`:`relative`,t===`left`&&e.id===c&&`border-r border-r-border`,t===`right`&&e.id===l&&`border-l border-l-border`),...a,children:[w(`div`,{className:`absolute inset-0 gap-1 truncate`,children:w(`div`,{className:`flex h-full flex-1 cursor-pointer select-none items-center justify-between`,children:w(`div`,{className:`flex size-full flex-1 items-center truncate pl-4`,children:R(e.column.columnDef.header,e.getContext())})})}),![`select`,`actions`].includes(e.id)&&w(He,{isPinned:t,isVisible:e.column.getIsVisible(),className:`invisible absolute right-2 z-10 group-hover:visible`,onLeftPin:e.column.pin,onRightPin:e.column.pin,onUnpin:e.column.pin,onToggleVisibilityHandler:e.column.toggleVisibility}),w(j,{mode:t?`hidden`:`visible`,children:w(`div`,{onDoubleClick:e.column.resetSize,onMouseDown:e.getResizeHandler(),onTouchStart:e.getResizeHandler(),className:C(`absolute inset-y-0 -right-0.5 w-1 cursor-e-resize bg-transparent hover:bg-border`,n&&`bg-border`)})})]})},He=({isPinned:e,className:t,onLeftPin:n,onRightPin:r,onUnpin:i,onToggleVisibilityHandler:a})=>{let o=F(()=>{n(`left`)},[n]),s=F(()=>{r(`right`)},[r]),c=F(()=>{i(!1)},[i]);return T(_,{children:[w(m,{asChild:!0,children:w(`button`,{className:C(`cursor-pointer rounded-full p-0.5 text-text-positive-weak hover:bg-muted-muted hover:text-text-positive [&>svg]:size-4`,t),children:w(ce,{})})}),T(g,{align:`end`,className:`w-64 p-4`,children:[T(h,{className:`*:data-[slot=dropdown-menu-item]:rounded-xs *:data-[slot=dropdown-menu-item]:p-2`,children:[w(j,{mode:e?`visible`:`hidden`,children:T(f,{onClick:c,children:[!!e&&`Unpin`,w(p,{children:w(he,{className:`size-4`})})]})}),T(j,{mode:e?`hidden`:`visible`,children:[T(f,{onClick:o,children:[e?`Unpin`:`Pin to Left`,w(p,{children:w(pe,{className:`size-4`})})]}),T(f,{onClick:s,children:[e?`Unpin`:`Pin to Right`,w(p,{children:w(me,{className:`size-4`})})]})]})]}),w(v,{}),w(h,{className:`*:data-[slot=dropdown-menu-item]:rounded-xs *:data-[slot=dropdown-menu-item]:p-2`,children:T(f,{onClick:()=>a(!1),children:[`Hide Field`,w(p,{children:w(le,{className:`size-4`})})]})})]})]})},Ue=({height:e,children:t,...n})=>w(`tbody`,{"data-slot":`table-body`,style:{height:`${e}px`},className:C(`relative grid w-full bg-card`,`[&_tr]:absolute [&_tr]:flex [&_tr]:w-full [&_tr]:cursor-pointer [&_tr]:border-b [&_tr]:border-b-border [&_tr]:focus:outline-none`,`[&_td]:z-10`,`[&_td]:flex`,`[&_td]:overflow-hidden`,`[&_td]:whitespace-nowrap`,`[&_td]:px-4`,`[&_td]:py-2.5`,`[&_td]:align-middle`,`[&_td]:border-border`,`[&_td:not([data-pinned=false])]:bg-card`),...n,children:t}),q=N(({children:e,keyOfClickRow:t,row:n,virtualRow:r,rowVirtualizer:i,onClickRow:a,className:o,...s})=>{let{columnPinning:c}=U(),l=F(e=>{let i=t?n.original?.[t]:void 0;typeof i==`string`||typeof i==`number`?a?.(r.index,i):a?.(r.index),e.preventDefault(),e.stopPropagation()},[t,a,n.original,r.index]);return w(`tr`,{"data-slot":`table-row`,"data-index":r.index,ref:e=>i.measureElement(e),style:{transform:`translateY(${r.start}px)`},className:C(`group`,o),onClick:l,...s,children:n.getVisibleCells().map(e=>w(J,{cell:e,className:`group-hover:bg-muted-bg-subtle!`},e.id))})});q.displayName=`TableRow`;const J=N(({cell:e,children:t,className:n,...r})=>{let{rowSelection:i}=U(),a=e.column.getIsPinned(),o=e.getContext().table.getLeftHeaderGroups()[0].headers,s=e.getContext().table.getRightHeaderGroups()[0].headers,c=o[o.length-1]?.id,l=s[0]?.id,u=W(e.column),d=`calc(var(--col-${e.column.id}-size) * 1px)`,f=e.column.columnDef.meta?.position??`start`;return e.column.id===`select`?w(`td`,{"data-slot":`table-cell`,style:{...u,width:60},className:C(`border-none! bg-transparent! shadow-none!`,a?`sticky`:`relative`,n),...r,children:w(`div`,{"data-slot":`table-cell-inner`,className:`inline-flex w-full items-center justify-center bg-transparent text-center align-middle`,children:w(y,{"aria-label":`Select Row`,checked:e.row.getIsSelected(),onCheckedChange:t=>{e.row.toggleSelected(!!t)}})})}):w(`td`,{"data-slot":`table-cell`,"data-pinned":a,style:{...u,width:d},className:C(a&&`sticky`,!a&&`relative`,a===`left`&&e.column.id===c&&`border-r border-r-border`,a===`right`&&e.column.id===l&&`border-l border-l-border`,n),...r,children:w(`div`,{"data-slot":`table-cell-inner`,className:C(`inline-flex w-full items-center bg-transparent text-center align-middle`,f===`start`&&`justify-start`,f===`center`&&`justify-center`,f===`end`&&`justify-end`),children:R(e.column.columnDef.cell,e.getContext())})})});J.displayName=`TableCell`;const Y=N(()=>w(`div`,{className:`sticky left-0 flex min-h-96 flex-1 items-center justify-center bg-transparent text-text-positive-weak opacity-100`,children:T(`div`,{className:`flex flex-col items-center gap-1`,children:[w(re,{strokeWidth:1,size:48}),w(`p`,{children:`No data available`})]})}));Y.displayName=`EmptyDisplay`;const X=N(()=>w(`div`,{className:`absolute top-0 z-30 flex size-full items-center justify-center bg-black/10`,children:w(D,{className:`animate-spin text-text-positive`})}));X.displayName=`RefetchingDisplay`;const We=({children:e})=>w(`tfoot`,{"data-slot":`table-footer`,className:`flex w-full justify-center border-border-weak border-t py-2 font-medium [&>tr]:last:border-b-0`,children:e}),Z=({children:e})=>{let{table:t,isEmpty:n,isRefetching:r,isFetching:i,data:a,totalRows:o,fetchMoreData:s}=U(),{keyOfClickRow:c,onClickRow:l}=ze(),u=be(null),d=I(()=>{let e=t.getFlatHeaders(),n={};return e.forEach(e=>{n[`--header-${e.id}-size`]=e.getSize()||0,n[`--col-${e.column.id}-size`]=e.column.getSize()||0}),n},[t.getState().columnSizingInfo,t.getState().columnSizing]),f=F(async e=>{if(!e)return null;let{scrollHeight:t,scrollTop:n,clientHeight:r}=e;t-n-r<500&&!i&&o&&a.length<o&&s?.()},[i,a.length,o,s]);ye(()=>{f(u.current)},[f]);let{rows:p}=t.getRowModel(),m=Ee({count:p.length,estimateSize:()=>40,getScrollElement:()=>u.current,measureElement:typeof window<`u`&&navigator.userAgent.indexOf(`Firefox`)===-1?e=>e?.getBoundingClientRect().height:void 0,overscan:2});return T(x,{direction:`horizontal`,style:{direction:t.options.columnResizeDirection},className:C(`relative flex w-full max-w-full flex-1 gap-1 overflow-auto border-t border-t-border bg-slate-50 p-0 text-sm`,!e&&`border-r border-r-border`),children:[T(b,{className:`relative overflow-auto`,children:[T(`div`,{ref:u,className:`relative size-full overflow-auto border-b border-b-border border-l border-l-border`,onScroll:e=>f(e.currentTarget),children:[T(`table`,{"data-slot":`table`,style:{...d,width:t.getTotalSize()},className:`grid w-full max-w-full caption-bottom border-collapse border-spacing-0 flex-col content-start bg-card text-sm tabular-nums [&_tfoot_td]:border-t`,children:[w(G,{children:t.getHeaderGroups().map(e=>w(K,{children:e.headers.map(e=>w(Ve,{header:e,isPinned:e.column.getIsPinned(),isResizing:e.column.getIsResizing(),isAllRowsSelected:t.getIsAllRowsSelected()},e.id))},e.id))}),w(Ue,{"data-slot":`table-body`,height:m.getTotalSize(),children:m.getVirtualItems().map(e=>{let t=p[e.index];return w(q,{"data-index":e.index,keyOfClickRow:c,row:t,virtualRow:e,rowVirtualizer:m,onClickRow:l},t.id)})})]}),n&&w(Y,{})]}),r&&w(X,{})]}),!!e&&T(te,{children:[w(S,{}),e]})]})},Ge=({checked:e,title:t,onCheckedChange:n})=>T(`div`,{className:`flex h-fit items-center gap-2`,children:[w(y,{checked:e,onCheckedChange:n}),w(`p`,{className:`text-sm`,children:t})]}),Ke=()=>{let{table:t}=U(),[n,r]=L(null);return w(b,{defaultSize:25,className:C(`bg-card`,n===null?`max-w-8!`:`min-w-64`),children:T(`div`,{className:`relative z-20 flex size-full bg-muted-bg-subtle`,children:[T(`div`,{className:`flex-1`,children:[w(j,{mode:n===`columns`?`visible`:`hidden`,children:T(`div`,{className:`flex size-full flex-col gap-2 p-4`,children:[w(`p`,{className:`px-2 font-medium`,children:`Columns Visibility`}),w(d,{}),w(`div`,{className:`flex flex-col gap-4 pt-4`,children:t.getAllColumns().map(e=>[`select`,`actions`].includes(e.id)?null:w(Ge,{checked:e.getIsVisible(),title:String(e.columnDef.header),onCheckedChange:t=>e.toggleVisibility(!!t)},e.id))})]})}),w(j,{mode:n===`filters`?`visible`:`hidden`,children:w(`div`,{className:`flex size-full flex-col p-2`,children:T(e,{variant:`outline`,color:`muted`,children:[w(de,{}),`Add Filter`]})})})]}),T(`div`,{className:`flex h-full flex-col border-border border-l bg-muted-bg-subtle text-sm`,children:[T(`button`,{className:C(`flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4`,n===`columns`&&`bg-card`),onClick:()=>r(n===`columns`?null:`columns`),children:[w(oe,{size:18}),w(`span`,{className:`text-nowrap [writing-mode:vertical-lr]`,children:`Columns`})]}),w(d,{}),T(`button`,{className:C(`flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4`,n===`filters`&&`bg-card`),onClick:()=>r(n===`filters`?null:`filters`),children:[w(ue,{size:18}),w(`span`,{className:`text-nowrap [writing-mode:vertical-lr]`,children:`Filters`})]}),w(d,{})]})]})})},qe=({title:e,isFetching:t=!1,isRefetching:n=!1,data:r,columns:i,totalRows:a,leftPinnedColumns:o,rightPinnedColumns:s,keyOfClickRow:c,onClickRow:l,fetchMoreData:u,children:d})=>{let[f,p]=L({}),[m,h]=L({right:s,left:o}),[g,_]=L({}),v=Te({data:r,columns:i,state:{rowSelection:f,columnPinning:m,columnVisibility:g},defaultColumn:{minSize:40,size:150,maxSize:800},columnResizeMode:`onChange`,columnResizeDirection:`ltr`,enableColumnPinning:!0,enableRowSelection:!0,enableColumnResizing:!0,enableMultiRowSelection:!0,getCoreRowModel:Se(),getGroupedRowModel:we(),getExpandedRowModel:Ce(),onRowSelectionChange:p,onColumnPinningChange:h,onColumnVisibilityChange:_}),y=I(()=>{let{rows:e}=v.getRowModel();return e},[v.getRowModel().rows,v.getState().columnPinning]),b=I(()=>!t&&y.length===0,[y,t]),x=I(()=>({title:e,table:v,data:r,isEmpty:b,isFetching:t,isRefetching:n,totalRows:a,fetchMoreData:u,rowSelection:v.getState().rowSelection,columnPinning:v.getState().columnPinning}),[e,v,r,b,n,t,a,u,v.getState().columnVisibility,v.getState().rowSelection,v.getState().columnPinning]),S=I(()=>({keyOfClickRow:c,onClickRow:l}),[c,l]);return w(H.Provider,{value:x,children:w(V.Provider,{value:S,children:d})})},Je=({onSearch:e,onChange:t,...n})=>{let r=De(t=>{e?.(t)},500);return T(`div`,{className:`relative w-full max-w-80 flex-1`,children:[w(ee,{...n,size:`lg`,type:`search`,placeholder:`Search records...`,className:`flex-1 ps-9 pe-9`,onChange:e=>{t?.(e),r(e.target.value??``)}}),w(`div`,{className:`pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:w(_e,{size:16})}),w(`button`,{className:`absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:w(ne,{size:16,"aria-hidden":`true`})})]})},Q=({children:e,disabled:t,onClick:n})=>w(`button`,{type:`button`,disabled:t,className:`flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5`,onClick:n,children:e}),Ye=({onCreate:e,onDownload:t,onRefresh:n})=>T(`div`,{className:`flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none`,children:[w(Q,{disabled:!e,onClick:t=>{e?.(),t.stopPropagation(),t.preventDefault()},children:w(ae,{})}),w(Q,{disabled:!n,onClick:e=>{n?.(),e.stopPropagation(),e.preventDefault()},children:w(ge,{})}),w(Q,{disabled:!t,onClick:e=>{t?.(),e.stopPropagation(),e.preventDefault()},children:w(se,{})})]}),$=({children:e})=>{let{title:t}=U();return T(`div`,{"data-slot":`table-tooltip`,className:`relative m-0 flex w-full flex-0 flex-col flex-wrap items-start space-y-2 p-0 px-2 text-sm`,children:[w(`h3`,{className:`font-semibold text-base text-text-positive`,children:t}),w(`div`,{className:`flex w-full flex-1 justify-between gap-x-2`,children:e})]})};$.displayName=`TableTooltip`;export{Oe as UITableBadgeDisplay,ke as UITableBooleanDisplay,Z as UITableContainer,Ae as UITableDateDisplay,je as UITableDescriptionDisplay,Ke as UITableFilter,We as UITableFooter,Me as UITableMoreButton,Ne as UITableNameDisplay,Pe as UITablePermalink,Fe as UITablePhoneNumberDisplay,qe as UITableProvider,Ie as UITableRemoveButton,B as UITableStatisticDisplay,$ as UITableTooltip,Ye as UITableTooltipActions,Je as UITableTooltipFilter,Re as UITableUserDataDisplay,Be as UITableWrapper};
+import{t as e}from"../../paragraph-BTJV4aeF.mjs";import"../../button.variants-CL2rLGYO.mjs";import{t}from"../../button-C_yZHudZ.mjs";import{t as n}from"../../flex-BP8sTi70.mjs";import{t as r}from"../../date-CK7XBqG9.mjs";import{t as i}from"../../badge-B4Fa7-J3.mjs";import{i as a,n as o,r as s,t as c}from"../../tooltip-B3dTcgcc.mjs";import{n as l,t as u}from"../../avatar-DReNH6rV.mjs";import{t as d}from"../../separator-Bf0gymN4.mjs";import{a as f,d as p,h as m,i as h,r as g,t as _}from"../../dropdown-menu-B8GUTfTp.mjs";import{t as v}from"../../checkbox-Bg2FiuQw.mjs";import{t as y}from"../../spinner-D1v3Bard.mjs";import{n as b,r as ee}from"../../resizable-DXHfkbaz.mjs";import{t as te}from"../../input-DBtIgQB6.mjs";import{cn as x}from"@customafk/react-toolkit/utils";import{Activity as S,createContext as C,memo as w,use as T,useCallback as E,useEffect as D,useId as ne,useMemo as O,useRef as k,useState as A}from"react";import{jsx as j,jsxs as M}from"react/jsx-runtime";import{AlertTriangle as N,ArrowRightIcon as P,BoxIcon as F,CheckIcon as re,ChevronDown as ie,CirclePlus as ae,Columns4Icon as oe,DownloadIcon as se,EllipsisVerticalIcon as ce,ExternalLinkIcon as le,ListFilterIcon as ue,ListFilterPlus as de,MinusIcon as fe,MoreVerticalIcon as pe,MoveLeftIcon as me,MoveRightIcon as he,PinOffIcon as ge,RefreshCwIcon as _e,SearchIcon as ve,Trash2Icon as ye,UserRoundIcon as be,XIcon as xe}from"lucide-react";import{colorHashLight as Se}from"@customafk/react-toolkit/color-hash";import{flexRender as I,getCoreRowModel as Ce,getExpandedRowModel as we,getGroupedRowModel as Te,useReactTable as Ee}from"@tanstack/react-table";import{useVirtualizer as De}from"@tanstack/react-virtual";import{useDebounceCallback as Oe}from"@customafk/react-toolkit/hooks/useDebounceCallback";const L=()=>M(`div`,{className:`flex gap-0 text-text-positive-weak`,children:[j(fe,{size:16}),j(fe,{size:16})]}),ke=({label:e,onClick:t,onRemove:n})=>e?n?M(`div`,{className:`flex w-fit gap-x-0.5 rounded-full border border-border py-1 pr-2 pl-3 text-text-positive text-xs shadow-xs`,onClick:e=>{t?.(),e.stopPropagation(),e.preventDefault()},children:[e,j(`button`,{className:`cursor-pointer text-text-positive-weak hover:text-text-positive-strong`,onClick:e=>{n?.(),e.stopPropagation(),e.preventDefault()},children:j(xe,{size:12})})]}):j(`button`,{className:`w-fit rounded-full border border-border px-3 py-1 text-text-positive text-xs shadow-xs`,onClick:e=>{t?.(),e.stopPropagation(),e.preventDefault()},children:e}):j(L,{}),Ae=({value:e})=>e==null?j(L,{}):e===!1?j(`div`,{className:`text-danger-strong`,children:j(xe,{})}):j(`div`,{className:`text-success-strong`,children:j(re,{})}),je=({date:e})=>e==null?j(L,{}):j(s,{children:M(c,{children:[j(a,{asChild:!0,children:j(i,{className:`h-fit`,children:j(r,{date:e,format:`medium`,className:`font-normal text-white`})})}),j(o,{className:`rounded`,children:j(r,{date:e,format:`full`,showTime:!0,className:`font-medium text-text-negative text-xs`})})]})}),Me=({content:e})=>e==null?j(L,{}):M(c,{children:[j(a,{asChild:!0,children:j(`div`,{className:`line-clamp-2 whitespace-pre-line break-all text-start text-[13px] text-text-positive-weak`,children:e})}),j(o,{align:`start`,className:`h-fit min-w-48 max-w-80 pt-4`,children:M(`div`,{className:`flex flex-col gap-y-2`,children:[j(`p`,{className:`whitespace-pre-line text-wrap break-keep`,children:e}),M(`p`,{className:`w-full text-end`,children:[e.toString().length,` chars`]})]})})]}),Ne=({items:e=[]})=>M(_,{children:[j(m,{asChild:!0,children:j(t,{size:`sm`,variant:`ghost`,color:`secondary`,className:`size-9 rounded-full`,children:j(pe,{})})}),j(g,{children:j(h,{children:e.map(e=>j(f,{className:`px-3`,onSelect:t=>{e.onClick(e.id),t.stopPropagation()},children:e.label},e.id))})})]}),Pe=({name:t})=>t?M(c,{children:[j(a,{children:j(e,{variant:`sm`,className:`line-clamp-2 w-full truncate text-wrap pb-px text-start text-sm`,children:t})}),j(o,{align:`start`,className:`h-fit min-w-48 max-w-80 pt-4`,children:M(`div`,{className:`flex flex-col gap-y-2`,children:[j(`p`,{className:`whitespace-pre-line text-wrap break-keep`,children:t}),M(`p`,{className:`w-full text-end`,children:[t.length,` chars`]})]})})]}):j(L,{}),Fe=({href:e,label:t})=>M(`a`,{href:e,target:`_blank`,className:`inline-flex items-center gap-1 truncate text-primary text-sm underline`,rel:`noopener noreferrer`,children:[j(`span`,{children:t||e}),j(le,{size:14})]}),Ie=({value:e})=>M(c,{children:[j(a,{asChild:!0,children:j(`p`,{className:`font-number text-secondary-foreground text-sm tabular-nums`,children:e.replace(/(\d{3})(\d{3})(\d{4})/,`($1) $2-$3`)})}),j(o,{align:`start`,children:j(`p`,{className:`tabular-nums`,children:e.slice(1).replace(/(\d{2})(\d{3})(\d{4})/,`(00) (+84) ($1) $2-$3`)})})]}),Le=({title:e,onClick:n})=>M(c,{children:[j(a,{children:j(t,{type:`button`,variant:`ghost`,color:`danger`,size:`icon`,onClick:E(async e=>{e.preventDefault(),e.stopPropagation(),await n?.()},[n]),children:j(ye,{})})}),j(o,{children:j(`p`,{children:e||`Remove item from list table`})})]}),Re=(e,t,n)=>{let r=10**t;switch(n){case`floor`:return Math.floor(e*r)/r;case`ceil`:return Math.ceil(e*r)/r;default:return Math.round(e*r)/r}},ze=w(({decimalSeparator:e=`.`,groupSeparator:t=`,`,prefix:r,suffix:i,precision:a,roundingMode:o=`round`,showTrailingZeros:s=!1,size:c=`lg`,value:l=0})=>{let u=O(()=>{let e={};return typeof a==`number`&&a>=0&&s&&(e.minimumFractionDigits=a),e.maximumFractionDigits=a,e},[a,s]),d=E(e=>{let t=e;return typeof a==`number`&&a>=0&&(t=Re(e,a,o)),t.toLocaleString(`en-US`,u)},[o,u,a]),f=O(()=>{if(typeof l==`number`)return Number.isNaN(l)||!Number.isFinite(l)?`N/A`:d(l);if(typeof l==`string`){let e=l.trim();if(!e)return`N/A`;let t=Number(e);return Number.isNaN(t)||!Number.isFinite(t)?`N/A`:d(t)}return`N/A`},[l,d]),p=O(()=>e===`.`&&t===`,`?f:f.replace(/,/g,t).replace(/\./g,e),[f,e,t]);return p===`0`||p===`N/A`||!p?j(L,{}):M(n,{padding:`none`,className:x(`font-number text-lg text-secondary-foreground tabular-nums`,c===`xs`&&`text-xs`,c===`sm`&&`text-sm`,c===`md`&&`text-base`,c===`lg`&&`text-lg`,c===`xl`&&`text-xl`),children:[r,j(`p`,{children:p}),i]})});ze.displayName=`UITableStatisticDisplay`;const Be=({uuid:t,username:r,email:i})=>M(n,{wrap:!1,gap:`sm`,padding:`none`,children:[!t&&j(u,{className:`size-10 shadow-card`,children:j(l,{className:`bg-muted-weak`,children:j(be,{size:28,className:`text-text-negative`})})}),t&&j(u,{className:`size-10 shadow-card`,children:j(l,{style:{backgroundColor:Se.hex(t)},children:j(be,{size:28,className:`text-white`})})}),M(n,{vertical:!0,padding:`none`,gap:`none`,align:`start`,children:[j(e,{className:`font-medium text-sm text-text-positive-weak`,children:r??`Unknown User`}),j(e,{variant:`sm`,className:`mt-0! text-text-positive-weak text-xs`,children:i})]})]}),Ve=C(null),He=()=>{let e=T(Ve);if(!e)throw Error(`useTableInnerWrapperContext must be used within a TableInnerWrapperProvider`);return e},Ue=C(null),We=()=>{let e=T(Ue);if(!e)throw Error(`useTableInnerTableContext must be used within a TableInnerTableProvider`);return e},Ge=C(null),Ke=()=>{let e=T(Ge);if(!e)throw Error(`useTableHeaderRowContext must be used within a TableHeaderRowProvider`);return e},qe=C(null),Je=()=>{let e=T(qe);if(!e)throw Error(`useTableBodyContext must be used within a TableBodyProvider`);return e},Ye=C(null),Xe=()=>{let e=T(Ye);if(!e)throw Error(`useTableRowContext must be used within a TableRowProvider`);return e},Ze=C(null),R=()=>{let e=T(Ze);if(!e)throw Error(`useTableContext must be used within a TableProvider`);return e},z=w(({isPinned:e,onLeftPin:t,onRightPin:n,onUnpin:r,className:i})=>{let a=E(()=>{t?.(`left`)},[t]),o=E(()=>{n?.(`right`)},[n]),s=E(()=>{r?.(!1)},[r]);return M(_,{children:[j(m,{asChild:!0,children:j(`button`,{className:x(`absolute right-2 z-10 p-0.5 opacity-0`,`cursor-pointer rounded-full transition-all`,`text-text-positive-weak`,`[&>svg]:size-4`,`group-hover:opacity-100`,`hover:bg-muted-muted hover:text-text-positive`,i),children:j(ce,{})})}),j(g,{align:`end`,className:`w-64 p-4`,children:M(h,{className:`*:data-[slot=dropdown-menu-item]:rounded-xs *:data-[slot=dropdown-menu-item]:p-2`,children:[j(S,{mode:e?`visible`:`hidden`,children:M(f,{onClick:s,children:[!!e&&`Unpin`,j(p,{children:j(ge,{className:`size-4`})})]})}),M(S,{mode:e?`hidden`:`visible`,children:[M(f,{onClick:a,children:[e?`Unpin`:`Pin to Left`,j(p,{children:j(me,{className:`size-4`})})]}),M(f,{onClick:o,children:[e?`Unpin`:`Pin to Right`,j(p,{children:j(he,{className:`size-4`})})]})]})]})})]})});z.displayName=`UITableHeadCellOption`;const B=w(({isPinned:e,isAllRowsSelected:t,style:n,onToggleAllRowsSelected:r,...i})=>{let a=E(e=>{r?.(!!e)},[r]);return j(`th`,{slot:`table-header-cell`,"data-pinned":!0,style:{left:0,zIndex:20,width:60,maxWidth:60},className:x(e?`sticky`:`relative`),...i,children:j(`div`,{className:`absolute inset-0 flex items-center justify-center`,onClick:e=>{e.preventDefault(),e.stopPropagation()},children:j(v,{"aria-label":`Select All Rows`,checked:t,onCheckedChange:a})})})});B.displayName=`UITableHeadCellSelect`;const V=w(({isEmpty:e,isFetching:t})=>!e&&!t?null:M(`div`,{className:`sticky left-0 flex min-h-96 flex-1 items-center justify-center bg-transparent text-text-positive-weak opacity-100`,children:[t&&M(`div`,{className:`flex flex-col items-center gap-1`,children:[j(y,{className:`size-12`}),j(`p`,{children:`Loading data...`})]}),e&&!t&&M(`div`,{className:`flex flex-col items-center gap-1`,children:[j(F,{strokeWidth:1,size:48}),j(`p`,{children:`No data available`})]})]}));V.displayName=`UITableEmptyDisplay`;const Qe=w(({className:e,children:t,...n})=>j(`div`,{slot:`table-wrapper`,className:x(`relative m-0 flex size-full flex-col flex-nowrap items-start justify-start gap-2`,e),...n,children:t}));Qe.displayName=`UITableWrapper`;const H=w(({children:e,...t})=>{let{innerWrapperId:n}=He();return j(`div`,{id:n,slot:`table-inner-wrapper`,className:`relative size-full overflow-auto border-b border-b-border border-l border-l-border bg-card`,...t,children:e})});H.displayName=`UITableInnerWrapper`;const U=w(({children:e,...t})=>{let{table:n,innerTableId:r,totalSize:i}=We(),a=k(null);return D(()=>{if(!a.current)return;let e=n.getFlatHeaders(),t=new ResizeObserver(t=>{requestAnimationFrame(()=>{let r=t[0].target;if(r instanceof HTMLTableElement){let i=t[0];if(!i)return;let a=i.contentRect.width,{left:o=[],right:s=[]}=n.getState().columnPinning,c=0,l=0,u=0,d=e.map(e=>{let{id:t}=e,n=t===`select`||t===`actions`,r=o.includes(t)||s.includes(t),i=e.getSize(),a=e.column.columnDef.maxSize;return n?(c+=60,{id:t,isFlex:!1,width:60}):r?(c+=i,{id:t,isFlex:!1,width:i}):e.column.columnDef.size||i!==150?(u+=i,{id:t,isFlex:!1,width:i}):(l++,{id:t,isFlex:!0,maxSize:a})}),f=a-c-u,p=l>0?Math.max(0,Math.floor(f/l)):0;d.forEach(e=>{if(e.isFlex){let t=e.maxSize?Math.min(p,e.maxSize):p;r.style.setProperty(`--header-${e.id}-size`,`${t}`),r.style.setProperty(`--col-${e.id}-size`,`${t}`),e.maxSize&&r.style.setProperty(`--col-${e.id}-maxSize`,`${e.maxSize}`)}else r.style.setProperty(`--header-${e.id}-size`,`${e.width}`),r.style.setProperty(`--col-${e.id}-size`,`${e.width}`)})}})});return t.observe(a.current),()=>t.disconnect()},[n.getState().columnSizingInfo,n.getState().columnSizing,n.getState().columnPinning]),j(`table`,{id:r,ref:a,slot:`table-inner-table`,className:`grid w-full table-fixed caption-bottom border-collapse border-spacing-0 flex-col content-start [&_tfoot_td]:border-t`,style:{minWidth:i},...t,children:e})});U.displayName=`UITableInnerTable`;const W=w(({className:e,children:t,...n})=>j(`thead`,{slot:`table-head`,className:x(`sticky top-0 z-20 h-9 w-full`,`grid select-none bg-muted-bg-subtle`,`border-b border-b-border shadow`,`font-medium text-[13px] text-text-positive-weak`,`[&_tr:not(:last-child)_td]:border-b`,`[&_th]:inline-flex`,`[&_th]:items-center`,`[&_th]:transition-all`,`[&_th]:duration-300`,`[&_th]:whitespace-nowrap`,`[&_th]:border-border`,`[&_th]:last:border-r-0`,`[&_th]:first:border-l-0`,`[&_tr_th:not([data-pinned=false])]:bg-muted-bg-subtle`,e),...n,children:t}));W.displayName=`UITableHead`;const G=w(({headerGroup:e,className:t,...n})=>{let{isAllRowsSelected:r,columnPinningState:i,leftPinnedHeaders:a,rightPinnedHeaders:o,onToggleAllRowsSelected:s}=Ke(),c=o[0]?.id,l=a[a.length-1]?.id;return j(`tr`,{slot:`table-head-row`,className:x(`flex`,t),...n,children:e.headers.map((e,t)=>{let n=e.column.getIsVisible(),a=i.left?.includes(e.id)?`left`:i.right?.includes(e.id)?`right`:!1;return e.id===`select`?j(B,{isPinned:a,isAllRowsSelected:r,onToggleAllRowsSelected:s},e.id):j(K,{isVisible:n,isPinned:a,isFirstCell:e.id===c,isLastCell:e.id===l,isOptionsVisible:![`select`,`actions`].includes(e.id),headerId:e.id,headerColumn:e.column,colSpan:e.colSpan,onColumnPin:e.column.pin,onToggleVisibility:e.column.toggleVisibility,children:I(e.column.columnDef.header,e.getContext())},`${e.id}-${t}`)})})});G.displayName=`UITableHeadRow`;const K=w(({isVisible:e=!0,isPinned:t=!1,isFirstCell:n=!1,isLastCell:r=!1,isOptionsVisible:i=!0,headerId:a,headerColumn:o,className:s,children:c,onColumnPin:l,onToggleVisibility:u,...d})=>{let f=O(()=>t?20:void 0,[t]),p=O(()=>{let e=o?.getStart?.(`left`);return t===`left`&&typeof e==`number`?`${e}px`:void 0},[t,o]),m=O(()=>{let e=o?.getAfter?.(`right`);return t===`right`&&typeof e==`number`?`${e}px`:void 0},[t,o]),h=O(()=>`calc(var(--header-${a}-size) * 1px)`,[a]),g=O(()=>o?.columnDef.minSize?`calc(var(--col-${a}-minSize) * 1px)`:void 0,[a,o]),_=O(()=>o?.columnDef.maxSize?`calc(var(--col-${a}-maxSize) * 1px)`:void 0,[a,o]);return M(`th`,{slot:`table-head-cell`,"data-pinned":t,"data-header":a,style:{zIndex:f,left:p,right:m,width:h,minWidth:g,maxWidth:_},className:x(`group flex`,t?`sticky`:`relative`,t===`left`&&r&&`border-r border-r-border`,t===`right`&&n&&`border-l border-l-border`,o?.columnDef.meta?.position===`center`&&`justify-center`,o?.columnDef.meta?.position===`end`&&`justify-end`,o?.columnDef.meta?.position===`start`&&`justify-start`,s),...d,children:[j(`div`,{className:`truncate pl-4`,children:c}),i&&j(z,{isPinned:t,isVisible:e,onLeftPin:l,onRightPin:l,onUnpin:l})]})});K.displayName=`UITableHeadCell`;const q=w(({height:e,className:t,children:n,...r})=>{let{isFetching:i,isEmpty:a}=Je();return a||i?null:j(`tbody`,{slot:`table-body`,style:{height:e},className:x(`relative w-full`,`grid`,`[&_tr]:absolute`,`[&_tr]:flex`,`[&_tr]:flex-none`,`[&_tr]:w-full`,`[&_tr]:cursor-pointer [&_tr]:focus:outline-none`,`[&_tr]:border-b [&_tr]:border-b-border`,`[&_td]:z-10`,`[&_td]:transition-all`,`[&_td]:duration-300`,`[&_td]:flex`,`[&_td]:flex-none`,`[&_td]:overflow-hidden`,`[&_td]:whitespace-nowrap`,`[&_td]:px-4`,`[&_td]:py-2.5`,`[&_td]:align-middle`,`[&_td]:border-border`,`[&_td]:data-[selected=true]:bg-muted-muted!`,`[&_td]:data-[selected=true]:hover:bg-muted-muted!`,`[&_td>div]:inline-flex`,`[&_td>div]:items-center`,`[&_td>div]:w-full`,`[&_td:not([data-pinned=false])]:z-20`,`[&_td:not([data-pinned=false])]:sticky`,`[&_td:not([data-pinned=false])]:bg-card`,`**:data-lastcell:border-r`,`**:data-firstcell:border-l`,t),...r,children:n})});q.displayName=`UITableBody`;const J=w(({row:e,isSelected:t,virtualRowIndex:n,virtualRowStart:r,children:i,...a})=>{let{keyOfClickRow:o,isAllRowsSelected:s,columnPinningState:c,leftPinnedHeaders:l,rightPinnedHeaders:u,onClickRow:d}=Xe(),f=O(()=>c.left??[],[c]),p=O(()=>c.right??[],[c]),m=O(()=>u?.[0]?.id,[u]),h=O(()=>l?.[l.length-1]?.id,[l]),g=E(t=>{let r=o?e.original?.[o]:void 0;d?.(n,typeof r==`string`||typeof r==`number`?r:void 0),t.preventDefault(),t.stopPropagation()},[o,d,e,n]);return j(`tr`,{slot:`table-row`,"data-index":n,style:{transform:`translateY(${r}px)`},className:`group`,onClick:g,...a,children:e.getVisibleCells().map((e,r)=>{let i=f.includes(e.column.id),a=p.includes(e.column.id),o=i?`left`:a?`right`:!1;return e.column.id===`actions`?j(X,{"data-col":e.column.id,"data-cell":n,"data-selected":t||void 0,virtualRowIndex:n,column:e.column,getContext:e.getContext},`${e.id}-${r}`):e.column.id===`select`?j(Y,{"data-col":e.column.id,"data-cell":n,"data-selected":t||void 0,isPinned:o,isSelected:s||t,onToggleRowSelected:e.row.toggleSelected},`${e.id}-${r}`):j(Z,{"data-col":e.column.id,"data-cell":n,"data-selected":t||void 0,isPinned:o,isFirstCell:e.column.id===m,isLastCell:e.column.id===h,colId:e.column.id,position:e.column.columnDef.meta?.position??`start`,column:e.column,getContext:e.getContext},`${e.id}-${r}`)})})});J.displayName=`UITableRow`;const Y=w(({isPinned:e,isSelected:t=!1,className:n,onToggleRowSelected:r,...i})=>{let a=E(e=>{r?.(!!e)},[r]);return j(`td`,{slot:`table-body-cell`,"data-pinned":!0,style:{left:0,zIndex:20,width:60,maxWidth:60},className:x(`group-hover:bg-muted-bg-subtle!`,e?`sticky`:`relative`,n),...i,children:j(`div`,{"data-slot":`table-cell-inner`,className:`flex! w-full! items-center justify-center bg-transparent text-center align-middle`,onClick:e=>{e.preventDefault(),e.stopPropagation()},children:j(v,{"aria-label":`Select Row`,checked:t,onCheckedChange:a})})})});Y.displayName=`UITableCellSelect`;const X=w(({virtualRowIndex:e,column:t,getContext:n,className:r,...i})=>{let a=O(()=>I(t?.columnDef.cell,n()),[t,n]);return j(`td`,{"data-col":`actions`,"data-cell":e,className:`sticky inset-y-0 right-0 z-50 flex items-center pr-4 group-hover:bg-muted-bg-subtle!`,...i,children:a})});X.displayName=`UITableCellActions`;const Z=w(({isPinned:e=!1,isFirstCell:t=!1,isLastCell:n=!1,colId:r,position:i=`start`,column:a,getContext:o,...s})=>{let{innerTableId:c,table:l}=We(),u=k(document.querySelector(`table[id="${c}"]`)),d=k(null),f=O(()=>{let t=a?.getStart(`left`);return e===`left`&&typeof t==`number`?`${t}px`:void 0},[e,a]),p=O(()=>{let t=a?.getAfter(`right`);return e===`right`&&typeof t==`number`?`${t}px`:void 0},[e,a]),m=O(()=>`calc(var(--col-${r}-size) * 1px)`,[r]),h=O(()=>a?.columnDef.minSize?`calc(var(--col-${r}-minSize) * 1px)`:void 0,[r,a]),g=O(()=>a?.columnDef.maxSize?`calc(var(--col-${r}-maxSize) * 1px)`:void 0,[r,a]),_=O(()=>I(a?.columnDef.cell,o()),[a,o]);return D(()=>{if(!d.current)return;let e=d.current.scrollWidth,t=a?.getSize();t&&e>t&&u.current instanceof HTMLTableElement&&typeof r==`string`&&a?.columnDef.meta?.fitContent&&l.setColumnSizing(t=>({...t,[r]:e+32}))},[r,a,l]),j(`td`,{slot:`table-body-cell`,"data-pinned":e,"data-lastcell":n||void 0,"data-firstcell":t||void 0,style:{left:f,right:p,width:m,minWidth:h,maxWidth:g},className:`group-hover:bg-muted-bg-subtle!`,...s,children:j(`div`,{ref:d,slot:`table-body-cell-inner`,className:x(i===`start`&&`justify-start`,i===`center`&&`justify-center`,i===`end`&&`justify-end`),children:_})})});Z.displayName=`UITableCell`;const $e=w(({className:e,children:t,...n})=>j(`tfoot`,{slot:`table-footer`,className:x(`flex w-full justify-center border-border-weak border-t py-2 font-medium [&>tr]:last:border-b-0`,e),...n,children:t}));$e.displayName=`UITableFooter`;const Q=w(({virtualRowIndex:e,virtualRowStart:t,fetchMoreData:n})=>{let{innerWrapperId:r}=He(),i=k(document.querySelector(`div[id="${r}"]`)),a=k(null),[o,s]=A(`idle`),[c,l]=A(0),u=E(async()=>{try{s(`fetching`),await n?.(),s(`idle`)}catch(e){console.error(`Error fetching more data:`,e),s(`error`)}},[n]);return D(()=>{if(!i.current)return;let e=new ResizeObserver(e=>{l(e[0].contentRect.width)});return e.observe(i.current),()=>e.disconnect()},[]),j(`tr`,{ref:a,"data-index":e,style:{transform:`translateY(${t}px)`,width:c},className:`sticky! left-0 h-10`,children:j(`td`,{className:`absolute left-0 flex w-full items-center justify-center text-xs`,children:M(`button`,{type:`button`,disabled:o===`fetching`,className:x(`flex cursor-pointer gap-x-0.5`,o===`fetching`&&`cursor-not-allowed`,o===`idle`&&`text-text-positive-weak hover:text-text-positive`,o===`error`&&`text-danger hover:text-danger-strong`),onClick:u,children:[o===`idle`&&j(ie,{className:`size-4`}),o===`fetching`&&j(y,{className:`size-4 animate-spin`}),o===`error`&&j(N,{className:`size-4 text-danger`}),o===`idle`&&`Load More`,o===`fetching`&&`Loading...`,o===`error`&&`Error! Retry?`]})})})});Q.displayName=`UITableLoadMore`;const et=()=>{let{table:e,isEmpty:t,isFetching:n,fetchMoreData:r}=R(),{rowSelectionState:i}=Je(),a=k(null),{rows:o}=e.getRowModel(),s=De({count:o.length+1,estimateSize:()=>40,getScrollElement:()=>a.current,measureElement:typeof window<`u`&&navigator.userAgent.indexOf(`Firefox`)===-1?e=>e?.getBoundingClientRect().height:void 0,overscan:2}),c=O(()=>{let e=s.getTotalSize(),t=a.current?.clientHeight||0;return e<t?`${t}px`:`${e}px`},[s.getTotalSize()]);return j(ee,{direction:`horizontal`,style:{direction:e.options.columnResizeDirection},className:`relative flex w-full max-w-full flex-1 gap-1 overflow-auto border-t border-t-border border-r border-r-border bg-slate-50 p-0 text-sm`,children:j(b,{className:`relative`,children:M(H,{ref:a,children:[M(U,{children:[j(W,{children:e.getHeaderGroups().map(e=>j(G,{headerGroup:e},e.id))}),j(q,{height:c,children:s.getVirtualItems().map(e=>{let t=o[e.index],n=Object.entries(i).some(([e,n])=>e===`${t?.id}`&&n);return t?j(J,{ref:s.measureElement,row:t,isSelected:n,virtualRowIndex:e.index,virtualRowStart:e.start},e.index):j(Q,{virtualRowIndex:e.index,virtualRowStart:e.start,fetchMoreData:r},e.index)})})]}),j(V,{isEmpty:t,isFetching:n})]})})})},tt=({checked:e,title:t,onCheckedChange:n})=>M(`div`,{className:`flex h-fit items-center gap-2`,children:[j(v,{checked:e,onCheckedChange:n}),j(`p`,{className:`text-sm`,children:t})]}),nt=()=>{let{table:e}=R(),[n,r]=A(null);return j(b,{defaultSize:25,className:x(`bg-card`,n===null?`max-w-8!`:`min-w-64`),children:M(`div`,{className:`relative z-20 flex size-full bg-muted-bg-subtle`,children:[M(`div`,{className:`flex-1`,children:[j(S,{mode:n===`columns`?`visible`:`hidden`,children:M(`div`,{className:`flex size-full flex-col gap-2 p-4`,children:[j(`p`,{className:`px-2 font-medium`,children:`Columns Visibility`}),j(d,{}),j(`div`,{className:`flex flex-col gap-4 pt-4`,children:e.getAllColumns().map(e=>[`select`,`actions`].includes(e.id)?null:j(tt,{checked:e.getIsVisible(),title:String(e.columnDef.header),onCheckedChange:t=>e.toggleVisibility(!!t)},e.id))})]})}),j(S,{mode:n===`filters`?`visible`:`hidden`,children:j(`div`,{className:`flex size-full flex-col p-2`,children:M(t,{variant:`outline`,color:`muted`,children:[j(de,{}),`Add Filter`]})})})]}),M(`div`,{className:`flex h-full flex-col border-border border-l bg-muted-bg-subtle text-sm`,children:[M(`button`,{className:x(`flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4`,n===`columns`&&`bg-card`),onClick:()=>r(n===`columns`?null:`columns`),children:[j(oe,{size:18}),j(`span`,{className:`text-nowrap [writing-mode:vertical-lr]`,children:`Columns`})]}),j(d,{}),M(`button`,{className:x(`flex h-32 cursor-pointer flex-col items-center gap-y-2 p-2 py-4`,n===`filters`&&`bg-card`),onClick:()=>r(n===`filters`?null:`filters`),children:[j(ue,{size:18}),j(`span`,{className:`text-nowrap [writing-mode:vertical-lr]`,children:`Filters`})]}),j(d,{})]})]})})},rt=w(({innerWrapperId:e,children:t})=>{let n=O(()=>({innerWrapperId:e}),[e]);return j(Ve.Provider,{value:n,children:t})});rt.displayName=`UITableInnerWrapperProvider`;const it=w(({table:e,innerTableId:t,totalSize:n,children:r})=>{let i=O(()=>({table:e,innerTableId:t,totalSize:n}),[e,t,n]);return j(Ue.Provider,{value:i,children:r})});it.displayName=`UITableInnerTableProvider`;const at=w(({isAllRowsSelected:e,columnPinningState:t,leftPinnedHeaders:n,rightPinnedHeaders:r,onToggleAllRowsSelected:i,children:a})=>{let o=O(()=>({isAllRowsSelected:e,columnPinningState:t,leftPinnedHeaders:n,rightPinnedHeaders:r,onToggleAllRowsSelected:i}),[e,t,n,r,i]);return j(Ge.Provider,{value:o,children:a})});at.displayName=`UITableHeadRowProvider`;const ot=w(({isFetching:e,isEmpty:t,rowSelectionState:n,children:r})=>{let i=O(()=>({isFetching:e,isEmpty:t,rowSelectionState:n}),[e,t,n]);return j(qe.Provider,{value:i,children:r})});ot.displayName=`UITableBodyProvider`;const st=w(({keyOfClickRow:e,isAllRowsSelected:t,columnPinningState:n,leftPinnedHeaders:r,rightPinnedHeaders:i,onClickRow:a,children:o})=>{let s=O(()=>({keyOfClickRow:e,isAllRowsSelected:t,columnPinningState:n,leftPinnedHeaders:r,rightPinnedHeaders:i,onClickRow:a}),[e,t,n,r,i,a]);return j(Ye.Provider,{value:s,children:o})});st.displayName=`UITableRowProvider`;const ct=({title:e,isFetching:t=!1,isRefetching:n=!1,data:r,columns:i,totalRows:a,leftPinnedColumns:o=[],rightPinnedColumns:s=[],keyOfClickRow:c,onClickRow:l,onRowSelection:u,onColumnPinning:d,fetchMoreData:f,children:p})=>{let m=ne(),h=ne(),[g,_]=A({}),[v,y]=A({right:s,left:[`select`,...o]}),[b,ee]=A({}),te=E(e=>(_(e),u?.(e instanceof Function?e(g):e),e),[g,u]),x=E(e=>{y(e),d?.(e instanceof Function?e(v):e)},[v,d]),S=Ee({data:r,columns:i,state:{rowSelection:g,columnPinning:v,expanded:b},defaultColumn:{enableResizing:!1,size:void 0,minSize:void 0,maxSize:void 0},columnResizeMode:`onChange`,columnResizeDirection:`ltr`,enableColumnPinning:!0,enableRowSelection:!0,enableColumnResizing:!0,enableMultiRowSelection:!0,autoResetAll:!1,autoResetExpanded:!1,autoResetPageIndex:!1,getSubRows:e=>e.subRows,getCoreRowModel:Ce(),getGroupedRowModel:Te(),getExpandedRowModel:we(),onRowSelectionChange:te,onColumnPinningChange:x,onExpandedChange:ee}),C=O(()=>{let{rows:e}=S.getRowModel();return e},[S.getRowModel().rows,S.getState().columnPinning]),w=O(()=>!t&&C.length===0,[C,t]),T=O(()=>({title:e,table:S,isEmpty:w,isFetching:t,isRefetching:n,totalRows:a,fetchMoreData:f}),[e,S,w,n,t,a,f,S.getState().columnPinning,S.getState().expanded]),D=O(()=>S.getState(),[S.getState()]),k=O(()=>S.getIsAllRowsSelected(),[S.getIsAllRowsSelected()]),M=O(()=>D.rowSelection,[D.rowSelection]),N=O(()=>D.columnPinning,[D.columnPinning]),P=O(()=>S.getLeftHeaderGroups()[0]?.headers||[],[S.getState().columnPinning]),F=O(()=>S.getRightHeaderGroups()[0]?.headers||[],[S.getState().columnPinning]),re=O(()=>S.getTotalSize(),[S.getTotalSize()]);return j(Ze.Provider,{value:T,children:j(rt,{innerWrapperId:m,children:j(it,{table:S,innerTableId:h,totalSize:re,children:j(at,{isAllRowsSelected:k,columnPinningState:N,leftPinnedHeaders:P,rightPinnedHeaders:F,onToggleAllRowsSelected:S.toggleAllRowsSelected,children:j(ot,{isFetching:t,isEmpty:w,rowSelectionState:M,children:j(st,{keyOfClickRow:c,isAllRowsSelected:k,columnPinningState:N,leftPinnedHeaders:P,rightPinnedHeaders:F,onClickRow:l,children:p})})})})})})},lt=({onSearch:e,onChange:t,...n})=>{let r=Oe(t=>{e?.(t)},500);return M(`div`,{className:`relative w-full max-w-80 flex-1`,children:[j(te,{...n,size:`lg`,type:`search`,placeholder:`Search records...`,className:`flex-1 ps-9 pe-9`,onChange:e=>{t?.(e),r(e.target.value??``)}}),j(`div`,{className:`pointer-events-none absolute inset-y-0 start-0 flex items-center justify-center ps-3 text-text-positive-weak peer-disabled:opacity-50`,children:j(ve,{size:16})}),j(`button`,{className:`absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-md text-text-positive-weak outline-none transition-[color,box-shadow] hover:text-text-positive focus:z-10 focus-visible:border focus-visible:border-primary-strong focus-visible:ring-[3px] focus-visible:ring-primary-weak disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50`,"aria-label":`Submit search`,type:`submit`,children:j(P,{size:16,"aria-hidden":`true`})})]})},$=({children:e,disabled:t,onClick:n})=>j(`button`,{type:`button`,disabled:t,className:`flex cursor-pointer items-center gap-x-1 rounded-sm border border-border bg-background p-2.5 text-sm text-text-positive-weak outline-none transition-all hover:shadow-card focus:border-border-emphasis focus:bg-muted-muted active:border-border-emphasis active:bg-muted-muted active:text-text-positive disabled:pointer-events-none disabled:cursor-default disabled:opacity-60 [&_svg]:size-3.5`,onClick:n,children:e}),ut=({onCreate:e,onDownload:t,onRefresh:n})=>M(`div`,{className:`flex [&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none`,children:[j($,{disabled:!e,onClick:t=>{e?.(),t.stopPropagation(),t.preventDefault()},children:j(ae,{})}),j($,{disabled:!n,onClick:e=>{n?.(),e.stopPropagation(),e.preventDefault()},children:j(_e,{})}),j($,{disabled:!t,onClick:e=>{t?.(),e.stopPropagation(),e.preventDefault()},children:j(se,{})})]}),dt=({children:e})=>{let{title:t}=R();return M(`div`,{"data-slot":`table-tooltip`,className:`relative m-0 flex w-full flex-0 flex-col flex-wrap items-start space-y-2 p-0 px-2 text-sm`,children:[j(`h3`,{className:`font-semibold text-base text-text-positive`,children:t}),j(`div`,{className:`flex w-full flex-1 justify-between gap-x-2`,children:e})]})};dt.displayName=`TableTooltip`;export{ke as UITableBadgeDisplay,q as UITableBody,Ae as UITableBooleanDisplay,Z as UITableCell,X as UITableCellActions,Y as UITableCellSelect,et as UITableContainer,je as UITableDateDisplay,Me as UITableDescriptionDisplay,V as UITableEmptyDisplay,nt as UITableFilter,$e as UITableFooter,W as UITableHead,K as UITableHeadCell,z as UITableHeadCellOption,B as UITableHeadCellSelect,G as UITableHeadRow,U as UITableInnerTable,H as UITableInnerWrapper,Q as UITableLoadMore,Ne as UITableMoreButton,Pe as UITableNameDisplay,Fe as UITablePermalink,Ie as UITablePhoneNumberDisplay,ct as UITableProvider,Le as UITableRemoveButton,J as UITableRow,ze as UITableStatisticDisplay,dt as UITableTooltip,ut as UITableTooltipActions,lt as UITableTooltipFilter,Be as UITableUserDataDisplay,Qe as UITableWrapper};
 //# sourceMappingURL=index.mjs.map