@nice2dev/ui-3d 1.2.0 → 1.2.2

package/dist/esm/model/NiceArmatureEditor.js

@@ -2,6 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { NiceTutorialButton, resolveTutorial, NiceIcon, createId } from '@nice2dev/ui';
 import { useState, useMemo, useRef, useEffect, useCallback } from 'react';
 import * as THREE from 'three';
+import { useNiceTranslation } from '../core/i18n.js';
 
 /** Built-in guided tour (EN inline + i18n keys → PL and other locales). */
 const ARMATURE_EDITOR_TOUR = [
@@ -211,6 +212,7 @@ function useArmatureEditor(skeleton, scene, onBoneSelect) {
 }
 /* ── Component ── */
 const NiceArmatureEditor = ({ skeleton, skinnedMesh: _skinnedMesh, scene, camera: _camera, onBoneSelect, onPoseChange: _onPoseChange, className = '', tutorial, }) => {
+    const { t } = useNiceTranslation();
     const { bones, selectedBoneId, selectBone, setBonePosition: _setBonePosition, setBoneRotation, addBone, removeBone, savePose, loadPose, resetPose, savedPoses, skeletonHelper: _skeletonHelper, } = useArmatureEditor(skeleton, scene, onBoneSelect);
     const [newBoneName, setNewBoneName] = useState('');
     const selectedBone = useMemo(() => bones.find((b) => b.id === selectedBoneId), [bones, selectedBoneId]);
@@ -228,13 +230,13 @@ const NiceArmatureEditor = ({ skeleton, skinnedMesh: _skinnedMesh, scene, camera
                         borderRadius: 4,
                     }, children: [jsx(NiceIcon, { name: "target", size: 14 }), " ", boneInfo.name] }), childBones.map((child) => renderBoneTree(child, depth + 1))] }, boneInfo.id));
     };
-    return (jsxs("div", { className: `nice-armature-editor ${className}`, style: { position: 'relative', display: 'flex', flexDirection: 'column', gap: 8 }, children: [jsx("span", { style: { position: 'absolute', top: 0, right: 0, zIndex: 20 }, children: jsx(NiceTutorialButton, { steps: resolveTutorial(tutorial, ARMATURE_EDITOR_TOUR) }) }), jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxs("button", { type: "button", onClick: resetPose, title: "Reset Pose", children: [jsx(NiceIcon, { name: "refresh", size: 14 }), " Reset"] }), jsxs("button", { type: "button", onClick: () => savePose(`Pose ${savedPoses.length + 1}`), title: "Save Pose", children: [jsx(NiceIcon, { name: "save", size: 14 }), " Save Pose"] })] }), jsx("div", { style: {
+    return (jsxs("div", { className: `nice-armature-editor ${className}`, style: { position: 'relative', display: 'flex', flexDirection: 'column', gap: 8 }, children: [jsx("span", { style: { position: 'absolute', top: 0, right: 0, zIndex: 20 }, children: jsx(NiceTutorialButton, { steps: resolveTutorial(tutorial, ARMATURE_EDITOR_TOUR) }) }), jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxs("button", { type: "button", onClick: resetPose, title: t('armatureEditor.resetPose', 'Reset Pose'), children: [jsx(NiceIcon, { name: "refresh", size: 14 }), " ", t('armatureEditor.reset', 'Reset')] }), jsxs("button", { type: "button", onClick: () => savePose(`Pose ${savedPoses.length + 1}`), title: t('armatureEditor.savePose', 'Save Pose'), children: [jsx(NiceIcon, { name: "save", size: 14 }), " ", t('armatureEditor.savePose', 'Save Pose')] })] }), jsx("div", { style: {
                     maxHeight: 200,
                     overflowY: 'auto',
                     border: '1px solid var(--nice-border, #e2e8f0)',
                     borderRadius: 6,
                     padding: 4,
-                }, children: rootBones.length === 0 ? (jsx("div", { style: { padding: 16, textAlign: 'center', color: 'var(--nice-text-muted, #999)' }, children: "No skeleton found" })) : (rootBones.map((b) => renderBoneTree(b))) }), selectedBoneId && (jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsx("input", { type: "text", value: newBoneName, onChange: (e) => setNewBoneName(e.target.value), placeholder: "New bone name", style: {
+                }, children: rootBones.length === 0 ? (jsx("div", { style: { padding: 16, textAlign: 'center', color: 'var(--nice-text-muted, #999)' }, children: t('armatureEditor.noSkeletonFound', 'No skeleton found') })) : (rootBones.map((b) => renderBoneTree(b))) }), selectedBoneId && (jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsx("input", { type: "text", value: newBoneName, onChange: (e) => setNewBoneName(e.target.value), placeholder: t('armatureEditor.newBoneName', 'New bone name'), style: {
                             flex: 1,
                             padding: '4px 8px',
                             borderRadius: 4,
@@ -242,26 +244,26 @@ const NiceArmatureEditor = ({ skeleton, skinnedMesh: _skinnedMesh, scene, camera
                         } }), jsx("button", { type: "button", disabled: !newBoneName.trim(), onClick: () => {
                             addBone(selectedBoneId, newBoneName.trim());
                             setNewBoneName('');
-                        }, children: "+ Add" }), jsx("button", { type: "button", onClick: () => removeBone(selectedBoneId), "aria-label": "Remove bone", children: jsx(NiceIcon, { name: "trash", size: 14 }) })] })), selectedBone && (jsxs("div", { style: {
+                        }, children: t('armatureEditor.add', '+ Add') }), jsx("button", { type: "button", onClick: () => removeBone(selectedBoneId), "aria-label": t('armatureEditor.removeBone', 'Remove bone'), children: jsx(NiceIcon, { name: "trash", size: 14 }) })] })), selectedBone && (jsxs("div", { style: {
                     display: 'grid',
                     gap: 4,
                     fontSize: 12,
                     border: '1px solid var(--nice-border, #e2e8f0)',
                     borderRadius: 6,
                     padding: 8,
-                }, children: [jsx("strong", { children: selectedBone.name }), jsxs("label", { children: ["Rotation X: ", (selectedBone.localRotation.x * (180 / Math.PI)).toFixed(1), "\u00B0"] }), jsx("input", { type: "range", min: -180, max: 180, value: selectedBone.localRotation.x * (180 / Math.PI), onChange: (e) => {
+                }, children: [jsx("strong", { children: selectedBone.name }), jsx("label", { children: t('armatureEditor.rotationX', 'Rotation X: {x}°').replace('{x}', String((selectedBone.localRotation.x * (180 / Math.PI)).toFixed(1))) }), jsx("input", { type: "range", min: -180, max: 180, value: selectedBone.localRotation.x * (180 / Math.PI), onChange: (e) => {
                             const rot = selectedBone.localRotation.clone();
                             rot.x = parseFloat(e.target.value) * (Math.PI / 180);
                             setBoneRotation(selectedBone.id, rot);
-                        } }), jsxs("label", { children: ["Rotation Y: ", (selectedBone.localRotation.y * (180 / Math.PI)).toFixed(1), "\u00B0"] }), jsx("input", { type: "range", min: -180, max: 180, value: selectedBone.localRotation.y * (180 / Math.PI), onChange: (e) => {
+                        } }), jsx("label", { children: t('armatureEditor.rotationY', 'Rotation Y: {y}°').replace('{y}', String((selectedBone.localRotation.y * (180 / Math.PI)).toFixed(1))) }), jsx("input", { type: "range", min: -180, max: 180, value: selectedBone.localRotation.y * (180 / Math.PI), onChange: (e) => {
                             const rot = selectedBone.localRotation.clone();
                             rot.y = parseFloat(e.target.value) * (Math.PI / 180);
                             setBoneRotation(selectedBone.id, rot);
-                        } }), jsxs("label", { children: ["Rotation Z: ", (selectedBone.localRotation.z * (180 / Math.PI)).toFixed(1), "\u00B0"] }), jsx("input", { type: "range", min: -180, max: 180, value: selectedBone.localRotation.z * (180 / Math.PI), onChange: (e) => {
+                        } }), jsx("label", { children: t('armatureEditor.rotationZ', 'Rotation Z: {z}°').replace('{z}', String((selectedBone.localRotation.z * (180 / Math.PI)).toFixed(1))) }), jsx("input", { type: "range", min: -180, max: 180, value: selectedBone.localRotation.z * (180 / Math.PI), onChange: (e) => {
                             const rot = selectedBone.localRotation.clone();
                             rot.z = parseFloat(e.target.value) * (Math.PI / 180);
                             setBoneRotation(selectedBone.id, rot);
-                        } })] })), savedPoses.length > 0 && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsx("strong", { style: { fontSize: 12 }, children: "Saved Poses" }), savedPoses.map((pose) => (jsx("button", { type: "button", onClick: () => loadPose(pose), style: { textAlign: 'left', padding: '4px 8px', fontSize: 12 }, children: pose.name }, pose.id)))] }))] }));
+                        } })] })), savedPoses.length > 0 && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsx("strong", { style: { fontSize: 12 }, children: t('armatureEditor.savedPoses', 'Saved Poses') }), savedPoses.map((pose) => (jsx("button", { type: "button", onClick: () => loadPose(pose), style: { textAlign: 'left', padding: '4px 8px', fontSize: 12 }, children: pose.name }, pose.id)))] }))] }));
 };
 
 export { NiceArmatureEditor, useArmatureEditor };

