npm - @wordpress/components - Versions diffs - 25.1.0 → 25.1.1 - Mend

@wordpress/components 25.1.0 → 25.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (993) hide show

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

	@@ -1 +1 @@
1	- {"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"]}
1	+ {"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/navigable-container/container.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -176,17 +175,18 @@ class NavigableContainer extends Component {
       forwardedRef,
       ...restProps
     } = this.props;
-    return createElement("div", _extends({
-      ref: this.bindContainer
-    }, restProps), children);
+    return createElement("div", {
+      ref: this.bindContainer,
+      ...restProps
+    }, children);
   }
 }
 const forwardedNavigableContainer = (props, ref) => {
-  return createElement(NavigableContainer, _extends({}, props, {
+  return createElement(NavigableContainer, { ...props,
     forwardedRef: ref
-  }));
+  });
 };
 forwardedNavigableContainer.displayName = 'NavigableContainer';

package/build-module/navigable-container/container.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigable-container/container.tsx"],"names":["Component","forwardRef","focus","noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","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","forwardedNavigableContainer","displayName"],"mappings":"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","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"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigable-container/container.tsx"],"names":["Component","forwardRef","focus","noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","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","forwardedNavigableContainer","displayName"],"mappings":"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","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"]}

package/build-module/navigable-container/menu.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -50,14 +49,15 @@ export function UnforwardedNavigableMenu({
     return undefined;
   };
-  return createElement(NavigableContainer, _extends({
+  return createElement(NavigableContainer, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: false,
     role: role,
     "aria-orientation": role !== 'presentation' && (orientation === 'vertical' || orientation === 'horizontal') ? orientation : undefined,
-    eventToOffset: eventToOffset
-  }, rest));
+    eventToOffset: eventToOffset,
+    ...rest
+  });
 }
 /**
  * A container for a navigable menu.

package/build-module/navigable-container/menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigable-container/menu.tsx"],"names":["forwardRef","NavigableContainer","UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","NavigableMenu"],"mappings":"~~;;;~~AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,aAA/B;AAGA,OAAO,SAASC,wBAAT,CACN;AAAEC,EAAAA,IAAI,GAAG,MAAT;AAAiBC,EAAAA,WAAW,GAAG,UAA/B;AAA2C,KAAGC;AAA9C,CADM,EAENC,GAFM,EAGL;AACD,QAAMC,aAAa,GAAKC,GAAF,IAA0B;AAC/C,UAAM;AAAEC,MAAAA;AAAF,QAAWD,GAAjB;AAEA,QAAIE,IAAI,GAAG,CAAE,WAAF,CAAX;AACA,QAAIC,QAAQ,GAAG,CAAE,SAAF,CAAf;;AAEA,QAAKP,WAAW,KAAK,YAArB,EAAoC;AACnCM,MAAAA,IAAI,GAAG,CAAE,YAAF,CAAP;AACAC,MAAAA,QAAQ,GAAG,CAAE,WAAF,CAAX;AACA;;AAED,QAAKP,WAAW,KAAK,MAArB,EAA8B;AAC7BM,MAAAA,IAAI,GAAG,CAAE,YAAF,EAAgB,WAAhB,CAAP;AACAC,MAAAA,QAAQ,GAAG,CAAE,WAAF,EAAe,SAAf,CAAX;AACA;;AAED,QAAKD,IAAI,CAACE,QAAL,CAAeH,IAAf,CAAL,EAA6B;AAC5B,aAAO,CAAP;AACA,KAFD,MAEO,IAAKE,QAAQ,CAACC,QAAT,CAAmBH,IAAnB,CAAL,EAAiC;AACvC,aAAO,CAAC,CAAR;AACA,KAFM,MAEA,IACN,CAAE,WAAF,EAAe,SAAf,EAA0B,WAA1B,EAAuC,YAAvC,EAAsDG,QAAtD,CACCH,IADD,CADM,EAIL;AACD;AACA;AACA;AACA,aAAO,CAAP;AACA;;AAED,WAAOI,SAAP;AACA,GAhCD;;AAkCA,SACC,cAAC,kBAAD;AACC,IAAA,GAAG,EAAGP,GADP;AAEC,IAAA,oBAAoB,MAFrB;AAGC,IAAA,mBAAmB,EAAG,KAHvB;AAIC,IAAA,IAAI,EAAGH,IAJR;AAKC,wBACCA,IAAI,KAAK,cAAT,KACEC,WAAW,KAAK,UAAhB,IAA8BA,WAAW,KAAK,YADhD,IAEGA,WAFH,GAGGS,SATL;AAWC,IAAA,aAAa,EAAGN;~~AAXjB~~,~~KAYMF~~,~~IAZN,EADD~~;AAgBA;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,OAAO,MAAMS,aAAa,GAAGd,UAAU,CAAEE,wBAAF,CAAhC;AAEP,eAAeY,aAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport NavigableContainer from './container';\nimport type { NavigableMenuProps } from './types';\n\nexport function UnforwardedNavigableMenu(\n\t{ role = 'menu', orientation = 'vertical', ...rest }: NavigableMenuProps,\n\tref: ForwardedRef< any >\n) {\n\tconst eventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code } = evt;\n\n\t\tlet next = [ 'ArrowDown' ];\n\t\tlet previous = [ 'ArrowUp' ];\n\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\tnext = [ 'ArrowRight' ];\n\t\t\tprevious = [ 'ArrowLeft' ];\n\t\t}\n\n\t\tif ( orientation === 'both' ) {\n\t\t\tnext = [ 'ArrowRight', 'ArrowDown' ];\n\t\t\tprevious = [ 'ArrowLeft', 'ArrowUp' ];\n\t\t}\n\n\t\tif ( next.includes( code ) ) {\n\t\t\treturn 1;\n\t\t} else if ( previous.includes( code ) ) {\n\t\t\treturn -1;\n\t\t} else if (\n\t\t\t[ 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight' ].includes(\n\t\t\t\tcode\n\t\t\t)\n\t\t) {\n\t\t\t// Key press should be handled, e.g. have event propagation and\n\t\t\t// default behavior handled by NavigableContainer but not result\n\t\t\t// in an offset.\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops={ false }\n\t\t\trole={ role }\n\t\t\taria-orientation={\n\t\t\t\trole !== 'presentation' &&\n\t\t\t\t( orientation === 'vertical' \|\| orientation === 'horizontal' )\n\t\t\t\t\t? orientation\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\teventToOffset={ eventToOffset }\n\t\t\t{ ...rest }\n\t\t/>\n\t);\n}\n\n/\n A container for a navigable menu.\n \n ```jsx\n * import {\n * NavigableMenu,\n * Button,\n * } from '@wordpress/components';\n \n function onNavigate( index, target ) {\n * console.log( `Navigates to ${ index }`, target );\n * }\n \n const MyNavigableContainer = () => (\n * <div>\n * <span>Navigable Menu:</span>\n * <NavigableMenu onNavigate={ onNavigate } orientation=\"horizontal\">\n * <Button variant=\"secondary\">Item 1</Button>\n * <Button variant=\"secondary\">Item 2</Button>\n * <Button variant=\"secondary\">Item 3</Button>\n * </NavigableMenu>\n * </div>\n * );\n * ```\n */\nexport const NavigableMenu = forwardRef( UnforwardedNavigableMenu );\n\nexport default NavigableMenu;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigable-container/menu.tsx"],"names":["forwardRef","NavigableContainer","UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","NavigableMenu"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,aAA/B;AAGA,OAAO,SAASC,wBAAT,CACN;AAAEC,EAAAA,IAAI,GAAG,MAAT;AAAiBC,EAAAA,WAAW,GAAG,UAA/B;AAA2C,KAAGC;AAA9C,CADM,EAENC,GAFM,EAGL;AACD,QAAMC,aAAa,GAAKC,GAAF,IAA0B;AAC/C,UAAM;AAAEC,MAAAA;AAAF,QAAWD,GAAjB;AAEA,QAAIE,IAAI,GAAG,CAAE,WAAF,CAAX;AACA,QAAIC,QAAQ,GAAG,CAAE,SAAF,CAAf;;AAEA,QAAKP,WAAW,KAAK,YAArB,EAAoC;AACnCM,MAAAA,IAAI,GAAG,CAAE,YAAF,CAAP;AACAC,MAAAA,QAAQ,GAAG,CAAE,WAAF,CAAX;AACA;;AAED,QAAKP,WAAW,KAAK,MAArB,EAA8B;AAC7BM,MAAAA,IAAI,GAAG,CAAE,YAAF,EAAgB,WAAhB,CAAP;AACAC,MAAAA,QAAQ,GAAG,CAAE,WAAF,EAAe,SAAf,CAAX;AACA;;AAED,QAAKD,IAAI,CAACE,QAAL,CAAeH,IAAf,CAAL,EAA6B;AAC5B,aAAO,CAAP;AACA,KAFD,MAEO,IAAKE,QAAQ,CAACC,QAAT,CAAmBH,IAAnB,CAAL,EAAiC;AACvC,aAAO,CAAC,CAAR;AACA,KAFM,MAEA,IACN,CAAE,WAAF,EAAe,SAAf,EAA0B,WAA1B,EAAuC,YAAvC,EAAsDG,QAAtD,CACCH,IADD,CADM,EAIL;AACD;AACA;AACA;AACA,aAAO,CAAP;AACA;;AAED,WAAOI,SAAP;AACA,GAhCD;;AAkCA,SACC,cAAC,kBAAD;AACC,IAAA,GAAG,EAAGP,GADP;AAEC,IAAA,oBAAoB,MAFrB;AAGC,IAAA,mBAAmB,EAAG,KAHvB;AAIC,IAAA,IAAI,EAAGH,IAJR;AAKC,wBACCA,IAAI,KAAK,cAAT,KACEC,WAAW,KAAK,UAAhB,IAA8BA,WAAW,KAAK,YADhD,IAEGA,WAFH,GAGGS,SATL;AAWC,IAAA,aAAa,EAAGN,aAXjB;AAAA,OAYMF;AAZN,IADD;AAgBA;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,OAAO,MAAMS,aAAa,GAAGd,UAAU,CAAEE,wBAAF,CAAhC;AAEP,eAAeY,aAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport NavigableContainer from './container';\nimport type { NavigableMenuProps } from './types';\n\nexport function UnforwardedNavigableMenu(\n\t{ role = 'menu', orientation = 'vertical', ...rest }: NavigableMenuProps,\n\tref: ForwardedRef< any >\n) {\n\tconst eventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code } = evt;\n\n\t\tlet next = [ 'ArrowDown' ];\n\t\tlet previous = [ 'ArrowUp' ];\n\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\tnext = [ 'ArrowRight' ];\n\t\t\tprevious = [ 'ArrowLeft' ];\n\t\t}\n\n\t\tif ( orientation === 'both' ) {\n\t\t\tnext = [ 'ArrowRight', 'ArrowDown' ];\n\t\t\tprevious = [ 'ArrowLeft', 'ArrowUp' ];\n\t\t}\n\n\t\tif ( next.includes( code ) ) {\n\t\t\treturn 1;\n\t\t} else if ( previous.includes( code ) ) {\n\t\t\treturn -1;\n\t\t} else if (\n\t\t\t[ 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight' ].includes(\n\t\t\t\tcode\n\t\t\t)\n\t\t) {\n\t\t\t// Key press should be handled, e.g. have event propagation and\n\t\t\t// default behavior handled by NavigableContainer but not result\n\t\t\t// in an offset.\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops={ false }\n\t\t\trole={ role }\n\t\t\taria-orientation={\n\t\t\t\trole !== 'presentation' &&\n\t\t\t\t( orientation === 'vertical' \|\| orientation === 'horizontal' )\n\t\t\t\t\t? orientation\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\teventToOffset={ eventToOffset }\n\t\t\t{ ...rest }\n\t\t/>\n\t);\n}\n\n/\n A container for a navigable menu.\n \n ```jsx\n * import {\n * NavigableMenu,\n * Button,\n * } from '@wordpress/components';\n \n function onNavigate( index, target ) {\n * console.log( `Navigates to ${ index }`, target );\n * }\n \n const MyNavigableContainer = () => (\n * <div>\n * <span>Navigable Menu:</span>\n * <NavigableMenu onNavigate={ onNavigate } orientation=\"horizontal\">\n * <Button variant=\"secondary\">Item 1</Button>\n * <Button variant=\"secondary\">Item 2</Button>\n * <Button variant=\"secondary\">Item 3</Button>\n * </NavigableMenu>\n * </div>\n * );\n * ```\n */\nexport const NavigableMenu = forwardRef( UnforwardedNavigableMenu );\n\nexport default NavigableMenu;\n"]}

