@economic/taco 1.41.0 → 2.0.0-alpha.173

package/dist/components/Table3/hooks/useCssGrid.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { Table as RTable } from '@tanstack/react-table';
+export declare const useCssGrid: <TType = unknown>(table: RTable<TType>) => {
+    style: React.CSSProperties;
+};

package/dist/components/Table3/hooks/useCssVars.d.ts

@@ -0,0 +1,6 @@
+import { Table3FontSize, Table3RowHeight } from '../types';
+export declare const useCssVars: (height: Table3RowHeight, fontSize: Table3FontSize) => {
+    style: {
+        '--table3-row-padding': string;
+    };
+};

package/dist/components/Table3/hooks/useTable.d.ts

@@ -0,0 +1,63 @@
+import React from 'react';
+import { RowData } from '@tanstack/react-table';
+import { ColumnAlignment, Table3ColumnRenderer, Table3Props, Table3ColumnHeaderMenu, Table3ColumnControlRenderer, ColumnDataType, Table3ColumnClassNameHandler, Table3ColumnFooterRenderer, TableStrategy } from '../types';
+import { useCurrentRow } from './features/useCurrentRow';
+import { usePauseHoverState } from './features/usePauseHoverState';
+import { useRowHeight } from './features/useRowHeight';
+import { useFontSize } from './features/useFontSize';
+import { useRowDrag } from './features/useRowDrag';
+import { useColumnFreezing } from './features/useColumnFreezing';
+import { useRowSelection } from './features/useRowSelection';
+import { useRowClick } from './features/useRowClick';
+import { useColumnOrdering } from './features/useColumnOrdering';
+import { useRowDrop } from './features/useRowDrop';
+import { useEditing } from './features/useEditing';
+import { usePrinting } from './features/usePrinting';
+import { useRowGoto } from './features/useRowGoto';
+import { useSearch } from './features/useSearch';
+declare module '@tanstack/table-core' {
+    interface TableMeta<TData extends RowData> {
+        columnFreezing: ReturnType<typeof useColumnFreezing>;
+        columnOrdering: ReturnType<typeof useColumnOrdering>;
+        currentRow: ReturnType<typeof useCurrentRow>;
+        editing: ReturnType<typeof useEditing>;
+        fontSize: ReturnType<typeof useFontSize>;
+        hoverState: ReturnType<typeof usePauseHoverState>;
+        isUsingServer: boolean;
+        printing: ReturnType<typeof usePrinting>;
+        rowClick: ReturnType<typeof useRowClick>;
+        rowDrag: ReturnType<typeof useRowDrag>;
+        rowDrop: ReturnType<typeof useRowDrop>;
+        rowGoto: ReturnType<typeof useRowGoto>;
+        rowHeight: ReturnType<typeof useRowHeight>;
+        rowSelection: ReturnType<typeof useRowSelection>;
+        search: ReturnType<typeof useSearch>;
+    }
+    interface ColumnMeta<TData extends RowData, TValue> {
+        align?: ColumnAlignment;
+        className?: Table3ColumnClassNameHandler<TData>;
+        control?: Table3ColumnControlRenderer<TData>;
+        dataType?: ColumnDataType;
+        defaultWidth?: number;
+        enableOrdering: boolean;
+        enableSearch: boolean;
+        enableTruncate: boolean;
+        footer?: Table3ColumnFooterRenderer;
+        header: string;
+        headerClassName?: string;
+        menu?: Table3ColumnHeaderMenu;
+        renderer?: Table3ColumnRenderer<TValue, TData>;
+        tooltip?: string;
+    }
+    interface CellContext<TData extends RowData, TValue> {
+        index: number;
+        tableRef: React.RefObject<HTMLDivElement>;
+    }
+    interface HeaderContext<TData extends RowData, TValue> {
+        scrollToIndex: TableStrategy['scrollToIndex'];
+    }
+}
+export declare function useTable<TType = unknown>(props: Table3Props<TType>): {
+    table: import("@tanstack/react-table").Table<TType>;
+    length: number;
+};

