flysoft-react-ui 1.2.4 → 1.2.5

package/dist/hooks/useElementScroll.js

@@ -1,58 +0,0 @@
-import { useState, useEffect } from "react";
-export const useElementScroll = (elementRef) => {
-    const [scrollY, setScrollY] = useState(0);
-    const [scrollDirection, setScrollDirection] = useState(null);
-    useEffect(() => {
-        if (!elementRef.current)
-            return;
-        const element = elementRef.current;
-        let lastScrollY = element.scrollTop;
-        let lastDirection = null;
-        let rafId = null;
-        let pendingScrollY = element.scrollTop;
-        const handleScroll = () => {
-            pendingScrollY = element.scrollTop;
-            // Usar requestAnimationFrame para agrupar actualizaciones y evitar temblores
-            if (rafId === null) {
-                rafId = requestAnimationFrame(() => {
-                    rafId = null;
-                    const currentScrollY = pendingScrollY;
-                    const delta = currentScrollY - lastScrollY;
-                    // Verificar si estamos cerca del final (margen de 5px)
-                    const isNearBottom = Math.abs(element.scrollHeight - element.clientHeight - currentScrollY) < 5;
-                    let newDirection = lastDirection;
-                    // Si estamos cerca del final y el delta es muy pequeño, mantener la dirección actual
-                    if (isNearBottom && Math.abs(delta) < 2) {
-                        // Mantener la dirección actual, no cambiar
-                    }
-                    else if (delta > 4 && currentScrollY > 10) {
-                        newDirection = "down";
-                    }
-                    else if (delta < -4 && currentScrollY > 0) {
-                        newDirection = "up";
-                    }
-                    else if (Math.abs(delta) < 2) {
-                        // Cambios muy pequeños, mantener la dirección actual
-                        newDirection = lastDirection;
-                    }
-                    setScrollY(currentScrollY);
-                    // Solo actualizar la dirección si cambió realmente
-                    if (newDirection !== lastDirection) {
-                        setScrollDirection(newDirection);
-                        lastDirection = newDirection;
-                    }
-                    lastScrollY = currentScrollY;
-                });
-            }
-        };
-        // Agregar el listener al elemento
-        element.addEventListener("scroll", handleScroll, { passive: true });
-        return () => {
-            if (rafId !== null) {
-                cancelAnimationFrame(rafId);
-            }
-            element.removeEventListener("scroll", handleScroll);
-        };
-    }, [elementRef]);
-    return { scrollY, scrollDirection };
-};

package/dist/hooks/useEnum.js

@@ -1,21 +0,0 @@
-export const useEnum = (baseEnum) => {
-    const buildArray = () => {
-        return Object.keys(baseEnum)
-            .filter((t) => isNaN(+t))
-            .map((t) => ({
-            name: t.split("_").join(" "),
-            value: baseEnum[t],
-        }));
-    };
-    const array = buildArray();
-    const getArray = () => {
-        return array;
-    };
-    const getInstance = (id) => {
-        return array.find((i) => i.value === id);
-    };
-    return {
-        getArray,
-        getInstance,
-    };
-};

package/dist/hooks/useGlobalThemeStyles.js

@@ -1,40 +0,0 @@
-import { useEffect } from "react";
-import { useTheme } from "../contexts/ThemeContext";
-/**
- * Hook que aplica estilos globales del tema al body y html
- * Útil para aplicaciones host que quieren que el tema afecte toda la página
- */
-export const useGlobalThemeStyles = () => {
-    const { theme } = useTheme();
-    useEffect(() => {
-        const body = document.body;
-        const html = document.documentElement;
-        if (body) {
-            // Aplicar estilos al body
-            body.style.backgroundColor = theme.colors.bgDefault;
-            body.style.color = theme.colors.textPrimary;
-            body.style.fontFamily = theme.fonts.default;
-            body.style.margin = "0";
-            body.style.padding = "0";
-        }
-        if (html) {
-            // Aplicar estilos al html
-            html.style.backgroundColor = theme.colors.bgDefault;
-            html.style.color = theme.colors.textPrimary;
-        }
-        // Cleanup function para restaurar estilos originales
-        return () => {
-            if (body) {
-                body.style.backgroundColor = "";
-                body.style.color = "";
-                body.style.fontFamily = "";
-                body.style.margin = "";
-                body.style.padding = "";
-            }
-            if (html) {
-                html.style.backgroundColor = "";
-                html.style.color = "";
-            }
-        };
-    }, [theme]);
-};