package/build-module/navigable-container/tabbable.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -46,12 +45,13 @@ export function UnforwardedTabbableContainer({
     return undefined;
   };
-  return createElement(NavigableContainer, _extends({
+  return createElement(NavigableContainer, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: true,
-    eventToOffset: innerEventToOffset
-  }, props));
+    eventToOffset: innerEventToOffset,
+    ...props
+  });
 }
 /**
  * A container for tabbable elements.

package/build-module/navigable-container/tabbable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigable-container/tabbable.tsx"],"names":["forwardRef","NavigableContainer","UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","TabbableContainer"],"mappings":"~~;;;~~AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,aAA/B;AAGA,OAAO,SAASC,4BAAT,CACN;AAAEC,EAAAA,aAAF;AAAiB,KAAGC;AAApB,CADM,EAENC,GAFM,EAGL;AACD,QAAMC,kBAAkB,GAAKC,GAAF,IAA0B;AACpD,UAAM;AAAEC,MAAAA,IAAF;AAAQC,MAAAA;AAAR,QAAqBF,GAA3B;;AACA,QAAK,UAAUC,IAAf,EAAsB;AACrB,aAAOC,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAAvB;AACA,KAJmD,CAMpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,QAAKN,aAAL,EAAqB;AACpB,aAAOA,aAAa,CAAEI,GAAF,CAApB;AACA;;AAED,WAAOG,SAAP;AACA,GAtBD;;AAwBA,SACC,cAAC,kBAAD;AACC,IAAA,GAAG,EAAGL,GADP;AAEC,IAAA,oBAAoB,MAFrB;AAGC,IAAA,mBAAmB,MAHpB;AAIC,IAAA,aAAa,EAAGC;~~AAJjB~~,~~KAKMF~~,~~KALN,EADD~~;AASA;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,MAAMO,iBAAiB,GAAGX,UAAU,CAAEE,4BAAF,CAApC;AAEP,eAAeS,iBAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport NavigableContainer from './container';\nimport type { TabbableContainerProps } from './types';\n\nexport function UnforwardedTabbableContainer(\n\t{ eventToOffset, ...props }: TabbableContainerProps,\n\tref: ForwardedRef< any >\n) {\n\tconst innerEventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code, shiftKey } = evt;\n\t\tif ( 'Tab' === code ) {\n\t\t\treturn shiftKey ? -1 : 1;\n\t\t}\n\n\t\t// Allow custom handling of keys besides Tab.\n\t\t//\n\t\t// By default, TabbableContainer will move focus forward on Tab and\n\t\t// backward on Shift+Tab. The handler below will be used for all other\n\t\t// events. The semantics for `eventToOffset`'s return\n\t\t// values are the following:\n\t\t//\n\t\t// - +1: move focus forward\n\t\t// - -1: move focus backward\n\t\t// - 0: don't move focus, but acknowledge event and thus stop it\n\t\t// - undefined: do nothing, let the event propagate.\n\t\tif ( eventToOffset ) {\n\t\t\treturn eventToOffset( evt );\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops\n\t\t\teventToOffset={ innerEventToOffset }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\n/\n A container for tabbable elements.\n \n ```jsx\n * import {\n * TabbableContainer,\n * Button,\n * } from '@wordpress/components';\n \n function onNavigate( index, target ) {\n * console.log( `Navigates to ${ index }`, target );\n * }\n \n const MyTabbableContainer = () => (\n * <div>\n * <span>Tabbable Container:</span>\n * <TabbableContainer onNavigate={ onNavigate }>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 1\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 2\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 3\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 4\n * </Button>\n * </TabbableContainer>\n * </div>\n * );\n * ```\n */\nexport const TabbableContainer = forwardRef( UnforwardedTabbableContainer );\n\nexport default TabbableContainer;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigable-container/tabbable.tsx"],"names":["forwardRef","NavigableContainer","UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","TabbableContainer"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,aAA/B;AAGA,OAAO,SAASC,4BAAT,CACN;AAAEC,EAAAA,aAAF;AAAiB,KAAGC;AAApB,CADM,EAENC,GAFM,EAGL;AACD,QAAMC,kBAAkB,GAAKC,GAAF,IAA0B;AACpD,UAAM;AAAEC,MAAAA,IAAF;AAAQC,MAAAA;AAAR,QAAqBF,GAA3B;;AACA,QAAK,UAAUC,IAAf,EAAsB;AACrB,aAAOC,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAAvB;AACA,KAJmD,CAMpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,QAAKN,aAAL,EAAqB;AACpB,aAAOA,aAAa,CAAEI,GAAF,CAApB;AACA;;AAED,WAAOG,SAAP;AACA,GAtBD;;AAwBA,SACC,cAAC,kBAAD;AACC,IAAA,GAAG,EAAGL,GADP;AAEC,IAAA,oBAAoB,MAFrB;AAGC,IAAA,mBAAmB,MAHpB;AAIC,IAAA,aAAa,EAAGC,kBAJjB;AAAA,OAKMF;AALN,IADD;AASA;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,MAAMO,iBAAiB,GAAGX,UAAU,CAAEE,4BAAF,CAApC;AAEP,eAAeS,iBAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport NavigableContainer from './container';\nimport type { TabbableContainerProps } from './types';\n\nexport function UnforwardedTabbableContainer(\n\t{ eventToOffset, ...props }: TabbableContainerProps,\n\tref: ForwardedRef< any >\n) {\n\tconst innerEventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code, shiftKey } = evt;\n\t\tif ( 'Tab' === code ) {\n\t\t\treturn shiftKey ? -1 : 1;\n\t\t}\n\n\t\t// Allow custom handling of keys besides Tab.\n\t\t//\n\t\t// By default, TabbableContainer will move focus forward on Tab and\n\t\t// backward on Shift+Tab. The handler below will be used for all other\n\t\t// events. The semantics for `eventToOffset`'s return\n\t\t// values are the following:\n\t\t//\n\t\t// - +1: move focus forward\n\t\t// - -1: move focus backward\n\t\t// - 0: don't move focus, but acknowledge event and thus stop it\n\t\t// - undefined: do nothing, let the event propagate.\n\t\tif ( eventToOffset ) {\n\t\t\treturn eventToOffset( evt );\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops\n\t\t\teventToOffset={ innerEventToOffset }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\n/\n A container for tabbable elements.\n \n ```jsx\n * import {\n * TabbableContainer,\n * Button,\n * } from '@wordpress/components';\n \n function onNavigate( index, target ) {\n * console.log( `Navigates to ${ index }`, target );\n * }\n \n const MyTabbableContainer = () => (\n * <div>\n * <span>Tabbable Container:</span>\n * <TabbableContainer onNavigate={ onNavigate }>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 1\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 2\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 3\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 4\n * </Button>\n * </TabbableContainer>\n * </div>\n * );\n * ```\n */\nexport const TabbableContainer = forwardRef( UnforwardedTabbableContainer );\n\nexport default TabbableContainer;\n"]}

