@wordpress/edit-site 6.32.0 → 6.32.1-next.b8c8708f3.0

package/build/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js

@@ -1,16 +1,29 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+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
 });
-exports.default = void 0;
-var _components = require("@wordpress/components");
-var _i18n = require("@wordpress/i18n");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
+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,
@@ -25,15 +38,18 @@ function ConfirmResetFontSizesDialog({
   const handleCancel = () => {
     toggleOpen();
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalConfirmDialog, {
-    isOpen: isOpen,
-    cancelButtonText: (0, _i18n.__)('Cancel'),
-    confirmButtonText: confirmButtonText,
-    onCancel: handleCancel,
-    onConfirm: handleConfirm,
-    size: "medium",
-    children: text
-  });
+  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 _default = exports.default = ConfirmResetFontSizesDialog;
-//# sourceMappingURL=confirm-reset-font-sizes-dialog.js.map
+var confirm_reset_font_sizes_dialog_default = ConfirmResetFontSizesDialog;
+//# sourceMappingURL=confirm-reset-font-sizes-dialog.js.map

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

@@ -1 +1,7 @@
-{"version":3,"names":["_components","require","_i18n","_jsxRuntime","ConfirmResetFontSizesDialog","text","confirmButtonText","isOpen","toggleOpen","onConfirm","handleConfirm","handleCancel","jsx","__experimentalConfirmDialog","cancelButtonText","__","onCancel","size","children","_default","exports","default"],"sources":["@wordpress/edit-site/src/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\nfunction ConfirmResetFontSizesDialog( {\n\ttext,\n\tconfirmButtonText,\n\tisOpen,\n\ttoggleOpen,\n\tonConfirm,\n} ) {\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":";;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAAqC,IAAAE,WAAA,GAAAF,OAAA;AAJrC;AACA;AACA;;AAIA,SAASG,2BAA2BA,CAAE;EACrCC,IAAI;EACJC,iBAAiB;EACjBC,MAAM;EACNC,UAAU;EACVC;AACD,CAAC,EAAG;EACH,MAAMC,aAAa,GAAG,MAAAA,CAAA,KAAY;IACjCF,UAAU,CAAC,CAAC;IACZC,SAAS,CAAC,CAAC;EACZ,CAAC;EAED,MAAME,YAAY,GAAGA,CAAA,KAAM;IAC1BH,UAAU,CAAC,CAAC;EACb,CAAC;EAED,oBACC,IAAAL,WAAA,CAAAS,GAAA,EAACZ,WAAA,CAAAa,2BAAa;IACbN,MAAM,EAAGA,MAAQ;IACjBO,gBAAgB,EAAG,IAAAC,QAAE,EAAE,QAAS,CAAG;IACnCT,iBAAiB,EAAGA,iBAAmB;IACvCU,QAAQ,EAAGL,YAAc;IACzBF,SAAS,EAAGC,aAAe;IAC3BO,IAAI,EAAC,QAAQ;IAAAC,QAAA,EAEXb;EAAI,CACQ,CAAC;AAElB;AAAC,IAAAc,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEcjB,2BAA2B","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../../src/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\nfunction ConfirmResetFontSizesDialog( {\n\ttext,\n\tconfirmButtonText,\n\tisOpen,\n\ttoggleOpen,\n\tonConfirm,\n} ) {\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;AAuBE;AApBF,wBAA6D;AAC7D,kBAAmB;AAEnB,SAAS,4BAA6B;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,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/components/global-styles/font-sizes/font-size-preview.js

@@ -1,44 +1,51 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+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
 });
-exports.default = void 0;
-var _blockEditor = require("@wordpress/block-editor");
-var _i18n = require("@wordpress/i18n");
-var _lockUnlock = require("../../../lock-unlock");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-const {
-  useGlobalStyle
-} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
-function FontSizePreview({
-  fontSize
-}) {
-  var _font$fontFamily;
-  const [font] = useGlobalStyle('typography');
+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_lock_unlock = require("../../../lock-unlock");
+const { useGlobalStyle } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
+function FontSizePreview({ fontSize }) {
+  const [font] = useGlobalStyle("typography");
   const input = fontSize?.fluid?.min && fontSize?.fluid?.max ? {
     minimumFontSize: fontSize.fluid.min,
     maximumFontSize: fontSize.fluid.max
   } : {
     fontSize: fontSize.size
   };
-  const computedFontSize = (0, _blockEditor.getComputedFluidTypographyValue)(input);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: "edit-site-typography-preview",
-    style: {
-      fontSize: computedFontSize,
-      fontFamily: (_font$fontFamily = font?.fontFamily) !== null && _font$fontFamily !== void 0 ? _font$fontFamily : 'serif'
-    },
-    children: (0, _i18n.__)('Aa')
-  });
+  const computedFontSize = (0, import_block_editor.getComputedFluidTypographyValue)(input);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: "edit-site-typography-preview",
+      style: {
+        fontSize: computedFontSize,
+        fontFamily: font?.fontFamily ?? "serif"
+      },
+      children: (0, import_i18n.__)("Aa")
+    }
+  );
 }
