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

package/build/box-control/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.LABELS = exports.DEFAULT_VALUES = exports.ALL_SIDES = void 0;
+exports.LABELS = exports.DEFAULT_VALUES = exports.CUSTOM_VALUE_SETTINGS = exports.ALL_SIDES = void 0;
 exports.applyValueToSides = applyValueToSides;
 exports.getAllUnitFallback = getAllUnitFallback;
 exports.getAllValue = getAllValue;
@@ -21,15 +21,130 @@ var _utils = require("../unit-control/utils");
  * Internal dependencies
  */
 
+const CUSTOM_VALUE_SETTINGS = {
+  px: {
+    max: 300,
+    step: 1
+  },
+  '%': {
+    max: 100,
+    step: 1
+  },
+  vw: {
+    max: 100,
+    step: 1
+  },
+  vh: {
+    max: 100,
+    step: 1
+  },
+  em: {
+    max: 10,
+    step: 0.1
+  },
+  rm: {
+    max: 10,
+    step: 0.1
+  },
+  svw: {
+    max: 100,
+    step: 1
+  },
+  lvw: {
+    max: 100,
+    step: 1
+  },
+  dvw: {
+    max: 100,
+    step: 1
+  },
+  svh: {
+    max: 100,
+    step: 1
+  },
+  lvh: {
+    max: 100,
+    step: 1
+  },
+  dvh: {
+    max: 100,
+    step: 1
+  },
+  vi: {
+    max: 100,
+    step: 1
+  },
+  svi: {
+    max: 100,
+    step: 1
+  },
+  lvi: {
+    max: 100,
+    step: 1
+  },
+  dvi: {
+    max: 100,
+    step: 1
+  },
+  vb: {
+    max: 100,
+    step: 1
+  },
+  svb: {
+    max: 100,
+    step: 1
+  },
+  lvb: {
+    max: 100,
+    step: 1
+  },
+  dvb: {
+    max: 100,
+    step: 1
+  },
+  vmin: {
+    max: 100,
+    step: 1
+  },
+  svmin: {
+    max: 100,
+    step: 1
+  },
+  lvmin: {
+    max: 100,
+    step: 1
+  },
+  dvmin: {
+    max: 100,
+    step: 1
+  },
+  vmax: {
+    max: 100,
+    step: 1
+  },
+  svmax: {
+    max: 100,
+    step: 1
+  },
+  lvmax: {
+    max: 100,
+    step: 1
+  },
+  dvmax: {
+    max: 100,
+    step: 1
+  }
+};
+exports.CUSTOM_VALUE_SETTINGS = CUSTOM_VALUE_SETTINGS;
 const LABELS = {
-  all: (0, _i18n.__)('All'),
-  top: (0, _i18n.__)('Top'),
-  bottom: (0, _i18n.__)('Bottom'),
-  left: (0, _i18n.__)('Left'),
-  right: (0, _i18n.__)('Right'),
+  all: (0, _i18n.__)('All sides'),
+  top: (0, _i18n.__)('Top side'),
+  bottom: (0, _i18n.__)('Bottom side'),
+  left: (0, _i18n.__)('Left side'),
+  right: (0, _i18n.__)('Right side'),
   mixed: (0, _i18n.__)('Mixed'),
-  vertical: (0, _i18n.__)('Vertical'),
-  horizontal: (0, _i18n.__)('Horizontal')
+  vertical: (0, _i18n.__)('Top and bottom sides'),
+  horizontal: (0, _i18n.__)('Left and right sides')
 };
 exports.LABELS = LABELS;
 const DEFAULT_VALUES = {

package/build/box-control/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["_i18n","require","_utils","LABELS","all","__","top","bottom","left","right","mixed","vertical","horizontal","exports","DEFAULT_VALUES","undefined","ALL_SIDES","mode","arr","sort","a","b","filter","v","length","pop","getAllValue","values","selectedUnits","availableSides","sides","normalizeSides","parsedQuantitiesAndUnits","map","side","parseQuantityAndUnitFromRawValue","allParsedQuantities","value","_value$","allParsedUnits","commonQuantity","every","commonUnit","_getAllUnitFallback","getAllUnitFallback","join","filteredUnits","Object","Boolean","isValuesMixed","allValue","isMixed","isNaN","parseFloat","isValuesDefined","test","getInitialSide","isLinked","splitOnAxis","initialSide","filteredSides","includes","push","newSides","applyValueToSides","currentValues","newValue","newValues","forEach"],"sources":["@wordpress/components/src/box-control/utils.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport type { BoxControlProps, BoxControlValue } from './types';\n\nexport const LABELS = {\n\tall: __( 'All' ),\n\ttop: __( 'Top' ),\n\tbottom: __( 'Bottom' ),\n\tleft: __( 'Left' ),\n\tright: __( 'Right' ),\n\tmixed: __( 'Mixed' ),\n\tvertical: __( 'Vertical' ),\n\thorizontal: __( 'Horizontal' ),\n};\n\nexport const DEFAULT_VALUES = {\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\n\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ] as const;\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param arr Array of items to check.\n * @return The item with the most occurrences.\n */\nfunction mode< T >( arr: T[] ) {\n\treturn arr\n\t\t.sort(\n\t\t\t( a, b ) =>\n\t\t\t\tarr.filter( ( v ) => v === a ).length -\n\t\t\t\tarr.filter( ( v ) => v === b ).length\n\t\t)\n\t\t.pop();\n}\n\n/**\n * Gets the 'all' input value and unit from values data.\n *\n * @param values         Box values.\n * @param selectedUnits  Box units.\n * @param availableSides Available box sides to evaluate.\n *\n * @return A value + unit for the 'all' input.\n */\nexport function getAllValue(\n\tvalues: BoxControlValue = {},\n\tselectedUnits?: BoxControlValue,\n\tavailableSides: BoxControlProps[ 'sides' ] = ALL_SIDES\n) {\n\tconst sides = normalizeSides( availableSides );\n\tconst parsedQuantitiesAndUnits = sides.map( ( side ) =>\n\t\tparseQuantityAndUnitFromRawValue( values[ side ] )\n\t);\n\tconst allParsedQuantities = parsedQuantitiesAndUnits.map(\n\t\t( value ) => value[ 0 ] ?? ''\n\t);\n\tconst allParsedUnits = parsedQuantitiesAndUnits.map(\n\t\t( value ) => value[ 1 ]\n\t);\n\n\tconst commonQuantity = allParsedQuantities.every(\n\t\t( v ) => v === allParsedQuantities[ 0 ]\n\t)\n\t\t? allParsedQuantities[ 0 ]\n\t\t: '';\n\n\t/**\n\t * The typeof === 'number' check is important. On reset actions, the incoming value\n\t * may be null or an empty string.\n\t *\n\t * Also, the value may also be zero (0), which is considered a valid unit value.\n\t *\n\t * typeof === 'number' is more specific for these cases, rather than relying on a\n\t * simple truthy check.\n\t */\n\tlet commonUnit;\n\tif ( typeof commonQuantity === 'number' ) {\n\t\tcommonUnit = mode( allParsedUnits );\n\t} else {\n\t\t// Set meaningful unit selection if no commonQuantity and user has previously\n\t\t// selected units without assigning values while controls were unlinked.\n\t\tcommonUnit =\n\t\t\tgetAllUnitFallback( selectedUnits ) ?? mode( allParsedUnits );\n\t}\n\n\treturn [ commonQuantity, commonUnit ].join( '' );\n}\n\n/**\n * Determine the most common unit selection to use as a fallback option.\n *\n * @param selectedUnits Current unit selections for individual sides.\n * @return  Most common unit selection.\n */\nexport function getAllUnitFallback( selectedUnits?: BoxControlValue ) {\n\tif ( ! selectedUnits || typeof selectedUnits !== 'object' ) {\n\t\treturn undefined;\n\t}\n\n\tconst filteredUnits = Object.values( selectedUnits ).filter( Boolean );\n\n\treturn mode( filteredUnits );\n}\n\n/**\n * Checks to determine if values are mixed.\n *\n * @param values        Box values.\n * @param selectedUnits Box units.\n * @param sides         Available box sides to evaluate.\n *\n * @return Whether values are mixed.\n */\nexport function isValuesMixed(\n\tvalues: BoxControlValue = {},\n\tselectedUnits?: BoxControlValue,\n\tsides: BoxControlProps[ 'sides' ] = ALL_SIDES\n) {\n\tconst allValue = getAllValue( values, selectedUnits, sides );\n\tconst isMixed = isNaN( parseFloat( allValue ) );\n\n\treturn isMixed;\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param values Box values.\n *\n * @return  Whether values are mixed.\n */\nexport function isValuesDefined( values?: BoxControlValue ) {\n\treturn (\n\t\tvalues !== undefined &&\n\t\tObject.values( values ).filter(\n\t\t\t// Switching units when input is empty causes values only\n\t\t\t// containing units. This gives false positive on mixed values\n\t\t\t// unless filtered.\n\t\t\t( value ) => !! value && /\\d/.test( value )\n\t\t).length > 0\n\t);\n}\n\n/**\n * Get initial selected side, factoring in whether the sides are linked,\n * and whether the vertical / horizontal directions are grouped via splitOnAxis.\n *\n * @param isLinked    Whether the box control's fields are linked.\n * @param splitOnAxis Whether splitting by horizontal or vertical axis.\n * @return The initial side.\n */\nexport function getInitialSide( isLinked: boolean, splitOnAxis: boolean ) {\n\tlet initialSide: keyof typeof LABELS = 'all';\n\n\tif ( ! isLinked ) {\n\t\tinitialSide = splitOnAxis ? 'vertical' : 'top';\n\t}\n\n\treturn initialSide;\n}\n\n/**\n * Normalizes provided sides configuration to an array containing only top,\n * right, bottom and left. This essentially just maps `horizontal` or `vertical`\n * to their appropriate sides to facilitate correctly determining value for\n * all input control.\n *\n * @param sides Available sides for box control.\n * @return Normalized sides configuration.\n */\nexport function normalizeSides( sides: BoxControlProps[ 'sides' ] ) {\n\tconst filteredSides: ( keyof BoxControlValue )[] = [];\n\n\tif ( ! sides?.length ) {\n\t\treturn ALL_SIDES;\n\t}\n\n\tif ( sides.includes( 'vertical' ) ) {\n\t\tfilteredSides.push( ...( [ 'top', 'bottom' ] as const ) );\n\t} else if ( sides.includes( 'horizontal' ) ) {\n\t\tfilteredSides.push( ...( [ 'left', 'right' ] as const ) );\n\t} else {\n\t\tconst newSides = ALL_SIDES.filter( ( side ) => sides.includes( side ) );\n\t\tfilteredSides.push( ...newSides );\n\t}\n\n\treturn filteredSides;\n}\n\n/**\n * Applies a value to an object representing top, right, bottom and left sides\n * while taking into account any custom side configuration.\n *\n * @param currentValues The current values for each side.\n * @param newValue      The value to apply to the sides object.\n * @param sides         Array defining valid sides.\n *\n * @return Object containing the updated values for each side.\n */\nexport function applyValueToSides(\n\tcurrentValues: BoxControlValue,\n\tnewValue?: string,\n\tsides?: BoxControlProps[ 'sides' ]\n): BoxControlValue {\n\tconst newValues = { ...currentValues };\n\n\tif ( sides?.length ) {\n\t\tsides.forEach( ( side ) => {\n\t\t\tif ( side === 'vertical' ) {\n\t\t\t\tnewValues.top = newValue;\n\t\t\t\tnewValues.bottom = newValue;\n\t\t\t} else if ( side === 'horizontal' ) {\n\t\t\t\tnewValues.left = newValue;\n\t\t\t\tnewValues.right = newValue;\n\t\t\t} else {\n\t\t\t\tnewValues[ side ] = newValue;\n\t\t\t}\n\t\t} );\n\t} else {\n\t\tALL_SIDES.forEach( ( side ) => ( newValues[ side ] = newValue ) );\n\t}\n\n\treturn newValues;\n}\n"],"mappings":"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"}
+{"version":3,"names":["_i18n","require","_utils","CUSTOM_VALUE_SETTINGS","px","max","step","vw","vh","em","rm","svw","lvw","dvw","svh","lvh","dvh","vi","svi","lvi","dvi","vb","svb","lvb","dvb","vmin","svmin","lvmin","dvmin","vmax","svmax","lvmax","dvmax","exports","LABELS","all","__","top","bottom","left","right","mixed","vertical","horizontal","DEFAULT_VALUES","undefined","ALL_SIDES","mode","arr","sort","a","b","filter","v","length","pop","getAllValue","values","selectedUnits","availableSides","sides","normalizeSides","parsedQuantitiesAndUnits","map","side","parseQuantityAndUnitFromRawValue","allParsedQuantities","value","_value$","allParsedUnits","commonQuantity","every","commonUnit","_getAllUnitFallback","getAllUnitFallback","join","filteredUnits","Object","Boolean","isValuesMixed","allValue","isMixed","isNaN","parseFloat","isValuesDefined","test","getInitialSide","isLinked","splitOnAxis","initialSide","filteredSides","includes","push","newSides","applyValueToSides","currentValues","newValue","newValues","forEach"],"sources":["@wordpress/components/src/box-control/utils.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport type {\n\tBoxControlProps,\n\tBoxControlValue,\n\tCustomValueUnits,\n} from './types';\n\nexport const CUSTOM_VALUE_SETTINGS: CustomValueUnits = {\n\tpx: { max: 300, step: 1 },\n\t'%': { max: 100, step: 1 },\n\tvw: { max: 100, step: 1 },\n\tvh: { max: 100, step: 1 },\n\tem: { max: 10, step: 0.1 },\n\trm: { max: 10, step: 0.1 },\n\tsvw: { max: 100, step: 1 },\n\tlvw: { max: 100, step: 1 },\n\tdvw: { max: 100, step: 1 },\n\tsvh: { max: 100, step: 1 },\n\tlvh: { max: 100, step: 1 },\n\tdvh: { max: 100, step: 1 },\n\tvi: { max: 100, step: 1 },\n\tsvi: { max: 100, step: 1 },\n\tlvi: { max: 100, step: 1 },\n\tdvi: { max: 100, step: 1 },\n\tvb: { max: 100, step: 1 },\n\tsvb: { max: 100, step: 1 },\n\tlvb: { max: 100, step: 1 },\n\tdvb: { max: 100, step: 1 },\n\tvmin: { max: 100, step: 1 },\n\tsvmin: { max: 100, step: 1 },\n\tlvmin: { max: 100, step: 1 },\n\tdvmin: { max: 100, step: 1 },\n\tvmax: { max: 100, step: 1 },\n\tsvmax: { max: 100, step: 1 },\n\tlvmax: { max: 100, step: 1 },\n\tdvmax: { max: 100, step: 1 },\n};\n\nexport const LABELS = {\n\tall: __( 'All sides' ),\n\ttop: __( 'Top side' ),\n\tbottom: __( 'Bottom side' ),\n\tleft: __( 'Left side' ),\n\tright: __( 'Right side' ),\n\tmixed: __( 'Mixed' ),\n\tvertical: __( 'Top and bottom sides' ),\n\thorizontal: __( 'Left and right sides' ),\n};\n\nexport const DEFAULT_VALUES = {\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\n\nexport const ALL_SIDES = [ 'top', 'right', 'bottom', 'left' ] as const;\n\n/**\n * Gets an items with the most occurrence within an array\n * https://stackoverflow.com/a/20762713\n *\n * @param arr Array of items to check.\n * @return The item with the most occurrences.\n */\nfunction mode< T >( arr: T[] ) {\n\treturn arr\n\t\t.sort(\n\t\t\t( a, b ) =>\n\t\t\t\tarr.filter( ( v ) => v === a ).length -\n\t\t\t\tarr.filter( ( v ) => v === b ).length\n\t\t)\n\t\t.pop();\n}\n\n/**\n * Gets the 'all' input value and unit from values data.\n *\n * @param values         Box values.\n * @param selectedUnits  Box units.\n * @param availableSides Available box sides to evaluate.\n *\n * @return A value + unit for the 'all' input.\n */\nexport function getAllValue(\n\tvalues: BoxControlValue = {},\n\tselectedUnits?: BoxControlValue,\n\tavailableSides: BoxControlProps[ 'sides' ] = ALL_SIDES\n) {\n\tconst sides = normalizeSides( availableSides );\n\tconst parsedQuantitiesAndUnits = sides.map( ( side ) =>\n\t\tparseQuantityAndUnitFromRawValue( values[ side ] )\n\t);\n\tconst allParsedQuantities = parsedQuantitiesAndUnits.map(\n\t\t( value ) => value[ 0 ] ?? ''\n\t);\n\tconst allParsedUnits = parsedQuantitiesAndUnits.map(\n\t\t( value ) => value[ 1 ]\n\t);\n\n\tconst commonQuantity = allParsedQuantities.every(\n\t\t( v ) => v === allParsedQuantities[ 0 ]\n\t)\n\t\t? allParsedQuantities[ 0 ]\n\t\t: '';\n\n\t/**\n\t * The typeof === 'number' check is important. On reset actions, the incoming value\n\t * may be null or an empty string.\n\t *\n\t * Also, the value may also be zero (0), which is considered a valid unit value.\n\t *\n\t * typeof === 'number' is more specific for these cases, rather than relying on a\n\t * simple truthy check.\n\t */\n\tlet commonUnit;\n\tif ( typeof commonQuantity === 'number' ) {\n\t\tcommonUnit = mode( allParsedUnits );\n\t} else {\n\t\t// Set meaningful unit selection if no commonQuantity and user has previously\n\t\t// selected units without assigning values while controls were unlinked.\n\t\tcommonUnit =\n\t\t\tgetAllUnitFallback( selectedUnits ) ?? mode( allParsedUnits );\n\t}\n\n\treturn [ commonQuantity, commonUnit ].join( '' );\n}\n\n/**\n * Determine the most common unit selection to use as a fallback option.\n *\n * @param selectedUnits Current unit selections for individual sides.\n * @return  Most common unit selection.\n */\nexport function getAllUnitFallback( selectedUnits?: BoxControlValue ) {\n\tif ( ! selectedUnits || typeof selectedUnits !== 'object' ) {\n\t\treturn undefined;\n\t}\n\n\tconst filteredUnits = Object.values( selectedUnits ).filter( Boolean );\n\n\treturn mode( filteredUnits );\n}\n\n/**\n * Checks to determine if values are mixed.\n *\n * @param values        Box values.\n * @param selectedUnits Box units.\n * @param sides         Available box sides to evaluate.\n *\n * @return Whether values are mixed.\n */\nexport function isValuesMixed(\n\tvalues: BoxControlValue = {},\n\tselectedUnits?: BoxControlValue,\n\tsides: BoxControlProps[ 'sides' ] = ALL_SIDES\n) {\n\tconst allValue = getAllValue( values, selectedUnits, sides );\n\tconst isMixed = isNaN( parseFloat( allValue ) );\n\n\treturn isMixed;\n}\n\n/**\n * Checks to determine if values are defined.\n *\n * @param values Box values.\n *\n * @return  Whether values are mixed.\n */\nexport function isValuesDefined( values?: BoxControlValue ) {\n\treturn (\n\t\tvalues !== undefined &&\n\t\tObject.values( values ).filter(\n\t\t\t// Switching units when input is empty causes values only\n\t\t\t// containing units. This gives false positive on mixed values\n\t\t\t// unless filtered.\n\t\t\t( value ) => !! value && /\\d/.test( value )\n\t\t).length > 0\n\t);\n}\n\n/**\n * Get initial selected side, factoring in whether the sides are linked,\n * and whether the vertical / horizontal directions are grouped via splitOnAxis.\n *\n * @param isLinked    Whether the box control's fields are linked.\n * @param splitOnAxis Whether splitting by horizontal or vertical axis.\n * @return The initial side.\n */\nexport function getInitialSide( isLinked: boolean, splitOnAxis: boolean ) {\n\tlet initialSide: keyof typeof LABELS = 'all';\n\n\tif ( ! isLinked ) {\n\t\tinitialSide = splitOnAxis ? 'vertical' : 'top';\n\t}\n\n\treturn initialSide;\n}\n\n/**\n * Normalizes provided sides configuration to an array containing only top,\n * right, bottom and left. This essentially just maps `horizontal` or `vertical`\n * to their appropriate sides to facilitate correctly determining value for\n * all input control.\n *\n * @param sides Available sides for box control.\n * @return Normalized sides configuration.\n */\nexport function normalizeSides( sides: BoxControlProps[ 'sides' ] ) {\n\tconst filteredSides: ( keyof BoxControlValue )[] = [];\n\n\tif ( ! sides?.length ) {\n\t\treturn ALL_SIDES;\n\t}\n\n\tif ( sides.includes( 'vertical' ) ) {\n\t\tfilteredSides.push( ...( [ 'top', 'bottom' ] as const ) );\n\t} else if ( sides.includes( 'horizontal' ) ) {\n\t\tfilteredSides.push( ...( [ 'left', 'right' ] as const ) );\n\t} else {\n\t\tconst newSides = ALL_SIDES.filter( ( side ) => sides.includes( side ) );\n\t\tfilteredSides.push( ...newSides );\n\t}\n\n\treturn filteredSides;\n}\n\n/**\n * Applies a value to an object representing top, right, bottom and left sides\n * while taking into account any custom side configuration.\n *\n * @param currentValues The current values for each side.\n * @param newValue      The value to apply to the sides object.\n * @param sides         Array defining valid sides.\n *\n * @return Object containing the updated values for each side.\n */\nexport function applyValueToSides(\n\tcurrentValues: BoxControlValue,\n\tnewValue?: string,\n\tsides?: BoxControlProps[ 'sides' ]\n): BoxControlValue {\n\tconst newValues = { ...currentValues };\n\n\tif ( sides?.length ) {\n\t\tsides.forEach( ( side ) => {\n\t\t\tif ( side === 'vertical' ) {\n\t\t\t\tnewValues.top = newValue;\n\t\t\t\tnewValues.bottom = newValue;\n\t\t\t} else if ( side === 'horizontal' ) {\n\t\t\t\tnewValues.left = newValue;\n\t\t\t\tnewValues.right = newValue;\n\t\t\t} else {\n\t\t\t\tnewValues[ side ] = newValue;\n\t\t\t}\n\t\t} );\n\t} else {\n\t\tALL_SIDES.forEach( ( side ) => ( newValues[ side ] = newValue ) );\n\t}\n\n\treturn newValues;\n}\n"],"mappings":"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"}

