@wordpress/components 23.3.2 → 23.4.0

package/build/focal-point-picker/utils.js

@@ -16,7 +16,7 @@ const VIDEO_EXTENSIONS = ['avi', 'mpg', 'mpeg', 'mov', 'mp4', 'm4v', 'ogg', 'ogv
 /**
  * Gets the extension of a file name.
  *
- * @param  filename The file name.
+ * @param filename The file name.
  * @return  The extension of the file name.
  */
 
@@ -28,7 +28,7 @@ function getExtension() {
 /**
  * Checks if a file is a video.
  *
- * @param  filename The file name.
+ * @param filename The file name.
  * @return Whether the file is a video.
  */
 
@@ -41,7 +41,7 @@ function isVideoType() {
 /**
  * Transforms a fraction value to a percentage value.
  *
- * @param  fraction The fraction value.
+ * @param fraction The fraction value.
  * @return A percentage value.
  */
 

package/build/focal-point-picker/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/focal-point-picker/utils.ts"],"names":["INITIAL_BOUNDS","width","height","VIDEO_EXTENSIONS","getExtension","filename","parts","split","length","isVideoType","startsWith","includes","fractionToPercentage","fraction","Math","round"],"mappings":";;;;;;;;;AAAO,MAAMA,cAAc,GAAG;AAC7BC,EAAAA,KAAK,EAAE,GADsB;AAE7BC,EAAAA,MAAM,EAAE;AAFqB,CAAvB;;AAKP,MAAMC,gBAAgB,GAAG,CACxB,KADwB,EAExB,KAFwB,EAGxB,MAHwB,EAIxB,KAJwB,EAKxB,KALwB,EAMxB,KANwB,EAOxB,KAPwB,EAQxB,KARwB,EASxB,MATwB,EAUxB,KAVwB,CAAzB;AAaA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,YAAT,GAA+C;AAAA,MAAxBC,QAAwB,uEAAb,EAAa;AACrD,QAAMC,KAAK,GAAGD,QAAQ,CAACE,KAAT,CAAgB,GAAhB,CAAd;AACA,SAAOD,KAAK,CAAEA,KAAK,CAACE,MAAN,GAAe,CAAjB,CAAZ;AACA;AAED;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,WAAT,GAAuD;AAAA,MAAjCJ,QAAiC,uEAAd,EAAc;AAC7D,MAAK,CAAEA,QAAP,EAAkB,OAAO,KAAP;AAClB,SACCA,QAAQ,CAACK,UAAT,CAAqB,aAArB,KACAP,gBAAgB,CAACQ,QAAjB,CAA2BP,YAAY,CAAEC,QAAF,CAAvC,CAFD;AAIA;AAED;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASO,oBAAT,CAA+BC,QAA/B,EAA0D;AAChE,SAAOC,IAAI,CAACC,KAAL,CAAYF,QAAQ,GAAG,GAAvB,CAAP;AACA","sourcesContent":["export const INITIAL_BOUNDS = {\n\twidth: 200,\n\theight: 170,\n};\n\nconst VIDEO_EXTENSIONS = [\n\t'avi',\n\t'mpg',\n\t'mpeg',\n\t'mov',\n\t'mp4',\n\t'm4v',\n\t'ogg',\n\t'ogv',\n\t'webm',\n\t'wmv',\n];\n\n/**\n * Gets the extension of a file name.\n *\n * @param  filename The file name.\n * @return  The extension of the file name.\n */\nexport function getExtension( filename = '' ): string {\n\tconst parts = filename.split( '.' );\n\treturn parts[ parts.length - 1 ];\n}\n\n/**\n * Checks if a file is a video.\n *\n * @param  filename The file name.\n * @return Whether the file is a video.\n */\nexport function isVideoType( filename: string = '' ): boolean {\n\tif ( ! filename ) return false;\n\treturn (\n\t\tfilename.startsWith( 'data:video/' ) ||\n\t\tVIDEO_EXTENSIONS.includes( getExtension( filename ) )\n\t);\n}\n\n/**\n * Transforms a fraction value to a percentage value.\n *\n * @param  fraction The fraction value.\n * @return A percentage value.\n */\nexport function fractionToPercentage( fraction: number ): number {\n\treturn Math.round( fraction * 100 );\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/focal-point-picker/utils.ts"],"names":["INITIAL_BOUNDS","width","height","VIDEO_EXTENSIONS","getExtension","filename","parts","split","length","isVideoType","startsWith","includes","fractionToPercentage","fraction","Math","round"],"mappings":";;;;;;;;;AAAO,MAAMA,cAAc,GAAG;AAC7BC,EAAAA,KAAK,EAAE,GADsB;AAE7BC,EAAAA,MAAM,EAAE;AAFqB,CAAvB;;AAKP,MAAMC,gBAAgB,GAAG,CACxB,KADwB,EAExB,KAFwB,EAGxB,MAHwB,EAIxB,KAJwB,EAKxB,KALwB,EAMxB,KANwB,EAOxB,KAPwB,EAQxB,KARwB,EASxB,MATwB,EAUxB,KAVwB,CAAzB;AAaA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,YAAT,GAA+C;AAAA,MAAxBC,QAAwB,uEAAb,EAAa;AACrD,QAAMC,KAAK,GAAGD,QAAQ,CAACE,KAAT,CAAgB,GAAhB,CAAd;AACA,SAAOD,KAAK,CAAEA,KAAK,CAACE,MAAN,GAAe,CAAjB,CAAZ;AACA;AAED;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,WAAT,GAAuD;AAAA,MAAjCJ,QAAiC,uEAAd,EAAc;AAC7D,MAAK,CAAEA,QAAP,EAAkB,OAAO,KAAP;AAClB,SACCA,QAAQ,CAACK,UAAT,CAAqB,aAArB,KACAP,gBAAgB,CAACQ,QAAjB,CAA2BP,YAAY,CAAEC,QAAF,CAAvC,CAFD;AAIA;AAED;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASO,oBAAT,CAA+BC,QAA/B,EAA0D;AAChE,SAAOC,IAAI,CAACC,KAAL,CAAYF,QAAQ,GAAG,GAAvB,CAAP;AACA","sourcesContent":["export const INITIAL_BOUNDS = {\n\twidth: 200,\n\theight: 170,\n};\n\nconst VIDEO_EXTENSIONS = [\n\t'avi',\n\t'mpg',\n\t'mpeg',\n\t'mov',\n\t'mp4',\n\t'm4v',\n\t'ogg',\n\t'ogv',\n\t'webm',\n\t'wmv',\n];\n\n/**\n * Gets the extension of a file name.\n *\n * @param filename The file name.\n * @return  The extension of the file name.\n */\nexport function getExtension( filename = '' ): string {\n\tconst parts = filename.split( '.' );\n\treturn parts[ parts.length - 1 ];\n}\n\n/**\n * Checks if a file is a video.\n *\n * @param filename The file name.\n * @return Whether the file is a video.\n */\nexport function isVideoType( filename: string = '' ): boolean {\n\tif ( ! filename ) return false;\n\treturn (\n\t\tfilename.startsWith( 'data:video/' ) ||\n\t\tVIDEO_EXTENSIONS.includes( getExtension( filename ) )\n\t);\n}\n\n/**\n * Transforms a fraction value to a percentage value.\n *\n * @param fraction The fraction value.\n * @return A percentage value.\n */\nexport function fractionToPercentage( fraction: number ): number {\n\treturn Math.round( fraction * 100 );\n}\n"]}

package/build/font-size-picker/utils.js

@@ -20,7 +20,7 @@ var _unitControl = require("../unit-control");
  * Some themes use css vars for their font sizes, so until we
  * have the way of calculating them don't display them.
  *
- * @param  value The value that is checked.
+ * @param value The value that is checked.
  * @return Whether the value is a simple css value.
  */
 function isSimpleCssValue(value) {
@@ -31,7 +31,7 @@ function isSimpleCssValue(value) {
  * If all of the given font sizes have the same unit (e.g. 'px'), return that
  * unit. Otherwise return null.
  *
- * @param  fontSizes List of font sizes.
+ * @param fontSizes List of font sizes.
  * @return The common unit, or null.
  */
 

package/build/font-size-picker/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/font-size-picker/utils.ts"],"names":["isSimpleCssValue","value","sizeRegex","test","String","getCommonSizeUnit","fontSizes","firstFontSize","otherFontSizes","firstUnit","size","areAllSizesSameUnit","every","fontSize","unit"],"mappings":";;;;;;;;AASA;;AATA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,gBAAT,CACNC,KADM,EAEL;AACD,QAAMC,SAAS,GAAG,gCAAlB;AACA,SAAOA,SAAS,CAACC,IAAV,CAAgBC,MAAM,CAAEH,KAAF,CAAtB,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASI,iBAAT,CAA4BC,SAA5B,EAAoD;AAC1D,QAAM,CAAEC,aAAF,EAAiB,GAAGC,cAApB,IAAuCF,SAA7C;;AACA,MAAK,CAAEC,aAAP,EAAuB;AACtB,WAAO,IAAP;AACA;;AACD,QAAM,GAAIE,SAAJ,IAAkB,mDACvBF,aAAa,CAACG,IADS,CAAxB;AAGA,QAAMC,mBAAmB,GAAGH,cAAc,CAACI,KAAf,CAAwBC,QAAF,IAAgB;AACjE,UAAM,GAAIC,IAAJ,IAAa,mDAAkCD,QAAQ,CAACH,IAA3C,CAAnB;AACA,WAAOI,IAAI,KAAKL,SAAhB;AACA,GAH2B,CAA5B;AAIA,SAAOE,mBAAmB,GAAGF,SAAH,GAAe,IAAzC;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { FontSizePickerProps, FontSize } from './types';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\n\n/**\n * Some themes use css vars for their font sizes, so until we\n * have the way of calculating them don't display them.\n *\n * @param  value The value that is checked.\n * @return Whether the value is a simple css value.\n */\nexport function isSimpleCssValue(\n\tvalue: NonNullable< FontSizePickerProps[ 'value' ] >\n) {\n\tconst sizeRegex = /^[\\d\\.]+(px|em|rem|vw|vh|%)?$/i;\n\treturn sizeRegex.test( String( value ) );\n}\n\n/**\n * If all of the given font sizes have the same unit (e.g. 'px'), return that\n * unit. Otherwise return null.\n *\n * @param  fontSizes List of font sizes.\n * @return The common unit, or null.\n */\nexport function getCommonSizeUnit( fontSizes: FontSize[] ) {\n\tconst [ firstFontSize, ...otherFontSizes ] = fontSizes;\n\tif ( ! firstFontSize ) {\n\t\treturn null;\n\t}\n\tconst [ , firstUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tfirstFontSize.size\n\t);\n\tconst areAllSizesSameUnit = otherFontSizes.every( ( fontSize ) => {\n\t\tconst [ , unit ] = parseQuantityAndUnitFromRawValue( fontSize.size );\n\t\treturn unit === firstUnit;\n\t} );\n\treturn areAllSizesSameUnit ? firstUnit : null;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/font-size-picker/utils.ts"],"names":["isSimpleCssValue","value","sizeRegex","test","String","getCommonSizeUnit","fontSizes","firstFontSize","otherFontSizes","firstUnit","size","areAllSizesSameUnit","every","fontSize","unit"],"mappings":";;;;;;;;AASA;;AATA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,gBAAT,CACNC,KADM,EAEL;AACD,QAAMC,SAAS,GAAG,gCAAlB;AACA,SAAOA,SAAS,CAACC,IAAV,CAAgBC,MAAM,CAAEH,KAAF,CAAtB,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASI,iBAAT,CAA4BC,SAA5B,EAAoD;AAC1D,QAAM,CAAEC,aAAF,EAAiB,GAAGC,cAApB,IAAuCF,SAA7C;;AACA,MAAK,CAAEC,aAAP,EAAuB;AACtB,WAAO,IAAP;AACA;;AACD,QAAM,GAAIE,SAAJ,IAAkB,mDACvBF,aAAa,CAACG,IADS,CAAxB;AAGA,QAAMC,mBAAmB,GAAGH,cAAc,CAACI,KAAf,CAAwBC,QAAF,IAAgB;AACjE,UAAM,GAAIC,IAAJ,IAAa,mDAAkCD,QAAQ,CAACH,IAA3C,CAAnB;AACA,WAAOI,IAAI,KAAKL,SAAhB;AACA,GAH2B,CAA5B;AAIA,SAAOE,mBAAmB,GAAGF,SAAH,GAAe,IAAzC;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { FontSizePickerProps, FontSize } from './types';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\n\n/**\n * Some themes use css vars for their font sizes, so until we\n * have the way of calculating them don't display them.\n *\n * @param value The value that is checked.\n * @return Whether the value is a simple css value.\n */\nexport function isSimpleCssValue(\n\tvalue: NonNullable< FontSizePickerProps[ 'value' ] >\n) {\n\tconst sizeRegex = /^[\\d\\.]+(px|em|rem|vw|vh|%)?$/i;\n\treturn sizeRegex.test( String( value ) );\n}\n\n/**\n * If all of the given font sizes have the same unit (e.g. 'px'), return that\n * unit. Otherwise return null.\n *\n * @param fontSizes List of font sizes.\n * @return The common unit, or null.\n */\nexport function getCommonSizeUnit( fontSizes: FontSize[] ) {\n\tconst [ firstFontSize, ...otherFontSizes ] = fontSizes;\n\tif ( ! firstFontSize ) {\n\t\treturn null;\n\t}\n\tconst [ , firstUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tfirstFontSize.size\n\t);\n\tconst areAllSizesSameUnit = otherFontSizes.every( ( fontSize ) => {\n\t\tconst [ , unit ] = parseQuantityAndUnitFromRawValue( fontSize.size );\n\t\treturn unit === firstUnit;\n\t} );\n\treturn areAllSizesSameUnit ? firstUnit : null;\n}\n"]}

package/build/gradient-picker/index.js

@@ -86,7 +86,8 @@ function MultipleOrigin(_ref3) {
     gradients,
     onChange,
     value,
-    actions
+    actions,
+    headingLevel
   } = _ref3;
   return (0, _element.createElement)(_vStack.VStack, {
     spacing: 3,
@@ -99,7 +100,9 @@ function MultipleOrigin(_ref3) {
     return (0, _element.createElement)(_vStack.VStack, {
       spacing: 2,
       key: index
-    }, (0, _element.createElement)(_styles.ColorHeading, null, name), (0, _element.createElement)(SingleOrigin, (0, _extends2.default)({
+    }, (0, _element.createElement)(_styles.ColorHeading, {
+      level: headingLevel
+    }, name), (0, _element.createElement)(SingleOrigin, (0, _extends2.default)({
       clearGradient: clearGradient,
       gradients: gradientSet,
       onChange: gradient => onChange(gradient, index),
@@ -120,7 +123,8 @@ function GradientPicker(_ref5) {
     value,
     clearable = true,
     disableCustomGradients = false,
-    __experimentalIsRenderedInSidebar
+    __experimentalIsRenderedInSidebar,
+    headingLevel = 2
   } = _ref5;
   const clearGradient = (0, _element.useCallback)(() => onChange(undefined), [onChange]);
   const Component = isMultipleOriginArray(gradients) ? MultipleOrigin : SingleOrigin;
@@ -156,7 +160,8 @@ function GradientPicker(_ref5) {
       value: value,
       actions: clearable && !disableCustomGradients && (0, _element.createElement)(_circularOptionPicker.default.ButtonAction, {
         onClick: clearGradient
-      }, (0, _i18n.__)('Clear'))
+      }, (0, _i18n.__)('Clear')),
+      headingLevel: headingLevel
     })))
   );
 }

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/gradient-picker/index.js"],"names":["isMultipleOriginObject","obj","Array","isArray","gradients","isMultipleOriginArray","arr","length","every","gradientObj","SingleOrigin","className","clearGradient","onChange","value","actions","gradientOptions","map","index","gradient","name","color","background","MultipleOrigin","gradientSet","GradientPicker","__nextHasNoMargin","clearable","disableCustomGradients","__experimentalIsRenderedInSidebar","undefined","Component","since","version","hint","deprecatedMarginSpacerProps","marginTop","marginBottom"],"mappings":";;;;;;;;;AAIA;;;;AADA;;AAEA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAdA;AACA;AACA;;AAKA;AACA;AACA;AAOA;AACA;AACA,MAAMA,sBAAsB,GAAKC,GAAF,IAC9BC,KAAK,CAACC,OAAN,CAAeF,GAAG,CAACG,SAAnB,KAAkC,EAAI,cAAcH,GAAlB,CADnC;;AAGA,MAAMI,qBAAqB,GAAKC,GAAF,IAAW;AACxC,SACCA,GAAG,CAACC,MAAJ,GAAa,CAAb,IACAD,GAAG,CAACE,KAAJ,CAAaC,WAAF,IAAmBT,sBAAsB,CAAES,WAAF,CAApD,CAFD;AAIA,CALD;;AAOA,SAASC,YAAT,OAOI;AAAA,MAPmB;AACtBC,IAAAA,SADsB;AAEtBC,IAAAA,aAFsB;AAGtBR,IAAAA,SAHsB;AAItBS,IAAAA,QAJsB;AAKtBC,IAAAA,KALsB;AAMtBC,IAAAA;AANsB,GAOnB;AACH,QAAMC,eAAe,GAAG,sBAAS,MAAM;AACtC,WAAOZ,SAAS,CAACa,GAAV,CAAe,QAAsBC,KAAtB;AAAA,UAAE;AAAEC,QAAAA,QAAF;AAAYC,QAAAA;AAAZ,OAAF;AAAA,aACrB,4BAAC,6BAAD,CAAsB,MAAtB;AACC,QAAA,GAAG,EAAGD,QADP;AAEC,QAAA,KAAK,EAAGA,QAFT;AAGC,QAAA,UAAU,EAAGL,KAAK,KAAKK,QAHxB;AAIC,QAAA,WAAW,EACVC,IAAI,IACJ;AACA,2BAAS,cAAI,mBAAJ,CAAT,EAAoCD,QAApC,CAPF;AASC,QAAA,KAAK,EAAG;AAAEE,UAAAA,KAAK,EAAE,iBAAT;AAA4BC,UAAAA,UAAU,EAAEH;AAAxC,SATT;AAUC,QAAA,OAAO,EACNL,KAAK,KAAKK,QAAV,GACGP,aADH,GAEG,MAAMC,QAAQ,CAAEM,QAAF,EAAYD,KAAZ,CAbnB;AAeC,sBACCE,IAAI,GACD;AACA,2BAAS,cAAI,cAAJ,CAAT,EAA+BA,IAA/B,CAFC,GAGD;AACA,2BAAS,cAAI,mBAAJ,CAAT,EAAoCD,QAApC;AApBL,QADqB;AAAA,KAAf,CAAP;AAyBA,GA1BuB,EA0BrB,CAAEf,SAAF,EAAaU,KAAb,EAAoBD,QAApB,EAA8BD,aAA9B,CA1BqB,CAAxB;AA2BA,SACC,4BAAC,6BAAD;AACC,IAAA,SAAS,EAAGD,SADb;AAEC,IAAA,OAAO,EAAGK,eAFX;AAGC,IAAA,OAAO,EAAGD;AAHX,IADD;AAOA;;AAED,SAASQ,cAAT,QAOI;AAAA,MAPqB;AACxBZ,IAAAA,SADwB;AAExBC,IAAAA,aAFwB;AAGxBR,IAAAA,SAHwB;AAIxBS,IAAAA,QAJwB;AAKxBC,IAAAA,KALwB;AAMxBC,IAAAA;AANwB,GAOrB;AACH,SACC,4BAAC,cAAD;AAAQ,IAAA,OAAO,EAAG,CAAlB;AAAsB,IAAA,SAAS,EAAGJ;AAAlC,KACGP,SAAS,CAACa,GAAV,CAAe,QAAoCC,KAApC,KAA+C;AAAA,QAA7C;AAAEE,MAAAA,IAAF;AAAQhB,MAAAA,SAAS,EAAEoB;AAAnB,KAA6C;AAC/D,WACC,4BAAC,cAAD;AAAQ,MAAA,OAAO,EAAG,CAAlB;AAAsB,MAAA,GAAG,EAAGN;AAA5B,OACC,4BAAC,oBAAD,QAAgBE,IAAhB,CADD,EAEC,4BAAC,YAAD;AACC,MAAA,aAAa,EAAGR,aADjB;AAEC,MAAA,SAAS,EAAGY,WAFb;AAGC,MAAA,QAAQ,EAAKL,QAAF,IACVN,QAAQ,CAAEM,QAAF,EAAYD,KAAZ,CAJV;AAMC,MAAA,KAAK,EAAGJ;AANT,OAOQV,SAAS,CAACG,MAAV,KAAqBW,KAAK,GAAG,CAA7B,GACJ;AAAEH,MAAAA;AAAF,KADI,GAEJ,EATJ,EAFD,CADD;AAgBA,GAjBC,CADH,CADD;AAsBA;;AAEc,SAASU,cAAT,QAUX;AAAA,MAVoC;AACvC;AACAC,IAAAA,iBAAiB,GAAG,KAFmB;AAGvCf,IAAAA,SAHuC;AAIvCP,IAAAA,SAJuC;AAKvCS,IAAAA,QALuC;AAMvCC,IAAAA,KANuC;AAOvCa,IAAAA,SAAS,GAAG,IAP2B;AAQvCC,IAAAA,sBAAsB,GAAG,KARc;AASvCC,IAAAA;AATuC,GAUpC;AACH,QAAMjB,aAAa,GAAG,0BACrB,MAAMC,QAAQ,CAAEiB,SAAF,CADO,EAErB,CAAEjB,QAAF,CAFqB,CAAtB;AAIA,QAAMkB,SAAS,GAAG1B,qBAAqB,CAAED,SAAF,CAArB,GACfmB,cADe,GAEfb,YAFH;;AAIA,MAAK,CAAEgB,iBAAP,EAA2B;AAC1B,6BAAY,sDAAZ,EAAoE;AACnEM,MAAAA,KAAK,EAAE,KAD4D;AAEnEC,MAAAA,OAAO,EAAE,KAF0D;AAGnEC,MAAAA,IAAI,EAAE;AAH6D,KAApE;AAKA;;AAED,QAAMC,2BAA2B,GAAG,CAAET,iBAAF,GACjC;AACAU,IAAAA,SAAS,EAAE,EAAEhC,SAAF,aAAEA,SAAF,eAAEA,SAAS,CAAEG,MAAb,IAAsB,CAAtB,GAA0BuB,SADrC;AAEAO,IAAAA,YAAY,EAAE,CAAEV,SAAF,GAAc,CAAd,GAAkB;AAFhC,GADiC,GAKjC,EALH;AAOA,SACC;AACA,gCAAC,cAAD;AAAQ,MAAA,YAAY,EAAG;AAAvB,OAAgCQ,2BAAhC,GACC,4BAAC,cAAD;AAAQ,MAAA,OAAO,EAAG/B,SAAS,SAAT,IAAAA,SAAS,WAAT,IAAAA,SAAS,CAAEG,MAAX,GAAoB,CAApB,GAAwB;AAA1C,OACG,CAAEqB,sBAAF,IACD,4BAAC,6BAAD;AACC,MAAA,iBAAiB,MADlB;AAEC,MAAA,iCAAiC,EAChCC,iCAHF;AAKC,MAAA,KAAK,EAAGf,KALT;AAMC,MAAA,QAAQ,EAAGD;AANZ,MAFF,EAWG,CAAE,CAAAT,SAAS,SAAT,IAAAA,SAAS,WAAT,YAAAA,SAAS,CAAEG,MAAX,KAAqBoB,SAAvB,KACD,4BAAC,SAAD;AACC,MAAA,SAAS,EAAGhB,SADb;AAEC,MAAA,SAAS,EAAGgB,SAFb;AAGC,MAAA,aAAa,EAAGf,aAHjB;AAIC,MAAA,SAAS,EAAGR,SAJb;AAKC,MAAA,QAAQ,EAAGS,QALZ;AAMC,MAAA,KAAK,EAAGC,KANT;AAOC,MAAA,OAAO,EACNa,SAAS,IACT,CAAEC,sBADF,IAEC,4BAAC,6BAAD,CAAsB,YAAtB;AACC,QAAA,OAAO,EAAGhB;AADX,SAGG,cAAI,OAAJ,CAHH;AAVH,MAZF,CADD;AAFD;AAqCA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\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';\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 = ( obj ) =>\n\tArray.isArray( obj.gradients ) && ! ( 'gradient' in obj );\n\nconst isMultipleOriginArray = ( arr ) => {\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\tactions,\n} ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn gradients.map( ( { gradient, name }, index ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ gradient }\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\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\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\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</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\t{ ...( gradients.length === index + 1\n\t\t\t\t\t\t\t\t? { actions }\n\t\t\t\t\t\t\t\t: {} ) }\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\nexport default 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} ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\tconst Component = isMultipleOriginArray( gradients )\n\t\t? MultipleOrigin\n\t\t: SingleOrigin;\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 || clearable ) && (\n\t\t\t\t\t<Component\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tclearable={ clearable }\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/>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t</Spacer>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/gradient-picker/index.js"],"names":["isMultipleOriginObject","obj","Array","isArray","gradients","isMultipleOriginArray","arr","length","every","gradientObj","SingleOrigin","className","clearGradient","onChange","value","actions","gradientOptions","map","index","gradient","name","color","background","MultipleOrigin","headingLevel","gradientSet","GradientPicker","__nextHasNoMargin","clearable","disableCustomGradients","__experimentalIsRenderedInSidebar","undefined","Component","since","version","hint","deprecatedMarginSpacerProps","marginTop","marginBottom"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\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';\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 = ( obj ) =>\n\tArray.isArray( obj.gradients ) && ! ( 'gradient' in obj );\n\nconst isMultipleOriginArray = ( arr ) => {\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\tactions,\n} ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn gradients.map( ( { gradient, name }, index ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ gradient }\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\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n\theadingLevel,\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\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading level={ headingLevel }>\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\t{ ...( gradients.length === index + 1\n\t\t\t\t\t\t\t\t? { actions }\n\t\t\t\t\t\t\t\t: {} ) }\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\nexport default 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} ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\tconst Component = isMultipleOriginArray( gradients )\n\t\t? MultipleOrigin\n\t\t: SingleOrigin;\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 || clearable ) && (\n\t\t\t\t\t<Component\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tclearable={ clearable }\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"]}

package/build/input-control/reducer/reducer.js

@@ -30,7 +30,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 /**
  * Prepares initialState for the reducer.
  *
- * @param  initialState The initial state.
+ * @param initialState The initial state.
  * @return Prepared initialState for the reducer
  */
 function mergeInitialState() {
@@ -50,7 +50,7 @@ function mergeInitialState() {
  * exception for CONTROL actions is because they represent controlled updates
  * from props and no case has yet presented for their specialization.
  *
- * @param  composedStateReducers A reducer to specialize state changes.
+ * @param composedStateReducers A reducer to specialize state changes.
  * @return The reducer.
  */
 
@@ -149,9 +149,9 @@ function inputControlStateReducer(composedStateReducers) {
  * This technique uses the "stateReducer" design pattern:
  * https://kentcdodds.com/blog/the-state-reducer-pattern/
  *
- * @param  stateReducer    An external state reducer.
- * @param  initialState    The initial state for the reducer.
- * @param  onChangeHandler A handler for the onChange event.
+ * @param stateReducer    An external state reducer.
+ * @param initialState    The initial state for the reducer.
+ * @param onChangeHandler A handler for the onChange event.
  * @return State, dispatch, and a collection of actions.
  */
 

package/build/input-control/reducer/reducer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/input-control/reducer/reducer.ts"],"names":["mergeInitialState","initialState","initialInputControlState","value","initialValue","inputControlStateReducer","composedStateReducers","state","action","nextState","type","actions","CONTROL","payload","isDirty","_event","undefined","PRESS_UP","PRESS_DOWN","DRAG_START","isDragging","DRAG_END","CHANGE","error","isPressEnterToChange","COMMIT","RESET","INVALIDATE","event","useInputControlStateReducer","stateReducer","initialStateReducer","onChangeHandler","dispatch","createChangeEvent","nextValue","createKeyEvent","createDragEvent","change","invalidate","reset","commit","dragStart","drag","DRAG","dragEnd","pressUp","pressDown","pressEnter","PRESS_ENTER","currentState","refProps","current"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { SyntheticEvent, ChangeEvent, PointerEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useReducer, useLayoutEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tInputState,\n\tStateReducer,\n\tinitialInputControlState,\n\tinitialStateReducer,\n} from './state';\nimport * as actions from './actions';\nimport type { InputChangeCallback } from '../types';\n\n/**\n * Prepares initialState for the reducer.\n *\n * @param  initialState The initial state.\n * @return Prepared initialState for the reducer\n */\nfunction mergeInitialState(\n\tinitialState: Partial< InputState > = initialInputControlState\n): InputState {\n\tconst { value } = initialState;\n\n\treturn {\n\t\t...initialInputControlState,\n\t\t...initialState,\n\t\tinitialValue: value,\n\t} as InputState;\n}\n\n/**\n * Creates the base reducer which may be coupled to a specializing reducer.\n * As its final step, for all actions other than CONTROL, the base reducer\n * passes the state and action on through the specializing reducer. The\n * exception for CONTROL actions is because they represent controlled updates\n * from props and no case has yet presented for their specialization.\n *\n * @param  composedStateReducers A reducer to specialize state changes.\n * @return The reducer.\n */\nfunction inputControlStateReducer(\n\tcomposedStateReducers: StateReducer\n): StateReducer< actions.ControlAction > {\n\treturn ( state, action ) => {\n\t\tconst nextState = { ...state };\n\n\t\tswitch ( action.type ) {\n\t\t\t/*\n\t\t\t * Controlled updates\n\t\t\t */\n\t\t\tcase actions.CONTROL:\n\t\t\t\tnextState.value = action.payload.value;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tnextState._event = undefined;\n\t\t\t\t// Returns immediately to avoid invoking additional reducers.\n\t\t\t\treturn nextState;\n\n\t\t\t/**\n\t\t\t * Keyboard events\n\t\t\t */\n\t\t\tcase actions.PRESS_UP:\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.PRESS_DOWN:\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Drag events\n\t\t\t */\n\t\t\tcase actions.DRAG_START:\n\t\t\t\tnextState.isDragging = true;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.DRAG_END:\n\t\t\t\tnextState.isDragging = false;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Input events\n\t\t\t */\n\t\t\tcase actions.CHANGE:\n\t\t\t\tnextState.error = null;\n\t\t\t\tnextState.value = action.payload.value;\n\n\t\t\t\tif ( state.isPressEnterToChange ) {\n\t\t\t\t\tnextState.isDirty = true;\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\n\t\t\tcase actions.COMMIT:\n\t\t\t\tnextState.value = action.payload.value;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.RESET:\n\t\t\t\tnextState.error = null;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tnextState.value = action.payload.value || state.initialValue;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Validation\n\t\t\t */\n\t\t\tcase actions.INVALIDATE:\n\t\t\t\tnextState.error = action.payload.error;\n\t\t\t\tbreak;\n\t\t}\n\n\t\tnextState._event = action.payload.event;\n\n\t\t/**\n\t\t * Send the nextState + action to the composedReducers via\n\t\t * this \"bridge\" mechanism. This allows external stateReducers\n\t\t * to hook into actions, and modify state if needed.\n\t\t */\n\t\treturn composedStateReducers( nextState, action );\n\t};\n}\n\n/**\n * A custom hook that connects and external stateReducer with an internal\n * reducer. This hook manages the internal state of InputControl.\n * However, by connecting an external stateReducer function, other\n * components can react to actions as well as modify state before it is\n * applied.\n *\n * This technique uses the \"stateReducer\" design pattern:\n * https://kentcdodds.com/blog/the-state-reducer-pattern/\n *\n * @param  stateReducer    An external state reducer.\n * @param  initialState    The initial state for the reducer.\n * @param  onChangeHandler A handler for the onChange event.\n * @return State, dispatch, and a collection of actions.\n */\nexport function useInputControlStateReducer(\n\tstateReducer: StateReducer = initialStateReducer,\n\tinitialState: Partial< InputState > = initialInputControlState,\n\tonChangeHandler: InputChangeCallback\n) {\n\tconst [ state, dispatch ] = useReducer(\n\t\tinputControlStateReducer( stateReducer ),\n\t\tmergeInitialState( initialState )\n\t);\n\n\tconst createChangeEvent =\n\t\t( type: actions.ChangeEventAction[ 'type' ] ) =>\n\t\t(\n\t\t\tnextValue: actions.ChangeEventAction[ 'payload' ][ 'value' ],\n\t\t\tevent: actions.ChangeEventAction[ 'payload' ][ 'event' ]\n\t\t) => {\n\t\t\tdispatch( {\n\t\t\t\ttype,\n\t\t\t\tpayload: { value: nextValue, event },\n\t\t\t} as actions.InputAction );\n\t\t};\n\n\tconst createKeyEvent =\n\t\t( type: actions.KeyEventAction[ 'type' ] ) =>\n\t\t( event: actions.KeyEventAction[ 'payload' ][ 'event' ] ) => {\n\t\t\tdispatch( { type, payload: { event } } );\n\t\t};\n\n\tconst createDragEvent =\n\t\t( type: actions.DragEventAction[ 'type' ] ) =>\n\t\t( payload: actions.DragEventAction[ 'payload' ] ) => {\n\t\t\tdispatch( { type, payload } );\n\t\t};\n\n\t/**\n\t * Actions for the reducer\n\t */\n\tconst change = createChangeEvent( actions.CHANGE );\n\tconst invalidate = ( error: unknown, event: SyntheticEvent ) =>\n\t\tdispatch( { type: actions.INVALIDATE, payload: { error, event } } );\n\tconst reset = createChangeEvent( actions.RESET );\n\tconst commit = createChangeEvent( actions.COMMIT );\n\n\tconst dragStart = createDragEvent( actions.DRAG_START );\n\tconst drag = createDragEvent( actions.DRAG );\n\tconst dragEnd = createDragEvent( actions.DRAG_END );\n\n\tconst pressUp = createKeyEvent( actions.PRESS_UP );\n\tconst pressDown = createKeyEvent( actions.PRESS_DOWN );\n\tconst pressEnter = createKeyEvent( actions.PRESS_ENTER );\n\n\tconst currentState = useRef( state );\n\tconst refProps = useRef( { value: initialState.value, onChangeHandler } );\n\n\t// Freshens refs to props and state so that subsequent effects have access\n\t// to their latest values without their changes causing effect runs.\n\tuseLayoutEffect( () => {\n\t\tcurrentState.current = state;\n\t\trefProps.current = { value: initialState.value, onChangeHandler };\n\t} );\n\n\t// Propagates the latest state through onChange.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tcurrentState.current._event !== undefined &&\n\t\t\tstate.value !== refProps.current.value &&\n\t\t\t! state.isDirty\n\t\t) {\n\t\t\trefProps.current.onChangeHandler( state.value ?? '', {\n\t\t\t\tevent: currentState.current._event as\n\t\t\t\t\t| ChangeEvent< HTMLInputElement >\n\t\t\t\t\t| PointerEvent< HTMLInputElement >,\n\t\t\t} );\n\t\t}\n\t}, [ state.value, state.isDirty ] );\n\n\t// Updates the state from props.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tinitialState.value !== currentState.current.value &&\n\t\t\t! currentState.current.isDirty\n\t\t) {\n\t\t\tdispatch( {\n\t\t\t\ttype: actions.CONTROL,\n\t\t\t\tpayload: { value: initialState.value ?? '' },\n\t\t\t} );\n\t\t}\n\t}, [ initialState.value ] );\n\n\treturn {\n\t\tchange,\n\t\tcommit,\n\t\tdispatch,\n\t\tdrag,\n\t\tdragEnd,\n\t\tdragStart,\n\t\tinvalidate,\n\t\tpressDown,\n\t\tpressEnter,\n\t\tpressUp,\n\t\treset,\n\t\tstate,\n\t} as const;\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/input-control/reducer/reducer.ts"],"names":["mergeInitialState","initialState","initialInputControlState","value","initialValue","inputControlStateReducer","composedStateReducers","state","action","nextState","type","actions","CONTROL","payload","isDirty","_event","undefined","PRESS_UP","PRESS_DOWN","DRAG_START","isDragging","DRAG_END","CHANGE","error","isPressEnterToChange","COMMIT","RESET","INVALIDATE","event","useInputControlStateReducer","stateReducer","initialStateReducer","onChangeHandler","dispatch","createChangeEvent","nextValue","createKeyEvent","createDragEvent","change","invalidate","reset","commit","dragStart","drag","DRAG","dragEnd","pressUp","pressDown","pressEnter","PRESS_ENTER","currentState","refProps","current"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { SyntheticEvent, ChangeEvent, PointerEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useReducer, useLayoutEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tInputState,\n\tStateReducer,\n\tinitialInputControlState,\n\tinitialStateReducer,\n} from './state';\nimport * as actions from './actions';\nimport type { InputChangeCallback } from '../types';\n\n/**\n * Prepares initialState for the reducer.\n *\n * @param initialState The initial state.\n * @return Prepared initialState for the reducer\n */\nfunction mergeInitialState(\n\tinitialState: Partial< InputState > = initialInputControlState\n): InputState {\n\tconst { value } = initialState;\n\n\treturn {\n\t\t...initialInputControlState,\n\t\t...initialState,\n\t\tinitialValue: value,\n\t} as InputState;\n}\n\n/**\n * Creates the base reducer which may be coupled to a specializing reducer.\n * As its final step, for all actions other than CONTROL, the base reducer\n * passes the state and action on through the specializing reducer. The\n * exception for CONTROL actions is because they represent controlled updates\n * from props and no case has yet presented for their specialization.\n *\n * @param composedStateReducers A reducer to specialize state changes.\n * @return The reducer.\n */\nfunction inputControlStateReducer(\n\tcomposedStateReducers: StateReducer\n): StateReducer< actions.ControlAction > {\n\treturn ( state, action ) => {\n\t\tconst nextState = { ...state };\n\n\t\tswitch ( action.type ) {\n\t\t\t/*\n\t\t\t * Controlled updates\n\t\t\t */\n\t\t\tcase actions.CONTROL:\n\t\t\t\tnextState.value = action.payload.value;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tnextState._event = undefined;\n\t\t\t\t// Returns immediately to avoid invoking additional reducers.\n\t\t\t\treturn nextState;\n\n\t\t\t/**\n\t\t\t * Keyboard events\n\t\t\t */\n\t\t\tcase actions.PRESS_UP:\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.PRESS_DOWN:\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Drag events\n\t\t\t */\n\t\t\tcase actions.DRAG_START:\n\t\t\t\tnextState.isDragging = true;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.DRAG_END:\n\t\t\t\tnextState.isDragging = false;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Input events\n\t\t\t */\n\t\t\tcase actions.CHANGE:\n\t\t\t\tnextState.error = null;\n\t\t\t\tnextState.value = action.payload.value;\n\n\t\t\t\tif ( state.isPressEnterToChange ) {\n\t\t\t\t\tnextState.isDirty = true;\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\n\t\t\tcase actions.COMMIT:\n\t\t\t\tnextState.value = action.payload.value;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.RESET:\n\t\t\t\tnextState.error = null;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tnextState.value = action.payload.value || state.initialValue;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Validation\n\t\t\t */\n\t\t\tcase actions.INVALIDATE:\n\t\t\t\tnextState.error = action.payload.error;\n\t\t\t\tbreak;\n\t\t}\n\n\t\tnextState._event = action.payload.event;\n\n\t\t/**\n\t\t * Send the nextState + action to the composedReducers via\n\t\t * this \"bridge\" mechanism. This allows external stateReducers\n\t\t * to hook into actions, and modify state if needed.\n\t\t */\n\t\treturn composedStateReducers( nextState, action );\n\t};\n}\n\n/**\n * A custom hook that connects and external stateReducer with an internal\n * reducer. This hook manages the internal state of InputControl.\n * However, by connecting an external stateReducer function, other\n * components can react to actions as well as modify state before it is\n * applied.\n *\n * This technique uses the \"stateReducer\" design pattern:\n * https://kentcdodds.com/blog/the-state-reducer-pattern/\n *\n * @param stateReducer    An external state reducer.\n * @param initialState    The initial state for the reducer.\n * @param onChangeHandler A handler for the onChange event.\n * @return State, dispatch, and a collection of actions.\n */\nexport function useInputControlStateReducer(\n\tstateReducer: StateReducer = initialStateReducer,\n\tinitialState: Partial< InputState > = initialInputControlState,\n\tonChangeHandler: InputChangeCallback\n) {\n\tconst [ state, dispatch ] = useReducer(\n\t\tinputControlStateReducer( stateReducer ),\n\t\tmergeInitialState( initialState )\n\t);\n\n\tconst createChangeEvent =\n\t\t( type: actions.ChangeEventAction[ 'type' ] ) =>\n\t\t(\n\t\t\tnextValue: actions.ChangeEventAction[ 'payload' ][ 'value' ],\n\t\t\tevent: actions.ChangeEventAction[ 'payload' ][ 'event' ]\n\t\t) => {\n\t\t\tdispatch( {\n\t\t\t\ttype,\n\t\t\t\tpayload: { value: nextValue, event },\n\t\t\t} as actions.InputAction );\n\t\t};\n\n\tconst createKeyEvent =\n\t\t( type: actions.KeyEventAction[ 'type' ] ) =>\n\t\t( event: actions.KeyEventAction[ 'payload' ][ 'event' ] ) => {\n\t\t\tdispatch( { type, payload: { event } } );\n\t\t};\n\n\tconst createDragEvent =\n\t\t( type: actions.DragEventAction[ 'type' ] ) =>\n\t\t( payload: actions.DragEventAction[ 'payload' ] ) => {\n\t\t\tdispatch( { type, payload } );\n\t\t};\n\n\t/**\n\t * Actions for the reducer\n\t */\n\tconst change = createChangeEvent( actions.CHANGE );\n\tconst invalidate = ( error: unknown, event: SyntheticEvent ) =>\n\t\tdispatch( { type: actions.INVALIDATE, payload: { error, event } } );\n\tconst reset = createChangeEvent( actions.RESET );\n\tconst commit = createChangeEvent( actions.COMMIT );\n\n\tconst dragStart = createDragEvent( actions.DRAG_START );\n\tconst drag = createDragEvent( actions.DRAG );\n\tconst dragEnd = createDragEvent( actions.DRAG_END );\n\n\tconst pressUp = createKeyEvent( actions.PRESS_UP );\n\tconst pressDown = createKeyEvent( actions.PRESS_DOWN );\n\tconst pressEnter = createKeyEvent( actions.PRESS_ENTER );\n\n\tconst currentState = useRef( state );\n\tconst refProps = useRef( { value: initialState.value, onChangeHandler } );\n\n\t// Freshens refs to props and state so that subsequent effects have access\n\t// to their latest values without their changes causing effect runs.\n\tuseLayoutEffect( () => {\n\t\tcurrentState.current = state;\n\t\trefProps.current = { value: initialState.value, onChangeHandler };\n\t} );\n\n\t// Propagates the latest state through onChange.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tcurrentState.current._event !== undefined &&\n\t\t\tstate.value !== refProps.current.value &&\n\t\t\t! state.isDirty\n\t\t) {\n\t\t\trefProps.current.onChangeHandler( state.value ?? '', {\n\t\t\t\tevent: currentState.current._event as\n\t\t\t\t\t| ChangeEvent< HTMLInputElement >\n\t\t\t\t\t| PointerEvent< HTMLInputElement >,\n\t\t\t} );\n\t\t}\n\t}, [ state.value, state.isDirty ] );\n\n\t// Updates the state from props.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tinitialState.value !== currentState.current.value &&\n\t\t\t! currentState.current.isDirty\n\t\t) {\n\t\t\tdispatch( {\n\t\t\t\ttype: actions.CONTROL,\n\t\t\t\tpayload: { value: initialState.value ?? '' },\n\t\t\t} );\n\t\t}\n\t}, [ initialState.value ] );\n\n\treturn {\n\t\tchange,\n\t\tcommit,\n\t\tdispatch,\n\t\tdrag,\n\t\tdragEnd,\n\t\tdragStart,\n\t\tinvalidate,\n\t\tpressDown,\n\t\tpressEnter,\n\t\tpressUp,\n\t\treset,\n\t\tstate,\n\t} as const;\n}\n"]}

package/build/input-control/utils.js

@@ -20,7 +20,7 @@ var _element = require("@wordpress/element");
 /**
  * Gets a CSS cursor value based on a drag direction.
  *
- * @param  dragDirection The drag direction.
+ * @param dragDirection The drag direction.
  * @return  The CSS cursor value.
  */
 function getDragCursor(dragDirection) {

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/input-control/utils.ts"],"names":["getDragCursor","dragDirection","dragCursor","useDragCursor","isDragging","document","documentElement","style","cursor","useDraft","props","refPreviousValue","value","draft","setDraft","undefined","current","previousValue","isStale","onChange","nextValue","extra","Object","assign","onBlur","event"],"mappings":";;;;;;;;;AAQA;;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAaA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,aAAT,CAAwBC,aAAxB,EAAwD;AAC9D,MAAIC,UAAU,GAAG,WAAjB;;AAEA,UAASD,aAAT;AACC,SAAK,GAAL;AACA,SAAK,GAAL;AACCC,MAAAA,UAAU,GAAG,WAAb;AACA;;AAED,SAAK,GAAL;AACA,SAAK,GAAL;AACCA,MAAAA,UAAU,GAAG,WAAb;AACA;AATF;;AAYA,SAAOA,UAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,aAAT,CACNC,UADM,EAENH,aAFM,EAGG;AACT,QAAMC,UAAU,GAAGF,aAAa,CAAEC,aAAF,CAAhC;AAEA,0BAAW,MAAM;AAChB,QAAKG,UAAL,EAAkB;AACjBC,MAAAA,QAAQ,CAACC,eAAT,CAAyBC,KAAzB,CAA+BC,MAA/B,GAAwCN,UAAxC;AACA,KAFD,MAEO;AACN;AACAG,MAAAA,QAAQ,CAACC,eAAT,CAAyBC,KAAzB,CAA+BC,MAA/B,GAAwC,IAAxC;AACA;AACD,GAPD,EAOG,CAAEJ,UAAF,EAAcF,UAAd,CAPH;AASA,SAAOA,UAAP;AACA;;AAEM,SAASO,QAAT,CAAmBC,KAAnB,EAIH;AACH,QAAMC,gBAAgB,GAAG,qBAAQD,KAAK,CAACE,KAAd,CAAzB;AACA,QAAM,CAAEC,KAAF,EAASC,QAAT,IAAsB,uBAGvB,EAHuB,CAA5B;AAIA,QAAMF,KAAK,GAAGC,KAAK,CAACD,KAAN,KAAgBG,SAAhB,GAA4BF,KAAK,CAACD,KAAlC,GAA0CF,KAAK,CAACE,KAA9D,CANG,CAQH;AACA;AACA;;AACA,gCAAiB,MAAM;AACtB,UAAM;AAAEI,MAAAA,OAAO,EAAEC;AAAX,QAA6BN,gBAAnC;AACAA,IAAAA,gBAAgB,CAACK,OAAjB,GAA2BN,KAAK,CAACE,KAAjC;AACA,QAAKC,KAAK,CAACD,KAAN,KAAgBG,SAAhB,IAA6B,CAAEF,KAAK,CAACK,OAA1C,EACCJ,QAAQ,CAAE,EAAE,GAAGD,KAAL;AAAYK,MAAAA,OAAO,EAAE;AAArB,KAAF,CAAR,CADD,KAEK,IAAKL,KAAK,CAACK,OAAN,IAAiBR,KAAK,CAACE,KAAN,KAAgBK,aAAtC,EACJH,QAAQ,CAAE,EAAF,CAAR;AACD,GAPD,EAOG,CAAEJ,KAAK,CAACE,KAAR,EAAeC,KAAf,CAPH;;AASA,QAAMM,QAA6B,GAAG,CAAEC,SAAF,EAAaC,KAAb,KAAwB;AAC7D;AACAP,IAAAA,QAAQ,CAAIE,OAAF,IACTM,MAAM,CAACC,MAAP,CAAeP,OAAf,EAAwB;AAAEJ,MAAAA,KAAK,EAAEQ,SAAT;AAAoBF,MAAAA,OAAO,EAAE;AAA7B,KAAxB,CADO,CAAR;AAGAR,IAAAA,KAAK,CAACS,QAAN,CAAgBC,SAAhB,EAA2BC,KAA3B;AACA,GAND;;AAOA,QAAMG,MAAyB,GAAKC,KAAF,IAAa;AAAA;;AAC9CX,IAAAA,QAAQ,CAAE,EAAF,CAAR;AACA,qBAAAJ,KAAK,CAACc,MAAN,qEAAAd,KAAK,EAAWe,KAAX,CAAL;AACA,GAHD;;AAKA,SAAO;AAAEb,IAAAA,KAAF;AAASY,IAAAA,MAAT;AAAiBL,IAAAA;AAAjB,GAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport type { FocusEventHandler } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { InputChangeCallback } from './types';\n\n/**\n * Gets a CSS cursor value based on a drag direction.\n *\n * @param  dragDirection The drag direction.\n * @return  The CSS cursor value.\n */\nexport function getDragCursor( dragDirection: string ): string {\n\tlet dragCursor = 'ns-resize';\n\n\tswitch ( dragDirection ) {\n\t\tcase 'n':\n\t\tcase 's':\n\t\t\tdragCursor = 'ns-resize';\n\t\t\tbreak;\n\n\t\tcase 'e':\n\t\tcase 'w':\n\t\t\tdragCursor = 'ew-resize';\n\t\t\tbreak;\n\t}\n\n\treturn dragCursor;\n}\n\n/**\n * Custom hook that renders a drag cursor when dragging.\n *\n * @param {boolean} isDragging    The dragging state.\n * @param {string}  dragDirection The drag direction.\n *\n * @return {string} The CSS cursor value.\n */\nexport function useDragCursor(\n\tisDragging: boolean,\n\tdragDirection: string\n): string {\n\tconst dragCursor = getDragCursor( dragDirection );\n\n\tuseEffect( () => {\n\t\tif ( isDragging ) {\n\t\t\tdocument.documentElement.style.cursor = dragCursor;\n\t\t} else {\n\t\t\t// @ts-expect-error\n\t\t\tdocument.documentElement.style.cursor = null;\n\t\t}\n\t}, [ isDragging, dragCursor ] );\n\n\treturn dragCursor;\n}\n\nexport function useDraft( props: {\n\tvalue: string | undefined;\n\tonBlur?: FocusEventHandler;\n\tonChange: InputChangeCallback;\n} ) {\n\tconst refPreviousValue = useRef( props.value );\n\tconst [ draft, setDraft ] = useState< {\n\t\tvalue?: string;\n\t\tisStale?: boolean;\n\t} >( {} );\n\tconst value = draft.value !== undefined ? draft.value : props.value;\n\n\t// Determines when to discard the draft value to restore controlled status.\n\t// To do so, it tracks the previous value and marks the draft value as stale\n\t// after each render.\n\tuseLayoutEffect( () => {\n\t\tconst { current: previousValue } = refPreviousValue;\n\t\trefPreviousValue.current = props.value;\n\t\tif ( draft.value !== undefined && ! draft.isStale )\n\t\t\tsetDraft( { ...draft, isStale: true } );\n\t\telse if ( draft.isStale && props.value !== previousValue )\n\t\t\tsetDraft( {} );\n\t}, [ props.value, draft ] );\n\n\tconst onChange: InputChangeCallback = ( nextValue, extra ) => {\n\t\t// Mutates the draft value to avoid an extra effect run.\n\t\tsetDraft( ( current ) =>\n\t\t\tObject.assign( current, { value: nextValue, isStale: false } )\n\t\t);\n\t\tprops.onChange( nextValue, extra );\n\t};\n\tconst onBlur: FocusEventHandler = ( event ) => {\n\t\tsetDraft( {} );\n\t\tprops.onBlur?.( event );\n\t};\n\n\treturn { value, onBlur, onChange };\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/input-control/utils.ts"],"names":["getDragCursor","dragDirection","dragCursor","useDragCursor","isDragging","document","documentElement","style","cursor","useDraft","props","refPreviousValue","value","draft","setDraft","undefined","current","previousValue","isStale","onChange","nextValue","extra","Object","assign","onBlur","event"],"mappings":";;;;;;;;;AAQA;;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAaA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,aAAT,CAAwBC,aAAxB,EAAwD;AAC9D,MAAIC,UAAU,GAAG,WAAjB;;AAEA,UAASD,aAAT;AACC,SAAK,GAAL;AACA,SAAK,GAAL;AACCC,MAAAA,UAAU,GAAG,WAAb;AACA;;AAED,SAAK,GAAL;AACA,SAAK,GAAL;AACCA,MAAAA,UAAU,GAAG,WAAb;AACA;AATF;;AAYA,SAAOA,UAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASC,aAAT,CACNC,UADM,EAENH,aAFM,EAGG;AACT,QAAMC,UAAU,GAAGF,aAAa,CAAEC,aAAF,CAAhC;AAEA,0BAAW,MAAM;AAChB,QAAKG,UAAL,EAAkB;AACjBC,MAAAA,QAAQ,CAACC,eAAT,CAAyBC,KAAzB,CAA+BC,MAA/B,GAAwCN,UAAxC;AACA,KAFD,MAEO;AACN;AACAG,MAAAA,QAAQ,CAACC,eAAT,CAAyBC,KAAzB,CAA+BC,MAA/B,GAAwC,IAAxC;AACA;AACD,GAPD,EAOG,CAAEJ,UAAF,EAAcF,UAAd,CAPH;AASA,SAAOA,UAAP;AACA;;AAEM,SAASO,QAAT,CAAmBC,KAAnB,EAIH;AACH,QAAMC,gBAAgB,GAAG,qBAAQD,KAAK,CAACE,KAAd,CAAzB;AACA,QAAM,CAAEC,KAAF,EAASC,QAAT,IAAsB,uBAGvB,EAHuB,CAA5B;AAIA,QAAMF,KAAK,GAAGC,KAAK,CAACD,KAAN,KAAgBG,SAAhB,GAA4BF,KAAK,CAACD,KAAlC,GAA0CF,KAAK,CAACE,KAA9D,CANG,CAQH;AACA;AACA;;AACA,gCAAiB,MAAM;AACtB,UAAM;AAAEI,MAAAA,OAAO,EAAEC;AAAX,QAA6BN,gBAAnC;AACAA,IAAAA,gBAAgB,CAACK,OAAjB,GAA2BN,KAAK,CAACE,KAAjC;AACA,QAAKC,KAAK,CAACD,KAAN,KAAgBG,SAAhB,IAA6B,CAAEF,KAAK,CAACK,OAA1C,EACCJ,QAAQ,CAAE,EAAE,GAAGD,KAAL;AAAYK,MAAAA,OAAO,EAAE;AAArB,KAAF,CAAR,CADD,KAEK,IAAKL,KAAK,CAACK,OAAN,IAAiBR,KAAK,CAACE,KAAN,KAAgBK,aAAtC,EACJH,QAAQ,CAAE,EAAF,CAAR;AACD,GAPD,EAOG,CAAEJ,KAAK,CAACE,KAAR,EAAeC,KAAf,CAPH;;AASA,QAAMM,QAA6B,GAAG,CAAEC,SAAF,EAAaC,KAAb,KAAwB;AAC7D;AACAP,IAAAA,QAAQ,CAAIE,OAAF,IACTM,MAAM,CAACC,MAAP,CAAeP,OAAf,EAAwB;AAAEJ,MAAAA,KAAK,EAAEQ,SAAT;AAAoBF,MAAAA,OAAO,EAAE;AAA7B,KAAxB,CADO,CAAR;AAGAR,IAAAA,KAAK,CAACS,QAAN,CAAgBC,SAAhB,EAA2BC,KAA3B;AACA,GAND;;AAOA,QAAMG,MAAyB,GAAKC,KAAF,IAAa;AAAA;;AAC9CX,IAAAA,QAAQ,CAAE,EAAF,CAAR;AACA,qBAAAJ,KAAK,CAACc,MAAN,qEAAAd,KAAK,EAAWe,KAAX,CAAL;AACA,GAHD;;AAKA,SAAO;AAAEb,IAAAA,KAAF;AAASY,IAAAA,MAAT;AAAiBL,IAAAA;AAAjB,GAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport type { FocusEventHandler } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { InputChangeCallback } from './types';\n\n/**\n * Gets a CSS cursor value based on a drag direction.\n *\n * @param dragDirection The drag direction.\n * @return  The CSS cursor value.\n */\nexport function getDragCursor( dragDirection: string ): string {\n\tlet dragCursor = 'ns-resize';\n\n\tswitch ( dragDirection ) {\n\t\tcase 'n':\n\t\tcase 's':\n\t\t\tdragCursor = 'ns-resize';\n\t\t\tbreak;\n\n\t\tcase 'e':\n\t\tcase 'w':\n\t\t\tdragCursor = 'ew-resize';\n\t\t\tbreak;\n\t}\n\n\treturn dragCursor;\n}\n\n/**\n * Custom hook that renders a drag cursor when dragging.\n *\n * @param {boolean} isDragging    The dragging state.\n * @param {string}  dragDirection The drag direction.\n *\n * @return {string} The CSS cursor value.\n */\nexport function useDragCursor(\n\tisDragging: boolean,\n\tdragDirection: string\n): string {\n\tconst dragCursor = getDragCursor( dragDirection );\n\n\tuseEffect( () => {\n\t\tif ( isDragging ) {\n\t\t\tdocument.documentElement.style.cursor = dragCursor;\n\t\t} else {\n\t\t\t// @ts-expect-error\n\t\t\tdocument.documentElement.style.cursor = null;\n\t\t}\n\t}, [ isDragging, dragCursor ] );\n\n\treturn dragCursor;\n}\n\nexport function useDraft( props: {\n\tvalue: string | undefined;\n\tonBlur?: FocusEventHandler;\n\tonChange: InputChangeCallback;\n} ) {\n\tconst refPreviousValue = useRef( props.value );\n\tconst [ draft, setDraft ] = useState< {\n\t\tvalue?: string;\n\t\tisStale?: boolean;\n\t} >( {} );\n\tconst value = draft.value !== undefined ? draft.value : props.value;\n\n\t// Determines when to discard the draft value to restore controlled status.\n\t// To do so, it tracks the previous value and marks the draft value as stale\n\t// after each render.\n\tuseLayoutEffect( () => {\n\t\tconst { current: previousValue } = refPreviousValue;\n\t\trefPreviousValue.current = props.value;\n\t\tif ( draft.value !== undefined && ! draft.isStale )\n\t\t\tsetDraft( { ...draft, isStale: true } );\n\t\telse if ( draft.isStale && props.value !== previousValue )\n\t\t\tsetDraft( {} );\n\t}, [ props.value, draft ] );\n\n\tconst onChange: InputChangeCallback = ( nextValue, extra ) => {\n\t\t// Mutates the draft value to avoid an extra effect run.\n\t\tsetDraft( ( current ) =>\n\t\t\tObject.assign( current, { value: nextValue, isStale: false } )\n\t\t);\n\t\tprops.onChange( nextValue, extra );\n\t};\n\tconst onBlur: FocusEventHandler = ( event ) => {\n\t\tsetDraft( {} );\n\t\tprops.onBlur?.( event );\n\t};\n\n\treturn { value, onBlur, onChange };\n}\n"]}

package/build/menu-items-choice/index.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = MenuItemsChoice;
+exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
@@ -21,6 +21,40 @@ var _menuItem = _interopRequireDefault(require("../menu-item"));
  * Internal dependencies
  */
 const noop = () => {};
+/**
+ * `MenuItemsChoice` functions similarly to a set of `MenuItem`s, but allows the user to select one option from a set of multiple choices.
+ *
+ *
+ * ```jsx
+ * import { MenuGroup, MenuItemsChoice } from '@wordpress/components';
+ * import { useState } from '@wordpress/element';
+ *
+ * const MyMenuItemsChoice = () => {
+ * 	const [ mode, setMode ] = useState( 'visual' );
+ * 	const choices = [
+ * 		{
+ * 			value: 'visual',
+ * 			label: 'Visual editor',
+ * 		},
+ * 		{
+ * 			value: 'text',
+ * 			label: 'Code editor',
+ * 		},
+ * 	];
+ *
+ * 	return (
+ * 		<MenuGroup label="Editor">
+ * 			<MenuItemsChoice
+ * 				choices={ choices }
+ * 				value={ mode }
+ * 				onSelect={ ( newMode ) => setMode( newMode ) }
+ * 			/>
+ * 		</MenuGroup>
+ * 	);
+ * };
+ * ```
+ */
+
 
 function MenuItemsChoice(_ref) {
   let {
@@ -29,7 +63,7 @@ function MenuItemsChoice(_ref) {
     onSelect,
     value
   } = _ref;
-  return choices.map(item => {
+  return (0, _element.createElement)(_element.Fragment, null, choices.map(item => {
     const isSelected = value === item.value;
     return (0, _element.createElement)(_menuItem.default, {
       key: item.value,
@@ -48,6 +82,9 @@ function MenuItemsChoice(_ref) {
       onMouseLeave: () => onHover(null),
       "aria-label": item['aria-label']
     }, item.label);
-  });
+  }));
 }
+
+var _default = MenuItemsChoice;
+exports.default = _default;
 //# sourceMappingURL=index.js.map

package/build/menu-items-choice/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/menu-items-choice/index.js"],"names":["noop","MenuItemsChoice","choices","onHover","onSelect","value","map","item","isSelected","check","info","shortcut","label"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAMA,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEe,SAASC,eAAT,OAKX;AAAA,MALqC;AACxCC,IAAAA,OAAO,GAAG,EAD8B;AAExCC,IAAAA,OAAO,GAAGH,IAF8B;AAGxCI,IAAAA,QAHwC;AAIxCC,IAAAA;AAJwC,GAKrC;AACH,SAAOH,OAAO,CAACI,GAAR,CAAeC,IAAF,IAAY;AAC/B,UAAMC,UAAU,GAAGH,KAAK,KAAKE,IAAI,CAACF,KAAlC;AACA,WACC,4BAAC,iBAAD;AACC,MAAA,GAAG,EAAGE,IAAI,CAACF,KADZ;AAEC,MAAA,IAAI,EAAC,eAFN;AAGC,MAAA,IAAI,EAAGG,UAAU,IAAIC,YAHtB;AAIC,MAAA,IAAI,EAAGF,IAAI,CAACG,IAJb;AAKC,MAAA,UAAU,EAAGF,UALd;AAMC,MAAA,QAAQ,EAAGD,IAAI,CAACI,QANjB;AAOC,MAAA,SAAS,EAAC,8BAPX;AAQC,MAAA,OAAO,EAAG,MAAM;AACf,YAAK,CAAEH,UAAP,EAAoB;AACnBJ,UAAAA,QAAQ,CAAEG,IAAI,CAACF,KAAP,CAAR;AACA;AACD,OAZF;AAaC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAEI,IAAI,CAACF,KAAP,CAb7B;AAcC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAE,IAAF,CAd7B;AAeC,oBAAaI,IAAI,CAAE,YAAF;AAflB,OAiBGA,IAAI,CAACK,KAjBR,CADD;AAqBA,GAvBM,CAAP;AAwBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport MenuItem from '../menu-item';\n\nconst noop = () => {};\n\nexport default function MenuItemsChoice( {\n\tchoices = [],\n\tonHover = noop,\n\tonSelect,\n\tvalue,\n} ) {\n\treturn choices.map( ( item ) => {\n\t\tconst isSelected = value === item.value;\n\t\treturn (\n\t\t\t<MenuItem\n\t\t\t\tkey={ item.value }\n\t\t\t\trole=\"menuitemradio\"\n\t\t\t\ticon={ isSelected && check }\n\t\t\t\tinfo={ item.info }\n\t\t\t\tisSelected={ isSelected }\n\t\t\t\tshortcut={ item.shortcut }\n\t\t\t\tclassName=\"components-menu-items-choice\"\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\tonMouseEnter={ () => onHover( item.value ) }\n\t\t\t\tonMouseLeave={ () => onHover( null ) }\n\t\t\t\taria-label={ item[ 'aria-label' ] }\n\t\t\t>\n\t\t\t\t{ item.label }\n\t\t\t</MenuItem>\n\t\t);\n\t} );\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/menu-items-choice/index.tsx"],"names":["noop","MenuItemsChoice","choices","onHover","onSelect","value","map","item","isSelected","check","info","shortcut","label"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAIA,MAAMA,IAAI,GAAG,MAAM,CAAE,CAArB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASC,eAAT,OAK0B;AAAA,MALA;AACzBC,IAAAA,OAAO,GAAG,EADe;AAEzBC,IAAAA,OAAO,GAAGH,IAFe;AAGzBI,IAAAA,QAHyB;AAIzBC,IAAAA;AAJyB,GAKA;AACzB,SACC,qDACGH,OAAO,CAACI,GAAR,CAAeC,IAAF,IAAY;AAC1B,UAAMC,UAAU,GAAGH,KAAK,KAAKE,IAAI,CAACF,KAAlC;AACA,WACC,4BAAC,iBAAD;AACC,MAAA,GAAG,EAAGE,IAAI,CAACF,KADZ;AAEC,MAAA,IAAI,EAAC,eAFN;AAGC,MAAA,IAAI,EAAGG,UAAU,IAAIC,YAHtB;AAIC,MAAA,IAAI,EAAGF,IAAI,CAACG,IAJb;AAKC,MAAA,UAAU,EAAGF,UALd;AAMC,MAAA,QAAQ,EAAGD,IAAI,CAACI,QANjB;AAOC,MAAA,SAAS,EAAC,8BAPX;AAQC,MAAA,OAAO,EAAG,MAAM;AACf,YAAK,CAAEH,UAAP,EAAoB;AACnBJ,UAAAA,QAAQ,CAAEG,IAAI,CAACF,KAAP,CAAR;AACA;AACD,OAZF;AAaC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAEI,IAAI,CAACF,KAAP,CAb7B;AAcC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAE,IAAF,CAd7B;AAeC,oBAAaI,IAAI,CAAE,YAAF;AAflB,OAiBGA,IAAI,CAACK,KAjBR,CADD;AAqBA,GAvBC,CADH,CADD;AA4BA;;eAEcX,e","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport MenuItem from '../menu-item';\nimport type { MenuItemsChoiceProps } from './types';\n\nconst noop = () => {};\n\n/**\n * `MenuItemsChoice` functions similarly to a set of `MenuItem`s, but allows the user to select one option from a set of multiple choices.\n *\n *\n * ```jsx\n * import { MenuGroup, MenuItemsChoice } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyMenuItemsChoice = () => {\n * \tconst [ mode, setMode ] = useState( 'visual' );\n * \tconst choices = [\n * \t\t{\n * \t\t\tvalue: 'visual',\n * \t\t\tlabel: 'Visual editor',\n * \t\t},\n * \t\t{\n * \t\t\tvalue: 'text',\n * \t\t\tlabel: 'Code editor',\n * \t\t},\n * \t];\n *\n * \treturn (\n * \t\t<MenuGroup label=\"Editor\">\n * \t\t\t<MenuItemsChoice\n * \t\t\t\tchoices={ choices }\n * \t\t\t\tvalue={ mode }\n * \t\t\t\tonSelect={ ( newMode ) => setMode( newMode ) }\n * \t\t\t/>\n * \t\t</MenuGroup>\n * \t);\n * };\n * ```\n */\nfunction MenuItemsChoice( {\n\tchoices = [],\n\tonHover = noop,\n\tonSelect,\n\tvalue,\n}: MenuItemsChoiceProps ) {\n\treturn (\n\t\t<>\n\t\t\t{ choices.map( ( item ) => {\n\t\t\t\tconst isSelected = value === item.value;\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ item.value }\n\t\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\t\ticon={ isSelected && check }\n\t\t\t\t\t\tinfo={ item.info }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tshortcut={ item.shortcut }\n\t\t\t\t\t\tclassName=\"components-menu-items-choice\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonMouseEnter={ () => onHover( item.value ) }\n\t\t\t\t\t\tonMouseLeave={ () => onHover( null ) }\n\t\t\t\t\t\taria-label={ item[ 'aria-label' ] }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n\nexport default MenuItemsChoice;\n"]}

package/build/menu-items-choice/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/build/menu-items-choice/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/build/modal/index.js

@@ -19,6 +19,8 @@ var _i18n = require("@wordpress/i18n");
 
 var _icons = require("@wordpress/icons");
 
+var _dom = require("@wordpress/dom");
+
 var ariaHelper = _interopRequireWildcard(require("./aria-helper"));
 
 var _button = _interopRequireDefault(require("../button"));
@@ -77,7 +79,24 @@ function UnforwardedModal(props, forwardedRef) {
   const constrainedTabbingRef = (0, _compose.useConstrainedTabbing)();
   const focusReturnRef = (0, _compose.useFocusReturn)();
   const focusOutsideProps = (0, _compose.__experimentalUseFocusOutside)(onRequestClose);
+  const contentRef = (0, _element.useRef)(null);
+  const childrenContainerRef = (0, _element.useRef)(null);
   const [hasScrolledContent, setHasScrolledContent] = (0, _element.useState)(false);
+  const [hasScrollableContent, setHasScrollableContent] = (0, _element.useState)(false); // Determines whether the Modal content is scrollable and updates the state.
+
+  const isContentScrollable = (0, _element.useCallback)(() => {
+    if (!contentRef.current) {
+      return;
+    }
+
+    const closestScrollContainer = (0, _dom.getScrollContainer)(contentRef.current);
+
+    if (contentRef.current === closestScrollContainer) {
+      setHasScrollableContent(true);
+    } else {
+      setHasScrollableContent(false);
+    }
+  }, [contentRef]);
   (0, _element.useEffect)(() => {
     openModalCount++;
 
@@ -94,7 +113,20 @@ function UnforwardedModal(props, forwardedRef) {
         ariaHelper.showApp();
       }
     };
-  }, [bodyOpenClassName]);
+  }, [bodyOpenClassName]); // Calls the isContentScrollable callback when the Modal children container resizes.
+
+  (0, _element.useLayoutEffect)(() => {
+    if (!window.ResizeObserver || !childrenContainerRef.current) {
+      return;
+    }
+
+    const resizeObserver = new ResizeObserver(isContentScrollable);
+    resizeObserver.observe(childrenContainerRef.current);
+    isContentScrollable();
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [isContentScrollable, childrenContainerRef]);
 
   function handleEscapeKeyDown(event) {
     if ( // Ignore keydowns from IMEs
@@ -148,10 +180,14 @@ function UnforwardedModal(props, forwardedRef) {
   }), (0, _element.createElement)("div", {
     className: (0, _classnames.default)('components-modal__content', {
       'hide-header': __experimentalHideHeader,
+      'is-scrollable': hasScrollableContent,
       'has-scrolled-content': hasScrolledContent
     }),
     role: "document",
-    onScroll: onContentContainerScroll
+    onScroll: onContentContainerScroll,
+    ref: contentRef,
+    "aria-label": hasScrollableContent ? (0, _i18n.__)('Scrollable section') : undefined,
+    tabIndex: hasScrollableContent ? 0 : undefined
   }, !__experimentalHideHeader && (0, _element.createElement)("div", {
     className: "components-modal__header"
   }, (0, _element.createElement)("div", {
@@ -166,7 +202,9 @@ function UnforwardedModal(props, forwardedRef) {
     onClick: onRequestClose,
     icon: _icons.close,
     label: closeButtonLabel || (0, _i18n.__)('Close')
-  })), children)))), document.body);
+  })), (0, _element.createElement)("div", {
+    ref: childrenContainerRef
+  }, children))))), document.body);
 }
 /**
  * Modals give users information and choices related to a task they’re trying to

package/build/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/modal/index.tsx"],"names":["openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","focusOutsideProps","hasScrolledContent","setHasScrolledContent","ariaHelper","hideApp","current","document","body","classList","add","remove","showApp","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","scrollY","currentTarget","scrollTop","close"],"mappings":";;;;;;;;;AASA;;;;AANA;;AAcA;;AAQA;;AACA;;AAKA;;AACA;;AACA;;;;;;AAjCA;AACA;AACA;;AAIA;AACA;AACA;;AAoBA;AACA;AACA;AAMA;AACA,IAAIA,cAAc,GAAG,CAArB;;AAEA,SAASC,gBAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAM;AACLC,IAAAA,iBAAiB,GAAG,YADf;AAELC,IAAAA,IAAI,GAAG,QAFF;AAGLC,IAAAA,KAAK,GAAG,IAHH;AAILC,IAAAA,YAAY,GAAG,IAJV;AAKLC,IAAAA,gBAAgB,GAAG,IALd;AAMLC,IAAAA,yBAAyB,GAAG,IANvB;AAOLC,IAAAA,aAAa,GAAG,IAPX;;AAQL;AACAC,IAAAA,IAAI,GAAG;AACNC,MAAAA,UAAU,EAAEC,SADN;AAENC,MAAAA,WAAW,EAAED;AAFP,KATF;AAaLE,IAAAA,cAbK;AAcLC,IAAAA,IAdK;AAeLC,IAAAA,gBAfK;AAgBLC,IAAAA,QAhBK;AAiBLC,IAAAA,KAjBK;AAkBLC,IAAAA,gBAlBK;AAmBLC,IAAAA,SAnBK;AAoBLC,IAAAA,YApBK;AAqBLC,IAAAA,SArBK;AAsBLC,IAAAA,YAAY,GAAG,KAtBV;AAuBLC,IAAAA,wBAAwB,GAAG;AAvBtB,MAwBFvB,KAxBJ;AA0BA,QAAMwB,GAAG,GAAG,sBAAZ;AACA,QAAMC,UAAU,GAAG,4BAAeC,KAAf,CAAnB;AACA,QAAMC,SAAS,GAAGvB,KAAK,GACnB,2BAA2BqB,UAAY,EADpB,GAEpBhB,IAAI,CAACC,UAFR;AAGA,QAAMkB,eAAe,GAAG,8BAAiBvB,YAAjB,CAAxB;AACA,QAAMwB,qBAAqB,GAAG,qCAA9B;AACA,QAAMC,cAAc,GAAG,8BAAvB;AACA,QAAMC,iBAAiB,GAAG,4CAAiBlB,cAAjB,CAA1B;AAEA,QAAM,CAAEmB,kBAAF,EAAsBC,qBAAtB,IAAgD,uBAAU,KAAV,CAAtD;AAEA,0BAAW,MAAM;AAChBnC,IAAAA,cAAc;;AAEd,QAAKA,cAAc,KAAK,CAAxB,EAA4B;AAC3BoC,MAAAA,UAAU,CAACC,OAAX,CAAoBX,GAAG,CAACY,OAAxB;AACAC,MAAAA,QAAQ,CAACC,IAAT,CAAcC,SAAd,CAAwBC,GAAxB,CAA6BtC,iBAA7B;AACA;;AAED,WAAO,MAAM;AACZJ,MAAAA,cAAc;;AAEd,UAAKA,cAAc,KAAK,CAAxB,EAA4B;AAC3BuC,QAAAA,QAAQ,CAACC,IAAT,CAAcC,SAAd,CAAwBE,MAAxB,CAAgCvC,iBAAhC;AACAgC,QAAAA,UAAU,CAACQ,OAAX;AACA;AACD,KAPD;AAQA,GAhBD,EAgBG,CAAExC,iBAAF,CAhBH;;AAkBA,WAASyC,mBAAT,CAA8BC,KAA9B,EAAuE;AACtE,SACC;AACAA,IAAAA,KAAK,CAACC,WAAN,CAAkBC,WAAlB,IACA;AACA;AACA;AACAF,IAAAA,KAAK,CAACG,OAAN,KAAkB,GANnB,EAOE;AACD;AACA;;AAED,QACCzC,gBAAgB,IAChBsC,KAAK,CAACI,IAAN,KAAe,QADf,IAEA,CAAEJ,KAAK,CAACK,gBAHT,EAIE;AACDL,MAAAA,KAAK,CAACM,cAAN;;AACA,UAAKrC,cAAL,EAAsB;AACrBA,QAAAA,cAAc,CAAE+B,KAAF,CAAd;AACA;AACD;AACD;;AAED,QAAMO,wBAAwB,GAAG,0BAC9BC,CAAF,IAAoC;AAAA;;AACnC,UAAMC,OAAO,4BAAGD,CAAH,aAAGA,CAAH,2CAAGA,CAAC,CAAEE,aAAN,qDAAG,iBAAkBC,SAArB,yEAAkC,CAAC,CAAhD;;AAEA,QAAK,CAAEvB,kBAAF,IAAwBqB,OAAO,GAAG,CAAvC,EAA2C;AAC1CpB,MAAAA,qBAAqB,CAAE,IAAF,CAArB;AACA,KAFD,MAEO,IAAKD,kBAAkB,IAAIqB,OAAO,IAAI,CAAtC,EAA0C;AAChDpB,MAAAA,qBAAqB,CAAE,KAAF,CAArB;AACA;AACD,GAT+B,EAUhC,CAAED,kBAAF,CAVgC,CAAjC;AAaA,SAAO,4BACN;AACA;AACC,IAAA,GAAG,EAAG,2BAAc,CAAER,GAAF,EAAOvB,YAAP,CAAd,CADP;AAEC,IAAA,SAAS,EAAG,yBACX,kCADW,EAEXiB,gBAFW,CAFb;AAMC,IAAA,SAAS,EAAGyB;AANb,KAQC,4BAAC,sBAAD;AAAe,IAAA,QAAQ,EAAGN;AAA1B,KACC;AACC,IAAA,SAAS,EAAG,yBACX,yBADW,EAEXlB,SAFW,EAGX;AACC,wBAAkBG;AADnB,KAHW,CADb;AAQC,IAAA,KAAK,EAAGL,KART;AASC,IAAA,GAAG,EAAG,2BAAc,CACnBY,qBADmB,EAEnBC,cAFmB,EAGnBF,eAHmB,CAAd,CATP;AAcC,IAAA,IAAI,EAAGzB,IAdR;AAeC,kBAAaiB,YAfd;AAgBC,uBAAkBA,YAAY,GAAGT,SAAH,GAAegB,SAhB9C;AAiBC,wBAAmBlB,IAAI,CAACG,WAjBzB;AAkBC,IAAA,QAAQ,EAAG,CAAC;AAlBb,KAmBQL,yBAAyB,GAC7BwB,iBAD6B,GAE7B,EArBJ;AAsBC,IAAA,SAAS,EAAGV;AAtBb,MAwBC;AACC,IAAA,SAAS,EAAG,yBAAY,2BAAZ,EAAyC;AACpD,qBAAeE,wBADqC;AAEpD,8BAAwBS;AAF4B,KAAzC,CADb;AAKC,IAAA,IAAI,EAAC,UALN;AAMC,IAAA,QAAQ,EAAGmB;AANZ,KAQG,CAAE5B,wBAAF,IACD;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGT,IAAI,IACL;AACC,IAAA,SAAS,EAAC,kCADX;AAEC;AAFD,KAIGA,IAJH,CAFF,EASGV,KAAK,IACN;AACC,IAAA,EAAE,EAAGuB,SADN;AAEC,IAAA,SAAS,EAAC;AAFX,KAIGvB,KAJH,CAVF,CADD,EAmBGI,aAAa,IACd,4BAAC,eAAD;AACC,IAAA,OAAO,EAAGK,cADX;AAEC,IAAA,IAAI,EAAG2C,YAFR;AAGC,IAAA,KAAK,EACJzC,gBAAgB,IAAI,cAAI,OAAJ;AAJtB,IApBF,CATF,EAuCGC,QAvCH,CAxBD,CADD,CARD,CAFM,EA+ENqB,QAAQ,CAACC,IA/EH,CAAP;AAiFA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMZ,KAAK,GAAG,yBAAY3B,gBAAZ,CAAd;;eAEQ2B,K","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel || __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n *   const [ isOpen, setOpen ] = useState( false );\n *   const openModal = () => setOpen( true );\n *   const closeModal = () => setOpen( false );\n *\n *   return (\n *     <>\n *       <Button variant=\"secondary\" onClick={ openModal }>\n *         Open Modal\n *       </Button>\n *       { isOpen && (\n *         <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n *           <Button variant=\"secondary\" onClick={ closeModal }>\n *             My custom close button\n *           </Button>\n *         </Modal>\n *       ) }\n *     </>\n *   );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"]}
+{"version":3,"sources":["@wordpress/components/src/modal/index.tsx"],"names":["openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","focusOutsideProps","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","hasScrollableContent","setHasScrollableContent","isContentScrollable","current","closestScrollContainer","ariaHelper","hideApp","document","body","classList","add","remove","showApp","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","scrollY","currentTarget","scrollTop","close"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver || ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel || __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<div ref={ childrenContainerRef }>{ children }</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n *   const [ isOpen, setOpen ] = useState( false );\n *   const openModal = () => setOpen( true );\n *   const closeModal = () => setOpen( false );\n *\n *   return (\n *     <>\n *       <Button variant=\"secondary\" onClick={ openModal }>\n *         Open Modal\n *       </Button>\n *       { isOpen && (\n *         <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n *           <Button variant=\"secondary\" onClick={ closeModal }>\n *             My custom close button\n *           </Button>\n *         </Modal>\n *       ) }\n *     </>\n *   );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"]}

package/build/palette-edit/index.js

@@ -276,6 +276,7 @@ function PaletteEdit(_ref6) {
     colors = EMPTY_ARRAY,
     onChange,
     paletteLabel,
+    paletteLabelHeadingLevel = 2,
     emptyMessage,
     canOnlyChangeValues,
     canReset,
@@ -299,7 +300,9 @@ function PaletteEdit(_ref6) {
       setIsEditing(true);
     }
   }, [isGradient, elements]);
-  return (0, _element.createElement)(_styles.PaletteEditStyles, null, (0, _element.createElement)(_styles.PaletteHStackHeader, null, (0, _element.createElement)(_styles.PaletteHeading, null, paletteLabel), (0, _element.createElement)(_styles.PaletteActionsContainer, null, hasElements && isEditing && (0, _element.createElement)(_styles.DoneButton, {
+  return (0, _element.createElement)(_styles.PaletteEditStyles, null, (0, _element.createElement)(_styles.PaletteHStackHeader, null, (0, _element.createElement)(_styles.PaletteHeading, {
+    level: paletteLabelHeadingLevel
+  }, paletteLabel), (0, _element.createElement)(_styles.PaletteActionsContainer, null, hasElements && isEditing && (0, _element.createElement)(_styles.DoneButton, {
     isSmall: true,
     onClick: () => {
       setIsEditing(false);