npm - @wordpress/components - Versions diffs - 25.8.3 → 25.9.0 - Mend

@wordpress/components 25.8.3 → 25.9.0

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 (2348) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_compose","_i18n","_icons","_dom","ariaHelper","_interopRequireWildcard","_button","_styleProvider","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","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","headerActions","__experimentalHideHeader","ref","useRef","instanceId","useInstanceId","Modal","headingId","focusOnMountRef","useFocusOnMount","constrainedTabbingRef","useConstrainedTabbing","focusReturnRef","useFocusReturn","focusOutsideProps","useFocusOutside","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","useState","hasScrollableContent","setHasScrollableContent","isContentScrollable","useCallback","current","closestScrollContainer","getScrollContainer","useEffect","hideApp","document","body","classList","add","remove","showApp","useLayoutEffect","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","isPrimary","target","onPointerUp","button","isSameTarget","createPortal","createElement","useMergeRefs","classnames","tabIndex","onScroll","__","id","onClick","close","label","forwardRef","exports","_default"],"sources":["@wordpress/components/src/modal/index.tsx"],"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\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\n\t// The focus hook does not support 'firstContentElement' but this is a valid\n\t// value for the Modal's focusOnMount prop. The following code ensures the focus\n\t// hook will focus the first focusable node within the element to which it is applied.\n\t// When `firstContentElement` is passed as the value of the focusOnMount prop,\n\t// the focus hook is applied to the Modal's content element.\n\t// Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n\t// focus hook will focus the first element in the Modal's content* when\n\t// `firstContentElement` is passed.\n\tconst focusOnMountRef = useFocusOnMount(\n\t\tfocusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount\n\t);\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\tlet pressTarget: EventTarget \| null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.isPrimary && event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids loss of focus yet also leaves `useFocusOutside`\n\t\t\t\t// practically useless with its only potential trigger being\n\t\t\t\t// programmatic focus movement. TODO opt for either removing\n\t\t\t\t// the hook or enhancing it such that this isn't needed.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) onRequestClose();\n\t\t},\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\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\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\tfocusOnMount !== 'firstContentElement'\n\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t: null,\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{ headerActions }\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\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\t\t\tchildrenContainerRef,\n\t\t\t\t\t\t\t\tfocusOnMount === 'firstContentElement'\n\t\t\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t\t] ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</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"],"mappings":"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"}
1	+ {"version":3,"names":["_classnames","_interopRequireDefault","require","_element","_compose","_i18n","_icons","_dom","ariaHelper","_interopRequireWildcard","_button","_styleProvider","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","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","size","headerActions","__experimentalHideHeader","ref","useRef","instanceId","useInstanceId","Modal","headingId","focusOnMountRef","useFocusOnMount","constrainedTabbingRef","useConstrainedTabbing","focusReturnRef","useFocusReturn","focusOutsideProps","useFocusOutside","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","useState","hasScrollableContent","setHasScrollableContent","sizeClass","isContentScrollable","useCallback","current","closestScrollContainer","getScrollContainer","useEffect","modalize","unmodalize","document","body","classList","add","remove","useLayoutEffect","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","isPrimary","target","onPointerUp","button","isSameTarget","createPortal","_react","createElement","useMergeRefs","classnames","tabIndex","onScroll","__","id","onClick","close","label","forwardRef","exports","_default"],"sources":["@wordpress/components/src/modal/index.tsx"],"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\tsize,\n\t\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\n\t// The focus hook does not support 'firstContentElement' but this is a valid\n\t// value for the Modal's focusOnMount prop. The following code ensures the focus\n\t// hook will focus the first focusable node within the element to which it is applied.\n\t// When `firstContentElement` is passed as the value of the focusOnMount prop,\n\t// the focus hook is applied to the Modal's content element.\n\t// Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n\t// focus hook will focus the first element in the Modal's content* when\n\t// `firstContentElement` is passed.\n\tconst focusOnMountRef = useFocusOnMount(\n\t\tfocusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount\n\t);\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\tlet sizeClass;\n\tif ( isFullScreen \|\| size === 'fill' ) {\n\t\tsizeClass = 'is-full-screen';\n\t} else if ( size ) {\n\t\tsizeClass = `has-size-${ size }`;\n\t}\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\tariaHelper.modalize( ref.current );\n\t\treturn () => ariaHelper.unmodalize();\n\t}, [] );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\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}\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\tlet pressTarget: EventTarget \| null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.isPrimary && event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids loss of focus yet also leaves `useFocusOutside`\n\t\t\t\t// practically useless with its only potential trigger being\n\t\t\t\t// programmatic focus movement. TODO opt for either removing\n\t\t\t\t// the hook or enhancing it such that this isn't needed.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) onRequestClose();\n\t\t},\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\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\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\tsizeClass,\n\t\t\t\t\t\tclassName\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\tfocusOnMount !== 'firstContentElement'\n\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t: null,\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{ headerActions }\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\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\t\t\tchildrenContainerRef,\n\t\t\t\t\t\t\t\tfocusOnMount === 'firstContentElement'\n\t\t\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t\t] ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</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"],"mappings":"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"}

