@wordpress/components 27.4.0 → 27.6.0

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

@@ -1 +1 @@
-{"version":3,"names":["classnames","useState","useEffect","Children","useRef","deprecated","__","Modal","Button","PageControl","Guide","children","className","contentLabel","finishButtonText","onFinish","pages","ref","currentPage","setCurrentPage","frame","current","querySelector","HTMLElement","focus","count","since","alternative","_Children$map","map","child","content","canGoBack","canGoForward","length","goBack","goForward","createElement","isDismissible","onRequestClose","onKeyDown","event","code","preventDefault","image","numberOfPages","variant","onClick"],"sources":["@wordpress/components/src/guide/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useEffect, Children, useRef } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Modal from '../modal';\nimport Button from '../button';\nimport PageControl from './page-control';\nimport type { GuideProps } from './types';\n\n/**\n * `Guide` is a React component that renders a _user guide_ in a modal. The guide consists of several pages which the user can step through one by one. The guide is finished when the modal is closed or when the user clicks _Finish_ on the last page of the guide.\n *\n * ```jsx\n * function MyTutorial() {\n * \tconst [ isOpen, setIsOpen ] = useState( true );\n *\n * \tif ( ! isOpen ) {\n * \t\treturn null;\n * \t}\n *\n * \treturn (\n * \t\t<Guide\n * \t\t\tonFinish={ () => setIsOpen( false ) }\n * \t\t\tpages={ [\n * \t\t\t\t{\n * \t\t\t\t\tcontent: <p>Welcome to the ACME Store!</p>,\n * \t\t\t\t},\n * \t\t\t\t{\n * \t\t\t\t\timage: <img src=\"https://acmestore.com/add-to-cart.png\" />,\n * \t\t\t\t\tcontent: (\n * \t\t\t\t\t\t<p>\n * \t\t\t\t\t\t\tClick <i>Add to Cart</i> to buy a product.\n * \t\t\t\t\t\t</p>\n * \t\t\t\t\t),\n * \t\t\t\t},\n * \t\t\t] }\n * \t\t/>\n * \t);\n * }\n * ```\n */\nfunction Guide( {\n\tchildren,\n\tclassName,\n\tcontentLabel,\n\tfinishButtonText = __( 'Finish' ),\n\tonFinish,\n\tpages = [],\n}: GuideProps ) {\n\tconst ref = useRef< HTMLDivElement >( null );\n\tconst [ currentPage, setCurrentPage ] = useState( 0 );\n\n\tuseEffect( () => {\n\t\t// Place focus at the top of the guide on mount and when the page changes.\n\t\tconst frame = ref.current?.querySelector( '.components-guide' );\n\t\tif ( frame instanceof HTMLElement ) {\n\t\t\tframe.focus();\n\t\t}\n\t}, [ currentPage ] );\n\n\tuseEffect( () => {\n\t\tif ( Children.count( children ) ) {\n\t\t\tdeprecated( 'Passing children to <Guide>', {\n\t\t\t\tsince: '5.5',\n\t\t\t\talternative: 'the `pages` prop',\n\t\t\t} );\n\t\t}\n\t}, [ children ] );\n\n\tif ( Children.count( children ) ) {\n\t\tpages =\n\t\t\tChildren.map( children, ( child ) => ( {\n\t\t\t\tcontent: child,\n\t\t\t} ) ) ?? [];\n\t}\n\n\tconst canGoBack = currentPage > 0;\n\tconst canGoForward = currentPage < pages.length - 1;\n\n\tconst goBack = () => {\n\t\tif ( canGoBack ) {\n\t\t\tsetCurrentPage( currentPage - 1 );\n\t\t}\n\t};\n\n\tconst goForward = () => {\n\t\tif ( canGoForward ) {\n\t\t\tsetCurrentPage( currentPage + 1 );\n\t\t}\n\t};\n\n\tif ( pages.length === 0 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Modal\n\t\t\tclassName={ classnames( 'components-guide', className ) }\n\t\t\tcontentLabel={ contentLabel }\n\t\t\tisDismissible={ pages.length > 1 }\n\t\t\tonRequestClose={ onFinish }\n\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\tif ( event.code === 'ArrowLeft' ) {\n\t\t\t\t\tgoBack();\n\t\t\t\t\t// Do not scroll the modal's contents.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t} else if ( event.code === 'ArrowRight' ) {\n\t\t\t\t\tgoForward();\n\t\t\t\t\t// Do not scroll the modal's contents.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t} }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t<div className=\"components-guide__container\">\n\t\t\t\t<div className=\"components-guide__page\">\n\t\t\t\t\t{ pages[ currentPage ].image }\n\n\t\t\t\t\t{ pages.length > 1 && (\n\t\t\t\t\t\t<PageControl\n\t\t\t\t\t\t\tcurrentPage={ currentPage }\n\t\t\t\t\t\t\tnumberOfPages={ pages.length }\n\t\t\t\t\t\t\tsetCurrentPage={ setCurrentPage }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ pages[ currentPage ].content }\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"components-guide__footer\">\n\t\t\t\t\t{ canGoBack && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__back-button\"\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ goBack }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Previous' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canGoForward && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__forward-button\"\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\tonClick={ goForward }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Next' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canGoForward && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__finish-button\"\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\tonClick={ onFinish }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ finishButtonText }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n}\n\nexport default Guide;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","useState","useEffect","Children","useRef","deprecated","__","Modal","Button","PageControl","Guide","children","className","contentLabel","finishButtonText","onFinish","pages","ref","currentPage","setCurrentPage","frame","current","querySelector","HTMLElement","focus","count","since","alternative","_Children$map","map","child","content","canGoBack","canGoForward","length","goBack","goForward","createElement","isDismissible","onRequestClose","onKeyDown","event","code","preventDefault","image","numberOfPages","variant","onClick"],"sources":["@wordpress/components/src/guide/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useEffect, Children, useRef } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Modal from '../modal';\nimport Button from '../button';\nimport PageControl from './page-control';\nimport type { GuideProps } from './types';\n\n/**\n * `Guide` is a React component that renders a _user guide_ in a modal. The guide consists of several pages which the user can step through one by one. The guide is finished when the modal is closed or when the user clicks _Finish_ on the last page of the guide.\n *\n * ```jsx\n * function MyTutorial() {\n * \tconst [ isOpen, setIsOpen ] = useState( true );\n *\n * \tif ( ! isOpen ) {\n * \t\treturn null;\n * \t}\n *\n * \treturn (\n * \t\t<Guide\n * \t\t\tonFinish={ () => setIsOpen( false ) }\n * \t\t\tpages={ [\n * \t\t\t\t{\n * \t\t\t\t\tcontent: <p>Welcome to the ACME Store!</p>,\n * \t\t\t\t},\n * \t\t\t\t{\n * \t\t\t\t\timage: <img src=\"https://acmestore.com/add-to-cart.png\" />,\n * \t\t\t\t\tcontent: (\n * \t\t\t\t\t\t<p>\n * \t\t\t\t\t\t\tClick <i>Add to Cart</i> to buy a product.\n * \t\t\t\t\t\t</p>\n * \t\t\t\t\t),\n * \t\t\t\t},\n * \t\t\t] }\n * \t\t/>\n * \t);\n * }\n * ```\n */\nfunction Guide( {\n\tchildren,\n\tclassName,\n\tcontentLabel,\n\tfinishButtonText = __( 'Finish' ),\n\tonFinish,\n\tpages = [],\n}: GuideProps ) {\n\tconst ref = useRef< HTMLDivElement >( null );\n\tconst [ currentPage, setCurrentPage ] = useState( 0 );\n\n\tuseEffect( () => {\n\t\t// Place focus at the top of the guide on mount and when the page changes.\n\t\tconst frame = ref.current?.querySelector( '.components-guide' );\n\t\tif ( frame instanceof HTMLElement ) {\n\t\t\tframe.focus();\n\t\t}\n\t}, [ currentPage ] );\n\n\tuseEffect( () => {\n\t\tif ( Children.count( children ) ) {\n\t\t\tdeprecated( 'Passing children to <Guide>', {\n\t\t\t\tsince: '5.5',\n\t\t\t\talternative: 'the `pages` prop',\n\t\t\t} );\n\t\t}\n\t}, [ children ] );\n\n\tif ( Children.count( children ) ) {\n\t\tpages =\n\t\t\tChildren.map( children, ( child ) => ( {\n\t\t\t\tcontent: child,\n\t\t\t} ) ) ?? [];\n\t}\n\n\tconst canGoBack = currentPage > 0;\n\tconst canGoForward = currentPage < pages.length - 1;\n\n\tconst goBack = () => {\n\t\tif ( canGoBack ) {\n\t\t\tsetCurrentPage( currentPage - 1 );\n\t\t}\n\t};\n\n\tconst goForward = () => {\n\t\tif ( canGoForward ) {\n\t\t\tsetCurrentPage( currentPage + 1 );\n\t\t}\n\t};\n\n\tif ( pages.length === 0 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Modal\n\t\t\tclassName={ clsx( 'components-guide', className ) }\n\t\t\tcontentLabel={ contentLabel }\n\t\t\tisDismissible={ pages.length > 1 }\n\t\t\tonRequestClose={ onFinish }\n\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\tif ( event.code === 'ArrowLeft' ) {\n\t\t\t\t\tgoBack();\n\t\t\t\t\t// Do not scroll the modal's contents.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t} else if ( event.code === 'ArrowRight' ) {\n\t\t\t\t\tgoForward();\n\t\t\t\t\t// Do not scroll the modal's contents.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t} }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t<div className=\"components-guide__container\">\n\t\t\t\t<div className=\"components-guide__page\">\n\t\t\t\t\t{ pages[ currentPage ].image }\n\n\t\t\t\t\t{ pages.length > 1 && (\n\t\t\t\t\t\t<PageControl\n\t\t\t\t\t\t\tcurrentPage={ currentPage }\n\t\t\t\t\t\t\tnumberOfPages={ pages.length }\n\t\t\t\t\t\t\tsetCurrentPage={ setCurrentPage }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ pages[ currentPage ].content }\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"components-guide__footer\">\n\t\t\t\t\t{ canGoBack && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__back-button\"\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ goBack }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Previous' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\t{ canGoForward && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__forward-button\"\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\tonClick={ goForward }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Next' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canGoForward && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"components-guide__finish-button\"\n\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\tonClick={ onFinish }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ finishButtonText }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n}\n\nexport default Guide;\n"],"mappings":"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","ignoreList":[]}

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

