@nice2dev/ui-3d 1.2.1 → 1.3.0

package/dist/cjs/model/NiceWeightPainter.js

@@ -252,7 +252,7 @@ const NiceWeightPainter = ({ skinnedMesh, activeBoneIndex: initialBoneIndex, sce
     React.useEffect(() => {
         setActiveBoneIndex(initialBoneIndex);
     }, [initialBoneIndex, setActiveBoneIndex]);
-    return (jsxRuntime.jsxs("div", { className: `nice-weight-painter ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxRuntime.jsxs("label", { children: ["Bone:", jsxRuntime.jsx("select", { value: activeBoneIndex, onChange: (e) => setActiveBoneIndex(parseInt(e.target.value, 10)), style: { marginLeft: 8, width: '100%' }, children: boneNames.map((name, i) => (jsxRuntime.jsx("option", { value: i, children: name }, i))) })] }), jsxRuntime.jsxs("fieldset", { style: {
+    return (jsxRuntime.jsxs("div", { className: `nice-weight-painter ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxRuntime.jsxs("label", { children: [t('weightPainter.bone', 'Bone:'), jsxRuntime.jsx("select", { value: activeBoneIndex, onChange: (e) => setActiveBoneIndex(parseInt(e.target.value, 10)), style: { marginLeft: 8, width: '100%' }, children: boneNames.map((name, i) => (jsxRuntime.jsx("option", { value: i, children: name }, i))) })] }), jsxRuntime.jsxs("fieldset", { style: {
                     display: 'flex',
                     gap: 4,
                     border: '1px solid var(--nice-border, #e2e8f0)',
@@ -267,7 +267,7 @@ const NiceWeightPainter = ({ skinnedMesh, activeBoneIndex: initialBoneIndex, sce
                             borderRadius: 4,
                             cursor: 'pointer',
                             fontSize: 11,
-                        }, children: mode }, mode)))] }), jsxRuntime.jsxs("label", { children: ["Radius: ", brush.radius.toFixed(2), jsxRuntime.jsx("input", { type: "range", min: 0.05, max: 2, step: 0.05, value: brush.radius, onChange: (e) => setBrush({ radius: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: ["Strength: ", brush.strength.toFixed(2), jsxRuntime.jsx("input", { type: "range", min: 0.01, max: 1, step: 0.01, value: brush.strength, onChange: (e) => setBrush({ strength: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxRuntime.jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxRuntime.jsx("button", { type: "button", onClick: isPainting ? stopPainting : startPainting, style: {
+                        }, children: mode }, mode)))] }), jsxRuntime.jsxs("label", { children: [t('weightPainter.radius', 'Radius: {radius}').replace('{radius}', String(brush.radius.toFixed(2))), jsxRuntime.jsx("input", { type: "range", min: 0.05, max: 2, step: 0.05, value: brush.radius, onChange: (e) => setBrush({ radius: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: [t('weightPainter.strength', 'Strength: {strength}').replace('{strength}', String(brush.strength.toFixed(2))), jsxRuntime.jsx("input", { type: "range", min: 0.01, max: 1, step: 0.01, value: brush.strength, onChange: (e) => setBrush({ strength: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxRuntime.jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxRuntime.jsx("button", { type: "button", onClick: isPainting ? stopPainting : startPainting, style: {
                             flex: 1,
                             background: isPainting
                                 ? 'var(--nice-danger, #ef4444)'

package/dist/cjs/model/NiceXRPreview.js

@@ -296,7 +296,7 @@ const NiceXRPreview = ({ renderer, scene, camera, mode: initialMode, onSessionSt
                                     background: mode === 'vr' ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
                                     color: mode === 'vr' ? 'var(--nice-color-white, #fff)' : 'inherit',
                                     border: '1px solid var(--nice-border, #e2e8f0)',
-                                }, children: [jsxRuntime.jsx(ui.NiceIcon, { name: "eye", size: 14 }), " VR"] }), jsxRuntime.jsxs("button", { type: "button", onClick: () => setMode('ar'), style: {
+                                }, children: [jsxRuntime.jsx(ui.NiceIcon, { name: "eye", size: 14 }), " ", t('xrPreview.vr', 'VR')] }), jsxRuntime.jsxs("button", { type: "button", onClick: () => setMode('ar'), style: {
                                     flex: 1,
                                     padding: '5px 8px',
                                     borderRadius: 4,
@@ -304,7 +304,7 @@ const NiceXRPreview = ({ renderer, scene, camera, mode: initialMode, onSessionSt
                                     background: mode === 'ar' ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
                                     color: mode === 'ar' ? 'var(--nice-color-white, #fff)' : 'inherit',
                                     border: '1px solid var(--nice-border, #e2e8f0)',
-                                }, children: [jsxRuntime.jsx(ui.NiceIcon, { name: "window", size: 14 }), " AR"] })] }), jsxRuntime.jsx("button", { type: "button", onClick: isSessionActive ? endSession : startSession, style: {
+                                }, children: [jsxRuntime.jsx(ui.NiceIcon, { name: "window", size: 14 }), " ", t('xrPreview.ar', 'AR')] })] }), jsxRuntime.jsx("button", { type: "button", onClick: isSessionActive ? endSession : startSession, style: {
                             background: isSessionActive
                                 ? 'var(--nice-danger, #ef4444)'
                                 : 'var(--nice-success, #22c55e)',
@@ -313,7 +313,10 @@ const NiceXRPreview = ({ renderer, scene, camera, mode: initialMode, onSessionSt
                             borderRadius: 4,
                             padding: '6px 12px',
                             cursor: 'pointer',
-                        }, children: isSessionActive ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.NiceIcon, { name: "stop", size: 14 }), " ", t('xrPreview.exitXr', 'Exit XR')] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.NiceIcon, { name: "play", size: 14 }), " ", t('xrPreview.enterXr', 'Enter XR')] })) }), mode === 'vr' && (jsxRuntime.jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsxRuntime.jsx("input", { type: "checkbox", checked: teleportEnabled, onChange: (e) => setTeleportEnabled(e.target.checked) }), t('xrPreview.teleportation', 'Teleportation')] })), isSessionActive && (jsxRuntime.jsxs("div", { style: { fontSize: 11, opacity: 0.7 }, children: ["Controllers: ", controllers.length, jsxRuntime.jsx("br", {}), mode === 'ar' && hitTestResult && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: ["Hit: (", hitTestResult.x.toFixed(2), ", ", hitTestResult.y.toFixed(2), ",", ' ', hitTestResult.z.toFixed(2), ")"] }))] }))] }))] }));
+                        }, children: isSessionActive ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.NiceIcon, { name: "stop", size: 14 }), " ", t('xrPreview.exitXr', 'Exit XR')] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.NiceIcon, { name: "play", size: 14 }), " ", t('xrPreview.enterXr', 'Enter XR')] })) }), mode === 'vr' && (jsxRuntime.jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsxRuntime.jsx("input", { type: "checkbox", checked: teleportEnabled, onChange: (e) => setTeleportEnabled(e.target.checked) }), t('xrPreview.teleportation', 'Teleportation')] })), isSessionActive && (jsxRuntime.jsxs("div", { style: { fontSize: 11, opacity: 0.7 }, children: [t('xrPreview.controllers', 'Controllers: {controllers}').replace('{controllers}', String(controllers.length)), jsxRuntime.jsx("br", {}), mode === 'ar' && hitTestResult && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: t('xrPreview.hit', 'Hit: ({x}, {y}, {z})')
+                                    .replace('{x}', String(hitTestResult.x.toFixed(2)))
+                                    .replace('{y}', String(hitTestResult.y.toFixed(2)))
+                                    .replace('{z}', String(hitTestResult.z.toFixed(2))) }))] }))] }))] }));
 };
 
 exports.NiceXRPreview = NiceXRPreview;