package/build-module/navigation/item/base.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -38,8 +37,9 @@ export default function NavigationItemBase(props) {
   }
   const classes = classnames('components-navigation__item', className);
-  return createElement(ItemBaseUI, _extends({
-    className: classes
-  }, restProps), children);
+  return createElement(ItemBaseUI, {
+    className: classes,
+    ...restProps
+  }, children);
 }
 //# sourceMappingURL=base.js.map

package/build-module/navigation/item/base.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigation/item/base.tsx"],"names":["classnames","useState","useNavigationContext","useNavigationTreeItem","ItemBaseUI","uniqueId","NavigationItemBase","props","children","className","title","href","restProps","itemId","navigationTree","getItem","_isVisible","classes"],"mappings":"~~;;;~~AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,QAAT,QAAyB,oBAAzB;AAEA;AACA;AACA;;AACA,SAASC,oBAAT,QAAqC,YAArC;AACA,SAASC,qBAAT,QAAsC,4BAAtC;AACA,SAASC,UAAT,QAA2B,6BAA3B;AAIA,IAAIC,QAAQ,GAAG,CAAf;AAEA,eAAe,SAASC,kBAAT,CAA6BC,KAA7B,EAA8D;AAC5E;AACA,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,SAAZ;AAAuBC,IAAAA,KAAvB;AAA8BC,IAAAA,IAA9B;AAAoC,OAAGC;AAAvC,MAAqDL,KAA3D;AAEA,QAAM,CAAEM,MAAF,IAAaZ,QAAQ,CAAG,QAAQ,EAAEI,QAAU,EAAvB,CAA3B;AAEAF,EAAAA,qBAAqB,CAAEU,MAAF,EAAUN,KAAV,CAArB;AACA,QAAM;AAAEO,IAAAA;AAAF,MAAqBZ,oBAAoB,EAA/C;;AAEA,MAAK,CAAEY,cAAc,CAACC,OAAf,CAAwBF,MAAxB,GAAkCG,UAAzC,EAAsD;AACrD,WAAO,IAAP;AACA;;AAED,QAAMC,OAAO,GAAGjB,UAAU,CAAE,6BAAF,EAAiCS,SAAjC,CAA1B;AAEA,SACC,cAAC,UAAD;AAAY,IAAA,SAAS,EAAGQ;~~AAAxB~~,~~KAAuCL~~,~~SAAvC~~,~~GACGJ,~~QADH,CADD;AAKA","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useState } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport { useNavigationContext } from '../context';\nimport { useNavigationTreeItem } from './use-navigation-tree-item';\nimport { ItemBaseUI } from '../styles/navigation-styles';\n\nimport type { NavigationItemBaseProps } from '../types';\n\nlet uniqueId = 0;\n\nexport default function NavigationItemBase( props: NavigationItemBaseProps ) {\n\t// Also avoid to pass the `title` and `href` props to the ItemBaseUI styled component.\n\tconst { children, className, title, href, ...restProps } = props;\n\n\tconst [ itemId ] = useState( `item-${ ++uniqueId }` );\n\n\tuseNavigationTreeItem( itemId, props );\n\tconst { navigationTree } = useNavigationContext();\n\n\tif ( ! navigationTree.getItem( itemId )?._isVisible ) {\n\t\treturn null;\n\t}\n\n\tconst classes = classnames( 'components-navigation__item', className );\n\n\treturn (\n\t\t<ItemBaseUI className={ classes } { ...restProps }>\n\t\t\t{ children }\n\t\t</ItemBaseUI>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigation/item/base.tsx"],"names":["classnames","useState","useNavigationContext","useNavigationTreeItem","ItemBaseUI","uniqueId","NavigationItemBase","props","children","className","title","href","restProps","itemId","navigationTree","getItem","_isVisible","classes"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,QAAT,QAAyB,oBAAzB;AAEA;AACA;AACA;;AACA,SAASC,oBAAT,QAAqC,YAArC;AACA,SAASC,qBAAT,QAAsC,4BAAtC;AACA,SAASC,UAAT,QAA2B,6BAA3B;AAIA,IAAIC,QAAQ,GAAG,CAAf;AAEA,eAAe,SAASC,kBAAT,CAA6BC,KAA7B,EAA8D;AAC5E;AACA,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,SAAZ;AAAuBC,IAAAA,KAAvB;AAA8BC,IAAAA,IAA9B;AAAoC,OAAGC;AAAvC,MAAqDL,KAA3D;AAEA,QAAM,CAAEM,MAAF,IAAaZ,QAAQ,CAAG,QAAQ,EAAEI,QAAU,EAAvB,CAA3B;AAEAF,EAAAA,qBAAqB,CAAEU,MAAF,EAAUN,KAAV,CAArB;AACA,QAAM;AAAEO,IAAAA;AAAF,MAAqBZ,oBAAoB,EAA/C;;AAEA,MAAK,CAAEY,cAAc,CAACC,OAAf,CAAwBF,MAAxB,GAAkCG,UAAzC,EAAsD;AACrD,WAAO,IAAP;AACA;;AAED,QAAMC,OAAO,GAAGjB,UAAU,CAAE,6BAAF,EAAiCS,SAAjC,CAA1B;AAEA,SACC,cAAC,UAAD;AAAY,IAAA,SAAS,EAAGQ,OAAxB;AAAA,OAAuCL;AAAvC,KACGJ,QADH,CADD;AAKA","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useState } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport { useNavigationContext } from '../context';\nimport { useNavigationTreeItem } from './use-navigation-tree-item';\nimport { ItemBaseUI } from '../styles/navigation-styles';\n\nimport type { NavigationItemBaseProps } from '../types';\n\nlet uniqueId = 0;\n\nexport default function NavigationItemBase( props: NavigationItemBaseProps ) {\n\t// Also avoid to pass the `title` and `href` props to the ItemBaseUI styled component.\n\tconst { children, className, title, href, ...restProps } = props;\n\n\tconst [ itemId ] = useState( `item-${ ++uniqueId }` );\n\n\tuseNavigationTreeItem( itemId, props );\n\tconst { navigationTree } = useNavigationContext();\n\n\tif ( ! navigationTree.getItem( itemId )?._isVisible ) {\n\t\treturn null;\n\t}\n\n\tconst classes = classnames( 'components-navigation__item', className );\n\n\treturn (\n\t\t<ItemBaseUI className={ classes } { ...restProps }>\n\t\t\t{ children }\n\t\t</ItemBaseUI>\n\t);\n}\n"]}

package/build-module/navigation/item/index.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -76,9 +75,10 @@ export function NavigationItem(props) {
     'aria-current': isActive ? 'page' : undefined,
     ...restProps
   };
-  return createElement(NavigationItemBase, _extends({}, baseProps, {
+  return createElement(NavigationItemBase, { ...baseProps,
     className: classes
-  }), children || createElement(ItemUI, itemProps, icon && createElement(ItemIconUI, null, createElement(Icon, {
+  }, children || createElement(ItemUI, { ...itemProps
+  }, icon && createElement(ItemIconUI, null, createElement(Icon, {
     icon: icon
   })), createElement(NavigationItemBaseContent, {
     title: title,

package/build-module/navigation/item/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigation/item/index.tsx"],"names":["classnames","Icon","chevronLeft","chevronRight","isRTL","Button","useNavigationContext","ItemUI","ItemIconUI","NavigationItemBaseContent","NavigationItemBase","noop","NavigationItem","props","badge","children","className","href","item","navigateToMenu","onClick","title","icon","hideIfTargetMenuEmpty","isText","restProps","activeItem","setActiveMenu","navigationTree","isMenuEmpty","isActive","classes","onItemClick","event","navigationIcon","baseProps","undefined","itemProps","as"],"mappings":"~~;;;~~AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,IAAT,EAAeC,WAAf,EAA4BC,YAA5B,QAAgD,kBAAhD;AACA,SAASC,KAAT,QAAsB,iBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,SAASC,oBAAT,QAAqC,YAArC;AACA,SAASC,MAAT,EAAiBC,UAAjB,QAAmC,6BAAnC;AACA,OAAOC,yBAAP,MAAsC,gBAAtC;AACA,OAAOC,kBAAP,MAA+B,QAA/B;;AAIA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,OAAO,SAASC,cAAT,CAAyBC,KAAzB,EAAsD;AAC5D,QAAM;AACLC,IAAAA,KADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAILC,IAAAA,IAJK;AAKLC,IAAAA,IALK;AAMLC,IAAAA,cANK;AAOLC,IAAAA,OAAO,GAAGT,IAPL;AAQLU,IAAAA,KARK;AASLC,IAAAA,IATK;AAULC,IAAAA,qBAVK;AAWLC,IAAAA,MAXK;AAYL,OAAGC;AAZE,MAaFZ,KAbJ;AAeA,QAAM;AACLa,IAAAA,UADK;AAELC,IAAAA,aAFK;AAGLC,IAAAA,cAAc,EAAE;AAAEC,MAAAA;AAAF;AAHX,MAIFvB,oBAAoB,EAJxB,CAhB4D,CAsB5D;AACA;AACA;;AACA,MACCiB,qBAAqB,IACrBJ,cADA,IAEAU,WAAW,CAAEV,cAAF,CAHZ,EAIE;AACD,WAAO,IAAP;AACA;;AAED,QAAMW,QAAQ,GAAGZ,IAAI,IAAIQ,UAAU,KAAKR,IAAxC;AAEA,QAAMa,OAAO,GAAG/B,UAAU,CAAEgB,SAAF,EAAa;AACtC,iBAAac;AADyB,GAAb,CAA1B;;AAIA,QAAME,WAEL,GAAKC,KAAF,IAAa;AAChB,QAAKd,cAAL,EAAsB;AACrBQ,MAAAA,aAAa,CAAER,cAAF,CAAb;AACA;;AAEDC,IAAAA,OAAO,CAAEa,KAAF,CAAP;AACA,GARD;;AASA,QAAMC,cAAc,GAAG9B,KAAK,KAAKF,WAAL,GAAmBC,YAA/C;AACA,QAAMgC,SAAS,GAAGpB,QAAQ,GAAGF,KAAH,GAAW,EAAE,GAAGA,KAAL;AAAYO,IAAAA,OAAO,EAAEgB;AAArB,GAArC;AACA,QAAMC,SAAS,GAAGb,MAAM,GACrBC,SADqB,GAErB;AACAa,IAAAA,EAAE,EAAEjC,MADJ;AAEAY,IAAAA,IAFA;AAGAG,IAAAA,OAAO,EAAEY,WAHT;AAIA,oBAAgBF,QAAQ,GAAG,MAAH,GAAYM,SAJpC;AAKA,OAAGX;AALH,GAFH;AAUA,SACC,cAAC,kBAAD,~~eAAyBU~~,SAAzB;AAAqC,IAAA,SAAS,EAAGJ;AAAjD,~~MACGhB~~,QAAQ,IACT,cAAC,MAAD,~~EAAasB~~,~~SAAb~~,~~EACGf,~~IAAI,IACL,cAAC,UAAD,QACC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGA;AAAb,IADD,CAFF,EAOC,cAAC,yBAAD;AACC,IAAA,KAAK,EAAGD,KADT;AAEC,IAAA,KAAK,EAAGP;AAFT,IAPD,EAYGK,cAAc,IAAI,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGe;AAAb,IAZrB,CAFF,CADD;AAoBA;AAED,eAAetB,cAAf","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\nimport { isRTL } from '@wordpress/i18n';\n\n/\n Internal dependencies\n */\nimport Button from '../../button';\nimport { useNavigationContext } from '../context';\nimport { ItemUI, ItemIconUI } from '../styles/navigation-styles';\nimport NavigationItemBaseContent from './base-content';\nimport NavigationItemBase from './base';\n\nimport type { NavigationItemProps } from '../types';\n\nconst noop = () => {};\n\nexport function NavigationItem( props: NavigationItemProps ) {\n\tconst {\n\t\tbadge,\n\t\tchildren,\n\t\tclassName,\n\t\thref,\n\t\titem,\n\t\tnavigateToMenu,\n\t\tonClick = noop,\n\t\ttitle,\n\t\ticon,\n\t\thideIfTargetMenuEmpty,\n\t\tisText,\n\t\t...restProps\n\t} = props;\n\n\tconst {\n\t\tactiveItem,\n\t\tsetActiveMenu,\n\t\tnavigationTree: { isMenuEmpty },\n\t} = useNavigationContext();\n\n\t// If hideIfTargetMenuEmpty prop is true\n\t// And the menu we are supposed to navigate to\n\t// Is marked as empty, then we skip rendering the item.\n\tif (\n\t\thideIfTargetMenuEmpty &&\n\t\tnavigateToMenu &&\n\t\tisMenuEmpty( navigateToMenu )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isActive = item && activeItem === item;\n\n\tconst classes = classnames( className, {\n\t\t'is-active': isActive,\n\t} );\n\n\tconst onItemClick: React.MouseEventHandler<\n\t\tHTMLButtonElement \| HTMLAnchorElement\n\t> = ( event ) => {\n\t\tif ( navigateToMenu ) {\n\t\t\tsetActiveMenu( navigateToMenu );\n\t\t}\n\n\t\tonClick( event );\n\t};\n\tconst navigationIcon = isRTL() ? chevronLeft : chevronRight;\n\tconst baseProps = children ? props : { ...props, onClick: undefined };\n\tconst itemProps = isText\n\t\t? restProps\n\t\t: {\n\t\t\t\tas: Button,\n\t\t\t\thref,\n\t\t\t\tonClick: onItemClick,\n\t\t\t\t'aria-current': isActive ? 'page' : undefined,\n\t\t\t\t...restProps,\n\t\t };\n\n\treturn (\n\t\t<NavigationItemBase { ...baseProps } className={ classes }>\n\t\t\t{ children \|\| (\n\t\t\t\t<ItemUI { ...itemProps }>\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<ItemIconUI>\n\t\t\t\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t\t\t</ItemIconUI>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<NavigationItemBaseContent\n\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\tbadge={ badge }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ navigateToMenu && <Icon icon={ navigationIcon } /> }\n\t\t\t\t</ItemUI>\n\t\t\t) }\n\t\t</NavigationItemBase>\n\t);\n}\n\nexport default NavigationItem;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigation/item/index.tsx"],"names":["classnames","Icon","chevronLeft","chevronRight","isRTL","Button","useNavigationContext","ItemUI","ItemIconUI","NavigationItemBaseContent","NavigationItemBase","noop","NavigationItem","props","badge","children","className","href","item","navigateToMenu","onClick","title","icon","hideIfTargetMenuEmpty","isText","restProps","activeItem","setActiveMenu","navigationTree","isMenuEmpty","isActive","classes","onItemClick","event","navigationIcon","baseProps","undefined","itemProps","as"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,IAAT,EAAeC,WAAf,EAA4BC,YAA5B,QAAgD,kBAAhD;AACA,SAASC,KAAT,QAAsB,iBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,SAASC,oBAAT,QAAqC,YAArC;AACA,SAASC,MAAT,EAAiBC,UAAjB,QAAmC,6BAAnC;AACA,OAAOC,yBAAP,MAAsC,gBAAtC;AACA,OAAOC,kBAAP,MAA+B,QAA/B;;AAIA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,OAAO,SAASC,cAAT,CAAyBC,KAAzB,EAAsD;AAC5D,QAAM;AACLC,IAAAA,KADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAILC,IAAAA,IAJK;AAKLC,IAAAA,IALK;AAMLC,IAAAA,cANK;AAOLC,IAAAA,OAAO,GAAGT,IAPL;AAQLU,IAAAA,KARK;AASLC,IAAAA,IATK;AAULC,IAAAA,qBAVK;AAWLC,IAAAA,MAXK;AAYL,OAAGC;AAZE,MAaFZ,KAbJ;AAeA,QAAM;AACLa,IAAAA,UADK;AAELC,IAAAA,aAFK;AAGLC,IAAAA,cAAc,EAAE;AAAEC,MAAAA;AAAF;AAHX,MAIFvB,oBAAoB,EAJxB,CAhB4D,CAsB5D;AACA;AACA;;AACA,MACCiB,qBAAqB,IACrBJ,cADA,IAEAU,WAAW,CAAEV,cAAF,CAHZ,EAIE;AACD,WAAO,IAAP;AACA;;AAED,QAAMW,QAAQ,GAAGZ,IAAI,IAAIQ,UAAU,KAAKR,IAAxC;AAEA,QAAMa,OAAO,GAAG/B,UAAU,CAAEgB,SAAF,EAAa;AACtC,iBAAac;AADyB,GAAb,CAA1B;;AAIA,QAAME,WAEL,GAAKC,KAAF,IAAa;AAChB,QAAKd,cAAL,EAAsB;AACrBQ,MAAAA,aAAa,CAAER,cAAF,CAAb;AACA;;AAEDC,IAAAA,OAAO,CAAEa,KAAF,CAAP;AACA,GARD;;AASA,QAAMC,cAAc,GAAG9B,KAAK,KAAKF,WAAL,GAAmBC,YAA/C;AACA,QAAMgC,SAAS,GAAGpB,QAAQ,GAAGF,KAAH,GAAW,EAAE,GAAGA,KAAL;AAAYO,IAAAA,OAAO,EAAEgB;AAArB,GAArC;AACA,QAAMC,SAAS,GAAGb,MAAM,GACrBC,SADqB,GAErB;AACAa,IAAAA,EAAE,EAAEjC,MADJ;AAEAY,IAAAA,IAFA;AAGAG,IAAAA,OAAO,EAAEY,WAHT;AAIA,oBAAgBF,QAAQ,GAAG,MAAH,GAAYM,SAJpC;AAKA,OAAGX;AALH,GAFH;AAUA,SACC,cAAC,kBAAD,OAAyBU,SAAzB;AAAqC,IAAA,SAAS,EAAGJ;AAAjD,KACGhB,QAAQ,IACT,cAAC,MAAD,OAAasB;AAAb,KACGf,IAAI,IACL,cAAC,UAAD,QACC,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGA;AAAb,IADD,CAFF,EAOC,cAAC,yBAAD;AACC,IAAA,KAAK,EAAGD,KADT;AAEC,IAAA,KAAK,EAAGP;AAFT,IAPD,EAYGK,cAAc,IAAI,cAAC,IAAD;AAAM,IAAA,IAAI,EAAGe;AAAb,IAZrB,CAFF,CADD;AAoBA;AAED,eAAetB,cAAf","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\nimport { isRTL } from '@wordpress/i18n';\n\n/\n Internal dependencies\n */\nimport Button from '../../button';\nimport { useNavigationContext } from '../context';\nimport { ItemUI, ItemIconUI } from '../styles/navigation-styles';\nimport NavigationItemBaseContent from './base-content';\nimport NavigationItemBase from './base';\n\nimport type { NavigationItemProps } from '../types';\n\nconst noop = () => {};\n\nexport function NavigationItem( props: NavigationItemProps ) {\n\tconst {\n\t\tbadge,\n\t\tchildren,\n\t\tclassName,\n\t\thref,\n\t\titem,\n\t\tnavigateToMenu,\n\t\tonClick = noop,\n\t\ttitle,\n\t\ticon,\n\t\thideIfTargetMenuEmpty,\n\t\tisText,\n\t\t...restProps\n\t} = props;\n\n\tconst {\n\t\tactiveItem,\n\t\tsetActiveMenu,\n\t\tnavigationTree: { isMenuEmpty },\n\t} = useNavigationContext();\n\n\t// If hideIfTargetMenuEmpty prop is true\n\t// And the menu we are supposed to navigate to\n\t// Is marked as empty, then we skip rendering the item.\n\tif (\n\t\thideIfTargetMenuEmpty &&\n\t\tnavigateToMenu &&\n\t\tisMenuEmpty( navigateToMenu )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isActive = item && activeItem === item;\n\n\tconst classes = classnames( className, {\n\t\t'is-active': isActive,\n\t} );\n\n\tconst onItemClick: React.MouseEventHandler<\n\t\tHTMLButtonElement \| HTMLAnchorElement\n\t> = ( event ) => {\n\t\tif ( navigateToMenu ) {\n\t\t\tsetActiveMenu( navigateToMenu );\n\t\t}\n\n\t\tonClick( event );\n\t};\n\tconst navigationIcon = isRTL() ? chevronLeft : chevronRight;\n\tconst baseProps = children ? props : { ...props, onClick: undefined };\n\tconst itemProps = isText\n\t\t? restProps\n\t\t: {\n\t\t\t\tas: Button,\n\t\t\t\thref,\n\t\t\t\tonClick: onItemClick,\n\t\t\t\t'aria-current': isActive ? 'page' : undefined,\n\t\t\t\t...restProps,\n\t\t };\n\n\treturn (\n\t\t<NavigationItemBase { ...baseProps } className={ classes }>\n\t\t\t{ children \|\| (\n\t\t\t\t<ItemUI { ...itemProps }>\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<ItemIconUI>\n\t\t\t\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t\t\t</ItemIconUI>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<NavigationItemBaseContent\n\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\tbadge={ badge }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ navigateToMenu && <Icon icon={ navigationIcon } /> }\n\t\t\t\t</ItemUI>\n\t\t\t) }\n\t\t</NavigationItemBase>\n\t);\n}\n\nexport default NavigationItem;\n"]}

package/build-module/navigator/navigator-back-button/component.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -14,9 +13,10 @@ import { useNavigatorBackButton } from './hook';
 function UnconnectedNavigatorBackButton(props, forwardedRef) {
   const navigatorBackButtonProps = useNavigatorBackButton(props);
-  return createElement(View, _extends({
-    ref: forwardedRef
-  }, navigatorBackButtonProps));
+  return createElement(View, {
+    ref: forwardedRef,
+    ...navigatorBackButtonProps
+  });
 }
 /**
  * The `NavigatorBackButton` component can be used to navigate to a screen and

package/build-module/navigator/navigator-back-button/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/component.tsx"],"names":["contextConnect","View","useNavigatorBackButton","UnconnectedNavigatorBackButton","props","forwardedRef","navigatorBackButtonProps","NavigatorBackButton"],"mappings":"~~;;;~~AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,cAAT,QAAwD,kBAAxD;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,sBAAT,QAAuC,QAAvC;;AAGA,SAASC,8BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,wBAAwB,GAAGJ,sBAAsB,CAAEE,KAAF,CAAvD;AAEA,SAAO,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGC;~~AAAZ~~,~~KAAgCC~~,~~wBAAhC,EAAP~~;AACA;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,MAAMC,mBAAmB,GAAGP,cAAc,CAChDG,8BADgD,EAEhD,qBAFgD,CAA1C;AAKP,eAAeI,mBAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorBackButton } from './hook';\nimport type { NavigatorBackButtonProps } from '../types';\n\nfunction UnconnectedNavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorBackButtonProps = useNavigatorBackButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorBackButtonProps } />;\n}\n\n/\n The `NavigatorBackButton` component can be used to navigate to a screen and\n * should be used in combination with the `NavigatorProvider`, the\n * `NavigatorScreen` and the `NavigatorButton` components (or the `useNavigator`\n * 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 NavigatorBackButton = contextConnect(\n\tUnconnectedNavigatorBackButton,\n\t'NavigatorBackButton'\n);\n\nexport default NavigatorBackButton;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/component.tsx"],"names":["contextConnect","View","useNavigatorBackButton","UnconnectedNavigatorBackButton","props","forwardedRef","navigatorBackButtonProps","NavigatorBackButton"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,cAAT,QAAwD,kBAAxD;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,sBAAT,QAAuC,QAAvC;;AAGA,SAASC,8BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,wBAAwB,GAAGJ,sBAAsB,CAAEE,KAAF,CAAvD;AAEA,SAAO,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGC,YAAZ;AAAA,OAAgCC;AAAhC,IAAP;AACA;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,MAAMC,mBAAmB,GAAGP,cAAc,CAChDG,8BADgD,EAEhD,qBAFgD,CAA1C;AAKP,eAAeI,mBAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorBackButton } from './hook';\nimport type { NavigatorBackButtonProps } from '../types';\n\nfunction UnconnectedNavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorBackButtonProps = useNavigatorBackButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorBackButtonProps } />;\n}\n\n/\n The `NavigatorBackButton` component can be used to navigate to a screen and\n * should be used in combination with the `NavigatorProvider`, the\n * `NavigatorScreen` and the `NavigatorButton` components (or the `useNavigator`\n * 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 NavigatorBackButton = contextConnect(\n\tUnconnectedNavigatorBackButton,\n\t'NavigatorBackButton'\n);\n\nexport default NavigatorBackButton;\n"]}

package/build-module/navigator/navigator-button/component.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 /**
@@ -14,9 +13,10 @@ import { useNavigatorButton } from './hook';
 function UnconnectedNavigatorButton(props, forwardedRef) {
   const navigatorButtonProps = useNavigatorButton(props);
-  return createElement(View, _extends({
-    ref: forwardedRef
-  }, navigatorButtonProps));
+  return createElement(View, {
+    ref: forwardedRef,
+    ...navigatorButtonProps
+  });
 }
 /**
  * The `NavigatorButton` component can be used to navigate to a screen and should

package/build-module/navigator/navigator-button/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigator/navigator-button/component.tsx"],"names":["contextConnect","View","useNavigatorButton","UnconnectedNavigatorButton","props","forwardedRef","navigatorButtonProps","NavigatorButton"],"mappings":"~~;;;~~AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,cAAT,QAAwD,kBAAxD;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,kBAAT,QAAmC,QAAnC;;AAGA,SAASC,0BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,oBAAoB,GAAGJ,kBAAkB,CAAEE,KAAF,CAA/C;AAEA,SAAO,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGC;~~AAAZ~~,~~KAAgCC~~,~~oBAAhC,EAAP~~;AACA;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,OAAO,MAAMC,eAAe,GAAGP,cAAc,CAC5CG,0BAD4C,EAE5C,iBAF4C,CAAtC;AAKP,eAAeI,eAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorButton } from './hook';\nimport type { NavigatorButtonProps } from '../types';\n\nfunction UnconnectedNavigatorButton(\n\tprops: WordPressComponentProps< NavigatorButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorButtonProps = useNavigatorButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorButtonProps } />;\n}\n\n/\n The `NavigatorButton` component can be used to navigate to a screen and should\n * be used in combination with the `NavigatorProvider`, the `NavigatorScreen`\n * and the `NavigatorBackButton` components (or the `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 NavigatorButton = contextConnect(\n\tUnconnectedNavigatorButton,\n\t'NavigatorButton'\n);\n\nexport default NavigatorButton;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigator/navigator-button/component.tsx"],"names":["contextConnect","View","useNavigatorButton","UnconnectedNavigatorButton","props","forwardedRef","navigatorButtonProps","NavigatorButton"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,cAAT,QAAwD,kBAAxD;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,kBAAT,QAAmC,QAAnC;;AAGA,SAASC,0BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,oBAAoB,GAAGJ,kBAAkB,CAAEE,KAAF,CAA/C;AAEA,SAAO,cAAC,IAAD;AAAM,IAAA,GAAG,EAAGC,YAAZ;AAAA,OAAgCC;AAAhC,IAAP;AACA;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,OAAO,MAAMC,eAAe,GAAGP,cAAc,CAC5CG,0BAD4C,EAE5C,iBAF4C,CAAtC;AAKP,eAAeI,eAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorButton } from './hook';\nimport type { NavigatorButtonProps } from '../types';\n\nfunction UnconnectedNavigatorButton(\n\tprops: WordPressComponentProps< NavigatorButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorButtonProps = useNavigatorButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorButtonProps } />;\n}\n\n/\n The `NavigatorButton` component can be used to navigate to a screen and should\n * be used in combination with the `NavigatorProvider`, the `NavigatorScreen`\n * and the `NavigatorBackButton` components (or the `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 NavigatorButton = contextConnect(\n\tUnconnectedNavigatorButton,\n\t'NavigatorButton'\n);\n\nexport default NavigatorButton;\n"]}

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

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
@@ -174,10 +173,11 @@ function UnconnectedNavigatorProvider(props, forwardedRef) {
   const cx = useCx();
   const classes = useMemo( // Prevents horizontal overflow while animating screen transitions.
   () => cx(_ref, className), [className, cx]);
-  return createElement(View, _extends({
+  return createElement(View, {
     ref: forwardedRef,
-    className: classes
-  }, otherProps), createElement(NavigatorContext.Provider, {
+    className: classes,
+    ...otherProps
+  }, createElement(NavigatorContext.Provider, {
     value: navigatorContextValue
   }, children));
 }

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

	@@ -1 +1 @@
1	- {"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","skipFocus","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\tskipFocus = 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 < 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"]}
1	+ {"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","skipFocus","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\tskipFocus = 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 < 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"]}

package/build-module/navigator/navigator-screen/component.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
@@ -117,10 +116,11 @@ function UnconnectedNavigatorScreen(props, forwardedRef) {
   }
   if (prefersReducedMotion) {
-    return createElement(View, _extends({
+    return createElement(View, {
       ref: mergedWrapperRef,
-      className: classes
-    }, otherProps), children);
+      className: classes,
+      ...otherProps
+    }, children);
   }
   const animate = {
@@ -152,10 +152,12 @@ function UnconnectedNavigatorScreen(props, forwardedRef) {
     exit,
     initial
   };
-  return createElement(motion.div, _extends({
+  return createElement(motion.div, {
     ref: mergedWrapperRef,
-    className: classes
-  }, otherProps, animatedProps), children);
+    className: classes,
+    ...otherProps,
+    ...animatedProps
+  }, children);
 }
 /**
  * The `NavigatorScreen` component represents a single view/screen/panel and