@fluentui/react-table 9.15.8 → 9.15.10

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

@@ -1 +1 @@
-{"version":3,"sources":["useMeasureElement.js"],"sourcesContent":["import * 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    // TODO: exclude types from this lint rule: https://github.com/microsoft/fluentui/issues/31286\n    // eslint-disable-next-line no-restricted-globals\n    const resizeObserverRef = React.useRef(null);\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    const measureElementRef = React.useCallback((el)=>{\n        if (!targetDocument) {\n            return;\n        }\n        // if the element is removed, stop observing it\n        if (!el && resizeObserverRef.current && container.current) {\n            resizeObserverRef.current.unobserve(container.current);\n        }\n        container.current = undefined;\n        if (el === null || el === void 0 ? void 0 : el.parentElement) {\n            var _resizeObserverRef_current;\n            container.current = el.parentElement;\n            handleResize();\n            (_resizeObserverRef_current = resizeObserverRef.current) === null || _resizeObserverRef_current === void 0 ? void 0 : _resizeObserverRef_current.observe(container.current);\n        }\n    }, [\n        targetDocument,\n        handleResize\n    ]);\n    React.useEffect(()=>{\n        resizeObserverRef.current = createResizeObserverFromDocument(targetDocument, handleResize);\n        if (!container.current || !resizeObserverRef.current) {\n            return;\n        }\n        resizeObserverRef.current.observe(container.current);\n        return ()=>{\n            var _resizeObserverRef_current;\n            (_resizeObserverRef_current = resizeObserverRef.current) === null || _resizeObserverRef_current === void 0 ? void 0 : _resizeObserverRef_current.disconnect();\n        };\n    }, [\n        handleResize,\n        targetDocument\n    ]);\n    return {\n        width,\n        measureElementRef\n    };\n}\n/**\n * FIXME - TS 3.8/3.9 don't have ResizeObserver types by default, move this to a shared utility once we bump the minbar\n * A utility method that creates a ResizeObserver from a target document\n * @param targetDocument - document to use to create the ResizeObserver\n * @param callback  - https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver/ResizeObserver#callback\n * @returns a ResizeObserver instance or null if the global does not exist on the document\n */ export function createResizeObserverFromDocument(targetDocument, callback) {\n    var _targetDocument_defaultView;\n    if (!(targetDocument === null || targetDocument === void 0 ? void 0 : (_targetDocument_defaultView = targetDocument.defaultView) === null || _targetDocument_defaultView === void 0 ? void 0 : _targetDocument_defaultView.ResizeObserver)) {\n        return null;\n    }\n    return new targetDocument.defaultView.ResizeObserver(callback);\n}\n"],"names":["useMeasureElement","createResizeObserverFromDocument","width","setWidth","React","useState","container","useRef","undefined","resizeObserverRef","targetDocument","useFluent","handleResize","useCallback","_container_current","containerWidth","current","getBoundingClientRect","measureElementRef","el","unobserve","parentElement","_resizeObserverRef_current","observe","useEffect","disconnect","callback","_targetDocument_defaultView","defaultView","ResizeObserver"],"mappings":";;;;;;;;;;;IAOoBA,iBAAiB;eAAjBA;;IAyDAC,gCAAgC;eAAhCA;;;;iEAhEG;qCACyB;AAMrC,SAASD;IAChB,MAAM,CAACE,OAAOC,SAAS,GAAGC,OAAMC,QAAQ,CAAC;IACzC,MAAMC,YAAYF,OAAMG,MAAM,CAACC;IAC/B,8FAA8F;IAC9F,iDAAiD;IACjD,MAAMC,oBAAoBL,OAAMG,MAAM,CAAC;IACvC,MAAM,EAAEG,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,kCAAkC;IAClC,MAAMC,eAAeR,OAAMS,WAAW,CAAC;QACnC,IAAIC;QACJ,MAAMC,iBAAiB,AAACD,CAAAA,qBAAqBR,UAAUU,OAAO,AAAD,MAAO,QAAQF,uBAAuB,KAAK,IAAI,KAAK,IAAIA,mBAAmBG,qBAAqB,GAAGf,KAAK;QACrKC,SAASY,kBAAkB;IAC/B,GAAG,EAAE;IACL,MAAMG,oBAAoBd,OAAMS,WAAW,CAAC,CAACM;QACzC,IAAI,CAACT,gBAAgB;YACjB;QACJ;QACA,+CAA+C;QAC/C,IAAI,CAACS,MAAMV,kBAAkBO,OAAO,IAAIV,UAAUU,OAAO,EAAE;YACvDP,kBAAkBO,OAAO,CAACI,SAAS,CAACd,UAAUU,OAAO;QACzD;QACAV,UAAUU,OAAO,GAAGR;QACpB,IAAIW,OAAO,QAAQA,OAAO,KAAK,IAAI,KAAK,IAAIA,GAAGE,aAAa,EAAE;YAC1D,IAAIC;YACJhB,UAAUU,OAAO,GAAGG,GAAGE,aAAa;YACpCT;YACCU,CAAAA,6BAA6Bb,kBAAkBO,OAAO,AAAD,MAAO,QAAQM,+BAA+B,KAAK,IAAI,KAAK,IAAIA,2BAA2BC,OAAO,CAACjB,UAAUU,OAAO;QAC9K;IACJ,GAAG;QACCN;QACAE;KACH;IACDR,OAAMoB,SAAS,CAAC;QACZf,kBAAkBO,OAAO,GAAGf,iCAAiCS,gBAAgBE;QAC7E,IAAI,CAACN,UAAUU,OAAO,IAAI,CAACP,kBAAkBO,OAAO,EAAE;YAClD;QACJ;QACAP,kBAAkBO,OAAO,CAACO,OAAO,CAACjB,UAAUU,OAAO;QACnD,OAAO;YACH,IAAIM;YACHA,CAAAA,6BAA6Bb,kBAAkBO,OAAO,AAAD,MAAO,QAAQM,+BAA+B,KAAK,IAAI,KAAK,IAAIA,2BAA2BG,UAAU;QAC/J;IACJ,GAAG;QACCb;QACAF;KACH;IACD,OAAO;QACHR;QACAgB;IACJ;AACJ;AAOW,SAASjB,iCAAiCS,cAAc,EAAEgB,QAAQ;IACzE,IAAIC;IACJ,IAAI,CAAEjB,CAAAA,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAI,AAACiB,CAAAA,8BAA8BjB,eAAekB,WAAW,AAAD,MAAO,QAAQD,gCAAgC,KAAK,IAAI,KAAK,IAAIA,4BAA4BE,cAAc,AAAD,GAAI;QACxO,OAAO;IACX;IACA,OAAO,IAAInB,eAAekB,WAAW,CAACC,cAAc,CAACH;AACzD"}
+{"version":3,"sources":["useMeasureElement.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\n\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 */\nexport function useMeasureElement<TElement extends HTMLElement = HTMLElement>() {\n  const [width, setWidth] = React.useState(0);\n\n  const container = React.useRef<HTMLElement | undefined>(undefined);\n  // TODO: exclude types from this lint rule: https://github.com/microsoft/fluentui/issues/31286\n  // eslint-disable-next-line no-restricted-globals\n  const resizeObserverRef = React.useRef<ResizeObserver | null>(null);\n\n  const { targetDocument } = useFluent();\n\n  // the handler for resize observer\n  const handleResize = React.useCallback(() => {\n    const containerWidth = container.current?.getBoundingClientRect().width;\n    setWidth(containerWidth || 0);\n  }, []);\n\n  const measureElementRef = React.useCallback(\n    (el: TElement | null) => {\n      if (!targetDocument) {\n        return;\n      }\n\n      // if the element is removed, stop observing it\n      if (!el && resizeObserverRef.current && container.current) {\n        resizeObserverRef.current.unobserve(container.current);\n      }\n\n      container.current = undefined;\n\n      if (el?.parentElement) {\n        container.current = el.parentElement;\n        handleResize();\n        resizeObserverRef.current?.observe(container.current);\n      }\n    },\n    [targetDocument, handleResize],\n  );\n\n  React.useEffect(() => {\n    resizeObserverRef.current = createResizeObserverFromDocument(targetDocument, handleResize);\n\n    if (!container.current || !resizeObserverRef.current) {\n      return;\n    }\n\n    resizeObserverRef.current.observe(container.current);\n\n    return () => {\n      resizeObserverRef.current?.disconnect();\n    };\n  }, [handleResize, targetDocument]);\n\n  return { width, measureElementRef };\n}\n\n/**\n * FIXME - TS 3.8/3.9 don't have ResizeObserver types by default, move this to a shared utility once we bump the minbar\n * A utility method that creates a ResizeObserver from a target document\n * @param targetDocument - document to use to create the ResizeObserver\n * @param callback  - https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver/ResizeObserver#callback\n * @returns a ResizeObserver instance or null if the global does not exist on the document\n */\nexport function createResizeObserverFromDocument(\n  targetDocument: Document | null | undefined,\n  callback: ResizeObserverCallback,\n) {\n  if (!targetDocument?.defaultView?.ResizeObserver) {\n    return null;\n  }\n\n  return new targetDocument.defaultView.ResizeObserver(callback);\n}\n"],"names":["createResizeObserverFromDocument","useMeasureElement","width","setWidth","React","useState","container","useRef","undefined","resizeObserverRef","targetDocument","useFluent","handleResize","useCallback","containerWidth","current","getBoundingClientRect","measureElementRef","el","unobserve","parentElement","observe","useEffect","disconnect","callback","defaultView","ResizeObserver"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAuEgBA,gCAAAA;eAAAA;;IA9DAC,iBAAAA;eAAAA;;;;iEATO;qCACyB;AAQzC,SAASA;IACd,MAAM,CAACC,OAAOC,SAAS,GAAGC,OAAMC,QAAQ,CAAC;IAEzC,MAAMC,YAAYF,OAAMG,MAAM,CAA0BC;IACxD,8FAA8F;IAC9F,iDAAiD;IACjD,MAAMC,oBAAoBL,OAAMG,MAAM,CAAwB;IAE9D,MAAM,EAAEG,cAAc,EAAE,GAAGC,IAAAA,uCAAAA;IAE3B,kCAAkC;IAClC,MAAMC,eAAeR,OAAMS,WAAW,CAAC;YACdP;QAAvB,MAAMQ,iBAAAA,AAAiBR,CAAAA,qBAAAA,UAAUS,OAAO,AAAPA,MAAO,QAAjBT,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmBU,qBAAqB,GAAGd,KAAK;QACvEC,SAASW,kBAAkB;IAC7B,GAAG,EAAE;IAEL,MAAMG,oBAAoBb,OAAMS,WAAW,CACzC,CAACK;QACC,IAAI,CAACR,gBAAgB;YACnB;QACF;QAEA,+CAA+C;QAC/C,IAAI,CAACQ,MAAMT,kBAAkBM,OAAO,IAAIT,UAAUS,OAAO,EAAE;YACzDN,kBAAkBM,OAAO,CAACI,SAAS,CAACb,UAAUS,OAAO;QACvD;QAEAT,UAAUS,OAAO,GAAGP;QAEpB,IAAIU,OAAAA,QAAAA,OAAAA,KAAAA,IAAAA,KAAAA,IAAAA,GAAIE,aAAa,EAAE;gBAGrBX;YAFAH,UAAUS,OAAO,GAAGG,GAAGE,aAAa;YACpCR;YACAH,CAAAA,6BAAAA,kBAAkBM,OAAO,AAAPA,MAAO,QAAzBN,+BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,2BAA2BY,OAAO,CAACf,UAAUS,OAAO;QACtD;IACF,GACA;QAACL;QAAgBE;KAAa;IAGhCR,OAAMkB,SAAS,CAAC;QACdb,kBAAkBM,OAAO,GAAGf,iCAAiCU,gBAAgBE;QAE7E,IAAI,CAACN,UAAUS,OAAO,IAAI,CAACN,kBAAkBM,OAAO,EAAE;YACpD;QACF;QAEAN,kBAAkBM,OAAO,CAACM,OAAO,CAACf,UAAUS,OAAO;QAEnD,OAAO;gBACLN;YAAAA,CAAAA,6BAAAA,kBAAkBM,OAAO,AAAPA,MAAO,QAAzBN,+BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,2BAA2Bc,UAAU;QACvC;IACF,GAAG;QAACX;QAAcF;KAAe;IAEjC,OAAO;QAAER;QAAOe;IAAkB;AACpC;AASO,SAASjB,iCACdU,cAA2C,EAC3Cc,QAAgC;QAE3Bd;IAAL,IAAI,CAACA,CAAAA,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,CAAAA,8BAAAA,eAAgBe,WAAW,AAAXA,MAAW,QAA3Bf,gCAAAA,KAAAA,IAAAA,KAAAA,IAAAA,4BAA6BgB,cAAc,AAAdA,GAAgB;QAChD,OAAO;IACT;IAEA,OAAO,IAAIhB,eAAee,WAAW,CAACC,cAAc,CAACF;AACvD"}

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

@@ -1 +1 @@
-{"version":3,"sources":["useTableColumnResizeMouseHandler.js"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { getEventClientCoords, isMouseEvent, isTouchEvent, useAnimationFrame } from '@fluentui/react-utilities';\nexport function useTableColumnResizeMouseHandler(columnResizeState) {\n    const mouseX = React.useRef(0);\n    const currentWidth = React.useRef(0);\n    const colId = React.useRef(undefined);\n    const [dragging, setDragging] = React.useState(false);\n    const { targetDocument } = useFluent();\n    const { getColumnWidth, setColumnWidth } = columnResizeState;\n    const recalculatePosition = React.useCallback((e)=>{\n        const { clientX } = getEventClientCoords(e);\n        const dx = clientX - mouseX.current;\n        // Update the local width for the column and set it\n        currentWidth.current += dx;\n        colId.current && setColumnWidth(e, {\n            columnId: colId.current,\n            width: currentWidth.current\n        });\n        mouseX.current = clientX;\n    }, [\n        setColumnWidth\n    ]);\n    const [requestRecalcFrame] = useAnimationFrame();\n    const onDrag = React.useCallback((e)=>{\n        // Using requestAnimationFrame here drastically improves resizing experience on slower CPUs\n        requestRecalcFrame(()=>recalculatePosition(e));\n    }, [\n        requestRecalcFrame,\n        recalculatePosition\n    ]);\n    const onDragEnd = React.useCallback((event)=>{\n        if (isMouseEvent(event)) {\n            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mouseup', onDragEnd);\n            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('mousemove', onDrag);\n        }\n        if (isTouchEvent(event)) {\n            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('touchend', onDragEnd);\n            targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('touchmove', onDrag);\n        }\n        setDragging(false);\n    }, [\n        onDrag,\n        targetDocument\n    ]);\n    const getOnMouseDown = React.useCallback((columnId)=>(event)=>{\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            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 === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mouseup', onDragEnd);\n                targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('mousemove', onDrag);\n                setDragging(true);\n            }\n            if (isTouchEvent(event)) {\n                targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('touchend', onDragEnd);\n                targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('touchmove', onDrag);\n                setDragging(true);\n            }\n        }, [\n        getColumnWidth,\n        onDrag,\n        onDragEnd,\n        targetDocument\n    ]);\n    return {\n        getOnMouseDown,\n        dragging\n    };\n}\n"],"names":["useTableColumnResizeMouseHandler","columnResizeState","mouseX","React","useRef","currentWidth","colId","undefined","dragging","setDragging","useState","targetDocument","useFluent","getColumnWidth","setColumnWidth","recalculatePosition","useCallback","e","clientX","getEventClientCoords","dx","current","columnId","width","requestRecalcFrame","useAnimationFrame","onDrag","onDragEnd","event","isMouseEvent","removeEventListener","isTouchEvent","getOnMouseDown","target","currentTarget","button","addEventListener"],"mappings":"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"}
+{"version":3,"sources":["useTableColumnResizeMouseHandler.ts"],"sourcesContent":["import * as React from 'react';\nimport { TableColumnId, ColumnResizeState } from './types';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n  NativeTouchOrMouseEvent,\n  ReactTouchOrMouseEvent,\n  getEventClientCoords,\n  isMouseEvent,\n  isTouchEvent,\n  useAnimationFrame,\n} from '@fluentui/react-utilities';\n\nexport function useTableColumnResizeMouseHandler(columnResizeState: ColumnResizeState) {\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":["useTableColumnResizeMouseHandler","columnResizeState","mouseX","React","useRef","currentWidth","colId","undefined","dragging","setDragging","useState","targetDocument","useFluent","getColumnWidth","setColumnWidth","recalculatePosition","useCallback","e","clientX","getEventClientCoords","dx","current","columnId","width","requestRecalcFrame","useAnimationFrame","onDrag","onDragEnd","event","isMouseEvent","removeEventListener","isTouchEvent","getOnMouseDown","target","currentTarget","button","addEventListener"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYgBA;;;eAAAA;;;;iEAZO;qCAEyB;gCAQzC;AAEA,SAASA,iCAAiCC,iBAAoC;IACnF,MAAMC,SAASC,OAAMC,MAAM,CAAC;IAC5B,MAAMC,eAAeF,OAAMC,MAAM,CAAC;IAClC,MAAME,QAAQH,OAAMC,MAAM,CAA4BG;IACtD,MAAM,CAACC,UAAUC,YAAY,GAAGN,OAAMO,QAAQ,CAAU;IAExD,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAAA;IAE3B,MAAM,EAAEC,cAAc,EAAEC,cAAc,EAAE,GAAGb;IAE3C,MAAMc,sBAAsBZ,OAAMa,WAAW,CAC3C,CAACC;QACC,MAAM,EAAEC,OAAO,EAAE,GAAGC,IAAAA,oCAAAA,EAAqBF;QACzC,MAAMG,KAAKF,UAAUhB,OAAOmB,OAAO;QAEnC,mDAAmD;QACnDhB,aAAagB,OAAO,IAAID;QACxBd,MAAMe,OAAO,IAAIP,eAAeG,GAAG;YAAEK,UAAUhB,MAAMe,OAAO;YAAEE,OAAOlB,aAAagB,OAAO;QAAC;QAC1FnB,OAAOmB,OAAO,GAAGH;IACnB,GACA;QAACJ;KAAe;IAGlB,MAAM,CAACU,mBAAmB,GAAGC,IAAAA,iCAAAA;IAE7B,MAAMC,SAASvB,OAAMa,WAAW,CAC9B,CAACC;QACC,2FAA2F;QAC3FO,mBAAmB,IAAMT,oBAAoBE;IAC/C,GACA;QAACO;QAAoBT;KAAoB;IAG3C,MAAMY,YAAYxB,OAAMa,WAAW,CACjC,CAACY;QACC,IAAIC,IAAAA,4BAAAA,EAAaD,QAAQ;YACvBjB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBmB,mBAAmB,CAAC,WAAWH;YAC/ChB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBmB,mBAAmB,CAAC,aAAaJ;QACnD;QACA,IAAIK,IAAAA,4BAAAA,EAAaH,QAAQ;YACvBjB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBmB,mBAAmB,CAAC,YAAYH;YAChDhB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgBmB,mBAAmB,CAAC,aAAaJ;QACnD;QACAjB,YAAY;IACd,GACA;QAACiB;QAAQf;KAAe;IAG1B,MAAMqB,iBAAiB7B,OAAMa,WAAW,CACtC,CAACM,WAA4B,CAACM;YAC5B,8FAA8F;YAC9F,+DAA+D;YAC/DvB,aAAagB,OAAO,GAAGR,eAAeS;YACtCpB,OAAOmB,OAAO,GAAGF,IAAAA,oCAAAA,EAAqBS,OAAOV,OAAO;YACpDZ,MAAMe,OAAO,GAAGC;YAEhB,IAAIO,IAAAA,4BAAAA,EAAaD,QAAQ;gBACvB,iDAAiD;gBACjD,IAAIA,MAAMK,MAAM,KAAKL,MAAMM,aAAa,IAAIN,MAAMO,MAAM,KAAK,GAAG;oBAC9D;gBACF;gBACAxB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgByB,gBAAgB,CAAC,WAAWT;gBAC5ChB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgByB,gBAAgB,CAAC,aAAaV;gBAC9CjB,YAAY;YACd;YAEA,IAAIsB,IAAAA,4BAAAA,EAAaH,QAAQ;gBACvBjB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgByB,gBAAgB,CAAC,YAAYT;gBAC7ChB,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAgByB,gBAAgB,CAAC,aAAaV;gBAC9CjB,YAAY;YACd;QACF,GACA;QAACI;QAAgBa;QAAQC;QAAWhB;KAAe;IAGrD,OAAO;QACLqB;QACAxB;IACF;AACF"}

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

@@ -1 +1 @@
-{"version":3,"sources":["useTableColumnResizeState.js"],"sourcesContent":["import { useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { columnDefinitionsToState, adjustColumnWidthsToFitContainer, getColumnById, setColumnProperty, getColumnWidth } from '../utils/columnResizeUtils';\nconst createReducer = (autoFitColumns)=>(state, action)=>{\n        switch(action.type){\n            case 'CONTAINER_WIDTH_UPDATED':\n                return {\n                    ...state,\n                    containerWidth: action.containerWidth,\n                    columnWidthState: autoFitColumns ? adjustColumnWidthsToFitContainer(state.columnWidthState, action.containerWidth) : state.columnWidthState\n                };\n            case 'COLUMNS_UPDATED':\n                const newS = columnDefinitionsToState(action.columns, state.columnWidthState, state.columnSizingOptions);\n                return {\n                    ...state,\n                    columns: action.columns,\n                    columnWidthState: autoFitColumns ? adjustColumnWidthsToFitContainer(newS, state.containerWidth) : newS\n                };\n            case 'COLUMN_SIZING_OPTIONS_UPDATED':\n                const newState = columnDefinitionsToState(state.columns, state.columnWidthState, action.columnSizingOptions);\n                return {\n                    ...state,\n                    columnSizingOptions: action.columnSizingOptions,\n                    columnWidthState: autoFitColumns ? adjustColumnWidthsToFitContainer(newState, state.containerWidth) : newState\n                };\n            case 'SET_COLUMN_WIDTH':\n                const { columnId, width } = action;\n                const { containerWidth } = state;\n                const column = getColumnById(state.columnWidthState, columnId);\n                let newColumnWidthState = [\n                    ...state.columnWidthState\n                ];\n                if (!column) {\n                    return state;\n                }\n                // Adjust the column width and measure the new total width\n                newColumnWidthState = setColumnProperty(newColumnWidthState, columnId, 'width', width);\n                // Set this width as idealWidth, because its a deliberate change, not a recalculation because of container\n                newColumnWidthState = setColumnProperty(newColumnWidthState, columnId, 'idealWidth', width);\n                // Adjust the widths to the container size\n                if (autoFitColumns) {\n                    newColumnWidthState = adjustColumnWidthsToFitContainer(newColumnWidthState, containerWidth);\n                }\n                return {\n                    ...state,\n                    columnWidthState: newColumnWidthState\n                };\n        }\n    };\nexport function useTableColumnResizeState(columns, containerWidth, params = {}) {\n    const { onColumnResize, columnSizingOptions, autoFitColumns = true } = params;\n    const reducer = React.useMemo(()=>createReducer(autoFitColumns), [\n        autoFitColumns\n    ]);\n    const [state, dispatch] = React.useReducer(reducer, {\n        columns,\n        containerWidth: 0,\n        columnWidthState: columnDefinitionsToState(columns, undefined, columnSizingOptions),\n        columnSizingOptions\n    });\n    useIsomorphicLayoutEffect(()=>{\n        dispatch({\n            type: 'CONTAINER_WIDTH_UPDATED',\n            containerWidth\n        });\n    }, [\n        containerWidth\n    ]);\n    useIsomorphicLayoutEffect(()=>{\n        dispatch({\n            type: 'COLUMNS_UPDATED',\n            columns\n        });\n    }, [\n        columns\n    ]);\n    useIsomorphicLayoutEffect(()=>{\n        dispatch({\n            type: 'COLUMN_SIZING_OPTIONS_UPDATED',\n            columnSizingOptions\n        });\n    }, [\n        columnSizingOptions\n    ]);\n    const setColumnWidth = useEventCallback((event, data)=>{\n        let { width } = data;\n        const { columnId } = data;\n        const col = getColumnById(state.columnWidthState, columnId);\n        if (!col) {\n            return;\n        }\n        width = Math.max(col.minWidth || 0, width);\n        if (onColumnResize) {\n            onColumnResize(event, {\n                columnId,\n                width\n            });\n        }\n        dispatch({\n            type: 'SET_COLUMN_WIDTH',\n            columnId,\n            width\n        });\n    });\n    return {\n        getColumnById: React.useCallback((colId)=>getColumnById(state.columnWidthState, colId), [\n            state.columnWidthState\n        ]),\n        getColumns: React.useCallback(()=>state.columnWidthState, [\n            state.columnWidthState\n        ]),\n        getColumnWidth: React.useCallback((colId)=>getColumnWidth(state.columnWidthState, colId), [\n            state.columnWidthState\n        ]),\n        setColumnWidth\n    };\n}\n"],"names":["useTableColumnResizeState","createReducer","autoFitColumns","state","action","type","containerWidth","columnWidthState","adjustColumnWidthsToFitContainer","newS","columnDefinitionsToState","columns","columnSizingOptions","newState","columnId","width","column","getColumnById","newColumnWidthState","setColumnProperty","params","onColumnResize","reducer","React","useMemo","dispatch","useReducer","undefined","useIsomorphicLayoutEffect","setColumnWidth","useEventCallback","event","data","col","Math","max","minWidth","useCallback","colId","getColumns","getColumnWidth"],"mappings":";;;;+BAiDgBA;;;eAAAA;;;;gCAjD4C;iEACrC;mCACsG;AAC7H,MAAMC,gBAAgB,CAACC,iBAAiB,CAACC,OAAOC;QACxC,OAAOA,OAAOC,IAAI;YACd,KAAK;gBACD,OAAO;oBACH,GAAGF,KAAK;oBACRG,gBAAgBF,OAAOE,cAAc;oBACrCC,kBAAkBL,iBAAiBM,IAAAA,mDAAgC,EAACL,MAAMI,gBAAgB,EAAEH,OAAOE,cAAc,IAAIH,MAAMI,gBAAgB;gBAC/I;YACJ,KAAK;gBACD,MAAME,OAAOC,IAAAA,2CAAwB,EAACN,OAAOO,OAAO,EAAER,MAAMI,gBAAgB,EAAEJ,MAAMS,mBAAmB;gBACvG,OAAO;oBACH,GAAGT,KAAK;oBACRQ,SAASP,OAAOO,OAAO;oBACvBJ,kBAAkBL,iBAAiBM,IAAAA,mDAAgC,EAACC,MAAMN,MAAMG,cAAc,IAAIG;gBACtG;YACJ,KAAK;gBACD,MAAMI,WAAWH,IAAAA,2CAAwB,EAACP,MAAMQ,OAAO,EAAER,MAAMI,gBAAgB,EAAEH,OAAOQ,mBAAmB;gBAC3G,OAAO;oBACH,GAAGT,KAAK;oBACRS,qBAAqBR,OAAOQ,mBAAmB;oBAC/CL,kBAAkBL,iBAAiBM,IAAAA,mDAAgC,EAACK,UAAUV,MAAMG,cAAc,IAAIO;gBAC1G;YACJ,KAAK;gBACD,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAE,GAAGX;gBAC5B,MAAM,EAAEE,cAAc,EAAE,GAAGH;gBAC3B,MAAMa,SAASC,IAAAA,gCAAa,EAACd,MAAMI,gBAAgB,EAAEO;gBACrD,IAAII,sBAAsB;uBACnBf,MAAMI,gBAAgB;iBAC5B;gBACD,IAAI,CAACS,QAAQ;oBACT,OAAOb;gBACX;gBACA,0DAA0D;gBAC1De,sBAAsBC,IAAAA,oCAAiB,EAACD,qBAAqBJ,UAAU,SAASC;gBAChF,0GAA0G;gBAC1GG,sBAAsBC,IAAAA,oCAAiB,EAACD,qBAAqBJ,UAAU,cAAcC;gBACrF,0CAA0C;gBAC1C,IAAIb,gBAAgB;oBAChBgB,sBAAsBV,IAAAA,mDAAgC,EAACU,qBAAqBZ;gBAChF;gBACA,OAAO;oBACH,GAAGH,KAAK;oBACRI,kBAAkBW;gBACtB;QACR;IACJ;AACG,SAASlB,0BAA0BW,OAAO,EAAEL,cAAc,EAAEc,SAAS,CAAC,CAAC;IAC1E,MAAM,EAAEC,cAAc,EAAET,mBAAmB,EAAEV,iBAAiB,IAAI,EAAE,GAAGkB;IACvE,MAAME,UAAUC,OAAMC,OAAO,CAAC,IAAIvB,cAAcC,iBAAiB;QAC7DA;KACH;IACD,MAAM,CAACC,OAAOsB,SAAS,GAAGF,OAAMG,UAAU,CAACJ,SAAS;QAChDX;QACAL,gBAAgB;QAChBC,kBAAkBG,IAAAA,2CAAwB,EAACC,SAASgB,WAAWf;QAC/DA;IACJ;IACAgB,IAAAA,yCAAyB,EAAC;QACtBH,SAAS;YACLpB,MAAM;YACNC;QACJ;IACJ,GAAG;QACCA;KACH;IACDsB,IAAAA,yCAAyB,EAAC;QACtBH,SAAS;YACLpB,MAAM;YACNM;QACJ;IACJ,GAAG;QACCA;KACH;IACDiB,IAAAA,yCAAyB,EAAC;QACtBH,SAAS;YACLpB,MAAM;YACNO;QACJ;IACJ,GAAG;QACCA;KACH;IACD,MAAMiB,iBAAiBC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC;QAC5C,IAAI,EAAEjB,KAAK,EAAE,GAAGiB;QAChB,MAAM,EAAElB,QAAQ,EAAE,GAAGkB;QACrB,MAAMC,MAAMhB,IAAAA,gCAAa,EAACd,MAAMI,gBAAgB,EAAEO;QAClD,IAAI,CAACmB,KAAK;YACN;QACJ;QACAlB,QAAQmB,KAAKC,GAAG,CAACF,IAAIG,QAAQ,IAAI,GAAGrB;QACpC,IAAIM,gBAAgB;YAChBA,eAAeU,OAAO;gBAClBjB;gBACAC;YACJ;QACJ;QACAU,SAAS;YACLpB,MAAM;YACNS;YACAC;QACJ;IACJ;IACA,OAAO;QACHE,eAAeM,OAAMc,WAAW,CAAC,CAACC,QAAQrB,IAAAA,gCAAa,EAACd,MAAMI,gBAAgB,EAAE+B,QAAQ;YACpFnC,MAAMI,gBAAgB;SACzB;QACDgC,YAAYhB,OAAMc,WAAW,CAAC,IAAIlC,MAAMI,gBAAgB,EAAE;YACtDJ,MAAMI,gBAAgB;SACzB;QACDiC,gBAAgBjB,OAAMc,WAAW,CAAC,CAACC,QAAQE,IAAAA,iCAAc,EAACrC,MAAMI,gBAAgB,EAAE+B,QAAQ;YACtFnC,MAAMI,gBAAgB;SACzB;QACDsB;IACJ;AACJ"}
+{"version":3,"sources":["useTableColumnResizeState.ts"],"sourcesContent":["import { useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport {\n  TableColumnDefinition,\n  TableColumnId,\n  ColumnResizeState,\n  ColumnWidthState,\n  UseTableColumnSizingParams,\n  TableColumnSizingOptions,\n} from './types';\nimport {\n  columnDefinitionsToState,\n  adjustColumnWidthsToFitContainer,\n  getColumnById,\n  setColumnProperty,\n  getColumnWidth,\n} from '../utils/columnResizeUtils';\n\ntype ComponentState<T> = {\n  columns: TableColumnDefinition<T>[];\n  containerWidth: number;\n  columnWidthState: ColumnWidthState[];\n  columnSizingOptions: TableColumnSizingOptions | undefined;\n};\n\ntype ColumnResizeStateAction<T> =\n  | {\n      type: 'CONTAINER_WIDTH_UPDATED';\n      containerWidth: number;\n    }\n  | {\n      type: 'COLUMNS_UPDATED';\n      columns: TableColumnDefinition<T>[];\n    }\n  | {\n      type: 'COLUMN_SIZING_OPTIONS_UPDATED';\n      columnSizingOptions: TableColumnSizingOptions | undefined;\n    }\n  | {\n      type: 'SET_COLUMN_WIDTH';\n      columnId: TableColumnId;\n      width: number;\n    };\n\nconst createReducer =\n  <T>(autoFitColumns?: boolean) =>\n  (state: ComponentState<T>, action: ColumnResizeStateAction<T>): ComponentState<T> => {\n    switch (action.type) {\n      case 'CONTAINER_WIDTH_UPDATED':\n        return {\n          ...state,\n          containerWidth: action.containerWidth,\n          columnWidthState: autoFitColumns\n            ? adjustColumnWidthsToFitContainer(state.columnWidthState, action.containerWidth)\n            : state.columnWidthState,\n        };\n\n      case 'COLUMNS_UPDATED':\n        const newS = columnDefinitionsToState(action.columns, state.columnWidthState, state.columnSizingOptions);\n        return {\n          ...state,\n          columns: action.columns,\n          columnWidthState: autoFitColumns ? adjustColumnWidthsToFitContainer(newS, state.containerWidth) : newS,\n        };\n\n      case 'COLUMN_SIZING_OPTIONS_UPDATED':\n        const newState = columnDefinitionsToState(state.columns, state.columnWidthState, action.columnSizingOptions);\n        return {\n          ...state,\n          columnSizingOptions: action.columnSizingOptions,\n          columnWidthState: autoFitColumns\n            ? adjustColumnWidthsToFitContainer(newState, state.containerWidth)\n            : newState,\n        };\n\n      case 'SET_COLUMN_WIDTH':\n        const { columnId, width } = action;\n        const { containerWidth } = state;\n\n        const column = getColumnById(state.columnWidthState, columnId);\n        let newColumnWidthState = [...state.columnWidthState];\n\n        if (!column) {\n          return state;\n        }\n\n        // Adjust the column width and measure the new total width\n        newColumnWidthState = setColumnProperty(newColumnWidthState, columnId, 'width', width);\n        // Set this width as idealWidth, because its a deliberate change, not a recalculation because of container\n        newColumnWidthState = setColumnProperty(newColumnWidthState, columnId, 'idealWidth', width);\n        // Adjust the widths to the container size\n        if (autoFitColumns) {\n          newColumnWidthState = adjustColumnWidthsToFitContainer(newColumnWidthState, containerWidth);\n        }\n\n        return { ...state, columnWidthState: newColumnWidthState };\n    }\n  };\n\nexport function useTableColumnResizeState<T>(\n  columns: TableColumnDefinition<T>[],\n  containerWidth: number,\n  params: UseTableColumnSizingParams = {},\n): ColumnResizeState {\n  const { onColumnResize, columnSizingOptions, autoFitColumns = true } = params;\n\n  const reducer = React.useMemo(() => createReducer<T>(autoFitColumns), [autoFitColumns]);\n\n  const [state, dispatch] = React.useReducer(reducer, {\n    columns,\n    containerWidth: 0,\n    columnWidthState: columnDefinitionsToState(columns, undefined, columnSizingOptions),\n    columnSizingOptions,\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    dispatch({ type: 'CONTAINER_WIDTH_UPDATED', containerWidth });\n  }, [containerWidth]);\n\n  useIsomorphicLayoutEffect(() => {\n    dispatch({ type: 'COLUMNS_UPDATED', columns });\n  }, [columns]);\n\n  useIsomorphicLayoutEffect(() => {\n    dispatch({ type: 'COLUMN_SIZING_OPTIONS_UPDATED', columnSizingOptions });\n  }, [columnSizingOptions]);\n\n  const setColumnWidth = useEventCallback(\n    (event: KeyboardEvent | MouseEvent | TouchEvent | undefined, data: { columnId: TableColumnId; width: number }) => {\n      let { width } = data;\n      const { columnId } = data;\n      const col = getColumnById(state.columnWidthState, columnId);\n      if (!col) {\n        return;\n      }\n\n      width = Math.max(col.minWidth || 0, width);\n\n      if (onColumnResize) {\n        onColumnResize(event, { columnId, width });\n      }\n      dispatch({ type: 'SET_COLUMN_WIDTH', columnId, width });\n    },\n  );\n\n  return {\n    getColumnById: React.useCallback(\n      (colId: TableColumnId) => getColumnById(state.columnWidthState, colId),\n      [state.columnWidthState],\n    ),\n    getColumns: React.useCallback(() => state.columnWidthState, [state.columnWidthState]),\n    getColumnWidth: React.useCallback(\n      (colId: TableColumnId) => getColumnWidth(state.columnWidthState, colId),\n      [state.columnWidthState],\n    ),\n    setColumnWidth,\n  };\n}\n"],"names":["useTableColumnResizeState","createReducer","autoFitColumns","state","action","type","containerWidth","columnWidthState","adjustColumnWidthsToFitContainer","newS","columnDefinitionsToState","columns","columnSizingOptions","newState","columnId","width","column","getColumnById","newColumnWidthState","setColumnProperty","params","onColumnResize","reducer","React","useMemo","dispatch","useReducer","undefined","useIsomorphicLayoutEffect","setColumnWidth","useEventCallback","event","data","col","Math","max","minWidth","useCallback","colId","getColumns","getColumnWidth"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/hooks/useTableColumnSizing.js

@@ -39,6 +39,7 @@ 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

@@ -1 +1 @@
-{"version":3,"sources":["useTableColumnSizing.js"],"sourcesContent":["import * as React from 'react';\nimport { TableResizeHandle } from '../TableResizeHandle';\nimport { useMeasureElement } from './useMeasureElement';\nimport { useTableColumnResizeMouseHandler } from './useTableColumnResizeMouseHandler';\nimport { useTableColumnResizeState } from './useTableColumnResizeState';\nimport { useKeyboardResizing } from './useKeyboardResizing';\nexport const defaultColumnSizingState = {\n    getColumnWidths: ()=>[],\n    getOnMouseDown: ()=>()=>null,\n    setColumnWidth: ()=>null,\n    getTableProps: ()=>({}),\n    getTableHeaderCellProps: ()=>({\n            style: {},\n            columnId: ''\n        }),\n    getTableCellProps: ()=>({\n            style: {},\n            columnId: ''\n        }),\n    enableKeyboardMode: ()=>()=>null\n};\nexport function useTableColumnSizing_unstable(params) {\n    // False positive, these plugin hooks are intended to be run on every render\n    return (tableState)=>// eslint-disable-next-line react-hooks/rules-of-hooks\n        useTableColumnSizingState(tableState, {\n            autoFitColumns: true,\n            ...params\n        });\n}\nfunction getColumnStyles(column, dragging) {\n    const width = column.width;\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 ? {\n            pointerEvents: 'none'\n        } : {}\n    };\n}\nfunction useTableColumnSizingState(tableState, params = {}) {\n    const { columns } = tableState;\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 === null || params === void 0 ? void 0 : 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    const { autoFitColumns } = params;\n    const enableKeyboardMode = React.useCallback((columnId, onChange)=>(e)=>{\n            e.preventDefault();\n            e.nativeEvent.stopPropagation();\n            toggleInteractiveMode(columnId, onChange);\n        }, [\n        toggleInteractiveMode\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, w)=>setColumnWidth(undefined, {\n                    columnId,\n                    width: w\n                }),\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((columnId)=>{\n                var _columns_;\n                const col = getColumnById(columnId);\n                const isLastColumn = ((_columns_ = columns[columns.length - 1]) === null || _columns_ === void 0 ? void 0 : _columns_.columnId) === columnId;\n                const aside = isLastColumn && autoFitColumns ? null : /*#__PURE__*/ React.createElement(TableResizeHandle, {\n                    onMouseDown: getOnMouseDown(columnId),\n                    onTouchStart: getOnMouseDown(columnId),\n                    ...getKeyboardResizingProps(columnId, (col === null || col === void 0 ? void 0 : col.width) || 0)\n                });\n                return col ? {\n                    style: getColumnStyles(col, dragging),\n                    aside\n                } : {};\n            }, [\n                getColumnById,\n                columns,\n                dragging,\n                getKeyboardResizingProps,\n                getOnMouseDown,\n                autoFitColumns\n            ]),\n            getTableCellProps: React.useCallback((columnId)=>{\n                const col = getColumnById(columnId);\n                return col ? {\n                    style: getColumnStyles(col)\n                } : {};\n            }, [\n                getColumnById\n            ]),\n            enableKeyboardMode\n        }\n    };\n}\n"],"names":["defaultColumnSizingState","useTableColumnSizing_unstable","getColumnWidths","getOnMouseDown","setColumnWidth","getTableProps","getTableHeaderCellProps","style","columnId","getTableCellProps","enableKeyboardMode","params","tableState","useTableColumnSizingState","autoFitColumns","getColumnStyles","column","dragging","width","minWidth","maxWidth","pointerEvents","columns","measureElementRef","useMeasureElement","columnResizeState","useTableColumnResizeState","containerWidthOffset","mouseHandler","useTableColumnResizeMouseHandler","toggleInteractiveMode","getKeyboardResizingProps","useKeyboardResizing","React","useCallback","onChange","e","preventDefault","nativeEvent","stopPropagation","getColumnById","getColumns","tableRef","columnSizing_unstable","w","undefined","props","_columns_","col","isLastColumn","length","aside","createElement","TableResizeHandle","onMouseDown","onTouchStart"],"mappings":"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"}
+{"version":3,"sources":["useTableColumnSizing.tsx"],"sourcesContent":["import * as React from 'react';\nimport { TableResizeHandle } from '../TableResizeHandle';\nimport {\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>) =>\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":["defaultColumnSizingState","useTableColumnSizing_unstable","getColumnWidths","getOnMouseDown","setColumnWidth","getTableProps","getTableHeaderCellProps","style","columnId","getTableCellProps","enableKeyboardMode","params","tableState","useTableColumnSizingState","autoFitColumns","getColumnStyles","column","dragging","width","minWidth","maxWidth","pointerEvents","columns","measureElementRef","useMeasureElement","columnResizeState","useTableColumnResizeState","containerWidthOffset","mouseHandler","useTableColumnResizeMouseHandler","toggleInteractiveMode","getKeyboardResizingProps","useKeyboardResizing","React","useCallback","onChange","e","preventDefault","nativeEvent","stopPropagation","getColumnById","getColumns","tableRef","columnSizing_unstable","w","undefined","props","col","isLastColumn","length","aside","createElement","TableResizeHandle","onMouseDown","onTouchStart"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"sources":["useTableCompositeNavigation.js"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowDown, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup, useFocusableGroup, useMergedTabsterAttributes_unstable, useFocusFinders, GroupperMoveFocusEvent, MoverMoveFocusEvent, GroupperMoveFocusActions, MoverKeys } from '@fluentui/react-tabster';\nimport { isHTMLElement } from '@fluentui/react-utilities';\nexport function useTableCompositeNavigation() {\n    const horizontalAttr = useArrowNavigationGroup({\n        axis: 'horizontal'\n    });\n    const gridAttr = useArrowNavigationGroup({\n        axis: 'grid'\n    });\n    const groupperAttr = useFocusableGroup({\n        tabBehavior: 'limited-trap-focus'\n    });\n    const { findFirstFocusable } = useFocusFinders();\n    const { targetDocument } = useFluent();\n    const rowAttr = useMergedTabsterAttributes_unstable(horizontalAttr, groupperAttr);\n    const onKeyDown = React.useCallback((e)=>{\n        if (!targetDocument) {\n            return;\n        }\n        let activeElement = targetDocument.activeElement;\n        if (!activeElement || !e.currentTarget.contains(activeElement)) {\n            return;\n        }\n        const activeElementRole = activeElement.getAttribute('role');\n        // Enter groupper when in row focus mode to navigate cells\n        if (e.key === ArrowRight && activeElementRole === 'row' && isHTMLElement(activeElement)) {\n            var _findFirstFocusable;\n            (_findFirstFocusable = findFirstFocusable(activeElement)) === null || _findFirstFocusable === void 0 ? void 0 : _findFirstFocusable.focus();\n        }\n        if (activeElementRole === 'row') {\n            return;\n        }\n        const isInCell = (()=>{\n            let cur = isHTMLElement(activeElement) ? activeElement : null;\n            while(cur){\n                const curRole = cur.getAttribute('role');\n                if (curRole === 'cell' || curRole === 'gridcell') {\n                    return true;\n                }\n                cur = cur.parentElement;\n            }\n            return false;\n        })();\n        // Escape groupper focus trap before arrow down\n        if ((e.key === ArrowDown || e.key === ArrowUp) && isInCell) {\n            activeElement.dispatchEvent(new GroupperMoveFocusEvent({\n                action: GroupperMoveFocusActions.Escape\n            }));\n            activeElement = targetDocument.activeElement;\n            if (activeElement) {\n                activeElement.dispatchEvent(new MoverMoveFocusEvent({\n                    key: MoverKeys[e.key]\n                }));\n            }\n        }\n    }, [\n        targetDocument,\n        findFirstFocusable\n    ]);\n    return {\n        onTableKeyDown: onKeyDown,\n        tableTabsterAttribute: gridAttr,\n        tableRowTabsterAttribute: rowAttr\n    };\n}\n"],"names":["useTableCompositeNavigation","horizontalAttr","useArrowNavigationGroup","axis","gridAttr","groupperAttr","useFocusableGroup","tabBehavior","findFirstFocusable","useFocusFinders","targetDocument","useFluent","rowAttr","useMergedTabsterAttributes_unstable","onKeyDown","React","useCallback","e","activeElement","currentTarget","contains","activeElementRole","getAttribute","key","ArrowRight","isHTMLElement","_findFirstFocusable","focus","isInCell","cur","curRole","parentElement","ArrowDown","ArrowUp","dispatchEvent","GroupperMoveFocusEvent","action","GroupperMoveFocusActions","Escape","MoverMoveFocusEvent","MoverKeys","onTableKeyDown","tableTabsterAttribute","tableRowTabsterAttribute"],"mappings":";;;;+BAKgBA;;;eAAAA;;;;iEALO;qCACyB;8BACD;8BACoJ;gCACrK;AACvB,SAASA;IACZ,MAAMC,iBAAiBC,IAAAA,qCAAuB,EAAC;QAC3CC,MAAM;IACV;IACA,MAAMC,WAAWF,IAAAA,qCAAuB,EAAC;QACrCC,MAAM;IACV;IACA,MAAME,eAAeC,IAAAA,+BAAiB,EAAC;QACnCC,aAAa;IACjB;IACA,MAAM,EAAEC,kBAAkB,EAAE,GAAGC,IAAAA,6BAAe;IAC9C,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,MAAMC,UAAUC,IAAAA,iDAAmC,EAACZ,gBAAgBI;IACpE,MAAMS,YAAYC,OAAMC,WAAW,CAAC,CAACC;QACjC,IAAI,CAACP,gBAAgB;YACjB;QACJ;QACA,IAAIQ,gBAAgBR,eAAeQ,aAAa;QAChD,IAAI,CAACA,iBAAiB,CAACD,EAAEE,aAAa,CAACC,QAAQ,CAACF,gBAAgB;YAC5D;QACJ;QACA,MAAMG,oBAAoBH,cAAcI,YAAY,CAAC;QACrD,0DAA0D;QAC1D,IAAIL,EAAEM,GAAG,KAAKC,wBAAU,IAAIH,sBAAsB,SAASI,IAAAA,6BAAa,EAACP,gBAAgB;YACrF,IAAIQ;YACHA,CAAAA,sBAAsBlB,mBAAmBU,cAAa,MAAO,QAAQQ,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBC,KAAK;QAC7I;QACA,IAAIN,sBAAsB,OAAO;YAC7B;QACJ;QACA,MAAMO,WAAW,AAAC,CAAA;YACd,IAAIC,MAAMJ,IAAAA,6BAAa,EAACP,iBAAiBA,gBAAgB;YACzD,MAAMW,IAAI;gBACN,MAAMC,UAAUD,IAAIP,YAAY,CAAC;gBACjC,IAAIQ,YAAY,UAAUA,YAAY,YAAY;oBAC9C,OAAO;gBACX;gBACAD,MAAMA,IAAIE,aAAa;YAC3B;YACA,OAAO;QACX,CAAA;QACA,+CAA+C;QAC/C,IAAI,AAACd,CAAAA,EAAEM,GAAG,KAAKS,uBAAS,IAAIf,EAAEM,GAAG,KAAKU,qBAAO,AAAD,KAAML,UAAU;YACxDV,cAAcgB,aAAa,CAAC,IAAIC,oCAAsB,CAAC;gBACnDC,QAAQC,sCAAwB,CAACC,MAAM;YAC3C;YACApB,gBAAgBR,eAAeQ,aAAa;YAC5C,IAAIA,eAAe;gBACfA,cAAcgB,aAAa,CAAC,IAAIK,iCAAmB,CAAC;oBAChDhB,KAAKiB,uBAAS,CAACvB,EAAEM,GAAG,CAAC;gBACzB;YACJ;QACJ;IACJ,GAAG;QACCb;QACAF;KACH;IACD,OAAO;QACHiC,gBAAgB3B;QAChB4B,uBAAuBtC;QACvBuC,0BAA0B/B;IAC9B;AACJ"}
+{"version":3,"sources":["useTableCompositeNavigation.ts"],"sourcesContent":["import * as React from 'react';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { ArrowDown, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';\nimport {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useMergedTabsterAttributes_unstable,\n  TabsterDOMAttribute,\n  useFocusFinders,\n  GroupperMoveFocusEvent,\n  MoverMoveFocusEvent,\n  GroupperMoveFocusActions,\n  MoverKeys,\n} from '@fluentui/react-tabster';\nimport { isHTMLElement } from '@fluentui/react-utilities';\n\nexport function useTableCompositeNavigation(): {\n  onTableKeyDown: React.KeyboardEventHandler;\n  tableTabsterAttribute: TabsterDOMAttribute;\n  tableRowTabsterAttribute: TabsterDOMAttribute;\n} {\n  const horizontalAttr = useArrowNavigationGroup({ axis: 'horizontal' });\n  const gridAttr = useArrowNavigationGroup({ axis: 'grid' });\n  const groupperAttr = useFocusableGroup({ tabBehavior: 'limited-trap-focus' });\n  const { findFirstFocusable } = useFocusFinders();\n  const { targetDocument } = useFluent();\n\n  const rowAttr = useMergedTabsterAttributes_unstable(horizontalAttr, groupperAttr);\n\n  const onKeyDown: React.KeyboardEventHandler = React.useCallback(\n    e => {\n      if (!targetDocument) {\n        return;\n      }\n\n      let activeElement = targetDocument.activeElement;\n      if (!activeElement || !e.currentTarget.contains(activeElement)) {\n        return;\n      }\n      const activeElementRole = activeElement.getAttribute('role');\n\n      // Enter groupper when in row focus mode to navigate cells\n      if (e.key === ArrowRight && activeElementRole === 'row' && isHTMLElement(activeElement)) {\n        findFirstFocusable(activeElement)?.focus();\n      }\n\n      if (activeElementRole === 'row') {\n        return;\n      }\n\n      const isInCell = (() => {\n        let cur = isHTMLElement(activeElement) ? activeElement : null;\n        while (cur) {\n          const curRole = cur.getAttribute('role');\n          if (curRole === 'cell' || curRole === 'gridcell') {\n            return true;\n          }\n\n          cur = cur.parentElement;\n        }\n\n        return false;\n      })();\n\n      // Escape groupper focus trap before arrow down\n      if ((e.key === ArrowDown || e.key === ArrowUp) && isInCell) {\n        activeElement.dispatchEvent(new GroupperMoveFocusEvent({ action: GroupperMoveFocusActions.Escape }));\n\n        activeElement = targetDocument.activeElement;\n\n        if (activeElement) {\n          activeElement.dispatchEvent(new MoverMoveFocusEvent({ key: MoverKeys[e.key] }));\n        }\n      }\n    },\n    [targetDocument, findFirstFocusable],\n  );\n\n  return {\n    onTableKeyDown: onKeyDown,\n    tableTabsterAttribute: gridAttr,\n    tableRowTabsterAttribute: rowAttr,\n  };\n}\n"],"names":["useTableCompositeNavigation","horizontalAttr","useArrowNavigationGroup","axis","gridAttr","groupperAttr","useFocusableGroup","tabBehavior","findFirstFocusable","useFocusFinders","targetDocument","useFluent","rowAttr","useMergedTabsterAttributes_unstable","onKeyDown","React","useCallback","e","activeElement","currentTarget","contains","activeElementRole","getAttribute","key","ArrowRight","isHTMLElement","focus","isInCell","cur","curRole","parentElement","ArrowDown","ArrowUp","dispatchEvent","GroupperMoveFocusEvent","action","GroupperMoveFocusActions","Escape","MoverMoveFocusEvent","MoverKeys","onTableKeyDown","tableTabsterAttribute","tableRowTabsterAttribute"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAgBgBA;;;eAAAA;;;;iEAhBO;qCACyB;8BACD;8BAWxC;gCACuB;AAEvB,SAASA;IAKd,MAAMC,iBAAiBC,IAAAA,qCAAAA,EAAwB;QAAEC,MAAM;IAAa;IACpE,MAAMC,WAAWF,IAAAA,qCAAAA,EAAwB;QAAEC,MAAM;IAAO;IACxD,MAAME,eAAeC,IAAAA,+BAAAA,EAAkB;QAAEC,aAAa;IAAqB;IAC3E,MAAM,EAAEC,kBAAkB,EAAE,GAAGC,IAAAA,6BAAAA;IAC/B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAAA;IAE3B,MAAMC,UAAUC,IAAAA,iDAAAA,EAAoCZ,gBAAgBI;IAEpE,MAAMS,YAAwCC,OAAMC,WAAW,CAC7DC,CAAAA;QACE,IAAI,CAACP,gBAAgB;YACnB;QACF;QAEA,IAAIQ,gBAAgBR,eAAeQ,aAAa;QAChD,IAAI,CAACA,iBAAiB,CAACD,EAAEE,aAAa,CAACC,QAAQ,CAACF,gBAAgB;YAC9D;QACF;QACA,MAAMG,oBAAoBH,cAAcI,YAAY,CAAC;QAErD,0DAA0D;QAC1D,IAAIL,EAAEM,GAAG,KAAKC,wBAAAA,IAAcH,sBAAsB,SAASI,IAAAA,6BAAAA,EAAcP,gBAAgB;gBACvFV;YAAAA,CAAAA,sBAAAA,mBAAmBU,cAAAA,MAAAA,QAAnBV,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAmCkB,KAAK;QAC1C;QAEA,IAAIL,sBAAsB,OAAO;YAC/B;QACF;QAEA,MAAMM,WAAW,AAAC,CAAA;YAChB,IAAIC,MAAMH,IAAAA,6BAAAA,EAAcP,iBAAiBA,gBAAgB;YACzD,MAAOU,IAAK;gBACV,MAAMC,UAAUD,IAAIN,YAAY,CAAC;gBACjC,IAAIO,YAAY,UAAUA,YAAY,YAAY;oBAChD,OAAO;gBACT;gBAEAD,MAAMA,IAAIE,aAAa;YACzB;YAEA,OAAO;QACT,CAAA;QAEA,+CAA+C;QAC/C,IAAI,AAACb,CAAAA,EAAEM,GAAG,KAAKQ,uBAAAA,IAAad,EAAEM,GAAG,KAAKS,qBAAM,AAANA,KAAYL,UAAU;YAC1DT,cAAce,aAAa,CAAC,IAAIC,oCAAAA,CAAuB;gBAAEC,QAAQC,sCAAAA,CAAyBC,MAAM;YAAC;YAEjGnB,gBAAgBR,eAAeQ,aAAa;YAE5C,IAAIA,eAAe;gBACjBA,cAAce,aAAa,CAAC,IAAIK,iCAAAA,CAAoB;oBAAEf,KAAKgB,uBAAS,CAACtB,EAAEM,GAAG,CAAC;gBAAC;YAC9E;QACF;IACF,GACA;QAACb;QAAgBF;KAAmB;IAGtC,OAAO;QACLgC,gBAAgB1B;QAChB2B,uBAAuBrC;QACvBsC,0BAA0B9B;IAC5B;AACF"}

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

@@ -1 +1 @@
-{"version":3,"sources":["useTableFeatures.js"],"sourcesContent":["import * as React from 'react';\nimport { defaultTableSelectionState } from './useTableSelection';\nimport { defaultTableSortState } from './useTableSort';\nimport { defaultColumnSizingState } from './useTableColumnSizing';\nconst defaultRowEnhancer = (row)=>row;\nexport const defaultTableState = {\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()\n};\nexport function useTableFeatures(options, plugins = []) {\n    const { items, getRowId, columns } = options;\n    const getRows = React.useCallback((rowEnhancer = defaultRowEnhancer)=>{\n        return items.map((item, i)=>{\n            var _getRowId;\n            return rowEnhancer({\n                item,\n                rowId: (_getRowId = getRowId === null || getRowId === void 0 ? void 0 : getRowId(item)) !== null && _getRowId !== void 0 ? _getRowId : i\n            });\n        });\n    }, [\n        items,\n        getRowId\n    ]);\n    const initialState = {\n        getRowId,\n        items,\n        columns,\n        getRows,\n        selection: defaultTableSelectionState,\n        sort: defaultTableSortState,\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        columnSizing_unstable: defaultColumnSizingState,\n        tableRef: React.createRef()\n    };\n    return plugins.reduce((state, plugin)=>plugin(state), initialState);\n}\n"],"names":["defaultTableState","useTableFeatures","defaultRowEnhancer","row","selection","defaultTableSelectionState","sort","defaultTableSortState","getRows","getRowId","items","columns","columnSizing_unstable","defaultColumnSizingState","tableRef","React","createRef","options","plugins","useCallback","rowEnhancer","map","item","i","_getRowId","rowId","initialState","reduce","state","plugin"],"mappings":";;;;;;;;;;;IAKaA,iBAAiB;eAAjBA;;IAWGC,gBAAgB;eAAhBA;;;;iEAhBO;mCACoB;8BACL;sCACG;AACzC,MAAMC,qBAAqB,CAACC,MAAMA;AAC3B,MAAMH,oBAAoB;IAC7BI,WAAWC,6CAA0B;IACrCC,MAAMC,mCAAqB;IAC3BC,SAAS,IAAI,EAAE;IACfC,UAAU,IAAI;IACdC,OAAO,EAAE;IACTC,SAAS,EAAE;IACX,gEAAgE;IAChEC,uBAAuBC,8CAAwB;IAC/CC,wBAAUC,OAAMC,SAAS;AAC7B;AACO,SAASf,iBAAiBgB,OAAO,EAAEC,UAAU,EAAE;IAClD,MAAM,EAAER,KAAK,EAAED,QAAQ,EAAEE,OAAO,EAAE,GAAGM;IACrC,MAAMT,UAAUO,OAAMI,WAAW,CAAC,CAACC,cAAclB,kBAAkB;QAC/D,OAAOQ,MAAMW,GAAG,CAAC,CAACC,MAAMC;YACpB,IAAIC;YACJ,OAAOJ,YAAY;gBACfE;gBACAG,OAAO,AAACD,CAAAA,YAAYf,aAAa,QAAQA,aAAa,KAAK,IAAI,KAAK,IAAIA,SAASa,KAAI,MAAO,QAAQE,cAAc,KAAK,IAAIA,YAAYD;YAC3I;QACJ;IACJ,GAAG;QACCb;QACAD;KACH;IACD,MAAMiB,eAAe;QACjBjB;QACAC;QACAC;QACAH;QACAJ,WAAWC,6CAA0B;QACrCC,MAAMC,mCAAqB;QAC3B,gEAAgE;QAChEK,uBAAuBC,8CAAwB;QAC/CC,wBAAUC,OAAMC,SAAS;IAC7B;IACA,OAAOE,QAAQS,MAAM,CAAC,CAACC,OAAOC,SAASA,OAAOD,QAAQF;AAC1D"}
+{"version":3,"sources":["useTableFeatures.ts"],"sourcesContent":["import * 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":["defaultTableState","useTableFeatures","defaultRowEnhancer","row","selection","defaultTableSelectionState","sort","defaultTableSortState","getRows","getRowId","items","columns","columnSizing_unstable","defaultColumnSizingState","tableRef","React","createRef","options","plugins","useCallback","rowEnhancer","map","item","i","rowId","initialState","reduce","state","plugin"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAeaA,iBAAAA;eAAAA;;IAYGC,gBAAAA;eAAAA;;;;iEA3BO;mCASoB;8BACL;sCACG;AAEzC,MAAMC,qBAAkEC,CAAAA,MAAOA;AAExE,MAAMH,oBAAiD;IAC5DI,WAAWC,6CAAAA;IACXC,MAAMC,mCAAAA;IACNC,SAAS,IAAM,EAAE;IACjBC,UAAU,IAAM;IAChBC,OAAO,EAAE;IACTC,SAAS,EAAE;IACX,gEAAgE;IAChEC,uBAAuBC,8CAAAA;IACvBC,wBAAUC,OAAMC,SAAS;AAC3B;AAEO,SAASf,iBACdgB,OAAuC,EACvCC,UAAgC,EAAE;IAElC,MAAM,EAAER,KAAK,EAAED,QAAQ,EAAEE,OAAO,EAAE,GAAGM;IAErC,MAAMT,UAAUO,OAAMI,WAAW,CAC/B,CAAwCC,cAAclB,kBAAmD;QACvG,OAAOQ,MAAMW,GAAG,CAAC,CAACC,MAAMC;gBAAiCd;mBAA3BW,YAAY;gBAAEE;gBAAME,OAAOf,CAAAA,YAAAA,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWa,KAAAA,MAAAA,QAAXb,cAAAA,KAAAA,IAAAA,YAAoBc;YAAE;QAAC;IAClF,GACA;QAACb;QAAOD;KAAS;IAGnB,MAAMgB,eAA0C;QAC9ChB;QACAC;QACAC;QACAH;QACAJ,WAAWC,6CAAAA;QACXC,MAAMC,mCAAAA;QACN,gEAAgE;QAChEK,uBAAuBC,8CAAAA;QACvBC,wBAAUC,OAAMC,SAAS;IAC3B;IAEA,OAAOE,QAAQQ,MAAM,CAAC,CAACC,OAAOC,SAAWA,OAAOD,QAAQF;AAC1D"}

package/lib-commonjs/hooks/useTableSelection.js

@@ -36,6 +36,7 @@ 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

@@ -1 +1 @@
-{"version":3,"sources":["useTableSelection.js"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useSelection } from '@fluentui/react-utilities';\nconst noop = ()=>undefined;\nexport const defaultTableSelectionState = {\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};\nexport function useTableSelection(options) {\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)=>useTableSelectionState(tableState, options);\n}\nexport function useTableSelectionState(tableState, options) {\n    const { items, getRowId } = tableState;\n    const { selectionMode: selectionMode, defaultSelectedItems, selectedItems, onSelectionChange } = options;\n    const [selected, selectionMethods] = useSelection({\n        selectionMode,\n        defaultSelectedItems,\n        selectedItems,\n        onSelectionChange\n    });\n    // Selection state can contain obselete items (i.e. rows that are removed)\n    const selectableRowIds = React.useMemo(()=>{\n        const rowIds = new Set();\n        for(let i = 0; i < items.length; i++){\n            var _getRowId;\n            rowIds.add((_getRowId = getRowId === null || getRowId === void 0 ? void 0 : getRowId(items[i])) !== null && _getRowId !== void 0 ? _getRowId : i);\n        }\n        return rowIds;\n    }, [\n        items,\n        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        // multiselect case\n        if (selected.size < selectableRowIds.size) {\n            return false;\n        }\n        if (selectableRowIds.size === 0) {\n            return false;\n        }\n        let res = true;\n        selectableRowIds.forEach((selectableRowId)=>{\n            if (!selected.has(selectableRowId)) {\n                res = false;\n            }\n        });\n        return res;\n    }, [\n        selectableRowIds,\n        selected,\n        selectionMode\n    ]);\n    const someRowsSelected = React.useMemo(()=>{\n        if (selected.size <= 0) {\n            return false;\n        }\n        let res = false;\n        selectableRowIds.forEach((selectableRowId)=>{\n            if (selected.has(selectableRowId)) {\n                res = true;\n            }\n        });\n        return res;\n    }, [\n        selectableRowIds,\n        selected\n    ]);\n    const toggleAllRows = useEventCallback((e)=>{\n        selectionMethods.toggleAllItems(e, items.map((item, i)=>{\n            var _getRowId;\n            return (_getRowId = getRowId === null || getRowId === void 0 ? void 0 : getRowId(item)) !== null && _getRowId !== void 0 ? _getRowId : i;\n        }));\n    });\n    const toggleRow = useEventCallback((e, rowId)=>selectionMethods.toggleItem(e, rowId));\n    const deselectRow = useEventCallback((e, rowId)=>selectionMethods.deselectItem(e, rowId));\n    const selectRow = useEventCallback((e, rowId)=>selectionMethods.selectItem(e, rowId));\n    const isRowSelected = (rowId)=>selectionMethods.isSelected(rowId);\n    const clearRows = useEventCallback((e)=>selectionMethods.clearItems(e));\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":["defaultTableSelectionState","useTableSelection","useTableSelectionState","noop","undefined","allRowsSelected","clearRows","deselectRow","isRowSelected","selectRow","selectedRows","Set","someRowsSelected","toggleAllRows","toggleRow","selectionMode","options","tableState","items","getRowId","defaultSelectedItems","selectedItems","onSelectionChange","selected","selectionMethods","useSelection","selectableRowIds","React","useMemo","rowIds","i","length","_getRowId","add","selectedRow","Array","from","has","size","res","forEach","selectableRowId","useEventCallback","e","toggleAllItems","map","item","rowId","toggleItem","deselectItem","selectItem","isSelected","clearItems","selection"],"mappings":"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"}
+{"version":3,"sources":["useTableSelection.ts"],"sourcesContent":["import * as React from 'react';\nimport { SelectionHookParams, useEventCallback, useSelection } from '@fluentui/react-utilities';\nimport type { TableRowId, TableSelectionState, TableFeaturesState } from './types';\n\nconst noop = () => 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>(options: SelectionHookParams) {\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":["defaultTableSelectionState","useTableSelection","useTableSelectionState","noop","undefined","allRowsSelected","clearRows","deselectRow","isRowSelected","selectRow","selectedRows","Set","someRowsSelected","toggleAllRows","toggleRow","selectionMode","options","tableState","items","getRowId","defaultSelectedItems","selectedItems","onSelectionChange","selected","selectionMethods","useSelection","selectableRowIds","React","useMemo","rowIds","i","length","add","selectedRow","Array","from","has","size","res","forEach","selectableRowId","useEventCallback","e","toggleAllItems","map","item","rowId","toggleItem","deselectItem","selectItem","isSelected","clearItems","selection"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/hooks/useTableSort.js

@@ -34,6 +34,7 @@ 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

@@ -1 +1 @@
-{"version":3,"sources":["useTableSort.js"],"sourcesContent":["import * as React from 'react';\nimport { useControllableState, useEventCallback } from '@fluentui/react-utilities';\nconst noop = ()=>undefined;\nexport const defaultTableSortState = {\n    getSortDirection: ()=>'ascending',\n    setColumnSort: noop,\n    sort: (rows)=>[\n            ...rows\n        ],\n    sortColumn: undefined,\n    sortDirection: 'ascending',\n    toggleColumnSort: noop\n};\nexport function useTableSort(options) {\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)=>useTableSortState(tableState, options);\n}\nexport function useTableSortState(tableState, options) {\n    const { columns } = tableState;\n    const { sortState, defaultSortState, onSortChange: onSortChangeProp = noop } = options;\n    const [sorted, setSorted] = useControllableState({\n        initialState: {\n            sortDirection: 'ascending',\n            sortColumn: undefined\n        },\n        defaultState: defaultSortState,\n        state: sortState\n    });\n    const { sortColumn, sortDirection } = sorted;\n    const onSortChange = useEventCallback(onSortChangeProp);\n    const toggleColumnSort = React.useCallback((e, columnId)=>{\n        setSorted((s)=>{\n            const newState = {\n                ...s,\n                sortColumn: columnId\n            };\n            if (s.sortColumn === columnId) {\n                newState.sortDirection = s.sortDirection === 'ascending' ? 'descending' : 'ascending';\n            } else {\n                newState.sortDirection = 'ascending';\n            }\n            onSortChange === null || onSortChange === void 0 ? void 0 : onSortChange(e, newState);\n            return newState;\n        });\n    }, [\n        onSortChange,\n        setSorted\n    ]);\n    const setColumnSort = (e, nextSortColumn, nextSortDirection)=>{\n        const newState = {\n            sortColumn: nextSortColumn,\n            sortDirection: nextSortDirection\n        };\n        onSortChange === null || onSortChange === void 0 ? void 0 : onSortChange(e, newState);\n        setSorted(newState);\n    };\n    const sort = React.useCallback((rows)=>{\n        return rows.slice().sort((a, b)=>{\n            const sortColumnDef = columns.find((column)=>column.columnId === sortColumn);\n            if (!(sortColumnDef === null || sortColumnDef === void 0 ? void 0 : sortColumnDef.compare)) {\n                return 0;\n            }\n            const mod = sortDirection === 'ascending' ? 1 : -1;\n            return sortColumnDef.compare(a.item, b.item) * mod;\n        });\n    }, [\n        columns,\n        sortColumn,\n        sortDirection\n    ]);\n    const getSortDirection = (columnId)=>{\n        return sortColumn === columnId ? sortDirection : undefined;\n    };\n    return {\n        ...tableState,\n        sort: {\n            sort,\n            sortColumn,\n            sortDirection,\n            setColumnSort,\n            toggleColumnSort,\n            getSortDirection\n        }\n    };\n}\n"],"names":["defaultTableSortState","useTableSort","useTableSortState","noop","undefined","getSortDirection","setColumnSort","sort","rows","sortColumn","sortDirection","toggleColumnSort","options","tableState","columns","sortState","defaultSortState","onSortChange","onSortChangeProp","sorted","setSorted","useControllableState","initialState","defaultState","state","useEventCallback","React","useCallback","e","columnId","s","newState","nextSortColumn","nextSortDirection","slice","a","b","sortColumnDef","find","column","compare","mod","item"],"mappings":";;;;;;;;;;;IAGaA,qBAAqB;eAArBA;;IAUGC,YAAY;eAAZA;;IAKAC,iBAAiB;eAAjBA;;;;iEAlBO;gCACgC;AACvD,MAAMC,OAAO,IAAIC;AACV,MAAMJ,wBAAwB;IACjCK,kBAAkB,IAAI;IACtBC,eAAeH;IACfI,MAAM,CAACC,OAAO;eACHA;SACN;IACLC,YAAYL;IACZM,eAAe;IACfC,kBAAkBR;AACtB;AACO,SAASF,aAAaW,OAAO;IAChC,4EAA4E;IAC5E,sDAAsD;IACtD,OAAO,CAACC,aAAaX,kBAAkBW,YAAYD;AACvD;AACO,SAASV,kBAAkBW,UAAU,EAAED,OAAO;IACjD,MAAM,EAAEE,OAAO,EAAE,GAAGD;IACpB,MAAM,EAAEE,SAAS,EAAEC,gBAAgB,EAAEC,cAAcC,mBAAmBf,IAAI,EAAE,GAAGS;IAC/E,MAAM,CAACO,QAAQC,UAAU,GAAGC,IAAAA,oCAAoB,EAAC;QAC7CC,cAAc;YACVZ,eAAe;YACfD,YAAYL;QAChB;QACAmB,cAAcP;QACdQ,OAAOT;IACX;IACA,MAAM,EAAEN,UAAU,EAAEC,aAAa,EAAE,GAAGS;IACtC,MAAMF,eAAeQ,IAAAA,gCAAgB,EAACP;IACtC,MAAMP,mBAAmBe,OAAMC,WAAW,CAAC,CAACC,GAAGC;QAC3CT,UAAU,CAACU;YACP,MAAMC,WAAW;gBACb,GAAGD,CAAC;gBACJrB,YAAYoB;YAChB;YACA,IAAIC,EAAErB,UAAU,KAAKoB,UAAU;gBAC3BE,SAASrB,aAAa,GAAGoB,EAAEpB,aAAa,KAAK,cAAc,eAAe;YAC9E,OAAO;gBACHqB,SAASrB,aAAa,GAAG;YAC7B;YACAO,iBAAiB,QAAQA,iBAAiB,KAAK,IAAI,KAAK,IAAIA,aAAaW,GAAGG;YAC5E,OAAOA;QACX;IACJ,GAAG;QACCd;QACAG;KACH;IACD,MAAMd,gBAAgB,CAACsB,GAAGI,gBAAgBC;QACtC,MAAMF,WAAW;YACbtB,YAAYuB;YACZtB,eAAeuB;QACnB;QACAhB,iBAAiB,QAAQA,iBAAiB,KAAK,IAAI,KAAK,IAAIA,aAAaW,GAAGG;QAC5EX,UAAUW;IACd;IACA,MAAMxB,OAAOmB,OAAMC,WAAW,CAAC,CAACnB;QAC5B,OAAOA,KAAK0B,KAAK,GAAG3B,IAAI,CAAC,CAAC4B,GAAGC;YACzB,MAAMC,gBAAgBvB,QAAQwB,IAAI,CAAC,CAACC,SAASA,OAAOV,QAAQ,KAAKpB;YACjE,IAAI,CAAE4B,CAAAA,kBAAkB,QAAQA,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcG,OAAO,AAAD,GAAI;gBACxF,OAAO;YACX;YACA,MAAMC,MAAM/B,kBAAkB,cAAc,IAAI,CAAC;YACjD,OAAO2B,cAAcG,OAAO,CAACL,EAAEO,IAAI,EAAEN,EAAEM,IAAI,IAAID;QACnD;IACJ,GAAG;QACC3B;QACAL;QACAC;KACH;IACD,MAAML,mBAAmB,CAACwB;QACtB,OAAOpB,eAAeoB,WAAWnB,gBAAgBN;IACrD;IACA,OAAO;QACH,GAAGS,UAAU;QACbN,MAAM;YACFA;YACAE;YACAC;YACAJ;YACAK;YACAN;QACJ;IACJ;AACJ"}
+{"version":3,"sources":["useTableSort.ts"],"sourcesContent":["import * 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 = () => 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>) => 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":["defaultTableSortState","useTableSort","useTableSortState","noop","undefined","getSortDirection","setColumnSort","sort","rows","sortColumn","sortDirection","toggleColumnSort","options","tableState","columns","sortState","defaultSortState","onSortChange","onSortChangeProp","sorted","setSorted","useControllableState","initialState","defaultState","state","useEventCallback","React","useCallback","e","columnId","s","newState","nextSortColumn","nextSortDirection","slice","a","b","sortColumnDef","find","column","compare","mod","item"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAaaA,qBAAAA;eAAAA;;IASGC,YAAAA;eAAAA;;IAQAC,iBAAAA;eAAAA;;;;iEA9BO;gCACgC;AAUvD,MAAMC,OAAO,IAAMC;AAEZ,MAAMJ,wBAAiD;IAC5DK,kBAAkB,IAAM;IACxBC,eAAeH;IACfI,MAAM,CAA0CC,OAAsB;eAAIA;SAAK;IAC/EC,YAAYL;IACZM,eAAe;IACfC,kBAAkBR;AACpB;AAEO,SAASF,aAAoBW,OAA4B;IAC9D;IAEA,4EAA4E;IAC5E,sDAAsD;IACtD,OAAO,CAACC,aAA0CX,kBAAkBW,YAAYD;AAClF;AAEO,SAASV,kBACdW,UAAqC,EACrCD,OAA4B;IAE5B,MAAM,EAAEE,OAAO,EAAE,GAAGD;IACpB,MAAM,EAAEE,SAAS,EAAEC,gBAAgB,EAAEC,cAAcC,mBAAmBf,IAAI,EAAE,GAAGS;IAE/E,MAAM,CAACO,QAAQC,UAAU,GAAGC,IAAAA,oCAAAA,EAAgC;QAC1DC,cAAc;YACZZ,eAAe;YACfD,YAAYL;QACd;QACAmB,cAAcP;QACdQ,OAAOT;IACT;IAEA,MAAM,EAAEN,UAAU,EAAEC,aAAa,EAAE,GAAGS;IAEtC,MAAMF,eAAeQ,IAAAA,gCAAAA,EAAiBP;IAEtC,MAAMP,mBAAmBe,OAAMC,WAAW,CACxC,CAACC,GAAyBC;QACxBT,UAAUU,CAAAA;YACR,MAAMC,WAAW;gBAAE,GAAGD,CAAC;gBAAErB,YAAYoB;YAAS;YAC9C,IAAIC,EAAErB,UAAU,KAAKoB,UAAU;gBAC7BE,SAASrB,aAAa,GAAGoB,EAAEpB,aAAa,KAAK,cAAc,eAAe;YAC5E,OAAO;gBACLqB,SAASrB,aAAa,GAAG;YAC3B;YAEAO,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAeW,GAAGG;YAClB,OAAOA;QACT;IACF,GACA;QAACd;QAAcG;KAAU;IAG3B,MAAMd,gBAAwD,CAACsB,GAAGI,gBAAgBC;QAChF,MAAMF,WAAW;YAAEtB,YAAYuB;YAAgBtB,eAAeuB;QAAkB;QAChFhB,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAeW,GAAGG;QAClBX,UAAUW;IACZ;IAEA,MAAMxB,OAAOmB,OAAMC,WAAW,CAC5B,CAAwCnB;QACtC,OAAOA,KAAK0B,KAAK,GAAG3B,IAAI,CAAC,CAAC4B,GAAGC;YAC3B,MAAMC,gBAAgBvB,QAAQwB,IAAI,CAACC,CAAAA,SAAUA,OAAOV,QAAQ,KAAKpB;YACjE,IAAI,CAAC4B,CAAAA,kBAAAA,QAAAA,kBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,cAAeG,OAAO,AAAPA,GAAS;gBAC3B,OAAO;YACT;YAEA,MAAMC,MAAM/B,kBAAkB,cAAc,IAAI,CAAC;YACjD,OAAO2B,cAAcG,OAAO,CAACL,EAAEO,IAAI,EAAEN,EAAEM,IAAI,IAAID;QACjD;IACF,GACA;QAAC3B;QAASL;QAAYC;KAAc;IAGtC,MAAML,mBAA8D,CAACwB;QACnE,OAAOpB,eAAeoB,WAAWnB,gBAAgBN;IACnD;IAEA,OAAO;QACL,GAAGS,UAAU;QACbN,MAAM;YACJA;YACAE;YACAC;YACAJ;YACAK;YACAN;QACF;IACF;AACF"}