@fayz-ai/plugin-automations 0.15.14 → 0.15.15

package/dist/index.js

@@ -4,7 +4,7 @@ import { getSupabaseClientOptional, useTranslation, errorMessage, startEventLog,
 import { PageActions, resolveFayzAgentConnection, registerRailPage, getFayzSupabaseClientOptional, useConnectors, useAgentSurface, askAI, SettingsTabs, adminNavigateTo, RightRailPage, AskAIButton, useOrganizationStore, connectorRoute, ConnectorMark, ConnectorDeliveries } from '@fayz-ai/admin';
 import * as LucideIcons from 'lucide-react';
 import { Plus, ChevronRight, ListChecks, MessageSquare, Clock, Trash2, Workflow, WandSparkles, Zap, Receipt, Megaphone, Smartphone, Mail, RotateCcw, Check, Monitor, RefreshCw, History, Send, AlertTriangle, CircleCheck, CircleSlash } from 'lucide-react';
-import { toast, Card, PageHeaderActions, Switch, DataTable, Modal, ModalContent, ModalHeader, ModalTitle, ModalBody, Input, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, ModalFooter, Button, PageTabs, WhatsAppIcon, SubpageHeader, Badge, Hint, HeaderTabs, PhoneField } from '@fayz-ai/ui';
+import { toast, Card, PageHeaderActions, Button, Switch, DataTable, Modal, ModalContent, ModalHeader, ModalTitle, ModalBody, Input, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, ModalFooter, PageTabs, WhatsAppIcon, SubpageHeader, Badge, Hint, HeaderTabs, Textarea, PhoneField } from '@fayz-ai/ui';
 import { createFayzAutomationsClient, FayzAutomationsError } from '@fayz-ai/sdk/automations';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -253,11 +253,13 @@ function RunRow({ run }) {
   const { Icon } = cfg;
   return /* @__PURE__ */ jsxs("div", { className: "border-b border-border last:border-b-0", children: [
     /* @__PURE__ */ jsxs(
-      "button",
+      Button,
       {
+        variant: "bare",
+        size: "bare",
         type: "button",
         onClick: () => setOpen(!open),
-        className: "flex w-full items-center gap-3 px-4 py-2.5 text-left transition-colors hover:bg-muted/40",
+        className: "flex w-full items-center justify-start gap-3 rounded-none px-4 py-2.5 text-left font-normal transition-colors hover:bg-muted/40",
         children: [
           /* @__PURE__ */ jsx(ChevronRight, { className: `h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform ${open ? "rotate-90" : ""}` }),
           /* @__PURE__ */ jsx(Icon, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
@@ -506,15 +508,14 @@ function TestSendStrip({ eventKey, channel, placeholders, template }) {
       /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
         /* @__PURE__ */ jsx("label", { className: "mb-1 block text-xs font-medium text-muted-foreground", children: isEmail ? "E-mail que recebe o teste" : "N\xFAmero que recebe o teste" }),
         isEmail ? /* @__PURE__ */ jsx(
-          "input",
+          Input,
           {
             type: "email",
             value: recipient,
             onChange: (e) => setRecipient(e.target.value),
             placeholder: "voce@exemplo.com",
             disabled: sending,
-            "aria-label": "E-mail que recebe o teste",
-            className: "w-full rounded-input border border-input bg-card px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+            "aria-label": "E-mail que recebe o teste"
           }
         ) : /* @__PURE__ */ jsx(
           PhoneField,
@@ -846,8 +847,10 @@ function AutomationDetailPage({ eventKey, channel, store: store2, backTo = "/aut
       !embedded && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 border-b border-border px-4 py-2.5", children: [
         /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: "Pr\xE9via" }),
         /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: ["desktop", "mobile"].map((d) => /* @__PURE__ */ jsx(
-          "button",
+          Button,
           {
+            variant: "bare",
+            size: "bare",
             type: "button",
             onClick: () => setDevice(d),
             "aria-label": d === "desktop" ? "Computador" : "Celular",
@@ -917,23 +920,22 @@ function AutomationDetailPage({ eventKey, channel, store: store2, backTo = "/aut
       hasSubject && /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("label", { className: "mb-1 block text-xs font-medium text-muted-foreground", children: "Assunto" }),
         /* @__PURE__ */ jsx(
-          "input",
+          Input,
           {
             value: current.subject,
-            onChange: (e) => setDraft({ ...current, subject: e.target.value }),
-            className: "w-full rounded-input border border-input bg-card px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+            onChange: (e) => setDraft({ ...current, subject: e.target.value })
           }
         )
       ] }),
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("label", { className: "mb-1 block text-xs font-medium text-muted-foreground", children: "Mensagem" }),
         /* @__PURE__ */ jsx(
-          "textarea",
+          Textarea,
           {
             rows: 14,
             value: current.body,
             onChange: (e) => setDraft({ ...current, body: e.target.value }),
-            className: "w-full rounded-input border border-input bg-card px-3 py-2 font-mono text-xs leading-relaxed focus:outline-none focus:ring-2 focus:ring-ring"
+            className: "font-mono text-xs leading-relaxed"
           }
         )
       ] }),
@@ -977,8 +979,8 @@ function AutomationDetailPage({ eventKey, channel, store: store2, backTo = "/aut
             // teto da Meta para QUICK_REPLY; mudar o texto de um
             // modelo já aprovado dispara nova aprovação — a
             // pastilha de status acima conta essa história.
-            /* @__PURE__ */ jsx(
-              "input",
+            /* @__PURE__ */ jsx("div", { className: "w-36", children: /* @__PURE__ */ jsx(
+              Input,
               {
                 value: labelValue,
                 maxLength: 25,
@@ -989,9 +991,9 @@ function AutomationDetailPage({ eventKey, channel, store: store2, backTo = "/aut
                 onKeyDown: (e) => {
                   if (e.key === "Enter") e.target.blur();
                 },
-                className: "w-36 rounded-input border border-input bg-card px-2 py-1 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                className: "h-auto px-2 py-1"
               }
-            ),
+            ) }),
             /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: blocked ? "Para cobrar por aqui, configure a conta de pagamento em Conversas \u2192 Tyxter." : action.hint })
           ] }, action.id);
         }) })
@@ -1109,12 +1111,14 @@ function AutomationCard({
     ),
     row.listDeliveries && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsxs(
-        "button",
+        Button,
         {
+          variant: "bare",
+          size: "bare",
           type: "button",
           onClick: () => setOpen(!open),
           "aria-expanded": open,
-          className: "flex w-full items-center gap-2 border-t border-border px-4 py-2 text-left transition-colors hover:bg-muted/40",
+          className: "flex w-full items-center justify-start gap-2 rounded-none border-t border-border px-4 py-2 text-left font-normal transition-colors hover:bg-muted/40",
           children: [
             /* @__PURE__ */ jsx(ChevronRight, { className: `h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform ${open ? "rotate-90" : ""}` }),
             /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium", children: [
@@ -1787,8 +1791,10 @@ function useStepColumns(onDelete) {
       id: "actions",
       header: "",
       cell: ({ row }) => /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx(
-        "button",
+        Button,
         {
+          variant: "bare",
+          size: "bare",
           onClick: (e) => {
             e.stopPropagation();
             onDelete(row.original.id);
@@ -1801,6 +1807,7 @@ function useStepColumns(onDelete) {
     }
   ], [t, onDelete]);
 }
+var COMPOSER_TRIGGER = "h-auto w-auto gap-2 rounded-md border-border px-2 py-1.5 shadow-none";
 function StepComposer({ steps, onAdd }) {
   const t = useTranslation();
   const [kind, setKind] = useState("message");
@@ -1820,32 +1827,22 @@ function StepComposer({ steps, onAdd }) {
     setValue("");
   };
   return /* @__PURE__ */ jsxs("div", { className: "mt-3 flex flex-wrap items-center gap-2 rounded-lg border border-dashed p-3", children: [
-    /* @__PURE__ */ jsxs(
-      "select",
-      {
-        value: kind,
-        onChange: (e) => {
-          setKind(e.target.value);
-          setValue("");
-        },
-        className: "rounded-md border bg-background px-2 py-1.5 text-sm",
-        children: [
-          /* @__PURE__ */ jsx("option", { value: "message", children: t("automations.flow.kindMessage") }),
-          /* @__PURE__ */ jsx("option", { value: "task", children: t("automations.flow.kindTask") })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "select",
-      {
-        value: delay,
-        onChange: (e) => setDelay(Number(e.target.value)),
-        className: "rounded-md border bg-background px-2 py-1.5 text-sm",
-        children: DELAY_CHOICES.map((m) => /* @__PURE__ */ jsx("option", { value: m, children: describeDelay(m, t) }, m))
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "input",
+    /* @__PURE__ */ jsxs(Select, { value: kind, onValueChange: (v) => {
+      setKind(v);
+      setValue("");
+    }, children: [
+      /* @__PURE__ */ jsx(SelectTrigger, { className: COMPOSER_TRIGGER, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+      /* @__PURE__ */ jsxs(SelectContent, { children: [
+        /* @__PURE__ */ jsx(SelectItem, { value: "message", children: t("automations.flow.kindMessage") }),
+        /* @__PURE__ */ jsx(SelectItem, { value: "task", children: t("automations.flow.kindTask") })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(Select, { value: String(delay), onValueChange: (v) => setDelay(Number(v)), children: [
+      /* @__PURE__ */ jsx(SelectTrigger, { className: COMPOSER_TRIGGER, children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+      /* @__PURE__ */ jsx(SelectContent, { children: DELAY_CHOICES.map((m) => /* @__PURE__ */ jsx(SelectItem, { value: String(m), children: describeDelay(m, t) }, m)) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "min-w-[200px] flex-1", children: /* @__PURE__ */ jsx(
+      Input,
       {
         value,
         onChange: (e) => setValue(e.target.value),
@@ -1853,20 +1850,13 @@ function StepComposer({ steps, onAdd }) {
           if (e.key === "Enter") submit();
         },
         placeholder: t(kind === "task" ? "automations.flow.titlePlaceholder" : "automations.flow.templatePlaceholder"),
-        className: "min-w-[200px] flex-1 rounded-md border bg-background px-2 py-1.5 text-sm"
+        className: "h-auto rounded-md border-border bg-background px-2 py-1.5 shadow-none"
       }
-    ),
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        onClick: submit,
-        className: "inline-flex items-center gap-1 rounded-md bg-primary px-3 py-1.5 text-sm text-primary-foreground hover:opacity-90",
-        children: [
-          /* @__PURE__ */ jsx(Plus, { className: "h-3.5 w-3.5" }),
-          t("automations.flow.addStep")
-        ]
-      }
-    )
+    ) }),
+    /* @__PURE__ */ jsxs(Button, { onClick: submit, className: "gap-1", children: [
+      /* @__PURE__ */ jsx(Plus, { className: "h-3.5 w-3.5" }),
+      t("automations.flow.addStep")
+    ] })
   ] });
 }
 function FlowsPage() {
@@ -1976,10 +1966,12 @@ function FlowsPage() {
     ] }) : /* @__PURE__ */ jsx("div", { className: "space-y-2", children: flows.map((flow) => /* @__PURE__ */ jsxs(Card, { className: "p-3", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
         /* @__PURE__ */ jsxs(
-          "button",
+          Button,
           {
+            variant: "bare",
+            size: "bare",
             onClick: () => setSelectedId(selectedId === flow.id ? null : flow.id),
-            className: "flex flex-1 items-center gap-2 text-left",
+            className: "flex flex-1 items-center gap-2 text-left font-normal justify-start",
             children: [
               /* @__PURE__ */ jsx(
                 ChevronRight,