@wordpress/components 23.3.1 → 23.4.0

package/build-module/menu-items-choice/index.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement, Fragment } from "@wordpress/element";
 
 /**
  * WordPress dependencies
@@ -11,15 +11,49 @@ import { check } from '@wordpress/icons';
 import MenuItem from '../menu-item';
 
 const noop = () => {};
+/**
+ * `MenuItemsChoice` functions similarly to a set of `MenuItem`s, but allows the user to select one option from a set of multiple choices.
+ *
+ *
+ * ```jsx
+ * import { MenuGroup, MenuItemsChoice } from '@wordpress/components';
+ * import { useState } from '@wordpress/element';
+ *
+ * const MyMenuItemsChoice = () => {
+ * 	const [ mode, setMode ] = useState( 'visual' );
+ * 	const choices = [
+ * 		{
+ * 			value: 'visual',
+ * 			label: 'Visual editor',
+ * 		},
+ * 		{
+ * 			value: 'text',
+ * 			label: 'Code editor',
+ * 		},
+ * 	];
+ *
+ * 	return (
+ * 		<MenuGroup label="Editor">
+ * 			<MenuItemsChoice
+ * 				choices={ choices }
+ * 				value={ mode }
+ * 				onSelect={ ( newMode ) => setMode( newMode ) }
+ * 			/>
+ * 		</MenuGroup>
+ * 	);
+ * };
+ * ```
+ */
 
