@fluentui/react-virtualizer 9.0.0-alpha.9 → 9.0.0-alpha.90

package/dist/index.d.ts

@@ -1,15 +1,74 @@
 import type { ComponentProps } from '@fluentui/react-utilities';
 import type { ComponentState } from '@fluentui/react-utilities';
-import type { Dispatch } from 'react';
-import type { FC } from 'react';
-import type { MutableRefObject } from 'react';
 import * as React_2 from 'react';
-import type { SetStateAction } from 'react';
 import type { Slot } from '@fluentui/react-utilities';
 import type { SlotClassNames } from '@fluentui/react-utilities';
 
+/**
+ * Some props are optional on static virtualizer, but required for dynamic.
+ */
+export declare type DynamicVirtualizerContextProps = Required<VirtualizerContextProps>;
+
+export declare interface IndexedResizeCallbackElement {
+    handleResize: () => void;
+}
+
 export declare const renderVirtualizer_unstable: (state: VirtualizerState) => JSX.Element;
 
+export declare const renderVirtualizerScrollView_unstable: (state: VirtualizerScrollViewState) => JSX.Element;
+
+export declare const renderVirtualizerScrollViewDynamic_unstable: (state: VirtualizerScrollViewDynamicState) => JSX.Element;
+
+/**
+ * Additional direct Ref prevents reading old resize entry data
+ * Backwards compatible with ResizeObserverCallback if preferred
+ */
+export declare interface ResizeCallbackWithRef {
+    (entries: ResizeObserverEntry[], observer: ResizeObserver, scrollRef?: React_2.MutableRefObject<HTMLElement | null>): void;
+}
+
+export declare type ScrollToInterface = {
+    scrollTo: (index: number, behavior?: ScrollBehavior, callback?: (index: number) => void) => void;
+    virtualizerLength: React_2.RefObject<number>;
+    currentIndex: React_2.RefObject<number> | undefined;
+};
+
+export declare const scrollToItemDynamic: (params: ScrollToItemDynamicParams) => void;
+
+export declare type ScrollToItemDynamicParams = {
+    index: number;
+    itemSizes: React_2.RefObject<number[]>;
+    totalSize: number;
+    scrollViewRef: React_2.RefObject<HTMLDivElement>;
+    axis?: 'horizontal' | 'vertical';
+    reversed?: boolean;
+    behavior?: ScrollBehavior;
+};
+
+export declare const scrollToItemStatic: (params: ScrollToItemStaticParams) => void;
+
+export declare type ScrollToItemStaticParams = {
+    index: number;
+    itemSize: number;
+    totalItems: number;
+    scrollViewRef: React_2.RefObject<HTMLDivElement>;
+    axis?: 'horizontal' | 'vertical';
+    reversed?: boolean;
+    behavior?: ScrollBehavior;
+};
+
+/**
+ * React hook that measures virtualized space dynamically to ensure optimized virtualization length.
+ */
+export declare const useDynamicVirtualizerMeasure: <TElement extends HTMLElement>(virtualizerProps: VirtualizerMeasureDynamicProps) => {
+    virtualizerLength: number;
+    bufferItems: number;
+    bufferSize: number;
+    scrollRef: (instance: TElement | null) => void;
+    containerSizeRef: React_2.RefObject<number>;
+    updateScrollPosition: (scrollPosition: number) => void;
+};
+
 /**
  * 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.
@@ -19,14 +78,61 @@ export declare const renderVirtualizer_unstable: (state: VirtualizerState) => JS
  * @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 declare const useIntersectionObserver: (callback: IntersectionObserverCallback, options?: IntersectionObserverInit | undefined) => {
-    setObserverList: Dispatch<SetStateAction<Element[] | undefined>>;
-    setObserverInit: Dispatch<SetStateAction<IntersectionObserverInit | undefined>>;
-    observer: MutableRefObject<IntersectionObserver | undefined>;
+export declare const useIntersectionObserver: (callback: IntersectionObserverCallback, options?: IntersectionObserverInit) => {
+    setObserverList: React_2.Dispatch<React_2.SetStateAction<Element[] | undefined>>;
+    setObserverInit: (newInit: IntersectionObserverInit | undefined) => void;
+    observer: React_2.MutableRefObject<IntersectionObserver | undefined>;
+};
+
+/**
+ * Provides a way of automating size in the virtualizer
+ * Returns
+ * `width` - element width ref (0 by default),
+ * `height` - element height ref (0 by default),
+ * `measureElementRef` - a ref function to be passed as `ref` to the element you want to measure
+ */
+export declare function useMeasureList<TElement extends HTMLElement & IndexedResizeCallbackElement = HTMLElement & IndexedResizeCallbackElement>(currentIndex: number, refLength: number, totalLength: number, defaultItemSize: number): {
+    widthArray: React_2.MutableRefObject<any[]>;
+    heightArray: React_2.MutableRefObject<any[]>;
+    createIndexedRef: (index: number) => (el: TElement) => void;
+    refArray: React_2.MutableRefObject<(TElement | null | undefined)[]>;
+    sizeUpdateCount: number;
+};
+
+/**
+ * useResizeObserverRef_unstable simplifies resize observer connection and ensures debounce/cleanup
+ */
+export declare const useResizeObserverRef_unstable: (resizeCallback: ResizeCallbackWithRef) => (instance: HTMLElement | HTMLDivElement | null) => void;
+
+/**
+ * React hook that measures virtualized space based on a static size to ensure optimized virtualization length.
+ */
+export declare const useStaticVirtualizerMeasure: <TElement extends HTMLElement>(virtualizerProps: VirtualizerMeasureProps) => {
+    virtualizerLength: number;
+    bufferItems: number;
+    bufferSize: number;
+    scrollRef: (instance: TElement | null) => void;
+    containerSizeRef: React_2.MutableRefObject<number>;
 };
 
 export declare function useVirtualizer_unstable(props: VirtualizerProps): VirtualizerState;
 
