@dreamcommerce/aurora 3.1.36 → 3.1.37
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/build/cjs/packages/aurora/src/assets/icons/arrow_left_s_line_icon.js +10 -0
- package/build/cjs/packages/aurora/src/assets/icons/arrow_left_s_line_icon.js.map +1 -0
- package/build/cjs/packages/aurora/src/assets/icons/calendar_event_fill.js +10 -0
- package/build/cjs/packages/aurora/src/assets/icons/calendar_event_fill.js.map +1 -0
- package/build/cjs/packages/aurora/src/assets/icons/time_line_icon.js +10 -0
- package/build/cjs/packages/aurora/src/assets/icons/time_line_icon.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/calendar/calendar.js +28 -0
- package/build/cjs/packages/aurora/src/components/calendar/calendar.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/components/custom_months_dropdown.js +60 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/components/custom_months_dropdown.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/components/custom_next_month_button.js +26 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/components/custom_next_month_button.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/components/custom_prev_month_button.js +26 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/components/custom_prev_month_button.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/components/custom_years_dropdown.js +59 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/components/custom_years_dropdown.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/styled_day_picker.js +67 -0
- package/build/cjs/packages/aurora/src/components/calendar/styled_day_picker/styled_day_picker.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/controls/date_and_time_picker_control/date_time_picker_control.js +46 -0
- package/build/cjs/packages/aurora/src/components/controls/date_and_time_picker_control/date_time_picker_control.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/controls/date_picker_control/date_picker_control.js +46 -0
- package/build/cjs/packages/aurora/src/components/controls/date_picker_control/date_picker_control.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/controls/time_picker_control/time_picker_control.js +46 -0
- package/build/cjs/packages/aurora/src/components/controls/time_picker_control/time_picker_control.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/date_and_time_picker/date_time_picker.js +112 -0
- package/build/cjs/packages/aurora/src/components/date_and_time_picker/date_time_picker.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/date_and_time_picker/date_time_picker_utils.js +78 -0
- package/build/cjs/packages/aurora/src/components/date_and_time_picker/date_time_picker_utils.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/date_picker/components/date_picker_content.js +30 -0
- package/build/cjs/packages/aurora/src/components/date_picker/components/date_picker_content.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/date_picker/components/date_picker_input.js +37 -0
- package/build/cjs/packages/aurora/src/components/date_picker/components/date_picker_input.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/date_picker/date_picker.js +68 -0
- package/build/cjs/packages/aurora/src/components/date_picker/date_picker.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/date_picker/date_picker_utils.js +35 -0
- package/build/cjs/packages/aurora/src/components/date_picker/date_picker_utils.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/select/components/select_item.js +1 -1
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_content.js +35 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_content.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_footer.js +37 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_footer.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_input.js +37 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_input.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_scroll_column.js +69 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_scroll_column.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_time_selector.js +38 -0
- package/build/cjs/packages/aurora/src/components/time_picker/components/time_picker_time_selector.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/time_picker/time_picker.js +134 -0
- package/build/cjs/packages/aurora/src/components/time_picker/time_picker.js.map +1 -0
- package/build/cjs/packages/aurora/src/components/time_picker/time_picker_utils.js +58 -0
- package/build/cjs/packages/aurora/src/components/time_picker/time_picker_utils.js.map +1 -0
- package/build/cjs/packages/aurora/src/index.js +14 -0
- package/build/cjs/packages/aurora/src/index.js.map +1 -1
- package/build/esm/packages/aurora/src/assets/icons/arrow_left_s_line_icon.js +5 -2
- package/build/esm/packages/aurora/src/assets/icons/arrow_left_s_line_icon.js.map +1 -1
- package/build/esm/packages/aurora/src/assets/icons/calendar_event_fill.js +5 -2
- package/build/esm/packages/aurora/src/assets/icons/calendar_event_fill.js.map +1 -1
- package/build/esm/packages/aurora/src/assets/icons/time_line_icon.js +5 -2
- package/build/esm/packages/aurora/src/assets/icons/time_line_icon.js.map +1 -1
- package/build/esm/packages/aurora/src/components/calendar/calendar.js +17 -7
- package/build/esm/packages/aurora/src/components/calendar/calendar.js.map +1 -1
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/components/custom_months_dropdown.js +49 -25
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/components/custom_months_dropdown.js.map +1 -1
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/components/custom_next_month_button.js +16 -8
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/components/custom_next_month_button.js.map +1 -1
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/components/custom_prev_month_button.js +16 -8
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/components/custom_prev_month_button.js.map +1 -1
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/components/custom_years_dropdown.js +48 -22
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/components/custom_years_dropdown.js.map +1 -1
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/styled_day_picker.js +57 -43
- package/build/esm/packages/aurora/src/components/calendar/styled_day_picker/styled_day_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/controls/date_and_time_picker_control/date_time_picker_control.d.ts +3 -0
- package/build/esm/packages/aurora/src/components/controls/date_and_time_picker_control/date_time_picker_control.js +38 -0
- package/build/esm/packages/aurora/src/components/controls/date_and_time_picker_control/date_time_picker_control.js.map +1 -0
- package/build/esm/packages/aurora/src/components/controls/date_and_time_picker_control/date_time_picker_control_types.d.ts +9 -0
- package/build/esm/packages/aurora/src/components/controls/date_and_time_picker_control/date_time_picker_control_types.js +3 -0
- package/build/esm/packages/aurora/src/components/controls/date_and_time_picker_control/date_time_picker_control_types.js.map +1 -0
- package/build/esm/packages/aurora/src/components/controls/date_picker_control/date_picker_control.js +38 -13
- package/build/esm/packages/aurora/src/components/controls/date_picker_control/date_picker_control.js.map +1 -1
- package/build/esm/packages/aurora/src/components/controls/time_picker_control/time_picker_control.js +38 -13
- package/build/esm/packages/aurora/src/components/controls/time_picker_control/time_picker_control.js.map +1 -1
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker.d.ts +3 -0
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker.js +104 -0
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker.js.map +1 -0
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker_types.d.ts +7 -0
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker_types.js +2 -0
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker_types.js.map +1 -0
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker_utils.d.ts +7 -0
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker_utils.js +74 -0
- package/build/esm/packages/aurora/src/components/date_and_time_picker/date_time_picker_utils.js.map +1 -0
- package/build/esm/packages/aurora/src/components/date_picker/components/date_picker_content.js +21 -13
- package/build/esm/packages/aurora/src/components/date_picker/components/date_picker_content.js.map +1 -1
- package/build/esm/packages/aurora/src/components/date_picker/components/date_picker_input.js +28 -8
- package/build/esm/packages/aurora/src/components/date_picker/components/date_picker_input.js.map +1 -1
- package/build/esm/packages/aurora/src/components/date_picker/date_picker.js +59 -28
- package/build/esm/packages/aurora/src/components/date_picker/date_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/date_picker/date_picker_utils.js +30 -24
- package/build/esm/packages/aurora/src/components/date_picker/date_picker_utils.js.map +1 -1
- package/build/esm/packages/aurora/src/components/select/components/select_item.js +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_content.d.ts +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_content.js +26 -10
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_content.js.map +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_footer.js +28 -9
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_footer.js.map +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_input.js +28 -8
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_input.js.map +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_scroll_column.js +60 -36
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_scroll_column.js.map +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_time_selector.d.ts +1 -2
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_time_selector.js +29 -11
- package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_time_selector.js.map +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/time_picker.d.ts +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/time_picker.js +124 -94
- package/build/esm/packages/aurora/src/components/time_picker/time_picker.js.map +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/time_picker_types.d.ts +0 -2
- package/build/esm/packages/aurora/src/components/time_picker/time_picker_utils.d.ts +1 -1
- package/build/esm/packages/aurora/src/components/time_picker/time_picker_utils.js +54 -46
- package/build/esm/packages/aurora/src/components/time_picker/time_picker_utils.js.map +1 -1
- package/build/esm/packages/aurora/src/index.d.ts +9 -0
- package/build/esm/packages/aurora/src/index.js +7 -0
- package/build/esm/packages/aurora/src/index.js.map +1 -1
- package/build/index.css +1 -1
- package/package.json +1 -1
package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_content.js
CHANGED
|
@@ -1,11 +1,27 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { PopoverContent } from '../../popover/components/popover_content';
|
|
3
|
-
import { TimePickerTimeSelector } from './time_picker_time_selector';
|
|
4
|
-
import { TimePickerFooter } from './time_picker_footer';
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { PopoverContent } from '../../popover/components/popover_content.js';
|
|
3
|
+
import { TimePickerTimeSelector } from './time_picker_time_selector.js';
|
|
4
|
+
import { TimePickerFooter } from './time_picker_footer.js';
|
|
5
|
+
|
|
6
|
+
var TimePickerContent = function TimePickerContent(_ref) {
|
|
7
|
+
var hour = _ref.hour,
|
|
8
|
+
minute = _ref.minute,
|
|
9
|
+
onHourChange = _ref.onHourChange,
|
|
10
|
+
onMinuteChange = _ref.onMinuteChange,
|
|
11
|
+
onCancel = _ref.onCancel,
|
|
12
|
+
onChoose = _ref.onChoose;
|
|
13
|
+
return /*#__PURE__*/React__default.createElement(PopoverContent, {
|
|
14
|
+
className: "aurora-bg-neutral-0 aurora-w-[264px] aurora-rounded-16 aurora-border aurora-border-strong aurora-shadow-l aurora-overflow-hidden js__aurora-timepicker-dropdown"
|
|
15
|
+
}, /*#__PURE__*/React__default.createElement(TimePickerTimeSelector, {
|
|
16
|
+
hour: hour,
|
|
17
|
+
minute: minute,
|
|
18
|
+
onHourChange: onHourChange,
|
|
19
|
+
onMinuteChange: onMinuteChange
|
|
20
|
+
}), /*#__PURE__*/React__default.createElement(TimePickerFooter, {
|
|
21
|
+
onCancel: onCancel,
|
|
22
|
+
onChoose: onChoose
|
|
23
|
+
}));
|
|
10
24
|
};
|
|
11
|
-
|
|
25
|
+
|
|
26
|
+
export { TimePickerContent };
|
|
27
|
+
//# sourceMappingURL=time_picker_content.js.map
|
package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_content.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_footer.js
CHANGED
|
@@ -1,10 +1,29 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { useTranslation } from '../../../../../../external/react-i18next/dist/es/useTranslation.js';
|
|
3
|
+
import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
|
|
4
|
+
import { Button } from '../../button/button.js';
|
|
5
|
+
|
|
6
|
+
var TimePickerFooter = function TimePickerFooter(_ref) {
|
|
7
|
+
var onCancel = _ref.onCancel,
|
|
8
|
+
onChoose = _ref.onChoose;
|
|
9
|
+
var _useTranslation = useTranslation(),
|
|
10
|
+
_useTranslation2 = _slicedToArray(_useTranslation, 1),
|
|
11
|
+
t = _useTranslation2[0];
|
|
12
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
13
|
+
className: "aurora-flex aurora-items-center aurora-gap-3 aurora-px-4 aurora-py-3 aurora-border-t aurora-border-subtle"
|
|
14
|
+
}, /*#__PURE__*/React__default.createElement(Button, {
|
|
15
|
+
className: "aurora-flex-1",
|
|
16
|
+
variant: "secondary",
|
|
17
|
+
size: "s",
|
|
18
|
+
type: "button",
|
|
19
|
+
onClick: onCancel
|
|
20
|
+
}, String(t('Cancel'))), /*#__PURE__*/React__default.createElement(Button, {
|
|
21
|
+
className: "aurora-flex-1",
|
|
22
|
+
type: "button",
|
|
23
|
+
size: "s",
|
|
24
|
+
onClick: onChoose
|
|
25
|
+
}, String(t('Choose'))));
|
|
9
26
|
};
|
|
10
|
-
|
|
27
|
+
|
|
28
|
+
export { TimePickerFooter };
|
|
29
|
+
//# sourceMappingURL=time_picker_footer.js.map
|
package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_footer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_input.js
CHANGED
|
@@ -1,9 +1,29 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Input } from '../../input/input';
|
|
3
|
-
import { TimeLineIcon } from '
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { Input } from '../../input/input.js';
|
|
3
|
+
import { TimeLineIcon } from '../../../assets/icons/time_line_icon.js';
|
|
4
|
+
|
|
5
|
+
var TimePickerInput = function TimePickerInput(_ref) {
|
|
6
|
+
var id = _ref.id,
|
|
7
|
+
value = _ref.value,
|
|
8
|
+
placeholder = _ref.placeholder,
|
|
9
|
+
disabled = _ref.disabled,
|
|
10
|
+
errors = _ref.errors;
|
|
11
|
+
return /*#__PURE__*/React__default.createElement(Input, {
|
|
12
|
+
id: id,
|
|
13
|
+
value: value,
|
|
14
|
+
errors: errors,
|
|
15
|
+
readOnly: true,
|
|
16
|
+
disabled: disabled,
|
|
17
|
+
placeholder: placeholder,
|
|
18
|
+
hasCursorPointer: true,
|
|
19
|
+
postElement: /*#__PURE__*/React__default.createElement("div", {
|
|
20
|
+
className: "aurora-flex aurora-h-full aurora-items-center aurora-cursor-pointer aurora-border-0 aurora-bg-transparent aurora-p-1 aurora-rounded-4 focus:aurora-outline-primary-hover"
|
|
21
|
+
}, /*#__PURE__*/React__default.createElement(TimeLineIcon, {
|
|
22
|
+
size: 14,
|
|
23
|
+
className: "aurora-text"
|
|
24
|
+
}))
|
|
25
|
+
});
|
|
8
26
|
};
|
|
9
|
-
|
|
27
|
+
|
|
28
|
+
export { TimePickerInput };
|
|
29
|
+
//# sourceMappingURL=time_picker_input.js.map
|
package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_input.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_scroll_column.js
CHANGED
|
@@ -1,37 +1,61 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import { cn } from '
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
1
|
+
import React__default, { useRef, useLayoutEffect } from 'react';
|
|
2
|
+
import { defineProperty as _defineProperty, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
|
|
3
|
+
import { cn } from '../../../utilities/cn.js';
|
|
4
|
+
import { Root, Viewport, Scrollbar, Thumb } from '../../../../../../external/@radix-ui/react-scroll-area/dist/index.mjs.js';
|
|
5
|
+
|
|
6
|
+
var TimePickerScrollColumn = function TimePickerScrollColumn(_ref) {
|
|
7
|
+
var options = _ref.options,
|
|
8
|
+
selectedValue = _ref.selectedValue,
|
|
9
|
+
onValueChange = _ref.onValueChange,
|
|
10
|
+
dataAttribute = _ref.dataAttribute;
|
|
11
|
+
var scrollRef = useRef(null);
|
|
12
|
+
var scrollToElement = function scrollToElement(viewport, selector) {
|
|
13
|
+
var selectedElement = viewport.querySelector(selector);
|
|
14
|
+
if (selectedElement) {
|
|
15
|
+
var elementTop = selectedElement.offsetTop;
|
|
16
|
+
var elementHeight = selectedElement.offsetHeight;
|
|
17
|
+
var viewportHeight = viewport.clientHeight;
|
|
18
|
+
var scrollTop = elementTop - viewportHeight / 2 + elementHeight / 2;
|
|
19
|
+
viewport.scrollTo({
|
|
20
|
+
top: scrollTop,
|
|
21
|
+
behavior: 'smooth'
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
useLayoutEffect(function () {
|
|
26
|
+
if (scrollRef.current && selectedValue !== null) {
|
|
27
|
+
scrollToElement(scrollRef.current, "[".concat(dataAttribute, "=\"").concat(selectedValue, "\"]"));
|
|
28
|
+
}
|
|
29
|
+
}, [selectedValue, dataAttribute]);
|
|
30
|
+
return /*#__PURE__*/React__default.createElement(Root, {
|
|
31
|
+
type: "auto",
|
|
32
|
+
className: "aurora-flex-1 aurora-h-full aurora-py-2"
|
|
33
|
+
}, /*#__PURE__*/React__default.createElement(Viewport, {
|
|
34
|
+
ref: scrollRef,
|
|
35
|
+
className: "aurora-h-full"
|
|
36
|
+
}, /*#__PURE__*/React__default.createElement("div", null, options.map(function (option) {
|
|
37
|
+
var value = parseInt(option, 10);
|
|
38
|
+
var isSelected = value === selectedValue;
|
|
39
|
+
var buttonProps = _defineProperty({}, dataAttribute, value);
|
|
40
|
+
return /*#__PURE__*/React__default.createElement("button", _objectSpread2(_objectSpread2({}, buttonProps), {}, {
|
|
41
|
+
key: option,
|
|
42
|
+
type: "button",
|
|
43
|
+
onClick: function onClick() {
|
|
44
|
+
return onValueChange(isSelected ? null : value);
|
|
45
|
+
},
|
|
46
|
+
className: "aurora-w-full aurora-group"
|
|
47
|
+
}), /*#__PURE__*/React__default.createElement("span", {
|
|
48
|
+
className: cn('aurora-inline-flex aurora-items-center aurora-justify-center aurora-rounded-4 aurora-w-8 aurora-h-8 aurora-text-s group-hover:aurora-bg-hover', {
|
|
49
|
+
'!aurora-bg-inverse aurora-text-inverse': isSelected
|
|
50
|
+
})
|
|
51
|
+
}, option));
|
|
52
|
+
}))), /*#__PURE__*/React__default.createElement(Scrollbar, {
|
|
53
|
+
orientation: "vertical",
|
|
54
|
+
className: "aurora-w-1 aurora-absolute aurora-right-0 aurora-top-0 aurora-bottom-0 aurora-opacity-0"
|
|
55
|
+
}, /*#__PURE__*/React__default.createElement(Thumb, {
|
|
56
|
+
className: "aurora-bg-active aurora-rounded-full"
|
|
57
|
+
})));
|
|
36
58
|
};
|
|
37
|
-
|
|
59
|
+
|
|
60
|
+
export { TimePickerScrollColumn };
|
|
61
|
+
//# sourceMappingURL=time_picker_scroll_column.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA,iDAAiD,0EAA8E;AAC/H;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -4,6 +4,5 @@ export interface TimePickerTimeSelectorProps {
|
|
|
4
4
|
minute: number | null;
|
|
5
5
|
onHourChange: (hour: number | null) => void;
|
|
6
6
|
onMinuteChange: (minute: number | null) => void;
|
|
7
|
-
format: '12h' | '24h';
|
|
8
7
|
}
|
|
9
|
-
export declare const TimePickerTimeSelector: ({ hour, minute, onHourChange, onMinuteChange
|
|
8
|
+
export declare const TimePickerTimeSelector: ({ hour, minute, onHourChange, onMinuteChange }: TimePickerTimeSelectorProps) => React.JSX.Element;
|
package/build/esm/packages/aurora/src/components/time_picker/components/time_picker_time_selector.js
CHANGED
|
@@ -1,12 +1,30 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { TimePickerUtils } from '../time_picker_utils';
|
|
3
|
-
import { TimePickerScrollColumn } from './time_picker_scroll_column';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
1
|
+
import React__default from 'react';
|
|
2
|
+
import { TimePickerUtils } from '../time_picker_utils.js';
|
|
3
|
+
import { TimePickerScrollColumn } from './time_picker_scroll_column.js';
|
|
4
|
+
|
|
5
|
+
var TimePickerTimeSelector = function TimePickerTimeSelector(_ref) {
|
|
6
|
+
var hour = _ref.hour,
|
|
7
|
+
minute = _ref.minute,
|
|
8
|
+
onHourChange = _ref.onHourChange,
|
|
9
|
+
onMinuteChange = _ref.onMinuteChange;
|
|
10
|
+
var hourOptions = TimePickerUtils.generateTimeOptions('hour');
|
|
11
|
+
var minuteOptions = TimePickerUtils.generateTimeOptions('minute');
|
|
12
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
13
|
+
className: "aurora-flex aurora-items-center aurora-h-[270px]"
|
|
14
|
+
}, /*#__PURE__*/React__default.createElement(TimePickerScrollColumn, {
|
|
15
|
+
options: hourOptions,
|
|
16
|
+
selectedValue: hour,
|
|
17
|
+
onValueChange: onHourChange,
|
|
18
|
+
dataAttribute: "data-hour"
|
|
19
|
+
}), /*#__PURE__*/React__default.createElement("div", {
|
|
20
|
+
className: "aurora-w-px aurora-h-[250px] aurora-bg-neutral-200"
|
|
21
|
+
}), /*#__PURE__*/React__default.createElement(TimePickerScrollColumn, {
|
|
22
|
+
options: minuteOptions,
|
|
23
|
+
selectedValue: minute,
|
|
24
|
+
onValueChange: onMinuteChange,
|
|
25
|
+
dataAttribute: "data-minute"
|
|
26
|
+
}));
|
|
11
27
|
};
|
|
12
|
-
|
|
28
|
+
|
|
29
|
+
export { TimePickerTimeSelector };
|
|
30
|
+
//# sourceMappingURL=time_picker_time_selector.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { TimePickerProps } from './time_picker_types';
|
|
3
|
-
export declare const TimePicker: ({ id, placeholder, disabled, errors, value, onChange
|
|
3
|
+
export declare const TimePicker: ({ id, placeholder, disabled, errors, value, onChange }: TimePickerProps) => React.JSX.Element;
|
|
@@ -1,96 +1,126 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import './
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
1
|
+
import React__default, { useState, useRef, useMemo } from 'react';
|
|
2
|
+
import { slicedToArray as _slicedToArray } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
|
|
3
|
+
import { cn } from '../../utilities/cn.js';
|
|
4
|
+
import { Popover } from '../popover/popover.js';
|
|
5
|
+
import { PopoverTrigger } from '../popover/components/popover_trigger.js';
|
|
6
|
+
import { TimePickerInput } from './components/time_picker_input.js';
|
|
7
|
+
import { TimePickerUtils } from './time_picker_utils.js';
|
|
8
|
+
import { TimePickerContent } from './components/time_picker_content.js';
|
|
9
|
+
|
|
10
|
+
var TimePicker = function TimePicker(_ref) {
|
|
11
|
+
var id = _ref.id,
|
|
12
|
+
_ref$placeholder = _ref.placeholder,
|
|
13
|
+
placeholder = _ref$placeholder === void 0 ? 'gg:mm' : _ref$placeholder,
|
|
14
|
+
disabled = _ref.disabled,
|
|
15
|
+
errors = _ref.errors,
|
|
16
|
+
value = _ref.value,
|
|
17
|
+
onChange = _ref.onChange;
|
|
18
|
+
var _useState = useState(false),
|
|
19
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
20
|
+
open = _useState2[0],
|
|
21
|
+
setOpen = _useState2[1];
|
|
22
|
+
var _useState3 = useState(null),
|
|
23
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
24
|
+
tempHour = _useState4[0],
|
|
25
|
+
setTempHour = _useState4[1];
|
|
26
|
+
var _useState5 = useState(null),
|
|
27
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
28
|
+
tempMinute = _useState6[0],
|
|
29
|
+
setTempMinute = _useState6[1];
|
|
30
|
+
var isCancelledRef = useRef(false);
|
|
31
|
+
var parsedTime = useMemo(function () {
|
|
32
|
+
return value ? TimePickerUtils.parseStringToTime(value) : undefined;
|
|
33
|
+
}, [value]);
|
|
34
|
+
var displayValue = useMemo(function () {
|
|
35
|
+
if (open) {
|
|
36
|
+
if (tempHour === null && tempMinute === null) {
|
|
37
|
+
return '';
|
|
38
|
+
}
|
|
39
|
+
return TimePickerUtils.formatTimeForDisplay(tempHour !== null && tempHour !== void 0 ? tempHour : 0, tempMinute !== null && tempMinute !== void 0 ? tempMinute : 0);
|
|
40
|
+
}
|
|
41
|
+
return parsedTime ? TimePickerUtils.formatTimeForDisplay(parsedTime.hour, parsedTime.minute) : '';
|
|
42
|
+
}, [open, tempHour, tempMinute, parsedTime]);
|
|
43
|
+
var initializeTempValues = function initializeTempValues() {
|
|
44
|
+
if (parsedTime) {
|
|
45
|
+
setTempHour(parsedTime.hour);
|
|
46
|
+
setTempMinute(parsedTime.minute);
|
|
47
|
+
} else {
|
|
48
|
+
setTempHour(null);
|
|
49
|
+
setTempMinute(null);
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
var saveValue = function saveValue() {
|
|
53
|
+
if (tempHour === null && tempMinute === null) {
|
|
54
|
+
onChange === null || onChange === void 0 ? void 0 : onChange('');
|
|
55
|
+
} else {
|
|
56
|
+
var formattedValue = TimePickerUtils.formatTimeToString(tempHour !== null && tempHour !== void 0 ? tempHour : 0, tempMinute !== null && tempMinute !== void 0 ? tempMinute : 0);
|
|
57
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(formattedValue);
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
var handleHourChange = function handleHourChange(hour) {
|
|
61
|
+
if (hour === null) {
|
|
62
|
+
setTempHour(null);
|
|
63
|
+
setTempMinute(null);
|
|
64
|
+
} else {
|
|
65
|
+
setTempHour(hour);
|
|
66
|
+
if (tempMinute === null) {
|
|
67
|
+
setTempMinute(0);
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
};
|
|
71
|
+
var handleMinuteChange = function handleMinuteChange(minute) {
|
|
72
|
+
if (minute === null) {
|
|
73
|
+
setTempHour(null);
|
|
74
|
+
setTempMinute(null);
|
|
75
|
+
} else {
|
|
76
|
+
setTempMinute(minute);
|
|
77
|
+
if (tempHour === null) {
|
|
78
|
+
setTempHour(0);
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
};
|
|
82
|
+
var handleOpenChange = function handleOpenChange(newOpen) {
|
|
83
|
+
if (newOpen) {
|
|
84
|
+
isCancelledRef.current = false;
|
|
85
|
+
initializeTempValues();
|
|
86
|
+
setOpen(true);
|
|
87
|
+
} else {
|
|
88
|
+
if (!isCancelledRef.current) {
|
|
88
89
|
saveValue();
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
90
|
+
}
|
|
91
|
+
setOpen(false);
|
|
92
|
+
}
|
|
93
|
+
};
|
|
94
|
+
var handleCancel = function handleCancel() {
|
|
95
|
+
isCancelledRef.current = true;
|
|
96
|
+
initializeTempValues();
|
|
97
|
+
setOpen(false);
|
|
98
|
+
};
|
|
99
|
+
var handleChoose = function handleChoose() {
|
|
100
|
+
saveValue();
|
|
101
|
+
setOpen(false);
|
|
102
|
+
};
|
|
103
|
+
return /*#__PURE__*/React__default.createElement(Popover, {
|
|
104
|
+
open: open,
|
|
105
|
+
onOpenChange: handleOpenChange
|
|
106
|
+
}, /*#__PURE__*/React__default.createElement(PopoverTrigger, {
|
|
107
|
+
className: cn('aurora-w-full', disabled && 'aurora-cursor-not-allowed'),
|
|
108
|
+
disabled: disabled
|
|
109
|
+
}, /*#__PURE__*/React__default.createElement(TimePickerInput, {
|
|
110
|
+
id: id,
|
|
111
|
+
value: displayValue,
|
|
112
|
+
placeholder: placeholder,
|
|
113
|
+
disabled: disabled,
|
|
114
|
+
errors: errors
|
|
115
|
+
})), /*#__PURE__*/React__default.createElement(TimePickerContent, {
|
|
116
|
+
hour: tempHour,
|
|
117
|
+
minute: tempMinute,
|
|
118
|
+
onHourChange: handleHourChange,
|
|
119
|
+
onMinuteChange: handleMinuteChange,
|
|
120
|
+
onCancel: handleCancel,
|
|
121
|
+
onChoose: handleChoose
|
|
122
|
+
}));
|
|
95
123
|
};
|
|
96
|
-
|
|
124
|
+
|
|
125
|
+
export { TimePicker };
|
|
126
|
+
//# sourceMappingURL=time_picker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -5,7 +5,6 @@ export interface TimePickerProps {
|
|
|
5
5
|
errors?: string | string[];
|
|
6
6
|
value?: string;
|
|
7
7
|
onChange?: (value: string) => void;
|
|
8
|
-
format?: '12h' | '24h';
|
|
9
8
|
}
|
|
10
9
|
export interface TimePickerContentProps {
|
|
11
10
|
hour: number | null;
|
|
@@ -14,5 +13,4 @@ export interface TimePickerContentProps {
|
|
|
14
13
|
onMinuteChange: (minute: number | null) => void;
|
|
15
14
|
onCancel: () => void;
|
|
16
15
|
onChoose: () => void;
|
|
17
|
-
format: '12h' | '24h';
|
|
18
16
|
}
|
|
@@ -6,5 +6,5 @@ export declare class TimePickerUtils {
|
|
|
6
6
|
static formatTimeToString: (hour: number, minute: number) => string;
|
|
7
7
|
static formatTimeForDisplay: (hour: number, minute: number) => string;
|
|
8
8
|
static formatTimeStringForDisplay: (value: string | undefined) => string;
|
|
9
|
-
static generateTimeOptions: (type: 'hour' | 'minute'
|
|
9
|
+
static generateTimeOptions: (type: 'hour' | 'minute') => string[];
|
|
10
10
|
}
|