package/dist/esm/model/NiceMorphTargetEditor.js

@@ -2,6 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { NiceTutorialButton, resolveTutorial, NiceIcon } from '@nice2dev/ui';
 import { useState, useRef, useEffect, useCallback } from 'react';
 import * as THREE from 'three';
+import { useNiceTranslation } from '../core/i18n.js';
 
 /** Built-in guided tour (EN inline + i18n keys → PL and other locales). */
 const MORPH_TARGET_EDITOR_TOUR = [
@@ -190,6 +191,7 @@ function useMorphTargetEditor(mesh, onInfluenceChange) {
 }
 /* ── Component ── */
 const NiceMorphTargetEditor = ({ mesh, onInfluenceChange, className = '', tutorial, }) => {
+    const { t } = useNiceTranslation();
     const { targets, setInfluence, createMorphTarget, deleteMorphTarget, resetAllInfluences, isAnimating, startAnimation, stopAnimation, animations, addAnimation: _addAnimation, removeAnimation, } = useMorphTargetEditor(mesh, onInfluenceChange);
     const [newName, setNewName] = useState('');
     const handleCreate = () => {
@@ -200,17 +202,19 @@ const NiceMorphTargetEditor = ({ mesh, onInfluenceChange, className = '', tutori
         createMorphTarget(name);
         setNewName('');
     };
-    return (jsxs("div", { className: `nice-morph-target-editor ${className}`, style: { position: 'relative', display: 'grid', gap: 8, fontSize: 13 }, children: [jsx("span", { style: { position: 'absolute', top: 0, right: 0, zIndex: 20 }, children: jsx(NiceTutorialButton, { steps: resolveTutorial(tutorial, MORPH_TARGET_EDITOR_TOUR) }) }), jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center' }, children: [jsx("strong", { children: "Morph Targets" }), jsx("button", { type: "button", onClick: resetAllInfluences, style: { fontSize: 11 }, children: "Reset All" })] }), targets.length === 0 && (jsx("div", { style: { opacity: 0.6, fontStyle: 'italic' }, children: "No morph targets found." })), targets.map((target) => (jsxs("div", { style: {
+    return (jsxs("div", { className: `nice-morph-target-editor ${className}`, style: { position: 'relative', display: 'grid', gap: 8, fontSize: 13 }, children: [jsx("span", { style: { position: 'absolute', top: 0, right: 0, zIndex: 20 }, children: jsx(NiceTutorialButton, { steps: resolveTutorial(tutorial, MORPH_TARGET_EDITOR_TOUR) }) }), jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center' }, children: [jsx("strong", { children: t('morphTargetEditor.morphTargets', 'Morph Targets') }), jsx("button", { type: "button", onClick: resetAllInfluences, style: { fontSize: 11 }, children: t('morphTargetEditor.resetAll', 'Reset All') })] }), targets.length === 0 && (jsx("div", { style: { opacity: 0.6, fontStyle: 'italic' }, children: t('morphTargetEditor.noMorphTargetsFound', 'No morph targets found.') })), targets.map((target) => (jsxs("div", { style: {
                     display: 'grid',
                     gridTemplateColumns: '1fr 50px auto',
                     alignItems: 'center',
                     gap: 6,
-                }, children: [jsxs("div", { children: [jsx("label", { style: { display: 'block', fontSize: 11, marginBottom: 2 }, children: target.name }), jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: target.influence, onChange: (e) => setInfluence(target.index, parseFloat(e.target.value)), style: { width: '100%' } })] }), jsx("span", { style: { fontSize: 11, textAlign: 'right' }, children: target.influence.toFixed(2) }), jsx("button", { type: "button", onClick: () => deleteMorphTarget(target.index), title: "Delete", "aria-label": "Delete", style: { background: 'none', border: 'none', cursor: 'pointer' }, children: jsx(NiceIcon, { name: "trash", size: 14 }) })] }, target.index))), jsxs("div", { style: { display: 'flex', gap: 4, marginTop: 4 }, children: [jsx("input", { type: "text", value: newName, onChange: (e) => setNewName(e.target.value), placeholder: "New morph target name\u2026", onKeyDown: (e) => e.key === 'Enter' && handleCreate(), style: {
+                }, children: [jsxs("div", { children: [jsx("label", { style: { display: 'block', fontSize: 11, marginBottom: 2 }, children: target.name }), jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: target.influence, onChange: (e) => setInfluence(target.index, parseFloat(e.target.value)), style: { width: '100%' } })] }), jsx("span", { style: { fontSize: 11, textAlign: 'right' }, children: target.influence.toFixed(2) }), jsx("button", { type: "button", onClick: () => deleteMorphTarget(target.index), title: t('morphTargetEditor.delete', 'Delete'), "aria-label": t('morphTargetEditor.delete', 'Delete'), style: { background: 'none', border: 'none', cursor: 'pointer' }, children: jsx(NiceIcon, { name: "trash", size: 14 }) })] }, target.index))), jsxs("div", { style: { display: 'flex', gap: 4, marginTop: 4 }, children: [jsx("input", { type: "text", value: newName, onChange: (e) => setNewName(e.target.value), placeholder: t('morphTargetEditor.newMorphTargetName', 'New morph target name…'), onKeyDown: (e) => e.key === 'Enter' && handleCreate(), style: {
                             flex: 1,
                             padding: '4px 8px',
                             border: '1px solid var(--nice-border, #e2e8f0)',
                             borderRadius: 4,
-                        } }), jsx("button", { type: "button", onClick: handleCreate, children: "+ Add" })] }), animations.length > 0 && (jsxs("div", { style: { marginTop: 8 }, children: [jsx("strong", { style: { fontSize: 12 }, children: "Animations" }), animations.map((anim) => (jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 4, marginTop: 4 }, children: [jsx("span", { style: { flex: 1 }, children: anim.name }), jsx("button", { type: "button", onClick: () => (isAnimating ? stopAnimation() : startAnimation(anim)), style: { fontSize: 11 }, "aria-label": isAnimating ? 'Stop' : 'Play', children: jsx(NiceIcon, { name: isAnimating ? 'stop' : 'play', size: 14 }) }), jsx("button", { type: "button", onClick: () => removeAnimation(anim.name), style: { fontSize: 11 }, "aria-label": "Remove animation", children: jsx(NiceIcon, { name: "trash", size: 14 }) })] }, anim.name)))] }))] }));
+                        } }), jsx("button", { type: "button", onClick: handleCreate, children: t('morphTargetEditor.add', '+ Add') })] }), animations.length > 0 && (jsxs("div", { style: { marginTop: 8 }, children: [jsx("strong", { style: { fontSize: 12 }, children: t('morphTargetEditor.animations', 'Animations') }), animations.map((anim) => (jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: 4, marginTop: 4 }, children: [jsx("span", { style: { flex: 1 }, children: anim.name }), jsx("button", { type: "button", onClick: () => (isAnimating ? stopAnimation() : startAnimation(anim)), style: { fontSize: 11 }, "aria-label": isAnimating
+                                    ? t('morphTargetEditor.stop', 'Stop')
+                                    : t('morphTargetEditor.play', 'Play'), children: jsx(NiceIcon, { name: isAnimating ? 'stop' : 'play', size: 14 }) }), jsx("button", { type: "button", onClick: () => removeAnimation(anim.name), style: { fontSize: 11 }, "aria-label": t('morphTargetEditor.removeAnimation', 'Remove animation'), children: jsx(NiceIcon, { name: "trash", size: 14 }) })] }, anim.name)))] }))] }));
 };
 
 export { NiceMorphTargetEditor, useMorphTargetEditor };