package/dist/hooks/useThemeOverride.js

@@ -1,99 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-/**
- * Hook para aplicar overrides directos a variables CSS del tema
- * Permite personalización granular sin cambiar el tema completo
- */
-export const useThemeOverride = (options = {}) => {
-    const { scope = "global", element = null, prefix = "flysoft" } = options;
-    const appliedOverrides = useRef(new Set());
-    // Función para aplicar override
-    const applyOverride = useCallback((overrides) => {
-        const targetElement = scope === "global" ? document.documentElement : element;
-        if (!targetElement) {
-            console.warn("useThemeOverride: No target element available");
-            return;
-        }
-        Object.entries(overrides).forEach(([key, value]) => {
-            const cssVarName = `--${prefix}-${key
-                .replace(/([A-Z])/g, "-$1")
-                .toLowerCase()}`;
-            // Aplicar el override
-            targetElement.style.setProperty(cssVarName, String(value));
-            // Registrar para poder revertir después
-            appliedOverrides.current.add(cssVarName);
-        });
-    }, [scope, element, prefix]);
-    // Función para revertir overrides específicos
-    const revertOverride = useCallback((keys) => {
-        const targetElement = scope === "global" ? document.documentElement : element;
-        if (!targetElement)
-            return;
-        keys.forEach((key) => {
-            const cssVarName = `--${prefix}-${key
-                .replace(/([A-Z])/g, "-$1")
-                .toLowerCase()}`;
-            if (appliedOverrides.current.has(cssVarName)) {
-                targetElement.style.removeProperty(cssVarName);
-                appliedOverrides.current.delete(cssVarName);
-            }
-        });
-    }, [scope, element, prefix]);
-    // Función para revertir todos los overrides aplicados
-    const revertAllOverrides = useCallback(() => {
-        const targetElement = scope === "global" ? document.documentElement : element;
-        if (!targetElement)
-            return;
-        appliedOverrides.current.forEach((cssVarName) => {
-            targetElement.style.removeProperty(cssVarName);
-        });
-        appliedOverrides.current.clear();
-    }, [scope, element]);
-    // Función para obtener el valor actual de una variable CSS
-    const getCSSVariable = useCallback((key) => {
-        const targetElement = scope === "global" ? document.documentElement : element;
-        if (!targetElement)
-            return null;
-        const cssVarName = `--${prefix}-${key
-            .replace(/([A-Z])/g, "-$1")
-            .toLowerCase()}`;
-        return (getComputedStyle(targetElement).getPropertyValue(cssVarName) || null);
-    }, [scope, element, prefix]);
-    // Función para verificar si un override está aplicado
-    const isOverrideApplied = useCallback((key) => {
-        const cssVarName = `--${prefix}-${key
-            .replace(/([A-Z])/g, "-$1")
-            .toLowerCase()}`;
-        return appliedOverrides.current.has(cssVarName);
-    }, [prefix]);
-    // Cleanup al desmontar
-    useEffect(() => {
-        return () => {
-            revertAllOverrides();
-        };
-    }, [revertAllOverrides]);
-    return {
-        applyOverride,
-        revertOverride,
-        revertAllOverrides,
-        getCSSVariable,
-        isOverrideApplied,
-        appliedOverridesCount: appliedOverrides.current.size,
-    };
-};
-/**
- * Hook para aplicar overrides temporales que se revierten automáticamente
- */
-export const useTemporaryOverride = (overrides, duration = 3000, options = {}) => {
-    const { applyOverride, revertOverride } = useThemeOverride(options);
-    const applyTemporaryOverride = useCallback(() => {
-        applyOverride(overrides);
-        const timeoutId = setTimeout(() => {
-            revertOverride(Object.keys(overrides));
-        }, duration);
-        return () => {
-            clearTimeout(timeoutId);
-            revertOverride(Object.keys(overrides));
-        };
-    }, [applyOverride, revertOverride, overrides, duration]);
-    return { applyTemporaryOverride };
-};

