@procaaso/alphinity-ui-components 1.11.0 → 1.13.0

package/dist/index.d.ts

@@ -1,16 +1,16 @@
-import * as react from 'react';
-import react__default from 'react';
+import * as React$1 from 'react';
+import React__default from 'react';
 import * as _emotion_styled from '@emotion/styled';
 import * as _emotion_react from '@emotion/react';
 import * as _mui_system from '@mui/system';
 import * as _mui_material from '@mui/material';
 import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
 
-interface ButtonProps extends react__default.ButtonHTMLAttributes<HTMLButtonElement> {
+interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: 'primary' | 'secondary';
-    children: react__default.ReactNode;
+    children: React__default.ReactNode;
 }
-declare const Button: react__default.FC<ButtonProps>;
+declare const Button: React__default.FC<ButtonProps>;
 
 interface SelectorOption {
     /** Unique value for the option */
@@ -22,7 +22,7 @@ interface SelectorOption {
     /** Optional description for tooltip or additional context */
     description?: string;
 }
-interface SelectorProps extends Omit<react__default.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+interface SelectorProps extends Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /** Currently selected value */
     value: string;
     /** Callback when selection changes */
@@ -42,12 +42,17 @@ interface SelectorProps extends Omit<react__default.HTMLAttributes<HTMLDivElemen
     /** Whether the dropdown should open upward */
     dropdownUp?: boolean;
 }
-declare const Selector: react__default.FC<SelectorProps>;
+declare const Selector: React__default.FC<SelectorProps>;
 
 /**
- * Status levels for telemetry values
+ * Status levels for telemetry values.
+ *
+ * `unknown` marks a value the backend does not trust. OPC UA publishes this
+ * condition as StatusCode severity Bad. This library never derives `unknown`
+ * from a number or a threshold. This library only displays an `unknown`
+ * value that the backend has already published.
  */
-type TelemetryStatus$1 = 'normal' | 'warning' | 'alarm' | 'fault' | 'off';
+type TelemetryStatus$1 = 'normal' | 'warning' | 'alarm' | 'fault' | 'off' | 'unknown';
 /**
  * Marks a value as a maintenance force rather than a measured reading
  * (alphinity-tffi issue #3607, unit U11). A forced value is a deliberate
@@ -171,6 +176,7 @@ interface TelemetryBinding {
         alarm?: string;
         fault?: string;
         off?: string;
+        unknown?: string;
     };
     /** Display configuration */
     display?: {
@@ -225,7 +231,7 @@ interface ModeConfig {
     /** Precision for second setpoint */
     secondPrecision?: number;
 }
-interface ControlPanelProps extends react__default.HTMLAttributes<HTMLDivElement> {
+interface ControlPanelProps extends React__default.HTMLAttributes<HTMLDivElement> {
     /** Panel title/identifier */
     title: string;
     /** Currently selected mode */
@@ -310,14 +316,26 @@ interface ControlPanelProps extends react__default.HTMLAttributes<HTMLDivElement
     /** Custom stop button text */
     stopButtonText?: string;
 }
-declare const ControlPanel: react__default.FC<ControlPanelProps>;
+declare const ControlPanel: React__default.FC<ControlPanelProps>;
 
-interface StatusIndicatorProps extends react__default.HTMLAttributes<HTMLDivElement> {
-    /** Status state determining color and behavior */
-    status: 'off' | 'normal' | 'alarm' | 'warning' | 'active' | 'fault';
+interface StatusIndicatorProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Status state determining color and behavior.
+     *
+     * `unknown` marks a value the backend does not trust. Set `unknown` only
+     * from a published bad-quality read. Do not derive `unknown` from a number
+     * or a threshold in this component.
+     */
+    status: 'off' | 'normal' | 'alarm' | 'warning' | 'active' | 'fault' | 'unknown';
     /** Size of the indicator */
     size?: 'small' | 'medium' | 'large';
-    /** Animation behavior */
+    /**
+     * Animation behavior. Default is `none`.
+     *
+     * ISA-18.2 reserves blinking for an unacknowledged alarm. The `unknown`
+     * status does not clamp this prop to `none`. Pass `animation` only when
+     * the alarm state of the point needs it.
+     */
     animation?: 'none' | 'pulse' | 'blink' | 'flash';
     /** Label text to display next to indicator */
     label?: string;
@@ -346,9 +364,9 @@ interface StatusIndicatorProps extends react__default.HTMLAttributes<HTMLDivElem
      */
     realValue?: string;
 }
-declare const StatusIndicator: react__default.FC<StatusIndicatorProps>;
+declare const StatusIndicator: React__default.FC<StatusIndicatorProps>;
 
-interface ValueEntryProps extends Omit<react__default.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
+interface ValueEntryProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
     /** Current value */
     value: number | string;
     /** Callback when value changes */
@@ -383,9 +401,9 @@ interface ValueEntryProps extends Omit<react__default.InputHTMLAttributes<HTMLIn
      */
     realValue?: number | string;
 }
-declare const ValueEntry: react__default.FC<ValueEntryProps>;
+declare const ValueEntry: React__default.FC<ValueEntryProps>;
 
-interface LegacyValueEntryProps extends Omit<react__default.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
+interface LegacyValueEntryProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
     /** Current value */
     value: number | string;
     /** Callback when value changes */
@@ -417,7 +435,7 @@ interface LegacyValueEntryProps extends Omit<react__default.InputHTMLAttributes<
      */
     realValue?: number | string;
 }