-export default function MenuItemsChoice(_ref) {
+
+function MenuItemsChoice(_ref) {
   let {
     choices = [],
     onHover = noop,
     onSelect,
     value
   } = _ref;
-  return choices.map(item => {
+  return createElement(Fragment, null, choices.map(item => {
     const isSelected = value === item.value;
     return createElement(MenuItem, {
       key: item.value,
@@ -38,6 +72,8 @@ export default function MenuItemsChoice(_ref) {
       onMouseLeave: () => onHover(null),
       "aria-label": item['aria-label']
     }, item.label);
-  });
+  }));
 }
+
+export default MenuItemsChoice;
 //# sourceMappingURL=index.js.map

package/build-module/menu-items-choice/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/menu-items-choice/index.js"],"names":["check","MenuItem","noop","MenuItemsChoice","choices","onHover","onSelect","value","map","item","isSelected","info","shortcut","label"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,KAAT,QAAsB,kBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,QAAP,MAAqB,cAArB;;AAEA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,eAAe,SAASC,eAAT,OAKX;AAAA,MALqC;AACxCC,IAAAA,OAAO,GAAG,EAD8B;AAExCC,IAAAA,OAAO,GAAGH,IAF8B;AAGxCI,IAAAA,QAHwC;AAIxCC,IAAAA;AAJwC,GAKrC;AACH,SAAOH,OAAO,CAACI,GAAR,CAAeC,IAAF,IAAY;AAC/B,UAAMC,UAAU,GAAGH,KAAK,KAAKE,IAAI,CAACF,KAAlC;AACA,WACC,cAAC,QAAD;AACC,MAAA,GAAG,EAAGE,IAAI,CAACF,KADZ;AAEC,MAAA,IAAI,EAAC,eAFN;AAGC,MAAA,IAAI,EAAGG,UAAU,IAAIV,KAHtB;AAIC,MAAA,IAAI,EAAGS,IAAI,CAACE,IAJb;AAKC,MAAA,UAAU,EAAGD,UALd;AAMC,MAAA,QAAQ,EAAGD,IAAI,CAACG,QANjB;AAOC,MAAA,SAAS,EAAC,8BAPX;AAQC,MAAA,OAAO,EAAG,MAAM;AACf,YAAK,CAAEF,UAAP,EAAoB;AACnBJ,UAAAA,QAAQ,CAAEG,IAAI,CAACF,KAAP,CAAR;AACA;AACD,OAZF;AAaC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAEI,IAAI,CAACF,KAAP,CAb7B;AAcC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAE,IAAF,CAd7B;AAeC,oBAAaI,IAAI,CAAE,YAAF;AAflB,OAiBGA,IAAI,CAACI,KAjBR,CADD;AAqBA,GAvBM,CAAP;AAwBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport MenuItem from '../menu-item';\n\nconst noop = () => {};\n\nexport default function MenuItemsChoice( {\n\tchoices = [],\n\tonHover = noop,\n\tonSelect,\n\tvalue,\n} ) {\n\treturn choices.map( ( item ) => {\n\t\tconst isSelected = value === item.value;\n\t\treturn (\n\t\t\t<MenuItem\n\t\t\t\tkey={ item.value }\n\t\t\t\trole=\"menuitemradio\"\n\t\t\t\ticon={ isSelected && check }\n\t\t\t\tinfo={ item.info }\n\t\t\t\tisSelected={ isSelected }\n\t\t\t\tshortcut={ item.shortcut }\n\t\t\t\tclassName=\"components-menu-items-choice\"\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\tonMouseEnter={ () => onHover( item.value ) }\n\t\t\t\tonMouseLeave={ () => onHover( null ) }\n\t\t\t\taria-label={ item[ 'aria-label' ] }\n\t\t\t>\n\t\t\t\t{ item.label }\n\t\t\t</MenuItem>\n\t\t);\n\t} );\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/menu-items-choice/index.tsx"],"names":["check","MenuItem","noop","MenuItemsChoice","choices","onHover","onSelect","value","map","item","isSelected","info","shortcut","label"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,KAAT,QAAsB,kBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,QAAP,MAAqB,cAArB;;AAGA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASC,eAAT,OAK0B;AAAA,MALA;AACzBC,IAAAA,OAAO,GAAG,EADe;AAEzBC,IAAAA,OAAO,GAAGH,IAFe;AAGzBI,IAAAA,QAHyB;AAIzBC,IAAAA;AAJyB,GAKA;AACzB,SACC,8BACGH,OAAO,CAACI,GAAR,CAAeC,IAAF,IAAY;AAC1B,UAAMC,UAAU,GAAGH,KAAK,KAAKE,IAAI,CAACF,KAAlC;AACA,WACC,cAAC,QAAD;AACC,MAAA,GAAG,EAAGE,IAAI,CAACF,KADZ;AAEC,MAAA,IAAI,EAAC,eAFN;AAGC,MAAA,IAAI,EAAGG,UAAU,IAAIV,KAHtB;AAIC,MAAA,IAAI,EAAGS,IAAI,CAACE,IAJb;AAKC,MAAA,UAAU,EAAGD,UALd;AAMC,MAAA,QAAQ,EAAGD,IAAI,CAACG,QANjB;AAOC,MAAA,SAAS,EAAC,8BAPX;AAQC,MAAA,OAAO,EAAG,MAAM;AACf,YAAK,CAAEF,UAAP,EAAoB;AACnBJ,UAAAA,QAAQ,CAAEG,IAAI,CAACF,KAAP,CAAR;AACA;AACD,OAZF;AAaC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAEI,IAAI,CAACF,KAAP,CAb7B;AAcC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAE,IAAF,CAd7B;AAeC,oBAAaI,IAAI,CAAE,YAAF;AAflB,OAiBGA,IAAI,CAACI,KAjBR,CADD;AAqBA,GAvBC,CADH,CADD;AA4BA;;AAED,eAAeV,eAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport MenuItem from '../menu-item';\nimport type { MenuItemsChoiceProps } from './types';\n\nconst noop = () => {};\n\n/**\n * `MenuItemsChoice` functions similarly to a set of `MenuItem`s, but allows the user to select one option from a set of multiple choices.\n *\n *\n * ```jsx\n * import { MenuGroup, MenuItemsChoice } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyMenuItemsChoice = () => {\n * \tconst [ mode, setMode ] = useState( 'visual' );\n * \tconst choices = [\n * \t\t{\n * \t\t\tvalue: 'visual',\n * \t\t\tlabel: 'Visual editor',\n * \t\t},\n * \t\t{\n * \t\t\tvalue: 'text',\n * \t\t\tlabel: 'Code editor',\n * \t\t},\n * \t];\n *\n * \treturn (\n * \t\t<MenuGroup label=\"Editor\">\n * \t\t\t<MenuItemsChoice\n * \t\t\t\tchoices={ choices }\n * \t\t\t\tvalue={ mode }\n * \t\t\t\tonSelect={ ( newMode ) => setMode( newMode ) }\n * \t\t\t/>\n * \t\t</MenuGroup>\n * \t);\n * };\n * ```\n */\nfunction MenuItemsChoice( {\n\tchoices = [],\n\tonHover = noop,\n\tonSelect,\n\tvalue,\n}: MenuItemsChoiceProps ) {\n\treturn (\n\t\t<>\n\t\t\t{ choices.map( ( item ) => {\n\t\t\t\tconst isSelected = value === item.value;\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ item.value }\n\t\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\t\ticon={ isSelected && check }\n\t\t\t\t\t\tinfo={ item.info }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tshortcut={ item.shortcut }\n\t\t\t\t\t\tclassName=\"components-menu-items-choice\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonMouseEnter={ () => onHover( item.value ) }\n\t\t\t\t\t\tonMouseLeave={ () => onHover( null ) }\n\t\t\t\t\t\taria-label={ item[ 'aria-label' ] }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n\nexport default MenuItemsChoice;\n"]}

package/build-module/menu-items-choice/types.js

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

package/build-module/modal/index.js

@@ -9,10 +9,11 @@ import classnames from 'classnames';
 /**
  * WordPress dependencies
  */
-import { createPortal, useCallback, useEffect, useRef, useState, forwardRef } from '@wordpress/element';
+import { createPortal, useCallback, useEffect, useRef, useState, forwardRef, useLayoutEffect } from '@wordpress/element';
 import { useInstanceId, useFocusReturn, useFocusOnMount, __experimentalUseFocusOutside as useFocusOutside, useConstrainedTabbing, useMergeRefs } from '@wordpress/compose';
 import { __ } from '@wordpress/i18n';
 import { close } from '@wordpress/icons';
+import { getScrollContainer } from '@wordpress/dom';
 /**
  * Internal dependencies
  */
@@ -57,7 +58,24 @@ function UnforwardedModal(props, forwardedRef) {
   const constrainedTabbingRef = useConstrainedTabbing();
   const focusReturnRef = useFocusReturn();
   const focusOutsideProps = useFocusOutside(onRequestClose);
+  const contentRef = useRef(null);
+  const childrenContainerRef = useRef(null);
   const [hasScrolledContent, setHasScrolledContent] = useState(false);
+  const [hasScrollableContent, setHasScrollableContent] = useState(false); // Determines whether the Modal content is scrollable and updates the state.
+
+  const isContentScrollable = useCallback(() => {
+    if (!contentRef.current) {
+      return;
+    }
+
+    const closestScrollContainer = getScrollContainer(contentRef.current);
+
+    if (contentRef.current === closestScrollContainer) {
+      setHasScrollableContent(true);
+    } else {
+      setHasScrollableContent(false);
+    }
+  }, [contentRef]);
   useEffect(() => {
     openModalCount++;
 
@@ -74,7 +92,20 @@ function UnforwardedModal(props, forwardedRef) {
         ariaHelper.showApp();
       }
     };
-  }, [bodyOpenClassName]);
+  }, [bodyOpenClassName]); // Calls the isContentScrollable callback when the Modal children container resizes.
+
+  useLayoutEffect(() => {
+    if (!window.ResizeObserver || !childrenContainerRef.current) {
+      return;
+    }
+
+    const resizeObserver = new ResizeObserver(isContentScrollable);
+    resizeObserver.observe(childrenContainerRef.current);
+    isContentScrollable();
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [isContentScrollable, childrenContainerRef]);
 
   function handleEscapeKeyDown(event) {
     if ( // Ignore keydowns from IMEs
@@ -128,10 +159,14 @@ function UnforwardedModal(props, forwardedRef) {
   }), createElement("div", {
     className: classnames('components-modal__content', {
       'hide-header': __experimentalHideHeader,
+      'is-scrollable': hasScrollableContent,
       'has-scrolled-content': hasScrolledContent
     }),
     role: "document",
-    onScroll: onContentContainerScroll
+    onScroll: onContentContainerScroll,
+    ref: contentRef,
+    "aria-label": hasScrollableContent ? __('Scrollable section') : undefined,
+    tabIndex: hasScrollableContent ? 0 : undefined
   }, !__experimentalHideHeader && createElement("div", {
     className: "components-modal__header"
   }, createElement("div", {
@@ -146,7 +181,9 @@ function UnforwardedModal(props, forwardedRef) {
     onClick: onRequestClose,
     icon: close,
     label: closeButtonLabel || __('Close')
-  })), children)))), document.body);
+  })), createElement("div", {
+    ref: childrenContainerRef
+  }, children))))), document.body);
 }
 /**
  * Modals give users information and choices related to a task they’re trying to

package/build-module/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/modal/index.tsx"],"names":["classnames","createPortal","useCallback","useEffect","useRef","useState","forwardRef","useInstanceId","useFocusReturn","useFocusOnMount","__experimentalUseFocusOutside","useFocusOutside","useConstrainedTabbing","useMergeRefs","__","close","ariaHelper","Button","StyleProvider","openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","focusOutsideProps","hasScrolledContent","setHasScrolledContent","hideApp","current","document","body","classList","add","remove","showApp","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","scrollY","currentTarget","scrollTop"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel || __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n *   const [ isOpen, setOpen ] = useState( false );\n *   const openModal = () => setOpen( true );\n *   const closeModal = () => setOpen( false );\n *\n *   return (\n *     <>\n *       <Button variant=\"secondary\" onClick={ openModal }>\n *         Open Modal\n *       </Button>\n *       { isOpen && (\n *         <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n *           <Button variant=\"secondary\" onClick={ closeModal }>\n *             My custom close button\n *           </Button>\n *         </Modal>\n *       ) }\n *     </>\n *   );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"]}
+{"version":3,"sources":["@wordpress/components/src/modal/index.tsx"],"names":["classnames","createPortal","useCallback","useEffect","useRef","useState","forwardRef","useLayoutEffect","useInstanceId","useFocusReturn","useFocusOnMount","__experimentalUseFocusOutside","useFocusOutside","useConstrainedTabbing","useMergeRefs","__","close","getScrollContainer","ariaHelper","Button","StyleProvider","openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","focusOutsideProps","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","hasScrollableContent","setHasScrollableContent","isContentScrollable","current","closestScrollContainer","hideApp","document","body","classList","add","remove","showApp","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","scrollY","currentTarget","scrollTop"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver || ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel || __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<div ref={ childrenContainerRef }>{ children }</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n *   const [ isOpen, setOpen ] = useState( false );\n *   const openModal = () => setOpen( true );\n *   const closeModal = () => setOpen( false );\n *\n *   return (\n *     <>\n *       <Button variant=\"secondary\" onClick={ openModal }>\n *         Open Modal\n *       </Button>\n *       { isOpen && (\n *         <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n *           <Button variant=\"secondary\" onClick={ closeModal }>\n *             My custom close button\n *           </Button>\n *         </Modal>\n *       ) }\n *     </>\n *   );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"]}

package/build-module/navigator/context.js

@@ -9,7 +9,11 @@ import { createContext } from '@wordpress/element';
 const initialContextValue = {
   location: {},
   goTo: () => {},
-  goBack: () => {}
+  goBack: () => {},
+  goToParent: () => {},
+  addScreen: () => {},
+  removeScreen: () => {},
+  params: {}
 };
 export const NavigatorContext = createContext(initialContextValue);
 //# sourceMappingURL=context.js.map

package/build-module/navigator/context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/navigator/context.ts"],"names":["createContext","initialContextValue","location","goTo","goBack","NavigatorContext"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,oBAA9B;AAEA;AACA;AACA;;AAGA,MAAMC,mBAAyC,GAAG;AACjDC,EAAAA,QAAQ,EAAE,EADuC;AAEjDC,EAAAA,IAAI,EAAE,MAAM,CAAE,CAFmC;AAGjDC,EAAAA,MAAM,EAAE,MAAM,CAAE;AAHiC,CAAlD;AAKA,OAAO,MAAMC,gBAAgB,GAAGL,aAAa,CAAEC,mBAAF,CAAtC","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { NavigatorContext as NavigatorContextType } from './types';\n\nconst initialContextValue: NavigatorContextType = {\n\tlocation: {},\n\tgoTo: () => {},\n\tgoBack: () => {},\n};\nexport const NavigatorContext = createContext( initialContextValue );\n"]}
+{"version":3,"sources":["@wordpress/components/src/navigator/context.ts"],"names":["createContext","initialContextValue","location","goTo","goBack","goToParent","addScreen","removeScreen","params","NavigatorContext"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,oBAA9B;AAEA;AACA;AACA;;AAGA,MAAMC,mBAAyC,GAAG;AACjDC,EAAAA,QAAQ,EAAE,EADuC;AAEjDC,EAAAA,IAAI,EAAE,MAAM,CAAE,CAFmC;AAGjDC,EAAAA,MAAM,EAAE,MAAM,CAAE,CAHiC;AAIjDC,EAAAA,UAAU,EAAE,MAAM,CAAE,CAJ6B;AAKjDC,EAAAA,SAAS,EAAE,MAAM,CAAE,CAL8B;AAMjDC,EAAAA,YAAY,EAAE,MAAM,CAAE,CAN2B;AAOjDC,EAAAA,MAAM,EAAE;AAPyC,CAAlD;AASA,OAAO,MAAMC,gBAAgB,GAAGT,aAAa,CAAEC,mBAAF,CAAtC","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { NavigatorContext as NavigatorContextType } from './types';\n\nconst initialContextValue: NavigatorContextType = {\n\tlocation: {},\n\tgoTo: () => {},\n\tgoBack: () => {},\n\tgoToParent: () => {},\n\taddScreen: () => {},\n\tremoveScreen: () => {},\n\tparams: {},\n};\nexport const NavigatorContext = createContext( initialContextValue );\n"]}

package/build-module/navigator/index.js

@@ -2,5 +2,6 @@ export { NavigatorProvider } from './navigator-provider';
 export { NavigatorScreen } from './navigator-screen';
 export { NavigatorButton } from './navigator-button';
 export { NavigatorBackButton } from './navigator-back-button';
+export { NavigatorToParentButton } from './navigator-to-parent-button';
 export { default as useNavigator } from './use-navigator';
 //# sourceMappingURL=index.js.map

package/build-module/navigator/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/navigator/index.ts"],"names":["NavigatorProvider","NavigatorScreen","NavigatorButton","NavigatorBackButton","default","useNavigator"],"mappings":"AAAA,SAASA,iBAAT,QAAkC,sBAAlC;AACA,SAASC,eAAT,QAAgC,oBAAhC;AACA,SAASC,eAAT,QAAgC,oBAAhC;AACA,SAASC,mBAAT,QAAoC,yBAApC;AACA,SAASC,OAAO,IAAIC,YAApB,QAAwC,iBAAxC","sourcesContent":["export { NavigatorProvider } from './navigator-provider';\nexport { NavigatorScreen } from './navigator-screen';\nexport { NavigatorButton } from './navigator-button';\nexport { NavigatorBackButton } from './navigator-back-button';\nexport { default as useNavigator } from './use-navigator';\n"]}
+{"version":3,"sources":["@wordpress/components/src/navigator/index.ts"],"names":["NavigatorProvider","NavigatorScreen","NavigatorButton","NavigatorBackButton","NavigatorToParentButton","default","useNavigator"],"mappings":"AAAA,SAASA,iBAAT,QAAkC,sBAAlC;AACA,SAASC,eAAT,QAAgC,oBAAhC;AACA,SAASC,eAAT,QAAgC,oBAAhC;AACA,SAASC,mBAAT,QAAoC,yBAApC;AACA,SAASC,uBAAT,QAAwC,8BAAxC;AACA,SAASC,OAAO,IAAIC,YAApB,QAAwC,iBAAxC","sourcesContent":["export { NavigatorProvider } from './navigator-provider';\nexport { NavigatorScreen } from './navigator-screen';\nexport { NavigatorButton } from './navigator-button';\nexport { NavigatorBackButton } from './navigator-back-button';\nexport { NavigatorToParentButton } from './navigator-to-parent-button';\nexport { default as useNavigator } from './use-navigator';\n"]}

package/build-module/navigator/navigator-back-button/hook.js

@@ -13,16 +13,24 @@ export function useNavigatorBackButton(props) {
   const {
     onClick,
     as = Button,
+    goToParent: goToParentProp = false,
     ...otherProps
   } = useContextSystem(props, 'NavigatorBackButton');
   const {
-    goBack
+    goBack,
+    goToParent
   } = useNavigator();
   const handleClick = useCallback(e => {
     e.preventDefault();
-    goBack();
+
+    if (goToParentProp) {
+      goToParent();
+    } else {
+      goBack();
+    }
+
     onClick === null || onClick === void 0 ? void 0 : onClick(e);
-  }, [goBack, onClick]);
+  }, [goToParentProp, goToParent, goBack, onClick]);
   return {
     as,
     onClick: handleClick,

package/build-module/navigator/navigator-back-button/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/hook.ts"],"names":["useCallback","useContextSystem","Button","useNavigator","useNavigatorBackButton","props","onClick","as","otherProps","goBack","handleClick","e","preventDefault"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAT,QAA4B,oBAA5B;AAEA;AACA;AACA;;AACA,SAASC,gBAAT,QAA0D,kBAA1D;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AAGA,OAAO,SAASC,sBAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,OADK;AAELC,IAAAA,EAAE,GAAGL,MAFA;AAGL,OAAGM;AAHE,MAIFP,gBAAgB,CAAEI,KAAF,EAAS,qBAAT,CAJpB;AAMA,QAAM;AAAEI,IAAAA;AAAF,MAAaN,YAAY,EAA/B;AACA,QAAMO,WAAyD,GAC9DV,WAAW,CACRW,CAAF,IAAS;AACRA,IAAAA,CAAC,CAACC,cAAF;AACAH,IAAAA,MAAM;AACNH,IAAAA,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAIK,CAAJ,CAAP;AACA,GALS,EAMV,CAAEF,MAAF,EAAUH,OAAV,CANU,CADZ;AAUA,SAAO;AACNC,IAAAA,EADM;AAEND,IAAAA,OAAO,EAAEI,WAFH;AAGN,OAAGF;AAHG,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport Button from '../../button';\nimport useNavigator from '../use-navigator';\nimport type { NavigatorBackButtonProps } from '../types';\n\nexport function useNavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonProps, 'button' >\n) {\n\tconst {\n\t\tonClick,\n\t\tas = Button,\n\t\t...otherProps\n\t} = useContextSystem( props, 'NavigatorBackButton' );\n\n\tconst { goBack } = useNavigator();\n\tconst handleClick: React.MouseEventHandler< HTMLButtonElement > =\n\t\tuseCallback(\n\t\t\t( e ) => {\n\t\t\t\te.preventDefault();\n\t\t\t\tgoBack();\n\t\t\t\tonClick?.( e );\n\t\t\t},\n\t\t\t[ goBack, onClick ]\n\t\t);\n\n\treturn {\n\t\tas,\n\t\tonClick: handleClick,\n\t\t...otherProps,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/hook.ts"],"names":["useCallback","useContextSystem","Button","useNavigator","useNavigatorBackButton","props","onClick","as","goToParent","goToParentProp","otherProps","goBack","handleClick","e","preventDefault"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,WAAT,QAA4B,oBAA5B;AAEA;AACA;AACA;;AACA,SAASC,gBAAT,QAA0D,kBAA1D;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AAGA,OAAO,SAASC,sBAAT,CACNC,KADM,EAEL;AACD,QAAM;AACLC,IAAAA,OADK;AAELC,IAAAA,EAAE,GAAGL,MAFA;AAGLM,IAAAA,UAAU,EAAEC,cAAc,GAAG,KAHxB;AAIL,OAAGC;AAJE,MAKFT,gBAAgB,CAAEI,KAAF,EAAS,qBAAT,CALpB;AAOA,QAAM;AAAEM,IAAAA,MAAF;AAAUH,IAAAA;AAAV,MAAyBL,YAAY,EAA3C;AACA,QAAMS,WAAyD,GAC9DZ,WAAW,CACRa,CAAF,IAAS;AACRA,IAAAA,CAAC,CAACC,cAAF;;AACA,QAAKL,cAAL,EAAsB;AACrBD,MAAAA,UAAU;AACV,KAFD,MAEO;AACNG,MAAAA,MAAM;AACN;;AACDL,IAAAA,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAIO,CAAJ,CAAP;AACA,GATS,EAUV,CAAEJ,cAAF,EAAkBD,UAAlB,EAA8BG,MAA9B,EAAsCL,OAAtC,CAVU,CADZ;AAcA,SAAO;AACNC,IAAAA,EADM;AAEND,IAAAA,OAAO,EAAEM,WAFH;AAGN,OAAGF;AAHG,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport Button from '../../button';\nimport useNavigator from '../use-navigator';\nimport type { NavigatorBackButtonHookProps } from '../types';\n\nexport function useNavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonHookProps, 'button' >\n) {\n\tconst {\n\t\tonClick,\n\t\tas = Button,\n\t\tgoToParent: goToParentProp = false,\n\t\t...otherProps\n\t} = useContextSystem( props, 'NavigatorBackButton' );\n\n\tconst { goBack, goToParent } = useNavigator();\n\tconst handleClick: React.MouseEventHandler< HTMLButtonElement > =\n\t\tuseCallback(\n\t\t\t( e ) => {\n\t\t\t\te.preventDefault();\n\t\t\t\tif ( goToParentProp ) {\n\t\t\t\t\tgoToParent();\n\t\t\t\t} else {\n\t\t\t\t\tgoBack();\n\t\t\t\t}\n\t\t\t\tonClick?.( e );\n\t\t\t},\n\t\t\t[ goToParentProp, goToParent, goBack, onClick ]\n\t\t);\n\n\treturn {\n\t\tas,\n\t\tonClick: handleClick,\n\t\t...otherProps,\n\t};\n}\n"]}

package/build-module/navigator/navigator-provider/component.js

@@ -11,7 +11,8 @@ import { css } from '@emotion/react';
  * WordPress dependencies
  */
 
