@mindlogic-ai/logician-ui 3.1.0-alpha.9 → 3.2.0-alpha.0

package/dist/components/Workflow/canvas/NodeShell/NodeShell.mjs

@@ -0,0 +1,135 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Stack, HStack, Box } from '@chakra-ui/react';
+import { Handle, Position } from '@xyflow/react';
+import { Card } from '../../../Card/Card.mjs';
+import { Chip } from '../../../Chip/Chip.mjs';
+import { StickyNote, AlertTriangle } from '../../../Icon/index.mjs';
+import '../../../Typography/H1.mjs';
+import '../../../Typography/H2.mjs';
+import '../../../Typography/H3.mjs';
+import '../../../Typography/H4.mjs';
+import '../../../Typography/H5.mjs';
+import '../../../Typography/Link.mjs';
+import { Subtext } from '../../../Typography/Subtext.mjs';
+import '../../../Typography/Subtitle.mjs';
+import '../../../Typography/Text.mjs';
+import { BranchLabelBadge } from '../Canvas/BranchLabelBadge.mjs';
+import { getEdgeLabelVariant } from '../Canvas/edgeLabelVariant.mjs';
+import { IconTile } from '../IconTile/IconTile.mjs';
+import { getCategoryTokens } from '../IconTile/IconTile.styles.mjs';
+import { MAX_META_CHIPS, CARD_WIDTH, getPortTop, PORT_STYLE, NODE_MIN_HEIGHT, PORT_GAP, PORT_EDGE_PAD, metaChipToneStyles, metaChipStyles } from './NodeShell.styles.mjs';
+
+/**
+ * Compact pill for the canvas node's meta row. Wraps logician-ui Chip
+ * and overrides its chunky default padding/radius via `metaChipStyles`.
+ * Tone tints the chip (e.g. an unknown model on an Agent node).
+ */
+function MetaChip({ children, tone = 'default', }) {
+    return (jsx(Chip, { ...metaChipStyles, ...metaChipToneStyles[tone], children: children }));
+}
+function normalizeChip(spec) {
+    return typeof spec === 'string'
+        ? { text: spec, tone: 'default' }
+        : { text: spec.text, tone: spec.tone ?? 'default' };
+}
+/**
+ * Ring + body-border treatment per state. Notes keep their warm border in
+ * all states but still surface the primary ring when selected so the active
+ * annotation is visible.
+ *
+ * Precedence for the ring color: running > error > selected > warning.
+ * The default-case border is `slate.300`.
+ */
+function getRingChrome(category, selected, hasError, hasWarning, runState, noteBorder) {
+    if (category === 'note') {
+        if (selected) {
+            return {
+                borderColor: noteBorder,
+                outline: '3px solid',
+                outlineColor: 'primary.lighter',
+            };
+        }
+        return { borderColor: noteBorder };
+    }
+    if (runState === 'running') {
+        return {
+            borderColor: 'primary.main',
+            outline: '3px solid',
+            outlineColor: 'primary.lighter',
+        };
+    }
+    if (hasError) {
+        return {
+            borderColor: 'danger.main',
+            outline: '3px solid',
+            outlineColor: 'danger.lighter',
+        };
+    }
+    if (selected) {
+        return {
+            borderColor: 'primary.main',
+            outline: '3px solid',
+            outlineColor: 'primary.lighter',
+        };
+    }
+    if (hasWarning)
+        return { borderColor: 'warning.main' };
+    return { borderColor: 'slate.300' };
+}
+/**
+ * Header glyph independently selected from the ring. Error wins over
+ * warning wins over running's status dot — so an error inside a running
+ * node still surfaces the alert, instead of being hidden by the green
+ * dot.
+ */
+function getHeaderBadge(hasError, hasWarning, runState) {
+    if (hasError) {
+        return (jsx(Box, { color: "danger.main", display: "flex", alignItems: "center", children: jsx(AlertTriangle, { boxSize: "xs" }) }));
+    }
+    if (hasWarning) {
+        return (jsx(Box, { color: "warning.dark", display: "flex", alignItems: "center", children: jsx(AlertTriangle, { boxSize: "xs" }) }));
+    }
+    if (runState === 'running') {
+        return (jsx(Box, { boxSize: "2.5", borderRadius: "full", bg: "success.main", outline: "3px solid", outlineColor: "success.lighter" }));
+    }
+    return null;
+}
+function NodeShell({ label, instanceTitle, metaChips, category, icon, selected, runState, issues, inputs, outputs, connectedOutputIds, categoryTokens, customBody, }) {
+    const hasError = issues.some((i) => i.severity === 'error');
+    const hasWarning = !hasError && issues.some((i) => i.severity === 'warning');
+    const tokens = getCategoryTokens(category, categoryTokens);
+    const ring = getRingChrome(category, selected, hasError, hasWarning, runState, tokens.border);
+    const badge = getHeaderBadge(hasError, hasWarning, runState);
+    const isNote = category === 'note';
+    const chips = (metaChips ?? []).slice(0, MAX_META_CHIPS).map(normalizeChip);
+    const overflowChip = metaChips && metaChips.length > MAX_META_CHIPS
+        ? `+${metaChips.length - MAX_META_CHIPS}`
+        : null;
+    // Grow the card so ports stay evenly spread without crowding: the busiest
+    // side drives the height — the inter-port gaps plus a tight top/bottom edge
+    // pad — floored at NODE_MIN_HEIGHT. Notes carry no ports and size to their
+    // text, so they opt out.
+    const portCount = Math.max(inputs.length, outputs.length);
+    const minHeight = isNote
+        ? undefined
+        : `${Math.max(NODE_MIN_HEIGHT, PORT_GAP * Math.max(portCount - 1, 0) + PORT_EDGE_PAD * 2)}px`;
+    return (jsxs(Card, { width: CARD_WIDTH, minHeight: minHeight, p: 0, borderRadius: "lg", borderColor: ring.borderColor, outline: ring.outline, outlineColor: ring.outlineColor, boxShadow: "sm", bg: isNote ? tokens.bg : 'bg.surface', position: "relative", 
+        // Center the body within the port-driven min-height so a content-light
+        // node (e.g. Start) sits mid-card rather than pinned to the top edge.
+        display: "flex", flexDirection: "column", justifyContent: "center", children: [isNote ? (jsxs(Stack, { gap: 1, px: 3, py: 2, children: [jsxs(HStack, { gap: 1, color: "warning.dark", fontWeight: "bold", letterSpacing: "wider", textTransform: "uppercase", children: [jsx(StickyNote, { boxSize: "xs" }), jsx(Subtext, { color: "warning.dark", fontWeight: "bold", children: "Note" })] }), customBody ?? (jsx(Subtext, { color: "slate.1200", lineHeight: 1.45, children: instanceTitle ?? label }))] })) : ((customBody ?? (jsxs(Stack, { gap: 0, children: [jsxs(HStack, { gap: 2, px: 3, pt: 2, pb: chips.length || overflowChip ? 1 : 2, children: [jsx(IconTile, { category: category, icon: icon, tokens: categoryTokens }), jsxs(Stack, { gap: 0, flex: 1, minWidth: 0, children: [jsx(Subtext, { fontWeight: "semibold", color: "slate.1200", lineClamp: 1, children: label }), instanceTitle ? (jsx(Subtext, { color: "slate.900", lineClamp: 1, children: instanceTitle })) : null] }), badge] }), chips.length || overflowChip ? (jsxs(HStack, { px: 3, pb: 2, gap: 1, flexWrap: "wrap", children: [chips.map((chip) => (jsx(MetaChip, { tone: chip.tone, children: chip.text }, chip.text))), overflowChip ? jsx(MetaChip, { children: overflowChip }) : null] })) : null] })))), inputs.map((h, i) => (jsx(Handle, { id: h.id, type: "target", position: Position.Left, style: {
+                    ...PORT_STYLE,
+                    top: getPortTop(i, inputs.length),
+                } }, `in-${h.id}`))), outputs.map((h, i) => (jsx(Handle, { id: h.id, type: "source", position: Position.Right, style: {
+                    ...PORT_STYLE,
+                    top: getPortTop(i, outputs.length),
+                }, children: h.label && !connectedOutputIds?.has(h.id) ? (
+                // Same badge as the connected edge carries (see BranchLabelBadge),
+                // so disconnecting/connecting reads as the chip relocating rather
+                // than restyling. `pointerEvents="none"` keeps the handle draggable
+                // through the label.
+                jsx(Box, { position: "absolute", left: "14px", top: "50%", transform: "translateY(-50%)", whiteSpace: "nowrap", pointerEvents: "none", children: jsx(BranchLabelBadge, { variant: getEdgeLabelVariant(h.id), children: h.label }) })) : null }, `out-${h.id}`)))] }));
+}
+
+export { NodeShell };
+//# sourceMappingURL=NodeShell.mjs.map