package/dist/interfaces/index.js

@@ -1 +0,0 @@
-export {};

package/dist/interfaces/name-value.interface.js

@@ -1 +0,0 @@
-export {};

package/dist/interfaces/pagination.interface.js

@@ -1 +0,0 @@
-export {};

package/dist/main.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=main.d.ts.map

package/dist/main.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"main.d.ts","sourceRoot":"","sources":["../src/main.tsx"],"names":[],"mappings":""}

package/dist/main.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { StrictMode } from "react";
-import { createRoot } from "react-dom/client";
-import { BrowserRouter } from "react-router-dom";
-import App from "./App";
-createRoot(document.getElementById("root")).render(_jsx(StrictMode, { children: _jsx(BrowserRouter, { future: { v7_startTransition: true, v7_relativeSplatPath: true }, children: _jsx(App, {}) }) }));

package/dist/services/apiClient.js

@@ -1,216 +0,0 @@
-import axios, {} from "axios";
-class ApiClientService {
-    instance;
-    tokenProvider;
-    constructor(config) {
-        this.instance = axios.create({
-            baseURL: config?.baseURL ?? "",
-            timeout: config?.timeout ?? 15000,
-            headers: {
-                "Content-Type": "application/json",
-                ...config?.headers,
-            },
-        });
-        this.setupInterceptors();
-    }
-    setupInterceptors() {
-        // Request interceptor para inyectar el token automáticamente
-        this.instance.interceptors.request.use((config) => {
-            const token = this.tokenProvider?.();
-            if (token && config.headers) {
-                // Manejo compatible con diferentes versiones de axios
-                if ("set" in config.headers &&
-                    typeof config.headers.set === "function") {
-                    config.headers.set("Authorization", `Bearer ${token}`);
-                }
-                else {
-                    const headers = config.headers;
-                    headers.Authorization = `Bearer ${token}`;
-                }
-            }
-            return config;
-        }, (error) => {
-            return Promise.reject(error);
-        });
-        // Response interceptor para manejo de errores (opcional, puede extenderse)
-        this.instance.interceptors.response.use((response) => response, (error) => {
-            return Promise.reject(error);
-        });
-    }
-    /**
-     * Establece el proveedor de token que se usará en todas las peticiones
-     * @param provider Función que retorna el token de autorización
-     */
-    setTokenProvider(provider) {
-        this.tokenProvider = provider;
-    }
-    /**
-     * Limpia el proveedor de token
-     */
-    clearTokenProvider() {
-        this.tokenProvider = undefined;
-    }
-    /**
-     * Actualiza la configuración por defecto del cliente
-     */
-    updateDefaults(config) {
-        if (config.baseURL) {
-            this.instance.defaults.baseURL = config.baseURL;
-        }
-        if (config.timeout) {
-            this.instance.defaults.timeout = config.timeout;
-        }
-        if (config.headers) {
-            // Actualizar headers comunes de forma segura
-            Object.assign(this.instance.defaults.headers.common || {}, config.headers);
-        }
-    }
-    async axiosRequest({ method, url, headers, body, params, }) {
-        return await this.instance({
-            method,
-            headers,
-            url,
-            data: body,
-            params,
-        });
-    }
-    /**
-     * Realiza una petición GET
-     */
-    async get(options) {
-        const { url, params, headers } = options;
-        const response = await this.axiosRequest({
-            method: "GET",
-            url,
-            params,
-            headers,
-        });
-        return response.data;
-    }
-    /**
-     * Realiza una petición POST
-     */
-    async post(options) {
-        const { url, body, headers } = options;
-        const response = await this.axiosRequest({
-            method: "POST",
-            url,
-            headers,
-            body,
-        });
-        return response.data;
-    }
-    /**
-     * Realiza una petición PUT
-     */
-    async put(options) {
-        const { url, body, headers } = options;
-        const response = await this.axiosRequest({
-            method: "PUT",
-            url,
-            headers,
-            body,
-        });
-        return response.data;
-    }
-    /**
-     * Realiza una petición DELETE
-     */
-    async del(options) {
-        const { url, headers } = options;
-        const response = await this.axiosRequest({
-            method: "DELETE",
-            url,
-            headers,
-        });
-        return response.data;
-    }
-    /**
-     * Obtiene un archivo como Blob
-     */
-    async getFile(options) {
-        const { url, headers = {} } = options;
-        const response = await this.instance.get(url, {
-            responseType: "blob",
-            headers,
-        });
-        return {
-            data: response.data,
-            headers: response.headers,
-        };
-    }
-    /**
-     * Obtiene un archivo y retorna su URL como objeto
-     */
-    async getFileAsUrl(options) {
-        const { data } = await this.getFile(options);
-        const blob = new Blob([data], { type: data.type });
-        return URL.createObjectURL(blob);
-    }
-    /**
-     * Abre un archivo en una nueva ventana
-     */
-    async openFile(options) {
-        const { data } = await this.getFile(options);
-        const urlData = URL.createObjectURL(data);
-        window.open(urlData);
-    }
-    /**
-     * Descarga un archivo
-     */
-    async downloadFile(options) {
-        const { data, headers: dataHeaders } = await this.getFile(options);
-        const contentDisposition = dataHeaders["content-disposition"] || dataHeaders["Content-Disposition"];
-        const fileName = contentDisposition
-            ?.split("filename=")[1]
-            ?.split(";")[0]
-            .replaceAll('"', "");
-        const blob = new Blob([data], { type: data.type });
-        const link = document.createElement("a");
-        link.href = window.URL.createObjectURL(blob);
-        link.setAttribute("download", fileName || "");
-        document.body.appendChild(link);
-        link.click();
-        link.parentNode?.removeChild(link);
-    }
-    /**
-     * Sube uno o más archivos usando FormData
-     */
-    async uploadFile(options) {
-        const { url, files, headers } = options;
-        const formData = new FormData();
-        const { paramName = "file", ...newHeaders } = headers || {};
-        const fileArray = Array.from(files);
-        for (const file of fileArray) {
-            formData.append(paramName, file, file.name);
-        }
-        const response = await this.instance.post(url, formData, {
-            headers: newHeaders,
-        });
-        return response.data;
-    }
-}
-// Instancia compartida del cliente
-const sharedClient = new ApiClientService();
-/**
- * Cliente de API compartido con todas las funciones de HTTP
- */
-export const apiClient = sharedClient;
-/**
- * Crea una nueva instancia del cliente de API
- */
-export const createApiClient = (config) => {
-    return new ApiClientService(config);
-};
-/**
- * Establece el proveedor de token global para el cliente compartido
- */
-export const setApiClientTokenProvider = (provider) => {
-    sharedClient.setTokenProvider(provider);
-};
-/**
- * Limpia el proveedor de token global
- */
-export const clearApiClientTokenProvider = () => {
-    sharedClient.clearTokenProvider();
-};