package/dist/cjs/model/useModelEditor.js

@@ -24,6 +24,7 @@ var SVGLoader_js = require('three/examples/jsm/loaders/SVGLoader.js');
 var TDSLoader_js = require('three/examples/jsm/loaders/TDSLoader.js');
 var VTKLoader_js = require('three/examples/jsm/loaders/VTKLoader.js');
 var editorAsk = require('../core/editorAsk.js');
+var i18n = require('../core/i18n.js');
 var threeCompat = require('../core/threeCompat.js');
 var modelEditorTypes = require('./modelEditorTypes.js');
 var modelEditorUtils = require('./modelEditorUtils.js');
@@ -76,6 +77,7 @@ function findNodeById(nodes, id) {
    ═══════════════════════════════════════════ */
 function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
     var _a;
+    const { t } = i18n.useNiceTranslation();
     const { pendingAsk, ask } = editorAsk.useEditorAsk();
     /* ── refs ── */
     const mountRef = React.useRef(null);
@@ -415,14 +417,16 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         }
         focusOnObjectRef.current(obj);
         rebuildTree();
-        setStatusText(`Loaded: ${filename} (${clips.length} animation(s))`);
-    }, [rebuildTree]);
+        setStatusText(t('useModelEditor.loadedAnimationS', 'Loaded: {filename} ({clips} animation(s))')
+            .replace('{filename}', String(filename))
+            .replace('{clips}', String(clips.length)));
+    }, [rebuildTree, t]);
     const loadFile = React.useCallback(async (file) => {
         var _a, _b, _c, _d, _e, _f;
         const name = file.name.toLowerCase();
         const ext = '.' + name.split('.').pop();
         const url = URL.createObjectURL(file);
-        setStatusText(`Loading ${file.name}...`);
+        setStatusText(t('useModelEditor.loading', 'Loading {name}...').replace('{name}', String(file.name)));
         try {
             if (ext === '.fbx') {
                 const loader = new FBXLoader_js.FBXLoader();
@@ -546,32 +550,34 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
                 addObjectToScene(group, [], file.name);
             }
             else {
-                setStatusText(`Unsupported format: ${ext}`);
+                setStatusText(t('useModelEditor.unsupportedFormat', 'Unsupported format: {ext}').replace('{ext}', String(ext)));
             }
         }
         catch (err) {
             log.error('Load error:', err);
-            setStatusText(`Error loading ${file.name}: ${String(err)}`);
+            setStatusText(t('useModelEditor.errorLoading', 'Error loading {name}: {err}')
+                .replace('{name}', String(file.name))
+                .replace('{err}', String(String(err))));
         }
         finally {
             URL.revokeObjectURL(url);
         }
-    }, [addObjectToScene]);
+    }, [addObjectToScene, t]);
     const mergeAnimationFBX = React.useCallback(async (file) => {
         var _a;
         const url = URL.createObjectURL(file);
-        setStatusText(`Merging animations from ${file.name}...`);
+        setStatusText(t('useModelEditor.mergingAnimationsFrom', 'Merging animations from {name}...').replace('{name}', String(file.name)));
         try {
             const loader = new FBXLoader_js.FBXLoader();
             const obj = await new Promise((res, rej) => loader.load(url, res, undefined, rej));
             const clips = (_a = obj.animations) !== null && _a !== void 0 ? _a : [];
             if (clips.length === 0) {
-                setStatusText(`No animations found in ${file.name}`);
+                setStatusText(t('useModelEditor.noAnimationsFoundIn', 'No animations found in {name}').replace('{name}', String(file.name)));
                 return;
             }
             const root = rootObjectRef.current;
             if (!root) {
-                setStatusText('No model loaded — load a base model first');
+                setStatusText(t('useModelEditor.noModelLoadedLoadA', 'No model loaded — load a base model first'));
                 return;
             }
             if (!mixerRef.current) {
@@ -585,16 +591,20 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             }));
             allClipsRef.current = [...allClipsRef.current, ...newAnims];
             setAnimations([...allClipsRef.current]);
-            setStatusText(`Merged ${clips.length} animation(s) from ${file.name}`);
+            setStatusText(t('useModelEditor.mergedAnimationSFrom', 'Merged {clips} animation(s) from {name}')
+                .replace('{clips}', String(clips.length))
+                .replace('{name}', String(file.name)));
         }
         catch (err) {
             log.error('Merge error:', err);
-            setStatusText(`Error merging ${file.name}: ${String(err)}`);
+            setStatusText(t('useModelEditor.errorMerging', 'Error merging {name}: {err}')
+                .replace('{name}', String(file.name))
+                .replace('{err}', String(String(err))));
         }
         finally {
             URL.revokeObjectURL(url);
         }
