@datatechsolutions/ui 3.11.0 → 3.11.1

package/dist/platform/pages/index.mjs

@@ -1,17 +1,17 @@
 "use client";
 import { adaptWorkflowGraphToUi, formatDurationMs } from '../../chunk-UQXVCVAN.mjs';
-import { WorkflowWorkspace } from '../../chunk-TCIK6WHT.mjs';
-export { RolesPageView, UsersPageView } from '../../chunk-TCIK6WHT.mjs';
-import { DatasourceModal, findDialect, findCategory, DIALECT_CATEGORIES } from '../../chunk-37FWIPYO.mjs';
-export { DIALECT_CATEGORIES, DatasourceFormModal, DatasourceModal, findCategory, findDialect } from '../../chunk-37FWIPYO.mjs';
-import { defaultRuleForm, RuleForm, ExecutionTimelinePanel, defaultRuleCondition, defaultRuleAction, RuleConditionBuilder, RuleActionBuilder } from '../../chunk-ZJMYLUZ2.mjs';
+import { WorkflowWorkspace } from '../../chunk-7DZ2C5IN.mjs';
+export { RolesPageView, UsersPageView } from '../../chunk-7DZ2C5IN.mjs';
+import { DatasourceModal, findDialect, findCategory, DIALECT_CATEGORIES } from '../../chunk-S4LHC5SF.mjs';
+export { DIALECT_CATEGORIES, DatasourceFormModal, DatasourceModal, findCategory, findDialect } from '../../chunk-S4LHC5SF.mjs';
+import { defaultRuleForm, RuleForm, ExecutionTimelinePanel, defaultRuleCondition, defaultRuleAction, RuleConditionBuilder, RuleActionBuilder } from '../../chunk-E3NMVWRL.mjs';
 import '../../chunk-JB6RNAD2.mjs';
 import '../../chunk-LEXBTVGM.mjs';
-import '../../chunk-3US2QXEF.mjs';
-import { HeroSection, SearchBar, PageLoadingState, PageEmptyState, EntityCard, CreateActionButton, GlassModal, FormGrid, FormSelect, FormInput, FormTextarea, SectionHeader, Text, Form, FormActionsRow, Table, TableHead, TableRow, TableHeader, TableBody, TableCell, InlineForm, CopyableId, ListCard, ListCardItem, Avatar, SectionCard, Tabs, TabsList, TabsTrigger, TabsContent, StepIndicator, FilterTileButton, FormToggle, Spinner, StatusBadge, ChipPicker, FormCheckbox, SegmentedControl, DatePicker, TimePicker } from '../../chunk-35P352JX.mjs';
+import '../../chunk-IHOCYBHM.mjs';
+import { HeroSection, SearchBar, PageLoadingState, PageEmptyState, EntityCard, CreateActionButton, GlassModal, FormGrid, FormSelect, FormInput, FormTextarea, SectionHeader, Text, Form, FormActionsRow, Table, TableHead, TableRow, TableHeader, TableBody, TableCell, InlineForm, CopyableId, ListCard, ListCardItem, Avatar, SectionCard, Tabs, TabsList, TabsTrigger, TabsContent, StepIndicator, FilterTileButton, FormToggle, Spinner, StatusBadge, ChipPicker, FormCheckbox, SegmentedControl, DatePicker, TimePicker } from '../../chunk-OKCEK7GH.mjs';
+import '../../chunk-7VJ7CMMT.mjs';
 import '../../chunk-IGOMJHC6.mjs';
 import '../../chunk-3AY5HIQ6.mjs';
-import '../../chunk-7VJ7CMMT.mjs';
 import '../../chunk-PLTLRL2V.mjs';
 import { Badge, Button } from '../../chunk-WR55H7DH.mjs';
 import '../../chunk-D2JF6C3E.mjs';
