@procaaso/alphinity-ui-components 1.8.0 → 1.8.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/index.cjs +273 -235
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +82 -68
  4. package/dist/index.d.ts +82 -68
  5. package/dist/index.js +130 -92
  6. package/dist/index.js.map +1 -1
  7. package/package.json +1 -1
package/dist/index.d.ts CHANGED
@@ -1,16 +1,17 @@
1
- import * as react from 'react';
2
- import react__default from 'react';
1
+ import * as React$1 from 'react';
2
+ import React__default from 'react';
3
+ import * as react_jsx_runtime from 'react/jsx-runtime';
4
+ import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
3
5
  import * as _emotion_styled from '@emotion/styled';
4
6
  import * as _emotion_react from '@emotion/react';
5
7
  import * as _mui_system from '@mui/system';
6
8
  import * as _mui_material from '@mui/material';
7
- import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
8
9
 
9
- interface ButtonProps extends react__default.ButtonHTMLAttributes<HTMLButtonElement> {
10
+ interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
10
11
  variant?: 'primary' | 'secondary';
11
- children: react__default.ReactNode;
12
+ children: React__default.ReactNode;
12
13
  }
13
- declare const Button: react__default.FC<ButtonProps>;
14
+ declare const Button: React__default.FC<ButtonProps>;
14
15
 
