sanity-plugin-internationalized-array 4.0.3 → 4.0.4

package/dist/index.js

@@ -1,12 +1,14 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { isSanityDocument, useSchema, setIfMissing, insert, PatchEvent, useClient, useWorkspace, useFormValue, defineDocumentFieldAction, ArrayOfObjectsItem, MemberItemError, set, defineField, unset, isDocumentSchemaType, definePlugin, isObjectInputProps } from "sanity";
+import { useClient, useWorkspace, useGetFormValue, useSchema, isSanityDocument, setIfMissing, insert, PatchEvent, isDocumentSchemaType, defineDocumentFieldAction, useFormValue, set, ArrayOfObjectsItem, MemberItemError, defineField, unset, definePlugin, isObjectInputProps } from "sanity";
 import { c } from "react/compiler-runtime";
-import { useLanguageFilterStudioContext } from "@sanity/language-filter";
-import { Grid, Button, useToast, Stack, Box, Text, Card, Code, Spinner, Label, MenuButton, Menu, MenuItem, Flex, Tooltip } from "@sanity/ui";
-import { createContext, useContext, useDeferredValue, use, useCallback, useEffect, createElement } from "react";
+import { Grid, Button, useToast, Stack, Box, Text, Card, Code, Spinner, Label, Flex, MenuButton, Tooltip, MenuItem, Menu } from "@sanity/ui";
 import { useDocumentPane } from "sanity/structure";
 import { AddIcon, TranslateIcon, RemoveCircleIcon } from "@sanity/icons";
