siesa-ui-kit 1.0.11 → 1.0.12

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 (53) hide show
  1. package/dist/components/Button/icons.d.ts +6 -5
  2. package/dist/components/Button/icons.d.ts.map +1 -1
  3. package/dist/components/Dropdown/Dropdown.d.ts +68 -9
  4. package/dist/components/Dropdown/Dropdown.d.ts.map +1 -1
  5. package/dist/components/Dropdown/Dropdown.types.d.ts +18 -0
  6. package/dist/components/Dropdown/Dropdown.types.d.ts.map +1 -1
  7. package/dist/components/Dropdown/icons.d.ts +3 -0
  8. package/dist/components/Dropdown/icons.d.ts.map +1 -1
  9. package/dist/components/DropdownItemCollapsible/DropdownItemCollapsible.d.ts.map +1 -1
  10. package/dist/components/DropdownItemCollapsible/DropdownItemCollapsible.types.d.ts +21 -0
  11. package/dist/components/DropdownItemCollapsible/DropdownItemCollapsible.types.d.ts.map +1 -1
  12. package/dist/components/Navbar/Navbar.d.ts.map +1 -1
  13. package/dist/components/Navbar/Navbar.types.d.ts +46 -1
  14. package/dist/components/Navbar/Navbar.types.d.ts.map +1 -1
  15. package/dist/components/NavigationRailGroup/NavigationRailGroup.d.ts +122 -0
  16. package/dist/components/NavigationRailGroup/NavigationRailGroup.d.ts.map +1 -0
  17. package/dist/components/NavigationRailGroup/NavigationRailGroup.types.d.ts +139 -0
  18. package/dist/components/NavigationRailGroup/NavigationRailGroup.types.d.ts.map +1 -0
  19. package/dist/components/NavigationRailGroup/icons.d.ts +33 -0
  20. package/dist/components/NavigationRailGroup/icons.d.ts.map +1 -0
  21. package/dist/components/NavigationRailGroup/index.d.ts +4 -0
  22. package/dist/components/NavigationRailGroup/index.d.ts.map +1 -0
  23. package/dist/components/NavigationRailItem/NavigationRailItem.d.ts.map +1 -1
  24. package/dist/components/NavigationRailItem/NavigationRailItem.types.d.ts +14 -0
  25. package/dist/components/NavigationRailItem/NavigationRailItem.types.d.ts.map +1 -1
  26. package/dist/components/NavigationRailTypes/NavigationRailTypes.d.ts.map +1 -1
  27. package/dist/components/NavigationRailTypes/NavigationRailTypes.types.d.ts +49 -0
  28. package/dist/components/NavigationRailTypes/NavigationRailTypes.types.d.ts.map +1 -1
  29. package/dist/components/NavigationRailTypes/icons.d.ts +15 -29
  30. package/dist/components/NavigationRailTypes/icons.d.ts.map +1 -1
  31. package/dist/components/Select/Select.d.ts.map +1 -1
  32. package/dist/components/Select/icons.d.ts +6 -2
  33. package/dist/components/Select/icons.d.ts.map +1 -1
  34. package/dist/index.d.ts +32 -0
  35. package/dist/index.d.ts.map +1 -1
  36. package/dist/siesa-ui-kit.cjs +483 -235
  37. package/dist/siesa-ui-kit.cjs.map +1 -1
  38. package/dist/siesa-ui-kit.mjs +6727 -1641
  39. package/dist/siesa-ui-kit.mjs.map +1 -1
  40. package/dist/style.css +1 -1
  41. package/dist/views/LayoutBase/LayoutBase.d.ts +73 -0
  42. package/dist/views/LayoutBase/LayoutBase.d.ts.map +1 -0
  43. package/dist/views/LayoutBase/LayoutBase.types.d.ts +99 -0
  44. package/dist/views/LayoutBase/LayoutBase.types.d.ts.map +1 -0
  45. package/dist/views/LayoutBase/index.d.ts +3 -0
  46. package/dist/views/LayoutBase/index.d.ts.map +1 -0
  47. package/dist/views/ListView/ListView.d.ts +18 -12
  48. package/dist/views/ListView/ListView.d.ts.map +1 -1
  49. package/dist/views/ListView/ListView.types.d.ts +31 -94
  50. package/dist/views/ListView/ListView.types.d.ts.map +1 -1
  51. package/dist/views/ListView/index.d.ts +1 -1
  52. package/dist/views/ListView/index.d.ts.map +1 -1
  53. package/package.json +6 -1
