@wordpress/block-editor 10.0.8 → 10.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/build/components/font-sizes/fluid-utils.js +21 -69
  2. package/build/components/font-sizes/fluid-utils.js.map +1 -1
  3. package/build-module/components/font-sizes/fluid-utils.js +21 -69
  4. package/build-module/components/font-sizes/fluid-utils.js.map +1 -1
  5. package/package.json +2 -2
  6. package/src/components/font-sizes/fluid-utils.js +25 -100
  7. package/src/components/font-sizes/test/fluid-utils.js +5 -5
package/build/components/font-sizes/fluid-utils.js CHANGED
@@ -18,7 +18,6 @@ const DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';
18
18
  const DEFAULT_SCALE_FACTOR = 1;
19
19
  const DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;
20
20
  const DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;
21
- const DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';
22
21
  /**
23
22
  * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum
24
23
  * font size OR a single font size can be specified.
@@ -62,22 +61,13 @@ function getComputedFluidTypographyValue(_ref) {
62
61
  maximumViewPortWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,
63
62
  scaleFactor = DEFAULT_SCALE_FACTOR,
64
63
  minimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,
65
- maximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,
66
- minimumFontSizeLimit = DEFAULT_MINIMUM_FONT_SIZE_LIMIT
64
+ maximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR
67
65
  } = _ref;
68
66
 
69
- /*
70
- * Caches minimumFontSize in minimumFontSizeValue
71
- * so we can check if minimumFontSize exists later.
72
- */
73
- let minimumFontSizeValue = minimumFontSize;
74
- /*
75
- * Calculates missing minimumFontSize and maximumFontSize from
76
- * defaultFontSize if provided.
77
- */
78
-
79
- if (fontSize) {
80
- // Parses default font size.
67
+ // Calculate missing minimumFontSize and maximumFontSize from
68
+ // defaultFontSize if provided.
69
+ if (fontSize && (!minimumFontSize || !maximumFontSize)) {
70
+ // Parse default font size.
81
71
  const fontSizeParsed = getTypographyValueAndUnit(fontSize); // Protect against invalid units.
82
72
 
83
73
  if (!(fontSizeParsed !== null && fontSizeParsed !== void 0 && fontSizeParsed.unit)) {
@@ -85,65 +75,37 @@ function getComputedFluidTypographyValue(_ref) {
85
75
  } // If no minimumFontSize is provided, derive using min scale factor.
86
76
 
87
77
 
88
- if (!minimumFontSizeValue) {
89
- minimumFontSizeValue = roundToPrecision(fontSizeParsed.value * minimumFontSizeFactor, 3) + fontSizeParsed.unit;
90
- } // Parses the minimum font size limit, so we can perform checks using it.
91
-
92
-
93
- const minimumFontSizeLimitParsed = getTypographyValueAndUnit(minimumFontSizeLimit, {
94
- coerceTo: fontSizeParsed.unit
95
- });
96
-
97
- if (!!(minimumFontSizeLimitParsed !== null && minimumFontSizeLimitParsed !== void 0 && minimumFontSizeLimitParsed.value)) {
98
- /*
99
- * If a minimum size was not passed to this function
100
- * and the user-defined font size is lower than `minimumFontSizeLimit`,
101
- * then uses the user-defined font size as the minimum font-size.
102
- */
103
- if (!minimumFontSize && (fontSizeParsed === null || fontSizeParsed === void 0 ? void 0 : fontSizeParsed.value) < (minimumFontSizeLimitParsed === null || minimumFontSizeLimitParsed === void 0 ? void 0 : minimumFontSizeLimitParsed.value)) {
104
- minimumFontSizeValue = `${fontSizeParsed.value}${fontSizeParsed.unit}`;
105
- } else {
106
- const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSizeValue, {
107
- coerceTo: fontSizeParsed.unit
108
- });
109
- /*
110
- * Otherwise, if the passed or calculated minimum font size is lower than `minimumFontSizeLimit`
111
- * use `minimumFontSizeLimit` instead.
112
- */
113
-
114
- if (!!(minimumFontSizeParsed !== null && minimumFontSizeParsed !== void 0 && minimumFontSizeParsed.value) && minimumFontSizeParsed.value < minimumFontSizeLimitParsed.value) {
115
- minimumFontSizeValue = `${minimumFontSizeLimitParsed.value}${minimumFontSizeLimitParsed.unit}`;
116
- }
117
- }
78
+ if (!minimumFontSize) {
79
+ minimumFontSize = fontSizeParsed.value * minimumFontSizeFactor + fontSizeParsed.unit;
118
80
  } // If no maximumFontSize is provided, derive using max scale factor.
119
81
 
120
82
 
121
83
  if (!maximumFontSize) {
122
- maximumFontSize = roundToPrecision(fontSizeParsed.value * maximumFontSizeFactor, 3) + fontSizeParsed.unit;
84
+ maximumFontSize = fontSizeParsed.value * maximumFontSizeFactor + fontSizeParsed.unit;
123
85
  }
124
86
  } // Return early if one of the provided inputs is not provided.
125
87
 
126
88
 
127
- if (!minimumFontSizeValue || !maximumFontSize) {
89
+ if (!minimumFontSize || !maximumFontSize) {
128
90
  return null;
129
91
  } // Grab the minimum font size and normalize it in order to use the value for calculations.
130
92
 
131
93
 
132
- const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSizeValue); // We get a 'preferred' unit to keep units consistent when calculating,
94
+ const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSize); // We get a 'preferred' unit to keep units consistent when calculating,
133
95
  // otherwise the result will not be accurate.
134
96
 
135
- const fontSizeUnit = (minimumFontSizeParsed === null || minimumFontSizeParsed === void 0 ? void 0 : minimumFontSizeParsed.unit) || 'rem'; // Grabs the maximum font size and normalize it in order to use the value for calculations.
97
+ const fontSizeUnit = (minimumFontSizeParsed === null || minimumFontSizeParsed === void 0 ? void 0 : minimumFontSizeParsed.unit) || 'rem'; // Grab the maximum font size and normalize it in order to use the value for calculations.
136
98
 
137
99
  const maximumFontSizeParsed = getTypographyValueAndUnit(maximumFontSize, {
138
100
  coerceTo: fontSizeUnit
139
- }); // Checks for mandatory min and max sizes, and protects against unsupported units.
101
+ }); // Protect against unsupported units.
140
102
 
141
103
  if (!minimumFontSizeParsed || !maximumFontSizeParsed) {
142
104
  return null;
143
- } // Uses rem for accessible fluid target font scaling.
105
+ } // Use rem for accessible fluid target font scaling.
144
106
 
145
107
 
