@wordpress/compose 5.0.3 → 5.0.7-next.33ec3857e2.0

package/build-types/hooks/use-fixed-window-list/index.d.ts

@@ -0,0 +1,57 @@
+/**
+ * @typedef {Object} WPFixedWindowList
+ *
+ * @property {number}                  visibleItems Items visible in the current viewport
+ * @property {number}                  start        Start index of the window
+ * @property {number}                  end          End index of the window
+ * @property {(index:number)=>boolean} itemInView   Returns true if item is in the window
+ */
+/**
+ * @typedef {Object} WPFixedWindowListOptions
+ *
+ * @property {number}  [windowOverscan] Renders windowOverscan number of items before and after the calculated visible window.
+ * @property {boolean} [useWindowing]   When false avoids calculating the window size
+ * @property {number}  [initWindowSize] Initial window size to use on first render before we can calculate the window size.
+ */
+/**
+ *
+ * @param {import('react').RefObject<HTMLElement>} elementRef Used to find the closest scroll container that contains element.
+ * @param { number }                               itemHeight Fixed item height in pixels
+ * @param { number }                               totalItems Total items in list
+ * @param { WPFixedWindowListOptions }             [options]  Options object
+ * @return {[ WPFixedWindowList, setFixedListWindow:(nextWindow:WPFixedWindowList)=>void]} Array with the fixed window list and setter
+ */
+export default function useFixedWindowList(elementRef: import('react').RefObject<HTMLElement>, itemHeight: number, totalItems: number, options?: WPFixedWindowListOptions | undefined): [WPFixedWindowList, (nextWindow: WPFixedWindowList) => void];
+export type WPFixedWindowList = {
+    /**
+     * Items visible in the current viewport
+     */
+    visibleItems: number;
+    /**
+     * Start index of the window
+     */
+    start: number;
+    /**
+     * End index of the window
+     */
+    end: number;
+    /**
+     * Returns true if item is in the window
+     */
+    itemInView: (index: number) => boolean;
+};
+export type WPFixedWindowListOptions = {
+    /**
+     * Renders windowOverscan number of items before and after the calculated visible window.
+     */
+    windowOverscan?: number | undefined;
+    /**
+     * When false avoids calculating the window size
+     */
+    useWindowing?: boolean | undefined;
+    /**
+     * Initial window size to use on first render before we can calculate the window size.
+     */
+    initWindowSize?: number | undefined;
+};
+//# sourceMappingURL=index.d.ts.map

package/build-types/hooks/use-fixed-window-list/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-fixed-window-list/index.js"],"names":[],"mappings":"AAcA;;;;;;;GAOG;AAEH;;;;;;GAMG;AAEH;;;;;;;GAOG;AACH,uDANW,OAAO,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,cACrC,MAAM,cACN,MAAM,oFAE8C,iBAAiB,KAAG,IAAI,EAwIvF;;;;;kBA5Ja,MAAM;;;;WACN,MAAM;;;;SACN,MAAM;;;;wBACC,MAAM,KAAG,OAAO"}

package/build-types/hooks/use-previous/index.d.ts

@@ -2,11 +2,9 @@
  * Use something's value from the previous render.
  * Based on https://usehooks.com/usePrevious/.
  *
- * @template T
+ * @param  value The value to track.
  *
- * @param {T} value The value to track.
- *
- * @return {T | undefined} The value from the previous render.
+ * @return The value from the previous render.
  */
 export default function usePrevious<T>(value: T): T | undefined;
 //# sourceMappingURL=index.d.ts.map

package/build-types/hooks/use-previous/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-previous/index.js"],"names":[],"mappings":"AAKA;;;;;;;;;GASG;AACH,gEAeC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-previous/index.ts"],"names":[],"mappings":"AAKA;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAE,CAAC,EAAI,KAAK,EAAE,CAAC,GAAI,CAAC,GAAG,SAAS,CAUlE"}

package/build-types/index.d.ts

@@ -10,6 +10,7 @@ export { default as useConstrainedTabbing } from "./hooks/use-constrained-tabbin
 export { default as useCopyOnClick } from "./hooks/use-copy-on-click";
 export { default as useCopyToClipboard } from "./hooks/use-copy-to-clipboard";
 export { default as __experimentalUseDialog } from "./hooks/use-dialog";