-    }, []);
+    }, [t]);
     /* ─────────────────────────────────────────
        Animation controls
        ───────────────────────────────────────── */
@@ -952,18 +962,40 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         clone.position.x += 1;
         sceneRef.current.add(clone);
         rebuildTree();
-        setStatusText(`Duplicated ${selectedNode.name}`);
-    }, [selectedNode, rebuildTree]);
+        setStatusText(t('useModelEditor.duplicated', 'Duplicated {name}').replace('{name}', String(selectedNode.name)));
+    }, [selectedNode, rebuildTree, t]);
     /* ─────────────────────────────────────────
        Keyboard shortcuts
        ───────────────────────────────────────── */
     React.useEffect(() => {
+        // Escape, then Tab, leaves the viewport, where Tab cycles the mode (WCAG 2.1.2)
+        let tabEscape = false;
         const handleKey = (e) => {
-            var _a, _b, _c;
-            const tag = (_a = e.target) === null || _a === void 0 ? void 0 : _a.tagName;
-            if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT') {
+            var _a, _b, _c, _d;
+            // a key sent to the window itself counts as the body's
+            const target = e.target instanceof HTMLElement ? e.target : null;
+            const tag = target === null || target === void 0 ? void 0 : target.tagName;
+            if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT' || (target === null || target === void 0 ? void 0 : target.isContentEditable)) {
+                return;
+            }
+            // The shortcuts are this editor's: keys elsewhere on the page are not, and Tab / Space on
+            // one of its controls move focus and press it. They listened on the whole page — Tab moved
+            // focus nowhere on a page with the editor and Space pressed no button (TODO_1.3.0 I4).
+            const root = (_b = (_a = mountRef.current) === null || _a === void 0 ? void 0 : _a.closest('.nice-app-shell')) !== null && _b !== void 0 ? _b : mountRef.current;
+            if (target && target !== document.body && !(root === null || root === void 0 ? void 0 : root.contains(target))) {
+                return;
+            }
+            if ((e.key === 'Tab' || e.key === ' ') &&
+                (target === null || target === void 0 ? void 0 : target.closest('button, a[href], [role="button"], [role="combobox"], [role="menuitem"], [role="tab"], [role="option"], [role="checkbox"], [role="switch"], [role="slider"], [role="treeitem"]'))) {
                 return;
             }
+            if (e.key === 'Tab' && tabEscape) {
+                tabEscape = false;
+                return;
+            }
+            if (!['Shift', 'Control', 'Alt', 'Meta'].includes(e.key)) {
+                tabEscape = e.key === 'Escape';
+            }
             switch (e.key.toLowerCase()) {
                 case 'g':
                     setTransformMode('translate');
@@ -990,7 +1022,7 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
                         const sel = findNodeById(sceneTree, selectedId);
                         if (sel) {
                             sel.object.removeFromParent();
-                            (_b = transformRef.current) === null || _b === void 0 ? void 0 : _b.detach();
+                            (_c = transformRef.current) === null || _c === void 0 ? void 0 : _c.detach();
                             setSelectedId(null);
                             rebuildTree();
                         }
@@ -1001,7 +1033,7 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
                         const sel = findNodeById(sceneTree, selectedId);
                         if (sel) {
                             sel.object.removeFromParent();
-                            (_c = transformRef.current) === null || _c === void 0 ? void 0 : _c.detach();
+                            (_d = transformRef.current) === null || _d === void 0 ? void 0 : _d.detach();
                             setSelectedId(null);
                             rebuildTree();
                         }
@@ -1097,7 +1129,7 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
     const exportGLTF = React.useCallback((binary) => {
         const root = rootObjectRef.current;
         if (!root) {
-            setStatusText('Nothing to export');
+            setStatusText(t('useModelEditor.nothingToExport', 'Nothing to export'));
             return;
         }
         const exporter = new GLTFExporter_js.GLTFExporter();
@@ -1118,16 +1150,16 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             a.download = `export.${binary ? 'glb' : 'gltf'}`;
             a.click();
             URL.revokeObjectURL(a.href);
-            setStatusText(`Exported ${binary ? 'GLB' : 'GLTF'} successfully`);
+            setStatusText(t('useModelEditor.exportedFormat', 'Exported {format} successfully').replace('{format}', binary ? 'GLB' : 'GLTF'));
         }, (err) => {
             log.error('Export error:', err);
-            setStatusText(`Export error: ${String(err)}`);
+            setStatusText(t('useModelEditor.exportError', 'Export error: {err}').replace('{err}', String(String(err))));
         }, options);
-    }, []);
+    }, [t]);
     const exportOBJ = React.useCallback(() => {
         const root = rootObjectRef.current;
         if (!root) {
-            setStatusText('Nothing to export');
+            setStatusText(t('useModelEditor.nothingToExport', 'Nothing to export'));
             return;
         }
         const exporter = new OBJExporter_js.OBJExporter();
@@ -1138,12 +1170,12 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         a.download = 'export.obj';
         a.click();
         URL.revokeObjectURL(a.href);
-        setStatusText('Exported OBJ successfully');
-    }, []);
+        setStatusText(t('useModelEditor.exportedFormat', 'Exported {format} successfully').replace('{format}', 'OBJ'));
+    }, [t]);
     const exportSTL = React.useCallback((binary) => {
         const root = rootObjectRef.current;
         if (!root) {
-            setStatusText('Nothing to export');
+            setStatusText(t('useModelEditor.nothingToExport', 'Nothing to export'));
             return;
         }
         const exporter = new STLExporter_js.STLExporter();
@@ -1160,12 +1192,12 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         a.download = 'export.stl';
         a.click();
         URL.revokeObjectURL(a.href);
-        setStatusText(`Exported STL${binary ? ' (binary)' : ''} successfully`);
-    }, []);
+        setStatusText(t('useModelEditor.exportedFormat', 'Exported {format} successfully').replace('{format}', binary ? t('useModelEditor.stlBinary', 'STL (binary)') : 'STL'));
+    }, [t]);
     const exportPLY = React.useCallback((binary) => {
         const root = rootObjectRef.current;
         if (!root) {
-            setStatusText('Nothing to export');
+            setStatusText(t('useModelEditor.nothingToExport', 'Nothing to export'));
             return;
         }
         const exporter = new PLYExporter_js.PLYExporter();
@@ -1183,13 +1215,13 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             a.download = 'export.ply';
             a.click();
             URL.revokeObjectURL(a.href);
-            setStatusText(`Exported PLY${binary ? ' (binary)' : ''} successfully`);
+            setStatusText(t('useModelEditor.exportedFormat', 'Exported {format} successfully').replace('{format}', binary ? t('useModelEditor.plyBinary', 'PLY (binary)') : 'PLY'));
         }, { binary });
