@wordpress/global-styles-ui 1.1.0

package/build/font-library-modal/library-font-details.js

@@ -0,0 +1,63 @@
+"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 library_font_details_exports = {};
+__export(library_font_details_exports, {
+  default: () => library_font_details_default
+});
+module.exports = __toCommonJS(library_font_details_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@wordpress/components");
+var import_library_font_variant = __toESM(require("./library-font-variant"));
+var import_sort_font_faces = require("./utils/sort-font-faces");
+function LibraryFontDetails({ font }) {
+  const fontFaces = font.fontFace && font.fontFace.length ? (0, import_sort_font_faces.sortFontFaces)(font.fontFace) : [
+    {
+      fontFamily: font.fontFamily,
+      fontStyle: "normal",
+      fontWeight: "400"
+    }
+  ];
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalSpacer, { margin: 4 }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalVStack, { spacing: 0, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalSpacer, { margin: 8 }),
+      fontFaces.map((face, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_library_font_variant.default,
+        {
+          font,
+          face
+        },
+        `face${i}`
+      ))
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalSpacer, { margin: 8 })
+  ] });
+}
+var library_font_details_default = LibraryFontDetails;
+//# sourceMappingURL=library-font-details.js.map

package/build/font-library-modal/library-font-details.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/font-library-modal/library-font-details.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport LibraryFontVariant from './library-font-variant';\nimport { sortFontFaces } from './utils/sort-font-faces';\nimport type { FontFamily } from './types';\n\nfunction LibraryFontDetails( { font }: { font: FontFamily } ) {\n\tconst fontFaces =\n\t\tfont.fontFace && font.fontFace.length\n\t\t\t? sortFontFaces( font.fontFace )\n\t\t\t: [\n\t\t\t\t\t{\n\t\t\t\t\t\tfontFamily: font.fontFamily,\n\t\t\t\t\t\tfontStyle: 'normal',\n\t\t\t\t\t\tfontWeight: '400',\n\t\t\t\t\t},\n\t\t\t  ];\n\n\treturn (\n\t\t<>\n\t\t\t<Spacer margin={ 4 } />\n\t\t\t<VStack spacing={ 0 }>\n\t\t\t\t<Spacer margin={ 8 } />\n\t\t\t\t{ fontFaces.map( ( face, i ) => (\n\t\t\t\t\t<LibraryFontVariant\n\t\t\t\t\t\tfont={ font }\n\t\t\t\t\t\tface={ face }\n\t\t\t\t\t\tkey={ `face${ i }` }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</VStack>\n\t\t\t<Spacer margin={ 8 } />\n\t\t</>\n\t);\n}\n\nexport default LibraryFontDetails;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BE;AAzBF,wBAGO;AAKP,kCAA+B;AAC/B,6BAA8B;AAG9B,SAAS,mBAAoB,EAAE,KAAK,GAA0B;AAC7D,QAAM,YACL,KAAK,YAAY,KAAK,SAAS,aAC5B,sCAAe,KAAK,QAAS,IAC7B;AAAA,IACA;AAAA,MACC,YAAY,KAAK;AAAA,MACjB,WAAW;AAAA,MACX,YAAY;AAAA,IACb;AAAA,EACA;AAEJ,SACC,4EACC;AAAA,gDAAC,kBAAAA,sBAAA,EAAO,QAAS,GAAI;AAAA,IACrB,6CAAC,kBAAAC,sBAAA,EAAO,SAAU,GACjB;AAAA,kDAAC,kBAAAD,sBAAA,EAAO,QAAS,GAAI;AAAA,MACnB,UAAU,IAAK,CAAE,MAAM,MACxB;AAAA,QAAC,4BAAAE;AAAA,QAAA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,QACM,OAAQ,CAAE;AAAA,MACjB,CACC;AAAA,OACH;AAAA,IACA,4CAAC,kBAAAF,sBAAA,EAAO,QAAS,GAAI;AAAA,KACtB;AAEF;AAEA,IAAO,+BAAQ;",
+  "names": ["Spacer", "VStack", "LibraryFontVariant"]
+}

package/build/font-library-modal/library-font-variant.js

@@ -0,0 +1,81 @@
+"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 library_font_variant_exports = {};
+__export(library_font_variant_exports, {
+  default: () => library_font_variant_default
+});
+module.exports = __toCommonJS(library_font_variant_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_element = require("@wordpress/element");
+var import_components = require("@wordpress/components");
+var import_utils = require("./utils");
+var import_context = require("./context");
+var import_font_demo = __toESM(require("./font-demo"));
+function LibraryFontVariant({
+  face,
+  font
+}) {
+  const { isFontActivated, toggleActivateFont } = (0, import_element.useContext)(import_context.FontLibraryContext);
+  const isInstalled = (font?.fontFace?.length ?? 0) > 0 ? isFontActivated(
+    font.slug,
+    face.fontStyle,
+    face.fontWeight,
+    font.source
+  ) : isFontActivated(font.slug, void 0, void 0, font.source);
+  const handleToggleActivation = () => {
+    if ((font?.fontFace?.length ?? 0) > 0) {
+      toggleActivateFont(font, face);
+      return;
+    }
+    toggleActivateFont(font);
+  };
+  const displayName = font.name + " " + (0, import_utils.getFontFaceVariantName)(face);
+  const checkboxId = (0, import_element.useId)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "font-library-modal__font-card", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.Flex, { justify: "flex-start", align: "center", gap: "1rem", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_components.CheckboxControl,
+      {
+        checked: isInstalled,
+        onChange: handleToggleActivation,
+        __nextHasNoMarginBottom: true,
+        id: checkboxId
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { htmlFor: checkboxId, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_font_demo.default,
+      {
+        font: face,
+        text: displayName,
+        onClick: handleToggleActivation
+      }
+    ) })
+  ] }) });
+}
+var library_font_variant_default = LibraryFontVariant;
+//# sourceMappingURL=library-font-variant.js.map