package/dist/components/Table3/hooks/useTableData.d.ts

@@ -0,0 +1,23 @@
+import { ColumnFilter, ColumnSort, Table3FilterHandler, Table3LoadAllHandler, Table3LoadPageHandler, Table3SearchHandler, Table3SortHandler } from '../types';
+export declare type useTable3DataFetcher<TType = unknown> = (pageIndex: number, pageSize: number, sorting: ColumnSort[], filters: ColumnFilter[], search: string | undefined) => Promise<{
+    data: TType[];
+    length: number;
+}>;
+export declare type useTable3AllDataFetcher<TType = unknown> = (sorting: ColumnSort[], filters: ColumnFilter[], search: string | undefined) => Promise<{
+    data: TType[];
+    length: number;
+}>;
+export declare type useTable3DataOptions = {
+    pageSize: number;
+};
+export declare type useTableDataValues<TType = unknown> = {
+    data: TType[];
+    length: number | undefined;
+    loadAll: Table3LoadAllHandler;
+    loadPage: Table3LoadPageHandler;
+    onFilter: Table3FilterHandler;
+    onSearch: Table3SearchHandler;
+    onSort: Table3SortHandler;
+    pageSize: number;
+};
+export declare function useTableData<TType = unknown>(fetch: useTable3DataFetcher<TType>, fetchAll: useTable3AllDataFetcher<TType>, options?: useTable3DataOptions): useTableDataValues<TType>;

package/dist/components/Table3/hooks/useTablePreset.d.ts

@@ -0,0 +1,2 @@
+import { Table3Options, Table3Props } from '../types';
+export declare function useTablePreset<TType = unknown>(props: Table3Props<TType>): Table3Options;

package/dist/components/Table3/hooks/useTableRefInstanceSetup.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { Table3Ref } from '../types';
+import { Table as RTable } from '@tanstack/react-table';
+export declare function useTableRefInstanceSetup<TType = unknown>(table: RTable<TType>, ref: React.RefObject<Table3Ref>): void;

package/dist/components/Table3/strategies/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { Table as RTable } from '@tanstack/react-table';
+import { Table3Props, TableStrategy } from '../types';
+export declare function useTableRenderStrategy<TType = unknown>(props: Table3Props<TType>, table: RTable<TType>, ref: React.RefObject<HTMLDivElement>): TableStrategy;

package/dist/components/Table3/strategies/virtualised.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { Table as RTable } from '@tanstack/react-table';
+import { Table3Props, TableStrategy } from '../types';
+export declare function useTableRenderStrategy<TType = unknown>(props: Table3Props<TType>, table: RTable<TType>, tableRef: React.RefObject<HTMLDivElement>): TableStrategy;

package/dist/components/Table3/types.d.ts