package/dist/services/index.js

@@ -1 +0,0 @@
-export { apiClient, createApiClient, setApiClientTokenProvider, clearApiClientTokenProvider, } from "./apiClient";

package/dist/styles.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=styles.d.ts.map

package/dist/styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":""}

package/dist/styles.js

@@ -1,3 +0,0 @@
-export {};
-// This file is used to import styles in the library
-// The actual CSS file is available via the package exports

package/dist/templates/forms/ContactForm.js

@@ -1,58 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState } from "react";
-import { Button, Input, Card } from "../../index";
-export const ContactForm = ({ onSubmit, loading = false, success = false, error, className = "", }) => {
-    const [formData, setFormData] = useState({
-        name: "",
-        email: "",
-        subject: "",
-        message: "",
-    });
-    const [errors, setErrors] = useState({});
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        // Validación
-        const newErrors = {};
-        if (!formData.name.trim()) {
-            newErrors.name = "El nombre es requerido";
-        }
-        if (!formData.email) {
-            newErrors.email = "El email es requerido";
-        }
-        else if (!/\S+@\S+\.\S+/.test(formData.email)) {
-            newErrors.email = "El email no es válido";
-        }
-        if (!formData.subject.trim()) {
-            newErrors.subject = "El asunto es requerido";
-        }
-        if (!formData.message.trim()) {
-            newErrors.message = "El mensaje es requerido";
-        }
-        else if (formData.message.trim().length < 10) {
-            newErrors.message = "El mensaje debe tener al menos 10 caracteres";
-        }
-        setErrors(newErrors);
-        if (Object.keys(newErrors).length === 0) {
-            onSubmit?.(formData);
-        }
-    };
-    const handleChange = (field) => (e) => {
-        setFormData((prev) => ({ ...prev, [field]: e.target.value }));
-        // Limpiar error cuando el usuario empiece a escribir
-        if (errors[field]) {
-            setErrors((prev) => ({ ...prev, [field]: undefined }));
-        }
-    };
-    if (success) {
-        return (_jsx(Card, { title: "Mensaje Enviado", subtitle: "Gracias por contactarnos", className: className, children: _jsxs("div", { className: "text-center py-8", children: [_jsx("div", { className: "w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4", children: _jsx("i", { className: "fal fa-check text-green-600 text-2xl" }) }), _jsx("h3", { className: "text-lg font-semibold text-gray-900 mb-2", children: "\u00A1Mensaje enviado con \u00E9xito!" }), _jsx("p", { className: "text-gray-600 mb-4", children: "Hemos recibido tu mensaje y te responderemos pronto." }), _jsx(Button, { variant: "outline", onClick: () => window.location.reload(), icon: "fa-refresh", children: "Enviar otro mensaje" })] }) }));
-    }
-    return (_jsx(Card, { title: "Cont\u00E1ctanos", subtitle: "Env\u00EDanos un mensaje y te responderemos pronto", className: className, children: _jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [error && (_jsx("div", { className: "p-3 bg-red-50 border border-red-200 rounded-lg", children: _jsxs("p", { className: "text-sm text-red-600", children: [_jsx("i", { className: "fal fa-exclamation-triangle mr-2" }), error] }) })), _jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [_jsx(Input, { label: "Nombre Completo", placeholder: "Tu nombre completo", icon: "fa-user", value: formData.name, onChange: handleChange("name"), error: errors.name, disabled: loading }), _jsx(Input, { label: "Email", type: "email", placeholder: "tu@email.com", icon: "fa-envelope", value: formData.email, onChange: handleChange("email"), error: errors.email, disabled: loading })] }), _jsx(Input, { label: "Asunto", placeholder: "\u00BFEn qu\u00E9 podemos ayudarte?", icon: "fa-tag", value: formData.subject, onChange: handleChange("subject"), error: errors.subject, disabled: loading }), _jsxs("div", { className: "w-full", children: [_jsx("label", { className: "block text-sm font-medium text-[var(--color-text-primary)] mb-1 font-[var(--font-default)]", children: "Mensaje" }), _jsxs("div", { className: "relative", children: [_jsx("i", { className: "fal fa-comment text-[var(--color-text-muted)] absolute top-3 left-3 w-5 h-5" }), _jsx("textarea", { placeholder: "Escribe tu mensaje aqu\u00ED...", className: `
-                w-full border rounded-lg transition-colors focus:outline-none focus:ring-2 
-                disabled:opacity-50 disabled:cursor-not-allowed
-                font-[var(--font-default)] text-[var(--color-text-primary)]
-                bg-[var(--color-bg-default)] pl-10 pr-4 py-3 text-base
-                ${errors.message
-                                        ? "border-[var(--color-border-error)] focus:border-[var(--color-border-error)] focus:ring-[var(--color-border-error)]"
-                                        : "border-[var(--color-border-default)] focus:border-[var(--color-border-focus)] focus:ring-[var(--color-border-focus)]"}
-              `, rows: 5, value: formData.message, onChange: handleChange("message"), disabled: loading })] }), errors.message && (_jsx("p", { className: "mt-1 text-sm text-[var(--color-danger)] font-[var(--font-default)]", children: errors.message }))] }), _jsx(Button, { type: "submit", variant: "primary", size: "lg", icon: "fa-paper-plane", loading: loading, className: "w-full", children: "Enviar Mensaje" })] }) }));
-};

