gt-sanity 2.1.4 → 3.0.0

package/dist/index.cjs

@@ -1,25 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: !0 });
-var generaltranslation = require("generaltranslation"), internal = require("generaltranslation/internal"), sanity = require("sanity"), router = require("sanity/router"), jsxRuntime = require("react/jsx-runtime"), o = require("react"), icons = require("@sanity/icons"), ui = require("@sanity/ui"), theme$1 = require("@sanity/ui/theme"), mutator = require("@sanity/mutator"), jsonpathPlus = require("jsonpath-plus"), JSONPointer = require("jsonpointer"), blockTools = require("@portabletext/block-tools"), schema = require("@sanity/schema"), toHtml = require("@portabletext/to-html"), merge = require("lodash.merge"), documentInternationalization = require("@sanity/document-internationalization");
+var generaltranslation = require("generaltranslation"), internal = require("generaltranslation/internal"), sanity = require("sanity"), router = require("sanity/router"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), icons = require("@sanity/icons"), ui = require("@sanity/ui"), theme$1 = require("@sanity/ui/theme"), mutator = require("@sanity/mutator"), jsonpathPlus = require("jsonpath-plus"), JSONPointer = require("jsonpointer"), blockTools = require("@portabletext/block-tools"), schema = require("@sanity/schema"), toHtml = require("@portabletext/to-html"), merge = require("lodash.merge"), sanityPluginInternationalizedArray = require("sanity-plugin-internationalized-array"), documentInternationalization = require("@sanity/document-internationalization");
 function _interopDefaultCompat(e) {
   return e && typeof e == "object" && "default" in e ? e : { default: e };
 }