package/dist/components/Workflow/canvas/NodeShell/NodeShell.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeShell.mjs","sources":["../../../../../src/components/Workflow/canvas/NodeShell/NodeShell.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/components/Workflow/canvas/NodeShell/NodeShell.styles.d.ts

@@ -0,0 +1,66 @@
+import type { PortStyle } from './NodeShell.types';
+export declare const CARD_WIDTH = "174px";
+/**
+ * Floor height (px) for a canvas node so a content-light node (e.g. Start,
+ * whose header is just an icon + label) doesn't render as a cramped sliver.
+ * Composed into a px string at the call site — a raw number would be read as
+ * a Chakra spacing token, not pixels.
+ */
+export declare const NODE_MIN_HEIGHT = 64;
+/**
+ * Vertical gap (px) between adjacent ports. Ports are stacked symmetrically
+ * around the card's vertical centre (see `portTop` in NodeShell), so a node
+ * with `n` ports reserves `PORT_GAP * (n - 1)` between the first and last —
+ * enough that a many-branch node's exits (Classify, If/Else) don't squish
+ * together or collide their labels.
+ */
+export declare const PORT_GAP = 28;
+/**
+ * Padding (px) above the first port and below the last. Kept deliberately
+ * tighter than `PORT_GAP` so a busy node (e.g. Classify with many categories)
+ * doesn't grow taller than it needs to — the old percentage spread forced this
+ * edge gap to equal the inter-port gap, which read as too much dead space.
+ */
+export declare const PORT_EDGE_PAD = 14;
+/**
+ * Vertical offset for the `i`-th of `count` ports, expressed relative to the
+ * card's centre. Stacking them around the middle (rather than spreading them
+ * across the full height) keeps a single port dead-centre and lets the top /
+ * bottom edge padding shrink to `PORT_EDGE_PAD` independently of `PORT_GAP`,
+ * so a busy node isn't padded out taller than it needs to be.
+ */
+export declare function getPortTop(index: number, count: number): string;
+/** Cap on the meta-chip row so a node with many badges can't grow unboundedly. */
+export declare const MAX_META_CHIPS = 4;
+export declare const PORT_STYLE: PortStyle;
+/**
+ * Compact pill styling for the canvas node's meta row. Overrides logician-ui
+ * Chip's chunky defaults so a row of badges fits on a 174px-wide card,
+ * but the font size stays on the `sm` theme token — no sub-`sm` sizes
+ * in the editor.
+ */
+export declare const metaChipStyles: {
+    variant: "soft";
+    colorPalette: "neutral";
+    fontWeight: string;
+    px: number;
+    py: number;
+    borderRadius: string;
+};
+/**
+ * Per-tone color overrides applied on top of `metaChipStyles`. `default`
+ * is empty so the base styles win; `danger`/`warning` tint the chip when
+ * a sub-value (e.g. an unknown model) is invalid.
+ */
+export declare const metaChipToneStyles: {
+    readonly default: {};
+    readonly danger: {
+        readonly bg: "danger.lightest";
+        readonly color: "danger.dark";
+    };
+    readonly warning: {
+        readonly bg: "warning.lightest";
+        readonly color: "warning.dark";
+    };
+};
+//# sourceMappingURL=NodeShell.styles.d.ts.map

