@nice2dev/ui-3d 1.1.9 → 1.2.0

package/CHANGELOG.md

@@ -1,5 +1,81 @@
 # @nice2dev/ui-3d — Changelog
 
+## 1.2.0
+
+### Minor Changes
+
+- 3a4939d: 1.2.0 — the API cleanup announced for this version, dictionaries per language by default, and
+  three new controls. **Breaking:** every removal has a replacement, listed name by name in
+  `documentation/omniverk/OMNIVERK_UPGRADE_1.2.0.md`.
+
+  **Removed (breaking).** All 118 `@deprecated` names: the aliases without the `Nice` prefix in
+  `ui-audio`, `ui-graphics` and `ui-3d`; `NiceBarcodeGenerator` (→ `NiceBarcode`), `NiceFloorPlanCanvas`
+  (→ `NiceSpatialEditor` in `@nice2dev/ui-buildings`), the v2 props and types of `NiceTopNav`,
+  `NiceProgress.showLabel`, `NiceCountryPicker.showDialCode` / `showFlag`, `type` on
+  `NiceDateTimePicker` / `NiceDateRangeBox` (→ `dateFormatPreset`); `ZoneOccupancy` in
+  `ui-buildings` and `events`, the `SmartHome*` types; the icon variant `flat` (→ `cutout`) and
+  `NiceIconEditor` (→ `NiceVectorEditor`); `NiceSizeLegacy`; the `snapGrid` module of `ui-diagrams` (→
+  `@nice2dev/spatial-core`); the opt-in stylesheet `@nice2dev/ui/css/legacy-bg-text-aliases.css`, which
+  formed an alias cycle with `style.css`. Props that were accepted and never read — 19 on
+  `NiceModuleGrid`, and more on `NiceAutocomplete`, `NiceTaskInbox`, `NiceConsentBanner`, the
+  building and communication controls, four `ui-audio` panels and `NiceStreamDashboard` — are gone
+  from the types. `NiceResourceAllocation` in `ui-erp` is `NiceCapacityPlanner` (the one in `ui`
+  keeps its name); `NiceGenericPlayerStageVisualizer` (→ `NiceStageVisualizer`) and
+  `NiceCubeBrowserProps` are removed. The `@nice2dev/ui/overlays` entry calls its modal, drawer,
+  bottom sheet and context menu `NiceOverlayModal`, `NiceOverlayDrawer`, `NiceOverlayBottomSheet` and
+  `NiceOverlayContextMenu`: the old names belonged to different components of `@nice2dev/ui`.
+
+  **Dictionaries per language.** `NiceI18nProvider` loads only the language in use, with `import()`
+  (it was `NiceI18nLazyProvider` in 1.1.10, which stays as the same component); the controls show their
+  built-in English until it arrives — `await loadNiceDictionary(lang)` before the first render to start
+  in the language. Nothing on the main entry of `@nice2dev/i18n` imports a dictionary any more:
+  `NICE_I18N_DICTIONARIES`, `createTranslator`, `NICE_I18N_VARIANTS` / `resolvePlVariant` and the
+  translation tooling moved to the new entry `@nice2dev/i18n/all`, and `@nice2dev/ui-core` no longer
+  re-exports the dictionary map. `@nice2dev/ui` with what it bundles: 1283 kB → 952 kB gzip loaded up
+  front. The `ui-audio` controls read the app's `NiceI18nProvider` now; their own provider overrides it.
+
+  **New controls.** `NiceRecurrenceEditor`, `NiceStopwatch`, `NiceCountdownTimer` (`@nice2dev/ui`) and
+  `NicePasswordGenerator` (`@nice2dev/auth`), plus `recurrenceDates()` and `generatePassword()`.
+  `NiceScheduler` honours a weekly rule's `byDay`, which it ignored.
+
+  **Visible changes.** The palette meets WCAG AA for text on every fill: darker fills in the light
+  theme, dark text on the fills of the dark theme (new `--nice-text-on-success` / `-error` / `-info` /
+  `-accent` / `-warning`; `NiceThemeText` takes `onSuccess`, `onError`, `onInfo`, `onWarning`). Mobile
+  and platform panels follow the app theme instead of `prefers-color-scheme`. Swipes in
+  `NiceSwipeActions`, `NiceTouchTable` and `NiceMobileCalendar` work with a mouse and a pen. The
+  `ui-forms` editors have the intended spacing (it was four times too large). `NiceMAM`,
+  `NiceTranscoder`, `NiceVideoAnnotator` and `NiceStreamDashboard` use `nice-`-prefixed BEM classes.
+
+  **Fixes.** Controls that invented results ask the host instead: `NiceIntegrationHub`,
+  `NiceMLStudio` (`onExperimentRun` may return metrics), `NiceRemoteManagement`
+  (`onCaptureScreenshot`), `NicePoseDetector` (`detector`), `NiceBatchScannerProvider`,
+  `NiceCacheStrategies`; `NiceLowCodeStudio` accepts dropped components. Controls that did nothing
+  work or say why they are off: `NiceStreamDashboard` adds sources, sends chat and runs the chosen
+  transition (new `onAddPlatform`, `onSendChatMessage`, `onTransition`, `onScreenshot`,
+  `onOpenAudioMixer`, `onOpenSettings`; `receiveChatMessage` feeds incoming chat), `NiceMLStudio`
+  downloads through `onModelDownload`, `NiceETLBuilder` saves through `onSave` (its Save button had
+  no handler), `NiceTranscoder` makes jobs of picked and dropped files, `NiceAutomationEditor` offers
+  the trigger types its model has. Texts of about fifty components go
+  through `t()` in six languages, among them the AI data grid, chart and form builders, the ML
+  studio, the report designer, the song picker, `NiceProtocolConfig`, `NiceETLBuilder` and
+  `NiceInlineHelp` — every key the controls pass to `t()` now has a dictionary entry, so none of
+  them stays English under another language; `NiceDataGridAI` sorts on a query in any language, not
+  only in English. `NiceWindow`, `NiceConsole`, `NiceFileManager` and `NiceGitManager` no longer
+  crash when `accessMode` switches to or from `'hidden'`. Ids come from `createId()` (`@nice2dev/ui-core`), so nothing throws
+  outside a secure context as `crypto.randomUUID()` did on plain http. `ui-3d` runs on three r183
+  without its deprecation warnings. `NiceRemoteManagement` calls the handlers of the latest render.
+  The AI hint popover and the `ui-platform` panels follow the app theme, not the system's or a
+  `.dark` class on the host. `NiceCommandPalette` has styles and its search filters;
+  `NiceTimeoutFeedback` starts its clock; `NiceOfflineBanner` takes `online`; Monaco's workers in
+  `NiceCodeEditor` load; the `ui-audio` panels that used Bootstrap classes use Nice controls; colours
+  that reached a canvas as `var(…)` (karaoke lanes and notes) are resolved first.
+
+## 1.1.10
+
+### Patch Changes
+
+- The package description on npm shows a dash instead of the mis-encoded "—".
+
 ## 1.1.9
 
 ### Patch Changes

