@economic/taco 2.35.1 → 2.36.0

package/dist/esm/packages/taco/src/utils/dom.js.map

@@ -1 +1 @@
-{"version":3,"file":"dom.js","sources":["../../../../../../src/utils/dom.ts"],"sourcesContent":["// taken from react-aria\nconst FOCUSABLE_ELEMENTS = [\n    'input:not([disabled]):not([type=hidden])',\n    'select:not([disabled])',\n    'textarea:not([disabled])',\n    'button:not([disabled])',\n    'a[href]',\n    'area[href]',\n    'summary',\n    'iframe',\n    'object',\n    'embed',\n    'audio[controls]',\n    'video[controls]',\n    '[contenteditable]',\n    '[tabindex]:not([tabindex=\"-1\"]):not([disabled])',\n    'details:not([disabled])',\n    'summary:not(:disabled)',\n];\n\nexport const hasFocusableElement = (element: HTMLElement | null) => {\n    if (!element) {\n        return null;\n    }\n\n    return !!element.querySelector(FOCUSABLE_ELEMENTS.join(','));\n};\n\nexport const isOverflowing = (element: HTMLElement | null) =>\n    element !== null ? element.scrollWidth > element.offsetWidth : false;\n\nexport const getIndexOfFirstChildOverflowingParent = (element: HTMLElement, overscan = 0) => {\n    let index = 0;\n    let boundaryChildIndex: number | null = null;\n    const clientRect = element.getBoundingClientRect();\n\n    for (const child of Array.from(element.children)) {\n        const right = child.getBoundingClientRect().right - clientRect.left;\n        const width = clientRect.width - overscan;\n\n        if (right > width) {\n            boundaryChildIndex = index;\n            break;\n        }\n        index++;\n    }\n\n    return boundaryChildIndex;\n};\n\nexport const getNextFocussableElement = (currentElement: HTMLElement | null) => {\n    if (!currentElement) {\n        return null;\n    }\n\n    const focussableElements = [...document.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS.join(','))];\n    const currentElementIndex = focussableElements.indexOf(currentElement);\n\n    // If the currentElement is not in the focussable elements list or it is the last element\n    if (currentElementIndex !== -1 && currentElementIndex === focussableElements.length - 1) {\n        return null;\n    }\n\n    return focussableElements[currentElementIndex + 1];\n};\n\nconst getOverlaySelector = (element: Element | null) => {\n    switch (element?.getAttribute('role')) {\n        case 'dialog':\n            return `[aria-controls='${element.id}']`;\n\n        case 'menu':\n            return `#${element.getAttribute('aria-labelledby')}`;\n\n        default:\n            return undefined;\n    }\n};\n\nexport function isElementInsideOrTriggeredFromContainer(element: Element | null, container: Element | null) {\n    const selector = getOverlaySelector(element) ?? getOverlaySelector(element?.closest('[role=dialog],[role=menu]') ?? null);\n\n    if (selector) {\n        if (container?.querySelector(selector)) {\n            return true;\n        }\n\n        const elementInDocument = document.querySelector(selector);\n\n        // if the element does exist, see if it is itself connected to somethng that was triggered from the container\n        if (elementInDocument) {\n            return isElementInsideOrTriggeredFromContainer(elementInDocument, container);\n        }\n\n        return false;\n    }\n\n    return !!container?.contains(element);\n}\n\nexport function isElementInsideOverlay(element: Element | null) {\n    return !!element?.closest('[role=dialog],[role=menu]');\n}\n\nexport function isSiblingElementInsideSameParentOverlay(element: Element | null, sibling: Element | null) {\n    return !!element?.closest('[role=dialog],[role=menu]')?.contains(sibling);\n}\n\nexport function isElementInteractive(element: Element | null) {\n    if (!element) {\n        return false;\n    }\n\n    return (\n        ['A', 'BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'LABEL', 'OPTION'].includes(element.tagName) &&\n        !(element as HTMLElement).hidden &&\n        !(element as HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | HTMLButtonElement).disabled &&\n        !(element as HTMLInputElement | HTMLTextAreaElement).readOnly\n    );\n}\n\nexport function isElementInsideTable3OrReport(element: Element | null) {\n    return !!element?.closest('[data-taco^=table]');\n}\n"],"names":["FOCUSABLE_ELEMENTS","hasFocusableElement","element","querySelector","join","getIndexOfFirstChildOverflowingParent","overscan","index","boundaryChildIndex","clientRect","getBoundingClientRect","child","Array","from","children","right","left","width","getNextFocussableElement","currentElement","focussableElements","document","querySelectorAll","currentElementIndex","indexOf","length","getOverlaySelector","getAttribute","id","undefined","isElementInsideOrTriggeredFromContainer","container","selector","_getOverlaySelector","_element$closest","closest","elementInDocument","contains","isElementInsideOverlay","isSiblingElementInsideSameParentOverlay","sibling","_element$closest2","isElementInteractive","includes","tagName","hidden","disabled","readOnly","isElementInsideTable3OrReport"],"mappings":"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"}
+{"version":3,"file":"dom.js","sources":["../../../../../../src/utils/dom.ts"],"sourcesContent":["// taken from react-aria\nconst FOCUSABLE_ELEMENTS = [\n    'input:not([disabled]):not([type=hidden])',\n    'select:not([disabled])',\n    'textarea:not([disabled])',\n    'button:not([disabled])',\n    'a[href]',\n    'area[href]',\n    'summary',\n    'iframe',\n    'object',\n    'embed',\n    'audio[controls]',\n    'video[controls]',\n    '[contenteditable]',\n    '[tabindex]:not([tabindex=\"-1\"]):not([disabled])',\n    'details:not([disabled])',\n    'summary:not(:disabled)',\n];\n\nexport const hasFocusableElement = (element: HTMLElement | null) => {\n    if (!element) {\n        return null;\n    }\n\n    return !!element.querySelector(FOCUSABLE_ELEMENTS.join(','));\n};\n\nexport const isOverflowing = (element: HTMLElement | null) =>\n    element !== null ? element.scrollWidth > element.offsetWidth : false;\n\nexport const getIndexOfFirstChildOverflowingParent = (element: HTMLElement, overscan = 0) => {\n    let index = 0;\n    let boundaryChildIndex: number | null = null;\n    const clientRect = element.getBoundingClientRect();\n\n    for (const child of Array.from(element.children)) {\n        const right = child.getBoundingClientRect().right - clientRect.left;\n        const width = clientRect.width - overscan;\n\n        if (right > width) {\n            boundaryChildIndex = index;\n            break;\n        }\n        index++;\n    }\n\n    return boundaryChildIndex;\n};\n\nexport const getNextFocussableElement = (currentElement: HTMLElement | null, direction: -1 | 1 = 1) => {\n    if (!currentElement) {\n        return null;\n    }\n\n    const focussableElements = [...document.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS.join(','))];\n    const currentElementIndex = focussableElements.indexOf(currentElement);\n\n    // If the currentElement is not in the focussable elements list or it is the last element\n    if (currentElementIndex !== -1 && currentElementIndex === focussableElements.length - 1) {\n        return null;\n    }\n\n    return focussableElements[currentElementIndex + direction];\n};\n\nconst getOverlaySelector = (element: Element | null) => {\n    switch (element?.getAttribute('role')) {\n        case 'dialog':\n            return `[aria-controls='${element.id}']`;\n\n        case 'menu':\n            return `#${element.getAttribute('aria-labelledby')}`;\n\n        default:\n            return undefined;\n    }\n};\n\nexport function isElementInsideOrTriggeredFromContainer(element: Element | null, container: Element | null) {\n    const selector = getOverlaySelector(element) ?? getOverlaySelector(element?.closest('[role=dialog],[role=menu]') ?? null);\n\n    if (selector) {\n        if (container?.querySelector(selector)) {\n            return true;\n        }\n\n        const elementInDocument = document.querySelector(selector);\n\n        // if the element does exist, see if it is itself connected to somethng that was triggered from the container\n        if (elementInDocument) {\n            return isElementInsideOrTriggeredFromContainer(elementInDocument, container);\n        }\n\n        return false;\n    }\n\n    return !!container?.contains(element);\n}\n\nexport function isElementInsideOverlay(element: Element | null) {\n    return !!element?.closest('[role=dialog],[role=menu]');\n}\n\nexport function isSiblingElementInsideSameParentOverlay(element: Element | null, sibling: Element | null) {\n    return !!element?.closest('[role=dialog],[role=menu]')?.contains(sibling);\n}\n\nexport function isElementInteractive(element: Element | null) {\n    if (!element) {\n        return false;\n    }\n\n    return (\n        ['A', 'BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'LABEL', 'OPTION'].includes(element.tagName) &&\n        !(element as HTMLElement).hidden &&\n        !(element as HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | HTMLButtonElement).disabled &&\n        !(element as HTMLInputElement | HTMLTextAreaElement).readOnly\n    );\n}\n\nexport function isElementInsideTable3OrReport(element: Element | null) {\n    return !!element?.closest('[data-taco^=table]');\n}\n"],"names":["FOCUSABLE_ELEMENTS","hasFocusableElement","element","querySelector","join","getIndexOfFirstChildOverflowingParent","overscan","index","boundaryChildIndex","clientRect","getBoundingClientRect","child","Array","from","children","right","left","width","getNextFocussableElement","currentElement","direction","focussableElements","document","querySelectorAll","currentElementIndex","indexOf","length","getOverlaySelector","getAttribute","id","undefined","isElementInsideOrTriggeredFromContainer","container","selector","_getOverlaySelector","_element$closest","closest","elementInDocument","contains","isElementInsideOverlay","isSiblingElementInsideSameParentOverlay","sibling","_element$closest2","isElementInteractive","includes","tagName","hidden","disabled","readOnly","isElementInsideTable3OrReport"],"mappings":"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"}

