sanity-plugin-internationalized-array 5.2.3 → 5.3.0

package/README.md

@@ -126,8 +126,18 @@ languages: async (client, {market = ``}) => {
 The "Add translation" buttons can be positioned in one or multiple locations by configuring `buttonLocations`:
 
 - `field` (default) Below the internationalized array field
-- `unstable__fieldAction` Inside a Field Action (currently unstable)
+- `fieldMenu` One translate icon per field that opens a language menu
 - `document` Above the document fields, these buttons will add a new language item to every internationalized array field that can be found at the **root of the document**. Nested internationalized arrays are not yet supported.
+- `unstable__fieldAction` Inside a Field Action (still accepted in config; currently unstable)
+
+All locations are additive, so `field`, `fieldMenu`, and `document` can be used together.
+
+![The fieldMenu control: one translate icon opens a language menu](./img/field-menu.jpeg)
+
+> [!WARNING]
+> Do not use `unstable__fieldAction` on **this plugin 4.0.4 or later**. It crashes the document editor with `useFormValue must be used within a FormValueProvider` — on Studio 4 and above.
+>
+> The break is this plugin, not a Studio major. **4.0.4** ([#633](https://github.com/sanity-io/plugins/pull/633)) moved the language provider onto `document.components.unstable_layout`, so field actions now run outside `FormValueProvider` and throw. Last working plugin: **4.0.0** (and 3.x). Use `field`, `fieldMenu`, and/or `document` instead.
 
 To control the "Add translation" button titles, configure `languageDisplay`. This also affects language field labels.
 
@@ -135,7 +145,7 @@ To control the "Add translation" button titles, configure `languageDisplay`. Thi
 - `titleOnly` Shows the language title
 - `titleAndCode` Shows the language title with the code in parentheses
 
-The "Add all languages" button can be hidden with `buttonAddAll`.
+The "Add all languages" / "Add missing languages" control can be hidden with `buttonAddAll`. Under `field` that hides the bar below the per-language buttons. Under `fieldMenu` that hides the bulk item inside the language menu.
 
 By default, opening a document reorders internationalized array items to match
 the configured `languages` order. That can create a draft (and a history entry)
@@ -150,7 +160,7 @@ export default defineConfig({
   plugins: [
     internationalizedArray({
       // ...other config
-      buttonLocations: ['field', 'unstable__fieldAction', 'document'], // default ['field']
+      buttonLocations: ['field', 'fieldMenu', 'document'], // default ['field'] — locations are additive
       buttonAddAll: false, // default true
       restoreOrder: false, // default true
       languageDisplay: 'codeOnly', // codeOnly (default) | titleOnly | titleAndCode

package/dist/index.d.ts

@@ -125,12 +125,19 @@ type PluginConfig = {
    */
   fieldTypes: (string | RuleTypeConstraint | FieldDefinition)[];
   /**
-   * Locations where the "+ EN" add language buttons are visible
+   * Locations where the "+ EN" add language buttons are visible.
+   * `fieldMenu` is one translate icon per field that opens a
+   * language menu (compact; stable UI; no field actions). All locations are
+   * additive, so `field`, `fieldMenu`, and `document` can be combined.
+   * `unstable__fieldAction` is still accepted but crashes the editor from
+   * plugin 4.0.4 onward on Studio 4 and above.
    * @defaultValue ['field']
    * */
-  buttonLocations?: ('field' | 'unstable__fieldAction' | 'document')[];
+  buttonLocations?: ('field' | 'fieldMenu' | 'unstable__fieldAction' | 'document')[];
   /**
-   * Show or hide the "Add missing languages" button
+   * Show or hide the "Add all languages" / "Add missing languages" control.
+   * Under `field` this is the bar below the per-language buttons. Under
+   * `fieldMenu` it is the bulk item inside the language menu.
    * @defaultValue true
    * */
   buttonAddAll?: boolean;

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","names":[],"sources":["../src/types.ts","../src/cache.ts","../src/constants.ts","../src/plugin.tsx","../src/utils/internationalizedArrayLanguageFilter.ts"],"mappings":";;;KAEY;EACV,IAAI,KAAK;EACT;;KAGU;KAEA;EACV;EACA,MAAM;EACN,WAAW;EACX;EACA;EACA;EACA;EACA,aAAa,OAAO;EACpB;KAAU;IAAuB;OAAW;;;;;;;KAMlC;EACV;;EAEA;EACA;;iBAGc,iCACd,eACC,QAAQ;KAIC,2BAA2B;EACrC;EACA,QAAQ;;EAER;;;;EAIA;;KAGU,oBACV,QAAQ,cACR,eAAe,4BACZ,QAAQ;KAED;KAEA;;;;;EAKV;;;;;;;;;;;;;EAaA,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4BT,WAAW,aAAa;;;;;;;;;EASxB;;;;;;;;;;;;;;;;;;;;;;;;EAyBA,sBAAsB,qBAAqB;;;;;EAK3C;;;;;EAKA;;;;;;;;;;;EAWA;;;;;EAKA,kBAAkB;;;;;;;;;;EAUlB,0BAA0B;;;;;;;;;;;;EAY1B;IACE,eAAe,SAAS;IACxB,mBAAmB;;;cC5JV;;;;;;;;;;;;;;;;;;;;;;;;cCJA;cCZA,yCAAsB,OAAA;;;;;cCJtB,uCAAoC,eAChC,kBAAgB,SACtB,cAAc,eAAa,+BACP,aAChB,qCAAmC,WACrC"}
+{"version":3,"file":"index.d.ts","names":[],"sources":["../src/types.ts","../src/cache.ts","../src/constants.ts","../src/plugin.tsx","../src/utils/internationalizedArrayLanguageFilter.ts"],"mappings":";;;KAEY;EACV,IAAI,KAAK;EACT;;KAGU;KAEA;EACV;EACA,MAAM;EACN,WAAW;EACX;EACA;EACA;EACA;EACA,aAAa,OAAO;EACpB;KAAU;IAAuB;OAAW;;;;;;;KAMlC;EACV;;EAEA;EACA;;iBAGc,iCACd,eACC,QAAQ;KAIC,2BAA2B;EACrC;EACA,QAAQ;;EAER;;;;EAIA;;KAGU,oBACV,QAAQ,cACR,eAAe,4BACZ,QAAQ;KAED;KAEA;;;;;EAKV;;;;;;;;;;;;;EAaA,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4BT,WAAW,aAAa;;;;;;;;;EASxB;;;;;;;;;;;;;;;;;;;;;;;;EAyBA,sBAAsB,qBAAqB;;;;;;;;;;EAU3C;;;;;;;EAOA;;;;;;;;;;;EAWA;;;;;EAKA,kBAAkB;;;;;;;;;;EAUlB,0BAA0B;;;;;;;;;;;;EAY1B;IACE,eAAe,SAAS;IACxB,mBAAmB;;;cCnKV;;;;;;;;;;;;;;;;;;;;;;;;cCJA;cCZA,yCAAsB,OAAA;;;;;cCJtB,uCAAoC,eAChC,kBAAgB,SACtB,cAAc,eAAa,+BACP,aAChB,qCAAmC,WACrC"}

package/dist/index.js

@@ -7,16 +7,17 @@ import { useToast } from "@sanity/ui/toast";
 import { randomKey } from "@sanity/util/content";
 import { useDocumentPane } from "sanity/structure";
 import { AddIcon } from "@sanity/icons/Add";
-import { createContext, createElement, use, useCallback, useContext, useDeferredValue, useEffect } from "react";
+import { createContext, createElement, use, useCallback, useContext, useDeferredValue, useEffect, useId } from "react";
 import get from "lodash-es/get.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { TranslateIcon } from "@sanity/icons/Translate";
 import camelCase from "lodash-es/camelCase.js";
 import upperFirst from "lodash-es/upperFirst.js";
+import { EventsContext } from "sanity/_singletons";
+import { Menu, MenuButton, MenuDivider, MenuItem } from "@sanity/ui/menu";
 import { Code } from "@sanity/ui/code";
 import { WarningOutlineIcon } from "@sanity/icons/WarningOutline";
 import { RemoveCircleIcon } from "@sanity/icons/RemoveCircle";
-import { Menu, MenuButton, MenuItem } from "@sanity/ui/menu";
 import { Tooltip } from "@sanity/ui/tooltip";
 const namespace = "sanity-plugin-internationalized-array", functionKeyCache = /* @__PURE__ */ new WeakMap(), promiseCache = /* @__PURE__ */ new Map(), functionCache = /* @__PURE__ */ new Map();
 function stringifyCacheKey(key) {
@@ -436,7 +437,11 @@ function checkAllLanguagesArePresent(languages, value) {
 *   or `"Add missing languages"` (plural) depending on how many are left.
 */
 function createAddAllTitle(value, languages) {
-	return value?.length ? `Add missing ${languages.length - value.length === 1 ? "language" : "languages"}` : languages.length === 1 && languages[0] ? `Add ${languages[0].title} Field` : "Add all languages";
+	if (value?.length) {
+		let languagesInUse = new Set(value.map((item) => item[LANGUAGE_FIELD_NAME]));
+		return `Add missing ${languages.filter((language) => !languagesInUse.has(language.id)).length === 1 ? "language" : "languages"}`;
+	}
+	return languages.length === 1 && languages[0] ? `Add ${languages[0].title} Field` : "Add all languages";
 }
 function isInternationalizedArrayItemType(type) {
 	return type.startsWith("internationalizedArray") && type.endsWith("Value");
@@ -576,7 +581,66 @@ const internationalizedArrayLanguageFilter = (enclosingType, _member, selectedLa
 		return !language || languages.find((l) => l.id === language) ? language ? selectedLanguageIds.includes(language) : !1 : !0;
 	}
 	return !0;
-}, schemaExample = { languages: [{
+};
+/**
+* One translate-icon button that opens a language menu — the `fieldMenu`
+* location. Compact, uses only stable `@sanity/ui`, and stays visible even
+* when every language is already present.
+*/
+function CompactAddButton(props) {
+	let $ = c(27), { readOnly, languagesInUse, handleClick, onAddAll, buttonAddAll, addAllTitle, allFilteredLanguagesArePresent } = props, { languageDisplay, filteredLanguages: languages } = useInternationalizedArrayContext(), menuId = useId();
+	if (!languages.length) return null;
+	let t0;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = {
+		portal: !0,
+		placement: "bottom-end"
+	}, $[0] = t0) : t0 = $[0];
+	let t1;
+	$[1] === readOnly ? t1 = $[2] : (t1 = /* @__PURE__ */ jsx(Button, {
+		mode: "bleed",
+		tone: "default",
+		fontSize: 1,
+		padding: 2,
+		icon: TranslateIcon,
+		"aria-label": "Add translation",
+		title: "Add translation",
+		"data-testid": "add-translation-menu",
+		disabled: readOnly
+	}), $[1] = readOnly, $[2] = t1);
+	let t2;
+	if ($[3] !== handleClick || $[4] !== languageDisplay || $[5] !== languages || $[6] !== languagesInUse || $[7] !== readOnly) {
+		let t3;
+		$[9] !== handleClick || $[10] !== languageDisplay || $[11] !== languagesInUse || $[12] !== readOnly ? (t3 = (language) => /* @__PURE__ */ jsx(MenuItem, {
+			text: getLanguageDisplay(languageDisplay, language.title, language.id),
+			icon: AddIcon,
+			disabled: readOnly || languagesInUse.includes(language.id),
+			"data-testid": `field-menu-add-${language.id}`,
+			onClick: () => handleClick(language.id)
+		}, language.id), $[9] = handleClick, $[10] = languageDisplay, $[11] = languagesInUse, $[12] = readOnly, $[13] = t3) : t3 = $[13], t2 = languages.map(t3), $[3] = handleClick, $[4] = languageDisplay, $[5] = languages, $[6] = languagesInUse, $[7] = readOnly, $[8] = t2;
+	} else t2 = $[8];
+	let t3;
+	$[14] !== addAllTitle || $[15] !== allFilteredLanguagesArePresent || $[16] !== buttonAddAll || $[17] !== onAddAll || $[18] !== readOnly ? (t3 = buttonAddAll ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(MenuDivider, {}), /* @__PURE__ */ jsx(MenuItem, {
+		text: addAllTitle,
+		icon: TranslateIcon,
+		disabled: readOnly || allFilteredLanguagesArePresent,
+		"data-testid": "field-menu-add-all",
+		onClick: onAddAll
+	})] }) : null, $[14] = addAllTitle, $[15] = allFilteredLanguagesArePresent, $[16] = buttonAddAll, $[17] = onAddAll, $[18] = readOnly, $[19] = t3) : t3 = $[19];
+	let t4;
+	$[20] !== t2 || $[21] !== t3 ? (t4 = /* @__PURE__ */ jsxs(Menu, { children: [t2, t3] }), $[20] = t2, $[21] = t3, $[22] = t4) : t4 = $[22];
+	let t5;
+	return $[23] !== menuId || $[24] !== t1 || $[25] !== t4 ? (t5 = /* @__PURE__ */ jsx(Flex, {
+		justify: "flex-end",
+		"data-testid": "field-menu",
+		children: /* @__PURE__ */ jsx(MenuButton, {
+			id: menuId,
+			popover: t0,
+			button: t1,
+			menu: t4
+		})
+	}), $[23] = menuId, $[24] = t1, $[25] = t4, $[26] = t5) : t5 = $[26], t5;
+}
+const schemaExample = { languages: [{
 	id: "en",
 	title: "English"
 }, {
@@ -698,6 +762,17 @@ function MigrationBanner(t0) {
 	}), $[9] = t5, $[10] = t9), t9;
 }
 /**
+* The events store has finished loading and recorded no history. That is a
+* brand-new document.
+*
+* `sanity/_singletons` is internal; this is the same context `useEvents()`
+* reads. Using the context directly avoids throwing when the events API is
+* off (legacy timeline has no `EventsProvider`).
+*/
+function isPristineDocument(events) {
+	return !events || events.loading ? !1 : events.events.length === 0;
+}
+/**
 * Main array input component for internationalized array fields.
 *
 * Replaces the default Sanity array input and manages the full lifecycle of
@@ -706,18 +781,19 @@ function MigrationBanner(t0) {
 * - **Language filter integration**: When `@sanity/language-filter` is active
 *   for the current document type, array members are filtered to only show
 *   languages matching the user's selection.
-* - **Adding languages**: Exposes per-language buttons and an "Add all / Add
-*   missing languages" button (controlled by `buttonAddAll` and
-*   `buttonLocations` config). Dispatches `setIfMissing` + `insert` patches.
+* - **Adding languages**: Exposes per-language buttons, an optional compact
+*   `fieldMenu`, and an "Add all / Add missing languages" button (controlled
+*   by `buttonAddAll` and `buttonLocations`). Dispatches `setIfMissing` +
+*   `insert` patches.
 * - **Default languages**: Automatically adds entries for languages listed in
-*   `defaultLanguages` when those entries are missing. Only runs once the
-*   document exists in the dataset (it has a `_rev`) **and** the document is
-*   writable — newly created documents stay read-only until initial value
-*   templates resolve, and the field-level `readOnly` prop can lag that
-*   document-level lock. Skipping the patch until both are ready avoids
-*   "Attempted to patch a read-only document" toasts. The `_rev` guard also
-*   prevents recreating a just-deleted document or creating a draft before
-*   the user's first edit.
+*   `defaultLanguages` when those entries are missing. Seeds brand-new
+*   documents once the events store reports they are pristine (no history),
+*   and seeds persisted documents that already have a `_rev`. A document
+*   that existed and was deleted is not pristine, so opening it — even in a
+*   fresh pane — does not recreate it. Newly created documents stay
+*   read-only until initial value templates resolve, and the field-level
+*   `readOnly` prop can lag that document-level lock. Skipping the patch
+*   until writable avoids "Attempted to patch a read-only document" toasts.
 * - **Ordering**: When `restoreOrder` is enabled (default), detects when value
 *   items are out of order relative to the master `languages` list and
 *   automatically re-sorts them. Set `restoreOrder: false` to keep the stored
@@ -728,7 +804,7 @@ function MigrationBanner(t0) {
 *   no entries and the add buttons are not visible.
 */
 function InternationalizedArray(props) {
-	let $ = c(104), { members, value: _value, schemaType, onChange, readOnly: documentReadOnly } = props, value = _value, t0;
+	let $ = c(122), { members, value: _value, schemaType, onChange, readOnly: documentReadOnly } = props, value = _value, t0;
 	$[0] === value ? t0 = $[1] : (t0 = value?.filter(_temp$1) ?? [], $[0] = value, $[1] = t0);
 	let itemsNeedingMigration = t0, shouldMigrateArray = itemsNeedingMigration.length > 0, toast = useToast(), getFormValue = useGetFormValue(), { languages, filteredLanguages, defaultLanguages, buttonAddAll, buttonLocations, restoreOrder, languageFilter: builtInLanguageFilter } = useInternationalizedArrayContext(), { selectedLanguageIds, options: languageFilterOptions } = useLanguageFilterStudioContext(), t1;
 	$[2] === Symbol.for("react.memo_cache_sentinel") ? (t1 = ["_type"], $[2] = t1) : t1 = $[2];
@@ -758,36 +834,39 @@ function InternationalizedArray(props) {
 	}, $[16] = filteredLanguages, $[17] = getFormValue, $[18] = languages, $[19] = onChange, $[20] = props.path, $[21] = readOnly, $[22] = schemaType, $[23] = t5) : t5 = $[23];
 	let handleAddLanguages = t5, t6;
 	$[24] === Symbol.for("react.memo_cache_sentinel") ? (t6 = ["_rev"], $[24] = t6) : t6 = $[24];
-	let documentExists = !!useFormValue(t6), t7;
-	$[25] === value ? t7 = $[26] : (t7 = value?.map(_temp2$1).filter(Boolean).join(","), $[25] = value, $[26] = t7);
-	let languageKeysFromValue = t7, t8;
-	if ($[27] !== languageKeysFromValue || $[28] !== languages) {
+	let documentExists = !!useFormValue(t6), t7 = useContext(EventsContext), t8;
+	$[25] === t7 ? t8 = $[26] : (t8 = isPristineDocument(t7), $[25] = t7, $[26] = t8);
+	let isPristine = t8, t9;
+	$[27] === value ? t9 = $[28] : (t9 = value?.map(_temp2$1).filter(Boolean).join(","), $[27] = value, $[28] = t9);
+	let languageKeysFromValue = t9, t10;
+	if ($[29] !== languageKeysFromValue || $[30] !== languages) {
 		bb0: {
 			let languageKeys = languageKeysFromValue?.split(",") || [];
 			if (!languageKeys?.length) {
-				let t9;
-				$[30] === Symbol.for("react.memo_cache_sentinel") ? (t9 = [], $[30] = t9) : t9 = $[30], t8 = t9;
+				let t11;
+				$[32] === Symbol.for("react.memo_cache_sentinel") ? (t11 = [], $[32] = t11) : t11 = $[32], t10 = t11;
 				break bb0;
 			}
 			if (!languages?.length) {
-				let t9;
-				$[31] === Symbol.for("react.memo_cache_sentinel") ? (t9 = [], $[31] = t9) : t9 = $[31], t8 = t9;
+				let t11;
+				$[33] === Symbol.for("react.memo_cache_sentinel") ? (t11 = [], $[33] = t11) : t11 = $[33], t10 = t11;
 				break bb0;
 			}
-			t8 = languages.filter((l) => languageKeys?.find((key) => key === l.id)).map(_temp3$1);
+			t10 = languages.filter((l) => languageKeys?.find((key) => key === l.id)).map(_temp3$1);
 		}
-		$[27] = languageKeysFromValue, $[28] = languages, $[29] = t8;
-	} else t8 = $[29];
-	let addedLanguages = t8, t10, t9;
-	$[32] !== addedLanguages || $[33] !== defaultLanguages || $[34] !== documentExists || $[35] !== handleAddLanguages || $[36] !== isDeleted || $[37] !== isDeleting || $[38] !== languages || $[39] !== readOnly || $[40] !== shouldMigrateArray ? (t9 = () => {
+		$[29] = languageKeysFromValue, $[30] = languages, $[31] = t10;
+	} else t10 = $[31];
+	let addedLanguages = t10, t11, t12;
+	$[34] !== addedLanguages || $[35] !== defaultLanguages || $[36] !== documentExists || $[37] !== handleAddLanguages || $[38] !== isDeleted || $[39] !== isDeleting || $[40] !== isPristine || $[41] !== languages || $[42] !== readOnly || $[43] !== shouldMigrateArray ? (t11 = () => {
 		let hasAddedDefaultLanguages = defaultLanguages.filter((language) => languages.find((l_1) => l_1.id === language)).every((language_0) => addedLanguages.includes(language_0));
-		if (documentExists && !isDeleting && !isDeleted && !hasAddedDefaultLanguages && !shouldMigrateArray && !readOnly) {
+		if ((isPristine || documentExists) && !isDeleting && !isDeleted && !hasAddedDefaultLanguages && !shouldMigrateArray && !readOnly) {
 			let languagesToAdd = defaultLanguages.filter((language_1) => !addedLanguages.includes(language_1)).filter((language_2) => languages.find((l_2) => l_2.id === language_2)), timeout = setTimeout(() => {
 				readOnly || handleAddLanguages(languagesToAdd);
 			});
 			return () => clearTimeout(timeout);
 		}
-	}, t10 = [
+	}, t12 = [
+		isPristine,
 		documentExists,
 		isDeleted,
 		isDeleting,
@@ -797,9 +876,9 @@ function InternationalizedArray(props) {
 		languages,
 		readOnly,
 		shouldMigrateArray
-	], $[32] = addedLanguages, $[33] = defaultLanguages, $[34] = documentExists, $[35] = handleAddLanguages, $[36] = isDeleted, $[37] = isDeleting, $[38] = languages, $[39] = readOnly, $[40] = shouldMigrateArray, $[41] = t10, $[42] = t9) : (t10 = $[41], t9 = $[42]), useEffect(t9, t10);
-	let t11;
-	$[43] !== languages || $[44] !== onChange || $[45] !== readOnly || $[46] !== toast || $[47] !== value ? (t11 = () => {
+	], $[34] = addedLanguages, $[35] = defaultLanguages, $[36] = documentExists, $[37] = handleAddLanguages, $[38] = isDeleted, $[39] = isDeleting, $[40] = isPristine, $[41] = languages, $[42] = readOnly, $[43] = shouldMigrateArray, $[44] = t11, $[45] = t12) : (t11 = $[44], t12 = $[45]), useEffect(t11, t12);
+	let t13;
+	$[46] !== languages || $[47] !== onChange || $[48] !== readOnly || $[49] !== toast || $[50] !== value ? (t13 = () => {
 		if (readOnly || !value?.length || !languages?.length) return;
 		let updatedValue = value.reduce((acc, v_1) => {
 			let newIndex = languages.findIndex((l_3) => l_3.id === v_1?.[LANGUAGE_FIELD_NAME]);
@@ -809,79 +888,62 @@ function InternationalizedArray(props) {
 			title: "There was an error reordering languages",
 			status: "warning"
 		}), onChange(set(updatedValue));
-	}, $[43] = languages, $[44] = onChange, $[45] = readOnly, $[46] = toast, $[47] = value, $[48] = t11) : t11 = $[48];
-	let handleRestoreOrder = t11, t12;
+	}, $[46] = languages, $[47] = onChange, $[48] = readOnly, $[49] = toast, $[50] = value, $[51] = t13) : t13 = $[51];
+	let handleRestoreOrder = t13, t14;
 	bb1: {
 		if (!value?.length || !languages?.length) {
-			t12 = !0;
+			t14 = !0;
 			break bb1;
 		}
-		let t13;
-		$[49] !== languages || $[50] !== value ? (t13 = value?.every((v_2) => languages.find((l_4) => l_4?.id === v_2?.[LANGUAGE_FIELD_NAME])), $[49] = languages, $[50] = value, $[51] = t13) : t13 = $[51], t12 = t13;
+		let t15;
+		$[52] !== languages || $[53] !== value ? (t15 = value?.every((v_2) => languages.find((l_4) => l_4?.id === v_2?.[LANGUAGE_FIELD_NAME])), $[52] = languages, $[53] = value, $[54] = t15) : t15 = $[54], t14 = t15;
 	}
-	let allKeysAreLanguages = t12, t13;
+	let allKeysAreLanguages = t14, t15;
 	bb2: {
 		if (!value?.length || !addedLanguages.length) {
-			let t14;
-			$[52] === Symbol.for("react.memo_cache_sentinel") ? (t14 = [], $[52] = t14) : t14 = $[52], t13 = t14;
+			let t16;
+			$[55] === Symbol.for("react.memo_cache_sentinel") ? (t16 = [], $[55] = t16) : t16 = $[55], t15 = t16;
 			break bb2;
 		}
-		let t14;
-		if ($[53] !== addedLanguages || $[54] !== value) {
-			let t15;
-			$[56] === addedLanguages ? t15 = $[57] : (t15 = (v_3, vIndex) => vIndex === addedLanguages.findIndex((language_3) => language_3 === v_3.language) ? null : v_3, $[56] = addedLanguages, $[57] = t15), t14 = value.map(t15).filter(Boolean), $[53] = addedLanguages, $[54] = value, $[55] = t14;
-		} else t14 = $[55];
-		t13 = t14;
+		let t16;
+		if ($[56] !== addedLanguages || $[57] !== value) {
+			let t17;
+			$[59] === addedLanguages ? t17 = $[60] : (t17 = (v_3, vIndex) => vIndex === addedLanguages.findIndex((language_3) => language_3 === v_3.language) ? null : v_3, $[59] = addedLanguages, $[60] = t17), t16 = value.map(t17).filter(Boolean), $[56] = addedLanguages, $[57] = value, $[58] = t16;
+		} else t16 = $[58];
+		t15 = t16;
 	}
-	let languagesOutOfOrder = t13, languagesAreValid = !languages?.length || languages?.length && languages.every(_temp4$1), t14, t15;
-	$[58] !== allKeysAreLanguages || $[59] !== handleRestoreOrder || $[60] !== languagesOutOfOrder || $[61] !== readOnly || $[62] !== restoreOrder ? (t14 = () => {
+	let languagesOutOfOrder = t15, languagesAreValid = !languages?.length || languages?.length && languages.every(_temp4$1), t16, t17;
+	$[61] !== allKeysAreLanguages || $[62] !== handleRestoreOrder || $[63] !== languagesOutOfOrder || $[64] !== readOnly || $[65] !== restoreOrder ? (t16 = () => {
 		restoreOrder && languagesOutOfOrder.length > 0 && allKeysAreLanguages && !readOnly && handleRestoreOrder();
-	}, t15 = [
+	}, t17 = [
 		restoreOrder,
 		languagesOutOfOrder,
 		allKeysAreLanguages,
 		handleRestoreOrder,
 		readOnly
-	], $[58] = allKeysAreLanguages, $[59] = handleRestoreOrder, $[60] = languagesOutOfOrder, $[61] = readOnly, $[62] = restoreOrder, $[63] = t14, $[64] = t15) : (t14 = $[63], t15 = $[64]), useEffect(t14, t15);
-	let t16;
-	$[65] !== filteredLanguages || $[66] !== value ? (t16 = checkAllLanguagesArePresent(filteredLanguages, value), $[65] = filteredLanguages, $[66] = value, $[67] = t16) : t16 = $[67];
-	let allLanguagesArePresent = t16, t17;
-	$[68] !== filteredLanguages || $[69] !== handleAddLanguages ? (t17 = () => {
+	], $[61] = allKeysAreLanguages, $[62] = handleRestoreOrder, $[63] = languagesOutOfOrder, $[64] = readOnly, $[65] = restoreOrder, $[66] = t16, $[67] = t17) : (t16 = $[66], t17 = $[67]), useEffect(t16, t17);
+	let t18;
+	if ($[68] !== addedLanguages || $[69] !== filteredLanguages) {
+		let t19;
+		$[71] === addedLanguages ? t19 = $[72] : (t19 = (language_4) => addedLanguages.includes(language_4.id), $[71] = addedLanguages, $[72] = t19), t18 = filteredLanguages.every(t19), $[68] = addedLanguages, $[69] = filteredLanguages, $[70] = t18;
+	} else t18 = $[70];
+	let allFilteredLanguagesArePresent = t18, t19;
+	$[73] !== filteredLanguages || $[74] !== handleAddLanguages ? (t19 = () => {
 		handleAddLanguages(filteredLanguages.map(_temp5));
-	}, $[68] = filteredLanguages, $[69] = handleAddLanguages, $[70] = t17) : t17 = $[70];
-	let addAllMissingLanguages = t17;
+	}, $[73] = filteredLanguages, $[74] = handleAddLanguages, $[75] = t19) : t19 = $[75];
+	let addAllMissingLanguages = t19;
 	if (!languagesAreValid) {
-		let t18;
-		return $[71] === Symbol.for("react.memo_cache_sentinel") ? (t18 = /* @__PURE__ */ jsx(Feedback, {}), $[71] = t18) : t18 = $[71], t18;
+		let t20;
+		return $[76] === Symbol.for("react.memo_cache_sentinel") ? (t20 = /* @__PURE__ */ jsx(Feedback, {}), $[76] = t20) : t20 = $[76], t20;
 	}
-	let t18;
-	$[72] !== allLanguagesArePresent || $[73] !== buttonLocations || $[74] !== filteredLanguages.length || $[75] !== shouldMigrateArray ? (t18 = !shouldMigrateArray && buttonLocations.includes("field") && filteredLanguages?.length > 0 && !allLanguagesArePresent, $[72] = allLanguagesArePresent, $[73] = buttonLocations, $[74] = filteredLanguages.length, $[75] = shouldMigrateArray, $[76] = t18) : t18 = $[76];
-	let addButtonsAreVisible = t18, fieldHasMembers = members?.length > 0, t19;
-	$[77] !== filteredLanguages || $[78] !== value ? (t19 = createAddAllTitle(value, filteredLanguages), $[77] = filteredLanguages, $[78] = value, $[79] = t19) : t19 = $[79];
-	let addAllTitle = t19, t20;
-	if ($[80] !== filteredMembers || $[81] !== props) {
-		let t21;
-		$[83] === props ? t21 = $[84] : (t21 = (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), $[83] = props, $[84] = t21), t20 = filteredMembers.map(t21), $[80] = filteredMembers, $[81] = props, $[82] = t20;
-	} else t20 = $[82];
-	let t21;
-	$[85] === itemsNeedingMigration ? t21 = $[86] : (t21 = /* @__PURE__ */ jsx(MigrationBanner, { itemsNeedingMigration }), $[85] = itemsNeedingMigration, $[86] = t21);
-	let t22;
-	$[87] !== addButtonsAreVisible || $[88] !== fieldHasMembers ? (t22 = !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, $[87] = addButtonsAreVisible, $[88] = fieldHasMembers, $[89] = t22) : t22 = $[89];
-	let t23;
-	$[90] !== addAllMissingLanguages || $[91] !== addAllTitle || $[92] !== addButtonsAreVisible || $[93] !== addedLanguages || $[94] !== allLanguagesArePresent || $[95] !== buttonAddAll || $[96] !== handleAddLanguages || $[97] !== readOnly ? (t23 = addButtonsAreVisible ? /* @__PURE__ */ jsxs(Stack, {
+	let canAddLanguages = !shouldMigrateArray && filteredLanguages?.length > 0, t20;
+	$[77] !== buttonLocations || $[78] !== canAddLanguages ? (t20 = canAddLanguages && buttonLocations.includes("fieldMenu"), $[77] = buttonLocations, $[78] = canAddLanguages, $[79] = t20) : t20 = $[79];
+	let showFieldMenu = t20, t21;
+	$[80] !== allFilteredLanguagesArePresent || $[81] !== buttonLocations || $[82] !== canAddLanguages ? (t21 = canAddLanguages && buttonLocations.includes("field") && !allFilteredLanguagesArePresent, $[80] = allFilteredLanguagesArePresent, $[81] = buttonLocations, $[82] = canAddLanguages, $[83] = t21) : t21 = $[83];
+	let showFieldButtons = t21, fieldHasMembers = members?.length > 0, t22;
+	$[84] !== filteredLanguages || $[85] !== value ? (t22 = createAddAllTitle(value, filteredLanguages), $[84] = filteredLanguages, $[85] = value, $[86] = t22) : t22 = $[86];
+	let addAllTitle = t22, t23;
+	$[87] !== addAllMissingLanguages || $[88] !== addAllTitle || $[89] !== addedLanguages || $[90] !== allFilteredLanguagesArePresent || $[91] !== buttonAddAll || $[92] !== handleAddLanguages || $[93] !== readOnly || $[94] !== showFieldButtons ? (t23 = showFieldButtons ? /* @__PURE__ */ jsxs(Stack, {
 		gap: 2,
 		children: [/* @__PURE__ */ jsx(AddButtons, {
 			languagesInUse: addedLanguages,
@@ -891,25 +953,58 @@ function InternationalizedArray(props) {
 			tone: "primary",
 			mode: "ghost",
 			"data-testid": "add-all-languages",
-			disabled: readOnly || allLanguagesArePresent,
+			disabled: readOnly || allFilteredLanguagesArePresent,
 			icon: AddIcon,
 			text: addAllTitle,
 			onClick: addAllMissingLanguages
 		}) : null]
-	}) : null, $[90] = addAllMissingLanguages, $[91] = addAllTitle, $[92] = addButtonsAreVisible, $[93] = addedLanguages, $[94] = allLanguagesArePresent, $[95] = buttonAddAll, $[96] = handleAddLanguages, $[97] = readOnly, $[98] = t23) : t23 = $[98];
-	let t24;
-	return $[99] !== t20 || $[100] !== t21 || $[101] !== t22 || $[102] !== t23 ? (t24 = /* @__PURE__ */ jsxs(Stack, {
+	}) : null, $[87] = addAllMissingLanguages, $[88] = addAllTitle, $[89] = addedLanguages, $[90] = allFilteredLanguagesArePresent, $[91] = buttonAddAll, $[92] = handleAddLanguages, $[93] = readOnly, $[94] = showFieldButtons, $[95] = t23) : t23 = $[95];
+	let fieldButtons = t23, t24;
+	$[96] !== addAllMissingLanguages || $[97] !== addAllTitle || $[98] !== addedLanguages || $[99] !== allFilteredLanguagesArePresent || $[100] !== buttonAddAll || $[101] !== handleAddLanguages || $[102] !== readOnly || $[103] !== showFieldMenu ? (t24 = showFieldMenu ? /* @__PURE__ */ jsx(CompactAddButton, {
+		languagesInUse: addedLanguages,
+		readOnly,
+		handleClick: handleAddLanguages,
+		onAddAll: addAllMissingLanguages,
+		buttonAddAll,
+		addAllTitle,
+		allFilteredLanguagesArePresent
+	}) : null, $[96] = addAllMissingLanguages, $[97] = addAllTitle, $[98] = addedLanguages, $[99] = allFilteredLanguagesArePresent, $[100] = buttonAddAll, $[101] = handleAddLanguages, $[102] = readOnly, $[103] = showFieldMenu, $[104] = t24) : t24 = $[104];
+	let t25;
+	if ($[105] !== filteredMembers || $[106] !== props) {
+		let t26;
+		$[108] === props ? t26 = $[109] : (t26 = (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), $[108] = props, $[109] = t26), t25 = filteredMembers.map(t26), $[105] = filteredMembers, $[106] = props, $[107] = t25;
+	} else t25 = $[107];
+	let t26;
+	$[110] === itemsNeedingMigration ? t26 = $[111] : (t26 = /* @__PURE__ */ jsx(MigrationBanner, { itemsNeedingMigration }), $[110] = itemsNeedingMigration, $[111] = t26);
+	let t27;
+	$[112] !== fieldHasMembers || $[113] !== showFieldButtons || $[114] !== showFieldMenu ? (t27 = !showFieldMenu && !showFieldButtons && !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, $[112] = fieldHasMembers, $[113] = showFieldButtons, $[114] = showFieldMenu, $[115] = t27) : t27 = $[115];
+	let t28;
+	return $[116] !== fieldButtons || $[117] !== t24 || $[118] !== t25 || $[119] !== t26 || $[120] !== t27 ? (t28 = /* @__PURE__ */ jsxs(Stack, {
 		gap: 2,
 		children: [
-			t20,
-			t21,
-			t22,
-			t23
+			t24,
+			t25,
+			t26,
+			t27,
+			fieldButtons
 		]
-	}), $[99] = t20, $[100] = t21, $[101] = t22, $[102] = t23, $[103] = t24) : t24 = $[103], t24;
+	}), $[116] = fieldButtons, $[117] = t24, $[118] = t25, $[119] = t26, $[120] = t27, $[121] = t28) : t28 = $[121], t28;
 }
-function _temp5(language_4) {
-	return language_4.id;
+function _temp5(language_5) {
+	return language_5.id;
 }
 function _temp4$1(item) {
 	return item.id && item.title;