-import { get, upperFirst, camelCase } from "lodash-es";
+import { useLanguageFilterStudioContext } from "@sanity/language-filter";
+import { createContext, useContext, useDeferredValue, use, useCallback, useEffect, createElement } from "react";
+import get from "lodash-es/get.js";
+import camelCase from "lodash-es/camelCase.js";
+import upperFirst from "lodash-es/upperFirst.js";
 const namespace = "sanity-plugin-internationalized-array", functionCache = /* @__PURE__ */ new Map(), functionKeyCache = /* @__PURE__ */ new WeakMap(), promiseCache = /* @__PURE__ */ new Map();
 function stringifyCacheKey(key) {
   return JSON.stringify(key);
@@ -63,7 +65,8 @@ const preloadWithKey = (fn, key) => {
   apiVersion: "2025-10-15",
   buttonLocations: ["field"],
   buttonAddAll: !0,
-  languageDisplay: "codeOnly"
+  languageDisplay: "codeOnly",
+  includeForDocumentType: (documentType) => documentType !== "translation.metadata"
 }, getDocumentsToTranslate = (value, rootPath = []) => {
   if (Array.isArray(value)) {
     const arrayRootPath = [...rootPath], internationalizedValues = value.filter((item) => {
@@ -91,84 +94,6 @@ const preloadWithKey = (fn, key) => {
 function getLanguageDisplay(languageDisplay, title, code) {
   return languageDisplay === "codeOnly" ? code.toUpperCase() : languageDisplay === "titleOnly" ? title : languageDisplay === "titleAndCode" ? `${title} (${code.toUpperCase()})` : title;
 }
-function AddButtons(props) {
-  const $ = c(6), {
-    languages,
-    readOnly,
-    value,
-    handleClick
-  } = props, {
-    languageDisplay
-  } = useInternationalizedArrayContext();
-  let t0;
-  return $[0] !== handleClick || $[1] !== languageDisplay || $[2] !== languages || $[3] !== readOnly || $[4] !== value ? (t0 = languages.length > 0 ? /* @__PURE__ */ jsx(Grid, { columns: Math.min(languages.length, MAX_COLUMNS[languageDisplay]), gap: 2, children: languages.map((language) => {
-    const languageTitle = getLanguageDisplay(languageDisplay, language.title, language.id);
-    return /* @__PURE__ */ jsx(Button, { tone: "primary", mode: "ghost", fontSize: 1, "data-testid": `add-${language.id}`, disabled: readOnly || !!value?.find((item) => item[LANGUAGE_FIELD_NAME] === language.id), text: languageTitle, icon: languages.length > MAX_COLUMNS[languageDisplay] && languageDisplay === "codeOnly" ? void 0 : AddIcon, value: language.id, onClick: () => handleClick(language.id) }, language.id);
-  }) }) : null, $[0] = handleClick, $[1] = languageDisplay, $[2] = languages, $[3] = readOnly, $[4] = value, $[5] = t0) : t0 = $[5], t0;
-}
-function DocumentAddButtons(props) {
-  const $ = c(13), {
-    filteredLanguages
-  } = useInternationalizedArrayContext(), value = isSanityDocument(props.value) ? props.value : void 0, toast = useToast(), {
-    onChange
-  } = useDocumentPane(), schema = useSchema();
-  let t0;
-  $[0] !== value ? (t0 = getDocumentsToTranslate(value, []), $[0] = value, $[1] = t0) : t0 = $[1];
-  const documentsToTranslation = t0;
-  let t1;
-  $[2] !== schema ? (t1 = (typeName) => {
-    if (!typeName)
-      return;
-    const match = typeName.match(/^internationalizedArray(.+)Value$/);
-    if (!match || !match[1])
-      return;
-    const baseTypeName = match[1].charAt(0).toLowerCase() + match[1].slice(1), arrayBasedTypes = /* @__PURE__ */ new Set(["body", "htmlContent", "blockContent", "portableText"]);
-    if (arrayBasedTypes.has(baseTypeName))
-      return [];
-    const schemaType = schema.get(typeName);
-    if (schemaType && "fields" in schemaType) {
-      const valueField = schemaType.fields.find(_temp$2);
-      if (valueField) {
-        const fieldType = valueField.type;
-        if (fieldType?.jsonType === "array" || fieldType?.name === "array" || fieldType?.type === "array" || fieldType?.of !== void 0 || fieldType?.name && arrayBasedTypes.has(fieldType.name))
-          return [];
-      }
-    }
-  }, $[2] = schema, $[3] = t1) : t1 = $[3];
-  const getInitialValueForType = t1;
-  let t2;
-  $[4] !== documentsToTranslation || $[5] !== getInitialValueForType || $[6] !== onChange || $[7] !== toast ? (t2 = async (languageId) => {
-    const alreadyTranslated = documentsToTranslation.filter((translation) => translation?.[LANGUAGE_FIELD_NAME] === languageId), removeDuplicates = documentsToTranslation.reduce((filteredTranslations, translation_0) => (alreadyTranslated.filter((alreadyTranslation) => alreadyTranslation.pathString === translation_0.pathString).length > 0 || filteredTranslations.filter((filteredTranslation) => filteredTranslation.path === translation_0.path).length > 0 || filteredTranslations.push(translation_0), filteredTranslations), []);
-    if (removeDuplicates.length === 0) {
-      toast.push({
-        status: "error",
-        title: "No internationalizedArray fields found in document root"
-      });
-      return;
-    }
-    const patches = [];
-    for (const toTranslate of removeDuplicates) {
-      const path = toTranslate.path, initialValue = getInitialValueForType(toTranslate._type), ifMissing = setIfMissing([], path), insertValue = insert([{
-        [LANGUAGE_FIELD_NAME]: languageId,
-        _type: toTranslate._type,
-        value: initialValue
-      }], "after", [...path, -1]);
-      patches.push(ifMissing), patches.push(insertValue);
-    }
-    onChange(PatchEvent.from(patches.flat()));
-  }, $[4] = documentsToTranslation, $[5] = getInitialValueForType, $[6] = onChange, $[7] = toast, $[8] = t2) : t2 = $[8];
-  const handleDocumentButtonClick = t2;
-  let t3;
-  $[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t3 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Text, { size: 1, weight: "semibold", children: "Add translation to internationalized fields" }) }), $[9] = t3) : t3 = $[9];
-  let t4;
-  return $[10] !== filteredLanguages || $[11] !== handleDocumentButtonClick ? (t4 = /* @__PURE__ */ jsxs(Stack, { space: 3, children: [
-    t3,
-    /* @__PURE__ */ jsx(AddButtons, { languages: filteredLanguages, readOnly: !1, value: void 0, handleClick: handleDocumentButtonClick })
-  ] }), $[10] = filteredLanguages, $[11] = handleDocumentButtonClick, $[12] = t4) : t4 = $[12], t4;
-}
-function _temp$2(f) {
-  return f.name === "value";
-}
 const getSelectedValue = (select, document) => {
   if (!select || !document)
     return {};
@@ -187,8 +112,9 @@ function useInternationalizedArrayContext() {
   return useContext(InternationalizedArrayContext);
 }
 function InternationalizedArrayProvider(props) {
-  const $ = c(38), {
-    internationalizedArray: internationalizedArray2
+  const $ = c(33), {
+    internationalizedArray: internationalizedArray2,
+    documentType
   } = props;
   let t0;
   $[0] !== internationalizedArray2.apiVersion ? (t0 = {
@@ -237,73 +163,162 @@ function InternationalizedArrayProvider(props) {
   const languagesPromise = t4, languages = languagesPromise ? use(languagesPromise) : internationalizedArray2.languages, {
     selectedLanguageIds,
     options: languageFilterOptions
-  } = useLanguageFilterStudioContext(), documentType = deferredDocument ? deferredDocument._type : void 0;
+  } = useLanguageFilterStudioContext();
   let t5;
-  $[19] !== documentType || $[20] !== languageFilterOptions ? (t5 = typeof documentType == "string" && languageFilterOptions.documentTypes.includes(documentType), $[19] = documentType, $[20] = languageFilterOptions, $[21] = t5) : t5 = $[21];
+  $[19] !== documentType || $[20] !== languageFilterOptions.documentTypes ? (t5 = languageFilterOptions.documentTypes.includes(documentType), $[19] = documentType, $[20] = languageFilterOptions.documentTypes, $[21] = t5) : t5 = $[21];
   const languageFilterEnabled = t5;
   let t6;
   $[22] !== languageFilterEnabled || $[23] !== languages || $[24] !== selectedLanguageIds ? (t6 = languageFilterEnabled ? languages.filter((language) => selectedLanguageIds.includes(language.id)) : languages, $[22] = languageFilterEnabled, $[23] = languages, $[24] = selectedLanguageIds, $[25] = t6) : t6 = $[25];
   const filteredLanguages = t6;
   let t7;
-  $[26] !== internationalizedArray2.buttonLocations ? (t7 = internationalizedArray2.buttonLocations.includes("document"), $[26] = internationalizedArray2.buttonLocations, $[27] = t7) : t7 = $[27];
-  const showDocumentButtons = t7;
-  let t8;
-  $[28] !== filteredLanguages || $[29] !== internationalizedArray2 || $[30] !== languages ? (t8 = {
+  $[26] !== filteredLanguages || $[27] !== internationalizedArray2 || $[28] !== languages ? (t7 = {
     ...internationalizedArray2,
     languages,
     filteredLanguages
-  }, $[28] = filteredLanguages, $[29] = internationalizedArray2, $[30] = languages, $[31] = t8) : t8 = $[31];
-  const context = t8;
-  let t9;
-  $[32] !== props || $[33] !== showDocumentButtons ? (t9 = showDocumentButtons ? /* @__PURE__ */ jsxs(Stack, { space: 5, children: [
-    /* @__PURE__ */ jsx(DocumentAddButtons, { value: props.value }),
-    props.renderDefault(props)
-  ] }) : props.renderDefault(props), $[32] = props, $[33] = showDocumentButtons, $[34] = t9) : t9 = $[34];
-  let t10;
-  return $[35] !== context || $[36] !== t9 ? (t10 = /* @__PURE__ */ jsx(InternationalizedArrayContext.Provider, { value: context, children: t9 }), $[35] = context, $[36] = t9, $[37] = t10) : t10 = $[37], t10;
-}
-const getLanguageId = (fieldParent) => {
-  try {
-    return typeof fieldParent == "object" && fieldParent !== null && // Checks if it's an internationalized array item
-    "_type" in fieldParent && typeof fieldParent._type == "string" && fieldParent._type.startsWith("internationalizedArray") && // Checks if the language field name is in the field and if it's a string
-    LANGUAGE_FIELD_NAME in fieldParent && typeof fieldParent[LANGUAGE_FIELD_NAME] == "string" ? fieldParent[LANGUAGE_FIELD_NAME] : void 0;
-  } catch (error) {
-    console.error("Error getting language id", error);
-    return;
-  }
-};
-function InternationalizedField(props) {
-  const $ = c(11), {
-    languages
+  }, $[26] = filteredLanguages, $[27] = internationalizedArray2, $[28] = languages, $[29] = t7) : t7 = $[29];
+  const context = t7;
+  let t8;
+  return $[30] !== context || $[31] !== props.children ? (t8 = /* @__PURE__ */ jsx(InternationalizedArrayContext.Provider, { value: context, children: props.children }), $[30] = context, $[31] = props.children, $[32] = t8) : t8 = $[32], t8;
+}
+function AddButtons(props) {
+  const $ = c(15), {
+    readOnly,
+    languagesInUse,
+    handleClick
+  } = props, {
+    languageDisplay,
+    filteredLanguages: languages
   } = useInternationalizedArrayContext();
+  if (!languages.length)
+    return null;
+  const t0 = Math.min(languages.length, MAX_COLUMNS[languageDisplay]);
+  let t1;
+  if ($[0] !== handleClick || $[1] !== languageDisplay || $[2] !== languages || $[3] !== languagesInUse || $[4] !== readOnly) {
+    let t22;
+    $[6] !== handleClick || $[7] !== languageDisplay || $[8] !== languages.length || $[9] !== languagesInUse || $[10] !== readOnly ? (t22 = (language) => {
+      const languageTitle = getLanguageDisplay(languageDisplay, language.title, language.id);
+      return /* @__PURE__ */ jsx(Button, { tone: "primary", mode: "ghost", fontSize: 1, "data-testid": `add-${language.id}`, disabled: readOnly || languagesInUse.includes(language.id), text: languageTitle, icon: languages.length > MAX_COLUMNS[languageDisplay] && languageDisplay === "codeOnly" ? void 0 : AddIcon, value: language.id, onClick: () => handleClick(language.id) }, language.id);
+    }, $[6] = handleClick, $[7] = languageDisplay, $[8] = languages.length, $[9] = languagesInUse, $[10] = readOnly, $[11] = t22) : t22 = $[11], t1 = languages.map(t22), $[0] = handleClick, $[1] = languageDisplay, $[2] = languages, $[3] = languagesInUse, $[4] = readOnly, $[5] = t1;
+  } else
+    t1 = $[5];
+  let t2;
+  return $[12] !== t0 || $[13] !== t1 ? (t2 = /* @__PURE__ */ jsx(Grid, { columns: t0, gap: 2, children: t1 }), $[12] = t0, $[13] = t1, $[14] = t2) : t2 = $[14], t2;
+}
+function DocumentAddButtons() {
+  const $ = c(11), getFormValue = useGetFormValue(), toast = useToast(), {
+    onChange
+  } = useDocumentPane(), schema = useSchema();
   let t0;
-  $[0] !== props.path ? (t0 = props.path.slice(0, -1), $[0] = props.path, $[1] = t0) : t0 = $[1];
-  const fieldParent = useFormValue(t0), languageId = getLanguageId(fieldParent), hasValidLanguageId = languageId ? languages.some((l) => l.id === languageId) : !1, t1 = props.title?.toLowerCase() === "value" && hasValidLanguageId ? "" : props.title;
+  $[0] !== schema ? (t0 = (typeName) => {
+    if (!typeName)
+      return;
+    const match = typeName.match(/^internationalizedArray(.+)Value$/);
+    if (!match || !match[1])
+      return;
+    const baseTypeName = match[1].charAt(0).toLowerCase() + match[1].slice(1), arrayBasedTypes = /* @__PURE__ */ new Set(["body", "htmlContent", "blockContent", "portableText"]);
+    if (arrayBasedTypes.has(baseTypeName))
+      return [];
+    const schemaType = schema.get(typeName);
+    if (schemaType && "fields" in schemaType) {
+      const valueField = schemaType.fields.find(_temp$2);
+      if (valueField) {
+        const fieldType = valueField.type;
+        if (fieldType?.jsonType === "array" || fieldType?.name === "array" || fieldType?.type === "array" || fieldType?.of !== void 0 || fieldType?.name && arrayBasedTypes.has(fieldType.name))
+          return [];
+      }
+    }
+  }, $[0] = schema, $[1] = t0) : t0 = $[1];
+  const getInitialValueForType = t0;
+  let t1;
+  $[2] !== getFormValue || $[3] !== getInitialValueForType || $[4] !== onChange || $[5] !== toast ? (t1 = async (languageId) => {
+    const value = getFormValue([]);
+    if (!isSanityDocument(value)) {
+      toast.push({
+        status: "error",
+        title: "No document value found"
+      });
+      return;
+    }
+    const documentsToTranslation = getDocumentsToTranslate(value, []), alreadyTranslated = documentsToTranslation.filter((translation) => translation?.[LANGUAGE_FIELD_NAME] === languageId), removeDuplicates = documentsToTranslation.reduce((filteredTranslations, translation_0) => (alreadyTranslated.filter((alreadyTranslation) => alreadyTranslation.pathString === translation_0.pathString).length > 0 || filteredTranslations.filter((filteredTranslation) => filteredTranslation.path === translation_0.path).length > 0 || filteredTranslations.push(translation_0), filteredTranslations), []);
+    if (removeDuplicates.length === 0) {
+      toast.push({
+        status: "error",
+        title: "No internationalizedArray fields found in document root"
+      });
+      return;
+    }
+    const patches = [];
+    for (const toTranslate of removeDuplicates) {
+      const path = toTranslate.path, initialValue = getInitialValueForType(toTranslate._type), ifMissing = setIfMissing([], path), insertValue = insert([{
+        [LANGUAGE_FIELD_NAME]: languageId,
+        _type: toTranslate._type,
+        value: initialValue
+      }], "after", [...path, -1]);
+      patches.push(ifMissing), patches.push(insertValue);
+    }
+    onChange(PatchEvent.from(patches.flat()));
+  }, $[2] = getFormValue, $[3] = getInitialValueForType, $[4] = onChange, $[5] = toast, $[6] = t1) : t1 = $[6];
+  const handleDocumentButtonClick = t1;
   let t2;
-  $[2] !== props || $[3] !== t1 ? (t2 = {
-    ...props,
-    title: t1
-  }, $[2] = props, $[3] = t1, $[4] = t2) : t2 = $[4];
-  const customProps = t2;
-  if (!customProps.schemaType.name.startsWith("internationalizedArray")) {
-    let t32;
-    return $[5] !== customProps ? (t32 = customProps.renderDefault(customProps), $[5] = customProps, $[6] = t32) : t32 = $[6], t32;
+  $[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Text, { size: 1, weight: "semibold", children: "Add translation to internationalized fields" }) }), $[7] = t2) : t2 = $[7];
+  let t3;
+  $[8] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t3 = [], $[8] = t3) : t3 = $[8];
+  let t4;
+  return $[9] !== handleDocumentButtonClick ? (t4 = /* @__PURE__ */ jsxs(Stack, { space: 3, children: [
+    t2,
+    /* @__PURE__ */ jsx(AddButtons, { readOnly: !1, handleClick: handleDocumentButtonClick, languagesInUse: t3 })
+  ] }), $[9] = handleDocumentButtonClick, $[10] = t4) : t4 = $[10], t4;
+}
+function _temp$2(f) {
+  return f.name === "value";
+}
+function InternationalizedArrayFormInput(props) {
+  const $ = c(7);
+  if (props.pluginConfig?.buttonLocations?.includes("document")) {
+    let t02;
+    $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t02 = /* @__PURE__ */ jsx(DocumentAddButtons, {}), $[0] = t02) : t02 = $[0];
+    let t1;
+    $[1] !== props ? (t1 = props.renderDefault(props), $[1] = props, $[2] = t1) : t1 = $[2];
+    let t2;
+    return $[3] !== t1 ? (t2 = /* @__PURE__ */ jsxs(Stack, { space: 5, children: [
+      t02,
+      t1
+    ] }), $[3] = t1, $[4] = t2) : t2 = $[4], t2;
+  }
+  let t0;
+  return $[5] !== props ? (t0 = props.renderDefault(props), $[5] = props, $[6] = t0) : t0 = $[6], t0;
+}
+function hasInternationalizedArrayField(schemaType) {
+  return isDocumentSchemaType(schemaType) ? hasInternationalizedArrayInFields(schemaType.fields) : !1;
+}
+function hasInternationalizedArrayInFields(fields) {
+  for (const field of fields) {
+    if (field.type.name.startsWith("internationalizedArray") || field.type.jsonType === "object" && hasInternationalizedArrayInFields(field.type.fields))
+      return !0;
+    if (field.type.jsonType === "array" && field.type.of.length > 0) {
+      for (const item of field.type.of)
+        if ("name" in item && typeof item.name == "string" && item.name.startsWith("internationalizedArray") || "fields" in item && Array.isArray(item.fields) && hasInternationalizedArrayInFields(item.fields))
+          return !0;
+    }
   }
-  if (customProps.schemaType.name === "reference" && customProps.value) {
-    let t32;
-    return $[7] !== customProps ? (t32 = customProps.renderDefault({
-      ...customProps,
-      title: "",
-      level: 0
-    }), $[7] = customProps, $[8] = t32) : t32 = $[8], t32;
+  return !1;
+}
+function InternationalizedArrayLayout(props) {
+  const $ = c(10), schemaType = useSchema().get(props.documentType);
+  if (!schemaType) {
+    console.error(`Schema type not found: ${props.documentType}`);
+    let t02;
+    return $[0] !== props ? (t02 = props.renderDefault(props), $[0] = props, $[1] = t02) : t02 = $[1], t02;
   }
-  if (customProps.schemaType.name === "string" || customProps.schemaType.name === "number" || customProps.schemaType.name === "text")
-    return customProps.children;
-  let t3;
-  return $[9] !== customProps ? (t3 = customProps.renderDefault({
-    ...customProps,
-    level: 0
-  }), $[9] = customProps, $[10] = t3) : t3 = $[10], t3;
+  if (hasInternationalizedArrayField(schemaType) && props.pluginConfig.includeForDocumentType(props.documentType)) {
+    const t02 = props.pluginConfig, t1 = props.documentType;
+    let t2;
+    $[2] !== props ? (t2 = props.renderDefault(props), $[2] = props, $[3] = t2) : t2 = $[3];
+    let t3;
+    return $[4] !== props.documentType || $[5] !== props.pluginConfig || $[6] !== t2 ? (t3 = /* @__PURE__ */ jsx(InternationalizedArrayProvider, { internationalizedArray: t02, documentType: t1, children: t2 }), $[4] = props.documentType, $[5] = props.pluginConfig, $[6] = t2, $[7] = t3) : t3 = $[7], t3;
+  }
+  let t0;
+  return $[8] !== props ? (t0 = props.renderDefault(props), $[8] = props, $[9] = t0) : t0 = $[9], t0;
 }
 function Preload(props) {
   const $ = c(2);
@@ -476,13 +491,13 @@ function Feedback() {
   ] }) }), $[3] = t3) : t3 = $[3], t3;
 }
 function InternationalizedArray(props) {
-  const $ = c(89), {
+  const $ = c(90), {
     members,
     value: _value,
     schemaType,
     onChange,
     readOnly: documentReadOnly
-  } = props, value = _value, readOnly = typeof schemaType.readOnly == "boolean" ? schemaType.readOnly : !1, toast = useToast(), {
+  } = props, value = _value, readOnly = typeof schemaType.readOnly == "boolean" ? schemaType.readOnly : !1, toast = useToast(), getFormValue = useGetFormValue(), {
     languages,
     filteredLanguages,
     defaultLanguages,
@@ -507,7 +522,8 @@ function InternationalizedArray(props) {
   }) : members, $[4] = languageFilterEnabled, $[5] = languageFilterOptions, $[6] = members, $[7] = selectedLanguageIds, $[8] = t2) : t2 = $[8];
   const filteredMembers = t2;
   let t3;
-  $[9] !== filteredLanguages || $[10] !== languages || $[11] !== onChange || $[12] !== schemaType.name || $[13] !== value ? (t3 = (addLanguageKeys) => {
+  $[9] !== filteredLanguages || $[10] !== getFormValue || $[11] !== languages || $[12] !== onChange || $[13] !== props.path || $[14] !== schemaType.name ? (t3 = (addLanguageKeys) => {
+    const formValue = getFormValue(props.path);
     if (!filteredLanguages?.length)
       return;
     const patches = createAddLanguagePatches({
@@ -515,55 +531,59 @@ function InternationalizedArray(props) {
       schemaTypeName: schemaType.name,
       languages,
       filteredLanguages,
-      value
+      value: formValue
     });
     onChange([setIfMissing([]), ...patches]);
-  }, $[9] = filteredLanguages, $[10] = languages, $[11] = onChange, $[12] = schemaType.name, $[13] = value, $[14] = t3) : t3 = $[14];
-  const handleAddLanguage = t3, {
+  }, $[9] = filteredLanguages, $[10] = getFormValue, $[11] = languages, $[12] = onChange, $[13] = props.path, $[14] = schemaType.name, $[15] = t3) : t3 = $[15];
+  const handleAddLanguages = t3, {
     isDeleting
   } = useDocumentPane();
   let t4;
-  bb0: {
-    if (!value?.length) {
-      let t53;
-      $[15] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t53 = [], $[15] = t53) : t53 = $[15], t4 = t53;
-      break bb0;
-    }
-    let t52;
-    $[16] !== value ? (t52 = value.map(_temp$1).filter(Boolean), $[16] = value, $[17] = t52) : t52 = $[17], t4 = t52;
-  }
-  const addedLanguages = t4;
+  $[16] !== value ? (t4 = value?.map(_temp$1).filter(Boolean).join(","), $[16] = value, $[17] = t4) : t4 = $[17];
+  const languageKeysFromValue = t4;
   let t5;
-  if ($[18] !== addedLanguages || $[19] !== defaultLanguages || $[20] !== languages) {
-    let t62;
-    $[22] !== languages ? (t62 = (language) => languages.find((l) => l.id === language), $[22] = languages, $[23] = t62) : t62 = $[23];
-    let t72;
-    $[24] !== addedLanguages ? (t72 = (language_0) => addedLanguages.includes(language_0), $[24] = addedLanguages, $[25] = t72) : t72 = $[25], t5 = defaultLanguages.filter(t62).every(t72), $[18] = addedLanguages, $[19] = defaultLanguages, $[20] = languages, $[21] = t5;
+  if ($[18] !== languageKeysFromValue || $[19] !== languages) {
+    bb0: {
+      const languageKeys = languageKeysFromValue?.split(",") || [];
+      if (!languageKeys?.length) {
+        let t62;
+        $[21] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t62 = [], $[21] = t62) : t62 = $[21], t5 = t62;
+        break bb0;
+      }
+      if (!languages?.length) {
+        let t62;
+        $[22] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t62 = [], $[22] = t62) : t62 = $[22], t5 = t62;
+        break bb0;
+      }
+      t5 = languages.filter((l) => languageKeys?.find((key) => key === l.id)).map(_temp2$1);
+    }
+    $[18] = languageKeysFromValue, $[19] = languages, $[20] = t5;
   } else
-    t5 = $[21];
-  const hasAddedDefaultLanguages = t5;
+    t5 = $[20];
+  const addedLanguages = t5;
   let t6, t7;
-  $[26] !== addedLanguages || $[27] !== defaultLanguages || $[28] !== documentReadOnly || $[29] !== handleAddLanguage || $[30] !== hasAddedDefaultLanguages || $[31] !== isDeleting || $[32] !== languages ? (t6 = () => {
+  $[23] !== addedLanguages || $[24] !== defaultLanguages || $[25] !== documentReadOnly || $[26] !== handleAddLanguages || $[27] !== isDeleting || $[28] !== languages ? (t6 = () => {
+    const hasAddedDefaultLanguages = defaultLanguages.filter((language) => languages.find((l_1) => l_1.id === language)).every((language_0) => addedLanguages.includes(language_0));
     if (!isDeleting && !hasAddedDefaultLanguages) {
-      const languagesToAdd = defaultLanguages.filter((language_1) => !addedLanguages.includes(language_1)).filter((language_2) => languages.find((l_0) => l_0.id === language_2)), timeout = setTimeout(() => {
-        documentReadOnly || handleAddLanguage(languagesToAdd);
+      const languagesToAdd = defaultLanguages.filter((language_1) => !addedLanguages.includes(language_1)).filter((language_2) => languages.find((l_2) => l_2.id === language_2)), timeout = setTimeout(() => {
+        documentReadOnly || handleAddLanguages(languagesToAdd);
       });
       return () => clearTimeout(timeout);
     }
-  }, t7 = [isDeleting, hasAddedDefaultLanguages, handleAddLanguage, defaultLanguages, addedLanguages, languages, documentReadOnly], $[26] = addedLanguages, $[27] = defaultLanguages, $[28] = documentReadOnly, $[29] = handleAddLanguage, $[30] = hasAddedDefaultLanguages, $[31] = isDeleting, $[32] = languages, $[33] = t6, $[34] = t7) : (t6 = $[33], t7 = $[34]), useEffect(t6, t7);
+  }, t7 = [isDeleting, handleAddLanguages, defaultLanguages, addedLanguages, languages, documentReadOnly], $[23] = addedLanguages, $[24] = defaultLanguages, $[25] = documentReadOnly, $[26] = handleAddLanguages, $[27] = isDeleting, $[28] = languages, $[29] = t6, $[30] = t7) : (t6 = $[29], t7 = $[30]), useEffect(t6, t7);
   let t8;
-  $[35] !== languages || $[36] !== onChange || $[37] !== toast || $[38] !== value ? (t8 = () => {
+  $[31] !== languages || $[32] !== onChange || $[33] !== toast || $[34] !== value ? (t8 = () => {
     if (!value?.length || !languages?.length)
       return;
     const updatedValue = value.reduce((acc, v_0) => {
-      const newIndex = languages.findIndex((l_1) => l_1.id === v_0?.[LANGUAGE_FIELD_NAME]);
+      const newIndex = languages.findIndex((l_3) => l_3.id === v_0?.[LANGUAGE_FIELD_NAME]);
       return newIndex > -1 && (acc[newIndex] = v_0), acc;
     }, []).filter(Boolean);
     value?.length !== updatedValue.length && toast.push({
       title: "There was an error reordering languages",
       status: "warning"
     }), onChange(set(updatedValue));
-  }, $[35] = languages, $[36] = onChange, $[37] = toast, $[38] = value, $[39] = t8) : t8 = $[39];
+  }, $[31] = languages, $[32] = onChange, $[33] = toast, $[34] = value, $[35] = t8) : t8 = $[35];
   const handleRestoreOrder = t8;
   let t9;
   bb1: {
@@ -572,66 +592,78 @@ function InternationalizedArray(props) {
       break bb1;
     }
     let t102;
-    $[40] !== languages || $[41] !== value ? (t102 = value?.every((v_1) => languages.find((l_2) => l_2?.id === v_1?.[LANGUAGE_FIELD_NAME])), $[40] = languages, $[41] = value, $[42] = t102) : t102 = $[42], t9 = t102;
+    $[36] !== languages || $[37] !== value ? (t102 = value?.every((v_1) => languages.find((l_4) => l_4?.id === v_1?.[LANGUAGE_FIELD_NAME])), $[36] = languages, $[37] = value, $[38] = t102) : t102 = $[38], t9 = t102;
   }
   const allKeysAreLanguages = t9;
   let t10;
-  $[43] !== languages || $[44] !== value ? (t10 = languages && languages.length > 1 ? languages.filter((l_3) => value?.find((v_2) => v_2[LANGUAGE_FIELD_NAME] === l_3.id)) : [], $[43] = languages, $[44] = value, $[45] = t10) : t10 = $[45];
-  const languagesInUse = t10;
-  let t11;
   bb2: {
-    if (!value?.length || !languagesInUse.length) {
-      let t123;
-      $[46] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t123 = [], $[46] = t123) : t123 = $[46], t11 = t123;
+    if (!value?.length || !addedLanguages.length) {
+      let t113;
+      $[39] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t113 = [], $[39] = t113) : t113 = $[39], t10 = t113;
       break bb2;
     }
-    let t122;
-    if ($[47] !== languagesInUse || $[48] !== value) {
-      let t132;
-      $[50] !== languagesInUse ? (t132 = (v_3, vIndex) => vIndex === languagesInUse.findIndex((l_4) => l_4.id === v_3[LANGUAGE_FIELD_NAME]) ? null : v_3, $[50] = languagesInUse, $[51] = t132) : t132 = $[51], t122 = value.map(t132).filter(Boolean), $[47] = languagesInUse, $[48] = value, $[49] = t122;
+    let t112;
+    if ($[40] !== addedLanguages || $[41] !== value) {
+      let t122;
+      $[43] !== addedLanguages ? (t122 = (v_2, vIndex) => vIndex === addedLanguages.findIndex((language_3) => language_3 === v_2[LANGUAGE_FIELD_NAME]) ? null : v_2, $[43] = addedLanguages, $[44] = t122) : t122 = $[44], t112 = value.map(t122).filter(Boolean), $[40] = addedLanguages, $[41] = value, $[42] = t112;
     } else
-      t122 = $[49];
-    t11 = t122;
+      t112 = $[42];
+    t10 = t112;
   }
-  const languagesOutOfOrder = t11, languagesAreValid = !languages?.length || languages?.length && languages.every(_temp2$1);
-  let t12;
-  $[52] !== allKeysAreLanguages || $[53] !== documentReadOnly || $[54] !== handleRestoreOrder || $[55] !== languagesOutOfOrder.length ? (t12 = () => {
+  const languagesOutOfOrder = t10, languagesAreValid = !languages?.length || languages?.length && languages.every(_temp3$1);
+  let t11;
+  $[45] !== allKeysAreLanguages || $[46] !== documentReadOnly || $[47] !== handleRestoreOrder || $[48] !== languagesOutOfOrder.length ? (t11 = () => {
     languagesOutOfOrder.length > 0 && allKeysAreLanguages && !documentReadOnly && handleRestoreOrder();
-  }, $[52] = allKeysAreLanguages, $[53] = documentReadOnly, $[54] = handleRestoreOrder, $[55] = languagesOutOfOrder.length, $[56] = t12) : t12 = $[56];
+  }, $[45] = allKeysAreLanguages, $[46] = documentReadOnly, $[47] = handleRestoreOrder, $[48] = languagesOutOfOrder.length, $[49] = t11) : t11 = $[49];
+  let t12;
+  $[50] !== allKeysAreLanguages || $[51] !== documentReadOnly || $[52] !== handleRestoreOrder || $[53] !== languagesOutOfOrder ? (t12 = [languagesOutOfOrder, allKeysAreLanguages, handleRestoreOrder, documentReadOnly], $[50] = allKeysAreLanguages, $[51] = documentReadOnly, $[52] = handleRestoreOrder, $[53] = languagesOutOfOrder, $[54] = t12) : t12 = $[54], useEffect(t11, t12);
   let t13;
-  $[57] !== allKeysAreLanguages || $[58] !== documentReadOnly || $[59] !== handleRestoreOrder || $[60] !== languagesOutOfOrder ? (t13 = [languagesOutOfOrder, allKeysAreLanguages, handleRestoreOrder, documentReadOnly], $[57] = allKeysAreLanguages, $[58] = documentReadOnly, $[59] = handleRestoreOrder, $[60] = languagesOutOfOrder, $[61] = t13) : t13 = $[61], useEffect(t12, t13);
+  $[55] !== filteredLanguages || $[56] !== value ? (t13 = checkAllLanguagesArePresent(filteredLanguages, value), $[55] = filteredLanguages, $[56] = value, $[57] = t13) : t13 = $[57];
+  const allLanguagesArePresent = t13;
   let t14;
-  $[62] !== filteredLanguages || $[63] !== value ? (t14 = checkAllLanguagesArePresent(filteredLanguages, value), $[62] = filteredLanguages, $[63] = value, $[64] = t14) : t14 = $[64];
-  const allLanguagesArePresent = t14;
+  $[58] !== filteredLanguages || $[59] !== handleAddLanguages ? (t14 = () => {
+    handleAddLanguages(filteredLanguages.map(_temp4$1));
+  }, $[58] = filteredLanguages, $[59] = handleAddLanguages, $[60] = t14) : t14 = $[60];
+  const addAllMissingLanguages = t14;
   if (!languagesAreValid) {
     let t152;
-    return $[65] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t152 = /* @__PURE__ */ jsx(Feedback, {}), $[65] = t152) : t152 = $[65], t152;
+    return $[61] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t152 = /* @__PURE__ */ jsx(Feedback, {}), $[61] = t152) : t152 = $[61], t152;
   }
   let t15;
-  $[66] !== allLanguagesArePresent || $[67] !== buttonLocations || $[68] !== filteredLanguages?.length ? (t15 = buttonLocations.includes("field") && filteredLanguages?.length > 0 && !allLanguagesArePresent, $[66] = allLanguagesArePresent, $[67] = buttonLocations, $[68] = filteredLanguages?.length, $[69] = t15) : t15 = $[69];
+  $[62] !== allLanguagesArePresent || $[63] !== buttonLocations || $[64] !== filteredLanguages.length ? (t15 = buttonLocations.includes("field") && filteredLanguages?.length > 0 && !allLanguagesArePresent, $[62] = allLanguagesArePresent, $[63] = buttonLocations, $[64] = filteredLanguages.length, $[65] = t15) : t15 = $[65];
   const addButtonsAreVisible = t15, fieldHasMembers = members?.length > 0;
   let t16;
-  $[70] !== fieldHasMembers || $[71] !== filteredMembers || $[72] !== props ? (t16 = fieldHasMembers ? /* @__PURE__ */ jsx(Fragment, { children: filteredMembers.map((member_0) => member_0.kind === "item" ? /* @__PURE__ */ createElement(ArrayOfObjectsItem, { ...props, key: member_0.key, member: member_0 }) : /* @__PURE__ */ jsx(MemberItemError, { member: member_0 }, member_0.key)) }) : null, $[70] = fieldHasMembers, $[71] = filteredMembers, $[72] = props, $[73] = t16) : t16 = $[73];
+  $[66] !== filteredLanguages || $[67] !== value ? (t16 = createAddAllTitle(value, filteredLanguages), $[66] = filteredLanguages, $[67] = value, $[68] = t16) : t16 = $[68];
+  const addAllTitle = t16;
   let t17;
-  $[74] !== addButtonsAreVisible || $[75] !== fieldHasMembers ? (t17 = !addButtonsAreVisible && !fieldHasMembers ? /* @__PURE__ */ jsx(Card, { border: !0, tone: "transparent", padding: 3, radius: 2, children: /* @__PURE__ */ jsx(Text, { size: 1, children: "This internationalized field currently has no translations." }) }) : null, $[74] = addButtonsAreVisible, $[75] = fieldHasMembers, $[76] = t17) : t17 = $[76];
+  if ($[69] !== filteredMembers || $[70] !== props) {
+    let t182;
+    $[72] !== props ? (t182 = (member_0) => member_0.kind === "item" ? /* @__PURE__ */ createElement(ArrayOfObjectsItem, { ...props, key: member_0.key, member: member_0 }) : /* @__PURE__ */ jsx(MemberItemError, { member: member_0 }, member_0.key), $[72] = props, $[73] = t182) : t182 = $[73], t17 = filteredMembers.map(t182), $[69] = filteredMembers, $[70] = props, $[71] = t17;
+  } else
+    t17 = $[71];
   let t18;
-  $[77] !== addButtonsAreVisible || $[78] !== allLanguagesArePresent || $[79] !== buttonAddAll || $[80] !== filteredLanguages || $[81] !== handleAddLanguage || $[82] !== readOnly || $[83] !== value ? (t18 = addButtonsAreVisible ? /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
-    /* @__PURE__ */ jsx(AddButtons, { languages: filteredLanguages, value, readOnly, handleClick: handleAddLanguage }),
-    buttonAddAll ? /* @__PURE__ */ jsx(Button, { tone: "primary", mode: "ghost", "data-testid": "add-all-languages", disabled: readOnly || allLanguagesArePresent, icon: AddIcon, text: createAddAllTitle(value, filteredLanguages), onClick: () => handleAddLanguage(filteredLanguages.map(_temp3$1)) }) : null
-  ] }) : null, $[77] = addButtonsAreVisible, $[78] = allLanguagesArePresent, $[79] = buttonAddAll, $[80] = filteredLanguages, $[81] = handleAddLanguage, $[82] = readOnly, $[83] = value, $[84] = t18) : t18 = $[84];
+  $[74] !== addButtonsAreVisible || $[75] !== fieldHasMembers ? (t18 = !addButtonsAreVisible && !fieldHasMembers ? /* @__PURE__ */ jsx(Card, { border: !0, tone: "transparent", padding: 3, radius: 2, children: /* @__PURE__ */ jsx(Text, { size: 1, children: "This internationalized field currently has no translations." }) }) : null, $[74] = addButtonsAreVisible, $[75] = fieldHasMembers, $[76] = t18) : t18 = $[76];
   let t19;