15
16
  interface SelectorOption {
16
17
  /** Unique value for the option */
@@ -22,7 +23,7 @@ interface SelectorOption {
22
23
  /** Optional description for tooltip or additional context */
23
24
  description?: string;
24
25
  }
25
- interface SelectorProps extends Omit<react__default.HTMLAttributes<HTMLDivElement>, 'onChange'> {
26
+ interface SelectorProps extends Omit<React__default.HTMLAttributes<HTMLDivElement>, 'onChange'> {
26
27
  /** Currently selected value */
27
28
  value: string;
28
29
  /** Callback when selection changes */
@@ -42,7 +43,7 @@ interface SelectorProps extends Omit<react__default.HTMLAttributes<HTMLDivElemen
42
43
  /** Whether the dropdown should open upward */
43
44
  dropdownUp?: boolean;
44
45
  }
45
- declare const Selector: react__default.FC<SelectorProps>;
46
+ declare const Selector: React__default.FC<SelectorProps>;
46
47
 
47
48
  /**
48
49
  * Status levels for telemetry values
@@ -188,7 +189,7 @@ interface ModeConfig {
188
189
  /** Precision for second setpoint */
189
190
  secondPrecision?: number;
190
191
  }
191
- interface ControlPanelProps extends react__default.HTMLAttributes<HTMLDivElement> {
192
+ interface ControlPanelProps extends React__default.HTMLAttributes<HTMLDivElement> {
192
193
  /** Panel title/identifier */
193
194
  title: string;
194
195
  /** Currently selected mode */
@@ -249,9 +250,9 @@ interface ControlPanelProps extends react__default.HTMLAttributes<HTMLDivElement
249
250
  /** Custom stop button text */
250
251
  stopButtonText?: string;
251
252
  }
252
- declare const ControlPanel: react__default.FC<ControlPanelProps>;
253
+ declare const ControlPanel: React__default.FC<ControlPanelProps>;
253
254
 
254
- interface StatusIndicatorProps extends react__default.HTMLAttributes<HTMLDivElement> {
255
+ interface StatusIndicatorProps extends React__default.HTMLAttributes<HTMLDivElement> {
255
256
  /** Status state determining color and behavior */
256
257
  status: 'off' | 'normal' | 'alarm' | 'warning' | 'active' | 'fault';
257
258
  /** Size of the indicator */
@@ -267,9 +268,9 @@ interface StatusIndicatorProps extends react__default.HTMLAttributes<HTMLDivElem
267
268
  /** Whether the indicator should have a 3D LED effect */
268
269
  led?: boolean;
269
270
  }
270
- declare const StatusIndicator: react__default.FC<StatusIndicatorProps>;
271
+ declare const StatusIndicator: React__default.FC<StatusIndicatorProps>;
271
272
 
272
- interface ValueEntryProps extends Omit<react__default.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
273
+ interface ValueEntryProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
273
274
  /** Current value */
274
275
  value: number | string;
275
276
  /** Callback when value changes */
@@ -291,9 +292,9 @@ interface ValueEntryProps extends Omit<react__default.InputHTMLAttributes<HTMLIn
291
292
  /** Whether the input is read-only */
292
293
  readOnly?: boolean;
293
294
  }
294
- declare const ValueEntry: react__default.FC<ValueEntryProps>;
295
+ declare const ValueEntry: React__default.FC<ValueEntryProps>;
295
296
 
296
- interface LegacyValueEntryProps extends Omit<react__default.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
297
+ interface LegacyValueEntryProps extends Omit<React__default.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
297
298
  /** Current value */
298
299
  value: number | string;
299
300
  /** Callback when value changes */
@@ -315,7 +316,7 @@ interface LegacyValueEntryProps extends Omit<react__default.InputHTMLAttributes<
315
316
  /** Whether the input is read-only */
316
317
  readOnly?: boolean;
317
318
  }
318
- declare const LegacyValueEntry: react__default.FC<LegacyValueEntryProps>;
319
+ declare const LegacyValueEntry: React__default.FC<LegacyValueEntryProps>;
319
320
 
320
321
  interface NodeControlConfig {
321
322
  /** Node ID */
@@ -353,7 +354,7 @@ interface NodeControlConfig {
353
354
  /** Whether setpoint is read-only */
354
355
  readOnly?: boolean;
355
356
  }
356
- interface NodeControlsPanelProps extends react__default.HTMLAttributes<HTMLDivElement> {
357
+ interface NodeControlsPanelProps extends React__default.HTMLAttributes<HTMLDivElement> {
357
358
  /** Control configuration for the selected node */
358
359
  config: NodeControlConfig | null;
359
360
  /** Callback to close the panel */
@@ -372,7 +373,7 @@ interface NodeControlsPanelProps extends react__default.HTMLAttributes<HTMLDivEl
372
373
  * - Clear visual feedback
373
374
  * - Bottom or side slide-in animation
374
375
  */
375
- declare const NodeControlsPanel: react__default.FC<NodeControlsPanelProps>;
376
+ declare const NodeControlsPanel: React__default.FC<NodeControlsPanelProps>;
376
377
 
377
378
  /**
378
379
  * A custom action button rendered in the device control panel (e.g. Tare, Zero).
@@ -661,7 +662,7 @@ interface DeviceControlPanelProps {
661
662
  /** Embedded mode - uses static positioning for rendering in containers (default: false) */
662
663
  embedded?: boolean;
663
664
  }
664
- 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__default.JSX.Element | null;
665
+ 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;
665
666
 
666
667
  interface NumpadDialogProps {
667
668
  /** Whether the dialog is open */
@@ -710,7 +711,7 @@ interface NumpadDialogProps {
710
711
  * out-of-range values are rejected (never silently clamped). The field pre-fills
711
712
  * with the current value so an operator never blind-zeroes a live setpoint.
712
713
  */
713
- declare const NumpadDialog: react__default.FC<NumpadDialogProps>;
714
+ declare const NumpadDialog: React__default.FC<NumpadDialogProps>;
714
715
 
715
716
  type DisplayMode = 'standard' | 'dashboard';
716
717
  interface FullscreenContainerProps {
@@ -721,9 +722,9 @@ type OverlayTheme = 'tank' | 'pressure' | 'vessel' | 'flow';
721
722
  interface SVGLockedOverlayProps {
722
723
  svgX: number;
723
724
  svgY: number;
724
- children: react__default.ReactNode;
725
+ children: React__default.ReactNode;
725
726
  theme?: OverlayTheme;
726
- style?: react__default.CSSProperties;
727
+ style?: React__default.CSSProperties;
727
728
  className?: string;
728
729
  onClick?: () => void;
729
730
  containerSelector?: string;
@@ -768,20 +769,20 @@ interface EquipmentIndicatorProps {
768
769
  color: string;
769
770
  label: string;
770
771
  size?: number;
771
- style?: react__default.CSSProperties;
772
+ style?: React__default.CSSProperties;
772
773
  className?: string;
773
774
  }
774
775
  interface FullscreenWorkspaceTab {
775
776
  label: string;
776
777
  value: string;
777
- content: react__default.ReactNode;
778
- }
779
- interface FullscreenWorkspaceProps extends react__default.HTMLAttributes<HTMLDivElement> {
780
- svgContent: react__default.ReactNode;
781
- overlays?: react__default.ReactNode;
782
- leftPanel?: react__default.ReactNode;
783
- rightPanel?: react__default.ReactNode;
784
- footer?: react__default.ReactNode;
778
+ content: React__default.ReactNode;
779
+ }
780
+ interface FullscreenWorkspaceProps extends React__default.HTMLAttributes<HTMLDivElement> {
781
+ svgContent: React__default.ReactNode;
782
+ overlays?: React__default.ReactNode;
783
+ leftPanel?: React__default.ReactNode;
784
+ rightPanel?: React__default.ReactNode;
785
+ footer?: React__default.ReactNode;
785
786
  tabs?: FullscreenWorkspaceTab[];
786
787
  activeTab?: string;
787
788
  onTabChange?: (value: string) => void;
@@ -802,60 +803,60 @@ interface FullscreenWorkspaceProps extends react__default.HTMLAttributes<HTMLDiv
802
803
  zoomDisabled?: boolean;
803
804
  }
804
805
 
805
- 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>> & {
806
+ 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>> & {
806
807
  theme?: _emotion_react.Theme;
807
808
  } & FullscreenContainerProps, {}, {}>;
808
- 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>> & {
809
+ 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>> & {
809
810
  theme?: _emotion_react.Theme;
810
811
  } & {
811
812
  collapsed: boolean;
812
813
  }, {}, {}>;
813
- 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>> & {
814
+ 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>> & {
814
815
  theme?: _emotion_react.Theme;
815
816
  } & {
816
817
  collapsed: boolean;
817
818
  }, {}, {}>;
818
- 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>> & {
819
+ 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>> & {
819
820
  theme?: _emotion_react.Theme;
820
821
  }, {}, {}>;
821
- 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"> & {
822
+ 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"> & {
822
823
  theme?: _emotion_react.Theme;
823
824
  } & {
824
825
  collapsed: boolean;
825
826
  }, {}, {}>;
826
- 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"> & {
827
+ 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"> & {
827
828
  theme?: _emotion_react.Theme;
828
829
  } & {
829
830
  collapsed: boolean;
830
831
  }, {}, {}>;
831
- 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"> & {
832
+ 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"> & {
832
833
  theme?: _emotion_react.Theme;
833
834
  } & {
834
835
  mode: DisplayMode;
835
836
  }, {}, {}>;
836
- 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>> & {
837
+ 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>> & {
837
838
  theme?: _emotion_react.Theme;
838
839
  }, {}, {}>;
839
- 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"> & {
840
+ 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"> & {
840
841
  theme?: _emotion_react.Theme;
841
842
  }, {}, {}>;
842
- 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>> & {
843
+ 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>> & {
843
844
  theme?: _emotion_react.Theme;
844
845
  }, {}, {}>;
845
- 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"> & {
846
+ 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"> & {
846
847
  theme?: _emotion_react.Theme;
847
848
  }, {}, {}>;
848
- 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>> & {
849
+ 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>> & {
849
850
  theme?: _emotion_react.Theme;
850
851
  }, {}, {}>;
851
852
  declare const FixedSVGContainer: _emotion_styled.StyledComponent<{
852
853
  theme?: _emotion_react.Theme;
853
854
  as?: React.ElementType;
854
- }, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
855
+ }, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
855
856
  declare const ScrollableSVGWrapper: _emotion_styled.StyledComponent<{
856
857
  theme?: _emotion_react.Theme;
857
858
  as?: React.ElementType;
858
- }, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
859
+ }, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
859
860
 
860
861
  declare const baseOverlayStyles: {
861
862
  readonly tank: {
@@ -908,8 +909,8 @@ declare const baseOverlayStyles: {
908
909
  };
909
910
  };
910
911
  declare const overlayStyles: Record<OverlayTheme, typeof baseOverlayStyles[OverlayTheme]>;
911
- declare const SVGLockedOverlay: ({ svgX, svgY, children, theme, style, className, onClick, containerSelector, }: SVGLockedOverlayProps) => react.JSX.Element;
912
- 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>> & {
912
+ declare const SVGLockedOverlay: ({ svgX, svgY, children, theme, style, className, onClick, containerSelector, }: SVGLockedOverlayProps) => react_jsx_runtime.JSX.Element;
913
+ 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>> & {
913
914
  theme?: _emotion_react.Theme;
914
915
  } & {
915
916
  svgX: number;
@@ -921,23 +922,23 @@ declare const CardHeader: _emotion_styled.StyledComponent<{
921
922
  as?: React.ElementType;
922
923
  } & {
923
924
  color?: string;
924
- }, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
925
+ }, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
925
926
  declare const CardValue: _emotion_styled.StyledComponent<{
926
927
  theme?: _emotion_react.Theme;
927
928
  as?: React.ElementType;
928
- }, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
929
+ }, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
929
930
  declare const CardUnit: _emotion_styled.StyledComponent<{
930
931
  theme?: _emotion_react.Theme;
931
932
  as?: React.ElementType;
932
- }, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
933
+ }, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
933
934
 
934
- declare const TrendLine: ({ values, width, height, color, strokeWidth, backgroundColor, }: TrendLineProps) => react.JSX.Element;
935
- declare const CircularGauge: ({ value, max, unit, label, size, color, }: CircularGaugeProps) => react.JSX.Element;
936
- declare const Sparkline: ({ data, width, height, color }: SparklineProps) => react.JSX.Element | null;
937
- declare const EquipmentIndicatorWithSparkline: ({ svgX, svgY, color, label, size, sparklineData, sparklineOffset, }: EquipmentIndicatorWithSparklineProps) => react.JSX.Element;
938
- declare const EquipmentIndicator: ({ svgX, svgY, color, label, size, style, className, }: EquipmentIndicatorProps) => react.JSX.Element;
935
+ declare const TrendLine: ({ values, width, height, color, strokeWidth, backgroundColor, }: TrendLineProps) => react_jsx_runtime.JSX.Element;
936
+ declare const CircularGauge: ({ value, max, unit, label, size, color, }: CircularGaugeProps) => react_jsx_runtime.JSX.Element;
937
+ declare const Sparkline: ({ data, width, height, color }: SparklineProps) => react_jsx_runtime.JSX.Element | null;
938
+ declare const EquipmentIndicatorWithSparkline: ({ svgX, svgY, color, label, size, sparklineData, sparklineOffset, }: EquipmentIndicatorWithSparklineProps) => react_jsx_runtime.JSX.Element;
939
+ declare const EquipmentIndicator: ({ svgX, svgY, color, label, size, style, className, }: EquipmentIndicatorProps) => react_jsx_runtime.JSX.Element;
939
940
 
940
- 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;
941
+ 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;
941
942
 
942
943
  type Theme = 'modern' | 'hmi';
943
944
  interface ThemeContextType {
@@ -947,17 +948,17 @@ interface ThemeContextType {
947
948
  }
948
949
  declare const useTheme: () => ThemeContextType;
949
950
  interface ThemeProviderProps {
950
- children: react__default.ReactNode;
951
+ children: React__default.ReactNode;
951
952
  }
952
- declare const ThemeProvider: react__default.FC<ThemeProviderProps>;
953
+ declare const ThemeProvider: React__default.FC<ThemeProviderProps>;
953
954
 
954
- interface ThemeToggleProps extends react__default.HTMLAttributes<HTMLDivElement> {
955
+ interface ThemeToggleProps extends React__default.HTMLAttributes<HTMLDivElement> {
955
956
  /** Size of the toggle */
956
957
  size?: 'small' | 'medium' | 'large';
957
958
  /** Position of the toggle */
958
959
  position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'inline';
959
960
  }
960
- declare const ThemeToggle: react__default.FC<ThemeToggleProps>;
961
+ declare const ThemeToggle: React__default.FC<ThemeToggleProps>;
961
962
 
962
963
  /**
963
964
  * ISA-101 High Performance HMI — Unified Status Color System
@@ -1426,13 +1427,13 @@ interface PIDCanvasFeatures {
1426
1427
  /** Background color for canvas (default: '#ffffff') */
1427
1428
  backgroundColor?: string;
1428
1429
  }
1429
- interface PIDCanvasProps extends react__default.HTMLAttributes<HTMLDivElement> {
1430
+ interface PIDCanvasProps extends React__default.HTMLAttributes<HTMLDivElement> {
1430
1431
  /** The diagram to render */
1431
1432
  diagram: Diagram;
1432
1433
  /** Optional className for the container */
1433
1434
  className?: string;
1434
1435
  /** Optional inline styles for the container */
1435
- style?: react__default.CSSProperties;
1436
+ style?: React__default.CSSProperties;
1436
1437
  /** Enable interactive features (pan, zoom, selection, telemetry, dragNodes) */
1437
1438
  features?: PIDCanvasFeatures;
1438
1439
  /** Callback when selection changes */
@@ -1480,15 +1481,28 @@ interface PIDCanvasControls {
1480
1481
  * - Renders nodes (PR #3) and pipes (PR #4) with static layout
1481
1482
  * - Drag-and-drop: Drag nodes to reposition (PR #8)
1482
1483
  *
1484
+ * Memoized (renderer-OOM fix): a host whose screen re-renders for reasons
1485
+ * unrelated to the canvas (panel state, connection status, ...) should not pay
1486
+ * a full-canvas reconciliation. The memo only pays off when the host passes
1487
+ * identity-stable props (memoized features/telemetry/style, useCallback
1488
+ * handlers); an unstable host degrades gracefully to the old behavior.
1489
+ *
1483
1490
  * Future: Editing tools, symbol library UI
1484
1491
  */
1485
- declare function PIDCanvas({ diagram, className, style, features, onSelectionChange, onNodeClick, onPipeClick, onNodeMove, onDiagramChange, onDelete, onItemsCopied, onPaste, onSymbolDrop, onPipeCreated, onMounted, telemetry, statusColorMap, ...props }: PIDCanvasProps): react__default.ReactElement;
1492
+ 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;
1493
+ /**
1494
+ * Memo boundary - see PIDCanvasImpl doc comment (renderer-OOM fix). Shallow
1495
+ * compare: `diagram`, `telemetry`, `features`, `style`, `statusColorMap`, and
1496
+ * every callback are compared by identity; hosts that keep them stable skip
1497
+ * the full-canvas re-render entirely when unrelated screen state changes.
1498
+ */
1499
+ declare const PIDCanvas: React__default.MemoExoticComponent<typeof PIDCanvasImpl>;
1486
1500
 
1487
1501
  interface SymbolLibraryProps {
1488
1502
  /** Optional className for styling */
1489
1503
  className?: string;
1490
1504
  /** Callback when a symbol drag starts */
1491
- onSymbolDragStart?: (symbolId: string, event: react__default.DragEvent) => void;
1505
+ onSymbolDragStart?: (symbolId: string, event: React__default.DragEvent) => void;
1492
1506
  /** Show category filter */
1493
1507
  showCategories?: boolean;
1494
1508
  /** Custom symbol categories */
@@ -1500,7 +1514,7 @@ interface SymbolLibraryProps {
1500
1514
  * Displays available symbols organized by category
1501
1515
  * Supports drag-and-drop to add new nodes to diagrams
1502
1516
  */
1503
- declare function SymbolLibrary({ className, onSymbolDragStart, showCategories, categories, }: SymbolLibraryProps): react__default.ReactElement;
1517
+ declare function SymbolLibrary({ className, onSymbolDragStart, showCategories, categories, }: SymbolLibraryProps): React__default.ReactElement;
1504
1518
 
1505
1519
  interface NodeConfigPanelProps {
1506
1520
  /** Selected node to configure */
@@ -1518,7 +1532,7 @@ interface NodeConfigPanelProps {
1518
1532
  /** Additional CSS class name */
1519
1533
  className?: string;
1520
1534
  /** Custom styles */
1521
- style?: react__default.CSSProperties;
1535
+ style?: React__default.CSSProperties;
1522
1536
  }
1523
1537
  /**
1524
1538
  * NodeConfigPanel - Reusable configuration panel for editing node properties and telemetry
@@ -1534,7 +1548,7 @@ interface NodeConfigPanelProps {
1534
1548
  * />
1535
1549
  * ```
1536
1550
  */
1537
- declare function NodeConfigPanel({ node, binding, onUpdateNode, onUpdateTelemetry, onAddTelemetry, onRemove, className, style, }: NodeConfigPanelProps): react__default.JSX.Element;
1551
+ declare function NodeConfigPanel({ node, binding, onUpdateNode, onUpdateTelemetry, onAddTelemetry, onRemove, className, style, }: NodeConfigPanelProps): react_jsx_runtime.JSX.Element;
1538
1552
 
1539
1553
  /**
1540
1554
  * Validates a diagram object structure
@@ -1956,7 +1970,7 @@ interface DeviceConfigPanelProps {
1956
1970
  /** Embedded mode - uses static positioning for rendering in containers (default: false) */
1957
1971
  embedded?: boolean;
1958
1972
  }
1959
- declare function DeviceConfigPanel({ binding, onClose, onUndock, undockIcon, position, align, touchOptimized, compact, fontScale, maxHeight, maxWidth, toastDuration, onOpenControls, showControlsButton, embedded, }: DeviceConfigPanelProps): react__default.JSX.Element | null;
1973
+ 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;
1960
1974
 
1961
1975
  /**
1962
1976
  * Options for simulation behavior