package/dist/components/Workflow/canvas/NodeShell/NodeShell.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeShell.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Workflow/canvas/NodeShell/NodeShell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEnD,eAAO,MAAM,UAAU,UAAU,CAAC;AAElC;;;;;GAKG;AACH,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,KAAK,CAAC;AAE3B;;;;;GAKG;AACH,eAAO,MAAM,aAAa,KAAK,CAAC;AAEhC;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAG/D;AAED,kFAAkF;AAClF,eAAO,MAAM,cAAc,IAAI,CAAC;AAUhC,eAAO,MAAM,UAAU,EAAE,SAKxB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,cAAc;;;;;;;CAO1B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;CAIrB,CAAC"}

package/dist/components/Workflow/canvas/NodeShell/NodeShell.styles.js

@@ -0,0 +1,87 @@
+"use client";
+'use strict';
+
+const CARD_WIDTH = '174px';
+/**
+ * Floor height (px) for a canvas node so a content-light node (e.g. Start,
+ * whose header is just an icon + label) doesn't render as a cramped sliver.
+ * Composed into a px string at the call site — a raw number would be read as
+ * a Chakra spacing token, not pixels.
+ */
+const NODE_MIN_HEIGHT = 64;
+/**
+ * Vertical gap (px) between adjacent ports. Ports are stacked symmetrically
+ * around the card's vertical centre (see `portTop` in NodeShell), so a node
+ * with `n` ports reserves `PORT_GAP * (n - 1)` between the first and last —
+ * enough that a many-branch node's exits (Classify, If/Else) don't squish
+ * together or collide their labels.
+ */
+const PORT_GAP = 28;
+/**
+ * Padding (px) above the first port and below the last. Kept deliberately
+ * tighter than `PORT_GAP` so a busy node (e.g. Classify with many categories)
+ * doesn't grow taller than it needs to — the old percentage spread forced this
+ * edge gap to equal the inter-port gap, which read as too much dead space.
+ */
+const PORT_EDGE_PAD = 14;
+/**
+ * Vertical offset for the `i`-th of `count` ports, expressed relative to the
+ * card's centre. Stacking them around the middle (rather than spreading them
+ * across the full height) keeps a single port dead-centre and lets the top /
+ * bottom edge padding shrink to `PORT_EDGE_PAD` independently of `PORT_GAP`,
+ * so a busy node isn't padded out taller than it needs to be.
+ */
+function getPortTop(index, count) {
+    const offset = (index - (count - 1) / 2) * PORT_GAP;
+    return `calc(50% + ${offset}px)`;
+}
+/** Cap on the meta-chip row so a node with many badges can't grow unboundedly. */
+const MAX_META_CHIPS = 4;
+/**
+ * React Flow `<Handle>` takes inline SVG-style props rather than Chakra
+ * tokens, so port colors are spelled as CSS vars from the theme.
+ */
+function colorVar(token) {
+    return `var(--chakra-colors-${token.replace(/\./g, '-')})`;
+}
+const PORT_STYLE = {
+    width: 8,
+    height: 8,
+    background: colorVar('bg.surface'),
+    border: `1.5px solid ${colorVar('slate.700')}`,
+};
+/**
+ * Compact pill styling for the canvas node's meta row. Overrides logician-ui
+ * Chip's chunky defaults so a row of badges fits on a 174px-wide card,
+ * but the font size stays on the `sm` theme token — no sub-`sm` sizes
+ * in the editor.
+ */
+const metaChipStyles = {
+    variant: 'soft',
+    colorPalette: 'neutral',
+    fontWeight: 'medium',
+    px: 2,
+    py: 0.5,
+    borderRadius: 'sm',
+};
+/**
+ * Per-tone color overrides applied on top of `metaChipStyles`. `default`
+ * is empty so the base styles win; `danger`/`warning` tint the chip when
+ * a sub-value (e.g. an unknown model) is invalid.
+ */
+const metaChipToneStyles = {
+    default: {},
+    danger: { bg: 'danger.lightest', color: 'danger.dark' },
+    warning: { bg: 'warning.lightest', color: 'warning.dark' },
+};
+
+exports.CARD_WIDTH = CARD_WIDTH;
+exports.MAX_META_CHIPS = MAX_META_CHIPS;
+exports.NODE_MIN_HEIGHT = NODE_MIN_HEIGHT;
+exports.PORT_EDGE_PAD = PORT_EDGE_PAD;
+exports.PORT_GAP = PORT_GAP;
+exports.PORT_STYLE = PORT_STYLE;
+exports.getPortTop = getPortTop;
+exports.metaChipStyles = metaChipStyles;
+exports.metaChipToneStyles = metaChipToneStyles;
+//# sourceMappingURL=NodeShell.styles.js.map