+export { default as __experimentalUseDisabled } from "./hooks/use-disabled";
 export { default as __experimentalUseDragging } from "./hooks/use-dragging";
 export { default as useFocusOnMount } from "./hooks/use-focus-on-mount";
 export { default as __experimentalUseFocusOutside } from "./hooks/use-focus-outside";
@@ -30,4 +31,5 @@ export { default as useMergeRefs } from "./hooks/use-merge-refs";
 export { default as useRefEffect } from "./hooks/use-ref-effect";
 export { default as __experimentalUseDropZone } from "./hooks/use-drop-zone";
 export { default as useFocusableIframe } from "./hooks/use-focusable-iframe";
+export { default as __experimentalUseFixedWindowList } from "./hooks/use-fixed-window-list";
 //# sourceMappingURL=index.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/compose",
-	"version": "5.0.3",
+	"version": "5.0.7-next.33ec3857e2.0",
 	"description": "WordPress higher-order components (HOCs).",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -29,15 +29,15 @@
 	"types": "build-types",
 	"sideEffects": false,
 	"dependencies": {
-		"@babel/runtime": "^7.13.10",
+		"@babel/runtime": "^7.16.0",
 		"@types/lodash": "^4.14.172",
 		"@types/mousetrap": "^1.6.8",
-		"@wordpress/deprecated": "^3.2.2",
-		"@wordpress/dom": "^3.2.4",
-		"@wordpress/element": "^4.0.2",
-		"@wordpress/is-shallow-equal": "^4.2.0",
-		"@wordpress/keycodes": "^3.2.3",
-		"@wordpress/priority-queue": "^2.2.2",
+		"@wordpress/deprecated": "^3.2.4-next.33ec3857e2.0",
+		"@wordpress/dom": "^3.2.8-next.33ec3857e2.0",
+		"@wordpress/element": "^4.0.6-next.33ec3857e2.0",
+		"@wordpress/is-shallow-equal": "^4.2.2-next.33ec3857e2.0",
+		"@wordpress/keycodes": "^3.2.5-next.33ec3857e2.0",
+		"@wordpress/priority-queue": "^2.2.4-next.33ec3857e2.0",
 		"clipboard": "^2.0.8",
 		"lodash": "^4.17.21",
 		"mousetrap": "^1.6.5",
@@ -47,5 +47,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "8f7f052bc04e3f4eb50f479ced14be1489b9fa79"
+	"gitHead": "51c7917ea7fac72953702f24d6daac87d99e7617"
 }

package/src/higher-order/with-state/index.js