-  return $[85] !== t16 || $[86] !== t17 || $[87] !== t18 ? (t19 = /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
-    t16,
+  $[77] !== addAllMissingLanguages || $[78] !== addAllTitle || $[79] !== addButtonsAreVisible || $[80] !== addedLanguages || $[81] !== allLanguagesArePresent || $[82] !== buttonAddAll || $[83] !== handleAddLanguages || $[84] !== readOnly ? (t19 = addButtonsAreVisible ? /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
+    /* @__PURE__ */ jsx(AddButtons, { languagesInUse: addedLanguages, readOnly, handleClick: handleAddLanguages }),
+    buttonAddAll ? /* @__PURE__ */ jsx(Button, { tone: "primary", mode: "ghost", "data-testid": "add-all-languages", disabled: readOnly || allLanguagesArePresent, icon: AddIcon, text: addAllTitle, onClick: addAllMissingLanguages }) : null
+  ] }) : null, $[77] = addAllMissingLanguages, $[78] = addAllTitle, $[79] = addButtonsAreVisible, $[80] = addedLanguages, $[81] = allLanguagesArePresent, $[82] = buttonAddAll, $[83] = handleAddLanguages, $[84] = readOnly, $[85] = t19) : t19 = $[85];
+  let t20;
+  return $[86] !== t17 || $[87] !== t18 || $[88] !== t19 ? (t20 = /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
     t17,
-    t18
-  ] }), $[85] = t16, $[86] = t17, $[87] = t18, $[88] = t19) : t19 = $[88], t19;
+    t18,
+    t19
+  ] }), $[86] = t17, $[87] = t18, $[88] = t19, $[89] = t20) : t20 = $[89], t20;
 }
