@wordpress/components 23.3.5 → 23.5.0

package/build-module/tree-grid/index.js

@@ -12,24 +12,19 @@ import { UP, DOWN, LEFT, RIGHT, HOME, END } from '@wordpress/keycodes';
  */
 
 import RovingTabIndexContainer from './roving-tab-index';
+
 /**
  * Return focusables in a row element, excluding those from other branches
  * nested within the row.
  *
- * @param {Element} rowElement The DOM element representing the row.
+ * @param rowElement The DOM element representing the row.
  *
- * @return {Array | undefined} The array of focusables in the row.
+ * @return The array of focusables in the row.
  */
-
 function getRowFocusables(rowElement) {
   const focusablesInRow = focus.focusable.find(rowElement, {
     sequential: true
   });
-
-  if (!focusablesInRow || !focusablesInRow.length) {
-    return;
-  }
-
   return focusablesInRow.filter(focusable => {
     return focusable.closest('[role="row"]') === rowElement;
   });
@@ -37,18 +32,12 @@ function getRowFocusables(rowElement) {
 /**
  * Renders both a table and tbody element, used to create a tree hierarchy.
  *
- * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md
- * @param {Object}    props                      Component props.
- * @param {WPElement} props.children             Children to be rendered.
- * @param {Function}  props.onExpandRow          Callback to fire when row is expanded.
- * @param {Function}  props.onCollapseRow        Callback to fire when row is collapsed.
- * @param {Function}  props.onFocusRow           Callback to fire when moving focus to a different row.
- * @param {string}    props.applicationAriaLabel Label to use for the application role.
- * @param {Object}    ref                        A ref to the underlying DOM table element.
  */
 
 
-function TreeGrid(_ref, ref) {
+function UnforwardedTreeGrid(_ref,
+/** A ref to the underlying DOM table element. */
+ref) {
   let {
     children,
     onExpandRow = () => {},
@@ -81,12 +70,17 @@ function TreeGrid(_ref, ref) {
       currentTarget: treeGridElement
     } = event;
 
-    if (!treeGridElement.contains(activeElement)) {
+    if (!activeElement || !treeGridElement.contains(activeElement)) {
       return;
     } // Calculate the columnIndex of the active element.
 
 
     const activeRow = activeElement.closest('[role="row"]');
+
+    if (!activeRow) {
+      return;
+    }
+
     const focusablesInRow = getRowFocusables(activeRow);
     const currentColumnIndex = focusablesInRow.indexOf(activeElement);
     const canExpandCollapse = 0 === currentColumnIndex;
@@ -116,13 +110,15 @@ function TreeGrid(_ref, ref) {
           } // If a row is focused, and it is collapsed, moves to the parent row (if there is one).
 
 
-          const level = Math.max(parseInt((_activeRow$getAttribu = activeRow === null || activeRow === void 0 ? void 0 : activeRow.getAttribute('aria-level')) !== null && _activeRow$getAttribu !== void 0 ? _activeRow$getAttribu : 1, 10) - 1, 1);
+          const level = Math.max(parseInt((_activeRow$getAttribu = activeRow === null || activeRow === void 0 ? void 0 : activeRow.getAttribute('aria-level')) !== null && _activeRow$getAttribu !== void 0 ? _activeRow$getAttribu : '1', 10) - 1, 1);
           const rows = Array.from(treeGridElement.querySelectorAll('[role="row"]'));
           let parentRow = activeRow;
           const currentRowIndex = rows.indexOf(activeRow);
 
           for (let i = currentRowIndex; i >= 0; i--) {
-            if (parseInt(rows[i].getAttribute('aria-level'), 10) === level) {
+            const ariaLevel = rows[i].getAttribute('aria-level');
+
+            if (ariaLevel !== null && parseInt(ariaLevel, 10) === level) {
               parentRow = rows[i];
               break;
             }
@@ -264,8 +260,72 @@ function TreeGrid(_ref, ref) {
   }), createElement("tbody", null, children))));
   /* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */
 }
+/**
+ * `TreeGrid` is used to create a tree hierarchy.
+ * It is not a visually styled component, but instead helps with adding
+ * keyboard navigation and roving tab index behaviors to tree grid structures.
+ *
+ * A tree grid is a hierarchical 2 dimensional UI component, for example it could be
+ * used to implement a file system browser.
+ *
+ * A tree grid allows the user to navigate using arrow keys.
+ * Up/down to navigate vertically across rows, and left/right to navigate horizontally
+ * between focusables in a row.
+ *
+ * The `TreeGrid` renders both a `table` and `tbody` element, and is intended to be used
+ * with `TreeGridRow` (`tr`) and `TreeGridCell` (`td`) to build out a grid.
+ *
+ * ```jsx
+ * function TreeMenu() {
+ * 	return (
+ * 		<TreeGrid>
+ * 			<TreeGridRow level={ 1 } positionInSet={ 1 } setSize={ 2 }>
+ * 				<TreeGridCell>
+ * 					{ ( props ) => (
+ * 						<Button onClick={ onSelect } { ...props }>Select</Button>
+ * 					) }
+ * 				</TreeGridCell>
+ * 				<TreeGridCell>
+ * 					{ ( props ) => (
+ * 						<Button onClick={ onMove } { ...props }>Move</Button>
+ * 					) }
+ * 				</TreeGridCell>
+ * 			</TreeGridRow>
+ * 			<TreeGridRow level={ 1 } positionInSet={ 2 } setSize={ 2 }>
+ * 				<TreeGridCell>
+ * 					{ ( props ) => (
+ * 						<Button onClick={ onSelect } { ...props }>Select</Button>
+ * 					) }
+ * 				</TreeGridCell>
+ * 				<TreeGridCell>
+ * 					{ ( props ) => (
+ * 						<Button onClick={ onMove } { ...props }>Move</Button>
+ * 					) }
+ * 				</TreeGridCell>
+ * 			</TreeGridRow>
+ * 			<TreeGridRow level={ 2 } positionInSet={ 1 } setSize={ 1 }>
+ * 				<TreeGridCell>
+ * 					{ ( props ) => (
+ * 						<Button onClick={ onSelect } { ...props }>Select</Button>
+ * 					) }
+ * 				</TreeGridCell>
+ * 				<TreeGridCell>
+ * 					{ ( props ) => (
+ * 						<Button onClick={ onMove } { ...props }>Move</Button>
+ * 					) }
+ * 				</TreeGridCell>
+ * 			</TreeGridRow>
+ * 		</TreeGrid>
+ * 	);
+ * }
+ * ```
+ *
+ * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}
+ */
+
 
-export default forwardRef(TreeGrid);
+export const TreeGrid = forwardRef(UnforwardedTreeGrid);
+export default TreeGrid;
 export { default as TreeGridRow } from './row';
 export { default as TreeGridCell } from './cell';
 export { default as TreeGridItem } from './item';

package/build-module/tree-grid/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tree-grid/index.js"],"names":["focus","forwardRef","useCallback","UP","DOWN","LEFT","RIGHT","HOME","END","RovingTabIndexContainer","getRowFocusables","rowElement","focusablesInRow","focusable","find","sequential","length","filter","closest","TreeGrid","ref","children","onExpandRow","onCollapseRow","onFocusRow","applicationAriaLabel","props","onKeyDown","event","keyCode","metaKey","ctrlKey","altKey","hasModifierKeyPressed","includes","stopPropagation","activeElement","document","currentTarget","treeGridElement","contains","activeRow","currentColumnIndex","indexOf","canExpandCollapse","cannotFocusNextColumn","getAttribute","nextIndex","Math","max","min","preventDefault","level","parseInt","rows","Array","from","querySelectorAll","parentRow","currentRowIndex","i","focusableItems","nextRowIndex","focusablesInNextRow","default","TreeGridRow","TreeGridCell","TreeGridItem"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\nimport { forwardRef, useCallback } from '@wordpress/element';\nimport { UP, DOWN, LEFT, RIGHT, HOME, END } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexContainer from './roving-tab-index';\n\n/**\n * Return focusables in a row element, excluding those from other branches\n * nested within the row.\n *\n * @param {Element} rowElement The DOM element representing the row.\n *\n * @return {Array | undefined} The array of focusables in the row.\n */\nfunction getRowFocusables( rowElement ) {\n\tconst focusablesInRow = focus.focusable.find( rowElement, {\n\t\tsequential: true,\n\t} );\n\n\tif ( ! focusablesInRow || ! focusablesInRow.length ) {\n\t\treturn;\n\t}\n\n\treturn focusablesInRow.filter( ( focusable ) => {\n\t\treturn focusable.closest( '[role=\"row\"]' ) === rowElement;\n\t} );\n}\n\n/**\n * Renders both a table and tbody element, used to create a tree hierarchy.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n * @param {Object}    props                      Component props.\n * @param {WPElement} props.children             Children to be rendered.\n * @param {Function}  props.onExpandRow          Callback to fire when row is expanded.\n * @param {Function}  props.onCollapseRow        Callback to fire when row is collapsed.\n * @param {Function}  props.onFocusRow           Callback to fire when moving focus to a different row.\n * @param {string}    props.applicationAriaLabel Label to use for the application role.\n * @param {Object}    ref                        A ref to the underlying DOM table element.\n */\nfunction TreeGrid(\n\t{\n\t\tchildren,\n\t\tonExpandRow = () => {},\n\t\tonCollapseRow = () => {},\n\t\tonFocusRow = () => {},\n\t\tapplicationAriaLabel,\n\t\t...props\n\t},\n\tref\n) {\n\tconst onKeyDown = useCallback(\n\t\t( event ) => {\n\t\t\tconst { keyCode, metaKey, ctrlKey, altKey } = event;\n\n\t\t\t// The shift key is intentionally absent from the following list,\n\t\t\t// to enable shift + up/down to select items from the list.\n\t\t\tconst hasModifierKeyPressed = metaKey || ctrlKey || altKey;\n\n\t\t\tif (\n\t\t\t\thasModifierKeyPressed ||\n\t\t\t\t! [ UP, DOWN, LEFT, RIGHT, HOME, END ].includes( keyCode )\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The event will be handled, stop propagation.\n\t\t\tevent.stopPropagation();\n\n\t\t\tconst { activeElement } = document;\n\t\t\tconst { currentTarget: treeGridElement } = event;\n\t\t\tif ( ! treeGridElement.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Calculate the columnIndex of the active element.\n\t\t\tconst activeRow = activeElement.closest( '[role=\"row\"]' );\n\t\t\tconst focusablesInRow = getRowFocusables( activeRow );\n\t\t\tconst currentColumnIndex = focusablesInRow.indexOf( activeElement );\n\t\t\tconst canExpandCollapse = 0 === currentColumnIndex;\n\t\t\tconst cannotFocusNextColumn =\n\t\t\t\tcanExpandCollapse &&\n\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'false' &&\n\t\t\t\tkeyCode === RIGHT;\n\n\t\t\tif ( [ LEFT, RIGHT ].includes( keyCode ) ) {\n\t\t\t\t// Calculate to the next element.\n\t\t\t\tlet nextIndex;\n\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\tnextIndex = Math.max( 0, currentColumnIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextIndex = Math.min(\n\t\t\t\t\t\tcurrentColumnIndex + 1,\n\t\t\t\t\t\tfocusablesInRow.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is at the left most column.\n\t\t\t\tif ( canExpandCollapse ) {\n\t\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\t\t// Left:\n\t\t\t\t\t\t// If a row is focused, and it is expanded, collapses the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'true'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonCollapseRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, moves to the parent row (if there is one).\n\t\t\t\t\t\tconst level = Math.max(\n\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\tactiveRow?.getAttribute( 'aria-level' ) ?? 1,\n\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t) - 1,\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst rows = Array.from(\n\t\t\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t\t\t);\n\t\t\t\t\t\tlet parentRow = activeRow;\n\t\t\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\t\t\tfor ( let i = currentRowIndex; i >= 0; i-- ) {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\t\trows[ i ].getAttribute( 'aria-level' ),\n\t\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t\t) === level\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tparentRow = rows[ i ];\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tgetRowFocusables( parentRow )?.[ 0 ]?.focus();\n\t\t\t\t\t}\n\t\t\t\t\tif ( keyCode === RIGHT ) {\n\t\t\t\t\t\t// Right:\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, expands the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) ===\n\t\t\t\t\t\t\t'false'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonExpandRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is expanded, focuses the next cell in the row.\n\t\t\t\t\t\tconst focusableItems = getRowFocusables( activeRow );\n\t\t\t\t\t\tif ( focusableItems.length > 0 ) {\n\t\t\t\t\t\t\tfocusableItems[ nextIndex ]?.focus();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start reading text on continued use of left/right arrow\n\t\t\t\t\t// keys.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.\n\t\t\t\tif ( cannotFocusNextColumn ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tfocusablesInRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ UP, DOWN ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === UP ) {\n\t\t\t\t\tnextRowIndex = Math.max( 0, currentRowIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = Math.min(\n\t\t\t\t\t\tcurrentRowIndex + 1,\n\t\t\t\t\t\trows.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ HOME, END ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === HOME ) {\n\t\t\t\t\tnextRowIndex = 0;\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = rows.length - 1;\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ onExpandRow, onCollapseRow, onFocusRow ]\n\t);\n\n\t/* Disable reason: A treegrid is implemented using a table element. */\n\t/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n\treturn (\n\t\t<RovingTabIndexContainer>\n\t\t\t{\n\t\t\t\t// Prevent browser mode from triggering in NVDA by wrapping List View\n\t\t\t\t// in a role=application wrapper.\n\t\t\t\t// see: https://github.com/WordPress/gutenberg/issues/43729\n\t\t\t }\n\t\t\t<div role=\"application\" aria-label={ applicationAriaLabel }>\n\t\t\t\t<table\n\t\t\t\t\t{ ...props }\n\t\t\t\t\trole=\"treegrid\"\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t\tref={ ref }\n\t\t\t\t>\n\t\t\t\t\t<tbody>{ children }</tbody>\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t</RovingTabIndexContainer>\n\t);\n\t/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */\n}\n\nexport default forwardRef( TreeGrid );\nexport { default as TreeGridRow } from './row';\nexport { default as TreeGridCell } from './cell';\nexport { default as TreeGridItem } from './item';\n"]}
+{"version":3,"sources":["@wordpress/components/src/tree-grid/index.tsx"],"names":["focus","forwardRef","useCallback","UP","DOWN","LEFT","RIGHT","HOME","END","RovingTabIndexContainer","getRowFocusables","rowElement","focusablesInRow","focusable","find","sequential","filter","closest","UnforwardedTreeGrid","ref","children","onExpandRow","onCollapseRow","onFocusRow","applicationAriaLabel","props","onKeyDown","event","keyCode","metaKey","ctrlKey","altKey","hasModifierKeyPressed","includes","stopPropagation","activeElement","document","currentTarget","treeGridElement","contains","activeRow","currentColumnIndex","indexOf","canExpandCollapse","cannotFocusNextColumn","getAttribute","nextIndex","Math","max","min","length","preventDefault","level","parseInt","rows","Array","from","querySelectorAll","parentRow","currentRowIndex","i","ariaLevel","focusableItems","nextRowIndex","focusablesInNextRow","TreeGrid","default","TreeGridRow","TreeGridCell","TreeGridItem"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\nimport { forwardRef, useCallback } from '@wordpress/element';\nimport { UP, DOWN, LEFT, RIGHT, HOME, END } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexContainer from './roving-tab-index';\nimport type { TreeGridProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\n/**\n * Return focusables in a row element, excluding those from other branches\n * nested within the row.\n *\n * @param rowElement The DOM element representing the row.\n *\n * @return The array of focusables in the row.\n */\nfunction getRowFocusables( rowElement: HTMLElement ) {\n\tconst focusablesInRow = focus.focusable.find( rowElement, {\n\t\tsequential: true,\n\t} );\n\n\treturn focusablesInRow.filter( ( focusable ) => {\n\t\treturn focusable.closest( '[role=\"row\"]' ) === rowElement;\n\t} );\n}\n\n/**\n * Renders both a table and tbody element, used to create a tree hierarchy.\n *\n */\nfunction UnforwardedTreeGrid(\n\t{\n\t\tchildren,\n\t\tonExpandRow = () => {},\n\t\tonCollapseRow = () => {},\n\t\tonFocusRow = () => {},\n\t\tapplicationAriaLabel,\n\t\t...props\n\t}: WordPressComponentProps< TreeGridProps, 'table', false >,\n\t/** A ref to the underlying DOM table element. */\n\tref: React.ForwardedRef< HTMLTableElement >\n) {\n\tconst onKeyDown = useCallback(\n\t\t( event: React.KeyboardEvent< HTMLTableElement > ) => {\n\t\t\tconst { keyCode, metaKey, ctrlKey, altKey } = event;\n\n\t\t\t// The shift key is intentionally absent from the following list,\n\t\t\t// to enable shift + up/down to select items from the list.\n\t\t\tconst hasModifierKeyPressed = metaKey || ctrlKey || altKey;\n\n\t\t\tif (\n\t\t\t\thasModifierKeyPressed ||\n\t\t\t\t! ( [ UP, DOWN, LEFT, RIGHT, HOME, END ] as number[] ).includes(\n\t\t\t\t\tkeyCode\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The event will be handled, stop propagation.\n\t\t\tevent.stopPropagation();\n\n\t\t\tconst { activeElement } = document;\n\t\t\tconst { currentTarget: treeGridElement } = event;\n\n\t\t\tif (\n\t\t\t\t! activeElement ||\n\t\t\t\t! treeGridElement.contains( activeElement )\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Calculate the columnIndex of the active element.\n\t\t\tconst activeRow =\n\t\t\t\tactiveElement.closest< HTMLElement >( '[role=\"row\"]' );\n\n\t\t\tif ( ! activeRow ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst focusablesInRow = getRowFocusables( activeRow );\n\t\t\tconst currentColumnIndex = focusablesInRow.indexOf(\n\t\t\t\tactiveElement as HTMLElement\n\t\t\t);\n\t\t\tconst canExpandCollapse = 0 === currentColumnIndex;\n\t\t\tconst cannotFocusNextColumn =\n\t\t\t\tcanExpandCollapse &&\n\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'false' &&\n\t\t\t\tkeyCode === RIGHT;\n\n\t\t\tif ( ( [ LEFT, RIGHT ] as number[] ).includes( keyCode ) ) {\n\t\t\t\t// Calculate to the next element.\n\t\t\t\tlet nextIndex;\n\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\tnextIndex = Math.max( 0, currentColumnIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextIndex = Math.min(\n\t\t\t\t\t\tcurrentColumnIndex + 1,\n\t\t\t\t\t\tfocusablesInRow.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is at the left most column.\n\t\t\t\tif ( canExpandCollapse ) {\n\t\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\t\t// Left:\n\t\t\t\t\t\t// If a row is focused, and it is expanded, collapses the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'true'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonCollapseRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, moves to the parent row (if there is one).\n\t\t\t\t\t\tconst level = Math.max(\n\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\tactiveRow?.getAttribute( 'aria-level' ) ?? '1',\n\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t) - 1,\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst rows = Array.from(\n\t\t\t\t\t\t\ttreeGridElement.querySelectorAll< HTMLElement >(\n\t\t\t\t\t\t\t\t'[role=\"row\"]'\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t\tlet parentRow = activeRow;\n\t\t\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\t\t\tfor ( let i = currentRowIndex; i >= 0; i-- ) {\n\t\t\t\t\t\t\tconst ariaLevel =\n\t\t\t\t\t\t\t\trows[ i ].getAttribute( 'aria-level' );\n\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tariaLevel !== null &&\n\t\t\t\t\t\t\t\tparseInt( ariaLevel, 10 ) === level\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tparentRow = rows[ i ];\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tgetRowFocusables( parentRow )?.[ 0 ]?.focus();\n\t\t\t\t\t}\n\t\t\t\t\tif ( keyCode === RIGHT ) {\n\t\t\t\t\t\t// Right:\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, expands the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) ===\n\t\t\t\t\t\t\t'false'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonExpandRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is expanded, focuses the next cell in the row.\n\t\t\t\t\t\tconst focusableItems = getRowFocusables( activeRow );\n\t\t\t\t\t\tif ( focusableItems.length > 0 ) {\n\t\t\t\t\t\t\tfocusableItems[ nextIndex ]?.focus();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start reading text on continued use of left/right arrow\n\t\t\t\t\t// keys.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.\n\t\t\t\tif ( cannotFocusNextColumn ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tfocusablesInRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( ( [ UP, DOWN ] as number[] ).includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll< HTMLElement >(\n\t\t\t\t\t\t'[role=\"row\"]'\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === UP ) {\n\t\t\t\t\tnextRowIndex = Math.max( 0, currentRowIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = Math.min(\n\t\t\t\t\t\tcurrentRowIndex + 1,\n\t\t\t\t\t\trows.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( ( [ HOME, END ] as number[] ).includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll< HTMLElement >(\n\t\t\t\t\t\t'[role=\"row\"]'\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === HOME ) {\n\t\t\t\t\tnextRowIndex = 0;\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = rows.length - 1;\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ onExpandRow, onCollapseRow, onFocusRow ]\n\t);\n\n\t/* Disable reason: A treegrid is implemented using a table element. */\n\t/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n\treturn (\n\t\t<RovingTabIndexContainer>\n\t\t\t{\n\t\t\t\t// Prevent browser mode from triggering in NVDA by wrapping List View\n\t\t\t\t// in a role=application wrapper.\n\t\t\t\t// see: https://github.com/WordPress/gutenberg/issues/43729\n\t\t\t }\n\t\t\t<div role=\"application\" aria-label={ applicationAriaLabel }>\n\t\t\t\t<table\n\t\t\t\t\t{ ...props }\n\t\t\t\t\trole=\"treegrid\"\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t\tref={ ref }\n\t\t\t\t>\n\t\t\t\t\t<tbody>{ children }</tbody>\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t</RovingTabIndexContainer>\n\t);\n\t/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */\n}\n\n/**\n * `TreeGrid` is used to create a tree hierarchy.\n * It is not a visually styled component, but instead helps with adding\n * keyboard navigation and roving tab index behaviors to tree grid structures.\n *\n * A tree grid is a hierarchical 2 dimensional UI component, for example it could be\n * used to implement a file system browser.\n *\n * A tree grid allows the user to navigate using arrow keys.\n * Up/down to navigate vertically across rows, and left/right to navigate horizontally\n * between focusables in a row.\n *\n * The `TreeGrid` renders both a `table` and `tbody` element, and is intended to be used\n * with `TreeGridRow` (`tr`) and `TreeGridCell` (`td`) to build out a grid.\n *\n * ```jsx\n * function TreeMenu() {\n * \treturn (\n * \t\t<TreeGrid>\n * \t\t\t<TreeGridRow level={ 1 } positionInSet={ 1 } setSize={ 2 }>\n * \t\t\t\t<TreeGridCell>\n * \t\t\t\t\t{ ( props ) => (\n * \t\t\t\t\t\t<Button onClick={ onSelect } { ...props }>Select</Button>\n * \t\t\t\t\t) }\n * \t\t\t\t</TreeGridCell>\n * \t\t\t\t<TreeGridCell>\n * \t\t\t\t\t{ ( props ) => (\n * \t\t\t\t\t\t<Button onClick={ onMove } { ...props }>Move</Button>\n * \t\t\t\t\t) }\n * \t\t\t\t</TreeGridCell>\n * \t\t\t</TreeGridRow>\n * \t\t\t<TreeGridRow level={ 1 } positionInSet={ 2 } setSize={ 2 }>\n * \t\t\t\t<TreeGridCell>\n * \t\t\t\t\t{ ( props ) => (\n * \t\t\t\t\t\t<Button onClick={ onSelect } { ...props }>Select</Button>\n * \t\t\t\t\t) }\n * \t\t\t\t</TreeGridCell>\n * \t\t\t\t<TreeGridCell>\n * \t\t\t\t\t{ ( props ) => (\n * \t\t\t\t\t\t<Button onClick={ onMove } { ...props }>Move</Button>\n * \t\t\t\t\t) }\n * \t\t\t\t</TreeGridCell>\n * \t\t\t</TreeGridRow>\n * \t\t\t<TreeGridRow level={ 2 } positionInSet={ 1 } setSize={ 1 }>\n * \t\t\t\t<TreeGridCell>\n * \t\t\t\t\t{ ( props ) => (\n * \t\t\t\t\t\t<Button onClick={ onSelect } { ...props }>Select</Button>\n * \t\t\t\t\t) }\n * \t\t\t\t</TreeGridCell>\n * \t\t\t\t<TreeGridCell>\n * \t\t\t\t\t{ ( props ) => (\n * \t\t\t\t\t\t<Button onClick={ onMove } { ...props }>Move</Button>\n * \t\t\t\t\t) }\n * \t\t\t\t</TreeGridCell>\n * \t\t\t</TreeGridRow>\n * \t\t</TreeGrid>\n * \t);\n * }\n * ```\n *\n * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}\n */\nexport const TreeGrid = forwardRef( UnforwardedTreeGrid );\n\nexport default TreeGrid;\nexport { default as TreeGridRow } from './row';\nexport { default as TreeGridCell } from './cell';\nexport { default as TreeGridItem } from './item';\n"]}

package/build-module/tree-grid/item.js

@@ -10,7 +10,8 @@ import { forwardRef } from '@wordpress/element';
  */
 
 import RovingTabIndexItem from './roving-tab-index-item';
-export default forwardRef(function TreeGridItem(_ref, ref) {
+
+function UnforwardedTreeGridItem(_ref, ref) {
   let {
     children,
     ...props
@@ -18,5 +19,16 @@ export default forwardRef(function TreeGridItem(_ref, ref) {
   return createElement(RovingTabIndexItem, _extends({
     ref: ref
   }, props), children);
-});
+}
+/**
+ * `TreeGridItem` is used to create a tree hierarchy.
+ * It is not a visually styled component, but instead helps with adding
+ * keyboard navigation and roving tab index behaviors to tree grid structures.
+ *
+ * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}
+ */
+
+
+export const TreeGridItem = forwardRef(UnforwardedTreeGridItem);
+export default TreeGridItem;
 //# sourceMappingURL=item.js.map

package/build-module/tree-grid/item.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tree-grid/item.js"],"names":["forwardRef","RovingTabIndexItem","TreeGridItem","ref","children","props"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,yBAA/B;AAEA,eAAeD,UAAU,CAAE,SAASE,YAAT,OAE1BC,GAF0B,EAGzB;AAAA,MAFD;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,GAEC;AACD,SACC,cAAC,kBAAD;AAAoB,IAAA,GAAG,EAAGF;AAA1B,KAAqCE,KAArC,GACGD,QADH,CADD;AAKA,CATwB,CAAzB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexItem from './roving-tab-index-item';\n\nexport default forwardRef( function TreeGridItem(\n\t{ children, ...props },\n\tref\n) {\n\treturn (\n\t\t<RovingTabIndexItem ref={ ref } { ...props }>\n\t\t\t{ children }\n\t\t</RovingTabIndexItem>\n\t);\n} );\n"]}
+{"version":3,"sources":["@wordpress/components/src/tree-grid/item.tsx"],"names":["forwardRef","RovingTabIndexItem","UnforwardedTreeGridItem","ref","children","props","TreeGridItem"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,yBAA/B;;AAGA,SAASC,uBAAT,OAECC,GAFD,EAGE;AAAA,MAFD;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,GAEC;AACD,SACC,cAAC,kBAAD;AAAoB,IAAA,GAAG,EAAGF;AAA1B,KAAqCE,KAArC,GACGD,QADH,CADD;AAKA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAME,YAAY,GAAGN,UAAU,CAAEE,uBAAF,CAA/B;AAEP,eAAeI,YAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexItem from './roving-tab-index-item';\nimport type { RovingTabIndexItemProps } from './types';\n\nfunction UnforwardedTreeGridItem(\n\t{ children, ...props }: RovingTabIndexItemProps,\n\tref: React.ForwardedRef< any >\n) {\n\treturn (\n\t\t<RovingTabIndexItem ref={ ref } { ...props }>\n\t\t\t{ children }\n\t\t</RovingTabIndexItem>\n\t);\n}\n\n/**\n * `TreeGridItem` is used to create a tree hierarchy.\n * It is not a visually styled component, but instead helps with adding\n * keyboard navigation and roving tab index behaviors to tree grid structures.\n *\n * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}\n */\nexport const TreeGridItem = forwardRef( UnforwardedTreeGridItem );\n\nexport default TreeGridItem;\n"]}

package/build-module/tree-grid/roving-tab-index-context.js

@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { createContext, useContext } from '@wordpress/element';
-const RovingTabIndexContext = createContext();
+const RovingTabIndexContext = createContext(undefined);
 export const useRovingTabIndexContext = () => useContext(RovingTabIndexContext);
 export const RovingTabIndexProvider = RovingTabIndexContext.Provider;
 //# sourceMappingURL=roving-tab-index-context.js.map

package/build-module/tree-grid/roving-tab-index-context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tree-grid/roving-tab-index-context.js"],"names":["createContext","useContext","RovingTabIndexContext","useRovingTabIndexContext","RovingTabIndexProvider","Provider"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,oBAA1C;AAEA,MAAMC,qBAAqB,GAAGF,aAAa,EAA3C;AACA,OAAO,MAAMG,wBAAwB,GAAG,MACvCF,UAAU,CAAEC,qBAAF,CADJ;AAEP,OAAO,MAAME,sBAAsB,GAAGF,qBAAqB,CAACG,QAArD","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\n\nconst RovingTabIndexContext = createContext();\nexport const useRovingTabIndexContext = () =>\n\tuseContext( RovingTabIndexContext );\nexport const RovingTabIndexProvider = RovingTabIndexContext.Provider;\n"]}
+{"version":3,"sources":["@wordpress/components/src/tree-grid/roving-tab-index-context.ts"],"names":["createContext","useContext","RovingTabIndexContext","undefined","useRovingTabIndexContext","RovingTabIndexProvider","Provider"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,oBAA1C;AAEA,MAAMC,qBAAqB,GAAGF,aAAa,CAQxCG,SARwC,CAA3C;AASA,OAAO,MAAMC,wBAAwB,GAAG,MACvCH,UAAU,CAAEC,qBAAF,CADJ;AAEP,OAAO,MAAMG,sBAAsB,GAAGH,qBAAqB,CAACI,QAArD","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\n\nconst RovingTabIndexContext = createContext<\n\t| {\n\t\t\tlastFocusedElement: HTMLElement | undefined;\n\t\t\tsetLastFocusedElement: React.Dispatch<\n\t\t\t\tReact.SetStateAction< HTMLElement | undefined >\n\t\t\t>;\n\t  }\n\t| undefined\n>( undefined );\nexport const useRovingTabIndexContext = () =>\n\tuseContext( RovingTabIndexContext );\nexport const RovingTabIndexProvider = RovingTabIndexContext.Provider;\n"]}

package/build-module/tree-grid/roving-tab-index-item.js

@@ -9,14 +9,15 @@ import { useRef, forwardRef } from '@wordpress/element';
  */
 
 import { useRovingTabIndexContext } from './roving-tab-index-context';
-export default forwardRef(function RovingTabIndexItem(_ref, forwardedRef) {
+export const RovingTabIndexItem = forwardRef(function UnforwardedRovingTabIndexItem(_ref, forwardedRef) {
   let {
     children,
     as: Component,
     ...props
   } = _ref;
   const localRef = useRef();
-  const ref = forwardedRef || localRef;
+  const ref = forwardedRef || localRef; // @ts-expect-error - We actually want to throw an error if this is undefined.
+
   const {
     lastFocusedElement,
     setLastFocusedElement
@@ -24,10 +25,14 @@ export default forwardRef(function RovingTabIndexItem(_ref, forwardedRef) {
   let tabIndex;
 
   if (lastFocusedElement) {
-    tabIndex = lastFocusedElement === ref.current ? 0 : -1;
+    tabIndex = lastFocusedElement === ( // TODO: The original implementation simply used `ref.current` here, assuming
+    // that a forwarded ref would always be an object, which is not necessarily true.
+    // This workaround maintains the original runtime behavior in a type-safe way,
+    // but should be revisited.
+    'current' in ref ? ref.current : undefined) ? 0 : -1;
   }
 
-  const onFocus = event => setLastFocusedElement(event.target);
+  const onFocus = event => setLastFocusedElement === null || setLastFocusedElement === void 0 ? void 0 : setLastFocusedElement(event.target);
 
   const allProps = {
     ref,
@@ -40,6 +45,8 @@ export default forwardRef(function RovingTabIndexItem(_ref, forwardedRef) {
     return children(allProps);
   }
 
+  if (!Component) return null;
   return createElement(Component, allProps, children);
 });
+export default RovingTabIndexItem;
 //# sourceMappingURL=roving-tab-index-item.js.map

package/build-module/tree-grid/roving-tab-index-item.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tree-grid/roving-tab-index-item.js"],"names":["useRef","forwardRef","useRovingTabIndexContext","RovingTabIndexItem","forwardedRef","children","as","Component","props","localRef","ref","lastFocusedElement","setLastFocusedElement","tabIndex","current","onFocus","event","target","allProps"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,UAAjB,QAAmC,oBAAnC;AAEA;AACA;AACA;;AACA,SAASC,wBAAT,QAAyC,4BAAzC;AAEA,eAAeD,UAAU,CAAE,SAASE,kBAAT,OAE1BC,YAF0B,EAGzB;AAAA,MAFD;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,EAAE,EAAEC,SAAhB;AAA2B,OAAGC;AAA9B,GAEC;AACD,QAAMC,QAAQ,GAAGT,MAAM,EAAvB;AACA,QAAMU,GAAG,GAAGN,YAAY,IAAIK,QAA5B;AACA,QAAM;AAAEE,IAAAA,kBAAF;AAAsBC,IAAAA;AAAtB,MACLV,wBAAwB,EADzB;AAEA,MAAIW,QAAJ;;AAEA,MAAKF,kBAAL,EAA0B;AACzBE,IAAAA,QAAQ,GAAGF,kBAAkB,KAAKD,GAAG,CAACI,OAA3B,GAAqC,CAArC,GAAyC,CAAC,CAArD;AACA;;AAED,QAAMC,OAAO,GAAKC,KAAF,IAAaJ,qBAAqB,CAAEI,KAAK,CAACC,MAAR,CAAlD;;AACA,QAAMC,QAAQ,GAAG;AAAER,IAAAA,GAAF;AAAOG,IAAAA,QAAP;AAAiBE,IAAAA,OAAjB;AAA0B,OAAGP;AAA7B,GAAjB;;AAEA,MAAK,OAAOH,QAAP,KAAoB,UAAzB,EAAsC;AACrC,WAAOA,QAAQ,CAAEa,QAAF,CAAf;AACA;;AAED,SAAO,cAAC,SAAD,EAAgBA,QAAhB,EAA6Bb,QAA7B,CAAP;AACA,CAtBwB,CAAzB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useRovingTabIndexContext } from './roving-tab-index-context';\n\nexport default forwardRef( function RovingTabIndexItem(\n\t{ children, as: Component, ...props },\n\tforwardedRef\n) {\n\tconst localRef = useRef();\n\tconst ref = forwardedRef || localRef;\n\tconst { lastFocusedElement, setLastFocusedElement } =\n\t\tuseRovingTabIndexContext();\n\tlet tabIndex;\n\n\tif ( lastFocusedElement ) {\n\t\ttabIndex = lastFocusedElement === ref.current ? 0 : -1;\n\t}\n\n\tconst onFocus = ( event ) => setLastFocusedElement( event.target );\n\tconst allProps = { ref, tabIndex, onFocus, ...props };\n\n\tif ( typeof children === 'function' ) {\n\t\treturn children( allProps );\n\t}\n\n\treturn <Component { ...allProps }>{ children }</Component>;\n} );\n"]}
+{"version":3,"sources":["@wordpress/components/src/tree-grid/roving-tab-index-item.tsx"],"names":["useRef","forwardRef","useRovingTabIndexContext","RovingTabIndexItem","UnforwardedRovingTabIndexItem","forwardedRef","children","as","Component","props","localRef","ref","lastFocusedElement","setLastFocusedElement","tabIndex","current","undefined","onFocus","event","target","allProps"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,MAAT,EAAiBC,UAAjB,QAAmC,oBAAnC;AAEA;AACA;AACA;;AACA,SAASC,wBAAT,QAAyC,4BAAzC;AAGA,OAAO,MAAMC,kBAAkB,GAAGF,UAAU,CAC3C,SAASG,6BAAT,OAECC,YAFD,EAGE;AAAA,MAFD;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,EAAE,EAAEC,SAAhB;AAA2B,OAAGC;AAA9B,GAEC;AACD,QAAMC,QAAQ,GAAGV,MAAM,EAAvB;AACA,QAAMW,GAAG,GAAGN,YAAY,IAAIK,QAA5B,CAFC,CAGD;;AACA,QAAM;AAAEE,IAAAA,kBAAF;AAAsBC,IAAAA;AAAtB,MACLX,wBAAwB,EADzB;AAEA,MAAIY,QAAJ;;AAEA,MAAKF,kBAAL,EAA0B;AACzBE,IAAAA,QAAQ,GACPF,kBAAkB,OAClB;AACA;AACA;AACA;AACE,iBAAaD,GAAb,GAAmBA,GAAG,CAACI,OAAvB,GAAiCC,SALjB,CAAlB,GAMG,CANH,GAOG,CAAC,CARL;AASA;;AAED,QAAMC,OAA+C,GAAKC,KAAF,IACvDL,qBADuD,aACvDA,qBADuD,uBACvDA,qBAAqB,CAAIK,KAAK,CAACC,MAAV,CADtB;;AAEA,QAAMC,QAAQ,GAAG;AAAET,IAAAA,GAAF;AAAOG,IAAAA,QAAP;AAAiBG,IAAAA,OAAjB;AAA0B,OAAGR;AAA7B,GAAjB;;AAEA,MAAK,OAAOH,QAAP,KAAoB,UAAzB,EAAsC;AACrC,WAAOA,QAAQ,CAAEc,QAAF,CAAf;AACA;;AAED,MAAK,CAAEZ,SAAP,EAAmB,OAAO,IAAP;AAEnB,SAAO,cAAC,SAAD,EAAgBY,QAAhB,EAA6Bd,QAA7B,CAAP;AACA,CAnC0C,CAArC;AAsCP,eAAeH,kBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useRovingTabIndexContext } from './roving-tab-index-context';\nimport type { RovingTabIndexItemProps } from './types';\n\nexport const RovingTabIndexItem = forwardRef(\n\tfunction UnforwardedRovingTabIndexItem(\n\t\t{ children, as: Component, ...props }: RovingTabIndexItemProps,\n\t\tforwardedRef: React.ForwardedRef< any >\n\t) {\n\t\tconst localRef = useRef< any >();\n\t\tconst ref = forwardedRef || localRef;\n\t\t// @ts-expect-error - We actually want to throw an error if this is undefined.\n\t\tconst { lastFocusedElement, setLastFocusedElement } =\n\t\t\tuseRovingTabIndexContext();\n\t\tlet tabIndex;\n\n\t\tif ( lastFocusedElement ) {\n\t\t\ttabIndex =\n\t\t\t\tlastFocusedElement ===\n\t\t\t\t// TODO: The original implementation simply used `ref.current` here, assuming\n\t\t\t\t// that a forwarded ref would always be an object, which is not necessarily true.\n\t\t\t\t// This workaround maintains the original runtime behavior in a type-safe way,\n\t\t\t\t// but should be revisited.\n\t\t\t\t( 'current' in ref ? ref.current : undefined )\n\t\t\t\t\t? 0\n\t\t\t\t\t: -1;\n\t\t}\n\n\t\tconst onFocus: React.FocusEventHandler< HTMLElement > = ( event ) =>\n\t\t\tsetLastFocusedElement?.( event.target );\n\t\tconst allProps = { ref, tabIndex, onFocus, ...props };\n\n\t\tif ( typeof children === 'function' ) {\n\t\t\treturn children( allProps );\n\t\t}\n\n\t\tif ( ! Component ) return null;\n\n\t\treturn <Component { ...allProps }>{ children }</Component>;\n\t}\n);\n\nexport default RovingTabIndexItem;\n"]}

package/build-module/tree-grid/roving-tab-index.js

@@ -13,9 +13,6 @@ import { RovingTabIndexProvider } from './roving-tab-index-context';
  * Provider for adding roving tab index behaviors to tree grid structures.
  *
  * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md
- *
- * @param {Object}    props          Component props.
- * @param {WPElement} props.children Children to be rendered
  */
 
 export default function RovingTabIndex(_ref) {

package/build-module/tree-grid/roving-tab-index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tree-grid/roving-tab-index.js"],"names":["useState","useMemo","RovingTabIndexProvider","RovingTabIndex","children","lastFocusedElement","setLastFocusedElement","providerValue"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,OAAnB,QAAkC,oBAAlC;AAEA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,4BAAvC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,cAAT,OAAwC;AAAA,MAAf;AAAEC,IAAAA;AAAF,GAAe;AACtD,QAAM,CAAEC,kBAAF,EAAsBC,qBAAtB,IAAgDN,QAAQ,EAA9D,CADsD,CAGtD;AACA;AACA;;AACA,QAAMO,aAAa,GAAGN,OAAO,CAC5B,OAAQ;AAAEI,IAAAA,kBAAF;AAAsBC,IAAAA;AAAtB,GAAR,CAD4B,EAE5B,CAAED,kBAAF,CAF4B,CAA7B;AAKA,SACC,cAAC,sBAAD;AAAwB,IAAA,KAAK,EAAGE;AAAhC,KACGH,QADH,CADD;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { RovingTabIndexProvider } from './roving-tab-index-context';\n\n/**\n * Provider for adding roving tab index behaviors to tree grid structures.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n *\n * @param {Object}    props          Component props.\n * @param {WPElement} props.children Children to be rendered\n */\nexport default function RovingTabIndex( { children } ) {\n\tconst [ lastFocusedElement, setLastFocusedElement ] = useState();\n\n\t// Use `useMemo` to avoid creation of a new object for the providerValue\n\t// on every render. Only create a new object when the `lastFocusedElement`\n\t// value changes.\n\tconst providerValue = useMemo(\n\t\t() => ( { lastFocusedElement, setLastFocusedElement } ),\n\t\t[ lastFocusedElement ]\n\t);\n\n\treturn (\n\t\t<RovingTabIndexProvider value={ providerValue }>\n\t\t\t{ children }\n\t\t</RovingTabIndexProvider>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/tree-grid/roving-tab-index.tsx"],"names":["useState","useMemo","RovingTabIndexProvider","RovingTabIndex","children","lastFocusedElement","setLastFocusedElement","providerValue"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,OAAnB,QAAkC,oBAAlC;AAEA;AACA;AACA;;AACA,SAASC,sBAAT,QAAuC,4BAAvC;AAEA;AACA;AACA;AACA;AACA;;AACA,eAAe,SAASC,cAAT,OAIX;AAAA,MAJoC;AACvCC,IAAAA;AADuC,GAIpC;AACH,QAAM,CAAEC,kBAAF,EAAsBC,qBAAtB,IACLN,QAAQ,EADT,CADG,CAIH;AACA;AACA;;AACA,QAAMO,aAAa,GAAGN,OAAO,CAC5B,OAAQ;AAAEI,IAAAA,kBAAF;AAAsBC,IAAAA;AAAtB,GAAR,CAD4B,EAE5B,CAAED,kBAAF,CAF4B,CAA7B;AAKA,SACC,cAAC,sBAAD;AAAwB,IAAA,KAAK,EAAGE;AAAhC,KACGH,QADH,CADD;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useState, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { RovingTabIndexProvider } from './roving-tab-index-context';\n\n/**\n * Provider for adding roving tab index behaviors to tree grid structures.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n */\nexport default function RovingTabIndex( {\n\tchildren,\n}: {\n\tchildren: React.ReactNode;\n} ) {\n\tconst [ lastFocusedElement, setLastFocusedElement ] =\n\t\tuseState< HTMLElement >();\n\n\t// Use `useMemo` to avoid creation of a new object for the providerValue\n\t// on every render. Only create a new object when the `lastFocusedElement`\n\t// value changes.\n\tconst providerValue = useMemo(\n\t\t() => ( { lastFocusedElement, setLastFocusedElement } ),\n\t\t[ lastFocusedElement ]\n\t);\n\n\treturn (\n\t\t<RovingTabIndexProvider value={ providerValue }>\n\t\t\t{ children }\n\t\t</RovingTabIndexProvider>\n\t);\n}\n"]}

package/build-module/tree-grid/row.js

@@ -5,8 +5,11 @@ import { createElement } from "@wordpress/element";
  * WordPress dependencies
  */
 import { forwardRef } from '@wordpress/element';
+/**
+ * Internal dependencies
+ */
 
-function TreeGridRow(_ref, ref) {
+function UnforwardedTreeGridRow(_ref, ref) {
   let {
     children,
     level,
@@ -15,22 +18,24 @@ function TreeGridRow(_ref, ref) {
     isExpanded,
     ...props
   } = _ref;
-  return (// Disable reason: Due to an error in the ARIA 1.1 specification, the
-    // aria-posinset and aria-setsize properties are not supported on row
-    // elements. This is being corrected in ARIA 1.2. Consequently, the
-    // linting rule fails when validating this markup.
-    //
-    // eslint-disable-next-line jsx-a11y/role-supports-aria-props
-    createElement("tr", _extends({}, props, {
-      ref: ref,
-      role: "row",
-      "aria-level": level,
-      "aria-posinset": positionInSet,
-      "aria-setsize": setSize,
-      "aria-expanded": isExpanded
-    }), children)
-  );
+  return createElement("tr", _extends({}, props, {
+    ref: ref,
+    role: "row",
+    "aria-level": level,
+    "aria-posinset": positionInSet,
+    "aria-setsize": setSize,
+    "aria-expanded": isExpanded
+  }), children);
 }
+/**
+ * `TreeGridRow` is used to create a tree hierarchy.
+ * It is not a visually styled component, but instead helps with adding
+ * keyboard navigation and roving tab index behaviors to tree grid structures.
+ *
+ * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}
+ */
+
 
-export default forwardRef(TreeGridRow);
+export const TreeGridRow = forwardRef(UnforwardedTreeGridRow);
+export default TreeGridRow;
 //# sourceMappingURL=row.js.map

package/build-module/tree-grid/row.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tree-grid/row.js"],"names":["forwardRef","TreeGridRow","ref","children","level","positionInSet","setSize","isExpanded","props"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;;AAEA,SAASC,WAAT,OAECC,GAFD,EAGE;AAAA,MAFD;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,KAAZ;AAAmBC,IAAAA,aAAnB;AAAkCC,IAAAA,OAAlC;AAA2CC,IAAAA,UAA3C;AAAuD,OAAGC;AAA1D,GAEC;AACD,SACC;AACA;AACA;AACA;AACA;AACA;AACA,qCACMA,KADN;AAEC,MAAA,GAAG,EAAGN,GAFP;AAGC,MAAA,IAAI,EAAC,KAHN;AAIC,oBAAaE,KAJd;AAKC,uBAAgBC,aALjB;AAMC,sBAAeC,OANhB;AAOC,uBAAgBC;AAPjB,QASGJ,QATH;AAPD;AAmBA;;AAED,eAAeH,UAAU,CAAEC,WAAF,CAAzB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\nfunction TreeGridRow(\n\t{ children, level, positionInSet, setSize, isExpanded, ...props },\n\tref\n) {\n\treturn (\n\t\t// Disable reason: Due to an error in the ARIA 1.1 specification, the\n\t\t// aria-posinset and aria-setsize properties are not supported on row\n\t\t// elements. This is being corrected in ARIA 1.2. Consequently, the\n\t\t// linting rule fails when validating this markup.\n\t\t//\n\t\t// eslint-disable-next-line jsx-a11y/role-supports-aria-props\n\t\t<tr\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t\trole=\"row\"\n\t\t\taria-level={ level }\n\t\t\taria-posinset={ positionInSet }\n\t\t\taria-setsize={ setSize }\n\t\t\taria-expanded={ isExpanded }\n\t\t>\n\t\t\t{ children }\n\t\t</tr>\n\t);\n}\n\nexport default forwardRef( TreeGridRow );\n"]}
+{"version":3,"sources":["@wordpress/components/src/tree-grid/row.tsx"],"names":["forwardRef","UnforwardedTreeGridRow","ref","children","level","positionInSet","setSize","isExpanded","props","TreeGridRow"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AAIA,SAASC,sBAAT,OASCC,GATD,EAUE;AAAA,MATD;AACCC,IAAAA,QADD;AAECC,IAAAA,KAFD;AAGCC,IAAAA,aAHD;AAICC,IAAAA,OAJD;AAKCC,IAAAA,UALD;AAMC,OAAGC;AANJ,GASC;AACD,SACC,iCACMA,KADN;AAEC,IAAA,GAAG,EAAGN,GAFP;AAGC,IAAA,IAAI,EAAC,KAHN;AAIC,kBAAaE,KAJd;AAKC,qBAAgBC,aALjB;AAMC,oBAAeC,OANhB;AAOC,qBAAgBC;AAPjB,MASGJ,QATH,CADD;AAaA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAMM,WAAW,GAAGT,UAAU,CAAEC,sBAAF,CAA9B;AAEP,eAAeQ,WAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { TreeGridRowProps } from './types';\n\nfunction UnforwardedTreeGridRow(\n\t{\n\t\tchildren,\n\t\tlevel,\n\t\tpositionInSet,\n\t\tsetSize,\n\t\tisExpanded,\n\t\t...props\n\t}: WordPressComponentProps< TreeGridRowProps, 'tr', false >,\n\tref: React.ForwardedRef< HTMLTableRowElement >\n) {\n\treturn (\n\t\t<tr\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t\trole=\"row\"\n\t\t\taria-level={ level }\n\t\t\taria-posinset={ positionInSet }\n\t\t\taria-setsize={ setSize }\n\t\t\taria-expanded={ isExpanded }\n\t\t>\n\t\t\t{ children }\n\t\t</tr>\n\t);\n}\n\n/**\n * `TreeGridRow` is used to create a tree hierarchy.\n * It is not a visually styled component, but instead helps with adding\n * keyboard navigation and roving tab index behaviors to tree grid structures.\n *\n * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}\n */\nexport const TreeGridRow = forwardRef( UnforwardedTreeGridRow );\n\nexport default TreeGridRow;\n"]}

package/build-module/tree-grid/types.js

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

package/build-module/tree-grid/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/build-module/ui/context/context-connect.js

@@ -18,8 +18,8 @@ import { getStyledClassNameFromKey } from './get-styled-class-name-from-key';
  * Forwards ref (React.ForwardRef) and "Connects" (or registers) a component
  * within the Context system under a specified namespace.
  *
- * @param  Component The component to register into the Context system.
- * @param  namespace The namespace to register the component under.
+ * @param Component The component to register into the Context system.
+ * @param namespace The namespace to register the component under.
  * @return The connected WordPressComponent
  */
 export function contextConnect(Component, namespace) {
@@ -31,8 +31,8 @@ export function contextConnect(Component, namespace) {
  * "Connects" (or registers) a component within the Context system under a specified namespace.
  * Does not forward a ref.
  *
- * @param  Component The component to register into the Context system.
- * @param  namespace The namespace to register the component under.
+ * @param Component The component to register into the Context system.
+ * @param namespace The namespace to register the component under.
  * @return The connected WordPressComponent
  */
 
@@ -74,7 +74,7 @@ function _contextConnect(Component, namespace, options) {
 /**
  * Attempts to retrieve the connected namespace from a component.
  *
- * @param  Component The component to retrieve a namespace from.
+ * @param Component The component to retrieve a namespace from.
  * @return The connected namespaces.
  */
 
@@ -99,8 +99,8 @@ export function getConnectNamespace(Component) {
 /**
  * Checks to see if a component is connected within the Context system.
  *
- * @param  Component The component to retrieve a namespace from.
- * @param  match     The namespace to check.
+ * @param Component The component to retrieve a namespace from.
+ * @param match     The namespace to check.
  */
 
 export function hasConnectNamespace(Component, match) {

package/build-module/ui/context/context-connect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/ui/context/context-connect.ts"],"names":["forwardRef","warn","CONNECT_STATIC_NAMESPACE","getStyledClassNameFromKey","contextConnect","Component","namespace","_contextConnect","forwardsRef","contextConnectWithoutRef","options","WrappedComponent","mergedNamespace","Array","isArray","Object","assign","Set","displayName","selector","getConnectNamespace","namespaces","type","hasConnectNamespace","match","includes","some","result"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, ReactChild, ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport warn from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport { CONNECT_STATIC_NAMESPACE } from './constants';\nimport { getStyledClassNameFromKey } from './get-styled-class-name-from-key';\nimport type { WordPressComponentFromProps } from '.';\n\ntype AcceptsTwoArgs<\n\tF extends ( ...args: any ) => any,\n\tErrorMessage = never\n> = Parameters< F >[ 'length' ] extends 2 ? {} : ErrorMessage;\n\ntype ContextConnectOptions = {\n\tforwardsRef?: boolean;\n};\n\n/**\n * Forwards ref (React.ForwardRef) and \"Connects\" (or registers) a component\n * within the Context system under a specified namespace.\n *\n * @param  Component The component to register into the Context system.\n * @param  namespace The namespace to register the component under.\n * @return The connected WordPressComponent\n */\nexport function contextConnect<\n\tC extends ( props: any, ref: ForwardedRef< any > ) => JSX.Element | null\n>(\n\tComponent: C &\n\t\tAcceptsTwoArgs<\n\t\t\tC,\n\t\t\t'Warning: Your component function does not take a ref as the second argument. Did you mean to use `contextConnectWithoutRef`?'\n\t\t>,\n\tnamespace: string\n) {\n\treturn _contextConnect( Component, namespace, { forwardsRef: true } );\n}\n\n/**\n * \"Connects\" (or registers) a component within the Context system under a specified namespace.\n * Does not forward a ref.\n *\n * @param  Component The component to register into the Context system.\n * @param  namespace The namespace to register the component under.\n * @return The connected WordPressComponent\n */\nexport function contextConnectWithoutRef< P >(\n\tComponent: ( props: P ) => JSX.Element | null,\n\tnamespace: string\n) {\n\treturn _contextConnect( Component, namespace );\n}\n\n// This is an (experimental) evolution of the initial connect() HOC.\n// The hope is that we can improve render performance by removing functional\n// component wrappers.\nfunction _contextConnect<\n\tC extends ( props: any, ref: ForwardedRef< any > ) => JSX.Element | null,\n\tO extends ContextConnectOptions\n>(\n\tComponent: C,\n\tnamespace: string,\n\toptions?: O\n): WordPressComponentFromProps<\n\tParameters< C >[ 0 ],\n\tO[ 'forwardsRef' ] extends true ? true : false\n> {\n\tconst WrappedComponent = options?.forwardsRef\n\t\t? forwardRef< any, Parameters< C >[ 0 ] >( Component )\n\t\t: Component;\n\n\tif ( typeof namespace === 'undefined' ) {\n\t\twarn( 'contextConnect: Please provide a namespace' );\n\t}\n\n\t// @ts-expect-error internal property\n\tlet mergedNamespace = WrappedComponent[ CONNECT_STATIC_NAMESPACE ] || [\n\t\tnamespace,\n\t];\n\n\t/**\n\t * Consolidate (merge) namespaces before attaching it to the WrappedComponent.\n\t */\n\tif ( Array.isArray( namespace ) ) {\n\t\tmergedNamespace = [ ...mergedNamespace, ...namespace ];\n\t}\n\tif ( typeof namespace === 'string' ) {\n\t\tmergedNamespace = [ ...mergedNamespace, namespace ];\n\t}\n\n\t// @ts-expect-error We can't rely on inferred types here because of the\n\t// `as` prop polymorphism we're handling in https://github.com/WordPress/gutenberg/blob/9620bae6fef4fde7cc2b7833f416e240207cda29/packages/components/src/ui/context/wordpress-component.ts#L32-L33\n\treturn Object.assign( WrappedComponent, {\n\t\t[ CONNECT_STATIC_NAMESPACE ]: [ ...new Set( mergedNamespace ) ],\n\t\tdisplayName: namespace,\n\t\tselector: `.${ getStyledClassNameFromKey( namespace ) }`,\n\t} );\n}\n\n/**\n * Attempts to retrieve the connected namespace from a component.\n *\n * @param  Component The component to retrieve a namespace from.\n * @return The connected namespaces.\n */\nexport function getConnectNamespace(\n\tComponent: ReactChild | undefined | {}\n): string[] {\n\tif ( ! Component ) return [];\n\n\tlet namespaces = [];\n\n\t// @ts-ignore internal property\n\tif ( Component[ CONNECT_STATIC_NAMESPACE ] ) {\n\t\t// @ts-ignore internal property\n\t\tnamespaces = Component[ CONNECT_STATIC_NAMESPACE ];\n\t}\n\n\t// @ts-ignore\n\tif ( Component.type && Component.type[ CONNECT_STATIC_NAMESPACE ] ) {\n\t\t// @ts-ignore\n\t\tnamespaces = Component.type[ CONNECT_STATIC_NAMESPACE ];\n\t}\n\n\treturn namespaces;\n}\n\n/**\n * Checks to see if a component is connected within the Context system.\n *\n * @param  Component The component to retrieve a namespace from.\n * @param  match     The namespace to check.\n */\nexport function hasConnectNamespace(\n\tComponent: ReactNode,\n\tmatch: string[] | string\n): boolean {\n\tif ( ! Component ) return false;\n\n\tif ( typeof match === 'string' ) {\n\t\treturn getConnectNamespace( Component ).includes( match );\n\t}\n\tif ( Array.isArray( match ) ) {\n\t\treturn match.some( ( result ) =>\n\t\t\tgetConnectNamespace( Component ).includes( result )\n\t\t);\n\t}\n\n\treturn false;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/ui/context/context-connect.ts"],"names":["forwardRef","warn","CONNECT_STATIC_NAMESPACE","getStyledClassNameFromKey","contextConnect","Component","namespace","_contextConnect","forwardsRef","contextConnectWithoutRef","options","WrappedComponent","mergedNamespace","Array","isArray","Object","assign","Set","displayName","selector","getConnectNamespace","namespaces","type","hasConnectNamespace","match","includes","some","result"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, ReactChild, ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport warn from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport { CONNECT_STATIC_NAMESPACE } from './constants';\nimport { getStyledClassNameFromKey } from './get-styled-class-name-from-key';\nimport type { WordPressComponentFromProps } from '.';\n\ntype AcceptsTwoArgs<\n\tF extends ( ...args: any ) => any,\n\tErrorMessage = never\n> = Parameters< F >[ 'length' ] extends 2 ? {} : ErrorMessage;\n\ntype ContextConnectOptions = {\n\tforwardsRef?: boolean;\n};\n\n/**\n * Forwards ref (React.ForwardRef) and \"Connects\" (or registers) a component\n * within the Context system under a specified namespace.\n *\n * @param Component The component to register into the Context system.\n * @param namespace The namespace to register the component under.\n * @return The connected WordPressComponent\n */\nexport function contextConnect<\n\tC extends ( props: any, ref: ForwardedRef< any > ) => JSX.Element | null\n>(\n\tComponent: C &\n\t\tAcceptsTwoArgs<\n\t\t\tC,\n\t\t\t'Warning: Your component function does not take a ref as the second argument. Did you mean to use `contextConnectWithoutRef`?'\n\t\t>,\n\tnamespace: string\n) {\n\treturn _contextConnect( Component, namespace, { forwardsRef: true } );\n}\n\n/**\n * \"Connects\" (or registers) a component within the Context system under a specified namespace.\n * Does not forward a ref.\n *\n * @param Component The component to register into the Context system.\n * @param namespace The namespace to register the component under.\n * @return The connected WordPressComponent\n */\nexport function contextConnectWithoutRef< P >(\n\tComponent: ( props: P ) => JSX.Element | null,\n\tnamespace: string\n) {\n\treturn _contextConnect( Component, namespace );\n}\n\n// This is an (experimental) evolution of the initial connect() HOC.\n// The hope is that we can improve render performance by removing functional\n// component wrappers.\nfunction _contextConnect<\n\tC extends ( props: any, ref: ForwardedRef< any > ) => JSX.Element | null,\n\tO extends ContextConnectOptions\n>(\n\tComponent: C,\n\tnamespace: string,\n\toptions?: O\n): WordPressComponentFromProps<\n\tParameters< C >[ 0 ],\n\tO[ 'forwardsRef' ] extends true ? true : false\n> {\n\tconst WrappedComponent = options?.forwardsRef\n\t\t? forwardRef< any, Parameters< C >[ 0 ] >( Component )\n\t\t: Component;\n\n\tif ( typeof namespace === 'undefined' ) {\n\t\twarn( 'contextConnect: Please provide a namespace' );\n\t}\n\n\t// @ts-expect-error internal property\n\tlet mergedNamespace = WrappedComponent[ CONNECT_STATIC_NAMESPACE ] || [\n\t\tnamespace,\n\t];\n\n\t/**\n\t * Consolidate (merge) namespaces before attaching it to the WrappedComponent.\n\t */\n\tif ( Array.isArray( namespace ) ) {\n\t\tmergedNamespace = [ ...mergedNamespace, ...namespace ];\n\t}\n\tif ( typeof namespace === 'string' ) {\n\t\tmergedNamespace = [ ...mergedNamespace, namespace ];\n\t}\n\n\t// @ts-expect-error We can't rely on inferred types here because of the\n\t// `as` prop polymorphism we're handling in https://github.com/WordPress/gutenberg/blob/9620bae6fef4fde7cc2b7833f416e240207cda29/packages/components/src/ui/context/wordpress-component.ts#L32-L33\n\treturn Object.assign( WrappedComponent, {\n\t\t[ CONNECT_STATIC_NAMESPACE ]: [ ...new Set( mergedNamespace ) ],\n\t\tdisplayName: namespace,\n\t\tselector: `.${ getStyledClassNameFromKey( namespace ) }`,\n\t} );\n}\n\n/**\n * Attempts to retrieve the connected namespace from a component.\n *\n * @param Component The component to retrieve a namespace from.\n * @return The connected namespaces.\n */\nexport function getConnectNamespace(\n\tComponent: ReactChild | undefined | {}\n): string[] {\n\tif ( ! Component ) return [];\n\n\tlet namespaces = [];\n\n\t// @ts-ignore internal property\n\tif ( Component[ CONNECT_STATIC_NAMESPACE ] ) {\n\t\t// @ts-ignore internal property\n\t\tnamespaces = Component[ CONNECT_STATIC_NAMESPACE ];\n\t}\n\n\t// @ts-ignore\n\tif ( Component.type && Component.type[ CONNECT_STATIC_NAMESPACE ] ) {\n\t\t// @ts-ignore\n\t\tnamespaces = Component.type[ CONNECT_STATIC_NAMESPACE ];\n\t}\n\n\treturn namespaces;\n}\n\n/**\n * Checks to see if a component is connected within the Context system.\n *\n * @param Component The component to retrieve a namespace from.\n * @param match     The namespace to check.\n */\nexport function hasConnectNamespace(\n\tComponent: ReactNode,\n\tmatch: string[] | string\n): boolean {\n\tif ( ! Component ) return false;\n\n\tif ( typeof match === 'string' ) {\n\t\treturn getConnectNamespace( Component ).includes( match );\n\t}\n\tif ( Array.isArray( match ) ) {\n\t\treturn match.some( ( result ) =>\n\t\t\tgetConnectNamespace( Component ).includes( result )\n\t\t);\n\t}\n\n\treturn false;\n}\n"]}

package/build-module/ui/context/context-system-provider.js

@@ -3,8 +3,9 @@ import { createElement } from "@wordpress/element";
 /**
  * External dependencies
  */
+import deepmerge from 'deepmerge';
 import fastDeepEqual from 'fast-deep-equal/es6';
-import { merge } from 'lodash';
+import { isPlainObject } from 'is-plain-object';
 /**
  * WordPress dependencies
  */
@@ -45,7 +46,7 @@ function useContextSystemBridge(_ref) {
   }, [value]); // `parentContext` will always be memoized (i.e., the result of this hook itself)
   // or the default value from when the `ComponentsContext` was originally
   // initialized (which will never change, it's a static variable)
-  // so this memoization will prevent `merge` and `JSON.parse/stringify` from rerunning unless
+  // so this memoization will prevent `deepmerge()` from rerunning unless
   // the references to `value` change OR the `parentContext` has an actual material change
   // (because again, it's guaranteed to be memoized or a static reference to the empty object
   // so we know that the only changes for `parentContext` are material ones... i.e., why we
@@ -53,11 +54,13 @@ function useContextSystemBridge(_ref) {
   // need to bother with the `value`). The `useUpdateEffect` above will ensure that we are
   // correctly warning when the `value` isn't being properly memoized. All of that to say
   // that this should be super safe to assume that `useMemo` will only run on actual
-  // changes to the two dependencies, therefore saving us calls to `merge` and `JSON.parse/stringify`!
+  // changes to the two dependencies, therefore saving us calls to `deepmerge()`!
 
   const config = useMemo(() => {
     // Deep clone `parentContext` to avoid mutating it later.
-    return merge(JSON.parse(JSON.stringify(parentContext)), value);
+    return deepmerge(parentContext !== null && parentContext !== void 0 ? parentContext : {}, value !== null && value !== void 0 ? value : {}, {
+      isMergeableObject: isPlainObject
+    });
   }, [parentContext, value]);
   return config;
 }