package/dist/esm/model/NiceOctree.js

@@ -2,6 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { NiceIcon } from '@nice2dev/ui';
 import { useEffect, useMemo, useState, useRef, useCallback } from 'react';
 import * as THREE from 'three';
+import { useNiceTranslation } from '../core/i18n.js';
 
 /* ── Octree implementation ── */
 const DEFAULT_CONFIG = {
@@ -324,20 +325,24 @@ function useOctree(scene, configOverride) {
 }
 /* ── Component ── */
 const NiceOctree = ({ scene, config, showDebug: initialShowDebug, className = '', }) => {
+    const { t } = useNiceTranslation();
     const octree = useOctree(scene, config);
+    const { setShowDebug } = octree;
     useEffect(() => {
         if (initialShowDebug !== undefined) {
-            octree.setShowDebug(initialShowDebug);
+            setShowDebug(initialShowDebug);
         }
-    }, [initialShowDebug]);
-    return (jsxs("div", { className: `nice-octree ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxs("strong", { children: [jsx(NiceIcon, { name: "tree", size: 14 }), " Spatial Index (Octree)"] }), jsxs("button", { type: "button", onClick: octree.build, style: {
+    }, [initialShowDebug, setShowDebug]);
+    return (jsxs("div", { className: `nice-octree ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxs("strong", { children: [jsx(NiceIcon, { name: "tree", size: 14 }), ' ', t('octree.spatialIndexOctree', 'Spatial Index (Octree)')] }), jsxs("button", { type: "button", onClick: octree.build, style: {
                     background: 'var(--nice-color-accent, #6366f1)',
                     color: 'var(--nice-text-on-primary, #fff)',
                     border: 'none',
                     borderRadius: 4,
                     padding: '6px 12px',
                     cursor: 'pointer',
-                }, children: [jsx(NiceIcon, { name: "zap", size: 14 }), " Build Octree"] }), jsxs("div", { style: { fontSize: 11, opacity: 0.7 }, children: ["Nodes: ", octree.nodeCount, " | Objects: ", octree.objectCount] }), jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "checkbox", checked: octree.showDebug, onChange: (e) => octree.setShowDebug(e.target.checked) }), "Show debug wireframes"] })] }));
+                }, children: [jsx(NiceIcon, { name: "zap", size: 14 }), " ", t('octree.buildOctree', 'Build Octree')] }), jsx("div", { style: { fontSize: 11, opacity: 0.7 }, children: t('octree.nodesObjects', 'Nodes: {nodeCount} · Objects: {objectCount}')
+                    .replace('{nodeCount}', String(octree.nodeCount))
+                    .replace('{objectCount}', String(octree.objectCount)) }), jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "checkbox", checked: octree.showDebug, onChange: (e) => octree.setShowDebug(e.target.checked) }), t('octree.showDebugWireframes', 'Show debug wireframes')] })] }));
 };
 
 export { NiceOctree, useOctree };

package/dist/esm/model/NicePhysicsSimulation.js

@@ -2,6 +2,7 @@ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { NiceIcon } from '@nice2dev/ui';
 import { useState, useRef, useEffect, useCallback } from 'react';
 import * as THREE from 'three';