package/dist/components/Workflow/canvas/NodeShell/NodeShell.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeShell.styles.js","sources":["../../../../../src/components/Workflow/canvas/NodeShell/NodeShell.styles.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAEO,MAAM,UAAU,GAAG;AAE1B;;;;;AAKG;AACI,MAAM,eAAe,GAAG;AAE/B;;;;;;AAMG;AACI,MAAM,QAAQ,GAAG;AAExB;;;;;AAKG;AACI,MAAM,aAAa,GAAG;AAE7B;;;;;;AAMG;AACG,SAAU,UAAU,CAAC,KAAa,EAAE,KAAa,EAAA;AACrD,IAAA,MAAM,MAAM,GAAG,CAAC,KAAK,GAAG,CAAC,KAAK,GAAG,CAAC,IAAI,CAAC,IAAI,QAAQ;IACnD,OAAO,CAAA,WAAA,EAAc,MAAM,CAAA,GAAA,CAAK;AAClC;AAEA;AACO,MAAM,cAAc,GAAG;AAE9B;;;AAGG;AACH,SAAS,QAAQ,CAAC,KAAa,EAAA;IAC7B,OAAO,CAAA,oBAAA,EAAuB,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA,CAAA,CAAG;AAC5D;AAEO,MAAM,UAAU,GAAc;AACnC,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,MAAM,EAAE,CAAC;AACT,IAAA,UAAU,EAAE,QAAQ,CAAC,YAAY,CAAC;AAClC,IAAA,MAAM,EAAE,CAAA,YAAA,EAAe,QAAQ,CAAC,WAAW,CAAC,CAAA,CAAE;;AAGhD;;;;;AAKG;AACI,MAAM,cAAc,GAAG;AAC5B,IAAA,OAAO,EAAE,MAAe;AACxB,IAAA,YAAY,EAAE,SAAkB;AAChC,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,EAAE,EAAE,CAAC;AACL,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,YAAY,EAAE,IAAI;;AAGpB;;;;AAIG;AACI,MAAM,kBAAkB,GAAG;AAChC,IAAA,OAAO,EAAE,EAAE;IACX,MAAM,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE,KAAK,EAAE,aAAa,EAAE;IACvD,OAAO,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,cAAc,EAAE;;;;;;;;;;;;;"}