package/build/font-library-modal/library-font-variant.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/font-library-modal/library-font-variant.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useContext, useId } from '@wordpress/element';\nimport { CheckboxControl, Flex } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { getFontFaceVariantName } from './utils';\nimport { FontLibraryContext } from './context';\nimport FontDemo from './font-demo';\nimport type { FontFace, FontFamily } from './types';\n\nfunction LibraryFontVariant( {\n\tface,\n\tfont,\n}: {\n\tface: FontFace;\n\tfont: FontFamily;\n} ) {\n\tconst { isFontActivated, toggleActivateFont } =\n\t\tuseContext( FontLibraryContext );\n\n\tconst isInstalled =\n\t\t( font?.fontFace?.length ?? 0 ) > 0\n\t\t\t? isFontActivated(\n\t\t\t\t\tfont.slug,\n\t\t\t\t\tface.fontStyle,\n\t\t\t\t\tface.fontWeight,\n\t\t\t\t\tfont.source\n\t\t\t  )\n\t\t\t: isFontActivated( font.slug, undefined, undefined, font.source );\n\n\tconst handleToggleActivation = () => {\n\t\tif ( ( font?.fontFace?.length ?? 0 ) > 0 ) {\n\t\t\ttoggleActivateFont( font, face );\n\t\t\treturn;\n\t\t}\n\t\ttoggleActivateFont( font );\n\t};\n\n\tconst displayName = font.name + ' ' + getFontFaceVariantName( face );\n\tconst checkboxId = useId();\n\n\treturn (\n\t\t<div className=\"font-library-modal__font-card\">\n\t\t\t<Flex justify=\"flex-start\" align=\"center\" gap=\"1rem\">\n\t\t\t\t<CheckboxControl\n\t\t\t\t\tchecked={ isInstalled }\n\t\t\t\t\tonChange={ handleToggleActivation }\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tid={ checkboxId }\n\t\t\t\t/>\n\t\t\t\t<label htmlFor={ checkboxId }>\n\t\t\t\t\t<FontDemo\n\t\t\t\t\t\tfont={ face }\n\t\t\t\t\t\ttext={ displayName }\n\t\t\t\t\t\tonClick={ handleToggleActivation }\n\t\t\t\t\t/>\n\t\t\t\t</label>\n\t\t\t</Flex>\n\t\t</div>\n\t);\n}\n\nexport default LibraryFontVariant;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA+CG;AA5CH,qBAAkC;AAClC,wBAAsC;AAKtC,mBAAuC;AACvC,qBAAmC;AACnC,uBAAqB;AAGrB,SAAS,mBAAoB;AAAA,EAC5B;AAAA,EACA;AACD,GAGI;AACH,QAAM,EAAE,iBAAiB,mBAAmB,QAC3C,2BAAY,iCAAmB;AAEhC,QAAM,eACH,MAAM,UAAU,UAAU,KAAM,IAC/B;AAAA,IACA,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,EACL,IACA,gBAAiB,KAAK,MAAM,QAAW,QAAW,KAAK,MAAO;AAElE,QAAM,yBAAyB,MAAM;AACpC,SAAO,MAAM,UAAU,UAAU,KAAM,GAAI;AAC1C,yBAAoB,MAAM,IAAK;AAC/B;AAAA,IACD;AACA,uBAAoB,IAAK;AAAA,EAC1B;AAEA,QAAM,cAAc,KAAK,OAAO,UAAM,qCAAwB,IAAK;AACnE,QAAM,iBAAa,sBAAM;AAEzB,SACC,4CAAC,SAAI,WAAU,iCACd,uDAAC,0BAAK,SAAQ,cAAa,OAAM,UAAS,KAAI,QAC7C;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,SAAU;AAAA,QACV,UAAW;AAAA,QACX,yBAAuB;AAAA,QACvB,IAAK;AAAA;AAAA,IACN;AAAA,IACA,4CAAC,WAAM,SAAU,YAChB;AAAA,MAAC,iBAAAA;AAAA,MAAA;AAAA,QACA,MAAO;AAAA,QACP,MAAO;AAAA,QACP,SAAU;AAAA;AAAA,IACX,GACD;AAAA,KACD,GACD;AAEF;AAEA,IAAO,+BAAQ;",
+  "names": ["FontDemo"]
+}

package/build/font-library-modal/resolvers.js

@@ -0,0 +1,115 @@
+"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 resolvers_exports = {};
+__export(resolvers_exports, {
+  fetchFontCollection: () => fetchFontCollection,
+  fetchFontCollections: () => fetchFontCollections,
+  fetchGetFontFamilyBySlug: () => fetchGetFontFamilyBySlug,
+  fetchInstallFontFace: () => fetchInstallFontFace,
+  fetchInstallFontFamily: () => fetchInstallFontFamily,
+  fetchUninstallFontFamily: () => fetchUninstallFontFamily
+});
+module.exports = __toCommonJS(resolvers_exports);
+var import_api_fetch = __toESM(require("@wordpress/api-fetch"));
+const FONT_FAMILIES_URL = "/wp/v2/font-families";
+const FONT_COLLECTIONS_URL = "/wp/v2/font-collections";
+async function fetchInstallFontFamily(data) {
+  const config = {
+    path: FONT_FAMILIES_URL,
+    method: "POST",
+    body: data
+  };
+  const response = await (0, import_api_fetch.default)(config);
+  return {
+    id: response.id,
+    ...response.font_family_settings,
+    fontFace: []
+  };
+}
+async function fetchInstallFontFace(fontFamilyId, data) {
+  const config = {
+    path: `${FONT_FAMILIES_URL}/${fontFamilyId}/font-faces`,
+    method: "POST",
+    body: data
+  };
+  const response = await (0, import_api_fetch.default)(config);
+  return {
+    id: response.id,
+    ...response.font_face_settings
+  };
+}
+async function fetchGetFontFamilyBySlug(slug) {
+  const config = {
+    path: `${FONT_FAMILIES_URL}?slug=${slug}&_embed=true`,
+    method: "GET"
+  };
+  const response = await (0, import_api_fetch.default)(config);
+  if (!response || response.length === 0) {
+    return null;
+  }
+  const fontFamilyPost = response[0];
+  return {
+    id: fontFamilyPost.id,
+    ...fontFamilyPost.font_family_settings,
+    fontFace: (fontFamilyPost?._embedded?.font_faces ?? []).map(
+      (face) => face.font_face_settings
+    ) || []
+  };
+}
+async function fetchUninstallFontFamily(fontFamilyId) {
+  const config = {
+    path: `${FONT_FAMILIES_URL}/${fontFamilyId}?force=true`,
+    method: "DELETE"
+  };
+  return await (0, import_api_fetch.default)(config);
+}
+async function fetchFontCollections() {
+  const config = {
+    path: `${FONT_COLLECTIONS_URL}?_fields=slug,name,description`,
+    method: "GET"
+  };
+  return await (0, import_api_fetch.default)(config);
+}
+async function fetchFontCollection(id) {
+  const config = {
+    path: `${FONT_COLLECTIONS_URL}/${id}`,
+    method: "GET"
+  };
+  return await (0, import_api_fetch.default)(config);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  fetchFontCollection,
+  fetchFontCollections,
+  fetchGetFontFamilyBySlug,
+  fetchInstallFontFace,
+  fetchInstallFontFamily,
+  fetchUninstallFontFamily
+});
+//# sourceMappingURL=resolvers.js.map