146
- const minimumFontSizeRem = getTypographyValueAndUnit(minimumFontSizeValue, {
108
+ const minimumFontSizeRem = getTypographyValueAndUnit(minimumFontSize, {
147
109
  coerceTo: 'rem'
148
110
  }); // Viewport widths defined for fluid typography. Normalize units
149
111
 
@@ -161,11 +123,12 @@ function getComputedFluidTypographyValue(_ref) {
161
123
 
162
124
 
163
125
  const minViewPortWidthOffsetValue = roundToPrecision(minumumViewPortWidthParsed.value / 100, 3);
164
- const viewPortWidthOffset = roundToPrecision(minViewPortWidthOffsetValue, 3) + fontSizeUnit;
165
- const linearFactor = 100 * ((maximumFontSizeParsed.value - minimumFontSizeParsed.value) / (maximumViewPortWidthParsed.value - minumumViewPortWidthParsed.value));
166
- const linearFactorScaled = roundToPrecision((linearFactor || 1) * scaleFactor, 3);
126
+ const viewPortWidthOffset = minViewPortWidthOffsetValue + fontSizeUnit;
127
+ let linearFactor = 100 * ((maximumFontSizeParsed.value - minimumFontSizeParsed.value) / (maximumViewPortWidthParsed.value - minumumViewPortWidthParsed.value));
128
+ linearFactor = roundToPrecision(linearFactor, 3) || 1;
129
+ const linearFactorScaled = linearFactor * scaleFactor;
167
130
  const fluidTargetFontSize = `${minimumFontSizeRem.value}${minimumFontSizeRem.unit} + ((1vw - ${viewPortWidthOffset}) * ${linearFactorScaled})`;
168
- return `clamp(${minimumFontSizeValue}, ${fluidTargetFontSize}, ${maximumFontSize})`;
131
+ return `clamp(${minimumFontSize}, ${fluidTargetFontSize}, ${maximumFontSize})`;
169
132
  }
170
133
  /**
171
134
  * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].
@@ -221,19 +184,9 @@ function getTypographyValueAndUnit(rawValue) {
221
184
  returnValue = returnValue / rootSizeValue;
222
185
  unit = coerceTo;
223
186
  }
224
- /*
225
- * No calculation is required if swapping between em and rem yet,
226
- * since we assume a root size value. Later we might like to differentiate between
227
- * :root font size (rem) and parent element font size (em) relativity.
228
- */
229
-
230
-
231
- if (('em' === coerceTo || 'rem' === coerceTo) && ('em' === unit || 'rem' === unit)) {
232
- unit = coerceTo;
233
- }
234
187
 
235
188
  return {
236
- value: roundToPrecision(returnValue, 3),
189
+ value: returnValue,
237
190
  unit
238
191
  };
239
192
  }
@@ -250,7 +203,6 @@ function getTypographyValueAndUnit(rawValue) {
250
203
 
251
204
  function roundToPrecision(value) {
252
205
  let digits = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3;
253
- const base = Math.pow(10, digits);
254
- return Number.isFinite(value) ? parseFloat(Math.round(value * base) / base) : undefined;
206
+ return Number.isFinite(value) ? parseFloat(value.toFixed(digits)) : undefined;
255
207
  }
256
208
  //# sourceMappingURL=fluid-utils.js.map
package/build/components/font-sizes/fluid-utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/fluid-utils.js"],"names":["DEFAULT_MAXIMUM_VIEWPORT_WIDTH","DEFAULT_MINIMUM_VIEWPORT_WIDTH","DEFAULT_SCALE_FACTOR","DEFAULT_MINIMUM_FONT_SIZE_FACTOR","DEFAULT_MAXIMUM_FONT_SIZE_FACTOR","DEFAULT_MINIMUM_FONT_SIZE_LIMIT","getComputedFluidTypographyValue","minimumFontSize","maximumFontSize","fontSize","minimumViewPortWidth","maximumViewPortWidth","scaleFactor","minimumFontSizeFactor","maximumFontSizeFactor","minimumFontSizeLimit","minimumFontSizeValue","fontSizeParsed","getTypographyValueAndUnit","unit","roundToPrecision","value","minimumFontSizeLimitParsed","coerceTo","minimumFontSizeParsed","fontSizeUnit","maximumFontSizeParsed","minimumFontSizeRem","maximumViewPortWidthParsed","minumumViewPortWidthParsed","minViewPortWidthOffsetValue","viewPortWidthOffset","linearFactor","linearFactorScaled","fluidTargetFontSize","rawValue","options","isFinite","rootSizeValue","acceptableUnits","acceptableUnitsGroup","join","regexUnits","RegExp","matches","match","length","returnValue","parseFloat","digits","base","Math","pow","Number","round","undefined"],"mappings":"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","sourcesContent":["/**\n * The fluid utilities must match the backend equivalent.\n * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php\n * ---------------------------------------------------------------\n */\n\n// Defaults.\nconst DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';\nconst DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';\nconst DEFAULT_SCALE_FACTOR = 1;\nconst DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;\nconst DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;\nconst DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';\n\n/**\n * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum\n * font size OR a single font size can be specified.\n *\n * If a single font size is specified, it is scaled up and down by\n * minimumFontSizeFactor and maximumFontSizeFactor to arrive at the minimum and\n * maximum sizes.\n *\n * @example\n * ```js\n * // Calculate fluid font-size value from a minimum and maximum value.\n * const fontSize = getComputedFluidTypographyValue( {\n * minimumFontSize: '20px',\n * maximumFontSize: '45px'\n * } );\n * // Calculate fluid font-size value from a single font size.\n * const fontSize = getComputedFluidTypographyValue( {\n * fontSize: '30px',\n * } );\n * ```\n *\n * @param {Object} args\n * @param {?string} args.minimumViewPortWidth Minimum viewport size from which type will have fluidity. Optional if fontSize is specified.\n * @param {?string} args.maximumViewPortWidth Maximum size up to which type will have fluidity. Optional if fontSize is specified.\n * @param {string|number} [args.fontSize] Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified.\n * @param {?string} args.maximumFontSize Maximum font size for any clamp() calculation. Optional.\n * @param {?string} args.minimumFontSize Minimum font size for any clamp() calculation. Optional.\n * @param {?number} args.scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional.\n * @param {?number} args.minimumFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional.\n * @param {?number} args.maximumFontSizeFactor How much to scale defaultFontSize by to derive maximumFontSize. Optional.\n *\n * @return {string|null} A font-size value using clamp().\n */\nexport function getComputedFluidTypographyValue( {\n\tminimumFontSize,\n\tmaximumFontSize,\n\tfontSize,\n\tminimumViewPortWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH,\n\tmaximumViewPortWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,\n\tscaleFactor = DEFAULT_SCALE_FACTOR,\n\tminimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,\n\tmaximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,\n\tminimumFontSizeLimit = DEFAULT_MINIMUM_FONT_SIZE_LIMIT,\n} ) {\n\t/*\n\t * Caches minimumFontSize in minimumFontSizeValue\n\t * so we can check if minimumFontSize exists later.\n\t */\n\tlet minimumFontSizeValue = minimumFontSize;\n\n\t/*\n\t * Calculates missing minimumFontSize and maximumFontSize from\n\t * defaultFontSize if provided.\n\t */\n\tif ( fontSize ) {\n\t\t// Parses default font size.\n\t\tconst fontSizeParsed = getTypographyValueAndUnit( fontSize );\n\n\t\t// Protect against invalid units.\n\t\tif ( ! fontSizeParsed?.unit ) {\n\t\t\treturn null;\n\t\t}\n\n\t\t// If no minimumFontSize is provided, derive using min scale factor.\n\t\tif ( ! minimumFontSizeValue ) {\n\t\t\tminimumFontSizeValue =\n\t\t\t\troundToPrecision(\n\t\t\t\t\tfontSizeParsed.value * minimumFontSizeFactor,\n\t\t\t\t\t3\n\t\t\t\t) + fontSizeParsed.unit;\n\t\t}\n\n\t\t// Parses the minimum font size limit, so we can perform checks using it.\n\t\tconst minimumFontSizeLimitParsed = getTypographyValueAndUnit(\n\t\t\tminimumFontSizeLimit,\n\t\t\t{\n\t\t\t\tcoerceTo: fontSizeParsed.unit,\n\t\t\t}\n\t\t);\n\n\t\tif ( !! minimumFontSizeLimitParsed?.value ) {\n\t\t\t/*\n\t\t\t * If a minimum size was not passed to this function\n\t\t\t * and the user-defined font size is lower than `minimumFontSizeLimit`,\n\t\t\t * then uses the user-defined font size as the minimum font-size.\n\t\t\t */\n\t\t\tif (\n\t\t\t\t! minimumFontSize &&\n\t\t\t\tfontSizeParsed?.value < minimumFontSizeLimitParsed?.value\n\t\t\t) {\n\t\t\t\tminimumFontSizeValue = `${ fontSizeParsed.value }${ fontSizeParsed.unit }`;\n\t\t\t} else {\n\t\t\t\tconst minimumFontSizeParsed = getTypographyValueAndUnit(\n\t\t\t\t\tminimumFontSizeValue,\n\t\t\t\t\t{\n\t\t\t\t\t\tcoerceTo: fontSizeParsed.unit,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\t/*\n\t\t\t\t * Otherwise, if the passed or calculated minimum font size is lower than `minimumFontSizeLimit`\n\t\t\t\t * use `minimumFontSizeLimit` instead.\n\t\t\t\t */\n\t\t\t\tif (\n\t\t\t\t\t!! minimumFontSizeParsed?.value &&\n\t\t\t\t\tminimumFontSizeParsed.value <\n\t\t\t\t\t\tminimumFontSizeLimitParsed.value\n\t\t\t\t) {\n\t\t\t\t\tminimumFontSizeValue = `${ minimumFontSizeLimitParsed.value }${ minimumFontSizeLimitParsed.unit }`;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// If no maximumFontSize is provided, derive using max scale factor.\n\t\tif ( ! maximumFontSize ) {\n\t\t\tmaximumFontSize =\n\t\t\t\troundToPrecision(\n\t\t\t\t\tfontSizeParsed.value * maximumFontSizeFactor,\n\t\t\t\t\t3\n\t\t\t\t) + fontSizeParsed.unit;\n\t\t}\n\t}\n\n\t// Return early if one of the provided inputs is not provided.\n\tif ( ! minimumFontSizeValue || ! maximumFontSize ) {\n\t\treturn null;\n\t}\n\n\t// Grab the minimum font size and normalize it in order to use the value for calculations.\n\tconst minimumFontSizeParsed =\n\t\tgetTypographyValueAndUnit( minimumFontSizeValue );\n\n\t// We get a 'preferred' unit to keep units consistent when calculating,\n\t// otherwise the result will not be accurate.\n\tconst fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';\n\n\t// Grabs the maximum font size and normalize it in order to use the value for calculations.\n\tconst maximumFontSizeParsed = getTypographyValueAndUnit( maximumFontSize, {\n\t\tcoerceTo: fontSizeUnit,\n\t} );\n\n\t// Checks for mandatory min and max sizes, and protects against unsupported units.\n\tif ( ! minimumFontSizeParsed || ! maximumFontSizeParsed ) {\n\t\treturn null;\n\t}\n\n\t// Uses rem for accessible fluid target font scaling.\n\tconst minimumFontSizeRem = getTypographyValueAndUnit(\n\t\tminimumFontSizeValue,\n\t\t{\n\t\t\tcoerceTo: 'rem',\n\t\t}\n\t);\n\n\t// Viewport widths defined for fluid typography. Normalize units\n\tconst maximumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tmaximumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\tconst minumumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tminimumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\n\t// Protect against unsupported units.\n\tif (\n\t\t! maximumViewPortWidthParsed ||\n\t\t! minumumViewPortWidthParsed ||\n\t\t! minimumFontSizeRem\n\t) {\n\t\treturn null;\n\t}\n\n\t// Build CSS rule.\n\t// Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.\n\tconst minViewPortWidthOffsetValue = roundToPrecision(\n\t\tminumumViewPortWidthParsed.value / 100,\n\t\t3\n\t);\n\n\tconst viewPortWidthOffset =\n\t\troundToPrecision( minViewPortWidthOffsetValue, 3 ) + fontSizeUnit;\n\tconst linearFactor =\n\t\t100 *\n\t\t( ( maximumFontSizeParsed.value - minimumFontSizeParsed.value ) /\n\t\t\t( maximumViewPortWidthParsed.value -\n\t\t\t\tminumumViewPortWidthParsed.value ) );\n\tconst linearFactorScaled = roundToPrecision(\n\t\t( linearFactor || 1 ) * scaleFactor,\n\t\t3\n\t);\n\tconst fluidTargetFontSize = `${ minimumFontSizeRem.value }${ minimumFontSizeRem.unit } + ((1vw - ${ viewPortWidthOffset }) * ${ linearFactorScaled })`;\n\n\treturn `clamp(${ minimumFontSizeValue }, ${ fluidTargetFontSize }, ${ maximumFontSize })`;\n}\n\n/**\n * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].\n * A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`.\n *\n * @param {string|number} rawValue Raw size value from theme.json.\n * @param {Object|undefined} options Calculation options.\n *\n * @return {{ unit: string, value: number }|null} An object consisting of `'value'` and `'unit'` properties.\n */\nexport function getTypographyValueAndUnit( rawValue, options = {} ) {\n\tif ( typeof rawValue !== 'string' && typeof rawValue !== 'number' ) {\n\t\treturn null;\n\t}\n\n\t// Converts numeric values to pixel values by default.\n\tif ( isFinite( rawValue ) ) {\n\t\trawValue = `${ rawValue }px`;\n\t}\n\n\tconst { coerceTo, rootSizeValue, acceptableUnits } = {\n\t\tcoerceTo: '',\n\t\t// Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( \"html\" ) ).fontSize`.\n\t\trootSizeValue: 16,\n\t\tacceptableUnits: [ 'rem', 'px', 'em' ],\n\t\t...options,\n\t};\n\n\tconst acceptableUnitsGroup = acceptableUnits?.join( '|' );\n\tconst regexUnits = new RegExp(\n\t\t`^(\\\\d*\\\\.?\\\\d+)(${ acceptableUnitsGroup }){1,1}$`\n\t);\n\n\tconst matches = rawValue.match( regexUnits );\n\n\t// We need a number value and a unit.\n\tif ( ! matches || matches.length < 3 ) {\n\t\treturn null;\n\t}\n\n\tlet [ , value, unit ] = matches;\n\n\tlet returnValue = parseFloat( value );\n\n\tif ( 'px' === coerceTo && ( 'em' === unit || 'rem' === unit ) ) {\n\t\treturnValue = returnValue * rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\tif ( 'px' === unit && ( 'em' === coerceTo || 'rem' === coerceTo ) ) {\n\t\treturnValue = returnValue / rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\t/*\n\t * No calculation is required if swapping between em and rem yet,\n\t * since we assume a root size value. Later we might like to differentiate between\n\t * :root font size (rem) and parent element font size (em) relativity.\n\t */\n\tif (\n\t\t( 'em' === coerceTo || 'rem' === coerceTo ) &&\n\t\t( 'em' === unit || 'rem' === unit )\n\t) {\n\t\tunit = coerceTo;\n\t}\n\n\treturn {\n\t\tvalue: roundToPrecision( returnValue, 3 ),\n\t\tunit,\n\t};\n}\n\n/**\n * Returns a value rounded to defined precision.\n * Returns `undefined` if the value is not a valid finite number.\n *\n * @param {number} value Raw value.\n * @param {number} digits The number of digits to appear after the decimal point\n *\n * @return {number|undefined} Value rounded to standard precision.\n */\nexport function roundToPrecision( value, digits = 3 ) {\n\tconst base = Math.pow( 10, digits );\n\treturn Number.isFinite( value )\n\t\t? parseFloat( Math.round( value * base ) / base )\n\t\t: undefined;\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/fluid-utils.js"],"names":["DEFAULT_MAXIMUM_VIEWPORT_WIDTH","DEFAULT_MINIMUM_VIEWPORT_WIDTH","DEFAULT_SCALE_FACTOR","DEFAULT_MINIMUM_FONT_SIZE_FACTOR","DEFAULT_MAXIMUM_FONT_SIZE_FACTOR","getComputedFluidTypographyValue","minimumFontSize","maximumFontSize","fontSize","minimumViewPortWidth","maximumViewPortWidth","scaleFactor","minimumFontSizeFactor","maximumFontSizeFactor","fontSizeParsed","getTypographyValueAndUnit","unit","value","minimumFontSizeParsed","fontSizeUnit","maximumFontSizeParsed","coerceTo","minimumFontSizeRem","maximumViewPortWidthParsed","minumumViewPortWidthParsed","minViewPortWidthOffsetValue","roundToPrecision","viewPortWidthOffset","linearFactor","linearFactorScaled","fluidTargetFontSize","rawValue","options","isFinite","rootSizeValue","acceptableUnits","acceptableUnitsGroup","join","regexUnits","RegExp","matches","match","length","returnValue","parseFloat","digits","Number","toFixed","undefined"],"mappings":"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","sourcesContent":["/**\n * The fluid utilities must match the backend equivalent.\n * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php\n * ---------------------------------------------------------------\n */\n\n// Defaults.\nconst DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';\nconst DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';\nconst DEFAULT_SCALE_FACTOR = 1;\nconst DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;\nconst DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;\n\n/**\n * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum\n * font size OR a single font size can be specified.\n *\n * If a single font size is specified, it is scaled up and down by\n * minimumFontSizeFactor and maximumFontSizeFactor to arrive at the minimum and\n * maximum sizes.\n *\n * @example\n * ```js\n * // Calculate fluid font-size value from a minimum and maximum value.\n * const fontSize = getComputedFluidTypographyValue( {\n * minimumFontSize: '20px',\n * maximumFontSize: '45px'\n * } );\n * // Calculate fluid font-size value from a single font size.\n * const fontSize = getComputedFluidTypographyValue( {\n * fontSize: '30px',\n * } );\n * ```\n *\n * @param {Object} args\n * @param {?string} args.minimumViewPortWidth Minimum viewport size from which type will have fluidity. Optional if fontSize is specified.\n * @param {?string} args.maximumViewPortWidth Maximum size up to which type will have fluidity. Optional if fontSize is specified.\n * @param {string|number} [args.fontSize] Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified.\n * @param {?string} args.maximumFontSize Maximum font size for any clamp() calculation. Optional.\n * @param {?string} args.minimumFontSize Minimum font size for any clamp() calculation. Optional.\n * @param {?number} args.scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional.\n * @param {?number} args.minimumFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional.\n * @param {?number} args.maximumFontSizeFactor How much to scale defaultFontSize by to derive maximumFontSize. Optional.\n *\n * @return {string|null} A font-size value using clamp().\n */\nexport function getComputedFluidTypographyValue( {\n\tminimumFontSize,\n\tmaximumFontSize,\n\tfontSize,\n\tminimumViewPortWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH,\n\tmaximumViewPortWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,\n\tscaleFactor = DEFAULT_SCALE_FACTOR,\n\tminimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,\n\tmaximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,\n} ) {\n\t// Calculate missing minimumFontSize and maximumFontSize from\n\t// defaultFontSize if provided.\n\tif ( fontSize && ( ! minimumFontSize || ! maximumFontSize ) ) {\n\t\t// Parse default font size.\n\t\tconst fontSizeParsed = getTypographyValueAndUnit( fontSize );\n\n\t\t// Protect against invalid units.\n\t\tif ( ! fontSizeParsed?.unit ) {\n\t\t\treturn null;\n\t\t}\n\n\t\t// If no minimumFontSize is provided, derive using min scale factor.\n\t\tif ( ! minimumFontSize ) {\n\t\t\tminimumFontSize =\n\t\t\t\tfontSizeParsed.value * minimumFontSizeFactor +\n\t\t\t\tfontSizeParsed.unit;\n\t\t}\n\n\t\t// If no maximumFontSize is provided, derive using max scale factor.\n\t\tif ( ! maximumFontSize ) {\n\t\t\tmaximumFontSize =\n\t\t\t\tfontSizeParsed.value * maximumFontSizeFactor +\n\t\t\t\tfontSizeParsed.unit;\n\t\t}\n\t}\n\n\t// Return early if one of the provided inputs is not provided.\n\tif ( ! minimumFontSize || ! maximumFontSize ) {\n\t\treturn null;\n\t}\n\n\t// Grab the minimum font size and normalize it in order to use the value for calculations.\n\tconst minimumFontSizeParsed = getTypographyValueAndUnit( minimumFontSize );\n\n\t// We get a 'preferred' unit to keep units consistent when calculating,\n\t// otherwise the result will not be accurate.\n\tconst fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';\n\n\t// Grab the maximum font size and normalize it in order to use the value for calculations.\n\tconst maximumFontSizeParsed = getTypographyValueAndUnit( maximumFontSize, {\n\t\tcoerceTo: fontSizeUnit,\n\t} );\n\n\t// Protect against unsupported units.\n\tif ( ! minimumFontSizeParsed || ! maximumFontSizeParsed ) {\n\t\treturn null;\n\t}\n\n\t// Use rem for accessible fluid target font scaling.\n\tconst minimumFontSizeRem = getTypographyValueAndUnit( minimumFontSize, {\n\t\tcoerceTo: 'rem',\n\t} );\n\n\t// Viewport widths defined for fluid typography. Normalize units\n\tconst maximumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tmaximumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\tconst minumumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tminimumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\n\t// Protect against unsupported units.\n\tif (\n\t\t! maximumViewPortWidthParsed ||\n\t\t! minumumViewPortWidthParsed ||\n\t\t! minimumFontSizeRem\n\t) {\n\t\treturn null;\n\t}\n\n\t// Build CSS rule.\n\t// Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.\n\tconst minViewPortWidthOffsetValue = roundToPrecision(\n\t\tminumumViewPortWidthParsed.value / 100,\n\t\t3\n\t);\n\n\tconst viewPortWidthOffset = minViewPortWidthOffsetValue + fontSizeUnit;\n\tlet linearFactor =\n\t\t100 *\n\t\t( ( maximumFontSizeParsed.value - minimumFontSizeParsed.value ) /\n\t\t\t( maximumViewPortWidthParsed.value -\n\t\t\t\tminumumViewPortWidthParsed.value ) );\n\tlinearFactor = roundToPrecision( linearFactor, 3 ) || 1;\n\tconst linearFactorScaled = linearFactor * scaleFactor;\n\tconst fluidTargetFontSize = `${ minimumFontSizeRem.value }${ minimumFontSizeRem.unit } + ((1vw - ${ viewPortWidthOffset }) * ${ linearFactorScaled })`;\n\n\treturn `clamp(${ minimumFontSize }, ${ fluidTargetFontSize }, ${ maximumFontSize })`;\n}\n\n/**\n * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].\n * A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`.\n *\n * @param {string|number} rawValue Raw size value from theme.json.\n * @param {Object|undefined} options Calculation options.\n *\n * @return {{ unit: string, value: number }|null} An object consisting of `'value'` and `'unit'` properties.\n */\nexport function getTypographyValueAndUnit( rawValue, options = {} ) {\n\tif ( typeof rawValue !== 'string' && typeof rawValue !== 'number' ) {\n\t\treturn null;\n\t}\n\n\t// Converts numeric values to pixel values by default.\n\tif ( isFinite( rawValue ) ) {\n\t\trawValue = `${ rawValue }px`;\n\t}\n\n\tconst { coerceTo, rootSizeValue, acceptableUnits } = {\n\t\tcoerceTo: '',\n\t\t// Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( \"html\" ) ).fontSize`.\n\t\trootSizeValue: 16,\n\t\tacceptableUnits: [ 'rem', 'px', 'em' ],\n\t\t...options,\n\t};\n\n\tconst acceptableUnitsGroup = acceptableUnits?.join( '|' );\n\tconst regexUnits = new RegExp(\n\t\t`^(\\\\d*\\\\.?\\\\d+)(${ acceptableUnitsGroup }){1,1}$`\n\t);\n\n\tconst matches = rawValue.match( regexUnits );\n\n\t// We need a number value and a unit.\n\tif ( ! matches || matches.length < 3 ) {\n\t\treturn null;\n\t}\n\n\tlet [ , value, unit ] = matches;\n\n\tlet returnValue = parseFloat( value );\n\n\tif ( 'px' === coerceTo && ( 'em' === unit || 'rem' === unit ) ) {\n\t\treturnValue = returnValue * rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\tif ( 'px' === unit && ( 'em' === coerceTo || 'rem' === coerceTo ) ) {\n\t\treturnValue = returnValue / rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\treturn {\n\t\tvalue: returnValue,\n\t\tunit,\n\t};\n}\n\n/**\n * Returns a value rounded to defined precision.\n * Returns `undefined` if the value is not a valid finite number.\n *\n * @param {number} value Raw value.\n * @param {number} digits The number of digits to appear after the decimal point\n *\n * @return {number|undefined} Value rounded to standard precision.\n */\nexport function roundToPrecision( value, digits = 3 ) {\n\treturn Number.isFinite( value )\n\t\t? parseFloat( value.toFixed( digits ) )\n\t\t: undefined;\n}\n"]}
package/build-module/components/font-sizes/fluid-utils.js CHANGED
@@ -9,7 +9,6 @@ const DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';
9
9
  const DEFAULT_SCALE_FACTOR = 1;
10
10
  const DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;
11
11
  const DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;
12
- const DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';
13
12
  /**
14
13
  * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum
15
14
  * font size OR a single font size can be specified.
@@ -53,22 +52,13 @@ export function getComputedFluidTypographyValue(_ref) {
53
52
  maximumViewPortWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,
54
53
  scaleFactor = DEFAULT_SCALE_FACTOR,
55
54
  minimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,
56
- maximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,
57
- minimumFontSizeLimit = DEFAULT_MINIMUM_FONT_SIZE_LIMIT
55
+ maximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR
58
56
  } = _ref;
59
57
 
60
- /*
61
- * Caches minimumFontSize in minimumFontSizeValue
62
- * so we can check if minimumFontSize exists later.
63
- */
64
- let minimumFontSizeValue = minimumFontSize;
65
- /*
66
- * Calculates missing minimumFontSize and maximumFontSize from
67
- * defaultFontSize if provided.
68
- */
69
-
70
- if (fontSize) {
71
- // Parses default font size.
58
+ // Calculate missing minimumFontSize and maximumFontSize from
59
+ // defaultFontSize if provided.
60
+ if (fontSize && (!minimumFontSize || !maximumFontSize)) {
61
+ // Parse default font size.
72
62
  const fontSizeParsed = getTypographyValueAndUnit(fontSize); // Protect against invalid units.
73
63
 
74
64
  if (!(fontSizeParsed !== null && fontSizeParsed !== void 0 && fontSizeParsed.unit)) {
@@ -76,65 +66,37 @@ export function getComputedFluidTypographyValue(_ref) {
76
66
  } // If no minimumFontSize is provided, derive using min scale factor.
77
67
 
78
68
 
79
- if (!minimumFontSizeValue) {
80
- minimumFontSizeValue = roundToPrecision(fontSizeParsed.value * minimumFontSizeFactor, 3) + fontSizeParsed.unit;
81
- } // Parses the minimum font size limit, so we can perform checks using it.
82
-
83
-
84
- const minimumFontSizeLimitParsed = getTypographyValueAndUnit(minimumFontSizeLimit, {
85
- coerceTo: fontSizeParsed.unit
86
- });
87
-
88
- if (!!(minimumFontSizeLimitParsed !== null && minimumFontSizeLimitParsed !== void 0 && minimumFontSizeLimitParsed.value)) {
89
- /*
90
- * If a minimum size was not passed to this function
91
- * and the user-defined font size is lower than `minimumFontSizeLimit`,
92
- * then uses the user-defined font size as the minimum font-size.
93
- */
94
- if (!minimumFontSize && (fontSizeParsed === null || fontSizeParsed === void 0 ? void 0 : fontSizeParsed.value) < (minimumFontSizeLimitParsed === null || minimumFontSizeLimitParsed === void 0 ? void 0 : minimumFontSizeLimitParsed.value)) {
95
- minimumFontSizeValue = `${fontSizeParsed.value}${fontSizeParsed.unit}`;
96
- } else {
97
- const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSizeValue, {
98
- coerceTo: fontSizeParsed.unit
99
- });
100
- /*
101
- * Otherwise, if the passed or calculated minimum font size is lower than `minimumFontSizeLimit`
102
- * use `minimumFontSizeLimit` instead.
103
- */
104
-
105
- if (!!(minimumFontSizeParsed !== null && minimumFontSizeParsed !== void 0 && minimumFontSizeParsed.value) && minimumFontSizeParsed.value < minimumFontSizeLimitParsed.value) {
106
- minimumFontSizeValue = `${minimumFontSizeLimitParsed.value}${minimumFontSizeLimitParsed.unit}`;
107
- }
108
- }
69
+ if (!minimumFontSize) {
70
+ minimumFontSize = fontSizeParsed.value * minimumFontSizeFactor + fontSizeParsed.unit;
109
71
  } // If no maximumFontSize is provided, derive using max scale factor.
110
72
 
111
73
 
112
74
  if (!maximumFontSize) {
113
- maximumFontSize = roundToPrecision(fontSizeParsed.value * maximumFontSizeFactor, 3) + fontSizeParsed.unit;
75
+ maximumFontSize = fontSizeParsed.value * maximumFontSizeFactor + fontSizeParsed.unit;
114
76
  }
115
77
  } // Return early if one of the provided inputs is not provided.
116
78
 
117
79
 
118
- if (!minimumFontSizeValue || !maximumFontSize) {
80
+ if (!minimumFontSize || !maximumFontSize) {
119
81
  return null;
120
82
  } // Grab the minimum font size and normalize it in order to use the value for calculations.
121
83
 
122
84
 
123
- const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSizeValue); // We get a 'preferred' unit to keep units consistent when calculating,
85
+ const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSize); // We get a 'preferred' unit to keep units consistent when calculating,
124
86
  // otherwise the result will not be accurate.
125
87
 
126
- const fontSizeUnit = (minimumFontSizeParsed === null || minimumFontSizeParsed === void 0 ? void 0 : minimumFontSizeParsed.unit) || 'rem'; // Grabs the maximum font size and normalize it in order to use the value for calculations.
88
+ const fontSizeUnit = (minimumFontSizeParsed === null || minimumFontSizeParsed === void 0 ? void 0 : minimumFontSizeParsed.unit) || 'rem'; // Grab the maximum font size and normalize it in order to use the value for calculations.
127
89
 
128
90
  const maximumFontSizeParsed = getTypographyValueAndUnit(maximumFontSize, {
129
91
  coerceTo: fontSizeUnit
130
- }); // Checks for mandatory min and max sizes, and protects against unsupported units.
92
+ }); // Protect against unsupported units.
131
93
 
132
94
  if (!minimumFontSizeParsed || !maximumFontSizeParsed) {
133
95
  return null;
134
- } // Uses rem for accessible fluid target font scaling.
96
+ } // Use rem for accessible fluid target font scaling.
135
97
 
