@wordpress/components 25.15.1-next.79a6196f.0 → 26.0.0

package/build-module/gradient-picker/index.js

@@ -5,7 +5,6 @@ import { createElement } from "react";
 import { __, sprintf } from '@wordpress/i18n';
 import { useInstanceId } from '@wordpress/compose';
 import { useCallback, useMemo } from '@wordpress/element';
-import deprecated from '@wordpress/deprecated';
 
 /**
  * Internal dependencies
@@ -14,7 +13,6 @@ import CircularOptionPicker from '../circular-option-picker';
 import CustomGradientPicker from '../custom-gradient-picker';
 import { VStack } from '../v-stack';
 import { ColorHeading } from '../color-palette/styles';
-import { Spacer } from '../spacer';
 // The Multiple Origin Gradients have a `gradients` property (an array of
 // gradient objects), while Single Origin ones have a `gradient` property.
 const isMultipleOriginObject = obj => Array.isArray(obj.gradients) && !('gradient' in obj);
@@ -155,7 +153,6 @@ function Component(props) {
  *
  *	return (
  *		<GradientPicker
- *			__nextHasNoMargin
  *			value={ gradient }
  *			onChange={ ( currentGradient ) => setGradient( currentGradient ) }
  *			gradients={ [
@@ -185,8 +182,6 @@ function Component(props) {
  *
  */
 export function GradientPicker({
-  /** Start opting into the new margin-free styles that will become the default in a future version. */
-  __nextHasNoMargin = false,
   className,
   gradients = [],
   onChange,
@@ -198,42 +193,24 @@ export function GradientPicker({
   ...additionalProps
 }) {
   const clearGradient = useCallback(() => onChange(undefined), [onChange]);
-  if (!__nextHasNoMargin) {
-    deprecated('Outer margin styles for wp.components.GradientPicker', {
-      since: '6.1',
-      version: '6.4',
-      hint: 'Set the `__nextHasNoMargin` prop to true to start opting into the new styles, which will become the default in a future version'
-    });
-  }
-  const deprecatedMarginSpacerProps = !__nextHasNoMargin ? {
-    marginTop: !gradients.length ? 3 : undefined,
-    marginBottom: !clearable ? 6 : 0
-  } : {};
-  return (
-    // Outmost Spacer wrapper can be removed when deprecation period is over
-    createElement(Spacer, {
-      marginBottom: 0,
-      ...deprecatedMarginSpacerProps
-    }, createElement(VStack, {
-      spacing: gradients.length ? 4 : 0
-    }, !disableCustomGradients && createElement(CustomGradientPicker, {
-      __nextHasNoMargin: true,
-      __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
-      value: value,
-      onChange: onChange
-    }), (gradients.length > 0 || clearable) && createElement(Component, {
-      ...additionalProps,
-      className: className,
-      clearGradient: clearGradient,
-      gradients: gradients,
-      onChange: onChange,
-      value: value,
-      actions: clearable && !disableCustomGradients && createElement(CircularOptionPicker.ButtonAction, {
-        onClick: clearGradient
-      }, __('Clear')),
-      headingLevel: headingLevel
-    })))
-  );
+  return createElement(VStack, {
+    spacing: gradients.length ? 4 : 0
+  }, !disableCustomGradients && createElement(CustomGradientPicker, {
+    __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
+    value: value,
+    onChange: onChange
+  }), (gradients.length > 0 || clearable) && createElement(Component, {
+    ...additionalProps,
+    className: className,
+    clearGradient: clearGradient,
+    gradients: gradients,
+    onChange: onChange,
+    value: value,
+    actions: clearable && !disableCustomGradients && createElement(CircularOptionPicker.ButtonAction, {
+      onClick: clearGradient
+    }, __('Clear')),
+    headingLevel: headingLevel
+  }));
 }
 export default GradientPicker;
 //# sourceMappingURL=index.js.map

package/build-module/gradient-picker/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","sprintf","useInstanceId","useCallback","useMemo","deprecated","CircularOptionPicker","CustomGradientPicker","VStack","ColorHeading","Spacer","isMultipleOriginObject","obj","Array","isArray","gradients","isMultipleOriginArray","arr","length","every","gradientObj","SingleOrigin","className","clearGradient","onChange","value","additionalProps","gradientOptions","map","gradient","name","slug","index","createElement","Option","key","isSelected","tooltipText","style","color","background","onClick","OptionGroup","options","MultipleOrigin","headingLevel","instanceId","spacing","gradientSet","id","level","Component","props","asButtons","loop","actions","ariaLabel","ariaLabelledby","metaProps","_metaProps","GradientPicker","__nextHasNoMargin","clearable","disableCustomGradients","__experimentalIsRenderedInSidebar","undefined","since","version","hint","deprecatedMarginSpacerProps","marginTop","marginBottom","ButtonAction"],"sources":["@wordpress/components/src/gradient-picker/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport CircularOptionPicker from '../circular-option-picker';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from '../color-palette/styles';\nimport { Spacer } from '../spacer';\nimport type {\n\tGradientPickerComponentProps,\n\tPickerProps,\n\tOriginObject,\n\tGradientObject,\n} from './types';\n\n// The Multiple Origin Gradients have a `gradients` property (an array of\n// gradient objects), while Single Origin ones have a `gradient` property.\nconst isMultipleOriginObject = (\n\tobj: Record< string, any >\n): obj is OriginObject =>\n\tArray.isArray( obj.gradients ) && ! ( 'gradient' in obj );\n\nconst isMultipleOriginArray = ( arr: any[] ): arr is OriginObject[] => {\n\treturn (\n\t\tarr.length > 0 &&\n\t\tarr.every( ( gradientObj ) => isMultipleOriginObject( gradientObj ) )\n\t);\n};\n\nfunction SingleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\t...additionalProps\n}: PickerProps< GradientObject > ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn gradients.map( ( { gradient, name, slug }, index ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ slug }\n\t\t\t\tvalue={ gradient }\n\t\t\t\tisSelected={ value === gradient }\n\t\t\t\ttooltipText={\n\t\t\t\t\tname ||\n\t\t\t\t\t// translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\tsprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t\tstyle={ { color: 'rgba( 0,0,0,0 )', background: gradient } }\n\t\t\t\tonClick={\n\t\t\t\t\tvalue === gradient\n\t\t\t\t\t\t? clearGradient\n\t\t\t\t\t\t: () => onChange( gradient, index )\n\t\t\t\t}\n\t\t\t\taria-label={\n\t\t\t\t\tname\n\t\t\t\t\t\t? // translators: %s: The name of the gradient e.g: \"Angular red to blue\".\n\t\t\t\t\t\t  sprintf( __( 'Gradient: %s' ), name )\n\t\t\t\t\t\t: // translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\t\t  sprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t/>\n\t\t) );\n\t}, [ gradients, value, onChange, clearGradient ] );\n\treturn (\n\t\t<CircularOptionPicker.OptionGroup\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\t{ ...additionalProps }\n\t\t/>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\theadingLevel,\n}: PickerProps< OriginObject > ) {\n\tconst instanceId = useInstanceId( MultipleOrigin );\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ gradients.map( ( { name, gradients: gradientSet }, index ) => {\n\t\t\t\tconst id = `color-palette-${ instanceId }-${ index }`;\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading level={ headingLevel } id={ id }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</ColorHeading>\n\t\t\t\t\t\t<SingleOrigin\n\t\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\t\tgradients={ gradientSet }\n\t\t\t\t\t\t\tonChange={ ( gradient ) =>\n\t\t\t\t\t\t\t\tonChange( gradient, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\taria-labelledby={ id }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nfunction Component( props: PickerProps< any > ) {\n\tconst {\n\t\tasButtons,\n\t\tloop,\n\t\tactions,\n\t\theadingLevel,\n\t\t'aria-label': ariaLabel,\n\t\t'aria-labelledby': ariaLabelledby,\n\t\t...additionalProps\n\t} = props;\n\tconst options = isMultipleOriginArray( props.gradients ) ? (\n\t\t<MultipleOrigin headingLevel={ headingLevel } { ...additionalProps } />\n\t) : (\n\t\t<SingleOrigin { ...additionalProps } />\n\t);\n\n\tlet metaProps:\n\t\t| { asButtons: false; loop?: boolean; 'aria-label': string }\n\t\t| { asButtons: false; loop?: boolean; 'aria-labelledby': string }\n\t\t| { asButtons: true };\n\n\tif ( asButtons ) {\n\t\tmetaProps = { asButtons: true };\n\t} else {\n\t\tconst _metaProps: { asButtons: false; loop?: boolean } = {\n\t\t\tasButtons: false,\n\t\t\tloop,\n\t\t};\n\n\t\tif ( ariaLabel ) {\n\t\t\tmetaProps = { ..._metaProps, 'aria-label': ariaLabel };\n\t\t} else if ( ariaLabelledby ) {\n\t\t\tmetaProps = {\n\t\t\t\t..._metaProps,\n\t\t\t\t'aria-labelledby': ariaLabelledby,\n\t\t\t};\n\t\t} else {\n\t\t\tmetaProps = {\n\t\t\t\t..._metaProps,\n\t\t\t\t'aria-label': __( 'Custom color picker.' ),\n\t\t\t};\n\t\t}\n\t}\n\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\t{ ...metaProps }\n\t\t\tactions={ actions }\n\t\t\toptions={ options }\n\t\t/>\n\t);\n}\n\n/**\n *  GradientPicker is a React component that renders a color gradient picker to\n * define a multi step gradient. There's either a _linear_ or a _radial_ type\n * available.\n *\n * ```jsx\n *import { GradientPicker } from '@wordpress/components';\n *import { useState } from '@wordpress/element';\n *\n *const myGradientPicker = () => {\n *\tconst [ gradient, setGradient ] = useState( null );\n *\n *\treturn (\n *\t\t<GradientPicker\n *\t\t\t__nextHasNoMargin\n *\t\t\tvalue={ gradient }\n *\t\t\tonChange={ ( currentGradient ) => setGradient( currentGradient ) }\n *\t\t\tgradients={ [\n *\t\t\t\t{\n *\t\t\t\t\tname: 'JShine',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)',\n *\t\t\t\t\tslug: 'jshine',\n *\t\t\t\t},\n *\t\t\t\t{\n *\t\t\t\t\tname: 'Moonlit Asteroid',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)',\n *\t\t\t\t\tslug: 'moonlit-asteroid',\n *\t\t\t\t},\n *\t\t\t\t{\n *\t\t\t\t\tname: 'Rastafarie',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)',\n *\t\t\t\t\tslug: 'rastafari',\n *\t\t\t\t},\n *\t\t\t] }\n *\t\t/>\n *\t);\n *};\n *```\n *\n */\nexport function GradientPicker( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMargin = false,\n\tclassName,\n\tgradients = [],\n\tonChange,\n\tvalue,\n\tclearable = true,\n\tdisableCustomGradients = false,\n\t__experimentalIsRenderedInSidebar,\n\theadingLevel = 2,\n\t...additionalProps\n}: GradientPickerComponentProps ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\n\tif ( ! __nextHasNoMargin ) {\n\t\tdeprecated( 'Outer margin styles for wp.components.GradientPicker', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.4',\n\t\t\thint: 'Set the `__nextHasNoMargin` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t} );\n\t}\n\n\tconst deprecatedMarginSpacerProps = ! __nextHasNoMargin\n\t\t? {\n\t\t\t\tmarginTop: ! gradients.length ? 3 : undefined,\n\t\t\t\tmarginBottom: ! clearable ? 6 : 0,\n\t\t  }\n\t\t: {};\n\n\treturn (\n\t\t// Outmost Spacer wrapper can be removed when deprecation period is over\n\t\t<Spacer marginBottom={ 0 } { ...deprecatedMarginSpacerProps }>\n\t\t\t<VStack spacing={ gradients.length ? 4 : 0 }>\n\t\t\t\t{ ! disableCustomGradients && (\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ ( gradients.length > 0 || clearable ) && (\n\t\t\t\t\t<Component\n\t\t\t\t\t\t{ ...additionalProps }\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\tclearable &&\n\t\t\t\t\t\t\t! disableCustomGradients && (\n\t\t\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\t\t\tonClick={ clearGradient }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t</Spacer>\n\t);\n}\n\nexport default GradientPicker;\n"],"mappings":"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"}
+{"version":3,"names":["__","sprintf","useInstanceId","useCallback","useMemo","CircularOptionPicker","CustomGradientPicker","VStack","ColorHeading","isMultipleOriginObject","obj","Array","isArray","gradients","isMultipleOriginArray","arr","length","every","gradientObj","SingleOrigin","className","clearGradient","onChange","value","additionalProps","gradientOptions","map","gradient","name","slug","index","createElement","Option","key","isSelected","tooltipText","style","color","background","onClick","OptionGroup","options","MultipleOrigin","headingLevel","instanceId","spacing","gradientSet","id","level","Component","props","asButtons","loop","actions","ariaLabel","ariaLabelledby","metaProps","_metaProps","GradientPicker","clearable","disableCustomGradients","__experimentalIsRenderedInSidebar","undefined","ButtonAction"],"sources":["@wordpress/components/src/gradient-picker/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport CircularOptionPicker from '../circular-option-picker';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from '../color-palette/styles';\nimport type {\n\tGradientPickerComponentProps,\n\tPickerProps,\n\tOriginObject,\n\tGradientObject,\n} from './types';\n\n// The Multiple Origin Gradients have a `gradients` property (an array of\n// gradient objects), while Single Origin ones have a `gradient` property.\nconst isMultipleOriginObject = (\n\tobj: Record< string, any >\n): obj is OriginObject =>\n\tArray.isArray( obj.gradients ) && ! ( 'gradient' in obj );\n\nconst isMultipleOriginArray = ( arr: any[] ): arr is OriginObject[] => {\n\treturn (\n\t\tarr.length > 0 &&\n\t\tarr.every( ( gradientObj ) => isMultipleOriginObject( gradientObj ) )\n\t);\n};\n\nfunction SingleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\t...additionalProps\n}: PickerProps< GradientObject > ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn gradients.map( ( { gradient, name, slug }, index ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ slug }\n\t\t\t\tvalue={ gradient }\n\t\t\t\tisSelected={ value === gradient }\n\t\t\t\ttooltipText={\n\t\t\t\t\tname ||\n\t\t\t\t\t// translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\tsprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t\tstyle={ { color: 'rgba( 0,0,0,0 )', background: gradient } }\n\t\t\t\tonClick={\n\t\t\t\t\tvalue === gradient\n\t\t\t\t\t\t? clearGradient\n\t\t\t\t\t\t: () => onChange( gradient, index )\n\t\t\t\t}\n\t\t\t\taria-label={\n\t\t\t\t\tname\n\t\t\t\t\t\t? // translators: %s: The name of the gradient e.g: \"Angular red to blue\".\n\t\t\t\t\t\t  sprintf( __( 'Gradient: %s' ), name )\n\t\t\t\t\t\t: // translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\t\t  sprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t/>\n\t\t) );\n\t}, [ gradients, value, onChange, clearGradient ] );\n\treturn (\n\t\t<CircularOptionPicker.OptionGroup\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\t{ ...additionalProps }\n\t\t/>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\theadingLevel,\n}: PickerProps< OriginObject > ) {\n\tconst instanceId = useInstanceId( MultipleOrigin );\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ gradients.map( ( { name, gradients: gradientSet }, index ) => {\n\t\t\t\tconst id = `color-palette-${ instanceId }-${ index }`;\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading level={ headingLevel } id={ id }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</ColorHeading>\n\t\t\t\t\t\t<SingleOrigin\n\t\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\t\tgradients={ gradientSet }\n\t\t\t\t\t\t\tonChange={ ( gradient ) =>\n\t\t\t\t\t\t\t\tonChange( gradient, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\taria-labelledby={ id }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nfunction Component( props: PickerProps< any > ) {\n\tconst {\n\t\tasButtons,\n\t\tloop,\n\t\tactions,\n\t\theadingLevel,\n\t\t'aria-label': ariaLabel,\n\t\t'aria-labelledby': ariaLabelledby,\n\t\t...additionalProps\n\t} = props;\n\tconst options = isMultipleOriginArray( props.gradients ) ? (\n\t\t<MultipleOrigin headingLevel={ headingLevel } { ...additionalProps } />\n\t) : (\n\t\t<SingleOrigin { ...additionalProps } />\n\t);\n\n\tlet metaProps:\n\t\t| { asButtons: false; loop?: boolean; 'aria-label': string }\n\t\t| { asButtons: false; loop?: boolean; 'aria-labelledby': string }\n\t\t| { asButtons: true };\n\n\tif ( asButtons ) {\n\t\tmetaProps = { asButtons: true };\n\t} else {\n\t\tconst _metaProps: { asButtons: false; loop?: boolean } = {\n\t\t\tasButtons: false,\n\t\t\tloop,\n\t\t};\n\n\t\tif ( ariaLabel ) {\n\t\t\tmetaProps = { ..._metaProps, 'aria-label': ariaLabel };\n\t\t} else if ( ariaLabelledby ) {\n\t\t\tmetaProps = {\n\t\t\t\t..._metaProps,\n\t\t\t\t'aria-labelledby': ariaLabelledby,\n\t\t\t};\n\t\t} else {\n\t\t\tmetaProps = {\n\t\t\t\t..._metaProps,\n\t\t\t\t'aria-label': __( 'Custom color picker.' ),\n\t\t\t};\n\t\t}\n\t}\n\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\t{ ...metaProps }\n\t\t\tactions={ actions }\n\t\t\toptions={ options }\n\t\t/>\n\t);\n}\n\n/**\n *  GradientPicker is a React component that renders a color gradient picker to\n * define a multi step gradient. There's either a _linear_ or a _radial_ type\n * available.\n *\n * ```jsx\n *import { GradientPicker } from '@wordpress/components';\n *import { useState } from '@wordpress/element';\n *\n *const myGradientPicker = () => {\n *\tconst [ gradient, setGradient ] = useState( null );\n *\n *\treturn (\n *\t\t<GradientPicker\n *\t\t\tvalue={ gradient }\n *\t\t\tonChange={ ( currentGradient ) => setGradient( currentGradient ) }\n *\t\t\tgradients={ [\n *\t\t\t\t{\n *\t\t\t\t\tname: 'JShine',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)',\n *\t\t\t\t\tslug: 'jshine',\n *\t\t\t\t},\n *\t\t\t\t{\n *\t\t\t\t\tname: 'Moonlit Asteroid',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)',\n *\t\t\t\t\tslug: 'moonlit-asteroid',\n *\t\t\t\t},\n *\t\t\t\t{\n *\t\t\t\t\tname: 'Rastafarie',\n *\t\t\t\t\tgradient:\n *\t\t\t\t\t\t'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)',\n *\t\t\t\t\tslug: 'rastafari',\n *\t\t\t\t},\n *\t\t\t] }\n *\t\t/>\n *\t);\n *};\n *```\n *\n */\nexport function GradientPicker( {\n\tclassName,\n\tgradients = [],\n\tonChange,\n\tvalue,\n\tclearable = true,\n\tdisableCustomGradients = false,\n\t__experimentalIsRenderedInSidebar,\n\theadingLevel = 2,\n\t...additionalProps\n}: GradientPickerComponentProps ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\n\treturn (\n\t\t<VStack spacing={ gradients.length ? 4 : 0 }>\n\t\t\t{ ! disableCustomGradients && (\n\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t}\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ( gradients.length > 0 || clearable ) && (\n\t\t\t\t<Component\n\t\t\t\t\t{ ...additionalProps }\n\t\t\t\t\tclassName={ className }\n\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tactions={\n\t\t\t\t\t\tclearable &&\n\t\t\t\t\t\t! disableCustomGradients && (\n\t\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\t\tonClick={ clearGradient }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default GradientPicker;\n"],"mappings":"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"}

package/build-module/gradient-picker/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/gradient-picker/types.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { HeadingSize } from '../heading/types';\n\nexport type GradientObject = {\n\tgradient: string;\n\tname: string;\n\tslug: string;\n};\nexport type OriginObject = { name: string; gradients: GradientObject[] };\nexport type GradientsProp = GradientObject[] | OriginObject[];\n\ntype GradientPickerBaseProps = {\n\t/**\n\t * The class name added to the wrapper.\n\t */\n\tclassName?: string;\n\t/**\n\t * The function called when a new gradient has been defined. It is passed to\n\t * the `currentGradient` as an argument.\n\t */\n\tonChange: ( currentGradient: string | undefined ) => void;\n\t/**\n\t * The current value of the gradient. Pass a css gradient string (See default value for example).\n\t * Optionally pass in a `null` value to specify no gradient is currently selected.\n\t *\n\t * @default 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)'\n\t */\n\tvalue?: GradientObject[ 'gradient' ] | null;\n\t/**\n\t * Whether the palette should have a clearing button or not.\n\t *\n\t * @default true\n\t */\n\tclearable?: boolean;\n\t/**\n\t * The heading level. Only applies in cases where gradients are provided\n\t * from multiple origins (ie. when the array passed as the `gradients` prop\n\t * contains two or more items).\n\t *\n\t * @default 2\n\t */\n\theadingLevel?: HeadingSize;\n\t/**\n\t * Whether the control should present as a set of buttons,\n\t * each with its own tab stop.\n\t *\n\t * @default false\n\t */\n\tasButtons?: boolean;\n\t/**\n\t * Prevents keyboard interaction from wrapping around.\n\t * Only used when `asButtons` is not true.\n\t *\n\t * @default true\n\t */\n\tloop?: boolean;\n} & (\n\t| {\n\t\t\t/**\n\t\t\t * A label to identify the purpose of the control.\n\t\t\t *\n\t\t\t * @todo [#54055] Either this or `aria-labelledby` should be required\n\t\t\t */\n\t\t\t'aria-label'?: string;\n\t\t\t'aria-labelledby'?: never;\n\t  }\n\t| {\n\t\t\t/**\n\t\t\t * An ID of an element to provide a label for the control.\n\t\t\t *\n\t\t\t * @todo [#54055] Either this or `aria-label` should be required\n\t\t\t */\n\t\t\t'aria-labelledby'?: string;\n\t\t\t'aria-label'?: never;\n\t  }\n);\n\nexport type GradientPickerComponentProps = GradientPickerBaseProps & {\n\t/**\n\t * An array of objects as predefined gradients displayed above the gradient\n\t * selector. Alternatively, if there are multiple sets (or 'origins') of\n\t * gradients, you can pass an array of objects each with a `name` and a\n\t * `gradients` array which will in turn contain the predefined gradient objects.\n\t *\n\t * @default []\n\t */\n\tgradients?: GradientsProp;\n\t/**\n\t * Start opting in to the new margin-free styles that will become the default\n\t * in a future version, currently scheduled to be WordPress 6.4. (The prop\n\t * can be safely removed once this happens.)\n\t *\n\t * @default false\n\t */\n\t__nextHasNoMargin?: boolean;\n\t/**\n\t * If true, the gradient picker will not be displayed and only defined\n\t * gradients from `gradients` will be shown.\n\t *\n\t * @default false\n\t */\n\tdisableCustomGradients?: boolean;\n\t/**\n\t * Whether this is rendered in the sidebar.\n\t *\n\t * @default false\n\t */\n\t__experimentalIsRenderedInSidebar?: boolean;\n};\n\nexport type PickerProps< TOriginType extends GradientObject | OriginObject > =\n\tGradientPickerBaseProps & {\n\t\tclearGradient: () => void;\n\t\tonChange: (\n\t\t\tcurrentGradient: string | undefined,\n\t\t\tindex: number\n\t\t) => void;\n\t\tactions?: React.ReactNode;\n\t\tgradients: TOriginType[];\n\t};\n"],"mappings":""}
+{"version":3,"names":[],"sources":["@wordpress/components/src/gradient-picker/types.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { HeadingSize } from '../heading/types';\n\nexport type GradientObject = {\n\tgradient: string;\n\tname: string;\n\tslug: string;\n};\nexport type OriginObject = { name: string; gradients: GradientObject[] };\nexport type GradientsProp = GradientObject[] | OriginObject[];\n\ntype GradientPickerBaseProps = {\n\t/**\n\t * The class name added to the wrapper.\n\t */\n\tclassName?: string;\n\t/**\n\t * The function called when a new gradient has been defined. It is passed to\n\t * the `currentGradient` as an argument.\n\t */\n\tonChange: ( currentGradient: string | undefined ) => void;\n\t/**\n\t * The current value of the gradient. Pass a css gradient string (See default value for example).\n\t * Optionally pass in a `null` value to specify no gradient is currently selected.\n\t *\n\t * @default 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)'\n\t */\n\tvalue?: GradientObject[ 'gradient' ] | null;\n\t/**\n\t * Whether the palette should have a clearing button or not.\n\t *\n\t * @default true\n\t */\n\tclearable?: boolean;\n\t/**\n\t * The heading level. Only applies in cases where gradients are provided\n\t * from multiple origins (ie. when the array passed as the `gradients` prop\n\t * contains two or more items).\n\t *\n\t * @default 2\n\t */\n\theadingLevel?: HeadingSize;\n\t/**\n\t * Whether the control should present as a set of buttons,\n\t * each with its own tab stop.\n\t *\n\t * @default false\n\t */\n\tasButtons?: boolean;\n\t/**\n\t * Prevents keyboard interaction from wrapping around.\n\t * Only used when `asButtons` is not true.\n\t *\n\t * @default true\n\t */\n\tloop?: boolean;\n} & (\n\t| {\n\t\t\t/**\n\t\t\t * A label to identify the purpose of the control.\n\t\t\t *\n\t\t\t * @todo [#54055] Either this or `aria-labelledby` should be required\n\t\t\t */\n\t\t\t'aria-label'?: string;\n\t\t\t'aria-labelledby'?: never;\n\t  }\n\t| {\n\t\t\t/**\n\t\t\t * An ID of an element to provide a label for the control.\n\t\t\t *\n\t\t\t * @todo [#54055] Either this or `aria-label` should be required\n\t\t\t */\n\t\t\t'aria-labelledby'?: string;\n\t\t\t'aria-label'?: never;\n\t  }\n);\n\nexport type GradientPickerComponentProps = GradientPickerBaseProps & {\n\t/**\n\t * An array of objects as predefined gradients displayed above the gradient\n\t * selector. Alternatively, if there are multiple sets (or 'origins') of\n\t * gradients, you can pass an array of objects each with a `name` and a\n\t * `gradients` array which will in turn contain the predefined gradient objects.\n\t *\n\t * @default []\n\t */\n\tgradients?: GradientsProp;\n\t/**\n\t * Start opting in to the new margin-free styles that will become the default\n\t * in a future version, currently scheduled to be WordPress 6.4. (The prop\n\t * can be safely removed once this happens.)\n\t *\n\t * @default false\n\t * @deprecated Default behavior since WP 6.5. Prop can be safely removed.\n\t * @ignore\n\t */\n\t__nextHasNoMargin?: boolean;\n\t/**\n\t * If true, the gradient picker will not be displayed and only defined\n\t * gradients from `gradients` will be shown.\n\t *\n\t * @default false\n\t */\n\tdisableCustomGradients?: boolean;\n\t/**\n\t * Whether this is rendered in the sidebar.\n\t *\n\t * @default false\n\t */\n\t__experimentalIsRenderedInSidebar?: boolean;\n};\n\nexport type PickerProps< TOriginType extends GradientObject | OriginObject > =\n\tGradientPickerBaseProps & {\n\t\tclearGradient: () => void;\n\t\tonChange: (\n\t\t\tcurrentGradient: string | undefined,\n\t\t\tindex: number\n\t\t) => void;\n\t\tactions?: React.ReactNode;\n\t\tgradients: TOriginType[];\n\t};\n"],"mappings":""}

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

@@ -9,12 +9,14 @@ import { memo } from '@wordpress/element';
 import { BackdropUI } from './styles/input-control-styles';
 function Backdrop({
   disabled = false,
+  isBorderless = false,
   isFocused = false
 }) {
   return createElement(BackdropUI, {
     "aria-hidden": "true",
     className: "components-input-control__backdrop",
     disabled: disabled,
+    isBorderless: isBorderless,
     isFocused: isFocused
   });
 }

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

@@ -1 +1 @@
-{"version":3,"names":["memo","BackdropUI","Backdrop","disabled","isFocused","createElement","className","MemoizedBackdrop"],"sources":["@wordpress/components/src/input-control/backdrop.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { memo } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport { BackdropUI } from './styles/input-control-styles';\n\nfunction Backdrop( { disabled = false, isFocused = false } ) {\n\treturn (\n\t\t<BackdropUI\n\t\t\taria-hidden=\"true\"\n\t\t\tclassName=\"components-input-control__backdrop\"\n\t\t\tdisabled={ disabled }\n\t\t\tisFocused={ isFocused }\n\t\t/>\n\t);\n}\n\nconst MemoizedBackdrop = memo( Backdrop );\n\nexport default MemoizedBackdrop;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,IAAI,QAAQ,oBAAoB;AACzC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,+BAA+B;AAE1D,SAASC,QAAQA,CAAE;EAAEC,QAAQ,GAAG,KAAK;EAAEC,SAAS,GAAG;AAAM,CAAC,EAAG;EAC5D,OACCC,aAAA,CAACJ,UAAU;IACV,eAAY,MAAM;IAClBK,SAAS,EAAC,oCAAoC;IAC9CH,QAAQ,EAAGA,QAAU;IACrBC,SAAS,EAAGA;EAAW,CACvB,CAAC;AAEJ;AAEA,MAAMG,gBAAgB,GAAGP,IAAI,CAAEE,QAAS,CAAC;AAEzC,eAAeK,gBAAgB"}
+{"version":3,"names":["memo","BackdropUI","Backdrop","disabled","isBorderless","isFocused","createElement","className","MemoizedBackdrop"],"sources":["@wordpress/components/src/input-control/backdrop.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { memo } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport { BackdropUI } from './styles/input-control-styles';\n\nfunction Backdrop( {\n\tdisabled = false,\n\tisBorderless = false,\n\tisFocused = false,\n} ) {\n\treturn (\n\t\t<BackdropUI\n\t\t\taria-hidden=\"true\"\n\t\t\tclassName=\"components-input-control__backdrop\"\n\t\t\tdisabled={ disabled }\n\t\t\tisBorderless={ isBorderless }\n\t\t\tisFocused={ isFocused }\n\t\t/>\n\t);\n}\n\nconst MemoizedBackdrop = memo( Backdrop );\n\nexport default MemoizedBackdrop;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,IAAI,QAAQ,oBAAoB;AACzC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,+BAA+B;AAE1D,SAASC,QAAQA,CAAE;EAClBC,QAAQ,GAAG,KAAK;EAChBC,YAAY,GAAG,KAAK;EACpBC,SAAS,GAAG;AACb,CAAC,EAAG;EACH,OACCC,aAAA,CAACL,UAAU;IACV,eAAY,MAAM;IAClBM,SAAS,EAAC,oCAAoC;IAC9CJ,QAAQ,EAAGA,QAAU;IACrBC,YAAY,EAAGA,YAAc;IAC7BC,SAAS,EAAGA;EAAW,CACvB,CAAC;AAEJ;AAEA,MAAMG,gBAAgB,GAAGR,IAAI,CAAEE,QAAS,CAAC;AAEzC,eAAeM,gBAAgB"}

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

@@ -46,7 +46,7 @@ export function UnforwardedInputControl(props, ref) {
     suffix,
     value,
     ...restProps
-  } = useDeprecated36pxDefaultSizeProp(props, 'wp.components.InputControl', '6.4');
+  } = useDeprecated36pxDefaultSizeProp(props);
   const [isFocused, setIsFocused] = useState(false);
   const id = useUniqueId(idProp);
   const classes = classNames('components-input-control', className);

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

@@ -1 +1 @@
-{"version":3,"names":["classNames","useInstanceId","useState","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","isFocused","setIsFocused","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 { useState, 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 >(\n\t\tprops,\n\t\t'wp.components.InputControl',\n\t\t'6.4'\n\t);\n\n\tconst [ isFocused, setIsFocused ] = useState( false );\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\tisFocused={ isFocused }\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\tisFocused={ isFocused }\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\tsetIsFocused={ setIsFocused }\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 '@wordpress/compose';\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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"}
+{"version":3,"names":["classNames","useInstanceId","useState","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","isFocused","setIsFocused","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 { useState, 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 [ isFocused, setIsFocused ] = useState( false );\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\tisFocused={ isFocused }\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\tisFocused={ isFocused }\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\tsetIsFocused={ setIsFocused }\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 '@wordpress/compose';\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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"}

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

@@ -7,7 +7,7 @@ import { createElement } from "react";
  * WordPress dependencies
  */
 import { useInstanceId } from '@wordpress/compose';
-import { forwardRef, useMemo } from '@wordpress/element';
+import { useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -15,7 +15,7 @@ import { forwardRef, useMemo } from '@wordpress/element';
 import Backdrop from './backdrop';
 import Label from './label';
 import { Container, Root, Prefix, Suffix, getSizeConfig } from './styles/input-control-styles';
-import { ContextSystemProvider } from '../context';
+import { ContextSystemProvider, contextConnect, useContextSystem } from '../context';
 import { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';
 function useUniqueId(idProp) {
   const instanceId = useInstanceId(InputBase);
@@ -53,13 +53,14 @@ export function InputBase(props, ref) {
     hideLabelFromVision = false,
     labelPosition,
     id: idProp,
+    isBorderless = false,
     isFocused = false,
     label,
     prefix,
     size = 'default',
     suffix,
     ...restProps
-  } = useDeprecated36pxDefaultSizeProp(props, 'wp.components.InputBase', '6.4');
+  } = useDeprecated36pxDefaultSizeProp(useContextSystem(props, 'InputBase'));
   const id = useUniqueId(idProp);
   const hideLabel = hideLabelFromVision || !label;
   const {
@@ -108,9 +109,10 @@ export function InputBase(props, ref) {
       className: "components-input-control__suffix"
     }, suffix)), createElement(Backdrop, {
       disabled: disabled,
+      isBorderless: isBorderless,
       isFocused: isFocused
     })))
   );
 }
-export default forwardRef(InputBase);
+export default contextConnect(InputBase, 'InputBase');
 //# sourceMappingURL=input-base.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["useInstanceId","forwardRef","useMemo","Backdrop","Label","Container","Root","Prefix","Suffix","getSizeConfig","ContextSystemProvider","useDeprecated36pxDefaultSizeProp","useUniqueId","idProp","instanceId","InputBase","id","getUIFlexProps","labelPosition","props","direction","expanded","gap","justify","ref","__next40pxDefaultSize","__unstableInputWidth","children","className","disabled","hideLabelFromVision","isFocused","label","prefix","size","suffix","restProps","hideLabel","paddingLeft","paddingRight","inputSize","prefixSuffixContextValue","InputControlPrefixWrapper","InputControlSuffixWrapper","createElement","htmlFor","value"],"sources":["@wordpress/components/src/input-control/input-base.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Backdrop from './backdrop';\nimport Label from './label';\nimport {\n\tContainer,\n\tRoot,\n\tPrefix,\n\tSuffix,\n\tgetSizeConfig,\n} from './styles/input-control-styles';\nimport type { InputBaseProps, LabelPosition } from './types';\nimport type { WordPressComponentProps } from '../context';\nimport { ContextSystemProvider } from '../context';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( InputBase );\n\tconst id = `input-base-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\n// Adapter to map props for the new ui/flex component.\nfunction getUIFlexProps( labelPosition?: LabelPosition ) {\n\tconst props: {\n\t\tdirection?: string;\n\t\tgap?: number;\n\t\tjustify?: string;\n\t\texpanded?: boolean;\n\t} = {};\n\tswitch ( labelPosition ) {\n\t\tcase 'top':\n\t\t\tprops.direction = 'column';\n\t\t\tprops.expanded = false;\n\t\t\tprops.gap = 0;\n\t\t\tbreak;\n\t\tcase 'bottom':\n\t\t\tprops.direction = 'column-reverse';\n\t\t\tprops.expanded = false;\n\t\t\tprops.gap = 0;\n\t\t\tbreak;\n\t\tcase 'edge':\n\t\t\tprops.justify = 'space-between';\n\t\t\tbreak;\n\t}\n\n\treturn props;\n}\n\nexport function InputBase(\n\tprops: WordPressComponentProps< InputBaseProps, 'div' >,\n\tref: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\t__unstableInputWidth,\n\t\tchildren,\n\t\tclassName,\n\t\tdisabled = false,\n\t\thideLabelFromVision = false,\n\t\tlabelPosition,\n\t\tid: idProp,\n\t\tisFocused = false,\n\t\tlabel,\n\t\tprefix,\n\t\tsize = 'default',\n\t\tsuffix,\n\t\t...restProps\n\t} = useDeprecated36pxDefaultSizeProp(\n\t\tprops,\n\t\t'wp.components.InputBase',\n\t\t'6.4'\n\t);\n\n\tconst id = useUniqueId( idProp );\n\tconst hideLabel = hideLabelFromVision || ! label;\n\n\tconst { paddingLeft, paddingRight } = getSizeConfig( {\n\t\tinputSize: size,\n\t\t__next40pxDefaultSize,\n\t} );\n\tconst prefixSuffixContextValue = useMemo( () => {\n\t\treturn {\n\t\t\tInputControlPrefixWrapper: { paddingLeft },\n\t\t\tInputControlSuffixWrapper: { paddingRight },\n\t\t};\n\t}, [ paddingLeft, paddingRight ] );\n\n\treturn (\n\t\t// @ts-expect-error The `direction` prop from Flex (FlexDirection) conflicts with legacy SVGAttributes `direction` (string) that come from React intrinsic prop definitions.\n\t\t<Root\n\t\t\t{ ...restProps }\n\t\t\t{ ...getUIFlexProps( labelPosition ) }\n\t\t\tclassName={ className }\n\t\t\tgap={ 2 }\n\t\t\tisFocused={ isFocused }\n\t\t\tlabelPosition={ labelPosition }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t<Label\n\t\t\t\tclassName=\"components-input-control__label\"\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t\thtmlFor={ id }\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</Label>\n\t\t\t<Container\n\t\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\t\tclassName=\"components-input-control__container\"\n\t\t\t\tdisabled={ disabled }\n\t\t\t\thideLabel={ hideLabel }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t>\n\t\t\t\t<ContextSystemProvider value={ prefixSuffixContextValue }>\n\t\t\t\t\t{ prefix && (\n\t\t\t\t\t\t<Prefix className=\"components-input-control__prefix\">\n\t\t\t\t\t\t\t{ prefix }\n\t\t\t\t\t\t</Prefix>\n\t\t\t\t\t) }\n\t\t\t\t\t{ children }\n\t\t\t\t\t{ suffix && (\n\t\t\t\t\t\t<Suffix className=\"components-input-control__suffix\">\n\t\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t\t</Suffix>\n\t\t\t\t\t) }\n\t\t\t\t</ContextSystemProvider>\n\t\t\t\t<Backdrop disabled={ disabled } isFocused={ isFocused } />\n\t\t\t</Container>\n\t\t</Root>\n\t);\n}\n\nexport default forwardRef( InputBase );\n"],"mappings":"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"}
+{"version":3,"names":["useInstanceId","useMemo","Backdrop","Label","Container","Root","Prefix","Suffix","getSizeConfig","ContextSystemProvider","contextConnect","useContextSystem","useDeprecated36pxDefaultSizeProp","useUniqueId","idProp","instanceId","InputBase","id","getUIFlexProps","labelPosition","props","direction","expanded","gap","justify","ref","__next40pxDefaultSize","__unstableInputWidth","children","className","disabled","hideLabelFromVision","isBorderless","isFocused","label","prefix","size","suffix","restProps","hideLabel","paddingLeft","paddingRight","inputSize","prefixSuffixContextValue","InputControlPrefixWrapper","InputControlSuffixWrapper","createElement","htmlFor","value"],"sources":["@wordpress/components/src/input-control/input-base.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Backdrop from './backdrop';\nimport Label from './label';\nimport {\n\tContainer,\n\tRoot,\n\tPrefix,\n\tSuffix,\n\tgetSizeConfig,\n} from './styles/input-control-styles';\nimport type { InputBaseProps, LabelPosition } from './types';\nimport type { WordPressComponentProps } from '../context';\nimport {\n\tContextSystemProvider,\n\tcontextConnect,\n\tuseContextSystem,\n} from '../context';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( InputBase );\n\tconst id = `input-base-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\n// Adapter to map props for the new ui/flex component.\nfunction getUIFlexProps( labelPosition?: LabelPosition ) {\n\tconst props: {\n\t\tdirection?: string;\n\t\tgap?: number;\n\t\tjustify?: string;\n\t\texpanded?: boolean;\n\t} = {};\n\tswitch ( labelPosition ) {\n\t\tcase 'top':\n\t\t\tprops.direction = 'column';\n\t\t\tprops.expanded = false;\n\t\t\tprops.gap = 0;\n\t\t\tbreak;\n\t\tcase 'bottom':\n\t\t\tprops.direction = 'column-reverse';\n\t\t\tprops.expanded = false;\n\t\t\tprops.gap = 0;\n\t\t\tbreak;\n\t\tcase 'edge':\n\t\t\tprops.justify = 'space-between';\n\t\t\tbreak;\n\t}\n\n\treturn props;\n}\n\nexport function InputBase(\n\tprops: WordPressComponentProps< InputBaseProps, 'div' >,\n\tref: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\t__unstableInputWidth,\n\t\tchildren,\n\t\tclassName,\n\t\tdisabled = false,\n\t\thideLabelFromVision = false,\n\t\tlabelPosition,\n\t\tid: idProp,\n\t\tisBorderless = false,\n\t\tisFocused = false,\n\t\tlabel,\n\t\tprefix,\n\t\tsize = 'default',\n\t\tsuffix,\n\t\t...restProps\n\t} = useDeprecated36pxDefaultSizeProp(\n\t\tuseContextSystem( props, 'InputBase' )\n\t);\n\n\tconst id = useUniqueId( idProp );\n\tconst hideLabel = hideLabelFromVision || ! label;\n\n\tconst { paddingLeft, paddingRight } = getSizeConfig( {\n\t\tinputSize: size,\n\t\t__next40pxDefaultSize,\n\t} );\n\tconst prefixSuffixContextValue = useMemo( () => {\n\t\treturn {\n\t\t\tInputControlPrefixWrapper: { paddingLeft },\n\t\t\tInputControlSuffixWrapper: { paddingRight },\n\t\t};\n\t}, [ paddingLeft, paddingRight ] );\n\n\treturn (\n\t\t// @ts-expect-error The `direction` prop from Flex (FlexDirection) conflicts with legacy SVGAttributes `direction` (string) that come from React intrinsic prop definitions.\n\t\t<Root\n\t\t\t{ ...restProps }\n\t\t\t{ ...getUIFlexProps( labelPosition ) }\n\t\t\tclassName={ className }\n\t\t\tgap={ 2 }\n\t\t\tisFocused={ isFocused }\n\t\t\tlabelPosition={ labelPosition }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t<Label\n\t\t\t\tclassName=\"components-input-control__label\"\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t\thtmlFor={ id }\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</Label>\n\t\t\t<Container\n\t\t\t\t__unstableInputWidth={ __unstableInputWidth }\n\t\t\t\tclassName=\"components-input-control__container\"\n\t\t\t\tdisabled={ disabled }\n\t\t\t\thideLabel={ hideLabel }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t>\n\t\t\t\t<ContextSystemProvider value={ prefixSuffixContextValue }>\n\t\t\t\t\t{ prefix && (\n\t\t\t\t\t\t<Prefix className=\"components-input-control__prefix\">\n\t\t\t\t\t\t\t{ prefix }\n\t\t\t\t\t\t</Prefix>\n\t\t\t\t\t) }\n\t\t\t\t\t{ children }\n\t\t\t\t\t{ suffix && (\n\t\t\t\t\t\t<Suffix className=\"components-input-control__suffix\">\n\t\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t\t</Suffix>\n\t\t\t\t\t) }\n\t\t\t\t</ContextSystemProvider>\n\t\t\t\t<Backdrop\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tisBorderless={ isBorderless }\n\t\t\t\t\tisFocused={ isFocused }\n\t\t\t\t/>\n\t\t\t</Container>\n\t\t</Root>\n\t);\n}\n\nexport default contextConnect( InputBase, 'InputBase' );\n"],"mappings":"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"}