-function _temp3$1(language_3) {
-  return language_3.id;
+function _temp4$1(language_4) {
+  return language_4.id;
 }
-function _temp2$1(item) {
+function _temp3$1(item) {
   return item.id && item.title;
 }
+function _temp2$1(l_0) {
+  return l_0.id;
+}
 function _temp$1(v) {
   return v[LANGUAGE_FIELD_NAME] ?? v._key;
 }
@@ -650,6 +682,11 @@ var array = (config) => {
     title: "Internationalized array",
     type: "array",
     components: {
+      field: (props) => props.renderDefault({
+        ...props,
+        // Reset the level to avoid nested styling
+        level: 0
+      }),
       input: InternationalizedArray
     },
     options: {
@@ -716,75 +753,149 @@ function getToneFromValidation(validations) {
   if (validationLevels.has("warning"))
     return "caution";
 }
-function InternationalizedInput(props) {
-  const $ = c(13);
+function ChangeLanguageButton(props) {
+  const $ = c(24), {
+    value,
+    onChange,
+    path
+  } = props;
   let t0;
-  $[0] !== props.path ? (t0 = props.path.slice(0, -1), $[0] = props.path, $[1] = t0) : t0 = $[1];
-  const parentValue = useFormValue(t0), originalOnChange = props.inputProps.onChange;
+  $[0] !== path ? (t0 = path.slice(0, -1), $[0] = path, $[1] = t0) : t0 = $[1];
+  const parentValue = useFormValue(t0), {
+    languages
+  } = useInternationalizedArrayContext();
+  let t1;
+  $[2] !== parentValue ? (t1 = parentValue?.map(_temp) ?? [], $[2] = parentValue, $[3] = t1) : t1 = $[3];
+  const languageKeysInUse = t1;
+  let t2;
+  $[4] !== languages || $[5] !== onChange || $[6] !== value ? (t2 = (event) => {
+    const languageId = event?.currentTarget?.value;
+    !value || !languages?.length || !languages.find((l) => l.id === languageId) || onChange([set(languageId, [LANGUAGE_FIELD_NAME])]);
+  }, $[4] = languages, $[5] = onChange, $[6] = value, $[7] = t2) : t2 = $[7];
+  const handleKeyChange = t2, t3 = `Change "${value[LANGUAGE_FIELD_NAME]}"`;
+  let t4;
+  $[8] !== t3 ? (t4 = /* @__PURE__ */ jsx(Button, { fontSize: 1, text: t3 }), $[8] = t3, $[9] = t4) : t4 = $[9];
+  const t5 = `${value[LANGUAGE_FIELD_NAME]}-change-key`;
+  let t6;
+  if ($[10] !== handleKeyChange || $[11] !== languageKeysInUse || $[12] !== languages) {
+    let t72;
+    $[14] !== handleKeyChange || $[15] !== languageKeysInUse ? (t72 = (lang) => /* @__PURE__ */ jsx(MenuItem, { disabled: languageKeysInUse.includes(lang.id), fontSize: 1, text: lang.id.toLocaleUpperCase(), value: lang.id, onClick: handleKeyChange }, lang.id), $[14] = handleKeyChange, $[15] = languageKeysInUse, $[16] = t72) : t72 = $[16], t6 = languages.map(t72), $[10] = handleKeyChange, $[11] = languageKeysInUse, $[12] = languages, $[13] = t6;
+  } else
+    t6 = $[13];
+  let t7;
+  $[17] !== t6 ? (t7 = /* @__PURE__ */ jsx(Menu, { children: t6 }), $[17] = t6, $[18] = t7) : t7 = $[18];
+  let t8;
+  $[19] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t8 = {
+    portal: !0
+  }, $[19] = t8) : t8 = $[19];
+  let t9;
+  return $[20] !== t4 || $[21] !== t5 || $[22] !== t7 ? (t9 = /* @__PURE__ */ jsx(MenuButton, { button: t4, id: t5, menu: t7, popover: t8 }), $[20] = t4, $[21] = t5, $[22] = t7, $[23] = t9) : t9 = $[23], t9;
+}
+function _temp(v) {
+  return v[LANGUAGE_FIELD_NAME];
+}
+function RemoveButton(t0) {
+  const $ = c(10), {
+    isDefault,
+    readOnly,
+    onChange
+  } = t0;
   let t1;
-  $[2] !== originalOnChange || $[3] !== props.value?.value ? (t1 = (patches) => {
+  $[0] !== onChange ? (t1 = () => {
+    onChange(unset());
+  }, $[0] = onChange, $[1] = t1) : t1 = $[1];
+  const handleUnset = t1, t2 = !isDefault;
+  let t3, t4;
+  $[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t3 = /* @__PURE__ */ jsx(Text, { muted: !0, size: 1, children: "Can't remove default language" }), t4 = ["right", "left"], $[2] = t3, $[3] = t4) : (t3 = $[2], t4 = $[3]);
+  const t5 = readOnly || isDefault;
+  let t6;
+  $[4] !== handleUnset || $[5] !== t5 ? (t6 = /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(Button, { mode: "bleed", icon: RemoveCircleIcon, tone: "critical", disabled: t5, onClick: handleUnset }) }), $[4] = handleUnset, $[5] = t5, $[6] = t6) : t6 = $[6];
+  let t7;
+  return $[7] !== t2 || $[8] !== t6 ? (t7 = /* @__PURE__ */ jsx(Tooltip, { animate: !0, disabled: t2, content: t3, fallbackPlacements: t4, placement: "top", portal: !0, children: t6 }), $[7] = t2, $[8] = t6, $[9] = t7) : t7 = $[9], t7;
+}
+function InternationalizedInput(props) {
+  const $ = c(50), originalOnChange = props.inputProps.onChange;
+  let t0;
+  $[0] !== originalOnChange || $[1] !== props.value?.value ? (t0 = (patches) => {
     if (!Array.isArray(patches))
       return originalOnChange(patches);
     const valueField = props.value?.value;
-    if ((valueField == null || Array.isArray(valueField) && valueField.length === 0) && patches.some(_temp)) {
+    if ((valueField == null || Array.isArray(valueField) && valueField.length === 0) && patches.some(_temp2)) {
       const initPatch = valueField === void 0 ? {
         type: "setIfMissing",
         path: ["value"],
         value: []
-      } : null, fixedPatches = patches.map(_temp2), allPatches = initPatch ? [initPatch, ...fixedPatches] : fixedPatches;
+      } : null, fixedPatches = patches.map(_temp3), allPatches = initPatch ? [initPatch, ...fixedPatches] : fixedPatches;
       return originalOnChange(allPatches);
     }
     return originalOnChange(patches);
-  }, $[2] = originalOnChange, $[3] = props.value?.value, $[4] = t1) : t1 = $[4];
-  const wrappedOnChange = t1, inlineProps = {
-    ...props.inputProps,
-    members: props.inputProps.members.filter(_temp3),
+  }, $[0] = originalOnChange, $[1] = props.value?.value, $[2] = t0) : t0 = $[2];
+  const wrappedOnChange = t0, t1 = props.inputProps;
+  let t2;
+  $[3] !== props.inputProps.members ? (t2 = props.inputProps.members.filter(_temp4), $[3] = props.inputProps.members, $[4] = t2) : t2 = $[4];
+  let t3;
+  $[5] !== props.inputProps || $[6] !== props.value || $[7] !== t2 || $[8] !== wrappedOnChange ? (t3 = {
+    ...t1,
+    members: t2,
     value: props.value,
     onChange: wrappedOnChange
-  }, {
+  }, $[5] = props.inputProps, $[6] = props.value, $[7] = t2, $[8] = wrappedOnChange, $[9] = t3) : t3 = $[9];
+  const inlineProps = t3, {
     validation,
     value,
-    onChange,
     readOnly
   } = inlineProps, {
     languages,
     languageDisplay,
     defaultLanguages
   } = useInternationalizedArrayContext();
-  let t2;
-  $[5] !== parentValue ? (t2 = parentValue?.map(_temp4) ?? [], $[5] = parentValue, $[6] = t2) : t2 = $[6];
-  const languageKeysInUse = t2, keyIsValid = languages?.length ? languages.find((l) => l.id === value[LANGUAGE_FIELD_NAME]) : !1, handleKeyChange = (event) => {
-    const languageId = event?.currentTarget?.value;
-    !value || !languages?.length || !languages.find((l_0) => l_0.id === languageId) || onChange([set(languageId, [LANGUAGE_FIELD_NAME])]);
-  }, handleUnset = () => {
-    onChange(unset());
-  };
+  let t4;
+  $[10] !== languages || $[11] !== value ? (t4 = languages?.length ? languages.find((l) => l.id === value[LANGUAGE_FIELD_NAME]) : !1, $[10] = languages, $[11] = value, $[12] = t4) : t4 = $[12];
+  const keyIsValid = t4;
   if (!languages) {
-    let t32;
-    return $[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t32 = /* @__PURE__ */ jsx(Spinner, {}), $[7] = t32) : t32 = $[7], t32;
+    let t52;
+    return $[13] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t52 = /* @__PURE__ */ jsx(Spinner, {}), $[13] = t52) : t52 = $[13], t52;
   }
-  const language = languages.find((l_1) => l_1.id === value[LANGUAGE_FIELD_NAME]), languageTitle = keyIsValid && language ? getLanguageDisplay(languageDisplay, language.title, language.id) : "", isDefault = defaultLanguages.includes(value[LANGUAGE_FIELD_NAME]), removeButton = /* @__PURE__ */ jsx(Button, { mode: "bleed", icon: RemoveCircleIcon, tone: "critical", disabled: readOnly || isDefault, onClick: handleUnset }), t3 = getToneFromValidation(validation), t4 = keyIsValid ? /* @__PURE__ */ jsx(Label, { muted: !0, size: 1, children: languageTitle }) : /* @__PURE__ */ jsx(MenuButton, { button: /* @__PURE__ */ jsx(Button, { fontSize: 1, text: `Change "${value[LANGUAGE_FIELD_NAME]}"` }), id: `${value[LANGUAGE_FIELD_NAME]}-change-key`, menu: /* @__PURE__ */ jsx(Menu, { children: languages.map((lang) => /* @__PURE__ */ jsx(MenuItem, { disabled: languageKeysInUse.includes(lang.id), fontSize: 1, text: lang.id.toLocaleUpperCase(), value: lang.id, onClick: handleKeyChange }, lang.id)) }), popover: {
-    portal: !0
-  } });
   let t5;
-  $[8] !== t4 ? (t5 = /* @__PURE__ */ jsx(Card, { tone: "inherit", children: t4 }), $[8] = t4, $[9] = t5) : t5 = $[9];
-  const T0 = Card, t6 = 1, t7 = "inherit", t8 = props.inputProps.renderInput(inlineProps);
+  if ($[14] !== keyIsValid || $[15] !== languageDisplay || $[16] !== languages || $[17] !== value) {
+    let t62;
+    $[19] !== value ? (t62 = (l_0) => l_0.id === value[LANGUAGE_FIELD_NAME], $[19] = value, $[20] = t62) : t62 = $[20];
+    const language = languages.find(t62);
+    t5 = keyIsValid && language ? getLanguageDisplay(languageDisplay, language.title, language.id) : "", $[14] = keyIsValid, $[15] = languageDisplay, $[16] = languages, $[17] = value, $[18] = t5;
+  } else
+    t5 = $[18];
+  const languageTitle = t5;
+  let t6;
+  $[21] !== defaultLanguages || $[22] !== value ? (t6 = defaultLanguages.includes(value[LANGUAGE_FIELD_NAME]), $[21] = defaultLanguages, $[22] = value, $[23] = t6) : t6 = $[23];
+  const isDefault = t6;
+  let t7;
+  $[24] !== validation ? (t7 = getToneFromValidation(validation), $[24] = validation, $[25] = t7) : t7 = $[25];
+  let t8;
+  $[26] !== keyIsValid || $[27] !== languageTitle || $[28] !== originalOnChange || $[29] !== props.path || $[30] !== value ? (t8 = keyIsValid ? /* @__PURE__ */ jsx(Label, { muted: !0, size: 1, children: languageTitle }) : /* @__PURE__ */ jsx(ChangeLanguageButton, { value, path: props.path, onChange: originalOnChange }), $[26] = keyIsValid, $[27] = languageTitle, $[28] = originalOnChange, $[29] = props.path, $[30] = value, $[31] = t8) : t8 = $[31];
   let t9;
-  return $[10] !== T0 || $[11] !== t8 ? (t9 = /* @__PURE__ */ jsx(T0, { flex: t6, tone: t7, children: t8 }), $[10] = T0, $[11] = t8, $[12] = t9) : t9 = $[12], /* @__PURE__ */ jsx(Card, { paddingTop: 2, tone: t3, children: /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
-    t5,
-    /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [
-      t9,
-      /* @__PURE__ */ jsx(Card, { tone: "inherit", children: isDefault ? /* @__PURE__ */ jsx(Tooltip, { content: /* @__PURE__ */ jsx(Text, { muted: !0, size: 1, children: "Can't remove default language" }), fallbackPlacements: ["right", "left"], placement: "top", portal: !0, children: /* @__PURE__ */ jsx("span", { children: removeButton }) }) : removeButton })
-    ] })
-  ] }) });
-}
-function _temp4(v) {
-  return v[LANGUAGE_FIELD_NAME];
+  $[32] !== inlineProps || $[33] !== props.inputProps ? (t9 = props.inputProps.renderInput(inlineProps), $[32] = inlineProps, $[33] = props.inputProps, $[34] = t9) : t9 = $[34];
+  let t10;
+  $[35] !== t9 ? (t10 = /* @__PURE__ */ jsx(Box, { flex: 1, children: t9 }), $[35] = t9, $[36] = t10) : t10 = $[36];
+  const t11 = !!readOnly;
+  let t12;
+  $[37] !== isDefault || $[38] !== originalOnChange || $[39] !== t11 ? (t12 = /* @__PURE__ */ jsx(RemoveButton, { isDefault, readOnly: t11, onChange: originalOnChange }), $[37] = isDefault, $[38] = originalOnChange, $[39] = t11, $[40] = t12) : t12 = $[40];
+  let t13;
+  $[41] !== t10 || $[42] !== t12 ? (t13 = /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [
+    t10,
+    t12
+  ] }), $[41] = t10, $[42] = t12, $[43] = t13) : t13 = $[43];
+  let t14;
+  $[44] !== t13 || $[45] !== t8 ? (t14 = /* @__PURE__ */ jsxs(Stack, { space: 2, children: [
+    t8,
+    t13
+  ] }), $[44] = t13, $[45] = t8, $[46] = t14) : t14 = $[46];
+  let t15;
+  return $[47] !== t14 || $[48] !== t7 ? (t15 = /* @__PURE__ */ jsx(Card, { paddingTop: 2, tone: t7, children: t14 }), $[47] = t14, $[48] = t7, $[49] = t15) : t15 = $[49], t15;
 }
