hightjs 0.5.3 → 0.5.4

package/dist/client/entry.client.js

@@ -0,0 +1,455 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+/*
+ * This file is part of the HightJS Project.
+ * Copyright (c) 2025 itsmuzin
+ *
+ * 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 client_1 = require("react-dom/client");
+const clientRouter_1 = require("./clientRouter");
+function App({ componentMap, routes, initialComponentPath, initialParams, layoutComponent }) {
+    // Estado que guarda o componente a ser renderizado atualmente
+    const [hmrTimestamp, setHmrTimestamp] = (0, react_1.useState)(Date.now());
+    // Helper para encontrar rota baseado no path
+    const findRouteForPath = (0, react_1.useCallback)((path) => {
+        for (const route of routes) {
+            const regexPattern = route.pattern
+                // [[...param]] → opcional catch-all
+                .replace(/\[\[\.\.\.(\w+)\]\]/g, '(?<$1>.+)?')
+                // [...param] → obrigatório catch-all
+                .replace(/\[\.\.\.(\w+)\]/g, '(?<$1>.+)')
+                // /[[param]] → opcional com barra também opcional
+                .replace(/\/\[\[(\w+)\]\]/g, '(?:/(?<$1>[^/]+))?')
+                // [[param]] → segmento opcional (sem barra anterior)
+                .replace(/\[\[(\w+)\]\]/g, '(?<$1>[^/]+)?')
+                // [param] → segmento obrigatório
+                .replace(/\[(\w+)\]/g, '(?<$1>[^/]+)');
+            const regex = new RegExp(`^${regexPattern}/?$`);
+            const match = path.match(regex);
+            if (match) {
+                return {
+                    componentPath: route.componentPath,
+                    params: match.groups || {}
+                };
+            }
+        }
+        return null;
+    }, [routes]);
+    // Inicializa o componente e params baseado na URL ATUAL (não no initialComponentPath)
+    const [CurrentPageComponent, setCurrentPageComponent] = (0, react_1.useState)(() => {
+        // Pega a rota atual da URL
+        const currentPath = window.location.pathname;
+        const match = findRouteForPath(currentPath);
+        if (match) {
+            return componentMap[match.componentPath];
+        }
+        // Se não encontrou rota, retorna null para mostrar 404
+        return null;
+    });
+    const [params, setParams] = (0, react_1.useState)(() => {
+        // Pega os params da URL atual
+        const currentPath = window.location.pathname;
+        const match = findRouteForPath(currentPath);
+        return match ? match.params : {};
+    });
+    // HMR: Escuta eventos de hot reload
+    (0, react_1.useEffect)(() => {
+        // Ativa o sistema de HMR
+        window.__HWEB_HMR__ = true;
+        const handleHMRUpdate = async (event) => {
+            const { file, timestamp } = event.detail;
+            const fileName = file ? file.split('/').pop()?.split('\\').pop() : 'unknown';
+            console.log('🔥 HMR: Hot reloading...', fileName);
+            try {
+                // Aguarda um pouco para o esbuild terminar de recompilar
+                await new Promise(resolve => setTimeout(resolve, 300));
+                // Re-importa o módulo principal com cache busting
+                const mainScript = document.querySelector('script[src*="main.js"]');
+                if (mainScript) {
+                    const mainSrc = mainScript.src.split('?')[0];
+                    const cacheBustedSrc = `${mainSrc}?t=${timestamp}`;
+                    // Cria novo script
+                    const newScript = document.createElement('script');
+                    newScript.type = 'module';
+                    newScript.src = cacheBustedSrc;
+                    // Quando o novo script carregar, força re-render
+                    newScript.onload = () => {
+                        console.log('✅ HMR: Modules reloaded');
+                        // Força re-render do componente
+                        setHmrTimestamp(timestamp);
+                        // Marca sucesso
+                        window.__HMR_SUCCESS__ = true;
+                        setTimeout(() => {
+                            window.__HMR_SUCCESS__ = false;
+                        }, 3000);
+                    };
+                    newScript.onerror = () => {
+                        console.error('❌ HMR: Failed to reload modules');
+                        window.__HMR_SUCCESS__ = false;
+                    };
+                    // Remove o script antigo e adiciona o novo
+                    // (não remove para não quebrar o app)
+                    document.head.appendChild(newScript);
+                }
+                else {
+                    // Se não encontrou o script, apenas força re-render
+                    console.log('⚡ HMR: Forcing re-render');
+                    setHmrTimestamp(timestamp);
+                    window.__HMR_SUCCESS__ = true;
+                }
+            }
+            catch (error) {
+                console.error('❌ HMR Error:', error);
+                window.__HMR_SUCCESS__ = false;
+            }
+        };
+        window.addEventListener('hmr:component-update', handleHMRUpdate);
+        return () => {
+            window.removeEventListener('hmr:component-update', handleHMRUpdate);
+        };
+    }, []);
+    const updateRoute = (0, react_1.useCallback)(() => {
+        const currentPath = clientRouter_1.router.pathname;
+        const match = findRouteForPath(currentPath);
+        if (match) {
+            setCurrentPageComponent(() => componentMap[match.componentPath]);
+            setParams(match.params);
+        }
+        else {
+            // Se não encontrou rota, define como null para mostrar 404
+            setCurrentPageComponent(null);
+            setParams({});
+        }
+    }, [clientRouter_1.router.pathname, findRouteForPath, componentMap]);
+    // Ouve os eventos de "voltar" e "avançar" do navegador
+    (0, react_1.useEffect)(() => {
+        const handlePopState = () => {
+            updateRoute();
+        };
+        window.addEventListener('popstate', handlePopState);
+        // Também se inscreve no router para mudanças de rota
+        const unsubscribe = clientRouter_1.router.subscribe(updateRoute);
+        return () => {
+            window.removeEventListener('popstate', handlePopState);
+            unsubscribe();
+        };
+    }, [updateRoute]);
+    // Se não há componente ou é a rota __404__, mostra página 404
+    if (!CurrentPageComponent || initialComponentPath === '__404__') {
+        // Usa o componente 404 personalizado se existir, senão usa o padrão do hweb
+        const NotFoundComponent = window.__HWEB_NOT_FOUND__;
+        if (NotFoundComponent) {
+            // Usa o notFound.tsx personalizado do usuário
+            const NotFoundContent = (0, jsx_runtime_1.jsx)(NotFoundComponent, {});
+            // Aplica o layout se existir
+            if (layoutComponent) {
+                return react_1.default.createElement(layoutComponent, { children: NotFoundContent });
+            }
+            return NotFoundContent;
+        }
+        else {
+            // Usa o 404 padrão do hweb que foi incluído no build
+            const DefaultNotFound = window.__HWEB_DEFAULT_NOT_FOUND__;
+            const NotFoundContent = (0, jsx_runtime_1.jsx)(DefaultNotFound, {});
+            // Aplica o layout se existir
+            if (layoutComponent) {
+                return react_1.default.createElement(layoutComponent, { children: NotFoundContent });
+            }
+            return NotFoundContent;
+        }
+    }
+    // Renderiza o componente atual (sem Context, usa o router diretamente)
+    // Usa key com timestamp para forçar re-mount durante HMR
+    const PageContent = (0, jsx_runtime_1.jsx)(CurrentPageComponent, { params: params }, `page-${hmrTimestamp}`);
+    // SEMPRE usa o layout - se não existir, cria um wrapper padrão
+    const content = layoutComponent
+        ? react_1.default.createElement(layoutComponent, { children: PageContent })
+        : (0, jsx_runtime_1.jsx)("div", { children: PageContent });
+    // 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]);
+    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 HightJS", children: isBuilding ? ((0, jsx_runtime_1.jsx)("span", { style: { animation: 'hweb-spin 1s linear infinite' }, children: "\u27F3" })) : ('H') })] }));
+}
+// --- Inicialização do Cliente (CSR - Client-Side Rendering) ---
+function deobfuscateData(obfuscated) {
+    try {
+        // Remove o hash fake
+        const parts = obfuscated.split('.');
+        const base64 = parts.length > 1 ? parts[1] : parts[0];
+        // Decodifica base64
+        const jsonStr = atob(base64);
+        // Parse JSON
+        return JSON.parse(jsonStr);
+    }
+    catch (error) {
+        console.error('[hweb] Failed to decode data:', error);
+        return null;
+    }
+}
+function initializeClient() {
+    // Lê os dados do atributo data-h
+    const dataElement = document.getElementById('__hight_data__');
+    if (!dataElement) {
+        console.error('[hweb] Initial data script not found.');
+        return;
+    }
+    const obfuscated = dataElement.getAttribute('data-h');
+    if (!obfuscated) {
+        console.error('[hweb] Data attribute not found.');
+        return;
+    }
+    const initialData = deobfuscateData(obfuscated);
+    if (!initialData) {
+        console.error('[hweb] Failed to parse initial data.');
+        return;
+    }
+    // Cria o mapa de componentes dinamicamente a partir dos módulos carregados
+    const componentMap = {};
+    // Registra todos os componentes que foram importados
+    if (window.__HWEB_COMPONENTS__) {
+        Object.assign(componentMap, window.__HWEB_COMPONENTS__);
+    }
+    const container = document.getElementById('root');
+    if (!container) {
+        console.error('[hweb] Container #root not found.');
+        return;
+    }
+    try {
+        // Usar createRoot para render inicial (CSR)
+        const root = (0, client_1.createRoot)(container);
+        root.render((0, jsx_runtime_1.jsx)(App, { componentMap: componentMap, routes: initialData.routes, initialComponentPath: initialData.initialComponentPath, initialParams: initialData.initialParams, layoutComponent: window.__HWEB_LAYOUT__ }));
+    }
+    catch (error) {
+        console.error('[hweb] Error rendering application:', error);
+    }
+}
+// Executa quando o DOM estiver pronto
+if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initializeClient);
+}
+else {
+    initializeClient();
+}

package/dist/components/Link.d.ts

@@ -0,0 +1,7 @@
+import { type AnchorHTMLAttributes, type ReactNode } from 'react';
+interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    href: string;
+    children: ReactNode;
+}
+export declare function Link({ href, children, ...props }: LinkProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Link.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Link = Link;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const clientRouter_1 = require("../client/clientRouter");
+function Link({ href, children, ...props }) {
+    const handleClick = async (e) => {
+        e.preventDefault();
+        // Usa o novo sistema de router
+        await clientRouter_1.router.push(href);
+    };
+    return ((0, jsx_runtime_1.jsx)("a", { href: href, ...props, onClick: handleClick, children: children }));
+}

package/dist/global/global.d.ts

@@ -0,0 +1,117 @@
+/**
+ * Type declarations for asset imports
+ * This allows TypeScript to understand imports of various file types
+ */
+declare module "*.md" {
+    const content: string;
+    export default content;
+}
+declare module "*.png" {
+    const src: string;
+    export default src;
+}
+declare module "*.jpg" {
+    const src: string;
+    export default src;
+}
+declare module "*.jpeg" {
+    const src: string;
+    export default src;
+}
+declare module "*.gif" {
+    const src: string;
+    export default src;
+}
+declare module "*.webp" {
+    const src: string;
+    export default src;
+}
+declare module "*.avif" {
+    const src: string;
+    export default src;
+}
+declare module "*.ico" {
+    const src: string;
+    export default src;
+}
+declare module "*.bmp" {
+    const src: string;
+    export default src;
+}
+declare module "*.tif" {
+    const src: string;
+    export default src;
+}
+declare module "*.tiff" {
+    const src: string;
+    export default src;
+}
+declare module "*.svg" {
+    const src: string;
+    export const svgContent: string;
+    export default src;
+}
+declare module "*.json" {
+    const value: any;
+    export default value;
+}
+declare module "*.txt" {
+    const content: string;
+    export default content;
+}
+declare module "*.woff" {
+    const src: string;
+    export default src;
+}
+declare module "*.woff2" {
+    const src: string;
+    export default src;
+}
+declare module "*.ttf" {
+    const src: string;
+    export default src;
+}
+declare module "*.otf" {
+    const src: string;
+    export default src;
+}
+declare module "*.eot" {
+    const src: string;
+    export default src;
+}
+declare module "*.mp3" {
+    const src: string;
+    export default src;
+}
+declare module "*.wav" {
+    const src: string;
+    export default src;
+}
+declare module "*.ogg" {
+    const src: string;
+    export default src;
+}
+declare module "*.m4a" {
+    const src: string;
+    export default src;
+}
+declare module "*.aac" {
+    const src: string;
+    export default src;
+}
+declare module "*.flac" {
+    const src: string;
+    export default src;
+}
+declare module "*.mp4" {
+    const src: string;
+    export default src;
+}
+declare module "*.webm" {
+    const src: string;
+    export default src;
+}
+declare module "*.ogv" {
+    const src: string;
+    export default src;
+}

