@scmlatam/web-ui 0.2.38 → 0.2.42
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/src/components/rb.d.ts +7 -7
- package/dist/src/pages/Fechas.d.ts +3 -0
- package/dist/src/pages/home/rb/components/VirtualTreePlayground.d.ts +1 -0
- package/dist/src/pages/home/rb/data/virtualTreeData.d.ts +6 -0
- package/dist/src/pages/home/rb/sections/TabPanelSection.d.ts +1 -0
- package/dist/src/rb-components/form/FormShell.d.ts +2 -1
- package/dist/src/rb-components/navigation/TabPanel.d.ts +49 -0
- package/dist/src/rb-components/navigation/index.d.ts +3 -0
- package/dist/src/rb-components/table/RbTable.d.ts +1 -1
- package/dist/src/rb-components/table/types.d.ts +19 -0
- package/dist/src/rb-components/timeline/Timeline.d.ts +1 -1
- package/dist/src/rb-components/timeline/index.d.ts +1 -1
- package/dist/src/rb-components/timeline/timeline.types.d.ts +17 -0
- package/dist/src/rb-components/timeline/timelineLayout.d.ts +4 -0
- package/dist/src/rb-components/tree-panel/VirtualTree.d.ts +3 -0
- package/dist/src/rb-components/tree-panel/index.d.ts +6 -1
- package/dist/src/rb-components/tree-panel/useVirtualTreeState.d.ts +27 -0
- package/dist/src/rb-components/tree-panel/virtualTree.types.d.ts +69 -0
- package/dist/src/rb-components/tree-panel/virtualTree.utils.d.ts +17 -0
- package/dist/src/rb-components/tree-panel/virtualTree.utils.test.d.ts +1 -0
- package/dist/src/rb-components/ui/index.d.ts +4 -2
- package/dist/src/rb-components/ui/overlays/Tooltip.d.ts +2 -1
- package/dist/src/rb-components/ui/primitives/AutoCustomCompleteField.d.ts +22 -0
- package/dist/src/rb-components/ui/primitives/Calendario.d.ts +60 -0
- package/dist/src/rb-components/ui/primitives/Input.d.ts +1 -0
- package/dist/src/rb-components/ui/primitives/date-fields/CustomDateControl.d.ts +41 -0
- package/dist/src/rb-components/ui/primitives/date-fields/CustomDatePicker.d.ts +4 -1
- package/dist/src/rb-components/ui/primitives/date-fields/CustomDateRangePicker.d.ts +5 -13
- package/dist/src/rb-components/ui/primitives/date-fields/CustomDateRangefield.d.ts +2 -1
- package/dist/src/rb-components/ui/primitives/date-fields/CustomDatefield.d.ts +4 -1
- package/dist/src/rb-components/ui/primitives/date-fields/CustomIndefiniteDatePicker/CustomDatePicker.d.ts +4 -1
- package/dist/src/rb-components/ui/primitives/date-fields/CustomIndefiniteDatePicker/YearGrid.d.ts +2 -1
- package/dist/src/rb-components/ui/primitives/date-fields/CustomTimefield.d.ts +2 -1
- package/dist/src/rb-components/ui/primitives/date-fields/DateFieldTrigger.d.ts +4 -0
- package/dist/src/rb-components/ui/primitives/date-fields/DateInputTrigger.d.ts +2 -0
- package/dist/src/rb-components/ui/primitives/date-fields/TimeFieldTrigger.d.ts +1 -0
- package/dist/src/rb-components/ui/primitives/date-fields/dateUtils.d.ts +6 -0
- package/dist/src/rb-components/ui/primitives/date-fields/index.d.ts +2 -0
- package/dist/src/rb-components/ui/primitives/date-fields/useDatePopover.d.ts +1 -0
- package/dist/web-ui.js +9740 -9099
- package/dist/web-ui.umd.cjs +80 -84
- package/package.json +1 -1
|
@@ -8,18 +8,18 @@ export { FormField, FormGrid, FormShell } from '../rb-components/form';
|
|
|
8
8
|
export type { FormFieldProps, FormFieldSpan, FormGridColumnGap, FormGridProps, FormGridRowGap, FormShellProps, FormShellSize, } from '../rb-components/form';
|
|
9
9
|
export { RbList, RbListItem } from '../rb-components/list';
|
|
10
10
|
export type { RbListItemProps, RbListProps, RbListSize, RbListVariant, } from '../rb-components/list';
|
|
11
|
-
export { PillsTabs, PillsTabs as RbPillsTabs, } from '../rb-components/navigation';
|
|
12
|
-
export type { PillsTabItem, PillsTabsProps } from '../rb-components/navigation';
|
|
13
|
-
export { Button as RBButton, Input, AutoCustomCompleteField, CustomDatefield, CustomDatePicker, CustomTimefield, CustomDateRangefield, CustomDateRangePicker, CustomDateRangeCalendar, CustomIndefiniteDatePicker, RbInlineChipField, CalendarChipIcon, ClockChipIcon, Card, CardHeader, CardTitle, CardContent, CardFooter, IconButton as RbIconButton, Tooltip, Portal, ConfirmDialog, RbContextMenu, Checkbox, Radio, RbStepper, cn, } from '../rb-components/ui';
|
|
14
|
-
export type { AutoValueItem, ButtonProps as RBButtonProps, InputProps, CustomAutoCompleteFieldProps, CustomDatefieldProps, CustomDatePickerProps, CustomTimefieldProps, CustomDateRangefieldProps, CustomDateRangePickerProps, CustomDateRangeCalendarProps, CustomIndefiniteDatePickerProps, RbInlineChipFieldProps, RbInlineChipFieldAction, RbContextMenuAlign, RbContextMenuItem, RbContextMenuPosition, RbContextMenuProps, RbContextMenuVariant, CardProps, IconButtonProps as RbIconButtonProps, CheckboxProps, CheckboxSize, RadioProps, RbStepperProps, RbStepperStep, PortalProps, TooltipProps, ConfirmDialogProps, ConfirmDialogInitialFocus, ConfirmDialogIconType, } from '../rb-components/ui';
|
|
11
|
+
export { PillsTabs, PillsTabs as RbPillsTabs, TabPanel, TabPanel as RbTabPanel, } from '../rb-components/navigation';
|
|
12
|
+
export type { PillsTabItem, PillsTabsProps, TabPanelItem, TabPanelProps, } from '../rb-components/navigation';
|
|
13
|
+
export { Button as RBButton, Input, AutoCustomCompleteField, CustomDatefield, CustomDatePicker, CustomTimefield, CustomDateRangefield, CustomDateRangePicker, CustomDateRangeCalendar, CustomIndefiniteDatePicker, CustomDateControl, RbInlineChipField, CalendarChipIcon, ClockChipIcon, Card, CardHeader, CardTitle, CardContent, CardFooter, IconButton as RbIconButton, Tooltip, Portal, ConfirmDialog, RbContextMenu, Checkbox, Radio, RbStepper, cn, } from '../rb-components/ui';
|
|
14
|
+
export type { AutoValueItem, ButtonProps as RBButtonProps, InputProps, CustomAutoCompleteFieldProps, CustomDatefieldProps, CustomDatePickerProps, CustomTimefieldProps, CustomDateRangefieldProps, CustomDateRangePickerProps, CustomDateRangeCalendarProps, CustomIndefiniteDatePickerProps, CustomDateControlProps, RbInlineChipFieldProps, RbInlineChipFieldAction, RbContextMenuAlign, RbContextMenuItem, RbContextMenuPosition, RbContextMenuProps, RbContextMenuVariant, CardProps, IconButtonProps as RbIconButtonProps, CheckboxProps, CheckboxSize, RadioProps, RbStepperProps, RbStepperStep, 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';
|
|
18
18
|
export { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, } from '../rb-components/sidebar';
|
|
19
19
|
export { TopBar, TopBarUserMenu } from '../rb-components/topbar';
|
|
20
|
-
export { TreePanel, findNodeById, flattenTree, getExpandableNodeIds, getNodeSelectionState, getSelectableDescendantIds, getSelectableSubtreeIds, hasNodeChildren, isNodeSelectable, isNodeSelectionMutable, normalizeHierarchicalSelection, toggleExpandedNode, toggleNodeSelection, } from '../rb-components/tree-panel';
|
|
21
|
-
export type { GetSelectableSubtreeOptions, TreePanelExpandedChangeDetails, TreePanelIdCollection, TreePanelNode, TreePanelNodeId, TreePanelProps, TreePanelRenderNodeParams, TreePanelSelectionChangeDetails, TreePanelSelectionState, } from '../rb-components/tree-panel';
|
|
20
|
+
export { TreePanel, VirtualTree, findNodeById, flattenTree, getExpandableNodeIds, getNodeSelectionState, getSelectableDescendantIds, getSelectableSubtreeIds, hasNodeChildren, isNodeSelectable, isNodeSelectionMutable, normalizeHierarchicalSelection, toggleExpandedNode, toggleNodeSelection, buildVirtualTreeIndex, filterVirtualTreeItems, getVirtualTreeAncestorIds, getVisibleVirtualTreeItems, normalizeVirtualTreeSearch, normalizeVirtualTreeSelection, toggleVirtualTreeSelection, useVirtualTreeState, } from '../rb-components/tree-panel';
|
|
21
|
+
export type { GetSelectableSubtreeOptions, TreePanelExpandedChangeDetails, TreePanelIdCollection, TreePanelNode, TreePanelNodeId, TreePanelProps, TreePanelRenderNodeParams, TreePanelSelectionChangeDetails, TreePanelSelectionState, VirtualTreeApiRef, VirtualTreeExpandedChangeDetails, VirtualTreeFlatItem, VirtualTreeIdCollection, VirtualTreeIndex, VirtualTreeNode, VirtualTreeNodeId, VirtualTreeNodeType, VirtualTreeProps, VirtualTreeSelectionChangeDetails, VirtualTreeSelectionMode, } from '../rb-components/tree-panel';
|
|
22
22
|
export { getRbImageUrl, rbImages } from '../rb-components/images';
|
|
23
23
|
export type { RbImageName } from '../rb-components/images';
|
|
24
24
|
export { Timeline } from '../rb-components/timeline';
|
|
25
|
-
export type { TimelineProps, TimelineSegment, TimelineBoundary, TimelineBoundaryClickArgs, TimelineSegmentClickArgs, TimelineBoundaryChangeArgs, TimelineSegmentId, } from '../rb-components/timeline';
|
|
25
|
+
export type { TimelineProps, TimelineCompactRange, TimelineSegment, TimelineBoundary, TimelineBoundaryClickArgs, TimelineSegmentClickArgs, TimelineBoundaryChangeArgs, TimelineSegmentId, } from '../rb-components/timeline';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function VirtualTreePlayground(): import("react").JSX.Element;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { VirtualTreeNode } from '../../../../rb-components/tree-panel';
|
|
2
|
+
export interface VirtualTreeDemoValue {
|
|
3
|
+
code: string;
|
|
4
|
+
category: "subcompany" | "area" | "work_position";
|
|
5
|
+
}
|
|
6
|
+
export declare const VIRTUAL_TREE_DEMO_ITEMS: VirtualTreeNode<VirtualTreeDemoValue>[];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function TabPanelSection(): import("react").JSX.Element;
|
|
@@ -33,6 +33,7 @@ export interface FormShellProps {
|
|
|
33
33
|
headerClassName?: string;
|
|
34
34
|
bodyClassName?: string;
|
|
35
35
|
footerClassName?: string;
|
|
36
|
+
marginY?: number;
|
|
36
37
|
}
|
|
37
|
-
export declare function FormShell({ open, title, ariaLabel, alert, children, footer, onClose, loading, loadingLabel, closeLabel, size, draggable, closeOnEscape, closeOnBackdrop, className, headerClassName, bodyClassName, footerClassName, }: FormShellProps): React.JSX.Element | null;
|
|
38
|
+
export declare function FormShell({ open, title, ariaLabel, alert, children, footer, onClose, loading, loadingLabel, closeLabel, size, draggable, closeOnEscape, closeOnBackdrop, className, headerClassName, bodyClassName, footerClassName, marginY, }: FormShellProps): React.JSX.Element | null;
|
|
38
39
|
export default FormShell;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* ----------------------------------------------------------------------------
|
|
4
|
+
* TAB PANEL
|
|
5
|
+
* ----------------------------------------------------------------------------
|
|
6
|
+
*
|
|
7
|
+
* Tarjeta blanca con pestañas tipo píldora sueltas (fondo gris claro y la
|
|
8
|
+
* pestaña activa en base-dark) y un botón opcional para cerrar el panel.
|
|
9
|
+
*
|
|
10
|
+
* Objetivo:
|
|
11
|
+
* - No depende de MUI.
|
|
12
|
+
* - No decide qué contenido renderizar debajo de las pestañas.
|
|
13
|
+
* - Solo renderiza las pestañas, notifica el tab activo con onChange y
|
|
14
|
+
* expone onClose para el botón de cierre.
|
|
15
|
+
*
|
|
16
|
+
* Uso:
|
|
17
|
+
*
|
|
18
|
+
* const [tab, setTab] = useState("auditoria");
|
|
19
|
+
*
|
|
20
|
+
* <TabPanel
|
|
21
|
+
* value={tab}
|
|
22
|
+
* onChange={setTab}
|
|
23
|
+
* onClose={() => setOpen(false)}
|
|
24
|
+
* items={[
|
|
25
|
+
* { value: "totales", label: "Totales" },
|
|
26
|
+
* { value: "auditoria", label: "Auditoria" },
|
|
27
|
+
* { value: "acumulaciones", label: "Acumulaciones" },
|
|
28
|
+
* ]}
|
|
29
|
+
* >
|
|
30
|
+
* Contenido del tab activo.
|
|
31
|
+
* </TabPanel>
|
|
32
|
+
*/
|
|
33
|
+
export type TabPanelItem<Value extends string = string> = {
|
|
34
|
+
value: Value;
|
|
35
|
+
label: React.ReactNode;
|
|
36
|
+
disabled?: boolean;
|
|
37
|
+
};
|
|
38
|
+
export type TabPanelProps<Value extends string = string> = {
|
|
39
|
+
value: Value;
|
|
40
|
+
items: TabPanelItem<Value>[];
|
|
41
|
+
onChange: (value: Value) => void;
|
|
42
|
+
onClose?: () => void;
|
|
43
|
+
closeLabel?: string;
|
|
44
|
+
ariaLabel?: string;
|
|
45
|
+
className?: string;
|
|
46
|
+
children?: React.ReactNode;
|
|
47
|
+
};
|
|
48
|
+
export declare function TabPanel<Value extends string = string>({ value, items, onChange, onClose, closeLabel, ariaLabel, className, children, }: TabPanelProps<Value>): React.JSX.Element;
|
|
49
|
+
export default TabPanel;
|
|
@@ -1,3 +1,6 @@
|
|
|
1
1
|
export { PillsTabs } from './PillsTabs';
|
|
2
2
|
export { PillsTabs as RbPillsTabs } from './PillsTabs';
|
|
3
3
|
export type { PillsTabItem, PillsTabsProps } from './PillsTabs';
|
|
4
|
+
export { TabPanel } from './TabPanel';
|
|
5
|
+
export { TabPanel as RbTabPanel } from './TabPanel';
|
|
6
|
+
export type { TabPanelItem, TabPanelProps } from './TabPanel';
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { RbTableBaseRow, RbTableProps } from './types';
|
|
3
|
-
export declare function RbTable<Row extends RbTableBaseRow = RbTableBaseRow>({ columns, rows, loading, getRowKey, title, description, toolbarLeft, toolbarRight, showToolbar, toolbarClassName, emptyText, emptyState, className, rootClassName, bodyClassName, size, fill, density, onRowClick, onCellContextMenu, rowClassName, getCellClassName, getRowClassName, checkboxSelection, rowSelectionModel, setRowSelectionModel, onRowSelectionModelChange, isRowSelectable, disableRowSelectionOnClick, pinnedColumns, initialState, paginate, paginationMode, paginationModel, setPaginationModel, onPaginationModelChange, rowCount, defaultRowsPerPage, rowsPerPageOptions, resultsLabel, viewAllLabel, prevAriaLabel, nextAriaLabel, footer, footerActions, hideFooter, }: RbTableProps<Row>): React.JSX.Element;
|
|
3
|
+
export declare function RbTable<Row extends RbTableBaseRow = RbTableBaseRow>({ columns, rows, loading, getRowKey, title, description, toolbarLeft, toolbarRight, showToolbar, toolbarClassName, emptyText, emptyState, className, rootClassName, bodyClassName, size, fill, density, maxHeight, onRowClick, onCellContextMenu, rowClassName, getCellClassName, getRowClassName, checkboxSelection, rowSelectionModel, setRowSelectionModel, onRowSelectionModelChange, isRowSelectable, disableRowSelectionOnClick, pinnedColumns, initialState, paginate, paginationMode, paginationModel, setPaginationModel, onPaginationModelChange, rowCount, defaultRowsPerPage, rowsPerPageOptions, resultsLabel, viewAllLabel, prevAriaLabel, nextAriaLabel, footer, footerActions, hideFooter, }: RbTableProps<Row>): React.JSX.Element;
|
|
@@ -100,6 +100,14 @@ export type RbTableColumn<Row extends RbTableBaseRow = RbTableBaseRow> = {
|
|
|
100
100
|
*/
|
|
101
101
|
maxWidth?: number;
|
|
102
102
|
align?: RbTableAlign;
|
|
103
|
+
/**
|
|
104
|
+
* Cuando es true, el contenido de `render` ocupa todo el ancho y alto
|
|
105
|
+
* disponibles de la celda y define su propia alineación (por ejemplo,
|
|
106
|
+
* mediante flex/justify o text-align dentro del propio render).
|
|
107
|
+
*
|
|
108
|
+
* En ese caso la celda ignora `align` y no aplica el truncado con tooltip.
|
|
109
|
+
*/
|
|
110
|
+
fullWidthRender?: boolean;
|
|
103
111
|
render?: (row: Row, index: number) => React.ReactNode;
|
|
104
112
|
renderHeader?: () => React.ReactNode;
|
|
105
113
|
truncate?: boolean;
|
|
@@ -128,6 +136,10 @@ export type RbLegacyGridColumn<Row extends RbTableBaseRow = RbTableBaseRow> = {
|
|
|
128
136
|
flex?: number;
|
|
129
137
|
align?: RbTableAlign;
|
|
130
138
|
headerAlign?: RbTableAlign;
|
|
139
|
+
/**
|
|
140
|
+
* Ver RbTableColumn.fullWidthRender.
|
|
141
|
+
*/
|
|
142
|
+
fullWidthRender?: boolean;
|
|
131
143
|
sortable?: boolean;
|
|
132
144
|
filterable?: boolean;
|
|
133
145
|
headerClassName?: string;
|
|
@@ -202,6 +214,13 @@ export type RbTableProps<Row extends RbTableBaseRow = RbTableBaseRow> = {
|
|
|
202
214
|
size?: RbTableSize;
|
|
203
215
|
fill?: boolean;
|
|
204
216
|
density?: RbTableDensity;
|
|
217
|
+
/**
|
|
218
|
+
* Altura máxima del body de la tabla. Acepta el mismo formato que el ancho
|
|
219
|
+
* de columnas: number => px, o cualquier string CSS válido ("20rem", "50vh", etc).
|
|
220
|
+
* Si no se define, se usa el valor por defecto asociado a 'size'.
|
|
221
|
+
* Se ignora cuando 'fill' está activo.
|
|
222
|
+
*/
|
|
223
|
+
maxHeight?: number | string;
|
|
205
224
|
onRowClick?: (row: Row, index: number) => void;
|
|
206
225
|
/**
|
|
207
226
|
* Se ejecuta al hacer clic derecho sobre una celda.
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { TimelineProps } from './timeline.types';
|
|
2
|
-
export declare function Timeline({ segments, startBoundary, endBoundary, colors, formatDate, segmentTooltip, boundaryTooltip, onSegmentClick, onBoundaryClick, allowGaps, scale, editableBoundaries, exclusiveEnd, indefiniteDate, indefiniteLabel, onBoundaryDateChange, className, }: TimelineProps): import("react").JSX.Element | null;
|
|
2
|
+
export declare function Timeline({ segments, mode, external_labels, legend, compactRange, tooltips, startBoundary, endBoundary, colors, formatDate, segmentTooltip, boundaryTooltip, onSegmentClick, onBoundaryClick, allowGaps, scale, editableBoundaries, exclusiveEnd, indefiniteDate, indefiniteLabel, onBoundaryDateChange, className, }: TimelineProps): import("react").JSX.Element | null;
|
|
3
3
|
export default Timeline;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { Timeline, default } from './Timeline';
|
|
2
|
-
export type { TimelineBoundary, TimelineBoundaryClickArgs, TimelineProps, TimelineSegment, TimelineSegmentClickArgs, TimelineSegmentId, TimelineBoundaryChangeArgs, } from './timeline.types';
|
|
2
|
+
export type { TimelineBoundary, TimelineBoundaryClickArgs, TimelineCompactRange, TimelineProps, TimelineSegment, TimelineSegmentClickArgs, TimelineSegmentId, TimelineBoundaryChangeArgs, } from './timeline.types';
|
|
@@ -27,6 +27,10 @@ export interface TimelineBoundary {
|
|
|
27
27
|
color?: string;
|
|
28
28
|
tooltip?: React.ReactNode;
|
|
29
29
|
}
|
|
30
|
+
export interface TimelineCompactRange {
|
|
31
|
+
startDate: Dayjs;
|
|
32
|
+
endDate: Dayjs;
|
|
33
|
+
}
|
|
30
34
|
export interface TimelineBoundaryClickArgs {
|
|
31
35
|
/** Índice del punto (0 = inicio, `segments.length` = fin). */
|
|
32
36
|
index: number;
|
|
@@ -43,6 +47,19 @@ export interface TimelineSegmentClickArgs {
|
|
|
43
47
|
}
|
|
44
48
|
export interface TimelineProps {
|
|
45
49
|
segments: TimelineSegment[];
|
|
50
|
+
/** Vista del timeline. `simple` conserva la vista con dots y etiquetas. */
|
|
51
|
+
mode?: "simple" | "compact";
|
|
52
|
+
/** Etiquetas externas para los extremos de la vista compacta. */
|
|
53
|
+
external_labels?: {
|
|
54
|
+
fecha_inicio?: React.ReactNode;
|
|
55
|
+
fecha_fin?: React.ReactNode;
|
|
56
|
+
};
|
|
57
|
+
/** Muestra la leyenda de segmentos en la vista compacta. */
|
|
58
|
+
legend?: boolean;
|
|
59
|
+
/** Dominio temporal usado por la vista compacta para posicionar los segmentos. */
|
|
60
|
+
compactRange?: TimelineCompactRange;
|
|
61
|
+
/** Activa los tooltips de rango en la vista compacta. */
|
|
62
|
+
tooltips?: boolean;
|
|
46
63
|
/** Personaliza el punto/etiqueta inicial (por defecto usa la fecha inicial del primer segmento). */
|
|
47
64
|
startBoundary?: TimelineBoundary;
|
|
48
65
|
/** Personaliza el punto/etiqueta final (por defecto usa la fecha final del último segmento). */
|
|
@@ -4,6 +4,10 @@ export interface BuildSlotsOptions {
|
|
|
4
4
|
/** Reparte el ancho según la duración real de cada tramo. */
|
|
5
5
|
proportional?: boolean;
|
|
6
6
|
indefiniteDate?: Dayjs;
|
|
7
|
+
domain?: {
|
|
8
|
+
startDate: Dayjs;
|
|
9
|
+
endDate: Dayjs;
|
|
10
|
+
};
|
|
7
11
|
}
|
|
8
12
|
export declare function buildSlots(segments: TimelineSegment[], allowGaps: boolean, options?: BuildSlotsOptions): TimelineSlot[];
|
|
9
13
|
export declare function buildBoundaries(segments: TimelineSegment[], segmentSlots: TimelineSlot[], allowGaps: boolean): ResolvedBoundary[];
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { VirtualTreeApiRef, VirtualTreeProps } from './virtualTree.types';
|
|
3
|
+
export declare const VirtualTree: <TValue = unknown>(props: VirtualTreeProps<TValue> & React.RefAttributes<VirtualTreeApiRef<TValue>>) => React.ReactElement;
|
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
export { default as TreePanel } from './TreePanel';
|
|
2
|
+
export { VirtualTree } from './VirtualTree';
|
|
3
|
+
export { useVirtualTreeState } from './useVirtualTreeState';
|
|
2
4
|
export type { TreePanelExpandedChangeDetails, TreePanelIdCollection, TreePanelNode, TreePanelNodeId, TreePanelProps, TreePanelRenderNodeParams, TreePanelSelectionChangeDetails, TreePanelSelectionState, } from './treePanel.types';
|
|
3
5
|
export { findNodeById, flattenTree, getExpandableNodeIds, getNodeSelectionState, getSelectableDescendantIds, getSelectableSubtreeIds, hasNodeChildren, isNodeSelectable, isNodeSelectionMutable, normalizeHierarchicalSelection, toggleExpandedNode, toggleNodeSelection, } from './treePanel.utils';
|
|
4
|
-
export type { GetSelectableSubtreeOptions
|
|
6
|
+
export type { GetSelectableSubtreeOptions } from './treePanel.utils';
|
|
7
|
+
export type { VirtualTreeApiRef, VirtualTreeExpandedChangeDetails, VirtualTreeFlatItem, VirtualTreeIdCollection, VirtualTreeNode, VirtualTreeNodeId, VirtualTreeNodeType, VirtualTreeProps, VirtualTreeSelectionChangeDetails, VirtualTreeSelectionMode, } from './virtualTree.types';
|
|
8
|
+
export { buildVirtualTreeIndex, filterVirtualTreeItems, getVirtualTreeAncestorIds, getVisibleVirtualTreeItems, normalizeVirtualTreeSearch, normalizeVirtualTreeSelection, toggleVirtualTreeSelection, } from './virtualTree.utils';
|
|
9
|
+
export type { VirtualTreeIndex } from './virtualTree.utils';
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { VirtualTreeIdCollection, VirtualTreeNode, VirtualTreeNodeId, VirtualTreeProps, VirtualTreeSelectionMode } from './virtualTree.types';
|
|
2
|
+
interface UseVirtualTreeStateOptions<TValue> {
|
|
3
|
+
items: readonly VirtualTreeNode<TValue>[];
|
|
4
|
+
selectionMode: VirtualTreeSelectionMode;
|
|
5
|
+
selectedIds?: VirtualTreeIdCollection;
|
|
6
|
+
defaultSelectedIds?: VirtualTreeIdCollection;
|
|
7
|
+
onSelectionChange?: VirtualTreeProps<TValue>["onSelectionChange"];
|
|
8
|
+
expandedIds?: VirtualTreeIdCollection;
|
|
9
|
+
defaultExpandedIds?: VirtualTreeIdCollection;
|
|
10
|
+
defaultExpandAll?: boolean;
|
|
11
|
+
onExpandedChange?: VirtualTreeProps<TValue>["onExpandedChange"];
|
|
12
|
+
}
|
|
13
|
+
export declare function useVirtualTreeState<TValue>({ items, selectionMode, selectedIds, defaultSelectedIds, onSelectionChange, expandedIds, defaultExpandedIds, defaultExpandAll, onExpandedChange, }: UseVirtualTreeStateOptions<TValue>): {
|
|
14
|
+
index: import('./virtualTree.utils').VirtualTreeIndex<TValue>;
|
|
15
|
+
visibleItems: import('./virtualTree.types').VirtualTreeFlatItem<TValue>[];
|
|
16
|
+
expandedSet: Set<VirtualTreeNodeId>;
|
|
17
|
+
selectedSet: Set<VirtualTreeNodeId>;
|
|
18
|
+
selectedIds: VirtualTreeNodeId[];
|
|
19
|
+
toggleExpansion: (nodeId: VirtualTreeNodeId) => void;
|
|
20
|
+
setItemExpansion: (nodeId: VirtualTreeNodeId, expanded: boolean) => void;
|
|
21
|
+
expandItems: (nodeIds: readonly VirtualTreeNodeId[]) => void;
|
|
22
|
+
expandAll: () => void;
|
|
23
|
+
collapseAll: () => void;
|
|
24
|
+
expandAncestors: (nodeId: VirtualTreeNodeId) => void;
|
|
25
|
+
toggleSelection: (nodeId: VirtualTreeNodeId) => void;
|
|
26
|
+
};
|
|
27
|
+
export {};
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export type VirtualTreeNodeId = string | number;
|
|
3
|
+
export type VirtualTreeNodeType = "subcompany" | "area" | "work_position";
|
|
4
|
+
export type VirtualTreeSelectionMode = "single" | "multiple";
|
|
5
|
+
export type VirtualTreeIdCollection = readonly VirtualTreeNodeId[] | ReadonlySet<VirtualTreeNodeId>;
|
|
6
|
+
export interface VirtualTreeNode<TValue = unknown> {
|
|
7
|
+
id: VirtualTreeNodeId;
|
|
8
|
+
label: string;
|
|
9
|
+
type: VirtualTreeNodeType;
|
|
10
|
+
children?: readonly VirtualTreeNode<TValue>[];
|
|
11
|
+
value?: TValue;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
className?: string;
|
|
14
|
+
}
|
|
15
|
+
export interface VirtualTreeFlatItem<TValue = unknown> {
|
|
16
|
+
id: VirtualTreeNodeId;
|
|
17
|
+
node: VirtualTreeNode<TValue>;
|
|
18
|
+
parentId: VirtualTreeNodeId | null;
|
|
19
|
+
depth: number;
|
|
20
|
+
hasChildren: boolean;
|
|
21
|
+
}
|
|
22
|
+
export interface VirtualTreeSelectionChangeDetails<TValue = unknown> {
|
|
23
|
+
nodeId: VirtualTreeNodeId;
|
|
24
|
+
node: VirtualTreeNode<TValue> | null;
|
|
25
|
+
}
|
|
26
|
+
export interface VirtualTreeExpandedChangeDetails<TValue = unknown> {
|
|
27
|
+
nodeId: VirtualTreeNodeId;
|
|
28
|
+
node: VirtualTreeNode<TValue> | null;
|
|
29
|
+
}
|
|
30
|
+
export interface VirtualTreeApiRef<TValue = unknown> {
|
|
31
|
+
expandAll: () => void;
|
|
32
|
+
collapseAll: () => void;
|
|
33
|
+
setItemExpansion: (itemId: VirtualTreeNodeId, expanded: boolean) => void;
|
|
34
|
+
focusItem: (itemId: VirtualTreeNodeId) => void;
|
|
35
|
+
getItem: (itemId: VirtualTreeNodeId) => VirtualTreeNode<TValue> | undefined;
|
|
36
|
+
scrollToItem: (itemId: VirtualTreeNodeId) => void;
|
|
37
|
+
}
|
|
38
|
+
export interface VirtualTreeProps<TValue = unknown> {
|
|
39
|
+
ariaLabel?: string;
|
|
40
|
+
items?: readonly VirtualTreeNode<TValue>[];
|
|
41
|
+
selectionMode?: VirtualTreeSelectionMode;
|
|
42
|
+
selectedIds?: VirtualTreeIdCollection;
|
|
43
|
+
defaultSelectedIds?: VirtualTreeIdCollection;
|
|
44
|
+
onSelectionChange?: (selectedIds: VirtualTreeNodeId[], details: VirtualTreeSelectionChangeDetails<TValue>) => void;
|
|
45
|
+
expandedIds?: VirtualTreeIdCollection;
|
|
46
|
+
defaultExpandedIds?: VirtualTreeIdCollection;
|
|
47
|
+
defaultExpandAll?: boolean;
|
|
48
|
+
onExpandedChange?: (expandedIds: VirtualTreeNodeId[], details: VirtualTreeExpandedChangeDetails<TValue>) => void;
|
|
49
|
+
selectionDisabled?: boolean;
|
|
50
|
+
filterTypeLabel?: string;
|
|
51
|
+
searchLabel?: string;
|
|
52
|
+
searchPlaceholder?: string;
|
|
53
|
+
clearSearchLabel?: string;
|
|
54
|
+
subcompanyLabel?: string;
|
|
55
|
+
areaLabel?: string;
|
|
56
|
+
workPositionLabel?: string;
|
|
57
|
+
emptyText?: React.ReactNode;
|
|
58
|
+
noResultsText?: React.ReactNode;
|
|
59
|
+
expandLabel?: string;
|
|
60
|
+
collapseLabel?: string;
|
|
61
|
+
height?: number;
|
|
62
|
+
rowHeight?: number;
|
|
63
|
+
overscanCount?: number;
|
|
64
|
+
loading?: boolean;
|
|
65
|
+
loadingLabel?: string;
|
|
66
|
+
className?: string;
|
|
67
|
+
headerClassName?: string;
|
|
68
|
+
bodyClassName?: string;
|
|
69
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { VirtualTreeFlatItem, VirtualTreeIdCollection, VirtualTreeNode, VirtualTreeNodeId, VirtualTreeNodeType, VirtualTreeSelectionMode } from './virtualTree.types';
|
|
2
|
+
export interface VirtualTreeIndex<TValue = unknown> {
|
|
3
|
+
allItems: VirtualTreeFlatItem<TValue>[];
|
|
4
|
+
itemsById: Map<VirtualTreeNodeId, VirtualTreeFlatItem<TValue>>;
|
|
5
|
+
expandableIds: Set<VirtualTreeNodeId>;
|
|
6
|
+
rootIds: VirtualTreeNodeId[];
|
|
7
|
+
}
|
|
8
|
+
export declare function toVirtualTreeIdArray(value?: VirtualTreeIdCollection): VirtualTreeNodeId[];
|
|
9
|
+
export declare function buildVirtualTreeIndex<TValue>(items: readonly VirtualTreeNode<TValue>[]): VirtualTreeIndex<TValue>;
|
|
10
|
+
export declare function getVirtualTreeAncestorIds<TValue>(index: VirtualTreeIndex<TValue>, nodeId: VirtualTreeNodeId): VirtualTreeNodeId[];
|
|
11
|
+
export declare function getVisibleVirtualTreeItems<TValue>(index: VirtualTreeIndex<TValue>, expandedIds: ReadonlySet<VirtualTreeNodeId>): VirtualTreeFlatItem<TValue>[];
|
|
12
|
+
export declare function normalizeVirtualTreeSearch(value: string): string;
|
|
13
|
+
export declare function filterVirtualTreeItems<TValue>(index: VirtualTreeIndex<TValue>, filterType: VirtualTreeNodeType, query: string): VirtualTreeFlatItem<TValue>[];
|
|
14
|
+
export declare function getVirtualTreeBranchIds<TValue>(items: readonly VirtualTreeFlatItem<TValue>[]): Set<VirtualTreeNodeId>;
|
|
15
|
+
export declare function getVisibleFilteredVirtualTreeItems<TValue>(index: VirtualTreeIndex<TValue>, items: readonly VirtualTreeFlatItem<TValue>[], expandedIds: ReadonlySet<VirtualTreeNodeId>): VirtualTreeFlatItem<TValue>[];
|
|
16
|
+
export declare function normalizeVirtualTreeSelection<TValue>(index: VirtualTreeIndex<TValue>, selectedIds: VirtualTreeIdCollection | undefined, mode: VirtualTreeSelectionMode): VirtualTreeNodeId[];
|
|
17
|
+
export declare function toggleVirtualTreeSelection<TValue>(index: VirtualTreeIndex<TValue>, selectedIds: VirtualTreeIdCollection | undefined, nodeId: VirtualTreeNodeId, mode: VirtualTreeSelectionMode): VirtualTreeNodeId[];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -14,8 +14,10 @@ export { Button } from './primitives/Button';
|
|
|
14
14
|
export type { ButtonProps } from './primitives/Button';
|
|
15
15
|
export { AutoCustomCompleteField } from './primitives/AutoCustomCompleteField';
|
|
16
16
|
export type { AutoValueItem, CustomAutoCompleteFieldProps, } from './primitives/AutoCustomCompleteField';
|
|
17
|
-
export { CustomDatefield, CustomDatePicker, CustomIndefiniteDatePicker, CustomTimefield, CustomDateRangefield, CustomDateRangePicker, CustomDateRangeCalendar, } from './primitives/date-fields';
|
|
18
|
-
export type { CustomDatefieldProps, CustomDatePickerProps, CustomIndefiniteDatePickerProps, CustomTimefieldProps, CustomDateRangefieldProps, CustomDateRangePickerProps, CustomDateRangeCalendarProps, } from './primitives/date-fields';
|
|
17
|
+
export { CustomDatefield, CustomDatePicker, CustomIndefiniteDatePicker, CustomTimefield, CustomDateRangefield, CustomDateRangePicker, CustomDateRangeCalendar, CustomDateControl, } from './primitives/date-fields';
|
|
18
|
+
export type { CustomDatefieldProps, CustomDatePickerProps, CustomIndefiniteDatePickerProps, CustomTimefieldProps, CustomDateRangefieldProps, CustomDateRangePickerProps, CustomDateRangeCalendarProps, CustomDateControlProps, } from './primitives/date-fields';
|
|
19
|
+
export { Calendario } from './primitives/Calendario';
|
|
20
|
+
export type { CalendarioProps, CalendarioSingleProps, CalendarioRangeProps, CalendarioRange, CalendarioMonths, } from './primitives/Calendario';
|
|
19
21
|
export { RbInlineChipField, CalendarChipIcon, ClockChipIcon, } from './primitives/RbInlineChipField';
|
|
20
22
|
export type { RbInlineChipFieldProps, RbInlineChipFieldAction, } from './primitives/RbInlineChipField';
|
|
21
23
|
export { RbContextMenu } from './primitives/RbContextMenu';
|
|
@@ -6,9 +6,10 @@ export interface TooltipProps {
|
|
|
6
6
|
placement?: TooltipPlacement;
|
|
7
7
|
multiline?: boolean;
|
|
8
8
|
disabled?: boolean;
|
|
9
|
+
triggerClassName?: string;
|
|
9
10
|
className?: string;
|
|
10
11
|
openDelay?: number;
|
|
11
12
|
closeDelay?: number;
|
|
12
13
|
}
|
|
13
|
-
export default function Tooltip({ content, children, placement, multiline, disabled, className, openDelay, closeDelay, }: TooltipProps): React.JSX.Element;
|
|
14
|
+
export default function Tooltip({ content, children, placement, multiline, disabled, triggerClassName, className, openDelay, closeDelay, }: TooltipProps): React.JSX.Element;
|
|
14
15
|
export {};
|
|
@@ -42,6 +42,22 @@ export interface AutoCompleteSearchConfig {
|
|
|
42
42
|
* values. El componente no vuelve a filtrarlas.
|
|
43
43
|
*/
|
|
44
44
|
mode?: AutoCompleteSearchMode;
|
|
45
|
+
/**
|
|
46
|
+
* Si se define, permite crear una opción nueva
|
|
47
|
+
* directamente desde el texto de búsqueda, sin
|
|
48
|
+
* necesidad de un botón externo.
|
|
49
|
+
*
|
|
50
|
+
* Se muestra como un ítem adicional dentro del
|
|
51
|
+
* listado cuando el texto ingresado no coincide
|
|
52
|
+
* exactamente con ninguna opción existente.
|
|
53
|
+
*/
|
|
54
|
+
onCreateOption?: (value: string) => void;
|
|
55
|
+
/**
|
|
56
|
+
* Personaliza la etiqueta del ítem de creación.
|
|
57
|
+
*
|
|
58
|
+
* Por defecto: `Crear "<value>"`.
|
|
59
|
+
*/
|
|
60
|
+
createOptionLabel?: (value: string) => string;
|
|
45
61
|
}
|
|
46
62
|
interface CustomAutoCompleteBaseProps {
|
|
47
63
|
id?: string;
|
|
@@ -50,10 +66,16 @@ interface CustomAutoCompleteBaseProps {
|
|
|
50
66
|
values: AutoValueItem[];
|
|
51
67
|
white: boolean;
|
|
52
68
|
disabled?: boolean;
|
|
69
|
+
required?: boolean;
|
|
53
70
|
error?: boolean;
|
|
54
71
|
helperText?: ReactNode;
|
|
55
72
|
emptyText?: ReactNode;
|
|
56
73
|
clearLabel?: string;
|
|
74
|
+
/**
|
|
75
|
+
* Controla la visibilidad del botón para limpiar
|
|
76
|
+
* los elementos seleccionados.
|
|
77
|
+
*/
|
|
78
|
+
showClearButton?: boolean;
|
|
57
79
|
/**
|
|
58
80
|
* Habilita el buscador dentro del listado.
|
|
59
81
|
*/
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { Dayjs } from 'dayjs';
|
|
3
|
+
declare const CALENDARIO_LOCALES: {
|
|
4
|
+
readonly en: import('react-day-picker').DayPickerLocale;
|
|
5
|
+
readonly es: import('react-day-picker').DayPickerLocale;
|
|
6
|
+
};
|
|
7
|
+
type CalendarioLocale = keyof typeof CALENDARIO_LOCALES;
|
|
8
|
+
export type CalendarioMonths = 1 | 2 | 3;
|
|
9
|
+
export type CalendarioRange = [Dayjs | null, Dayjs | null];
|
|
10
|
+
interface CalendarioBaseProps {
|
|
11
|
+
label: string;
|
|
12
|
+
disabled: boolean;
|
|
13
|
+
white: boolean;
|
|
14
|
+
fullWidth: boolean;
|
|
15
|
+
placeholder?: string;
|
|
16
|
+
captionLayout?: "label" | "dropdown";
|
|
17
|
+
locale?: CalendarioLocale | null;
|
|
18
|
+
minDate?: Dayjs | Date;
|
|
19
|
+
maxDate?: Dayjs | Date;
|
|
20
|
+
calendarWhite?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Cantidad de meses visibles en el panel:
|
|
23
|
+
* 1 simple, 2 doble, 3 triple.
|
|
24
|
+
*/
|
|
25
|
+
months?: CalendarioMonths;
|
|
26
|
+
/**
|
|
27
|
+
* Centra los calendarios y la cabecera
|
|
28
|
+
* dentro del panel.
|
|
29
|
+
*/
|
|
30
|
+
centerCalendars?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Muestra el valor del trigger en formato corto
|
|
33
|
+
* (DD/MM/YY), útil en espacios reducidos.
|
|
34
|
+
*/
|
|
35
|
+
compact?: boolean;
|
|
36
|
+
/**
|
|
37
|
+
* Activa el estado visual y accesible de error.
|
|
38
|
+
*/
|
|
39
|
+
error?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Texto de ayuda o validación mostrado
|
|
42
|
+
* bajo el campo.
|
|
43
|
+
*/
|
|
44
|
+
helperText?: React.ReactNode;
|
|
45
|
+
}
|
|
46
|
+
export interface CalendarioSingleProps extends CalendarioBaseProps {
|
|
47
|
+
selectionMode?: "single";
|
|
48
|
+
initialValue: Dayjs | null;
|
|
49
|
+
value: Dayjs | null;
|
|
50
|
+
setValue: (newValue: Dayjs | null) => void;
|
|
51
|
+
}
|
|
52
|
+
export interface CalendarioRangeProps extends CalendarioBaseProps {
|
|
53
|
+
selectionMode: "range";
|
|
54
|
+
initialValue: CalendarioRange;
|
|
55
|
+
value: CalendarioRange;
|
|
56
|
+
setValue: (newValue: CalendarioRange) => void;
|
|
57
|
+
}
|
|
58
|
+
export type CalendarioProps = CalendarioSingleProps | CalendarioRangeProps;
|
|
59
|
+
declare const Calendario: (props: CalendarioProps) => React.JSX.Element;
|
|
60
|
+
export { Calendario };
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { Dayjs } from 'dayjs';
|
|
2
|
+
import { CustomDatePickerProps } from './CustomDatePicker';
|
|
3
|
+
import { CustomDatePickerProps as CustomFieldDatePickerProps } from './CustomIndefiniteDatePicker/CustomDatePicker';
|
|
4
|
+
import { CustomIndefiniteDatePickerProps } from './CustomIndefiniteDatePicker/CustomIndefiniteDatePicker';
|
|
5
|
+
type DateControlVariant = "input" | "field";
|
|
6
|
+
type DateControlBaseProps = {
|
|
7
|
+
label: string;
|
|
8
|
+
initialValue?: Dayjs | null;
|
|
9
|
+
value: Dayjs | null;
|
|
10
|
+
setValue: (newValue: Dayjs | null) => void;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
required?: boolean;
|
|
13
|
+
white?: boolean;
|
|
14
|
+
fullWidth?: boolean;
|
|
15
|
+
placeholder?: string;
|
|
16
|
+
minDate?: Dayjs | Date;
|
|
17
|
+
maxDate?: Dayjs | Date;
|
|
18
|
+
error?: boolean;
|
|
19
|
+
helperText?: React.ReactNode;
|
|
20
|
+
};
|
|
21
|
+
type DateControlPickerProps = Omit<CustomDatePickerProps, "label" | "initialValue" | "value" | "setValue" | "disabled" | "required" | "white" | "fullWidth" | "placeholder" | "error" | "helperText">;
|
|
22
|
+
type DateControlIndefiniteProps = Omit<CustomIndefiniteDatePickerProps, "label" | "value" | "setValue" | "disabled" | "required" | "white" | "fullWidth" | "placeholder" | "error" | "helperText" | "indefinite" | "onIndefiniteChange">;
|
|
23
|
+
type DateControlFieldProps = Omit<CustomFieldDatePickerProps, "label" | "value" | "setValue" | "disabled" | "required" | "white" | "fullWidth" | "placeholder" | "error" | "helperText">;
|
|
24
|
+
export interface CustomDateControlProps extends DateControlBaseProps {
|
|
25
|
+
/** Visualizacion editable tipo input o visualizacion compacta tipo field. */
|
|
26
|
+
variant?: DateControlVariant;
|
|
27
|
+
/** Usa el selector de fecha y hora de CustomDatefield. */
|
|
28
|
+
withTime?: boolean;
|
|
29
|
+
/** Activa la visualizacion y comportamiento de fecha indefinida. */
|
|
30
|
+
indefinite?: boolean;
|
|
31
|
+
/** Handler requerido cuando se muestra la opcion indefinida. */
|
|
32
|
+
onIndefiniteChange?: (indefinite: boolean) => void;
|
|
33
|
+
/** Props especificas del CustomDatePicker editable. */
|
|
34
|
+
pickerProps?: DateControlPickerProps;
|
|
35
|
+
/** Props especificas de la visualizacion compacta tipo field. */
|
|
36
|
+
fieldProps?: DateControlFieldProps;
|
|
37
|
+
/** Props especificas de CustomIndefiniteDatePicker. */
|
|
38
|
+
indefiniteProps?: DateControlIndefiniteProps;
|
|
39
|
+
}
|
|
40
|
+
declare const CustomDateControl: ({ label, initialValue, value, setValue, disabled, required, white, fullWidth, placeholder, minDate, maxDate, error, helperText, variant, withTime, indefinite, onIndefiniteChange, pickerProps, fieldProps, indefiniteProps, }: CustomDateControlProps) => import("react").JSX.Element;
|
|
41
|
+
export { CustomDateControl };
|
|
@@ -11,11 +11,14 @@ export interface CustomDatePickerProps {
|
|
|
11
11
|
value: Dayjs | null;
|
|
12
12
|
setValue: (newValue: Dayjs | null) => void;
|
|
13
13
|
disabled: boolean;
|
|
14
|
+
required?: boolean;
|
|
14
15
|
white: boolean;
|
|
15
16
|
fullWidth: boolean;
|
|
16
17
|
placeholder?: string;
|
|
17
18
|
captionLayout?: "label" | "dropdown";
|
|
18
19
|
locale?: DatePickerLocale | null;
|
|
20
|
+
minDate?: Dayjs | Date;
|
|
21
|
+
maxDate?: Dayjs | Date;
|
|
19
22
|
/**
|
|
20
23
|
* Activa el estado visual y accesible de error.
|
|
21
24
|
*/
|
|
@@ -26,5 +29,5 @@ export interface CustomDatePickerProps {
|
|
|
26
29
|
*/
|
|
27
30
|
helperText?: React.ReactNode;
|
|
28
31
|
}
|
|
29
|
-
declare const CustomDatePicker: ({ label, initialValue, value, setValue, disabled, white, fullWidth, placeholder, captionLayout, error, helperText, locale, }: CustomDatePickerProps) => React.JSX.Element;
|
|
32
|
+
declare const CustomDatePicker: ({ label, initialValue, value, setValue, disabled, required, white, fullWidth, placeholder, captionLayout, error, helperText, locale, minDate: minDateProp, maxDate: maxDateProp, }: CustomDatePickerProps) => React.JSX.Element;
|
|
30
33
|
export { CustomDatePicker };
|
|
@@ -2,20 +2,12 @@ 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
|
-
|
|
8
|
-
];
|
|
9
|
-
value: [
|
|
10
|
-
Dayjs | null,
|
|
11
|
-
Dayjs | null
|
|
12
|
-
];
|
|
13
|
-
setValue: (newValue: [
|
|
14
|
-
Dayjs | null,
|
|
15
|
-
Dayjs | null
|
|
16
|
-
]) => void;
|
|
5
|
+
initialValue: [Dayjs | null, Dayjs | null];
|
|
6
|
+
value: [Dayjs | null, Dayjs | null];
|
|
7
|
+
setValue: (newValue: [Dayjs | null, Dayjs | null]) => void;
|
|
17
8
|
calendars: 1 | 2 | 3;
|
|
18
9
|
disabled: boolean;
|
|
10
|
+
required?: boolean;
|
|
19
11
|
white: boolean;
|
|
20
12
|
fullWidth: boolean;
|
|
21
13
|
/**
|
|
@@ -24,5 +16,5 @@ export interface CustomDateRangePickerProps {
|
|
|
24
16
|
*/
|
|
25
17
|
compact?: boolean;
|
|
26
18
|
}
|
|
27
|
-
declare const CustomDateRangePicker: ({ label, initialValue, value, setValue, calendars, disabled, white, fullWidth, compact, }: CustomDateRangePickerProps) => React.JSX.Element;
|
|
19
|
+
declare const CustomDateRangePicker: ({ label, initialValue, value, setValue, calendars, disabled, required, white, fullWidth, compact, }: CustomDateRangePickerProps) => React.JSX.Element;
|
|
28
20
|
export { CustomDateRangePicker };
|
|
@@ -5,6 +5,7 @@ export interface CustomDateRangefieldProps {
|
|
|
5
5
|
value: [Dayjs | null, Dayjs | null];
|
|
6
6
|
setValue: (newValue: [Dayjs | null, Dayjs | null]) => void;
|
|
7
7
|
disabled: boolean;
|
|
8
|
+
required?: boolean;
|
|
8
9
|
}
|
|
9
|
-
declare const CustomDateRangefield: ({ label, value, setValue, disabled, }: CustomDateRangefieldProps) => React.JSX.Element;
|
|
10
|
+
declare const CustomDateRangefield: ({ label, value, setValue, disabled, required, }: CustomDateRangefieldProps) => React.JSX.Element;
|
|
10
11
|
export { CustomDateRangefield };
|
|
@@ -6,8 +6,11 @@ export interface CustomDatefieldProps {
|
|
|
6
6
|
value: Dayjs | null;
|
|
7
7
|
setValue: (newValue: Dayjs | null) => void;
|
|
8
8
|
disabled: boolean;
|
|
9
|
+
required?: boolean;
|
|
9
10
|
white: boolean;
|
|
10
11
|
fullWidth: boolean;
|
|
12
|
+
minDate?: Dayjs | Date;
|
|
13
|
+
maxDate?: Dayjs | Date;
|
|
11
14
|
}
|
|
12
|
-
declare const CustomDatefield: ({ label, initialValue, value, setValue, disabled, white, fullWidth, }: CustomDatefieldProps) => React.JSX.Element;
|
|
15
|
+
declare const CustomDatefield: ({ label, initialValue, value, setValue, disabled, required, white, fullWidth, minDate, maxDate, }: CustomDatefieldProps) => React.JSX.Element;
|
|
13
16
|
export { CustomDatefield };
|