-import { useMemo, useState, useCallback } from '@wordpress/element';
+import { useMemo, useState, useCallback, useReducer, useRef, useEffect } from '@wordpress/element';
+import isShallowEqual from '@wordpress/is-shallow-equal';
 /**
  * Internal dependencies
  */
@@ -20,6 +21,23 @@ import { contextConnect, useContextSystem } from '../../ui/context';
 import { useCx } from '../../utils/hooks/use-cx';
 import { View } from '../../view';
 import { NavigatorContext } from '../context';
+import { patternMatch, findParent } from '../utils/router';
+const MAX_HISTORY_LENGTH = 50;
+
+function screensReducer() {
+  let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  let action = arguments.length > 1 ? arguments[1] : undefined;
+
+  switch (action.type) {
+    case 'add':
+      return [...state, action.screen];
+
+    case 'remove':
+      return state.filter(s => s.id !== action.screen.id);
+  }
+
+  return state;
+}
 
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "15bx5k",
@@ -27,7 +45,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
 } : {
   name: "192ebb7-classes",
   styles: "overflow-x:hidden;label:classes;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvbmF2aWdhdG9yL25hdmlnYXRvci1wcm92aWRlci9jb21wb25lbnQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlGWSIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL25hdmlnYXRvci9uYXZpZ2F0b3ItcHJvdmlkZXIvY29tcG9uZW50LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB0eXBlIHsgRm9yd2FyZGVkUmVmIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbywgdXNlU3RhdGUsIHVzZUNhbGxiYWNrIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHtcblx0Y29udGV4dENvbm5lY3QsXG5cdHVzZUNvbnRleHRTeXN0ZW0sXG5cdFdvcmRQcmVzc0NvbXBvbmVudFByb3BzLFxufSBmcm9tICcuLi8uLi91aS9jb250ZXh0JztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcbmltcG9ydCB7IFZpZXcgfSBmcm9tICcuLi8uLi92aWV3JztcbmltcG9ydCB7IE5hdmlnYXRvckNvbnRleHQgfSBmcm9tICcuLi9jb250ZXh0JztcbmltcG9ydCB0eXBlIHtcblx0TmF2aWdhdG9yUHJvdmlkZXJQcm9wcyxcblx0TmF2aWdhdG9yTG9jYXRpb24sXG5cdE5hdmlnYXRvckNvbnRleHQgYXMgTmF2aWdhdG9yQ29udGV4dFR5cGUsXG59IGZyb20gJy4uL3R5cGVzJztcblxuZnVuY3Rpb24gVW5jb25uZWN0ZWROYXZpZ2F0b3JQcm92aWRlcihcblx0cHJvcHM6IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzPCBOYXZpZ2F0b3JQcm92aWRlclByb3BzLCAnZGl2JyA+LFxuXHRmb3J3YXJkZWRSZWY6IEZvcndhcmRlZFJlZjwgYW55ID5cbikge1xuXHRjb25zdCB7IGluaXRpYWxQYXRoLCBjaGlsZHJlbiwgY2xhc3NOYW1lLCAuLi5vdGhlclByb3BzIH0gPVxuXHRcdHVzZUNvbnRleHRTeXN0ZW0oIHByb3BzLCAnTmF2aWdhdG9yUHJvdmlkZXInICk7XG5cblx0Y29uc3QgWyBsb2NhdGlvbkhpc3RvcnksIHNldExvY2F0aW9uSGlzdG9yeSBdID0gdXNlU3RhdGU8XG5cdFx0TmF2aWdhdG9yTG9jYXRpb25bXVxuXHQ+KCBbXG5cdFx0e1xuXHRcdFx0cGF0aDogaW5pdGlhbFBhdGgsXG5cdFx0fSxcblx0XSApO1xuXG5cdGNvbnN0IGdvVG86IE5hdmlnYXRvckNvbnRleHRUeXBlWyAnZ29UbycgXSA9IHVzZUNhbGxiYWNrKFxuXHRcdCggcGF0aCwgb3B0aW9ucyA9IHt9ICkgPT4ge1xuXHRcdFx0c2V0TG9jYXRpb25IaXN0b3J5KCAoIHByZXZMb2NhdGlvbkhpc3RvcnkgKSA9PiBbXG5cdFx0XHRcdC4uLnByZXZMb2NhdGlvbkhpc3RvcnksXG5cdFx0XHRcdHtcblx0XHRcdFx0XHQuLi5vcHRpb25zLFxuXHRcdFx0XHRcdHBhdGgsXG5cdFx0XHRcdFx0aXNCYWNrOiBmYWxzZSxcblx0XHRcdFx0XHRoYXNSZXN0b3JlZEZvY3VzOiBmYWxzZSxcblx0XHRcdFx0fSxcblx0XHRcdF0gKTtcblx0XHR9LFxuXHRcdFtdXG5cdCk7XG5cblx0Y29uc3QgZ29CYWNrOiBOYXZpZ2F0b3JDb250ZXh0VHlwZVsgJ2dvQmFjaycgXSA9IHVzZUNhbGxiYWNrKCAoKSA9PiB7XG5cdFx0c2V0TG9jYXRpb25IaXN0b3J5KCAoIHByZXZMb2NhdGlvbkhpc3RvcnkgKSA9PiB7XG5cdFx0XHRpZiAoIHByZXZMb2NhdGlvbkhpc3RvcnkubGVuZ3RoIDw9IDEgKSB7XG5cdFx0XHRcdHJldHVybiBwcmV2TG9jYXRpb25IaXN0b3J5O1xuXHRcdFx0fVxuXHRcdFx0cmV0dXJuIFtcblx0XHRcdFx0Li4ucHJldkxvY2F0aW9uSGlzdG9yeS5zbGljZSggMCwgLTIgKSxcblx0XHRcdFx0e1xuXHRcdFx0XHRcdC4uLnByZXZMb2NhdGlvbkhpc3RvcnlbIHByZXZMb2NhdGlvbkhpc3RvcnkubGVuZ3RoIC0gMiBdLFxuXHRcdFx0XHRcdGlzQmFjazogdHJ1ZSxcblx0XHRcdFx0XHRoYXNSZXN0b3JlZEZvY3VzOiBmYWxzZSxcblx0XHRcdFx0fSxcblx0XHRcdF07XG5cdFx0fSApO1xuXHR9LCBbXSApO1xuXG5cdGNvbnN0IG5hdmlnYXRvckNvbnRleHRWYWx1ZTogTmF2aWdhdG9yQ29udGV4dFR5cGUgPSB1c2VNZW1vKFxuXHRcdCgpID0+ICgge1xuXHRcdFx0bG9jYXRpb246IHtcblx0XHRcdFx0Li4ubG9jYXRpb25IaXN0b3J5WyBsb2NhdGlvbkhpc3RvcnkubGVuZ3RoIC0gMSBdLFxuXHRcdFx0XHRpc0luaXRpYWw6IGxvY2F0aW9uSGlzdG9yeS5sZW5ndGggPT09IDEsXG5cdFx0XHR9LFxuXHRcdFx0Z29Ubyxcblx0XHRcdGdvQmFjayxcblx0XHR9ICksXG5cdFx0WyBsb2NhdGlvbkhpc3RvcnksIGdvVG8sIGdvQmFjayBdXG5cdCk7XG5cblx0Y29uc3QgY3ggPSB1c2VDeCgpO1xuXHRjb25zdCBjbGFzc2VzID0gdXNlTWVtbyhcblx0XHQvLyBQcmV2ZW50cyBob3Jpem9udGFsIG92ZXJmbG93IHdoaWxlIGFuaW1hdGluZyBzY3JlZW4gdHJhbnNpdGlvbnMuXG5cdFx0KCkgPT4gY3goIGNzcyggeyBvdmVyZmxvd1g6ICdoaWRkZW4nIH0gKSwgY2xhc3NOYW1lICksXG5cdFx0WyBjbGFzc05hbWUsIGN4IF1cblx0KTtcblxuXHRyZXR1cm4gKFxuXHRcdDxWaWV3IHJlZj17IGZvcndhcmRlZFJlZiB9IGNsYXNzTmFtZT17IGNsYXNzZXMgfSB7IC4uLm90aGVyUHJvcHMgfT5cblx0XHRcdDxOYXZpZ2F0b3JDb250ZXh0LlByb3ZpZGVyIHZhbHVlPXsgbmF2aWdhdG9yQ29udGV4dFZhbHVlIH0+XG5cdFx0XHRcdHsgY2hpbGRyZW4gfVxuXHRcdFx0PC9OYXZpZ2F0b3JDb250ZXh0LlByb3ZpZGVyPlxuXHRcdDwvVmlldz5cblx0KTtcbn1cblxuLyoqXG4gKiBUaGUgYE5hdmlnYXRvclByb3ZpZGVyYCBjb21wb25lbnQgYWxsb3dzIHJlbmRlcmluZyBuZXN0ZWQgdmlld3MvcGFuZWxzL21lbnVzXG4gKiAodmlhIHRoZSBgTmF2aWdhdG9yU2NyZWVuYCBjb21wb25lbnQgYW5kIG5hdmlnYXRlIGJldHdlZW4gdGhlc2UgZGlmZmVyZW50XG4gKiB2aWV3ICh2aWEgdGhlIGBOYXZpZ2F0b3JCdXR0b25gIGFuZCBgTmF2aWdhdG9yQmFja0J1dHRvbmAgY29tcG9uZW50cyBvciB0aGVcbiAqIGB1c2VOYXZpZ2F0b3JgIGhvb2spLlxuICpcbiAqIEBleGFtcGxlXG4gKiBgYGBqc3hcbiAqIGltcG9ydCB7XG4gKiAgIF9fZXhwZXJpbWVudGFsTmF2aWdhdG9yUHJvdmlkZXIgYXMgTmF2aWdhdG9yUHJvdmlkZXIsXG4gKiAgIF9fZXhwZXJpbWVudGFsTmF2aWdhdG9yU2NyZWVuIGFzIE5hdmlnYXRvclNjcmVlbixcbiAqICAgX19leHBlcmltZW50YWxOYXZpZ2F0b3JCdXR0b24gYXMgTmF2aWdhdG9yQnV0dG9uLFxuICogICBfX2V4cGVyaW1lbnRhbE5hdmlnYXRvckJhY2tCdXR0b24gYXMgTmF2aWdhdG9yQmFja0J1dHRvbixcbiAqIH0gZnJvbSAnQHdvcmRwcmVzcy9jb21wb25lbnRzJztcbiAqXG4gKiBjb25zdCBNeU5hdmlnYXRpb24gPSAoKSA9PiAoXG4gKiAgIDxOYXZpZ2F0b3JQcm92aWRlciBpbml0aWFsUGF0aD1cIi9cIj5cbiAqICAgICA8TmF2aWdhdG9yU2NyZWVuIHBhdGg9XCIvXCI+XG4gKiAgICAgICA8cD5UaGlzIGlzIHRoZSBob21lIHNjcmVlbi48L3A+XG4gKiAgICAgICAgPE5hdmlnYXRvckJ1dHRvbiBwYXRoPVwiL2NoaWxkXCI+XG4gKiAgICAgICAgICBOYXZpZ2F0ZSB0byBjaGlsZCBzY3JlZW4uXG4gKiAgICAgICA8L05hdmlnYXRvckJ1dHRvbj5cbiAqICAgICA8L05hdmlnYXRvclNjcmVlbj5cbiAqXG4gKiAgICAgPE5hdmlnYXRvclNjcmVlbiBwYXRoPVwiL2NoaWxkXCI+XG4gKiAgICAgICA8cD5UaGlzIGlzIHRoZSBjaGlsZCBzY3JlZW4uPC9wPlxuICogICAgICAgPE5hdmlnYXRvckJhY2tCdXR0b24+XG4gKiAgICAgICAgIEdvIGJhY2tcbiAqICAgICAgIDwvTmF2aWdhdG9yQmFja0J1dHRvbj5cbiAqICAgICA8L05hdmlnYXRvclNjcmVlbj5cbiAqICAgPC9OYXZpZ2F0b3JQcm92aWRlcj5cbiAqICk7XG4gKiBgYGBcbiAqL1xuZXhwb3J0IGNvbnN0IE5hdmlnYXRvclByb3ZpZGVyID0gY29udGV4dENvbm5lY3QoXG5cdFVuY29ubmVjdGVkTmF2aWdhdG9yUHJvdmlkZXIsXG5cdCdOYXZpZ2F0b3JQcm92aWRlcidcbik7XG5cbmV4cG9ydCBkZWZhdWx0IE5hdmlnYXRvclByb3ZpZGVyO1xuIl19 */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvbmF2aWdhdG9yL25hdmlnYXRvci1wcm92aWRlci9jb21wb25lbnQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFQWSIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL25hdmlnYXRvci9uYXZpZ2F0b3ItcHJvdmlkZXIvY29tcG9uZW50LnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB0eXBlIHsgRm9yd2FyZGVkUmVmIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHtcblx0dXNlTWVtbyxcblx0dXNlU3RhdGUsXG5cdHVzZUNhbGxiYWNrLFxuXHR1c2VSZWR1Y2VyLFxuXHR1c2VSZWYsXG5cdHVzZUVmZmVjdCxcbn0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcbmltcG9ydCBpc1NoYWxsb3dFcXVhbCBmcm9tICdAd29yZHByZXNzL2lzLXNoYWxsb3ctZXF1YWwnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQge1xuXHRjb250ZXh0Q29ubmVjdCxcblx0dXNlQ29udGV4dFN5c3RlbSxcblx0V29yZFByZXNzQ29tcG9uZW50UHJvcHMsXG59IGZyb20gJy4uLy4uL3VpL2NvbnRleHQnO1xuaW1wb3J0IHsgdXNlQ3ggfSBmcm9tICcuLi8uLi91dGlscy9ob29rcy91c2UtY3gnO1xuaW1wb3J0IHsgVmlldyB9IGZyb20gJy4uLy4uL3ZpZXcnO1xuaW1wb3J0IHsgTmF2aWdhdG9yQ29udGV4dCB9IGZyb20gJy4uL2NvbnRleHQnO1xuaW1wb3J0IHR5cGUge1xuXHROYXZpZ2F0b3JQcm92aWRlclByb3BzLFxuXHROYXZpZ2F0b3JMb2NhdGlvbixcblx0TmF2aWdhdG9yQ29udGV4dCBhcyBOYXZpZ2F0b3JDb250ZXh0VHlwZSxcblx0U2NyZWVuLFxufSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBwYXR0ZXJuTWF0Y2gsIGZpbmRQYXJlbnQgfSBmcm9tICcuLi91dGlscy9yb3V0ZXInO1xuXG50eXBlIE1hdGNoZWRQYXRoID0gUmV0dXJuVHlwZTwgdHlwZW9mIHBhdHRlcm5NYXRjaCA+O1xudHlwZSBTY3JlZW5BY3Rpb24gPSB7IHR5cGU6IHN0cmluZzsgc2NyZWVuOiBTY3JlZW4gfTtcblxuY29uc3QgTUFYX0hJU1RPUllfTEVOR1RIID0gNTA7XG5cbmZ1bmN0aW9uIHNjcmVlbnNSZWR1Y2VyKFxuXHRzdGF0ZTogU2NyZWVuW10gPSBbXSxcblx0YWN0aW9uOiBTY3JlZW5BY3Rpb25cbik6IFNjcmVlbltdIHtcblx0c3dpdGNoICggYWN0aW9uLnR5cGUgKSB7XG5cdFx0Y2FzZSAnYWRkJzpcblx0XHRcdHJldHVybiBbIC4uLnN0YXRlLCBhY3Rpb24uc2NyZWVuIF07XG5cdFx0Y2FzZSAncmVtb3ZlJzpcblx0XHRcdHJldHVybiBzdGF0ZS5maWx0ZXIoICggczogU2NyZWVuICkgPT4gcy5pZCAhPT0gYWN0aW9uLnNjcmVlbi5pZCApO1xuXHR9XG5cblx0cmV0dXJuIHN0YXRlO1xufVxuXG5mdW5jdGlvbiBVbmNvbm5lY3RlZE5hdmlnYXRvclByb3ZpZGVyKFxuXHRwcm9wczogV29yZFByZXNzQ29tcG9uZW50UHJvcHM8IE5hdmlnYXRvclByb3ZpZGVyUHJvcHMsICdkaXYnID4sXG5cdGZvcndhcmRlZFJlZjogRm9yd2FyZGVkUmVmPCBhbnkgPlxuKSB7XG5cdGNvbnN0IHsgaW5pdGlhbFBhdGgsIGNoaWxkcmVuLCBjbGFzc05hbWUsIC4uLm90aGVyUHJvcHMgfSA9XG5cdFx0dXNlQ29udGV4dFN5c3RlbSggcHJvcHMsICdOYXZpZ2F0b3JQcm92aWRlcicgKTtcblxuXHRjb25zdCBbIGxvY2F0aW9uSGlzdG9yeSwgc2V0TG9jYXRpb25IaXN0b3J5IF0gPSB1c2VTdGF0ZTxcblx0XHROYXZpZ2F0b3JMb2NhdGlvbltdXG5cdD4oIFtcblx0XHR7XG5cdFx0XHRwYXRoOiBpbml0aWFsUGF0aCxcblx0XHR9LFxuXHRdICk7XG5cdGNvbnN0IGN1cnJlbnRMb2NhdGlvbkhpc3RvcnkgPSB1c2VSZWY8IE5hdmlnYXRvckxvY2F0aW9uW10gPiggW10gKTtcblx0Y29uc3QgWyBzY3JlZW5zLCBkaXNwYXRjaCBdID0gdXNlUmVkdWNlciggc2NyZWVuc1JlZHVjZXIsIFtdICk7XG5cdGNvbnN0IGN1cnJlbnRTY3JlZW5zID0gdXNlUmVmPCBTY3JlZW5bXSA+KCBbXSApO1xuXHR1c2VFZmZlY3QoICgpID0+IHtcblx0XHRjdXJyZW50U2NyZWVucy5jdXJyZW50ID0gc2NyZWVucztcblx0fSwgWyBzY3JlZW5zIF0gKTtcblx0dXNlRWZmZWN0KCAoKSA9PiB7XG5cdFx0Y3VycmVudExvY2F0aW9uSGlzdG9yeS5jdXJyZW50ID0gbG9jYXRpb25IaXN0b3J5O1xuXHR9LCBbIGxvY2F0aW9uSGlzdG9yeSBdICk7XG5cdGNvbnN0IGN1cnJlbnRNYXRjaCA9IHVzZVJlZjwgTWF0Y2hlZFBhdGggPigpO1xuXHRjb25zdCBtYXRjaGVkUGF0aCA9IHVzZU1lbW8oICgpID0+IHtcblx0XHRsZXQgY3VycmVudFBhdGg6IHN0cmluZyB8IHVuZGVmaW5lZDtcblx0XHRpZiAoXG5cdFx0XHRsb2NhdGlvbkhpc3RvcnkubGVuZ3RoID09PSAwIHx8XG5cdFx0XHQoIGN1cnJlbnRQYXRoID1cblx0XHRcdFx0bG9jYXRpb25IaXN0b3J5WyBsb2NhdGlvbkhpc3RvcnkubGVuZ3RoIC0gMSBdLnBhdGggKSA9PT1cblx0XHRcdFx0dW5kZWZpbmVkXG5cdFx0KSB7XG5cdFx0XHRjdXJyZW50TWF0Y2guY3VycmVudCA9IHVuZGVmaW5lZDtcblx0XHRcdHJldHVybiB1bmRlZmluZWQ7XG5cdFx0fVxuXG5cdFx0Y29uc3QgcmVzb2x2ZVBhdGggPSAoIHBhdGg6IHN0cmluZyApID0+IHtcblx0XHRcdGNvbnN0IG5ld01hdGNoID0gcGF0dGVybk1hdGNoKCBwYXRoLCBzY3JlZW5zICk7XG5cblx0XHRcdC8vIElmIHRoZSBuZXcgbWF0Y2ggaXMgdGhlIHNhbWUgYXMgdGhlIGN1cnJlbnQgbWF0Y2gsXG5cdFx0XHQvLyByZXR1cm4gdGhlIHByZXZpb3VzIG9uZSBmb3IgcGVyZm9ybWFuY2UgcmVhc29ucy5cblx0XHRcdGlmIChcblx0XHRcdFx0Y3VycmVudE1hdGNoLmN1cnJlbnQgJiZcblx0XHRcdFx0bmV3TWF0Y2ggJiZcblx0XHRcdFx0aXNTaGFsbG93RXF1YWwoXG5cdFx0XHRcdFx0bmV3TWF0Y2gucGFyYW1zLFxuXHRcdFx0XHRcdGN1cnJlbnRNYXRjaC5jdXJyZW50LnBhcmFtc1xuXHRcdFx0XHQpICYmXG5cdFx0XHRcdG5ld01hdGNoLmlkID09PSBjdXJyZW50TWF0Y2guY3VycmVudC5pZFxuXHRcdFx0KSB7XG5cdFx0XHRcdHJldHVybiBjdXJyZW50TWF0Y2guY3VycmVudDtcblx0XHRcdH1cblxuXHRcdFx0cmV0dXJuIG5ld01hdGNoO1xuXHRcdH07XG5cblx0XHRjb25zdCBuZXdNYXRjaCA9IHJlc29sdmVQYXRoKCBjdXJyZW50UGF0aCApO1xuXHRcdGN1cnJlbnRNYXRjaC5jdXJyZW50ID0gbmV3TWF0Y2g7XG5cdFx0cmV0dXJuIG5ld01hdGNoO1xuXHR9LCBbIHNjcmVlbnMsIGxvY2F0aW9uSGlzdG9yeSBdICk7XG5cblx0Y29uc3QgYWRkU2NyZWVuID0gdXNlQ2FsbGJhY2soXG5cdFx0KCBzY3JlZW46IFNjcmVlbiApID0+IGRpc3BhdGNoKCB7IHR5cGU6ICdhZGQnLCBzY3JlZW4gfSApLFxuXHRcdFtdXG5cdCk7XG5cblx0Y29uc3QgcmVtb3ZlU2NyZWVuID0gdXNlQ2FsbGJhY2soXG5cdFx0KCBzY3JlZW46IFNjcmVlbiApID0+IGRpc3BhdGNoKCB7IHR5cGU6ICdyZW1vdmUnLCBzY3JlZW4gfSApLFxuXHRcdFtdXG5cdCk7XG5cblx0Y29uc3QgZ29CYWNrOiBOYXZpZ2F0b3JDb250ZXh0VHlwZVsgJ2dvQmFjaycgXSA9IHVzZUNhbGxiYWNrKCAoKSA9PiB7XG5cdFx0c2V0TG9jYXRpb25IaXN0b3J5KCAoIHByZXZMb2NhdGlvbkhpc3RvcnkgKSA9PiB7XG5cdFx0XHRpZiAoIHByZXZMb2NhdGlvbkhpc3RvcnkubGVuZ3RoIDw9IDEgKSB7XG5cdFx0XHRcdHJldHVybiBwcmV2TG9jYXRpb25IaXN0b3J5O1xuXHRcdFx0fVxuXHRcdFx0cmV0dXJuIFtcblx0XHRcdFx0Li4ucHJldkxvY2F0aW9uSGlzdG9yeS5zbGljZSggMCwgLTIgKSxcblx0XHRcdFx0e1xuXHRcdFx0XHRcdC4uLnByZXZMb2NhdGlvbkhpc3RvcnlbIHByZXZMb2NhdGlvbkhpc3RvcnkubGVuZ3RoIC0gMiBdLFxuXHRcdFx0XHRcdGlzQmFjazogdHJ1ZSxcblx0XHRcdFx0XHRoYXNSZXN0b3JlZEZvY3VzOiBmYWxzZSxcblx0XHRcdFx0fSxcblx0XHRcdF07XG5cdFx0fSApO1xuXHR9LCBbXSApO1xuXG5cdGNvbnN0IGdvVG86IE5hdmlnYXRvckNvbnRleHRUeXBlWyAnZ29UbycgXSA9IHVzZUNhbGxiYWNrKFxuXHRcdCggcGF0aCwgb3B0aW9ucyA9IHt9ICkgPT4ge1xuXHRcdFx0Y29uc3Qge1xuXHRcdFx0XHRmb2N1c1RhcmdldFNlbGVjdG9yLFxuXHRcdFx0XHRpc0JhY2sgPSBmYWxzZSxcblx0XHRcdFx0Li4ucmVzdE9wdGlvbnNcblx0XHRcdH0gPSBvcHRpb25zO1xuXG5cdFx0XHRjb25zdCBpc05hdmlnYXRpbmdUb1ByZXZpb3VzUGF0aCA9XG5cdFx0XHRcdGlzQmFjayAmJlxuXHRcdFx0XHRjdXJyZW50TG9jYXRpb25IaXN0b3J5LmN1cnJlbnQubGVuZ3RoID4gMSAmJlxuXHRcdFx0XHRjdXJyZW50TG9jYXRpb25IaXN0b3J5LmN1cnJlbnRbXG5cdFx0XHRcdFx0Y3VycmVudExvY2F0aW9uSGlzdG9yeS5jdXJyZW50Lmxlbmd0aCAtIDJcblx0XHRcdFx0XS5wYXRoID09PSBwYXRoO1xuXG5cdFx0XHRpZiAoIGlzTmF2aWdhdGluZ1RvUHJldmlvdXNQYXRoICkge1xuXHRcdFx0XHRnb0JhY2soKTtcblx0XHRcdFx0cmV0dXJuO1xuXHRcdFx0fVxuXG5cdFx0XHRzZXRMb2NhdGlvbkhpc3RvcnkoICggcHJldkxvY2F0aW9uSGlzdG9yeSApID0+IHtcblx0XHRcdFx0Y29uc3QgbmV3TG9jYXRpb24gPSB7XG5cdFx0XHRcdFx0Li4ucmVzdE9wdGlvbnMsXG5cdFx0XHRcdFx0cGF0aCxcblx0XHRcdFx0XHRpc0JhY2ssXG5cdFx0XHRcdFx0aGFzUmVzdG9yZWRGb2N1czogZmFsc2UsXG5cdFx0XHRcdH07XG5cblx0XHRcdFx0aWYgKCBwcmV2TG9jYXRpb25IaXN0b3J5Lmxlbmd0aCA8IDEgKSB7XG5cdFx0XHRcdFx0cmV0dXJuIFsgbmV3TG9jYXRpb24gXTtcblx0XHRcdFx0fVxuXG5cdFx0XHRcdHJldHVybiBbXG5cdFx0XHRcdFx0Li4ucHJldkxvY2F0aW9uSGlzdG9yeS5zbGljZShcblx0XHRcdFx0XHRcdHByZXZMb2NhdGlvbkhpc3RvcnkubGVuZ3RoID4gTUFYX0hJU1RPUllfTEVOR1RIIC0gMVxuXHRcdFx0XHRcdFx0XHQ/IDFcblx0XHRcdFx0XHRcdFx0OiAwLFxuXHRcdFx0XHRcdFx0LTFcblx0XHRcdFx0XHQpLFxuXHRcdFx0XHRcdC8vIEFzc2lnbiBgZm9jdXNUYXJnZXRTZWxlY3RvcmAgdG8gdGhlIHByZXZpb3VzIGxvY2F0aW9uIGluIGhpc3Rvcnlcblx0XHRcdFx0XHQvLyAodGhlIG9uZSB3ZSBqdXN0IG5hdmlnYXRlZCBmcm9tKS5cblx0XHRcdFx0XHR7XG5cdFx0XHRcdFx0XHQuLi5wcmV2TG9jYXRpb25IaXN0b3J5W1xuXHRcdFx0XHRcdFx0XHRwcmV2TG9jYXRpb25IaXN0b3J5Lmxlbmd0aCAtIDFcblx0XHRcdFx0XHRcdF0sXG5cdFx0XHRcdFx0XHRmb2N1c1RhcmdldFNlbGVjdG9yLFxuXHRcdFx0XHRcdH0sXG5cdFx0XHRcdFx0bmV3TG9jYXRpb24sXG5cdFx0XHRcdF07XG5cdFx0XHR9ICk7XG5cdFx0fSxcblx0XHRbIGdvQmFjayBdXG5cdCk7XG5cblx0Y29uc3QgZ29Ub1BhcmVudDogTmF2aWdhdG9yQ29udGV4dFR5cGVbICdnb1RvUGFyZW50JyBdID1cblx0XHR1c2VDYWxsYmFjayggKCkgPT4ge1xuXHRcdFx0Y29uc3QgY3VycmVudFBhdGggPVxuXHRcdFx0XHRjdXJyZW50TG9jYXRpb25IaXN0b3J5LmN1cnJlbnRbXG5cdFx0XHRcdFx0Y3VycmVudExvY2F0aW9uSGlzdG9yeS5jdXJyZW50Lmxlbmd0aCAtIDFcblx0XHRcdFx0XS5wYXRoO1xuXHRcdFx0aWYgKCBjdXJyZW50UGF0aCA9PT0gdW5kZWZpbmVkICkge1xuXHRcdFx0XHRyZXR1cm47XG5cdFx0XHR9XG5cdFx0XHRjb25zdCBwYXJlbnRQYXRoID0gZmluZFBhcmVudChcblx0XHRcdFx0Y3VycmVudFBhdGgsXG5cdFx0XHRcdGN1cnJlbnRTY3JlZW5zLmN1cnJlbnRcblx0XHRcdCk7XG5cdFx0XHRpZiAoIHBhcmVudFBhdGggPT09IHVuZGVmaW5lZCApIHtcblx0XHRcdFx0cmV0dXJuO1xuXHRcdFx0fVxuXHRcdFx0Z29UbyggcGFyZW50UGF0aCwgeyBpc0JhY2s6IHRydWUgfSApO1xuXHRcdH0sIFsgZ29UbyBdICk7XG5cblx0Y29uc3QgbmF2aWdhdG9yQ29udGV4dFZhbHVlOiBOYXZpZ2F0b3JDb250ZXh0VHlwZSA9IHVzZU1lbW8oXG5cdFx0KCkgPT4gKCB7XG5cdFx0XHRsb2NhdGlvbjoge1xuXHRcdFx0XHQuLi5sb2NhdGlvbkhpc3RvcnlbIGxvY2F0aW9uSGlzdG9yeS5sZW5ndGggLSAxIF0sXG5cdFx0XHRcdGlzSW5pdGlhbDogbG9jYXRpb25IaXN0b3J5Lmxlbmd0aCA9PT0gMSxcblx0XHRcdH0sXG5cdFx0XHRwYXJhbXM6IG1hdGNoZWRQYXRoID8gbWF0Y2hlZFBhdGgucGFyYW1zIDoge30sXG5cdFx0XHRtYXRjaDogbWF0Y2hlZFBhdGggPyBtYXRjaGVkUGF0aC5pZCA6IHVuZGVmaW5lZCxcblx0XHRcdGdvVG8sXG5cdFx0XHRnb0JhY2ssXG5cdFx0XHRnb1RvUGFyZW50LFxuXHRcdFx0YWRkU2NyZWVuLFxuXHRcdFx0cmVtb3ZlU2NyZWVuLFxuXHRcdH0gKSxcblx0XHRbXG5cdFx0XHRsb2NhdGlvbkhpc3RvcnksXG5cdFx0XHRtYXRjaGVkUGF0aCxcblx0XHRcdGdvVG8sXG5cdFx0XHRnb0JhY2ssXG5cdFx0XHRnb1RvUGFyZW50LFxuXHRcdFx0YWRkU2NyZWVuLFxuXHRcdFx0cmVtb3ZlU2NyZWVuLFxuXHRcdF1cblx0KTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cdGNvbnN0IGNsYXNzZXMgPSB1c2VNZW1vKFxuXHRcdC8vIFByZXZlbnRzIGhvcml6b250YWwgb3ZlcmZsb3cgd2hpbGUgYW5pbWF0aW5nIHNjcmVlbiB0cmFuc2l0aW9ucy5cblx0XHQoKSA9PiBjeCggY3NzKCB7IG92ZXJmbG93WDogJ2hpZGRlbicgfSApLCBjbGFzc05hbWUgKSxcblx0XHRbIGNsYXNzTmFtZSwgY3ggXVxuXHQpO1xuXG5cdHJldHVybiAoXG5cdFx0PFZpZXcgcmVmPXsgZm9yd2FyZGVkUmVmIH0gY2xhc3NOYW1lPXsgY2xhc3NlcyB9IHsgLi4ub3RoZXJQcm9wcyB9PlxuXHRcdFx0PE5hdmlnYXRvckNvbnRleHQuUHJvdmlkZXIgdmFsdWU9eyBuYXZpZ2F0b3JDb250ZXh0VmFsdWUgfT5cblx0XHRcdFx0eyBjaGlsZHJlbiB9XG5cdFx0XHQ8L05hdmlnYXRvckNvbnRleHQuUHJvdmlkZXI+XG5cdFx0PC9WaWV3PlxuXHQpO1xufVxuXG4vKipcbiAqIFRoZSBgTmF2aWdhdG9yUHJvdmlkZXJgIGNvbXBvbmVudCBhbGxvd3MgcmVuZGVyaW5nIG5lc3RlZCB2aWV3cy9wYW5lbHMvbWVudXNcbiAqICh2aWEgdGhlIGBOYXZpZ2F0b3JTY3JlZW5gIGNvbXBvbmVudCBhbmQgbmF2aWdhdGUgYmV0d2VlbiB0aGVzZSBkaWZmZXJlbnRcbiAqIHZpZXcgKHZpYSB0aGUgYE5hdmlnYXRvckJ1dHRvbmAgYW5kIGBOYXZpZ2F0b3JCYWNrQnV0dG9uYCBjb21wb25lbnRzIG9yIHRoZVxuICogYHVzZU5hdmlnYXRvcmAgaG9vaykuXG4gKlxuICogQGV4YW1wbGVcbiAqIGBgYGpzeFxuICogaW1wb3J0IHtcbiAqICAgX19leHBlcmltZW50YWxOYXZpZ2F0b3JQcm92aWRlciBhcyBOYXZpZ2F0b3JQcm92aWRlcixcbiAqICAgX19leHBlcmltZW50YWxOYXZpZ2F0b3JTY3JlZW4gYXMgTmF2aWdhdG9yU2NyZWVuLFxuICogICBfX2V4cGVyaW1lbnRhbE5hdmlnYXRvckJ1dHRvbiBhcyBOYXZpZ2F0b3JCdXR0b24sXG4gKiAgIF9fZXhwZXJpbWVudGFsTmF2aWdhdG9yQmFja0J1dHRvbiBhcyBOYXZpZ2F0b3JCYWNrQnV0dG9uLFxuICogfSBmcm9tICdAd29yZHByZXNzL2NvbXBvbmVudHMnO1xuICpcbiAqIGNvbnN0IE15TmF2aWdhdGlvbiA9ICgpID0+IChcbiAqICAgPE5hdmlnYXRvclByb3ZpZGVyIGluaXRpYWxQYXRoPVwiL1wiPlxuICogICAgIDxOYXZpZ2F0b3JTY3JlZW4gcGF0aD1cIi9cIj5cbiAqICAgICAgIDxwPlRoaXMgaXMgdGhlIGhvbWUgc2NyZWVuLjwvcD5cbiAqICAgICAgICA8TmF2aWdhdG9yQnV0dG9uIHBhdGg9XCIvY2hpbGRcIj5cbiAqICAgICAgICAgIE5hdmlnYXRlIHRvIGNoaWxkIHNjcmVlbi5cbiAqICAgICAgIDwvTmF2aWdhdG9yQnV0dG9uPlxuICogICAgIDwvTmF2aWdhdG9yU2NyZWVuPlxuICpcbiAqICAgICA8TmF2aWdhdG9yU2NyZWVuIHBhdGg9XCIvY2hpbGRcIj5cbiAqICAgICAgIDxwPlRoaXMgaXMgdGhlIGNoaWxkIHNjcmVlbi48L3A+XG4gKiAgICAgICA8TmF2aWdhdG9yQmFja0J1dHRvbj5cbiAqICAgICAgICAgR28gYmFja1xuICogICAgICAgPC9OYXZpZ2F0b3JCYWNrQnV0dG9uPlxuICogICAgIDwvTmF2aWdhdG9yU2NyZWVuPlxuICogICA8L05hdmlnYXRvclByb3ZpZGVyPlxuICogKTtcbiAqIGBgYFxuICovXG5leHBvcnQgY29uc3QgTmF2aWdhdG9yUHJvdmlkZXIgPSBjb250ZXh0Q29ubmVjdChcblx0VW5jb25uZWN0ZWROYXZpZ2F0b3JQcm92aWRlcixcblx0J05hdmlnYXRvclByb3ZpZGVyJ1xuKTtcblxuZXhwb3J0IGRlZmF1bHQgTmF2aWdhdG9yUHJvdmlkZXI7XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 
@@ -41,14 +59,47 @@ function UnconnectedNavigatorProvider(props, forwardedRef) {
   const [locationHistory, setLocationHistory] = useState([{
     path: initialPath
   }]);
-  const goTo = useCallback(function (path) {
-    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    setLocationHistory(prevLocationHistory => [...prevLocationHistory, { ...options,
-      path,
-      isBack: false,
-      hasRestoredFocus: false
-    }]);
-  }, []);
+  const currentLocationHistory = useRef([]);
+  const [screens, dispatch] = useReducer(screensReducer, []);
+  const currentScreens = useRef([]);
+  useEffect(() => {
+    currentScreens.current = screens;
+  }, [screens]);
+  useEffect(() => {
+    currentLocationHistory.current = locationHistory;
+  }, [locationHistory]);
+  const currentMatch = useRef();
+  const matchedPath = useMemo(() => {
+    let currentPath;
+
+    if (locationHistory.length === 0 || (currentPath = locationHistory[locationHistory.length - 1].path) === undefined) {
+      currentMatch.current = undefined;
+      return undefined;
+    }
+
+    const resolvePath = path => {
+      const newMatch = patternMatch(path, screens); // If the new match is the same as the current match,
+      // return the previous one for performance reasons.
+
+      if (currentMatch.current && newMatch && isShallowEqual(newMatch.params, currentMatch.current.params) && newMatch.id === currentMatch.current.id) {
+        return currentMatch.current;
+      }
+
+      return newMatch;
+    };
+
+    const newMatch = resolvePath(currentPath);
+    currentMatch.current = newMatch;
+    return newMatch;
+  }, [screens, locationHistory]);
+  const addScreen = useCallback(screen => dispatch({
+    type: 'add',
+    screen
+  }), []);
+  const removeScreen = useCallback(screen => dispatch({
+    type: 'remove',
+    screen
+  }), []);
   const goBack = useCallback(() => {
     setLocationHistory(prevLocationHistory => {
       if (prevLocationHistory.length <= 1) {
@@ -61,13 +112,67 @@ function UnconnectedNavigatorProvider(props, forwardedRef) {
       }];
     });
   }, []);
+  const goTo = useCallback(function (path) {
+    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    const {
+      focusTargetSelector,
+      isBack = false,
+      ...restOptions
+    } = options;
+    const isNavigatingToPreviousPath = isBack && currentLocationHistory.current.length > 1 && currentLocationHistory.current[currentLocationHistory.current.length - 2].path === path;
+
+    if (isNavigatingToPreviousPath) {
+      goBack();
+      return;
+    }
+
+    setLocationHistory(prevLocationHistory => {
+      const newLocation = { ...restOptions,
+        path,
+        isBack,
+        hasRestoredFocus: false
+      };
+
+      if (prevLocationHistory.length < 1) {
+        return [newLocation];
+      }
+
+      return [...prevLocationHistory.slice(prevLocationHistory.length > MAX_HISTORY_LENGTH - 1 ? 1 : 0, -1), // Assign `focusTargetSelector` to the previous location in history
+      // (the one we just navigated from).
+      { ...prevLocationHistory[prevLocationHistory.length - 1],
+        focusTargetSelector
+      }, newLocation];
+    });
+  }, [goBack]);
+  const goToParent = useCallback(() => {
+    const currentPath = currentLocationHistory.current[currentLocationHistory.current.length - 1].path;
+
+    if (currentPath === undefined) {
+      return;
+    }
+
+    const parentPath = findParent(currentPath, currentScreens.current);
+
+    if (parentPath === undefined) {
+      return;
+    }
+
+    goTo(parentPath, {
+      isBack: true
+    });
+  }, [goTo]);
   const navigatorContextValue = useMemo(() => ({
     location: { ...locationHistory[locationHistory.length - 1],
       isInitial: locationHistory.length === 1
     },
+    params: matchedPath ? matchedPath.params : {},
+    match: matchedPath ? matchedPath.id : undefined,
     goTo,
-    goBack
-  }), [locationHistory, goTo, goBack]);
+    goBack,
+    goToParent,
+    addScreen,
+    removeScreen
+  }), [locationHistory, matchedPath, goTo, goBack, goToParent, addScreen, removeScreen]);
   const cx = useCx();
   const classes = useMemo( // Prevents horizontal overflow while animating screen transitions.
   () => cx(_ref, className), [className, cx]);