package/build/font-library-modal/resolvers.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/font-library-modal/resolvers.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\n// The font library modal is pre-existent in Gutenberg\n// It needs to be refactored to move all the API calls to core-data.\n// eslint-disable-next-line no-restricted-imports\nimport apiFetch from '@wordpress/api-fetch';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tCollectionFontFace,\n\tCollectionFontFamily,\n\tFontCollection,\n\tFontFace,\n} from './types';\n\nconst FONT_FAMILIES_URL = '/wp/v2/font-families';\nconst FONT_COLLECTIONS_URL = '/wp/v2/font-collections';\n\nexport async function fetchInstallFontFamily( data: FormData ) {\n\tconst config = {\n\t\tpath: FONT_FAMILIES_URL,\n\t\tmethod: 'POST',\n\t\tbody: data,\n\t};\n\tconst response: CollectionFontFamily = await apiFetch( config );\n\treturn {\n\t\tid: response.id as string,\n\t\t...response.font_family_settings,\n\t\tfontFace: [],\n\t};\n}\n\nexport async function fetchInstallFontFace(\n\tfontFamilyId: string,\n\tdata: FormData\n): Promise< FontFace > {\n\tconst config = {\n\t\tpath: `${ FONT_FAMILIES_URL }/${ fontFamilyId }/font-faces`,\n\t\tmethod: 'POST',\n\t\tbody: data,\n\t};\n\tconst response = ( await apiFetch( config ) ) as CollectionFontFace;\n\treturn {\n\t\tid: response.id,\n\t\t...response.font_face_settings,\n\t};\n}\n\nexport async function fetchGetFontFamilyBySlug( slug: string ) {\n\tconst config = {\n\t\tpath: `${ FONT_FAMILIES_URL }?slug=${ slug }&_embed=true`,\n\t\tmethod: 'GET',\n\t};\n\tconst response = ( await apiFetch( config ) ) as\n\t\t| CollectionFontFamily[]\n\t\t| undefined;\n\tif ( ! response || response.length === 0 ) {\n\t\treturn null;\n\t}\n\tconst fontFamilyPost = response[ 0 ];\n\treturn {\n\t\tid: fontFamilyPost.id,\n\t\t...fontFamilyPost.font_family_settings,\n\t\tfontFace:\n\t\t\t( fontFamilyPost?._embedded?.font_faces ?? [] ).map(\n\t\t\t\t( face ) => face.font_face_settings\n\t\t\t) || [],\n\t};\n}\n\nexport async function fetchUninstallFontFamily(\n\tfontFamilyId: string\n): Promise< {\n\tdeleted: boolean;\n} > {\n\tconst config = {\n\t\tpath: `${ FONT_FAMILIES_URL }/${ fontFamilyId }?force=true`,\n\t\tmethod: 'DELETE',\n\t};\n\treturn await apiFetch( config );\n}\n\nexport async function fetchFontCollections() {\n\tconst config = {\n\t\tpath: `${ FONT_COLLECTIONS_URL }?_fields=slug,name,description`,\n\t\tmethod: 'GET',\n\t};\n\treturn ( await apiFetch( config ) ) as FontCollection[];\n}\n\nexport async function fetchFontCollection( id: string ) {\n\tconst config = {\n\t\tpath: `${ FONT_COLLECTIONS_URL }/${ id }`,\n\t\tmethod: 'GET',\n\t};\n\treturn ( await apiFetch( config ) ) as FontCollection;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA,uBAAqB;AAYrB,MAAM,oBAAoB;AAC1B,MAAM,uBAAuB;AAE7B,eAAsB,uBAAwB,MAAiB;AAC9D,QAAM,SAAS;AAAA,IACd,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,MAAM;AAAA,EACP;AACA,QAAM,WAAiC,UAAM,iBAAAA,SAAU,MAAO;AAC9D,SAAO;AAAA,IACN,IAAI,SAAS;AAAA,IACb,GAAG,SAAS;AAAA,IACZ,UAAU,CAAC;AAAA,EACZ;AACD;AAEA,eAAsB,qBACrB,cACA,MACsB;AACtB,QAAM,SAAS;AAAA,IACd,MAAM,GAAI,iBAAkB,IAAK,YAAa;AAAA,IAC9C,QAAQ;AAAA,IACR,MAAM;AAAA,EACP;AACA,QAAM,WAAa,UAAM,iBAAAA,SAAU,MAAO;AAC1C,SAAO;AAAA,IACN,IAAI,SAAS;AAAA,IACb,GAAG,SAAS;AAAA,EACb;AACD;AAEA,eAAsB,yBAA0B,MAAe;AAC9D,QAAM,SAAS;AAAA,IACd,MAAM,GAAI,iBAAkB,SAAU,IAAK;AAAA,IAC3C,QAAQ;AAAA,EACT;AACA,QAAM,WAAa,UAAM,iBAAAA,SAAU,MAAO;AAG1C,MAAK,CAAE,YAAY,SAAS,WAAW,GAAI;AAC1C,WAAO;AAAA,EACR;AACA,QAAM,iBAAiB,SAAU,CAAE;AACnC,SAAO;AAAA,IACN,IAAI,eAAe;AAAA,IACnB,GAAG,eAAe;AAAA,IAClB,WACG,gBAAgB,WAAW,cAAc,CAAC,GAAI;AAAA,MAC/C,CAAE,SAAU,KAAK;AAAA,IAClB,KAAK,CAAC;AAAA,EACR;AACD;AAEA,eAAsB,yBACrB,cAGG;AACH,QAAM,SAAS;AAAA,IACd,MAAM,GAAI,iBAAkB,IAAK,YAAa;AAAA,IAC9C,QAAQ;AAAA,EACT;AACA,SAAO,UAAM,iBAAAA,SAAU,MAAO;AAC/B;AAEA,eAAsB,uBAAuB;AAC5C,QAAM,SAAS;AAAA,IACd,MAAM,GAAI,oBAAqB;AAAA,IAC/B,QAAQ;AAAA,EACT;AACA,SAAS,UAAM,iBAAAA,SAAU,MAAO;AACjC;AAEA,eAAsB,oBAAqB,IAAa;AACvD,QAAM,SAAS;AAAA,IACd,MAAM,GAAI,oBAAqB,IAAK,EAAG;AAAA,IACvC,QAAQ;AAAA,EACT;AACA,SAAS,UAAM,iBAAAA,SAAU,MAAO;AACjC;",
+  "names": ["apiFetch"]
+}