package/dist/index.css

@@ -814,13 +814,19 @@ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='tag'] {
 
 table[data-taco^='table'][data-table-font-size='small'] td [data-taco='select2-container'],
 table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2'],
-table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input'],
 table[data-taco^='table'][data-table-font-size='small'] td [data-taco='textarea'] {
     @apply !-mx-[7px] !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
 }
 
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container']:has([data-taco='input']) {
+    @apply !-mx-[7px] !w-auto;
+}
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container']:has([data-taco='input']) [data-taco='input'] {
+        @apply !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
+    }
+
 table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2'],
-table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input'],
 table[data-taco^='table'][data-table-font-size='small'] td [data-taco='textarea'] {
     @apply !px-1.5;
 }
@@ -839,16 +845,16 @@ table[data-taco^='table'][data-table-font-size='small'] td [data-taco='textarea'
 }
 
 table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='postfix'] button {
-    @apply z-10 !-mr-[15px] !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)];
+    @apply z-10 !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)];
 }
 
-table[data-taco^='table'][data-table-font-size='small']
-    td
-    [data-taco='input-container']
-    [data-affix-type='postfix']
-    [data-taco='icon'] {
-    @apply !h-4 !w-4;
-}
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='postfix']:not([data-taco='icon-button']), table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='prefix']:not([data-taco='icon-button']) {
+        @apply z-10;
+    }
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='postfix']:not([data-taco='icon-button'])[data-taco='icon'], table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='prefix']:not([data-taco='icon-button'])[data-taco='icon'] {
+            @apply !h-4 !w-4;
+        }
 
 table[data-taco^='table'][data-table-font-size='small'] td [role='combobox'] {
     @apply !flex;
@@ -898,11 +904,18 @@ table[data-taco^='table'][data-table-font-size='medium'] td [role='combobox'] [d
 
 table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='select2-container'],
 table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='Select2'],
