@aivenio/aquarium 4.2.0 → 4.4.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/atoms.cjs +11 -6
- package/dist/atoms.mjs +11 -6
- package/dist/src/atoms/DatePicker/DatePicker.d.ts +80 -29
- package/dist/src/atoms/DatePicker/DatePicker.js +44 -3
- package/dist/src/atoms/Filter/Filter.d.ts +5 -0
- package/dist/src/atoms/Filter/Filter.js +7 -6
- package/dist/src/atoms/Modal/Modal.d.ts +9 -1
- package/dist/src/atoms/Modal/Modal.js +5 -4
- package/dist/src/molecules/DatePicker/DatePicker.d.ts +8 -2
- package/dist/src/molecules/DatePicker/DatePicker.js +9 -8
- package/dist/src/molecules/DatePicker/DateRangePicker.d.ts +12 -2
- package/dist/src/molecules/DatePicker/DateRangePicker.js +9 -8
- package/dist/src/molecules/Modal/Modal.js +5 -4
- package/dist/src/molecules/Spacing/Spacing.d.ts +1 -1
- package/dist/src/molecules/Spacing/Spacing.js +1 -1
- package/dist/styles.css +9 -3
- package/dist/system.cjs +74 -17
- package/dist/system.mjs +85 -25
- package/dist/tsconfig.module.tsbuildinfo +1 -1
- package/dist/types/tailwindGenerated.d.ts +1 -1
- package/package.json +1 -1
@@ -19,7 +19,7 @@ import { Spacing } from '../../../src/molecules/Spacing/Spacing';
|
|
19
19
|
import { TimeField } from '../../../src/molecules/TimeField/TimeField';
|
20
20
|
import { DateInput } from '../../../src/atoms/DateField/DateField';
|
21
21
|
import { Calendar } from '../../../src/atoms/DatePicker/Calendar';
|
22
|
-
import { DatePicker as DatePickerAtom, datePickerCalendarStyles } from '../../../src/atoms/DatePicker/DatePicker';
|
22
|
+
import { DatePicker as DatePickerAtom, datePickerCalendarStyles, Preset, Presets, } from '../../../src/atoms/DatePicker/DatePicker';
|
23
23
|
import { CalendarButton, ClearInputButton } from '../../../src/atoms/DatePicker/DatePickerButton';
|
24
24
|
import { Dialog } from '../../../src/atoms/Dialog/Dialog';
|
25
25
|
import { FieldGroup } from '../../../src/atoms/Field/Field';
|
@@ -47,12 +47,13 @@ const CalendarTimeField = (_a) => {
|
|
47
47
|
const DatePickerCalendarPropsContext = React.createContext(null);
|
48
48
|
const DatePickerCalendar = (props) => {
|
49
49
|
const ctx = React.useContext(DatePickerCalendarPropsContext);
|
50
|
-
const { variant, granularity, errorMessage } = mergeProps(ctx, props);
|
51
|
-
const { dialog, errorMessage: errorMessageStyle } = datePickerCalendarStyles();
|
50
|
+
const { variant, granularity, errorMessage, presets = [] } = mergeProps(ctx, props);
|
51
|
+
const { dialog, calendar, errorMessage: errorMessageStyle } = datePickerCalendarStyles();
|
52
52
|
return (React.createElement(Popover, { offset: 0 },
|
53
53
|
React.createElement(Dialog, { className: dialog() },
|
54
|
-
React.createElement(
|
55
|
-
|
54
|
+
presets.length > 0 && (React.createElement(Presets, null, presets.map((props) => (React.createElement(Preset, Object.assign({ key: props.value.toString() }, props)))))),
|
55
|
+
React.createElement(Spacing, { gap: "3", className: tw('p-5') },
|
56
|
+
React.createElement(Calendar, { className: calendar() }),
|
56
57
|
variant === 'datetime' && React.createElement(CalendarTimeField, { granularity: granularity }),
|
57
58
|
errorMessage && (React.createElement(Text, { slot: "errorMessage", className: errorMessageStyle() }, errorMessage))))));
|
58
59
|
};
|
@@ -67,11 +68,11 @@ const DatePickerField = ({ clearSelectionEnabled = true, disabled = false }) =>
|
|
67
68
|
DatePickerField.displayName = 'DatePicker.Field';
|
68
69
|
const createDatePickerBase = (variant) => {
|
69
70
|
const datePicker = (_a) => {
|
70
|
-
var { disabled, valid, shouldCloseOnSelect, errorMessage, clearSelectionEnabled = true, children } = _a, props = __rest(_a, ["disabled", "valid", "shouldCloseOnSelect", "errorMessage", "clearSelectionEnabled", "children"]);
|
71
|
+
var { disabled, valid, shouldCloseOnSelect, errorMessage, clearSelectionEnabled = true, presets, children } = _a, props = __rest(_a, ["disabled", "valid", "shouldCloseOnSelect", "errorMessage", "clearSelectionEnabled", "presets", "children"]);
|
71
72
|
const content = children !== null && children !== void 0 ? children : (React.createElement(React.Fragment, null,
|
72
73
|
React.createElement(DatePickerField, { clearSelectionEnabled: clearSelectionEnabled, disabled: disabled }),
|
73
74
|
React.createElement(DatePickerCalendar, null)));
|
74
|
-
return (React.createElement(DatePickerCalendarPropsContext.Provider, { value: { variant, granularity: props.granularity, errorMessage } },
|
75
|
+
return (React.createElement(DatePickerCalendarPropsContext.Provider, { value: { variant, granularity: props.granularity, errorMessage, presets } },
|
75
76
|
React.createElement(DatePickerAtom, Object.assign({}, props, { variant: variant, isDisabled: disabled, isInvalid: valid === false }), content)));
|
76
77
|
};
|
77
78
|
datePicker.Calendar = DatePickerCalendar;
|
@@ -104,4 +105,4 @@ const createDatePicker = (variant) => {
|
|
104
105
|
};
|
105
106
|
export const DatePicker = createDatePicker('date');
|
106
107
|
export const DateTimePicker = createDatePicker('datetime');
|
107
|
-
//# sourceMappingURL=data:application/json;base64,
|
108
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRGF0ZVBpY2tlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9tb2xlY3VsZXMvRGF0ZVBpY2tlci9EYXRlUGlja2VyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBRUwsc0JBQXNCLEVBRXRCLElBQUksR0FDTCxNQUFNLHVCQUF1QixDQUFDO0FBQy9CLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQztBQUM3QyxPQUFPLEVBQUUsVUFBVSxFQUFFLEtBQUssRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQ3RELE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxXQUFXLENBQUM7QUFFakMsT0FBTyxFQUFFLEdBQUcsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQzVDLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUN4RCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sbUNBQW1DLENBQUM7QUFFOUQsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQzFELE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUN6RCxPQUFPLEVBQ0wsVUFBVSxJQUFJLGNBQWMsRUFDNUIsd0JBQXdCLEVBQ3hCLE1BQU0sRUFFTixPQUFPLEdBQ1IsTUFBTSxpQ0FBaUMsQ0FBQztBQUN6QyxPQUFPLEVBQUUsY0FBYyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDekYsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ2pELE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUNuRCxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFFcEQsT0FBTyxFQUFFLG9CQUFvQixFQUFFLFlBQVksRUFBMEIsTUFBTSw0QkFBNEIsQ0FBQztBQUN4RyxPQUFPLEVBQUUsRUFBRSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFpQ3hDLE1BQU0scUJBQXFCLEdBQUcsR0FBRyxFQUFFO0lBQ2pDLE1BQU0sS0FBSyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQUMsc0JBQXNCLENBQUMsQ0FBQztJQUN2RCxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7UUFDWCxNQUFNLElBQUksS0FBSyxDQUFDLDhDQUE4QyxDQUFDLENBQUM7SUFDbEUsQ0FBQztJQUVELElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxFQUFFLENBQUM7UUFDakIsT0FBTyxJQUFJLENBQUM7SUFDZCxDQUFDO0lBRUQsT0FBTyxDQUNMLG9CQUFDLGdCQUFnQixJQUNmLE9BQU8sRUFBRSxHQUFHLEVBQUU7WUFDWixLQUFLLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQ3ZCLENBQUMsR0FDRCxDQUNILENBQUM7QUFDSixDQUFDLENBQUM7QUFFRixxQkFBcUIsQ0FBQyxXQUFXLEdBQUcsd0JBQXdCLENBQUM7QUFFN0QsTUFBTSxpQkFBaUIsR0FFbkIsQ0FBQyxFQUE2QyxFQUFFLEVBQUU7UUFBakQsRUFBRSxXQUFXLEVBQUUsU0FBUyxHQUFHLE1BQU0sT0FBWSxFQUFQLEtBQUssY0FBM0MsNEJBQTZDLENBQUY7SUFDOUMsTUFBTSxHQUFHLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDO0lBRXJELE9BQU8sQ0FDTCxvQkFBQyxTQUFTLG9CQUNKLEtBQUssSUFDVCxTQUFTLEVBQUUsU0FBUyxFQUNwQixXQUFXLEVBQUUsV0FBVyxLQUFLLEtBQUssQ0FBQyxDQUFDLENBQUMsV0FBVyxDQUFDLENBQUMsQ0FBQyxTQUFTLEVBQzVELEtBQUssRUFBRSxHQUFHLGFBQUgsR0FBRyx1QkFBSCxHQUFHLENBQUUsU0FBUyxFQUNyQixRQUFRLEVBQUUsQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLEtBQUssS0FBSSxHQUFHLGFBQUgsR0FBRyx1QkFBSCxHQUFHLENBQUUsWUFBWSxDQUFDLEtBQUssQ0FBQyxDQUFBLEVBQ3RELG9CQUFvQixFQUFFLEtBQUssSUFDM0IsQ0FDSCxDQUFDO0FBQ0osQ0FBQyxDQUFDO0FBU0YsTUFBTSw4QkFBOEIsR0FBRyxLQUFLLENBQUMsYUFBYSxDQUFpQyxJQUFJLENBQUMsQ0FBQztBQUVqRyxNQUFNLGtCQUFrQixHQUFHLENBQUMsS0FBdUMsRUFBRSxFQUFFO0lBQ3JFLE1BQU0sR0FBRyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQUMsOEJBQThCLENBQUMsQ0FBQztJQUM3RCxNQUFNLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxZQUFZLEVBQUUsT0FBTyxHQUFHLEVBQUUsRUFBRSxHQUFHLFVBQVUsQ0FBQyxHQUFHLEVBQUUsS0FBSyxDQUFDLENBQUM7SUFDcEYsTUFBTSxFQUFFLE1BQU0sRUFBRSxRQUFRLEVBQUUsWUFBWSxFQUFFLGlCQUFpQixFQUFFLEdBQUcsd0JBQXdCLEVBQUUsQ0FBQztJQUV6RixPQUFPLENBQ0wsb0JBQUMsT0FBTyxJQUFDLE1BQU0sRUFBRSxDQUFDO1FBQ2hCLG9CQUFDLE1BQU0sSUFBQyxTQUFTLEVBQUUsTUFBTSxFQUFFO1lBQ3hCLE9BQU8sQ0FBQyxNQUFNLEdBQUcsQ0FBQyxJQUFJLENBQ3JCLG9CQUFDLE9BQU8sUUFDTCxPQUFPLENBQUMsR0FBRyxDQUFDLENBQUMsS0FBSyxFQUFFLEVBQUUsQ0FBQyxDQUN0QixvQkFBQyxNQUFNLGtCQUFDLEdBQUcsRUFBRSxLQUFLLENBQUMsS0FBSyxDQUFDLFFBQVEsRUFBRSxJQUFNLEtBQUssRUFBSSxDQUNuRCxDQUFDLENBQ00sQ0FDWDtZQUNELG9CQUFDLE9BQU8sSUFBQyxHQUFHLEVBQUMsR0FBRyxFQUFDLFNBQVMsRUFBRSxFQUFFLENBQUMsS0FBSyxDQUFDO2dCQUNuQyxvQkFBQyxRQUFRLElBQUMsU0FBUyxFQUFFLFFBQVEsRUFBRSxHQUFJO2dCQUNsQyxPQUFPLEtBQUssVUFBVSxJQUFJLG9CQUFDLGlCQUFpQixJQUFDLFdBQVcsRUFBRSxXQUFXLEdBQUk7Z0JBQ3pFLFlBQVksSUFBSSxDQUNmLG9CQUFDLElBQUksSUFBQyxJQUFJLEVBQUMsY0FBYyxFQUFDLFNBQVMsRUFBRSxpQkFBaUIsRUFBRSxJQUNyRCxZQUFZLENBQ1IsQ0FDUixDQUNPLENBQ0gsQ0FDRCxDQUNYLENBQUM7QUFDSixDQUFDLENBQUM7QUFDRixrQkFBa0IsQ0FBQyxXQUFXLEdBQUcscUJBQXFCLENBQUM7QUFPdkQsTUFBTSxlQUFlLEdBQUcsQ0FBQyxFQUFFLHFCQUFxQixHQUFHLElBQUksRUFBRSxRQUFRLEdBQUcsS0FBSyxFQUF3QixFQUFFLEVBQUU7SUFDbkcsT0FBTyxDQUNMLG9CQUFDLFVBQVUsSUFBQyxTQUFTLEVBQUUsRUFBRSxDQUFDLHNCQUFzQixDQUFDO1FBQy9DLG9CQUFDLFNBQVMsSUFBQyxTQUFTLEVBQUUsRUFBRSxDQUFDLFFBQVEsQ0FBQyxHQUFJO1FBQ3RDLG9CQUFDLEdBQUcsQ0FBQyxJQUFJLElBQUMsVUFBVSxFQUFDLFFBQVEsRUFBQyxHQUFHLEVBQUMsR0FBRztZQUNsQyxxQkFBcUIsSUFBSSxDQUFDLFFBQVEsSUFBSSxvQkFBQyxxQkFBcUIsT0FBRztZQUNoRSxvQkFBQyxjQUFjLE9BQUcsQ0FDVCxDQUNBLENBQ2QsQ0FBQztBQUNKLENBQUMsQ0FBQztBQUNGLGVBQWUsQ0FBQyxXQUFXLEdBQUcsa0JBQWtCLENBQUM7QUFFakQsTUFBTSxvQkFBb0IsR0FBRyxDQUFDLE9BQTRCLEVBQUUsRUFBRTtJQUM1RCxNQUFNLFVBQVUsR0FBRyxDQUFzQixFQVNTLEVBQUUsRUFBRTtZQVRiLEVBQ3ZDLFFBQVEsRUFDUixLQUFLLEVBQ0wsbUJBQW1CLEVBQ25CLFlBQVksRUFDWixxQkFBcUIsR0FBRyxJQUFJLEVBQzVCLE9BQU8sRUFDUCxRQUFRLE9BRXdDLEVBRDdDLEtBQUssY0FSK0IsNEdBU3hDLENBRFM7UUFFUixNQUFNLE9BQU8sR0FBRyxRQUFRLGFBQVIsUUFBUSxjQUFSLFFBQVEsR0FBSSxDQUMxQjtZQUNFLG9CQUFDLGVBQWUsSUFBQyxxQkFBcUIsRUFBRSxxQkFBcUIsRUFBRSxRQUFRLEVBQUUsUUFBUSxHQUFJO1lBQ3JGLG9CQUFDLGtCQUFrQixPQUFHLENBQ3JCLENBQ0osQ0FBQztRQUVGLE9BQU8sQ0FDTCxvQkFBQyw4QkFBOEIsQ0FBQyxRQUFRLElBQ3RDLEtBQUssRUFBRSxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsS0FBSyxDQUFDLFdBQVcsRUFBRSxZQUFZLEVBQUUsT0FBTyxFQUFFO1lBRXpFLG9CQUFDLGNBQWMsb0JBQUssS0FBSyxJQUFFLE9BQU8sRUFBRSxPQUFPLEVBQUUsVUFBVSxFQUFFLFFBQVEsRUFBRSxTQUFTLEVBQUUsS0FBSyxLQUFLLEtBQUssS0FDMUYsT0FBTyxDQUNPLENBQ3VCLENBQzNDLENBQUM7SUFDSixDQUFDLENBQUM7SUFFRixVQUFVLENBQUMsUUFBUSxHQUFHLGtCQUFrQixDQUFDO0lBQ3pDLFVBQVUsQ0FBQyxLQUFLLEdBQUcsZUFBZSxDQUFDO0lBQ25DLFVBQVUsQ0FBQyxXQUFXLEdBQUcsT0FBTyxLQUFLLE1BQU0sQ0FBQyxDQUFDLENBQUMsZ0JBQWdCLENBQUMsQ0FBQyxDQUFDLG9CQUFvQixDQUFDO0lBQ3RGLE9BQU8sVUFBVSxDQUFDO0FBQ3BCLENBQUMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLGNBQWMsR0FBRyxvQkFBb0IsQ0FBQyxNQUFNLENBQUMsQ0FBQztBQUUzRCxNQUFNLENBQUMsTUFBTSxrQkFBa0IsR0FBRyxvQkFBb0IsQ0FBQyxVQUFVLENBQUMsQ0FBQztBQUluRSxNQUFNLGdCQUFnQixHQUFHLENBQUMsT0FBNEIsRUFBRSxFQUFFO0lBQ3hELHNEQUFzRDtJQUN0RCxNQUFNLFVBQVUsR0FBRyxDQUFzQixLQUF5QixFQUFFLEVBQUU7O1FBQ3BFLHNEQUFzRDtRQUN0RCxNQUFNLEVBQUUsVUFBVSxFQUFFLFVBQVUsRUFBRSxHQUFHLFFBQVEsQ0FBQyxFQUFFLE9BQU8sRUFBRSxLQUFLLENBQUMsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLENBQUMsWUFBWSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBQzdHLHNEQUFzRDtRQUN0RCxNQUFNLGNBQWMsR0FBRyxLQUFLLEVBQUUsQ0FBQztRQUMvQixNQUFNLFVBQVUsR0FDZCxLQUFLLENBQUMsS0FBSyxLQUFLLEtBQUs7WUFDbkIsQ0FBQyxDQUFDLEVBQUUsY0FBYyxFQUFFLElBQUksRUFBRSxrQkFBa0IsRUFBRSxjQUFjLEVBQUUsY0FBYyxFQUFFLE1BQUEsS0FBSyxDQUFDLFVBQVUsbUNBQUksS0FBSyxDQUFDLEtBQUssRUFBRTtZQUMvRyxDQUFDLENBQUMsRUFBRSxDQUFDO1FBQ1QsTUFBTSxLQUFzRCxvQkFBb0IsQ0FBQyxLQUFLLENBQUMsRUFBakYsRUFBRSxhQUFhLEVBQUUsVUFBVSxPQUFzRCxFQUFqRCxpQkFBaUIsY0FBakQsZUFBbUQsQ0FBOEIsQ0FBQztRQUN4RixNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsS0FBSyxFQUFFLE1BQU0sQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFDO1FBRTlELE1BQU0sUUFBUSwrREFBUSxTQUFTLEdBQUssVUFBVSxHQUFLLFVBQVUsS0FBRSxRQUFRLEVBQUUsS0FBSyxDQUFDLFFBQVEsRUFBRSxLQUFLLEVBQUUsS0FBSyxDQUFDLEtBQUssR0FBRSxDQUFDO1FBRTlHLE9BQU8sQ0FDTCxvQkFBQyxZQUFZLG9CQUFLLFVBQVUsRUFBTSxpQkFBaUIsSUFBRSxTQUFTLEVBQUUsY0FBYyxFQUFFLFNBQVMsRUFBQyxxQkFBcUIsS0FDNUcsT0FBTyxLQUFLLE1BQU0sQ0FBQyxDQUFDLENBQUMsb0JBQUMsY0FBYyxvQkFBSyxRQUFRLEVBQUksQ0FBQyxDQUFDLENBQUMsb0JBQUMsa0JBQWtCLG9CQUFLLFFBQVEsRUFBSSxDQUNoRixDQUNoQixDQUFDO0lBQ0osQ0FBQyxDQUFDO0lBRUYsVUFBVSxDQUFDLFFBQVEsR0FBRyxrQkFBa0IsQ0FBQztJQUN6QyxVQUFVLENBQUMsS0FBSyxHQUFHLGVBQWUsQ0FBQztJQUNuQyxVQUFVLENBQUMsV0FBVyxHQUFHLE9BQU8sS0FBSyxNQUFNLENBQUMsQ0FBQyxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUMsZ0JBQWdCLENBQUM7SUFDOUUsT0FBTyxVQUFVLENBQUM7QUFDcEIsQ0FBQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sVUFBVSxHQUFHLGdCQUFnQixDQUFDLE1BQU0sQ0FBQyxDQUFDO0FBRW5ELE1BQU0sQ0FBQyxNQUFNLGNBQWMsR0FBRyxnQkFBZ0IsQ0FBQyxVQUFVLENBQUMsQ0FBQyJ9
|
@@ -1,24 +1,34 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { type DateRangePickerProps as AriaDateRangePickerProps, type DateValue } from 'react-aria-components';
|
3
|
+
import { type RangePresetProps } from '../../../src/atoms/DatePicker/DatePicker';
|
3
4
|
import { type LabelControlProps } from '../../../src/utils/form/Label/Label';
|
4
5
|
import type { Granularity } from '@react-types/datepicker';
|
5
6
|
export type DateRangePickerBaseProps<T extends DateValue> = Omit<AriaDateRangePickerProps<T>, 'children' | 'className' | 'isDisabled' | 'isInvalid' | 'isReadOnly' | 'isRequired' | 'pageBehavior' | 'slot' | 'style' | 'validate' | 'validationBehavior'> & {
|
6
7
|
disabled?: boolean;
|
7
8
|
valid?: boolean;
|
8
9
|
errorMessage?: string;
|
10
|
+
/**
|
11
|
+
* If true, users can use "x" button to clear the selection.
|
12
|
+
* @default true
|
13
|
+
*/
|
9
14
|
clearSelectionEnabled?: boolean;
|
15
|
+
/**
|
16
|
+
* Optional array of preset values to display in the calendar.
|
17
|
+
*/
|
18
|
+
presets?: RangePresetProps[];
|
10
19
|
};
|
11
20
|
type DateRangePickerCalendarProps = {
|
12
21
|
variant: 'date' | 'datetime';
|
13
22
|
granularity?: Granularity;
|
14
23
|
errorMessage?: string;
|
24
|
+
presets?: RangePresetProps[];
|
15
25
|
};
|
16
26
|
type DateRangePickerFieldProps = {
|
17
27
|
clearSelectionEnabled?: boolean;
|
18
28
|
disabled?: boolean;
|
19
29
|
};
|
20
30
|
export declare const DateRangePickerBase: {
|
21
|
-
<T extends DateValue>({ disabled, valid, shouldCloseOnSelect, errorMessage, clearSelectionEnabled, children, ...props }: React.PropsWithChildren<DateRangePickerBaseProps<T>>): React.JSX.Element;
|
31
|
+
<T extends DateValue>({ disabled, valid, shouldCloseOnSelect, errorMessage, clearSelectionEnabled, presets, children, ...props }: React.PropsWithChildren<DateRangePickerBaseProps<T>>): React.JSX.Element;
|
22
32
|
Calendar: {
|
23
33
|
(props: Partial<DateRangePickerCalendarProps>): React.JSX.Element;
|
24
34
|
displayName: string;
|
@@ -30,7 +40,7 @@ export declare const DateRangePickerBase: {
|
|
30
40
|
displayName: string;
|
31
41
|
};
|
32
42
|
export declare const DateTimeRangePickerBase: {
|
33
|
-
<T extends DateValue>({ disabled, valid, shouldCloseOnSelect, errorMessage, clearSelectionEnabled, children, ...props }: React.PropsWithChildren<DateRangePickerBaseProps<T>>): React.JSX.Element;
|
43
|
+
<T extends DateValue>({ disabled, valid, shouldCloseOnSelect, errorMessage, clearSelectionEnabled, presets, children, ...props }: React.PropsWithChildren<DateRangePickerBaseProps<T>>): React.JSX.Element;
|
34
44
|
Calendar: {
|
35
45
|
(props: Partial<DateRangePickerCalendarProps>): React.JSX.Element;
|
36
46
|
displayName: string;
|
@@ -18,7 +18,7 @@ import { Box } from '../../../src/molecules/Box/Box';
|
|
18
18
|
import { Spacing } from '../../../src/molecules/Spacing/Spacing';
|
19
19
|
import { TimeField } from '../../../src/molecules/TimeField/TimeField';
|
20
20
|
import { DateInput } from '../../../src/atoms/DateField/DateField';
|
21
|
-
import { datePickerCalendarStyles, DateRangePicker as DateRangePickerAtom } from '../../../src/atoms/DatePicker/DatePicker';
|
21
|
+
import { datePickerCalendarStyles, DateRangePicker as DateRangePickerAtom, Presets, RangePreset, } from '../../../src/atoms/DatePicker/DatePicker';
|
22
22
|
import { CalendarButton, ClearInputButton } from '../../../src/atoms/DatePicker/DatePickerButton';
|
23
23
|
import { RangeCalendar } from '../../../src/atoms/DatePicker/RangeCalendar';
|
24
24
|
import { Dialog } from '../../../src/atoms/Dialog/Dialog';
|
@@ -48,12 +48,13 @@ const RangeCalendarTimeField = (_a) => {
|
|
48
48
|
const DateRangePickerCalendarPropsContext = React.createContext(null);
|
49
49
|
const DateRangePickerCalendar = (props) => {
|
50
50
|
const ctx = React.useContext(DateRangePickerCalendarPropsContext);
|
51
|
-
const { variant, granularity, errorMessage } = mergeProps(ctx, props);
|
52
|
-
const { dialog, errorMessage: errorMessageStyle } = datePickerCalendarStyles();
|
51
|
+
const { variant, granularity, errorMessage, presets = [] } = mergeProps(ctx, props);
|
52
|
+
const { dialog, calendar, errorMessage: errorMessageStyle } = datePickerCalendarStyles();
|
53
53
|
return (React.createElement(Popover, { offset: 0 },
|
54
54
|
React.createElement(Dialog, { className: dialog() },
|
55
|
-
React.createElement(
|
56
|
-
|
55
|
+
presets.length > 0 && (React.createElement(Presets, null, presets.map((props) => (React.createElement(RangePreset, Object.assign({ key: `${props.value.start.toString()}-${props.value.end.toString()}` }, props)))))),
|
56
|
+
React.createElement(Spacing, { gap: "3", className: tw('p-5') },
|
57
|
+
React.createElement(RangeCalendar, { className: calendar() }),
|
57
58
|
variant === 'datetime' && (React.createElement(Box.Flex, { gap: "6" },
|
58
59
|
React.createElement("div", { className: tw('flex-1') },
|
59
60
|
React.createElement(RangeCalendarTimeField, { granularity: granularity, part: "start" })),
|
@@ -74,11 +75,11 @@ const DateRangePickerField = ({ clearSelectionEnabled = true, disabled = false }
|
|
74
75
|
DateRangePickerField.displayName = 'DateRangePicker.Field';
|
75
76
|
const createDateRangePickerBase = (variant) => {
|
76
77
|
const dateRangePicker = (_a) => {
|
77
|
-
var { disabled, valid, shouldCloseOnSelect, errorMessage, clearSelectionEnabled = true, children } = _a, props = __rest(_a, ["disabled", "valid", "shouldCloseOnSelect", "errorMessage", "clearSelectionEnabled", "children"]);
|
78
|
+
var { disabled, valid, shouldCloseOnSelect, errorMessage, clearSelectionEnabled = true, presets, children } = _a, props = __rest(_a, ["disabled", "valid", "shouldCloseOnSelect", "errorMessage", "clearSelectionEnabled", "presets", "children"]);
|
78
79
|
const content = children !== null && children !== void 0 ? children : (React.createElement(React.Fragment, null,
|
79
80
|
React.createElement(DateRangePickerField, { clearSelectionEnabled: clearSelectionEnabled, disabled: disabled }),
|
80
81
|
React.createElement(DateRangePickerCalendar, { variant: variant, granularity: props.granularity, errorMessage: errorMessage })));
|
81
|
-
return (React.createElement(DateRangePickerCalendarPropsContext.Provider, { value: { variant, granularity: props.granularity, errorMessage } },
|
82
|
+
return (React.createElement(DateRangePickerCalendarPropsContext.Provider, { value: { variant, granularity: props.granularity, errorMessage, presets } },
|
82
83
|
React.createElement(DateRangePickerAtom, Object.assign({}, props, { variant: variant, isDisabled: disabled, isInvalid: valid === false }), content)));
|
83
84
|
};
|
84
85
|
dateRangePicker.Calendar = DateRangePickerCalendar;
|
@@ -111,4 +112,4 @@ const createDateRangePicker = (variant) => {
|
|
111
112
|
};
|
112
113
|
export const DateRangePicker = createDateRangePicker('date');
|
113
114
|
export const DateTimeRangePicker = createDateRangePicker('datetime');
|
114
|
-
//# sourceMappingURL=data:application/json;base64,
|
115
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRGF0ZVJhbmdlUGlja2VyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL21vbGVjdWxlcy9EYXRlUGlja2VyL0RhdGVSYW5nZVBpY2tlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7QUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUVMLDJCQUEyQixFQUUzQixJQUFJLEdBQ0wsTUFBTSx1QkFBdUIsQ0FBQztBQUMvQixPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sbUJBQW1CLENBQUM7QUFDN0MsT0FBTyxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQztBQUN0RCxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sV0FBVyxDQUFDO0FBRWpDLE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUM1QyxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFDeEQsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBRTlELE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUMxRCxPQUFPLEVBQ0wsd0JBQXdCLEVBQ3hCLGVBQWUsSUFBSSxtQkFBbUIsRUFDdEMsT0FBTyxFQUNQLFdBQVcsR0FFWixNQUFNLGlDQUFpQyxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxjQUFjLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQztBQUN6RixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sb0NBQW9DLENBQUM7QUFDbkUsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ2pELE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUNuRCxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFFcEQsT0FBTyxFQUFFLG9CQUFvQixFQUFF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
|
@@ -11,7 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
11
11
|
};
|
12
12
|
import React from 'react';
|
13
13
|
import { Dialog as AriaDialog, Modal as AriaModal, ModalOverlay as AriaModalOverlay } from 'react-aria-components';
|
14
|
-
import { castArray, omit } from 'lodash-es';
|
14
|
+
import { castArray, isEmpty, omit } from 'lodash-es';
|
15
15
|
import { Button } from '../../../src/molecules/Button/Button';
|
16
16
|
import { createTabsComponent, ModalTab, TabContainer as ModalTabContainer, TabItem, } from '../../../src/molecules/Tabs/Tabs';
|
17
17
|
import { Modal as BaseModal, modalStyles } from '../../../src/atoms/Modal/Modal';
|
@@ -25,6 +25,7 @@ export const Modal = ({ open, onClose, closeOnEsc = true, size = 'md', headerIma
|
|
25
25
|
}
|
26
26
|
const styles = modalStyles({ kind: 'dialog', size });
|
27
27
|
const hasTabs = isComponentType(children, ModalTabs);
|
28
|
+
const hasActions = (secondaryActions && !isEmpty(secondaryActions)) || primaryAction;
|
28
29
|
return (React.createElement(AriaModalOverlay, { isOpen: open, onOpenChange: (isOpen) => !isOpen && onClose(), isDismissable: false, isKeyboardDismissDisabled: !closeOnEsc, className: styles.overlay({ className: 'Aquarium-Modal' }) },
|
29
30
|
size !== 'screen' && React.createElement(BaseModal.BackDrop, { className: styles.backdrop() }),
|
30
31
|
React.createElement(AriaModal, { className: styles.dialog() },
|
@@ -36,8 +37,8 @@ export const Modal = ({ open, onClose, closeOnEsc = true, size = 'md', headerIma
|
|
36
37
|
React.createElement(BaseModal.TitleContainer, null,
|
37
38
|
React.createElement(ModalTitle, { kind: "dialog" }, title),
|
38
39
|
subtitle && React.createElement(BaseModal.Subtitle, null, subtitle))),
|
39
|
-
hasTabs ? (React.cloneElement(children, { className: tw('[&>div:first-child]:px-5 grow') })) : (React.createElement(BaseModal.Body, { tabIndex: 0, noFooter: !
|
40
|
-
|
40
|
+
hasTabs ? (React.cloneElement(children, { className: tw('[&>div:first-child]:px-5 grow') })) : (React.createElement(BaseModal.Body, { tabIndex: 0, noFooter: !hasActions, size: size }, children)),
|
41
|
+
hasActions && (React.createElement(BaseModal.Footer, null,
|
41
42
|
React.createElement(BaseModal.Actions, null,
|
42
43
|
secondaryActions &&
|
43
44
|
castArray(secondaryActions)
|
@@ -50,4 +51,4 @@ export const Modal = ({ open, onClose, closeOnEsc = true, size = 'md', headerIma
|
|
50
51
|
};
|
51
52
|
export const ModalTabs = createTabsComponent(ModalTab, TabItem, 'ModalTabs', (children, selected, props) => (React.createElement(BaseModal.Body, { maxHeight: props.maxHeight },
|
52
53
|
React.createElement(ModalTabContainer, null, children.find((node, index) => (node === null || node === void 0 ? void 0 : node.props.value) === selected || index === selected)))));
|
53
|
-
//# sourceMappingURL=data:application/json;base64,
|
54
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTW9kYWwuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvbW9sZWN1bGVzL01vZGFsL01vZGFsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsTUFBTSxJQUFJLFVBQVUsRUFBRSxLQUFLLElBQUksU0FBUyxFQUFFLFlBQVksSUFBSSxnQkFBZ0IsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQ25ILE9BQU8sRUFBRSxTQUFTLEVBQUUsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLFdBQVcsQ0FBQztBQUVyRCxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDckQsT0FBTyxFQUNMLG1CQUFtQixFQUNuQixRQUFRLEVBQ1IsWUFBWSxJQUFJLGlCQUFpQixFQUNqQyxPQUFPLEdBSVIsTUFBTSx5QkFBeUIsQ0FBQztBQUVqQyxPQUFPLEVBQUUsS0FBSyxJQUFJLFNBQVMsRUFBa0IsV0FBVyxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFFeEYsT0FBTyxFQUFFLEVBQUUsRUFBRSxNQUFNLG9CQUFvQixDQUFDO0FBQ3hDLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxhQUFhLENBQUM7QUFFOUMsT0FBTyxLQUFLLE1BQU0saUJBQWlCLENBQUM7QUFFcEMsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGNBQWMsQ0FBQztBQTJDMUMsTUFBTSxDQUFDLE1BQU0sS0FBSyxHQUF5QixDQUFDLEVBQzFDLElBQUksRUFDSixPQUFPLEVBQ1AsVUFBVSxHQUFHLElBQUksRUFDakIsSUFBSSxHQUFHLElBQUksRUFDWCxXQUFXLEVBQ1gsUUFBUSxFQUNSLEtBQUssRUFDTCxRQUFRLEVBQ1IsYUFBYSxFQUNiLGdCQUFnQixHQUNqQixFQUFFLEVBQUU7SUFDSCxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDVixPQUFPLElBQUks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
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
import { type BoxProps } from '../../../src/molecules/Box/Box';
|
3
3
|
import type twTheme from '../../../tailwind.theme.json';
|
4
|
-
export type SpacingProps = Pick<BoxProps, 'alignContent' | 'alignItems' | 'alignSelf' | 'justifyContent' | 'style'> & {
|
4
|
+
export type SpacingProps = Pick<BoxProps, 'alignContent' | 'alignItems' | 'alignSelf' | 'className' | 'justifyContent' | 'style'> & {
|
5
5
|
/**
|
6
6
|
* Gap between children elements.
|
7
7
|
*/
|
@@ -15,4 +15,4 @@ export const Spacing = (_a) => {
|
|
15
15
|
var { gap, row } = _a, rest = __rest(_a, ["gap", "row"]);
|
16
16
|
return React.createElement(Box, Object.assign({}, rest, { display: "flex", flexDirection: row ? 'row' : 'column', gap: gap }));
|
17
17
|
};
|
18
|
-
//# sourceMappingURL=data:application/json;base64,
|
18
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU3BhY2luZy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9tb2xlY3VsZXMvU3BhY2luZy9TcGFjaW5nLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7OztBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUUxQixPQUFPLEVBQUUsR0FBRyxFQUFpQixNQUFNLHVCQUF1QixDQUFDO0FBa0IzRCxNQUFNLENBQUMsTUFBTSxPQUFPLEdBQTZELENBQUMsRUFBcUIsRUFBRSxFQUFFO1FBQXpCLEVBQUUsR0FBRyxFQUFFLEdBQUcsT0FBVyxFQUFOLElBQUksY0FBbkIsY0FBcUIsQ0FBRjtJQUNuRyxPQUFPLG9CQUFDLEdBQUcsb0JBQUssSUFBSSxJQUFFLE9BQU8sRUFBQyxNQUFNLEVBQUMsYUFBYSxFQUFFLEdBQUcsQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxRQUFRLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxDQUFDO0FBQzNGLENBQUMsQ0FBQyJ9
|
package/dist/styles.css
CHANGED
@@ -1130,9 +1130,6 @@ input[type='number'].no-arrows {
|
|
1130
1130
|
.mb-5{
|
1131
1131
|
margin-bottom: 16px;
|
1132
1132
|
}
|
1133
|
-
.mb-6{
|
1134
|
-
margin-bottom: 24px;
|
1135
|
-
}
|
1136
1133
|
.mb-\[-20px\]{
|
1137
1134
|
margin-bottom: -20px;
|
1138
1135
|
}
|
@@ -1412,6 +1409,9 @@ input[type='number'].no-arrows {
|
|
1412
1409
|
.min-w-0{
|
1413
1410
|
min-width: 0px;
|
1414
1411
|
}
|
1412
|
+
.min-w-\[150px\]{
|
1413
|
+
min-width: 150px;
|
1414
|
+
}
|
1415
1415
|
.min-w-\[200px\]{
|
1416
1416
|
min-width: 200px;
|
1417
1417
|
}
|
@@ -1705,6 +1705,9 @@ input[type='number'].no-arrows {
|
|
1705
1705
|
.self-center{
|
1706
1706
|
align-self: center;
|
1707
1707
|
}
|
1708
|
+
.self-stretch{
|
1709
|
+
align-self: stretch;
|
1710
|
+
}
|
1708
1711
|
.justify-self-center{
|
1709
1712
|
justify-self: center;
|
1710
1713
|
}
|
@@ -2963,6 +2966,9 @@ input[type='number'].no-arrows {
|
|
2963
2966
|
.pt-3{
|
2964
2967
|
padding-top: 8px;
|
2965
2968
|
}
|
2969
|
+
.pt-6{
|
2970
|
+
padding-top: 24px;
|
2971
|
+
}
|
2966
2972
|
.text-left{
|
2967
2973
|
text-align: left;
|
2968
2974
|
}
|
package/dist/system.cjs
CHANGED
@@ -12388,8 +12388,21 @@ var import_react_aria_components9 = require("react-aria-components");
|
|
12388
12388
|
var import_tailwind_variants11 = require("tailwind-variants");
|
12389
12389
|
var datePickerCalendarStyles = (0, import_tailwind_variants11.tv)({
|
12390
12390
|
slots: {
|
12391
|
-
dialog: "
|
12392
|
-
|
12391
|
+
dialog: "flex",
|
12392
|
+
calendar: "[[data-placement]>&]:px-5 [[data-placement]>&]:py-6 max-h-[inherit]",
|
12393
|
+
errorMessage: "typography-caption text-danger-default max-w-[300px]",
|
12394
|
+
presets: "bg-muted py-6 px-5 flex flex-col min-w-[150px] max-w-[300px] self-stretch",
|
12395
|
+
preset: "hover:text-primary-active p-3 text-left hover:underline"
|
12396
|
+
},
|
12397
|
+
variants: {
|
12398
|
+
isPresetActive: {
|
12399
|
+
true: {
|
12400
|
+
preset: "text-primary-active typography-small-strong"
|
12401
|
+
},
|
12402
|
+
false: {
|
12403
|
+
preset: "typography-small"
|
12404
|
+
}
|
12405
|
+
}
|
12393
12406
|
}
|
12394
12407
|
});
|
12395
12408
|
var DatePicker = ({ variant, ...props }) => {
|
@@ -12414,6 +12427,30 @@ var DateRangePicker = ({ variant, ...props }) => {
|
|
12414
12427
|
}
|
12415
12428
|
);
|
12416
12429
|
};
|
12430
|
+
var Presets = ({ children }) => {
|
12431
|
+
const { presets } = datePickerCalendarStyles();
|
12432
|
+
return /* @__PURE__ */ import_react93.default.createElement("div", { className: presets() }, children);
|
12433
|
+
};
|
12434
|
+
var Preset = ({ value, label }) => {
|
12435
|
+
const { preset } = datePickerCalendarStyles();
|
12436
|
+
const context2 = import_react93.default.useContext(import_react_aria_components9.DatePickerStateContext);
|
12437
|
+
const handlePress = () => {
|
12438
|
+
context2?.setValue(value);
|
12439
|
+
context2?.close();
|
12440
|
+
};
|
12441
|
+
const isActive = context2?.value !== void 0 && context2.value?.toString() === value.toString();
|
12442
|
+
return /* @__PURE__ */ import_react93.default.createElement(import_react_aria_components9.Button, { onPress: handlePress, className: preset({ isPresetActive: isActive }) }, label);
|
12443
|
+
};
|
12444
|
+
var RangePreset = ({ value, label }) => {
|
12445
|
+
const { preset } = datePickerCalendarStyles();
|
12446
|
+
const context2 = import_react93.default.useContext(import_react_aria_components9.DateRangePickerStateContext);
|
12447
|
+
const handlePress = () => {
|
12448
|
+
context2?.setValue(value);
|
12449
|
+
context2?.close();
|
12450
|
+
};
|
12451
|
+
const isActive = context2?.value !== void 0 && context2.value.start?.toString() === value.start.toString() && context2.value.end?.toString() === value.end.toString();
|
12452
|
+
return /* @__PURE__ */ import_react93.default.createElement(import_react_aria_components9.Button, { onPress: handlePress, className: preset({ isPresetActive: isActive }) }, label);
|
12453
|
+
};
|
12417
12454
|
|
12418
12455
|
// src/atoms/Dialog/Dialog.tsx
|
12419
12456
|
var import_react94 = __toESM(require("react"));
|
@@ -14943,9 +14980,9 @@ var CalendarTimeField = ({ granularity, labelText = "Time", ...props }) => {
|
|
14943
14980
|
var DatePickerCalendarPropsContext = import_react95.default.createContext(null);
|
14944
14981
|
var DatePickerCalendar = (props) => {
|
14945
14982
|
const ctx = import_react95.default.useContext(DatePickerCalendarPropsContext);
|
14946
|
-
const { variant, granularity, errorMessage } = (0, import_utils24.mergeProps)(ctx, props);
|
14947
|
-
const { dialog, errorMessage: errorMessageStyle } = datePickerCalendarStyles();
|
14948
|
-
return /* @__PURE__ */ import_react95.default.createElement(Popover, { offset: 0 }, /* @__PURE__ */ import_react95.default.createElement(Dialog, { className: dialog() }, /* @__PURE__ */ import_react95.default.createElement(Spacing, { gap: "3" }, /* @__PURE__ */ import_react95.default.createElement(Calendar,
|
14983
|
+
const { variant, granularity, errorMessage, presets = [] } = (0, import_utils24.mergeProps)(ctx, props);
|
14984
|
+
const { dialog, calendar, errorMessage: errorMessageStyle } = datePickerCalendarStyles();
|
14985
|
+
return /* @__PURE__ */ import_react95.default.createElement(Popover, { offset: 0 }, /* @__PURE__ */ import_react95.default.createElement(Dialog, { className: dialog() }, presets.length > 0 && /* @__PURE__ */ import_react95.default.createElement(Presets, null, presets.map((props2) => /* @__PURE__ */ import_react95.default.createElement(Preset, { key: props2.value.toString(), ...props2 }))), /* @__PURE__ */ import_react95.default.createElement(Spacing, { gap: "3", className: tw("p-5") }, /* @__PURE__ */ import_react95.default.createElement(Calendar, { className: calendar() }), variant === "datetime" && /* @__PURE__ */ import_react95.default.createElement(CalendarTimeField, { granularity }), errorMessage && /* @__PURE__ */ import_react95.default.createElement(import_react_aria_components11.Text, { slot: "errorMessage", className: errorMessageStyle() }, errorMessage))));
|
14949
14986
|
};
|
14950
14987
|
DatePickerCalendar.displayName = "DatePicker.Calendar";
|
14951
14988
|
var DatePickerField = ({ clearSelectionEnabled = true, disabled = false }) => {
|
@@ -14959,11 +14996,18 @@ var createDatePickerBase = (variant) => {
|
|
14959
14996
|
shouldCloseOnSelect,
|
14960
14997
|
errorMessage,
|
14961
14998
|
clearSelectionEnabled = true,
|
14999
|
+
presets,
|
14962
15000
|
children,
|
14963
15001
|
...props
|
14964
15002
|
}) => {
|
14965
15003
|
const content = children ?? /* @__PURE__ */ import_react95.default.createElement(import_react95.default.Fragment, null, /* @__PURE__ */ import_react95.default.createElement(DatePickerField, { clearSelectionEnabled, disabled }), /* @__PURE__ */ import_react95.default.createElement(DatePickerCalendar, null));
|
14966
|
-
return /* @__PURE__ */ import_react95.default.createElement(
|
15004
|
+
return /* @__PURE__ */ import_react95.default.createElement(
|
15005
|
+
DatePickerCalendarPropsContext.Provider,
|
15006
|
+
{
|
15007
|
+
value: { variant, granularity: props.granularity, errorMessage, presets }
|
15008
|
+
},
|
15009
|
+
/* @__PURE__ */ import_react95.default.createElement(DatePicker, { ...props, variant, isDisabled: disabled, isInvalid: valid === false }, content)
|
15010
|
+
);
|
14967
15011
|
};
|
14968
15012
|
datePicker.Calendar = DatePickerCalendar;
|
14969
15013
|
datePicker.Field = DatePickerField;
|
@@ -15085,9 +15129,9 @@ var RangeCalendarTimeField = ({ granularity, part, ...props }) => {
|
|
15085
15129
|
var DateRangePickerCalendarPropsContext = import_react97.default.createContext(null);
|
15086
15130
|
var DateRangePickerCalendar = (props) => {
|
15087
15131
|
const ctx = import_react97.default.useContext(DateRangePickerCalendarPropsContext);
|
15088
|
-
const { variant, granularity, errorMessage } = (0, import_utils26.mergeProps)(ctx, props);
|
15089
|
-
const { dialog, errorMessage: errorMessageStyle } = datePickerCalendarStyles();
|
15090
|
-
return /* @__PURE__ */ import_react97.default.createElement(Popover, { offset: 0 }, /* @__PURE__ */ import_react97.default.createElement(Dialog, { className: dialog() }, /* @__PURE__ */ import_react97.default.createElement(Spacing, { gap: "3" }, /* @__PURE__ */ import_react97.default.createElement(RangeCalendar,
|
15132
|
+
const { variant, granularity, errorMessage, presets = [] } = (0, import_utils26.mergeProps)(ctx, props);
|
15133
|
+
const { dialog, calendar, errorMessage: errorMessageStyle } = datePickerCalendarStyles();
|
15134
|
+
return /* @__PURE__ */ import_react97.default.createElement(Popover, { offset: 0 }, /* @__PURE__ */ import_react97.default.createElement(Dialog, { className: dialog() }, presets.length > 0 && /* @__PURE__ */ import_react97.default.createElement(Presets, null, presets.map((props2) => /* @__PURE__ */ import_react97.default.createElement(RangePreset, { key: `${props2.value.start.toString()}-${props2.value.end.toString()}`, ...props2 }))), /* @__PURE__ */ import_react97.default.createElement(Spacing, { gap: "3", className: tw("p-5") }, /* @__PURE__ */ import_react97.default.createElement(RangeCalendar, { className: calendar() }), variant === "datetime" && /* @__PURE__ */ import_react97.default.createElement(Box.Flex, { gap: "6" }, /* @__PURE__ */ import_react97.default.createElement("div", { className: tw("flex-1") }, /* @__PURE__ */ import_react97.default.createElement(RangeCalendarTimeField, { granularity, part: "start" })), /* @__PURE__ */ import_react97.default.createElement("div", { className: tw("flex-1") }, /* @__PURE__ */ import_react97.default.createElement(RangeCalendarTimeField, { granularity, part: "end" }))), errorMessage && /* @__PURE__ */ import_react97.default.createElement(import_react_aria_components13.Text, { slot: "errorMessage", className: errorMessageStyle() }, errorMessage))));
|
15091
15135
|
};
|
15092
15136
|
DateRangePickerCalendar.displayName = "DateRangePicker.Calendar";
|
15093
15137
|
var DateRangePickerField = ({ clearSelectionEnabled = true, disabled = false }) => {
|
@@ -15101,11 +15145,18 @@ var createDateRangePickerBase = (variant) => {
|
|
15101
15145
|
shouldCloseOnSelect,
|
15102
15146
|
errorMessage,
|
15103
15147
|
clearSelectionEnabled = true,
|
15148
|
+
presets,
|
15104
15149
|
children,
|
15105
15150
|
...props
|
15106
15151
|
}) => {
|
15107
15152
|
const content = children ?? /* @__PURE__ */ import_react97.default.createElement(import_react97.default.Fragment, null, /* @__PURE__ */ import_react97.default.createElement(DateRangePickerField, { clearSelectionEnabled, disabled }), /* @__PURE__ */ import_react97.default.createElement(DateRangePickerCalendar, { variant, granularity: props.granularity, errorMessage }));
|
15108
|
-
return /* @__PURE__ */ import_react97.default.createElement(
|
15153
|
+
return /* @__PURE__ */ import_react97.default.createElement(
|
15154
|
+
DateRangePickerCalendarPropsContext.Provider,
|
15155
|
+
{
|
15156
|
+
value: { variant, granularity: props.granularity, errorMessage, presets }
|
15157
|
+
},
|
15158
|
+
/* @__PURE__ */ import_react97.default.createElement(DateRangePicker, { ...props, variant, isDisabled: disabled, isInvalid: valid === false }, content)
|
15159
|
+
);
|
15109
15160
|
};
|
15110
15161
|
dateRangePicker.Calendar = DateRangePickerCalendar;
|
15111
15162
|
dateRangePicker.Field = DateRangePickerField;
|
@@ -15176,7 +15227,8 @@ var modalStyles = (0, import_tailwind_variants13.tv)({
|
|
15176
15227
|
screen: {
|
15177
15228
|
overlay: "py-0",
|
15178
15229
|
dialog: "w-dvw h-dvh mx-0 rounded-none",
|
15179
|
-
header: "border-b-1 border-muted
|
15230
|
+
header: "border-b-1 border-muted",
|
15231
|
+
body: "pt-6"
|
15180
15232
|
}
|
15181
15233
|
},
|
15182
15234
|
noFooter: {
|
@@ -15279,8 +15331,8 @@ Modal.TitleContainer = ({ children, className, ...rest }) => {
|
|
15279
15331
|
const { titleContainer } = modalStyles();
|
15280
15332
|
return /* @__PURE__ */ import_react98.default.createElement("div", { ...rest, className: titleContainer({ className }) }, children);
|
15281
15333
|
};
|
15282
|
-
Modal.Body = ({ children, className, noFooter = false, maxHeight, style, ...rest }) => {
|
15283
|
-
const { body } = modalStyles();
|
15334
|
+
Modal.Body = ({ children, className, noFooter = false, maxHeight, style, size, ...rest }) => {
|
15335
|
+
const { body } = modalStyles({ size });
|
15284
15336
|
return /* @__PURE__ */ import_react98.default.createElement("div", { ...rest, className: body({ noFooter, className }), style: { maxHeight, ...style } }, children);
|
15285
15337
|
};
|
15286
15338
|
Modal.Footer = ({ children, className, ...rest }) => {
|
@@ -15932,8 +15984,8 @@ var FilterTrigger = ({
|
|
15932
15984
|
onClear,
|
15933
15985
|
onClick,
|
15934
15986
|
value,
|
15935
|
-
// children,
|
15936
15987
|
error: error2 = false,
|
15988
|
+
clearSelectionEnabled = true,
|
15937
15989
|
...props
|
15938
15990
|
}) => {
|
15939
15991
|
const ariaDatePickerState = import_react106.default.useContext(import_react_aria_components18.DatePickerStateContext);
|
@@ -15948,7 +16000,7 @@ var FilterTrigger = ({
|
|
15948
16000
|
}
|
15949
16001
|
};
|
15950
16002
|
const hasValue = !!value || isUsedInsideDatePicker || isUsedInsideDateRangePicker;
|
15951
|
-
const showClearButton = !!onClear && !!value || isUsedInsideDatePicker || isUsedInsideDateRangePicker;
|
16003
|
+
const showClearButton = clearSelectionEnabled && (!!onClear && !!value || isUsedInsideDatePicker || isUsedInsideDateRangePicker);
|
15952
16004
|
return /* @__PURE__ */ import_react106.default.createElement(
|
15953
16005
|
import_react_aria_components18.Group,
|
15954
16006
|
{
|
@@ -15971,7 +16023,11 @@ var FilterTrigger = ({
|
|
15971
16023
|
/* @__PURE__ */ import_react106.default.createElement("div", { className: tw("flex items-center gap-3 divide-x divide-grey-20") }, /* @__PURE__ */ import_react106.default.createElement("div", { className: tw("flex items-center gap-3") }, /* @__PURE__ */ import_react106.default.createElement("div", { className: tw("flex items-center gap-2") }, /* @__PURE__ */ import_react106.default.createElement(InlineIcon, { icon }), /* @__PURE__ */ import_react106.default.createElement(Typography2.Small, null, labelText)), badge && /* @__PURE__ */ import_react106.default.createElement(Typography2, { color: "primary-active", className: tw("flex items-center") }, /* @__PURE__ */ import_react106.default.createElement(Badge, { dense: true, value: badge }))), hasValue && /* @__PURE__ */ import_react106.default.createElement("div", { className: "pl-3" }, /* @__PURE__ */ import_react106.default.createElement(
|
15972
16024
|
Typography2.Small,
|
15973
16025
|
{
|
15974
|
-
className: tw("truncate
|
16026
|
+
className: tw("truncate", {
|
16027
|
+
"max-w-[320px]": isUsedInsideDateRangePicker,
|
16028
|
+
"max-w-[233px]": !isUsedInsideDateRangePicker
|
16029
|
+
// Set to 233px to keep the total width of the filter pill within approximately 360px.
|
16030
|
+
}),
|
15975
16031
|
color: error2 ? "danger-intense" : "primary-active"
|
15976
16032
|
},
|
15977
16033
|
value,
|
@@ -16115,6 +16171,7 @@ var Modal2 = ({
|
|
16115
16171
|
}
|
16116
16172
|
const styles = modalStyles({ kind: "dialog", size });
|
16117
16173
|
const hasTabs = isComponentType(children, ModalTabs);
|
16174
|
+
const hasActions = secondaryActions && !(0, import_lodash_es38.isEmpty)(secondaryActions) || primaryAction;
|
16118
16175
|
return /* @__PURE__ */ import_react110.default.createElement(
|
16119
16176
|
import_react_aria_components19.ModalOverlay,
|
16120
16177
|
{
|
@@ -16133,7 +16190,7 @@ var Modal2 = ({
|
|
16133
16190
|
className: tw({ "pb-3": isComponentType(children, ModalTabs) })
|
16134
16191
|
},
|
16135
16192
|
/* @__PURE__ */ import_react110.default.createElement(Modal.TitleContainer, null, /* @__PURE__ */ import_react110.default.createElement(ModalTitle, { kind: "dialog" }, title), subtitle && /* @__PURE__ */ import_react110.default.createElement(Modal.Subtitle, null, subtitle))
|
16136
|
-
), hasTabs ? import_react110.default.cloneElement(children, { className: tw("[&>div:first-child]:px-5 grow") }) : /* @__PURE__ */ import_react110.default.createElement(Modal.Body, { tabIndex: 0, noFooter: !
|
16193
|
+
), hasTabs ? import_react110.default.cloneElement(children, { className: tw("[&>div:first-child]:px-5 grow") }) : /* @__PURE__ */ import_react110.default.createElement(Modal.Body, { tabIndex: 0, noFooter: !hasActions, size }, children), hasActions && /* @__PURE__ */ import_react110.default.createElement(Modal.Footer, null, /* @__PURE__ */ import_react110.default.createElement(Modal.Actions, null, secondaryActions && (0, import_lodash_es38.castArray)(secondaryActions).filter(Boolean).map(({ text, ...action }) => /* @__PURE__ */ import_react110.default.createElement(Button2.Secondary, { key: text, ...action }, text)), primaryAction && /* @__PURE__ */ import_react110.default.createElement(Button2.Primary, { key: primaryAction.text, ...(0, import_lodash_es38.omit)(primaryAction, "text") }, primaryAction.text))))))
|
16137
16194
|
);
|
16138
16195
|
};
|
16139
16196
|
var ModalTabs = createTabsComponent(
|