package/build/font-library-modal/types.js

@@ -0,0 +1,17 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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 types_exports = {};
+module.exports = __toCommonJS(types_exports);
+//# sourceMappingURL=types.js.map

package/build/font-library-modal/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/font-library-modal/types.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport type { FontFamilyPreset } from '@wordpress/global-styles-engine';\n\nexport interface CollectionFontFace {\n\tid: string;\n\tfont_face_settings: FontFace;\n}\n\nexport interface FontFace {\n\tfontFamily: string;\n\tfontStyle?: string;\n\tfontWeight?: string | number;\n\tsrc?: string | string[];\n\tpreview?: string;\n\tfile?: File | File[];\n\tfake?: boolean;\n\tid?: string;\n\tfontDisplay?: string;\n\tfontStretch?: string;\n\tfontVariant?: string;\n\tfontFeatureSettings?: string;\n\tfontVariationSettings?: string;\n\tunicodeRange?: string;\n}\n\nexport interface CollectionFontFamily {\n\tid: string;\n\tfont_family_settings: FontFamily;\n\tcategories?: string[];\n\t_embedded?: {\n\t\tfont_faces?: CollectionFontFace[];\n\t};\n}\n\nexport interface FontFamily {\n\tname: string;\n\tslug: string;\n\tfontFamily: string;\n\tfontFace?: FontFace[];\n\tpreview?: string;\n\tid?: string;\n\tsource?: string;\n\tversion?: string;\n\tauthor?: string;\n\tlicense?: string;\n\tdescription?: string;\n\ttags?: string[];\n\tvariants?: FontFace[];\n\tcategory?: string;\n}\n\nexport interface FontCollection {\n\tid: string;\n\tslug: string;\n\tname: string;\n\tdescription?: string;\n\tfont_families?: CollectionFontFamily[];\n\tcategories?: {\n\t\tslug: string;\n\t\tname: string;\n\t}[];\n}\n\nexport interface FontLibraryState {\n\tisInstalling: boolean;\n\tfontFamilies: Record< string, FontFamilyPreset[] >;\n\tnotice?: {\n\t\ttype: 'success' | 'error' | 'info';\n\t\tmessage: string;\n\t};\n\tloadFontFaceAsset: ( fontFace: FontFace ) => Promise< void >;\n\tinstallFonts: ( fonts: FontFamily[] ) => Promise< void >;\n\tuninstallFontFamily: ( fontFamily: FontFamily ) => Promise< {\n\t\tdeleted: boolean;\n\t} >;\n\trefreshLibrary: () => void;\n\t// Additional properties found in the codebase\n\tbaseCustomFonts: FontFamily[];\n\tmodalTabOpen: string;\n\tsetModalTabOpen: ( tab: string ) => void;\n\thandleSetLibraryFontSelected: ( font?: FontFamily ) => void;\n\tlibraryFontSelected?: FontFamily;\n\tisFontActivated: (\n\t\tslug: string,\n\t\tstyle?: string,\n\t\tweight?: string | number,\n\t\tsource?: string\n\t) => boolean;\n\tgetFontFacesActivated: ( slug: string, source?: string ) => string[];\n\ttoggleActivateFont: ( font: FontFamily, face?: FontFace ) => void;\n\tgetAvailableFontsOutline: (\n\t\tavailableFontFamilies: FontFamily[]\n\t) => Record< string, string[] >;\n\tsaveFontFamilies: (\n\t\tfonts:\n\t\t\t| FontFamilyPreset[]\n\t\t\t| Record< string, FontFamilyPreset[] >\n\t\t\t| undefined\n\t) => Promise< void >;\n\tisResolvingLibrary: boolean;\n\tcollections: FontCollection[];\n\tgetFontCollection: ( slug: string ) => Promise< FontCollection | void >;\n}\n\nexport interface FontDemoProps {\n\tfont: FontFamily | FontFace;\n\ttext?: string;\n\tonClick?: () => void;\n}\n\nexport interface FontCardProps {\n\tfont: FontFamily;\n\tonClick?: () => void;\n\tvariantsText?: string;\n}\n\nexport interface FontVariantProps {\n\tfontFace: FontFace;\n\tfontFamily: FontFamily;\n\tisSelected?: boolean;\n\tonClick?: () => void;\n}\n\nexport interface CollectionFontVariantProps {\n\tface: FontFace;\n\tfont: FontFamily;\n\thandleToggleVariant: ( font: FontFamily, face?: FontFace ) => void;\n\tselected: boolean;\n}\n\nexport interface FontUploadResult {\n\tsuccesses: FontFace[];\n\terrors: Array< {\n\t\tdata: FormData;\n\t\tmessage: string;\n\t} >;\n}\n\nexport interface GoogleFontsAPIResponse {\n\titems: Array< {\n\t\tfamily: string;\n\t\tvariants: string[];\n\t\tsubsets: string[];\n\t\tversion: string;\n\t\tlastModified: string;\n\t\tfiles: Record< string, string >;\n\t\tcategory: string;\n\t\tkind: string;\n\t\tmenu: string;\n\t} >;\n}\n\nexport type FontWeight =\n\t| '100'\n\t| '200'\n\t| '300'\n\t| '400'\n\t| '500'\n\t| '600'\n\t| '700'\n\t| '800'\n\t| '900';\nexport type FontStyle = 'normal' | 'italic';\nexport type FontDisplay = 'auto' | 'block' | 'swap' | 'fallback' | 'optional';\nexport type FontStretch =\n\t| 'normal'\n\t| 'ultra-condensed'\n\t| 'extra-condensed'\n\t| 'condensed'\n\t| 'semi-condensed'\n\t| 'semi-expanded'\n\t| 'expanded'\n\t| 'extra-expanded'\n\t| 'ultra-expanded';\n"],
+  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;",
+  "names": []
+}

