@scmlatam/web-ui 0.2.32 → 0.2.33
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 +4 -2
- package/dist/src/pages/home/rb/sections/TimelineSection.d.ts +1 -0
- package/dist/src/rb-components/index.d.ts +1 -0
- package/dist/src/rb-components/timeline/BoundaryDot.d.ts +17 -0
- package/dist/src/rb-components/timeline/SegmentLabel.d.ts +13 -0
- package/dist/src/rb-components/timeline/Timeline.d.ts +3 -0
- package/dist/src/rb-components/timeline/index.d.ts +2 -0
- package/dist/src/rb-components/timeline/timeline.types.d.ts +102 -0
- package/dist/src/rb-components/timeline/timelineLayout.d.ts +13 -0
- package/dist/src/rb-components/ui/index.d.ts +2 -2
- package/dist/src/rb-components/ui/primitives/date-fields/CustomDatePicker.d.ts +8 -1
- package/dist/src/rb-components/ui/primitives/date-fields/CustomIndefiniteDatePicker/CustomDatePicker.d.ts +26 -0
- package/dist/src/rb-components/ui/primitives/date-fields/CustomIndefiniteDatePicker/CustomIndefiniteDatePicker.d.ts +12 -0
- package/dist/src/rb-components/ui/primitives/date-fields/CustomIndefiniteDatePicker/YearGrid.d.ts +8 -0
- package/dist/src/rb-components/ui/primitives/date-fields/DateFieldTrigger.d.ts +1 -1
- package/dist/src/rb-components/ui/primitives/date-fields/DateInputTrigger.d.ts +18 -0
- package/dist/src/rb-components/ui/primitives/date-fields/TimeFieldTrigger.d.ts +19 -0
- package/dist/src/rb-components/ui/primitives/date-fields/TimePickerPanel.d.ts +2 -1
- 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 +4 -2
- package/dist/web-ui.js +4880 -3529
- package/dist/web-ui.umd.cjs +65 -65
- package/package.json +1 -1
|
@@ -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, 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, 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';
|
|
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';
|
|
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';
|
|
@@ -21,3 +21,5 @@ export { TreePanel, findNodeById, flattenTree, getExpandableNodeIds, getNodeSele
|
|
|
21
21
|
export type { GetSelectableSubtreeOptions, TreePanelExpandedChangeDetails, TreePanelIdCollection, TreePanelNode, TreePanelNodeId, TreePanelProps, TreePanelRenderNodeParams, TreePanelSelectionChangeDetails, TreePanelSelectionState, } from '../rb-components/tree-panel';
|
|
22
22
|
export { getRbImageUrl, rbImages } from '../rb-components/images';
|
|
23
23
|
export type { RbImageName } from '../rb-components/images';
|
|
24
|
+
export { Timeline } from '../rb-components/timeline';
|
|
25
|
+
export type { TimelineProps, TimelineSegment, TimelineBoundary, TimelineBoundaryClickArgs, TimelineSegmentClickArgs, TimelineBoundaryChangeArgs, TimelineSegmentId, } from '../rb-components/timeline';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function TimelineSection(): import("react").JSX.Element;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { Dayjs } from 'dayjs';
|
|
3
|
+
import { ResolvedBoundary } from './timeline.types';
|
|
4
|
+
interface BoundaryDotProps {
|
|
5
|
+
boundary: ResolvedBoundary;
|
|
6
|
+
isEdge: boolean;
|
|
7
|
+
color: string;
|
|
8
|
+
tooltip: React.ReactNode;
|
|
9
|
+
editable: boolean;
|
|
10
|
+
minDate: Dayjs | null;
|
|
11
|
+
maxDate: Dayjs | null;
|
|
12
|
+
align?: "start" | "center" | "end";
|
|
13
|
+
onDateChange?: (date: Dayjs) => void;
|
|
14
|
+
onClick?: (anchorEl: HTMLElement) => void;
|
|
15
|
+
}
|
|
16
|
+
export declare function BoundaryDot({ boundary, isEdge, color, tooltip, editable, minDate, maxDate, align, onDateChange, onClick, }: BoundaryDotProps): React.JSX.Element;
|
|
17
|
+
export {};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { TimelineSegment } from './timeline.types';
|
|
3
|
+
interface SegmentLabelProps {
|
|
4
|
+
segment: TimelineSegment;
|
|
5
|
+
index: number;
|
|
6
|
+
color: string;
|
|
7
|
+
leftPct: number;
|
|
8
|
+
tooltip: React.ReactNode;
|
|
9
|
+
align?: "start" | "center" | "end";
|
|
10
|
+
onClick?: (index: number, anchorEl: HTMLElement) => void;
|
|
11
|
+
}
|
|
12
|
+
export declare function SegmentLabel({ segment, index, color, leftPct, tooltip, align, onClick, }: SegmentLabelProps): React.JSX.Element;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,3 @@
|
|
|
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;
|
|
3
|
+
export default Timeline;
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import { Dayjs } from 'dayjs';
|
|
2
|
+
import { default as React } from 'react';
|
|
3
|
+
export type TimelineSegmentId = string | number;
|
|
4
|
+
export type TimelineBoundaryKind = "start" | "end" | "shared";
|
|
5
|
+
export interface TimelineSegment {
|
|
6
|
+
id: TimelineSegmentId;
|
|
7
|
+
startDate: Dayjs;
|
|
8
|
+
endDate: Dayjs;
|
|
9
|
+
label?: React.ReactNode;
|
|
10
|
+
/**
|
|
11
|
+
* Color explícito del segmento. Si no se define, se toma del
|
|
12
|
+
* `colors` de `TimelineProps` en el orden de aparición del `id`.
|
|
13
|
+
*/
|
|
14
|
+
color?: string;
|
|
15
|
+
/**
|
|
16
|
+
* Tooltip por segmento. Cuando se define, sustituye al `segmentTooltip`
|
|
17
|
+
* global de `TimelineProps` para este segmento.
|
|
18
|
+
*/
|
|
19
|
+
tooltip?: React.ReactNode;
|
|
20
|
+
}
|
|
21
|
+
export interface TimelineBoundary {
|
|
22
|
+
/**
|
|
23
|
+
* Etiqueta mostrada bajo el punto extremo. Si se omite, se usa la fecha
|
|
24
|
+
* del segmento adyacente formateada con `formatDate`.
|
|
25
|
+
*/
|
|
26
|
+
label?: React.ReactNode;
|
|
27
|
+
color?: string;
|
|
28
|
+
tooltip?: React.ReactNode;
|
|
29
|
+
}
|
|
30
|
+
export interface TimelineBoundaryClickArgs {
|
|
31
|
+
/** Índice del punto (0 = inicio, `segments.length` = fin). */
|
|
32
|
+
index: number;
|
|
33
|
+
/** Segmento previo al punto (undefined si es el punto inicial). */
|
|
34
|
+
previousSegment?: TimelineSegment;
|
|
35
|
+
/** Segmento posterior al punto (undefined si es el punto final). */
|
|
36
|
+
nextSegment?: TimelineSegment;
|
|
37
|
+
anchorEl: HTMLElement;
|
|
38
|
+
}
|
|
39
|
+
export interface TimelineSegmentClickArgs {
|
|
40
|
+
segment: TimelineSegment;
|
|
41
|
+
index: number;
|
|
42
|
+
anchorEl: HTMLElement;
|
|
43
|
+
}
|
|
44
|
+
export interface TimelineProps {
|
|
45
|
+
segments: TimelineSegment[];
|
|
46
|
+
/** Personaliza el punto/etiqueta inicial (por defecto usa la fecha inicial del primer segmento). */
|
|
47
|
+
startBoundary?: TimelineBoundary;
|
|
48
|
+
/** Personaliza el punto/etiqueta final (por defecto usa la fecha final del último segmento). */
|
|
49
|
+
endBoundary?: TimelineBoundary;
|
|
50
|
+
/**
|
|
51
|
+
* Paleta usada para colorear segmentos que no definan `color`. Se asigna
|
|
52
|
+
* por `id` respetando el orden de aparición.
|
|
53
|
+
*/
|
|
54
|
+
colors?: string[];
|
|
55
|
+
/** Formateador de fechas (por defecto `DD/MM/YYYY`). */
|
|
56
|
+
formatDate?: (date: Dayjs) => string;
|
|
57
|
+
/** Tooltip global aplicado a segmentos que no definan su propio `tooltip`. */
|
|
58
|
+
segmentTooltip?: (segment: TimelineSegment, index: number) => React.ReactNode;
|
|
59
|
+
/** Tooltip global aplicado a puntos intermedios. */
|
|
60
|
+
boundaryTooltip?: (args: TimelineBoundaryClickArgs) => React.ReactNode;
|
|
61
|
+
/** Handler opcional para clic en la etiqueta de un segmento. */
|
|
62
|
+
onSegmentClick?: (args: TimelineSegmentClickArgs) => void;
|
|
63
|
+
/** Handler opcional para clic en un punto intermedio (no se dispara en los extremos). */
|
|
64
|
+
onBoundaryClick?: (args: TimelineBoundaryClickArgs) => void;
|
|
65
|
+
className?: string;
|
|
66
|
+
allowGaps?: boolean;
|
|
67
|
+
/**
|
|
68
|
+
* `"equal"` reparte el ancho por igual entre tramos; `"proportional"` lo
|
|
69
|
+
* calcula según la duración real de cada uno.
|
|
70
|
+
*/
|
|
71
|
+
scale?: "equal" | "proportional";
|
|
72
|
+
editableBoundaries?: boolean;
|
|
73
|
+
onBoundaryDateChange?: (args: TimelineBoundaryChangeArgs) => void;
|
|
74
|
+
/** true si endDate es exclusivo (el día no pertenece al tramo). Default: false */
|
|
75
|
+
exclusiveEnd?: boolean;
|
|
76
|
+
/** Fecha centinela que representa "sin término" (ej. `dayjs("3000-01-01")`). */
|
|
77
|
+
indefiniteDate?: Dayjs;
|
|
78
|
+
/** Texto mostrado en el punto cuya fecha es `indefiniteDate`. */
|
|
79
|
+
indefiniteLabel?: string;
|
|
80
|
+
}
|
|
81
|
+
export interface TimelineBoundaryChangeArgs {
|
|
82
|
+
kind: TimelineBoundaryKind;
|
|
83
|
+
date: Dayjs;
|
|
84
|
+
segmentIndex: number;
|
|
85
|
+
previousIndex: number | null;
|
|
86
|
+
minDate: Dayjs | null;
|
|
87
|
+
maxDate: Dayjs | null;
|
|
88
|
+
}
|
|
89
|
+
export interface TimelineSlot {
|
|
90
|
+
type: "segment" | "gap";
|
|
91
|
+
index: number;
|
|
92
|
+
startPct: number;
|
|
93
|
+
widthPct: number;
|
|
94
|
+
}
|
|
95
|
+
export interface ResolvedBoundary {
|
|
96
|
+
key: string;
|
|
97
|
+
kind: TimelineBoundaryKind;
|
|
98
|
+
date: Dayjs;
|
|
99
|
+
leftPct: number;
|
|
100
|
+
segmentIndex: number;
|
|
101
|
+
previousIndex: number | null;
|
|
102
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Dayjs } from 'dayjs';
|
|
2
|
+
import { ResolvedBoundary, TimelineSegment, TimelineSlot } from './timeline.types';
|
|
3
|
+
export interface BuildSlotsOptions {
|
|
4
|
+
/** Reparte el ancho según la duración real de cada tramo. */
|
|
5
|
+
proportional?: boolean;
|
|
6
|
+
indefiniteDate?: Dayjs;
|
|
7
|
+
}
|
|
8
|
+
export declare function buildSlots(segments: TimelineSegment[], allowGaps: boolean, options?: BuildSlotsOptions): TimelineSlot[];
|
|
9
|
+
export declare function buildBoundaries(segments: TimelineSegment[], segmentSlots: TimelineSlot[], allowGaps: boolean): ResolvedBoundary[];
|
|
10
|
+
export declare function boundaryBounds(boundary: ResolvedBoundary, segments: TimelineSegment[], allowGaps: boolean, exclusiveEnd?: boolean): {
|
|
11
|
+
min: Dayjs | null;
|
|
12
|
+
max: Dayjs | null;
|
|
13
|
+
};
|
|
@@ -14,8 +14,8 @@ 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, CustomTimefield, CustomDateRangefield, CustomDateRangePicker, CustomDateRangeCalendar, } from './primitives/date-fields';
|
|
18
|
-
export type { CustomDatefieldProps, CustomDatePickerProps, CustomTimefieldProps, CustomDateRangefieldProps, CustomDateRangePickerProps, CustomDateRangeCalendarProps, } from './primitives/date-fields';
|
|
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';
|
|
19
19
|
export { RbInlineChipField, CalendarChipIcon, ClockChipIcon, } from './primitives/RbInlineChipField';
|
|
20
20
|
export type { RbInlineChipFieldProps, RbInlineChipFieldAction, } from './primitives/RbInlineChipField';
|
|
21
21
|
export { RbContextMenu } from './primitives/RbContextMenu';
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { Dayjs } from 'dayjs';
|
|
3
|
+
declare const DATE_PICKER_LOCALES: {
|
|
4
|
+
readonly en: import('react-day-picker').DayPickerLocale;
|
|
5
|
+
readonly es: import('react-day-picker').DayPickerLocale;
|
|
6
|
+
};
|
|
7
|
+
type DatePickerLocale = keyof typeof DATE_PICKER_LOCALES;
|
|
3
8
|
export interface CustomDatePickerProps {
|
|
4
9
|
label: string;
|
|
5
10
|
initialValue: Dayjs | null;
|
|
@@ -9,6 +14,8 @@ export interface CustomDatePickerProps {
|
|
|
9
14
|
white: boolean;
|
|
10
15
|
fullWidth: boolean;
|
|
11
16
|
placeholder?: string;
|
|
17
|
+
captionLayout?: "label" | "dropdown";
|
|
18
|
+
locale?: DatePickerLocale | null;
|
|
12
19
|
/**
|
|
13
20
|
* Activa el estado visual y accesible de error.
|
|
14
21
|
*/
|
|
@@ -19,5 +26,5 @@ export interface CustomDatePickerProps {
|
|
|
19
26
|
*/
|
|
20
27
|
helperText?: React.ReactNode;
|
|
21
28
|
}
|
|
22
|
-
declare const CustomDatePicker: ({ label, initialValue, value, setValue, disabled, white, fullWidth, placeholder, error, helperText, }: CustomDatePickerProps) => React.JSX.Element;
|
|
29
|
+
declare const CustomDatePicker: ({ label, initialValue, value, setValue, disabled, white, fullWidth, placeholder, captionLayout, error, helperText, locale, }: CustomDatePickerProps) => React.JSX.Element;
|
|
23
30
|
export { CustomDatePicker };
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { Dayjs } from 'dayjs';
|
|
3
|
+
export interface DatePickerFooterApi {
|
|
4
|
+
close: () => void;
|
|
5
|
+
}
|
|
6
|
+
export interface CustomDatePickerProps {
|
|
7
|
+
label: string;
|
|
8
|
+
value: Dayjs | null;
|
|
9
|
+
setValue: (newValue: Dayjs | null) => void;
|
|
10
|
+
minDate?: Dayjs | Date;
|
|
11
|
+
maxDate?: Dayjs | Date;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
white?: boolean;
|
|
14
|
+
fullWidth?: boolean;
|
|
15
|
+
placeholder?: string;
|
|
16
|
+
/** Sobrescribe el texto del trigger (ej. "Indefinido"). */
|
|
17
|
+
displayValue?: string;
|
|
18
|
+
/** Texto de ayuda opcional que se muestra debajo del campo. */
|
|
19
|
+
helperText?: string;
|
|
20
|
+
/** Estado visual y accesible de error. */
|
|
21
|
+
error?: boolean;
|
|
22
|
+
/** Contenido opcional al pie del panel. Se oculta en la vista de años. */
|
|
23
|
+
footer?: (api: DatePickerFooterApi) => React.ReactNode;
|
|
24
|
+
}
|
|
25
|
+
declare const CustomDatePicker: ({ label, value, setValue, minDate: minDateProp, maxDate: maxDateProp, disabled, white, fullWidth, placeholder, displayValue, footer, helperText, error, }: CustomDatePickerProps) => React.JSX.Element;
|
|
26
|
+
export { CustomDatePicker };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { CustomDatePickerProps } from './CustomDatePicker';
|
|
3
|
+
export interface CustomIndefiniteDatePickerProps extends Omit<CustomDatePickerProps, "footer" | "displayValue"> {
|
|
4
|
+
indefinite: boolean;
|
|
5
|
+
onIndefiniteChange: (indefinite: boolean) => void;
|
|
6
|
+
indefiniteLabel?: string;
|
|
7
|
+
showIndefiniteCheckbox?: boolean;
|
|
8
|
+
disabledIndefinite?: boolean;
|
|
9
|
+
disabledIndefiniteTooltip?: string;
|
|
10
|
+
}
|
|
11
|
+
declare const CustomIndefiniteDatePicker: ({ indefinite, onIndefiniteChange, indefiniteLabel, showIndefiniteCheckbox, disabled, disabledIndefinite, disabledIndefiniteTooltip, ...datePickerProps }: CustomIndefiniteDatePickerProps) => React.JSX.Element;
|
|
12
|
+
export { CustomIndefiniteDatePicker };
|
package/dist/src/rb-components/ui/primitives/date-fields/CustomIndefiniteDatePicker/YearGrid.d.ts
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface YearGridProps {
|
|
3
|
+
years: number[];
|
|
4
|
+
activeYear: number;
|
|
5
|
+
onSelect: (year: number) => void;
|
|
6
|
+
}
|
|
7
|
+
export declare const YearGrid: React.MemoExoticComponent<({ years, activeYear, onSelect }: YearGridProps) => React.JSX.Element>;
|
|
8
|
+
export {};
|
|
@@ -24,5 +24,5 @@ interface DateFieldTriggerProps {
|
|
|
24
24
|
helperText?: React.ReactNode;
|
|
25
25
|
onClick?: () => void;
|
|
26
26
|
}
|
|
27
|
-
export declare const DateFieldTrigger: React.ForwardRefExoticComponent<DateFieldTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
27
|
+
export declare const DateFieldTrigger: React.ForwardRefExoticComponent<DateFieldTriggerProps & React.RefAttributes<HTMLButtonElement | HTMLInputElement>>;
|
|
28
28
|
export {};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface DateInputTriggerProps {
|
|
3
|
+
id: string;
|
|
4
|
+
label: string;
|
|
5
|
+
value: string;
|
|
6
|
+
placeholder: string;
|
|
7
|
+
open: boolean;
|
|
8
|
+
disabled: boolean;
|
|
9
|
+
white: boolean;
|
|
10
|
+
fullWidth: boolean;
|
|
11
|
+
error: boolean;
|
|
12
|
+
helperText?: React.ReactNode;
|
|
13
|
+
onChange: (value: string) => void;
|
|
14
|
+
onOpen: () => void;
|
|
15
|
+
onBlur: () => void;
|
|
16
|
+
}
|
|
17
|
+
declare const DateInputTrigger: React.ForwardRefExoticComponent<DateInputTriggerProps & React.RefAttributes<HTMLDivElement>>;
|
|
18
|
+
export { DateInputTrigger };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface TimeFieldTriggerProps {
|
|
3
|
+
id: string;
|
|
4
|
+
label: string;
|
|
5
|
+
hour: string;
|
|
6
|
+
minute: string;
|
|
7
|
+
open: boolean;
|
|
8
|
+
disabled: boolean;
|
|
9
|
+
white: boolean;
|
|
10
|
+
fullWidth: boolean;
|
|
11
|
+
error: boolean;
|
|
12
|
+
helperText?: React.ReactNode;
|
|
13
|
+
onHourChange: (value: string) => void;
|
|
14
|
+
onMinuteChange: (value: string) => void;
|
|
15
|
+
onOpen: () => void;
|
|
16
|
+
onBlur: React.FocusEventHandler<HTMLDivElement>;
|
|
17
|
+
}
|
|
18
|
+
declare const TimeFieldTrigger: React.ForwardRefExoticComponent<TimeFieldTriggerProps & React.RefAttributes<HTMLDivElement>>;
|
|
19
|
+
export { TimeFieldTrigger };
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
1
2
|
import { Dayjs } from 'dayjs';
|
|
2
3
|
interface TimePickerPanelProps {
|
|
3
4
|
value: Dayjs | null;
|
|
@@ -21,5 +22,5 @@ interface TimePickerPanelProps {
|
|
|
21
22
|
*/
|
|
22
23
|
minuteStep?: number;
|
|
23
24
|
}
|
|
24
|
-
export declare function TimePickerPanel({ value, onChange, minuteStep, }: TimePickerPanelProps):
|
|
25
|
+
export declare function TimePickerPanel({ value, onChange, minuteStep, }: TimePickerPanelProps): React.JSX.Element;
|
|
25
26
|
export {};
|
|
@@ -5,6 +5,8 @@ export declare const DATETIME_DISPLAY_FORMAT = "DD/MM/YYYY HH:mm";
|
|
|
5
5
|
export declare function toDate(value?: Dayjs | null): Date | undefined;
|
|
6
6
|
export declare function toDayjs(value?: Date | null): Dayjs | null;
|
|
7
7
|
export declare function formatDate(value?: Dayjs | null): string;
|
|
8
|
+
export declare function maskDateInput(value: string): string;
|
|
9
|
+
export declare function fromDisplayDateValue(value: string): dayjs.Dayjs | null;
|
|
8
10
|
export declare function formatTime(value?: Dayjs | null): string;
|
|
9
11
|
export declare function formatDateTime(value?: Dayjs | null): string;
|
|
10
12
|
export declare function formatDateRange(value?: [Dayjs | null, Dayjs | null]): string;
|
|
@@ -16,3 +18,7 @@ export declare function fromTimeInputValue(value: string, baseValue?: Dayjs | nu
|
|
|
16
18
|
export declare function fromDateTimeInputValue(value: string): dayjs.Dayjs | null;
|
|
17
19
|
export declare function mergeDateAndTime(dateValue: Dayjs, timeValue?: Dayjs | null): dayjs.Dayjs;
|
|
18
20
|
export declare function normalizeCalendars(calendars?: 1 | 2 | 3): 1 | 2 | 3;
|
|
21
|
+
export declare function startOfToday(): Date;
|
|
22
|
+
/** Mantiene el día dentro del mes destino (31 ene → 28 feb). */
|
|
23
|
+
export declare function withYearMonth(source: Date, year: number, monthIndex: number): Date;
|
|
24
|
+
export declare function clampDate(date: Date, min: Date, max: Date): Date;
|
|
@@ -2,6 +2,8 @@ export { CustomDatefield } from './CustomDatefield';
|
|
|
2
2
|
export type { CustomDatefieldProps } from './CustomDatefield';
|
|
3
3
|
export { CustomDatePicker } from './CustomDatePicker';
|
|
4
4
|
export type { CustomDatePickerProps } from './CustomDatePicker';
|
|
5
|
+
export { CustomIndefiniteDatePicker } from './CustomIndefiniteDatePicker/CustomIndefiniteDatePicker';
|
|
6
|
+
export type { CustomIndefiniteDatePickerProps } from './CustomIndefiniteDatePicker/CustomIndefiniteDatePicker';
|
|
5
7
|
export { CustomTimefield } from './CustomTimefield';
|
|
6
8
|
export type { CustomTimefieldProps } from './CustomTimefield';
|
|
7
9
|
export { CustomDateRangefield } from './CustomDateRangefield';
|
|
@@ -11,7 +11,7 @@ interface UseDatePopoverOptions {
|
|
|
11
11
|
offset?: number;
|
|
12
12
|
screenPadding?: number;
|
|
13
13
|
}
|
|
14
|
-
export declare function useDatePopover(options?: UseDatePopoverOptions): {
|
|
14
|
+
export declare function useDatePopover<TriggerElement extends HTMLElement = HTMLButtonElement>(options?: UseDatePopoverOptions): {
|
|
15
15
|
open: boolean;
|
|
16
16
|
ready: boolean;
|
|
17
17
|
setOpen: React.Dispatch<React.SetStateAction<boolean>>;
|
|
@@ -19,7 +19,9 @@ export declare function useDatePopover(options?: UseDatePopoverOptions): {
|
|
|
19
19
|
toggle: () => void;
|
|
20
20
|
position: AnchorPosition;
|
|
21
21
|
floatingStyle: React.CSSProperties;
|
|
22
|
-
triggerRef: React.RefObject<
|
|
22
|
+
triggerRef: React.RefObject<TriggerElement | null>;
|
|
23
23
|
panelRef: React.RefObject<HTMLDivElement | null>;
|
|
24
|
+
anchorVars: React.CSSProperties;
|
|
25
|
+
contentRef: React.RefObject<HTMLDivElement | null>;
|
|
24
26
|
};
|
|
25
27
|
export {};
|