package/README.md

@@ -27,22 +27,18 @@ npm install @nice2dev/ui-3d three
 ## Quick start
 
 ```tsx
-import { ModelEditor } from '@nice2dev/ui-3d';
+import { NiceModelEditor } from '@nice2dev/ui-3d';
 import '@nice2dev/ui-3d/style.css';
 
 function App() {
-  return (
-    <ModelEditor
-      onSaveToLibrary={(dataUrl, name, mimeType) => console.log('save', name)}
-    />
-  );
+  return <NiceModelEditor onSaveToLibrary={(dataUrl, name, mimeType) => console.log('save', name)} />;
 }
 ```
 
 ## With AI pose-from-video
 
 ```tsx
-import { ModelEditor, type Pose3DSequenceResult } from '@nice2dev/ui-3d';
+import { NiceModelEditor, type Pose3DSequenceResult } from '@nice2dev/ui-3d';
 
 async function myAiPose(file: File): Promise<Pose3DSequenceResult> {
   const form = new FormData();
@@ -51,20 +47,20 @@ async function myAiPose(file: File): Promise<Pose3DSequenceResult> {
   return res.json();
 }
 
-<ModelEditor onAIPoseVideo={myAiPose} />
+<NiceModelEditor onAIPoseVideo={myAiPose} />;
 ```
 
 ## With i18n
 
 ```tsx
-import { ModelEditor, NiceI18nProvider } from '@nice2dev/ui-3d';
+import { NiceModelEditor, NiceI18nProvider } from '@nice2dev/ui-3d';
 import { useTranslation } from 'react-i18next';
 
 function App() {
   const { t } = useTranslation();
   return (
     <NiceI18nProvider t={(key, fallback) => t(key, fallback)}>
-      <ModelEditor />
+      <NiceModelEditor />
     </NiceI18nProvider>
   );
 }
@@ -72,11 +68,11 @@ function App() {
 
 ## Props
 
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `className` | `string` | — | CSS class added to root element |
-| `onSaveToLibrary` | `(dataUrl, name, mimeType) => void` | — | Called when user saves render |
-| `onAIPoseVideo` | `(file: File) => Promise<Pose3DSequenceResult>` | — | AI pose callback; button hidden if omitted |
+| Prop              | Type                                            | Default | Description                                |
+| ----------------- | ----------------------------------------------- | ------- | ------------------------------------------ |
+| `className`       | `string`                                        | —       | CSS class added to root element            |
+| `onSaveToLibrary` | `(dataUrl, name, mimeType) => void`             | —       | Called when user saves render              |
+| `onAIPoseVideo`   | `(file: File) => Promise<Pose3DSequenceResult>` | —       | AI pose callback; button hidden if omitted |
 
 ## Build
 

package/dist/cjs/core/threeCompat.js

@@ -0,0 +1,52 @@
+'use strict';
+
+var THREE = require('three');
+
+function _interopNamespaceDefault(e) {
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n.default = e;
+    return Object.freeze(n);
+}
+
+var THREE__namespace = /*#__PURE__*/_interopNamespaceDefault(THREE);
+
+/**
+ * three.js r183 deprecated `Clock` (for `Timer`) and folds `PCFSoftShadowMap` into
+ * `PCFShadowMap`; both log a console warning there. The peer range starts at r150, which has
+ * neither `Timer` in its core nor the softer `PCFShadowMap`, so the choice follows the revision.
+ */
+const REVISION = Number.parseInt(THREE__namespace.REVISION, 10);
+const MODERN = REVISION >= 183;
+/** Soft shadows without the r183 deprecation warning; older three keeps `PCFSoftShadowMap`. */
+const SOFT_SHADOW_MAP = MODERN
+    ? THREE__namespace.PCFShadowMap
+    : THREE__namespace.PCFSoftShadowMap;
+/** `Timer` where three has deprecated `Clock`, `Clock` before. */
+function createFrameClock() {
+    const TimerCtor = THREE__namespace.Timer;
+    if (MODERN && TimerCtor) {
+        const timer = new TimerCtor();
+        return {
+            getDelta: () => {
+                timer.update();
+                return timer.getDelta();
+            },
+        };
+    }
+    const clock = new THREE__namespace.Clock();
+    return { getDelta: () => clock.getDelta() };
+}
+
+exports.SOFT_SHADOW_MAP = SOFT_SHADOW_MAP;
+exports.createFrameClock = createFrameClock;

package/dist/cjs/dance/PoseDetector.js

@@ -42,19 +42,15 @@ const SKELETON_CONNECTIONS = [
     [12, 14],
     [14, 16], // right leg
 ];
-// ── Simulated pose detection (no external dependency) ───────────
-function createSimulatedKeypoints() {
-    return COCO_KEYPOINTS.map((name, _i) => ({
-        name,
-        x: 0,
-        y: 0,
-        z: 0,
-        confidence: 0,
-    }));
-}
+/** A keypoint the detector reported without a score counts as found. */
+const confidenceOf = (kp) => { var _a; return (_a = kp.confidence) !== null && _a !== void 0 ? _a : 1; };
 // ── Hook: usePoseDetection ──────────────────────────────────────
 function usePoseDetection(config = {}) {
-    const { maxPersons = 1, minConfidence = 0.5, targetFps = 30 } = config;
+    // The detection loop outlives renders: it reads the latest settings from here.
+    const configRef = React.useRef(config);
+    React.useEffect(() => {
+        configRef.current = config;
+    });
     const [isDetecting, setIsDetecting] = React.useState(false);
     const latestFrameRef = React.useRef(null);
     const frameIndexRef = React.useRef(0);
@@ -62,33 +58,67 @@ function usePoseDetection(config = {}) {
     const streamRef = React.useRef(null);
     const videoRef = React.useRef(null);
     const callbackRef = React.useRef(null);
-    const processFrame = React.useCallback(() => {
+    const errorRef = React.useRef(null);
+    const startedAtRef = React.useRef(0);
+    const lastRunRef = React.useRef(-Infinity);
+    const busyRef = React.useRef(false);
+    // Bumped by start() and stop(): a detection that resolves after them is dropped.
+    const runRef = React.useRef(0);
+    const stop = React.useCallback(() => {
         var _a;
-        if (!videoRef.current || videoRef.current.readyState < 2) {
-            rafRef.current = requestAnimationFrame(processFrame);
+        runRef.current += 1;
+        cancelAnimationFrame(rafRef.current);
+        (_a = streamRef.current) === null || _a === void 0 ? void 0 : _a.getTracks().forEach((t) => t.stop());
+        streamRef.current = null;
+        if (videoRef.current) {
+            videoRef.current.srcObject = null;
+        }
+        setIsDetecting(false);
+    }, []);
+    const processFrame = React.useCallback(() => {
+        rafRef.current = requestAnimationFrame(processFrame);
+        const video = videoRef.current;
+        const { detector, maxPersons = 1, minConfidence = 0.5, targetFps = 30 } = configRef.current;
+        if (!detector || !video || video.readyState < 2 || busyRef.current) {
             return;
         }
-        const idx = frameIndexRef.current++;
-        const timestamp = idx / targetFps;
-        // Build frame from video analysis (placeholder for actual ML model)
-        // In production, this calls MediaPipe/TensorFlow.js pose estimation
-        const persons = [];
-        for (let p = 0; p < maxPersons; p++) {
-            const keypoints = createSimulatedKeypoints();
-            if (keypoints.some((kp) => { var _a; return ((_a = kp.confidence) !== null && _a !== void 0 ? _a : 0) >= minConfidence; })) {
-                persons.push({ id: p, keypoints });
-            }
+        const now = performance.now();
+        if (now - lastRunRef.current < 1000 / targetFps) {
+            return;
         }
-        const frame = {
-            frame_index: idx,
-            timestamp_sec: timestamp,
-            persons,
-        };
-        latestFrameRef.current = frame;
-        (_a = callbackRef.current) === null || _a === void 0 ? void 0 : _a.call(callbackRef, frame);
-        rafRef.current = requestAnimationFrame(processFrame);
-    }, [maxPersons, minConfidence, targetFps]);
-    const start = React.useCallback(async (video, onFrame) => {
+        lastRunRef.current = now;
+        busyRef.current = true;
+        const run = runRef.current;
+        Promise.resolve()
+            .then(() => detector(video, now))
+            .then((found) => {
+            var _a;
+            if (run !== runRef.current) {
+                return;
+            }
+            const frame = {
+                frame_index: frameIndexRef.current++,
+                timestamp_sec: (now - startedAtRef.current) / 1000,
+                persons: found
+                    .filter((person) => person.keypoints.some((kp) => confidenceOf(kp) >= minConfidence))
+                    .slice(0, maxPersons),
+            };
+            latestFrameRef.current = frame;
+            (_a = callbackRef.current) === null || _a === void 0 ? void 0 : _a.call(callbackRef, frame);
+        })
+            .catch((err) => {
+            var _a;
+            if (run !== runRef.current) {
+                return;
+            }
+            stop();
+            (_a = errorRef.current) === null || _a === void 0 ? void 0 : _a.call(errorRef, err instanceof Error ? err : new Error(String(err)));
+        })
+            .finally(() => {
+            busyRef.current = false;
+        });
+    }, [stop]);
+    const start = React.useCallback(async (video, onFrame, onError) => {
         try {
             const stream = await navigator.mediaDevices.getUserMedia({
                 video: { facingMode: 'user', width: { ideal: 640 }, height: { ideal: 480 } },
@@ -98,7 +128,14 @@ function usePoseDetection(config = {}) {
             video.srcObject = stream;
             await video.play();
             callbackRef.current = onFrame !== null && onFrame !== void 0 ? onFrame : null;
+            errorRef.current = onError !== null && onError !== void 0 ? onError : null;
             frameIndexRef.current = 0;
+            startedAtRef.current = performance.now();
+            lastRunRef.current = -Infinity;
+            runRef.current += 1;
+            if (!configRef.current.detector) {
+                console.warn('[NicePoseDetector] started without a `detector`: the camera runs, but no poses are detected.');
+            }
             setIsDetecting(true);
             rafRef.current = requestAnimationFrame(processFrame);
         }
@@ -106,16 +143,6 @@ function usePoseDetection(config = {}) {
             throw new Error(`Camera access failed: ${err instanceof Error ? err.message : String(err)}`);
         }
     }, [processFrame]);
-    const stop = React.useCallback(() => {
-        var _a;
-        cancelAnimationFrame(rafRef.current);
-        (_a = streamRef.current) === null || _a === void 0 ? void 0 : _a.getTracks().forEach((t) => t.stop());
-        streamRef.current = null;
-        if (videoRef.current) {
-            videoRef.current.srcObject = null;
-        }
-        setIsDetecting(false);
-    }, []);
     React.useEffect(() => () => {
         stop();
     }, [stop]);
@@ -136,64 +163,90 @@ const NicePoseDetector = React.forwardRef(function NicePoseDetector(props, ref)
         },
     }));
     const drawSkeleton = React.useCallback((frame) => {
-        var _a, _b, _c, _d, _e, _f;
+        var _a;
         const ctx = (_a = canvasRef.current) === null || _a === void 0 ? void 0 : _a.getContext('2d');
         if (!ctx || !canvasRef.current) {
             return;
         }
         ctx.clearRect(0, 0, canvasRef.current.width, canvasRef.current.height);
+        // Keypoints are in video pixels; the video fills the box with object-fit: cover.
+        const video = videoRef.current;
+        const videoW = (video === null || video === void 0 ? void 0 : video.videoWidth) || width;
+        const videoH = (video === null || video === void 0 ? void 0 : video.videoHeight) || height;
+        const scale = Math.max(width / videoW, height / videoH);
+        const offsetX = (width - videoW * scale) / 2;
+        const offsetY = (height - videoH * scale) / 2;
+        const at = (kp) => [
+            kp.x * scale + offsetX,
+            kp.y * scale + offsetY,
+        ];
         for (const person of frame.persons) {
             const kps = person.keypoints;
+            const byName = new Map(kps.map((kp) => [kp.name, kp]));
             // Draw connections
             if (showSkeleton) {
                 ctx.strokeStyle = ui.resolveCssColor('var(--nice-success, #00ff88)', ctx.canvas);
                 ctx.lineWidth = 2;
                 for (const [a, b] of SKELETON_CONNECTIONS) {
-                    const ka = kps[a], kb = kps[b];
+                    const ka = byName.get(COCO_KEYPOINTS[a]);
+                    const kb = byName.get(COCO_KEYPOINTS[b]);
                     if (!ka || !kb) {
                         continue;
                     }
-                    if (((_b = ka.confidence) !== null && _b !== void 0 ? _b : 0) < 0.3 || ((_c = kb.confidence) !== null && _c !== void 0 ? _c : 0) < 0.3) {
+                    if (confidenceOf(ka) < 0.3 || confidenceOf(kb) < 0.3) {
                         continue;
                     }
                     ctx.beginPath();
-                    ctx.moveTo(ka.x, ka.y);
-                    ctx.lineTo(kb.x, kb.y);
+                    ctx.moveTo(...at(ka));
+                    ctx.lineTo(...at(kb));
                     ctx.stroke();
                 }
             }
             // Draw keypoints
             for (const kp of kps) {
-                if (((_d = kp.confidence) !== null && _d !== void 0 ? _d : 0) < 0.3) {
+                if (confidenceOf(kp) < 0.3) {
                     continue;
                 }
-                const radius = showConfidence ? 3 + ((_e = kp.confidence) !== null && _e !== void 0 ? _e : 0) * 5 : 4;
+                const radius = showConfidence ? 3 + confidenceOf(kp) * 5 : 4;
                 ctx.fillStyle = ui.resolveCssColor(showConfidence
-                    ? `rgba(0, 255, 136, ${(_f = kp.confidence) !== null && _f !== void 0 ? _f : 0.5})`
+                    ? `rgba(0, 255, 136, ${confidenceOf(kp)})`
                     : 'var(--nice-success, #00ff88)', ctx.canvas);
                 ctx.beginPath();
-                ctx.arc(kp.x, kp.y, radius, 0, 2 * Math.PI);
+                ctx.arc(...at(kp), radius, 0, 2 * Math.PI);
                 ctx.fill();
             }
         }
-    }, [showSkeleton, showConfidence]);
+    }, [showSkeleton, showConfidence, width, height]);
+    // The detection loop is started once; it reaches this render's drawing and callbacks here.
+    const latestRef = React.useRef({ drawSkeleton, onFrame, onError });
+    React.useEffect(() => {
+        latestRef.current = { drawSkeleton, onFrame, onError };
+    });
     const handleFrame = React.useCallback((frame) => {
-        drawSkeleton(frame);
-        onFrame === null || onFrame === void 0 ? void 0 : onFrame(frame);
-    }, [drawSkeleton, onFrame]);
+        var _a, _b;
+        latestRef.current.drawSkeleton(frame);
+        (_b = (_a = latestRef.current).onFrame) === null || _b === void 0 ? void 0 : _b.call(_a, frame);
+    }, []);
+    const handleDetectorError = React.useCallback((error) => {
+        var _a, _b;
+        (_b = (_a = latestRef.current).onError) === null || _b === void 0 ? void 0 : _b.call(_a, error);
+    }, []);
     const handleStart = React.useCallback(async () => {
         try {
             if (videoRef.current) {
-                await detection.start(videoRef.current, handleFrame);
+                await detection.start(videoRef.current, handleFrame, handleDetectorError);
                 onStart === null || onStart === void 0 ? void 0 : onStart();
             }
         }
         catch (err) {
             onError === null || onError === void 0 ? void 0 : onError(err instanceof Error ? err : new Error(String(err)));
         }
-    }, [detection, handleFrame, onStart, onError]);
+    }, [detection, handleFrame, handleDetectorError, onStart, onError]);
     const handleStop = React.useCallback(() => {
+        var _a;
         detection.stop();
+        const canvas = canvasRef.current;
+        (_a = canvas === null || canvas === void 0 ? void 0 : canvas.getContext('2d')) === null || _a === void 0 ? void 0 : _a.clearRect(0, 0, canvas.width, canvas.height);
         onStop === null || onStop === void 0 ? void 0 : onStop();
     }, [detection, onStop]);
     const containerStyle = {
@@ -234,9 +287,6 @@ const NicePoseDetector = React.forwardRef(function NicePoseDetector(props, ref)
                     fontWeight: 600,
                 }, children: "Start Camera" }))] }));
 });
-/** @deprecated Use NicePoseDetector */
-const PoseDetector = NicePoseDetector;
 
 exports.NicePoseDetector = NicePoseDetector;
-exports.PoseDetector = PoseDetector;
 exports.usePoseDetection = usePoseDetection;

package/dist/cjs/index.js

@@ -39,9 +39,7 @@ var NiceRenderExport = require('./rendering/NiceRenderExport.js');
 
 
 
-exports.ModelEditor = ModelEditor.ModelEditor;
 exports.NiceModelEditor = ModelEditor.NiceModelEditor;
-exports.ModelViewer = ModelViewer.ModelViewer;
 exports.NiceModelViewer = ModelViewer.NiceModelViewer;
 exports.DEFAULT_CAD_SETTINGS = cadModeUtils.DEFAULT_CAD_SETTINGS;
 exports.FLOOR_MATERIALS = cadModeUtils.FLOOR_MATERIALS;
@@ -101,7 +99,6 @@ exports.subclip = modelEditorUtils.subclip;
 exports.toThreeKeyframeTrack = modelEditorUtils.toThreeKeyframeTrack;
 exports.EditorShortcutManager = editorShortcuts.EditorShortcutManager;
 exports.NicePoseDetector = PoseDetector.NicePoseDetector;
-exports.PoseDetector = PoseDetector.PoseDetector;
 exports.usePoseDetection = PoseDetector.usePoseDetection;
 exports.DanceScoreEngine = DanceScoreEngine.DanceScoreEngine;
 exports.useDanceScore = DanceScoreEngine.useDanceScore;

package/dist/cjs/model/ModelEditor.js

@@ -31,8 +31,5 @@ const NiceModelEditor = ({ className, onSaveToLibrary, onAIPoseVideo, }) => {
                     e.target.value = '';
                 } }), jsxRuntime.jsx("input", { ref: api.videoInputRef, type: "file", accept: "video/*", style: { display: 'none' }, onChange: api.handleAIVideo }), jsxRuntime.jsx(ui.NiceAppShell, { className: `${ModelEditor_module.root} ${className !== null && className !== void 0 ? className : ''}`, flush: true, menubar: jsxRuntime.jsx(ModelEditorMenuBar, { api: api, hasOnSaveToLibrary: !!onSaveToLibrary }), sidebar: jsxRuntime.jsxs("div", { style: { display: 'flex', minHeight: 0 }, children: [jsxRuntime.jsx(ModelEditorLeftPanel, { api: api }), jsxRuntime.jsx(ModelEditorToolbar, { api: api })] }), rightSidebar: jsxRuntime.jsx(ModelEditorRightPanel, { api: api }), bottomPanel: jsxRuntime.jsx(ModelEditorTimeline, { api: api }), statusBar: jsxRuntime.jsxs("div", { className: ModelEditor_module.statusBar, children: [jsxRuntime.jsx("span", { children: api.statusText }), jsxRuntime.jsxs("span", { style: { marginLeft: 'auto' }, children: [api.polyCount.toLocaleString(), " triangles \u00B7 ", api.meshCount, " meshes \u00B7 ", api.boneCount, ' ', "bones \u00B7 ", api.animations.length, " anim(s)"] })] }), children: jsxRuntime.jsx(ModelEditorViewport, { api: api }) })] }));
 };
-/** @deprecated Use NiceModelEditor */
-const ModelEditor = NiceModelEditor;
 
-exports.ModelEditor = ModelEditor;
 exports.NiceModelEditor = NiceModelEditor;

package/dist/cjs/model/ModelViewer.js

@@ -62,8 +62,5 @@ const NiceModelViewer = ({ className, showToolbar = true, showStatusBar = true,
                             a.click();
                         }, title: "Screenshot", "aria-label": "Screenshot", children: jsxRuntime.jsx(ui.NiceIcon, { name: "camera", size: 16 }) }), jsxRuntime.jsx(ui.NiceButton, { className: ModelViewer_module.toolBtn, variant: "ghost", size: "sm", onClick: api.toggleFullscreen, title: "Fullscreen", "aria-label": "Fullscreen", children: jsxRuntime.jsx(ui.NiceIcon, { name: api.isFullscreen ? 'collapse' : 'expand', size: 16 }) }), toolbarExtra, showInfoPanel && (jsxRuntime.jsx("div", { className: ModelViewer_module.toolRight, children: jsxRuntime.jsx(ui.NiceButton, { className: `${ModelViewer_module.toolBtn} ${panelOpen ? ModelViewer_module.active : ''}`, variant: panelOpen ? 'primary' : 'ghost', size: "sm", onClick: () => setPanelOpen(!panelOpen), title: "Info panel", "aria-label": "Info panel", children: jsxRuntime.jsx(ui.NiceIcon, { name: "info", size: 16 }) }) }))] })), jsxRuntime.jsxs("div", { className: ModelViewer_module.viewport, ref: api.mountRef, tabIndex: 0, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, children: [api.loading && (jsxRuntime.jsxs("div", { className: ModelViewer_module.loadingOverlay, children: [jsxRuntime.jsx("span", { className: ModelViewer_module.loadingText, children: "Loading model\u2026" }), jsxRuntime.jsx("div", { className: ModelViewer_module.loadingBar, children: jsxRuntime.jsx("div", { className: ModelViewer_module.loadingBarFill, style: { width: `${(api.loadProgress * 100).toFixed(0)}%` } }) })] })), api.error && (jsxRuntime.jsxs("div", { className: ModelViewer_module.errorOverlay, children: [jsxRuntime.jsx(ui.NiceIcon, { name: "warning", size: 28 }), jsxRuntime.jsx("span", { style: { marginTop: 8 }, children: api.error })] })), dragOver && jsxRuntime.jsx("div", { className: ModelViewer_module.dropZone, children: "Drop 3D model file here" })] }), jsxRuntime.jsxs("div", { className: `${ModelViewer_module.sidePanel} ${!panelOpen ? ModelViewer_module.hidden : ''}`, children: [jsxRuntime.jsxs("div", { className: ModelViewer_module.panelSection, children: [jsxRuntime.jsx("div", { className: ModelViewer_module.panelTitle, children: "Model Info" }), jsxRuntime.jsxs("div", { className: ModelViewer_module.panelRow, children: [jsxRuntime.jsx("label", { children: "Triangles" }), jsxRuntime.jsx("span", { children: api.polyCount.toLocaleString() })] }), jsxRuntime.jsxs("div", { className: ModelViewer_module.panelRow, children: [jsxRuntime.jsx("label", { children: "Meshes" }), jsxRuntime.jsx("span", { children: api.meshCount })] }), api.dimensions && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: ModelViewer_module.panelRow, children: [jsxRuntime.jsx("label", { children: "Width" }), jsxRuntime.jsx("span", { children: api.dimensions.width })] }), jsxRuntime.jsxs("div", { className: ModelViewer_module.panelRow, children: [jsxRuntime.jsx("label", { children: "Height" }), jsxRuntime.jsx("span", { children: api.dimensions.height })] }), jsxRuntime.jsxs("div", { className: ModelViewer_module.panelRow, children: [jsxRuntime.jsx("label", { children: "Depth" }), jsxRuntime.jsx("span", { children: api.dimensions.depth })] })] }))] }), jsxRuntime.jsxs("div", { className: ModelViewer_module.panelSection, children: [jsxRuntime.jsx("div", { className: ModelViewer_module.panelTitle, children: "Navigation" }), navModes.map((m) => (jsxRuntime.jsx(ui.NiceButton, { className: ModelViewer_module.toolBtn, variant: api.navigationMode === m ? 'primary' : 'ghost', size: "sm", onClick: () => api.setNavigationMode(m), children: jsxRuntime.jsx(NavLabel, { mode: m }) }, m)))] }), jsxRuntime.jsxs("div", { className: ModelViewer_module.panelSection, children: [jsxRuntime.jsx("div", { className: ModelViewer_module.panelTitle, children: "Auto Rotate" }), jsxRuntime.jsx(ui.NiceSlider, { min: 0, max: 10, step: 0.5, value: api.autoRotateSpeed, onChange: (val) => api.setAutoRotateSpeed(val), style: { width: '100%' } })] }), api.animations.length > 0 && (jsxRuntime.jsxs("div", { className: ModelViewer_module.panelSection, children: [jsxRuntime.jsx("div", { className: ModelViewer_module.panelTitle, children: "Animations" }), api.animations.map((name, i) => (jsxRuntime.jsxs(ui.NiceButton, { className: ModelViewer_module.toolBtn, variant: api.activeAnimIdx === i ? 'primary' : 'ghost', size: "sm", onClick: () => api.playAnimation(i), children: [jsxRuntime.jsx(ui.NiceIcon, { name: "play", size: 14 }), " ", name] }, i)))] }))] }), jsxRuntime.jsxs("div", { className: `${ModelViewer_module.animBar} ${api.animations.length === 0 ? ModelViewer_module.hidden : ''}`, children: [jsxRuntime.jsx(ui.NiceButton, { className: ModelViewer_module.toolBtn, variant: "ghost", size: "sm", onClick: api.togglePlay, "aria-label": "Play/Pause", children: jsxRuntime.jsx(ui.NiceIcon, { name: api.isPlaying ? 'pause' : 'play', size: 16 }) }), jsxRuntime.jsx(ui.NiceSelect, { className: ModelViewer_module.animSelect, value: String(api.activeAnimIdx), onChange: (val) => api.playAnimation(parseInt(val)), options: api.animations.map((n, i) => ({ value: String(i), label: n })) }), jsxRuntime.jsx(ui.NiceSlider, { className: ModelViewer_module.animSlider, min: 0, max: api.animDuration || 1, step: 0.01, value: api.animTime, onChange: (val) => api.seekAnim(val) }), jsxRuntime.jsxs("span", { className: ModelViewer_module.toolLabel, children: [api.animTime.toFixed(1), "s / ", api.animDuration.toFixed(1), "s"] })] }), showStatusBar && (jsxRuntime.jsxs("div", { className: ModelViewer_module.statusBar, children: [jsxRuntime.jsx("span", { children: api.statusText }), jsxRuntime.jsxs("div", { className: ModelViewer_module.statusRight, children: [jsxRuntime.jsx("span", { children: jsxRuntime.jsx(NavLabel, { mode: api.navigationMode }) }), api.dimensions && (jsxRuntime.jsxs("span", { children: [api.dimensions.width, "\u00D7", api.dimensions.height, "\u00D7", api.dimensions.depth] }))] })] })), children === null || children === void 0 ? void 0 : children(api)] }));
 };
-/** @deprecated Use NiceModelViewer */
-const ModelViewer = NiceModelViewer;
 
-exports.ModelViewer = ModelViewer;
 exports.NiceModelViewer = NiceModelViewer;

package/dist/cjs/model/NiceArmatureEditor.js

@@ -166,7 +166,7 @@ function useArmatureEditor(skeleton, scene, onBoneSelect) {
             }
         }
         const pose = {
-            id: crypto.randomUUID(),
+            id: ui.createId(),
             name,
             timestamp: Date.now(),
             boneTransforms: transforms,
@@ -243,7 +243,7 @@ const NiceArmatureEditor = ({ skeleton, skinnedMesh: _skinnedMesh, scene, camera
                         padding: '4px 8px',
                         paddingLeft: depth * 16 + 8,
                         background: isSelected ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
-                        color: isSelected ? 'var(--nice-text-on-primary, #fff)' : 'inherit',
+                        color: isSelected ? 'var(--nice-color-white, #fff)' : 'inherit',
                         cursor: 'pointer',
                         fontSize: 13,
                         borderRadius: 4,

package/dist/cjs/model/NicePhysicsSimulation.js

@@ -289,7 +289,7 @@ const NicePhysicsSimulation = ({ scene, selectedObject, onSimulationStep, classN
     return (jsxRuntime.jsxs("div", { className: `nice-physics-simulation ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxRuntime.jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center' }, children: [jsxRuntime.jsxs("strong", { children: [jsxRuntime.jsx(ui.NiceIcon, { name: "zap", size: 14 }), " Physics"] }), jsxRuntime.jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 4, fontSize: 11 }, children: [jsxRuntime.jsx("input", { type: "checkbox", checked: debugDraw, onChange: (e) => setDebugDraw(e.target.checked) }), "Debug"] })] }), jsxRuntime.jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxRuntime.jsx("button", { type: "button", onClick: isRunning ? pause : play, style: {
                             flex: 1,
                             background: isRunning ? 'var(--nice-danger, #ef4444)' : 'var(--nice-success, #22c55e)',