package/build/button/index.js

@@ -168,9 +168,9 @@ function UnforwardedButton(props, ref) {
   // Should show the tooltip if...
   const shouldShowTooltip = !trulyDisabled && (
   // An explicit tooltip is passed or...
-  showTooltip && label ||
+  showTooltip && !!label ||
   // There's a shortcut or...
-  shortcut ||
+  !!shortcut ||
   // There's a label and...
   !!label &&
   // The children are empty and...
@@ -202,21 +202,19 @@ function UnforwardedButton(props, ref) {
     ...commonProps
   }, elementChildren);
 
-  // Convert legacy `position` values to be used with the new `placement` prop
-  let computedPlacement;
-  // if `tooltipPosition` is defined, compute value to `placement`
-  if (tooltipPosition !== undefined) {
-    computedPlacement = (0, _utils.positionToPlacement)(tooltipPosition);
-  }
-  if (!shouldShowTooltip) {
-    return (0, _react.createElement)(_react.Fragment, null, element, describedBy && (0, _react.createElement)(_visuallyHidden.VisuallyHidden, null, (0, _react.createElement)("span", {
-      id: descriptionId
-    }, describedBy)));
-  }
-  return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_tooltip.default, {
+  // In order to avoid some React reconciliation issues, we are always rendering
+  // the `Tooltip` component even when `shouldShowTooltip` is `false`.
+  // In order to make sure that the tooltip doesn't show when it shouldn't,
+  // we don't pass the props to the `Tooltip` component.
+  const tooltipProps = shouldShowTooltip ? {
     text: children?.length && describedBy ? describedBy : label,
-    shortcut: shortcut,
-    placement: computedPlacement
+    shortcut,
+    placement: tooltipPosition &&
+    // Convert legacy `position` values to be used with the new `placement` prop
+    (0, _utils.positionToPlacement)(tooltipPosition)
+  } : {};
+  return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_tooltip.default, {
+    ...tooltipProps
   }, element), describedBy && (0, _react.createElement)(_visuallyHidden.VisuallyHidden, null, (0, _react.createElement)("span", {
     id: descriptionId
   }, describedBy)));