package/dist/templates/forms/LoginForm.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState } from "react";
-import { Button, Input, Card } from "../../index";
-export const LoginForm = ({ onSubmit, loading = false, error, className = "", }) => {
-    const [formData, setFormData] = useState({
-        email: "",
-        password: "",
-    });
-    const [errors, setErrors] = useState({});
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        // Validación básica
-        const newErrors = {};
-        if (!formData.email) {
-            newErrors.email = "El email es requerido";
-        }
-        else if (!/\S+@\S+\.\S+/.test(formData.email)) {
-            newErrors.email = "El email no es válido";
-        }
-        if (!formData.password) {
-            newErrors.password = "La contraseña es requerida";
-        }
-        setErrors(newErrors);
-        if (Object.keys(newErrors).length === 0) {
-            onSubmit?.(formData);
-        }
-    };
-    const handleChange = (field) => (e) => {
-        setFormData((prev) => ({ ...prev, [field]: e.target.value }));
-        // Limpiar error cuando el usuario empiece a escribir
-        if (errors[field]) {
-            setErrors((prev) => ({ ...prev, [field]: undefined }));
-        }
-    };
-    return (_jsxs(Card, { title: "Iniciar Sesi\u00F3n", subtitle: "Ingresa tus credenciales para acceder", className: className, children: [_jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [error && (_jsx("div", { className: "p-3 bg-red-50 border border-red-200 rounded-lg", children: _jsxs("p", { className: "text-sm text-red-600", children: [_jsx("i", { className: "fal fa-exclamation-triangle mr-2" }), error] }) })), _jsx(Input, { label: "Email", type: "email", placeholder: "tu@email.com", icon: "fa-envelope", value: formData.email, onChange: handleChange("email"), error: errors.email, disabled: loading }), _jsx(Input, { label: "Contrase\u00F1a", type: "password", placeholder: "Tu contrase\u00F1a", icon: "fa-lock", value: formData.password, onChange: handleChange("password"), error: errors.password, disabled: loading }), _jsx(Button, { type: "submit", variant: "primary", size: "lg", icon: "fa-sign-in-alt", loading: loading, className: "w-full", children: "Iniciar Sesi\u00F3n" })] }), _jsx("div", { className: "mt-4 text-center", children: _jsxs("p", { className: "text-sm text-gray-600", children: ["\u00BFNo tienes cuenta?", " ", _jsx("a", { href: "#", className: "text-blue-600 hover:text-blue-800 font-medium", children: "Reg\u00EDstrate aqu\u00ED" })] }) })] }));
-};