-                            color: 'var(--nice-text-on-primary, #fff)',
+                            color: 'var(--nice-color-white, #fff)',
                             border: 'none',
                             borderRadius: 4,
                             padding: '5px 8px',

package/dist/cjs/model/NiceTerrainEditor.js

@@ -364,12 +364,12 @@ const NiceTerrainEditor = ({ scene, camera, canvas, config: configProp, onTerrai
                             borderRadius: 4,
                             border: '1px solid var(--nice-border, #e2e8f0)',
                             background: brush.mode === m ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
-                            color: brush.mode === m ? 'var(--nice-text-on-primary, #fff)' : 'inherit',
+                            color: brush.mode === m ? 'var(--nice-color-white, #fff)' : 'inherit',
                         }, children: m }, m)))] }), jsxRuntime.jsxs("label", { children: ["Radius: ", brush.radius.toFixed(1), jsxRuntime.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%' } })] }), 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.jsx("button", { type: "button", onClick: isPainting ? stopPainting : startPainting, style: {
                     background: isPainting
                         ? 'var(--nice-danger, #ef4444)'
                         : 'var(--nice-color-accent, #6366f1)',
-                    color: 'var(--nice-text-on-primary, #fff)',
+                    color: 'var(--nice-color-white, #fff)',
                     border: 'none',
                     borderRadius: 4,
                     padding: '6px 12px',

package/dist/cjs/model/NiceWeightPainter.js

@@ -260,7 +260,7 @@ const NiceWeightPainter = ({ skinnedMesh, activeBoneIndex: initialBoneIndex, sce
                             flex: 1,
                             padding: '4px 6px',
                             background: brush.mode === mode ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
-                            color: brush.mode === mode ? 'var(--nice-text-on-primary, #fff)' : 'inherit',
+                            color: brush.mode === mode ? 'var(--nice-color-white, #fff)' : 'inherit',
                             border: '1px solid var(--nice-border, #e2e8f0)',
                             borderRadius: 4,
                             cursor: 'pointer',
@@ -270,7 +270,7 @@ const NiceWeightPainter = ({ skinnedMesh, activeBoneIndex: initialBoneIndex, sce
                             background: isPainting
                                 ? 'var(--nice-danger, #ef4444)'
                                 : 'var(--nice-color-accent, #6366f1)',
-                            color: 'var(--nice-text-on-primary, #fff)',
+                            color: 'var(--nice-color-white, #fff)',
                             border: 'none',
                             borderRadius: 4,
                             padding: '6px 12px',

package/dist/cjs/model/NiceXRPreview.js

@@ -292,7 +292,7 @@ const NiceXRPreview = ({ renderer, scene, camera, mode: initialMode, onSessionSt
                                     borderRadius: 4,
                                     cursor: 'pointer',
                                     background: mode === 'vr' ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
-                                    color: mode === 'vr' ? 'var(--nice-text-on-primary, #fff)' : 'inherit',
+                                    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: {
                                     flex: 1,
@@ -300,13 +300,13 @@ const NiceXRPreview = ({ renderer, scene, camera, mode: initialMode, onSessionSt
                                     borderRadius: 4,
                                     cursor: 'pointer',
                                     background: mode === 'ar' ? 'var(--nice-color-accent, #6366f1)' : 'transparent',
-                                    color: mode === 'ar' ? 'var(--nice-text-on-primary, #fff)' : 'inherit',
+                                    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: {
                             background: isSessionActive
                                 ? 'var(--nice-danger, #ef4444)'
                                 : 'var(--nice-success, #22c55e)',
-                            color: 'var(--nice-text-on-primary, #fff)',
+                            color: 'var(--nice-color-white, #fff)',
                             border: 'none',
                             borderRadius: 4,
                             padding: '6px 12px',