@fluentui/react-table 9.8.8 → 9.9.1

package/lib/utils/isColumnSortable.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["isColumnSortable.ts"],"sourcesContent":["import { TableColumnDefinition } from '../hooks/types';\n\nexport function isColumnSortable(column: TableColumnDefinition<unknown>) {\n  return column.compare.length > 0;\n}\n"],"names":["isColumnSortable","column","compare","length"],"mappings":"AAEA,OAAO,SAASA,iBAAiBC,MAAsC;IACrE,OAAOA,OAAOC,OAAO,CAACC,MAAM,GAAG;AACjC"}

package/lib-commonjs/components/DataGrid/useDataGrid.js

@@ -50,8 +50,8 @@ const useDataGrid_unstable = (props, ref)=>{
     const innerRef = _react.useRef(null);
     const { findFirstFocusable, findLastFocusable } = (0, _reacttabster.useFocusFinders)();
     const onKeyDown = (0, _reactutilities.useEventCallback)((e)=>{
-        var _props_onKeyDown, _props;
-        (_props_onKeyDown = (_props = props).onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(_props, e);
+        var _props_onKeyDown;
+        (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);
         focusMode === 'composite' && onCompositeKeyDown(e);
         // handle ctrl+home and ctrl+end
         if (!innerRef.current || !e.ctrlKey || e.defaultPrevented) {

package/lib-commonjs/components/DataGrid/useDataGrid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGrid.js"],"sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useTable_unstable } from '../Table/useTable';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { End, Home } from '@fluentui/keyboard-keys';\nimport { useTableFeatures, useTableSort, useTableSelection, useTableColumnSizing_unstable, useTableCompositeNavigation } from '../../hooks';\nimport { CELL_WIDTH } from '../TableSelectionCell';\n/**\n * Create the state required to render DataGrid.\n *\n * The returned state can be modified with hooks such as useDataGridStyles_unstable,\n * before being passed to renderDataGrid_unstable.\n *\n * @param props - props from this instance of DataGrid\n * @param ref - reference to root HTMLElement of DataGrid\n */ export const useDataGrid_unstable = (props, ref)=>{\n    const { items, columns, focusMode = 'cell', selectionMode, onSortChange, onSelectionChange, defaultSortState, sortState, selectedItems, defaultSelectedItems, subtleSelection = false, selectionAppearance = 'brand', getRowId, resizableColumns, columnSizingOptions, onColumnResize, containerWidthOffset } = props;\n    const widthOffset = containerWidthOffset !== null && containerWidthOffset !== void 0 ? containerWidthOffset : selectionMode ? -CELL_WIDTH : 0;\n    const gridTabsterAttribute = useArrowNavigationGroup({\n        axis: 'grid'\n    });\n    const { onTableKeyDown: onCompositeKeyDown, tableTabsterAttribute: compositeTabsterAttribute, tableRowTabsterAttribute: compositeRowTabsterAttribute } = useTableCompositeNavigation();\n    const tableState = useTableFeatures({\n        items,\n        columns,\n        getRowId\n    }, [\n        useTableSort({\n            defaultSortState,\n            sortState,\n            onSortChange\n        }),\n        useTableSelection({\n            defaultSelectedItems,\n            selectedItems,\n            onSelectionChange,\n            selectionMode: selectionMode !== null && selectionMode !== void 0 ? selectionMode : 'multiselect'\n        }),\n        useTableColumnSizing_unstable({\n            onColumnResize,\n            columnSizingOptions,\n            // The selection cell is not part of the columns, therefore its width needs to be subtracted\n            // from the container to make sure the columns don't overflow the table.\n            containerWidthOffset: widthOffset\n        })\n    ]);\n    const innerRef = React.useRef(null);\n    const { findFirstFocusable, findLastFocusable } = useFocusFinders();\n    const onKeyDown = useEventCallback((e)=>{\n        var _props_onKeyDown, _props;\n        (_props_onKeyDown = (_props = props).onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(_props, e);\n        focusMode === 'composite' && onCompositeKeyDown(e);\n        // handle ctrl+home and ctrl+end\n        if (!innerRef.current || !e.ctrlKey || e.defaultPrevented) {\n            return;\n        }\n        if (e.key === Home) {\n            const firstRow = innerRef.current.querySelector('[role=\"row\"]');\n            if (firstRow) {\n                var _findFirstFocusable;\n                (_findFirstFocusable = findFirstFocusable(firstRow)) === null || _findFirstFocusable === void 0 ? void 0 : _findFirstFocusable.focus();\n            }\n        }\n        if (e.key === End) {\n            const rows = innerRef.current.querySelectorAll('[role=\"row\"]');\n            if (rows.length) {\n                var _findLastFocusable;\n                const lastRow = rows.item(rows.length - 1);\n                (_findLastFocusable = findLastFocusable(lastRow)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();\n            }\n        }\n    });\n    const baseTableState = useTable_unstable({\n        role: 'grid',\n        as: 'div',\n        noNativeElements: true,\n        ...focusMode === 'cell' && gridTabsterAttribute,\n        ...focusMode === 'composite' && compositeTabsterAttribute,\n        ...props,\n        onKeyDown,\n        ...resizableColumns ? tableState.columnSizing_unstable.getTableProps(props) : {}\n    }, useMergedRefs(ref, tableState.tableRef, innerRef));\n    return {\n        ...baseTableState,\n        focusMode,\n        tableState,\n        selectableRows: !!selectionMode,\n        subtleSelection,\n        selectionAppearance,\n        resizableColumns,\n        compositeRowTabsterAttribute\n    };\n};\n"],"names":["useDataGrid_unstable","props","ref","items","columns","focusMode","selectionMode","onSortChange","onSelectionChange","defaultSortState","sortState","selectedItems","defaultSelectedItems","subtleSelection","selectionAppearance","getRowId","resizableColumns","columnSizingOptions","onColumnResize","containerWidthOffset","widthOffset","CELL_WIDTH","gridTabsterAttribute","useArrowNavigationGroup","axis","onTableKeyDown","onCompositeKeyDown","tableTabsterAttribute","compositeTabsterAttribute","tableRowTabsterAttribute","compositeRowTabsterAttribute","useTableCompositeNavigation","tableState","useTableFeatures","useTableSort","useTableSelection","useTableColumnSizing_unstable","innerRef","React","useRef","findFirstFocusable","findLastFocusable","useFocusFinders","onKeyDown","useEventCallback","e","_props_onKeyDown","_props","call","current","ctrlKey","defaultPrevented","key","Home","firstRow","querySelector","_findFirstFocusable","focus","End","rows","querySelectorAll","length","_findLastFocusable","lastRow","item","baseTableState","useTable_unstable","role","as","noNativeElements","columnSizing_unstable","getTableProps","useMergedRefs","tableRef","selectableRows"],"mappings":"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"}
+{"version":3,"sources":["useDataGrid.js"],"sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useTable_unstable } from '../Table/useTable';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { End, Home } from '@fluentui/keyboard-keys';\nimport { useTableFeatures, useTableSort, useTableSelection, useTableColumnSizing_unstable, useTableCompositeNavigation } from '../../hooks';\nimport { CELL_WIDTH } from '../TableSelectionCell';\n/**\n * Create the state required to render DataGrid.\n *\n * The returned state can be modified with hooks such as useDataGridStyles_unstable,\n * before being passed to renderDataGrid_unstable.\n *\n * @param props - props from this instance of DataGrid\n * @param ref - reference to root HTMLElement of DataGrid\n */ export const useDataGrid_unstable = (props, ref)=>{\n    const { items, columns, focusMode = 'cell', selectionMode, onSortChange, onSelectionChange, defaultSortState, sortState, selectedItems, defaultSelectedItems, subtleSelection = false, selectionAppearance = 'brand', getRowId, resizableColumns, columnSizingOptions, onColumnResize, containerWidthOffset } = props;\n    const widthOffset = containerWidthOffset !== null && containerWidthOffset !== void 0 ? containerWidthOffset : selectionMode ? -CELL_WIDTH : 0;\n    const gridTabsterAttribute = useArrowNavigationGroup({\n        axis: 'grid'\n    });\n    const { onTableKeyDown: onCompositeKeyDown, tableTabsterAttribute: compositeTabsterAttribute, tableRowTabsterAttribute: compositeRowTabsterAttribute } = useTableCompositeNavigation();\n    const tableState = useTableFeatures({\n        items,\n        columns,\n        getRowId\n    }, [\n        useTableSort({\n            defaultSortState,\n            sortState,\n            onSortChange\n        }),\n        useTableSelection({\n            defaultSelectedItems,\n            selectedItems,\n            onSelectionChange,\n            selectionMode: selectionMode !== null && selectionMode !== void 0 ? selectionMode : 'multiselect'\n        }),\n        useTableColumnSizing_unstable({\n            onColumnResize,\n            columnSizingOptions,\n            // The selection cell is not part of the columns, therefore its width needs to be subtracted\n            // from the container to make sure the columns don't overflow the table.\n            containerWidthOffset: widthOffset\n        })\n    ]);\n    const innerRef = React.useRef(null);\n    const { findFirstFocusable, findLastFocusable } = useFocusFinders();\n    const onKeyDown = useEventCallback((e)=>{\n        var _props_onKeyDown;\n        (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);\n        focusMode === 'composite' && onCompositeKeyDown(e);\n        // handle ctrl+home and ctrl+end\n        if (!innerRef.current || !e.ctrlKey || e.defaultPrevented) {\n            return;\n        }\n        if (e.key === Home) {\n            const firstRow = innerRef.current.querySelector('[role=\"row\"]');\n            if (firstRow) {\n                var _findFirstFocusable;\n                (_findFirstFocusable = findFirstFocusable(firstRow)) === null || _findFirstFocusable === void 0 ? void 0 : _findFirstFocusable.focus();\n            }\n        }\n        if (e.key === End) {\n            const rows = innerRef.current.querySelectorAll('[role=\"row\"]');\n            if (rows.length) {\n                var _findLastFocusable;\n                const lastRow = rows.item(rows.length - 1);\n                (_findLastFocusable = findLastFocusable(lastRow)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();\n            }\n        }\n    });\n    const baseTableState = useTable_unstable({\n        role: 'grid',\n        as: 'div',\n        noNativeElements: true,\n        ...focusMode === 'cell' && gridTabsterAttribute,\n        ...focusMode === 'composite' && compositeTabsterAttribute,\n        ...props,\n        onKeyDown,\n        ...resizableColumns ? tableState.columnSizing_unstable.getTableProps(props) : {}\n    }, useMergedRefs(ref, tableState.tableRef, innerRef));\n    return {\n        ...baseTableState,\n        focusMode,\n        tableState,\n        selectableRows: !!selectionMode,\n        subtleSelection,\n        selectionAppearance,\n        resizableColumns,\n        compositeRowTabsterAttribute\n    };\n};\n"],"names":["useDataGrid_unstable","props","ref","items","columns","focusMode","selectionMode","onSortChange","onSelectionChange","defaultSortState","sortState","selectedItems","defaultSelectedItems","subtleSelection","selectionAppearance","getRowId","resizableColumns","columnSizingOptions","onColumnResize","containerWidthOffset","widthOffset","CELL_WIDTH","gridTabsterAttribute","useArrowNavigationGroup","axis","onTableKeyDown","onCompositeKeyDown","tableTabsterAttribute","compositeTabsterAttribute","tableRowTabsterAttribute","compositeRowTabsterAttribute","useTableCompositeNavigation","tableState","useTableFeatures","useTableSort","useTableSelection","useTableColumnSizing_unstable","innerRef","React","useRef","findFirstFocusable","findLastFocusable","useFocusFinders","onKeyDown","useEventCallback","e","_props_onKeyDown","call","current","ctrlKey","defaultPrevented","key","Home","firstRow","querySelector","_findFirstFocusable","focus","End","rows","querySelectorAll","length","_findLastFocusable","lastRow","item","baseTableState","useTable_unstable","role","as","noNativeElements","columnSizing_unstable","getTableProps","useMergedRefs","tableRef","selectableRows"],"mappings":"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"}

package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCell.js

@@ -15,22 +15,32 @@ const _useTableHeaderCell = require("../TableHeaderCell/useTableHeaderCell");
 const _dataGridContext = require("../../contexts/dataGridContext");
 const _columnIdContext = require("../../contexts/columnIdContext");
 const _tableContext = require("../../contexts/tableContext");
+const _isColumnSortable = require("../../utils/isColumnSortable");
 const useDataGridHeaderCell_unstable = (props, ref)=>{
     const columnId = (0, _columnIdContext.useColumnIdContext)();
-    const { sortable } = (0, _tableContext.useTableContext)();
+    const { sortable: gridSortable } = (0, _tableContext.useTableContext)();
     const toggleColumnSort = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.sort.toggleColumnSort);
+    const sortable = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>{
+        const columnSortable = !!ctx.columns.find((c)=>c.columnId === columnId && (0, _isColumnSortable.isColumnSortable)(c));
+        if (!gridSortable) {
+            // if the grid is not sortable - disable sorting on all columns
+            return false;
+        }
+        return columnSortable;
+    });
     const sortDirection = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>sortable ? ctx.sort.getSortDirection(columnId) : undefined);
     const resizableColumns = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.resizableColumns);
     const columnSizing = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.columnSizing_unstable);
     // eslint-disable-next-line deprecation/deprecation -- prefer HTMLTableCellElement
     const onClick = (0, _reactutilities.useEventCallback)((e)=>{
-        var _props_onClick, _props;
+        var _props_onClick;
         if (sortable) {
             toggleColumnSort(e, columnId);
         }
-        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, e);
+        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);
     });
     return (0, _useTableHeaderCell.useTableHeaderCell_unstable)({
+        sortable,
         sortDirection,
         as: 'div',
         tabIndex: sortable ? undefined : 0,

package/lib-commonjs/components/DataGridHeaderCell/useDataGridHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridHeaderCell.js"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { useTableHeaderCell_unstable } from '../TableHeaderCell/useTableHeaderCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useColumnIdContext } from '../../contexts/columnIdContext';\nimport { useTableContext } from '../../contexts/tableContext';\n/**\n * Create the state required to render DataGridHeaderCell.\n *\n * The returned state can be modified with hooks such as useDataGridHeaderCellStyles_unstable,\n * before being passed to renderDataGridHeaderCell_unstable.\n *\n * @param props - props from this instance of DataGridHeaderCell\n * @param ref - reference to root HTMLElement of DataGridHeaderCell\n */ export const useDataGridHeaderCell_unstable = (props, ref)=>{\n    const columnId = useColumnIdContext();\n    const { sortable } = useTableContext();\n    const toggleColumnSort = useDataGridContext_unstable((ctx)=>ctx.sort.toggleColumnSort);\n    const sortDirection = useDataGridContext_unstable((ctx)=>sortable ? ctx.sort.getSortDirection(columnId) : undefined);\n    const resizableColumns = useDataGridContext_unstable((ctx)=>ctx.resizableColumns);\n    const columnSizing = useDataGridContext_unstable((ctx)=>ctx.columnSizing_unstable);\n    // eslint-disable-next-line deprecation/deprecation -- prefer HTMLTableCellElement\n    const onClick = useEventCallback((e)=>{\n        var _props_onClick, _props;\n        if (sortable) {\n            toggleColumnSort(e, columnId);\n        }\n        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, e);\n    });\n    return useTableHeaderCell_unstable({\n        sortDirection,\n        as: 'div',\n        tabIndex: sortable ? undefined : 0,\n        ...resizableColumns ? columnSizing.getTableHeaderCellProps(columnId) : {},\n        ...props,\n        onClick\n    }, ref);\n};\n"],"names":["useDataGridHeaderCell_unstable","props","ref","columnId","useColumnIdContext","sortable","useTableContext","toggleColumnSort","useDataGridContext_unstable","ctx","sort","sortDirection","getSortDirection","undefined","resizableColumns","columnSizing","columnSizing_unstable","onClick","useEventCallback","e","_props_onClick","_props","call","useTableHeaderCell_unstable","as","tabIndex","getTableHeaderCellProps"],"mappings":";;;;+BAciBA;;;eAAAA;;;;iEAdM;gCACU;oCACW;iCACA;iCACT;8BACH;AASrB,MAAMA,iCAAiC,CAACC,OAAOC;IACtD,MAAMC,WAAWC,IAAAA,mCAAkB;IACnC,MAAM,EAAEC,QAAQ,EAAE,GAAGC,IAAAA,6BAAe;IACpC,MAAMC,mBAAmBC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,IAAI,CAACH,gBAAgB;IACrF,MAAMI,gBAAgBH,IAAAA,4CAA2B,EAAC,CAACC,MAAMJ,WAAWI,IAAIC,IAAI,CAACE,gBAAgB,CAACT,YAAYU;IAC1G,MAAMC,mBAAmBN,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIK,gBAAgB;IAChF,MAAMC,eAAeP,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIO,qBAAqB;IACjF,kFAAkF;IAClF,MAAMC,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC,gBAAgBC;QACpB,IAAIhB,UAAU;YACVE,iBAAiBY,GAAGhB;QACxB;QACCiB,CAAAA,iBAAiB,AAACC,CAAAA,SAASpB,KAAI,EAAGgB,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,IAAI,CAACD,QAAQF;IAC7H;IACA,OAAOI,IAAAA,+CAA2B,EAAC;QAC/BZ;QACAa,IAAI;QACJC,UAAUpB,WAAWQ,YAAY;QACjC,GAAGC,mBAAmBC,aAAaW,uBAAuB,CAACvB,YAAY,CAAC,CAAC;QACzE,GAAGF,KAAK;QACRgB;IACJ,GAAGf;AACP"}
+{"version":3,"sources":["useDataGridHeaderCell.js"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { useTableHeaderCell_unstable } from '../TableHeaderCell/useTableHeaderCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useColumnIdContext } from '../../contexts/columnIdContext';\nimport { useTableContext } from '../../contexts/tableContext';\nimport { isColumnSortable } from '../../utils/isColumnSortable';\n/**\n * Create the state required to render DataGridHeaderCell.\n *\n * The returned state can be modified with hooks such as useDataGridHeaderCellStyles_unstable,\n * before being passed to renderDataGridHeaderCell_unstable.\n *\n * @param props - props from this instance of DataGridHeaderCell\n * @param ref - reference to root HTMLElement of DataGridHeaderCell\n */ export const useDataGridHeaderCell_unstable = (props, ref)=>{\n    const columnId = useColumnIdContext();\n    const { sortable: gridSortable } = useTableContext();\n    const toggleColumnSort = useDataGridContext_unstable((ctx)=>ctx.sort.toggleColumnSort);\n    const sortable = useDataGridContext_unstable((ctx)=>{\n        const columnSortable = !!ctx.columns.find((c)=>c.columnId === columnId && isColumnSortable(c));\n        if (!gridSortable) {\n            // if the grid is not sortable - disable sorting on all columns\n            return false;\n        }\n        return columnSortable;\n    });\n    const sortDirection = useDataGridContext_unstable((ctx)=>sortable ? ctx.sort.getSortDirection(columnId) : undefined);\n    const resizableColumns = useDataGridContext_unstable((ctx)=>ctx.resizableColumns);\n    const columnSizing = useDataGridContext_unstable((ctx)=>ctx.columnSizing_unstable);\n    // eslint-disable-next-line deprecation/deprecation -- prefer HTMLTableCellElement\n    const onClick = useEventCallback((e)=>{\n        var _props_onClick;\n        if (sortable) {\n            toggleColumnSort(e, columnId);\n        }\n        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);\n    });\n    return useTableHeaderCell_unstable({\n        sortable,\n        sortDirection,\n        as: 'div',\n        tabIndex: sortable ? undefined : 0,\n        ...resizableColumns ? columnSizing.getTableHeaderCellProps(columnId) : {},\n        ...props,\n        onClick\n    }, ref);\n};\n"],"names":["useDataGridHeaderCell_unstable","props","ref","columnId","useColumnIdContext","sortable","gridSortable","useTableContext","toggleColumnSort","useDataGridContext_unstable","ctx","sort","columnSortable","columns","find","c","isColumnSortable","sortDirection","getSortDirection","undefined","resizableColumns","columnSizing","columnSizing_unstable","onClick","useEventCallback","e","_props_onClick","call","useTableHeaderCell_unstable","as","tabIndex","getTableHeaderCellProps"],"mappings":";;;;+BAeiBA;;;eAAAA;;;;iEAfM;gCACU;oCACW;iCACA;iCACT;8BACH;kCACC;AAStB,MAAMA,iCAAiC,CAACC,OAAOC;IACtD,MAAMC,WAAWC,IAAAA,mCAAkB;IACnC,MAAM,EAAEC,UAAUC,YAAY,EAAE,GAAGC,IAAAA,6BAAe;IAClD,MAAMC,mBAAmBC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,IAAI,CAACH,gBAAgB;IACrF,MAAMH,WAAWI,IAAAA,4CAA2B,EAAC,CAACC;QAC1C,MAAME,iBAAiB,CAAC,CAACF,IAAIG,OAAO,CAACC,IAAI,CAAC,CAACC,IAAIA,EAAEZ,QAAQ,KAAKA,YAAYa,IAAAA,kCAAgB,EAACD;QAC3F,IAAI,CAACT,cAAc;YACf,+DAA+D;YAC/D,OAAO;QACX;QACA,OAAOM;IACX;IACA,MAAMK,gBAAgBR,IAAAA,4CAA2B,EAAC,CAACC,MAAML,WAAWK,IAAIC,IAAI,CAACO,gBAAgB,CAACf,YAAYgB;IAC1G,MAAMC,mBAAmBX,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIU,gBAAgB;IAChF,MAAMC,eAAeZ,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIY,qBAAqB;IACjF,kFAAkF;IAClF,MAAMC,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC;QACJ,IAAIrB,UAAU;YACVG,iBAAiBiB,GAAGtB;QACxB;QACCuB,CAAAA,iBAAiBzB,MAAMsB,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeC,IAAI,CAAC1B,OAAOwB;IACjH;IACA,OAAOG,IAAAA,+CAA2B,EAAC;QAC/BvB;QACAY;QACAY,IAAI;QACJC,UAAUzB,WAAWc,YAAY;QACjC,GAAGC,mBAAmBC,aAAaU,uBAAuB,CAAC5B,YAAY,CAAC,CAAC;QACzE,GAAGF,KAAK;QACRsB;IACJ,GAAGrB;AACP"}

package/lib-commonjs/components/DataGridRow/useDataGridRow.js

@@ -35,20 +35,20 @@ const useDataGridRow_unstable = (props, ref)=>{
     const toggleRow = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.selection.toggleRow);
     const dataGridContextValue = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx);
     const onClick = (0, _reactutilities.useEventCallback)((e)=>{
-        var _props_onClick, _props;
+        var _props_onClick;
         if (selectable && !isHeader) {
             toggleRow(e, rowId);
         }
-        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, e);
+        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);
     });
     const onKeyDown = (0, _reactutilities.useEventCallback)((e)=>{
-        var _props_onKeyDown, _props;
+        var _props_onKeyDown;
         if (selectable && !isHeader && e.key === _keyboardkeys.Space && !(0, _reactutilities.isInteractiveHTMLElement)(e.target)) {
             // stop scrolling
             e.preventDefault();
             toggleRow(e, rowId);
         }
-        (_props_onKeyDown = (_props = props).onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(_props, e);
+        (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);
     });
     const baseState = (0, _useTableRow.useTableRow_unstable)({
         appearance,

package/lib-commonjs/components/DataGridRow/useDataGridRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridRow.js"],"sourcesContent":["import * as React from 'react';\nimport { isInteractiveHTMLElement, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { useTableRow_unstable } from '../TableRow/useTableRow';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { DataGridSelectionCell } from '../DataGridSelectionCell/DataGridSelectionCell';\nimport { useTableRowIdContext } from '../../contexts/rowIdContext';\nimport { useIsInTableHeader } from '../../contexts/tableHeaderContext';\n/**\n * Create the state required to render DataGridRow.\n *\n * The returned state can be modified with hooks such as useDataGridRowStyles_unstable,\n * before being passed to renderDataGridRow_unstable.\n *\n * @param props - props from this instance of DataGridRow\n * @param ref - reference to root HTMLElement of DataGridRow\n */ export const useDataGridRow_unstable = (props, ref)=>{\n    const rowId = useTableRowIdContext();\n    const isHeader = useIsInTableHeader();\n    const columnDefs = useDataGridContext_unstable((ctx)=>ctx.columns);\n    const selectable = useDataGridContext_unstable((ctx)=>ctx.selectableRows);\n    const selected = useDataGridContext_unstable((ctx)=>ctx.selection.isRowSelected(rowId));\n    const focusMode = useDataGridContext_unstable((ctx)=>ctx.focusMode);\n    const compositeRowTabsterAttribute = useDataGridContext_unstable((ctx)=>ctx.compositeRowTabsterAttribute);\n    const tabbable = focusMode === 'row_unstable' || focusMode === 'composite';\n    const appearance = useDataGridContext_unstable((ctx)=>{\n        if (!isHeader && selectable && ctx.selection.isRowSelected(rowId)) {\n            return ctx.selectionAppearance;\n        }\n        return 'none';\n    });\n    const toggleRow = useDataGridContext_unstable((ctx)=>ctx.selection.toggleRow);\n    const dataGridContextValue = useDataGridContext_unstable((ctx)=>ctx);\n    const onClick = useEventCallback((e)=>{\n        var _props_onClick, _props;\n        if (selectable && !isHeader) {\n            toggleRow(e, rowId);\n        }\n        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, e);\n    });\n    const onKeyDown = useEventCallback((e)=>{\n        var _props_onKeyDown, _props;\n        if (selectable && !isHeader && e.key === Space && !isInteractiveHTMLElement(e.target)) {\n            // stop scrolling\n            e.preventDefault();\n            toggleRow(e, rowId);\n        }\n        (_props_onKeyDown = (_props = props).onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(_props, e);\n    });\n    const baseState = useTableRow_unstable({\n        appearance,\n        'aria-selected': selectable ? selected : undefined,\n        tabIndex: tabbable && !isHeader ? 0 : undefined,\n        ...focusMode === 'composite' && !isHeader && compositeRowTabsterAttribute,\n        ...props,\n        onClick,\n        onKeyDown,\n        children: null,\n        as: 'div'\n    }, ref);\n    return {\n        ...baseState,\n        components: {\n            ...baseState.components,\n            selectionCell: DataGridSelectionCell\n        },\n        selectionCell: slot.optional(props.selectionCell, {\n            renderByDefault: selectable,\n            elementType: DataGridSelectionCell\n        }),\n        renderCell: props.children,\n        columnDefs,\n        dataGridContextValue\n    };\n};\n"],"names":["useDataGridRow_unstable","props","ref","rowId","useTableRowIdContext","isHeader","useIsInTableHeader","columnDefs","useDataGridContext_unstable","ctx","columns","selectable","selectableRows","selected","selection","isRowSelected","focusMode","compositeRowTabsterAttribute","tabbable","appearance","selectionAppearance","toggleRow","dataGridContextValue","onClick","useEventCallback","e","_props_onClick","_props","call","onKeyDown","_props_onKeyDown","key","Space","isInteractiveHTMLElement","target","preventDefault","baseState","useTableRow_unstable","undefined","tabIndex","children","as","components","selectionCell","DataGridSelectionCell","slot","optional","renderByDefault","elementType","renderCell"],"mappings":";;;;+BAgBiBA;;;eAAAA;;;;iEAhBM;gCAC0C;8BAC3C;6BACe;iCACO;uCACN;8BACD;oCACF;AASxB,MAAMA,0BAA0B,CAACC,OAAOC;IAC/C,MAAMC,QAAQC,IAAAA,kCAAoB;IAClC,MAAMC,WAAWC,IAAAA,sCAAkB;IACnC,MAAMC,aAAaC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,OAAO;IACjE,MAAMC,aAAaH,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,cAAc;IACxE,MAAMC,WAAWL,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIK,SAAS,CAACC,aAAa,CAACZ;IAChF,MAAMa,YAAYR,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIO,SAAS;IAClE,MAAMC,+BAA+BT,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIQ,4BAA4B;IACxG,MAAMC,WAAWF,cAAc,kBAAkBA,cAAc;IAC/D,MAAMG,aAAaX,IAAAA,4CAA2B,EAAC,CAACC;QAC5C,IAAI,CAACJ,YAAYM,cAAcF,IAAIK,SAAS,CAACC,aAAa,CAACZ,QAAQ;YAC/D,OAAOM,IAAIW,mBAAmB;QAClC;QACA,OAAO;IACX;IACA,MAAMC,YAAYb,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIK,SAAS,CAACO,SAAS;IAC5E,MAAMC,uBAAuBd,IAAAA,4CAA2B,EAAC,CAACC,MAAMA;IAChE,MAAMc,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC,gBAAgBC;QACpB,IAAIhB,cAAc,CAACN,UAAU;YACzBgB,UAAUI,GAAGtB;QACjB;QACCuB,CAAAA,iBAAiB,AAACC,CAAAA,SAAS1B,KAAI,EAAGsB,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,IAAI,CAACD,QAAQF;IAC7H;IACA,MAAMI,YAAYL,IAAAA,gCAAgB,EAAC,CAACC;QAChC,IAAIK,kBAAkBH;QACtB,IAAIhB,cAAc,CAACN,YAAYoB,EAAEM,GAAG,KAAKC,mBAAK,IAAI,CAACC,IAAAA,wCAAwB,EAACR,EAAES,MAAM,GAAG;YACnF,iBAAiB;YACjBT,EAAEU,cAAc;YAChBd,UAAUI,GAAGtB;QACjB;QACC2B,CAAAA,mBAAmB,AAACH,CAAAA,SAAS1B,KAAI,EAAG4B,SAAS,AAAD,MAAO,QAAQC,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBF,IAAI,CAACD,QAAQF;IACrI;IACA,MAAMW,YAAYC,IAAAA,iCAAoB,EAAC;QACnClB;QACA,iBAAiBR,aAAaE,WAAWyB;QACzCC,UAAUrB,YAAY,CAACb,WAAW,IAAIiC;QACtC,GAAGtB,cAAc,eAAe,CAACX,YAAYY,4BAA4B;QACzE,GAAGhB,KAAK;QACRsB;QACAM;QACAW,UAAU;QACVC,IAAI;IACR,GAAGvC;IACH,OAAO;QACH,GAAGkC,SAAS;QACZM,YAAY;YACR,GAAGN,UAAUM,UAAU;YACvBC,eAAeC,4CAAqB;QACxC;QACAD,eAAeE,oBAAI,CAACC,QAAQ,CAAC7C,MAAM0C,aAAa,EAAE;YAC9CI,iBAAiBpC;YACjBqC,aAAaJ,4CAAqB;QACtC;QACAK,YAAYhD,MAAMuC,QAAQ;QAC1BjC;QACAe;IACJ;AACJ"}
+{"version":3,"sources":["useDataGridRow.js"],"sourcesContent":["import * as React from 'react';\nimport { isInteractiveHTMLElement, useEventCallback, slot } from '@fluentui/react-utilities';\nimport { Space } from '@fluentui/keyboard-keys';\nimport { useTableRow_unstable } from '../TableRow/useTableRow';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { DataGridSelectionCell } from '../DataGridSelectionCell/DataGridSelectionCell';\nimport { useTableRowIdContext } from '../../contexts/rowIdContext';\nimport { useIsInTableHeader } from '../../contexts/tableHeaderContext';\n/**\n * Create the state required to render DataGridRow.\n *\n * The returned state can be modified with hooks such as useDataGridRowStyles_unstable,\n * before being passed to renderDataGridRow_unstable.\n *\n * @param props - props from this instance of DataGridRow\n * @param ref - reference to root HTMLElement of DataGridRow\n */ export const useDataGridRow_unstable = (props, ref)=>{\n    const rowId = useTableRowIdContext();\n    const isHeader = useIsInTableHeader();\n    const columnDefs = useDataGridContext_unstable((ctx)=>ctx.columns);\n    const selectable = useDataGridContext_unstable((ctx)=>ctx.selectableRows);\n    const selected = useDataGridContext_unstable((ctx)=>ctx.selection.isRowSelected(rowId));\n    const focusMode = useDataGridContext_unstable((ctx)=>ctx.focusMode);\n    const compositeRowTabsterAttribute = useDataGridContext_unstable((ctx)=>ctx.compositeRowTabsterAttribute);\n    const tabbable = focusMode === 'row_unstable' || focusMode === 'composite';\n    const appearance = useDataGridContext_unstable((ctx)=>{\n        if (!isHeader && selectable && ctx.selection.isRowSelected(rowId)) {\n            return ctx.selectionAppearance;\n        }\n        return 'none';\n    });\n    const toggleRow = useDataGridContext_unstable((ctx)=>ctx.selection.toggleRow);\n    const dataGridContextValue = useDataGridContext_unstable((ctx)=>ctx);\n    const onClick = useEventCallback((e)=>{\n        var _props_onClick;\n        if (selectable && !isHeader) {\n            toggleRow(e, rowId);\n        }\n        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);\n    });\n    const onKeyDown = useEventCallback((e)=>{\n        var _props_onKeyDown;\n        if (selectable && !isHeader && e.key === Space && !isInteractiveHTMLElement(e.target)) {\n            // stop scrolling\n            e.preventDefault();\n            toggleRow(e, rowId);\n        }\n        (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);\n    });\n    const baseState = useTableRow_unstable({\n        appearance,\n        'aria-selected': selectable ? selected : undefined,\n        tabIndex: tabbable && !isHeader ? 0 : undefined,\n        ...focusMode === 'composite' && !isHeader && compositeRowTabsterAttribute,\n        ...props,\n        onClick,\n        onKeyDown,\n        children: null,\n        as: 'div'\n    }, ref);\n    return {\n        ...baseState,\n        components: {\n            ...baseState.components,\n            selectionCell: DataGridSelectionCell\n        },\n        selectionCell: slot.optional(props.selectionCell, {\n            renderByDefault: selectable,\n            elementType: DataGridSelectionCell\n        }),\n        renderCell: props.children,\n        columnDefs,\n        dataGridContextValue\n    };\n};\n"],"names":["useDataGridRow_unstable","props","ref","rowId","useTableRowIdContext","isHeader","useIsInTableHeader","columnDefs","useDataGridContext_unstable","ctx","columns","selectable","selectableRows","selected","selection","isRowSelected","focusMode","compositeRowTabsterAttribute","tabbable","appearance","selectionAppearance","toggleRow","dataGridContextValue","onClick","useEventCallback","e","_props_onClick","call","onKeyDown","_props_onKeyDown","key","Space","isInteractiveHTMLElement","target","preventDefault","baseState","useTableRow_unstable","undefined","tabIndex","children","as","components","selectionCell","DataGridSelectionCell","slot","optional","renderByDefault","elementType","renderCell"],"mappings":";;;;+BAgBiBA;;;eAAAA;;;;iEAhBM;gCAC0C;8BAC3C;6BACe;iCACO;uCACN;8BACD;oCACF;AASxB,MAAMA,0BAA0B,CAACC,OAAOC;IAC/C,MAAMC,QAAQC,IAAAA,kCAAoB;IAClC,MAAMC,WAAWC,IAAAA,sCAAkB;IACnC,MAAMC,aAAaC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,OAAO;IACjE,MAAMC,aAAaH,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,cAAc;IACxE,MAAMC,WAAWL,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIK,SAAS,CAACC,aAAa,CAACZ;IAChF,MAAMa,YAAYR,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIO,SAAS;IAClE,MAAMC,+BAA+BT,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIQ,4BAA4B;IACxG,MAAMC,WAAWF,cAAc,kBAAkBA,cAAc;IAC/D,MAAMG,aAAaX,IAAAA,4CAA2B,EAAC,CAACC;QAC5C,IAAI,CAACJ,YAAYM,cAAcF,IAAIK,SAAS,CAACC,aAAa,CAACZ,QAAQ;YAC/D,OAAOM,IAAIW,mBAAmB;QAClC;QACA,OAAO;IACX;IACA,MAAMC,YAAYb,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIK,SAAS,CAACO,SAAS;IAC5E,MAAMC,uBAAuBd,IAAAA,4CAA2B,EAAC,CAACC,MAAMA;IAChE,MAAMc,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC;QACJ,IAAIf,cAAc,CAACN,UAAU;YACzBgB,UAAUI,GAAGtB;QACjB;QACCuB,CAAAA,iBAAiBzB,MAAMsB,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeC,IAAI,CAAC1B,OAAOwB;IACjH;IACA,MAAMG,YAAYJ,IAAAA,gCAAgB,EAAC,CAACC;QAChC,IAAII;QACJ,IAAIlB,cAAc,CAACN,YAAYoB,EAAEK,GAAG,KAAKC,mBAAK,IAAI,CAACC,IAAAA,wCAAwB,EAACP,EAAEQ,MAAM,GAAG;YACnF,iBAAiB;YACjBR,EAAES,cAAc;YAChBb,UAAUI,GAAGtB;QACjB;QACC0B,CAAAA,mBAAmB5B,MAAM2B,SAAS,AAAD,MAAO,QAAQC,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBF,IAAI,CAAC1B,OAAOwB;IACzH;IACA,MAAMU,YAAYC,IAAAA,iCAAoB,EAAC;QACnCjB;QACA,iBAAiBR,aAAaE,WAAWwB;QACzCC,UAAUpB,YAAY,CAACb,WAAW,IAAIgC;QACtC,GAAGrB,cAAc,eAAe,CAACX,YAAYY,4BAA4B;QACzE,GAAGhB,KAAK;QACRsB;QACAK;QACAW,UAAU;QACVC,IAAI;IACR,GAAGtC;IACH,OAAO;QACH,GAAGiC,SAAS;QACZM,YAAY;YACR,GAAGN,UAAUM,UAAU;YACvBC,eAAeC,4CAAqB;QACxC;QACAD,eAAeE,oBAAI,CAACC,QAAQ,CAAC5C,MAAMyC,aAAa,EAAE;YAC9CI,iBAAiBnC;YACjBoC,aAAaJ,4CAAqB;QACtC;QACAK,YAAY/C,MAAMsC,QAAQ;QAC1BhC;QACAe;IACJ;AACJ"}

package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCell.js

@@ -28,11 +28,11 @@ const useDataGridSelectionCell_unstable = (props, ref)=>{
     const toggleAllRows = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.selection.toggleAllRows);
     const type = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.selection.selectionMode === 'multiselect' ? 'checkbox' : 'radio');
     const onClick = (0, _reactutilities.useEventCallback)((e)=>{
-        var _props_onClick, _props;
+        var _props_onClick;
         if (isHeader) {
             toggleAllRows(e);
         }
-        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, e);
+        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);
     });
     return (0, _useTableSelectionCell.useTableSelectionCell_unstable)({
         as: 'div',

package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useDataGridSelectionCell.js"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useTableRowIdContext } from '../../contexts/rowIdContext';\nimport { useIsInTableHeader } from '../../contexts/tableHeaderContext';\nimport { useTableSelectionCell_unstable } from '../TableSelectionCell/useTableSelectionCell';\n/**\n * Create the state required to render DataGridSelectionCell.\n *\n * The returned state can be modified with hooks such as useDataGridSelectionCellStyles_unstable,\n * before being passed to renderDataGridSelectionCell_unstable.\n *\n * @param props - props from this instance of DataGridSelectionCell\n * @param ref - reference to root HTMLElement of DataGridSelectionCell\n */ export const useDataGridSelectionCell_unstable = (props, ref)=>{\n    const isHeader = useIsInTableHeader();\n    const rowId = useTableRowIdContext();\n    const subtle = useDataGridContext_unstable((ctx)=>ctx.subtleSelection);\n    const checked = useDataGridContext_unstable((ctx)=>{\n        if (isHeader && ctx.selection.selectionMode === 'multiselect') {\n            return ctx.selection.allRowsSelected ? true : ctx.selection.someRowsSelected ? 'mixed' : false;\n        }\n        return ctx.selection.isRowSelected(rowId);\n    });\n    const toggleAllRows = useDataGridContext_unstable((ctx)=>ctx.selection.toggleAllRows);\n    const type = useDataGridContext_unstable((ctx)=>ctx.selection.selectionMode === 'multiselect' ? 'checkbox' : 'radio');\n    const onClick = useEventCallback((e)=>{\n        var _props_onClick, _props;\n        if (isHeader) {\n            toggleAllRows(e);\n        }\n        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, e);\n    });\n    return useTableSelectionCell_unstable({\n        as: 'div',\n        role: 'gridcell',\n        checked,\n        type,\n        hidden: isHeader && type === 'radio',\n        'aria-checked': isHeader ? checked : undefined,\n        'aria-selected': isHeader || checked === 'mixed' ? undefined : checked,\n        subtle,\n        ...props,\n        onClick\n    }, ref);\n};\n"],"names":["useDataGridSelectionCell_unstable","props","ref","isHeader","useIsInTableHeader","rowId","useTableRowIdContext","subtle","useDataGridContext_unstable","ctx","subtleSelection","checked","selection","selectionMode","allRowsSelected","someRowsSelected","isRowSelected","toggleAllRows","type","onClick","useEventCallback","e","_props_onClick","_props","call","useTableSelectionCell_unstable","as","role","hidden","undefined"],"mappings":";;;;+BAciBA;;;eAAAA;;;;iEAdM;gCACU;iCACW;8BACP;oCACF;uCACY;AASpC,MAAMA,oCAAoC,CAACC,OAAOC;IACzD,MAAMC,WAAWC,IAAAA,sCAAkB;IACnC,MAAMC,QAAQC,IAAAA,kCAAoB;IAClC,MAAMC,SAASC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,eAAe;IACrE,MAAMC,UAAUH,IAAAA,4CAA2B,EAAC,CAACC;QACzC,IAAIN,YAAYM,IAAIG,SAAS,CAACC,aAAa,KAAK,eAAe;YAC3D,OAAOJ,IAAIG,SAAS,CAACE,eAAe,GAAG,OAAOL,IAAIG,SAAS,CAACG,gBAAgB,GAAG,UAAU;QAC7F;QACA,OAAON,IAAIG,SAAS,CAACI,aAAa,CAACX;IACvC;IACA,MAAMY,gBAAgBT,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,SAAS,CAACK,aAAa;IACpF,MAAMC,OAAOV,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,SAAS,CAACC,aAAa,KAAK,gBAAgB,aAAa;IAC7G,MAAMM,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC,gBAAgBC;QACpB,IAAIpB,UAAU;YACVc,cAAcI;QAClB;QACCC,CAAAA,iBAAiB,AAACC,CAAAA,SAAStB,KAAI,EAAGkB,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,IAAI,CAACD,QAAQF;IAC7H;IACA,OAAOI,IAAAA,qDAA8B,EAAC;QAClCC,IAAI;QACJC,MAAM;QACNhB;QACAO;QACAU,QAAQzB,YAAYe,SAAS;QAC7B,gBAAgBf,WAAWQ,UAAUkB;QACrC,iBAAiB1B,YAAYQ,YAAY,UAAUkB,YAAYlB;QAC/DJ;QACA,GAAGN,KAAK;QACRkB;IACJ,GAAGjB;AACP"}
+{"version":3,"sources":["useDataGridSelectionCell.js"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useTableRowIdContext } from '../../contexts/rowIdContext';\nimport { useIsInTableHeader } from '../../contexts/tableHeaderContext';\nimport { useTableSelectionCell_unstable } from '../TableSelectionCell/useTableSelectionCell';\n/**\n * Create the state required to render DataGridSelectionCell.\n *\n * The returned state can be modified with hooks such as useDataGridSelectionCellStyles_unstable,\n * before being passed to renderDataGridSelectionCell_unstable.\n *\n * @param props - props from this instance of DataGridSelectionCell\n * @param ref - reference to root HTMLElement of DataGridSelectionCell\n */ export const useDataGridSelectionCell_unstable = (props, ref)=>{\n    const isHeader = useIsInTableHeader();\n    const rowId = useTableRowIdContext();\n    const subtle = useDataGridContext_unstable((ctx)=>ctx.subtleSelection);\n    const checked = useDataGridContext_unstable((ctx)=>{\n        if (isHeader && ctx.selection.selectionMode === 'multiselect') {\n            return ctx.selection.allRowsSelected ? true : ctx.selection.someRowsSelected ? 'mixed' : false;\n        }\n        return ctx.selection.isRowSelected(rowId);\n    });\n    const toggleAllRows = useDataGridContext_unstable((ctx)=>ctx.selection.toggleAllRows);\n    const type = useDataGridContext_unstable((ctx)=>ctx.selection.selectionMode === 'multiselect' ? 'checkbox' : 'radio');\n    const onClick = useEventCallback((e)=>{\n        var _props_onClick;\n        if (isHeader) {\n            toggleAllRows(e);\n        }\n        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, e);\n    });\n    return useTableSelectionCell_unstable({\n        as: 'div',\n        role: 'gridcell',\n        checked,\n        type,\n        hidden: isHeader && type === 'radio',\n        'aria-checked': isHeader ? checked : undefined,\n        'aria-selected': isHeader || checked === 'mixed' ? undefined : checked,\n        subtle,\n        ...props,\n        onClick\n    }, ref);\n};\n"],"names":["useDataGridSelectionCell_unstable","props","ref","isHeader","useIsInTableHeader","rowId","useTableRowIdContext","subtle","useDataGridContext_unstable","ctx","subtleSelection","checked","selection","selectionMode","allRowsSelected","someRowsSelected","isRowSelected","toggleAllRows","type","onClick","useEventCallback","e","_props_onClick","call","useTableSelectionCell_unstable","as","role","hidden","undefined"],"mappings":";;;;+BAciBA;;;eAAAA;;;;iEAdM;gCACU;iCACW;8BACP;oCACF;uCACY;AASpC,MAAMA,oCAAoC,CAACC,OAAOC;IACzD,MAAMC,WAAWC,IAAAA,sCAAkB;IACnC,MAAMC,QAAQC,IAAAA,kCAAoB;IAClC,MAAMC,SAASC,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIC,eAAe;IACrE,MAAMC,UAAUH,IAAAA,4CAA2B,EAAC,CAACC;QACzC,IAAIN,YAAYM,IAAIG,SAAS,CAACC,aAAa,KAAK,eAAe;YAC3D,OAAOJ,IAAIG,SAAS,CAACE,eAAe,GAAG,OAAOL,IAAIG,SAAS,CAACG,gBAAgB,GAAG,UAAU;QAC7F;QACA,OAAON,IAAIG,SAAS,CAACI,aAAa,CAACX;IACvC;IACA,MAAMY,gBAAgBT,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,SAAS,CAACK,aAAa;IACpF,MAAMC,OAAOV,IAAAA,4CAA2B,EAAC,CAACC,MAAMA,IAAIG,SAAS,CAACC,aAAa,KAAK,gBAAgB,aAAa;IAC7G,MAAMM,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC;QACJ,IAAInB,UAAU;YACVc,cAAcI;QAClB;QACCC,CAAAA,iBAAiBrB,MAAMkB,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeC,IAAI,CAACtB,OAAOoB;IACjH;IACA,OAAOG,IAAAA,qDAA8B,EAAC;QAClCC,IAAI;QACJC,MAAM;QACNf;QACAO;QACAS,QAAQxB,YAAYe,SAAS;QAC7B,gBAAgBf,WAAWQ,UAAUiB;QACrC,iBAAiBzB,YAAYQ,YAAY,UAAUiB,YAAYjB;QAC/DJ;QACA,GAAGN,KAAK;QACRkB;IACJ,GAAGjB;AACP"}

package/lib-commonjs/components/TableHeaderCell/useTableHeaderCell.js

@@ -24,7 +24,8 @@ const sortIcons = {
     })
 };
 const useTableHeaderCell_unstable = (props, ref)=>{
-    const { noNativeElements, sortable } = (0, _tableContext.useTableContext)();
+    const { noNativeElements, sortable: contextSortable } = (0, _tableContext.useTableContext)();
+    const { sortable = contextSortable } = props;
     var _props_as;
     const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'th';
     var _props_sortDirection;

package/lib-commonjs/components/TableHeaderCell/useTableHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableHeaderCell.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { ArrowUpRegular, ArrowDownRegular } from '@fluentui/react-icons';\nimport { useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { useTableContext } from '../../contexts/tableContext';\nconst sortIcons = {\n    ascending: /*#__PURE__*/ React.createElement(ArrowUpRegular, {\n        fontSize: 12\n    }),\n    descending: /*#__PURE__*/ React.createElement(ArrowDownRegular, {\n        fontSize: 12\n    })\n};\n/**\n * Create the state required to render TableHeaderCell.\n *\n * The returned state can be modified with hooks such as useTableHeaderCellStyles_unstable,\n * before being passed to renderTableHeaderCell_unstable.\n *\n * @param props - props from this instance of TableHeaderCell\n * @param ref - reference to root HTMLElement of TableHeaderCell\n */ export const useTableHeaderCell_unstable = (props, ref)=>{\n    const { noNativeElements, sortable } = useTableContext();\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'th';\n    var _props_sortDirection;\n    return {\n        components: {\n            root: rootComponent,\n            button: 'div',\n            sortIcon: 'span',\n            aside: 'span'\n        },\n        root: slot.always(getNativeElementProps(rootComponent, {\n            ref: useMergedRefs(ref, useFocusWithin()),\n            role: rootComponent === 'div' ? 'columnheader' : undefined,\n            'aria-sort': sortable ? (_props_sortDirection = props.sortDirection) !== null && _props_sortDirection !== void 0 ? _props_sortDirection : 'none' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        aside: slot.optional(props.aside, {\n            elementType: 'span'\n        }),\n        sortIcon: slot.optional(props.sortIcon, {\n            renderByDefault: !!props.sortDirection,\n            defaultProps: {\n                children: props.sortDirection ? sortIcons[props.sortDirection] : undefined\n            },\n            elementType: 'span'\n        }),\n        button: slot.always(useARIAButtonShorthand(props.button, {\n            required: true,\n            defaultProps: {\n                as: 'div',\n                ...!sortable && {\n                    role: 'presentation',\n                    tabIndex: undefined\n                }\n            }\n        }), {\n            elementType: 'div'\n        }),\n        sortable,\n        noNativeElements\n    };\n};\n"],"names":["useTableHeaderCell_unstable","sortIcons","ascending","React","createElement","ArrowUpRegular","fontSize","descending","ArrowDownRegular","props","ref","noNativeElements","sortable","useTableContext","_props_as","rootComponent","as","_props_sortDirection","components","root","button","sortIcon","aside","slot","always","getNativeElementProps","useMergedRefs","useFocusWithin","role","undefined","sortDirection","elementType","optional","renderByDefault","defaultProps","children","useARIAButtonShorthand","required","tabIndex"],"mappings":";;;;+BAsBiBA;;;eAAAA;;;;iEAtBM;gCACoC;8BAC5B;4BACkB;2BACV;8BACP;AAChC,MAAMC,YAAY;IACdC,WAAW,WAAW,GAAGC,OAAMC,aAAa,CAACC,0BAAc,EAAE;QACzDC,UAAU;IACd;IACAC,YAAY,WAAW,GAAGJ,OAAMC,aAAa,CAACI,4BAAgB,EAAE;QAC5DF,UAAU;IACd;AACJ;AASW,MAAMN,8BAA8B,CAACS,OAAOC;IACnD,MAAM,EAAEC,gBAAgB,EAAEC,QAAQ,EAAE,GAAGC,IAAAA,6BAAe;IACtD,IAAIC;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYL,MAAMO,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYH,gBAAe,IAAK,QAAQ;IACzH,IAAIM;IACJ,OAAO;QACHC,YAAY;YACRC,MAAMJ;YACNK,QAAQ;YACRC,UAAU;YACVC,OAAO;QACX;QACAH,MAAMI,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACV,eAAe;YACnDL,KAAKgB,IAAAA,6BAAa,EAAChB,KAAKiB,IAAAA,4BAAc;YACtCC,MAAMb,kBAAkB,QAAQ,iBAAiBc;YACjD,aAAajB,WAAW,AAACK,CAAAA,uBAAuBR,MAAMqB,aAAa,AAAD,MAAO,QAAQb,yBAAyB,KAAK,IAAIA,uBAAuB,SAASY;YACnJ,GAAGpB,KAAK;QACZ,IAAI;YACAsB,aAAahB;QACjB;QACAO,OAAOC,oBAAI,CAACS,QAAQ,CAACvB,MAAMa,KAAK,EAAE;YAC9BS,aAAa;QACjB;QACAV,UAAUE,oBAAI,CAACS,QAAQ,CAACvB,MAAMY,QAAQ,EAAE;YACpCY,iBAAiB,CAAC,CAACxB,MAAMqB,aAAa;YACtCI,cAAc;gBACVC,UAAU1B,MAAMqB,aAAa,GAAG7B,SAAS,CAACQ,MAAMqB,aAAa,CAAC,GAAGD;YACrE;YACAE,aAAa;QACjB;QACAX,QAAQG,oBAAI,CAACC,MAAM,CAACY,IAAAA,iCAAsB,EAAC3B,MAAMW,MAAM,EAAE;YACrDiB,UAAU;YACVH,cAAc;gBACVlB,IAAI;gBACJ,GAAG,CAACJ,YAAY;oBACZgB,MAAM;oBACNU,UAAUT;gBACd,CAAC;YACL;QACJ,IAAI;YACAE,aAAa;QACjB;QACAnB;QACAD;IACJ;AACJ"}
+{"version":3,"sources":["useTableHeaderCell.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport { ArrowUpRegular, ArrowDownRegular } from '@fluentui/react-icons';\nimport { useARIAButtonShorthand } from '@fluentui/react-aria';\nimport { useTableContext } from '../../contexts/tableContext';\nconst sortIcons = {\n    ascending: /*#__PURE__*/ React.createElement(ArrowUpRegular, {\n        fontSize: 12\n    }),\n    descending: /*#__PURE__*/ React.createElement(ArrowDownRegular, {\n        fontSize: 12\n    })\n};\n/**\n * Create the state required to render TableHeaderCell.\n *\n * The returned state can be modified with hooks such as useTableHeaderCellStyles_unstable,\n * before being passed to renderTableHeaderCell_unstable.\n *\n * @param props - props from this instance of TableHeaderCell\n * @param ref - reference to root HTMLElement of TableHeaderCell\n */ export const useTableHeaderCell_unstable = (props, ref)=>{\n    const { noNativeElements, sortable: contextSortable } = useTableContext();\n    const { sortable = contextSortable } = props;\n    var _props_as;\n    const rootComponent = ((_props_as = props.as) !== null && _props_as !== void 0 ? _props_as : noNativeElements) ? 'div' : 'th';\n    var _props_sortDirection;\n    return {\n        components: {\n            root: rootComponent,\n            button: 'div',\n            sortIcon: 'span',\n            aside: 'span'\n        },\n        root: slot.always(getNativeElementProps(rootComponent, {\n            ref: useMergedRefs(ref, useFocusWithin()),\n            role: rootComponent === 'div' ? 'columnheader' : undefined,\n            'aria-sort': sortable ? (_props_sortDirection = props.sortDirection) !== null && _props_sortDirection !== void 0 ? _props_sortDirection : 'none' : undefined,\n            ...props\n        }), {\n            elementType: rootComponent\n        }),\n        aside: slot.optional(props.aside, {\n            elementType: 'span'\n        }),\n        sortIcon: slot.optional(props.sortIcon, {\n            renderByDefault: !!props.sortDirection,\n            defaultProps: {\n                children: props.sortDirection ? sortIcons[props.sortDirection] : undefined\n            },\n            elementType: 'span'\n        }),\n        button: slot.always(useARIAButtonShorthand(props.button, {\n            required: true,\n            defaultProps: {\n                as: 'div',\n                ...!sortable && {\n                    role: 'presentation',\n                    tabIndex: undefined\n                }\n            }\n        }), {\n            elementType: 'div'\n        }),\n        sortable,\n        noNativeElements\n    };\n};\n"],"names":["useTableHeaderCell_unstable","sortIcons","ascending","React","createElement","ArrowUpRegular","fontSize","descending","ArrowDownRegular","props","ref","noNativeElements","sortable","contextSortable","useTableContext","_props_as","rootComponent","as","_props_sortDirection","components","root","button","sortIcon","aside","slot","always","getNativeElementProps","useMergedRefs","useFocusWithin","role","undefined","sortDirection","elementType","optional","renderByDefault","defaultProps","children","useARIAButtonShorthand","required","tabIndex"],"mappings":";;;;+BAsBiBA;;;eAAAA;;;;iEAtBM;gCACoC;8BAC5B;4BACkB;2BACV;8BACP;AAChC,MAAMC,YAAY;IACdC,WAAW,WAAW,GAAGC,OAAMC,aAAa,CAACC,0BAAc,EAAE;QACzDC,UAAU;IACd;IACAC,YAAY,WAAW,GAAGJ,OAAMC,aAAa,CAACI,4BAAgB,EAAE;QAC5DF,UAAU;IACd;AACJ;AASW,MAAMN,8BAA8B,CAACS,OAAOC;IACnD,MAAM,EAAEC,gBAAgB,EAAEC,UAAUC,eAAe,EAAE,GAAGC,IAAAA,6BAAe;IACvE,MAAM,EAAEF,WAAWC,eAAe,EAAE,GAAGJ;IACvC,IAAIM;IACJ,MAAMC,gBAAgB,AAAC,CAAA,AAACD,CAAAA,YAAYN,MAAMQ,EAAE,AAAD,MAAO,QAAQF,cAAc,KAAK,IAAIA,YAAYJ,gBAAe,IAAK,QAAQ;IACzH,IAAIO;IACJ,OAAO;QACHC,YAAY;YACRC,MAAMJ;YACNK,QAAQ;YACRC,UAAU;YACVC,OAAO;QACX;QACAH,MAAMI,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACV,eAAe;YACnDN,KAAKiB,IAAAA,6BAAa,EAACjB,KAAKkB,IAAAA,4BAAc;YACtCC,MAAMb,kBAAkB,QAAQ,iBAAiBc;YACjD,aAAalB,WAAW,AAACM,CAAAA,uBAAuBT,MAAMsB,aAAa,AAAD,MAAO,QAAQb,yBAAyB,KAAK,IAAIA,uBAAuB,SAASY;YACnJ,GAAGrB,KAAK;QACZ,IAAI;YACAuB,aAAahB;QACjB;QACAO,OAAOC,oBAAI,CAACS,QAAQ,CAACxB,MAAMc,KAAK,EAAE;YAC9BS,aAAa;QACjB;QACAV,UAAUE,oBAAI,CAACS,QAAQ,CAACxB,MAAMa,QAAQ,EAAE;YACpCY,iBAAiB,CAAC,CAACzB,MAAMsB,aAAa;YACtCI,cAAc;gBACVC,UAAU3B,MAAMsB,aAAa,GAAG9B,SAAS,CAACQ,MAAMsB,aAAa,CAAC,GAAGD;YACrE;YACAE,aAAa;QACjB;QACAX,QAAQG,oBAAI,CAACC,MAAM,CAACY,IAAAA,iCAAsB,EAAC5B,MAAMY,MAAM,EAAE;YACrDiB,UAAU;YACVH,cAAc;gBACVlB,IAAI;gBACJ,GAAG,CAACL,YAAY;oBACZiB,MAAM;oBACNU,UAAUT;gBACd,CAAC;YACL;QACJ,IAAI;YACAE,aAAa;QACjB;QACApB;QACAD;IACJ;AACJ"}

package/lib-commonjs/components/TableResizeHandle/useTableResizeHandle.js

@@ -13,8 +13,8 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _reactutilities = require("@fluentui/react-utilities");
 const useTableResizeHandle_unstable = (props, ref)=>{
     const onClick = (0, _reactutilities.useEventCallback)((event)=>{
-        var _props_onClick, _props;
-        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, event);
+        var _props_onClick;
+        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);
         event.stopPropagation();
     });
     return {

package/lib-commonjs/components/TableResizeHandle/useTableResizeHandle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useTableResizeHandle.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render TableResizeHandle.\n *\n * The returned state can be modified with hooks such as useTableResizeHandleStyles_unstable,\n * before being passed to renderTableResizeHandle_unstable.\n *\n * @param props - props from this instance of TableResizeHandle\n * @param ref - reference to root HTMLElement of TableResizeHandle\n */ export const useTableResizeHandle_unstable = (props, ref)=>{\n    const onClick = useEventCallback((event)=>{\n        var _props_onClick, _props;\n        (_props_onClick = (_props = props).onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(_props, event);\n        event.stopPropagation();\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            ...props,\n            onClick\n        }), {\n            elementType: 'div'\n        })\n    };\n};\n"],"names":["useTableResizeHandle_unstable","props","ref","onClick","useEventCallback","event","_props_onClick","_props","call","stopPropagation","components","root","slot","always","getNativeElementProps","elementType"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;gCACuC;AASnD,MAAMA,gCAAgC,CAACC,OAAOC;IACrD,MAAMC,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC,gBAAgBC;QACnBD,CAAAA,iBAAiB,AAACC,CAAAA,SAASN,KAAI,EAAGE,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,IAAI,CAACD,QAAQF;QACzHA,MAAMI,eAAe;IACzB;IACA,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CZ;YACA,GAAGD,KAAK;YACRE;QACJ,IAAI;YACAY,aAAa;QACjB;IACJ;AACJ"}
+{"version":3,"sources":["useTableResizeHandle.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, slot } from '@fluentui/react-utilities';\n/**\n * Create the state required to render TableResizeHandle.\n *\n * The returned state can be modified with hooks such as useTableResizeHandleStyles_unstable,\n * before being passed to renderTableResizeHandle_unstable.\n *\n * @param props - props from this instance of TableResizeHandle\n * @param ref - reference to root HTMLElement of TableResizeHandle\n */ export const useTableResizeHandle_unstable = (props, ref)=>{\n    const onClick = useEventCallback((event)=>{\n        var _props_onClick;\n        (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, event);\n        event.stopPropagation();\n    });\n    return {\n        components: {\n            root: 'div'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref,\n            ...props,\n            onClick\n        }), {\n            elementType: 'div'\n        })\n    };\n};\n"],"names":["useTableResizeHandle_unstable","props","ref","onClick","useEventCallback","event","_props_onClick","call","stopPropagation","components","root","slot","always","getNativeElementProps","elementType"],"mappings":";;;;+BAUiBA;;;eAAAA;;;;iEAVM;gCACuC;AASnD,MAAMA,gCAAgC,CAACC,OAAOC;IACrD,MAAMC,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC;QACHA,CAAAA,iBAAiBL,MAAME,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeC,IAAI,CAACN,OAAOI;QAC7GA,MAAMG,eAAe;IACzB;IACA,OAAO;QACHC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CX;YACA,GAAGD,KAAK;YACRE;QACJ,IAAI;YACAW,aAAa;QACjB;IACJ;AACJ"}

package/lib-commonjs/contexts/columnIdContext.js

@@ -23,6 +23,8 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const columnIdContext = /*#__PURE__*/ _react.createContext(undefined);
 const columnIdContextDefaultValue = '';
-var _React_useContext;
-const useColumnIdContext = ()=>(_React_useContext = _react.useContext(columnIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : columnIdContextDefaultValue;
+const useColumnIdContext = ()=>{
+    var _React_useContext;
+    return (_React_useContext = _react.useContext(columnIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : columnIdContextDefaultValue;
+};
 const ColumnIdContextProvider = columnIdContext.Provider;

package/lib-commonjs/contexts/columnIdContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["columnIdContext.js"],"sourcesContent":["import * as React from 'react';\nconst columnIdContext = React.createContext(undefined);\nexport const columnIdContextDefaultValue = '';\nvar _React_useContext;\nexport const useColumnIdContext = ()=>(_React_useContext = React.useContext(columnIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : columnIdContextDefaultValue;\nexport const ColumnIdContextProvider = columnIdContext.Provider;\n"],"names":["columnIdContextDefaultValue","useColumnIdContext","ColumnIdContextProvider","columnIdContext","React","createContext","undefined","_React_useContext","useContext","Provider"],"mappings":";;;;;;;;;;;IAEaA,2BAA2B;eAA3BA;;IAEAC,kBAAkB;eAAlBA;;IACAC,uBAAuB;eAAvBA;;;;iEALU;AACvB,MAAMC,gCAAkBC,OAAMC,aAAa,CAACC;AACrC,MAAMN,8BAA8B;AAC3C,IAAIO;AACG,MAAMN,qBAAqB,IAAI,AAACM,CAAAA,oBAAoBH,OAAMI,UAAU,CAACL,gBAAe,MAAO,QAAQI,sBAAsB,KAAK,IAAIA,oBAAoBP;AACtJ,MAAME,0BAA0BC,gBAAgBM,QAAQ"}
+{"version":3,"sources":["columnIdContext.js"],"sourcesContent":["import * as React from 'react';\nconst columnIdContext = React.createContext(undefined);\nexport const columnIdContextDefaultValue = '';\nexport const useColumnIdContext = ()=>{\n    var _React_useContext;\n    return (_React_useContext = React.useContext(columnIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : columnIdContextDefaultValue;\n};\nexport const ColumnIdContextProvider = columnIdContext.Provider;\n"],"names":["columnIdContextDefaultValue","useColumnIdContext","ColumnIdContextProvider","columnIdContext","React","createContext","undefined","_React_useContext","useContext","Provider"],"mappings":";;;;;;;;;;;IAEaA,2BAA2B;eAA3BA;;IACAC,kBAAkB;eAAlBA;;IAIAC,uBAAuB;eAAvBA;;;;iEAPU;AACvB,MAAMC,gCAAkBC,OAAMC,aAAa,CAACC;AACrC,MAAMN,8BAA8B;AACpC,MAAMC,qBAAqB;IAC9B,IAAIM;IACJ,OAAO,AAACA,CAAAA,oBAAoBH,OAAMI,UAAU,CAACL,gBAAe,MAAO,QAAQI,sBAAsB,KAAK,IAAIA,oBAAoBP;AAClI;AACO,MAAME,0BAA0BC,gBAAgBM,QAAQ"}

package/lib-commonjs/contexts/rowIdContext.js

@@ -23,6 +23,8 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const rowIdContext = /*#__PURE__*/ _react.createContext(undefined);
 const tableRowIdContextDefaultValue = '';
-var _React_useContext;
-const useTableRowIdContext = ()=>(_React_useContext = _react.useContext(rowIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : tableRowIdContextDefaultValue;
+const useTableRowIdContext = ()=>{
+    var _React_useContext;
+    return (_React_useContext = _react.useContext(rowIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : tableRowIdContextDefaultValue;
+};
 const TableRowIdContextProvider = rowIdContext.Provider;

package/lib-commonjs/contexts/rowIdContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["rowIdContext.js"],"sourcesContent":["import * as React from 'react';\nconst rowIdContext = React.createContext(undefined);\nexport const tableRowIdContextDefaultValue = '';\nvar _React_useContext;\nexport const useTableRowIdContext = ()=>(_React_useContext = React.useContext(rowIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : tableRowIdContextDefaultValue;\nexport const TableRowIdContextProvider = rowIdContext.Provider;\n"],"names":["tableRowIdContextDefaultValue","useTableRowIdContext","TableRowIdContextProvider","rowIdContext","React","createContext","undefined","_React_useContext","useContext","Provider"],"mappings":";;;;;;;;;;;IAEaA,6BAA6B;eAA7BA;;IAEAC,oBAAoB;eAApBA;;IACAC,yBAAyB;eAAzBA;;;;iEALU;AACvB,MAAMC,6BAAeC,OAAMC,aAAa,CAACC;AAClC,MAAMN,gCAAgC;AAC7C,IAAIO;AACG,MAAMN,uBAAuB,IAAI,AAACM,CAAAA,oBAAoBH,OAAMI,UAAU,CAACL,aAAY,MAAO,QAAQI,sBAAsB,KAAK,IAAIA,oBAAoBP;AACrJ,MAAME,4BAA4BC,aAAaM,QAAQ"}
+{"version":3,"sources":["rowIdContext.js"],"sourcesContent":["import * as React from 'react';\nconst rowIdContext = React.createContext(undefined);\nexport const tableRowIdContextDefaultValue = '';\nexport const useTableRowIdContext = ()=>{\n    var _React_useContext;\n    return (_React_useContext = React.useContext(rowIdContext)) !== null && _React_useContext !== void 0 ? _React_useContext : tableRowIdContextDefaultValue;\n};\nexport const TableRowIdContextProvider = rowIdContext.Provider;\n"],"names":["tableRowIdContextDefaultValue","useTableRowIdContext","TableRowIdContextProvider","rowIdContext","React","createContext","undefined","_React_useContext","useContext","Provider"],"mappings":";;;;;;;;;;;IAEaA,6BAA6B;eAA7BA;;IACAC,oBAAoB;eAApBA;;IAIAC,yBAAyB;eAAzBA;;;;iEAPU;AACvB,MAAMC,6BAAeC,OAAMC,aAAa,CAACC;AAClC,MAAMN,gCAAgC;AACtC,MAAMC,uBAAuB;IAChC,IAAIM;IACJ,OAAO,AAACA,CAAAA,oBAAoBH,OAAMI,UAAU,CAACL,aAAY,MAAO,QAAQI,sBAAsB,KAAK,IAAIA,oBAAoBP;AAC/H;AACO,MAAME,4BAA4BC,aAAaM,QAAQ"}

package/lib-commonjs/contexts/tableContext.js

@@ -28,5 +28,7 @@ const tableContextDefaultValue = {
     sortable: false
 };
 const TableContextProvider = tableContext.Provider;
-var _React_useContext;
-const useTableContext = ()=>(_React_useContext = _react.useContext(tableContext)) !== null && _React_useContext !== void 0 ? _React_useContext : tableContextDefaultValue;
+const useTableContext = ()=>{
+    var _React_useContext;
+    return (_React_useContext = _react.useContext(tableContext)) !== null && _React_useContext !== void 0 ? _React_useContext : tableContextDefaultValue;
+};

package/lib-commonjs/contexts/tableContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["tableContext.js"],"sourcesContent":["import * as React from 'react';\nconst tableContext = React.createContext(undefined);\nexport const tableContextDefaultValue = {\n    size: 'medium',\n    noNativeElements: false,\n    sortable: false\n};\nexport const TableContextProvider = tableContext.Provider;\nvar _React_useContext;\nexport const useTableContext = ()=>(_React_useContext = React.useContext(tableContext)) !== null && _React_useContext !== void 0 ? _React_useContext : tableContextDefaultValue;\n"],"names":["tableContextDefaultValue","TableContextProvider","useTableContext","tableContext","React","createContext","undefined","size","noNativeElements","sortable","Provider","_React_useContext","useContext"],"mappings":";;;;;;;;;;;IAEaA,wBAAwB;eAAxBA;;IAKAC,oBAAoB;eAApBA;;IAEAC,eAAe;eAAfA;;;;iEATU;AACvB,MAAMC,6BAAeC,OAAMC,aAAa,CAACC;AAClC,MAAMN,2BAA2B;IACpCO,MAAM;IACNC,kBAAkB;IAClBC,UAAU;AACd;AACO,MAAMR,uBAAuBE,aAAaO,QAAQ;AACzD,IAAIC;AACG,MAAMT,kBAAkB,IAAI,AAACS,CAAAA,oBAAoBP,OAAMQ,UAAU,CAACT,aAAY,MAAO,QAAQQ,sBAAsB,KAAK,IAAIA,oBAAoBX"}
+{"version":3,"sources":["tableContext.js"],"sourcesContent":["import * as React from 'react';\nconst tableContext = React.createContext(undefined);\nexport const tableContextDefaultValue = {\n    size: 'medium',\n    noNativeElements: false,\n    sortable: false\n};\nexport const TableContextProvider = tableContext.Provider;\nexport const useTableContext = ()=>{\n    var _React_useContext;\n    return (_React_useContext = React.useContext(tableContext)) !== null && _React_useContext !== void 0 ? _React_useContext : tableContextDefaultValue;\n};\n"],"names":["tableContextDefaultValue","TableContextProvider","useTableContext","tableContext","React","createContext","undefined","size","noNativeElements","sortable","Provider","_React_useContext","useContext"],"mappings":";;;;;;;;;;;IAEaA,wBAAwB;eAAxBA;;IAKAC,oBAAoB;eAApBA;;IACAC,eAAe;eAAfA;;;;iEARU;AACvB,MAAMC,6BAAeC,OAAMC,aAAa,CAACC;AAClC,MAAMN,2BAA2B;IACpCO,MAAM;IACNC,kBAAkB;IAClBC,UAAU;AACd;AACO,MAAMR,uBAAuBE,aAAaO,QAAQ;AAClD,MAAMR,kBAAkB;IAC3B,IAAIS;IACJ,OAAO,AAACA,CAAAA,oBAAoBP,OAAMQ,UAAU,CAACT,aAAY,MAAO,QAAQQ,sBAAsB,KAAK,IAAIA,oBAAoBX;AAC/H"}

package/lib-commonjs/hooks/useKeyboardResizing.js

@@ -62,9 +62,9 @@ function useKeyboardResizing(columnResizeState) {
         }
     });
     const enableInteractiveMode = _react.useCallback((colId)=>{
-        var _onChangeRef_current, _onChangeRef, _resizeHandleRefs_get;
+        var _onChangeRef_current, _resizeHandleRefs_get;
         setColumnId(colId);
-        (_onChangeRef_current = (_onChangeRef = onChangeRef).current) === null || _onChangeRef_current === void 0 ? void 0 : _onChangeRef_current.call(_onChangeRef, colId, true);
+        (_onChangeRef_current = onChangeRef.current) === null || _onChangeRef_current === void 0 ? void 0 : _onChangeRef_current.call(onChangeRef, colId, true);
         const handle = (_resizeHandleRefs_get = resizeHandleRefs.get(colId)) === null || _resizeHandleRefs_get === void 0 ? void 0 : _resizeHandleRefs_get.current;
         if (handle) {
             handle.setAttribute('tabindex', '-1');
@@ -75,11 +75,11 @@ function useKeyboardResizing(columnResizeState) {
         resizeHandleRefs
     ]);
     const disableInteractiveMode = _react.useCallback(()=>{
-        var _onChangeRef_current, _onChangeRef, _resizeHandleRefs_get;
+        var _onChangeRef_current, _resizeHandleRefs_get;
         if (!columnId) {
             return;
         }
-        (_onChangeRef_current = (_onChangeRef = onChangeRef).current) === null || _onChangeRef_current === void 0 ? void 0 : _onChangeRef_current.call(_onChangeRef, columnId, false);
+        (_onChangeRef_current = onChangeRef.current) === null || _onChangeRef_current === void 0 ? void 0 : _onChangeRef_current.call(onChangeRef, columnId, false);
         // Find the previous focusable element (table header button) and focus it.
         const el = (_resizeHandleRefs_get = resizeHandleRefs.get(columnId)) === null || _resizeHandleRefs_get === void 0 ? void 0 : _resizeHandleRefs_get.current;
         if (el) {

package/lib-commonjs/hooks/useKeyboardResizing.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useKeyboardResizing.js"],"sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, ArrowRight, Enter, Escape, Shift, Space } from '@fluentui/keyboard-keys';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { useFocusFinders, useTabsterAttributes } from '@fluentui/react-tabster';\nconst STEP = 20;\nconst PRECISION_MODIFIER = Shift;\nconst PRECISION_FACTOR = 1 / 4;\nexport function useKeyboardResizing(columnResizeState) {\n    const [columnId, setColumnId] = React.useState();\n    const onChangeRef = React.useRef();\n    const { findPrevFocusable } = useFocusFinders();\n    const columnResizeStateRef = React.useRef(columnResizeState);\n    React.useEffect(()=>{\n        columnResizeStateRef.current = columnResizeState;\n    }, [\n        columnResizeState\n    ]);\n    const [resizeHandleRefs] = React.useState(()=>new Map());\n    const keyboardHandler = useEventCallback((event)=>{\n        if (!columnId) {\n            return;\n        }\n        const width = columnResizeStateRef.current.getColumnWidth(columnId);\n        const precisionModifier = event.getModifierState(PRECISION_MODIFIER);\n        const stopEvent = ()=>{\n            event.preventDefault();\n            event.stopPropagation();\n        };\n        switch(event.key){\n            case ArrowLeft:\n                stopEvent();\n                columnResizeStateRef.current.setColumnWidth(event.nativeEvent, {\n                    columnId,\n                    width: width - (precisionModifier ? STEP * PRECISION_FACTOR : STEP)\n                });\n                return;\n            case ArrowRight:\n                stopEvent();\n                columnResizeStateRef.current.setColumnWidth(event.nativeEvent, {\n                    columnId,\n                    width: width + (precisionModifier ? STEP * PRECISION_FACTOR : STEP)\n                });\n                return;\n            case Space:\n            case Enter:\n            case Escape:\n                var // Just blur here, the onBlur handler will take care of the rest (disableInteractiveMode).\n                _resizeHandleRefs_get_current, _resizeHandleRefs_get;\n                stopEvent();\n                (_resizeHandleRefs_get = resizeHandleRefs.get(columnId)) === null || _resizeHandleRefs_get === void 0 ? void 0 : (_resizeHandleRefs_get_current = _resizeHandleRefs_get.current) === null || _resizeHandleRefs_get_current === void 0 ? void 0 : _resizeHandleRefs_get_current.blur();\n                break;\n        }\n    });\n    const enableInteractiveMode = React.useCallback((colId)=>{\n        var _onChangeRef_current, _onChangeRef, _resizeHandleRefs_get;\n        setColumnId(colId);\n        (_onChangeRef_current = (_onChangeRef = onChangeRef).current) === null || _onChangeRef_current === void 0 ? void 0 : _onChangeRef_current.call(_onChangeRef, colId, true);\n        const handle = (_resizeHandleRefs_get = resizeHandleRefs.get(colId)) === null || _resizeHandleRefs_get === void 0 ? void 0 : _resizeHandleRefs_get.current;\n        if (handle) {\n            handle.setAttribute('tabindex', '-1');\n            handle.tabIndex = -1;\n            handle.focus();\n        }\n    }, [\n        resizeHandleRefs\n    ]);\n    const disableInteractiveMode = React.useCallback(()=>{\n        var // Notify the onChange listener that we are disabling interactive mode.\n        _onChangeRef_current, _onChangeRef, _resizeHandleRefs_get;\n        if (!columnId) {\n            return;\n        }\n        (_onChangeRef_current = (_onChangeRef = onChangeRef).current) === null || _onChangeRef_current === void 0 ? void 0 : _onChangeRef_current.call(_onChangeRef, columnId, false);\n        // Find the previous focusable element (table header button) and focus it.\n        const el = (_resizeHandleRefs_get = resizeHandleRefs.get(columnId)) === null || _resizeHandleRefs_get === void 0 ? void 0 : _resizeHandleRefs_get.current;\n        if (el) {\n            var _findPrevFocusable;\n            (_findPrevFocusable = findPrevFocusable(el)) === null || _findPrevFocusable === void 0 ? void 0 : _findPrevFocusable.focus(); // Focus the previous focusable element (header button).\n            el.removeAttribute('tabindex');\n        }\n        setColumnId(undefined);\n    }, [\n        columnId,\n        findPrevFocusable,\n        resizeHandleRefs\n    ]);\n    const toggleInteractiveMode = (colId, onChange)=>{\n        onChangeRef.current = onChange;\n        if (!columnId) {\n            enableInteractiveMode(colId);\n        } else if (colId && columnId !== colId) {\n            enableInteractiveMode(colId);\n            setColumnId(colId);\n        } else {\n            disableInteractiveMode();\n        }\n    };\n    const getKeyboardResizingRef = React.useCallback((colId)=>{\n        const ref = resizeHandleRefs.get(colId) || React.createRef();\n        resizeHandleRefs.set(colId, ref);\n        return ref;\n    }, [\n        resizeHandleRefs\n    ]);\n    // This makes sure the left and right arrow keys are ignored in tabster,\n    // so that they can be used for resizing.\n    const tabsterAttrs = useTabsterAttributes({\n        focusable: {\n            ignoreKeydown: {\n                ArrowLeft: true,\n                ArrowRight: true\n            }\n        }\n    });\n    return {\n        toggleInteractiveMode,\n        columnId,\n        getKeyboardResizingProps: (colId, currentWidth)=>({\n                onKeyDown: keyboardHandler,\n                onBlur: disableInteractiveMode,\n                ref: getKeyboardResizingRef(colId),\n                role: 'separator',\n                'aria-label': 'Resize column',\n                'aria-valuetext': `${currentWidth} pixels`,\n                'aria-hidden': colId === columnId ? false : true,\n                tabIndex: colId === columnId ? 0 : undefined,\n                ...tabsterAttrs\n            })\n    };\n}\n"],"names":["useKeyboardResizing","STEP","PRECISION_MODIFIER","Shift","PRECISION_FACTOR","columnResizeState","columnId","setColumnId","React","useState","onChangeRef","useRef","findPrevFocusable","useFocusFinders","columnResizeStateRef","useEffect","current","resizeHandleRefs","Map","keyboardHandler","useEventCallback","event","width","getColumnWidth","precisionModifier","getModifierState","stopEvent","preventDefault","stopPropagation","key","ArrowLeft","setColumnWidth","nativeEvent","ArrowRight","Space","Enter","Escape","_resizeHandleRefs_get_current","_resizeHandleRefs_get","get","blur","enableInteractiveMode","useCallback","colId","_onChangeRef_current","_onChangeRef","call","handle","setAttribute","tabIndex","focus","disableInteractiveMode","el","_findPrevFocusable","removeAttribute","undefined","toggleInteractiveMode","onChange","getKeyboardResizingRef","ref","createRef","set","tabsterAttrs","useTabsterAttributes","focusable","ignoreKeydown","getKeyboardResizingProps","currentWidth","onKeyDown","onBlur","role"],"mappings":"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"}
+{"version":3,"sources":["useKeyboardResizing.js"],"sourcesContent":["import * as React from 'react';\nimport { ArrowLeft, ArrowRight, Enter, Escape, Shift, Space } from '@fluentui/keyboard-keys';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { useFocusFinders, useTabsterAttributes } from '@fluentui/react-tabster';\nconst STEP = 20;\nconst PRECISION_MODIFIER = Shift;\nconst PRECISION_FACTOR = 1 / 4;\nexport function useKeyboardResizing(columnResizeState) {\n    const [columnId, setColumnId] = React.useState();\n    const onChangeRef = React.useRef();\n    const { findPrevFocusable } = useFocusFinders();\n    const columnResizeStateRef = React.useRef(columnResizeState);\n    React.useEffect(()=>{\n        columnResizeStateRef.current = columnResizeState;\n    }, [\n        columnResizeState\n    ]);\n    const [resizeHandleRefs] = React.useState(()=>new Map());\n    const keyboardHandler = useEventCallback((event)=>{\n        if (!columnId) {\n            return;\n        }\n        const width = columnResizeStateRef.current.getColumnWidth(columnId);\n        const precisionModifier = event.getModifierState(PRECISION_MODIFIER);\n        const stopEvent = ()=>{\n            event.preventDefault();\n            event.stopPropagation();\n        };\n        switch(event.key){\n            case ArrowLeft:\n                stopEvent();\n                columnResizeStateRef.current.setColumnWidth(event.nativeEvent, {\n                    columnId,\n                    width: width - (precisionModifier ? STEP * PRECISION_FACTOR : STEP)\n                });\n                return;\n            case ArrowRight:\n                stopEvent();\n                columnResizeStateRef.current.setColumnWidth(event.nativeEvent, {\n                    columnId,\n                    width: width + (precisionModifier ? STEP * PRECISION_FACTOR : STEP)\n                });\n                return;\n            case Space:\n            case Enter:\n            case Escape:\n                var // Just blur here, the onBlur handler will take care of the rest (disableInteractiveMode).\n                _resizeHandleRefs_get_current, _resizeHandleRefs_get;\n                stopEvent();\n                (_resizeHandleRefs_get = resizeHandleRefs.get(columnId)) === null || _resizeHandleRefs_get === void 0 ? void 0 : (_resizeHandleRefs_get_current = _resizeHandleRefs_get.current) === null || _resizeHandleRefs_get_current === void 0 ? void 0 : _resizeHandleRefs_get_current.blur();\n                break;\n        }\n    });\n    const enableInteractiveMode = React.useCallback((colId)=>{\n        var _onChangeRef_current, _resizeHandleRefs_get;\n        setColumnId(colId);\n        (_onChangeRef_current = onChangeRef.current) === null || _onChangeRef_current === void 0 ? void 0 : _onChangeRef_current.call(onChangeRef, colId, true);\n        const handle = (_resizeHandleRefs_get = resizeHandleRefs.get(colId)) === null || _resizeHandleRefs_get === void 0 ? void 0 : _resizeHandleRefs_get.current;\n        if (handle) {\n            handle.setAttribute('tabindex', '-1');\n            handle.tabIndex = -1;\n            handle.focus();\n        }\n    }, [\n        resizeHandleRefs\n    ]);\n    const disableInteractiveMode = React.useCallback(()=>{\n        var // Notify the onChange listener that we are disabling interactive mode.\n        _onChangeRef_current, _resizeHandleRefs_get;\n        if (!columnId) {\n            return;\n        }\n        (_onChangeRef_current = onChangeRef.current) === null || _onChangeRef_current === void 0 ? void 0 : _onChangeRef_current.call(onChangeRef, columnId, false);\n        // Find the previous focusable element (table header button) and focus it.\n        const el = (_resizeHandleRefs_get = resizeHandleRefs.get(columnId)) === null || _resizeHandleRefs_get === void 0 ? void 0 : _resizeHandleRefs_get.current;\n        if (el) {\n            var _findPrevFocusable;\n            (_findPrevFocusable = findPrevFocusable(el)) === null || _findPrevFocusable === void 0 ? void 0 : _findPrevFocusable.focus(); // Focus the previous focusable element (header button).\n            el.removeAttribute('tabindex');\n        }\n        setColumnId(undefined);\n    }, [\n        columnId,\n        findPrevFocusable,\n        resizeHandleRefs\n    ]);\n    const toggleInteractiveMode = (colId, onChange)=>{\n        onChangeRef.current = onChange;\n        if (!columnId) {\n            enableInteractiveMode(colId);\n        } else if (colId && columnId !== colId) {\n            enableInteractiveMode(colId);\n            setColumnId(colId);\n        } else {\n            disableInteractiveMode();\n        }\n    };\n    const getKeyboardResizingRef = React.useCallback((colId)=>{\n        const ref = resizeHandleRefs.get(colId) || React.createRef();\n        resizeHandleRefs.set(colId, ref);\n        return ref;\n    }, [\n        resizeHandleRefs\n    ]);\n    // This makes sure the left and right arrow keys are ignored in tabster,\n    // so that they can be used for resizing.\n    const tabsterAttrs = useTabsterAttributes({\n        focusable: {\n            ignoreKeydown: {\n                ArrowLeft: true,\n                ArrowRight: true\n            }\n        }\n    });\n    return {\n        toggleInteractiveMode,\n        columnId,\n        getKeyboardResizingProps: (colId, currentWidth)=>({\n                onKeyDown: keyboardHandler,\n                onBlur: disableInteractiveMode,\n                ref: getKeyboardResizingRef(colId),\n                role: 'separator',\n                'aria-label': 'Resize column',\n                'aria-valuetext': `${currentWidth} pixels`,\n                'aria-hidden': colId === columnId ? false : true,\n                tabIndex: colId === columnId ? 0 : undefined,\n                ...tabsterAttrs\n            })\n    };\n}\n"],"names":["useKeyboardResizing","STEP","PRECISION_MODIFIER","Shift","PRECISION_FACTOR","columnResizeState","columnId","setColumnId","React","useState","onChangeRef","useRef","findPrevFocusable","useFocusFinders","columnResizeStateRef","useEffect","current","resizeHandleRefs","Map","keyboardHandler","useEventCallback","event","width","getColumnWidth","precisionModifier","getModifierState","stopEvent","preventDefault","stopPropagation","key","ArrowLeft","setColumnWidth","nativeEvent","ArrowRight","Space","Enter","Escape","_resizeHandleRefs_get_current","_resizeHandleRefs_get","get","blur","enableInteractiveMode","useCallback","colId","_onChangeRef_current","call","handle","setAttribute","tabIndex","focus","disableInteractiveMode","el","_findPrevFocusable","removeAttribute","undefined","toggleInteractiveMode","onChange","getKeyboardResizingRef","ref","createRef","set","tabsterAttrs","useTabsterAttributes","focusable","ignoreKeydown","getKeyboardResizingProps","currentWidth","onKeyDown","onBlur","role"],"mappings":";;;;+BAOgBA;;;eAAAA;;;;iEAPO;8BAC4C;gCAClC;8BACqB;AACtD,MAAMC,OAAO;AACb,MAAMC,qBAAqBC,mBAAK;AAChC,MAAMC,mBAAmB,IAAI;AACtB,SAASJ,oBAAoBK,iBAAiB;IACjD,MAAM,CAACC,UAAUC,YAAY,GAAGC,OAAMC,QAAQ;IAC9C,MAAMC,cAAcF,OAAMG,MAAM;IAChC,MAAM,EAAEC,iBAAiB,EAAE,GAAGC,IAAAA,6BAAe;IAC7C,MAAMC,uBAAuBN,OAAMG,MAAM,CAACN;IAC1CG,OAAMO,SAAS,CAAC;QACZD,qBAAqBE,OAAO,GAAGX;IACnC,GAAG;QACCA;KACH;IACD,MAAM,CAACY,iBAAiB,GAAGT,OAAMC,QAAQ,CAAC,IAAI,IAAIS;IAClD,MAAMC,kBAAkBC,IAAAA,gCAAgB,EAAC,CAACC;QACtC,IAAI,CAACf,UAAU;YACX;QACJ;QACA,MAAMgB,QAAQR,qBAAqBE,OAAO,CAACO,cAAc,CAACjB;QAC1D,MAAMkB,oBAAoBH,MAAMI,gBAAgB,CAACvB;QACjD,MAAMwB,YAAY;YACdL,MAAMM,cAAc;YACpBN,MAAMO,eAAe;QACzB;QACA,OAAOP,MAAMQ,GAAG;YACZ,KAAKC,uBAAS;gBACVJ;gBACAZ,qBAAqBE,OAAO,CAACe,cAAc,CAACV,MAAMW,WAAW,EAAE;oBAC3D1B;oBACAgB,OAAOA,QAASE,CAAAA,oBAAoBvB,OAAOG,mBAAmBH,IAAG;gBACrE;gBACA;YACJ,KAAKgC,wBAAU;gBACXP;gBACAZ,qBAAqBE,OAAO,CAACe,cAAc,CAACV,MAAMW,WAAW,EAAE;oBAC3D1B;oBACAgB,OAAOA,QAASE,CAAAA,oBAAoBvB,OAAOG,mBAAmBH,IAAG;gBACrE;gBACA;YACJ,KAAKiC,mBAAK;YACV,KAAKC,mBAAK;YACV,KAAKC,oBAAM;gBACP,IACAC,+BAA+BC;gBAC/BZ;gBACCY,CAAAA,wBAAwBrB,iBAAiBsB,GAAG,CAACjC,SAAQ,MAAO,QAAQgC,0BAA0B,KAAK,IAAI,KAAK,IAAI,AAACD,CAAAA,gCAAgCC,sBAAsBtB,OAAO,AAAD,MAAO,QAAQqB,kCAAkC,KAAK,IAAI,KAAK,IAAIA,8BAA8BG,IAAI;gBACnR;QACR;IACJ;IACA,MAAMC,wBAAwBjC,OAAMkC,WAAW,CAAC,CAACC;QAC7C,IAAIC,sBAAsBN;QAC1B/B,YAAYoC;QACXC,CAAAA,uBAAuBlC,YAAYM,OAAO,AAAD,MAAO,QAAQ4B,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBC,IAAI,CAACnC,aAAaiC,OAAO;QAClJ,MAAMG,SAAS,AAACR,CAAAA,wBAAwBrB,iBAAiBsB,GAAG,CAACI,MAAK,MAAO,QAAQL,0BAA0B,KAAK,IAAI,KAAK,IAAIA,sBAAsBtB,OAAO;QAC1J,IAAI8B,QAAQ;YACRA,OAAOC,YAAY,CAAC,YAAY;YAChCD,OAAOE,QAAQ,GAAG,CAAC;YACnBF,OAAOG,KAAK;QAChB;IACJ,GAAG;QACChC;KACH;IACD,MAAMiC,yBAAyB1C,OAAMkC,WAAW,CAAC;QAC7C,IACAE,sBAAsBN;QACtB,IAAI,CAAChC,UAAU;YACX;QACJ;QACCsC,CAAAA,uBAAuBlC,YAAYM,OAAO,AAAD,MAAO,QAAQ4B,yBAAyB,KAAK,IAAI,KAAK,IAAIA,qBAAqBC,IAAI,CAACnC,aAAaJ,UAAU;QACrJ,0EAA0E;QAC1E,MAAM6C,KAAK,AAACb,CAAAA,wBAAwBrB,iBAAiBsB,GAAG,CAACjC,SAAQ,MAAO,QAAQgC,0BAA0B,KAAK,IAAI,KAAK,IAAIA,sBAAsBtB,OAAO;QACzJ,IAAImC,IAAI;YACJ,IAAIC;YACHA,CAAAA,qBAAqBxC,kBAAkBuC,GAAE,MAAO,QAAQC,uBAAuB,KAAK,IAAI,KAAK,IAAIA,mBAAmBH,KAAK,IAAI,wDAAwD;YACtLE,GAAGE,eAAe,CAAC;QACvB;QACA9C,YAAY+C;IAChB,GAAG;QACChD;QACAM;QACAK;KACH;IACD,MAAMsC,wBAAwB,CAACZ,OAAOa;QAClC9C,YAAYM,OAAO,GAAGwC;QACtB,IAAI,CAAClD,UAAU;YACXmC,sBAAsBE;QAC1B,OAAO,IAAIA,SAASrC,aAAaqC,OAAO;YACpCF,sBAAsBE;YACtBpC,YAAYoC;QAChB,OAAO;YACHO;QACJ;IACJ;IACA,MAAMO,yBAAyBjD,OAAMkC,WAAW,CAAC,CAACC;QAC9C,MAAMe,MAAMzC,iBAAiBsB,GAAG,CAACI,wBAAUnC,OAAMmD,SAAS;QAC1D1C,iBAAiB2C,GAAG,CAACjB,OAAOe;QAC5B,OAAOA;IACX,GAAG;QACCzC;KACH;IACD,wEAAwE;IACxE,yCAAyC;IACzC,MAAM4C,eAAeC,IAAAA,kCAAoB,EAAC;QACtCC,WAAW;YACPC,eAAe;gBACXlC,WAAW;gBACXG,YAAY;YAChB;QACJ;IACJ;IACA,OAAO;QACHsB;QACAjD;QACA2D,0BAA0B,CAACtB,OAAOuB,eAAgB,CAAA;gBAC1CC,WAAWhD;gBACXiD,QAAQlB;gBACRQ,KAAKD,uBAAuBd;gBAC5B0B,MAAM;gBACN,cAAc;gBACd,kBAAkB,CAAC,EAAEH,aAAa,OAAO,CAAC;gBAC1C,eAAevB,UAAUrC,WAAW,QAAQ;gBAC5C0C,UAAUL,UAAUrC,WAAW,IAAIgD;gBACnC,GAAGO,YAAY;YACnB,CAAA;IACR;AACJ"}

package/lib-commonjs/hooks/useMeasureElement.js

@@ -45,10 +45,7 @@ function useMeasureElement() {
         handleResize
     ]);
     _react.useEffect(()=>{
-        return ()=>{
-            var _resizeObserver;
-            return (_resizeObserver = resizeObserver) === null || _resizeObserver === void 0 ? void 0 : _resizeObserver.disconnect();
-        };
+        return ()=>resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
     }, [
         resizeObserver
     ]);

package/lib-commonjs/hooks/useMeasureElement.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useMeasureElement.js"],"sourcesContent":["import { canUseDOM } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n/**\n * Provides a way of reporting element width.\n * Returns\n * `width` - current element width (0 by default),\n * `measureElementRef` - a ref function to be passed as `ref` to the element you want to measure\n */ export function useMeasureElement() {\n    const [width, setWidth] = React.useState(0);\n    const container = React.useRef(undefined);\n    const { targetDocument } = useFluent();\n    // the handler for resize observer\n    const handleResize = React.useCallback(()=>{\n        var _container_current;\n        const containerWidth = (_container_current = container.current) === null || _container_current === void 0 ? void 0 : _container_current.getBoundingClientRect().width;\n        setWidth(containerWidth || 0);\n    }, []);\n    // Keep the reference of ResizeObserver in the state, as it should live through renders\n    const [resizeObserver] = React.useState(canUseDOM() ? new ResizeObserver(handleResize) : undefined);\n    const measureElementRef = React.useCallback((el)=>{\n        if (!targetDocument || !resizeObserver) {\n            return;\n        }\n        // cleanup previous container\n        if (container.current) {\n            resizeObserver.unobserve(container.current);\n            container.current.remove();\n        }\n        if (el) {\n            container.current = targetDocument.createElement('div');\n            el.insertAdjacentElement('beforebegin', container.current);\n            resizeObserver.observe(container.current);\n            handleResize();\n        }\n    }, [\n        targetDocument,\n        resizeObserver,\n        handleResize\n    ]);\n    React.useEffect(()=>{\n        return ()=>{\n            var _resizeObserver;\n            return (_resizeObserver = resizeObserver) === null || _resizeObserver === void 0 ? void 0 : _resizeObserver.disconnect();\n        };\n    }, [\n        resizeObserver\n    ]);\n    return {\n        width,\n        measureElementRef\n    };\n}\n"],"names":["useMeasureElement","width","setWidth","React","useState","container","useRef","undefined","targetDocument","useFluent","handleResize","useCallback","_container_current","containerWidth","current","getBoundingClientRect","resizeObserver","canUseDOM","ResizeObserver","measureElementRef","el","unobserve","remove","createElement","insertAdjacentElement","observe","useEffect","_resizeObserver","disconnect"],"mappings":";;;;+BAQoBA;;;eAAAA;;;;gCARM;iEACH;qCACyB;AAMrC,SAASA;IAChB,MAAM,CAACC,OAAOC,SAAS,GAAGC,OAAMC,QAAQ,CAAC;IACzC,MAAMC,YAAYF,OAAMG,MAAM,CAACC;IAC/B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,kCAAkC;IAClC,MAAMC,eAAeP,OAAMQ,WAAW,CAAC;QACnC,IAAIC;QACJ,MAAMC,iBAAiB,AAACD,CAAAA,qBAAqBP,UAAUS,OAAO,AAAD,MAAO,QAAQF,uBAAuB,KAAK,IAAI,KAAK,IAAIA,mBAAmBG,qBAAqB,GAAGd,KAAK;QACrKC,SAASW,kBAAkB;IAC/B,GAAG,EAAE;IACL,uFAAuF;IACvF,MAAM,CAACG,eAAe,GAAGb,OAAMC,QAAQ,CAACa,IAAAA,yBAAS,MAAK,IAAIC,eAAeR,gBAAgBH;IACzF,MAAMY,oBAAoBhB,OAAMQ,WAAW,CAAC,CAACS;QACzC,IAAI,CAACZ,kBAAkB,CAACQ,gBAAgB;YACpC;QACJ;QACA,6BAA6B;QAC7B,IAAIX,UAAUS,OAAO,EAAE;YACnBE,eAAeK,SAAS,CAAChB,UAAUS,OAAO;YAC1CT,UAAUS,OAAO,CAACQ,MAAM;QAC5B;QACA,IAAIF,IAAI;YACJf,UAAUS,OAAO,GAAGN,eAAee,aAAa,CAAC;YACjDH,GAAGI,qBAAqB,CAAC,eAAenB,UAAUS,OAAO;YACzDE,eAAeS,OAAO,CAACpB,UAAUS,OAAO;YACxCJ;QACJ;IACJ,GAAG;QACCF;QACAQ;QACAN;KACH;IACDP,OAAMuB,SAAS,CAAC;QACZ,OAAO;YACH,IAAIC;YACJ,OAAO,AAACA,CAAAA,kBAAkBX,cAAa,MAAO,QAAQW,oBAAoB,KAAK,IAAI,KAAK,IAAIA,gBAAgBC,UAAU;QAC1H;IACJ,GAAG;QACCZ;KACH;IACD,OAAO;QACHf;QACAkB;IACJ;AACJ"}
+{"version":3,"sources":["useMeasureElement.js"],"sourcesContent":["import { canUseDOM } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n/**\n * Provides a way of reporting element width.\n * Returns\n * `width` - current element width (0 by default),\n * `measureElementRef` - a ref function to be passed as `ref` to the element you want to measure\n */ export function useMeasureElement() {\n    const [width, setWidth] = React.useState(0);\n    const container = React.useRef(undefined);\n    const { targetDocument } = useFluent();\n    // the handler for resize observer\n    const handleResize = React.useCallback(()=>{\n        var _container_current;\n        const containerWidth = (_container_current = container.current) === null || _container_current === void 0 ? void 0 : _container_current.getBoundingClientRect().width;\n        setWidth(containerWidth || 0);\n    }, []);\n    // Keep the reference of ResizeObserver in the state, as it should live through renders\n    const [resizeObserver] = React.useState(canUseDOM() ? new ResizeObserver(handleResize) : undefined);\n    const measureElementRef = React.useCallback((el)=>{\n        if (!targetDocument || !resizeObserver) {\n            return;\n        }\n        // cleanup previous container\n        if (container.current) {\n            resizeObserver.unobserve(container.current);\n            container.current.remove();\n        }\n        if (el) {\n            container.current = targetDocument.createElement('div');\n            el.insertAdjacentElement('beforebegin', container.current);\n            resizeObserver.observe(container.current);\n            handleResize();\n        }\n    }, [\n        targetDocument,\n        resizeObserver,\n        handleResize\n    ]);\n    React.useEffect(()=>{\n        return ()=>resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();\n    }, [\n        resizeObserver\n    ]);\n    return {\n        width,\n        measureElementRef\n    };\n}\n"],"names":["useMeasureElement","width","setWidth","React","useState","container","useRef","undefined","targetDocument","useFluent","handleResize","useCallback","_container_current","containerWidth","current","getBoundingClientRect","resizeObserver","canUseDOM","ResizeObserver","measureElementRef","el","unobserve","remove","createElement","insertAdjacentElement","observe","useEffect","disconnect"],"mappings":";;;;+BAQoBA;;;eAAAA;;;;gCARM;iEACH;qCACyB;AAMrC,SAASA;IAChB,MAAM,CAACC,OAAOC,SAAS,GAAGC,OAAMC,QAAQ,CAAC;IACzC,MAAMC,YAAYF,OAAMG,MAAM,CAACC;IAC/B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,kCAAkC;IAClC,MAAMC,eAAeP,OAAMQ,WAAW,CAAC;QACnC,IAAIC;QACJ,MAAMC,iBAAiB,AAACD,CAAAA,qBAAqBP,UAAUS,OAAO,AAAD,MAAO,QAAQF,uBAAuB,KAAK,IAAI,KAAK,IAAIA,mBAAmBG,qBAAqB,GAAGd,KAAK;QACrKC,SAASW,kBAAkB;IAC/B,GAAG,EAAE;IACL,uFAAuF;IACvF,MAAM,CAACG,eAAe,GAAGb,OAAMC,QAAQ,CAACa,IAAAA,yBAAS,MAAK,IAAIC,eAAeR,gBAAgBH;IACzF,MAAMY,oBAAoBhB,OAAMQ,WAAW,CAAC,CAACS;QACzC,IAAI,CAACZ,kBAAkB,CAACQ,gBAAgB;YACpC;QACJ;QACA,6BAA6B;QAC7B,IAAIX,UAAUS,OAAO,EAAE;YACnBE,eAAeK,SAAS,CAAChB,UAAUS,OAAO;YAC1CT,UAAUS,OAAO,CAACQ,MAAM;QAC5B;QACA,IAAIF,IAAI;YACJf,UAAUS,OAAO,GAAGN,eAAee,aAAa,CAAC;YACjDH,GAAGI,qBAAqB,CAAC,eAAenB,UAAUS,OAAO;YACzDE,eAAeS,OAAO,CAACpB,UAAUS,OAAO;YACxCJ;QACJ;IACJ,GAAG;QACCF;QACAQ;QACAN;KACH;IACDP,OAAMuB,SAAS,CAAC;QACZ,OAAO,IAAIV,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeW,UAAU;IACxG,GAAG;QACCX;KACH;IACD,OAAO;QACHf;QACAkB;IACJ;AACJ"}

package/lib-commonjs/hooks/useTableColumnResizeMouseHandler.js

@@ -13,12 +13,11 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const _reactutilities = require("@fluentui/react-utilities");
 function useTableColumnResizeMouseHandler(columnResizeState) {
-    var _targetDocument, _globalWin;
     const mouseX = _react.useRef(0);
     const currentWidth = _react.useRef(0);
     const colId = _react.useRef(undefined);
     const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
-    const globalWin = (_targetDocument = targetDocument) === null || _targetDocument === void 0 ? void 0 : _targetDocument.defaultView;
+    const globalWin = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView;
     const recalculatePosition = _react.useCallback((e)=>{
         const { clientX } = (0, _reactutilities.getEventClientCoords)(e);
         const dx = clientX - mouseX.current;
@@ -33,27 +32,24 @@ function useTableColumnResizeMouseHandler(columnResizeState) {
         columnResizeState
     ]);
     const onDrag = _react.useCallback((e)=>{
-        var _globalWin;
         // Using requestAnimationFrame here drastically improves resizing experience on slower CPUs
-        if (typeof ((_globalWin = globalWin) === null || _globalWin === void 0 ? void 0 : _globalWin.requestAnimationFrame) === 'function') {
+        if (typeof (globalWin === null || globalWin === void 0 ? void 0 : globalWin.requestAnimationFrame) === 'function') {
             requestAnimationFrame(()=>recalculatePosition(e));
         } else {
             recalculatePosition(e);
         }
     }, [
-        (_globalWin = globalWin) === null || _globalWin === void 0 ? void 0 : _globalWin.requestAnimationFrame,
+        globalWin === null || globalWin === void 0 ? void 0 : globalWin.requestAnimationFrame,
         recalculatePosition
     ]);
     const onDragEnd = _react.useCallback((event)=>{
         if ((0, _reactutilities.isMouseEvent)(event)) {
-            var _targetDocument, _targetDocument1;
-            (_targetDocument = targetDocument) === null || _targetDocument === void 0 ? void 0 : _targetDocument.removeEventListener('mouseup', onDragEnd);
-            (_targetDocument1 = targetDocument) === null || _targetDocument1 === void 0 ? void 0 : _targetDocument1.removeEventListener('mousemove', onDrag);
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mouseup', onDragEnd);
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mousemove', onDrag);
         }
         if ((0, _reactutilities.isTouchEvent)(event)) {
-            var _targetDocument2, _targetDocument3;
-            (_targetDocument2 = targetDocument) === null || _targetDocument2 === void 0 ? void 0 : _targetDocument2.removeEventListener('touchend', onDragEnd);
-            (_targetDocument3 = targetDocument) === null || _targetDocument3 === void 0 ? void 0 : _targetDocument3.removeEventListener('touchmove', onDrag);
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('touchend', onDragEnd);
+            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('touchmove', onDrag);
         }
     }, [
         onDrag,
@@ -66,18 +62,16 @@ function useTableColumnResizeMouseHandler(columnResizeState) {
             mouseX.current = (0, _reactutilities.getEventClientCoords)(event).clientX;
             colId.current = columnId;
             if ((0, _reactutilities.isMouseEvent)(event)) {
-                var _targetDocument, _targetDocument1;
                 // ignore other buttons than primary mouse button
                 if (event.target !== event.currentTarget || event.button !== 0) {
                     return;
                 }
-                (_targetDocument = targetDocument) === null || _targetDocument === void 0 ? void 0 : _targetDocument.addEventListener('mouseup', onDragEnd);
-                (_targetDocument1 = targetDocument) === null || _targetDocument1 === void 0 ? void 0 : _targetDocument1.addEventListener('mousemove', onDrag);
+                targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mouseup', onDragEnd);
+                targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mousemove', onDrag);
             }
             if ((0, _reactutilities.isTouchEvent)(event)) {
-                var _targetDocument2, _targetDocument3;
-                (_targetDocument2 = targetDocument) === null || _targetDocument2 === void 0 ? void 0 : _targetDocument2.addEventListener('touchend', onDragEnd);
-                (_targetDocument3 = targetDocument) === null || _targetDocument3 === void 0 ? void 0 : _targetDocument3.addEventListener('touchmove', onDrag);
+                targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('touchend', onDragEnd);
+                targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('touchmove', onDrag);
             }
         };
     return {