-table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input'],
 table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='textarea'] {
     @apply !-mx-[9px] !-my-[6px] !min-h-[theme(spacing.8)] !w-[calc(100%_+_16px)] focus:z-10;
 }
 
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container']:has([data-taco='input']) {
+    @apply !-mx-[9px] !w-auto;
+}
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container']:has([data-taco='input']) [data-taco='input'] {
+        @apply !-my-[6px] !min-h-[theme(spacing.8)] !w-[calc(100%_+_16px)] focus:z-10;
+    }
+
 table[data-taco^='table'][data-table-font-size='medium'] td[data-cell-align='right'] [data-taco='input'],
 table[data-taco^='table'][data-table-font-size='medium'] td[data-cell-align='right'] [data-taco='textarea'] {
     @apply pr-1.5;
@@ -929,9 +942,13 @@ table[data-taco^='table'][data-table-font-size='medium'] td[data-cell-truncate='
 }
 
 table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container'] [data-affix-type='postfix'] button {
-    @apply z-10 !-mr-4;
+    @apply z-10;
 }
 
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container'] [data-affix-type='postfix']:not([data-taco='icon-button']), table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container'] [data-affix-type='prefix']:not([data-taco='icon-button']) {
+        @apply z-10;
+    }
+
 /* large font size */
 table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='spinner'] {
     @apply !h-6 !w-6;
@@ -956,11 +973,18 @@ table[data-taco^='table'][data-table-font-size='large'] td [role='combobox'] [da
 
 table[data-taco^='table'][data-table-font-size='large'] td [data-taco='select2-container'],
 table[data-taco^='table'][data-table-font-size='large'] td [data-taco='Select2'],
-table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input'],
 table[data-taco^='table'][data-table-font-size='large'] td [data-taco='textarea'] {
     @apply !-mx-[11px] !-mb-[7.5px] !-mt-[8.5px] !w-[calc(100%_+_22px)] focus:z-10;
 }
 
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container']:has([data-taco='input']) {
+    @apply !-mx-[11px] !w-auto;
+}
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container']:has([data-taco='input']) [data-taco='input'] {
+        @apply !-mb-[7.5px] !-mt-[8.5px] !w-[calc(100%_+_22px)] focus:z-10;
+    }
+
 table[data-taco^='table'][data-table-font-size='large'] td [data-taco='select2-container'] [data-taco='Select2'] {
     @apply !m-auto !w-full;
 }
