flysoft-react-ui 0.5.2 → 0.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (101) hide show
  1. package/dist/App.d.ts.map +1 -1
  2. package/dist/App.js +5 -6
  3. package/dist/components/form-controls/AutocompleteInput.d.ts.map +1 -1
  4. package/dist/components/form-controls/AutocompleteInput.js +2 -1
  5. package/dist/components/form-controls/Button.d.ts +3 -0
  6. package/dist/components/form-controls/Button.d.ts.map +1 -1
  7. package/dist/components/form-controls/Button.js +160 -19
  8. package/dist/components/form-controls/Checkbox.d.ts.map +1 -1
  9. package/dist/components/form-controls/Checkbox.js +3 -1
  10. package/dist/components/form-controls/DateInput.d.ts +5 -1
  11. package/dist/components/form-controls/DateInput.d.ts.map +1 -1
  12. package/dist/components/form-controls/DateInput.js +94 -27
  13. package/dist/components/form-controls/Input.d.ts.map +1 -1
  14. package/dist/components/form-controls/Input.js +2 -1
  15. package/dist/components/form-controls/LinkButton.d.ts +15 -0
  16. package/dist/components/form-controls/LinkButton.d.ts.map +1 -0
  17. package/dist/components/form-controls/LinkButton.js +248 -0
  18. package/dist/components/form-controls/SearchSelectInput-OLD.d.ts.map +1 -1
  19. package/dist/components/form-controls/SearchSelectInput-OLD.js +3 -2
  20. package/dist/components/form-controls/SearchSelectInput.d.ts.map +1 -1
  21. package/dist/components/form-controls/SearchSelectInput.js +2 -1
  22. package/dist/components/form-controls/index.d.ts +2 -0
  23. package/dist/components/form-controls/index.d.ts.map +1 -1
  24. package/dist/components/form-controls/index.js +1 -0
  25. package/dist/components/layout/Accordion.d.ts +13 -0
  26. package/dist/components/layout/Accordion.d.ts.map +1 -0
  27. package/dist/components/layout/Accordion.js +67 -0
  28. package/dist/components/layout/AppLayout.js +1 -1
  29. package/dist/components/layout/Card.d.ts +8 -3
  30. package/dist/components/layout/Card.d.ts.map +1 -1
  31. package/dist/components/layout/Card.js +18 -19
  32. package/dist/components/layout/index.d.ts +2 -0
  33. package/dist/components/layout/index.d.ts.map +1 -1
  34. package/dist/components/layout/index.js +1 -0
  35. package/dist/components/utils/Badge.d.ts.map +1 -1
  36. package/dist/components/utils/Badge.js +3 -2
  37. package/dist/components/utils/Dialog.d.ts.map +1 -1
  38. package/dist/components/utils/Dialog.js +2 -1
  39. package/dist/components/utils/Filter.d.ts.map +1 -1
  40. package/dist/components/utils/Filter.js +2 -1
  41. package/dist/components/utils/Loader.js +1 -1
  42. package/dist/components/utils/RoadMap.d.ts.map +1 -1
  43. package/dist/components/utils/RoadMap.js +2 -1
  44. package/dist/components/utils/Snackbar.d.ts.map +1 -1
  45. package/dist/components/utils/Snackbar.js +2 -1
  46. package/dist/components/utils/iconUtils.d.ts +16 -0
  47. package/dist/components/utils/iconUtils.d.ts.map +1 -0
  48. package/dist/components/utils/iconUtils.js +40 -0
  49. package/dist/contexts/ListCrudContext.d.ts +28 -7
  50. package/dist/contexts/ListCrudContext.d.ts.map +1 -1
  51. package/dist/contexts/ListCrudContext.js +100 -56
  52. package/dist/docs/AccordionDocs.d.ts +4 -0
  53. package/dist/docs/AccordionDocs.d.ts.map +1 -0
  54. package/dist/docs/AccordionDocs.js +21 -0
  55. package/dist/docs/AuthDocs.tsx/AuthDocsContent.js +3 -5
  56. package/dist/docs/AutocompleteInputDocs.js +1 -1
  57. package/dist/docs/ButtonDocs.d.ts.map +1 -1
  58. package/dist/docs/ButtonDocs.js +1 -1
  59. package/dist/docs/CardDocs.d.ts.map +1 -1
  60. package/dist/docs/CardDocs.js +17 -8
  61. package/dist/docs/DataTableDocs.js +3 -3
  62. package/dist/docs/DialogDocs.js +1 -1
  63. package/dist/docs/DocAdmin.js +1 -1
  64. package/dist/docs/DocsMenu.d.ts.map +1 -1
  65. package/dist/docs/DocsMenu.js +3 -3
  66. package/dist/docs/DocsRouter.d.ts.map +1 -1
  67. package/dist/docs/DocsRouter.js +3 -1
  68. package/dist/docs/DropdownMenuDocs.js +1 -1
  69. package/dist/docs/LinkButtonDocs.d.ts +4 -0
  70. package/dist/docs/LinkButtonDocs.d.ts.map +1 -0
  71. package/dist/docs/LinkButtonDocs.js +7 -0
  72. package/dist/docs/ListCrudDocs.tsx/ListCrudDocs.d.ts +0 -9
  73. package/dist/docs/ListCrudDocs.tsx/ListCrudDocs.d.ts.map +1 -1
  74. package/dist/docs/ListCrudDocs.tsx/ListCrudDocs.js +16 -12
  75. package/dist/docs/ListCrudDocs.tsx/ListCrudDocsContentEmpresas.d.ts +2 -0
  76. package/dist/docs/ListCrudDocs.tsx/ListCrudDocsContentEmpresas.d.ts.map +1 -0
  77. package/dist/docs/ListCrudDocs.tsx/ListCrudDocsContentEmpresas.js +7 -0
  78. package/dist/docs/ListCrudDocs.tsx/ListCrudDocsContentPersonas.d.ts.map +1 -1
  79. package/dist/docs/ListCrudDocs.tsx/ListCrudDocsContentPersonas.js +32 -26
  80. package/dist/docs/ListCrudDocs.tsx/ListCrudDocsEditDialog.d.ts +9 -0
  81. package/dist/docs/ListCrudDocs.tsx/ListCrudDocsEditDialog.d.ts.map +1 -0
  82. package/dist/docs/ListCrudDocs.tsx/ListCrudDocsEditDialog.js +30 -0
  83. package/dist/docs/SearchSelectInputDocs.js +1 -1
  84. package/dist/docs/docMockServices/empresaService.d.ts.map +1 -1
  85. package/dist/docs/docMockServices/empresaService.js +2 -1
  86. package/dist/docs/docMockServices/personaService.d.ts +1 -1
  87. package/dist/docs/docMockServices/personaService.d.ts.map +1 -1
  88. package/dist/docs/docMockServices/personaService.js +3 -2
  89. package/dist/index.css +1 -1
  90. package/dist/index.d.ts +4 -0
  91. package/dist/index.d.ts.map +1 -1
  92. package/dist/index.js +2 -0
  93. package/dist/index.js.map +1 -1
  94. package/dist/templates/forms/ContactForm.js +2 -2
  95. package/dist/templates/forms/LoginForm.js +1 -1
  96. package/dist/templates/forms/RegistrationForm.js +1 -1
  97. package/dist/templates/layouts/SidebarLayout.d.ts.map +1 -1
  98. package/dist/templates/layouts/SidebarLayout.js +3 -2
  99. package/dist/templates/patterns/FormPattern.d.ts.map +1 -1
  100. package/dist/templates/patterns/FormPattern.js +4 -3
  101. package/package.json +1 -1
