@datatechsolutions/ui 3.13.1 → 3.15.0

package/dist/{chunk-ZPV7X4ZE.mjs → chunk-RH6Z425K.mjs}

@@ -1,8 +1,8 @@
 "use client";
-import { AdminOrganizationDetail } from './chunk-SCGICCQM.mjs';
-import { BillingPanel } from './chunk-YHD6SJIN.mjs';
-import { UserProfile } from './chunk-3VCSMSJB.mjs';
-import { useAuth, InlineSpinner, SegmentedControl } from './chunk-QEACOJXX.mjs';
+import { AdminOrganizationDetail } from './chunk-PSS3E463.mjs';
+import { UserProfile } from './chunk-EZVBRLQH.mjs';
+import { BillingPanel } from './chunk-JJUWZNJY.mjs';
+import { useAuth, InlineSpinner, SegmentedControl } from './chunk-QCGSE24W.mjs';
 import { useTranslations } from './chunk-ZEFNBGYI.mjs';
 import { useMemo, useState, useEffect } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
@@ -94,5 +94,5 @@ function PlatformSettings({
 }
 
 export { PlatformSettings };
-//# sourceMappingURL=chunk-ZPV7X4ZE.mjs.map
-//# sourceMappingURL=chunk-ZPV7X4ZE.mjs.map
+//# sourceMappingURL=chunk-RH6Z425K.mjs.map
+//# sourceMappingURL=chunk-RH6Z425K.mjs.map

package/dist/{chunk-ZPV7X4ZE.mjs.map → chunk-RH6Z425K.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/platform/settings/platform-settings.tsx"],"names":[],"mappings":"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","file":"chunk-ZPV7X4ZE.mjs","sourcesContent":["// =============================================================================\n// @datatechsolutions/windsock/ui — PlatformSettings\n// Unified settings shell consumed by every product (astrlabe, kori).\n// Composes existing building blocks:\n//   - `<UserProfile>`             — Profile / Security / Sessions / Linked accounts\n//   - `<AdminOrganizationDetail>` — Members / Invitations / Domains\n//   - `<BillingPanel>`            — Current subscription + plan catalogue\n// Apps mount this at their `/settings` route; feature toggles hide sections\n// that a given user's role cannot access.\n// =============================================================================\n\nimport { useEffect, useMemo, useState } from 'react'\nimport { useTranslations } from '@ui/lib/i18n-context'\nimport { SegmentedControl, InlineSpinner } from '@ui/index'\nimport type { AdminClient, AuthOrganization } from '@datatechsolutions/shared-domain'\n\nimport { useAuth } from '../../_auth'\nimport { UserProfile } from '../auth/user-profile'\nimport { AdminOrganizationDetail } from '../admin/admin-organization-detail'\nimport { BillingPanel, type BillingPanelProps } from '../billing/billing-panel'\n\nexport type PlatformSettingsSection = 'account' | 'organization' | 'billing'\n\nexport interface PlatformSettingsProps {\n  /**\n   * Sections to surface to the current user. The host app is responsible for\n   * picking the right set based on RBAC — e.g. hide `organization` for users\n   * without `org:manage` and hide `billing` for users without `billing:read`.\n   * Defaults to all three.\n   */\n  sections?: PlatformSettingsSection[]\n  /** Starting section. Defaults to the first item in `sections`. */\n  defaultSection?: PlatformSettingsSection\n  /**\n   * Windsock admin API client. Required when `organization` is in `sections`.\n   * Create it once with `createAdminClient({ issuer, authClient })` and reuse.\n   */\n  adminClient?: AdminClient\n  /**\n   * Current organization id (usually `ctx.organizationId` from the JWT).\n   * Required when `organization` is in `sections`.\n   */\n  organizationId?: string\n  /** Forwarded to `<BillingPanel>` — e.g. redirect handler, billing interval. */\n  billing?: BillingPanelProps\n}\n\nconst DEFAULT_SECTIONS: PlatformSettingsSection[] = ['account', 'organization', 'billing']\n\nexport function PlatformSettings({\n  sections = DEFAULT_SECTIONS,\n  defaultSection,\n  adminClient,\n  organizationId,\n  billing,\n}: PlatformSettingsProps) {\n  const t = useTranslations('windsock')\n  const { status } = useAuth()\n\n  const visibleSections = useMemo(() => {\n    // Drop `organization` if the caller didn't pass an admin client + org id.\n    return sections.filter((section) => {\n      if (section === 'organization') {\n        return Boolean(adminClient && organizationId)\n      }\n      return true\n    })\n  }, [sections, adminClient, organizationId])\n\n  const initialSection: PlatformSettingsSection = (\n    defaultSection && visibleSections.includes(defaultSection)\n      ? defaultSection\n      : visibleSections[0] ?? 'account'\n  )\n\n  const [activeSection, setActiveSection] = useState<PlatformSettingsSection>(initialSection)\n  const [organization, setOrganization] = useState<AuthOrganization | null>(null)\n  const [orgLoadError, setOrgLoadError] = useState<string | null>(null)\n\n  // Resolve the org detail record (AdminOrganizationDetail needs the full\n  // AuthOrganization, not just the id). Fires once the organization tab is\n  // first selected so the listOrganizations round-trip is lazy.\n  useEffect(() => {\n    if (activeSection !== 'organization') return\n    if (!adminClient || !organizationId) return\n    if (organization?.id === organizationId) return\n\n    let cancelled = false\n    setOrgLoadError(null)\n    void adminClient.listOrganizations()\n      .then((orgs) => {\n        if (cancelled) return\n        const match = orgs.find((org) => org.id === organizationId)\n        if (match) {\n          setOrganization(match)\n        } else {\n          setOrgLoadError('Organization not found')\n        }\n      })\n      .catch((loadError: unknown) => {\n        if (cancelled) return\n        setOrgLoadError(loadError instanceof Error ? loadError.message : String(loadError))\n      })\n    return () => {\n      cancelled = true\n    }\n  }, [activeSection, adminClient, organizationId, organization?.id])\n\n  if (status === 'loading') {\n    return (\n      <div className=\"flex items-center justify-center py-12\">\n        <InlineSpinner />\n      </div>\n    )\n  }\n\n  if (status !== 'authenticated') {\n    return null\n  }\n\n  if (visibleSections.length === 0) {\n    return null\n  }\n\n  const segments = visibleSections.map((section) => ({\n    value: section,\n    label: t(`platformSettings.sections.${section}`),\n  }))\n\n  return (\n    <div className=\"space-y-6\">\n      {visibleSections.length > 1 && (\n        <SegmentedControl\n          segments={segments}\n          value={activeSection}\n          onChange={(value: string) => setActiveSection(value as PlatformSettingsSection)}\n          fullWidth\n        />\n      )}\n\n      {activeSection === 'account' && <UserProfile />}\n\n      {activeSection === 'organization' && adminClient && organizationId && (\n        organization ? (\n          <AdminOrganizationDetail\n            client={adminClient}\n            organization={organization}\n          />\n        ) : orgLoadError ? (\n          <div\n            role=\"alert\"\n            className=\"rounded-xl border border-red-300/40 bg-red-50/80 px-4 py-3 text-sm text-red-700 dark:border-red-500/30 dark:bg-red-500/10 dark:text-red-300\"\n          >\n            {orgLoadError}\n          </div>\n        ) : (\n          <div className=\"flex items-center justify-center py-12\">\n            <InlineSpinner />\n          </div>\n        )\n      )}\n\n      {activeSection === 'billing' && <BillingPanel {...billing} />}\n    </div>\n  )\n}\n"]}
+{"version":3,"sources":["../src/platform/settings/platform-settings.tsx"],"names":[],"mappings":"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","file":"chunk-RH6Z425K.mjs","sourcesContent":["// =============================================================================\n// @datatechsolutions/windsock/ui — PlatformSettings\n// Unified settings shell consumed by every product (astrlabe, kori).\n// Composes existing building blocks:\n//   - `<UserProfile>`             — Profile / Security / Sessions / Linked accounts\n//   - `<AdminOrganizationDetail>` — Members / Invitations / Domains\n//   - `<BillingPanel>`            — Current subscription + plan catalogue\n// Apps mount this at their `/settings` route; feature toggles hide sections\n// that a given user's role cannot access.\n// =============================================================================\n\nimport { useEffect, useMemo, useState } from 'react'\nimport { useTranslations } from '@ui/lib/i18n-context'\nimport { SegmentedControl, InlineSpinner } from '@ui/index'\nimport type { AdminClient, AuthOrganization } from '@datatechsolutions/shared-domain'\n\nimport { useAuth } from '../../_auth'\nimport { UserProfile } from '../auth/user-profile'\nimport { AdminOrganizationDetail } from '../admin/admin-organization-detail'\nimport { BillingPanel, type BillingPanelProps } from '../billing/billing-panel'\n\nexport type PlatformSettingsSection = 'account' | 'organization' | 'billing'\n\nexport interface PlatformSettingsProps {\n  /**\n   * Sections to surface to the current user. The host app is responsible for\n   * picking the right set based on RBAC — e.g. hide `organization` for users\n   * without `org:manage` and hide `billing` for users without `billing:read`.\n   * Defaults to all three.\n   */\n  sections?: PlatformSettingsSection[]\n  /** Starting section. Defaults to the first item in `sections`. */\n  defaultSection?: PlatformSettingsSection\n  /**\n   * Windsock admin API client. Required when `organization` is in `sections`.\n   * Create it once with `createAdminClient({ issuer, authClient })` and reuse.\n   */\n  adminClient?: AdminClient\n  /**\n   * Current organization id (usually `ctx.organizationId` from the JWT).\n   * Required when `organization` is in `sections`.\n   */\n  organizationId?: string\n  /** Forwarded to `<BillingPanel>` — e.g. redirect handler, billing interval. */\n  billing?: BillingPanelProps\n}\n\nconst DEFAULT_SECTIONS: PlatformSettingsSection[] = ['account', 'organization', 'billing']\n\nexport function PlatformSettings({\n  sections = DEFAULT_SECTIONS,\n  defaultSection,\n  adminClient,\n  organizationId,\n  billing,\n}: PlatformSettingsProps) {\n  const t = useTranslations('windsock')\n  const { status } = useAuth()\n\n  const visibleSections = useMemo(() => {\n    // Drop `organization` if the caller didn't pass an admin client + org id.\n    return sections.filter((section) => {\n      if (section === 'organization') {\n        return Boolean(adminClient && organizationId)\n      }\n      return true\n    })\n  }, [sections, adminClient, organizationId])\n\n  const initialSection: PlatformSettingsSection = (\n    defaultSection && visibleSections.includes(defaultSection)\n      ? defaultSection\n      : visibleSections[0] ?? 'account'\n  )\n\n  const [activeSection, setActiveSection] = useState<PlatformSettingsSection>(initialSection)\n  const [organization, setOrganization] = useState<AuthOrganization | null>(null)\n  const [orgLoadError, setOrgLoadError] = useState<string | null>(null)\n\n  // Resolve the org detail record (AdminOrganizationDetail needs the full\n  // AuthOrganization, not just the id). Fires once the organization tab is\n  // first selected so the listOrganizations round-trip is lazy.\n  useEffect(() => {\n    if (activeSection !== 'organization') return\n    if (!adminClient || !organizationId) return\n    if (organization?.id === organizationId) return\n\n    let cancelled = false\n    setOrgLoadError(null)\n    void adminClient.listOrganizations()\n      .then((orgs) => {\n        if (cancelled) return\n        const match = orgs.find((org) => org.id === organizationId)\n        if (match) {\n          setOrganization(match)\n        } else {\n          setOrgLoadError('Organization not found')\n        }\n      })\n      .catch((loadError: unknown) => {\n        if (cancelled) return\n        setOrgLoadError(loadError instanceof Error ? loadError.message : String(loadError))\n      })\n    return () => {\n      cancelled = true\n    }\n  }, [activeSection, adminClient, organizationId, organization?.id])\n\n  if (status === 'loading') {\n    return (\n      <div className=\"flex items-center justify-center py-12\">\n        <InlineSpinner />\n      </div>\n    )\n  }\n\n  if (status !== 'authenticated') {\n    return null\n  }\n\n  if (visibleSections.length === 0) {\n    return null\n  }\n\n  const segments = visibleSections.map((section) => ({\n    value: section,\n    label: t(`platformSettings.sections.${section}`),\n  }))\n\n  return (\n    <div className=\"space-y-6\">\n      {visibleSections.length > 1 && (\n        <SegmentedControl\n          segments={segments}\n          value={activeSection}\n          onChange={(value: string) => setActiveSection(value as PlatformSettingsSection)}\n          fullWidth\n        />\n      )}\n\n      {activeSection === 'account' && <UserProfile />}\n\n      {activeSection === 'organization' && adminClient && organizationId && (\n        organization ? (\n          <AdminOrganizationDetail\n            client={adminClient}\n            organization={organization}\n          />\n        ) : orgLoadError ? (\n          <div\n            role=\"alert\"\n            className=\"rounded-xl border border-red-300/40 bg-red-50/80 px-4 py-3 text-sm text-red-700 dark:border-red-500/30 dark:bg-red-500/10 dark:text-red-300\"\n          >\n            {orgLoadError}\n          </div>\n        ) : (\n          <div className=\"flex items-center justify-center py-12\">\n            <InlineSpinner />\n          </div>\n        )\n      )}\n\n      {activeSection === 'billing' && <BillingPanel {...billing} />}\n    </div>\n  )\n}\n"]}

package/dist/{chunk-RSCRIDMW.mjs → chunk-SMUBE3RO.mjs}

@@ -1,8 +1,8 @@
 "use client";
-import { NodeRunningIndicator, WorkflowHandle, NodeCard, NodeCardHeader, NodeCardMeta, NodeInteractiveCard, NodeIconBubble, NodeCardBadge, NodeCardDeleteAction, Workspace, useModalStore, CATEGORY_COLORS, CATEGORY_PILL_COLORS, ICON_MAP, WorkflowCanvas, EXPERIMENTAL_NODE_TYPES, getEntityIcon, getEntityGradient, useWorkflowStore, LOGIC_ICON_MAP, LOGIC_NODE_GRADIENTS, getFrameworkMeta, getCompatibleModels, isModelCompatibleWithFramework, FRAMEWORK_META, isFrameworkCompatibleWithProviders } from './chunk-TRNDFSM6.mjs';
-import { FormInput, FormSelect, Avatar, ToggleSwitch, HeroBlock, GlassModal, SectionCard, FormTextarea, FormGrid, Input, DynamicIslandConfirm } from './chunk-QEACOJXX.mjs';
+import { NodeRunningIndicator, WorkflowHandle, NodeCard, NodeCardHeader, NodeCardMeta, NodeInteractiveCard, NodeIconBubble, NodeCardBadge, NodeCardDeleteAction, Workspace, useModalStore, CATEGORY_COLORS, CATEGORY_PILL_COLORS, ICON_MAP, WorkflowCanvas, EXPERIMENTAL_NODE_TYPES, getEntityIcon, getEntityGradient, useWorkflowStore, LOGIC_ICON_MAP, LOGIC_NODE_GRADIENTS, getFrameworkMeta, getCompatibleModels, isModelCompatibleWithFramework, FRAMEWORK_META, isFrameworkCompatibleWithProviders } from './chunk-MSXJFWKD.mjs';
+import { FormInput, FormSelect, Avatar, ToggleSwitch, HeroBlock, GlassModal, SectionCard, FormTextarea, FormGrid, Input, DynamicIslandConfirm, SelectionCard } from './chunk-QCGSE24W.mjs';
 import { useTranslations } from './chunk-ZEFNBGYI.mjs';
-import { Badge, Button, IconButton } from './chunk-O4RZCDP2.mjs';
+import { Badge, Button, IconButton } from './chunk-2SBVFLPZ.mjs';
 import { getAgentTier, createDefaultLogicNodeConfig } from './chunk-G7JQ4OCE.mjs';
 import { memo, useCallback, useMemo, useState, useEffect, useRef, Children } from 'react';
 import { Position } from '@xyflow/react';
@@ -40,8 +40,8 @@ var ModelProviderFlowNode = memo(function ModelProviderFlowNode2({ id, data, sel
   if (!config) {
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(NodeRunningIndicator, { nodeId: id }),
-      /* @__PURE__ */ jsx(WorkflowHandle, { type: "target", position: Position.Left, id: "left-in", colorClass: "!bg-gray-400 dark:!bg-gray-500" }),
-      /* @__PURE__ */ jsx(WorkflowHandle, { type: "target", position: Position.Top, id: "top-in", colorClass: "!bg-gray-400 dark:!bg-gray-500" }),
+      /* @__PURE__ */ jsx(WorkflowHandle, { type: "target", position: Position.Left, id: "left-in", colorClass: "!bg-slate-400 dark:!bg-slate-500" }),
+      /* @__PURE__ */ jsx(WorkflowHandle, { type: "target", position: Position.Top, id: "top-in", colorClass: "!bg-slate-400 dark:!bg-slate-500" }),
       /* @__PURE__ */ jsx(NodeCard, { variant: "error", nodeType: "model_provider", width: "w-[280px]", children: /* @__PURE__ */ jsx(
         NodeCardHeader,
         {
@@ -62,8 +62,8 @@ var ModelProviderFlowNode = memo(function ModelProviderFlowNode2({ id, data, sel
   const logo = PROVIDER_LOGOS[config.providerType];
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(NodeRunningIndicator, { nodeId: id }),
-    /* @__PURE__ */ jsx(WorkflowHandle, { type: "target", position: Position.Left, id: "left-in", colorClass: "!bg-gray-400 dark:!bg-gray-500" }),
-    /* @__PURE__ */ jsx(WorkflowHandle, { type: "target", position: Position.Top, id: "top-in", colorClass: "!bg-gray-400 dark:!bg-gray-500" }),
+    /* @__PURE__ */ jsx(WorkflowHandle, { type: "target", position: Position.Left, id: "left-in", colorClass: "!bg-slate-400 dark:!bg-slate-500" }),
+    /* @__PURE__ */ jsx(WorkflowHandle, { type: "target", position: Position.Top, id: "top-in", colorClass: "!bg-slate-400 dark:!bg-slate-500" }),
     /* @__PURE__ */ jsx(
       "button",
       {
@@ -664,23 +664,19 @@ function ConfigTab({ models, t, selectedModelId, setSelectedModelId, selectedFra
         const isSelected = model.id === selectedModelId;
         const isCompatible = isModelCompatibleWithFramework(model.id, selectedFramework);
         const { IconComponent, color, providerLabel } = getModelIcon(model.id);
-        return /* @__PURE__ */ jsxs(
-          "button",
+        return /* @__PURE__ */ jsx(
+          SelectionCard,
           {
-            type: "button",
-            disabled: !isCompatible,
+            selected: isSelected,
             onClick: () => {
               setSelectedModelId(model.id);
               markDirty();
             },
-            className: `flex items-center gap-2.5 rounded-xl border px-3 py-2.5 text-left transition-all focus:outline-none focus-visible:ring-2 focus-visible:ring-indigo-500/70 focus-visible:ring-offset-1 ${!isCompatible ? "cursor-not-allowed border-slate-200/30 opacity-35 dark:border-white/5" : isSelected ? "border-indigo-500/50 bg-indigo-50/50 ring-1 ring-indigo-500/30 dark:border-indigo-400/40 dark:bg-indigo-500/10" : "border-slate-200/50 bg-white/40 backdrop-blur-sm hover:border-slate-300 dark:border-white/10 dark:bg-white/[0.04] dark:hover:border-white/20"}`,
-            children: [
-              /* @__PURE__ */ jsx(IconComponent, { className: `h-5 w-5 flex-shrink-0 ${isSelected && isCompatible ? color : "text-slate-400 dark:text-slate-500"}` }),
-              /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
-                /* @__PURE__ */ jsx("p", { className: `truncate text-xs font-semibold ${isSelected && isCompatible ? "text-slate-900 dark:text-white" : "text-slate-600 dark:text-slate-300"}`, children: model.name }),
-                /* @__PURE__ */ jsx("p", { className: "truncate text-[10px] text-slate-400 dark:text-slate-500", children: providerLabel })
-              ] })
-            ]
+            layout: "card",
+            compatibility: isCompatible ? "compatible" : "incompatible",
+            icon: /* @__PURE__ */ jsx(IconComponent, { className: `h-5 w-5 ${isSelected && isCompatible ? color : ""}` }),
+            label: model.name,
+            description: providerLabel
           },
           model.id
         );
@@ -1575,13 +1571,14 @@ function SubworkflowModal({ onSaved, onMaximize }) {
               ] })
             ] }),
             onMaximize && tool.toolId && /* @__PURE__ */ jsx(
-              "button",
+              IconButton,
               {
-                type: "button",
+                label: t("subworkflowDrawer.openFullEditor"),
+                variant: "ghost",
+                size: "sm",
+                color: "ios-teal",
                 onClick: () => onMaximize(tool.toolId),
-                title: t("subworkflowDrawer.openFullEditor"),
-                className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-lg text-slate-400 transition-colors hover:bg-white/10 hover:text-teal-500 dark:hover:text-teal-400",
-                children: /* @__PURE__ */ jsx(ArrowsPointingOutIcon, { className: "h-4 w-4" })
+                icon: /* @__PURE__ */ jsx(ArrowsPointingOutIcon, { className: "h-4 w-4" })
               }
             )
           ] }) }),
@@ -1891,7 +1888,7 @@ function RunReplayModal({
     }
   };
   const footer = /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
-    /* @__PURE__ */ jsxs("span", { className: "text-[11px] text-gray-400", children: [
+    /* @__PURE__ */ jsxs("span", { className: "text-[11px] text-slate-400", children: [
       "run ",
       /* @__PURE__ */ jsx("code", { children: runId.slice(0, 8) }),
       " \xB7 wf ",
@@ -1939,7 +1936,7 @@ function RunReplayModal({
           },
           className: "space-y-3",
           children: [
-            rows.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: t("replayNoInputs", { _: "This run had no input variables \u2014 replaying will execute the workflow as-is." }) }) : rows.map((row, index) => /* @__PURE__ */ jsx(
+            rows.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: t("replayNoInputs", { _: "This run had no input variables \u2014 replaying will execute the workflow as-is." }) }) : rows.map((row, index) => /* @__PURE__ */ jsx(
               RowEditor,
               {
                 row,
@@ -1961,9 +1958,9 @@ function RowEditor({
   onReset
 }) {
   const isJson = row.kind === "json";
-  return /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-gray-200/60 bg-gray-50/60 p-3 dark:border-white/10 dark:bg-white/5", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-slate-200/60 bg-slate-50/60 p-3 dark:border-white/10 dark:bg-white/5", children: [
     /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center justify-between gap-2", children: [
-      /* @__PURE__ */ jsx("span", { className: "font-mono text-xs text-gray-700 dark:text-gray-200", children: row.key }),
+      /* @__PURE__ */ jsx("span", { className: "font-mono text-xs text-slate-700 dark:text-slate-200", children: row.key }),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsx(Badge, { color: "zinc", size: "xs", className: "uppercase tracking-wider", children: row.kind }),
         row.touched && /* @__PURE__ */ jsx(Button, { type: "button", plain: true, size: "xs", onClick: onReset, children: "reset" })
@@ -1974,7 +1971,7 @@ function RowEditor({
       {
         value: row.value,
         onChange: (event) => onChange({ value: event.target.value }),
-        className: "w-full rounded-lg border border-gray-200/50 bg-white/70 px-3 py-2 text-sm text-gray-900 dark:border-white/10 dark:bg-gray-800/70 dark:text-gray-100",
+        className: "w-full rounded-lg border border-slate-200/50 bg-white/70 px-3 py-2 text-sm text-slate-900 dark:border-white/10 dark:bg-slate-800/70 dark:text-slate-100",
         children: [
           /* @__PURE__ */ jsx("option", { value: "true", children: "true" }),
           /* @__PURE__ */ jsx("option", { value: "false", children: "false" })
@@ -3394,30 +3391,27 @@ function WorkflowListBar({
           children: [
             /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
               /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ jsx("span", { className: `truncate text-sm font-medium ${isActive ? "text-indigo-700 dark:text-indigo-300" : "text-gray-700 dark:text-gray-300"}`, children: workflow.name }),
+                /* @__PURE__ */ jsx("span", { className: `truncate text-sm font-medium ${isActive ? "text-indigo-700 dark:text-indigo-300" : "text-slate-700 dark:text-slate-300"}`, children: workflow.name }),
                 /* @__PURE__ */ jsxs("span", { className: "shrink-0 rounded-full bg-slate-500/15 px-1.5 py-0.5 text-[10px] font-medium text-slate-700 dark:bg-slate-500/20 dark:text-slate-300", children: [
                   "v",
                   workflow.version
                 ] }),
                 workflow.isDraft ? /* @__PURE__ */ jsx("span", { className: "shrink-0 rounded-full bg-amber-500/15 px-1.5 py-0.5 text-[10px] font-semibold text-amber-700 dark:bg-amber-500/20 dark:text-amber-300", children: tWorkflow("draftBadge") }) : /* @__PURE__ */ jsx("span", { className: "shrink-0 rounded-full bg-emerald-500/15 px-1.5 py-0.5 text-[10px] font-semibold text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-300", children: tWorkflow("published") })
               ] }),
-              /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-[10px] text-gray-400 dark:text-gray-500", children: workflow.updatedAt ? formatRelativeTime(typeof workflow.updatedAt === "string" ? workflow.updatedAt : workflow.updatedAt.toISOString()) : "" })
+              /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-[10px] text-slate-400 dark:text-slate-500", children: workflow.updatedAt ? formatRelativeTime(typeof workflow.updatedAt === "string" ? workflow.updatedAt : workflow.updatedAt.toISOString()) : "" })
             ] }),
             /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-0.5 opacity-0 transition-opacity group-hover:opacity-100", children: [
-              onConvertToSubworkflow && /* @__PURE__ */ jsx(
-                "button",
+              onConvertToSubworkflow && /* @__PURE__ */ jsx("div", { onClick: (event) => event.stopPropagation(), children: /* @__PURE__ */ jsx(
+                IconButton,
                 {
-                  type: "button",
-                  onClick: (event) => {
-                    event.stopPropagation();
-                    onConvertToSubworkflow(workflow);
-                  },
-                  className: "rounded-md p-1 text-gray-400 transition-colors hover:bg-teal-50 hover:text-teal-600 dark:hover:bg-teal-950/30 dark:hover:text-teal-400",
-                  "aria-label": `${tWorkflow("convertToSubworkflow")} ${workflow.name}`,
-                  title: tWorkflow("convertToSubworkflow"),
-                  children: /* @__PURE__ */ jsx(ArrowPathRoundedSquareIcon, { className: "h-3.5 w-3.5" })
+                  label: `${tWorkflow("convertToSubworkflow")} ${workflow.name}`,
+                  variant: "ghost",
+                  size: "sm",
+                  color: "ios-teal",
+                  onClick: () => onConvertToSubworkflow(workflow),
+                  icon: /* @__PURE__ */ jsx(ArrowPathRoundedSquareIcon, { className: "h-3.5 w-3.5" })
                 }
-              ),
+              ) }),
               workflows.length > 1 && /* @__PURE__ */ jsx("div", { onClick: (event) => event.stopPropagation(), children: /* @__PURE__ */ jsx(
                 IconButton,
                 {
@@ -3440,7 +3434,7 @@ function WorkflowListBar({
       {
         type: "button",
         onClick: onCreate,
-        className: "liquid-surface flex shrink-0 items-center gap-1.5 rounded-xl !border-dashed px-3 py-2 text-xs font-medium text-gray-500 transition-all hover:shadow-md hover:text-indigo-600 dark:text-gray-400 dark:hover:text-indigo-400",
+        className: "liquid-surface flex shrink-0 items-center gap-1.5 rounded-xl !border-dashed px-3 py-2 text-xs font-medium text-slate-500 transition-all hover:shadow-md hover:text-indigo-600 dark:text-slate-400 dark:hover:text-indigo-400",
         children: [
           /* @__PURE__ */ jsx(PlusIcon, { className: "h-3.5 w-3.5" }),
           tWorkflow("newWorkflow")
@@ -4659,15 +4653,15 @@ function DslImportModal({ open, onClose, onImport }) {
             onDragLeave: handleDragLeave,
             onDrop: handleDrop,
             onClick: handleClickUpload,
-            className: `cursor-pointer rounded-xl border-2 border-dashed p-8 text-center transition-colors duration-200 ${isDragActive ? "border-blue-400 bg-blue-50 dark:border-blue-500 dark:bg-blue-500/10" : "border-gray-300 hover:border-gray-400 dark:border-gray-600 dark:hover:border-gray-500"}`,
+            className: `cursor-pointer rounded-xl border-2 border-dashed p-8 text-center transition-colors duration-200 ${isDragActive ? "border-blue-400 bg-blue-50 dark:border-blue-500 dark:bg-blue-500/10" : "border-slate-300 hover:border-slate-400 dark:border-slate-600 dark:hover:border-slate-500"}`,
             "data-testid": "import-dropzone",
             role: "button",
             tabIndex: 0,
             "aria-label": translations("dropzone"),
             children: [
-              /* @__PURE__ */ jsx(ArrowUpTrayIcon, { className: "mx-auto h-10 w-10 text-gray-400 dark:text-gray-500" }),
-              /* @__PURE__ */ jsx("p", { className: "mt-3 text-sm font-medium text-gray-700 dark:text-gray-300", children: translations("dropzone") }),
-              /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-gray-500 dark:text-gray-400", children: translations("dropzoneHint") }),
+              /* @__PURE__ */ jsx(ArrowUpTrayIcon, { className: "mx-auto h-10 w-10 text-slate-400 dark:text-slate-500" }),
+              /* @__PURE__ */ jsx("p", { className: "mt-3 text-sm font-medium text-slate-700 dark:text-slate-300", children: translations("dropzone") }),
+              /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: translations("dropzoneHint") }),
               /* @__PURE__ */ jsx(
                 "input",
                 {
@@ -4683,7 +4677,7 @@ function DslImportModal({ open, onClose, onImport }) {
           }
         ) : /* @__PURE__ */ jsxs("div", { "data-testid": "import-validation-result", children: [
           /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-center justify-between", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: fileName }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-slate-700 dark:text-slate-300", children: fileName }),
             /* @__PURE__ */ jsx(Button, { type: "button", plain: true, size: "sm", onClick: handleReset, children: translations("chooseAnother") })
           ] }),
           validationResult.isValid ? /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-green-200 bg-green-50 p-4 dark:border-green-800 dark:bg-green-900/20", children: [
@@ -4711,7 +4705,7 @@ function DslImportModal({ open, onClose, onImport }) {
             /* @__PURE__ */ jsx("ul", { className: "mt-2 space-y-1", children: validationResult.errors.map((validationError, index) => /* @__PURE__ */ jsx("li", { className: "text-xs text-red-600 dark:text-red-400", children: validationError }, index)) })
           ] })
         ] }) }),
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-3 border-t border-gray-200 px-1 py-4 dark:border-gray-700", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-3 border-t border-slate-200 px-1 py-4 dark:border-slate-700", children: [
           /* @__PURE__ */ jsx(Button, { type: "button", onClick: onClose, outline: true, size: "sm", "data-testid": "import-cancel-button", children: translations("cancel") }),
           /* @__PURE__ */ jsxs(
             Button,
@@ -5021,5 +5015,5 @@ function useHelpLines() {
 }
 
 export { AgentModal, AmazonNovaIcon, AnthropicModelIcon, AutoSaveWorkspace, DslExportModal, DslImportModal, DynamicIslandConfirm2 as DynamicIslandConfirm, ExecutionTimelinePanel, MetaLlamaIcon, ModelProviderFlowNode, NodePalette, OutputSchemaBuilder, PipelineSettingsModal, PreviewPanel, RULE_STATUS_OPTIONS, RuleActionBuilder, RuleConditionBuilder, RuleForm, RunInputDialog, RunPanel, RunReplayModal, S3WriteFlowNode, SaveStatusBadge, SubworkflowModal, TIMEZONE_OPTIONS, VariableInspector, VersionHistoryPanel, WorkflowListBar, defaultAgentOutputSchema, defaultRuleAction, defaultRuleCondition, defaultRuleForm, getModelIcon, useCanRedo, useCanUndo, useCanvasShortcuts, useClipboard, useContextMenu, useEditingNodeId, useHasCopied, useHelpLines, useIsRunning, useNodeResults, useSelectedNodeCount, useSubworkflowStore, useUndoRedo };
-//# sourceMappingURL=chunk-RSCRIDMW.mjs.map
-//# sourceMappingURL=chunk-RSCRIDMW.mjs.map
+//# sourceMappingURL=chunk-SMUBE3RO.mjs.map
+//# sourceMappingURL=chunk-SMUBE3RO.mjs.map