nyte 1.0.0 → 1.1.0

package/dist/client/entry.client.d.ts

@@ -1 +1 @@
-export {};
+export declare function DevIndicator(): import("react/jsx-runtime").JSX.Element | null;

package/dist/client/entry.client.js

@@ -33,6 +33,7 @@ var __importStar = (this && this.__importStar) || (function () {
     };
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.DevIndicator = DevIndicator;
 const jsx_runtime_1 = require("react/jsx-runtime");
 /*
  * This file is part of the Nyte.js Project.
@@ -214,184 +215,72 @@ function App({ componentMap, routes, initialComponentPath, initialParams, layout
     // Adiciona o indicador de dev se não for produção
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [content, process.env.NODE_ENV !== 'production' && (0, jsx_runtime_1.jsx)(DevIndicator, {})] }));
 }
-// --- Constantes de Configuração ---
-const DEV_INDICATOR_SIZE = 48;
-const DEV_INDICATOR_CORNERS = [
-    { top: 16, left: 16 }, // 0: topo-esquerda
-    { top: 16, right: 16 }, // 1: topo-direita
-    { bottom: 16, left: 16 }, // 2: baixo-esquerda
-    { bottom: 16, right: 16 }, // 3: baixo-direita
-];
 function DevIndicator() {
-    const [corner, setCorner] = (0, react_1.useState)(3); // Canto atual (0-3)
-    const [isDragging, setIsDragging] = (0, react_1.useState)(false); // Estado de arrastar
-    const [isBuilding, setIsBuilding] = (0, react_1.useState)(false); // Estado de build
-    // Posição visual do indicador durante o arraste
-    const [position, setPosition] = (0, react_1.useState)({ top: 0, left: 0 });
-    const indicatorRef = (0, react_1.useRef)(null);
-    const dragStartRef = (0, react_1.useRef)(null);
-    // Escuta eventos de hot reload para mostrar estado de build
-    (0, react_1.useEffect)(() => {
-        if (typeof window === 'undefined')
-            return;
-        const handleHotReloadMessage = (event) => {
-            try {
-                const message = JSON.parse(event.data);
-                // Quando detecta mudança em arquivo, ativa loading
-                if (message.type === 'frontend-reload' ||
-                    message.type === 'backend-api-reload' ||
-                    message.type === 'src-reload') {
-                    setIsBuilding(true);
-                }
-                // Quando o build termina ou servidor fica pronto, desativa loading
-                if (message.type === 'server-ready' || message.type === 'build-complete') {
-                    setIsBuilding(false);
-                }
-            }
-            catch (e) {
-                // Ignora mensagens que não são JSON
-            }
-        };
-        // Intercepta mensagens WebSocket
-        const originalWebSocket = window.WebSocket;
-        window.WebSocket = class extends originalWebSocket {
-            constructor(url, protocols) {
-                super(url, protocols);
-                this.addEventListener('message', (event) => {
-                    if (url.toString().includes('hweb-hotreload')) {
-                        handleHotReloadMessage(event);
-                    }
-                });
-            }
-        };
-        return () => {
-            window.WebSocket = originalWebSocket;
-        };
-    }, []);
-    // --- Estilos Dinâmicos ---
-    const getIndicatorStyle = () => {
-        const baseStyle = {
-            position: 'fixed',
-            zIndex: 9999,
-            width: DEV_INDICATOR_SIZE,
-            height: DEV_INDICATOR_SIZE,
-            borderRadius: '50%',
-            background: isBuilding
-                ? 'linear-gradient(135deg, #f093fb, #f5576c)' // Gradiente Rosa/Vermelho quando building
-                : 'linear-gradient(135deg, #8e2de2, #4a00e0)', // Gradiente Roxo normal
-            color: 'white',
-            fontWeight: 'bold',
-            fontSize: 28,
-            boxShadow: isBuilding
-                ? '0 4px 25px rgba(245, 87, 108, 0.6)' // Shadow mais forte quando building
-                : '0 4px 15px rgba(0,0,0,0.2)',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            cursor: isDragging ? 'grabbing' : 'grab',
-            userSelect: 'none',
-            transition: isDragging ? 'none' : 'all 0.3s ease-out',
-            animation: isBuilding ? 'hweb-pulse 1.5s ease-in-out infinite' : 'none',
-        };
-        if (isDragging) {
-            return {
-                ...baseStyle,
-                top: position.top,
-                left: position.left,
-            };
-        }
-        return { ...baseStyle, ...DEV_INDICATOR_CORNERS[corner] };
-    };
-    const getMenuPositionStyle = () => {
-        // Posiciona o menu dependendo do canto
-        switch (corner) {
-            case 0: return { top: '110%', left: '0' }; // Top-Left
-            case 1: return { top: '110%', right: '0' }; // Top-Right
-            case 2: return { bottom: '110%', left: '0' }; // Bottom-Left
-            case 3: return { bottom: '110%', right: '0' }; // Bottom-Right
-            default: return {};
-        }
-    };
-    // --- Lógica de Eventos ---
-    const handleMouseDown = (e) => {
-        e.preventDefault();
-        dragStartRef.current = { x: e.clientX, y: e.clientY, moved: false };
-        if (indicatorRef.current) {
-            const rect = indicatorRef.current.getBoundingClientRect();
-            setPosition({ top: rect.top, left: rect.left });
-        }
-        setIsDragging(true);
-    };
-    const handleMouseMove = (0, react_1.useCallback)((e) => {
-        if (!isDragging || !dragStartRef.current)
-            return;
-        const deltaX = e.clientX - dragStartRef.current.x;
-        const deltaY = e.clientY - dragStartRef.current.y;
-        // Diferencia clique de arrastar (threshold de 5px)
-        if (!dragStartRef.current.moved && Math.hypot(deltaX, deltaY) > 5) {
-            dragStartRef.current.moved = true;
-        }
-        if (dragStartRef.current.moved) {
-            setPosition(prevPos => ({
-                top: prevPos.top + deltaY,
-                left: prevPos.left + deltaX,
-            }));
-            // Atualiza a referência para o próximo movimento
-            dragStartRef.current.x = e.clientX;
-            dragStartRef.current.y = e.clientY;
-        }
-    }, [isDragging]);
-    const handleMouseUp = (0, react_1.useCallback)((e) => {
-        if (!isDragging)
-            return;
-        setIsDragging(false);
-        // Se moveu, calcula o canto mais próximo
-        if (dragStartRef.current?.moved) {
-            const { clientX, clientY } = e;
-            const w = window.innerWidth;
-            const h = window.innerHeight;
-            const dists = [
-                Math.hypot(clientX, clientY), // TL
-                Math.hypot(w - clientX, clientY), // TR
-                Math.hypot(clientX, h - clientY), // BL
-                Math.hypot(w - clientX, h - clientY), // BR
-            ];
-            setCorner(dists.indexOf(Math.min(...dists)));
-        }
-        dragStartRef.current = null;
-    }, [isDragging]);
-    // Adiciona e remove listeners globais
-    (0, react_1.useEffect)(() => {
-        if (isDragging) {
-            window.addEventListener('mousemove', handleMouseMove);
-            window.addEventListener('mouseup', handleMouseUp);
-        }
-        return () => {
-            window.removeEventListener('mousemove', handleMouseMove);
-            window.removeEventListener('mouseup', handleMouseUp);
-        };
-    }, [isDragging, handleMouseMove, handleMouseUp]);
+    const [isVisible, setIsVisible] = (0, react_1.useState)(true);
+    if (!isVisible)
+        return null;
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("style", { children: `
-                    @keyframes hweb-pulse {
-                        0%, 100% {
-                            transform: scale(1);
-                            opacity: 1;
-                        }
-                        50% {
-                            transform: scale(1.1);
-                            opacity: 0.8;
-                        }
-                    }
-                    
-                    @keyframes hweb-spin {
-                        from {
-                            transform: rotate(0deg);
-                        }
-                        to {
-                            transform: rotate(360deg);
-                        }
-                    }
-                ` }), (0, jsx_runtime_1.jsx)("div", { ref: indicatorRef, style: getIndicatorStyle(), onMouseDown: handleMouseDown, title: isBuilding ? "Building..." : "Modo Dev Nyte.js", children: isBuilding ? ((0, jsx_runtime_1.jsx)("span", { style: { animation: 'hweb-spin 1s linear infinite' }, children: "\u27F3" })) : ('H') })] }));
+          @keyframes nyte-pulse {
+            0% { opacity: 0.4; }
+            50% { opacity: 1; }
+            100% { opacity: 0.4; }
+          }
+          .nyte-dev-badge {
+            position: fixed;
+            bottom: 20px;
+            right: 20px;
+            z-index: 999999;
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            padding: 8px 14px;
+            background: rgba(15, 15, 20, 0.8);
+            backdrop-filter: blur(12px);
+            -webkit-backdrop-filter: blur(12px);
+  
+            border-radius: 10px;
+            color: #fff;
+            font-family: 'Inter', ui-monospace, SFMono-Regular, Menlo, monospace;
+            font-size: 12px;
+            font-weight: 600;
+            letter-spacing: 0.05em;
+            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
+            transition: all 0.2s ease;
+            cursor: default;
+            user-select: none;
+          }
+          .nyte-dev-badge:hover {
+            border-color: rgba(142, 45, 226, 0.5);
+            transform: translateY(-2px);
+          }
+          .nyte-status-dot {
+            width: 8px;
+            height: 8px;
+            background: #10b981; /* Verde esmeralda */
+            border-radius: 50%;
+            box-shadow: 0 0 10px #10b981;
+            animation: nyte-pulse 2s infinite ease-in-out;
+          }
+          .nyte-label {
+            color: rgba(255, 255, 255, 0.5);
+            text-transform: uppercase;
+            font-size: 10px;
+          }
+          .nyte-logo {
+            background: linear-gradient(135deg, #00a3a3, #808080);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            font-weight: 800;
+          }
+        ` }), (0, jsx_runtime_1.jsxs)("div", { className: "nyte-dev-badge", children: [(0, jsx_runtime_1.jsx)("div", { className: "nyte-status-dot" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("span", { className: "nyte-logo", children: "NYTE.JS" }) }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setIsVisible(false), style: {
+                            background: 'none',
+                            border: 'none',
+                            color: 'rgba(255,255,255,0.3)',
+                            cursor: 'pointer',
+                            fontSize: '14px',
+                            padding: '0 0 0 4px',
+                            marginLeft: '4px'
+                        }, title: "Fechar", children: "\u00D7" })] })] }));
 }
 // --- Inicialização do Cliente (CSR - Client-Side Rendering) ---
 function deobfuscateData(obfuscated) {

package/dist/hotReload.js

@@ -213,6 +213,7 @@ class HotReloadManager {
             });
             try {
                 this.frontendChangeCallback?.();
+                this.backendApiChangeCallback?.();
                 await Promise.race([buildPromise, timeoutPromise]);
                 dm.end(`Build complete for ${path.basename(filePath)}, reloading frontend.`);
                 this.frontendChangeCallback?.();
@@ -230,13 +231,13 @@ class HotReloadManager {
         }
         // Se for arquivo de backend, recarrega o módulo e notifica
         if (isBackendFile) {
-            console_1.default.logWithout(console_1.Levels.INFO, console_1.Colors.BgRed, `Reloading backend...`);
+            console_1.default.logWithout(console_1.Levels.INFO, undefined, `Reloading backend...`);
             this.backendApiChangeCallback?.();
             this.notifyClients('backend-api-reload', { file: filePath, event: 'change' });
         }
         // Fallback: se não for nem frontend nem backend detectado, recarrega tudo
         if (!isFrontendFile && !isBackendFile) {
-            console_1.default.logWithout(console_1.Levels.INFO, console_1.Colors.BgRed, `Reloading application...`);
+            console_1.default.logWithout(console_1.Levels.INFO, undefined, `Reloading application...`);
             this.frontendChangeCallback?.();
             this.backendApiChangeCallback?.();
             this.notifyClients('src-reload', { file: filePath, event: 'change' });

package/dist/rpc/annotations.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Símbolo único para marcar funções expostas.
+ * Usamos Symbol para garantir que não possa ser falsificado via JSON no payload.
+ */
+export declare const RPC_EXPOSED_KEY: unique symbol;
+type AnyFn = (...args: any[]) => any;
+/**
+ * Marca uma ou mais funções como seguras para RPC.
+ */
+export default function Expose<T extends AnyFn>(fn: T): T;
+export default function Expose<T extends AnyFn[]>(fns: [...T]): T;
+export default function Expose<T extends AnyFn[]>(...fns: T): T;
+export {};

package/dist/rpc/annotations.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RPC_EXPOSED_KEY = void 0;
+exports.default = Expose;
+/**
+ * Símbolo único para marcar funções expostas.
+ * Usamos Symbol para garantir que não possa ser falsificado via JSON no payload.
+ */
+exports.RPC_EXPOSED_KEY = Symbol('__rpc_exposed__');
+function Expose(...input) {
+    const fns = Array.isArray(input[0]) ? input[0] : input;
+    for (const fn of fns) {
+        if (typeof fn !== 'function') {
+            throw new TypeError('Expose aceita apenas funções');
+        }
+        fn[exports.RPC_EXPOSED_KEY] = true;
+    }
+    // Retorno:
+    // - se veio uma função → retorna ela
+    // - se veio lista → retorna a lista
+    return input.length === 1 ? input[0] : input;
+}

package/dist/rpc/server.js

@@ -7,7 +7,7 @@
  * 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
+ * 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,
@@ -23,6 +23,8 @@ exports.executeRpc = executeRpc;
 const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
 const http_1 = require("../api/http");
+// Importamos a chave para verificar a anotação de segurança
+const annotations_1 = require("./annotations");
 const DEFAULT_ALLOWED_SERVER_DIRS = ['src/backend'];
 function normalizeToPosix(p) {
     return p.replace(/\\/g, '/');
@@ -52,7 +54,7 @@ function tryResolveWithinAllowedDirs(projectDir, allowedDirs, requestedFile) {
         const baseAbs = path_1.default.resolve(projectDir, d);
         // Interpret client path as relative to src/web (where it's typically authored)
         const fromWebAbs = path_1.default.resolve(projectDir, 'src/web', req);
-        // Map: <project>/src/backend/*  (coming from ../../backend/* from web code)
+        // Map: <project>/src/backend/* (coming from ../../backend/* from web code)
         const mappedFromWebAbs = fromWebAbs.replace(path_1.default.resolve(projectDir, 'backend') + path_1.default.sep, path_1.default.resolve(projectDir, 'src', 'backend') + path_1.default.sep);
         // Also accept callers passing a backend-relative path like "./auth" or "auth"
         const fromBackendAbs = path_1.default.resolve(baseAbs, req);
@@ -155,6 +157,20 @@ async function executeRpc(ctx, payload) {
         if (typeof fnValue !== 'function') {
             return { success: false, error: `RPC function not found: ${fnName}` };
         }
+        // --- SECURITY CHECK (Expose Annotation or Allowlist) ---
+        // 1. Verifica se a função possui o Symbol definido em annotations.ts (Via wrapper Expose())
+        const isAnnotated = fnValue[annotations_1.RPC_EXPOSED_KEY];
+        // 2. Verifica se o módulo exporta uma lista explícita chamada 'exposed' ou 'rpcMethods'
+        //    Isso permite o uso de "export function" sem wrapper, listando os nomes no final do arquivo.
+        const allowList = mod.exposed || mod.rpcMethods;
+        const isListed = Array.isArray(allowList) && allowList.includes(fnName);
+        if (!isAnnotated && !isListed) {
+            return {
+                success: false,
+                error: `Function '${fnName}' is not exposed via RPC. Mark it with Expose() or add it to an exported 'exposed' array.`
+            };
+        }
+        // ------------------------------------------
         const rpcRequest = ctx.request ? new http_1.NyteRequest(ctx.request) : buildRpcRequestFromPayload(payload);
         const result = await fnValue(rpcRequest, ...payload.args);
         return { success: true, return: result };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nyte",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Nyte.js is a high-level framework for building web applications with ease and speed. It provides a robust set of tools and features to streamline development and enhance productivity.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -47,6 +47,11 @@
       "types": "./dist/eslint/index.d.ts",
       "import": "./dist/eslint/index.js",
       "require": "./dist/eslint/index.js"
+    },
+    "./rpc": {
+      "types": "./dist/rpc/annotations.d.ts",
+      "import": "./dist/rpc/annotations.js",
+      "require": "./dist/rpc/annotations.js"
     }
   },
   "peerDependencies": {

package/src/client/entry.client.tsx

@@ -223,221 +223,92 @@ function App({ componentMap, routes, initialComponentPath, initialParams, layout
 
 
 
-// --- Constantes de Configuração ---
-const DEV_INDICATOR_SIZE = 48;
-const DEV_INDICATOR_CORNERS = [
-    { top: 16, left: 16 },    // 0: topo-esquerda
-    { top: 16, right: 16 },   // 1: topo-direita
-    { bottom: 16, left: 16 }, // 2: baixo-esquerda
-    { bottom: 16, right: 16 },// 3: baixo-direita
-];
-
-function DevIndicator() {
-    const [corner, setCorner] = useState(3); // Canto atual (0-3)
-    const [isDragging, setIsDragging] = useState(false); // Estado de arrastar
-    const [isBuilding, setIsBuilding] = useState(false); // Estado de build
-
-    // Posição visual do indicador durante o arraste
-    const [position, setPosition] = useState<{ top: number; left: number }>({ top: 0, left: 0 });
-
-    const indicatorRef = useRef<HTMLDivElement>(null);
-    const dragStartRef = useRef<{ x: number; y: number; moved: boolean } | null>(null);
-
-    // Escuta eventos de hot reload para mostrar estado de build
-    useEffect(() => {
-        if (typeof window === 'undefined') return;
-
-        const handleHotReloadMessage = (event: MessageEvent) => {
-            try {
-                const message = JSON.parse(event.data);
-
-                // Quando detecta mudança em arquivo, ativa loading
-                if (message.type === 'frontend-reload' ||
-                    message.type === 'backend-api-reload' ||
-                    message.type === 'src-reload') {
-                    setIsBuilding(true);
-                }
-
-                // Quando o build termina ou servidor fica pronto, desativa loading
-                if (message.type === 'server-ready' || message.type === 'build-complete') {
-                    setIsBuilding(false);
-                }
-            } catch (e) {
-                // Ignora mensagens que não são JSON
-            }
-        };
-
-        // Intercepta mensagens WebSocket
-        const originalWebSocket = window.WebSocket;
-        window.WebSocket = class extends originalWebSocket {
-            constructor(url: string | URL, protocols?: string | string[]) {
-                super(url, protocols);
-
-                this.addEventListener('message', (event) => {
-                    if (url.toString().includes('hweb-hotreload')) {
-                        handleHotReloadMessage(event);
-                    }
-                });
-            }
-        } as any;
-
-        return () => {
-            window.WebSocket = originalWebSocket;
-        };
-    }, []);
-
-    // --- Estilos Dinâmicos ---
-    const getIndicatorStyle = (): React.CSSProperties => {
-        const baseStyle: React.CSSProperties = {
-            position: 'fixed',
-            zIndex: 9999,
-            width: DEV_INDICATOR_SIZE,
-            height: DEV_INDICATOR_SIZE,
-            borderRadius: '50%',
-            background: isBuilding
-                ? 'linear-gradient(135deg, #f093fb, #f5576c)' // Gradiente Rosa/Vermelho quando building
-                : 'linear-gradient(135deg, #8e2de2, #4a00e0)', // Gradiente Roxo normal
-            color: 'white',
-            fontWeight: 'bold',
-            fontSize: 28,
-            boxShadow: isBuilding
-                ? '0 4px 25px rgba(245, 87, 108, 0.6)' // Shadow mais forte quando building
-                : '0 4px 15px rgba(0,0,0,0.2)',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            cursor: isDragging ? 'grabbing' : 'grab',
-            userSelect: 'none',
-            transition: isDragging ? 'none' : 'all 0.3s ease-out',
-            animation: isBuilding ? 'hweb-pulse 1.5s ease-in-out infinite' : 'none',
-        };
 
-        if (isDragging) {
-            return {
-                ...baseStyle,
-                top: position.top,
-                left: position.left,
-            };
-        }
-
-        return { ...baseStyle, ...DEV_INDICATOR_CORNERS[corner] };
-    };
-
-    const getMenuPositionStyle = (): React.CSSProperties => {
-        // Posiciona o menu dependendo do canto
-        switch (corner) {
-            case 0: return { top: '110%', left: '0' }; // Top-Left
-            case 1: return { top: '110%', right: '0' }; // Top-Right
-            case 2: return { bottom: '110%', left: '0' }; // Bottom-Left
-            case 3: return { bottom: '110%', right: '0' }; // Bottom-Right
-            default: return {};
-        }
-    };
-
-    // --- Lógica de Eventos ---
-    const handleMouseDown = (e: React.MouseEvent<HTMLDivElement>) => {
-        e.preventDefault();
-        dragStartRef.current = { x: e.clientX, y: e.clientY, moved: false };
-        if (indicatorRef.current) {
-            const rect = indicatorRef.current.getBoundingClientRect();
-            setPosition({ top: rect.top, left: rect.left });
-        }
-        setIsDragging(true);
-    };
-
-    const handleMouseMove = useCallback((e: MouseEvent) => {
-        if (!isDragging || !dragStartRef.current) return;
 
-        const deltaX = e.clientX - dragStartRef.current.x;
-        const deltaY = e.clientY - dragStartRef.current.y;
-
-        // Diferencia clique de arrastar (threshold de 5px)
-        if (!dragStartRef.current.moved && Math.hypot(deltaX, deltaY) > 5) {
-            dragStartRef.current.moved = true;
-        }
-
-        if (dragStartRef.current.moved) {
-            setPosition(prevPos => ({
-                top: prevPos.top + deltaY,
-                left: prevPos.left + deltaX,
-            }));
-            // Atualiza a referência para o próximo movimento
-            dragStartRef.current.x = e.clientX;
-            dragStartRef.current.y = e.clientY;
-        }
-    }, [isDragging]);
-
-    const handleMouseUp = useCallback((e: MouseEvent) => {
-        if (!isDragging) return;
-        setIsDragging(false);
-
-        // Se moveu, calcula o canto mais próximo
-        if (dragStartRef.current?.moved) {
-            const { clientX, clientY } = e;
-            const w = window.innerWidth;
-            const h = window.innerHeight;
-
-            const dists = [
-                Math.hypot(clientX, clientY), // TL
-                Math.hypot(w - clientX, clientY), // TR
-                Math.hypot(clientX, h - clientY), // BL
-                Math.hypot(w - clientX, h - clientY), // BR
-            ];
-            setCorner(dists.indexOf(Math.min(...dists)));
-        }
-
-        dragStartRef.current = null;
-    }, [isDragging]);
-
-    // Adiciona e remove listeners globais
-    useEffect(() => {
-        if (isDragging) {
-            window.addEventListener('mousemove', handleMouseMove);
-            window.addEventListener('mouseup', handleMouseUp);
-        }
-        return () => {
-            window.removeEventListener('mousemove', handleMouseMove);
-            window.removeEventListener('mouseup', handleMouseUp);
-        };
-    }, [isDragging, handleMouseMove, handleMouseUp]);
+export function DevIndicator() {
+    const [isVisible, setIsVisible] = useState(true);
 
+    if (!isVisible) return null;
 
     return (
         <>
             <style>
                 {`
-                    @keyframes hweb-pulse {
-                        0%, 100% {
-                            transform: scale(1);
-                            opacity: 1;
-                        }
-                        50% {
-                            transform: scale(1.1);
-                            opacity: 0.8;
-                        }
-                    }
-                    
-                    @keyframes hweb-spin {
-                        from {
-                            transform: rotate(0deg);
-                        }
-                        to {
-                            transform: rotate(360deg);
-                        }
-                    }
-                `}
+          @keyframes nyte-pulse {
+            0% { opacity: 0.4; }
+            50% { opacity: 1; }
+            100% { opacity: 0.4; }
+          }
+          .nyte-dev-badge {
+            position: fixed;
+            bottom: 20px;
+            right: 20px;
+            z-index: 999999;
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            padding: 8px 14px;
+            background: rgba(15, 15, 20, 0.8);
+            backdrop-filter: blur(12px);
+            -webkit-backdrop-filter: blur(12px);
+  
+            border-radius: 10px;
+            color: #fff;
+            font-family: 'Inter', ui-monospace, SFMono-Regular, Menlo, monospace;
+            font-size: 12px;
+            font-weight: 600;
+            letter-spacing: 0.05em;
+            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
+            transition: all 0.2s ease;
+            cursor: default;
+            user-select: none;
+          }
+          .nyte-dev-badge:hover {
+            border-color: rgba(142, 45, 226, 0.5);
+            transform: translateY(-2px);
+          }
+          .nyte-status-dot {
+            width: 8px;
+            height: 8px;
+            background: #10b981; /* Verde esmeralda */
+            border-radius: 50%;
+            box-shadow: 0 0 10px #10b981;
+            animation: nyte-pulse 2s infinite ease-in-out;
+          }
+          .nyte-label {
+            color: rgba(255, 255, 255, 0.5);
+            text-transform: uppercase;
+            font-size: 10px;
+          }
+          .nyte-logo {
+            background: linear-gradient(135deg, #00a3a3, #808080);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            font-weight: 800;
+          }
+        `}
             </style>
