@procaaso/alphinity-ui-components 1.8.2 → 1.9.0

package/dist/index.d.ts

@@ -1,17 +1,16 @@
-import * as React$1 from 'react';
-import React__default from 'react';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
+import * as react 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 */
@@ -23,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 */
@@ -43,7 +42,7 @@ 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
@@ -189,7 +188,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 */
@@ -250,9 +249,9 @@ 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> {
+interface StatusIndicatorProps extends react__default.HTMLAttributes<HTMLDivElement> {
     /** Status state determining color and behavior */
     status: 'off' | 'normal' | 'alarm' | 'warning' | 'active' | 'fault';
     /** Size of the indicator */
@@ -268,9 +267,9 @@ interface StatusIndicatorProps extends React__default.HTMLAttributes<HTMLDivElem
     /** Whether the indicator should have a 3D LED effect */
     led?: boolean;
 }
-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 */
@@ -292,9 +291,9 @@ interface ValueEntryProps extends Omit<React__default.InputHTMLAttributes<HTMLIn
     /** Whether the input is read-only */
     readOnly?: boolean;
 }
-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 */
@@ -316,7 +315,7 @@ interface LegacyValueEntryProps extends Omit<React__default.InputHTMLAttributes<
     /** Whether the input is read-only */
     readOnly?: boolean;
 }
-declare const LegacyValueEntry: React__default.FC<LegacyValueEntryProps>;
+declare const LegacyValueEntry: react__default.FC<LegacyValueEntryProps>;
 
 interface NodeControlConfig {
     /** Node ID */
@@ -354,7 +353,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 */
@@ -373,7 +372,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).
@@ -659,10 +658,33 @@ interface DeviceControlPanelProps {
     undockIcon?: string;
     /** Style for mode selector: 'buttons' (horizontal scroll), 'dropdown' (select), or 'modal' (click to open modal) */
     modeSelectionStyle?: 'buttons' | 'dropdown' | 'modal';
+    /**
+     * Render this panel's OWN result toast. Default true, so existing
+     * consumers are unchanged.
+     *
+     * Set false when the host application already surfaces command and save
+     * results through its own notification channel. Without it the operator
+     * sees two notices for one action - this panel's optimistic "command
+     * sent", in this panel's styling, followed by the host's message for the
+     * real outcome - which reads as two different mechanisms.
+     *
+     * The result still lands in `binding.state`, so a host that opts out can
+     * read it and render its own.
+     */
+    showBuiltInToast?: boolean;
     /** Embedded mode - uses static positioning for rendering in containers (default: false) */
     embedded?: boolean;
 }
