vatts 1.2.1 → 1.2.3

package/dist/env/env.js

@@ -4,6 +4,22 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.loadEnv = void 0;
+/*
+ * This file is part of the Vatts.js Project.
+ * Copyright (c) 2026 mfraz
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
 const console_1 = __importDefault(require("../api/console"));

package/dist/global/global.d.ts

@@ -1,6 +1,6 @@
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

package/dist/helpers.js

@@ -2,7 +2,7 @@
 "use strict";
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

package/dist/hotReload.js

@@ -39,7 +39,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.HotReloadManager = void 0;
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -291,7 +291,8 @@ class HotReloadManager {
             filePath.includes('not-found.tsx') ||
             filePath.endsWith('.tsx') ||
             filePath.endsWith(".ts") ||
-            filePath.endsWith(".vue");
+            filePath.endsWith(".vue") ||
+            filePath.endsWith(".css");
         const isBackendFile = filePath.includes(path.join('src', 'backend')) && !isFrontendFile;
         (0, router_1.clearFileCache)(filePath);
         this.clearBackendCache(filePath);

package/dist/index.js

@@ -1,7 +1,7 @@
 "use strict";
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

package/dist/loaders.js

@@ -1,7 +1,7 @@
 "use strict";
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  */
 const fs = require('fs');
 const path = require('path');

package/dist/react/BuildingPage.js

@@ -4,6 +4,22 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = BuildingScreen;
+/*
+ * This file is part of the Vatts.js Project.
+ * Copyright (c) 2026 mfraz
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 const react_1 = __importDefault(require("react"));
 function BuildingScreen() {
     let version = "1.0.0";
@@ -15,11 +31,13 @@ function BuildingScreen() {
         :root {
             --bg-solid: #000000;
             --card-bg: #0a0a0a;
-            /* PALETA: Monocromática estilo Next.js */
+            /* PALETA: React Theme */
+            --react-cyan: #61DAFB;      /* O azul/ciano clássico do React */
+            --react-dark: #20232a;      /* Fundo escuro azulado */
             --primary: #ffffff;
-            --primary-glow: rgba(255, 255, 255, 0.1);
+            --primary-glow: rgba(97, 218, 251, 0.1);
             --text-main: #ffffff;