-    }, []);
+    }, [t]);
     const exportUSDZ = React.useCallback(async () => {
         const root = rootObjectRef.current;
         if (!root) {
-            setStatusText('Nothing to export');
+            setStatusText(t('useModelEditor.nothingToExport', 'Nothing to export'));
             return;
         }
         try {
@@ -1204,13 +1236,13 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             a.download = 'export.usdz';
             a.click();
             URL.revokeObjectURL(a.href);
-            setStatusText('Exported USDZ successfully');
+            setStatusText(t('useModelEditor.exportedFormat', 'Exported {format} successfully').replace('{format}', 'USDZ'));
         }
         catch (err) {
             log.error('USDZ export error:', err);
-            setStatusText(`USDZ export error: ${String(err)}`);
+            setStatusText(t('useModelEditor.usdzExportError', 'USDZ export error: {err}').replace('{err}', String(String(err))));
         }
-    }, []);
+    }, [t]);
     /* ─────────────────────────────────────────
        Dispose & clear
        ───────────────────────────────────────── */
@@ -1279,8 +1311,8 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         setAnimDuration(0);
         setSelectedId(null);
         rebuildTree();
-        setStatusText('Scene cleared');
-    }, [rebuildTree, disposeObject]);
+        setStatusText(t('useModelEditor.sceneCleared', 'Scene cleared'));
+    }, [rebuildTree, disposeObject, t]);
     // asks first: clearing cannot be undone
     const clearScene = React.useCallback(() => {
         void ask('confirm', 'Clear the entire scene? This cannot be undone.').then((answer) => {
@@ -1298,7 +1330,7 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         }
         const root = rootObjectRef.current;
         if (!root) {
-            setStatusText('Nothing to save');
+            setStatusText(t('useModelEditor.nothingToSave', 'Nothing to save'));
             return;
         }
         const exporter = new GLTFExporter_js.GLTFExporter();
@@ -1316,9 +1348,9 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             reader.readAsDataURL(blob);
         }, (err) => {
             log.error('Save to library error:', err);
-            setStatusText(`Save error: ${String(err)}`);
+            setStatusText(t('useModelEditor.saveError', 'Save error: {err}').replace('{err}', String(String(err))));
         }, { binary: true, animations: allClipsRef.current.map((a) => a.clip) });
-    }, [onSaveToLibrary, ask]);
+    }, [onSaveToLibrary, ask, t]);
     /* ─────────────────────────────────────────
        Add Mesh / Light / Camera / Empty
        ───────────────────────────────────────── */