@@ -0,0 +1,311 @@
+/// <reference types="react" />
+import { ColumnFilter as RTColumnFilter, ColumnFiltersState, ColumnOrderState, ColumnPinningState, ColumnSizingState, ColumnSort as RTColumnSort, SortingState, VisibilityState, BuiltInSortingFn } from '@tanstack/react-table';
+import { MenuProps } from '../Menu/Menu';
+export declare type SortDirection = 'asc' | 'desc';
+export declare type SortFn<TType = unknown> = ((rowA: TType, rowB: TType, columnId: string) => -1 | 0 | 1) | BuiltInSortingFn | 'auto';
+export declare type Table3ColumnRenderer<TValue = unknown, TType = unknown> = (value: TValue, row: TType) => JSX.Element | string | null;
+export declare type Table3ColumnFooterRenderer<TValue = unknown> = (values: TValue[]) => JSX.Element | string | null;
+export declare type Table3ColumnClassNameHandler<TType = unknown> = string | ((row: TType) => string);
+export declare type ColumnAlignment = 'left' | 'center' | 'right';
+export declare type ColumnDataType = 'auto' | 'alphanumeric' | 'alphanumericCaseSensitive' | 'datetime' | 'boolean';
+export declare type Table3ColumnHeaderMenu = (props: Partial<MenuProps>) => JSX.Element;
+export declare type Table3ColumnControlProps = {
+    className?: string;
+    disabled?: boolean;
+    invalid?: boolean;
+    onBlur?: (value: any) => void;
+    onFocus?: React.FocusEventHandler;
+    readOnly?: boolean;
+    ref: React.RefObject<HTMLElement>;
+    setValue: (value: any) => void;
+    value: any;
+};
+export declare type Table3ColumnControlRenderer<TType = unknown> = ((props: Table3ColumnControlProps, row?: TType) => JSX.Element) | 'datepicker' | 'input' | 'switch';
+export declare type Table3ColumnProps<TType = unknown> = {
+    accessor: string;
+    align?: ColumnAlignment;
+    className?: Table3ColumnClassNameHandler<TType>;
+    control?: Table3ColumnControlRenderer<TType>;
+    dataType?: ColumnDataType;
+    defaultHidden?: boolean;
+    defaultWidth?: number | 'grow';
+    enableFiltering?: boolean;
+    enableHiding?: boolean;
+    enableOrdering?: boolean;
+    enableResizing?: boolean;
+    enableSearch?: boolean;
+    enableSorting?: boolean;
+    enableTruncate?: boolean;
+    footer?: Table3ColumnFooterRenderer;
+    header: string;
+    headerClassName?: string;
+    menu?: Table3ColumnHeaderMenu;
+    renderer?: Table3ColumnRenderer<unknown, TType>;
+    sort?: SortDirection;
+    sortFn?: SortFn<TType>;
+    tooltip?: string;
+};
+export declare type DeprecatedRowDensity = 'compact' | 'normal' | 'comfortable' | 'spacious';
+export declare type Table3RowHeight = 'short' | 'medium' | 'tall' | 'extra-tall';
+export declare type Table3FontSize = 'small' | 'medium' | 'large';
+export declare type Table3RowClickHandler<TType = unknown> = (row: TType) => void;
+export declare type Table3RowDragHandler<TType = unknown> = (rows: TType[], showPlaceholder: (string: any) => void, setDataTransfer: (data: string) => void) => void;
+export declare type Table3RowDropHandler<TType = any> = (event: React.DragEvent, row: TType) => void;
+export declare type Table3RowExpansionRenderer<TType = unknown> = (row: TType) => (() => JSX.Element) | null;
+export declare type Table3RowSelectionHandler<TType = unknown> = (rows: TType[]) => void;
+export declare type Table3RowActionRenderer<TType = unknown> = (row: TType) => JSX.Element;
+export declare type Table3RenderStrategy = 'static' | 'virtual';
+export declare type Table3Preset = 'display' | 'editable';
+export declare type Table3Settings = {
+    columnFilters?: ColumnFiltersState;
+    columnFreezingIndex?: number;
+    columnOrder?: ColumnOrderState;
+    columnPinning?: ColumnPinningState;
+    columnSizing?: ColumnSizingState;
+    columnVisibility?: VisibilityState;
+    excludeUnmatchedRecordsInSearch?: boolean;
+    fontSize?: Table3FontSize;
+    rowDensity?: DeprecatedRowDensity;
+    rowHeight?: Table3RowHeight;
+    sorting?: SortingState;
+};
+export declare type Table3SettingsAdapter = (settings: Table3Settings) => void;
+export declare enum Table3FilterComparator {
+    Contains = 0,
+    DoesNotContain = 1,
+    IsEqualTo = 2,
+    IsNotEqualTo = 3,
+    IsGreaterThan = 4,
+    IsLessThan = 5,
+    IsBetween = 6,
+    IsOneOf = 7,
+    IsNoneOf = 8,
+    IsAllOf = 9,
+    IsEmpty = 10,
+    IsNotEmpty = 11
+}
+export declare type Table3FilterValue = {
+    comparator: Table3FilterComparator;
+    value: any;
+};
+export declare type Table3Filter = {
+    id: string;
+    value: Table3FilterValue;
+};
+export declare type ColumnFilter = RTColumnFilter;
+export declare type Table3FilterHandler = (filters: ColumnFilter[]) => void;
+export declare type Table3SearchHandler = (query: string | undefined) => Promise<void>;
+export declare type Table3LoadPageHandler = (pageIndex: number, sorting: ColumnSort[], filters: ColumnFilter[], search: string | undefined) => Promise<void>;
+export declare type Table3LoadAllHandler = (sorting: ColumnSort[], filters: ColumnFilter[], search: string | undefined) => Promise<void>;
+export declare type Table3RowGotoHandler = (column: string, query: string, sorting: ColumnSort[], filters: ColumnFilter[], search: string | undefined) => Promise<number>;
+export declare type ColumnSort = RTColumnSort;
+export declare type Table3SortHandler = (sorting: ColumnSort[]) => void;
+export declare type TableStrategy = {
+    renderBody: () => JSX.Element | JSX.Element[] | null;
+    scrollToIndex: (index: number, options?: {
+        align: 'start' | 'center' | 'end' | 'auto';
+    }) => void;
+};
+export declare type Table3ShortcutHandlerFn<TType = unknown> = (row: TType) => void;
+export declare type Table3ShortcutHandlerObject<TType = unknown> = {
+    handler: Table3ShortcutHandlerFn<TType>;
+    meta?: boolean;
+    shift?: boolean;
+};
+export declare type Table3Shortcuts<TType = unknown> = Record<string, Table3ShortcutHandlerFn<TType> | Table3ShortcutHandlerObject<TType>>;
+export declare type Table3SaveHandler<TType = unknown> = (data: TType) => Promise<void>;
+export declare type Table3Options = {
+    enableColumnFreezing: boolean;
+    enableColumnHiding: boolean;
+    enableColumnOrdering: boolean;
+    enableColumnResizing: boolean;
+    enableFontSize: boolean;
+    enablePrinting: boolean;
+    enableRowDrag: boolean;
+    enableRowDrop: boolean;
+    enableRowExpansion: boolean;
+    enableRowGoto: boolean;
+    enableRowHeight: boolean;
+    enableRowSelection: boolean;
+    enableRowSelectionSingle: boolean;
+    enableEditing: boolean;
+    enableFiltering: boolean;
+    enableSearch: boolean;
+    enableSorting: boolean;
+};
+export declare type CommonTable3Props<TType = unknown> = Partial<Table3Options> & {
+    actionsForRow?: Table3RowActionRenderer<TType>[];
+    actionsForRowLength?: number;
+    children: (React.ReactElement<Table3ColumnProps<TType>> | boolean | null | undefined)[];
+    data: TType[];
+    defaultColumnFreezingIndex?: number;
+    defaultCurrentRowIndex?: number;
+    defaultSettings?: Table3Settings;
+    emptyState?: () => JSX.Element;
+    expandedRowRenderer?: Table3RowExpansionRenderer<TType>;
+    id: string;
+    onChangeSettings?: Table3SettingsAdapter;
+    onRowClick?: Table3RowClickHandler<TType>;
+    onRowDrag?: Table3RowDragHandler<TType>;
+    onRowDrop?: Table3RowDropHandler<TType>;
+    onRowGoto?: Table3RowGotoHandler;
+    onRowSelect?: Table3RowSelectionHandler<TType>;
+    onFilter?: Table3FilterHandler;
+    onSave?: Table3SaveHandler;
+    onSearch?: Table3SearchHandler;
+    onSort?: Table3SortHandler;
+    preset?: Table3Preset;
+    shortcuts?: Table3Shortcuts<TType>;
+    toolbarLeft?: JSX.Element;
+    toolbarRight?: JSX.Element;
+};
+interface ClientTable3Props<TType = unknown> extends CommonTable3Props<TType> {
+    length?: never;
+    loadPage?: never;
+    loadAll?: never;
+    pageSize?: never;
+}
+interface ServerTable3Props<TType = unknown> extends CommonTable3Props<TType> {
+    length: number | undefined;
+    loadPage: Table3LoadPageHandler;
+    loadAll: Table3LoadAllHandler;
+    pageSize?: number;
+}
+export declare type Table3Props<TType = unknown> = ClientTable3Props<TType> | ServerTable3Props<TType>;
+export declare type Table3Ref = HTMLDivElement & {
+    instance: {
+        resetFiltering: () => void;
+        resetRowExpansion: () => void;
+        resetRowSelection: () => void;
+        resetSorting: () => void;
+        toggleEditing: (enabled: boolean | undefined) => void;
+    };
+};
+export declare type Table3Texts = {
+    columns: {
+        actions: {
+            tooltip: string;
+        };
+        drag: {
+            tooltip: string;
+        };
+        expansion: {
+            collapse: string;
+            collapseAll: string;
+            expand: string;
+            expandAll: string;
+        };
+        menu: {
+            freezeFirstColumn: string;
+            freezeUptoColumn: string;
+            gotoRow: string;
+            hideColumn: string;
+            unfreezeColumns: string;
+        };
+        resize: {
+            tooltip: string;
+        };
+        select: {
+            deselect: string;
+            deselectAll: string;
+            select: string;
+            selectAll: string;
+        };
+    };
+    columnSettings: {
+        button: string;
+        noResults: string;
+        search: string;
+        tooltip: string;
+    };
+    editing: {
+        actions: {
+            tooltip: string;
+            save: string;
+            clear: string;
+            exit: string;
+        };
+        buttons: {
+            edit: {
+                text: string;
+                tooltip: string;
+            };
+        };
+        rowIndicator: {
+            rowWillMove: string;
+            rowWillBeHidden: string;
+            rowWillMoveReasonSearch: string;
+            rowWillMoveReasonFilter: string;
+            rowWillMoveReasonSorting: string;
+        };
+        saving: {
+            progress: string;
+            complete: string;
+        };
+    };
+    filters: {
+        button: string;
+        buttons: {
+            addFilter: string;
+            clearFilters: string;
+        };
+        comparators: {
+            contains: string;
+            doesNotContain: string;
+            isEqualTo: string;
+            isNotEqualTo: string;
+            isGreaterThan: string;
+            isLessThan: string;
+            isBetween: string;
+            isOneOf: string;
+            isNoneOf: string;
+            isAllOf: string;
+            isEmpty: string;
+            isNotEmpty: string;
+        };
+        conditions: {
+            and: string;
+            where: string;
+        };
+        emptyFilter: {
+            condition: string;
+            value: string;
+        };
+        tooltip: string;
+        total: string;
+    };
+    fontSize: {
+        tooltip: string;
+        sizes: {
+            small: string;
+            medium: string;
+            large: string;
+        };
+    };
+    footer: {
+        summary: {
+            count: string;
+            records: string;
+            selected: string;
+        };
+    };
+    print: {
+        error: string;
+        loading: string;
+        tooltip: string;
+    };
+    rowHeight: {
+        tooltip: string;
+        sizes: {
+            short: string;
+            medium: string;
+            tall: string;
+            extraTall: string;
+        };
+    };
+    search: {
+        excludeUnmatchedResults: string;
+        placeholder: string;
+    };
+};
+export {};