-            --text-muted: #64748b;
+            --text-muted: #8ea9c7;      /* Cinza azulado para combinar */
         }
 
         body {
@@ -52,8 +70,8 @@ function BuildingScreen() {
             width: 100%;
             max-width: 420px;
             background: var(--card-bg);
-            /* Borda sutil em cinza escuro */
-            box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1), 0 40px 80px -20px rgba(0, 0, 0, 0.9);
+            /* Borda sutil com brilho React Cyan */
+            box-shadow: 0 0 0 1px rgba(97, 218, 251, 0.1), 0 40px 80px -20px rgba(0, 0, 0, 0.9);
             border-radius: 20px;
             overflow: hidden;
             display: flex;
@@ -65,9 +83,9 @@ function BuildingScreen() {
         .neon-line {
             height: 1px;
             width: 100%;
-            /* Linha de luz branca/cinza */
-            background: linear-gradient(90deg, transparent, #334155, #ffffff, #334155, transparent);
-            box-shadow: 0 0 15px rgba(255, 255, 255, 0.05);
+            /* Linha de luz: Gradiente usando o Cyan */
+            background: linear-gradient(90deg, transparent, var(--react-dark), var(--react-cyan), var(--react-dark), transparent);
+            box-shadow: 0 0 15px rgba(97, 218, 251, 0.2);
         }
 
         .content {
@@ -90,8 +108,8 @@ function BuildingScreen() {
             object-fit: contain;
             position: relative;
             z-index: 2;
-            /* Deixa a logo levemente dessaturada para combinar */
-            filter: grayscale(0.5);
+            /* Removi o grayscale para a logo brilhar na cor natural se tiver cor, ou ficar nítida */
+            filter: none;
         }
 
         .logo-glow {
@@ -101,9 +119,10 @@ function BuildingScreen() {
             transform: translate(-50%, -50%);
             width: 100%;
             height: 100%;
-            background: #ffffff;
+            /* Glow Cyan do React */
+            background: var(--react-cyan);
             filter: blur(25px);
-            opacity: 0.1;
+            opacity: 0.2;
             border-radius: 50%;
             animation: pulse 2s ease-in-out infinite;
         }
@@ -113,14 +132,16 @@ function BuildingScreen() {
             font-size: 2rem;
             font-weight: 800;
             letter-spacing: -0.03em;
-            background: linear-gradient(180deg, #ffffff 0%, #475569 100%);
+            /* Gradiente do texto: Branco para Cyan */
+            background: linear-gradient(180deg, #ffffff 0%, var(--react-cyan) 100%);
             -webkit-background-clip: text;
             -webkit-text-fill-color: transparent;
         }
 
         h1 span {
-            color: #475569;
-            -webkit-text-fill-color: #475569;
+            /* Span .js em Cyan Sólido */
+            color: var(--react-cyan);
+            -webkit-text-fill-color: var(--react-cyan);
         }
 
         p {
@@ -132,14 +153,14 @@ function BuildingScreen() {
 
         .terminal-box {
             width: 100%;
-            background: rgba(255, 255, 255, 0.02);
-            border: 1px solid rgba(255, 255, 255, 0.08);
+            background: rgba(97, 218, 251, 0.03); /* Fundo azulado bem sutil */
+            border: 1px solid rgba(97, 218, 251, 0.1); /* Borda ciano sutil */
             border-radius: 12px;
             padding: 16px;
             text-align: left;
             font-family: 'JetBrains Mono', monospace;
             font-size: 0.75rem;
-            color: #475569;
+            color: var(--text-muted);
             box-sizing: border-box;
             display: flex;
             flex-direction: column;
@@ -155,25 +176,25 @@ function BuildingScreen() {
         .term-spinner {
             width: 10px;
             height: 10px;
-            border: 2px solid rgba(255, 255, 255, 0.1);
-            border-top-color: #ffffff;
+            border: 2px solid rgba(97, 218, 251, 0.1);
+            border-top-color: var(--react-cyan); /* Spinner Cyan */
             border-radius: 50%;
             animation: spin 0.6s linear infinite;
         }
 
-        .file-name { color: #94a3b8; }
-        .accent { color: #ffffff; }
+        .file-name { color: #8ea9c7; }
+        .accent { color: var(--react-cyan); }
 
         .card-footer {
             width: 100%;
             padding: 12px 32px;
-            background: rgba(255,255,255,0.02);
-            border-top: 1px solid rgba(255,255,255,0.05);
+            background: rgba(97, 218, 251, 0.02);
+            border-top: 1px solid rgba(97, 218, 251, 0.05);
             display: flex;
             justify-content: space-between;
             align-items: center;
             font-size: 11px;
-            color: rgba(255,255,255,0.2);
+            color: rgba(255,255,255,0.3);
             box-sizing: border-box;
         }
 
@@ -181,7 +202,7 @@ function BuildingScreen() {
             display: flex;
             align-items: center;
             gap: 6px;
-            color: #ffffff;
+            color: var(--react-cyan);
             font-weight: 600;
             text-transform: uppercase;
             letter-spacing: 0.05em;
@@ -190,14 +211,14 @@ function BuildingScreen() {
         .dot {
             width: 6px;
             height: 6px;
-            background-color: #ffffff;
+            background-color: var(--react-cyan);
             border-radius: 50%;
-            box-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
+            box-shadow: 0 0 8px var(--react-cyan);
         }
 
         @keyframes pulse {
-            0%, 100% { opacity: 0.1; transform: translate(-50%, -50%) scale(1); }
-            50% { opacity: 0.15; transform: translate(-50%, -50%) scale(1.1); }
+            0%, 100% { opacity: 0.15; transform: translate(-50%, -50%) scale(1); }
+            50% { opacity: 0.25; transform: translate(-50%, -50%) scale(1.1); }
         }
 
         @keyframes spin {
@@ -233,7 +254,7 @@ function BuildingScreen() {
                                     react_1.default.createElement("span", { className: "accent" }, "src/vatts.ts"),
                                     "...")),
                             react_1.default.createElement("div", { className: "term-line", style: { opacity: 0.5 } },
-                                react_1.default.createElement("span", null, "\u2713"),
+                                react_1.default.createElement("span", { style: { color: "var(--react-cyan)" } }, "\u2713"),
                                 react_1.default.createElement("span", { className: "file-name" }, "Optimizing assets")))),
                     react_1.default.createElement("div", { className: "card-footer" },
                         react_1.default.createElement("span", null, "Building..."),

package/dist/react/DefaultNotFound.js

@@ -36,7 +36,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = ErrorPage;
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -60,6 +60,14 @@ function ErrorPage() {
             setPath(window.location.pathname);
         }
     }, []);
+    // --- CORES DO TEMA REACT ---
+    const theme = {
+        cyan: '#61DAFB', // React Blue/Cyan
+        dark: '#20232a', // React Dark BG Accent
+        textMuted: '#8ea9c7', // Azul acinzentado
+        bg: '#000000',
+        cardBg: '#0a0a0a'
+    };
     // --- GLOBAL STYLES ---
     const globalStyles = `
         @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&family=JetBrains+Mono:wght@400;500&display=swap');
@@ -67,7 +75,7 @@ function ErrorPage() {
         body {
             margin: 0;
             padding: 0;
-            background-color: #000000; 
+            background-color: ${theme.bg}; 
             color: #ffffff;
             font-family: 'Inter', system-ui, sans-serif;
             overflow: hidden;
@@ -78,10 +86,6 @@ function ErrorPage() {
         * { box-sizing: border-box; }
     `;
     // --- INLINE STYLES ---
-    // Paleta Estilo Next.js (Preto, Branco, Cinza)
-    const primaryColor = '#ffffff';
-    const primaryColorDark = '#64748b';
-    const primaryRgb = '255, 255, 255';
     const containerStyle = {
         position: 'fixed',
         top: 0,
@@ -95,15 +99,15 @@ function ErrorPage() {
         justifyContent: 'center',
         width: '100vw',
         height: '100vh',
-        background: '#000000',
+        background: theme.bg,
     };
     const cardStyle = {
         width: 'min(90%, 500px)',
         display: 'flex',
         flexDirection: 'column',
-        background: '#0a0a0a',
-        // Borda sutil branca/cinza
-        boxShadow: `0 0 0 1px rgba(255, 255, 255, 0.1), 0 40px 80px -20px rgba(0, 0, 0, 0.9)`,
+        background: theme.cardBg,
+        // Borda sutil com brilho Cyan
+        boxShadow: `0 0 0 1px rgba(97, 218, 251, 0.1), 0 40px 80px -20px rgba(0, 0, 0, 0.9)`,
         borderRadius: 20,
         overflow: 'hidden',
         position: 'relative',
@@ -111,10 +115,10 @@ function ErrorPage() {
     const neonLine = {
         height: '1px',
         width: '100%',
-        // Gradiente monocromático
-        background: `linear-gradient(90deg, transparent, #334155, #ffffff, #334155, transparent)`,
-        // Brilho branco suave
-        boxShadow: `0 0 15px rgba(255, 255, 255, 0.1)`,
+        // Gradiente usando o Cyan do React
+        background: `linear-gradient(90deg, transparent, ${theme.dark}, ${theme.cyan}, ${theme.dark}, transparent)`,
+        // Brilho Cyan suave
+        boxShadow: `0 0 15px rgba(97, 218, 251, 0.2)`,
     };
     const contentStyle = {
         padding: '32px',
@@ -129,23 +133,24 @@ function ErrorPage() {
         lineHeight: 1,
         letterSpacing: '-0.04em',
         color: '#fff',
-        background: 'linear-gradient(180deg, #ffffff 0%, #475569 100%)',
+        // Gradiente Branco -> Cyan
+        background: `linear-gradient(180deg, #ffffff 0%, ${theme.cyan} 100%)`,
         WebkitBackgroundClip: 'text',
         WebkitTextFillColor: 'transparent',
         marginBottom: 16,
-        filter: `drop-shadow(0 0 20px rgba(255, 255, 255, 0.05))`,
+        filter: `drop-shadow(0 0 20px rgba(97, 218, 251, 0.1))`,
     };
     const terminalBoxStyle = {
         width: '100%',
-        background: 'rgba(255, 255, 255, 0.02)',
+        background: 'rgba(97, 218, 251, 0.03)', // Fundo azulado sutil
         borderRadius: 12,
         padding: '16px',
         marginBottom: 24,
-        border: '1px solid rgba(255, 255, 255, 0.08)',
+        border: '1px solid rgba(97, 218, 251, 0.1)', // Borda cyan sutil
         fontFamily: '"JetBrains Mono", monospace',
         fontSize: 12,
         textAlign: 'left',
-        color: '#94a3b8',
+        color: theme.textMuted,
     };
     const getBtnStyle = (kind, hovering) => {
         const base = {
@@ -166,17 +171,18 @@ function ErrorPage() {
         if (kind === 'primary') {
             return {
                 ...base,
-                background: hovering ? '#ffffff' : '#f8fafc',
+                // Botão Primário agora é o Cyan do React com texto escuro (contraste alto)
+                background: hovering ? '#ffffff' : theme.cyan,
                 color: '#000000',
-                boxShadow: hovering ? `0 0 20px rgba(255, 255, 255, 0.2)` : 'none',
+                boxShadow: hovering ? `0 0 20px rgba(97, 218, 251, 0.4)` : 'none',
             };
         }
         return {
             ...base,
-            background: hovering ? 'rgba(255, 255, 255, 0.1)' : 'transparent',
-            color: hovering ? '#fff' : 'rgba(255, 255, 255, 0.6)',
-            border: '1px solid rgba(255, 255, 255, 0.1)',
-            borderColor: hovering ? 'rgba(255, 255, 255, 0.3)' : 'rgba(255, 255, 255, 0.1)',
+            background: hovering ? 'rgba(97, 218, 251, 0.1)' : 'transparent',
+            color: hovering ? '#fff' : theme.textMuted,
+            border: '1px solid',
+            borderColor: hovering ? theme.cyan : 'rgba(255, 255, 255, 0.1)',
         };
     };
     const brandStyle = {
@@ -202,10 +208,10 @@ function ErrorPage() {
                             react_1.default.createElement("div", { style: { width: 8, height: 8, borderRadius: '50%', background: '#fff' } }),
                             react_1.default.createElement("div", { style: { width: 8, height: 8, borderRadius: '50%', background: '#fff' } })),
                         react_1.default.createElement("div", null,
-                            react_1.default.createElement("span", { style: { color: '#64748b' } }, "GET"),
+                            react_1.default.createElement("span", { style: { color: theme.cyan } }, "GET"),
                             ' ',
                             react_1.default.createElement("span", { style: { color: '#fff' } }, path)),
-                        react_1.default.createElement("div", { style: { marginTop: 4, color: '#475569' } },
+                        react_1.default.createElement("div", { style: { marginTop: 4, color: theme.textMuted } },
                             react_1.default.createElement("span", null, "Error: Route not found"))),
                     react_1.default.createElement("div", { style: { display: 'flex', gap: 12, width: '100%' } },
                         react_1.default.createElement("a", { href: "/", onMouseEnter: () => setHoverHome(true), onMouseLeave: () => setHoverHome(false), style: { ...getBtnStyle('primary', hoverHome), flex: 1, justifyContent: 'center' } },
@@ -222,8 +228,8 @@ function ErrorPage() {
                             "Retry"))),
                 react_1.default.createElement("div", { style: {
                         padding: '12px 32px',
-                        background: 'rgba(255,255,255,0.02)',
-                        borderTop: '1px solid rgba(255,255,255,0.05)',
+                        background: 'rgba(97, 218, 251, 0.02)',
+                        borderTop: '1px solid rgba(97, 218, 251, 0.05)',
                         display: 'flex',
                         justifyContent: 'space-between',
                         alignItems: 'center',
@@ -232,11 +238,11 @@ function ErrorPage() {
                     } },
                     react_1.default.createElement("span", null, "Vatts Server"),
                     react_1.default.createElement("div", { style: { display: 'flex', alignItems: 'center', gap: 6 } },
-                        react_1.default.createElement("div", { style: { width: 6, height: 6, borderRadius: '50%', background: '#475569' } }),
-                        react_1.default.createElement("span", { style: { color: '#94a3b8' } }, "Not Found")))),
+                        react_1.default.createElement("div", { style: { width: 6, height: 6, borderRadius: '50%', background: theme.cyan, boxShadow: `0 0 6px ${theme.cyan}` } }),
+                        react_1.default.createElement("span", { style: { color: theme.cyan } }, "Not Found")))),
             react_1.default.createElement("a", { href: "https://npmjs.com/package/vatts", target: "_blank", rel: "noopener noreferrer", style: brandStyle, onMouseEnter: (e) => e.currentTarget.style.opacity = '1', onMouseLeave: (e) => e.currentTarget.style.opacity = '0.4' },
-                react_1.default.createElement("img", { src: "https://raw.githubusercontent.com/mfrazlab/vatts.js/master/docs/public/logo.png", alt: "Vatts Logo", style: { width: 20, height: 20, filter: 'grayscale(1) brightness(2)' } }),
+                react_1.default.createElement("img", { src: "https://raw.githubusercontent.com/mfrazlab/vatts.js/master/docs/public/logo.png", alt: "Vatts Logo", style: { width: 20, height: 20 } }),
                 react_1.default.createElement("span", { style: { fontSize: 13, fontWeight: 600, color: '#fff' } },
                     "Vatts",
-                    react_1.default.createElement("span", { style: { color: "#64748b" } }, ".js"))))));
+                    react_1.default.createElement("span", { style: { color: theme.cyan } }, ".js"))))));
 }

package/dist/react/DevIndicator.js

@@ -34,6 +34,22 @@ var __importStar = (this && this.__importStar) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = DevIndicator;
+/*
+ * This file is part of the Vatts.js Project.
+ * Copyright (c) 2026 mfraz
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 const react_1 = __importStar(require("react"));
 const react_dom_1 = require("react-dom");
 function DevIndicator({ hasBuildError = false, onClickBuildError, }) {

package/dist/react/ErrorModal.js

@@ -36,7 +36,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ErrorModal = ErrorModal;
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

package/dist/react/Link.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Link = Link;
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

package/dist/react/client.js

@@ -1,7 +1,7 @@
 "use strict";
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

package/dist/react/entry.client.js

@@ -38,7 +38,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 /*
  * This file is part of the Vatts.js Project.
- * Copyright (c) 2026 itsmuzin
+ * Copyright (c) 2026 mfraz
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

package/dist/react/image/Image.js

@@ -3,6 +3,22 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+/*
+ * This file is part of the Vatts.js Project.
+ * Copyright (c) 2026 mfraz
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 const react_1 = __importDefault(require("react"));
 const Image = ({ src, width, height, quality = 75, priority = false, className, style, alt = "", ...props }) => {
     function getBaseUrl() {

package/dist/react/react.build.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Cria a configuração do Rollup otimizada para React
+ * @param {string} entryPoint - Arquivo de entrada
+ * @param {string} outdir - Diretório de saída
+ * @param {boolean} isProduction - Flag de produção
+ * @param {Object} plugins - Objeto contendo arrays de plugins
+ * @param {Array} plugins.prePlugins - Plugins para rodar ANTES do framework
+ * @param {Array} plugins.postPlugins - Plugins para rodar DEPOIS do framework
+ */
+export function createReactConfig(entryPoint: string, outdir: string, isProduction: boolean, { prePlugins, postPlugins }?: {
+    prePlugins: any[];
+    postPlugins: any[];
+}): Promise<{
+    input: string;
+    treeshake: {
+        moduleSideEffects: string;
+        preset: string;
+    };
+    cache: boolean;
+    perf: boolean;
+    maxParallelFileOps: number;
+    plugins: any[];
+    onwarn(warning: any, warn: any): void;
+}>;

package/dist/react/react.build.js

@@ -0,0 +1,95 @@
+"use strict";
+/*
+ * This file is part of the Vatts.js Project.
+ * Copyright (c) 2026 mfraz
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+const nodeResolve = require('@rollup/plugin-node-resolve').default;
+const commonjs = require('@rollup/plugin-commonjs').default;
+const replace = require('@rollup/plugin-replace').default;
+const esbuild = require('rollup-plugin-esbuild').default;
+const jsonPlugin = require("@rollup/plugin-json").default;
+/**
+ * Cria a configuração do Rollup otimizada para React
+ * @param {string} entryPoint - Arquivo de entrada
+ * @param {string} outdir - Diretório de saída
+ * @param {boolean} isProduction - Flag de produção
+ * @param {Object} plugins - Objeto contendo arrays de plugins
+ * @param {Array} plugins.prePlugins - Plugins para rodar ANTES do framework
+ * @param {Array} plugins.postPlugins - Plugins para rodar DEPOIS do framework
+ */
+async function createReactConfig(entryPoint, outdir, isProduction, { prePlugins = [], postPlugins = [] } = {}) {
+    const replaceValues = {
+        'process.env.NODE_ENV': JSON.stringify(isProduction ? 'production' : 'development'),
+        'process.env.PORT': JSON.stringify(process.vatts?.port || 3000)
+    };
+    const extensions = ['.mjs', '.js', '.json', '.node', '.jsx', '.tsx', '.ts'];
+    const esbuildLoaders = {
+        '.js': 'jsx',
+        '.ts': 'ts',
+        '.tsx': 'tsx'
+    };
+    return {
+        input: entryPoint,
+        treeshake: {
+            moduleSideEffects: 'no-external',
+            preset: isProduction ? 'recommended' : 'smallest'
+        },
+        cache: isProduction ? true : false,
+        perf: false,
+        maxParallelFileOps: 20,
+        plugins: [
+            replace({
+                preventAssignment: true,
+                values: replaceValues
+            }),
+            ...prePlugins,
+            nodeResolve({
+                extensions,
+                preferBuiltins: true,
+                browser: true,
+                dedupe: ['react', 'react-dom']
+            }),
+            commonjs({
+                sourceMap: !isProduction,
+                requireReturnsDefault: 'auto',
+                ignoreTryCatch: true
+            }),
+            ...postPlugins,
+            jsonPlugin(),
+            esbuild({
+                include: /\.[jt]sx?$/,
+                exclude: /node_modules/,
+                sourceMap: !isProduction,
+                minify: isProduction,
+                legalComments: 'none',
+                treeShaking: isProduction,
+                target: 'esnext',
+                jsx: 'automatic',
+                define: { __VERSION__: '"1.0.0"' },
+                loaders: esbuildLoaders
+            })
+        ],
+        onwarn(warning, warn) {
+            if (warning.code === 'MODULE_LEVEL_DIRECTIVE')
+                return;
+            if (warning.code === 'THIS_IS_UNDEFINED')
+                return;
+            if (warning.code === 'CIRCULAR_DEPENDENCY' && warning.message.includes('node_modules'))
+                return;
+            warn(warning);
+        }
+    };
+}
+module.exports = { createReactConfig };