@datatechsolutions/ui 3.5.1 → 3.6.1

package/dist/{chunk-WKCR4KVQ.mjs → chunk-KDFBN2L2.mjs}

@@ -1,7 +1,7 @@
 "use client";
-import { ToggleSwitch, GlassModal, ContextMenu, FormInput, FormTextarea, FormSelect, Button, IconButton } from './chunk-EUXHJMGC.mjs';
+import { Badge, ToggleSwitch, StatusBadge, GlassModal, ContextMenu, FormInput, FormTextarea, FormSelect, Button, IconButton } from './chunk-4OFG6POC.mjs';
 import { useTranslations, I18nProvider, createI18nFromMessages } from './chunk-7VJ7CMMT.mjs';
-import { GraphNodeHeader, GraphNodeMeta, GraphNodeBadge, GraphNodeIconBubble } from './chunk-OZNTQROP.mjs';
+import { GraphNodeHeader, GraphNodeMeta, GraphNodeIconBubble, GraphNodeBadge } from './chunk-OZNTQROP.mjs';
 import { getAgentTier, createDefaultLogicNodeConfig, applyDagreLayout } from './chunk-G7JQ4OCE.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';
@@ -1963,9 +1963,6 @@ function NodeCardDeleteAction({ nodeId, onDelete }) {
     }
   );
 }
