@datatechsolutions/ui 2.11.31 → 2.11.33

package/dist/{chunk-N4G3UXRU.mjs → chunk-3NXUTBDV.mjs}

@@ -1,14 +1,14 @@
 "use client";
-import { ToggleSwitch, GlassModal, ContextMenu, FormInput, FormSelect, FormTextarea, Button, IconButton } from './chunk-5ZWN5Q7H.mjs';
-import { useTranslations, I18nProvider, createI18nFromMessages } from './chunk-7VJ7CMMT.mjs';
+import { ToggleSwitch, GlassModal, ContextMenu, FormInput, FormSelect, FormTextarea, Button, IconButton } from './chunk-2JS5B55J.mjs';
 import { GraphNodeHeader, GraphNodeMeta, GraphNodeBadge, GraphNodeIconBubble } from './chunk-OZNTQROP.mjs';
 import { getAgentTier, createDefaultLogicNodeConfig, applyDagreLayout } from './chunk-TLPPVL3W.mjs';
+import { useTranslations, I18nProvider, createI18nFromMessages } from './chunk-7VJ7CMMT.mjs';
 import { memo, useState, useRef, useCallback, useEffect, lazy, createContext, useMemo, useContext } from 'react';
 import { Position, NodeResizer, MarkerType, useReactFlow, getBezierPath, BaseEdge, EdgeLabelRenderer, Handle, ReactFlowProvider, useNodesState, useEdgesState, addEdge, BackgroundVariant } from '@xyflow/react';
 import '@xyflow/react/dist/style.css';
 import { create } from 'zustand';
 import { PlusIcon, XMarkIcon } from '@heroicons/react/24/solid';