@@ -1385,9 +1417,9 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         }
         sceneRef.current.add(mesh);
         rebuildTree();
-        setStatusText(`Added ${mesh.name}`);
+        setStatusText(t('useModelEditor.added', 'Added {name}').replace('{name}', String(mesh.name)));
         setAddMenuOpen(null);
-    }, [rebuildTree]);
+    }, [rebuildTree, t]);
     const addSceneLight = React.useCallback((type) => {
         let light;
         switch (type) {
@@ -1439,9 +1471,9 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             sceneRef.current.add(helper);
         }
         rebuildTree();
-        setStatusText(`Added ${light.name}`);
+        setStatusText(t('useModelEditor.added', 'Added {name}').replace('{name}', String(light.name)));
         setAddMenuOpen(null);
-    }, [rebuildTree]);
+    }, [rebuildTree, t]);
     const addCameraObject = React.useCallback(() => {
         const cam = new THREE__namespace.PerspectiveCamera(50, 16 / 9, 0.1, 1000);
         cam.name = 'Camera';
@@ -1452,9 +1484,9 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         helper.name = '__helper_Camera';
         sceneRef.current.add(helper);
         rebuildTree();
-        setStatusText('Added Camera');
+        setStatusText(t('useModelEditor.addedCamera', 'Added Camera'));
         setAddMenuOpen(null);
-    }, [rebuildTree]);
+    }, [rebuildTree, t]);
     const addEmpty = React.useCallback((type) => {
         const obj = new THREE__namespace.Object3D();
         obj.name =
@@ -1466,9 +1498,9 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             obj.add(h);
         }
         rebuildTree();
-        setStatusText(`Added ${obj.name}`);
+        setStatusText(t('useModelEditor.added', 'Added {name}').replace('{name}', String(obj.name)));
         setAddMenuOpen(null);
-    }, [rebuildTree]);
+    }, [rebuildTree, t]);
     /* ─────────────────────────────────────────
        Raycaster click-to-select
        ───────────────────────────────────────── */