@@ -962,7 +962,16 @@ function RulesPageView({ labels, rules, loading, onCreate, onUpdate, onDelete, o
       title: labels.title,
       subtitle: labels.subtitle,
       gradient: "from-fuchsia-500 to-purple-700",
-      toolbar: /* @__PURE__ */ jsx(
+      toolbar: !isEmpty ? /* @__PURE__ */ jsx(
+        SearchBar,
+        {
+          searchTerm,
+          onSearchChange: setSearchTerm,
+          placeholder: labels.searchPlaceholder ?? labels.title,
+          noBorder: true
+        }
+      ) : void 0,
+      actions: /* @__PURE__ */ jsx(
         CreateActionButton,
         {
           mode: "desktop",
@@ -982,43 +991,33 @@ function RulesPageView({ labels, rules, loading, onCreate, onUpdate, onDelete, o
       accent: "fuchsia"
     }
   );
-  const content = loading ? /* @__PURE__ */ jsx(PageLoadingState, {}) : isEmpty ? /* @__PURE__ */ jsx(PageEmptyState, { title: labels.empty, message: labels.subtitle, iconName: "folder-open" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      SearchBar,
-      {
-        searchTerm,
-        onSearchChange: setSearchTerm,
-        placeholder: labels.searchPlaceholder ?? labels.title
-      }
-    ),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: filteredRules.map((rule) => /* @__PURE__ */ jsx(
-      EntityCard,
-      {
-        accentGradient: "from-fuchsia-500 to-purple-700",
-        icon: /* @__PURE__ */ jsx("div", { className: "flex h-11 w-11 items-center justify-center rounded-lg bg-fuchsia-500/10 text-fuchsia-600 dark:bg-fuchsia-500/20 dark:text-fuchsia-400", children: /* @__PURE__ */ jsx(AdjustmentsHorizontalIcon, { className: "h-6 w-6" }) }),
-        title: rule.name,
-        subtitle: `${labels.order}: ${rule.order ?? 0}`,
-        status: /* @__PURE__ */ jsx(Badge, { color: rule.enabled ? "emerald" : "zinc", children: rule.enabled ? labels.enabled : labels.disabled }),
-        footer: /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-          /* @__PURE__ */ jsx(Button, { type: "button", size: "sm", outline: true, onClick: () => setEditing(rule), children: labels.edit }),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              type: "button",
-              size: "sm",
-              color: "rose",
-              onClick: () => {
-                if (window.confirm(labels.deleteConfirm)) onDelete(rule);
-              },
-              children: labels.delete
-            }
-          )
-        ] }),
-        children: rule.description && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: rule.description })
-      },
-      rule.ruleId
-    )) })
-  ] });
+  const content = loading ? /* @__PURE__ */ jsx(PageLoadingState, {}) : isEmpty ? /* @__PURE__ */ jsx(PageEmptyState, { title: labels.empty, message: labels.subtitle, iconName: "folder-open" }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: filteredRules.map((rule) => /* @__PURE__ */ jsx(
+    EntityCard,
+    {
+      accentGradient: "from-fuchsia-500 to-purple-700",
+      icon: /* @__PURE__ */ jsx("div", { className: "flex h-11 w-11 items-center justify-center rounded-lg bg-fuchsia-500/10 text-fuchsia-600 dark:bg-fuchsia-500/20 dark:text-fuchsia-400", children: /* @__PURE__ */ jsx(AdjustmentsHorizontalIcon, { className: "h-6 w-6" }) }),
+      title: rule.name,
+      subtitle: `${labels.order}: ${rule.order ?? 0}`,
+      status: /* @__PURE__ */ jsx(Badge, { color: rule.enabled ? "emerald" : "zinc", children: rule.enabled ? labels.enabled : labels.disabled }),
+      footer: /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx(Button, { type: "button", size: "sm", outline: true, onClick: () => setEditing(rule), children: labels.edit }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            size: "sm",
+            color: "rose",
+            onClick: () => {
+              if (window.confirm(labels.deleteConfirm)) onDelete(rule);
+            },
+            children: labels.delete
+          }
+        )
+      ] }),
+      children: rule.description && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: rule.description })
+    },
+    rule.ruleId
+  )) });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
       hero,