package/dist/global/global.js

@@ -0,0 +1,17 @@
+"use strict";
+/*
+ * This file is part of the HightJS Project.
+ * Copyright (c) 2025 itsmuzin
+ *
+ * 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.
+ */

package/dist/helpers.d.ts

@@ -0,0 +1,20 @@
+#!/usr/bin/env node
+import http, { Server } from 'http';
+import type { HightJSOptions } from './types';
+import https from 'https';
+export declare function app(options?: HightJSOptions): {
+    /**
+     * Integra com uma aplicação de qualquer framework (Express, Fastify, etc)
+     * O 'serverApp: any' é mantido para flexibilidade, já que pode ser de tipos diferentes.
+     */
+    integrate: (serverApp: any) => Promise<any>;
+    /**
+     * Inicia um servidor HightJS fechado (o usuário não tem acesso ao framework)
+     */
+    init: () => Promise<http.Server<typeof http.IncomingMessage, typeof http.ServerResponse> | https.Server<typeof http.IncomingMessage, typeof http.ServerResponse>>;
+    prepare: () => Promise<void>;
+    getRequestHandler: () => (req: any, res: any, next?: any) => Promise<void> | void;
+    setupWebSocket: (server: Server | any) => void;
+    executeInstrumentation: () => void;
+};
+export default app;