package/build/font-library-modal/upload-fonts.js

@@ -0,0 +1,207 @@
+"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 upload_fonts_exports = {};
+__export(upload_fonts_exports, {
+  default: () => upload_fonts_default
+});
+module.exports = __toCommonJS(upload_fonts_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_i18n = require("@wordpress/i18n");
+var import_components = require("@wordpress/components");
+var import_element = require("@wordpress/element");
+var import_constants = require("./utils/constants");
+var import_context = require("./context");
+var import_lib_font = require("./lib/lib-font.browser");
+var import_make_families_from_faces = __toESM(require("./utils/make-families-from-faces"));
+var import_utils = require("./utils");
+function UploadFonts() {
+  const { installFonts } = (0, import_element.useContext)(import_context.FontLibraryContext);
+  const [isUploading, setIsUploading] = (0, import_element.useState)(false);
+  const [notice, setNotice] = (0, import_element.useState)(null);
+  const handleDropZone = (files) => {
+    handleFilesUpload(files);
+  };
+  const onFilesUpload = (event) => {
+    handleFilesUpload(event.target.files);
+  };
+  const handleFilesUpload = async (files) => {
+    if (!files) {
+      return;
+    }
+    setNotice(null);
+    setIsUploading(true);
+    const uniqueFilenames = /* @__PURE__ */ new Set();
+    const selectedFiles = [...files];
+    let hasInvalidFiles = false;
+    const checkFilesPromises = selectedFiles.map(async (file) => {
+      const isFont = await isFontFile(file);
+      if (!isFont) {
+        hasInvalidFiles = true;
+        return null;
+      }
+      if (uniqueFilenames.has(file.name)) {
+        return null;
+      }
+      const fileExtension = (((file.name ?? "").split(".") ?? []).pop() ?? "").toLowerCase();
+      if (import_constants.ALLOWED_FILE_EXTENSIONS.includes(fileExtension)) {
+        uniqueFilenames.add(file.name);
+        return file;
+      }
+      return null;
+    });
+    const allowedFiles = (await Promise.all(checkFilesPromises)).filter((file) => null !== file);
+    if (allowedFiles.length > 0) {
+      loadFiles(allowedFiles);
+    } else {
+      const message = hasInvalidFiles ? (0, import_i18n.__)("Sorry, you are not allowed to upload this file type.") : (0, import_i18n.__)("No fonts found to install.");
+      setNotice({
+        type: "error",
+        message
+      });
+      setIsUploading(false);
+    }
+  };
+  const loadFiles = async (files) => {
+    const fontFacesLoaded = await Promise.all(
+      files.map(async (fontFile) => {
+        const fontFaceData = await getFontFaceMetadata(fontFile);
+        await (0, import_utils.loadFontFaceInBrowser)(
+          fontFaceData,
+          fontFaceData.file,
+          "all"
+        );
+        return fontFaceData;
+      })
+    );
+    handleInstall(fontFacesLoaded);
+  };
+  async function isFontFile(file) {
+    const font = new import_lib_font.Font("Uploaded Font");
+    try {
+      const buffer = await readFileAsArrayBuffer(file);
+      await font.fromDataBuffer(buffer, "font");
+      return true;
+    } catch (error) {
+      return false;
+    }
+  }
+  async function readFileAsArrayBuffer(file) {
+    return new Promise((resolve, reject) => {
+      const reader = new window.FileReader();
+      reader.readAsArrayBuffer(file);
+      reader.onload = () => resolve(reader.result);
+      reader.onerror = reject;
+    });
+  }
+  const getFontFaceMetadata = async (fontFile) => {
+    const buffer = await readFileAsArrayBuffer(fontFile);
+    const fontObj = new import_lib_font.Font("Uploaded Font");
+    fontObj.fromDataBuffer(buffer, fontFile.name);
+    const onloadEvent = await new Promise(
+      (resolve) => fontObj.onload = resolve
+    );
+    const font = onloadEvent.detail.font;
+    const { name } = font.opentype.tables;
+    const fontName = name.get(16) || name.get(1);
+    const isItalic = name.get(2).toLowerCase().includes("italic");
+    const fontWeight = font.opentype.tables["OS/2"].usWeightClass || "normal";
+    const isVariable = !!font.opentype.tables.fvar;
+    const weightAxis = isVariable && font.opentype.tables.fvar.axes.find(
+      ({ tag }) => tag === "wght"
+    );
+    const weightRange = weightAxis ? `${weightAxis.minValue} ${weightAxis.maxValue}` : null;
+    return {
+      file: fontFile,
+      fontFamily: fontName,
+      fontStyle: isItalic ? "italic" : "normal",
+      fontWeight: weightRange || fontWeight
+    };
+  };
+  const handleInstall = async (fontFaces) => {
+    const fontFamilies = (0, import_make_families_from_faces.default)(fontFaces);
+    try {
+      await installFonts(fontFamilies);
+      setNotice({
+        type: "success",
+        message: (0, import_i18n.__)("Fonts were installed successfully.")
+      });
+    } catch (error) {
+      const typedError = error;
+      setNotice({
+        type: "error",
+        message: typedError.message,
+        errors: typedError?.installationErrors
+      });
+    }
+    setIsUploading(false);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "font-library-modal__tabpanel-layout", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.DropZone, { onFilesDrop: handleDropZone }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.__experimentalVStack, { className: "font-library-modal__local-fonts", children: [
+      notice && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        import_components.Notice,
+        {
+          status: notice.type,
+          __unstableHTML: true,
+          onRemove: () => setNotice(null),
+          children: [
+            notice.message,
+            notice.errors && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { children: notice.errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: error }, index)) })
+          ]
+        }
+      ),
+      isUploading && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.FlexItem, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "font-library-modal__upload-area", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.ProgressBar, {}) }) }),
+      !isUploading && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_components.FormFileUpload,
+        {
+          accept: import_constants.ALLOWED_FILE_EXTENSIONS.map(
+            (ext) => `.${ext}`
+          ).join(","),
+          multiple: true,
+          onChange: onFilesUpload,
+          render: ({ openFileDialog }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_components.Button,
+            {
+              __next40pxDefaultSize: true,
+              className: "font-library-modal__upload-area",
+              onClick: openFileDialog,
+              children: (0, import_i18n.__)("Upload font")
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalSpacer, { margin: 2 }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalText, { className: "font-library-modal__upload-area__text", children: (0, import_i18n.__)(
+        "Uploaded fonts appear in your library and can be used in your theme. Supported formats: .ttf, .otf, .woff, and .woff2."
+      ) })
+    ] })
+  ] });
+}
+var upload_fonts_default = UploadFonts;
+//# sourceMappingURL=upload-fonts.js.map

