flysoft-react-ui 1.2.4 → 1.2.5

package/dist/templates/layouts/SidebarLayout.js

@@ -1,28 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState } from "react";
-import { Button, Badge } from "../../index";
-import { normalizeIconClass } from "../../components/utils/iconUtils";
-export const SidebarLayout = ({ title, menuItems, user, children, className = "", onLogout, }) => {
-    const [sidebarOpen, setSidebarOpen] = useState(false);
-    const [activeItem, setActiveItem] = useState(menuItems[0]?.href || "");
-    const toggleSidebar = () => {
-        setSidebarOpen(!sidebarOpen);
-    };
-    const handleMenuClick = (href) => {
-        setActiveItem(href);
-        setSidebarOpen(false); // Cerrar sidebar en móvil
-    };
-    return (_jsxs("div", { className: `min-h-screen bg-gray-50 ${className}`, children: [sidebarOpen && (_jsx("div", { className: "fixed inset-0 z-40 bg-gray-600 bg-opacity-75 lg:hidden", onClick: () => setSidebarOpen(false) })), _jsxs("div", { className: `
-        fixed inset-y-0 left-0 z-50 w-64 bg-white shadow-lg transform transition-transform duration-300 ease-in-out
-        ${sidebarOpen ? "translate-x-0" : "-translate-x-full"}
-        lg:translate-x-0 lg:static lg:inset-0
-      `, children: [_jsxs("div", { className: "flex items-center justify-between h-16 px-6 border-b", children: [_jsx("h1", { className: "text-xl font-bold text-gray-900", children: title }), _jsx("button", { onClick: toggleSidebar, className: "lg:hidden p-2 rounded-md text-gray-400 hover:text-gray-600", children: _jsx("i", { className: "fal fa-times" }) })] }), _jsx("nav", { className: "mt-6 px-3", children: _jsx("div", { className: "space-y-1", children: menuItems.map((item) => (_jsxs("a", { href: item.href, onClick: (e) => {
-                                    e.preventDefault();
-                                    handleMenuClick(item.href);
-                                }, className: `
-                  group flex items-center px-3 py-2 text-sm font-medium rounded-md transition-colors
-                  ${activeItem === item.href
-                                    ? "bg-blue-100 text-blue-700"
-                                    : "text-gray-600 hover:bg-gray-50 hover:text-gray-900"}
-                `, children: [_jsx("i", { className: `${normalizeIconClass(item.icon)} mr-3 flex-shrink-0` }), _jsx("span", { className: "flex-1", children: item.label }), item.badge && (_jsx(Badge, { variant: "primary", size: "sm", className: "ml-2", children: item.badge }))] }, item.href))) }) }), _jsx("div", { className: "absolute bottom-0 left-0 right-0 p-4 border-t", children: _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx("div", { className: "w-8 h-8 bg-gray-300 rounded-full flex items-center justify-center", children: _jsx("i", { className: `${normalizeIconClass(user.avatar || "fa-user")} text-gray-600` }) }) }), _jsxs("div", { className: "ml-3 flex-1", children: [_jsx("p", { className: "text-sm font-medium text-gray-900", children: user.name }), user.email && (_jsx("p", { className: "text-xs text-gray-500", children: user.email }))] }), onLogout && (_jsx("button", { onClick: onLogout, className: "ml-2 p-1 text-gray-400 hover:text-gray-600", title: "Cerrar sesi\u00F3n", children: _jsx("i", { className: "fal fa-sign-out-alt" }) }))] }) })] }), _jsxs("div", { className: "lg:pl-64", children: [_jsx("div", { className: "sticky top-0 z-10 bg-white shadow-sm border-b", children: _jsxs("div", { className: "flex items-center justify-between h-16 px-4 sm:px-6 lg:px-8", children: [_jsx("button", { onClick: toggleSidebar, className: "lg:hidden p-2 rounded-md text-gray-400 hover:text-gray-600", children: _jsx("i", { className: "fal fa-bars" }) }), _jsxs("div", { className: "flex items-center space-x-4", children: [_jsx(Button, { variant: "ghost", size: "sm", icon: "fa-bell", children: "Notificaciones" }), _jsx(Button, { variant: "ghost", size: "sm", icon: "fa-cog", children: "Configuraci\u00F3n" })] })] }) }), _jsx("main", { className: "p-4 sm:p-6 lg:p-8", children: children })] })] }));
-};

