npm - @liiift-studio/sanity-font-manager - Versions diffs - 2.3.2 → 2.3.3 - Mend

@liiift-studio/sanity-font-manager 2.3.2 → 2.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/README.md +33 -0
package/dist/index.js +78 -0
package/dist/index.mjs +168 -92
package/package.json +1 -1
package/src/components/SetOTF.jsx +87 -0
package/src/components/StyleCountInput.jsx +16 -0
package/src/index.js +2 -0

package/README.md CHANGED Viewed

@@ -110,6 +110,39 @@ Updates and re-links existing script font variant references on font documents
 Recalculates and patches the `subfamily` field on all fonts linked to a typeface, based on the typeface's defined subfamily groups — without re-uploading any files.
+### `SetOTF`
+Detects which configured OpenType feature keys are supported by the typeface's first linked font. Reads `opentypeFeatures.chars` from the font document (populated by `generateFontData`) and patches the `features` array on the field. Shows a feature count when features are detected, and clear error messages when font data is missing.
+Wire it up on the `openType` object field in the typeface schema:
+```jsx
+import { SetOTF } from '@liiift-studio/sanity-font-manager';
+{
+  name: 'openType',
+  type: 'object',
+  components: { input: SetOTF },
+  options: { collapsible: true },
+  fields: [ /* feature fields — each with a `feature` string e.g. 'liga', 'smcp' */ ],
+}
+```
+### `StyleCountInput`
+Displays the total number of font styles (static + variable) linked to a typeface. Reads `styles.fonts` and `styles.variableFont` arrays from the form context. Useful as a read-only display field in the typeface schema.
+```jsx
+import { StyleCountInput } from '@liiift-studio/sanity-font-manager';
+{
+  name: 'styleCount',
+  type: 'number',
+  readOnly: true,
+  components: { input: StyleCountInput },
+}
+```
 ### `KeyValueInput`
 Generic ordered key-value editor where both keys and values are plain strings. Supports add, remove, and reorder (up/down arrows). Values are stored as an array of `{ key, value }` objects.

package/dist/index.js CHANGED Viewed

@@ -40,8 +40,10 @@ __export(index_exports, {
   RegenerateSubfamiliesComponent: () => RegenerateSubfamiliesComponent,
   SCRIPTS: () => SCRIPTS,
   SCRIPTS_OBJECT: () => SCRIPTS_OBJECT,
+  SetOTF: () => SetOTF,
   SingleUploaderTool: () => SingleUploaderTool,
   StatusDisplay: () => StatusDisplay_default,
+  StyleCountInput: () => StyleCountInput,
   UpdateScriptsComponent: () => UpdateScriptsComponent,
   UploadButton: () => UploadButton_default,
   UploadScriptsComponent: () => UploadScriptsComponent,
@@ -4041,6 +4043,80 @@ var PrimaryCollectionGeneratorTypeface = () => {
   )) : /* @__PURE__ */ import_react16.default.createElement(import_ui14.Flex, { align: "center", justify: "center", gap: 3, padding: 4 }, /* @__PURE__ */ import_react16.default.createElement(import_ui14.Spinner, null), /* @__PURE__ */ import_react16.default.createElement(import_ui14.Text, { muted: true, size: 1 }, status))));
 };
+// src/components/SetOTF.jsx
+var import_react17 = require("react");
+var import_sanity13 = require("sanity");
+var import_ui15 = require("@sanity/ui");
+var SetOTF = (props) => {
+  var _a, _b;
+  const { onChange, value = {} } = props;
+  const client = useSanityClient();
+  const stylesObject = (0, import_sanity13.useFormValue)(["styles"]);
+  const [message, setMessage] = (0, import_react17.useState)("");
+  const detect = async () => {
+    var _a2, _b2, _c;
+    if (!((_a2 = stylesObject == null ? void 0 : stylesObject.fonts) == null ? void 0 : _a2.length)) {
+      setMessage("Error: No fonts found in styles. Please add at least one font first.");
+      setTimeout(() => setMessage(""), 5e3);
+      return;
+    }
+    const fontRef = (_b2 = stylesObject.fonts[0]) == null ? void 0 : _b2._ref;
+    if (!fontRef) {
+      setMessage("Error: Invalid font reference in styles.");
+      setTimeout(() => setMessage(""), 5e3);
+      return;
+    }
+    try {
+      const font = await client.fetch('*[_type == "font" && _id == $id][0]', { id: fontRef });
+      if (!font) {
+        setMessage("Error: Could not find the referenced font.");
+        setTimeout(() => setMessage(""), 5e3);
+        return;
+      }
+      if (!((_c = font.opentypeFeatures) == null ? void 0 : _c.chars)) {
+        setMessage(`Error: No OpenType feature data found in "${font.title || "this font"}". Generate font data first.`);
+        setTimeout(() => setMessage(""), 5e3);
+        return;
+      }
+      const features = [];
+      Object.keys(value).forEach((key) => {
+        var _a3;
+        if (key !== "features" && ((_a3 = value[key]) == null ? void 0 : _a3.feature)) {
+          const requiredFeatures = value[key].feature.split(" ");
+          const approved = requiredFeatures.every((v) => font.opentypeFeatures.chars.includes(v));
+          if (approved) features.push(key);
+        }
+      });
+      onChange((0, import_sanity13.set)({ ...value, features }));
+      setMessage(`Features detected: ${features.length ? features.join(", ") : "none"}.`);
+      setTimeout(() => setMessage(""), 5e3);
+    } catch (err) {
+      setMessage("Error detecting features. Check the console for details.");
+      console.error("SetOTF detect error:", err);
+    }
+  };
+  return /* @__PURE__ */ React.createElement(import_ui15.Stack, { className: "openType" }, ((_a = value == null ? void 0 : value.features) == null ? void 0 : _a.length) > 0 && /* @__PURE__ */ React.createElement(import_ui15.Text, { muted: true, size: 1, style: { marginBottom: "0.5rem" } }, "Number of features: ", value.features.length), !!((_b = stylesObject == null ? void 0 : stylesObject.fonts) == null ? void 0 : _b.length) && /* @__PURE__ */ React.createElement(
+    import_ui15.Button,
+    {
+      text: "Detect OTF",
+      mode: "ghost",
+      onClick: detect,
+      style: { borderRadius: "0 3px 0 0", marginBottom: "1rem" }
+    }
+  ), !!message && /* @__PURE__ */ React.createElement(import_ui15.Text, { muted: true, size: 1 }, /* @__PURE__ */ React.createElement("br", null), message, /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("br", null)), props.renderDefault(props));
+};
+// src/components/StyleCountInput.jsx
+var import_react18 = __toESM(require("react"));
+var import_ui16 = require("@sanity/ui");
+var import_sanity14 = require("sanity");
+var StyleCountInput = (props) => {
+  const styles = (0, import_sanity14.useFormValue)(["styles", "fonts"]) || [];
+  const vfStyles = (0, import_sanity14.useFormValue)(["styles", "variableFont"]) || [];
+  const count = styles.length + vfStyles.length;
+  return /* @__PURE__ */ import_react18.default.createElement(import_ui16.Text, { size: 1 }, count);
+};
 // src/utils/getEmptyFontKit.js
 var fontkit7 = __toESM(require("fontkit"));
 var import_slugify4 = __toESM(require("slugify"));