@@ -1319,7 +1318,16 @@ function DatasourcesPageView({
         title: labels.title,
         subtitle: labels.subtitle,
         gradient: "from-amber-500 to-orange-600",
-        toolbar: /* @__PURE__ */ jsx(
+        toolbar: !isEmpty ? /* @__PURE__ */ jsx(
+          SearchBar,
+          {
+            searchTerm,
+            onSearchChange: setSearchTerm,
+            placeholder: labels.searchPlaceholder ?? labels.title,
+            noBorder: true
+          }
+        ) : void 0,
+        actions: /* @__PURE__ */ jsx(
           CreateActionButton,
           {
             mode: "desktop",
@@ -1339,14 +1347,6 @@ function DatasourcesPageView({
         accent: "amber"
       }
     ),
-    !isEmpty && /* @__PURE__ */ jsx(
-      SearchBar,
-      {
-        searchTerm,
-        onSearchChange: setSearchTerm,
-        placeholder: labels.searchPlaceholder ?? labels.title
-      }
-    ),
     isEmpty ? /* @__PURE__ */ jsx(
       PageEmptyState,
       {
@@ -1762,7 +1762,16 @@ function ConnectionsPageView({
       title: labels.title,
       subtitle: labels.subtitle,
       gradient: "from-sky-500 to-indigo-600",
-      toolbar: /* @__PURE__ */ jsx(
+      toolbar: !isEmpty ? /* @__PURE__ */ jsx(
+        SearchBar,
+        {
+          searchTerm,
+          onSearchChange: setSearchTerm,
+          placeholder: labels.searchPlaceholder ?? labels.title,
+          noBorder: true
+        }
+      ) : void 0,
+      actions: /* @__PURE__ */ jsx(
         CreateActionButton,
         {
           mode: "desktop",
@@ -1782,50 +1791,40 @@ function ConnectionsPageView({
       accent: "sky"
     }
   );
-  const content = loading ? /* @__PURE__ */ jsx(PageLoadingState, {}) : isEmpty ? /* @__PURE__ */ jsx(PageEmptyState, { title: labels.empty, message: labels.subtitle, iconName: "folder-open" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      SearchBar,
-      {
-        searchTerm,
-        onSearchChange: setSearchTerm,
-        placeholder: labels.searchPlaceholder ?? labels.title
-      }
-    ),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: filteredConnections.map((conn) => /* @__PURE__ */ jsx(
-      EntityCard,
-      {
-        accentGradient: "from-sky-500 to-indigo-600",
-        icon: /* @__PURE__ */ jsx("div", { className: "flex h-11 w-11 items-center justify-center rounded-lg bg-sky-500/10 text-sky-600 dark:bg-sky-500/20 dark:text-sky-400", children: /* @__PURE__ */ jsx(LinkIcon, { className: "h-6 w-6" }) }),
-        title: conn.name,
-        subtitle: providerLabel(conn.providerSlug),
-        status: /* @__PURE__ */ jsxs("div", { className: "flex gap-1", children: [
-          /* @__PURE__ */ jsx(Badge, { color: conn.enabled ? "emerald" : "zinc", children: conn.enabled ? labels.enable : labels.disable }),
-          conn.credentialRef ? /* @__PURE__ */ jsx(Badge, { color: "indigo", children: "Secret set" }) : /* @__PURE__ */ jsx(Badge, { color: "amber", children: "No secret" })
-        ] }),
-        footer: /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-          /* @__PURE__ */ jsx(Button, { type: "button", size: "sm", outline: true, onClick: () => setEditing(conn), children: labels.edit }),
-          /* @__PURE__ */ jsx(
-            Button,
-            {
-              type: "button",
-              size: "sm",
-              color: "rose",
-              onClick: async () => {
-                if (window.confirm(labels.deleteConfirm)) await onDelete(conn);
-              },
-              children: labels.delete
-            }
-          )
-        ] }),
-        children: /* @__PURE__ */ jsxs("dl", { className: "mt-1 space-y-0.5 text-xs text-slate-500 dark:text-slate-400", children: [
-          conn.region && /* @__PURE__ */ jsx(Row, { label: "Region", value: conn.region }),
-          conn.endpoint && /* @__PURE__ */ jsx(Row, { label: "Endpoint", value: conn.endpoint }),
-          conn.modelFilter && conn.modelFilter.length > 0 && /* @__PURE__ */ jsx(Row, { label: "Models", value: conn.modelFilter.join(", ") })
-        ] })
-      },
-      conn.id
-    )) })
-  ] });
+  const content = loading ? /* @__PURE__ */ jsx(PageLoadingState, {}) : isEmpty ? /* @__PURE__ */ jsx(PageEmptyState, { title: labels.empty, message: labels.subtitle, iconName: "folder-open" }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: filteredConnections.map((conn) => /* @__PURE__ */ jsx(
+    EntityCard,
+    {
+      accentGradient: "from-sky-500 to-indigo-600",
+      icon: /* @__PURE__ */ jsx("div", { className: "flex h-11 w-11 items-center justify-center rounded-lg bg-sky-500/10 text-sky-600 dark:bg-sky-500/20 dark:text-sky-400", children: /* @__PURE__ */ jsx(LinkIcon, { className: "h-6 w-6" }) }),
+      title: conn.name,
+      subtitle: providerLabel(conn.providerSlug),
+      status: /* @__PURE__ */ jsxs("div", { className: "flex gap-1", children: [
+        /* @__PURE__ */ jsx(Badge, { color: conn.enabled ? "emerald" : "zinc", children: conn.enabled ? labels.enable : labels.disable }),
+        conn.credentialRef ? /* @__PURE__ */ jsx(Badge, { color: "indigo", children: "Secret set" }) : /* @__PURE__ */ jsx(Badge, { color: "amber", children: "No secret" })
+      ] }),
+      footer: /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx(Button, { type: "button", size: "sm", outline: true, onClick: () => setEditing(conn), children: labels.edit }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            size: "sm",
+            color: "rose",
+            onClick: async () => {
+              if (window.confirm(labels.deleteConfirm)) await onDelete(conn);
+            },
+            children: labels.delete
+          }
+        )
+      ] }),
+      children: /* @__PURE__ */ jsxs("dl", { className: "mt-1 space-y-0.5 text-xs text-slate-500 dark:text-slate-400", children: [
+        conn.region && /* @__PURE__ */ jsx(Row, { label: "Region", value: conn.region }),
+        conn.endpoint && /* @__PURE__ */ jsx(Row, { label: "Endpoint", value: conn.endpoint }),
+        conn.modelFilter && conn.modelFilter.length > 0 && /* @__PURE__ */ jsx(Row, { label: "Models", value: conn.modelFilter.join(", ") })
+      ] })
+    },
+    conn.id
+  )) });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
       hero,