-var o__default = /* @__PURE__ */ _interopDefaultCompat(o), JSONPointer__default = /* @__PURE__ */ _interopDefaultCompat(JSONPointer), merge__default = /* @__PURE__ */ _interopDefaultCompat(merge);
-const useClient = () => sanity.useClient({ apiVersion: "2025-09-15" });
-function useSecrets(id) {
-  const [loading, setLoading] = o.useState(!0), [secrets, setSecrets] = o.useState(null), client = useClient();
-  return o.useEffect(() => {
-    function fetchData() {
-      client.fetch("* [_id == $id][0]", { id }).then((doc) => {
-        const result = {};
-        for (const key in doc)
-          key[0] !== "_" && (result[key] = doc[key]);
-        setSecrets(result), setLoading(!1);
-      });
-    }
-    fetchData();
-  }, [id, client]), { loading, secrets };
-}
+var React__default = /* @__PURE__ */ _interopDefaultCompat(React), JSONPointer__default = /* @__PURE__ */ _interopDefaultCompat(JSONPointer), merge__default = /* @__PURE__ */ _interopDefaultCompat(merge);
 const SECRETS_NAMESPACE = "generaltranslation.secrets", gt = new generaltranslation.GT();
 function overrideConfig(secrets) {
   gt.setConfig({
@@ -44,10 +29,9 @@ class GTConfig {
   additionalBlockDeserializers;
   translationLevel;
   fieldLevelDocuments;
-  fieldLevelTypePrefix;
   static instance;
-  constructor(secretsNamespace, languageField, sourceLocale, locales, singletons, singletonMapping, ignoreFields, dedupeFields, skipFields, translateDocuments, additionalStopTypes = [], additionalSerializers = {}, additionalDeserializers = { types: {} }, additionalBlockDeserializers = [], translationLevel = "document", fieldLevelDocuments = [], fieldLevelTypePrefix = "internationalizedArray") {
-    this.secretsNamespace = secretsNamespace, this.languageField = languageField, this.sourceLocale = sourceLocale, this.locales = locales, this.singletons = singletons, this.singletonMapping = singletonMapping, this.ignoreFields = ignoreFields, this.dedupeFields = dedupeFields, this.skipFields = skipFields, this.translateDocuments = translateDocuments, this.additionalStopTypes = additionalStopTypes, this.additionalSerializers = additionalSerializers, this.additionalDeserializers = additionalDeserializers, this.additionalBlockDeserializers = additionalBlockDeserializers, this.translationLevel = translationLevel, this.fieldLevelDocuments = fieldLevelDocuments, this.fieldLevelTypePrefix = fieldLevelTypePrefix;
+  constructor(secretsNamespace, languageField, sourceLocale, locales, singletons, singletonMapping, ignoreFields, dedupeFields, skipFields, translateDocuments, additionalStopTypes = [], additionalSerializers = {}, additionalDeserializers = { types: {} }, additionalBlockDeserializers = [], translationLevel = "document", fieldLevelDocuments = []) {
+    this.secretsNamespace = secretsNamespace, this.languageField = languageField, this.sourceLocale = sourceLocale, this.locales = locales, this.singletons = singletons, this.singletonMapping = singletonMapping, this.ignoreFields = ignoreFields, this.dedupeFields = dedupeFields, this.skipFields = skipFields, this.translateDocuments = translateDocuments, this.additionalStopTypes = additionalStopTypes, this.additionalSerializers = additionalSerializers, this.additionalDeserializers = additionalDeserializers, this.additionalBlockDeserializers = additionalBlockDeserializers, this.translationLevel = translationLevel, this.fieldLevelDocuments = fieldLevelDocuments;
   }
   static getInstance() {
     return this.instance || (this.instance = new GTConfig(
@@ -67,8 +51,8 @@ class GTConfig {
       []
     )), this.instance;
   }
-  init(secretsNamespace, languageField, sourceLocale, locales, singletons, singletonMapping, ignoreFields, dedupeFields, skipFields, translateDocuments, additionalStopTypes = [], additionalSerializers = {}, additionalDeserializers = { types: {} }, additionalBlockDeserializers = [], translationLevel = "document", fieldLevelDocuments = [], fieldLevelTypePrefix = "internationalizedArray") {
-    this.secretsNamespace = secretsNamespace, this.languageField = languageField, this.sourceLocale = sourceLocale, this.locales = locales, this.singletons = singletons, this.singletonMapping = singletonMapping, this.ignoreFields = ignoreFields, this.dedupeFields = dedupeFields, this.skipFields = skipFields, this.translateDocuments = translateDocuments, this.additionalStopTypes = additionalStopTypes, this.additionalSerializers = additionalSerializers, this.additionalDeserializers = additionalDeserializers, this.additionalBlockDeserializers = additionalBlockDeserializers, this.translationLevel = translationLevel, this.fieldLevelDocuments = fieldLevelDocuments, this.fieldLevelTypePrefix = fieldLevelTypePrefix;
+  init(secretsNamespace, languageField, sourceLocale, locales, singletons, singletonMapping, ignoreFields, dedupeFields, skipFields, translateDocuments, additionalStopTypes = [], additionalSerializers = {}, additionalDeserializers = { types: {} }, additionalBlockDeserializers = [], translationLevel = "document", fieldLevelDocuments = []) {
+    this.secretsNamespace = secretsNamespace, this.languageField = languageField, this.sourceLocale = sourceLocale, this.locales = locales, this.singletons = singletons, this.singletonMapping = singletonMapping, this.ignoreFields = ignoreFields, this.dedupeFields = dedupeFields, this.skipFields = skipFields, this.translateDocuments = translateDocuments, this.additionalStopTypes = additionalStopTypes, this.additionalSerializers = additionalSerializers, this.additionalDeserializers = additionalDeserializers, this.additionalBlockDeserializers = additionalBlockDeserializers, this.translationLevel = translationLevel, this.fieldLevelDocuments = fieldLevelDocuments;
   }
   getSecretsNamespace() {
     return this.secretsNamespace;
@@ -118,11 +102,54 @@ class GTConfig {
   getFieldLevelDocuments() {
     return this.fieldLevelDocuments;
   }
-  getFieldLevelTypePrefix() {
-    return this.fieldLevelTypePrefix;
-  }
 }
-const pluginConfig = GTConfig.getInstance(), theme = theme$1.buildTheme(), BaseTranslationWrapper = ({
+const pluginConfig = GTConfig.getInstance();
+function capitalize(value) {
+  return value.charAt(0).toUpperCase() + value.slice(1);
+}
+function localeDisplayFromProperties(code, properties, mapping) {
+  return typeof mapping == "string" ? { code, name: mapping, emoji: "", verbatim: !0 } : {
+    code,
+    name: capitalize(properties.languageName || properties.name || code),
+    emoji: properties.emoji || "",
+    verbatim: !1
+  };
+}
+function getLocaleDisplay(localeId) {
+  return localeDisplayFromProperties(
+    localeId,
+    gt.getLocaleProperties(localeId),
+    gt.customMapping?.[localeId]
+  );
+}
+function formatLocalePropertiesLabel(code, properties, mapping) {
+  const { emoji, name, verbatim } = localeDisplayFromProperties(
+    code,
+    properties,
+    mapping
+  );
+  return verbatim ? name : [emoji, `${name} (${code})`].filter(Boolean).join(" ");
+}
+const useClient = () => sanity.useClient({ apiVersion: "2025-09-15" });
+function useSecrets(id) {
+  const [loading, setLoading] = React.useState(!0), [secrets, setSecrets] = React.useState(null), client = useClient();
+  return React.useEffect(() => {
+    function fetchData() {
+      client.fetch("* [_id == $id][0]", { id }).then((doc) => {
+        const result = {};
+        for (const key in doc)
+          key[0] !== "_" && (result[key] = doc[key]);
+        setSecrets(result), setLoading(!1);
+      });
+    }
+    fetchData();
+  }, [id, client]), { loading, secrets };
+}
+const gtRadius = [0, 4, 6, 8, 12, 16, 24], baseTheme = theme$1.buildTheme(), theme = {
+  ...baseTheme,
+  radius: gtRadius,
+  v2: baseTheme.v2 && { ...baseTheme.v2, radius: gtRadius }
+}, BaseTranslationWrapper = ({
   children,
   secretsNamespace = pluginConfig.getSecretsNamespace(),
   padding = 4,
@@ -170,12 +197,12 @@ const pluginConfig = GTConfig.getInstance(), theme = theme$1.buildTheme(), BaseT
   const merged = {};
   return ["_rev", "_id", "_type"].forEach((metaKey) => {
     translatedFields[metaKey] && (merged[metaKey] = translatedFields[metaKey]);
-  }), mutator.extractWithPath(`..${baseLang}`, translatedFields).forEach((match2) => {
+  }), mutator.extractWithPath(`..${baseLang}`, translatedFields).forEach((match) => {
     const origVal = mutator.extractWithPath(
-      mutator.arrayToJSONMatchPath(match2.path),
+      mutator.arrayToJSONMatchPath(match.path),
       baseDoc
     )[0].value, translatedVal = mutator.extractWithPath(
-      mutator.arrayToJSONMatchPath(match2.path),
+      mutator.arrayToJSONMatchPath(match.path),
       translatedFields
     )[0].value;
     let valToPatch;
@@ -187,7 +214,7 @@ const pluginConfig = GTConfig.getInstance(), theme = theme$1.buildTheme(), BaseT
       translatedVal
     ));
     const destinationPath = [
-      ...match2.path.slice(0, match2.path.length - 1),
+      ...match.path.slice(0, match.path.length - 1),
       //cut off the "en"
       localeId.replace("-", "_")
       // replace it with our locale
@@ -501,13 +528,9 @@ const documentLevelPatch = async (docInfo, translatedFields, localeId, client, l
       languageField
     );
   }
-}, DEFAULT_TYPE_PREFIX$1 = "internationalizedArray";
-function hasRecognizedTypePrefix(type) {
-  return type.startsWith(DEFAULT_TYPE_PREFIX$1) || type.startsWith(pluginConfig.getFieldLevelTypePrefix());
-}
-const isRecord$4 = (value) => typeof value == "object" && value !== null && !Array.isArray(value);
+}, TYPE_PREFIX = "internationalizedArray", isRecord$4 = (value) => typeof value == "object" && value !== null && !Array.isArray(value);
 function isInternationalizedArrayItem(item) {
-  return isRecord$4(item) && typeof item._type == "string" && hasRecognizedTypePrefix(item._type) && item._type.endsWith("Value") && typeof item.language == "string" && "value" in item;
+  return isRecord$4(item) && typeof item._type == "string" && item._type.startsWith(TYPE_PREFIX) && item._type.endsWith("Value") && typeof item.language == "string" && "value" in item;
 }
 function isInternationalizedArrayField(value) {
   return Array.isArray(value) && value.length > 0 && value.every(isInternationalizedArrayItem);
@@ -709,13 +732,13 @@ const isRecord$3 = (value) => typeof value == "object" && value !== null && !Arr
 }, customDeserializers = { types: {} }, customBlockDeserializers = [
   // handle marks with data-gt-internal
   {
-    deserialize(node2, next2) {
-      if (node2.nodeType !== 1)
+    deserialize(node, next) {
+      if (node.nodeType !== 1)
         return;
-      const el = node2;
+      const el = node;
       if (!el.hasChildNodes() || !el.getAttribute("data-gt-internal"))
         return;
-      const { html, data } = detachGTData(el.outerHTML), block = blockTools.htmlToBlocks(html, blockContentType)[0], children = next2(el.childNodes);
+      const { html, data } = detachGTData(el.outerHTML), block = blockTools.htmlToBlocks(html, blockContentType)[0], children = next(el.childNodes);
       let markDefs = [];
       return "markDefs" in block && (markDefs = block.markDefs ?? []), data?.markDef && markDefs.push(data.markDef), Array.isArray(children) && children.forEach((child) => {
         if (!isRecord$3(child))
@@ -731,26 +754,26 @@ const isRecord$3 = (value) => typeof value == "object" && value !== null && !Arr
   },
   //handle undeclared styles
   {
-    deserialize(node2, next2) {
-      if (node2.nodeType !== 1)
+    deserialize(node, next) {
+      if (node.nodeType !== 1)
         return;
-      const el = node2;
+      const el = node;
       if (!el.hasChildNodes() || el.getAttribute("data-type") !== "unknown-block-style")
         return;
       const style = el.getAttribute("data-style") ?? "";
       return {
         ...blockTools.htmlToBlocks(el.outerHTML, blockContentType)[0],
         style,
-        children: next2(el.childNodes)
+        children: next(el.childNodes)
       };
     }
   },
   //handle list items
   {
-    deserialize(node2, next2) {
-      if (node2.nodeType !== 1)
+    deserialize(node, next) {
+      if (node.nodeType !== 1)
         return;
-      const el = node2;
+      const el = node;
       if (!el.hasChildNodes() || el.tagName.toLowerCase() !== "li")
         return;
       const tagsToStyle = {
@@ -780,7 +803,7 @@ const isRecord$3 = (value) => typeof value == "object" && value !== null && !Arr
         level,
         _key,
         listItem,
-        children: next2(el.childNodes)
+        children: next(el.childNodes)
       };
     }
   }
@@ -914,12 +937,34 @@ const deserializeArray = (arrayHTML, deserializers = customDeserializers, blockD
     return filteredObj;
   };
   return findBaseLang(obj);
-}, fieldFilter = (obj, objFields, stopTypes) => {
+}, isFieldExcludedByOptions = (options) => {
+  if (!isRecord$2(options)) return !1;
+  const exclusionOptions = options;
+  return exclusionOptions.gt?.exclude === !0 || exclusionOptions.documentInternationalization?.exclude === !0 || exclusionOptions.aiAssist?.exclude === !0;
+}, getFieldTypeName = (field) => {
+  const fieldType = field.type;
+  return typeof fieldType == "string" ? fieldType : fieldType?.name;
+}, isTypeExcludedByOptions = (typeName, resolveType) => {
+  if (!resolveType) return !1;
+  const seen = /* @__PURE__ */ new Set();
+  let current = typeName;
+  for (; current && !seen.has(current); ) {
+    seen.add(current);
+    const typeDef = resolveType(current);
+    if (!typeDef) return !1;
+    if (isFieldExcludedByOptions(typeDef.options)) return !0;
+    current = typeof typeDef.type == "string" ? typeDef.type : void 0;
+  }
+  return !1;
+}, isFieldExcludedFromTranslation = (field, resolveType) => {
+  const fieldMetadata = field;
+  return fieldMetadata.localize === !1 || isFieldExcludedByOptions(fieldMetadata.options) || isTypeExcludedByOptions(getFieldTypeName(field), resolveType);
+}, fieldFilter = (obj, objFields, stopTypes, resolveType) => {
   const filteredObj = {
     _type: typeof obj._type == "string" ? obj._type : ""
   }, fieldFilterFunc = (field) => {
-    const fieldMetadata = field, fieldType = typeof fieldMetadata.type == "string" ? fieldMetadata.type : fieldMetadata.type?.name;
-    return fieldMetadata.localize === !1 ? !1 : fieldType === "string" || fieldType === "text" || Array.isArray(obj[field.name]) ? !0 : !!(fieldType && !stopTypes.includes(fieldType));
+    const fieldType = getFieldTypeName(field);
+    return isFieldExcludedFromTranslation(field, resolveType) ? !1 : fieldType === "string" || fieldType === "text" || Array.isArray(obj[field.name]) ? !0 : !!(fieldType && !stopTypes.includes(fieldType));
   };
   return [
     ...META_FIELDS$1,
@@ -928,8 +973,18 @@ const deserializeArray = (arrayHTML, deserializers = customDeserializers, blockD
     obj[field] && (filteredObj[field] = obj[field]);
   }), filteredObj;
 }, META_FIELDS = ["_key", "_type", "_id", "_weak"], isRecord$1 = (value) => typeof value == "object" && value !== null && !Array.isArray(value), BaseDocumentSerializer = (schemas) => {
-  const getSchema = (name) => schemas?._original?.types.find((s) => s.name === name), serializeObject = (obj, stopTypes, serializers) => {
-    if (stopTypes.includes(obj._type))
+  const getSchema = (name) => schemas?._original?.types.find((s) => s.name === name), resolveSchemaFields = (typeName) => {
+    const seen = /* @__PURE__ */ new Set();
+    let current = typeName;
+    for (; current && !seen.has(current); ) {
+      seen.add(current);
+      const typeDef = getSchema(current);
+      if (!typeDef) return;
+      if (typeDef.fields) return typeDef.fields;
+      current = typeof typeDef.type == "string" ? typeDef.type : void 0;
+    }
+  }, serializeObject = (obj, stopTypes, serializers, declaredFields) => {
+    if (stopTypes.includes(obj._type) || isTypeExcludedByOptions(obj._type, getSchema))
       return "";
     const typeSerializers = isRecord$1(serializers.types) ? serializers.types : {};
     if (Object.keys(typeSerializers).includes(obj._type))
@@ -937,36 +992,59 @@ const deserializeArray = (arrayHTML, deserializers = customDeserializers, blockD
     if (obj._type === "span" || obj._type === "block")
       return toHtml.toHTML(obj, { components: serializers });
     let fieldNames = Object.keys(obj).filter((key) => key !== "_type");
-    const schema2 = getSchema(obj._type);
-    schema2 && schema2.fields && (fieldNames = schema2.fields.map((field) => field.name).filter((schemaKey) => Object.keys(obj).includes(schemaKey))), typeof obj == "object" && !obj._type && (obj._type = "");
+    const resolvedFields = resolveSchemaFields(obj._type);
+    if (resolvedFields)
+      fieldNames = resolvedFields.filter((field) => !isFieldExcludedFromTranslation(field, getSchema)).map((field) => field.name).filter((schemaKey) => Object.keys(obj).includes(schemaKey));
+    else if (declaredFields) {
+      const excludedNames = new Set(
+        declaredFields.filter((field) => isFieldExcludedFromTranslation(field, getSchema)).map((field) => field.name)
+      );
+      fieldNames = fieldNames.filter((name) => !excludedNames.has(name));
+    }
+    const knownFields = resolvedFields ?? declaredFields;
+    typeof obj == "object" && !obj._type && (obj._type = "");
     const newSerializationMethods = {}, tempType = `${obj._type}__temp_type__${Math.random().toString(36).substring(7)}`, objToSerialize = { _type: tempType };
-    META_FIELDS.filter((f2) => f2 !== "_type").forEach((field) => {
+    META_FIELDS.filter((f) => f !== "_type").forEach((field) => {
       objToSerialize[field] = obj[field];
     });
     let innerHTML = "";
     if (fieldNames.forEach((fieldName) => {
       let htmlField = "";
       if (!META_FIELDS.includes(fieldName)) {
-        const value = obj[fieldName];
+        const value = obj[fieldName], fieldDef = knownFields?.find(
+          (field) => field.name === fieldName
+        );
         if (typeof value == "string")
           new RegExp(/<("[^"]*"|'[^']*'|[^'">])*>/).test(value) ? htmlField = value : htmlField = `<span class="${fieldName}">${value}</span>`;
         else if (Array.isArray(value))
-          htmlField = serializeArray(value, fieldName, stopTypes, {
-            ...serializers,
-            types: { ...typeSerializers }
-          });
+          htmlField = serializeArray(
+            value,
+            fieldName,
+            stopTypes,
+            {
+              ...serializers,
+              types: { ...typeSerializers }
+            },
+            fieldDef?.of
+          );
         else if (isRecord$1(value)) {
-          const embeddedObject = value, embeddedObjectSchema = getSchema(embeddedObject._type);
+          const embeddedObject = value, embeddedFields = resolveSchemaFields(embeddedObject._type);
           let toTranslate = embeddedObject;
-          embeddedObjectSchema && embeddedObjectSchema.fields && (toTranslate = fieldFilter(
+          embeddedFields && (toTranslate = fieldFilter(
             toTranslate,
-            embeddedObjectSchema.fields,
-            stopTypes
+            embeddedFields,
+            stopTypes,
+            getSchema
           ));
-          const objHTML = serializeObject(toTranslate, stopTypes, {
-            ...serializers,
-            types: { ...typeSerializers }
-          });
+          const objHTML = serializeObject(
+            toTranslate,
+            stopTypes,
+            {
+              ...serializers,
+              types: { ...typeSerializers }
+            },
+            fieldDef?.fields
+          );
           htmlField = `<div class="${fieldName}" data-level="field">${objHTML}</div>`;
         }
         innerHTML += htmlField;
@@ -994,28 +1072,43 @@ const deserializeArray = (arrayHTML, deserializers = customDeserializers, blockD
       );
     }
     return serializedBlock;
-  }, serializeArray = (fieldContent, fieldName, stopTypes, serializers) => {
-    const output = fieldContent.filter(
+  }, serializeArray = (fieldContent, fieldName, stopTypes, serializers, memberDefs) => {
+    const validBlocks = fieldContent.filter(
       (block) => typeof block == "string" || typeof block._type != "string" || !stopTypes.includes(block._type)
-    ).map((block) => {
+    ), declaredMemberFields = (blockType) => {
+      if (!memberDefs?.length) return;
+      const byName = memberDefs.find(
+        (def) => def.name === blockType || def.type === blockType
+      );
+      if (byName?.fields) return byName.fields;
+      if (!blockType && memberDefs.length === 1) return memberDefs[0].fields;
+    }, output = validBlocks.map((block) => {
       if (typeof block == "string")
-        return block;
-      const schema2 = getSchema(
-        typeof block._type == "string" ? block._type : ""
+        return `<span>${block}</span>`;
+      const blockType = typeof block._type == "string" ? block._type : void 0, memberFields = resolveSchemaFields(blockType), filtered = memberFields ? fieldFilter(block, memberFields, stopTypes, getSchema) : block;
+      return serializeObject(
+        filtered,
+        stopTypes,
+        serializers,
+        declaredMemberFields(blockType)
       );
-      return schema2 && schema2.fields ? fieldFilter(block, schema2.fields, stopTypes) : block;
-    }).map((obj) => typeof obj == "string" ? `<span>${obj}</span>` : serializeObject(obj, stopTypes, serializers));
+    });
     return `<div class="${fieldName}" data-type="array">${output.join("")}</div>`;
   };
   return {
     serializeDocument: (doc, translationLevel = "document", baseLang = internal.libraryDefaultLocale, stopTypes = defaultStopTypes, serializers = customSerializers) => {
       const schema2 = getSchema(doc._type);
       let filteredObj = {};
-      translationLevel === "field" ? filteredObj = languageObjectFieldFilter(doc, baseLang) : filteredObj = fieldFilter(doc, schema2?.fields ?? [], stopTypes);
+      translationLevel === "field" ? filteredObj = languageObjectFieldFilter(doc, baseLang) : filteredObj = fieldFilter(
+        doc,
+        schema2?.fields ?? [],
+        stopTypes,
+        getSchema
+      );
       const serializedFields = {};
       for (const key in filteredObj) {
         if (filteredObj.hasOwnProperty(key) === !1) continue;
-        const value = filteredObj[key];
+        const value = filteredObj[key], fieldDef = schema2?.fields?.find((field) => field.name === key);
         if (typeof value == "string")
           serializedFields[key] = value;
         else if (Array.isArray(value))
@@ -1025,13 +1118,15 @@ const deserializeArray = (arrayHTML, deserializers = customDeserializers, blockD
             ),
             key,
             stopTypes,
-            serializers
+            serializers,
+            fieldDef?.of
           );
         else if (value && isRecord$1(value) && !stopTypes.find((stopType) => stopType == value?._type)) {
           const serialized = serializeObject(
             value,
             stopTypes,
-            serializers
+            serializers,
+            fieldDef?.fields
           );
           serializedFields[key] = `<div class="${key}" data-level='field'>${serialized}</div>`;
         }
@@ -1143,7 +1238,7 @@ const documentAdapter = {
   patch: (docInfo, deserialized, localeId, client) => internationalizedArrayPatch(docInfo, deserialized, localeId, client)
 };
 function matchesFieldLevel(type) {
-  return type ? pluginConfig.getFieldLevelDocuments().some((filter2) => filter2.type === type) : !1;
+  return type ? pluginConfig.getFieldLevelDocuments().some((filter) => filter.type === type) : !1;
 }
 function getTranslationStrategyForType(type) {
   const level = pluginConfig.getTranslationLevel();
@@ -1488,7 +1583,7 @@ const getLocales = async (_secrets) => pluginConfig.getLocales().map((locale) =>
   localeId: locale,
   description: gt.getLocaleProperties(locale).name,
   enabled: !0
-})), TranslationsContext = o.createContext(null), getUploadedVersionsStorageKey = (projectId, dataset) => `gt-sanity:uploadedVersions:${projectId ?? ""}:${dataset ?? ""}`;
+})), TranslationsContext = React.createContext(null), getUploadedVersionsStorageKey = (projectId, dataset) => `gt-sanity:uploadedVersions:${projectId ?? ""}:${dataset ?? ""}`;
 function readUploadedVersions(storageKey) {
   try {
     const raw = window.sessionStorage.getItem(storageKey);
@@ -1516,7 +1611,7 @@ function isPlainRecord(value) {
   return typeof value == "object" && value !== null && !Array.isArray(value);
 }
 const useTranslations = () => {
-  const context = o.useContext(TranslationsContext);
+  const context = React.useContext(TranslationsContext);
   if (!context)
     throw new Error("useTranslations must be used within TranslationsProvider");
   return context;
@@ -1524,40 +1619,40 @@ const useTranslations = () => {
   children,
   singleDocument
 }) => {
-  const [isBusy, setIsBusy] = o.useState(!1), [documents, setDocuments] = o.useState([]), [locales, setLocales] = o.useState([]), [autoRefresh, setAutoRefresh] = o.useState(!1), [autoImport, setAutoImport] = o.useState(!1), [autoPatchReferences, setAutoPatchReferences] = o.useState(!1), [autoPublish, setAutoPublish] = o.useState(!1), [loadingDocuments, setLoadingDocuments] = o.useState(!1), [importProgress, setImportProgress] = o.useState({
+  const [isBusy, setIsBusy] = React.useState(!1), [documents, setDocuments] = React.useState([]), [locales, setLocales] = React.useState([]), [autoRefresh, setAutoRefresh] = React.useState(!0), [autoImport, setAutoImport] = React.useState(!1), [autoPatchReferences, setAutoPatchReferences] = React.useState(!1), [autoPublish, setAutoPublish] = React.useState(!1), [loadingDocuments, setLoadingDocuments] = React.useState(!1), [importProgress, setImportProgress] = React.useState({
     current: 0,
     total: 0,
     isImporting: !1
-  }), [importedTranslations, setImportedTranslations] = o.useState(
+  }), [importedTranslations, setImportedTranslations] = React.useState(
     /* @__PURE__ */ new Set()
-  ), [existingTranslations, setExistingTranslations] = o.useState(
+  ), [existingTranslations, setExistingTranslations] = React.useState(
     /* @__PURE__ */ new Set()
-  ), [downloadStatus, setDownloadStatus] = o.useState({
+  ), [downloadStatus, setDownloadStatus] = React.useState({
     downloaded: /* @__PURE__ */ new Set(),
     failed: /* @__PURE__ */ new Set(),
     skipped: /* @__PURE__ */ new Set()
-  }), downloadStatusRef = o.useRef(downloadStatus), [translationStatuses, setTranslationStatuses] = o.useState(/* @__PURE__ */ new Map()), [isRefreshing, setIsRefreshing] = o.useState(!1), client = useClient(), { projectId, dataset } = client.config(), uploadedVersionsStorageKey = getUploadedVersionsStorageKey(
+  }), downloadStatusRef = React.useRef(downloadStatus), [translationStatuses, setTranslationStatuses] = React.useState(/* @__PURE__ */ new Map()), [isRefreshing, setIsRefreshing] = React.useState(!1), client = useClient(), { projectId, dataset } = client.config(), uploadedVersionsStorageKey = getUploadedVersionsStorageKey(
     projectId,
     dataset
-  ), [uploadedVersions, setUploadedVersions] = o.useState(
+  ), [uploadedVersions, setUploadedVersions] = React.useState(
     () => readUploadedVersions(uploadedVersionsStorageKey)
   ), schema2 = sanity.useSchema(), translationContext = { client, schema: schema2 }, toast = ui.useToast(), { loading: loadingSecrets, secrets } = useSecrets(
     pluginConfig.getSecretsNamespace()
-  ), [branchId, setBranchId] = o.useState(void 0);
-  o.useEffect(() => {
+  ), [branchId, setBranchId] = React.useState(void 0);
+  React.useEffect(() => {
     downloadStatusRef.current = downloadStatus;
   }, [downloadStatus]);
-  const getVersionId = o.useCallback(
+  const getVersionId = React.useCallback(
     (document2) => uploadedVersions.get(getDocumentPublishedId(document2)) ?? document2._rev,
     [uploadedVersions]
-  ), fetchDocuments = o.useCallback(async () => {
+  ), fetchDocuments = React.useCallback(async () => {
     setLoadingDocuments(!0);
     try {
       if (singleDocument) {
         setDocuments([singleDocument]);
         return;
       }
-      const filterConditions = pluginConfig.getTranslateDocuments().map((filter2) => filter2.type && filter2.documentId ? `(_type == "${filter2.type}" && _id == "${filter2.documentId}")` : filter2.type ? `_type == "${filter2.type}"` : filter2.documentId ? `_id == "${filter2.documentId}"` : null).filter(Boolean), languageField = pluginConfig.getLanguageField(), sourceLocale = pluginConfig.getSourceLocale(), languageFilter = `(!defined(${languageField}) || ${languageField} == "${sourceLocale}")`;
+      const filterConditions = pluginConfig.getTranslateDocuments().map((filter) => filter.type && filter.documentId ? `(_type == "${filter.type}" && _id == "${filter.documentId}")` : filter.type ? `_type == "${filter.type}"` : filter.documentId ? `_id == "${filter.documentId}"` : null).filter(Boolean), languageField = pluginConfig.getLanguageField(), sourceLocale = pluginConfig.getSourceLocale(), languageFilter = `(!defined(${languageField}) || ${languageField} == "${sourceLocale}")`;
       let query;
       filterConditions.length === 0 ? query = `*[!(_type in ["system.group"]) && !(_id in path("_.**")) && ${languageFilter}]` : query = `*[!(_type in ["system.group"]) && !(_id in path("_.**")) && (${filterConditions.join(" || ")}) && ${languageFilter}]`;
       const docs = await client.fetch(query);
@@ -1571,7 +1666,7 @@ const useTranslations = () => {
     } finally {
       setLoadingDocuments(!1);
     }
-  }, [client, singleDocument]), fetchLocales = o.useCallback(async () => {
+  }, [client, singleDocument]), fetchLocales = React.useCallback(async () => {
     if (secrets)
       try {
         const availableLocales = await getLocales(secrets);
@@ -1583,7 +1678,7 @@ const useTranslations = () => {
           closable: !0
         });
       }
-  }, [secrets]), fetchExistingTranslations = o.useCallback(async () => {
+  }, [secrets]), fetchExistingTranslations = React.useCallback(async () => {
     if (!(!documents.length || !locales.length))
       try {
         const sourceLocale = pluginConfig.getSourceLocale(), availableLocaleIds = locales.filter((locale) => locale.enabled !== !1).map((locale) => locale.localeId), documentIds = documents.map(getDocumentPublishedId), existingMetadata = await client.fetch(`*[
@@ -1615,12 +1710,12 @@ const useTranslations = () => {
           closable: !0
         });
       }
-  }, [documents, locales, client]), handleTranslateAll = o.useCallback(async () => {
+  }, [documents, locales, client]), handleTranslateAll = React.useCallback(async () => {
     if (!(!secrets || documents.length === 0)) {
       setIsBusy(!0);
       try {
         const availableLocaleIds = locales.filter((locale) => locale.enabled !== !1).map((locale) => locale.localeId), transformedDocuments = documents.map((doc) => {
-          const { [pluginConfig.getLanguageField()]: _2, ...cleanDoc } = doc, baseLanguage = pluginConfig.getSourceLocale();
+          const { [pluginConfig.getLanguageField()]: _, ...cleanDoc } = doc, baseLanguage = pluginConfig.getSourceLocale();
           try {
             const serialized = getTranslationStrategy(doc).serialize(
               cleanDoc,
@@ -1665,7 +1760,7 @@ const useTranslations = () => {
     schema2,
     uploadedVersions,
     uploadedVersionsStorageKey
-  ]), handleImportAll = o.useCallback(async () => {
+  ]), handleImportAll = React.useCallback(async () => {
     if (!(!secrets || documents.length === 0 || !branchId)) {
       setIsBusy(!0);
       try {
@@ -1696,14 +1791,14 @@ const useTranslations = () => {
               });
             },
             onImportSuccess: (key) => {
-              setImportedTranslations((prev2) => /* @__PURE__ */ new Set([...prev2, key]));
+              setImportedTranslations((prev) => /* @__PURE__ */ new Set([...prev, key]));
             }
           }
         );
-        result.successfulImports.length > 0 && setDownloadStatus((prev2) => ({
-          ...prev2,
+        result.successfulImports.length > 0 && setDownloadStatus((prev) => ({
+          ...prev,
           downloaded: /* @__PURE__ */ new Set([
-            ...prev2.downloaded,
+            ...prev.downloaded,
             ...result.successfulImports
           ])
         })), toast.push({
@@ -1728,7 +1823,7 @@ const useTranslations = () => {
     downloadStatus,
     translationContext,
     branchId
-  ]), getExistingTranslations = o.useCallback(
+  ]), getExistingTranslations = React.useCallback(
     async (documentIds, localeIds, branchId2) => {
       const sourceLocale = pluginConfig.getSourceLocale(), existingMetadata = await client.fetch(`*[
       _type == 'translation.metadata' &&
@@ -1755,7 +1850,7 @@ const useTranslations = () => {
       }), existing;
     },
     [client]
-  ), handleImportMissing = o.useCallback(async () => {
+  ), handleImportMissing = React.useCallback(async () => {
     if (!(!secrets || documents.length === 0 || !branchId)) {
       setIsBusy(!0);
       try {
@@ -1798,14 +1893,14 @@ const useTranslations = () => {
               });
             },
             onImportSuccess: (key) => {
-              setImportedTranslations((prev2) => /* @__PURE__ */ new Set([...prev2, key])), setExistingTranslations((prev2) => /* @__PURE__ */ new Set([...prev2, key]));
+              setImportedTranslations((prev) => /* @__PURE__ */ new Set([...prev, key])), setExistingTranslations((prev) => /* @__PURE__ */ new Set([...prev, key]));
             }
           }
         );
-        result.successfulImports.length > 0 && setDownloadStatus((prev2) => ({
-          ...prev2,
+        result.successfulImports.length > 0 && setDownloadStatus((prev) => ({
+          ...prev,
           downloaded: /* @__PURE__ */ new Set([
-            ...prev2.downloaded,
+            ...prev.downloaded,
             ...result.successfulImports
           ])
         })), toast.push({
@@ -1832,7 +1927,7 @@ const useTranslations = () => {
     translationContext,
     getExistingTranslations,
     branchId
-  ]), handleGetBranchId = o.useCallback(
+  ]), handleGetBranchId = React.useCallback(
     async (secrets2) => {
       overrideConfig(secrets2);
       const defaultBranch = await gt.createBranch({
@@ -1842,7 +1937,7 @@ const useTranslations = () => {
       setBranchId(defaultBranch.branch.id);
     },
     [secrets]
-  ), handleRefreshAll = o.useCallback(async () => {
+  ), handleRefreshAll = React.useCallback(async () => {
     if (!(!secrets || documents.length === 0 || !branchId)) {
       setIsRefreshing(!0);
       try {
@@ -1895,7 +1990,7 @@ const useTranslations = () => {
             }
           return newStatuses;
         }), toast.push({
-          title: `Refreshed status for ${documents.length} documents`,
+          title: `Refreshed status for ${documents.length} document(s)`,
           status: "success",
           closable: !0
         });
@@ -1909,7 +2004,7 @@ const useTranslations = () => {
         setIsRefreshing(!1);
       }
     }
-  }, [secrets, documents, locales, branchId, getVersionId]), handleImportDocument = o.useCallback(
+  }, [secrets, documents, locales, branchId, getVersionId]), handleImportDocument = React.useCallback(
     async (documentId, versionId, localeId) => {
       if (!secrets) return;
       const key = createTranslationStatusKey(
@@ -1961,12 +2056,12 @@ const useTranslations = () => {
               downloadedFiles[0].data,
               translationContext,
               !1
-            ), setDownloadStatus((prev2) => ({
-              ...prev2,
-              downloaded: /* @__PURE__ */ new Set([...prev2.downloaded, key])
-            })), setImportedTranslations((prev2) => /* @__PURE__ */ new Set([...prev2, key])), setExistingTranslations(
-              (prev2) => /* @__PURE__ */ new Set([
-                ...prev2,
+            ), setDownloadStatus((prev) => ({
+              ...prev,
+              downloaded: /* @__PURE__ */ new Set([...prev.downloaded, key])
+            })), setImportedTranslations((prev) => /* @__PURE__ */ new Set([...prev, key])), setExistingTranslations(
+              (prev) => /* @__PURE__ */ new Set([
+                ...prev,
                 createStableTranslationKey(branchId, documentId, localeId)
               ])
             ), toast.push({
@@ -1996,7 +2091,7 @@ const useTranslations = () => {
       }
     },
     [secrets, documents, translationContext, translationStatuses, branchId]
-  ), handlePatchDocumentReferences = o.useCallback(async () => {
+  ), handlePatchDocumentReferences = React.useCallback(async () => {
     if (!secrets || documents.length === 0) return 0;
     setIsBusy(!0);
     try {
@@ -2070,7 +2165,7 @@ const useTranslations = () => {
     } finally {
       setIsBusy(!1), setImportProgress({ current: 0, total: 0, isImporting: !1 });
     }
-  }, [secrets, documents, locales, client, branchId]), handlePublishAllTranslations = o.useCallback(async () => {
+  }, [secrets, documents, locales, client, branchId]), handlePublishAllTranslations = React.useCallback(async () => {
     if (!secrets || documents.length === 0) return 0;
     setIsBusy(!0);
     try {
@@ -2126,13 +2221,13 @@ const useTranslations = () => {
       setIsBusy(!1);
     }
   }, [secrets, documents, client, branchId]);
-  o.useEffect(() => {
+  React.useEffect(() => {
     fetchDocuments();
-  }, [fetchDocuments]), o.useEffect(() => {
+  }, [fetchDocuments]), React.useEffect(() => {
     secrets && fetchLocales();
-  }, [fetchLocales, secrets]), o.useEffect(() => {
+  }, [fetchLocales, secrets]), React.useEffect(() => {
     documents.length > 0 && locales.length > 0 && fetchExistingTranslations();
-  }, [fetchExistingTranslations]), o.useEffect(() => {
+  }, [fetchExistingTranslations]), React.useEffect(() => {
     documents.length > 0 && locales.length > 0 && secrets && !loadingDocuments && branchId && handleRefreshAll();
   }, [
     documents,
@@ -2141,15 +2236,15 @@ const useTranslations = () => {
     loadingDocuments,
     branchId,
     handleRefreshAll
-  ]), o.useEffect(() => {
+  ]), React.useEffect(() => {
     if (!autoRefresh || documents.length === 0 || !secrets) return;
     const interval = setInterval(async () => {
       await handleRefreshAll();
     }, 1e4);
     return () => clearInterval(interval);
-  }, [autoRefresh, documents.length, secrets, handleRefreshAll]), o.useEffect(() => {
+  }, [autoRefresh, documents.length, secrets, handleRefreshAll]), React.useEffect(() => {
     setImportedTranslations(new Set(downloadStatus.downloaded));
-  }, [downloadStatus.downloaded]), o.useEffect(() => {
+  }, [downloadStatus.downloaded]), React.useEffect(() => {
     secrets && handleGetBranchId(secrets);
   }, [secrets, handleGetBranchId]);
   const contextValue = {
@@ -2189,49 +2284,74 @@ const useTranslations = () => {
   return /* @__PURE__ */ jsxRuntime.jsx(TranslationsContext.Provider, { value: contextValue, children });
 };
 function ProgressBar({ progress }) {
-  return typeof progress > "u" ? (console.warn("No progress prop passed to ProgressBar"), null) : /* @__PURE__ */ jsxRuntime.jsxs(ui.Card, { border: !0, radius: 2, style: { width: "100%", position: "relative" }, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      ui.Flex,
-      {
-        style: {
-          position: "absolute",
-          left: 0,
-          right: 0,
-          top: 0,
-          bottom: 0,
-          zIndex: 1
-        },
-        align: "center",
-        justify: "center",
-        children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Label, { size: 1, children: [
-          progress,
-          "%"
-        ] })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      ui.Card,
-      {
-        style: {
-          width: "100%",
-          transform: `scaleX(${progress / 100})`,
-          transformOrigin: "left",
-          transition: "transform .2s ease",
-          boxSizing: "border-box"
-        },
-        padding: 2,
-        tone: "positive"
-      }
-    )
-  ] });
+  return typeof progress > "u" ? (console.warn("No progress prop passed to ProgressBar"), null) : /* @__PURE__ */ jsxRuntime.jsxs(
+    ui.Card,
+    {
+      radius: 2,
+      overflow: "hidden",
+      style: { width: "100%", position: "relative" },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Card,
+          {
+            tone: "positive",
+            style: {
+              position: "absolute",
+              inset: 0,
+              transform: `scaleX(${progress / 100})`,
+              transformOrigin: "left",
+              transition: "transform .2s ease"
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            style: {
+              position: "absolute",
+              inset: 0,
+              borderRadius: "inherit",
+              boxShadow: "inset 0 0 0 1px var(--card-border-color)",
+              pointerEvents: "none",
+              zIndex: 2
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Flex,
+          {
+            align: "center",
+            justify: "center",
+            padding: 2,
+            style: { position: "relative", zIndex: 1 },
+            children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 1, weight: "medium", children: [
+              progress,
+              "%"
+            ] })
+          }
+        )
+      ]
+    }
+  );
 }
-const LanguageStatus = ({
-  title,
+const LocaleLabel = ({
+  localeId,
+  size = 1,
+  weight = "medium"
+}) => {
+  const { emoji, name, code, verbatim } = getLocaleDisplay(localeId);
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 2, children: [
+    emoji && /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size, "aria-hidden": !0, children: emoji }),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size, weight, children: name }),
+    !verbatim && /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { fontSize: 0, radius: 2, children: code })
+  ] });
+}, LanguageStatus = ({
+  localeId,
   progress,
   importFile,
   isImported = !1
 }) => {
-  const [isBusy, setIsBusy] = o.useState(!1), displayedProgress = isImported && progress < 100 ? 100 : progress, handleImport = o.useCallback(async () => {
+  const [isBusy, setIsBusy] = React.useState(!1), displayedProgress = isImported && progress < 100 ? 100 : progress, handleImport = React.useCallback(async () => {
     setIsBusy(!0);
     try {
       await importFile();
@@ -2239,1180 +2359,33 @@ const LanguageStatus = ({
       setIsBusy(!1);
     }
   }, [importFile, setIsBusy]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { shadow: 1, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Grid, { columns: 5, gap: 3, padding: 3, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { columnStart: 1, columnEnd: 3, align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "bold", size: 1, children: title }) }),
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Grid, { columns: 5, gap: 3, paddingX: 3, paddingY: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { columnStart: 1, columnEnd: 3, align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(LocaleLabel, { localeId }) }),
     typeof displayedProgress == "number" ? /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { columnStart: 3, columnEnd: 5, align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ProgressBar, { progress: displayedProgress }) }) : null,
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { columnStart: 5, columnEnd: 6, children: isImported ? /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", justify: "center", style: { color: "green" }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { columnStart: 5, columnEnd: 6, align: "center", justify: "flex-end", children: isImported ? /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { tone: "positive", fontSize: 0, radius: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 1, children: [
       /* @__PURE__ */ jsxRuntime.jsx(icons.CheckmarkCircleIcon, {}),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, style: { marginLeft: "4px" }, children: "Imported" })
-    ] }) : /* @__PURE__ */ jsxRuntime.jsx(
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { children: "Imported" })
+    ] }) }) : /* @__PURE__ */ jsxRuntime.jsx(
       ui.Button,
       {
         style: { width: "100%" },
         mode: "ghost",
+        fontSize: 1,
+        padding: 2,
         onClick: handleImport,
-        text: isBusy ? "Importing..." : "Import",
-        icon: isBusy ? null : icons.DownloadIcon,
+        text: "Import",
+        loading: isBusy,
+        icon: icons.DownloadIcon,
         disabled: isBusy || !progress || progress < 100
       }
     ) })
-  ] }) });
-};
-var __assign = function() {
-  return __assign = Object.assign || function(t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && (t[p] = s[p]);
-    }
-    return t;
-  }, __assign.apply(this, arguments);
-};
-function __spreadArray(to, from2, pack) {
-  if (pack || arguments.length === 2) for (var i = 0, l = from2.length, ar; i < l; i++)
-    (ar || !(i in from2)) && (ar || (ar = Array.prototype.slice.call(from2, 0, i)), ar[i] = from2[i]);
-  return to.concat(ar || Array.prototype.slice.call(from2));
-}
-function memoize(fn) {
-  var cache = /* @__PURE__ */ Object.create(null);
-  return function(arg) {
-    return cache[arg] === void 0 && (cache[arg] = fn(arg)), cache[arg];
-  };
-}
-var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|disableRemotePlayback|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/, isPropValid = /* @__PURE__ */ memoize(
-  function(prop) {
-    return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91;
-  }
-  /* Z+1 */
-), MS = "-ms-", MOZ = "-moz-", WEBKIT = "-webkit-", COMMENT = "comm", RULESET = "rule", DECLARATION = "decl", IMPORT = "@import", KEYFRAMES = "@keyframes", LAYER = "@layer", abs = Math.abs, from = String.fromCharCode, assign = Object.assign;
-function hash(value, length2) {
-  return charat(value, 0) ^ 45 ? (((length2 << 2 ^ charat(value, 0)) << 2 ^ charat(value, 1)) << 2 ^ charat(value, 2)) << 2 ^ charat(value, 3) : 0;
-}
-function trim(value) {
-  return value.trim();
-}
-function match(value, pattern) {
-  return (value = pattern.exec(value)) ? value[0] : value;
-}
-function replace(value, pattern, replacement) {
-  return value.replace(pattern, replacement);
-}
-function indexof(value, search, position2) {
-  return value.indexOf(search, position2);
-}
-function charat(value, index) {
-  return value.charCodeAt(index) | 0;
-}
-function substr(value, begin, end) {
-  return value.slice(begin, end);
-}
-function strlen(value) {
-  return value.length;
-}
-function sizeof(value) {
-  return value.length;
-}
-function append(value, array) {
-  return array.push(value), value;
-}
-function combine(array, callback) {
-  return array.map(callback).join("");
-}
-function filter(array, pattern) {
-  return array.filter(function(value) {
-    return !match(value, pattern);
-  });
-}
-var line = 1, column = 1, length = 0, position = 0, character = 0, characters = "";
-function node(value, root, parent, type, props, children, length2, siblings) {
-  return { value, root, parent, type, props, children, line, column, length: length2, return: "", siblings };
-}
-function copy(root, props) {
-  return assign(node("", null, null, "", null, null, 0, root.siblings), root, { length: -root.length }, props);
-}
-function lift(root) {
-  for (; root.root; )
-    root = copy(root.root, { children: [root] });
-  append(root, root.siblings);
-}
-function char() {
-  return character;
-}
-function prev() {
-  return character = position > 0 ? charat(characters, --position) : 0, column--, character === 10 && (column = 1, line--), character;
-}
-function next() {
-  return character = position < length ? charat(characters, position++) : 0, column++, character === 10 && (column = 1, line++), character;
-}
-function peek() {
-  return charat(characters, position);
-}
-function caret() {
-  return position;
-}
-function slice(begin, end) {
-  return substr(characters, begin, end);
-}
-function token(type) {
-  switch (type) {
-    // \0 \t \n \r \s whitespace token
-    case 0:
-    case 9:
-    case 10:
-    case 13:
-    case 32:
-      return 5;
-    // ! + , / > @ ~ isolate token
-    case 33:
-    case 43:
-    case 44:
-    case 47:
-    case 62:
-    case 64:
-    case 126:
-    // ; { } breakpoint token
-    case 59:
-    case 123:
-    case 125:
-      return 4;
-    // : accompanied token
-    case 58:
-      return 3;
-    // " ' ( [ opening delimit token
-    case 34:
-    case 39:
-    case 40:
-    case 91:
-      return 2;
-    // ) ] closing delimit token
-    case 41:
-    case 93:
-      return 1;
-  }
-  return 0;
-}
-function alloc(value) {
-  return line = column = 1, length = strlen(characters = value), position = 0, [];
-}
-function dealloc(value) {
-  return characters = "", value;
-}
-function delimit(type) {
-  return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)));
-}
-function whitespace(type) {
-  for (; (character = peek()) && character < 33; )
-    next();
-  return token(type) > 2 || token(character) > 3 ? "" : " ";
-}
-function escaping(index, count) {
-  for (; --count && next() && !(character < 48 || character > 102 || character > 57 && character < 65 || character > 70 && character < 97); )
-    ;
-  return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32));
-}
-function delimiter(type) {
-  for (; next(); )
-    switch (character) {
-      // ] ) " '
-      case type:
-        return position;
-      // " '
-      case 34:
-      case 39:
-        type !== 34 && type !== 39 && delimiter(character);
-        break;
-      // (
-      case 40:
-        type === 41 && delimiter(type);
-        break;
-      // \
-      case 92:
-        next();
-        break;
-    }
-  return position;
-}
-function commenter(type, index) {
-  for (; next() && type + character !== 57; )
-    if (type + character === 84 && peek() === 47)
-      break;
-  return "/*" + slice(index, position - 1) + "*" + from(type === 47 ? type : next());
-}
-function identifier(index) {
-  for (; !token(peek()); )
-    next();
-  return slice(index, position);
-}
-function compile(value) {
-  return dealloc(parse("", null, null, null, [""], value = alloc(value), 0, [0], value));
-}
-function parse(value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
-  for (var index = 0, offset = 0, length2 = pseudo, atrule = 0, property = 0, previous = 0, variable = 1, scanning = 1, ampersand = 1, character2 = 0, type = "", props = rules, children = rulesets, reference = rule, characters2 = type; scanning; )
-    switch (previous = character2, character2 = next()) {
-      // (
-      case 40:
-        if (previous != 108 && charat(characters2, length2 - 1) == 58) {
-          indexof(characters2 += replace(delimit(character2), "&", "&\f"), "&\f", abs(index ? points[index - 1] : 0)) != -1 && (ampersand = -1);
-          break;
-        }
-      // " ' [
-      case 34:
-      case 39:
-      case 91:
-        characters2 += delimit(character2);
-        break;
-      // \t \n \r \s
-      case 9:
-      case 10:
-      case 13:
-      case 32:
-        characters2 += whitespace(previous);
-        break;
-      // \
-      case 92:
-        characters2 += escaping(caret() - 1, 7);
-        continue;
-      // /
-      case 47:
-        switch (peek()) {
-          case 42:
-          case 47:
-            append(comment(commenter(next(), caret()), root, parent, declarations), declarations);
-            break;
-          default:
-            characters2 += "/";
-        }
-        break;
-      // {
-      case 123 * variable:
-        points[index++] = strlen(characters2) * ampersand;
-      // } ; \0
-      case 125 * variable:
-      case 59:
-      case 0:
-        switch (character2) {
-          // \0 }
-          case 0:
-          case 125:
-            scanning = 0;
-          // ;
-          case 59 + offset:
-            ampersand == -1 && (characters2 = replace(characters2, /\f/g, "")), property > 0 && strlen(characters2) - length2 && append(property > 32 ? declaration(characters2 + ";", rule, parent, length2 - 1, declarations) : declaration(replace(characters2, " ", "") + ";", rule, parent, length2 - 2, declarations), declarations);
-            break;
-          // @ ;
-          case 59:
-            characters2 += ";";
-          // { rule/at-rule
-          default:
-            if (append(reference = ruleset(characters2, root, parent, index, offset, rules, points, type, props = [], children = [], length2, rulesets), rulesets), character2 === 123)
-              if (offset === 0)
-                parse(characters2, root, reference, reference, props, rulesets, length2, points, children);
-              else
-                switch (atrule === 99 && charat(characters2, 3) === 110 ? 100 : atrule) {
-                  // d l m s
-                  case 100:
-                  case 108:
-                  case 109:
-                  case 115:
-                    parse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length2, children), children), rules, children, length2, points, rule ? props : children);
-                    break;
-                  default:
-                    parse(characters2, reference, reference, reference, [""], children, 0, points, children);
-                }
-        }
-        index = offset = property = 0, variable = ampersand = 1, type = characters2 = "", length2 = pseudo;
-        break;
-      // :
-      case 58:
-        length2 = 1 + strlen(characters2), property = previous;
-      default:
-        if (variable < 1) {
-          if (character2 == 123)
-            --variable;
-          else if (character2 == 125 && variable++ == 0 && prev() == 125)
-            continue;
-        }
-        switch (characters2 += from(character2), character2 * variable) {
-          // &
-          case 38:
-            ampersand = offset > 0 ? 1 : (characters2 += "\f", -1);
-            break;
-          // ,
-          case 44:
-            points[index++] = (strlen(characters2) - 1) * ampersand, ampersand = 1;
-            break;
-          // @
-          case 64:
-            peek() === 45 && (characters2 += delimit(next())), atrule = peek(), offset = length2 = strlen(type = characters2 += identifier(caret())), character2++;
-            break;
-          // -
-          case 45:
-            previous === 45 && strlen(characters2) == 2 && (variable = 0);
-        }
-    }
-  return rulesets;
-}
-function ruleset(value, root, parent, index, offset, rules, points, type, props, children, length2, siblings) {
-  for (var post = offset - 1, rule = offset === 0 ? rules : [""], size = sizeof(rule), i = 0, j2 = 0, k2 = 0; i < index; ++i)
-    for (var x2 = 0, y2 = substr(value, post + 1, post = abs(j2 = points[i])), z2 = value; x2 < size; ++x2)
-      (z2 = trim(j2 > 0 ? rule[x2] + " " + y2 : replace(y2, /&\f/g, rule[x2]))) && (props[k2++] = z2);
-  return node(value, root, parent, offset === 0 ? RULESET : type, props, children, length2, siblings);
-}
-function comment(value, root, parent, siblings) {
-  return node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0, siblings);
-}
-function declaration(value, root, parent, length2, siblings) {
-  return node(value, root, parent, DECLARATION, substr(value, 0, length2), substr(value, length2 + 1, -1), length2, siblings);
-}
-function prefix(value, length2, children) {
-  switch (hash(value, length2)) {
-    // color-adjust
-    case 5103:
-      return WEBKIT + "print-" + value + value;
-    // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
-    case 5737:
-    case 4201:
-    case 3177:
-    case 3433:
-    case 1641:
-    case 4457:
-    case 2921:
-    // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break
-    case 5572:
-    case 6356:
-    case 5844:
-    case 3191:
-    case 6645:
-    case 3005:
-    // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,
-    case 6391:
-    case 5879:
-    case 5623:
-    case 6135:
-    case 4599:
-    case 4855:
-    // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)
-    case 4215:
-    case 6389:
-    case 5109:
-    case 5365:
-    case 5621:
-    case 3829:
-      return WEBKIT + value + value;
-    // tab-size
-    case 4789:
-      return MOZ + value + value;
-    // appearance, user-select, transform, hyphens, text-size-adjust
-    case 5349:
-    case 4246:
-    case 4810:
-    case 6968:
-    case 2756:
-      return WEBKIT + value + MOZ + value + MS + value + value;
-    // writing-mode
-    case 5936:
-      switch (charat(value, length2 + 11)) {
-        // vertical-l(r)
-        case 114:
-          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, "tb") + value;
-        // vertical-r(l)
-        case 108:
-          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, "tb-rl") + value;
-        // horizontal(-)tb
-        case 45:
-          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, "lr") + value;
-      }
-    // flex, flex-direction, scroll-snap-type, writing-mode
-    case 6828:
-    case 4268:
-    case 2903:
-      return WEBKIT + value + MS + value + value;
-    // order
-    case 6165:
-      return WEBKIT + value + MS + "flex-" + value + value;
-    // align-items
-    case 5187:
-      return WEBKIT + value + replace(value, /(\w+).+(:[^]+)/, WEBKIT + "box-$1$2" + MS + "flex-$1$2") + value;
-    // align-self
-    case 5443:
-      return WEBKIT + value + MS + "flex-item-" + replace(value, /flex-|-self/g, "") + (match(value, /flex-|baseline/) ? "" : MS + "grid-row-" + replace(value, /flex-|-self/g, "")) + value;
-    // align-content
-    case 4675:
-      return WEBKIT + value + MS + "flex-line-pack" + replace(value, /align-content|flex-|-self/g, "") + value;
-    // flex-shrink
-    case 5548:
-      return WEBKIT + value + MS + replace(value, "shrink", "negative") + value;
-    // flex-basis
-    case 5292:
-      return WEBKIT + value + MS + replace(value, "basis", "preferred-size") + value;
-    // flex-grow
-    case 6060:
-      return WEBKIT + "box-" + replace(value, "-grow", "") + WEBKIT + value + MS + replace(value, "grow", "positive") + value;
-    // transition
-    case 4554:
-      return WEBKIT + replace(value, /([^-])(transform)/g, "$1" + WEBKIT + "$2") + value;
-    // cursor
-    case 6187:
-      return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + "$1"), /(image-set)/, WEBKIT + "$1"), value, "") + value;
-    // background, background-image
-    case 5495:
-    case 3959:
-      return replace(value, /(image-set\([^]*)/, WEBKIT + "$1$`$1");
-    // justify-content
-    case 4968:
-      return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + "box-pack:$3" + MS + "flex-pack:$3"), /s.+-b[^;]+/, "justify") + WEBKIT + value + value;
-    // justify-self
-    case 4200:
-      if (!match(value, /flex-|baseline/)) return MS + "grid-column-align" + substr(value, length2) + value;
-      break;
-    // grid-template-(columns|rows)
-    case 2592:
-    case 3360:
-      return MS + replace(value, "template-", "") + value;
-    // grid-(row|column)-start
-    case 4384:
-    case 3616:
-      return children && children.some(function(element, index) {
-        return length2 = index, match(element.props, /grid-\w+-end/);
-      }) ? ~indexof(value + (children = children[length2].value), "span", 0) ? value : MS + replace(value, "-start", "") + value + MS + "grid-row-span:" + (~indexof(children, "span", 0) ? match(children, /\d+/) : +match(children, /\d+/) - +match(value, /\d+/)) + ";" : MS + replace(value, "-start", "") + value;
-    // grid-(row|column)-end
-    case 4896:
-    case 4128:
-      return children && children.some(function(element) {
-        return match(element.props, /grid-\w+-start/);
-      }) ? value : MS + replace(replace(value, "-end", "-span"), "span ", "") + value;
-    // (margin|padding)-inline-(start|end)
-    case 4095:
-    case 3583:
-    case 4068:
-    case 2532:
-      return replace(value, /(.+)-inline(.+)/, WEBKIT + "$1$2") + value;
-    // (min|max)?(width|height|inline-size|block-size)
-    case 8116:
-    case 7059:
-    case 5753:
-    case 5535:
-    case 5445:
-    case 5701:
-    case 4933:
-    case 4677:
-    case 5533:
-    case 5789:
-    case 5021:
-    case 4765:
-      if (strlen(value) - 1 - length2 > 6)
-        switch (charat(value, length2 + 1)) {
-          // (m)ax-content, (m)in-content
-          case 109:
-            if (charat(value, length2 + 4) !== 45)
-              break;
-          // (f)ill-available, (f)it-content
-          case 102:
-            return replace(value, /(.+:)(.+)-([^]+)/, "$1" + WEBKIT + "$2-$3$1" + MOZ + (charat(value, length2 + 3) == 108 ? "$3" : "$2-$3")) + value;
-          // (s)tretch
-          case 115:
-            return ~indexof(value, "stretch", 0) ? prefix(replace(value, "stretch", "fill-available"), length2, children) + value : value;
-        }
-      break;
-    // grid-(column|row)
-    case 5152:
-    case 5920:
-      return replace(value, /(.+?):(\d+)(\s*\/\s*(span)?\s*(\d+))?(.*)/, function(_2, a, b, c, d, e, f2) {
-        return MS + a + ":" + b + f2 + (c ? MS + a + "-span:" + (d ? e : +e - +b) + f2 : "") + value;
-      });
-    // position: sticky
-    case 4949:
-      if (charat(value, length2 + 6) === 121)
-        return replace(value, ":", ":" + WEBKIT) + value;
-      break;
-    // display: (flex|inline-flex|grid|inline-grid)
-    case 6444:
-      switch (charat(value, charat(value, 14) === 45 ? 18 : 11)) {
-        // (inline-)?fle(x)
-        case 120:
-          return replace(value, /(.+:)([^;\s!]+)(;|(\s+)?!.+)?/, "$1" + WEBKIT + (charat(value, 14) === 45 ? "inline-" : "") + "box$3$1" + WEBKIT + "$2$3$1" + MS + "$2box$3") + value;
-        // (inline-)?gri(d)
-        case 100:
-          return replace(value, ":", ":" + MS) + value;
-      }
-      break;
-    // scroll-margin, scroll-margin-(top|right|bottom|left)
-    case 5719:
-    case 2647:
-    case 2135:
-    case 3927:
-    case 2391:
-      return replace(value, "scroll-", "scroll-snap-") + value;
-  }
-  return value;
-}
-function serialize(children, callback) {
-  for (var output = "", i = 0; i < children.length; i++)
-    output += callback(children[i], i, children, callback) || "";
-  return output;
-}
-function stringify(element, index, children, callback) {
-  switch (element.type) {
-    case LAYER:
-      if (element.children.length) break;
-    case IMPORT:
-    case DECLARATION:
-      return element.return = element.return || element.value;
-    case COMMENT:
-      return "";
-    case KEYFRAMES:
-      return element.return = element.value + "{" + serialize(element.children, callback) + "}";
-    case RULESET:
-      if (!strlen(element.value = element.props.join(","))) return "";
-  }
-  return strlen(children = serialize(element.children, callback)) ? element.return = element.value + "{" + children + "}" : "";
-}
-function middleware(collection) {
-  var length2 = sizeof(collection);
-  return function(element, index, children, callback) {
-    for (var output = "", i = 0; i < length2; i++)
-      output += collection[i](element, index, children, callback) || "";
-    return output;
-  };
-}
-function rulesheet(callback) {
-  return function(element) {
-    element.root || (element = element.return) && callback(element);
-  };
-}
-function prefixer(element, index, children, callback) {
-  if (element.length > -1 && !element.return)
-    switch (element.type) {
-      case DECLARATION:
-        element.return = prefix(element.value, element.length, children);
-        return;
-      case KEYFRAMES:
-        return serialize([copy(element, { value: replace(element.value, "@", "@" + WEBKIT) })], callback);
-      case RULESET:
-        if (element.length)
-          return combine(children = element.props, function(value) {
-            switch (match(value, callback = /(::plac\w+|:read-\w+)/)) {
-              // :read-(only|write)
-              case ":read-only":
-              case ":read-write":
-                lift(copy(element, { props: [replace(value, /:(read-\w+)/, ":" + MOZ + "$1")] })), lift(copy(element, { props: [value] })), assign(element, { props: filter(children, callback) });
-                break;
-              // :placeholder
-              case "::placeholder":
-                lift(copy(element, { props: [replace(value, /:(plac\w+)/, ":" + WEBKIT + "input-$1")] })), lift(copy(element, { props: [replace(value, /:(plac\w+)/, ":" + MOZ + "$1")] })), lift(copy(element, { props: [replace(value, /:(plac\w+)/, MS + "input-$1")] })), lift(copy(element, { props: [value] })), assign(element, { props: filter(children, callback) });
-                break;
-            }
-            return "";
-          });
-    }
-}
-var unitlessKeys = {
-  animationIterationCount: 1,
-  aspectRatio: 1,
-  borderImageOutset: 1,
-  borderImageSlice: 1,
-  borderImageWidth: 1,
-  boxFlex: 1,
-  boxFlexGroup: 1,
-  boxOrdinalGroup: 1,
-  columnCount: 1,
-  columns: 1,
-  flex: 1,
-  flexGrow: 1,
-  flexPositive: 1,
-  flexShrink: 1,
-  flexNegative: 1,
-  flexOrder: 1,
-  gridRow: 1,
-  gridRowEnd: 1,
-  gridRowSpan: 1,
-  gridRowStart: 1,
-  gridColumn: 1,
-  gridColumnEnd: 1,
-  gridColumnSpan: 1,
-  gridColumnStart: 1,
-  msGridRow: 1,
-  msGridRowSpan: 1,
-  msGridColumn: 1,
-  msGridColumnSpan: 1,
-  fontWeight: 1,
-  lineHeight: 1,
-  opacity: 1,
-  order: 1,
-  orphans: 1,
-  tabSize: 1,
-  widows: 1,
-  zIndex: 1,
-  zoom: 1,
-  WebkitLineClamp: 1,
-  // SVG-related properties
-  fillOpacity: 1,
-  floodOpacity: 1,
-  stopOpacity: 1,
-  strokeDasharray: 1,
-  strokeDashoffset: 1,
-  strokeMiterlimit: 1,
-  strokeOpacity: 1,
-  strokeWidth: 1
-}, f = typeof process < "u" && process.env !== void 0 && (process.env.REACT_APP_SC_ATTR || process.env.SC_ATTR) || "data-styled", m = "active", y = "data-styled-version", v = "6.1.19", g = `/*!sc*/
-`, S = typeof window < "u" && typeof document < "u", w = !!(typeof SC_DISABLE_SPEEDY == "boolean" ? SC_DISABLE_SPEEDY : typeof process < "u" && process.env !== void 0 && process.env.REACT_APP_SC_DISABLE_SPEEDY !== void 0 && process.env.REACT_APP_SC_DISABLE_SPEEDY !== "" ? process.env.REACT_APP_SC_DISABLE_SPEEDY !== "false" && process.env.REACT_APP_SC_DISABLE_SPEEDY : typeof process < "u" && process.env !== void 0 && process.env.SC_DISABLE_SPEEDY !== void 0 && process.env.SC_DISABLE_SPEEDY !== "" ? process.env.SC_DISABLE_SPEEDY !== "false" && process.env.SC_DISABLE_SPEEDY : process.env.NODE_ENV !== "production"), E = /invalid hook call/i, N = /* @__PURE__ */ new Set(), P = function(t, n) {
-  if (process.env.NODE_ENV !== "production") {
-    var o$1 = n ? ' with the id of "'.concat(n, '"') : "", s = "The component ".concat(t).concat(o$1, ` has been created dynamically.
-`) + `You may see this warning because you've called styled inside another component.
-To resolve this only create new StyledComponents outside of any render method and function component.
-See https://styled-components.com/docs/basics#define-styled-components-outside-of-the-render-method for more info.
-`, i = console.error;
-    try {
-      var a = !0;
-      console.error = function(t2) {
-        for (var n2 = [], o2 = 1; o2 < arguments.length; o2++) n2[o2 - 1] = arguments[o2];
-        E.test(t2) ? (a = !1, N.delete(s)) : i.apply(void 0, __spreadArray([t2], n2, !1));
-      }, o.useRef(), a && !N.has(s) && (console.warn(s), N.add(s));
-    } catch (e) {
-      E.test(e.message) && N.delete(s);
-    } finally {
-      console.error = i;
-    }
-  }
-}, _ = Object.freeze([]), C = Object.freeze({});
-function I(e, t, n) {
-  return n === void 0 && (n = C), e.theme !== n.theme && e.theme || t || n.theme;
-}
-var A = /* @__PURE__ */ new Set(["a", "abbr", "address", "area", "article", "aside", "audio", "b", "base", "bdi", "bdo", "big", "blockquote", "body", "br", "button", "canvas", "caption", "cite", "code", "col", "colgroup", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "footer", "form", "h1", "h2", "h3", "h4", "h5", "h6", "header", "hgroup", "hr", "html", "i", "iframe", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "menu", "menuitem", "meta", "meter", "nav", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "pre", "progress", "q", "rp", "rt", "ruby", "s", "samp", "script", "section", "select", "small", "source", "span", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "textarea", "tfoot", "th", "thead", "time", "tr", "track", "u", "ul", "use", "var", "video", "wbr", "circle", "clipPath", "defs", "ellipse", "foreignObject", "g", "image", "line", "linearGradient", "marker", "mask", "path", "pattern", "polygon", "polyline", "radialGradient", "rect", "stop", "svg", "text", "tspan"]), O = /[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~-]+/g, D = /(^-|-$)/g;
-function R(e) {
-  return e.replace(O, "-").replace(D, "");
-}
-var T = /(a)(d)/gi, k = 52, j = function(e) {
-  return String.fromCharCode(e + (e > 25 ? 39 : 97));
-};
-function x(e) {
-  var t, n = "";
-  for (t = Math.abs(e); t > k; t = t / k | 0) n = j(t % k) + n;
-  return (j(t % k) + n).replace(T, "$1-$2");
-}
-var V, F = 5381, z = function(e, t) {
-  for (var n = t.length; n; ) e = 33 * e ^ t.charCodeAt(--n);
-  return e;
-}, M = function(e) {
-  return z(F, e);
-};
-function $(e) {
-  return x(M(e) >>> 0);
-}
-function B(e) {
-  return process.env.NODE_ENV !== "production" && typeof e == "string" && e || e.displayName || e.name || "Component";
-}
-function G(e) {
-  return typeof e == "string" && (process.env.NODE_ENV === "production" || e.charAt(0) === e.charAt(0).toLowerCase());
-}
-var L = typeof Symbol == "function" && Symbol.for, Y = L ? /* @__PURE__ */ Symbol.for("react.memo") : 60115, q = L ? /* @__PURE__ */ Symbol.for("react.forward_ref") : 60112, W = { childContextTypes: !0, contextType: !0, contextTypes: !0, defaultProps: !0, displayName: !0, getDefaultProps: !0, getDerivedStateFromError: !0, getDerivedStateFromProps: !0, mixins: !0, propTypes: !0, type: !0 }, H = { name: !0, length: !0, prototype: !0, caller: !0, callee: !0, arguments: !0, arity: !0 }, U = { $$typeof: !0, compare: !0, defaultProps: !0, displayName: !0, propTypes: !0, type: !0 }, J = ((V = {})[q] = { $$typeof: !0, render: !0, defaultProps: !0, displayName: !0, propTypes: !0 }, V[Y] = U, V);
-function X(e) {
-  return ("type" in (t = e) && t.type.$$typeof) === Y ? U : "$$typeof" in e ? J[e.$$typeof] : W;
-  var t;
-}
-var Z = Object.defineProperty, K = Object.getOwnPropertyNames, Q = Object.getOwnPropertySymbols, ee = Object.getOwnPropertyDescriptor, te = Object.getPrototypeOf, ne = Object.prototype;
-function oe(e, t, n) {
-  if (typeof t != "string") {
-    if (ne) {
-      var o2 = te(t);
-      o2 && o2 !== ne && oe(e, o2, n);
-    }
-    var r = K(t);
-    Q && (r = r.concat(Q(t)));
-    for (var s = X(e), i = X(t), a = 0; a < r.length; ++a) {
-      var c = r[a];
-      if (!(c in H || n && n[c] || i && c in i || s && c in s)) {
-        var l = ee(t, c);
-        try {
-          Z(e, c, l);
-        } catch {
-        }
-      }
-    }
-  }
-  return e;
-}
-function re(e) {
-  return typeof e == "function";
-}
-function se(e) {
-  return typeof e == "object" && "styledComponentId" in e;
-}
-function ie(e, t) {
-  return e && t ? "".concat(e, " ").concat(t) : e || t || "";
-}
-function ae(e, t) {
-  if (e.length === 0) return "";
-  for (var n = e[0], o2 = 1; o2 < e.length; o2++) n += e[o2];
-  return n;
-}
-function ce(e) {
-  return e !== null && typeof e == "object" && e.constructor.name === Object.name && !("props" in e && e.$$typeof);
-}
-function le(e, t, n) {
-  if (n === void 0 && (n = !1), !n && !ce(e) && !Array.isArray(e)) return t;
-  if (Array.isArray(t)) for (var o2 = 0; o2 < t.length; o2++) e[o2] = le(e[o2], t[o2]);
-  else if (ce(t)) for (var o2 in t) e[o2] = le(e[o2], t[o2]);
-  return e;
-}
-function ue(e, t) {
-  Object.defineProperty(e, "toString", { value: t });
-}
-var pe = process.env.NODE_ENV !== "production" ? { 1: `Cannot create styled-component for component: %s.
-
-`, 2: `Can't collect styles once you've consumed a \`ServerStyleSheet\`'s styles! \`ServerStyleSheet\` is a one off instance for each server-side render cycle.
-
-- Are you trying to reuse it across renders?
-- Are you accidentally calling collectStyles twice?
-
-`, 3: `Streaming SSR is only supported in a Node.js environment; Please do not try to call this method in the browser.
-
-`, 4: `The \`StyleSheetManager\` expects a valid target or sheet prop!
-
-- Does this error occur on the client and is your target falsy?
-- Does this error occur on the server and is the sheet falsy?
-
-`, 5: `The clone method cannot be used on the client!
-
-- Are you running in a client-like environment on the server?
-- Are you trying to run SSR on the client?
-
-`, 6: `Trying to insert a new style tag, but the given Node is unmounted!
-
-- Are you using a custom target that isn't mounted?
-- Does your document not have a valid head element?
-- Have you accidentally removed a style tag manually?
-
-`, 7: 'ThemeProvider: Please return an object from your "theme" prop function, e.g.\n\n```js\ntheme={() => ({})}\n```\n\n', 8: `ThemeProvider: Please make your "theme" prop an object.
-
-`, 9: "Missing document `<head>`\n\n", 10: `Cannot find a StyleSheet instance. Usually this happens if there are multiple copies of styled-components loaded at once. Check out this issue for how to troubleshoot and fix the common cases where this situation can happen: https://github.com/styled-components/styled-components/issues/1941#issuecomment-417862021
-
-`, 11: `_This error was replaced with a dev-time warning, it will be deleted for v4 final._ [createGlobalStyle] received children which will not be rendered. Please use the component without passing children elements.
-
-`, 12: "It seems you are interpolating a keyframe declaration (%s) into an untagged string. This was supported in styled-components v3, but is not longer supported in v4 as keyframes are now injected on-demand. Please wrap your string in the css\\`\\` helper which ensures the styles are injected correctly. See https://www.styled-components.com/docs/api#css\n\n", 13: `%s is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.
-
-`, 14: `ThemeProvider: "theme" prop is required.
-
-`, 15: "A stylis plugin has been supplied that is not named. We need a name for each plugin to be able to prevent styling collisions between different stylis configurations within the same app. Before you pass your plugin to `<StyleSheetManager stylisPlugins={[]}>`, please make sure each plugin is uniquely-named, e.g.\n\n```js\nObject.defineProperty(importedPlugin, 'name', { value: 'some-unique-name' });\n```\n\n", 16: `Reached the limit of how many styled components may be created at group %s.
-You may only create up to 1,073,741,824 components. If you're creating components dynamically,
-as for instance in your render method then you may be running into this limitation.
-
-`, 17: `CSSStyleSheet could not be found on HTMLStyleElement.
-Has styled-components' style tag been unmounted or altered by another script?
-`, 18: "ThemeProvider: Please make sure your useTheme hook is within a `<ThemeProvider>`" } : {};
-function de() {
-  for (var e = [], t = 0; t < arguments.length; t++) e[t] = arguments[t];
-  for (var n = e[0], o2 = [], r = 1, s = e.length; r < s; r += 1) o2.push(e[r]);
-  return o2.forEach(function(e2) {
-    n = n.replace(/%[a-z]/, e2);
-  }), n;
-}
-function he(t) {
-  for (var n = [], o2 = 1; o2 < arguments.length; o2++) n[o2 - 1] = arguments[o2];
-  return process.env.NODE_ENV === "production" ? new Error("An error occurred. See https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/utils/errors.md#".concat(t, " for more information.").concat(n.length > 0 ? " Args: ".concat(n.join(", ")) : "")) : new Error(de.apply(void 0, __spreadArray([pe[t]], n, !1)).trim());
-}
-var fe = (function() {
-  function e(e2) {
-    this.groupSizes = new Uint32Array(512), this.length = 512, this.tag = e2;
-  }
-  return e.prototype.indexOfGroup = function(e2) {
-    for (var t = 0, n = 0; n < e2; n++) t += this.groupSizes[n];
-    return t;
-  }, e.prototype.insertRules = function(e2, t) {
-    if (e2 >= this.groupSizes.length) {
-      for (var n = this.groupSizes, o2 = n.length, r = o2; e2 >= r; ) if ((r <<= 1) < 0) throw he(16, "".concat(e2));
-      this.groupSizes = new Uint32Array(r), this.groupSizes.set(n), this.length = r;
-      for (var s = o2; s < r; s++) this.groupSizes[s] = 0;
-    }
-    for (var i = this.indexOfGroup(e2 + 1), a = (s = 0, t.length); s < a; s++) this.tag.insertRule(i, t[s]) && (this.groupSizes[e2]++, i++);
-  }, e.prototype.clearGroup = function(e2) {
-    if (e2 < this.length) {
-      var t = this.groupSizes[e2], n = this.indexOfGroup(e2), o2 = n + t;
-      this.groupSizes[e2] = 0;
-      for (var r = n; r < o2; r++) this.tag.deleteRule(n);
-    }
-  }, e.prototype.getGroup = function(e2) {
-    var t = "";
-    if (e2 >= this.length || this.groupSizes[e2] === 0) return t;
-    for (var n = this.groupSizes[e2], o2 = this.indexOfGroup(e2), r = o2 + n, s = o2; s < r; s++) t += "".concat(this.tag.getRule(s)).concat(g);
-    return t;
-  }, e;
-})(), me = 1 << 30, ye = /* @__PURE__ */ new Map(), ve = /* @__PURE__ */ new Map(), ge = 1, Se = function(e) {
-  if (ye.has(e)) return ye.get(e);
-  for (; ve.has(ge); ) ge++;
-  var t = ge++;
-  if (process.env.NODE_ENV !== "production" && ((0 | t) < 0 || t > me)) throw he(16, "".concat(t));
-  return ye.set(e, t), ve.set(t, e), t;
-}, we = function(e, t) {
-  ge = t + 1, ye.set(e, t), ve.set(t, e);
-}, be = "style[".concat(f, "][").concat(y, '="').concat(v, '"]'), Ee = new RegExp("^".concat(f, '\\.g(\\d+)\\[id="([\\w\\d-]+)"\\].*?"([^"]*)')), Ne = function(e, t, n) {
-  for (var o2, r = n.split(","), s = 0, i = r.length; s < i; s++) (o2 = r[s]) && e.registerName(t, o2);
-}, Pe = function(e, t) {
-  for (var n, o2 = ((n = t.textContent) !== null && n !== void 0 ? n : "").split(g), r = [], s = 0, i = o2.length; s < i; s++) {
-    var a = o2[s].trim();
-    if (a) {
-      var c = a.match(Ee);
-      if (c) {
-        var l = 0 | parseInt(c[1], 10), u = c[2];
-        l !== 0 && (we(u, l), Ne(e, u, c[3]), e.getTag().insertRules(l, r)), r.length = 0;
-      } else r.push(a);
-    }
-  }
-}, _e = function(e) {
-  for (var t = document.querySelectorAll(be), n = 0, o2 = t.length; n < o2; n++) {
-    var r = t[n];
-    r && r.getAttribute(f) !== m && (Pe(e, r), r.parentNode && r.parentNode.removeChild(r));
-  }
-};
-function Ce() {
-  return typeof __webpack_nonce__ < "u" ? __webpack_nonce__ : null;
-}
-var Ie = function(e) {
-  var t = document.head, n = e || t, o2 = document.createElement("style"), r = (function(e2) {
-    var t2 = Array.from(e2.querySelectorAll("style[".concat(f, "]")));
-    return t2[t2.length - 1];
-  })(n), s = r !== void 0 ? r.nextSibling : null;
-  o2.setAttribute(f, m), o2.setAttribute(y, v);
-  var i = Ce();
-  return i && o2.setAttribute("nonce", i), n.insertBefore(o2, s), o2;
-}, Ae = (function() {
-  function e(e2) {
-    this.element = Ie(e2), this.element.appendChild(document.createTextNode("")), this.sheet = (function(e3) {
-      if (e3.sheet) return e3.sheet;
-      for (var t = document.styleSheets, n = 0, o2 = t.length; n < o2; n++) {
-        var r = t[n];
-        if (r.ownerNode === e3) return r;
-      }
-      throw he(17);
-    })(this.element), this.length = 0;
-  }
-  return e.prototype.insertRule = function(e2, t) {
-    try {
-      return this.sheet.insertRule(t, e2), this.length++, !0;
-    } catch {
-      return !1;
-    }
-  }, e.prototype.deleteRule = function(e2) {
-    this.sheet.deleteRule(e2), this.length--;
-  }, e.prototype.getRule = function(e2) {
-    var t = this.sheet.cssRules[e2];
-    return t && t.cssText ? t.cssText : "";
-  }, e;
-})(), Oe = (function() {
-  function e(e2) {
-    this.element = Ie(e2), this.nodes = this.element.childNodes, this.length = 0;
-  }
-  return e.prototype.insertRule = function(e2, t) {
-    if (e2 <= this.length && e2 >= 0) {
-      var n = document.createTextNode(t);
-      return this.element.insertBefore(n, this.nodes[e2] || null), this.length++, !0;
-    }
-    return !1;
-  }, e.prototype.deleteRule = function(e2) {
-    this.element.removeChild(this.nodes[e2]), this.length--;
-  }, e.prototype.getRule = function(e2) {
-    return e2 < this.length ? this.nodes[e2].textContent : "";
-  }, e;
-})(), De = (function() {
-  function e(e2) {
-    this.rules = [], this.length = 0;
-  }
-  return e.prototype.insertRule = function(e2, t) {
-    return e2 <= this.length && (this.rules.splice(e2, 0, t), this.length++, !0);
-  }, e.prototype.deleteRule = function(e2) {
-    this.rules.splice(e2, 1), this.length--;
-  }, e.prototype.getRule = function(e2) {
-    return e2 < this.length ? this.rules[e2] : "";
-  }, e;
-})(), Re = S, Te = { isServer: !S, useCSSOMInjection: !w }, ke = (function() {
-  function e(e2, n, o2) {
-    e2 === void 0 && (e2 = C), n === void 0 && (n = {});
-    var r = this;
-    this.options = __assign(__assign({}, Te), e2), this.gs = n, this.names = new Map(o2), this.server = !!e2.isServer, !this.server && S && Re && (Re = !1, _e(this)), ue(this, function() {
-      return (function(e3) {
-        for (var t = e3.getTag(), n2 = t.length, o3 = "", r2 = function(n3) {
-          var r3 = (function(e4) {
-            return ve.get(e4);
-          })(n3);
-          if (r3 === void 0) return "continue";
-          var s2 = e3.names.get(r3), i = t.getGroup(n3);
-          if (s2 === void 0 || !s2.size || i.length === 0) return "continue";
-          var a = "".concat(f, ".g").concat(n3, '[id="').concat(r3, '"]'), c = "";
-          s2 !== void 0 && s2.forEach(function(e4) {
-            e4.length > 0 && (c += "".concat(e4, ","));
-          }), o3 += "".concat(i).concat(a, '{content:"').concat(c, '"}').concat(g);
-        }, s = 0; s < n2; s++) r2(s);
-        return o3;
-      })(r);
-    });
-  }
-  return e.registerId = function(e2) {
-    return Se(e2);
-  }, e.prototype.rehydrate = function() {
-    !this.server && S && _e(this);
-  }, e.prototype.reconstructWithOptions = function(n, o2) {
-    return o2 === void 0 && (o2 = !0), new e(__assign(__assign({}, this.options), n), this.gs, o2 && this.names || void 0);
-  }, e.prototype.allocateGSInstance = function(e2) {
-    return this.gs[e2] = (this.gs[e2] || 0) + 1;
-  }, e.prototype.getTag = function() {
-    return this.tag || (this.tag = (e2 = (function(e3) {
-      var t = e3.useCSSOMInjection, n = e3.target;
-      return e3.isServer ? new De(n) : t ? new Ae(n) : new Oe(n);
-    })(this.options), new fe(e2)));
-    var e2;
-  }, e.prototype.hasNameForId = function(e2, t) {
-    return this.names.has(e2) && this.names.get(e2).has(t);
-  }, e.prototype.registerName = function(e2, t) {
-    if (Se(e2), this.names.has(e2)) this.names.get(e2).add(t);
-    else {
-      var n = /* @__PURE__ */ new Set();
-      n.add(t), this.names.set(e2, n);
-    }
-  }, e.prototype.insertRules = function(e2, t, n) {
-    this.registerName(e2, t), this.getTag().insertRules(Se(e2), n);
-  }, e.prototype.clearNames = function(e2) {
-    this.names.has(e2) && this.names.get(e2).clear();
-  }, e.prototype.clearRules = function(e2) {
-    this.getTag().clearGroup(Se(e2)), this.clearNames(e2);
-  }, e.prototype.clearTag = function() {
-    this.tag = void 0;
-  }, e;
-})(), je = /&/g, xe = /^\s*\/\/.*$/gm;
-function Ve(e, t) {
-  return e.map(function(e2) {
-    return e2.type === "rule" && (e2.value = "".concat(t, " ").concat(e2.value), e2.value = e2.value.replaceAll(",", ",".concat(t, " ")), e2.props = e2.props.map(function(e3) {
-      return "".concat(t, " ").concat(e3);
-    })), Array.isArray(e2.children) && e2.type !== "@keyframes" && (e2.children = Ve(e2.children, t)), e2;
-  });
-}
-function Fe(e) {
-  var t, n, o2, r = C, s = r.options, i = s === void 0 ? C : s, a = r.plugins, c = a === void 0 ? _ : a, l = function(e2, o3, r2) {
-    return r2.startsWith(n) && r2.endsWith(n) && r2.replaceAll(n, "").length > 0 ? ".".concat(t) : e2;
-  }, u = c.slice();
-  u.push(function(e2) {
-    e2.type === RULESET && e2.value.includes("&") && (e2.props[0] = e2.props[0].replace(je, n).replace(o2, l));
-  }), i.prefix && u.push(prefixer), u.push(stringify);
-  var p = function(e2, r2, s2, a2) {
-    r2 === void 0 && (r2 = ""), s2 === void 0 && (s2 = ""), a2 === void 0 && (a2 = "&"), t = a2, n = r2, o2 = new RegExp("\\".concat(n, "\\b"), "g");
-    var c2 = e2.replace(xe, ""), l2 = compile(s2 || r2 ? "".concat(s2, " ").concat(r2, " { ").concat(c2, " }") : c2);
-    i.namespace && (l2 = Ve(l2, i.namespace));
-    var p2 = [];
-    return serialize(l2, middleware(u.concat(rulesheet(function(e3) {
-      return p2.push(e3);
-    })))), p2;
-  };
-  return p.hash = c.length ? c.reduce(function(e2, t2) {
-    return t2.name || he(15), z(e2, t2.name);
-  }, F).toString() : "", p;
-}
-var ze = new ke(), Me = Fe(), $e = o__default.default.createContext({ shouldForwardProp: void 0, styleSheet: ze, stylis: Me });
-o__default.default.createContext(void 0);
-function Le() {
-  return o.useContext($e);
-}
-var qe = (function() {
-  function e(e2, t) {
-    var n = this;
-    this.inject = function(e3, t2) {
-      t2 === void 0 && (t2 = Me);
-      var o2 = n.name + t2.hash;
-      e3.hasNameForId(n.id, o2) || e3.insertRules(n.id, o2, t2(n.rules, o2, "@keyframes"));
-    }, this.name = e2, this.id = "sc-keyframes-".concat(e2), this.rules = t, ue(this, function() {
-      throw he(12, String(n.name));
-    });
-  }
-  return e.prototype.getName = function(e2) {
-    return e2 === void 0 && (e2 = Me), this.name + e2.hash;
-  }, e;
-})(), We = function(e) {
-  return e >= "A" && e <= "Z";
-};
-function He(e) {
-  for (var t = "", n = 0; n < e.length; n++) {
-    var o2 = e[n];
-    if (n === 1 && o2 === "-" && e[0] === "-") return e;
-    We(o2) ? t += "-" + o2.toLowerCase() : t += o2;
-  }
-  return t.startsWith("ms-") ? "-" + t : t;
-}
-var Ue = function(e) {
-  return e == null || e === !1 || e === "";
-}, Je = function(t) {
-  var n, o2, r = [];
-  for (var s in t) {
-    var i = t[s];
-    t.hasOwnProperty(s) && !Ue(i) && (Array.isArray(i) && i.isCss || re(i) ? r.push("".concat(He(s), ":"), i, ";") : ce(i) ? r.push.apply(r, __spreadArray(__spreadArray(["".concat(s, " {")], Je(i), !1), ["}"], !1)) : r.push("".concat(He(s), ": ").concat((n = s, (o2 = i) == null || typeof o2 == "boolean" || o2 === "" ? "" : typeof o2 != "number" || o2 === 0 || n in unitlessKeys || n.startsWith("--") ? String(o2).trim() : "".concat(o2, "px")), ";")));
-  }
-  return r;
-};
-function Xe(e, t, n, o2) {
-  if (Ue(e)) return [];
-  if (se(e)) return [".".concat(e.styledComponentId)];
-  if (re(e)) {
-    if (!re(s = e) || s.prototype && s.prototype.isReactComponent || !t) return [e];
-    var r = e(t);
-    return process.env.NODE_ENV === "production" || typeof r != "object" || Array.isArray(r) || r instanceof qe || ce(r) || r === null || console.error("".concat(B(e), " is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.")), Xe(r, t, n, o2);
-  }
-  var s;
-  return e instanceof qe ? n ? (e.inject(n, o2), [e.getName(o2)]) : [e] : ce(e) ? Je(e) : Array.isArray(e) ? Array.prototype.concat.apply(_, e.map(function(e2) {
-    return Xe(e2, t, n, o2);
-  })) : [e.toString()];
-}
-function Ze(e) {
-  for (var t = 0; t < e.length; t += 1) {
-    var n = e[t];
-    if (re(n) && !se(n)) return !1;
-  }
-  return !0;
-}
-var Ke = M(v), Qe = (function() {
-  function e(e2, t, n) {
-    this.rules = e2, this.staticRulesId = "", this.isStatic = process.env.NODE_ENV === "production" && (n === void 0 || n.isStatic) && Ze(e2), this.componentId = t, this.baseHash = z(Ke, t), this.baseStyle = n, ke.registerId(t);
-  }
-  return e.prototype.generateAndInjectStyles = function(e2, t, n) {
-    var o2 = this.baseStyle ? this.baseStyle.generateAndInjectStyles(e2, t, n) : "";
-    if (this.isStatic && !n.hash) if (this.staticRulesId && t.hasNameForId(this.componentId, this.staticRulesId)) o2 = ie(o2, this.staticRulesId);
-    else {
-      var r = ae(Xe(this.rules, e2, t, n)), s = x(z(this.baseHash, r) >>> 0);
-      if (!t.hasNameForId(this.componentId, s)) {
-        var i = n(r, ".".concat(s), void 0, this.componentId);
-        t.insertRules(this.componentId, s, i);
-      }
-      o2 = ie(o2, s), this.staticRulesId = s;
-    }
-    else {
-      for (var a = z(this.baseHash, n.hash), c = "", l = 0; l < this.rules.length; l++) {
-        var u = this.rules[l];
-        if (typeof u == "string") c += u, process.env.NODE_ENV !== "production" && (a = z(a, u));
-        else if (u) {
-          var p = ae(Xe(u, e2, t, n));
-          a = z(a, p + l), c += p;
-        }
-      }
-      if (c) {
-        var d = x(a >>> 0);
-        t.hasNameForId(this.componentId, d) || t.insertRules(this.componentId, d, n(c, ".".concat(d), void 0, this.componentId)), o2 = ie(o2, d);
-      }
-    }
-    return o2;
-  }, e;
-})(), et = o__default.default.createContext(void 0), rt = {}, st = /* @__PURE__ */ new Set();
-function it(e, r, s) {
-  var i = se(e), a = e, c = !G(e), p = r.attrs, d = p === void 0 ? _ : p, h = r.componentId, f2 = h === void 0 ? (function(e2, t) {
-    var n = typeof e2 != "string" ? "sc" : R(e2);
-    rt[n] = (rt[n] || 0) + 1;
-    var o2 = "".concat(n, "-").concat($(v + n + rt[n]));
-    return t ? "".concat(t, "-").concat(o2) : o2;
-  })(r.displayName, r.parentComponentId) : h, m2 = r.displayName, y2 = m2 === void 0 ? (function(e2) {
-    return G(e2) ? "styled.".concat(e2) : "Styled(".concat(B(e2), ")");
-  })(e) : m2, g2 = r.displayName && r.componentId ? "".concat(R(r.displayName), "-").concat(r.componentId) : r.componentId || f2, S2 = i && a.attrs ? a.attrs.concat(d).filter(Boolean) : d, w2 = r.shouldForwardProp;
-  if (i && a.shouldForwardProp) {
-    var b = a.shouldForwardProp;
-    if (r.shouldForwardProp) {
-      var E2 = r.shouldForwardProp;
-      w2 = function(e2, t) {
-        return b(e2, t) && E2(e2, t);
-      };
-    } else w2 = b;
-  }
-  var N2 = new Qe(s, g2, i ? a.componentStyle : void 0);
-  function O2(e2, r2) {
-    return (function(e3, r3, s2) {
-      var i2 = e3.attrs, a2 = e3.componentStyle, c2 = e3.defaultProps, p2 = e3.foldedComponentIds, d2 = e3.styledComponentId, h2 = e3.target, f3 = o__default.default.useContext(et), m3 = Le(), y3 = e3.shouldForwardProp || m3.shouldForwardProp;
-      process.env.NODE_ENV !== "production" && o.useDebugValue(d2);
-      var v2 = I(r3, f3, c2) || C, g3 = (function(e4, n, o2) {
-        for (var r4, s3 = __assign(__assign({}, n), { className: void 0, theme: o2 }), i3 = 0; i3 < e4.length; i3 += 1) {
-          var a3 = re(r4 = e4[i3]) ? r4(s3) : r4;
-          for (var c3 in a3) s3[c3] = c3 === "className" ? ie(s3[c3], a3[c3]) : c3 === "style" ? __assign(__assign({}, s3[c3]), a3[c3]) : a3[c3];
-        }
-        return n.className && (s3.className = ie(s3.className, n.className)), s3;
-      })(i2, r3, v2), S3 = g3.as || h2, w3 = {};
-      for (var b2 in g3) g3[b2] === void 0 || b2[0] === "$" || b2 === "as" || b2 === "theme" && g3.theme === v2 || (b2 === "forwardedAs" ? w3.as = g3.forwardedAs : y3 && !y3(b2, S3) || (w3[b2] = g3[b2], y3 || process.env.NODE_ENV !== "development" || isPropValid(b2) || st.has(b2) || !A.has(S3) || (st.add(b2), console.warn('styled-components: it looks like an unknown prop "'.concat(b2, '" is being sent through to the DOM, which will likely trigger a React console error. If you would like automatic filtering of unknown props, you can opt-into that behavior via `<StyleSheetManager shouldForwardProp={...}>` (connect an API like `@emotion/is-prop-valid`) or consider using transient props (`$` prefix for automatic filtering.)')))));
-      var E3 = (function(e4, t) {
-        var n = Le(), o$1 = e4.generateAndInjectStyles(t, n.styleSheet, n.stylis);
-        return process.env.NODE_ENV !== "production" && o.useDebugValue(o$1), o$1;
-      })(a2, g3);
-      process.env.NODE_ENV !== "production" && e3.warnTooManyClasses && e3.warnTooManyClasses(E3);
-      var N3 = ie(p2, d2);
-      return E3 && (N3 += " " + E3), g3.className && (N3 += " " + g3.className), w3[G(S3) && !A.has(S3) ? "class" : "className"] = N3, s2 && (w3.ref = s2), o.createElement(S3, w3);
-    })(D2, e2, r2);
-  }
-  O2.displayName = y2;
-  var D2 = o__default.default.forwardRef(O2);
-  return D2.attrs = S2, D2.componentStyle = N2, D2.displayName = y2, D2.shouldForwardProp = w2, D2.foldedComponentIds = i ? ie(a.foldedComponentIds, a.styledComponentId) : "", D2.styledComponentId = g2, D2.target = i ? a.target : e, Object.defineProperty(D2, "defaultProps", { get: function() {
-    return this._foldedDefaultProps;
-  }, set: function(e2) {
-    this._foldedDefaultProps = i ? (function(e3) {
-      for (var t = [], n = 1; n < arguments.length; n++) t[n - 1] = arguments[n];
-      for (var o2 = 0, r2 = t; o2 < r2.length; o2++) le(e3, r2[o2], !0);
-      return e3;
-    })({}, a.defaultProps, e2) : e2;
-  } }), process.env.NODE_ENV !== "production" && (P(y2, g2), D2.warnTooManyClasses = /* @__PURE__ */ (function(e2, t) {
-    var n = {}, o2 = !1;
-    return function(r2) {
-      if (!o2 && (n[r2] = !0, Object.keys(n).length >= 200)) {
-        var s2 = t ? ' with the id of "'.concat(t, '"') : "";
-        console.warn("Over ".concat(200, " classes were generated for component ").concat(e2).concat(s2, `.
-`) + `Consider using the attrs method, together with a style object for frequently changed styles.
-Example:
-  const Component = styled.div.attrs(props => ({
-    style: {
-      background: props.background,
-    },
-  }))\`width: 100%;\`
-
-  <Component />`), o2 = !0, n = {};
-      }
-    };
-  })(y2, g2)), ue(D2, function() {
-    return ".".concat(D2.styledComponentId);
-  }), c && oe(D2, e, { attrs: !0, componentStyle: !0, displayName: !0, foldedComponentIds: !0, shouldForwardProp: !0, styledComponentId: !0, target: !0 }), D2;
-}
-function at(e, t) {
-  for (var n = [e[0]], o2 = 0, r = t.length; o2 < r; o2 += 1) n.push(t[o2], e[o2 + 1]);
-  return n;
-}
-var ct = function(e) {
-  return Object.assign(e, { isCss: !0 });
-};
-function lt(t) {
-  for (var n = [], o2 = 1; o2 < arguments.length; o2++) n[o2 - 1] = arguments[o2];
-  if (re(t) || ce(t)) return ct(Xe(at(_, __spreadArray([t], n, !0))));
-  var r = t;
-  return n.length === 0 && r.length === 1 && typeof r[0] == "string" ? Xe(r) : ct(Xe(at(r, n)));
-}
-function ut(n, o2, r) {
-  if (r === void 0 && (r = C), !o2) throw he(1, o2);
-  var s = function(t) {
-    for (var s2 = [], i = 1; i < arguments.length; i++) s2[i - 1] = arguments[i];
-    return n(o2, r, lt.apply(void 0, __spreadArray([t], s2, !1)));
-  };
-  return s.attrs = function(e) {
-    return ut(n, o2, __assign(__assign({}, r), { attrs: Array.prototype.concat(r.attrs, e).filter(Boolean) }));
-  }, s.withConfig = function(e) {
-    return ut(n, o2, __assign(__assign({}, r), e));
-  }, s;
-}
-var pt = function(e) {
-  return ut(it, e);
-}, dt = pt;
-A.forEach(function(e) {
-  dt[e] = pt(e);
-});
-process.env.NODE_ENV !== "production" && typeof navigator < "u" && navigator.product === "ReactNative" && console.warn(`It looks like you've imported 'styled-components' on React Native.
-Perhaps you're looking to import 'styled-components/native'?
-Read more about this at https://www.styled-components.com/docs/basics#react-native`);
-var wt = "__sc-".concat(f, "__");
-process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && typeof window < "u" && (window[wt] || (window[wt] = 0), window[wt] === 1 && console.warn(`It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.
-
-See https://s-c.sh/2BAXzed for more info.`), window[wt] += 1);
-const WrapText = dt(ui.Box)`
-  white-space: normal;
-`, LocaleCheckbox = ({
+  ] });
+}, LocaleCheckbox = ({
   locale,
   toggle,
   checked
 }) => {
-  const onClick = o.useCallback(
+  const onClick = React.useCallback(
     () => toggle(locale.localeId, !checked),
     [locale.localeId, toggle, checked]
   );
@@ -3422,17 +2395,17 @@ const WrapText = dt(ui.Box)`
       mode: "ghost",
       onClick,
       style: { cursor: "pointer" },
-      radius: 2,
+      padding: 3,
       children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 3, children: [
         /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Switch,
+          ui.Checkbox,
           {
             style: { pointerEvents: "none" },
             onChange: onClick,
             checked
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(WrapText, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, weight: "semibold", children: locale.description }) })
+        /* @__PURE__ */ jsxRuntime.jsx(LocaleLabel, { localeId: locale.localeId })
       ] })
     }
   );
@@ -3460,20 +2433,23 @@ const WrapText = dt(ui.Box)`
     autoPublish,
     setAutoPublish,
     getVersionId
-  } = useTranslations(), [isImporting, setIsImporting] = o.useState(!1), [isPublishing, setIsPublishing] = o.useState(!1), toast = ui.useToast(), document2 = documents[0], currentDocumentLanguage = o.useMemo(() => {
+  } = useTranslations(), [isImporting, setIsImporting] = React.useState(!1), [isPublishing, setIsPublishing] = React.useState(!1), toast = ui.useToast(), document2 = documents[0], currentDocumentLanguage = React.useMemo(() => {
     if (!document2) return null;
     const languageField = pluginConfig.getLanguageField();
     return document2[languageField] || pluginConfig.getSourceLocale();
-  }, [document2]), shouldShowTranslationComponents = o.useMemo(() => currentDocumentLanguage ? currentDocumentLanguage === pluginConfig.getSourceLocale() : !1, [currentDocumentLanguage]), availableLocales = o.useMemo(() => {
+  }, [document2]), shouldShowTranslationComponents = React.useMemo(() => currentDocumentLanguage ? currentDocumentLanguage === pluginConfig.getSourceLocale() : !1, [currentDocumentLanguage]), availableLocales = React.useMemo(() => {
     const sourceLocale = pluginConfig.getSourceLocale();
     return locales.filter(
       (locale) => locale.enabled !== !1 && locale.localeId !== sourceLocale
     );
-  }, [locales]), documentId = o.useMemo(() => document2 ? getDocumentPublishedId(document2) : null, [document2]), versionId = o.useMemo(() => document2 ? getVersionId(document2) : null, [document2, getVersionId]), handleImportTranslations = o.useCallback(
+  }, [locales]), statusLocales = React.useMemo(() => {
+    const sourceLocale = pluginConfig.getSourceLocale();
+    return locales.filter((locale) => locale.localeId !== sourceLocale);
+  }, [locales]), documentId = React.useMemo(() => document2 ? getDocumentPublishedId(document2) : null, [document2]), versionId = React.useMemo(() => document2 ? getVersionId(document2) : null, [document2, getVersionId]), handleImportTranslations = React.useCallback(
     async (options = {}) => {
       const { autoOnly = !1 } = options;
       if (isImporting || !documentId || !versionId || autoOnly && !autoImport) return;
-      const readyTranslations = availableLocales.filter((locale) => {
+      const readyTranslations = statusLocales.filter((locale) => {
         const key = createTranslationStatusKey(
           branchId,
           documentId,
@@ -3498,7 +2474,7 @@ const WrapText = dt(ui.Box)`
       isImporting,
       documentId,
       versionId,
-      availableLocales,
+      statusLocales,
       translationStatuses,
       importedTranslations,
       handleImportDocument,
@@ -3509,12 +2485,12 @@ const WrapText = dt(ui.Box)`
       toast
     ]
   );
-  o.useEffect(() => {
+  React.useEffect(() => {
     handleImportTranslations({ autoOnly: !0 });
-  }, [handleImportTranslations]), o.useEffect(() => {
+  }, [handleImportTranslations]), React.useEffect(() => {
     setAutoRefresh(!0), setAutoPatchReferences(!0), setAutoPublish(!0);
   }, [setAutoRefresh, setAutoPatchReferences, setAutoPublish]);
-  const toggleLocale = o.useCallback(
+  const toggleLocale = React.useCallback(
     (localeId, shouldEnable) => {
       const updatedLocales = locales.map(
         (locale) => locale.localeId === localeId ? { ...locale, enabled: shouldEnable } : locale
@@ -3522,7 +2498,7 @@ const WrapText = dt(ui.Box)`
       setLocales(updatedLocales);
     },
     [locales, setLocales]
-  ), toggleAllLocales = o.useCallback(() => {
+  ), toggleAllLocales = React.useCallback(() => {
     const sourceLocale = pluginConfig.getSourceLocale(), allEnabled = locales.filter(
       (locale) => locale.localeId !== sourceLocale
     ).every(
@@ -3534,7 +2510,7 @@ const WrapText = dt(ui.Box)`
   }, [locales, setLocales]);
   return shouldShowTranslationComponents ? /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 6, padding: 4, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 4, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "h2", weight: "semibold", size: 2, children: "Generate Translations" }),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "h2", weight: "semibold", size: 2, children: "Translate" }),
       /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
         /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", justify: "space-between", children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "semibold", size: 1, children: availableLocales.length === 1 ? "Select locale" : "Select locales" }),
@@ -3543,6 +2519,7 @@ const WrapText = dt(ui.Box)`
             {
               fontSize: 1,
               padding: 2,
+              mode: "ghost",
               text: "Toggle All",
               onClick: toggleAllLocales
             }
@@ -3567,12 +2544,13 @@ const WrapText = dt(ui.Box)`
             setAutoImport(!0), handleTranslateAll();
           },
           disabled: isBusy || !availableLocales.length,
-          tone: "positive",
-          text: isBusy ? "Creating translations..." : "Generate Translations"
+          icon: icons.TranslateIcon,
+          text: "Translate",
+          loading: isBusy
         }
       )
     ] }),
-    documentId && versionId && availableLocales.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 4, children: [
+    documentId && versionId && statusLocales.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 4, children: [
       /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", justify: "space-between", children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "h2", weight: "semibold", size: 2, children: "Translation Status" }),
         /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 3, align: "center", children: [
@@ -3591,14 +2569,17 @@ const WrapText = dt(ui.Box)`
             {
               fontSize: 1,
               padding: 2,
-              text: "Refresh Status",
+              mode: "ghost",
+              icon: icons.RefreshIcon,
+              text: "Refresh",
+              loading: isRefreshing,
               onClick: handleRefreshAll,
               disabled: isRefreshing || isBusy
             }
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { children: availableLocales.map((locale) => {
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { border: !0, radius: 3, paddingY: 1, children: statusLocales.map((locale) => {
         const key = createTranslationStatusKey(
           branchId,
           documentId,
@@ -3608,7 +2589,7 @@ const WrapText = dt(ui.Box)`
         return /* @__PURE__ */ jsxRuntime.jsx(
           LanguageStatus,
           {
-            title: locale.description,
+            localeId: locale.localeId,
             progress,
             isImported,
             importFile: async () => {
@@ -3629,11 +2610,11 @@ const WrapText = dt(ui.Box)`
               ui.Button,
               {
                 mode: "ghost",
-                tone: "primary",
                 onClick: () => handleImportTranslations(),
-                text: isImporting ? "Importing..." : "Import All",
+                text: "Import All",
+                loading: isImporting,
                 icon: icons.DownloadIcon,
-                disabled: isImporting || availableLocales.every((locale) => {
+                disabled: isImporting || statusLocales.every((locale) => {
                   const key = createTranslationStatusKey(
                     branchId,
                     documentId,
@@ -3660,7 +2641,7 @@ const WrapText = dt(ui.Box)`
           /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 1, muted: !0, children: [
             "Imported",
             " ",
-            availableLocales.filter((locale) => {
+            statusLocales.filter((locale) => {
               const key = createTranslationStatusKey(
                 branchId,
                 documentId,
@@ -3670,7 +2651,7 @@ const WrapText = dt(ui.Box)`
               return importedTranslations.has(key);
             }).length,
             "/",
-            availableLocales.filter((locale) => {
+            statusLocales.filter((locale) => {
               const key = createTranslationStatusKey(
                 branchId,
                 documentId,
@@ -3691,12 +2672,12 @@ const WrapText = dt(ui.Box)`
                 ui.Button,
                 {
                   mode: "ghost",
-                  tone: "caution",
                   onClick: async () => {
                     await handlePatchDocumentReferences();
                   },
-                  text: isBusy ? "Patching..." : "Patch References",
-                  icon: isBusy ? null : icons.LinkIcon,
+                  text: "Patch References",
+                  loading: isBusy,
+                  icon: icons.LinkIcon,
                   disabled: isBusy || isImporting,
                   style: { minWidth: "180px" }
                 }
@@ -3725,7 +2706,6 @@ const WrapText = dt(ui.Box)`
                 ui.Button,
                 {
                   mode: "ghost",
-                  tone: "positive",
                   onClick: async () => {
                     setIsPublishing(!0);
                     try {
@@ -3734,8 +2714,9 @@ const WrapText = dt(ui.Box)`
                       setIsPublishing(!1);
                     }
                   },
-                  text: isPublishing ? "Publishing..." : "Publish Translations",
-                  icon: isPublishing ? null : icons.PublishIcon,
+                  text: "Publish Translations",
+                  loading: isPublishing,
+                  icon: icons.PublishIcon,
                   disabled: isBusy || isPublishing || isImporting,
                   style: { minWidth: "180px" }
                 }
@@ -3763,7 +2744,7 @@ const WrapText = dt(ui.Box)`
     " documents."
   ] }) });
 }, translateAction = (props) => {
-  const [dialogOpen, setDialogOpen] = o.useState(!1), document2 = props.draft || props.published;
+  const [dialogOpen, setDialogOpen] = React.useState(!1), document2 = props.draft || props.published;
   return {
     label: "Translate",
     icon: icons.TranslateIcon,
@@ -3777,259 +2758,89 @@ const WrapText = dt(ui.Box)`
     } : null
   };
 };
-function readGTOptions(schemaType) {
-  return schemaType?.options?.gtInternationalizedArray;
-}
-function toneFromValidation(validation) {
-  if (validation?.length) {
-    if (validation.some((marker) => marker.level === "error")) return "critical";
-    if (validation.some((marker) => marker.level === "warning")) return "caution";
-  }
-}
-function RemoveLocaleButton(props) {
-  const { isSource, readOnly, onRemove } = props, button = (
-    // The span keeps the tooltip working when the button is disabled
-    // (disabled buttons don't emit pointer events).
-    /* @__PURE__ */ jsxRuntime.jsx("span", { style: { paddingBottom: "2px" }, children: /* @__PURE__ */ jsxRuntime.jsx(
-      ui.Button,
-      {
-        mode: "bleed",
-        icon: icons.RemoveCircleIcon,
-        tone: "critical",
-        disabled: readOnly || isSource,
-        onClick: onRemove
-      }
-    ) })
-  );
-  return isSource ? /* @__PURE__ */ jsxRuntime.jsx(
-    ui.Tooltip,
-    {
-      animate: !0,
-      portal: !0,
-      placement: "top",
-      fallbackPlacements: ["right", "left"],
-      content: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { muted: !0, size: 1, children: "Can't remove the source language" }),
-      children: button
-    }
-  ) : button;
-}
-function InternationalizedValueItem(props) {
-  const { inputProps, parentSchemaType, schemaType, validation } = props, value = props.value, { onChange } = inputProps, gtOptions = readGTOptions(schemaType) ?? readGTOptions(parentSchemaType), language = value?.language, languageLabel = language ? gtOptions?.titles?.[language] ?? language : "Unknown language", isSource = !!language && language === gtOptions?.sourceLocale, wrappedOnChange = o.useCallback(
-    (patch) => {
-      if (!Array.isArray(patch)) {
-        onChange(patch);
-        return;
-      }
-      const currentValue = value?.value;
-      if (!((currentValue == null || Array.isArray(currentValue) && currentValue.length === 0) && patch.some(
-        (p) => p.type === "insert" && Array.isArray(p.path) && p.path.length > 0 && (p.path[0] === "value" || typeof p.path[0] == "number")
-      ))) {
-        onChange(patch);
-        return;
-      }
-      const rerooted = patch.map(
-        (p) => p.type === "insert" && Array.isArray(p.path) && p.path[0] !== "value" ? { ...p, path: ["value", ...p.path] } : p
-      );
-      onChange(
-        currentValue === void 0 ? [sanity.setIfMissing([], ["value"]), ...rerooted] : rerooted
-      );
-    },
-    [onChange, value?.value]
-  ), members = o.useMemo(
-    () => inputProps.members.filter(
-      (member) => member.kind === "field" && member.name === "value"
-    ).map((member) => ({
-      ...member,
-      field: {
-        ...member.field,
-        schemaType: {
-          ...member.field.schemaType,
-          title: /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { muted: !0, size: 1, children: languageLabel })
-        }
-      }
-    })),
-    [inputProps.members, languageLabel]
-  ), handleRemove = o.useCallback(() => {
-    onChange(sanity.unset());
-  }, [onChange]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { paddingTop: 2, tone: toneFromValidation(validation), children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "flex-end", gap: 2, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { flex: 1, children: inputProps.renderInput({
-      ...inputProps,
-      members,
-      onChange: wrappedOnChange
-      // renderInput's parameter is typed as the base InputProps, which
-      // doesn't know about object members.
-    }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      RemoveLocaleButton,
-      {
-        isSource,
-        readOnly: !!inputProps.readOnly,
-        onRemove: handleRemove
-      }
-    )
-  ] }) });
-}
-function InternationalizedArrayInput(props) {
-  const { members, schemaType, value, readOnly, onItemAppend } = props, gtOptions = readGTOptions(schemaType), itemType = schemaType.of[0]?.name, handleAdd = o.useCallback(
-    (language) => {
-      const item = { _key: randomKey(), _type: itemType, language };
-      onItemAppend(item);
-    },
-    [onItemAppend, itemType]
-  );
-  if (!gtOptions)
-    return props.renderDefault(props);
-  const allLocales = [gtOptions.sourceLocale, ...gtOptions.locales], existing = new Set(
-    (value ?? []).map((item) => item.language).filter(Boolean)
-  ), missing = allLocales.filter((locale) => !existing.has(locale));
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
-    members.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { space: 2, children: members.map(
-      (member) => member.kind === "item" ? /* @__PURE__ */ jsxRuntime.jsx(sanity.ArrayOfObjectsItem, { ...props, member }, member.key) : /* @__PURE__ */ jsxRuntime.jsx(sanity.MemberItemError, { member }, member.key)
-    ) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { border: !0, tone: "transparent", padding: 3, radius: 2, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: "This internationalized field currently has no translations." }) }),
-    !readOnly && missing.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Grid, { columns: Math.min(missing.length, 4), gap: 1, children: missing.map((locale) => /* @__PURE__ */ jsxRuntime.jsx(
-      ui.Button,
-      {
-        icon: icons.AddIcon,
-        mode: "ghost",
-        text: gtOptions.titles?.[locale] ?? locale,
-        onClick: () => handleAdd(locale)
-      },
-      locale
-    )) }) : null
-  ] });
-}
-const DEFAULT_TYPE_PREFIX = "internationalizedArray";
-function resolveComponents(overrides) {
-  const input = overrides?.input === !1 ? void 0 : overrides?.input ?? InternationalizedArrayInput, item = overrides?.item === !1 ? void 0 : overrides?.item ?? InternationalizedValueItem, defaultField = input === InternationalizedArrayInput ? (
-    // Reset the field level so inline per-locale inputs don't inherit
-    // nested-object indentation.
-    ((fieldProps) => fieldProps.renderDefault({ ...fieldProps, level: 0 }))
-  ) : void 0, field = overrides?.field === !1 ? void 0 : overrides?.field ?? defaultField;
-  return { input, item, field };
-}
-function capitalize(value) {
-  return value.charAt(0).toUpperCase() + value.slice(1);
-}
-function fieldTypeName(fieldType) {
-  return typeof fieldType == "string" ? fieldType : fieldType.name;
-}
-function valueField(fieldType) {
-  if (fieldType === "string" || fieldType === "text")
-    return { name: "value", type: fieldType, title: "Value" };
-  if (fieldType === "block")
-    return {
-      name: "value",
-      type: "array",
-      title: "Value",
-      of: [{ type: "block" }]
-    };
-  const { name: _name, ...rest } = fieldType;
-  return { name: "value", title: "Value", ...rest };
-}
-function makeLanguageTitle(options) {
-  const { languageTitles, getLanguageTitle, sourceLocale } = options;
-  return (locale) => getLanguageTitle?.(locale) ?? languageTitles?.[locale] ?? generaltranslation.getLocaleProperties(locale, sourceLocale).name ?? locale;
-}
-function buildTypesForPrefix(prefix2, options) {
-  const { sourceLocale, locales, fieldTypes } = options, languageTitle = makeLanguageTitle(options), components = resolveComponents(options.components);
-  return fieldTypes.map((fieldType) => {
-    const typeName = `${prefix2}${capitalize(fieldTypeName(fieldType))}`, valueTypeName = `${typeName}Value`, gtInternationalizedArray = {
-      sourceLocale,
-      locales,
-      titles: Object.fromEntries(
-        [sourceLocale, ...locales].map((locale) => [
-          locale,
-          languageTitle(locale)
-        ])
-      )
-    }, valueObject = {
-      type: "object",
-      name: valueTypeName,
-      ...components.item ? { components: { item: components.item } } : {},
-      fields: [
-        {
-          name: "language",
-          type: "string",
-          title: "Language",
-          readOnly: !0,
-          // GT's inline item shows the locale as the value field's label;
-          // with a custom or detached item, keep the field visible so the
-          // locale is still discoverable in default/dialog rendering.
-          hidden: components.item === InternationalizedValueItem
-        },
-        valueField(fieldType)
-      ],
-      options: { gtInternationalizedArray },
-      preview: {
-        select: { language: "language", value: "value" },
-        prepare(selection) {
-          const localeLabel = selection.language ? languageTitle(selection.language) : "Unknown";
-          return {
-            title: typeof selection.value == "string" ? selection.value : localeLabel,
-            subtitle: localeLabel
-          };
-        }
-      }
-    }, arrayComponents = {
-      ...components.input ? { input: components.input } : {},
-      ...components.field ? { field: components.field } : {}
-    };
-    return {
-      name: typeName,
-      type: "array",
-      ...Object.keys(arrayComponents).length ? { components: arrayComponents } : {},
-      of: [valueObject],
-      options: { gtInternationalizedArray }
-    };
-  });
-}
-function createInternationalizedArrayTypes(options) {
-  const prefix2 = options.typePrefix ?? DEFAULT_TYPE_PREFIX, includeCompatibilityTypes = options.includeCompatibilityTypes ?? !0, types = buildTypesForPrefix(prefix2, options);
-  return includeCompatibilityTypes && prefix2 !== DEFAULT_TYPE_PREFIX && types.push(...buildTypesForPrefix(DEFAULT_TYPE_PREFIX, options)), types;
-}
 function resolveFieldLevelConfig(config) {
   return {
     enabled: !1,
     fieldTypes: ["string", "text"],
-    typePrefix: DEFAULT_TYPE_PREFIX,
-    includeCompatibilityTypes: !0,
     ...config
   };
 }
-const TranslationsTable = () => {
+function toNativeFieldType(fieldType) {
+  return fieldType === "block" ? {
+    name: "block",
+    type: "array",
+    of: [{ type: "block" }]
+  } : fieldType;
+}
+function buildInternationalizedArrayPlugin(config, sourceLocale, locales, customMapping) {
+  const languageTitle = (locale) => config.getLanguageTitle?.(locale) ?? config.languageTitles?.[locale] ?? formatLocalePropertiesLabel(
+    locale,
+    generaltranslation.getLocaleProperties(locale, sourceLocale, customMapping),
+    customMapping?.[locale]
+  ), allLocales = Array.from(/* @__PURE__ */ new Set([sourceLocale, ...locales]));
+  return sanityPluginInternationalizedArray.internationalizedArray({
+    languages: allLocales.map((id) => ({ id, title: languageTitle(id) })),
+    defaultLanguages: config.defaultLanguages ?? [sourceLocale],
+    fieldTypes: config.fieldTypes.map(toNativeFieldType),
+    ...config.apiVersion !== void 0 && { apiVersion: config.apiVersion },
+    ...config.buttonLocations !== void 0 && {
+      buttonLocations: config.buttonLocations
+    },
+    ...config.buttonAddAll !== void 0 && {
+      buttonAddAll: config.buttonAddAll
+    },
+    ...config.languageDisplay !== void 0 && {
+      languageDisplay: config.languageDisplay
+    }
+  });
+}
+const DocumentRow = ({ document: document2 }) => {
   const {
-    documents,
     locales,
-    loadingDocuments,
     translationStatuses,
     downloadStatus,
     importedTranslations,
     handleImportDocument,
     branchId,
     getVersionId
-  } = useTranslations();
-  return loadingDocuments ? /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { align: "center", justify: "center", padding: 4, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Spinner, {}) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { style: { maxHeight: "60vh", overflowY: "auto" }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { space: 2, children: documents.map((document2) => /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { shadow: 1, padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { justify: "space-between", align: "flex-start", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { flex: 1, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "semibold", size: 1, children: getDocumentPublishedId(document2) }),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 0, muted: !0, style: { marginTop: "2px" }, children: document2._type })
-    ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { space: 2, children: locales.length > 0 ? locales.filter((locale) => locale.enabled !== !1).map((locale) => {
-      const documentId = getDocumentPublishedId(document2), versionId = getVersionId(document2), key = createTranslationStatusKey(
+  } = useTranslations(), schemaType = sanity.useSchema().get(document2._type), publishedId = getDocumentPublishedId(document2), editLink = router.useIntentLink({
+    intent: "edit",
+    params: { id: publishedId, type: document2._type }
+  }), enabledLocales = locales.filter((locale) => locale.enabled !== !1);
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Card, { border: !0, radius: 3, overflow: "hidden", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ui.Card,
+      {
+        as: "a",
+        href: editLink.href,
+        onClick: editLink.onClick,
+        padding: 2,
+        radius: 0,
+        borderBottom: !0,
+        style: { textDecoration: "none", color: "inherit" },
+        title: "Open document",
+        children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 3, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { flex: 1, children: schemaType ? /* @__PURE__ */ jsxRuntime.jsx(sanity.Preview, { value: document2, schemaType }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "semibold", size: 1, children: publishedId }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { fontSize: 0, radius: 2, children: schemaType?.title ?? document2._type })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { paddingY: 1, children: enabledLocales.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { space: 1, children: enabledLocales.map((locale) => {
+      const versionId = getVersionId(document2), key = createTranslationStatusKey(
         branchId,
-        documentId,
+        publishedId,
         versionId,
         locale.localeId
       ), status = translationStatuses.get(key), isDownloaded = downloadStatus.downloaded.has(key), isImported = importedTranslations.has(key);
       return /* @__PURE__ */ jsxRuntime.jsx(
         LanguageStatus,
         {
-          title: locale.description || locale.localeId,
+          localeId: locale.localeId,
           progress: status?.progress || 0,
           isImported: isImported || isDownloaded,
           importFile: async () => {
             await handleImportDocument(
-              documentId,
+              publishedId,
               versionId,
               locale.localeId
             );
@@ -4037,8 +2848,11 @@ const TranslationsTable = () => {
         },
         `${document2._id}-${versionId}-${locale.localeId}`
       );
-    }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: "No locales configured" }) })
-  ] }) }, document2._id)) }) });
+    }) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 3, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: "No locales configured" }) }) })
+  ] });
+}, TranslationsTable = () => {
+  const { documents, loadingDocuments } = useTranslations();
+  return loadingDocuments ? /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { align: "center", justify: "center", padding: 4, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Spinner, {}) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { style: { maxHeight: "60vh", overflowY: "auto" }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { space: 2, children: documents.map((document2) => /* @__PURE__ */ jsxRuntime.jsx(DocumentRow, { document: document2 }, document2._id)) }) });
 }, TranslateAllDialog = ({
   isOpen,
   onClose
@@ -4054,14 +2868,7 @@ const TranslationsTable = () => {
       onClose,
       footer: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { text: "Cancel", mode: "ghost", onClick: onClose }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            text: "Translate All",
-            tone: "critical",
-            onClick: handleConfirm
-          }
-        )
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { text: "Translate All", onClick: handleConfirm })
       ] }) }),
       children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
         /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { children: [
@@ -4089,7 +2896,7 @@ const TranslationsTable = () => {
       onClose,
       footer: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { text: "Cancel", mode: "ghost", onClick: onClose }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { text: "Import All", tone: "critical", onClick: handleConfirm })
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { text: "Import All", tone: "caution", onClick: handleConfirm })
       ] }) }),
       children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
         /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { children: [
@@ -4117,14 +2924,7 @@ const TranslationsTable = () => {
       onClose,
       footer: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { text: "Cancel", mode: "ghost", onClick: onClose }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ui.Button,
-          {
-            text: "Import Missing",
-            tone: "primary",
-            onClick: handleConfirm
-          }
-        )
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { text: "Import Missing", onClick: handleConfirm })
       ] }) }),
       children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { children: "Import only the missing translations (translations that are ready but haven't been imported to Sanity yet)?" }),