package/dist/templates/patterns/FormPattern.js

@@ -1,68 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState } from "react";
-import { Button, Input, Card } from "../../index";
-import { normalizeIconClass } from "../../components/utils/iconUtils";
-export const FormPattern = ({ title, subtitle, fields, onSubmit, submitText = "Enviar", submitIcon = "fa-paper-plane", loading = false, error, success = false, className = "", gridCols = 1, }) => {
-    const [formData, setFormData] = useState(fields.reduce((acc, field) => ({ ...acc, [field.name]: "" }), {}));
-    const [errors, setErrors] = useState({});
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        // Validación
-        const newErrors = {};
-        fields.forEach((field) => {
-            const value = formData[field.name] || "";
-            if (field.required && !value.trim()) {
-                newErrors[field.name] = `${field.label} es requerido`;
-            }
-            else if (field.validation) {
-                const validationError = field.validation(value);
-                if (validationError) {
-                    newErrors[field.name] = validationError;
-                }
-            }
-        });
-        setErrors(newErrors);
-        if (Object.keys(newErrors).length === 0) {
-            onSubmit(formData);
-        }
-    };
-    const handleChange = (fieldName) => (e) => {
-        setFormData((prev) => ({ ...prev, [fieldName]: e.target.value }));
-        // Limpiar error cuando el usuario empiece a escribir
-        if (errors[fieldName]) {
-            setErrors((prev) => {
-                const newErrors = { ...prev };
-                delete newErrors[fieldName];
-                return newErrors;
-            });
-        }
-    };
-    const renderField = (field) => {
-        const commonProps = {
-            label: field.label,
-            placeholder: field.placeholder,
-            icon: field.icon,
-            value: formData[field.name] || "",
-            onChange: handleChange(field.name),
-            error: errors[field.name],
-            disabled: loading,
-        };
-        if (field.multiline) {
-            return (_jsxs("div", { className: "w-full", children: [_jsxs("label", { className: "block text-sm font-medium text-[var(--color-text-primary)] mb-1 font-[var(--font-default)]", children: [field.label, field.required && _jsx("span", { className: "text-red-500 ml-1", children: "*" })] }), _jsxs("div", { className: "relative", children: [field.icon && (_jsx("i", { className: `${normalizeIconClass(field.icon)} text-[var(--color-text-muted)] absolute top-3 left-3 w-5 h-5` })), _jsx("textarea", { placeholder: field.placeholder, 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)] px-4 py-3 text-base
-                ${field.icon ? "pl-10" : "pl-4"}
-                ${errors[field.name]
-                                    ? "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: field.rows || 4, value: formData[field.name] || "", onChange: handleChange(field.name), disabled: loading })] }), errors[field.name] && (_jsx("p", { className: "mt-1 text-sm text-[var(--color-danger)] font-[var(--font-default)]", children: errors[field.name] }))] }, field.name));
-        }
-        return (_jsx(Input, { type: field.type || "text", ...commonProps }, field.name));
-    };
-    if (success) {
-        return (_jsx(Card, { title: "\u00A1\u00C9xito!", subtitle: "La operaci\u00F3n se complet\u00F3 correctamente", 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: "\u00A1Operaci\u00F3n exitosa!" }), _jsx("p", { className: "text-gray-600 mb-4", children: "Los datos se han procesado correctamente." }), _jsx(Button, { variant: "outline", onClick: () => window.location.reload(), icon: "fa-refresh", children: "Continuar" })] }) }));
-    }
-    return (_jsx(Card, { title: title, subtitle: subtitle, 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("div", { className: `grid grid-cols-1 ${gridCols === 2 ? "md:grid-cols-2" : ""} gap-4`, children: fields.map(renderField) }), _jsx(Button, { type: "submit", variant: "primary", size: "lg", icon: submitIcon, loading: loading, className: "w-full", children: submitText })] }) }));
-};