@wordpress/global-styles-ui 1.1.0

package/build/font-library-modal/utils/set-immutably.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/font-library-modal/utils/set-immutably.ts"],
+  "sourcesContent": ["/**\n * Immutably sets a value inside an object. Like `lodash#set`, but returning a\n * new object. Treats nullish initial values as empty objects. Clones any\n * nested objects. Supports arrays, too.\n * Duplicated from `packages/global-styles-engine/src/utils/object.ts`\n *\n * @param object Object to set a value in.\n * @param path   Path in the object to modify.\n * @param value  New value to set.\n * @return Cloned object with the new value set.\n */\nexport function setImmutably(\n\tobject: Object,\n\tpath: string | number | ( string | number )[],\n\tvalue: any\n) {\n\t// Normalize path\n\tpath = Array.isArray( path ) ? [ ...path ] : [ path ];\n\n\t// Shallowly clone the base of the object\n\tobject = Array.isArray( object ) ? [ ...object ] : { ...object };\n\n\tconst leaf = path.pop();\n\n\t// Traverse object from root to leaf, shallowly cloning at each level\n\tlet prev = object;\n\tfor ( const key of path ) {\n\t\t// @ts-expect-error\n\t\tconst lvl = prev[ key ];\n\t\t// @ts-expect-error\n\t\tprev = prev[ key ] = Array.isArray( lvl ) ? [ ...lvl ] : { ...lvl };\n\t}\n\t// @ts-expect-error\n\tprev[ leaf ] = value;\n\n\treturn object;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAWO,SAAS,aACf,QACA,MACA,OACC;AAED,SAAO,MAAM,QAAS,IAAK,IAAI,CAAE,GAAG,IAAK,IAAI,CAAE,IAAK;AAGpD,WAAS,MAAM,QAAS,MAAO,IAAI,CAAE,GAAG,MAAO,IAAI,EAAE,GAAG,OAAO;AAE/D,QAAM,OAAO,KAAK,IAAI;AAGtB,MAAI,OAAO;AACX,aAAY,OAAO,MAAO;AAEzB,UAAM,MAAM,KAAM,GAAI;AAEtB,WAAO,KAAM,GAAI,IAAI,MAAM,QAAS,GAAI,IAAI,CAAE,GAAG,GAAI,IAAI,EAAE,GAAG,IAAI;AAAA,EACnE;AAEA,OAAM,IAAK,IAAI;AAEf,SAAO;AACR;",
+  "names": []
+}

package/build/font-library-modal/utils/sort-font-faces.js

@@ -0,0 +1,59 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var sort_font_faces_exports = {};
+__export(sort_font_faces_exports, {
+  sortFontFaces: () => sortFontFaces
+});
+module.exports = __toCommonJS(sort_font_faces_exports);
+function getNumericFontWeight(value) {
+  switch (value) {
+    case "normal":
+      return 400;
+    case "bold":
+      return 700;
+    case "bolder":
+      return 500;
+    case "lighter":
+      return 300;
+    default:
+      return parseInt(value, 10);
+  }
+}
+function sortFontFaces(faces) {
+  return faces.sort((a, b) => {
+    if (a.fontStyle === "normal" && b.fontStyle !== "normal") {
+      return -1;
+    }
+    if (b.fontStyle === "normal" && a.fontStyle !== "normal") {
+      return 1;
+    }
+    if (a.fontStyle === b.fontStyle) {
+      return getNumericFontWeight(a.fontWeight?.toString() ?? "normal") - getNumericFontWeight(b.fontWeight?.toString() ?? "normal");
+    }
+    if (!a.fontStyle || !b.fontStyle) {
+      return !a.fontStyle ? 1 : -1;
+    }
+    return a.fontStyle.localeCompare(b.fontStyle);
+  });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  sortFontFaces
+});
+//# sourceMappingURL=sort-font-faces.js.map