+import { useNiceTranslation } from '../core/i18n.js';
 
 function inferColliderShape(object) {
     if (object instanceof THREE.Mesh) {
@@ -261,11 +262,12 @@ function usePhysicsSimulation(scene, onSimulationStep) {
 }
 /* ── Component ── */
 const NicePhysicsSimulation = ({ scene, selectedObject, onSimulationStep, className = '', }) => {
+    const { t } = useNiceTranslation();
     const { worldConfig, setWorldConfig, bodies, addBody, removeBody, updateBody, getBodyForObject, isRunning, play, pause, step, reset, debugDraw, setDebugDraw, } = usePhysicsSimulation(scene, onSimulationStep);
     const selectedBody = selectedObject
         ? getBodyForObject(selectedObject.name || selectedObject.uuid)
         : undefined;
-    return (jsxs("div", { className: `nice-physics-simulation ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center' }, children: [jsxs("strong", { children: [jsx(NiceIcon, { name: "zap", size: 14 }), " Physics"] }), jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 4, fontSize: 11 }, children: [jsx("input", { type: "checkbox", checked: debugDraw, onChange: (e) => setDebugDraw(e.target.checked) }), "Debug"] })] }), jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsx("button", { type: "button", onClick: isRunning ? pause : play, style: {
+    return (jsxs("div", { className: `nice-physics-simulation ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center' }, children: [jsxs("strong", { children: [jsx(NiceIcon, { name: "zap", size: 14 }), " ", t('physicsSimulation.physics', 'Physics')] }), jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 4, fontSize: 11 }, children: [jsx("input", { type: "checkbox", checked: debugDraw, onChange: (e) => setDebugDraw(e.target.checked) }), t('physicsSimulation.debug', 'Debug')] })] }), jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsx("button", { type: "button", onClick: isRunning ? pause : play, style: {
                             flex: 1,
                             background: isRunning ? 'var(--nice-danger, #ef4444)' : 'var(--nice-success, #22c55e)',
                             color: 'var(--nice-color-white, #fff)',
@@ -273,20 +275,20 @@ const NicePhysicsSimulation = ({ scene, selectedObject, onSimulationStep, classN
                             borderRadius: 4,
                             padding: '5px 8px',
                             cursor: 'pointer',
-                        }, children: isRunning ? (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "pause", size: 14 }), " Pause"] })) : (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "play", size: 14 }), " Play"] })) }), jsxs("button", { type: "button", onClick: step, disabled: isRunning, style: { padding: '5px 8px', cursor: 'pointer' }, children: [jsx(NiceIcon, { name: "skip-forward", size: 14 }), " Step"] }), jsxs("button", { type: "button", onClick: reset, style: { padding: '5px 8px', cursor: 'pointer' }, children: [jsx(NiceIcon, { name: "refresh", size: 14 }), " Reset"] })] }), jsxs("label", { children: ["Gravity Y: ", worldConfig.gravity.y.toFixed(1), jsx("input", { type: "range", min: -20, max: 0, step: 0.1, value: worldConfig.gravity.y, onChange: (e) => setWorldConfig({ gravity: new THREE.Vector3(0, parseFloat(e.target.value), 0) }), style: { width: '100%' } })] }), selectedObject && (jsxs("fieldset", { style: {
+                        }, children: isRunning ? (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "pause", size: 14 }), " ", t('physicsSimulation.pause', 'Pause')] })) : (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "play", size: 14 }), " ", t('physicsSimulation.play', 'Play')] })) }), jsxs("button", { type: "button", onClick: step, disabled: isRunning, style: { padding: '5px 8px', cursor: 'pointer' }, children: [jsx(NiceIcon, { name: "skip-forward", size: 14 }), " ", t('physicsSimulation.step', 'Step')] }), jsxs("button", { type: "button", onClick: reset, style: { padding: '5px 8px', cursor: 'pointer' }, children: [jsx(NiceIcon, { name: "refresh", size: 14 }), " ", t('physicsSimulation.reset', 'Reset')] })] }), jsxs("label", { children: [t('physicsSimulation.gravityY', 'Gravity Y: {y}').replace('{y}', String(worldConfig.gravity.y.toFixed(1))), jsx("input", { type: "range", min: -20, max: 0, step: 0.1, value: worldConfig.gravity.y, onChange: (e) => setWorldConfig({ gravity: new THREE.Vector3(0, parseFloat(e.target.value), 0) }), style: { width: '100%' } })] }), selectedObject && (jsxs("fieldset", { style: {
                     border: '1px solid var(--nice-border, #e2e8f0)',
                     borderRadius: 6,
                     padding: 6,
                     display: 'grid',
                     gap: 4,
-                }, children: [jsxs("legend", { style: { fontSize: 11 }, children: [selectedObject.name || 'Object', " \u2014 Physics"] }), !selectedBody ? (jsx("button", { type: "button", onClick: () => addBody(selectedObject), style: {
+                }, children: [jsx("legend", { style: { fontSize: 11 }, children: t('physicsSimulation.objectPhysics', '{name} — Physics').replace('{name}', selectedObject.name || t('physicsSimulation.object', 'Object')) }), !selectedBody ? (jsx("button", { type: "button", onClick: () => addBody(selectedObject), style: {
                             background: 'var(--nice-color-accent, #6366f1)',
                             color: 'var(--nice-text-on-primary, #fff)',
                             border: 'none',
                             borderRadius: 4,
                             padding: '5px 8px',
                             cursor: 'pointer',
-                        }, children: "+ Add Rigid Body" })) : (jsxs(Fragment, { children: [jsxs("label", { children: ["Type:", jsxs("select", { value: selectedBody.bodyType, onChange: (e) => updateBody(selectedBody.id, { bodyType: e.target.value }), style: { marginLeft: 8, width: '100%' }, children: [jsx("option", { value: "dynamic", children: "Dynamic" }), jsx("option", { value: "static", children: "Static" }), jsx("option", { value: "kinematic", children: "Kinematic" })] })] }), jsxs("label", { children: ["Shape:", jsxs("select", { value: selectedBody.colliderShape, onChange: (e) => updateBody(selectedBody.id, { colliderShape: e.target.value }), style: { marginLeft: 8, width: '100%' }, children: [jsx("option", { value: "box", children: "Box" }), jsx("option", { value: "sphere", children: "Sphere" }), jsx("option", { value: "capsule", children: "Capsule" }), jsx("option", { value: "convexHull", children: "Convex Hull" }), jsx("option", { value: "trimesh", children: "Trimesh" })] })] }), jsxs("label", { children: ["Mass: ", selectedBody.mass.toFixed(1), jsx("input", { type: "range", min: 0.1, max: 100, step: 0.1, value: selectedBody.mass, onChange: (e) => updateBody(selectedBody.id, { mass: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Restitution: ", selectedBody.restitution.toFixed(2), jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: selectedBody.restitution, onChange: (e) => updateBody(selectedBody.id, { restitution: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Friction: ", selectedBody.friction.toFixed(2), jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: selectedBody.friction, onChange: (e) => updateBody(selectedBody.id, { friction: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "checkbox", checked: selectedBody.isSensor, onChange: (e) => updateBody(selectedBody.id, { isSensor: e.target.checked }) }), "Sensor (trigger only)"] }), jsx("button", { type: "button", onClick: () => removeBody(selectedBody.id), style: {
+                        }, children: t('physicsSimulation.addRigidBody', '+ Add Rigid Body') })) : (jsxs(Fragment, { children: [jsxs("label", { children: [t('physicsSimulation.type', 'Type:'), jsxs("select", { value: selectedBody.bodyType, onChange: (e) => updateBody(selectedBody.id, { bodyType: e.target.value }), style: { marginLeft: 8, width: '100%' }, children: [jsx("option", { value: "dynamic", children: t('physicsSimulation.dynamic', 'Dynamic') }), jsx("option", { value: "static", children: t('physicsSimulation.static', 'Static') }), jsx("option", { value: "kinematic", children: t('physicsSimulation.kinematic', 'Kinematic') })] })] }), jsxs("label", { children: [t('physicsSimulation.shape', 'Shape:'), jsxs("select", { value: selectedBody.colliderShape, onChange: (e) => updateBody(selectedBody.id, { colliderShape: e.target.value }), style: { marginLeft: 8, width: '100%' }, children: [jsx("option", { value: "box", children: t('physicsSimulation.box', 'Box') }), jsx("option", { value: "sphere", children: t('physicsSimulation.sphere', 'Sphere') }), jsx("option", { value: "capsule", children: t('physicsSimulation.capsule', 'Capsule') }), jsx("option", { value: "convexHull", children: t('physicsSimulation.convexHull', 'Convex Hull') }), jsx("option", { value: "trimesh", children: t('physicsSimulation.trimesh', 'Trimesh') })] })] }), jsxs("label", { children: [t('physicsSimulation.mass', 'Mass: {mass}').replace('{mass}', String(selectedBody.mass.toFixed(1))), jsx("input", { type: "range", min: 0.1, max: 100, step: 0.1, value: selectedBody.mass, onChange: (e) => updateBody(selectedBody.id, { mass: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('physicsSimulation.restitution', 'Restitution: {restitution}').replace('{restitution}', String(selectedBody.restitution.toFixed(2))), jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: selectedBody.restitution, onChange: (e) => updateBody(selectedBody.id, { restitution: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('physicsSimulation.friction', 'Friction: {friction}').replace('{friction}', String(selectedBody.friction.toFixed(2))), jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: selectedBody.friction, onChange: (e) => updateBody(selectedBody.id, { friction: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "checkbox", checked: selectedBody.isSensor, onChange: (e) => updateBody(selectedBody.id, { isSensor: e.target.checked }) }), t('physicsSimulation.sensorTriggerOnly', 'Sensor (trigger only)')] }), jsx("button", { type: "button", onClick: () => removeBody(selectedBody.id), style: {
                                     background: 'var(--nice-danger, #ef4444)',
                                     color: 'var(--nice-text-on-primary, #fff)',
                                     border: 'none',
@@ -294,7 +296,7 @@ const NicePhysicsSimulation = ({ scene, selectedObject, onSimulationStep, classN
                                     padding: '4px 8px',
                                     cursor: 'pointer',
                                     fontSize: 11,
-                                }, children: "Remove Rigid Body" })] }))] })), jsxs("div", { style: { fontSize: 11, opacity: 0.7 }, children: ["Total bodies: ", bodies.length] })] }));
+                                }, children: t('physicsSimulation.removeRigidBody', 'Remove Rigid Body') })] }))] })), jsx("div", { style: { fontSize: 11, opacity: 0.7 }, children: t('physicsSimulation.totalBodies', 'Total bodies: {bodies}').replace('{bodies}', String(bodies.length)) })] }));
 };
 
 export { NicePhysicsSimulation, usePhysicsSimulation };

package/dist/esm/model/NiceProceduralGeometry.js

@@ -2,6 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { NiceIcon } from '@nice2dev/ui';
 import { useState, useCallback } from 'react';
 import * as THREE from 'three';
