@wordpress/components 29.0.0 → 29.1.0

package/build-module/font-size-picker/styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["BaseControl","Button","HStack","space","COLORS","Container","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Header","HeaderToggle","HeaderLabel","VisualLabel","HeaderHint","gray"],"sources":["@wordpress/components/src/font-size-picker/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { HStack } from '../h-stack';\nimport { space } from '../utils/space';\nimport { COLORS } from '../utils';\n\nexport const Container = styled.fieldset`\n\tborder: 0;\n\tmargin: 0;\n\tpadding: 0;\n`;\n\nexport const Header = styled( HStack )`\n\theight: ${ space( 4 ) };\n`;\n\nexport const HeaderToggle = styled( Button )`\n\tmargin-top: ${ space( -1 ) };\n`;\n\nexport const HeaderLabel = styled( BaseControl.VisualLabel )`\n\tdisplay: flex;\n\tgap: ${ space( 1 ) };\n\tjustify-content: flex-start;\n\tmargin-bottom: 0;\n`;\n\nexport const HeaderHint = styled.span`\n\tcolor: ${ COLORS.gray[ 700 ] };\n`;\n"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,WAAW,MAAM,iBAAiB;AACzC,OAAOC,MAAM,MAAM,WAAW;AAC9B,SAASC,MAAM,QAAQ,YAAY;AACnC,SAASC,KAAK,QAAQ,gBAAgB;AACtC,SAASC,MAAM,QAAQ,UAAU;AAEjC,OAAO,MAAMC,SAAS,gBAAAC,OAAA,aAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAIrB;AAED,OAAO,MAAMC,MAAM,gBAAGX,OAAA,CAAQJ,MAAM,EAAAK,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,YAC1BR,KAAK,CAAE,CAAE,CAAC,SAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,o5CACrB;AAED,OAAO,MAAMS,YAAY,gBAAGZ,OAAA,CAAQL,MAAM,EAAAM,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,gBAC5BR,KAAK,CAAE,CAAC,CAAE,CAAC,SAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,o5CAC1B;AAED,OAAO,MAAMU,WAAW,gBAAGb,OAAA,CAAQN,WAAW,CAACoB,WAAW,EAAAb,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,sBAEnDR,KAAK,CAAE,CAAE,CAAC,oDAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,o5CAGlB;AAED,OAAO,MAAMY,UAAU,gBAAAf,OAAA,SAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,aACZP,MAAM,CAACkB,IAAI,CAAE,GAAG,CAAE,SAAAf,OAAA,CAAAC,GAAA,CAAAC,QAAA,o5CAC5B","ignoreList":[]}
+{"version":3,"names":["BaseControl","Button","HStack","space","COLORS","Container","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Header","HeaderToggle","HeaderLabel","VisualLabel","HeaderHint","gray"],"sources":["@wordpress/components/src/font-size-picker/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { HStack } from '../h-stack';\nimport { space } from '../utils/space';\nimport { COLORS } from '../utils';\n\nexport const Container = styled.fieldset`\n\tborder: 0;\n\tmargin: 0;\n\tpadding: 0;\n\tdisplay: contents;\n`;\n\nexport const Header = styled( HStack )`\n\theight: ${ space( 4 ) };\n`;\n\nexport const HeaderToggle = styled( Button )`\n\tmargin-top: ${ space( -1 ) };\n`;\n\nexport const HeaderLabel = styled( BaseControl.VisualLabel )`\n\tdisplay: flex;\n\tgap: ${ space( 1 ) };\n\tjustify-content: flex-start;\n\tmargin-bottom: 0;\n`;\n\nexport const HeaderHint = styled.span`\n\tcolor: ${ COLORS.gray[ 700 ] };\n`;\n"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,WAAW,MAAM,iBAAiB;AACzC,OAAOC,MAAM,MAAM,WAAW;AAC9B,SAASC,MAAM,QAAQ,YAAY;AACnC,SAASC,KAAK,QAAQ,gBAAgB;AACtC,SAASC,MAAM,QAAQ,UAAU;AAEjC,OAAO,MAAMC,SAAS,gBAAAC,OAAA,aAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAKrB;AAED,OAAO,MAAMC,MAAM,gBAAGX,OAAA,CAAQJ,MAAM,EAAAK,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,YAC1BR,KAAK,CAAE,CAAE,CAAC,SAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,o7CACrB;AAED,OAAO,MAAMS,YAAY,gBAAGZ,OAAA,CAAQL,MAAM,EAAAM,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,gBAC5BR,KAAK,CAAE,CAAC,CAAE,CAAC,SAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,o7CAC1B;AAED,OAAO,MAAMU,WAAW,gBAAGb,OAAA,CAAQN,WAAW,CAACoB,WAAW,EAAAb,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,sBAEnDR,KAAK,CAAE,CAAE,CAAC,oDAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,o7CAGlB;AAED,OAAO,MAAMY,UAAU,gBAAAf,OAAA,SAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,aACZP,MAAM,CAACkB,IAAI,CAAE,GAAG,CAAE,SAAAf,OAAA,CAAAC,GAAA,CAAAC,QAAA,o7CAC5B","ignoreList":[]}

package/build-module/heading/hook.js

@@ -10,7 +10,7 @@ export function useHeading(props) {
   const {
     as: asProp,
     level = 2,
-    color = COLORS.gray[900],
+    color = COLORS.theme.foreground,
     isBlock = true,
     weight = CONFIG.fontWeightHeading,
     ...otherProps

package/build-module/heading/hook.js.map

@@ -1 +1 @@
-{"version":3,"names":["useContextSystem","useText","getHeadingFontSize","CONFIG","COLORS","useHeading","props","as","asProp","level","color","gray","isBlock","weight","fontWeightHeading","otherProps","a11yProps","role","parseInt","textProps","size"],"sources":["@wordpress/components/src/heading/hook.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useContextSystem } from '../context';\nimport { useText } from '../text';\nimport { getHeadingFontSize } from '../utils/font-size';\nimport { CONFIG, COLORS } from '../utils';\nimport type { HeadingProps } from './types';\n\nexport function useHeading(\n\tprops: WordPressComponentProps< HeadingProps, 'h1' >\n) {\n\tconst {\n\t\tas: asProp,\n\t\tlevel = 2,\n\t\tcolor = COLORS.gray[ 900 ],\n\t\tisBlock = true,\n\t\tweight = CONFIG.fontWeightHeading as import('react').CSSProperties[ 'fontWeight' ],\n\t\t...otherProps\n\t} = useContextSystem( props, 'Heading' );\n\n\tconst as = ( asProp || `h${ level }` ) as keyof JSX.IntrinsicElements;\n\n\tconst a11yProps: {\n\t\trole?: string;\n\t\t'aria-level'?: number;\n\t} = {};\n\tif ( typeof as === 'string' && as[ 0 ] !== 'h' ) {\n\t\t// If not a semantic `h` element, add a11y props:\n\t\ta11yProps.role = 'heading';\n\t\ta11yProps[ 'aria-level' ] =\n\t\t\ttypeof level === 'string' ? parseInt( level ) : level;\n\t}\n\n\tconst textProps = useText( {\n\t\tcolor,\n\t\tisBlock,\n\t\tweight,\n\t\tsize: getHeadingFontSize( level ),\n\t\t...otherProps,\n\t} );\n\n\treturn { ...textProps, ...a11yProps, as };\n}\n"],"mappings":"AAAA;AACA;AACA;;AAEA,SAASA,gBAAgB,QAAQ,YAAY;AAC7C,SAASC,OAAO,QAAQ,SAAS;AACjC,SAASC,kBAAkB,QAAQ,oBAAoB;AACvD,SAASC,MAAM,EAAEC,MAAM,QAAQ,UAAU;AAGzC,OAAO,SAASC,UAAUA,CACzBC,KAAoD,EACnD;EACD,MAAM;IACLC,EAAE,EAAEC,MAAM;IACVC,KAAK,GAAG,CAAC;IACTC,KAAK,GAAGN,MAAM,CAACO,IAAI,CAAE,GAAG,CAAE;IAC1BC,OAAO,GAAG,IAAI;IACdC,MAAM,GAAGV,MAAM,CAACW,iBAAkE;IAClF,GAAGC;EACJ,CAAC,GAAGf,gBAAgB,CAAEM,KAAK,EAAE,SAAU,CAAC;EAExC,MAAMC,EAAE,GAAKC,MAAM,IAAI,IAAKC,KAAK,EAAoC;EAErE,MAAMO,SAGL,GAAG,CAAC,CAAC;EACN,IAAK,OAAOT,EAAE,KAAK,QAAQ,IAAIA,EAAE,CAAE,CAAC,CAAE,KAAK,GAAG,EAAG;IAChD;IACAS,SAAS,CAACC,IAAI,GAAG,SAAS;IAC1BD,SAAS,CAAE,YAAY,CAAE,GACxB,OAAOP,KAAK,KAAK,QAAQ,GAAGS,QAAQ,CAAET,KAAM,CAAC,GAAGA,KAAK;EACvD;EAEA,MAAMU,SAAS,GAAGlB,OAAO,CAAE;IAC1BS,KAAK;IACLE,OAAO;IACPC,MAAM;IACNO,IAAI,EAAElB,kBAAkB,CAAEO,KAAM,CAAC;IACjC,GAAGM;EACJ,CAAE,CAAC;EAEH,OAAO;IAAE,GAAGI,SAAS;IAAE,GAAGH,SAAS;IAAET;EAAG,CAAC;AAC1C","ignoreList":[]}
+{"version":3,"names":["useContextSystem","useText","getHeadingFontSize","CONFIG","COLORS","useHeading","props","as","asProp","level","color","theme","foreground","isBlock","weight","fontWeightHeading","otherProps","a11yProps","role","parseInt","textProps","size"],"sources":["@wordpress/components/src/heading/hook.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useContextSystem } from '../context';\nimport { useText } from '../text';\nimport { getHeadingFontSize } from '../utils/font-size';\nimport { CONFIG, COLORS } from '../utils';\nimport type { HeadingProps } from './types';\n\nexport function useHeading(\n\tprops: WordPressComponentProps< HeadingProps, 'h1' >\n) {\n\tconst {\n\t\tas: asProp,\n\t\tlevel = 2,\n\t\tcolor = COLORS.theme.foreground,\n\t\tisBlock = true,\n\t\tweight = CONFIG.fontWeightHeading as import('react').CSSProperties[ 'fontWeight' ],\n\t\t...otherProps\n\t} = useContextSystem( props, 'Heading' );\n\n\tconst as = ( asProp || `h${ level }` ) as keyof JSX.IntrinsicElements;\n\n\tconst a11yProps: {\n\t\trole?: string;\n\t\t'aria-level'?: number;\n\t} = {};\n\tif ( typeof as === 'string' && as[ 0 ] !== 'h' ) {\n\t\t// If not a semantic `h` element, add a11y props:\n\t\ta11yProps.role = 'heading';\n\t\ta11yProps[ 'aria-level' ] =\n\t\t\ttypeof level === 'string' ? parseInt( level ) : level;\n\t}\n\n\tconst textProps = useText( {\n\t\tcolor,\n\t\tisBlock,\n\t\tweight,\n\t\tsize: getHeadingFontSize( level ),\n\t\t...otherProps,\n\t} );\n\n\treturn { ...textProps, ...a11yProps, as };\n}\n"],"mappings":"AAAA;AACA;AACA;;AAEA,SAASA,gBAAgB,QAAQ,YAAY;AAC7C,SAASC,OAAO,QAAQ,SAAS;AACjC,SAASC,kBAAkB,QAAQ,oBAAoB;AACvD,SAASC,MAAM,EAAEC,MAAM,QAAQ,UAAU;AAGzC,OAAO,SAASC,UAAUA,CACzBC,KAAoD,EACnD;EACD,MAAM;IACLC,EAAE,EAAEC,MAAM;IACVC,KAAK,GAAG,CAAC;IACTC,KAAK,GAAGN,MAAM,CAACO,KAAK,CAACC,UAAU;IAC/BC,OAAO,GAAG,IAAI;IACdC,MAAM,GAAGX,MAAM,CAACY,iBAAkE;IAClF,GAAGC;EACJ,CAAC,GAAGhB,gBAAgB,CAAEM,KAAK,EAAE,SAAU,CAAC;EAExC,MAAMC,EAAE,GAAKC,MAAM,IAAI,IAAKC,KAAK,EAAoC;EAErE,MAAMQ,SAGL,GAAG,CAAC,CAAC;EACN,IAAK,OAAOV,EAAE,KAAK,QAAQ,IAAIA,EAAE,CAAE,CAAC,CAAE,KAAK,GAAG,EAAG;IAChD;IACAU,SAAS,CAACC,IAAI,GAAG,SAAS;IAC1BD,SAAS,CAAE,YAAY,CAAE,GACxB,OAAOR,KAAK,KAAK,QAAQ,GAAGU,QAAQ,CAAEV,KAAM,CAAC,GAAGA,KAAK;EACvD;EAEA,MAAMW,SAAS,GAAGnB,OAAO,CAAE;IAC1BS,KAAK;IACLG,OAAO;IACPC,MAAM;IACNO,IAAI,EAAEnB,kBAAkB,CAAEO,KAAM,CAAC;IACjC,GAAGO;EACJ,CAAE,CAAC;EAEH,OAAO;IAAE,GAAGI,SAAS;IAAE,GAAGH,SAAS;IAAEV;EAAG,CAAC;AAC1C","ignoreList":[]}

package/build-module/input-control/index.js

@@ -17,6 +17,7 @@ import { space } from '../utils/space';
 import { useDraft } from './utils';
 import BaseControl from '../base-control';
 import { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';
+import { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';
 import { jsx as _jsx } from "react/jsx-runtime";
 const noop = () => {};
 function useUniqueId(idProp) {
@@ -27,6 +28,7 @@ function useUniqueId(idProp) {
 export function UnforwardedInputControl(props, ref) {
   const {
     __next40pxDefaultSize,
+    __shouldNotWarnDeprecated36pxSize,
     __unstableStateReducer: stateReducer = state => state,
     __unstableInputWidth,
     className,
@@ -57,6 +59,12 @@ export function UnforwardedInputControl(props, ref) {
   const helpProp = !!help ? {
     'aria-describedby': `${id}__help`
   } : {};
+  maybeWarnDeprecated36pxSize({
+    componentName: 'InputControl',
+    __next40pxDefaultSize,
+    size,
+    __shouldNotWarnDeprecated36pxSize
+  });
   return /*#__PURE__*/_jsx(BaseControl, {
     className: classes,
     help: help,
@@ -110,6 +118,7 @@ export function UnforwardedInputControl(props, ref) {
  *
  *   return (
  *  	<InputControl
+ * 			__next40pxDefaultSize
  *  		value={ value }
  *  		onChange={ ( nextValue ) => setValue( nextValue ?? '' ) }
  *  	/>

package/build-module/input-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","useInstanceId","forwardRef","InputBase","InputField","space","useDraft","BaseControl","useDeprecated36pxDefaultSizeProp","jsx","_jsx","noop","useUniqueId","idProp","instanceId","InputControl","id","UnforwardedInputControl","props","ref","__next40pxDefaultSize","__unstableStateReducer","stateReducer","state","__unstableInputWidth","className","disabled","help","hideLabelFromVision","isPressEnterToChange","label","labelPosition","onChange","onValidate","onKeyDown","prefix","size","style","suffix","value","restProps","classes","draftHookProps","onBlur","helpProp","__nextHasNoMarginBottom","children","gap","justify","paddingInlineStart","undefined","paddingInlineEnd"],"sources":["@wordpress/components/src/input-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport InputBase from './input-base';\nimport InputField from './input-field';\nimport type { InputControlProps } from './types';\nimport { space } from '../utils/space';\nimport { useDraft } from './utils';\nimport BaseControl from '../base-control';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\n\nconst noop = () => {};\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( InputControl );\n\tconst id = `inspector-input-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\nexport function UnforwardedInputControl(\n\tprops: InputControlProps,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\t__unstableInputWidth,\n\t\tclassName,\n\t\tdisabled = false,\n\t\thelp,\n\t\thideLabelFromVision = false,\n\t\tid: idProp,\n\t\tisPressEnterToChange = false,\n\t\tlabel,\n\t\tlabelPosition = 'top',\n\t\tonChange = noop,\n\t\tonValidate = noop,\n\t\tonKeyDown = noop,\n\t\tprefix,\n\t\tsize = 'default',\n\t\tstyle,\n\t\tsuffix,\n\t\tvalue,\n\t\t...restProps\n\t} = useDeprecated36pxDefaultSizeProp< InputControlProps >( props );\n\n\tconst id = useUniqueId( idProp );\n\tconst classes = clsx( 'components-input-control', className );\n\n\tconst draftHookProps = useDraft( {\n\t\tvalue,\n\t\tonBlur: restProps.onBlur,\n\t\tonChange,\n\t} );\n\n\tconst helpProp = !! help ? { 'aria-describedby': `${ id }__help` } : {};\n\n\treturn (\n\t\t<BaseControl\n\t\t\tclassName={ classes }\n\t\t\thelp={ help }\n\t\t\tid={ id }\n\t\t\t__nextHasNoMarginBottom\n\t\t>\n\t\t\t<InputBase\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tgap={ 3 }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tid={ id }\n\t\t\t\tjustify=\"left\"\n\t\t\t\tlabel={ label }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t\tprefix={ prefix }\n\t\t\t\tsize={ size }\n\t\t\t\tstyle={ style }\n\t\t\t\tsuffix={ suffix }\n\t\t\t>\n\t\t\t\t<InputField\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t\t{ ...helpProp }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\tclassName=\"components-input-control__input\"\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tid={ id }\n\t\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t\tonValidate={ onValidate }\n\t\t\t\t\tpaddingInlineStart={ prefix ? space( 1 ) : undefined }\n\t\t\t\t\tpaddingInlineEnd={ suffix ? space( 1 ) : undefined }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tsize={ size }\n\t\t\t\t\tstateReducer={ stateReducer }\n\t\t\t\t\t{ ...draftHookProps }\n\t\t\t\t/>\n\t\t\t</InputBase>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * InputControl components let users enter and edit text. This is an experimental component\n * intended to (in time) merge with or replace `TextControl`.\n *\n * ```jsx\n * import { __experimentalInputControl as InputControl } from '@wordpress/components';\n * import { useState } from 'react';\n *\n * const Example = () => {\n *   const [ value, setValue ] = useState( '' );\n *\n *   return (\n *  \t<InputControl\n *  \t\tvalue={ value }\n *  \t\tonChange={ ( nextValue ) => setValue( nextValue ?? '' ) }\n *  \t/>\n *   );\n * };\n * ```\n */\nexport const InputControl = forwardRef( UnforwardedInputControl );\n\nexport default InputControl;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","useInstanceId","forwardRef","InputBase","InputField","space","useDraft","BaseControl","useDeprecated36pxDefaultSizeProp","maybeWarnDeprecated36pxSize","jsx","_jsx","noop","useUniqueId","idProp","instanceId","InputControl","id","UnforwardedInputControl","props","ref","__next40pxDefaultSize","__shouldNotWarnDeprecated36pxSize","__unstableStateReducer","stateReducer","state","__unstableInputWidth","className","disabled","help","hideLabelFromVision","isPressEnterToChange","label","labelPosition","onChange","onValidate","onKeyDown","prefix","size","style","suffix","value","restProps","classes","draftHookProps","onBlur","helpProp","componentName","__nextHasNoMarginBottom","children","gap","justify","paddingInlineStart","undefined","paddingInlineEnd"],"sources":["@wordpress/components/src/input-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport InputBase from './input-base';\nimport InputField from './input-field';\nimport type { InputControlProps } from './types';\nimport { space } from '../utils/space';\nimport { useDraft } from './utils';\nimport BaseControl from '../base-control';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport { maybeWarnDeprecated36pxSize } from '../utils/deprecated-36px-size';\n\nconst noop = () => {};\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( InputControl );\n\tconst id = `inspector-input-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\nexport function UnforwardedInputControl(\n\tprops: InputControlProps,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t\t__unstableStateReducer: stateReducer = ( state ) => state,\n\t\t__unstableInputWidth,\n\t\tclassName,\n\t\tdisabled = false,\n\t\thelp,\n\t\thideLabelFromVision = false,\n\t\tid: idProp,\n\t\tisPressEnterToChange = false,\n\t\tlabel,\n\t\tlabelPosition = 'top',\n\t\tonChange = noop,\n\t\tonValidate = noop,\n\t\tonKeyDown = noop,\n\t\tprefix,\n\t\tsize = 'default',\n\t\tstyle,\n\t\tsuffix,\n\t\tvalue,\n\t\t...restProps\n\t} = useDeprecated36pxDefaultSizeProp< InputControlProps >( props );\n\n\tconst id = useUniqueId( idProp );\n\tconst classes = clsx( 'components-input-control', className );\n\n\tconst draftHookProps = useDraft( {\n\t\tvalue,\n\t\tonBlur: restProps.onBlur,\n\t\tonChange,\n\t} );\n\n\tconst helpProp = !! help ? { 'aria-describedby': `${ id }__help` } : {};\n\n\tmaybeWarnDeprecated36pxSize( {\n\t\tcomponentName: 'InputControl',\n\t\t__next40pxDefaultSize,\n\t\tsize,\n\t\t__shouldNotWarnDeprecated36pxSize,\n\t} );\n\n\treturn (\n\t\t<BaseControl\n\t\t\tclassName={ classes }\n\t\t\thelp={ help }\n\t\t\tid={ id }\n\t\t\t__nextHasNoMarginBottom\n\t\t>\n\t\t\t<InputBase\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tgap={ 3 }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tid={ id }\n\t\t\t\tjustify=\"left\"\n\t\t\t\tlabel={ label }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t\tprefix={ prefix }\n\t\t\t\tsize={ size }\n\t\t\t\tstyle={ style }\n\t\t\t\tsuffix={ suffix }\n\t\t\t>\n\t\t\t\t<InputField\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t\t{ ...helpProp }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\tclassName=\"components-input-control__input\"\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tid={ id }\n\t\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t\tonValidate={ onValidate }\n\t\t\t\t\tpaddingInlineStart={ prefix ? space( 1 ) : undefined }\n\t\t\t\t\tpaddingInlineEnd={ suffix ? space( 1 ) : undefined }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tsize={ size }\n\t\t\t\t\tstateReducer={ stateReducer }\n\t\t\t\t\t{ ...draftHookProps }\n\t\t\t\t/>\n\t\t\t</InputBase>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * InputControl components let users enter and edit text. This is an experimental component\n * intended to (in time) merge with or replace `TextControl`.\n *\n * ```jsx\n * import { __experimentalInputControl as InputControl } from '@wordpress/components';\n * import { useState } from 'react';\n *\n * const Example = () => {\n *   const [ value, setValue ] = useState( '' );\n *\n *   return (\n *  \t<InputControl\n * \t\t\t__next40pxDefaultSize\n *  \t\tvalue={ value }\n *  \t\tonChange={ ( nextValue ) => setValue( nextValue ?? '' ) }\n *  \t/>\n *   );\n * };\n * ```\n */\nexport const InputControl = forwardRef( UnforwardedInputControl );\n\nexport default InputControl;\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;AAGvB;AACA;AACA;AACA,SAASC,aAAa,QAAQ,oBAAoB;AAClD,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,OAAOC,SAAS,MAAM,cAAc;AACpC,OAAOC,UAAU,MAAM,eAAe;AAEtC,SAASC,KAAK,QAAQ,gBAAgB;AACtC,SAASC,QAAQ,QAAQ,SAAS;AAClC,OAAOC,WAAW,MAAM,iBAAiB;AACzC,SAASC,gCAAgC,QAAQ,+BAA+B;AAChF,SAASC,2BAA2B,QAAQ,+BAA+B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE5E,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,WAAWA,CAAEC,MAAe,EAAG;EACvC,MAAMC,UAAU,GAAGd,aAAa,CAAEe,YAAa,CAAC;EAChD,MAAMC,EAAE,GAAG,2BAA4BF,UAAU,EAAG;EAEpD,OAAOD,MAAM,IAAIG,EAAE;AACpB;AAEA,OAAO,SAASC,uBAAuBA,CACtCC,KAAwB,EACxBC,GAAqC,EACpC;EACD,MAAM;IACLC,qBAAqB;IACrBC,iCAAiC;IACjCC,sBAAsB,EAAEC,YAAY,GAAKC,KAAK,IAAMA,KAAK;IACzDC,oBAAoB;IACpBC,SAAS;IACTC,QAAQ,GAAG,KAAK;IAChBC,IAAI;IACJC,mBAAmB,GAAG,KAAK;IAC3Bb,EAAE,EAAEH,MAAM;IACViB,oBAAoB,GAAG,KAAK;IAC5BC,KAAK;IACLC,aAAa,GAAG,KAAK;IACrBC,QAAQ,GAAGtB,IAAI;IACfuB,UAAU,GAAGvB,IAAI;IACjBwB,SAAS,GAAGxB,IAAI;IAChByB,MAAM;IACNC,IAAI,GAAG,SAAS;IAChBC,KAAK;IACLC,MAAM;IACNC,KAAK;IACL,GAAGC;EACJ,CAAC,GAAGlC,gCAAgC,CAAuBW,KAAM,CAAC;EAElE,MAAMF,EAAE,GAAGJ,WAAW,CAAEC,MAAO,CAAC;EAChC,MAAM6B,OAAO,GAAG3C,IAAI,CAAE,0BAA0B,EAAE2B,SAAU,CAAC;EAE7D,MAAMiB,cAAc,GAAGtC,QAAQ,CAAE;IAChCmC,KAAK;IACLI,MAAM,EAAEH,SAAS,CAACG,MAAM;IACxBX;EACD,CAAE,CAAC;EAEH,MAAMY,QAAQ,GAAG,CAAC,CAAEjB,IAAI,GAAG;IAAE,kBAAkB,EAAE,GAAIZ,EAAE;EAAU,CAAC,GAAG,CAAC,CAAC;EAEvER,2BAA2B,CAAE;IAC5BsC,aAAa,EAAE,cAAc;IAC7B1B,qBAAqB;IACrBiB,IAAI;IACJhB;EACD,CAAE,CAAC;EAEH,oBACCX,IAAA,CAACJ,WAAW;IACXoB,SAAS,EAAGgB,OAAS;IACrBd,IAAI,EAAGA,IAAM;IACbZ,EAAE,EAAGA,EAAI;IACT+B,uBAAuB;IAAAC,QAAA,eAEvBtC,IAAA,CAACR,SAAS;MACTkB,qBAAqB,EAAGA,qBAAuB;MAC/CK,oBAAoB,EAAGA,oBAAsB;MAC7CE,QAAQ,EAAGA,QAAU;MACrBsB,GAAG,EAAG,CAAG;MACTpB,mBAAmB,EAAGA,mBAAqB;MAC3Cb,EAAE,EAAGA,EAAI;MACTkC,OAAO,EAAC,MAAM;MACdnB,KAAK,EAAGA,KAAO;MACfC,aAAa,EAAGA,aAAe;MAC/BI,MAAM,EAAGA,MAAQ;MACjBC,IAAI,EAAGA,IAAM;MACbC,KAAK,EAAGA,KAAO;MACfC,MAAM,EAAGA,MAAQ;MAAAS,QAAA,eAEjBtC,IAAA,CAACP,UAAU;QAAA,GACLsC,SAAS;QAAA,GACTI,QAAQ;QACbzB,qBAAqB,EAAGA,qBAAuB;QAC/CM,SAAS,EAAC,iCAAiC;QAC3CC,QAAQ,EAAGA,QAAU;QACrBX,EAAE,EAAGA,EAAI;QACTc,oBAAoB,EAAGA,oBAAsB;QAC7CK,SAAS,EAAGA,SAAW;QACvBD,UAAU,EAAGA,UAAY;QACzBiB,kBAAkB,EAAGf,MAAM,GAAGhC,KAAK,CAAE,CAAE,CAAC,GAAGgD,SAAW;QACtDC,gBAAgB,EAAGd,MAAM,GAAGnC,KAAK,CAAE,CAAE,CAAC,GAAGgD,SAAW;QACpDjC,GAAG,EAAGA,GAAK;QACXkB,IAAI,EAAGA,IAAM;QACbd,YAAY,EAAGA,YAAc;QAAA,GACxBoB;MAAc,CACnB;IAAC,CACQ;EAAC,CACA,CAAC;AAEhB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAM5B,YAAY,GAAGd,UAAU,CAAEgB,uBAAwB,CAAC;AAEjE,eAAeF,YAAY","ignoreList":[]}

package/build-module/input-control/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/input-control/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tCSSProperties,\n\tReactNode,\n\tSyntheticEvent,\n\tHTMLInputTypeAttribute,\n} from 'react';\nimport type { useDrag } from '@use-gesture/react';\n\n/**\n * Internal dependencies\n */\nimport type { StateReducer } from './reducer/state';\nimport type { WordPressComponentProps } from '../context';\nimport type { FlexProps } from '../flex/types';\nimport type { BaseControlProps } from '../base-control/types';\n\nexport type LabelPosition = 'top' | 'bottom' | 'side' | 'edge';\n\nexport type DragDirection = 'n' | 's' | 'e' | 'w';\n\nexport type DragProps = Parameters< Parameters< typeof useDrag >[ 0 ] >[ 0 ];\n\nexport type Size = 'default' | 'small' | 'compact' | '__unstable-large';\n\ninterface BaseProps {\n\t/**\n\t * Deprecated. Use `__next40pxDefaultSize` instead.\n\t *\n\t * @default false\n\t * @deprecated\n\t * @ignore\n\t */\n\t__next36pxDefaultSize?: boolean;\n\t/**\n\t * Start opting into the larger default height that will become the default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n\t__unstableInputWidth?: CSSProperties[ 'width' ];\n\t/**\n\t * If true, the label will only be visible to screen readers.\n\t *\n\t * @default false\n\t */\n\thideLabelFromVision?: boolean;\n\t/**\n\t * The position of the label.\n\t *\n\t * @default 'top'\n\t */\n\tlabelPosition?: LabelPosition;\n\t/**\n\t * Adjusts the size of the input.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: Size;\n}\n\nexport type InputChangeCallback< P = {} > = (\n\tnextValue: string | undefined,\n\textra: { event: SyntheticEvent } & P\n) => void;\n\nexport interface InputFieldProps\n\textends Omit< BaseProps, '__next36pxDefaultSize' > {\n\t/**\n\t * Determines the drag axis.\n\t *\n\t * @default 'n'\n\t */\n\tdragDirection?: DragDirection;\n\t/**\n\t * If `isDragEnabled` is true, this controls the amount of `px` to have been dragged before\n\t * the drag gesture is actually triggered.\n\t *\n\t * @default 10\n\t */\n\tdragThreshold?: number;\n\t/**\n\t * If true, enables mouse drag gestures.\n\t *\n\t * @default false\n\t */\n\tisDragEnabled?: boolean;\n\t/**\n\t * If true, the `ENTER` key press is required in order to trigger an `onChange`.\n\t * If enabled, a change is also triggered when tabbing away (`onBlur`).\n\t *\n\t * @default false\n\t */\n\tisPressEnterToChange?: boolean;\n\t/**\n\t * A function that receives the value of the input.\n\t */\n\tonChange?: InputChangeCallback;\n\tonValidate?: (\n\t\tnextValue: string,\n\t\tevent?: SyntheticEvent< HTMLInputElement >\n\t) => void;\n\tpaddingInlineStart?: CSSProperties[ 'paddingInlineStart' ];\n\tpaddingInlineEnd?: CSSProperties[ 'paddingInlineEnd' ];\n\tstateReducer?: StateReducer;\n\t/**\n\t * The current value of the input.\n\t */\n\tvalue?: string;\n\tonDragEnd?: ( dragProps: DragProps ) => void;\n\tonDragStart?: ( dragProps: DragProps ) => void;\n\tonDrag?: ( dragProps: DragProps ) => void;\n\t/**\n\t * Type of the input element to render.\n\t *\n\t * @default 'text'\n\t */\n\ttype?: HTMLInputTypeAttribute;\n}\n\nexport interface InputBaseProps extends BaseProps, FlexProps {\n\tchildren: ReactNode;\n\t/**\n\t * Renders an element on the left side of the input.\n\t *\n\t * By default, the prefix is aligned with the edge of the input border, with no padding.\n\t * If you want to apply standard padding in accordance with the size variant, wrap the element in\n\t * the provided `<InputControlPrefixWrapper>` component.\n\t *\n\t * @example\n\t * import {\n\t *   __experimentalInputControl as InputControl,\n\t *   __experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,\n\t * } from '@wordpress/components';\n\t *\n\t * <InputControl\n\t *   prefix={<InputControlPrefixWrapper>@</InputControlPrefixWrapper>}\n\t * />\n\t */\n\tprefix?: ReactNode;\n\t/**\n\t * Renders an element on the right side of the input.\n\t *\n\t * By default, the suffix is aligned with the edge of the input border, with no padding.\n\t * If you want to apply standard padding in accordance with the size variant, wrap the element in\n\t * the provided `<InputControlSuffixWrapper>` component.\n\t *\n\t * @example\n\t * import {\n\t *   __experimentalInputControl as InputControl,\n\t *   __experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,\n\t * } from '@wordpress/components';\n\t *\n\t * <InputControl\n\t *   suffix={<InputControlSuffixWrapper>%</InputControlSuffixWrapper>}\n\t * />\n\t */\n\tsuffix?: ReactNode;\n\t/**\n\t * If true, the `input` will be disabled.\n\t *\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * If this property is added, a label will be generated using label property as the content.\n\t */\n\tlabel?: ReactNode;\n\t/**\n\t * Whether to hide the border when not focused.\n\t *\n\t * @default false\n\t */\n\tisBorderless?: boolean;\n}\n\nexport interface InputControlProps\n\textends Omit<\n\t\t\tInputBaseProps,\n\t\t\t'children' | 'isBorderless' | keyof FlexProps\n\t\t>,\n\t\tPick< BaseControlProps, 'help' >,\n\t\t/**\n\t\t * The `prefix` prop in `WordPressComponentProps< InputFieldProps, 'input', false >` comes from the\n\t\t * `HTMLInputAttributes` and clashes with the one from `InputBaseProps`. So we have to omit it from\n\t\t * `WordPressComponentProps< InputFieldProps, 'input', false >` in order that `InputBaseProps[ 'prefix' ]`\n\t\t * be the only prefix prop. Otherwise it tries to do a union of the two prefix properties and you end up\n\t\t * with an unresolvable type.\n\t\t *\n\t\t * `paddingInlineStart`, and `paddingInlineEnd` are managed internally by\n\t\t * the InputControl, but the rest of the props for InputField are passed through.\n\t\t */\n\t\tOmit<\n\t\t\tWordPressComponentProps< InputFieldProps, 'input', false >,\n\t\t\t| 'stateReducer'\n\t\t\t| 'prefix'\n\t\t\t| 'paddingInlineStart'\n\t\t\t| 'paddingInlineEnd'\n\t\t> {\n\t__unstableStateReducer?: InputFieldProps[ 'stateReducer' ];\n}\n\nexport interface InputControlLabelProps {\n\tchildren: ReactNode;\n\thideLabelFromVision?: BaseProps[ 'hideLabelFromVision' ];\n\tlabelPosition?: BaseProps[ 'labelPosition' ];\n\tsize?: BaseProps[ 'size' ];\n}\n\nexport type PrefixSuffixWrapperProps = {\n\t/**\n\t * The content to be inserted.\n\t */\n\tchildren: ReactNode;\n\t/**\n\t * Internal prop used to control the padding size of the wrapper.\n\t *\n\t * @ignore\n\t */\n\tsize?: BaseProps[ 'size' ];\n\t/**\n\t * Internal prop used to control the padding size of the wrapper.\n\t *\n\t * @ignore\n\t */\n\t__next40pxDefaultSize?: BaseProps[ '__next40pxDefaultSize' ];\n\t/**\n\t * Adjust the wrapper based on the prefix or suffix content.\n\t *\n\t * - `'default'`: Standard padding for text content.\n\t * - `'icon'`: For icons.\n\t * - `'control'`: For controls, like buttons or selects.\n\t *\n\t * @default 'default'\n\t */\n\tvariant?: 'default' | 'icon' | 'control';\n};\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/input-control/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tCSSProperties,\n\tReactNode,\n\tSyntheticEvent,\n\tHTMLInputTypeAttribute,\n} from 'react';\nimport type { useDrag } from '@use-gesture/react';\n\n/**\n * Internal dependencies\n */\nimport type { StateReducer } from './reducer/state';\nimport type { WordPressComponentProps } from '../context';\nimport type { FlexProps } from '../flex/types';\nimport type { BaseControlProps } from '../base-control/types';\n\nexport type LabelPosition = 'top' | 'bottom' | 'side' | 'edge';\n\nexport type DragDirection = 'n' | 's' | 'e' | 'w';\n\nexport type DragProps = Parameters< Parameters< typeof useDrag >[ 0 ] >[ 0 ];\n\nexport type Size = 'default' | 'small' | 'compact' | '__unstable-large';\n\ninterface BaseProps {\n\t/**\n\t * Deprecated. Use `__next40pxDefaultSize` instead.\n\t *\n\t * @default false\n\t * @deprecated\n\t * @ignore\n\t */\n\t__next36pxDefaultSize?: boolean;\n\t/**\n\t * Start opting into the larger default height that will become the default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n\t/**\n\t * Do not throw a warning for the deprecated 36px default size.\n\t * For internal components of other components that already throw the warning.\n\t *\n\t * @ignore\n\t */\n\t__shouldNotWarnDeprecated36pxSize?: boolean;\n\t__unstableInputWidth?: CSSProperties[ 'width' ];\n\t/**\n\t * If true, the label will only be visible to screen readers.\n\t *\n\t * @default false\n\t */\n\thideLabelFromVision?: boolean;\n\t/**\n\t * The position of the label.\n\t *\n\t * @default 'top'\n\t */\n\tlabelPosition?: LabelPosition;\n\t/**\n\t * Adjusts the size of the input.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: Size;\n}\n\nexport type InputChangeCallback< P = {} > = (\n\tnextValue: string | undefined,\n\textra: { event: SyntheticEvent } & P\n) => void;\n\nexport interface InputFieldProps\n\textends Omit< BaseProps, '__next36pxDefaultSize' > {\n\t/**\n\t * Determines the drag axis.\n\t *\n\t * @default 'n'\n\t */\n\tdragDirection?: DragDirection;\n\t/**\n\t * If `isDragEnabled` is true, this controls the amount of `px` to have been dragged before\n\t * the drag gesture is actually triggered.\n\t *\n\t * @default 10\n\t */\n\tdragThreshold?: number;\n\t/**\n\t * If true, enables mouse drag gestures.\n\t *\n\t * @default false\n\t */\n\tisDragEnabled?: boolean;\n\t/**\n\t * If true, the `ENTER` key press is required in order to trigger an `onChange`.\n\t * If enabled, a change is also triggered when tabbing away (`onBlur`).\n\t *\n\t * @default false\n\t */\n\tisPressEnterToChange?: boolean;\n\t/**\n\t * A function that receives the value of the input.\n\t */\n\tonChange?: InputChangeCallback;\n\tonValidate?: (\n\t\tnextValue: string,\n\t\tevent?: SyntheticEvent< HTMLInputElement >\n\t) => void;\n\tpaddingInlineStart?: CSSProperties[ 'paddingInlineStart' ];\n\tpaddingInlineEnd?: CSSProperties[ 'paddingInlineEnd' ];\n\tstateReducer?: StateReducer;\n\t/**\n\t * The current value of the input.\n\t */\n\tvalue?: string;\n\tonDragEnd?: ( dragProps: DragProps ) => void;\n\tonDragStart?: ( dragProps: DragProps ) => void;\n\tonDrag?: ( dragProps: DragProps ) => void;\n\t/**\n\t * Type of the input element to render.\n\t *\n\t * @default 'text'\n\t */\n\ttype?: HTMLInputTypeAttribute;\n}\n\nexport interface InputBaseProps extends BaseProps, FlexProps {\n\tchildren: ReactNode;\n\t/**\n\t * Renders an element on the left side of the input.\n\t *\n\t * By default, the prefix is aligned with the edge of the input border, with no padding.\n\t * If you want to apply standard padding in accordance with the size variant, wrap the element in\n\t * the provided `<InputControlPrefixWrapper>` component.\n\t *\n\t * ```jsx\n\t * import {\n\t *   __experimentalInputControl as InputControl,\n\t *   __experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,\n\t * } from '@wordpress/components';\n\t *\n\t * <InputControl\n\t *   prefix={<InputControlPrefixWrapper>@</InputControlPrefixWrapper>}\n\t * />\n\t * ```\n\t */\n\tprefix?: ReactNode;\n\t/**\n\t * Renders an element on the right side of the input.\n\t *\n\t * By default, the suffix is aligned with the edge of the input border, with no padding.\n\t * If you want to apply standard padding in accordance with the size variant, wrap the element in\n\t * the provided `<InputControlSuffixWrapper>` component.\n\t *\n\t * ```jsx\n\t * import {\n\t *   __experimentalInputControl as InputControl,\n\t *   __experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,\n\t * } from '@wordpress/components';\n\t *\n\t * <InputControl\n\t *   suffix={<InputControlSuffixWrapper>%</InputControlSuffixWrapper>}\n\t * />\n\t * ```\n\t */\n\tsuffix?: ReactNode;\n\t/**\n\t * If true, the `input` will be disabled.\n\t *\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * If this property is added, a label will be generated using label property as the content.\n\t */\n\tlabel?: ReactNode;\n\t/**\n\t * Whether to hide the border when not focused.\n\t *\n\t * @default false\n\t */\n\tisBorderless?: boolean;\n}\n\nexport interface InputControlProps\n\textends Omit<\n\t\t\tInputBaseProps,\n\t\t\t'children' | 'isBorderless' | keyof FlexProps\n\t\t>,\n\t\tPick< BaseControlProps, 'help' >,\n\t\t/**\n\t\t * The `prefix` prop in `WordPressComponentProps< InputFieldProps, 'input', false >` comes from the\n\t\t * `HTMLInputAttributes` and clashes with the one from `InputBaseProps`. So we have to omit it from\n\t\t * `WordPressComponentProps< InputFieldProps, 'input', false >` in order that `InputBaseProps[ 'prefix' ]`\n\t\t * be the only prefix prop. Otherwise it tries to do a union of the two prefix properties and you end up\n\t\t * with an unresolvable type.\n\t\t *\n\t\t * `paddingInlineStart`, and `paddingInlineEnd` are managed internally by\n\t\t * the InputControl, but the rest of the props for InputField are passed through.\n\t\t */\n\t\tOmit<\n\t\t\tWordPressComponentProps< InputFieldProps, 'input', false >,\n\t\t\t| 'stateReducer'\n\t\t\t| 'prefix'\n\t\t\t| 'paddingInlineStart'\n\t\t\t| 'paddingInlineEnd'\n\t\t> {\n\t__unstableStateReducer?: InputFieldProps[ 'stateReducer' ];\n}\n\nexport interface InputControlLabelProps {\n\tchildren: ReactNode;\n\thideLabelFromVision?: BaseProps[ 'hideLabelFromVision' ];\n\tlabelPosition?: BaseProps[ 'labelPosition' ];\n\tsize?: BaseProps[ 'size' ];\n}\n\nexport type PrefixSuffixWrapperProps = {\n\t/**\n\t * The content to be inserted.\n\t */\n\tchildren: ReactNode;\n\t/**\n\t * Internal prop used to control the padding size of the wrapper.\n\t *\n\t * @ignore\n\t */\n\tsize?: BaseProps[ 'size' ];\n\t/**\n\t * Internal prop used to control the padding size of the wrapper.\n\t *\n\t * @ignore\n\t */\n\t__next40pxDefaultSize?: BaseProps[ '__next40pxDefaultSize' ];\n\t/**\n\t * Adjust the wrapper based on the prefix or suffix content.\n\t *\n\t * - `'default'`: Standard padding for text content.\n\t * - `'icon'`: For icons.\n\t * - `'control'`: For controls, like buttons or selects.\n\t *\n\t * @default 'default'\n\t */\n\tvariant?: 'default' | 'icon' | 'control';\n};\n"],"mappings":"","ignoreList":[]}

package/build-module/menu/checkbox-item.js

@@ -19,6 +19,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const MenuCheckboxItem = forwardRef(function MenuCheckboxItem({
   suffix,
   children,
+  disabled = false,
   hideOnClick = false,
   ...props
 }, ref) {
@@ -30,6 +31,7 @@ export const MenuCheckboxItem = forwardRef(function MenuCheckboxItem({
     ref: ref,
     ...props,
     accessibleWhenDisabled: true,
+    disabled: disabled,
     hideOnClick: hideOnClick,
     store: menuContext.store,
     children: [/*#__PURE__*/_jsx(Ariakit.MenuItemCheck, {

package/build-module/menu/checkbox-item.js.map

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","forwardRef","useContext","Icon","check","MenuContext","Styled","jsx","_jsx","jsxs","_jsxs","MenuCheckboxItem","suffix","children","hideOnClick","props","ref","menuContext","store","Error","accessibleWhenDisabled","MenuItemCheck","render","ItemPrefixWrapper","style","width","height","icon","size","MenuItemContentWrapper","MenuItemChildrenWrapper","ItemSuffixWrapper"],"sources":["@wordpress/components/src/menu/checkbox-item.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useContext } from '@wordpress/element';\nimport { Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { MenuContext } from './context';\nimport type { MenuCheckboxItemProps } from './types';\nimport * as Styled from './styles';\n\nexport const MenuCheckboxItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< MenuCheckboxItemProps, 'div', false >\n>( function MenuCheckboxItem(\n\t{ suffix, children, hideOnClick = false, ...props },\n\tref\n) {\n\tconst menuContext = useContext( MenuContext );\n\n\tif ( ! menuContext?.store ) {\n\t\tthrow new Error(\n\t\t\t'Menu.CheckboxItem can only be rendered inside a Menu component'\n\t\t);\n\t}\n\n\treturn (\n\t\t<Styled.MenuCheckboxItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ menuContext.store }\n\t\t>\n\t\t\t<Ariakit.MenuItemCheck\n\t\t\t\tstore={ menuContext.store }\n\t\t\t\trender={ <Styled.ItemPrefixWrapper /> }\n\t\t\t\t// Override some ariakit inline styles\n\t\t\t\tstyle={ { width: 'auto', height: 'auto' } }\n\t\t\t>\n\t\t\t\t<Icon icon={ check } size={ 24 } />\n\t\t\t</Ariakit.MenuItemCheck>\n\n\t\t\t<Styled.MenuItemContentWrapper>\n\t\t\t\t<Styled.MenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.MenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.MenuItemContentWrapper>\n\t\t</Styled.MenuCheckboxItem>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,SAASC,UAAU,EAAEC,UAAU,QAAQ,oBAAoB;AAC3D,SAASC,IAAI,EAAEC,KAAK,QAAQ,kBAAkB;;AAE9C;AACA;AACA;;AAEA,SAASC,WAAW,QAAQ,WAAW;AAEvC,OAAO,KAAKC,MAAM,MAAM,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEnC,OAAO,MAAMC,gBAAgB,GAAGV,UAAU,CAGvC,SAASU,gBAAgBA,CAC3B;EAAEC,MAAM;EAAEC,QAAQ;EAAEC,WAAW,GAAG,KAAK;EAAE,GAAGC;AAAM,CAAC,EACnDC,GAAG,EACF;EACD,MAAMC,WAAW,GAAGf,UAAU,CAAEG,WAAY,CAAC;EAE7C,IAAK,CAAEY,WAAW,EAAEC,KAAK,EAAG;IAC3B,MAAM,IAAIC,KAAK,CACd,gEACD,CAAC;EACF;EAEA,oBACCT,KAAA,CAACJ,MAAM,CAACK,gBAAgB;IACvBK,GAAG,EAAGA,GAAK;IAAA,GACND,KAAK;IACVK,sBAAsB;IACtBN,WAAW,EAAGA,WAAa;IAC3BI,KAAK,EAAGD,WAAW,CAACC,KAAO;IAAAL,QAAA,gBAE3BL,IAAA,CAACR,OAAO,CAACqB,aAAa;MACrBH,KAAK,EAAGD,WAAW,CAACC,KAAO;MAC3BI,MAAM,eAAGd,IAAA,CAACF,MAAM,CAACiB,iBAAiB,IAAE;MACpC;MAAA;MACAC,KAAK,EAAG;QAAEC,KAAK,EAAE,MAAM;QAAEC,MAAM,EAAE;MAAO,CAAG;MAAAb,QAAA,eAE3CL,IAAA,CAACL,IAAI;QAACwB,IAAI,EAAGvB,KAAO;QAACwB,IAAI,EAAG;MAAI,CAAE;IAAC,CACb,CAAC,eAExBlB,KAAA,CAACJ,MAAM,CAACuB,sBAAsB;MAAAhB,QAAA,gBAC7BL,IAAA,CAACF,MAAM,CAACwB,uBAAuB;QAAAjB,QAAA,EAC5BA;MAAQ,CACqB,CAAC,EAE/BD,MAAM,iBACPJ,IAAA,CAACF,MAAM,CAACyB,iBAAiB;QAAAlB,QAAA,EACtBD;MAAM,CACiB,CAC1B;IAAA,CAC6B,CAAC;EAAA,CACR,CAAC;AAE5B,CAAE,CAAC","ignoreList":[]}
+{"version":3,"names":["Ariakit","forwardRef","useContext","Icon","check","MenuContext","Styled","jsx","_jsx","jsxs","_jsxs","MenuCheckboxItem","suffix","children","disabled","hideOnClick","props","ref","menuContext","store","Error","accessibleWhenDisabled","MenuItemCheck","render","ItemPrefixWrapper","style","width","height","icon","size","MenuItemContentWrapper","MenuItemChildrenWrapper","ItemSuffixWrapper"],"sources":["@wordpress/components/src/menu/checkbox-item.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useContext } from '@wordpress/element';\nimport { Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { MenuContext } from './context';\nimport type { MenuCheckboxItemProps } from './types';\nimport * as Styled from './styles';\n\nexport const MenuCheckboxItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< MenuCheckboxItemProps, 'div', false >\n>( function MenuCheckboxItem(\n\t{ suffix, children, disabled = false, hideOnClick = false, ...props },\n\tref\n) {\n\tconst menuContext = useContext( MenuContext );\n\n\tif ( ! menuContext?.store ) {\n\t\tthrow new Error(\n\t\t\t'Menu.CheckboxItem can only be rendered inside a Menu component'\n\t\t);\n\t}\n\n\treturn (\n\t\t<Styled.MenuCheckboxItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\tdisabled={ disabled }\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ menuContext.store }\n\t\t>\n\t\t\t<Ariakit.MenuItemCheck\n\t\t\t\tstore={ menuContext.store }\n\t\t\t\trender={ <Styled.ItemPrefixWrapper /> }\n\t\t\t\t// Override some ariakit inline styles\n\t\t\t\tstyle={ { width: 'auto', height: 'auto' } }\n\t\t\t>\n\t\t\t\t<Icon icon={ check } size={ 24 } />\n\t\t\t</Ariakit.MenuItemCheck>\n\n\t\t\t<Styled.MenuItemContentWrapper>\n\t\t\t\t<Styled.MenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.MenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.MenuItemContentWrapper>\n\t\t</Styled.MenuCheckboxItem>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,SAASC,UAAU,EAAEC,UAAU,QAAQ,oBAAoB;AAC3D,SAASC,IAAI,EAAEC,KAAK,QAAQ,kBAAkB;;AAE9C;AACA;AACA;;AAEA,SAASC,WAAW,QAAQ,WAAW;AAEvC,OAAO,KAAKC,MAAM,MAAM,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEnC,OAAO,MAAMC,gBAAgB,GAAGV,UAAU,CAGvC,SAASU,gBAAgBA,CAC3B;EAAEC,MAAM;EAAEC,QAAQ;EAAEC,QAAQ,GAAG,KAAK;EAAEC,WAAW,GAAG,KAAK;EAAE,GAAGC;AAAM,CAAC,EACrEC,GAAG,EACF;EACD,MAAMC,WAAW,GAAGhB,UAAU,CAAEG,WAAY,CAAC;EAE7C,IAAK,CAAEa,WAAW,EAAEC,KAAK,EAAG;IAC3B,MAAM,IAAIC,KAAK,CACd,gEACD,CAAC;EACF;EAEA,oBACCV,KAAA,CAACJ,MAAM,CAACK,gBAAgB;IACvBM,GAAG,EAAGA,GAAK;IAAA,GACND,KAAK;IACVK,sBAAsB;IACtBP,QAAQ,EAAGA,QAAU;IACrBC,WAAW,EAAGA,WAAa;IAC3BI,KAAK,EAAGD,WAAW,CAACC,KAAO;IAAAN,QAAA,gBAE3BL,IAAA,CAACR,OAAO,CAACsB,aAAa;MACrBH,KAAK,EAAGD,WAAW,CAACC,KAAO;MAC3BI,MAAM,eAAGf,IAAA,CAACF,MAAM,CAACkB,iBAAiB,IAAE;MACpC;MAAA;MACAC,KAAK,EAAG;QAAEC,KAAK,EAAE,MAAM;QAAEC,MAAM,EAAE;MAAO,CAAG;MAAAd,QAAA,eAE3CL,IAAA,CAACL,IAAI;QAACyB,IAAI,EAAGxB,KAAO;QAACyB,IAAI,EAAG;MAAI,CAAE;IAAC,CACb,CAAC,eAExBnB,KAAA,CAACJ,MAAM,CAACwB,sBAAsB;MAAAjB,QAAA,gBAC7BL,IAAA,CAACF,MAAM,CAACyB,uBAAuB;QAAAlB,QAAA,EAC5BA;MAAQ,CACqB,CAAC,EAE/BD,MAAM,iBACPJ,IAAA,CAACF,MAAM,CAAC0B,iBAAiB;QAAAnB,QAAA,EACtBD;MAAM,CACiB,CAC1B;IAAA,CAC6B,CAAC;EAAA,CACR,CAAC;AAE5B,CAAE,CAAC","ignoreList":[]}

package/build-module/menu/index.js

@@ -2,20 +2,17 @@
  * External dependencies
  */
 import * as Ariakit from '@ariakit/react';
-import { useStoreState } from '@ariakit/react';
 
 /**
  * WordPress dependencies
  */
-import { useContext, useMemo, cloneElement, isValidElement, useCallback } from '@wordpress/element';
-import { isRTL } from '@wordpress/i18n';
-import { chevronRightSmall } from '@wordpress/icons';
+import { useContext, useMemo } from '@wordpress/element';
+import { isRTL as isRTLFn } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
  */
-import { useContextSystem, contextConnect } from '../context';
-import * as Styled from './styles';
+import { useContextSystem, contextConnectWithoutRef } from '../context';
 import { MenuContext } from './context';
 import { MenuItem } from './item';
 import { MenuCheckboxItem } from './checkbox-item';
@@ -25,36 +22,29 @@ import { MenuGroupLabel } from './group-label';
 import { MenuSeparator } from './separator';
 import { MenuItemLabel } from './item-label';
 import { MenuItemHelpText } from './item-help-text';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-const UnconnectedMenu = (props, ref) => {
-  var _props$placement;
+import { MenuTriggerButton } from './trigger-button';
+import { MenuSubmenuTriggerItem } from './submenu-trigger-item';
+import { MenuPopover } from './popover';
+import { jsx as _jsx } from "react/jsx-runtime";
+const UnconnectedMenu = props => {
   const {
-    // Store props
-    open,
+    children,
     defaultOpen = false,
+    open,
     onOpenChange,
     placement,
-    // Menu trigger props
-    trigger,
-    // Menu props
-    gutter,
-    children,
-    shift,
-    modal = true,
     // From internal components context
-    variant,
-    // Rest
-    ...otherProps
+    variant
   } = useContextSystem(props, 'Menu');
   const parentContext = useContext(MenuContext);
-  const computedDirection = isRTL() ? 'rtl' : 'ltr';
+  const rtl = isRTLFn();
 
   // If an explicit value for the `placement` prop is not passed,
   // apply a default placement of `bottom-start` for the root menu popover,
   // and of `right-start` for nested menu popovers.
-  let computedPlacement = (_props$placement = props.placement) !== null && _props$placement !== void 0 ? _props$placement : parentContext?.store ? 'right-start' : 'bottom-start';
+  let computedPlacement = placement !== null && placement !== void 0 ? placement : parentContext?.store ? 'right-start' : 'bottom-start';
   // Swap left/right in case of RTL direction
-  if (computedDirection === 'rtl') {
+  if (rtl) {
     if (/right/.test(computedPlacement)) {
       computedPlacement = computedPlacement.replace('right', 'left');
     } else if (/left/.test(computedPlacement)) {
@@ -70,86 +60,18 @@ const UnconnectedMenu = (props, ref) => {
     setOpen(willBeOpen) {
       onOpenChange?.(willBeOpen);
     },
-    rtl: computedDirection === 'rtl'
+    rtl
   });
   const contextValue = useMemo(() => ({
     store: menuStore,
     variant
   }), [menuStore, variant]);
-
-  // Extract the side from the applied placement — useful for animations.
-  // Using `currentPlacement` instead of `placement` to make sure that we
-  // use the final computed placement (including "flips" etc).
-  const appliedPlacementSide = useStoreState(menuStore, 'currentPlacement').split('-')[0];
-  if (menuStore.parent && !(isValidElement(trigger) && MenuItem === trigger.type)) {
-    // eslint-disable-next-line no-console
-    console.warn('For nested Menus, the `trigger` should always be a `MenuItem`.');
-  }
-  const hideOnEscape = useCallback(event => {
-    // Pressing Escape can cause unexpected consequences (ie. exiting
-    // full screen mode on MacOs, close parent modals...).
-    event.preventDefault();
-    // Returning `true` causes the menu to hide.
-    return true;
-  }, []);
-  const wrapperProps = useMemo(() => ({
-    dir: computedDirection,
-    style: {
-      direction: computedDirection
-    }
-  }), [computedDirection]);
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Ariakit.MenuButton, {
-      ref: ref,
-      store: menuStore,
-      render: menuStore.parent ? cloneElement(trigger, {
-        // Add submenu arrow, unless a `suffix` is explicitly specified
-        suffix: /*#__PURE__*/_jsxs(_Fragment, {
-          children: [trigger.props.suffix, /*#__PURE__*/_jsx(Styled.SubmenuChevronIcon, {
-            "aria-hidden": "true",
-            icon: chevronRightSmall,
-            size: 24,
-            preserveAspectRatio: "xMidYMid slice"
-          })]
-        })
-      }) : trigger
-    }), /*#__PURE__*/_jsx(Ariakit.Menu, {
-      ...otherProps,
-      modal: modal,
-      store: menuStore
-      // Root menu has an 8px distance from its trigger,
-      // otherwise 0 (which causes the submenu to slightly overlap)
-      ,
-      gutter: gutter !== null && gutter !== void 0 ? gutter : menuStore.parent ? 0 : 8
-      // Align nested menu by the same (but opposite) amount
-      // as the menu container's padding.
-      ,
-      shift: shift !== null && shift !== void 0 ? shift : menuStore.parent ? -4 : 0,
-      hideOnHoverOutside: false,
-      "data-side": appliedPlacementSide,
-      wrapperProps: wrapperProps,
-      hideOnEscape: hideOnEscape,
-      unmountOnHide: true,
-      render: renderProps =>
-      /*#__PURE__*/
-      // Two wrappers are needed for the entry animation, where the menu
-      // container scales with a different factor than its contents.
-      // The {...renderProps} are passed to the inner wrapper, so that the
-      // menu element is the direct parent of the menu item elements.
-      _jsx(Styled.MenuPopoverOuterWrapper, {
-        variant: variant,
-        children: /*#__PURE__*/_jsx(Styled.MenuPopoverInnerWrapper, {
-          ...renderProps
-        })
-      }),
-      children: /*#__PURE__*/_jsx(MenuContext.Provider, {
-        value: contextValue,
-        children: children
-      })
-    })]
+  return /*#__PURE__*/_jsx(MenuContext.Provider, {
+    value: contextValue,
+    children: children
   });
 };
-export const Menu = Object.assign(contextConnect(UnconnectedMenu, 'Menu'), {
+export const Menu = Object.assign(contextConnectWithoutRef(UnconnectedMenu, 'Menu'), {
   Context: Object.assign(MenuContext, {
     displayName: 'Menu.Context'
   }),
@@ -176,6 +98,15 @@ export const Menu = Object.assign(contextConnect(UnconnectedMenu, 'Menu'), {
   }),
   ItemHelpText: Object.assign(MenuItemHelpText, {
     displayName: 'Menu.ItemHelpText'
+  }),
+  Popover: Object.assign(MenuPopover, {
+    displayName: 'Menu.Popover'
+  }),
+  TriggerButton: Object.assign(MenuTriggerButton, {
+    displayName: 'Menu.TriggerButton'
+  }),
+  SubmenuTriggerItem: Object.assign(MenuSubmenuTriggerItem, {
+    displayName: 'Menu.SubmenuTriggerItem'
   })
 });
 export default Menu;

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

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","useStoreState","useContext","useMemo","cloneElement","isValidElement","useCallback","isRTL","chevronRightSmall","useContextSystem","contextConnect","Styled","MenuContext","MenuItem","MenuCheckboxItem","MenuRadioItem","MenuGroup","MenuGroupLabel","MenuSeparator","MenuItemLabel","MenuItemHelpText","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","UnconnectedMenu","props","ref","_props$placement","open","defaultOpen","onOpenChange","placement","trigger","gutter","children","shift","modal","variant","otherProps","parentContext","computedDirection","computedPlacement","store","test","replace","menuStore","useMenuStore","parent","focusLoop","setOpen","willBeOpen","rtl","contextValue","appliedPlacementSide","split","type","console","warn","hideOnEscape","event","preventDefault","wrapperProps","dir","style","direction","MenuButton","render","suffix","SubmenuChevronIcon","icon","size","preserveAspectRatio","Menu","hideOnHoverOutside","unmountOnHide","renderProps","MenuPopoverOuterWrapper","MenuPopoverInnerWrapper","Provider","value","Object","assign","Context","displayName","Item","RadioItem","CheckboxItem","Group","GroupLabel","Separator","ItemLabel","ItemHelpText"],"sources":["@wordpress/components/src/menu/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\nimport { useStoreState } from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseContext,\n\tuseMemo,\n\tcloneElement,\n\tisValidElement,\n\tuseCallback,\n} from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\nimport { chevronRightSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, contextConnect } from '../context';\nimport type { WordPressComponentProps } from '../context';\nimport type { MenuContext as MenuContextType, MenuProps } from './types';\nimport * as Styled from './styles';\nimport { MenuContext } from './context';\nimport { MenuItem } from './item';\nimport { MenuCheckboxItem } from './checkbox-item';\nimport { MenuRadioItem } from './radio-item';\nimport { MenuGroup } from './group';\nimport { MenuGroupLabel } from './group-label';\nimport { MenuSeparator } from './separator';\nimport { MenuItemLabel } from './item-label';\nimport { MenuItemHelpText } from './item-help-text';\n\nconst UnconnectedMenu = (\n\tprops: WordPressComponentProps< MenuProps, 'div', false >,\n\tref: React.ForwardedRef< HTMLDivElement >\n) => {\n\tconst {\n\t\t// Store props\n\t\topen,\n\t\tdefaultOpen = false,\n\t\tonOpenChange,\n\t\tplacement,\n\n\t\t// Menu trigger props\n\t\ttrigger,\n\n\t\t// Menu props\n\t\tgutter,\n\t\tchildren,\n\t\tshift,\n\t\tmodal = true,\n\n\t\t// From internal components context\n\t\tvariant,\n\n\t\t// Rest\n\t\t...otherProps\n\t} = useContextSystem< typeof props & Pick< MenuContextType, 'variant' > >(\n\t\tprops,\n\t\t'Menu'\n\t);\n\n\tconst parentContext = useContext( MenuContext );\n\n\tconst computedDirection = isRTL() ? 'rtl' : 'ltr';\n\n\t// If an explicit value for the `placement` prop is not passed,\n\t// apply a default placement of `bottom-start` for the root menu popover,\n\t// and of `right-start` for nested menu popovers.\n\tlet computedPlacement =\n\t\tprops.placement ??\n\t\t( parentContext?.store ? 'right-start' : 'bottom-start' );\n\t// Swap left/right in case of RTL direction\n\tif ( computedDirection === 'rtl' ) {\n\t\tif ( /right/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'right',\n\t\t\t\t'left'\n\t\t\t) as typeof computedPlacement;\n\t\t} else if ( /left/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'left',\n\t\t\t\t'right'\n\t\t\t) as typeof computedPlacement;\n\t\t}\n\t}\n\n\tconst menuStore = Ariakit.useMenuStore( {\n\t\tparent: parentContext?.store,\n\t\topen,\n\t\tdefaultOpen,\n\t\tplacement: computedPlacement,\n\t\tfocusLoop: true,\n\t\tsetOpen( willBeOpen ) {\n\t\t\tonOpenChange?.( willBeOpen );\n\t\t},\n\t\trtl: computedDirection === 'rtl',\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( { store: menuStore, variant } ),\n\t\t[ menuStore, variant ]\n\t);\n\n\t// Extract the side from the applied placement — useful for animations.\n\t// Using `currentPlacement` instead of `placement` to make sure that we\n\t// use the final computed placement (including \"flips\" etc).\n\tconst appliedPlacementSide = useStoreState(\n\t\tmenuStore,\n\t\t'currentPlacement'\n\t).split( '-' )[ 0 ];\n\n\tif (\n\t\tmenuStore.parent &&\n\t\t! ( isValidElement( trigger ) && MenuItem === trigger.type )\n\t) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t'For nested Menus, the `trigger` should always be a `MenuItem`.'\n\t\t);\n\t}\n\n\tconst hideOnEscape = useCallback(\n\t\t( event: React.KeyboardEvent< Element > ) => {\n\t\t\t// Pressing Escape can cause unexpected consequences (ie. exiting\n\t\t\t// full screen mode on MacOs, close parent modals...).\n\t\t\tevent.preventDefault();\n\t\t\t// Returning `true` causes the menu to hide.\n\t\t\treturn true;\n\t\t},\n\t\t[]\n\t);\n\n\tconst wrapperProps = useMemo(\n\t\t() => ( {\n\t\t\tdir: computedDirection,\n\t\t\tstyle: {\n\t\t\t\tdirection:\n\t\t\t\t\tcomputedDirection as React.CSSProperties[ 'direction' ],\n\t\t\t},\n\t\t} ),\n\t\t[ computedDirection ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ /* Menu trigger */ }\n\t\t\t<Ariakit.MenuButton\n\t\t\t\tref={ ref }\n\t\t\t\tstore={ menuStore }\n\t\t\t\trender={\n\t\t\t\t\tmenuStore.parent\n\t\t\t\t\t\t? cloneElement( trigger, {\n\t\t\t\t\t\t\t\t// Add submenu arrow, unless a `suffix` is explicitly specified\n\t\t\t\t\t\t\t\tsuffix: (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t{ trigger.props.suffix }\n\t\t\t\t\t\t\t\t\t\t<Styled.SubmenuChevronIcon\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\ticon={ chevronRightSmall }\n\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t\tpreserveAspectRatio=\"xMidYMid slice\"\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  } )\n\t\t\t\t\t\t: trigger\n\t\t\t\t}\n\t\t\t/>\n\n\t\t\t{ /* Menu popover */ }\n\t\t\t<Ariakit.Menu\n\t\t\t\t{ ...otherProps }\n\t\t\t\tmodal={ modal }\n\t\t\t\tstore={ menuStore }\n\t\t\t\t// Root menu has an 8px distance from its trigger,\n\t\t\t\t// otherwise 0 (which causes the submenu to slightly overlap)\n\t\t\t\tgutter={ gutter ?? ( menuStore.parent ? 0 : 8 ) }\n\t\t\t\t// Align nested menu by the same (but opposite) amount\n\t\t\t\t// as the menu container's padding.\n\t\t\t\tshift={ shift ?? ( menuStore.parent ? -4 : 0 ) }\n\t\t\t\thideOnHoverOutside={ false }\n\t\t\t\tdata-side={ appliedPlacementSide }\n\t\t\t\twrapperProps={ wrapperProps }\n\t\t\t\thideOnEscape={ hideOnEscape }\n\t\t\t\tunmountOnHide\n\t\t\t\trender={ ( renderProps ) => (\n\t\t\t\t\t// Two wrappers are needed for the entry animation, where the menu\n\t\t\t\t\t// container scales with a different factor than its contents.\n\t\t\t\t\t// The {...renderProps} are passed to the inner wrapper, so that the\n\t\t\t\t\t// menu element is the direct parent of the menu item elements.\n\t\t\t\t\t<Styled.MenuPopoverOuterWrapper variant={ variant }>\n\t\t\t\t\t\t<Styled.MenuPopoverInnerWrapper { ...renderProps } />\n\t\t\t\t\t</Styled.MenuPopoverOuterWrapper>\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<MenuContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</MenuContext.Provider>\n\t\t\t</Ariakit.Menu>\n\t\t</>\n\t);\n};\n\nexport const Menu = Object.assign( contextConnect( UnconnectedMenu, 'Menu' ), {\n\tContext: Object.assign( MenuContext, {\n\t\tdisplayName: 'Menu.Context',\n\t} ),\n\tItem: Object.assign( MenuItem, {\n\t\tdisplayName: 'Menu.Item',\n\t} ),\n\tRadioItem: Object.assign( MenuRadioItem, {\n\t\tdisplayName: 'Menu.RadioItem',\n\t} ),\n\tCheckboxItem: Object.assign( MenuCheckboxItem, {\n\t\tdisplayName: 'Menu.CheckboxItem',\n\t} ),\n\tGroup: Object.assign( MenuGroup, {\n\t\tdisplayName: 'Menu.Group',\n\t} ),\n\tGroupLabel: Object.assign( MenuGroupLabel, {\n\t\tdisplayName: 'Menu.GroupLabel',\n\t} ),\n\tSeparator: Object.assign( MenuSeparator, {\n\t\tdisplayName: 'Menu.Separator',\n\t} ),\n\tItemLabel: Object.assign( MenuItemLabel, {\n\t\tdisplayName: 'Menu.ItemLabel',\n\t} ),\n\tItemHelpText: Object.assign( MenuItemHelpText, {\n\t\tdisplayName: 'Menu.ItemHelpText',\n\t} ),\n} );\n\nexport default Menu;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Ariakit","useContext","useMemo","isRTL","isRTLFn","useContextSystem","contextConnectWithoutRef","MenuContext","MenuItem","MenuCheckboxItem","MenuRadioItem","MenuGroup","MenuGroupLabel","MenuSeparator","MenuItemLabel","MenuItemHelpText","MenuTriggerButton","MenuSubmenuTriggerItem","MenuPopover","jsx","_jsx","UnconnectedMenu","props","children","defaultOpen","open","onOpenChange","placement","variant","parentContext","rtl","computedPlacement","store","test","replace","menuStore","useMenuStore","parent","focusLoop","setOpen","willBeOpen","contextValue","Provider","value","Menu","Object","assign","Context","displayName","Item","RadioItem","CheckboxItem","Group","GroupLabel","Separator","ItemLabel","ItemHelpText","Popover","TriggerButton","SubmenuTriggerItem"],"sources":["@wordpress/components/src/menu/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useContext, useMemo } from '@wordpress/element';\nimport { isRTL as isRTLFn } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, contextConnectWithoutRef } from '../context';\nimport type { MenuContext as MenuContextType, MenuProps } from './types';\nimport { MenuContext } from './context';\nimport { MenuItem } from './item';\nimport { MenuCheckboxItem } from './checkbox-item';\nimport { MenuRadioItem } from './radio-item';\nimport { MenuGroup } from './group';\nimport { MenuGroupLabel } from './group-label';\nimport { MenuSeparator } from './separator';\nimport { MenuItemLabel } from './item-label';\nimport { MenuItemHelpText } from './item-help-text';\nimport { MenuTriggerButton } from './trigger-button';\nimport { MenuSubmenuTriggerItem } from './submenu-trigger-item';\nimport { MenuPopover } from './popover';\n\nconst UnconnectedMenu = ( props: MenuProps ) => {\n\tconst {\n\t\tchildren,\n\t\tdefaultOpen = false,\n\t\topen,\n\t\tonOpenChange,\n\t\tplacement,\n\n\t\t// From internal components context\n\t\tvariant,\n\t} = useContextSystem<\n\t\t// @ts-expect-error TODO: missing 'className' in MenuProps\n\t\ttypeof props & Pick< MenuContextType, 'variant' >\n\t>( props, 'Menu' );\n\n\tconst parentContext = useContext( MenuContext );\n\n\tconst rtl = isRTLFn();\n\n\t// If an explicit value for the `placement` prop is not passed,\n\t// apply a default placement of `bottom-start` for the root menu popover,\n\t// and of `right-start` for nested menu popovers.\n\tlet computedPlacement =\n\t\tplacement ?? ( parentContext?.store ? 'right-start' : 'bottom-start' );\n\t// Swap left/right in case of RTL direction\n\tif ( rtl ) {\n\t\tif ( /right/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'right',\n\t\t\t\t'left'\n\t\t\t) as typeof computedPlacement;\n\t\t} else if ( /left/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'left',\n\t\t\t\t'right'\n\t\t\t) as typeof computedPlacement;\n\t\t}\n\t}\n\n\tconst menuStore = Ariakit.useMenuStore( {\n\t\tparent: parentContext?.store,\n\t\topen,\n\t\tdefaultOpen,\n\t\tplacement: computedPlacement,\n\t\tfocusLoop: true,\n\t\tsetOpen( willBeOpen ) {\n\t\t\tonOpenChange?.( willBeOpen );\n\t\t},\n\t\trtl,\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( { store: menuStore, variant } ),\n\t\t[ menuStore, variant ]\n\t);\n\n\treturn (\n\t\t<MenuContext.Provider value={ contextValue }>\n\t\t\t{ children }\n\t\t</MenuContext.Provider>\n\t);\n};\n\nexport const Menu = Object.assign(\n\tcontextConnectWithoutRef( UnconnectedMenu, 'Menu' ),\n\t{\n\t\tContext: Object.assign( MenuContext, {\n\t\t\tdisplayName: 'Menu.Context',\n\t\t} ),\n\t\tItem: Object.assign( MenuItem, {\n\t\t\tdisplayName: 'Menu.Item',\n\t\t} ),\n\t\tRadioItem: Object.assign( MenuRadioItem, {\n\t\t\tdisplayName: 'Menu.RadioItem',\n\t\t} ),\n\t\tCheckboxItem: Object.assign( MenuCheckboxItem, {\n\t\t\tdisplayName: 'Menu.CheckboxItem',\n\t\t} ),\n\t\tGroup: Object.assign( MenuGroup, {\n\t\t\tdisplayName: 'Menu.Group',\n\t\t} ),\n\t\tGroupLabel: Object.assign( MenuGroupLabel, {\n\t\t\tdisplayName: 'Menu.GroupLabel',\n\t\t} ),\n\t\tSeparator: Object.assign( MenuSeparator, {\n\t\t\tdisplayName: 'Menu.Separator',\n\t\t} ),\n\t\tItemLabel: Object.assign( MenuItemLabel, {\n\t\t\tdisplayName: 'Menu.ItemLabel',\n\t\t} ),\n\t\tItemHelpText: Object.assign( MenuItemHelpText, {\n\t\t\tdisplayName: 'Menu.ItemHelpText',\n\t\t} ),\n\t\tPopover: Object.assign( MenuPopover, {\n\t\t\tdisplayName: 'Menu.Popover',\n\t\t} ),\n\t\tTriggerButton: Object.assign( MenuTriggerButton, {\n\t\t\tdisplayName: 'Menu.TriggerButton',\n\t\t} ),\n\t\tSubmenuTriggerItem: Object.assign( MenuSubmenuTriggerItem, {\n\t\t\tdisplayName: 'Menu.SubmenuTriggerItem',\n\t\t} ),\n\t}\n);\n\nexport default Menu;\n"],"mappings":"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","ignoreList":[]}

package/build-module/menu/item.js

@@ -14,19 +14,28 @@ export const MenuItem = forwardRef(function MenuItem({
   prefix,
   suffix,
   children,
+  disabled = false,
   hideOnClick = true,
+  store,
   ...props
 }, ref) {
   const menuContext = useContext(MenuContext);
   if (!menuContext?.store) {
     throw new Error('Menu.Item can only be rendered inside a Menu component');
   }
+
+  // In most cases, the menu store will be retrieved from context (ie. the store
+  // created by the top-level menu component). But in rare cases (ie.
+  // `Menu.SubmenuTriggerItem`), the context store wouldn't be correct. This is
+  // why the component accepts a `store` prop to override the context store.
+  const computedStore = store !== null && store !== void 0 ? store : menuContext.store;
   return /*#__PURE__*/_jsxs(Styled.MenuItem, {
     ref: ref,
     ...props,
     accessibleWhenDisabled: true,
+    disabled: disabled,
     hideOnClick: hideOnClick,
-    store: menuContext.store,
+    store: computedStore,
     children: [/*#__PURE__*/_jsx(Styled.ItemPrefixWrapper, {
       children: prefix
     }), /*#__PURE__*/_jsxs(Styled.MenuItemContentWrapper, {

package/build-module/menu/item.js.map

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","useContext","Styled","MenuContext","jsx","_jsx","jsxs","_jsxs","MenuItem","prefix","suffix","children","hideOnClick","props","ref","menuContext","store","Error","accessibleWhenDisabled","ItemPrefixWrapper","MenuItemContentWrapper","MenuItemChildrenWrapper","ItemSuffixWrapper"],"sources":["@wordpress/components/src/menu/item.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport type { MenuItemProps } from './types';\nimport * as Styled from './styles';\nimport { MenuContext } from './context';\n\nexport const MenuItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< MenuItemProps, 'div', false >\n>( function MenuItem(\n\t{ prefix, suffix, children, hideOnClick = true, ...props },\n\tref\n) {\n\tconst menuContext = useContext( MenuContext );\n\n\tif ( ! menuContext?.store ) {\n\t\tthrow new Error(\n\t\t\t'Menu.Item can only be rendered inside a Menu component'\n\t\t);\n\t}\n\n\treturn (\n\t\t<Styled.MenuItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ menuContext.store }\n\t\t>\n\t\t\t<Styled.ItemPrefixWrapper>{ prefix }</Styled.ItemPrefixWrapper>\n\n\t\t\t<Styled.MenuItemContentWrapper>\n\t\t\t\t<Styled.MenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.MenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.MenuItemContentWrapper>\n\t\t</Styled.MenuItem>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,UAAU,QAAQ,oBAAoB;;AAE3D;AACA;AACA;;AAGA,OAAO,KAAKC,MAAM,MAAM,UAAU;AAClC,SAASC,WAAW,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAExC,OAAO,MAAMC,QAAQ,GAAGR,UAAU,CAG/B,SAASQ,QAAQA,CACnB;EAAEC,MAAM;EAAEC,MAAM;EAAEC,QAAQ;EAAEC,WAAW,GAAG,IAAI;EAAE,GAAGC;AAAM,CAAC,EAC1DC,GAAG,EACF;EACD,MAAMC,WAAW,GAAGd,UAAU,CAAEE,WAAY,CAAC;EAE7C,IAAK,CAAEY,WAAW,EAAEC,KAAK,EAAG;IAC3B,MAAM,IAAIC,KAAK,CACd,wDACD,CAAC;EACF;EAEA,oBACCV,KAAA,CAACL,MAAM,CAACM,QAAQ;IACfM,GAAG,EAAGA,GAAK;IAAA,GACND,KAAK;IACVK,sBAAsB;IACtBN,WAAW,EAAGA,WAAa;IAC3BI,KAAK,EAAGD,WAAW,CAACC,KAAO;IAAAL,QAAA,gBAE3BN,IAAA,CAACH,MAAM,CAACiB,iBAAiB;MAAAR,QAAA,EAAGF;IAAM,CAA4B,CAAC,eAE/DF,KAAA,CAACL,MAAM,CAACkB,sBAAsB;MAAAT,QAAA,gBAC7BN,IAAA,CAACH,MAAM,CAACmB,uBAAuB;QAAAV,QAAA,EAC5BA;MAAQ,CACqB,CAAC,EAE/BD,MAAM,iBACPL,IAAA,CAACH,MAAM,CAACoB,iBAAiB;QAAAX,QAAA,EACtBD;MAAM,CACiB,CAC1B;IAAA,CAC6B,CAAC;EAAA,CAChB,CAAC;AAEpB,CAAE,CAAC","ignoreList":[]}
+{"version":3,"names":["forwardRef","useContext","Styled","MenuContext","jsx","_jsx","jsxs","_jsxs","MenuItem","prefix","suffix","children","disabled","hideOnClick","store","props","ref","menuContext","Error","computedStore","accessibleWhenDisabled","ItemPrefixWrapper","MenuItemContentWrapper","MenuItemChildrenWrapper","ItemSuffixWrapper"],"sources":["@wordpress/components/src/menu/item.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport type { MenuItemProps } from './types';\nimport * as Styled from './styles';\nimport { MenuContext } from './context';\n\nexport const MenuItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< MenuItemProps, 'div', false >\n>( function MenuItem(\n\t{\n\t\tprefix,\n\t\tsuffix,\n\t\tchildren,\n\t\tdisabled = false,\n\t\thideOnClick = true,\n\t\tstore,\n\t\t...props\n\t},\n\tref\n) {\n\tconst menuContext = useContext( MenuContext );\n\n\tif ( ! menuContext?.store ) {\n\t\tthrow new Error(\n\t\t\t'Menu.Item can only be rendered inside a Menu component'\n\t\t);\n\t}\n\n\t// In most cases, the menu store will be retrieved from context (ie. the store\n\t// created by the top-level menu component). But in rare cases (ie.\n\t// `Menu.SubmenuTriggerItem`), the context store wouldn't be correct. This is\n\t// why the component accepts a `store` prop to override the context store.\n\tconst computedStore = store ?? menuContext.store;\n\n\treturn (\n\t\t<Styled.MenuItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\tdisabled={ disabled }\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ computedStore }\n\t\t>\n\t\t\t<Styled.ItemPrefixWrapper>{ prefix }</Styled.ItemPrefixWrapper>\n\n\t\t\t<Styled.MenuItemContentWrapper>\n\t\t\t\t<Styled.MenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.MenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.MenuItemContentWrapper>\n\t\t</Styled.MenuItem>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,UAAU,QAAQ,oBAAoB;;AAE3D;AACA;AACA;;AAGA,OAAO,KAAKC,MAAM,MAAM,UAAU;AAClC,SAASC,WAAW,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAExC,OAAO,MAAMC,QAAQ,GAAGR,UAAU,CAG/B,SAASQ,QAAQA,CACnB;EACCC,MAAM;EACNC,MAAM;EACNC,QAAQ;EACRC,QAAQ,GAAG,KAAK;EAChBC,WAAW,GAAG,IAAI;EAClBC,KAAK;EACL,GAAGC;AACJ,CAAC,EACDC,GAAG,EACF;EACD,MAAMC,WAAW,GAAGhB,UAAU,CAAEE,WAAY,CAAC;EAE7C,IAAK,CAAEc,WAAW,EAAEH,KAAK,EAAG;IAC3B,MAAM,IAAII,KAAK,CACd,wDACD,CAAC;EACF;;EAEA;EACA;EACA;EACA;EACA,MAAMC,aAAa,GAAGL,KAAK,aAALA,KAAK,cAALA,KAAK,GAAIG,WAAW,CAACH,KAAK;EAEhD,oBACCP,KAAA,CAACL,MAAM,CAACM,QAAQ;IACfQ,GAAG,EAAGA,GAAK;IAAA,GACND,KAAK;IACVK,sBAAsB;IACtBR,QAAQ,EAAGA,QAAU;IACrBC,WAAW,EAAGA,WAAa;IAC3BC,KAAK,EAAGK,aAAe;IAAAR,QAAA,gBAEvBN,IAAA,CAACH,MAAM,CAACmB,iBAAiB;MAAAV,QAAA,EAAGF;IAAM,CAA4B,CAAC,eAE/DF,KAAA,CAACL,MAAM,CAACoB,sBAAsB;MAAAX,QAAA,gBAC7BN,IAAA,CAACH,MAAM,CAACqB,uBAAuB;QAAAZ,QAAA,EAC5BA;MAAQ,CACqB,CAAC,EAE/BD,MAAM,iBACPL,IAAA,CAACH,MAAM,CAACsB,iBAAiB;QAAAb,QAAA,EACtBD;MAAM,CACiB,CAC1B;IAAA,CAC6B,CAAC;EAAA,CAChB,CAAC;AAEpB,CAAE,CAAC","ignoreList":[]}

package/build-module/menu/popover.js

@@ -0,0 +1,81 @@
+/**
+ * External dependencies
+ */
+import * as Ariakit from '@ariakit/react';
+
+/**
+ * WordPress dependencies
+ */
+import { useContext, useMemo, forwardRef, useCallback } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+
+import * as Styled from './styles';
+import { MenuContext } from './context';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const MenuPopover = forwardRef(function MenuPopover({
+  gutter,
+  children,
+  shift,
+  modal = true,
+  ...otherProps
+}, ref) {
+  const menuContext = useContext(MenuContext);
+
+  // Extract the side from the applied placement — useful for animations.
+  // Using `currentPlacement` instead of `placement` to make sure that we
+  // use the final computed placement (including "flips" etc).
+  const appliedPlacementSide = Ariakit.useStoreState(menuContext?.store, 'currentPlacement')?.split('-')[0];
+  const hideOnEscape = useCallback(event => {
+    // Pressing Escape can cause unexpected consequences (ie. exiting
+    // full screen mode on MacOs, close parent modals...).
+    event.preventDefault();
+    // Returning `true` causes the menu to hide.
+    return true;
+  }, []);
+  const computedDirection = Ariakit.useStoreState(menuContext?.store, 'rtl') ? 'rtl' : 'ltr';
+  const wrapperProps = useMemo(() => ({
+    dir: computedDirection,
+    style: {
+      direction: computedDirection
+    }
+  }), [computedDirection]);
+  if (!menuContext?.store) {
+    throw new Error('Menu.Popover can only be rendered inside a Menu component');
+  }
+  return /*#__PURE__*/_jsx(Ariakit.Menu, {
+    ...otherProps,
+    ref: ref,
+    modal: modal,
+    store: menuContext.store
+    // Root menu has an 8px distance from its trigger,
+    // otherwise 0 (which causes the submenu to slightly overlap)
+    ,
+    gutter: gutter !== null && gutter !== void 0 ? gutter : menuContext.store.parent ? 0 : 8
+    // Align nested menu by the same (but opposite) amount
+    // as the menu container's padding.
+    ,
+    shift: shift !== null && shift !== void 0 ? shift : menuContext.store.parent ? -4 : 0,
+    hideOnHoverOutside: false,
+    "data-side": appliedPlacementSide,
+    wrapperProps: wrapperProps,
+    hideOnEscape: hideOnEscape,
+    unmountOnHide: true,
+    render: renderProps =>
+    /*#__PURE__*/
+    // Two wrappers are needed for the entry animation, where the menu
+    // container scales with a different factor than its contents.
+    // The {...renderProps} are passed to the inner wrapper, so that the
+    // menu element is the direct parent of the menu item elements.
+    _jsx(Styled.MenuPopoverOuterWrapper, {
+      variant: menuContext.variant,
+      children: /*#__PURE__*/_jsx(Styled.MenuPopoverInnerWrapper, {
+        ...renderProps
+      })
+    }),
+    children: children
+  });
+});
+//# sourceMappingURL=popover.js.map

package/build-module/menu/popover.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Ariakit","useContext","useMemo","forwardRef","useCallback","Styled","MenuContext","jsx","_jsx","MenuPopover","gutter","children","shift","modal","otherProps","ref","menuContext","appliedPlacementSide","useStoreState","store","split","hideOnEscape","event","preventDefault","computedDirection","wrapperProps","dir","style","direction","Error","Menu","parent","hideOnHoverOutside","unmountOnHide","render","renderProps","MenuPopoverOuterWrapper","variant","MenuPopoverInnerWrapper"],"sources":["@wordpress/components/src/menu/popover.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseContext,\n\tuseMemo,\n\tforwardRef,\n\tuseCallback,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport type { MenuPopoverProps } from './types';\nimport * as Styled from './styles';\nimport { MenuContext } from './context';\n\nexport const MenuPopover = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< MenuPopoverProps, 'div', false >\n>( function MenuPopover(\n\t{ gutter, children, shift, modal = true, ...otherProps },\n\tref\n) {\n\tconst menuContext = useContext( MenuContext );\n\n\t// Extract the side from the applied placement — useful for animations.\n\t// Using `currentPlacement` instead of `placement` to make sure that we\n\t// use the final computed placement (including \"flips\" etc).\n\tconst appliedPlacementSide = Ariakit.useStoreState(\n\t\tmenuContext?.store,\n\t\t'currentPlacement'\n\t)?.split( '-' )[ 0 ];\n\n\tconst hideOnEscape = useCallback(\n\t\t( event: React.KeyboardEvent< Element > ) => {\n\t\t\t// Pressing Escape can cause unexpected consequences (ie. exiting\n\t\t\t// full screen mode on MacOs, close parent modals...).\n\t\t\tevent.preventDefault();\n\t\t\t// Returning `true` causes the menu to hide.\n\t\t\treturn true;\n\t\t},\n\t\t[]\n\t);\n\n\tconst computedDirection = Ariakit.useStoreState( menuContext?.store, 'rtl' )\n\t\t? 'rtl'\n\t\t: 'ltr';\n\n\tconst wrapperProps = useMemo(\n\t\t() => ( {\n\t\t\tdir: computedDirection,\n\t\t\tstyle: {\n\t\t\t\tdirection:\n\t\t\t\t\tcomputedDirection as React.CSSProperties[ 'direction' ],\n\t\t\t},\n\t\t} ),\n\t\t[ computedDirection ]\n\t);\n\n\tif ( ! menuContext?.store ) {\n\t\tthrow new Error(\n\t\t\t'Menu.Popover can only be rendered inside a Menu component'\n\t\t);\n\t}\n\n\treturn (\n\t\t<Ariakit.Menu\n\t\t\t{ ...otherProps }\n\t\t\tref={ ref }\n\t\t\tmodal={ modal }\n\t\t\tstore={ menuContext.store }\n\t\t\t// Root menu has an 8px distance from its trigger,\n\t\t\t// otherwise 0 (which causes the submenu to slightly overlap)\n\t\t\tgutter={ gutter ?? ( menuContext.store.parent ? 0 : 8 ) }\n\t\t\t// Align nested menu by the same (but opposite) amount\n\t\t\t// as the menu container's padding.\n\t\t\tshift={ shift ?? ( menuContext.store.parent ? -4 : 0 ) }\n\t\t\thideOnHoverOutside={ false }\n\t\t\tdata-side={ appliedPlacementSide }\n\t\t\twrapperProps={ wrapperProps }\n\t\t\thideOnEscape={ hideOnEscape }\n\t\t\tunmountOnHide\n\t\t\trender={ ( renderProps ) => (\n\t\t\t\t// Two wrappers are needed for the entry animation, where the menu\n\t\t\t\t// container scales with a different factor than its contents.\n\t\t\t\t// The {...renderProps} are passed to the inner wrapper, so that the\n\t\t\t\t// menu element is the direct parent of the menu item elements.\n\t\t\t\t<Styled.MenuPopoverOuterWrapper variant={ menuContext.variant }>\n\t\t\t\t\t<Styled.MenuPopoverInnerWrapper { ...renderProps } />\n\t\t\t\t</Styled.MenuPopoverOuterWrapper>\n\t\t\t) }\n\t\t>\n\t\t\t{ children }\n\t\t</Ariakit.Menu>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,SACCC,UAAU,EACVC,OAAO,EACPC,UAAU,EACVC,WAAW,QACL,oBAAoB;;AAE3B;AACA;AACA;;AAGA,OAAO,KAAKC,MAAM,MAAM,UAAU;AAClC,SAASC,WAAW,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAExC,OAAO,MAAMC,WAAW,GAAGN,UAAU,CAGlC,SAASM,WAAWA,CACtB;EAAEC,MAAM;EAAEC,QAAQ;EAAEC,KAAK;EAAEC,KAAK,GAAG,IAAI;EAAE,GAAGC;AAAW,CAAC,EACxDC,GAAG,EACF;EACD,MAAMC,WAAW,GAAGf,UAAU,CAAEK,WAAY,CAAC;;EAE7C;EACA;EACA;EACA,MAAMW,oBAAoB,GAAGjB,OAAO,CAACkB,aAAa,CACjDF,WAAW,EAAEG,KAAK,EAClB,kBACD,CAAC,EAAEC,KAAK,CAAE,GAAI,CAAC,CAAE,CAAC,CAAE;EAEpB,MAAMC,YAAY,GAAGjB,WAAW,CAC7BkB,KAAqC,IAAM;IAC5C;IACA;IACAA,KAAK,CAACC,cAAc,CAAC,CAAC;IACtB;IACA,OAAO,IAAI;EACZ,CAAC,EACD,EACD,CAAC;EAED,MAAMC,iBAAiB,GAAGxB,OAAO,CAACkB,aAAa,CAAEF,WAAW,EAAEG,KAAK,EAAE,KAAM,CAAC,GACzE,KAAK,GACL,KAAK;EAER,MAAMM,YAAY,GAAGvB,OAAO,CAC3B,OAAQ;IACPwB,GAAG,EAAEF,iBAAiB;IACtBG,KAAK,EAAE;MACNC,SAAS,EACRJ;IACF;EACD,CAAC,CAAE,EACH,CAAEA,iBAAiB,CACpB,CAAC;EAED,IAAK,CAAER,WAAW,EAAEG,KAAK,EAAG;IAC3B,MAAM,IAAIU,KAAK,CACd,2DACD,CAAC;EACF;EAEA,oBACCrB,IAAA,CAACR,OAAO,CAAC8B,IAAI;IAAA,GACPhB,UAAU;IACfC,GAAG,EAAGA,GAAK;IACXF,KAAK,EAAGA,KAAO;IACfM,KAAK,EAAGH,WAAW,CAACG;IACpB;IACA;IAAA;IACAT,MAAM,EAAGA,MAAM,aAANA,MAAM,cAANA,MAAM,GAAMM,WAAW,CAACG,KAAK,CAACY,MAAM,GAAG,CAAC,GAAG;IACpD;IACA;IAAA;IACAnB,KAAK,EAAGA,KAAK,aAALA,KAAK,cAALA,KAAK,GAAMI,WAAW,CAACG,KAAK,CAACY,MAAM,GAAG,CAAC,CAAC,GAAG,CAAK;IACxDC,kBAAkB,EAAG,KAAO;IAC5B,aAAYf,oBAAsB;IAClCQ,YAAY,EAAGA,YAAc;IAC7BJ,YAAY,EAAGA,YAAc;IAC7BY,aAAa;IACbC,MAAM,EAAKC,WAAW;IAAA;IACrB;IACA;IACA;IACA;IACA3B,IAAA,CAACH,MAAM,CAAC+B,uBAAuB;MAACC,OAAO,EAAGrB,WAAW,CAACqB,OAAS;MAAA1B,QAAA,eAC9DH,IAAA,CAACH,MAAM,CAACiC,uBAAuB;QAAA,GAAMH;MAAW,CAAI;IAAC,CACtB,CAC9B;IAAAxB,QAAA,EAEDA;EAAQ,CACG,CAAC;AAEjB,CAAE,CAAC","ignoreList":[]}

package/build-module/menu/radio-item.js

@@ -29,6 +29,7 @@ const radioCheck = /*#__PURE__*/_jsx(SVG, {
 export const MenuRadioItem = forwardRef(function MenuRadioItem({
   suffix,
   children,
+  disabled = false,
   hideOnClick = false,
   ...props
 }, ref) {
@@ -40,6 +41,7 @@ export const MenuRadioItem = forwardRef(function MenuRadioItem({
     ref: ref,
     ...props,
     accessibleWhenDisabled: true,
+    disabled: disabled,
     hideOnClick: hideOnClick,
     store: menuContext.store,
     children: [/*#__PURE__*/_jsx(Ariakit.MenuItemCheck, {