package/build/font-library-modal/utils/sort-font-faces.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/font-library-modal/utils/sort-font-faces.ts"],
+  "sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { FontFace } from '../types';\n\nfunction getNumericFontWeight( value: string ): number {\n\tswitch ( value ) {\n\t\tcase 'normal':\n\t\t\treturn 400;\n\t\tcase 'bold':\n\t\t\treturn 700;\n\t\tcase 'bolder':\n\t\t\treturn 500;\n\t\tcase 'lighter':\n\t\t\treturn 300;\n\t\tdefault:\n\t\t\treturn parseInt( value, 10 );\n\t}\n}\n\nexport function sortFontFaces( faces: FontFace[] ): FontFace[] {\n\treturn faces.sort( ( a, b ) => {\n\t\t// Ensure 'normal' fontStyle is always first\n\t\tif ( a.fontStyle === 'normal' && b.fontStyle !== 'normal' ) {\n\t\t\treturn -1;\n\t\t}\n\t\tif ( b.fontStyle === 'normal' && a.fontStyle !== 'normal' ) {\n\t\t\treturn 1;\n\t\t}\n\n\t\t// If both fontStyles are the same, sort by fontWeight\n\t\tif ( a.fontStyle === b.fontStyle ) {\n\t\t\treturn (\n\t\t\t\tgetNumericFontWeight( a.fontWeight?.toString() ?? 'normal' ) -\n\t\t\t\tgetNumericFontWeight( b.fontWeight?.toString() ?? 'normal' )\n\t\t\t);\n\t\t}\n\n\t\t// Sort other fontStyles alphabetically\n\t\tif ( ! a.fontStyle || ! b.fontStyle ) {\n\t\t\treturn ! a.fontStyle ? 1 : -1;\n\t\t}\n\n\t\treturn a.fontStyle.localeCompare( b.fontStyle );\n\t} );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA,SAAS,qBAAsB,OAAwB;AACtD,UAAS,OAAQ;AAAA,IAChB,KAAK;AACJ,aAAO;AAAA,IACR,KAAK;AACJ,aAAO;AAAA,IACR,KAAK;AACJ,aAAO;AAAA,IACR,KAAK;AACJ,aAAO;AAAA,IACR;AACC,aAAO,SAAU,OAAO,EAAG;AAAA,EAC7B;AACD;AAEO,SAAS,cAAe,OAAgC;AAC9D,SAAO,MAAM,KAAM,CAAE,GAAG,MAAO;AAE9B,QAAK,EAAE,cAAc,YAAY,EAAE,cAAc,UAAW;AAC3D,aAAO;AAAA,IACR;AACA,QAAK,EAAE,cAAc,YAAY,EAAE,cAAc,UAAW;AAC3D,aAAO;AAAA,IACR;AAGA,QAAK,EAAE,cAAc,EAAE,WAAY;AAClC,aACC,qBAAsB,EAAE,YAAY,SAAS,KAAK,QAAS,IAC3D,qBAAsB,EAAE,YAAY,SAAS,KAAK,QAAS;AAAA,IAE7D;AAGA,QAAK,CAAE,EAAE,aAAa,CAAE,EAAE,WAAY;AACrC,aAAO,CAAE,EAAE,YAAY,IAAI;AAAA,IAC5B;AAEA,WAAO,EAAE,UAAU,cAAe,EAAE,SAAU;AAAA,EAC/C,CAAE;AACH;",
+  "names": []
+}

package/build/font-library-modal/utils/toggleFont.js

@@ -0,0 +1,67 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var toggleFont_exports = {};
+__export(toggleFont_exports, {
+  toggleFont: () => toggleFont
+});
+module.exports = __toCommonJS(toggleFont_exports);
+function toggleFont(font, face, initialfonts = []) {
+  const isFontActivated = (f) => f.slug === font.slug;
+  const getActivatedFont = (fonts) => fonts.find(isFontActivated);
+  const toggleEntireFontFamily = (activatedFont2) => {
+    if (!activatedFont2) {
+      return [...initialfonts, font];
+    }
+    return initialfonts.filter(
+      (f) => !isFontActivated(f)
+    );
+  };
+  const toggleFontVariant = (activatedFont2) => {
+    const isFaceActivated = (f) => f.fontWeight === face.fontWeight && f.fontStyle === face.fontStyle;
+    if (!activatedFont2) {
+      return [...initialfonts, { ...font, fontFace: [face] }];
+    }
+    let newFontFaces = activatedFont2.fontFace || [];
+    if (newFontFaces.find(isFaceActivated)) {
+      newFontFaces = newFontFaces.filter(
+        (f) => !isFaceActivated(f)
+      );
+    } else {
+      newFontFaces = [...newFontFaces, face];
+    }
+    if (newFontFaces.length === 0) {
+      return initialfonts.filter(
+        (f) => !isFontActivated(f)
+      );
+    }
+    return initialfonts.map(
+      (f) => isFontActivated(f) ? { ...f, fontFace: newFontFaces } : f
+    );
+  };
+  const activatedFont = getActivatedFont(initialfonts);
+  if (!face) {
+    return toggleEntireFontFamily(activatedFont);
+  }
+  return toggleFontVariant(activatedFont);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  toggleFont
+});
+//# sourceMappingURL=toggleFont.js.map

