@antscorp/antsomi-ui 1.3.7-beta.68 → 1.3.7-beta.69

package/es/components/organism/ContentSources/styled.d.ts

@@ -1,7 +1,8 @@
+/// <reference types="react" />
 import { ContentSourceModeView } from './types';
 export declare const ContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const WrapperPanelHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledCollapsePanel: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").CollapsePanelProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+export declare const StyledCollapsePanel: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/collapse/CollapsePanel").CollapsePanelProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
 export declare const WrapperFallback: import("styled-components").StyledComponent<"div", any, {
     mode: ContentSourceModeView;
 }, never>;

package/es/components/organism/DataTable/DataTable.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Libraries
 import React from 'react';
 // Hooks
-import { useDataTable } from './hooks';
+import { useDataTable } from './hooks/useDataTable';
 import { useDeepCompareMemo } from '@antscorp/antsomi-ui/es/hooks';
 // Styled
 import { DataTableContent, DataTableWrapper } from './styled';

package/es/components/organism/DataTable/components/ModifyColumn/styled.d.ts

@@ -1,3 +1,4 @@
-export declare const PopoverContent: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
-export declare const SavedModifyColumnOption: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+/// <reference types="react" />
+export declare const PopoverContent: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const SavedModifyColumnOption: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
 export declare const YourColumnSet: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/typography/Text").TextProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;

package/es/components/organism/DataTable/components/Pagination/index.js

@@ -11,7 +11,7 @@ import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
 // Styled
 import { ActionButton, PaginationWrapper } from './styled';
 // Constants