package/dist/components/Table3/util/columns.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { Table as RTable } from '@tanstack/react-table';
+export declare const isInternalColumn: (id: string) => boolean;
+export declare const isFrozenColumn: <TType = unknown>(index: number, table: RTable<TType>) => boolean;
+export declare const getCurrentRowCellElement: (index: number, table: HTMLElement) => Element | null;
+export declare function scrollColumnIntoView(columnIndex: number, frozenColumnIndex: number, column: HTMLElement, table: HTMLElement): void;
+export declare function isCellHighlighted(query: string, value: unknown, children: JSX.Element | string | null): boolean;

package/dist/components/{Table2/components/column/utils.d.ts → Table3/util/editing.d.ts}

@@ -1,3 +1,4 @@
+export declare const focussableNodeNames: string[];
+export declare const focusableSelector: string;
 export declare const hasChanged: (value: any, newValue: any) => boolean;
 export declare const willRowMoveAfterSorting: (value: any, cell: any, rowIndex: any, rows: any, desc: any) => boolean;
-export declare const clickableNodeNames: string[];

package/dist/components/Table3/util/filtering.d.ts

@@ -0,0 +1,3 @@
+import { Table3FilterValue } from '../types';
+export declare function globalFilterFn(value: string, query: string): boolean;
+export declare function columnFilterFn(value: any, filter: Table3FilterValue): boolean;

