@principal-ai/principal-view-react 0.6.6

package/dist/nodes/CustomNode.js

@@ -0,0 +1,298 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CustomNode = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@xyflow/react");
+const iconResolver_1 = require("../utils/iconResolver");
+/**
+ * Custom node component for xyflow that renders based on NodeTypeDefinition
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const CustomNode = ({ data, selected }) => {
+    const nodeProps = data;
+    const { typeDefinition, state, hasViolations, data: nodeData, animationType, animationDuration = 1000, editable = false, } = nodeProps;
+    // Guard against missing typeDefinition
+    if (!typeDefinition) {
+        return ((0, jsx_runtime_1.jsx)("div", { style: { padding: '10px', border: '2px solid red', borderRadius: '4px' }, children: (0, jsx_runtime_1.jsx)("div", { style: { fontSize: '12px', color: 'red' }, children: "Error: Missing node type definition" }) }));
+    }
+    // Get fill color based on state or default
+    // Priority: state color > node data color > type definition color > default
+    const nodeDataColor = nodeData.color;
+    const baseColor = nodeDataColor || typeDefinition.color || '#888';
+    const stateColor = state && typeDefinition.states?.[state]?.color;
+    const fillColor = stateColor || baseColor;
+    // Get stroke color - priority: node data stroke > type definition stroke > fill color
+    const nodeDataStroke = nodeData.stroke;
+    const strokeColor = nodeDataStroke || typeDefinition.stroke || fillColor;
+    // Use fillColor as the primary "color" for backwards compatibility
+    const color = fillColor;
+    // Get label from data schema
+    const labelField = Object.entries(typeDefinition.dataSchema).find(([, schema]) => schema.displayInLabel)?.[0];
+    const displayLabel = labelField && nodeData[labelField] ? String(nodeData[labelField]) : nodeProps.label;
+    // Icon priority: node data override > state icon > type definition icon
+    const icon = nodeData.icon
+        || (state && typeDefinition.states?.[state]?.icon)
+        || typeDefinition.icon;
+    // Get animation class based on type
+    const getAnimationClass = () => {
+        switch (animationType) {
+            case 'pulse':
+                return 'node-pulse';
+            case 'flash':
+                return 'node-flash';
+            case 'shake':
+                return 'node-shake';
+            case 'entry':
+                return 'node-entry';
+            default:
+                return '';
+        }
+    };
+    const animationClass = getAnimationClass();
+    // Shape-specific styles
+    const getShapeStyles = () => {
+        const baseStyles = {
+            padding: '12px 16px',
+            backgroundColor: 'white',
+            color: '#000',
+            border: `2px solid ${hasViolations ? '#D0021B' : strokeColor}`,
+            fontSize: '12px',
+            fontWeight: 500,
+            minWidth: typeDefinition.size?.width || 80,
+            minHeight: typeDefinition.size?.height || 40,
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
+            justifyContent: 'center',
+            gap: '4px',
+            boxShadow: selected ? `0 0 0 2px ${strokeColor}` : '0 2px 4px rgba(0,0,0,0.1)',
+            transition: 'all 0.2s ease',
+            animationDuration: animationType ? `${animationDuration}ms` : undefined,
+        };
+        switch (typeDefinition.shape) {
+            case 'circle':
+                return {
+                    ...baseStyles,
+                    borderRadius: '50%',
+                    width: typeDefinition.size?.width || 80,
+                    height: typeDefinition.size?.height || 80,
+                    padding: '8px',
+                };
+            case 'hexagon':
+                // Hexagon uses wrapper approach for proper border - styles returned here are for inner fill
+                // The outer border wrapper is rendered separately in the JSX
+                return {
+                    ...baseStyles,
+                    border: 'none', // Border handled by wrapper
+                    clipPath: 'polygon(20% 0%, 80% 0%, 100% 50%, 80% 100%, 20% 100%, 0% 50%)',
+                    width: '100%',
+                    height: '100%',
+                    minWidth: 'unset',
+                    minHeight: 'unset',
+                    padding: '8px 20px',
+                    boxShadow: 'none', // Shadow handled by wrapper
+                };
+            case 'diamond':
+                // Rotated square - fixed dimensions for proper diamond shape
+                const diamondSize = typeDefinition.size?.width || 70;
+                return {
+                    ...baseStyles,
+                    transform: 'rotate(45deg)',
+                    width: diamondSize,
+                    height: diamondSize,
+                    padding: '8px',
+                };
+            case 'rectangle':
+            default:
+                return {
+                    ...baseStyles,
+                    borderRadius: '8px',
+                };
+        }
+    };
+    const isDiamond = typeDefinition.shape === 'diamond';
+    const isHexagon = typeDefinition.shape === 'hexagon';
+    // Hexagon border wrapper styles (outer shape that acts as border)
+    // Hexagon with gentle diagonals
+    const hexagonClipPath = 'polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%)';
+    const hexagonBorderWidth = 2;
+    const hexagonBorderStyle = isHexagon ? {
+        position: 'relative',
+        clipPath: hexagonClipPath,
+        backgroundColor: hasViolations ? '#D0021B' : strokeColor,
+        width: typeDefinition.size?.width || 120,
+        height: typeDefinition.size?.height || 120,
+        boxShadow: selected ? `0 0 0 2px ${strokeColor}` : '0 2px 4px rgba(0,0,0,0.1)',
+        transition: 'all 0.2s ease',
+    } : {};
+    // Hexagon inner fill styles (white background inset from border)
+    const hexagonInnerStyle = isHexagon ? {
+        position: 'absolute',
+        top: hexagonBorderWidth,
+        left: hexagonBorderWidth,
+        right: hexagonBorderWidth,
+        bottom: hexagonBorderWidth,
+        clipPath: hexagonClipPath,
+        backgroundColor: 'white',
+        color: '#000',
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        justifyContent: 'center',
+        fontSize: '12px',
+        fontWeight: 500,
+        gap: '4px',
+    } : {};
+    // Handle styles - larger and more visible in edit mode
+    const baseHandleStyle = editable ? {
+        background: color,
+        width: 12,
+        height: 12,
+        border: '2px solid white',
+        boxShadow: '0 0 0 1px ' + color,
+    } : {
+        background: color,
+        width: 8,
+        height: 8,
+    };
+    // Diamond handles need to be offset to reach the tips of the rotated shape
+    // A 45° rotated square has tips at ~41% beyond the original edges
+    const diamondOffset = isDiamond ? '21%' : '0';
+    const getHandleStyle = (position) => {
+        if (!isDiamond && !isHexagon)
+            return baseHandleStyle;
+        const offsetStyle = { ...baseHandleStyle };
+        if (isDiamond) {
+            switch (position) {
+                case 'top':
+                    offsetStyle.top = `-${diamondOffset}`;
+                    break;
+                case 'bottom':
+                    offsetStyle.bottom = `-${diamondOffset}`;
+                    break;
+                case 'left':
+                    offsetStyle.left = `-${diamondOffset}`;
+                    break;
+                case 'right':
+                    offsetStyle.right = `-${diamondOffset}`;
+                    break;
+            }
+        }
+        if (isHexagon) {
+            // Bring handles above the hexagon layers
+            offsetStyle.zIndex = 10;
+        }
+        return offsetStyle;
+    };
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.Handle, { type: "target", position: react_1.Position.Top, id: "top", style: getHandleStyle('top') }), (0, jsx_runtime_1.jsx)(react_1.Handle, { type: "target", position: react_1.Position.Left, id: "left", style: getHandleStyle('left') }), (0, jsx_runtime_1.jsx)(react_1.Handle, { type: "target", position: react_1.Position.Right, id: "right", style: getHandleStyle('right') }), isHexagon ? ((0, jsx_runtime_1.jsx)("div", { style: hexagonBorderStyle, className: animationClass, children: (0, jsx_runtime_1.jsxs)("div", { style: hexagonInnerStyle, children: [icon && (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center' }, children: (0, iconResolver_1.resolveIcon)(icon, 20) }), (0, jsx_runtime_1.jsx)("div", { style: { textAlign: 'center', wordBreak: 'break-word' }, children: displayLabel }), state && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                fontSize: '10px',
+                                backgroundColor: color,
+                                color: 'white',
+                                padding: '2px 6px',
+                                borderRadius: '4px',
+                                textAlign: 'center',
+                            }, children: typeDefinition.states?.[state]?.label || state })), hasViolations && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                fontSize: '10px',
+                                color: '#D0021B',
+                                fontWeight: 'bold',
+                            }, children: "\u26A0\uFE0F" }))] }) })) : ((0, jsx_runtime_1.jsx)("div", { style: getShapeStyles(), className: animationClass, children: (0, jsx_runtime_1.jsxs)("div", { style: isDiamond ? { transform: 'rotate(-45deg)' } : {}, children: [icon && (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', justifyContent: 'center', alignItems: 'center' }, children: (0, iconResolver_1.resolveIcon)(icon, 20) }), (0, jsx_runtime_1.jsx)("div", { style: { textAlign: 'center', wordBreak: 'break-word' }, children: displayLabel }), state && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                fontSize: '10px',
+                                backgroundColor: color,
+                                color: 'white',
+                                padding: '2px 6px',
+                                borderRadius: '4px',
+                                textAlign: 'center',
+                            }, children: typeDefinition.states?.[state]?.label || state })), hasViolations && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                fontSize: '10px',
+                                color: '#D0021B',
+                                fontWeight: 'bold',
+                            }, children: "\u26A0\uFE0F" }))] }) })), (0, jsx_runtime_1.jsx)(react_1.Handle, { type: "source", position: react_1.Position.Bottom, id: "bottom", style: getHandleStyle('bottom') }), (0, jsx_runtime_1.jsx)(react_1.Handle, { type: "source", position: react_1.Position.Left, id: "left-out", style: getHandleStyle('left') }), (0, jsx_runtime_1.jsx)(react_1.Handle, { type: "source", position: react_1.Position.Right, id: "right-out", style: getHandleStyle('right') }), (0, jsx_runtime_1.jsx)("style", { children: `
+        /* Processing pulse - continuous breathing effect */
+        .node-pulse {
+          animation: node-pulse ease-in-out infinite;
+        }
+
+        @keyframes node-pulse {
+          0%, 100% {
+            transform: scale(1);
+            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+          }
+          50% {
+            transform: scale(1.05);
+            box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 0 0 4px rgba(59, 130, 246, 0.3);
+          }
+        }
+
+        /* Success flash - brief green glow */
+        .node-flash {
+          animation: node-flash ease-out forwards;
+        }
+
+        @keyframes node-flash {
+          0% {
+            box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.8);
+            background-color: rgba(34, 197, 94, 0.1);
+          }
+          50% {
+            box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
+            background-color: rgba(34, 197, 94, 0.2);
+          }
+          100% {
+            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+            background-color: white;
+          }
+        }
+
+        /* Error shake - vibrate effect */
+        .node-shake {
+          animation: node-shake ease-in-out;
+        }
+
+        @keyframes node-shake {
+          0%, 100% {
+            transform: translateX(0);
+          }
+          10%, 30%, 50%, 70%, 90% {
+            transform: translateX(-4px);
+          }
+          20%, 40%, 60%, 80% {
+            transform: translateX(4px);
+          }
+        }
+
+        /* Entry animation - scale up and fade in */
+        .node-entry {
+          animation: node-entry ease-out forwards;
+        }
+
+        @keyframes node-entry {
+          0% {
+            opacity: 0;
+            transform: scale(0.8);
+          }
+          100% {
+            opacity: 1;
+            transform: scale(1);
+          }
+        }
+
+        /* Special handling for diamond shape with shake */
+        .node-shake[style*="rotate(45deg)"] {
+          animation: node-shake-diamond ease-in-out;
+        }
+
+        @keyframes node-shake-diamond {
+          0%, 100% {
+            transform: rotate(45deg) translateX(0);
+          }
+          10%, 30%, 50%, 70%, 90% {
+            transform: rotate(45deg) translateX(-4px);
+          }
+          20%, 40%, 60%, 80% {
+            transform: rotate(45deg) translateX(4px);
+          }
+        }
+      ` })] }));
+};
+exports.CustomNode = CustomNode;
+//# sourceMappingURL=CustomNode.js.map

package/dist/nodes/CustomNode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomNode.js","sourceRoot":"","sources":["../../src/nodes/CustomNode.tsx"],"names":[],"mappings":";;;;AACA,yCAAiD;AAGjD,wDAAoD;AAepD;;GAEG;AACH,8DAA8D;AACvD,MAAM,UAAU,GAA6B,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE;IACzE,MAAM,SAAS,GAAG,IAAsB,CAAC;IACzC,MAAM,EACJ,cAAc,EACd,KAAK,EACL,aAAa,EACb,IAAI,EAAE,QAAQ,EACd,aAAa,EACb,iBAAiB,GAAG,IAAI,EACxB,QAAQ,GAAG,KAAK,GACjB,GAAG,SAAS,CAAC;IAEd,uCAAuC;IACvC,IAAI,CAAC,cAAc,EAAE,CAAC;QACpB,OAAO,CACL,gCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,eAAe,EAAE,YAAY,EAAE,KAAK,EAAE,YAC3E,gCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,oDAExC,GACF,CACP,CAAC;IACJ,CAAC;IAED,2CAA2C;IAC3C,4EAA4E;IAC5E,MAAM,aAAa,GAAG,QAAQ,CAAC,KAA2B,CAAC;IAC3D,MAAM,SAAS,GAAG,aAAa,IAAI,cAAc,CAAC,KAAK,IAAI,MAAM,CAAC;IAClE,MAAM,UAAU,GAAG,KAAK,IAAI,cAAc,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC;IAClE,MAAM,SAAS,GAAG,UAAU,IAAI,SAAS,CAAC;IAE1C,sFAAsF;IACtF,MAAM,cAAc,GAAG,QAAQ,CAAC,MAA4B,CAAC;IAC7D,MAAM,WAAW,GAAG,cAAc,IAAI,cAAc,CAAC,MAAM,IAAI,SAAS,CAAC;IAEzE,mEAAmE;IACnE,MAAM,KAAK,GAAG,SAAS,CAAC;IAExB,6BAA6B;IAC7B,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,IAAI,CAC/D,CAAC,CAAC,EAAE,MAAM,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,cAAc,CACtC,EAAE,CAAC,CAAC,CAAC,CAAC;IACP,MAAM,YAAY,GAAG,UAAU,IAAI,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC;IAEzG,wEAAwE;IACxE,MAAM,IAAI,GAAI,QAAQ,CAAC,IAAe;WACjC,CAAC,KAAK,IAAI,cAAc,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;WAC/C,cAAc,CAAC,IAAI,CAAC;IAEzB,oCAAoC;IACpC,MAAM,iBAAiB,GAAG,GAAG,EAAE;QAC7B,QAAQ,aAAa,EAAE,CAAC;YACtB,KAAK,OAAO;gBACV,OAAO,YAAY,CAAC;YACtB,KAAK,OAAO;gBACV,OAAO,YAAY,CAAC;YACtB,KAAK,OAAO;gBACV,OAAO,YAAY,CAAC;YACtB,KAAK,OAAO;gBACV,OAAO,YAAY,CAAC;YACtB;gBACE,OAAO,EAAE,CAAC;QACd,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;IAE3C,wBAAwB;IACxB,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,MAAM,UAAU,GAAG;YACjB,OAAO,EAAE,WAAW;YACpB,eAAe,EAAE,OAAO;YACxB,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,aAAa,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,EAAE;YAC9D,QAAQ,EAAE,MAAM;YAChB,UAAU,EAAE,GAAG;YACf,QAAQ,EAAE,cAAc,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;YAC1C,SAAS,EAAE,cAAc,CAAC,IAAI,EAAE,MAAM,IAAI,EAAE;YAC5C,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAiB;YAChC,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,GAAG,EAAE,KAAK;YACV,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,aAAa,WAAW,EAAE,CAAC,CAAC,CAAC,2BAA2B;YAC9E,UAAU,EAAE,eAAe;YAC3B,iBAAiB,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,iBAAiB,IAAI,CAAC,CAAC,CAAC,SAAS;SACxE,CAAC;QAEF,QAAQ,cAAc,CAAC,KAAK,EAAE,CAAC;YAC7B,KAAK,QAAQ;gBACX,OAAO;oBACL,GAAG,UAAU;oBACb,YAAY,EAAE,KAAK;oBACnB,KAAK,EAAE,cAAc,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;oBACvC,MAAM,EAAE,cAAc,CAAC,IAAI,EAAE,MAAM,IAAI,EAAE;oBACzC,OAAO,EAAE,KAAK;iBACf,CAAC;YACJ,KAAK,SAAS;gBACZ,4FAA4F;gBAC5F,6DAA6D;gBAC7D,OAAO;oBACL,GAAG,UAAU;oBACb,MAAM,EAAE,MAAM,EAAE,4BAA4B;oBAC5C,QAAQ,EAAE,+DAA+D;oBACzE,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,MAAM;oBACd,QAAQ,EAAE,OAAO;oBACjB,SAAS,EAAE,OAAO;oBAClB,OAAO,EAAE,UAAU;oBACnB,SAAS,EAAE,MAAM,EAAE,4BAA4B;iBAChD,CAAC;YACJ,KAAK,SAAS;gBACZ,6DAA6D;gBAC7D,MAAM,WAAW,GAAG,cAAc,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC;gBACrD,OAAO;oBACL,GAAG,UAAU;oBACb,SAAS,EAAE,eAAe;oBAC1B,KAAK,EAAE,WAAW;oBAClB,MAAM,EAAE,WAAW;oBACnB,OAAO,EAAE,KAAK;iBACf,CAAC;YACJ,KAAK,WAAW,CAAC;YACjB;gBACE,OAAO;oBACL,GAAG,UAAU;oBACb,YAAY,EAAE,KAAK;iBACpB,CAAC;QACN,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,cAAc,CAAC,KAAK,KAAK,SAAS,CAAC;IACrD,MAAM,SAAS,GAAG,cAAc,CAAC,KAAK,KAAK,SAAS,CAAC;IAErD,kEAAkE;IAClE,gCAAgC;IAChC,MAAM,eAAe,GAAG,+DAA+D,CAAC;IACxF,MAAM,kBAAkB,GAAG,CAAC,CAAC;IAC7B,MAAM,kBAAkB,GAAwB,SAAS,CAAC,CAAC,CAAC;QAC1D,QAAQ,EAAE,UAAU;QACpB,QAAQ,EAAE,eAAe;QACzB,eAAe,EAAE,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW;QACxD,KAAK,EAAE,cAAc,CAAC,IAAI,EAAE,KAAK,IAAI,GAAG;QACxC,MAAM,EAAE,cAAc,CAAC,IAAI,EAAE,MAAM,IAAI,GAAG;QAC1C,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,aAAa,WAAW,EAAE,CAAC,CAAC,CAAC,2BAA2B;QAC9E,UAAU,EAAE,eAAe;KAC5B,CAAC,CAAC,CAAC,EAAE,CAAC;IAEP,iEAAiE;IACjE,MAAM,iBAAiB,GAAwB,SAAS,CAAC,CAAC,CAAC;QACzD,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,kBAAkB;QACvB,IAAI,EAAE,kBAAkB;QACxB,KAAK,EAAE,kBAAkB;QACzB,MAAM,EAAE,kBAAkB;QAC1B,QAAQ,EAAE,eAAe;QACzB,eAAe,EAAE,OAAO;QACxB,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,QAAQ,EAAE,MAAM;QAChB,UAAU,EAAE,GAAG;QACf,GAAG,EAAE,KAAK;KACX,CAAC,CAAC,CAAC,EAAE,CAAC;IAEP,uDAAuD;IACvD,MAAM,eAAe,GAAG,QAAQ,CAAC,CAAC,CAAC;QACjC,UAAU,EAAE,KAAK;QACjB,KAAK,EAAE,EAAE;QACT,MAAM,EAAE,EAAE;QACV,MAAM,EAAE,iBAAiB;QACzB,SAAS,EAAE,YAAY,GAAG,KAAK;KAChC,CAAC,CAAC,CAAC;QACF,UAAU,EAAE,KAAK;QACjB,KAAK,EAAE,CAAC;QACR,MAAM,EAAE,CAAC;KACV,CAAC;IAEF,2EAA2E;IAC3E,kEAAkE;IAClE,MAAM,aAAa,GAAG,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC;IAE9C,MAAM,cAAc,GAAG,CAAC,QAA6C,EAAE,EAAE;QACvE,IAAI,CAAC,SAAS,IAAI,CAAC,SAAS;YAAE,OAAO,eAAe,CAAC;QAErD,MAAM,WAAW,GAAwB,EAAE,GAAG,eAAe,EAAE,CAAC;QAEhE,IAAI,SAAS,EAAE,CAAC;YACd,QAAQ,QAAQ,EAAE,CAAC;gBACjB,KAAK,KAAK;oBACR,WAAW,CAAC,GAAG,GAAG,IAAI,aAAa,EAAE,CAAC;oBACtC,MAAM;gBACR,KAAK,QAAQ;oBACX,WAAW,CAAC,MAAM,GAAG,IAAI,aAAa,EAAE,CAAC;oBACzC,MAAM;gBACR,KAAK,MAAM;oBACT,WAAW,CAAC,IAAI,GAAG,IAAI,aAAa,EAAE,CAAC;oBACvC,MAAM;gBACR,KAAK,OAAO;oBACV,WAAW,CAAC,KAAK,GAAG,IAAI,aAAa,EAAE,CAAC;oBACxC,MAAM;YACV,CAAC;QACH,CAAC;QAED,IAAI,SAAS,EAAE,CAAC;YACd,yCAAyC;YACzC,WAAW,CAAC,MAAM,GAAG,EAAE,CAAC;QAC1B,CAAC;QAED,OAAO,WAAW,CAAC;IACrB,CAAC,CAAC;IAEF,OAAO,CACL,6DAEE,uBAAC,cAAM,IACL,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,gBAAQ,CAAC,GAAG,EACtB,EAAE,EAAC,KAAK,EACR,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,GAC5B,EACF,uBAAC,cAAM,IACL,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,gBAAQ,CAAC,IAAI,EACvB,EAAE,EAAC,MAAM,EACT,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,GAC7B,EACF,uBAAC,cAAM,IACL,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,gBAAQ,CAAC,KAAK,EACxB,EAAE,EAAC,OAAO,EACV,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,GAC9B,EAGD,SAAS,CAAC,CAAC,CAAC,CACX,gCAAK,KAAK,EAAE,kBAAkB,EAAE,SAAS,EAAE,cAAc,YACvD,iCAAK,KAAK,EAAE,iBAAiB,aAC1B,IAAI,IAAI,gCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAG,IAAA,0BAAW,EAAC,IAAI,EAAE,EAAE,CAAC,GAAO,EACvH,gCAAK,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,YACzD,YAAY,GACT,EACL,KAAK,IAAI,CACR,gCAAK,KAAK,EAAE;gCACV,QAAQ,EAAE,MAAM;gCAChB,eAAe,EAAE,KAAK;gCACtB,KAAK,EAAE,OAAO;gCACd,OAAO,EAAE,SAAS;gCAClB,YAAY,EAAE,KAAK;gCACnB,SAAS,EAAE,QAAQ;6BACpB,YACE,cAAc,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,IAAI,KAAK,GAC3C,CACP,EACA,aAAa,IAAI,CAChB,gCAAK,KAAK,EAAE;gCACV,QAAQ,EAAE,MAAM;gCAChB,KAAK,EAAE,SAAS;gCAChB,UAAU,EAAE,MAAM;6BACnB,6BAEK,CACP,IACG,GACF,CACP,CAAC,CAAC,CAAC,CACF,gCAAK,KAAK,EAAE,cAAc,EAAE,EAAE,SAAS,EAAE,cAAc,YAErD,iCAAK,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC,CAAC,CAAC,EAAE,aACzD,IAAI,IAAI,gCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAG,IAAA,0BAAW,EAAC,IAAI,EAAE,EAAE,CAAC,GAAO,EACvH,gCAAK,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,YAAY,EAAE,YACzD,YAAY,GACT,EACL,KAAK,IAAI,CACR,gCAAK,KAAK,EAAE;gCACV,QAAQ,EAAE,MAAM;gCAChB,eAAe,EAAE,KAAK;gCACtB,KAAK,EAAE,OAAO;gCACd,OAAO,EAAE,SAAS;gCAClB,YAAY,EAAE,KAAK;gCACnB,SAAS,EAAE,QAAQ;6BACpB,YACE,cAAc,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,IAAI,KAAK,GAC3C,CACP,EACA,aAAa,IAAI,CAChB,gCAAK,KAAK,EAAE;gCACV,QAAQ,EAAE,MAAM;gCAChB,KAAK,EAAE,SAAS;gCAChB,UAAU,EAAE,MAAM;6BACnB,6BAEK,CACP,IACG,GACF,CACP,EAGD,uBAAC,cAAM,IACL,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,gBAAQ,CAAC,MAAM,EACzB,EAAE,EAAC,QAAQ,EACX,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,GAC/B,EACF,uBAAC,cAAM,IACL,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,gBAAQ,CAAC,IAAI,EACvB,EAAE,EAAC,UAAU,EACb,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,GAC7B,EACF,uBAAC,cAAM,IACL,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,gBAAQ,CAAC,KAAK,EACxB,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,GAC9B,EAGF,4CAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAsFP,GAAS,IACT,CACJ,CAAC;AACJ,CAAC,CAAC;AAxZW,QAAA,UAAU,cAwZrB"}

package/dist/nodes/GenericNode.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import type { NodeTypeDefinition } from '@principal-ai/principal-view-core';
+export interface GenericNodeProps {
+    /** Node ID */
+    id: string;
+    /** Node type definition from configuration */
+    typeDefinition: NodeTypeDefinition;
+    /** Node data */
+    data: Record<string, unknown>;
+    /** Current state (if applicable) */
+    state?: string;
+    /** Whether this node has violations */
+    hasViolations?: boolean;
+}
+/**
+ * Generic node renderer that adapts based on NodeTypeDefinition
+ * TODO: Implement different shapes, icons, and states
+ */
+export declare const GenericNode: React.FC<GenericNodeProps>;
+//# sourceMappingURL=GenericNode.d.ts.map

package/dist/nodes/GenericNode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericNode.d.ts","sourceRoot":"","sources":["../../src/nodes/GenericNode.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAE5E,MAAM,WAAW,gBAAgB;IAC/B,cAAc;IACd,EAAE,EAAE,MAAM,CAAC;IAEX,8CAA8C;IAC9C,cAAc,EAAE,kBAAkB,CAAC;IAEnC,gBAAgB;IAChB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAE9B,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,uCAAuC;IACvC,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED;;;GAGG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA6BlD,CAAC"}

package/dist/nodes/GenericNode.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GenericNode = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Generic node renderer that adapts based on NodeTypeDefinition
+ * TODO: Implement different shapes, icons, and states
+ */
+const GenericNode = ({ id, typeDefinition, state, hasViolations, }) => {
+    // Get color based on state or default
+    const color = state && typeDefinition.states?.[state]?.color
+        ? typeDefinition.states[state].color
+        : typeDefinition.color || '#888';
+    return ((0, jsx_runtime_1.jsxs)("div", { style: {
+            padding: '10px',
+            border: `2px solid ${hasViolations ? 'red' : color}`,
+            borderRadius: typeDefinition.shape === 'circle' ? '50%' : '4px',
+            backgroundColor: 'white',
+            minWidth: '60px',
+            textAlign: 'center',
+        }, children: [(0, jsx_runtime_1.jsx)("div", { style: { fontSize: '12px', fontWeight: 'bold' }, children: id }), state && (0, jsx_runtime_1.jsx)("div", { style: { fontSize: '10px', color: '#666' }, children: state }), (0, jsx_runtime_1.jsxs)("div", { style: { fontSize: '10px' }, children: [(0, jsx_runtime_1.jsx)("strong", { children: "TODO:" }), " Render shapes, icons"] })] }));
+};
+exports.GenericNode = GenericNode;
+//# sourceMappingURL=GenericNode.js.map

package/dist/nodes/GenericNode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericNode.js","sourceRoot":"","sources":["../../src/nodes/GenericNode.tsx"],"names":[],"mappings":";;;;AAoBA;;;GAGG;AACI,MAAM,WAAW,GAA+B,CAAC,EACtD,EAAE,EACF,cAAc,EACd,KAAK,EACL,aAAa,GACd,EAAE,EAAE;IACH,sCAAsC;IACtC,MAAM,KAAK,GAAG,KAAK,IAAI,cAAc,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK;QAC1D,CAAC,CAAC,cAAc,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,KAAK;QACpC,CAAC,CAAC,cAAc,CAAC,KAAK,IAAI,MAAM,CAAC;IAEnC,OAAO,CACL,iCACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,MAAM,EAAE,aAAa,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,EAAE;YACpD,YAAY,EAAE,cAAc,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;YAC/D,eAAe,EAAE,OAAO;YACxB,QAAQ,EAAE,MAAM;YAChB,SAAS,EAAE,QAAQ;SACpB,aAED,gCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,YAAG,EAAE,GAAO,EAC/D,KAAK,IAAI,gCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,YAAG,KAAK,GAAO,EACxE,iCAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,aAC9B,uDAAsB,6BAClB,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AA7BW,QAAA,WAAW,eA6BtB"}

package/dist/utils/animationMapping.d.ts

@@ -0,0 +1,53 @@
+/**
+ * Animation mapping utilities
+ *
+ * Maps log levels and component events to appropriate animations
+ * for Milestone 1 default visualization behavior
+ */
+import type { LogLevel } from '@principal-ai/principal-view-core';
+/**
+ * Node animation configuration
+ */
+export interface NodeAnimation {
+    type: 'pulse' | 'flash' | 'shake' | 'entry';
+    duration: number;
+    intensity?: number;
+    color?: string;
+}
+/**
+ * Edge animation configuration
+ */
+export interface EdgeAnimation {
+    type: 'flow' | 'particle' | 'pulse' | 'glow';
+    duration: number;
+    direction?: 'forward' | 'backward' | 'bidirectional';
+    color?: string;
+}
+/**
+ * Map log level to node animation
+ *
+ * Default behavior for Milestone 1:
+ * - debug: subtle pulse (low intensity)
+ * - info: standard pulse (medium intensity)
+ * - warn: amber pulse (high intensity)
+ * - error: red flash + shake
+ */
+export declare function logLevelToNodeAnimation(level: LogLevel): NodeAnimation;
+/**
+ * Map component action to node animation (Milestone 2)
+ */
+export declare function actionToNodeAnimation(_action: string, state?: string): NodeAnimation;
+/**
+ * Get animation config for edge based on action (Milestone 2)
+ */
+export declare function actionToEdgeAnimation(_action: string, edgeConfig?: EdgeAnimation): EdgeAnimation;
+/**
+ * Check if log level should trigger animation
+ */
+export declare function shouldAnimate(level: LogLevel, minLevel?: LogLevel): boolean;
+/**
+ * Calculate animation intensity based on frequency
+ * Used to adjust animation intensity when multiple logs occur rapidly
+ */
+export declare function calculateIntensity(baseIntensity: number, eventCount: number, _timeWindow?: number): number;
+//# sourceMappingURL=animationMapping.d.ts.map

package/dist/utils/animationMapping.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animationMapping.d.ts","sourceRoot":"","sources":["../../src/utils/animationMapping.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAElE;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;IAC5C,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;IAC7C,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,eAAe,CAAC;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;GAQG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,QAAQ,GAAG,aAAa,CAkCtE;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,MAAM,EACf,KAAK,CAAC,EAAE,MAAM,GACb,aAAa,CAiDf;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,MAAM,EACf,UAAU,CAAC,EAAE,aAAa,GACzB,aAAa,CAOf;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAE,QAAiB,GAAG,OAAO,CAMnF;AAED;;;GAGG;AACH,wBAAgB,kBAAkB,CAChC,aAAa,EAAE,MAAM,EACrB,UAAU,EAAE,MAAM,EAClB,WAAW,GAAE,MAAa,GACzB,MAAM,CAIR"}

package/dist/utils/animationMapping.js

@@ -0,0 +1,133 @@
+"use strict";
+/**
+ * Animation mapping utilities
+ *
+ * Maps log levels and component events to appropriate animations
+ * for Milestone 1 default visualization behavior
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.logLevelToNodeAnimation = logLevelToNodeAnimation;
+exports.actionToNodeAnimation = actionToNodeAnimation;
+exports.actionToEdgeAnimation = actionToEdgeAnimation;
+exports.shouldAnimate = shouldAnimate;
+exports.calculateIntensity = calculateIntensity;
+/**
+ * Map log level to node animation
+ *
+ * Default behavior for Milestone 1:
+ * - debug: subtle pulse (low intensity)
+ * - info: standard pulse (medium intensity)
+ * - warn: amber pulse (high intensity)
+ * - error: red flash + shake
+ */
+function logLevelToNodeAnimation(level) {
+    switch (level) {
+        case 'debug':
+            return {
+                type: 'pulse',
+                duration: 800,
+                intensity: 0.3,
+                color: '#94a3b8' // slate-400
+            };
+        case 'info':
+            return {
+                type: 'pulse',
+                duration: 1000,
+                intensity: 0.5,
+                color: '#3b82f6' // blue-500
+            };
+        case 'warn':
+            return {
+                type: 'pulse',
+                duration: 1200,
+                intensity: 1.0,
+                color: '#f59e0b' // amber-500
+            };
+        case 'error':
+            return {
+                type: 'flash', // More dramatic animation for errors
+                duration: 1500,
+                intensity: 1.0,
+                color: '#ef4444' // red-500
+            };
+    }
+}
+/**
+ * Map component action to node animation (Milestone 2)
+ */
+function actionToNodeAnimation(_action, state) {
+    // Default mapping - can be overridden by configuration
+    switch (state) {
+        case 'acquired':
+        case 'active':
+        case 'processing':
+            return {
+                type: 'pulse',
+                duration: 1000,
+                intensity: 0.8,
+                color: '#22c55e' // green-500
+            };
+        case 'waiting':
+        case 'pending':
+            return {
+                type: 'pulse',
+                duration: 1500,
+                intensity: 0.5,
+                color: '#eab308' // yellow-500
+            };
+        case 'error':
+        case 'failed':
+            return {
+                type: 'shake',
+                duration: 600,
+                intensity: 1.0,
+                color: '#ef4444' // red-500
+            };
+        case 'completed':
+        case 'success':
+            return {
+                type: 'flash',
+                duration: 800,
+                intensity: 0.7,
+                color: '#22c55e' // green-500
+            };
+        default:
+            // Generic action animation
+            return {
+                type: 'pulse',
+                duration: 1000,
+                intensity: 0.6,
+                color: '#3b82f6' // blue-500
+            };
+    }
+}
+/**
+ * Get animation config for edge based on action (Milestone 2)
+ */
+function actionToEdgeAnimation(_action, edgeConfig) {
+    // Use edge config if provided, otherwise default
+    return edgeConfig || {
+        type: 'flow',
+        duration: 2000,
+        direction: 'forward'
+    };
+}
+/**
+ * Check if log level should trigger animation
+ */
+function shouldAnimate(level, minLevel = 'info') {
+    const levels = ['debug', 'info', 'warn', 'error'];
+    const minIndex = levels.indexOf(minLevel);
+    const currentIndex = levels.indexOf(level);
+    return currentIndex >= minIndex;
+}
+/**
+ * Calculate animation intensity based on frequency
+ * Used to adjust animation intensity when multiple logs occur rapidly
+ */
+function calculateIntensity(baseIntensity, eventCount, _timeWindow = 1000) {
+    // Reduce intensity if too many events in time window
+    const scaleFactor = Math.min(1.0, 5.0 / eventCount);
+    return Math.max(0.2, baseIntensity * scaleFactor);
+}
+//# sourceMappingURL=animationMapping.js.map

package/dist/utils/animationMapping.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"animationMapping.js","sourceRoot":"","sources":["../../src/utils/animationMapping.ts"],"names":[],"mappings":"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"}

package/dist/utils/graphConverter.d.ts

@@ -0,0 +1,22 @@
+import { type Node, type Edge } from '@xyflow/react';
+import type { NodeState, EdgeState, GraphConfiguration, Violation } from '@principal-ai/principal-view-core';
+import type { CustomNodeData } from '../nodes/CustomNode';
+import type { CustomEdgeData } from '../edges/CustomEdge';
+/**
+ * Convert our NodeState to xyflow Node format
+ */
+export declare function convertToXYFlowNodes(nodes: NodeState[], configuration: GraphConfiguration, violations?: Violation[]): Node<CustomNodeData>[];
+/** Extended edge state with optional handle information for ReactFlow */
+export interface EdgeStateWithHandles extends EdgeState {
+    sourceHandle?: string;
+    targetHandle?: string;
+}
+/**
+ * Convert our EdgeState to xyflow Edge format
+ */
+export declare function convertToXYFlowEdges(edges: (EdgeState | EdgeStateWithHandles)[], configuration: GraphConfiguration, violations?: Violation[]): Edge<CustomEdgeData>[];
+/**
+ * Auto-layout nodes if they don't have positions
+ */
+export declare function autoLayoutNodes<T extends Record<string, unknown>>(nodes: Node<T>[], edges: Edge[], layoutType?: 'hierarchical' | 'force-directed' | 'circular' | 'manual'): Node<T>[];
+//# sourceMappingURL=graphConverter.d.ts.map

package/dist/utils/graphConverter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"graphConverter.d.ts","sourceRoot":"","sources":["../../src/utils/graphConverter.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,IAAI,EAAE,KAAK,IAAI,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAC7G,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAE1D;;GAEG;AACH,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,SAAS,EAAE,EAClB,aAAa,EAAE,kBAAkB,EACjC,UAAU,GAAE,SAAS,EAAO,GAC3B,IAAI,CAAC,cAAc,CAAC,EAAE,CAwBxB;AAED,yEAAyE;AACzE,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,CAAC,SAAS,GAAG,oBAAoB,CAAC,EAAE,EAC3C,aAAa,EAAE,kBAAkB,EACjC,UAAU,GAAE,SAAS,EAAO,GAC3B,IAAI,CAAC,cAAc,CAAC,EAAE,CAoCxB;AAED;;GAEG;AACH,wBAAgB,eAAe,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC/D,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,EAChB,KAAK,EAAE,IAAI,EAAE,EACb,UAAU,GAAE,cAAc,GAAG,gBAAgB,GAAG,UAAU,GAAG,QAAyB,GACrF,IAAI,CAAC,CAAC,CAAC,EAAE,CAmBX"}