@economic/taco 1.19.1 → 1.21.0

package/dist/esm/packages/taco/src/components/Table2/hooks/useTable.js

@@ -0,0 +1,202 @@
+import React__default from 'react';
+import { getSortedRowModel, getFilteredRowModel, useReactTable, getCoreRowModel } from '@tanstack/react-table';
+import { columnFilterFn, globalFilterFn } from '../utilities/filterFn.js';
+import { useEditMode } from './useEditMode.js';
+import { useColumnDefinitions } from './useColumnDefinitions.js';
+import { getOffsetsFromSize, useColumnOffsetStateListener } from './listeners/useColumnOffsetStateListener.js';
+import { useRowSelectionListener } from './listeners/useRowSelectionListener.js';
+import { useSettingsStateListener } from './listeners/useSettingsStateListener.js';
+import { useActiveRow } from './useActiveRow.js';
+import { useActiveRowStateListener } from './listeners/useActiveRowStateListener.js';
+
+function useTable(children, props, ref) {
+  var _settings$columnOrder, _ref, _settings$columnPinni, _settings$columnPinni2, _settings$columnSizin, _settings$columnVisib, _settings$rowDensity;
+  const {
+    actionsForRow = [],
+    data,
+    defaultActiveRowIndex,
+    disableColumnFiltering = false,
+    disableColumnHiding = false,
+    disableColumnPinning = false,
+    disableColumnReordering = false,
+    disableColumnResizing = false,
+    disableRowDensity = false,
+    disableRowExpansion = false,
+    disableRowSelection = false,
+    disableMultipleRowSelection = false,
+    disableSearch = false,
+    disableSorting = false,
+    expandedRowRenderer,
+    manualColumnFiltering = false,
+    manualSearch = false,
+    manualSorting = false,
+    onChangeSettings,
+    onRowClick,
+    onRowDrag,
+    onRowSelect,
+    onSave,
+    settings = {},
+    // experimental
+    _experimentalActionsForTable
+  } = props;
+  const enableRowExpansion = !disableRowExpansion && !!expandedRowRenderer;
+  const enableRowSelection = !disableRowSelection && (!!onRowSelect || !!(_experimentalActionsForTable !== null && _experimentalActionsForTable !== void 0 && _experimentalActionsForTable.length));
+  const enableMultipleRowSelection = !disableMultipleRowSelection && enableRowSelection;
+  const {
+    columns,
+    defaultColumnPinning,
+    defaultColumnSizing,
+    defaultSorting,
+    defaultColumnVisibility,
+    footers
+  } = useColumnDefinitions(children, {
+    actionsForRow,
+    enableColumnFiltering: !disableColumnFiltering,
+    enableColumnHiding: !disableColumnHiding,
+    enableColumnPinning: !disableColumnPinning,
+    enableRowExpansion,
+    enableRowSelection,
+    enableMultipleRowSelection,
+    onRowDrag
+  }, ref);
+  const lastSortedOrFilteredRows = React__default.useRef(null);
+  // defaults
+  const initialState = {
+    columnOrder: (_settings$columnOrder = settings === null || settings === void 0 ? void 0 : settings.columnOrder) !== null && _settings$columnOrder !== void 0 ? _settings$columnOrder : columns.map(column => column.id),
+    columnPinning: {
+      left: (_ref = (_settings$columnPinni = settings === null || settings === void 0 ? void 0 : (_settings$columnPinni2 = settings.columnPinning) === null || _settings$columnPinni2 === void 0 ? void 0 : _settings$columnPinni2.left) !== null && _settings$columnPinni !== void 0 ? _settings$columnPinni : defaultColumnPinning) !== null && _ref !== void 0 ? _ref : [],
+      right: []
+    },
+    columnSizing: (_settings$columnSizin = settings === null || settings === void 0 ? void 0 : settings.columnSizing) !== null && _settings$columnSizin !== void 0 ? _settings$columnSizin : defaultColumnSizing,
+    columnVisibility: (_settings$columnVisib = settings === null || settings === void 0 ? void 0 : settings.columnVisibility) !== null && _settings$columnVisib !== void 0 ? _settings$columnVisib : defaultColumnVisibility
+  };
+  // Data column index - these are needed to make sure left and right arrow key shortcuts focuses only the data columns
+  const dataColumnStartOffset = [!!onRowDrag, !!enableRowExpansion, !!enableRowSelection].reduce((t, e) => t + (e ? 1 : 0), 0);
+  const dataColumnEndOffset = actionsForRow.length ? 1 : 0;
+  // custom
+  const activeRow = useActiveRow(defaultActiveRowIndex);
+  const [hoveredRowIndex, setHoveredRowIndex] = React__default.useState(undefined);
+  const editMode = useEditMode(onSave);
+  const [columnOffsets, setColumnOffsets] = React__default.useState(getOffsetsFromSize(initialState.columnPinning, initialState.columnVisibility, initialState.columnSizing));
+  const [rowDensity, setRowDensity] = React__default.useState((_settings$rowDensity = settings === null || settings === void 0 ? void 0 : settings.rowDensity) !== null && _settings$rowDensity !== void 0 ? _settings$rowDensity : 'normal');
+  const [dragging, setDragging] = React__default.useState({});
+  const [shouldPauseSortingAndFiltering, setShouldPauseSortingAndFiltering] = React__default.useState(false);
+  const [shouldDisableTableActions, setShouldDisableTableActions] = React__default.useState(false);
+  // For some reason, using state instead of ref didn't work as expected, that's why ref is used
+  const focussableColumnIndexes = React__default.useRef([]);
+  // some options get set even if they are undefined, so we have to do it conditionally
+  const options = {
+    enableExpanding: enableRowExpansion,
+    enableColumnFilters: !disableColumnFiltering,
+    enableColumnResizing: !disableColumnResizing,
+    enableGlobalFilter: !disableSearch,
+    enableHiding: !disableColumnHiding,
+    enablePinning: !disableColumnPinning,
+    enableRowSelection: enableRowSelection,
+    enableMultiRowSelection: enableMultipleRowSelection,
+    enableSorting: !disableSorting
+  };
+  // resizing
+  if (options.enableColumnResizing) {
+    options.columnResizeMode = 'onChange';
+  }
+  // sorting
+  if (options.enableSorting) {
+    var _settings$sorting;
+    initialState.sorting = (_settings$sorting = settings === null || settings === void 0 ? void 0 : settings.sorting) !== null && _settings$sorting !== void 0 ? _settings$sorting : defaultSorting;
+    if (manualSorting) {
+      options.manualSorting = true;
+    } else {
+      options.getSortedRowModel = getSortedRowModel();
+    }
+  }
+  // filtering
+  if (options.enableColumnFilters) {
+    var _settings$columnFilte;
+    initialState.columnFilters = (_settings$columnFilte = settings === null || settings === void 0 ? void 0 : settings.columnFilters) !== null && _settings$columnFilte !== void 0 ? _settings$columnFilte : [];
+    if (manualColumnFiltering) {
+      options.manualFiltering = true;
+    } else {
+      options.filterFns = {
+        tacoFilter: (row, columnId, filter) => columnFilterFn(row.getValue(columnId), filter)
+      };
+      options.getFilteredRowModel = getFilteredRowModel();
+    }
+  }
+  // search
+  if (options.enableGlobalFilter) {
+    if (manualSearch) {
+      options.manualFiltering = true;
+    } else {
+      options.globalFilterFn = (row, columnId, query) => globalFilterFn(row.getValue(columnId), query);
+      options.getFilteredRowModel = getFilteredRowModel();
+    }
+  }
+  const table = useReactTable({
+    data,
+    columns: columns,
+    getCoreRowModel: getCoreRowModel(),
+    initialState,
+    ...options,
+    meta: {
+      ...activeRow,
+      editMode,
+      // offsets
+      columnOffsets,
+      // density
+      enableRowDensity: !disableRowDensity,
+      rowDensity,
+      setRowDensity,
+      // dragging
+      dragging,
+      setDragging,
+      // computed
+      enableColumnReordering: !disableColumnReordering,
+      // resorting
+      shouldPauseSortingAndFiltering,
+      setShouldPauseSortingAndFiltering,
+      // other
+      onRowClick,
+      hoveredRowIndex,
+      setHoveredRowIndex,
+      // data column positions
+      dataColumnStartOffset,
+      dataColumnEndOffset,
+      // disable table actions
+      shouldDisableTableActions,
+      setShouldDisableTableActions,
+      // active row column indexes
+      focussableColumnIndexes: focussableColumnIndexes.current,
+      addFocussableColumnIndex: index => {
+        if (!focussableColumnIndexes.current.includes(index)) {
+          focussableColumnIndexes.current = [...focussableColumnIndexes.current, index].sort((a, b) => a - b);
+        }
+      },
+      resetFocussableColumnIndexes: () => {
+        focussableColumnIndexes.current = [];
+      },
+      // table ref
+      tableRef: ref,
+      // last sorted or filtered rows
+      lastSortedOrFilteredRows
+    }
+  });
+  const tableRows = table.getRowModel().rows;
+  if (!shouldPauseSortingAndFiltering) {
+    lastSortedOrFilteredRows.current = tableRows;
+  }
+  const rows = shouldPauseSortingAndFiltering ? lastSortedOrFilteredRows.current : tableRows;
+  // state listeners
+  useActiveRowStateListener(table, rows, activeRow);
+  useColumnOffsetStateListener(table, setColumnOffsets);
+  useRowSelectionListener(table, onRowSelect);
+  useSettingsStateListener(table, onChangeSettings);
+  return {
+    rows,
+    table,
+    footers
+  };
+}
+
+export { useTable };
+//# sourceMappingURL=useTable.js.map