-var _default = exports.default = FontSizePreview;
-//# sourceMappingURL=font-size-preview.js.map
+var font_size_preview_default = FontSizePreview;
+//# sourceMappingURL=font-size-preview.js.map

package/build/components/global-styles/font-sizes/font-size-preview.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_blockEditor","require","_i18n","_lockUnlock","_jsxRuntime","useGlobalStyle","unlock","blockEditorPrivateApis","FontSizePreview","fontSize","_font$fontFamily","font","input","fluid","min","max","minimumFontSize","maximumFontSize","size","computedFontSize","getComputedFluidTypographyValue","jsx","className","style","fontFamily","children","__","_default","exports","default"],"sources":["@wordpress/edit-site/src/components/global-styles/font-sizes/font-size-preview.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tgetComputedFluidTypographyValue,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../../lock-unlock';\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction FontSizePreview( { fontSize } ) {\n\tconst [ font ] = useGlobalStyle( 'typography' );\n\n\tconst input =\n\t\tfontSize?.fluid?.min && fontSize?.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=\"edit-site-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":";;;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AAIA,IAAAC,KAAA,GAAAD,OAAA;AAKA,IAAAE,WAAA,GAAAF,OAAA;AAA8C,IAAAG,WAAA,GAAAH,OAAA;AAZ9C;AACA;AACA;;AAOA;AACA;AACA;;AAEA,MAAM;EAAEI;AAAe,CAAC,GAAG,IAAAC,kBAAM,EAAEC,wBAAuB,CAAC;AAE3D,SAASC,eAAeA,CAAE;EAAEC;AAAS,CAAC,EAAG;EAAA,IAAAC,gBAAA;EACxC,MAAM,CAAEC,IAAI,CAAE,GAAGN,cAAc,CAAE,YAAa,CAAC;EAE/C,MAAMO,KAAK,GACVH,QAAQ,EAAEI,KAAK,EAAEC,GAAG,IAAIL,QAAQ,EAAEI,KAAK,EAAEE,GAAG,GACzC;IACAC,eAAe,EAAEP,QAAQ,CAACI,KAAK,CAACC,GAAG;IACnCG,eAAe,EAAER,QAAQ,CAACI,KAAK,CAACE;EAChC,CAAC,GACD;IACAN,QAAQ,EAAEA,QAAQ,CAACS;EACnB,CAAC;EAEL,MAAMC,gBAAgB,GAAG,IAAAC,4CAA+B,EAAER,KAAM,CAAC;EACjE,oBACC,IAAAR,WAAA,CAAAiB,GAAA;IACCC,SAAS,EAAC,8BAA8B;IACxCC,KAAK,EAAG;MACPd,QAAQ,EAAEU,gBAAgB;MAC1BK,UAAU,GAAAd,gBAAA,GAAEC,IAAI,EAAEa,UAAU,cAAAd,gBAAA,cAAAA,gBAAA,GAAI;IACjC,CAAG;IAAAe,QAAA,EAED,IAAAC,QAAE,EAAE,IAAK;EAAC,CACR,CAAC;AAER;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEcrB,eAAe","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../../src/components/global-styles/font-sizes/font-size-preview.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tgetComputedFluidTypographyValue,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../../lock-unlock';\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction FontSizePreview( { fontSize } ) {\n\tconst [ font ] = useGlobalStyle( 'typography' );\n\n\tconst input =\n\t\tfontSize?.fluid?.min && fontSize?.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=\"edit-site-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;AA8BE;AA3BF,0BAGO;AACP,kBAAmB;AAKnB,yBAAuB;AACvB,MAAM,EAAE,eAAe,QAAI,2BAAQ,oBAAAA,WAAuB;AAE1D,SAAS,gBAAiB,EAAE,SAAS,GAAI;AACxC,QAAM,CAAE,IAAK,IAAI,eAAgB,YAAa;AAE9C,QAAM,QACL,UAAU,OAAO,OAAO,UAAU,OAAO,MACtC;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": ["blockEditorPrivateApis"]
+}

package/build/components/global-styles/font-sizes/font-size.js

@@ -1,58 +1,64 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+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
 });