@@ -44,9 +44,9 @@ export const ContactForm = ({ onSubmit, loading = false, success = false, error,
44
44
  }
45
45
  };
46
46
  if (success) {
47
- 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: "fa 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" })] }) }));
47
+ 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" })] }) }));
48
48
  }
49
- 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: "fa 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: "fa 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: `
49
+ 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: `
50
50
  w-full border rounded-lg transition-colors focus:outline-none focus:ring-2
51
51
  disabled:opacity-50 disabled:cursor-not-allowed
52
52
  font-[var(--font-default)] text-[var(--color-text-primary)]
@@ -32,5 +32,5 @@ export const LoginForm = ({ onSubmit, loading = false, error, className = "", })
32
32
  setErrors((prev) => ({ ...prev, [field]: undefined }));
33
33
  }
34
34
  };
35
- 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: "fa 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" })] }) })] }));
35
+ 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" })] }) })] }));
36
36
  };
@@ -50,5 +50,5 @@ export const RegistrationForm = ({ onSubmit, loading = false, error, className =
50
50
  setErrors((prev) => ({ ...prev, [field]: undefined }));
51
51
  }
52
52
  };
53
- 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: "fa 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" })] }) })] }));
53
+ 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" })] }) })] }));
54
54
  };
@@ -1 +1 @@
1
- {"version":3,"file":"SidebarLayout.d.ts","sourceRoot":"","sources":["../../../src/templates/layouts/SidebarLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;CACvB;AAED,MAAM,WAAW,IAAI;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwItD,CAAC"}
1
+ {"version":3,"file":"SidebarLayout.d.ts","sourceRoot":"","sources":["../../../src/templates/layouts/SidebarLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAIxC;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;CACvB;AAED,MAAM,WAAW,IAAI;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwItD,CAAC"}
@@ -1,6 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import React, { useState } from "react";
3
3
  import { Button, Badge } from "../../index";
4
+ import { normalizeIconClass } from "../../components/utils/iconUtils";
4
5
  export const SidebarLayout = ({ title, menuItems, user, children, className = "", onLogout, }) => {
5
6
  const [sidebarOpen, setSidebarOpen] = useState(false);
6
7
  const [activeItem, setActiveItem] = useState(menuItems[0]?.href || "");
@@ -15,7 +16,7 @@ export const SidebarLayout = ({ title, menuItems, user, children, className = ""
15
16
  fixed inset-y-0 left-0 z-50 w-64 bg-white shadow-lg transform transition-transform duration-300 ease-in-out
16
17
  ${sidebarOpen ? "translate-x-0" : "-translate-x-full"}
17
18
  lg:translate-x-0 lg:static lg:inset-0
18
- `, 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: "fa 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) => {
19
+ `, 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) => {
19
20
  e.preventDefault();
20
21
  handleMenuClick(item.href);
21
22
  }, className: `
@@ -23,5 +24,5 @@ export const SidebarLayout = ({ title, menuItems, user, children, className = ""
23
24
  ${activeItem === item.href
24
25
  ? "bg-blue-100 text-blue-700"
25
26
  : "text-gray-600 hover:bg-gray-50 hover:text-gray-900"}
26
- `, children: [_jsx("i", { className: `fa ${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: `fa ${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: "fa 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: "fa 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 })] })] }));
27
+ `, 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 })] })] }));
27
28
  };
@@ -1 +1 @@
1
- {"version":3,"file":"FormPattern.d.ts","sourceRoot":"","sources":["../../../src/templates/patterns/FormPattern.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IACjD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CAClB;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAkLlD,CAAC"}
1
+ {"version":3,"file":"FormPattern.d.ts","sourceRoot":"","sources":["../../../src/templates/patterns/FormPattern.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAIxC;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IACjD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CAClB;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAkLlD,CAAC"}
@@ -1,6 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import React, { useState } from "react";
3
3
  import { Button, Input, Card } from "../../index";
4
+ import { normalizeIconClass } from "../../components/utils/iconUtils";
4
5
  export const FormPattern = ({ title, subtitle, fields, onSubmit, submitText = "Enviar", submitIcon = "fa-paper-plane", loading = false, error, success = false, className = "", gridCols = 1, }) => {
5
6
  const [formData, setFormData] = useState(fields.reduce((acc, field) => ({ ...acc, [field.name]: "" }), {}));
6
7
  const [errors, setErrors] = useState({});
@@ -47,7 +48,7 @@ export const FormPattern = ({ title, subtitle, fields, onSubmit, submitText = "E
47
48
  disabled: loading,
48
49
  };
49
50
  if (field.multiline) {
50
- 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: `fa ${field.icon} text-[var(--color-text-muted)] absolute top-3 left-3 w-5 h-5` })), _jsx("textarea", { placeholder: field.placeholder, className: `
51
+ 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: `
51
52
  w-full border rounded-lg transition-colors focus:outline-none focus:ring-2
52
53
  disabled:opacity-50 disabled:cursor-not-allowed
53
54
  font-[var(--font-default)] text-[var(--color-text-primary)]
@@ -61,7 +62,7 @@ export const FormPattern = ({ title, subtitle, fields, onSubmit, submitText = "E
61
62
  return (_jsx(Input, { type: field.type || "text", ...commonProps }, field.name));
62
63
  };
63
64
  if (success) {
64
- 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: "fa 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" })] }) }));
65
+ 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" })] }) }));
65
66
  }
66
- 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: "fa 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 })] }) }));
67
+ 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 })] }) }));
67
68
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "flysoft-react-ui",
3
3
  "private": false,
4
- "version": "0.5.2",
4
+ "version": "0.5.3",
5
5
  "type": "module",
6
6
  "description": "A modern React UI component library with Tailwind CSS, TypeScript, and FontAwesome 5. Includes forms, layouts, themes, and templates for rapid development.",
7
7
  "keywords": [