@@ -992,16 +1016,12 @@ table[data-taco^='table'][data-table-font-size='large'] td [data-taco='textarea'
 }
 
 table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container'] [data-affix-type='postfix'] button {
-    @apply z-10 !-mr-[19px] !h-10 !w-10;
+    @apply z-10 !h-10 !w-10;
 }
 
-table[data-taco^='table'][data-table-font-size='large']
-    td
-    [data-taco='input-container']
-    [data-affix-type='postfix']
-    [data-taco='icon'] {
-    @apply !h-6 !w-6;
-}
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container'] [data-affix-type='postfix']:not([data-taco='icon-button']), table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container'] [data-affix-type='prefix']:not([data-taco='icon-button']) {
+        @apply z-10;
+    }
 
 /* row/cell backgrounds -- we have to be specific so that nested tables don't inherit */
 /* normal rows */

package/dist/primitives/Table/Core/components/Header/components/Menu.d.ts

@@ -6,6 +6,7 @@ export declare type HeaderMenuProps = React.ButtonHTMLAttributes<HTMLButtonEleme
     canHide: boolean;
     canPin: boolean;
     canSort: boolean;
+    columnId: string;
     customMenu?: TableColumnMenu;
     index: number;
     isFiltered: boolean;

package/dist/primitives/Table/types.d.ts

