@fluentui/react-virtualizer 9.0.0-alpha.9 → 9.0.0-alpha.91
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +854 -9
- package/dist/index.d.ts +326 -33
- package/lib/Hooks.js +1 -2
- package/lib/Hooks.js.map +1 -1
- package/lib/Utilities.js +1 -0
- package/lib/Utilities.js.map +1 -0
- package/lib/Virtualizer.js +1 -2
- package/lib/Virtualizer.js.map +1 -1
- package/lib/VirtualizerScrollView.js +1 -0
- package/lib/VirtualizerScrollView.js.map +1 -0
- package/lib/VirtualizerScrollViewDynamic.js +1 -0
- package/lib/VirtualizerScrollViewDynamic.js.map +1 -0
- package/lib/components/Virtualizer/Virtualizer.js +6 -7
- package/lib/components/Virtualizer/Virtualizer.js.map +1 -1
- package/lib/components/Virtualizer/Virtualizer.types.js +1 -2
- package/lib/components/Virtualizer/Virtualizer.types.js.map +1 -1
- package/lib/components/Virtualizer/index.js +4 -6
- package/lib/components/Virtualizer/index.js.map +1 -1
- package/lib/components/Virtualizer/renderVirtualizer.js +21 -16
- package/lib/components/Virtualizer/renderVirtualizer.js.map +1 -1
- package/lib/components/Virtualizer/useVirtualizer.js +522 -356
- package/lib/components/Virtualizer/useVirtualizer.js.map +1 -1
- package/lib/components/Virtualizer/{useVirtualizerStyles.js → useVirtualizerStyles.styles.js} +5 -4
- package/lib/components/Virtualizer/useVirtualizerStyles.styles.js.map +1 -0
- package/lib/components/VirtualizerScrollView/VirtualizerScrollView.js +12 -0
- package/lib/components/VirtualizerScrollView/VirtualizerScrollView.js.map +1 -0
- package/lib/components/VirtualizerScrollView/VirtualizerScrollView.types.js +1 -0
- package/lib/components/VirtualizerScrollView/VirtualizerScrollView.types.js.map +1 -0
- package/lib/components/VirtualizerScrollView/index.js +4 -0
- package/lib/components/VirtualizerScrollView/index.js.map +1 -0
- package/lib/components/VirtualizerScrollView/renderVirtualizerScrollView.js +9 -0
- package/lib/components/VirtualizerScrollView/renderVirtualizerScrollView.js.map +1 -0
- package/lib/components/VirtualizerScrollView/useVirtualizerScrollView.js +80 -0
- package/lib/components/VirtualizerScrollView/useVirtualizerScrollView.js.map +1 -0
- package/lib/components/VirtualizerScrollView/useVirtualizerScrollViewStyles.styles.js +46 -0
- package/lib/components/VirtualizerScrollView/useVirtualizerScrollViewStyles.styles.js.map +1 -0
- package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js +12 -0
- package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js.map +1 -0
- package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js +1 -0
- package/lib/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js.map +1 -0
- package/lib/components/VirtualizerScrollViewDynamic/index.js +4 -0
- package/lib/components/VirtualizerScrollViewDynamic/index.js.map +1 -0
- package/lib/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js +9 -0
- package/lib/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js.map +1 -0
- package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js +152 -0
- package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js.map +1 -0
- package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.styles.js +46 -0
- package/lib/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.styles.js.map +1 -0
- package/lib/hooks/hooks.types.js +1 -0
- package/lib/hooks/hooks.types.js.map +1 -0
- package/lib/hooks/index.js +5 -2
- package/lib/hooks/index.js.map +1 -1
- package/lib/hooks/useDynamicPagination.js +126 -0
- package/lib/hooks/useDynamicPagination.js.map +1 -0
- package/lib/hooks/useDynamicVirtualizerMeasure.js +126 -0
- package/lib/hooks/useDynamicVirtualizerMeasure.js.map +1 -0
- package/lib/hooks/useIntersectionObserver.js +117 -40
- package/lib/hooks/useIntersectionObserver.js.map +1 -1
- package/lib/hooks/useMeasureList.js +127 -0
- package/lib/hooks/useMeasureList.js.map +1 -0
- package/lib/hooks/useMutationObserver.js +38 -0
- package/lib/hooks/useMutationObserver.js.map +1 -0
- package/lib/hooks/useResizeObserverRef.js +60 -0
- package/lib/hooks/useResizeObserverRef.js.map +1 -0
- package/lib/hooks/useStaticPagination.js +102 -0
- package/lib/hooks/useStaticPagination.js.map +1 -0
- package/lib/hooks/useVirtualizerMeasure.js +62 -0
- package/lib/hooks/useVirtualizerMeasure.js.map +1 -0
- package/lib/index.js +4 -2
- package/lib/index.js.map +1 -1
- package/lib/utilities/ImperativeScrolling/imperativeScrolling.js +32 -0
- package/lib/utilities/ImperativeScrolling/imperativeScrolling.js.map +1 -0
- package/lib/utilities/ImperativeScrolling/imperativeScrolling.types.js +1 -0
- package/lib/utilities/ImperativeScrolling/imperativeScrolling.types.js.map +1 -0
- package/lib/utilities/ImperativeScrolling/imperativeScrollingDynamic.js +45 -0
- package/lib/utilities/ImperativeScrolling/imperativeScrollingDynamic.js.map +1 -0
- package/lib/utilities/ImperativeScrolling/index.js +2 -0
- package/lib/utilities/ImperativeScrolling/index.js.map +1 -0
- package/lib/utilities/VirtualizerContext/VirtualizerContext.js +26 -0
- package/lib/utilities/VirtualizerContext/VirtualizerContext.js.map +1 -0
- package/lib/utilities/VirtualizerContext/index.js +1 -0
- package/lib/utilities/VirtualizerContext/index.js.map +1 -0
- package/lib/utilities/VirtualizerContext/types.js +1 -0
- package/lib/utilities/VirtualizerContext/types.js.map +1 -0
- package/lib/utilities/createResizeObserverFromDocument.js +13 -0
- package/lib/utilities/createResizeObserverFromDocument.js.map +1 -0
- package/lib/utilities/debounce.js +19 -0
- package/lib/utilities/debounce.js.map +1 -0
- package/lib/utilities/index.js +2 -0
- package/lib/utilities/index.js.map +1 -0
- package/lib-commonjs/Hooks.js +31 -5
- package/lib-commonjs/Hooks.js.map +1 -1
- package/lib-commonjs/Utilities.js +28 -0
- package/lib-commonjs/Utilities.js.map +1 -0
- package/lib-commonjs/Virtualizer.js +28 -5
- package/lib-commonjs/Virtualizer.js.map +1 -1
- package/lib-commonjs/VirtualizerScrollView.js +28 -0
- package/lib-commonjs/VirtualizerScrollView.js.map +1 -0
- package/lib-commonjs/VirtualizerScrollViewDynamic.js +28 -0
- package/lib-commonjs/VirtualizerScrollViewDynamic.js.map +1 -0
- package/lib-commonjs/components/Virtualizer/Virtualizer.js +17 -18
- package/lib-commonjs/components/Virtualizer/Virtualizer.js.map +1 -1
- package/lib-commonjs/components/Virtualizer/Virtualizer.types.js +3 -3
- package/lib-commonjs/components/Virtualizer/Virtualizer.types.js.map +1 -1
- package/lib-commonjs/components/Virtualizer/index.js +31 -9
- package/lib-commonjs/components/Virtualizer/index.js.map +1 -1
- package/lib-commonjs/components/Virtualizer/renderVirtualizer.js +38 -21
- package/lib-commonjs/components/Virtualizer/renderVirtualizer.js.map +1 -1
- package/lib-commonjs/components/Virtualizer/useVirtualizer.js +531 -362
- package/lib-commonjs/components/Virtualizer/useVirtualizer.js.map +1 -1
- package/lib-commonjs/components/Virtualizer/useVirtualizerStyles.styles.js +123 -0
- package/lib-commonjs/components/Virtualizer/useVirtualizerStyles.styles.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.js +21 -0
- package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.types.js +6 -0
- package/lib-commonjs/components/VirtualizerScrollView/VirtualizerScrollView.types.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollView/index.js +31 -0
- package/lib-commonjs/components/VirtualizerScrollView/index.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollView/renderVirtualizerScrollView.js +19 -0
- package/lib-commonjs/components/VirtualizerScrollView/renderVirtualizerScrollView.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollView.js +91 -0
- package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollView.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollViewStyles.styles.js +70 -0
- package/lib-commonjs/components/VirtualizerScrollView/useVirtualizerScrollViewStyles.styles.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js +21 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js +6 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/index.js +31 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/index.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js +19 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js +162 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js.map +1 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.styles.js +70 -0
- package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamicStyles.styles.js.map +1 -0
- package/lib-commonjs/hooks/hooks.types.js +6 -0
- package/lib-commonjs/hooks/hooks.types.js.map +1 -0
- package/lib-commonjs/hooks/index.js +35 -5
- package/lib-commonjs/hooks/index.js.map +1 -1
- package/lib-commonjs/hooks/useDynamicPagination.js +131 -0
- package/lib-commonjs/hooks/useDynamicPagination.js.map +1 -0
- package/lib-commonjs/hooks/useDynamicVirtualizerMeasure.js +134 -0
- package/lib-commonjs/hooks/useDynamicVirtualizerMeasure.js.map +1 -0
- package/lib-commonjs/hooks/useIntersectionObserver.js +129 -53
- package/lib-commonjs/hooks/useIntersectionObserver.js.map +1 -1
- package/lib-commonjs/hooks/useMeasureList.js +134 -0
- package/lib-commonjs/hooks/useMeasureList.js.map +1 -0
- package/lib-commonjs/hooks/useMutationObserver.js +48 -0
- package/lib-commonjs/hooks/useMutationObserver.js.map +1 -0
- package/lib-commonjs/hooks/useResizeObserverRef.js +69 -0
- package/lib-commonjs/hooks/useResizeObserverRef.js.map +1 -0
- package/lib-commonjs/hooks/useStaticPagination.js +107 -0
- package/lib-commonjs/hooks/useStaticPagination.js.map +1 -0
- package/lib-commonjs/hooks/useVirtualizerMeasure.js +70 -0
- package/lib-commonjs/hooks/useVirtualizerMeasure.js.map +1 -0
- package/lib-commonjs/index.js +85 -41
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utilities/ImperativeScrolling/imperativeScrolling.js +42 -0
- package/lib-commonjs/utilities/ImperativeScrolling/imperativeScrolling.js.map +1 -0
- package/lib-commonjs/utilities/ImperativeScrolling/imperativeScrolling.types.js +6 -0
- package/lib-commonjs/utilities/ImperativeScrolling/imperativeScrolling.types.js.map +1 -0
- package/lib-commonjs/utilities/ImperativeScrolling/imperativeScrollingDynamic.js +55 -0
- package/lib-commonjs/utilities/ImperativeScrolling/imperativeScrollingDynamic.js.map +1 -0
- package/lib-commonjs/utilities/ImperativeScrolling/index.js +20 -0
- package/lib-commonjs/utilities/ImperativeScrolling/index.js.map +1 -0
- package/lib-commonjs/utilities/VirtualizerContext/VirtualizerContext.js +48 -0
- package/lib-commonjs/utilities/VirtualizerContext/VirtualizerContext.js.map +1 -0
- package/lib-commonjs/utilities/VirtualizerContext/index.js +22 -0
- package/lib-commonjs/utilities/VirtualizerContext/index.js.map +1 -0
- package/lib-commonjs/utilities/VirtualizerContext/types.js +6 -0
- package/lib-commonjs/utilities/VirtualizerContext/types.js.map +1 -0
- package/lib-commonjs/utilities/createResizeObserverFromDocument.js +23 -0
- package/lib-commonjs/utilities/createResizeObserverFromDocument.js.map +1 -0
- package/lib-commonjs/utilities/debounce.js +29 -0
- package/lib-commonjs/utilities/debounce.js.map +1 -0
- package/lib-commonjs/utilities/index.js +29 -0
- package/lib-commonjs/utilities/index.js.map +1 -0
- package/package.json +20 -24
- package/CHANGELOG.json +0 -140
- package/lib/components/Virtualizer/useVirtualizerStyles.js.map +0 -1
- package/lib-commonjs/components/Virtualizer/useVirtualizerStyles.js +0 -115
- package/lib-commonjs/components/Virtualizer/useVirtualizerStyles.js.map +0 -1
package/lib-commonjs/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.ts"],"sourcesContent":["import type { VirtualizerScrollViewDynamicProps } from './VirtualizerScrollViewDynamic.types';\nimport { useVirtualizerScrollViewDynamic_unstable } from './useVirtualizerScrollViewDynamic';\nimport { renderVirtualizerScrollViewDynamic_unstable } from './renderVirtualizerScrollViewDynamic';\nimport { useVirtualizerScrollViewDynamicStyles_unstable } from './useVirtualizerScrollViewDynamicStyles.styles';\nimport * as React from 'react';\nimport type { VirtualizerContextProps } from '../../Utilities';\n\n/**\n * Virtualizer ScrollView\n */\n\nexport const VirtualizerScrollViewDynamic: React.FC<VirtualizerScrollViewDynamicProps> = (\n props: VirtualizerScrollViewDynamicProps,\n context: React.Context<VirtualizerContextProps>,\n) => {\n const state = useVirtualizerScrollViewDynamic_unstable(props);\n\n useVirtualizerScrollViewDynamicStyles_unstable(state);\n\n return renderVirtualizerScrollViewDynamic_unstable(state);\n};\n\nVirtualizerScrollViewDynamic.displayName = 'VirtualizerScrollViewDynamic';\n"],"names":["VirtualizerScrollViewDynamic","props","context","state","useVirtualizerScrollViewDynamic_unstable","useVirtualizerScrollViewDynamicStyles_unstable","renderVirtualizerScrollViewDynamic_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iDAV4C;oDACG;6DACG;iEACxC;AAOhB,MAAMA,+BAA4E,CACvFC,OACAC;IAEA,MAAMC,QAAQC,IAAAA,yEAAAA,EAAyCH;IAEvDI,IAAAA,2FAAAA,EAA+CF;IAE/C,OAAOG,IAAAA,+EAAAA,EAA4CH;AACrD;AAEAH,6BAA6BO,WAAW,GAAG"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/VirtualizerScrollViewDynamic/VirtualizerScrollViewDynamic.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type {\n VirtualizerConfigProps,\n VirtualizerConfigState,\n VirtualizerChildRenderFunction,\n} from '../Virtualizer/Virtualizer.types';\n\nimport type { VirtualizerScrollViewSlots } from '../VirtualizerScrollView/VirtualizerScrollView.types';\nimport type { DynamicVirtualizerContextProps, ScrollToInterface } from '../../Utilities';\n\nexport type VirtualizerScrollViewDynamicSlots = VirtualizerScrollViewSlots;\n\nexport type VirtualizerScrollViewDynamicProps = ComponentProps<Partial<VirtualizerScrollViewDynamicSlots>> &\n Partial<\n Omit<\n VirtualizerConfigProps,\n 'itemSize' | 'numItems' | 'getItemSize' | 'children' | 'flagIndex' | 'virtualizerContext'\n >\n > & {\n /**\n * Set as the minimum item size.\n * Axis: 'vertical' = Height\n * Axis: 'horizontal' = Width\n */\n itemSize: number;\n /**\n * Callback for acquiring size of individual items\n * @param index - the index of the requested size's child\n * If undefined, Virtualizer will auto-measure by default (performance tradeoff)\n */\n getItemSize?: (index: number) => number;\n /**\n * The total number of items to be virtualized.\n */\n numItems: number;\n /**\n * Child render function.\n * Iteratively called to return current virtualizer DOM children.\n * Will act as a row or column indexer depending on Virtualizer settings.\n */\n children: VirtualizerChildRenderFunction;\n /**\n * Imperative ref contains our scrollTo index functionality for user control.\n */\n imperativeRef?: React.RefObject<ScrollToInterface>;\n /**\n * Imperative ref contains our scrollTo index functionality for user control.\n */\n enablePagination?: boolean;\n /**\n * Enables override of dynamic virtualizer context if required.\n */\n virtualizerContext?: DynamicVirtualizerContextProps;\n };\n\nexport type VirtualizerScrollViewDynamicState = ComponentState<VirtualizerScrollViewDynamicSlots> &\n VirtualizerConfigState;\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
function _export(target, all) {
|
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: all[name]
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
_export(exports, {
|
|
12
|
+
VirtualizerScrollViewDynamic: function() {
|
|
13
|
+
return _VirtualizerScrollViewDynamic.VirtualizerScrollViewDynamic;
|
|
14
|
+
},
|
|
15
|
+
renderVirtualizerScrollViewDynamic_unstable: function() {
|
|
16
|
+
return _renderVirtualizerScrollViewDynamic.renderVirtualizerScrollViewDynamic_unstable;
|
|
17
|
+
},
|
|
18
|
+
useVirtualizerScrollViewDynamicStyles_unstable: function() {
|
|
19
|
+
return _useVirtualizerScrollViewDynamicStylesstyles.useVirtualizerScrollViewDynamicStyles_unstable;
|
|
20
|
+
},
|
|
21
|
+
useVirtualizerScrollViewDynamic_unstable: function() {
|
|
22
|
+
return _useVirtualizerScrollViewDynamic.useVirtualizerScrollViewDynamic_unstable;
|
|
23
|
+
},
|
|
24
|
+
virtualizerScrollViewDynamicClassNames: function() {
|
|
25
|
+
return _useVirtualizerScrollViewDynamicStylesstyles.virtualizerScrollViewDynamicClassNames;
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
const _VirtualizerScrollViewDynamic = require("./VirtualizerScrollViewDynamic");
|
|
29
|
+
const _useVirtualizerScrollViewDynamic = require("./useVirtualizerScrollViewDynamic");
|
|
30
|
+
const _renderVirtualizerScrollViewDynamic = require("./renderVirtualizerScrollViewDynamic");
|
|
31
|
+
const _useVirtualizerScrollViewDynamicStylesstyles = require("./useVirtualizerScrollViewDynamicStyles.styles");
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/VirtualizerScrollViewDynamic/index.ts"],"sourcesContent":["export { VirtualizerScrollViewDynamic } from './VirtualizerScrollViewDynamic';\nexport type {\n VirtualizerScrollViewDynamicProps,\n VirtualizerScrollViewDynamicSlots,\n VirtualizerScrollViewDynamicState,\n} from './VirtualizerScrollViewDynamic.types';\nexport { useVirtualizerScrollViewDynamic_unstable } from './useVirtualizerScrollViewDynamic';\nexport { renderVirtualizerScrollViewDynamic_unstable } from './renderVirtualizerScrollViewDynamic';\nexport {\n useVirtualizerScrollViewDynamicStyles_unstable,\n virtualizerScrollViewDynamicClassNames,\n} from './useVirtualizerScrollViewDynamicStyles.styles';\n"],"names":["VirtualizerScrollViewDynamic","renderVirtualizerScrollViewDynamic_unstable","useVirtualizerScrollViewDynamicStyles_unstable","useVirtualizerScrollViewDynamic_unstable","virtualizerScrollViewDynamicClassNames"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,4BAA4B;eAA5BA,0DAA4B;;IAO5BC,2CAA2C;eAA3CA,+EAA2C;;IAElDC,8CAA8C;eAA9CA,2FAA8C;;IAHvCC,wCAAwC;eAAxCA,yEAAwC;;IAI/CC,sCAAsC;eAAtCA,mFAAsC;;;8CAVK;iDAMY;oDACG;6DAIrD"}
|
package/lib-commonjs/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.js
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "renderVirtualizerScrollViewDynamic_unstable", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return renderVirtualizerScrollViewDynamic_unstable;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
|
|
12
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
|
13
|
+
const _renderVirtualizer = require("../Virtualizer/renderVirtualizer");
|
|
14
|
+
const renderVirtualizerScrollViewDynamic_unstable = (state)=>{
|
|
15
|
+
(0, _reactutilities.assertSlots)(state);
|
|
16
|
+
return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.container, {
|
|
17
|
+
children: (0, _renderVirtualizer.renderVirtualizer_unstable)(state)
|
|
18
|
+
});
|
|
19
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/VirtualizerScrollViewDynamic/renderVirtualizerScrollViewDynamic.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport {\n VirtualizerScrollViewDynamicSlots,\n VirtualizerScrollViewDynamicState,\n} from './VirtualizerScrollViewDynamic.types';\nimport { renderVirtualizer_unstable } from '../Virtualizer/renderVirtualizer';\n\nexport const renderVirtualizerScrollViewDynamic_unstable = (state: VirtualizerScrollViewDynamicState) => {\n assertSlots<VirtualizerScrollViewDynamicSlots>(state);\n return <state.container>{renderVirtualizer_unstable(state)}</state.container>;\n};\n"],"names":["renderVirtualizerScrollViewDynamic_unstable","state","assertSlots","_jsx","container","renderVirtualizer_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;4BARb;gCAC4B;mCAKe;AAEpC,MAAMA,8CAA8C,CAACC;IAC1DC,IAAAA,2BAAAA,EAA+CD;IAC/C,OAAA,WAAA,GAAOE,IAAAA,eAAA,EAACF,MAAMG,SAAS,EAAA;kBAAEC,IAAAA,6CAAAA,EAA2BJ;;AACtD"}
|
package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js
ADDED
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "useVirtualizerScrollViewDynamic_unstable", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return useVirtualizerScrollViewDynamic_unstable;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
|
14
|
+
const _useVirtualizer = require("../Virtualizer/useVirtualizer");
|
|
15
|
+
const _Hooks = require("../../Hooks");
|
|
16
|
+
const _Utilities = require("../../Utilities");
|
|
17
|
+
const _useMeasureList = require("../../hooks/useMeasureList");
|
|
18
|
+
const _useDynamicPagination = require("../../hooks/useDynamicPagination");
|
|
19
|
+
function useVirtualizerScrollViewDynamic_unstable(props) {
|
|
20
|
+
'use no memo';
|
|
21
|
+
var _imperativeVirtualizerRef_current;
|
|
22
|
+
const contextState = (0, _Utilities.useVirtualizerContextState_unstable)(props.virtualizerContext);
|
|
23
|
+
const { imperativeRef, axis = 'vertical', reversed, imperativeVirtualizerRef, enablePagination = false, bufferItems: _bufferItems, bufferSize: _bufferSize } = props;
|
|
24
|
+
let sizeTrackingArray = _react.useRef(new Array(props.numItems).fill(props.itemSize));
|
|
25
|
+
// This lets us trigger updates when a size change occurs.
|
|
26
|
+
const [sizeUpdateCount, setSizeUpdateCount] = _react.useState(0);
|
|
27
|
+
const getChildSizeAuto = _react.useCallback((index)=>{
|
|
28
|
+
if (sizeTrackingArray.current.length <= index || sizeTrackingArray.current[index] <= 0) {
|
|
29
|
+
// Default size for initial state or untracked
|
|
30
|
+
return props.itemSize;
|
|
31
|
+
}
|
|
32
|
+
/* Required to be defined prior to our measure function
|
|
33
|
+
* we use a sizing array ref that we will update post-render
|
|
34
|
+
*/ return sizeTrackingArray.current[index];
|
|
35
|
+
}, [
|
|
36
|
+
sizeTrackingArray,
|
|
37
|
+
props.itemSize,
|
|
38
|
+
sizeUpdateCount
|
|
39
|
+
]);
|
|
40
|
+
var _props_axis, _props_getItemSize;
|
|
41
|
+
const { virtualizerLength, bufferItems, bufferSize, scrollRef, containerSizeRef, updateScrollPosition } = (0, _Hooks.useDynamicVirtualizerMeasure)({
|
|
42
|
+
defaultItemSize: props.itemSize,
|
|
43
|
+
direction: (_props_axis = props.axis) !== null && _props_axis !== void 0 ? _props_axis : 'vertical',
|
|
44
|
+
getItemSize: (_props_getItemSize = props.getItemSize) !== null && _props_getItemSize !== void 0 ? _props_getItemSize : getChildSizeAuto,
|
|
45
|
+
virtualizerContext: contextState,
|
|
46
|
+
numItems: props.numItems,
|
|
47
|
+
bufferItems: _bufferItems,
|
|
48
|
+
bufferSize: _bufferSize
|
|
49
|
+
});
|
|
50
|
+
const _imperativeVirtualizerRef = (0, _reactutilities.useMergedRefs)(_react.useRef(null), imperativeVirtualizerRef);
|
|
51
|
+
var _contextState_contextIndex;
|
|
52
|
+
const paginationRef = (0, _useDynamicPagination.useDynamicVirtualizerPagination)({
|
|
53
|
+
axis,
|
|
54
|
+
progressiveItemSizes: (_imperativeVirtualizerRef_current = _imperativeVirtualizerRef.current) === null || _imperativeVirtualizerRef_current === void 0 ? void 0 : _imperativeVirtualizerRef_current.progressiveSizes,
|
|
55
|
+
virtualizerLength,
|
|
56
|
+
currentIndex: (_contextState_contextIndex = contextState === null || contextState === void 0 ? void 0 : contextState.contextIndex) !== null && _contextState_contextIndex !== void 0 ? _contextState_contextIndex : 0
|
|
57
|
+
}, enablePagination);
|
|
58
|
+
// Store the virtualizer length as a ref for imperative ref access
|
|
59
|
+
const virtualizerLengthRef = _react.useRef(virtualizerLength);
|
|
60
|
+
if (virtualizerLengthRef.current !== virtualizerLength) {
|
|
61
|
+
virtualizerLengthRef.current = virtualizerLength;
|
|
62
|
+
}
|
|
63
|
+
const scrollViewRef = (0, _reactutilities.useMergedRefs)(props.scrollViewRef, scrollRef, paginationRef);
|
|
64
|
+
const scrollCallbackRef = _react.useRef(null);
|
|
65
|
+
_react.useImperativeHandle(imperativeRef, ()=>{
|
|
66
|
+
var _imperativeVirtualizerRef_current;
|
|
67
|
+
return {
|
|
68
|
+
scrollTo (index, behavior = 'auto', callback) {
|
|
69
|
+
scrollCallbackRef.current = callback !== null && callback !== void 0 ? callback : null;
|
|
70
|
+
if (_imperativeVirtualizerRef.current) {
|
|
71
|
+
var _imperativeVirtualizerRef_current;
|
|
72
|
+
const progressiveSizes = _imperativeVirtualizerRef.current.progressiveSizes.current;
|
|
73
|
+
const totalSize = progressiveSizes && (progressiveSizes === null || progressiveSizes === void 0 ? void 0 : progressiveSizes.length) > 0 ? progressiveSizes[Math.max(progressiveSizes.length - 1, 0)] : 0;
|
|
74
|
+
_imperativeVirtualizerRef.current.setFlaggedIndex(index);
|
|
75
|
+
(0, _Utilities.scrollToItemDynamic)({
|
|
76
|
+
index,
|
|
77
|
+
itemSizes: (_imperativeVirtualizerRef_current = _imperativeVirtualizerRef.current) === null || _imperativeVirtualizerRef_current === void 0 ? void 0 : _imperativeVirtualizerRef_current.nodeSizes,
|
|
78
|
+
totalSize,
|
|
79
|
+
scrollViewRef: scrollViewRef,
|
|
80
|
+
axis,
|
|
81
|
+
reversed,
|
|
82
|
+
behavior
|
|
83
|
+
});
|
|
84
|
+
}
|
|
85
|
+
},
|
|
86
|
+
currentIndex: (_imperativeVirtualizerRef_current = _imperativeVirtualizerRef.current) === null || _imperativeVirtualizerRef_current === void 0 ? void 0 : _imperativeVirtualizerRef_current.currentIndex,
|
|
87
|
+
virtualizerLength: virtualizerLengthRef
|
|
88
|
+
};
|
|
89
|
+
}, [
|
|
90
|
+
axis,
|
|
91
|
+
scrollViewRef,
|
|
92
|
+
reversed,
|
|
93
|
+
_imperativeVirtualizerRef
|
|
94
|
+
]);
|
|
95
|
+
const handleRenderedIndex = (index)=>{
|
|
96
|
+
if (scrollCallbackRef.current) {
|
|
97
|
+
scrollCallbackRef.current(index);
|
|
98
|
+
}
|
|
99
|
+
};
|
|
100
|
+
var _props_getItemSize1;
|
|
101
|
+
const virtualizerState = (0, _useVirtualizer.useVirtualizer_unstable)({
|
|
102
|
+
...props,
|
|
103
|
+
getItemSize: (_props_getItemSize1 = props.getItemSize) !== null && _props_getItemSize1 !== void 0 ? _props_getItemSize1 : getChildSizeAuto,
|
|
104
|
+
virtualizerLength,
|
|
105
|
+
bufferItems,
|
|
106
|
+
bufferSize,
|
|
107
|
+
virtualizerContext: contextState,
|
|
108
|
+
imperativeVirtualizerRef: _imperativeVirtualizerRef,
|
|
109
|
+
onRenderedFlaggedIndex: handleRenderedIndex,
|
|
110
|
+
containerSizeRef,
|
|
111
|
+
scrollViewRef,
|
|
112
|
+
updateScrollPosition
|
|
113
|
+
});
|
|
114
|
+
const measureObject = (0, _useMeasureList.useMeasureList)(virtualizerState.virtualizerStartIndex, virtualizerLength, props.numItems, props.itemSize);
|
|
115
|
+
if (enablePagination && measureObject.sizeUpdateCount !== sizeUpdateCount) {
|
|
116
|
+
/* This enables us to let callback know that the sizes have been updated
|
|
117
|
+
triggers a re-render but is only required on pagination (else index change handles) */ setSizeUpdateCount(measureObject.sizeUpdateCount);
|
|
118
|
+
}
|
|
119
|
+
if (axis === 'horizontal') {
|
|
120
|
+
sizeTrackingArray = measureObject.widthArray;
|
|
121
|
+
} else {
|
|
122
|
+
sizeTrackingArray = measureObject.heightArray;
|
|
123
|
+
}
|
|
124
|
+
if (!props.getItemSize) {
|
|
125
|
+
// Auto-measuring is required
|
|
126
|
+
_react.Children.map(virtualizerState.virtualizedChildren, (child, index)=>{
|
|
127
|
+
if (/*#__PURE__*/ _react.isValidElement(child)) {
|
|
128
|
+
virtualizerState.virtualizedChildren[index] = /*#__PURE__*/ _react.createElement(child.type, {
|
|
129
|
+
...child.props,
|
|
130
|
+
key: child.key,
|
|
131
|
+
ref: (element)=>{
|
|
132
|
+
if (child.hasOwnProperty('ref')) {
|
|
133
|
+
// We must access this from the child directly, not props (forward ref).
|
|
134
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
135
|
+
const localRef = child === null || child === void 0 ? void 0 : child.ref;
|
|
136
|
+
if (typeof localRef === 'function') {
|
|
137
|
+
localRef(element);
|
|
138
|
+
} else if (localRef) {
|
|
139
|
+
localRef.current = element;
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
// Call the auto-measure ref attachment.
|
|
143
|
+
measureObject.createIndexedRef(index)(element);
|
|
144
|
+
}
|
|
145
|
+
});
|
|
146
|
+
}
|
|
147
|
+
});
|
|
148
|
+
}
|
|
149
|
+
return {
|
|
150
|
+
...virtualizerState,
|
|
151
|
+
components: {
|
|
152
|
+
...virtualizerState.components,
|
|
153
|
+
container: 'div'
|
|
154
|
+
},
|
|
155
|
+
container: _reactutilities.slot.always(props.container, {
|
|
156
|
+
defaultProps: {
|
|
157
|
+
ref: scrollViewRef
|
|
158
|
+
},
|
|
159
|
+
elementType: 'div'
|
|
160
|
+
})
|
|
161
|
+
};
|
|
162
|
+
}
|
package/lib-commonjs/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/VirtualizerScrollViewDynamic/useVirtualizerScrollViewDynamic.tsx"],"sourcesContent":["import * as React from 'react';\nimport { slot, 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 { useMeasureList } from '../../hooks/useMeasureList';\nimport type { IndexedResizeCallbackElement } from '../../hooks/useMeasureList';\nimport { useDynamicVirtualizerPagination } from '../../hooks/useDynamicPagination';\n\nexport function useVirtualizerScrollViewDynamic_unstable(\n props: VirtualizerScrollViewDynamicProps,\n): VirtualizerScrollViewDynamicState {\n 'use no memo';\n\n const contextState = useVirtualizerContextState_unstable(props.virtualizerContext);\n const {\n imperativeRef,\n axis = 'vertical',\n reversed,\n imperativeVirtualizerRef,\n enablePagination = false,\n bufferItems: _bufferItems,\n bufferSize: _bufferSize,\n } = props;\n\n let sizeTrackingArray = React.useRef<number[]>(new Array(props.numItems).fill(props.itemSize));\n\n // This lets us trigger updates when a size change occurs.\n const [sizeUpdateCount, setSizeUpdateCount] = React.useState(0);\n\n const getChildSizeAuto = React.useCallback(\n (index: number) => {\n if (sizeTrackingArray.current.length <= index || sizeTrackingArray.current[index] <= 0) {\n // Default size for initial state or untracked\n return props.itemSize;\n }\n /* Required to be defined prior to our measure function\n * we use a sizing array ref that we will update post-render\n */\n return sizeTrackingArray.current[index];\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [sizeTrackingArray, props.itemSize, sizeUpdateCount],\n );\n\n const { virtualizerLength, bufferItems, bufferSize, scrollRef, containerSizeRef, updateScrollPosition } =\n useDynamicVirtualizerMeasure({\n defaultItemSize: props.itemSize,\n direction: props.axis ?? 'vertical',\n getItemSize: props.getItemSize ?? getChildSizeAuto,\n virtualizerContext: contextState,\n numItems: props.numItems,\n bufferItems: _bufferItems,\n bufferSize: _bufferSize,\n });\n\n const _imperativeVirtualizerRef = useMergedRefs(React.useRef<VirtualizerDataRef>(null), imperativeVirtualizerRef);\n\n const paginationRef = useDynamicVirtualizerPagination(\n {\n axis,\n progressiveItemSizes: _imperativeVirtualizerRef.current?.progressiveSizes,\n virtualizerLength,\n currentIndex: contextState?.contextIndex ?? 0,\n },\n enablePagination,\n );\n\n // Store the virtualizer length as a ref for imperative ref access\n const virtualizerLengthRef = React.useRef<number>(virtualizerLength);\n if (virtualizerLengthRef.current !== virtualizerLength) {\n virtualizerLengthRef.current = virtualizerLength;\n }\n const scrollViewRef = useMergedRefs(props.scrollViewRef, scrollRef, paginationRef);\n const scrollCallbackRef = React.useRef<null | ((index: number) => void)>(null);\n\n React.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: scrollViewRef as React.RefObject<HTMLDivElement>,\n axis,\n reversed,\n behavior,\n });\n }\n },\n currentIndex: _imperativeVirtualizerRef.current?.currentIndex,\n virtualizerLength: virtualizerLengthRef,\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 getItemSize: props.getItemSize ?? getChildSizeAuto,\n virtualizerLength,\n bufferItems,\n bufferSize,\n virtualizerContext: contextState,\n imperativeVirtualizerRef: _imperativeVirtualizerRef,\n onRenderedFlaggedIndex: handleRenderedIndex,\n containerSizeRef,\n scrollViewRef,\n updateScrollPosition,\n });\n\n const measureObject = useMeasureList(\n virtualizerState.virtualizerStartIndex,\n virtualizerLength,\n props.numItems,\n props.itemSize,\n );\n\n if (enablePagination && measureObject.sizeUpdateCount !== sizeUpdateCount) {\n /* This enables us to let callback know that the sizes have been updated\n triggers a re-render but is only required on pagination (else index change handles) */\n setSizeUpdateCount(measureObject.sizeUpdateCount);\n }\n\n if (axis === 'horizontal') {\n sizeTrackingArray = measureObject.widthArray;\n } else {\n sizeTrackingArray = measureObject.heightArray;\n }\n\n if (!props.getItemSize) {\n // Auto-measuring is required\n React.Children.map(virtualizerState.virtualizedChildren, (child, index) => {\n if (React.isValidElement(child)) {\n virtualizerState.virtualizedChildren[index] = (\n <child.type\n {...child.props}\n key={child.key}\n ref={(element: HTMLElement & IndexedResizeCallbackElement) => {\n if (child.hasOwnProperty('ref')) {\n // We must access this from the child directly, not props (forward ref).\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const localRef = (child as any)?.ref;\n\n if (typeof localRef === 'function') {\n localRef(element);\n } else if (localRef) {\n localRef.current = element;\n }\n }\n\n // Call the auto-measure ref attachment.\n measureObject.createIndexedRef(index)(element);\n }}\n />\n );\n }\n });\n }\n\n return {\n ...virtualizerState,\n components: {\n ...virtualizerState.components,\n container: 'div',\n },\n container: slot.always(props.container, {\n defaultProps: {\n ref: scrollViewRef,\n },\n elementType: 'div',\n }),\n };\n}\n"],"names":["useVirtualizerScrollViewDynamic_unstable","props","_imperativeVirtualizerRef","contextState","useVirtualizerContextState_unstable","virtualizerContext","imperativeRef","axis","reversed","imperativeVirtualizerRef","enablePagination","bufferItems","_bufferItems","bufferSize","_bufferSize","sizeTrackingArray","React","useRef","Array","numItems","fill","itemSize","sizeUpdateCount","setSizeUpdateCount","useState","getChildSizeAuto","useCallback","index","current","length","virtualizerLength","scrollRef","containerSizeRef","updateScrollPosition","useDynamicVirtualizerMeasure","defaultItemSize","direction","getItemSize","useMergedRefs","paginationRef","useDynamicVirtualizerPagination","progressiveItemSizes","progressiveSizes","currentIndex","contextIndex","virtualizerLengthRef","scrollViewRef","scrollCallbackRef","useImperativeHandle","scrollTo","behavior","callback","totalSize","Math","max","setFlaggedIndex","scrollToItemDynamic","itemSizes","nodeSizes","handleRenderedIndex","virtualizerState","useVirtualizer_unstable","onRenderedFlaggedIndex","measureObject","useMeasureList","virtualizerStartIndex","widthArray","heightArray","Children","map","virtualizedChildren","child","isValidElement","createElement","type","key","ref","element","hasOwnProperty","localRef","createIndexedRef","components","container","slot","always","defaultProps","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAcgBA;;;eAAAA;;;;iEAdO;gCACa;gCACI;uBAKK;2BAC4B;gCAE1C;sCAEiB;AAEzC,SAASA,yCACdC,KAAwC;IAExC;QAiD0BC;IA/C1B,MAAMC,eAAeC,IAAAA,8CAAAA,EAAoCH,MAAMI,kBAAkB;IACjF,MAAM,EACJC,aAAa,EACbC,OAAO,UAAU,EACjBC,QAAQ,EACRC,wBAAwB,EACxBC,mBAAmB,KAAK,EACxBC,aAAaC,YAAY,EACzBC,YAAYC,WAAW,EACxB,GAAGb;IAEJ,IAAIc,oBAAoBC,OAAMC,MAAM,CAAW,IAAIC,MAAMjB,MAAMkB,QAAQ,EAAEC,IAAI,CAACnB,MAAMoB,QAAQ;IAE5F,0DAA0D;IAC1D,MAAM,CAACC,iBAAiBC,mBAAmB,GAAGP,OAAMQ,QAAQ,CAAC;IAE7D,MAAMC,mBAAmBT,OAAMU,WAAW,CACxC,CAACC;QACC,IAAIZ,kBAAkBa,OAAO,CAACC,MAAM,IAAIF,SAASZ,kBAAkBa,OAAO,CAACD,MAAM,IAAI,GAAG;YACtF,8CAA8C;YAC9C,OAAO1B,MAAMoB,QAAQ;QACvB;QACA;;OAEC,GACD,OAAON,kBAAkBa,OAAO,CAACD,MAAM;IACzC,GAEA;QAACZ;QAAmBd,MAAMoB,QAAQ;QAAEC;KAAgB;QAMvCrB,aACEA;IAJjB,MAAM,EAAE6B,iBAAiB,EAAEnB,WAAW,EAAEE,UAAU,EAAEkB,SAAS,EAAEC,gBAAgB,EAAEC,oBAAoB,EAAE,GACrGC,IAAAA,mCAAAA,EAA6B;QAC3BC,iBAAiBlC,MAAMoB,QAAQ;QAC/Be,WAAWnC,CAAAA,cAAAA,MAAMM,IAAI,AAAJA,MAAI,QAAVN,gBAAAA,KAAAA,IAAAA,cAAc;QACzBoC,aAAapC,CAAAA,qBAAAA,MAAMoC,WAAW,AAAXA,MAAW,QAAjBpC,uBAAAA,KAAAA,IAAAA,qBAAqBwB;QAClCpB,oBAAoBF;QACpBgB,UAAUlB,MAAMkB,QAAQ;QACxBR,aAAaC;QACbC,YAAYC;IACd;IAEF,MAAMZ,4BAA4BoC,IAAAA,6BAAAA,EAActB,OAAMC,MAAM,CAAqB,OAAOR;QAOtEN;IALlB,MAAMoC,gBAAgBC,IAAAA,qDAAAA,EACpB;QACEjC;QACAkC,sBAAoB,AAAEvC,CAAAA,oCAAAA,0BAA0B0B,OAAO,AAAPA,MAAO,QAAjC1B,sCAAAA,KAAAA,IAAAA,KAAAA,IAAAA,kCAAmCwC,gBAAgB;QACzEZ;QACAa,cAAcxC,CAAAA,6BAAAA,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAcyC,YAAY,AAAZA,MAAY,QAA1BzC,+BAAAA,KAAAA,IAAAA,6BAA8B;IAC9C,GACAO;IAGF,kEAAkE;IAClE,MAAMmC,uBAAuB7B,OAAMC,MAAM,CAASa;IAClD,IAAIe,qBAAqBjB,OAAO,KAAKE,mBAAmB;QACtDe,qBAAqBjB,OAAO,GAAGE;IACjC;IACA,MAAMgB,gBAAgBR,IAAAA,6BAAAA,EAAcrC,MAAM6C,aAAa,EAAEf,WAAWQ;IACpE,MAAMQ,oBAAoB/B,OAAMC,MAAM,CAAmC;IAEzED,OAAMgC,mBAAmB,CACvB1C,eACA;YAuBkBJ;QAtBhB,OAAO;YACL+C,UAAStB,KAAa,EAAEuB,WAAW,MAAM,EAAEC,QAA+C;gBACxFJ,kBAAkBnB,OAAO,GAAGuB,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,WAAY;gBACxC,IAAIjD,0BAA0B0B,OAAO,EAAE;wBAUxB1B;oBATb,MAAMwC,mBAAmBxC,0BAA0B0B,OAAO,CAACc,gBAAgB,CAACd,OAAO;oBACnF,MAAMwB,YACJV,oBAAoBA,CAAAA,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,iBAAkBb,MAAM,AAANA,IAAS,IAC3Ca,gBAAgB,CAACW,KAAKC,GAAG,CAACZ,iBAAiBb,MAAM,GAAG,GAAG,GAAG,GAC1D;oBAEN3B,0BAA0B0B,OAAO,CAAC2B,eAAe,CAAC5B;oBAClD6B,IAAAA,8BAAAA,EAAoB;wBAClB7B;wBACA8B,WAAS,AAAEvD,CAAAA,oCAAAA,0BAA0B0B,OAAO,AAAPA,MAAO,QAAjC1B,sCAAAA,KAAAA,IAAAA,KAAAA,IAAAA,kCAAmCwD,SAAS;wBACvDN;wBACAN,eAAeA;wBACfvC;wBACAC;wBACA0C;oBACF;gBACF;YACF;YACAP,cAAY,AAAEzC,CAAAA,oCAAAA,0BAA0B0B,OAAO,AAAPA,MAAO,QAAjC1B,sCAAAA,KAAAA,IAAAA,KAAAA,IAAAA,kCAAmCyC,YAAY;YAC7Db,mBAAmBe;QACrB;IACF,GACA;QAACtC;QAAMuC;QAAetC;QAAUN;KAA0B;IAG5D,MAAMyD,sBAAsB,CAAChC;QAC3B,IAAIoB,kBAAkBnB,OAAO,EAAE;YAC7BmB,kBAAkBnB,OAAO,CAACD;QAC5B;IACF;QAIe1B;IAFf,MAAM2D,mBAAmBC,IAAAA,uCAAAA,EAAwB;QAC/C,GAAG5D,KAAK;QACRoC,aAAapC,CAAAA,sBAAAA,MAAMoC,WAAW,AAAXA,MAAW,QAAjBpC,wBAAAA,KAAAA,IAAAA,sBAAqBwB;QAClCK;QACAnB;QACAE;QACAR,oBAAoBF;QACpBM,0BAA0BP;QAC1B4D,wBAAwBH;QACxB3B;QACAc;QACAb;IACF;IAEA,MAAM8B,gBAAgBC,IAAAA,8BAAAA,EACpBJ,iBAAiBK,qBAAqB,EACtCnC,mBACA7B,MAAMkB,QAAQ,EACdlB,MAAMoB,QAAQ;IAGhB,IAAIX,oBAAoBqD,cAAczC,eAAe,KAAKA,iBAAiB;QACzE;wFACoF,GACpFC,mBAAmBwC,cAAczC,eAAe;IAClD;IAEA,IAAIf,SAAS,cAAc;QACzBQ,oBAAoBgD,cAAcG,UAAU;IAC9C,OAAO;QACLnD,oBAAoBgD,cAAcI,WAAW;IAC/C;IAEA,IAAI,CAAClE,MAAMoC,WAAW,EAAE;QACtB,6BAA6B;QAC7BrB,OAAMoD,QAAQ,CAACC,GAAG,CAACT,iBAAiBU,mBAAmB,EAAE,CAACC,OAAO5C;YAC/D,IAAA,WAAA,GAAIX,OAAMwD,cAAc,CAACD,QAAQ;gBAC/BX,iBAAiBU,mBAAmB,CAAC3C,MAAM,GAAA,WAAA,GACzCX,OAAAyD,aAAA,CAACF,MAAMG,IAAI,EAAA;oBACR,GAAGH,MAAMtE,KAAK;oBACf0E,KAAKJ,MAAMI,GAAG;oBACdC,KAAK,CAACC;wBACJ,IAAIN,MAAMO,cAAc,CAAC,QAAQ;4BAC/B,wEAAwE;4BACxE,+DAA+D;4BAC/D,MAAMC,WAAYR,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAADA,MAAgBK,GAAG;4BAEpC,IAAI,OAAOG,aAAa,YAAY;gCAClCA,SAASF;4BACX,OAAO,IAAIE,UAAU;gCACnBA,SAASnD,OAAO,GAAGiD;4BACrB;wBACF;wBAEA,wCAAwC;wBACxCd,cAAciB,gBAAgB,CAACrD,OAAOkD;oBACxC;;YAGN;QACF;IACF;IAEA,OAAO;QACL,GAAGjB,gBAAgB;QACnBqB,YAAY;YACV,GAAGrB,iBAAiBqB,UAAU;YAC9BC,WAAW;QACb;QACAA,WAAWC,oBAAAA,CAAKC,MAAM,CAACnF,MAAMiF,SAAS,EAAE;YACtCG,cAAc;gBACZT,KAAK9B;YACP;YACAwC,aAAa;QACf;IACF;AACF"}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
function _export(target, all) {
|
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: all[name]
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
_export(exports, {
|
|
12
|
+
useVirtualizerScrollViewDynamicStyles_unstable: function() {
|
|
13
|
+
return useVirtualizerScrollViewDynamicStyles_unstable;
|
|
14
|
+
},
|
|
15
|
+
virtualizerScrollViewDynamicClassNames: function() {
|
|
16
|
+
return virtualizerScrollViewDynamicClassNames;
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
const _useVirtualizerStylesstyles = require("../Virtualizer/useVirtualizerStyles.styles");
|
|
20
|
+
const _react = require("@griffel/react");
|
|
21
|
+
const virtualizerScrollViewDynamicClassName = 'fui-Virtualizer-Scroll-View-Dynamic';
|
|
22
|
+
const virtualizerScrollViewDynamicClassNames = {
|
|
23
|
+
..._useVirtualizerStylesstyles.virtualizerClassNames,
|
|
24
|
+
container: `${virtualizerScrollViewDynamicClassName}__container`
|
|
25
|
+
};
|
|
26
|
+
const useStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
27
|
+
base: {
|
|
28
|
+
mc9l5x: "f22iagw",
|
|
29
|
+
a9b677: "fly5x3f",
|
|
30
|
+
Bqenvij: "f1l02sjl"
|
|
31
|
+
},
|
|
32
|
+
vertical: {
|
|
33
|
+
Beiy3e4: "f1vx9l62",
|
|
34
|
+
Bmxbyg5: "f5zp4f"
|
|
35
|
+
},
|
|
36
|
+
horizontal: {
|
|
37
|
+
Beiy3e4: "f1063pyq",
|
|
38
|
+
B68tc82: "f1oy3dpc"
|
|
39
|
+
},
|
|
40
|
+
verticalReversed: {
|
|
41
|
+
Beiy3e4: "f1gkdon0",
|
|
42
|
+
Bmxbyg5: "f5zp4f"
|
|
43
|
+
},
|
|
44
|
+
horizontalReversed: {
|
|
45
|
+
Beiy3e4: "f1oztnx0",
|
|
46
|
+
B68tc82: "f1oy3dpc"
|
|
47
|
+
}
|
|
48
|
+
}, {
|
|
49
|
+
d: [
|
|
50
|
+
".f22iagw{display:flex;}",
|
|
51
|
+
".fly5x3f{width:100%;}",
|
|
52
|
+
".f1l02sjl{height:100%;}",
|
|
53
|
+
".f1vx9l62{flex-direction:column;}",
|
|
54
|
+
".f5zp4f{overflow-y:auto;}",
|
|
55
|
+
".f1063pyq{flex-direction:row;}",
|
|
56
|
+
".f1oy3dpc{overflow-x:auto;}",
|
|
57
|
+
".f1gkdon0{flex-direction:column-reverse;}",
|
|
58
|
+
".f1oztnx0{flex-direction:row-reverse;}"
|
|
59
|
+
]
|
|
60
|
+
});
|
|
61
|
+
const useVirtualizerScrollViewDynamicStyles_unstable = (state)=>{
|
|
62
|
+
'use no memo';
|
|
63
|
+
const styles = useStyles();
|
|
64
|
+
// Default virtualizer styles base
|
|
65
|
+
(0, _useVirtualizerStylesstyles.useVirtualizerStyles_unstable)(state);
|
|
66
|
+
const containerStyle = state.axis === 'horizontal' ? state.reversed ? styles.horizontalReversed : styles.horizontal : state.reversed ? styles.verticalReversed : styles.vertical;
|
|
67
|
+
// Add container styles
|
|
68
|
+
state.container.className = (0, _react.mergeClasses)(virtualizerScrollViewDynamicClassNames.container, styles.base, containerStyle, state.container.className);
|
|
69
|
+
return state;
|
|
70
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"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 },\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 'use no memo';\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"],"names":["useVirtualizerScrollViewDynamicStyles_unstable","virtualizerScrollViewDynamicClassNames","virtualizerScrollViewDynamicClassName","virtualizerClassNames","container","useStyles","__styles","base","mc9l5x","a9b677","Bqenvij","vertical","Beiy3e4","Bmxbyg5","horizontal","B68tc82","verticalReversed","horizontalReversed","d","state","styles","useVirtualizerStyles_unstable","containerStyle","axis","reversed","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAgCiBA,8CAA8C;eAA9CA;;IA7BJC,sCAAsC;eAAtCA;;;4CAHwD;uBAC5B;AACzC,MAAMC,wCAAwC;AACvC,MAAMD,yCAAyC;IAClD,GAAGE,iDAAqB;IACxBC,WAAW,CAAA,EAAGF,sCAAqC,WAAA,CAAA;AACvD;AACA,MAAMG,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAC,MAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;IAAA;IAAAC,UAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAAC,YAAA;QAAAF,SAAA;QAAAG,SAAA;IAAA;IAAAC,kBAAA;QAAAJ,SAAA;QAAAC,SAAA;IAAA;IAAAI,oBAAA;QAAAL,SAAA;QAAAG,SAAA;IAAA;AAAA,GAAA;IAAAG,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AAyBP,MAAMlB,iDAAkDmB,CAAAA;IAC/D;IACA,MAAMC,SAASf;IACf,kCAAA;IACAgB,IAAAA,yDAA6B,EAACF;IAC9B,MAAMG,iBAAiBH,MAAMI,IAAI,KAAK,eAAeJ,MAAMK,QAAQ,GAAGJ,OAAOH,kBAAkB,GAAGG,OAAON,UAAU,GAAGK,MAAMK,QAAQ,GAAGJ,OAAOJ,gBAAgB,GAAGI,OAAOT,QAAQ;IAChL,uBAAA;IACAQ,MAAMf,SAAS,CAACqB,SAAS,GAAGC,IAAAA,mBAAY,EAACzB,uCAAuCG,SAAS,EAAEgB,OAAOb,IAAI,EAAEe,gBAAgBH,MAAMf,SAAS,CAACqB,SAAS;IACjJ,OAAON;AACX"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/hooks/hooks.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { DynamicVirtualizerContextProps } from '../Utilities';\n\nexport type VirtualizerMeasureProps = {\n defaultItemSize: number;\n direction?: 'vertical' | 'horizontal';\n\n /**\n * Override recommended number of buffer items\n */\n bufferItems?: number;\n\n /**\n * Override recommended buffer size (px)\n */\n bufferSize?: number;\n};\n\nexport type VirtualizerMeasureDynamicProps = {\n defaultItemSize: number;\n virtualizerContext: DynamicVirtualizerContextProps;\n numItems: number;\n getItemSize: (index: number) => number;\n direction?: 'vertical' | 'horizontal';\n\n /**\n * Override recommended number of buffer items\n */\n bufferItems?: number;\n\n /**\n * Override recommended buffer size (px)\n */\n bufferSize?: number;\n};\n\nexport type VirtualizerStaticPaginationProps = {\n itemSize: number;\n axis?: 'vertical' | 'horizontal';\n};\n\n/**\n * Props to be passed into dynamic virtualization hooks\n * All props can be acquired from useVirtualizer hooks themselves and passed in\n */\nexport type VirtualizerDynamicPaginationProps = {\n /**\n * An array that tracks the sizing of each item in virtualizer cumulatively\n */\n progressiveItemSizes: React.RefObject<number[]> | undefined;\n /**\n * The current starting index of the virtualizer's DOM elements\n */\n currentIndex: number;\n /**\n * The axis we should paginate on (should match virtualizer's axis)\n */\n axis?: 'vertical' | 'horizontal';\n /**\n * The current length of Virtualizer's actual DOM elements\n */\n virtualizerLength: number;\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 (\n entries: ResizeObserverEntry[],\n // TODO: exclude types from this lint rule: https://github.com/microsoft/fluentui/issues/31286\n // eslint-disable-next-line no-restricted-globals\n observer: ResizeObserver,\n scrollRef?: React.MutableRefObject<HTMLElement | null>,\n ): void;\n}\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
|
|
@@ -1,8 +1,38 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
|
|
3
|
+
value: true
|
|
5
4
|
});
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
function _export(target, all) {
|
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: all[name]
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
_export(exports, {
|
|
12
|
+
createResizeObserverFromDocument: function() {
|
|
13
|
+
return _useMeasureList.createResizeObserverFromDocument;
|
|
14
|
+
},
|
|
15
|
+
getRTLRootMargin: function() {
|
|
16
|
+
return _useIntersectionObserver.getRTLRootMargin;
|
|
17
|
+
},
|
|
18
|
+
useDynamicVirtualizerMeasure: function() {
|
|
19
|
+
return _useDynamicVirtualizerMeasure.useDynamicVirtualizerMeasure;
|
|
20
|
+
},
|
|
21
|
+
useIntersectionObserver: function() {
|
|
22
|
+
return _useIntersectionObserver.useIntersectionObserver;
|
|
23
|
+
},
|
|
24
|
+
useMeasureList: function() {
|
|
25
|
+
return _useMeasureList.useMeasureList;
|
|
26
|
+
},
|
|
27
|
+
useResizeObserverRef_unstable: function() {
|
|
28
|
+
return _useResizeObserverRef.useResizeObserverRef_unstable;
|
|
29
|
+
},
|
|
30
|
+
useStaticVirtualizerMeasure: function() {
|
|
31
|
+
return _useVirtualizerMeasure.useStaticVirtualizerMeasure;
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
const _useIntersectionObserver = require("./useIntersectionObserver");
|
|
35
|
+
const _useVirtualizerMeasure = require("./useVirtualizerMeasure");
|
|
36
|
+
const _useDynamicVirtualizerMeasure = require("./useDynamicVirtualizerMeasure");
|
|
37
|
+
const _useResizeObserverRef = require("./useResizeObserverRef");
|
|
38
|
+
const _useMeasureList = require("./useMeasureList");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../src/hooks/index.ts"],"sourcesContent":["export { getRTLRootMargin, useIntersectionObserver } from './useIntersectionObserver';\nexport { useStaticVirtualizerMeasure } from './useVirtualizerMeasure';\nexport { useDynamicVirtualizerMeasure } from './useDynamicVirtualizerMeasure';\nexport { useResizeObserverRef_unstable } from './useResizeObserverRef';\nexport type {\n ResizeCallbackWithRef,\n VirtualizerDynamicPaginationProps,\n VirtualizerMeasureDynamicProps,\n VirtualizerMeasureProps,\n VirtualizerStaticPaginationProps,\n} from './hooks.types';\nexport type { IndexedResizeCallbackElement } from './useMeasureList';\nexport { createResizeObserverFromDocument, useMeasureList } from './useMeasureList';\n"],"names":["createResizeObserverFromDocument","getRTLRootMargin","useDynamicVirtualizerMeasure","useIntersectionObserver","useMeasureList","useResizeObserverRef_unstable","useStaticVirtualizerMeasure"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAYSA,gCAAgC;eAAhCA,gDAAgC;;IAZhCC,gBAAgB;eAAhBA,yCAAgB;;IAEhBC,4BAA4B;eAA5BA,0DAA4B;;IAFVC,uBAAuB;eAAvBA,gDAAuB;;IAYPC,cAAc;eAAdA,8BAAc;;IAThDC,6BAA6B;eAA7BA,mDAA6B;;IAF7BC,2BAA2B;eAA3BA,kDAA2B;;;yCADsB;uCACd;8CACC;sCACC;gCASmB"}
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "useDynamicVirtualizerPagination", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return useDynamicVirtualizerPagination;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
|
14
|
+
const useDynamicVirtualizerPagination = (virtualizerProps, paginationEnabled = true)=>{
|
|
15
|
+
'use no memo';
|
|
16
|
+
const { axis = 'vertical', currentIndex, progressiveItemSizes, virtualizerLength } = virtualizerProps;
|
|
17
|
+
const [setScrollTimer, clearScrollTimer] = (0, _reactutilities.useTimeout)();
|
|
18
|
+
const lastScrollPos = _react.useRef(-1);
|
|
19
|
+
const lastIndexScrolled = _react.useRef(-1);
|
|
20
|
+
const scrollContainer = _react.useRef(null);
|
|
21
|
+
const clearListeners = ()=>{
|
|
22
|
+
if (scrollContainer.current) {
|
|
23
|
+
scrollContainer.current.removeEventListener('scroll', onScroll);
|
|
24
|
+
scrollContainer.current = null;
|
|
25
|
+
clearScrollTimer();
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
_react.useEffect(()=>{
|
|
29
|
+
return ()=>{
|
|
30
|
+
clearListeners();
|
|
31
|
+
};
|
|
32
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
33
|
+
}, []);
|
|
34
|
+
/**
|
|
35
|
+
* Handle scroll stop event and paginate to the closest item
|
|
36
|
+
* If the closest item is the same as the previous scroll end
|
|
37
|
+
* we paginate to the next/previous one based on direction
|
|
38
|
+
*
|
|
39
|
+
* Users/Virtualizer-Hooks must pass in a cumulative array of sizes
|
|
40
|
+
* This prevents the need to recalculate and ensures size arrays are synced externally
|
|
41
|
+
*/ const onScrollEnd = _react.useCallback(()=>{
|
|
42
|
+
if (!scrollContainer.current || !paginationEnabled || !(progressiveItemSizes === null || progressiveItemSizes === void 0 ? void 0 : progressiveItemSizes.current)) {
|
|
43
|
+
// No container found
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
const currentScrollPos = Math.round(axis === 'vertical' ? scrollContainer.current.scrollTop : scrollContainer.current.scrollLeft);
|
|
47
|
+
let closestItemPos = 0;
|
|
48
|
+
let closestItem = 0;
|
|
49
|
+
const endItem = Math.min(currentIndex + virtualizerLength, progressiveItemSizes.current.length);
|
|
50
|
+
for(let i = currentIndex; i < endItem - 1; i++){
|
|
51
|
+
if (currentScrollPos <= progressiveItemSizes.current[i + 1] && currentScrollPos >= progressiveItemSizes.current[i]) {
|
|
52
|
+
// Found our in between position
|
|
53
|
+
const distanceToPrev = Math.abs(currentScrollPos - progressiveItemSizes.current[i]);
|
|
54
|
+
const distanceToNext = Math.abs(progressiveItemSizes.current[i + 1] - currentScrollPos);
|
|
55
|
+
if (distanceToPrev < distanceToNext) {
|
|
56
|
+
closestItem = i;
|
|
57
|
+
} else {
|
|
58
|
+
closestItem = i + 1;
|
|
59
|
+
}
|
|
60
|
+
break;
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
let nextItem;
|
|
64
|
+
if (Math.round(closestItem - lastIndexScrolled.current) === 0) {
|
|
65
|
+
// Special case for go to next/previous with minimum amount of scroll needed
|
|
66
|
+
const nextTarget = lastScrollPos.current < currentScrollPos ? 1 : -1;
|
|
67
|
+
// This will also handle a case where we scrolled to the exact correct position (noop)
|
|
68
|
+
const isSecondaryScroll = Math.round(lastScrollPos.current - currentScrollPos) === 0;
|
|
69
|
+
const posMod = isSecondaryScroll ? 0 : nextTarget;
|
|
70
|
+
nextItem = closestItem + posMod;
|
|
71
|
+
} else {
|
|
72
|
+
// Pagination for anything else can just jump to the closest!
|
|
73
|
+
nextItem = closestItem;
|
|
74
|
+
}
|
|
75
|
+
// Safeguard nextItem
|
|
76
|
+
nextItem = Math.min(Math.max(0, nextItem), progressiveItemSizes.current.length);
|
|
77
|
+
closestItemPos = progressiveItemSizes.current[nextItem];
|
|
78
|
+
if (axis === 'vertical') {
|
|
79
|
+
scrollContainer.current.scrollTo({
|
|
80
|
+
top: closestItemPos,
|
|
81
|
+
behavior: 'smooth'
|
|
82
|
+
});
|
|
83
|
+
} else {
|
|
84
|
+
scrollContainer.current.scrollTo({
|
|
85
|
+
left: closestItemPos,
|
|
86
|
+
behavior: 'smooth'
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
lastScrollPos.current = progressiveItemSizes.current[nextItem];
|
|
90
|
+
lastIndexScrolled.current = nextItem;
|
|
91
|
+
}, [
|
|
92
|
+
paginationEnabled,
|
|
93
|
+
currentIndex,
|
|
94
|
+
scrollContainer,
|
|
95
|
+
virtualizerLength,
|
|
96
|
+
axis,
|
|
97
|
+
progressiveItemSizes
|
|
98
|
+
]);
|
|
99
|
+
/**
|
|
100
|
+
* On scroll timer that will continuously delay callback until scrolling stops
|
|
101
|
+
*/ const onScroll = _react.useCallback((event)=>{
|
|
102
|
+
clearScrollTimer();
|
|
103
|
+
setScrollTimer(onScrollEnd, 100);
|
|
104
|
+
}, [
|
|
105
|
+
onScrollEnd,
|
|
106
|
+
clearScrollTimer,
|
|
107
|
+
setScrollTimer
|
|
108
|
+
]);
|
|
109
|
+
/**
|
|
110
|
+
* Pagination ref will ensure we attach listeners to containers on change
|
|
111
|
+
* It is returned from hook and merged into the scroll container externally
|
|
112
|
+
*/ const paginationRef = _react.useCallback((instance)=>{
|
|
113
|
+
if (!paginationEnabled) {
|
|
114
|
+
clearListeners();
|
|
115
|
+
scrollContainer.current = null;
|
|
116
|
+
return;
|
|
117
|
+
}
|
|
118
|
+
if (scrollContainer.current !== instance) {
|
|
119
|
+
clearListeners();
|
|
120
|
+
scrollContainer.current = instance;
|
|
121
|
+
if (scrollContainer.current) {
|
|
122
|
+
scrollContainer.current.addEventListener('scroll', onScroll);
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
}, [
|
|
126
|
+
onScroll,
|
|
127
|
+
onScrollEnd,
|
|
128
|
+
paginationEnabled
|
|
129
|
+
]);
|
|
130
|
+
return paginationRef;
|
|
131
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useDynamicPagination.ts"],"sourcesContent":["import * as React from 'react';\nimport { VirtualizerDynamicPaginationProps } from './hooks.types';\nimport { useTimeout } from '@fluentui/react-utilities';\n\n/**\n * Optional hook that will enable pagination on the virtualizer so that it 'autoscrolls' to an items exact position\n * Sizes are dynamic so we require a progressive sizing array (passed in from Dynamic virtualizer hooks)\n * On short scrolls, we will go at minimum to the next/previous item so that arrow pagination works\n * All VirtualizerDynamicPaginationProps can be grabbed from dynamic Virtualizer hooks externally and passed in\n */\nexport const useDynamicVirtualizerPagination = (\n virtualizerProps: VirtualizerDynamicPaginationProps,\n paginationEnabled: Boolean = true,\n) => {\n 'use no memo';\n\n const { axis = 'vertical', currentIndex, progressiveItemSizes, virtualizerLength } = virtualizerProps;\n\n const [setScrollTimer, clearScrollTimer] = useTimeout();\n const lastScrollPos = React.useRef<number>(-1);\n const lastIndexScrolled = React.useRef<number>(-1);\n\n const scrollContainer = React.useRef<HTMLElement | null>(null);\n\n const clearListeners = () => {\n if (scrollContainer.current) {\n scrollContainer.current.removeEventListener('scroll', onScroll);\n scrollContainer.current = null;\n clearScrollTimer();\n }\n };\n\n React.useEffect(() => {\n return () => {\n clearListeners();\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n /**\n * Handle scroll stop event and paginate to the closest item\n * If the closest item is the same as the previous scroll end\n * we paginate to the next/previous one based on direction\n *\n * Users/Virtualizer-Hooks must pass in a cumulative array of sizes\n * This prevents the need to recalculate and ensures size arrays are synced externally\n */\n const onScrollEnd = React.useCallback(() => {\n if (!scrollContainer.current || !paginationEnabled || !progressiveItemSizes?.current) {\n // No container found\n return;\n }\n\n const currentScrollPos = Math.round(\n axis === 'vertical' ? scrollContainer.current.scrollTop : scrollContainer.current.scrollLeft,\n );\n let closestItemPos = 0;\n let closestItem = 0;\n const endItem = Math.min(currentIndex + virtualizerLength, progressiveItemSizes.current.length);\n\n for (let i = currentIndex; i < endItem - 1; i++) {\n if (\n currentScrollPos <= progressiveItemSizes.current[i + 1] &&\n currentScrollPos >= progressiveItemSizes.current[i]\n ) {\n // Found our in between position\n const distanceToPrev = Math.abs(currentScrollPos - progressiveItemSizes.current[i]);\n const distanceToNext = Math.abs(progressiveItemSizes.current[i + 1] - currentScrollPos);\n if (distanceToPrev < distanceToNext) {\n closestItem = i;\n } else {\n closestItem = i + 1;\n }\n break;\n }\n }\n\n let nextItem;\n if (Math.round(closestItem - lastIndexScrolled.current) === 0) {\n // Special case for go to next/previous with minimum amount of scroll needed\n const nextTarget = lastScrollPos.current < currentScrollPos ? 1 : -1;\n // This will also handle a case where we scrolled to the exact correct position (noop)\n const isSecondaryScroll = Math.round(lastScrollPos.current - currentScrollPos) === 0;\n const posMod = isSecondaryScroll ? 0 : nextTarget;\n nextItem = closestItem + posMod;\n } else {\n // Pagination for anything else can just jump to the closest!\n nextItem = closestItem;\n }\n\n // Safeguard nextItem\n nextItem = Math.min(Math.max(0, nextItem), progressiveItemSizes.current.length);\n closestItemPos = progressiveItemSizes.current[nextItem];\n\n if (axis === 'vertical') {\n scrollContainer.current.scrollTo({ top: closestItemPos, behavior: 'smooth' });\n } else {\n scrollContainer.current.scrollTo({ left: closestItemPos, behavior: 'smooth' });\n }\n lastScrollPos.current = progressiveItemSizes.current[nextItem];\n lastIndexScrolled.current = nextItem;\n }, [paginationEnabled, currentIndex, scrollContainer, virtualizerLength, axis, progressiveItemSizes]);\n\n /**\n * On scroll timer that will continuously delay callback until scrolling stops\n */\n const onScroll = React.useCallback(\n event => {\n clearScrollTimer();\n setScrollTimer(onScrollEnd, 100);\n },\n [onScrollEnd, clearScrollTimer, setScrollTimer],\n );\n\n /**\n * Pagination ref will ensure we attach listeners to containers on change\n * It is returned from hook and merged into the scroll container externally\n */\n const paginationRef = React.useCallback(\n (instance: HTMLElement | HTMLDivElement | null) => {\n if (!paginationEnabled) {\n clearListeners();\n scrollContainer.current = null;\n return;\n }\n if (scrollContainer.current !== instance) {\n clearListeners();\n\n scrollContainer.current = instance;\n if (scrollContainer.current) {\n scrollContainer.current.addEventListener('scroll', onScroll);\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [onScroll, onScrollEnd, paginationEnabled],\n );\n\n return paginationRef;\n};\n"],"names":["useDynamicVirtualizerPagination","virtualizerProps","paginationEnabled","axis","currentIndex","progressiveItemSizes","virtualizerLength","setScrollTimer","clearScrollTimer","useTimeout","lastScrollPos","React","useRef","lastIndexScrolled","scrollContainer","clearListeners","current","removeEventListener","onScroll","useEffect","onScrollEnd","useCallback","currentScrollPos","Math","round","scrollTop","scrollLeft","closestItemPos","closestItem","endItem","min","length","i","distanceToPrev","abs","distanceToNext","nextItem","nextTarget","isSecondaryScroll","posMod","max","scrollTo","top","behavior","left","event","paginationRef","instance","addEventListener"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|