@@ -4131,8 +4207,10 @@ var readFontFile2 = (file) => {
   RegenerateSubfamiliesComponent,
   SCRIPTS,
   SCRIPTS_OBJECT,
+  SetOTF,
   SingleUploaderTool,
   StatusDisplay,
+  StyleCountInput,
   UpdateScriptsComponent,
   UploadButton,
   UploadScriptsComponent,

package/dist/index.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 // src/components/BatchUploadFonts.jsx
-import React4, { useCallback, useState as useState2, useMemo as useMemo2, useRef, useEffect } from "react";
+import React5, { useCallback, useState as useState2, useMemo as useMemo2, useRef, useEffect } from "react";
 import { Card, Box as Box2, Flex as Flex3, Grid, Text as Text4, Label, Switch, Button as Button2, Spinner, Tooltip, Stack as Stack2 } from "@sanity/ui";
 import { ControlsIcon, InfoOutlineIcon, TrashIcon, UploadIcon, WarningOutlineIcon } from "@sanity/icons";
 import { useFormValue as useFormValue2 } from "sanity";
@@ -1378,17 +1378,17 @@ var updateFontPrices = async ({
 };
 // src/components/StatusDisplay.jsx
-import React from "react";
+import React2 from "react";
 import { Flex, Text } from "@sanity/ui";
 var StatusDisplay = ({ status, error, action }) => {
-  return /* @__PURE__ */ React.createElement(Flex, { paddingTop: 1, paddingBottom: 3, align: "center", justify: "space-between" }, /* @__PURE__ */ React.createElement(Flex, { align: "center", gap: 2 }, /* @__PURE__ */ React.createElement(Text, { size: 1 }, "Status:"), /* @__PURE__ */ React.createElement(Text, { size: 1, style: { color: error ? "red" : "green" } }, status)), action && action);
+  return /* @__PURE__ */ React2.createElement(Flex, { paddingTop: 1, paddingBottom: 3, align: "center", justify: "space-between" }, /* @__PURE__ */ React2.createElement(Flex, { align: "center", gap: 2 }, /* @__PURE__ */ React2.createElement(Text, { size: 1 }, "Status:"), /* @__PURE__ */ React2.createElement(Text, { size: 1, style: { color: error ? "red" : "green" } }, status)), action && action);
 };
 var StatusDisplay_default = StatusDisplay;
 // src/components/PriceInput.jsx
-import React2 from "react";
+import React3 from "react";
 import { Flex as Flex2, Text as Text2 } from "@sanity/ui";
-var PriceInput = ({ inputPrice, handleInputChange }) => /* @__PURE__ */ React2.createElement(Flex2, { align: "center", gap: 2 }, /* @__PURE__ */ React2.createElement(Text2, { size: 1, muted: true }, "Price:"), /* @__PURE__ */ React2.createElement(Text2, { size: 1, muted: true }, "$"), /* @__PURE__ */ React2.createElement(
+var PriceInput = ({ inputPrice, handleInputChange }) => /* @__PURE__ */ React3.createElement(Flex2, { align: "center", gap: 2 }, /* @__PURE__ */ React3.createElement(Text2, { size: 1, muted: true }, "Price:"), /* @__PURE__ */ React3.createElement(Text2, { size: 1, muted: true }, "$"), /* @__PURE__ */ React3.createElement(
   "input",
   {
     value: inputPrice,
@@ -1396,11 +1396,11 @@ var PriceInput = ({ inputPrice, handleInputChange }) => /* @__PURE__ */ React2.c
     type: "number",
     style: { textAlign: "end", padding: "5px", maxWidth: "75px" }
   }
-), /* @__PURE__ */ React2.createElement(Text2, { size: 1, muted: true }, "per style"));
+), /* @__PURE__ */ React3.createElement(Text2, { size: 1, muted: true }, "per style"));
 var PriceInput_default = PriceInput;
 // src/components/RegenerateSubfamiliesComponent.jsx
-import React3, { useState } from "react";
+import React4, { useState } from "react";
 import { nanoid as nanoid5 } from "nanoid";
 import { Button, Text as Text3, Stack, Box } from "@sanity/ui";
 import { useFormValue } from "sanity";
@@ -1416,7 +1416,7 @@ var RegenerateSubfamiliesComponent = () => {
   const handleClick = () => {
     regenerateSubfamilies({ title, stylesObject, slug, doc_id, client, setStatus, setReady, setError });
   };
-  return /* @__PURE__ */ React3.createElement(React3.Fragment, null, status && /* @__PURE__ */ React3.createElement(Box, { padding: 3, style: { borderRadius: "4px", marginBottom: "10px" } }, /* @__PURE__ */ React3.createElement(Text3, { size: 1, style: { color: error ? "red" : "green" } }, status)), /* @__PURE__ */ React3.createElement(Button, { mode: "ghost", tone: "primary", width: "fill", padding: 3, onClick: handleClick, disabled: !ready }, /* @__PURE__ */ React3.createElement(Stack, { space: 2 }, /* @__PURE__ */ React3.createElement(Text3, { align: "center" }, "Regenerate Subfamilies"))));
+  return /* @__PURE__ */ React4.createElement(React4.Fragment, null, status && /* @__PURE__ */ React4.createElement(Box, { padding: 3, style: { borderRadius: "4px", marginBottom: "10px" } }, /* @__PURE__ */ React4.createElement(Text3, { size: 1, style: { color: error ? "red" : "green" } }, status)), /* @__PURE__ */ React4.createElement(Button, { mode: "ghost", tone: "primary", width: "fill", padding: 3, onClick: handleClick, disabled: !ready }, /* @__PURE__ */ React4.createElement(Stack, { space: 2 }, /* @__PURE__ */ React4.createElement(Text3, { align: "center" }, "Regenerate Subfamilies"))));
 };
 var regenerateSubfamilies = async ({ title, stylesObject, slug, doc_id, client, setStatus, setReady, setError }) => {
   try {
@@ -1818,17 +1818,17 @@ var BatchUploadFonts = () => {
     setError(false);
     setStatus("ready");
   };
-  const renderTooltipLabel = (label, description) => /* @__PURE__ */ React4.createElement(
+  const renderTooltipLabel = (label, description) => /* @__PURE__ */ React5.createElement(
     Tooltip,
     {
-      content: /* @__PURE__ */ React4.createElement(Box2, { padding: 2, style: { maxWidth: 260 } }, /* @__PURE__ */ React4.createElement(Text4, { size: 1, style: { lineHeight: 1.6 } }, description)),
+      content: /* @__PURE__ */ React5.createElement(Box2, { padding: 2, style: { maxWidth: 260 } }, /* @__PURE__ */ React5.createElement(Text4, { size: 1, style: { lineHeight: 1.6 } }, description)),
       placement: "top",
       portal: true
     },
-    /* @__PURE__ */ React4.createElement(Flex3, { align: "center", gap: 1, style: { cursor: "default" } }, /* @__PURE__ */ React4.createElement(Label, null, label), /* @__PURE__ */ React4.createElement(InfoOutlineIcon, { style: { opacity: 0.5, display: "block" } }))
+    /* @__PURE__ */ React5.createElement(Flex3, { align: "center", gap: 1, style: { cursor: "default" } }, /* @__PURE__ */ React5.createElement(Label, null, label), /* @__PURE__ */ React5.createElement(InfoOutlineIcon, { style: { opacity: 0.5, display: "block" } }))
   );
-  const renderProcessing = () => /* @__PURE__ */ React4.createElement(Stack2, { space: 3, paddingY: 2 }, /* @__PURE__ */ React4.createElement(Flex3, { align: "center", gap: 3 }, /* @__PURE__ */ React4.createElement(Spinner, null), /* @__PURE__ */ React4.createElement(Text4, { size: 1, muted: true }, status)), /* @__PURE__ */ React4.createElement(Card, { tone: "caution", border: true, radius: 2, padding: 2 }, /* @__PURE__ */ React4.createElement(Flex3, { align: "center", justify: "space-between", gap: 2 }, /* @__PURE__ */ React4.createElement(Flex3, { align: "center", gap: 2 }, /* @__PURE__ */ React4.createElement(WarningOutlineIcon, { style: { flexShrink: 0 } }), /* @__PURE__ */ React4.createElement(Text4, { size: 1, weight: "semibold" }, "Do not close or reload this tab")), /* @__PURE__ */ React4.createElement(Text4, { size: 1, muted: true, style: { flexShrink: 0 } }, formatElapsed(elapsedSeconds)))));
-  const renderDropZone = () => /* @__PURE__ */ React4.createElement(
+  const renderProcessing = () => /* @__PURE__ */ React5.createElement(Stack2, { space: 3, paddingY: 2 }, /* @__PURE__ */ React5.createElement(Flex3, { align: "center", gap: 3 }, /* @__PURE__ */ React5.createElement(Spinner, null), /* @__PURE__ */ React5.createElement(Text4, { size: 1, muted: true }, status)), /* @__PURE__ */ React5.createElement(Card, { tone: "caution", border: true, radius: 2, padding: 2 }, /* @__PURE__ */ React5.createElement(Flex3, { align: "center", justify: "space-between", gap: 2 }, /* @__PURE__ */ React5.createElement(Flex3, { align: "center", gap: 2 }, /* @__PURE__ */ React5.createElement(WarningOutlineIcon, { style: { flexShrink: 0 } }), /* @__PURE__ */ React5.createElement(Text4, { size: 1, weight: "semibold" }, "Do not close or reload this tab")), /* @__PURE__ */ React5.createElement(Text4, { size: 1, muted: true, style: { flexShrink: 0 } }, formatElapsed(elapsedSeconds)))));
+  const renderDropZone = () => /* @__PURE__ */ React5.createElement(
     Box2,
     {
       onDragEnter: handleDragEnter,
@@ -1845,7 +1845,7 @@ var BatchUploadFonts = () => {
         cursor: "default"
       }
     },
-    /* @__PURE__ */ React4.createElement(
+    /* @__PURE__ */ React5.createElement(
       "input",
       {
         ref: fileInputRef,
@@ -1856,7 +1856,7 @@ var BatchUploadFonts = () => {
         onChange: handleFileSelect
       }
     ),
-    /* @__PURE__ */ React4.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React4.createElement(Text4, { size: 1, muted: true }, isDragging ? "Release to add files" : "Drop font files here"), /* @__PURE__ */ React4.createElement(Flex3, { justify: "center" }, /* @__PURE__ */ React4.createElement(
+    /* @__PURE__ */ React5.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React5.createElement(Text4, { size: 1, muted: true }, isDragging ? "Release to add files" : "Drop font files here"), /* @__PURE__ */ React5.createElement(Flex3, { justify: "center" }, /* @__PURE__ */ React5.createElement(
       Button2,
       {
         mode: "ghost",
@@ -1873,7 +1873,7 @@ var BatchUploadFonts = () => {
   );
   const renderFileList = () => {
     const sorted = sortFilesByType(pendingFiles);
-    return /* @__PURE__ */ React4.createElement(Stack2, { space: 2 }, /* @__PURE__ */ React4.createElement(Flex3, { align: "center", justify: "space-between" }, /* @__PURE__ */ React4.createElement(Text4, { size: 1, muted: true }, pendingFiles.length, " file", pendingFiles.length === 1 ? "" : "s", " selected"), /* @__PURE__ */ React4.createElement(
+    return /* @__PURE__ */ React5.createElement(Stack2, { space: 2 }, /* @__PURE__ */ React5.createElement(Flex3, { align: "center", justify: "space-between" }, /* @__PURE__ */ React5.createElement(Text4, { size: 1, muted: true }, pendingFiles.length, " file", pendingFiles.length === 1 ? "" : "s", " selected"), /* @__PURE__ */ React5.createElement(
       Button2,
       {
         mode: "bleed",
@@ -1883,16 +1883,16 @@ var BatchUploadFonts = () => {
         text: "Clear all",
         onClick: () => setPendingFiles([])
       }
-    )), /* @__PURE__ */ React4.createElement(Box2, { style: { maxHeight: "260px", overflowY: "auto", display: "flex", flexDirection: "column", gap: "4px" } }, sorted.map((file, i) => {
+    )), /* @__PURE__ */ React5.createElement(Box2, { style: { maxHeight: "260px", overflowY: "auto", display: "flex", flexDirection: "column", gap: "4px" } }, sorted.map((file, i) => {
       const ext = file.name.split(".").pop().toUpperCase();
-      return /* @__PURE__ */ React4.createElement(Card, { key: `${file.name}-${file.size}-${i}`, border: true, radius: 1, paddingX: 2, paddingY: 2 }, /* @__PURE__ */ React4.createElement(Flex3, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React4.createElement(Flex3, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React4.createElement(
+      return /* @__PURE__ */ React5.createElement(Card, { key: `${file.name}-${file.size}-${i}`, border: true, radius: 1, paddingX: 2, paddingY: 2 }, /* @__PURE__ */ React5.createElement(Flex3, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React5.createElement(Flex3, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React5.createElement(
         Text4,
         {
           size: 0,
           style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0 }
         },
         ext
-      ), /* @__PURE__ */ React4.createElement(Box2, { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, /* @__PURE__ */ React4.createElement(Text4, { size: 1 }, file.name))), /* @__PURE__ */ React4.createElement(
+      ), /* @__PURE__ */ React5.createElement(Box2, { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, /* @__PURE__ */ React5.createElement(Text4, { size: 1 }, file.name))), /* @__PURE__ */ React5.createElement(
         Button2,
         {
           mode: "bleed",
@@ -1902,7 +1902,7 @@ var BatchUploadFonts = () => {
           onClick: () => handleRemoveFile(file)
         }
       )));
-    })), /* @__PURE__ */ React4.createElement(
+    })), /* @__PURE__ */ React5.createElement(
       Box2,
       {
         onDragEnter: handleDragEnter,
@@ -1918,7 +1918,7 @@ var BatchUploadFonts = () => {
           transition: "border-color 0.12s, background 0.12s"
         }
       },
-      /* @__PURE__ */ React4.createElement(
+      /* @__PURE__ */ React5.createElement(
         "input",
         {
           ref: fileInputRef,
@@ -1929,7 +1929,7 @@ var BatchUploadFonts = () => {
           onChange: handleFileSelect
         }
       ),
-      /* @__PURE__ */ React4.createElement(Flex3, { align: "center", justify: "center", gap: 2 }, /* @__PURE__ */ React4.createElement(Text4, { size: 1, muted: true }, isDragging ? "Release to add" : "Drop more files or"), /* @__PURE__ */ React4.createElement(
+      /* @__PURE__ */ React5.createElement(Flex3, { align: "center", justify: "center", gap: 2 }, /* @__PURE__ */ React5.createElement(Text4, { size: 1, muted: true }, isDragging ? "Release to add" : "Drop more files or"), /* @__PURE__ */ React5.createElement(
         Button2,
         {
           mode: "bleed",
@@ -1943,7 +1943,7 @@ var BatchUploadFonts = () => {
           }
         }
       ))
-    ), /* @__PURE__ */ React4.createElement(
+    ), /* @__PURE__ */ React5.createElement(
       Button2,
       {
         mode: "ghost",
@@ -1955,12 +1955,12 @@ var BatchUploadFonts = () => {
       }
     ));
   };
-  return /* @__PURE__ */ React4.createElement(React4.Fragment, null, title && title !== "" && slug && slug !== "" && /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
+  return /* @__PURE__ */ React5.createElement(React5.Fragment, null, title && title !== "" && slug && slug !== "" && /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(
     StatusDisplay_default,
     {
       status,
       error,
-      action: /* @__PURE__ */ React4.createElement(
+      action: /* @__PURE__ */ React5.createElement(
         Button2,
         {
           mode: showUtilities ? "default" : "ghost",
@@ -1973,7 +1973,7 @@ var BatchUploadFonts = () => {
         }
       )
     }
-  ), /* @__PURE__ */ React4.createElement(Card, { border: true, padding: 2, shadow: 1, radius: 2 }, showUtilities ? /* @__PURE__ */ React4.createElement(Stack2, { space: 4, marginTop: 2 }, /* @__PURE__ */ React4.createElement(Stack2, { space: 2 }, /* @__PURE__ */ React4.createElement(Text4, { size: 1, weight: "semibold", style: { lineHeight: 1.6 } }, "Regenerate Subfamilies"), /* @__PURE__ */ React4.createElement(RegenerateSubfamiliesComponent, null)), /* @__PURE__ */ React4.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React4.createElement(Text4, { size: 1, weight: "semibold", style: { lineHeight: 1.6 } }, "Rename Fonts (name table, Full Name)"), /* @__PURE__ */ React4.createElement(Flex3, { align: "center", gap: 2 }, /* @__PURE__ */ React4.createElement(
+  ), /* @__PURE__ */ React5.createElement(Card, { border: true, padding: 2, shadow: 1, radius: 2 }, showUtilities ? /* @__PURE__ */ React5.createElement(Stack2, { space: 4, marginTop: 2 }, /* @__PURE__ */ React5.createElement(Stack2, { space: 2 }, /* @__PURE__ */ React5.createElement(Text4, { size: 1, weight: "semibold", style: { lineHeight: 1.6 } }, "Regenerate Subfamilies"), /* @__PURE__ */ React5.createElement(RegenerateSubfamiliesComponent, null)), /* @__PURE__ */ React5.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React5.createElement(Text4, { size: 1, weight: "semibold", style: { lineHeight: 1.6 } }, "Rename Fonts (name table, Full Name)"), /* @__PURE__ */ React5.createElement(Flex3, { align: "center", gap: 2 }, /* @__PURE__ */ React5.createElement(
     Switch,
     {
       checked: preserveShortenedNames,
@@ -1982,7 +1982,7 @@ var BatchUploadFonts = () => {
   ), renderTooltipLabel(
     "Preserve shortened names",
     'Abbreviations in font names are kept as-is (e.g. "XNarrow" stays "XNarrow", "Bd" stays "Bd").'
-  )), ready === "rename" ? renderProcessing() : /* @__PURE__ */ React4.createElement(Button2, { mode: "ghost", tone: "primary", text: "Rename Existing Fonts", style: { width: "100%" }, onClick: handleRenameExistingFonts, disabled: ready !== true })), /* @__PURE__ */ React4.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React4.createElement(Text4, { size: 1, weight: "semibold", style: { lineHeight: 1.6 } }, "Update Font Prices"), ready === "price" ? renderProcessing() : /* @__PURE__ */ React4.createElement(Stack2, { space: 2 }, /* @__PURE__ */ React4.createElement(PriceInput_default, { inputPrice, handleInputChange }), /* @__PURE__ */ React4.createElement(Button2, { mode: "ghost", tone: "primary", text: "Update All Font Prices", style: { width: "100%" }, onClick: handleChangeFontPrice, disabled: ready !== true }))), /* @__PURE__ */ React4.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React4.createElement(Text4, { size: 1, weight: "semibold", style: { lineHeight: 1.6 } }, "Regenerate CSS"), /* @__PURE__ */ React4.createElement(Text4, { size: 1, muted: true, style: { lineHeight: 1.6 } }, "Rebuilds the CSS @font-face files for all fonts in the typeface fonts list."), ready === "css" ? renderProcessing() : /* @__PURE__ */ React4.createElement(Button2, { mode: "ghost", tone: "primary", text: "Regenerate CSS Files", style: { width: "100%" }, onClick: handleRegenerateCssFiles, disabled: ready !== true }))) : ready ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(Grid, { columns: [2], gap: 4, marginTop: 1, marginBottom: 1 }, /* @__PURE__ */ React4.createElement(Box2, null, /* @__PURE__ */ React4.createElement(PriceInput_default, { inputPrice, handleInputChange })), /* @__PURE__ */ React4.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React4.createElement(Flex3, { align: "center", gap: 2 }, /* @__PURE__ */ React4.createElement(
+  )), ready === "rename" ? renderProcessing() : /* @__PURE__ */ React5.createElement(Button2, { mode: "ghost", tone: "primary", text: "Rename Existing Fonts", style: { width: "100%" }, onClick: handleRenameExistingFonts, disabled: ready !== true })), /* @__PURE__ */ React5.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React5.createElement(Text4, { size: 1, weight: "semibold", style: { lineHeight: 1.6 } }, "Update Font Prices"), ready === "price" ? renderProcessing() : /* @__PURE__ */ React5.createElement(Stack2, { space: 2 }, /* @__PURE__ */ React5.createElement(PriceInput_default, { inputPrice, handleInputChange }), /* @__PURE__ */ React5.createElement(Button2, { mode: "ghost", tone: "primary", text: "Update All Font Prices", style: { width: "100%" }, onClick: handleChangeFontPrice, disabled: ready !== true }))), /* @__PURE__ */ React5.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React5.createElement(Text4, { size: 1, weight: "semibold", style: { lineHeight: 1.6 } }, "Regenerate CSS"), /* @__PURE__ */ React5.createElement(Text4, { size: 1, muted: true, style: { lineHeight: 1.6 } }, "Rebuilds the CSS @font-face files for all fonts in the typeface fonts list."), ready === "css" ? renderProcessing() : /* @__PURE__ */ React5.createElement(Button2, { mode: "ghost", tone: "primary", text: "Regenerate CSS Files", style: { width: "100%" }, onClick: handleRegenerateCssFiles, disabled: ready !== true }))) : ready ? /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(Grid, { columns: [2], gap: 4, marginTop: 1, marginBottom: 1 }, /* @__PURE__ */ React5.createElement(Box2, null, /* @__PURE__ */ React5.createElement(PriceInput_default, { inputPrice, handleInputChange })), /* @__PURE__ */ React5.createElement(Stack2, { space: 3 }, /* @__PURE__ */ React5.createElement(Flex3, { align: "center", gap: 2 }, /* @__PURE__ */ React5.createElement(
     Switch,
     {
       checked: preserveShortenedNames,
@@ -1991,7 +1991,7 @@ var BatchUploadFonts = () => {
   ), renderTooltipLabel(
     "Preserve shortened names",
     'Abbreviations in font names are kept as-is (e.g. "XNarrow" stays "XNarrow", "Bd" stays "Bd").'
-  )), /* @__PURE__ */ React4.createElement(Flex3, { align: "center", gap: 2 }, /* @__PURE__ */ React4.createElement(
+  )), /* @__PURE__ */ React5.createElement(Flex3, { align: "center", gap: 2 }, /* @__PURE__ */ React5.createElement(
     Switch,
     {
       checked: preserveFileNames,
@@ -2000,11 +2000,11 @@ var BatchUploadFonts = () => {
   ), renderTooltipLabel(
     "Preserve file names",
     "Original filename capitalisation is used for asset naming instead of the normalised font title."
-  )))), /* @__PURE__ */ React4.createElement(Box2, { marginTop: 3 }, pendingFiles.length === 0 ? renderDropZone() : renderFileList())) : renderProcessing())));
+  )))), /* @__PURE__ */ React5.createElement(Box2, { marginTop: 3 }, pendingFiles.length === 0 ? renderDropZone() : renderFileList())) : renderProcessing())));
 };
 // src/components/GenerateCollectionsPairsComponent.jsx
-import React5, { useCallback as useCallback2, useState as useState3 } from "react";
+import React6, { useCallback as useCallback2, useState as useState3 } from "react";
 import { Stack as Stack3, Grid as Grid2, Flex as Flex4, Text as Text5, Button as Button3, Card as Card2, Spinner as Spinner2 } from "@sanity/ui";
 import { useFormValue as useFormValue3 } from "sanity";
 import slugify2 from "slugify";
@@ -2184,7 +2184,7 @@ var GenerateCollectionsPairsComponent = () => {
     setReady(true);
   }, [doc_id, title, slug, stylesObject, pairPrice, client, createSanityPair]);
   if (!title || !slug) return null;
-  return /* @__PURE__ */ React5.createElement(Stack3, { space: 2 }, /* @__PURE__ */ React5.createElement(StatusDisplay_default, { status, error: false }), /* @__PURE__ */ React5.createElement(Card2, { border: true, padding: 2, shadow: 1, radius: 2 }, ready ? /* @__PURE__ */ React5.createElement(Stack3, { space: 3 }, /* @__PURE__ */ React5.createElement(Grid2, { columns: [2], gap: 4, marginTop: 1, marginBottom: 1 }, /* @__PURE__ */ React5.createElement(Stack3, { space: 2 }, /* @__PURE__ */ React5.createElement(Text5, { size: 1, muted: true }, "Collection price / font"), /* @__PURE__ */ React5.createElement(Flex4, { align: "center", gap: 2 }, /* @__PURE__ */ React5.createElement(Text5, { size: 1, muted: true }, "$"), /* @__PURE__ */ React5.createElement(
+  return /* @__PURE__ */ React6.createElement(Stack3, { space: 2 }, /* @__PURE__ */ React6.createElement(StatusDisplay_default, { status, error: false }), /* @__PURE__ */ React6.createElement(Card2, { border: true, padding: 2, shadow: 1, radius: 2 }, ready ? /* @__PURE__ */ React6.createElement(Stack3, { space: 3 }, /* @__PURE__ */ React6.createElement(Grid2, { columns: [2], gap: 4, marginTop: 1, marginBottom: 1 }, /* @__PURE__ */ React6.createElement(Stack3, { space: 2 }, /* @__PURE__ */ React6.createElement(Text5, { size: 1, muted: true }, "Collection price / font"), /* @__PURE__ */ React6.createElement(Flex4, { align: "center", gap: 2 }, /* @__PURE__ */ React6.createElement(Text5, { size: 1, muted: true }, "$"), /* @__PURE__ */ React6.createElement(
     "input",
     {
       value: collectionPrice,
@@ -2192,7 +2192,7 @@ var GenerateCollectionsPairsComponent = () => {
       type: "number",
       style: { textAlign: "end", padding: "5px", maxWidth: "75px" }
     }
-  ))), /* @__PURE__ */ React5.createElement(Stack3, { space: 2 }, /* @__PURE__ */ React5.createElement(Text5, { size: 1, muted: true }, "Pair price"), /* @__PURE__ */ React5.createElement(Flex4, { align: "center", gap: 2 }, /* @__PURE__ */ React5.createElement(Text5, { size: 1, muted: true }, "$"), /* @__PURE__ */ React5.createElement(
+  ))), /* @__PURE__ */ React6.createElement(Stack3, { space: 2 }, /* @__PURE__ */ React6.createElement(Text5, { size: 1, muted: true }, "Pair price"), /* @__PURE__ */ React6.createElement(Flex4, { align: "center", gap: 2 }, /* @__PURE__ */ React6.createElement(Text5, { size: 1, muted: true }, "$"), /* @__PURE__ */ React6.createElement(
     "input",
     {
       value: pairPrice,
@@ -2200,11 +2200,11 @@ var GenerateCollectionsPairsComponent = () => {
       type: "number",
       style: { textAlign: "end", padding: "5px", maxWidth: "75px" }
     }
-  )))), /* @__PURE__ */ React5.createElement(Button3, { mode: "ghost", tone: "primary", text: "Generate Collections", style: { width: "100%" }, onClick: handleGenerateCollections }), /* @__PURE__ */ React5.createElement(Button3, { mode: "ghost", tone: "primary", text: "Generate Pairs", style: { width: "100%" }, onClick: handleGeneratePairs })) : /* @__PURE__ */ React5.createElement(Flex4, { align: "center", justify: "center", gap: 3, padding: 4 }, /* @__PURE__ */ React5.createElement(Spinner2, null), /* @__PURE__ */ React5.createElement(Text5, { muted: true, size: 1 }, status))));
+  )))), /* @__PURE__ */ React6.createElement(Button3, { mode: "ghost", tone: "primary", text: "Generate Collections", style: { width: "100%" }, onClick: handleGenerateCollections }), /* @__PURE__ */ React6.createElement(Button3, { mode: "ghost", tone: "primary", text: "Generate Pairs", style: { width: "100%" }, onClick: handleGeneratePairs })) : /* @__PURE__ */ React6.createElement(Flex4, { align: "center", justify: "center", gap: 3, padding: 4 }, /* @__PURE__ */ React6.createElement(Spinner2, null), /* @__PURE__ */ React6.createElement(Text5, { muted: true, size: 1 }, status))));
 };
 // src/components/UpdateScriptsComponent.jsx
-import React6, { useState as useState4, useCallback as useCallback3, useRef as useRef2, useEffect as useEffect2 } from "react";
+import React7, { useState as useState4, useCallback as useCallback3, useRef as useRef2, useEffect as useEffect2 } from "react";
 import { Stack as Stack4, Text as Text6, Button as Button4 } from "@sanity/ui";
 import { useFormValue as useFormValue4, set } from "sanity";
 var UpdateScriptsComponent = (props) => {
@@ -2247,7 +2247,7 @@ var UpdateScriptsComponent = (props) => {
     if (isReadyRef.current) onChange(set(newScripts));
     setMessage("Scripts updated");
   }, [onChange, fonts, client]);
-  return /* @__PURE__ */ React6.createElement(Stack4, { space: 3 }, /* @__PURE__ */ React6.createElement(
+  return /* @__PURE__ */ React7.createElement(Stack4, { space: 3 }, /* @__PURE__ */ React7.createElement(
     Button4,
     {
       mode: "ghost",
@@ -2256,11 +2256,11 @@ var UpdateScriptsComponent = (props) => {
       text: "Update Scripts from Font Files",
       onClick: updateFromFonts
     }
-  ), message && /* @__PURE__ */ React6.createElement(Text6, { size: 1, style: { color: "green" } }, message), props.renderDefault(props));
+  ), message && /* @__PURE__ */ React7.createElement(Text6, { size: 1, style: { color: "green" } }, message), props.renderDefault(props));
 };
 // src/components/SingleUploaderTool.jsx
-import React7, { useState as useState5, useEffect as useEffect3, useCallback as useCallback4, useMemo as useMemo3 } from "react";
+import React8, { useState as useState5, useEffect as useEffect3, useCallback as useCallback4, useMemo as useMemo3 } from "react";
 import { Button as Button5, Grid as Grid3, Stack as Stack5, Flex as Flex5, Box as Box3, Text as Text7, Card as Card3 } from "@sanity/ui";
 import { TrashIcon as TrashIcon2, ControlsIcon as ControlsIcon2 } from "@sanity/icons";
 import { useFormValue as useFormValue5, set as set2, unset } from "sanity";
@@ -2804,26 +2804,26 @@ var SingleUploaderTool = (props) => {
     const formatUpper = format.toUpperCase();
     const hasFile = !!((_b2 = (_a2 = fileInput == null ? void 0 : fileInput[format]) == null ? void 0 : _a2.asset) == null ? void 0 : _b2._ref);
     const fileUrl = hasFile ? `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${fileInput[format].asset._ref.replace("file-", "").replace("-", ".")}` : null;
-    return /* @__PURE__ */ React7.createElement(Card3, { border: true, radius: 1, paddingX: 2, paddingY: 3 }, /* @__PURE__ */ React7.createElement(Flex5, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React7.createElement(Flex5, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React7.createElement(Text7, { size: 0, style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0, opacity: hasFile ? 1 : 0.5 } }, formatUpper), hasFile ? /* @__PURE__ */ React7.createElement(Box3, { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, /* @__PURE__ */ React7.createElement("a", { href: fileUrl, target: "_blank", rel: "noreferrer" }, (filenames == null ? void 0 : filenames[format]) || "File")) : /* @__PURE__ */ React7.createElement(Text7, { size: 1, muted: true }, "\u2014")), status === "ready" && /* @__PURE__ */ React7.createElement(Flex5, { gap: 1, align: "center", style: { flexShrink: 0 } }, buildSource && (fileInput == null ? void 0 : fileInput[buildSource]) && /* @__PURE__ */ React7.createElement(Button5, { mode: "ghost", tone: "primary", fontSize: 1, padding: 2, onClick: () => handleGenerateFontFile(format, fileInput[buildSource]), text: "Build" }), /* @__PURE__ */ React7.createElement(Button5, { as: "label", mode: "ghost", tone: "primary", fontSize: 1, padding: 2, style: { cursor: "pointer" } }, /* @__PURE__ */ React7.createElement(Text7, { size: 1 }, "Upload"), /* @__PURE__ */ React7.createElement("input", { ref, type: "file", hidden: true, onChange: (e) => handleUpload(e, format) })), hasFile && /* @__PURE__ */ React7.createElement(Button5, { mode: "bleed", tone: "critical", icon: TrashIcon2, padding: 2, onClick: () => handleDelete(format) }))));
+    return /* @__PURE__ */ React8.createElement(Card3, { border: true, radius: 1, paddingX: 2, paddingY: 3 }, /* @__PURE__ */ React8.createElement(Flex5, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React8.createElement(Flex5, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React8.createElement(Text7, { size: 0, style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0, opacity: hasFile ? 1 : 0.5 } }, formatUpper), hasFile ? /* @__PURE__ */ React8.createElement(Box3, { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, /* @__PURE__ */ React8.createElement("a", { href: fileUrl, target: "_blank", rel: "noreferrer" }, (filenames == null ? void 0 : filenames[format]) || "File")) : /* @__PURE__ */ React8.createElement(Text7, { size: 1, muted: true }, "\u2014")), status === "ready" && /* @__PURE__ */ React8.createElement(Flex5, { gap: 1, align: "center", style: { flexShrink: 0 } }, buildSource && (fileInput == null ? void 0 : fileInput[buildSource]) && /* @__PURE__ */ React8.createElement(Button5, { mode: "ghost", tone: "primary", fontSize: 1, padding: 2, onClick: () => handleGenerateFontFile(format, fileInput[buildSource]), text: "Build" }), /* @__PURE__ */ React8.createElement(Button5, { as: "label", mode: "ghost", tone: "primary", fontSize: 1, padding: 2, style: { cursor: "pointer" } }, /* @__PURE__ */ React8.createElement(Text7, { size: 1 }, "Upload"), /* @__PURE__ */ React8.createElement("input", { ref, type: "file", hidden: true, onChange: (e) => handleUpload(e, format) })), hasFile && /* @__PURE__ */ React8.createElement(Button5, { mode: "bleed", tone: "critical", icon: TrashIcon2, padding: 2, onClick: () => handleDelete(format) }))));
   };
   const renderTopLevelAssetSection = (label, fieldName, assetRef, filename, onBuild) => {
     const hasFile = !!assetRef;
     const fileUrl = hasFile ? `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${assetRef.replace("file-", "").replace("-", ".")}` : null;
-    return /* @__PURE__ */ React7.createElement(Card3, { border: true, radius: 1, paddingX: 2, paddingY: 3 }, /* @__PURE__ */ React7.createElement(Flex5, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React7.createElement(Flex5, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React7.createElement(Text7, { size: 0, style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0, opacity: hasFile ? 1 : 0.5 } }, label), hasFile ? /* @__PURE__ */ React7.createElement(Box3, { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, /* @__PURE__ */ React7.createElement("a", { href: fileUrl, target: "_blank", rel: "noreferrer" }, filename || "File")) : /* @__PURE__ */ React7.createElement(Text7, { size: 1, muted: true }, "\u2014")), status === "ready" && /* @__PURE__ */ React7.createElement(Flex5, { gap: 1, align: "center", style: { flexShrink: 0 } }, onBuild && (fileInput == null ? void 0 : fileInput.woff2) && /* @__PURE__ */ React7.createElement(Button5, { mode: "ghost", tone: "primary", fontSize: 1, padding: 2, onClick: onBuild, text: "Build" }), /* @__PURE__ */ React7.createElement(Button5, { as: "label", mode: "ghost", tone: "primary", fontSize: 1, padding: 2, style: { cursor: "pointer" } }, /* @__PURE__ */ React7.createElement(Text7, { size: 1 }, "Upload"), /* @__PURE__ */ React7.createElement("input", { type: "file", hidden: true, onChange: (e) => handleUploadTopLevelFile(e, fieldName) })), hasFile && /* @__PURE__ */ React7.createElement(Button5, { mode: "bleed", tone: "critical", icon: TrashIcon2, padding: 2, onClick: () => handleDeleteTopLevel(fieldName) }))));
+    return /* @__PURE__ */ React8.createElement(Card3, { border: true, radius: 1, paddingX: 2, paddingY: 3 }, /* @__PURE__ */ React8.createElement(Flex5, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React8.createElement(Flex5, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React8.createElement(Text7, { size: 0, style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0, opacity: hasFile ? 1 : 0.5 } }, label), hasFile ? /* @__PURE__ */ React8.createElement(Box3, { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, /* @__PURE__ */ React8.createElement("a", { href: fileUrl, target: "_blank", rel: "noreferrer" }, filename || "File")) : /* @__PURE__ */ React8.createElement(Text7, { size: 1, muted: true }, "\u2014")), status === "ready" && /* @__PURE__ */ React8.createElement(Flex5, { gap: 1, align: "center", style: { flexShrink: 0 } }, onBuild && (fileInput == null ? void 0 : fileInput.woff2) && /* @__PURE__ */ React8.createElement(Button5, { mode: "ghost", tone: "primary", fontSize: 1, padding: 2, onClick: onBuild, text: "Build" }), /* @__PURE__ */ React8.createElement(Button5, { as: "label", mode: "ghost", tone: "primary", fontSize: 1, padding: 2, style: { cursor: "pointer" } }, /* @__PURE__ */ React8.createElement(Text7, { size: 1 }, "Upload"), /* @__PURE__ */ React8.createElement("input", { type: "file", hidden: true, onChange: (e) => handleUploadTopLevelFile(e, fieldName) })), hasFile && /* @__PURE__ */ React8.createElement(Button5, { mode: "bleed", tone: "critical", icon: TrashIcon2, padding: 2, onClick: () => handleDeleteTopLevel(fieldName) }))));
   };
   const renderCssSection = () => {
     var _a2, _b2;
     const hasFile = !!((_b2 = (_a2 = fileInput == null ? void 0 : fileInput.css) == null ? void 0 : _a2.asset) == null ? void 0 : _b2._ref);
     const fileUrl = hasFile ? `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${fileInput.css.asset._ref.replace("file-", "").replace("-", ".")}` : null;
-    return /* @__PURE__ */ React7.createElement(Card3, { border: true, radius: 1, paddingX: 2, paddingY: 3 }, /* @__PURE__ */ React7.createElement(Flex5, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React7.createElement(Flex5, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React7.createElement(Text7, { size: 0, style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0, opacity: hasFile ? 1 : 0.5 } }, "CSS"), hasFile ? /* @__PURE__ */ React7.createElement(Box3, { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, /* @__PURE__ */ React7.createElement("a", { href: fileUrl, target: "_blank", rel: "noreferrer" }, (filenames == null ? void 0 : filenames.css) || "File")) : /* @__PURE__ */ React7.createElement(Text7, { size: 1, muted: true }, "\u2014")), status === "ready" && /* @__PURE__ */ React7.createElement(Flex5, { gap: 1, align: "center", style: { flexShrink: 0 } }, (fileInput == null ? void 0 : fileInput.woff2) && /* @__PURE__ */ React7.createElement(Button5, { mode: "ghost", tone: "primary", fontSize: 1, padding: 2, onClick: () => handleGenerateCssFile(), text: "Build" }), hasFile && /* @__PURE__ */ React7.createElement(Button5, { mode: "bleed", tone: "critical", icon: TrashIcon2, padding: 2, onClick: () => handleDelete("css") }))));
+    return /* @__PURE__ */ React8.createElement(Card3, { border: true, radius: 1, paddingX: 2, paddingY: 3 }, /* @__PURE__ */ React8.createElement(Flex5, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React8.createElement(Flex5, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React8.createElement(Text7, { size: 0, style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0, opacity: hasFile ? 1 : 0.5 } }, "CSS"), hasFile ? /* @__PURE__ */ React8.createElement(Box3, { style: { flex: 1, minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, /* @__PURE__ */ React8.createElement("a", { href: fileUrl, target: "_blank", rel: "noreferrer" }, (filenames == null ? void 0 : filenames.css) || "File")) : /* @__PURE__ */ React8.createElement(Text7, { size: 1, muted: true }, "\u2014")), status === "ready" && /* @__PURE__ */ React8.createElement(Flex5, { gap: 1, align: "center", style: { flexShrink: 0 } }, (fileInput == null ? void 0 : fileInput.woff2) && /* @__PURE__ */ React8.createElement(Button5, { mode: "ghost", tone: "primary", fontSize: 1, padding: 2, onClick: () => handleGenerateCssFile(), text: "Build" }), hasFile && /* @__PURE__ */ React8.createElement(Button5, { mode: "bleed", tone: "critical", icon: TrashIcon2, padding: 2, onClick: () => handleDelete("css") }))));
   };
-  const renderDataSection = () => /* @__PURE__ */ React7.createElement(Card3, { border: true, radius: 1, paddingX: 2, paddingY: 3 }, /* @__PURE__ */ React7.createElement(Flex5, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React7.createElement(Flex5, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React7.createElement(Text7, { size: 0, style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0, opacity: (doc_metaData == null ? void 0 : doc_metaData.version) ? 1 : 0.5 } }, "DATA"), (doc_metaData == null ? void 0 : doc_metaData.version) ? /* @__PURE__ */ React7.createElement(Text7, { size: 1 }, "v", doc_metaData.version, " ", /* @__PURE__ */ React7.createElement(Text7, { as: "span", size: 1, muted: true }, "(", doc_metaData.genDate, ")")) : /* @__PURE__ */ React7.createElement(Text7, { size: 1, muted: true }, "\u2014")), status === "ready" && (fileInput == null ? void 0 : fileInput.ttf) && /* @__PURE__ */ React7.createElement(Flex5, { gap: 1, align: "center", style: { flexShrink: 0 } }, /* @__PURE__ */ React7.createElement(Button5, { mode: "ghost", tone: "primary", fontSize: 1, padding: 2, onClick: () => handleGenerateFontData(), text: "Build" }))));
-  return /* @__PURE__ */ React7.createElement(Stack5, { space: 2 }, /* @__PURE__ */ React7.createElement(
+  const renderDataSection = () => /* @__PURE__ */ React8.createElement(Card3, { border: true, radius: 1, paddingX: 2, paddingY: 3 }, /* @__PURE__ */ React8.createElement(Flex5, { justify: "space-between", align: "center", gap: 2 }, /* @__PURE__ */ React8.createElement(Flex5, { gap: 3, align: "center", style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React8.createElement(Text7, { size: 0, style: { fontFamily: "monospace", minWidth: "2.5rem", flexShrink: 0, opacity: (doc_metaData == null ? void 0 : doc_metaData.version) ? 1 : 0.5 } }, "DATA"), (doc_metaData == null ? void 0 : doc_metaData.version) ? /* @__PURE__ */ React8.createElement(Text7, { size: 1 }, "v", doc_metaData.version, " ", /* @__PURE__ */ React8.createElement(Text7, { as: "span", size: 1, muted: true }, "(", doc_metaData.genDate, ")")) : /* @__PURE__ */ React8.createElement(Text7, { size: 1, muted: true }, "\u2014")), status === "ready" && (fileInput == null ? void 0 : fileInput.ttf) && /* @__PURE__ */ React8.createElement(Flex5, { gap: 1, align: "center", style: { flexShrink: 0 } }, /* @__PURE__ */ React8.createElement(Button5, { mode: "ghost", tone: "primary", fontSize: 1, padding: 2, onClick: () => handleGenerateFontData(), text: "Build" }))));
+  return /* @__PURE__ */ React8.createElement(Stack5, { space: 2 }, /* @__PURE__ */ React8.createElement(
     StatusDisplay_default,
     {
       status,
       error,
-      action: /* @__PURE__ */ React7.createElement(
+      action: /* @__PURE__ */ React8.createElement(
         Button5,
         {
           mode: "bleed",
@@ -2835,7 +2835,7 @@ var SingleUploaderTool = (props) => {
         }
       )
     }
-  ), renderFontSection("ttf"), status === "ready" && (fileInput == null ? void 0 : fileInput.ttf) && /* @__PURE__ */ React7.createElement(Grid3, { columns: [1, 2], gap: 2 }, /* @__PURE__ */ React7.createElement(
+  ), renderFontSection("ttf"), status === "ready" && (fileInput == null ? void 0 : fileInput.ttf) && /* @__PURE__ */ React8.createElement(Grid3, { columns: [1, 2], gap: 2 }, /* @__PURE__ */ React8.createElement(
     Button5,
     {
       mode: "ghost",
@@ -2844,7 +2844,7 @@ var SingleUploaderTool = (props) => {
       text: "Rebuild All from TTF",
       style: { width: "100%" }
     }
-  ), /* @__PURE__ */ React7.createElement(
+  ), /* @__PURE__ */ React8.createElement(
     Button5,
     {
       mode: "ghost",
@@ -2864,11 +2864,11 @@ var SingleUploaderTool = (props) => {
       text: "Build Missing",
       style: { width: "100%" }
     }
-  )), renderFontSection("otf", "woff"), renderFontSection("woff", "ttf"), renderFontSection("woff2", "ttf"), showAdvanced && renderTopLevelAssetSection("WEB", "woff2_web", (_b = (_a = fileInput == null ? void 0 : fileInput.woff2_web) == null ? void 0 : _a.asset) == null ? void 0 : _b._ref, filenames == null ? void 0 : filenames.woff2_web, handleGenerateSubsetAndWeb), showAdvanced && renderTopLevelAssetSection("SUBSET", "woff2_subset", (_d = (_c = fileInput == null ? void 0 : fileInput.woff2_subset) == null ? void 0 : _c.asset) == null ? void 0 : _d._ref, filenames == null ? void 0 : filenames.woff2_subset, handleGenerateSubsetAndWeb), showAdvanced && renderFontSection("eot", "ttf"), showAdvanced && renderFontSection("svg", "ttf"), renderCssSection(), showAdvanced && renderDataSection(), status === "ready" && ((fileInput == null ? void 0 : fileInput.ttf) || (fileInput == null ? void 0 : fileInput.otf) || (fileInput == null ? void 0 : fileInput.woff) || (fileInput == null ? void 0 : fileInput.woff2)) && /* @__PURE__ */ React7.createElement(Button5, { mode: "ghost", tone: "critical", onClick: () => handleDeleteAll(), text: "Delete All", style: { width: "100%" } }));
+  )), renderFontSection("otf", "woff"), renderFontSection("woff", "ttf"), renderFontSection("woff2", "ttf"), showAdvanced && renderTopLevelAssetSection("WEB", "woff2_web", (_b = (_a = fileInput == null ? void 0 : fileInput.woff2_web) == null ? void 0 : _a.asset) == null ? void 0 : _b._ref, filenames == null ? void 0 : filenames.woff2_web, handleGenerateSubsetAndWeb), showAdvanced && renderTopLevelAssetSection("SUBSET", "woff2_subset", (_d = (_c = fileInput == null ? void 0 : fileInput.woff2_subset) == null ? void 0 : _c.asset) == null ? void 0 : _d._ref, filenames == null ? void 0 : filenames.woff2_subset, handleGenerateSubsetAndWeb), showAdvanced && renderFontSection("eot", "ttf"), showAdvanced && renderFontSection("svg", "ttf"), renderCssSection(), showAdvanced && renderDataSection(), status === "ready" && ((fileInput == null ? void 0 : fileInput.ttf) || (fileInput == null ? void 0 : fileInput.otf) || (fileInput == null ? void 0 : fileInput.woff) || (fileInput == null ? void 0 : fileInput.woff2)) && /* @__PURE__ */ React8.createElement(Button5, { mode: "ghost", tone: "critical", onClick: () => handleDeleteAll(), text: "Delete All", style: { width: "100%" } }));
 };
 // src/components/UploadScriptsComponent.jsx
-import React9, { useCallback as useCallback5, useEffect as useEffect4, useMemo as useMemo4, useState as useState6 } from "react";
+import React10, { useCallback as useCallback5, useEffect as useEffect4, useMemo as useMemo4, useState as useState6 } from "react";
 import { Button as Button6, Flex as Flex6, Grid as Grid4, Stack as Stack6, Text as Text8, TextInput, MenuButton, Menu, MenuItem, Select } from "@sanity/ui";
 import * as fontkit6 from "fontkit";
 import slugify3 from "slugify";
@@ -2876,7 +2876,7 @@ import { useFormValue as useFormValue6 } from "sanity";
 import { nanoid as nanoid7 } from "nanoid";
 // src/utils/utils.js
-import React8 from "react";
+import React9 from "react";
 var HtmlDescription = ({ children }) => {
   return children || "";
 };
@@ -2890,8 +2890,8 @@ var UploadScriptsComponent = (props) => {
   const { elementProps: { ref } } = props;
   const client = useSanityClient();
   const [selectedScript, setSelectedScript] = useState6("");
-  const [status, setStatus] = React9.useState("");
-  const [ready, setReady] = React9.useState(true);
+  const [status, setStatus] = React10.useState("");
+  const [ready, setReady] = React10.useState(true);
   let doc_id = useFormValue6(["_id"]);
   const title = useFormValue6(["title"]);
   const slug = useFormValue6(["slug"]);
@@ -3213,26 +3213,26 @@ var UploadScriptsComponent = (props) => {
     }
     setReady(true);
   }, [title, slug, doc_id]);
-  return /* @__PURE__ */ React9.createElement(Stack6, null, !ready && /* @__PURE__ */ React9.createElement(Text8, null, /* @__PURE__ */ React9.createElement("br", null), status, /* @__PURE__ */ React9.createElement("br", null), /* @__PURE__ */ React9.createElement("br", null)), ready && /* @__PURE__ */ React9.createElement(Stack6, null, /* @__PURE__ */ React9.createElement(Grid4, { columns: !!(selectedScript && selectedScript !== "") ? 2 : 1, gap: 2 }, /* @__PURE__ */ React9.createElement(
+  return /* @__PURE__ */ React10.createElement(Stack6, null, !ready && /* @__PURE__ */ React10.createElement(Text8, null, /* @__PURE__ */ React10.createElement("br", null), status, /* @__PURE__ */ React10.createElement("br", null), /* @__PURE__ */ React10.createElement("br", null)), ready && /* @__PURE__ */ React10.createElement(Stack6, null, /* @__PURE__ */ React10.createElement(Grid4, { columns: !!(selectedScript && selectedScript !== "") ? 2 : 1, gap: 2 }, /* @__PURE__ */ React10.createElement(
     Select,
     {
       id: "menu-button-example",
       onChange: (e) => setSelectedScript(e.target.value)
     },
-    /* @__PURE__ */ React9.createElement("option", { key: "script-none", value: "" }, " "),
+    /* @__PURE__ */ React10.createElement("option", { key: "script-none", value: "" }, " "),
     SCRIPTS.map(
       (script, i) => {
         var _a;
-        return /* @__PURE__ */ React9.createElement("option", { key: "script-" + i, value: script }, ((_a = script[0]) == null ? void 0 : _a.toUpperCase()) + script.slice(1));
+        return /* @__PURE__ */ React10.createElement("option", { key: "script-" + i, value: script }, ((_a = script[0]) == null ? void 0 : _a.toUpperCase()) + script.slice(1));
       }
     )
-  ), !!(selectedScript && selectedScript !== "") && /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement("label", { htmlFor: "upload-scripts-file" }, /* @__PURE__ */ React9.createElement(
+  ), !!(selectedScript && selectedScript !== "") && /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement("label", { htmlFor: "upload-scripts-file" }, /* @__PURE__ */ React10.createElement(
     Button6,
     {
       style: { pointerEvents: "none" },
       text: "Upload (ttf/otf/woff/woff2/etc..)"
     }
-  )), /* @__PURE__ */ React9.createElement(
+  )), /* @__PURE__ */ React10.createElement(
     "input",
     {
       ref,
@@ -3247,7 +3247,7 @@ var UploadScriptsComponent = (props) => {
 };
 // src/components/FontScriptUploaderComponent.jsx
-import React10, { useState as useState7, useEffect as useEffect5, useCallback as useCallback6 } from "react";
+import React11, { useState as useState7, useEffect as useEffect5, useCallback as useCallback6 } from "react";
 import { Stack as Stack7, Flex as Flex7, Text as Text9, Button as Button7 } from "@sanity/ui";
 import { useFormValue as useFormValue7, set as set3, unset as unset2 } from "sanity";
 var FontScriptUploaderComponent = (props) => {
@@ -3456,17 +3456,17 @@ var FontScriptUploaderComponent = (props) => {
       }
     }
   }, [scriptFileInput]);
-  return /* @__PURE__ */ React10.createElement(Stack7, { space: 4 }, SCRIPTS && scriptFileInput && SCRIPTS.map((language, i) => {
+  return /* @__PURE__ */ React11.createElement(Stack7, { space: 4 }, SCRIPTS && scriptFileInput && SCRIPTS.map((language, i) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra, _sa, _ta, _ua, _va, _wa, _xa, _ya, _za, _Aa, _Ba, _Ca, _Da, _Ea, _Fa, _Ga;
-    return /* @__PURE__ */ React10.createElement(Stack7, { space: 2, key: "language-" + i, style: { borderBottom: "1px solid var(--card-border-color)", paddingBottom: 8 } }, /* @__PURE__ */ React10.createElement(Flex7, { gap: 2 }, /* @__PURE__ */ React10.createElement(Text9, { weight: "semibold" }, ((_a = language[0]) == null ? void 0 : _a.toUpperCase()) + language.slice(1)), message && message[language] && message[language] !== "" && /* @__PURE__ */ React10.createElement(Text9, { style: { color: "green" } }, message[language])), expanded[language] && /* @__PURE__ */ React10.createElement(Stack7, { space: 2 }, /* @__PURE__ */ React10.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React10.createElement(Text9, null, "TTF:\xA0", !((_d = (_c = (_b = scriptFileInput[language]) == null ? void 0 : _b.ttf) == null ? void 0 : _c.asset) == null ? void 0 : _d._ref) ? ((_e = filenames[language]) == null ? void 0 : _e.ttf) ? /* @__PURE__ */ React10.createElement("b", null, filenames[language].ttf) : /* @__PURE__ */ React10.createElement("b", null, "Empty") : /* @__PURE__ */ React10.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_h = (_g = (_f = scriptFileInput[language]) == null ? void 0 : _f.ttf) == null ? void 0 : _g.asset) == null ? void 0 : _h._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_i = filenames[language]) == null ? void 0 : _i.ttf) ? /* @__PURE__ */ React10.createElement("b", null, filenames[language].ttf) : /* @__PURE__ */ React10.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React10.createElement(Flex7, { gap: 1 }, /* @__PURE__ */ React10.createElement("label", null, /* @__PURE__ */ React10.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React10.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: (event) => handleUpload(event, language, "ttf") })), ((_j = value[language]) == null ? void 0 : _j.ttf) && /* @__PURE__ */ React10.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("ttf", language) }, "\xD7"))), status === "ready" && ((_k = value[language]) == null ? void 0 : _k.ttf) && /* @__PURE__ */ React10.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("all", value[language].ttf, language) }, "Regenerate Files from TTF"), /* @__PURE__ */ React10.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React10.createElement(Text9, null, "OTF:\xA0", !((_n = (_m = (_l = scriptFileInput[language]) == null ? void 0 : _l.otf) == null ? void 0 : _m.asset) == null ? void 0 : _n._ref) ? ((_o = filenames[language]) == null ? void 0 : _o.otf) ? /* @__PURE__ */ React10.createElement("b", null, (_p = filenames[language]) == null ? void 0 : _p.otf) : /* @__PURE__ */ React10.createElement("b", null, "Empty") : /* @__PURE__ */ React10.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_s = (_r = (_q = scriptFileInput[language]) == null ? void 0 : _q.otf) == null ? void 0 : _r.asset) == null ? void 0 : _s._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_t = filenames[language]) == null ? void 0 : _t.otf) ? /* @__PURE__ */ React10.createElement("b", null, (_u = filenames[language]) == null ? void 0 : _u.otf) : /* @__PURE__ */ React10.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React10.createElement(Flex7, { gap: 1 }, ((_v = value[language]) == null ? void 0 : _v.woff) && /* @__PURE__ */ React10.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("otf", value[language].woff, language) }, "Build"), /* @__PURE__ */ React10.createElement("label", null, /* @__PURE__ */ React10.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React10.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "otf") })), ((_w = value[language]) == null ? void 0 : _w.otf) && /* @__PURE__ */ React10.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("otf", language) }, "\xD7"))), /* @__PURE__ */ React10.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React10.createElement(Text9, null, "WOFF:\xA0", !((_z = (_y = (_x = scriptFileInput[language]) == null ? void 0 : _x.woff) == null ? void 0 : _y.asset) == null ? void 0 : _z._ref) ? ((_A = filenames[language]) == null ? void 0 : _A.woff) ? /* @__PURE__ */ React10.createElement("b", null, (_B = filenames[language]) == null ? void 0 : _B.woff) : /* @__PURE__ */ React10.createElement("b", null, "Empty") : /* @__PURE__ */ React10.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_E = (_D = (_C = scriptFileInput[language]) == null ? void 0 : _C.woff) == null ? void 0 : _D.asset) == null ? void 0 : _E._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_F = filenames[language]) == null ? void 0 : _F.woff) ? /* @__PURE__ */ React10.createElement("b", null, (_G = filenames[language]) == null ? void 0 : _G.woff) : /* @__PURE__ */ React10.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React10.createElement(Flex7, { gap: 1 }, ((_H = value[language]) == null ? void 0 : _H.ttf) && /* @__PURE__ */ React10.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("woff", value[language].ttf, language) }, "Build"), /* @__PURE__ */ React10.createElement("label", null, /* @__PURE__ */ React10.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React10.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "woff") })), ((_I = value[language]) == null ? void 0 : _I.woff) && /* @__PURE__ */ React10.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("woff", language) }, "\xD7"))), /* @__PURE__ */ React10.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React10.createElement(Text9, null, "WOFF2:\xA0", !((_L = (_K = (_J = scriptFileInput[language]) == null ? void 0 : _J.woff2) == null ? void 0 : _K.asset) == null ? void 0 : _L._ref) ? ((_M = filenames[language]) == null ? void 0 : _M.woff2) ? /* @__PURE__ */ React10.createElement("b", null, (_N = filenames[language]) == null ? void 0 : _N.woff2) : /* @__PURE__ */ React10.createElement("b", null, "Empty") : /* @__PURE__ */ React10.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_Q = (_P = (_O = scriptFileInput[language]) == null ? void 0 : _O.woff2) == null ? void 0 : _P.asset) == null ? void 0 : _Q._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_R = filenames[language]) == null ? void 0 : _R.woff2) ? /* @__PURE__ */ React10.createElement("b", null, (_S = filenames[language]) == null ? void 0 : _S.woff2) : /* @__PURE__ */ React10.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React10.createElement(Flex7, { gap: 1 }, ((_T = value[language]) == null ? void 0 : _T.ttf) && /* @__PURE__ */ React10.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("woff2", value[language].ttf, language) }, "Build"), /* @__PURE__ */ React10.createElement("label", null, /* @__PURE__ */ React10.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React10.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "woff2") })), ((_U = value[language]) == null ? void 0 : _U.woff2) && /* @__PURE__ */ React10.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("woff2", language) }, "\xD7"))), /* @__PURE__ */ React10.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React10.createElement(Text9, null, "EOT:\xA0", !((_X = (_W = (_V = scriptFileInput[language]) == null ? void 0 : _V.eot) == null ? void 0 : _W.asset) == null ? void 0 : _X._ref) ? ((_Y = filenames[language]) == null ? void 0 : _Y.eot) ? /* @__PURE__ */ React10.createElement("b", null, (_Z = filenames[language]) == null ? void 0 : _Z.eot) : /* @__PURE__ */ React10.createElement("b", null, "Empty") : /* @__PURE__ */ React10.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_aa = (_$ = (__ = scriptFileInput[language]) == null ? void 0 : __.eot) == null ? void 0 : _$.asset) == null ? void 0 : _aa._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_ba = filenames[language]) == null ? void 0 : _ba.eot) ? /* @__PURE__ */ React10.createElement("b", null, (_ca = filenames[language]) == null ? void 0 : _ca.eot) : /* @__PURE__ */ React10.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React10.createElement(Flex7, { gap: 1 }, ((_da = value[language]) == null ? void 0 : _da.ttf) && /* @__PURE__ */ React10.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("eot", value[language].ttf, language) }, "Build"), /* @__PURE__ */ React10.createElement("label", null, /* @__PURE__ */ React10.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React10.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "eot") })), ((_ea = value[language]) == null ? void 0 : _ea.eot) && /* @__PURE__ */ React10.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("eot", language) }, "\xD7"))), /* @__PURE__ */ React10.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React10.createElement(Text9, null, "SVG:\xA0", !((_ha = (_ga = (_fa = scriptFileInput[language]) == null ? void 0 : _fa.svg) == null ? void 0 : _ga.asset) == null ? void 0 : _ha._ref) ? ((_ia = filenames[language]) == null ? void 0 : _ia.svg) ? /* @__PURE__ */ React10.createElement("b", null, (_ja = filenames[language]) == null ? void 0 : _ja.svg) : /* @__PURE__ */ React10.createElement("b", null, "Empty") : /* @__PURE__ */ React10.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_ma = (_la = (_ka = scriptFileInput[language]) == null ? void 0 : _ka.svg) == null ? void 0 : _la.asset) == null ? void 0 : _ma._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_na = filenames[language]) == null ? void 0 : _na.svg) ? /* @__PURE__ */ React10.createElement("b", null, (_oa = filenames[language]) == null ? void 0 : _oa.svg) : /* @__PURE__ */ React10.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React10.createElement(Flex7, { gap: 1 }, ((_pa = value[language]) == null ? void 0 : _pa.ttf) && /* @__PURE__ */ React10.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("svg", value[language].ttf, language) }, "Build"), /* @__PURE__ */ React10.createElement("label", null, /* @__PURE__ */ React10.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React10.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "svg") })), ((_qa = value[language]) == null ? void 0 : _qa.svg) && /* @__PURE__ */ React10.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("svg", language) }, "\xD7"))), /* @__PURE__ */ React10.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React10.createElement(Text9, null, "CSS:\xA0", !((_ta = (_sa = (_ra = scriptFileInput[language]) == null ? void 0 : _ra.css) == null ? void 0 : _sa.asset) == null ? void 0 : _ta._ref) ? ((_ua = filenames[language]) == null ? void 0 : _ua.css) ? /* @__PURE__ */ React10.createElement("b", null, (_va = filenames[language]) == null ? void 0 : _va.css) : /* @__PURE__ */ React10.createElement("b", null, "Empty") : /* @__PURE__ */ React10.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_ya = (_xa = (_wa = scriptFileInput[language]) == null ? void 0 : _wa.css) == null ? void 0 : _xa.asset) == null ? void 0 : _ya._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_za = filenames[language]) == null ? void 0 : _za.css) ? /* @__PURE__ */ React10.createElement("b", null, (_Aa = filenames[language]) == null ? void 0 : _Aa.css) : /* @__PURE__ */ React10.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React10.createElement(Flex7, { gap: 1 }, ((_Ba = value[language]) == null ? void 0 : _Ba.woff2) && /* @__PURE__ */ React10.createElement(Button7, { mode: "default", onClick: () => handleGenerateCssFile(language) }, "Build"), ((_Ca = value[language]) == null ? void 0 : _Ca.css) && /* @__PURE__ */ React10.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("css", language) }, "\xD7"))), status === "ready" && (((_Da = value[language]) == null ? void 0 : _Da.ttf) || ((_Ea = value[language]) == null ? void 0 : _Ea.otf) || ((_Fa = value[language]) == null ? void 0 : _Fa.woff) || ((_Ga = value[language]) == null ? void 0 : _Ga.woff2)) && /* @__PURE__ */ React10.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDeleteAll(language), style: { width: "100%" } }, "Delete All")));
+    return /* @__PURE__ */ React11.createElement(Stack7, { space: 2, key: "language-" + i, style: { borderBottom: "1px solid var(--card-border-color)", paddingBottom: 8 } }, /* @__PURE__ */ React11.createElement(Flex7, { gap: 2 }, /* @__PURE__ */ React11.createElement(Text9, { weight: "semibold" }, ((_a = language[0]) == null ? void 0 : _a.toUpperCase()) + language.slice(1)), message && message[language] && message[language] !== "" && /* @__PURE__ */ React11.createElement(Text9, { style: { color: "green" } }, message[language])), expanded[language] && /* @__PURE__ */ React11.createElement(Stack7, { space: 2 }, /* @__PURE__ */ React11.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React11.createElement(Text9, null, "TTF:\xA0", !((_d = (_c = (_b = scriptFileInput[language]) == null ? void 0 : _b.ttf) == null ? void 0 : _c.asset) == null ? void 0 : _d._ref) ? ((_e = filenames[language]) == null ? void 0 : _e.ttf) ? /* @__PURE__ */ React11.createElement("b", null, filenames[language].ttf) : /* @__PURE__ */ React11.createElement("b", null, "Empty") : /* @__PURE__ */ React11.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_h = (_g = (_f = scriptFileInput[language]) == null ? void 0 : _f.ttf) == null ? void 0 : _g.asset) == null ? void 0 : _h._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_i = filenames[language]) == null ? void 0 : _i.ttf) ? /* @__PURE__ */ React11.createElement("b", null, filenames[language].ttf) : /* @__PURE__ */ React11.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React11.createElement(Flex7, { gap: 1 }, /* @__PURE__ */ React11.createElement("label", null, /* @__PURE__ */ React11.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React11.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: (event) => handleUpload(event, language, "ttf") })), ((_j = value[language]) == null ? void 0 : _j.ttf) && /* @__PURE__ */ React11.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("ttf", language) }, "\xD7"))), status === "ready" && ((_k = value[language]) == null ? void 0 : _k.ttf) && /* @__PURE__ */ React11.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("all", value[language].ttf, language) }, "Regenerate Files from TTF"), /* @__PURE__ */ React11.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React11.createElement(Text9, null, "OTF:\xA0", !((_n = (_m = (_l = scriptFileInput[language]) == null ? void 0 : _l.otf) == null ? void 0 : _m.asset) == null ? void 0 : _n._ref) ? ((_o = filenames[language]) == null ? void 0 : _o.otf) ? /* @__PURE__ */ React11.createElement("b", null, (_p = filenames[language]) == null ? void 0 : _p.otf) : /* @__PURE__ */ React11.createElement("b", null, "Empty") : /* @__PURE__ */ React11.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_s = (_r = (_q = scriptFileInput[language]) == null ? void 0 : _q.otf) == null ? void 0 : _r.asset) == null ? void 0 : _s._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_t = filenames[language]) == null ? void 0 : _t.otf) ? /* @__PURE__ */ React11.createElement("b", null, (_u = filenames[language]) == null ? void 0 : _u.otf) : /* @__PURE__ */ React11.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React11.createElement(Flex7, { gap: 1 }, ((_v = value[language]) == null ? void 0 : _v.woff) && /* @__PURE__ */ React11.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("otf", value[language].woff, language) }, "Build"), /* @__PURE__ */ React11.createElement("label", null, /* @__PURE__ */ React11.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React11.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "otf") })), ((_w = value[language]) == null ? void 0 : _w.otf) && /* @__PURE__ */ React11.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("otf", language) }, "\xD7"))), /* @__PURE__ */ React11.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React11.createElement(Text9, null, "WOFF:\xA0", !((_z = (_y = (_x = scriptFileInput[language]) == null ? void 0 : _x.woff) == null ? void 0 : _y.asset) == null ? void 0 : _z._ref) ? ((_A = filenames[language]) == null ? void 0 : _A.woff) ? /* @__PURE__ */ React11.createElement("b", null, (_B = filenames[language]) == null ? void 0 : _B.woff) : /* @__PURE__ */ React11.createElement("b", null, "Empty") : /* @__PURE__ */ React11.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_E = (_D = (_C = scriptFileInput[language]) == null ? void 0 : _C.woff) == null ? void 0 : _D.asset) == null ? void 0 : _E._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_F = filenames[language]) == null ? void 0 : _F.woff) ? /* @__PURE__ */ React11.createElement("b", null, (_G = filenames[language]) == null ? void 0 : _G.woff) : /* @__PURE__ */ React11.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React11.createElement(Flex7, { gap: 1 }, ((_H = value[language]) == null ? void 0 : _H.ttf) && /* @__PURE__ */ React11.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("woff", value[language].ttf, language) }, "Build"), /* @__PURE__ */ React11.createElement("label", null, /* @__PURE__ */ React11.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React11.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "woff") })), ((_I = value[language]) == null ? void 0 : _I.woff) && /* @__PURE__ */ React11.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("woff", language) }, "\xD7"))), /* @__PURE__ */ React11.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React11.createElement(Text9, null, "WOFF2:\xA0", !((_L = (_K = (_J = scriptFileInput[language]) == null ? void 0 : _J.woff2) == null ? void 0 : _K.asset) == null ? void 0 : _L._ref) ? ((_M = filenames[language]) == null ? void 0 : _M.woff2) ? /* @__PURE__ */ React11.createElement("b", null, (_N = filenames[language]) == null ? void 0 : _N.woff2) : /* @__PURE__ */ React11.createElement("b", null, "Empty") : /* @__PURE__ */ React11.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_Q = (_P = (_O = scriptFileInput[language]) == null ? void 0 : _O.woff2) == null ? void 0 : _P.asset) == null ? void 0 : _Q._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_R = filenames[language]) == null ? void 0 : _R.woff2) ? /* @__PURE__ */ React11.createElement("b", null, (_S = filenames[language]) == null ? void 0 : _S.woff2) : /* @__PURE__ */ React11.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React11.createElement(Flex7, { gap: 1 }, ((_T = value[language]) == null ? void 0 : _T.ttf) && /* @__PURE__ */ React11.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("woff2", value[language].ttf, language) }, "Build"), /* @__PURE__ */ React11.createElement("label", null, /* @__PURE__ */ React11.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React11.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "woff2") })), ((_U = value[language]) == null ? void 0 : _U.woff2) && /* @__PURE__ */ React11.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("woff2", language) }, "\xD7"))), /* @__PURE__ */ React11.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React11.createElement(Text9, null, "EOT:\xA0", !((_X = (_W = (_V = scriptFileInput[language]) == null ? void 0 : _V.eot) == null ? void 0 : _W.asset) == null ? void 0 : _X._ref) ? ((_Y = filenames[language]) == null ? void 0 : _Y.eot) ? /* @__PURE__ */ React11.createElement("b", null, (_Z = filenames[language]) == null ? void 0 : _Z.eot) : /* @__PURE__ */ React11.createElement("b", null, "Empty") : /* @__PURE__ */ React11.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_aa = (_$ = (__ = scriptFileInput[language]) == null ? void 0 : __.eot) == null ? void 0 : _$.asset) == null ? void 0 : _aa._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_ba = filenames[language]) == null ? void 0 : _ba.eot) ? /* @__PURE__ */ React11.createElement("b", null, (_ca = filenames[language]) == null ? void 0 : _ca.eot) : /* @__PURE__ */ React11.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React11.createElement(Flex7, { gap: 1 }, ((_da = value[language]) == null ? void 0 : _da.ttf) && /* @__PURE__ */ React11.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("eot", value[language].ttf, language) }, "Build"), /* @__PURE__ */ React11.createElement("label", null, /* @__PURE__ */ React11.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React11.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "eot") })), ((_ea = value[language]) == null ? void 0 : _ea.eot) && /* @__PURE__ */ React11.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("eot", language) }, "\xD7"))), /* @__PURE__ */ React11.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React11.createElement(Text9, null, "SVG:\xA0", !((_ha = (_ga = (_fa = scriptFileInput[language]) == null ? void 0 : _fa.svg) == null ? void 0 : _ga.asset) == null ? void 0 : _ha._ref) ? ((_ia = filenames[language]) == null ? void 0 : _ia.svg) ? /* @__PURE__ */ React11.createElement("b", null, (_ja = filenames[language]) == null ? void 0 : _ja.svg) : /* @__PURE__ */ React11.createElement("b", null, "Empty") : /* @__PURE__ */ React11.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_ma = (_la = (_ka = scriptFileInput[language]) == null ? void 0 : _ka.svg) == null ? void 0 : _la.asset) == null ? void 0 : _ma._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_na = filenames[language]) == null ? void 0 : _na.svg) ? /* @__PURE__ */ React11.createElement("b", null, (_oa = filenames[language]) == null ? void 0 : _oa.svg) : /* @__PURE__ */ React11.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React11.createElement(Flex7, { gap: 1 }, ((_pa = value[language]) == null ? void 0 : _pa.ttf) && /* @__PURE__ */ React11.createElement(Button7, { mode: "default", onClick: () => handleGenerateFontFile("svg", value[language].ttf, language) }, "Build"), /* @__PURE__ */ React11.createElement("label", null, /* @__PURE__ */ React11.createElement(Button7, { as: "span", mode: "ghost" }, "Upload"), /* @__PURE__ */ React11.createElement("input", { ref, type: "file", style: { display: "none" }, onChange: async (event) => handleUpload(event, language, "svg") })), ((_qa = value[language]) == null ? void 0 : _qa.svg) && /* @__PURE__ */ React11.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("svg", language) }, "\xD7"))), /* @__PURE__ */ React11.createElement(Flex7, { justify: "space-between", align: "center" }, /* @__PURE__ */ React11.createElement(Text9, null, "CSS:\xA0", !((_ta = (_sa = (_ra = scriptFileInput[language]) == null ? void 0 : _ra.css) == null ? void 0 : _sa.asset) == null ? void 0 : _ta._ref) ? ((_ua = filenames[language]) == null ? void 0 : _ua.css) ? /* @__PURE__ */ React11.createElement("b", null, (_va = filenames[language]) == null ? void 0 : _va.css) : /* @__PURE__ */ React11.createElement("b", null, "Empty") : /* @__PURE__ */ React11.createElement("a", { href: `https://cdn.sanity.io/files/${process.env.SANITY_STUDIO_PROJECT_ID}/${process.env.SANITY_STUDIO_DATASET}/${(_ya = (_xa = (_wa = scriptFileInput[language]) == null ? void 0 : _wa.css) == null ? void 0 : _xa.asset) == null ? void 0 : _ya._ref.replace("file-", "").replace("-", ".")}`, target: "_blank" }, ((_za = filenames[language]) == null ? void 0 : _za.css) ? /* @__PURE__ */ React11.createElement("b", null, (_Aa = filenames[language]) == null ? void 0 : _Aa.css) : /* @__PURE__ */ React11.createElement("b", null, "File"))), status === "ready" && /* @__PURE__ */ React11.createElement(Flex7, { gap: 1 }, ((_Ba = value[language]) == null ? void 0 : _Ba.woff2) && /* @__PURE__ */ React11.createElement(Button7, { mode: "default", onClick: () => handleGenerateCssFile(language) }, "Build"), ((_Ca = value[language]) == null ? void 0 : _Ca.css) && /* @__PURE__ */ React11.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDelete("css", language) }, "\xD7"))), status === "ready" && (((_Da = value[language]) == null ? void 0 : _Da.ttf) || ((_Ea = value[language]) == null ? void 0 : _Ea.otf) || ((_Fa = value[language]) == null ? void 0 : _Fa.woff) || ((_Ga = value[language]) == null ? void 0 : _Ga.woff2)) && /* @__PURE__ */ React11.createElement(Button7, { mode: "ghost", tone: "critical", onClick: () => handleDeleteAll(language), style: { width: "100%" } }, "Delete All")));
   }));
 };
 // src/components/UploadButton.jsx