package/build/button/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_classnames","_interopRequireDefault","require","_deprecated","_element","_compose","_tooltip","_icon","_visuallyHidden","_utils","disabledEventsOnDisabledButton","useDeprecatedProps","isDefault","isPrimary","isSecondary","isTertiary","isLink","isPressed","isSmall","size","variant","otherProps","computedSize","computedVariant","newProps","_computedSize","_computedVariant","_computedVariant2","_computedVariant3","_computedVariant4","deprecated","since","alternative","version","_computedVariant5","UnforwardedButton","props","ref","__next40pxDefaultSize","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","__experimentalIsFocusable","isFocusable","describedBy","buttonOrAnchorProps","href","target","ariaChecked","ariaPressed","ariaSelected","additionalProps","undefined","instanceId","useInstanceId","Button","hasChildren","Array","isArray","truthyAriaPressedValues","classes","classnames","includes","trulyDisabled","Tag","buttonProps","type","anchorProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","_react","createElement","Fragment","default","element","computedPlacement","positionToPlacement","VisuallyHidden","id","placement","forwardRef","exports","_default"],"sources":["@wordpress/components/src/button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\nimport { positionToPlacement } from '../popover/utils';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tisPressed,\n\tisSmall,\n\tsize,\n\tvariant,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedSize = size;\n\tlet computedVariant = variant;\n\n\tconst newProps: { 'aria-pressed'?: boolean } = {\n\t\t// @TODO Mark `isPressed` as deprecated\n\t\t'aria-pressed': isPressed,\n\t};\n\n\tif ( isSmall ) {\n\t\tcomputedSize ??= 'small';\n\t}\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'Button isDefault prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t\tversion: '6.2',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...newProps,\n\t\t...otherProps,\n\t\tsize: computedSize,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\tsize = 'default',\n\t\ttext,\n\t\tvariant,\n\t\t__experimentalIsFocusable: isFocusable,\n\t\tdescribedBy,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\t'aria-checked': ariaChecked,\n\t\t'aria-pressed': ariaPressed,\n\t\t'aria-selected': ariaSelected,\n\t\t...additionalProps\n\t} = 'href' in buttonOrAnchorProps\n\t\t? buttonOrAnchorProps\n\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst truthyAriaPressedValues: ( typeof ariaPressed )[] = [\n\t\ttrue,\n\t\t'true',\n\t\t'mixed',\n\t];\n\n\tconst classes = classnames( 'components-button', className, {\n\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': size === 'small',\n\t\t'is-compact': size === 'compact',\n\t\t'is-tertiary': variant === 'tertiary',\n\n\t\t'is-pressed': truthyAriaPressedValues.includes( ariaPressed ),\n\t\t'is-pressed-mixed': ariaPressed === 'mixed',\n\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && ( hasChildren || text ),\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! isFocusable;\n\tconst Tag = href !== undefined && ! trulyDisabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-checked': ariaChecked,\n\t\t\t\t\t'aria-pressed': ariaPressed,\n\t\t\t\t\t'aria-selected': ariaSelected,\n\t\t\t  }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tif ( disabled && isFocusable ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tadditionalProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\tshortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = describedBy ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ children }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\t// Convert legacy `position` values to be used with the new `placement` prop\n\tlet computedPlacement;\n\t// if `tooltipPosition` is defined, compute value to `placement`\n\tif ( tooltipPosition !== undefined ) {\n\t\tcomputedPlacement = positionToPlacement( tooltipPosition );\n\t}\n\n\tif ( ! shouldShowTooltip ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ element }\n\t\t\t\t{ describedBy && (\n\t\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip\n\t\t\t\ttext={\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescribedBy\n\t\t\t\t\t\t? describedBy\n\t\t\t\t\t\t: label\n\t\t\t\t}\n\t\t\t\tshortcut={ shortcut }\n\t\t\t\tplacement={ computedPlacement }\n\t\t\t>\n\t\t\t\t{ element }\n\t\t\t</Tooltip>\n\t\t\t{ describedBy && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n *   <Button\n *     variant=\"primary\"\n *     onClick={ handleClick }\n *   >\n *     Click here\n *   </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"],"mappings":"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"}
+{"version":3,"names":["_classnames","_interopRequireDefault","require","_deprecated","_element","_compose","_tooltip","_icon","_visuallyHidden","_utils","disabledEventsOnDisabledButton","useDeprecatedProps","isDefault","isPrimary","isSecondary","isTertiary","isLink","isPressed","isSmall","size","variant","otherProps","computedSize","computedVariant","newProps","_computedSize","_computedVariant","_computedVariant2","_computedVariant3","_computedVariant4","deprecated","since","alternative","version","_computedVariant5","UnforwardedButton","props","ref","__next40pxDefaultSize","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","__experimentalIsFocusable","isFocusable","describedBy","buttonOrAnchorProps","href","target","ariaChecked","ariaPressed","ariaSelected","additionalProps","undefined","instanceId","useInstanceId","Button","hasChildren","Array","isArray","truthyAriaPressedValues","classes","classnames","includes","trulyDisabled","Tag","buttonProps","type","anchorProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","_react","createElement","Fragment","default","element","tooltipProps","placement","positionToPlacement","VisuallyHidden","id","forwardRef","exports","_default"],"sources":["@wordpress/components/src/button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\nimport { positionToPlacement } from '../popover/utils';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tisPressed,\n\tisSmall,\n\tsize,\n\tvariant,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedSize = size;\n\tlet computedVariant = variant;\n\n\tconst newProps: { 'aria-pressed'?: boolean } = {\n\t\t// @TODO Mark `isPressed` as deprecated\n\t\t'aria-pressed': isPressed,\n\t};\n\n\tif ( isSmall ) {\n\t\tcomputedSize ??= 'small';\n\t}\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'Button isDefault prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t\tversion: '6.2',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...newProps,\n\t\t...otherProps,\n\t\tsize: computedSize,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\tsize = 'default',\n\t\ttext,\n\t\tvariant,\n\t\t__experimentalIsFocusable: isFocusable,\n\t\tdescribedBy,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\t'aria-checked': ariaChecked,\n\t\t'aria-pressed': ariaPressed,\n\t\t'aria-selected': ariaSelected,\n\t\t...additionalProps\n\t} = 'href' in buttonOrAnchorProps\n\t\t? buttonOrAnchorProps\n\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst truthyAriaPressedValues: ( typeof ariaPressed )[] = [\n\t\ttrue,\n\t\t'true',\n\t\t'mixed',\n\t];\n\n\tconst classes = classnames( 'components-button', className, {\n\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': size === 'small',\n\t\t'is-compact': size === 'compact',\n\t\t'is-tertiary': variant === 'tertiary',\n\n\t\t'is-pressed': truthyAriaPressedValues.includes( ariaPressed ),\n\t\t'is-pressed-mixed': ariaPressed === 'mixed',\n\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && ( hasChildren || text ),\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! isFocusable;\n\tconst Tag = href !== undefined && ! trulyDisabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-checked': ariaChecked,\n\t\t\t\t\t'aria-pressed': ariaPressed,\n\t\t\t\t\t'aria-selected': ariaSelected,\n\t\t\t  }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tif ( disabled && isFocusable ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tadditionalProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && !! label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\t!! shortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = describedBy ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ children }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\t// In order to avoid some React reconciliation issues, we are always rendering\n\t// the `Tooltip` component even when `shouldShowTooltip` is `false`.\n\t// In order to make sure that the tooltip doesn't show when it shouldn't,\n\t// we don't pass the props to the `Tooltip` component.\n\tconst tooltipProps = shouldShowTooltip\n\t\t? {\n\t\t\t\ttext:\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescribedBy\n\t\t\t\t\t\t? describedBy\n\t\t\t\t\t\t: label,\n\t\t\t\tshortcut,\n\t\t\t\tplacement:\n\t\t\t\t\ttooltipPosition &&\n\t\t\t\t\t// Convert legacy `position` values to be used with the new `placement` prop\n\t\t\t\t\tpositionToPlacement( tooltipPosition ),\n\t\t  }\n\t\t: {};\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip { ...tooltipProps }>{ element }</Tooltip>\n\t\t\t{ describedBy && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n *   <Button\n *     variant=\"primary\"\n *     onClick={ handleClick }\n *   >\n *     Click here\n *   </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"],"mappings":"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"}

package/build/button/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/button/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { Props as IconProps } from '../icon';\nimport type { PopoverProps } from '../popover/types';\nimport type { WordPressComponentProps } from '../context/wordpress-component';\n\nexport type ButtonProps =\n\t| WordPressComponentProps< ButtonAsButtonProps, 'button', false >\n\t| WordPressComponentProps< ButtonAsAnchorProps, 'a', false >;\n\nexport type ButtonAsButtonProps = BaseButtonProps & _ButtonProps;\nexport type ButtonAsAnchorProps = BaseButtonProps & AnchorProps;\n\ntype BaseButtonProps = {\n\t/**\n\t * Start opting into the larger default height that will become the\n\t * default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n\t/**\n\t * The button's children.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * An accessible description for the button.\n\t */\n\tdescribedBy?: string;\n\t/**\n\t * If provided, renders an Icon component inside the button.\n\t */\n\ticon?: IconProps[ 'icon' ];\n\t/**\n\t * If provided with `icon`, sets the position of icon relative to the `text`.\n\t *\n\t * @default 'left'\n\t */\n\ticonPosition?: 'left' | 'right';\n\t/**\n\t * If provided with `icon`, sets the icon size.\n\t * Please refer to the Icon component for more details regarding\n\t * the default value of its `size` prop.\n\t */\n\ticonSize?: IconProps[ 'size' ];\n\t/**\n\t * Indicates activity while a action is being performed.\n\t */\n\tisBusy?: boolean;\n\t/**\n\t * Renders a red text-based button style to indicate destructive behavior.\n\t */\n\tisDestructive?: boolean;\n\t/**\n\t * Renders a pressed button style.\n\t */\n\tisPressed?: boolean;\n\t// TODO: Deprecate officially (add console warning and move to DeprecatedButtonProps).\n\t/**\n\t * Decreases the size of the button.\n\t *\n\t * Deprecated in favor of the `size` prop. If both props are defined, the `size` prop will take precedence.\n\t *\n\t * @deprecated Use the `'small'` value on the `size` prop instead.\n\t */\n\tisSmall?: boolean;\n\t/**\n\t * Sets the `aria-label` of the component, if none is provided.\n\t * Sets the Tooltip content if `showTooltip` is provided.\n\t */\n\tlabel?: string;\n\t/**\n\t * If provided with `showTooltip`, appends the Shortcut label to the tooltip content.\n\t * If an object is provided, it should contain `display` and `ariaLabel` keys.\n\t */\n\tshortcut?: string | { display: string; ariaLabel: string };\n\t/**\n\t * If provided, renders a Tooltip component for the button.\n\t */\n\tshowTooltip?: boolean;\n\t/**\n\t * The size of the button.\n\t *\n\t * - `'default'`: For normal text-label buttons, unless it is a toggle button.\n\t * - `'compact'`: For toggle buttons, icon buttons, and buttons when used in context of either.\n\t * - `'small'`: For icon buttons associated with more advanced or auxiliary features.\n\t *\n\t * If the deprecated `isSmall` prop is also defined, this prop will take precedence.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: 'default' | 'compact' | 'small';\n\t/**\n\t * If provided, displays the given text inside the button. If the button contains children elements, the text is displayed before them.\n\t */\n\ttext?: string;\n\t/**\n\t * If provided with `showTooltip`, sets the position of the tooltip.\n\t * Please refer to the Tooltip component for more details regarding the defaults.\n\t */\n\ttooltipPosition?: PopoverProps[ 'position' ];\n\t/**\n\t * Specifies the button's style.\n\t * The accepted values are:\n\t * 'primary' (the primary button styles)\n\t * 'secondary' (the default button styles)\n\t * 'tertiary' (the text-based button styles)\n\t * 'link' (the link button styles)\n\t */\n\tvariant?: 'primary' | 'secondary' | 'tertiary' | 'link';\n\t/**\n\t * Whether this is focusable.\n\t */\n\t__experimentalIsFocusable?: boolean;\n};\n\ntype _ButtonProps = {\n\t/**\n\t * Whether the button is disabled.\n\t * If `true`, this will force a `button` element to be rendered.\n\t */\n\tdisabled?: boolean;\n};\n\ntype AnchorProps = {\n\t/**\n\t * Whether the button is disabled.\n\t * If `true`, this will force a `button` element to be rendered.\n\t */\n\tdisabled?: false;\n\t/**\n\t * If provided, renders `a` instead of `button`.\n\t */\n\thref: string;\n\t/**\n\t * If provided with `href`, sets the `target` attribute to the `a`.\n\t */\n\ttarget?: string;\n};\n\nexport type DeprecatedButtonProps = {\n\tisDefault?: boolean;\n\tisLink?: boolean;\n\tisPrimary?: boolean;\n\tisSecondary?: boolean;\n\tisTertiary?: boolean;\n};\n\nexport type DeprecatedIconButtonProps = {\n\tlabelPosition: ButtonProps[ 'tooltipPosition' ];\n\tshowTooltip?: boolean;\n\tsize: ButtonProps[ 'iconSize' ];\n\tlabel: ButtonProps[ 'label' ];\n\ttooltip: ButtonProps[ 'label' ];\n};\n"],"mappings":""}
+{"version":3,"names":[],"sources":["@wordpress/components/src/button/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { Props as IconProps } from '../icon';\nimport type { PopoverProps } from '../popover/types';\nimport type { WordPressComponentProps } from '../context/wordpress-component';\n\nexport type ButtonProps =\n\t| WordPressComponentProps< ButtonAsButtonProps, 'button', false >\n\t| WordPressComponentProps< ButtonAsAnchorProps, 'a', false >;\n\nexport type ButtonAsButtonProps = BaseButtonProps & _ButtonProps;\nexport type ButtonAsAnchorProps = BaseButtonProps & AnchorProps;\n\ntype BaseButtonProps = {\n\t/**\n\t * Start opting into the larger default height that will become the\n\t * default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n\t/**\n\t * The button's children.\n\t */\n\tchildren?: ReactNode;\n\t/**\n\t * An accessible description for the button.\n\t */\n\tdescribedBy?: string;\n\t/**\n\t * If provided, renders an Icon component inside the button.\n\t */\n\ticon?: IconProps[ 'icon' ];\n\t/**\n\t * If provided with `icon`, sets the position of icon relative to the `text`.\n\t *\n\t * @default 'left'\n\t */\n\ticonPosition?: 'left' | 'right';\n\t/**\n\t * If provided with `icon`, sets the icon size.\n\t * Please refer to the Icon component for more details regarding\n\t * the default value of its `size` prop.\n\t */\n\ticonSize?: IconProps[ 'size' ];\n\t/**\n\t * Indicates activity while a action is being performed.\n\t */\n\tisBusy?: boolean;\n\t/**\n\t * Renders a red text-based button style to indicate destructive behavior.\n\t */\n\tisDestructive?: boolean;\n\t/**\n\t * Renders a pressed button style.\n\t */\n\tisPressed?: boolean;\n\t// TODO: Deprecate officially (add console warning and move to DeprecatedButtonProps).\n\t/**\n\t * Decreases the size of the button.\n\t *\n\t * Deprecated in favor of the `size` prop. If both props are defined, the `size` prop will take precedence.\n\t *\n\t * @deprecated Use the `'small'` value on the `size` prop instead.\n\t */\n\tisSmall?: boolean;\n\t/**\n\t * Sets the `aria-label` of the component, if none is provided.\n\t * Sets the Tooltip content if `showTooltip` is provided.\n\t */\n\tlabel?: string;\n\t/**\n\t * If provided with `showTooltip`, appends the Shortcut label to the tooltip content.\n\t * If an object is provided, it should contain `display` and `ariaLabel` keys.\n\t */\n\tshortcut?: string | { display: string; ariaLabel: string };\n\t/**\n\t * If provided, renders a Tooltip component for the button.\n\t */\n\tshowTooltip?: boolean;\n\t/**\n\t * The size of the button.\n\t *\n\t * - `'default'`: For normal text-label buttons, unless it is a toggle button.\n\t * - `'compact'`: For toggle buttons, icon buttons, and buttons when used in context of either.\n\t * - `'small'`: For icon buttons associated with more advanced or auxiliary features.\n\t *\n\t * If the deprecated `isSmall` prop is also defined, this prop will take precedence.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: 'default' | 'compact' | 'small';\n\t/**\n\t * If provided, displays the given text inside the button. If the button contains children elements, the text is displayed before them.\n\t */\n\ttext?: string;\n\t/**\n\t * If provided with `showTooltip`, sets the position of the tooltip.\n\t * Please refer to the Tooltip component for more details regarding the defaults.\n\t */\n\ttooltipPosition?: PopoverProps[ 'position' ];\n\t/**\n\t * Specifies the button's style.\n\t * The accepted values are:\n\t * 'primary' (the primary button styles)\n\t * 'secondary' (the default button styles)\n\t * 'tertiary' (the text-based button styles)\n\t * 'link' (the link button styles)\n\t */\n\tvariant?: 'primary' | 'secondary' | 'tertiary' | 'link';\n\t/**\n\t * Whether to keep the button focusable when disabled.\n\t *\n\t * @default false\n\t */\n\t__experimentalIsFocusable?: boolean;\n};\n\ntype _ButtonProps = {\n\t/**\n\t * Whether the button is disabled.\n\t *\n\t * If `true`, this will force a `button` element to be rendered, even when an `href` is given.\n\t */\n\tdisabled?: boolean;\n};\n\ntype AnchorProps = {\n\t/**\n\t * Whether the button is disabled.\n\t *\n\t * If `true`, this will force a `button` element to be rendered, even when an `href` is given.\n\t */\n\tdisabled?: false;\n\t/**\n\t * If provided, renders `a` instead of `button`.\n\t */\n\thref: string;\n\t/**\n\t * If provided with `href`, sets the `target` attribute to the `a`.\n\t */\n\ttarget?: string;\n};\n\nexport type DeprecatedButtonProps = {\n\tisDefault?: boolean;\n\tisLink?: boolean;\n\tisPrimary?: boolean;\n\tisSecondary?: boolean;\n\tisTertiary?: boolean;\n};\n\nexport type DeprecatedIconButtonProps = {\n\tlabelPosition: ButtonProps[ 'tooltipPosition' ];\n\tshowTooltip?: boolean;\n\tsize: ButtonProps[ 'iconSize' ];\n\tlabel: ButtonProps[ 'label' ];\n\ttooltip: ButtonProps[ 'label' ];\n};\n"],"mappings":""}

package/build/color-picker/hsl-input.js

@@ -6,11 +6,16 @@ Object.defineProperty(exports, "__esModule", {
 exports.HslInput = void 0;
 var _react = require("react");
 var _colord = require("colord");
+var _element = require("@wordpress/element");
 var _inputWithSlider = require("./input-with-slider");
 /**
  * External dependencies
  */
 
+/**
+ * WordPress dependencies
+ */
+
 /**
  * Internal dependencies
  */
@@ -20,67 +25,84 @@ const HslInput = ({
   onChange,
   enableAlpha
 }) => {
-  const {
-    h,
-    s,
-    l,
-    a
-  } = color.toHsl();
+  const colorPropHSLA = (0, _element.useMemo)(() => color.toHsl(), [color]);
+  const [internalHSLA, setInternalHSLA] = (0, _element.useState)({
+    ...colorPropHSLA
+  });
+  const isInternalColorSameAsReceivedColor = color.isEqual((0, _colord.colord)(internalHSLA));
+  (0, _element.useEffect)(() => {
+    if (!isInternalColorSameAsReceivedColor) {
+      // Keep internal HSLA color up to date with the received color prop
+      setInternalHSLA(colorPropHSLA);
+    }
+  }, [colorPropHSLA, isInternalColorSameAsReceivedColor]);
+
+  // If the internal color is equal to the received color prop, we can use the
+  // HSLA values from the local state which, compared to the received color prop,
+  // retain more details about the actual H and S values that the user selected,
+  // and thus allow for better UX when interacting with the H and S sliders.
+  const colorValue = isInternalColorSameAsReceivedColor ? internalHSLA : colorPropHSLA;
+  const updateHSLAValue = partialNewValue => {
+    const nextOnChangeValue = (0, _colord.colord)({
+      ...colorValue,
+      ...partialNewValue
+    });
+
+    // Fire `onChange` only if the resulting color is different from the
+    // current one.
+    // Otherwise, update the internal HSLA color to cause a re-render.
+    if (!color.isEqual(nextOnChangeValue)) {
+      onChange(nextOnChangeValue);
+    } else {
+      setInternalHSLA(prevHSLA => ({
+        ...prevHSLA,
+        ...partialNewValue
+      }));
+    }
+  };
   return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_inputWithSlider.InputWithSlider, {
     min: 0,
     max: 359,
     label: "Hue",
     abbreviation: "H",
-    value: h,
+    value: colorValue.h,
     onChange: nextH => {
-      onChange((0, _colord.colord)({
-        h: nextH,
-        s,
-        l,
-        a
-      }));
+      updateHSLAValue({
+        h: nextH
+      });
     }
   }), (0, _react.createElement)(_inputWithSlider.InputWithSlider, {
     min: 0,
     max: 100,
     label: "Saturation",
     abbreviation: "S",
-    value: s,
+    value: colorValue.s,
     onChange: nextS => {
-      onChange((0, _colord.colord)({
-        h,
-        s: nextS,
-        l,
-        a
-      }));
+      updateHSLAValue({
+        s: nextS
+      });
     }
   }), (0, _react.createElement)(_inputWithSlider.InputWithSlider, {
     min: 0,
     max: 100,
     label: "Lightness",
     abbreviation: "L",
-    value: l,
+    value: colorValue.l,
     onChange: nextL => {
-      onChange((0, _colord.colord)({
-        h,
-        s,
-        l: nextL,
-        a
-      }));
+      updateHSLAValue({
+        l: nextL
+      });
     }
   }), enableAlpha && (0, _react.createElement)(_inputWithSlider.InputWithSlider, {
     min: 0,
     max: 100,
     label: "Alpha",
     abbreviation: "A",
-    value: Math.trunc(100 * a),
+    value: Math.trunc(100 * colorValue.a),
     onChange: nextA => {
-      onChange((0, _colord.colord)({
-        h,
-        s,
-        l,
+      updateHSLAValue({
         a: nextA / 100
-      }));
+      });
     }
   }));
 };

package/build/color-picker/hsl-input.js.map

@@ -1 +1 @@
-{"version":3,"names":["_colord","require","_inputWithSlider","HslInput","color","onChange","enableAlpha","h","s","l","a","toHsl","_react","createElement","Fragment","InputWithSlider","min","max","label","abbreviation","value","nextH","colord","nextS","nextL","Math","trunc","nextA","exports"],"sources":["@wordpress/components/src/color-picker/hsl-input.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { colord } from 'colord';\n\n/**\n * Internal dependencies\n */\nimport { InputWithSlider } from './input-with-slider';\nimport type { HslInputProps } from './types';\n\nexport const HslInput = ( { color, onChange, enableAlpha }: HslInputProps ) => {\n\tconst { h, s, l, a } = color.toHsl();\n\n\treturn (\n\t\t<>\n\t\t\t<InputWithSlider\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ 359 }\n\t\t\t\tlabel=\"Hue\"\n\t\t\t\tabbreviation=\"H\"\n\t\t\t\tvalue={ h }\n\t\t\t\tonChange={ ( nextH: number ) => {\n\t\t\t\t\tonChange( colord( { h: nextH, s, l, a } ) );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<InputWithSlider\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ 100 }\n\t\t\t\tlabel=\"Saturation\"\n\t\t\t\tabbreviation=\"S\"\n\t\t\t\tvalue={ s }\n\t\t\t\tonChange={ ( nextS: number ) => {\n\t\t\t\t\tonChange(\n\t\t\t\t\t\tcolord( {\n\t\t\t\t\t\t\th,\n\t\t\t\t\t\t\ts: nextS,\n\t\t\t\t\t\t\tl,\n\t\t\t\t\t\t\ta,\n\t\t\t\t\t\t} )\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<InputWithSlider\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ 100 }\n\t\t\t\tlabel=\"Lightness\"\n\t\t\t\tabbreviation=\"L\"\n\t\t\t\tvalue={ l }\n\t\t\t\tonChange={ ( nextL: number ) => {\n\t\t\t\t\tonChange(\n\t\t\t\t\t\tcolord( {\n\t\t\t\t\t\t\th,\n\t\t\t\t\t\t\ts,\n\t\t\t\t\t\t\tl: nextL,\n\t\t\t\t\t\t\ta,\n\t\t\t\t\t\t} )\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ enableAlpha && (\n\t\t\t\t<InputWithSlider\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tmax={ 100 }\n\t\t\t\t\tlabel=\"Alpha\"\n\t\t\t\t\tabbreviation=\"A\"\n\t\t\t\t\tvalue={ Math.trunc( 100 * a ) }\n\t\t\t\t\tonChange={ ( nextA: number ) => {\n\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\tcolord( {\n\t\t\t\t\t\t\t\th,\n\t\t\t\t\t\t\t\ts,\n\t\t\t\t\t\t\t\tl,\n\t\t\t\t\t\t\t\ta: nextA / 100,\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n};\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAKA,IAAAC,gBAAA,GAAAD,OAAA;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAIO,MAAME,QAAQ,GAAGA,CAAE;EAAEC,KAAK;EAAEC,QAAQ;EAAEC;AAA2B,CAAC,KAAM;EAC9E,MAAM;IAAEC,CAAC;IAAEC,CAAC;IAAEC,CAAC;IAAEC;EAAE,CAAC,GAAGN,KAAK,CAACO,KAAK,CAAC,CAAC;EAEpC,OACC,IAAAC,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAE,QAAA,QACC,IAAAF,MAAA,CAAAC,aAAA,EAACX,gBAAA,CAAAa,eAAe;IACfC,GAAG,EAAG,CAAG;IACTC,GAAG,EAAG,GAAK;IACXC,KAAK,EAAC,KAAK;IACXC,YAAY,EAAC,GAAG;IAChBC,KAAK,EAAGb,CAAG;IACXF,QAAQ,EAAKgB,KAAa,IAAM;MAC/BhB,QAAQ,CAAE,IAAAiB,cAAM,EAAE;QAAEf,CAAC,EAAEc,KAAK;QAAEb,CAAC;QAAEC,CAAC;QAAEC;MAAE,CAAE,CAAE,CAAC;IAC5C;EAAG,CACH,CAAC,EACF,IAAAE,MAAA,CAAAC,aAAA,EAACX,gBAAA,CAAAa,eAAe;IACfC,GAAG,EAAG,CAAG;IACTC,GAAG,EAAG,GAAK;IACXC,KAAK,EAAC,YAAY;IAClBC,YAAY,EAAC,GAAG;IAChBC,KAAK,EAAGZ,CAAG;IACXH,QAAQ,EAAKkB,KAAa,IAAM;MAC/BlB,QAAQ,CACP,IAAAiB,cAAM,EAAE;QACPf,CAAC;QACDC,CAAC,EAAEe,KAAK;QACRd,CAAC;QACDC;MACD,CAAE,CACH,CAAC;IACF;EAAG,CACH,CAAC,EACF,IAAAE,MAAA,CAAAC,aAAA,EAACX,gBAAA,CAAAa,eAAe;IACfC,GAAG,EAAG,CAAG;IACTC,GAAG,EAAG,GAAK;IACXC,KAAK,EAAC,WAAW;IACjBC,YAAY,EAAC,GAAG;IAChBC,KAAK,EAAGX,CAAG;IACXJ,QAAQ,EAAKmB,KAAa,IAAM;MAC/BnB,QAAQ,CACP,IAAAiB,cAAM,EAAE;QACPf,CAAC;QACDC,CAAC;QACDC,CAAC,EAAEe,KAAK;QACRd;MACD,CAAE,CACH,CAAC;IACF;EAAG,CACH,CAAC,EACAJ,WAAW,IACZ,IAAAM,MAAA,CAAAC,aAAA,EAACX,gBAAA,CAAAa,eAAe;IACfC,GAAG,EAAG,CAAG;IACTC,GAAG,EAAG,GAAK;IACXC,KAAK,EAAC,OAAO;IACbC,YAAY,EAAC,GAAG;IAChBC,KAAK,EAAGK,IAAI,CAACC,KAAK,CAAE,GAAG,GAAGhB,CAAE,CAAG;IAC/BL,QAAQ,EAAKsB,KAAa,IAAM;MAC/BtB,QAAQ,CACP,IAAAiB,cAAM,EAAE;QACPf,CAAC;QACDC,CAAC;QACDC,CAAC;QACDC,CAAC,EAAEiB,KAAK,GAAG;MACZ,CAAE,CACH,CAAC;IACF;EAAG,CACH,CAED,CAAC;AAEL,CAAC;AAACC,OAAA,CAAAzB,QAAA,GAAAA,QAAA"}
+{"version":3,"names":["_colord","require","_element","_inputWithSlider","HslInput","color","onChange","enableAlpha","colorPropHSLA","useMemo","toHsl","internalHSLA","setInternalHSLA","useState","isInternalColorSameAsReceivedColor","isEqual","colord","useEffect","colorValue","updateHSLAValue","partialNewValue","nextOnChangeValue","prevHSLA","_react","createElement","Fragment","InputWithSlider","min","max","label","abbreviation","value","h","nextH","s","nextS","l","nextL","Math","trunc","a","nextA","exports"],"sources":["@wordpress/components/src/color-picker/hsl-input.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { colord } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useEffect, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { InputWithSlider } from './input-with-slider';\nimport type { HslInputProps } from './types';\n\nexport const HslInput = ( { color, onChange, enableAlpha }: HslInputProps ) => {\n\tconst colorPropHSLA = useMemo( () => color.toHsl(), [ color ] );\n\n\tconst [ internalHSLA, setInternalHSLA ] = useState( { ...colorPropHSLA } );\n\n\tconst isInternalColorSameAsReceivedColor = color.isEqual(\n\t\tcolord( internalHSLA )\n\t);\n\n\tuseEffect( () => {\n\t\tif ( ! isInternalColorSameAsReceivedColor ) {\n\t\t\t// Keep internal HSLA color up to date with the received color prop\n\t\t\tsetInternalHSLA( colorPropHSLA );\n\t\t}\n\t}, [ colorPropHSLA, isInternalColorSameAsReceivedColor ] );\n\n\t// If the internal color is equal to the received color prop, we can use the\n\t// HSLA values from the local state which, compared to the received color prop,\n\t// retain more details about the actual H and S values that the user selected,\n\t// and thus allow for better UX when interacting with the H and S sliders.\n\tconst colorValue = isInternalColorSameAsReceivedColor\n\t\t? internalHSLA\n\t\t: colorPropHSLA;\n\n\tconst updateHSLAValue = (\n\t\tpartialNewValue: Partial< typeof colorPropHSLA >\n\t) => {\n\t\tconst nextOnChangeValue = colord( {\n\t\t\t...colorValue,\n\t\t\t...partialNewValue,\n\t\t} );\n\n\t\t// Fire `onChange` only if the resulting color is different from the\n\t\t// current one.\n\t\t// Otherwise, update the internal HSLA color to cause a re-render.\n\t\tif ( ! color.isEqual( nextOnChangeValue ) ) {\n\t\t\tonChange( nextOnChangeValue );\n\t\t} else {\n\t\t\tsetInternalHSLA( ( prevHSLA ) => ( {\n\t\t\t\t...prevHSLA,\n\t\t\t\t...partialNewValue,\n\t\t\t} ) );\n\t\t}\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<InputWithSlider\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ 359 }\n\t\t\t\tlabel=\"Hue\"\n\t\t\t\tabbreviation=\"H\"\n\t\t\t\tvalue={ colorValue.h }\n\t\t\t\tonChange={ ( nextH: number ) => {\n\t\t\t\t\tupdateHSLAValue( { h: nextH } );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<InputWithSlider\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ 100 }\n\t\t\t\tlabel=\"Saturation\"\n\t\t\t\tabbreviation=\"S\"\n\t\t\t\tvalue={ colorValue.s }\n\t\t\t\tonChange={ ( nextS: number ) => {\n\t\t\t\t\tupdateHSLAValue( { s: nextS } );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<InputWithSlider\n\t\t\t\tmin={ 0 }\n\t\t\t\tmax={ 100 }\n\t\t\t\tlabel=\"Lightness\"\n\t\t\t\tabbreviation=\"L\"\n\t\t\t\tvalue={ colorValue.l }\n\t\t\t\tonChange={ ( nextL: number ) => {\n\t\t\t\t\tupdateHSLAValue( { l: nextL } );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t{ enableAlpha && (\n\t\t\t\t<InputWithSlider\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tmax={ 100 }\n\t\t\t\t\tlabel=\"Alpha\"\n\t\t\t\t\tabbreviation=\"A\"\n\t\t\t\t\tvalue={ Math.trunc( 100 * colorValue.a ) }\n\t\t\t\t\tonChange={ ( nextA: number ) => {\n\t\t\t\t\t\tupdateHSLAValue( { a: nextA / 100 } );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n};\n"],"mappings":"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"}

package/build/custom-select-control-v2/index.js

@@ -47,7 +47,7 @@ function CustomSelect({
   onChange,
   size = 'default',
   value,
-  renderSelectedValue = defaultRenderSelectedValue,
+  renderSelectedValue,
   ...props
 }) {
   const store = Ariakit.useSelectStore({
@@ -58,6 +58,7 @@ function CustomSelect({
   const {
     value: currentValue
   } = store.useState();
+  const computedRenderSelectedValue = renderSelectedValue !== null && renderSelectedValue !== void 0 ? renderSelectedValue : defaultRenderSelectedValue;
   return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(Styled.CustomSelectLabel, {
     store: store
   }, label), (0, _react.createElement)(Styled.CustomSelectButton, {
@@ -65,7 +66,7 @@ function CustomSelect({
     size: size,
     hasCustomRenderProp: !!renderSelectedValue,
     store: store
-  }, renderSelectedValue(currentValue), (0, _react.createElement)(Ariakit.SelectArrow, null)), (0, _react.createElement)(Styled.CustomSelectPopover, {
+  }, computedRenderSelectedValue(currentValue), (0, _react.createElement)(Ariakit.SelectArrow, null)), (0, _react.createElement)(Styled.CustomSelectPopover, {
     gutter: 12,
     store: store,
     sameWidth: true

package/build/custom-select-control-v2/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_element","_i18n","Styled","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","CustomSelectContext","createContext","undefined","exports","defaultRenderSelectedValue","value","isValueEmpty","Array","isArray","length","__","sprintf","CustomSelect","children","defaultValue","label","onChange","size","renderSelectedValue","props","store","useSelectStore","setValue","nextValue","currentValue","useState","_react","createElement","Fragment","CustomSelectLabel","CustomSelectButton","hasCustomRenderProp","SelectArrow","CustomSelectPopover","gutter","sameWidth","Provider","CustomSelectItem","customSelectContext","useContext","SelectItemCheck"],"sources":["@wordpress/components/src/custom-select-control-v2/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport * as Styled from './styles';\nimport type {\n\tCustomSelectProps,\n\tCustomSelectItemProps,\n\tCustomSelectContext as CustomSelectContextType,\n} from './types';\nimport type { WordPressComponentProps } from '../context';\n\nexport const CustomSelectContext =\n\tcreateContext< CustomSelectContextType >( undefined );\n\nfunction defaultRenderSelectedValue( value: CustomSelectProps[ 'value' ] ) {\n\tconst isValueEmpty = Array.isArray( value )\n\t\t? value.length === 0\n\t\t: value === undefined || value === null;\n\n\tif ( isValueEmpty ) {\n\t\treturn __( 'Select an item' );\n\t}\n\n\tif ( Array.isArray( value ) ) {\n\t\treturn value.length === 1\n\t\t\t? value[ 0 ]\n\t\t\t: // translators: %s: number of items selected (it will always be 2 or more items)\n\t\t\t  sprintf( __( '%s items selected' ), value.length );\n\t}\n\n\treturn value;\n}\n\nexport function CustomSelect( {\n\tchildren,\n\tdefaultValue,\n\tlabel,\n\tonChange,\n\tsize = 'default',\n\tvalue,\n\trenderSelectedValue = defaultRenderSelectedValue,\n\t...props\n}: WordPressComponentProps< CustomSelectProps, 'button', false > ) {\n\tconst store = Ariakit.useSelectStore( {\n\t\tsetValue: ( nextValue ) => onChange?.( nextValue ),\n\t\tdefaultValue,\n\t\tvalue,\n\t} );\n\n\tconst { value: currentValue } = store.useState();\n\n\treturn (\n\t\t<>\n\t\t\t<Styled.CustomSelectLabel store={ store }>\n\t\t\t\t{ label }\n\t\t\t</Styled.CustomSelectLabel>\n\t\t\t<Styled.CustomSelectButton\n\t\t\t\t{ ...props }\n\t\t\t\tsize={ size }\n\t\t\t\thasCustomRenderProp={ !! renderSelectedValue }\n\t\t\t\tstore={ store }\n\t\t\t>\n\t\t\t\t{ renderSelectedValue( currentValue ) }\n\t\t\t\t<Ariakit.SelectArrow />\n\t\t\t</Styled.CustomSelectButton>\n\t\t\t<Styled.CustomSelectPopover gutter={ 12 } store={ store } sameWidth>\n\t\t\t\t<CustomSelectContext.Provider value={ { store } }>\n\t\t\t\t\t{ children }\n\t\t\t\t</CustomSelectContext.Provider>\n\t\t\t</Styled.CustomSelectPopover>\n\t\t</>\n\t);\n}\n\nexport function CustomSelectItem( {\n\tchildren,\n\t...props\n}: WordPressComponentProps< CustomSelectItemProps, 'div', false > ) {\n\tconst customSelectContext = useContext( CustomSelectContext );\n\treturn (\n\t\t<Styled.CustomSelectItem\n\t\t\tstore={ customSelectContext?.store }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children ?? props.value }\n\t\t\t<Ariakit.SelectItemCheck />\n\t\t</Styled.CustomSelectItem>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_element","_i18n","Styled","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","CustomSelectContext","createContext","undefined","exports","defaultRenderSelectedValue","value","isValueEmpty","Array","isArray","length","__","sprintf","CustomSelect","children","defaultValue","label","onChange","size","renderSelectedValue","props","store","useSelectStore","setValue","nextValue","currentValue","useState","computedRenderSelectedValue","_react","createElement","Fragment","CustomSelectLabel","CustomSelectButton","hasCustomRenderProp","SelectArrow","CustomSelectPopover","gutter","sameWidth","Provider","CustomSelectItem","customSelectContext","useContext","SelectItemCheck"],"sources":["@wordpress/components/src/custom-select-control-v2/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport * as Styled from './styles';\nimport type {\n\tCustomSelectProps,\n\tCustomSelectItemProps,\n\tCustomSelectContext as CustomSelectContextType,\n} from './types';\nimport type { WordPressComponentProps } from '../context';\n\nexport const CustomSelectContext =\n\tcreateContext< CustomSelectContextType >( undefined );\n\nfunction defaultRenderSelectedValue( value: CustomSelectProps[ 'value' ] ) {\n\tconst isValueEmpty = Array.isArray( value )\n\t\t? value.length === 0\n\t\t: value === undefined || value === null;\n\n\tif ( isValueEmpty ) {\n\t\treturn __( 'Select an item' );\n\t}\n\n\tif ( Array.isArray( value ) ) {\n\t\treturn value.length === 1\n\t\t\t? value[ 0 ]\n\t\t\t: // translators: %s: number of items selected (it will always be 2 or more items)\n\t\t\t  sprintf( __( '%s items selected' ), value.length );\n\t}\n\n\treturn value;\n}\n\nexport function CustomSelect( {\n\tchildren,\n\tdefaultValue,\n\tlabel,\n\tonChange,\n\tsize = 'default',\n\tvalue,\n\trenderSelectedValue,\n\t...props\n}: WordPressComponentProps< CustomSelectProps, 'button', false > ) {\n\tconst store = Ariakit.useSelectStore( {\n\t\tsetValue: ( nextValue ) => onChange?.( nextValue ),\n\t\tdefaultValue,\n\t\tvalue,\n\t} );\n\n\tconst { value: currentValue } = store.useState();\n\n\tconst computedRenderSelectedValue =\n\t\trenderSelectedValue ?? defaultRenderSelectedValue;\n\n\treturn (\n\t\t<>\n\t\t\t<Styled.CustomSelectLabel store={ store }>\n\t\t\t\t{ label }\n\t\t\t</Styled.CustomSelectLabel>\n\t\t\t<Styled.CustomSelectButton\n\t\t\t\t{ ...props }\n\t\t\t\tsize={ size }\n\t\t\t\thasCustomRenderProp={ !! renderSelectedValue }\n\t\t\t\tstore={ store }\n\t\t\t>\n\t\t\t\t{ computedRenderSelectedValue( currentValue ) }\n\t\t\t\t<Ariakit.SelectArrow />\n\t\t\t</Styled.CustomSelectButton>\n\t\t\t<Styled.CustomSelectPopover gutter={ 12 } store={ store } sameWidth>\n\t\t\t\t<CustomSelectContext.Provider value={ { store } }>\n\t\t\t\t\t{ children }\n\t\t\t\t</CustomSelectContext.Provider>\n\t\t\t</Styled.CustomSelectPopover>\n\t\t</>\n\t);\n}\n\nexport function CustomSelectItem( {\n\tchildren,\n\t...props\n}: WordPressComponentProps< CustomSelectItemProps, 'div', false > ) {\n\tconst customSelectContext = useContext( CustomSelectContext );\n\treturn (\n\t\t<Styled.CustomSelectItem\n\t\t\tstore={ customSelectContext?.store }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children ?? props.value }\n\t\t\t<Ariakit.SelectItemCheck />\n\t\t</Styled.CustomSelectItem>\n\t);\n}\n"],"mappings":"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"}

package/build/slot-fill/bubbles-virtually/use-slot-fills.js

@@ -27,7 +27,7 @@ function useSlotFills(name) {
   });
   // The important bit here is that this call ensures that the hook
   // only causes a re-render if the "fills" of a given slot name
-  // change change, not any fills.
+  // change, not any fills.
   return fills.get(name);
 }
 //# sourceMappingURL=use-slot-fills.js.map

package/build/slot-fill/bubbles-virtually/use-slot-fills.js.map

@@ -1 +1 @@
-{"version":3,"names":["_valtio","require","_element","_slotFillContext","_interopRequireDefault","useSlotFills","name","registry","useContext","SlotFillContext","fills","useSnapshot","sync","get"],"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/use-slot-fills.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { useSnapshot } from 'valtio';\n\n/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\nimport type { SlotKey } from '../types';\n\nexport default function useSlotFills( name: SlotKey ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst fills = useSnapshot( registry.fills, { sync: true } );\n\t// The important bit here is that this call ensures that the hook\n\t// only causes a re-render if the \"fills\" of a given slot name\n\t// change change, not any fills.\n\treturn fills.get( name );\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,gBAAA,GAAAC,sBAAA,CAAAH,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIe,SAASI,YAAYA,CAAEC,IAAa,EAAG;EACrD,MAAMC,QAAQ,GAAG,IAAAC,mBAAU,EAAEC,wBAAgB,CAAC;EAC9C,MAAMC,KAAK,GAAG,IAAAC,mBAAW,EAAEJ,QAAQ,CAACG,KAAK,EAAE;IAAEE,IAAI,EAAE;EAAK,CAAE,CAAC;EAC3D;EACA;EACA;EACA,OAAOF,KAAK,CAACG,GAAG,CAAEP,IAAK,CAAC;AACzB"}
+{"version":3,"names":["_valtio","require","_element","_slotFillContext","_interopRequireDefault","useSlotFills","name","registry","useContext","SlotFillContext","fills","useSnapshot","sync","get"],"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/use-slot-fills.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { useSnapshot } from 'valtio';\n\n/**\n * WordPress dependencies\n */\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './slot-fill-context';\nimport type { SlotKey } from '../types';\n\nexport default function useSlotFills( name: SlotKey ) {\n\tconst registry = useContext( SlotFillContext );\n\tconst fills = useSnapshot( registry.fills, { sync: true } );\n\t// The important bit here is that this call ensures that the hook\n\t// only causes a re-render if the \"fills\" of a given slot name\n\t// change, not any fills.\n\treturn fills.get( name );\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,gBAAA,GAAAC,sBAAA,CAAAH,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAIe,SAASI,YAAYA,CAAEC,IAAa,EAAG;EACrD,MAAMC,QAAQ,GAAG,IAAAC,mBAAU,EAAEC,wBAAgB,CAAC;EAC9C,MAAMC,KAAK,GAAG,IAAAC,mBAAW,EAAEJ,QAAQ,CAACG,KAAK,EAAE;IAAEE,IAAI,EAAE;EAAK,CAAE,CAAC;EAC3D;EACA;EACA;EACA,OAAOF,KAAK,CAACG,GAAG,CAAEP,IAAK,CAAC;AACzB"}