@wordpress/components 27.5.0 → 28.0.0

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

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","NavigableContainer","UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","createElement","stopNavigationEvents","onlyBrowserTabstops","NavigableMenu"],"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":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,kBAAkB,MAAM,aAAa;AAG5C,OAAO,SAASC,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,OACCC,aAAA,CAACb,kBAAkB;IAClBK,GAAG,EAAGA,GAAK;IACXS,oBAAoB;IACpBC,mBAAmB,EAAG,KAAO;IAC7Bb,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;AACA,OAAO,MAAMY,aAAa,GAAGjB,UAAU,CAAEE,wBAAyB,CAAC;AAEnE,eAAee,aAAa","ignoreList":[]}
+{"version":3,"names":["forwardRef","NavigableContainer","jsx","_jsx","UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","stopNavigationEvents","onlyBrowserTabstops","NavigableMenu"],"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":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,kBAAkB,MAAM,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAG7C,OAAO,SAASC,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,oBACCZ,IAAA,CAACF,kBAAkB;IAClBO,GAAG,EAAGA,GAAK;IACXQ,oBAAoB;IACpBC,mBAAmB,EAAG,KAAO;IAC7BZ,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;AACA,OAAO,MAAMW,aAAa,GAAGlB,UAAU,CAAEI,wBAAyB,CAAC;AAEnE,eAAec,aAAa","ignoreList":[]}

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

@@ -1,4 +1,3 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
@@ -12,6 +11,7 @@ import { forwardRef } from '@wordpress/element';
  * Internal dependencies
  */
 import NavigableContainer from './container';
+import { jsx as _jsx } from "react/jsx-runtime";
 export function UnforwardedTabbableContainer({
   eventToOffset,
   ...props
@@ -41,7 +41,7 @@ export function UnforwardedTabbableContainer({
     }
     return undefined;
   };
-  return createElement(NavigableContainer, {
+  return /*#__PURE__*/_jsx(NavigableContainer, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: true,

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

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","NavigableContainer","UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","createElement","stopNavigationEvents","onlyBrowserTabstops","TabbableContainer"],"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":";AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,kBAAkB,MAAM,aAAa;AAG5C,OAAO,SAASC,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,OACCC,aAAA,CAACV,kBAAkB;IAClBI,GAAG,EAAGA,GAAK;IACXO,oBAAoB;IACpBC,mBAAmB;IACnBV,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;AACA,OAAO,MAAMU,iBAAiB,GAAGd,UAAU,CAAEE,4BAA6B,CAAC;AAE3E,eAAeY,iBAAiB","ignoreList":[]}
+{"version":3,"names":["forwardRef","NavigableContainer","jsx","_jsx","UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","stopNavigationEvents","onlyBrowserTabstops","TabbableContainer"],"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":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,kBAAkB,MAAM,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAG7C,OAAO,SAASC,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,oBACCT,IAAA,CAACF,kBAAkB;IAClBM,GAAG,EAAGA,GAAK;IACXM,oBAAoB;IACpBC,mBAAmB;IACnBT,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;AACA,OAAO,MAAMS,iBAAiB,GAAGf,UAAU,CAAEI,4BAA6B,CAAC;AAE3E,eAAeW,iBAAiB","ignoreList":[]}

package/build-module/navigation/back-button/index.js

@@ -1,8 +1,7 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 /**
  * WordPress dependencies
  */
@@ -15,6 +14,8 @@ import { Icon, chevronLeft, chevronRight } from '@wordpress/icons';
  */
 import { useNavigationContext } from '../context';
 import { MenuBackButtonUI } from '../styles/navigation-styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 function UnforwardedNavigationBackButton({
   backButtonLabel,
   className,
@@ -26,7 +27,7 @@ function UnforwardedNavigationBackButton({
     setActiveMenu,
     navigationTree
   } = useNavigationContext();
-  const classes = classnames('components-navigation__back-button', className);
+  const classes = clsx('components-navigation__back-button', className);
   const parentMenuTitle = parentMenu !== undefined ? navigationTree.getMenu(parentMenu)?.title : undefined;
   const handleOnClick = event => {
     if (typeof onClick === 'function') {
@@ -38,15 +39,16 @@ function UnforwardedNavigationBackButton({
     }
   };
   const icon = isRTL() ? chevronRight : chevronLeft;
-  return createElement(MenuBackButtonUI, {
+  return /*#__PURE__*/_jsxs(MenuBackButtonUI, {
     className: classes,
     href: href,
     variant: "tertiary",
     ref: ref,
-    onClick: handleOnClick
-  }, createElement(Icon, {
-    icon: icon
-  }), backButtonLabel || parentMenuTitle || __('Back'));
+    onClick: handleOnClick,
+    children: [/*#__PURE__*/_jsx(Icon, {
+      icon: icon
+    }), backButtonLabel || parentMenuTitle || __('Back')]
+  });
 }
 
 /**

package/build-module/navigation/back-button/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","forwardRef","__","isRTL","Icon","chevronLeft","chevronRight","useNavigationContext","MenuBackButtonUI","UnforwardedNavigationBackButton","backButtonLabel","className","href","onClick","parentMenu","ref","setActiveMenu","navigationTree","classes","parentMenuTitle","undefined","getMenu","title","handleOnClick","event","animationDirection","defaultPrevented","icon","createElement","variant","NavigationBackButton"],"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\n/**\n * @deprecated Use `Navigator` instead.\n */\nexport const NavigationBackButton = forwardRef(\n\tUnforwardedNavigationBackButton\n);\n\nexport default NavigationBackButton;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;AACnC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,oBAAoB;AAC/C,SAASC,EAAE,EAAEC,KAAK,QAAQ,iBAAiB;AAC3C,SAASC,IAAI,EAAEC,WAAW,EAAEC,YAAY,QAAQ,kBAAkB;;AAElE;AACA;AACA;AACA,SAASC,oBAAoB,QAAQ,YAAY;AACjD,SAASC,gBAAgB,QAAQ,6BAA6B;AAI9D,SAASC,+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,GAAGV,oBAAoB,CAAC,CAAC;EAEhE,MAAMW,OAAO,GAAGlB,UAAU,CACzB,oCAAoC,EACpCW,SACD,CAAC;EAED,MAAMQ,eAAe,GACpBL,UAAU,KAAKM,SAAS,GACrBH,cAAc,CAACI,OAAO,CAAEP,UAAW,CAAC,EAAEQ,KAAK,GAC3CF,SAAS;EAEb,MAAMG,aAAqD,GAAKC,KAAK,IAAM;IAC1E,IAAK,OAAOX,OAAO,KAAK,UAAU,EAAG;MACpCA,OAAO,CAAEW,KAAM,CAAC;IACjB;IAEA,MAAMC,kBAAkB,GAAGtB,KAAK,CAAC,CAAC,GAAG,MAAM,GAAG,OAAO;IACrD,IAAKW,UAAU,IAAI,CAAEU,KAAK,CAACE,gBAAgB,EAAG;MAC7CV,aAAa,CAAEF,UAAU,EAAEW,kBAAmB,CAAC;IAChD;EACD,CAAC;EACD,MAAME,IAAI,GAAGxB,KAAK,CAAC,CAAC,GAAGG,YAAY,GAAGD,WAAW;EACjD,OACCuB,aAAA,CAACpB,gBAAgB;IAChBG,SAAS,EAAGO,OAAS;IACrBN,IAAI,EAAGA,IAAM;IACbiB,OAAO,EAAC,UAAU;IAClBd,GAAG,EAAGA,GAAK;IACXF,OAAO,EAAGU;EAAe,GAEzBK,aAAA,CAACxB,IAAI;IAACuB,IAAI,EAAGA;EAAM,CAAE,CAAC,EACpBjB,eAAe,IAAIS,eAAe,IAAIjB,EAAE,CAAE,MAAO,CAClC,CAAC;AAErB;;AAEA;AACA;AACA;AACA,OAAO,MAAM4B,oBAAoB,GAAG7B,UAAU,CAC7CQ,+BACD,CAAC;AAED,eAAeqB,oBAAoB","ignoreList":[]}
+{"version":3,"names":["clsx","forwardRef","__","isRTL","Icon","chevronLeft","chevronRight","useNavigationContext","MenuBackButtonUI","jsx","_jsx","jsxs","_jsxs","UnforwardedNavigationBackButton","backButtonLabel","className","href","onClick","parentMenu","ref","setActiveMenu","navigationTree","classes","parentMenuTitle","undefined","getMenu","title","handleOnClick","event","animationDirection","defaultPrevented","icon","variant","children","NavigationBackButton"],"sources":["@wordpress/components/src/navigation/back-button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\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 = clsx( 'components-navigation__back-button', className );\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\n/**\n * @deprecated Use `Navigator` instead.\n */\nexport const NavigationBackButton = forwardRef(\n\tUnforwardedNavigationBackButton\n);\n\nexport default NavigationBackButton;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;AACvB;AACA;AACA;AACA,SAASC,UAAU,QAAQ,oBAAoB;AAC/C,SAASC,EAAE,EAAEC,KAAK,QAAQ,iBAAiB;AAC3C,SAASC,IAAI,EAAEC,WAAW,EAAEC,YAAY,QAAQ,kBAAkB;;AAElE;AACA;AACA;AACA,SAASC,oBAAoB,QAAQ,YAAY;AACjD,SAASC,gBAAgB,QAAQ,6BAA6B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAI/D,SAASC,+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,GAAGd,oBAAoB,CAAC,CAAC;EAEhE,MAAMe,OAAO,GAAGtB,IAAI,CAAE,oCAAoC,EAAEe,SAAU,CAAC;EAEvE,MAAMQ,eAAe,GACpBL,UAAU,KAAKM,SAAS,GACrBH,cAAc,CAACI,OAAO,CAAEP,UAAW,CAAC,EAAEQ,KAAK,GAC3CF,SAAS;EAEb,MAAMG,aAAqD,GAAKC,KAAK,IAAM;IAC1E,IAAK,OAAOX,OAAO,KAAK,UAAU,EAAG;MACpCA,OAAO,CAAEW,KAAM,CAAC;IACjB;IAEA,MAAMC,kBAAkB,GAAG1B,KAAK,CAAC,CAAC,GAAG,MAAM,GAAG,OAAO;IACrD,IAAKe,UAAU,IAAI,CAAEU,KAAK,CAACE,gBAAgB,EAAG;MAC7CV,aAAa,CAAEF,UAAU,EAAEW,kBAAmB,CAAC;IAChD;EACD,CAAC;EACD,MAAME,IAAI,GAAG5B,KAAK,CAAC,CAAC,GAAGG,YAAY,GAAGD,WAAW;EACjD,oBACCO,KAAA,CAACJ,gBAAgB;IAChBO,SAAS,EAAGO,OAAS;IACrBN,IAAI,EAAGA,IAAM;IACbgB,OAAO,EAAC,UAAU;IAClBb,GAAG,EAAGA,GAAK;IACXF,OAAO,EAAGU,aAAe;IAAAM,QAAA,gBAEzBvB,IAAA,CAACN,IAAI;MAAC2B,IAAI,EAAGA;IAAM,CAAE,CAAC,EACpBjB,eAAe,IAAIS,eAAe,IAAIrB,EAAE,CAAE,MAAO,CAAC;EAAA,CACnC,CAAC;AAErB;;AAEA;AACA;AACA;AACA,OAAO,MAAMgC,oBAAoB,GAAGjC,UAAU,CAC7CY,+BACD,CAAC;AAED,eAAeqB,oBAAoB","ignoreList":[]}

package/build-module/navigation/group/index.js

@@ -1,8 +1,7 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -15,6 +14,8 @@ import { useState } from '@wordpress/element';
 import { NavigationGroupContext } from './context';
 import { GroupTitleUI } from '../styles/navigation-styles';
 import { useNavigationContext } from '../context';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 let uniqueId = 0;
 
 /**
@@ -37,24 +38,29 @@ export 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 createElement(NavigationGroupContext.Provider, {
-      value: context
-    }, children);
+    return /*#__PURE__*/_jsx(NavigationGroupContext.Provider, {
+      value: context,
+      children: children
+    });
   }
   const groupTitleId = `components-navigation__group-title-${groupId}`;
-  const classes = classnames('components-navigation__group', className);
-  return createElement(NavigationGroupContext.Provider, {
-    value: context
-  }, createElement("li", {
-    className: classes
-  }, title && createElement(GroupTitleUI, {
-    className: "components-navigation__group-title",
-    id: groupTitleId,
-    level: 3
-  }, title), createElement("ul", {
-    "aria-labelledby": groupTitleId,
-    role: "group"
-  }, children)));
+  const classes = clsx('components-navigation__group', className);
+  return /*#__PURE__*/_jsx(NavigationGroupContext.Provider, {
+    value: context,
+    children: /*#__PURE__*/_jsxs("li", {
+      className: classes,
+      children: [title && /*#__PURE__*/_jsx(GroupTitleUI, {
+        className: "components-navigation__group-title",
+        id: groupTitleId,
+        level: 3,
+        children: title
+      }), /*#__PURE__*/_jsx("ul", {
+        "aria-labelledby": groupTitleId,
+        role: "group",
+        children: children
+      })]
+    })
+  });
 }
 export default NavigationGroup;
 //# sourceMappingURL=index.js.map

package/build-module/navigation/group/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","useState","NavigationGroupContext","GroupTitleUI","useNavigationContext","uniqueId","NavigationGroup","children","className","title","groupId","navigationTree","items","context","group","Object","values","some","item","_isVisible","createElement","Provider","value","groupTitleId","classes","id","level","role"],"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\n/**\n * @deprecated Use `Navigator` instead.\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":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,QAAQ,QAAQ,oBAAoB;;AAE7C;AACA;AACA;AACA,SAASC,sBAAsB,QAAQ,WAAW;AAClD,SAASC,YAAY,QAAQ,6BAA6B;AAC1D,SAASC,oBAAoB,QAAQ,YAAY;AAIjD,IAAIC,QAAQ,GAAG,CAAC;;AAEhB;AACA;AACA;AACA,OAAO,SAASC,eAAeA,CAAE;EAChCC,QAAQ;EACRC,SAAS;EACTC;AACqB,CAAC,EAAG;EACzB,MAAM,CAAEC,OAAO,CAAE,GAAGT,QAAQ,CAAG,SAAS,EAAEI,QAAU,EAAE,CAAC;EACvD,MAAM;IACLM,cAAc,EAAE;MAAEC;IAAM;EACzB,CAAC,GAAGR,oBAAoB,CAAC,CAAC;EAE1B,MAAMS,OAAO,GAAG;IAAEC,KAAK,EAAEJ;EAAQ,CAAC;;EAElC;EACA,IACC,CAAEK,MAAM,CAACC,MAAM,CAAEJ,KAAM,CAAC,CAACK,IAAI,CAC1BC,IAAI,IAAMA,IAAI,CAACJ,KAAK,KAAKJ,OAAO,IAAIQ,IAAI,CAACC,UAC5C,CAAC,EACA;IACD,OACCC,aAAA,CAAClB,sBAAsB,CAACmB,QAAQ;MAACC,KAAK,EAAGT;IAAS,GAC/CN,QAC8B,CAAC;EAEpC;EAEA,MAAMgB,YAAY,GAAI,sCAAsCb,OAAS,EAAC;EACtE,MAAMc,OAAO,GAAGxB,UAAU,CAAE,8BAA8B,EAAEQ,SAAU,CAAC;EAEvE,OACCY,aAAA,CAAClB,sBAAsB,CAACmB,QAAQ;IAACC,KAAK,EAAGT;EAAS,GACjDO,aAAA;IAAIZ,SAAS,EAAGgB;EAAS,GACtBf,KAAK,IACNW,aAAA,CAACjB,YAAY;IACZK,SAAS,EAAC,oCAAoC;IAC9CiB,EAAE,EAAGF,YAAc;IACnBG,KAAK,EAAG;EAAG,GAETjB,KACW,CACd,EACDW,aAAA;IAAI,mBAAkBG,YAAc;IAACI,IAAI,EAAC;EAAO,GAC9CpB,QACC,CACD,CAC4B,CAAC;AAEpC;AAEA,eAAeD,eAAe","ignoreList":[]}
+{"version":3,"names":["clsx","useState","NavigationGroupContext","GroupTitleUI","useNavigationContext","jsx","_jsx","jsxs","_jsxs","uniqueId","NavigationGroup","children","className","title","groupId","navigationTree","items","context","group","Object","values","some","item","_isVisible","Provider","value","groupTitleId","classes","id","level","role"],"sources":["@wordpress/components/src/navigation/group/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\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\n/**\n * @deprecated Use `Navigator` instead.\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 = clsx( '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":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,QAAQ,QAAQ,oBAAoB;;AAE7C;AACA;AACA;AACA,SAASC,sBAAsB,QAAQ,WAAW;AAClD,SAASC,YAAY,QAAQ,6BAA6B;AAC1D,SAASC,oBAAoB,QAAQ,YAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAIlD,IAAIC,QAAQ,GAAG,CAAC;;AAEhB;AACA;AACA;AACA,OAAO,SAASC,eAAeA,CAAE;EAChCC,QAAQ;EACRC,SAAS;EACTC;AACqB,CAAC,EAAG;EACzB,MAAM,CAAEC,OAAO,CAAE,GAAGb,QAAQ,CAAG,SAAS,EAAEQ,QAAU,EAAE,CAAC;EACvD,MAAM;IACLM,cAAc,EAAE;MAAEC;IAAM;EACzB,CAAC,GAAGZ,oBAAoB,CAAC,CAAC;EAE1B,MAAMa,OAAO,GAAG;IAAEC,KAAK,EAAEJ;EAAQ,CAAC;;EAElC;EACA,IACC,CAAEK,MAAM,CAACC,MAAM,CAAEJ,KAAM,CAAC,CAACK,IAAI,CAC1BC,IAAI,IAAMA,IAAI,CAACJ,KAAK,KAAKJ,OAAO,IAAIQ,IAAI,CAACC,UAC5C,CAAC,EACA;IACD,oBACCjB,IAAA,CAACJ,sBAAsB,CAACsB,QAAQ;MAACC,KAAK,EAAGR,OAAS;MAAAN,QAAA,EAC/CA;IAAQ,CACsB,CAAC;EAEpC;EAEA,MAAMe,YAAY,GAAI,sCAAsCZ,OAAS,EAAC;EACtE,MAAMa,OAAO,GAAG3B,IAAI,CAAE,8BAA8B,EAAEY,SAAU,CAAC;EAEjE,oBACCN,IAAA,CAACJ,sBAAsB,CAACsB,QAAQ;IAACC,KAAK,EAAGR,OAAS;IAAAN,QAAA,eACjDH,KAAA;MAAII,SAAS,EAAGe,OAAS;MAAAhB,QAAA,GACtBE,KAAK,iBACNP,IAAA,CAACH,YAAY;QACZS,SAAS,EAAC,oCAAoC;QAC9CgB,EAAE,EAAGF,YAAc;QACnBG,KAAK,EAAG,CAAG;QAAAlB,QAAA,EAETE;MAAK,CACM,CACd,eACDP,IAAA;QAAI,mBAAkBoB,YAAc;QAACI,IAAI,EAAC,OAAO;QAAAnB,QAAA,EAC9CA;MAAQ,CACP,CAAC;IAAA,CACF;EAAC,CAC2B,CAAC;AAEpC;AAEA,eAAeD,eAAe","ignoreList":[]}

package/build-module/navigation/index.js

@@ -1,8 +1,7 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -18,6 +17,7 @@ import { ROOT_MENU } from './constants';
 import { NavigationContext } from './context';
 import { NavigationUI } from './styles/navigation-styles';
 import { useCreateNavigationTree } from './use-create-navigation-tree';
+import { jsx as _jsx } from "react/jsx-runtime";
 const noop = () => {};
 
 /**
@@ -103,21 +103,23 @@ export function Navigation({
     setActiveMenu,
     navigationTree
   };
-  const classes = classnames('components-navigation', className);
+  const classes = clsx('components-navigation', className);
   const animateClassName = getAnimateClassName({
     type: 'slide-in',
     origin: slideOrigin
   });
-  return createElement(NavigationUI, {
-    className: classes
-  }, createElement("div", {
-    key: menu,
-    className: animateClassName ? classnames({
-      [animateClassName]: isMounted.current && slideOrigin
-    }) : undefined
-  }, createElement(NavigationContext.Provider, {
-    value: context
-  }, children)));
+  return /*#__PURE__*/_jsx(NavigationUI, {
+    className: classes,
+    children: /*#__PURE__*/_jsx("div", {
+      className: animateClassName ? clsx({
+        [animateClassName]: isMounted.current && slideOrigin
+      }) : undefined,
+      children: /*#__PURE__*/_jsx(NavigationContext.Provider, {
+        value: context,
+        children: children
+      })
+    }, menu)
+  });
 }
 export default Navigation;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["classnames","useEffect","useRef","useState","isRTL","getAnimateClassName","ROOT_MENU","NavigationContext","NavigationUI","useCreateNavigationTree","noop","Navigation","activeItem","activeMenu","children","className","onActivateMenu","menu","setMenu","slideOrigin","setSlideOrigin","navigationTree","defaultSlideOrigin","setActiveMenu","menuId","slideInOrigin","getMenu","isMounted","current","context","classes","animateClassName","type","origin","createElement","key","undefined","Provider","value"],"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 * @deprecated Use `Navigator` instead.\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":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,oBAAoB;AAChE,SAASC,KAAK,QAAQ,iBAAiB;;AAEvC;AACA;AACA;AACA,SAASC,mBAAmB,QAAQ,YAAY;AAChD,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,iBAAiB,QAAQ,WAAW;AAC7C,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,uBAAuB,QAAQ,8BAA8B;AAOtE,MAAMC,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;AACA;AACA;AACA,OAAO,SAASC,UAAUA,CAAE;EAC3BC,UAAU;EACVC,UAAU,GAAGP,SAAS;EACtBQ,QAAQ;EACRC,SAAS;EACTC,cAAc,GAAGN;AACD,CAAC,EAAG;EACpB,MAAM,CAAEO,IAAI,EAAEC,OAAO,CAAE,GAAGf,QAAQ,CAAEU,UAAW,CAAC;EAChD,MAAM,CAAEM,WAAW,EAAEC,cAAc,CAAE,GAAGjB,QAAQ,CAAqB,CAAC;EACtE,MAAMkB,cAAc,GAAGZ,uBAAuB,CAAC,CAAC;EAChD,MAAMa,kBAAkB,GAAGlB,KAAK,CAAC,CAAC,GAAG,OAAO,GAAG,MAAM;EAErD,MAAMmB,aAAuD,GAAGA,CAC/DC,MAAM,EACNC,aAAa,GAAGH,kBAAkB,KAC9B;IACJ,IAAK,CAAED,cAAc,CAACK,OAAO,CAAEF,MAAO,CAAC,EAAG;MACzC;IACD;IAEAJ,cAAc,CAAEK,aAAc,CAAC;IAC/BP,OAAO,CAAEM,MAAO,CAAC;IACjBR,cAAc,CAAEQ,MAAO,CAAC;EACzB,CAAC;;EAED;EACA,MAAMG,SAAS,GAAGzB,MAAM,CAAE,KAAM,CAAC;EACjCD,SAAS,CAAE,MAAM;IAChB,IAAK,CAAE0B,SAAS,CAACC,OAAO,EAAG;MAC1BD,SAAS,CAACC,OAAO,GAAG,IAAI;IACzB;EACD,CAAC,EAAE,EAAG,CAAC;EAEP3B,SAAS,CAAE,MAAM;IAChB,IAAKY,UAAU,KAAKI,IAAI,EAAG;MAC1BM,aAAa,CAAEV,UAAW,CAAC;IAC5B;IACA;IACA;IACA;EACD,CAAC,EAAE,CAAEA,UAAU,CAAG,CAAC;EAEnB,MAAMgB,OAAO,GAAG;IACfjB,UAAU;IACVC,UAAU,EAAEI,IAAI;IAChBM,aAAa;IACbF;EACD,CAAC;EAED,MAAMS,OAAO,GAAG9B,UAAU,CAAE,uBAAuB,EAAEe,SAAU,CAAC;EAChE,MAAMgB,gBAAgB,GAAG1B,mBAAmB,CAAE;IAC7C2B,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAEd;EACT,CAAE,CAAC;EAEH,OACCe,aAAA,CAAC1B,YAAY;IAACO,SAAS,EAAGe;EAAS,GAClCI,aAAA;IACCC,GAAG,EAAGlB,IAAM;IACZF,SAAS,EACRgB,gBAAgB,GACb/B,UAAU,CAAE;MACZ,CAAE+B,gBAAgB,GACjBJ,SAAS,CAACC,OAAO,IAAIT;IACtB,CAAE,CAAC,GACHiB;EACH,GAEDF,aAAA,CAAC3B,iBAAiB,CAAC8B,QAAQ;IAACC,KAAK,EAAGT;EAAS,GAC1Cf,QACyB,CACxB,CACQ,CAAC;AAEjB;AAEA,eAAeH,UAAU","ignoreList":[]}
+{"version":3,"names":["clsx","useEffect","useRef","useState","isRTL","getAnimateClassName","ROOT_MENU","NavigationContext","NavigationUI","useCreateNavigationTree","jsx","_jsx","noop","Navigation","activeItem","activeMenu","children","className","onActivateMenu","menu","setMenu","slideOrigin","setSlideOrigin","navigationTree","defaultSlideOrigin","setActiveMenu","menuId","slideInOrigin","getMenu","isMounted","current","context","classes","animateClassName","type","origin","undefined","Provider","value"],"sources":["@wordpress/components/src/navigation/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\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 * @deprecated Use `Navigator` instead.\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 = clsx( '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? clsx( {\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":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,oBAAoB;AAChE,SAASC,KAAK,QAAQ,iBAAiB;;AAEvC;AACA;AACA;AACA,SAASC,mBAAmB,QAAQ,YAAY;AAChD,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,iBAAiB,QAAQ,WAAW;AAC7C,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,uBAAuB,QAAQ,8BAA8B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAOvE,MAAMC,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;AACA;AACA;AACA,OAAO,SAASC,UAAUA,CAAE;EAC3BC,UAAU;EACVC,UAAU,GAAGT,SAAS;EACtBU,QAAQ;EACRC,SAAS;EACTC,cAAc,GAAGN;AACD,CAAC,EAAG;EACpB,MAAM,CAAEO,IAAI,EAAEC,OAAO,CAAE,GAAGjB,QAAQ,CAAEY,UAAW,CAAC;EAChD,MAAM,CAAEM,WAAW,EAAEC,cAAc,CAAE,GAAGnB,QAAQ,CAAqB,CAAC;EACtE,MAAMoB,cAAc,GAAGd,uBAAuB,CAAC,CAAC;EAChD,MAAMe,kBAAkB,GAAGpB,KAAK,CAAC,CAAC,GAAG,OAAO,GAAG,MAAM;EAErD,MAAMqB,aAAuD,GAAGA,CAC/DC,MAAM,EACNC,aAAa,GAAGH,kBAAkB,KAC9B;IACJ,IAAK,CAAED,cAAc,CAACK,OAAO,CAAEF,MAAO,CAAC,EAAG;MACzC;IACD;IAEAJ,cAAc,CAAEK,aAAc,CAAC;IAC/BP,OAAO,CAAEM,MAAO,CAAC;IACjBR,cAAc,CAAEQ,MAAO,CAAC;EACzB,CAAC;;EAED;EACA,MAAMG,SAAS,GAAG3B,MAAM,CAAE,KAAM,CAAC;EACjCD,SAAS,CAAE,MAAM;IAChB,IAAK,CAAE4B,SAAS,CAACC,OAAO,EAAG;MAC1BD,SAAS,CAACC,OAAO,GAAG,IAAI;IACzB;EACD,CAAC,EAAE,EAAG,CAAC;EAEP7B,SAAS,CAAE,MAAM;IAChB,IAAKc,UAAU,KAAKI,IAAI,EAAG;MAC1BM,aAAa,CAAEV,UAAW,CAAC;IAC5B;IACA;IACA;IACA;EACD,CAAC,EAAE,CAAEA,UAAU,CAAG,CAAC;EAEnB,MAAMgB,OAAO,GAAG;IACfjB,UAAU;IACVC,UAAU,EAAEI,IAAI;IAChBM,aAAa;IACbF;EACD,CAAC;EAED,MAAMS,OAAO,GAAGhC,IAAI,CAAE,uBAAuB,EAAEiB,SAAU,CAAC;EAC1D,MAAMgB,gBAAgB,GAAG5B,mBAAmB,CAAE;IAC7C6B,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAEd;EACT,CAAE,CAAC;EAEH,oBACCV,IAAA,CAACH,YAAY;IAACS,SAAS,EAAGe,OAAS;IAAAhB,QAAA,eAClCL,IAAA;MAECM,SAAS,EACRgB,gBAAgB,GACbjC,IAAI,CAAE;QACN,CAAEiC,gBAAgB,GACjBJ,SAAS,CAACC,OAAO,IAAIT;MACtB,CAAE,CAAC,GACHe,SACH;MAAApB,QAAA,eAEDL,IAAA,CAACJ,iBAAiB,CAAC8B,QAAQ;QAACC,KAAK,EAAGP,OAAS;QAAAf,QAAA,EAC1CA;MAAQ,CACiB;IAAC,GAZvBG,IAaF;EAAC,CACO,CAAC;AAEjB;AAEA,eAAeN,UAAU","ignoreList":[]}

package/build-module/navigation/item/base-content.js

@@ -1,18 +1,24 @@
-import { createElement, Fragment } from "react";
 /**
  * Internal dependencies
  */
 import { ItemBadgeUI, ItemTitleUI } from '../styles/navigation-styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 export default function NavigationItemBaseContent(props) {
   const {
     badge,
     title
   } = props;
-  return createElement(Fragment, null, title && createElement(ItemTitleUI, {
-    className: "components-navigation__item-title",
-    as: "span"
-  }, title), badge && createElement(ItemBadgeUI, {
-    className: "components-navigation__item-badge"
-  }, badge));
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [title && /*#__PURE__*/_jsx(ItemTitleUI, {
+      className: "components-navigation__item-title",
+      as: "span",
+      children: title
+    }), badge && /*#__PURE__*/_jsx(ItemBadgeUI, {
+      className: "components-navigation__item-badge",
+      children: badge
+    })]
+  });
 }
 //# sourceMappingURL=base-content.js.map

package/build-module/navigation/item/base-content.js.map

@@ -1 +1 @@
-{"version":3,"names":["ItemBadgeUI","ItemTitleUI","NavigationItemBaseContent","props","badge","title","createElement","Fragment","className","as"],"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":";AAAA;AACA;AACA;AACA,SAASA,WAAW,EAAEC,WAAW,QAAQ,6BAA6B;AAItE,eAAe,SAASC,yBAAyBA,CAChDC,KAAqC,EACpC;EACD,MAAM;IAAEC,KAAK;IAAEC;EAAM,CAAC,GAAGF,KAAK;EAE9B,OACCG,aAAA,CAAAC,QAAA,QACGF,KAAK,IACNC,aAAA,CAACL,WAAW;IACXO,SAAS,EAAC,mCAAmC;IAC7CC,EAAE,EAAC;EAAM,GAEPJ,KACU,CACb,EAECD,KAAK,IACNE,aAAA,CAACN,WAAW;IAACQ,SAAS,EAAC;EAAmC,GACvDJ,KACU,CAEb,CAAC;AAEL","ignoreList":[]}
+{"version":3,"names":["ItemBadgeUI","ItemTitleUI","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","NavigationItemBaseContent","props","badge","title","children","className","as"],"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":"AAAA;AACA;AACA;AACA,SAASA,WAAW,EAAEC,WAAW,QAAQ,6BAA6B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAIvE,eAAe,SAASC,yBAAyBA,CAChDC,KAAqC,EACpC;EACD,MAAM;IAAEC,KAAK;IAAEC;EAAM,CAAC,GAAGF,KAAK;EAE9B,oBACCF,KAAA,CAAAF,SAAA;IAAAO,QAAA,GACGD,KAAK,iBACNR,IAAA,CAACF,WAAW;MACXY,SAAS,EAAC,mCAAmC;MAC7CC,EAAE,EAAC,MAAM;MAAAF,QAAA,EAEPD;IAAK,CACK,CACb,EAECD,KAAK,iBACNP,IAAA,CAACH,WAAW;MAACa,SAAS,EAAC,mCAAmC;MAAAD,QAAA,EACvDF;IAAK,CACK,CACb;EAAA,CACA,CAAC;AAEL","ignoreList":[]}

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

@@ -1,8 +1,7 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -15,6 +14,7 @@ import { useState } from '@wordpress/element';
 import { useNavigationContext } from '../context';
 import { useNavigationTreeItem } from './use-navigation-tree-item';
 import { ItemBaseUI } from '../styles/navigation-styles';
+import { jsx as _jsx } from "react/jsx-runtime";
 let uniqueId = 0;
 export default function NavigationItemBase(props) {
   // Also avoid to pass the `title` and `href` props to the ItemBaseUI styled component.
@@ -33,10 +33,11 @@ export default function NavigationItemBase(props) {
   if (!navigationTree.getItem(itemId)?._isVisible) {
     return null;
   }
-  const classes = classnames('components-navigation__item', className);
-  return createElement(ItemBaseUI, {
+  const classes = clsx('components-navigation__item', className);
+  return /*#__PURE__*/_jsx(ItemBaseUI, {
     className: classes,
-    ...restProps
-  }, children);
+    ...restProps,
+    children: children
+  });
 }
 //# sourceMappingURL=base.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["classnames","useState","useNavigationContext","useNavigationTreeItem","ItemBaseUI","uniqueId","NavigationItemBase","props","children","className","title","href","restProps","itemId","navigationTree","getItem","_isVisible","classes","createElement"],"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":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,QAAQ,QAAQ,oBAAoB;;AAE7C;AACA;AACA;AACA,SAASC,oBAAoB,QAAQ,YAAY;AACjD,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAASC,UAAU,QAAQ,6BAA6B;AAIxD,IAAIC,QAAQ,GAAG,CAAC;AAEhB,eAAe,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,GAAGZ,QAAQ,CAAG,QAAQ,EAAEI,QAAU,EAAE,CAAC;EAErDF,qBAAqB,CAAEU,MAAM,EAAEN,KAAM,CAAC;EACtC,MAAM;IAAEO;EAAe,CAAC,GAAGZ,oBAAoB,CAAC,CAAC;EAEjD,IAAK,CAAEY,cAAc,CAACC,OAAO,CAAEF,MAAO,CAAC,EAAEG,UAAU,EAAG;IACrD,OAAO,IAAI;EACZ;EAEA,MAAMC,OAAO,GAAGjB,UAAU,CAAE,6BAA6B,EAAES,SAAU,CAAC;EAEtE,OACCS,aAAA,CAACd,UAAU;IAACK,SAAS,EAAGQ,OAAS;IAAA,GAAML;EAAS,GAC7CJ,QACS,CAAC;AAEf","ignoreList":[]}
+{"version":3,"names":["clsx","useState","useNavigationContext","useNavigationTreeItem","ItemBaseUI","jsx","_jsx","uniqueId","NavigationItemBase","props","children","className","title","href","restProps","itemId","navigationTree","getItem","_isVisible","classes"],"sources":["@wordpress/components/src/navigation/item/base.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\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 = clsx( '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":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,QAAQ,QAAQ,oBAAoB;;AAE7C;AACA;AACA;AACA,SAASC,oBAAoB,QAAQ,YAAY;AACjD,SAASC,qBAAqB,QAAQ,4BAA4B;AAClE,SAASC,UAAU,QAAQ,6BAA6B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIzD,IAAIC,QAAQ,GAAG,CAAC;AAEhB,eAAe,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,GAAGd,QAAQ,CAAG,QAAQ,EAAEM,QAAU,EAAE,CAAC;EAErDJ,qBAAqB,CAAEY,MAAM,EAAEN,KAAM,CAAC;EACtC,MAAM;IAAEO;EAAe,CAAC,GAAGd,oBAAoB,CAAC,CAAC;EAEjD,IAAK,CAAEc,cAAc,CAACC,OAAO,CAAEF,MAAO,CAAC,EAAEG,UAAU,EAAG;IACrD,OAAO,IAAI;EACZ;EAEA,MAAMC,OAAO,GAAGnB,IAAI,CAAE,6BAA6B,EAAEW,SAAU,CAAC;EAEhE,oBACCL,IAAA,CAACF,UAAU;IAACO,SAAS,EAAGQ,OAAS;IAAA,GAAML,SAAS;IAAAJ,QAAA,EAC7CA;EAAQ,CACC,CAAC;AAEf","ignoreList":[]}

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

@@ -1,8 +1,7 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -18,6 +17,8 @@ import { useNavigationContext } from '../context';
 import { ItemUI, ItemIconUI } from '../styles/navigation-styles';
 import NavigationItemBaseContent from './base-content';
 import NavigationItemBase from './base';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const noop = () => {};
 
 /**
@@ -53,7 +54,7 @@ export function NavigationItem(props) {
     return null;
   }
   const isActive = item && activeItem === item;
-  const classes = classnames(className, {
+  const classes = clsx(className, {
     'is-active': isActive
   });
   const onItemClick = event => {
@@ -74,19 +75,23 @@ export function NavigationItem(props) {
     'aria-current': isActive ? 'page' : undefined,
     ...restProps
   };
-  return createElement(NavigationItemBase, {
+  return /*#__PURE__*/_jsx(NavigationItemBase, {
     ...baseProps,
-    className: classes
-  }, children || createElement(ItemUI, {
-    ...itemProps
-  }, icon && createElement(ItemIconUI, null, createElement(Icon, {
-    icon: icon
-  })), createElement(NavigationItemBaseContent, {
-    title: title,
-    badge: badge
-  }), navigateToMenu && createElement(Icon, {
-    icon: navigationIcon
-  })));
+    className: classes,
+    children: children || /*#__PURE__*/_jsxs(ItemUI, {
+      ...itemProps,
+      children: [icon && /*#__PURE__*/_jsx(ItemIconUI, {
+        children: /*#__PURE__*/_jsx(Icon, {
+          icon: icon
+        })
+      }), /*#__PURE__*/_jsx(NavigationItemBaseContent, {
+        title: title,
+        badge: badge
+      }), navigateToMenu && /*#__PURE__*/_jsx(Icon, {
+        icon: navigationIcon
+      })]
+    })
+  });
 }
 export default NavigationItem;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["classnames","Icon","chevronLeft","chevronRight","isRTL","Button","useNavigationContext","ItemUI","ItemIconUI","NavigationItemBaseContent","NavigationItemBase","noop","NavigationItem","props","badge","children","className","href","item","navigateToMenu","onClick","title","icon","hideIfTargetMenuEmpty","isText","restProps","activeItem","setActiveMenu","navigationTree","isMenuEmpty","isActive","classes","onItemClick","event","navigationIcon","baseProps","undefined","itemProps","as","createElement"],"sources":["@wordpress/components/src/navigation/item/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { useNavigationContext } from '../context';\nimport { ItemUI, ItemIconUI } from '../styles/navigation-styles';\nimport NavigationItemBaseContent from './base-content';\nimport NavigationItemBase from './base';\n\nimport type { NavigationItemProps } from '../types';\n\nconst noop = () => {};\n\n/**\n * @deprecated Use `Navigator` instead.\n */\nexport function NavigationItem( props: NavigationItemProps ) {\n\tconst {\n\t\tbadge,\n\t\tchildren,\n\t\tclassName,\n\t\thref,\n\t\titem,\n\t\tnavigateToMenu,\n\t\tonClick = noop,\n\t\ttitle,\n\t\ticon,\n\t\thideIfTargetMenuEmpty,\n\t\tisText,\n\t\t...restProps\n\t} = props;\n\n\tconst {\n\t\tactiveItem,\n\t\tsetActiveMenu,\n\t\tnavigationTree: { isMenuEmpty },\n\t} = useNavigationContext();\n\n\t// If hideIfTargetMenuEmpty prop is true\n\t// And the menu we are supposed to navigate to\n\t// Is marked as empty, then we skip rendering the item.\n\tif (\n\t\thideIfTargetMenuEmpty &&\n\t\tnavigateToMenu &&\n\t\tisMenuEmpty( navigateToMenu )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isActive = item && activeItem === item;\n\n\tconst classes = classnames( className, {\n\t\t'is-active': isActive,\n\t} );\n\n\tconst onItemClick: React.MouseEventHandler<\n\t\tHTMLButtonElement | HTMLAnchorElement\n\t> = ( event ) => {\n\t\tif ( navigateToMenu ) {\n\t\t\tsetActiveMenu( navigateToMenu );\n\t\t}\n\n\t\tonClick( event );\n\t};\n\tconst navigationIcon = isRTL() ? chevronLeft : chevronRight;\n\tconst baseProps = children ? props : { ...props, onClick: undefined };\n\tconst itemProps = isText\n\t\t? restProps\n\t\t: {\n\t\t\t\tas: Button,\n\t\t\t\thref,\n\t\t\t\tonClick: onItemClick,\n\t\t\t\t'aria-current': isActive ? 'page' : undefined,\n\t\t\t\t...restProps,\n\t\t  };\n\n\treturn (\n\t\t<NavigationItemBase { ...baseProps } className={ classes }>\n\t\t\t{ children || (\n\t\t\t\t<ItemUI { ...itemProps }>\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<ItemIconUI>\n\t\t\t\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t\t\t</ItemIconUI>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<NavigationItemBaseContent\n\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\tbadge={ badge }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ navigateToMenu && <Icon icon={ navigationIcon } /> }\n\t\t\t\t</ItemUI>\n\t\t\t) }\n\t\t</NavigationItemBase>\n\t);\n}\n\nexport default NavigationItem;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,IAAI,EAAEC,WAAW,EAAEC,YAAY,QAAQ,kBAAkB;AAClE,SAASC,KAAK,QAAQ,iBAAiB;;AAEvC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,SAASC,oBAAoB,QAAQ,YAAY;AACjD,SAASC,MAAM,EAAEC,UAAU,QAAQ,6BAA6B;AAChE,OAAOC,yBAAyB,MAAM,gBAAgB;AACtD,OAAOC,kBAAkB,MAAM,QAAQ;AAIvC,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;;AAErB;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAAEC,KAA0B,EAAG;EAC5D,MAAM;IACLC,KAAK;IACLC,QAAQ;IACRC,SAAS;IACTC,IAAI;IACJC,IAAI;IACJC,cAAc;IACdC,OAAO,GAAGT,IAAI;IACdU,KAAK;IACLC,IAAI;IACJC,qBAAqB;IACrBC,MAAM;IACN,GAAGC;EACJ,CAAC,GAAGZ,KAAK;EAET,MAAM;IACLa,UAAU;IACVC,aAAa;IACbC,cAAc,EAAE;MAAEC;IAAY;EAC/B,CAAC,GAAGvB,oBAAoB,CAAC,CAAC;;EAE1B;EACA;EACA;EACA,IACCiB,qBAAqB,IACrBJ,cAAc,IACdU,WAAW,CAAEV,cAAe,CAAC,EAC5B;IACD,OAAO,IAAI;EACZ;EAEA,MAAMW,QAAQ,GAAGZ,IAAI,IAAIQ,UAAU,KAAKR,IAAI;EAE5C,MAAMa,OAAO,GAAG/B,UAAU,CAAEgB,SAAS,EAAE;IACtC,WAAW,EAAEc;EACd,CAAE,CAAC;EAEH,MAAME,WAEL,GAAKC,KAAK,IAAM;IAChB,IAAKd,cAAc,EAAG;MACrBQ,aAAa,CAAER,cAAe,CAAC;IAChC;IAEAC,OAAO,CAAEa,KAAM,CAAC;EACjB,CAAC;EACD,MAAMC,cAAc,GAAG9B,KAAK,CAAC,CAAC,GAAGF,WAAW,GAAGC,YAAY;EAC3D,MAAMgC,SAAS,GAAGpB,QAAQ,GAAGF,KAAK,GAAG;IAAE,GAAGA,KAAK;IAAEO,OAAO,EAAEgB;EAAU,CAAC;EACrE,MAAMC,SAAS,GAAGb,MAAM,GACrBC,SAAS,GACT;IACAa,EAAE,EAAEjC,MAAM;IACVY,IAAI;IACJG,OAAO,EAAEY,WAAW;IACpB,cAAc,EAAEF,QAAQ,GAAG,MAAM,GAAGM,SAAS;IAC7C,GAAGX;EACH,CAAC;EAEJ,OACCc,aAAA,CAAC7B,kBAAkB;IAAA,GAAMyB,SAAS;IAAGnB,SAAS,EAAGe;EAAS,GACvDhB,QAAQ,IACTwB,aAAA,CAAChC,MAAM;IAAA,GAAM8B;EAAS,GACnBf,IAAI,IACLiB,aAAA,CAAC/B,UAAU,QACV+B,aAAA,CAACtC,IAAI;IAACqB,IAAI,EAAGA;EAAM,CAAE,CACV,CACZ,EAEDiB,aAAA,CAAC9B,yBAAyB;IACzBY,KAAK,EAAGA,KAAO;IACfP,KAAK,EAAGA;EAAO,CACf,CAAC,EAEAK,cAAc,IAAIoB,aAAA,CAACtC,IAAI;IAACqB,IAAI,EAAGY;EAAgB,CAAE,CAC5C,CAEU,CAAC;AAEvB;AAEA,eAAetB,cAAc","ignoreList":[]}
+{"version":3,"names":["clsx","Icon","chevronLeft","chevronRight","isRTL","Button","useNavigationContext","ItemUI","ItemIconUI","NavigationItemBaseContent","NavigationItemBase","jsx","_jsx","jsxs","_jsxs","noop","NavigationItem","props","badge","children","className","href","item","navigateToMenu","onClick","title","icon","hideIfTargetMenuEmpty","isText","restProps","activeItem","setActiveMenu","navigationTree","isMenuEmpty","isActive","classes","onItemClick","event","navigationIcon","baseProps","undefined","itemProps","as"],"sources":["@wordpress/components/src/navigation/item/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { useNavigationContext } from '../context';\nimport { ItemUI, ItemIconUI } from '../styles/navigation-styles';\nimport NavigationItemBaseContent from './base-content';\nimport NavigationItemBase from './base';\n\nimport type { NavigationItemProps } from '../types';\n\nconst noop = () => {};\n\n/**\n * @deprecated Use `Navigator` instead.\n */\nexport function NavigationItem( props: NavigationItemProps ) {\n\tconst {\n\t\tbadge,\n\t\tchildren,\n\t\tclassName,\n\t\thref,\n\t\titem,\n\t\tnavigateToMenu,\n\t\tonClick = noop,\n\t\ttitle,\n\t\ticon,\n\t\thideIfTargetMenuEmpty,\n\t\tisText,\n\t\t...restProps\n\t} = props;\n\n\tconst {\n\t\tactiveItem,\n\t\tsetActiveMenu,\n\t\tnavigationTree: { isMenuEmpty },\n\t} = useNavigationContext();\n\n\t// If hideIfTargetMenuEmpty prop is true\n\t// And the menu we are supposed to navigate to\n\t// Is marked as empty, then we skip rendering the item.\n\tif (\n\t\thideIfTargetMenuEmpty &&\n\t\tnavigateToMenu &&\n\t\tisMenuEmpty( navigateToMenu )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isActive = item && activeItem === item;\n\n\tconst classes = clsx( className, {\n\t\t'is-active': isActive,\n\t} );\n\n\tconst onItemClick: React.MouseEventHandler<\n\t\tHTMLButtonElement | HTMLAnchorElement\n\t> = ( event ) => {\n\t\tif ( navigateToMenu ) {\n\t\t\tsetActiveMenu( navigateToMenu );\n\t\t}\n\n\t\tonClick( event );\n\t};\n\tconst navigationIcon = isRTL() ? chevronLeft : chevronRight;\n\tconst baseProps = children ? props : { ...props, onClick: undefined };\n\tconst itemProps = isText\n\t\t? restProps\n\t\t: {\n\t\t\t\tas: Button,\n\t\t\t\thref,\n\t\t\t\tonClick: onItemClick,\n\t\t\t\t'aria-current': isActive ? 'page' : undefined,\n\t\t\t\t...restProps,\n\t\t  };\n\n\treturn (\n\t\t<NavigationItemBase { ...baseProps } className={ classes }>\n\t\t\t{ children || (\n\t\t\t\t<ItemUI { ...itemProps }>\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<ItemIconUI>\n\t\t\t\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t\t\t</ItemIconUI>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<NavigationItemBaseContent\n\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\tbadge={ badge }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ navigateToMenu && <Icon icon={ navigationIcon } /> }\n\t\t\t\t</ItemUI>\n\t\t\t) }\n\t\t</NavigationItemBase>\n\t);\n}\n\nexport default NavigationItem;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,IAAI,EAAEC,WAAW,EAAEC,YAAY,QAAQ,kBAAkB;AAClE,SAASC,KAAK,QAAQ,iBAAiB;;AAEvC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,SAASC,oBAAoB,QAAQ,YAAY;AACjD,SAASC,MAAM,EAAEC,UAAU,QAAQ,6BAA6B;AAChE,OAAOC,yBAAyB,MAAM,gBAAgB;AACtD,OAAOC,kBAAkB,MAAM,QAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAIxC,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;;AAErB;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAAEC,KAA0B,EAAG;EAC5D,MAAM;IACLC,KAAK;IACLC,QAAQ;IACRC,SAAS;IACTC,IAAI;IACJC,IAAI;IACJC,cAAc;IACdC,OAAO,GAAGT,IAAI;IACdU,KAAK;IACLC,IAAI;IACJC,qBAAqB;IACrBC,MAAM;IACN,GAAGC;EACJ,CAAC,GAAGZ,KAAK;EAET,MAAM;IACLa,UAAU;IACVC,aAAa;IACbC,cAAc,EAAE;MAAEC;IAAY;EAC/B,CAAC,GAAG3B,oBAAoB,CAAC,CAAC;;EAE1B;EACA;EACA;EACA,IACCqB,qBAAqB,IACrBJ,cAAc,IACdU,WAAW,CAAEV,cAAe,CAAC,EAC5B;IACD,OAAO,IAAI;EACZ;EAEA,MAAMW,QAAQ,GAAGZ,IAAI,IAAIQ,UAAU,KAAKR,IAAI;EAE5C,MAAMa,OAAO,GAAGnC,IAAI,CAAEoB,SAAS,EAAE;IAChC,WAAW,EAAEc;EACd,CAAE,CAAC;EAEH,MAAME,WAEL,GAAKC,KAAK,IAAM;IAChB,IAAKd,cAAc,EAAG;MACrBQ,aAAa,CAAER,cAAe,CAAC;IAChC;IAEAC,OAAO,CAAEa,KAAM,CAAC;EACjB,CAAC;EACD,MAAMC,cAAc,GAAGlC,KAAK,CAAC,CAAC,GAAGF,WAAW,GAAGC,YAAY;EAC3D,MAAMoC,SAAS,GAAGpB,QAAQ,GAAGF,KAAK,GAAG;IAAE,GAAGA,KAAK;IAAEO,OAAO,EAAEgB;EAAU,CAAC;EACrE,MAAMC,SAAS,GAAGb,MAAM,GACrBC,SAAS,GACT;IACAa,EAAE,EAAErC,MAAM;IACVgB,IAAI;IACJG,OAAO,EAAEY,WAAW;IACpB,cAAc,EAAEF,QAAQ,GAAG,MAAM,GAAGM,SAAS;IAC7C,GAAGX;EACH,CAAC;EAEJ,oBACCjB,IAAA,CAACF,kBAAkB;IAAA,GAAM6B,SAAS;IAAGnB,SAAS,EAAGe,OAAS;IAAAhB,QAAA,EACvDA,QAAQ,iBACTL,KAAA,CAACP,MAAM;MAAA,GAAMkC,SAAS;MAAAtB,QAAA,GACnBO,IAAI,iBACLd,IAAA,CAACJ,UAAU;QAAAW,QAAA,eACVP,IAAA,CAACX,IAAI;UAACyB,IAAI,EAAGA;QAAM,CAAE;MAAC,CACX,CACZ,eAEDd,IAAA,CAACH,yBAAyB;QACzBgB,KAAK,EAAGA,KAAO;QACfP,KAAK,EAAGA;MAAO,CACf,CAAC,EAEAK,cAAc,iBAAIX,IAAA,CAACX,IAAI;QAACyB,IAAI,EAAGY;MAAgB,CAAE,CAAC;IAAA,CAC7C;EACR,CACkB,CAAC;AAEvB;AAEA,eAAetB,cAAc","ignoreList":[]}

package/build-module/navigation/menu/index.js

@@ -1,8 +1,7 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -21,6 +20,8 @@ import NavigationMenuTitle from './menu-title';
 import NavigationSearchNoResultsFound from './search-no-results-found';
 import { NavigableMenu } from '../../navigable-container';
 import { MenuUI } from '../styles/navigation-styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * @deprecated Use `Navigator` instead.
  */
@@ -51,34 +52,40 @@ export function NavigationMenu(props) {
 
   // Keep the children rendered to make sure invisible items are included in the navigation tree.
   if (activeMenu !== menu) {
-    return createElement(NavigationMenuContext.Provider, {
-      value: context
-    }, children);
+    return /*#__PURE__*/_jsx(NavigationMenuContext.Provider, {
+      value: context,
+      children: children
+    });
   }
   const isControlledSearch = !!setControlledSearch;
   const search = isControlledSearch ? controlledSearch : uncontrolledSearch;
   const onSearch = isControlledSearch ? setControlledSearch : setUncontrolledSearch;
   const menuTitleId = `components-navigation__menu-title-${menu}`;
-  const classes = classnames('components-navigation__menu', className);
-  return createElement(NavigationMenuContext.Provider, {
-    value: context
-  }, createElement(MenuUI, {
-    className: classes
-  }, (parentMenu || onBackButtonClick) && createElement(NavigationBackButton, {
-    backButtonLabel: backButtonLabel,
-    parentMenu: parentMenu,
-    onClick: onBackButtonClick
-  }), title && createElement(NavigationMenuTitle, {
-    hasSearch: hasSearch,
-    onSearch: onSearch,
-    search: search,
-    title: title,
-    titleAction: titleAction
-  }), createElement(NavigableMenu, null, createElement("ul", {
-    "aria-labelledby": menuTitleId
-  }, children, search && !isSearchDebouncing && createElement(NavigationSearchNoResultsFound, {
-    search: search
-  })))));
+  const classes = clsx('components-navigation__menu', className);
+  return /*#__PURE__*/_jsx(NavigationMenuContext.Provider, {
+    value: context,
+    children: /*#__PURE__*/_jsxs(MenuUI, {
+      className: classes,
+      children: [(parentMenu || onBackButtonClick) && /*#__PURE__*/_jsx(NavigationBackButton, {
+        backButtonLabel: backButtonLabel,
+        parentMenu: parentMenu,
+        onClick: onBackButtonClick
+      }), title && /*#__PURE__*/_jsx(NavigationMenuTitle, {
+        hasSearch: hasSearch,
+        onSearch: onSearch,
+        search: search,
+        title: title,
+        titleAction: titleAction
+      }), /*#__PURE__*/_jsx(NavigableMenu, {
+        children: /*#__PURE__*/_jsxs("ul", {
+          "aria-labelledby": menuTitleId,
+          children: [children, search && !isSearchDebouncing && /*#__PURE__*/_jsx(NavigationSearchNoResultsFound, {
+            search: search
+          })]
+        })
+      })]
+    })
+  });
 }
 export default NavigationMenu;
 //# sourceMappingURL=index.js.map