@@ -1,7 +1,6 @@
 /// <reference types="react" />
 import { ColumnFilter as ReactTableColumnFilter, ColumnFiltersState as ReactTableColumnFilterState, ColumnOrderState as ReactTableColumnOrderState, ColumnPinningState as ReactTableColumnPinningState, ColumnSort as ReactTableColumnSort, ColumnSizingState as ReactTableColumnSizingState, VisibilityState as ReactTableColumnVisibilityState, SortingState as ReactTableSortingState, BuiltInAggregationFn as ReactTableBuiltInAggregationFn, BuiltInSortingFn as ReactTableBuiltInSortingFn } from '@tanstack/react-table';
 import { FontSize, FontSizes, ValueOf } from '../../types';
-import { MenuProps } from '../../components/Menu/Menu';
 import { MenuItemProps } from '../../components/Menu/components/Item';
 export declare type TableRef = HTMLTableElement & {
     instance: {
@@ -39,7 +38,7 @@ export declare type TableColumnAlignment = 'left' | 'center' | 'right';
 export declare type TableColumnClassNameHandler<TType = unknown> = string | ((row: TType) => string | undefined);
 export declare type TableColumnDataType = 'auto' | 'number' | 'alphanumeric' | 'alphanumericCaseSensitive' | 'datetime' | 'boolean';
 export declare type TableColumnFilter = ReactTableColumnFilter;
-export declare type TableColumnMenu = (props: Partial<MenuProps>) => JSX.Element;
+export declare type TableColumnMenu = ((columnId: string) => React.ReactNode | null)[];
 export declare type TableColumnRenderer<TType, TValue> = (value: TValue, row: TType) => JSX.Element | string | number | null;
 export declare type TableColumnRendererAggregate<TType, TValue> = (value: TValue, row: TType) => JSX.Element | string | number | null;
 export declare type TableColumnRendererControl<TType = unknown> = ((props: TableColumnRendererControlProps, row?: TType) => JSX.Element) | 'datepicker' | 'input' | 'switch' | 'textarea';
@@ -123,7 +122,7 @@ export declare type TableEnableSettingsOptions = {
     rowHeight: boolean;
     sorting: boolean;
 };
-export declare type TableFeatureProps = {
+export declare type TableFeatureProps<TType = unknown> = {
     enableFiltering?: boolean;
     enableSearch?: boolean;
     enableSorting?: boolean;
@@ -139,14 +138,14 @@ export declare type TableFeatureProps = {
     enablePrinting?: boolean;
     enableRowActions?: boolean;
     enableRowActive?: boolean;
-    enableRowClick?: boolean;
+    enableRowClick?: boolean | ((row: TType) => boolean);
     enableRowDrag?: boolean;
     enableRowDrop?: boolean;
     enableRowGoto?: boolean;
     enableRowHeight?: boolean;
     enableSaveSettings?: boolean | Partial<TableEnableSettingsOptions>;
 };
-export declare type TableCommonProps<TType = unknown> = TableFeatureProps & {
+export declare type TableCommonProps<TType = unknown> = TableFeatureProps<TType> & {
     children: (JSX.Element | boolean | null | undefined)[];
     data: TType[];
     id: string;
@@ -161,7 +160,7 @@ export declare type TableCommonProps<TType = unknown> = TableFeatureProps & {
     rowActionsForGroup?: TableRowActionGroupRenderer<TType>[];
     rowActionsLength?: number;
     rowExpansionRenderer?: TableRowExpansionRenderer<TType>;
-    rowIdentityColumnId?: string;
+    rowIdentityColumnAccessor?: keyof TType | (keyof TType)[];
     shortcuts?: TableShortcuts<TType>;
     toolbarLeft?: JSX.Element;
     toolbarRight?: JSX.Element;
@@ -279,6 +278,9 @@ export declare type TableTexts = {
         buttons: {
             addFilter: string;
             clearFilters: string;
+            cancel: string;
+            clear: string;
+            apply: string;
         };
         comparators: {
             contains: string;

package/dist/primitives/Table/useTableManager/features/useTableRowClick.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { TableRowClickHandler } from '../../types';
-export declare function useTableRowClick<TType = unknown>(isEnabled?: boolean, onRowClick?: TableRowClickHandler<TType>): {
-    isEnabled: boolean;
-    handleClick: (event: React.MouseEvent<HTMLTableRowElement>, data: TType) => void;
-    handleKeyDown: <TType_1 = unknown>(event: KeyboardEvent, data: TType_1) => void;
+export declare function useTableRowClick<TType = unknown>(isEnabled?: boolean | ((row: TType) => boolean), onRowClick?: TableRowClickHandler<TType>): {
+    isEnabled: (row: TType) => boolean;
+    handleClick: (event: React.MouseEvent<HTMLTableRowElement>, rowData: TType) => void;
+    handleKeyDown: <TType_1 = unknown>(event: KeyboardEvent, rowData: TType_1) => void;
 };

package/dist/primitives/Table/useTableManager/useTableManager.d.ts

@@ -35,7 +35,7 @@ declare module '@tanstack/table-core' {
         rowGoto: ReturnType<typeof useTableRowGoto>;
         rowGroups: ReturnType<typeof useTableRowGroups>;
         rowHeight: ReturnType<typeof useTableRowHeight>;
-        rowIdentityColumnId?: string;
+        rowIdentityColumnAccessor: (keyof TData)[];
         rowSelection: ReturnType<typeof useTableRowSelection>;
         search: ReturnType<typeof useTableSearch>;
         server: ReturnType<typeof useTableServerLoading>;

package/dist/primitives/Table/useTableManager/util/presets.d.ts

@@ -1,2 +1,2 @@
 import { TableFeatureProps, TableProps } from '../../types';
-export declare function getTableFeaturePreset<TType = unknown>(props: TableProps<TType>): TableFeatureProps;
+export declare function getTableFeaturePreset<TType = unknown>(props: TableProps<TType>): TableFeatureProps<TType>;

package/dist/primitives/Table/useTableManager/util/setup.d.ts

@@ -1,13 +1,13 @@
 import { TableOptions as ReactTableOptions, ColumnDef as ReactTableColumnDef, ColumnSizingState as ReactTableColumnSizingState, ColumnSort as ReactTableColumnSort, TableState as ReactTableState, VisibilityState as ReactTableVisibilityState } from '@tanstack/react-table';
 import { useTableManagerInternalColumns } from '../types';
 import { TableFeatureProps, TableProps, TableSettings } from '../../types';
-export declare function mapTableChildrenToColumns<TType = unknown>(props: TableProps<TType>, settings: TableSettings, options: TableFeatureProps, internalColumns?: useTableManagerInternalColumns<TType>): {
+export declare function mapTableChildrenToColumns<TType = unknown>(props: TableProps<TType>, settings: TableSettings, options: TableFeatureProps<TType>, internalColumns?: useTableManagerInternalColumns<TType>): {
     columns: ReactTableColumnDef<TType, unknown>[];
     defaultSizing: Record<string, number>;
     defaultSorting: ReactTableColumnSort[];
     defaultVisibility: Record<string, boolean>;
 };
-export declare function configureReactTableOptions<TType = unknown>(options: TableFeatureProps, props: TableProps<TType>): Partial<ReactTableOptions<TType>>;
+export declare function configureReactTableOptions<TType = unknown>(options: TableFeatureProps<TType>, props: TableProps<TType>): Partial<ReactTableOptions<TType>>;
 export declare function useReactTableInitialState<TType = unknown>(props: TableProps<TType>, columns: ReactTableColumnDef<TType>[], persistedSettings: TableSettings, defaults: {
     defaultSizing: ReactTableColumnSizingState;
     defaultSorting: ReactTableColumnSort[];