@@ -1536,14 +1568,16 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         }
         e.target.value = '';
         if (!onAIPoseVideo) {
-            setAiStatus('AI pose callback not configured.');
+            setAiStatus(t('useModelEditor.aiPoseCallbackNotConfigured', 'AI pose callback not configured.'));
             return;
         }
         setAiBusy(true);
-        setAiStatus('Uploading video for AI pose estimation...');
+        setAiStatus(t('useModelEditor.uploadingVideoForAiPose', 'Uploading video for AI pose estimation...'));
         try {
             const result = await onAIPoseVideo(file);
-            setAiStatus(`Got ${result.frame_count} frames at ${result.fps} fps. Creating animation clip...`);
+            setAiStatus(t('useModelEditor.gotFramesAtFpsCreating', 'Got {frame_count} frames at {fps} fps. Creating animation clip...')
+                .replace('{frame_count}', String(result.frame_count))
+                .replace('{fps}', String(result.fps)));
             const clip = modelEditorTypes.pose3dToClip(result);
             if (clip && rootObjectRef.current) {
                 if (!mixerRef.current) {
@@ -1558,20 +1592,20 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
                 allClipsRef.current = [...allClipsRef.current, newAnim];
                 setAnimations([...allClipsRef.current]);
                 playClip(allClipsRef.current.length - 1);
-                setAiStatus('Animation created successfully!');
+                setAiStatus(t('useModelEditor.animationCreatedSuccessfully', 'Animation created successfully!'));
             }
             else {
-                setAiStatus('Could not create animation — load a rigged model first.');
+                setAiStatus(t('useModelEditor.couldNotCreateAnimationLoad', 'Could not create animation — load a rigged model first.'));
             }
         }
         catch (err) {
             log.error('AI pose error:', err);
-            setAiStatus(`Error: ${String(err)}`);
+            setAiStatus(t('useModelEditor.error', 'Error: {err}').replace('{err}', String(String(err))));
         }
         finally {
             setAiBusy(false);
         }
-    }, [playClip, onAIPoseVideo]);
+    }, [playClip, onAIPoseVideo, t]);
     /* ─────────────────────────────────────────
        Node helpers
        ───────────────────────────────────────── */