-function _temp3(m) {
+function _temp4(m) {
   return m.kind === "field" && m.name === "value";
 }
-function _temp2(patch_0) {
+function _temp3(patch_0) {
   if (!patch_0 || typeof patch_0 != "object")
     return patch_0;
   if (patch_0.type === "insert" && patch_0.path && Array.isArray(patch_0.path)) {
@@ -796,7 +907,7 @@ function _temp2(patch_0) {
   }
   return patch_0;
 }
-function _temp(patch) {
+function _temp2(patch) {
   return !patch || typeof patch != "object" ? !1 : patch.type === "insert" && patch.path && Array.isArray(patch.path) && patch.path.length > 0 ? patch.path[0] === "value" || typeof patch.path[0] == "number" : !1;
 }
 var object = (config) => {
@@ -809,13 +920,24 @@ var object = (config) => {
     type: "object",
     components: {
       // @ts-expect-error - fix typings
-      item: InternationalizedInput
+      item: InternationalizedInput,
+      field: (props) => props.renderDefault({
+        ...props,
+        // Reset the level to avoid nested styling
+        level: 0
+      })
     },
     fields: [defineField({
       ...typeof type == "string" ? {
         type
       } : type,
-      name: "value"
+      name: "value",
+      components: {
+        field: (props) => props.renderDefault({
+          ...props,
+          title: ""
+        })
+      }
     })],
     preview: {
       select: {
@@ -825,30 +947,6 @@ var object = (config) => {
     }
   });
 };
-function flattenSchemaType(schemaType) {
-  return isDocumentSchemaType(schemaType) ? extractInnerFields(schemaType.fields, [], 3) : (console.error("Schema type is not a document"), []);
-}
-function extractInnerFields(fields, path, maxDepth) {
-  return path.length >= maxDepth ? [] : fields.reduce((acc, field) => {
-    const thisFieldWithPath = {
-      path: [...path, field.name],
-      ...field
-    };
-    if (field.type.jsonType === "object") {
-      const innerFields = extractInnerFields(field.type.fields, [...path, field.name], maxDepth);
-      return acc.push(thisFieldWithPath, ...innerFields), acc;
-    } else if (field.type.jsonType === "array" && field.type.of.length && field.type.of.some((item) => "fields" in item)) {
-      const innerFields = field.type.of.flatMap((innerField) => extractInnerFields(
-        // @ts-expect-error - Fix TS assertion for array fields
-        innerField.fields,
-        [...path, field.name],
-        maxDepth
-      ));
-      return acc.push(thisFieldWithPath, ...innerFields), acc;
-    }
-    return acc.push(thisFieldWithPath), acc;
-  }, []);
-}
 const internationalizedArray = definePlugin((config) => {
   const pluginConfig = {
     ...CONFIG_DEFAULT,
@@ -873,13 +971,15 @@ const internationalizedArray = definePlugin((config) => {
     },
     // Optional: render "add language" buttons as field actions
     document: {
+      components: {
+        unstable_layout: (props) => /* @__PURE__ */ jsx(InternationalizedArrayLayout, { ...props, pluginConfig })
+      },
       unstable_fieldActions: buttonLocations.includes("unstable__fieldAction") ? (prev) => [...prev, internationalizedArrayFieldAction] : void 0
     },
     // Wrap document editor with a language provider
     form: {
       components: {
-        field: (props) => /* @__PURE__ */ jsx(InternationalizedField, { ...props }),
-        input: (props) => !(props.id === "root" && isObjectInputProps(props)) || !flattenSchemaType(props.schemaType).map((field) => field.type.name).some((name) => name.startsWith("internationalizedArray")) ? props.renderDefault(props) : /* @__PURE__ */ jsx(InternationalizedArrayProvider, { ...props, internationalizedArray: pluginConfig })
+        input: (props) => props.id === "root" && isObjectInputProps(props) && hasInternationalizedArrayField(props.schemaType) && pluginConfig.includeForDocumentType(props.schemaType.name) ? /* @__PURE__ */ jsx(InternationalizedArrayFormInput, { ...props, pluginConfig }) : props.renderDefault(props)
       }
     },
     // Register custom schema types for the outer array and the inner object