136
98
 
137
- const minimumFontSizeRem = getTypographyValueAndUnit(minimumFontSizeValue, {
99
+ const minimumFontSizeRem = getTypographyValueAndUnit(minimumFontSize, {
138
100
  coerceTo: 'rem'
139
101
  }); // Viewport widths defined for fluid typography. Normalize units
140
102
 
@@ -152,11 +114,12 @@ export function getComputedFluidTypographyValue(_ref) {
152
114
 
153
115
 
154
116
  const minViewPortWidthOffsetValue = roundToPrecision(minumumViewPortWidthParsed.value / 100, 3);
155
- const viewPortWidthOffset = roundToPrecision(minViewPortWidthOffsetValue, 3) + fontSizeUnit;
156
- const linearFactor = 100 * ((maximumFontSizeParsed.value - minimumFontSizeParsed.value) / (maximumViewPortWidthParsed.value - minumumViewPortWidthParsed.value));
157
- const linearFactorScaled = roundToPrecision((linearFactor || 1) * scaleFactor, 3);
117
+ const viewPortWidthOffset = minViewPortWidthOffsetValue + fontSizeUnit;
118
+ let linearFactor = 100 * ((maximumFontSizeParsed.value - minimumFontSizeParsed.value) / (maximumViewPortWidthParsed.value - minumumViewPortWidthParsed.value));
119
+ linearFactor = roundToPrecision(linearFactor, 3) || 1;
120
+ const linearFactorScaled = linearFactor * scaleFactor;
158
121
  const fluidTargetFontSize = `${minimumFontSizeRem.value}${minimumFontSizeRem.unit} + ((1vw - ${viewPortWidthOffset}) * ${linearFactorScaled})`;
159
- return `clamp(${minimumFontSizeValue}, ${fluidTargetFontSize}, ${maximumFontSize})`;
122
+ return `clamp(${minimumFontSize}, ${fluidTargetFontSize}, ${maximumFontSize})`;
160
123
  }
161
124
  /**
162
125
  * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].
@@ -211,19 +174,9 @@ export function getTypographyValueAndUnit(rawValue) {
211
174
  returnValue = returnValue / rootSizeValue;
212
175
  unit = coerceTo;
213
176
  }
214
- /*
215
- * No calculation is required if swapping between em and rem yet,
216
- * since we assume a root size value. Later we might like to differentiate between
217
- * :root font size (rem) and parent element font size (em) relativity.
218
- */
219
-
220
-
221
- if (('em' === coerceTo || 'rem' === coerceTo) && ('em' === unit || 'rem' === unit)) {
222
- unit = coerceTo;
223
- }
224
177
 
225
178
  return {
226
- value: roundToPrecision(returnValue, 3),
179
+ value: returnValue,
227
180
  unit
228
181
  };
229
182
  }
@@ -239,7 +192,6 @@ export function getTypographyValueAndUnit(rawValue) {
239
192
 
240
193
  export function roundToPrecision(value) {
241
194
  let digits = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3;
242
- const base = Math.pow(10, digits);
243
- return Number.isFinite(value) ? parseFloat(Math.round(value * base) / base) : undefined;
195
+ return Number.isFinite(value) ? parseFloat(value.toFixed(digits)) : undefined;
244
196
  }
245
197
  //# sourceMappingURL=fluid-utils.js.map
package/build-module/components/font-sizes/fluid-utils.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/fluid-utils.js"],"names":["DEFAULT_MAXIMUM_VIEWPORT_WIDTH","DEFAULT_MINIMUM_VIEWPORT_WIDTH","DEFAULT_SCALE_FACTOR","DEFAULT_MINIMUM_FONT_SIZE_FACTOR","DEFAULT_MAXIMUM_FONT_SIZE_FACTOR","DEFAULT_MINIMUM_FONT_SIZE_LIMIT","getComputedFluidTypographyValue","minimumFontSize","maximumFontSize","fontSize","minimumViewPortWidth","maximumViewPortWidth","scaleFactor","minimumFontSizeFactor","maximumFontSizeFactor","minimumFontSizeLimit","minimumFontSizeValue","fontSizeParsed","getTypographyValueAndUnit","unit","roundToPrecision","value","minimumFontSizeLimitParsed","coerceTo","minimumFontSizeParsed","fontSizeUnit","maximumFontSizeParsed","minimumFontSizeRem","maximumViewPortWidthParsed","minumumViewPortWidthParsed","minViewPortWidthOffsetValue","viewPortWidthOffset","linearFactor","linearFactorScaled","fluidTargetFontSize","rawValue","options","isFinite","rootSizeValue","acceptableUnits","acceptableUnitsGroup","join","regexUnits","RegExp","matches","match","length","returnValue","parseFloat","digits","base","Math","pow","Number","round","undefined"],"mappings":"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","sourcesContent":["/**\n * The fluid utilities must match the backend equivalent.\n * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php\n * ---------------------------------------------------------------\n */\n\n// Defaults.\nconst DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';\nconst DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';\nconst DEFAULT_SCALE_FACTOR = 1;\nconst DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;\nconst DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;\nconst DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';\n\n/**\n * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum\n * font size OR a single font size can be specified.\n *\n * If a single font size is specified, it is scaled up and down by\n * minimumFontSizeFactor and maximumFontSizeFactor to arrive at the minimum and\n * maximum sizes.\n *\n * @example\n * ```js\n * // Calculate fluid font-size value from a minimum and maximum value.\n * const fontSize = getComputedFluidTypographyValue( {\n * minimumFontSize: '20px',\n * maximumFontSize: '45px'\n * } );\n * // Calculate fluid font-size value from a single font size.\n * const fontSize = getComputedFluidTypographyValue( {\n * fontSize: '30px',\n * } );\n * ```\n *\n * @param {Object} args\n * @param {?string} args.minimumViewPortWidth Minimum viewport size from which type will have fluidity. Optional if fontSize is specified.\n * @param {?string} args.maximumViewPortWidth Maximum size up to which type will have fluidity. Optional if fontSize is specified.\n * @param {string|number} [args.fontSize] Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified.\n * @param {?string} args.maximumFontSize Maximum font size for any clamp() calculation. Optional.\n * @param {?string} args.minimumFontSize Minimum font size for any clamp() calculation. Optional.\n * @param {?number} args.scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional.\n * @param {?number} args.minimumFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional.\n * @param {?number} args.maximumFontSizeFactor How much to scale defaultFontSize by to derive maximumFontSize. Optional.\n *\n * @return {string|null} A font-size value using clamp().\n */\nexport function getComputedFluidTypographyValue( {\n\tminimumFontSize,\n\tmaximumFontSize,\n\tfontSize,\n\tminimumViewPortWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH,\n\tmaximumViewPortWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,\n\tscaleFactor = DEFAULT_SCALE_FACTOR,\n\tminimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,\n\tmaximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,\n\tminimumFontSizeLimit = DEFAULT_MINIMUM_FONT_SIZE_LIMIT,\n} ) {\n\t/*\n\t * Caches minimumFontSize in minimumFontSizeValue\n\t * so we can check if minimumFontSize exists later.\n\t */\n\tlet minimumFontSizeValue = minimumFontSize;\n\n\t/*\n\t * Calculates missing minimumFontSize and maximumFontSize from\n\t * defaultFontSize if provided.\n\t */\n\tif ( fontSize ) {\n\t\t// Parses default font size.\n\t\tconst fontSizeParsed = getTypographyValueAndUnit( fontSize );\n\n\t\t// Protect against invalid units.\n\t\tif ( ! fontSizeParsed?.unit ) {\n\t\t\treturn null;\n\t\t}\n\n\t\t// If no minimumFontSize is provided, derive using min scale factor.\n\t\tif ( ! minimumFontSizeValue ) {\n\t\t\tminimumFontSizeValue =\n\t\t\t\troundToPrecision(\n\t\t\t\t\tfontSizeParsed.value * minimumFontSizeFactor,\n\t\t\t\t\t3\n\t\t\t\t) + fontSizeParsed.unit;\n\t\t}\n\n\t\t// Parses the minimum font size limit, so we can perform checks using it.\n\t\tconst minimumFontSizeLimitParsed = getTypographyValueAndUnit(\n\t\t\tminimumFontSizeLimit,\n\t\t\t{\n\t\t\t\tcoerceTo: fontSizeParsed.unit,\n\t\t\t}\n\t\t);\n\n\t\tif ( !! minimumFontSizeLimitParsed?.value ) {\n\t\t\t/*\n\t\t\t * If a minimum size was not passed to this function\n\t\t\t * and the user-defined font size is lower than `minimumFontSizeLimit`,\n\t\t\t * then uses the user-defined font size as the minimum font-size.\n\t\t\t */\n\t\t\tif (\n\t\t\t\t! minimumFontSize &&\n\t\t\t\tfontSizeParsed?.value < minimumFontSizeLimitParsed?.value\n\t\t\t) {\n\t\t\t\tminimumFontSizeValue = `${ fontSizeParsed.value }${ fontSizeParsed.unit }`;\n\t\t\t} else {\n\t\t\t\tconst minimumFontSizeParsed = getTypographyValueAndUnit(\n\t\t\t\t\tminimumFontSizeValue,\n\t\t\t\t\t{\n\t\t\t\t\t\tcoerceTo: fontSizeParsed.unit,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\t/*\n\t\t\t\t * Otherwise, if the passed or calculated minimum font size is lower than `minimumFontSizeLimit`\n\t\t\t\t * use `minimumFontSizeLimit` instead.\n\t\t\t\t */\n\t\t\t\tif (\n\t\t\t\t\t!! minimumFontSizeParsed?.value &&\n\t\t\t\t\tminimumFontSizeParsed.value <\n\t\t\t\t\t\tminimumFontSizeLimitParsed.value\n\t\t\t\t) {\n\t\t\t\t\tminimumFontSizeValue = `${ minimumFontSizeLimitParsed.value }${ minimumFontSizeLimitParsed.unit }`;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// If no maximumFontSize is provided, derive using max scale factor.\n\t\tif ( ! maximumFontSize ) {\n\t\t\tmaximumFontSize =\n\t\t\t\troundToPrecision(\n\t\t\t\t\tfontSizeParsed.value * maximumFontSizeFactor,\n\t\t\t\t\t3\n\t\t\t\t) + fontSizeParsed.unit;\n\t\t}\n\t}\n\n\t// Return early if one of the provided inputs is not provided.\n\tif ( ! minimumFontSizeValue || ! maximumFontSize ) {\n\t\treturn null;\n\t}\n\n\t// Grab the minimum font size and normalize it in order to use the value for calculations.\n\tconst minimumFontSizeParsed =\n\t\tgetTypographyValueAndUnit( minimumFontSizeValue );\n\n\t// We get a 'preferred' unit to keep units consistent when calculating,\n\t// otherwise the result will not be accurate.\n\tconst fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';\n\n\t// Grabs the maximum font size and normalize it in order to use the value for calculations.\n\tconst maximumFontSizeParsed = getTypographyValueAndUnit( maximumFontSize, {\n\t\tcoerceTo: fontSizeUnit,\n\t} );\n\n\t// Checks for mandatory min and max sizes, and protects against unsupported units.\n\tif ( ! minimumFontSizeParsed || ! maximumFontSizeParsed ) {\n\t\treturn null;\n\t}\n\n\t// Uses rem for accessible fluid target font scaling.\n\tconst minimumFontSizeRem = getTypographyValueAndUnit(\n\t\tminimumFontSizeValue,\n\t\t{\n\t\t\tcoerceTo: 'rem',\n\t\t}\n\t);\n\n\t// Viewport widths defined for fluid typography. Normalize units\n\tconst maximumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tmaximumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\tconst minumumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tminimumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\n\t// Protect against unsupported units.\n\tif (\n\t\t! maximumViewPortWidthParsed ||\n\t\t! minumumViewPortWidthParsed ||\n\t\t! minimumFontSizeRem\n\t) {\n\t\treturn null;\n\t}\n\n\t// Build CSS rule.\n\t// Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.\n\tconst minViewPortWidthOffsetValue = roundToPrecision(\n\t\tminumumViewPortWidthParsed.value / 100,\n\t\t3\n\t);\n\n\tconst viewPortWidthOffset =\n\t\troundToPrecision( minViewPortWidthOffsetValue, 3 ) + fontSizeUnit;\n\tconst linearFactor =\n\t\t100 *\n\t\t( ( maximumFontSizeParsed.value - minimumFontSizeParsed.value ) /\n\t\t\t( maximumViewPortWidthParsed.value -\n\t\t\t\tminumumViewPortWidthParsed.value ) );\n\tconst linearFactorScaled = roundToPrecision(\n\t\t( linearFactor || 1 ) * scaleFactor,\n\t\t3\n\t);\n\tconst fluidTargetFontSize = `${ minimumFontSizeRem.value }${ minimumFontSizeRem.unit } + ((1vw - ${ viewPortWidthOffset }) * ${ linearFactorScaled })`;\n\n\treturn `clamp(${ minimumFontSizeValue }, ${ fluidTargetFontSize }, ${ maximumFontSize })`;\n}\n\n/**\n * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].\n * A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`.\n *\n * @param {string|number} rawValue Raw size value from theme.json.\n * @param {Object|undefined} options Calculation options.\n *\n * @return {{ unit: string, value: number }|null} An object consisting of `'value'` and `'unit'` properties.\n */\nexport function getTypographyValueAndUnit( rawValue, options = {} ) {\n\tif ( typeof rawValue !== 'string' && typeof rawValue !== 'number' ) {\n\t\treturn null;\n\t}\n\n\t// Converts numeric values to pixel values by default.\n\tif ( isFinite( rawValue ) ) {\n\t\trawValue = `${ rawValue }px`;\n\t}\n\n\tconst { coerceTo, rootSizeValue, acceptableUnits } = {\n\t\tcoerceTo: '',\n\t\t// Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( \"html\" ) ).fontSize`.\n\t\trootSizeValue: 16,\n\t\tacceptableUnits: [ 'rem', 'px', 'em' ],\n\t\t...options,\n\t};\n\n\tconst acceptableUnitsGroup = acceptableUnits?.join( '|' );\n\tconst regexUnits = new RegExp(\n\t\t`^(\\\\d*\\\\.?\\\\d+)(${ acceptableUnitsGroup }){1,1}$`\n\t);\n\n\tconst matches = rawValue.match( regexUnits );\n\n\t// We need a number value and a unit.\n\tif ( ! matches || matches.length < 3 ) {\n\t\treturn null;\n\t}\n\n\tlet [ , value, unit ] = matches;\n\n\tlet returnValue = parseFloat( value );\n\n\tif ( 'px' === coerceTo && ( 'em' === unit || 'rem' === unit ) ) {\n\t\treturnValue = returnValue * rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\tif ( 'px' === unit && ( 'em' === coerceTo || 'rem' === coerceTo ) ) {\n\t\treturnValue = returnValue / rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\t/*\n\t * No calculation is required if swapping between em and rem yet,\n\t * since we assume a root size value. Later we might like to differentiate between\n\t * :root font size (rem) and parent element font size (em) relativity.\n\t */\n\tif (\n\t\t( 'em' === coerceTo || 'rem' === coerceTo ) &&\n\t\t( 'em' === unit || 'rem' === unit )\n\t) {\n\t\tunit = coerceTo;\n\t}\n\n\treturn {\n\t\tvalue: roundToPrecision( returnValue, 3 ),\n\t\tunit,\n\t};\n}\n\n/**\n * Returns a value rounded to defined precision.\n * Returns `undefined` if the value is not a valid finite number.\n *\n * @param {number} value Raw value.\n * @param {number} digits The number of digits to appear after the decimal point\n *\n * @return {number|undefined} Value rounded to standard precision.\n */\nexport function roundToPrecision( value, digits = 3 ) {\n\tconst base = Math.pow( 10, digits );\n\treturn Number.isFinite( value )\n\t\t? parseFloat( Math.round( value * base ) / base )\n\t\t: undefined;\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/block-editor/src/components/font-sizes/fluid-utils.js"],"names":["DEFAULT_MAXIMUM_VIEWPORT_WIDTH","DEFAULT_MINIMUM_VIEWPORT_WIDTH","DEFAULT_SCALE_FACTOR","DEFAULT_MINIMUM_FONT_SIZE_FACTOR","DEFAULT_MAXIMUM_FONT_SIZE_FACTOR","getComputedFluidTypographyValue","minimumFontSize","maximumFontSize","fontSize","minimumViewPortWidth","maximumViewPortWidth","scaleFactor","minimumFontSizeFactor","maximumFontSizeFactor","fontSizeParsed","getTypographyValueAndUnit","unit","value","minimumFontSizeParsed","fontSizeUnit","maximumFontSizeParsed","coerceTo","minimumFontSizeRem","maximumViewPortWidthParsed","minumumViewPortWidthParsed","minViewPortWidthOffsetValue","roundToPrecision","viewPortWidthOffset","linearFactor","linearFactorScaled","fluidTargetFontSize","rawValue","options","isFinite","rootSizeValue","acceptableUnits","acceptableUnitsGroup","join","regexUnits","RegExp","matches","match","length","returnValue","parseFloat","digits","Number","toFixed","undefined"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AAEA;AACA,MAAMA,8BAA8B,GAAG,QAAvC;AACA,MAAMC,8BAA8B,GAAG,OAAvC;AACA,MAAMC,oBAAoB,GAAG,CAA7B;AACA,MAAMC,gCAAgC,GAAG,IAAzC;AACA,MAAMC,gCAAgC,GAAG,GAAzC;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,OAAO,SAASC,+BAAT,OASH;AAAA,MAT6C;AAChDC,IAAAA,eADgD;AAEhDC,IAAAA,eAFgD;AAGhDC,IAAAA,QAHgD;AAIhDC,IAAAA,oBAAoB,GAAGR,8BAJyB;AAKhDS,IAAAA,oBAAoB,GAAGV,8BALyB;AAMhDW,IAAAA,WAAW,GAAGT,oBANkC;AAOhDU,IAAAA,qBAAqB,GAAGT,gCAPwB;AAQhDU,IAAAA,qBAAqB,GAAGT;AARwB,GAS7C;;AACH;AACA;AACA,MAAKI,QAAQ,KAAM,CAAEF,eAAF,IAAqB,CAAEC,eAA7B,CAAb,EAA8D;AAC7D;AACA,UAAMO,cAAc,GAAGC,yBAAyB,CAAEP,QAAF,CAAhD,CAF6D,CAI7D;;AACA,QAAK,EAAEM,cAAF,aAAEA,cAAF,eAAEA,cAAc,CAAEE,IAAlB,CAAL,EAA8B;AAC7B,aAAO,IAAP;AACA,KAP4D,CAS7D;;;AACA,QAAK,CAAEV,eAAP,EAAyB;AACxBA,MAAAA,eAAe,GACdQ,cAAc,CAACG,KAAf,GAAuBL,qBAAvB,GACAE,cAAc,CAACE,IAFhB;AAGA,KAd4D,CAgB7D;;;AACA,QAAK,CAAET,eAAP,EAAyB;AACxBA,MAAAA,eAAe,GACdO,cAAc,CAACG,KAAf,GAAuBJ,qBAAvB,GACAC,cAAc,CAACE,IAFhB;AAGA;AACD,GAzBE,CA2BH;;;AACA,MAAK,CAAEV,eAAF,IAAqB,CAAEC,eAA5B,EAA8C;AAC7C,WAAO,IAAP;AACA,GA9BE,CAgCH;;;AACA,QAAMW,qBAAqB,GAAGH,yBAAyB,CAAET,eAAF,CAAvD,CAjCG,CAmCH;AACA;;AACA,QAAMa,YAAY,GAAG,CAAAD,qBAAqB,SAArB,IAAAA,qBAAqB,WAArB,YAAAA,qBAAqB,CAAEF,IAAvB,KAA+B,KAApD,CArCG,CAuCH;;AACA,QAAMI,qBAAqB,GAAGL,yBAAyB,CAAER,eAAF,EAAmB;AACzEc,IAAAA,QAAQ,EAAEF;AAD+D,GAAnB,CAAvD,CAxCG,CA4CH;;AACA,MAAK,CAAED,qBAAF,IAA2B,CAAEE,qBAAlC,EAA0D;AACzD,WAAO,IAAP;AACA,GA/CE,CAiDH;;;AACA,QAAME,kBAAkB,GAAGP,yBAAyB,CAAET,eAAF,EAAmB;AACtEe,IAAAA,QAAQ,EAAE;AAD4D,GAAnB,CAApD,CAlDG,CAsDH;;AACA,QAAME,0BAA0B,GAAGR,yBAAyB,CAC3DL,oBAD2D,EAE3D;AAAEW,IAAAA,QAAQ,EAAEF;AAAZ,GAF2D,CAA5D;AAIA,QAAMK,0BAA0B,GAAGT,yBAAyB,CAC3DN,oBAD2D,EAE3D;AAAEY,IAAAA,QAAQ,EAAEF;AAAZ,GAF2D,CAA5D,CA3DG,CAgEH;;AACA,MACC,CAAEI,0BAAF,IACA,CAAEC,0BADF,IAEA,CAAEF,kBAHH,EAIE;AACD,WAAO,IAAP;AACA,GAvEE,CAyEH;AACA;;;AACA,QAAMG,2BAA2B,GAAGC,gBAAgB,CACnDF,0BAA0B,CAACP,KAA3B,GAAmC,GADgB,EAEnD,CAFmD,CAApD;AAKA,QAAMU,mBAAmB,GAAGF,2BAA2B,GAAGN,YAA1D;AACA,MAAIS,YAAY,GACf,OACE,CAAER,qBAAqB,CAACH,KAAtB,GAA8BC,qBAAqB,CAACD,KAAtD,KACCM,0BAA0B,CAACN,KAA3B,GACDO,0BAA0B,CAACP,KAF3B,CADF,CADD;AAKAW,EAAAA,YAAY,GAAGF,gBAAgB,CAAEE,YAAF,EAAgB,CAAhB,CAAhB,IAAuC,CAAtD;AACA,QAAMC,kBAAkB,GAAGD,YAAY,GAAGjB,WAA1C;AACA,QAAMmB,mBAAmB,GAAI,GAAGR,kBAAkB,CAACL,KAAO,GAAGK,kBAAkB,CAACN,IAAM,cAAcW,mBAAqB,OAAOE,kBAAoB,GAApJ;AAEA,SAAQ,SAASvB,eAAiB,KAAKwB,mBAAqB,KAAKvB,eAAiB,GAAlF;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASQ,yBAAT,CAAoCgB,QAApC,EAA6D;AAAA,MAAfC,OAAe,uEAAL,EAAK;;AACnE,MAAK,OAAOD,QAAP,KAAoB,QAApB,IAAgC,OAAOA,QAAP,KAAoB,QAAzD,EAAoE;AACnE,WAAO,IAAP;AACA,GAHkE,CAKnE;;;AACA,MAAKE,QAAQ,CAAEF,QAAF,CAAb,EAA4B;AAC3BA,IAAAA,QAAQ,GAAI,GAAGA,QAAU,IAAzB;AACA;;AAED,QAAM;AAAEV,IAAAA,QAAF;AAAYa,IAAAA,aAAZ;AAA2BC,IAAAA;AAA3B,MAA+C;AACpDd,IAAAA,QAAQ,EAAE,EAD0C;AAEpD;AACAa,IAAAA,aAAa,EAAE,EAHqC;AAIpDC,IAAAA,eAAe,EAAE,CAAE,KAAF,EAAS,IAAT,EAAe,IAAf,CAJmC;AAKpD,OAAGH;AALiD,GAArD;AAQA,QAAMI,oBAAoB,GAAGD,eAAH,aAAGA,eAAH,uBAAGA,eAAe,CAAEE,IAAjB,CAAuB,GAAvB,CAA7B;AACA,QAAMC,UAAU,GAAG,IAAIC,MAAJ,CACjB,mBAAmBH,oBAAsB,SADxB,CAAnB;AAIA,QAAMI,OAAO,GAAGT,QAAQ,CAACU,KAAT,CAAgBH,UAAhB,CAAhB,CAvBmE,CAyBnE;;AACA,MAAK,CAAEE,OAAF,IAAaA,OAAO,CAACE,MAAR,GAAiB,CAAnC,EAAuC;AACtC,WAAO,IAAP;AACA;;AAED,MAAI,GAAIzB,KAAJ,EAAWD,IAAX,IAAoBwB,OAAxB;AAEA,MAAIG,WAAW,GAAGC,UAAU,CAAE3B,KAAF,CAA5B;;AAEA,MAAK,SAASI,QAAT,KAAuB,SAASL,IAAT,IAAiB,UAAUA,IAAlD,CAAL,EAAgE;AAC/D2B,IAAAA,WAAW,GAAGA,WAAW,GAAGT,aAA5B;AACAlB,IAAAA,IAAI,GAAGK,QAAP;AACA;;AAED,MAAK,SAASL,IAAT,KAAmB,SAASK,QAAT,IAAqB,UAAUA,QAAlD,CAAL,EAAoE;AACnEsB,IAAAA,WAAW,GAAGA,WAAW,GAAGT,aAA5B;AACAlB,IAAAA,IAAI,GAAGK,QAAP;AACA;;AAED,SAAO;AACNJ,IAAAA,KAAK,EAAE0B,WADD;AAEN3B,IAAAA;AAFM,GAAP;AAIA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASU,gBAAT,CAA2BT,KAA3B,EAA+C;AAAA,MAAb4B,MAAa,uEAAJ,CAAI;AACrD,SAAOC,MAAM,CAACb,QAAP,CAAiBhB,KAAjB,IACJ2B,UAAU,CAAE3B,KAAK,CAAC8B,OAAN,CAAeF,MAAf,CAAF,CADN,GAEJG,SAFH;AAGA","sourcesContent":["/**\n * The fluid utilities must match the backend equivalent.\n * See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php\n * ---------------------------------------------------------------\n */\n\n// Defaults.\nconst DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';\nconst DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';\nconst DEFAULT_SCALE_FACTOR = 1;\nconst DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;\nconst DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;\n\n/**\n * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum\n * font size OR a single font size can be specified.\n *\n * If a single font size is specified, it is scaled up and down by\n * minimumFontSizeFactor and maximumFontSizeFactor to arrive at the minimum and\n * maximum sizes.\n *\n * @example\n * ```js\n * // Calculate fluid font-size value from a minimum and maximum value.\n * const fontSize = getComputedFluidTypographyValue( {\n * minimumFontSize: '20px',\n * maximumFontSize: '45px'\n * } );\n * // Calculate fluid font-size value from a single font size.\n * const fontSize = getComputedFluidTypographyValue( {\n * fontSize: '30px',\n * } );\n * ```\n *\n * @param {Object} args\n * @param {?string} args.minimumViewPortWidth Minimum viewport size from which type will have fluidity. Optional if fontSize is specified.\n * @param {?string} args.maximumViewPortWidth Maximum size up to which type will have fluidity. Optional if fontSize is specified.\n * @param {string|number} [args.fontSize] Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified.\n * @param {?string} args.maximumFontSize Maximum font size for any clamp() calculation. Optional.\n * @param {?string} args.minimumFontSize Minimum font size for any clamp() calculation. Optional.\n * @param {?number} args.scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional.\n * @param {?number} args.minimumFontSizeFactor How much to scale defaultFontSize by to derive minimumFontSize. Optional.\n * @param {?number} args.maximumFontSizeFactor How much to scale defaultFontSize by to derive maximumFontSize. Optional.\n *\n * @return {string|null} A font-size value using clamp().\n */\nexport function getComputedFluidTypographyValue( {\n\tminimumFontSize,\n\tmaximumFontSize,\n\tfontSize,\n\tminimumViewPortWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH,\n\tmaximumViewPortWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,\n\tscaleFactor = DEFAULT_SCALE_FACTOR,\n\tminimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,\n\tmaximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,\n} ) {\n\t// Calculate missing minimumFontSize and maximumFontSize from\n\t// defaultFontSize if provided.\n\tif ( fontSize && ( ! minimumFontSize || ! maximumFontSize ) ) {\n\t\t// Parse default font size.\n\t\tconst fontSizeParsed = getTypographyValueAndUnit( fontSize );\n\n\t\t// Protect against invalid units.\n\t\tif ( ! fontSizeParsed?.unit ) {\n\t\t\treturn null;\n\t\t}\n\n\t\t// If no minimumFontSize is provided, derive using min scale factor.\n\t\tif ( ! minimumFontSize ) {\n\t\t\tminimumFontSize =\n\t\t\t\tfontSizeParsed.value * minimumFontSizeFactor +\n\t\t\t\tfontSizeParsed.unit;\n\t\t}\n\n\t\t// If no maximumFontSize is provided, derive using max scale factor.\n\t\tif ( ! maximumFontSize ) {\n\t\t\tmaximumFontSize =\n\t\t\t\tfontSizeParsed.value * maximumFontSizeFactor +\n\t\t\t\tfontSizeParsed.unit;\n\t\t}\n\t}\n\n\t// Return early if one of the provided inputs is not provided.\n\tif ( ! minimumFontSize || ! maximumFontSize ) {\n\t\treturn null;\n\t}\n\n\t// Grab the minimum font size and normalize it in order to use the value for calculations.\n\tconst minimumFontSizeParsed = getTypographyValueAndUnit( minimumFontSize );\n\n\t// We get a 'preferred' unit to keep units consistent when calculating,\n\t// otherwise the result will not be accurate.\n\tconst fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';\n\n\t// Grab the maximum font size and normalize it in order to use the value for calculations.\n\tconst maximumFontSizeParsed = getTypographyValueAndUnit( maximumFontSize, {\n\t\tcoerceTo: fontSizeUnit,\n\t} );\n\n\t// Protect against unsupported units.\n\tif ( ! minimumFontSizeParsed || ! maximumFontSizeParsed ) {\n\t\treturn null;\n\t}\n\n\t// Use rem for accessible fluid target font scaling.\n\tconst minimumFontSizeRem = getTypographyValueAndUnit( minimumFontSize, {\n\t\tcoerceTo: 'rem',\n\t} );\n\n\t// Viewport widths defined for fluid typography. Normalize units\n\tconst maximumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tmaximumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\tconst minumumViewPortWidthParsed = getTypographyValueAndUnit(\n\t\tminimumViewPortWidth,\n\t\t{ coerceTo: fontSizeUnit }\n\t);\n\n\t// Protect against unsupported units.\n\tif (\n\t\t! maximumViewPortWidthParsed ||\n\t\t! minumumViewPortWidthParsed ||\n\t\t! minimumFontSizeRem\n\t) {\n\t\treturn null;\n\t}\n\n\t// Build CSS rule.\n\t// Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.\n\tconst minViewPortWidthOffsetValue = roundToPrecision(\n\t\tminumumViewPortWidthParsed.value / 100,\n\t\t3\n\t);\n\n\tconst viewPortWidthOffset = minViewPortWidthOffsetValue + fontSizeUnit;\n\tlet linearFactor =\n\t\t100 *\n\t\t( ( maximumFontSizeParsed.value - minimumFontSizeParsed.value ) /\n\t\t\t( maximumViewPortWidthParsed.value -\n\t\t\t\tminumumViewPortWidthParsed.value ) );\n\tlinearFactor = roundToPrecision( linearFactor, 3 ) || 1;\n\tconst linearFactorScaled = linearFactor * scaleFactor;\n\tconst fluidTargetFontSize = `${ minimumFontSizeRem.value }${ minimumFontSizeRem.unit } + ((1vw - ${ viewPortWidthOffset }) * ${ linearFactorScaled })`;\n\n\treturn `clamp(${ minimumFontSize }, ${ fluidTargetFontSize }, ${ maximumFontSize })`;\n}\n\n/**\n * Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].\n * A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`.\n *\n * @param {string|number} rawValue Raw size value from theme.json.\n * @param {Object|undefined} options Calculation options.\n *\n * @return {{ unit: string, value: number }|null} An object consisting of `'value'` and `'unit'` properties.\n */\nexport function getTypographyValueAndUnit( rawValue, options = {} ) {\n\tif ( typeof rawValue !== 'string' && typeof rawValue !== 'number' ) {\n\t\treturn null;\n\t}\n\n\t// Converts numeric values to pixel values by default.\n\tif ( isFinite( rawValue ) ) {\n\t\trawValue = `${ rawValue }px`;\n\t}\n\n\tconst { coerceTo, rootSizeValue, acceptableUnits } = {\n\t\tcoerceTo: '',\n\t\t// Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( \"html\" ) ).fontSize`.\n\t\trootSizeValue: 16,\n\t\tacceptableUnits: [ 'rem', 'px', 'em' ],\n\t\t...options,\n\t};\n\n\tconst acceptableUnitsGroup = acceptableUnits?.join( '|' );\n\tconst regexUnits = new RegExp(\n\t\t`^(\\\\d*\\\\.?\\\\d+)(${ acceptableUnitsGroup }){1,1}$`\n\t);\n\n\tconst matches = rawValue.match( regexUnits );\n\n\t// We need a number value and a unit.\n\tif ( ! matches || matches.length < 3 ) {\n\t\treturn null;\n\t}\n\n\tlet [ , value, unit ] = matches;\n\n\tlet returnValue = parseFloat( value );\n\n\tif ( 'px' === coerceTo && ( 'em' === unit || 'rem' === unit ) ) {\n\t\treturnValue = returnValue * rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\tif ( 'px' === unit && ( 'em' === coerceTo || 'rem' === coerceTo ) ) {\n\t\treturnValue = returnValue / rootSizeValue;\n\t\tunit = coerceTo;\n\t}\n\n\treturn {\n\t\tvalue: returnValue,\n\t\tunit,\n\t};\n}\n\n/**\n * Returns a value rounded to defined precision.\n * Returns `undefined` if the value is not a valid finite number.\n *\n * @param {number} value Raw value.\n * @param {number} digits The number of digits to appear after the decimal point\n *\n * @return {number|undefined} Value rounded to standard precision.\n */\nexport function roundToPrecision( value, digits = 3 ) {\n\treturn Number.isFinite( value )\n\t\t? parseFloat( value.toFixed( digits ) )\n\t\t: undefined;\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/block-editor",
3
- "version": "10.0.8",
3
+ "version": "10.0.9",
4
4
  "description": "Generic block editor.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -78,5 +78,5 @@
78
78
  "publishConfig": {
79
79
  "access": "public"
80
80
  },
81
- "gitHead": "21ef2792a2c3889830aee525f0136657a570c265"
81
+ "gitHead": "ca07aa8354a1131dbabcc36dfcaf70e0c0891f54"
82
82
  }
package/src/components/font-sizes/fluid-utils.js CHANGED
@@ -10,7 +10,6 @@ const DEFAULT_MINIMUM_VIEWPORT_WIDTH = '768px';
10
10
  const DEFAULT_SCALE_FACTOR = 1;
11
11
  const DEFAULT_MINIMUM_FONT_SIZE_FACTOR = 0.75;
12
12
  const DEFAULT_MAXIMUM_FONT_SIZE_FACTOR = 1.5;
13
- const DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';
14
13
 
15
14
  /**
16
15
  * Computes a fluid font-size value that uses clamp(). A minimum and maxinmum
@@ -54,20 +53,11 @@ export function getComputedFluidTypographyValue( {
54
53
  scaleFactor = DEFAULT_SCALE_FACTOR,
55
54
  minimumFontSizeFactor = DEFAULT_MINIMUM_FONT_SIZE_FACTOR,
56
55
  maximumFontSizeFactor = DEFAULT_MAXIMUM_FONT_SIZE_FACTOR,
57
- minimumFontSizeLimit = DEFAULT_MINIMUM_FONT_SIZE_LIMIT,
58
56
  } ) {
59
- /*
60
- * Caches minimumFontSize in minimumFontSizeValue
61
- * so we can check if minimumFontSize exists later.
62
- */
63
- let minimumFontSizeValue = minimumFontSize;
64
-
65
- /*
66
- * Calculates missing minimumFontSize and maximumFontSize from
67
- * defaultFontSize if provided.
68
- */
69
- if ( fontSize ) {
70
- // Parses default font size.
57
+ // Calculate missing minimumFontSize and maximumFontSize from
58
+ // defaultFontSize if provided.
59
+ if ( fontSize && ( ! minimumFontSize || ! maximumFontSize ) ) {
60
+ // Parse default font size.
71
61
  const fontSizeParsed = getTypographyValueAndUnit( fontSize );
72
62
 
73
63
  // Protect against invalid units.
@@ -76,95 +66,46 @@ export function getComputedFluidTypographyValue( {
76
66
  }
77
67
 
78
68
  // If no minimumFontSize is provided, derive using min scale factor.
79
- if ( ! minimumFontSizeValue ) {
80
- minimumFontSizeValue =
81
- roundToPrecision(
82
- fontSizeParsed.value * minimumFontSizeFactor,
83
- 3
84
- ) + fontSizeParsed.unit;
85
- }
86
-
87
- // Parses the minimum font size limit, so we can perform checks using it.
88
- const minimumFontSizeLimitParsed = getTypographyValueAndUnit(
89
- minimumFontSizeLimit,
90
- {
91
- coerceTo: fontSizeParsed.unit,
92
- }
93
- );
94
-
95
- if ( !! minimumFontSizeLimitParsed?.value ) {
96
- /*
97
- * If a minimum size was not passed to this function
98
- * and the user-defined font size is lower than `minimumFontSizeLimit`,
99
- * then uses the user-defined font size as the minimum font-size.
100
- */
101
- if (
102
- ! minimumFontSize &&
103
- fontSizeParsed?.value < minimumFontSizeLimitParsed?.value
104
- ) {
105
- minimumFontSizeValue = `${ fontSizeParsed.value }${ fontSizeParsed.unit }`;
106
- } else {
107
- const minimumFontSizeParsed = getTypographyValueAndUnit(
108
- minimumFontSizeValue,
109
- {
110
- coerceTo: fontSizeParsed.unit,
111
- }
112
- );
113
-
114
- /*
115
- * Otherwise, if the passed or calculated minimum font size is lower than `minimumFontSizeLimit`
116
- * use `minimumFontSizeLimit` instead.
117
- */
118
- if (
119
- !! minimumFontSizeParsed?.value &&
120
- minimumFontSizeParsed.value <
121
- minimumFontSizeLimitParsed.value
122
- ) {
123
- minimumFontSizeValue = `${ minimumFontSizeLimitParsed.value }${ minimumFontSizeLimitParsed.unit }`;
124
- }
125
- }
69
+ if ( ! minimumFontSize ) {
70
+ minimumFontSize =
71
+ fontSizeParsed.value * minimumFontSizeFactor +
72
+ fontSizeParsed.unit;
126
73
  }
127
74
 
128
75
  // If no maximumFontSize is provided, derive using max scale factor.
129
76
  if ( ! maximumFontSize ) {
130
77
  maximumFontSize =
131
- roundToPrecision(
132
- fontSizeParsed.value * maximumFontSizeFactor,
133
- 3
134
- ) + fontSizeParsed.unit;
78
+ fontSizeParsed.value * maximumFontSizeFactor +
79
+ fontSizeParsed.unit;
135
80
  }
136
81
  }
137
82
 
138
83
  // Return early if one of the provided inputs is not provided.
139
- if ( ! minimumFontSizeValue || ! maximumFontSize ) {
84
+ if ( ! minimumFontSize || ! maximumFontSize ) {
140
85
  return null;
141
86
  }
142
87
 
143
88
  // Grab the minimum font size and normalize it in order to use the value for calculations.
144
- const minimumFontSizeParsed =
145
- getTypographyValueAndUnit( minimumFontSizeValue );
89
+ const minimumFontSizeParsed = getTypographyValueAndUnit( minimumFontSize );
146
90
 
147
91
  // We get a 'preferred' unit to keep units consistent when calculating,
148
92
  // otherwise the result will not be accurate.
149
93
  const fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';
150
94
 
151
- // Grabs the maximum font size and normalize it in order to use the value for calculations.
95
+ // Grab the maximum font size and normalize it in order to use the value for calculations.
152
96
  const maximumFontSizeParsed = getTypographyValueAndUnit( maximumFontSize, {
153
97
  coerceTo: fontSizeUnit,
154
98
  } );
155
99
 
156
- // Checks for mandatory min and max sizes, and protects against unsupported units.
100
+ // Protect against unsupported units.
157
101
  if ( ! minimumFontSizeParsed || ! maximumFontSizeParsed ) {
158
102
  return null;
159
103
  }
160
104
 
161
- // Uses rem for accessible fluid target font scaling.
162
- const minimumFontSizeRem = getTypographyValueAndUnit(
163
- minimumFontSizeValue,
164
- {
165
- coerceTo: 'rem',
166
- }
167
- );
105
+ // Use rem for accessible fluid target font scaling.
106
+ const minimumFontSizeRem = getTypographyValueAndUnit( minimumFontSize, {
107
+ coerceTo: 'rem',
108
+ } );
168
109
 
169
110
  // Viewport widths defined for fluid typography. Normalize units
170
111
  const maximumViewPortWidthParsed = getTypographyValueAndUnit(
@@ -192,20 +133,17 @@ export function getComputedFluidTypographyValue( {
192
133
  3
193
134
  );
194
135
 
195
- const viewPortWidthOffset =
196
- roundToPrecision( minViewPortWidthOffsetValue, 3 ) + fontSizeUnit;
197
- const linearFactor =
136
+ const viewPortWidthOffset = minViewPortWidthOffsetValue + fontSizeUnit;
137
+ let linearFactor =
198
138
  100 *
199
139
  ( ( maximumFontSizeParsed.value - minimumFontSizeParsed.value ) /
200
140
  ( maximumViewPortWidthParsed.value -
201
141
  minumumViewPortWidthParsed.value ) );
202
- const linearFactorScaled = roundToPrecision(
203
- ( linearFactor || 1 ) * scaleFactor,
204
- 3
205
- );
142
+ linearFactor = roundToPrecision( linearFactor, 3 ) || 1;
143
+ const linearFactorScaled = linearFactor * scaleFactor;
206
144
  const fluidTargetFontSize = `${ minimumFontSizeRem.value }${ minimumFontSizeRem.unit } + ((1vw - ${ viewPortWidthOffset }) * ${ linearFactorScaled })`;
207
145
 
208
- return `clamp(${ minimumFontSizeValue }, ${ fluidTargetFontSize }, ${ maximumFontSize })`;
146
+ return `clamp(${ minimumFontSize }, ${ fluidTargetFontSize }, ${ maximumFontSize })`;
209
147
  }
210
148
 
211
149
  /**
@@ -261,20 +199,8 @@ export function getTypographyValueAndUnit( rawValue, options = {} ) {
261
199
  unit = coerceTo;
262
200
  }
263
201
 
264
- /*
265
- * No calculation is required if swapping between em and rem yet,
266
- * since we assume a root size value. Later we might like to differentiate between
267
- * :root font size (rem) and parent element font size (em) relativity.
268
- */
269
- if (
270
- ( 'em' === coerceTo || 'rem' === coerceTo ) &&
271
- ( 'em' === unit || 'rem' === unit )
272
- ) {
273
- unit = coerceTo;
274
- }
275
-
276
202
  return {
277
- value: roundToPrecision( returnValue, 3 ),
203
+ value: returnValue,
278
204
  unit,
279
205
  };
280
206
  }
@@ -289,8 +215,7 @@ export function getTypographyValueAndUnit( rawValue, options = {} ) {
289
215
  * @return {number|undefined} Value rounded to standard precision.
290
216
  */
291
217
  export function roundToPrecision( value, digits = 3 ) {
292
- const base = Math.pow( 10, digits );
293
218
  return Number.isFinite( value )
294
- ? parseFloat( Math.round( value * base ) / base )
219
+ ? parseFloat( value.toFixed( digits ) )
295
220
  : undefined;
296
221
  }
package/src/components/font-sizes/test/fluid-utils.js CHANGED
@@ -33,7 +33,7 @@ describe( 'getComputedFluidTypographyValue()', () => {
33
33
  fontSize: '30px',
34
34
  } );
35
35
  expect( fluidTypographyValues ).toBe(
36
- 'clamp(22.5px, 1.406rem + ((1vw - 7.68px) * 2.704), 45px)'
36
+ 'clamp(22.5px, 1.40625rem + ((1vw - 7.68px) * 2.704), 45px)'
37
37
  );
38
38
  } );
39
39
 
@@ -42,7 +42,7 @@ describe( 'getComputedFluidTypographyValue()', () => {
42
42
  fontSize: '30px',
43
43
  } );
44
44
  expect( fluidTypographyValues ).toBe(
45
- 'clamp(22.5px, 1.406rem + ((1vw - 7.68px) * 2.704), 45px)'
45
+ 'clamp(22.5px, 1.40625rem + ((1vw - 7.68px) * 2.704), 45px)'
46
46
  );
47
47
  } );
48
48
 
@@ -53,7 +53,7 @@ describe( 'getComputedFluidTypographyValue()', () => {
53
53
  maximumViewPortWidth: '1000px',
54
54
  } );
55
55
  expect( fluidTypographyValues ).toBe(
56
- 'clamp(22.5px, 1.406rem + ((1vw - 5px) * 4.5), 45px)'
56
+ 'clamp(22.5px, 1.40625rem + ((1vw - 5px) * 4.5), 45px)'
57
57
  );
58
58
  } );
59
59
 
@@ -63,7 +63,7 @@ describe( 'getComputedFluidTypographyValue()', () => {
63
63
  scaleFactor: '2',
64
64
  } );
65
65
  expect( fluidTypographyValues ).toBe(
66
- 'clamp(22.5px, 1.406rem + ((1vw - 7.68px) * 5.409), 45px)'
66
+ 'clamp(22.5px, 1.40625rem + ((1vw - 7.68px) * 5.408), 45px)'
67
67
  );
68
68
  } );
69
69
 
@@ -74,7 +74,7 @@ describe( 'getComputedFluidTypographyValue()', () => {
74
74
  maximumFontSizeFactor: '2',
75
75
  } );
76
76
  expect( fluidTypographyValues ).toBe(
77
- 'clamp(15px, 0.938rem + ((1vw - 7.68px) * 5.409), 60px)'
77
+ 'clamp(15px, 0.9375rem + ((1vw - 7.68px) * 5.409), 60px)'
78
78
  );
79
79
  } );
80
80