@royaltics/ui 1.3.22 → 1.5.7
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.
- package/README.http_query.md +332 -0
- package/dist/components/DynamicTable.js +1 -1
- package/dist/components/DynamicTable.js.map +1 -1
- package/dist/components/PaginateNest.stories.d.ts +18 -0
- package/dist/components/PaginateNest.stories.d.ts.map +1 -0
- package/dist/components/PaginateNest.stories.js +40 -0
- package/dist/components/PaginateNest.stories.js.map +1 -0
- package/dist/components/PaginateNext.d.ts +13 -0
- package/dist/components/PaginateNext.d.ts.map +1 -0
- package/dist/components/PaginateNext.js +44 -0
- package/dist/components/PaginateNext.js.map +1 -0
- package/dist/components/PhotoCard.js +2 -2
- package/dist/components/PhotoCard.js.map +1 -1
- package/dist/core/http/query-manager.d.ts +83 -0
- package/dist/core/http/query-manager.d.ts.map +1 -0
- package/dist/core/http/query-manager.js +350 -0
- package/dist/core/http/query-manager.js.map +1 -0
- package/dist/forms/InputAutocomplete.js.map +1 -1
- package/dist/hooks/useHttpState.d.ts +44 -22
- package/dist/hooks/useHttpState.d.ts.map +1 -1
- package/dist/hooks/useHttpState.js +363 -88
- package/dist/hooks/useHttpState.js.map +1 -1
- package/dist/providers/http-provider.d.ts +9 -1
- package/dist/providers/http-provider.d.ts.map +1 -1
- package/dist/providers/http-provider.js +17 -16
- package/dist/providers/http-provider.js.map +1 -1
- package/package.json +14 -4
|
@@ -0,0 +1,332 @@
|
|
|
1
|
+
# Sistema de Query HTTP Custom
|
|
2
|
+
|
|
3
|
+
Sistema de gestión de estado HTTP similar a `@tanstack/react-query` pero optimizado, sin dependencias innecesarias y con mejor rendimiento.
|
|
4
|
+
|
|
5
|
+
## Características
|
|
6
|
+
|
|
7
|
+
- ✅ **Caché inteligente** con staleTime y gcTime configurables
|
|
8
|
+
- ✅ **Deduplicación automática** de requests simultáneas
|
|
9
|
+
- ✅ **Reintentos automáticos** con backoff exponencial
|
|
10
|
+
- ✅ **Refetch en window focus** configurable
|
|
11
|
+
- ✅ **Infinite queries** con paginación cursor-based
|
|
12
|
+
- ✅ **Optimistic updates** para mutaciones
|
|
13
|
+
- ✅ **TypeScript estricto** sin `any`
|
|
14
|
+
- ✅ **FormData optimizado** con archivos al final
|
|
15
|
+
- ✅ **Garbage collection** automático de queries no usadas
|
|
16
|
+
|
|
17
|
+
## Instalación
|
|
18
|
+
|
|
19
|
+
```tsx
|
|
20
|
+
import { HttpProvider } from 'royaltics-libs/providers/http-provider';
|
|
21
|
+
|
|
22
|
+
function App() {
|
|
23
|
+
return (
|
|
24
|
+
<HttpProvider
|
|
25
|
+
baseUrl="https://api.example.com"
|
|
26
|
+
debug={false}
|
|
27
|
+
initialHeaders={{ 'X-App-Version': '1.0.0' }}
|
|
28
|
+
onNotAuth={(url) => window.location.href = '/login'}
|
|
29
|
+
>
|
|
30
|
+
<YourApp />
|
|
31
|
+
</HttpProvider>
|
|
32
|
+
);
|
|
33
|
+
}
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
## Uso Básico
|
|
37
|
+
|
|
38
|
+
### useQuery - Consultas GET con caché
|
|
39
|
+
|
|
40
|
+
```tsx
|
|
41
|
+
import useHttpState from 'royaltics-libs/hooks/useHttpState';
|
|
42
|
+
|
|
43
|
+
function UserProfile({ userId }: { userId: string }) {
|
|
44
|
+
const http = useHttpState();
|
|
45
|
+
|
|
46
|
+
const { data, isLoading, error, refetch } = http.useQuery<User>(
|
|
47
|
+
['users', userId],
|
|
48
|
+
{
|
|
49
|
+
cacheOptions: {
|
|
50
|
+
staleTime: 5 * 60 * 1000, // 5 minutos
|
|
51
|
+
gcTime: 10 * 60 * 1000, // 10 minutos
|
|
52
|
+
refetchOnWindowFocus: true,
|
|
53
|
+
retry: 3
|
|
54
|
+
},
|
|
55
|
+
onSuccess: (user) => console.log('Usuario cargado:', user),
|
|
56
|
+
onError: (message) => console.error('Error:', message)
|
|
57
|
+
}
|
|
58
|
+
);
|
|
59
|
+
|
|
60
|
+
if (isLoading) return <div>Cargando...</div>;
|
|
61
|
+
if (error) return <div>Error: {error.message}</div>;
|
|
62
|
+
|
|
63
|
+
return (
|
|
64
|
+
<div>
|
|
65
|
+
<h1>{data?.name}</h1>
|
|
66
|
+
<button onClick={refetch}>Recargar</button>
|
|
67
|
+
</div>
|
|
68
|
+
);
|
|
69
|
+
}
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
### useMutation - Mutaciones POST/PUT/PATCH/DELETE
|
|
73
|
+
|
|
74
|
+
```tsx
|
|
75
|
+
function CreatePost() {
|
|
76
|
+
const http = useHttpState();
|
|
77
|
+
|
|
78
|
+
const { mutate, isLoading, data } = http.useMutation<Post>(
|
|
79
|
+
['posts'],
|
|
80
|
+
{
|
|
81
|
+
method: 'POST',
|
|
82
|
+
mutationOptions: {
|
|
83
|
+
invalidateKeys: [['posts'], ['user', 'posts']], // Invalida estas queries
|
|
84
|
+
optimisticData: { title: 'Nuevo post...', id: 'temp' } // Update optimista
|
|
85
|
+
},
|
|
86
|
+
onSuccess: (post) => console.log('Post creado:', post),
|
|
87
|
+
onError: (message) => console.error('Error:', message)
|
|
88
|
+
}
|
|
89
|
+
);
|
|
90
|
+
|
|
91
|
+
const handleSubmit = (e: FormEvent) => {
|
|
92
|
+
e.preventDefault();
|
|
93
|
+
mutate({
|
|
94
|
+
title: 'Mi nuevo post',
|
|
95
|
+
content: 'Contenido del post'
|
|
96
|
+
});
|
|
97
|
+
};
|
|
98
|
+
|
|
99
|
+
return (
|
|
100
|
+
<form onSubmit={handleSubmit}>
|
|
101
|
+
<button type="submit" disabled={isLoading}>
|
|
102
|
+
{isLoading ? 'Creando...' : 'Crear Post'}
|
|
103
|
+
</button>
|
|
104
|
+
</form>
|
|
105
|
+
);
|
|
106
|
+
}
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
### useInfiniteQuery - Paginación infinita
|
|
110
|
+
|
|
111
|
+
```tsx
|
|
112
|
+
function PostList() {
|
|
113
|
+
const http = useHttpState();
|
|
114
|
+
|
|
115
|
+
const { pages, isLoading, hasNextPage, fetchNextPage, isFetchingNextPage } =
|
|
116
|
+
http.useInfiniteQuery<Post[]>(
|
|
117
|
+
['posts', 'infinite'],
|
|
118
|
+
{
|
|
119
|
+
infiniteOptions: {
|
|
120
|
+
cursorKey: 'cursor' // Nombre del parámetro de paginación
|
|
121
|
+
},
|
|
122
|
+
cacheOptions: {
|
|
123
|
+
staleTime: 2 * 60 * 1000
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
);
|
|
127
|
+
|
|
128
|
+
return (
|
|
129
|
+
<div>
|
|
130
|
+
{pages.map((page, i) => (
|
|
131
|
+
<div key={i}>
|
|
132
|
+
{page.map(post => (
|
|
133
|
+
<PostCard key={post.id} post={post} />
|
|
134
|
+
))}
|
|
135
|
+
</div>
|
|
136
|
+
))}
|
|
137
|
+
|
|
138
|
+
{hasNextPage && (
|
|
139
|
+
<button onClick={fetchNextPage} disabled={isFetchingNextPage}>
|
|
140
|
+
{isFetchingNextPage ? 'Cargando...' : 'Cargar más'}
|
|
141
|
+
</button>
|
|
142
|
+
)}
|
|
143
|
+
</div>
|
|
144
|
+
);
|
|
145
|
+
}
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
## Métodos Directos (sin caché)
|
|
149
|
+
|
|
150
|
+
### GET Request
|
|
151
|
+
|
|
152
|
+
```tsx
|
|
153
|
+
const http = useHttpState();
|
|
154
|
+
|
|
155
|
+
http.get(['users', userId], {
|
|
156
|
+
data: { include: 'posts' },
|
|
157
|
+
onSuccess: (user) => console.log(user),
|
|
158
|
+
onError: (message) => console.error(message)
|
|
159
|
+
});
|
|
160
|
+
```
|
|
161
|
+
|
|
162
|
+
### POST Request
|
|
163
|
+
|
|
164
|
+
```tsx
|
|
165
|
+
http.post(['posts'], {
|
|
166
|
+
data: { title: 'Nuevo post', content: 'Contenido' },
|
|
167
|
+
onSuccess: (post) => console.log('Creado:', post)
|
|
168
|
+
});
|
|
169
|
+
```
|
|
170
|
+
|
|
171
|
+
### Upload de Archivos
|
|
172
|
+
|
|
173
|
+
```tsx
|
|
174
|
+
// FormData simple
|
|
175
|
+
http.file(['upload'], {
|
|
176
|
+
method: 'POST',
|
|
177
|
+
content_type: 'file',
|
|
178
|
+
data: {
|
|
179
|
+
title: 'Mi imagen',
|
|
180
|
+
description: 'Descripción',
|
|
181
|
+
photo: [fileObject], // Los archivos siempre van al final
|
|
182
|
+
tags: ['tag1', 'tag2']
|
|
183
|
+
},
|
|
184
|
+
onSuccess: (response) => console.log('Subido:', response)
|
|
185
|
+
});
|
|
186
|
+
|
|
187
|
+
// Upload por chunks (archivos grandes)
|
|
188
|
+
http.fileChunks(['upload', 'large'], {
|
|
189
|
+
data: { file: largeFile, metadata: { type: 'video' } },
|
|
190
|
+
chunkSize: 2 * 1024 * 1024, // 2MB por chunk
|
|
191
|
+
onProgress: (percent, display) => {
|
|
192
|
+
console.log(`Progreso: ${percent}% - ${display}`);
|
|
193
|
+
},
|
|
194
|
+
onSuccess: (response) => console.log('Completado:', response)
|
|
195
|
+
});
|
|
196
|
+
```
|
|
197
|
+
|
|
198
|
+
## QueryManager API
|
|
199
|
+
|
|
200
|
+
Acceso directo al query manager:
|
|
201
|
+
|
|
202
|
+
```tsx
|
|
203
|
+
const http = useHttpState();
|
|
204
|
+
const { queryManager } = http;
|
|
205
|
+
|
|
206
|
+
// Obtener datos de caché
|
|
207
|
+
const userData = queryManager.getQueryData<User>(['users', userId]);
|
|
208
|
+
|
|
209
|
+
// Actualizar caché manualmente
|
|
210
|
+
queryManager.setQueryData(['users', userId], updatedUser);
|
|
211
|
+
|
|
212
|
+
// Invalidar queries (fuerza refetch)
|
|
213
|
+
queryManager.invalidateQueries(['users']);
|
|
214
|
+
|
|
215
|
+
// Prefetch (cargar en background)
|
|
216
|
+
queryManager.prefetchQuery(
|
|
217
|
+
['posts', 'featured'],
|
|
218
|
+
() => fetch('/api/posts/featured').then(r => r.json())
|
|
219
|
+
);
|
|
220
|
+
|
|
221
|
+
// Reset queries (limpiar caché)
|
|
222
|
+
queryManager.resetQueries(['users']); // Específica
|
|
223
|
+
queryManager.resetQueries(); // Todas
|
|
224
|
+
```
|
|
225
|
+
|
|
226
|
+
## Configuración de Headers
|
|
227
|
+
|
|
228
|
+
```tsx
|
|
229
|
+
const http = useHttpState();
|
|
230
|
+
const { setHeaders } = useHttpContext();
|
|
231
|
+
|
|
232
|
+
// Actualizar headers globalmente
|
|
233
|
+
setHeaders({ authorization: `Bearer ${token}` });
|
|
234
|
+
|
|
235
|
+
// O con función
|
|
236
|
+
setHeaders(prev => ({
|
|
237
|
+
...prev,
|
|
238
|
+
'X-Custom-Header': 'value'
|
|
239
|
+
}));
|
|
240
|
+
|
|
241
|
+
// Headers por request
|
|
242
|
+
http.get(['users'], {
|
|
243
|
+
headers: { 'X-Request-ID': uuid() }
|
|
244
|
+
});
|
|
245
|
+
```
|
|
246
|
+
|
|
247
|
+
## buildBody Mejorado
|
|
248
|
+
|
|
249
|
+
La función `buildBody` ahora garantiza que los archivos siempre vayan al final del FormData:
|
|
250
|
+
|
|
251
|
+
```tsx
|
|
252
|
+
const data = {
|
|
253
|
+
title: 'Post con imagen',
|
|
254
|
+
tags: ['tag1', 'tag2'],
|
|
255
|
+
metadata: { author: 'John' },
|
|
256
|
+
photo: [imageFile], // Archivo - irá al final
|
|
257
|
+
z_attached: [pdfFile] // Archivo - irá al final
|
|
258
|
+
};
|
|
259
|
+
|
|
260
|
+
// FormData resultante:
|
|
261
|
+
// 1. title: "Post con imagen"
|
|
262
|
+
// 2. tags: ["tag1","tag2"]
|
|
263
|
+
// 3. metadata: {"author":"John"}
|
|
264
|
+
// 4. photo[]: File (imagen)
|
|
265
|
+
// 5. z_attached[]: File (pdf)
|
|
266
|
+
```
|
|
267
|
+
|
|
268
|
+
Esto soluciona el problema donde algunos backends no recibían los datos regulares si los archivos iban primero.
|
|
269
|
+
|
|
270
|
+
## Mejoras vs React Query
|
|
271
|
+
|
|
272
|
+
1. **Menor tamaño**: Sin dependencias innecesarias
|
|
273
|
+
2. **Deduplicación mejorada**: Requests idénticas comparten la misma Promise
|
|
274
|
+
3. **Tipos más estrictos**: Sin `any`, todo tipado con `unknown` o genéricos
|
|
275
|
+
4. **FormData optimizado**: Archivos siempre al final
|
|
276
|
+
5. **API más simple**: Menos configuración, más convenciones
|
|
277
|
+
6. **Retry con backoff**: Espera exponencial entre reintentos (1s, 2s, 3s...)
|
|
278
|
+
7. **Refetch real**: `invalidateQueries` ejecuta el fetch, no solo marca como stale
|
|
279
|
+
|
|
280
|
+
## Tipos TypeScript
|
|
281
|
+
|
|
282
|
+
```tsx
|
|
283
|
+
interface UseHttpResult<T> {
|
|
284
|
+
data: T | null;
|
|
285
|
+
isLoading: boolean;
|
|
286
|
+
error: Error | null;
|
|
287
|
+
refetch?: () => void;
|
|
288
|
+
}
|
|
289
|
+
|
|
290
|
+
interface UseInfiniteHttpResult<T> extends UseHttpResult<T> {
|
|
291
|
+
pages: T[];
|
|
292
|
+
fetchNextPage: () => void;
|
|
293
|
+
hasNextPage: boolean;
|
|
294
|
+
isFetchingNextPage: boolean;
|
|
295
|
+
}
|
|
296
|
+
|
|
297
|
+
interface UseMutationResult<T> {
|
|
298
|
+
mutate: (data: Record<string, unknown>) => void;
|
|
299
|
+
isLoading: boolean;
|
|
300
|
+
error: Error | null;
|
|
301
|
+
data: T | null;
|
|
302
|
+
}
|
|
303
|
+
```
|
|
304
|
+
|
|
305
|
+
## Notas de Rendimiento
|
|
306
|
+
|
|
307
|
+
- **Deduplicación**: Múltiples componentes solicitando la misma query comparten el request
|
|
308
|
+
- **Garbage Collection**: Queries sin suscriptores se eliminan después de `gcTime`
|
|
309
|
+
- **Stale Time**: Datos se consideran frescos durante `staleTime`, evitando refetches innecesarios
|
|
310
|
+
- **Window Focus**: Refetch automático al volver a la pestaña (configurable)
|
|
311
|
+
- **Subscripción eficiente**: Solo notifica a componentes suscritos a cada query específica
|
|
312
|
+
|
|
313
|
+
## Migración desde React Query
|
|
314
|
+
|
|
315
|
+
```tsx
|
|
316
|
+
// React Query
|
|
317
|
+
import { useQuery, useMutation } from '@tanstack/react-query';
|
|
318
|
+
|
|
319
|
+
const { data } = useQuery({
|
|
320
|
+
queryKey: ['users', id],
|
|
321
|
+
queryFn: () => fetchUser(id)
|
|
322
|
+
});
|
|
323
|
+
|
|
324
|
+
// Sistema Custom
|
|
325
|
+
const http = useHttpState();
|
|
326
|
+
|
|
327
|
+
const { data } = http.useQuery(['users', id], {
|
|
328
|
+
cacheOptions: { queryKey: ['users', id] }
|
|
329
|
+
});
|
|
330
|
+
```
|
|
331
|
+
|
|
332
|
+
La API es similar pero más simple y directa.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DynamicTable.js","sourceRoot":"","sources":["../../src/components/DynamicTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACxD,OAAO,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAEhD,OAAO,YAAY,MAAM,0BAA0B,CAAC;AACpD,OAAO,MAAM,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAoB1D,MAAM,eAAe,GAAG,MAAM,CAAC,kCAAkC,EAC7D;IACI,IAAI,EAAE;QACF,GAAG,EAAE,SAAS;QACd,EAAE,EAAE,eAAe;QACnB,EAAE,EAAE,mBAAmB;QACvB,EAAE,EAAE,kBAAkB;QACtB,EAAE,EAAE,iBAAiB;KACxB;IACD,KAAK,EAAE;QACH,OAAO,EAAE,sIAAsI;QAC/I,SAAS,EAAE,2DAA2D;QACtE,OAAO,EAAE,qDAAqD;QAC9D,IAAI,EAAE,uDAAuD;QAC7D,MAAM,EAAE,6DAA6D;QACrE,MAAM,EAAE,6DAA6D;KACxE;CACJ,EACD;IACI,IAAI,EAAE,KAAK;IACX,KAAK,EAAE,MAAM;IACb,OAAO,EAAE,MAAM;CAClB,CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAqB,EAAE,EAAE;IACvI,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,YAAY,EAAE,CAAC;IAC7E,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAQ,EAAE,CAAC,CAAC;IAC5C,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAI/B,IAAI,CAAC,OAAO;QAAE,MAAM,IAAI,KAAK,CAAC,yCAAyC,CAAC,CAAA;IAGxE,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,QAAQ;YAAE,QAAQ,EAAE,CAAC;IAC7B,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAA;IAIxB;;OAEG;IACH,MAAM,QAAQ,GAAG,GAAG,EAAE;QAClB,GAAG,CAAC,IAAI,QAAQ,EAAE,EAAE;YAChB,
|
|
1
|
+
{"version":3,"file":"DynamicTable.js","sourceRoot":"","sources":["../../src/components/DynamicTable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { PaginateProps } from './Paginate.js';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: import("react").MemoExoticComponent<({ defaultPage, paginate, children, theme, size, variant, overFlowAuto, pagesVisible, onChangue, setPaginate }: PaginateProps) => JSX.Element>;
|
|
6
|
+
parameters: {
|
|
7
|
+
layout: string;
|
|
8
|
+
};
|
|
9
|
+
tags: string[];
|
|
10
|
+
argTypes: {
|
|
11
|
+
[x: string]: any;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
export default meta;
|
|
15
|
+
export declare const paginatePrimary: StoryObj<typeof meta>;
|
|
16
|
+
export declare const paginateSecondary: StoryObj<typeof meta>;
|
|
17
|
+
export declare const paginateOutline: StoryObj<typeof meta>;
|
|
18
|
+
//# sourceMappingURL=PaginateNest.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PaginateNest.stories.d.ts","sourceRoot":"","sources":["../../src/components/PaginateNest.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAiB,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAKxD,QAAA,MAAM,IAAI;;;;;;;;;;CAQqB,CAAC;AAEhC,eAAe,IAAI,CAAC;AAIpB,eAAO,MAAM,eAAe,EAAE,QAAQ,CAAC,OAAO,IAAI,CAKjD,CAAC;AAGF,eAAO,MAAM,iBAAiB,EAAE,QAAQ,CAAC,OAAO,IAAI,CAOnD,CAAC;AAIF,eAAO,MAAM,eAAe,EAAE,QAAQ,CAAC,OAAO,IAAI,CAQjD,CAAC"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import Paginate from './Paginate.js'; // Sin .js si usas la configuración por defecto de Webpack/Vite
|
|
2
|
+
import { ArgumentsBase } from '../types/StoriesArguments.js';
|
|
3
|
+
// Configuración general para el componente en Storybook
|
|
4
|
+
const meta = {
|
|
5
|
+
title: 'UI/Components/Paginate', // Categoría y nombre en la barra lateral de Storybook
|
|
6
|
+
component: Paginate,
|
|
7
|
+
parameters: {
|
|
8
|
+
layout: 'centered', // Centra el componente en el lienzo
|
|
9
|
+
},
|
|
10
|
+
tags: ['autodocs'],
|
|
11
|
+
argTypes: { ...ArgumentsBase }
|
|
12
|
+
};
|
|
13
|
+
export default meta;
|
|
14
|
+
// Historias individuales
|
|
15
|
+
export const paginatePrimary = {
|
|
16
|
+
args: {
|
|
17
|
+
paginate: { rowsCount: 100, rowsPage: 10 },
|
|
18
|
+
setPaginate: () => { },
|
|
19
|
+
},
|
|
20
|
+
};
|
|
21
|
+
// Historias individuales
|
|
22
|
+
export const paginateSecondary = {
|
|
23
|
+
args: {
|
|
24
|
+
onChangue: () => { },
|
|
25
|
+
theme: 'secondary',
|
|
26
|
+
paginate: { rowsCount: 200, rowsPage: 10 },
|
|
27
|
+
setPaginate: () => { },
|
|
28
|
+
},
|
|
29
|
+
};
|
|
30
|
+
// Historias individuales
|
|
31
|
+
export const paginateOutline = {
|
|
32
|
+
args: {
|
|
33
|
+
onChangue: () => { },
|
|
34
|
+
variant: 'outline',
|
|
35
|
+
theme: 'primary',
|
|
36
|
+
paginate: { page: 5, pages: 50 },
|
|
37
|
+
setPaginate: () => { },
|
|
38
|
+
},
|
|
39
|
+
};
|
|
40
|
+
//# sourceMappingURL=PaginateNest.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PaginateNest.stories.js","sourceRoot":"","sources":["../../src/components/PaginateNest.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,QAA2B,MAAM,eAAe,CAAC,CAAC,+DAA+D;AACxH,OAAO,EAAE,aAAa,EAAuB,MAAM,8BAA8B,CAAC;AAGlF,wDAAwD;AACxD,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,wBAAwB,EAAE,sDAAsD;IACvF,SAAS,EAAE,QAAQ;IACnB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU,EAAE,oCAAoC;KACzD;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE,EAAE,GAAG,aAAa,EAAE;CACD,CAAC;AAEhC,eAAe,IAAI,CAAC;AAGpB,yBAAyB;AACzB,MAAM,CAAC,MAAM,eAAe,GAA0B;IACpD,IAAI,EAAE;QACJ,QAAQ,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC1C,WAAW,EAAE,GAAG,EAAE,GAAG,CAAC;KACvB;CACF,CAAC;AAEF,yBAAyB;AACzB,MAAM,CAAC,MAAM,iBAAiB,GAA0B;IACtD,IAAI,EAAE;QACJ,SAAS,EAAE,GAAG,EAAE,GAAG,CAAC;QACpB,KAAK,EAAE,WAAW;QAClB,QAAQ,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC1C,WAAW,EAAE,GAAG,EAAE,GAAG,CAAC;KACvB;CACF,CAAC;AAGF,yBAAyB;AACzB,MAAM,CAAC,MAAM,eAAe,GAA0B;IACpD,IAAI,EAAE;QACJ,SAAS,EAAE,GAAG,EAAE,GAAG,CAAC;QACpB,OAAO,EAAE,SAAS;QAClB,KAAK,EAAE,SAAS;QAChB,QAAQ,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;QAChC,WAAW,EAAE,GAAG,EAAE,GAAG,CAAC;KACvB;CACF,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ComponentBase } from '../types/global.js';
|
|
3
|
+
export interface PaginateProps extends ComponentBase {
|
|
4
|
+
next?: string;
|
|
5
|
+
prev?: string;
|
|
6
|
+
children?: any;
|
|
7
|
+
overFlowAuto?: boolean;
|
|
8
|
+
setNextPage: React.Dispatch<React.SetStateAction<string | undefined>>;
|
|
9
|
+
setPrevPage?: React.Dispatch<React.SetStateAction<string | undefined>>;
|
|
10
|
+
}
|
|
11
|
+
declare const Paginate: React.MemoExoticComponent<({ next, prev, children, theme, size, variant, overFlowAuto, setNextPage, setPrevPage }: PaginateProps) => JSX.Element>;
|
|
12
|
+
export default Paginate;
|
|
13
|
+
//# sourceMappingURL=PaginateNext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PaginateNext.d.ts","sourceRoot":"","sources":["../../src/components/PaginateNext.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmD,MAAM,OAAO,CAAC;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AA0BnD,MAAM,WAAW,aAAc,SAAQ,aAAa;IAChD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;IACtE,WAAW,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;CAE1E;AA4CD,QAAA,MAAM,QAAQ,qHAzCgI,aAAa,KAAG,GAAG,CAAC,OAAO,CAyC5H,CAAC;AAC9C,eAAe,QAAQ,CAAC"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { ChevronLeftIcon, ChevronRightIcon } from '@heroicons/react/24/solid';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { cn, cvaMix } from '../utils/index.js';
|
|
4
|
+
import { Variants } from '../constants/Variants.js';
|
|
5
|
+
const classNamesProps = cvaMix("flex items-center justify-between rounded-md cursor-pointer", {
|
|
6
|
+
size: Variants.size,
|
|
7
|
+
variant: {
|
|
8
|
+
__key: 'theme',
|
|
9
|
+
__base: 'disabled:opacity-70',
|
|
10
|
+
fill: Variants.fill,
|
|
11
|
+
outline: Variants.outline
|
|
12
|
+
}
|
|
13
|
+
}, {
|
|
14
|
+
size: 'xs',
|
|
15
|
+
filled: 'outline',
|
|
16
|
+
theme: 'primary',
|
|
17
|
+
});
|
|
18
|
+
const PaginateInternal = ({ next, prev, children, theme = 'primary', size = 'sm', variant = 'fill', overFlowAuto, setNextPage, setPrevPage }) => {
|
|
19
|
+
const nextPage = () => {
|
|
20
|
+
setNextPage(next);
|
|
21
|
+
};
|
|
22
|
+
const prevPage = () => {
|
|
23
|
+
setPrevPage?.(prev);
|
|
24
|
+
};
|
|
25
|
+
const getSize = () => {
|
|
26
|
+
switch (size) {
|
|
27
|
+
case 'xs': return 16;
|
|
28
|
+
case 'sm': return 21;
|
|
29
|
+
case 'md': return 25;
|
|
30
|
+
case 'lg': return 27;
|
|
31
|
+
default: return 18;
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
return (React.createElement(React.Fragment, null,
|
|
35
|
+
React.createElement("div", { className: overFlowAuto ? 'w-full overflow-auto h-96 scrollbar-thin' : '' }, children),
|
|
36
|
+
React.createElement("div", { className: "my-1 flex items-center gap-1 cursor-pointer text-base select-none" },
|
|
37
|
+
React.createElement("button", { title: 'Anterior', disabled: !prev, onClick: prevPage, className: cn('font-bold rounded-md disabled:opacity-80 hover:bg-black/15', classNamesProps({ variant, size }, { theme })) },
|
|
38
|
+
React.createElement(ChevronLeftIcon, { height: (getSize)(), width: 17 })),
|
|
39
|
+
React.createElement("button", { title: 'Siguiente', disabled: !next, onClick: nextPage, className: cn(`font-bold rounded-md bg-primary disabled:opacity-80 hover:bg-black/15`, classNamesProps({ variant, size }, { theme })) },
|
|
40
|
+
React.createElement(ChevronRightIcon, { height: (getSize)(), width: 17 })))));
|
|
41
|
+
};
|
|
42
|
+
const Paginate = React.memo(PaginateInternal);
|
|
43
|
+
export default Paginate;
|
|
44
|
+
//# sourceMappingURL=PaginateNext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PaginateNext.js","sourceRoot":"","sources":["../../src/components/PaginateNext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC7E,OAAO,KAAmD,MAAM,OAAO,CAAC;AAExE,OAAO,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAMpD,MAAM,eAAe,GAAG,MAAM,CAAC,6DAA6D,EACxF;IACI,IAAI,EAAE,QAAQ,CAAC,IAAI;IACnB,OAAO,EAAE;QACL,KAAK,EAAE,OAAO;QACd,MAAM,EAAE,qBAAqB;QAC7B,IAAI,EAAE,QAAQ,CAAC,IAAI;QACnB,OAAO,EAAE,QAAQ,CAAC,OAAO;KAC5B;CACJ,EACD;IACI,IAAI,EAAE,IAAI;IACV,MAAM,EAAE,SAAS;IACjB,KAAK,EAAE,SAAS;CACnB,CACJ,CAAC;AAcF,MAAM,gBAAgB,GAAG,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,GAAG,SAAS,EAAE,IAAI,GAAG,IAAI,EAAE,OAAO,GAAG,MAAM,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAiB,EAAe,EAAE;IAExK,MAAM,QAAQ,GAAG,GAAG,EAAE;QAClB,WAAW,CAAC,IAAI,CAAC,CAAA;IACrB,CAAC,CAAA;IAED,MAAM,QAAQ,GAAG,GAAG,EAAE;QAClB,WAAW,EAAE,CAAC,IAAI,CAAC,CAAA;IACvB,CAAC,CAAA;IAED,MAAM,OAAO,GAAG,GAAG,EAAE;QACjB,QAAQ,IAAI,EAAE,CAAC;YACX,KAAK,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC;YACrB,KAAK,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC;YACrB,KAAK,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC;YACrB,KAAK,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC;YACrB,OAAO,CAAC,CAAC,OAAO,EAAE,CAAC;QACvB,CAAC;IACL,CAAC,CAAA;IACD,OAAO,CACH;QACI,6BAAK,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC,0CAA0C,CAAC,CAAC,CAAC,EAAE,IACzE,QAAQ,CACP;QACN,6BAAK,SAAS,EAAC,mEAAmE;YAC9E,gCAAQ,KAAK,EAAC,UAAU,EAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,QAAQ,EACvD,SAAS,EAAE,EAAE,CAAC,6DAA6D,EAAE,eAAe,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;gBAC3H,oBAAC,eAAe,IAAC,MAAM,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,GAAI,CAC9C;YAET,gCAAQ,KAAK,EAAC,WAAW,EACrB,QAAQ,EAAE,CAAC,IAAI,EACf,OAAO,EAAE,QAAQ,EACjB,SAAS,EAAE,EAAE,CAAC,wEAAwE,EAAE,eAAe,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;gBACtI,oBAAC,gBAAgB,IAAC,MAAM,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,KAAK,EAAE,EAAE,GAAI,CAC/C,CACN,CACR,CACN,CAAA;AACL,CAAC,CAAA;AAED,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;AAC9C,eAAe,QAAQ,CAAC"}
|
|
@@ -30,7 +30,7 @@ const avatarPlaceHolder = `data:image/svg+xml,${encodeURIComponent(`<svg xmlns="
|
|
|
30
30
|
const PhotoCard = ({ api, size = 'md', api_body = {}, theme = 'primary', keyValue = 'photo', photo, onChange }) => {
|
|
31
31
|
// Valores de los inputs
|
|
32
32
|
const [preview, setPreview] = useState(null);
|
|
33
|
-
const {
|
|
33
|
+
const { del, patch } = useHttpState();
|
|
34
34
|
const componentId = `photo_${uuidv4()}`;
|
|
35
35
|
useEffect(() => {
|
|
36
36
|
setPreview(photo || avatarPlaceHolder);
|
|
@@ -60,7 +60,7 @@ const PhotoCard = ({ api, size = 'md', api_body = {}, theme = 'primary', keyValu
|
|
|
60
60
|
};
|
|
61
61
|
const deletePreview = () => {
|
|
62
62
|
if (!photo) {
|
|
63
|
-
|
|
63
|
+
del(api, {
|
|
64
64
|
onSuccess: () => {
|
|
65
65
|
onChange({ [keyValue]: null });
|
|
66
66
|
toast.success('Imagen Eliminada Correctamente!');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PhotoCard.js","sourceRoot":"","sources":["../../src/components/PhotoCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAS3C,MAAM,eAAe,GAAG,MAAM,CAAC,kCAAkC,EAC7D;IACI,IAAI,EAAE;QACF,GAAG,EAAE,iBAAiB;QACtB,EAAE,EAAE,uBAAuB;QAC3B,EAAE,EAAE,4BAA4B;QAChC,EAAE,EAAE,2BAA2B;QAC/B,EAAE,EAAE,2BAA2B;KAClC;IACD,KAAK,EAAE;QACH,OAAO,EAAE,sIAAsI;QAC/I,SAAS,EAAE,2DAA2D;QACtE,OAAO,EAAE,qDAAqD;QAC9D,IAAI,EAAE,uDAAuD;QAC7D,MAAM,EAAE,6DAA6D;QACrE,MAAM,EAAE,6DAA6D;KACxE;CACJ,EACD;IACI,IAAI,EAAE,KAAK;IACX,KAAK,EAAE,MAAM;IACb,OAAO,EAAE,MAAM;CAClB,CACJ,CAAC;AAGF,MAAM,iBAAiB,GAAG,sBAAsB,kBAAkB,CAAC,yPAAyP,CAAC,EAAE,CAAC;AAGhU,MAAM,SAAS,GAAG,CAAC,EAAE,GAAG,EAAE,IAAI,GAAG,IAAI,EAAE,QAAQ,GAAG,EAAE,EAAE,KAAK,GAAG,SAAS,EAAE,QAAQ,GAAG,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAkB,EAAE,EAAE;IAC9H,wBAAwB;IACxB,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAM,IAAI,CAAC,CAAC;IAClD,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"PhotoCard.js","sourceRoot":"","sources":["../../src/components/PhotoCard.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
type QueryKey = readonly unknown[];
|
|
2
|
+
type QueryStatus = 'idle' | 'pending' | 'success' | 'error';
|
|
3
|
+
interface BaseQueryEntry {
|
|
4
|
+
error: Error | null;
|
|
5
|
+
status: QueryStatus;
|
|
6
|
+
timestamp: number;
|
|
7
|
+
staleTime: number;
|
|
8
|
+
gcTime: number;
|
|
9
|
+
retryCount: number;
|
|
10
|
+
}
|
|
11
|
+
interface QueryEntry<T = unknown> extends BaseQueryEntry {
|
|
12
|
+
data: T | null;
|
|
13
|
+
subscribers: Set<(entry: QueryEntry<T>) => void>;
|
|
14
|
+
promise: Promise<T> | null;
|
|
15
|
+
queryFn: (() => Promise<T>) | null;
|
|
16
|
+
refetchInterval?: number;
|
|
17
|
+
}
|
|
18
|
+
interface QueryOptions {
|
|
19
|
+
staleTime?: number;
|
|
20
|
+
gcTime?: number;
|
|
21
|
+
refetchInterval?: number;
|
|
22
|
+
refetchOnWindowFocus?: boolean;
|
|
23
|
+
retry?: number;
|
|
24
|
+
enabled?: boolean;
|
|
25
|
+
}
|
|
26
|
+
interface InfiniteQueryEntry<T = unknown> extends BaseQueryEntry {
|
|
27
|
+
data: T | null;
|
|
28
|
+
subscribers: Set<(entry: InfiniteQueryEntry<T>) => void>;
|
|
29
|
+
promise: Promise<InfiniteQueryEntry<T>> | null;
|
|
30
|
+
queryFn: ((pageParam: string | null) => Promise<{
|
|
31
|
+
data: T;
|
|
32
|
+
paginate?: {
|
|
33
|
+
next?: string;
|
|
34
|
+
};
|
|
35
|
+
}>) | null;
|
|
36
|
+
pages: T[];
|
|
37
|
+
pageParams: (string | null)[];
|
|
38
|
+
hasNextPage: boolean;
|
|
39
|
+
}
|
|
40
|
+
declare class QueryManager {
|
|
41
|
+
private readonly queries;
|
|
42
|
+
private readonly infiniteQueries;
|
|
43
|
+
private readonly gcTimeouts;
|
|
44
|
+
private readonly refetchIntervals;
|
|
45
|
+
private readonly queryConfig?;
|
|
46
|
+
constructor(queryConfig?: QueryOptions);
|
|
47
|
+
private handleWindowFocus;
|
|
48
|
+
private isStale;
|
|
49
|
+
private isPlainObject;
|
|
50
|
+
hashKey(queryKey: QueryKey): string;
|
|
51
|
+
private scheduleGC;
|
|
52
|
+
private clearGC;
|
|
53
|
+
private setupRefetchInterval;
|
|
54
|
+
private clearRefetchInterval;
|
|
55
|
+
fetchQuery<T>(queryKey: QueryKey, queryFn: () => Promise<T>, options?: QueryOptions): Promise<T>;
|
|
56
|
+
fetchInfiniteQuery<T>(queryKey: QueryKey, queryFn: (pageParam: string | null) => Promise<{
|
|
57
|
+
data: T;
|
|
58
|
+
paginate?: {
|
|
59
|
+
next?: string;
|
|
60
|
+
};
|
|
61
|
+
}>, options?: QueryOptions): Promise<InfiniteQueryEntry<T>>;
|
|
62
|
+
fetchNextPage<T>(queryKey: QueryKey, queryFn: (pageParam: string | null) => Promise<{
|
|
63
|
+
data: T;
|
|
64
|
+
paginate?: {
|
|
65
|
+
next?: string;
|
|
66
|
+
};
|
|
67
|
+
}>): Promise<void>;
|
|
68
|
+
subscribe<T = unknown>(queryKey: QueryKey, callback: (entry: QueryEntry<T>) => void): () => void;
|
|
69
|
+
subscribeInfinite<T = unknown>(queryKey: QueryKey, callback: (entry: InfiniteQueryEntry<T>) => void): () => void;
|
|
70
|
+
private notifySubscribers;
|
|
71
|
+
private notifyInfiniteSubscribers;
|
|
72
|
+
invalidateQueries(queryKey: QueryKey): void;
|
|
73
|
+
private refetchQuery;
|
|
74
|
+
resetQueries(queryKey?: QueryKey): void;
|
|
75
|
+
getQueryData<T = unknown>(queryKey: QueryKey): T | null;
|
|
76
|
+
setQueryData<T = unknown>(queryKey: QueryKey, data: T): void;
|
|
77
|
+
destroy(): void;
|
|
78
|
+
getQueryState<T = unknown>(queryKey: QueryKey): QueryEntry<T> | null;
|
|
79
|
+
prefetchQuery<T>(queryKey: QueryKey, queryFn: () => Promise<T>, options?: QueryOptions): Promise<T>;
|
|
80
|
+
}
|
|
81
|
+
export default QueryManager;
|
|
82
|
+
export type { QueryKey, QueryOptions, QueryEntry, InfiniteQueryEntry };
|
|
83
|
+
//# sourceMappingURL=query-manager.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"query-manager.d.ts","sourceRoot":"","sources":["../../../src/core/http/query-manager.ts"],"names":[],"mappings":"AAAA,KAAK,QAAQ,GAAG,SAAS,OAAO,EAAE,CAAC;AAEnC,KAAK,WAAW,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE5D,UAAU,cAAc;IACpB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,MAAM,EAAE,WAAW,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;CACtB;AAED,UAAU,UAAU,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,cAAc;IACpD,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,WAAW,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC;IACjD,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC3B,OAAO,EAAE,CAAC,MAAM,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IACnC,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,UAAU,YAAY;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,UAAU,kBAAkB,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,cAAc;IAC5D,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,WAAW,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC;IACzD,OAAO,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAC/C,OAAO,EAAE,CAAC,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,KAAK,OAAO,CAAC;QAAE,IAAI,EAAE,CAAC,CAAC;QAAC,QAAQ,CAAC,EAAE;YAAE,IAAI,CAAC,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAC,CAAC,GAAG,IAAI,CAAC;IACnG,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,UAAU,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC;IAC9B,WAAW,EAAE,OAAO,CAAC;CACxB;AAED,cAAM,YAAY;IACd,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA0C;IAClE,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAkD;IAClF,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAqC;IAChE,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAqC;IACtE,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAe;gBAEhC,WAAW,CAAC,EAAE,YAAY;IAOtC,OAAO,CAAC,iBAAiB,CAMvB;IAEF,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,aAAa;IAId,OAAO,CAAC,QAAQ,EAAE,QAAQ,GAAG,MAAM;IAa1C,OAAO,CAAC,UAAU;IAYlB,OAAO,CAAC,OAAO;IAQf,OAAO,CAAC,oBAAoB;IAM5B,OAAO,CAAC,oBAAoB;IAQtB,UAAU,CAAC,CAAC,EACd,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,EACzB,OAAO,GAAE,YAAiB,GAC3B,OAAO,CAAC,CAAC,CAAC;IA8EP,kBAAkB,CAAC,CAAC,EACtB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,KAAK,OAAO,CAAC;QAAE,IAAI,EAAE,CAAC,CAAC;QAAC,QAAQ,CAAC,EAAE;YAAE,IAAI,CAAC,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAC,EACzF,OAAO,GAAE,YAAiB,GAC3B,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;IA8E3B,aAAa,CAAC,CAAC,EACjB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,KAAK,OAAO,CAAC;QAAE,IAAI,EAAE,CAAC,CAAC;QAAC,QAAQ,CAAC,EAAE;YAAE,IAAI,CAAC,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAC,GAC1F,OAAO,CAAC,IAAI,CAAC;IA+BhB,SAAS,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,MAAM,IAAI;IAwBhG,iBAAiB,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,MAAM,IAAI;IAoBhH,OAAO,CAAC,iBAAiB;IAOzB,OAAO,CAAC,yBAAyB;IAOjC,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,GAAG,IAAI;YAW7B,YAAY;IAoB1B,YAAY,CAAC,QAAQ,CAAC,EAAE,QAAQ,GAAG,IAAI;IAiBvC,YAAY,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,GAAG,CAAC,GAAG,IAAI;IAMvD,YAAY,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,GAAG,IAAI;IAW5D,OAAO,IAAI,IAAI;IAOf,aAAa,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,QAAQ,GAAG,UAAU,CAAC,CAAC,CAAC,GAAG,IAAI;IAKpE,aAAa,CAAC,CAAC,EACX,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,EACzB,OAAO,CAAC,EAAE,YAAY,GACvB,OAAO,CAAC,CAAC,CAAC;CAGhB;AAED,eAAe,YAAY,CAAC;AAC5B,YAAY,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,CAAC"}
|