-            <div
-                ref={indicatorRef}
-                style={getIndicatorStyle()}
-                onMouseDown={handleMouseDown}
-                title={isBuilding ? "Building..." : "Modo Dev Nyte.js"}
-            >
-                {isBuilding ? (
-                    <span style={{ animation: 'hweb-spin 1s linear infinite' }}>⟳</span>
-                ) : (
-                    'H'
-                )}
+
+            <div className="nyte-dev-badge">
+                <div className="nyte-status-dot" />
+                <div>
+                    <span className="nyte-logo">NYTE.JS</span>
+                </div>
+                <button
+                    onClick={() => setIsVisible(false)}
+                    style={{
+                        background: 'none',
+                        border: 'none',
+                        color: 'rgba(255,255,255,0.3)',
+                        cursor: 'pointer',
+                        fontSize: '14px',
+                        padding: '0 0 0 4px',
+                        marginLeft: '4px'
+                    }}
+                    title="Fechar"
+                >
+                    ×
+                </button>
             </div>
         </>
     );

package/src/hotReload.ts

@@ -219,6 +219,7 @@ export class HotReloadManager {
 
             try {
                 this.frontendChangeCallback?.();
+                this.backendApiChangeCallback?.();
                 await Promise.race([buildPromise, timeoutPromise]);
                 dm.end(`Build complete for ${path.basename(filePath)}, reloading frontend.`);
                 this.frontendChangeCallback?.();
@@ -235,14 +236,14 @@ export class HotReloadManager {
 
         // Se for arquivo de backend, recarrega o módulo e notifica
         if (isBackendFile) {
-            Console.logWithout(Levels.INFO, Colors.BgRed,`Reloading backend...`);
+            Console.logWithout(Levels.INFO, undefined,`Reloading backend...`);
             this.backendApiChangeCallback?.();
             this.notifyClients('backend-api-reload', { file: filePath, event: 'change' });
         }
 
         // Fallback: se não for nem frontend nem backend detectado, recarrega tudo
         if (!isFrontendFile && !isBackendFile) {
-            Console.logWithout(Levels.INFO, Colors.BgRed,`Reloading application...`);
+            Console.logWithout(Levels.INFO, undefined,`Reloading application...`);
             this.frontendChangeCallback?.();
             this.backendApiChangeCallback?.();
             this.notifyClients('src-reload', { file: filePath, event: 'change' });

package/src/rpc/annotations.ts

@@ -0,0 +1,30 @@
+/**
+ * Símbolo único para marcar funções expostas.
+ * Usamos Symbol para garantir que não possa ser falsificado via JSON no payload.
+ */
+export const RPC_EXPOSED_KEY = Symbol('__rpc_exposed__');
+
+type AnyFn = (...args: any[]) => any;
+
+/**
+ * Marca uma ou mais funções como seguras para RPC.
+ */
+export default function Expose<T extends AnyFn>(fn: T): T;
+export default function Expose<T extends AnyFn[]>(fns: [...T]): T;
+export default function Expose<T extends AnyFn[]>(...fns: T): T;
+export default function Expose(...input: any[]): any {
+    const fns: AnyFn[] =
+        Array.isArray(input[0]) ? input[0] : input;
+
+    for (const fn of fns) {
+        if (typeof fn !== 'function') {
+            throw new TypeError('Expose aceita apenas funções');
+        }
+        (fn as any)[RPC_EXPOSED_KEY] = true;
+    }
+
+    // Retorno:
+    // - se veio uma função → retorna ela
+    // - se veio lista → retorna a lista
+    return input.length === 1 ? input[0] : input;
+}

package/src/rpc/server.ts

@@ -6,7 +6,7 @@
  * 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
+ * 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,
@@ -20,6 +20,8 @@ import path from 'path';
 import { RpcRequestPayload, RpcResponsePayload } from './types';
 import { NyteRequest } from '../api/http';
 import type { GenericRequest } from '../types/framework';
+// Importamos a chave para verificar a anotação de segurança
+import { RPC_EXPOSED_KEY } from './annotations';
 
 const DEFAULT_ALLOWED_SERVER_DIRS = ['src/backend'] as const;
 
@@ -64,7 +66,7 @@ function tryResolveWithinAllowedDirs(projectDir: string, allowedDirs: string[],
         // Interpret client path as relative to src/web (where it's typically authored)
         const fromWebAbs = path.resolve(projectDir, 'src/web', req);
 
-        // Map: <project>/src/backend/*  (coming from ../../backend/* from web code)
+        // Map: <project>/src/backend/* (coming from ../../backend/* from web code)
         const mappedFromWebAbs = fromWebAbs.replace(
             path.resolve(projectDir, 'backend') + path.sep,
             path.resolve(projectDir, 'src', 'backend') + path.sep
@@ -180,6 +182,23 @@ export async function executeRpc(ctx: RpcExecutionContext, payload: any): Promis
             return { success: false, error: `RPC function not found: ${fnName}` };
         }
 
+        // --- SECURITY CHECK (Expose Annotation or Allowlist) ---
+        // 1. Verifica se a função possui o Symbol definido em annotations.ts (Via wrapper Expose())
+        const isAnnotated = (fnValue as any)[RPC_EXPOSED_KEY];
+
+        // 2. Verifica se o módulo exporta uma lista explícita chamada 'exposed' ou 'rpcMethods'
+        //    Isso permite o uso de "export function" sem wrapper, listando os nomes no final do arquivo.
+        const allowList = mod.exposed || mod.rpcMethods;
+        const isListed = Array.isArray(allowList) && allowList.includes(fnName);
+
+        if (!isAnnotated && !isListed) {
+            return {
+                success: false,
+                error: `Function '${fnName}' is not exposed via RPC. Mark it with Expose() or add it to an exported 'exposed' array.`
+            };
+        }
+        // ------------------------------------------
+
         const rpcRequest = ctx.request ? new NyteRequest(ctx.request) : buildRpcRequestFromPayload(payload);
         const result = await fnValue(rpcRequest, ...payload.args);
         return { success: true, return: result };
@@ -187,4 +206,4 @@ export async function executeRpc(ctx: RpcExecutionContext, payload: any): Promis
         const message = typeof err?.message === 'string' ? err.message : 'Unknown RPC error';
         return { success: false, error: message };
     }
-}
+}