@@ -0,0 +1,73 @@
1
+ import React from 'react';
2
+ import type { LayoutBaseProps } from './LayoutBase.types';
3
+ /**
4
+ * LayoutBase - Layout base del sistema Siesa
5
+ *
6
+ * Layout reutilizable que implementa la estructura base con NavigationRail
7
+ * lateral, Navbar superior y área de contenido dinámico. Diseñado para ser
8
+ * usado como wrapper en diferentes vistas de la aplicación.
9
+ *
10
+ * **Composición:**
11
+ * - Navbar: Barra superior con logo Siesa, título del producto y dropdown de usuario
12
+ * - NavigationRailGroup: Rail de navegación lateral con iconos y búsqueda
13
+ * - Área de contenido: Contenido dinámico pasado como children
14
+ *
15
+ * **Mejores prácticas implementadas:**
16
+ * - Orden de modificadores: {responsive}:{dark}:{state}:{utility}
17
+ * - Dark mode con estrategia 'class' (darkMode: 'class')
18
+ * - Tokens de color consistentes con la documentación
19
+ * - Responsive design mobile-first con breakpoints md:, lg:, xl:
20
+ * - Composición con componentes del sistema (NO reimplementación)
21
+ * - Type safety con TypeScript estricto
22
+ *
23
+ * @see docs/colors.md - Sistema de colores
24
+ * @see docs/typography.md - Sistema tipográfico
25
+ * @see docs/spacing.md - Sistema de espaciado
26
+ * @see src/components/Navbar - Componente Navbar reutilizado
27
+ * @see src/components/NavigationRailGroup - Componente NavigationRail reutilizado
28
+ *
29
+ * @example
30
+ * ```tsx
31
+ * // Uso básico
32
+ * <LayoutBase
33
+ * productName="Mi Aplicación"
34
+ * siesaLogoPath="/images/logos/Siesa_Logosimbolo_Blanco.svg"
35
+ * siesaLogoWidth="100px"
36
+ * siesaLogoHeight="40px"
37
+ * userDropdown={{
38
+ * avatar: '/avatar.jpg',
39
+ * name: 'Carlos',
40
+ * email: 'carlos@siesa.com',
41
+ * }}
42
+ * navigationItems={navigationItems}
43
+ * >
44
+ * <div>Mi contenido personalizado</div>
45
+ * </LayoutBase>
46
+ *
47
+ * // Uso avanzado con props pass-through
48
+ * <LayoutBase
49
+ * productName="Sistema Avanzado"
50
+ * navbarProps={{
51
+ * showNavigationButton: true,
52
+ * environmentBadge: "Desarrollo",
53
+ * navigationButtonProps: { type: 'outline', size: 'l' },
54
+ * notifications: { cart: 5, bell: true },
55
+ * onCartClick: () => openCart(),
56
+ * onNotificationsClick: () => openNotifications(),
57
+ * }}
58
+ * navigationRailProps={{
59
+ * showSearchButton: true,
60
+ * labels: {
61
+ * searchPlaceholder: "Buscar módulos...",
62
+ * collapseButton: "Minimizar"
63
+ * },
64
+ * onItemClick: (item) => handleNavigation(item),
65
+ * onItemHover: (item) => showPreview(item),
66
+ * }}
67
+ * >
68
+ * <div>Contenido con funcionalidad completa</div>
69
+ * </LayoutBase>
70
+ * ```
71
+ */
72
+ export declare const LayoutBase: React.FC<LayoutBaseProps>;
73
+ //# sourceMappingURL=LayoutBase.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LayoutBase.d.ts","sourceRoot":"","sources":["../../../src/views/LayoutBase/LayoutBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoEG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA6FhD,CAAC"}
@@ -0,0 +1,99 @@
1
+ import type { ReactNode } from 'react';
2
+ import type { UserDropdownProps, NavbarProps } from '../../components/Navbar/Navbar.types';
3
+ import type { NavigationRailGroupMenuItem, NavigationRailGroupProps } from '../../components/NavigationRailGroup/NavigationRailGroup.types';
4
+ /**
5
+ * Props del componente LayoutBase
6
+ *
7
+ * Layout base con NavigationRail lateral, Navbar superior y área
8
+ * de contenido dinámico. Diseñado para ser reutilizado en diferentes vistas
9
+ * de la aplicación.
10
+ *
11
+ * **Mejores prácticas implementadas:**
12
+ * - Orden de modificadores: {responsive}:{dark}:{state}:{utility}
13
+ * - Dark mode con estrategia 'class' (darkMode: 'class')
14
+ * - Tokens de color consistentes con la documentación
15
+ * - Responsive design mobile-first
16
+ * - Composición con componentes del sistema
17
+ *
18
+ * @see docs/colors.md - Sistema de colores
19
+ * @see docs/typography.md - Sistema tipográfico
20
+ * @see docs/spacing.md - Sistema de espaciado
21
+ */
22
+ export interface LayoutBaseProps {
23
+ /**
24
+ * Nombre del producto que aparece en el Navbar
25
+ * @default 'SB Comercial'
26
+ */
27
+ productName?: string;
28
+ /**
29
+ * Path del logo de Siesa personalizado para el Navbar
30
+ * Si se proporciona, se usa en lugar del logo por defecto
31
+ *
32
+ * @example '/images/logos/Siesa_Logosimbolo_Blanco.svg'
33
+ */
34
+ siesaLogoPath?: string;
35
+ /**
36
+ * Ancho del logo de Siesa personalizado
37
+ * Se aplica solo cuando se proporciona siesaLogoPath
38
+ *
39
+ * @example '120px', '100%', '8rem'
40
+ */
41
+ siesaLogoWidth?: string;
42
+ /**
43
+ * Alto del logo de Siesa personalizado
44
+ * Se aplica solo cuando se proporciona siesaLogoPath
45
+ *
46
+ * @example '30px', '100%', '2rem'
47
+ */
48
+ siesaLogoHeight?: string;
49
+ /**
50
+ * Configuración del dropdown de usuario en el Navbar
51
+ */
52
+ userDropdown?: UserDropdownProps;
53
+ /**
54
+ * Items de navegación para el NavigationRail
55
+ */
56
+ navigationItems?: NavigationRailGroupMenuItem[];
57
+ /**
58
+ * Contenido dinámico que se renderiza en el área principal
59
+ */
60
+ children?: ReactNode;
61
+ /**
62
+ * Clases CSS adicionales para el contenedor principal
63
+ */
64
+ className?: string;
65
+ /**
66
+ * Clases CSS adicionales para el área de contenido
67
+ */
68
+ contentClassName?: string;
69
+ /**
70
+ * Props adicionales para el componente Navbar
71
+ * Permite personalizar cualquier prop del Navbar excepto las que ya se controlan directamente
72
+ *
73
+ * @example
74
+ * ```tsx
75
+ * navbarProps={{
76
+ * showNavigationButton: true,
77
+ * environmentBadge: "Desarrollo",
78
+ * navigationButtonProps: { type: 'outline' },
79
+ * onCartClick: () => handleCart(),
80
+ * }}
81
+ * ```
82
+ */
83
+ navbarProps?: Partial<Omit<NavbarProps, 'productName' | 'userDropdown' | 'siesaLogo'>>;
84
+ /**
85
+ * Props adicionales para el componente NavigationRailGroup
86
+ * Permite personalizar cualquier prop del NavigationRail excepto las que ya se controlan directamente
87
+ *
88
+ * @example
89
+ * ```tsx
90
+ * navigationRailProps={{
91
+ * showSearchButton: true,
92
+ * labels: { searchPlaceholder: "Buscar módulos..." },
93
+ * onItemClick: (item) => handleNavigation(item),
94
+ * }}
95
+ * ```
96
+ */
97
+ navigationRailProps?: Partial<Omit<NavigationRailGroupProps, 'state' | 'items' | 'onStateChange'>>;
98
+ }
99
+ //# sourceMappingURL=LayoutBase.types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LayoutBase.types.d.ts","sourceRoot":"","sources":["../../../src/views/LayoutBase/LayoutBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAC3F,OAAO,KAAK,EAAE,2BAA2B,EAAE,wBAAwB,EAAE,MAAM,gEAAgE,CAAC;AAE5I;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;OAKG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,CAAC,EAAE,iBAAiB,CAAC;IAEjC;;OAEG;IACH,eAAe,CAAC,EAAE,2BAA2B,EAAE,CAAC;IAEhD;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;;;;;;;;;;OAaG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,aAAa,GAAG,cAAc,GAAG,WAAW,CAAC,CAAC,CAAC;IAEvF;;;;;;;;;;;;OAYG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,wBAAwB,EAAE,OAAO,GAAG,OAAO,GAAG,eAAe,CAAC,CAAC,CAAC;CACpG"}
@@ -0,0 +1,3 @@
1
+ export { LayoutBase } from './LayoutBase';
2
+ export type { LayoutBaseProps } from './LayoutBase.types';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/views/LayoutBase/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}
@@ -1,27 +1,33 @@
1
1
  import type { ListViewProps } from './ListView.types';
