@wordpress/components 27.2.0 → 27.3.0

package/build/input-control/input-field.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react2","require","_element","_utils","_inputControlStyles","_reducer","noop","InputField","disabled","dragDirection","dragThreshold","id","isDragEnabled","isFocused","isPressEnterToChange","onBlur","onChange","onDrag","onDragEnd","onDragStart","onFocus","onKeyDown","onValidate","size","setIsFocused","stateReducer","state","value","valueProp","type","props","ref","change","commit","drag","dragEnd","dragStart","invalidate","pressDown","pressEnter","pressUp","reset","useInputControlStateReducer","isDragging","isDirty","wasDirtyOnBlur","useRef","dragCursor","useDragCursor","handleOnBlur","event","target","validity","valid","current","handleOnCommit","handleOnFocus","handleOnChange","nextValue","currentTarget","err","handleOnKeyDown","key","preventDefault","dragGestureProps","useDrag","dragProps","distance","dragging","stopPropagation","axis","threshold","enabled","pointer","capture","handleOnMouseDown","onMouseDown","ownerDocument","activeElement","focus","_react","createElement","Input","className","inputSize","ForwardedComponent","forwardRef","_default","exports","default"],"sources":["@wordpress/components/src/input-control/input-field.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { useDrag } from '@use-gesture/react';\nimport type {\n\tSyntheticEvent,\n\tChangeEvent,\n\tKeyboardEvent,\n\tPointerEvent,\n\tFocusEvent,\n\tForwardedRef,\n\tMouseEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useDragCursor } from './utils';\nimport { Input } from './styles/input-control-styles';\nimport { useInputControlStateReducer } from './reducer/reducer';\nimport type { InputFieldProps } from './types';\n\nconst noop = () => {};\n\nfunction InputField(\n\t{\n\t\tdisabled = false,\n\t\tdragDirection = 'n',\n\t\tdragThreshold = 10,\n\t\tid,\n\t\tisDragEnabled = false,\n\t\tisFocused,\n\t\tisPressEnterToChange = false,\n\t\tonBlur = noop,\n\t\tonChange = noop,\n\t\tonDrag = noop,\n\t\tonDragEnd = noop,\n\t\tonDragStart = noop,\n\t\tonFocus = noop,\n\t\tonKeyDown = noop,\n\t\tonValidate = noop,\n\t\tsize = 'default',\n\t\tsetIsFocused,\n\t\tstateReducer = ( state: any ) => state,\n\t\tvalue: valueProp,\n\t\ttype,\n\t\t...props\n\t}: WordPressComponentProps< InputFieldProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\t// State.\n\t\tstate,\n\t\t// Actions.\n\t\tchange,\n\t\tcommit,\n\t\tdrag,\n\t\tdragEnd,\n\t\tdragStart,\n\t\tinvalidate,\n\t\tpressDown,\n\t\tpressEnter,\n\t\tpressUp,\n\t\treset,\n\t} = useInputControlStateReducer(\n\t\tstateReducer,\n\t\t{\n\t\t\tisDragEnabled,\n\t\t\tvalue: valueProp,\n\t\t\tisPressEnterToChange,\n\t\t},\n\t\tonChange\n\t);\n\n\tconst { value, isDragging, isDirty } = state;\n\tconst wasDirtyOnBlur = useRef( false );\n\n\tconst dragCursor = useDragCursor( isDragging, dragDirection );\n\n\tconst handleOnBlur = ( event: FocusEvent< HTMLInputElement > ) => {\n\t\tonBlur( event );\n\t\tsetIsFocused?.( false );\n\n\t\t/**\n\t\t * If isPressEnterToChange is set, this commits the value to\n\t\t * the onChange callback.\n\t\t */\n\t\tif ( isDirty || ! event.target.validity.valid ) {\n\t\t\twasDirtyOnBlur.current = true;\n\t\t\thandleOnCommit( event );\n\t\t}\n\t};\n\n\tconst handleOnFocus = ( event: FocusEvent< HTMLInputElement > ) => {\n\t\tonFocus( event );\n\t\tsetIsFocused?.( true );\n\t};\n\n\tconst handleOnChange = ( event: ChangeEvent< HTMLInputElement > ) => {\n\t\tconst nextValue = event.target.value;\n\t\tchange( nextValue, event );\n\t};\n\n\tconst handleOnCommit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tconst nextValue = event.currentTarget.value;\n\n\t\ttry {\n\t\t\tonValidate( nextValue );\n\t\t\tcommit( nextValue, event );\n\t\t} catch ( err ) {\n\t\t\tinvalidate( err, event );\n\t\t}\n\t};\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { key } = event;\n\t\tonKeyDown( event );\n\n\t\tswitch ( key ) {\n\t\t\tcase 'ArrowUp':\n\t\t\t\tpressUp( event );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowDown':\n\t\t\t\tpressDown( event );\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tpressEnter( event );\n\n\t\t\t\tif ( isPressEnterToChange ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\thandleOnCommit( event );\n\t\t\t\t}\n\t\t\t\tbreak;\n\n\t\t\tcase 'Escape':\n\t\t\t\tif ( isPressEnterToChange && isDirty ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treset( valueProp, event );\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t}\n\t};\n\n\tconst dragGestureProps = useDrag< PointerEvent< HTMLInputElement > >(\n\t\t( dragProps ) => {\n\t\t\tconst { distance, dragging, event, target } = dragProps;\n\n\t\t\t// The `target` prop always references the `input` element while, by\n\t\t\t// default, the `dragProps.event.target` property would reference the real\n\t\t\t// event target (i.e. any DOM element that the pointer is hovering while\n\t\t\t// dragging). Ensuring that the `target` is always the `input` element\n\t\t\t// allows consumers of `InputControl` (or any higher-level control) to\n\t\t\t// check the input's validity by accessing `event.target.validity.valid`.\n\t\t\tdragProps.event = {\n\t\t\t\t...dragProps.event,\n\t\t\t\ttarget,\n\t\t\t};\n\n\t\t\tif ( ! distance ) return;\n\t\t\tevent.stopPropagation();\n\n\t\t\t/**\n\t\t\t * Quick return if no longer dragging.\n\t\t\t * This prevents unnecessary value calculations.\n\t\t\t */\n\t\t\tif ( ! dragging ) {\n\t\t\t\tonDragEnd( dragProps );\n\t\t\t\tdragEnd( dragProps );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonDrag( dragProps );\n\t\t\tdrag( dragProps );\n\n\t\t\tif ( ! isDragging ) {\n\t\t\t\tonDragStart( dragProps );\n\t\t\t\tdragStart( dragProps );\n\t\t\t}\n\t\t},\n\t\t{\n\t\t\taxis: dragDirection === 'e' || dragDirection === 'w' ? 'x' : 'y',\n\t\t\tthreshold: dragThreshold,\n\t\t\tenabled: isDragEnabled,\n\t\t\tpointer: { capture: false },\n\t\t}\n\t);\n\n\tconst dragProps = isDragEnabled ? dragGestureProps() : {};\n\t/*\n\t * Works around the odd UA (e.g. Firefox) that does not focus inputs of\n\t * type=number when their spinner arrows are pressed.\n\t */\n\tlet handleOnMouseDown;\n\tif ( type === 'number' ) {\n\t\thandleOnMouseDown = ( event: MouseEvent< HTMLInputElement > ) => {\n\t\t\tprops.onMouseDown?.( event );\n\t\t\tif (\n\t\t\t\tevent.currentTarget !==\n\t\t\t\tevent.currentTarget.ownerDocument.activeElement\n\t\t\t) {\n\t\t\t\tevent.currentTarget.focus();\n\t\t\t}\n\t\t};\n\t}\n\n\treturn (\n\t\t<Input\n\t\t\t{ ...props }\n\t\t\t{ ...dragProps }\n\t\t\tclassName=\"components-input-control__input\"\n\t\t\tdisabled={ disabled }\n\t\t\tdragCursor={ dragCursor }\n\t\t\tisDragging={ isDragging }\n\t\t\tid={ id }\n\t\t\tonBlur={ handleOnBlur }\n\t\t\tonChange={ handleOnChange }\n\t\t\tonFocus={ handleOnFocus }\n\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\tonMouseDown={ handleOnMouseDown }\n\t\t\tref={ ref }\n\t\t\tinputSize={ size }\n\t\t\t// Fallback to `''` to avoid \"uncontrolled to controlled\" warning.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/47250 for details.\n\t\t\tvalue={ value ?? '' }\n\t\t\ttype={ type }\n\t\t/>\n\t);\n}\n\nconst ForwardedComponent = forwardRef( InputField );\n\nexport default ForwardedComponent;\n"],"mappings":"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"}
+{"version":3,"names":["_react2","require","_element","_utils","_inputControlStyles","_reducer","_withIgnoreImeEvents","noop","InputField","disabled","dragDirection","dragThreshold","id","isDragEnabled","isFocused","isPressEnterToChange","onBlur","onChange","onDrag","onDragEnd","onDragStart","onFocus","onKeyDown","onValidate","size","setIsFocused","stateReducer","state","value","valueProp","type","props","ref","change","commit","drag","dragEnd","dragStart","invalidate","pressDown","pressEnter","pressUp","reset","useInputControlStateReducer","isDragging","isDirty","wasDirtyOnBlur","useRef","dragCursor","useDragCursor","handleOnBlur","event","target","validity","valid","current","handleOnCommit","handleOnFocus","handleOnChange","nextValue","currentTarget","err","handleOnKeyDown","key","preventDefault","dragGestureProps","useDrag","dragProps","distance","dragging","stopPropagation","axis","threshold","enabled","pointer","capture","handleOnMouseDown","onMouseDown","ownerDocument","activeElement","focus","_react","createElement","Input","className","withIgnoreIMEEvents","inputSize","ForwardedComponent","forwardRef","_default","exports","default"],"sources":["@wordpress/components/src/input-control/input-field.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { useDrag } from '@use-gesture/react';\nimport type {\n\tSyntheticEvent,\n\tChangeEvent,\n\tKeyboardEvent,\n\tPointerEvent,\n\tFocusEvent,\n\tForwardedRef,\n\tMouseEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useDragCursor } from './utils';\nimport { Input } from './styles/input-control-styles';\nimport { useInputControlStateReducer } from './reducer/reducer';\nimport type { InputFieldProps } from './types';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\n\nconst noop = () => {};\n\nfunction InputField(\n\t{\n\t\tdisabled = false,\n\t\tdragDirection = 'n',\n\t\tdragThreshold = 10,\n\t\tid,\n\t\tisDragEnabled = false,\n\t\tisFocused,\n\t\tisPressEnterToChange = false,\n\t\tonBlur = noop,\n\t\tonChange = noop,\n\t\tonDrag = noop,\n\t\tonDragEnd = noop,\n\t\tonDragStart = noop,\n\t\tonFocus = noop,\n\t\tonKeyDown = noop,\n\t\tonValidate = noop,\n\t\tsize = 'default',\n\t\tsetIsFocused,\n\t\tstateReducer = ( state: any ) => state,\n\t\tvalue: valueProp,\n\t\ttype,\n\t\t...props\n\t}: WordPressComponentProps< InputFieldProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\t// State.\n\t\tstate,\n\t\t// Actions.\n\t\tchange,\n\t\tcommit,\n\t\tdrag,\n\t\tdragEnd,\n\t\tdragStart,\n\t\tinvalidate,\n\t\tpressDown,\n\t\tpressEnter,\n\t\tpressUp,\n\t\treset,\n\t} = useInputControlStateReducer(\n\t\tstateReducer,\n\t\t{\n\t\t\tisDragEnabled,\n\t\t\tvalue: valueProp,\n\t\t\tisPressEnterToChange,\n\t\t},\n\t\tonChange\n\t);\n\n\tconst { value, isDragging, isDirty } = state;\n\tconst wasDirtyOnBlur = useRef( false );\n\n\tconst dragCursor = useDragCursor( isDragging, dragDirection );\n\n\tconst handleOnBlur = ( event: FocusEvent< HTMLInputElement > ) => {\n\t\tonBlur( event );\n\t\tsetIsFocused?.( false );\n\n\t\t/**\n\t\t * If isPressEnterToChange is set, this commits the value to\n\t\t * the onChange callback.\n\t\t */\n\t\tif ( isDirty || ! event.target.validity.valid ) {\n\t\t\twasDirtyOnBlur.current = true;\n\t\t\thandleOnCommit( event );\n\t\t}\n\t};\n\n\tconst handleOnFocus = ( event: FocusEvent< HTMLInputElement > ) => {\n\t\tonFocus( event );\n\t\tsetIsFocused?.( true );\n\t};\n\n\tconst handleOnChange = ( event: ChangeEvent< HTMLInputElement > ) => {\n\t\tconst nextValue = event.target.value;\n\t\tchange( nextValue, event );\n\t};\n\n\tconst handleOnCommit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tconst nextValue = event.currentTarget.value;\n\n\t\ttry {\n\t\t\tonValidate( nextValue );\n\t\t\tcommit( nextValue, event );\n\t\t} catch ( err ) {\n\t\t\tinvalidate( err, event );\n\t\t}\n\t};\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { key } = event;\n\t\tonKeyDown( event );\n\n\t\tswitch ( key ) {\n\t\t\tcase 'ArrowUp':\n\t\t\t\tpressUp( event );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowDown':\n\t\t\t\tpressDown( event );\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tpressEnter( event );\n\n\t\t\t\tif ( isPressEnterToChange ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\thandleOnCommit( event );\n\t\t\t\t}\n\t\t\t\tbreak;\n\n\t\t\tcase 'Escape':\n\t\t\t\tif ( isPressEnterToChange && isDirty ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treset( valueProp, event );\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t}\n\t};\n\n\tconst dragGestureProps = useDrag< PointerEvent< HTMLInputElement > >(\n\t\t( dragProps ) => {\n\t\t\tconst { distance, dragging, event, target } = dragProps;\n\n\t\t\t// The `target` prop always references the `input` element while, by\n\t\t\t// default, the `dragProps.event.target` property would reference the real\n\t\t\t// event target (i.e. any DOM element that the pointer is hovering while\n\t\t\t// dragging). Ensuring that the `target` is always the `input` element\n\t\t\t// allows consumers of `InputControl` (or any higher-level control) to\n\t\t\t// check the input's validity by accessing `event.target.validity.valid`.\n\t\t\tdragProps.event = {\n\t\t\t\t...dragProps.event,\n\t\t\t\ttarget,\n\t\t\t};\n\n\t\t\tif ( ! distance ) return;\n\t\t\tevent.stopPropagation();\n\n\t\t\t/**\n\t\t\t * Quick return if no longer dragging.\n\t\t\t * This prevents unnecessary value calculations.\n\t\t\t */\n\t\t\tif ( ! dragging ) {\n\t\t\t\tonDragEnd( dragProps );\n\t\t\t\tdragEnd( dragProps );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonDrag( dragProps );\n\t\t\tdrag( dragProps );\n\n\t\t\tif ( ! isDragging ) {\n\t\t\t\tonDragStart( dragProps );\n\t\t\t\tdragStart( dragProps );\n\t\t\t}\n\t\t},\n\t\t{\n\t\t\taxis: dragDirection === 'e' || dragDirection === 'w' ? 'x' : 'y',\n\t\t\tthreshold: dragThreshold,\n\t\t\tenabled: isDragEnabled,\n\t\t\tpointer: { capture: false },\n\t\t}\n\t);\n\n\tconst dragProps = isDragEnabled ? dragGestureProps() : {};\n\t/*\n\t * Works around the odd UA (e.g. Firefox) that does not focus inputs of\n\t * type=number when their spinner arrows are pressed.\n\t */\n\tlet handleOnMouseDown;\n\tif ( type === 'number' ) {\n\t\thandleOnMouseDown = ( event: MouseEvent< HTMLInputElement > ) => {\n\t\t\tprops.onMouseDown?.( event );\n\t\t\tif (\n\t\t\t\tevent.currentTarget !==\n\t\t\t\tevent.currentTarget.ownerDocument.activeElement\n\t\t\t) {\n\t\t\t\tevent.currentTarget.focus();\n\t\t\t}\n\t\t};\n\t}\n\n\treturn (\n\t\t<Input\n\t\t\t{ ...props }\n\t\t\t{ ...dragProps }\n\t\t\tclassName=\"components-input-control__input\"\n\t\t\tdisabled={ disabled }\n\t\t\tdragCursor={ dragCursor }\n\t\t\tisDragging={ isDragging }\n\t\t\tid={ id }\n\t\t\tonBlur={ handleOnBlur }\n\t\t\tonChange={ handleOnChange }\n\t\t\tonFocus={ handleOnFocus }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( handleOnKeyDown ) }\n\t\t\tonMouseDown={ handleOnMouseDown }\n\t\t\tref={ ref }\n\t\t\tinputSize={ size }\n\t\t\t// Fallback to `''` to avoid \"uncontrolled to controlled\" warning.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/47250 for details.\n\t\t\tvalue={ value ?? '' }\n\t\t\ttype={ type }\n\t\t/>\n\t);\n}\n\nconst ForwardedComponent = forwardRef( InputField );\n\nexport default ForwardedComponent;\n"],"mappings":"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"}

package/build/mobile/color-settings/palette.screen.native.js

@@ -102,6 +102,7 @@ const PaletteScreen = () => {
   }
   function getClearButton() {
     return (0, _react.createElement)(_reactNative.TouchableWithoutFeedback, {
+      accessibilityLabel: (0, _i18n.__)('Clear selected color'),
       onPress: onClear,
       hitSlop: HIT_SLOP
     }, (0, _react.createElement)(_reactNative.View, {

package/build/mobile/color-settings/palette.screen.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reactNative","require","_i18n","_element","_compose","_components","_native","_colorPalette","_interopRequireDefault","_colorIndicator","_navBar","_segmentedControl","_utils","_style","HIT_SLOP","top","bottom","left","right","PaletteScreen","route","useRoute","navigation","useNavigation","shouldEnableBottomSheetScroll","useContext","BottomSheetContext","label","onColorChange","onGradientChange","onColorCleared","colorValue","defaultSettings","hideNavigation","params","segments","isGradient","colorsUtils","currentValue","setCurrentValue","useState","isGradientColor","selectedSegmentIndex","currentSegment","setCurrentSegment","isGradientSegment","currentSegmentColors","colors","gradients","allAvailableColors","useMobileGlobalStylesColors","allAvailableGradients","flatMap","filter","Boolean","horizontalSeparatorStyle","usePreferredColorSchemeStyle","styles","horizontalSeparator","horizontalSeparatorDark","clearButtonStyle","clearButton","clearButtonDark","selectedColorTextStyle","colorText","colorTextDark","isSolidSegment","isCustomGadientShown","setColor","color","onClear","undefined","onCustomPress","navigate","screens","picker","gradientPicker","getClearButton","_react","createElement","TouchableWithoutFeedback","onPress","hitSlop","View","style","clearButtonContainer","Text","__","getFooter","default","segmentHandler","selectedIndex","indexOf","addonLeft","colorIndicator","addonRight","footer","flex","maxFontSizeMultiplier","selectable","toUpperCase","selectColorText","BackButton","goBack","Heading","colorPalettes","map","palette","paletteKey","paletteSettings","allColors","allGradients","enableCustomColor","name","key","activeColor","Fragment","PanelBody","ColorControl","withColorIndicator","_default","exports"],"sources":["@wordpress/components/src/mobile/color-settings/palette.screen.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View, Text, TouchableWithoutFeedback } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState, useContext } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\nimport {\n\tColorControl,\n\tPanelBody,\n\tBottomSheetContext,\n\tuseMobileGlobalStylesColors,\n} from '@wordpress/components';\nimport { useRoute, useNavigation } from '@react-navigation/native';\n\n/**\n * Internal dependencies\n */\nimport ColorPalette from '../../color-palette';\nimport ColorIndicator from '../../color-indicator';\nimport NavBar from '../bottom-sheet/nav-bar';\nimport SegmentedControls from '../segmented-control';\nimport { colorsUtils } from './utils';\n\nimport styles from './style.scss';\n\nconst HIT_SLOP = { top: 8, bottom: 8, left: 8, right: 8 };\n\nconst PaletteScreen = () => {\n\tconst route = useRoute();\n\tconst navigation = useNavigation();\n\tconst { shouldEnableBottomSheetScroll } = useContext( BottomSheetContext );\n\tconst {\n\t\tlabel,\n\t\tonColorChange,\n\t\tonGradientChange,\n\t\tonColorCleared,\n\t\tcolorValue,\n\t\tdefaultSettings,\n\t\thideNavigation = false,\n\t} = route.params || {};\n\tconst { segments, isGradient } = colorsUtils;\n\tconst [ currentValue, setCurrentValue ] = useState( colorValue );\n\tconst isGradientColor = isGradient( currentValue );\n\tconst selectedSegmentIndex = isGradientColor ? 1 : 0;\n\n\tconst [ currentSegment, setCurrentSegment ] = useState(\n\t\tsegments[ selectedSegmentIndex ]\n\t);\n\tconst isGradientSegment = currentSegment === colorsUtils.segments[ 1 ];\n\tconst currentSegmentColors = ! isGradientSegment\n\t\t? defaultSettings.colors\n\t\t: defaultSettings.gradients;\n\tconst allAvailableColors = useMobileGlobalStylesColors();\n\tconst allAvailableGradients = currentSegmentColors\n\t\t.flatMap( ( { gradients } ) => gradients )\n\t\t.filter( Boolean );\n\n\tconst horizontalSeparatorStyle = usePreferredColorSchemeStyle(\n\t\tstyles.horizontalSeparator,\n\t\tstyles.horizontalSeparatorDark\n\t);\n\tconst clearButtonStyle = usePreferredColorSchemeStyle(\n\t\tstyles.clearButton,\n\t\tstyles.clearButtonDark\n\t);\n\tconst selectedColorTextStyle = usePreferredColorSchemeStyle(\n\t\tstyles.colorText,\n\t\tstyles.colorTextDark\n\t);\n\n\tconst isSolidSegment = currentSegment === segments[ 0 ];\n\tconst isCustomGadientShown = ! isSolidSegment && isGradientColor;\n\n\tconst setColor = ( color ) => {\n\t\tsetCurrentValue( color );\n\t\tif ( isSolidSegment && onColorChange && onGradientChange ) {\n\t\t\tonColorChange( color );\n\t\t} else if ( isSolidSegment && onColorChange ) {\n\t\t\tonColorChange( color );\n\t\t} else if ( ! isSolidSegment && onGradientChange ) {\n\t\t\tonGradientChange( color );\n\t\t}\n\t};\n\n\tfunction onClear() {\n\t\tsetCurrentValue( undefined );\n\n\t\tif ( onColorCleared ) {\n\t\t\tonColorCleared();\n\t\t}\n\t}\n\n\tfunction onCustomPress() {\n\t\tif ( isSolidSegment ) {\n\t\t\tnavigation.navigate( colorsUtils.screens.picker, {\n\t\t\t\tcurrentValue,\n\t\t\t\tsetColor,\n\t\t\t} );\n\t\t} else {\n\t\t\tnavigation.navigate( colorsUtils.screens.gradientPicker, {\n\t\t\t\tsetColor,\n\t\t\t\tisGradientColor,\n\t\t\t\tcurrentValue,\n\t\t\t} );\n\t\t}\n\t}\n\n\tfunction getClearButton() {\n\t\treturn (\n\t\t\t<TouchableWithoutFeedback onPress={ onClear } hitSlop={ HIT_SLOP }>\n\t\t\t\t<View style={ styles.clearButtonContainer }>\n\t\t\t\t\t<Text style={ clearButtonStyle }>{ __( 'Reset' ) }</Text>\n\t\t\t\t</View>\n\t\t\t</TouchableWithoutFeedback>\n\t\t);\n\t}\n\n\tfunction getFooter() {\n\t\tif ( onGradientChange ) {\n\t\t\treturn (\n\t\t\t\t<SegmentedControls\n\t\t\t\t\tsegments={ segments }\n\t\t\t\t\tsegmentHandler={ setCurrentSegment }\n\t\t\t\t\tselectedIndex={ segments.indexOf( currentSegment ) }\n\t\t\t\t\taddonLeft={\n\t\t\t\t\t\tcurrentValue && (\n\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\tcolor={ currentValue }\n\t\t\t\t\t\t\t\tstyle={ styles.colorIndicator }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\taddonRight={ currentValue && getClearButton() }\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\t\treturn (\n\t\t\t<View style={ styles.footer }>\n\t\t\t\t<View style={ styles.flex }>\n\t\t\t\t\t{ currentValue && (\n\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\tcolor={ currentValue }\n\t\t\t\t\t\t\tstyle={ styles.colorIndicator }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</View>\n\t\t\t\t{ currentValue ? (\n\t\t\t\t\t<Text\n\t\t\t\t\t\tstyle={ selectedColorTextStyle }\n\t\t\t\t\t\tmaxFontSizeMultiplier={ 2 }\n\t\t\t\t\t\tselectable\n\t\t\t\t\t>\n\t\t\t\t\t\t{ currentValue.toUpperCase() }\n\t\t\t\t\t</Text>\n\t\t\t\t) : (\n\t\t\t\t\t<Text\n\t\t\t\t\t\tstyle={ styles.selectColorText }\n\t\t\t\t\t\tmaxFontSizeMultiplier={ 2 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Select a color above' ) }\n\t\t\t\t\t</Text>\n\t\t\t\t) }\n\t\t\t\t<View style={ styles.flex }>\n\t\t\t\t\t{ currentValue && getClearButton() }\n\t\t\t\t</View>\n\t\t\t</View>\n\t\t);\n\t}\n\treturn (\n\t\t<View>\n\t\t\t{ ! hideNavigation && (\n\t\t\t\t<NavBar>\n\t\t\t\t\t<NavBar.BackButton onPress={ navigation.goBack } />\n\t\t\t\t\t<NavBar.Heading>{ label } </NavBar.Heading>\n\t\t\t\t</NavBar>\n\t\t\t) }\n\n\t\t\t<View style={ styles.colorPalettes }>\n\t\t\t\t{ currentSegmentColors.map( ( palette, paletteKey ) => {\n\t\t\t\t\tconst paletteSettings = {\n\t\t\t\t\t\tcolors: palette.colors,\n\t\t\t\t\t\tgradients: palette.gradients,\n\t\t\t\t\t\tallColors: allAvailableColors,\n\t\t\t\t\t\tallGradients: allAvailableGradients,\n\t\t\t\t\t};\n\t\t\t\t\t// Limit to show the custom indicator to the first available palette\n\t\t\t\t\tconst enableCustomColor = paletteKey === 0;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\t\tenableCustomColor={ enableCustomColor }\n\t\t\t\t\t\t\tlabel={ palette.name }\n\t\t\t\t\t\t\tkey={ paletteKey }\n\t\t\t\t\t\t\tsetColor={ setColor }\n\t\t\t\t\t\t\tactiveColor={ currentValue }\n\t\t\t\t\t\t\tisGradientColor={ isGradientColor }\n\t\t\t\t\t\t\tcurrentSegment={ currentSegment }\n\t\t\t\t\t\t\tonCustomPress={ onCustomPress }\n\t\t\t\t\t\t\tshouldEnableBottomSheetScroll={\n\t\t\t\t\t\t\t\tshouldEnableBottomSheetScroll\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdefaultSettings={ paletteSettings }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</View>\n\n\t\t\t{ isCustomGadientShown && (\n\t\t\t\t<>\n\t\t\t\t\t<View style={ horizontalSeparatorStyle } />\n\t\t\t\t\t<PanelBody>\n\t\t\t\t\t\t<ColorControl\n\t\t\t\t\t\t\tlabel={ __( 'Customize Gradient' ) }\n\t\t\t\t\t\t\tonPress={ onCustomPress }\n\t\t\t\t\t\t\twithColorIndicator={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</PanelBody>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t<View style={ horizontalSeparatorStyle } />\n\t\t\t{ getFooter() }\n\t\t</View>\n\t);\n};\n\nexport default PaletteScreen;\n"],"mappings":"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"}
+{"version":3,"names":["_reactNative","require","_i18n","_element","_compose","_components","_native","_colorPalette","_interopRequireDefault","_colorIndicator","_navBar","_segmentedControl","_utils","_style","HIT_SLOP","top","bottom","left","right","PaletteScreen","route","useRoute","navigation","useNavigation","shouldEnableBottomSheetScroll","useContext","BottomSheetContext","label","onColorChange","onGradientChange","onColorCleared","colorValue","defaultSettings","hideNavigation","params","segments","isGradient","colorsUtils","currentValue","setCurrentValue","useState","isGradientColor","selectedSegmentIndex","currentSegment","setCurrentSegment","isGradientSegment","currentSegmentColors","colors","gradients","allAvailableColors","useMobileGlobalStylesColors","allAvailableGradients","flatMap","filter","Boolean","horizontalSeparatorStyle","usePreferredColorSchemeStyle","styles","horizontalSeparator","horizontalSeparatorDark","clearButtonStyle","clearButton","clearButtonDark","selectedColorTextStyle","colorText","colorTextDark","isSolidSegment","isCustomGadientShown","setColor","color","onClear","undefined","onCustomPress","navigate","screens","picker","gradientPicker","getClearButton","_react","createElement","TouchableWithoutFeedback","accessibilityLabel","__","onPress","hitSlop","View","style","clearButtonContainer","Text","getFooter","default","segmentHandler","selectedIndex","indexOf","addonLeft","colorIndicator","addonRight","footer","flex","maxFontSizeMultiplier","selectable","toUpperCase","selectColorText","BackButton","goBack","Heading","colorPalettes","map","palette","paletteKey","paletteSettings","allColors","allGradients","enableCustomColor","name","key","activeColor","Fragment","PanelBody","ColorControl","withColorIndicator","_default","exports"],"sources":["@wordpress/components/src/mobile/color-settings/palette.screen.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View, Text, TouchableWithoutFeedback } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState, useContext } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\nimport {\n\tColorControl,\n\tPanelBody,\n\tBottomSheetContext,\n\tuseMobileGlobalStylesColors,\n} from '@wordpress/components';\nimport { useRoute, useNavigation } from '@react-navigation/native';\n\n/**\n * Internal dependencies\n */\nimport ColorPalette from '../../color-palette';\nimport ColorIndicator from '../../color-indicator';\nimport NavBar from '../bottom-sheet/nav-bar';\nimport SegmentedControls from '../segmented-control';\nimport { colorsUtils } from './utils';\n\nimport styles from './style.scss';\n\nconst HIT_SLOP = { top: 8, bottom: 8, left: 8, right: 8 };\n\nconst PaletteScreen = () => {\n\tconst route = useRoute();\n\tconst navigation = useNavigation();\n\tconst { shouldEnableBottomSheetScroll } = useContext( BottomSheetContext );\n\tconst {\n\t\tlabel,\n\t\tonColorChange,\n\t\tonGradientChange,\n\t\tonColorCleared,\n\t\tcolorValue,\n\t\tdefaultSettings,\n\t\thideNavigation = false,\n\t} = route.params || {};\n\tconst { segments, isGradient } = colorsUtils;\n\tconst [ currentValue, setCurrentValue ] = useState( colorValue );\n\tconst isGradientColor = isGradient( currentValue );\n\tconst selectedSegmentIndex = isGradientColor ? 1 : 0;\n\n\tconst [ currentSegment, setCurrentSegment ] = useState(\n\t\tsegments[ selectedSegmentIndex ]\n\t);\n\tconst isGradientSegment = currentSegment === colorsUtils.segments[ 1 ];\n\tconst currentSegmentColors = ! isGradientSegment\n\t\t? defaultSettings.colors\n\t\t: defaultSettings.gradients;\n\tconst allAvailableColors = useMobileGlobalStylesColors();\n\tconst allAvailableGradients = currentSegmentColors\n\t\t.flatMap( ( { gradients } ) => gradients )\n\t\t.filter( Boolean );\n\n\tconst horizontalSeparatorStyle = usePreferredColorSchemeStyle(\n\t\tstyles.horizontalSeparator,\n\t\tstyles.horizontalSeparatorDark\n\t);\n\tconst clearButtonStyle = usePreferredColorSchemeStyle(\n\t\tstyles.clearButton,\n\t\tstyles.clearButtonDark\n\t);\n\tconst selectedColorTextStyle = usePreferredColorSchemeStyle(\n\t\tstyles.colorText,\n\t\tstyles.colorTextDark\n\t);\n\n\tconst isSolidSegment = currentSegment === segments[ 0 ];\n\tconst isCustomGadientShown = ! isSolidSegment && isGradientColor;\n\n\tconst setColor = ( color ) => {\n\t\tsetCurrentValue( color );\n\t\tif ( isSolidSegment && onColorChange && onGradientChange ) {\n\t\t\tonColorChange( color );\n\t\t} else if ( isSolidSegment && onColorChange ) {\n\t\t\tonColorChange( color );\n\t\t} else if ( ! isSolidSegment && onGradientChange ) {\n\t\t\tonGradientChange( color );\n\t\t}\n\t};\n\n\tfunction onClear() {\n\t\tsetCurrentValue( undefined );\n\n\t\tif ( onColorCleared ) {\n\t\t\tonColorCleared();\n\t\t}\n\t}\n\n\tfunction onCustomPress() {\n\t\tif ( isSolidSegment ) {\n\t\t\tnavigation.navigate( colorsUtils.screens.picker, {\n\t\t\t\tcurrentValue,\n\t\t\t\tsetColor,\n\t\t\t} );\n\t\t} else {\n\t\t\tnavigation.navigate( colorsUtils.screens.gradientPicker, {\n\t\t\t\tsetColor,\n\t\t\t\tisGradientColor,\n\t\t\t\tcurrentValue,\n\t\t\t} );\n\t\t}\n\t}\n\n\tfunction getClearButton() {\n\t\treturn (\n\t\t\t<TouchableWithoutFeedback\n\t\t\t\taccessibilityLabel={ __( 'Clear selected color' ) }\n\t\t\t\tonPress={ onClear }\n\t\t\t\thitSlop={ HIT_SLOP }\n\t\t\t>\n\t\t\t\t<View style={ styles.clearButtonContainer }>\n\t\t\t\t\t<Text style={ clearButtonStyle }>{ __( 'Reset' ) }</Text>\n\t\t\t\t</View>\n\t\t\t</TouchableWithoutFeedback>\n\t\t);\n\t}\n\n\tfunction getFooter() {\n\t\tif ( onGradientChange ) {\n\t\t\treturn (\n\t\t\t\t<SegmentedControls\n\t\t\t\t\tsegments={ segments }\n\t\t\t\t\tsegmentHandler={ setCurrentSegment }\n\t\t\t\t\tselectedIndex={ segments.indexOf( currentSegment ) }\n\t\t\t\t\taddonLeft={\n\t\t\t\t\t\tcurrentValue && (\n\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\tcolor={ currentValue }\n\t\t\t\t\t\t\t\tstyle={ styles.colorIndicator }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\taddonRight={ currentValue && getClearButton() }\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\t\treturn (\n\t\t\t<View style={ styles.footer }>\n\t\t\t\t<View style={ styles.flex }>\n\t\t\t\t\t{ currentValue && (\n\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\tcolor={ currentValue }\n\t\t\t\t\t\t\tstyle={ styles.colorIndicator }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</View>\n\t\t\t\t{ currentValue ? (\n\t\t\t\t\t<Text\n\t\t\t\t\t\tstyle={ selectedColorTextStyle }\n\t\t\t\t\t\tmaxFontSizeMultiplier={ 2 }\n\t\t\t\t\t\tselectable\n\t\t\t\t\t>\n\t\t\t\t\t\t{ currentValue.toUpperCase() }\n\t\t\t\t\t</Text>\n\t\t\t\t) : (\n\t\t\t\t\t<Text\n\t\t\t\t\t\tstyle={ styles.selectColorText }\n\t\t\t\t\t\tmaxFontSizeMultiplier={ 2 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Select a color above' ) }\n\t\t\t\t\t</Text>\n\t\t\t\t) }\n\t\t\t\t<View style={ styles.flex }>\n\t\t\t\t\t{ currentValue && getClearButton() }\n\t\t\t\t</View>\n\t\t\t</View>\n\t\t);\n\t}\n\treturn (\n\t\t<View>\n\t\t\t{ ! hideNavigation && (\n\t\t\t\t<NavBar>\n\t\t\t\t\t<NavBar.BackButton onPress={ navigation.goBack } />\n\t\t\t\t\t<NavBar.Heading>{ label } </NavBar.Heading>\n\t\t\t\t</NavBar>\n\t\t\t) }\n\n\t\t\t<View style={ styles.colorPalettes }>\n\t\t\t\t{ currentSegmentColors.map( ( palette, paletteKey ) => {\n\t\t\t\t\tconst paletteSettings = {\n\t\t\t\t\t\tcolors: palette.colors,\n\t\t\t\t\t\tgradients: palette.gradients,\n\t\t\t\t\t\tallColors: allAvailableColors,\n\t\t\t\t\t\tallGradients: allAvailableGradients,\n\t\t\t\t\t};\n\t\t\t\t\t// Limit to show the custom indicator to the first available palette\n\t\t\t\t\tconst enableCustomColor = paletteKey === 0;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\t\tenableCustomColor={ enableCustomColor }\n\t\t\t\t\t\t\tlabel={ palette.name }\n\t\t\t\t\t\t\tkey={ paletteKey }\n\t\t\t\t\t\t\tsetColor={ setColor }\n\t\t\t\t\t\t\tactiveColor={ currentValue }\n\t\t\t\t\t\t\tisGradientColor={ isGradientColor }\n\t\t\t\t\t\t\tcurrentSegment={ currentSegment }\n\t\t\t\t\t\t\tonCustomPress={ onCustomPress }\n\t\t\t\t\t\t\tshouldEnableBottomSheetScroll={\n\t\t\t\t\t\t\t\tshouldEnableBottomSheetScroll\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdefaultSettings={ paletteSettings }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</View>\n\n\t\t\t{ isCustomGadientShown && (\n\t\t\t\t<>\n\t\t\t\t\t<View style={ horizontalSeparatorStyle } />\n\t\t\t\t\t<PanelBody>\n\t\t\t\t\t\t<ColorControl\n\t\t\t\t\t\t\tlabel={ __( 'Customize Gradient' ) }\n\t\t\t\t\t\t\tonPress={ onCustomPress }\n\t\t\t\t\t\t\twithColorIndicator={ false }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</PanelBody>\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t<View style={ horizontalSeparatorStyle } />\n\t\t\t{ getFooter() }\n\t\t</View>\n\t);\n};\n\nexport default PaletteScreen;\n"],"mappings":"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"}

package/build/navigable-container/container.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_dom","noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","Component","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","focus","tabbable","focusable","focusables","find","index","indexOf","event","cycle","eventToOffset","onNavigate","stopNavigationEvents","undefined","stopImmediatePropagation","targetRole","getAttribute","targetHasMenuItemRole","includes","preventDefault","activeElement","ownerDocument","context","nextIndex","length","code","render","children","restProps","_react","createElement","forwardedNavigableContainer","displayName","_default","exports","default","forwardRef"],"sources":["@wordpress/components/src/navigable-container/container.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Component, forwardRef } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport type { NavigableContainerProps } from './types';\n\nconst noop = () => {};\nconst MENU_ITEM_ROLES = [ 'menuitem', 'menuitemradio', 'menuitemcheckbox' ];\n\nfunction cycleValue( value: number, total: number, offset: number ) {\n\tconst nextValue = value + offset;\n\tif ( nextValue < 0 ) {\n\t\treturn total + nextValue;\n\t} else if ( nextValue >= total ) {\n\t\treturn nextValue - total;\n\t}\n\n\treturn nextValue;\n}\n\nclass NavigableContainer extends Component< NavigableContainerProps > {\n\tcontainer?: HTMLDivElement;\n\n\tconstructor( args: NavigableContainerProps ) {\n\t\tsuper( args );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.bindContainer = this.bindContainer.bind( this );\n\n\t\tthis.getFocusableContext = this.getFocusableContext.bind( this );\n\t\tthis.getFocusableIndex = this.getFocusableIndex.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We use DOM event listeners instead of React event listeners\n\t\t// because we want to catch events from the underlying DOM tree\n\t\t// The React Tree can be different from the DOM tree when using\n\t\t// portals. Block Toolbars for instance are rendered in a separate\n\t\t// React Trees.\n\t\tthis.container.addEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.container.removeEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tbindContainer( ref: HTMLDivElement ) {\n\t\tconst { forwardedRef } = this.props;\n\t\tthis.container = ref;\n\n\t\tif ( typeof forwardedRef === 'function' ) {\n\t\t\tforwardedRef( ref );\n\t\t} else if ( forwardedRef && 'current' in forwardedRef ) {\n\t\t\tforwardedRef.current = ref;\n\t\t}\n\t}\n\n\tgetFocusableContext( target: Element ) {\n\t\tif ( ! this.container ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst { onlyBrowserTabstops } = this.props;\n\t\tconst finder = onlyBrowserTabstops ? focus.tabbable : focus.focusable;\n\t\tconst focusables = finder.find( this.container ) as HTMLElement[];\n\n\t\tconst index = this.getFocusableIndex( focusables, target );\n\t\tif ( index > -1 && target ) {\n\t\t\treturn { index, target, focusables };\n\t\t}\n\t\treturn null;\n\t}\n\n\tgetFocusableIndex( focusables: Element[], target: Element ) {\n\t\treturn focusables.indexOf( target );\n\t}\n\n\tonKeyDown( event: KeyboardEvent ) {\n\t\tif ( this.props.onKeyDown ) {\n\t\t\tthis.props.onKeyDown( event );\n\t\t}\n\n\t\tconst { getFocusableContext } = this;\n\t\tconst {\n\t\t\tcycle = true,\n\t\t\teventToOffset,\n\t\t\tonNavigate = noop,\n\t\t\tstopNavigationEvents,\n\t\t} = this.props;\n\n\t\tconst offset = eventToOffset( event );\n\n\t\t// eventToOffset returns undefined if the event is not handled by the component.\n\t\tif ( offset !== undefined && stopNavigationEvents ) {\n\t\t\t// Prevents arrow key handlers bound to the document directly interfering.\n\t\t\tevent.stopImmediatePropagation();\n\n\t\t\t// When navigating a collection of items, prevent scroll containers\n\t\t\t// from scrolling. The preventDefault also prevents Voiceover from\n\t\t\t// 'handling' the event, as voiceover will try to use arrow keys\n\t\t\t// for highlighting text.\n\t\t\tconst targetRole = (\n\t\t\t\tevent.target as HTMLDivElement | null\n\t\t\t )?.getAttribute( 'role' );\n\t\t\tconst targetHasMenuItemRole =\n\t\t\t\t!! targetRole && MENU_ITEM_ROLES.includes( targetRole );\n\n\t\t\tif ( targetHasMenuItemRole ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tif ( ! offset ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeElement = ( event.target as HTMLElement | null )\n\t\t\t?.ownerDocument?.activeElement;\n\t\tif ( ! activeElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst context = getFocusableContext( activeElement );\n\t\tif ( ! context ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { index, focusables } = context;\n\t\tconst nextIndex = cycle\n\t\t\t? cycleValue( index, focusables.length, offset )\n\t\t\t: index + offset;\n\n\t\tif ( nextIndex >= 0 && nextIndex < focusables.length ) {\n\t\t\tfocusables[ nextIndex ].focus();\n\t\t\tonNavigate( nextIndex, focusables[ nextIndex ] );\n\n\t\t\t// `preventDefault()` on tab to avoid having the browser move the focus\n\t\t\t// after this component has already moved it.\n\t\t\tif ( event.code === 'Tab' ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tstopNavigationEvents,\n\t\t\teventToOffset,\n\t\t\tonNavigate,\n\t\t\tonKeyDown,\n\t\t\tcycle,\n\t\t\tonlyBrowserTabstops,\n\t\t\tforwardedRef,\n\t\t\t...restProps\n\t\t} = this.props;\n\t\treturn (\n\t\t\t<div ref={ this.bindContainer } { ...restProps }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nconst forwardedNavigableContainer = (\n\tprops: NavigableContainerProps,\n\tref: ForwardedRef< HTMLDivElement >\n) => {\n\treturn <NavigableContainer { ...props } forwardedRef={ ref } />;\n};\nforwardedNavigableContainer.displayName = 'NavigableContainer';\n\nexport default forwardRef( forwardedNavigableContainer );\n"],"mappings":";;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,IAAA,GAAAD,OAAA;AATA;AACA;AACA;;AAGA;AACA;AACA;;AASA,MAAME,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AACrB,MAAMC,eAAe,GAAG,CAAE,UAAU,EAAE,eAAe,EAAE,kBAAkB,CAAE;AAE3E,SAASC,UAAUA,CAAEC,KAAa,EAAEC,KAAa,EAAEC,MAAc,EAAG;EACnE,MAAMC,SAAS,GAAGH,KAAK,GAAGE,MAAM;EAChC,IAAKC,SAAS,GAAG,CAAC,EAAG;IACpB,OAAOF,KAAK,GAAGE,SAAS;EACzB,CAAC,MAAM,IAAKA,SAAS,IAAIF,KAAK,EAAG;IAChC,OAAOE,SAAS,GAAGF,KAAK;EACzB;EAEA,OAAOE,SAAS;AACjB;AAEA,MAAMC,kBAAkB,SAASC,kBAAS,CAA4B;EAGrEC,WAAWA,CAAEC,IAA6B,EAAG;IAC5C,KAAK,CAAEA,IAAK,CAAC;IACb,IAAI,CAACC,SAAS,GAAG,IAAI,CAACA,SAAS,CAACC,IAAI,CAAE,IAAK,CAAC;IAC5C,IAAI,CAACC,aAAa,GAAG,IAAI,CAACA,aAAa,CAACD,IAAI,CAAE,IAAK,CAAC;IAEpD,IAAI,CAACE,mBAAmB,GAAG,IAAI,CAACA,mBAAmB,CAACF,IAAI,CAAE,IAAK,CAAC;IAChE,IAAI,CAACG,iBAAiB,GAAG,IAAI,CAACA,iBAAiB,CAACH,IAAI,CAAE,IAAK,CAAC;EAC7D;EAEAI,iBAAiBA,CAAA,EAAG;IACnB,IAAK,CAAE,IAAI,CAACC,SAAS,EAAG;MACvB;IACD;;IAEA;IACA;IACA;IACA;IACA;IACA,IAAI,CAACA,SAAS,CAACC,gBAAgB,CAAE,SAAS,EAAE,IAAI,CAACP,SAAU,CAAC;EAC7D;EAEAQ,oBAAoBA,CAAA,EAAG;IACtB,IAAK,CAAE,IAAI,CAACF,SAAS,EAAG;MACvB;IACD;IAEA,IAAI,CAACA,SAAS,CAACG,mBAAmB,CAAE,SAAS,EAAE,IAAI,CAACT,SAAU,CAAC;EAChE;EAEAE,aAAaA,CAAEQ,GAAmB,EAAG;IACpC,MAAM;MAAEC;IAAa,CAAC,GAAG,IAAI,CAACC,KAAK;IACnC,IAAI,CAACN,SAAS,GAAGI,GAAG;IAEpB,IAAK,OAAOC,YAAY,KAAK,UAAU,EAAG;MACzCA,YAAY,CAAED,GAAI,CAAC;IACpB,CAAC,MAAM,IAAKC,YAAY,IAAI,SAAS,IAAIA,YAAY,EAAG;MACvDA,YAAY,CAACE,OAAO,GAAGH,GAAG;IAC3B;EACD;EAEAP,mBAAmBA,CAAEW,MAAe,EAAG;IACtC,IAAK,CAAE,IAAI,CAACR,SAAS,EAAG;MACvB,OAAO,IAAI;IACZ;IAEA,MAAM;MAAES;IAAoB,CAAC,GAAG,IAAI,CAACH,KAAK;IAC1C,MAAMI,MAAM,GAAGD,mBAAmB,GAAGE,UAAK,CAACC,QAAQ,GAAGD,UAAK,CAACE,SAAS;IACrE,MAAMC,UAAU,GAAGJ,MAAM,CAACK,IAAI,CAAE,IAAI,CAACf,SAAU,CAAkB;IAEjE,MAAMgB,KAAK,GAAG,IAAI,CAAClB,iBAAiB,CAAEgB,UAAU,EAAEN,MAAO,CAAC;IAC1D,IAAKQ,KAAK,GAAG,CAAC,CAAC,IAAIR,MAAM,EAAG;MAC3B,OAAO;QAAEQ,KAAK;QAAER,MAAM;QAAEM;MAAW,CAAC;IACrC;IACA,OAAO,IAAI;EACZ;EAEAhB,iBAAiBA,CAAEgB,UAAqB,EAAEN,MAAe,EAAG;IAC3D,OAAOM,UAAU,CAACG,OAAO,CAAET,MAAO,CAAC;EACpC;EAEAd,SAASA,CAAEwB,KAAoB,EAAG;IACjC,IAAK,IAAI,CAACZ,KAAK,CAACZ,SAAS,EAAG;MAC3B,IAAI,CAACY,KAAK,CAACZ,SAAS,CAAEwB,KAAM,CAAC;IAC9B;IAEA,MAAM;MAAErB;IAAoB,CAAC,GAAG,IAAI;IACpC,MAAM;MACLsB,KAAK,GAAG,IAAI;MACZC,aAAa;MACbC,UAAU,GAAGtC,IAAI;MACjBuC;IACD,CAAC,GAAG,IAAI,CAAChB,KAAK;IAEd,MAAMlB,MAAM,GAAGgC,aAAa,CAAEF,KAAM,CAAC;;IAErC;IACA,IAAK9B,MAAM,KAAKmC,SAAS,IAAID,oBAAoB,EAAG;MACnD;MACAJ,KAAK,CAACM,wBAAwB,CAAC,CAAC;;MAEhC;MACA;MACA;MACA;MACA,MAAMC,UAAU,GACfP,KAAK,CAACV,MAAM,EACTkB,YAAY,CAAE,MAAO,CAAC;MAC1B,MAAMC,qBAAqB,GAC1B,CAAC,CAAEF,UAAU,IAAIzC,eAAe,CAAC4C,QAAQ,CAAEH,UAAW,CAAC;MAExD,IAAKE,qBAAqB,EAAG;QAC5BT,KAAK,CAACW,cAAc,CAAC,CAAC;MACvB;IACD;IAEA,IAAK,CAAEzC,MAAM,EAAG;MACf;IACD;IAEA,MAAM0C,aAAa,GAAKZ,KAAK,CAACV,MAAM,EACjCuB,aAAa,EAAED,aAAa;IAC/B,IAAK,CAAEA,aAAa,EAAG;MACtB;IACD;IAEA,MAAME,OAAO,GAAGnC,mBAAmB,CAAEiC,aAAc,CAAC;IACpD,IAAK,CAAEE,OAAO,EAAG;MAChB;IACD;IAEA,MAAM;MAAEhB,KAAK;MAAEF;IAAW,CAAC,GAAGkB,OAAO;IACrC,MAAMC,SAAS,GAAGd,KAAK,GACpBlC,UAAU,CAAE+B,KAAK,EAAEF,UAAU,CAACoB,MAAM,EAAE9C,MAAO,CAAC,GAC9C4B,KAAK,GAAG5B,MAAM;IAEjB,IAAK6C,SAAS,IAAI,CAAC,IAAIA,SAAS,GAAGnB,UAAU,CAACoB,MAAM,EAAG;MACtDpB,UAAU,CAAEmB,SAAS,CAAE,CAACtB,KAAK,CAAC,CAAC;MAC/BU,UAAU,CAAEY,SAAS,EAAEnB,UAAU,CAAEmB,SAAS,CAAG,CAAC;;MAEhD;MACA;MACA,IAAKf,KAAK,CAACiB,IAAI,KAAK,KAAK,EAAG;QAC3BjB,KAAK,CAACW,cAAc,CAAC,CAAC;MACvB;IACD;EACD;EAEAO,MAAMA,CAAA,EAAG;IACR,MAAM;MACLC,QAAQ;MACRf,oBAAoB;MACpBF,aAAa;MACbC,UAAU;MACV3B,SAAS;MACTyB,KAAK;MACLV,mBAAmB;MACnBJ,YAAY;MACZ,GAAGiC;IACJ,CAAC,GAAG,IAAI,CAAChC,KAAK;IACd,OACC,IAAAiC,MAAA,CAAAC,aAAA;MAAKpC,GAAG,EAAG,IAAI,CAACR,aAAe;MAAA,GAAM0C;IAAS,GAC3CD,QACE,CAAC;EAER;AACD;AAEA,MAAMI,2BAA2B,GAAGA,CACnCnC,KAA8B,EAC9BF,GAAmC,KAC/B;EACJ,OAAO,IAAAmC,MAAA,CAAAC,aAAA,EAAClD,kBAAkB;IAAA,GAAMgB,KAAK;IAAGD,YAAY,EAAGD;EAAK,CAAE,CAAC;AAChE,CAAC;AACDqC,2BAA2B,CAACC,WAAW,GAAG,oBAAoB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEhD,IAAAC,mBAAU,EAAEL,2BAA4B,CAAC"}
+{"version":3,"names":["_element","require","_dom","noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","Component","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","focus","tabbable","focusable","focusables","find","index","indexOf","event","cycle","eventToOffset","onNavigate","stopNavigationEvents","undefined","stopImmediatePropagation","targetRole","getAttribute","targetHasMenuItemRole","includes","preventDefault","activeElement","ownerDocument","context","nextIndex","length","code","render","children","restProps","_react","createElement","forwardedNavigableContainer","displayName","_default","exports","default","forwardRef"],"sources":["@wordpress/components/src/navigable-container/container.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { Component, forwardRef } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport type { NavigableContainerProps } from './types';\n\nconst noop = () => {};\nconst MENU_ITEM_ROLES = [ 'menuitem', 'menuitemradio', 'menuitemcheckbox' ];\n\nfunction cycleValue( value: number, total: number, offset: number ) {\n\tconst nextValue = value + offset;\n\tif ( nextValue < 0 ) {\n\t\treturn total + nextValue;\n\t} else if ( nextValue >= total ) {\n\t\treturn nextValue - total;\n\t}\n\n\treturn nextValue;\n}\n\nclass NavigableContainer extends Component< NavigableContainerProps > {\n\tcontainer?: HTMLDivElement;\n\n\tconstructor( args: NavigableContainerProps ) {\n\t\tsuper( args );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.bindContainer = this.bindContainer.bind( this );\n\n\t\tthis.getFocusableContext = this.getFocusableContext.bind( this );\n\t\tthis.getFocusableIndex = this.getFocusableIndex.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We use DOM event listeners instead of React event listeners\n\t\t// because we want to catch events from the underlying DOM tree\n\t\t// The React Tree can be different from the DOM tree when using\n\t\t// portals. Block Toolbars for instance are rendered in a separate\n\t\t// React Trees.\n\t\tthis.container.addEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.container.removeEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tbindContainer( ref: HTMLDivElement ) {\n\t\tconst { forwardedRef } = this.props;\n\t\tthis.container = ref;\n\n\t\tif ( typeof forwardedRef === 'function' ) {\n\t\t\tforwardedRef( ref );\n\t\t} else if ( forwardedRef && 'current' in forwardedRef ) {\n\t\t\tforwardedRef.current = ref;\n\t\t}\n\t}\n\n\tgetFocusableContext( target: Element ) {\n\t\tif ( ! this.container ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst { onlyBrowserTabstops } = this.props;\n\t\tconst finder = onlyBrowserTabstops ? focus.tabbable : focus.focusable;\n\t\tconst focusables = finder.find( this.container );\n\n\t\tconst index = this.getFocusableIndex( focusables, target );\n\t\tif ( index > -1 && target ) {\n\t\t\treturn { index, target, focusables };\n\t\t}\n\t\treturn null;\n\t}\n\n\tgetFocusableIndex( focusables: Element[], target: Element ) {\n\t\treturn focusables.indexOf( target );\n\t}\n\n\tonKeyDown( event: KeyboardEvent ) {\n\t\tif ( this.props.onKeyDown ) {\n\t\t\tthis.props.onKeyDown( event );\n\t\t}\n\n\t\tconst { getFocusableContext } = this;\n\t\tconst {\n\t\t\tcycle = true,\n\t\t\teventToOffset,\n\t\t\tonNavigate = noop,\n\t\t\tstopNavigationEvents,\n\t\t} = this.props;\n\n\t\tconst offset = eventToOffset( event );\n\n\t\t// eventToOffset returns undefined if the event is not handled by the component.\n\t\tif ( offset !== undefined && stopNavigationEvents ) {\n\t\t\t// Prevents arrow key handlers bound to the document directly interfering.\n\t\t\tevent.stopImmediatePropagation();\n\n\t\t\t// When navigating a collection of items, prevent scroll containers\n\t\t\t// from scrolling. The preventDefault also prevents Voiceover from\n\t\t\t// 'handling' the event, as voiceover will try to use arrow keys\n\t\t\t// for highlighting text.\n\t\t\tconst targetRole = (\n\t\t\t\tevent.target as HTMLDivElement | null\n\t\t\t )?.getAttribute( 'role' );\n\t\t\tconst targetHasMenuItemRole =\n\t\t\t\t!! targetRole && MENU_ITEM_ROLES.includes( targetRole );\n\n\t\t\tif ( targetHasMenuItemRole ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tif ( ! offset ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeElement = ( event.target as HTMLElement | null )\n\t\t\t?.ownerDocument?.activeElement;\n\t\tif ( ! activeElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst context = getFocusableContext( activeElement );\n\t\tif ( ! context ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { index, focusables } = context;\n\t\tconst nextIndex = cycle\n\t\t\t? cycleValue( index, focusables.length, offset )\n\t\t\t: index + offset;\n\n\t\tif ( nextIndex >= 0 && nextIndex < focusables.length ) {\n\t\t\tfocusables[ nextIndex ].focus();\n\t\t\tonNavigate( nextIndex, focusables[ nextIndex ] );\n\n\t\t\t// `preventDefault()` on tab to avoid having the browser move the focus\n\t\t\t// after this component has already moved it.\n\t\t\tif ( event.code === 'Tab' ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tstopNavigationEvents,\n\t\t\teventToOffset,\n\t\t\tonNavigate,\n\t\t\tonKeyDown,\n\t\t\tcycle,\n\t\t\tonlyBrowserTabstops,\n\t\t\tforwardedRef,\n\t\t\t...restProps\n\t\t} = this.props;\n\t\treturn (\n\t\t\t<div ref={ this.bindContainer } { ...restProps }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nconst forwardedNavigableContainer = (\n\tprops: NavigableContainerProps,\n\tref: ForwardedRef< HTMLDivElement >\n) => {\n\treturn <NavigableContainer { ...props } forwardedRef={ ref } />;\n};\nforwardedNavigableContainer.displayName = 'NavigableContainer';\n\nexport default forwardRef( forwardedNavigableContainer );\n"],"mappings":"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"}

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

@@ -25,14 +25,127 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  */
 
 const MAX_HISTORY_LENGTH = 50;
-function screensReducer(state = [], action) {
+function addScreen({
+  screens
+}, screen) {
+  return [...screens, screen];
+}
+function removeScreen({
+  screens
+}, screen) {
+  return screens.filter(s => s.id !== screen.id);
+}
+function goBack({
+  locationHistory
+}) {
+  if (locationHistory.length <= 1) {
+    return locationHistory;
+  }
+  return [...locationHistory.slice(0, -2), {
+    ...locationHistory[locationHistory.length - 2],
+    isBack: true,
+    hasRestoredFocus: false
+  }];
+}
+function goTo(state, path, options = {}) {
+  const {
+    locationHistory
+  } = state;
+  const {
+    focusTargetSelector,
+    isBack = false,
+    skipFocus = false,
+    replace = false,
+    ...restOptions
+  } = options;
+  const isNavigatingToPreviousPath = isBack && locationHistory.length > 1 && locationHistory[locationHistory.length - 2].path === path;
+  if (isNavigatingToPreviousPath) {
+    return goBack(state);
+  }
+  const newLocation = {
+    ...restOptions,
+    path,
+    isBack,
+    hasRestoredFocus: false,
+    skipFocus
+  };
+  if (locationHistory.length === 0) {
+    return replace ? [] : [newLocation];
+  }
+  const newLocationHistory = locationHistory.slice(locationHistory.length > MAX_HISTORY_LENGTH - 1 ? 1 : 0, -1);
+  if (!replace) {
+    newLocationHistory.push(
+    // Assign `focusTargetSelector` to the previous location in history
+    // (the one we just navigated from).
+    {
+      ...locationHistory[locationHistory.length - 1],
+      focusTargetSelector
+    });
+  }
+  newLocationHistory.push(newLocation);
+  return newLocationHistory;
+}
+function goToParent(state, options = {}) {
+  const {
+    locationHistory,
+    screens
+  } = state;
+  const currentPath = locationHistory[locationHistory.length - 1].path;
+  if (currentPath === undefined) {
+    return locationHistory;
+  }
+  const parentPath = (0, _router.findParent)(currentPath, screens);
+  if (parentPath === undefined) {
+    return locationHistory;
+  }
+  return goTo(state, parentPath, {
+    ...options,
+    isBack: true
+  });
+}
+function routerReducer(state, action) {
+  let {
+    screens,
+    locationHistory,
+    matchedPath
+  } = state;
   switch (action.type) {
     case 'add':
-      return [...state, action.screen];
+      screens = addScreen(state, action.screen);
+      break;
     case 'remove':
-      return state.filter(s => s.id !== action.screen.id);
+      screens = removeScreen(state, action.screen);
+      break;
+    case 'goback':
+      locationHistory = goBack(state);
+      break;
+    case 'goto':
+      locationHistory = goTo(state, action.path, action.options);
+      break;
+    case 'gotoparent':
+      locationHistory = goToParent(state, action.options);
+      break;
+  }
+
+  // Return early in case there is no change
+  if (screens === state.screens && locationHistory === state.locationHistory) {
+    return state;
   }
-  return state;
+
+  // Compute the matchedPath
+  const currentPath = locationHistory.length > 0 ? locationHistory[locationHistory.length - 1].path : undefined;
+  matchedPath = currentPath !== undefined ? (0, _router.patternMatch)(currentPath, screens) : undefined;
+
+  // If the new match is the same as the previous match,
+  // return the previous one to keep immutability.
+  if (matchedPath && state.matchedPath && matchedPath.id === state.matchedPath.id && (0, _isShallowEqual.default)(matchedPath.params, state.matchedPath.params)) {
+    matchedPath = state.matchedPath;
+  }
+  return {
+    screens,
+    locationHistory,
+    matchedPath
+  };
 }
 function UnconnectedNavigatorProvider(props, forwardedRef) {
   const {
@@ -41,124 +154,53 @@ function UnconnectedNavigatorProvider(props, forwardedRef) {
     className,
     ...otherProps
   } = (0, _context.useContextSystem)(props, 'NavigatorProvider');
-  const [locationHistory, setLocationHistory] = (0, _element.useState)([{
-    path: initialPath
-  }]);
-  const currentLocationHistory = (0, _element.useRef)([]);
-  const [screens, dispatch] = (0, _element.useReducer)(screensReducer, []);
-  const currentScreens = (0, _element.useRef)([]);
-  (0, _element.useEffect)(() => {
-    currentScreens.current = screens;
-  }, [screens]);
-  (0, _element.useEffect)(() => {
-    currentLocationHistory.current = locationHistory;
-  }, [locationHistory]);
-  const currentMatch = (0, _element.useRef)();
-  const matchedPath = (0, _element.useMemo)(() => {
-    let currentPath;
-    if (locationHistory.length === 0 || (currentPath = locationHistory[locationHistory.length - 1].path) === undefined) {
-      currentMatch.current = undefined;
-      return undefined;
-    }
-    const resolvePath = path => {
-      const newMatch = (0, _router.patternMatch)(path, screens);
+  const [routerState, dispatch] = (0, _element.useReducer)(routerReducer, initialPath, path => ({
+    screens: [],
+    locationHistory: [{
+      path
+    }],
+    matchedPath: undefined
+  }));
 
-      // If the new match is the same as the current match,
-      // return the previous one for performance reasons.
-      if (currentMatch.current && newMatch && (0, _isShallowEqual.default)(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 = (0, _element.useCallback)(screen => dispatch({
-    type: 'add',
-    screen
+  // The methods are constant forever, create stable references to them.
+  const methods = (0, _element.useMemo)(() => ({
+    goBack: () => dispatch({
+      type: 'goback'
+    }),
+    goTo: (path, options) => dispatch({
+      type: 'goto',
+      path,
+      options
+    }),
+    goToParent: options => dispatch({
+      type: 'gotoparent',
+      options
+    }),
+    addScreen: screen => dispatch({
+      type: 'add',
+      screen
+    }),
+    removeScreen: screen => dispatch({
+      type: 'remove',
+      screen
+    })
   }), []);
-  const removeScreen = (0, _element.useCallback)(screen => dispatch({
-    type: 'remove',
-    screen
-  }), []);
-  const goBack = (0, _element.useCallback)(() => {
-    setLocationHistory(prevLocationHistory => {
-      if (prevLocationHistory.length <= 1) {
-        return prevLocationHistory;
-      }
-      return [...prevLocationHistory.slice(0, -2), {
-        ...prevLocationHistory[prevLocationHistory.length - 2],
-        isBack: true,
-        hasRestoredFocus: false
-      }];
-    });
-  }, []);
-  const goTo = (0, _element.useCallback)((path, options = {}) => {
-    const {
-      focusTargetSelector,
-      isBack = false,
-      skipFocus = false,
-      replace = 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,
-        skipFocus
-      };
-      if (prevLocationHistory.length === 0) {
-        return replace ? [] : [newLocation];
-      }
-      const newLocationHistory = prevLocationHistory.slice(prevLocationHistory.length > MAX_HISTORY_LENGTH - 1 ? 1 : 0, -1);
-      if (!replace) {
-        newLocationHistory.push(
-        // Assign `focusTargetSelector` to the previous location in history
-        // (the one we just navigated from).
-        {
-          ...prevLocationHistory[prevLocationHistory.length - 1],
-          focusTargetSelector
-        });
-      }
-      newLocationHistory.push(newLocation);
-      return newLocationHistory;
-    });
-  }, [goBack]);
-  const goToParent = (0, _element.useCallback)((options = {}) => {
-    const currentPath = currentLocationHistory.current[currentLocationHistory.current.length - 1].path;
-    if (currentPath === undefined) {
-      return;
-    }
-    const parentPath = (0, _router.findParent)(currentPath, currentScreens.current);
-    if (parentPath === undefined) {
-      return;
-    }
-    goTo(parentPath, {
-      ...options,
-      isBack: true
-    });
-  }, [goTo]);
-  const navigatorContextValue = (0, _element.useMemo)(() => ({
-    location: {
-      ...locationHistory[locationHistory.length - 1],
-      isInitial: locationHistory.length === 1
-    },
-    params: matchedPath ? matchedPath.params : {},
-    match: matchedPath ? matchedPath.id : undefined,
-    goTo,
-    goBack,
-    goToParent,
-    addScreen,
-    removeScreen
-  }), [locationHistory, matchedPath, goTo, goBack, goToParent, addScreen, removeScreen]);
+  const {
+    locationHistory,
+    matchedPath
+  } = routerState;
+  const navigatorContextValue = (0, _element.useMemo)(() => {
+    var _matchedPath$params;
+    return {
+      location: {
+        ...locationHistory[locationHistory.length - 1],
+        isInitial: locationHistory.length === 1
+      },
+      params: (_matchedPath$params = matchedPath?.params) !== null && _matchedPath$params !== void 0 ? _matchedPath$params : {},
+      match: matchedPath?.id,
+      ...methods
+    };
+  }, [locationHistory, matchedPath, methods]);
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => cx(styles.navigatorProviderWrapper, className), [className, cx]);
   return (0, _react.createElement)(_view.View, {

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

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_isShallowEqual","_interopRequireDefault","_context","_useCx","_router","_view","_context2","styles","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","MAX_HISTORY_LENGTH","screensReducer","state","action","type","screen","filter","s","id","UnconnectedNavigatorProvider","props","forwardedRef","initialPath","children","className","otherProps","useContextSystem","locationHistory","setLocationHistory","useState","path","currentLocationHistory","useRef","screens","dispatch","useReducer","currentScreens","useEffect","current","currentMatch","matchedPath","useMemo","currentPath","length","undefined","resolvePath","newMatch","patternMatch","isShallowEqual","params","addScreen","useCallback","removeScreen","goBack","prevLocationHistory","slice","isBack","hasRestoredFocus","goTo","options","focusTargetSelector","skipFocus","replace","restOptions","isNavigatingToPreviousPath","newLocation","newLocationHistory","push","goToParent","parentPath","findParent","navigatorContextValue","location","isInitial","match","cx","useCx","classes","navigatorProviderWrapper","_react","createElement","View","ref","NavigatorContext","Provider","value","NavigatorProvider","exports","contextConnect","_default"],"sources":["@wordpress/components/src/navigator/navigator-provider/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from '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 type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport { patternMatch, findParent } from '../utils/router';\nimport { View } from '../../view';\nimport { NavigatorContext } from '../context';\nimport * as styles from '../styles';\nimport type {\n\tNavigatorProviderProps,\n\tNavigatorLocation,\n\tNavigatorContext as NavigatorContextType,\n\tScreen,\n} from '../types';\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\tskipFocus = false,\n\t\t\t\treplace = 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\tskipFocus,\n\t\t\t\t};\n\n\t\t\t\tif ( prevLocationHistory.length === 0 ) {\n\t\t\t\t\treturn replace ? [] : [ newLocation ];\n\t\t\t\t}\n\n\t\t\t\tconst newLocationHistory = prevLocationHistory.slice(\n\t\t\t\t\tprevLocationHistory.length > MAX_HISTORY_LENGTH - 1 ? 1 : 0,\n\t\t\t\t\t-1\n\t\t\t\t);\n\n\t\t\t\tif ( ! replace ) {\n\t\t\t\t\tnewLocationHistory.push(\n\t\t\t\t\t\t// Assign `focusTargetSelector` to the previous location in history\n\t\t\t\t\t\t// (the one we just navigated from).\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t...prevLocationHistory[\n\t\t\t\t\t\t\t\tprevLocationHistory.length - 1\n\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\tfocusTargetSelector,\n\t\t\t\t\t\t}\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\tnewLocationHistory.push( newLocation );\n\n\t\t\t\treturn newLocationHistory;\n\t\t\t} );\n\t\t},\n\t\t[ goBack ]\n\t);\n\n\tconst goToParent: NavigatorContextType[ 'goToParent' ] = useCallback(\n\t\t( options = {} ) => {\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, { ...options, isBack: true } );\n\t\t},\n\t\t[ goTo ]\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\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() => cx( styles.navigatorProviderWrapper, 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 * ```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"],"mappings":";;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAQA,IAAAC,eAAA,GAAAC,sBAAA,CAAAF,OAAA;AAMA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,KAAA,GAAAN,OAAA;AACA,IAAAO,SAAA,GAAAP,OAAA;AACA,IAAAQ,MAAA,GAAAC,uBAAA,CAAAT,OAAA;AAAoC,SAAAU,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAF,wBAAAE,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AA3BpC;AACA;AACA;;AAGA;AACA;AACA;;AA+BA,MAAMY,kBAAkB,GAAG,EAAE;AAE7B,SAASC,cAAcA,CACtBC,KAAe,GAAG,EAAE,EACpBC,MAAoB,EACT;EACX,QAASA,MAAM,CAACC,IAAI;IACnB,KAAK,KAAK;MACT,OAAO,CAAE,GAAGF,KAAK,EAAEC,MAAM,CAACE,MAAM,CAAE;IACnC,KAAK,QAAQ;MACZ,OAAOH,KAAK,CAACI,MAAM,CAAIC,CAAS,IAAMA,CAAC,CAACC,EAAE,KAAKL,MAAM,CAACE,MAAM,CAACG,EAAG,CAAC;EACnE;EAEA,OAAON,KAAK;AACb;AAEA,SAASO,4BAA4BA,CACpCC,KAA+D,EAC/DC,YAAiC,EAChC;EACD,MAAM;IAAEC,WAAW;IAAEC,QAAQ;IAAEC,SAAS;IAAE,GAAGC;EAAW,CAAC,GACxD,IAAAC,yBAAgB,EAAEN,KAAK,EAAE,mBAAoB,CAAC;EAE/C,MAAM,CAAEO,eAAe,EAAEC,kBAAkB,CAAE,GAAG,IAAAC,iBAAQ,EAErD,CACF;IACCC,IAAI,EAAER;EACP,CAAC,CACA,CAAC;EACH,MAAMS,sBAAsB,GAAG,IAAAC,eAAM,EAAyB,EAAG,CAAC;EAClE,MAAM,CAAEC,OAAO,EAAEC,QAAQ,CAAE,GAAG,IAAAC,mBAAU,EAAExB,cAAc,EAAE,EAAG,CAAC;EAC9D,MAAMyB,cAAc,GAAG,IAAAJ,eAAM,EAAc,EAAG,CAAC;EAC/C,IAAAK,kBAAS,EAAE,MAAM;IAChBD,cAAc,CAACE,OAAO,GAAGL,OAAO;EACjC,CAAC,EAAE,CAAEA,OAAO,CAAG,CAAC;EAChB,IAAAI,kBAAS,EAAE,MAAM;IAChBN,sBAAsB,CAACO,OAAO,GAAGX,eAAe;EACjD,CAAC,EAAE,CAAEA,eAAe,CAAG,CAAC;EACxB,MAAMY,YAAY,GAAG,IAAAP,eAAM,EAAgB,CAAC;EAC5C,MAAMQ,WAAW,GAAG,IAAAC,gBAAO,EAAE,MAAM;IAClC,IAAIC,WAA+B;IACnC,IACCf,eAAe,CAACgB,MAAM,KAAK,CAAC,IAC5B,CAAED,WAAW,GACZf,eAAe,CAAEA,eAAe,CAACgB,MAAM,GAAG,CAAC,CAAE,CAACb,IAAI,MAClDc,SAAS,EACT;MACDL,YAAY,CAACD,OAAO,GAAGM,SAAS;MAChC,OAAOA,SAAS;IACjB;IAEA,MAAMC,WAAW,GAAKf,IAAY,IAAM;MACvC,MAAMgB,QAAQ,GAAG,IAAAC,oBAAY,EAAEjB,IAAI,EAAEG,OAAQ,CAAC;;MAE9C;MACA;MACA,IACCM,YAAY,CAACD,OAAO,IACpBQ,QAAQ,IACR,IAAAE,uBAAc,EACbF,QAAQ,CAACG,MAAM,EACfV,YAAY,CAACD,OAAO,CAACW,MACtB,CAAC,IACDH,QAAQ,CAAC5B,EAAE,KAAKqB,YAAY,CAACD,OAAO,CAACpB,EAAE,EACtC;QACD,OAAOqB,YAAY,CAACD,OAAO;MAC5B;MAEA,OAAOQ,QAAQ;IAChB,CAAC;IAED,MAAMA,QAAQ,GAAGD,WAAW,CAAEH,WAAY,CAAC;IAC3CH,YAAY,CAACD,OAAO,GAAGQ,QAAQ;IAC/B,OAAOA,QAAQ;EAChB,CAAC,EAAE,CAAEb,OAAO,EAAEN,eAAe,CAAG,CAAC;EAEjC,MAAMuB,SAAS,GAAG,IAAAC,oBAAW,EAC1BpC,MAAc,IAAMmB,QAAQ,CAAE;IAAEpB,IAAI,EAAE,KAAK;IAAEC;EAAO,CAAE,CAAC,EACzD,EACD,CAAC;EAED,MAAMqC,YAAY,GAAG,IAAAD,oBAAW,EAC7BpC,MAAc,IAAMmB,QAAQ,CAAE;IAAEpB,IAAI,EAAE,QAAQ;IAAEC;EAAO,CAAE,CAAC,EAC5D,EACD,CAAC;EAED,MAAMsC,MAAwC,GAAG,IAAAF,oBAAW,EAAE,MAAM;IACnEvB,kBAAkB,CAAI0B,mBAAmB,IAAM;MAC9C,IAAKA,mBAAmB,CAACX,MAAM,IAAI,CAAC,EAAG;QACtC,OAAOW,mBAAmB;MAC3B;MACA,OAAO,CACN,GAAGA,mBAAmB,CAACC,KAAK,CAAE,CAAC,EAAE,CAAC,CAAE,CAAC,EACrC;QACC,GAAGD,mBAAmB,CAAEA,mBAAmB,CAACX,MAAM,GAAG,CAAC,CAAE;QACxDa,MAAM,EAAE,IAAI;QACZC,gBAAgB,EAAE;MACnB,CAAC,CACD;IACF,CAAE,CAAC;EACJ,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMC,IAAoC,GAAG,IAAAP,oBAAW,EACvD,CAAErB,IAAI,EAAE6B,OAAO,GAAG,CAAC,CAAC,KAAM;IACzB,MAAM;MACLC,mBAAmB;MACnBJ,MAAM,GAAG,KAAK;MACdK,SAAS,GAAG,KAAK;MACjBC,OAAO,GAAG,KAAK;MACf,GAAGC;IACJ,CAAC,GAAGJ,OAAO;IAEX,MAAMK,0BAA0B,GAC/BR,MAAM,IACNzB,sBAAsB,CAACO,OAAO,CAACK,MAAM,GAAG,CAAC,IACzCZ,sBAAsB,CAACO,OAAO,CAC7BP,sBAAsB,CAACO,OAAO,CAACK,MAAM,GAAG,CAAC,CACzC,CAACb,IAAI,KAAKA,IAAI;IAEhB,IAAKkC,0BAA0B,EAAG;MACjCX,MAAM,CAAC,CAAC;MACR;IACD;IAEAzB,kBAAkB,CAAI0B,mBAAmB,IAAM;MAC9C,MAAMW,WAAW,GAAG;QACnB,GAAGF,WAAW;QACdjC,IAAI;QACJ0B,MAAM;QACNC,gBAAgB,EAAE,KAAK;QACvBI;MACD,CAAC;MAED,IAAKP,mBAAmB,CAACX,MAAM,KAAK,CAAC,EAAG;QACvC,OAAOmB,OAAO,GAAG,EAAE,GAAG,CAAEG,WAAW,CAAE;MACtC;MAEA,MAAMC,kBAAkB,GAAGZ,mBAAmB,CAACC,KAAK,CACnDD,mBAAmB,CAACX,MAAM,GAAGjC,kBAAkB,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,EAC3D,CAAC,CACF,CAAC;MAED,IAAK,CAAEoD,OAAO,EAAG;QAChBI,kBAAkB,CAACC,IAAI;QACtB;QACA;QACA;UACC,GAAGb,mBAAmB,CACrBA,mBAAmB,CAACX,MAAM,GAAG,CAAC,CAC9B;UACDiB;QACD,CACD,CAAC;MACF;MAEAM,kBAAkB,CAACC,IAAI,CAAEF,WAAY,CAAC;MAEtC,OAAOC,kBAAkB;IAC1B,CAAE,CAAC;EACJ,CAAC,EACD,CAAEb,MAAM,CACT,CAAC;EAED,MAAMe,UAAgD,GAAG,IAAAjB,oBAAW,EACnE,CAAEQ,OAAO,GAAG,CAAC,CAAC,KAAM;IACnB,MAAMjB,WAAW,GAChBX,sBAAsB,CAACO,OAAO,CAC7BP,sBAAsB,CAACO,OAAO,CAACK,MAAM,GAAG,CAAC,CACzC,CAACb,IAAI;IACP,IAAKY,WAAW,KAAKE,SAAS,EAAG;MAChC;IACD;IACA,MAAMyB,UAAU,GAAG,IAAAC,kBAAU,EAC5B5B,WAAW,EACXN,cAAc,CAACE,OAChB,CAAC;IACD,IAAK+B,UAAU,KAAKzB,SAAS,EAAG;MAC/B;IACD;IACAc,IAAI,CAAEW,UAAU,EAAE;MAAE,GAAGV,OAAO;MAAEH,MAAM,EAAE;IAAK,CAAE,CAAC;EACjD,CAAC,EACD,CAAEE,IAAI,CACP,CAAC;EAED,MAAMa,qBAA2C,GAAG,IAAA9B,gBAAO,EAC1D,OAAQ;IACP+B,QAAQ,EAAE;MACT,GAAG7C,eAAe,CAAEA,eAAe,CAACgB,MAAM,GAAG,CAAC,CAAE;MAChD8B,SAAS,EAAE9C,eAAe,CAACgB,MAAM,KAAK;IACvC,CAAC;IACDM,MAAM,EAAET,WAAW,GAAGA,WAAW,CAACS,MAAM,GAAG,CAAC,CAAC;IAC7CyB,KAAK,EAAElC,WAAW,GAAGA,WAAW,CAACtB,EAAE,GAAG0B,SAAS;IAC/Cc,IAAI;IACJL,MAAM;IACNe,UAAU;IACVlB,SAAS;IACTE;EACD,CAAC,CAAE,EACH,CACCzB,eAAe,EACfa,WAAW,EACXkB,IAAI,EACJL,MAAM,EACNe,UAAU,EACVlB,SAAS,EACTE,YAAY,CAEd,CAAC;EAED,MAAMuB,EAAE,GAAG,IAAAC,YAAK,EAAC,CAAC;EAClB,MAAMC,OAAO,GAAG,IAAApC,gBAAO,EACtB,MAAMkC,EAAE,CAAExF,MAAM,CAAC2F,wBAAwB,EAAEtD,SAAU,CAAC,EACtD,CAAEA,SAAS,EAAEmD,EAAE,CAChB,CAAC;EAED,OACC,IAAAI,MAAA,CAAAC,aAAA,EAAC/F,KAAA,CAAAgG,IAAI;IAACC,GAAG,EAAG7D,YAAc;IAACG,SAAS,EAAGqD,OAAS;IAAA,GAAMpD;EAAU,GAC/D,IAAAsD,MAAA,CAAAC,aAAA,EAAC9F,SAAA,CAAAiG,gBAAgB,CAACC,QAAQ;IAACC,KAAK,EAAGd;EAAuB,GACvDhD,QACwB,CACtB,CAAC;AAET;;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;AACO,MAAM+D,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,uBAAc,EAC9CrE,4BAA4B,EAC5B,mBACD,CAAC;AAAC,IAAAsE,QAAA,GAAAF,OAAA,CAAA5F,OAAA,GAEa2F,iBAAiB"}
+{"version":3,"names":["_element","require","_isShallowEqual","_interopRequireDefault","_context","_useCx","_router","_view","_context2","styles","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","MAX_HISTORY_LENGTH","addScreen","screens","screen","removeScreen","filter","s","id","goBack","locationHistory","length","slice","isBack","hasRestoredFocus","goTo","state","path","options","focusTargetSelector","skipFocus","replace","restOptions","isNavigatingToPreviousPath","newLocation","newLocationHistory","push","goToParent","currentPath","undefined","parentPath","findParent","routerReducer","action","matchedPath","type","patternMatch","isShallowEqual","params","UnconnectedNavigatorProvider","props","forwardedRef","initialPath","children","className","otherProps","useContextSystem","routerState","dispatch","useReducer","methods","useMemo","navigatorContextValue","_matchedPath$params","location","isInitial","match","cx","useCx","classes","navigatorProviderWrapper","_react","createElement","View","ref","NavigatorContext","Provider","value","NavigatorProvider","exports","contextConnect","_default"],"sources":["@wordpress/components/src/navigator/navigator-provider/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useReducer } from '@wordpress/element';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect, useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport { patternMatch, findParent } from '../utils/router';\nimport { View } from '../../view';\nimport { NavigatorContext } from '../context';\nimport * as styles from '../styles';\nimport type {\n\tNavigatorProviderProps,\n\tNavigatorLocation,\n\tNavigatorContext as NavigatorContextType,\n\tNavigateOptions,\n\tScreen,\n\tNavigateToParentOptions,\n} from '../types';\n\ntype MatchedPath = ReturnType< typeof patternMatch >;\n\ntype RouterAction =\n\t| { type: 'add' | 'remove'; screen: Screen }\n\t| { type: 'goback' }\n\t| { type: 'goto'; path: string; options?: NavigateOptions }\n\t| { type: 'gotoparent'; options?: NavigateToParentOptions };\n\ntype RouterState = {\n\tscreens: Screen[];\n\tlocationHistory: NavigatorLocation[];\n\tmatchedPath: MatchedPath;\n};\n\nconst MAX_HISTORY_LENGTH = 50;\n\nfunction addScreen( { screens }: RouterState, screen: Screen ) {\n\treturn [ ...screens, screen ];\n}\n\nfunction removeScreen( { screens }: RouterState, screen: Screen ) {\n\treturn screens.filter( ( s ) => s.id !== screen.id );\n}\n\nfunction goBack( { locationHistory }: RouterState ) {\n\tif ( locationHistory.length <= 1 ) {\n\t\treturn locationHistory;\n\t}\n\treturn [\n\t\t...locationHistory.slice( 0, -2 ),\n\t\t{\n\t\t\t...locationHistory[ locationHistory.length - 2 ],\n\t\t\tisBack: true,\n\t\t\thasRestoredFocus: false,\n\t\t},\n\t];\n}\n\nfunction goTo(\n\tstate: RouterState,\n\tpath: string,\n\toptions: NavigateOptions = {}\n) {\n\tconst { locationHistory } = state;\n\tconst {\n\t\tfocusTargetSelector,\n\t\tisBack = false,\n\t\tskipFocus = false,\n\t\treplace = false,\n\t\t...restOptions\n\t} = options;\n\n\tconst isNavigatingToPreviousPath =\n\t\tisBack &&\n\t\tlocationHistory.length > 1 &&\n\t\tlocationHistory[ locationHistory.length - 2 ].path === path;\n\n\tif ( isNavigatingToPreviousPath ) {\n\t\treturn goBack( state );\n\t}\n\n\tconst newLocation = {\n\t\t...restOptions,\n\t\tpath,\n\t\tisBack,\n\t\thasRestoredFocus: false,\n\t\tskipFocus,\n\t};\n\n\tif ( locationHistory.length === 0 ) {\n\t\treturn replace ? [] : [ newLocation ];\n\t}\n\n\tconst newLocationHistory = locationHistory.slice(\n\t\tlocationHistory.length > MAX_HISTORY_LENGTH - 1 ? 1 : 0,\n\t\t-1\n\t);\n\n\tif ( ! replace ) {\n\t\tnewLocationHistory.push(\n\t\t\t// Assign `focusTargetSelector` to the previous location in history\n\t\t\t// (the one we just navigated from).\n\t\t\t{\n\t\t\t\t...locationHistory[ locationHistory.length - 1 ],\n\t\t\t\tfocusTargetSelector,\n\t\t\t}\n\t\t);\n\t}\n\n\tnewLocationHistory.push( newLocation );\n\n\treturn newLocationHistory;\n}\n\nfunction goToParent(\n\tstate: RouterState,\n\toptions: NavigateToParentOptions = {}\n) {\n\tconst { locationHistory, screens } = state;\n\tconst currentPath = locationHistory[ locationHistory.length - 1 ].path;\n\tif ( currentPath === undefined ) {\n\t\treturn locationHistory;\n\t}\n\tconst parentPath = findParent( currentPath, screens );\n\tif ( parentPath === undefined ) {\n\t\treturn locationHistory;\n\t}\n\treturn goTo( state, parentPath, {\n\t\t...options,\n\t\tisBack: true,\n\t} );\n}\n\nfunction routerReducer(\n\tstate: RouterState,\n\taction: RouterAction\n): RouterState {\n\tlet { screens, locationHistory, matchedPath } = state;\n\n\tswitch ( action.type ) {\n\t\tcase 'add':\n\t\t\tscreens = addScreen( state, action.screen );\n\t\t\tbreak;\n\t\tcase 'remove':\n\t\t\tscreens = removeScreen( state, action.screen );\n\t\t\tbreak;\n\t\tcase 'goback':\n\t\t\tlocationHistory = goBack( state );\n\t\t\tbreak;\n\t\tcase 'goto':\n\t\t\tlocationHistory = goTo( state, action.path, action.options );\n\t\t\tbreak;\n\t\tcase 'gotoparent':\n\t\t\tlocationHistory = goToParent( state, action.options );\n\t\t\tbreak;\n\t}\n\n\t// Return early in case there is no change\n\tif (\n\t\tscreens === state.screens &&\n\t\tlocationHistory === state.locationHistory\n\t) {\n\t\treturn state;\n\t}\n\n\t// Compute the matchedPath\n\tconst currentPath =\n\t\tlocationHistory.length > 0\n\t\t\t? locationHistory[ locationHistory.length - 1 ].path\n\t\t\t: undefined;\n\tmatchedPath =\n\t\tcurrentPath !== undefined\n\t\t\t? patternMatch( currentPath, screens )\n\t\t\t: undefined;\n\n\t// If the new match is the same as the previous match,\n\t// return the previous one to keep immutability.\n\tif (\n\t\tmatchedPath &&\n\t\tstate.matchedPath &&\n\t\tmatchedPath.id === state.matchedPath.id &&\n\t\tisShallowEqual( matchedPath.params, state.matchedPath.params )\n\t) {\n\t\tmatchedPath = state.matchedPath;\n\t}\n\n\treturn { screens, locationHistory, matchedPath };\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 [ routerState, dispatch ] = useReducer(\n\t\trouterReducer,\n\t\tinitialPath,\n\t\t( path ) => ( {\n\t\t\tscreens: [],\n\t\t\tlocationHistory: [ { path } ],\n\t\t\tmatchedPath: undefined,\n\t\t} )\n\t);\n\n\t// The methods are constant forever, create stable references to them.\n\tconst methods = useMemo(\n\t\t() => ( {\n\t\t\tgoBack: () => dispatch( { type: 'goback' } ),\n\t\t\tgoTo: ( path: string, options?: NavigateOptions ) =>\n\t\t\t\tdispatch( { type: 'goto', path, options } ),\n\t\t\tgoToParent: ( options: NavigateToParentOptions | undefined ) =>\n\t\t\t\tdispatch( { type: 'gotoparent', options } ),\n\t\t\taddScreen: ( screen: Screen ) =>\n\t\t\t\tdispatch( { type: 'add', screen } ),\n\t\t\tremoveScreen: ( screen: Screen ) =>\n\t\t\t\tdispatch( { type: 'remove', screen } ),\n\t\t} ),\n\t\t[]\n\t);\n\n\tconst { locationHistory, matchedPath } = routerState;\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?.params ?? {},\n\t\t\tmatch: matchedPath?.id,\n\t\t\t...methods,\n\t\t} ),\n\t\t[ locationHistory, matchedPath, methods ]\n\t);\n\n\tconst cx = useCx();\n\tconst classes = useMemo(\n\t\t() => cx( styles.navigatorProviderWrapper, 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 * ```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"],"mappings":"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"}

package/build/navigator/navigator-screen/component.js

@@ -88,14 +88,14 @@ function UnconnectedNavigatorScreen(props, forwardedRef) {
 
     // When navigating back, if a selector is provided, use it to look for the
     // target element (assumed to be a node inside the current NavigatorScreen)
-    if (location.isBack && location?.focusTargetSelector) {
+    if (location.isBack && location.focusTargetSelector) {
       elementToFocus = wrapperRef.current.querySelector(location.focusTargetSelector);
     }
 
     // If the previous query didn't run or find any element to focus, fallback
     // to the first tabbable element in the screen (or the screen itself).
     if (!elementToFocus) {
-      const firstTabbable = _dom.focus.tabbable.find(wrapperRef.current)[0];
+      const [firstTabbable] = _dom.focus.tabbable.find(wrapperRef.current);
       elementToFocus = firstTabbable !== null && firstTabbable !== void 0 ? firstTabbable : wrapperRef.current;
     }
     locationRef.current.hasRestoredFocus = true;