@@ -1595,26 +1629,37 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
     const undo = React.useCallback(() => {
         const label = undoRedoRef.current.undo();
         if (label) {
-            setStatusText(`Undo: ${label}`);
+            setStatusText(t('useModelEditor.undo', 'Undo: {label}').replace('{label}', String(label)));
             rebuildTree();
         }
         setUndoRedoVer((v) => v + 1);
-    }, [rebuildTree]);
+    }, [rebuildTree, t]);
     const redo = React.useCallback(() => {
         const label = undoRedoRef.current.redo();
         if (label) {
-            setStatusText(`Redo: ${label}`);
+            setStatusText(t('useModelEditor.redo', 'Redo: {label}').replace('{label}', String(label)));
             rebuildTree();
         }
         setUndoRedoVer((v) => v + 1);
-    }, [rebuildTree]);
+    }, [rebuildTree, t]);
     const canUndo = undoRedoRef.current.canUndo();
     const canRedo = undoRedoRef.current.canRedo();
     const undoLabel = undoRedoRef.current.undoLabel;
     const redoLabel = undoRedoRef.current.redoLabel;
-    // Keyboard shortcuts for undo/redo
+    // Keyboard shortcuts for undo/redo — in this editor only, and not in a text field, whose own
+    // undo they took (on the whole page before)
     React.useEffect(() => {
         const handleKeyDown = (e) => {
+            var _a, _b;
+            const target = e.target instanceof HTMLElement ? e.target : null;
+            const tag = target === null || target === void 0 ? void 0 : target.tagName;
+            const root = (_b = (_a = mountRef.current) === null || _a === void 0 ? void 0 : _a.closest('.nice-app-shell')) !== null && _b !== void 0 ? _b : mountRef.current;
+            if (tag === 'INPUT' ||
+                tag === 'TEXTAREA' ||
+                (target === null || target === void 0 ? void 0 : target.isContentEditable) ||
+                (target && target !== document.body && !(root === null || root === void 0 ? void 0 : root.contains(target)))) {
+                return;
+            }
             if ((e.ctrlKey || e.metaKey) && e.key === 'z' && !e.shiftKey) {
                 e.preventDefault();
                 undo();
@@ -1636,30 +1681,35 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             return modelEditorTypes.SUPPORTED_EXTENSIONS.includes(ext);
         });
         if (fileArray.length === 0) {
-            setStatusText('No supported files found');
+            setStatusText(t('useModelEditor.noSupportedFilesFound', 'No supported files found'));
             return;
         }
-        setStatusText(`Importing ${fileArray.length} file(s)...`);
+        setStatusText(t('useModelEditor.importingFileS', 'Importing {fileArray} file(s)...').replace('{fileArray}', String(fileArray.length)));
         let loaded = 0;
         for (const file of fileArray) {
             try {
                 await loadFile(file);
                 loaded++;
-                setStatusText(`Imported ${loaded}/${fileArray.length}: ${file.name}`);
+                setStatusText(t('useModelEditor.imported', 'Imported {loaded}/{fileArray}: {name}')
+                    .replace('{loaded}', String(loaded))
+                    .replace('{fileArray}', String(fileArray.length))
+                    .replace('{name}', String(file.name)));
             }
             catch (err) {
                 log.error(`Failed to import ${file.name}:`, err);
             }
         }
-        setStatusText(`Batch import complete: ${loaded}/${fileArray.length} files loaded`);
-    }, [loadFile]);
+        setStatusText(t('useModelEditor.batchImportCompleteFilesLoaded', 'Batch import complete: {loaded}/{fileArray} files loaded')
+            .replace('{loaded}', String(loaded))
+            .replace('{fileArray}', String(fileArray.length)));
+    }, [loadFile, t]);
     /* ─────────────────────────────────────────
        PBR Presets
        ───────────────────────────────────────── */
     const applyPreset = React.useCallback((preset) => {
         const node = selectedNode;
         if (!node || !(node.object instanceof THREE__namespace.Mesh)) {
-            setStatusText('Select a mesh to apply material preset');
+            setStatusText(t('useModelEditor.selectAMeshToApply', 'Select a mesh to apply material preset'));
             return;
         }
         const mesh = node.object;
@@ -1692,7 +1742,7 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             mesh.material = newMaterial;
         }
         pushUndo({
-            label: `Apply ${preset.name} preset`,
+            label: t('useModelEditor.applyPreset', 'Apply {name} preset').replace('{name}', String(preset.name)),
             undo: () => {
                 if (Array.isArray(mesh.material)) {
                     mesh.material[materialIdx] = oldClone;
@@ -1711,15 +1761,15 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             },
         });
         setMatRefresh((v) => v + 1);
-        setStatusText(`Applied ${preset.name} preset`);
-    }, [selectedNode, selMaterialIdx, pushUndo]);
+        setStatusText(t('useModelEditor.appliedPreset', 'Applied {name} preset').replace('{name}', String(preset.name)));
+    }, [selectedNode, selMaterialIdx, pushUndo, t]);
     /* ─────────────────────────────────────────
        LOD Generation
        ───────────────────────────────────────── */
     const generateSelectedLOD = React.useCallback(() => {
         const node = selectedNode;
         if (!node || !(node.object instanceof THREE__namespace.Mesh)) {
-            setStatusText('Select a mesh to generate LOD');
+            setStatusText(t('useModelEditor.selectAMeshToGenerate', 'Select a mesh to generate LOD'));
             return;
         }
         const mesh = node.object;
@@ -1728,7 +1778,7 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         parent.remove(mesh);
         parent.add(lod);
         pushUndo({
-            label: `Generate LOD for ${mesh.name}`,
+            label: t('useModelEditor.generateLodFor', 'Generate LOD for {name}').replace('{name}', String(mesh.name)),
             undo: () => {
                 parent.remove(lod);
                 parent.add(mesh);
@@ -1739,8 +1789,8 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
             },
         });
         rebuildTree();
-        setStatusText(`Generated LOD for ${mesh.name} (4 levels)`);
-    }, [selectedNode, pushUndo, rebuildTree]);
+        setStatusText(t('useModelEditor.generatedLodFor4Levels', 'Generated LOD for {name} (4 levels)').replace('{name}', String(mesh.name)));
+    }, [selectedNode, pushUndo, rebuildTree, t]);
     /* ─────────────────────────────────────────
        Instancing
        ───────────────────────────────────────── */