2
2
  /**
3
- * ListView - Vista de lista del sistema de diseño Siesa
3
+ * ListView - Vista de lista completa del sistema de diseño Siesa
4
4
  *
5
- * Vista completa que incluye:
6
- * - Navigation Rail lateral con FAB
7
- * - Navbar superior con logo, título, notificaciones y dropdown de usuario
8
- * - Barra de filtros rápidos con badges
9
- * - Tabla de datos con cabecera, cuerpo y paginación
10
- * - Botones de acción (Crear, Auditoría, Filtrar)
11
- * - Buscador integrado
12
- * - Dropdown de opciones de vista
5
+ * Vista completa que compone los siguientes componentes del sistema:
6
+ * - NavigationRailGroup: Barra lateral de navegación con panel expandible
7
+ * - Navbar: Barra superior con logo, título, notificaciones y dropdown de usuario
8
+ * - Badge: Filtros rápidos con badges de colores
9
+ * - Table: Tabla de datos con sorting y paginación integrada
10
+ * - Button: Botones de acción (Crear, Auditoría, Filtrar)
11
+ * - Input: Buscador integrado
12
+ * - Select: Dropdown de opciones de vista
13
13
  *
14
14
  * Mejores prácticas implementadas:
15
+ * - REUSO DE COMPONENTES: Usa componentes del sistema, NUNCA reimplementa
15
16
  * - Orden de modificadores: {responsive}:{dark}:{state}:{utility}
16
17
  * - Dark mode con estrategia 'class' (darkMode: 'class')
17
18
  * - Tokens de color consistentes con la documentación
18
19
  * - Type safety con TypeScript estricto
19
- * - Accesibilidad con ARIA labels y keyboard navigation
20
+ * - Accesibilidad con ARIA labels
21
+ * - Responsive design (mobile-first)
20
22
  *
21
23
  * @see docs/colors.md - Sistema de colores
22
24
  * @see docs/typography.md - Sistema tipográfico
23
25
  * @see docs/spacing.md - Sistema de espaciado
24
- * @see docs/shadows.md - Sistema de sombras
26
+ * @see src/components/NavigationRailGroup - Componente de navegación lateral
27
+ * @see src/components/Navbar - Componente de barra superior
28
+ * @see src/components/Table - Componente de tabla con paginación
29
+ * @see src/components/Button - Componente de botón
30
+ * @see src/components/Badge - Componente de badge
25
31
  *
26
32
  * @example
27
33
  * ```tsx
@@ -43,5 +49,5 @@ import type { ListViewProps } from './ListView.types';
43
49
  * />
44
50
  * ```
45
51
  */