package/build-module/navigator/navigator-provider/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/navigator/navigator-provider/component.tsx"],"names":["css","useMemo","useState","useCallback","contextConnect","useContextSystem","useCx","View","NavigatorContext","UnconnectedNavigatorProvider","props","forwardedRef","initialPath","children","className","otherProps","locationHistory","setLocationHistory","path","goTo","options","prevLocationHistory","isBack","hasRestoredFocus","goBack","length","slice","navigatorContextValue","location","isInitial","cx","classes","NavigatorProvider"],"mappings":";;;;;AAAA;AACA;AACA;AAEA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,OAAT,EAAkBC,QAAlB,EAA4BC,WAA5B,QAA+C,oBAA/C;AAEA;AACA;AACA;;AACA,SACCC,cADD,EAECC,gBAFD,QAIO,kBAJP;AAKA,SAASC,KAAT,QAAsB,0BAAtB;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,gBAAT,QAAiC,YAAjC;;;;;;;;;;;;AAOA,SAASC,4BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AAAEC,IAAAA,WAAF;AAAeC,IAAAA,QAAf;AAAyBC,IAAAA,SAAzB;AAAoC,OAAGC;AAAvC,MACLV,gBAAgB,CAAEK,KAAF,EAAS,mBAAT,CADjB;AAGA,QAAM,CAAEM,eAAF,EAAmBC,kBAAnB,IAA0Cf,QAAQ,CAErD,CACF;AACCgB,IAAAA,IAAI,EAAEN;AADP,GADE,CAFqD,CAAxD;AAQA,QAAMO,IAAoC,GAAGhB,WAAW,CACvD,UAAEe,IAAF,EAA0B;AAAA,QAAlBE,OAAkB,uEAAR,EAAQ;AACzBH,IAAAA,kBAAkB,CAAII,mBAAF,IAA2B,CAC9C,GAAGA,mBAD2C,EAE9C,EACC,GAAGD,OADJ;AAECF,MAAAA,IAFD;AAGCI,MAAAA,MAAM,EAAE,KAHT;AAICC,MAAAA,gBAAgB,EAAE;AAJnB,KAF8C,CAA7B,CAAlB;AASA,GAXsD,EAYvD,EAZuD,CAAxD;AAeA,QAAMC,MAAwC,GAAGrB,WAAW,CAAE,MAAM;AACnEc,IAAAA,kBAAkB,CAAII,mBAAF,IAA2B;AAC9C,UAAKA,mBAAmB,CAACI,MAApB,IAA8B,CAAnC,EAAuC;AACtC,eAAOJ,mBAAP;AACA;;AACD,aAAO,CACN,GAAGA,mBAAmB,CAACK,KAApB,CAA2B,CAA3B,EAA8B,CAAC,CAA/B,CADG,EAEN,EACC,GAAGL,mBAAmB,CAAEA,mBAAmB,CAACI,MAApB,GAA6B,CAA/B,CADvB;AAECH,QAAAA,MAAM,EAAE,IAFT;AAGCC,QAAAA,gBAAgB,EAAE;AAHnB,OAFM,CAAP;AAQA,KAZiB,CAAlB;AAaA,GAd2D,EAczD,EAdyD,CAA5D;AAgBA,QAAMI,qBAA2C,GAAG1B,OAAO,CAC1D,OAAQ;AACP2B,IAAAA,QAAQ,EAAE,EACT,GAAGZ,eAAe,CAAEA,eAAe,CAACS,MAAhB,GAAyB,CAA3B,CADT;AAETI,MAAAA,SAAS,EAAEb,eAAe,CAACS,MAAhB,KAA2B;AAF7B,KADH;AAKPN,IAAAA,IALO;AAMPK,IAAAA;AANO,GAAR,CAD0D,EAS1D,CAAER,eAAF,EAAmBG,IAAnB,EAAyBK,MAAzB,CAT0D,CAA3D;AAYA,QAAMM,EAAE,GAAGxB,KAAK,EAAhB;AACA,QAAMyB,OAAO,GAAG9B,OAAO,EACtB;AACA,QAAM6B,EAAE,OAAkChB,SAAlC,CAFc,EAGtB,CAAEA,SAAF,EAAagB,EAAb,CAHsB,CAAvB;AAMA,SACC,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGnB,YAAZ;AAA2B,IAAA,SAAS,EAAGoB;AAAvC,KAAsDhB,UAAtD,GACC,cAAC,gBAAD,CAAkB,QAAlB;AAA2B,IAAA,KAAK,EAAGY;AAAnC,KACGd,QADH,CADD,CADD;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAMmB,iBAAiB,GAAG5B,cAAc,CAC9CK,4BAD8C,EAE9C,mBAF8C,CAAxC;AAKP,eAAeuB,iBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useState, useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport { View } from '../../view';\nimport { NavigatorContext } from '../context';\nimport type {\n\tNavigatorProviderProps,\n\tNavigatorLocation,\n\tNavigatorContext as NavigatorContextType,\n} from '../types';\n\nfunction UnconnectedNavigatorProvider(\n\tprops: WordPressComponentProps< NavigatorProviderProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst { initialPath, children, className, ...otherProps } =\n\t\tuseContextSystem( props, 'NavigatorProvider' );\n\n\tconst [ locationHistory, setLocationHistory ] = useState<\n\t\tNavigatorLocation[]\n\t>( [\n\t\t{\n\t\t\tpath: initialPath,\n\t\t},\n\t] );\n\n\tconst goTo: NavigatorContextType[ 'goTo' ] = useCallback(\n\t\t( path, options = {} ) => {\n\t\t\tsetLocationHistory( ( prevLocationHistory ) => [\n\t\t\t\t...prevLocationHistory,\n\t\t\t\t{\n\t\t\t\t\t...options,\n\t\t\t\t\tpath,\n\t\t\t\t\tisBack: false,\n\t\t\t\t\thasRestoredFocus: false,\n\t\t\t\t},\n\t\t\t] );\n\t\t},\n\t\t[]\n\t);\n\n\tconst goBack: NavigatorContextType[ 'goBack' ] = useCallback( () => {\n\t\tsetLocationHistory( ( prevLocationHistory ) => {\n\t\t\tif ( prevLocationHistory.length <= 1 ) {\n\t\t\t\treturn prevLocationHistory;\n\t\t\t}\n\t\t\treturn [\n\t\t\t\t...prevLocationHistory.slice( 0, -2 ),\n\t\t\t\t{\n\t\t\t\t\t...prevLocationHistory[ prevLocationHistory.length - 2 ],\n\t\t\t\t\tisBack: true,\n\t\t\t\t\thasRestoredFocus: false,\n\t\t\t\t},\n\t\t\t];\n\t\t} );\n\t}, [] );\n\n\tconst navigatorContextValue: NavigatorContextType = useMemo(\n\t\t() => ( {\n\t\t\tlocation: {\n\t\t\t\t...locationHistory[ locationHistory.length - 1 ],\n\t\t\t\tisInitial: locationHistory.length === 1,\n\t\t\t},\n\t\t\tgoTo,\n\t\t\tgoBack,\n\t\t} ),\n\t\t[ locationHistory, goTo, goBack ]\n\t);\n\n\tconst cx = useCx();\n\tconst classes = useMemo(\n\t\t// Prevents horizontal overflow while animating screen transitions.\n\t\t() => cx( css( { overflowX: 'hidden' } ), className ),\n\t\t[ className, cx ]\n\t);\n\n\treturn (\n\t\t<View ref={ forwardedRef } className={ classes } { ...otherProps }>\n\t\t\t<NavigatorContext.Provider value={ navigatorContextValue }>\n\t\t\t\t{ children }\n\t\t\t</NavigatorContext.Provider>\n\t\t</View>\n\t);\n}\n\n/**\n * The `NavigatorProvider` component allows rendering nested views/panels/menus\n * (via the `NavigatorScreen` component and navigate between these different\n * view (via the `NavigatorButton` and `NavigatorBackButton` components or the\n * `useNavigator` hook).\n *\n * @example\n * ```jsx\n * import {\n *   __experimentalNavigatorProvider as NavigatorProvider,\n *   __experimentalNavigatorScreen as NavigatorScreen,\n *   __experimentalNavigatorButton as NavigatorButton,\n *   __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n *\n * const MyNavigation = () => (\n *   <NavigatorProvider initialPath=\"/\">\n *     <NavigatorScreen path=\"/\">\n *       <p>This is the home screen.</p>\n *        <NavigatorButton path=\"/child\">\n *          Navigate to child screen.\n *       </NavigatorButton>\n *     </NavigatorScreen>\n *\n *     <NavigatorScreen path=\"/child\">\n *       <p>This is the child screen.</p>\n *       <NavigatorBackButton>\n *         Go back\n *       </NavigatorBackButton>\n *     </NavigatorScreen>\n *   </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorProvider = contextConnect(\n\tUnconnectedNavigatorProvider,\n\t'NavigatorProvider'\n);\n\nexport default NavigatorProvider;\n"]}
+{"version":3,"sources":["@wordpress/components/src/navigator/navigator-provider/component.tsx"],"names":["css","useMemo","useState","useCallback","useReducer","useRef","useEffect","isShallowEqual","contextConnect","useContextSystem","useCx","View","NavigatorContext","patternMatch","findParent","MAX_HISTORY_LENGTH","screensReducer","state","action","type","screen","filter","s","id","UnconnectedNavigatorProvider","props","forwardedRef","initialPath","children","className","otherProps","locationHistory","setLocationHistory","path","currentLocationHistory","screens","dispatch","currentScreens","current","currentMatch","matchedPath","currentPath","length","undefined","resolvePath","newMatch","params","addScreen","removeScreen","goBack","prevLocationHistory","slice","isBack","hasRestoredFocus","goTo","options","focusTargetSelector","restOptions","isNavigatingToPreviousPath","newLocation","goToParent","parentPath","navigatorContextValue","location","isInitial","match","cx","classes","NavigatorProvider"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n\tuseReducer,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport { View } from '../../view';\nimport { NavigatorContext } from '../context';\nimport type {\n\tNavigatorProviderProps,\n\tNavigatorLocation,\n\tNavigatorContext as NavigatorContextType,\n\tScreen,\n} from '../types';\nimport { patternMatch, findParent } from '../utils/router';\n\ntype MatchedPath = ReturnType< typeof patternMatch >;\ntype ScreenAction = { type: string; screen: Screen };\n\nconst MAX_HISTORY_LENGTH = 50;\n\nfunction screensReducer(\n\tstate: Screen[] = [],\n\taction: ScreenAction\n): Screen[] {\n\tswitch ( action.type ) {\n\t\tcase 'add':\n\t\t\treturn [ ...state, action.screen ];\n\t\tcase 'remove':\n\t\t\treturn state.filter( ( s: Screen ) => s.id !== action.screen.id );\n\t}\n\n\treturn state;\n}\n\nfunction UnconnectedNavigatorProvider(\n\tprops: WordPressComponentProps< NavigatorProviderProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst { initialPath, children, className, ...otherProps } =\n\t\tuseContextSystem( props, 'NavigatorProvider' );\n\n\tconst [ locationHistory, setLocationHistory ] = useState<\n\t\tNavigatorLocation[]\n\t>( [\n\t\t{\n\t\t\tpath: initialPath,\n\t\t},\n\t] );\n\tconst currentLocationHistory = useRef< NavigatorLocation[] >( [] );\n\tconst [ screens, dispatch ] = useReducer( screensReducer, [] );\n\tconst currentScreens = useRef< Screen[] >( [] );\n\tuseEffect( () => {\n\t\tcurrentScreens.current = screens;\n\t}, [ screens ] );\n\tuseEffect( () => {\n\t\tcurrentLocationHistory.current = locationHistory;\n\t}, [ locationHistory ] );\n\tconst currentMatch = useRef< MatchedPath >();\n\tconst matchedPath = useMemo( () => {\n\t\tlet currentPath: string | undefined;\n\t\tif (\n\t\t\tlocationHistory.length === 0 ||\n\t\t\t( currentPath =\n\t\t\t\tlocationHistory[ locationHistory.length - 1 ].path ) ===\n\t\t\t\tundefined\n\t\t) {\n\t\t\tcurrentMatch.current = undefined;\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst resolvePath = ( path: string ) => {\n\t\t\tconst newMatch = patternMatch( path, screens );\n\n\t\t\t// If the new match is the same as the current match,\n\t\t\t// return the previous one for performance reasons.\n\t\t\tif (\n\t\t\t\tcurrentMatch.current &&\n\t\t\t\tnewMatch &&\n\t\t\t\tisShallowEqual(\n\t\t\t\t\tnewMatch.params,\n\t\t\t\t\tcurrentMatch.current.params\n\t\t\t\t) &&\n\t\t\t\tnewMatch.id === currentMatch.current.id\n\t\t\t) {\n\t\t\t\treturn currentMatch.current;\n\t\t\t}\n\n\t\t\treturn newMatch;\n\t\t};\n\n\t\tconst newMatch = resolvePath( currentPath );\n\t\tcurrentMatch.current = newMatch;\n\t\treturn newMatch;\n\t}, [ screens, locationHistory ] );\n\n\tconst addScreen = useCallback(\n\t\t( screen: Screen ) => dispatch( { type: 'add', screen } ),\n\t\t[]\n\t);\n\n\tconst removeScreen = useCallback(\n\t\t( screen: Screen ) => dispatch( { type: 'remove', screen } ),\n\t\t[]\n\t);\n\n\tconst goBack: NavigatorContextType[ 'goBack' ] = useCallback( () => {\n\t\tsetLocationHistory( ( prevLocationHistory ) => {\n\t\t\tif ( prevLocationHistory.length <= 1 ) {\n\t\t\t\treturn prevLocationHistory;\n\t\t\t}\n\t\t\treturn [\n\t\t\t\t...prevLocationHistory.slice( 0, -2 ),\n\t\t\t\t{\n\t\t\t\t\t...prevLocationHistory[ prevLocationHistory.length - 2 ],\n\t\t\t\t\tisBack: true,\n\t\t\t\t\thasRestoredFocus: false,\n\t\t\t\t},\n\t\t\t];\n\t\t} );\n\t}, [] );\n\n\tconst goTo: NavigatorContextType[ 'goTo' ] = useCallback(\n\t\t( path, options = {} ) => {\n\t\t\tconst {\n\t\t\t\tfocusTargetSelector,\n\t\t\t\tisBack = false,\n\t\t\t\t...restOptions\n\t\t\t} = options;\n\n\t\t\tconst isNavigatingToPreviousPath =\n\t\t\t\tisBack &&\n\t\t\t\tcurrentLocationHistory.current.length > 1 &&\n\t\t\t\tcurrentLocationHistory.current[\n\t\t\t\t\tcurrentLocationHistory.current.length - 2\n\t\t\t\t].path === path;\n\n\t\t\tif ( isNavigatingToPreviousPath ) {\n\t\t\t\tgoBack();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetLocationHistory( ( prevLocationHistory ) => {\n\t\t\t\tconst newLocation = {\n\t\t\t\t\t...restOptions,\n\t\t\t\t\tpath,\n\t\t\t\t\tisBack,\n\t\t\t\t\thasRestoredFocus: false,\n\t\t\t\t};\n\n\t\t\t\tif ( prevLocationHistory.length < 1 ) {\n\t\t\t\t\treturn [ newLocation ];\n\t\t\t\t}\n\n\t\t\t\treturn [\n\t\t\t\t\t...prevLocationHistory.slice(\n\t\t\t\t\t\tprevLocationHistory.length > MAX_HISTORY_LENGTH - 1\n\t\t\t\t\t\t\t? 1\n\t\t\t\t\t\t\t: 0,\n\t\t\t\t\t\t-1\n\t\t\t\t\t),\n\t\t\t\t\t// Assign `focusTargetSelector` to the previous location in history\n\t\t\t\t\t// (the one we just navigated from).\n\t\t\t\t\t{\n\t\t\t\t\t\t...prevLocationHistory[\n\t\t\t\t\t\t\tprevLocationHistory.length - 1\n\t\t\t\t\t\t],\n\t\t\t\t\t\tfocusTargetSelector,\n\t\t\t\t\t},\n\t\t\t\t\tnewLocation,\n\t\t\t\t];\n\t\t\t} );\n\t\t},\n\t\t[ goBack ]\n\t);\n\n\tconst goToParent: NavigatorContextType[ 'goToParent' ] =\n\t\tuseCallback( () => {\n\t\t\tconst currentPath =\n\t\t\t\tcurrentLocationHistory.current[\n\t\t\t\t\tcurrentLocationHistory.current.length - 1\n\t\t\t\t].path;\n\t\t\tif ( currentPath === undefined ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst parentPath = findParent(\n\t\t\t\tcurrentPath,\n\t\t\t\tcurrentScreens.current\n\t\t\t);\n\t\t\tif ( parentPath === undefined ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tgoTo( parentPath, { isBack: true } );\n\t\t}, [ goTo ] );\n\n\tconst navigatorContextValue: NavigatorContextType = useMemo(\n\t\t() => ( {\n\t\t\tlocation: {\n\t\t\t\t...locationHistory[ locationHistory.length - 1 ],\n\t\t\t\tisInitial: locationHistory.length === 1,\n\t\t\t},\n\t\t\tparams: matchedPath ? matchedPath.params : {},\n\t\t\tmatch: matchedPath ? matchedPath.id : undefined,\n\t\t\tgoTo,\n\t\t\tgoBack,\n\t\t\tgoToParent,\n\t\t\taddScreen,\n\t\t\tremoveScreen,\n\t\t} ),\n\t\t[\n\t\t\tlocationHistory,\n\t\t\tmatchedPath,\n\t\t\tgoTo,\n\t\t\tgoBack,\n\t\t\tgoToParent,\n\t\t\taddScreen,\n\t\t\tremoveScreen,\n\t\t]\n\t);\n\n\tconst cx = useCx();\n\tconst classes = useMemo(\n\t\t// Prevents horizontal overflow while animating screen transitions.\n\t\t() => cx( css( { overflowX: 'hidden' } ), className ),\n\t\t[ className, cx ]\n\t);\n\n\treturn (\n\t\t<View ref={ forwardedRef } className={ classes } { ...otherProps }>\n\t\t\t<NavigatorContext.Provider value={ navigatorContextValue }>\n\t\t\t\t{ children }\n\t\t\t</NavigatorContext.Provider>\n\t\t</View>\n\t);\n}\n\n/**\n * The `NavigatorProvider` component allows rendering nested views/panels/menus\n * (via the `NavigatorScreen` component and navigate between these different\n * view (via the `NavigatorButton` and `NavigatorBackButton` components or the\n * `useNavigator` hook).\n *\n * @example\n * ```jsx\n * import {\n *   __experimentalNavigatorProvider as NavigatorProvider,\n *   __experimentalNavigatorScreen as NavigatorScreen,\n *   __experimentalNavigatorButton as NavigatorButton,\n *   __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n *\n * const MyNavigation = () => (\n *   <NavigatorProvider initialPath=\"/\">\n *     <NavigatorScreen path=\"/\">\n *       <p>This is the home screen.</p>\n *        <NavigatorButton path=\"/child\">\n *          Navigate to child screen.\n *       </NavigatorButton>\n *     </NavigatorScreen>\n *\n *     <NavigatorScreen path=\"/child\">\n *       <p>This is the child screen.</p>\n *       <NavigatorBackButton>\n *         Go back\n *       </NavigatorBackButton>\n *     </NavigatorScreen>\n *   </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorProvider = contextConnect(\n\tUnconnectedNavigatorProvider,\n\t'NavigatorProvider'\n);\n\nexport default NavigatorProvider;\n"]}