@@ -1748,12 +1798,14 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         const root = rootObjectRef.current || sceneRef.current;
         const result = modelEditorUtils.convertToInstanced(root);
         if (result.created === 0) {
-            setStatusText('No duplicate meshes found to instance');
+            setStatusText(t('useModelEditor.noDuplicateMeshesFoundTo', 'No duplicate meshes found to instance'));
             return;
         }
         rebuildTree();
-        setStatusText(`Created ${result.created} instanced meshes, removed ${result.removed} duplicates`);
-    }, [rebuildTree]);
+        setStatusText(t('useModelEditor.createdInstancedMeshesRemovedDuplicates', 'Created {created} instanced meshes, removed {removed} duplicates')
+            .replace('{created}', String(result.created))
+            .replace('{removed}', String(result.removed)));
+    }, [rebuildTree, t]);
     /* ── HDRI Environment ── */
     const applyHDRI = React.useCallback((preset) => {
         const renderer = rendererRef.current;
@@ -1771,8 +1823,8 @@ function useModelEditor({ onSaveToLibrary, onAIPoseVideo, }) {
         else {
             setFogEnabled(false);
         }
-        setStatusText(`Environment: ${preset.name}`);
-    }, []);
+        setStatusText(t('useModelEditor.environment', 'Environment: {name}').replace('{name}', String(preset.name)));
+    }, [t]);
     /* ── Snap ── */
     const snapPoint = React.useCallback((point) => {
         const root = rootObjectRef.current || sceneRef.current;