package/dist/components/Tag/Tag.d.ts

@@ -13,7 +13,7 @@ export declare const Tag: React.ForwardRefExoticComponent<Pick<React.HTMLAttribu
     children: string;
     color?: "green" | "yellow" | "red" | "blue" | "purple" | "brown" | "pink" | "orange" | "grey" | "transparent" | undefined;
     disabled?: boolean | undefined;
-    icon?: React.ReactElement<IconProps, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-minus" | "circle-plus" | "circle-tick" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "density-comfortable" | "density-compact" | "density-normal" | "density-spacious" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "e-signature" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "filter" | "graph-solid" | "hash" | "home" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "list-bulleted" | "list-search" | "list" | "lock-open" | "log-out" | "log" | "market" | "match-amount" | "match-entries" | "menu" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "numbers" | "partner-api" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" | undefined;
+    icon?: React.ReactElement<IconProps, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | "account-preview" | "accounting-year-cancel" | "accounting-year" | "accounting" | "arrow-bottom" | "arrow-down" | "arrow-end" | "arrow-left" | "arrow-right" | "arrow-start" | "arrow-top" | "arrow-up" | "attach-auto" | "attach-cancel" | "attach" | "autotext-insert" | "autotext" | "basic-tabs" | "basic" | "bell-solid" | "book" | "booking" | "budget" | "calendar" | "cash-account" | "cash-reports" | "chat-solid" | "chat" | "chevron-down-double" | "chevron-down-solid" | "chevron-down" | "chevron-left-double" | "chevron-left-solid" | "chevron-left" | "chevron-right-double" | "chevron-right-solid" | "chevron-right" | "chevron-up-double" | "chevron-up-solid" | "chevron-up" | "circle-close" | "circle-minus" | "circle-plus" | "circle-tick" | "clamp-open" | "clamp" | "close" | "column-freeze" | "column-unfreeze" | "columns" | "connection-enable" | "connection-revoke" | "contacts" | "copy" | "courses" | "credit" | "delete-permanently" | "delete" | "depecriate" | "developer" | "distribution-template" | "document-approve" | "document-create-entry" | "document-cut" | "document-error" | "document-isolate-page" | "document-merge" | "document-move" | "document-preview" | "document-received" | "document-rejected-request" | "document-split" | "document-time" | "document" | "download" | "drag" | "e-copedia" | "e-signature" | "edit" | "ellipsis-horizontal" | "ellipsis-vertical" | "entries-on-account" | "entries-open" | "entries-warning" | "entry-type-customer-invoice" | "entry-type-customer-payment" | "entry-type-journal-entry" | "entry-type-manual-customer-invoice" | "entry-type-supplier-invoice" | "entry-type-supplier-payment" | "envelope-approved" | "envelope" | "expand-view" | "expenses" | "export-to-excel" | "export-to-pdf" | "export" | "eye-off" | "eye-on" | "filter-solid" | "filter" | "font-size" | "graph-solid" | "hash" | "height-extra-tall" | "height-medium" | "height-short" | "height-tall" | "home" | "images" | "import" | "inbox-einvoicing" | "inbox-scanning" | "inbox-smart" | "inbox" | "info" | "inventory-matrix" | "inventory" | "journal-pro" | "layout-both" | "layout-first" | "layout-last" | "layout-none" | "layout" | "ledger-card-customer-reminder" | "ledger-card-manual-customer-invoice" | "ledger-card-obsolete-stock" | "ledger-card-opening-entry" | "ledger-card-reserved-entry" | "ledger-card-shrinkage-pilferage" | "ledger-card-stock-adjustment" | "ledger-card-transferred-opening-entry" | "ledger-card" | "lightbulb" | "line" | "list-bulleted" | "list-search" | "list" | "lock-open" | "log-out" | "log" | "market" | "match-amount" | "match-entries" | "menu" | "mileage" | "modal-resize" | "modal-shrink" | "more-solid" | "more" | "move" | "navigation-list" | "note-follow-up" | "note-read" | "note" | "numbers" | "partner-api" | "period" | "person-change" | "person-minus" | "person-plus" | "person-tick" | "play" | "plus-minus" | "print" | "process-payment" | "product-ledger-card" | "profile" | "project-cards" | "projects" | "question-mark" | "quicklinks" | "rating-bankruptcy" | "rating-payment-problems" | "reconciled" | "refresh" | "report-solid" | "report" | "restore" | "rotate-left" | "rotate-right" | "sales" | "search-bold" | "search" | "secure-tick" | "secure" | "settings-solid" | "settings" | "shortcuts" | "show-all" | "show-less" | "show-more" | "show-template" | "sliders" | "smartpay" | "sort-by" | "star-solid" | "star" | "subscriptions" | "system-entries" | "tag" | "template-override" | "templates" | "thumb-both" | "thumb-down-solid" | "thumb-down" | "thumb-up-solid" | "thumb-up" | "tick-bold" | "tick" | "time" | "transfer-cancel" | "transfer-locked" | "transfer" | "undo" | "undock" | "unreconciled" | "warning" | "webshop" | "website" | "workflow-template-basic" | "workflow" | "zoom" | undefined;
     readOnly?: boolean | undefined;
     onDelete?: ((event: React.MouseEvent<SVGSVGElement>) => void) | undefined;
 } & React.RefAttributes<HTMLSpanElement>>;