package/dist/components/Workflow/canvas/NodeShell/NodeShell.styles.mjs

@@ -0,0 +1,77 @@
+"use client";
+const CARD_WIDTH = '174px';
+/**
+ * Floor height (px) for a canvas node so a content-light node (e.g. Start,
+ * whose header is just an icon + label) doesn't render as a cramped sliver.
+ * Composed into a px string at the call site — a raw number would be read as
+ * a Chakra spacing token, not pixels.
+ */
+const NODE_MIN_HEIGHT = 64;
+/**
+ * Vertical gap (px) between adjacent ports. Ports are stacked symmetrically
+ * around the card's vertical centre (see `portTop` in NodeShell), so a node
+ * with `n` ports reserves `PORT_GAP * (n - 1)` between the first and last —
+ * enough that a many-branch node's exits (Classify, If/Else) don't squish
+ * together or collide their labels.
+ */
+const PORT_GAP = 28;
+/**
+ * Padding (px) above the first port and below the last. Kept deliberately
+ * tighter than `PORT_GAP` so a busy node (e.g. Classify with many categories)
+ * doesn't grow taller than it needs to — the old percentage spread forced this
+ * edge gap to equal the inter-port gap, which read as too much dead space.
+ */
+const PORT_EDGE_PAD = 14;
+/**
+ * Vertical offset for the `i`-th of `count` ports, expressed relative to the
+ * card's centre. Stacking them around the middle (rather than spreading them
+ * across the full height) keeps a single port dead-centre and lets the top /
+ * bottom edge padding shrink to `PORT_EDGE_PAD` independently of `PORT_GAP`,
+ * so a busy node isn't padded out taller than it needs to be.
+ */
+function getPortTop(index, count) {
+    const offset = (index - (count - 1) / 2) * PORT_GAP;
+    return `calc(50% + ${offset}px)`;
+}
+/** Cap on the meta-chip row so a node with many badges can't grow unboundedly. */
+const MAX_META_CHIPS = 4;
+/**
+ * React Flow `<Handle>` takes inline SVG-style props rather than Chakra
+ * tokens, so port colors are spelled as CSS vars from the theme.
+ */
+function colorVar(token) {
+    return `var(--chakra-colors-${token.replace(/\./g, '-')})`;
+}
+const PORT_STYLE = {
+    width: 8,
+    height: 8,
+    background: colorVar('bg.surface'),
+    border: `1.5px solid ${colorVar('slate.700')}`,
+};
+/**
+ * Compact pill styling for the canvas node's meta row. Overrides logician-ui
+ * Chip's chunky defaults so a row of badges fits on a 174px-wide card,
+ * but the font size stays on the `sm` theme token — no sub-`sm` sizes
+ * in the editor.
+ */
+const metaChipStyles = {
+    variant: 'soft',
+    colorPalette: 'neutral',
+    fontWeight: 'medium',
+    px: 2,
+    py: 0.5,
+    borderRadius: 'sm',
+};
+/**
+ * Per-tone color overrides applied on top of `metaChipStyles`. `default`
+ * is empty so the base styles win; `danger`/`warning` tint the chip when
+ * a sub-value (e.g. an unknown model) is invalid.
+ */
+const metaChipToneStyles = {
+    default: {},
+    danger: { bg: 'danger.lightest', color: 'danger.dark' },
+    warning: { bg: 'warning.lightest', color: 'warning.dark' },
+};
+
+export { CARD_WIDTH, MAX_META_CHIPS, NODE_MIN_HEIGHT, PORT_EDGE_PAD, PORT_GAP, PORT_STYLE, getPortTop, metaChipStyles, metaChipToneStyles };
+//# sourceMappingURL=NodeShell.styles.mjs.map