@@ -21,6 +21,7 @@ import createHigherOrderComponent from '../../utils/create-higher-order-componen
  */
 export default function withState( initialState = {} ) {
 	deprecated( 'wp.compose.withState', {
+		since: '5.8',
 		alternative: 'wp.element.useState',
 	} );
 

package/src/hooks/use-constrained-tabbing/index.js

@@ -3,7 +3,11 @@
  */
 import { TAB } from '@wordpress/keycodes';
 import { focus } from '@wordpress/dom';
-import { useCallback } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import useRefEffect from '../use-ref-effect';
 
 /**
  * In Dialogs/modals, the tabbing must be constrained to the content of
@@ -27,46 +31,48 @@ import { useCallback } from '@wordpress/element';
  * ```
  */
 function useConstrainedTabbing() {
-	const ref = useCallback( ( /** @type {Element} */ node ) => {
-		if ( ! node ) {
-			return;
-		}
-		node.addEventListener( 'keydown', ( /** @type {Event} */ event ) => {
-			if ( ! ( event instanceof window.KeyboardEvent ) ) {
-				return;
-			}
+	return useRefEffect( ( /** @type {HTMLElement} */ node ) => {
+		/** @type {number|undefined} */
+		let timeoutId;
+
+		function onKeyDown( /** @type {KeyboardEvent} */ event ) {
+			const { keyCode, shiftKey, target } = event;
 
-			if ( event.keyCode !== TAB ) {
+			if ( keyCode !== TAB ) {
 				return;
 			}
 
-			const tabbables = focus.tabbable.find( node );
-			if ( ! tabbables.length ) {
+			const action = shiftKey ? 'findPrevious' : 'findNext';
+			const nextElement =
+				focus.tabbable[ action ](
+					/** @type {HTMLElement} */ ( target )
+				) || null;
+
+			// If the element that is about to receive focus is outside the
+			// area, move focus to a div and insert it at the start or end of
+			// the area, depending on the direction. Without preventing default
+			// behaviour, the browser will then move focus to the next element.
+			if ( node.contains( nextElement ) ) {
 				return;
 			}
-			const firstTabbable = tabbables[ 0 ];
-			const lastTabbable = tabbables[ tabbables.length - 1 ];
 
-			if ( event.shiftKey && event.target === firstTabbable ) {
-				event.preventDefault();
-				/** @type {HTMLElement} */ ( lastTabbable ).focus();
-			} else if ( ! event.shiftKey && event.target === lastTabbable ) {
-				event.preventDefault();
-				/** @type {HTMLElement} */ ( firstTabbable ).focus();
-				/*
-				 * When pressing Tab and none of the tabbables has focus, the keydown
-				 * event happens on the wrapper div: move focus on the first tabbable.
-				 */
-			} else if (
-				! tabbables.includes( /** @type {Element} */ ( event.target ) )
-			) {
-				event.preventDefault();
-				/** @type {HTMLElement} */ ( firstTabbable ).focus();
-			}
-		} );
-	}, [] );
+			const domAction = shiftKey ? 'append' : 'prepend';
+			const { ownerDocument } = node;
+			const trap = ownerDocument.createElement( 'div' );
 
-	return ref;
+			trap.tabIndex = -1;
+			node[ domAction ]( trap );
+			trap.focus();
+			// Remove after the browser moves focus to the next element.
+			timeoutId = setTimeout( () => node.removeChild( trap ) );
+		}
+
+		node.addEventListener( 'keydown', onKeyDown );
+		return () => {
+			node.removeEventListener( 'keydown', onKeyDown );
+			clearTimeout( timeoutId );
+		};
+	}, [] );
 }
 
 export default useConstrainedTabbing;

package/src/hooks/use-copy-on-click/index.js

@@ -26,8 +26,7 @@ import deprecated from '@wordpress/deprecated';
 export default function useCopyOnClick( ref, text, timeout = 4000 ) {
 	/* eslint-enable jsdoc/no-undefined-types */
 	deprecated( 'wp.compose.useCopyOnClick', {
-		since: '10.3',
-		plugin: 'Gutenberg',
+		since: '5.8',
 		alternative: 'wp.compose.useCopyToClipboard',
 	} );
 

package/src/hooks/use-disabled/index.js

@@ -0,0 +1,113 @@
+/**
+ * External dependencies
+ */
+import { includes, debounce } from 'lodash';
+
+/**
+ * WordPress dependencies
+ */
+import { useCallback, useLayoutEffect, useRef } from '@wordpress/element';
+import { focus } from '@wordpress/dom';
+
+/**
+ * Names of control nodes which qualify for disabled behavior.
+ *
+ * See WHATWG HTML Standard: 4.10.18.5: "Enabling and disabling form controls: the disabled attribute".
+ *
+ * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#enabling-and-disabling-form-controls:-the-disabled-attribute
+ *
+ * @type {string[]}
+ */
+const DISABLED_ELIGIBLE_NODE_NAMES = [
+	'BUTTON',
+	'FIELDSET',
+	'INPUT',
+	'OPTGROUP',
+	'OPTION',
+	'SELECT',
+	'TEXTAREA',
+];
+
+/**
+ * In some circumstances, such as block previews, all focusable DOM elements
+ * (input fields, links, buttons, etc.) need to be disabled. This hook adds the
+ * behavior to disable nested DOM elements to the returned ref.
+ *
+ * @return {import('react').RefObject<HTMLElement>} Element Ref.
+ *
+ * @example
+ * ```js
+ * import { __experimentalUseDisabled as useDisabled } from '@wordpress/compose';
+ * const DisabledExample = () => {
+ * 	const disabledRef = useDisabled();
+ *	return (
+ *		<div ref={ disabledRef }>
+ *			<a href="#">This link will have tabindex set to -1</a>
+ *			<input placeholder="This input will have the disabled attribute added to it." type="text" />
+ *		</div>
+ *	);
+ * };
+ * ```
+ */
+export default function useDisabled() {
+	/** @type {import('react').RefObject<HTMLElement>} */
+	const node = useRef( null );
+
+	const disable = () => {
+		if ( ! node.current ) {
+			return;
+		}
+
+		focus.focusable.find( node.current ).forEach( ( focusable ) => {
+			if (
+				includes( DISABLED_ELIGIBLE_NODE_NAMES, focusable.nodeName )
+			) {
+				focusable.setAttribute( 'disabled', '' );
+			}
+
+			if ( focusable.nodeName === 'A' ) {
+				focusable.setAttribute( 'tabindex', '-1' );
+			}
+
+			const tabIndex = focusable.getAttribute( 'tabindex' );
+			if ( tabIndex !== null && tabIndex !== '-1' ) {
+				focusable.removeAttribute( 'tabindex' );
+			}
+
+			if ( focusable.hasAttribute( 'contenteditable' ) ) {
+				focusable.setAttribute( 'contenteditable', 'false' );
+			}
+		} );
+	};
+
+	// Debounce re-disable since disabling process itself will incur
+	// additional mutations which should be ignored.
+	const debouncedDisable = useCallback(
+		debounce( disable, undefined, { leading: true } ),
+		[]
+	);
+
+	useLayoutEffect( () => {
+		disable();
+
+		/** @type {MutationObserver | undefined} */
+		let observer;
+		if ( node.current ) {
+			observer = new window.MutationObserver( debouncedDisable );
+			observer.observe( node.current, {
+				childList: true,
+				attributes: true,
+				subtree: true,
+			} );
+		}
+
+		return () => {
+			if ( observer ) {
+				observer.disconnect();
+			}
+			debouncedDisable.cancel();
+		};
+	}, [] );
+
+	return node;
+}

package/src/hooks/use-disabled/test/index.js

@@ -0,0 +1,90 @@
+/**
+ * External dependencies
+ */
+import { render, screen, waitFor } from '@testing-library/react';
+
+/**
+ * WordPress dependencies
+ */
+import { forwardRef } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import useDisabled from '../';
+
+jest.mock( '@wordpress/dom', () => {
+	const focus = jest.requireActual( '../../../../../dom/src' ).focus;
+
+	return {
+		focus: {
+			...focus,
+			focusable: {
+				...focus.focusable,
+				find( context ) {
+					// In JSDOM, all elements have zero'd widths and height.
+					// This is a metric for focusable's `isVisible`, so find
+					// and apply an arbitrary non-zero width.
+					Array.from( context.querySelectorAll( '*' ) ).forEach(
+						( element ) => {
+							Object.defineProperties( element, {
+								offsetWidth: {
+									get: () => 1,
+									configurable: true,
+								},
+							} );
+						}
+					);
+
+					return focus.focusable.find( ...arguments );
+				},
+			},
+		},
+	};
+} );
+
+describe( 'useDisabled', () => {
+	const Form = forwardRef( ( { showButton }, ref ) => {
+		return (
+			<form ref={ ref }>
+				<input />
+				<a href="https://wordpress.org/">A link</a>
+				<p contentEditable={ true } tabIndex="0"></p>
+				{ showButton && <button>Button</button> }
+			</form>
+		);
+	} );
+
+	function DisabledComponent( props ) {
+		const disabledRef = useDisabled();
+		return <Form ref={ disabledRef } { ...props } />;
+	}
+
+	it( 'will disable all fields', () => {
+		const { container } = render( <DisabledComponent /> );
+
+		const input = screen.getByRole( 'textbox' );
+		const link = screen.getByRole( 'link' );
+		const p = container.querySelector( 'p' );
+
+		expect( input.hasAttribute( 'disabled' ) ).toBe( true );
+		expect( link.getAttribute( 'tabindex' ) ).toBe( '-1' );
+		expect( p.getAttribute( 'contenteditable' ) ).toBe( 'false' );
+		expect( p.hasAttribute( 'tabindex' ) ).toBe( false );
+		expect( p.hasAttribute( 'disabled' ) ).toBe( false );
+	} );
+
+	it( 'will disable an element rendered in an update to the component', async () => {
+		const { rerender } = render(
+			<DisabledComponent showButton={ false } />
+		);
+
+		expect( screen.queryByText( 'Button' ) ).not.toBeInTheDocument();
+		rerender( <DisabledComponent showButton={ true } /> );
+
+		const button = screen.getByText( 'Button' );
+		await waitFor( () => {
+			expect( button.hasAttribute( 'disabled' ) ).toBe( true );
+		} );
+	} );
+} );

package/src/hooks/use-fixed-window-list/index.js

@@ -0,0 +1,174 @@
+/**
+ * External dependencies
+ */
+import { debounce } from 'lodash';
+
+/**
+ * WordPress dependencies
+ */
+import { useState, useLayoutEffect } from '@wordpress/element';
+import { getScrollContainer } from '@wordpress/dom';
+import { PAGEUP, PAGEDOWN, HOME, END } from '@wordpress/keycodes';
+
+const DEFAULT_INIT_WINDOW_SIZE = 30;
+
+/**
+ * @typedef {Object} WPFixedWindowList
+ *
+ * @property {number}                  visibleItems Items visible in the current viewport
+ * @property {number}                  start        Start index of the window
+ * @property {number}                  end          End index of the window
+ * @property {(index:number)=>boolean} itemInView   Returns true if item is in the window
+ */
+
+/**
+ * @typedef {Object} WPFixedWindowListOptions
+ *
+ * @property {number}  [windowOverscan] Renders windowOverscan number of items before and after the calculated visible window.
+ * @property {boolean} [useWindowing]   When false avoids calculating the window size
+ * @property {number}  [initWindowSize] Initial window size to use on first render before we can calculate the window size.
+ */
+
+/**
+ *
+ * @param {import('react').RefObject<HTMLElement>} elementRef Used to find the closest scroll container that contains element.
+ * @param { number }                               itemHeight Fixed item height in pixels
+ * @param { number }                               totalItems Total items in list
+ * @param { WPFixedWindowListOptions }             [options]  Options object
+ * @return {[ WPFixedWindowList, setFixedListWindow:(nextWindow:WPFixedWindowList)=>void]} Array with the fixed window list and setter
+ */
+export default function useFixedWindowList(
+	elementRef,
+	itemHeight,
+	totalItems,
+	options
+) {
+	const initWindowSize = options?.initWindowSize ?? DEFAULT_INIT_WINDOW_SIZE;
+	const useWindowing = options?.useWindowing ?? true;
+
+	const [ fixedListWindow, setFixedListWindow ] = useState( {
+		visibleItems: initWindowSize,
+		start: 0,
+		end: initWindowSize,
+		itemInView: ( /** @type {number} */ index ) => {
+			return index >= 0 && index <= initWindowSize;
+		},
+	} );
+
+	useLayoutEffect( () => {
+		if ( ! useWindowing ) {
+			return;
+		}
+		const scrollContainer = getScrollContainer( elementRef.current );
+		const measureWindow = (
+			/** @type {boolean | undefined} */ initRender
+		) => {
+			if ( ! scrollContainer ) {
+				return;
+			}
+			const visibleItems = Math.ceil(
+				scrollContainer.clientHeight / itemHeight
+			);
+			// Aim to keep opening list view fast, afterward we can optimize for scrolling
+			const windowOverscan = initRender
+				? visibleItems
+				: options?.windowOverscan ?? visibleItems;
+			const firstViewableIndex = Math.floor(
+				scrollContainer.scrollTop / itemHeight
+			);
+			const start = Math.max( 0, firstViewableIndex - windowOverscan );
+			const end = Math.min(
+				totalItems - 1,
+				firstViewableIndex + visibleItems + windowOverscan
+			);
+			setFixedListWindow( ( lastWindow ) => {
+				const nextWindow = {
+					visibleItems,
+					start,
+					end,
+					itemInView: ( /** @type {number} */ index ) => {
+						return start <= index && index <= end;
+					},
+				};
+				if (
+					lastWindow.start !== nextWindow.start ||
+					lastWindow.end !== nextWindow.end ||
+					lastWindow.visibleItems !== nextWindow.visibleItems
+				) {
+					return nextWindow;
+				}
+				return lastWindow;
+			} );
+		};
+
+		measureWindow( true );
+		const debounceMeasureList = debounce( () => {
+			measureWindow();
+		}, 16 );
+		scrollContainer?.addEventListener( 'scroll', debounceMeasureList );
+		scrollContainer?.ownerDocument?.defaultView?.addEventListener(
+			'resize',
+			debounceMeasureList
+		);
+		scrollContainer?.ownerDocument?.defaultView?.addEventListener(
+			'resize',
+			debounceMeasureList
+		);
+
+		return () => {
+			scrollContainer?.removeEventListener(
+				'scroll',
+				debounceMeasureList
+			);
+			scrollContainer?.ownerDocument?.defaultView?.removeEventListener(
+				'resize',
+				debounceMeasureList
+			);
+		};
+	}, [ itemHeight, elementRef, totalItems ] );
+
+	useLayoutEffect( () => {
+		if ( ! useWindowing ) {
+			return;
+		}
+		const scrollContainer = getScrollContainer( elementRef.current );
+		const handleKeyDown = ( /** @type {KeyboardEvent} */ event ) => {
+			switch ( event.keyCode ) {
+				case HOME: {
+					return scrollContainer?.scrollTo( { top: 0 } );
+				}
+				case END: {
+					return scrollContainer?.scrollTo( {
+						top: totalItems * itemHeight,
+					} );
+				}
+				case PAGEUP: {
+					return scrollContainer?.scrollTo( {
+						top:
+							scrollContainer.scrollTop -
+							fixedListWindow.visibleItems * itemHeight,
+					} );
+				}
+				case PAGEDOWN: {
+					return scrollContainer?.scrollTo( {
+						top:
+							scrollContainer.scrollTop +
+							fixedListWindow.visibleItems * itemHeight,
+					} );
+				}
+			}
+		};
+		scrollContainer?.ownerDocument?.defaultView?.addEventListener(
+			'keydown',
+			handleKeyDown
+		);
+		return () => {
+			scrollContainer?.ownerDocument?.defaultView?.removeEventListener(
+				'keydown',
+				handleKeyDown
+			);
+		};
+	}, [ totalItems, itemHeight, elementRef, fixedListWindow.visibleItems ] );
+
+	return [ fixedListWindow, setFixedListWindow ];
+}

package/src/hooks/use-previous/index.ts

@@ -0,0 +1,24 @@
+/**
+ * WordPress dependencies
+ */
+import { useEffect, useRef } from '@wordpress/element';
+
+/**
+ * Use something's value from the previous render.
+ * Based on https://usehooks.com/usePrevious/.
+ *
+ * @param  value The value to track.
+ *
+ * @return The value from the previous render.
+ */
+export default function usePrevious< T >( value: T ): T | undefined {
+	const ref = useRef< T >();
+
+	// Store current value in ref.
+	useEffect( () => {
+		ref.current = value;
+	}, [ value ] ); // Re-run when value changes.
+
+	// Return previous value (happens before update in useEffect above).
+	return ref.current;
+}

package/src/index.js

@@ -17,6 +17,7 @@ export { default as useConstrainedTabbing } from './hooks/use-constrained-tabbin
 export { default as useCopyOnClick } from './hooks/use-copy-on-click';
 export { default as useCopyToClipboard } from './hooks/use-copy-to-clipboard';
 export { default as __experimentalUseDialog } from './hooks/use-dialog';
+export { default as __experimentalUseDisabled } from './hooks/use-disabled';
 export { default as __experimentalUseDragging } from './hooks/use-dragging';
 export { default as useFocusOnMount } from './hooks/use-focus-on-mount';
 export { default as __experimentalUseFocusOutside } from './hooks/use-focus-outside';
@@ -37,3 +38,4 @@ export { default as useMergeRefs } from './hooks/use-merge-refs';
 export { default as useRefEffect } from './hooks/use-ref-effect';
 export { default as __experimentalUseDropZone } from './hooks/use-drop-zone';
 export { default as useFocusableIframe } from './hooks/use-focusable-iframe';
+export { default as __experimentalUseFixedWindowList } from './hooks/use-fixed-window-list';