package/dist/esm/index.css

@@ -147,7 +147,7 @@
         @apply focus:yt-focus flex flex-col focus:rounded-sm;
     }
     table.yt-table thead.yt-table__head tr.yt-table__row {
-        @apply border-grey-100 flex h-auto min-h-[2.5rem] w-full select-none border-t-0 border-b-2 font-bold;
+        @apply border-grey-100 flex h-auto min-h-[2.5rem] w-full select-none border-b-2 border-t-0 font-bold;
     }
 
     table.yt-table thead.yt-table__head tr.yt-table__row th.yt-table__cell {
@@ -162,7 +162,6 @@
         @apply flex-1 truncate p-2 text-center align-middle;
     }
 
-    [aria-hidden] > [data-taco='menu'],
     [aria-hidden] > [data-taco='hanger'] {
         @apply invisible;
     }
@@ -638,3 +637,132 @@
 #yt-table__drag__placeholder {
     @apply flex w-3/12 rounded bg-blue-500 p-4 font-bold text-white;
 }
+
+/* cells */
+[role='cell'],
+[role='columnheader'] {
+    @apply border-grey-300 bg-white;
+}
+
+[role='cell']:not([data-highlighted='true']),
+[role='columnheader'] {
+    @apply flex px-4;
+}
+
+[role='cell'][data-align='left'],
+[role='columnheader'][data-align='left'] {
+    @apply justify-start text-left;
+}
+
+[role='cell'][data-align='center'],
+[role='columnheader'][data-align='center'] {
+    @apply justify-center text-center;
+}
+
+[role='cell'][data-align='right'],
+[role='columnheader'][data-align='right'] {
+    @apply justify-end text-right;
+}
+
+[role='row']:not(:last-child) [role='cell'] {
+    @apply border-b;
+}
+
+/* hovered row */
+[data-pause-hover='false'] [role='row']:hover [role='cell'] {
+    @apply bg-grey-100;
+}
+
+/* current row */
+[role='row'][data-current='true'] [role='cell'] {
+    @apply bg-grey-200;
+}
+
+/* selected row */
+[role='row'][data-selected='true']:not([aria-grabbed='true']) [role='cell'] {
+    @apply !bg-blue-100;
+}
+
+/* dragging row */
+[role='row'][aria-grabbed='true'] [role='cell'] {
+    @apply !wcag-blue-500;
+}
+
+/* error row */
+[role='row'][data-error='true'] [role='cell'] {
+    @apply !bg-red-100/30;
+}
+
+/* cell component overrides */
+
+/* small font size */
+[data-font-size='small'] [role='cell'] [data-taco='badge'],
+[data-font-size='small'] [role='cell'] [data-taco='badge-icon'],
+[data-font-size='small'] [role='cell'] [data-taco='icon'] {
+    @apply !-my-0.5 !text-xs;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='tag'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'],
+[data-font-size='small'] [role='cell'] [data-taco='input-container'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'] {
+    @apply !-my-1;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'] {
+    @apply h-6 min-h-[theme(spacing.6)] px-1.5 text-xs;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)];
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] [data-taco='icon'] {
+    @apply !h-4 !w-4;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='checkbox'],
+[data-font-size='small'] [role='cell'] [data-taco='checkbox-container'],
+[data-font-size='small'] [role='cell'] [data-taco='switch'],
+[data-font-size='small'] [role='cell'] [data-taco='switch-container'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='checkbox-container'] [data-taco='checkbox'],
+[data-font-size='small'] [role='cell'] [data-taco='switch-container'] [data-taco='switch'] {
+    @apply !my-0;
+}
+
+/* medium font size */
+[data-font-size='medium'] [role='cell'] [data-taco='tag'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='medium'] [role='cell'] [data-taco='Select2'],
+[data-font-size='medium'] [role='cell'] [data-taco='input-container'] {
+    @apply !-my-1.5;
+}
+
+/* large font size */
+[data-font-size='large'] [role='cell'] [data-taco='tag'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='Select2'],
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] {
+    @apply !-my-2;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input'],
+[data-font-size='large'] [role='cell'] [data-taco='Select2'] {
+    @apply h-10 px-2.5 text-lg;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply !h-10 !w-10;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] [data-taco='icon'] {
+    @apply !h-6 !w-6;
+}

package/dist/esm/node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js

@@ -1,6 +1,6 @@
 // A type of promise-like that resolves synchronously and supports only one observer
-const _iteratorSymbol = /*#__PURE__*/typeof Symbol !== "undefined" ? Symbol.iterator || (Symbol.iterator = /*#__PURE__*/Symbol("Symbol.iterator")) : "@@iterator";
-const _asyncIteratorSymbol = /*#__PURE__*/typeof Symbol !== "undefined" ? Symbol.asyncIterator || (Symbol.asyncIterator = /*#__PURE__*/Symbol("Symbol.asyncIterator")) : "@@asyncIterator";
+var _iteratorSymbol = /*#__PURE__*/typeof Symbol !== "undefined" ? Symbol.iterator || (Symbol.iterator = /*#__PURE__*/Symbol("Symbol.iterator")) : "@@iterator";
+var _asyncIteratorSymbol = /*#__PURE__*/typeof Symbol !== "undefined" ? Symbol.asyncIterator || (Symbol.asyncIterator = /*#__PURE__*/Symbol("Symbol.asyncIterator")) : "@@asyncIterator";
 
 // Asynchronously call a function and send errors to recovery continuation
 function _catch(body, recover) {