package/dist/components/Workflow/canvas/NodeShell/NodeShell.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeShell.styles.mjs","sources":["../../../../../src/components/Workflow/canvas/NodeShell/NodeShell.styles.ts"],"sourcesContent":[null],"names":[],"mappings":";AAEO,MAAM,UAAU,GAAG;AAE1B;;;;;AAKG;AACI,MAAM,eAAe,GAAG;AAE/B;;;;;;AAMG;AACI,MAAM,QAAQ,GAAG;AAExB;;;;;AAKG;AACI,MAAM,aAAa,GAAG;AAE7B;;;;;;AAMG;AACG,SAAU,UAAU,CAAC,KAAa,EAAE,KAAa,EAAA;AACrD,IAAA,MAAM,MAAM,GAAG,CAAC,KAAK,GAAG,CAAC,KAAK,GAAG,CAAC,IAAI,CAAC,IAAI,QAAQ;IACnD,OAAO,CAAA,WAAA,EAAc,MAAM,CAAA,GAAA,CAAK;AAClC;AAEA;AACO,MAAM,cAAc,GAAG;AAE9B;;;AAGG;AACH,SAAS,QAAQ,CAAC,KAAa,EAAA;IAC7B,OAAO,CAAA,oBAAA,EAAuB,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA,CAAA,CAAG;AAC5D;AAEO,MAAM,UAAU,GAAc;AACnC,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,MAAM,EAAE,CAAC;AACT,IAAA,UAAU,EAAE,QAAQ,CAAC,YAAY,CAAC;AAClC,IAAA,MAAM,EAAE,CAAA,YAAA,EAAe,QAAQ,CAAC,WAAW,CAAC,CAAA,CAAE;;AAGhD;;;;;AAKG;AACI,MAAM,cAAc,GAAG;AAC5B,IAAA,OAAO,EAAE,MAAe;AACxB,IAAA,YAAY,EAAE,SAAkB;AAChC,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,EAAE,EAAE,CAAC;AACL,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,YAAY,EAAE,IAAI;;AAGpB;;;;AAIG;AACI,MAAM,kBAAkB,GAAG;AAChC,IAAA,OAAO,EAAE,EAAE;IACX,MAAM,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE,KAAK,EAAE,aAAa,EAAE;IACvD,OAAO,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,cAAc,EAAE;;;;;"}

package/dist/components/Workflow/canvas/NodeShell/NodeShell.types.d.ts

@@ -0,0 +1,35 @@
+import type { CSSProperties, ReactNode } from 'react';
+import { type CreatedIcon } from '@/components/Icon';
+import type { HandleDef, Issue, MetaChipSpec, NodeCategory, RunState } from '../../Workflow.types';
+import type { CategoryTokenMap } from '../IconTile';
+export type NodeShellProps = {
+    label: string;
+    instanceTitle?: string;
+    metaChips?: ReadonlyArray<MetaChipSpec>;
+    category: NodeCategory;
+    icon: CreatedIcon;
+    selected: boolean;
+    runState: RunState;
+    issues: Issue[];
+    inputs: HandleDef[];
+    outputs: HandleDef[];
+    /**
+     * Output handle ids that already have an edge connected. A connected exit's
+     * name is carried by the edge's label badge, so the node suppresses its own
+     * handle label there to avoid showing the branch name twice (once on the
+     * exit, once on the edge). Unconnected exits keep their label so the author
+     * can still tell the branches apart.
+     */
+    connectedOutputIds?: ReadonlySet<string>;
+    /** Optional override for the category → token map. */
+    categoryTokens?: CategoryTokenMap;
+    /** Escape-hatch body. If provided, replaces the standard header+meta layout. */
+    customBody?: ReactNode;
+};
+export type RingChrome = {
+    borderColor: string;
+    outline?: string;
+    outlineColor?: string;
+};
+export type PortStyle = CSSProperties;
+//# sourceMappingURL=NodeShell.types.d.ts.map

package/dist/components/Workflow/canvas/NodeShell/NodeShell.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeShell.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/Workflow/canvas/NodeShell/NodeShell.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,OAAO,KAAK,EACV,SAAS,EACT,KAAK,EACL,YAAY,EACZ,YAAY,EACZ,QAAQ,EACT,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAEpD,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IACxC,QAAQ,EAAE,YAAY,CAAC;IACvB,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,QAAQ,CAAC;IACnB,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,OAAO,EAAE,SAAS,EAAE,CAAC;IACrB;;;;;;OAMG;IACH,kBAAkB,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACzC,sDAAsD;IACtD,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,gFAAgF;IAChF,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC"}

package/dist/components/Workflow/canvas/NodeShell/index.d.ts

@@ -0,0 +1,4 @@
+export { NodeShell } from './NodeShell';
+export { CARD_WIDTH, MAX_META_CHIPS, metaChipStyles, PORT_STYLE, } from './NodeShell.styles';
+export type { NodeShellProps, PortStyle, RingChrome } from './NodeShell.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Workflow/canvas/NodeShell/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Workflow/canvas/NodeShell/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EACL,UAAU,EACV,cAAc,EACd,cAAc,EACd,UAAU,GACX,MAAM,oBAAoB,CAAC;AAC5B,YAAY,EAAE,cAAc,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/Workflow/canvas/SeverityDot/SeverityDot.d.ts