46
- export declare const ListView: <T extends Record<string, any>>({ title, navbarTitle, tableTitle, columns, data, navigationItems, quickFilters, actionButtons, userDropdown, notifications, showFab, fabIcon, onFabClick, onSearch, searchPlaceholder, onSort, sortColumn: externalSortColumn, sortDirection: externalSortDirection, pagination, loading, loadingRows, emptyMessage, className, selectedNavId, onNavSelect, onNotificationsClick, viewOptions, selectedViewOption, onViewOptionChange, }: ListViewProps<T>) => import("react/jsx-runtime").JSX.Element;
52
+ export declare const ListView: <T extends Record<string, any>>({ title, navbarProductName, tableTitle, columns, data, navigationItems, quickFilters, actionButtons, userDropdown, notifications, environmentBadge, showNavigationRail, navigationRailState, onNavigationRailStateChange, onNavItemClick, onSearch, searchPlaceholder, onSort, sortColumn: externalSortColumn, sortDirection: externalSortDirection, pagination, loading, loadingRows, emptyMessage, className, onNotificationsClick, viewOptions, selectedViewOption, onViewOptionChange, }: ListViewProps<T>) => import("react/jsx-runtime").JSX.Element;
47
53
  //# sourceMappingURL=ListView.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ListView.d.ts","sourceRoot":"","sources":["../../../src/views/ListView/ListView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAyB,MAAM,kBAAkB,CAAC;AAsB7E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,0aAgCrD,aAAa,CAAC,CAAC,CAAC,4CAsdlB,CAAC"}