package/dist/templates/forms/RegistrationForm.js

@@ -1,54 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState } from "react";
-import { Button, Input, Card } from "../../index";
-export const RegistrationForm = ({ onSubmit, loading = false, error, className = "", }) => {
-    const [formData, setFormData] = useState({
-        firstName: "",
-        lastName: "",
-        email: "",
-        password: "",
-        confirmPassword: "",
-    });
-    const [errors, setErrors] = useState({});
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        // Validación
-        const newErrors = {};
-        if (!formData.firstName.trim()) {
-            newErrors.firstName = "El nombre es requerido";
-        }
-        if (!formData.lastName.trim()) {
-            newErrors.lastName = "El apellido es requerido";
-        }
-        if (!formData.email) {
-            newErrors.email = "El email es requerido";
-        }
-        else if (!/\S+@\S+\.\S+/.test(formData.email)) {
-            newErrors.email = "El email no es válido";
-        }
-        if (!formData.password) {
-            newErrors.password = "La contraseña es requerida";
-        }
-        else if (formData.password.length < 6) {
-            newErrors.password = "La contraseña debe tener al menos 6 caracteres";
-        }
-        if (!formData.confirmPassword) {
-            newErrors.confirmPassword = "Confirma tu contraseña";
-        }
-        else if (formData.password !== formData.confirmPassword) {
-            newErrors.confirmPassword = "Las contraseñas no coinciden";
-        }
-        setErrors(newErrors);
-        if (Object.keys(newErrors).length === 0) {
-            onSubmit?.(formData);
-        }
-    };
-    const handleChange = (field) => (e) => {
-        setFormData((prev) => ({ ...prev, [field]: e.target.value }));
-        // Limpiar error cuando el usuario empiece a escribir
-        if (errors[field]) {
-            setErrors((prev) => ({ ...prev, [field]: undefined }));
-        }
-    };
-    return (_jsxs(Card, { title: "Crear Cuenta", subtitle: "Completa los datos para registrarte", className: className, children: [_jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [error && (_jsx("div", { className: "p-3 bg-red-50 border border-red-200 rounded-lg", children: _jsxs("p", { className: "text-sm text-red-600", children: [_jsx("i", { className: "fal fa-exclamation-triangle mr-2" }), error] }) })), _jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [_jsx(Input, { label: "Nombre", placeholder: "Tu nombre", icon: "fa-user", value: formData.firstName, onChange: handleChange("firstName"), error: errors.firstName, disabled: loading }), _jsx(Input, { label: "Apellido", placeholder: "Tu apellido", icon: "fa-user", value: formData.lastName, onChange: handleChange("lastName"), error: errors.lastName, disabled: loading })] }), _jsx(Input, { label: "Email", type: "email", placeholder: "tu@email.com", icon: "fa-envelope", value: formData.email, onChange: handleChange("email"), error: errors.email, disabled: loading }), _jsx(Input, { label: "Contrase\u00F1a", type: "password", placeholder: "M\u00EDnimo 6 caracteres", icon: "fa-lock", value: formData.password, onChange: handleChange("password"), error: errors.password, disabled: loading }), _jsx(Input, { label: "Confirmar Contrase\u00F1a", type: "password", placeholder: "Repite tu contrase\u00F1a", icon: "fa-lock", value: formData.confirmPassword, onChange: handleChange("confirmPassword"), error: errors.confirmPassword, disabled: loading }), _jsx(Button, { type: "submit", variant: "primary", size: "lg", icon: "fa-user-plus", loading: loading, className: "w-full", children: "Crear Cuenta" })] }), _jsx("div", { className: "mt-4 text-center", children: _jsxs("p", { className: "text-sm text-gray-600", children: ["\u00BFYa tienes cuenta?", " ", _jsx("a", { href: "#", className: "text-blue-600 hover:text-blue-800 font-medium", children: "Inicia sesi\u00F3n aqu\u00ED" })] }) })] }));
-};