-function NodeCardBranchLabel({ children, className }) {
-  return /* @__PURE__ */ jsx("span", { className, children });
-}
 var BASE_HANDLE_CLASS = "!h-3 !w-3 !border-2 !border-white dark:!border-gray-800";
 function useResolvedPosition(position) {
   const layoutDirection = useWorkflowStore((s) => s.layoutDirection);
@@ -2113,21 +2110,18 @@ var AgentFlowNode = memo(function AgentFlowNode2({ id, data, selected }) {
         ] })
       ] }),
       /* @__PURE__ */ jsx(NodeCardMeta, { compact: isCompact, children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [
-        /* @__PURE__ */ jsx(NodeCardBadge, { className: "rounded-full bg-indigo-100 px-2 py-0.5 text-[10px] font-semibold text-indigo-700 dark:bg-indigo-500/20 dark:text-indigo-300", children: "Agent" }),
+        /* @__PURE__ */ jsx(Badge, { color: "indigo", size: "xs", children: "Agent" }),
         (() => {
           const tier = getAgentTier(Number(data.agent.elo ?? 0));
-          return /* @__PURE__ */ jsx(NodeCardBadge, { className: `rounded-full px-2 py-0.5 text-[10px] font-bold ${tier.pillColor}`, children: tier.key });
+          return /* @__PURE__ */ jsx(Badge, { color: "zinc", size: "xs", className: tier.pillColor, children: tier.key });
         })(),
-        /* @__PURE__ */ jsxs(NodeCardBadge, { className: `inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px] font-medium ${frameworkMeta.badgeColor}`, children: [
-          /* @__PURE__ */ jsx(frameworkMeta.IconComponent, { className: "h-3 w-3" }),
-          frameworkMeta.label
-        ] }),
-        /* @__PURE__ */ jsx(NodeCardBadge, { className: "rounded-full bg-blue-50 px-2 py-0.5 text-[10px] font-medium text-blue-700 dark:bg-blue-900/25 dark:text-blue-300", children: data.agent.modelId }),
-        /* @__PURE__ */ jsxs(NodeCardBadge, { className: "rounded-full bg-gray-100 px-2 py-0.5 text-[10px] font-medium text-gray-600 dark:bg-white/10 dark:text-gray-300", children: [
+        /* @__PURE__ */ jsx(Badge, { color: "zinc", size: "xs", className: frameworkMeta.badgeColor, icon: /* @__PURE__ */ jsx(frameworkMeta.IconComponent, { className: "h-3 w-3" }), children: frameworkMeta.label }),
+        /* @__PURE__ */ jsx(Badge, { color: "blue", size: "xs", children: data.agent.modelId }),
+        /* @__PURE__ */ jsxs(Badge, { color: "zinc", size: "xs", children: [
           "T: ",
           data.agent.temperature
         ] }),
-        /* @__PURE__ */ jsxs(NodeCardBadge, { className: "rounded-full bg-gray-100 px-2 py-0.5 text-[10px] font-medium text-gray-600 dark:bg-white/10 dark:text-gray-300", children: [
+        /* @__PURE__ */ jsxs(Badge, { color: "zinc", size: "xs", children: [
           "v",
           data.agent.activePromptVersion
         ] }),
@@ -2135,7 +2129,16 @@ var AgentFlowNode = memo(function AgentFlowNode2({ id, data, selected }) {
           /* @__PURE__ */ jsx("div", { className: "w-full" }),
           /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center gap-1 border-t border-gray-200/20 pt-1 dark:border-white/5", children: [
             /* @__PURE__ */ jsx(CommandLineIcon, { className: "h-3 w-3 shrink-0 text-amber-500 dark:text-amber-400" }),
-            data.agentTools.slice(0, 3).map((tool) => /* @__PURE__ */ jsx(NodeCardBadge, { className: `rounded px-1.5 py-px text-[9px] font-medium ${tool.enabled ? "bg-amber-100 text-amber-700 dark:bg-amber-500/15 dark:text-amber-300" : "bg-gray-100 text-gray-400 line-through dark:bg-white/5 dark:text-gray-500"}`, children: tool.name }, tool.id)),
+            data.agentTools.slice(0, 3).map((tool) => /* @__PURE__ */ jsx(
+              Badge,
+              {
+                color: tool.enabled ? "amber" : "zinc",
+                size: "xs",
+                className: tool.enabled ? "" : "line-through",
+                children: tool.name
+              },
+              tool.id
+            )),
             data.agentTools.length > 3 && /* @__PURE__ */ jsxs("span", { className: "text-[9px] text-gray-400 dark:text-gray-500", children: [
               "+",
               data.agentTools.length - 3
@@ -2237,9 +2240,9 @@ var AgentToolFlowNode = memo(function AgentToolFlowNode2({ id, data, selected })
         )
       ] }),
       /* @__PURE__ */ jsx(NodeCardMeta, { compact: isCompact, children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [
-        /* @__PURE__ */ jsx(NodeCardBadge, { className: "rounded-full bg-amber-100 px-2 py-0.5 text-[10px] font-semibold text-amber-700 dark:bg-amber-500/20 dark:text-amber-300", children: t("agentToolNode") }),
-        /* @__PURE__ */ jsx(NodeCardBadge, { className: `rounded-full px-2 py-0.5 text-[10px] font-medium ${pill}`, children: category }),
-        agentTool.parameters && agentTool.parameters.length > 0 && /* @__PURE__ */ jsxs(NodeCardBadge, { className: "rounded-full bg-gray-100 px-2 py-0.5 text-[10px] font-medium text-gray-600 dark:bg-white/10 dark:text-gray-300", children: [
+        /* @__PURE__ */ jsx(Badge, { color: "amber", size: "xs", children: t("agentToolNode") }),
+        /* @__PURE__ */ jsx(Badge, { color: "zinc", size: "xs", className: pill, children: category }),
+        agentTool.parameters && agentTool.parameters.length > 0 && /* @__PURE__ */ jsxs(Badge, { color: "zinc", size: "xs", children: [
           agentTool.parameters.length,
           " params"
         ] }),
@@ -2346,8 +2349,8 @@ var ToolFlowNode = memo(function ToolFlowNode2({ id, data, selected }) {
           ] }),
           /* @__PURE__ */ jsxs(NodeCardMeta, { compact: isCompact, children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx(NodeCardBadge, { className: "inline-flex items-center rounded-full bg-teal-100 px-2 py-0.5 text-[10px] font-semibold text-teal-700 dark:bg-teal-400/15 dark:text-teal-400", children: t("nodeType") }),
-              /* @__PURE__ */ jsx(NodeCardBadge, { className: `inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium ${categoryPill}`, children: tool.category }),
+              /* @__PURE__ */ jsx(Badge, { color: "teal", size: "xs", children: t("nodeType") }),
+              /* @__PURE__ */ jsx(Badge, { color: "zinc", size: "xs", className: categoryPill, children: tool.category }),
               /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-gray-400 dark:text-gray-500", children: [
                 String(tool.timeoutMs ?? ""),
                 "ms"
@@ -2404,7 +2407,7 @@ var RuleFlowNode = memo(function RuleFlowNode2({ id, data, selected }) {
               ] }),
               !isCompact && /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-center justify-between", children: [
                 /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-full bg-violet-100 px-2 py-0.5 text-[10px] font-semibold text-violet-700 dark:bg-violet-500/20 dark:text-violet-300", children: t("ruleEngine") }),
+                  /* @__PURE__ */ jsx(Badge, { color: "violet", size: "xs", children: t("ruleEngine") }),
                   contextVariableCount > 0 && /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-gray-400 dark:text-gray-500", children: [
                     contextVariableCount,
                     " vars"
@@ -2498,8 +2501,8 @@ var RuleFlowNode = memo(function RuleFlowNode2({ id, data, selected }) {
           ] }),
           !isCompact && /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-center justify-between", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-full bg-violet-100 px-2 py-0.5 text-[10px] font-semibold text-violet-700 dark:bg-violet-500/20 dark:text-violet-300", children: t("nodeType") }),
-              /* @__PURE__ */ jsx("span", { className: `inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium ${typePill}`, children: adjustmentType }),
+              /* @__PURE__ */ jsx(Badge, { color: "violet", size: "xs", children: t("nodeType") }),
+              /* @__PURE__ */ jsx(Badge, { color: "zinc", size: "xs", className: typePill, children: adjustmentType }),
               /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-gray-400 dark:text-gray-500", children: [
                 "P",
                 String(rule.priority ?? "")
@@ -2577,8 +2580,8 @@ var EntityFlowNode = memo(function EntityFlowNode2({ id, data, selected }) {
           ] }),
           /* @__PURE__ */ jsxs(NodeCardMeta, { compact: isCompact, children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx(NodeCardBadge, { className: `inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-semibold ${badgeColor}`, children: t("entityNodeType") }),
-              /* @__PURE__ */ jsxs(NodeCardBadge, { className: `inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium ${badgeColor}`, children: [
+              /* @__PURE__ */ jsx(Badge, { color: "zinc", size: "xs", className: badgeColor, children: t("entityNodeType") }),
+              /* @__PURE__ */ jsxs(Badge, { color: "zinc", size: "xs", className: badgeColor, children: [
                 fieldCount,
                 " ",
                 t("entityFields")
@@ -2739,8 +2742,8 @@ var IfElseFlowNode = memo(function IfElseFlowNode2({ id, data, selected }) {
             ] }),
             /* @__PURE__ */ jsx(NodeCardDeleteAction, { nodeId: id, onDelete })
           ] }),
-          /* @__PURE__ */ jsx(NodeCardBranchLabel, { className: "pointer-events-none absolute -right-12 top-1/2 -translate-y-1/2 rounded-full bg-green-100 px-2 py-0.5 text-[10px] font-semibold text-green-700 shadow-sm dark:bg-green-500/20 dark:text-green-300", children: t("ifBranchLabel") }),
-          /* @__PURE__ */ jsx(NodeCardBranchLabel, { className: "pointer-events-none absolute bottom-[-1.9rem] left-1/2 -translate-x-1/2 rounded-full bg-red-100 px-2 py-0.5 text-[10px] font-semibold text-red-700 shadow-sm dark:bg-red-500/20 dark:text-red-300", children: t("elseBranchLabel") })
+          /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute -right-12 top-1/2 -translate-y-1/2", children: /* @__PURE__ */ jsx(StatusBadge, { status: "success", label: t("ifBranchLabel"), size: "sm" }) }),
+          /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute bottom-[-1.9rem] left-1/2 -translate-x-1/2", children: /* @__PURE__ */ jsx(StatusBadge, { status: "error", label: t("elseBranchLabel"), size: "sm" }) })
         ]
       }
     ),
@@ -3500,8 +3503,8 @@ var DatasourceFlowNode = memo(function DatasourceFlowNode2({ id, data, selected
     ] }),
     /* @__PURE__ */ jsxs(NodeCardMeta, { compact: isCompact, children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
-        config.dialect && /* @__PURE__ */ jsx(NodeCardBadge, { className: "inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-semibold bg-cyan-100 text-cyan-700 dark:bg-cyan-400/15 dark:text-cyan-400", children: config.dialect }),
-        readOnly && /* @__PURE__ */ jsx(NodeCardBadge, { className: "inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium bg-slate-100 text-slate-600 dark:bg-slate-500/20 dark:text-slate-400", children: "sample" }),
+        config.dialect && /* @__PURE__ */ jsx(Badge, { color: "cyan", size: "xs", children: config.dialect }),
+        readOnly && /* @__PURE__ */ jsx(Badge, { color: "zinc", size: "xs", children: "sample" }),
         /* @__PURE__ */ jsx("span", { className: "text-[10px] text-gray-400 dark:text-gray-500", children: [
           columnCount > 0 ? `${columnCount} cols` : null,
           filterCount > 0 ? `${filterCount} filters` : null,
@@ -8593,5 +8596,5 @@ function Workspace({
 }
 
 export { AgentFlowNode, AgentToolFlowNode, AnswerFlowNode, AnthropicIcon, CATEGORY_COLORS, CATEGORY_PILL_COLORS, CodeFlowNode, CrewAIIcon, DocumentExtractorFlowNode, EXPERIMENTAL_NODE_TYPES, 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, NODE_EXECUTION_ACCENT_COLORS, NodeCard, NodeCardBadge, NodeCardDeleteAction, NodeCardHeader, NodeCardMeta, NodeContextMenu, NodeIconBubble, NodeInteractiveCard, NodeRunningIndicator, NoteFlowNode, OpenAIIcon, PanelContextMenu, ParameterExtractorFlowNode, QuestionClassifierFlowNode, RuleFlowNode, SelectionContextMenu, StartFlowNode, StrandsIcon, TemplateTransformFlowNode, ToolFlowNode, VariableAggregatorFlowNode, VariableAssignerFlowNode, WorkflowBuilderProvider, WorkflowCanvas, WorkflowHandle, Workspace, getCompatibleModels, getDefaultFrameworkForModel, getEntityBadgeColor, getEntityGradient, getEntityHandleColor, getEntityIcon, getEntityMinimapColor, getFrameworkMeta, getNodeExecutionAccent, getNodeExecutionAccentRgb, isFrameworkCompatibleWithProviders, isModelCompatibleWithFramework, useModalStore, useWorkflowBuilderClient, useWorkflowBuilderClientOptional, useWorkflowStore };
-//# sourceMappingURL=chunk-WKCR4KVQ.mjs.map
-//# sourceMappingURL=chunk-WKCR4KVQ.mjs.map
+//# sourceMappingURL=chunk-KDFBN2L2.mjs.map
+//# sourceMappingURL=chunk-KDFBN2L2.mjs.map