@scmlatam/web-ui 0.2.17 → 0.2.19
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/dist/images/search.svg +3 -0
- package/dist/src/components/rb.d.ts +2 -2
- package/dist/src/pages/home/rb/sections/ConfirmDialogSection.d.ts +1 -0
- package/dist/src/rb-components/images.d.ts +1 -0
- package/dist/src/rb-components/table/toolbar/RbToolbarActionButton.d.ts +1 -12
- package/dist/src/rb-components/ui/index.d.ts +2 -0
- package/dist/src/rb-components/ui/overlays/ConfirmDialog.d.ts +105 -0
- package/dist/src/rb-components/ui/primitives/AutoCustomCompleteField.d.ts +1 -1
- package/dist/src/rb-components/ui/primitives/date-fields/CustomDateRangePicker.d.ts +12 -3
- package/dist/web-ui.js +4142 -3862
- package/dist/web-ui.umd.cjs +105 -79
- package/package.json +1 -1
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M9.5 16C7.68333 16 6.146 15.3707 4.888 14.112C3.63 12.8533 3.00067 11.316 3 9.5C2.99933 7.684 3.62867 6.14667 4.888 4.888C6.14733 3.62933 7.68467 3 9.5 3C11.3153 3 12.853 3.62933 14.113 4.888C15.373 6.14667 16.002 7.684 16 9.5C16 10.2333 15.8833 10.925 15.65 11.575C15.4167 12.225 15.1 12.8 14.7 13.3L20.3 18.9C20.4833 19.0833 20.575 19.3167 20.575 19.6C20.575 19.8833 20.4833 20.1167 20.3 20.3C20.1167 20.4833 19.8833 20.575 19.6 20.575C19.3167 20.575 19.0833 20.4833 18.9 20.3L13.3 14.7C12.8 15.1 12.225 15.4167 11.575 15.65C10.925 15.8833 10.2333 16 9.5 16ZM9.5 14C10.75 14 11.8127 13.5627 12.688 12.688C13.5633 11.8133 14.0007 10.7507 14 9.5C13.9993 8.24933 13.562 7.187 12.688 6.313C11.814 5.439 10.7513 5.00133 9.5 5C8.24867 4.99867 7.18633 5.43633 6.313 6.313C5.43967 7.18967 5.002 8.252 5 9.5C4.998 10.748 5.43567 11.8107 6.313 12.688C7.19033 13.5653 8.25267 14.0027 9.5 14Z" fill="#F0C400"/>
|
|
3
|
+
</svg>
|
|
@@ -10,8 +10,8 @@ export { RbList, RbListItem } from '../rb-components/list';
|
|
|
10
10
|
export type { RbListItemProps, RbListProps, RbListSize, RbListVariant, } from '../rb-components/list';
|
|
11
11
|
export { PillsTabs, PillsTabs as RbPillsTabs, } from '../rb-components/navigation';
|
|
12
12
|
export type { PillsTabItem, PillsTabsProps } from '../rb-components/navigation';
|
|
13
|
-
export { Button as RBButton, Input, AutoCustomCompleteField, CustomDatefield, CustomDatePicker, CustomTimefield, CustomDateRangefield, CustomDateRangePicker, CustomDateRangeCalendar, RbInlineChipField, CalendarChipIcon, ClockChipIcon, Card, CardHeader, CardTitle, CardContent, CardFooter, IconButton as RbIconButton, Tooltip, Portal, RbContextMenu, Checkbox, Radio, cn, } from '../rb-components/ui';
|
|
14
|
-
export type { AutoValueItem, ButtonProps as RBButtonProps, InputProps, CustomAutoCompleteFieldProps, CustomDatefieldProps, CustomDatePickerProps, CustomTimefieldProps, CustomDateRangefieldProps, CustomDateRangePickerProps, CustomDateRangeCalendarProps, RbInlineChipFieldProps, RbInlineChipFieldAction, RbContextMenuAlign, RbContextMenuItem, RbContextMenuPosition, RbContextMenuProps, RbContextMenuVariant, CardProps, IconButtonProps as RbIconButtonProps, CheckboxProps, CheckboxSize, RadioProps, PortalProps, TooltipProps, } from '../rb-components/ui';
|
|
13
|
+
export { Button as RBButton, Input, AutoCustomCompleteField, CustomDatefield, CustomDatePicker, CustomTimefield, CustomDateRangefield, CustomDateRangePicker, CustomDateRangeCalendar, RbInlineChipField, CalendarChipIcon, ClockChipIcon, Card, CardHeader, CardTitle, CardContent, CardFooter, IconButton as RbIconButton, Tooltip, Portal, ConfirmDialog, RbContextMenu, Checkbox, Radio, cn, } from '../rb-components/ui';
|
|
14
|
+
export type { AutoValueItem, ButtonProps as RBButtonProps, InputProps, CustomAutoCompleteFieldProps, CustomDatefieldProps, CustomDatePickerProps, CustomTimefieldProps, CustomDateRangefieldProps, CustomDateRangePickerProps, CustomDateRangeCalendarProps, RbInlineChipFieldProps, RbInlineChipFieldAction, RbContextMenuAlign, RbContextMenuItem, RbContextMenuPosition, RbContextMenuProps, RbContextMenuVariant, CardProps, IconButtonProps as RbIconButtonProps, CheckboxProps, CheckboxSize, RadioProps, PortalProps, TooltipProps, ConfirmDialogProps, ConfirmDialogInitialFocus, ConfirmDialogIconType, } from '../rb-components/ui';
|
|
15
15
|
export { RbTable, RbExcelTable, RbTableToolbar, RbToolbarActionButton, RbToolbarActions, RbToolbarDateRangeField, RbToolbarMultiSelectField, RbToolbarSearchField, RbToolbarSelectField, formatRbExcelDate, formatRbExcelTime, getRbExcelValueAtPath, isRbExcelEmptyValue, isValidRbExcelDate, isValidRbExcelNumber, isValidRbExcelTime, parseRbExcelValue, setRbExcelValueAtPath, } from '../rb-components/table';
|
|
16
16
|
export type { RbExcelCellContext, RbExcelCreateRowContext, RbExcelEditorContext, RbExcelFieldType, RbExcelImportContext, RbExcelParseContext, RbExcelRenderContext, RbExcelRowsChangeMeta, RbExcelRowsChangeSource, RbExcelTableActions, RbExcelTableColumn, RbExcelTableLabels, RbExcelTableProps, RbExcelTableRef, RbExcelValidationError, RbExcelValidationErrorInput, RbExcelValidationErrorSource, RbExcelValidationResult, RbExcelValueSource, RbTableColumn, RbTableRowId, RbTableProps, RbTableCellParams, RbTableRowParams, RbTableInitialState, RbTablePinnedColumns, RbTableBaseRow, RbTableSize, RbTableDensity, RbTableAlign, RbTableCellContextMenuParams, RbTableCellContextMenuPosition, RbTablePaginationMode, RbTablePaginationModel, RbRowSelectionModel, RbRowsPerPageOption, RbToolbarActionsProps, RbToolbarDateRangeFieldProps, RbToolbarDateRangeValue, RbAnyTableColumn, RbLegacyGridColumn, } from '../rb-components/table';
|
|
17
17
|
export { DashboardShell, ShellContent } from '../rb-components/shell';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function ConfirmDialogSection(): import("react").JSX.Element;
|
|
@@ -1,20 +1,9 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
export type RbToolbarActionButtonVariant = "secondaryPrimary" | "icon";
|
|
2
|
+
export type RbToolbarActionButtonVariant = "secondaryPrimary" | "icon" | "outlinedIcon";
|
|
3
3
|
export type RbToolbarActionButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
4
4
|
variant?: RbToolbarActionButtonVariant;
|
|
5
5
|
icon?: React.ReactNode;
|
|
6
6
|
loading?: boolean;
|
|
7
7
|
};
|
|
8
|
-
/**
|
|
9
|
-
* Acción utilizable dentro de RbTableToolbar.
|
|
10
|
-
*
|
|
11
|
-
* data-toolbar-action permite que el layout de la
|
|
12
|
-
* toolbar reconozca una acción incluso cuando el
|
|
13
|
-
* componente está envuelto por Tooltip u otro
|
|
14
|
-
* elemento intermedio.
|
|
15
|
-
*
|
|
16
|
-
* Las acciones mantienen su tamaño natural y no
|
|
17
|
-
* utilizan el sizing flexible de los filtros.
|
|
18
|
-
*/
|
|
19
8
|
export declare function RbToolbarActionButton({ children, icon, loading, disabled, variant, className, type, ...props }: RbToolbarActionButtonProps): React.JSX.Element;
|
|
20
9
|
export default RbToolbarActionButton;
|
|
@@ -34,3 +34,5 @@ export { default as Portal, } from './overlays/Portal';
|
|
|
34
34
|
export type { PortalProps, } from './overlays/Portal';
|
|
35
35
|
export { default as Tooltip, } from './overlays/Tooltip';
|
|
36
36
|
export type { TooltipProps, } from './overlays/Tooltip';
|
|
37
|
+
export { default as ConfirmDialog, } from './overlays/ConfirmDialog';
|
|
38
|
+
export type { ConfirmDialogProps, ConfirmDialogInitialFocus, ConfirmDialogIconType, } from './overlays/ConfirmDialog';
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import { default as React, ReactNode } from 'react';
|
|
2
|
+
import { ButtonProps } from '../primitives/Button';
|
|
3
|
+
export type ConfirmDialogInitialFocus = "cancel" | "confirm" | "dialog";
|
|
4
|
+
export type ConfirmDialogIconType = "info" | "error" | "warning" | "success" | "suggestion";
|
|
5
|
+
export interface ConfirmDialogProps {
|
|
6
|
+
/**
|
|
7
|
+
* Controla si el diálogo está visible.
|
|
8
|
+
*/
|
|
9
|
+
open: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* Título principal del diálogo.
|
|
12
|
+
*/
|
|
13
|
+
title?: ReactNode;
|
|
14
|
+
/**
|
|
15
|
+
* Mensaje o contenido descriptivo.
|
|
16
|
+
*/
|
|
17
|
+
message?: ReactNode;
|
|
18
|
+
/**
|
|
19
|
+
* Ícono personalizado mostrado junto al título.
|
|
20
|
+
*
|
|
21
|
+
* Si se entrega icon, tiene prioridad sobre iconType.
|
|
22
|
+
*/
|
|
23
|
+
icon?: ReactNode;
|
|
24
|
+
/**
|
|
25
|
+
* Ícono semántico estándar de la librería.
|
|
26
|
+
*/
|
|
27
|
+
iconType?: ConfirmDialogIconType;
|
|
28
|
+
/**
|
|
29
|
+
* Texto del botón de confirmación.
|
|
30
|
+
*/
|
|
31
|
+
confirmText?: ReactNode;
|
|
32
|
+
/**
|
|
33
|
+
* Texto del botón de cancelación.
|
|
34
|
+
*/
|
|
35
|
+
cancelText?: ReactNode;
|
|
36
|
+
/**
|
|
37
|
+
* Define si se muestra el botón de cancelación.
|
|
38
|
+
*
|
|
39
|
+
* Útil para diálogos informativos o de error
|
|
40
|
+
* que solamente requieren una acción,
|
|
41
|
+
* por ejemplo "Entendido".
|
|
42
|
+
*
|
|
43
|
+
* @default true
|
|
44
|
+
*/
|
|
45
|
+
showCancel?: boolean;
|
|
46
|
+
/**
|
|
47
|
+
* Indica que la acción de confirmación
|
|
48
|
+
* se encuentra ejecutándose.
|
|
49
|
+
*/
|
|
50
|
+
loading?: boolean;
|
|
51
|
+
/**
|
|
52
|
+
* Texto mostrado mientras loading está activo.
|
|
53
|
+
*/
|
|
54
|
+
loadingText?: ReactNode;
|
|
55
|
+
/**
|
|
56
|
+
* Acción ejecutada al confirmar.
|
|
57
|
+
*/
|
|
58
|
+
onConfirm: () => void | Promise<void>;
|
|
59
|
+
/**
|
|
60
|
+
* Acción ejecutada al cerrar o cancelar.
|
|
61
|
+
*/
|
|
62
|
+
onClose: () => void;
|
|
63
|
+
/**
|
|
64
|
+
* Variante visual del botón principal.
|
|
65
|
+
*/
|
|
66
|
+
confirmVariant?: ButtonProps["variant"];
|
|
67
|
+
/**
|
|
68
|
+
* Variante visual del botón cancelar.
|
|
69
|
+
*/
|
|
70
|
+
cancelVariant?: ButtonProps["variant"];
|
|
71
|
+
/**
|
|
72
|
+
* Permite cerrar con Escape.
|
|
73
|
+
*/
|
|
74
|
+
closeOnEscape?: boolean;
|
|
75
|
+
/**
|
|
76
|
+
* Permite cerrar haciendo clic
|
|
77
|
+
* directamente sobre el backdrop.
|
|
78
|
+
*/
|
|
79
|
+
closeOnBackdrop?: boolean;
|
|
80
|
+
/**
|
|
81
|
+
* Define dónde queda el foco
|
|
82
|
+
* cuando se abre el diálogo.
|
|
83
|
+
*
|
|
84
|
+
* Si se utiliza "cancel" pero showCancel
|
|
85
|
+
* es false, el foco pasa automáticamente
|
|
86
|
+
* al botón de confirmación.
|
|
87
|
+
*/
|
|
88
|
+
initialFocus?: ConfirmDialogInitialFocus;
|
|
89
|
+
/**
|
|
90
|
+
* Nombre accesible utilizado cuando
|
|
91
|
+
* no existe un título visible.
|
|
92
|
+
*/
|
|
93
|
+
ariaLabel?: string;
|
|
94
|
+
/**
|
|
95
|
+
* Permite extender estilos del contenedor.
|
|
96
|
+
*/
|
|
97
|
+
className?: string;
|
|
98
|
+
/**
|
|
99
|
+
* Permite extender estilos del contenedor
|
|
100
|
+
* del ícono.
|
|
101
|
+
*/
|
|
102
|
+
iconClassName?: string;
|
|
103
|
+
}
|
|
104
|
+
export declare function ConfirmDialog({ open, title, message, icon, iconType, confirmText, cancelText, showCancel, loading, loadingText, onConfirm, onClose, confirmVariant, cancelVariant, closeOnEscape, closeOnBackdrop, initialFocus, ariaLabel, className, iconClassName, }: ConfirmDialogProps): React.JSX.Element | null;
|
|
105
|
+
export default ConfirmDialog;
|
|
@@ -74,4 +74,4 @@ interface CustomAutoCompleteMultipleProps extends CustomAutoCompleteBaseProps {
|
|
|
74
74
|
}
|
|
75
75
|
export type CustomAutoCompleteFieldProps = CustomAutoCompleteSingleProps | CustomAutoCompleteMultipleProps;
|
|
76
76
|
declare const AutoCustomCompleteField: (props: CustomAutoCompleteFieldProps) => React.JSX.Element;
|
|
77
|
-
export { AutoCustomCompleteField };
|
|
77
|
+
export { AutoCustomCompleteField, };
|
|
@@ -2,9 +2,18 @@ import { default as React } from 'react';
|
|
|
2
2
|
import { Dayjs } from 'dayjs';
|
|
3
3
|
export interface CustomDateRangePickerProps {
|
|
4
4
|
label: string;
|
|
5
|
-
initialValue: [
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
initialValue: [
|
|
6
|
+
Dayjs | null,
|
|
7
|
+
Dayjs | null
|
|
8
|
+
];
|
|
9
|
+
value: [
|
|
10
|
+
Dayjs | null,
|
|
11
|
+
Dayjs | null
|
|
12
|
+
];
|
|
13
|
+
setValue: (newValue: [
|
|
14
|
+
Dayjs | null,
|
|
15
|
+
Dayjs | null
|
|
16
|
+
]) => void;
|
|
8
17
|
calendars: 1 | 2 | 3;
|
|
9
18
|
disabled: boolean;
|
|
10
19
|
white: boolean;
|