package/build/font-library-modal/upload-fonts.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/font-library-modal/upload-fonts.tsx"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalText as Text,\n\t__experimentalVStack as VStack,\n\tButton,\n\tDropZone,\n\tNotice,\n\tFormFileUpload,\n\tFlexItem,\n\tProgressBar,\n} from '@wordpress/components';\nimport { useContext, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ALLOWED_FILE_EXTENSIONS } from './utils/constants';\nimport { FontLibraryContext } from './context';\nimport { Font } from './lib/lib-font.browser';\nimport makeFamiliesFromFaces from './utils/make-families-from-faces';\nimport { loadFontFaceInBrowser } from './utils';\nimport type { FontFace } from './types';\n\nfunction UploadFonts() {\n\tconst { installFonts } = useContext( FontLibraryContext );\n\tconst [ isUploading, setIsUploading ] = useState( false );\n\tconst [ notice, setNotice ] = useState< {\n\t\ttype: 'success' | 'error';\n\t\tmessage: string;\n\t\terrors?: string[];\n\t} | null >( null );\n\n\tconst handleDropZone = ( files: File[] ) => {\n\t\thandleFilesUpload( files );\n\t};\n\tconst onFilesUpload = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\thandleFilesUpload( event.target.files );\n\t};\n\n\t/**\n\t * Filters the selected files to only allow the ones with the allowed extensions\n\t *\n\t * @param {Array} files The files to be filtered\n\t * @return {void}\n\t */\n\tconst handleFilesUpload = async ( files: FileList | File[] | null ) => {\n\t\tif ( ! files ) {\n\t\t\treturn;\n\t\t}\n\t\tsetNotice( null );\n\t\tsetIsUploading( true );\n\t\tconst uniqueFilenames = new Set();\n\t\tconst selectedFiles = [ ...files ];\n\t\tlet hasInvalidFiles = false;\n\n\t\t// Use map to create a promise for each file check, then filter with Promise.all.\n\t\tconst checkFilesPromises = selectedFiles.map( async ( file ) => {\n\t\t\tconst isFont = await isFontFile( file );\n\t\t\tif ( ! isFont ) {\n\t\t\t\thasInvalidFiles = true;\n\t\t\t\treturn null; // Return null for invalid files.\n\t\t\t}\n\t\t\t// Check for duplicates\n\t\t\tif ( uniqueFilenames.has( file.name ) ) {\n\t\t\t\treturn null; // Return null for duplicates.\n\t\t\t}\n\t\t\t// Check if the file extension is allowed.\n\t\t\tconst fileExtension = (\n\t\t\t\t( ( file.name ?? '' ).split( '.' ) ?? [] ).pop() ?? ''\n\t\t\t).toLowerCase();\n\t\t\tif ( ALLOWED_FILE_EXTENSIONS.includes( fileExtension ) ) {\n\t\t\t\tuniqueFilenames.add( file.name );\n\t\t\t\treturn file; // Return the file if it passes all checks.\n\t\t\t}\n\t\t\treturn null; // Return null for disallowed file extensions.\n\t\t} );\n\n\t\t// Filter out the nulls after all promises have resolved.\n\t\tconst allowedFiles: File[] = (\n\t\t\tawait Promise.all( checkFilesPromises )\n\t\t).filter( ( file ) => null !== file );\n\n\t\tif ( allowedFiles.length > 0 ) {\n\t\t\tloadFiles( allowedFiles );\n\t\t} else {\n\t\t\tconst message = hasInvalidFiles\n\t\t\t\t? __( 'Sorry, you are not allowed to upload this file type.' )\n\t\t\t\t: __( 'No fonts found to install.' );\n\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'error',\n\t\t\t\tmessage,\n\t\t\t} );\n\t\t\tsetIsUploading( false );\n\t\t}\n\t};\n\n\t/**\n\t * Loads the selected files and reads the font metadata\n\t *\n\t * @param {Array} files The files to be loaded\n\t * @return {void}\n\t */\n\tconst loadFiles = async ( files: File[] ) => {\n\t\tconst fontFacesLoaded = await Promise.all(\n\t\t\tfiles.map( async ( fontFile: File ) => {\n\t\t\t\tconst fontFaceData = await getFontFaceMetadata( fontFile );\n\t\t\t\tawait loadFontFaceInBrowser(\n\t\t\t\t\tfontFaceData,\n\t\t\t\t\tfontFaceData.file,\n\t\t\t\t\t'all'\n\t\t\t\t);\n\t\t\t\treturn fontFaceData;\n\t\t\t} )\n\t\t);\n\t\thandleInstall( fontFacesLoaded );\n\t};\n\n\t/**\n\t * Checks if a file is a valid Font file.\n\t *\n\t * @param {File} file The file to be checked.\n\t * @return {boolean} Whether the file is a valid font file.\n\t */\n\tasync function isFontFile( file: File ) {\n\t\tconst font = new Font( 'Uploaded Font' );\n\t\ttry {\n\t\t\tconst buffer = await readFileAsArrayBuffer( file );\n\t\t\tawait font.fromDataBuffer( buffer, 'font' );\n\t\t\treturn true;\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\t\t} catch ( error ) {\n\t\t\treturn false;\n\t\t}\n\t}\n\n\t// Create a function to read the file as array buffer\n\tasync function readFileAsArrayBuffer( file: File ) {\n\t\treturn new Promise( ( resolve, reject ) => {\n\t\t\tconst reader = new window.FileReader();\n\t\t\treader.readAsArrayBuffer( file );\n\t\t\treader.onload = () => resolve( reader.result );\n\t\t\treader.onerror = reject;\n\t\t} );\n\t}\n\n\tconst getFontFaceMetadata = async ( fontFile: File ) => {\n\t\tconst buffer = await readFileAsArrayBuffer( fontFile );\n\t\tconst fontObj: Font & {\n\t\t\tonload?: ( val: { detail: { font: any } } ) => void;\n\t\t} = new Font( 'Uploaded Font' );\n\t\tfontObj.fromDataBuffer( buffer, fontFile.name );\n\t\t// Assuming that fromDataBuffer triggers onload event and returning a Promise\n\t\tconst onloadEvent: { detail: { font: any } } = await new Promise(\n\t\t\t( resolve ) => ( fontObj.onload = resolve )\n\t\t);\n\t\tconst font = onloadEvent.detail.font;\n\t\tconst { name } = font.opentype.tables;\n\t\tconst fontName = name.get( 16 ) || name.get( 1 );\n\t\tconst isItalic = name.get( 2 ).toLowerCase().includes( 'italic' );\n\t\tconst fontWeight =\n\t\t\tfont.opentype.tables[ 'OS/2' ].usWeightClass || 'normal';\n\t\tconst isVariable = !! font.opentype.tables.fvar;\n\t\tconst weightAxis =\n\t\t\tisVariable &&\n\t\t\tfont.opentype.tables.fvar.axes.find(\n\t\t\t\t( { tag }: { tag: string } ) => tag === 'wght'\n\t\t\t);\n\t\tconst weightRange = weightAxis\n\t\t\t? `${ weightAxis.minValue } ${ weightAxis.maxValue }`\n\t\t\t: null;\n\t\treturn {\n\t\t\tfile: fontFile,\n\t\t\tfontFamily: fontName,\n\t\t\tfontStyle: isItalic ? 'italic' : 'normal',\n\t\t\tfontWeight: weightRange || fontWeight,\n\t\t};\n\t};\n\n\t/**\n\t * Creates the font family definition and sends it to the server\n\t *\n\t * @param {Array} fontFaces The font faces to be installed\n\t * @return {void}\n\t */\n\tconst handleInstall = async ( fontFaces: FontFace[] ) => {\n\t\tconst fontFamilies = makeFamiliesFromFaces( fontFaces );\n\n\t\ttry {\n\t\t\tawait installFonts( fontFamilies );\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'success',\n\t\t\t\tmessage: __( 'Fonts were installed successfully.' ),\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tconst typedError = error as Error & {\n\t\t\t\tinstallationErrors?: string[];\n\t\t\t};\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'error',\n\t\t\t\tmessage: typedError.message,\n\t\t\t\terrors: typedError?.installationErrors,\n\t\t\t} );\n\t\t}\n\n\t\tsetIsUploading( false );\n\t};\n\n\treturn (\n\t\t<div className=\"font-library-modal__tabpanel-layout\">\n\t\t\t<DropZone onFilesDrop={ handleDropZone } />\n\t\t\t<VStack className=\"font-library-modal__local-fonts\">\n\t\t\t\t{ notice && (\n\t\t\t\t\t<Notice\n\t\t\t\t\t\tstatus={ notice.type }\n\t\t\t\t\t\t__unstableHTML\n\t\t\t\t\t\tonRemove={ () => setNotice( null ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ notice.message }\n\t\t\t\t\t\t{ notice.errors && (\n\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t{ notice.errors.map( ( error, index ) => (\n\t\t\t\t\t\t\t\t\t<li key={ index }>{ error }</li>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Notice>\n\t\t\t\t) }\n\t\t\t\t{ isUploading && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<div className=\"font-library-modal__upload-area\">\n\t\t\t\t\t\t\t<ProgressBar />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t\t{ ! isUploading && (\n\t\t\t\t\t<FormFileUpload\n\t\t\t\t\t\taccept={ ALLOWED_FILE_EXTENSIONS.map(\n\t\t\t\t\t\t\t( ext ) => `.${ ext }`\n\t\t\t\t\t\t).join( ',' ) }\n\t\t\t\t\t\tmultiple\n\t\t\t\t\t\tonChange={ onFilesUpload }\n\t\t\t\t\t\trender={ ( { openFileDialog } ) => (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tclassName=\"font-library-modal__upload-area\"\n\t\t\t\t\t\t\t\tonClick={ openFileDialog }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Upload font' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<Spacer margin={ 2 } />\n\t\t\t\t<Text className=\"font-library-modal__upload-area__text\">\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Uploaded fonts appear in your library and can be used in your theme. Supported formats: .ttf, .otf, .woff, and .woff2.'\n\t\t\t\t\t) }\n\t\t\t\t</Text>\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n\nexport default UploadFonts;\n"],
+  "mappings": "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",
+  "names": ["makeFamiliesFromFaces", "VStack", "Spacer", "Text"]
+}

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