-exports.default = void 0;
-var _blockEditor = require("@wordpress/block-editor");
-var _i18n = require("@wordpress/i18n");
-var _components = require("@wordpress/components");
-var _icons = require("@wordpress/icons");
-var _element = require("@wordpress/element");
-var _lockUnlock = require("../../../lock-unlock");
-var _header = _interopRequireDefault(require("../header"));
-var _fontSizePreview = _interopRequireDefault(require("./font-size-preview"));
-var _confirmDeleteFontSizeDialog = _interopRequireDefault(require("./confirm-delete-font-size-dialog"));
-var _renameFontSizeDialog = _interopRequireDefault(require("./rename-font-size-dialog"));
-var _sizeControl = _interopRequireDefault(require("../size-control"));
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-const {
-  Menu
-} = (0, _lockUnlock.unlock)(_components.privateApis);
-const {
-  useGlobalSetting
-} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
+module.exports = __toCommonJS(font_size_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_components = require("@wordpress/components");
+var import_icons = require("@wordpress/icons");
+var import_element = require("@wordpress/element");
+var import_lock_unlock = require("../../../lock-unlock");
+var import_header = __toESM(require("../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 = __toESM(require("../size-control"));
+const { Menu } = (0, import_lock_unlock.unlock)(import_components.privateApis);
+const { useGlobalSetting } = (0, import_lock_unlock.unlock)(import_block_editor.privateApis);
 function FontSize() {
-  var _fontSizes$origin;
-  const [isDeleteConfirmOpen, setIsDeleteConfirmOpen] = (0, _element.useState)(false);
-  const [isRenameDialogOpen, setIsRenameDialogOpen] = (0, _element.useState)(false);
+  const [isDeleteConfirmOpen, setIsDeleteConfirmOpen] = (0, import_element.useState)(false);
+  const [isRenameDialogOpen, setIsRenameDialogOpen] = (0, import_element.useState)(false);
   const {
-    params: {
-      origin,
-      slug
-    },
+    params: { origin, slug },
     goBack
-  } = (0, _components.useNavigator)();
-  const [fontSizes, setFontSizes] = useGlobalSetting('typography.fontSizes');
-  const [globalFluid] = useGlobalSetting('typography.fluid');
-
-  // Get the font sizes from the origin, default to empty array.
-  const sizes = (_fontSizes$origin = fontSizes[origin]) !== null && _fontSizes$origin !== void 0 ? _fontSizes$origin : [];
-
-  // Get the font size by slug.
-  const fontSize = sizes.find(size => size.slug === slug);
-
-  // Navigate to the font sizes list if the font size is not available.
-  (0, _element.useEffect)(() => {
+  } = (0, import_components.useNavigator)();
+  const [fontSizes, setFontSizes] = useGlobalSetting(
+    "typography.fontSizes"
+  );
+  const [globalFluid] = useGlobalSetting("typography.fluid");
+  const sizes = fontSizes[origin] ?? [];
+  const fontSize = sizes.find((size) => size.slug === slug);
+  (0, import_element.useEffect)(() => {
     if (!!slug && !fontSize) {
       goBack();
     }
@@ -60,52 +66,37 @@ function FontSize() {
   if (!origin || !slug || !fontSize) {
     return null;
   }
-
-  // Whether the font size is fluid. If not defined, use the global fluid value of the theme.
-  const isFluid = fontSize?.fluid !== undefined ? !!fontSize.fluid : !!globalFluid;
-
-  // Whether custom fluid values are used.
-  const isCustomFluid = typeof fontSize?.fluid === 'object';
-  const handleNameChange = value => {
-    updateFontSize('name', value);
+  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 handleFontSizeChange = (value) => {
+    updateFontSize("size", value);
   };
-  const handleFluidChange = value => {
-    updateFontSize('fluid', value);
+  const handleFluidChange = (value) => {
+    updateFontSize("fluid", value);
   };
-  const handleCustomFluidValues = value => {
+  const handleCustomFluidValues = (value) => {
     if (value) {
-      // If custom values are used, init the values with the current ones.
-      updateFontSize('fluid', {
+      updateFontSize("fluid", {
         min: fontSize.size,
         max: fontSize.size
       });
     } else {
-      // If custom fluid values are disabled, set fluid to true.
-      updateFontSize('fluid', true);
+      updateFontSize("fluid", true);
     }
   };
-  const handleMinChange = value => {
-    updateFontSize('fluid', {
-      ...fontSize.fluid,
-      min: value
-    });
+  const handleMinChange = (value) => {
+    updateFontSize("fluid", { ...fontSize.fluid, min: value });
   };
-  const handleMaxChange = value => {
-    updateFontSize('fluid', {
-      ...fontSize.fluid,
-      max: value
-    });
+  const handleMaxChange = (value) => {
+    updateFontSize("fluid", { ...fontSize.fluid, max: value });
   };
   const updateFontSize = (key, value) => {
-    const newFontSizes = sizes.map(size => {
+    const newFontSizes = sizes.map((size) => {
       if (size.slug === slug) {
-        return {
-          ...size,
-          [key]: value
-        }; // Create a new object with updated key
+        return { ...size, [key]: value };
       }
       return size;
     });
@@ -115,7 +106,7 @@ function FontSize() {
     });
   };
   const handleRemoveFontSize = () => {
-    const newFontSizes = sizes.filter(size => size.slug !== slug);
+    const newFontSizes = sizes.filter((size) => size.slug !== slug);
     setFontSizes({
       ...fontSizes,
       [origin]: newFontSizes
@@ -127,97 +118,143 @@ function FontSize() {
   const toggleRenameDialog = () => {
     setIsRenameDialogOpen(!isRenameDialogOpen);
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_confirmDeleteFontSizeDialog.default, {
-      fontSize: fontSize,
-      isOpen: isDeleteConfirmOpen,
-      toggleOpen: toggleDeleteConfirm,
-      handleRemoveFontSize: handleRemoveFontSize
-    }), isRenameDialogOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_renameFontSizeDialog.default, {
-      fontSize: fontSize,
-      toggleOpen: toggleRenameDialog,
-      handleRename: handleNameChange
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalVStack, {
-      spacing: 4,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
-        justify: "space-between",
-        align: "flex-start",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_header.default, {
-          title: fontSize.name,
-          description: (0, _i18n.sprintf)(/* translators: %s: font size preset name. */
-          (0, _i18n.__)('Manage the font size %s.'), fontSize.name)
-        }), origin === 'custom' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalSpacer, {
+  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", align: "flex-start", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_header.default,
+          {
+            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, _jsxRuntime.jsxs)(Menu, {
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Menu.TriggerButton, {
-                render: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
-                  size: "small",
-                  icon: _icons.moreVertical,
-                  label: (0, _i18n.__)('Font size options')
-                })
-              }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Menu.Popover, {
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Menu.Item, {
-                  onClick: toggleRenameDialog,
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Menu.ItemLabel, {
-                    children: (0, _i18n.__)('Rename')
-                  })
-                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Menu.Item, {
-                  onClick: toggleDeleteConfirm,
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Menu.ItemLabel, {
-                    children: (0, _i18n.__)('Delete')
-                  })
-                })]
-              })]
-            })
-          })
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalView, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalSpacer, {
+            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, _jsxRuntime.jsxs)(_components.__experimentalVStack, {
-            spacing: 4,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.FlexItem, {
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_fontSizePreview.default, {
-                fontSize: fontSize
-              })
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sizeControl.default, {
-              label: (0, _i18n.__)('Size'),
-              value: !isCustomFluid ? fontSize.size : '',
-              onChange: handleFontSizeChange,
-              disabled: isCustomFluid
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, {
-              label: (0, _i18n.__)('Fluid typography'),
-              help: (0, _i18n.__)('Scale the font size dynamically to fit the screen or viewport.'),
-              checked: isFluid,
-              onChange: handleFluidChange,
-              __nextHasNoMarginBottom: true
-            }), isFluid && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, {
-              label: (0, _i18n.__)('Custom fluid values'),
-              help: (0, _i18n.__)('Set custom min and max values for the fluid font size.'),
-              checked: isCustomFluid,
-              onChange: handleCustomFluidValues,
-              __nextHasNoMarginBottom: true
-            }), isCustomFluid && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sizeControl.default, {
-                label: (0, _i18n.__)('Minimum'),
-                value: fontSize.fluid?.min,
-                onChange: handleMinChange
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sizeControl.default, {
-                label: (0, _i18n.__)('Maximum'),
-                value: fontSize.fluid?.max,
-                onChange: handleMaxChange
-              })]
-            })]
-          })
-        })
-      })]
-    })]
-  });
+          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.default,
+              {
+                label: (0, import_i18n.__)("Size"),
+                value: !isCustomFluid ? 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.default,
+                {
+                  label: (0, import_i18n.__)("Minimum"),
+                  value: fontSize.fluid?.min,
+                  onChange: handleMinChange
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_size_control.default,
+                {
+                  label: (0, import_i18n.__)("Maximum"),
+                  value: fontSize.fluid?.max,
+                  onChange: handleMaxChange
+                }
+              )
+            ] })
+          ] })
+        }
+      ) })
+    ] })
+  ] });
 }
-var _default = exports.default = FontSize;
-//# sourceMappingURL=font-size.js.map
+var font_size_default = FontSize;
+//# sourceMappingURL=font-size.js.map