@@ -2,7 +2,7 @@ import { createElement } from "react";
 /**
  * External dependencies
  */
-import classNames from 'classnames';
+import clsx from 'clsx';
 /**
  * WordPress dependencies
  */
@@ -48,17 +48,14 @@ export function UnforwardedInputControl(props, ref) {
     ...restProps
   } = useDeprecated36pxDefaultSizeProp(props);
   const id = useUniqueId(idProp);
-  const classes = classNames('components-input-control', className);
+  const classes = clsx('components-input-control', className);
   const draftHookProps = useDraft({
     value,
     onBlur: restProps.onBlur,
     onChange
   });
-
-  // ARIA descriptions can only contain plain text, so fall back to aria-details if not.
-  const helpPropName = typeof help === 'string' ? 'aria-describedby' : 'aria-details';
   const helpProp = !!help ? {
-    [helpPropName]: `${id}__help`
+    'aria-describedby': `${id}__help`
   } : {};
   return createElement(BaseControl, {
     className: classes,

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

@@ -1 +1 @@
-{"version":3,"names":["classNames","useInstanceId","forwardRef","InputBase","InputField","space","useDraft","BaseControl","useDeprecated36pxDefaultSizeProp","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","helpPropName","helpProp","createElement","__nextHasNoMarginBottom","gap","justify","paddingInlineStart","undefined","paddingInlineEnd"],"sources":["@wordpress/components/src/input-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\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 = classNames( 'components-input-control', className );\n\n\tconst draftHookProps = useDraft( {\n\t\tvalue,\n\t\tonBlur: restProps.onBlur,\n\t\tonChange,\n\t} );\n\n\t// ARIA descriptions can only contain plain text, so fall back to aria-details if not.\n\tconst helpPropName =\n\t\ttypeof help === 'string' ? 'aria-describedby' : 'aria-details';\n\tconst helpProp = !! help ? { [ helpPropName ]: `${ 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( 2 ) : undefined }\n\t\t\t\t\tpaddingInlineEnd={ suffix ? space( 2 ) : 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","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","createElement","__nextHasNoMarginBottom","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( 2 ) : undefined }\n\t\t\t\t\tpaddingInlineEnd={ suffix ? space( 2 ) : 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":[]}

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

@@ -132,7 +132,9 @@ function InputField({
       ...dragProps.event,
       target
     };
-    if (!distance) return;
+    if (!distance) {
+      return;
+    }
     event.stopPropagation();
 
     /**

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

@@ -1 +1 @@
-{"version":3,"names":["useDrag","forwardRef","useRef","useDragCursor","Input","useInputControlStateReducer","withIgnoreIMEEvents","noop","InputField","disabled","dragDirection","dragThreshold","id","isDragEnabled","isPressEnterToChange","onBlur","onChange","onDrag","onDragEnd","onDragStart","onKeyDown","onValidate","size","stateReducer","state","value","valueProp","type","props","ref","change","commit","drag","dragEnd","dragStart","invalidate","pressDown","pressEnter","pressUp","reset","isDragging","isDirty","wasDirtyOnBlur","dragCursor","handleOnBlur","event","target","validity","valid","current","handleOnCommit","handleOnChange","nextValue","currentTarget","err","handleOnKeyDown","key","preventDefault","dragGestureProps","dragProps","distance","dragging","stopPropagation","axis","threshold","enabled","pointer","capture","handleOnMouseDown","onMouseDown","ownerDocument","activeElement","focus","createElement","className","inputSize","ForwardedComponent"],"sources":["@wordpress/components/src/input-control/input-field.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { useDrag } from '@use-gesture/react';\nimport type {\n\tSyntheticEvent,\n\tChangeEvent,\n\tKeyboardEvent,\n\tPointerEvent,\n\tFocusEvent,\n\tForwardedRef,\n\tMouseEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useDragCursor } from './utils';\nimport { Input } from './styles/input-control-styles';\nimport { useInputControlStateReducer } from './reducer/reducer';\nimport type { InputFieldProps } from './types';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\n\nconst noop = () => {};\n\nfunction InputField(\n\t{\n\t\tdisabled = false,\n\t\tdragDirection = 'n',\n\t\tdragThreshold = 10,\n\t\tid,\n\t\tisDragEnabled = false,\n\t\tisPressEnterToChange = false,\n\t\tonBlur = noop,\n\t\tonChange = noop,\n\t\tonDrag = noop,\n\t\tonDragEnd = noop,\n\t\tonDragStart = noop,\n\t\tonKeyDown = noop,\n\t\tonValidate = noop,\n\t\tsize = 'default',\n\t\tstateReducer = ( state: any ) => state,\n\t\tvalue: valueProp,\n\t\ttype,\n\t\t...props\n\t}: WordPressComponentProps< InputFieldProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\t// State.\n\t\tstate,\n\t\t// Actions.\n\t\tchange,\n\t\tcommit,\n\t\tdrag,\n\t\tdragEnd,\n\t\tdragStart,\n\t\tinvalidate,\n\t\tpressDown,\n\t\tpressEnter,\n\t\tpressUp,\n\t\treset,\n\t} = useInputControlStateReducer(\n\t\tstateReducer,\n\t\t{\n\t\t\tisDragEnabled,\n\t\t\tvalue: valueProp,\n\t\t\tisPressEnterToChange,\n\t\t},\n\t\tonChange\n\t);\n\n\tconst { value, isDragging, isDirty } = state;\n\tconst wasDirtyOnBlur = useRef( false );\n\n\tconst dragCursor = useDragCursor( isDragging, dragDirection );\n\n\tconst handleOnBlur = ( event: FocusEvent< HTMLInputElement > ) => {\n\t\tonBlur( event );\n\n\t\t/**\n\t\t * If isPressEnterToChange is set, this commits the value to\n\t\t * the onChange callback.\n\t\t */\n\t\tif ( isDirty || ! event.target.validity.valid ) {\n\t\t\twasDirtyOnBlur.current = true;\n\t\t\thandleOnCommit( event );\n\t\t}\n\t};\n\n\tconst handleOnChange = ( event: ChangeEvent< HTMLInputElement > ) => {\n\t\tconst nextValue = event.target.value;\n\t\tchange( nextValue, event );\n\t};\n\n\tconst handleOnCommit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tconst nextValue = event.currentTarget.value;\n\n\t\ttry {\n\t\t\tonValidate( nextValue );\n\t\t\tcommit( nextValue, event );\n\t\t} catch ( err ) {\n\t\t\tinvalidate( err, event );\n\t\t}\n\t};\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { key } = event;\n\t\tonKeyDown( event );\n\n\t\tswitch ( key ) {\n\t\t\tcase 'ArrowUp':\n\t\t\t\tpressUp( event );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowDown':\n\t\t\t\tpressDown( event );\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tpressEnter( event );\n\n\t\t\t\tif ( isPressEnterToChange ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\thandleOnCommit( event );\n\t\t\t\t}\n\t\t\t\tbreak;\n\n\t\t\tcase 'Escape':\n\t\t\t\tif ( isPressEnterToChange && isDirty ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treset( valueProp, event );\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t}\n\t};\n\n\tconst dragGestureProps = useDrag< PointerEvent< HTMLInputElement > >(\n\t\t( dragProps ) => {\n\t\t\tconst { distance, dragging, event, target } = dragProps;\n\n\t\t\t// The `target` prop always references the `input` element while, by\n\t\t\t// default, the `dragProps.event.target` property would reference the real\n\t\t\t// event target (i.e. any DOM element that the pointer is hovering while\n\t\t\t// dragging). Ensuring that the `target` is always the `input` element\n\t\t\t// allows consumers of `InputControl` (or any higher-level control) to\n\t\t\t// check the input's validity by accessing `event.target.validity.valid`.\n\t\t\tdragProps.event = {\n\t\t\t\t...dragProps.event,\n\t\t\t\ttarget,\n\t\t\t};\n\n\t\t\tif ( ! distance ) return;\n\t\t\tevent.stopPropagation();\n\n\t\t\t/**\n\t\t\t * Quick return if no longer dragging.\n\t\t\t * This prevents unnecessary value calculations.\n\t\t\t */\n\t\t\tif ( ! dragging ) {\n\t\t\t\tonDragEnd( dragProps );\n\t\t\t\tdragEnd( dragProps );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonDrag( dragProps );\n\t\t\tdrag( dragProps );\n\n\t\t\tif ( ! isDragging ) {\n\t\t\t\tonDragStart( dragProps );\n\t\t\t\tdragStart( dragProps );\n\t\t\t}\n\t\t},\n\t\t{\n\t\t\taxis: dragDirection === 'e' || dragDirection === 'w' ? 'x' : 'y',\n\t\t\tthreshold: dragThreshold,\n\t\t\tenabled: isDragEnabled,\n\t\t\tpointer: { capture: false },\n\t\t}\n\t);\n\n\tconst dragProps = isDragEnabled ? dragGestureProps() : {};\n\t/*\n\t * Works around the odd UA (e.g. Firefox) that does not focus inputs of\n\t * type=number when their spinner arrows are pressed.\n\t */\n\tlet handleOnMouseDown;\n\tif ( type === 'number' ) {\n\t\thandleOnMouseDown = ( event: MouseEvent< HTMLInputElement > ) => {\n\t\t\tprops.onMouseDown?.( event );\n\t\t\tif (\n\t\t\t\tevent.currentTarget !==\n\t\t\t\tevent.currentTarget.ownerDocument.activeElement\n\t\t\t) {\n\t\t\t\tevent.currentTarget.focus();\n\t\t\t}\n\t\t};\n\t}\n\n\treturn (\n\t\t<Input\n\t\t\t{ ...props }\n\t\t\t{ ...dragProps }\n\t\t\tclassName=\"components-input-control__input\"\n\t\t\tdisabled={ disabled }\n\t\t\tdragCursor={ dragCursor }\n\t\t\tisDragging={ isDragging }\n\t\t\tid={ id }\n\t\t\tonBlur={ handleOnBlur }\n\t\t\tonChange={ handleOnChange }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( handleOnKeyDown ) }\n\t\t\tonMouseDown={ handleOnMouseDown }\n\t\t\tref={ ref }\n\t\t\tinputSize={ size }\n\t\t\t// Fallback to `''` to avoid \"uncontrolled to controlled\" warning.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/47250 for details.\n\t\t\tvalue={ value ?? '' }\n\t\t\ttype={ type }\n\t\t/>\n\t);\n}\n\nconst ForwardedComponent = forwardRef( InputField );\n\nexport default ForwardedComponent;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useDrag","forwardRef","useRef","useDragCursor","Input","useInputControlStateReducer","withIgnoreIMEEvents","noop","InputField","disabled","dragDirection","dragThreshold","id","isDragEnabled","isPressEnterToChange","onBlur","onChange","onDrag","onDragEnd","onDragStart","onKeyDown","onValidate","size","stateReducer","state","value","valueProp","type","props","ref","change","commit","drag","dragEnd","dragStart","invalidate","pressDown","pressEnter","pressUp","reset","isDragging","isDirty","wasDirtyOnBlur","dragCursor","handleOnBlur","event","target","validity","valid","current","handleOnCommit","handleOnChange","nextValue","currentTarget","err","handleOnKeyDown","key","preventDefault","dragGestureProps","dragProps","distance","dragging","stopPropagation","axis","threshold","enabled","pointer","capture","handleOnMouseDown","onMouseDown","ownerDocument","activeElement","focus","createElement","className","inputSize","ForwardedComponent"],"sources":["@wordpress/components/src/input-control/input-field.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { useDrag } from '@use-gesture/react';\nimport type {\n\tSyntheticEvent,\n\tChangeEvent,\n\tKeyboardEvent,\n\tPointerEvent,\n\tFocusEvent,\n\tForwardedRef,\n\tMouseEvent,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useDragCursor } from './utils';\nimport { Input } from './styles/input-control-styles';\nimport { useInputControlStateReducer } from './reducer/reducer';\nimport type { InputFieldProps } from './types';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\n\nconst noop = () => {};\n\nfunction InputField(\n\t{\n\t\tdisabled = false,\n\t\tdragDirection = 'n',\n\t\tdragThreshold = 10,\n\t\tid,\n\t\tisDragEnabled = false,\n\t\tisPressEnterToChange = false,\n\t\tonBlur = noop,\n\t\tonChange = noop,\n\t\tonDrag = noop,\n\t\tonDragEnd = noop,\n\t\tonDragStart = noop,\n\t\tonKeyDown = noop,\n\t\tonValidate = noop,\n\t\tsize = 'default',\n\t\tstateReducer = ( state: any ) => state,\n\t\tvalue: valueProp,\n\t\ttype,\n\t\t...props\n\t}: WordPressComponentProps< InputFieldProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\t// State.\n\t\tstate,\n\t\t// Actions.\n\t\tchange,\n\t\tcommit,\n\t\tdrag,\n\t\tdragEnd,\n\t\tdragStart,\n\t\tinvalidate,\n\t\tpressDown,\n\t\tpressEnter,\n\t\tpressUp,\n\t\treset,\n\t} = useInputControlStateReducer(\n\t\tstateReducer,\n\t\t{\n\t\t\tisDragEnabled,\n\t\t\tvalue: valueProp,\n\t\t\tisPressEnterToChange,\n\t\t},\n\t\tonChange\n\t);\n\n\tconst { value, isDragging, isDirty } = state;\n\tconst wasDirtyOnBlur = useRef( false );\n\n\tconst dragCursor = useDragCursor( isDragging, dragDirection );\n\n\tconst handleOnBlur = ( event: FocusEvent< HTMLInputElement > ) => {\n\t\tonBlur( event );\n\n\t\t/**\n\t\t * If isPressEnterToChange is set, this commits the value to\n\t\t * the onChange callback.\n\t\t */\n\t\tif ( isDirty || ! event.target.validity.valid ) {\n\t\t\twasDirtyOnBlur.current = true;\n\t\t\thandleOnCommit( event );\n\t\t}\n\t};\n\n\tconst handleOnChange = ( event: ChangeEvent< HTMLInputElement > ) => {\n\t\tconst nextValue = event.target.value;\n\t\tchange( nextValue, event );\n\t};\n\n\tconst handleOnCommit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tconst nextValue = event.currentTarget.value;\n\n\t\ttry {\n\t\t\tonValidate( nextValue );\n\t\t\tcommit( nextValue, event );\n\t\t} catch ( err ) {\n\t\t\tinvalidate( err, event );\n\t\t}\n\t};\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { key } = event;\n\t\tonKeyDown( event );\n\n\t\tswitch ( key ) {\n\t\t\tcase 'ArrowUp':\n\t\t\t\tpressUp( event );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowDown':\n\t\t\t\tpressDown( event );\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tpressEnter( event );\n\n\t\t\t\tif ( isPressEnterToChange ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\thandleOnCommit( event );\n\t\t\t\t}\n\t\t\t\tbreak;\n\n\t\t\tcase 'Escape':\n\t\t\t\tif ( isPressEnterToChange && isDirty ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treset( valueProp, event );\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t}\n\t};\n\n\tconst dragGestureProps = useDrag< PointerEvent< HTMLInputElement > >(\n\t\t( dragProps ) => {\n\t\t\tconst { distance, dragging, event, target } = dragProps;\n\n\t\t\t// The `target` prop always references the `input` element while, by\n\t\t\t// default, the `dragProps.event.target` property would reference the real\n\t\t\t// event target (i.e. any DOM element that the pointer is hovering while\n\t\t\t// dragging). Ensuring that the `target` is always the `input` element\n\t\t\t// allows consumers of `InputControl` (or any higher-level control) to\n\t\t\t// check the input's validity by accessing `event.target.validity.valid`.\n\t\t\tdragProps.event = {\n\t\t\t\t...dragProps.event,\n\t\t\t\ttarget,\n\t\t\t};\n\n\t\t\tif ( ! distance ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tevent.stopPropagation();\n\n\t\t\t/**\n\t\t\t * Quick return if no longer dragging.\n\t\t\t * This prevents unnecessary value calculations.\n\t\t\t */\n\t\t\tif ( ! dragging ) {\n\t\t\t\tonDragEnd( dragProps );\n\t\t\t\tdragEnd( dragProps );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tonDrag( dragProps );\n\t\t\tdrag( dragProps );\n\n\t\t\tif ( ! isDragging ) {\n\t\t\t\tonDragStart( dragProps );\n\t\t\t\tdragStart( dragProps );\n\t\t\t}\n\t\t},\n\t\t{\n\t\t\taxis: dragDirection === 'e' || dragDirection === 'w' ? 'x' : 'y',\n\t\t\tthreshold: dragThreshold,\n\t\t\tenabled: isDragEnabled,\n\t\t\tpointer: { capture: false },\n\t\t}\n\t);\n\n\tconst dragProps = isDragEnabled ? dragGestureProps() : {};\n\t/*\n\t * Works around the odd UA (e.g. Firefox) that does not focus inputs of\n\t * type=number when their spinner arrows are pressed.\n\t */\n\tlet handleOnMouseDown;\n\tif ( type === 'number' ) {\n\t\thandleOnMouseDown = ( event: MouseEvent< HTMLInputElement > ) => {\n\t\t\tprops.onMouseDown?.( event );\n\t\t\tif (\n\t\t\t\tevent.currentTarget !==\n\t\t\t\tevent.currentTarget.ownerDocument.activeElement\n\t\t\t) {\n\t\t\t\tevent.currentTarget.focus();\n\t\t\t}\n\t\t};\n\t}\n\n\treturn (\n\t\t<Input\n\t\t\t{ ...props }\n\t\t\t{ ...dragProps }\n\t\t\tclassName=\"components-input-control__input\"\n\t\t\tdisabled={ disabled }\n\t\t\tdragCursor={ dragCursor }\n\t\t\tisDragging={ isDragging }\n\t\t\tid={ id }\n\t\t\tonBlur={ handleOnBlur }\n\t\t\tonChange={ handleOnChange }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( handleOnKeyDown ) }\n\t\t\tonMouseDown={ handleOnMouseDown }\n\t\t\tref={ ref }\n\t\t\tinputSize={ size }\n\t\t\t// Fallback to `''` to avoid \"uncontrolled to controlled\" warning.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/47250 for details.\n\t\t\tvalue={ value ?? '' }\n\t\t\ttype={ type }\n\t\t/>\n\t);\n}\n\nconst ForwardedComponent = forwardRef( InputField );\n\nexport default ForwardedComponent;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,OAAO,QAAQ,oBAAoB;AAW5C;AACA;AACA;AACA,SAASC,UAAU,EAAEC,MAAM,QAAQ,oBAAoB;AACvD;AACA;AACA;;AAEA,SAASC,aAAa,QAAQ,SAAS;AACvC,SAASC,KAAK,QAAQ,+BAA+B;AACrD,SAASC,2BAA2B,QAAQ,mBAAmB;AAE/D,SAASC,mBAAmB,QAAQ,iCAAiC;AAErE,MAAMC,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,UAAUA,CAClB;EACCC,QAAQ,GAAG,KAAK;EAChBC,aAAa,GAAG,GAAG;EACnBC,aAAa,GAAG,EAAE;EAClBC,EAAE;EACFC,aAAa,GAAG,KAAK;EACrBC,oBAAoB,GAAG,KAAK;EAC5BC,MAAM,GAAGR,IAAI;EACbS,QAAQ,GAAGT,IAAI;EACfU,MAAM,GAAGV,IAAI;EACbW,SAAS,GAAGX,IAAI;EAChBY,WAAW,GAAGZ,IAAI;EAClBa,SAAS,GAAGb,IAAI;EAChBc,UAAU,GAAGd,IAAI;EACjBe,IAAI,GAAG,SAAS;EAChBC,YAAY,GAAKC,KAAU,IAAMA,KAAK;EACtCC,KAAK,EAAEC,SAAS;EAChBC,IAAI;EACJ,GAAGC;AACwD,CAAC,EAC7DC,GAAqC,EACpC;EACD,MAAM;IACL;IACAL,KAAK;IACL;IACAM,MAAM;IACNC,MAAM;IACNC,IAAI;IACJC,OAAO;IACPC,SAAS;IACTC,UAAU;IACVC,SAAS;IACTC,UAAU;IACVC,OAAO;IACPC;EACD,CAAC,GAAGlC,2BAA2B,CAC9BkB,YAAY,EACZ;IACCV,aAAa;IACbY,KAAK,EAAEC,SAAS;IAChBZ;EACD,CAAC,EACDE,QACD,CAAC;EAED,MAAM;IAAES,KAAK;IAAEe,UAAU;IAAEC;EAAQ,CAAC,GAAGjB,KAAK;EAC5C,MAAMkB,cAAc,GAAGxC,MAAM,CAAE,KAAM,CAAC;EAEtC,MAAMyC,UAAU,GAAGxC,aAAa,CAAEqC,UAAU,EAAE9B,aAAc,CAAC;EAE7D,MAAMkC,YAAY,GAAKC,KAAqC,IAAM;IACjE9B,MAAM,CAAE8B,KAAM,CAAC;;IAEf;AACF;AACA;AACA;IACE,IAAKJ,OAAO,IAAI,CAAEI,KAAK,CAACC,MAAM,CAACC,QAAQ,CAACC,KAAK,EAAG;MAC/CN,cAAc,CAACO,OAAO,GAAG,IAAI;MAC7BC,cAAc,CAAEL,KAAM,CAAC;IACxB;EACD,CAAC;EAED,MAAMM,cAAc,GAAKN,KAAsC,IAAM;IACpE,MAAMO,SAAS,GAAGP,KAAK,CAACC,MAAM,CAACrB,KAAK;IACpCK,MAAM,CAAEsB,SAAS,EAAEP,KAAM,CAAC;EAC3B,CAAC;EAED,MAAMK,cAAc,GAAKL,KAAyC,IAAM;IACvE,MAAMO,SAAS,GAAGP,KAAK,CAACQ,aAAa,CAAC5B,KAAK;IAE3C,IAAI;MACHJ,UAAU,CAAE+B,SAAU,CAAC;MACvBrB,MAAM,CAAEqB,SAAS,EAAEP,KAAM,CAAC;IAC3B,CAAC,CAAC,OAAQS,GAAG,EAAG;MACfnB,UAAU,CAAEmB,GAAG,EAAET,KAAM,CAAC;IACzB;EACD,CAAC;EAED,MAAMU,eAAe,GAAKV,KAAwC,IAAM;IACvE,MAAM;MAAEW;IAAI,CAAC,GAAGX,KAAK;IACrBzB,SAAS,CAAEyB,KAAM,CAAC;IAElB,QAASW,GAAG;MACX,KAAK,SAAS;QACblB,OAAO,CAAEO,KAAM,CAAC;QAChB;MAED,KAAK,WAAW;QACfT,SAAS,CAAES,KAAM,CAAC;QAClB;MAED,KAAK,OAAO;QACXR,UAAU,CAAEQ,KAAM,CAAC;QAEnB,IAAK/B,oBAAoB,EAAG;UAC3B+B,KAAK,CAACY,cAAc,CAAC,CAAC;UACtBP,cAAc,CAAEL,KAAM,CAAC;QACxB;QACA;MAED,KAAK,QAAQ;QACZ,IAAK/B,oBAAoB,IAAI2B,OAAO,EAAG;UACtCI,KAAK,CAACY,cAAc,CAAC,CAAC;UACtBlB,KAAK,CAAEb,SAAS,EAAEmB,KAAM,CAAC;QAC1B;QACA;IACF;EACD,CAAC;EAED,MAAMa,gBAAgB,GAAG1D,OAAO,CAC7B2D,SAAS,IAAM;IAChB,MAAM;MAAEC,QAAQ;MAAEC,QAAQ;MAAEhB,KAAK;MAAEC;IAAO,CAAC,GAAGa,SAAS;;IAEvD;IACA;IACA;IACA;IACA;IACA;IACAA,SAAS,CAACd,KAAK,GAAG;MACjB,GAAGc,SAAS,CAACd,KAAK;MAClBC;IACD,CAAC;IAED,IAAK,CAAEc,QAAQ,EAAG;MACjB;IACD;IACAf,KAAK,CAACiB,eAAe,CAAC,CAAC;;IAEvB;AACH;AACA;AACA;IACG,IAAK,CAAED,QAAQ,EAAG;MACjB3C,SAAS,CAAEyC,SAAU,CAAC;MACtB1B,OAAO,CAAE0B,SAAU,CAAC;MACpB;IACD;IAEA1C,MAAM,CAAE0C,SAAU,CAAC;IACnB3B,IAAI,CAAE2B,SAAU,CAAC;IAEjB,IAAK,CAAEnB,UAAU,EAAG;MACnBrB,WAAW,CAAEwC,SAAU,CAAC;MACxBzB,SAAS,CAAEyB,SAAU,CAAC;IACvB;EACD,CAAC,EACD;IACCI,IAAI,EAAErD,aAAa,KAAK,GAAG,IAAIA,aAAa,KAAK,GAAG,GAAG,GAAG,GAAG,GAAG;IAChEsD,SAAS,EAAErD,aAAa;IACxBsD,OAAO,EAAEpD,aAAa;IACtBqD,OAAO,EAAE;MAAEC,OAAO,EAAE;IAAM;EAC3B,CACD,CAAC;EAED,MAAMR,SAAS,GAAG9C,aAAa,GAAG6C,gBAAgB,CAAC,CAAC,GAAG,CAAC,CAAC;EACzD;AACD;AACA;AACA;EACC,IAAIU,iBAAiB;EACrB,IAAKzC,IAAI,KAAK,QAAQ,EAAG;IACxByC,iBAAiB,GAAKvB,KAAqC,IAAM;MAChEjB,KAAK,CAACyC,WAAW,GAAIxB,KAAM,CAAC;MAC5B,IACCA,KAAK,CAACQ,aAAa,KACnBR,KAAK,CAACQ,aAAa,CAACiB,aAAa,CAACC,aAAa,EAC9C;QACD1B,KAAK,CAACQ,aAAa,CAACmB,KAAK,CAAC,CAAC;MAC5B;IACD,CAAC;EACF;EAEA,OACCC,aAAA,CAACrE,KAAK;IAAA,GACAwB,KAAK;IAAA,GACL+B,SAAS;IACde,SAAS,EAAC,iCAAiC;IAC3CjE,QAAQ,EAAGA,QAAU;IACrBkC,UAAU,EAAGA,UAAY;IACzBH,UAAU,EAAGA,UAAY;IACzB5B,EAAE,EAAGA,EAAI;IACTG,MAAM,EAAG6B,YAAc;IACvB5B,QAAQ,EAAGmC,cAAgB;IAC3B/B,SAAS,EAAGd,mBAAmB,CAAEiD,eAAgB,CAAG;IACpDc,WAAW,EAAGD,iBAAmB;IACjCvC,GAAG,EAAGA,GAAK;IACX8C,SAAS,EAAGrD;IACZ;IACA;IAAA;IACAG,KAAK,EAAGA,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAI;IACrBE,IAAI,EAAGA;EAAM,CACb,CAAC;AAEJ;AAEA,MAAMiD,kBAAkB,GAAG3E,UAAU,CAAEO,UAAW,CAAC;AAEnD,eAAeoE,kBAAkB","ignoreList":[]}

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

@@ -10,7 +10,9 @@ export default function Label({
   htmlFor,
   ...props
 }) {
-  if (!children) return null;
+  if (!children) {
+    return null;
+  }
   if (hideLabelFromVision) {
     return createElement(VisuallyHidden, {
       as: "label",

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

@@ -1 +1 @@
-{"version":3,"names":["VisuallyHidden","Label","BaseLabel","LabelWrapper","children","hideLabelFromVision","htmlFor","props","createElement","as"],"sources":["@wordpress/components/src/input-control/label.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '../visually-hidden';\nimport {\n\tLabel as BaseLabel,\n\tLabelWrapper,\n} from './styles/input-control-styles';\nimport type { WordPressComponentProps } from '../context';\nimport type { InputControlLabelProps } from './types';\n\nexport default function Label( {\n\tchildren,\n\thideLabelFromVision,\n\thtmlFor,\n\t...props\n}: WordPressComponentProps< InputControlLabelProps, 'label', false > ) {\n\tif ( ! children ) return null;\n\n\tif ( hideLabelFromVision ) {\n\t\treturn (\n\t\t\t<VisuallyHidden as=\"label\" htmlFor={ htmlFor }>\n\t\t\t\t{ children }\n\t\t\t</VisuallyHidden>\n\t\t);\n\t}\n\n\treturn (\n\t\t<LabelWrapper>\n\t\t\t<BaseLabel htmlFor={ htmlFor } { ...props }>\n\t\t\t\t{ children }\n\t\t\t</BaseLabel>\n\t\t</LabelWrapper>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,cAAc,QAAQ,oBAAoB;AACnD,SACCC,KAAK,IAAIC,SAAS,EAClBC,YAAY,QACN,+BAA+B;AAItC,eAAe,SAASF,KAAKA,CAAE;EAC9BG,QAAQ;EACRC,mBAAmB;EACnBC,OAAO;EACP,GAAGC;AAC+D,CAAC,EAAG;EACtE,IAAK,CAAEH,QAAQ,EAAG,OAAO,IAAI;EAE7B,IAAKC,mBAAmB,EAAG;IAC1B,OACCG,aAAA,CAACR,cAAc;MAACS,EAAE,EAAC,OAAO;MAACH,OAAO,EAAGA;IAAS,GAC3CF,QACa,CAAC;EAEnB;EAEA,OACCI,aAAA,CAACL,YAAY,QACZK,aAAA,CAACN,SAAS;IAACI,OAAO,EAAGA,OAAS;IAAA,GAAMC;EAAK,GACtCH,QACQ,CACE,CAAC;AAEjB","ignoreList":[]}
+{"version":3,"names":["VisuallyHidden","Label","BaseLabel","LabelWrapper","children","hideLabelFromVision","htmlFor","props","createElement","as"],"sources":["@wordpress/components/src/input-control/label.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '../visually-hidden';\nimport {\n\tLabel as BaseLabel,\n\tLabelWrapper,\n} from './styles/input-control-styles';\nimport type { WordPressComponentProps } from '../context';\nimport type { InputControlLabelProps } from './types';\n\nexport default function Label( {\n\tchildren,\n\thideLabelFromVision,\n\thtmlFor,\n\t...props\n}: WordPressComponentProps< InputControlLabelProps, 'label', false > ) {\n\tif ( ! children ) {\n\t\treturn null;\n\t}\n\n\tif ( hideLabelFromVision ) {\n\t\treturn (\n\t\t\t<VisuallyHidden as=\"label\" htmlFor={ htmlFor }>\n\t\t\t\t{ children }\n\t\t\t</VisuallyHidden>\n\t\t);\n\t}\n\n\treturn (\n\t\t<LabelWrapper>\n\t\t\t<BaseLabel htmlFor={ htmlFor } { ...props }>\n\t\t\t\t{ children }\n\t\t\t</BaseLabel>\n\t\t</LabelWrapper>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,cAAc,QAAQ,oBAAoB;AACnD,SACCC,KAAK,IAAIC,SAAS,EAClBC,YAAY,QACN,+BAA+B;AAItC,eAAe,SAASF,KAAKA,CAAE;EAC9BG,QAAQ;EACRC,mBAAmB;EACnBC,OAAO;EACP,GAAGC;AAC+D,CAAC,EAAG;EACtE,IAAK,CAAEH,QAAQ,EAAG;IACjB,OAAO,IAAI;EACZ;EAEA,IAAKC,mBAAmB,EAAG;IAC1B,OACCG,aAAA,CAACR,cAAc;MAACS,EAAE,EAAC,OAAO;MAACH,OAAO,EAAGA;IAAS,GAC3CF,QACa,CAAC;EAEnB;EAEA,OACCI,aAAA,CAACL,YAAY,QACZK,aAAA,CAACN,SAAS;IAACI,OAAO,EAAGA,OAAS;IAAA,GAAMC;EAAK,GACtCH,QACQ,CACE,CAAC;AAEjB","ignoreList":[]}