package/dist/esm/packages/taco/src/components/Table2/hooks/useTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTable.js","sources":["../../../../../../../../src/components/Table2/hooks/useTable.ts"],"sourcesContent":["import React from 'react';\nimport {\n    useReactTable,\n    getCoreRowModel,\n    OnChangeFn,\n    getSortedRowModel,\n    getFilteredRowModel,\n    RowData,\n    TableState,\n    ColumnPinningState,\n    VisibilityState,\n    ColumnSizingState,\n    TableOptions,\n} from '@tanstack/react-table';\nimport { RowClickHandler, RowDensity, Table2ColumnProps, Table2Props } from '../types';\nimport { useColumnDefinitions } from './useColumnDefinitions';\nimport { getOffsetsFromSize, useColumnOffsetStateListener } from './listeners/useColumnOffsetStateListener';\nimport { ColumnOffsetState } from '../types';\nimport { useRowSelectionListener } from './listeners/useRowSelectionListener';\nimport { useSettingsStateListener } from './listeners/useSettingsStateListener';\nimport { columnFilterFn, globalFilterFn } from '../utilities/filterFn';\nimport { ActiveRowHandler, ActiveRowMoveHandler, useActiveRow } from './useActiveRow';\nimport { useActiveRowStateListener } from './listeners/useActiveRowStateListener';\nimport { useEditMode } from './useEditMode';\n\ndeclare module '@tanstack/table-core' {\n    interface TableMeta<TData extends RowData> {\n        // active row\n        activeRowIndex: number;\n        setActiveRowIndex: ActiveRowHandler;\n        moveToPreviousRow: ActiveRowMoveHandler<TData>;\n        moveToNextRow: ActiveRowMoveHandler<TData>;\n        // offsets\n        columnOffsets: ColumnOffsetState;\n        // density\n        enableRowDensity: boolean;\n        rowDensity: RowDensity;\n        setRowDensity: OnChangeFn<RowDensity>;\n        // dragging\n        dragging: Record<string, boolean>;\n        setDragging: OnChangeFn<Record<string, boolean>>;\n        // computed\n        enableColumnReordering: boolean;\n        shouldPauseSortingAndFiltering: boolean;\n        setShouldPauseSortingAndFiltering: OnChangeFn<boolean>;\n        // other\n        onRowClick?: RowClickHandler<TData>;\n        hoveredRowIndex: number | undefined;\n        setHoveredRowIndex: OnChangeFn<number | undefined>;\n        // editing\n        editMode: useEditMode;\n        // used to determine first and last data column position\n        dataColumnStartOffset: number;\n        dataColumnEndOffset: number;\n        // disable table actions\n        shouldDisableTableActions: boolean;\n        setShouldDisableTableActions: OnChangeFn<boolean>;\n        // active row column indexes\n        focussableColumnIndexes: number[];\n        addFocussableColumnIndex: (index: number) => void;\n        resetFocussableColumnIndexes: () => void;\n        // table ref\n        tableRef: React.RefObject<HTMLDivElement>;\n        // last sorted or filtered rows\n        lastSortedOrFilteredRows: React.MutableRefObject<Array<any>>;\n    }\n}\n\nexport function useTable<TType = any>(\n    children: React.ReactElement<Table2ColumnProps<TType>>[],\n    props: Table2Props<TType>,\n    ref: React.RefObject<HTMLDivElement>\n) {\n    const {\n        actionsForRow = [],\n        data,\n        defaultActiveRowIndex,\n        disableColumnFiltering = false,\n        disableColumnHiding = false,\n        disableColumnPinning = false,\n        disableColumnReordering = false,\n        disableColumnResizing = false,\n        disableRowDensity = false,\n        disableRowExpansion = false,\n        disableRowSelection = false,\n        disableMultipleRowSelection = false,\n        disableSearch = false,\n        disableSorting = false,\n        expandedRowRenderer,\n        manualColumnFiltering = false,\n        manualSearch = false,\n        manualSorting = false,\n        onChangeSettings,\n        onRowClick,\n        onRowDrag,\n        onRowSelect,\n        onSave,\n        settings = {},\n        // experimental\n        _experimentalActionsForTable,\n    } = props;\n    const enableRowExpansion = !disableRowExpansion && !!expandedRowRenderer;\n    const enableRowSelection = !disableRowSelection && (!!onRowSelect || !!_experimentalActionsForTable?.length);\n    const enableMultipleRowSelection = !disableMultipleRowSelection && enableRowSelection;\n\n    const { columns, defaultColumnPinning, defaultColumnSizing, defaultSorting, defaultColumnVisibility, footers } =\n        useColumnDefinitions<TType>(\n            children,\n            {\n                actionsForRow,\n                enableColumnFiltering: !disableColumnFiltering,\n                enableColumnHiding: !disableColumnHiding,\n                enableColumnPinning: !disableColumnPinning,\n                enableRowExpansion,\n                enableRowSelection,\n                enableMultipleRowSelection,\n                onRowDrag,\n            },\n            ref\n        );\n\n    const lastSortedOrFilteredRows = React.useRef<any>(null);\n\n    // defaults\n    const initialState: Partial<TableState> = {\n        columnOrder: settings?.columnOrder ?? columns.map(column => column.id as string),\n        columnPinning: {\n            left: settings?.columnPinning?.left ?? defaultColumnPinning ?? [],\n            right: [],\n        },\n        columnSizing: settings?.columnSizing ?? defaultColumnSizing,\n        columnVisibility: settings?.columnVisibility ?? defaultColumnVisibility,\n    };\n\n    // Data column index - these are needed to make sure left and right arrow key shortcuts focuses only the data columns\n    const dataColumnStartOffset = [!!onRowDrag, !!enableRowExpansion, !!enableRowSelection].reduce((t, e) => t + (e ? 1 : 0), 0);\n    const dataColumnEndOffset = actionsForRow.length ? 1 : 0;\n\n    // custom\n    const activeRow = useActiveRow<TType>(defaultActiveRowIndex);\n    const [hoveredRowIndex, setHoveredRowIndex] = React.useState<number | undefined>(undefined);\n    const editMode = useEditMode(onSave);\n    const [columnOffsets, setColumnOffsets] = React.useState(\n        getOffsetsFromSize(\n            initialState.columnPinning as ColumnPinningState,\n            initialState.columnVisibility as VisibilityState,\n            initialState.columnSizing as ColumnSizingState\n        )\n    );\n    const [rowDensity, setRowDensity] = React.useState<RowDensity>(settings?.rowDensity ?? 'normal');\n    const [dragging, setDragging] = React.useState<Record<string, boolean>>({});\n    const [shouldPauseSortingAndFiltering, setShouldPauseSortingAndFiltering] = React.useState<boolean>(false);\n    const [shouldDisableTableActions, setShouldDisableTableActions] = React.useState<boolean>(false);\n    // For some reason, using state instead of ref didn't work as expected, that's why ref is used\n    const focussableColumnIndexes = React.useRef<number[]>([]);\n\n    // some options get set even if they are undefined, so we have to do it conditionally\n    const options: Partial<TableOptions<any>> = {\n        enableExpanding: enableRowExpansion,\n        enableColumnFilters: !disableColumnFiltering,\n        enableColumnResizing: !disableColumnResizing,\n        enableGlobalFilter: !disableSearch,\n        enableHiding: !disableColumnHiding,\n        enablePinning: !disableColumnPinning,\n        enableRowSelection: enableRowSelection,\n        enableMultiRowSelection: enableMultipleRowSelection,\n        enableSorting: !disableSorting,\n    };\n\n    // resizing\n    if (options.enableColumnResizing) {\n        options.columnResizeMode = 'onChange';\n    }\n\n    // sorting\n    if (options.enableSorting) {\n        initialState.sorting = settings?.sorting ?? defaultSorting;\n\n        if (manualSorting) {\n            options.manualSorting = true;\n        } else {\n            options.getSortedRowModel = getSortedRowModel();\n        }\n    }\n\n    // filtering\n    if (options.enableColumnFilters) {\n        initialState.columnFilters = settings?.columnFilters ?? [];\n\n        if (manualColumnFiltering) {\n            options.manualFiltering = true;\n        } else {\n            options.filterFns = {\n                tacoFilter: (row, columnId, filter) => columnFilterFn(row.getValue(columnId), filter),\n            };\n            options.getFilteredRowModel = getFilteredRowModel();\n        }\n    }\n\n    // search\n    if (options.enableGlobalFilter) {\n        if (manualSearch) {\n            options.manualFiltering = true;\n        } else {\n            options.globalFilterFn = (row, columnId, query) => globalFilterFn(row.getValue(columnId), query);\n            options.getFilteredRowModel = getFilteredRowModel();\n        }\n    }\n\n    const table = useReactTable({\n        data,\n        columns: columns as any,\n        getCoreRowModel: getCoreRowModel(),\n        initialState,\n        ...options,\n        meta: {\n            ...activeRow,\n            editMode,\n            // offsets\n            columnOffsets,\n            // density\n            enableRowDensity: !disableRowDensity,\n            rowDensity,\n            setRowDensity,\n            // dragging\n            dragging,\n            setDragging,\n            // computed\n            enableColumnReordering: !disableColumnReordering,\n            // resorting\n            shouldPauseSortingAndFiltering,\n            setShouldPauseSortingAndFiltering,\n            // other\n            onRowClick,\n            hoveredRowIndex,\n            setHoveredRowIndex,\n            // data column positions\n            dataColumnStartOffset,\n            dataColumnEndOffset,\n            // disable table actions\n            shouldDisableTableActions,\n            setShouldDisableTableActions,\n            // active row column indexes\n            focussableColumnIndexes: focussableColumnIndexes.current,\n            addFocussableColumnIndex: (index: number) => {\n                if (!focussableColumnIndexes.current.includes(index)) {\n                    focussableColumnIndexes.current = [...focussableColumnIndexes.current, index].sort((a, b) => a - b);\n                }\n            },\n            resetFocussableColumnIndexes: () => {\n                focussableColumnIndexes.current = [];\n            },\n            // table ref\n            tableRef: ref,\n            // last sorted or filtered rows\n            lastSortedOrFilteredRows,\n        },\n    });\n\n    const tableRows = table.getRowModel().rows;\n\n    if (!shouldPauseSortingAndFiltering) {\n        lastSortedOrFilteredRows.current = tableRows;\n    }\n\n    const rows = shouldPauseSortingAndFiltering ? lastSortedOrFilteredRows.current : tableRows;\n\n    // state listeners\n    useActiveRowStateListener<TType>(table, rows, activeRow);\n    useColumnOffsetStateListener(table, setColumnOffsets);\n    useRowSelectionListener<TType>(table, onRowSelect);\n    useSettingsStateListener(table, onChangeSettings);\n\n    return { rows, table, footers };\n}\n"],"names":["useTable","children","props","ref","actionsForRow","data","defaultActiveRowIndex","disableColumnFiltering","disableColumnHiding","disableColumnPinning","disableColumnReordering","disableColumnResizing","disableRowDensity","disableRowExpansion","disableRowSelection","disableMultipleRowSelection","disableSearch","disableSorting","expandedRowRenderer","manualColumnFiltering","manualSearch","manualSorting","onChangeSettings","onRowClick","onRowDrag","onRowSelect","onSave","settings","_experimentalActionsForTable","enableRowExpansion","enableRowSelection","length","enableMultipleRowSelection","columns","defaultColumnPinning","defaultColumnSizing","defaultSorting","defaultColumnVisibility","footers","useColumnDefinitions","enableColumnFiltering","enableColumnHiding","enableColumnPinning","lastSortedOrFilteredRows","React","useRef","initialState","columnOrder","map","column","id","columnPinning","left","right","columnSizing","columnVisibility","dataColumnStartOffset","reduce","t","e","dataColumnEndOffset","activeRow","useActiveRow","hoveredRowIndex","setHoveredRowIndex","useState","undefined","editMode","useEditMode","columnOffsets","setColumnOffsets","getOffsetsFromSize","rowDensity","setRowDensity","dragging","setDragging","shouldPauseSortingAndFiltering","setShouldPauseSortingAndFiltering","shouldDisableTableActions","setShouldDisableTableActions","focussableColumnIndexes","options","enableExpanding","enableColumnFilters","enableColumnResizing","enableGlobalFilter","enableHiding","enablePinning","enableMultiRowSelection","enableSorting","columnResizeMode","sorting","getSortedRowModel","columnFilters","manualFiltering","filterFns","tacoFilter","row","columnId","filter","columnFilterFn","getValue","getFilteredRowModel","globalFilterFn","query","table","useReactTable","getCoreRowModel","meta","enableRowDensity","enableColumnReordering","current","addFocussableColumnIndex","index","includes","sort","a","b","resetFocussableColumnIndexes","tableRef","tableRows","getRowModel","rows","useActiveRowStateListener","useColumnOffsetStateListener","useRowSelectionListener","useSettingsStateListener"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table2/hooks/useVirtualiser.js

@@ -0,0 +1,49 @@
+import React__default from 'react';
+import { useVirtual } from 'react-virtual';
+
+const densitySizeEstimates = {
+  compact: 33,
+  normal: 41,
+  comfortable: 49,
+  spacious: 57
+};
+const useVirtualiser = ({
+  rows,
+  table
+}, tableRef) => {
+  var _virtualiser$virtualI, _virtualiser$virtualI2, _virtualiser$virtualI3, _virtualiser$virtualI4;
+  const [expandedRowSizes, setExpandedRowSizes] = React__default.useState({});
+  const firstAvailableExpandedRowHeight = React__default.useMemo(() => {
+    const values = Object.values(expandedRowSizes);
+    return values.length ? values.reduce((a, b) => a + b, 0) / values.length : 0;
+  }, [expandedRowSizes]);
+  const meta = table.options.meta;
+  const estimateSize = React__default.useCallback(index => {
+    var _table$getState$expan;
+    const rowHeight = meta.rowDensity ? densitySizeEstimates[meta.rowDensity] : densitySizeEstimates.normal;
+    if (table.getState().expanded === true || (_table$getState$expan = table.getState().expanded) !== null && _table$getState$expan !== void 0 && _table$getState$expan[index]) {
+      var _ref, _expandedRowSizes$ind;
+      return rowHeight + ((_ref = (_expandedRowSizes$ind = expandedRowSizes[index]) !== null && _expandedRowSizes$ind !== void 0 ? _expandedRowSizes$ind : firstAvailableExpandedRowHeight) !== null && _ref !== void 0 ? _ref : 0);
+    }
+    return rowHeight;
+  }, [meta.rowDensity, expandedRowSizes, table.getState().expanded]);
+  const virtualiser = useVirtual({
+    parentRef: tableRef,
+    size: rows.length,
+    estimateSize,
+    overscan: 10
+  });
+  const paddingTop = virtualiser.virtualItems.length > 0 ? ((_virtualiser$virtualI = virtualiser.virtualItems) === null || _virtualiser$virtualI === void 0 ? void 0 : (_virtualiser$virtualI2 = _virtualiser$virtualI[0]) === null || _virtualiser$virtualI2 === void 0 ? void 0 : _virtualiser$virtualI2.start) || 0 : 0;
+  const paddingBottom = virtualiser.virtualItems.length > 0 ? virtualiser.totalSize - (((_virtualiser$virtualI3 = virtualiser.virtualItems) === null || _virtualiser$virtualI3 === void 0 ? void 0 : (_virtualiser$virtualI4 = _virtualiser$virtualI3[virtualiser.virtualItems.length - 1]) === null || _virtualiser$virtualI4 === void 0 ? void 0 : _virtualiser$virtualI4.end) || 0) : 0;
+  return {
+    virtualiser,
+    virtualiserOffsets: {
+      top: paddingTop,
+      bottom: paddingBottom
+    },
+    setExpandedRowSizes
+  };
+};
+
+export { useVirtualiser };
+//# sourceMappingURL=useVirtualiser.js.map

package/dist/esm/packages/taco/src/components/Table2/hooks/useVirtualiser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useVirtualiser.js","sources":["../../../../../../../../src/components/Table2/hooks/useVirtualiser.ts"],"sourcesContent":["import React from 'react';\nimport { OnChangeFn, TableMeta } from '@tanstack/react-table';\nimport { useVirtual, VirtualItem } from 'react-virtual';\n\ntype ExpandedRowSizeState = Record<string, number>;\ntype useVirtualiser = {\n    virtualiser: {\n        virtualItems: VirtualItem[];\n        totalSize: number;\n        scrollToOffset: (index: number, options?: any) => void;\n        scrollToIndex: (index: number, options?: any) => void;\n        measure: () => void;\n    };\n    virtualiserOffsets: {\n        top: number;\n        bottom: number;\n    };\n    setExpandedRowSizes: OnChangeFn<ExpandedRowSizeState>;\n};\n\nconst densitySizeEstimates = {\n    compact: 33,\n    normal: 41,\n    comfortable: 49,\n    spacious: 57,\n};\n\nexport const useVirtualiser = ({ rows, table }, tableRef: React.RefObject<HTMLElement>): useVirtualiser => {\n    const [expandedRowSizes, setExpandedRowSizes] = React.useState({});\n    const firstAvailableExpandedRowHeight = React.useMemo(() => {\n        const values: number[] = Object.values(expandedRowSizes);\n        return values.length ? values.reduce((a, b) => a + b, 0) / values.length : 0;\n    }, [expandedRowSizes]);\n    const meta = table.options.meta as TableMeta<any>;\n\n    const estimateSize = React.useCallback(\n        index => {\n            const rowHeight = meta.rowDensity ? densitySizeEstimates[meta.rowDensity] : densitySizeEstimates.normal;\n\n            if (table.getState().expanded === true || table.getState().expanded?.[index]) {\n                return rowHeight + (expandedRowSizes[index] ?? firstAvailableExpandedRowHeight ?? 0);\n            }\n\n            return rowHeight;\n        },\n\n        [meta.rowDensity, expandedRowSizes, table.getState().expanded]\n    );\n\n    const virtualiser = useVirtual({\n        parentRef: tableRef,\n        size: rows.length,\n        estimateSize,\n        overscan: 10,\n    });\n\n    const paddingTop = virtualiser.virtualItems.length > 0 ? virtualiser.virtualItems?.[0]?.start || 0 : 0;\n    const paddingBottom =\n        virtualiser.virtualItems.length > 0\n            ? virtualiser.totalSize - (virtualiser.virtualItems?.[virtualiser.virtualItems.length - 1]?.end || 0)\n            : 0;\n\n    return { virtualiser, virtualiserOffsets: { top: paddingTop, bottom: paddingBottom }, setExpandedRowSizes };\n};\n"],"names":["densitySizeEstimates","compact","normal","comfortable","spacious","useVirtualiser","rows","table","tableRef","expandedRowSizes","setExpandedRowSizes","React","useState","firstAvailableExpandedRowHeight","useMemo","values","Object","length","reduce","a","b","meta","options","estimateSize","useCallback","index","rowHeight","rowDensity","getState","expanded","virtualiser","useVirtual","parentRef","size","overscan","paddingTop","virtualItems","start","paddingBottom","totalSize","end","virtualiserOffsets","top","bottom"],"mappings":";;;AAoBA,MAAMA,oBAAoB,GAAG;EACzBC,OAAO,EAAE,EAAE;EACXC,MAAM,EAAE,EAAE;EACVC,WAAW,EAAE,EAAE;EACfC,QAAQ,EAAE;CACb;MAEYC,cAAc,GAAG,CAAC;EAAEC,IAAI;EAAEC;CAAO,EAAEC,QAAsC;;EAClF,MAAM,CAACC,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAC,EAAE,CAAC;EAClE,MAAMC,+BAA+B,GAAGF,cAAK,CAACG,OAAO,CAAC;IAClD,MAAMC,MAAM,GAAaC,MAAM,CAACD,MAAM,CAACN,gBAAgB,CAAC;IACxD,OAAOM,MAAM,CAACE,MAAM,GAAGF,MAAM,CAACG,MAAM,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKD,CAAC,GAAGC,CAAC,EAAE,CAAC,CAAC,GAAGL,MAAM,CAACE,MAAM,GAAG,CAAC;GAC/E,EAAE,CAACR,gBAAgB,CAAC,CAAC;EACtB,MAAMY,IAAI,GAAGd,KAAK,CAACe,OAAO,CAACD,IAAsB;EAEjD,MAAME,YAAY,GAAGZ,cAAK,CAACa,WAAW,CAClCC,KAAK;;IACD,MAAMC,SAAS,GAAGL,IAAI,CAACM,UAAU,GAAG3B,oBAAoB,CAACqB,IAAI,CAACM,UAAU,CAAC,GAAG3B,oBAAoB,CAACE,MAAM;IAEvG,IAAIK,KAAK,CAACqB,QAAQ,EAAE,CAACC,QAAQ,KAAK,IAAI,6BAAItB,KAAK,CAACqB,QAAQ,EAAE,CAACC,QAAQ,kDAAzB,sBAA4BJ,KAAK,CAAC,EAAE;MAAA;MAC1E,OAAOC,SAAS,qCAAIjB,gBAAgB,CAACgB,KAAK,CAAC,yEAAIZ,+BAA+B,uCAAI,CAAC,CAAC;;IAGxF,OAAOa,SAAS;GACnB,EAED,CAACL,IAAI,CAACM,UAAU,EAAElB,gBAAgB,EAAEF,KAAK,CAACqB,QAAQ,EAAE,CAACC,QAAQ,CAAC,CACjE;EAED,MAAMC,WAAW,GAAGC,UAAU,CAAC;IAC3BC,SAAS,EAAExB,QAAQ;IACnByB,IAAI,EAAE3B,IAAI,CAACW,MAAM;IACjBM,YAAY;IACZW,QAAQ,EAAE;GACb,CAAC;EAEF,MAAMC,UAAU,GAAGL,WAAW,CAACM,YAAY,CAACnB,MAAM,GAAG,CAAC,GAAG,0BAAAa,WAAW,CAACM,YAAY,oFAAxB,sBAA2B,CAAC,CAAC,2DAA7B,uBAA+BC,KAAK,KAAI,CAAC,GAAG,CAAC;EACtG,MAAMC,aAAa,GACfR,WAAW,CAACM,YAAY,CAACnB,MAAM,GAAG,CAAC,GAC7Ba,WAAW,CAACS,SAAS,IAAI,2BAAAT,WAAW,CAACM,YAAY,qFAAxB,uBAA2BN,WAAW,CAACM,YAAY,CAACnB,MAAM,GAAG,CAAC,CAAC,2DAA/D,uBAAiEuB,GAAG,KAAI,CAAC,CAAC,GACnG,CAAC;EAEX,OAAO;IAAEV,WAAW;IAAEW,kBAAkB,EAAE;MAAEC,GAAG,EAAEP,UAAU;MAAEQ,MAAM,EAAEL;KAAe;IAAE5B;GAAqB;AAC/G;;;;"}

package/dist/esm/packages/taco/src/components/Table2/types.js

@@ -0,0 +1,16 @@
+var Table2FilterComparator;
+(function (Table2FilterComparator) {
+  Table2FilterComparator[Table2FilterComparator["Contains"] = 0] = "Contains";
+  Table2FilterComparator[Table2FilterComparator["DoesNotContain"] = 1] = "DoesNotContain";
+  Table2FilterComparator[Table2FilterComparator["IsEqualTo"] = 2] = "IsEqualTo";
+  Table2FilterComparator[Table2FilterComparator["IsNotEqualTo"] = 3] = "IsNotEqualTo";
+  Table2FilterComparator[Table2FilterComparator["IsGreaterThan"] = 4] = "IsGreaterThan";
+  Table2FilterComparator[Table2FilterComparator["IsLessThan"] = 5] = "IsLessThan";
+  Table2FilterComparator[Table2FilterComparator["IsBetween"] = 6] = "IsBetween";
+  Table2FilterComparator[Table2FilterComparator["IsOneOf"] = 7] = "IsOneOf";
+  Table2FilterComparator[Table2FilterComparator["IsNoneOf"] = 8] = "IsNoneOf";
+  Table2FilterComparator[Table2FilterComparator["IsAllOf"] = 9] = "IsAllOf";
+})(Table2FilterComparator || (Table2FilterComparator = {}));
+
+export { Table2FilterComparator };
+//# sourceMappingURL=types.js.map

package/dist/esm/packages/taco/src/components/Table2/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":["../../../../../../../src/components/Table2/types.ts"],"sourcesContent":["import React from 'react';\nimport {\n    ColumnFiltersState,\n    ColumnOrderState,\n    ColumnPinningState,\n    ColumnSizingState,\n    OnChangeFn,\n    Row,\n    SortingState,\n    VisibilityState,\n} from '@tanstack/react-table';\nimport { DialogProps } from '../Dialog/Dialog';\nimport { IconName } from '../Icon/Icon';\nimport { MenuProps } from '../Menu/Menu';\n\nexport enum Table2FilterComparator {\n    Contains,\n    DoesNotContain,\n    IsEqualTo,\n    IsNotEqualTo,\n    IsGreaterThan,\n    IsLessThan,\n    IsBetween,\n    IsOneOf,\n    IsNoneOf,\n    IsAllOf,\n}\n\nexport type Table2Filter<TType = any> = {\n    comparator?: Table2FilterComparator;\n    value: TType | TType[];\n};\n\nexport type ColumnOffsetState = Record<string, number | undefined>;\nexport type RowDensity = 'compact' | 'normal' | 'comfortable' | 'spacious';\nexport type CellAlignment = 'left' | 'center' | 'right';\n\nexport type SortDirection = 'asc' | 'desc';\nexport type ColumnDataType = 'auto' | 'alphanumeric' | 'alphanumericCaseSensitive' | 'datetime' | 'boolean';\n\nexport type Table2ToolbarProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type Table2ColumnHeaderRenderer<TType = any> = (value: any, row: TType) => JSX.Element | string | null;\nexport type Table2ColumnHeaderMenu = (props: Partial<MenuProps>) => JSX.Element;\nexport type Table2ColumnFooterRenderer = (values: any[]) => JSX.Element | string | null;\n\nexport type Table2ColumnControlProps = {\n    onBlur: (newValue?: any) => Promise<void>;\n    onFocus: React.FocusEventHandler;\n    ref: React.RefObject<HTMLElement>;\n    setValue: (value: any) => void;\n    value: any;\n    disabled?: boolean;\n    readOnly?: boolean;\n    // This is a temporary fix to enable up/down arrow key shortcuts on input in quick mode. For some reason,\n    // the preventDefault is true on Taco Input, so the keyboard shortcuts doesn't work. By adding this\n    // data attribute we make sure the event is coming from a control component, and then we can make sure\n    // keyboard shortcut works as expected.\n    'data-inline-editing-component'?: 'true';\n    className?: string;\n};\nexport type Table2ColumnControlRenderer<TType = any> =\n    | ((props: Table2ColumnControlProps, row?: TType) => JSX.Element)\n    | 'datepicker'\n    | 'input'\n    | 'switch';\n\nexport type Table2ColumnProps<TType = any> = {\n    accessor: string;\n    align?: CellAlignment;\n    className?: string | ((row: Row<TType>) => string);\n    control?: Table2ColumnControlRenderer<TType>;\n    dataType?: ColumnDataType;\n    defaultActiveColumnIndex?: number;\n    defaultActiveRowIndex?: number;\n    defaultHidden?: boolean;\n    defaultPinned?: boolean;\n    disableFiltering?: boolean;\n    disableHiding?: boolean;\n    disableReordering?: boolean;\n    disableResizing?: boolean;\n    disableSorting?: boolean;\n    disableTruncation?: boolean;\n    defaultWidth?: number;\n    header: string;\n    headerClassName?: string;\n    footer?: Table2ColumnFooterRenderer;\n    renderer?: Table2ColumnHeaderRenderer<TType>;\n    menu?: Table2ColumnHeaderMenu;\n    minWidth?: number;\n    sort?: SortDirection;\n    tooltip?: string;\n};\n\nexport type Table2ActionProps<TType> = {\n    dialog?: (rows: TType[], resetSelectedRows: () => void) => (props: Partial<DialogProps>) => JSX.Element;\n    disabled?: boolean | ((rows: TType[]) => boolean);\n    icon: IconName | ((rows: TType[]) => IconName);\n    onClick?: (rows: TType[], resetSelectedRows: () => void) => void;\n    text: string | ((rows: TType[]) => string);\n    visible?: boolean | ((rows: TType[]) => boolean);\n};\n\nexport type Table2RowActionProps<TType> = {\n    ariaLabel: string | ((row: TType) => string);\n    dialog?: (row: TType) => (props: Partial<DialogProps>) => JSX.Element;\n    disabled?: boolean | ((row: TType) => boolean);\n    icon: IconName | ((row: TType) => IconName);\n    onClick?: (row: TType) => void;\n    text: string | ((row: TType) => string);\n    visible?: boolean | ((row: TType) => boolean);\n};\n\nexport type Table2Settings = {\n    columnFilters?: ColumnFiltersState;\n    columnOrder?: ColumnOrderState;\n    columnPinning?: ColumnPinningState;\n    columnSizing?: ColumnSizingState;\n    columnVisibility?: VisibilityState;\n    globalFilter?: string;\n    rowDensity?: RowDensity;\n    sorting?: SortingState;\n};\n\nexport type RowClickHandler<TType = any> = (row: TType) => void;\nexport type RowDragHandler<TType = any> = (\n    rows: TType[],\n    showPlaceholder: (string) => void,\n    setDataTransfer: (data: string) => void\n) => void;\nexport type RowSelectionHandler<TType = any> = (rows: TType[]) => void;\nexport type SortHandler = OnChangeFn<SortingState>;\nexport type SettingsHandler = OnChangeFn<Table2Settings>;\nexport type SaveHandlerErrorResponse = Record<string, string | undefined | null> | null;\nexport type SaveHandler<TType = any> = (row: TType, accessor: string) => Promise<SaveHandlerErrorResponse | void>;\n\nexport type DataColumnIndexes = {\n    dataColumnStartOffset: number;\n    dataColumnEndOffset: number;\n};\n\nexport type Table2Props<TType = any> = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    actionsForRow?: Table2RowActionProps<TType>[];\n    children: (React.ReactElement<Table2ColumnProps<TType>> | boolean | null)[];\n    className?: string;\n    data: TType[];\n    defaultActiveRowIndex?: number;\n    disableColumnFiltering?: boolean;\n    disableColumnHiding?: boolean;\n    disableColumnPinning?: boolean;\n    disableColumnReordering?: boolean;\n    disableColumnResizing?: boolean;\n    disableRowDensity?: boolean;\n    disableRowExpansion?: boolean;\n    disableRowSelection?: boolean;\n    disableMultipleRowSelection?: boolean;\n    disableSearch?: boolean;\n    disableSorting?: boolean;\n    emptyState?: () => JSX.Element;\n    expandedRowRenderer?: (row: TType) => JSX.Element;\n    length?: number;\n    loadMore?: () => Promise<void>;\n    manualColumnFiltering?: boolean;\n    manualSearch?: boolean;\n    manualSorting?: boolean;\n    onChangeSettings?: SettingsHandler;\n    onRowClick?: RowClickHandler<TType>;\n    onRowDrag?: RowDragHandler<TType>;\n    onRowSelect?: RowSelectionHandler<TType>;\n    onSave?: SaveHandler<TType>;\n    settings?: Table2Settings;\n    _experimentalActionsForTable?: Table2ActionProps<TType>[];\n    _experimentalActionsForTableSummary?: (rows: TType[]) => JSX.Element | string;\n};\n"],"names":["Table2FilterComparator"],"mappings":"IAeYA;AAAZ,WAAYA,sBAAsB;EAC9BA,2EAAQ;EACRA,uFAAc;EACdA,6EAAS;EACTA,mFAAY;EACZA,qFAAa;EACbA,+EAAU;EACVA,6EAAS;EACTA,yEAAO;EACPA,2EAAQ;EACRA,yEAAO;AACX,CAAC,EAXWA,sBAAsB,KAAtBA,sBAAsB;;;;"}

package/dist/esm/packages/taco/src/components/Table2/utilities/cell.js

@@ -0,0 +1,41 @@
+import cn from 'classnames';
+import { COLUMN_ID_FOR_EXPANSION, COLUMN_ID_FOR_SELECTION } from './columns.js';
+
+const getDensityPadding = (density, editing = false) => {
+  switch (density) {
+    case 'compact':
+      return editing ? 'py-0' : 'py-1.5';
+    case 'comfortable':
+      return editing ? 'py-2' : 'py-3.5';
+    case 'spacious':
+      return editing ? 'py-3' : 'py-5';
+    default:
+      return editing ? 'py-1' : 'py-2.5';
+  }
+};
+const getCellSizingClasses = (density = 'normal', editing = false) => {
+  return cn('flex items-center', getDensityPadding(density, editing), editing ? 'px-[7px]' : 'px-4');
+};
+const getCellAlignmentClasses = (alignment = 'left') => ({
+  'justify-start text-left': alignment === 'left',
+  'justify-end text-right': alignment === 'right',
+  'justify-center text-center': alignment === 'center'
+});
+const getPinnedShadowClasses = (column, columnPinning, isHorizontallyOffset) => {
+  const pinned = !!column.getIsPinned();
+  // react-table has column.getPinnedIndex() but it does not exclude hidden columns, so the number is wrong
+  const pinnedIndex = columnPinning.indexOf(column.id);
+  const isLastPinned = pinned && pinnedIndex === columnPinning.length - 1;
+  const hidePinnedShadow = !isHorizontallyOffset && (column.id === COLUMN_ID_FOR_EXPANSION || column.id === COLUMN_ID_FOR_SELECTION);
+  return {
+    'shadow-[6px_0px_6px_rgb(0_0_0/8%),1px_0px_0px_theme(colors.grey.300)]': isLastPinned && isHorizontallyOffset,
+    'shadow-[1px_0px_0px_theme(colors.grey.300)]': isLastPinned && !isHorizontallyOffset && !hidePinnedShadow
+  };
+};
+const isKeyboardFocusableElement = element => {
+  const focussableNodeNames = ['A', 'BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'DETAILS'];
+  return focussableNodeNames.includes(element.nodeName) && !element.hasAttribute('disabled') && !element.hasAttribute('readonly') && !element.getAttribute('aria-hidden');
+};
+
+export { getCellAlignmentClasses, getCellSizingClasses, getPinnedShadowClasses, isKeyboardFocusableElement };
+//# sourceMappingURL=cell.js.map

package/dist/esm/packages/taco/src/components/Table2/utilities/cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cell.js","sources":["../../../../../../../../src/components/Table2/utilities/cell.ts"],"sourcesContent":["import cn from 'classnames';\nimport { Column } from '@tanstack/react-table';\nimport { CellAlignment, RowDensity } from '../types';\nimport { COLUMN_ID_FOR_EXPANSION, COLUMN_ID_FOR_SELECTION } from './columns';\n\nconst getDensityPadding = (density: RowDensity, editing = false) => {\n    switch (density) {\n        case 'compact':\n            return editing ? 'py-0' : 'py-1.5';\n        case 'comfortable':\n            return editing ? 'py-2' : 'py-3.5';\n        case 'spacious':\n            return editing ? 'py-3' : 'py-5';\n        default:\n            return editing ? 'py-1' : 'py-2.5';\n    }\n};\n\nexport const getCellSizingClasses = (density: RowDensity = 'normal', editing = false) => {\n    return cn('flex items-center', getDensityPadding(density, editing), editing ? 'px-[7px]' : 'px-4');\n};\n\nexport const getCellAlignmentClasses = (alignment: CellAlignment = 'left') => ({\n    'justify-start text-left': alignment === 'left',\n    'justify-end text-right': alignment === 'right',\n    'justify-center text-center': alignment === 'center',\n});\n\nexport const getPinnedShadowClasses = (column: Column<any, any>, columnPinning: string[], isHorizontallyOffset: boolean) => {\n    const pinned = !!column.getIsPinned();\n\n    // react-table has column.getPinnedIndex() but it does not exclude hidden columns, so the number is wrong\n    const pinnedIndex = columnPinning.indexOf(column.id);\n    const isLastPinned = pinned && pinnedIndex === columnPinning.length - 1;\n    const hidePinnedShadow =\n        !isHorizontallyOffset && (column.id === COLUMN_ID_FOR_EXPANSION || column.id === COLUMN_ID_FOR_SELECTION);\n\n    return {\n        'shadow-[6px_0px_6px_rgb(0_0_0/8%),1px_0px_0px_theme(colors.grey.300)]': isLastPinned && isHorizontallyOffset,\n        'shadow-[1px_0px_0px_theme(colors.grey.300)]': isLastPinned && !isHorizontallyOffset && !hidePinnedShadow,\n    };\n};\n\nexport const isKeyboardFocusableElement = (element: Element) => {\n    const focussableNodeNames = ['A', 'BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'DETAILS'];\n\n    return (\n        focussableNodeNames.includes(element.nodeName) &&\n        !element.hasAttribute('disabled') &&\n        !element.hasAttribute('readonly') &&\n        !element.getAttribute('aria-hidden')\n    );\n};\n"],"names":["getDensityPadding","density","editing","getCellSizingClasses","cn","getCellAlignmentClasses","alignment","getPinnedShadowClasses","column","columnPinning","isHorizontallyOffset","pinned","getIsPinned","pinnedIndex","indexOf","id","isLastPinned","length","hidePinnedShadow","COLUMN_ID_FOR_EXPANSION","COLUMN_ID_FOR_SELECTION","isKeyboardFocusableElement","element","focussableNodeNames","includes","nodeName","hasAttribute","getAttribute"],"mappings":";;;AAKA,MAAMA,iBAAiB,GAAG,CAACC,OAAmB,EAAEC,OAAO,GAAG,KAAK;EAC3D,QAAQD,OAAO;IACX,KAAK,SAAS;MACV,OAAOC,OAAO,GAAG,MAAM,GAAG,QAAQ;IACtC,KAAK,aAAa;MACd,OAAOA,OAAO,GAAG,MAAM,GAAG,QAAQ;IACtC,KAAK,UAAU;MACX,OAAOA,OAAO,GAAG,MAAM,GAAG,MAAM;IACpC;MACI,OAAOA,OAAO,GAAG,MAAM,GAAG,QAAQ;;AAE9C,CAAC;MAEYC,oBAAoB,GAAG,CAACF,UAAsB,QAAQ,EAAEC,OAAO,GAAG,KAAK;EAChF,OAAOE,EAAE,CAAC,mBAAmB,EAAEJ,iBAAiB,CAACC,OAAO,EAAEC,OAAO,CAAC,EAAEA,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC;AACtG;MAEaG,uBAAuB,GAAG,CAACC,YAA2B,MAAM,MAAM;EAC3E,yBAAyB,EAAEA,SAAS,KAAK,MAAM;EAC/C,wBAAwB,EAAEA,SAAS,KAAK,OAAO;EAC/C,4BAA4B,EAAEA,SAAS,KAAK;CAC/C;MAEYC,sBAAsB,GAAG,CAACC,MAAwB,EAAEC,aAAuB,EAAEC,oBAA6B;EACnH,MAAMC,MAAM,GAAG,CAAC,CAACH,MAAM,CAACI,WAAW,EAAE;;EAGrC,MAAMC,WAAW,GAAGJ,aAAa,CAACK,OAAO,CAACN,MAAM,CAACO,EAAE,CAAC;EACpD,MAAMC,YAAY,GAAGL,MAAM,IAAIE,WAAW,KAAKJ,aAAa,CAACQ,MAAM,GAAG,CAAC;EACvE,MAAMC,gBAAgB,GAClB,CAACR,oBAAoB,KAAKF,MAAM,CAACO,EAAE,KAAKI,uBAAuB,IAAIX,MAAM,CAACO,EAAE,KAAKK,uBAAuB,CAAC;EAE7G,OAAO;IACH,uEAAuE,EAAEJ,YAAY,IAAIN,oBAAoB;IAC7G,6CAA6C,EAAEM,YAAY,IAAI,CAACN,oBAAoB,IAAI,CAACQ;GAC5F;AACL;MAEaG,0BAA0B,GAAIC,OAAgB;EACvD,MAAMC,mBAAmB,GAAG,CAAC,GAAG,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,CAAC;EAErF,OACIA,mBAAmB,CAACC,QAAQ,CAACF,OAAO,CAACG,QAAQ,CAAC,IAC9C,CAACH,OAAO,CAACI,YAAY,CAAC,UAAU,CAAC,IACjC,CAACJ,OAAO,CAACI,YAAY,CAAC,UAAU,CAAC,IACjC,CAACJ,OAAO,CAACK,YAAY,CAAC,aAAa,CAAC;AAE5C;;;;"}