@camstack/ui-library 1.2.159 → 1.2.161

package/dist/composites/detection-overlay.d.ts

@@ -4,6 +4,14 @@ export interface DetectionOverlayProps {
     readonly showMotionZones?: boolean;
     readonly showMotionRaw?: boolean;
     readonly showDetections?: boolean;
+    /**
+     * Draw subjects the tracker calls MOVING (and the ones it has not judged
+     * yet — an unclassified track is not a still one, and hiding it would make a
+     * new subject invisible for its first frames).
+     */
+    readonly showMoving?: boolean;
+    /** Draw subjects the tracker calls `stationary` or `loitering`. */
+    readonly showStationary?: boolean;
     readonly showPhaseIndicator?: boolean;
 }
-export declare function DetectionOverlay({ detections: { motion, motionRaw, detection, phase }, showMotionZones, showMotionRaw, showDetections, showPhaseIndicator, }: DetectionOverlayProps): import("react").JSX.Element | null;
+export declare function DetectionOverlay({ detections: { motion, motionRaw, detection, phase }, showMotionZones, showMotionRaw, showDetections, showMoving, showStationary, showPhaseIndicator, }: DetectionOverlayProps): import("react").JSX.Element | null;

package/dist/index.cjs

@@ -27875,10 +27875,24 @@ function getPhaseVisual(phase) {
 * Pure component — receives all data via props. Use with useDeviceDetections hook.
 * Positioned absolute inside a relative parent (e.g., video container).
 */
-function DetectionOverlay({ detections: { motion, motionRaw, detection, phase }, showMotionZones = true, showMotionRaw = true, showDetections = true, showPhaseIndicator = true }) {
+/**
+* Whether the tracker has said this subject is not going anywhere.
+*
+* The verdict is the tracker's `TrackState`, and `idle` is its word for still —
+* the SAME field the evidence ledger judges an observation on (D494), so the
+* overlay and the registry can never disagree about one box. An ABSENT verdict
+* is NOT still: the tracker needs ~10 s to settle on `idle`, and treating "no
+* verdict yet" as still would file every new subject under the wrong switch for
+* its first seconds.
+*/
+function isStill(d) {
+	return d.track?.movementState === "idle";
+}
+function DetectionOverlay({ detections: { motion, motionRaw, detection, phase }, showMotionZones = true, showMotionRaw = true, showDetections = true, showMoving = true, showStationary = true, showPhaseIndicator = true }) {
 	const hasMotion = showMotionZones && motion && motion.zones.length > 0;
 	const hasMotionRaw = showMotionRaw && motionRaw && motionRaw.boxes.length > 0;
-	const hasDets = showDetections && detection && detection.detections.length > 0;
+	const visibleDets = showDetections && detection ? detection.detections.filter((d) => isStill(d) ? showStationary : showMoving) : [];
+	const hasDets = visibleDets.length > 0;
 	if (!hasMotion && !hasMotionRaw && !hasDets && !showPhaseIndicator) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "absolute inset-0 pointer-events-none z-10",
@@ -27887,7 +27901,7 @@ function DetectionOverlay({ detections: { motion, motionRaw, detection, phase },
 			hasMotionRaw && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MotionRawBoxes, { raw: motionRaw }),
 			hasMotion && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MotionZones, { motion }),
 			hasDets && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DetectionBoxes, {
-				detections: detection.detections,
+				detections: visibleDets,
 				frameWidth: detection.frameWidth,
 				frameHeight: detection.frameHeight
 			})
@@ -48927,6 +48941,8 @@ function StreamPanel({ serverUrl, createSession, sendAnswer, handleOffer, getIce
 	const recordedPlayback = useRecordedPlayback();
 	const [isPlaying, setIsPlaying] = (0, react$1.useState)(autoPlay);
 	const [showDetections, setShowDetections] = (0, react$1.useState)(defaultShowDetections);
+	const [showMoving, setShowMoving] = (0, react$1.useState)(true);
+	const [showStationary, setShowStationary] = (0, react$1.useState)(true);
 	const [showMotion, setShowMotion] = (0, react$1.useState)(defaultShowMotion);
 	const [internalStreamId, setInternalStreamId] = (0, react$1.useState)(null);
 	const [vodQuality, setVodQuality] = (0, react$1.useState)([]);
@@ -49182,15 +49198,27 @@ function StreamPanel({ serverUrl, createSession, sendAnswer, handleOffer, getIce
 											})
 										]
 									}),
-									hasDetections && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuToggle, {
-										label: "Show detections",
-										active: showDetections,
-										onClick: () => setShowDetections((v) => !v)
-									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuToggle, {
-										label: "Show motion",
-										active: showMotion,
-										onClick: () => setShowMotion((v) => !v)
-									})] }),
+									hasDetections && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuToggle, {
+											label: "Show detections",
+											active: showDetections,
+											onClick: () => setShowDetections((v) => !v)
+										}),
+										showDetections && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuToggle, {
+											label: "…moving",
+											active: showMoving,
+											onClick: () => setShowMoving((v) => !v)
+										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuToggle, {
+											label: "…stationary",
+											active: showStationary,
+											onClick: () => setShowStationary((v) => !v)
+										})] }),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuToggle, {
+											label: "Show motion",
+											active: showMotion,
+											onClick: () => setShowMotion((v) => !v)
+										})
+									] }),
 									ptzAvailable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MenuToggle, {
 										label: "PTZ controls",
 										active: ptzShown,
@@ -49238,7 +49266,9 @@ function StreamPanel({ serverUrl, createSession, sendAnswer, handleOffer, getIce
 							showPhaseIndicator: false,
 							showMotionZones: showMotion,
 							showMotionRaw: showMotion,
-							showDetections
+							showDetections,
+							showMoving,
+							showStationary
 						}),
 						extraOverlay,
 						ptzOverlayVisible && ptzOverlay

package/dist/index.js

@@ -27851,10 +27851,24 @@ function getPhaseVisual(phase) {
 * Pure component — receives all data via props. Use with useDeviceDetections hook.
 * Positioned absolute inside a relative parent (e.g., video container).
 */
-function DetectionOverlay({ detections: { motion, motionRaw, detection, phase }, showMotionZones = true, showMotionRaw = true, showDetections = true, showPhaseIndicator = true }) {
+/**
+* Whether the tracker has said this subject is not going anywhere.
+*
+* The verdict is the tracker's `TrackState`, and `idle` is its word for still —
+* the SAME field the evidence ledger judges an observation on (D494), so the
+* overlay and the registry can never disagree about one box. An ABSENT verdict
+* is NOT still: the tracker needs ~10 s to settle on `idle`, and treating "no
+* verdict yet" as still would file every new subject under the wrong switch for
+* its first seconds.
+*/
+function isStill(d) {
+	return d.track?.movementState === "idle";
+}
+function DetectionOverlay({ detections: { motion, motionRaw, detection, phase }, showMotionZones = true, showMotionRaw = true, showDetections = true, showMoving = true, showStationary = true, showPhaseIndicator = true }) {
 	const hasMotion = showMotionZones && motion && motion.zones.length > 0;
 	const hasMotionRaw = showMotionRaw && motionRaw && motionRaw.boxes.length > 0;
-	const hasDets = showDetections && detection && detection.detections.length > 0;
+	const visibleDets = showDetections && detection ? detection.detections.filter((d) => isStill(d) ? showStationary : showMoving) : [];
+	const hasDets = visibleDets.length > 0;
 	if (!hasMotion && !hasMotionRaw && !hasDets && !showPhaseIndicator) return null;
 	return /* @__PURE__ */ jsxs("div", {
 		className: "absolute inset-0 pointer-events-none z-10",
@@ -27863,7 +27877,7 @@ function DetectionOverlay({ detections: { motion, motionRaw, detection, phase },
 			hasMotionRaw && /* @__PURE__ */ jsx(MotionRawBoxes, { raw: motionRaw }),
 			hasMotion && /* @__PURE__ */ jsx(MotionZones, { motion }),
 			hasDets && /* @__PURE__ */ jsx(DetectionBoxes, {
-				detections: detection.detections,
+				detections: visibleDets,
 				frameWidth: detection.frameWidth,
 				frameHeight: detection.frameHeight
 			})
@@ -48903,6 +48917,8 @@ function StreamPanel({ serverUrl, createSession, sendAnswer, handleOffer, getIce
 	const recordedPlayback = useRecordedPlayback();
 	const [isPlaying, setIsPlaying] = useState(autoPlay);
 	const [showDetections, setShowDetections] = useState(defaultShowDetections);
+	const [showMoving, setShowMoving] = useState(true);
+	const [showStationary, setShowStationary] = useState(true);
 	const [showMotion, setShowMotion] = useState(defaultShowMotion);
 	const [internalStreamId, setInternalStreamId] = useState(null);
 	const [vodQuality, setVodQuality] = useState([]);
@@ -49158,15 +49174,27 @@ function StreamPanel({ serverUrl, createSession, sendAnswer, handleOffer, getIce
 											})
 										]
 									}),
-									hasDetections && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(MenuToggle, {
-										label: "Show detections",
-										active: showDetections,
-										onClick: () => setShowDetections((v) => !v)
-									}), /* @__PURE__ */ jsx(MenuToggle, {
-										label: "Show motion",
-										active: showMotion,
-										onClick: () => setShowMotion((v) => !v)
-									})] }),
+									hasDetections && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+										/* @__PURE__ */ jsx(MenuToggle, {
+											label: "Show detections",
+											active: showDetections,
+											onClick: () => setShowDetections((v) => !v)
+										}),
+										showDetections && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(MenuToggle, {
+											label: "…moving",
+											active: showMoving,
+											onClick: () => setShowMoving((v) => !v)
+										}), /* @__PURE__ */ jsx(MenuToggle, {
+											label: "…stationary",
+											active: showStationary,
+											onClick: () => setShowStationary((v) => !v)
+										})] }),
+										/* @__PURE__ */ jsx(MenuToggle, {
+											label: "Show motion",
+											active: showMotion,
+											onClick: () => setShowMotion((v) => !v)
+										})
+									] }),
 									ptzAvailable && /* @__PURE__ */ jsx(MenuToggle, {
 										label: "PTZ controls",
 										active: ptzShown,
@@ -49214,7 +49242,9 @@ function StreamPanel({ serverUrl, createSession, sendAnswer, handleOffer, getIce
 							showPhaseIndicator: false,
 							showMotionZones: showMotion,
 							showMotionRaw: showMotion,
-							showDetections
+							showDetections,
+							showMoving,
+							showStationary
 						}),
 						extraOverlay,
 						ptzOverlayVisible && ptzOverlay

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@camstack/ui-library",
-  "version": "1.2.159",
+  "version": "1.2.161",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",