@formatjs/editor 1.1.48 → 1.4.0

package/index.js

@@ -1,121 +1,337 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CoreApp = void 0;
-var tslib_1 = require("tslib");
-var react_1 = (0, tslib_1.__importStar)(require("react"));
-var core_1 = require("@material-ui/core");
-var icons_1 = require("@material-ui/icons");
-var header_1 = (0, tslib_1.__importDefault)(require("./header"));
-var react_intl_1 = require("react-intl");
-var messages_1 = (0, tslib_1.__importDefault)(require("./messages"));
-var MESSAGES_COUNT = 50;
-function fetchData() {
-    return (0, tslib_1.__awaiter)(this, void 0, void 0, function () {
-        var en, ru;
-        return (0, tslib_1.__generator)(this, function (_a) {
-            switch (_a.label) {
-                case 0: return [4 /*yield*/, fetch('/fixtures/en.json')];
-                case 1: return [4 /*yield*/, (_a.sent()).json()];
-                case 2:
-                    en = _a.sent();
-                    return [4 /*yield*/, fetch('/fixtures/ru.json')];
-                case 3: return [4 /*yield*/, (_a.sent()).json()];
-                case 4:
-                    ru = _a.sent();
-                    return [2 /*return*/, Object.keys(en)
-                            .slice(MESSAGES_COUNT)
-                            .map(function (id) { return ({
-                            id: id,
-                            defaultMessage: en[id],
-                            translatedMessage: ru[id],
-                        }); })];
-            }
-        });
-    });
+import { useEffect, useMemo, useRef, useState } from "react";
+import { isLiteralElement, isPluralElement, isPoundElement, isSelectElement, isTagElement, parse } from "@formatjs/icu-messageformat-parser";
+//#region packages/editor/message.tsx
+/** Retains every ICU branch and skeleton; incomplete edits are valid input. */
+function parseMessage(message) {
+	try {
+		return {
+			ast: parse(message),
+			error: null
+		};
+	} catch (error) {
+		return {
+			ast: null,
+			error: error instanceof Error ? error : new Error(String(error))
+		};
+	}
 }
-function CoreApp() {
-    var intl = (0, react_intl_1.useIntl)();
-    var _a = (0, react_1.useState)([]), messages = _a[0], setMessages = _a[1];
-    var _b = (0, react_1.useState)(true), isLoading = _b[0], setIsLoading = _b[1];
-    (0, react_1.useEffect)(function () {
-        ;
-        (function () {
-            return (0, tslib_1.__awaiter)(this, void 0, void 0, function () {
-                var _a;
-                return (0, tslib_1.__generator)(this, function (_b) {
-                    switch (_b.label) {
-                        case 0:
-                            _a = setMessages;
-                            return [4 /*yield*/, fetchData()];
-                        case 1:
-                            _a.apply(void 0, [_b.sent()]);
-                            setIsLoading(false);
-                            return [2 /*return*/];
-                    }
-                });
-            });
-        })();
-    }, []);
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(core_1.CssBaseline, null),
-        react_1.default.createElement(core_1.Box, { height: "100vh" },
-            react_1.default.createElement(core_1.AppBar, { position: "static" },
-                react_1.default.createElement(core_1.Toolbar, { variant: "dense" },
-                    react_1.default.createElement(core_1.IconButton, { edge: "start", color: "inherit", "aria-label": "menu" },
-                        react_1.default.createElement(icons_1.Menu, null)),
-                    react_1.default.createElement(core_1.Drawer, { anchor: "left" },
-                        react_1.default.createElement(core_1.List, null, ['Inbox', 'Starred', 'Send email', 'Drafts'].map(function (text) { return (react_1.default.createElement(core_1.ListItem, { button: true, key: text },
-                            react_1.default.createElement(core_1.ListItemText, { primary: text }))); }))),
-                    react_1.default.createElement(header_1.default, null),
-                    react_1.default.createElement(icons_1.AddAlert, null),
-                    react_1.default.createElement(icons_1.NotificationsOff, null))),
-            react_1.default.createElement(core_1.Grid, { container: true, spacing: 0 },
-                react_1.default.createElement(core_1.Grid, { xs: 3 },
-                    react_1.default.createElement("form", { noValidate: true, autoComplete: "off" },
-                        react_1.default.createElement(core_1.TextField, { type: "search", fullWidth: true, margin: "none", size: "small", variant: "filled", label: intl.formatMessage({
-                                id: 'search-bar-label',
-                                defaultMessage: 'Search message',
-                                description: 'label in search bar',
-                            }) })),
-                    react_1.default.createElement(core_1.Box, { borderRight: 1, overflow: "auto", height: "calc(100vh - 108px)" },
-                        react_1.default.createElement(messages_1.default, { messages: messages, isLoading: isLoading, count: MESSAGES_COUNT }))),
-                react_1.default.createElement(core_1.Grid, { xs: 6 },
-                    react_1.default.createElement(core_1.Box, { borderRight: 1, overflow: "auto", height: "calc(100vh - 48px)" },
-                        react_1.default.createElement(core_1.Box, { p: 2 },
-                            react_1.default.createElement(core_1.Typography, { variant: "h6", component: "h6" }, "English message"),
-                            react_1.default.createElement(core_1.Typography, { variant: "body2", component: "span" },
-                                "Description",
-                                ' ',
-                                react_1.default.createElement(core_1.Typography, { variant: "body2", color: "textSecondary", component: "span" }, "This is a description"))),
-                        react_1.default.createElement(core_1.TextField, { multiline: true, fullWidth: true, margin: "dense", size: "small", variant: "filled", rows: 4, label: intl.formatMessage({
-                                id: 'translated-box-label',
-                                defaultMessage: 'Translate',
-                                description: 'translated box label',
-                            }) }),
-                        react_1.default.createElement(core_1.Box, { px: 2, py: 1, display: "flex", justifyContent: "space-between", alignItems: "center" },
-                            react_1.default.createElement(core_1.Typography, { variant: "body2", component: "span" }, "71 / 101"),
-                            react_1.default.createElement(core_1.Box, null,
-                                react_1.default.createElement(core_1.ButtonGroup, { variant: "text", color: "primary", "aria-label": "text primary button group" },
-                                    react_1.default.createElement(core_1.Button, null, "Copy"),
-                                    react_1.default.createElement(core_1.Button, null, "Clear")),
-                                react_1.default.createElement(core_1.Button, { variant: "contained", color: "primary" }, "Translate"))))),
-                react_1.default.createElement(core_1.Grid, { xs: 3 },
-                    react_1.default.createElement(core_1.Tabs, { indicatorColor: "primary", textColor: "primary", centered: true, "aria-label": "disabled tabs example", value: 0, variant: "fullWidth" },
-                        react_1.default.createElement(core_1.Tab, { label: "Active" }),
-                        react_1.default.createElement(core_1.Tab, { label: "Active" })))))));
+function Message({ message, children }) {
+	return children(useMemo(() => parseMessage(message), [message]));
 }