+import { useNiceTranslation } from '../core/i18n.js';
 
 /* ── Generators ── */
 function seededRng(seed) {
@@ -292,21 +293,22 @@ function useProceduralGeometry(scene, onGenerated) {
 }
 /* ── Component ── */
 const NiceProceduralGeometry = ({ scene, onGenerated, className = '', }) => {
+    const { t } = useNiceTranslation();
     const { type, setType, treeParams, setTreeParams, rockParams, setRockParams, buildingParams, setBuildingParams, gearParams, setGearParams, generate, } = useProceduralGeometry(scene, onGenerated);
-    return (jsxs("div", { className: `nice-procedural-geometry ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsx("strong", { children: "Procedural Geometry" }), jsxs("select", { value: type, onChange: (e) => setType(e.target.value), style: { width: '100%', padding: '4px 8px' }, children: [jsx("option", { value: "tree", children: "Tree" }), jsx("option", { value: "rock", children: "Rock" }), jsx("option", { value: "building", children: "Building" }), jsx("option", { value: "pipe", children: "Pipe" }), jsx("option", { value: "gear", children: "Gear" })] }), type === 'tree' && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsxs("label", { children: ["Height: ", treeParams.trunkHeight.toFixed(1), jsx("input", { type: "range", min: 1, max: 15, step: 0.5, value: treeParams.trunkHeight, onChange: (e) => setTreeParams({ ...treeParams, trunkHeight: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Branches: ", treeParams.branches, jsx("input", { type: "range", min: 1, max: 6, value: treeParams.branches, onChange: (e) => setTreeParams({ ...treeParams, branches: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Depth: ", treeParams.depth, jsx("input", { type: "range", min: 1, max: 5, value: treeParams.depth, onChange: (e) => setTreeParams({ ...treeParams, depth: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Angle: ", treeParams.branchAngle, "\u00B0", jsx("input", { type: "range", min: 10, max: 80, value: treeParams.branchAngle, onChange: (e) => setTreeParams({ ...treeParams, branchAngle: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Seed: ", treeParams.seed, jsx("input", { type: "range", min: 1, max: 999, value: treeParams.seed, onChange: (e) => setTreeParams({ ...treeParams, seed: parseInt(e.target.value, 10) }), style: { width: '100%' } })] })] })), type === 'rock' && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsxs("label", { children: ["Radius: ", rockParams.radius.toFixed(1), jsx("input", { type: "range", min: 0.2, max: 5, step: 0.1, value: rockParams.radius, onChange: (e) => setRockParams({ ...rockParams, radius: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Detail: ", rockParams.detail, jsx("input", { type: "range", min: 1, max: 5, value: rockParams.detail, onChange: (e) => setRockParams({ ...rockParams, detail: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Noise: ", rockParams.noiseAmount.toFixed(2), jsx("input", { type: "range", min: 0, max: 0.5, step: 0.01, value: rockParams.noiseAmount, onChange: (e) => setRockParams({ ...rockParams, noiseAmount: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Seed: ", rockParams.seed, jsx("input", { type: "range", min: 1, max: 999, value: rockParams.seed, onChange: (e) => setRockParams({ ...rockParams, seed: parseInt(e.target.value, 10) }), style: { width: '100%' } })] })] })), type === 'building' && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsxs("label", { children: ["Width: ", buildingParams.width, jsx("input", { type: "range", min: 4, max: 20, step: 1, value: buildingParams.width, onChange: (e) => setBuildingParams({ ...buildingParams, width: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Floors: ", buildingParams.floors, jsx("input", { type: "range", min: 1, max: 20, value: buildingParams.floors, onChange: (e) => setBuildingParams({ ...buildingParams, floors: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Windows/Floor: ", buildingParams.windowsPerFloor, jsx("input", { type: "range", min: 1, max: 10, value: buildingParams.windowsPerFloor, onChange: (e) => setBuildingParams({
+    return (jsxs("div", { className: `nice-procedural-geometry ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsx("strong", { children: t('proceduralGeometry.proceduralGeometry', 'Procedural Geometry') }), jsxs("select", { value: type, onChange: (e) => setType(e.target.value), style: { width: '100%', padding: '4px 8px' }, children: [jsx("option", { value: "tree", children: t('proceduralGeometry.tree', 'Tree') }), jsx("option", { value: "rock", children: t('proceduralGeometry.rock', 'Rock') }), jsx("option", { value: "building", children: t('proceduralGeometry.building', 'Building') }), jsx("option", { value: "pipe", children: t('proceduralGeometry.pipe', 'Pipe') }), jsx("option", { value: "gear", children: t('proceduralGeometry.gear', 'Gear') })] }), type === 'tree' && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsxs("label", { children: [t('proceduralGeometry.height', 'Height: {trunkHeight}').replace('{trunkHeight}', String(treeParams.trunkHeight.toFixed(1))), jsx("input", { type: "range", min: 1, max: 15, step: 0.5, value: treeParams.trunkHeight, onChange: (e) => setTreeParams({ ...treeParams, trunkHeight: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.branches', 'Branches: {branches}').replace('{branches}', String(treeParams.branches)), jsx("input", { type: "range", min: 1, max: 6, value: treeParams.branches, onChange: (e) => setTreeParams({ ...treeParams, branches: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.depth', 'Depth: {depth}').replace('{depth}', String(treeParams.depth)), jsx("input", { type: "range", min: 1, max: 5, value: treeParams.depth, onChange: (e) => setTreeParams({ ...treeParams, depth: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.angle', 'Angle: {branchAngle}°').replace('{branchAngle}', String(treeParams.branchAngle)), jsx("input", { type: "range", min: 10, max: 80, value: treeParams.branchAngle, onChange: (e) => setTreeParams({ ...treeParams, branchAngle: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.seed', 'Seed: {seed}').replace('{seed}', String(treeParams.seed)), jsx("input", { type: "range", min: 1, max: 999, value: treeParams.seed, onChange: (e) => setTreeParams({ ...treeParams, seed: parseInt(e.target.value, 10) }), style: { width: '100%' } })] })] })), type === 'rock' && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsxs("label", { children: [t('proceduralGeometry.radius', 'Radius: {radius}').replace('{radius}', String(rockParams.radius.toFixed(1))), jsx("input", { type: "range", min: 0.2, max: 5, step: 0.1, value: rockParams.radius, onChange: (e) => setRockParams({ ...rockParams, radius: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.detail', 'Detail: {detail}').replace('{detail}', String(rockParams.detail)), jsx("input", { type: "range", min: 1, max: 5, value: rockParams.detail, onChange: (e) => setRockParams({ ...rockParams, detail: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.noise', 'Noise: {noiseAmount}').replace('{noiseAmount}', String(rockParams.noiseAmount.toFixed(2))), jsx("input", { type: "range", min: 0, max: 0.5, step: 0.01, value: rockParams.noiseAmount, onChange: (e) => setRockParams({ ...rockParams, noiseAmount: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.seed', 'Seed: {seed}').replace('{seed}', String(rockParams.seed)), jsx("input", { type: "range", min: 1, max: 999, value: rockParams.seed, onChange: (e) => setRockParams({ ...rockParams, seed: parseInt(e.target.value, 10) }), style: { width: '100%' } })] })] })), type === 'building' && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsxs("label", { children: [t('proceduralGeometry.width', 'Width: {width}').replace('{width}', String(buildingParams.width)), jsx("input", { type: "range", min: 4, max: 20, step: 1, value: buildingParams.width, onChange: (e) => setBuildingParams({ ...buildingParams, width: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.floors', 'Floors: {floors}').replace('{floors}', String(buildingParams.floors)), jsx("input", { type: "range", min: 1, max: 20, value: buildingParams.floors, onChange: (e) => setBuildingParams({ ...buildingParams, floors: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.windowsFloor', 'Windows/Floor: {windowsPerFloor}').replace('{windowsPerFloor}', String(buildingParams.windowsPerFloor)), jsx("input", { type: "range", min: 1, max: 10, value: buildingParams.windowsPerFloor, onChange: (e) => setBuildingParams({
                                     ...buildingParams,
                                     windowsPerFloor: parseInt(e.target.value, 10),
-                                }), style: { width: '100%' } })] }), jsxs("label", { children: ["Roof:", jsxs("select", { value: buildingParams.roofStyle, onChange: (e) => setBuildingParams({
+                                }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.roof', 'Roof:'), jsxs("select", { value: buildingParams.roofStyle, onChange: (e) => setBuildingParams({
                                     ...buildingParams,
                                     roofStyle: e.target.value,
-                                }), style: { marginLeft: 8 }, children: [jsx("option", { value: "flat", children: "Flat" }), jsx("option", { value: "gable", children: "Gable" }), jsx("option", { value: "hip", children: "Hip" })] })] })] })), type === 'gear' && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsxs("label", { children: ["Outer Radius: ", gearParams.outerRadius.toFixed(1), jsx("input", { type: "range", min: 0.5, max: 5, step: 0.1, value: gearParams.outerRadius, onChange: (e) => setGearParams({ ...gearParams, outerRadius: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Teeth: ", gearParams.teeth, jsx("input", { type: "range", min: 4, max: 30, value: gearParams.teeth, onChange: (e) => setGearParams({ ...gearParams, teeth: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Tooth Depth: ", gearParams.toothDepth.toFixed(2), jsx("input", { type: "range", min: 0.05, max: 1, step: 0.05, value: gearParams.toothDepth, onChange: (e) => setGearParams({ ...gearParams, toothDepth: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Thickness: ", gearParams.thickness.toFixed(2), jsx("input", { type: "range", min: 0.1, max: 2, step: 0.1, value: gearParams.thickness, onChange: (e) => setGearParams({ ...gearParams, thickness: parseFloat(e.target.value) }), style: { width: '100%' } })] })] })), jsxs("button", { type: "button", onClick: generate, style: {
+                                }), style: { marginLeft: 8 }, children: [jsx("option", { value: "flat", children: t('proceduralGeometry.flat', 'Flat') }), jsx("option", { value: "gable", children: t('proceduralGeometry.gable', 'Gable') }), jsx("option", { value: "hip", children: t('proceduralGeometry.hip', 'Hip') })] })] })] })), type === 'gear' && (jsxs("div", { style: { display: 'grid', gap: 4 }, children: [jsxs("label", { children: [t('proceduralGeometry.outerRadius', 'Outer Radius: {outerRadius}').replace('{outerRadius}', String(gearParams.outerRadius.toFixed(1))), jsx("input", { type: "range", min: 0.5, max: 5, step: 0.1, value: gearParams.outerRadius, onChange: (e) => setGearParams({ ...gearParams, outerRadius: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.teeth', 'Teeth: {teeth}').replace('{teeth}', String(gearParams.teeth)), jsx("input", { type: "range", min: 4, max: 30, value: gearParams.teeth, onChange: (e) => setGearParams({ ...gearParams, teeth: parseInt(e.target.value, 10) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.toothDepth', 'Tooth Depth: {toothDepth}').replace('{toothDepth}', String(gearParams.toothDepth.toFixed(2))), jsx("input", { type: "range", min: 0.05, max: 1, step: 0.05, value: gearParams.toothDepth, onChange: (e) => setGearParams({ ...gearParams, toothDepth: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('proceduralGeometry.thickness', 'Thickness: {thickness}').replace('{thickness}', String(gearParams.thickness.toFixed(2))), jsx("input", { type: "range", min: 0.1, max: 2, step: 0.1, value: gearParams.thickness, onChange: (e) => setGearParams({ ...gearParams, thickness: parseFloat(e.target.value) }), style: { width: '100%' } })] })] })), jsxs("button", { type: "button", onClick: generate, style: {
                     background: 'var(--nice-color-accent, #6366f1)',
                     color: 'var(--nice-text-on-primary, #fff)',
                     border: 'none',
                     borderRadius: 4,
                     padding: '6px 12px',
                     cursor: 'pointer',
-                }, children: [jsx(NiceIcon, { name: "wand", size: 14 }), " Generate"] })] }));
+                }, children: [jsx(NiceIcon, { name: "wand", size: 14 }), " ", t('proceduralGeometry.generate', 'Generate')] })] }));
 };
 
 export { NiceProceduralGeometry, generateBuilding, generateGear, generatePipe, generateRock, generateTree, useProceduralGeometry };

package/dist/esm/model/NiceTerrainEditor.js

@@ -2,6 +2,7 @@ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { NiceTutorialButton, resolveTutorial, NiceIcon } from '@nice2dev/ui';
 import { useState, useRef, useEffect, useCallback } from 'react';
 import * as THREE from 'three';
+import { useNiceTranslation } from '../core/i18n.js';
 
 /** Built-in guided tour (EN inline + i18n keys → PL and other locales). */
 const TERRAIN_EDITOR_TOUR = [
@@ -319,6 +320,7 @@ function useTerrainEditor(scene, camera, canvas, config = { width: 100, depth: 1
 }
 /* ── Component ── */
 const NiceTerrainEditor = ({ scene, camera, canvas, config: configProp, onTerrainChange, className = '', tutorial, }) => {
+    const { t } = useNiceTranslation();
     const config = {
         width: 100,
         depth: 100,
@@ -329,14 +331,14 @@ const NiceTerrainEditor = ({ scene, camera, canvas, config: configProp, onTerrai
     const { brush, setBrush, isPainting, startPainting, stopPainting, generateFlat, generateNoise, exportHeightmap, textureLayers, setTextureLayer, activeTextureLayer, setActiveTextureLayer, } = useTerrainEditor(scene, camera, canvas, config, onTerrainChange);
     const [noiseOctaves, setNoiseOctaves] = useState(6);
     const [noisePersistence, setNoisePersistence] = useState(0.5);
-    return (jsxs("div", { className: `nice-terrain-editor ${className}`, style: { position: 'relative', display: 'grid', gap: 8, fontSize: 13 }, children: [jsx("span", { style: { position: 'absolute', top: 0, right: 0, zIndex: 20 }, children: jsx(NiceTutorialButton, { steps: resolveTutorial(tutorial, TERRAIN_EDITOR_TOUR) }) }), jsx("strong", { children: "Terrain Editor" }), jsxs("fieldset", { style: {
+    return (jsxs("div", { className: `nice-terrain-editor ${className}`, style: { position: 'relative', display: 'grid', gap: 8, fontSize: 13 }, children: [jsx("span", { style: { position: 'absolute', top: 0, right: 0, zIndex: 20 }, children: jsx(NiceTutorialButton, { steps: resolveTutorial(tutorial, TERRAIN_EDITOR_TOUR) }) }), jsx("strong", { children: t('terrainEditor.terrainEditor', 'Terrain Editor') }), jsxs("fieldset", { style: {
                     border: '1px solid var(--nice-border, #e2e8f0)',
                     borderRadius: 6,
                     padding: 4,
                     display: 'flex',
                     flexWrap: 'wrap',
                     gap: 2,
-                }, children: [jsx("legend", { style: { fontSize: 11 }, children: "Brush" }), ['raise', 'lower', 'flatten', 'smooth', 'noise', 'paint'].map((m) => (jsx("button", { type: "button", onClick: () => setBrush({ mode: m }), style: {
+                }, children: [jsx("legend", { style: { fontSize: 11 }, children: t('terrainEditor.brush', 'Brush') }), ['raise', 'lower', 'flatten', 'smooth', 'noise', 'paint'].map((m) => (jsx("button", { type: "button", onClick: () => setBrush({ mode: m }), style: {
                             padding: '3px 6px',
                             fontSize: 11,
                             cursor: 'pointer',
@@ -344,7 +346,7 @@ const NiceTerrainEditor = ({ scene, camera, canvas, config: configProp, onTerrai
                             border: '1px solid var(--nice-border, #e2e8f0)',
                             background: brush.mode === m ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
                             color: brush.mode === m ? 'var(--nice-color-white, #fff)' : 'inherit',
-                        }, children: m }, m)))] }), jsxs("label", { children: ["Radius: ", brush.radius.toFixed(1), jsx("input", { type: "range", min: 0.5, max: 20, step: 0.5, value: brush.radius, onChange: (e) => setBrush({ radius: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: ["Strength: ", brush.strength.toFixed(2), 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%' } })] }), jsx("button", { type: "button", onClick: isPainting ? stopPainting : startPainting, style: {
+                        }, children: m }, m)))] }), jsxs("label", { children: [t('terrainEditor.radius', 'Radius: {radius}').replace('{radius}', String(brush.radius.toFixed(1))), jsx("input", { type: "range", min: 0.5, max: 20, step: 0.5, value: brush.radius, onChange: (e) => setBrush({ radius: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxs("label", { children: [t('terrainEditor.strength', 'Strength: {strength}').replace('{strength}', String(brush.strength.toFixed(2))), 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%' } })] }), jsx("button", { type: "button", onClick: isPainting ? stopPainting : startPainting, style: {
                     background: isPainting
                         ? 'var(--nice-danger, #ef4444)'
                         : 'var(--nice-color-accent, #6366f1)',
@@ -353,19 +355,19 @@ const NiceTerrainEditor = ({ scene, camera, canvas, config: configProp, onTerrai
                     borderRadius: 4,
                     padding: '6px 12px',
                     cursor: 'pointer',
-                }, children: isPainting ? (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "stop", size: 14 }), " Stop Painting"] })) : (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "brush", size: 14 }), " Start Painting"] })) }), jsxs("fieldset", { style: {
+                }, children: isPainting ? (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "stop", size: 14 }), " ", t('terrainEditor.stopPainting', 'Stop Painting')] })) : (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "brush", size: 14 }), " ", t('terrainEditor.startPainting', 'Start Painting')] })) }), jsxs("fieldset", { style: {
                     border: '1px solid var(--nice-border, #e2e8f0)',
                     borderRadius: 6,
                     padding: 6,
                     display: 'grid',
                     gap: 4,
-                }, children: [jsx("legend", { style: { fontSize: 11 }, children: "Procedural" }), jsxs("label", { children: ["Octaves: ", noiseOctaves, jsx("input", { type: "range", min: 1, max: 10, value: noiseOctaves, onChange: (e) => setNoiseOctaves(parseInt(e.target.value, 10)), style: { width: '100%' } })] }), jsxs("label", { children: ["Persistence: ", noisePersistence.toFixed(2), jsx("input", { type: "range", min: 0.1, max: 1, step: 0.05, value: noisePersistence, onChange: (e) => setNoisePersistence(parseFloat(e.target.value)), style: { width: '100%' } })] }), jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxs("button", { type: "button", onClick: () => generateNoise(noiseOctaves, noisePersistence), style: { flex: 1 }, children: [jsx(NiceIcon, { name: "mountain", size: 14 }), " Generate Noise"] }), jsxs("button", { type: "button", onClick: generateFlat, style: { flex: 1 }, children: [jsx(NiceIcon, { name: "square", size: 14 }), " Flatten"] })] })] }), brush.mode === 'paint' && (jsxs("fieldset", { style: {
+                }, children: [jsx("legend", { style: { fontSize: 11 }, children: t('terrainEditor.procedural', 'Procedural') }), jsxs("label", { children: [t('terrainEditor.octaves', 'Octaves: {noiseOctaves}').replace('{noiseOctaves}', String(noiseOctaves)), jsx("input", { type: "range", min: 1, max: 10, value: noiseOctaves, onChange: (e) => setNoiseOctaves(parseInt(e.target.value, 10)), style: { width: '100%' } })] }), jsxs("label", { children: [t('terrainEditor.persistence', 'Persistence: {noisePersistence}').replace('{noisePersistence}', String(noisePersistence.toFixed(2))), jsx("input", { type: "range", min: 0.1, max: 1, step: 0.05, value: noisePersistence, onChange: (e) => setNoisePersistence(parseFloat(e.target.value)), style: { width: '100%' } })] }), jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxs("button", { type: "button", onClick: () => generateNoise(noiseOctaves, noisePersistence), style: { flex: 1 }, children: [jsx(NiceIcon, { name: "mountain", size: 14 }), ' ', t('terrainEditor.generateNoise', 'Generate Noise')] }), jsxs("button", { type: "button", onClick: generateFlat, style: { flex: 1 }, children: [jsx(NiceIcon, { name: "square", size: 14 }), " ", t('terrainEditor.flatten', 'Flatten')] })] })] }), brush.mode === 'paint' && (jsxs("fieldset", { style: {
                     border: '1px solid var(--nice-border, #e2e8f0)',
                     borderRadius: 6,
                     padding: 6,
                     display: 'grid',
                     gap: 4,
-                }, children: [jsx("legend", { style: { fontSize: 11 }, children: "Texture Layers" }), textureLayers.map((layer, i) => (jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "radio", name: "texLayer", checked: activeTextureLayer === i, onChange: () => setActiveTextureLayer(i) }), jsx("input", { type: "text", value: layer.name, onChange: (e) => setTextureLayer(i, { name: e.target.value }), style: {
+                }, children: [jsx("legend", { style: { fontSize: 11 }, children: t('terrainEditor.textureLayers', 'Texture Layers') }), textureLayers.map((layer, i) => (jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "radio", name: "texLayer", checked: activeTextureLayer === i, onChange: () => setActiveTextureLayer(i) }), jsx("input", { type: "text", value: layer.name, onChange: (e) => setTextureLayer(i, { name: e.target.value }), style: {
                                     flex: 1,
                                     padding: '2px 6px',
                                     border: '1px solid var(--nice-border, #e2e8f0)',
@@ -378,7 +380,7 @@ const NiceTerrainEditor = ({ scene, camera, canvas, config: configProp, onTerrai
                         link.href = c.toDataURL('image/png');
                         link.click();
                     }
-                }, style: { fontSize: 11 }, children: [jsx(NiceIcon, { name: "download", size: 14 }), " Export Heightmap PNG"] })] }));
+                }, style: { fontSize: 11 }, children: [jsx(NiceIcon, { name: "download", size: 14 }), ' ', t('terrainEditor.exportHeightmapPng', 'Export Heightmap PNG')] })] }));
 };
 
 export { NiceTerrainEditor, useTerrainEditor };

package/dist/esm/model/NiceWeightPainter.js

@@ -2,6 +2,7 @@ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { NiceIcon } from '@nice2dev/ui';
 import { useEffect, useState, useRef, useCallback } from 'react';
 import * as THREE from 'three';
+import { useNiceTranslation } from '../core/i18n.js';
 
 /* ── Weight painting utilities ── */
 function getFalloff(distance, radius, type) {
@@ -225,17 +226,18 @@ function updateHeatMapColors(mesh, boneIndex, colors) {
 }
 /* ── Component ── */
 const NiceWeightPainter = ({ skinnedMesh, activeBoneIndex: initialBoneIndex, scene, camera, canvas, onWeightsChange, className = '', }) => {
+    const { t } = useNiceTranslation();
     const { brush, setBrush, isPainting, activeBoneIndex, setActiveBoneIndex, boneNames, startPainting, stopPainting, normalizeWeights, showHeatMap, setShowHeatMap, } = useWeightPainter(skinnedMesh, scene, camera, canvas, onWeightsChange);
     useEffect(() => {
         setActiveBoneIndex(initialBoneIndex);
     }, [initialBoneIndex, setActiveBoneIndex]);
-    return (jsxs("div", { className: `nice-weight-painter ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxs("label", { children: ["Bone:", jsx("select", { value: activeBoneIndex, onChange: (e) => setActiveBoneIndex(parseInt(e.target.value, 10)), style: { marginLeft: 8, width: '100%' }, children: boneNames.map((name, i) => (jsx("option", { value: i, children: name }, i))) })] }), jsxs("fieldset", { style: {
+    return (jsxs("div", { className: `nice-weight-painter ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxs("label", { children: [t('weightPainter.bone', 'Bone:'), jsx("select", { value: activeBoneIndex, onChange: (e) => setActiveBoneIndex(parseInt(e.target.value, 10)), style: { marginLeft: 8, width: '100%' }, children: boneNames.map((name, i) => (jsx("option", { value: i, children: name }, i))) })] }), jsxs("fieldset", { style: {
                     display: 'flex',
                     gap: 4,
                     border: '1px solid var(--nice-border, #e2e8f0)',
                     borderRadius: 6,
                     padding: 4,
-                }, children: [jsx("legend", { style: { fontSize: 11 }, children: "Mode" }), ['add', 'subtract', 'smooth', 'blur'].map((mode) => (jsx("button", { type: "button", onClick: () => setBrush({ mode }), style: {
+                }, children: [jsx("legend", { style: { fontSize: 11 }, children: t('weightPainter.mode', 'Mode') }), ['add', 'subtract', 'smooth', 'blur'].map((mode) => (jsx("button", { type: "button", onClick: () => setBrush({ mode }), style: {
                             flex: 1,
                             padding: '4px 6px',
                             background: brush.mode === mode ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
@@ -244,7 +246,7 @@ const NiceWeightPainter = ({ skinnedMesh, activeBoneIndex: initialBoneIndex, sce
                             borderRadius: 4,
                             cursor: 'pointer',
                             fontSize: 11,
-                        }, children: mode }, mode)))] }), jsxs("label", { children: ["Radius: ", brush.radius.toFixed(2), 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%' } })] }), jsxs("label", { children: ["Strength: ", brush.strength.toFixed(2), 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%' } })] }), jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsx("button", { type: "button", onClick: isPainting ? stopPainting : startPainting, style: {
+                        }, children: mode }, mode)))] }), jsxs("label", { children: [t('weightPainter.radius', 'Radius: {radius}').replace('{radius}', String(brush.radius.toFixed(2))), 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%' } })] }), jsxs("label", { children: [t('weightPainter.strength', 'Strength: {strength}').replace('{strength}', String(brush.strength.toFixed(2))), 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%' } })] }), jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsx("button", { type: "button", onClick: isPainting ? stopPainting : startPainting, style: {
                             flex: 1,
                             background: isPainting
                                 ? 'var(--nice-danger, #ef4444)'
@@ -254,7 +256,7 @@ const NiceWeightPainter = ({ skinnedMesh, activeBoneIndex: initialBoneIndex, sce
                             borderRadius: 4,
                             padding: '6px 12px',
                             cursor: 'pointer',
-                        }, children: isPainting ? (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "stop", size: 14 }), " Stop Painting"] })) : (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "brush", size: 14 }), " Start Painting"] })) }), jsxs("button", { type: "button", onClick: normalizeWeights, title: "Normalize all weights", children: [jsx(NiceIcon, { name: "scale", size: 14 }), " Normalize"] })] }), jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "checkbox", checked: showHeatMap, onChange: (e) => setShowHeatMap(e.target.checked) }), "Show weight heat map"] })] }));
+                        }, children: isPainting ? (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "stop", size: 14 }), " ", t('weightPainter.stopPainting', 'Stop Painting')] })) : (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "brush", size: 14 }), ' ', t('weightPainter.startPainting', 'Start Painting')] })) }), jsxs("button", { type: "button", onClick: normalizeWeights, title: t('weightPainter.normalizeAllWeights', 'Normalize all weights'), children: [jsx(NiceIcon, { name: "scale", size: 14 }), " ", t('weightPainter.normalize', 'Normalize')] })] }), jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "checkbox", checked: showHeatMap, onChange: (e) => setShowHeatMap(e.target.checked) }), t('weightPainter.showWeightHeatMap', 'Show weight heat map')] })] }));
 };
 
 export { NiceWeightPainter, useWeightPainter };