+export declare const useVirtualizerContext_unstable: () => VirtualizerContextProps;
+
+export declare function useVirtualizerScrollView_unstable(props: VirtualizerScrollViewProps): VirtualizerScrollViewState;
+
+export declare function useVirtualizerScrollViewDynamic_unstable(props: VirtualizerScrollViewDynamicProps): VirtualizerScrollViewDynamicState;
+
+/**
+ * Apply styling to the Virtualizer states
+ */
+export declare const useVirtualizerScrollViewDynamicStyles_unstable: (state: VirtualizerScrollViewDynamicState) => VirtualizerScrollViewDynamicState;
+
+/**
+ * Apply styling to the Virtualizer states
+ */
+export declare const useVirtualizerScrollViewStyles_unstable: (state: VirtualizerScrollViewState) => VirtualizerScrollViewState;
+
 /**
  * Apply styling to the Virtualizer states
  */
@@ -37,13 +143,17 @@ export declare const useVirtualizerStyles_unstable: (state: VirtualizerState) =>
  * provides a simple interface for reducing the total number
  * of elements rendered at one time in large lists.
  */
-export declare const Virtualizer: FC<VirtualizerProps>;
+export declare const Virtualizer: React_2.FC<VirtualizerProps>;
 
-export declare type VirtualizerChildRenderFunction = (index: number) => React_2.ReactNode;
+/**
+ * The main child render method of Virtualization
+ * isScrolling will only be enabled when enableScrollLoad is set to true.
+ */
+export declare type VirtualizerChildRenderFunction = (index: number, isScrolling: boolean) => React_2.ReactNode;
 
 export declare const virtualizerClassNames: SlotClassNames<VirtualizerSlots>;
 