package/build/modal/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":[],"sources":["@wordpress/components/src/modal/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type {\n\tAriaRole,\n\tCSSProperties,\n\tReactNode,\n\tKeyboardEventHandler,\n\tKeyboardEvent,\n\tSyntheticEvent,\n} from 'react';\n\n/\n WordPress dependencies\n /\nimport type { useFocusOnMount } from '@wordpress/compose';\n\nexport type ModalProps = {\n\taria?: {\n\t\t/\n\t\t If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-describedby`.\n\t\t /\n\t\tdescribedby?: string;\n\t\t/\n\t\t If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-labelledby`. Use this when you are rendering the title\n\t\t * yourself within the modal's content area instead of using the `title`\n\t\t * prop. This ensures the title is usable by assistive technology.\n\t\t \n\t\t Titles are required for accessibility reasons, see `contentLabel` and\n\t\t * `title` for other ways to provide a title.\n\t\t /\n\t\tlabelledby?: string;\n\t};\n\t/\n\t Class name added to the body element when the modal is open.\n\t \n\t @default 'modal-open'\n\t /\n\tbodyOpenClassName?: string;\n\t/\n\t The children elements.\n\t /\n\tchildren: ReactNode;\n\t/\n\t If this property is added, it will an additional class name to the modal\n\t * content `div`.\n\t /\n\tclassName?: string;\n\t/\n\t Label on the close button.\n\t \n\t @default `__( 'Close' )`\n\t /\n\tcloseButtonLabel?: string;\n\t/\n\t If this property is added, it will be added to the modal content `div` as\n\t * `aria-label`.\n\t \n\t Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `title` for other ways to provide a title.\n\t /\n\tcontentLabel?: string;\n\t/\n\t If this property is true, it will focus the first tabbable element\n\t * rendered in the modal.\n\t \n\t @default true\n\t /\n\tfocusOnMount?:\n\t\t\| Parameters< typeof useFocusOnMount >[ 0 ]\n\t\t\| 'firstContentElement';\n\t/\n\t Elements that are injected into the modal header to the left of the close button (if rendered).\n\t * Hidden if `__experimentalHideHeader` is `true`.\n\t \n\t @default null\n\t /\n\theaderActions?: ReactNode;\n\n\t/\n\t If this property is added, an icon will be added before the title.\n\t /\n\ticon?: JSX.Element;\n\t/\n\t If this property is set to false, the modal will not display a close icon\n\t * and cannot be dismissed.\n\t \n\t @default true\n\t /\n\tisDismissible?: boolean;\n\t/\n\t This property when set to `true` will render a full screen modal.\n\t \n\t @default false\n\t /\n\tisFullScreen?: boolean;\n\t/\n\t Handle the key down on the modal frame `div`.\n\t /\n\tonKeyDown?: KeyboardEventHandler< HTMLDivElement >;\n\t/\n\t This function is called to indicate that the modal should be closed.\n\t /\n\tonRequestClose: (\n\t\tevent?: KeyboardEvent< HTMLDivElement > \| SyntheticEvent\n\t) => void;\n\t/\n\t If this property is added, it will an additional class name to the modal\n\t * overlay `div`.\n\t /\n\toverlayClassName?: string;\n\t/\n\t If this property is added, it will override the default role of the\n\t * modal.\n\t \n\t @default 'dialog'\n\t /\n\trole?: AriaRole;\n\t/\n\t If this property is added, it will determine whether the modal requests\n\t * to close when a mouse click occurs outside of the modal content.\n\t \n\t @default true\n\t /\n\tshouldCloseOnClickOutside?: boolean;\n\t/\n\t If this property is added, it will determine whether the modal requests\n\t * to close when the escape key is pressed.\n\t \n\t @default true\n\t /\n\tshouldCloseOnEsc?: boolean;\n\t/\n\t If this property is added, it will be added to the modal frame `div`.\n\t /\n\tstyle?: CSSProperties;\n\t/\n\t This property is used as the modal header's title.\n\t \n\t Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `contentLabel` for other ways to provide a title.\n\t /\n\ttitle?: string;\n\t/\n\t When set to `true`, the Modal's header (including the icon, title and\n\t * close button) will not be rendered.\n\t \n\t _Warning_: This property is still experimental. “Experimental” means this\n\t * is an early implementation subject to drastic and breaking changes.\n\t \n\t @default false\n\t */\n\t__experimentalHideHeader?: boolean;\n};\n"],"mappings":""}
1	+ {"version":3,"names":[],"sources":["@wordpress/components/src/modal/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type {\n\tAriaRole,\n\tCSSProperties,\n\tReactNode,\n\tKeyboardEventHandler,\n\tKeyboardEvent,\n\tSyntheticEvent,\n} from 'react';\n\n/\n WordPress dependencies\n /\nimport type { useFocusOnMount } from '@wordpress/compose';\n\nexport type ModalProps = {\n\taria?: {\n\t\t/\n\t\t If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-describedby`.\n\t\t /\n\t\tdescribedby?: string;\n\t\t/\n\t\t If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-labelledby`. Use this when you are rendering the title\n\t\t * yourself within the modal's content area instead of using the `title`\n\t\t * prop. This ensures the title is usable by assistive technology.\n\t\t \n\t\t Titles are required for accessibility reasons, see `contentLabel` and\n\t\t * `title` for other ways to provide a title.\n\t\t /\n\t\tlabelledby?: string;\n\t};\n\t/\n\t Class name added to the body element when the modal is open.\n\t \n\t @default 'modal-open'\n\t /\n\tbodyOpenClassName?: string;\n\t/\n\t The children elements.\n\t /\n\tchildren: ReactNode;\n\t/\n\t If this property is added, it will an additional class name to the modal\n\t * content `div`.\n\t /\n\tclassName?: string;\n\t/\n\t Label on the close button.\n\t \n\t @default `__( 'Close' )`\n\t /\n\tcloseButtonLabel?: string;\n\t/\n\t If this property is added, it will be added to the modal content `div` as\n\t * `aria-label`.\n\t \n\t Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `title` for other ways to provide a title.\n\t /\n\tcontentLabel?: string;\n\t/\n\t If this property is true, it will focus the first tabbable element\n\t * rendered in the modal.\n\t \n\t @default true\n\t /\n\tfocusOnMount?:\n\t\t\| Parameters< typeof useFocusOnMount >[ 0 ]\n\t\t\| 'firstContentElement';\n\t/\n\t Elements that are injected into the modal header to the left of the close button (if rendered).\n\t * Hidden if `__experimentalHideHeader` is `true`.\n\t \n\t @default null\n\t /\n\theaderActions?: ReactNode;\n\n\t/\n\t If this property is added, an icon will be added before the title.\n\t /\n\ticon?: JSX.Element;\n\t/\n\t If this property is set to false, the modal will not display a close icon\n\t * and cannot be dismissed.\n\t \n\t @default true\n\t /\n\tisDismissible?: boolean;\n\t/\n\t This property when set to `true` will render a full screen modal.\n\t \n\t @default false\n\t /\n\tisFullScreen?: boolean;\n\t/\n\t If this property is added it will cause the modal to render at a preset\n\t * width, or expand to fill the screen. This prop will be ignored if\n\t * `isFullScreen` is set to `true`.\n\t \n\t Note: `Modal`'s width can also be controlled by adjusting the width of the\n\t * modal's contents, or via CSS using the `style` prop.\n\t /\n\tsize?: 'small' \| 'medium' \| 'large' \| 'fill';\n\t/\n\t Handle the key down on the modal frame `div`.\n\t /\n\tonKeyDown?: KeyboardEventHandler< HTMLDivElement >;\n\t/\n\t This function is called to indicate that the modal should be closed.\n\t /\n\tonRequestClose: (\n\t\tevent?: KeyboardEvent< HTMLDivElement > \| SyntheticEvent\n\t) => void;\n\t/\n\t If this property is added, it will an additional class name to the modal\n\t * overlay `div`.\n\t /\n\toverlayClassName?: string;\n\t/\n\t If this property is added, it will override the default role of the\n\t * modal.\n\t \n\t @default 'dialog'\n\t /\n\trole?: AriaRole;\n\t/\n\t If this property is added, it will determine whether the modal requests\n\t * to close when a mouse click occurs outside of the modal content.\n\t \n\t @default true\n\t /\n\tshouldCloseOnClickOutside?: boolean;\n\t/\n\t If this property is added, it will determine whether the modal requests\n\t * to close when the escape key is pressed.\n\t \n\t @default true\n\t /\n\tshouldCloseOnEsc?: boolean;\n\t/\n\t If this property is added, it will be added to the modal frame `div`.\n\t /\n\tstyle?: CSSProperties;\n\t/\n\t This property is used as the modal header's title.\n\t \n\t Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `contentLabel` for other ways to provide a title.\n\t /\n\ttitle?: string;\n\t/\n\t When set to `true`, the Modal's header (including the icon, title and\n\t * close button) will not be rendered.\n\t \n\t _Warning_: This property is still experimental. “Experimental” means this\n\t * is an early implementation subject to drastic and breaking changes.\n\t \n\t @default false\n\t */\n\t__experimentalHideHeader?: boolean;\n};\n"],"mappings":""}

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _react = require("react");
 var _element = require("@wordpress/element");
 var _dom = require("@wordpress/dom");
 /**
@@ -153,14 +154,14 @@ class NavigableContainer extends _element.Component {
       forwardedRef,
       ...restProps
     } = this.props;
-    return (0, _element.createElement)("div", {
+    return (0, _react.createElement)("div", {
       ref: this.bindContainer,
       ...restProps
     }, children);
   }
 }
 const forwardedNavigableContainer = (props, ref) => {
-  return (0, _element.createElement)(NavigableContainer, {
+  return (0, _react.createElement)(NavigableContainer, {
     ...props,
     forwardedRef: ref
   });

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_element","require","_dom","noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","Component","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","focus","tabbable","focusable","focusables","find","index","indexOf","event","cycle","eventToOffset","onNavigate","stopNavigationEvents","undefined","stopImmediatePropagation","targetRole","getAttribute","targetHasMenuItemRole","includes","preventDefault","activeElement","ownerDocument","context","nextIndex","length","code","render","children","restProps","createElement","forwardedNavigableContainer","displayName","_default","forwardRef","exports","default"],"sources":["@wordpress/components/src/navigable-container/container.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { Component, forwardRef } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/\n Internal dependencies\n */\nimport type { NavigableContainerProps } from './types';\n\nconst noop = () => {};\nconst MENU_ITEM_ROLES = [ 'menuitem', 'menuitemradio', 'menuitemcheckbox' ];\n\nfunction cycleValue( value: number, total: number, offset: number ) {\n\tconst nextValue = value + offset;\n\tif ( nextValue < 0 ) {\n\t\treturn total + nextValue;\n\t} else if ( nextValue >= total ) {\n\t\treturn nextValue - total;\n\t}\n\n\treturn nextValue;\n}\n\nclass NavigableContainer extends Component< NavigableContainerProps > {\n\tcontainer?: HTMLDivElement;\n\n\tconstructor( args: NavigableContainerProps ) {\n\t\tsuper( args );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.bindContainer = this.bindContainer.bind( this );\n\n\t\tthis.getFocusableContext = this.getFocusableContext.bind( this );\n\t\tthis.getFocusableIndex = this.getFocusableIndex.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We use DOM event listeners instead of React event listeners\n\t\t// because we want to catch events from the underlying DOM tree\n\t\t// The React Tree can be different from the DOM tree when using\n\t\t// portals. Block Toolbars for instance are rendered in a separate\n\t\t// React Trees.\n\t\tthis.container.addEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.container.removeEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tbindContainer( ref: HTMLDivElement ) {\n\t\tconst { forwardedRef } = this.props;\n\t\tthis.container = ref;\n\n\t\tif ( typeof forwardedRef === 'function' ) {\n\t\t\tforwardedRef( ref );\n\t\t} else if ( forwardedRef && 'current' in forwardedRef ) {\n\t\t\tforwardedRef.current = ref;\n\t\t}\n\t}\n\n\tgetFocusableContext( target: Element ) {\n\t\tif ( ! this.container ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst { onlyBrowserTabstops } = this.props;\n\t\tconst finder = onlyBrowserTabstops ? focus.tabbable : focus.focusable;\n\t\tconst focusables = finder.find( this.container ) as HTMLElement[];\n\n\t\tconst index = this.getFocusableIndex( focusables, target );\n\t\tif ( index > -1 && target ) {\n\t\t\treturn { index, target, focusables };\n\t\t}\n\t\treturn null;\n\t}\n\n\tgetFocusableIndex( focusables: Element[], target: Element ) {\n\t\treturn focusables.indexOf( target );\n\t}\n\n\tonKeyDown( event: KeyboardEvent ) {\n\t\tif ( this.props.onKeyDown ) {\n\t\t\tthis.props.onKeyDown( event );\n\t\t}\n\n\t\tconst { getFocusableContext } = this;\n\t\tconst {\n\t\t\tcycle = true,\n\t\t\teventToOffset,\n\t\t\tonNavigate = noop,\n\t\t\tstopNavigationEvents,\n\t\t} = this.props;\n\n\t\tconst offset = eventToOffset( event );\n\n\t\t// eventToOffset returns undefined if the event is not handled by the component.\n\t\tif ( offset !== undefined && stopNavigationEvents ) {\n\t\t\t// Prevents arrow key handlers bound to the document directly interfering.\n\t\t\tevent.stopImmediatePropagation();\n\n\t\t\t// When navigating a collection of items, prevent scroll containers\n\t\t\t// from scrolling. The preventDefault also prevents Voiceover from\n\t\t\t// 'handling' the event, as voiceover will try to use arrow keys\n\t\t\t// for highlighting text.\n\t\t\tconst targetRole = (\n\t\t\t\tevent.target as HTMLDivElement \| null\n\t\t\t )?.getAttribute( 'role' );\n\t\t\tconst targetHasMenuItemRole =\n\t\t\t\t!! targetRole && MENU_ITEM_ROLES.includes( targetRole );\n\n\t\t\tif ( targetHasMenuItemRole ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tif ( ! offset ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeElement = ( event.target as HTMLElement \| null )\n\t\t\t?.ownerDocument?.activeElement;\n\t\tif ( ! activeElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst context = getFocusableContext( activeElement );\n\t\tif ( ! context ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { index, focusables } = context;\n\t\tconst nextIndex = cycle\n\t\t\t? cycleValue( index, focusables.length, offset )\n\t\t\t: index + offset;\n\n\t\tif ( nextIndex >= 0 && nextIndex < focusables.length ) {\n\t\t\tfocusables[ nextIndex ].focus();\n\t\t\tonNavigate( nextIndex, focusables[ nextIndex ] );\n\n\t\t\t// `preventDefault()` on tab to avoid having the browser move the focus\n\t\t\t// after this component has already moved it.\n\t\t\tif ( event.code === 'Tab' ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tstopNavigationEvents,\n\t\t\teventToOffset,\n\t\t\tonNavigate,\n\t\t\tonKeyDown,\n\t\t\tcycle,\n\t\t\tonlyBrowserTabstops,\n\t\t\tforwardedRef,\n\t\t\t...restProps\n\t\t} = this.props;\n\t\treturn (\n\t\t\t<div ref={ this.bindContainer } { ...restProps }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nconst forwardedNavigableContainer = (\n\tprops: NavigableContainerProps,\n\tref: ForwardedRef< HTMLDivElement >\n) => {\n\treturn <NavigableContainer { ...props } forwardedRef={ ref } />;\n};\nforwardedNavigableContainer.displayName = 'NavigableContainer';\n\nexport default forwardRef( forwardedNavigableContainer );\n"],"mappings":"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"}
1	+ {"version":3,"names":["_element","require","_dom","noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","Component","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","focus","tabbable","focusable","focusables","find","index","indexOf","event","cycle","eventToOffset","onNavigate","stopNavigationEvents","undefined","stopImmediatePropagation","targetRole","getAttribute","targetHasMenuItemRole","includes","preventDefault","activeElement","ownerDocument","context","nextIndex","length","code","render","children","restProps","_react","createElement","forwardedNavigableContainer","displayName","_default","forwardRef","exports","default"],"sources":["@wordpress/components/src/navigable-container/container.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { Component, forwardRef } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/\n Internal dependencies\n */\nimport type { NavigableContainerProps } from './types';\n\nconst noop = () => {};\nconst MENU_ITEM_ROLES = [ 'menuitem', 'menuitemradio', 'menuitemcheckbox' ];\n\nfunction cycleValue( value: number, total: number, offset: number ) {\n\tconst nextValue = value + offset;\n\tif ( nextValue < 0 ) {\n\t\treturn total + nextValue;\n\t} else if ( nextValue >= total ) {\n\t\treturn nextValue - total;\n\t}\n\n\treturn nextValue;\n}\n\nclass NavigableContainer extends Component< NavigableContainerProps > {\n\tcontainer?: HTMLDivElement;\n\n\tconstructor( args: NavigableContainerProps ) {\n\t\tsuper( args );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.bindContainer = this.bindContainer.bind( this );\n\n\t\tthis.getFocusableContext = this.getFocusableContext.bind( this );\n\t\tthis.getFocusableIndex = this.getFocusableIndex.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We use DOM event listeners instead of React event listeners\n\t\t// because we want to catch events from the underlying DOM tree\n\t\t// The React Tree can be different from the DOM tree when using\n\t\t// portals. Block Toolbars for instance are rendered in a separate\n\t\t// React Trees.\n\t\tthis.container.addEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.container.removeEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tbindContainer( ref: HTMLDivElement ) {\n\t\tconst { forwardedRef } = this.props;\n\t\tthis.container = ref;\n\n\t\tif ( typeof forwardedRef === 'function' ) {\n\t\t\tforwardedRef( ref );\n\t\t} else if ( forwardedRef && 'current' in forwardedRef ) {\n\t\t\tforwardedRef.current = ref;\n\t\t}\n\t}\n\n\tgetFocusableContext( target: Element ) {\n\t\tif ( ! this.container ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst { onlyBrowserTabstops } = this.props;\n\t\tconst finder = onlyBrowserTabstops ? focus.tabbable : focus.focusable;\n\t\tconst focusables = finder.find( this.container ) as HTMLElement[];\n\n\t\tconst index = this.getFocusableIndex( focusables, target );\n\t\tif ( index > -1 && target ) {\n\t\t\treturn { index, target, focusables };\n\t\t}\n\t\treturn null;\n\t}\n\n\tgetFocusableIndex( focusables: Element[], target: Element ) {\n\t\treturn focusables.indexOf( target );\n\t}\n\n\tonKeyDown( event: KeyboardEvent ) {\n\t\tif ( this.props.onKeyDown ) {\n\t\t\tthis.props.onKeyDown( event );\n\t\t}\n\n\t\tconst { getFocusableContext } = this;\n\t\tconst {\n\t\t\tcycle = true,\n\t\t\teventToOffset,\n\t\t\tonNavigate = noop,\n\t\t\tstopNavigationEvents,\n\t\t} = this.props;\n\n\t\tconst offset = eventToOffset( event );\n\n\t\t// eventToOffset returns undefined if the event is not handled by the component.\n\t\tif ( offset !== undefined && stopNavigationEvents ) {\n\t\t\t// Prevents arrow key handlers bound to the document directly interfering.\n\t\t\tevent.stopImmediatePropagation();\n\n\t\t\t// When navigating a collection of items, prevent scroll containers\n\t\t\t// from scrolling. The preventDefault also prevents Voiceover from\n\t\t\t// 'handling' the event, as voiceover will try to use arrow keys\n\t\t\t// for highlighting text.\n\t\t\tconst targetRole = (\n\t\t\t\tevent.target as HTMLDivElement \| null\n\t\t\t )?.getAttribute( 'role' );\n\t\t\tconst targetHasMenuItemRole =\n\t\t\t\t!! targetRole && MENU_ITEM_ROLES.includes( targetRole );\n\n\t\t\tif ( targetHasMenuItemRole ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tif ( ! offset ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeElement = ( event.target as HTMLElement \| null )\n\t\t\t?.ownerDocument?.activeElement;\n\t\tif ( ! activeElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst context = getFocusableContext( activeElement );\n\t\tif ( ! context ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { index, focusables } = context;\n\t\tconst nextIndex = cycle\n\t\t\t? cycleValue( index, focusables.length, offset )\n\t\t\t: index + offset;\n\n\t\tif ( nextIndex >= 0 && nextIndex < focusables.length ) {\n\t\t\tfocusables[ nextIndex ].focus();\n\t\t\tonNavigate( nextIndex, focusables[ nextIndex ] );\n\n\t\t\t// `preventDefault()` on tab to avoid having the browser move the focus\n\t\t\t// after this component has already moved it.\n\t\t\tif ( event.code === 'Tab' ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tstopNavigationEvents,\n\t\t\teventToOffset,\n\t\t\tonNavigate,\n\t\t\tonKeyDown,\n\t\t\tcycle,\n\t\t\tonlyBrowserTabstops,\n\t\t\tforwardedRef,\n\t\t\t...restProps\n\t\t} = this.props;\n\t\treturn (\n\t\t\t<div ref={ this.bindContainer } { ...restProps }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nconst forwardedNavigableContainer = (\n\tprops: NavigableContainerProps,\n\tref: ForwardedRef< HTMLDivElement >\n) => {\n\treturn <NavigableContainer { ...props } forwardedRef={ ref } />;\n};\nforwardedNavigableContainer.displayName = 'NavigableContainer';\n\nexport default forwardRef( forwardedNavigableContainer );\n"],"mappings":"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"}

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

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.NavigableMenu = void 0;
 exports.UnforwardedNavigableMenu = UnforwardedNavigableMenu;
 exports.default = void 0;
+var _react = require("react");
 var _element = require("@wordpress/element");
 var _container = _interopRequireDefault(require("./container"));
 /**
@@ -52,7 +53,7 @@ function UnforwardedNavigableMenu({
     }
     return undefined;
   };
-  return (0, _element.createElement)(_container.default, {
+  return (0, _react.createElement)(_container.default, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: false,

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_element","require","_container","_interopRequireDefault","UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","createElement","default","stopNavigationEvents","onlyBrowserTabstops","NavigableMenu","forwardRef","exports","_default"],"sources":["@wordpress/components/src/navigable-container/menu.tsx"],"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"],"mappings":"~~;;;;;;;;;~~AAQA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,SAASG,wBAAwBA,CACvC;EAAEC,IAAI,GAAG,MAAM;EAAEC,WAAW,GAAG,UAAU;EAAE,GAAGC;AAAyB,CAAC,EACxEC,GAAwB,EACvB;EACD,MAAMC,aAAa,GAAKC,GAAkB,IAAM;IAC/C,MAAM;MAAEC;IAAK,CAAC,GAAGD,GAAG;IAEpB,IAAIE,IAAI,GAAG,CAAE,WAAW,CAAE;IAC1B,IAAIC,QAAQ,GAAG,CAAE,SAAS,CAAE;IAE5B,IAAKP,WAAW,KAAK,YAAY,EAAG;MACnCM,IAAI,GAAG,CAAE,YAAY,CAAE;MACvBC,QAAQ,GAAG,CAAE,WAAW,CAAE;IAC3B;IAEA,IAAKP,WAAW,KAAK,MAAM,EAAG;MAC7BM,IAAI,GAAG,CAAE,YAAY,EAAE,WAAW,CAAE;MACpCC,QAAQ,GAAG,CAAE,WAAW,EAAE,SAAS,CAAE;IACtC;IAEA,IAAKD,IAAI,CAACE,QAAQ,CAAEH,IAAK,CAAC,EAAG;MAC5B,OAAO,CAAC;IACT,CAAC,MAAM,IAAKE,QAAQ,CAACC,QAAQ,CAAEH,IAAK,CAAC,EAAG;MACvC,OAAO,CAAC,CAAC;IACV,CAAC,MAAM,IACN,CAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,CAAE,CAACG,QAAQ,CAC7DH,IACD,CAAC,EACA;MACD;MACA;MACA;MACA,OAAO,CAAC;IACT;IAEA,OAAOI,SAAS;EACjB,CAAC;EAED,OACC,~~IAAAf~~,~~QAAA~~,~~CAAAgB~~,aAAA,~~EAACd~~,UAAA,~~CAAAe~~,OAAkB;~~IAClBT~~,GAAG,EAAGA,GAAK;~~IACXU~~,oBAAoB;IACpBC,mBAAmB,EAAG,KAAO;~~IAC7Bd~~,IAAI,EAAGA,IAAM;IACb,oBACCA,IAAI,KAAK,cAAc,KACrBC,WAAW,KAAK,UAAU,IAAIA,WAAW,KAAK,YAAY,CAAE,GAC3DA,WAAW,GACXS,SACH;IACDN,aAAa,EAAGA,aAAe;IAAA,GAC1BF;EAAI,CACT,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,~~MAAMa~~,aAAa,GAAG,IAAAC,mBAAU,~~EAAEjB~~,wBAAyB,CAAC;~~AAACkB~~,OAAA,CAAAF,aAAA,GAAAA,aAAA;AAAA,IAAAG,QAAA,GAErDH,aAAa;AAAAE,OAAA,CAAAL,OAAA,GAAAM,QAAA"}
1	+ {"version":3,"names":["_element","require","_container","_interopRequireDefault","UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","_react","createElement","default","stopNavigationEvents","onlyBrowserTabstops","NavigableMenu","forwardRef","exports","_default"],"sources":["@wordpress/components/src/navigable-container/menu.tsx"],"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"],"mappings":";;;;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,SAASG,wBAAwBA,CACvC;EAAEC,IAAI,GAAG,MAAM;EAAEC,WAAW,GAAG,UAAU;EAAE,GAAGC;AAAyB,CAAC,EACxEC,GAAwB,EACvB;EACD,MAAMC,aAAa,GAAKC,GAAkB,IAAM;IAC/C,MAAM;MAAEC;IAAK,CAAC,GAAGD,GAAG;IAEpB,IAAIE,IAAI,GAAG,CAAE,WAAW,CAAE;IAC1B,IAAIC,QAAQ,GAAG,CAAE,SAAS,CAAE;IAE5B,IAAKP,WAAW,KAAK,YAAY,EAAG;MACnCM,IAAI,GAAG,CAAE,YAAY,CAAE;MACvBC,QAAQ,GAAG,CAAE,WAAW,CAAE;IAC3B;IAEA,IAAKP,WAAW,KAAK,MAAM,EAAG;MAC7BM,IAAI,GAAG,CAAE,YAAY,EAAE,WAAW,CAAE;MACpCC,QAAQ,GAAG,CAAE,WAAW,EAAE,SAAS,CAAE;IACtC;IAEA,IAAKD,IAAI,CAACE,QAAQ,CAAEH,IAAK,CAAC,EAAG;MAC5B,OAAO,CAAC;IACT,CAAC,MAAM,IAAKE,QAAQ,CAACC,QAAQ,CAAEH,IAAK,CAAC,EAAG;MACvC,OAAO,CAAC,CAAC;IACV,CAAC,MAAM,IACN,CAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,CAAE,CAACG,QAAQ,CAC7DH,IACD,CAAC,EACA;MACD;MACA;MACA;MACA,OAAO,CAAC;IACT;IAEA,OAAOI,SAAS;EACjB,CAAC;EAED,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACf,UAAA,CAAAgB,OAAkB;IAClBV,GAAG,EAAGA,GAAK;IACXW,oBAAoB;IACpBC,mBAAmB,EAAG,KAAO;IAC7Bf,IAAI,EAAGA,IAAM;IACb,oBACCA,IAAI,KAAK,cAAc,KACrBC,WAAW,KAAK,UAAU,IAAIA,WAAW,KAAK,YAAY,CAAE,GAC3DA,WAAW,GACXS,SACH;IACDN,aAAa,EAAGA,aAAe;IAAA,GAC1BF;EAAI,CACT,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMc,aAAa,GAAG,IAAAC,mBAAU,EAAElB,wBAAyB,CAAC;AAACmB,OAAA,CAAAF,aAAA,GAAAA,aAAA;AAAA,IAAAG,QAAA,GAErDH,aAAa;AAAAE,OAAA,CAAAL,OAAA,GAAAM,QAAA"}

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

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.TabbableContainer = void 0;
 exports.UnforwardedTabbableContainer = UnforwardedTabbableContainer;
 exports.default = void 0;
+var _react = require("react");
 var _element = require("@wordpress/element");
 var _container = _interopRequireDefault(require("./container"));
 /**
@@ -50,7 +51,7 @@ function UnforwardedTabbableContainer({
     }
     return undefined;
   };
-  return (0, _element.createElement)(_container.default, {
+  return (0, _react.createElement)(_container.default, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: true,

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_element","require","_container","_interopRequireDefault","UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","createElement","default","stopNavigationEvents","onlyBrowserTabstops","TabbableContainer","forwardRef","exports","_default"],"sources":["@wordpress/components/src/navigable-container/tabbable.tsx"],"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"],"mappings":"~~;;;;;;;;;~~AAQA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,SAASG,4BAA4BA,CAC3C;EAAEC,aAAa;EAAE,GAAGC;AAA8B,CAAC,EACnDC,GAAwB,EACvB;EACD,MAAMC,kBAAkB,GAAKC,GAAkB,IAAM;IACpD,MAAM;MAAEC,IAAI;MAAEC;IAAS,CAAC,GAAGF,GAAG;IAC9B,IAAK,KAAK,KAAKC,IAAI,EAAG;MACrB,OAAOC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC;IACzB;;IAEA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,IAAKN,aAAa,EAAG;MACpB,OAAOA,aAAa,CAAEI,GAAI,CAAC;IAC5B;IAEA,OAAOG,SAAS;EACjB,CAAC;EAED,OACC,~~IAAAZ~~,~~QAAA~~,~~CAAAa~~,aAAA,~~EAACX~~,UAAA,~~CAAAY~~,OAAkB;~~IAClBP~~,GAAG,EAAGA,GAAK;~~IACXQ~~,oBAAoB;IACpBC,mBAAmB;~~IACnBX~~,aAAa,EAAGG,kBAAoB;IAAA,GAC/BF;EAAK,CACV,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,~~MAAMW~~,iBAAiB,GAAG,IAAAC,mBAAU,~~EAAEd~~,4BAA6B,CAAC;~~AAACe~~,OAAA,CAAAF,iBAAA,GAAAA,iBAAA;AAAA,IAAAG,QAAA,GAE7DH,iBAAiB;AAAAE,OAAA,CAAAL,OAAA,GAAAM,QAAA"}
1	+ {"version":3,"names":["_element","require","_container","_interopRequireDefault","UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","_react","createElement","default","stopNavigationEvents","onlyBrowserTabstops","TabbableContainer","forwardRef","exports","_default"],"sources":["@wordpress/components/src/navigable-container/tabbable.tsx"],"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"],"mappings":";;;;;;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,SAASG,4BAA4BA,CAC3C;EAAEC,aAAa;EAAE,GAAGC;AAA8B,CAAC,EACnDC,GAAwB,EACvB;EACD,MAAMC,kBAAkB,GAAKC,GAAkB,IAAM;IACpD,MAAM;MAAEC,IAAI;MAAEC;IAAS,CAAC,GAAGF,GAAG;IAC9B,IAAK,KAAK,KAAKC,IAAI,EAAG;MACrB,OAAOC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC;IACzB;;IAEA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,IAAKN,aAAa,EAAG;MACpB,OAAOA,aAAa,CAAEI,GAAI,CAAC;IAC5B;IAEA,OAAOG,SAAS;EACjB,CAAC;EAED,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACZ,UAAA,CAAAa,OAAkB;IAClBR,GAAG,EAAGA,GAAK;IACXS,oBAAoB;IACpBC,mBAAmB;IACnBZ,aAAa,EAAGG,kBAAoB;IAAA,GAC/BF;EAAK,CACV,CAAC;AAEJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMY,iBAAiB,GAAG,IAAAC,mBAAU,EAAEf,4BAA6B,CAAC;AAACgB,OAAA,CAAAF,iBAAA,GAAAA,iBAAA;AAAA,IAAAG,QAAA,GAE7DH,iBAAiB;AAAAE,OAAA,CAAAL,OAAA,GAAAM,QAAA"}

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

	@@ -1 +1 @@
1	- {"version":3,"names":[],"sources":["@wordpress/components/src/navigable-container/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef, ReactNode } from 'react';\n\n/\n Internal dependencies\n /\nimport type { WordPressComponentProps } from '../~~ui/~~context';\n\ntype BaseProps = {\n\t/\n\t The component children.\n\t /\n\tchildren?: ReactNode;\n\t/\n\t A boolean which tells the component whether or not to cycle from the end back to the beginning and vice versa.\n\t \n\t @default true\n\t /\n\tcycle?: boolean;\n\t/\n\t A callback invoked on the keydown event.\n\t /\n\tonKeyDown?: ( event: KeyboardEvent ) => void;\n\t/\n\t A callback invoked when the menu navigates to one of its children passing the index and child as an argument\n\t /\n\tonNavigate?: ( index: number, focusable: HTMLElement ) => void;\n};\n\nexport type NavigableContainerProps = WordPressComponentProps<\n\tBaseProps & {\n\t\t/\n\t\t Gets an offset, given an event.\n\t\t /\n\t\teventToOffset: ( event: KeyboardEvent ) => -1 \| 0 \| 1 \| undefined;\n\t\t/\n\t\t The forwarded ref.\n\t\t /\n\t\tforwardedRef?: ForwardedRef< any >;\n\t\t/\n\t\t Whether to only consider browser tab stops.\n\t\t \n\t\t @default false\n\t\t /\n\t\tonlyBrowserTabstops: boolean;\n\t\t/\n\t\t Whether to stop navigation events.\n\t\t \n\t\t @default false\n\t\t /\n\t\tstopNavigationEvents: boolean;\n\t},\n\t'div',\n\tfalse\n>;\n\nexport type NavigableMenuProps = WordPressComponentProps<\n\tBaseProps & {\n\t\t/\n\t\t The orientation of the menu.\n\t\t \n\t\t @default 'vertical'\n\t\t */\n\t\torientation?: 'vertical' \| 'horizontal' \| 'both';\n\t},\n\t'div',\n\tfalse\n>;\n\nexport type TabbableContainerProps = WordPressComponentProps<\n\tBaseProps & Partial< Pick< NavigableContainerProps, 'eventToOffset' > >,\n\t'div',\n\tfalse\n>;\n"],"mappings":""}
1	+ {"version":3,"names":[],"sources":["@wordpress/components/src/navigable-container/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef, ReactNode } from 'react';\n\n/\n Internal dependencies\n /\nimport type { WordPressComponentProps } from '../context';\n\ntype BaseProps = {\n\t/\n\t The component children.\n\t /\n\tchildren?: ReactNode;\n\t/\n\t A boolean which tells the component whether or not to cycle from the end back to the beginning and vice versa.\n\t \n\t @default true\n\t /\n\tcycle?: boolean;\n\t/\n\t A callback invoked on the keydown event.\n\t /\n\tonKeyDown?: ( event: KeyboardEvent ) => void;\n\t/\n\t A callback invoked when the menu navigates to one of its children passing the index and child as an argument\n\t /\n\tonNavigate?: ( index: number, focusable: HTMLElement ) => void;\n};\n\nexport type NavigableContainerProps = WordPressComponentProps<\n\tBaseProps & {\n\t\t/\n\t\t Gets an offset, given an event.\n\t\t /\n\t\teventToOffset: ( event: KeyboardEvent ) => -1 \| 0 \| 1 \| undefined;\n\t\t/\n\t\t The forwarded ref.\n\t\t /\n\t\tforwardedRef?: ForwardedRef< any >;\n\t\t/\n\t\t Whether to only consider browser tab stops.\n\t\t \n\t\t @default false\n\t\t /\n\t\tonlyBrowserTabstops: boolean;\n\t\t/\n\t\t Whether to stop navigation events.\n\t\t \n\t\t @default false\n\t\t /\n\t\tstopNavigationEvents: boolean;\n\t},\n\t'div',\n\tfalse\n>;\n\nexport type NavigableMenuProps = WordPressComponentProps<\n\tBaseProps & {\n\t\t/\n\t\t The orientation of the menu.\n\t\t \n\t\t @default 'vertical'\n\t\t */\n\t\torientation?: 'vertical' \| 'horizontal' \| 'both';\n\t},\n\t'div',\n\tfalse\n>;\n\nexport type TabbableContainerProps = WordPressComponentProps<\n\tBaseProps & Partial< Pick< NavigableContainerProps, 'eventToOffset' > >,\n\t'div',\n\tfalse\n>;\n"],"mappings":""}

package/build/navigation/back-button/index.js CHANGED Viewed

@@ -5,8 +5,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.NavigationBackButton = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _element = require("@wordpress/element");
 var _i18n = require("@wordpress/i18n");
 var _icons = require("@wordpress/icons");
 var _context = require("../context");
@@ -46,13 +47,13 @@ function UnforwardedNavigationBackButton({
     }
   };
   const icon = (0, _i18n.isRTL)() ? _icons.chevronRight : _icons.chevronLeft;
-  return (0, _element.createElement)(_navigationStyles.MenuBackButtonUI, {
+  return (0, _react.createElement)(_navigationStyles.MenuBackButtonUI, {
     className: classes,
     href: href,
     variant: "tertiary",
     ref: ref,
     onClick: handleOnClick
-  }, (0, _element.createElement)(_icons.Icon, {
+  }, (0, _react.createElement)(_icons.Icon, {
     icon: icon
   }), backButtonLabel || parentMenuTitle || (0, _i18n.__)('Back'));
 }

package/build/navigation/back-button/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["~~_element~~","~~require~~","~~_classnames~~","~~_interopRequireDefault~~","_i18n","_icons","_context","_navigationStyles","UnforwardedNavigationBackButton","backButtonLabel","className","href","onClick","parentMenu","ref","setActiveMenu","navigationTree","useNavigationContext","classes","classnames","parentMenuTitle","undefined","getMenu","title","handleOnClick","event","animationDirection","isRTL","defaultPrevented","icon","chevronRight","chevronLeft","createElement","MenuBackButtonUI","variant","Icon","__","NavigationBackButton","forwardRef","exports","_default","default"],"sources":["@wordpress/components/src/navigation/back-button/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\nimport { __, isRTL } from '@wordpress/i18n';\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\n\n/\n Internal dependencies\n */\nimport { useNavigationContext } from '../context';\nimport { MenuBackButtonUI } from '../styles/navigation-styles';\n\nimport type { NavigationBackButtonProps } from '../types';\n\nfunction UnforwardedNavigationBackButton(\n\t{\n\t\tbackButtonLabel,\n\t\tclassName,\n\t\thref,\n\t\tonClick,\n\t\tparentMenu,\n\t}: NavigationBackButtonProps,\n\tref: React.ForwardedRef< HTMLAnchorElement \| HTMLButtonElement >\n) {\n\tconst { setActiveMenu, navigationTree } = useNavigationContext();\n\n\tconst classes = classnames(\n\t\t'components-navigation__back-button',\n\t\tclassName\n\t);\n\n\tconst parentMenuTitle =\n\t\tparentMenu !== undefined\n\t\t\t? navigationTree.getMenu( parentMenu )?.title\n\t\t\t: undefined;\n\n\tconst handleOnClick: React.MouseEventHandler< HTMLElement > = ( event ) => {\n\t\tif ( typeof onClick === 'function' ) {\n\t\t\tonClick( event );\n\t\t}\n\n\t\tconst animationDirection = isRTL() ? 'left' : 'right';\n\t\tif ( parentMenu && ! event.defaultPrevented ) {\n\t\t\tsetActiveMenu( parentMenu, animationDirection );\n\t\t}\n\t};\n\tconst icon = isRTL() ? chevronRight : chevronLeft;\n\treturn (\n\t\t<MenuBackButtonUI\n\t\t\tclassName={ classes }\n\t\t\thref={ href }\n\t\t\tvariant=\"tertiary\"\n\t\t\tref={ ref }\n\t\t\tonClick={ handleOnClick }\n\t\t>\n\t\t\t<Icon icon={ icon } />\n\t\t\t{ backButtonLabel \|\| parentMenuTitle \|\| __( 'Back' ) }\n\t\t</MenuBackButtonUI>\n\t);\n}\n\nexport const NavigationBackButton = forwardRef(\n\tUnforwardedNavigationBackButton\n);\n\nexport default NavigationBackButton;\n"],"mappings":"~~;;;;;;;AAOA~~,IAAAA,~~QAAA~~,GAAAC,OAAA;~~AAJA~~,IAAAC,~~WAAA~~,~~GAAAC~~,~~sBAAA,CAAAF,~~OAAA;~~AAKA~~,~~IAAAG~~,KAAA,~~GAAAH~~,OAAA;AACA,~~IAAAI~~,MAAA,~~GAAAJ~~,OAAA;AAKA,~~IAAAK~~,QAAA,~~GAAAL~~,OAAA;AACA,~~IAAAM~~,iBAAA,~~GAAAN~~,OAAA;AAfA;AACA;AACA;;AAEA;AACA;AACA;;AAKA;AACA;AACA;;AAMA,~~SAASO~~,+BAA+BA,CACvC;EACCC,eAAe;EACfC,SAAS;EACTC,IAAI;EACJC,OAAO;EACPC;AAC0B,CAAC,EAC5BC,GAAgE,EAC/D;EACD,MAAM;IAAEC,aAAa;IAAEC;EAAe,CAAC,GAAG,IAAAC,6BAAoB,EAAC,CAAC;EAEhE,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EACzB,oCAAoC,EACpCT,SACD,CAAC;EAED,MAAMU,eAAe,GACpBP,UAAU,KAAKQ,SAAS,GACrBL,cAAc,CAACM,OAAO,CAAET,UAAW,CAAC,EAAEU,KAAK,GAC3CF,SAAS;EAEb,MAAMG,aAAqD,GAAKC,KAAK,IAAM;IAC1E,IAAK,OAAOb,OAAO,KAAK,UAAU,EAAG;MACpCA,OAAO,CAAEa,KAAM,CAAC;IACjB;IAEA,MAAMC,kBAAkB,GAAG,IAAAC,WAAK,EAAC,CAAC,GAAG,MAAM,GAAG,OAAO;IACrD,IAAKd,UAAU,IAAI,CAAEY,KAAK,CAACG,gBAAgB,EAAG;MAC7Cb,aAAa,CAAEF,UAAU,EAAEa,kBAAmB,CAAC;IAChD;EACD,CAAC;EACD,MAAMG,IAAI,GAAG,IAAAF,WAAK,EAAC,CAAC,GAAGG,mBAAY,GAAGC,kBAAW;EACjD,OACC,~~IAAA/B~~,~~QAAA~~,~~CAAAgC~~,aAAA,~~EAACzB~~,iBAAA,~~CAAA0B~~,gBAAgB;~~IAChBvB~~,SAAS,EAAGQ,OAAS;IACrBP,IAAI,EAAGA,IAAM;~~IACbuB~~,OAAO,EAAC,UAAU;~~IAClBpB~~,GAAG,EAAGA,GAAK;IACXF,OAAO,EAAGY;EAAe,GAEzB,~~IAAAxB~~,~~QAAA~~,~~CAAAgC~~,aAAA,~~EAAC3B~~,MAAA,~~CAAA8B~~,IAAI;~~IAACN~~,IAAI,EAAGA;EAAM,CAAE,CAAC,EACpBpB,eAAe,IAAIW,eAAe,IAAI,~~IAAAgB~~,QAAE,EAAE,MAAO,CAClC,CAAC;AAErB;AAEO,MAAMC,oBAAoB,GAAG,IAAAC,mBAAU,~~EAC7C9B~~,+BACD,CAAC;~~AAAC+B~~,OAAA,CAAAF,oBAAA,GAAAA,oBAAA;AAAA,IAAAG,QAAA,GAEaH,oBAAoB;AAAAE,OAAA,CAAAE,OAAA,GAAAD,QAAA"}
1	+ {"version":3,"names":["_classnames","_interopRequireDefault","require","_element","_i18n","_icons","_context","_navigationStyles","UnforwardedNavigationBackButton","backButtonLabel","className","href","onClick","parentMenu","ref","setActiveMenu","navigationTree","useNavigationContext","classes","classnames","parentMenuTitle","undefined","getMenu","title","handleOnClick","event","animationDirection","isRTL","defaultPrevented","icon","chevronRight","chevronLeft","_react","createElement","MenuBackButtonUI","variant","Icon","__","NavigationBackButton","forwardRef","exports","_default","default"],"sources":["@wordpress/components/src/navigation/back-button/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\nimport { __, isRTL } from '@wordpress/i18n';\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\n\n/\n Internal dependencies\n */\nimport { useNavigationContext } from '../context';\nimport { MenuBackButtonUI } from '../styles/navigation-styles';\n\nimport type { NavigationBackButtonProps } from '../types';\n\nfunction UnforwardedNavigationBackButton(\n\t{\n\t\tbackButtonLabel,\n\t\tclassName,\n\t\thref,\n\t\tonClick,\n\t\tparentMenu,\n\t}: NavigationBackButtonProps,\n\tref: React.ForwardedRef< HTMLAnchorElement \| HTMLButtonElement >\n) {\n\tconst { setActiveMenu, navigationTree } = useNavigationContext();\n\n\tconst classes = classnames(\n\t\t'components-navigation__back-button',\n\t\tclassName\n\t);\n\n\tconst parentMenuTitle =\n\t\tparentMenu !== undefined\n\t\t\t? navigationTree.getMenu( parentMenu )?.title\n\t\t\t: undefined;\n\n\tconst handleOnClick: React.MouseEventHandler< HTMLElement > = ( event ) => {\n\t\tif ( typeof onClick === 'function' ) {\n\t\t\tonClick( event );\n\t\t}\n\n\t\tconst animationDirection = isRTL() ? 'left' : 'right';\n\t\tif ( parentMenu && ! event.defaultPrevented ) {\n\t\t\tsetActiveMenu( parentMenu, animationDirection );\n\t\t}\n\t};\n\tconst icon = isRTL() ? chevronRight : chevronLeft;\n\treturn (\n\t\t<MenuBackButtonUI\n\t\t\tclassName={ classes }\n\t\t\thref={ href }\n\t\t\tvariant=\"tertiary\"\n\t\t\tref={ ref }\n\t\t\tonClick={ handleOnClick }\n\t\t>\n\t\t\t<Icon icon={ icon } />\n\t\t\t{ backButtonLabel \|\| parentMenuTitle \|\| __( 'Back' ) }\n\t\t</MenuBackButtonUI>\n\t);\n}\n\nexport const NavigationBackButton = forwardRef(\n\tUnforwardedNavigationBackButton\n);\n\nexport default NavigationBackButton;\n"],"mappings":";;;;;;;;AAGA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAIA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAKA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,iBAAA,GAAAL,OAAA;AAfA;AACA;AACA;;AAEA;AACA;AACA;;AAKA;AACA;AACA;;AAMA,SAASM,+BAA+BA,CACvC;EACCC,eAAe;EACfC,SAAS;EACTC,IAAI;EACJC,OAAO;EACPC;AAC0B,CAAC,EAC5BC,GAAgE,EAC/D;EACD,MAAM;IAAEC,aAAa;IAAEC;EAAe,CAAC,GAAG,IAAAC,6BAAoB,EAAC,CAAC;EAEhE,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EACzB,oCAAoC,EACpCT,SACD,CAAC;EAED,MAAMU,eAAe,GACpBP,UAAU,KAAKQ,SAAS,GACrBL,cAAc,CAACM,OAAO,CAAET,UAAW,CAAC,EAAEU,KAAK,GAC3CF,SAAS;EAEb,MAAMG,aAAqD,GAAKC,KAAK,IAAM;IAC1E,IAAK,OAAOb,OAAO,KAAK,UAAU,EAAG;MACpCA,OAAO,CAAEa,KAAM,CAAC;IACjB;IAEA,MAAMC,kBAAkB,GAAG,IAAAC,WAAK,EAAC,CAAC,GAAG,MAAM,GAAG,OAAO;IACrD,IAAKd,UAAU,IAAI,CAAEY,KAAK,CAACG,gBAAgB,EAAG;MAC7Cb,aAAa,CAAEF,UAAU,EAAEa,kBAAmB,CAAC;IAChD;EACD,CAAC;EACD,MAAMG,IAAI,GAAG,IAAAF,WAAK,EAAC,CAAC,GAAGG,mBAAY,GAAGC,kBAAW;EACjD,OACC,IAAAC,MAAA,CAAAC,aAAA,EAAC1B,iBAAA,CAAA2B,gBAAgB;IAChBxB,SAAS,EAAGQ,OAAS;IACrBP,IAAI,EAAGA,IAAM;IACbwB,OAAO,EAAC,UAAU;IAClBrB,GAAG,EAAGA,GAAK;IACXF,OAAO,EAAGY;EAAe,GAEzB,IAAAQ,MAAA,CAAAC,aAAA,EAAC5B,MAAA,CAAA+B,IAAI;IAACP,IAAI,EAAGA;EAAM,CAAE,CAAC,EACpBpB,eAAe,IAAIW,eAAe,IAAI,IAAAiB,QAAE,EAAE,MAAO,CAClC,CAAC;AAErB;AAEO,MAAMC,oBAAoB,GAAG,IAAAC,mBAAU,EAC7C/B,+BACD,CAAC;AAACgC,OAAA,CAAAF,oBAAA,GAAAA,oBAAA;AAAA,IAAAG,QAAA,GAEaH,oBAAoB;AAAAE,OAAA,CAAAE,OAAA,GAAAD,QAAA"}

package/build/navigation/group/index.js CHANGED Viewed

@@ -6,8 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.NavigationGroup = NavigationGroup;
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _element = require("@wordpress/element");
 var _context = require("./context");
 var _navigationStyles = require("../styles/navigation-styles");
 var _context2 = require("../context");
@@ -41,21 +42,21 @@ function NavigationGroup({
   // Keep the children rendered to make sure invisible items are included in the navigation tree.
   if (!Object.values(items).some(item => item.group === groupId && item._isVisible)) {
-    return (0, _element.createElement)(_context.NavigationGroupContext.Provider, {
+    return (0, _react.createElement)(_context.NavigationGroupContext.Provider, {
       value: context
     }, children);
   }
   const groupTitleId = `components-navigation__group-title-${groupId}`;
   const classes = (0, _classnames.default)('components-navigation__group', className);
-  return (0, _element.createElement)(_context.NavigationGroupContext.Provider, {
+  return (0, _react.createElement)(_context.NavigationGroupContext.Provider, {
     value: context
-  }, (0, _element.createElement)("li", {
+  }, (0, _react.createElement)("li", {
     className: classes
-  }, title && (0, _element.createElement)(_navigationStyles.GroupTitleUI, {
+  }, title && (0, _react.createElement)(_navigationStyles.GroupTitleUI, {
     className: "components-navigation__group-title",
     id: groupTitleId,
     level: 3
-  }, title), (0, _element.createElement)("ul", {
+  }, title), (0, _react.createElement)("ul", {
     "aria-labelledby": groupTitleId,
     role: "group"
   }, children)));

package/build/navigation/group/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["~~_element~~","~~require~~","~~_classnames~~","~~_interopRequireDefault~~","_context","_navigationStyles","_context2","uniqueId","NavigationGroup","children","className","title","groupId","useState","navigationTree","items","useNavigationContext","context","group","Object","values","some","item","_isVisible","createElement","NavigationGroupContext","Provider","value","groupTitleId","classes","classnames","GroupTitleUI","id","level","role","_default","exports","default"],"sources":["@wordpress/components/src/navigation/group/index.tsx"],"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 { NavigationGroupContext } from './context';\nimport { GroupTitleUI } from '../styles/navigation-styles';\nimport { useNavigationContext } from '../context';\n\nimport type { NavigationGroupProps } from '../types';\n\nlet uniqueId = 0;\n\nexport function NavigationGroup( {\n\tchildren,\n\tclassName,\n\ttitle,\n}: NavigationGroupProps ) {\n\tconst [ groupId ] = useState( `group-${ ++uniqueId }` );\n\tconst {\n\t\tnavigationTree: { items },\n\t} = useNavigationContext();\n\n\tconst context = { group: groupId };\n\n\t// Keep the children rendered to make sure invisible items are included in the navigation tree.\n\tif (\n\t\t! Object.values( items ).some(\n\t\t\t( item ) => item.group === groupId && item._isVisible\n\t\t)\n\t) {\n\t\treturn (\n\t\t\t<NavigationGroupContext.Provider value={ context }>\n\t\t\t\t{ children }\n\t\t\t</NavigationGroupContext.Provider>\n\t\t);\n\t}\n\n\tconst groupTitleId = `components-navigation__group-title-${ groupId }`;\n\tconst classes = classnames( 'components-navigation__group', className );\n\n\treturn (\n\t\t<NavigationGroupContext.Provider value={ context }>\n\t\t\t<li className={ classes }>\n\t\t\t\t{ title && (\n\t\t\t\t\t<GroupTitleUI\n\t\t\t\t\t\tclassName=\"components-navigation__group-title\"\n\t\t\t\t\t\tid={ groupTitleId }\n\t\t\t\t\t\tlevel={ 3 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ title }\n\t\t\t\t\t</GroupTitleUI>\n\t\t\t\t) }\n\t\t\t\t<ul aria-labelledby={ groupTitleId } role=\"group\">\n\t\t\t\t\t{ children }\n\t\t\t\t</ul>\n\t\t\t</li>\n\t\t</NavigationGroupContext.Provider>\n\t);\n}\n\nexport default NavigationGroup;\n"],"mappings":"~~;;;;;;;;AAQA~~,IAAAA,~~QAAA~~,GAAAC,OAAA;~~AALA~~,IAAAC,~~WAAA~~,~~GAAAC~~,~~sBAAA,CAAAF,~~OAAA;~~AAUA~~,~~IAAAG~~,QAAA,~~GAAAH~~,OAAA;AACA,~~IAAAI~~,iBAAA,~~GAAAJ~~,OAAA;AACA,~~IAAAK~~,SAAA,~~GAAAL~~,OAAA;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAOA,~~IAAIM~~,QAAQ,GAAG,CAAC;AAET,SAASC,eAAeA,CAAE;EAChCC,QAAQ;EACRC,SAAS;EACTC;AACqB,CAAC,EAAG;EACzB,MAAM,CAAEC,OAAO,CAAE,GAAG,IAAAC,iBAAQ,EAAG,SAAS,EAAEN,QAAU,EAAE,CAAC;EACvD,MAAM;IACLO,cAAc,EAAE;MAAEC;IAAM;EACzB,CAAC,GAAG,IAAAC,8BAAoB,EAAC,CAAC;EAE1B,MAAMC,OAAO,GAAG;IAAEC,KAAK,EAAEN;EAAQ,CAAC;;EAElC;EACA,IACC,CAAEO,MAAM,CAACC,MAAM,CAAEL,KAAM,CAAC,CAACM,IAAI,CAC1BC,IAAI,IAAMA,IAAI,CAACJ,KAAK,KAAKN,OAAO,IAAIU,IAAI,CAACC,UAC5C,CAAC,EACA;IACD,OACC,~~IAAAvB~~,~~QAAA~~,~~CAAAwB~~,aAAA,~~EAACpB~~,QAAA,~~CAAAqB~~,sBAAsB,CAACC,QAAQ;MAACC,KAAK,~~EAAGV~~;IAAS,GAC/CR,QAC8B,CAAC;EAEpC;EAEA,~~MAAMmB~~,YAAY,GAAI,~~sCAAsChB~~,OAAS,EAAC;EACtE,~~MAAMiB~~,OAAO,GAAG,IAAAC,mBAAU,EAAE,8BAA8B,~~EAAEpB~~,SAAU,CAAC;EAEvE,OACC,~~IAAAV~~,~~QAAA~~,~~CAAAwB~~,aAAA,~~EAACpB~~,QAAA,~~CAAAqB~~,sBAAsB,CAACC,QAAQ;IAACC,KAAK,~~EAAGV~~;EAAS,GACjD,~~IAAAjB~~,~~QAAA~~,~~CAAAwB~~,aAAA;~~IAAId~~,SAAS,~~EAAGmB~~;EAAS,~~GACtBlB~~,KAAK,IACN,~~IAAAX~~,~~QAAA~~,~~CAAAwB~~,aAAA,~~EAACnB~~,iBAAA,~~CAAA0B~~,YAAY;~~IACZrB~~,SAAS,EAAC,oCAAoC;~~IAC9CsB~~,EAAE,EAAGJ,YAAc;IACnBK,KAAK,EAAG;EAAG,~~GAETtB~~,KACW,CACd,EACD,~~IAAAX~~,~~QAAA~~,~~CAAAwB~~,aAAA;IAAI,mBAAkBI,YAAc;IAACM,IAAI,EAAC;EAAO,~~GAC9CzB~~,QACC,CACD,CAC4B,CAAC;AAEpC;AAAC,~~IAAA0B~~,QAAA,~~GAEc3B~~,eAAe;~~AAAA4B~~,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
1	+ {"version":3,"names":["_classnames","_interopRequireDefault","require","_element","_context","_navigationStyles","_context2","uniqueId","NavigationGroup","children","className","title","groupId","useState","navigationTree","items","useNavigationContext","context","group","Object","values","some","item","_isVisible","_react","createElement","NavigationGroupContext","Provider","value","groupTitleId","classes","classnames","GroupTitleUI","id","level","role","_default","exports","default"],"sources":["@wordpress/components/src/navigation/group/index.tsx"],"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 { NavigationGroupContext } from './context';\nimport { GroupTitleUI } from '../styles/navigation-styles';\nimport { useNavigationContext } from '../context';\n\nimport type { NavigationGroupProps } from '../types';\n\nlet uniqueId = 0;\n\nexport function NavigationGroup( {\n\tchildren,\n\tclassName,\n\ttitle,\n}: NavigationGroupProps ) {\n\tconst [ groupId ] = useState( `group-${ ++uniqueId }` );\n\tconst {\n\t\tnavigationTree: { items },\n\t} = useNavigationContext();\n\n\tconst context = { group: groupId };\n\n\t// Keep the children rendered to make sure invisible items are included in the navigation tree.\n\tif (\n\t\t! Object.values( items ).some(\n\t\t\t( item ) => item.group === groupId && item._isVisible\n\t\t)\n\t) {\n\t\treturn (\n\t\t\t<NavigationGroupContext.Provider value={ context }>\n\t\t\t\t{ children }\n\t\t\t</NavigationGroupContext.Provider>\n\t\t);\n\t}\n\n\tconst groupTitleId = `components-navigation__group-title-${ groupId }`;\n\tconst classes = classnames( 'components-navigation__group', className );\n\n\treturn (\n\t\t<NavigationGroupContext.Provider value={ context }>\n\t\t\t<li className={ classes }>\n\t\t\t\t{ title && (\n\t\t\t\t\t<GroupTitleUI\n\t\t\t\t\t\tclassName=\"components-navigation__group-title\"\n\t\t\t\t\t\tid={ groupTitleId }\n\t\t\t\t\t\tlevel={ 3 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ title }\n\t\t\t\t\t</GroupTitleUI>\n\t\t\t\t) }\n\t\t\t\t<ul aria-labelledby={ groupTitleId } role=\"group\">\n\t\t\t\t\t{ children }\n\t\t\t\t</ul>\n\t\t\t</li>\n\t\t</NavigationGroupContext.Provider>\n\t);\n}\n\nexport default NavigationGroup;\n"],"mappings":";;;;;;;;;AAGA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,iBAAA,GAAAH,OAAA;AACA,IAAAI,SAAA,GAAAJ,OAAA;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAOA,IAAIK,QAAQ,GAAG,CAAC;AAET,SAASC,eAAeA,CAAE;EAChCC,QAAQ;EACRC,SAAS;EACTC;AACqB,CAAC,EAAG;EACzB,MAAM,CAAEC,OAAO,CAAE,GAAG,IAAAC,iBAAQ,EAAG,SAAS,EAAEN,QAAU,EAAE,CAAC;EACvD,MAAM;IACLO,cAAc,EAAE;MAAEC;IAAM;EACzB,CAAC,GAAG,IAAAC,8BAAoB,EAAC,CAAC;EAE1B,MAAMC,OAAO,GAAG;IAAEC,KAAK,EAAEN;EAAQ,CAAC;;EAElC;EACA,IACC,CAAEO,MAAM,CAACC,MAAM,CAAEL,KAAM,CAAC,CAACM,IAAI,CAC1BC,IAAI,IAAMA,IAAI,CAACJ,KAAK,KAAKN,OAAO,IAAIU,IAAI,CAACC,UAC5C,CAAC,EACA;IACD,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACrB,QAAA,CAAAsB,sBAAsB,CAACC,QAAQ;MAACC,KAAK,EAAGX;IAAS,GAC/CR,QAC8B,CAAC;EAEpC;EAEA,MAAMoB,YAAY,GAAI,sCAAsCjB,OAAS,EAAC;EACtE,MAAMkB,OAAO,GAAG,IAAAC,mBAAU,EAAE,8BAA8B,EAAErB,SAAU,CAAC;EAEvE,OACC,IAAAc,MAAA,CAAAC,aAAA,EAACrB,QAAA,CAAAsB,sBAAsB,CAACC,QAAQ;IAACC,KAAK,EAAGX;EAAS,GACjD,IAAAO,MAAA,CAAAC,aAAA;IAAIf,SAAS,EAAGoB;EAAS,GACtBnB,KAAK,IACN,IAAAa,MAAA,CAAAC,aAAA,EAACpB,iBAAA,CAAA2B,YAAY;IACZtB,SAAS,EAAC,oCAAoC;IAC9CuB,EAAE,EAAGJ,YAAc;IACnBK,KAAK,EAAG;EAAG,GAETvB,KACW,CACd,EACD,IAAAa,MAAA,CAAAC,aAAA;IAAI,mBAAkBI,YAAc;IAACM,IAAI,EAAC;EAAO,GAC9C1B,QACC,CACD,CAC4B,CAAC;AAEpC;AAAC,IAAA2B,QAAA,GAEc5B,eAAe;AAAA6B,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

package/build/navigation/index.js CHANGED Viewed

@@ -6,8 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Navigation = Navigation;
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _element = require("@wordpress/element");
 var _i18n = require("@wordpress/i18n");
 var _animate = require("../animate");
 var _constants = require("./constants");
@@ -114,14 +115,14 @@ function Navigation({
     type: 'slide-in',
     origin: slideOrigin
   });
-  return (0, _element.createElement)(_navigationStyles.NavigationUI, {
+  return (0, _react.createElement)(_navigationStyles.NavigationUI, {
     className: classes
-  }, (0, _element.createElement)("div", {
+  }, (0, _react.createElement)("div", {
     key: menu,
     className: animateClassName ? (0, _classnames.default)({
       [animateClassName]: isMounted.current && slideOrigin
     }) : undefined
-  }, (0, _element.createElement)(_context.NavigationContext.Provider, {
+  }, (0, _react.createElement)(_context.NavigationContext.Provider, {
     value: context
   }, children)));
 }

package/build/navigation/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["~~_element~~","~~require~~","~~_classnames~~","~~_interopRequireDefault~~","_i18n","_animate","_constants","_context","_navigationStyles","_useCreateNavigationTree","noop","Navigation","activeItem","activeMenu","ROOT_MENU","children","className","onActivateMenu","menu","setMenu","useState","slideOrigin","setSlideOrigin","navigationTree","useCreateNavigationTree","defaultSlideOrigin","isRTL","setActiveMenu","menuId","slideInOrigin","getMenu","isMounted","useRef","useEffect","current","context","classes","classnames","animateClassName","getAnimateClassName","type","origin","createElement","NavigationUI","key","undefined","NavigationContext","Provider","value","_default","exports","default"],"sources":["@wordpress/components/src/navigation/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport { getAnimateClassName } from '../animate';\nimport { ROOT_MENU } from './constants';\nimport { NavigationContext } from './context';\nimport { NavigationUI } from './styles/navigation-styles';\nimport { useCreateNavigationTree } from './use-create-navigation-tree';\n\nimport type {\n\tNavigationProps,\n\tNavigationContext as NavigationContextType,\n} from './types';\n\nconst noop = () => {};\n\n/\n Render a navigation list with optional groupings and hierarchy.\n \n ```jsx\n * import {\n * __experimentalNavigation as Navigation,\n * __experimentalNavigationGroup as NavigationGroup,\n * __experimentalNavigationItem as NavigationItem,\n * __experimentalNavigationMenu as NavigationMenu,\n * } from '@wordpress/components';\n \n const MyNavigation = () => (\n * <Navigation>\n * <NavigationMenu title=\"Home\">\n * <NavigationGroup title=\"Group 1\">\n * <NavigationItem item=\"item-1\" title=\"Item 1\" />\n * <NavigationItem item=\"item-2\" title=\"Item 2\" />\n * </NavigationGroup>\n * <NavigationGroup title=\"Group 2\">\n * <NavigationItem\n * item=\"item-3\"\n * navigateToMenu=\"category\"\n * title=\"Category\"\n * />\n * </NavigationGroup>\n * </NavigationMenu>\n \n <NavigationMenu\n * backButtonLabel=\"Home\"\n * menu=\"category\"\n * parentMenu=\"root\"\n * title=\"Category\"\n * >\n * <NavigationItem badge=\"1\" item=\"child-1\" title=\"Child 1\" />\n * <NavigationItem item=\"child-2\" title=\"Child 2\" />\n * </NavigationMenu>\n * </Navigation>\n * );\n * ```\n */\nexport function Navigation( {\n\tactiveItem,\n\tactiveMenu = ROOT_MENU,\n\tchildren,\n\tclassName,\n\tonActivateMenu = noop,\n}: NavigationProps ) {\n\tconst [ menu, setMenu ] = useState( activeMenu );\n\tconst [ slideOrigin, setSlideOrigin ] = useState< 'left' \| 'right' >();\n\tconst navigationTree = useCreateNavigationTree();\n\tconst defaultSlideOrigin = isRTL() ? 'right' : 'left';\n\n\tconst setActiveMenu: NavigationContextType[ 'setActiveMenu' ] = (\n\t\tmenuId,\n\t\tslideInOrigin = defaultSlideOrigin\n\t) => {\n\t\tif ( ! navigationTree.getMenu( menuId ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetSlideOrigin( slideInOrigin );\n\t\tsetMenu( menuId );\n\t\tonActivateMenu( menuId );\n\t};\n\n\t// Used to prevent the sliding animation on mount\n\tconst isMounted = useRef( false );\n\tuseEffect( () => {\n\t\tif ( ! isMounted.current ) {\n\t\t\tisMounted.current = true;\n\t\t}\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tif ( activeMenu !== menu ) {\n\t\t\tsetActiveMenu( activeMenu );\n\t\t}\n\t\t// Ignore exhaustive-deps here, as it would require either a larger refactor or some questionable workarounds.\n\t\t// See https://github.com/WordPress/gutenberg/pull/41612 for context.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ activeMenu ] );\n\n\tconst context = {\n\t\tactiveItem,\n\t\tactiveMenu: menu,\n\t\tsetActiveMenu,\n\t\tnavigationTree,\n\t};\n\n\tconst classes = classnames( 'components-navigation', className );\n\tconst animateClassName = getAnimateClassName( {\n\t\ttype: 'slide-in',\n\t\torigin: slideOrigin,\n\t} );\n\n\treturn (\n\t\t<NavigationUI className={ classes }>\n\t\t\t<div\n\t\t\t\tkey={ menu }\n\t\t\t\tclassName={\n\t\t\t\t\tanimateClassName\n\t\t\t\t\t\t? classnames( {\n\t\t\t\t\t\t\t\t[ animateClassName ]:\n\t\t\t\t\t\t\t\t\tisMounted.current && slideOrigin,\n\t\t\t\t\t\t } )\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<NavigationContext.Provider value={ context }>\n\t\t\t\t\t{ children }\n\t\t\t\t</NavigationContext.Provider>\n\t\t\t</div>\n\t\t</NavigationUI>\n\t);\n}\n\nexport default Navigation;\n"],"mappings":"~~;;;;;;;;AAQA~~,IAAAA,~~QAAA~~,GAAAC,OAAA;~~AALA~~,IAAAC,~~WAAA~~,~~GAAAC~~,~~sBAAA,CAAAF,~~OAAA;~~AAMA~~,~~IAAAG~~,KAAA,~~GAAAH~~,OAAA;AAKA,~~IAAAI~~,QAAA,~~GAAAJ~~,OAAA;AACA,~~IAAAK~~,UAAA,~~GAAAL~~,OAAA;AACA,~~IAAAM~~,QAAA,~~GAAAN~~,OAAA;AACA,~~IAAAO~~,iBAAA,~~GAAAP~~,OAAA;AACA,~~IAAAQ~~,wBAAA,~~GAAAR~~,OAAA;AAlBA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;;AAYA,~~MAAMS~~,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;;AAErB;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;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,UAAUA,CAAE;EAC3BC,UAAU;EACVC,UAAU,GAAGC,oBAAS;EACtBC,QAAQ;EACRC,SAAS;EACTC,cAAc,GAAGP;AACD,CAAC,EAAG;EACpB,MAAM,CAAEQ,IAAI,EAAEC,OAAO,CAAE,GAAG,IAAAC,iBAAQ,EAAEP,UAAW,CAAC;EAChD,MAAM,CAAEQ,WAAW,EAAEC,cAAc,CAAE,GAAG,IAAAF,iBAAQ,EAAqB,CAAC;EACtE,MAAMG,cAAc,GAAG,IAAAC,gDAAuB,EAAC,CAAC;EAChD,MAAMC,kBAAkB,GAAG,IAAAC,WAAK,EAAC,CAAC,GAAG,OAAO,GAAG,MAAM;EAErD,MAAMC,aAAuD,GAAGA,CAC/DC,MAAM,EACNC,aAAa,GAAGJ,kBAAkB,KAC9B;IACJ,IAAK,CAAEF,cAAc,CAACO,OAAO,CAAEF,MAAO,CAAC,EAAG;MACzC;IACD;IAEAN,cAAc,CAAEO,aAAc,CAAC;IAC/BV,OAAO,CAAES,MAAO,CAAC;IACjBX,cAAc,CAAEW,MAAO,CAAC;EACzB,CAAC;;EAED;EACA,MAAMG,SAAS,GAAG,IAAAC,eAAM,EAAE,KAAM,CAAC;EACjC,IAAAC,kBAAS,EAAE,MAAM;IAChB,IAAK,CAAEF,SAAS,CAACG,OAAO,EAAG;MAC1BH,SAAS,CAACG,OAAO,GAAG,IAAI;IACzB;EACD,CAAC,EAAE,EAAG,CAAC;EAEP,IAAAD,kBAAS,EAAE,MAAM;IAChB,IAAKpB,UAAU,KAAKK,IAAI,EAAG;MAC1BS,aAAa,CAAEd,UAAW,CAAC;IAC5B;IACA;IACA;IACA;EACD,CAAC,EAAE,CAAEA,UAAU,CAAG,CAAC;EAEnB,MAAMsB,OAAO,GAAG;IACfvB,UAAU;IACVC,UAAU,EAAEK,IAAI;IAChBS,aAAa;IACbJ;EACD,CAAC;EAED,MAAMa,OAAO,GAAG,IAAAC,mBAAU,EAAE,uBAAuB,EAAErB,SAAU,CAAC;EAChE,MAAMsB,gBAAgB,GAAG,IAAAC,4BAAmB,EAAE;IAC7CC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAEpB;EACT,CAAE,CAAC;EAEH,OACC,~~IAAArB~~,~~QAAA~~,~~CAAA0C~~,aAAA,~~EAAClC~~,iBAAA,~~CAAAmC~~,YAAY;~~IAAC3B~~,SAAS,EAAGoB;EAAS,GAClC,~~IAAApC~~,~~QAAA~~,~~CAAA0C~~,aAAA;IACCE,GAAG,~~EAAG1B~~,IAAM;IACZF,SAAS,EACRsB,gBAAgB,GACb,IAAAD,mBAAU,EAAE;MACZ,CAAEC,gBAAgB,GACjBP,SAAS,CAACG,OAAO,IAAIb;IACtB,CAAE,CAAC,~~GACHwB~~;EACH,GAED,~~IAAA7C~~,~~QAAA~~,~~CAAA0C~~,aAAA,~~EAACnC~~,QAAA,~~CAAAuC~~,iBAAiB,CAACC,QAAQ;IAACC,KAAK,~~EAAGb~~;EAAS,GAC1CpB,QACyB,CACxB,CACQ,CAAC;AAEjB;AAAC,~~IAAAkC~~,QAAA,~~GAEctC~~,UAAU;~~AAAAuC~~,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
1	+ {"version":3,"names":["_classnames","_interopRequireDefault","require","_element","_i18n","_animate","_constants","_context","_navigationStyles","_useCreateNavigationTree","noop","Navigation","activeItem","activeMenu","ROOT_MENU","children","className","onActivateMenu","menu","setMenu","useState","slideOrigin","setSlideOrigin","navigationTree","useCreateNavigationTree","defaultSlideOrigin","isRTL","setActiveMenu","menuId","slideInOrigin","getMenu","isMounted","useRef","useEffect","current","context","classes","classnames","animateClassName","getAnimateClassName","type","origin","_react","createElement","NavigationUI","key","undefined","NavigationContext","Provider","value","_default","exports","default"],"sources":["@wordpress/components/src/navigation/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport { getAnimateClassName } from '../animate';\nimport { ROOT_MENU } from './constants';\nimport { NavigationContext } from './context';\nimport { NavigationUI } from './styles/navigation-styles';\nimport { useCreateNavigationTree } from './use-create-navigation-tree';\n\nimport type {\n\tNavigationProps,\n\tNavigationContext as NavigationContextType,\n} from './types';\n\nconst noop = () => {};\n\n/\n Render a navigation list with optional groupings and hierarchy.\n \n ```jsx\n * import {\n * __experimentalNavigation as Navigation,\n * __experimentalNavigationGroup as NavigationGroup,\n * __experimentalNavigationItem as NavigationItem,\n * __experimentalNavigationMenu as NavigationMenu,\n * } from '@wordpress/components';\n \n const MyNavigation = () => (\n * <Navigation>\n * <NavigationMenu title=\"Home\">\n * <NavigationGroup title=\"Group 1\">\n * <NavigationItem item=\"item-1\" title=\"Item 1\" />\n * <NavigationItem item=\"item-2\" title=\"Item 2\" />\n * </NavigationGroup>\n * <NavigationGroup title=\"Group 2\">\n * <NavigationItem\n * item=\"item-3\"\n * navigateToMenu=\"category\"\n * title=\"Category\"\n * />\n * </NavigationGroup>\n * </NavigationMenu>\n \n <NavigationMenu\n * backButtonLabel=\"Home\"\n * menu=\"category\"\n * parentMenu=\"root\"\n * title=\"Category\"\n * >\n * <NavigationItem badge=\"1\" item=\"child-1\" title=\"Child 1\" />\n * <NavigationItem item=\"child-2\" title=\"Child 2\" />\n * </NavigationMenu>\n * </Navigation>\n * );\n * ```\n */\nexport function Navigation( {\n\tactiveItem,\n\tactiveMenu = ROOT_MENU,\n\tchildren,\n\tclassName,\n\tonActivateMenu = noop,\n}: NavigationProps ) {\n\tconst [ menu, setMenu ] = useState( activeMenu );\n\tconst [ slideOrigin, setSlideOrigin ] = useState< 'left' \| 'right' >();\n\tconst navigationTree = useCreateNavigationTree();\n\tconst defaultSlideOrigin = isRTL() ? 'right' : 'left';\n\n\tconst setActiveMenu: NavigationContextType[ 'setActiveMenu' ] = (\n\t\tmenuId,\n\t\tslideInOrigin = defaultSlideOrigin\n\t) => {\n\t\tif ( ! navigationTree.getMenu( menuId ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetSlideOrigin( slideInOrigin );\n\t\tsetMenu( menuId );\n\t\tonActivateMenu( menuId );\n\t};\n\n\t// Used to prevent the sliding animation on mount\n\tconst isMounted = useRef( false );\n\tuseEffect( () => {\n\t\tif ( ! isMounted.current ) {\n\t\t\tisMounted.current = true;\n\t\t}\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tif ( activeMenu !== menu ) {\n\t\t\tsetActiveMenu( activeMenu );\n\t\t}\n\t\t// Ignore exhaustive-deps here, as it would require either a larger refactor or some questionable workarounds.\n\t\t// See https://github.com/WordPress/gutenberg/pull/41612 for context.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ activeMenu ] );\n\n\tconst context = {\n\t\tactiveItem,\n\t\tactiveMenu: menu,\n\t\tsetActiveMenu,\n\t\tnavigationTree,\n\t};\n\n\tconst classes = classnames( 'components-navigation', className );\n\tconst animateClassName = getAnimateClassName( {\n\t\ttype: 'slide-in',\n\t\torigin: slideOrigin,\n\t} );\n\n\treturn (\n\t\t<NavigationUI className={ classes }>\n\t\t\t<div\n\t\t\t\tkey={ menu }\n\t\t\t\tclassName={\n\t\t\t\t\tanimateClassName\n\t\t\t\t\t\t? classnames( {\n\t\t\t\t\t\t\t\t[ animateClassName ]:\n\t\t\t\t\t\t\t\t\tisMounted.current && slideOrigin,\n\t\t\t\t\t\t } )\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<NavigationContext.Provider value={ context }>\n\t\t\t\t\t{ children }\n\t\t\t\t</NavigationContext.Provider>\n\t\t\t</div>\n\t\t</NavigationUI>\n\t);\n}\n\nexport default Navigation;\n"],"mappings":";;;;;;;;;AAGA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAKA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,UAAA,GAAAJ,OAAA;AACA,IAAAK,QAAA,GAAAL,OAAA;AACA,IAAAM,iBAAA,GAAAN,OAAA;AACA,IAAAO,wBAAA,GAAAP,OAAA;AAlBA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;;AAYA,MAAMQ,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;;AAErB;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;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,UAAUA,CAAE;EAC3BC,UAAU;EACVC,UAAU,GAAGC,oBAAS;EACtBC,QAAQ;EACRC,SAAS;EACTC,cAAc,GAAGP;AACD,CAAC,EAAG;EACpB,MAAM,CAAEQ,IAAI,EAAEC,OAAO,CAAE,GAAG,IAAAC,iBAAQ,EAAEP,UAAW,CAAC;EAChD,MAAM,CAAEQ,WAAW,EAAEC,cAAc,CAAE,GAAG,IAAAF,iBAAQ,EAAqB,CAAC;EACtE,MAAMG,cAAc,GAAG,IAAAC,gDAAuB,EAAC,CAAC;EAChD,MAAMC,kBAAkB,GAAG,IAAAC,WAAK,EAAC,CAAC,GAAG,OAAO,GAAG,MAAM;EAErD,MAAMC,aAAuD,GAAGA,CAC/DC,MAAM,EACNC,aAAa,GAAGJ,kBAAkB,KAC9B;IACJ,IAAK,CAAEF,cAAc,CAACO,OAAO,CAAEF,MAAO,CAAC,EAAG;MACzC;IACD;IAEAN,cAAc,CAAEO,aAAc,CAAC;IAC/BV,OAAO,CAAES,MAAO,CAAC;IACjBX,cAAc,CAAEW,MAAO,CAAC;EACzB,CAAC;;EAED;EACA,MAAMG,SAAS,GAAG,IAAAC,eAAM,EAAE,KAAM,CAAC;EACjC,IAAAC,kBAAS,EAAE,MAAM;IAChB,IAAK,CAAEF,SAAS,CAACG,OAAO,EAAG;MAC1BH,SAAS,CAACG,OAAO,GAAG,IAAI;IACzB;EACD,CAAC,EAAE,EAAG,CAAC;EAEP,IAAAD,kBAAS,EAAE,MAAM;IAChB,IAAKpB,UAAU,KAAKK,IAAI,EAAG;MAC1BS,aAAa,CAAEd,UAAW,CAAC;IAC5B;IACA;IACA;IACA;EACD,CAAC,EAAE,CAAEA,UAAU,CAAG,CAAC;EAEnB,MAAMsB,OAAO,GAAG;IACfvB,UAAU;IACVC,UAAU,EAAEK,IAAI;IAChBS,aAAa;IACbJ;EACD,CAAC;EAED,MAAMa,OAAO,GAAG,IAAAC,mBAAU,EAAE,uBAAuB,EAAErB,SAAU,CAAC;EAChE,MAAMsB,gBAAgB,GAAG,IAAAC,4BAAmB,EAAE;IAC7CC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAEpB;EACT,CAAE,CAAC;EAEH,OACC,IAAAqB,MAAA,CAAAC,aAAA,EAACnC,iBAAA,CAAAoC,YAAY;IAAC5B,SAAS,EAAGoB;EAAS,GAClC,IAAAM,MAAA,CAAAC,aAAA;IACCE,GAAG,EAAG3B,IAAM;IACZF,SAAS,EACRsB,gBAAgB,GACb,IAAAD,mBAAU,EAAE;MACZ,CAAEC,gBAAgB,GACjBP,SAAS,CAACG,OAAO,IAAIb;IACtB,CAAE,CAAC,GACHyB;EACH,GAED,IAAAJ,MAAA,CAAAC,aAAA,EAACpC,QAAA,CAAAwC,iBAAiB,CAACC,QAAQ;IAACC,KAAK,EAAGd;EAAS,GAC1CpB,QACyB,CACxB,CACQ,CAAC;AAEjB;AAAC,IAAAmC,QAAA,GAEcvC,UAAU;AAAAwC,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

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

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = NavigationItemBaseContent;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _navigationStyles = require("../styles/navigation-styles");
 /**
  * Internal dependencies
@@ -15,10 +15,10 @@ function NavigationItemBaseContent(props) {
     badge,
     title
   } = props;
-  return (0, _element.createElement)(_element.Fragment, null, title && (0, _element.createElement)(_navigationStyles.ItemTitleUI, {
+  return (0, _react.createElement)(_react.Fragment, null, title && (0, _react.createElement)(_navigationStyles.ItemTitleUI, {
     className: "components-navigation__item-title",
     as: "span"
-  }, title), badge && (0, _element.createElement)(_navigationStyles.ItemBadgeUI, {
+  }, title), badge && (0, _react.createElement)(_navigationStyles.ItemBadgeUI, {
     className: "components-navigation__item-badge"
   }, badge));
 }

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_navigationStyles","require","NavigationItemBaseContent","props","badge","title","~~_element~~","createElement","Fragment","ItemTitleUI","className","as","ItemBadgeUI"],"sources":["@wordpress/components/src/navigation/item/base-content.tsx"],"sourcesContent":["/*\n Internal dependencies\n */\nimport { ItemBadgeUI, ItemTitleUI } from '../styles/navigation-styles';\n\nimport type { NavigationItemBaseContentProps } from '../types';\n\nexport default function NavigationItemBaseContent(\n\tprops: NavigationItemBaseContentProps\n) {\n\tconst { badge, title } = props;\n\n\treturn (\n\t\t<>\n\t\t\t{ title && (\n\t\t\t\t<ItemTitleUI\n\t\t\t\t\tclassName=\"components-navigation__item-title\"\n\t\t\t\t\tas=\"span\"\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</ItemTitleUI>\n\t\t\t) }\n\n\t\t\t{ badge && (\n\t\t\t\t<ItemBadgeUI className=\"components-navigation__item-badge\">\n\t\t\t\t\t{ badge }\n\t\t\t\t</ItemBadgeUI>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,iBAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAKe,SAASC,yBAAyBA,CAChDC,KAAqC,EACpC;EACD,MAAM;IAAEC,KAAK;IAAEC;EAAM,CAAC,GAAGF,KAAK;EAE9B,OACC,IAAAG,~~QAAA~~,CAAAC,aAAA,EAAAD,~~QAAA~~,CAAAE,QAAA,QACGH,KAAK,IACN,IAAAC,~~QAAA~~,CAAAC,aAAA,EAACP,iBAAA,CAAAS,WAAW;IACXC,SAAS,EAAC,mCAAmC;IAC7CC,EAAE,EAAC;EAAM,GAEPN,KACU,CACb,EAECD,KAAK,IACN,IAAAE,~~QAAA~~,CAAAC,aAAA,EAACP,iBAAA,CAAAY,WAAW;IAACF,SAAS,EAAC;EAAmC,GACvDN,KACU,CAEb,CAAC;AAEL"}
1	+ {"version":3,"names":["_navigationStyles","require","NavigationItemBaseContent","props","badge","title","_react","createElement","Fragment","ItemTitleUI","className","as","ItemBadgeUI"],"sources":["@wordpress/components/src/navigation/item/base-content.tsx"],"sourcesContent":["/*\n Internal dependencies\n */\nimport { ItemBadgeUI, ItemTitleUI } from '../styles/navigation-styles';\n\nimport type { NavigationItemBaseContentProps } from '../types';\n\nexport default function NavigationItemBaseContent(\n\tprops: NavigationItemBaseContentProps\n) {\n\tconst { badge, title } = props;\n\n\treturn (\n\t\t<>\n\t\t\t{ title && (\n\t\t\t\t<ItemTitleUI\n\t\t\t\t\tclassName=\"components-navigation__item-title\"\n\t\t\t\t\tas=\"span\"\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</ItemTitleUI>\n\t\t\t) }\n\n\t\t\t{ badge && (\n\t\t\t\t<ItemBadgeUI className=\"components-navigation__item-badge\">\n\t\t\t\t\t{ badge }\n\t\t\t\t</ItemBadgeUI>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,iBAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAKe,SAASC,yBAAyBA,CAChDC,KAAqC,EACpC;EACD,MAAM;IAAEC,KAAK;IAAEC;EAAM,CAAC,GAAGF,KAAK;EAE9B,OACC,IAAAG,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAE,QAAA,QACGH,KAAK,IACN,IAAAC,MAAA,CAAAC,aAAA,EAACP,iBAAA,CAAAS,WAAW;IACXC,SAAS,EAAC,mCAAmC;IAC7CC,EAAE,EAAC;EAAM,GAEPN,KACU,CACb,EAECD,KAAK,IACN,IAAAE,MAAA,CAAAC,aAAA,EAACP,iBAAA,CAAAY,WAAW;IAACF,SAAS,EAAC;EAAmC,GACvDN,KACU,CAEb,CAAC;AAEL"}

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

@@ -5,8 +5,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = NavigationItemBase;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _element = require("@wordpress/element");
 var _context = require("../context");
 var _useNavigationTreeItem = require("./use-navigation-tree-item");
 var _navigationStyles = require("../styles/navigation-styles");
@@ -41,7 +42,7 @@ function NavigationItemBase(props) {
     return null;
   }
   const classes = (0, _classnames.default)('components-navigation__item', className);
-  return (0, _element.createElement)(_navigationStyles.ItemBaseUI, {
+  return (0, _react.createElement)(_navigationStyles.ItemBaseUI, {
     className: classes,
     ...restProps
   }, children);

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

	@@ -1 +1 @@
1	- {"version":3,"names":["~~_element~~","~~require~~","~~_classnames~~","~~_interopRequireDefault~~","_context","_useNavigationTreeItem","_navigationStyles","uniqueId","NavigationItemBase","props","children","className","title","href","restProps","itemId","useState","useNavigationTreeItem","navigationTree","useNavigationContext","getItem","_isVisible","classes","classnames","createElement","ItemBaseUI"],"sources":["@wordpress/components/src/navigation/item/base.tsx"],"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"],"mappings":"~~;;;;;;;AAQA~~,IAAAA,~~QAAA~~,GAAAC,OAAA;~~AALA~~,IAAAC,~~WAAA~~,~~GAAAC~~,~~sBAAA,CAAAF,~~OAAA;~~AAUA~~,~~IAAAG~~,QAAA,~~GAAAH~~,OAAA;AACA,~~IAAAI~~,sBAAA,~~GAAAJ~~,OAAA;AACA,~~IAAAK~~,iBAAA,~~GAAAL~~,OAAA;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAOA,~~IAAIM~~,QAAQ,GAAG,CAAC;AAED,SAASC,kBAAkBA,CAAEC,KAA8B,EAAG;EAC5E;EACA,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAEC,KAAK;IAAEC,IAAI;IAAE,GAAGC;EAAU,CAAC,GAAGL,KAAK;EAEhE,MAAM,CAAEM,MAAM,CAAE,GAAG,IAAAC,iBAAQ,EAAG,QAAQ,EAAET,QAAU,EAAE,CAAC;EAErD,IAAAU,4CAAqB,EAAEF,MAAM,EAAEN,KAAM,CAAC;EACtC,MAAM;IAAES;EAAe,CAAC,GAAG,IAAAC,6BAAoB,EAAC,CAAC;EAEjD,IAAK,CAAED,cAAc,CAACE,OAAO,CAAEL,MAAO,CAAC,EAAEM,UAAU,EAAG;IACrD,OAAO,IAAI;EACZ;EAEA,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EAAE,6BAA6B,EAAEZ,SAAU,CAAC;EAEtE,OACC,~~IAAAX~~,~~QAAA~~,~~CAAAwB~~,aAAA,~~EAAClB~~,iBAAA,~~CAAAmB~~,UAAU;~~IAACd~~,SAAS,EAAGW,OAAS;IAAA,GAAMR;EAAS,GAC7CJ,QACS,CAAC;AAEf"}
1	+ {"version":3,"names":["_classnames","_interopRequireDefault","require","_element","_context","_useNavigationTreeItem","_navigationStyles","uniqueId","NavigationItemBase","props","children","className","title","href","restProps","itemId","useState","useNavigationTreeItem","navigationTree","useNavigationContext","getItem","_isVisible","classes","classnames","_react","createElement","ItemBaseUI"],"sources":["@wordpress/components/src/navigation/item/base.tsx"],"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"],"mappings":";;;;;;;;AAGA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,sBAAA,GAAAH,OAAA;AACA,IAAAI,iBAAA,GAAAJ,OAAA;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAOA,IAAIK,QAAQ,GAAG,CAAC;AAED,SAASC,kBAAkBA,CAAEC,KAA8B,EAAG;EAC5E;EACA,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAEC,KAAK;IAAEC,IAAI;IAAE,GAAGC;EAAU,CAAC,GAAGL,KAAK;EAEhE,MAAM,CAAEM,MAAM,CAAE,GAAG,IAAAC,iBAAQ,EAAG,QAAQ,EAAET,QAAU,EAAE,CAAC;EAErD,IAAAU,4CAAqB,EAAEF,MAAM,EAAEN,KAAM,CAAC;EACtC,MAAM;IAAES;EAAe,CAAC,GAAG,IAAAC,6BAAoB,EAAC,CAAC;EAEjD,IAAK,CAAED,cAAc,CAACE,OAAO,CAAEL,MAAO,CAAC,EAAEM,UAAU,EAAG;IACrD,OAAO,IAAI;EACZ;EAEA,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EAAE,6BAA6B,EAAEZ,SAAU,CAAC;EAEtE,OACC,IAAAa,MAAA,CAAAC,aAAA,EAACnB,iBAAA,CAAAoB,UAAU;IAACf,SAAS,EAAGW,OAAS;IAAA,GAAMR;EAAS,GAC7CJ,QACS,CAAC;AAEf"}