@cere/cere-design-system 0.0.24 → 0.0.26
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.
- package/dist/index.d.mts +203 -3
- package/dist/index.d.ts +203 -3
- package/dist/index.js +1175 -308
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1131 -253
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -23,15 +23,16 @@ import { CardProps as CardProps$1 } from '@mui/material/Card';
|
|
|
23
23
|
import { CardContentProps } from '@mui/material/CardContent';
|
|
24
24
|
import { CardHeaderProps } from '@mui/material/CardHeader';
|
|
25
25
|
import { CardActionsProps } from '@mui/material/CardActions';
|
|
26
|
+
import { PaperProps as PaperProps$1 } from '@mui/material/Paper';
|
|
26
27
|
import { AvatarProps as AvatarProps$1 } from '@mui/material/Avatar';
|
|
27
28
|
import { BreadcrumbsProps as BreadcrumbsProps$1 } from '@mui/material/Breadcrumbs';
|
|
28
|
-
import { PaperProps as PaperProps$1 } from '@mui/material/Paper';
|
|
29
29
|
import { DividerProps as DividerProps$1 } from '@mui/material/Divider';
|
|
30
30
|
import { LinkProps as LinkProps$1 } from '@mui/material/Link';
|
|
31
|
+
import { BoxProps as BoxProps$1 } from '@mui/material/Box';
|
|
31
32
|
import { AlertProps as AlertProps$1 } from '@mui/material/Alert';
|
|
32
33
|
import { SnackbarProps as SnackbarProps$1 } from '@mui/material/Snackbar';
|
|
33
34
|
import { QRCodeProps as QRCodeProps$1 } from 'react-qr-code';
|
|
34
|
-
import { ReactFlowProps, Node, Edge, OnNodesChange, OnEdgesChange, NodeTypes, EdgeTypes, BackgroundVariant, ReactFlowInstance } from 'reactflow';
|
|
35
|
+
import { ReactFlowProps, Node, Edge, OnNodesChange, OnEdgesChange, NodeTypes, EdgeTypes, BackgroundVariant, ReactFlowInstance, NodeProps } from 'reactflow';
|
|
35
36
|
export { Background, BackgroundVariant, ConnectionLineType, Controls, Edge, EdgeTypes, MiniMap, Node, NodeTypes, OnEdgesChange, OnNodesChange, Panel, ReactFlowInstance } from 'reactflow';
|
|
36
37
|
import { Monaco } from '@monaco-editor/react';
|
|
37
38
|
import { editor } from 'monaco-editor';
|
|
@@ -43,12 +44,20 @@ declare module '@mui/material/styles' {
|
|
|
43
44
|
entity: typeof deploymentEntityColors;
|
|
44
45
|
status: typeof deploymentStatusColors;
|
|
45
46
|
};
|
|
47
|
+
workflow: {
|
|
48
|
+
node: typeof workflowNodeColors;
|
|
49
|
+
connection: typeof workflowConnectionColors;
|
|
50
|
+
};
|
|
46
51
|
}
|
|
47
52
|
interface PaletteOptions {
|
|
48
53
|
deployment?: {
|
|
49
54
|
entity?: Record<string, string>;
|
|
50
55
|
status?: Record<string, string>;
|
|
51
56
|
};
|
|
57
|
+
workflow?: {
|
|
58
|
+
node?: Record<string, string>;
|
|
59
|
+
connection?: Record<string, string>;
|
|
60
|
+
};
|
|
52
61
|
}
|
|
53
62
|
}
|
|
54
63
|
declare const colors: {
|
|
@@ -125,6 +134,29 @@ declare const deploymentStatusColors: {
|
|
|
125
134
|
disabled: string;
|
|
126
135
|
disabledDim: string;
|
|
127
136
|
};
|
|
137
|
+
declare const workflowNodeColors: {
|
|
138
|
+
readonly start: "#00C950";
|
|
139
|
+
readonly input: "#00A6F4";
|
|
140
|
+
readonly stream: "#00B8DB";
|
|
141
|
+
readonly rafts: "#FF6900";
|
|
142
|
+
readonly cubbies: "#D0C900";
|
|
143
|
+
readonly events: "#F6339A";
|
|
144
|
+
readonly trigger: "#AD46FF";
|
|
145
|
+
readonly action: "#2B7FFF";
|
|
146
|
+
readonly aiModel: "#615FFF";
|
|
147
|
+
readonly aiAgent: "#D0A2FB";
|
|
148
|
+
readonly condition: "#FE9A00";
|
|
149
|
+
readonly output: "#00BC7D";
|
|
150
|
+
readonly end: "#FB2C36";
|
|
151
|
+
readonly parallel: "#14B8A6";
|
|
152
|
+
readonly merge: "#6366F1";
|
|
153
|
+
};
|
|
154
|
+
declare const workflowConnectionColors: {
|
|
155
|
+
readonly success: "#22C55E";
|
|
156
|
+
readonly process: "#3B82F6";
|
|
157
|
+
readonly stream: "#06B6D4";
|
|
158
|
+
readonly error: "#EF4444";
|
|
159
|
+
};
|
|
128
160
|
/**
|
|
129
161
|
* ROB primary brand color palette (Figma node 11-1393)
|
|
130
162
|
* Four main brand colors for the ROB design system
|
|
@@ -1545,6 +1577,48 @@ interface DeploymentDashboardPanelProps {
|
|
|
1545
1577
|
}
|
|
1546
1578
|
declare const DeploymentDashboardPanel: React__default.FC<DeploymentDashboardPanelProps>;
|
|
1547
1579
|
|
|
1580
|
+
/** All supported workflow node types */
|
|
1581
|
+
type WorkflowNodeType = 'start' | 'input' | 'stream' | 'rafts' | 'cubbies' | 'events' | 'trigger' | 'action' | 'aiModel' | 'aiAgent' | 'condition' | 'output' | 'end' | 'parallel' | 'merge';
|
|
1582
|
+
interface WorkflowNodeProps extends Omit<PaperProps$1, 'title'> {
|
|
1583
|
+
/** The workflow node type — drives accent color, default icon, and badge label */
|
|
1584
|
+
nodeType: WorkflowNodeType;
|
|
1585
|
+
/** Primary title displayed in the node */
|
|
1586
|
+
title: string;
|
|
1587
|
+
/** Optional description text below the title */
|
|
1588
|
+
description?: string;
|
|
1589
|
+
/** Override the default icon for this node type */
|
|
1590
|
+
icon?: React__default.ReactNode;
|
|
1591
|
+
/** Override the default badge label for this node type */
|
|
1592
|
+
badgeLabel?: string;
|
|
1593
|
+
/** Whether the node is currently selected (highlights border with accent color) */
|
|
1594
|
+
selected?: boolean;
|
|
1595
|
+
/** Optional className */
|
|
1596
|
+
className?: string;
|
|
1597
|
+
/** Renders left/right connector dots to match the design spec */
|
|
1598
|
+
showSideDots?: boolean;
|
|
1599
|
+
}
|
|
1600
|
+
/** Human-readable labels for each node type (matches Figma badge text) */
|
|
1601
|
+
declare const WORKFLOW_NODE_LABELS: Record<WorkflowNodeType, string>;
|
|
1602
|
+
/** Shared elevation shadow for workflow node cards and connector handles (Figma 277-8244) */
|
|
1603
|
+
declare const WORKFLOW_NODE_SHADOW = "0px 1px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.1)";
|
|
1604
|
+
/**
|
|
1605
|
+
* WorkflowNode — visual card for a workflow editor node.
|
|
1606
|
+
*
|
|
1607
|
+
* Renders a card with a colored left border strip, title, optional description,
|
|
1608
|
+
* and a type badge/chip. Designed to integrate with FlowEditor (ReactFlow)
|
|
1609
|
+
* via the WorkflowNodeHandle wrapper.
|
|
1610
|
+
*
|
|
1611
|
+
* @example
|
|
1612
|
+
* ```tsx
|
|
1613
|
+
* <WorkflowNode
|
|
1614
|
+
* nodeType="trigger"
|
|
1615
|
+
* title="HTTP Trigger"
|
|
1616
|
+
* description="Listens for incoming webhook calls"
|
|
1617
|
+
* />
|
|
1618
|
+
* ```
|
|
1619
|
+
*/
|
|
1620
|
+
declare const WorkflowNode: React__default.FC<WorkflowNodeProps>;
|
|
1621
|
+
|
|
1548
1622
|
interface AvatarProps extends AvatarProps$1 {
|
|
1549
1623
|
size?: 'small' | 'medium' | 'large' | number;
|
|
1550
1624
|
}
|
|
@@ -1604,6 +1678,105 @@ interface AppBarProps extends AppBarProps$1 {
|
|
|
1604
1678
|
}
|
|
1605
1679
|
declare const AppBar: React__default.FC<AppBarProps>;
|
|
1606
1680
|
|
|
1681
|
+
interface WorkflowTopBarProps extends Omit<BoxProps$1, 'title'> {
|
|
1682
|
+
/** Heading shown at the left side of the bar. */
|
|
1683
|
+
title?: string;
|
|
1684
|
+
/** Execution identifier displayed in the CID field. */
|
|
1685
|
+
executionId: string;
|
|
1686
|
+
/** Called when the execution ID value changes. */
|
|
1687
|
+
onExecutionIdChange?: (value: string) => void;
|
|
1688
|
+
/** Called when the execution ID clear action is pressed. */
|
|
1689
|
+
onClearExecutionId?: () => void;
|
|
1690
|
+
/** Submit button label. */
|
|
1691
|
+
submitLabel?: string;
|
|
1692
|
+
/** Called when submit is pressed. */
|
|
1693
|
+
onSubmit?: () => void;
|
|
1694
|
+
/** Inspector toggle button label. */
|
|
1695
|
+
inspectorLabel?: string;
|
|
1696
|
+
/** Called when inspector toggle is pressed. */
|
|
1697
|
+
onInspectorToggle?: () => void;
|
|
1698
|
+
/** Called when close is pressed. */
|
|
1699
|
+
onClose?: () => void;
|
|
1700
|
+
/** Hides/shows the inspector toggle button. */
|
|
1701
|
+
showInspectorToggle?: boolean;
|
|
1702
|
+
/** Hides/shows the close icon action. */
|
|
1703
|
+
showCloseButton?: boolean;
|
|
1704
|
+
}
|
|
1705
|
+
/**
|
|
1706
|
+
* WorkflowTopBar
|
|
1707
|
+
*
|
|
1708
|
+
* Top chrome bar for workflow canvas screens based on Figma 277:8006.
|
|
1709
|
+
*/
|
|
1710
|
+
declare const WorkflowTopBar: React__default.FC<WorkflowTopBarProps>;
|
|
1711
|
+
|
|
1712
|
+
interface WorkflowSideInspectorProps extends PaperProps$1 {
|
|
1713
|
+
/** Controls panel visibility for simple layouts. */
|
|
1714
|
+
open?: boolean;
|
|
1715
|
+
/** Header title. */
|
|
1716
|
+
title?: string;
|
|
1717
|
+
/** Selected node headline. */
|
|
1718
|
+
nodeTitle?: string;
|
|
1719
|
+
/** Selected node description. */
|
|
1720
|
+
nodeDescription?: string;
|
|
1721
|
+
/** Selected node type for the colored tag. */
|
|
1722
|
+
nodeType?: WorkflowNodeType;
|
|
1723
|
+
/** Input field value shown in details section. */
|
|
1724
|
+
inputValue?: string;
|
|
1725
|
+
/** Output field value shown in details section. */
|
|
1726
|
+
outputValue?: string;
|
|
1727
|
+
/** Cubby ID value shown in copy button. */
|
|
1728
|
+
cubbyId?: string;
|
|
1729
|
+
/** Timestamp value shown in metadata section. */
|
|
1730
|
+
timestamp?: string;
|
|
1731
|
+
/** Duration value shown in metadata section. */
|
|
1732
|
+
duration?: string;
|
|
1733
|
+
/** Bottom CTA label. */
|
|
1734
|
+
actionLabel?: string;
|
|
1735
|
+
/** Called when close button is pressed. */
|
|
1736
|
+
onClose?: () => void;
|
|
1737
|
+
/** Called when cubby copy button is pressed. */
|
|
1738
|
+
onCopyCubbyId?: () => void;
|
|
1739
|
+
/** Called when bottom CTA is pressed. */
|
|
1740
|
+
onAction?: () => void;
|
|
1741
|
+
}
|
|
1742
|
+
/**
|
|
1743
|
+
* WorkflowSideInspector
|
|
1744
|
+
*
|
|
1745
|
+
* Right-side inspector panel based on Figma 277:8100.
|
|
1746
|
+
*/
|
|
1747
|
+
declare const WorkflowSideInspector: React__default.FC<WorkflowSideInspectorProps>;
|
|
1748
|
+
|
|
1749
|
+
interface WorkflowTimeBarProps extends BoxProps$1 {
|
|
1750
|
+
/** Elapsed time label shown above the progress line. */
|
|
1751
|
+
elapsedTime?: string;
|
|
1752
|
+
/** Progress from 0 to 100. */
|
|
1753
|
+
progress?: number;
|
|
1754
|
+
/** Current step index for the step indicator. */
|
|
1755
|
+
currentStep?: number;
|
|
1756
|
+
/** Total number of steps for the step indicator. */
|
|
1757
|
+
totalSteps?: number;
|
|
1758
|
+
/** Available speed options (e.g. 0.5x, 1x, 2x). */
|
|
1759
|
+
speedOptions?: number[];
|
|
1760
|
+
/** Currently selected speed value. */
|
|
1761
|
+
selectedSpeed?: number;
|
|
1762
|
+
/** Called when stop is pressed. */
|
|
1763
|
+
onStop?: () => void;
|
|
1764
|
+
/** Called when previous step is pressed. */
|
|
1765
|
+
onPreviousStep?: () => void;
|
|
1766
|
+
/** Called when next step is pressed. */
|
|
1767
|
+
onNextStep?: () => void;
|
|
1768
|
+
/** Called when a speed option is selected. */
|
|
1769
|
+
onSpeedChange?: (speed: number) => void;
|
|
1770
|
+
/** Called when refresh is pressed. */
|
|
1771
|
+
onReset?: () => void;
|
|
1772
|
+
}
|
|
1773
|
+
/**
|
|
1774
|
+
* WorkflowTimeBar
|
|
1775
|
+
*
|
|
1776
|
+
* Bottom chrome bar for workflow playback controls based on Figma 277:8087.
|
|
1777
|
+
*/
|
|
1778
|
+
declare const WorkflowTimeBar: React__default.FC<WorkflowTimeBarProps>;
|
|
1779
|
+
|
|
1607
1780
|
interface CollapseProps extends CollapseProps$1 {
|
|
1608
1781
|
/**
|
|
1609
1782
|
* If `true`, the component will transition in
|
|
@@ -2179,4 +2352,31 @@ interface CodeEditorProps {
|
|
|
2179
2352
|
*/
|
|
2180
2353
|
declare const CodeEditor: React__default.FC<CodeEditorProps>;
|
|
2181
2354
|
|
|
2182
|
-
|
|
2355
|
+
/** Data shape expected by the WorkflowNodeHandle custom ReactFlow node */
|
|
2356
|
+
interface WorkflowNodeData {
|
|
2357
|
+
/** Workflow node type — drives accent color, icon, and badge */
|
|
2358
|
+
nodeType: WorkflowNodeType;
|
|
2359
|
+
/** Primary title */
|
|
2360
|
+
title: string;
|
|
2361
|
+
/** Optional description */
|
|
2362
|
+
description?: string;
|
|
2363
|
+
/** Override default icon */
|
|
2364
|
+
icon?: React__default.ReactNode;
|
|
2365
|
+
/** Override default badge label */
|
|
2366
|
+
badgeLabel?: string;
|
|
2367
|
+
}
|
|
2368
|
+
/**
|
|
2369
|
+
* Thin ReactFlow custom-node wrapper around WorkflowNode.
|
|
2370
|
+
*
|
|
2371
|
+
* Renders a target Handle (top), the WorkflowNode card, and a source Handle (bottom).
|
|
2372
|
+
* Register as a custom nodeType:
|
|
2373
|
+
*
|
|
2374
|
+
* @example
|
|
2375
|
+
* ```tsx
|
|
2376
|
+
* const nodeTypes = { workflowNode: WorkflowNodeHandle };
|
|
2377
|
+
* <FlowEditor nodes={nodes} edges={edges} nodeTypes={nodeTypes} />
|
|
2378
|
+
* ```
|
|
2379
|
+
*/
|
|
2380
|
+
declare const WorkflowNodeHandle: React__default.FC<NodeProps<WorkflowNodeData>>;
|
|
2381
|
+
|
|
2382
|
+
export { Accordion, type AccordionProps, AccountSection, type AccountSectionProps, ActivityAppIcon, Alert, type AlertProps, type AlertSeverity, AppBar, type AppBarProps, AppLoading, type AppLoadingProps, Avatar, AvatarIcon, type AvatarProps, Badge, type BadgeProps, BarTrackingIcon, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, BytesSize, type BytesSizeProps, Card, CardActions, CardContent, CardHeader, type CardProps, CereIcon, ChartWidget, type ChartWidgetProps, CheckMarkAnimation, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, type CircularProgressProps, ClockIcon, CloudFlashIcon, CodeEditor, type CodeEditorLanguage, type CodeEditorProps, Collapse, type CollapseProps, ConnectionStatus, type ConnectionStatusProps, type ContextMenuItem, type DataPoint, type DataSeries, DateRangePicker, type DateRangePickerProps, DecentralizedServerIcon, type DeploymentCardAction, DeploymentDashboardCard, type DeploymentDashboardCardProps, DeploymentDashboardPanel, type DeploymentDashboardPanelProps, DeploymentDashboardTree, type DeploymentDashboardTreeProps, DeploymentEntityContextMenu, type DeploymentEntityContextMenuProps, type DeploymentEntityType, type DeploymentStatusIndicator, type DeploymentTreeNode, Dialog, type DialogProps, DiscordIcon, Divider, type DividerProps, DownloadIcon, Drawer, type DrawerProps, Dropdown, DropdownAnchor, type DropdownAnchorProps, type DropdownProps, EmptyState, type EmptyStateProps, EntityHeader, type EntityHeaderProps, FilledFolderIcon, FlowEditor, type FlowEditorProps, FolderIcon, GithubLogoIcon, IDBlock, type IDBlockProps, IconButton, type IconButtonProps, LeftArrowIcon, Link, type LinkProps, List, ListItem, type ListItemProps, type ListProps, Loading, LoadingAnimation, type LoadingAnimationProps, LoadingButton, type LoadingButtonProps, type LoadingProps, Logo, type LogoProps, Markdown, type MarkdownProps, Menu, MenuItem, type MenuItemProps, type MenuProps, MetricsChart, type MetricsChartProps, type MetricsPeriod, NavigationItem, type NavigationItemProps, NavigationList, type NavigationListProps, OnboardingProvider, Pagination, type PaginationProps, Paper, type PaperProps, PeriodSelect, type PrimaryAction, Progress, type ProgressProps, QRCode, type QRCodeProps, Radio, type RadioProps, RightArrowIcon, RoleBadge, type RoleBadgeColor, type RoleBadgeProps, type RoleBadgeSize, SearchField, type SearchFieldProps, Selector, type SelectorOption, type SelectorProps, type Service, ServiceSelectorButton, type ServiceSelectorButtonProps, ShareIcon, SideNav, SideNavHeader, type SideNavHeaderProps, type SideNavProps, Sidebar, SidebarItem, type SidebarItemProps, type SidebarProps, Snackbar, type SnackbarProps, Step, StepButton, type StepButtonProps, StepContent, type StepContentProps, StepLabel, type StepLabelProps, type StepProps, Stepper, type StepperProps, StorageAppIcon, type SummaryItem, SummaryStats, type SummaryStatsProps, Switch, type SwitchProps, Tab, type TabProps, Table, TableHeader, type TableHeaderProps, type TableProps, TextField, type TextFieldProps, type TimeRangeOption, TimeRangeSelect, type TimeRangeSelectProps, TimeSeriesGraph, type TimeSeriesGraphProps, ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps, Tooltip, type TooltipProps, Truncate, type TruncateProps, UploadFileIcon, UploadFolderIcon, type UserInfo, WORKFLOW_NODE_LABELS, WORKFLOW_NODE_SHADOW, WorkflowNode, type WorkflowNodeData, WorkflowNodeHandle, type WorkflowNodeProps, type WorkflowNodeType, WorkflowSideInspector, type WorkflowSideInspectorProps, WorkflowTimeBar, type WorkflowTimeBarProps, WorkflowTopBar, type WorkflowTopBarProps, type Workspace, WorkspaceSelectorButton, type WorkspaceSelectorButtonProps, colors, contextMenuItems, robPaletteExtended, robPrimaryPalette, theme, useIsDesktop, useIsMobile, useIsTablet, useOnboarding, workflowConnectionColors, workflowNodeColors };
|
package/dist/index.d.ts
CHANGED
|
@@ -23,15 +23,16 @@ import { CardProps as CardProps$1 } from '@mui/material/Card';
|
|
|
23
23
|
import { CardContentProps } from '@mui/material/CardContent';
|
|
24
24
|
import { CardHeaderProps } from '@mui/material/CardHeader';
|
|
25
25
|
import { CardActionsProps } from '@mui/material/CardActions';
|
|
26
|
+
import { PaperProps as PaperProps$1 } from '@mui/material/Paper';
|
|
26
27
|
import { AvatarProps as AvatarProps$1 } from '@mui/material/Avatar';
|
|
27
28
|
import { BreadcrumbsProps as BreadcrumbsProps$1 } from '@mui/material/Breadcrumbs';
|
|
28
|
-
import { PaperProps as PaperProps$1 } from '@mui/material/Paper';
|
|
29
29
|
import { DividerProps as DividerProps$1 } from '@mui/material/Divider';
|
|
30
30
|
import { LinkProps as LinkProps$1 } from '@mui/material/Link';
|
|
31
|
+
import { BoxProps as BoxProps$1 } from '@mui/material/Box';
|
|
31
32
|
import { AlertProps as AlertProps$1 } from '@mui/material/Alert';
|
|
32
33
|
import { SnackbarProps as SnackbarProps$1 } from '@mui/material/Snackbar';
|
|
33
34
|
import { QRCodeProps as QRCodeProps$1 } from 'react-qr-code';
|
|
34
|
-
import { ReactFlowProps, Node, Edge, OnNodesChange, OnEdgesChange, NodeTypes, EdgeTypes, BackgroundVariant, ReactFlowInstance } from 'reactflow';
|
|
35
|
+
import { ReactFlowProps, Node, Edge, OnNodesChange, OnEdgesChange, NodeTypes, EdgeTypes, BackgroundVariant, ReactFlowInstance, NodeProps } from 'reactflow';
|
|
35
36
|
export { Background, BackgroundVariant, ConnectionLineType, Controls, Edge, EdgeTypes, MiniMap, Node, NodeTypes, OnEdgesChange, OnNodesChange, Panel, ReactFlowInstance } from 'reactflow';
|
|
36
37
|
import { Monaco } from '@monaco-editor/react';
|
|
37
38
|
import { editor } from 'monaco-editor';
|
|
@@ -43,12 +44,20 @@ declare module '@mui/material/styles' {
|
|
|
43
44
|
entity: typeof deploymentEntityColors;
|
|
44
45
|
status: typeof deploymentStatusColors;
|
|
45
46
|
};
|
|
47
|
+
workflow: {
|
|
48
|
+
node: typeof workflowNodeColors;
|
|
49
|
+
connection: typeof workflowConnectionColors;
|
|
50
|
+
};
|
|
46
51
|
}
|
|
47
52
|
interface PaletteOptions {
|
|
48
53
|
deployment?: {
|
|
49
54
|
entity?: Record<string, string>;
|
|
50
55
|
status?: Record<string, string>;
|
|
51
56
|
};
|
|
57
|
+
workflow?: {
|
|
58
|
+
node?: Record<string, string>;
|
|
59
|
+
connection?: Record<string, string>;
|
|
60
|
+
};
|
|
52
61
|
}
|
|
53
62
|
}
|
|
54
63
|
declare const colors: {
|
|
@@ -125,6 +134,29 @@ declare const deploymentStatusColors: {
|
|
|
125
134
|
disabled: string;
|
|
126
135
|
disabledDim: string;
|
|
127
136
|
};
|
|
137
|
+
declare const workflowNodeColors: {
|
|
138
|
+
readonly start: "#00C950";
|
|
139
|
+
readonly input: "#00A6F4";
|
|
140
|
+
readonly stream: "#00B8DB";
|
|
141
|
+
readonly rafts: "#FF6900";
|
|
142
|
+
readonly cubbies: "#D0C900";
|
|
143
|
+
readonly events: "#F6339A";
|
|
144
|
+
readonly trigger: "#AD46FF";
|
|
145
|
+
readonly action: "#2B7FFF";
|
|
146
|
+
readonly aiModel: "#615FFF";
|
|
147
|
+
readonly aiAgent: "#D0A2FB";
|
|
148
|
+
readonly condition: "#FE9A00";
|
|
149
|
+
readonly output: "#00BC7D";
|
|
150
|
+
readonly end: "#FB2C36";
|
|
151
|
+
readonly parallel: "#14B8A6";
|
|
152
|
+
readonly merge: "#6366F1";
|
|
153
|
+
};
|
|
154
|
+
declare const workflowConnectionColors: {
|
|
155
|
+
readonly success: "#22C55E";
|
|
156
|
+
readonly process: "#3B82F6";
|
|
157
|
+
readonly stream: "#06B6D4";
|
|
158
|
+
readonly error: "#EF4444";
|
|
159
|
+
};
|
|
128
160
|
/**
|
|
129
161
|
* ROB primary brand color palette (Figma node 11-1393)
|
|
130
162
|
* Four main brand colors for the ROB design system
|
|
@@ -1545,6 +1577,48 @@ interface DeploymentDashboardPanelProps {
|
|
|
1545
1577
|
}
|
|
1546
1578
|
declare const DeploymentDashboardPanel: React__default.FC<DeploymentDashboardPanelProps>;
|
|
1547
1579
|
|
|
1580
|
+
/** All supported workflow node types */
|
|
1581
|
+
type WorkflowNodeType = 'start' | 'input' | 'stream' | 'rafts' | 'cubbies' | 'events' | 'trigger' | 'action' | 'aiModel' | 'aiAgent' | 'condition' | 'output' | 'end' | 'parallel' | 'merge';
|
|
1582
|
+
interface WorkflowNodeProps extends Omit<PaperProps$1, 'title'> {
|
|
1583
|
+
/** The workflow node type — drives accent color, default icon, and badge label */
|
|
1584
|
+
nodeType: WorkflowNodeType;
|
|
1585
|
+
/** Primary title displayed in the node */
|
|
1586
|
+
title: string;
|
|
1587
|
+
/** Optional description text below the title */
|
|
1588
|
+
description?: string;
|
|
1589
|
+
/** Override the default icon for this node type */
|
|
1590
|
+
icon?: React__default.ReactNode;
|
|
1591
|
+
/** Override the default badge label for this node type */
|
|
1592
|
+
badgeLabel?: string;
|
|
1593
|
+
/** Whether the node is currently selected (highlights border with accent color) */
|
|
1594
|
+
selected?: boolean;
|
|
1595
|
+
/** Optional className */
|
|
1596
|
+
className?: string;
|
|
1597
|
+
/** Renders left/right connector dots to match the design spec */
|
|
1598
|
+
showSideDots?: boolean;
|
|
1599
|
+
}
|
|
1600
|
+
/** Human-readable labels for each node type (matches Figma badge text) */
|
|
1601
|
+
declare const WORKFLOW_NODE_LABELS: Record<WorkflowNodeType, string>;
|
|
1602
|
+
/** Shared elevation shadow for workflow node cards and connector handles (Figma 277-8244) */
|
|
1603
|
+
declare const WORKFLOW_NODE_SHADOW = "0px 1px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.1)";
|
|
1604
|
+
/**
|
|
1605
|
+
* WorkflowNode — visual card for a workflow editor node.
|
|
1606
|
+
*
|
|
1607
|
+
* Renders a card with a colored left border strip, title, optional description,
|
|
1608
|
+
* and a type badge/chip. Designed to integrate with FlowEditor (ReactFlow)
|
|
1609
|
+
* via the WorkflowNodeHandle wrapper.
|
|
1610
|
+
*
|
|
1611
|
+
* @example
|
|
1612
|
+
* ```tsx
|
|
1613
|
+
* <WorkflowNode
|
|
1614
|
+
* nodeType="trigger"
|
|
1615
|
+
* title="HTTP Trigger"
|
|
1616
|
+
* description="Listens for incoming webhook calls"
|
|
1617
|
+
* />
|
|
1618
|
+
* ```
|
|
1619
|
+
*/
|
|
1620
|
+
declare const WorkflowNode: React__default.FC<WorkflowNodeProps>;
|
|
1621
|
+
|
|
1548
1622
|
interface AvatarProps extends AvatarProps$1 {
|
|
1549
1623
|
size?: 'small' | 'medium' | 'large' | number;
|
|
1550
1624
|
}
|
|
@@ -1604,6 +1678,105 @@ interface AppBarProps extends AppBarProps$1 {
|
|
|
1604
1678
|
}
|
|
1605
1679
|
declare const AppBar: React__default.FC<AppBarProps>;
|
|
1606
1680
|
|
|
1681
|
+
interface WorkflowTopBarProps extends Omit<BoxProps$1, 'title'> {
|
|
1682
|
+
/** Heading shown at the left side of the bar. */
|
|
1683
|
+
title?: string;
|
|
1684
|
+
/** Execution identifier displayed in the CID field. */
|
|
1685
|
+
executionId: string;
|
|
1686
|
+
/** Called when the execution ID value changes. */
|
|
1687
|
+
onExecutionIdChange?: (value: string) => void;
|
|
1688
|
+
/** Called when the execution ID clear action is pressed. */
|
|
1689
|
+
onClearExecutionId?: () => void;
|
|
1690
|
+
/** Submit button label. */
|
|
1691
|
+
submitLabel?: string;
|
|
1692
|
+
/** Called when submit is pressed. */
|
|
1693
|
+
onSubmit?: () => void;
|
|
1694
|
+
/** Inspector toggle button label. */
|
|
1695
|
+
inspectorLabel?: string;
|
|
1696
|
+
/** Called when inspector toggle is pressed. */
|
|
1697
|
+
onInspectorToggle?: () => void;
|
|
1698
|
+
/** Called when close is pressed. */
|
|
1699
|
+
onClose?: () => void;
|
|
1700
|
+
/** Hides/shows the inspector toggle button. */
|
|
1701
|
+
showInspectorToggle?: boolean;
|
|
1702
|
+
/** Hides/shows the close icon action. */
|
|
1703
|
+
showCloseButton?: boolean;
|
|
1704
|
+
}
|
|
1705
|
+
/**
|
|
1706
|
+
* WorkflowTopBar
|
|
1707
|
+
*
|
|
1708
|
+
* Top chrome bar for workflow canvas screens based on Figma 277:8006.
|
|
1709
|
+
*/
|
|
1710
|
+
declare const WorkflowTopBar: React__default.FC<WorkflowTopBarProps>;
|
|
1711
|
+
|
|
1712
|
+
interface WorkflowSideInspectorProps extends PaperProps$1 {
|
|
1713
|
+
/** Controls panel visibility for simple layouts. */
|
|
1714
|
+
open?: boolean;
|
|
1715
|
+
/** Header title. */
|
|
1716
|
+
title?: string;
|
|
1717
|
+
/** Selected node headline. */
|
|
1718
|
+
nodeTitle?: string;
|
|
1719
|
+
/** Selected node description. */
|
|
1720
|
+
nodeDescription?: string;
|
|
1721
|
+
/** Selected node type for the colored tag. */
|
|
1722
|
+
nodeType?: WorkflowNodeType;
|
|
1723
|
+
/** Input field value shown in details section. */
|
|
1724
|
+
inputValue?: string;
|
|
1725
|
+
/** Output field value shown in details section. */
|
|
1726
|
+
outputValue?: string;
|
|
1727
|
+
/** Cubby ID value shown in copy button. */
|
|
1728
|
+
cubbyId?: string;
|
|
1729
|
+
/** Timestamp value shown in metadata section. */
|
|
1730
|
+
timestamp?: string;
|
|
1731
|
+
/** Duration value shown in metadata section. */
|
|
1732
|
+
duration?: string;
|
|
1733
|
+
/** Bottom CTA label. */
|
|
1734
|
+
actionLabel?: string;
|
|
1735
|
+
/** Called when close button is pressed. */
|
|
1736
|
+
onClose?: () => void;
|
|
1737
|
+
/** Called when cubby copy button is pressed. */
|
|
1738
|
+
onCopyCubbyId?: () => void;
|
|
1739
|
+
/** Called when bottom CTA is pressed. */
|
|
1740
|
+
onAction?: () => void;
|
|
1741
|
+
}
|
|
1742
|
+
/**
|
|
1743
|
+
* WorkflowSideInspector
|
|
1744
|
+
*
|
|
1745
|
+
* Right-side inspector panel based on Figma 277:8100.
|
|
1746
|
+
*/
|
|
1747
|
+
declare const WorkflowSideInspector: React__default.FC<WorkflowSideInspectorProps>;
|
|
1748
|
+
|
|
1749
|
+
interface WorkflowTimeBarProps extends BoxProps$1 {
|
|
1750
|
+
/** Elapsed time label shown above the progress line. */
|
|
1751
|
+
elapsedTime?: string;
|
|
1752
|
+
/** Progress from 0 to 100. */
|
|
1753
|
+
progress?: number;
|
|
1754
|
+
/** Current step index for the step indicator. */
|
|
1755
|
+
currentStep?: number;
|
|
1756
|
+
/** Total number of steps for the step indicator. */
|
|
1757
|
+
totalSteps?: number;
|
|
1758
|
+
/** Available speed options (e.g. 0.5x, 1x, 2x). */
|
|
1759
|
+
speedOptions?: number[];
|
|
1760
|
+
/** Currently selected speed value. */
|
|
1761
|
+
selectedSpeed?: number;
|
|
1762
|
+
/** Called when stop is pressed. */
|
|
1763
|
+
onStop?: () => void;
|
|
1764
|
+
/** Called when previous step is pressed. */
|
|
1765
|
+
onPreviousStep?: () => void;
|
|
1766
|
+
/** Called when next step is pressed. */
|
|
1767
|
+
onNextStep?: () => void;
|
|
1768
|
+
/** Called when a speed option is selected. */
|
|
1769
|
+
onSpeedChange?: (speed: number) => void;
|
|
1770
|
+
/** Called when refresh is pressed. */
|
|
1771
|
+
onReset?: () => void;
|
|
1772
|
+
}
|
|
1773
|
+
/**
|
|
1774
|
+
* WorkflowTimeBar
|
|
1775
|
+
*
|
|
1776
|
+
* Bottom chrome bar for workflow playback controls based on Figma 277:8087.
|
|
1777
|
+
*/
|
|
1778
|
+
declare const WorkflowTimeBar: React__default.FC<WorkflowTimeBarProps>;
|
|
1779
|
+
|
|
1607
1780
|
interface CollapseProps extends CollapseProps$1 {
|
|
1608
1781
|
/**
|
|
1609
1782
|
* If `true`, the component will transition in
|
|
@@ -2179,4 +2352,31 @@ interface CodeEditorProps {
|
|
|
2179
2352
|
*/
|
|
2180
2353
|
declare const CodeEditor: React__default.FC<CodeEditorProps>;
|
|
2181
2354
|
|
|
2182
|
-
|
|
2355
|
+
/** Data shape expected by the WorkflowNodeHandle custom ReactFlow node */
|
|
2356
|
+
interface WorkflowNodeData {
|
|
2357
|
+
/** Workflow node type — drives accent color, icon, and badge */
|
|
2358
|
+
nodeType: WorkflowNodeType;
|
|
2359
|
+
/** Primary title */
|
|
2360
|
+
title: string;
|
|
2361
|
+
/** Optional description */
|
|
2362
|
+
description?: string;
|
|
2363
|
+
/** Override default icon */
|
|
2364
|
+
icon?: React__default.ReactNode;
|
|
2365
|
+
/** Override default badge label */
|
|
2366
|
+
badgeLabel?: string;
|
|
2367
|
+
}
|
|
2368
|
+
/**
|
|
2369
|
+
* Thin ReactFlow custom-node wrapper around WorkflowNode.
|
|
2370
|
+
*
|
|
2371
|
+
* Renders a target Handle (top), the WorkflowNode card, and a source Handle (bottom).
|
|
2372
|
+
* Register as a custom nodeType:
|
|
2373
|
+
*
|
|
2374
|
+
* @example
|
|
2375
|
+
* ```tsx
|
|
2376
|
+
* const nodeTypes = { workflowNode: WorkflowNodeHandle };
|
|
2377
|
+
* <FlowEditor nodes={nodes} edges={edges} nodeTypes={nodeTypes} />
|
|
2378
|
+
* ```
|
|
2379
|
+
*/
|
|
2380
|
+
declare const WorkflowNodeHandle: React__default.FC<NodeProps<WorkflowNodeData>>;
|
|
2381
|
+
|
|
2382
|
+
export { Accordion, type AccordionProps, AccountSection, type AccountSectionProps, ActivityAppIcon, Alert, type AlertProps, type AlertSeverity, AppBar, type AppBarProps, AppLoading, type AppLoadingProps, Avatar, AvatarIcon, type AvatarProps, Badge, type BadgeProps, BarTrackingIcon, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, BytesSize, type BytesSizeProps, Card, CardActions, CardContent, CardHeader, type CardProps, CereIcon, ChartWidget, type ChartWidgetProps, CheckMarkAnimation, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, type CircularProgressProps, ClockIcon, CloudFlashIcon, CodeEditor, type CodeEditorLanguage, type CodeEditorProps, Collapse, type CollapseProps, ConnectionStatus, type ConnectionStatusProps, type ContextMenuItem, type DataPoint, type DataSeries, DateRangePicker, type DateRangePickerProps, DecentralizedServerIcon, type DeploymentCardAction, DeploymentDashboardCard, type DeploymentDashboardCardProps, DeploymentDashboardPanel, type DeploymentDashboardPanelProps, DeploymentDashboardTree, type DeploymentDashboardTreeProps, DeploymentEntityContextMenu, type DeploymentEntityContextMenuProps, type DeploymentEntityType, type DeploymentStatusIndicator, type DeploymentTreeNode, Dialog, type DialogProps, DiscordIcon, Divider, type DividerProps, DownloadIcon, Drawer, type DrawerProps, Dropdown, DropdownAnchor, type DropdownAnchorProps, type DropdownProps, EmptyState, type EmptyStateProps, EntityHeader, type EntityHeaderProps, FilledFolderIcon, FlowEditor, type FlowEditorProps, FolderIcon, GithubLogoIcon, IDBlock, type IDBlockProps, IconButton, type IconButtonProps, LeftArrowIcon, Link, type LinkProps, List, ListItem, type ListItemProps, type ListProps, Loading, LoadingAnimation, type LoadingAnimationProps, LoadingButton, type LoadingButtonProps, type LoadingProps, Logo, type LogoProps, Markdown, type MarkdownProps, Menu, MenuItem, type MenuItemProps, type MenuProps, MetricsChart, type MetricsChartProps, type MetricsPeriod, NavigationItem, type NavigationItemProps, NavigationList, type NavigationListProps, OnboardingProvider, Pagination, type PaginationProps, Paper, type PaperProps, PeriodSelect, type PrimaryAction, Progress, type ProgressProps, QRCode, type QRCodeProps, Radio, type RadioProps, RightArrowIcon, RoleBadge, type RoleBadgeColor, type RoleBadgeProps, type RoleBadgeSize, SearchField, type SearchFieldProps, Selector, type SelectorOption, type SelectorProps, type Service, ServiceSelectorButton, type ServiceSelectorButtonProps, ShareIcon, SideNav, SideNavHeader, type SideNavHeaderProps, type SideNavProps, Sidebar, SidebarItem, type SidebarItemProps, type SidebarProps, Snackbar, type SnackbarProps, Step, StepButton, type StepButtonProps, StepContent, type StepContentProps, StepLabel, type StepLabelProps, type StepProps, Stepper, type StepperProps, StorageAppIcon, type SummaryItem, SummaryStats, type SummaryStatsProps, Switch, type SwitchProps, Tab, type TabProps, Table, TableHeader, type TableHeaderProps, type TableProps, TextField, type TextFieldProps, type TimeRangeOption, TimeRangeSelect, type TimeRangeSelectProps, TimeSeriesGraph, type TimeSeriesGraphProps, ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps, Tooltip, type TooltipProps, Truncate, type TruncateProps, UploadFileIcon, UploadFolderIcon, type UserInfo, WORKFLOW_NODE_LABELS, WORKFLOW_NODE_SHADOW, WorkflowNode, type WorkflowNodeData, WorkflowNodeHandle, type WorkflowNodeProps, type WorkflowNodeType, WorkflowSideInspector, type WorkflowSideInspectorProps, WorkflowTimeBar, type WorkflowTimeBarProps, WorkflowTopBar, type WorkflowTopBarProps, type Workspace, WorkspaceSelectorButton, type WorkspaceSelectorButtonProps, colors, contextMenuItems, robPaletteExtended, robPrimaryPalette, theme, useIsDesktop, useIsMobile, useIsTablet, useOnboarding, workflowConnectionColors, workflowNodeColors };
|