npm - @fluentui/react-table - Versions diffs - 9.19.15 → 9.19.17 - Mend

@fluentui/react-table 9.19.15 → 9.19.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (162) hide show

package/lib-commonjs/components/TableSelectionCell/useTableSelectionCellStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/TableSelectionCell/useTableSelectionCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TableSelectionCellSlots, TableSelectionCellState } from './TableSelectionCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const CELL_WIDTH = 44;\n\nexport const tableSelectionCellClassNames: SlotClassNames<TableSelectionCellSlots> = {\n root: 'fui-TableSelectionCell',\n checkboxIndicator: 'fui-TableSelectionCell__checkboxIndicator',\n radioIndicator: 'fui-TableSelectionCell__radioIndicator',\n};\n\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-cell',\n width: `${CELL_WIDTH}px`,\n },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'flex',\n flex: '1 1 0px',\n minWidth: `${CELL_WIDTH}px`,\n maxWidth: `${CELL_WIDTH}px`,\n justifyContent: 'center',\n },\n});\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n textAlign: 'center',\n whiteSpace: 'nowrap',\n padding: '0',\n ...createCustomFocusIndicatorStyle(\n { outline: `2px solid ${tokens.colorStrokeFocus2}`, borderRadius: tokens.borderRadiusMedium },\n { selector: 'focus' },\n ),\n },\n\n radioIndicator: {\n display: 'flex',\n flexGrow: 1,\n alignItems: 'center',\n justifyContent: 'center',\n },\n\n subtle: {\n opacity: 0,\n ...createCustomFocusIndicatorStyle(\n {\n opacity: 1,\n },\n { selector: 'focus-within' },\n ),\n },\n\n hidden: {\n opacity: 0,\n },\n});\n\n/\n Apply styling to the TableSelectionCell slots based on the state\n */\nexport const useTableSelectionCellStyles_unstable = (state: TableSelectionCellState): TableSelectionCellState => {\n ~~'use no memo';\n\n~~ const styles = useStyles();\n const layoutStyles = {\n table: useTableLayoutStyles(),\n flex: useFlexLayoutStyles(),\n };\n state.root.className = mergeClasses(\n tableSelectionCellClassNames.root,\n styles.root,\n state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n state.subtle && state.checked === false && styles.subtle,\n state.hidden && styles.hidden,\n state.root.className,\n );\n if (state.checkboxIndicator) {\n state.checkboxIndicator.className = mergeClasses(\n tableSelectionCellClassNames.checkboxIndicator,\n state.checkboxIndicator.className,\n );\n }\n\n if (state.radioIndicator) {\n state.radioIndicator.className = mergeClasses(\n tableSelectionCellClassNames.radioIndicator,\n styles.radioIndicator,\n state.radioIndicator.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","CELL_WIDTH","tableSelectionCellClassNames","root","checkboxIndicator","radioIndicator","useTableLayoutStyles","display","width","useFlexLayoutStyles","flex","minWidth","maxWidth","justifyContent","useStyles","textAlign","whiteSpace","padding","outline","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","flexGrow","alignItems","subtle","opacity","hidden","useTableSelectionCellStyles_unstable","state","styles","layoutStyles","table","className","noNativeElements","checked"],"mappings":"AAAA;;;;;;;;;;;;IAQaI,UAAAA;;;gCAEAC;;;~~IA8DA0B,oCAAAA;;;;~~uBAtE4B,iBAAiB;8BAGV,0BAA0B;4BACnD,wBAAwB;AAExC,mBAAmB,GAAG;AAEtB,MAAM1B,+BAAwE;IACnFC,MAAM;IACNC,mBAAmB;IACnBC,gBAAgB;AAClB,EAAE;AAEF,MAAMC,2BAAuBT,iBAAAA,EAAW;IACtCM,MAAM;QACJI,SAAS;QACTC,OAAO,GAAGP,WAAW,EAAE,CAAC;IAC1B;AACF;AAEA,MAAMQ,0BAAsBZ,iBAAAA,EAAW;IACrCM,MAAM;QACJI,SAAS;QACTG,MAAM;QACNC,UAAU,GAAGV,WAAW,EAAE,CAAC;QAC3BW,UAAU,GAAGX,WAAW,EAAE,CAAC;QAC3BY,gBAAgB;IAClB;AACF;AAEA;;CAEC,GACD,MAAMC,gBAAYjB,iBAAAA,EAAW;IAC3BM,MAAM;QACJY,WAAW;QACXC,YAAY;QACZC,SAAS;QACT,OAAGlB,6CAAAA,EACD;YAAEmB,SAAS,CAAC,UAAU,EAAElB,kBAAAA,CAAOmB,iBAAiB,EAAE;YAAEC,cAAcpB,kBAAAA,CAAOqB,kBAAkB;QAAC,GAC5F;YAAEC,UAAU;QAAQ,EACrB;IACH;IAEAjB,gBAAgB;QACdE,SAAS;QACTgB,UAAU;QACVC,YAAY;QACZX,gBAAgB;IAClB;IAEAY,QAAQ;QACNC,SAAS;QACT,OAAG3B,6CAAAA,EACD;YACE2B,SAAS;QACX,GACA;YAAEJ,UAAU;QAAe,EAC5B;IACH;IAEAK,QAAQ;QACND,SAAS;IACX;AACF;AAKO,6CAA6C,CAACG;IACnD~~;IAEA~~,MAAMC,SAAShB;IACf,MAAMiB,eAAe;QACnBC,OAAO1B;QACPI,MAAMD;IACR;~~IACAoB~~,MAAM1B,IAAI,CAAC8B,SAAS,OAAGnC,mBAAAA,EACrBI,6BAA6BC,IAAI,EACjC2B,OAAO3B,IAAI,EACX0B,MAAMK,gBAAgB,GAAGH,aAAarB,IAAI,CAACP,IAAI,GAAG4B,aAAaC,KAAK,CAAC7B,IAAI,EACzE0B,MAAMJ,MAAM,IAAII,MAAMM,OAAO,KAAK,SAASL,OAAOL,MAAM,EACxDI,MAAMF,MAAM,IAAIG,OAAOH,MAAM,EAC7BE,MAAM1B,IAAI,CAAC8B,SAAS;IAEtB,IAAIJ,MAAMzB,iBAAiB,EAAE;~~QAC3ByB~~,MAAMzB,iBAAiB,CAAC6B,SAAS,OAAGnC,mBAAAA,EAClCI,6BAA6BE,iBAAiB,EAC9CyB,MAAMzB,iBAAiB,CAAC6B,SAAS;IAErC;IAEA,IAAIJ,MAAMxB,cAAc,EAAE;~~QACxBwB~~,MAAMxB,cAAc,CAAC4B,SAAS,OAAGnC,mBAAAA,EAC/BI,6BAA6BG,cAAc,EAC3CyB,OAAOzB,cAAc,EACrBwB,MAAMxB,cAAc,CAAC4B,SAAS;IAElC;IAEA,OAAOJ;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/TableSelectionCell/useTableSelectionCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TableSelectionCellSlots, TableSelectionCellState } from './TableSelectionCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const CELL_WIDTH = 44;\n\nexport const tableSelectionCellClassNames: SlotClassNames<TableSelectionCellSlots> = {\n root: 'fui-TableSelectionCell',\n checkboxIndicator: 'fui-TableSelectionCell__checkboxIndicator',\n radioIndicator: 'fui-TableSelectionCell__radioIndicator',\n};\n\nconst useTableLayoutStyles = makeStyles({\n root: {\n display: 'table-cell',\n width: `${CELL_WIDTH}px`,\n },\n});\n\nconst useFlexLayoutStyles = makeStyles({\n root: {\n display: 'flex',\n flex: '1 1 0px',\n minWidth: `${CELL_WIDTH}px`,\n maxWidth: `${CELL_WIDTH}px`,\n justifyContent: 'center',\n },\n});\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n textAlign: 'center',\n whiteSpace: 'nowrap',\n padding: '0',\n ...createCustomFocusIndicatorStyle(\n { outline: `2px solid ${tokens.colorStrokeFocus2}`, borderRadius: tokens.borderRadiusMedium },\n { selector: 'focus' },\n ),\n },\n\n radioIndicator: {\n display: 'flex',\n flexGrow: 1,\n alignItems: 'center',\n justifyContent: 'center',\n },\n\n subtle: {\n opacity: 0,\n ...createCustomFocusIndicatorStyle(\n {\n opacity: 1,\n },\n { selector: 'focus-within' },\n ),\n },\n\n hidden: {\n opacity: 0,\n },\n});\n\n/\n Apply styling to the TableSelectionCell slots based on the state\n */\nexport const useTableSelectionCellStyles_unstable = (state: TableSelectionCellState): TableSelectionCellState => {\n const styles = useStyles();\n const layoutStyles = {\n table: useTableLayoutStyles(),\n flex: useFlexLayoutStyles(),\n };\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n tableSelectionCellClassNames.root,\n styles.root,\n state.noNativeElements ? layoutStyles.flex.root : layoutStyles.table.root,\n state.subtle && state.checked === false && styles.subtle,\n state.hidden && styles.hidden,\n state.root.className,\n );\n if (state.checkboxIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkboxIndicator.className = mergeClasses(\n tableSelectionCellClassNames.checkboxIndicator,\n state.checkboxIndicator.className,\n );\n }\n\n if (state.radioIndicator) {\n // eslint-disable-next-line react-hooks/immutability\n state.radioIndicator.className = mergeClasses(\n tableSelectionCellClassNames.radioIndicator,\n styles.radioIndicator,\n state.radioIndicator.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","CELL_WIDTH","tableSelectionCellClassNames","root","checkboxIndicator","radioIndicator","useTableLayoutStyles","display","width","useFlexLayoutStyles","flex","minWidth","maxWidth","justifyContent","useStyles","textAlign","whiteSpace","padding","outline","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","flexGrow","alignItems","subtle","opacity","hidden","useTableSelectionCellStyles_unstable","state","styles","layoutStyles","table","className","noNativeElements","checked"],"mappings":"AAAA;;;;;;;;;;;;IAQaI,UAAAA;;;gCAEAC;;;wCA8DA0B;eAAAA;;;uBAtE4B,iBAAiB;8BAGV,0BAA0B;4BACnD,wBAAwB;AAExC,mBAAmB,GAAG;AAEtB,MAAM1B,+BAAwE;IACnFC,MAAM;IACNC,mBAAmB;IACnBC,gBAAgB;AAClB,EAAE;AAEF,MAAMC,2BAAuBT,iBAAAA,EAAW;IACtCM,MAAM;QACJI,SAAS;QACTC,OAAO,GAAGP,WAAW,EAAE,CAAC;IAC1B;AACF;AAEA,MAAMQ,0BAAsBZ,iBAAAA,EAAW;IACrCM,MAAM;QACJI,SAAS;QACTG,MAAM;QACNC,UAAU,GAAGV,WAAW,EAAE,CAAC;QAC3BW,UAAU,GAAGX,WAAW,EAAE,CAAC;QAC3BY,gBAAgB;IAClB;AACF;AAEA;;CAEC,GACD,MAAMC,gBAAYjB,iBAAAA,EAAW;IAC3BM,MAAM;QACJY,WAAW;QACXC,YAAY;QACZC,SAAS;QACT,OAAGlB,6CAAAA,EACD;YAAEmB,SAAS,CAAC,UAAU,EAAElB,kBAAAA,CAAOmB,iBAAiB,EAAE;YAAEC,cAAcpB,kBAAAA,CAAOqB,kBAAkB;QAAC,GAC5F;YAAEC,UAAU;QAAQ,EACrB;IACH;IAEAjB,gBAAgB;QACdE,SAAS;QACTgB,UAAU;QACVC,YAAY;QACZX,gBAAgB;IAClB;IAEAY,QAAQ;QACNC,SAAS;QACT,OAAG3B,6CAAAA,EACD;YACE2B,SAAS;QACX,GACA;YAAEJ,UAAU;QAAe,EAC5B;IACH;IAEAK,QAAQ;QACND,SAAS;IACX;AACF;AAKO,6CAA6C,CAACG;IACnD,MAAMC,SAAShB;IACf,MAAMiB,eAAe;QACnBC,OAAO1B;QACPI,MAAMD;IACR;IACA,oDAAoD;IACpDoB,MAAM1B,IAAI,CAAC8B,SAAS,OAAGnC,mBAAAA,EACrBI,6BAA6BC,IAAI,EACjC2B,OAAO3B,IAAI,EACX0B,MAAMK,gBAAgB,GAAGH,aAAarB,IAAI,CAACP,IAAI,GAAG4B,aAAaC,KAAK,CAAC7B,IAAI,EACzE0B,MAAMJ,MAAM,IAAII,MAAMM,OAAO,KAAK,SAASL,OAAOL,MAAM,EACxDI,MAAMF,MAAM,IAAIG,OAAOH,MAAM,EAC7BE,MAAM1B,IAAI,CAAC8B,SAAS;IAEtB,IAAIJ,MAAMzB,iBAAiB,EAAE;QAC3B,oDAAoD;QACpDyB,MAAMzB,iBAAiB,CAAC6B,SAAS,OAAGnC,mBAAAA,EAClCI,6BAA6BE,iBAAiB,EAC9CyB,MAAMzB,iBAAiB,CAAC6B,SAAS;IAErC;IAEA,IAAIJ,MAAMxB,cAAc,EAAE;QACxB,oDAAoD;QACpDwB,MAAMxB,cAAc,CAAC4B,SAAS,OAAGnC,mBAAAA,EAC/BI,6BAA6BG,cAAc,EAC3CyB,OAAOzB,cAAc,EACrBwB,MAAMxB,cAAc,CAAC4B,SAAS;IAElC;IAEA,OAAOJ;AACT,EAAE"}

package/lib-commonjs/hooks/useTableColumnResizeMouseHandler.js CHANGED Viewed

@@ -43,6 +43,7 @@ function useTableColumnResizeMouseHandler(columnResizeState) {
     ]);
     const onDragEnd = _react.useCallback((event)=>{
         if ((0, _reactutilities.isMouseEvent)(event)) {
+            // eslint-disable-next-line react-hooks/immutability
             targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mouseup', onDragEnd);
             targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mousemove', onDrag);
         }

package/lib-commonjs/hooks/useTableColumnResizeMouseHandler.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/hooks/useTableColumnResizeMouseHandler.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { TableColumnId, ColumnResizeState } from './types';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { NativeTouchOrMouseEvent, ReactTouchOrMouseEvent } from '@fluentui/react-utilities';\nimport { getEventClientCoords, isMouseEvent, isTouchEvent, useAnimationFrame } from '@fluentui/react-utilities';\n\nexport function useTableColumnResizeMouseHandler(columnResizeState: ColumnResizeState): {\n getOnMouseDown: (columnId: TableColumnId) => (event: ReactTouchOrMouseEvent) => void;\n dragging: boolean;\n} {\n const mouseX = React.useRef(0);\n const currentWidth = React.useRef(0);\n const colId = React.useRef<TableColumnId \| undefined>(undefined);\n const [dragging, setDragging] = React.useState<boolean>(false);\n\n const { targetDocument } = useFluent();\n\n const { getColumnWidth, setColumnWidth } = columnResizeState;\n\n const recalculatePosition = React.useCallback(\n (e: NativeTouchOrMouseEvent) => {\n const { clientX } = getEventClientCoords(e);\n const dx = clientX - mouseX.current;\n\n // Update the local width for the column and set it\n currentWidth.current += dx;\n colId.current && setColumnWidth(e, { columnId: colId.current, width: currentWidth.current });\n mouseX.current = clientX;\n },\n [setColumnWidth],\n );\n\n const [requestRecalcFrame] = useAnimationFrame();\n\n const onDrag = React.useCallback(\n (e: NativeTouchOrMouseEvent) => {\n // Using requestAnimationFrame here drastically improves resizing experience on slower CPUs\n requestRecalcFrame(() => recalculatePosition(e));\n },\n [requestRecalcFrame, recalculatePosition],\n );\n\n const onDragEnd = React.useCallback(\n (event: NativeTouchOrMouseEvent) => {\n if (isMouseEvent(event)) {\n targetDocument?.removeEventListener('mouseup', onDragEnd);\n targetDocument?.removeEventListener('mousemove', onDrag);\n }\n if (isTouchEvent(event)) {\n targetDocument?.removeEventListener('touchend', onDragEnd);\n targetDocument?.removeEventListener('touchmove', onDrag);\n }\n setDragging(false);\n },\n [onDrag, targetDocument],\n );\n\n const getOnMouseDown = React.useCallback(\n (columnId: TableColumnId) => (event: ReactTouchOrMouseEvent) => {\n // Keep the width locally so that we decouple the calculation of the next with from rendering.\n // This makes the whole experience much faster and more precise\n currentWidth.current = getColumnWidth(columnId);\n mouseX.current = getEventClientCoords(event).clientX;\n colId.current = columnId;\n\n if (isMouseEvent(event)) {\n // ignore other buttons than primary mouse button\n if (event.target !== event.currentTarget \|\| event.button !== 0) {\n return;\n }\n targetDocument?.addEventListener('mouseup', onDragEnd);\n targetDocument?.addEventListener('mousemove', onDrag);\n setDragging(true);\n }\n\n if (isTouchEvent(event)) {\n targetDocument?.addEventListener('touchend', onDragEnd);\n targetDocument?.addEventListener('touchmove', onDrag);\n setDragging(true);\n }\n },\n [getColumnWidth, onDrag, onDragEnd, targetDocument],\n );\n\n return {\n getOnMouseDown,\n dragging,\n };\n}\n"],"names":["React","useFluent_unstable","useFluent","getEventClientCoords","isMouseEvent","isTouchEvent","useAnimationFrame","useTableColumnResizeMouseHandler","columnResizeState","mouseX","useRef","currentWidth","colId","undefined","dragging","setDragging","useState","targetDocument","getColumnWidth","setColumnWidth","recalculatePosition","useCallback","e","clientX","dx","current","columnId","width","requestRecalcFrame","onDrag","onDragEnd","event","removeEventListener","getOnMouseDown","target","currentTarget","button","addEventListener"],"mappings":"AAAA;;;;;+BAQgBO;;;;;;;iEANO,QAAQ;qCAEiB,kCAAkC;gCAEE,4BAA4B;AAEzG,0CAA0CC,iBAAoC;IAInF,MAAMC,SAAST,OAAMU,MAAM,CAAC;IAC5B,MAAMC,eAAeX,OAAMU,MAAM,CAAC;IAClC,MAAME,QAAQZ,OAAMU,MAAM,CAA4BG;IACtD,MAAM,CAACC,UAAUC,YAAY,GAAGf,OAAMgB,QAAQ,CAAU;IAExD,MAAM,EAAEC,cAAc,EAAE,OAAGf,uCAAAA;IAE3B,MAAM,EAAEgB,cAAc,EAAEC,cAAc,EAAE,GAAGX;IAE3C,MAAMY,sBAAsBpB,OAAMqB,WAAW,CAC3C,CAACC;QACC,MAAM,EAAEC,OAAO,EAAE,OAAGpB,oCAAAA,EAAqBmB;QACzC,MAAME,KAAKD,UAAUd,OAAOgB,OAAO;QAEnC,mDAAmD;QACnDd,aAAac,OAAO,IAAID;QACxBZ,MAAMa,OAAO,IAAIN,eAAeG,GAAG;YAAEI,UAAUd,MAAMa,OAAO;YAAEE,OAAOhB,aAAac,OAAO;QAAC;QAC1FhB,OAAOgB,OAAO,GAAGF;IACnB,GACA;QAACJ;KAAe;IAGlB,MAAM,CAACS,mBAAmB,OAAGtB,iCAAAA;IAE7B,MAAMuB,SAAS7B,OAAMqB,WAAW,CAC9B,CAACC;QACC,2FAA2F;QAC3FM,mBAAmB,IAAMR,oBAAoBE;IAC/C,GACA;QAACM;QAAoBR;KAAoB;IAG3C,MAAMU,YAAY9B,OAAMqB,WAAW,CACjC,CAACU;QACC,QAAI3B,4BAAAA,EAAa2B,QAAQ;~~YACvBd~~,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBe,mBAAmB,CAAC,WAAWF;YAC/Cb,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBe,mBAAmB,CAAC,aAAaH;QACnD;QACA,QAAIxB,4BAAAA,EAAa0B,QAAQ;YACvBd,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBe,mBAAmB,CAAC,YAAYF;YAChDb,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBe,mBAAmB,CAAC,aAAaH;QACnD;QACAd,YAAY;IACd,GACA;QAACc;QAAQZ;KAAe;IAG1B,MAAMgB,iBAAiBjC,OAAMqB,WAAW,CACtC,CAACK,WAA4B,CAACK;YAC5B,8FAA8F;YAC9F,+DAA+D;YAC/DpB,aAAac,OAAO,GAAGP,eAAeQ;YACtCjB,OAAOgB,OAAO,OAAGtB,oCAAAA,EAAqB4B,OAAOR,OAAO;YACpDX,MAAMa,OAAO,GAAGC;YAEhB,QAAItB,4BAAAA,EAAa2B,QAAQ;gBACvB,iDAAiD;gBACjD,IAAIA,MAAMG,MAAM,KAAKH,MAAMI,aAAa,IAAIJ,MAAMK,MAAM,KAAK,GAAG;oBAC9D;gBACF;gBACAnB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBoB,gBAAgB,CAAC,WAAWP;gBAC5Cb,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBoB,gBAAgB,CAAC,aAAaR;gBAC9Cd,YAAY;YACd;YAEA,QAAIV,4BAAAA,EAAa0B,QAAQ;gBACvBd,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBoB,gBAAgB,CAAC,YAAYP;gBAC7Cb,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBoB,gBAAgB,CAAC,aAAaR;gBAC9Cd,YAAY;YACd;QACF,GACA;QAACG;QAAgBW;QAAQC;QAAWb;KAAe;IAGrD,OAAO;QACLgB;QACAnB;IACF;AACF"}
1	+ {"version":3,"sources":["../src/hooks/useTableColumnResizeMouseHandler.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { TableColumnId, ColumnResizeState } from './types';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { NativeTouchOrMouseEvent, ReactTouchOrMouseEvent } from '@fluentui/react-utilities';\nimport { getEventClientCoords, isMouseEvent, isTouchEvent, useAnimationFrame } from '@fluentui/react-utilities';\n\nexport function useTableColumnResizeMouseHandler(columnResizeState: ColumnResizeState): {\n getOnMouseDown: (columnId: TableColumnId) => (event: ReactTouchOrMouseEvent) => void;\n dragging: boolean;\n} {\n const mouseX = React.useRef(0);\n const currentWidth = React.useRef(0);\n const colId = React.useRef<TableColumnId \| undefined>(undefined);\n const [dragging, setDragging] = React.useState<boolean>(false);\n\n const { targetDocument } = useFluent();\n\n const { getColumnWidth, setColumnWidth } = columnResizeState;\n\n const recalculatePosition = React.useCallback(\n (e: NativeTouchOrMouseEvent) => {\n const { clientX } = getEventClientCoords(e);\n const dx = clientX - mouseX.current;\n\n // Update the local width for the column and set it\n currentWidth.current += dx;\n colId.current && setColumnWidth(e, { columnId: colId.current, width: currentWidth.current });\n mouseX.current = clientX;\n },\n [setColumnWidth],\n );\n\n const [requestRecalcFrame] = useAnimationFrame();\n\n const onDrag = React.useCallback(\n (e: NativeTouchOrMouseEvent) => {\n // Using requestAnimationFrame here drastically improves resizing experience on slower CPUs\n requestRecalcFrame(() => recalculatePosition(e));\n },\n [requestRecalcFrame, recalculatePosition],\n );\n\n const onDragEnd = React.useCallback(\n (event: NativeTouchOrMouseEvent) => {\n if (isMouseEvent(event)) {\n // eslint-disable-next-line react-hooks/immutability\n targetDocument?.removeEventListener('mouseup', onDragEnd);\n targetDocument?.removeEventListener('mousemove', onDrag);\n }\n if (isTouchEvent(event)) {\n targetDocument?.removeEventListener('touchend', onDragEnd);\n targetDocument?.removeEventListener('touchmove', onDrag);\n }\n setDragging(false);\n },\n [onDrag, targetDocument],\n );\n\n const getOnMouseDown = React.useCallback(\n (columnId: TableColumnId) => (event: ReactTouchOrMouseEvent) => {\n // Keep the width locally so that we decouple the calculation of the next with from rendering.\n // This makes the whole experience much faster and more precise\n currentWidth.current = getColumnWidth(columnId);\n mouseX.current = getEventClientCoords(event).clientX;\n colId.current = columnId;\n\n if (isMouseEvent(event)) {\n // ignore other buttons than primary mouse button\n if (event.target !== event.currentTarget \|\| event.button !== 0) {\n return;\n }\n targetDocument?.addEventListener('mouseup', onDragEnd);\n targetDocument?.addEventListener('mousemove', onDrag);\n setDragging(true);\n }\n\n if (isTouchEvent(event)) {\n targetDocument?.addEventListener('touchend', onDragEnd);\n targetDocument?.addEventListener('touchmove', onDrag);\n setDragging(true);\n }\n },\n [getColumnWidth, onDrag, onDragEnd, targetDocument],\n );\n\n return {\n getOnMouseDown,\n dragging,\n };\n}\n"],"names":["React","useFluent_unstable","useFluent","getEventClientCoords","isMouseEvent","isTouchEvent","useAnimationFrame","useTableColumnResizeMouseHandler","columnResizeState","mouseX","useRef","currentWidth","colId","undefined","dragging","setDragging","useState","targetDocument","getColumnWidth","setColumnWidth","recalculatePosition","useCallback","e","clientX","dx","current","columnId","width","requestRecalcFrame","onDrag","onDragEnd","event","removeEventListener","getOnMouseDown","target","currentTarget","button","addEventListener"],"mappings":"AAAA;;;;;+BAQgBO;;;;;;;iEANO,QAAQ;qCAEiB,kCAAkC;gCAEE,4BAA4B;AAEzG,0CAA0CC,iBAAoC;IAInF,MAAMC,SAAST,OAAMU,MAAM,CAAC;IAC5B,MAAMC,eAAeX,OAAMU,MAAM,CAAC;IAClC,MAAME,QAAQZ,OAAMU,MAAM,CAA4BG;IACtD,MAAM,CAACC,UAAUC,YAAY,GAAGf,OAAMgB,QAAQ,CAAU;IAExD,MAAM,EAAEC,cAAc,EAAE,OAAGf,uCAAAA;IAE3B,MAAM,EAAEgB,cAAc,EAAEC,cAAc,EAAE,GAAGX;IAE3C,MAAMY,sBAAsBpB,OAAMqB,WAAW,CAC3C,CAACC;QACC,MAAM,EAAEC,OAAO,EAAE,OAAGpB,oCAAAA,EAAqBmB;QACzC,MAAME,KAAKD,UAAUd,OAAOgB,OAAO;QAEnC,mDAAmD;QACnDd,aAAac,OAAO,IAAID;QACxBZ,MAAMa,OAAO,IAAIN,eAAeG,GAAG;YAAEI,UAAUd,MAAMa,OAAO;YAAEE,OAAOhB,aAAac,OAAO;QAAC;QAC1FhB,OAAOgB,OAAO,GAAGF;IACnB,GACA;QAACJ;KAAe;IAGlB,MAAM,CAACS,mBAAmB,OAAGtB,iCAAAA;IAE7B,MAAMuB,SAAS7B,OAAMqB,WAAW,CAC9B,CAACC;QACC,2FAA2F;QAC3FM,mBAAmB,IAAMR,oBAAoBE;IAC/C,GACA;QAACM;QAAoBR;KAAoB;IAG3C,MAAMU,YAAY9B,OAAMqB,WAAW,CACjC,CAACU;QACC,QAAI3B,4BAAAA,EAAa2B,QAAQ;YACvB,oDAAoD;YACpDd,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBe,mBAAmB,CAAC,WAAWF;YAC/Cb,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBe,mBAAmB,CAAC,aAAaH;QACnD;QACA,QAAIxB,4BAAAA,EAAa0B,QAAQ;YACvBd,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBe,mBAAmB,CAAC,YAAYF;YAChDb,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBe,mBAAmB,CAAC,aAAaH;QACnD;QACAd,YAAY;IACd,GACA;QAACc;QAAQZ;KAAe;IAG1B,MAAMgB,iBAAiBjC,OAAMqB,WAAW,CACtC,CAACK,WAA4B,CAACK;YAC5B,8FAA8F;YAC9F,+DAA+D;YAC/DpB,aAAac,OAAO,GAAGP,eAAeQ;YACtCjB,OAAOgB,OAAO,OAAGtB,oCAAAA,EAAqB4B,OAAOR,OAAO;YACpDX,MAAMa,OAAO,GAAGC;YAEhB,QAAItB,4BAAAA,EAAa2B,QAAQ;gBACvB,iDAAiD;gBACjD,IAAIA,MAAMG,MAAM,KAAKH,MAAMI,aAAa,IAAIJ,MAAMK,MAAM,KAAK,GAAG;oBAC9D;gBACF;gBACAnB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBoB,gBAAgB,CAAC,WAAWP;gBAC5Cb,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBoB,gBAAgB,CAAC,aAAaR;gBAC9Cd,YAAY;YACd;YAEA,QAAIV,4BAAAA,EAAa0B,QAAQ;gBACvBd,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBoB,gBAAgB,CAAC,YAAYP;gBAC7Cb,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBoB,gBAAgB,CAAC,aAAaR;gBAC9Cd,YAAY;YACd;QACF,GACA;QAACG;QAAgBW;QAAQC;QAAWb;KAAe;IAGrD,OAAO;QACLgB;QACAnB;IACF;AACF"}

package/lib-commonjs/hooks/useTableColumnSizing.js CHANGED Viewed

@@ -40,7 +40,6 @@ const defaultColumnSizingState = {
     enableKeyboardMode: ()=>()=>null
 };
 function useTableColumnSizing_unstable(params) {
-    'use no memo';
     // False positive, these plugin hooks are intended to be run on every render
     return (tableState)=>useTableColumnSizingState(tableState, {
             autoFitColumns: true,

package/lib-commonjs/hooks/useTableColumnSizing.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/hooks/useTableColumnSizing.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { TableResizeHandle } from '../TableResizeHandle';\nimport type {\n ColumnWidthState,\n EnableKeyboardModeOnChangeCallback,\n TableColumnId,\n TableColumnSizingState,\n TableFeaturesState,\n UseTableColumnSizingParams,\n} from './types';\n\nimport { useMeasureElement } from './useMeasureElement';\nimport { useTableColumnResizeMouseHandler } from './useTableColumnResizeMouseHandler';\nimport { useTableColumnResizeState } from './useTableColumnResizeState';\nimport { useKeyboardResizing } from './useKeyboardResizing';\n\nexport const defaultColumnSizingState: TableColumnSizingState = {\n getColumnWidths: () => [],\n getOnMouseDown: () => () => null,\n setColumnWidth: () => null,\n getTableProps: () => ({}),\n getTableHeaderCellProps: () => ({ style: {}, columnId: '' }),\n getTableCellProps: () => ({ style: {}, columnId: '' }),\n enableKeyboardMode: () => () => null,\n};\n\nexport function useTableColumnSizing_unstable<TItem>(params?: UseTableColumnSizingParams) {\n ~~'use no memo';\n\n~~ // False positive, these plugin hooks are intended to be run on every render\n\n return (tableState: TableFeaturesState<TItem>): TableFeaturesState<TItem> =>\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useTableColumnSizingState(tableState, { autoFitColumns: true, ...params });\n}\n\nfunction getColumnStyles(column: ColumnWidthState, dragging?: boolean): React.CSSProperties {\n const width = column.width;\n\n return {\n // native styles\n width,\n // non-native element styles (flex layout)\n minWidth: width,\n maxWidth: width,\n // Fixed the unwanted sort: https://github.com/microsoft/fluentui/issues/27803\n ...(dragging ? { pointerEvents: 'none' } : {}),\n };\n}\n\nfunction useTableColumnSizingState<TItem>(\n tableState: TableFeaturesState<TItem>,\n params: UseTableColumnSizingParams = {},\n): TableFeaturesState<TItem> {\n const { columns } = tableState;\n\n // Gets the container width\n const { width, measureElementRef } = useMeasureElement();\n // Creates the state based on columns and available containerWidth\n const columnResizeState = useTableColumnResizeState(columns, width + (params?.containerWidthOffset \|\| 0), params);\n // Creates the mouse handler and attaches the state to it\n const mouseHandler = useTableColumnResizeMouseHandler(columnResizeState);\n // Creates the keyboard handler for resizing columns\n const { toggleInteractiveMode, getKeyboardResizingProps } = useKeyboardResizing(columnResizeState);\n\n const { autoFitColumns } = params;\n\n const enableKeyboardMode = React.useCallback(\n (columnId: TableColumnId, onChange?: EnableKeyboardModeOnChangeCallback) =>\n (e: React.MouseEvent \| React.TouchEvent) => {\n e.preventDefault();\n e.nativeEvent.stopPropagation();\n toggleInteractiveMode(columnId, onChange);\n },\n [toggleInteractiveMode],\n );\n\n const { getColumnById, setColumnWidth, getColumns } = columnResizeState;\n const { getOnMouseDown, dragging } = mouseHandler;\n return {\n ...tableState,\n tableRef: measureElementRef,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n columnSizing_unstable: {\n getOnMouseDown,\n setColumnWidth: (columnId: TableColumnId, w: number) => setColumnWidth(undefined, { columnId, width: w }),\n getColumnWidths: getColumns,\n getTableProps: (props = {}) => {\n return {\n ...props,\n style: {\n minWidth: 'fit-content',\n ...(props.style \|\| {}),\n },\n };\n },\n getTableHeaderCellProps: React.useCallback(\n (columnId: TableColumnId) => {\n const col = getColumnById(columnId);\n const isLastColumn = columns[columns.length - 1]?.columnId === columnId;\n\n const aside =\n isLastColumn && autoFitColumns ? null : (\n <TableResizeHandle\n onMouseDown={getOnMouseDown(columnId)}\n onTouchStart={getOnMouseDown(columnId)}\n {...getKeyboardResizingProps(columnId, col?.width \|\| 0)}\n />\n );\n\n return col\n ? {\n style: getColumnStyles(col, dragging),\n aside,\n }\n : {};\n },\n [getColumnById, columns, dragging, getKeyboardResizingProps, getOnMouseDown, autoFitColumns],\n ),\n getTableCellProps: React.useCallback(\n (columnId: TableColumnId) => {\n const col = getColumnById(columnId);\n return col ? { style: getColumnStyles(col) } : {};\n },\n [getColumnById],\n ),\n enableKeyboardMode,\n },\n };\n}\n"],"names":["React","TableResizeHandle","useMeasureElement","useTableColumnResizeMouseHandler","useTableColumnResizeState","useKeyboardResizing","defaultColumnSizingState","getColumnWidths","getOnMouseDown","setColumnWidth","getTableProps","getTableHeaderCellProps","style","columnId","getTableCellProps","enableKeyboardMode","useTableColumnSizing_unstable","params","tableState","useTableColumnSizingState","autoFitColumns","getColumnStyles","column","dragging","width","minWidth","maxWidth","pointerEvents","columns","measureElementRef","columnResizeState","containerWidthOffset","mouseHandler","toggleInteractiveMode","getKeyboardResizingProps","useCallback","onChange","e","preventDefault","nativeEvent","stopPropagation","getColumnById","getColumns","tableRef","columnSizing_unstable","w","undefined","props","col","isLastColumn","length","aside","onMouseDown","onTouchStart"],"mappings":"AAAA;;;;;;;;;;;;IAkBaM,wBAAAA;;;iCAUGU;eAAAA;;;;iEA1BO,QAAQ;mCACG,uBAAuB;mCAUvB,sBAAsB;kDACP,qCAAqC;2CAC5C,8BAA8B;qCACpC,wBAAwB;AAErD,iCAAyD;IAC9DT,iBAAiB,IAAM,EAAE;IACzBC,gBAAgB,IAAM,IAAM;IAC5BC,gBAAgB,IAAM;IACtBC,eAAe,IAAO,CAAA,EAAC,CAAA;IACvBC,yBAAyB,IAAO,CAAA;YAAEC,OAAO,CAAC;YAAGC,UAAU;SAAG,CAAA;IAC1DC,mBAAmB,IAAO,CAAA;YAAEF,OAAO,CAAC;YAAGC,UAAU;SAAG,CAAA;IACpDE,oBAAoB,IAAM,IAAM;AAClC,EAAE;AAEK,uCAA8CE,MAAmC;IACtF~~;IAEA~~,4EAA4E;IAE5E,OAAO,CAACC,aACN,AACAC,0BAA0BD,YAAY,gBADgB;YACdE,gBAAgB;YAAM,GAAGH,MAAM;QAAC;AAC5E;AAEA,SAASI,gBAAgBC,MAAwB,EAAEC,QAAkB;IACnE,MAAMC,QAAQF,OAAOE,KAAK;IAE1B,OAAO;QACL,gBAAgB;QAChBA;QACA,0CAA0C;QAC1CC,UAAUD;QACVE,UAAUF;QACV,8EAA8E;QAC9E,GAAID,WAAW;YAAEI,eAAe;QAAO,IAAI,CAAC,CAAC;IAC/C;AACF;AAEA,SAASR,0BACPD,UAAqC,EACrCD,SAAqC,CAAC,CAAC;IAEvC,MAAM,EAAEW,OAAO,EAAE,GAAGV;IAEpB,2BAA2B;IAC3B,MAAM,EAAEM,KAAK,EAAEK,iBAAiB,EAAE,OAAG3B,oCAAAA;IACrC,kEAAkE;IAClE,MAAM4B,wBAAoB1B,oDAAAA,EAA0BwB,SAASJ,QAASP,CAAAA,~~CAAAA~~,~~WAAAA,~~QAAAA,WAAAA,KAAAA,IAAAA,KAAAA,IAAAA,OAAQc,oBAAAA,AAAoB,MAAI,CAAA,EAAId;IAC1G,yDAAyD;IACzD,MAAMe,mBAAe7B,kEAAAA,EAAiC2B;IACtD,oDAAoD;IACpD,MAAM,EAAEG,qBAAqB,EAAEC,wBAAwB,EAAE,OAAG7B,wCAAAA,EAAoByB;IAEhF,MAAM,EAAEV,cAAc,EAAE,GAAGH;IAE3B,MAAMF,qBAAqBf,OAAMmC,WAAW,CAC1C,CAACtB,UAAyBuB,WACxB,CAACC;YACCA,EAAEC,cAAc;YAChBD,EAAEE,WAAW,CAACC,eAAe;YAC7BP,sBAAsBpB,UAAUuB;QAClC,GACF;QAACH;KAAsB;IAGzB,MAAM,EAAEQ,aAAa,EAAEhC,cAAc,EAAEiC,UAAU,EAAE,GAAGZ;IACtD,MAAM,EAAEtB,cAAc,EAAEe,QAAQ,EAAE,GAAGS;IACrC,OAAO;QACL,GAAGd,UAAU;QACbyB,UAAUd;QACV,gEAAgE;QAChEe,uBAAuB;YACrBpC;YACAC,gBAAgB,CAACI,UAAyBgC,IAAcpC,eAAeqC,WAAW;oBAAEjC;oBAAUW,OAAOqB;gBAAE;YACvGtC,iBAAiBmC;YACjBhC,eAAe,CAACqC,QAAQ,CAAC,CAAC;gBACxB,OAAO;oBACL,GAAGA,KAAK;oBACRnC,OAAO;wBACLa,UAAU;wBACV,GAAIsB,MAAMnC,KAAK,IAAI,CAAC,CAAC;oBACvB;gBACF;YACF;YACAD,yBAAyBX,OAAMmC,WAAW,CACxC,CAACtB;oBAEsBe;gBADrB,MAAMoB,MAAMP,cAAc5B;gBAC1B,MAAMoC,eAAerB,CAAAA,~~CAAAA~~,~~YAAAA,~~OAAO,CAACA,QAAQsB,MAAM,GAAG,EAAA,AAAE,MAAA,QAA3BtB,cAAAA,KAAAA,IAAAA,KAAAA,IAAAA,UAA6Bf,~~QAAQ~~,~~AAARA~~,~~MAAaA~~;gBAE/D,MAAMsC,QACJF,gBAAgB7B,iBAAiB,OAAA,WAAA,GAC/B,OAAA,aAAA,CAACnB,oCAAAA,EAAAA;oBACCmD,aAAa5C,eAAeK;oBAC5BwC,cAAc7C,eAAeK;oBAC5B,GAAGqB,yBAAyBrB,UAAUmC,~~SAAAA~~,QAAAA,QAAAA,KAAAA,IAAAA,KAAAA,IAAAA,IAAKxB,KAAAA,AAAK,KAAI,EAAE;;gBAI7D,OAAOwB,MACH;oBACEpC,OAAOS,gBAAgB2B,KAAKzB;oBAC5B4B;gBACF,IACA,CAAC;YACP,GACA;gBAACV;gBAAeb;gBAASL;gBAAUW;gBAA0B1B;gBAAgBY;aAAe;YAE9FN,mBAAmBd,OAAMmC,WAAW,CAClC,CAACtB;gBACC,MAAMmC,MAAMP,cAAc5B;gBAC1B,OAAOmC,MAAM;oBAAEpC,OAAOS,gBAAgB2B;gBAAK,IAAI,CAAC;YAClD,GACA;gBAACP;aAAc;YAEjB1B;QACF;IACF;AACF"}
1	+ {"version":3,"sources":["../src/hooks/useTableColumnSizing.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { TableResizeHandle } from '../TableResizeHandle';\nimport type {\n ColumnWidthState,\n EnableKeyboardModeOnChangeCallback,\n TableColumnId,\n TableColumnSizingState,\n TableFeaturesState,\n UseTableColumnSizingParams,\n} from './types';\n\nimport { useMeasureElement } from './useMeasureElement';\nimport { useTableColumnResizeMouseHandler } from './useTableColumnResizeMouseHandler';\nimport { useTableColumnResizeState } from './useTableColumnResizeState';\nimport { useKeyboardResizing } from './useKeyboardResizing';\n\nexport const defaultColumnSizingState: TableColumnSizingState = {\n getColumnWidths: () => [],\n getOnMouseDown: () => () => null,\n setColumnWidth: () => null,\n getTableProps: () => ({}),\n getTableHeaderCellProps: () => ({ style: {}, columnId: '' }),\n getTableCellProps: () => ({ style: {}, columnId: '' }),\n enableKeyboardMode: () => () => null,\n};\n\nexport function useTableColumnSizing_unstable<TItem>(params?: UseTableColumnSizingParams) {\n // False positive, these plugin hooks are intended to be run on every render\n\n return (tableState: TableFeaturesState<TItem>): TableFeaturesState<TItem> =>\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useTableColumnSizingState(tableState, { autoFitColumns: true, ...params });\n}\n\nfunction getColumnStyles(column: ColumnWidthState, dragging?: boolean): React.CSSProperties {\n const width = column.width;\n\n return {\n // native styles\n width,\n // non-native element styles (flex layout)\n minWidth: width,\n maxWidth: width,\n // Fixed the unwanted sort: https://github.com/microsoft/fluentui/issues/27803\n ...(dragging ? { pointerEvents: 'none' } : {}),\n };\n}\n\nfunction useTableColumnSizingState<TItem>(\n tableState: TableFeaturesState<TItem>,\n params: UseTableColumnSizingParams = {},\n): TableFeaturesState<TItem> {\n const { columns } = tableState;\n\n // Gets the container width\n const { width, measureElementRef } = useMeasureElement();\n // Creates the state based on columns and available containerWidth\n const columnResizeState = useTableColumnResizeState(columns, width + (params?.containerWidthOffset \|\| 0), params);\n // Creates the mouse handler and attaches the state to it\n const mouseHandler = useTableColumnResizeMouseHandler(columnResizeState);\n // Creates the keyboard handler for resizing columns\n const { toggleInteractiveMode, getKeyboardResizingProps } = useKeyboardResizing(columnResizeState);\n\n const { autoFitColumns } = params;\n\n const enableKeyboardMode = React.useCallback(\n (columnId: TableColumnId, onChange?: EnableKeyboardModeOnChangeCallback) =>\n (e: React.MouseEvent \| React.TouchEvent) => {\n e.preventDefault();\n e.nativeEvent.stopPropagation();\n toggleInteractiveMode(columnId, onChange);\n },\n [toggleInteractiveMode],\n );\n\n const { getColumnById, setColumnWidth, getColumns } = columnResizeState;\n const { getOnMouseDown, dragging } = mouseHandler;\n return {\n ...tableState,\n tableRef: measureElementRef,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n columnSizing_unstable: {\n getOnMouseDown,\n setColumnWidth: (columnId: TableColumnId, w: number) => setColumnWidth(undefined, { columnId, width: w }),\n getColumnWidths: getColumns,\n getTableProps: (props = {}) => {\n return {\n ...props,\n style: {\n minWidth: 'fit-content',\n ...(props.style \|\| {}),\n },\n };\n },\n getTableHeaderCellProps: React.useCallback(\n (columnId: TableColumnId) => {\n const col = getColumnById(columnId);\n const isLastColumn = columns[columns.length - 1]?.columnId === columnId;\n\n const aside =\n isLastColumn && autoFitColumns ? null : (\n <TableResizeHandle\n onMouseDown={getOnMouseDown(columnId)}\n onTouchStart={getOnMouseDown(columnId)}\n {...getKeyboardResizingProps(columnId, col?.width \|\| 0)}\n />\n );\n\n return col\n ? {\n style: getColumnStyles(col, dragging),\n aside,\n }\n : {};\n },\n [getColumnById, columns, dragging, getKeyboardResizingProps, getOnMouseDown, autoFitColumns],\n ),\n getTableCellProps: React.useCallback(\n (columnId: TableColumnId) => {\n const col = getColumnById(columnId);\n return col ? { style: getColumnStyles(col) } : {};\n },\n [getColumnById],\n ),\n enableKeyboardMode,\n },\n };\n}\n"],"names":["React","TableResizeHandle","useMeasureElement","useTableColumnResizeMouseHandler","useTableColumnResizeState","useKeyboardResizing","defaultColumnSizingState","getColumnWidths","getOnMouseDown","setColumnWidth","getTableProps","getTableHeaderCellProps","style","columnId","getTableCellProps","enableKeyboardMode","useTableColumnSizing_unstable","params","tableState","useTableColumnSizingState","autoFitColumns","getColumnStyles","column","dragging","width","minWidth","maxWidth","pointerEvents","columns","measureElementRef","columnResizeState","containerWidthOffset","mouseHandler","toggleInteractiveMode","getKeyboardResizingProps","useCallback","onChange","e","preventDefault","nativeEvent","stopPropagation","getColumnById","getColumns","tableRef","columnSizing_unstable","w","undefined","props","col","isLastColumn","length","aside","onMouseDown","onTouchStart"],"mappings":"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"}

package/lib-commonjs/hooks/useTableFeatures.js CHANGED Viewed

@@ -59,5 +59,6 @@ function useTableFeatures(options, plugins = []) {
         columnSizing_unstable: _useTableColumnSizing.defaultColumnSizingState,
         tableRef: /*#__PURE__*/ _react.createRef()
     };
+    // eslint-disable-next-line react-hooks/refs
     return plugins.reduce((state, plugin)=>plugin(state), initialState);
 }

package/lib-commonjs/hooks/useTableFeatures.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/hooks/useTableFeatures.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type {\n UseTableFeaturesOptions,\n TableFeaturesState,\n TableRowData,\n RowEnhancer,\n TableFeaturePlugin,\n TableSortState,\n} from './types';\nimport { defaultTableSelectionState } from './useTableSelection';\nimport { defaultTableSortState } from './useTableSort';\nimport { defaultColumnSizingState } from './useTableColumnSizing';\n\nconst defaultRowEnhancer: RowEnhancer<unknown, TableRowData<unknown>> = row => row;\n\nexport const defaultTableState: TableFeaturesState<unknown> = {\n selection: defaultTableSelectionState,\n sort: defaultTableSortState,\n getRows: () => [],\n getRowId: () => '',\n items: [],\n columns: [],\n // eslint-disable-next-line @typescript-eslint/naming-convention\n columnSizing_unstable: defaultColumnSizingState,\n tableRef: React.createRef<HTMLDivElement>(),\n};\n\nexport function useTableFeatures<TItem>(\n options: UseTableFeaturesOptions<TItem>,\n plugins: TableFeaturePlugin[] = [],\n): TableFeaturesState<TItem> {\n const { items, getRowId, columns } = options;\n\n const getRows = React.useCallback(\n <TRowState extends TableRowData<TItem>>(rowEnhancer = defaultRowEnhancer as RowEnhancer<TItem, TRowState>) => {\n return items.map((item, i) => rowEnhancer({ item, rowId: getRowId?.(item) ?? i }));\n },\n [items, getRowId],\n );\n\n const initialState: TableFeaturesState<TItem> = {\n getRowId,\n items,\n columns,\n getRows,\n selection: defaultTableSelectionState,\n sort: defaultTableSortState as TableSortState<TItem>,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n columnSizing_unstable: defaultColumnSizingState,\n tableRef: React.createRef(),\n };\n\n return plugins.reduce((state, plugin) => plugin(state), initialState);\n}\n"],"names":["React","defaultTableSelectionState","defaultTableSortState","defaultColumnSizingState","defaultRowEnhancer","row","defaultTableState","selection","sort","getRows","getRowId","items","columns","columnSizing_unstable","tableRef","createRef","useTableFeatures","options","plugins","useCallback","rowEnhancer","map","item","i","rowId","initialState","reduce","state","plugin"],"mappings":"AAAA;;;;;;;;;;;;IAiBaM,iBAAAA;;;IAYGU,gBAAAA;;;;;iEA3BO,QAAQ;mCASY,sBAAsB;8BAC3B,iBAAiB;sCACd,yBAAyB;AAElE,MAAMZ,qBAAkEC,CAAAA,MAAOA;AAExE,0BAAuD;IAC5DE,WAAWN,6CAAAA;IACXO,MAAMN,mCAAAA;IACNO,SAAS,IAAM,EAAE;IACjBC,UAAU,IAAM;IAChBC,OAAO,EAAE;IACTC,SAAS,EAAE;IACX,gEAAgE;IAChEC,uBAAuBV,8CAAAA;IACvBW,wBAAUd,OAAMe,SAAS;AAC3B,EAAE;AAEK,0BACLE,OAAuC,EACvCC,UAAgC,EAAE;IAElC,MAAM,EAAEP,KAAK,EAAED,QAAQ,EAAEE,OAAO,EAAE,GAAGK;IAErC,MAAMR,UAAUT,OAAMmB,WAAW,CAC/B,CAAwCC,cAAchB,kBAAmD;QACvG,OAAOO,MAAMU,GAAG,CAAC,CAACC,MAAMC;gBAAiCb;mBAA3BU,YAAY;gBAAEE;gBAAME,OAAOd,CAAAA,YAAAA,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWY,KAAAA,MAAAA,QAAXZ,cAAAA,KAAAA,IAAAA,YAAoBa;YAAE;;IACjF,GACA;QAACZ;QAAOD;KAAS;IAGnB,MAAMe,eAA0C;QAC9Cf;QACAC;QACAC;QACAH;QACAF,WAAWN,6CAAAA;QACXO,MAAMN,mCAAAA;QACN,gEAAgE;QAChEW,uBAAuBV,8CAAAA;QACvBW,wBAAUd,OAAMe,SAAS;IAC3B;IAEA,OAAOG,QAAQQ,MAAM,CAAC,CAACC,OAAOC,SAAWA,OAAOD,QAAQF;AAC1D"}
1	+ {"version":3,"sources":["../src/hooks/useTableFeatures.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type {\n UseTableFeaturesOptions,\n TableFeaturesState,\n TableRowData,\n RowEnhancer,\n TableFeaturePlugin,\n TableSortState,\n} from './types';\nimport { defaultTableSelectionState } from './useTableSelection';\nimport { defaultTableSortState } from './useTableSort';\nimport { defaultColumnSizingState } from './useTableColumnSizing';\n\nconst defaultRowEnhancer: RowEnhancer<unknown, TableRowData<unknown>> = row => row;\n\nexport const defaultTableState: TableFeaturesState<unknown> = {\n selection: defaultTableSelectionState,\n sort: defaultTableSortState,\n getRows: () => [],\n getRowId: () => '',\n items: [],\n columns: [],\n // eslint-disable-next-line @typescript-eslint/naming-convention\n columnSizing_unstable: defaultColumnSizingState,\n tableRef: React.createRef<HTMLDivElement>(),\n};\n\nexport function useTableFeatures<TItem>(\n options: UseTableFeaturesOptions<TItem>,\n plugins: TableFeaturePlugin[] = [],\n): TableFeaturesState<TItem> {\n const { items, getRowId, columns } = options;\n\n const getRows = React.useCallback(\n <TRowState extends TableRowData<TItem>>(rowEnhancer = defaultRowEnhancer as RowEnhancer<TItem, TRowState>) => {\n return items.map((item, i) => rowEnhancer({ item, rowId: getRowId?.(item) ?? i }));\n },\n [items, getRowId],\n );\n\n const initialState: TableFeaturesState<TItem> = {\n getRowId,\n items,\n columns,\n getRows,\n selection: defaultTableSelectionState,\n sort: defaultTableSortState as TableSortState<TItem>,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n columnSizing_unstable: defaultColumnSizingState,\n tableRef: React.createRef(),\n };\n\n // eslint-disable-next-line react-hooks/refs\n return plugins.reduce((state, plugin) => plugin(state), initialState);\n}\n"],"names":["React","defaultTableSelectionState","defaultTableSortState","defaultColumnSizingState","defaultRowEnhancer","row","defaultTableState","selection","sort","getRows","getRowId","items","columns","columnSizing_unstable","tableRef","createRef","useTableFeatures","options","plugins","useCallback","rowEnhancer","map","item","i","rowId","initialState","reduce","state","plugin"],"mappings":"AAAA;;;;;;;;;;;;IAiBaM,iBAAAA;;;IAYGU,gBAAAA;;;;;iEA3BO,QAAQ;mCASY,sBAAsB;8BAC3B,iBAAiB;sCACd,yBAAyB;AAElE,MAAMZ,qBAAkEC,CAAAA,MAAOA;AAExE,0BAAuD;IAC5DE,WAAWN,6CAAAA;IACXO,MAAMN,mCAAAA;IACNO,SAAS,IAAM,EAAE;IACjBC,UAAU,IAAM;IAChBC,OAAO,EAAE;IACTC,SAAS,EAAE;IACX,gEAAgE;IAChEC,uBAAuBV,8CAAAA;IACvBW,wBAAUd,OAAMe,SAAS;AAC3B,EAAE;AAEK,0BACLE,OAAuC,EACvCC,UAAgC,EAAE;IAElC,MAAM,EAAEP,KAAK,EAAED,QAAQ,EAAEE,OAAO,EAAE,GAAGK;IAErC,MAAMR,UAAUT,OAAMmB,WAAW,CAC/B,CAAwCC,cAAchB,kBAAmD;QACvG,OAAOO,MAAMU,GAAG,CAAC,CAACC,MAAMC;gBAAiCb;mBAA3BU,YAAY;gBAAEE;gBAAME,OAAOd,CAAAA,YAAAA,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWY,KAAAA,MAAAA,QAAXZ,cAAAA,KAAAA,IAAAA,YAAoBa;YAAE;;IACjF,GACA;QAACZ;QAAOD;KAAS;IAGnB,MAAMe,eAA0C;QAC9Cf;QACAC;QACAC;QACAH;QACAF,WAAWN,6CAAAA;QACXO,MAAMN,mCAAAA;QACN,gEAAgE;QAChEW,uBAAuBV,8CAAAA;QACvBW,wBAAUd,OAAMe,SAAS;IAC3B;IAEA,4CAA4C;IAC5C,OAAOG,QAAQQ,MAAM,CAAC,CAACC,OAAOC,SAAWA,OAAOD,QAAQF;AAC1D"}

package/lib-commonjs/hooks/useTableSelection.js CHANGED Viewed

@@ -37,7 +37,6 @@ const defaultTableSelectionState = {
     selectionMode: 'multiselect'
 };
 function useTableSelection(options) {
-    'use no memo';
     // False positive, these plugin hooks are intended to be run on every render
     // eslint-disable-next-line react-hooks/rules-of-hooks
     return (tableState)=>useTableSelectionState(tableState, options);

package/lib-commonjs/hooks/useTableSelection.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/hooks/useTableSelection.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { SelectionHookParams } from '@fluentui/react-utilities';\nimport { useEventCallback, useSelection } from '@fluentui/react-utilities';\nimport type { TableRowId, TableSelectionState, TableFeaturesState } from './types';\n\nconst noop = (): void => undefined;\n\nexport const defaultTableSelectionState: TableSelectionState = {\n allRowsSelected: false,\n clearRows: noop,\n deselectRow: noop,\n isRowSelected: () => false,\n selectRow: noop,\n selectedRows: new Set(),\n someRowsSelected: false,\n toggleAllRows: noop,\n toggleRow: noop,\n selectionMode: 'multiselect',\n};\n\nexport function useTableSelection<TItem>(\n options: SelectionHookParams,\n): (tableState: TableFeaturesState<TItem>) => TableFeaturesState<TItem> {\n ~~'use no memo';\n\n~~ // False positive, these plugin hooks are intended to be run on every render\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return (tableState: TableFeaturesState<TItem>) => useTableSelectionState(tableState, options);\n}\n\nexport function useTableSelectionState<TItem>(\n tableState: TableFeaturesState<TItem>,\n options: SelectionHookParams,\n): TableFeaturesState<TItem> {\n const { items, getRowId } = tableState;\n const { selectionMode: selectionMode, defaultSelectedItems, selectedItems, onSelectionChange } = options;\n\n const [selected, selectionMethods] = useSelection({\n selectionMode,\n defaultSelectedItems,\n selectedItems,\n onSelectionChange,\n });\n\n // Selection state can contain obselete items (i.e. rows that are removed)\n const selectableRowIds = React.useMemo(() => {\n const rowIds = new Set<TableRowId>();\n for (let i = 0; i < items.length; i++) {\n rowIds.add(getRowId?.(items[i]) ?? i);\n }\n\n return rowIds;\n }, [items, getRowId]);\n\n const allRowsSelected = React.useMemo(() => {\n if (selectionMode === 'single') {\n const selectedRow = Array.from(selected)[0];\n return selectableRowIds.has(selectedRow);\n }\n\n // multiselect case\n if (selected.size < selectableRowIds.size) {\n return false;\n }\n\n if (selectableRowIds.size === 0) {\n return false;\n }\n\n let res = true;\n selectableRowIds.forEach(selectableRowId => {\n if (!selected.has(selectableRowId)) {\n res = false;\n }\n });\n\n return res;\n }, [selectableRowIds, selected, selectionMode]);\n\n const someRowsSelected = React.useMemo(() => {\n if (selected.size <= 0) {\n return false;\n }\n\n let res = false;\n selectableRowIds.forEach(selectableRowId => {\n if (selected.has(selectableRowId)) {\n res = true;\n }\n });\n\n return res;\n }, [selectableRowIds, selected]);\n\n const toggleAllRows: TableSelectionState['toggleAllRows'] = useEventCallback(e => {\n selectionMethods.toggleAllItems(\n e,\n items.map((item, i) => getRowId?.(item) ?? i),\n );\n });\n\n const toggleRow: TableSelectionState['toggleRow'] = useEventCallback((e, rowId: TableRowId) =>\n selectionMethods.toggleItem(e, rowId),\n );\n\n const deselectRow: TableSelectionState['deselectRow'] = useEventCallback((e, rowId: TableRowId) =>\n selectionMethods.deselectItem(e, rowId),\n );\n\n const selectRow: TableSelectionState['selectRow'] = useEventCallback((e, rowId: TableRowId) =>\n selectionMethods.selectItem(e, rowId),\n );\n\n const isRowSelected: TableSelectionState['isRowSelected'] = (rowId: TableRowId) => selectionMethods.isSelected(rowId);\n\n const clearRows: TableSelectionState['clearRows'] = useEventCallback(e => selectionMethods.clearItems(e));\n\n return {\n ...tableState,\n selection: {\n selectionMode,\n someRowsSelected,\n allRowsSelected,\n selectedRows: selected,\n toggleRow,\n toggleAllRows,\n clearRows,\n deselectRow,\n selectRow,\n isRowSelected,\n },\n };\n}\n"],"names":["React","useEventCallback","useSelection","noop","undefined","defaultTableSelectionState","allRowsSelected","clearRows","deselectRow","isRowSelected","selectRow","selectedRows","Set","someRowsSelected","toggleAllRows","toggleRow","selectionMode","useTableSelection","options","tableState","useTableSelectionState","items","getRowId","defaultSelectedItems","selectedItems","onSelectionChange","selected","selectionMethods","selectableRowIds","useMemo","rowIds","i","length","add","selectedRow","Array","from","has","size","res","forEach","selectableRowId","e","toggleAllItems","map","item","rowId","toggleItem","deselectItem","selectItem","isSelected","clearItems","selection"],"mappings":"AAAA;;;;;;;;;;;;IASaK,0BAAAA;;;qBAaGY;eAAAA;;~~IAUAG~~,sBAAAA;;;;;~~iEA9BO~~,QAAQ;gCAEgB,4BAA4B;AAG3E,MAAMjB,OAAO,IAAYC;AAElB,mCAAwD;IAC7DE,iBAAiB;IACjBC,WAAWJ;IACXK,aAAaL;IACbM,eAAe,IAAM;IACrBC,WAAWP;IACXQ,cAAc,IAAIC;IAClBC,kBAAkB;IAClBC,eAAeX;IACfY,WAAWZ;IACXa,eAAe;AACjB,EAAE;AAEK,2BACLE,OAA4B;IAE5B~~;IAEA~~,4EAA4E;IAC5E,sDAAsD;IACtD,OAAO,CAACC,aAA0CC,uBAAuBD,YAAYD;AACvF;AAEO,gCACLC,UAAqC,EACrCD,OAA4B;IAE5B,MAAM,EAAEG,KAAK,EAAEC,QAAQ,EAAE,GAAGH;IAC5B,MAAM,EAAEH,eAAeA,aAAa,EAAEO,oBAAoB,EAAEC,aAAa,EAAEC,iBAAiB,EAAE,GAAGP;IAEjG,MAAM,CAACQ,UAAUC,iBAAiB,OAAGzB,4BAAAA,EAAa;QAChDc;QACAO;QACAC;QACAC;IACF;IAEA,0EAA0E;IAC1E,MAAMG,mBAAmB5B,OAAM6B,OAAO,CAAC;QACrC,MAAMC,SAAS,IAAIlB;QACnB,IAAK,IAAImB,IAAI,GAAGA,IAAIV,MAAMW,MAAM,EAAED,IAAK;gBAC1BT;YAAXQ,OAAOG,GAAG,CAACX,CAAAA,YAAAA,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWD,KAAK,CAACU,GAAE,MAAA,QAAnBT,cAAAA,KAAAA,IAAAA,YAAwBS;QACrC;QAEA,OAAOD;IACT,GAAG;QAACT;QAAOC;KAAS;IAEpB,MAAMhB,kBAAkBN,OAAM6B,OAAO,CAAC;QACpC,IAAIb,kBAAkB,UAAU;YAC9B,MAAMkB,cAAcC,MAAMC,IAAI,CAACV,SAAS,CAAC,EAAE;YAC3C,OAAOE,iBAAiBS,GAAG,CAACH;QAC9B;QAEA,mBAAmB;QACnB,IAAIR,SAASY,IAAI,GAAGV,iBAAiBU,IAAI,EAAE;YACzC,OAAO;QACT;QAEA,IAAIV,iBAAiBU,IAAI,KAAK,GAAG;YAC/B,OAAO;QACT;QAEA,IAAIC,MAAM;QACVX,iBAAiBY,OAAO,CAACC,CAAAA;YACvB,IAAI,CAACf,SAASW,GAAG,CAACI,kBAAkB;gBAClCF,MAAM;YACR;QACF;QAEA,OAAOA;IACT,GAAG;QAACX;QAAkBF;QAAUV;KAAc;IAE9C,MAAMH,mBAAmBb,OAAM6B,OAAO,CAAC;QACrC,IAAIH,SAASY,IAAI,IAAI,GAAG;YACtB,OAAO;QACT;QAEA,IAAIC,MAAM;QACVX,iBAAiBY,OAAO,CAACC,CAAAA;YACvB,IAAIf,SAASW,GAAG,CAACI,kBAAkB;gBACjCF,MAAM;YACR;QACF;QAEA,OAAOA;IACT,GAAG;QAACX;QAAkBF;KAAS;IAE/B,MAAMZ,oBAAsDb,gCAAAA,EAAiByC,CAAAA;QAC3Ef,iBAAiBgB,cAAc,CAC7BD,GACArB,MAAMuB,GAAG,CAAC,CAACC,MAAMd;gBAAMT;mBAAAA,CAAAA,YAAAA,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWuB,KAAAA,MAAAA,QAAXvB,cAAAA,KAAAA,IAAAA,YAAoBS;;IAE/C;IAEA,MAAMhB,gBAA8Cd,gCAAAA,EAAiB,CAACyC,GAAGI,QACvEnB,iBAAiBoB,UAAU,CAACL,GAAGI;IAGjC,MAAMtC,kBAAkDP,gCAAAA,EAAiB,CAACyC,GAAGI,QAC3EnB,iBAAiBqB,YAAY,CAACN,GAAGI;IAGnC,MAAMpC,gBAA8CT,gCAAAA,EAAiB,CAACyC,GAAGI,QACvEnB,iBAAiBsB,UAAU,CAACP,GAAGI;IAGjC,MAAMrC,gBAAsD,CAACqC,QAAsBnB,iBAAiBuB,UAAU,CAACJ;IAE/G,MAAMvC,gBAA8CN,gCAAAA,EAAiByC,CAAAA,IAAKf,iBAAiBwB,UAAU,CAACT;IAEtG,OAAO;QACL,GAAGvB,UAAU;QACbiC,WAAW;YACTpC;YACAH;YACAP;YACAK,cAAce;YACdX;YACAD;YACAP;YACAC;YACAE;YACAD;QACF;IACF;AACF"}
1	+ {"version":3,"sources":["../src/hooks/useTableSelection.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { SelectionHookParams } from '@fluentui/react-utilities';\nimport { useEventCallback, useSelection } from '@fluentui/react-utilities';\nimport type { TableRowId, TableSelectionState, TableFeaturesState } from './types';\n\nconst noop = (): void => undefined;\n\nexport const defaultTableSelectionState: TableSelectionState = {\n allRowsSelected: false,\n clearRows: noop,\n deselectRow: noop,\n isRowSelected: () => false,\n selectRow: noop,\n selectedRows: new Set(),\n someRowsSelected: false,\n toggleAllRows: noop,\n toggleRow: noop,\n selectionMode: 'multiselect',\n};\n\nexport function useTableSelection<TItem>(\n options: SelectionHookParams,\n): (tableState: TableFeaturesState<TItem>) => TableFeaturesState<TItem> {\n // False positive, these plugin hooks are intended to be run on every render\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return (tableState: TableFeaturesState<TItem>) => useTableSelectionState(tableState, options);\n}\n\nexport function useTableSelectionState<TItem>(\n tableState: TableFeaturesState<TItem>,\n options: SelectionHookParams,\n): TableFeaturesState<TItem> {\n const { items, getRowId } = tableState;\n const { selectionMode: selectionMode, defaultSelectedItems, selectedItems, onSelectionChange } = options;\n\n const [selected, selectionMethods] = useSelection({\n selectionMode,\n defaultSelectedItems,\n selectedItems,\n onSelectionChange,\n });\n\n // Selection state can contain obselete items (i.e. rows that are removed)\n const selectableRowIds = React.useMemo(() => {\n const rowIds = new Set<TableRowId>();\n for (let i = 0; i < items.length; i++) {\n rowIds.add(getRowId?.(items[i]) ?? i);\n }\n\n return rowIds;\n }, [items, getRowId]);\n\n const allRowsSelected = React.useMemo(() => {\n if (selectionMode === 'single') {\n const selectedRow = Array.from(selected)[0];\n return selectableRowIds.has(selectedRow);\n }\n\n // multiselect case\n if (selected.size < selectableRowIds.size) {\n return false;\n }\n\n if (selectableRowIds.size === 0) {\n return false;\n }\n\n let res = true;\n selectableRowIds.forEach(selectableRowId => {\n if (!selected.has(selectableRowId)) {\n res = false;\n }\n });\n\n return res;\n }, [selectableRowIds, selected, selectionMode]);\n\n const someRowsSelected = React.useMemo(() => {\n if (selected.size <= 0) {\n return false;\n }\n\n let res = false;\n selectableRowIds.forEach(selectableRowId => {\n if (selected.has(selectableRowId)) {\n res = true;\n }\n });\n\n return res;\n }, [selectableRowIds, selected]);\n\n const toggleAllRows: TableSelectionState['toggleAllRows'] = useEventCallback(e => {\n selectionMethods.toggleAllItems(\n e,\n items.map((item, i) => getRowId?.(item) ?? i),\n );\n });\n\n const toggleRow: TableSelectionState['toggleRow'] = useEventCallback((e, rowId: TableRowId) =>\n selectionMethods.toggleItem(e, rowId),\n );\n\n const deselectRow: TableSelectionState['deselectRow'] = useEventCallback((e, rowId: TableRowId) =>\n selectionMethods.deselectItem(e, rowId),\n );\n\n const selectRow: TableSelectionState['selectRow'] = useEventCallback((e, rowId: TableRowId) =>\n selectionMethods.selectItem(e, rowId),\n );\n\n const isRowSelected: TableSelectionState['isRowSelected'] = (rowId: TableRowId) => selectionMethods.isSelected(rowId);\n\n const clearRows: TableSelectionState['clearRows'] = useEventCallback(e => selectionMethods.clearItems(e));\n\n return {\n ...tableState,\n selection: {\n selectionMode,\n someRowsSelected,\n allRowsSelected,\n selectedRows: selected,\n toggleRow,\n toggleAllRows,\n clearRows,\n deselectRow,\n selectRow,\n isRowSelected,\n },\n };\n}\n"],"names":["React","useEventCallback","useSelection","noop","undefined","defaultTableSelectionState","allRowsSelected","clearRows","deselectRow","isRowSelected","selectRow","selectedRows","Set","someRowsSelected","toggleAllRows","toggleRow","selectionMode","useTableSelection","options","tableState","useTableSelectionState","items","getRowId","defaultSelectedItems","selectedItems","onSelectionChange","selected","selectionMethods","selectableRowIds","useMemo","rowIds","i","length","add","selectedRow","Array","from","has","size","res","forEach","selectableRowId","e","toggleAllItems","map","item","rowId","toggleItem","deselectItem","selectItem","isSelected","clearItems","selection"],"mappings":"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"}

package/lib-commonjs/hooks/useTableSort.js CHANGED Viewed

@@ -35,7 +35,6 @@ const defaultTableSortState = {
     toggleColumnSort: noop
 };
 function useTableSort(options) {
-    'use no memo';
     // False positive, these plugin hooks are intended to be run on every render
     // eslint-disable-next-line react-hooks/rules-of-hooks
     return (tableState)=>useTableSortState(tableState, options);

package/lib-commonjs/hooks/useTableSort.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/hooks/useTableSort.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type {\n TableColumnId,\n TableRowData,\n SortState,\n TableSortState,\n TableFeaturesState,\n UseTableSortOptions,\n} from './types';\n\nconst noop = (): void => undefined;\n\nexport const defaultTableSortState: TableSortState<unknown> = {\n getSortDirection: () => 'ascending',\n setColumnSort: noop,\n sort: <TRowState extends TableRowData<unknown>>(rows: TRowState[]) => [...rows],\n sortColumn: undefined,\n sortDirection: 'ascending',\n toggleColumnSort: noop,\n};\n\nexport function useTableSort<TItem>(options: UseTableSortOptions) {\n ~~'use no memo';\n\n~~ // False positive, these plugin hooks are intended to be run on every render\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return (tableState: TableFeaturesState<TItem>): TableFeaturesState<TItem> => useTableSortState(tableState, options);\n}\n\nexport function useTableSortState<TItem>(\n tableState: TableFeaturesState<TItem>,\n options: UseTableSortOptions,\n): TableFeaturesState<TItem> {\n const { columns } = tableState;\n const { sortState, defaultSortState, onSortChange: onSortChangeProp = noop } = options;\n\n const [sorted, setSorted] = useControllableState<SortState>({\n initialState: {\n sortDirection: 'ascending' as const,\n sortColumn: undefined,\n },\n defaultState: defaultSortState,\n state: sortState,\n });\n\n const { sortColumn, sortDirection } = sorted;\n\n const onSortChange = useEventCallback(onSortChangeProp);\n\n const toggleColumnSort = React.useCallback(\n (e: React.SyntheticEvent, columnId: TableColumnId \| undefined) => {\n setSorted(s => {\n const newState = { ...s, sortColumn: columnId };\n if (s.sortColumn === columnId) {\n newState.sortDirection = s.sortDirection === 'ascending' ? 'descending' : 'ascending';\n } else {\n newState.sortDirection = 'ascending';\n }\n\n onSortChange?.(e, newState);\n return newState;\n });\n },\n [onSortChange, setSorted],\n );\n\n const setColumnSort: TableSortState<TItem>['setColumnSort'] = (e, nextSortColumn, nextSortDirection) => {\n const newState = { sortColumn: nextSortColumn, sortDirection: nextSortDirection };\n onSortChange?.(e, newState);\n setSorted(newState);\n };\n\n const sort = React.useCallback(\n <TRowState extends TableRowData<TItem>>(rows: TRowState[]) => {\n return rows.slice().sort((a, b) => {\n const sortColumnDef = columns.find(column => column.columnId === sortColumn);\n if (!sortColumnDef?.compare) {\n return 0;\n }\n\n const mod = sortDirection === 'ascending' ? 1 : -1;\n return sortColumnDef.compare(a.item, b.item) * mod;\n });\n },\n [columns, sortColumn, sortDirection],\n );\n\n const getSortDirection: TableSortState<TItem>['getSortDirection'] = (columnId: TableColumnId) => {\n return sortColumn === columnId ? sortDirection : undefined;\n };\n\n return {\n ...tableState,\n sort: {\n sort,\n sortColumn,\n sortDirection,\n setColumnSort,\n toggleColumnSort,\n getSortDirection,\n },\n };\n}\n"],"names":["React","useControllableState","useEventCallback","noop","undefined","defaultTableSortState","getSortDirection","setColumnSort","sort","rows","sortColumn","sortDirection","toggleColumnSort","useTableSort","options","tableState","useTableSortState","columns","sortState","defaultSortState","onSortChange","onSortChangeProp","sorted","setSorted","initialState","defaultState","state","useCallback","e","columnId","s","newState","nextSortColumn","nextSortDirection","slice","a","b","sortColumnDef","find","column","compare","mod","item"],"mappings":"AAAA;;;;;;;;;;;;IAeaK,qBAAAA;;;gBASGQ;eAAAA;;~~IAQAG~~,iBAAAA;;;;;~~iEA9BO~~,QAAQ;gCACwB,4BAA4B;AAUnF,MAAMb,OAAO,IAAYC;AAElB,8BAAuD;IAC5DE,kBAAkB,IAAM;IACxBC,eAAeJ;IACfK,MAAM,CAA0CC,OAAsB;eAAIA;SAAK;IAC/EC,YAAYN;IACZO,eAAe;IACfC,kBAAkBT;AACpB,EAAE;AAEK,sBAA6BW,OAA4B;IAC9D~~;IAEA~~,4EAA4E;IAC5E,sDAAsD;IACtD,OAAO,CAACC,aAAqEC,kBAAkBD,YAAYD;AAC7G;AAEO,2BACLC,UAAqC,EACrCD,OAA4B;IAE5B,MAAM,EAAEG,OAAO,EAAE,GAAGF;IACpB,MAAM,EAAEG,SAAS,EAAEC,gBAAgB,EAAEC,cAAcC,mBAAmBlB,IAAI,EAAE,GAAGW;IAE/E,MAAM,CAACQ,QAAQC,UAAU,OAAGtB,oCAAAA,EAAgC;QAC1DuB,cAAc;YACZb,eAAe;YACfD,YAAYN;QACd;QACAqB,cAAcN;QACdO,OAAOR;IACT;IAEA,MAAM,EAAER,UAAU,EAAEC,aAAa,EAAE,GAAGW;IAEtC,MAAMF,~~mBAAelB~~,~~gCAAAA~~,EAAiBmB;IAEtC,MAAMT,mBAAmBZ,OAAM2B,WAAW,CACxC,CAACC,GAAyBC;QACxBN,UAAUO,CAAAA;YACR,MAAMC,WAAW;gBAAE,GAAGD,CAAC;gBAAEpB,YAAYmB;YAAS;YAC9C,IAAIC,EAAEpB,UAAU,KAAKmB,UAAU;gBAC7BE,SAASpB,aAAa,GAAGmB,EAAEnB,aAAa,KAAK,cAAc,eAAe;YAC5E,OAAO;gBACLoB,SAASpB,aAAa,GAAG;YAC3B;YAEAS,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAeQ,GAAGG;YAClB,OAAOA;QACT;IACF,GACA;QAACX;QAAcG;KAAU;IAG3B,MAAMhB,gBAAwD,CAACqB,GAAGI,gBAAgBC;QAChF,MAAMF,WAAW;YAAErB,YAAYsB;YAAgBrB,eAAesB;QAAkB;QAChFb,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAeQ,GAAGG;QAClBR,UAAUQ;IACZ;IAEA,MAAMvB,OAAOR,OAAM2B,WAAW,CAC5B,CAAwClB;QACtC,OAAOA,KAAKyB,KAAK,GAAG1B,IAAI,CAAC,CAAC2B,GAAGC;YAC3B,MAAMC,gBAAgBpB,QAAQqB,IAAI,CAACC,CAAAA,SAAUA,OAAOV,QAAQ,KAAKnB;YACjE,IAAI,EAAC2B,kBAAAA,QAAAA,kBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,cAAeG,~~OAAO~~,~~AAAPA~~,~~GAAS~~;gBAC3B,OAAO;YACT;YAEA,MAAMC,MAAM9B,kBAAkB,cAAc,IAAI,CAAC;YACjD,OAAO0B,cAAcG,OAAO,CAACL,EAAEO,IAAI,EAAEN,EAAEM,IAAI,IAAID;QACjD;IACF,GACA;QAACxB;QAASP;QAAYC;KAAc;IAGtC,MAAML,mBAA8D,CAACuB;QACnE,OAAOnB,eAAemB,WAAWlB,gBAAgBP;IACnD;IAEA,OAAO;QACL,GAAGW,UAAU;QACbP,MAAM;YACJA;YACAE;YACAC;YACAJ;YACAK;YACAN;QACF;IACF;AACF"}
1	+ {"version":3,"sources":["../src/hooks/useTableSort.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type {\n TableColumnId,\n TableRowData,\n SortState,\n TableSortState,\n TableFeaturesState,\n UseTableSortOptions,\n} from './types';\n\nconst noop = (): void => undefined;\n\nexport const defaultTableSortState: TableSortState<unknown> = {\n getSortDirection: () => 'ascending',\n setColumnSort: noop,\n sort: <TRowState extends TableRowData<unknown>>(rows: TRowState[]) => [...rows],\n sortColumn: undefined,\n sortDirection: 'ascending',\n toggleColumnSort: noop,\n};\n\nexport function useTableSort<TItem>(options: UseTableSortOptions) {\n // False positive, these plugin hooks are intended to be run on every render\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return (tableState: TableFeaturesState<TItem>): TableFeaturesState<TItem> => useTableSortState(tableState, options);\n}\n\nexport function useTableSortState<TItem>(\n tableState: TableFeaturesState<TItem>,\n options: UseTableSortOptions,\n): TableFeaturesState<TItem> {\n const { columns } = tableState;\n const { sortState, defaultSortState, onSortChange: onSortChangeProp = noop } = options;\n\n const [sorted, setSorted] = useControllableState<SortState>({\n initialState: {\n sortDirection: 'ascending' as const,\n sortColumn: undefined,\n },\n defaultState: defaultSortState,\n state: sortState,\n });\n\n const { sortColumn, sortDirection } = sorted;\n\n const onSortChange = useEventCallback(onSortChangeProp);\n\n const toggleColumnSort = React.useCallback(\n (e: React.SyntheticEvent, columnId: TableColumnId \| undefined) => {\n setSorted(s => {\n const newState = { ...s, sortColumn: columnId };\n if (s.sortColumn === columnId) {\n newState.sortDirection = s.sortDirection === 'ascending' ? 'descending' : 'ascending';\n } else {\n newState.sortDirection = 'ascending';\n }\n\n onSortChange?.(e, newState);\n return newState;\n });\n },\n [onSortChange, setSorted],\n );\n\n const setColumnSort: TableSortState<TItem>['setColumnSort'] = (e, nextSortColumn, nextSortDirection) => {\n const newState = { sortColumn: nextSortColumn, sortDirection: nextSortDirection };\n onSortChange?.(e, newState);\n setSorted(newState);\n };\n\n const sort = React.useCallback(\n <TRowState extends TableRowData<TItem>>(rows: TRowState[]) => {\n return rows.slice().sort((a, b) => {\n const sortColumnDef = columns.find(column => column.columnId === sortColumn);\n if (!sortColumnDef?.compare) {\n return 0;\n }\n\n const mod = sortDirection === 'ascending' ? 1 : -1;\n return sortColumnDef.compare(a.item, b.item) * mod;\n });\n },\n [columns, sortColumn, sortDirection],\n );\n\n const getSortDirection: TableSortState<TItem>['getSortDirection'] = (columnId: TableColumnId) => {\n return sortColumn === columnId ? sortDirection : undefined;\n };\n\n return {\n ...tableState,\n sort: {\n sort,\n sortColumn,\n sortDirection,\n setColumnSort,\n toggleColumnSort,\n getSortDirection,\n },\n };\n}\n"],"names":["React","useControllableState","useEventCallback","noop","undefined","defaultTableSortState","getSortDirection","setColumnSort","sort","rows","sortColumn","sortDirection","toggleColumnSort","useTableSort","options","tableState","useTableSortState","columns","sortState","defaultSortState","onSortChange","onSortChangeProp","sorted","setSorted","initialState","defaultState","state","useCallback","e","columnId","s","newState","nextSortColumn","nextSortDirection","slice","a","b","sortColumnDef","find","column","compare","mod","item"],"mappings":"AAAA;;;;;;;;;;;;IAeaK,qBAAAA;;;gBASGQ;eAAAA;;IAMAG,iBAAAA;;;;;iEA5BO,QAAQ;gCACwB,4BAA4B;AAUnF,MAAMb,OAAO,IAAYC;AAElB,8BAAuD;IAC5DE,kBAAkB,IAAM;IACxBC,eAAeJ;IACfK,MAAM,CAA0CC,OAAsB;eAAIA;SAAK;IAC/EC,YAAYN;IACZO,eAAe;IACfC,kBAAkBT;AACpB,EAAE;AAEK,sBAA6BW,OAA4B;IAC9D,4EAA4E;IAC5E,sDAAsD;IACtD,OAAO,CAACC,aAAqEC,kBAAkBD,YAAYD;AAC7G;AAEO,2BACLC,UAAqC,EACrCD,OAA4B;IAE5B,MAAM,EAAEG,OAAO,EAAE,GAAGF;IACpB,MAAM,EAAEG,SAAS,EAAEC,gBAAgB,EAAEC,cAAcC,mBAAmBlB,IAAI,EAAE,GAAGW;IAE/E,MAAM,CAACQ,QAAQC,UAAU,OAAGtB,oCAAAA,EAAgC;QAC1DuB,cAAc;YACZb,eAAe;YACfD,YAAYN;QACd;QACAqB,cAAcN;QACdO,OAAOR;IACT;IAEA,MAAM,EAAER,UAAU,EAAEC,aAAa,EAAE,GAAGW;IAEtC,MAAMF,eAAelB,oCAAAA,EAAiBmB;IAEtC,MAAMT,mBAAmBZ,OAAM2B,WAAW,CACxC,CAACC,GAAyBC;QACxBN,UAAUO,CAAAA;YACR,MAAMC,WAAW;gBAAE,GAAGD,CAAC;gBAAEpB,YAAYmB;YAAS;YAC9C,IAAIC,EAAEpB,UAAU,KAAKmB,UAAU;gBAC7BE,SAASpB,aAAa,GAAGmB,EAAEnB,aAAa,KAAK,cAAc,eAAe;YAC5E,OAAO;gBACLoB,SAASpB,aAAa,GAAG;YAC3B;YAEAS,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAeQ,GAAGG;YAClB,OAAOA;QACT;IACF,GACA;QAACX;QAAcG;KAAU;IAG3B,MAAMhB,gBAAwD,CAACqB,GAAGI,gBAAgBC;QAChF,MAAMF,WAAW;YAAErB,YAAYsB;YAAgBrB,eAAesB;QAAkB;QAChFb,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAeQ,GAAGG;QAClBR,UAAUQ;IACZ;IAEA,MAAMvB,OAAOR,OAAM2B,WAAW,CAC5B,CAAwClB;QACtC,OAAOA,KAAKyB,KAAK,GAAG1B,IAAI,CAAC,CAAC2B,GAAGC;YAC3B,MAAMC,gBAAgBpB,QAAQqB,IAAI,CAACC,CAAAA,SAAUA,OAAOV,QAAQ,KAAKnB;YACjE,IAAI,EAAC2B,kBAAAA,QAAAA,kBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,cAAeG,OAAAA,AAAO,GAAE;gBAC3B,OAAO;YACT;YAEA,MAAMC,MAAM9B,kBAAkB,cAAc,IAAI,CAAC;YACjD,OAAO0B,cAAcG,OAAO,CAACL,EAAEO,IAAI,EAAEN,EAAEM,IAAI,IAAID;QACjD;IACF,GACA;QAACxB;QAASP;QAAYC;KAAc;IAGtC,MAAML,mBAA8D,CAACuB;QACnE,OAAOnB,eAAemB,WAAWlB,gBAAgBP;IACnD;IAEA,OAAO;QACL,GAAGW,UAAU;QACbP,MAAM;YACJA;YACAE;YACAC;YACAJ;YACAK;YACAN;QACF;IACF;AACF"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-table",
-  "version": "9.19.15",
+  "version": "9.19.17",
   "description": "React components for building web experiences",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -13,17 +13,17 @@
   "license": "MIT",
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.8",
-    "@fluentui/react-aria": "^9.17.11",
-    "@fluentui/react-avatar": "^9.11.1",
-    "@fluentui/react-checkbox": "^9.6.1",
-    "@fluentui/react-context-selector": "^9.2.16",
+    "@fluentui/react-aria": "^9.17.13",
+    "@fluentui/react-avatar": "^9.11.3",
+    "@fluentui/react-checkbox": "^9.6.3",
+    "@fluentui/react-context-selector": "^9.2.18",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-radio": "^9.6.2",
+    "@fluentui/react-radio": "^9.6.4",
     "@fluentui/react-shared-contexts": "^9.26.2",
-    "@fluentui/react-tabster": "^9.26.14",
+    "@fluentui/react-tabster": "^9.26.16",
     "@fluentui/react-theme": "^9.2.1",
-    "@fluentui/react-utilities": "^9.26.3",
-    "@fluentui/react-jsx-runtime": "^9.4.2",
+    "@fluentui/react-utilities": "^9.26.5",
+    "@fluentui/react-jsx-runtime": "^9.4.4",
     "@griffel/react": "^1.5.32",
     "@swc/helpers": "^0.5.1"
   },