@uipath/apollo-react 3.44.1 → 3.44.2-pr255.af80ea0

package/dist/canvas/components/StageNode/CrossStageTaskDrag.stories.cjs

@@ -0,0 +1,581 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    DragAndDrop: ()=>DragAndDrop,
+    default: ()=>CrossStageTaskDrag_stories
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
+const external_react_namespaceObject = require("react");
+const CrossStageDragContext_cjs_namespaceObject = require("../../hooks/CrossStageDragContext.cjs");
+const useCrossStageTaskDrag_cjs_namespaceObject = require("../../hooks/useCrossStageTaskDrag.cjs");
+const useTaskCopyPaste_cjs_namespaceObject = require("../../hooks/useTaskCopyPaste.cjs");
+const external_types_cjs_namespaceObject = require("../../types.cjs");
+const index_cjs_namespaceObject = require("../BaseCanvas/index.cjs");
+const external_CanvasPositionControls_cjs_namespaceObject = require("../CanvasPositionControls.cjs");
+const external_TaskIcon_index_cjs_namespaceObject = require("../TaskIcon/index.cjs");
+const external_TaskNode_index_cjs_namespaceObject = require("../TaskNode/index.cjs");
+const taskReorderUtils_cjs_namespaceObject = require("../TaskNode/taskReorderUtils.cjs");
+const useTaskPositions_cjs_namespaceObject = require("../TaskNode/useTaskPositions.cjs");
+const external_StageConnectionEdge_cjs_namespaceObject = require("./StageConnectionEdge.cjs");
+const external_StageEdge_cjs_namespaceObject = require("./StageEdge.cjs");
+const external_StageNode_cjs_namespaceObject = require("./StageNode.cjs");
+const meta = {
+    title: 'Canvas/StageNode',
+    parameters: {
+        layout: 'fullscreen'
+    }
+};
+const CrossStageTaskDrag_stories = meta;
+const StageNodeWrapper = (props)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_cjs_namespaceObject.StageNode, {
+        ...props,
+        ...props.data
+    });
+const TaskNodeWrapper = (props)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskNode_index_cjs_namespaceObject.TaskNode, {
+        ...props,
+        ...props.data
+    });
+const initialStageData = {
+    'stage-1': {
+        taskIds: [
+            [
+                'task-1'
+            ],
+            [
+                'task-2',
+                'task-6'
+            ],
+            [
+                'task-3',
+                'task-4'
+            ],
+            [
+                'task-5'
+            ]
+        ],
+        tasks: {
+            'task-1': {
+                label: 'KYC Verification',
+                taskType: 'uipath.case-management.run-human-action'
+            },
+            'task-2': {
+                label: 'Document Review',
+                taskType: 'uipath.case-management.process'
+            },
+            'task-6': {
+                label: 'Credit Check',
+                taskType: 'uipath.case-management.rpa'
+            },
+            'task-3': {
+                label: 'Address Check',
+                taskType: 'uipath.case-management.rpa'
+            },
+            'task-4': {
+                label: 'Property Check',
+                taskType: 'uipath.case-management.rpa'
+            },
+            'task-5': {
+                label: 'Final Approval',
+                taskType: 'uipath.case-management.agent'
+            }
+        }
+    },
+    'stage-2': {
+        taskIds: [
+            [
+                'task-7'
+            ],
+            [
+                'task-8'
+            ]
+        ],
+        tasks: {
+            'task-7': {
+                label: 'Report Generation',
+                taskType: 'uipath.case-management.api-workflow'
+            },
+            'task-8': {
+                label: 'Send Notification',
+                taskType: 'uipath.case-management.action'
+            }
+        }
+    },
+    'stage-3': {
+        taskIds: [],
+        tasks: {}
+    }
+};
+function getTaskIcon(taskType) {
+    if (taskType.includes('human-action')) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskIcon_index_cjs_namespaceObject.TaskIcon, {
+        type: external_TaskIcon_index_cjs_namespaceObject.TaskItemTypeValues.User,
+        size: "sm"
+    });
+    if (taskType.includes('rpa')) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskIcon_index_cjs_namespaceObject.TaskIcon, {
+        type: external_TaskIcon_index_cjs_namespaceObject.TaskItemTypeValues.Automation,
+        size: "sm"
+    });
+    if (taskType.includes('agent')) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskIcon_index_cjs_namespaceObject.TaskIcon, {
+        type: external_TaskIcon_index_cjs_namespaceObject.TaskItemTypeValues.Agent,
+        size: "sm"
+    });
+    if (taskType.includes('api-workflow')) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskIcon_index_cjs_namespaceObject.TaskIcon, {
+        type: external_TaskIcon_index_cjs_namespaceObject.TaskItemTypeValues.ApiAutomation,
+        size: "sm"
+    });
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskIcon_index_cjs_namespaceObject.TaskIcon, {
+        type: external_TaskIcon_index_cjs_namespaceObject.TaskItemTypeValues.AgenticProcess,
+        size: "sm"
+    });
+}
+function createTaskNodes(stageId, stageData, stageWidth) {
+    const positions = (0, useTaskPositions_cjs_namespaceObject.calculateTaskPositions)(stageData.taskIds, stageWidth);
+    const nodes = [];
+    stageData.taskIds.forEach((group, groupIndex)=>{
+        group.forEach((taskId, taskIndex)=>{
+            const taskInfo = stageData.tasks[taskId];
+            if (!taskInfo) return;
+            const position = positions.get(taskId);
+            if (!position) return;
+            nodes.push({
+                id: taskId,
+                type: 'task',
+                parentId: stageId,
+                position: {
+                    x: position.x,
+                    y: position.y
+                },
+                width: position.width,
+                data: {
+                    taskType: taskInfo.taskType,
+                    label: taskInfo.label,
+                    iconElement: getTaskIcon(taskInfo.taskType),
+                    groupIndex,
+                    taskIndex,
+                    width: position.width
+                }
+            });
+        });
+    });
+    return nodes;
+}
+const CrossStageTaskDragDemo = ()=>{
+    const [stageData, setStageData] = (0, external_react_namespaceObject.useState)(initialStageData);
+    const [dragInfo, setDragInfo] = (0, external_react_namespaceObject.useState)('');
+    const [selectedTaskId, setSelectedTaskId] = (0, external_react_namespaceObject.useState)(null);
+    const [selectedStageId, setSelectedStageId] = (0, external_react_namespaceObject.useState)(null);
+    const stageNodes = (0, external_react_namespaceObject.useMemo)(()=>[
+            {
+                id: 'stage-1',
+                type: 'stageV2',
+                position: {
+                    x: 48,
+                    y: 96
+                },
+                style: {
+                    width: 304
+                },
+                data: {
+                    nodeType: 'case-management:Stage',
+                    stageDetails: {
+                        label: 'Processing',
+                        taskIds: stageData['stage-1']?.taskIds ?? []
+                    },
+                    onTaskClick: (taskId)=>{
+                        setSelectedTaskId(taskId);
+                        setSelectedStageId('stage-1');
+                    }
+                }
+            },
+            {
+                id: 'stage-2',
+                type: 'stageV2',
+                position: {
+                    x: 400,
+                    y: 96
+                },
+                style: {
+                    width: 304
+                },
+                data: {
+                    nodeType: 'case-management:Stage',
+                    stageDetails: {
+                        label: 'Review',
+                        taskIds: stageData['stage-2']?.taskIds ?? []
+                    },
+                    onTaskClick: (taskId)=>{
+                        setSelectedTaskId(taskId);
+                        setSelectedStageId('stage-2');
+                    }
+                }
+            },
+            {
+                id: 'stage-3',
+                type: 'stageV2',
+                position: {
+                    x: 752,
+                    y: 96
+                },
+                style: {
+                    width: 304
+                },
+                data: {
+                    nodeType: 'case-management:Stage',
+                    stageDetails: {
+                        label: 'Closing (Drop Here)',
+                        taskIds: stageData['stage-3']?.taskIds ?? [],
+                        defaultContent: 'Drag a task here'
+                    },
+                    onTaskClick: (taskId)=>{
+                        setSelectedTaskId(taskId);
+                        setSelectedStageId('stage-3');
+                    },
+                    onStageClick: ()=>setSelectedStageId('stage-3')
+                }
+            }
+        ], [
+        stageData
+    ]);
+    const taskNodes = (0, external_react_namespaceObject.useMemo)(()=>{
+        const nodes = [];
+        for (const stageId of Object.keys(stageData)){
+            const data = stageData[stageId];
+            if (data) nodes.push(...createTaskNodes(stageId, data, 304));
+        }
+        return nodes;
+    }, [
+        stageData
+    ]);
+    const allNodes = (0, external_react_namespaceObject.useMemo)(()=>[
+            ...stageNodes,
+            ...taskNodes
+        ], [
+        stageNodes,
+        taskNodes
+    ]);
+    const [nodes, setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(allNodes);
+    const [edges, _setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)([
+        {
+            id: 'e1',
+            type: 'stage',
+            source: 'stage-1',
+            sourceHandle: 'stage-1____source____right',
+            target: 'stage-2',
+            targetHandle: 'stage-2____target____left'
+        },
+        {
+            id: 'e2',
+            type: 'stage',
+            source: 'stage-2',
+            sourceHandle: 'stage-2____source____right',
+            target: 'stage-3',
+            targetHandle: 'stage-3____target____left'
+        }
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        setNodes(allNodes);
+    }, [
+        allNodes,
+        setNodes
+    ]);
+    const handleTaskMove = (0, external_react_namespaceObject.useCallback)((params)=>{
+        const { taskId, sourceStageId, targetStageId, position } = params;
+        setDragInfo(`Moved ${taskId} from ${sourceStageId} to ${targetStageId} at group ${position.groupIndex}${position.isParallel ? ' (parallel)' : ''}`);
+        setStageData((prev)=>{
+            const sourceStage = prev[sourceStageId];
+            const targetStage = prev[targetStageId];
+            if (!sourceStage?.tasks || !sourceStage?.taskIds || !targetStage) return prev;
+            const taskInfo = sourceStage.tasks[taskId];
+            if (!taskInfo) return prev;
+            const { sourceTaskIds: newSourceTaskIds, targetTaskIds: newTargetTaskIds } = (0, taskReorderUtils_cjs_namespaceObject.moveTaskBetweenStages)(sourceStage.taskIds, targetStage.taskIds || [], taskId, position);
+            const newSourceTasks = {
+                ...sourceStage.tasks
+            };
+            delete newSourceTasks[taskId];
+            return {
+                ...prev,
+                [sourceStageId]: {
+                    ...sourceStage,
+                    taskIds: newSourceTaskIds,
+                    tasks: newSourceTasks
+                },
+                [targetStageId]: {
+                    ...targetStage,
+                    taskIds: newTargetTaskIds,
+                    tasks: {
+                        ...targetStage.tasks || {},
+                        [taskId]: taskInfo
+                    }
+                }
+            };
+        });
+    }, []);
+    const handleTaskCopy = (0, external_react_namespaceObject.useCallback)((params)=>{
+        const { taskId, newTaskId, sourceStageId, targetStageId, position } = params;
+        setDragInfo(`Copied ${taskId} to ${newTaskId} in ${targetStageId} at group ${position.groupIndex}${position.isParallel ? ' (parallel)' : ''}`);
+        setStageData((prev)=>{
+            const sourceStage = prev[sourceStageId];
+            const targetStage = prev[targetStageId];
+            if (!sourceStage?.tasks || !targetStage) return prev;
+            const taskInfo = sourceStage.tasks[taskId];
+            if (!taskInfo) return prev;
+            const newTargetTaskIds = (0, taskReorderUtils_cjs_namespaceObject.insertTaskAtPosition)(targetStage.taskIds || [], newTaskId, position);
+            return {
+                ...prev,
+                [targetStageId]: {
+                    ...targetStage,
+                    taskIds: newTargetTaskIds,
+                    tasks: {
+                        ...targetStage.tasks || {},
+                        [newTaskId]: {
+                            ...taskInfo,
+                            label: `${taskInfo.label} (Copy)`
+                        }
+                    }
+                }
+            };
+        });
+    }, []);
+    const handleTaskReorder = (0, external_react_namespaceObject.useCallback)((params)=>{
+        const { taskId, stageId, position } = params;
+        setDragInfo(`Reordered ${taskId} in ${stageId} to group ${position.groupIndex}${position.isParallel ? ' (parallel)' : ''}`);
+        setStageData((prev)=>{
+            const stage = prev[stageId];
+            if (!stage) return prev;
+            const newTaskIds = (0, taskReorderUtils_cjs_namespaceObject.moveTaskWithinStage)(stage.taskIds, taskId, position);
+            return {
+                ...prev,
+                [stageId]: {
+                    ...stage,
+                    taskIds: newTaskIds
+                }
+            };
+        });
+    }, []);
+    const handleTaskPaste = (0, external_react_namespaceObject.useCallback)((params)=>{
+        const { newTaskId, originalData, targetStageId, position } = params;
+        setDragInfo(`Pasted task ${newTaskId} to ${targetStageId} at group ${position.groupIndex}`);
+        setStageData((prev)=>{
+            const newData = {
+                ...prev
+            };
+            const targetStage = newData[targetStageId];
+            if (!targetStage) return prev;
+            const newTargetTaskIds = [
+                ...targetStage.taskIds || []
+            ];
+            if (position.groupIndex >= newTargetTaskIds.length) newTargetTaskIds.push([
+                newTaskId
+            ]);
+            else newTargetTaskIds.splice(position.groupIndex, 0, [
+                newTaskId
+            ]);
+            newData[targetStageId] = {
+                ...targetStage,
+                taskIds: newTargetTaskIds,
+                tasks: {
+                    ...targetStage.tasks || {},
+                    [newTaskId]: {
+                        label: `${originalData.label} (Pasted)`,
+                        taskType: originalData.taskType
+                    }
+                }
+            };
+            return newData;
+        });
+    }, []);
+    const targetTaskIds = (0, external_react_namespaceObject.useMemo)(()=>{
+        if (!selectedStageId) return [];
+        return stageData[selectedStageId]?.taskIds || [];
+    }, [
+        selectedStageId,
+        stageData
+    ]);
+    const nodeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
+            stageV2: StageNodeWrapper,
+            task: TaskNodeWrapper,
+            placeholder: (props)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskNode_index_cjs_namespaceObject.PlaceholderTaskNode, {
+                    ...props
+                })
+        }), []);
+    const edgeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
+            stage: external_StageEdge_cjs_namespaceObject.StageEdge
+        }), []);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        style: {
+            width: '100vw',
+            height: '100vh'
+        },
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_cjs_namespaceObject.ReactFlowProvider, {
+            children: [
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CrossStageTaskDragCanvas, {
+                    nodes: nodes,
+                    edges: edges,
+                    onNodesChange: onNodesChange,
+                    onEdgesChange: onEdgesChange,
+                    nodeTypes: nodeTypes,
+                    edgeTypes: edgeTypes,
+                    onTaskMove: handleTaskMove,
+                    onTaskCopy: handleTaskCopy,
+                    onTaskPaste: handleTaskPaste,
+                    onTaskReorder: handleTaskReorder,
+                    selectedTaskId: selectedTaskId,
+                    selectedStageId: selectedStageId,
+                    targetTaskIds: targetTaskIds
+                }),
+                dragInfo && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.Panel, {
+                    position: "top-left",
+                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                        style: {
+                            background: 'var(--uix-palette-surface-paper)',
+                            padding: '8px 16px',
+                            borderRadius: '4px',
+                            boxShadow: '0 2px 4px rgba(0,0,0,0.1)'
+                        },
+                        children: dragInfo
+                    })
+                }),
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.Panel, {
+                    position: "bottom-left",
+                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                        style: {
+                            background: 'var(--uix-palette-surface-paper)',
+                            padding: '8px 16px',
+                            borderRadius: '4px',
+                            boxShadow: '0 2px 4px rgba(0,0,0,0.1)',
+                            maxWidth: '300px'
+                        },
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("strong", {
+                                children: "Instructions:"
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("ul", {
+                                style: {
+                                    margin: '8px 0',
+                                    paddingLeft: '16px'
+                                },
+                                children: [
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("li", {
+                                        children: "Click a task to select it"
+                                    }),
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("li", {
+                                        children: "Drag tasks between stages"
+                                    }),
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("li", {
+                                        children: "Hold Alt/Cmd while dragging to copy"
+                                    }),
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("li", {
+                                        children: "Ctrl/Cmd+C to copy selected task"
+                                    }),
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("li", {
+                                        children: "Ctrl/Cmd+V to paste (click stage first)"
+                                    })
+                                ]
+                            })
+                        ]
+                    })
+                })
+            ]
+        })
+    });
+};
+const CrossStageTaskDragCanvas = ({ nodes, edges, onNodesChange, onEdgesChange, nodeTypes, edgeTypes, onTaskMove, onTaskCopy, onTaskPaste, onTaskReorder, selectedTaskId, selectedStageId, targetTaskIds })=>{
+    const { dragState, handlers } = (0, useCrossStageTaskDrag_cjs_namespaceObject.useCrossStageTaskDrag)({
+        onTaskMove,
+        onTaskCopy,
+        onTaskReorder
+    });
+    (0, useTaskCopyPaste_cjs_namespaceObject.useTaskCopyPaste)({
+        onTaskPaste
+    }, {
+        selectedTaskId,
+        targetStageId: selectedStageId,
+        targetTaskIds,
+        enabled: true
+    });
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CrossStageDragContext_cjs_namespaceObject.CrossStageDragProvider, {
+        value: {
+            dragState
+        },
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.BaseCanvas, {
+            nodes: nodes,
+            edges: edges,
+            onNodesChange: onNodesChange,
+            onEdgesChange: onEdgesChange,
+            nodeTypes: nodeTypes,
+            edgeTypes: edgeTypes,
+            mode: "design",
+            connectionMode: react_cjs_namespaceObject.ConnectionMode.Strict,
+            defaultEdgeOptions: {
+                type: 'stage'
+            },
+            connectionLineComponent: external_StageConnectionEdge_cjs_namespaceObject.StageConnectionEdge,
+            elevateEdgesOnSelect: true,
+            onNodeDragStart: handlers.onNodeDragStart,
+            onNodeDrag: handlers.onNodeDrag,
+            onNodeDragStop: handlers.onNodeDragStop,
+            children: [
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.Panel, {
+                    position: "bottom-right",
+                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasPositionControls_cjs_namespaceObject.CanvasPositionControls, {
+                        translations: external_types_cjs_namespaceObject.DefaultCanvasTranslations
+                    })
+                }),
+                dragState.isDragging && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.Panel, {
+                    position: "top-right",
+                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                        style: {
+                            background: dragState.isCopyMode ? 'var(--uix-palette-info-light)' : 'var(--uix-palette-warning-light)',
+                            padding: '8px 16px',
+                            borderRadius: '4px'
+                        },
+                        children: [
+                            dragState.isCopyMode ? 'Copy Mode (Alt/Cmd)' : 'Move Mode',
+                            dragState.targetStageId !== dragState.sourceStageId && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                                children: [
+                                    "Target: ",
+                                    dragState.targetStageId
+                                ]
+                            })
+                        ]
+                    })
+                })
+            ]
+        })
+    });
+};
+const DragAndDrop = {
+    name: 'Drag and Drop',
+    render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CrossStageTaskDragDemo, {})
+};
+exports.DragAndDrop = __webpack_exports__.DragAndDrop;
+exports["default"] = __webpack_exports__["default"];
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "DragAndDrop",
+    "default"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/StageNode/CrossStageTaskDrag.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const DragAndDrop: Story;
+//# sourceMappingURL=CrossStageTaskDrag.stories.d.ts.map

package/dist/canvas/components/StageNode/CrossStageTaskDrag.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CrossStageTaskDrag.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/CrossStageTaskDrag.stories.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAkCvD,QAAA,MAAM,IAAI,EAAE,IAKX,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA8fnC,eAAO,MAAM,WAAW,EAAE,KAGzB,CAAC"}