@procaaso/alphinity-ui-components 1.8.0 → 1.8.1

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 +31 -22
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +69 -68
  4. package/dist/index.d.ts +69 -68
  5. package/dist/index.js +31 -22
  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 */
@@ -1482,13 +1483,13 @@ interface PIDCanvasControls {
1482
1483
  *
1483
1484
  * Future: Editing tools, symbol library UI
1484
1485
  */
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;
1486
+ 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;
1486
1487
 
1487
1488
  interface SymbolLibraryProps {
1488
1489
  /** Optional className for styling */
1489
1490
  className?: string;
1490
1491
  /** Callback when a symbol drag starts */
1491
- onSymbolDragStart?: (symbolId: string, event: react__default.DragEvent) => void;
1492
+ onSymbolDragStart?: (symbolId: string, event: React__default.DragEvent) => void;
1492
1493
  /** Show category filter */
1493
1494
  showCategories?: boolean;
1494
1495
  /** Custom symbol categories */
@@ -1500,7 +1501,7 @@ interface SymbolLibraryProps {
1500
1501
  * Displays available symbols organized by category
1501
1502
  * Supports drag-and-drop to add new nodes to diagrams
1502
1503
  */
1503
- declare function SymbolLibrary({ className, onSymbolDragStart, showCategories, categories, }: SymbolLibraryProps): react__default.ReactElement;
1504
+ declare function SymbolLibrary({ className, onSymbolDragStart, showCategories, categories, }: SymbolLibraryProps): React__default.ReactElement;
1504
1505
 
1505
1506
  interface NodeConfigPanelProps {
1506
1507
  /** Selected node to configure */
@@ -1518,7 +1519,7 @@ interface NodeConfigPanelProps {
1518
1519
  /** Additional CSS class name */
1519
1520
  className?: string;
1520
1521
  /** Custom styles */
1521
- style?: react__default.CSSProperties;
1522
+ style?: React__default.CSSProperties;
1522
1523
  }
1523
1524
  /**
1524
1525
  * NodeConfigPanel - Reusable configuration panel for editing node properties and telemetry
@@ -1534,7 +1535,7 @@ interface NodeConfigPanelProps {
1534
1535
  * />
1535
1536
  * ```
1536
1537
  */
1537
- declare function NodeConfigPanel({ node, binding, onUpdateNode, onUpdateTelemetry, onAddTelemetry, onRemove, className, style, }: NodeConfigPanelProps): react__default.JSX.Element;
1538
+ declare function NodeConfigPanel({ node, binding, onUpdateNode, onUpdateTelemetry, onAddTelemetry, onRemove, className, style, }: NodeConfigPanelProps): react_jsx_runtime.JSX.Element;
1538
1539
 
1539
1540
  /**
1540
1541
  * Validates a diagram object structure
@@ -1956,7 +1957,7 @@ interface DeviceConfigPanelProps {
1956
1957
  /** Embedded mode - uses static positioning for rendering in containers (default: false) */
1957
1958
  embedded?: boolean;
1958
1959
  }
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;
1960
+ 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
1961
 
1961
1962
  /**
1962
1963
  * Options for simulation behavior
package/dist/index.js CHANGED
@@ -4829,6 +4829,30 @@ function PipeRenderer({
4829
4829
 
4830
4830
  // src/components/PIDCanvas/DataOverlay.tsx
4831
4831
  import { Fragment as Fragment6, jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
4832
+ var PULSE_KEYFRAME_ID = "pid-data-overlay-pulse-keyframes";
4833
+ var PULSE_ANIMATION = "pid-data-overlay-pulse 1.5s ease-in-out infinite";
4834
+ function ensurePulseKeyframes() {
4835
+ if (typeof document === "undefined") return;
4836
+ if (document.getElementById(PULSE_KEYFRAME_ID)) return;
4837
+ const style = document.createElement("style");
4838
+ style.id = PULSE_KEYFRAME_ID;
4839
+ style.textContent = "@keyframes pid-data-overlay-pulse{0%{opacity:.9}50%{opacity:.3}100%{opacity:.9}}";
4840
+ document.head.appendChild(style);
4841
+ }
4842
+ function renderStatusDot(cx, cy, scale, fill) {
4843
+ ensurePulseKeyframes();
4844
+ return /* @__PURE__ */ jsx18(
4845
+ "circle",
4846
+ {
4847
+ className: "pid-data-overlay-status-dot",
4848
+ cx: cx + 35 * scale,
4849
+ cy: cy - 18 * scale,
4850
+ r: 3 * scale,
4851
+ fill,
4852
+ style: { animation: PULSE_ANIMATION }
4853
+ }
4854
+ );
4855
+ }
4832
4856
  function DataOverlay({
4833
4857
  nodeId,
4834
4858
  x,
@@ -4933,25 +4957,7 @@ function DataOverlay({
4933
4957
  children: displayText
4934
4958
  }
4935
4959
  ),
4936
- showStatus && value.status !== "normal" && /* @__PURE__ */ jsx18(
4937
- "circle",
4938
- {
4939
- cx: displayX + 35 * scale,
4940
- cy: displayY - 18 * scale,
4941
- r: 3 * scale,
4942
- fill: finalTextColor,
4943
- opacity: "0.9",
4944
- children: /* @__PURE__ */ jsx18(
4945
- "animate",
4946
- {
4947
- attributeName: "opacity",
4948
- values: "0.9;0.3;0.9",
4949
- dur: "1.5s",
4950
- repeatCount: "indefinite"
4951
- }
4952
- )
4953
- }
4954
- ),
4960
+ showStatus && value.status !== "normal" && renderStatusDot(displayX, displayY, scale, finalTextColor),
4955
4961
  value.quality !== void 0 && value.quality < 100 && /* @__PURE__ */ jsxs14(
4956
4962
  "text",
4957
4963
  {
@@ -8617,14 +8623,17 @@ function DeviceConfigPanel({
8617
8623
  const currentTimestamp = binding?.state.lastSaved || 0;
8618
8624
  if (binding?.state.lastSaveResult && currentTimestamp !== lastResultTimestampRef.current) {
8619
8625
  lastResultTimestampRef.current = currentTimestamp;
8626
+ let hideTimer;
8620
8627
  const showTimer = setTimeout(() => {
8621
8628
  setShowToast(true);
8622
- const hideTimer = setTimeout(() => {
8629
+ hideTimer = setTimeout(() => {
8623
8630
  setShowToast(false);
8624
8631
  }, toastDuration);
8625
- return () => clearTimeout(hideTimer);
8626
8632
  }, 0);
8627
- return () => clearTimeout(showTimer);
8633
+ return () => {
8634
+ clearTimeout(showTimer);
8635
+ if (hideTimer) clearTimeout(hideTimer);
8636
+ };
8628
8637
  }
8629
8638
  }, [binding?.state.lastSaveResult, binding?.state.lastSaved, toastDuration]);
8630
8639
  const parametersBySection = useMemo(() => {