@@ -4148,7 +2948,7 @@ const TranslationsTable = () => {
     "..."
   ] })
 ] }) : null, TranslationsToolContent = () => {
-  const [isTranslateAllDialogOpen, setIsTranslateAllDialogOpen] = o.useState(!1), [isImportAllDialogOpen, setIsImportAllDialogOpen] = o.useState(!1), [isImportMissingDialogOpen, setIsImportMissingDialogOpen] = o.useState(!1), {
+  const [isTranslateAllDialogOpen, setIsTranslateAllDialogOpen] = React.useState(!1), [isImportAllDialogOpen, setIsImportAllDialogOpen] = React.useState(!1), [isImportMissingDialogOpen, setIsImportMissingDialogOpen] = React.useState(!1), {
     isBusy,
     documents,
     locales,
@@ -4161,29 +2961,13 @@ const TranslationsTable = () => {
     handleRefreshAll,
     handlePatchDocumentReferences,
     handlePublishAllTranslations
-  } = useTranslations(), [currentOperation, setCurrentOperation] = o.useState(null), getOperationText = (operationName, isProcessing) => {
-    if (!isProcessing || !operationName) return operationName;
-    switch (operationName) {
-      case "Translate All":
-        return "Translating...";
-      case "Import All":
-        return "Importing...";
-      case "Import Missing":
-        return "Importing...";
-      case "Patch Document References":
-        return "Patching...";
-      case "Publish Translations":
-        return "Publishing...";
-      default:
-        return "Processing...";
-    }
-  }, getProgressOperationName = () => {
+  } = useTranslations(), [currentOperation, setCurrentOperation] = React.useState(null), getProgressOperationName = () => {
     switch (currentOperation) {
       case "Import All":
         return "Importing";
       case "Import Missing":
         return "Importing missing";
-      case "Patch Document References":
+      case "Patch References":
         return "Patching";
       case "Publish Translations":
         return "Publishing";
@@ -4191,181 +2975,176 @@ const TranslationsTable = () => {
         return "Processing";
     }
   };
-  return o__default.default.useEffect(() => {
+  React__default.default.useEffect(() => {
     !isBusy && !importProgress.isImporting && setCurrentOperation(null);
-  }, [isBusy, importProgress.isImporting]), /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { width: 2, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 4, marginTop: 5, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 4, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", justify: "space-between", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 2, children: [
+  }, [isBusy, importProgress.isImporting]);
+  const enabledLocaleCount = locales.filter((l) => l.enabled !== !1).length, totalTranslations = documents.length * enabledLocaleCount, actionsDisabled = isBusy || loadingDocuments || documents.length === 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { width: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 4, marginTop: 5, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 5, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "flex-start", justify: "space-between", gap: 4, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { as: "h2", size: 3, children: "Translations" }),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, children: "Manage your document translations from this centralized location." })
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: "Manage your document translations from this centralized location." })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 3, align: "center", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, align: "center", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, children: "Auto-refresh" }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              ui.Switch,
-              {
-                checked: autoRefresh,
-                onChange: () => setAutoRefresh(!autoRefresh)
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ui.Button,
-            {
-              fontSize: 1,
-              padding: 2,
-              text: isRefreshing ? "Refreshing..." : "Refresh Status",
-              onClick: handleRefreshAll,
-              disabled: isRefreshing || isBusy || loadingDocuments || documents.length === 0
-            }
-          )
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 4, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: loadingDocuments ? "Loading documents..." : `Found ${documents.length} documents available for translation` }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { justify: "center", children: /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx(
           ui.Button,
           {
-            style: { width: "200px" },
-            tone: "critical",
-            text: getOperationText(
-              "Translate All",
-              isBusy && currentOperation === "Translate All"
-            ),
+            icon: icons.TranslateIcon,
+            text: "Translate All",
+            loading: isBusy && currentOperation === "Translate All",
             onClick: () => {
               setCurrentOperation("Translate All"), setIsTranslateAllDialogOpen(!0);
             },
-            disabled: isBusy || loadingDocuments || documents.length === 0
+            disabled: actionsDisabled
           }
-        ) }),
-        /* @__PURE__ */ jsxRuntime.jsx(TranslationsTable, {}),
-        /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 3, align: "center", justify: "space-between", children: [
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", justify: "space-between", gap: 3, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: loadingDocuments ? "Loading documents..." : `${documents.length} ${documents.length === 1 ? "document" : "documents"} available for translation` }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 3, align: "center", children: [
             /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, align: "center", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, muted: !0, children: "Auto-refresh" }),
               /* @__PURE__ */ jsxRuntime.jsx(
-                ui.Tooltip,
-                {
-                  placement: "top",
-                  content: "Imports and overrides all translations",
-                  children: /* @__PURE__ */ jsxRuntime.jsx(
-                    ui.Button,
-                    {
-                      mode: "ghost",
-                      onClick: () => {
-                        setCurrentOperation("Import All"), setIsImportAllDialogOpen(!0);
-                      },
-                      text: getOperationText(
-                        "Import All",
-                        isBusy && currentOperation === "Import All"
-                      ),
-                      icon: isBusy && currentOperation === "Import All" ? null : icons.DownloadIcon,
-                      disabled: isBusy || loadingDocuments || documents.length === 0
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                ui.Tooltip,
-                {
-                  placement: "top",
-                  content: "Imports all translations that are not yet imported (according to the source document's translation.metadata document)",
-                  children: /* @__PURE__ */ jsxRuntime.jsx(
-                    ui.Button,
-                    {
-                      mode: "ghost",
-                      tone: "primary",
-                      onClick: () => {
-                        setCurrentOperation("Import Missing"), setIsImportMissingDialogOpen(!0);
-                      },
-                      text: getOperationText(
-                        "Import Missing",
-                        isBusy && currentOperation === "Import Missing"
-                      ),
-                      icon: isBusy && currentOperation === "Import Missing" ? null : icons.DownloadIcon,
-                      disabled: isBusy || loadingDocuments || documents.length === 0
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                ui.Tooltip,
-                {
-                  placement: "top",
-                  content: "Replaces references in documents with the corresponding translated document reference",
-                  children: /* @__PURE__ */ jsxRuntime.jsx(
-                    ui.Button,
-                    {
-                      mode: "ghost",
-                      tone: "caution",
-                      onClick: () => {
-                        setCurrentOperation("Patch Document References"), handlePatchDocumentReferences();
-                      },
-                      text: getOperationText(
-                        "Patch Document References",
-                        isBusy && currentOperation === "Patch Document References"
-                      ),
-                      icon: isBusy && currentOperation === "Patch Document References" ? null : icons.LinkIcon,
-                      disabled: isBusy || loadingDocuments || documents.length === 0
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                ui.Tooltip,
+                ui.Switch,
                 {
-                  placement: "top",
-                  content: "Publishes all translations whose source document is published",
-                  children: /* @__PURE__ */ jsxRuntime.jsx(
-                    ui.Button,
-                    {
-                      mode: "ghost",
-                      tone: "positive",
-                      onClick: () => {
-                        setCurrentOperation("Publish Translations"), handlePublishAllTranslations();
-                      },
-                      text: getOperationText(
-                        "Publish Translations",
-                        isBusy && currentOperation === "Publish Translations"
-                      ),
-                      icon: isBusy && currentOperation === "Publish Translations" ? null : icons.PublishIcon,
-                      disabled: isBusy || loadingDocuments || documents.length === 0
-                    }
-                  )
+                  checked: autoRefresh,
+                  onChange: () => setAutoRefresh(!autoRefresh)
                 }
-              ),
-              importedTranslations.size === documents.length * locales.filter((l) => l.enabled !== !1).length && documents.length > 0 && locales.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, align: "center", style: { color: "green" }, children: [
-                /* @__PURE__ */ jsxRuntime.jsx(icons.CheckmarkCircleIcon, {}),
-                /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, children: "All translations imported" })
-              ] }),
-              importedTranslations.size > 0 && importedTranslations.size < documents.length * locales.filter((l) => l.enabled !== !1).length && /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 1, style: { color: "#666" }, children: [
-                importedTranslations.size,
-                "/",
-                documents.length * locales.filter((l) => l.enabled !== !1).length,
-                " ",
-                "imported"
-              ] })
+              )
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {})
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                fontSize: 1,
+                padding: 2,
+                mode: "ghost",
+                icon: icons.RefreshIcon,
+                text: "Refresh",
+                loading: isRefreshing,
+                onClick: handleRefreshAll,
+                disabled: isRefreshing || actionsDisabled
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(TranslationsTable, {})
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 3, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, align: "center", justify: "space-between", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, align: "center", wrap: "wrap", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Tooltip,
+              {
+                placement: "top",
+                content: "Imports and overrides all translations",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.Button,
+                  {
+                    mode: "ghost",
+                    fontSize: 1,
+                    onClick: () => {
+                      setCurrentOperation("Import All"), setIsImportAllDialogOpen(!0);
+                    },
+                    text: "Import All",
+                    loading: isBusy && currentOperation === "Import All",
+                    icon: icons.DownloadIcon,
+                    disabled: actionsDisabled
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Tooltip,
+              {
+                placement: "top",
+                content: "Imports all translations that are not yet imported (according to the source document's translation.metadata document)",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.Button,
+                  {
+                    mode: "ghost",
+                    fontSize: 1,
+                    onClick: () => {
+                      setCurrentOperation("Import Missing"), setIsImportMissingDialogOpen(!0);
+                    },
+                    text: "Import Missing",
+                    loading: isBusy && currentOperation === "Import Missing",
+                    icon: icons.DownloadIcon,
+                    disabled: actionsDisabled
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Tooltip,
+              {
+                placement: "top",
+                content: "Replaces references in documents with the corresponding translated document reference",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.Button,
+                  {
+                    mode: "ghost",
+                    fontSize: 1,
+                    onClick: () => {
+                      setCurrentOperation("Patch References"), handlePatchDocumentReferences();
+                    },
+                    text: "Patch References",
+                    loading: isBusy && currentOperation === "Patch References",
+                    icon: icons.LinkIcon,
+                    disabled: actionsDisabled
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Tooltip,
+              {
+                placement: "top",
+                content: "Publishes all translations whose source document is published",
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  ui.Button,
+                  {
+                    mode: "ghost",
+                    fontSize: 1,
+                    onClick: () => {
+                      setCurrentOperation("Publish Translations"), handlePublishAllTranslations();
+                    },
+                    text: "Publish Translations",
+                    loading: isBusy && currentOperation === "Publish Translations",
+                    icon: icons.PublishIcon,
+                    disabled: actionsDisabled
+                  }
+                )
+              }
+            )
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            BatchProgress,
-            {
-              isActive: importProgress.isImporting,
-              current: importProgress.current,
-              total: importProgress.total,
-              operationName: getProgressOperationName()
-            }
-          )
-        ] })
+          totalTranslations > 0 && importedTranslations.size === totalTranslations && /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { tone: "positive", fontSize: 0, radius: 2, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", gap: 1, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(icons.CheckmarkCircleIcon, {}),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { children: "All translations imported" })
+          ] }) }),
+          importedTranslations.size > 0 && importedTranslations.size < totalTranslations && /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 1, muted: !0, children: [
+            importedTranslations.size,
+            "/",
+            totalTranslations,
+            " imported"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          BatchProgress,
+          {
+            isActive: importProgress.isImporting,
+            current: importProgress.current,
+            total: importProgress.total,
+            operationName: getProgressOperationName()
+          }
+        )
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 2, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { borderTop: !0, paddingTop: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: 1, muted: !0, children: [
         "For more information, see the",
         " ",
         /* @__PURE__ */ jsxRuntime.jsx(router.Link, { href: "https://dash.generaltranslation.com", children: "General Translation Dashboard" }),
         "."
-      ] })
+      ] }) })
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx(
       TranslateAllDialog,
@@ -4413,14 +3192,14 @@ const TranslationsTable = () => {
     additionalDeserializers = {},
     additionalBlockDeserializers = [],
     showDocumentInternationalization = !0,
-    internationalizedArray,
+    internationalizedArray: internationalizedArray2,
     fieldLevelLocalization,
     translationLevel = "document",
     fieldLevelDocuments
   }) => {
-    const resolvedSourceLocale = sourceLocale ?? defaultLocale ?? internal.libraryDefaultLocale, normalizeFilters = (entries) => entries?.map((entry) => typeof entry == "string" ? { type: entry } : entry).filter((filter2) => filter2.documentId || filter2.type), normalizedTranslateDocuments = normalizeFilters(translateDocuments), normalizedFieldLevelDocuments = normalizeFilters(fieldLevelDocuments) ?? [], fieldLevelConfig = resolveFieldLevelConfig(
-      internationalizedArray ?? fieldLevelLocalization
-    );
+    const resolvedSourceLocale = sourceLocale ?? defaultLocale ?? internal.libraryDefaultLocale, normalizeFilters = (entries) => entries?.map((entry) => typeof entry == "string" ? { type: entry } : entry).filter((filter) => filter.documentId || filter.type), normalizedTranslateDocuments = normalizeFilters(translateDocuments), normalizedFieldLevelDocuments = normalizeFilters(fieldLevelDocuments) ?? [], rawFieldLevelConfig = internationalizedArray2 ?? fieldLevelLocalization;
+    warnOnRemovedFieldLevelOptions(rawFieldLevelConfig);
+    const fieldLevelConfig = resolveFieldLevelConfig(rawFieldLevelConfig);
     pluginConfig.init(
       secretsNamespace,
       languageField,
@@ -4438,8 +3217,7 @@ const TranslationsTable = () => {
       additionalDeserializers,
       additionalBlockDeserializers,
       translationLevel,
-      normalizedFieldLevelDocuments,
-      fieldLevelConfig.typePrefix
+      normalizedFieldLevelDocuments
     ), gt.setConfig({
       sourceLocale: resolvedSourceLocale,
       customMapping,
@@ -4447,40 +3225,45 @@ const TranslationsTable = () => {
       projectId
     });
     const arrayLocalizedTypes = /* @__PURE__ */ new Set();
-    translationLevel === "internationalizedArray" ? normalizedTranslateDocuments?.map((filter2) => filter2.type).filter((type) => !!type).forEach((type) => arrayLocalizedTypes.add(type)) : translationLevel === "mixed" && normalizedFieldLevelDocuments.map((filter2) => filter2.type).filter((type) => !!type).forEach((type) => arrayLocalizedTypes.add(type));
+    translationLevel === "internationalizedArray" ? normalizedTranslateDocuments?.map((filter) => filter.type).filter((type) => !!type).forEach((type) => arrayLocalizedTypes.add(type)) : translationLevel === "mixed" && normalizedFieldLevelDocuments.map((filter) => filter.type).filter((type) => !!type).forEach((type) => arrayLocalizedTypes.add(type));
     const plugins = [];
     if (showDocumentInternationalization) {
-      const schemaTypes2 = normalizedTranslateDocuments?.map((filter2) => filter2.type).filter((type) => !!type).filter((type) => !arrayLocalizedTypes.has(type)) ?? [];
-      if (schemaTypes2.length > 0) {
+      const schemaTypes = normalizedTranslateDocuments?.map((filter) => filter.type).filter((type) => !!type).filter((type) => !arrayLocalizedTypes.has(type)) ?? [];
+      if (schemaTypes.length > 0) {
         const supportedLanguages = [resolvedSourceLocale, ...locales].map((locale) => {
-          const props = generaltranslation.getLocaleProperties(locale, resolvedSourceLocale);
-          return { id: locale, title: props.name };
+          const props = generaltranslation.getLocaleProperties(
+            locale,
+            resolvedSourceLocale,
+            customMapping
+          );
+          return {
+            id: locale,
+            title: formatLocalePropertiesLabel(
+              locale,
+              props,
+              customMapping?.[locale]
+            )
+          };
         });
         plugins.push(
           documentInternationalization.documentInternationalization({
             supportedLanguages,
-            schemaTypes: schemaTypes2,
+            schemaTypes,
             languageField
           })
         );
       }
     }
-    const schemaTypes = fieldLevelConfig.enabled ? createInternationalizedArrayTypes({
-      sourceLocale: resolvedSourceLocale,
-      locales,
-      fieldTypes: fieldLevelConfig.fieldTypes,
-      languageTitles: fieldLevelConfig.languageTitles,
-      getLanguageTitle: fieldLevelConfig.getLanguageTitle,
-      typePrefix: fieldLevelConfig.typePrefix,
-      includeCompatibilityTypes: fieldLevelConfig.includeCompatibilityTypes,
-      components: fieldLevelConfig.components
-    }) : [];
-    return {
+    return fieldLevelConfig.enabled && plugins.push(
+      buildInternationalizedArrayPlugin(
+        fieldLevelConfig,
+        resolvedSourceLocale,
+        locales,
+        customMapping
+      )
+    ), {
       name: "gt-sanity",
       plugins,
-      schema: {
-        types: schemaTypes
-      },
       tools: [
         {
           name: "translations",
@@ -4490,11 +3273,49 @@ const TranslationsTable = () => {
         }
       ],
       document: {
-        actions: (prev2) => [...prev2, translateAction]
+        actions: (prev) => [...prev, translateAction]
       }
     };
   }
-);
+), REMOVED_FIELD_LEVEL_OPTIONS = [
+  "typePrefix",
+  "includeCompatibilityTypes",
+  "components"
+];
+function warnOnRemovedFieldLevelOptions(config) {
+  if (!config) return;
+  const removed = REMOVED_FIELD_LEVEL_OPTIONS.filter(
+    (key) => config[key] !== void 0
+  );
+  removed.length !== 0 && console.warn(
+    internal.createDiagnosticMessage({
+      source: "gt-sanity",
+      severity: "Warning",
+      whatHappened: `Ignored unsupported field-level localization ${removed.length === 1 ? "option" : "options"}`,
+      why: "field-level localization is now provided by sanity-plugin-internationalized-array, which has no equivalent for these options",
+      fix: "Remove them from the gtPlugin configuration",
+      details: removed
+    })
+  );
+}
+Object.defineProperty(exports, "internationalizedArray", {
+  enumerable: !0,
+  get: function() {
+    return sanityPluginInternationalizedArray.internationalizedArray;
+  }
+});
+Object.defineProperty(exports, "internationalizedArrayLanguageFilter", {
+  enumerable: !0,
+  get: function() {
+    return sanityPluginInternationalizedArray.internationalizedArrayLanguageFilter;
+  }
+});
+Object.defineProperty(exports, "isInternationalizedArrayItemType", {
+  enumerable: !0,
+  get: function() {
+    return sanityPluginInternationalizedArray.isInternationalizedArrayItemType;
+  }
+});
 Object.defineProperty(exports, "DocumentInternationalizationMenu", {
   enumerable: !0,
   get: function() {
@@ -4530,7 +3351,6 @@ exports.BaseDocumentMerger = BaseDocumentMerger;
 exports.BaseDocumentSerializer = BaseDocumentSerializer;
 exports.TranslationsTab = TranslationTab;
 exports.attachGTData = attachGTData;
-exports.createInternationalizedArrayTypes = createInternationalizedArrayTypes;
 exports.customSerializers = customSerializers;
 exports.defaultStopTypes = defaultStopTypes;
 exports.detachGTData = detachGTData;