@semcore/time-picker 16.0.0-prerelease.4 → 16.0.0-prerelease.7
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/lib/esm/PickerFormat.mjs +56 -46
- package/lib/esm/PickerInput.mjs +220 -146
- package/lib/esm/TimePicker.mjs +220 -152
- package/lib/esm/index.mjs +7 -7
- package/lib/esm/translations/__intergalactic-dynamic-locales.mjs +30 -30
- package/lib/esm/translations/de.json.mjs +20 -14
- package/lib/esm/translations/en.json.mjs +20 -14
- package/lib/esm/translations/es.json.mjs +20 -14
- package/lib/esm/translations/fr.json.mjs +20 -14
- package/lib/esm/translations/it.json.mjs +20 -14
- package/lib/esm/translations/ja.json.mjs +20 -14
- package/lib/esm/translations/ko.json.mjs +20 -14
- package/lib/esm/translations/nl.json.mjs +20 -14
- package/lib/esm/translations/pl.json.mjs +20 -14
- package/lib/esm/translations/pt.json.mjs +20 -14
- package/lib/esm/translations/sv.json.mjs +20 -14
- package/lib/esm/translations/tr.json.mjs +20 -14
- package/lib/esm/translations/vi.json.mjs +20 -14
- package/lib/esm/translations/zh.json.mjs +20 -14
- package/package.json +6 -6
package/lib/esm/PickerFormat.mjs
CHANGED
|
@@ -1,60 +1,70 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import { sstyled
|
|
9
|
-
import
|
|
10
|
-
import { ScreenReaderOnly
|
|
11
|
-
import
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
var
|
|
15
|
-
function
|
|
16
|
-
var
|
|
17
|
-
|
|
18
|
-
for (var
|
|
19
|
-
|
|
20
|
-
|
|
1
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
|
+
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
3
|
+
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
4
|
+
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
|
|
5
|
+
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
6
|
+
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
7
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
8
|
+
import { sstyled, assignProps, Component } from "@semcore/core";
|
|
9
|
+
import React from "react";
|
|
10
|
+
import { ScreenReaderOnly, Box } from "@semcore/flex-box";
|
|
11
|
+
import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
|
|
12
|
+
var TimePickerFormat = /* @__PURE__ */ function(_Component) {
|
|
13
|
+
_inherits(TimePickerFormat2, _Component);
|
|
14
|
+
var _super = _createSuper(TimePickerFormat2);
|
|
15
|
+
function TimePickerFormat2() {
|
|
16
|
+
var _this;
|
|
17
|
+
_classCallCheck(this, TimePickerFormat2);
|
|
18
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
19
|
+
args[_key] = arguments[_key];
|
|
20
|
+
}
|
|
21
|
+
_this = _super.call.apply(_super, [this].concat(args));
|
|
22
|
+
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
21
23
|
changedFormatNotice: ""
|
|
22
|
-
})
|
|
24
|
+
});
|
|
25
|
+
_defineProperty(_assertThisInitialized(_this), "handleClick", function() {
|
|
23
26
|
setTimeout(function() {
|
|
24
|
-
var
|
|
25
|
-
|
|
26
|
-
changedFormatNotice:
|
|
27
|
-
meridiem
|
|
27
|
+
var _this$asProps = _this.asProps, meridiem = _this$asProps.meridiem, getI18nText = _this$asProps.getI18nText;
|
|
28
|
+
_this.setState({
|
|
29
|
+
changedFormatNotice: getI18nText("changedFormatNotice", {
|
|
30
|
+
meridiem
|
|
28
31
|
})
|
|
29
32
|
});
|
|
30
|
-
}, 0)
|
|
31
|
-
|
|
33
|
+
}, 0);
|
|
34
|
+
setTimeout(function() {
|
|
35
|
+
_this.setState({
|
|
32
36
|
changedFormatNotice: ""
|
|
33
37
|
});
|
|
34
38
|
}, 2e3);
|
|
35
|
-
})
|
|
39
|
+
});
|
|
40
|
+
return _this;
|
|
36
41
|
}
|
|
37
|
-
|
|
42
|
+
_createClass(TimePickerFormat2, [{
|
|
38
43
|
key: "render",
|
|
39
|
-
value: function() {
|
|
40
|
-
var
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
"
|
|
47
|
-
|
|
48
|
-
|
|
44
|
+
value: function render() {
|
|
45
|
+
var _ref = this.asProps, _ref2;
|
|
46
|
+
var SPickerFormat = Box;
|
|
47
|
+
var _this$asProps2 = this.asProps, Children = _this$asProps2.Children, meridiem = _this$asProps2.meridiem, styles = _this$asProps2.styles, getI18nText = _this$asProps2.getI18nText, uid = _this$asProps2.uid;
|
|
48
|
+
var changedFormatNotice = this.state.changedFormatNotice;
|
|
49
|
+
var SPickerFormatText = "span";
|
|
50
|
+
return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SPickerFormat, _ref2.cn("SPickerFormat", _objectSpread({}, assignProps({
|
|
51
|
+
"type": "button",
|
|
52
|
+
"tag": "button",
|
|
53
|
+
"tabIndex": 0,
|
|
54
|
+
"onClick": this.handleClick,
|
|
55
|
+
"aria-describedby": "".concat(uid, "_describe")
|
|
56
|
+
}, _ref))), Children.origin ? /* @__PURE__ */ React.createElement(Children, _ref2.cn("Children", {})) : /* @__PURE__ */ React.createElement(SPickerFormatText, _ref2.cn("SPickerFormatText", {}), meridiem)), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref2.cn("ScreenReaderOnly", {
|
|
57
|
+
"role": "status",
|
|
49
58
|
"aria-live": "polite"
|
|
50
|
-
}),
|
|
59
|
+
}), changedFormatNotice), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref2.cn("ScreenReaderOnly", {
|
|
51
60
|
"aria-hidden": "true",
|
|
52
|
-
id: "".concat(
|
|
53
|
-
}),
|
|
61
|
+
"id": "".concat(uid, "_describe")
|
|
62
|
+
}), getI18nText("formatToggler")));
|
|
54
63
|
}
|
|
55
|
-
}])
|
|
56
|
-
|
|
57
|
-
|
|
64
|
+
}]);
|
|
65
|
+
return TimePickerFormat2;
|
|
66
|
+
}(Component);
|
|
67
|
+
_defineProperty(TimePickerFormat, "enhance", [uniqueIDEnhancement()]);
|
|
58
68
|
export {
|
|
59
|
-
|
|
69
|
+
TimePickerFormat as default
|
|
60
70
|
};
|
package/lib/esm/PickerInput.mjs
CHANGED
|
@@ -1,196 +1,270 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import { sstyled
|
|
11
|
-
import
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import { withLeadingZero
|
|
15
|
-
import { callAllEventHandlers
|
|
16
|
-
var
|
|
1
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
|
+
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
5
|
+
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
6
|
+
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
|
|
7
|
+
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
8
|
+
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
9
|
+
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
10
|
+
import { sstyled, assignProps, Component } from "@semcore/core";
|
|
11
|
+
import React from "react";
|
|
12
|
+
import Input from "@semcore/input";
|
|
13
|
+
import Select from "@semcore/select";
|
|
14
|
+
import { withLeadingZero, intOrDefault } from "./TimePicker.mjs";
|
|
15
|
+
import { callAllEventHandlers } from "@semcore/core/lib/utils/assignProps";
|
|
16
|
+
var _excluded = ["styles", "step", "onSelect", "time", "size", "disabled", "onVisibleChange"];
|
|
17
|
+
var MAP_FIELD_TO_TIME = {
|
|
17
18
|
hours: 0,
|
|
18
19
|
minutes: 1
|
|
19
|
-
}
|
|
20
|
+
};
|
|
21
|
+
var MAP_SIZE_SELECT = {
|
|
20
22
|
m: "m",
|
|
21
23
|
l: "l"
|
|
22
24
|
};
|
|
23
|
-
function
|
|
24
|
-
var
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
25
|
+
function getOptions(min, max) {
|
|
26
|
+
var step = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 1;
|
|
27
|
+
var length = Number(((max + 1 - min) / step).toFixed(0));
|
|
28
|
+
var options = Array(length).fill("");
|
|
29
|
+
var numValue = min;
|
|
30
|
+
return options.map(function(i, index) {
|
|
31
|
+
numValue = index === 0 ? numValue : numValue + step;
|
|
32
|
+
var value = withLeadingZero(String(numValue));
|
|
33
|
+
return /* @__PURE__ */ React.createElement(Select.Option, {
|
|
34
|
+
value,
|
|
35
|
+
key: value
|
|
36
|
+
}, value);
|
|
32
37
|
});
|
|
33
38
|
}
|
|
34
|
-
var
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
39
|
+
var defaultPopperOffset = [-8, 4];
|
|
40
|
+
var ItemPicker = /* @__PURE__ */ function(_Component) {
|
|
41
|
+
_inherits(ItemPicker2, _Component);
|
|
42
|
+
var _super = _createSuper(ItemPicker2);
|
|
43
|
+
function ItemPicker2() {
|
|
44
|
+
var _this;
|
|
45
|
+
_classCallCheck(this, ItemPicker2);
|
|
46
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
47
|
+
args[_key] = arguments[_key];
|
|
48
|
+
}
|
|
49
|
+
_this = _super.call.apply(_super, [this].concat(args));
|
|
50
|
+
_defineProperty(_assertThisInitialized(_this), "inputRef", /* @__PURE__ */ React.createRef());
|
|
51
|
+
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
43
52
|
dirtyValue: void 0,
|
|
44
|
-
visible:
|
|
45
|
-
})
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
return
|
|
61
|
-
|
|
53
|
+
visible: false
|
|
54
|
+
});
|
|
55
|
+
_defineProperty(_assertThisInitialized(_this), "parseValueWithMinMax", function(value) {
|
|
56
|
+
var _this$minMax = _this.minMax(), _this$minMax2 = _slicedToArray(_this$minMax, 2), min = _this$minMax2[0], max = _this$minMax2[1];
|
|
57
|
+
return String(Math.max(min, Math.min(max, value)));
|
|
58
|
+
});
|
|
59
|
+
_defineProperty(_assertThisInitialized(_this), "handleChange", function(value, event) {
|
|
60
|
+
event.stopPropagation();
|
|
61
|
+
var numberValue = intOrDefault(Number(value), NaN);
|
|
62
|
+
if (!Number.isNaN(numberValue)) {
|
|
63
|
+
_this.setState({
|
|
64
|
+
dirtyValue: value.slice(-2)
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
});
|
|
68
|
+
_defineProperty(_assertThisInitialized(_this), "handleBlur", function(event) {
|
|
69
|
+
return _this.submitChanges(event);
|
|
70
|
+
});
|
|
71
|
+
_defineProperty(_assertThisInitialized(_this), "handleKeyDown", function() {
|
|
72
|
+
});
|
|
73
|
+
_defineProperty(_assertThisInitialized(_this), "handleSelect", function(value, event) {
|
|
74
|
+
_this.dispatchOnChange(value, event);
|
|
75
|
+
});
|
|
76
|
+
_defineProperty(_assertThisInitialized(_this), "handleVisibleChange", function(visible) {
|
|
77
|
+
return _this.setState({
|
|
78
|
+
visible
|
|
62
79
|
});
|
|
63
|
-
})
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
if (
|
|
67
|
-
|
|
80
|
+
});
|
|
81
|
+
_defineProperty(_assertThisInitialized(_this), "getAriaLabel", function() {
|
|
82
|
+
var getI18nText = _this.asProps._getI18nText;
|
|
83
|
+
if (_this.field === "hours") return getI18nText("hours");
|
|
84
|
+
if (_this.field === "minutes") return getI18nText("minutes");
|
|
85
|
+
return void 0;
|
|
86
|
+
});
|
|
87
|
+
return _this;
|
|
68
88
|
}
|
|
69
|
-
|
|
89
|
+
_createClass(ItemPicker2, [{
|
|
70
90
|
key: "minMax",
|
|
71
|
-
value: function() {
|
|
91
|
+
value: function minMax() {
|
|
72
92
|
return [];
|
|
73
93
|
}
|
|
74
94
|
}, {
|
|
75
95
|
key: "dispatchOnChange",
|
|
76
|
-
value: function(
|
|
96
|
+
value: function dispatchOnChange(value, event) {
|
|
77
97
|
this.setState({
|
|
78
98
|
dirtyValue: void 0
|
|
79
|
-
})
|
|
99
|
+
});
|
|
100
|
+
this.asProps.$onValueChange(value, this.field, event);
|
|
80
101
|
}
|
|
81
102
|
}, {
|
|
82
103
|
key: "submitChanges",
|
|
83
|
-
value: function(
|
|
84
|
-
var
|
|
85
|
-
|
|
104
|
+
value: function submitChanges(event) {
|
|
105
|
+
var dirtyValue = this.state.dirtyValue;
|
|
106
|
+
if (dirtyValue !== void 0) {
|
|
107
|
+
if (dirtyValue) dirtyValue = this.parseValueWithMinMax(dirtyValue);
|
|
108
|
+
this.dispatchOnChange(dirtyValue, event);
|
|
109
|
+
}
|
|
86
110
|
}
|
|
87
111
|
}, {
|
|
88
112
|
key: "render",
|
|
89
|
-
value: function() {
|
|
90
|
-
var
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
113
|
+
value: function render() {
|
|
114
|
+
var _ref = this.asProps, _ref2;
|
|
115
|
+
var SPickerInput = Select.Trigger;
|
|
116
|
+
var _this$asProps = this.asProps, styles = _this$asProps.styles, step = _this$asProps.step, onSelect = _this$asProps.onSelect, time = _this$asProps.time, size = _this$asProps.size, disabled = _this$asProps.disabled, onVisibleChange = _this$asProps.onVisibleChange, other = _objectWithoutProperties(_this$asProps, _excluded);
|
|
117
|
+
var _this$state = this.state, dirtyValue = _this$state.dirtyValue, visible = _this$state.visible;
|
|
118
|
+
var timeValue = time[MAP_FIELD_TO_TIME[this.field]];
|
|
119
|
+
var value = dirtyValue === void 0 ? timeValue : dirtyValue;
|
|
120
|
+
var _this$minMax3 = this.minMax(), _this$minMax4 = _slicedToArray(_this$minMax3, 2), min = _this$minMax4[0], max = _this$minMax4[1];
|
|
121
|
+
return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(Select, _ref2.cn("Select", _objectSpread(_objectSpread({}, other), {}, {
|
|
122
|
+
"interaction": "focus",
|
|
123
|
+
"size": size ? MAP_SIZE_SELECT[size] : false,
|
|
124
|
+
"onChange": callAllEventHandlers(onSelect, this.handleSelect),
|
|
125
|
+
"onVisibleChange": callAllEventHandlers(onVisibleChange, this.handleVisibleChange),
|
|
126
|
+
"visible": visible,
|
|
127
|
+
"value": timeValue
|
|
128
|
+
})), /* @__PURE__ */ React.createElement(SPickerInput, _ref2.cn("SPickerInput", _objectSpread({}, assignProps({
|
|
129
|
+
"tag": Input.Value,
|
|
130
|
+
"ref": this.inputRef,
|
|
131
|
+
"inputMode": "numeric",
|
|
132
|
+
"size": size,
|
|
133
|
+
"disabled": disabled,
|
|
134
|
+
"neighborLocation": false,
|
|
135
|
+
"value": value,
|
|
106
136
|
"aria-label": this.getAriaLabel(),
|
|
107
|
-
onChange: this.handleChange,
|
|
108
|
-
onBlur: this.handleBlur,
|
|
109
|
-
onKeyDown: this.handleKeyDown
|
|
110
|
-
},
|
|
137
|
+
"onChange": this.handleChange,
|
|
138
|
+
"onBlur": this.handleBlur,
|
|
139
|
+
"onKeyDown": this.handleKeyDown
|
|
140
|
+
}, _ref)))), /* @__PURE__ */ React.createElement(Select.Menu, {
|
|
111
141
|
hMax: 180
|
|
112
|
-
},
|
|
142
|
+
}, getOptions(min, max, step)));
|
|
113
143
|
}
|
|
114
|
-
}])
|
|
115
|
-
|
|
116
|
-
|
|
144
|
+
}]);
|
|
145
|
+
return ItemPicker2;
|
|
146
|
+
}(Component);
|
|
147
|
+
_defineProperty(ItemPicker, "defaultProps", {
|
|
117
148
|
placeholder: "00",
|
|
118
|
-
offset:
|
|
149
|
+
offset: defaultPopperOffset
|
|
119
150
|
});
|
|
120
|
-
var
|
|
121
|
-
|
|
122
|
-
var
|
|
123
|
-
function
|
|
124
|
-
var
|
|
125
|
-
|
|
126
|
-
for (var
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
151
|
+
var Hours = /* @__PURE__ */ function(_ItemPicker) {
|
|
152
|
+
_inherits(Hours2, _ItemPicker);
|
|
153
|
+
var _super2 = _createSuper(Hours2);
|
|
154
|
+
function Hours2() {
|
|
155
|
+
var _this2;
|
|
156
|
+
_classCallCheck(this, Hours2);
|
|
157
|
+
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
158
|
+
args[_key2] = arguments[_key2];
|
|
159
|
+
}
|
|
160
|
+
_this2 = _super2.call.apply(_super2, [this].concat(args));
|
|
161
|
+
_defineProperty(_assertThisInitialized(_this2), "field", "hours");
|
|
162
|
+
_defineProperty(_assertThisInitialized(_this2), "handleKeyDown", function(event) {
|
|
163
|
+
var currentTarget = event.currentTarget;
|
|
164
|
+
if (event.key === "Enter") {
|
|
165
|
+
_this2.submitChanges(event);
|
|
166
|
+
}
|
|
167
|
+
if (event.key === "ArrowRight") {
|
|
168
|
+
if (currentTarget.selectionStart >= currentTarget.value.length && currentTarget.selectionStart === currentTarget.selectionEnd) {
|
|
169
|
+
event.preventDefault();
|
|
170
|
+
_this2.focusNext();
|
|
171
|
+
}
|
|
172
|
+
}
|
|
173
|
+
});
|
|
174
|
+
return _this2;
|
|
132
175
|
}
|
|
133
|
-
|
|
176
|
+
_createClass(Hours2, [{
|
|
134
177
|
key: "minMax",
|
|
135
|
-
value: function() {
|
|
136
|
-
var
|
|
137
|
-
|
|
178
|
+
value: function minMax() {
|
|
179
|
+
var is12Hour = this.asProps.is12Hour;
|
|
180
|
+
if (is12Hour) {
|
|
181
|
+
return [1, 12];
|
|
182
|
+
} else {
|
|
183
|
+
return [0, 23];
|
|
184
|
+
}
|
|
138
185
|
}
|
|
139
186
|
}, {
|
|
140
187
|
key: "focusNext",
|
|
141
|
-
value: function() {
|
|
142
|
-
this.asProps.minutesInputRef.current
|
|
143
|
-
|
|
144
|
-
|
|
188
|
+
value: function focusNext() {
|
|
189
|
+
if (this.asProps.minutesInputRef.current) {
|
|
190
|
+
this.setState({
|
|
191
|
+
visible: false
|
|
192
|
+
});
|
|
193
|
+
this.asProps.minutesInputRef.current.focus();
|
|
194
|
+
}
|
|
145
195
|
}
|
|
146
196
|
}, {
|
|
147
197
|
key: "componentDidUpdate",
|
|
148
|
-
value: function(
|
|
149
|
-
var
|
|
150
|
-
|
|
198
|
+
value: function componentDidUpdate(_prevProps, prevState) {
|
|
199
|
+
var dirtyValue = this.state.dirtyValue;
|
|
200
|
+
if (prevState.dirtyValue === void 0 || dirtyValue === void 0) return;
|
|
201
|
+
if (prevState.dirtyValue.length === 1 && dirtyValue.length === 2) {
|
|
202
|
+
this.focusNext();
|
|
203
|
+
}
|
|
151
204
|
}
|
|
152
|
-
}])
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
205
|
+
}]);
|
|
206
|
+
return Hours2;
|
|
207
|
+
}(ItemPicker);
|
|
208
|
+
_defineProperty(Hours, "defaultProps", function(_ref3) {
|
|
209
|
+
var size = _ref3.size;
|
|
210
|
+
return _objectSpread(_objectSpread({}, ItemPicker.defaultProps), {}, {
|
|
211
|
+
ml: size === "l" ? 3 : void 0
|
|
158
212
|
});
|
|
159
213
|
});
|
|
160
|
-
var
|
|
161
|
-
|
|
162
|
-
var
|
|
163
|
-
function
|
|
164
|
-
var
|
|
165
|
-
|
|
166
|
-
for (var
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
214
|
+
var Minutes = /* @__PURE__ */ function(_ItemPicker2) {
|
|
215
|
+
_inherits(Minutes2, _ItemPicker2);
|
|
216
|
+
var _super3 = _createSuper(Minutes2);
|
|
217
|
+
function Minutes2() {
|
|
218
|
+
var _this3;
|
|
219
|
+
_classCallCheck(this, Minutes2);
|
|
220
|
+
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
|
|
221
|
+
args[_key3] = arguments[_key3];
|
|
222
|
+
}
|
|
223
|
+
_this3 = _super3.call.apply(_super3, [this].concat(args));
|
|
224
|
+
_defineProperty(_assertThisInitialized(_this3), "field", "minutes");
|
|
225
|
+
_defineProperty(_assertThisInitialized(_this3), "handleKeyDown", function(event) {
|
|
226
|
+
var currentTarget = event.currentTarget;
|
|
227
|
+
if (event.key === "ArrowLeft") {
|
|
228
|
+
if (currentTarget.selectionStart <= 0 && currentTarget.selectionStart === currentTarget.selectionEnd) {
|
|
229
|
+
event.preventDefault();
|
|
230
|
+
_this3.focusPrev();
|
|
231
|
+
}
|
|
232
|
+
}
|
|
233
|
+
if (event.key === "Backspace") {
|
|
234
|
+
if (currentTarget.value.length === 0) {
|
|
235
|
+
event.preventDefault();
|
|
236
|
+
_this3.focusPrev();
|
|
237
|
+
}
|
|
238
|
+
}
|
|
239
|
+
if (event.key === "Enter") _this3.submitChanges(event);
|
|
240
|
+
});
|
|
241
|
+
return _this3;
|
|
172
242
|
}
|
|
173
|
-
|
|
243
|
+
_createClass(Minutes2, [{
|
|
174
244
|
key: "minMax",
|
|
175
|
-
value: function() {
|
|
245
|
+
value: function minMax() {
|
|
176
246
|
return [0, 59];
|
|
177
247
|
}
|
|
178
248
|
}, {
|
|
179
249
|
key: "focusPrev",
|
|
180
|
-
value: function() {
|
|
181
|
-
this.asProps.hoursInputRef.current
|
|
182
|
-
|
|
183
|
-
|
|
250
|
+
value: function focusPrev() {
|
|
251
|
+
if (this.asProps.hoursInputRef.current) {
|
|
252
|
+
this.setState({
|
|
253
|
+
visible: false
|
|
254
|
+
});
|
|
255
|
+
this.asProps.hoursInputRef.current.focus();
|
|
256
|
+
}
|
|
184
257
|
}
|
|
185
|
-
}])
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
258
|
+
}]);
|
|
259
|
+
return Minutes2;
|
|
260
|
+
}(ItemPicker);
|
|
261
|
+
_defineProperty(Minutes, "defaultProps", function(_ref4) {
|
|
262
|
+
var size = _ref4.size;
|
|
263
|
+
return _objectSpread(_objectSpread({}, ItemPicker.defaultProps), {}, {
|
|
264
|
+
mr: size === "l" ? 3 : void 0
|
|
191
265
|
});
|
|
192
266
|
});
|
|
193
267
|
export {
|
|
194
|
-
|
|
195
|
-
|
|
268
|
+
Hours,
|
|
269
|
+
Minutes
|
|
196
270
|
};
|