package/dist/esm/model/NiceXRPreview.js

@@ -2,6 +2,7 @@ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { NiceIcon } from '@nice2dev/ui';
 import { useEffect, useState, useRef, useCallback } from 'react';
 import * as THREE from 'three';
+import { useNiceTranslation } from '../core/i18n.js';
 
 /* ── Hook ── */
 function useXRPreview(renderer, scene, camera, onSessionStart, onSessionEnd) {
@@ -259,13 +260,14 @@ function useXRPreview(renderer, scene, camera, onSessionStart, onSessionEnd) {
 }
 /* ── Component ── */
 const NiceXRPreview = ({ renderer, scene, camera, mode: initialMode, onSessionStart, onSessionEnd, className = '', }) => {
+    const { t } = useNiceTranslation();
     const { isSupported, isSessionActive, mode, setMode, startSession, endSession, controllers, teleportEnabled, setTeleportEnabled, hitTestResult, } = useXRPreview(renderer, scene, camera, onSessionStart, onSessionEnd);
     useEffect(() => {
         if (initialMode) {
             setMode(initialMode);
         }
     }, [initialMode, setMode]);
-    return (jsxs("div", { className: `nice-xr-preview ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxs("strong", { children: [jsx(NiceIcon, { name: "eye", size: 14 }), " XR Preview"] }), !isSupported && (jsx("div", { style: { color: 'var(--nice-danger, #ef4444)', fontSize: 11 }, children: "WebXR is not supported in this browser." })), isSupported && (jsxs(Fragment, { children: [jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxs("button", { type: "button", onClick: () => setMode('vr'), style: {
+    return (jsxs("div", { className: `nice-xr-preview ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxs("strong", { children: [jsx(NiceIcon, { name: "eye", size: 14 }), " ", t('xrPreview.xrPreview', 'XR Preview')] }), !isSupported && (jsx("div", { style: { color: 'var(--nice-danger, #ef4444)', fontSize: 11 }, children: t('xrPreview.webxrIsNotSupportedIn', 'WebXR is not supported in this browser.') })), isSupported && (jsxs(Fragment, { children: [jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxs("button", { type: "button", onClick: () => setMode('vr'), style: {
                                     flex: 1,
                                     padding: '5px 8px',
                                     borderRadius: 4,
@@ -273,7 +275,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: [jsx(NiceIcon, { name: "eye", size: 14 }), " VR"] }), jsxs("button", { type: "button", onClick: () => setMode('ar'), style: {
+                                }, children: [jsx(NiceIcon, { name: "eye", size: 14 }), " ", t('xrPreview.vr', 'VR')] }), jsxs("button", { type: "button", onClick: () => setMode('ar'), style: {
                                     flex: 1,
                                     padding: '5px 8px',
                                     borderRadius: 4,
@@ -281,7 +283,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: [jsx(NiceIcon, { name: "window", size: 14 }), " AR"] })] }), jsx("button", { type: "button", onClick: isSessionActive ? endSession : startSession, style: {
+                                }, children: [jsx(NiceIcon, { name: "window", size: 14 }), " ", t('xrPreview.ar', 'AR')] })] }), jsx("button", { type: "button", onClick: isSessionActive ? endSession : startSession, style: {
                             background: isSessionActive
                                 ? 'var(--nice-danger, #ef4444)'
                                 : 'var(--nice-success, #22c55e)',
@@ -290,7 +292,10 @@ const NiceXRPreview = ({ renderer, scene, camera, mode: initialMode, onSessionSt
                             borderRadius: 4,
                             padding: '6px 12px',
                             cursor: 'pointer',
-                        }, children: isSessionActive ? (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "stop", size: 14 }), " Exit XR"] })) : (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "play", size: 14 }), " Enter XR"] })) }), mode === 'vr' && (jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "checkbox", checked: teleportEnabled, onChange: (e) => setTeleportEnabled(e.target.checked) }), "Teleportation"] })), isSessionActive && (jsxs("div", { style: { fontSize: 11, opacity: 0.7 }, children: ["Controllers: ", controllers.length, jsx("br", {}), mode === 'ar' && hitTestResult && (jsxs(Fragment, { children: ["Hit: (", hitTestResult.x.toFixed(2), ", ", hitTestResult.y.toFixed(2), ",", ' ', hitTestResult.z.toFixed(2), ")"] }))] }))] }))] }));
+                        }, children: isSessionActive ? (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "stop", size: 14 }), " ", t('xrPreview.exitXr', 'Exit XR')] })) : (jsxs(Fragment, { children: [jsx(NiceIcon, { name: "play", size: 14 }), " ", t('xrPreview.enterXr', 'Enter XR')] })) }), mode === 'vr' && (jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsx("input", { type: "checkbox", checked: teleportEnabled, onChange: (e) => setTeleportEnabled(e.target.checked) }), t('xrPreview.teleportation', 'Teleportation')] })), isSessionActive && (jsxs("div", { style: { fontSize: 11, opacity: 0.7 }, children: [t('xrPreview.controllers', 'Controllers: {controllers}').replace('{controllers}', String(controllers.length)), jsx("br", {}), mode === 'ar' && hitTestResult && (jsx(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))) }))] }))] }))] }));
 };
 
 export { NiceXRPreview, useXRPreview };