-import { Bars2Icon, CursorArrowRaysIcon, HandRaisedIcon, MagnifyingGlassPlusIcon, MagnifyingGlassMinusIcon, ArrowsPointingInIcon, ArrowUturnLeftIcon, ArrowUturnRightIcon, MapIcon, Squares2X2Icon, ArrowsRightLeftIcon, CommandLineIcon, ExclamationTriangleIcon, CpuChipIcon, TrashIcon, WrenchScrewdriverIcon, NewspaperIcon, ChartBarIcon, CloudIcon, ScaleIcon, AdjustmentsHorizontalIcon, CircleStackIcon, PlayIcon, StopIcon, ArrowsPointingOutIcon, CodeBracketIcon, GlobeAltIcon, DocumentTextIcon, ArrowPathIcon, BookOpenIcon, ChatBubbleLeftRightIcon, QuestionMarkCircleIcon, AdjustmentsVerticalIcon, Square3Stack3DIcon, DocumentMagnifyingGlassIcon, ListBulletIcon, PlayCircleIcon, PencilSquareIcon, ServerStackIcon, KeyIcon, RectangleGroupIcon, ChevronDownIcon, ChevronUpIcon, PresentationChartBarIcon, ChartPieIcon, ChartBarSquareIcon, CurrencyDollarIcon, ShieldCheckIcon, ClipboardDocumentCheckIcon, FireIcon, ShoppingBagIcon, UsersIcon, BuildingStorefrontIcon, PencilIcon, DocumentDuplicateIcon, ClipboardDocumentIcon, ClipboardIcon, PlusIcon as PlusIcon$1, XMarkIcon as XMarkIcon$1 } from '@heroicons/react/24/outline';
+import { Bars2Icon, CursorArrowRaysIcon, HandRaisedIcon, MagnifyingGlassPlusIcon, MagnifyingGlassMinusIcon, ArrowsPointingInIcon, ArrowUturnLeftIcon, ArrowUturnRightIcon, MapIcon, EllipsisHorizontalIcon, Squares2X2Icon, ArrowsRightLeftIcon, CommandLineIcon, ExclamationTriangleIcon, CpuChipIcon, TrashIcon, WrenchScrewdriverIcon, NewspaperIcon, ChartBarIcon, CloudIcon, ScaleIcon, AdjustmentsHorizontalIcon, CircleStackIcon, PlayIcon, StopIcon, ArrowsPointingOutIcon, CodeBracketIcon, GlobeAltIcon, DocumentTextIcon, ArrowPathIcon, BookOpenIcon, ChatBubbleLeftRightIcon, QuestionMarkCircleIcon, AdjustmentsVerticalIcon, Square3Stack3DIcon, DocumentMagnifyingGlassIcon, ListBulletIcon, PlayCircleIcon, PencilSquareIcon, ServerStackIcon, KeyIcon, RectangleGroupIcon, ChevronDownIcon, ChevronUpIcon, PresentationChartBarIcon, ChartPieIcon, ChartBarSquareIcon, CurrencyDollarIcon, ShieldCheckIcon, ClipboardDocumentCheckIcon, FireIcon, ShoppingBagIcon, UsersIcon, BuildingStorefrontIcon, PencilIcon, DocumentDuplicateIcon, ClipboardDocumentIcon, ClipboardIcon, PlusIcon as PlusIcon$1, XMarkIcon as XMarkIcon$1 } from '@heroicons/react/24/outline';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 var DEFAULT_PASTE_OFFSET = 40;
@@ -28,6 +28,10 @@ var useWorkflowStore = create((set, get) => ({
   showVariableInspector: false,
   showVersionHistory: false,
   showRunPanel: false,
+  showMinimap: true,
+  showDots: true,
+  showShortcuts: false,
+  cardDisplayMode: "detailed",
   isRunning: false,
   nodeResults: {},
   selectedRunId: null,
@@ -171,6 +175,21 @@ var useWorkflowStore = create((set, get) => ({
   toggleRunPanel: () => {
     set((state) => ({ showRunPanel: !state.showRunPanel }));
   },
+  toggleMinimap: () => {
+    set((state) => ({ showMinimap: !state.showMinimap }));
+  },
+  toggleDots: () => {
+    set((state) => ({ showDots: !state.showDots }));
+  },
+  toggleShortcuts: () => {
+    set((state) => ({ showShortcuts: !state.showShortcuts }));
+  },
+  closeShortcuts: () => {
+    set({ showShortcuts: false });
+  },
+  toggleCardDisplayMode: () => {
+    set((state) => ({ cardDisplayMode: state.cardDisplayMode === "detailed" ? "compact" : "detailed" }));
+  },
   setIsRunning: (running) => {
     set({ isRunning: running });
   },
@@ -201,6 +220,10 @@ var useWorkflowStore = create((set, get) => ({
       showVariableInspector: false,
       showVersionHistory: false,
       showRunPanel: false,
+      showMinimap: true,
+      showDots: true,
+      showShortcuts: false,
+      cardDisplayMode: "detailed",
       isRunning: false,
       nodeResults: {},
       selectedRunId: null,
@@ -793,6 +816,8 @@ var DraggableCommandBar = memo(function DraggableCommandBar2({
   onControlModeChange,
   showMinimap,
   onToggleMinimap,
+  showDots,
+  onToggleDots,
   cardDisplayMode,
   onToggleCardDisplayMode,
   layoutDirection,
@@ -916,6 +941,16 @@ var DraggableCommandBar = memo(function DraggableCommandBar2({
                 children: /* @__PURE__ */ jsx(MapIcon, { className: "h-4 w-4" })
               }
             ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: onToggleDots,
+                title: tWorkflow("toggleDots"),
+                className: showDots ? activeButtonClassName : inactiveButtonClassName,
+                children: /* @__PURE__ */ jsx(EllipsisHorizontalIcon, { className: "h-4 w-4" })
+              }
+            ),
             /* @__PURE__ */ jsx(
               "button",
               {
@@ -992,7 +1027,9 @@ var DraggableCommandBar = memo(function DraggableCommandBar2({
                         { keys: "\u21E7 5", label: tWorkflow("shortcutZoom50") },
                         { keys: "Esc", label: tWorkflow("shortcutDeselect") },
                         { keys: "\u232B", label: tWorkflow("shortcutDelete") },
-                        { keys: "L", label: tWorkflow("layoutMode") }
+                        { keys: "L", label: tWorkflow("layoutMode") },
+                        { keys: "G", label: tWorkflow("toggleDots") },
+                        { keys: "M", label: tWorkflow("toggleMinimap") }
                       ].map((shortcut) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
                         /* @__PURE__ */ jsx("span", { className: "text-[11px] text-gray-600 dark:text-gray-300", children: shortcut.label }),
                         /* @__PURE__ */ jsx("span", { className: "flex items-center gap-0.5", children: shortcut.keys.split(" ").map((key) => /* @__PURE__ */ jsx(
@@ -1604,6 +1641,7 @@ var AgentToolFlowNode = memo(function AgentToolFlowNode2({ id, data, selected })
                 checked: Boolean(agentTool.enabled),
                 onChange: () => data.onToggle?.(agentTool),
                 size: "sm",
+                color: "blue",
                 label: `${agentTool.name} enabled`
               }
             )
@@ -1711,6 +1749,7 @@ var ToolFlowNode = memo(function ToolFlowNode2({ id, data, selected }) {
                     checked: Boolean(tool.enabled),
                     onChange: () => onToggle(tool),
                     size: "sm",
+                    color: "blue",
                     label: `${tool.name} enabled`
                   }
                 )
@@ -1862,6 +1901,7 @@ var RuleFlowNode = memo(function RuleFlowNode2({ id, data, selected }) {
                     checked: Boolean(rule.enabled),
                     onChange: () => onToggle(rule),
                     size: "sm",
+                    color: "violet",
                     label: `${rule.name} enabled`
                   }
                 )
@@ -5951,10 +5991,16 @@ function WorkflowCanvasInner({
   const canRedo = useWorkflowStore((state) => state.future.length > 0);
   const controlMode = useWorkflowStore((state) => state.controlMode);
   const setControlMode = useWorkflowStore((state) => state.setControlMode);
-  const [showMinimap, setShowMinimap] = useState(true);
-  const [showShortcuts, setShowShortcuts] = useState(false);
-  const [cardDisplayMode, setCardDisplayMode] = useState("detailed");
+  const showMinimap = useWorkflowStore((s) => s.showMinimap);
+  const showDots = useWorkflowStore((s) => s.showDots);
+  const showShortcuts = useWorkflowStore((s) => s.showShortcuts);
+  const cardDisplayMode = useWorkflowStore((s) => s.cardDisplayMode);
   const layoutDirection = useWorkflowStore((s) => s.layoutDirection);
+  const toggleMinimap = useWorkflowStore((s) => s.toggleMinimap);
+  const toggleDots = useWorkflowStore((s) => s.toggleDots);
+  const toggleShortcuts = useWorkflowStore((s) => s.toggleShortcuts);
+  const closeShortcuts = useWorkflowStore((s) => s.closeShortcuts);
+  const toggleCardDisplayMode = useWorkflowStore((s) => s.toggleCardDisplayMode);
   const setLayoutDirection = useWorkflowStore((s) => s.setLayoutDirection);
   const [editingLogicNodeId, setEditingLogicNodeId] = useState(null);
   const handleEditLogicNode = useCallback((nodeId) => {
@@ -6729,6 +6775,14 @@ function WorkflowCanvasInner({
           setControlMode("hand");
           return;
         }
+        if (event.key.toLowerCase() === "g") {
+          toggleDots();
+          return;
+        }
+        if (event.key.toLowerCase() === "m") {
+          toggleMinimap();
+          return;
+        }
         if (event.shiftKey && event.key === "!") {
           event.preventDefault();
           zoomTo(1);
@@ -7294,7 +7348,7 @@ function WorkflowCanvasInner({
           deleteKeyCode: ["Backspace", "Delete"],
           connectionLineStyle: { stroke: GRAPH_ACTIVE_EDGE_COLOR, strokeWidth: 2 },
           children: [
-            /* @__PURE__ */ jsx(
+            showDots && /* @__PURE__ */ jsx(
               Background,
               {
                 variant: BackgroundVariant.Dots,
@@ -7330,14 +7384,16 @@ function WorkflowCanvasInner({
           controlMode,
           onControlModeChange: setControlMode,
           showMinimap,
-          onToggleMinimap: () => setShowMinimap((previous) => !previous),
+          onToggleMinimap: toggleMinimap,
+          showDots,
+          onToggleDots: toggleDots,
           cardDisplayMode,
-          onToggleCardDisplayMode: () => setCardDisplayMode((previous) => previous === "detailed" ? "compact" : "detailed"),
+          onToggleCardDisplayMode: toggleCardDisplayMode,
           layoutDirection,
           onLayoutDirectionChange: handleLayoutDirectionChange,
           showShortcuts,
-          onToggleShortcuts: () => setShowShortcuts((previous) => !previous),
-          onCloseShortcuts: () => setShowShortcuts(false),
+          onToggleShortcuts: toggleShortcuts,
+          onCloseShortcuts: closeShortcuts,
           tWorkflow
         }
       ),
@@ -7545,5 +7601,5 @@ function Workspace({
 }
 
 export { AgentFlowNode, AgentToolFlowNode, AnswerFlowNode, AnthropicIcon, CATEGORY_COLORS, CATEGORY_PILL_COLORS, CodeFlowNode, CrewAIIcon, DocumentExtractorFlowNode, EndFlowNode, EntityFlowNode, FRAMEWORK_META, GoogleADKIcon, GroupFlowNode, HttpRequestFlowNode, ICON_MAP, IfElseFlowNode, IterationFlowNode, IterationStartFlowNode, KnowledgeBaseFlowNode, LOGIC_ICON_MAP, LOGIC_NODE_BADGE_COLORS, LOGIC_NODE_GRADIENTS, LOGIC_NODE_HANDLE_COLORS, LangChainIcon, ListOperatorFlowNode, LogicNodeModal, MINIMAP_NODE_COLORS, ModelProviderFlowNode, NODE_EXECUTION_ACCENT_COLORS, NodeCard, NodeContextMenu, NoteFlowNode, OpenAIIcon, PanelContextMenu, ParameterExtractorFlowNode, QuestionClassifierFlowNode, RuleFlowNode, SelectionContextMenu, StartFlowNode, StrandsIcon, TemplateTransformFlowNode, ToolFlowNode, VariableAggregatorFlowNode, VariableAssignerFlowNode, WorkflowBuilderProvider, WorkflowCanvas, Workspace, getCompatibleModels, getDefaultFrameworkForModel, getEntityBadgeColor, getEntityGradient, getEntityHandleColor, getEntityIcon, getEntityMinimapColor, getFrameworkMeta, getNodeExecutionAccent, getNodeExecutionAccentRgb, isFrameworkCompatibleWithProviders, isModelCompatibleWithFramework, useModalStore, useWorkflowBuilderClient, useWorkflowBuilderClientOptional, useWorkflowStore };
-//# sourceMappingURL=chunk-N4G3UXRU.mjs.map
-//# sourceMappingURL=chunk-N4G3UXRU.mjs.map
+//# sourceMappingURL=chunk-3NXUTBDV.mjs.map
+//# sourceMappingURL=chunk-3NXUTBDV.mjs.map