package/dist/templates/layouts/DashboardLayout.js

@@ -1,26 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
-import { Card } from "../../index";
-export const DashboardLayout = ({ title, subtitle, stats = [], actions, children, className = "", }) => {
-    const getChangeColor = (changeType) => {
-        switch (changeType) {
-            case "positive":
-                return "text-green-600";
-            case "negative":
-                return "text-red-600";
-            default:
-                return "text-gray-600";
-        }
-    };
-    const getChangeIcon = (changeType) => {
-        switch (changeType) {
-            case "positive":
-                return "fa-arrow-up";
-            case "negative":
-                return "fa-arrow-down";
-            default:
-                return "fa-minus";
-        }
-    };
-    return (_jsxs("div", { className: `min-h-screen bg-gray-50 ${className}`, children: [_jsx("div", { className: "bg-white shadow-sm border-b", children: _jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8", children: _jsxs("div", { className: "flex justify-between items-center py-6", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-bold text-gray-900", children: title }), subtitle && (_jsx("p", { className: "mt-1 text-sm text-gray-600", children: subtitle }))] }), actions && (_jsx("div", { className: "flex items-center space-x-3", children: actions }))] }) }) }), stats.length > 0 && (_jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6", children: _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6", children: stats.map((stat, index) => (_jsx(Card, { variant: "elevated", className: "p-6", children: _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex-shrink-0", children: stat.icon && (_jsx("div", { className: "w-8 h-8 bg-blue-100 rounded-lg flex items-center justify-center", children: _jsx("i", { className: `fa ${stat.icon} text-blue-600` }) })) }), _jsxs("div", { className: "ml-4 flex-1", children: [_jsx("p", { className: "text-sm font-medium text-gray-600", children: stat.title }), _jsx("p", { className: "text-2xl font-semibold text-gray-900", children: stat.value }), stat.change && (_jsxs("div", { className: "flex items-center mt-1", children: [_jsx("i", { className: `fa ${getChangeIcon(stat.changeType)} text-xs mr-1 ${getChangeColor(stat.changeType)}` }), _jsx("span", { className: `text-sm ${getChangeColor(stat.changeType)}`, children: stat.change })] }))] })] }) }, index))) }) })), _jsx("div", { className: "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6", children: children })] }));
-};