-import React11, { forwardRef } from "react";
+import React12, { forwardRef } from "react";
 import { Button as Button8, Text as Text10 } from "@sanity/ui";
 var UploadButton = forwardRef(({ handleUpload }, ref) => {
-  return /* @__PURE__ */ React11.createElement(
+  return /* @__PURE__ */ React12.createElement(
     Button8,
     {
       mode: "ghost",
@@ -3475,8 +3475,8 @@ var UploadButton = forwardRef(({ handleUpload }, ref) => {
       padding: 3,
       style: { position: "relative" }
     },
-    /* @__PURE__ */ React11.createElement(Text10, { align: "center" }, "Upload (ttf/otf/woff/woff2/etc...)"),
-    /* @__PURE__ */ React11.createElement(
+    /* @__PURE__ */ React12.createElement(Text10, { align: "center" }, "Upload (ttf/otf/woff/woff2/etc...)"),
+    /* @__PURE__ */ React12.createElement(
       "input",
       {
         ref,
@@ -3500,7 +3500,7 @@ UploadButton.displayName = "UploadButton";
 var UploadButton_default = UploadButton;
 // src/components/KeyValueInput.jsx
-import React12, { useState as useState8, useCallback as useCallback7 } from "react";
+import React13, { useState as useState8, useCallback as useCallback7 } from "react";
 import { Button as Button9, Grid as Grid5, Stack as Stack8, TextInput as TextInput2 } from "@sanity/ui";
 import { AddIcon, ArrowDownIcon, ArrowUpIcon, TrashIcon as TrashIcon3 } from "@sanity/icons";
 import { set as set4 } from "sanity";
@@ -3536,33 +3536,33 @@ function KeyValueInput({ value = [], onChange }) {
     setPairs(updatedPairs);
     onChange(set4(updatedPairs));
   }, [pairs, onChange]);
-  return /* @__PURE__ */ React12.createElement(Stack8, { space: 3 }, pairs.map((pair, index) => /* @__PURE__ */ React12.createElement(Grid5, { className: "manualButtonWrap", columns: [2], key: index, gap: 0, style: { position: "relative" } }, /* @__PURE__ */ React12.createElement("div", { style: { position: "absolute", height: "100%", top: "0", left: "-10px", width: "min-content", transform: "translate(-100%, 0%)" } }, /* @__PURE__ */ React12.createElement("button", { className: "manualButton manualButtonUp", style: { fontSize: "15px", height: "50%" }, onClick: () => handleMoveUp(index) }, /* @__PURE__ */ React12.createElement(ArrowUpIcon, null)), /* @__PURE__ */ React12.createElement("button", { className: "manualButton manualButtonDown", style: { fontSize: "15px", height: "50%" }, onClick: () => handleMoveDown(index) }, /* @__PURE__ */ React12.createElement(ArrowDownIcon, null))), /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React13.createElement(Stack8, { space: 3 }, pairs.map((pair, index) => /* @__PURE__ */ React13.createElement(Grid5, { className: "manualButtonWrap", columns: [2], key: index, gap: 0, style: { position: "relative" } }, /* @__PURE__ */ React13.createElement("div", { style: { position: "absolute", height: "100%", top: "0", left: "-10px", width: "min-content", transform: "translate(-100%, 0%)" } }, /* @__PURE__ */ React13.createElement("button", { className: "manualButton manualButtonUp", style: { fontSize: "15px", height: "50%" }, onClick: () => handleMoveUp(index) }, /* @__PURE__ */ React13.createElement(ArrowUpIcon, null)), /* @__PURE__ */ React13.createElement("button", { className: "manualButton manualButtonDown", style: { fontSize: "15px", height: "50%" }, onClick: () => handleMoveDown(index) }, /* @__PURE__ */ React13.createElement(ArrowDownIcon, null))), /* @__PURE__ */ React13.createElement(
     TextInput2,
     {
       value: pair.key,
       onChange: (e) => handlePairChange(index, "key", e.target.value),
       placeholder: "Key"
     }
-  ), /* @__PURE__ */ React12.createElement("div", { style: { marginLeft: "-1px" } }, /* @__PURE__ */ React12.createElement(
+  ), /* @__PURE__ */ React13.createElement("div", { style: { marginLeft: "-1px" } }, /* @__PURE__ */ React13.createElement(
     TextInput2,
     {
       value: pair.value,
       onChange: (e) => handlePairChange(index, "value", e.target.value),
       placeholder: "Value"
     }
-  )), /* @__PURE__ */ React12.createElement(
+  )), /* @__PURE__ */ React13.createElement(
     "button",
     {
       className: "manualButton",
       onClick: () => handleRemovePair(index),
       style: { position: "absolute", top: "0", right: "-10px", transform: "translate(100%, 0%)" }
     },
-    /* @__PURE__ */ React12.createElement(TrashIcon3, null)
-  ))), /* @__PURE__ */ React12.createElement(Button9, { tone: "primary", onClick: handleAddPair, icon: AddIcon, text: "Add Row" }));
+    /* @__PURE__ */ React13.createElement(TrashIcon3, null)
+  ))), /* @__PURE__ */ React13.createElement(Button9, { tone: "primary", onClick: handleAddPair, icon: AddIcon, text: "Add Row" }));
 }
 // src/components/KeyValueReferenceInput.jsx
-import React13, { useState as useState9, useCallback as useCallback8, useEffect as useEffect6 } from "react";
+import React14, { useState as useState9, useCallback as useCallback8, useEffect as useEffect6 } from "react";
 import { Button as Button10, Stack as Stack9, TextInput as TextInput3, Box as Box4, Card as Card4, Flex as Flex8, Text as Text11, Dialog, Menu as Menu2, MenuButton as MenuButton2, MenuItem as MenuItem2, Autocomplete } from "@sanity/ui";
 import { AddIcon as AddIcon2, ArrowDownIcon as ArrowDownIcon2, ArrowUpIcon as ArrowUpIcon2, TrashIcon as TrashIcon4, SyncIcon, EllipsisHorizontalIcon } from "@sanity/icons";
 import { set as set5, useFormValue as useFormValue8 } from "sanity";
@@ -3673,48 +3673,48 @@ function KeyValueReferenceInput(props) {
   const valueTitle = (valueField == null ? void 0 : valueField.title) || "Value";
   const keyPlaceholder = (keyField == null ? void 0 : keyField.placeholder) || "Enter key";
   const pickerLabel = referenceType || valueTitle.toLowerCase();
-  return /* @__PURE__ */ React13.createElement(Stack9, { space: 3 }, topActions && /* @__PURE__ */ React13.createElement(Box4, { paddingBottom: 2 }, topActions), /* @__PURE__ */ React13.createElement(Box4, null, /* @__PURE__ */ React13.createElement(Stack9, { space: 2 }, pairs.map((pair, index) => {
+  return /* @__PURE__ */ React14.createElement(Stack9, { space: 3 }, topActions && /* @__PURE__ */ React14.createElement(Box4, { paddingBottom: 2 }, topActions), /* @__PURE__ */ React14.createElement(Box4, null, /* @__PURE__ */ React14.createElement(Stack9, { space: 2 }, pairs.map((pair, index) => {
     var _a2;
-    return /* @__PURE__ */ React13.createElement(Box4, { key: index, style: { position: "relative" } }, /* @__PURE__ */ React13.createElement("div", { style: { position: "absolute", height: "100%", top: "0", left: "-5px", width: "min-content", transform: "translate(-100%, 0%)" } }, /* @__PURE__ */ React13.createElement("button", { className: "manualButton manualButtonUp", style: { fontSize: "15px", height: "50%" }, onClick: () => handleMoveUp(index) }, /* @__PURE__ */ React13.createElement(ArrowUpIcon2, null)), /* @__PURE__ */ React13.createElement("button", { className: "manualButton manualButtonDown", style: { fontSize: "15px", height: "50%" }, onClick: () => handleMoveDown(index) }, /* @__PURE__ */ React13.createElement(ArrowDownIcon2, null))), /* @__PURE__ */ React13.createElement(Flex8, { gap: 2, align: "flex-start" }, /* @__PURE__ */ React13.createElement(Box4, { flex: 1 }, /* @__PURE__ */ React13.createElement(
+    return /* @__PURE__ */ React14.createElement(Box4, { key: index, style: { position: "relative" } }, /* @__PURE__ */ React14.createElement("div", { style: { position: "absolute", height: "100%", top: "0", left: "-5px", width: "min-content", transform: "translate(-100%, 0%)" } }, /* @__PURE__ */ React14.createElement("button", { className: "manualButton manualButtonUp", style: { fontSize: "15px", height: "50%" }, onClick: () => handleMoveUp(index) }, /* @__PURE__ */ React14.createElement(ArrowUpIcon2, null)), /* @__PURE__ */ React14.createElement("button", { className: "manualButton manualButtonDown", style: { fontSize: "15px", height: "50%" }, onClick: () => handleMoveDown(index) }, /* @__PURE__ */ React14.createElement(ArrowDownIcon2, null))), /* @__PURE__ */ React14.createElement(Flex8, { gap: 2, align: "flex-start" }, /* @__PURE__ */ React14.createElement(Box4, { flex: 1 }, /* @__PURE__ */ React14.createElement(
       TextInput3,
       {
         value: pair.key,
         onChange: (e) => handlePairChange(index, "key", e.target.value),
         placeholder: keyPlaceholder
       }
-    )), /* @__PURE__ */ React13.createElement(Box4, { flex: 1, style: { minHeight: "100%" } }, ((_a2 = pair.value) == null ? void 0 : _a2._ref) ? /* @__PURE__ */ React13.createElement(Card4, { className: "referenceCard", radius: 2, tone: "primary", style: { paddingLeft: "1rem", height: "fit-content" } }, /* @__PURE__ */ React13.createElement(Flex8, { align: "center", justify: "space-between" }, /* @__PURE__ */ React13.createElement(
+    )), /* @__PURE__ */ React14.createElement(Box4, { flex: 1, style: { minHeight: "100%" } }, ((_a2 = pair.value) == null ? void 0 : _a2._ref) ? /* @__PURE__ */ React14.createElement(Card4, { className: "referenceCard", radius: 2, tone: "primary", style: { paddingLeft: "1rem", height: "fit-content" } }, /* @__PURE__ */ React14.createElement(Flex8, { align: "center", justify: "space-between" }, /* @__PURE__ */ React14.createElement(
       Text11,
       {
         size: 2,
         style: { whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", maxWidth: "90%" }
       },
       referenceData[pair.value._ref] || "Loading..."
-    ), /* @__PURE__ */ React13.createElement(
+    ), /* @__PURE__ */ React14.createElement(
       MenuButton2,
       {
-        button: /* @__PURE__ */ React13.createElement(Button10, { icon: EllipsisHorizontalIcon, mode: "bleed", title: "Options" }),
+        button: /* @__PURE__ */ React14.createElement(Button10, { icon: EllipsisHorizontalIcon, mode: "bleed", title: "Options" }),
         id: `ref-options-${index}`,
-        menu: /* @__PURE__ */ React13.createElement(Menu2, null, /* @__PURE__ */ React13.createElement(MenuItem2, { tone: "critical", icon: TrashIcon4, text: "Remove", onClick: () => handlePairChange(index, "value", null) }), /* @__PURE__ */ React13.createElement(MenuItem2, { icon: SyncIcon, text: "Replace", onClick: () => openReferenceSelector(index) })),
+        menu: /* @__PURE__ */ React14.createElement(Menu2, null, /* @__PURE__ */ React14.createElement(MenuItem2, { tone: "critical", icon: TrashIcon4, text: "Remove", onClick: () => handlePairChange(index, "value", null) }), /* @__PURE__ */ React14.createElement(MenuItem2, { icon: SyncIcon, text: "Replace", onClick: () => openReferenceSelector(index) })),
         popover: { portal: true, tone: "default", placement: "left" }
       }
-    ))) : /* @__PURE__ */ React13.createElement(
+    ))) : /* @__PURE__ */ React14.createElement(
       Box4,
       {
         padding: 2,
         style: { minHeight: "100%", border: "1px dashed #ccc", borderRadius: "4px", display: "flex", alignItems: "center", justifyContent: "center", cursor: "pointer" },
         onClick: () => openReferenceSelector(index)
       },
-      /* @__PURE__ */ React13.createElement(Text11, { muted: true, size: 2 }, "Click to select a ", pickerLabel)
-    ))), /* @__PURE__ */ React13.createElement(
+      /* @__PURE__ */ React14.createElement(Text11, { muted: true, size: 2 }, "Click to select a ", pickerLabel)
+    ))), /* @__PURE__ */ React14.createElement(
       "button",
       {
         className: "manualButton",
         onClick: () => handleRemovePair(index),
         style: { position: "absolute", top: "0", right: "-7px", transform: "translate(100%, 0%)" }
       },
-      /* @__PURE__ */ React13.createElement(TrashIcon4, null)
+      /* @__PURE__ */ React14.createElement(TrashIcon4, null)
     ));
-  }))), /* @__PURE__ */ React13.createElement(Button10, { tone: "primary", mode: "ghost", onClick: handleAddPair, icon: AddIcon2, text: `Add ${keyTitle}` }), isDialogOpen && /* @__PURE__ */ React13.createElement(
+  }))), /* @__PURE__ */ React14.createElement(Button10, { tone: "primary", mode: "ghost", onClick: handleAddPair, icon: AddIcon2, text: `Add ${keyTitle}` }), isDialogOpen && /* @__PURE__ */ React14.createElement(
     Dialog,
     {
       header: `Select a ${pickerLabel}`,
@@ -3722,13 +3722,13 @@ function KeyValueReferenceInput(props) {
       onClose: closeDialog,
       width: 1
     },
-    /* @__PURE__ */ React13.createElement(Box4, { padding: 4 }, /* @__PURE__ */ React13.createElement(
+    /* @__PURE__ */ React14.createElement(Box4, { padding: 4 }, /* @__PURE__ */ React14.createElement(
       Autocomplete,
       {
         id: "reference-autocomplete",
         options: referenceOptions,
         placeholder: `Search ${pickerLabel}s...`,
-        renderOption: (option) => /* @__PURE__ */ React13.createElement(Card4, { key: option.value, padding: 3, radius: 2, tone: "default", style: { cursor: "pointer" } }, /* @__PURE__ */ React13.createElement(Text11, { size: 2 }, option.title)),
+        renderOption: (option) => /* @__PURE__ */ React14.createElement(Card4, { key: option.value, padding: 3, radius: 2, tone: "default", style: { cursor: "pointer" } }, /* @__PURE__ */ React14.createElement(Text11, { size: 2 }, option.title)),
         renderValue: (val) => {
           var _a2;
           return ((_a2 = referenceOptions.find((o) => o.value === val)) == null ? void 0 : _a2.title) || "";
@@ -3745,7 +3745,7 @@ function KeyValueReferenceInput(props) {
 }
 // src/components/VariableInstanceReferencesInput.jsx
-import React14, { useState as useState10, useCallback as useCallback9 } from "react";
+import React15, { useState as useState10, useCallback as useCallback9 } from "react";
 import { Button as Button11, Flex as Flex9, Dialog as Dialog2, Box as Box5, Stack as Stack10, Text as Text12 } from "@sanity/ui";
 import { SyncIcon as SyncIcon2, DocumentTextIcon } from "@sanity/icons";
 import { set as set6, useFormValue as useFormValue9 } from "sanity";
@@ -3842,7 +3842,7 @@ function VariableInstanceReferencesInput(props) {
     setPendingAction(null);
   }, []);
   const showAutofill = !!((formDocument == null ? void 0 : formDocument.variableFont) && (formDocument == null ? void 0 : formDocument.variableInstances));
-  const topActions = showAutofill ? /* @__PURE__ */ React14.createElement(Flex9, { gap: 2 }, /* @__PURE__ */ React14.createElement(
+  const topActions = showAutofill ? /* @__PURE__ */ React15.createElement(Flex9, { gap: 2 }, /* @__PURE__ */ React15.createElement(
     Button11,
     {
       tone: "primary",
@@ -3853,7 +3853,7 @@ function VariableInstanceReferencesInput(props) {
       disabled: isAutofilling,
       loading: isAutofilling
     }
-  ), /* @__PURE__ */ React14.createElement(
+  ), /* @__PURE__ */ React15.createElement(
     Button11,
     {
       tone: "default",
@@ -3865,7 +3865,7 @@ function VariableInstanceReferencesInput(props) {
       loading: isAutofilling
     }
   )) : null;
-  return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(
+  return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(
     KeyValueReferenceInput,
     {
       ...props,
@@ -3873,7 +3873,7 @@ function VariableInstanceReferencesInput(props) {
       fetchReferences,
       topActions
     }
-  ), showConfirmDialog && /* @__PURE__ */ React14.createElement(
+  ), showConfirmDialog && /* @__PURE__ */ React15.createElement(
     Dialog2,
     {
       header: "Existing entries found",
@@ -3881,12 +3881,12 @@ function VariableInstanceReferencesInput(props) {
       onClose: handleConfirmCancel,
       width: 1
     },
-    /* @__PURE__ */ React14.createElement(Box5, { padding: 4 }, /* @__PURE__ */ React14.createElement(Stack10, { space: 4 }, /* @__PURE__ */ React14.createElement(Text12, null, "You already have ", value.length, " ", value.length === 1 ? "entry" : "entries", ". How would you like to proceed?"), /* @__PURE__ */ React14.createElement(Flex9, { gap: 2, justify: "flex-end" }, /* @__PURE__ */ React14.createElement(Button11, { text: "Cancel", mode: "ghost", onClick: handleConfirmCancel }), /* @__PURE__ */ React14.createElement(Button11, { text: "Merge (Add New)", tone: "primary", mode: "ghost", onClick: () => handleConfirmChoice("merge") }), /* @__PURE__ */ React14.createElement(Button11, { text: "Replace All", tone: "critical", onClick: () => handleConfirmChoice("replace") }))))
+    /* @__PURE__ */ React15.createElement(Box5, { padding: 4 }, /* @__PURE__ */ React15.createElement(Stack10, { space: 4 }, /* @__PURE__ */ React15.createElement(Text12, null, "You already have ", value.length, " ", value.length === 1 ? "entry" : "entries", ". How would you like to proceed?"), /* @__PURE__ */ React15.createElement(Flex9, { gap: 2, justify: "flex-end" }, /* @__PURE__ */ React15.createElement(Button11, { text: "Cancel", mode: "ghost", onClick: handleConfirmCancel }), /* @__PURE__ */ React15.createElement(Button11, { text: "Merge (Add New)", tone: "primary", mode: "ghost", onClick: () => handleConfirmChoice("merge") }), /* @__PURE__ */ React15.createElement(Button11, { text: "Replace All", tone: "critical", onClick: () => handleConfirmChoice("replace") }))))
   ));
 }
 // src/components/PrimaryCollectionGeneratorTypeface.jsx
-import React15, { useCallback as useCallback10, useState as useState11 } from "react";
+import React16, { useCallback as useCallback10, useState as useState11 } from "react";
 import { Stack as Stack11, Flex as Flex10, Text as Text13, Button as Button12, Card as Card5, Spinner as Spinner3 } from "@sanity/ui";
 import { useFormValue as useFormValue10 } from "sanity";
 import { nanoid as nanoid10 } from "nanoid";
@@ -3941,7 +3941,7 @@ var PrimaryCollectionGeneratorTypeface = () => {
     setReady(true);
   }, [docId, fonts, price, preferredStyle, styles, title, client]);
   if (!title || !fonts) return null;
-  return /* @__PURE__ */ React15.createElement(Stack11, { space: 2 }, /* @__PURE__ */ React15.createElement(StatusDisplay_default, { status, error: false }), /* @__PURE__ */ React15.createElement(Card5, { border: true, padding: 2, shadow: 1, radius: 2 }, ready ? /* @__PURE__ */ React15.createElement(Stack11, { space: 3 }, /* @__PURE__ */ React15.createElement(Flex10, { align: "center", gap: 2, marginTop: 1, marginBottom: 1 }, /* @__PURE__ */ React15.createElement(Text13, { size: 1, muted: true }, "Price"), /* @__PURE__ */ React15.createElement(Text13, { size: 1, muted: true }, "$"), /* @__PURE__ */ React15.createElement(
+  return /* @__PURE__ */ React16.createElement(Stack11, { space: 2 }, /* @__PURE__ */ React16.createElement(StatusDisplay_default, { status, error: false }), /* @__PURE__ */ React16.createElement(Card5, { border: true, padding: 2, shadow: 1, radius: 2 }, ready ? /* @__PURE__ */ React16.createElement(Stack11, { space: 3 }, /* @__PURE__ */ React16.createElement(Flex10, { align: "center", gap: 2, marginTop: 1, marginBottom: 1 }, /* @__PURE__ */ React16.createElement(Text13, { size: 1, muted: true }, "Price"), /* @__PURE__ */ React16.createElement(Text13, { size: 1, muted: true }, "$"), /* @__PURE__ */ React16.createElement(
     "input",
     {
       value: price,
@@ -3949,7 +3949,7 @@ var PrimaryCollectionGeneratorTypeface = () => {
       type: "number",
       style: { textAlign: "end", padding: "5px", maxWidth: "75px" }
     }
-  ), /* @__PURE__ */ React15.createElement(Text13, { size: 1, muted: true }, "per full family")), /* @__PURE__ */ React15.createElement(
+  ), /* @__PURE__ */ React16.createElement(Text13, { size: 1, muted: true }, "per full family")), /* @__PURE__ */ React16.createElement(
     Button12,
     {
       mode: "ghost",
@@ -3958,7 +3958,81 @@ var PrimaryCollectionGeneratorTypeface = () => {
       onClick: generateCollection,
       text: "Generate Full Family Collection"
     }
-  )) : /* @__PURE__ */ React15.createElement(Flex10, { align: "center", justify: "center", gap: 3, padding: 4 }, /* @__PURE__ */ React15.createElement(Spinner3, null), /* @__PURE__ */ React15.createElement(Text13, { muted: true, size: 1 }, status))));
+  )) : /* @__PURE__ */ React16.createElement(Flex10, { align: "center", justify: "center", gap: 3, padding: 4 }, /* @__PURE__ */ React16.createElement(Spinner3, null), /* @__PURE__ */ React16.createElement(Text13, { muted: true, size: 1 }, status))));
+};
+// src/components/SetOTF.jsx
+import { useState as useState12 } from "react";
+import { set as set7, useFormValue as useFormValue11 } from "sanity";
+import { Stack as Stack12, Button as Button13, Text as Text14 } from "@sanity/ui";
+var SetOTF = (props) => {
+  var _a, _b;
+  const { onChange, value = {} } = props;
+  const client = useSanityClient();
+  const stylesObject = useFormValue11(["styles"]);
+  const [message, setMessage] = useState12("");
+  const detect = async () => {
+    var _a2, _b2, _c;
+    if (!((_a2 = stylesObject == null ? void 0 : stylesObject.fonts) == null ? void 0 : _a2.length)) {
+      setMessage("Error: No fonts found in styles. Please add at least one font first.");
+      setTimeout(() => setMessage(""), 5e3);
+      return;
+    }
+    const fontRef = (_b2 = stylesObject.fonts[0]) == null ? void 0 : _b2._ref;
+    if (!fontRef) {
+      setMessage("Error: Invalid font reference in styles.");
+      setTimeout(() => setMessage(""), 5e3);
+      return;
+    }
+    try {
+      const font = await client.fetch('*[_type == "font" && _id == $id][0]', { id: fontRef });
+      if (!font) {
+        setMessage("Error: Could not find the referenced font.");
+        setTimeout(() => setMessage(""), 5e3);
+        return;
+      }
+      if (!((_c = font.opentypeFeatures) == null ? void 0 : _c.chars)) {
+        setMessage(`Error: No OpenType feature data found in "${font.title || "this font"}". Generate font data first.`);
+        setTimeout(() => setMessage(""), 5e3);
+        return;
+      }
+      const features = [];
+      Object.keys(value).forEach((key) => {
+        var _a3;
+        if (key !== "features" && ((_a3 = value[key]) == null ? void 0 : _a3.feature)) {
+          const requiredFeatures = value[key].feature.split(" ");
+          const approved = requiredFeatures.every((v) => font.opentypeFeatures.chars.includes(v));
+          if (approved) features.push(key);
+        }
+      });
+      onChange(set7({ ...value, features }));
+      setMessage(`Features detected: ${features.length ? features.join(", ") : "none"}.`);
+      setTimeout(() => setMessage(""), 5e3);
+    } catch (err) {
+      setMessage("Error detecting features. Check the console for details.");
+      console.error("SetOTF detect error:", err);
+    }
+  };
+  return /* @__PURE__ */ React.createElement(Stack12, { className: "openType" }, ((_a = value == null ? void 0 : value.features) == null ? void 0 : _a.length) > 0 && /* @__PURE__ */ React.createElement(Text14, { muted: true, size: 1, style: { marginBottom: "0.5rem" } }, "Number of features: ", value.features.length), !!((_b = stylesObject == null ? void 0 : stylesObject.fonts) == null ? void 0 : _b.length) && /* @__PURE__ */ React.createElement(
+    Button13,
+    {
+      text: "Detect OTF",
+      mode: "ghost",
+      onClick: detect,
+      style: { borderRadius: "0 3px 0 0", marginBottom: "1rem" }
+    }
+  ), !!message && /* @__PURE__ */ React.createElement(Text14, { muted: true, size: 1 }, /* @__PURE__ */ React.createElement("br", null), message, /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("br", null)), props.renderDefault(props));
+};
+// src/components/StyleCountInput.jsx
+import React17 from "react";
+import { Text as Text15 } from "@sanity/ui";
+import { useFormValue as useFormValue12 } from "sanity";
+var StyleCountInput = (props) => {
+  const styles = useFormValue12(["styles", "fonts"]) || [];
+  const vfStyles = useFormValue12(["styles", "variableFont"]) || [];
+  const count = styles.length + vfStyles.length;
+  return /* @__PURE__ */ React17.createElement(Text15, { size: 1 }, count);
 };
 // src/utils/getEmptyFontKit.js
@@ -4050,8 +4124,10 @@ export {
   RegenerateSubfamiliesComponent,
   SCRIPTS,
   SCRIPTS_OBJECT,
+  SetOTF,
   SingleUploaderTool,
   StatusDisplay_default as StatusDisplay,
+  StyleCountInput,
   UpdateScriptsComponent,
   UploadButton_default as UploadButton,
   UploadScriptsComponent,

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
 	"name": "@liiift-studio/sanity-font-manager",
-	"version": "2.3.2",
+	"version": "2.3.3",
 	"description": "Sanity Studio plugin — full font management suite with batch upload, format conversion, metadata extraction, CSS generation, collection/pair generation, and script variant support. Supports Sanity v3, v4, and v5.",
 	"license": "MIT",
 	"author": "Liiift Studio",

package/src/components/SetOTF.jsx ADDED Viewed

@@ -0,0 +1,87 @@
+// Detects and sets active OpenType features on a typeface document from the first linked font's metadata
+import { useState } from 'react';
+import { set, useFormValue } from 'sanity';
+import { Stack, Button, Text } from '@sanity/ui';
+import { useSanityClient } from '../hooks/useSanityClient';
+/**
+ * Reads the first linked font's opentypeFeatures data and checks which configured
+ * feature keys are supported. Patches the field with the detected features array.
+ */
+export const SetOTF = (props) => {
+	const { onChange, value = {} } = props;
+	const client = useSanityClient();
+	const stylesObject = useFormValue(['styles']);
+	const [message, setMessage] = useState('');
+	/** Fetches the first font document and matches its OpenType features against the configured keys. */
+	const detect = async () => {
+		if (!stylesObject?.fonts?.length) {
+			setMessage('Error: No fonts found in styles. Please add at least one font first.');
+			setTimeout(() => setMessage(''), 5000);
+			return;
+		}
+		const fontRef = stylesObject.fonts[0]?._ref;
+		if (!fontRef) {
+			setMessage('Error: Invalid font reference in styles.');
+			setTimeout(() => setMessage(''), 5000);
+			return;
+		}
+		try {
+			const font = await client.fetch('*[_type == "font" && _id == $id][0]', { id: fontRef });
+			if (!font) {
+				setMessage('Error: Could not find the referenced font.');
+				setTimeout(() => setMessage(''), 5000);
+				return;
+			}
+			if (!font.opentypeFeatures?.chars) {
+				setMessage(`Error: No OpenType feature data found in "${font.title || 'this font'}". Generate font data first.`);
+				setTimeout(() => setMessage(''), 5000);
+				return;
+			}
+			const features = [];
+			Object.keys(value).forEach(key => {
+				if (key !== 'features' && value[key]?.feature) {
+					const requiredFeatures = value[key].feature.split(' ');
+					const approved = requiredFeatures.every(v => font.opentypeFeatures.chars.includes(v));
+					if (approved) features.push(key);
+				}
+			});
+			onChange(set({ ...value, features }));
+			setMessage(`Features detected: ${features.length ? features.join(', ') : 'none'}.`);
+			setTimeout(() => setMessage(''), 5000);
+		} catch (err) {
+			setMessage('Error detecting features. Check the console for details.');
+			console.error('SetOTF detect error:', err);
+		}
+	};
+	return (
+		<Stack className="openType">
+			{value?.features?.length > 0 && (
+				<Text muted size={1} style={{ marginBottom: '0.5rem' }}>
+					Number of features: {value.features.length}
+				</Text>
+			)}
+			{!!stylesObject?.fonts?.length && (
+				<Button
+					text="Detect OTF"
+					mode="ghost"
+					onClick={detect}
+					style={{ borderRadius: '0 3px 0 0', marginBottom: '1rem' }}
+				/>
+			)}
+			{!!message && (
+				<Text muted size={1}><br />{message}<br /><br /></Text>
+			)}
+			{props.renderDefault(props)}
+		</Stack>
+	);
+};

package/src/components/StyleCountInput.jsx ADDED Viewed

@@ -0,0 +1,16 @@
+// Displays the total count of static and variable font styles linked to a typeface document
+import React from 'react';
+import { Text } from '@sanity/ui';
+import { useFormValue } from 'sanity';
+/** Reads styles.fonts and styles.variableFont arrays and displays the combined count. */
+export const StyleCountInput = (props) => {
+	const styles = useFormValue(['styles', 'fonts']) || [];
+	const vfStyles = useFormValue(['styles', 'variableFont']) || [];
+	const count = styles.length + vfStyles.length;
+	return (
+		<Text size={1}>{count}</Text>
+	);
+};

package/src/index.js CHANGED Viewed

@@ -15,6 +15,8 @@ export { KeyValueInput } from './components/KeyValueInput.jsx';
 export { KeyValueReferenceInput } from './components/KeyValueReferenceInput.jsx';
 export { VariableInstanceReferencesInput } from './components/VariableInstanceReferencesInput.jsx';
 export { PrimaryCollectionGeneratorTypeface } from './components/PrimaryCollectionGeneratorTypeface.jsx';
+export { SetOTF } from './components/SetOTF.jsx';
+export { StyleCountInput } from './components/StyleCountInput.jsx';
 // Hooks
 export { useSanityClient } from './hooks/useSanityClient.js';