-import { DEFAULT_PAGE, DEFAULT_PAGE_SIZE, PAGE_SIZE_OPTIONS } from '../../constants';
+import { DEFAULT_PAGE, DEFAULT_PAGE_SIZE, PAGE_SIZE_OPTIONS } from '../../constants/pagination';
 const { Text } = Typography;
 export const Pagination = props => {
     // Props

package/es/components/organism/DataTable/components/Pagination/styled.d.ts

@@ -1,4 +1,5 @@
-export declare const PaginationWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+/// <reference types="react" />
+export declare const PaginationWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
 export declare const ActionButton: import("styled-components").StyledComponent<"div", any, {
-    disabled?: boolean;
+    disabled?: boolean | undefined;
 }, never>;

package/es/components/organism/DataTable/components/Table/styled.d.ts

@@ -1,11 +1,11 @@
 export declare const StyledTable: import("styled-components").StyledComponent<import("antd/es/table/interface").RefTable & {
     displayName?: string | undefined;
-    SELECTION_COLUMN: typeof import("antd/es/table/hooks/useSelection").SELECTION_COLUMN;
-    EXPAND_COLUMN: typeof import("rc-table").EXPAND_COLUMN;
-    SELECTION_ALL: typeof import("antd/es/table/hooks/useSelection").SELECTION_ALL;
-    SELECTION_INVERT: typeof import("antd/es/table/hooks/useSelection").SELECTION_INVERT;
-    SELECTION_NONE: typeof import("antd/es/table/hooks/useSelection").SELECTION_NONE;
+    SELECTION_COLUMN: {};
+    EXPAND_COLUMN: {};
+    SELECTION_ALL: "SELECT_ALL";
+    SELECTION_INVERT: "SELECT_INVERT";
+    SELECTION_NONE: "SELECT_NONE";
     Column: typeof import("antd/es/table/Column").default;
     ColumnGroup: typeof import("antd/es/table/ColumnGroup").default;
-    Summary: typeof import("rc-table").Summary;
+    Summary: typeof import("rc-table/lib/Footer/Summary").default;
 }, any, {}, never>;

package/es/components/organism/DataTable/components/Toolbar/styled.d.ts

@@ -1,12 +1,13 @@
-export declare const ToolbarWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {
+/// <reference types="react" />
+export declare const ToolbarWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {
     $isFilterActive: boolean;
 }, never>;
 export declare const CollapseButton: import("styled-components").StyledComponent<"div", any, {
     $collapsed: boolean;
 }, never>;
-export declare const ToolbarActionButtonWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
-export declare const FilterSection: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
-export declare const RowSelectedControlWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const ToolbarActionButtonWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const FilterSection: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const RowSelectedControlWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
 export declare const IconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 /** Search Popover */
-export declare const StyledSearchItem: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const StyledSearchItem: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;

package/es/components/organism/DataTable/constants/toolbar.d.ts

@@ -1,4 +1,3 @@
-import { TActionOptions } from '@antscorp/antsomi-ui/es/types';
 export declare const TOOLBAR_ACTION_KEYS: {
     readonly SEARCH: "SEARCH";
     readonly COLUMN: "COLUMN";
@@ -12,7 +11,53 @@ export declare const TOOLBAR_ACTION_KEYS: {
     readonly MORE: "MORE";
     readonly GROUP_BY: "GROUP_BY";
 };
-export declare const TOOLBAR_ACTION_OPTIONS: TActionOptions;
+export declare const TOOLBAR_ACTION_OPTIONS: {
+    readonly SEARCH: {
+        readonly key: "SEARCH";
+        readonly label: string;
+        readonly icon: import("react/jsx-runtime").JSX.Element;
+    };
+    readonly COLUMN: {
+        readonly key: "COLUMN";
+        readonly label: "Column";
+        readonly icon: import("react/jsx-runtime").JSX.Element;
+    };
+    readonly EXPLORE: {
+        readonly key: "EXPLORE";
+        readonly label: "Explore";
+        readonly icon: "icon-ants-explore";
+    };
+    readonly EXPORT: {
+        readonly key: "EXPORT";
+        readonly label: "Export";
+        readonly icon: "file-download";
+    };
+    readonly CALENDAR: {
+        readonly key: "CALENDAR";
+        readonly label: "Calendar";
+        readonly icon: "file-download";
+    };
+    readonly TABLE: {
+        readonly key: "TABLE";
+        readonly label: "Table";
+        readonly icon: "file-download";
+    };
+    readonly COMPARE: {
+        readonly key: "COMPARE";
+        readonly label: "Compare";
+        readonly icon: "file-download";
+    };
+    readonly GRID_VIEW: {
+        readonly key: "GRID_VIEW";
+        readonly label: "Grid View";
+        readonly icon: import("react/jsx-runtime").JSX.Element;
+    };
+    readonly GROUP_BY: {
+        readonly key: "GROUP_BY";
+        readonly label: "Group By";
+        readonly icon: import("react/jsx-runtime").JSX.Element;
+    };
+};
 export declare const GRID_VIEW_KEYS: {
     readonly TABLE: "TABLE";
     readonly GRID: "GRID";

package/es/components/organism/DataTable/contexts/DataTableContext.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { StoreApi } from 'zustand';
 import { DataTableStore } from '../types';
 export declare const DataTableContext: import("react").Context<StoreApi<DataTableStore<any>> | null>;

package/es/components/organism/DataTable/hooks/index.d.ts

@@ -1,2 +1,3 @@
 export * from './useDataTable';
 export * from './useDataTableListing';
+export { useCDPTable } from './useCDPTable/useCDPTable';

package/es/components/organism/DataTable/hooks/index.js

@@ -1,2 +1,3 @@
 export * from './useDataTable';
 export * from './useDataTableListing';
+export { useCDPTable } from './useCDPTable/useCDPTable';

package/es/components/organism/DataTable/hooks/useCDPTable/useCDPTable.d.ts

@@ -0,0 +1,58 @@
+import { PaginationProps, TableProps } from 'antd';
+import { FilterProps } from '../../../Filter';
+import { TColumnActionButton, TGridViewActionButton, TGroupByActionButton, TSearchActionButton } from '../../types';
+import { useGetColumnMetrics, useGetFilterMetricList, useGetModifyColumnList, useGetSavedFilterList, useGetSearchListing, useGetTableListing } from '@antscorp/antsomi-ui/es/queries';
+import { UseDataTableListingProps } from '../useDataTableListing/types';
+import React from 'react';
+export declare const getColumnWidthsState: (key: any) => any;
+export declare const setColumnWidthsState: (key: any, value: any) => void;
+interface TUseDataTableListing<TTableType = any> {
+    modifyColumn: TColumnActionButton;
+    filter: FilterProps;
+    pagination: PaginationProps;
+    table: TableProps<TTableType>;
+    search: TSearchActionButton;
+    gridView: TGridViewActionButton;
+    groupBy: TGroupByActionButton;
+    /**
+     * This selectedRowKeys is deprecated. Use selectedRow.keys instead.
+     * @deprecated
+     */
+    selectedRowKeys: React.Key[];
+    selectedRow: {
+        keys: React.Key[];
+        rows: TTableType[];
+    };
+    queries: {
+        getTableListing: ReturnType<typeof useGetTableListing>;
+        getModifyColumnList: ReturnType<typeof useGetModifyColumnList>;
+        getSavedFilterList: ReturnType<typeof useGetSavedFilterList>;
+        getColumnMetrics: ReturnType<typeof useGetColumnMetrics>;
+        getFilterMetricList: ReturnType<typeof useGetFilterMetricList>;
+        getSearchListing: ReturnType<typeof useGetSearchListing>;
+    };
+    /**
+     * Function to refetch table listing
+     * @returns void
+     */
+    refetchTableListing: () => void;
+    onChangeSelectedRow: (selectedRowKeys: React.Key[], selectedRows?: TTableType[]) => void;
+    setDatTableListingState: React.Dispatch<React.SetStateAction<any>>;
+}
+interface ExtendCDPTableProps {
+    columns: any;
+    data: any;
+    selectedRows: any;
+    expanded: any;
+    initSortBy: any;
+    moduleConfig: any;
+    isSelectedAll: any;
+    isTableSelectCurrentPage: any;
+    maxSelectedRows: any;
+    noCheckboxAction: any;
+    setSelectedRow: any;
+    sizeCheckbox: any;
+    onSelectAllPage: any;
+}
+export declare const useCDPTable: <TTableType extends Object = Record<string, any>, TSearchType = any>(props: UseDataTableListingProps<TTableType, TSearchType> & ExtendCDPTableProps) => TUseDataTableListing<TTableType>;
+export {};

package/es/components/organism/DataTable/hooks/useCDPTable/useCDPTable.js

@@ -0,0 +1,127 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import global from 'global';
+import { useSticky } from 'react-table-sticky';
+// import { useReactTable } from '@tanstack/react-table';
+import { useTable, useFlexLayout, useResizeColumns, useSortBy, useExpanded } from 'react-table';
+import { safeParse } from '@antscorp/antsomi-ui/es/utils';
+import React from 'react';
+import { Checkbox } from '@antscorp/antsomi-ui/es/components/atoms';
+// import { TState } from '@antscorp/antsomi-ui/es/components/molecules/SelectAccount/type';
+export const getColumnWidthsState = key => safeParse(JSON.parse(localStorage.getItem(`column-widths-${key}`) || ''), {});
+export const setColumnWidthsState = (key, value) => localStorage.setItem(`column-widths-${key}`, JSON.stringify(value));
+const CellCheckbox = React.forwardRef((props, ref) => {
+    const defaultRef = React.useRef();
+    const resolvedRef = ref || defaultRef;
+    const { selectedRows, original, isSelectedAll, maxSelectedRows, setSelectedRow } = props;
+    // React.useEffect(() => {}, [resolvedRef, props]);
+    // console.log('--- CellCheckbox', selectedRows, original);
+    // isNotChecked ???
+    const isChecked = !selectedRows.has(original.id);
+    const onCheckBox = () => {
+        // console.log('onChange', { original, isChecked });
+        setSelectedRow({ original, isChecked });
+    };
+    // disable khi row chưa có trong max selectedRows && maxSelectedRows == size
+    const disabled = (isChecked && maxSelectedRows === selectedRows.size) || original.disabledCheckbox;
+    return (_jsx(Checkbox, { onClick: onCheckBox, checked: selectedRows.has(original.id) || isSelectedAll, disabled: disabled, ref: resolvedRef }));
+});
+const HeaderCheckbox = React.forwardRef((props, ref) => {
+    const defaultRef = React.useRef();
+    const resolvedRef = ref || defaultRef;
+    const { data, selectedRows, limit, isTableSelectCurrentPage, maxSelectedRows, global, disabledHeaderCheckbox, onSelectAllPage, } = props;
+    // check quyen disable permission
+    const { disabledCheckBoxAll = false } = global;
+    // disable khi có props maxSelectedRows và chưa có row nào được select
+    const disabled = (selectedRows.size === 0 && !!maxSelectedRows) || disabledCheckBoxAll;
+    const onCheckBox = () => {
+        let isChecked = false;
+        const countDisableCheckbox = data.filter(row => row.disabledCheckbox).length;
+        const limitTable = limit - countDisableCheckbox;
+        // nếu có props maxSelectedRows => luôn cho isCheck là false (bỏ check all)
+        if (selectedRows.size === limitTable || !!maxSelectedRows) {
+            isChecked = false;
+        }
+        else {
+            isChecked = true;
+        }
+        props.onSelectAllPage({ data, isChecked });
+    };
+    return (
+    // <WrapperDisable disabled={data.length === 0}>
+    _jsx(Checkbox, { type: "checkbox", 
+        // selecting={selectedRows.size > 0 && selectedRows.size !== limit}
+        onClick: onCheckBox, checked: isTableSelectCurrentPage, onChange: () => { }, ref: resolvedRef, disabled: disabledHeaderCheckbox || disabled })
+    // </WrapperDisable>
+    );
+});
+export const useCDPTable = (props) => {
+    const { config, name = 'default', table: tableProps, search: searchProps, filter: filterProps, gridView: gridViewProps, groupBy: groupByProps, queryOptions, columns, data, selectedRows, expanded: initSortByProps, initSortBy, moduleConfig, isSelectedAll, isTableSelectCurrentPage, maxSelectedRows, noCheckboxAction, setSelectedRow, sizeCheckbox, onSelectAllPage, } = props || {};
+    // const {
+    //   getTableProps,
+    //   getTableBodyProps,
+    //   headerGroups,
+    //   footerGroups,
+    //   prepareRow,
+    //   visibleColumns,
+    //   rows,
+    //   state: { sortBy, columnResizing, expanded },
+    // } = useTable(
+    const result = useTable({
+        columns,
+        autoResetResize: false,
+        data,
+        selectedRows,
+        initialState: {
+            expanded: initSortByProps,
+            sortBy: initSortBy, // cai này đang gây ra lỗi
+            columnResizing: {
+                columnWidths: getColumnWidthsState(moduleConfig.key),
+            },
+        },
+        manualSortBy: true,
+        disableSortRemove: true,
+        autoResetSelectedRows: false,
+        autoResetExpanded: false,
+        manualRowSelectedKey: true,
+        isSelectedAll,
+        isTableSelectCurrentPage,
+        limit: data.length,
+        maxSelectedRows,
+        // defaultExpanded: { 1: true },
+    }, useFlexLayout, useResizeColumns, useSortBy, useSticky, useExpanded, hooks => {
+        hooks.visibleColumns.push(columnsHook => {
+            if (noCheckboxAction) {
+                return columnsHook;
+            }
+            return [
+                {
+                    id: 'selection',
+                    Header: ({ ...headerProps }) => (_jsx("div", { children: _jsx(HeaderCheckbox, { ...{
+                                ...headerProps,
+                                onSelectAllPage,
+                                global,
+                            } }) })),
+                    // return (
+                    // <div>
+                    //   <HeaderCheckbox
+                    //     {...{
+                    //       ...headerProps,
+                    //       onSelectAllPage,
+                    //       global,
+                    //     }}
+                    //     disabledHeaderCheckbox={disabledHeaderCheckbox}
+                    //   />
+                    // </div>
+                    // );
+                    // },
+                    width: sizeCheckbox,
+                    className: 'hiden-expanded-style',
+                    // eslint-disable-next-line no-shadow
+                    Cell: ({ row: { original }, selectedRows, isSelectedAll, maxSelectedRows }) => (_jsx("div", { children: _jsx(CellCheckbox, { selectedRows: selectedRows, isSelectedAll: isSelectedAll, setSelectedRow: setSelectedRow, original: original, maxSelectedRows: maxSelectedRows }) })),
+                },
+                ...columnsHook,
+            ];
+        });
+    });
+    return result;
+};

package/es/components/organism/DataTable/hooks/useDataTableListing/types.d.ts

@@ -3,7 +3,7 @@ import { AxiosRequestConfig } from 'axios';
 import { TOperatorKey, TServiceAuth } from '@antscorp/antsomi-ui/es/types';
 import { TEnv } from '@antscorp/antsomi-ui/es/types/config';
 import { TGridViewKeys, TSearchActionButton, TSearchItem, TableProps } from '../../types';
-import { PaginationProps } from '../../components';
+import { PaginationProps } from '../../components/Pagination';
 import { ColumnType } from 'antd/es/table';
 import { SorterResult } from 'antd/es/table/interface';
 import { TGetColumnMetrics, TGetFilterMetricList, TGetModifyColumnList, TGetSavedFilterList, TGetSearchListing, TGetTableListing } from '@antscorp/antsomi-ui/es/queries';

package/es/components/organism/DataTable/index.d.ts

@@ -1,5 +1,5 @@
 export { DataTable } from './DataTable';
 export type { DataTableProps, TableProps as DataTableTable, TSearchItem } from './types';
-export type { FilterMetricItem as FilterMetic } from '../Filter';
-export { useDataTableListing } from './hooks';
+export type { FilterMetricItem as FilterMetic } from '../Filter/types';
+export { useDataTableListing, useCDPTable } from './hooks';
 export { CDP_DATA_TABLE_SAMPLE, METRICS as FILTER_METRICS } from './constants';

package/es/components/organism/DataTable/index.js

@@ -1,5 +1,5 @@
 export { DataTable } from './DataTable';
 // Hooks
-export { useDataTableListing } from './hooks';
+export { useDataTableListing, useCDPTable } from './hooks';
 // Constants
 export { CDP_DATA_TABLE_SAMPLE, METRICS as FILTER_METRICS } from './constants';

package/es/components/organism/DataTable/providers/AntdTableConfigProvider.d.ts

@@ -1,8 +1,7 @@
 import React from 'react';
 import { ConfigProviderProps } from 'antd';
-import { DataTableThemeConfig } from '../types';
 interface AntdConfigProviderV2Props extends ConfigProviderProps {
 }
 export declare const AntdTableConfigProvider: React.FC<AntdConfigProviderV2Props>;
-export declare const dataTableGlobalToken: DataTableThemeConfig["token"];
+export declare const dataTableGlobalToken: (Partial<import("antd/es/theme/internal").AliasToken> & Partial<import("../types").TDataTableToken>) | undefined;
 export {};

package/es/components/organism/DataTable/styled/index.d.ts

@@ -1,9 +1,10 @@
+/// <reference types="react" />
 export declare const DataTableWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const IconButton: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ActionButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").ButtonProps & import("react").RefAttributes<import("react").LegacyRef<HTMLElement>>>, any, {
-    $hide?: boolean;
+    $hide?: boolean | undefined;
 }, never>;
-export declare const FilterMetricLabel: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const FilterMetricLabel: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
 export declare const DataTableContent: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const FilterButton: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const GroupByExpandButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const GroupByExpandButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;

package/es/components/organism/DataTable/types/index.d.ts

@@ -1,8 +1,9 @@
+/// <reference types="react" />
 import { TableProps as AntdTableProps } from 'antd';
 import { StoreApi } from 'zustand';
 import { ToolbarProps } from './toolbar';
-import { PaginationProps } from '../components';
-import { FilterProps } from '../../Filter';
+import { PaginationProps } from '../components/Pagination';
+import { FilterProps } from '../../Filter/types';
 export interface TableProps<T> extends AntdTableProps<T> {
     columnWidths?: Record<number, number>;
     onColumnResize?: (data: {

package/es/components/organism/DataTable/types/toolbar.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { DropdownProps } from 'antd';
 import { ItemType } from 'antd/es/menu/hooks/useItems';
-import { GRID_VIEW_KEYS, TOOLBAR_ACTION_KEYS } from '../constants';
+import { GRID_VIEW_KEYS, TOOLBAR_ACTION_KEYS } from '../constants/toolbar';
 import { AddButtonProps } from '../components/AddButton';
 import { TActionButton, TConfirmResponse } from '@antscorp/antsomi-ui/es/types';
 import { TOperatorKey } from '@antscorp/antsomi-ui/es/types/condition';

package/es/components/organism/DataTable/utils/filter.d.ts

@@ -1,5 +1,5 @@
 import { MenuProps } from 'antd';
-import { FilterItem, FilterMetricItem, FilterProps, TApiFilter } from '../../Filter';
+import { FilterItem, FilterMetricItem, FilterProps, TApiFilter } from '../../Filter/types';
 import { SavedFilter } from '@antscorp/antsomi-ui/es/models/DataTable/SavedFilter';
 import { TFormatFilterValue } from '../hooks/useDataTableListing/types';
 type MenuItem = Required<MenuProps>['items'][number];
@@ -89,7 +89,7 @@ export declare const renderValueField: ({ filterMetric, operator, value, matches
  * @returns {Metric|undefined} The metric with the specified name, or undefined if not found.
  */
 export declare const getFilterMetricByName: ({ filterMetrics, name, }: TGetFilterMetricByName) => FilterMetricItem | undefined;
-export declare const mapFiltersToRules: (filters: FilterItem[]) => SavedFilter["rules"];
-export declare const mapRulesToFilters: (rules: SavedFilter["rules"]) => FilterItem[];
+export declare const mapFiltersToRules: (filters: FilterItem[]) => SavedFilter['rules'];
+export declare const mapRulesToFilters: (rules: SavedFilter['rules']) => FilterItem[];
 export declare const mapFiltersToApiFilters: (filters: FilterItem[], includeDataType?: boolean, formatFilterValue?: TFormatFilterValue) => TApiFilter;
 export {};

package/es/components/organism/Filter/components/FilterActionButton.js

@@ -10,7 +10,7 @@ import { renderActionButtons } from '@antscorp/antsomi-ui/es/utils';
 import { EXCEPTION_OFF_FILTER_CLASS, FILTER_ACTION_OPTIONS } from '../constants';
 import { ActionButton } from '@antscorp/antsomi-ui/es/styled';
 // Context
-import { useFilterContext } from '../hooks';
+import { useFilterContext } from '../hooks/useFilterContext';
 import { SaveFilterPopover } from './SaveFilterPopover';
 // Constants
 import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';

package/es/components/organism/Filter/components/FilterCondition/styled.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 export declare const FilterConditionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const CloseButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const CloseButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;

package/es/components/organism/Filter/contexts/FilterContext.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { StoreApi } from 'zustand';
 import { FilterStore } from '../types';
 export declare const FilterContext: import("react").Context<StoreApi<FilterStore> | null>;

package/es/components/organism/Filter/hooks/useAddFilterCondition.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { FilterMetricItem } from '../types';
 type TState = {
     openPopover?: boolean;
@@ -10,18 +11,18 @@ type OnApplyFilterMetricConditionValue = {
     existMetricIdx?: number;
 };
 export declare const useAddFilterCondition: () => {
-    filters: import("..").FilterItem[] | undefined;
+    filters: import("../types").FilterItem[] | undefined;
     matchesAny: {
-        list?: import("../../..").MatchesAnyItem[];
-        isLoading?: boolean;
+        list?: any[] | undefined;
+        isLoading?: boolean | undefined;
     } | undefined;
     setState: import("react").Dispatch<import("react").SetStateAction<TState>>;
     onSelectFilterMetric: (filterMetric?: FilterMetricItem) => void;
     onApplyFilterMetricCondition: (values: OnApplyFilterMetricConditionValue) => void;
     onClickAddFilter: () => void;
-    onChangeFilterCondition: (filterItem: import("..").FilterItem) => void;
-    onMatchesAnyLoadMore: (metricId?: FilterMetricItem["id"]) => void;
-    openPopover?: boolean;
-    selectedFilterMetric?: FilterMetricItem;
+    onChangeFilterCondition: (filterItem: import("../types").FilterItem) => void;
+    onMatchesAnyLoadMore: (metricId?: string | number | undefined) => void;
+    openPopover?: boolean | undefined;
+    selectedFilterMetric?: FilterMetricItem | undefined;
 };
 export {};

package/es/components/organism/Filter/styled.d.ts

@@ -1,9 +1,10 @@
-export declare const FilterWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {
+/// <reference types="react" />
+export declare const FilterWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {
     $isFilterActive: boolean;
 }, never>;
 export declare const FilterSelectFieldsContent: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const FilterConditionListWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
-export declare const StyledFilterItem: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const FilterConditionListWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const StyledFilterItem: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
 export declare const FilterButton: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const FilterMetricLabel: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const FilterMetricLabel: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
 export declare const IconButton: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/components/organism/Filter/types/index.d.ts

@@ -1,4 +1,5 @@
-import { MatchesAnyItem } from '../../../molecules';
+/// <reference types="react" />
+import { MatchesAnyItem } from '../../../molecules/MatchAnySelect/types';
 import { FILTER_ACTION_KEYS } from '../constants';
 import { TActionButton, TConfirmResponse, TOperatorKey } from '@antscorp/antsomi-ui/es/types';
 export type TFormatFilterValue = Partial<Record<TOperatorKey, (value: any) => unknown>>;

package/es/components/organism/Filter/utils/index.d.ts

@@ -1,7 +1,6 @@
 import { MenuProps } from 'antd';
-import { FilterItem, FilterMetricItem, TApiFilter, TFormatFilterValue } from '../types';
+import { FilterProps, FilterItem, FilterMetricItem, TApiFilter, TFormatFilterValue } from '../types';
 import { SavedFilter } from '@antscorp/antsomi-ui/es/models/DataTable/SavedFilter';
-import { FilterProps } from '../..';
 type MenuItem = Required<MenuProps>['items'][number];
 type TSerializeFilterMetricsToMenuItems = {
     filterMetrics: FilterMetricItem[];
@@ -89,7 +88,7 @@ export declare const renderValueField: ({ filterMetric, operator, value, matches
  * @returns {Metric|undefined} The metric with the specified name, or undefined if not found.
  */
 export declare const getFilterMetricByName: ({ filterMetrics, name, }: TGetFilterMetricByName) => FilterMetricItem | undefined;
-export declare const mapFiltersToRules: (filters: FilterItem[]) => SavedFilter["rules"];
-export declare const mapRulesToFilters: (rules: SavedFilter["rules"]) => FilterItem[];
+export declare const mapFiltersToRules: (filters: FilterItem[]) => SavedFilter['rules'];
+export declare const mapRulesToFilters: (rules: SavedFilter['rules']) => FilterItem[];
 export declare const mapFiltersToApiFilters: (filters: FilterItem[], includeDataType?: boolean, formatFilterValue?: TFormatFilterValue) => TApiFilter;
 export {};

package/es/components/organism/Filter/utils/index.js

@@ -5,7 +5,7 @@ import dayjs from 'dayjs';
 // Components
 import { Popover, Typography, Icon, FormatInputNumber, Flex, Input } from '../../../atoms';
 import { DATE_TIME_FORMAT, DATE_TIME_FORMAT_DISPLAY, METRIC_TYPE, } from '@antscorp/antsomi-ui/es/constants';
-import { Menu } from '../..';
+import { Menu } from '../../Menu';
 import { DatePicker, MatchesAnySelect } from '../../../molecules';
 // Styled
 import { FilterMetricLabel } from '../styled';

package/es/components/organism/FilterSetting/components/common/InputOrSelect/index.d.ts

@@ -44,9 +44,9 @@ interface ModalSelectProps {
     onError?: (errorMsg: string) => void;
 }
 export declare const ModalSelect: React.FC<ModalSelectProps>;
-export declare const StyledAutoComplete: import("styled-components").StyledComponent<(<ValueType = any, OptionType extends import("rc-select/lib/Select").BaseOptionType | import("rc-select/lib/Select").DefaultOptionType = import("rc-select/lib/Select").DefaultOptionType>(props: import("antd").AutoCompleteProps<ValueType, OptionType> & {
+export declare const StyledAutoComplete: import("styled-components").StyledComponent<(<ValueType = any, OptionType extends import("rc-select/lib/Select").DefaultOptionType | import("rc-select/lib/Select").BaseOptionType = import("rc-select/lib/Select").DefaultOptionType>(props: import("antd").AutoCompleteProps<ValueType, OptionType> & {
     children?: React.ReactNode;
-} & React.RefAttributes<import("rc-select").BaseSelectRef>) => React.ReactElement) & {
+} & React.RefAttributes<import("antd").RefSelectProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
     displayName?: string | undefined;
     Option: import("rc-select/lib/Option").OptionFC;
     _InternalPanelDoNotUseOrYouWillBeFired: (props: import("antd/es/_util/type").AnyObject) => React.JSX.Element;
@@ -57,15 +57,15 @@ export declare const StyledDropdown: import("styled-components").StyledComponent
 export declare const StyledSelect: import("styled-components").StyledComponent<(props: any) => import("react/jsx-runtime").JSX.Element, any, {
     $isPlaceholder?: any;
 }, never>;
-export declare const StyledTreeSelect: import("styled-components").StyledComponent<(<ValueType = any, OptionType extends import("rc-tree-select/lib/TreeSelect").BaseOptionType | import("rc-tree-select/lib/TreeSelect").DefaultOptionType = import("rc-tree-select/lib/TreeSelect").DefaultOptionType>(props: import("antd").TreeSelectProps<ValueType, OptionType> & {
+export declare const StyledTreeSelect: import("styled-components").StyledComponent<(<ValueType = any, OptionType extends import("rc-tree-select/lib/TreeSelect").DefaultOptionType | import("rc-tree-select/lib/TreeSelect").BaseOptionType = import("rc-tree-select/lib/TreeSelect").DefaultOptionType>(props: import("antd").TreeSelectProps<ValueType, OptionType> & {
     children?: React.ReactNode;
-} & React.RefAttributes<import("rc-select").BaseSelectRef>) => React.ReactElement) & {
-    displayName?: string;
+} & React.RefAttributes<import("antd").RefSelectProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
+    displayName?: string | undefined;
     TreeNode: React.FC<import("rc-tree-select/lib/TreeNode").TreeNodeProps>;
-    SHOW_ALL: typeof import("rc-tree-select").SHOW_ALL;
-    SHOW_PARENT: typeof import("rc-tree-select").SHOW_PARENT;
-    SHOW_CHILD: typeof import("rc-tree-select").SHOW_CHILD;
+    SHOW_ALL: "SHOW_ALL";
+    SHOW_PARENT: "SHOW_PARENT";
+    SHOW_CHILD: "SHOW_CHILD";
     _InternalPanelDoNotUseOrYouWillBeFired: (props: import("antd/es/_util/type").AnyObject) => React.JSX.Element;
 }, any, {}, never>;
-export declare const StyledSearch: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("antd/lib/input").SearchProps & React.RefAttributes<import("rc-input").InputRef>>, any, {}, never>;
+export declare const StyledSearch: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("antd/lib/input/Search").SearchProps & React.RefAttributes<import("antd").InputRef>>, any, {}, never>;
 export {};

package/es/components/organism/FilterSetting/components/common/InputSelectMulti/ColumnSuggestion/index.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { DataSelect } from '..';
+import { DataSelect } from '../types';
 interface ColumnContent {
     data: DataSelect;
     extendValue?: any;