@livechat/design-system-react-components 2.15.1 → 2.16.0
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/components/Checkbox/Checkbox.d.ts +4 -0
- package/dist/components/DatePicker/RangeDatePicker.d.ts +1 -1
- package/dist/components/DatePicker/helpers.d.ts +1 -1
- package/dist/components/DatePicker/types.d.ts +32 -4
- package/dist/components/OnboardingChecklist/types.d.ts +0 -1
- package/dist/components/RangeDatePickerV2/RangeDatePickerV2.d.ts +4 -0
- package/dist/components/RangeDatePickerV2/components/RangeDatePickerV2Label.d.ts +9 -0
- package/dist/components/RangeDatePickerV2/helpers.d.ts +15 -0
- package/dist/components/RangeDatePickerV2/index.d.ts +1 -0
- package/dist/components/RangeDatePickerV2/types.d.ts +11 -0
- package/dist/foundations/design-token.d.ts +16 -0
- package/dist/foundations/shadow-token.d.ts +7 -0
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +3933 -3590
- package/dist/style.css +1 -1
- package/package.json +2 -2
|
@@ -12,5 +12,9 @@ export interface CheckboxProps extends React.HTMLAttributes<HTMLInputElement> {
|
|
|
12
12
|
* Set the checkbox description
|
|
13
13
|
*/
|
|
14
14
|
description?: React.ReactNode;
|
|
15
|
+
/**
|
|
16
|
+
* Specify whether the checkbox should be in indeterminate state
|
|
17
|
+
*/
|
|
18
|
+
indeterminate?: boolean;
|
|
15
19
|
}
|
|
16
20
|
export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -2,7 +2,7 @@ import { ReactElement } from 'react';
|
|
|
2
2
|
import { IRangeDatePickerProps } from './types';
|
|
3
3
|
|
|
4
4
|
export declare const RangeDatePicker: {
|
|
5
|
-
({ options, initialSelectedItemKey, initialFromDate, initialToDate, toMonth, onChange, onSelect, children, }: IRangeDatePickerProps): ReactElement;
|
|
5
|
+
({ options, initialSelectedItemKey, initialFromDate, initialToDate, customTempFromDate, customTempToDate, toMonth, today, onChange, onRangeSelect, onSelect, onCustomTempDateRangeChange, children, }: IRangeDatePickerProps): ReactElement;
|
|
6
6
|
defaultProps: {
|
|
7
7
|
options: {
|
|
8
8
|
id: string;
|
|
@@ -5,6 +5,6 @@ export declare const isDateWithinRange: (date: Date, range: {
|
|
|
5
5
|
to?: Date;
|
|
6
6
|
}) => boolean;
|
|
7
7
|
export declare const calculateDatePickerMonth: (initialFromDate?: Date, initialToDate?: Date, toMonth?: Date) => Date;
|
|
8
|
-
export declare const getSelectedOption: (itemId: string | null, options
|
|
8
|
+
export declare const getSelectedOption: (itemId: string | null, options?: IRangeDatePickerOption[]) => IRangeDatePickerOption | undefined;
|
|
9
9
|
export declare const isSelectingFirstDay: (from?: Date, to?: Date) => boolean;
|
|
10
10
|
export declare const getInitialStateFromProps: (props: IRangeDatePickerProps) => Partial<IRangeDatePickerState>;
|
|
@@ -11,6 +11,7 @@ export interface IDatePickerCustomNavigationProps {
|
|
|
11
11
|
}
|
|
12
12
|
export declare enum RangeDatePickerAction {
|
|
13
13
|
NEW_SELECTED_ITEM = "NEW_SELECTED_ITEM",
|
|
14
|
+
NEW_TEMPORARY_FROM_VALUE = "NEW_TEMPORARY_FROM_VALUE",
|
|
14
15
|
NEW_TEMPORARY_TO_VALUE = "NEW_TEMPORARY_TO_VALUE",
|
|
15
16
|
CLEAR = "CLEAR",
|
|
16
17
|
SET_FROM = "SET_FROM",
|
|
@@ -18,7 +19,8 @@ export declare enum RangeDatePickerAction {
|
|
|
18
19
|
SELECT_FIRST_DAY = "SELECT_FIRST_DAY",
|
|
19
20
|
SELECT_SECOND_DAY_AS_FROM = "SELECT_SECOND_DAY_AS_FROM",
|
|
20
21
|
SELECT_SECOND_DAY_AS_TO = "SELECT_SECOND_DAY_AS_TO",
|
|
21
|
-
CURRENT_MONTH_CHANGE = "CURRENT_MONTH_CHANGE"
|
|
22
|
+
CURRENT_MONTH_CHANGE = "CURRENT_MONTH_CHANGE",
|
|
23
|
+
SET_CUSTOM_TEMP_RANGE = "SET_CUSTOM_TEMP_RANGE"
|
|
22
24
|
}
|
|
23
25
|
export type IRangeDatePickerReducerAction = {
|
|
24
26
|
type: RangeDatePickerAction.NEW_SELECTED_ITEM;
|
|
@@ -26,7 +28,7 @@ export type IRangeDatePickerReducerAction = {
|
|
|
26
28
|
selectedItem: string | null;
|
|
27
29
|
};
|
|
28
30
|
} | {
|
|
29
|
-
type: RangeDatePickerAction.NEW_TEMPORARY_TO_VALUE | RangeDatePickerAction.SELECT_FIRST_DAY | RangeDatePickerAction.SELECT_SECOND_DAY_AS_FROM | RangeDatePickerAction.SELECT_SECOND_DAY_AS_TO | RangeDatePickerAction.CURRENT_MONTH_CHANGE;
|
|
31
|
+
type: RangeDatePickerAction.NEW_TEMPORARY_FROM_VALUE | RangeDatePickerAction.NEW_TEMPORARY_TO_VALUE | RangeDatePickerAction.SELECT_FIRST_DAY | RangeDatePickerAction.SELECT_SECOND_DAY_AS_FROM | RangeDatePickerAction.SELECT_SECOND_DAY_AS_TO | RangeDatePickerAction.CURRENT_MONTH_CHANGE;
|
|
30
32
|
payload: {
|
|
31
33
|
date: Date;
|
|
32
34
|
};
|
|
@@ -35,13 +37,22 @@ export type IRangeDatePickerReducerAction = {
|
|
|
35
37
|
payload: {
|
|
36
38
|
date?: Date;
|
|
37
39
|
};
|
|
40
|
+
} | {
|
|
41
|
+
type: RangeDatePickerAction.SET_CUSTOM_TEMP_RANGE;
|
|
42
|
+
payload: {
|
|
43
|
+
customTempFrom?: Date;
|
|
44
|
+
customTempTo?: Date;
|
|
45
|
+
};
|
|
38
46
|
};
|
|
39
47
|
export interface IRangeDatePickerState {
|
|
40
48
|
selectedItem: string | null;
|
|
41
49
|
from?: Date;
|
|
42
50
|
to?: Date;
|
|
51
|
+
temporaryFrom?: Date;
|
|
43
52
|
temporaryTo?: Date;
|
|
44
53
|
currentMonth: Date;
|
|
54
|
+
customTempFrom?: Date;
|
|
55
|
+
customTempTo?: Date;
|
|
45
56
|
}
|
|
46
57
|
export type RangeDatePickerReducer = Reducer<IRangeDatePickerState, IRangeDatePickerReducerAction>;
|
|
47
58
|
export interface IRangeDatePickerOption {
|
|
@@ -65,13 +76,30 @@ export interface IRangeDatePickerChildrenPayload {
|
|
|
65
76
|
datepicker: DayPickerProps;
|
|
66
77
|
selectedOption?: IRangeDatePickerOption;
|
|
67
78
|
}
|
|
68
|
-
export interface
|
|
79
|
+
export interface IRangeDatePickerV1CoreProps {
|
|
80
|
+
onChange: (selected: IRangeDatePickerOption | null) => void;
|
|
69
81
|
options: IRangeDatePickerOption[];
|
|
70
82
|
initialSelectedItemKey?: string;
|
|
83
|
+
onRangeSelect?: never;
|
|
84
|
+
onCustomTempDateRangeChange?: never;
|
|
85
|
+
customTempFromDate?: never;
|
|
86
|
+
customTempToDate?: never;
|
|
87
|
+
}
|
|
88
|
+
export interface IRangeDatePickerV2CoreProps {
|
|
89
|
+
onRangeSelect: (selected: DateRange | null) => void;
|
|
90
|
+
onCustomTempDateRangeChange: (date: DateRange | undefined) => void;
|
|
91
|
+
customTempFromDate?: Date;
|
|
92
|
+
customTempToDate?: Date;
|
|
93
|
+
options?: never;
|
|
94
|
+
onChange?: never;
|
|
95
|
+
initialSelectedItemKey?: never;
|
|
96
|
+
}
|
|
97
|
+
export interface IRangeDatePickerCoreProps {
|
|
98
|
+
today?: Date;
|
|
71
99
|
initialFromDate?: Date;
|
|
72
100
|
initialToDate?: Date;
|
|
73
101
|
toMonth?: Date;
|
|
74
|
-
onChange: (selected: IRangeDatePickerOption | null) => void;
|
|
75
102
|
onSelect?: (selected: DateRange | null) => void;
|
|
76
103
|
children(payload: IRangeDatePickerChildrenPayload): ReactElement;
|
|
77
104
|
}
|
|
105
|
+
export type IRangeDatePickerProps = IRangeDatePickerCoreProps & (IRangeDatePickerV1CoreProps | IRangeDatePickerV2CoreProps);
|
|
@@ -28,7 +28,6 @@ export interface IChecklistItemProps {
|
|
|
28
28
|
export interface ICheckListItem extends Omit<IChecklistItemProps, 'placeholder'> {
|
|
29
29
|
isActive: boolean;
|
|
30
30
|
isChecked: boolean;
|
|
31
|
-
isLastElement: boolean;
|
|
32
31
|
onClick: (id: string) => void;
|
|
33
32
|
}
|
|
34
33
|
export type ICompletionMessageDataProps = {
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { DateRange } from 'react-day-picker';
|
|
2
|
+
import { RANGE_DATE_PICKER_OPTION_ID } from './types';
|
|
3
|
+
|
|
4
|
+
type RangeDatePickerSelectOptions = {
|
|
5
|
+
id: RANGE_DATE_PICKER_OPTION_ID;
|
|
6
|
+
label: string;
|
|
7
|
+
value: {
|
|
8
|
+
from: Date;
|
|
9
|
+
to: Date;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
export declare const OPTIONS: RangeDatePickerSelectOptions[];
|
|
13
|
+
type IsSameDate = (range?: DateRange, date?: DateRange) => boolean;
|
|
14
|
+
export declare const isSameDate: IsSameDate;
|
|
15
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { RangeDatePickerV2 } from './RangeDatePickerV2';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { DateRange } from 'react-day-picker';
|
|
2
|
+
import { IRangeDatePickerCoreProps } from '../DatePicker/types';
|
|
3
|
+
|
|
4
|
+
export type RANGE_DATE_PICKER_OPTION_ID = 'today' | 'yesterday' | 'last7days' | 'last30days' | 'lastMonth' | 'currentMonth';
|
|
5
|
+
export interface IRangeDatePickerV2Props extends Omit<IRangeDatePickerCoreProps, 'children'> {
|
|
6
|
+
triggerClassName?: string;
|
|
7
|
+
rangeDatePickerClassName?: string;
|
|
8
|
+
initiallyOpen?: boolean;
|
|
9
|
+
initialSelectedOptionId?: RANGE_DATE_PICKER_OPTION_ID;
|
|
10
|
+
onRangeSelect: (selected: DateRange | null, id?: RANGE_DATE_PICKER_OPTION_ID) => void;
|
|
11
|
+
}
|
|
@@ -372,5 +372,21 @@ export declare const DesignToken: {
|
|
|
372
372
|
ContentBasicPlaceholder: string;
|
|
373
373
|
InputPromoBorderDefault: string;
|
|
374
374
|
InputPromoBorderHover: string;
|
|
375
|
+
SurfaceAiCopilotBasicDefault: string;
|
|
376
|
+
SurfaceAiCopilotBasicHover: string;
|
|
377
|
+
SurfaceAiCopilotBasicActive: string;
|
|
378
|
+
SurfaceAiCopilotInvert01: string;
|
|
379
|
+
SurfaceAiCopilotInvert02: string;
|
|
380
|
+
SurfaceAiOther01Default: string;
|
|
381
|
+
SurfaceAiOther01Hover: string;
|
|
382
|
+
SurfaceAiOther01Active: string;
|
|
383
|
+
SurfaceAiOther02Default: string;
|
|
384
|
+
BorderAiCopilotBasicDefault: string;
|
|
385
|
+
BorderAiCopilotBasicHover: string;
|
|
386
|
+
BorderAiCopilotBasicActive: string;
|
|
387
|
+
BorderAiOther01: string;
|
|
388
|
+
ContentAiCopilotBasic: string;
|
|
389
|
+
ContentAiCopilotInvert: string;
|
|
390
|
+
ContentAiOther1Default: string;
|
|
375
391
|
};
|
|
376
392
|
export type DesignTokenKey = keyof typeof DesignToken;
|
|
@@ -22,5 +22,12 @@ export declare const ShadowToken: {
|
|
|
22
22
|
FixedLeft: string;
|
|
23
23
|
FixedTop: string;
|
|
24
24
|
FixedBottom: string;
|
|
25
|
+
ShadowAiCopilotAnimationStart: string;
|
|
26
|
+
ShadowAiCopilotAnimationMedium1: string;
|
|
27
|
+
ShadowAiCopilotAnimationMedium2: string;
|
|
28
|
+
ShadowAiCopilotAnimationMedium3: string;
|
|
29
|
+
ShadowAiCopilotAnimationEnd: string;
|
|
30
|
+
ShadowAiOtherFloat: string;
|
|
31
|
+
ShadowAiOtherActiveField: string;
|
|
25
32
|
};
|
|
26
33
|
export type ShadowTokenKey = keyof typeof ShadowToken;
|