@flowtomic/ui 0.1.1 → 0.1.4

package/dist/components/organisms/model-selector/model-selector.d.ts

@@ -30,7 +30,7 @@ export declare const ModelSelectorInput: React.ForwardRefExoticComponent<Omit<Om
     ref?: React.Ref<HTMLInputElement>;
 } & {
     asChild?: boolean;
-}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type" | "value" | "onChange"> & {
+}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
     value?: string;
     onValueChange?: (search: string) => void;
 } & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/dist/components/organisms/prompt-input/prompt-input.js

@@ -321,7 +321,7 @@ export const PromptInput = ({ className, accept, multiple, globalDrop, syncHidde
             form.reset();
         }
         Promise.all(files.map(async ({ id, ...item }) => {
-            if (item.url && item.url.startsWith("blob:")) {
+            if (item.url?.startsWith("blob:")) {
                 return {
                     ...item,
                     url: await convertBlobUrlToDataUrl(item.url),
@@ -350,7 +350,7 @@ export const PromptInput = ({ className, accept, multiple, globalDrop, syncHidde
                     }
                 }
             }
-            catch (error) {
+            catch (_error) {
                 // Don't clear on error
             }
         });

package/dist/components/organisms/script-editor/index.d.ts

@@ -0,0 +1,3 @@
+export type { ScriptEditorProps } from "./script-editor";
+export { ScriptEditor } from "./script-editor";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/organisms/script-editor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/script-editor/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/components/organisms/script-editor/index.js

@@ -0,0 +1 @@
+export { ScriptEditor } from "./script-editor";

package/dist/components/organisms/script-editor/script-editor.d.ts

@@ -0,0 +1,52 @@
+/**
+ * ScriptEditor Component - Flowtomic UI
+ *
+ * Componente para editar e executar scripts com terminal interativo
+ *
+ * Funcionalidades:
+ * - Editor de código para scripts
+ * - Terminal interativo em tempo real
+ * - Preview da resposta do servidor
+ * - Abas para alternar entre terminal e preview
+ * - Execução de scripts no backend
+ */
+import { type ExecuteScriptResponse, type TerminalLine } from "@flowtomic/logic";
+import type { HTMLAttributes } from "react";
+export interface ScriptEditorProps extends Omit<HTMLAttributes<HTMLDivElement>, "onError"> {
+    /**
+     * Script inicial
+     * @default ""
+     */
+    defaultScript?: string;
+    /**
+     * URL do WebSocket para conexão em tempo real
+     */
+    wsUrl?: string;
+    /**
+     * Função para executar script via HTTP (fallback quando WebSocket não está disponível)
+     */
+    executeScript?: (script: string) => Promise<ExecuteScriptResponse>;
+    /**
+     * Callback quando uma linha é adicionada ao terminal
+     */
+    onOutput?: (line: TerminalLine) => void;
+    /**
+     * Callback quando ocorre um erro
+     */
+    onError?: (error: Error) => void;
+    /**
+     * Se deve conectar automaticamente ao WebSocket
+     * @default true
+     */
+    autoConnect?: boolean;
+    /**
+     * Número máximo de tentativas de reconexão
+     * @default 3
+     */
+    maxReconnectAttempts?: number;
+}
+/**
+ * ScriptEditor - Componente para editar e executar scripts com terminal interativo
+ */
+export declare const ScriptEditor: import("react").ForwardRefExoticComponent<ScriptEditorProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=script-editor.d.ts.map

package/dist/components/organisms/script-editor/script-editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"script-editor.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/script-editor/script-editor.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAE,KAAK,qBAAqB,EAAE,KAAK,YAAY,EAAmB,MAAM,kBAAkB,CAAC;AAElG,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAQ5C,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC;IACxF;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,qBAAqB,CAAC,CAAC;IAEnE;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IAExC;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAEjC;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,8GA0KxB,CAAC"}

package/dist/components/organisms/script-editor/script-editor.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ScriptEditor Component - Flowtomic UI
+ *
+ * Componente para editar e executar scripts com terminal interativo
+ *
+ * Funcionalidades:
+ * - Editor de código para scripts
+ * - Terminal interativo em tempo real
+ * - Preview da resposta do servidor
+ * - Abas para alternar entre terminal e preview
+ * - Execução de scripts no backend
+ */
+import { useScriptEditor } from "@flowtomic/logic";
+import { Check, Copy, Play, Square, Trash2 } from "lucide-react";
+import { forwardRef, useEffect, useRef, useState } from "react";
+import { cn } from "@/lib/utils";
+import { Badge, Button } from "../../atoms/actions";
+import { Card, CardContent, CardHeader, CardTitle } from "../../atoms/display";
+import { Textarea } from "../../atoms/forms";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "../../atoms/navigation/tabs";
+/**
+ * ScriptEditor - Componente para editar e executar scripts com terminal interativo
+ */
+export const ScriptEditor = forwardRef(({ className, defaultScript = `// Exemplo de script Groovy
+// Serviços do Spring Boot estão disponíveis automaticamente
+// Exemplos: userService, animalService, herdService, ctx (ApplicationContext)
+
+// Exemplo 1: Acessar repositório via ApplicationContext
+def userRepo = ctx.getBean("userRepository")
+def usuarios = userRepo.findAll()
+def resultado = [
+  message: "Usuários encontrados",
+  total: usuarios.size(),
+  usuarios: usuarios.collect { [id: it.id, name: it.name, email: it.email] }
+]
+
+// Exemplo 2: Usar serviço diretamente (se disponível)
+// def userService = ctx.getBean("userService")
+
+// Última expressão é retornada como resultado
+resultado`, wsUrl, executeScript, onOutput, onError, autoConnect = true, maxReconnectAttempts = 3, ...props }, ref) => {
+    const { script, setScript, terminalLines, preview, activeTab, setActiveTab, isRunning, isConnected, executeScript: executeScriptHandler, stopExecution, clearTerminal, } = useScriptEditor({
+        defaultScript,
+        wsUrl,
+        executeScript,
+        onOutput,
+        onError,
+        autoConnect,
+        maxReconnectAttempts,
+    });
+    const [copied, setCopied] = useState(false);
+    const terminalRef = useRef(null);
+    // Scroll automático do terminal
+    useEffect(() => {
+        if (terminalRef.current) {
+            terminalRef.current.scrollTop = terminalRef.current.scrollHeight;
+        }
+    }, []);
+    const copyToClipboard = async (text) => {
+        try {
+            await navigator.clipboard.writeText(text);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 2000);
+        }
+        catch (err) {
+            console.error("Erro ao copiar:", err);
+        }
+    };
+    return (_jsxs(Card, { ref: ref, className: cn("w-full", className), ...props, children: [_jsx(CardHeader, { children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx(CardTitle, { children: "Editor de Scripts" }), _jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Edite e execute scripts com terminal interativo em tempo real" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Badge, { variant: isConnected ? "default" : "secondary", children: isConnected ? "🟢 Conectado" : "🔴 Desconectado" }), _jsx(Button, { variant: "outline", size: "sm", onClick: () => copyToClipboard(script), disabled: !script, children: copied ? _jsx(Check, { className: "h-4 w-4" }) : _jsx(Copy, { className: "h-4 w-4" }) })] })] }) }), _jsxs(CardContent, { className: "space-y-4", children: [_jsxs("div", { className: "relative", children: [_jsxs("div", { className: "flex items-center justify-between mb-2", children: [_jsx("label", { htmlFor: "script-editor-textarea", className: "text-sm font-medium", children: "Script" }), _jsxs("div", { className: "flex gap-2", children: [_jsxs(Button, { variant: "default", size: "sm", onClick: executeScriptHandler, disabled: isRunning, children: [_jsx(Play, { className: "h-4 w-4 mr-2" }), "Executar"] }), _jsxs(Button, { variant: "outline", size: "sm", onClick: stopExecution, disabled: !isRunning, children: [_jsx(Square, { className: "h-4 w-4 mr-2" }), "Parar"] })] })] }), _jsxs("div", { className: "relative bg-muted/50 border border-border rounded-lg overflow-hidden", children: [_jsxs("div", { className: "flex flex-row gap-x-2 p-3 border-b border-border bg-muted", children: [_jsx("div", { className: "h-2 w-2 rounded-full bg-red-500" }), _jsx("div", { className: "h-2 w-2 rounded-full bg-yellow-500" }), _jsx("div", { className: "h-2 w-2 rounded-full bg-green-500" })] }), _jsx(Textarea, { id: "script-editor-textarea", value: script, onChange: (e) => setScript(e.target.value), className: "w-full h-64 p-4 font-mono text-sm bg-background resize-none focus:outline-none focus:ring-2 focus:ring-ring", placeholder: "Digite seu script Groovy aqui... (ou JavaScript como fallback)", spellCheck: false })] })] }), _jsx("div", { className: "border border-border rounded-lg overflow-hidden", children: _jsxs(Tabs, { value: activeTab, onValueChange: (value) => setActiveTab(value), children: [_jsxs("div", { className: "flex border-b border-border bg-muted", children: [_jsxs(TabsList, { className: "bg-transparent border-0 p-0 h-auto", children: [_jsx(TabsTrigger, { value: "terminal", children: "Terminal" }), _jsx(TabsTrigger, { value: "preview", children: "Preview" })] }), _jsx("div", { className: "flex-1" }), _jsxs(Button, { variant: "ghost", size: "sm", onClick: clearTerminal, className: "mr-2", children: [_jsx(Trash2, { className: "h-4 w-4 mr-2" }), "Limpar"] })] }), _jsx(TabsContent, { value: "terminal", className: "mt-0", children: _jsx(TerminalContent, { ref: terminalRef, lines: terminalLines, isRunning: isRunning }) }), _jsx(TabsContent, { value: "preview", className: "mt-0", children: _jsx(PreviewContent, { content: preview }) })] }) })] })] }));
+});
+ScriptEditor.displayName = "ScriptEditor";
+const TerminalContent = forwardRef(({ lines, isRunning }, ref) => {
+    return (_jsx("div", { ref: ref, className: cn("p-4 font-mono text-sm h-64 overflow-auto", 
+        // Modo dark: estilo terminal escuro
+        "dark:bg-[#0d1117] dark:text-[#c9d1d9]", 
+        // Modo light: usar input que é mais escuro que muted, mantendo a paleta
+        "bg-input text-foreground"), children: lines.length === 0 ? (_jsxs("div", { className: "text-muted-foreground dark:text-[#8b949e]", children: [_jsx("span", { className: "text-primary dark:text-[#58a6ff]", children: "$" }), " Terminal pronto. Execute um script para ver a sa\u00EDda..."] })) : (_jsxs("div", { className: "space-y-1", children: [lines.map((line) => (_jsxs("div", { className: cn("flex items-start gap-2 animate-in fade-in slide-in-from-top-1 duration-200", line.type === "error" && "text-destructive dark:text-[#f85149]", line.type === "output" && "text-foreground dark:text-[#c9d1d9]", line.type === "system" && "text-muted-foreground dark:text-[#8b949e]", line.type === "input" && "text-primary dark:text-[#58a6ff]"), children: [line.type === "input" && (_jsx("span", { className: "text-primary dark:text-[#58a6ff]", children: "$" })), line.type === "error" && (_jsx("span", { className: "text-destructive dark:text-[#f85149]", children: "\u2717" })), line.type === "system" && (_jsx("span", { className: "text-muted-foreground dark:text-[#8b949e]", children: "\u25CF" })), _jsx("span", { className: "flex-1 whitespace-pre-wrap break-words", children: line.content })] }, line.id))), isRunning && (_jsxs("div", { className: "text-muted-foreground dark:text-[#8b949e] animate-pulse", children: [_jsx("span", { className: "text-primary dark:text-[#58a6ff]", children: "$" }), " ", _jsx("span", { className: "animate-pulse", children: "\u258B" }), " Executando..."] }))] })) }));
+});
+TerminalContent.displayName = "TerminalContent";
+const PreviewContent = ({ content }) => {
+    if (!content) {
+        return (_jsx("div", { className: "p-4 text-muted-foreground text-center h-64 flex items-center justify-center", children: "Nenhum resultado ainda. Execute um script para ver o preview..." }));
+    }
+    return (_jsx("div", { className: "p-4 h-64 overflow-auto", children: _jsx("pre", { className: "text-sm font-mono bg-muted p-4 rounded-lg overflow-auto", children: _jsx("code", { children: content }) }) }));
+};

package/dist/components/organisms/stats-grid/stats-grid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stats-grid.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/stats-grid/stats-grid.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;IAClC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,CAAC;IACvD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE;QACR,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,EAAE,CAAC,EAAE,MAAM,CAAC;KACb,CAAC;CACH;AAED,QAAA,MAAM,SAAS,uFAuGd,CAAC;AAIF,OAAO,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"stats-grid.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/stats-grid/stats-grid.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;IAClC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,CAAC;IACvD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE;QACR,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,EAAE,CAAC,EAAE,MAAM,CAAC;KACb,CAAC;CACH;AAED,QAAA,MAAM,SAAS,uFA0Gd,CAAC;AAIF,OAAO,EAAE,SAAS,EAAE,CAAC"}