-exports.CoreApp = CoreApp;
-function App() {
-    var prefersDarkMode = (0, core_1.useMediaQuery)('(prefers-color-scheme: dark)');
-    var theme = react_1.default.useMemo(function () {
-        return (0, core_1.createMuiTheme)({
-            palette: {
-                type: prefersDarkMode ? 'dark' : 'light',
-            },
-        });
-    }, [prefersDarkMode]);
-    return (react_1.default.createElement(react_intl_1.IntlProvider, { locale: "en", messages: {} },
-        react_1.default.createElement(core_1.ThemeProvider, { theme: theme },
-            react_1.default.createElement(CoreApp, null))));
+//#endregion
+//#region packages/editor/core.tsx
+/** Controlled message data with no DOM, styling, providers, or network access. */
+function useMessageEditor({ messages, onMessageChange, defaultSelectedId }) {
+	const [selectedId, selectMessage] = useState(defaultSelectedId);
+	const [query, setQuery] = useState("");
+	const selectedMessage = messages.find((message) => message.id === selectedId) ?? messages[0];
+	const visibleMessages = useMemo(() => {
+		const search = query.trim().toLowerCase();
+		return messages.filter((message) => [
+			message.id,
+			message.defaultMessage,
+			message.translatedMessage,
+			message.description ?? ""
+		].some((value) => value.toLowerCase().includes(search)));
+	}, [messages, query]);
+	const sourceText = selectedMessage?.defaultMessage;
+	const translationText = selectedMessage?.translatedMessage;
+	const source = useMemo(() => sourceText === void 0 ? void 0 : parseMessage(sourceText), [sourceText]);
+	const translation = useMemo(() => translationText === void 0 ? void 0 : parseMessage(translationText), [translationText]);
+	function setTranslation(value) {
+		if (selectedMessage) onMessageChange({
+			...selectedMessage,
+			translatedMessage: value
+		});
+	}
+	return {
+		messages: visibleMessages,
+		selectedMessage,
+		selectMessage,
+		query,
+		setQuery,
+		source,
+		translation,
+		setTranslation,
+		copySource: () => {
+			if (selectedMessage) setTranslation(selectedMessage.defaultMessage);
+		},
+		clearTranslation: () => setTranslation("")
+	};
 }
-exports.default = App;
+function Editor({ children, ...options }) {
+	return children(useMessageEditor(options));
+}
+//#endregion
+//#region packages/editor/validation.ts
+function group(elements) {
+	const groups = /* @__PURE__ */ new Map();
+	for (const element of elements) {
+		if (isLiteralElement(element) || isPoundElement(element)) continue;
+		const key = JSON.stringify([
+			element.type,
+			element.value,
+			"style" in element ? element.style : null
+		]);
+		groups.set(key, [...groups.get(key) ?? [], element]);
+	}
+	return groups;
+}
+function compatibleElement(source, target) {
+	if (isTagElement(source) && isTagElement(target)) return compatible(source.children, target.children);
+	if (isSelectElement(source) && isSelectElement(target)) {
+		const keys = Object.keys(source.options);
+		return keys.length === Object.keys(target.options).length && keys.every((key) => target.options[key] && compatible(source.options[key].value, target.options[key].value));
+	}
+	if (isPluralElement(source) && isPluralElement(target)) {
+		if (source.offset !== target.offset || source.pluralType !== target.pluralType) return false;
+		const exactKeys = (element) => Object.keys(element.options).filter((key) => key.startsWith("=")).sort().join(",");
+		if (exactKeys(source) !== exactKeys(target)) return false;
+		return Object.keys(target.options).every((key) => compatible((source.options[key] ?? source.options.other).value, target.options[key].value));
+	}
+	return true;
+}
+function compatible(source, target) {
+	const sourceGroups = group(source);
+	const targetGroups = group(target);
+	if (sourceGroups.size !== targetGroups.size) return false;
+	return [...targetGroups].every(([key, elements]) => {
+		const originals = sourceGroups.get(key);
+		return originals !== void 0 && elements.every((element) => originals.some((original) => compatibleElement(original, element))) && originals.every((original) => elements.some((element) => compatibleElement(original, element)));
+	});
+}
+/** Returns a stable error code; consumers own localized error copy. */
+function validateTranslation(source, translation) {
+	if (!translation.trim()) return "empty";
+	let sourceAst;
+	let translationAst;
+	try {
+		sourceAst = parse(source);
+	} catch {
+		return "invalid-source";
+	}
+	try {
+		translationAst = parse(translation);
+	} catch {
+		return "invalid-translation";
+	}
+	return compatible(sourceAst, translationAst) ? null : "structure";
+}
+//#endregion
+//#region packages/editor/workflow.ts
+const draftKey = (id, locale) => JSON.stringify([id, locale]);
+function reconcile(draft, remote) {
+	if (!draft) return {
+		value: remote,
+		baseline: remote,
+		remote,
+		saving: false,
+		error: null,
+		saved: false
+	};
+	if (draft.remote === remote) return draft;
+	return {
+		...draft,
+		remote,
+		baseline: remote,
+		value: draft.value === draft.baseline ? remote : draft.value
+	};
+}
+/** Per-message, per-locale drafts layered on the existing headless editor. */
+function useTranslationEditor({ messages, locales, onSave, defaultLocale, pageSize = 100 }) {
+	const [requestedLocale, requestLocale] = useState(defaultLocale);
+	const locale = requestedLocale && locales.includes(requestedLocale) ? requestedLocale : locales[0];
+	const [requestedCatalog, requestCatalog] = useState("");
+	const [status, updateStatus] = useState("all");
+	const [requestedPage, requestPage] = useState(0);
+	const [drafts, setDrafts] = useState({});
+	const pending = useRef(/* @__PURE__ */ new Set());
+	const remoteValues = useRef(/* @__PURE__ */ new Map());
+	const values = /* @__PURE__ */ new Map();
+	for (const message of messages) for (const value of locales) values.set(draftKey(message.id, value), message.translations[value] ?? "");
+	remoteValues.current = values;
+	const catalogs = useMemo(() => {
+		const values = /* @__PURE__ */ new Set();
+		for (const message of messages) for (const catalog of message.catalogs ?? []) values.add(catalog);
+		return [...values].sort();
+	}, [messages]);
+	const catalog = catalogs.includes(requestedCatalog) ? requestedCatalog : "";
+	const getDraft = (id, targetLocale = locale ?? "") => reconcile(drafts[draftKey(id, targetLocale)], remoteValues.current.get(draftKey(id, targetLocale)) ?? "");
+	function update(key, change) {
+		setDrafts((current) => ({
+			...current,
+			[key]: change(reconcile(current[key], remoteValues.current.get(key) ?? current[key]?.remote ?? ""))
+		}));
+	}
+	const editor = useMessageEditor({
+		messages: locale === void 0 ? [] : messages.filter((message) => {
+			const translated = !!getDraft(message.id).baseline;
+			return (!catalog || message.catalogs?.includes(catalog)) && (status === "all" || (status === "translated" ? translated : !translated));
+		}).map((message) => ({
+			id: message.id,
+			defaultMessage: message.defaultMessage,
+			description: message.description,
+			translatedMessage: getDraft(message.id).value
+		})),
+		onMessageChange: (message) => {
+			if (locale !== void 0) update(draftKey(message.id, locale), (draft) => ({
+				...draft,
+				value: message.translatedMessage,
+				error: null,
+				saved: false
+			}));
+		}
+	});
+	const selectedMessage = messages.find((message) => message.id === editor.selectedMessage?.id);
+	const size = Number.isFinite(pageSize) && pageSize > 0 ? Math.max(1, Math.floor(pageSize)) : 100;
+	const pageCount = Math.max(1, Math.ceil(editor.messages.length / size));
+	const page = Math.min(requestedPage, pageCount - 1);
+	useEffect(() => {
+		requestPage((current) => Math.min(current, pageCount - 1));
+	}, [pageCount]);
+	function getTranslation(id, targetLocale) {
+		const message = messages.find((value) => value.id === id);
+		if (!message || !locales.includes(targetLocale)) return void 0;
+		const key = draftKey(id, targetLocale);
+		const draft = getDraft(id, targetLocale);
+		const source = message.defaultMessage;
+		const validationError = validateTranslation(source, draft.value);
+		const changed = draft.value !== draft.baseline;
+		return {
+			value: draft.value,
+			baseline: draft.baseline,
+			validationError,
+			changed,
+			isSaving: draft.saving,
+			saveError: draft.error,
+			saved: draft.saved && !changed,
+			setTranslation: (value) => {
+				if (!remoteValues.current.has(key)) return;
+				update(key, (current) => ({
+					...current,
+					value,
+					error: null,
+					saved: false
+				}));
+			},
+			reset: () => {
+				if (!remoteValues.current.has(key)) return;
+				update(key, (current) => ({
+					...current,
+					value: current.baseline,
+					error: null,
+					saved: false
+				}));
+			},
+			save: async (context) => {
+				if (!remoteValues.current.has(key)) return {
+					status: "skipped",
+					reason: "unavailable"
+				};
+				if (pending.current.has(key)) return {
+					status: "skipped",
+					reason: "pending"
+				};
+				if (!changed) return {
+					status: "skipped",
+					reason: "unchanged"
+				};
+				if (validationError) return {
+					status: "invalid",
+					validationError
+				};
+				const submitted = draft.value;
+				const snapshot = Object.freeze({
+					source,
+					baselineTranslation: draft.baseline,
+					context
+				});
+				pending.current.add(key);
+				update(key, (current) => ({
+					...current,
+					saving: true,
+					error: null,
+					saved: false
+				}));
+				try {
+					const value = await onSave({
+						id,
+						locale: targetLocale,
+						translation: submitted
+					}, snapshot);
+					update(key, (current) => ({
+						...current,
+						baseline: submitted,
+						saved: true
+					}));
+					return {
+						status: "saved",
+						value
+					};
+				} catch (error) {
+					const saveError = error instanceof Error ? error : new Error(String(error));
+					update(key, (current) => ({
+						...current,
+						error: saveError
+					}));
+					return {
+						status: "failed",
+						error: saveError
+					};
+				} finally {
+					pending.current.delete(key);
+					update(key, (current) => ({
+						...current,
+						saving: false
+					}));
+				}
+			}
+		};
+	}
+	const selectedTranslation = selectedMessage && locale !== void 0 ? getTranslation(selectedMessage.id, locale) : void 0;
+	return {
+		editor: {
+			...editor,
+			setQuery: (query) => {
+				editor.setQuery(query);
+				requestPage(0);
+			}
+		},
+		selectedMessage,
+		locale,
+		setLocale: (value) => {
+			requestLocale(value);
+			requestPage(0);
+		},
+		catalogs,
+		catalog,
+		setCatalog: (value) => {
+			requestCatalog(value);
+			requestPage(0);
+		},
+		status,
+		setStatus: (value) => {
+			updateStatus(value);
+			requestPage(0);
+		},
+		page,
+		pageCount,
+		setPage: (value) => requestPage(Number.isFinite(value) ? Math.max(0, Math.min(Math.floor(value), pageCount - 1)) : 0),
+		pageMessages: editor.messages.slice(page * size, (page + 1) * size),
+		validationError: selectedTranslation?.validationError ?? null,
+		changed: selectedTranslation?.changed ?? false,
+		isSaving: selectedTranslation?.isSaving ?? false,
+		saveError: selectedTranslation?.saveError ?? null,
+		saved: selectedTranslation?.saved ?? false,
+		save: async (context) => selectedTranslation ? selectedTranslation.save(context) : {
+			status: "skipped",
+			reason: "unavailable"
+		},
+		reset: () => selectedTranslation?.reset(),
+		getTranslation
+	};
+}
+//#endregion
+export { Editor, Message, parseMessage, useMessageEditor, useTranslationEditor, validateTranslation };
+
+//# sourceMappingURL=index.js.map

package/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../message.tsx","../core.tsx","../validation.ts","../workflow.ts"],"sourcesContent":["import {\n  parse,\n  type MessageFormatElement,\n} from '@formatjs/icu-messageformat-parser'\nimport {useMemo, type ReactNode} from 'react'\n\nexport type ParsedMessage =\n  | {ast: MessageFormatElement[]; error: null}\n  | {ast: null; error: Error}\n\n/** Retains every ICU branch and skeleton; incomplete edits are valid input. */\nexport function parseMessage(message: string): ParsedMessage {\n  try {\n    return {ast: parse(message), error: null}\n  } catch (error) {\n    return {\n      ast: null,\n      error: error instanceof Error ? error : new Error(String(error)),\n    }\n  }\n}\n\nexport interface MessageProps {\n  message: string\n  children: (parsed: ParsedMessage) => ReactNode\n}\n\nexport function Message({message, children}: MessageProps): ReactNode {\n  const parsed = useMemo(() => parseMessage(message), [message])\n  return children(parsed)\n}\n","import {useMemo, useState, type ReactNode} from 'react'\nimport {parseMessage, type ParsedMessage} from './message.js'\nimport type {TranslatedMessage} from './types.js'\n\nexport interface EditorOptions {\n  messages: readonly TranslatedMessage[]\n  /** Apply the edit to consumer state; persistence stays with the consumer. */\n  onMessageChange: (message: TranslatedMessage) => void\n  defaultSelectedId?: string\n}\n\nexport interface EditorState {\n  messages: readonly TranslatedMessage[]\n  selectedMessage: TranslatedMessage | undefined\n  selectMessage: (id: string) => void\n  query: string\n  setQuery: (query: string) => void\n  source: ParsedMessage | undefined\n  translation: ParsedMessage | undefined\n  setTranslation: (value: string) => void\n  copySource: () => void\n  clearTranslation: () => void\n}\n\n/** Controlled message data with no DOM, styling, providers, or network access. */\nexport function useMessageEditor({\n  messages,\n  onMessageChange,\n  defaultSelectedId,\n}: EditorOptions): EditorState {\n  const [selectedId, selectMessage] = useState(defaultSelectedId)\n  const [query, setQuery] = useState('')\n  const selectedMessage =\n    messages.find(message => message.id === selectedId) ?? messages[0]\n  const visibleMessages = useMemo(() => {\n    const search = query.trim().toLowerCase()\n    return messages.filter(message =>\n      [\n        message.id,\n        message.defaultMessage,\n        message.translatedMessage,\n        message.description ?? '',\n      ].some(value => value.toLowerCase().includes(search))\n    )\n  }, [messages, query])\n  const sourceText = selectedMessage?.defaultMessage\n  const translationText = selectedMessage?.translatedMessage\n  const source = useMemo(\n    () => (sourceText === undefined ? undefined : parseMessage(sourceText)),\n    [sourceText]\n  )\n  const translation = useMemo(\n    () =>\n      translationText === undefined ? undefined : parseMessage(translationText),\n    [translationText]\n  )\n  function setTranslation(value: string): void {\n    if (selectedMessage)\n      onMessageChange({...selectedMessage, translatedMessage: value})\n  }\n  return {\n    messages: visibleMessages,\n    selectedMessage,\n    selectMessage,\n    query,\n    setQuery,\n    source,\n    translation,\n    setTranslation,\n    copySource: () => {\n      if (selectedMessage) setTranslation(selectedMessage.defaultMessage)\n    },\n    clearTranslation: () => setTranslation(''),\n  }\n}\n\nexport interface EditorProps extends EditorOptions {\n  children: (editor: EditorState) => ReactNode\n}\n\nexport function Editor({children, ...options}: EditorProps): ReactNode {\n  return children(useMessageEditor(options))\n}\n","import {\n  isLiteralElement,\n  isPluralElement,\n  isPoundElement,\n  isSelectElement,\n  isTagElement,\n  parse,\n  type MessageFormatElement,\n} from '@formatjs/icu-messageformat-parser'\n\nexport type TranslationValidationError =\n  | 'empty'\n  | 'invalid-source'\n  | 'invalid-translation'\n  | 'structure'\n\nfunction group(\n  elements: MessageFormatElement[]\n): Map<string, MessageFormatElement[]> {\n  const groups = new Map<string, MessageFormatElement[]>()\n  for (const element of elements) {\n    if (isLiteralElement(element) || isPoundElement(element)) continue\n    const key = JSON.stringify([\n      element.type,\n      element.value,\n      'style' in element ? element.style : null,\n    ])\n    groups.set(key, [...(groups.get(key) ?? []), element])\n  }\n  return groups\n}\n\nfunction compatibleElement(\n  source: MessageFormatElement,\n  target: MessageFormatElement\n): boolean {\n  if (isTagElement(source) && isTagElement(target))\n    return compatible(source.children, target.children)\n  if (isSelectElement(source) && isSelectElement(target)) {\n    const keys = Object.keys(source.options)\n    return (\n      keys.length === Object.keys(target.options).length &&\n      keys.every(\n        key =>\n          target.options[key] &&\n          compatible(source.options[key].value, target.options[key].value)\n      )\n    )\n  }\n  if (isPluralElement(source) && isPluralElement(target)) {\n    if (\n      source.offset !== target.offset ||\n      source.pluralType !== target.pluralType\n    )\n      return false\n    const exactKeys = (element: typeof source): string =>\n      Object.keys(element.options)\n        .filter(key => key.startsWith('='))\n        .sort()\n        .join(',')\n    if (exactKeys(source) !== exactKeys(target)) return false\n    // New locale categories inherit the source's fallback contract.\n    return Object.keys(target.options).every(key =>\n      compatible(\n        (source.options[key] ?? source.options.other).value,\n        target.options[key].value\n      )\n    )\n  }\n  return true\n}\n\nfunction compatible(\n  source: MessageFormatElement[],\n  target: MessageFormatElement[]\n): boolean {\n  const sourceGroups = group(source)\n  const targetGroups = group(target)\n  if (sourceGroups.size !== targetGroups.size) return false\n  return [...targetGroups].every(([key, elements]) => {\n    const originals = sourceGroups.get(key)\n    return (\n      originals !== undefined &&\n      elements.every(element =>\n        originals.some(original => compatibleElement(original, element))\n      ) &&\n      originals.every(original =>\n        elements.some(element => compatibleElement(original, element))\n      )\n    )\n  })\n}\n\n/** Returns a stable error code; consumers own localized error copy. */\nexport function validateTranslation(\n  source: string,\n  translation: string\n): TranslationValidationError | null {\n  if (!translation.trim()) return 'empty'\n  let sourceAst: MessageFormatElement[]\n  let translationAst: MessageFormatElement[]\n  try {\n    sourceAst = parse(source)\n  } catch {\n    return 'invalid-source'\n  }\n  try {\n    translationAst = parse(translation)\n  } catch {\n    return 'invalid-translation'\n  }\n  return compatible(sourceAst, translationAst) ? null : 'structure'\n}\n","import {useEffect, useMemo, useRef, useState} from 'react'\nimport {useMessageEditor, type EditorState} from '#packages/editor/core.js'\nimport {\n  validateTranslation,\n  type TranslationValidationError,\n} from '#packages/editor/validation.js'\n\nexport interface SourceLocation {\n  file: string\n  start?: number\n  end?: number\n}\nexport interface EditorMessage {\n  id: string\n  defaultMessage: string\n  description?: string\n  catalogs?: readonly string[]\n  locations?: readonly SourceLocation[]\n  translations: Readonly<Record<string, string | undefined>>\n}\nexport interface TranslationUpdate {\n  id: string\n  locale: string\n  translation: string\n}\nexport type MessageStatus = 'all' | 'translated' | 'missing'\n/** Render-snapshot metadata plus consumer-owned context supplied to save. */\nexport interface TranslationSaveSnapshot<TContext = void> {\n  readonly source: string\n  readonly baselineTranslation: string\n  readonly context: TContext | undefined\n}\nexport type TranslationSaveResult<TResult = void> =\n  | {status: 'saved'; value: TResult}\n  | {status: 'failed'; error: Error}\n  | {status: 'invalid'; validationError: TranslationValidationError}\n  | {status: 'skipped'; reason: 'unavailable' | 'unchanged' | 'pending'}\nexport interface TranslationEditorOptions<TContext = void, TResult = void> {\n  messages: readonly EditorMessage[]\n  locales: readonly string[]\n  onSave: (\n    update: TranslationUpdate,\n    snapshot: TranslationSaveSnapshot<TContext>\n  ) => TResult | Promise<TResult>\n  defaultLocale?: string\n  pageSize?: number\n}\n/** A render snapshot and actions for one message/locale pair. */\nexport interface TranslationDraftState<TContext = void, TResult = void> {\n  readonly value: string\n  readonly baseline: string\n  readonly validationError: TranslationValidationError | null\n  readonly changed: boolean\n  readonly isSaving: boolean\n  readonly saveError: Error | null\n  readonly saved: boolean\n  setTranslation: (value: string) => void\n  reset: () => void\n  save: (context?: TContext) => Promise<TranslationSaveResult<TResult>>\n}\nexport interface TranslationEditorState<TContext = void, TResult = void> {\n  editor: EditorState\n  selectedMessage: EditorMessage | undefined\n  locale: string | undefined\n  setLocale: (locale: string) => void\n  catalogs: readonly string[]\n  catalog: string\n  setCatalog: (catalog: string) => void\n  status: MessageStatus\n  setStatus: (status: MessageStatus) => void\n  page: number\n  pageCount: number\n  setPage: (page: number) => void\n  pageMessages: EditorState['messages']\n  validationError: TranslationValidationError | null\n  changed: boolean\n  isSaving: boolean\n  saveError: Error | null\n  saved: boolean\n  save: (context?: TContext) => Promise<TranslationSaveResult<TResult>>\n  reset: () => void\n  getTranslation: (\n    id: string,\n    locale: string\n  ) => TranslationDraftState<TContext, TResult> | undefined\n}\ninterface Draft {\n  value: string\n  baseline: string\n  remote: string\n  saving: boolean\n  error: Error | null\n  saved: boolean\n}\nconst draftKey = (id: string, locale: string): string =>\n  JSON.stringify([id, locale])\nfunction reconcile(draft: Draft | undefined, remote: string): Draft {\n  if (!draft)\n    return {\n      value: remote,\n      baseline: remote,\n      remote,\n      saving: false,\n      error: null,\n      saved: false,\n    }\n  if (draft.remote === remote) return draft\n  return {\n    ...draft,\n    remote,\n    baseline: remote,\n    value: draft.value === draft.baseline ? remote : draft.value,\n  }\n}\n\n/** Per-message, per-locale drafts layered on the existing headless editor. */\nexport function useTranslationEditor<TContext = void, TResult = void>({\n  messages,\n  locales,\n  onSave,\n  defaultLocale,\n  pageSize = 100,\n}: TranslationEditorOptions<TContext, TResult>): TranslationEditorState<\n  TContext,\n  TResult\n> {\n  const [requestedLocale, requestLocale] = useState(defaultLocale)\n  const locale =\n    requestedLocale && locales.includes(requestedLocale)\n      ? requestedLocale\n      : locales[0]\n  const [requestedCatalog, requestCatalog] = useState('')\n  const [status, updateStatus] = useState<MessageStatus>('all')\n  const [requestedPage, requestPage] = useState(0)\n  const [drafts, setDrafts] = useState<Record<string, Draft>>({})\n  const pending = useRef(new Set<string>())\n  const remoteValues = useRef(new Map<string, string>())\n  const values = new Map<string, string>()\n  for (const message of messages) {\n    for (const value of locales) {\n      values.set(draftKey(message.id, value), message.translations[value] ?? '')\n    }\n  }\n  remoteValues.current = values\n  const catalogs = useMemo(() => {\n    const values = new Set<string>()\n    for (const message of messages) {\n      for (const catalog of message.catalogs ?? []) values.add(catalog)\n    }\n    return [...values].sort()\n  }, [messages])\n  const catalog = catalogs.includes(requestedCatalog) ? requestedCatalog : ''\n  const getDraft = (id: string, targetLocale = locale ?? ''): Draft =>\n    reconcile(\n      drafts[draftKey(id, targetLocale)],\n      remoteValues.current.get(draftKey(id, targetLocale)) ?? ''\n    )\n  function update(key: string, change: (draft: Draft) => Draft): void {\n    setDrafts(current => ({\n      ...current,\n      [key]: change(\n        reconcile(\n          current[key],\n          remoteValues.current.get(key) ?? current[key]?.remote ?? ''\n        )\n      ),\n    }))\n  }\n  const editor = useMessageEditor({\n    messages:\n      locale === undefined\n        ? []\n        : messages\n            .filter(message => {\n              const translated = !!getDraft(message.id).baseline\n              return (\n                (!catalog || message.catalogs?.includes(catalog)) &&\n                (status === 'all' ||\n                  (status === 'translated' ? translated : !translated))\n              )\n            })\n            .map(message => ({\n              id: message.id,\n              defaultMessage: message.defaultMessage,\n              description: message.description,\n              translatedMessage: getDraft(message.id).value,\n            })),\n    onMessageChange: message => {\n      if (locale !== undefined)\n        update(draftKey(message.id, locale), draft => ({\n          ...draft,\n          value: message.translatedMessage,\n          error: null,\n          saved: false,\n        }))\n    },\n  })\n  const selectedMessage = messages.find(\n    message => message.id === editor.selectedMessage?.id\n  )\n  const size =\n    Number.isFinite(pageSize) && pageSize > 0\n      ? Math.max(1, Math.floor(pageSize))\n      : 100\n  const pageCount = Math.max(1, Math.ceil(editor.messages.length / size))\n  const page = Math.min(requestedPage, pageCount - 1)\n  useEffect(() => {\n    requestPage(current => Math.min(current, pageCount - 1))\n  }, [pageCount])\n  function getTranslation(\n    id: string,\n    targetLocale: string\n  ): TranslationDraftState<TContext, TResult> | undefined {\n    const message = messages.find(value => value.id === id)\n    if (!message || !locales.includes(targetLocale)) return undefined\n    const key = draftKey(id, targetLocale)\n    const draft = getDraft(id, targetLocale)\n    const source = message.defaultMessage\n    const validationError = validateTranslation(source, draft.value)\n    const changed = draft.value !== draft.baseline\n    return {\n      value: draft.value,\n      baseline: draft.baseline,\n      validationError,\n      changed,\n      isSaving: draft.saving,\n      saveError: draft.error,\n      saved: draft.saved && !changed,\n      setTranslation: value => {\n        if (!remoteValues.current.has(key)) return\n        update(key, current => ({...current, value, error: null, saved: false}))\n      },\n      reset: () => {\n        if (!remoteValues.current.has(key)) return\n        update(key, current => ({\n          ...current,\n          value: current.baseline,\n          error: null,\n          saved: false,\n        }))\n      },\n      save: async context => {\n        if (!remoteValues.current.has(key))\n          return {status: 'skipped', reason: 'unavailable'}\n        if (pending.current.has(key))\n          return {status: 'skipped', reason: 'pending'}\n        if (!changed) return {status: 'skipped', reason: 'unchanged'}\n        if (validationError) return {status: 'invalid', validationError}\n        const submitted = draft.value\n        const snapshot: TranslationSaveSnapshot<TContext> = Object.freeze({\n          source,\n          baselineTranslation: draft.baseline,\n          context,\n        })\n        pending.current.add(key)\n        update(key, current => ({\n          ...current,\n          saving: true,\n          error: null,\n          saved: false,\n        }))\n        try {\n          const value = await onSave(\n            {id, locale: targetLocale, translation: submitted},\n            snapshot\n          )\n          update(key, current => ({\n            ...current,\n            baseline: submitted,\n            saved: true,\n          }))\n          return {status: 'saved', value}\n        } catch (error) {\n          const saveError =\n            error instanceof Error ? error : new Error(String(error))\n          update(key, current => ({...current, error: saveError}))\n          return {status: 'failed', error: saveError}\n        } finally {\n          pending.current.delete(key)\n          update(key, current => ({...current, saving: false}))\n        }\n      },\n    }\n  }\n  const selectedTranslation =\n    selectedMessage && locale !== undefined\n      ? getTranslation(selectedMessage.id, locale)\n      : undefined\n  return {\n    editor: {\n      ...editor,\n      setQuery: query => {\n        editor.setQuery(query)\n        requestPage(0)\n      },\n    },\n    selectedMessage,\n    locale,\n    setLocale: value => {\n      requestLocale(value)\n      requestPage(0)\n    },\n    catalogs,\n    catalog,\n    setCatalog: value => {\n      requestCatalog(value)\n      requestPage(0)\n    },\n    status,\n    setStatus: value => {\n      updateStatus(value)\n      requestPage(0)\n    },\n    page,\n    pageCount,\n    setPage: value =>\n      requestPage(\n        Number.isFinite(value)\n          ? Math.max(0, Math.min(Math.floor(value), pageCount - 1))\n          : 0\n      ),\n    pageMessages: editor.messages.slice(page * size, (page + 1) * size),\n    validationError: selectedTranslation?.validationError ?? null,\n    changed: selectedTranslation?.changed ?? false,\n    isSaving: selectedTranslation?.isSaving ?? false,\n    saveError: selectedTranslation?.saveError ?? null,\n    saved: selectedTranslation?.saved ?? false,\n    save: async context =>\n      selectedTranslation\n        ? selectedTranslation.save(context)\n        : {status: 'skipped', reason: 'unavailable'},\n    reset: () => selectedTranslation?.reset(),\n    getTranslation,\n  }\n}\n"],"mappings":"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"}

package/package.json

@@ -1,42 +1,50 @@
 {
   "name": "@formatjs/editor",
-  "version": "1.1.48",
-  "description": "A ICU MessageFormat Editor UI",
+  "version": "1.4.0",
+  "private": false,
+  "description": "Headless ICU MessageFormat editor for React",
   "keywords": [
-    "intl",
+    "cli",
+    "format",
+    "formatjs",
+    "formatting",
+    "globalization",
     "i18n",
     "internationalization",
+    "intl",
     "locale",
     "localization",
-    "globalization",
     "react",
     "react-intl",
     "reactjs",
-    "format",
-    "formatjs",
-    "formatting",
     "translate",
-    "translation",
-    "cli"
+    "translation"
   ],
-  "author": "Long Ho <holevietlong@gmail.com>",
   "homepage": "https://github.com/formatjs/formatjs",
+  "bugs": {
+    "url": "https://github.com/formatjs/formatjs/issues"
+  },
   "license": "MIT",
-  "main": "index.js",
+  "author": "Long Ho <holevietlong@gmail.com>",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/formatjs/formatjs.git"
   },
+  "type": "module",
+  "sideEffects": false,
+  "types": "index.d.ts",
+  "exports": {
+    ".": "./index.js",
+    "./ui": {
+      "types": "./ui.d.ts",
+      "default": "./ui.js"
+    }
+  },
   "dependencies": {
-    "@formatjs/icu-messageformat-parser": "2.1.0",
-    "@material-ui/core": "^4.11.3",
-    "@material-ui/icons": "^4.11.2",
-    "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "17",
-    "react": "17",
-    "react-intl": "5.25.1"
+    "@formatjs/icu-messageformat-parser": "3.5.17"
   },
-  "bugs": {
-    "url": "https://github.com/formatjs/formatjs/issues"
+  "peerDependencies": {
+    "@types/react": "^19.0.0",
+    "react": "^19.0.0"
   }
-}
+}