@innovardix-com-mx/capi-ui 0.1.0 → 0.1.2
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.md +498 -498
- package/dist/capi-ui.css +1 -0
- package/dist/capi-ui.d.ts +754 -0
- package/dist/capi-ui.js +147 -0
- package/dist/capi-ui.umd.cjs +1 -0
- package/dist/vite.svg +1 -0
- package/package.json +112 -112
|
@@ -0,0 +1,754 @@
|
|
|
1
|
+
import { AxiosInstance } from 'axios';
|
|
2
|
+
import { AxiosRequestConfig } from 'axios';
|
|
3
|
+
import { CSSProperties } from 'react';
|
|
4
|
+
import { default as default_2 } from 'react';
|
|
5
|
+
import { JSX } from 'react/jsx-runtime';
|
|
6
|
+
import { QueryKey } from '@tanstack/react-query';
|
|
7
|
+
import { QueryObserverResult } from '@tanstack/query-core';
|
|
8
|
+
import { ReactElement } from 'react';
|
|
9
|
+
import { ReactNode } from 'react';
|
|
10
|
+
import { RefetchOptions } from '@tanstack/query-core';
|
|
11
|
+
import { UseMutateAsyncFunction } from '@tanstack/react-query';
|
|
12
|
+
import { UseMutationResult } from '@tanstack/react-query';
|
|
13
|
+
import { UseQueryResult } from '@tanstack/react-query';
|
|
14
|
+
|
|
15
|
+
export declare interface ActionConfig<T extends Record<string, unknown> = Record<string, unknown>> {
|
|
16
|
+
showDefaultActions?: boolean;
|
|
17
|
+
showEdit?: boolean | ((record: T) => boolean);
|
|
18
|
+
showDelete?: boolean | ((record: T) => boolean);
|
|
19
|
+
showView?: boolean | ((record: T) => boolean);
|
|
20
|
+
customIcons?: ActionIcons;
|
|
21
|
+
refreshButtonText?: string;
|
|
22
|
+
customActionsColor?: {
|
|
23
|
+
edit?: string;
|
|
24
|
+
delete?: string;
|
|
25
|
+
view?: string;
|
|
26
|
+
moreActions?: string;
|
|
27
|
+
};
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
export declare interface ActionIcons {
|
|
31
|
+
create?: React.ReactElement;
|
|
32
|
+
edit?: React.ReactElement;
|
|
33
|
+
delete?: React.ReactElement;
|
|
34
|
+
refresh?: React.ReactElement;
|
|
35
|
+
view?: React.ReactElement;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
declare type AllowedBulkFormats = readonly ['xlsx', 'csv'];
|
|
39
|
+
|
|
40
|
+
declare interface ApiConfig {
|
|
41
|
+
url: string;
|
|
42
|
+
method: string;
|
|
43
|
+
headers?: Record<string, string>;
|
|
44
|
+
params?: Record<string, string>;
|
|
45
|
+
responseDataPath?: string;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
declare interface ApiResponse<T> {
|
|
49
|
+
data: T | {
|
|
50
|
+
data: T;
|
|
51
|
+
};
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* Clase para gestionar la creación y obtención de instancias de Axios.
|
|
56
|
+
* Permite crear instancias de Axios con una URL base, configuración personalizada
|
|
57
|
+
* y opcionalmente un número de versión específico.
|
|
58
|
+
*
|
|
59
|
+
* @param baseUrl URL base de la API
|
|
60
|
+
* @param config Configuración personalizada de Axios
|
|
61
|
+
*
|
|
62
|
+
* @method version(version: string): AxiosInstance
|
|
63
|
+
* @method getInstance(version: string): AxiosInstance
|
|
64
|
+
*
|
|
65
|
+
* @example
|
|
66
|
+
* ```typescript
|
|
67
|
+
* // Configuración básica
|
|
68
|
+
* const api = new ApiVersioning(import.meta.env.VITE_API_URL);
|
|
69
|
+
*
|
|
70
|
+
* // Configuración personalizada
|
|
71
|
+
* const api = new ApiVersioning(import.meta.env.VITE_API_URL, {
|
|
72
|
+
* headers: { 'Authorization': 'Bearer token' },
|
|
73
|
+
* withCredentials: true
|
|
74
|
+
* });
|
|
75
|
+
*
|
|
76
|
+
* // Con versión
|
|
77
|
+
* const apiV1 = api.version('v1');
|
|
78
|
+
*
|
|
79
|
+
* // Sin versión - petición GET
|
|
80
|
+
* const response = await api.get('/users');
|
|
81
|
+
*
|
|
82
|
+
* // Con versión - petición Get
|
|
83
|
+
* const response = await apiV1.get('/users');
|
|
84
|
+
* ```
|
|
85
|
+
*/
|
|
86
|
+
export declare class ApiVersioning {
|
|
87
|
+
private baseUrl;
|
|
88
|
+
private config?;
|
|
89
|
+
private instances;
|
|
90
|
+
constructor(baseUrl: string, config?: AxiosRequestConfig);
|
|
91
|
+
private createApiInstance;
|
|
92
|
+
version(version: string): AxiosInstance;
|
|
93
|
+
/**
|
|
94
|
+
* Obtiene una instancia de Axios para una versión específica.
|
|
95
|
+
* Si la instancia no existe, se crea una nueva.
|
|
96
|
+
* @deprecated Use `version(version: string)` instead.
|
|
97
|
+
* @param version
|
|
98
|
+
* @returns
|
|
99
|
+
*/
|
|
100
|
+
getInstance(version: string): AxiosInstance;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
/**
|
|
104
|
+
* @alias Btn
|
|
105
|
+
* @description Versatile button component with icon support, custom variants and presets
|
|
106
|
+
* @param {BtnProps} props
|
|
107
|
+
* @param {React.ReactNode} props.children - The content of the button
|
|
108
|
+
* @param {'primary' | 'link' | 'text' | 'default' | 'dashed'} props.type - The Ant Design button type
|
|
109
|
+
* @param {'small' | 'middle' | 'large'} props.size - The size of the button
|
|
110
|
+
* @param {'default' | 'success' | 'danger' | 'warning' | 'info' | 'dark'} props.variant - Color variant
|
|
111
|
+
* @param {'save' | 'delete' | 'edit' | 'add' | 'download' | 'upload' | 'refresh' | 'search' | 'settings' | 'profile' | 'favorite' | 'cart' | 'mail' | 'call' | 'home' | 'next'} props.preset - Predefined button with icon and text
|
|
112
|
+
* @param {React.ReactNode} props.icon - Custom icon
|
|
113
|
+
* @param {'left' | 'right'} props.iconPosition - Position of the icon
|
|
114
|
+
* @param {boolean} props.iconOnly - Show only icon without text
|
|
115
|
+
* @param {boolean} props.loading - Loading state
|
|
116
|
+
* @param {boolean} props.disabled - Disabled state
|
|
117
|
+
* @param {() => void} props.onClick - Click handler
|
|
118
|
+
* @returns {React.ReactNode}
|
|
119
|
+
* @example
|
|
120
|
+
* <Btn preset="save" variant="success">Guardar</Btn>
|
|
121
|
+
* <Btn icon={<FiCustomIcon />} variant="info">Custom</Btn>
|
|
122
|
+
* <Btn preset="delete" iconOnly />
|
|
123
|
+
*/
|
|
124
|
+
export declare const Btn: ({ children, type, size, variant, preset, icon, iconPosition, iconOnly, loading, disabled, onClick }: BtnProps) => React.ReactNode;
|
|
125
|
+
|
|
126
|
+
export declare interface BtnProps {
|
|
127
|
+
children?: React.ReactNode;
|
|
128
|
+
type?: 'primary' | 'link' | 'text' | 'default' | 'dashed';
|
|
129
|
+
size?: 'small' | 'middle' | 'large';
|
|
130
|
+
variant?: 'default' | 'success' | 'danger' | 'warning' | 'info' | 'dark';
|
|
131
|
+
preset?: 'save' | 'delete' | 'edit' | 'add' | 'download' | 'upload' | 'refresh' | 'search' | 'settings' | 'profile' | 'favorite' | 'cart' | 'mail' | 'call' | 'home' | 'next';
|
|
132
|
+
icon?: React.ReactNode;
|
|
133
|
+
iconPosition?: 'left' | 'right';
|
|
134
|
+
iconOnly?: boolean;
|
|
135
|
+
loading?: boolean;
|
|
136
|
+
disabled?: boolean;
|
|
137
|
+
onClick?: () => void;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
declare interface BulkConfig {
|
|
141
|
+
entityName: string;
|
|
142
|
+
maxFileSize?: number;
|
|
143
|
+
entityNameSingular: string;
|
|
144
|
+
allowedFormats?: AllowedBulkFormats;
|
|
145
|
+
templateFields: TemplateField[];
|
|
146
|
+
downloadTemplates?: boolean;
|
|
147
|
+
templateUrl?: string;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
declare interface BulkUploadProps<T = Record<string, unknown>> {
|
|
151
|
+
config?: BulkConfig;
|
|
152
|
+
enabled: boolean;
|
|
153
|
+
title?: string;
|
|
154
|
+
onFinish?: (data: T[]) => void;
|
|
155
|
+
maxFileSize?: number;
|
|
156
|
+
allowedFormats?: string[];
|
|
157
|
+
templateUrl?: string;
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
export declare interface CheckboxConfig {
|
|
161
|
+
options?: Options[];
|
|
162
|
+
onChange?: (value: string | number) => void;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
export declare interface ColumnsProps<T = Record<string, unknown>> {
|
|
166
|
+
title: string;
|
|
167
|
+
dataIndex: string;
|
|
168
|
+
isPrimaryKey?: boolean;
|
|
169
|
+
isHidden?: boolean;
|
|
170
|
+
key: string | number;
|
|
171
|
+
filters?: FilterItem[];
|
|
172
|
+
onFilter?: (value: boolean | React.Key, record: T & {
|
|
173
|
+
key: number;
|
|
174
|
+
}) => boolean;
|
|
175
|
+
width?: string | number;
|
|
176
|
+
align?: "left" | "right" | "center";
|
|
177
|
+
icon?: React.ReactElement;
|
|
178
|
+
render?: (value: T[keyof T], record: T) => React.ReactNode;
|
|
179
|
+
sorter?: boolean | ((a: T, b: T) => number);
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
/**
|
|
183
|
+
* Crea un generador de acciones tipado para un tipo específico
|
|
184
|
+
* @returns Una función createMoreAction tipada con T
|
|
185
|
+
*/
|
|
186
|
+
export declare const createActionFactory: <T>() => (key: string, icon: default_2.ReactElement, tooltip: string, className: string, onClick: (record: T) => void, hidden?: (record: T) => boolean, label?: string, style?: default_2.CSSProperties) => MoreActions<T>;
|
|
187
|
+
|
|
188
|
+
export declare const createPermissions: (...permissions: Permission[]) => Permission[];
|
|
189
|
+
|
|
190
|
+
/**
|
|
191
|
+
* Helper function to create a fully typed permission configuration.
|
|
192
|
+
* Accepts any dynamic role and generates the corresponding permissions.
|
|
193
|
+
* @param config - The permission configuration object.
|
|
194
|
+
* @returns A fully typed permission configuration.
|
|
195
|
+
*/
|
|
196
|
+
export declare const createPermissionsConfig: <T extends PermissionConfig>(config: T) => T;
|
|
197
|
+
|
|
198
|
+
declare type CrudName = string;
|
|
199
|
+
|
|
200
|
+
declare type CrudOperations<T, CreateT = T> = {
|
|
201
|
+
getAll: () => Promise<{
|
|
202
|
+
data: T[];
|
|
203
|
+
error?: boolean;
|
|
204
|
+
message?: string;
|
|
205
|
+
}>;
|
|
206
|
+
create?: (item: CreateT) => Promise<{
|
|
207
|
+
data: T;
|
|
208
|
+
error?: boolean;
|
|
209
|
+
message?: string;
|
|
210
|
+
}>;
|
|
211
|
+
update?: (item: T) => Promise<{
|
|
212
|
+
data: T;
|
|
213
|
+
error?: boolean;
|
|
214
|
+
message?: string;
|
|
215
|
+
}>;
|
|
216
|
+
delete?: (item: T | {
|
|
217
|
+
[key: string]: any;
|
|
218
|
+
}) => Promise<{
|
|
219
|
+
data: T;
|
|
220
|
+
error?: boolean;
|
|
221
|
+
message?: string;
|
|
222
|
+
}>;
|
|
223
|
+
idField?: string;
|
|
224
|
+
entityName?: string;
|
|
225
|
+
};
|
|
226
|
+
|
|
227
|
+
declare type CrudPermissions = Record<string, (Permission[] | PermissionAlias[])>;
|
|
228
|
+
|
|
229
|
+
export declare interface CustomFilters<T = Record<string, unknown>> {
|
|
230
|
+
key: string;
|
|
231
|
+
label?: string | ReactElement;
|
|
232
|
+
className?: string;
|
|
233
|
+
style?: React.CSSProperties;
|
|
234
|
+
icon?: React.ReactElement;
|
|
235
|
+
onClick: (record: T) => void;
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
declare interface CustomOption extends Partial<Options> {
|
|
239
|
+
onClick: () => void;
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
declare interface CustomTitleProps {
|
|
243
|
+
level?: 1 | 2 | 3 | 4 | 5;
|
|
244
|
+
children: React.ReactNode;
|
|
245
|
+
className?: string;
|
|
246
|
+
style?: CSSProperties;
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
export declare interface DatepickerConfig {
|
|
250
|
+
format?: string;
|
|
251
|
+
showTime?: boolean;
|
|
252
|
+
picker?: PickerType;
|
|
253
|
+
size?: 'large' | 'middle' | 'small';
|
|
254
|
+
}
|
|
255
|
+
|
|
256
|
+
declare interface DirectPermissions {
|
|
257
|
+
create?: boolean;
|
|
258
|
+
read?: boolean;
|
|
259
|
+
update?: boolean;
|
|
260
|
+
delete?: boolean;
|
|
261
|
+
view?: boolean;
|
|
262
|
+
c?: boolean;
|
|
263
|
+
r?: boolean;
|
|
264
|
+
u?: boolean;
|
|
265
|
+
d?: boolean;
|
|
266
|
+
v?: boolean;
|
|
267
|
+
}
|
|
268
|
+
|
|
269
|
+
export declare const DynamicCrud: <T extends Record<string, unknown>>({ columns, data, title, formTitle, formTitles, description, formDescription, fields, showCreateButton, createButtonText, createButtonIcon, icon, layout, actionConfig, searchConfig, headerDirection, showRefreshButton, onRefresh, loading, onCreate, createRedirect, onEdit, onDelete, onView, submitButtonText, apiConfig, initialData, themeConfig, moreActions, formCols, formCustomCols, exportToExcel, backButton, showSearchBar, customFilters, disableWrapper, hiddenActions, widthActionsCol, crudName, permissions, bulkUpload }: DynamicCrudProps<T>) => ReactNode;
|
|
270
|
+
|
|
271
|
+
export declare interface DynamicCrudProps<T extends Record<string, unknown>> {
|
|
272
|
+
title?: string | ReactElement;
|
|
273
|
+
formTitle?: string | ReactElement;
|
|
274
|
+
formTitles?: string[];
|
|
275
|
+
description?: string | ReactElement;
|
|
276
|
+
formDescription?: string | ReactElement;
|
|
277
|
+
columns: ColumnsProps<T>[];
|
|
278
|
+
data?: T[];
|
|
279
|
+
fields?: FormField[];
|
|
280
|
+
showCreateButton?: boolean;
|
|
281
|
+
createButtonText?: string;
|
|
282
|
+
createButtonIcon?: ReactElement;
|
|
283
|
+
submitButtonText?: string;
|
|
284
|
+
icon?: ReactElement;
|
|
285
|
+
layout?: "horizontal" | "vertical";
|
|
286
|
+
actionConfig?: ActionConfig<T>;
|
|
287
|
+
hiddenActions?: boolean;
|
|
288
|
+
searchConfig?: SearchConfig<T>;
|
|
289
|
+
showRefreshButton?: boolean;
|
|
290
|
+
onRefresh?: () => void;
|
|
291
|
+
headerDirection?: "horizontal" | "vertical";
|
|
292
|
+
loading?: boolean;
|
|
293
|
+
onCreate?: OnCreateHandler;
|
|
294
|
+
createRedirect?: boolean;
|
|
295
|
+
bulkUpload?: BulkUploadProps;
|
|
296
|
+
onEdit?: (record: T) => void;
|
|
297
|
+
onDelete?: (record: T) => void;
|
|
298
|
+
onView?: (record: T) => void;
|
|
299
|
+
apiConfig?: ApiConfig;
|
|
300
|
+
initialData?: T;
|
|
301
|
+
themeConfig?: ThemeConfig;
|
|
302
|
+
moreActions?: MoreActions<T>[];
|
|
303
|
+
customFilters?: CustomFilters[];
|
|
304
|
+
formCols?: 1 | 2 | 3 | 4;
|
|
305
|
+
formCustomCols?: boolean;
|
|
306
|
+
showView?: boolean;
|
|
307
|
+
exportToExcel?: ExcelConfigProps<T>;
|
|
308
|
+
backButton?: boolean | ReactElement;
|
|
309
|
+
showSearchBar?: boolean;
|
|
310
|
+
disableWrapper?: boolean;
|
|
311
|
+
widthActionsCol?: string | number;
|
|
312
|
+
crudName?: string;
|
|
313
|
+
permissions?: {
|
|
314
|
+
create?: boolean;
|
|
315
|
+
read?: boolean;
|
|
316
|
+
update?: boolean;
|
|
317
|
+
delete?: boolean;
|
|
318
|
+
export?: boolean;
|
|
319
|
+
view?: boolean;
|
|
320
|
+
refresh?: boolean;
|
|
321
|
+
};
|
|
322
|
+
}
|
|
323
|
+
|
|
324
|
+
export declare const DynamicForm: ({ mode, title, description, icon, layout, cols, fields, submitButtonText, submitEditText, onSubmit, initialData, customCols, }: DynamicFormProps) => default_2.ReactNode;
|
|
325
|
+
|
|
326
|
+
declare interface DynamicFormProps {
|
|
327
|
+
mode?: "create" | "update" | "view";
|
|
328
|
+
title?: string | ReactElement;
|
|
329
|
+
description?: string | ReactElement;
|
|
330
|
+
icon?: ReactElement;
|
|
331
|
+
layout?: "vertical" | "horizontal";
|
|
332
|
+
cols?: number;
|
|
333
|
+
fields: FormField[] | FormField[][];
|
|
334
|
+
submitButtonText?: string;
|
|
335
|
+
submitEditText?: string;
|
|
336
|
+
onSubmit?: (data: unknown) => void;
|
|
337
|
+
apiConfig?: ApiConfig;
|
|
338
|
+
initialData?: Record<string, unknown>;
|
|
339
|
+
customCols?: boolean;
|
|
340
|
+
}
|
|
341
|
+
|
|
342
|
+
export declare const DynamicTable: <T extends Record<string, unknown>>({ title, icon: Icon, description, showSearchBar, showCreateButton, onCreate, onEdit, onDelete, onView, onRefresh, exportToExcel, createButtonText, createButtonIcon, columns, data, loading, moreActions, customFilters, disableWrapper, actionConfig, showRefreshButton, hiddenActions, searchConfig, backButton, widthActionsCol, bulkUpload, onBulkUpload }: DynamicTableProps<T>) => default_2.ReactNode;
|
|
343
|
+
|
|
344
|
+
export declare interface DynamicTableProps<T = Record<string, unknown>> {
|
|
345
|
+
title?: string | ReactElement;
|
|
346
|
+
description?: string | ReactElement;
|
|
347
|
+
icon?: ReactElement;
|
|
348
|
+
headerDirection?: "horizontal" | "vertical";
|
|
349
|
+
columns: ColumnsProps<T>[];
|
|
350
|
+
data: T[];
|
|
351
|
+
className?: string;
|
|
352
|
+
loading?: boolean;
|
|
353
|
+
exportToExcel?: ExcelConfigProps<T>;
|
|
354
|
+
showSearchBar?: boolean;
|
|
355
|
+
showCreateButton?: boolean;
|
|
356
|
+
showRefreshButton?: boolean;
|
|
357
|
+
disableWrapper?: boolean;
|
|
358
|
+
createButtonText?: string;
|
|
359
|
+
createButtonIcon?: ReactElement;
|
|
360
|
+
moreActions?: MoreActions<T>[];
|
|
361
|
+
customFilters?: CustomFilters<T>[];
|
|
362
|
+
onCreate?: () => void;
|
|
363
|
+
onView?: (record: T) => void;
|
|
364
|
+
onEdit?: (record: T) => void;
|
|
365
|
+
onDelete?: (record: T) => void;
|
|
366
|
+
onRefresh?: () => void;
|
|
367
|
+
actionConfig?: ActionConfig;
|
|
368
|
+
searchConfig?: SearchConfig<T>;
|
|
369
|
+
themeConfig?: ThemeConfig;
|
|
370
|
+
customCols?: boolean;
|
|
371
|
+
backButton?: boolean | ReactElement;
|
|
372
|
+
hiddenActions?: boolean;
|
|
373
|
+
widthActionsCol?: string | number;
|
|
374
|
+
bulkUpload?: BulkUploadProps;
|
|
375
|
+
onBulkUpload?: () => void;
|
|
376
|
+
}
|
|
377
|
+
|
|
378
|
+
export declare interface ExcelConfigProps<T = Record<string, unknown>> {
|
|
379
|
+
fileName: string;
|
|
380
|
+
sheetName: string;
|
|
381
|
+
data: T[];
|
|
382
|
+
columns: ColumnsProps<T>[];
|
|
383
|
+
buttonProps?: {
|
|
384
|
+
className?: string;
|
|
385
|
+
style?: React.CSSProperties;
|
|
386
|
+
text?: string;
|
|
387
|
+
};
|
|
388
|
+
}
|
|
389
|
+
|
|
390
|
+
export declare type FieldType = 'text' | 'email' | 'password' | 'number' | 'select' | 'textarea' | 'datepicker' | 'rangepicker' | 'time' | 'checkbox' | 'radio' | 'switch' | 'slider' | 'rate' | 'upload' | 'custom' | 'hidden';
|
|
391
|
+
|
|
392
|
+
export declare interface FilterItem {
|
|
393
|
+
text: string;
|
|
394
|
+
value: string | number | boolean;
|
|
395
|
+
children?: FilterItem[];
|
|
396
|
+
}
|
|
397
|
+
|
|
398
|
+
export declare interface FormField {
|
|
399
|
+
type: FieldType;
|
|
400
|
+
name: string;
|
|
401
|
+
label?: string;
|
|
402
|
+
min?: number | undefined;
|
|
403
|
+
max?: number | undefined;
|
|
404
|
+
step?: number | undefined;
|
|
405
|
+
validations?: Validations[];
|
|
406
|
+
options?: Options[];
|
|
407
|
+
placeholder?: string;
|
|
408
|
+
onChange?: (value: string | number) => void;
|
|
409
|
+
datepickerConfig?: DatepickerConfig;
|
|
410
|
+
selectConfig?: SelectConfig;
|
|
411
|
+
readonly?: boolean;
|
|
412
|
+
dependsOn?: SelectDependencyConfig;
|
|
413
|
+
checkboxConfig?: CheckboxConfig;
|
|
414
|
+
uploadConfig?: UploadConfig;
|
|
415
|
+
radioConfig?: RadioConfig;
|
|
416
|
+
hidden?: boolean;
|
|
417
|
+
}
|
|
418
|
+
|
|
419
|
+
/**
|
|
420
|
+
* Función para generar las columnas de una tabla a partir de un objeto de campos.
|
|
421
|
+
* @param fields Objeto de campos.
|
|
422
|
+
* @returns Arreglo de columnas con el tipo ColumnsProps<T>.
|
|
423
|
+
*/
|
|
424
|
+
export declare const generateColumns: <T extends object>(fields: Record<string, SharedFieldConfig>) => ColumnsProps<T>[];
|
|
425
|
+
|
|
426
|
+
/**
|
|
427
|
+
* Función para generar los campos de un formulario a partir de un objeto de campos.
|
|
428
|
+
* @param fields Objeto de campos.
|
|
429
|
+
* @returns Arreglo de campos con el tipo FormField[].
|
|
430
|
+
*/
|
|
431
|
+
export declare const generateFields: (fields: Record<string, SharedFieldConfig>) => FormField[];
|
|
432
|
+
|
|
433
|
+
export declare interface MoreActions<T = Record<string, unknown>> {
|
|
434
|
+
key: string;
|
|
435
|
+
label?: string;
|
|
436
|
+
tooltip?: string;
|
|
437
|
+
className?: string;
|
|
438
|
+
style?: React.CSSProperties;
|
|
439
|
+
icon?: React.ReactElement;
|
|
440
|
+
hidden?: (record: T) => boolean;
|
|
441
|
+
onClick: (record: T) => void;
|
|
442
|
+
}
|
|
443
|
+
|
|
444
|
+
declare type MutationConfig<TData, TError, TVariables> = {
|
|
445
|
+
onSuccess?: (data: TData) => void;
|
|
446
|
+
onError?: (error: TError) => void;
|
|
447
|
+
onMutate?: (variables: TVariables) => void;
|
|
448
|
+
onSettled?: (data: TData | undefined, error: TError | null) => void;
|
|
449
|
+
};
|
|
450
|
+
|
|
451
|
+
/**
|
|
452
|
+
* Componente de Notificación
|
|
453
|
+
* @description Muestra una notificación con un mensaje
|
|
454
|
+
* @param type Tipo de notificación
|
|
455
|
+
* @param message Mensaje de la notificación
|
|
456
|
+
* @param placement Posición de la notificación
|
|
457
|
+
* @example openNotification('success', 'Usuario creado', 'El usuario fue creado exitosamente');
|
|
458
|
+
*/
|
|
459
|
+
declare type NotificationType = 'success' | 'error' | 'info' | 'warning';
|
|
460
|
+
|
|
461
|
+
declare type OnCreateHandler<T = Record<string, unknown>> = ((values: T) => void) | (() => void);
|
|
462
|
+
|
|
463
|
+
export declare const openNotification: (type: NotificationType, message: string, description: string, placement?: placement) => void;
|
|
464
|
+
|
|
465
|
+
export declare interface Options {
|
|
466
|
+
label: string | React.ReactElement;
|
|
467
|
+
value: string | number | boolean;
|
|
468
|
+
disabled?: boolean;
|
|
469
|
+
}
|
|
470
|
+
|
|
471
|
+
declare type Permission = 'create' | 'read' | 'update' | 'delete' | 'view';
|
|
472
|
+
|
|
473
|
+
declare type PermissionAlias = 'c' | 'r' | 'u' | 'd' | 'v';
|
|
474
|
+
|
|
475
|
+
declare interface PermissionChecker {
|
|
476
|
+
canCreate: boolean;
|
|
477
|
+
canUpdate: boolean;
|
|
478
|
+
canDelete: boolean;
|
|
479
|
+
canView: boolean;
|
|
480
|
+
hasPermission: (permission: Permission | PermissionAlias) => boolean;
|
|
481
|
+
}
|
|
482
|
+
|
|
483
|
+
declare type PermissionConfig = Record<string, CrudPermissions>;
|
|
484
|
+
|
|
485
|
+
/**
|
|
486
|
+
* Predefined permission sets for easy configuration
|
|
487
|
+
*/
|
|
488
|
+
export declare const PERMISSIONS: {
|
|
489
|
+
readonly FULL_ACCESS: Permission[];
|
|
490
|
+
readonly READ_WRITE: Permission[];
|
|
491
|
+
readonly READ_ONLY: Permission[];
|
|
492
|
+
readonly VIEW_ONLY: Permission[];
|
|
493
|
+
readonly NO_ACCESS: Permission[];
|
|
494
|
+
};
|
|
495
|
+
|
|
496
|
+
declare type PermissionsConfig = Record<CrudName, Record<string, (Permission[] | PermissionAlias[])>>;
|
|
497
|
+
|
|
498
|
+
export declare const PermissionsProvider: ({ role, config, children }: PermissionsProviderProps) => JSX.Element;
|
|
499
|
+
|
|
500
|
+
declare interface PermissionsProviderProps {
|
|
501
|
+
role: string;
|
|
502
|
+
config: PermissionsConfig;
|
|
503
|
+
children: ReactNode;
|
|
504
|
+
}
|
|
505
|
+
|
|
506
|
+
export declare type PickerType = 'date' | 'week' | 'month' | 'quarter' | 'year' | undefined;
|
|
507
|
+
|
|
508
|
+
declare type placement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
|
|
509
|
+
|
|
510
|
+
declare type QueryConfig<TData, TError> = {
|
|
511
|
+
enabled?: boolean;
|
|
512
|
+
retry?: boolean | number;
|
|
513
|
+
staleTime?: number;
|
|
514
|
+
cacheTime?: number;
|
|
515
|
+
onSuccess?: (data: TData) => void;
|
|
516
|
+
onError?: (error: TError) => void;
|
|
517
|
+
};
|
|
518
|
+
|
|
519
|
+
export declare interface RadioConfig {
|
|
520
|
+
onChange?: (value: string | number) => void;
|
|
521
|
+
radioWidth?: string | number;
|
|
522
|
+
cols?: number;
|
|
523
|
+
}
|
|
524
|
+
|
|
525
|
+
export declare interface SearchConfig<T> {
|
|
526
|
+
searchableFields?: string[];
|
|
527
|
+
customSearch?: (item: T, term: string) => boolean;
|
|
528
|
+
}
|
|
529
|
+
|
|
530
|
+
export declare interface SelectConfig {
|
|
531
|
+
options?: Options[];
|
|
532
|
+
apiConfig?: {
|
|
533
|
+
url?: string;
|
|
534
|
+
getterMethod?: () => Promise<ApiResponse<unknown>>;
|
|
535
|
+
method?: string;
|
|
536
|
+
headers?: Record<string, string>;
|
|
537
|
+
params?: Record<string, string>;
|
|
538
|
+
valueKey: string;
|
|
539
|
+
labelKey: string;
|
|
540
|
+
responseDataPath?: string;
|
|
541
|
+
};
|
|
542
|
+
customOption?: CustomOption;
|
|
543
|
+
dependsOn?: SelectDependencyConfig;
|
|
544
|
+
onChange?: (value: string | number) => void;
|
|
545
|
+
}
|
|
546
|
+
|
|
547
|
+
export declare interface SelectDependencyConfig {
|
|
548
|
+
field: string;
|
|
549
|
+
apiUrl: string;
|
|
550
|
+
method: string;
|
|
551
|
+
headers?: Record<string, string>;
|
|
552
|
+
valueKey: string;
|
|
553
|
+
labelKey: string;
|
|
554
|
+
paramKey?: string;
|
|
555
|
+
idPlaceholder?: string;
|
|
556
|
+
placeholderTemplate?: string;
|
|
557
|
+
transformRequest?: (value: string | number) => Record<string, string>;
|
|
558
|
+
}
|
|
559
|
+
|
|
560
|
+
export declare interface SharedFieldConfig<T = Record<string, unknown>> {
|
|
561
|
+
key: string;
|
|
562
|
+
title: string;
|
|
563
|
+
label?: string;
|
|
564
|
+
placeholder?: string;
|
|
565
|
+
validations?: Validations[];
|
|
566
|
+
filtrers?: FilterItem[];
|
|
567
|
+
onFilter?: (value: boolean | React.Key, record: T & {
|
|
568
|
+
key: number;
|
|
569
|
+
}) => boolean;
|
|
570
|
+
width?: string | number;
|
|
571
|
+
datepickerConfig?: DatepickerConfig;
|
|
572
|
+
min?: number;
|
|
573
|
+
render?: <T extends string = string>(value: T) => React.ReactNode;
|
|
574
|
+
readonly?: boolean;
|
|
575
|
+
isHidden?: boolean;
|
|
576
|
+
hiddenInForm?: boolean;
|
|
577
|
+
type?: FieldType;
|
|
578
|
+
align?: "left" | "right" | "center";
|
|
579
|
+
icon?: React.ReactElement;
|
|
580
|
+
checkboxConfig?: CheckboxConfig;
|
|
581
|
+
selectConfig?: SelectConfig;
|
|
582
|
+
dependsOn?: SelectDependencyConfig;
|
|
583
|
+
max?: number;
|
|
584
|
+
step?: number;
|
|
585
|
+
options?: Array<{
|
|
586
|
+
label: string;
|
|
587
|
+
value: string | number;
|
|
588
|
+
}>;
|
|
589
|
+
sorter?: boolean;
|
|
590
|
+
onChange?: (value: string | number) => void;
|
|
591
|
+
uploadConfig?: UploadConfig;
|
|
592
|
+
radioConfig?: RadioConfig;
|
|
593
|
+
}
|
|
594
|
+
|
|
595
|
+
declare type SortFunction<T> = (a: T, b: T) => number;
|
|
596
|
+
|
|
597
|
+
/**
|
|
598
|
+
* Función para ordenar un arreglo de objetos por una propiedad específica.
|
|
599
|
+
* Soporta notación de punto para propiedades anidadas (ej: "user.first_name").
|
|
600
|
+
* @param key Propiedad por la que se va a ordenar.
|
|
601
|
+
* @returns Función de comparación para usar en el método `sort` de un arreglo.
|
|
602
|
+
*/
|
|
603
|
+
export declare const sortOrder: <T extends object>(key: keyof T | string) => SortFunction<T>;
|
|
604
|
+
|
|
605
|
+
export declare interface TemplateConfig {
|
|
606
|
+
entityName: string;
|
|
607
|
+
fields: TemplateField[];
|
|
608
|
+
includeExamples?: boolean;
|
|
609
|
+
sheetName?: string;
|
|
610
|
+
}
|
|
611
|
+
|
|
612
|
+
export declare interface TemplateField {
|
|
613
|
+
key: string;
|
|
614
|
+
label: string;
|
|
615
|
+
example?: string;
|
|
616
|
+
required?: boolean;
|
|
617
|
+
type?: "text" | "email" | "number" | "date" | "boolean";
|
|
618
|
+
}
|
|
619
|
+
|
|
620
|
+
export declare interface ThemeConfig {
|
|
621
|
+
token?: {
|
|
622
|
+
colorPrimary?: string;
|
|
623
|
+
colorPrimaryHover?: string;
|
|
624
|
+
};
|
|
625
|
+
components?: {
|
|
626
|
+
Table?: {
|
|
627
|
+
headerBg?: string;
|
|
628
|
+
colorTextHeading?: string;
|
|
629
|
+
stickyScrollBar?: string;
|
|
630
|
+
rowHoverBg?: string;
|
|
631
|
+
};
|
|
632
|
+
};
|
|
633
|
+
}
|
|
634
|
+
|
|
635
|
+
export declare const Title: ({ level, children, className, style }: CustomTitleProps) => JSX.Element;
|
|
636
|
+
|
|
637
|
+
declare interface UploadConfig {
|
|
638
|
+
textButton?: string;
|
|
639
|
+
iconButton?: string;
|
|
640
|
+
accept?: string;
|
|
641
|
+
multiple?: boolean;
|
|
642
|
+
maxSize?: number;
|
|
643
|
+
maxCount?: number;
|
|
644
|
+
name?: string;
|
|
645
|
+
action?: string;
|
|
646
|
+
beforeUpload?: (file: File) => boolean;
|
|
647
|
+
onChange?: (info: any) => void;
|
|
648
|
+
customRequest?: (options: any) => void;
|
|
649
|
+
responseTransform?: (response: any) => string;
|
|
650
|
+
formData?: boolean;
|
|
651
|
+
formDataName?: string;
|
|
652
|
+
headers?: Record<string, string>;
|
|
653
|
+
listType?: 'text' | 'picture' | 'picture-card';
|
|
654
|
+
renderPreview?: (value: string) => React.ReactNode;
|
|
655
|
+
}
|
|
656
|
+
|
|
657
|
+
/**
|
|
658
|
+
* Custom hook to handle asynchronous operations.
|
|
659
|
+
*
|
|
660
|
+
* @template T - The type of the data returned by the async function.
|
|
661
|
+
* @param {() => Promise<T>} asyncFunction - The asynchronous function to execute.
|
|
662
|
+
* @param {unknown[]} [dependencies] - Optional array of dependencies for the useEffect hook.
|
|
663
|
+
* @returns {{ data: T | undefined, error: Error | null, loading: boolean }} - An object containing the data, error, and loading state.
|
|
664
|
+
*/
|
|
665
|
+
export declare const useAsync: <T>(asyncFunction: () => Promise<T>, dependencies?: unknown[]) => {
|
|
666
|
+
data: T | undefined;
|
|
667
|
+
error: Error | null;
|
|
668
|
+
loading: boolean;
|
|
669
|
+
};
|
|
670
|
+
|
|
671
|
+
export declare function useCrudOperations<T extends {
|
|
672
|
+
[key: string]: any;
|
|
673
|
+
}, CreateT = Omit<T, 'id'>>({ getAll, create, update, delete: deleteItem, idField, entityName, }: CrudOperations<T, CreateT>): {
|
|
674
|
+
data: T[];
|
|
675
|
+
isLoading: boolean;
|
|
676
|
+
refetch: (options?: RefetchOptions) => Promise<QueryObserverResult<T[], Error>>;
|
|
677
|
+
handleCreate: (values: Record<string, unknown>) => Promise<T>;
|
|
678
|
+
handleUpdate: (record: unknown) => Promise<T>;
|
|
679
|
+
handleDelete: (record: unknown) => Promise<T>;
|
|
680
|
+
createItemAsync: UseMutateAsyncFunction<T, Error, CreateT, unknown>;
|
|
681
|
+
updateItemAsync: UseMutateAsyncFunction<T, Error, T, unknown>;
|
|
682
|
+
deleteItemAsync: UseMutateAsyncFunction<T, Error, T, unknown>;
|
|
683
|
+
};
|
|
684
|
+
|
|
685
|
+
/**
|
|
686
|
+
* Use Mutation Fetch Hook
|
|
687
|
+
* @param queryKey - The query key.
|
|
688
|
+
* @param mutationFn - The mutation function.
|
|
689
|
+
* @param config - The mutation configuration.
|
|
690
|
+
* @returns The mutation result.
|
|
691
|
+
* @template TData - The mutation data type.
|
|
692
|
+
* @template TError - The mutation error type.
|
|
693
|
+
* @template TVariables - The mutation variables type.
|
|
694
|
+
* @example
|
|
695
|
+
* const { mutateAsync: createItemAsync } = useMutationFetch<T, Error, CreateT>({
|
|
696
|
+
* queryKey: KEY,
|
|
697
|
+
* mutationFn: async (item: CreateT) => {
|
|
698
|
+
* const response = await create(item);
|
|
699
|
+
* return response.data;
|
|
700
|
+
* },
|
|
701
|
+
* config: getMutationConfig('creado'),
|
|
702
|
+
* });
|
|
703
|
+
* @see https://tanstack.com/query/latest/docs/framework/react/mutations
|
|
704
|
+
*/
|
|
705
|
+
export declare const useMutationFetch: <TData, TError = Error, TVariables = unknown>({ queryKey, mutationFn, config }: {
|
|
706
|
+
queryKey: QueryKey;
|
|
707
|
+
mutationFn: (variables: TVariables) => Promise<TData>;
|
|
708
|
+
config?: MutationConfig<TData, TError, TVariables>;
|
|
709
|
+
}) => UseMutationResult<TData, TError, TVariables, unknown>;
|
|
710
|
+
|
|
711
|
+
export declare const usePermissions: (crudName?: string, directPermissions?: DirectPermissions) => PermissionChecker;
|
|
712
|
+
|
|
713
|
+
export declare const useQueryFetch: <TData, TError = Error>({ queryKey, queryFn, config }: {
|
|
714
|
+
queryKey: QueryKey;
|
|
715
|
+
queryFn: () => Promise<TData>;
|
|
716
|
+
config?: QueryConfig<TData, TError>;
|
|
717
|
+
}) => UseQueryResult<TData, TError>;
|
|
718
|
+
|
|
719
|
+
export declare interface Validations {
|
|
720
|
+
required?: boolean | {
|
|
721
|
+
value: boolean;
|
|
722
|
+
message?: string;
|
|
723
|
+
};
|
|
724
|
+
regex?: {
|
|
725
|
+
pattern: string;
|
|
726
|
+
message?: string;
|
|
727
|
+
};
|
|
728
|
+
min?: {
|
|
729
|
+
value: number;
|
|
730
|
+
message?: string;
|
|
731
|
+
};
|
|
732
|
+
max?: {
|
|
733
|
+
value: number;
|
|
734
|
+
message?: string;
|
|
735
|
+
};
|
|
736
|
+
email?: {
|
|
737
|
+
value: boolean;
|
|
738
|
+
message?: string;
|
|
739
|
+
};
|
|
740
|
+
isGreaterThan?: {
|
|
741
|
+
target: string;
|
|
742
|
+
message: string;
|
|
743
|
+
};
|
|
744
|
+
isLessThan?: {
|
|
745
|
+
target: string;
|
|
746
|
+
message: string;
|
|
747
|
+
};
|
|
748
|
+
custom?: {
|
|
749
|
+
isValid: (value: any) => boolean;
|
|
750
|
+
message: string;
|
|
751
|
+
};
|
|
752
|
+
}
|
|
753
|
+
|
|
754
|
+
export { }
|