ai-design-system 0.1.39 → 0.1.41

package/components/blocks/WorkflowCanvas/WorkflowCanvas.tsx

@@ -97,7 +97,7 @@ function WorkflowCanvasInner({
         connectionMode={ConnectionMode.Strict}
         edges={edges}
         edgeTypes={edgeTypes}
-        elementsSelectable={interactive}
+        elementsSelectable={true}
         isValidConnection={isValidConnection}
         nodes={nodes}
         nodeTypes={nodeTypes}
@@ -106,8 +106,8 @@ function WorkflowCanvasInner({
         onConnect={interactive ? onConnect : undefined}
         onConnectEnd={interactive ? onConnectEnd : undefined}
         onConnectStart={interactive ? onConnectStart : undefined}
-        onEdgesChange={interactive ? onEdgesChange : undefined}
-        onNodesChange={interactive ? onNodesChange : undefined}
+        onEdgesChange={onEdgesChange}
+        onNodesChange={onNodesChange}
         onPaneClick={onPaneClick}
         onNodeClick={onNodeClick}
         onEdgeClick={onEdgeClick}

package/components/composites/FileQueue/FileQueue.tsx

@@ -102,7 +102,11 @@ export const FileQueue = React.memo<FileQueueProps>(
                           aria-selected={isClickable ? isSelected : undefined}
                         >
                           <div className="flex items-start gap-2">
-                            <Icon name="file" size="sm" className="mt-0.5" />
+                            <Icon 
+                              name={file.icon || "file"} 
+                              size="sm" 
+                              className={cn("mt-0.5", file.iconColor)} 
+                            />
                             <QueueItemContent>
                               {file.name}
                               {file.path && (

package/components/composites/FileQueue/interfaces.ts

@@ -4,6 +4,8 @@ export interface FileItem {
   id: string;
   name: string;
   path?: string;
+  icon?: string;
+  iconColor?: string;
 }
 
 export interface FileGroup {

package/components/composites/StateNode/StateNode.tsx

@@ -66,13 +66,12 @@ export const StateNode = memo(({ data, selected, id }: StateNodeProps) => {
   const isTerminal = data.isTerminal === true;
 
   return (
-    <Node
-      className={cn(
-        "relative flex flex-col items-center justify-center border border-border bg-card shadow-none transition-all duration-150 ease-out",
-        selected && "border-primary border-2",
-        isTerminal && "border-2 border-primary",
-        isDisabled && "opacity-50"
-      )}
+      <Node
+        className={cn(
+          "relative flex flex-col items-center justify-center border border-border bg-card shadow-none transition-all duration-150 ease-out",
+          selected ? "border-primary border-2" : "border border-border",
+          isDisabled && "opacity-50"
+        )}
       data-testid={`state-node-${id}`}
       handles={{ target: true, source: true }}
       status={status}

package/dist/index.cjs

@@ -2984,7 +2984,14 @@ var FileQueue = React3__namespace.memo(
               onKeyDown: (e) => handleKeyDown(e, file.id),
               "aria-selected": isClickable ? isSelected : void 0,
               children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "file", size: "sm", className: "mt-0.5" }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  Icon,
+                  {
+                    name: file.icon || "file",
+                    size: "sm",
+                    className: cn("mt-0.5", file.iconColor)
+                  }
+                ),
                 /* @__PURE__ */ jsxRuntime.jsxs(QueueItemContent, { children: [
                   file.name,
                   file.path && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground/70", children: [
@@ -8298,14 +8305,13 @@ var StateNode = React3.memo(({ data, selected, id }) => {
   const displayDescription = data.description;
   const status = data.status;
   const isDisabled = data.enabled === false;
-  const isTerminal = data.isTerminal === true;
+  data.isTerminal === true;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Node2,
     {
       className: cn(
         "relative flex flex-col items-center justify-center border border-border bg-card shadow-none transition-all duration-150 ease-out",
-        selected && "border-primary border-2",
-        isTerminal && "border-2 border-primary",
+        selected ? "border-primary border-2" : "border border-border",
         isDisabled && "opacity-50"
       ),
       "data-testid": `state-node-${id}`,
@@ -9439,7 +9445,7 @@ function WorkflowCanvasInner({
           connectionMode: react.ConnectionMode.Strict,
           edges,
           edgeTypes,
-          elementsSelectable: interactive,
+          elementsSelectable: true,
           isValidConnection,
           nodes,
           nodeTypes,
@@ -9448,8 +9454,8 @@ function WorkflowCanvasInner({
           onConnect: interactive ? onConnect : void 0,
           onConnectEnd: interactive ? onConnectEnd : void 0,
           onConnectStart: interactive ? onConnectStart : void 0,
-          onEdgesChange: interactive ? onEdgesChange : void 0,
-          onNodesChange: interactive ? onNodesChange : void 0,
+          onEdgesChange,
+          onNodesChange,
           onPaneClick,
           onNodeClick,
           onEdgeClick,