-declare function DeviceControlPanel({ binding, onClose, position, align, touchOptimized, compact, fontScale, maxHeight, maxWidth, toastDuration, onModeChange, onParameterChange, onParameterActivate, onStart, onStop, startPending, stopPending, onCustomAction, onOpenConfig, showConfigButton, onUndock, undockIcon, modeSelectionStyle, embedded, }: DeviceControlPanelProps): react_jsx_runtime.JSX.Element | null;
+/**
+ * Memoized below (kiosk heap-leak fix, same rationale as DeviceConfigPanel):
+ * an OPEN control panel must not re-render on host ticks whose props did not
+ * change. Unlike the config panel, a control binding legitimately changes when
+ * 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;
+/** Memo boundary - see DeviceControlPanelImpl doc comment (kiosk heap-leak fix). */
+declare const DeviceControlPanel: react__default.MemoExoticComponent<typeof DeviceControlPanelImpl>;
 
 interface NumpadDialogProps {
     /** Whether the dialog is open */
@@ -711,7 +733,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 {
@@ -722,9 +744,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;
@@ -769,20 +791,20 @@ interface EquipmentIndicatorProps {
     color: string;
     label: string;
     size?: number;
-    style?: React__default.CSSProperties;
+    style?: react__default.CSSProperties;
     className?: string;
 }
 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;
@@ -803,60 +825,60 @@ interface FullscreenWorkspaceProps extends React__default.HTMLAttributes<HTMLDiv
     zoomDisabled?: boolean;
 }
 
-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>> & {
+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>> & {
     theme?: _emotion_react.Theme;
 } & FullscreenContainerProps, {}, {}>;
-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>> & {
+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>> & {
     theme?: _emotion_react.Theme;
 } & {
     collapsed: boolean;
 }, {}, {}>;
-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>> & {
+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>> & {
     theme?: _emotion_react.Theme;
 } & {
     collapsed: boolean;
 }, {}, {}>;
-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>> & {
+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>> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
-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"> & {
+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"> & {
     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$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"> & {
+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"> & {
     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$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"> & {
+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"> & {
     theme?: _emotion_react.Theme;
 } & {
     mode: DisplayMode;
 }, {}, {}>;
-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>> & {
+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>> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
-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"> & {
+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"> & {
     theme?: _emotion_react.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>> & {
+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>> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
-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" | "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.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"> & {
     theme?: _emotion_react.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>> & {
+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>> & {
     theme?: _emotion_react.Theme;
 }, {}, {}>;
 declare const FixedSVGContainer: _emotion_styled.StyledComponent<{
     theme?: _emotion_react.Theme;
     as?: React.ElementType;
-}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 declare const ScrollableSVGWrapper: _emotion_styled.StyledComponent<{
     theme?: _emotion_react.Theme;
     as?: React.ElementType;
-}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 
 declare const baseOverlayStyles: {
     readonly tank: {
@@ -909,8 +931,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_runtime.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>> & {
+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>> & {
     theme?: _emotion_react.Theme;
 } & {
     svgX: number;
@@ -922,23 +944,23 @@ declare const CardHeader: _emotion_styled.StyledComponent<{
     as?: React.ElementType;
 } & {
     color?: string;
-}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 declare const CardValue: _emotion_styled.StyledComponent<{
     theme?: _emotion_react.Theme;
     as?: React.ElementType;
-}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 declare const CardUnit: _emotion_styled.StyledComponent<{
     theme?: _emotion_react.Theme;
     as?: React.ElementType;
-}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 
-declare const TrendLine: ({ values, width, height, color, strokeWidth, backgroundColor, }: TrendLineProps) => react_jsx_runtime.JSX.Element;
-declare const CircularGauge: ({ value, max, unit, label, size, color, }: CircularGaugeProps) => react_jsx_runtime.JSX.Element;
-declare const Sparkline: ({ data, width, height, color }: SparklineProps) => react_jsx_runtime.JSX.Element | null;
-declare const EquipmentIndicatorWithSparkline: ({ svgX, svgY, color, label, size, sparklineData, sparklineOffset, }: EquipmentIndicatorWithSparklineProps) => react_jsx_runtime.JSX.Element;
-declare const EquipmentIndicator: ({ svgX, svgY, color, label, size, style, className, }: EquipmentIndicatorProps) => react_jsx_runtime.JSX.Element;
+declare const TrendLine: ({ values, width, height, color, strokeWidth, backgroundColor, }: TrendLineProps) => react.JSX.Element;
+declare const CircularGauge: ({ value, max, unit, label, size, color, }: CircularGaugeProps) => react.JSX.Element;
+declare const Sparkline: ({ data, width, height, color }: SparklineProps) => react.JSX.Element | null;
+declare const EquipmentIndicatorWithSparkline: ({ svgX, svgY, color, label, size, sparklineData, sparklineOffset, }: EquipmentIndicatorWithSparklineProps) => react.JSX.Element;
+declare const EquipmentIndicator: ({ svgX, svgY, color, label, size, style, className, }: EquipmentIndicatorProps) => react.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 {
@@ -948,17 +970,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
@@ -1427,13 +1449,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 */
@@ -1489,20 +1511,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 */
@@ -1514,7 +1536,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 */
@@ -1532,7 +1554,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
@@ -1548,7 +1570,7 @@ interface NodeConfigPanelProps {
  * />
  * ```
  */
-declare function NodeConfigPanel({ node, binding, onUpdateNode, onUpdateTelemetry, onAddTelemetry, onRemove, className, style, }: NodeConfigPanelProps): react_jsx_runtime.JSX.Element;
+declare function NodeConfigPanel({ node, binding, onUpdateNode, onUpdateTelemetry, onAddTelemetry, onRemove, className, style, }: NodeConfigPanelProps): react__default.JSX.Element;
 
 /**
  * Validates a diagram object structure
@@ -1967,10 +1989,36 @@ interface DeviceConfigPanelProps {
     onOpenControls?: () => void;
     /** Show controls button in header */
     showControlsButton?: boolean;
+    /**
+     * Render this panel's OWN result toast. Default true, so existing
+     * consumers are unchanged.
+     *
+     * Set false when the host application already surfaces command and save
+     * results through its own notification channel. Without it the operator
+     * sees two notices for one action - this panel's optimistic "command
+     * sent", in this panel's styling, followed by the host's message for the
+     * real outcome - which reads as two different mechanisms.
+     *
+     * The result still lands in `binding.state`, so a host that opts out can
+     * read it and render its own.
+     */
+    showBuiltInToast?: boolean;
     /** Embedded mode - uses static positioning for rendering in containers (default: false) */
     embedded?: boolean;
 }
-declare function DeviceConfigPanel({ binding, onClose, onUndock, undockIcon, position, align, touchOptimized, compact, fontScale, maxHeight, maxWidth, toastDuration, onOpenControls, showControlsButton, embedded, }: DeviceConfigPanelProps): react_jsx_runtime.JSX.Element | null;
+/**
+ * Memoized below (kiosk heap-leak fix): a host whose screen re-renders ~1Hz on
+ * telemetry must not re-render an OPEN config panel every tick - each pass
+ * re-creates the panel's handler closures and re-binds its MUI event handlers,
+ * and on the kiosk those generations were RETAINED (~100 closures/sec,
+ * ~2.1 MB/min heap growth -> renderer OOM at the 512 MB cap, heap-snapshot
+ * fingerprint: Context/scope buckets + onSave/onReset closures). The memo only
+ * 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;
+/** Memo boundary - see DeviceConfigPanelImpl doc comment (kiosk heap-leak fix). */
+declare const DeviceConfigPanel: react__default.MemoExoticComponent<typeof DeviceConfigPanelImpl>;
 
 /**
  * Options for simulation behavior

package/dist/index.js

@@ -895,7 +895,7 @@ var NodeControlsPanel = ({
 };
 
 // src/components/DeviceControlPanel/DeviceControlPanel.tsx
-import { useState as useState5, useEffect as useEffect2 } from "react";
+import React5, { useState as useState5, useEffect as useEffect2 } from "react";
 
 // src/theme/statusColors.ts
 var DEFAULT_STATUS_COLORS = {
@@ -922,7 +922,7 @@ function resolveStatusColor(status, customMap) {
 
 // src/components/DeviceControlPanel/DeviceControlPanel.tsx
 import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
-function DeviceControlPanel({
+function DeviceControlPanelImpl({
   binding,
   onClose,
   position = "bottom",
@@ -946,6 +946,7 @@ function DeviceControlPanel({
   onUndock,
   undockIcon = "\u21F1",
   modeSelectionStyle = "buttons",
+  showBuiltInToast = true,
   embedded = false
 }) {
   const [localParameterValues, setLocalParameterValues] = useState5({});
@@ -1791,7 +1792,7 @@ function DeviceControlPanel({
         );
       }) })
     ] }),
-    binding.state.lastCommandResult && showToast && /* @__PURE__ */ jsx8(
+    binding.state.lastCommandResult && showToast && showBuiltInToast && /* @__PURE__ */ jsx8(
       "div",
       {
         style: {
@@ -1847,6 +1848,7 @@ function DeviceControlPanel({
       ` })
   ] });
 }
+var DeviceControlPanel = React5.memo(DeviceControlPanelImpl);
 
 // src/components/NumpadDialog/NumpadDialog.tsx
 import { useState as useState6, useEffect as useEffect3, useCallback as useCallback3, useRef as useRef2, useId } from "react";
@@ -8590,9 +8592,9 @@ function useDeviceConfigs(initialConfigs) {
 }
 
 // src/components/DeviceConfigPanel/DeviceConfigPanel.tsx
-import { useState as useState18, useEffect as useEffect13, useMemo, useRef as useRef8 } from "react";
+import React15, { useState as useState18, useEffect as useEffect13, useMemo, useRef as useRef8 } from "react";
 import { Fragment as Fragment9, jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
-function DeviceConfigPanel({
+function DeviceConfigPanelImpl({
   binding,
   onClose,
   onUndock,
@@ -8607,6 +8609,7 @@ function DeviceConfigPanel({
   toastDuration = 3e3,
   onOpenControls,
   showControlsButton = true,
+  showBuiltInToast = true,
   embedded = false
 }) {
   const [localValues, setLocalValues] = useState18(() => {
@@ -9272,7 +9275,7 @@ function DeviceConfigPanel({
         }
       )
     ] }),
-    binding.state.lastSaveResult && showToast && /* @__PURE__ */ jsx23(
+    binding.state.lastSaveResult && showToast && showBuiltInToast && /* @__PURE__ */ jsx23(
       "div",
       {
         style: {
@@ -9294,6 +9297,7 @@ function DeviceConfigPanel({
     )
   ] });
 }
+var DeviceConfigPanel = React15.memo(DeviceConfigPanelImpl);
 
 // src/diagram/hooks/useSimulation.ts
 import { useEffect as useEffect14 } from "react";