@fluentui/react-virtualizer 9.0.0-alpha.21 → 9.0.0-alpha.23

package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js

@@ -2,43 +2,75 @@ import * as React from 'react';
 import { resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';
 import { useVirtualizer_unstable } from '../Virtualizer/useVirtualizer';
 import { useDynamicVirtualizerMeasure } from '../../Hooks';
-import { useVirtualizerContextState_unstable } from '../../Utilities';
+import { useVirtualizerContextState_unstable, scrollToItemDynamic } from '../../Utilities';
+import { useImperativeHandle } from 'react';
 export function useVirtualizerScrollViewDynamic_unstable(props) {
-  const contextState = useVirtualizerContextState_unstable(props.virtualizerContext);
-  var _props_axis, _contextState_contextIndex;
-  const {
-    virtualizerLength,
-    bufferItems,
-    bufferSize,
-    scrollRef
-  } = useDynamicVirtualizerMeasure({
-    defaultItemSize: props.itemSize,
-    direction: (_props_axis = props.axis) !== null && _props_axis !== void 0 ? _props_axis : 'vertical',
-    getItemSize: props.getItemSize,
-    currentIndex: (_contextState_contextIndex = contextState === null || contextState === void 0 ? void 0 : contextState.contextIndex) !== null && _contextState_contextIndex !== void 0 ? _contextState_contextIndex : 0,
-    numItems: props.numItems
-  });
-  const iScrollRef = useMergedRefs(React.useRef(null), scrollRef);
-  const virtualizerState = useVirtualizer_unstable({
-    ...props,
-    virtualizerLength,
-    bufferItems,
-    bufferSize,
-    scrollViewRef: iScrollRef,
-    virtualizerContext: contextState
-  });
-  return {
-    ...virtualizerState,
-    components: {
-      ...virtualizerState.components,
-      container: 'div'
-    },
-    container: resolveShorthand(props.container, {
-      required: true,
-      defaultProps: {
-        ref: iScrollRef
-      }
-    })
-  };
+    const contextState = useVirtualizerContextState_unstable(props.virtualizerContext);
+    const { imperativeRef , axis ='vertical' , reversed , imperativeVirtualizerRef  } = props;
+    var _props_axis, _contextState_contextIndex;
+    const { virtualizerLength , bufferItems , bufferSize , scrollRef  } = useDynamicVirtualizerMeasure({
+        defaultItemSize: props.itemSize,
+        direction: (_props_axis = props.axis) !== null && _props_axis !== void 0 ? _props_axis : 'vertical',
+        getItemSize: props.getItemSize,
+        currentIndex: (_contextState_contextIndex = contextState === null || contextState === void 0 ? void 0 : contextState.contextIndex) !== null && _contextState_contextIndex !== void 0 ? _contextState_contextIndex : 0,
+        numItems: props.numItems
+    });
+    const scrollViewRef = useMergedRefs(React.useRef(null), scrollRef);
+    const scrollCallbackRef = React.useRef(null);
+    const _imperativeVirtualizerRef = useMergedRefs(React.useRef(null), imperativeVirtualizerRef);
+    useImperativeHandle(imperativeRef, ()=>{
+        return {
+            scrollTo (index, behavior = 'auto', callback) {
+                scrollCallbackRef.current = callback !== null && callback !== void 0 ? callback : null;
+                if (_imperativeVirtualizerRef.current) {
+                    var _imperativeVirtualizerRef_current;
+                    const progressiveSizes = _imperativeVirtualizerRef.current.progressiveSizes.current;
+                    const totalSize = progressiveSizes && (progressiveSizes === null || progressiveSizes === void 0 ? void 0 : progressiveSizes.length) > 0 ? progressiveSizes[Math.max(progressiveSizes.length - 1, 0)] : 0;
+                    _imperativeVirtualizerRef.current.setFlaggedIndex(index);
+                    scrollToItemDynamic({
+                        index,
+                        itemSizes: (_imperativeVirtualizerRef_current = _imperativeVirtualizerRef.current) === null || _imperativeVirtualizerRef_current === void 0 ? void 0 : _imperativeVirtualizerRef_current.nodeSizes,
+                        totalSize,
+                        scrollViewRef,
+                        axis,
+                        reversed,
+                        behavior
+                    });
+                }
+            }
+        };
+    }, [
+        axis,
+        scrollViewRef,
+        reversed,
+        _imperativeVirtualizerRef
+    ]);
+    const handleRenderedIndex = (index)=>{
+        if (scrollCallbackRef.current) {
+            scrollCallbackRef.current(index);
+        }
+    };
+    const virtualizerState = useVirtualizer_unstable({
+        ...props,
+        virtualizerLength,
+        bufferItems,
+        bufferSize,
+        scrollViewRef,
+        virtualizerContext: contextState,
+        imperativeVirtualizerRef: _imperativeVirtualizerRef,
+        onRenderedFlaggedIndex: handleRenderedIndex
+    });
+    return {
+        ...virtualizerState,
+        components: {
+            ...virtualizerState.components,
+            container: 'div'
+        },
+        container: resolveShorthand(props.container, {
+            required: true,
+            defaultProps: {
+                ref: scrollViewRef
+            }
+        })
+    };
 }
-//# sourceMappingURL=useVirtualizerScrollViewDynamic.js.map

package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","resolveShorthand","useMergedRefs","useVirtualizer_unstable","useDynamicVirtualizerMeasure","useVirtualizerContextState_unstable","useVirtualizerScrollViewDynamic_unstable","props","contextState","virtualizerContext","_props_axis","_contextState_contextIndex","virtualizerLength","bufferItems","bufferSize","scrollRef","defaultItemSize","itemSize","direction","axis","getItemSize","currentIndex","contextIndex","numItems","iScrollRef","useRef","virtualizerState","scrollViewRef","components","container","required","defaultProps","ref"],"sources":["../../../src/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.ts"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport { useVirtualizer_unstable } from '../Virtualizer/useVirtualizer';\nimport {\n  VirtualizerScrollViewDynamicProps,\n  VirtualizerScrollViewDynamicState,\n} from './VirtualizerScrollViewDynamic.types';\nimport { useDynamicVirtualizerMeasure } from '../../Hooks';\nimport { useVirtualizerContextState_unstable } from '../../Utilities';\n\nexport function useVirtualizerScrollViewDynamic_unstable(\n  props: VirtualizerScrollViewDynamicProps,\n): VirtualizerScrollViewDynamicState {\n  const contextState = useVirtualizerContextState_unstable(props.virtualizerContext);\n\n  const { virtualizerLength, bufferItems, bufferSize, scrollRef } = useDynamicVirtualizerMeasure({\n    defaultItemSize: props.itemSize,\n    direction: props.axis ?? 'vertical',\n    getItemSize: props.getItemSize,\n    currentIndex: contextState?.contextIndex ?? 0,\n    numItems: props.numItems,\n  });\n\n  const iScrollRef = useMergedRefs(React.useRef<HTMLDivElement>(null), scrollRef) as React.RefObject<HTMLDivElement>;\n\n  const virtualizerState = useVirtualizer_unstable({\n    ...props,\n    virtualizerLength,\n    bufferItems,\n    bufferSize,\n    scrollViewRef: iScrollRef,\n    virtualizerContext: contextState,\n  });\n\n  return {\n    ...virtualizerState,\n    components: {\n      ...virtualizerState.components,\n      container: 'div',\n    },\n    container: resolveShorthand(props.container, {\n      required: true,\n      defaultProps: {\n        ref: iScrollRef,\n      },\n    }),\n  };\n}\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,gBAAgB,EAAEC,aAAa,QAAQ;AAChD,SAASC,uBAAuB,QAAQ;AAKxC,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,mCAAmC,QAAQ;AAEpD,OAAO,SAASC,yCACdC,KAAwC,EACL;EACnC,MAAMC,YAAA,GAAeH,mCAAA,CAAoCE,KAAA,CAAME,kBAAkB;MAIpEC,WAAA,EAEGC,0BAAA;EAJhB,MAAM;IAAEC,iBAAA;IAAmBC,WAAA;IAAaC,UAAA;IAAYC;EAAS,CAAE,GAAGX,4BAAA,CAA6B;IAC7FY,eAAA,EAAiBT,KAAA,CAAMU,QAAQ;IAC/BC,SAAA,EAAW,CAAAR,WAAA,GAAAH,KAAA,CAAMY,IAAI,cAAVT,WAAA,cAAAA,WAAA,GAAc,UAAU;IACnCU,WAAA,EAAab,KAAA,CAAMa,WAAW;IAC9BC,YAAA,EAAc,CAAAV,0BAAA,GAAAH,YAAA,aAAAA,YAAA,uBAAAA,YAAA,CAAcc,YAAY,cAA1BX,0BAAA,cAAAA,0BAAA,GAA8B,CAAC;IAC7CY,QAAA,EAAUhB,KAAA,CAAMgB;EAClB;EAEA,MAAMC,UAAA,GAAatB,aAAA,CAAcF,KAAA,CAAMyB,MAAM,CAAiB,IAAI,GAAGV,SAAA;EAErE,MAAMW,gBAAA,GAAmBvB,uBAAA,CAAwB;IAC/C,GAAGI,KAAK;IACRK,iBAAA;IACAC,WAAA;IACAC,UAAA;IACAa,aAAA,EAAeH,UAAA;IACff,kBAAA,EAAoBD;EACtB;EAEA,OAAO;IACL,GAAGkB,gBAAgB;IACnBE,UAAA,EAAY;MACV,GAAGF,gBAAA,CAAiBE,UAAU;MAC9BC,SAAA,EAAW;IACb;IACAA,SAAA,EAAW5B,gBAAA,CAAiBM,KAAA,CAAMsB,SAAS,EAAE;MAC3CC,QAAA,EAAU,IAAI;MACdC,YAAA,EAAc;QACZC,GAAA,EAAKR;MACP;IACF;EACF;AACF"}
+{"version":3,"sources":["useVirtualizerScrollViewDynamic.ts"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport { useVirtualizer_unstable } from '../Virtualizer/useVirtualizer';\nimport type {\n  VirtualizerScrollViewDynamicProps,\n  VirtualizerScrollViewDynamicState,\n} from './VirtualizerScrollViewDynamic.types';\nimport { useDynamicVirtualizerMeasure } from '../../Hooks';\nimport { useVirtualizerContextState_unstable, scrollToItemDynamic } from '../../Utilities';\nimport type { VirtualizerDataRef } from '../Virtualizer/Virtualizer.types';\nimport { useImperativeHandle } from 'react';\n\nexport function useVirtualizerScrollViewDynamic_unstable(\n  props: VirtualizerScrollViewDynamicProps,\n): VirtualizerScrollViewDynamicState {\n  const contextState = useVirtualizerContextState_unstable(props.virtualizerContext);\n  const { imperativeRef, axis = 'vertical', reversed, imperativeVirtualizerRef } = props;\n\n  const { virtualizerLength, bufferItems, bufferSize, scrollRef } = useDynamicVirtualizerMeasure({\n    defaultItemSize: props.itemSize,\n    direction: props.axis ?? 'vertical',\n    getItemSize: props.getItemSize,\n    currentIndex: contextState?.contextIndex ?? 0,\n    numItems: props.numItems,\n  });\n\n  const scrollViewRef = useMergedRefs(React.useRef<HTMLDivElement>(null), scrollRef) as React.RefObject<HTMLDivElement>;\n  const scrollCallbackRef = React.useRef<null | ((index: number) => void)>(null);\n\n  const _imperativeVirtualizerRef = useMergedRefs(React.useRef<VirtualizerDataRef>(null), imperativeVirtualizerRef);\n\n  useImperativeHandle(\n    imperativeRef,\n    () => {\n      return {\n        scrollTo(index: number, behavior = 'auto', callback: undefined | ((index: number) => void)) {\n          scrollCallbackRef.current = callback ?? null;\n          if (_imperativeVirtualizerRef.current) {\n            const progressiveSizes = _imperativeVirtualizerRef.current.progressiveSizes.current;\n            const totalSize =\n              progressiveSizes && progressiveSizes?.length > 0\n                ? progressiveSizes[Math.max(progressiveSizes.length - 1, 0)]\n                : 0;\n\n            _imperativeVirtualizerRef.current.setFlaggedIndex(index);\n            scrollToItemDynamic({\n              index,\n              itemSizes: _imperativeVirtualizerRef.current?.nodeSizes,\n              totalSize,\n              scrollViewRef,\n              axis,\n              reversed,\n              behavior,\n            });\n          }\n        },\n      };\n    },\n    [axis, scrollViewRef, reversed, _imperativeVirtualizerRef],\n  );\n\n  const handleRenderedIndex = (index: number) => {\n    if (scrollCallbackRef.current) {\n      scrollCallbackRef.current(index);\n    }\n  };\n\n  const virtualizerState = useVirtualizer_unstable({\n    ...props,\n    virtualizerLength,\n    bufferItems,\n    bufferSize,\n    scrollViewRef,\n    virtualizerContext: contextState,\n    imperativeVirtualizerRef: _imperativeVirtualizerRef,\n    onRenderedFlaggedIndex: handleRenderedIndex,\n  });\n\n  return {\n    ...virtualizerState,\n    components: {\n      ...virtualizerState.components,\n      container: 'div',\n    },\n    container: resolveShorthand(props.container, {\n      required: true,\n      defaultProps: {\n        ref: scrollViewRef,\n      },\n    }),\n  };\n}\n"],"names":["React","resolveShorthand","useMergedRefs","useVirtualizer_unstable","useDynamicVirtualizerMeasure","useVirtualizerContextState_unstable","scrollToItemDynamic","useImperativeHandle","useVirtualizerScrollViewDynamic_unstable","props","contextState","virtualizerContext","imperativeRef","axis","reversed","imperativeVirtualizerRef","virtualizerLength","bufferItems","bufferSize","scrollRef","defaultItemSize","itemSize","direction","getItemSize","currentIndex","contextIndex","numItems","scrollViewRef","useRef","scrollCallbackRef","_imperativeVirtualizerRef","scrollTo","index","behavior","callback","current","progressiveSizes","totalSize","length","Math","max","setFlaggedIndex","itemSizes","nodeSizes","handleRenderedIndex","virtualizerState","onRenderedFlaggedIndex","components","container","required","defaultProps","ref"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,EAAEC,aAAa,QAAQ,4BAA4B;AAC5E,SAASC,uBAAuB,QAAQ,gCAAgC;AAKxE,SAASC,4BAA4B,QAAQ,cAAc;AAC3D,SAASC,mCAAmC,EAAEC,mBAAmB,QAAQ,kBAAkB;AAE3F,SAASC,mBAAmB,QAAQ,QAAQ;AAE5C,OAAO,SAASC,yCACdC,KAAwC,EACL;IACnC,MAAMC,eAAeL,oCAAoCI,MAAME,kBAAkB;IACjF,MAAM,EAAEC,cAAa,EAAEC,MAAO,WAAU,EAAEC,SAAQ,EAAEC,yBAAwB,EAAE,GAAGN;QAIpEA,aAEGC;IAJhB,MAAM,EAAEM,kBAAiB,EAAEC,YAAW,EAAEC,WAAU,EAAEC,UAAS,EAAE,GAAGf,6BAA6B;QAC7FgB,iBAAiBX,MAAMY,QAAQ;QAC/BC,WAAWb,CAAAA,cAAAA,MAAMI,IAAI,cAAVJ,yBAAAA,cAAc,UAAU;QACnCc,aAAad,MAAMc,WAAW;QAC9BC,cAAcd,CAAAA,6BAAAA,yBAAAA,0BAAAA,KAAAA,IAAAA,aAAce,YAAY,cAA1Bf,wCAAAA,6BAA8B,CAAC;QAC7CgB,UAAUjB,MAAMiB,QAAQ;IAC1B;IAEA,MAAMC,gBAAgBzB,cAAcF,MAAM4B,MAAM,CAAiB,IAAI,GAAGT;IACxE,MAAMU,oBAAoB7B,MAAM4B,MAAM,CAAmC,IAAI;IAE7E,MAAME,4BAA4B5B,cAAcF,MAAM4B,MAAM,CAAqB,IAAI,GAAGb;IAExFR,oBACEK,eACA,IAAM;QACJ,OAAO;YACLmB,UAASC,KAAa,EAAEC,WAAW,MAAM,EAAEC,QAA+C,EAAE;gBAC1FL,kBAAkBM,OAAO,GAAGD,qBAAAA,sBAAAA,WAAY,IAAI;gBAC5C,IAAIJ,0BAA0BK,OAAO,EAAE;wBAUxBL;oBATb,MAAMM,mBAAmBN,0BAA0BK,OAAO,CAACC,gBAAgB,CAACD,OAAO;oBACnF,MAAME,YACJD,oBAAoBA,CAAAA,6BAAAA,8BAAAA,KAAAA,IAAAA,iBAAkBE,MAAM,AAAD,IAAI,IAC3CF,gBAAgB,CAACG,KAAKC,GAAG,CAACJ,iBAAiBE,MAAM,GAAG,GAAG,GAAG,GAC1D,CAAC;oBAEPR,0BAA0BK,OAAO,CAACM,eAAe,CAACT;oBAClD1B,oBAAoB;wBAClB0B;wBACAU,WAAWZ,CAAAA,oCAAAA,0BAA0BK,OAAO,cAAjCL,+CAAAA,KAAAA,IAAAA,kCAAmCa,SAAS;wBACvDN;wBACAV;wBACAd;wBACAC;wBACAmB;oBACF;gBACF,CAAC;YACH;QACF;IACF,GACA;QAACpB;QAAMc;QAAeb;QAAUgB;KAA0B;IAG5D,MAAMc,sBAAsB,CAACZ,QAAkB;QAC7C,IAAIH,kBAAkBM,OAAO,EAAE;YAC7BN,kBAAkBM,OAAO,CAACH;QAC5B,CAAC;IACH;IAEA,MAAMa,mBAAmB1C,wBAAwB;QAC/C,GAAGM,KAAK;QACRO;QACAC;QACAC;QACAS;QACAhB,oBAAoBD;QACpBK,0BAA0Be;QAC1BgB,wBAAwBF;IAC1B;IAEA,OAAO;QACL,GAAGC,gBAAgB;QACnBE,YAAY;YACV,GAAGF,iBAAiBE,UAAU;YAC9BC,WAAW;QACb;QACAA,WAAW/C,iBAAiBQ,MAAMuC,SAAS,EAAE;YAC3CC,UAAU,IAAI;YACdC,cAAc;gBACZC,KAAKxB;YACP;QACF;IACF;AACF,CAAC"}

package/lib/components/VirtualizerScrollViewDynamic/{useVirtualizerScrollViewDynamicStyles.js → useVirtualizerScrollViewDynamicStyles.styles.js}

@@ -1,4 +1,4 @@
-import { useVirtualizerStyles_unstable, virtualizerClassNames } from '../Virtualizer/useVirtualizerStyles';
+import { useVirtualizerStyles_unstable, virtualizerClassNames } from '../Virtualizer/useVirtualizerStyles.styles';
 import { __styles, mergeClasses } from '@griffel/react';
 const virtualizerScrollViewDynamicClassName = 'fui-Virtualizer-Scroll-View-Dynamic';
 export const virtualizerScrollViewDynamicClassNames = {
@@ -43,4 +43,4 @@ export const useVirtualizerScrollViewDynamicStyles_unstable = state => {
   state.container.className = mergeClasses(virtualizerScrollViewDynamicClassNames.container, styles.base, containerStyle, state.container.className);
   return state;
 };
-//# sourceMappingURL=useVirtualizerScrollViewDynamicStyles.js.map
+//# sourceMappingURL=useVirtualizerScrollViewDynamicStyles.styles.js.map

package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useVirtualizerStyles_unstable","virtualizerClassNames","__styles","mergeClasses","virtualizerScrollViewDynamicClassName","virtualizerScrollViewDynamicClassNames","container","useStyles","base","mc9l5x","a9b677","Bqenvij","Eiaeu8","vertical","Beiy3e4","Bmxbyg5","horizontal","B68tc82","verticalReversed","horizontalReversed","d","useVirtualizerScrollViewDynamicStyles_unstable","state","styles","containerStyle","axis","reversed","className"],"sources":["useVirtualizerScrollViewDynamicStyles.styles.js"],"sourcesContent":["import { useVirtualizerStyles_unstable, virtualizerClassNames } from '../Virtualizer/useVirtualizerStyles.styles';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nconst virtualizerScrollViewDynamicClassName = 'fui-Virtualizer-Scroll-View-Dynamic';\nexport const virtualizerScrollViewDynamicClassNames = {\n    ...virtualizerClassNames,\n    container: `${virtualizerScrollViewDynamicClassName}__container`\n};\nconst useStyles = makeStyles({\n    base: {\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        overflowAnchor: 'none'\n    },\n    vertical: {\n        flexDirection: 'column',\n        overflowY: 'auto'\n    },\n    horizontal: {\n        flexDirection: 'row',\n        overflowX: 'auto'\n    },\n    verticalReversed: {\n        flexDirection: 'column-reverse',\n        overflowY: 'auto'\n    },\n    horizontalReversed: {\n        flexDirection: 'row-reverse',\n        overflowX: 'auto'\n    }\n});\n/**\n * Apply styling to the Virtualizer states\n */ export const useVirtualizerScrollViewDynamicStyles_unstable = (state)=>{\n    const styles = useStyles();\n    // Default virtualizer styles base\n    useVirtualizerStyles_unstable(state);\n    const containerStyle = state.axis === 'horizontal' ? state.reversed ? styles.horizontalReversed : styles.horizontal : state.reversed ? styles.verticalReversed : styles.vertical;\n    // Add container styles\n    state.container.className = mergeClasses(virtualizerScrollViewDynamicClassNames.container, styles.base, containerStyle, state.container.className);\n    return state;\n};\n"],"mappings":"AAAA,SAASA,6BAA6B,EAAEC,qBAAqB,QAAQ,4CAA4C;AACjH,SAAAC,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,MAAMC,qCAAqC,GAAG,qCAAqC;AACnF,OAAO,MAAMC,sCAAsC,GAAG;EAClD,GAAGJ,qBAAqB;EACxBK,SAAS,EAAG,GAAEF,qCAAsC;AACxD,CAAC;AACD,MAAMG,SAAS,gBAAGL,QAAA;EAAAM,IAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;EAAAC,UAAA;IAAAF,OAAA;IAAAG,OAAA;EAAA;EAAAC,gBAAA;IAAAJ,OAAA;IAAAC,OAAA;EAAA;EAAAI,kBAAA;IAAAL,OAAA;IAAAG,OAAA;EAAA;AAAA;EAAAG,CAAA;AAAA,CAuBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,8CAA8C,GAAIC,KAAK,IAAG;EACvE,MAAMC,MAAM,GAAGhB,SAAS,CAAC,CAAC;EAC1B;EACAP,6BAA6B,CAACsB,KAAK,CAAC;EACpC,MAAME,cAAc,GAAGF,KAAK,CAACG,IAAI,KAAK,YAAY,GAAGH,KAAK,CAACI,QAAQ,GAAGH,MAAM,CAACJ,kBAAkB,GAAGI,MAAM,CAACP,UAAU,GAAGM,KAAK,CAACI,QAAQ,GAAGH,MAAM,CAACL,gBAAgB,GAAGK,MAAM,CAACV,QAAQ;EAChL;EACAS,KAAK,CAAChB,SAAS,CAACqB,SAAS,GAAGxB,YAAY,CAACE,sCAAsC,CAACC,SAAS,EAAEiB,MAAM,CAACf,IAAI,EAAEgB,cAAc,EAAEF,KAAK,CAAChB,SAAS,CAACqB,SAAS,CAAC;EAClJ,OAAOL,KAAK;AAChB,CAAC"}

package/lib/hooks/hooks.types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=hooks.types.js.map
+export { };

package/lib/hooks/hooks.types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../src/hooks/hooks.types.ts"],"sourcesContent":["import { MutableRefObject } from 'react';\n\nexport type VirtualizerMeasureProps = {\n  defaultItemSize: number;\n  direction?: 'vertical' | 'horizontal';\n};\n\nexport type VirtualizerMeasureDynamicProps = {\n  defaultItemSize: number;\n  currentIndex: number;\n  numItems: number;\n  getItemSize: (index: number) => number;\n  direction?: 'vertical' | 'horizontal';\n};\n\n/**\n * Additional direct Ref prevents reading old resize entry data\n * Backwards compatible with ResizeObserverCallback if preferred\n */\nexport interface ResizeCallbackWithRef {\n  (entries: ResizeObserverEntry[], observer: ResizeObserver, scrollRef?: MutableRefObject<HTMLElement | null>): void;\n}\n"],"mappings":"AAAA"}
+{"version":3,"sources":["hooks.types.ts"],"sourcesContent":["import { MutableRefObject } from 'react';\n\nexport type VirtualizerMeasureProps = {\n  defaultItemSize: number;\n  direction?: 'vertical' | 'horizontal';\n};\n\nexport type VirtualizerMeasureDynamicProps = {\n  defaultItemSize: number;\n  currentIndex: number;\n  numItems: number;\n  getItemSize: (index: number) => number;\n  direction?: 'vertical' | 'horizontal';\n};\n\n/**\n * Additional direct Ref prevents reading old resize entry data\n * Backwards compatible with ResizeObserverCallback if preferred\n */\nexport interface ResizeCallbackWithRef {\n  (entries: ResizeObserverEntry[], observer: ResizeObserver, scrollRef?: MutableRefObject<HTMLElement | null>): void;\n}\n"],"names":[],"mappings":"AAAA,WAqBC"}

package/lib/hooks/index.js

@@ -3,4 +3,3 @@ export * from './useVirtualizerMeasure';
 export * from './useDynamicVirtualizerMeasure';
 export * from './useResizeObserverRef';
 export * from './hooks.types';
-//# sourceMappingURL=index.js.map

package/lib/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../src/hooks/index.ts"],"sourcesContent":["export * from './useIntersectionObserver';\nexport * from './useVirtualizerMeasure';\nexport * from './useDynamicVirtualizerMeasure';\nexport * from './useResizeObserverRef';\nexport * from './hooks.types';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './useIntersectionObserver';\nexport * from './useVirtualizerMeasure';\nexport * from './useDynamicVirtualizerMeasure';\nexport * from './useResizeObserverRef';\nexport * from './hooks.types';\n"],"names":[],"mappings":"AAAA,cAAc,4BAA4B;AAC1C,cAAc,0BAA0B;AACxC,cAAc,iCAAiC;AAC/C,cAAc,yBAAyB;AACvC,cAAc,gBAAgB"}

package/lib/hooks/useDynamicVirtualizerMeasure.js

@@ -4,96 +4,96 @@ import { useResizeObserverRef_unstable } from './useResizeObserverRef';
 import { useRef } from 'react';
 /**
  * React hook that measures virtualized space dynamically to ensure optimized virtualization length.
- */
-export const useDynamicVirtualizerMeasure = virtualizerProps => {
-  const {
-    defaultItemSize,
-    direction = 'vertical',
-    numItems,
-    getItemSize,
-    currentIndex
-  } = virtualizerProps;
-  const indexRef = useRef(currentIndex);
-  indexRef.current = currentIndex;
-  const [state, setState] = React.useState({
-    virtualizerLength: 0,
-    virtualizerBufferItems: 0,
-    virtualizerBufferSize: 0
-  });
-  const {
-    virtualizerLength,
-    virtualizerBufferItems,
-    virtualizerBufferSize
-  } = state;
-  const container = React.useRef(null);
-  const handleScrollResize = React.useCallback(scrollRef => {
-    if (!(scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current)) {
-      // Error? ignore?
-      return;
-    }
-    if (scrollRef.current !== container.current) {
-      container.current = scrollRef.current;
-    }
-    const containerSize = direction === 'vertical' ? scrollRef.current.getBoundingClientRect().height : scrollRef.current.getBoundingClientRect().width;
-    let indexSizer = 0;
-    let length = 0;
-    while (indexSizer <= containerSize && length < numItems) {
-      const iItemSize = getItemSize(indexRef.current + length);
-      // Increment
-      indexSizer += iItemSize;
-      length++;
-    }
-    /*
-    * Number of items to append at each end, i.e. 'preload' each side before entering view.
-    */
-    const bufferItems = Math.max(Math.floor(length / 4), 2);
-    /*
-    * This is how far we deviate into the bufferItems to detect a redraw.
-    */
-    const bufferSize = Math.max(Math.floor(length / 8 * defaultItemSize), 1);
-    const totalLength = length + bufferItems * 2 + 3;
-    setState({
-      virtualizerLength: totalLength,
-      virtualizerBufferSize: bufferSize,
-      virtualizerBufferItems: bufferItems
+ */ export const useDynamicVirtualizerMeasure = (virtualizerProps)=>{
+    const { defaultItemSize , direction ='vertical' , numItems , getItemSize , currentIndex  } = virtualizerProps;
+    const indexRef = useRef(currentIndex);
+    indexRef.current = currentIndex;
+    const [state, setState] = React.useState({
+        virtualizerLength: 0,
+        virtualizerBufferItems: 0,
+        virtualizerBufferSize: 0
     });
-  }, [defaultItemSize, direction, getItemSize, numItems]);
-  const resizeCallback = React.useCallback((_entries, _observer, scrollRef) => {
-    if (scrollRef) {
-      handleScrollResize(scrollRef);
-    }
-  }, [handleScrollResize]);
-  const scrollRef = useResizeObserverRef_unstable(resizeCallback);
-  useIsomorphicLayoutEffect(() => {
-    var _container_current, _container_current1;
-    if (!container.current) {
-      return;
-    }
-    const containerSize = direction === 'vertical' ? ((_container_current = container.current) === null || _container_current === void 0 ? void 0 : _container_current.getBoundingClientRect().height) * 1.5 : ((_container_current1 = container.current) === null || _container_current1 === void 0 ? void 0 : _container_current1.getBoundingClientRect().width) * 1.5;
-    let couldBeSmaller = false;
-    let recheckTotal = 0;
-    for (let i = currentIndex; i < currentIndex + virtualizerLength; i++) {
-      const newItemSize = getItemSize(i);
-      recheckTotal += newItemSize;
-      const newLength = i - currentIndex;
-      const bufferItems = Math.max(Math.floor(newLength / 4), 2);
-      const totalNewLength = newLength + bufferItems * 2 + 4;
-      const compareLengths = totalNewLength < virtualizerLength;
-      if (recheckTotal > containerSize && compareLengths) {
-        couldBeSmaller = true;
-        break;
-      }
-    }
-    // Check if the render has caused us to need a re-calc of virtualizer length
-    if (recheckTotal < containerSize || couldBeSmaller) {
-      handleScrollResize(container);
-    }
-  }, [getItemSize, currentIndex, direction, virtualizerLength, resizeCallback, handleScrollResize]);
-  return {
-    virtualizerLength,
-    bufferItems: virtualizerBufferItems,
-    bufferSize: virtualizerBufferSize,
-    scrollRef
-  };
+    const { virtualizerLength , virtualizerBufferItems , virtualizerBufferSize  } = state;
+    const container = React.useRef(null);
+    const handleScrollResize = React.useCallback((scrollRef)=>{
+        if (!(scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current)) {
+            // Error? ignore?
+            return;
+        }
+        if (scrollRef.current !== container.current) {
+            container.current = scrollRef.current;
+        }
+        const containerSize = direction === 'vertical' ? scrollRef.current.getBoundingClientRect().height : scrollRef.current.getBoundingClientRect().width;
+        let indexSizer = 0;
+        let length = 0;
+        while(indexSizer <= containerSize && length < numItems){
+            const iItemSize = getItemSize(indexRef.current + length);
+            // Increment
+            indexSizer += iItemSize;
+            length++;
+        }
+        /*
+       * Number of items to append at each end, i.e. 'preload' each side before entering view.
+       */ const bufferItems = Math.max(Math.floor(length / 4), 2);
+        /*
+       * This is how far we deviate into the bufferItems to detect a redraw.
+       */ const bufferSize = Math.max(Math.floor(length / 8 * defaultItemSize), 1);
+        const totalLength = length + bufferItems * 2 + 3;
+        setState({
+            virtualizerLength: totalLength,
+            virtualizerBufferSize: bufferSize,
+            virtualizerBufferItems: bufferItems
+        });
+    }, [
+        defaultItemSize,
+        direction,
+        getItemSize,
+        numItems
+    ]);
+    const resizeCallback = React.useCallback((_entries, _observer, scrollRef)=>{
+        if (scrollRef) {
+            handleScrollResize(scrollRef);
+        }
+    }, [
+        handleScrollResize
+    ]);
+    const scrollRef = useResizeObserverRef_unstable(resizeCallback);
+    useIsomorphicLayoutEffect(()=>{
+        var _container_current, _container_current1;
+        if (!container.current) {
+            return;
+        }
+        const containerSize = direction === 'vertical' ? ((_container_current = container.current) === null || _container_current === void 0 ? void 0 : _container_current.getBoundingClientRect().height) * 1.5 : ((_container_current1 = container.current) === null || _container_current1 === void 0 ? void 0 : _container_current1.getBoundingClientRect().width) * 1.5;
+        let couldBeSmaller = false;
+        let recheckTotal = 0;
+        for(let i = currentIndex; i < currentIndex + virtualizerLength; i++){
+            const newItemSize = getItemSize(i);
+            recheckTotal += newItemSize;
+            const newLength = i - currentIndex;
+            const bufferItems = Math.max(Math.floor(newLength / 4), 2);
+            const totalNewLength = newLength + bufferItems * 2 + 4;
+            const compareLengths = totalNewLength < virtualizerLength;
+            if (recheckTotal > containerSize && compareLengths) {
+                couldBeSmaller = true;
+                break;
+            }
+        }
+        // Check if the render has caused us to need a re-calc of virtualizer length
+        if (recheckTotal < containerSize || couldBeSmaller) {
+            handleScrollResize(container);
+        }
+    }, [
+        getItemSize,
+        currentIndex,
+        direction,
+        virtualizerLength,
+        resizeCallback,
+        handleScrollResize
+    ]);
+    return {
+        virtualizerLength,
+        bufferItems: virtualizerBufferItems,
+        bufferSize: virtualizerBufferSize,
+        scrollRef
+    };
 };
-//# sourceMappingURL=useDynamicVirtualizerMeasure.js.map

package/lib/hooks/useDynamicVirtualizerMeasure.js.map

@@ -1 +1 @@
-{"version":3,"names":["useIsomorphicLayoutEffect","React","useResizeObserverRef_unstable","useRef","useDynamicVirtualizerMeasure","virtualizerProps","defaultItemSize","direction","numItems","getItemSize","currentIndex","indexRef","current","state","setState","useState","virtualizerLength","virtualizerBufferItems","virtualizerBufferSize","container","handleScrollResize","useCallback","scrollRef","containerSize","getBoundingClientRect","height","width","indexSizer","length","iItemSize","bufferItems","Math","max","floor","bufferSize","totalLength","resizeCallback","_entries","_observer","_container_current","_container_current1","couldBeSmaller","recheckTotal","i","newItemSize","newLength","totalNewLength","compareLengths"],"sources":["../../src/hooks/useDynamicVirtualizerMeasure.ts"],"sourcesContent":["import { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { VirtualizerMeasureDynamicProps } from './hooks.types';\nimport { useResizeObserverRef_unstable } from './useResizeObserverRef';\nimport { useRef } from 'react';\n\n/**\n * React hook that measures virtualized space dynamically to ensure optimized virtualization length.\n */\nexport const useDynamicVirtualizerMeasure = <TElement extends HTMLElement>(\n  virtualizerProps: VirtualizerMeasureDynamicProps,\n): {\n  virtualizerLength: number;\n  bufferItems: number;\n  bufferSize: number;\n  scrollRef: (instance: TElement | null) => void;\n} => {\n  const { defaultItemSize, direction = 'vertical', numItems, getItemSize, currentIndex } = virtualizerProps;\n  const indexRef = useRef<number>(currentIndex);\n  indexRef.current = currentIndex;\n\n  const [state, setState] = React.useState({\n    virtualizerLength: 0,\n    virtualizerBufferItems: 0,\n    virtualizerBufferSize: 0,\n  });\n\n  const { virtualizerLength, virtualizerBufferItems, virtualizerBufferSize } = state;\n\n  const container = React.useRef<HTMLElement | null>(null);\n  const handleScrollResize = React.useCallback(\n    (scrollRef: React.MutableRefObject<HTMLElement | null>) => {\n      if (!scrollRef?.current) {\n        // Error? ignore?\n        return;\n      }\n\n      if (scrollRef.current !== container.current) {\n        container.current = scrollRef.current;\n      }\n\n      const containerSize =\n        direction === 'vertical'\n          ? scrollRef.current.getBoundingClientRect().height\n          : scrollRef.current.getBoundingClientRect().width;\n\n      let indexSizer = 0;\n      let length = 0;\n\n      while (indexSizer <= containerSize && length < numItems) {\n        const iItemSize = getItemSize(indexRef.current + length);\n\n        // Increment\n        indexSizer += iItemSize;\n        length++;\n      }\n\n      /*\n       * Number of items to append at each end, i.e. 'preload' each side before entering view.\n       */\n      const bufferItems = Math.max(Math.floor(length / 4), 2);\n\n      /*\n       * This is how far we deviate into the bufferItems to detect a redraw.\n       */\n      const bufferSize = Math.max(Math.floor((length / 8) * defaultItemSize), 1);\n\n      const totalLength = length + bufferItems * 2 + 3;\n      setState({\n        virtualizerLength: totalLength,\n        virtualizerBufferSize: bufferSize,\n        virtualizerBufferItems: bufferItems,\n      });\n    },\n    [defaultItemSize, direction, getItemSize, numItems],\n  );\n\n  const resizeCallback = React.useCallback(\n    (\n      _entries: ResizeObserverEntry[],\n      _observer: ResizeObserver,\n      scrollRef?: React.MutableRefObject<HTMLElement | null>,\n    ) => {\n      if (scrollRef) {\n        handleScrollResize(scrollRef);\n      }\n    },\n    [handleScrollResize],\n  );\n\n  const scrollRef = useResizeObserverRef_unstable(resizeCallback);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!container.current) {\n      return;\n    }\n\n    const containerSize =\n      direction === 'vertical'\n        ? container.current?.getBoundingClientRect().height * 1.5\n        : container.current?.getBoundingClientRect().width * 1.5;\n\n    let couldBeSmaller = false;\n    let recheckTotal = 0;\n    for (let i = currentIndex; i < currentIndex + virtualizerLength; i++) {\n      const newItemSize = getItemSize(i);\n      recheckTotal += newItemSize;\n\n      const newLength = i - currentIndex;\n\n      const bufferItems = Math.max(Math.floor(newLength / 4), 2);\n      const totalNewLength = newLength + bufferItems * 2 + 4;\n      const compareLengths = totalNewLength < virtualizerLength;\n\n      if (recheckTotal > containerSize && compareLengths) {\n        couldBeSmaller = true;\n        break;\n      }\n    }\n\n    // Check if the render has caused us to need a re-calc of virtualizer length\n    if (recheckTotal < containerSize || couldBeSmaller) {\n      handleScrollResize(container);\n    }\n  }, [getItemSize, currentIndex, direction, virtualizerLength, resizeCallback, handleScrollResize]);\n\n  return {\n    virtualizerLength,\n    bufferItems: virtualizerBufferItems,\n    bufferSize: virtualizerBufferSize,\n    scrollRef,\n  };\n};\n"],"mappings":"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"}
+{"version":3,"sources":["useDynamicVirtualizerMeasure.ts"],"sourcesContent":["import { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { VirtualizerMeasureDynamicProps } from './hooks.types';\nimport { useResizeObserverRef_unstable } from './useResizeObserverRef';\nimport { useRef } from 'react';\n\n/**\n * React hook that measures virtualized space dynamically to ensure optimized virtualization length.\n */\nexport const useDynamicVirtualizerMeasure = <TElement extends HTMLElement>(\n  virtualizerProps: VirtualizerMeasureDynamicProps,\n): {\n  virtualizerLength: number;\n  bufferItems: number;\n  bufferSize: number;\n  scrollRef: (instance: TElement | null) => void;\n} => {\n  const { defaultItemSize, direction = 'vertical', numItems, getItemSize, currentIndex } = virtualizerProps;\n  const indexRef = useRef<number>(currentIndex);\n  indexRef.current = currentIndex;\n\n  const [state, setState] = React.useState({\n    virtualizerLength: 0,\n    virtualizerBufferItems: 0,\n    virtualizerBufferSize: 0,\n  });\n\n  const { virtualizerLength, virtualizerBufferItems, virtualizerBufferSize } = state;\n\n  const container = React.useRef<HTMLElement | null>(null);\n  const handleScrollResize = React.useCallback(\n    (scrollRef: React.MutableRefObject<HTMLElement | null>) => {\n      if (!scrollRef?.current) {\n        // Error? ignore?\n        return;\n      }\n\n      if (scrollRef.current !== container.current) {\n        container.current = scrollRef.current;\n      }\n\n      const containerSize =\n        direction === 'vertical'\n          ? scrollRef.current.getBoundingClientRect().height\n          : scrollRef.current.getBoundingClientRect().width;\n\n      let indexSizer = 0;\n      let length = 0;\n\n      while (indexSizer <= containerSize && length < numItems) {\n        const iItemSize = getItemSize(indexRef.current + length);\n\n        // Increment\n        indexSizer += iItemSize;\n        length++;\n      }\n\n      /*\n       * Number of items to append at each end, i.e. 'preload' each side before entering view.\n       */\n      const bufferItems = Math.max(Math.floor(length / 4), 2);\n\n      /*\n       * This is how far we deviate into the bufferItems to detect a redraw.\n       */\n      const bufferSize = Math.max(Math.floor((length / 8) * defaultItemSize), 1);\n\n      const totalLength = length + bufferItems * 2 + 3;\n      setState({\n        virtualizerLength: totalLength,\n        virtualizerBufferSize: bufferSize,\n        virtualizerBufferItems: bufferItems,\n      });\n    },\n    [defaultItemSize, direction, getItemSize, numItems],\n  );\n\n  const resizeCallback = React.useCallback(\n    (\n      _entries: ResizeObserverEntry[],\n      _observer: ResizeObserver,\n      scrollRef?: React.MutableRefObject<HTMLElement | null>,\n    ) => {\n      if (scrollRef) {\n        handleScrollResize(scrollRef);\n      }\n    },\n    [handleScrollResize],\n  );\n\n  const scrollRef = useResizeObserverRef_unstable(resizeCallback);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!container.current) {\n      return;\n    }\n\n    const containerSize =\n      direction === 'vertical'\n        ? container.current?.getBoundingClientRect().height * 1.5\n        : container.current?.getBoundingClientRect().width * 1.5;\n\n    let couldBeSmaller = false;\n    let recheckTotal = 0;\n    for (let i = currentIndex; i < currentIndex + virtualizerLength; i++) {\n      const newItemSize = getItemSize(i);\n      recheckTotal += newItemSize;\n\n      const newLength = i - currentIndex;\n\n      const bufferItems = Math.max(Math.floor(newLength / 4), 2);\n      const totalNewLength = newLength + bufferItems * 2 + 4;\n      const compareLengths = totalNewLength < virtualizerLength;\n\n      if (recheckTotal > containerSize && compareLengths) {\n        couldBeSmaller = true;\n        break;\n      }\n    }\n\n    // Check if the render has caused us to need a re-calc of virtualizer length\n    if (recheckTotal < containerSize || couldBeSmaller) {\n      handleScrollResize(container);\n    }\n  }, [getItemSize, currentIndex, direction, virtualizerLength, resizeCallback, handleScrollResize]);\n\n  return {\n    virtualizerLength,\n    bufferItems: virtualizerBufferItems,\n    bufferSize: virtualizerBufferSize,\n    scrollRef,\n  };\n};\n"],"names":["useIsomorphicLayoutEffect","React","useResizeObserverRef_unstable","useRef","useDynamicVirtualizerMeasure","virtualizerProps","defaultItemSize","direction","numItems","getItemSize","currentIndex","indexRef","current","state","setState","useState","virtualizerLength","virtualizerBufferItems","virtualizerBufferSize","container","handleScrollResize","useCallback","scrollRef","containerSize","getBoundingClientRect","height","width","indexSizer","length","iItemSize","bufferItems","Math","max","floor","bufferSize","totalLength","resizeCallback","_entries","_observer","couldBeSmaller","recheckTotal","i","newItemSize","newLength","totalNewLength","compareLengths"],"mappings":"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"}

package/lib/hooks/useIntersectionObserver.js

@@ -1,9 +1,6 @@
 import * as React from 'react';
 import { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';
-const {
-  useState,
-  useRef
-} = React;
+const { useState , useRef  } = React;
 /**
  * React hook that allows easy usage of the browser API IntersectionObserver within React
  * @param callback - A function called when the percentage of the target element is visible crosses a threshold.
@@ -12,33 +9,35 @@ const {
  * enough to trigger a callback).
  * @returns An array containing a callback to update the list of Elements the observer should listen to, a callback to
  * update the init options of the IntersectionObserver and a ref to the IntersectionObserver instance itself.
- */
-export const useIntersectionObserver = (callback, options) => {
-  const observer = useRef();
-  const [observerList, setObserverList] = useState();
-  const [observerInit, setObserverInit] = useState(options);
-  // Observer elements in passed in list and clean up previous list
-  // This effect is only triggered when observerList is updated
-  useIsomorphicLayoutEffect(() => {
-    observer.current = new IntersectionObserver(callback, observerInit);
-    // If we have an instance of IO and a list with elements, observer the elements
-    if (observer.current && observerList && observerList.length > 0) {
-      observerList.forEach(element => {
-        var _observer_current;
-        (_observer_current = observer.current) === null || _observer_current === void 0 ? void 0 : _observer_current.observe(element);
-      });
-    }
-    // clean up previous elements being listened to
-    return () => {
-      if (observer.current) {
-        observer.current.disconnect();
-      }
+ */ export const useIntersectionObserver = (callback, options)=>{
+    const observer = useRef();
+    const [observerList, setObserverList] = useState();
+    const [observerInit, setObserverInit] = useState(options);
+    // Observer elements in passed in list and clean up previous list
+    // This effect is only triggered when observerList is updated
+    useIsomorphicLayoutEffect(()=>{
+        observer.current = new IntersectionObserver(callback, observerInit);
+        // If we have an instance of IO and a list with elements, observer the elements
+        if (observer.current && observerList && observerList.length > 0) {
+            observerList.forEach((element)=>{
+                var _observer_current;
+                (_observer_current = observer.current) === null || _observer_current === void 0 ? void 0 : _observer_current.observe(element);
+            });
+        }
+        // clean up previous elements being listened to
+        return ()=>{
+            if (observer.current) {
+                observer.current.disconnect();
+            }
+        };
+    }, [
+        observerList,
+        observerInit,
+        callback
+    ]);
+    return {
+        setObserverList,
+        setObserverInit,
+        observer
     };
-  }, [observerList, observerInit, callback]);
-  return {
-    setObserverList,
-    setObserverInit,
-    observer
-  };
 };
-//# sourceMappingURL=useIntersectionObserver.js.map

package/lib/hooks/useIntersectionObserver.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useIsomorphicLayoutEffect","useState","useRef","useIntersectionObserver","callback","options","observer","observerList","setObserverList","observerInit","setObserverInit","current","IntersectionObserver","length","forEach","element","_observer_current","observe","disconnect"],"sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import type { Dispatch, MutableRefObject, SetStateAction } from 'react';\nimport * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\n\nconst { useState, useRef } = React;\n\n/**\n * React hook that allows easy usage of the browser API IntersectionObserver within React\n * @param callback - A function called when the percentage of the target element is visible crosses a threshold.\n * @param options - An optional object which customizes the observer. If options isn't specified, the observer uses the\n * document's viewport as the root, with no margin, and a 0% threshold (meaning that even a one-pixel change is\n * enough to trigger a callback).\n * @returns An array containing a callback to update the list of Elements the observer should listen to, a callback to\n * update the init options of the IntersectionObserver and a ref to the IntersectionObserver instance itself.\n */\n\nexport const useIntersectionObserver = (\n  callback: IntersectionObserverCallback,\n  options?: IntersectionObserverInit,\n): {\n  setObserverList: Dispatch<SetStateAction<Element[] | undefined>>;\n  setObserverInit: Dispatch<SetStateAction<IntersectionObserverInit | undefined>>;\n  observer: MutableRefObject<IntersectionObserver | undefined>;\n} => {\n  const observer = useRef<IntersectionObserver>();\n  const [observerList, setObserverList] = useState<Element[]>();\n  const [observerInit, setObserverInit] = useState<IntersectionObserverInit | undefined>(options);\n\n  // Observer elements in passed in list and clean up previous list\n  // This effect is only triggered when observerList is updated\n  useIsomorphicLayoutEffect(() => {\n    observer.current = new IntersectionObserver(callback, observerInit);\n\n    // If we have an instance of IO and a list with elements, observer the elements\n    if (observer.current && observerList && observerList.length > 0) {\n      observerList.forEach(element => {\n        observer.current?.observe(element);\n      });\n    }\n\n    // clean up previous elements being listened to\n    return () => {\n      if (observer.current) {\n        observer.current.disconnect();\n      }\n    };\n  }, [observerList, observerInit, callback]);\n\n  return { setObserverList, setObserverInit, observer };\n};\n"],"mappings":"AACA,YAAYA,KAAA,MAAW;AACvB,SAASC,yBAAyB,QAAQ;AAE1C,MAAM;EAAEC,QAAA;EAAUC;AAAM,CAAE,GAAGH,KAAA;AAE7B;;;;;;;;;AAUA,OAAO,MAAMI,uBAAA,GAA0BA,CACrCC,QAAA,EACAC,OAAA,KAKG;EACH,MAAMC,QAAA,GAAWJ,MAAA;EACjB,MAAM,CAACK,YAAA,EAAcC,eAAA,CAAgB,GAAGP,QAAA;EACxC,MAAM,CAACQ,YAAA,EAAcC,eAAA,CAAgB,GAAGT,QAAA,CAA+CI,OAAA;EAEvF;EACA;EACAL,yBAAA,CAA0B,MAAM;IAC9BM,QAAA,CAASK,OAAO,GAAG,IAAIC,oBAAA,CAAqBR,QAAA,EAAUK,YAAA;IAEtD;IACA,IAAIH,QAAA,CAASK,OAAO,IAAIJ,YAAA,IAAgBA,YAAA,CAAaM,MAAM,GAAG,GAAG;MAC/DN,YAAA,CAAaO,OAAO,CAACC,OAAA,IAAW;YAC9BC,iBAAA;QAAA,CAAAA,iBAAA,GAAAV,QAAA,CAASK,OAAO,cAAhBK,iBAAA,uBAAAA,iBAAA,CAAkBC,OAAA,CAAQF,OAAA;MAC5B;IACF;IAEA;IACA,OAAO,MAAM;MACX,IAAIT,QAAA,CAASK,OAAO,EAAE;QACpBL,QAAA,CAASK,OAAO,CAACO,UAAU;MAC7B;IACF;EACF,GAAG,CAACX,YAAA,EAAcE,YAAA,EAAcL,QAAA,CAAS;EAEzC,OAAO;IAAEI,eAAA;IAAiBE,eAAA;IAAiBJ;EAAS;AACtD"}
+{"version":3,"sources":["useIntersectionObserver.ts"],"sourcesContent":["import type { Dispatch, MutableRefObject, SetStateAction } from 'react';\nimport * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\n\nconst { useState, useRef } = React;\n\n/**\n * React hook that allows easy usage of the browser API IntersectionObserver within React\n * @param callback - A function called when the percentage of the target element is visible crosses a threshold.\n * @param options - An optional object which customizes the observer. If options isn't specified, the observer uses the\n * document's viewport as the root, with no margin, and a 0% threshold (meaning that even a one-pixel change is\n * enough to trigger a callback).\n * @returns An array containing a callback to update the list of Elements the observer should listen to, a callback to\n * update the init options of the IntersectionObserver and a ref to the IntersectionObserver instance itself.\n */\n\nexport const useIntersectionObserver = (\n  callback: IntersectionObserverCallback,\n  options?: IntersectionObserverInit,\n): {\n  setObserverList: Dispatch<SetStateAction<Element[] | undefined>>;\n  setObserverInit: Dispatch<SetStateAction<IntersectionObserverInit | undefined>>;\n  observer: MutableRefObject<IntersectionObserver | undefined>;\n} => {\n  const observer = useRef<IntersectionObserver>();\n  const [observerList, setObserverList] = useState<Element[]>();\n  const [observerInit, setObserverInit] = useState<IntersectionObserverInit | undefined>(options);\n\n  // Observer elements in passed in list and clean up previous list\n  // This effect is only triggered when observerList is updated\n  useIsomorphicLayoutEffect(() => {\n    observer.current = new IntersectionObserver(callback, observerInit);\n\n    // If we have an instance of IO and a list with elements, observer the elements\n    if (observer.current && observerList && observerList.length > 0) {\n      observerList.forEach(element => {\n        observer.current?.observe(element);\n      });\n    }\n\n    // clean up previous elements being listened to\n    return () => {\n      if (observer.current) {\n        observer.current.disconnect();\n      }\n    };\n  }, [observerList, observerInit, callback]);\n\n  return { setObserverList, setObserverInit, observer };\n};\n"],"names":["React","useIsomorphicLayoutEffect","useState","useRef","useIntersectionObserver","callback","options","observer","observerList","setObserverList","observerInit","setObserverInit","current","IntersectionObserver","length","forEach","element","observe","disconnect"],"mappings":"AACA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,4BAA4B;AAEtE,MAAM,EAAEC,SAAQ,EAAEC,OAAM,EAAE,GAAGH;AAE7B;;;;;;;;CAQC,GAED,OAAO,MAAMI,0BAA0B,CACrCC,UACAC,UAKG;IACH,MAAMC,WAAWJ;IACjB,MAAM,CAACK,cAAcC,gBAAgB,GAAGP;IACxC,MAAM,CAACQ,cAAcC,gBAAgB,GAAGT,SAA+CI;IAEvF,iEAAiE;IACjE,6DAA6D;IAC7DL,0BAA0B,IAAM;QAC9BM,SAASK,OAAO,GAAG,IAAIC,qBAAqBR,UAAUK;QAEtD,+EAA+E;QAC/E,IAAIH,SAASK,OAAO,IAAIJ,gBAAgBA,aAAaM,MAAM,GAAG,GAAG;YAC/DN,aAAaO,OAAO,CAACC,CAAAA,UAAW;oBAC9BT;gBAAAA,CAAAA,oBAAAA,SAASK,OAAO,cAAhBL,+BAAAA,KAAAA,IAAAA,kBAAkBU,QAAQD;YAC5B;QACF,CAAC;QAED,+CAA+C;QAC/C,OAAO,IAAM;YACX,IAAIT,SAASK,OAAO,EAAE;gBACpBL,SAASK,OAAO,CAACM,UAAU;YAC7B,CAAC;QACH;IACF,GAAG;QAACV;QAAcE;QAAcL;KAAS;IAEzC,OAAO;QAAEI;QAAiBE;QAAiBJ;IAAS;AACtD,EAAE"}

package/lib/hooks/useResizeObserverRef.js

@@ -3,38 +3,42 @@ import { debounce } from '../utilities/debounce';
 import { canUseDOM } from '@fluentui/react-utilities';
 /**
  * useResizeObserverRef_unstable simplifies resize observer connection and ensures debounce/cleanup
- */
-export const useResizeObserverRef_unstable = resizeCallback => {
-  const container = React.useRef(null);
-  // the handler for resize observer
-  const handleResize = debounce((entries, observer) => {
-    resizeCallback(entries, observer, container);
-  });
-  // Keep the reference of ResizeObserver in the state, as it should live through renders
-  const [resizeObserver, setResizeObserver] = React.useState(() => canUseDOM() ? new ResizeObserver(handleResize) : undefined);
-  React.useEffect(() => {
-    // Update our state when resizeCallback changes
-    resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
-    setResizeObserver(canUseDOM() ? new ResizeObserver(handleResize) : undefined);
+ */ export const useResizeObserverRef_unstable = (resizeCallback)=>{
+    const container = React.useRef(null);
+    // the handler for resize observer
+    const handleResize = debounce((entries, observer)=>{
+        resizeCallback(entries, observer, container);
+    });
+    // Keep the reference of ResizeObserver in the state, as it should live through renders
+    const [resizeObserver, setResizeObserver] = React.useState(()=>canUseDOM() ? new ResizeObserver(handleResize) : undefined);
+    React.useEffect(()=>{
+        // Update our state when resizeCallback changes
+        container.current = null;
+        resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
+        setResizeObserver(canUseDOM() ? new ResizeObserver(handleResize) : undefined);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [resizeCallback]);
-  React.useEffect(() => {
-    return () => {
-      resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
-    };
+    }, [
+        resizeCallback
+    ]);
+    React.useEffect(()=>{
+        return ()=>{
+            container.current = null;
+            resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
+        };
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  const scrollRef = React.useCallback(instance => {
-    if (container.current !== instance) {
-      if (container.current) {
-        resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.unobserve(container.current);
-      }
-      container.current = instance;
-      if (container.current) {
-        resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.observe(container.current);
-      }
-    }
-  }, [resizeObserver]);
-  return scrollRef;
+    }, []);
+    const scrollRef = React.useCallback((instance)=>{
+        if (container.current !== instance) {
+            if (container.current) {
+                resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.unobserve(container.current);
+            }
+            container.current = instance;
+            if (container.current) {
+                resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.observe(container.current);
+            }
+        }
+    }, [
+        resizeObserver
+    ]);
+    return scrollRef;
 };
-//# sourceMappingURL=useResizeObserverRef.js.map