@@ -0,0 +1,15 @@
+import { type BoxProps } from '@chakra-ui/react';
+import type { IssueSeverity } from '../../Workflow.types';
+interface SeverityDotProps extends BoxProps {
+    severity: IssueSeverity;
+    /**
+     * Shade of the severity colour. `dark` reads better as a small marker on a
+     * tinted callout background; `main` suits a header dot on white. Defaults to
+     * `main`.
+     */
+    tone?: 'main' | 'dark';
+}
+/** Small round severity marker shared by the issue callout and the issue list. */
+export declare function SeverityDot({ severity, tone, ...rest }: SeverityDotProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SeverityDot.d.ts.map

package/dist/components/Workflow/canvas/SeverityDot/SeverityDot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SeverityDot.d.ts","sourceRoot":"","sources":["../../../../../src/components/Workflow/canvas/SeverityDot/SeverityDot.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAG1D,UAAU,gBAAiB,SAAQ,QAAQ;IACzC,QAAQ,EAAE,aAAa,CAAC;IACxB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,kFAAkF;AAClF,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAa,EACb,GAAG,IAAI,EACR,EAAE,gBAAgB,2CAUlB"}

package/dist/components/Workflow/canvas/SeverityDot/SeverityDot.js

@@ -0,0 +1,14 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('@chakra-ui/react');
+var issueSeverity = require('../issueSeverity.js');
+
+/** Small round severity marker shared by the issue callout and the issue list. */
+function SeverityDot({ severity, tone = 'main', ...rest }) {
+    return (jsxRuntime.jsx(react.Box, { boxSize: "1.5", borderRadius: "full", flexShrink: 0, bg: issueSeverity.severityColorToken(severity, tone), ...rest }));
+}
+
+exports.SeverityDot = SeverityDot;
+//# sourceMappingURL=SeverityDot.js.map

package/dist/components/Workflow/canvas/SeverityDot/SeverityDot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SeverityDot.js","sources":["../../../../../src/components/Workflow/canvas/SeverityDot/SeverityDot.tsx"],"sourcesContent":[null],"names":["_jsx","Box","severityColorToken"],"mappings":";;;;;;;AAiBA;AACM,SAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAI,GAAG,MAAM,EACb,GAAG,IAAI,EACU,EAAA;AACjB,IAAA,QACEA,cAAA,CAACC,SAAG,EAAA,EACF,OAAO,EAAC,KAAK,EACb,YAAY,EAAC,MAAM,EACnB,UAAU,EAAE,CAAC,EACb,EAAE,EAAEC,gCAAkB,CAAC,QAAQ,EAAE,IAAI,CAAC,EAAA,GAClC,IAAI,EAAA,CACR;AAEN;;;;"}

package/dist/components/Workflow/canvas/SeverityDot/SeverityDot.mjs

@@ -0,0 +1,12 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { Box } from '@chakra-ui/react';
+import { severityColorToken } from '../issueSeverity.mjs';
+
+/** Small round severity marker shared by the issue callout and the issue list. */
+function SeverityDot({ severity, tone = 'main', ...rest }) {
+    return (jsx(Box, { boxSize: "1.5", borderRadius: "full", flexShrink: 0, bg: severityColorToken(severity, tone), ...rest }));
+}
+
+export { SeverityDot };
+//# sourceMappingURL=SeverityDot.mjs.map

package/dist/components/Workflow/canvas/SeverityDot/SeverityDot.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SeverityDot.mjs","sources":["../../../../../src/components/Workflow/canvas/SeverityDot/SeverityDot.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;;AAiBA;AACM,SAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAI,GAAG,MAAM,EACb,GAAG,IAAI,EACU,EAAA;AACjB,IAAA,QACEA,GAAA,CAAC,GAAG,EAAA,EACF,OAAO,EAAC,KAAK,EACb,YAAY,EAAC,MAAM,EACnB,UAAU,EAAE,CAAC,EACb,EAAE,EAAE,kBAAkB,CAAC,QAAQ,EAAE,IAAI,CAAC,EAAA,GAClC,IAAI,EAAA,CACR;AAEN;;;;"}

package/dist/components/Workflow/canvas/SeverityDot/index.d.ts

@@ -0,0 +1,2 @@
+export { SeverityDot } from './SeverityDot';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Workflow/canvas/SeverityDot/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Workflow/canvas/SeverityDot/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/Workflow/canvas/issueSeverity.d.ts

@@ -0,0 +1,23 @@
+import type { Issue, IssueSeverity } from '../Workflow.types';
+/**
+ * The single issue a one-slot surface should represent: highest severity
+ * wins, first-listed breaks ties. Shared by every "tint by worst issue"
+ * consumer (field borders, the header title editor) so precedence can't
+ * drift between surfaces.
+ */
+export declare const pickPrimaryIssue: (issues: Issue[]) => Issue | null;
+/**
+ * Semantic color token for an issue severity — shared across issue list UIs.
+ * `tone` selects the shade: the default `'main'` for text/icons, or `'dark'`
+ * where `.main` is too light to read (e.g. the small list-bullet markers in
+ * drawer issue callouts, which need extra contrast against the tinted bg).
+ */
+export declare const severityColorToken: (severity: IssueSeverity, tone?: "main" | "dark") => string;
+/**
+ * Tinted callout styling (bg / border / text) for an issue severity. Reuses the
+ * `Toast` component's golden-ratio combo — the documented WCAG AA pairing — so
+ * the boxed inspector callouts stay in lockstep with it instead of restating
+ * the tokens. `IssueSeverity` is a subset of the toast statuses.
+ */
+export declare const severityCalloutStyle: (severity: IssueSeverity) => import("@chakra-ui/react").BoxProps;
+//# sourceMappingURL=issueSeverity.d.ts.map

package/dist/components/Workflow/canvas/issueSeverity.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"issueSeverity.d.ts","sourceRoot":"","sources":["../../../../src/components/Workflow/canvas/issueSeverity.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAO9D;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAAI,QAAQ,KAAK,EAAE,KAAG,KAAK,GAAG,IAY1D,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,GAC7B,UAAU,aAAa,EACvB,OAAM,MAAM,GAAG,MAAe,KAC7B,MAAuE,CAAC;AAE3E;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,UAAU,aAAa,wCACrC,CAAC"}

package/dist/components/Workflow/canvas/issueSeverity.js

@@ -0,0 +1,51 @@
+"use client";
+'use strict';
+
+require('react/jsx-runtime');
+require('@chakra-ui/react');
+var Toast_styles = require('../../Toast/Toast.styles.js');
+require('../../Icon/index.js');
+require('../../Toast/Toaster.js');
+require('react');
+
+const SEVERITY_PRECEDENCE = {
+    error: 2,
+    warning: 1,
+};
+/**
+ * The single issue a one-slot surface should represent: highest severity
+ * wins, first-listed breaks ties. Shared by every "tint by worst issue"
+ * consumer (field borders, the header title editor) so precedence can't
+ * drift between surfaces.
+ */
+const pickPrimaryIssue = (issues) => {
+    if (issues.length === 0)
+        return null;
+    let primary = issues[0];
+    for (let i = 1; i < issues.length; i += 1) {
+        if (SEVERITY_PRECEDENCE[issues[i].severity] >
+            SEVERITY_PRECEDENCE[primary.severity]) {
+            primary = issues[i];
+        }
+    }
+    return primary;
+};
+/**
+ * Semantic color token for an issue severity — shared across issue list UIs.
+ * `tone` selects the shade: the default `'main'` for text/icons, or `'dark'`
+ * where `.main` is too light to read (e.g. the small list-bullet markers in
+ * drawer issue callouts, which need extra contrast against the tinted bg).
+ */
+const severityColorToken = (severity, tone = 'main') => (severity === 'error' ? `danger.${tone}` : `warning.${tone}`);
+/**
+ * Tinted callout styling (bg / border / text) for an issue severity. Reuses the
+ * `Toast` component's golden-ratio combo — the documented WCAG AA pairing — so
+ * the boxed inspector callouts stay in lockstep with it instead of restating
+ * the tokens. `IssueSeverity` is a subset of the toast statuses.
+ */
+const severityCalloutStyle = (severity) => Toast_styles.toastStyles[severity];
+
+exports.pickPrimaryIssue = pickPrimaryIssue;
+exports.severityCalloutStyle = severityCalloutStyle;
+exports.severityColorToken = severityColorToken;
+//# sourceMappingURL=issueSeverity.js.map

package/dist/components/Workflow/canvas/issueSeverity.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"issueSeverity.js","sources":["../../../../src/components/Workflow/canvas/issueSeverity.ts"],"sourcesContent":[null],"names":["toastStyles"],"mappings":";;;;;;;;;;AAIA,MAAM,mBAAmB,GAAkC;AACzD,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,OAAO,EAAE,CAAC;CACX;AAED;;;;;AAKG;AACI,MAAM,gBAAgB,GAAG,CAAC,MAAe,KAAkB;AAChE,IAAA,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC;AAAE,QAAA,OAAO,IAAI;AACpC,IAAA,IAAI,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC;AACvB,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;QACzC,IACE,mBAAmB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;AACvC,YAAA,mBAAmB,CAAC,OAAO,CAAC,QAAQ,CAAC,EACrC;AACA,YAAA,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC;QACrB;IACF;AACA,IAAA,OAAO,OAAO;AAChB;AAEA;;;;;AAKG;AACI,MAAM,kBAAkB,GAAG,CAChC,QAAuB,EACvB,IAAA,GAAwB,MAAM,MAClB,QAAQ,KAAK,OAAO,GAAG,CAAA,OAAA,EAAU,IAAI,CAAA,CAAE,GAAG,CAAA,QAAA,EAAW,IAAI,CAAA,CAAE;AAEzE;;;;;AAKG;AACI,MAAM,oBAAoB,GAAG,CAAC,QAAuB,KAC1DA,wBAAW,CAAC,QAAQ;;;;;;"}