@@ -0,0 +1,49 @@
+"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 constants_exports = {};
+__export(constants_exports, {
+  ALLOWED_FILE_EXTENSIONS: () => ALLOWED_FILE_EXTENSIONS,
+  FONT_STYLES: () => FONT_STYLES,
+  FONT_WEIGHTS: () => FONT_WEIGHTS
+});
+module.exports = __toCommonJS(constants_exports);
+var import_i18n = require("@wordpress/i18n");
+const ALLOWED_FILE_EXTENSIONS = ["otf", "ttf", "woff", "woff2"];
+const FONT_WEIGHTS = {
+  100: (0, import_i18n._x)("Thin", "font weight"),
+  200: (0, import_i18n._x)("Extra-light", "font weight"),
+  300: (0, import_i18n._x)("Light", "font weight"),
+  400: (0, import_i18n._x)("Normal", "font weight"),
+  500: (0, import_i18n._x)("Medium", "font weight"),
+  600: (0, import_i18n._x)("Semi-bold", "font weight"),
+  700: (0, import_i18n._x)("Bold", "font weight"),
+  800: (0, import_i18n._x)("Extra-bold", "font weight"),
+  900: (0, import_i18n._x)("Black", "font weight")
+};
+const FONT_STYLES = {
+  normal: (0, import_i18n._x)("Normal", "font style"),
+  italic: (0, import_i18n._x)("Italic", "font style")
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ALLOWED_FILE_EXTENSIONS,
+  FONT_STYLES,
+  FONT_WEIGHTS
+});
+//# sourceMappingURL=constants.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/font-library-modal/utils/constants.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { _x } from '@wordpress/i18n';\n\nexport const ALLOWED_FILE_EXTENSIONS = [ 'otf', 'ttf', 'woff', 'woff2' ];\n\nexport const FONT_WEIGHTS: Record< string, string > = {\n\t100: _x( 'Thin', 'font weight' ),\n\t200: _x( 'Extra-light', 'font weight' ),\n\t300: _x( 'Light', 'font weight' ),\n\t400: _x( 'Normal', 'font weight' ),\n\t500: _x( 'Medium', 'font weight' ),\n\t600: _x( 'Semi-bold', 'font weight' ),\n\t700: _x( 'Bold', 'font weight' ),\n\t800: _x( 'Extra-bold', 'font weight' ),\n\t900: _x( 'Black', 'font weight' ),\n};\n\nexport const FONT_STYLES: Record< string, string > = {\n\tnormal: _x( 'Normal', 'font style' ),\n\titalic: _x( 'Italic', 'font style' ),\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAmB;AAEZ,MAAM,0BAA0B,CAAE,OAAO,OAAO,QAAQ,OAAQ;AAEhE,MAAM,eAAyC;AAAA,EACrD,SAAK,gBAAI,QAAQ,aAAc;AAAA,EAC/B,SAAK,gBAAI,eAAe,aAAc;AAAA,EACtC,SAAK,gBAAI,SAAS,aAAc;AAAA,EAChC,SAAK,gBAAI,UAAU,aAAc;AAAA,EACjC,SAAK,gBAAI,UAAU,aAAc;AAAA,EACjC,SAAK,gBAAI,aAAa,aAAc;AAAA,EACpC,SAAK,gBAAI,QAAQ,aAAc;AAAA,EAC/B,SAAK,gBAAI,cAAc,aAAc;AAAA,EACrC,SAAK,gBAAI,SAAS,aAAc;AACjC;AAEO,MAAM,cAAwC;AAAA,EACpD,YAAQ,gBAAI,UAAU,YAAa;AAAA,EACnC,YAAQ,gBAAI,UAAU,YAAa;AACpC;",
+  "names": []
+}