-declare const LegacyValueEntry: react__default.FC<LegacyValueEntryProps>;
+declare const LegacyValueEntry: React__default.FC<LegacyValueEntryProps>;
 
 interface NodeControlConfig {
     /** Node ID */
@@ -461,7 +479,7 @@ interface NodeControlConfig {
     /** Whether setpoint is read-only */
     readOnly?: boolean;
 }
-interface NodeControlsPanelProps extends react__default.HTMLAttributes<HTMLDivElement> {
+interface NodeControlsPanelProps extends React__default.HTMLAttributes<HTMLDivElement> {
     /** Control configuration for the selected node */
     config: NodeControlConfig | null;
     /** Callback to close the panel */
@@ -480,7 +498,7 @@ interface NodeControlsPanelProps extends react__default.HTMLAttributes<HTMLDivEl
  * - Clear visual feedback
  * - Bottom or side slide-in animation
  */
-declare const NodeControlsPanel: react__default.FC<NodeControlsPanelProps>;
+declare const NodeControlsPanel: React__default.FC<NodeControlsPanelProps>;
 
 /**
  * A custom action button rendered in the device control panel (e.g. Tare, Zero).
@@ -587,8 +605,12 @@ interface ControlState {
     isRunning?: boolean;
     /** Is device in alarm state? */
     hasAlarm?: boolean;
-    /** Current status */
-    status?: 'normal' | 'warning' | 'alarm' | 'fault' | 'off' | 'starting' | 'stopping';
+    /**
+     * Current status. `unknown` marks an untrusted read (OPC UA StatusCode
+     * severity Bad). This library never infers `unknown`; it only displays a
+     * value the backend has already published as `unknown`.
+     */
+    status?: 'normal' | 'warning' | 'alarm' | 'fault' | 'off' | 'starting' | 'stopping' | 'unknown';
     /** Status message */
     statusMessage?: string;
     /** Last command timestamp */
@@ -676,6 +698,7 @@ interface DeviceControlBinding {
             off?: string;
             starting?: string;
             stopping?: string;
+            unknown?: string;
         };
     };
 }
@@ -795,9 +818,9 @@ interface DeviceControlPanelProps {
  * its live values move, so the memo bails only on genuinely idle ticks - the
  * win is proportional to how often values are flat at display precision.
  */
-declare function DeviceControlPanelImpl({ binding, onClose, position, align, touchOptimized, compact, fontScale, maxHeight, maxWidth, toastDuration, onModeChange, onParameterChange, onParameterActivate, onStart, onStop, startPending, stopPending, onCustomAction, onOpenConfig, showConfigButton, onUndock, undockIcon, modeSelectionStyle, showBuiltInToast, embedded, }: DeviceControlPanelProps): react__default.JSX.Element | null;
+declare function DeviceControlPanelImpl({ binding, onClose, position, align, touchOptimized, compact, fontScale, maxHeight, maxWidth, toastDuration, onModeChange, onParameterChange, onParameterActivate, onStart, onStop, startPending, stopPending, onCustomAction, onOpenConfig, showConfigButton, onUndock, undockIcon, modeSelectionStyle, showBuiltInToast, embedded, }: DeviceControlPanelProps): React__default.JSX.Element | null;
 /** Memo boundary - see DeviceControlPanelImpl doc comment (kiosk heap-leak fix). */
-declare const DeviceControlPanel: react__default.MemoExoticComponent<typeof DeviceControlPanelImpl>;
+declare const DeviceControlPanel: React__default.MemoExoticComponent<typeof DeviceControlPanelImpl>;
 
 interface NumpadDialogProps {
     /** Whether the dialog is open */
@@ -846,7 +869,7 @@ interface NumpadDialogProps {
  * out-of-range values are rejected (never silently clamped). The field pre-fills
  * with the current value so an operator never blind-zeroes a live setpoint.
  */
-declare const NumpadDialog: react__default.FC<NumpadDialogProps>;
+declare const NumpadDialog: React__default.FC<NumpadDialogProps>;
 
 type DisplayMode = 'standard' | 'dashboard';
 interface FullscreenContainerProps {
@@ -857,9 +880,9 @@ type OverlayTheme = 'tank' | 'pressure' | 'vessel' | 'flow';
 interface SVGLockedOverlayProps {
     svgX: number;
     svgY: number;
-    children: react__default.ReactNode;
+    children: React__default.ReactNode;
     theme?: OverlayTheme;
-    style?: react__default.CSSProperties;
+    style?: React__default.CSSProperties;
     className?: string;
     onClick?: () => void;
     containerSelector?: string;
@@ -931,7 +954,7 @@ interface EquipmentIndicatorProps {
     color: string;
     label: string;
     size?: number;
-    style?: react__default.CSSProperties;
+    style?: React__default.CSSProperties;
     className?: string;
     /**
      * True when this equipment's state is a maintenance force, not a measured
@@ -943,14 +966,14 @@ interface EquipmentIndicatorProps {
 interface FullscreenWorkspaceTab {
     label: string;
     value: string;
-    content: react__default.ReactNode;
-}
-interface FullscreenWorkspaceProps extends react__default.HTMLAttributes<HTMLDivElement> {
-    svgContent: react__default.ReactNode;
-    overlays?: react__default.ReactNode;
-    leftPanel?: react__default.ReactNode;
-    rightPanel?: react__default.ReactNode;
-    footer?: react__default.ReactNode;
+    content: React__default.ReactNode;
+}
+interface FullscreenWorkspaceProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    svgContent: React__default.ReactNode;
+    overlays?: React__default.ReactNode;
+    leftPanel?: React__default.ReactNode;
+    rightPanel?: React__default.ReactNode;
+    footer?: React__default.ReactNode;
     tabs?: FullscreenWorkspaceTab[];
     activeTab?: string;
     onTabChange?: (value: string) => void;
@@ -971,60 +994,60 @@ interface FullscreenWorkspaceProps extends react__default.HTMLAttributes<HTMLDiv
     zoomDisabled?: boolean;
 }
 
-declare const FullscreenContainer: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
+declare const FullscreenContainer: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
     theme?: _emotion_react.Theme;
 } & FullscreenContainerProps, {}, {}>;
-declare const LeftPanel: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
+declare const LeftPanel: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
     theme?: _emotion_react.Theme;
 } & {
     collapsed: boolean;
 }, {}, {}>;
-declare const RightPanel: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
+declare const RightPanel: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
     theme?: _emotion_react.Theme;
 } & {
     collapsed: boolean;
 }, {}, {}>;
-declare const SVGArea: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
+declare const SVGArea: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
-declare const LeftToggleButton: _emotion_styled.StyledComponent<_mui_material.IconButtonOwnProps & Omit<_mui_material.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "className" | "disabled" | "style" | "tabIndex" | "color" | "size" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loading" | "loadingIndicator"> & {
+declare const LeftToggleButton: _emotion_styled.StyledComponent<_mui_material.IconButtonOwnProps & Omit<_mui_material.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<React$1.DetailedHTMLProps<React$1.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "className" | "disabled" | "style" | "tabIndex" | "color" | "size" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loading" | "loadingIndicator"> & {
     theme?: _emotion_react.Theme;
 } & {
     collapsed: boolean;
 }, {}, {}>;
-declare const RightToggleButton: _emotion_styled.StyledComponent<_mui_material.IconButtonOwnProps & Omit<_mui_material.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "className" | "disabled" | "style" | "tabIndex" | "color" | "size" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loading" | "loadingIndicator"> & {
+declare const RightToggleButton: _emotion_styled.StyledComponent<_mui_material.IconButtonOwnProps & Omit<_mui_material.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<React$1.DetailedHTMLProps<React$1.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "className" | "disabled" | "style" | "tabIndex" | "color" | "size" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loading" | "loadingIndicator"> & {
     theme?: _emotion_react.Theme;
 } & {
     collapsed: boolean;
 }, {}, {}>;
-declare const DisplayModeToggle: _emotion_styled.StyledComponent<_mui_material.IconButtonOwnProps & Omit<_mui_material.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "className" | "disabled" | "style" | "tabIndex" | "color" | "size" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loading" | "loadingIndicator"> & {
+declare const DisplayModeToggle: _emotion_styled.StyledComponent<_mui_material.IconButtonOwnProps & Omit<_mui_material.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<React$1.DetailedHTMLProps<React$1.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "className" | "disabled" | "style" | "tabIndex" | "color" | "size" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loading" | "loadingIndicator"> & {
     theme?: _emotion_react.Theme;
 } & {
     mode: DisplayMode;
 }, {}, {}>;
-declare const ZoomControls: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
+declare const ZoomControls: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
-declare const ZoomButton: _emotion_styled.StyledComponent<_mui_material.IconButtonOwnProps & Omit<_mui_material.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "className" | "disabled" | "style" | "tabIndex" | "color" | "size" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loading" | "loadingIndicator"> & {
+declare const ZoomButton: _emotion_styled.StyledComponent<_mui_material.IconButtonOwnProps & Omit<_mui_material.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<React$1.DetailedHTMLProps<React$1.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children" | "className" | "disabled" | "style" | "tabIndex" | "color" | "size" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loading" | "loadingIndicator"> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
-declare const FooterPanel: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
+declare const FooterPanel: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
-declare const PanelTabs: _emotion_styled.StyledComponent<_mui_material.TabsOwnProps & _mui_material_OverridableComponent.CommonProps & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "variant" | "children" | "className" | "value" | "style" | "aria-label" | "aria-labelledby" | "onChange" | "sx" | "classes" | "action" | "allowScrollButtonsMobile" | "centered" | "indicatorColor" | "orientation" | "ScrollButtonComponent" | "scrollButtons" | "selectionFollowsFocus" | "TabIndicatorProps" | "TabScrollButtonProps" | "textColor" | "visibleScrollbar" | "slots" | "slotProps"> & {
+declare const PanelTabs: _emotion_styled.StyledComponent<_mui_material.TabsOwnProps & _mui_material_OverridableComponent.CommonProps & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "variant" | "children" | "className" | "value" | "style" | "aria-label" | "aria-labelledby" | "onChange" | "orientation" | "sx" | "classes" | "action" | "allowScrollButtonsMobile" | "centered" | "indicatorColor" | "ScrollButtonComponent" | "scrollButtons" | "selectionFollowsFocus" | "TabIndicatorProps" | "TabScrollButtonProps" | "textColor" | "visibleScrollbar" | "slots" | "slotProps"> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
-declare const PanelContent: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
+declare const PanelContent: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
 declare const FixedSVGContainer: _emotion_styled.StyledComponent<{
     theme?: _emotion_react.Theme;
     as?: React.ElementType;
-}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 declare const ScrollableSVGWrapper: _emotion_styled.StyledComponent<{
     theme?: _emotion_react.Theme;
     as?: React.ElementType;
-}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 
 declare const baseOverlayStyles: {
     readonly tank: {
@@ -1077,8 +1100,8 @@ declare const baseOverlayStyles: {
     };
 };
 declare const overlayStyles: Record<OverlayTheme, typeof baseOverlayStyles[OverlayTheme]>;
-declare const SVGLockedOverlay: ({ svgX, svgY, children, theme, style, className, onClick, containerSelector, }: SVGLockedOverlayProps) => react.JSX.Element;
-declare const DashboardCard: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
+declare const SVGLockedOverlay: ({ svgX, svgY, children, theme, style, className, onClick, containerSelector, }: SVGLockedOverlayProps) => React$1.JSX.Element;
+declare const DashboardCard: _emotion_styled.StyledComponent<_mui_system.BoxOwnProps<_mui_material.Theme> & Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof _mui_system.BoxOwnProps<_mui_material.Theme>> & {
     theme?: _emotion_react.Theme;
 } & {
     svgX: number;
@@ -1090,23 +1113,23 @@ declare const CardHeader: _emotion_styled.StyledComponent<{
     as?: React.ElementType;
 } & {
     color?: string;
-}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 declare const CardValue: _emotion_styled.StyledComponent<{
     theme?: _emotion_react.Theme;
     as?: React.ElementType;
-}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 declare const CardUnit: _emotion_styled.StyledComponent<{
     theme?: _emotion_react.Theme;
     as?: React.ElementType;
-}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 
-declare const TrendLine: ({ values, width, height, color, strokeWidth, backgroundColor, forced, }: TrendLineProps) => react.JSX.Element;
-declare const CircularGauge: ({ value, max, unit, label, size, color, forced, realValue, }: CircularGaugeProps) => react.JSX.Element;
-declare const Sparkline: ({ data, width, height, color, forced }: SparklineProps) => react.JSX.Element | null;
-declare const EquipmentIndicatorWithSparkline: ({ svgX, svgY, color, label, size, sparklineData, sparklineOffset, forced, }: EquipmentIndicatorWithSparklineProps) => react.JSX.Element;
-declare const EquipmentIndicator: ({ svgX, svgY, color, label, size, style, className, forced, }: EquipmentIndicatorProps) => react.JSX.Element;
+declare const TrendLine: ({ values, width, height, color, strokeWidth, backgroundColor, forced, }: TrendLineProps) => React$1.JSX.Element;
+declare const CircularGauge: ({ value, max, unit, label, size, color, forced, realValue, }: CircularGaugeProps) => React$1.JSX.Element;
+declare const Sparkline: ({ data, width, height, color, forced }: SparklineProps) => React$1.JSX.Element | null;
+declare const EquipmentIndicatorWithSparkline: ({ svgX, svgY, color, label, size, sparklineData, sparklineOffset, forced, }: EquipmentIndicatorWithSparklineProps) => React$1.JSX.Element;
+declare const EquipmentIndicator: ({ svgX, svgY, color, label, size, style, className, forced, }: EquipmentIndicatorProps) => React$1.JSX.Element;
 
-declare function FullscreenWorkspace({ svgContent, overlays, leftPanel, rightPanel, footer, tabs, activeTab, onTabChange, defaultLeftCollapsed, defaultRightCollapsed, leftCollapsed: leftCollapsedProp, rightCollapsed: rightCollapsedProp, onLeftCollapseChange, onRightCollapseChange, displayMode, defaultDisplayMode, onDisplayModeChange, showDisplayModeToggle, showZoomControls, onZoomIn, onZoomOut, onResetZoom, zoomDisabled, className, ...rest }: FullscreenWorkspaceProps): react__default.ReactElement;
+declare function FullscreenWorkspace({ svgContent, overlays, leftPanel, rightPanel, footer, tabs, activeTab, onTabChange, defaultLeftCollapsed, defaultRightCollapsed, leftCollapsed: leftCollapsedProp, rightCollapsed: rightCollapsedProp, onLeftCollapseChange, onRightCollapseChange, displayMode, defaultDisplayMode, onDisplayModeChange, showDisplayModeToggle, showZoomControls, onZoomIn, onZoomOut, onResetZoom, zoomDisabled, className, ...rest }: FullscreenWorkspaceProps): React__default.ReactElement;
 
 type Theme = 'modern' | 'hmi';
 interface ThemeContextType {
@@ -1116,17 +1139,17 @@ interface ThemeContextType {
 }
 declare const useTheme: () => ThemeContextType;
 interface ThemeProviderProps {
-    children: react__default.ReactNode;
+    children: React__default.ReactNode;
 }
-declare const ThemeProvider: react__default.FC<ThemeProviderProps>;
+declare const ThemeProvider: React__default.FC<ThemeProviderProps>;
 
-interface ThemeToggleProps extends react__default.HTMLAttributes<HTMLDivElement> {
+interface ThemeToggleProps extends React__default.HTMLAttributes<HTMLDivElement> {
     /** Size of the toggle */
     size?: 'small' | 'medium' | 'large';
     /** Position of the toggle */
     position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'inline';
 }
-declare const ThemeToggle: react__default.FC<ThemeToggleProps>;
+declare const ThemeToggle: React__default.FC<ThemeToggleProps>;
 
 /**
  * ISA-101 High Performance HMI — Unified Status Color System
@@ -1135,8 +1158,15 @@ declare const ThemeToggle: react__default.FC<ThemeToggleProps>;
  * Used by NodeRenderer (SVG fill/stroke), DeviceControlPanel (status indicator),
  * and DataOverlay (telemetry badge).
  */
-/** Canonical device status vocabulary */
-type DeviceStatus = 'normal' | 'warning' | 'alarm' | 'fault' | 'off' | 'starting' | 'stopping';
+/**
+ * Canonical device status vocabulary.
+ *
+ * `unknown` marks a value the backend does not trust. OPC UA publishes this
+ * condition as StatusCode severity Bad. The library never derives `unknown`
+ * from a number or a threshold. The library only displays an `unknown` value
+ * that the backend has already published.
+ */
+type DeviceStatus = 'normal' | 'warning' | 'alarm' | 'fault' | 'off' | 'starting' | 'stopping' | 'unknown';
 /** Color entry covering both SVG node and overlay/panel needs */
 interface StatusColorEntry {
     /** Fill color for SVG node symbols */
@@ -1152,6 +1182,43 @@ interface StatusColorEntry {
 }
 /** Partial map for consumer overrides — only specify statuses you want to change */
 type StatusColorMap = Partial<Record<DeviceStatus, Partial<StatusColorEntry>>>;
+/**
+ * The ISA unknown token, shared with the consuming application.
+ *
+ * The same token already marks an untrusted value on the consumer's Sidebar
+ * and Interlocks screens. The library reuses it so one meaning has one
+ * appearance across both products. See views-library issue #27.
+ *
+ * The library uses this one token for both unknown triggers: a node with
+ * `status: 'unknown'` (an untrusted device) and a node with
+ * `positionUnknown: true` (a disclaimed position). Both mean that the system
+ * cannot confirm the state, so both get the same appearance.
+ *
+ * The hatch carries the meaning, not the fill. The flat `bg` sits a CIEDE2000
+ * delta-E of 0.45 from the `off` fill after greyscale conversion, so the fill
+ * alone cannot separate an untrusted device from a confirmed-off one. Any
+ * surface that uses this token must also carry the hatch or a glyph.
+ *
+ * The hue is deliberate. Periwinkle at hue 240 sits between override violet
+ * and interaction blue, so an operator cannot confuse the three.
+ */
+declare const ISA_UNKNOWN: {
+    readonly fg: "#4f4f8a";
+    readonly bg: "#ebebf5";
+    readonly border: "#8f8fc2";
+};
+/**
+ * The dark-theme counterpart of `ISA_UNKNOWN`.
+ *
+ * `DEFAULT_STATUS_COLORS` carries the light values. Wiring a theme switch is
+ * not part of this change; the constant exists so a consumer and a later
+ * change can use the agreed values rather than inventing new ones.
+ */
+declare const ISA_UNKNOWN_DARK: {
+    readonly fg: "#b9bbdb";
+    readonly bg: "#23263a";
+    readonly border: "#6f74a3";
+};
 /**
  * ISA-101 defaults.
  *
@@ -1162,6 +1229,20 @@ type StatusColorMap = Partial<Record<DeviceStatus, Partial<StatusColorEntry>>>;
  * - off:      light grey (matches canvas default #edeeef)
  * - starting: light green (transitional)
  * - stopping: amber (transitional)
+ * - unknown:  periwinkle (untrusted read; OPC UA severity Bad). Derived
+ *             from ISA_UNKNOWN above, the shared token.
+ *
+ * The unknown entry deliberately does NOT rely on its fill. The flat fill
+ * sits a CIEDE2000 delta-E of 0.45 from the off fill after greyscale
+ * conversion, so the two are indistinguishable without colour.
+ *
+ * Every unknown surface therefore carries a second channel that does not
+ * depend on colour. Fixed-layout surfaces add a glyph. The P&ID symbol adds
+ * a hatch. A surface that shows this fill alone reproduces the defect the
+ * unknown status exists to close.
+ *
+ * This palette is not fully greyscale-separable: normal and alarm sit 1.6
+ * apart. That is why unknown never relies on colour anywhere.
  */
 declare const DEFAULT_STATUS_COLORS: Record<DeviceStatus, StatusColorEntry>;
 /**
@@ -1176,17 +1257,15 @@ declare const DEFAULT_STATUS_COLORS: Record<DeviceStatus, StatusColorEntry>;
  */
 declare const FORCED_MARK_COLOR: StatusColorEntry;
 /**
- * Position-unknown marking color (views-library #27). Deliberately outside
- * DEFAULT_STATUS_COLORS, for the same reason as FORCED_MARK_COLOR: a device
- * whose position the control system has disclaimed is not a health status,
- * and must not compete with warning/alarm/fault. Values match the consuming
- * HMI ISA token module (light theme).
+ * Normalize a status string to its canonical `DeviceStatus` key.
  *
- * `fill` is the pattern background, `text` is the hatch line color.
+ * The function lowercases the value and follows `STATUS_ALIASES`. Every
+ * caller that must decide "is this status X?" uses this function. A caller
+ * that compares a raw string instead can disagree with `resolveStatusColor`
+ * once an alias changes, which would let one surface paint a status the
+ * other surface does not recognise.
  */
-declare const UNKNOWN_MARK_COLOR: StatusColorEntry;
-/** Dark-theme values for UNKNOWN_MARK_COLOR. */
-declare const UNKNOWN_MARK_COLOR_DARK: StatusColorEntry;
+declare function normalizeDeviceStatus(status: string | undefined): DeviceStatus;
 /**
  * Resolve a status string to a full color entry.
  *
@@ -1195,6 +1274,117 @@ declare const UNKNOWN_MARK_COLOR_DARK: StatusColorEntry;
  */
 declare function resolveStatusColor(status: string | undefined, customMap?: StatusColorMap): StatusColorEntry;
 
+/**
+ * Shared glyph for the `unknown` device status (KTD10).
+ *
+ * `StatusIndicator`, `DataOverlay`, and `DeviceControlPanel` import this one
+ * module. One drawing keeps the marker consistent. An operator learns the
+ * marker once and recognises it on every surface.
+ *
+ * The glyph is a question mark inside a dashed ring. The dashed ring is a
+ * second channel that does not depend on colour. A broken outline reads as
+ * an incomplete circuit.
+ */
+/** Size keys the glyph accepts. These match `StatusIndicator`'s `size` prop. */
+type UnknownGlyphSize = 'small' | 'medium' | 'large';
+/**
+ * CSS custom property that colours the glyph.
+ *
+ * A consumer sets this property on any ancestor to retheme the glyph.
+ * `StatusIndicator` scopes it under the `ui-status-indicator--unknown` class.
+ * The overlay and the control panel carry no such class, so a consumer sets
+ * the property directly on those hosts. The glyph falls back to
+ * `currentColor` when the consumer sets nothing, so the package never has to
+ * ship CSS for it.
+ */
+declare const UNKNOWN_STATUS_GLYPH_COLOR_VAR = "--ui-status-indicator-unknown-glyph-color";
+/**
+ * Dash rhythm of the glyph's ring.
+ *
+ * The P&ID node symbol reuses this value for its own dashed outline. The
+ * canvas cannot host a centred glyph, so it carries the same rhythm on the
+ * symbol outline instead. Sharing the value keeps the two treatments in step.
+ */
+declare const UNKNOWN_GLYPH_RING_DASH: string;
+interface UnknownStatusGlyphProps extends Omit<React__default.SVGProps<SVGSVGElement>, 'children' | 'viewBox'> {
+    /** Size of the glyph. Sets the stroke weight (see `UNKNOWN_GLYPH_STROKE_WEIGHTS`). */
+    size?: UnknownGlyphSize;
+    /**
+     * Counter-rotate the glyph.
+     *
+     * Set this to `true` when the host element applies `transform: rotate(45deg)`,
+     * such as the `diamond` shape in `StatusIndicator`. The glyph then reads
+     * upright instead of inheriting the host rotation.
+     *
+     * The counter-rotation is a fixed -45 degrees. It assumes the 45-degree
+     * rotation that the documented `ui-status-indicator--diamond` rule applies.
+     * A consumer that rotates the host by another angle must not set this flag.
+     */
+    counterRotate?: boolean;
+}
+/**
+ * Renders the `unknown` status glyph as an inline `svg`.
+ *
+ * The glyph carries no CSS class dependency. It needs no stylesheet, so it
+ * survives server-side rendering and needs no CSP nonce (KTD1).
+ *
+ * The `svg` is `aria-hidden` and `focusable="false"`. A separate unit adds
+ * the accessible description.
+ *
+ * Remaining `svg` props pass straight through. An HTML host sizes the glyph
+ * with `style`; an SVG host places it with `x`, `y`, `width`, and `height`,
+ * because a nested `svg` accepts those as user-unit attributes.
+ */
+declare function UnknownStatusGlyph({ size, counterRotate, style, ...rest }: UnknownStatusGlyphProps): React__default.ReactElement;
+
+/**
+ * A corner badge slot on a node (#33).
+ *
+ * A badge marks a condition that is NOT a health severity (`NodeInstance.status`)
+ * and must never replace the node's body color. A device can be tripped AND
+ * blocked at the same time; `status` shows the trip, the badge shows the
+ * block, and both render at once. This is a general slot, not a fixed
+ * prohibition badge: the consumer names the glyph, the colors, the corner,
+ * the size, and the motion. Register additional glyphs with
+ * `registerBadgeGlyph` (`src/diagram/badges`) rather than hardcoding a new
+ * one here.
+ */
+interface NodeBadgeAppearance {
+    /**
+     * Which glyph to draw. `'prohibit'` (a circle with a slash) ships with the
+     * library. The set is extensible: register more with `registerBadgeGlyph`
+     * / `registerBadgeGlyphs` and reference them by id here, the same way
+     * `symbolId` references a registered symbol.
+     */
+    glyph: 'prohibit' | string;
+    /** Glyph color (stroke/fill). Consumer picks; no status-driven default. */
+    color?: string;
+    /** Disc background color behind the glyph. Consumer picks. */
+    backgroundColor?: string;
+    /** Which corner of the node's bounding box the badge anchors to. Defaults to 'top-right'. */
+    corner?: NodeBadgeCorner;
+    /** Badge disc diameter, in the symbol's local SVG units. Defaults to 14. */
+    size?: number;
+    /** Accessible label read by assistive tech (e.g. "Start blocked"). */
+    label?: string;
+}
+type NodeBadgeCorner = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+/**
+ * Motion for a `NodeBadge`. Steady by default. A consumer that turns on
+ * `blink` MUST supply `blinkPeriodMs` - the library has no default period.
+ * TFFi drives its status tower, its batch bar, and this badge off one shared
+ * constant so all three beat together; a period fixed in the library would
+ * break that agreement, so there is deliberately no fallback value here.
+ */
+type NodeBadgeMotion = {
+    blink?: false;
+} | {
+    blink: true;
+    blinkPeriodMs: number;
+};
+/** The full badge: appearance plus motion. This is the type `NodeInstance.badge` carries. */
+type NodeBadge = NodeBadgeAppearance & NodeBadgeMotion;
+
 interface NodeInstance {
     id: string;
     symbolId: string;
@@ -1207,7 +1397,7 @@ interface NodeInstance {
         y: number;
     };
     labelFontSize?: number;
-    status?: 'normal' | 'warning' | 'alarm' | 'fault' | 'off' | 'starting' | 'stopping' | string;
+    status?: 'normal' | 'warning' | 'alarm' | 'fault' | 'off' | 'starting' | 'stopping' | 'unknown' | string;
     customColors?: {
         fill?: string;
         stroke?: string;
@@ -1219,6 +1409,13 @@ interface NodeInstance {
      * symbol. Default off. Wins over status and customColors.
      */
     positionUnknown?: boolean;
+    /**
+     * A corner badge for a condition that is NOT a health severity (#33),
+     * e.g. a device blocked from starting. Stacks on top of `status` /
+     * `customColors` / `positionUnknown` - it never replaces the node's body
+     * color, so a node can show `status: 'fault'` and a badge at once.
+     */
+    badge?: NodeBadge;
     metadata?: Record<string, unknown>;
 }
 interface Transform {
@@ -1487,8 +1684,15 @@ declare function useTelemetry(options?: UseTelemetryOptions): UseTelemetryResult
 interface UseTelemetryStatusOptions {
     /** Whether status sync is enabled (default: true) */
     enabled?: boolean;
-    /** Custom status mapping function */
-    mapStatus?: (telemetryStatus: string) => string;
+    /**
+     * Custom status mapping function.
+     *
+     * A custom mapper replaces the default entirely. It must handle every
+     * member of `TelemetryStatus`, including `unknown`. A mapper that returns
+     * a healthy-looking status for `unknown` reintroduces the defect the
+     * default mapping closes.
+     */
+    mapStatus?: (telemetryStatus: TelemetryStatus$1) => string;
 }
 /**
  * Hook to sync telemetry status to node instance status for dynamic coloring
@@ -1498,6 +1702,7 @@ interface UseTelemetryStatusOptions {
  * - 'warning' → 'warning'
  * - 'alarm' / 'fault' → 'alarm'
  * - 'off' → 'stopped'
+ * - 'unknown' → 'unknown' (untrusted read; must not read as stopped)
  *
  * @param telemetry - Telemetry map from useTelemetry
  * @param diagram - Current diagram state
@@ -1653,13 +1858,13 @@ interface PIDCanvasFeatures {
     /** Background color for canvas (default: '#ffffff') */
     backgroundColor?: string;
 }
-interface PIDCanvasProps extends react__default.HTMLAttributes<HTMLDivElement> {
+interface PIDCanvasProps extends React__default.HTMLAttributes<HTMLDivElement> {
     /** The diagram to render */
     diagram: Diagram;
     /** Optional className for the container */
     className?: string;
     /** Optional inline styles for the container */
-    style?: react__default.CSSProperties;
+    style?: React__default.CSSProperties;
     /** Enable interactive features (pan, zoom, selection, telemetry, dragNodes) */
     features?: PIDCanvasFeatures;
     /** Callback when selection changes */
@@ -1715,20 +1920,20 @@ interface PIDCanvasControls {
  *
  * Future: Editing tools, symbol library UI
  */
-declare function PIDCanvasImpl({ diagram, className, style, features, onSelectionChange, onNodeClick, onPipeClick, onNodeMove, onDiagramChange, onDelete, onItemsCopied, onPaste, onSymbolDrop, onPipeCreated, onMounted, telemetry, statusColorMap, ...props }: PIDCanvasProps): react__default.ReactElement;
+declare function PIDCanvasImpl({ diagram, className, style, features, onSelectionChange, onNodeClick, onPipeClick, onNodeMove, onDiagramChange, onDelete, onItemsCopied, onPaste, onSymbolDrop, onPipeCreated, onMounted, telemetry, statusColorMap, ...props }: PIDCanvasProps): React__default.ReactElement;
 /**
  * Memo boundary - see PIDCanvasImpl doc comment (renderer-OOM fix). Shallow
  * compare: `diagram`, `telemetry`, `features`, `style`, `statusColorMap`, and
  * every callback are compared by identity; hosts that keep them stable skip
  * the full-canvas re-render entirely when unrelated screen state changes.
  */
-declare const PIDCanvas: react__default.MemoExoticComponent<typeof PIDCanvasImpl>;
+declare const PIDCanvas: React__default.MemoExoticComponent<typeof PIDCanvasImpl>;
 
 interface SymbolLibraryProps {
     /** Optional className for styling */
     className?: string;
     /** Callback when a symbol drag starts */
-    onSymbolDragStart?: (symbolId: string, event: react__default.DragEvent) => void;
+    onSymbolDragStart?: (symbolId: string, event: React__default.DragEvent) => void;
     /** Show category filter */
     showCategories?: boolean;
     /** Custom symbol categories */
@@ -1740,7 +1945,7 @@ interface SymbolLibraryProps {
  * Displays available symbols organized by category
  * Supports drag-and-drop to add new nodes to diagrams
  */
-declare function SymbolLibrary({ className, onSymbolDragStart, showCategories, categories, }: SymbolLibraryProps): react__default.ReactElement;
+declare function SymbolLibrary({ className, onSymbolDragStart, showCategories, categories, }: SymbolLibraryProps): React__default.ReactElement;
 
 interface NodeConfigPanelProps {
     /** Selected node to configure */
@@ -1762,7 +1967,7 @@ interface NodeConfigPanelProps {
     /** Additional CSS class name */
     className?: string;
     /** Custom styles */
-    style?: react__default.CSSProperties;
+    style?: React__default.CSSProperties;
 }
 /**
  * NodeConfigPanel - Reusable configuration panel for editing node properties and telemetry
@@ -1778,7 +1983,7 @@ interface NodeConfigPanelProps {
  * />
  * ```
  */
-declare function NodeConfigPanel({ node, binding, onUpdateNode, onUpdateTelemetry, onAddTelemetry, onRemoveTelemetry, availableTags, onRemove, className, style, }: NodeConfigPanelProps): react__default.JSX.Element;
+declare function NodeConfigPanel({ node, binding, onUpdateNode, onUpdateTelemetry, onAddTelemetry, onRemoveTelemetry, availableTags, onRemove, className, style, }: NodeConfigPanelProps): React__default.JSX.Element;
 
 /**
  * Validates a diagram object structure
@@ -1913,6 +2118,36 @@ declare function readAppearanceValue(node: NodeInstance, field: AppearanceField)
 /** Produce the NodeInstance update for a new field value. */
 declare function writeAppearanceValue(node: NodeInstance, field: AppearanceField, value: AppearanceValue): Partial<NodeInstance>;
 
+/**
+ * Registry of badge glyphs for the `NodeBadge` corner slot (#33).
+ *
+ * Mirrors `diagram/symbols/mockSymbolLibrary`'s registration pattern: a
+ * built-in set plus a consumer-registered set, looked up by id. A consumer
+ * calls `registerBadgeGlyph` from its own app code to add a glyph the
+ * library does not ship - the same escape hatch `registerSymbol` already
+ * gives P&ID symbols. This is deliberately NOT a string resolved only
+ * inside the library (the mistake `Overlay.content.component` made, per
+ * #33): the consumer supplies the real markup.
+ */
+interface BadgeGlyphDefinition {
+    /** Id a `NodeBadge.glyph` references. */
+    id: string;
+    /**
+     * Raw SVG markup, drawn centered in a 24x24 local box (0,0 to 24,24).
+     * Use `stroke="currentColor"` / `fill="currentColor"` so the glyph picks
+     * up `NodeBadge.color` - the glyph carries no color of its own, only shape.
+     */
+    svgContent: string;
+}
+/** Register a single custom badge glyph, or replace a built-in one by reusing its id. */
+declare function registerBadgeGlyph(glyph: BadgeGlyphDefinition): void;
+/** Register multiple custom badge glyphs at once. */
+declare function registerBadgeGlyphs(glyphs: BadgeGlyphDefinition[] | Record<string, BadgeGlyphDefinition>): void;
+/** Get a badge glyph definition by id (checks custom glyphs before built-ins). */
+declare function getBadgeGlyph(glyphId: string): BadgeGlyphDefinition | undefined;
+/** List every registered badge glyph id (built-in plus custom). */
+declare function getAvailableBadgeGlyphs(): string[];
+
 /**
  * Telemetry status type
  */
@@ -2287,9 +2522,9 @@ interface DeviceConfigPanelProps {
  * pays off when the host passes identity-stable `binding` and handler props;
  * an unstable host degrades gracefully to the old behavior.
  */
-declare function DeviceConfigPanelImpl({ binding, onClose, onUndock, undockIcon, position, align, touchOptimized, compact, fontScale, maxHeight, maxWidth, toastDuration, onOpenControls, showControlsButton, showBuiltInToast, embedded, }: DeviceConfigPanelProps): react__default.JSX.Element | null;
+declare function DeviceConfigPanelImpl({ binding, onClose, onUndock, undockIcon, position, align, touchOptimized, compact, fontScale, maxHeight, maxWidth, toastDuration, onOpenControls, showControlsButton, showBuiltInToast, embedded, }: DeviceConfigPanelProps): React__default.JSX.Element | null;
 /** Memo boundary - see DeviceConfigPanelImpl doc comment (kiosk heap-leak fix). */
-declare const DeviceConfigPanel: react__default.MemoExoticComponent<typeof DeviceConfigPanelImpl>;
+declare const DeviceConfigPanel: React__default.MemoExoticComponent<typeof DeviceConfigPanelImpl>;
 
 /**
  * Options for simulation behavior
@@ -2329,4 +2564,4 @@ interface SimulationOptions {
  */
 declare function useSimulation(telemetry: TelemetryMap, updateTelemetryBatch: (updates: Array<any>) => void, options?: SimulationOptions): void;
 
-export { type AnchorType, type AppearanceField, type AppearanceFieldKind, type AppearanceTarget, type AppearanceValue, Button, type ButtonProps, COLOR_PRESETS, CardHeader, CardUnit, CardValue, CircularGauge, type CircularGaugeProps, type CommandKind, type ConfigActions, type ConfigDisplay, type ConfigParameter, type ConfigSection, type ConfigState, type ConfigTheme, type ControlCapabilities, type ControlMode, ControlPanel, type ControlPanelProps, type ControlParameter, type ControlState, type CustomAction, DEFAULT_STATUS_COLORS, DEFAULT_THRESHOLDS, DashboardCard, type DataBinding, type DeviceConfigBinding, type DeviceConfigMap, DeviceConfigPanel, type DeviceConfigPanelProps, type DeviceControlBinding, type DeviceControlMap, DeviceControlPanel, type DeviceControlPanelProps, type DeviceStatus, type Diagram, type DiagramMetadata, type DisplayMode, DisplayModeToggle, type DragPoint, type DragState, EquipmentIndicator, type EquipmentIndicatorProps, EquipmentIndicatorWithSparkline, type EquipmentIndicatorWithSparklineProps, FORCED_MARK_COLOR, FixedSVGContainer, FooterPanel, type ForcedState, FullscreenContainer, FullscreenWorkspace, type FullscreenWorkspaceProps, type FullscreenWorkspaceTab, type KeyboardShortcutsOptions, LeftPanel, LeftToggleButton, LegacyValueEntry, type LegacyValueEntryProps, type ModeConfig, NodeConfigPanel, type NodeConfigPanelProps, type NodeControlConfig, NodeControlsPanel, type NodeControlsPanelProps, type NodeInstance, NumpadDialog, type NumpadDialogProps, type Overlay, type OverlayContent, type OverlayTheme, type OverlayType, PIDCanvas, type PIDCanvasControls, type PIDCanvasFeatures, type PIDCanvasProps, PanelContent, PanelTabs, type PipeEdge, type PipeStyle, type Point, type PortDefinition, type PortInstance, type PortType, RightPanel, RightToggleButton, STATUS_LED_APPEARANCE, SVGArea, SVGLockedOverlay, type SVGLockedOverlayProps, type ScalingMetadata, ScrollableSVGWrapper, type SelectionState, Selector, type SelectorOption, type SelectorProps, type SimulationOptions, Sparkline, type SparklineProps, type StatusColorEntry, type StatusColorMap, StatusIndicator, type StatusIndicatorProps, type SymbolCategory, type SymbolDefinition, SymbolLibrary, type SymbolLibraryProps, type SymbolMetadata, type TelemetryBinding, type TelemetryMap, type TelemetryStatus$1 as TelemetryStatus, type TelemetryValue, ThemeProvider, ThemeToggle, type ThemeToggleProps, type Thresholds, type Transform, TrendLine, type TrendLineProps, UNKNOWN_MARK_COLOR, UNKNOWN_MARK_COLOR_DARK, type UseBooleanIndicatorsOptions, type UseDeviceControlsOptions, type UseDragOptions, type UseDragResult, type UseSelectionOptions, type UseSelectionResult, type UseTelemetryOptions, type UseTelemetryResult, type UseTelemetryStatusOptions, type UseViewBoxOptions, type UseViewBoxResult, ValueEntry, type ValueEntryProps, type ViewBox, ZoomButton, ZoomControls, calculateThresholdStatus, createConfigBinding, createControlBinding, exampleDiagram, exportDiagram, generateRoutePoints, getAppearanceDefaults, getAppearanceSchema, getAvailableSymbols, getPortWorldPosition, getSymbolDefinition, importDiagram, mockSymbolLibrary, nodeHasPort, overlayStyles, readAppearanceValue, registerSymbol, registerSymbols, resolvePresetColor, resolveStatusColor, useBooleanIndicators, useDeviceConfigs, useDeviceControls, useDrag, useKeyboardShortcuts, useSelection, useSimulation, useTelemetry, useTelemetryStatus, useTheme, useViewBox, validateDiagram, writeAppearanceValue };
+export { type AnchorType, type AppearanceField, type AppearanceFieldKind, type AppearanceTarget, type AppearanceValue, type BadgeGlyphDefinition, Button, type ButtonProps, COLOR_PRESETS, CardHeader, CardUnit, CardValue, CircularGauge, type CircularGaugeProps, type CommandKind, type ConfigActions, type ConfigDisplay, type ConfigParameter, type ConfigSection, type ConfigState, type ConfigTheme, type ControlCapabilities, type ControlMode, ControlPanel, type ControlPanelProps, type ControlParameter, type ControlState, type CustomAction, DEFAULT_STATUS_COLORS, DEFAULT_THRESHOLDS, DashboardCard, type DataBinding, type DeviceConfigBinding, type DeviceConfigMap, DeviceConfigPanel, type DeviceConfigPanelProps, type DeviceControlBinding, type DeviceControlMap, DeviceControlPanel, type DeviceControlPanelProps, type DeviceStatus, type Diagram, type DiagramMetadata, type DisplayMode, DisplayModeToggle, type DragPoint, type DragState, EquipmentIndicator, type EquipmentIndicatorProps, EquipmentIndicatorWithSparkline, type EquipmentIndicatorWithSparklineProps, FORCED_MARK_COLOR, FixedSVGContainer, FooterPanel, type ForcedState, FullscreenContainer, FullscreenWorkspace, type FullscreenWorkspaceProps, type FullscreenWorkspaceTab, ISA_UNKNOWN, ISA_UNKNOWN_DARK, type KeyboardShortcutsOptions, LeftPanel, LeftToggleButton, LegacyValueEntry, type LegacyValueEntryProps, type ModeConfig, type NodeBadge, type NodeBadgeAppearance, type NodeBadgeCorner, type NodeBadgeMotion, NodeConfigPanel, type NodeConfigPanelProps, type NodeControlConfig, NodeControlsPanel, type NodeControlsPanelProps, type NodeInstance, NumpadDialog, type NumpadDialogProps, type Overlay, type OverlayContent, type OverlayTheme, type OverlayType, PIDCanvas, type PIDCanvasControls, type PIDCanvasFeatures, type PIDCanvasProps, PanelContent, PanelTabs, type PipeEdge, type PipeStyle, type Point, type PortDefinition, type PortInstance, type PortType, RightPanel, RightToggleButton, STATUS_LED_APPEARANCE, SVGArea, SVGLockedOverlay, type SVGLockedOverlayProps, type ScalingMetadata, ScrollableSVGWrapper, type SelectionState, Selector, type SelectorOption, type SelectorProps, type SimulationOptions, Sparkline, type SparklineProps, type StatusColorEntry, type StatusColorMap, StatusIndicator, type StatusIndicatorProps, type SymbolCategory, type SymbolDefinition, SymbolLibrary, type SymbolLibraryProps, type SymbolMetadata, type TelemetryBinding, type TelemetryMap, type TelemetryStatus$1 as TelemetryStatus, type TelemetryValue, ThemeProvider, ThemeToggle, type ThemeToggleProps, type Thresholds, type Transform, TrendLine, type TrendLineProps, UNKNOWN_GLYPH_RING_DASH, UNKNOWN_STATUS_GLYPH_COLOR_VAR, type UnknownGlyphSize, UnknownStatusGlyph, type UnknownStatusGlyphProps, type UseBooleanIndicatorsOptions, type UseDeviceControlsOptions, type UseDragOptions, type UseDragResult, type UseSelectionOptions, type UseSelectionResult, type UseTelemetryOptions, type UseTelemetryResult, type UseTelemetryStatusOptions, type UseViewBoxOptions, type UseViewBoxResult, ValueEntry, type ValueEntryProps, type ViewBox, ZoomButton, ZoomControls, calculateThresholdStatus, createConfigBinding, createControlBinding, exampleDiagram, exportDiagram, generateRoutePoints, getAppearanceDefaults, getAppearanceSchema, getAvailableBadgeGlyphs, getAvailableSymbols, getBadgeGlyph, getPortWorldPosition, getSymbolDefinition, importDiagram, mockSymbolLibrary, nodeHasPort, normalizeDeviceStatus, overlayStyles, readAppearanceValue, registerBadgeGlyph, registerBadgeGlyphs, registerSymbol, registerSymbols, resolvePresetColor, resolveStatusColor, useBooleanIndicators, useDeviceConfigs, useDeviceControls, useDrag, useKeyboardShortcuts, useSelection, useSimulation, useTelemetry, useTelemetryStatus, useTheme, useViewBox, validateDiagram, writeAppearanceValue };