package/build/font-library-modal/utils/toggleFont.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/font-library-modal/utils/toggleFont.ts"],
+  "sourcesContent": ["/**\n * Toggles the activation of a given font or font variant within a list of custom fonts.\n *\n * - If only the font is provided (without face), the entire font family's activation is toggled.\n * - If both font and face are provided, the activation of the specific font variant is toggled.\n *\n * @param {Object} font            - The font to be toggled.\n * @param {string} font.slug       - The unique identifier for the font.\n * @param {Array}  [font.fontFace] - The list of font variants (faces) associated with the font.\n *\n * @param {Object} [face]          - The specific font variant to be toggled.\n * @param {string} face.fontWeight - The weight of the font variant.\n * @param {string} face.fontStyle  - The style of the font variant.\n *\n * @param {Array}  initialfonts    - The initial list of custom fonts.\n *\n * @return {Array} - The updated list of custom fonts with the font/font variant toggled.\n *\n * @example\n * const customFonts = [\n *     { slug: 'roboto', fontFace: [{ fontWeight: '400', fontStyle: 'normal' }] }\n * ];\n *\n * toggleFont({ slug: 'roboto' }, null, customFonts);\n * // This will remove 'roboto' from customFonts\n *\n * toggleFont({ slug: 'roboto' }, { fontWeight: '400', fontStyle: 'normal' }, customFonts);\n * // This will remove the specified face from 'roboto' in customFonts\n *\n * toggleFont({ slug: 'roboto' }, { fontWeight: '500', fontStyle: 'normal' }, customFonts);\n * // This will add the specified face to 'roboto' in customFonts\n */\n/**\n * Internal dependencies\n */\nimport type { FontFamily, FontFace } from '../types';\n\nexport function toggleFont(\n\tfont: FontFamily,\n\tface?: FontFace,\n\tinitialfonts: FontFamily[] = []\n): FontFamily[] {\n\t// Helper to check if a font is activated based on its slug\n\tconst isFontActivated = ( f: FontFamily ): boolean => f.slug === font.slug;\n\n\t// Helper to get the activated font from a list of fonts\n\tconst getActivatedFont = ( fonts: FontFamily[] ): FontFamily | undefined =>\n\t\tfonts.find( isFontActivated );\n\n\t// Toggle the activation status of an entire font family\n\tconst toggleEntireFontFamily = (\n\t\tactivatedFont: FontFamily | undefined\n\t): FontFamily[] => {\n\t\tif ( ! activatedFont ) {\n\t\t\t// If the font is not active, activate the entire font family\n\t\t\treturn [ ...initialfonts, font ];\n\t\t}\n\t\t// If the font is already active, deactivate the entire font family\n\t\treturn initialfonts.filter(\n\t\t\t( f: FontFamily ) => ! isFontActivated( f )\n\t\t);\n\t};\n\n\t// Toggle the activation status of a specific font variant\n\tconst toggleFontVariant = (\n\t\tactivatedFont: FontFamily | undefined\n\t): FontFamily[] => {\n\t\tconst isFaceActivated = ( f: FontFace ): boolean =>\n\t\t\tf.fontWeight === face!.fontWeight &&\n\t\t\tf.fontStyle === face!.fontStyle;\n\n\t\tif ( ! activatedFont ) {\n\t\t\t// If the font family is not active, activate the font family with the font variant\n\t\t\treturn [ ...initialfonts, { ...font, fontFace: [ face! ] } ];\n\t\t}\n\n\t\tlet newFontFaces = activatedFont.fontFace || [];\n\n\t\tif ( newFontFaces.find( isFaceActivated ) ) {\n\t\t\t// If the font variant is active, deactivate it\n\t\t\tnewFontFaces = newFontFaces.filter(\n\t\t\t\t( f: FontFace ) => ! isFaceActivated( f )\n\t\t\t);\n\t\t} else {\n\t\t\t// If the font variant is not active, activate it\n\t\t\tnewFontFaces = [ ...newFontFaces, face! ];\n\t\t}\n\n\t\t// If there are no more font faces, deactivate the font family\n\t\tif ( newFontFaces.length === 0 ) {\n\t\t\treturn initialfonts.filter(\n\t\t\t\t( f: FontFamily ) => ! isFontActivated( f )\n\t\t\t);\n\t\t}\n\n\t\t// Return updated fonts list with toggled font variant\n\t\treturn initialfonts.map( ( f: FontFamily ) =>\n\t\t\tisFontActivated( f ) ? { ...f, fontFace: newFontFaces } : f\n\t\t);\n\t};\n\n\tconst activatedFont = getActivatedFont( initialfonts );\n\n\tif ( ! face ) {\n\t\treturn toggleEntireFontFamily( activatedFont );\n\t}\n\n\treturn toggleFontVariant( activatedFont );\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqCO,SAAS,WACf,MACA,MACA,eAA6B,CAAC,GACf;AAEf,QAAM,kBAAkB,CAAE,MAA4B,EAAE,SAAS,KAAK;AAGtE,QAAM,mBAAmB,CAAE,UAC1B,MAAM,KAAM,eAAgB;AAG7B,QAAM,yBAAyB,CAC9BA,mBACkB;AAClB,QAAK,CAAEA,gBAAgB;AAEtB,aAAO,CAAE,GAAG,cAAc,IAAK;AAAA,IAChC;AAEA,WAAO,aAAa;AAAA,MACnB,CAAE,MAAmB,CAAE,gBAAiB,CAAE;AAAA,IAC3C;AAAA,EACD;AAGA,QAAM,oBAAoB,CACzBA,mBACkB;AAClB,UAAM,kBAAkB,CAAE,MACzB,EAAE,eAAe,KAAM,cACvB,EAAE,cAAc,KAAM;AAEvB,QAAK,CAAEA,gBAAgB;AAEtB,aAAO,CAAE,GAAG,cAAc,EAAE,GAAG,MAAM,UAAU,CAAE,IAAM,EAAE,CAAE;AAAA,IAC5D;AAEA,QAAI,eAAeA,eAAc,YAAY,CAAC;AAE9C,QAAK,aAAa,KAAM,eAAgB,GAAI;AAE3C,qBAAe,aAAa;AAAA,QAC3B,CAAE,MAAiB,CAAE,gBAAiB,CAAE;AAAA,MACzC;AAAA,IACD,OAAO;AAEN,qBAAe,CAAE,GAAG,cAAc,IAAM;AAAA,IACzC;AAGA,QAAK,aAAa,WAAW,GAAI;AAChC,aAAO,aAAa;AAAA,QACnB,CAAE,MAAmB,CAAE,gBAAiB,CAAE;AAAA,MAC3C;AAAA,IACD;AAGA,WAAO,aAAa;AAAA,MAAK,CAAE,MAC1B,gBAAiB,CAAE,IAAI,EAAE,GAAG,GAAG,UAAU,aAAa,IAAI;AAAA,IAC3D;AAAA,EACD;AAEA,QAAM,gBAAgB,iBAAkB,YAAa;AAErD,MAAK,CAAE,MAAO;AACb,WAAO,uBAAwB,aAAc;AAAA,EAC9C;AAEA,SAAO,kBAAmB,aAAc;AACzC;",
+  "names": ["activatedFont"]
+}