1
+ {"version":3,"file":"ListView.d.ts","sourceRoot":"","sources":["../../../src/views/ListView/ListView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAuBtD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,8dA8BrD,aAAa,CAAC,CAAC,CAAC,4CAwPlB,CAAC"}
@@ -1,26 +1,9 @@
1
1
  import type { ReactNode, ReactElement } from 'react';
2
2
  import type { BadgeColor } from '../../components/Badge/Badge.types';
3
- /**
4
- * Interfaz para los items de navegación (Navigation Rail)
5
- */
6
- export interface ListViewNavigationItem {
7
- /** ID único del item */
8
- id: string;
9
- /** Icono del item */
10
- icon: ReactNode;
11
- /** Label del item */
12
- label: string;
13
- /** Si el item está seleccionado */
14
- selected?: boolean;
15
- /** Si el item está deshabilitado */
16
- disabled?: boolean;
17
- /** Badge de notificación */
18
- badge?: boolean;
19
- /** Contador de badge */
20
- badgeCount?: number;
21
- /** Handler de click */
22
- onClick?: () => void;
23
- }
3
+ import type { UserDropdownProps, NotificationsProps } from '../../components/Navbar/Navbar.types';
4
+ import type { NavigationRailGroupMenuItem } from '../../components/NavigationRailGroup/NavigationRailGroup.types';
5
+ import type { TableColumn, SortDirection, PaginationProps as TablePaginationProps } from '../../components/Table/Table.types';
6
+ import type { ButtonType } from '../../components/Button/Button.types';
24
7
  /**
25
8
  * Interfaz para los filtros rápidos (badges en la barra de navegación)
26
9
  */
@@ -38,47 +21,6 @@ export interface ListViewQuickFilter {
38
21
  /** Handler de click */
39
22
  onClick?: () => void;
40
23
  }
41
- /**
42
- * Interfaz para las columnas de la tabla
43
- */
44
- export interface ListViewColumn<T = any> {
45
- /** Título del header */
46
- header: string;
47
- /** Key del objeto para acceder al valor */
48
- accessor: keyof T | ((row: T) => any);
49
- /** Si es sortable */
50
- sortable?: boolean;
51
- /** Render custom */
52
- render?: (value: any, row: T, index: number) => ReactNode;
53
- /** Alineación */
54
- align?: 'left' | 'center' | 'right';
55
- /** Ancho */
56
- width?: string;
57
- }
58
- /**
59
- * Interfaz para los datos del dropdown de usuario
60
- */
61
- export interface ListViewUserDropdown {
62
- /** URL del avatar */
63
- avatar: string;
64
- /** Nombre del usuario */
65
- name: string;
66
- /** Email o rol del usuario */
67
- email?: string;
68
- /** Rol del usuario */
69
- role?: string;
70
- /** Handler del click en menú */
71
- onMenuClick?: () => void;
72
- }
73
- /**
74
- * Interfaz para las notificaciones
75
- */
76
- export interface ListViewNotifications {
77
- /** Contador del carrito */
78
- cart?: number;
79
- /** Si tiene notificaciones de campana */
80
- bell?: boolean;
81
- }
82
24
  /**
83
25
  * Interfaz para los botones de acción
84
26
  */
@@ -88,24 +30,29 @@ export interface ListViewActionButton {
88
30
  /** Label del botón */
89
31
  label: string;
90
32
  /** Icono del botón */
91
- icon?: ReactNode;
33
+ leftIcon?: ReactNode;
92
34
  /** Handler del click */
93
- onClick?: () => void;
94
- /** Variante del botón */
95
- variant?: 'primary' | 'secondary';
35
+ onClick: () => void;
36
+ /** Tipo del botón */
37
+ type?: ButtonType;
96
38
  }
97
39
  /**
98
- * Dirección de ordenamiento
40
+ * Dirección de ordenamiento (re-exportar del tipo de Table)
99
41
  */
100
- export type ListViewSortDirection = 'asc' | 'desc' | null;
42
+ export type ListViewSortDirection = SortDirection;
43
+ /**
44
+ * Interfaz para las columnas de la tabla (re-exportar del tipo de Table)
45
+ */
46
+ export interface ListViewColumn<T = any> extends TableColumn<T> {
47
+ }
101
48
  /**
102
49
  * Props del componente ListView
103
50
  */
104
51
  export interface ListViewProps<T = any> {
105
52
  /** Título de la vista */
106
53
  title?: string;
107
- /** Título del navbar */
108
- navbarTitle?: string;
54
+ /** Nombre del producto en el navbar */
55
+ navbarProductName?: string;
109
56
  /** Título de la tabla */
110
57
  tableTitle?: string;
111
58
  /** Columnas de la tabla */
@@ -113,41 +60,37 @@ export interface ListViewProps<T = any> {
113
60
  /** Datos de la tabla */
114
61
  data: T[];
115
62
  /** Items de navegación lateral */
116
- navigationItems?: ListViewNavigationItem[];
63
+ navigationItems?: NavigationRailGroupMenuItem[];
117
64
  /** Filtros rápidos */
118
65
  quickFilters?: ListViewQuickFilter[];
119
66
  /** Botones de acción */
120
67
  actionButtons?: ListViewActionButton[];
121
68
  /** Dropdown del usuario */
122
- userDropdown?: ListViewUserDropdown;
69
+ userDropdown?: UserDropdownProps;
123
70
  /** Notificaciones */
124
- notifications?: ListViewNotifications;
71
+ notifications?: NotificationsProps;
125
72
  /** Badge de ambiente */
126
73
  environmentBadge?: string;
127
- /** Si mostrar el FAB en navigation rail */
128
- showFab?: boolean;
129
- /** Icono del FAB */
130
- fabIcon?: ReactNode;
131
- /** Handler del FAB */
132
- onFabClick?: () => void;
74
+ /** Si mostrar el NavigationRail */
75
+ showNavigationRail?: boolean;
76
+ /** Estado del NavigationRailGroup */
77
+ navigationRailState?: 'collapsed' | 'expanded' | 'hover' | 'searcher';
78
+ /** Handler para cambio de estado del NavigationRailGroup */
79
+ onNavigationRailStateChange?: (state: 'collapsed' | 'expanded' | 'hover' | 'searcher' | undefined) => void;
80
+ /** Handler para click en item de navegación */
81
+ onNavItemClick?: (item: NavigationRailGroupMenuItem) => void;
133
82
  /** Handler de búsqueda */
134
83
  onSearch?: (query: string) => void;
135
84
  /** Placeholder del buscador */
136
85
  searchPlaceholder?: string;
137
86
  /** Handler de ordenamiento */
138
- onSort?: (column: keyof T | string, direction: ListViewSortDirection) => void;
87
+ onSort?: (column: keyof T | string, direction: SortDirection) => void;
139
88
  /** Columna de ordenamiento actual */
140
89
  sortColumn?: keyof T | string;
141
90
  /** Dirección de ordenamiento actual */
142
- sortDirection?: ListViewSortDirection;
91
+ sortDirection?: SortDirection;
143
92
  /** Props de paginación */
144
- pagination?: {
145
- currentPage: number;
146
- totalPages: number;
147
- onPageChange: (page: number) => void;
148
- previousLabel?: string;
149
- nextLabel?: string;
150
- };
93
+ pagination?: TablePaginationProps;
151
94
  /** Si está cargando */
152
95
  loading?: boolean;
153
96
  /** Número de filas skeleton */
@@ -156,12 +99,6 @@ export interface ListViewProps<T = any> {
156
99
  emptyMessage?: string;
157
100
  /** Clases adicionales */
158
101
  className?: string;
159
- /** ID de navegación seleccionado */
160
- selectedNavId?: string;
161
- /** Handler de selección de navegación */
162
- onNavSelect?: (id: string) => void;
163
- /** Handler click en carrito */
164
- onCartClick?: () => void;
165
102
  /** Handler click en notificaciones */
166
103
  onNotificationsClick?: () => void;
167
104
  /** Opciones del dropdown de vista */
@@ -1 +1 @@
1
- {"version":3,"file":"ListView.types.d.ts","sourceRoot":"","sources":["../../../src/views/ListView/ListView.types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ListView.types.d.ts","sourceRoot":"","sources":["../../../src/views/ListView/ListView.types.ts"],"names":[],"mappings":"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"}
@@ -1,3 +1,3 @@
1
1
  export { ListView } from './ListView';
2
- export type { ListViewProps, ListViewColumn, ListViewNavigationItem, ListViewQuickFilter, ListViewUserDropdown, ListViewNotifications, ListViewActionButton, ListViewSortDirection, } from './ListView.types';
2
+ export type { ListViewProps, ListViewColumn, ListViewQuickFilter, ListViewActionButton, ListViewSortDirection, } from './ListView.types';
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/views/ListView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EACV,aAAa,EACb,cAAc,EACd,sBAAsB,EACtB,mBAAmB,EACnB,oBAAoB,EACpB,qBAAqB,EACrB,oBAAoB,EACpB,qBAAqB,GACtB,MAAM,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/views/ListView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EACV,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,oBAAoB,EACpB,qBAAqB,GACtB,MAAM,kBAAkB,CAAC"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "siesa-ui-kit",
3
3
  "private": false,
4
- "version": "1.0.11",
4
+ "version": "1.0.12",
5
5
  "description": "SIESA UI Kit - Biblioteca de componentes React con Tailwind CSS, Storybook y agentes Claude AI",
6
6
  "type": "module",
7
7
  "main": "dist/siesa-ui-kit.cjs",
@@ -58,6 +58,11 @@
58
58
  "optional": false
59
59
  }
60
60
  },
61
+ "dependencies": {
62
+ "@heroicons/react": "^2.2.0",
63
+ "fs-extra": "^11.3.2",
64
+ "path": "^0.12.7"
65
+ },
61
66
  "devDependencies": {
62
67
  "@chromatic-com/storybook": "^4.1.2",
63
68
  "@eslint/js": "^9.36.0",