@@ -2283,6 +2282,15 @@ function AgentsWorkspacePageView({
       title: labels.title,
       subtitle: labels.subtitle,
       gradient: "from-violet-500 to-indigo-700",
+      toolbar: !isEmpty ? /* @__PURE__ */ jsx(
+        SearchBar,
+        {
+          searchTerm,
+          onSearchChange: setSearchTerm,
+          placeholder: labels.searchPlaceholder,
+          noBorder: true
+        }
+      ) : void 0,
       actions: /* @__PURE__ */ jsx(
         CreateActionButton,
         {
@@ -2310,84 +2318,74 @@ function AgentsWorkspacePageView({
       message: labels.emptyMessage,
       iconName: "folder-open"
     }
-  ) : /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
-    /* @__PURE__ */ jsx(
-      SearchBar,
-      {
-        searchTerm,
-        onSearchChange: setSearchTerm,
-        placeholder: labels.searchPlaceholder
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 lg:grid-cols-[20rem_minmax(0,1fr)]", children: [
-      /* @__PURE__ */ jsx("div", { className: "lg:sticky lg:top-4", children: /* @__PURE__ */ jsx(ListCard, { variant: "glass", children: filteredAgents.map((agent) => {
-        const id = String(agent.agentId ?? agent.id ?? "");
-        const active = id === selectedId;
-        const initials = deriveInitials(String(agent.name ?? id));
-        const modelName = models.find((m) => m.id === String(agent.modelId ?? ""))?.name ?? String(agent.modelId ?? "");
-        return /* @__PURE__ */ jsx(
-          ListCardItem,
-          {
-            leading: /* @__PURE__ */ jsx(Avatar, { tone: active ? "violet" : "slate", initials }),
-            trailing: agent.activePromptVersion > 0 ? /* @__PURE__ */ jsxs(Badge, { color: "emerald", children: [
-              "v",
-              agent.activePromptVersion
-            ] }) : /* @__PURE__ */ jsx(Badge, { color: "zinc", children: "draft" }),
-            pressable: true,
-            onPress: () => {
-              setSelectedId(id);
-              onSelectAgent?.(id);
-            },
-            className: active ? "bg-violet-500/5 dark:bg-violet-400/10" : "",
-            children: /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
-              /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-semibold text-slate-900 dark:text-slate-100", children: String(agent.name ?? id) }),
-              modelName && /* @__PURE__ */ jsx("p", { className: "truncate text-xs text-slate-500 dark:text-slate-400", children: modelName })
-            ] })
-          },
-          id
-        );
-      }) }) }),
-      /* @__PURE__ */ jsx("div", { children: selectedAgent ? /* @__PURE__ */ jsx(
-        AgentDetail,
-        {
-          agent: selectedAgent,
-          labels,
-          models,
-          tools,
-          connections,
-          prompts: promptsByAgent[String(selectedAgent.agentId ?? selectedAgent.id ?? "")] ?? [],
-          onUpdateAgent,
-          onDeleteAgent,
-          onCreatePrompt,
-          onActivatePrompt,
-          onAttachTool,
-          onDetachTool,
-          onUpdateModel,
-          onCleared: () => {
-            setSelectedId(null);
-            onSelectAgent?.(null);
-          }
-        },
-        String(selectedAgent.agentId ?? selectedAgent.id ?? "")
-      ) : /* @__PURE__ */ jsx(
-        SectionCard,
+  ) : /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 lg:grid-cols-[20rem_minmax(0,1fr)]", children: [
+    /* @__PURE__ */ jsx("div", { className: "lg:sticky lg:top-4", children: /* @__PURE__ */ jsx(ListCard, { variant: "glass", children: filteredAgents.map((agent) => {
+      const id = String(agent.agentId ?? agent.id ?? "");
+      const active = id === selectedId;
+      const initials = deriveInitials(String(agent.name ?? id));
+      const modelName = models.find((m) => m.id === String(agent.modelId ?? ""))?.name ?? String(agent.modelId ?? "");
+      return /* @__PURE__ */ jsx(
+        ListCardItem,
         {
-          header: {
-            icon: /* @__PURE__ */ jsx(CpuChipIcon, { className: "h-4 w-4" }),
-            title: labels.noSelection,
-            subtitle: labels.noSelectionMessage
+          leading: /* @__PURE__ */ jsx(Avatar, { tone: active ? "violet" : "slate", initials }),
+          trailing: agent.activePromptVersion > 0 ? /* @__PURE__ */ jsxs(Badge, { color: "emerald", children: [
+            "v",
+            agent.activePromptVersion
+          ] }) : /* @__PURE__ */ jsx(Badge, { color: "zinc", children: "draft" }),
+          pressable: true,
+          onPress: () => {
+            setSelectedId(id);
+            onSelectAgent?.(id);
           },
-          children: /* @__PURE__ */ jsx(
-            PageEmptyState,
-            {
-              title: labels.noSelection,
-              message: labels.noSelectionMessage,
-              iconName: "folder-open"
-            }
-          )
+          className: active ? "bg-violet-500/5 dark:bg-violet-400/10" : "",
+          children: /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-semibold text-slate-900 dark:text-slate-100", children: String(agent.name ?? id) }),
+            modelName && /* @__PURE__ */ jsx("p", { className: "truncate text-xs text-slate-500 dark:text-slate-400", children: modelName })
+          ] })
+        },
+        id
+      );
+    }) }) }),
+    /* @__PURE__ */ jsx("div", { children: selectedAgent ? /* @__PURE__ */ jsx(
+      AgentDetail,
+      {
+        agent: selectedAgent,
+        labels,
+        models,
+        tools,
+        connections,
+        prompts: promptsByAgent[String(selectedAgent.agentId ?? selectedAgent.id ?? "")] ?? [],
+        onUpdateAgent,
+        onDeleteAgent,
+        onCreatePrompt,
+        onActivatePrompt,
+        onAttachTool,
+        onDetachTool,
+        onUpdateModel,
+        onCleared: () => {
+          setSelectedId(null);
+          onSelectAgent?.(null);
         }
-      ) })
-    ] })
+      },
+      String(selectedAgent.agentId ?? selectedAgent.id ?? "")
+    ) : /* @__PURE__ */ jsx(
+      SectionCard,
+      {
+        header: {
+          icon: /* @__PURE__ */ jsx(CpuChipIcon, { className: "h-4 w-4" }),
+          title: labels.noSelection,
+          subtitle: labels.noSelectionMessage
+        },
+        children: /* @__PURE__ */ jsx(
+          PageEmptyState,
+          {
+            title: labels.noSelection,
+            message: labels.noSelectionMessage,
+            iconName: "folder-open"
+          }
+        )
+      }
+    ) })
   ] });
   return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
     hero,