-export declare type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>> & {
+declare type VirtualizerConfigProps = {
     /**
      * Child render function.
      * Iteratively called to return current virtualizer DOM children.
@@ -68,15 +178,18 @@ export declare type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>>
      */
     virtualizerLength: number;
     /**
-     * Defaults to 1/4th of virtualizerLength.
+     * Defaults to 1/4th (or 1/3rd for dynamic items) of virtualizerLength.
+     * RECOMMEND: Override this with a consistent value if using a dynamic virtualizer.
+     *
      * Controls the number of elements rendered before the current index entering the virtualized viewport.
      * Constraints:
      * - Large enough to cover bufferSize (prevents buffers intersecting into the viewport during rest state).
-     * - Small enough that the end buffer and end index (start index + virtualizerLength) is not within viewport at rest.
+     * - Small enough that the virtualizer only renders a few items outside of view.
      */
     bufferItems?: number;
     /**
-     * Defaults to half of bufferItems size (in pixels).
+     * Defaults to half of bufferItems * itemSize size (in pixels).
+     * RECOMMEND: Override this with a consistent minimum item size value if using a dynamic virtualizer.
      * The length (in pixels) before the end/start DOM index where the virtualizer recalculation will be triggered.
      * Increasing this reduces whitespace on ultra-fast scroll, as additional elements
      * are buffered to appear while virtualization recalculates.
@@ -87,9 +200,9 @@ export declare type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>>
     bufferSize?: number;
     /**
      * Enables users to override the intersectionObserverRoot.
-     * @default null
+     * We recommend passing this in for accurate distance assessment in IO
      */
-    intersectionObserverRoot?: React_2.MutableRefObject<HTMLElement | null>;
+    scrollViewRef?: React_2.MutableRefObject<HTMLElement | null>;
     /**
      * The scroll direction
      * @default vertical
@@ -100,41 +213,46 @@ export declare type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>>
      * This value should be flipped in RTL implementation (TBD whether automate RTL).
      */
     reversed?: boolean;
+    /**
+     * Enables the isScrolling property in the child render function
+     * Default: false - to prevent nessecary render function calls
+     */
+    enableScrollLoad?: boolean;
     /**
      * Callback for acquiring size of individual items
      * @param index - the index of the requested size's child
      */
     getItemSize?: (index: number) => number;
     /**
-     * Notify users of index changes
+     * Virtualizer context can be passed as a prop for extended class use
      */
-    onUpdateIndex?: (index: number, prevIndex: number) => void;
+    virtualizerContext?: VirtualizerContextProps;
     /**
-     * Allow users to intervene in index calculation changes
+     * Callback for notifying when a flagged index has been rendered
      */
-    onCalculateIndex?: (newIndex: number) => number;
-};
-
-export declare type VirtualizerSlots = {
+    onRenderedFlaggedIndex?: (index: number) => void;
+    flaggedIndex?: React_2.MutableRefObject<number | null>;
     /**
-     * The intersection observed 'before' element will detect when scrolling towards the beginning.
+     * Imperative ref contains our scrollTo index functionality for user control.
      */
-    before: NonNullable<Slot<'div', 'td'>>;
+    imperativeVirtualizerRef?: React_2.RefObject<VirtualizerDataRef>;
     /**
-     * A block place holding whitespace at the beginning of current DOM children.
+     * A ref that provides the size of container (vertical - height, horizontal - width), set by a resize observer.
+     * Virtualizer Measure hooks provide a suitable reference.
      */
-    beforeContainer: NonNullable<Slot<'div', 'tr'>>;
+    containerSizeRef: React_2.RefObject<number>;
     /**
-     * The intersection observed 'after' element will detect when scrolling towards the end.
+     * A callback that enables updating scroll position for calculating required dynamic lengths,
+     * this should be passed in from useDynamicVirtualizerMeasure
      */
-    after: NonNullable<Slot<'div', 'td'>>;
+    updateScrollPosition?: (position: number) => void;
     /**
-     * A block place holding whitespace after the end of current DOM children.
+     * Spacing between rendered children for calculation, should match the container's gap CSS value.
      */
-    afterContainer: NonNullable<Slot<'div', 'tr'>>;
+    gap?: number;
 };
 
-export declare type VirtualizerState = ComponentState<VirtualizerSlots> & {
+declare type VirtualizerConfigState = {
     /**
      * The current virtualized array of children to show in the DOM.
      */
@@ -165,9 +283,184 @@ export declare type VirtualizerState = ComponentState<VirtualizerSlots> & {
      */
     reversed?: boolean;
     /**
-     * Tells the virtualizer how much
+     * Enables the isScrolling property in the child render function
+     * Default: false - to prevent nessecary render function calls
+     */
+    enableScrollLoad?: boolean;
+    /**
+     * Pixel size of intersection observers and how much they 'cross over' into the bufferItems index.
+     * Minimum 1px.
      */
     bufferSize: number;
+    /**
+     * Ref for access to internal size knowledge, can be used to measure updates
+     */
+    childSizes: React_2.MutableRefObject<number[]>;
+    /**
+     * Ref for access to internal progressive size knowledge, can be used to measure updates
+     */
+    childProgressiveSizes: React_2.MutableRefObject<number[]>;
+};
+
+/**
+ * {@docCategory Virtualizer}
+ */
+export declare type VirtualizerContextProps = {
+    contextIndex: number;
+    setContextIndex: (index: number) => void;
+    childProgressiveSizes?: React_2.MutableRefObject<number[]>;
+};
+
+export declare const VirtualizerContextProvider: React_2.Provider<VirtualizerContextProps>;
+
+export declare type VirtualizerDataRef = {
+    progressiveSizes: React_2.RefObject<number[]>;
+    nodeSizes: React_2.RefObject<number[]>;
+    setFlaggedIndex: (index: number | null) => void;
+    currentIndex: React_2.RefObject<number>;
+};
+
+export declare type VirtualizerMeasureDynamicProps = {
+    defaultItemSize: number;
+    virtualizerContext: DynamicVirtualizerContextProps;
+    numItems: number;
+    getItemSize: (index: number) => number;
+    direction?: 'vertical' | 'horizontal';
+    /**
+     * Override recommended number of buffer items
+     */
+    bufferItems?: number;
+    /**
+     * Override recommended buffer size (px)
+     */
+    bufferSize?: number;
+};
+
+export declare type VirtualizerMeasureProps = {
+    defaultItemSize: number;
+    direction?: 'vertical' | 'horizontal';
+    /**
+     * Override recommended number of buffer items
+     */
+    bufferItems?: number;
+    /**
+     * Override recommended buffer size (px)
+     */
+    bufferSize?: number;
+};
+
+export declare type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>> & VirtualizerConfigProps;
+
+/**
+ * Virtualizer ScrollView
+ */
+export declare const VirtualizerScrollView: React_2.FC<VirtualizerScrollViewProps>;
+
+export declare const virtualizerScrollViewClassNames: SlotClassNames<VirtualizerScrollViewSlots>;
+
+/**
+ * Virtualizer ScrollView
+ */
+export declare const VirtualizerScrollViewDynamic: React_2.FC<VirtualizerScrollViewDynamicProps>;
+
+export declare const virtualizerScrollViewDynamicClassNames: SlotClassNames<VirtualizerScrollViewDynamicSlots>;
+
+export declare type VirtualizerScrollViewDynamicProps = ComponentProps<Partial<VirtualizerScrollViewDynamicSlots>> & Partial<Omit<VirtualizerConfigProps, 'itemSize' | 'numItems' | 'getItemSize' | 'children' | 'flagIndex' | 'virtualizerContext'>> & {
+    /**
+     * Set as the minimum item size.
+     * Axis: 'vertical' = Height
+     * Axis: 'horizontal' = Width
+     */
+    itemSize: number;
+    /**
+     * Callback for acquiring size of individual items
+     * @param index - the index of the requested size's child
+     * If undefined, Virtualizer will auto-measure by default (performance tradeoff)
+     */
+    getItemSize?: (index: number) => number;
+    /**
+     * The total number of items to be virtualized.
+     */
+    numItems: number;
+    /**
+     * Child render function.
+     * Iteratively called to return current virtualizer DOM children.
+     * Will act as a row or column indexer depending on Virtualizer settings.
+     */
+    children: VirtualizerChildRenderFunction;
+    /**
+     * Imperative ref contains our scrollTo index functionality for user control.
+     */
+    imperativeRef?: React_2.RefObject<ScrollToInterface>;
+    /**
+     * Imperative ref contains our scrollTo index functionality for user control.
+     */
+    enablePagination?: boolean;
+    /**
+     * Enables override of dynamic virtualizer context if required.
+     */
+    virtualizerContext?: DynamicVirtualizerContextProps;
+};
+
+export declare type VirtualizerScrollViewDynamicSlots = VirtualizerScrollViewSlots;
+
+export declare type VirtualizerScrollViewDynamicState = ComponentState<VirtualizerScrollViewDynamicSlots> & VirtualizerConfigState;
+
+export declare type VirtualizerScrollViewProps = ComponentProps<Partial<VirtualizerScrollViewSlots>> & Partial<Omit<VirtualizerConfigProps, 'itemSize' | 'numItems' | 'getItemSize' | 'children' | 'flagIndex' | 'imperativeVirtualizerRef'>> & {
+    /**
+     * Virtualizer item size in pixels - static.
+     * Axis: 'vertical' = Height
+     * Axis: 'horizontal' = Width
+     */
+    itemSize: number;
+    /**
+     * The total number of items to be virtualized.
+     */
+    numItems: number;
+    /**
+     * Child render function.
+     * Iteratively called to return current virtualizer DOM children.
+     * Will act as a row or column indexer depending on Virtualizer settings.
+     */
+    children: VirtualizerChildRenderFunction;
+    /**
+     * Imperative ref contains our scrollTo index functionality for user control.
+     */
+    imperativeRef?: React_2.RefObject<ScrollToInterface>;
+    /**
+     * Imperative ref contains our scrollTo index functionality for user control.
+     */
+    enablePagination?: boolean;
+};
+
+export declare type VirtualizerScrollViewSlots = VirtualizerSlots & {
+    /**
+     * The root container that provides embedded scrolling.
+     */
+    container: NonNullable<Slot<'div'>>;
+};
+
+export declare type VirtualizerScrollViewState = ComponentState<VirtualizerScrollViewSlots> & VirtualizerConfigState;
+
+export declare type VirtualizerSlots = {
+    /**
+     * The intersection observed 'before' element will detect when scrolling towards the beginning.
+     */
+    before: NonNullable<Slot<'div', 'td'>>;
+    /**
+     * A block place holding whitespace at the beginning of current DOM children.
+     */
+    beforeContainer: NonNullable<Slot<'div', 'tr'>>;
+    /**
+     * The intersection observed 'after' element will detect when scrolling towards the end.
+     */
+    after: NonNullable<Slot<'div', 'td'>>;
+    /**
+     * A block place holding whitespace after the end of current DOM children.
+     */
+    afterContainer: NonNullable<Slot<'div', 'tr'>>;
 };
 
+export declare type VirtualizerState = ComponentState<VirtualizerSlots> & VirtualizerConfigState;
+
 export { }

package/lib/Hooks.js

@@ -1,2 +1 @@
-export * from './hooks/index';
-//# sourceMappingURL=Hooks.js.map
+export { createResizeObserverFromDocument, getRTLRootMargin, useDynamicVirtualizerMeasure, useIntersectionObserver, useMeasureList, useResizeObserverRef_unstable, useStaticVirtualizerMeasure } from './hooks/index';

package/lib/Hooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"Hooks.js","sourceRoot":"../src/","sources":["packages/react-components/react-virtualizer/src/Hooks.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC","sourcesContent":["export * from './hooks/index';\n"]}
+{"version":3,"sources":["../src/Hooks.ts"],"sourcesContent":["export type {\n  IndexedResizeCallbackElement,\n  ResizeCallbackWithRef,\n  VirtualizerDynamicPaginationProps,\n  VirtualizerMeasureDynamicProps,\n  VirtualizerMeasureProps,\n  VirtualizerStaticPaginationProps,\n} from './hooks/index';\nexport {\n  createResizeObserverFromDocument,\n  getRTLRootMargin,\n  useDynamicVirtualizerMeasure,\n  useIntersectionObserver,\n  useMeasureList,\n  useResizeObserverRef_unstable,\n  useStaticVirtualizerMeasure,\n} from './hooks/index';\n"],"names":["createResizeObserverFromDocument","getRTLRootMargin","useDynamicVirtualizerMeasure","useIntersectionObserver","useMeasureList","useResizeObserverRef_unstable","useStaticVirtualizerMeasure"],"rangeMappings":"","mappings":"AAQA,SACEA,gCAAgC,EAChCC,gBAAgB,EAChBC,4BAA4B,EAC5BC,uBAAuB,EACvBC,cAAc,EACdC,6BAA6B,EAC7BC,2BAA2B,QACtB,gBAAgB"}

package/lib/Utilities.js

@@ -0,0 +1 @@
+export { VirtualizerContextProvider, scrollToItemDynamic, scrollToItemStatic, useVirtualizerContextState_unstable, useVirtualizerContext_unstable } from './utilities/index';

package/lib/Utilities.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Utilities.ts"],"sourcesContent":["export type {\n  DynamicVirtualizerContextProps,\n  ScrollToInterface,\n  ScrollToItemDynamicParams,\n  ScrollToItemStaticParams,\n  VirtualizerContextProps,\n} from './utilities/index';\nexport {\n  VirtualizerContextProvider,\n  scrollToItemDynamic,\n  scrollToItemStatic,\n  useVirtualizerContextState_unstable,\n  useVirtualizerContext_unstable,\n} from './utilities/index';\n"],"names":["VirtualizerContextProvider","scrollToItemDynamic","scrollToItemStatic","useVirtualizerContextState_unstable","useVirtualizerContext_unstable"],"rangeMappings":"","mappings":"AAOA,SACEA,0BAA0B,EAC1BC,mBAAmB,EACnBC,kBAAkB,EAClBC,mCAAmC,EACnCC,8BAA8B,QACzB,oBAAoB"}

package/lib/Virtualizer.js

@@ -1,2 +1 @@
-export * from './components/Virtualizer/index';
-//# sourceMappingURL=Virtualizer.js.map
+export { Virtualizer, renderVirtualizerChildPlaceholder, renderVirtualizer_unstable, useVirtualizerStyles_unstable, useVirtualizer_unstable, virtualizerClassNames } from './components/Virtualizer/index';

package/lib/Virtualizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Virtualizer.js","sourceRoot":"../src/","sources":["packages/react-components/react-virtualizer/src/Virtualizer.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC","sourcesContent":["export * from './components/Virtualizer/index';\n"]}
+{"version":3,"sources":["../src/Virtualizer.ts"],"sourcesContent":["export type {\n  VirtualizerChildRenderFunction,\n  VirtualizerConfigProps,\n  VirtualizerConfigState,\n  VirtualizerDataRef,\n  VirtualizerProps,\n  VirtualizerSlots,\n  VirtualizerState,\n} from './components/Virtualizer/index';\nexport {\n  Virtualizer,\n  renderVirtualizerChildPlaceholder,\n  renderVirtualizer_unstable,\n  useVirtualizerStyles_unstable,\n  useVirtualizer_unstable,\n  virtualizerClassNames,\n} from './components/Virtualizer/index';\n"],"names":["Virtualizer","renderVirtualizerChildPlaceholder","renderVirtualizer_unstable","useVirtualizerStyles_unstable","useVirtualizer_unstable","virtualizerClassNames"],"rangeMappings":"","mappings":"AASA,SACEA,WAAW,EACXC,iCAAiC,EACjCC,0BAA0B,EAC1BC,6BAA6B,EAC7BC,uBAAuB,EACvBC,qBAAqB,QAChB,iCAAiC"}

package/lib/VirtualizerScrollView.js

@@ -0,0 +1 @@
+export { VirtualizerScrollView, renderVirtualizerScrollView_unstable, useVirtualizerScrollViewStyles_unstable, useVirtualizerScrollView_unstable, virtualizerScrollViewClassNames } from './components/VirtualizerScrollView/index';

package/lib/VirtualizerScrollView.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/VirtualizerScrollView.ts"],"sourcesContent":["export type {\n  VirtualizerScrollViewProps,\n  VirtualizerScrollViewSlots,\n  VirtualizerScrollViewState,\n} from './components/VirtualizerScrollView/index';\nexport {\n  VirtualizerScrollView,\n  renderVirtualizerScrollView_unstable,\n  useVirtualizerScrollViewStyles_unstable,\n  useVirtualizerScrollView_unstable,\n  virtualizerScrollViewClassNames,\n} from './components/VirtualizerScrollView/index';\n"],"names":["VirtualizerScrollView","renderVirtualizerScrollView_unstable","useVirtualizerScrollViewStyles_unstable","useVirtualizerScrollView_unstable","virtualizerScrollViewClassNames"],"rangeMappings":"","mappings":"AAKA,SACEA,qBAAqB,EACrBC,oCAAoC,EACpCC,uCAAuC,EACvCC,iCAAiC,EACjCC,+BAA+B,QAC1B,2CAA2C"}

package/lib/VirtualizerScrollViewDynamic.js

@@ -0,0 +1 @@
+export { VirtualizerScrollViewDynamic, renderVirtualizerScrollViewDynamic_unstable, useVirtualizerScrollViewDynamicStyles_unstable, useVirtualizerScrollViewDynamic_unstable, virtualizerScrollViewDynamicClassNames } from './components/VirtualizerScrollViewDynamic/index';

package/lib/VirtualizerScrollViewDynamic.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/VirtualizerScrollViewDynamic.ts"],"sourcesContent":["export type {\n  VirtualizerScrollViewDynamicProps,\n  VirtualizerScrollViewDynamicSlots,\n  VirtualizerScrollViewDynamicState,\n} from './components/VirtualizerScrollViewDynamic/index';\nexport {\n  VirtualizerScrollViewDynamic,\n  renderVirtualizerScrollViewDynamic_unstable,\n  useVirtualizerScrollViewDynamicStyles_unstable,\n  useVirtualizerScrollViewDynamic_unstable,\n  virtualizerScrollViewDynamicClassNames,\n} from './components/VirtualizerScrollViewDynamic/index';\n"],"names":["VirtualizerScrollViewDynamic","renderVirtualizerScrollViewDynamic_unstable","useVirtualizerScrollViewDynamicStyles_unstable","useVirtualizerScrollViewDynamic_unstable","virtualizerScrollViewDynamicClassNames"],"rangeMappings":"","mappings":"AAKA,SACEA,4BAA4B,EAC5BC,2CAA2C,EAC3CC,8CAA8C,EAC9CC,wCAAwC,EACxCC,sCAAsC,QACjC,kDAAkD"}

package/lib/components/Virtualizer/Virtualizer.js

@@ -1,15 +1,14 @@
-import { useVirtualizerStyles_unstable } from './useVirtualizerStyles';
+import * as React from 'react';
+import { useVirtualizerStyles_unstable } from './useVirtualizerStyles.styles';
 import { useVirtualizer_unstable } from './useVirtualizer';
 import { renderVirtualizer_unstable } from './renderVirtualizer';
 /**
  * Virtualizer pseudo-component, this functional wrapper
  * provides a simple interface for reducing the total number
  * of elements rendered at one time in large lists.
- */
-export const Virtualizer = props => {
-  const state = useVirtualizer_unstable(props);
-  useVirtualizerStyles_unstable(state);
-  return renderVirtualizer_unstable(state);
+ */ export const Virtualizer = (props)=>{
+    const state = useVirtualizer_unstable(props);
+    useVirtualizerStyles_unstable(state);
+    return renderVirtualizer_unstable(state);
 };
 Virtualizer.displayName = 'Virtualizer';
-//# sourceMappingURL=Virtualizer.js.map

package/lib/components/Virtualizer/Virtualizer.js.map

@@ -1 +1 @@
-{"version":3,"names":["useVirtualizerStyles_unstable","useVirtualizer_unstable","renderVirtualizer_unstable","Virtualizer","props","state","displayName"],"sources":["../src/packages/react-components/react-virtualizer/src/components/Virtualizer/Virtualizer.ts"],"sourcesContent":["import type { VirtualizerProps } from './Virtualizer.types';\nimport { useVirtualizerStyles_unstable } from './useVirtualizerStyles';\nimport { useVirtualizer_unstable } from './useVirtualizer';\nimport { renderVirtualizer_unstable } from './renderVirtualizer';\nimport type { FC } from 'react';\n\n/**\n * Virtualizer pseudo-component, this functional wrapper\n * provides a simple interface for reducing the total number\n * of elements rendered at one time in large lists.\n */\nexport const Virtualizer: FC<VirtualizerProps> = (props: VirtualizerProps) => {\n  const state = useVirtualizer_unstable(props);\n  useVirtualizerStyles_unstable(state);\n\n  return renderVirtualizer_unstable(state);\n};\n\nVirtualizer.displayName = 'Virtualizer';\n"],"mappings":"AACA,SAASA,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,0BAA0B,QAAQ,qBAAqB;AAGhE;;;;;AAKA,OAAO,MAAMC,WAAW,GAA0BC,KAAuB,IAAI;EAC3E,MAAMC,KAAK,GAAGJ,uBAAuB,CAACG,KAAK,CAAC;EAC5CJ,6BAA6B,CAACK,KAAK,CAAC;EAEpC,OAAOH,0BAA0B,CAACG,KAAK,CAAC;AAC1C,CAAC;AAEDF,WAAW,CAACG,WAAW,GAAG,aAAa"}
+{"version":3,"sources":["../src/components/Virtualizer/Virtualizer.ts"],"sourcesContent":["import * as React from 'react';\nimport type { VirtualizerProps } from './Virtualizer.types';\nimport { useVirtualizerStyles_unstable } from './useVirtualizerStyles.styles';\nimport { useVirtualizer_unstable } from './useVirtualizer';\nimport { renderVirtualizer_unstable } from './renderVirtualizer';\n\n/**\n * Virtualizer pseudo-component, this functional wrapper\n * provides a simple interface for reducing the total number\n * of elements rendered at one time in large lists.\n */\nexport const Virtualizer: React.FC<VirtualizerProps> = (props: VirtualizerProps) => {\n  const state = useVirtualizer_unstable(props);\n  useVirtualizerStyles_unstable(state);\n\n  return renderVirtualizer_unstable(state);\n};\n\nVirtualizer.displayName = 'Virtualizer';\n"],"names":["React","useVirtualizerStyles_unstable","useVirtualizer_unstable","renderVirtualizer_unstable","Virtualizer","props","state","displayName"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,6BAA6B,QAAQ,gCAAgC;AAC9E,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AAEjE;;;;CAIC,GACD,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAMC,QAAQJ,wBAAwBG;IACtCJ,8BAA8BK;IAE9B,OAAOH,2BAA2BG;AACpC,EAAE;AAEFF,YAAYG,WAAW,GAAG"}

package/lib/components/Virtualizer/Virtualizer.types.js

@@ -1,2 +1 @@
-export {};
-//# sourceMappingURL=Virtualizer.types.js.map
+import * as React from 'react';

package/lib/components/Virtualizer/Virtualizer.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Virtualizer.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-virtualizer/src/components/Virtualizer/Virtualizer.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type VirtualizerSlots = {\n  /**\n   * The intersection observed 'before' element will detect when scrolling towards the beginning.\n   */\n  before: NonNullable<Slot<'div', 'td'>>;\n  /**\n   * A block place holding whitespace at the beginning of current DOM children.\n   */\n  beforeContainer: NonNullable<Slot<'div', 'tr'>>;\n  /**\n   * The intersection observed 'after' element will detect when scrolling towards the end.\n   */\n  after: NonNullable<Slot<'div', 'td'>>;\n  /**\n   * A block place holding whitespace after the end of current DOM children.\n   */\n  afterContainer: NonNullable<Slot<'div', 'tr'>>;\n};\n\nexport type VirtualizerState = ComponentState<VirtualizerSlots> & {\n  /**\n   * The current virtualized array of children to show in the DOM.\n   */\n  virtualizedChildren: React.ReactNode[];\n  /**\n   * The current start index for the virtualizer, all previous index's will be removed from DOM.\n   */\n  virtualizerStartIndex: number;\n  /**\n   * Current buffer height required at beginning of array.\n   */\n  afterBufferHeight: number;\n  /**\n   * Current buffer height required at end of array.\n   */\n  beforeBufferHeight: number;\n  /**\n   * The total current height of the scrollView/child content.\n   */\n  totalVirtualizerHeight: number;\n  /**\n   * The scroll direction\n   * @default vertical\n   */\n  axis?: 'vertical' | 'horizontal';\n  /**\n   * Tells the virtualizer to measure in the reverse direction (for column-reverse order etc.)\n   */\n  reversed?: boolean;\n  /**\n   * Tells the virtualizer how much\n   */\n  bufferSize: number;\n};\n\n// Virtualizer render function to procedurally generate children elements as rows or columns via index.\n// Q: Use generic typing and passing through object data or a simple index system?\nexport type VirtualizerChildRenderFunction = (index: number) => React.ReactNode;\n\nexport type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>> & {\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   * Can be used dynamically.\n   */\n  children: VirtualizerChildRenderFunction;\n\n  /**\n   * Default cell size to use if no custom callback provided.\n   * If implementing `getItemSize` this should be the initial and ideally minimum cell size.\n   */\n  itemSize: number;\n\n  /**\n   * The total number of items to be virtualized.\n   */\n  numItems: number;\n\n  /**\n   * Number of children to render in the DOM during virtualization.\n   * Constraints:\n   * - Large enough that the items rendered in DOM cover the viewport\n   *   and intersection observer buffers (buffersize) at both ends.\n   */\n  virtualizerLength: number;\n\n  /**\n   * Defaults to 1/4th of virtualizerLength.\n   * Controls the number of elements rendered before the current index entering the virtualized viewport.\n   * Constraints:\n   * - Large enough to cover bufferSize (prevents buffers intersecting into the viewport during rest state).\n   * - Small enough that the end buffer and end index (start index + virtualizerLength) is not within viewport at rest.\n   */\n  bufferItems?: number;\n\n  /**\n   * Defaults to half of bufferItems size (in pixels).\n   * The length (in pixels) before the end/start DOM index where the virtualizer recalculation will be triggered.\n   * Increasing this reduces whitespace on ultra-fast scroll, as additional elements\n   * are buffered to appear while virtualization recalculates.\n   * Constraints:\n   * - At least 1px - although this will only trigger the recalculation after bookends (whitespace) enter viewport.\n   * - BufferSize must be smaller than bufferItems pixel size, as it prevents bookends entering viewport at rest.\n   */\n  bufferSize?: number;\n\n  /**\n   * Enables users to override the intersectionObserverRoot.\n   * @default null\n   */\n  intersectionObserverRoot?: React.MutableRefObject<HTMLElement | null>;\n\n  /**\n   * The scroll direction\n   * @default vertical\n   */\n  axis?: 'vertical' | 'horizontal';\n\n  /**\n   * Tells the virtualizer to measure in the reverse direction (for column-reverse order etc.)\n   * This value should be flipped in RTL implementation (TBD whether automate RTL).\n   */\n  reversed?: boolean;\n\n  /**\n   * Callback for acquiring size of individual items\n   * @param index - the index of the requested size's child\n   */\n  getItemSize?: (index: number) => number;\n\n  /**\n   * Notify users of index changes\n   */\n  onUpdateIndex?: (index: number, prevIndex: number) => void;\n\n  /**\n   * Allow users to intervene in index calculation changes\n   */\n  onCalculateIndex?: (newIndex: number) => number;\n};\n"]}
+{"version":3,"sources":["../src/components/Virtualizer/Virtualizer.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { VirtualizerContextProps } from '../../Utilities';\n\nexport type VirtualizerSlots = {\n  /**\n   * The intersection observed 'before' element will detect when scrolling towards the beginning.\n   */\n  before: NonNullable<Slot<'div', 'td'>>;\n  /**\n   * A block place holding whitespace at the beginning of current DOM children.\n   */\n  beforeContainer: NonNullable<Slot<'div', 'tr'>>;\n  /**\n   * The intersection observed 'after' element will detect when scrolling towards the end.\n   */\n  after: NonNullable<Slot<'div', 'td'>>;\n  /**\n   * A block place holding whitespace after the end of current DOM children.\n   */\n  afterContainer: NonNullable<Slot<'div', 'tr'>>;\n};\n\nexport type VirtualizerConfigState = {\n  /**\n   * The current virtualized array of children to show in the DOM.\n   */\n  virtualizedChildren: React.ReactNode[];\n  /**\n   * The current start index for the virtualizer, all previous index's will be removed from DOM.\n   */\n  virtualizerStartIndex: number;\n  /**\n   * Current buffer height required at beginning of array.\n   */\n  afterBufferHeight: number;\n  /**\n   * Current buffer height required at end of array.\n   */\n  beforeBufferHeight: number;\n  /**\n   * The total current height of the scrollView/child content.\n   */\n  totalVirtualizerHeight: number;\n  /**\n   * The scroll direction\n   * @default vertical\n   */\n  axis?: 'vertical' | 'horizontal';\n  /**\n   * Tells the virtualizer to measure in the reverse direction (for column-reverse order etc.)\n   */\n  reversed?: boolean;\n  /**\n   * Enables the isScrolling property in the child render function\n   * Default: false - to prevent nessecary render function calls\n   */\n  enableScrollLoad?: boolean;\n  /**\n   * Pixel size of intersection observers and how much they 'cross over' into the bufferItems index.\n   * Minimum 1px.\n   */\n  bufferSize: number;\n  /**\n   * Ref for access to internal size knowledge, can be used to measure updates\n   */\n  childSizes: React.MutableRefObject<number[]>;\n  /**\n   * Ref for access to internal progressive size knowledge, can be used to measure updates\n   */\n  childProgressiveSizes: React.MutableRefObject<number[]>;\n};\n\nexport type VirtualizerState = ComponentState<VirtualizerSlots> & VirtualizerConfigState;\n\n/**\n * The main child render method of Virtualization\n * isScrolling will only be enabled when enableScrollLoad is set to true.\n */\nexport type VirtualizerChildRenderFunction = (index: number, isScrolling: boolean) => React.ReactNode;\n\nexport type VirtualizerDataRef = {\n  progressiveSizes: React.RefObject<number[]>;\n  nodeSizes: React.RefObject<number[]>;\n  setFlaggedIndex: (index: number | null) => void;\n  currentIndex: React.RefObject<number>;\n};\n\nexport type VirtualizerConfigProps = {\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   * Can be used dynamically.\n   */\n  children: VirtualizerChildRenderFunction;\n\n  /**\n   * Default cell size to use if no custom callback provided.\n   * If implementing `getItemSize` this should be the initial and ideally minimum cell size.\n   */\n  itemSize: number;\n\n  /**\n   * The total number of items to be virtualized.\n   */\n  numItems: number;\n\n  /**\n   * Number of children to render in the DOM during virtualization.\n   * Constraints:\n   * - Large enough that the items rendered in DOM cover the viewport\n   *   and intersection observer buffers (buffersize) at both ends.\n   */\n  virtualizerLength: number;\n\n  /**\n   * Defaults to 1/4th (or 1/3rd for dynamic items) of virtualizerLength.\n   * RECOMMEND: Override this with a consistent value if using a dynamic virtualizer.\n   *\n   * Controls the number of elements rendered before the current index entering the virtualized viewport.\n   * Constraints:\n   * - Large enough to cover bufferSize (prevents buffers intersecting into the viewport during rest state).\n   * - Small enough that the virtualizer only renders a few items outside of view.\n   */\n  bufferItems?: number;\n\n  /**\n   * Defaults to half of bufferItems * itemSize size (in pixels).\n   * RECOMMEND: Override this with a consistent minimum item size value if using a dynamic virtualizer.\n   * The length (in pixels) before the end/start DOM index where the virtualizer recalculation will be triggered.\n   * Increasing this reduces whitespace on ultra-fast scroll, as additional elements\n   * are buffered to appear while virtualization recalculates.\n   * Constraints:\n   * - At least 1px - although this will only trigger the recalculation after bookends (whitespace) enter viewport.\n   * - BufferSize must be smaller than bufferItems pixel size, as it prevents bookends entering viewport at rest.\n   */\n  bufferSize?: number;\n\n  /**\n   * Enables users to override the intersectionObserverRoot.\n   * We recommend passing this in for accurate distance assessment in IO\n   */\n  scrollViewRef?: React.MutableRefObject<HTMLElement | null>;\n\n  /**\n   * The scroll direction\n   * @default vertical\n   */\n  axis?: 'vertical' | 'horizontal';\n\n  /**\n   * Tells the virtualizer to measure in the reverse direction (for column-reverse order etc.)\n   * This value should be flipped in RTL implementation (TBD whether automate RTL).\n   */\n  reversed?: boolean;\n\n  /**\n   * Enables the isScrolling property in the child render function\n   * Default: false - to prevent nessecary render function calls\n   */\n  enableScrollLoad?: boolean;\n\n  /**\n   * Callback for acquiring size of individual items\n   * @param index - the index of the requested size's child\n   */\n  getItemSize?: (index: number) => number;\n\n  /**\n   * Virtualizer context can be passed as a prop for extended class use\n   */\n  virtualizerContext?: VirtualizerContextProps;\n\n  /**\n   * Callback for notifying when a flagged index has been rendered\n   */\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n  onRenderedFlaggedIndex?: (index: number) => void;\n\n  /*\n   * Callback for notifying when a flagged index has been rendered\n   */\n  flaggedIndex?: React.MutableRefObject<number | null>;\n\n  /**\n   * Imperative ref contains our scrollTo index functionality for user control.\n   */\n  imperativeVirtualizerRef?: React.RefObject<VirtualizerDataRef>;\n\n  /**\n   * A ref that provides the size of container (vertical - height, horizontal - width), set by a resize observer.\n   * Virtualizer Measure hooks provide a suitable reference.\n   */\n  containerSizeRef: React.RefObject<number>;\n\n  /**\n   * A callback that enables updating scroll position for calculating required dynamic lengths,\n   * this should be passed in from useDynamicVirtualizerMeasure\n   */\n  updateScrollPosition?: (position: number) => void;\n\n  /**\n   * Spacing between rendered children for calculation, should match the container's gap CSS value.\n   */\n  gap?: number;\n};\n\nexport type VirtualizerProps = ComponentProps<Partial<VirtualizerSlots>> & VirtualizerConfigProps;\n"],"names":["React"],"rangeMappings":"","mappings":"AAAA,YAAYA,WAAW,QAAQ"}

package/lib/components/Virtualizer/index.js

@@ -1,6 +1,4 @@
-export * from './Virtualizer';
-export * from './Virtualizer.types';
-export * from './useVirtualizer';
-export * from './renderVirtualizer';
-export * from './useVirtualizerStyles';
-//# sourceMappingURL=index.js.map
+export { Virtualizer } from './Virtualizer';
+export { useVirtualizer_unstable } from './useVirtualizer';
+export { renderVirtualizerChildPlaceholder, renderVirtualizer_unstable } from './renderVirtualizer';
+export { useVirtualizerStyles_unstable, virtualizerClassNames } from './useVirtualizerStyles.styles';

package/lib/components/Virtualizer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-virtualizer/src/components/Virtualizer/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC","sourcesContent":["export * from './Virtualizer';\nexport * from './Virtualizer.types';\nexport * from './useVirtualizer';\nexport * from './renderVirtualizer';\nexport * from './useVirtualizerStyles';\n"]}
+{"version":3,"sources":["../src/components/Virtualizer/index.ts"],"sourcesContent":["export { Virtualizer } from './Virtualizer';\nexport type {\n  VirtualizerChildRenderFunction,\n  VirtualizerConfigProps,\n  VirtualizerConfigState,\n  VirtualizerDataRef,\n  VirtualizerProps,\n  VirtualizerSlots,\n  VirtualizerState,\n} from './Virtualizer.types';\nexport { useVirtualizer_unstable } from './useVirtualizer';\nexport { renderVirtualizerChildPlaceholder, renderVirtualizer_unstable } from './renderVirtualizer';\nexport { useVirtualizerStyles_unstable, virtualizerClassNames } from './useVirtualizerStyles.styles';\n"],"names":["Virtualizer","useVirtualizer_unstable","renderVirtualizerChildPlaceholder","renderVirtualizer_unstable","useVirtualizerStyles_unstable","virtualizerClassNames"],"rangeMappings":";;;","mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAU5C,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,iCAAiC,EAAEC,0BAA0B,QAAQ,sBAAsB;AACpG,SAASC,6BAA6B,EAAEC,qBAAqB,QAAQ,gCAAgC"}

package/lib/components/Virtualizer/renderVirtualizer.js

@@ -1,18 +1,23 @@
+  import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import * as React from 'react';
-import { getSlots } from '@fluentui/react-utilities';
-export const renderVirtualizer_unstable = state => {
-  const {
-    slots,
-    slotProps
-  } = getSlots(state);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(slots.beforeContainer, {
-    ...slotProps.beforeContainer
-  }, /*#__PURE__*/React.createElement(slots.before, {
-    ...slotProps.before
-  })), state.virtualizedChildren, /*#__PURE__*/React.createElement(slots.afterContainer, {
-    ...slotProps.afterContainer
-  }, /*#__PURE__*/React.createElement(slots.after, {
-    ...slotProps.after
-  })));
+import { assertSlots } from '@fluentui/react-utilities';
+export const renderVirtualizer_unstable = (state)=>{
+    assertSlots(state);
+    return /*#__PURE__*/ _jsxs(React.Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(state.beforeContainer, {
+                children: /*#__PURE__*/ _jsx(state.before, {})
+            }),
+            state.virtualizedChildren,
+            /*#__PURE__*/ _jsx(state.afterContainer, {
+                children: /*#__PURE__*/ _jsx(state.after, {})
+            })
+        ]
+    });
+};
+export const renderVirtualizerChildPlaceholder = (child, index)=>{
+    return /*#__PURE__*/ _jsx(React.Suspense, {
+        fallback: null,
+        children: child
+    }, `fui-virtualizer-placeholder-${index}`);
 };
-//# sourceMappingURL=renderVirtualizer.js.map