package/build/font-sizes/confirm-delete-font-size-dialog.js

@@ -0,0 +1,60 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var confirm_delete_font_size_dialog_exports = {};
+__export(confirm_delete_font_size_dialog_exports, {
+  default: () => confirm_delete_font_size_dialog_default
+});
+module.exports = __toCommonJS(confirm_delete_font_size_dialog_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@wordpress/components");
+var import_i18n = require("@wordpress/i18n");
+function ConfirmDeleteFontSizeDialog({
+  fontSize,
+  isOpen,
+  toggleOpen,
+  handleRemoveFontSize
+}) {
+  const handleConfirm = async () => {
+    toggleOpen();
+    handleRemoveFontSize(fontSize);
+  };
+  const handleCancel = () => {
+    toggleOpen();
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_components.__experimentalConfirmDialog,
+    {
+      isOpen,
+      cancelButtonText: (0, import_i18n.__)("Cancel"),
+      confirmButtonText: (0, import_i18n.__)("Delete"),
+      onCancel: handleCancel,
+      onConfirm: handleConfirm,
+      size: "medium",
+      children: fontSize && (0, import_i18n.sprintf)(
+        /* translators: %s: Name of the font size preset. */
+        (0, import_i18n.__)(
+          'Are you sure you want to delete "%s" font size preset?'
+        ),
+        fontSize.name
+      )
+    }
+  );
+}
+var confirm_delete_font_size_dialog_default = ConfirmDeleteFontSizeDialog;
+//# sourceMappingURL=confirm-delete-font-size-dialog.js.map

package/build/font-sizes/confirm-delete-font-size-dialog.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/font-sizes/confirm-delete-font-size-dialog.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport type { FontSize } from '@wordpress/global-styles-engine';\n\ninterface ConfirmDeleteFontSizeDialogProps {\n\tfontSize: FontSize;\n\tisOpen: boolean;\n\ttoggleOpen: () => void;\n\thandleRemoveFontSize: ( fontSize: FontSize ) => void;\n}\n\nfunction ConfirmDeleteFontSizeDialog( {\n\tfontSize,\n\tisOpen,\n\ttoggleOpen,\n\thandleRemoveFontSize,\n}: ConfirmDeleteFontSizeDialogProps ) {\n\tconst handleConfirm = async () => {\n\t\ttoggleOpen();\n\t\thandleRemoveFontSize( fontSize );\n\t};\n\n\tconst handleCancel = () => {\n\t\ttoggleOpen();\n\t};\n\n\treturn (\n\t\t<ConfirmDialog\n\t\t\tisOpen={ isOpen }\n\t\t\tcancelButtonText={ __( 'Cancel' ) }\n\t\t\tconfirmButtonText={ __( 'Delete' ) }\n\t\t\tonCancel={ handleCancel }\n\t\t\tonConfirm={ handleConfirm }\n\t\t\tsize=\"medium\"\n\t\t>\n\t\t\t{ fontSize &&\n\t\t\t\tsprintf(\n\t\t\t\t\t/* translators: %s: Name of the font size preset. */\n\t\t\t\t\t__(\n\t\t\t\t\t\t'Are you sure you want to delete \"%s\" font size preset?'\n\t\t\t\t\t),\n\t\t\t\t\tfontSize.name\n\t\t\t\t) }\n\t\t</ConfirmDialog>\n\t);\n}\n\nexport default ConfirmDeleteFontSizeDialog;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA8BE;AA3BF,wBAA6D;AAC7D,kBAA4B;AAU5B,SAAS,4BAA6B;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAsC;AACrC,QAAM,gBAAgB,YAAY;AACjC,eAAW;AACX,yBAAsB,QAAS;AAAA,EAChC;AAEA,QAAM,eAAe,MAAM;AAC1B,eAAW;AAAA,EACZ;AAEA,SACC;AAAA,IAAC,kBAAAA;AAAA,IAAA;AAAA,MACA;AAAA,MACA,sBAAmB,gBAAI,QAAS;AAAA,MAChC,uBAAoB,gBAAI,QAAS;AAAA,MACjC,UAAW;AAAA,MACX,WAAY;AAAA,MACZ,MAAK;AAAA,MAEH,0BACD;AAAA;AAAA,YAEC;AAAA,UACC;AAAA,QACD;AAAA,QACA,SAAS;AAAA,MACV;AAAA;AAAA,EACF;AAEF;AAEA,IAAO,0CAAQ;",
+  "names": ["ConfirmDialog"]
+}

package/build/font-sizes/confirm-reset-font-sizes-dialog.js

@@ -0,0 +1,55 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var confirm_reset_font_sizes_dialog_exports = {};
+__export(confirm_reset_font_sizes_dialog_exports, {
+  default: () => confirm_reset_font_sizes_dialog_default
+});
+module.exports = __toCommonJS(confirm_reset_font_sizes_dialog_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@wordpress/components");
+var import_i18n = require("@wordpress/i18n");
+function ConfirmResetFontSizesDialog({
+  text,
+  confirmButtonText,
+  isOpen,
+  toggleOpen,
+  onConfirm
+}) {
+  const handleConfirm = async () => {
+    toggleOpen();
+    onConfirm();
+  };
+  const handleCancel = () => {
+    toggleOpen();
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_components.__experimentalConfirmDialog,
+    {
+      isOpen,
+      cancelButtonText: (0, import_i18n.__)("Cancel"),
+      confirmButtonText,
+      onCancel: handleCancel,
+      onConfirm: handleConfirm,
+      size: "medium",
+      children: text
+    }
+  );
+}
+var confirm_reset_font_sizes_dialog_default = ConfirmResetFontSizesDialog;
+//# sourceMappingURL=confirm-reset-font-sizes-dialog.js.map

package/build/font-sizes/confirm-reset-font-sizes-dialog.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/font-sizes/confirm-reset-font-sizes-dialog.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\ninterface ConfirmResetFontSizesDialogProps {\n\ttext: string;\n\tconfirmButtonText: string;\n\tisOpen: boolean;\n\ttoggleOpen: () => void;\n\tonConfirm: () => void;\n}\n\nfunction ConfirmResetFontSizesDialog( {\n\ttext,\n\tconfirmButtonText,\n\tisOpen,\n\ttoggleOpen,\n\tonConfirm,\n}: ConfirmResetFontSizesDialogProps ) {\n\tconst handleConfirm = async () => {\n\t\ttoggleOpen();\n\t\tonConfirm();\n\t};\n\n\tconst handleCancel = () => {\n\t\ttoggleOpen();\n\t};\n\n\treturn (\n\t\t<ConfirmDialog\n\t\t\tisOpen={ isOpen }\n\t\t\tcancelButtonText={ __( 'Cancel' ) }\n\t\t\tconfirmButtonText={ confirmButtonText }\n\t\t\tonCancel={ handleCancel }\n\t\t\tonConfirm={ handleConfirm }\n\t\t\tsize=\"medium\"\n\t\t>\n\t\t\t{ text }\n\t\t</ConfirmDialog>\n\t);\n}\n\nexport default ConfirmResetFontSizesDialog;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA+BE;AA5BF,wBAA6D;AAC7D,kBAAmB;AAUnB,SAAS,4BAA6B;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAsC;AACrC,QAAM,gBAAgB,YAAY;AACjC,eAAW;AACX,cAAU;AAAA,EACX;AAEA,QAAM,eAAe,MAAM;AAC1B,eAAW;AAAA,EACZ;AAEA,SACC;AAAA,IAAC,kBAAAA;AAAA,IAAA;AAAA,MACA;AAAA,MACA,sBAAmB,gBAAI,QAAS;AAAA,MAChC;AAAA,MACA,UAAW;AAAA,MACX,WAAY;AAAA,MACZ,MAAK;AAAA,MAEH;AAAA;AAAA,EACH;AAEF;AAEA,IAAO,0CAAQ;",
+  "names": ["ConfirmDialog"]
+}

package/build/font-sizes/font-size-preview.js

@@ -0,0 +1,50 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var font_size_preview_exports = {};
+__export(font_size_preview_exports, {
+  default: () => font_size_preview_default
+});
+module.exports = __toCommonJS(font_size_preview_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_block_editor = require("@wordpress/block-editor");
+var import_i18n = require("@wordpress/i18n");
+var import_hooks = require("../hooks");
+function FontSizePreview({ fontSize }) {
+  const [font] = (0, import_hooks.useStyle)("typography");
+  const input = typeof fontSize?.fluid === "object" && fontSize?.fluid?.min && fontSize?.fluid?.max ? {
+    minimumFontSize: fontSize.fluid.min,
+    maximumFontSize: fontSize.fluid.max
+  } : {
+    fontSize: fontSize.size
+  };
+  const computedFontSize = (0, import_block_editor.getComputedFluidTypographyValue)(input);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: "global-styles-ui-typography-preview",
+      style: {
+        fontSize: computedFontSize,
+        fontFamily: font?.fontFamily ?? "serif"
+      },
+      children: (0, import_i18n.__)("Aa")
+    }
+  );
+}
+var font_size_preview_default = FontSizePreview;
+//# sourceMappingURL=font-size-preview.js.map

package/build/font-sizes/font-size-preview.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/font-sizes/font-size-preview.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\n// @ts-expect-error: Not typed yet.\nimport { getComputedFluidTypographyValue } from '@wordpress/block-editor';\nimport { __ } from '@wordpress/i18n';\nimport type { FontSize } from '@wordpress/global-styles-engine';\n\n/**\n * Internal dependencies\n */\nimport { useStyle } from '../hooks';\n\ninterface FontSizePreviewProps {\n\tfontSize: FontSize;\n}\n\nfunction FontSizePreview( { fontSize }: FontSizePreviewProps ) {\n\tconst [ font ] = useStyle< { fontFamily?: string } >( 'typography' );\n\n\tconst input =\n\t\ttypeof fontSize?.fluid === 'object' &&\n\t\tfontSize?.fluid?.min &&\n\t\tfontSize?.fluid?.max\n\t\t\t? {\n\t\t\t\t\tminimumFontSize: fontSize.fluid.min,\n\t\t\t\t\tmaximumFontSize: fontSize.fluid.max,\n\t\t\t  }\n\t\t\t: {\n\t\t\t\t\tfontSize: fontSize.size,\n\t\t\t  };\n\n\tconst computedFontSize = getComputedFluidTypographyValue( input );\n\treturn (\n\t\t<div\n\t\t\tclassName=\"global-styles-ui-typography-preview\"\n\t\t\tstyle={ {\n\t\t\t\tfontSize: computedFontSize,\n\t\t\t\tfontFamily: font?.fontFamily ?? 'serif',\n\t\t\t} }\n\t\t>\n\t\t\t{ __( 'Aa' ) }\n\t\t</div>\n\t);\n}\n\nexport default FontSizePreview;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkCE;AA9BF,0BAAgD;AAChD,kBAAmB;AAMnB,mBAAyB;AAMzB,SAAS,gBAAiB,EAAE,SAAS,GAA0B;AAC9D,QAAM,CAAE,IAAK,QAAI,uBAAqC,YAAa;AAEnE,QAAM,QACL,OAAO,UAAU,UAAU,YAC3B,UAAU,OAAO,OACjB,UAAU,OAAO,MACd;AAAA,IACA,iBAAiB,SAAS,MAAM;AAAA,IAChC,iBAAiB,SAAS,MAAM;AAAA,EAChC,IACA;AAAA,IACA,UAAU,SAAS;AAAA,EACnB;AAEJ,QAAM,uBAAmB,qDAAiC,KAAM;AAChE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,OAAQ;AAAA,QACP,UAAU;AAAA,QACV,YAAY,MAAM,cAAc;AAAA,MACjC;AAAA,MAEE,8BAAI,IAAK;AAAA;AAAA,EACZ;AAEF;AAEA,IAAO,4BAAQ;",
+  "names": []
+}

package/build/font-sizes/font-size.js

@@ -0,0 +1,261 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var font_size_exports = {};
+__export(font_size_exports, {
+  default: () => font_size_default
+});
+module.exports = __toCommonJS(font_size_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_i18n = require("@wordpress/i18n");
+var import_components = require("@wordpress/components");
+var import_icons = require("@wordpress/icons");
+var import_element = require("@wordpress/element");
+var import_screen_header = require("../screen-header");
+var import_font_size_preview = __toESM(require("./font-size-preview"));
+var import_confirm_delete_font_size_dialog = __toESM(require("./confirm-delete-font-size-dialog"));
+var import_rename_font_size_dialog = __toESM(require("./rename-font-size-dialog"));
+var import_size_control = require("../size-control");
+var import_hooks = require("../hooks");
+var import_lock_unlock = require("../lock-unlock");
+const { Menu } = (0, import_lock_unlock.unlock)(import_components.privateApis);
+function FontSize() {
+  const [isDeleteConfirmOpen, setIsDeleteConfirmOpen] = (0, import_element.useState)(false);
+  const [isRenameDialogOpen, setIsRenameDialogOpen] = (0, import_element.useState)(false);
+  const {
+    params: { origin, slug },
+    goBack
+  } = (0, import_components.useNavigator)();
+  const [fontSizes, setFontSizes] = (0, import_hooks.useSetting)("typography.fontSizes");
+  const [globalFluid] = (0, import_hooks.useSetting)("typography.fluid");
+  const sizes = fontSizes?.[origin] ?? [];
+  const fontSize = sizes.find(
+    (size) => size.slug === slug
+  );
+  (0, import_element.useEffect)(() => {
+    if (!!slug && !fontSize) {
+      goBack();
+    }
+  }, [slug, fontSize, goBack]);
+  if (!origin || !slug || !fontSize) {
+    return null;
+  }
+  const isFluid = fontSize?.fluid !== void 0 ? !!fontSize.fluid : !!globalFluid;
+  const isCustomFluid = typeof fontSize?.fluid === "object";
+  const handleNameChange = (value) => {
+    updateFontSize("name", value);
+  };
+  const handleFontSizeChange = (value) => {
+    updateFontSize("size", value);
+  };
+  const handleFluidChange = (value) => {
+    updateFontSize("fluid", value);
+  };
+  const handleCustomFluidValues = (value) => {
+    if (value) {
+      updateFontSize("fluid", {
+        min: fontSize.size,
+        max: fontSize.size
+      });
+    } else {
+      updateFontSize("fluid", true);
+    }
+  };
+  const handleMinChange = (value) => {
+    const fluid = typeof fontSize.fluid === "object" ? fontSize.fluid : {};
+    updateFontSize("fluid", { ...fluid, min: value });
+  };
+  const handleMaxChange = (value) => {
+    const fluid = typeof fontSize.fluid === "object" ? fontSize.fluid : {};
+    updateFontSize("fluid", { ...fluid, max: value });
+  };
+  const updateFontSize = (key, value) => {
+    const newFontSizes = sizes.map((size) => {
+      if (size.slug === slug) {
+        return { ...size, [key]: value };
+      }
+      return size;
+    });
+    setFontSizes({
+      ...fontSizes,
+      [origin]: newFontSizes
+    });
+  };
+  const handleRemoveFontSize = () => {
+    const newFontSizes = sizes.filter((size) => size.slug !== slug);
+    setFontSizes({
+      ...fontSizes,
+      [origin]: newFontSizes
+    });
+  };
+  const toggleDeleteConfirm = () => {
+    setIsDeleteConfirmOpen(!isDeleteConfirmOpen);
+  };
+  const toggleRenameDialog = () => {
+    setIsRenameDialogOpen(!isRenameDialogOpen);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_confirm_delete_font_size_dialog.default,
+      {
+        fontSize,
+        isOpen: isDeleteConfirmOpen,
+        toggleOpen: toggleDeleteConfirm,
+        handleRemoveFontSize
+      }
+    ),
+    isRenameDialogOpen && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_rename_font_size_dialog.default,
+      {
+        fontSize,
+        toggleOpen: toggleRenameDialog,
+        handleRename: handleNameChange
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalVStack, { spacing: 4, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalHStack, { justify: "space-between", alignment: "flex-start", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_screen_header.ScreenHeader,
+          {
+            title: fontSize.name,
+            description: (0, import_i18n.sprintf)(
+              /* translators: %s: font size preset name. */
+              (0, import_i18n.__)("Manage the font size %s."),
+              fontSize.name
+            )
+          }
+        ),
+        origin === "custom" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.FlexItem, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_components.__experimentalSpacer,
+          {
+            marginTop: 3,
+            marginBottom: 0,
+            paddingX: 4,
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Menu, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                Menu.TriggerButton,
+                {
+                  render: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    import_components.Button,
+                    {
+                      size: "small",
+                      icon: import_icons.moreVertical,
+                      label: (0, import_i18n.__)(
+                        "Font size options"
+                      )
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Menu.Popover, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  Menu.Item,
+                  {
+                    onClick: toggleRenameDialog,
+                    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Menu.ItemLabel, { children: (0, import_i18n.__)("Rename") })
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  Menu.Item,
+                  {
+                    onClick: toggleDeleteConfirm,
+                    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Menu.ItemLabel, { children: (0, import_i18n.__)("Delete") })
+                  }
+                )
+              ] })
+            ] })
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalView, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_components.__experimentalSpacer,
+        {
+          paddingX: 4,
+          marginBottom: 0,
+          paddingBottom: 6,
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalVStack, { spacing: 4, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.FlexItem, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_font_size_preview.default, { fontSize }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_size_control.SizeControl,
+              {
+                label: (0, import_i18n.__)("Size"),
+                value: !isCustomFluid && fontSize.size ? String(fontSize.size) : "",
+                onChange: handleFontSizeChange,
+                disabled: isCustomFluid
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_components.ToggleControl,
+              {
+                label: (0, import_i18n.__)("Fluid typography"),
+                help: (0, import_i18n.__)(
+                  "Scale the font size dynamically to fit the screen or viewport."
+                ),
+                checked: isFluid,
+                onChange: handleFluidChange,
+                __nextHasNoMarginBottom: true
+              }
+            ),
+            isFluid && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_components.ToggleControl,
+              {
+                label: (0, import_i18n.__)("Custom fluid values"),
+                help: (0, import_i18n.__)(
+                  "Set custom min and max values for the fluid font size."
+                ),
+                checked: isCustomFluid,
+                onChange: handleCustomFluidValues,
+                __nextHasNoMarginBottom: true
+              }
+            ),
+            isCustomFluid && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_size_control.SizeControl,
+                {
+                  label: (0, import_i18n.__)("Minimum"),
+                  value: typeof fontSize?.fluid === "object" ? fontSize.fluid?.min : void 0,
+                  onChange: handleMinChange
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_size_control.SizeControl,
+                {
+                  label: (0, import_i18n.__)("Maximum"),
+                  value: typeof fontSize?.fluid === "object" ? fontSize.fluid?.max : void 0,
+                  onChange: handleMaxChange
+                }
+              )
+            ] })
+          ] })
+        }
+      ) })
+    ] })
+  ] });
+}
+var font_size_default = FontSize;
+//# sourceMappingURL=font-size.js.map