@semcore/time-picker 3.2.3 → 3.2.5
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/CHANGELOG.md +13 -0
- package/lib/cjs/PickerFormat.js +4 -1
- package/lib/cjs/PickerFormat.js.map +1 -1
- package/lib/cjs/PickerInput.js +15 -30
- package/lib/cjs/PickerInput.js.map +1 -1
- package/lib/cjs/TimePicker.js +46 -49
- package/lib/cjs/TimePicker.js.map +1 -1
- package/lib/es6/PickerFormat.js +4 -1
- package/lib/es6/PickerFormat.js.map +1 -1
- package/lib/es6/PickerInput.js +16 -32
- package/lib/es6/PickerInput.js.map +1 -1
- package/lib/es6/TimePicker.js +48 -46
- package/lib/es6/TimePicker.js.map +1 -1
- package/package.json +8 -6
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,19 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
+
## [3.2.5] - 2022-10-28
|
|
6
|
+
|
|
7
|
+
### Changed
|
|
8
|
+
|
|
9
|
+
- Version patch update due to children dependencies update (`@semcore/button` [4.2.2 ~> 4.2.3], `@semcore/flex-box` [4.6.2 ~> 4.6.3], `@semcore/input` [3.2.2 ~> 3.2.3], `@semcore/select` [3.2.5 ~> 3.2.6], `@semcore/utils` [3.40.0 ~> 3.40.0]).
|
|
10
|
+
|
|
11
|
+
## [3.2.4] - 2022-10-30
|
|
12
|
+
|
|
13
|
+
### Fixed
|
|
14
|
+
|
|
15
|
+
- Fixed that some secret combination of arrows pressing was causing infinite focus call and temporary freeze of browser.
|
|
16
|
+
- Fixed Screen readers support.
|
|
17
|
+
|
|
5
18
|
## [3.2.3] - 2022-10-24
|
|
6
19
|
|
|
7
20
|
### Changed
|
package/lib/cjs/PickerFormat.js
CHANGED
|
@@ -57,9 +57,12 @@ var TimePickerFormat = /*#__PURE__*/function (_Component) {
|
|
|
57
57
|
meridiem = _this$asProps.meridiem,
|
|
58
58
|
styles = _this$asProps.styles;
|
|
59
59
|
var SPickerFormatText = 'span';
|
|
60
|
+
var label = "Time format ".concat(meridiem);
|
|
60
61
|
return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SPickerFormat, _ref2.cn("SPickerFormat", _objectSpread({}, (0, _core.assignProps)({
|
|
61
62
|
"type": "button",
|
|
62
|
-
"tag": "button"
|
|
63
|
+
"tag": "button",
|
|
64
|
+
"role": "switch",
|
|
65
|
+
"aria-label": label
|
|
63
66
|
}, _ref))), Children.origin ? /*#__PURE__*/_react["default"].createElement(Children, _ref2.cn("Children", {})) : /*#__PURE__*/_react["default"].createElement(SPickerFormatText, _ref2.cn("SPickerFormatText", {}), meridiem));
|
|
64
67
|
}
|
|
65
68
|
}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PickerFormat.js","names":["TimePickerFormat","SPickerFormat","Box","asProps","Children","meridiem","styles","SPickerFormatText","sstyled","origin","Component","keyboardFocusEnhance"],"sources":["../../src/PickerFormat.jsx"],"sourcesContent":["import React from 'react';\nimport { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nclass TimePickerFormat extends Component {\n static enhance = [keyboardFocusEnhance()];\n render() {\n const SPickerFormat = Root;\n const { Children, meridiem, styles } = this.asProps;\n const SPickerFormatText = 'span';\n\n return sstyled(styles)(\n <SPickerFormat render={Box} type=\"button\" tag=\"button\">\n {Children.origin ? <Children /> : <SPickerFormatText>{meridiem}</SPickerFormatText>}\n </SPickerFormat>,\n );\n }\n}\n\nexport default TimePickerFormat;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AACA;;AADA;;AAEA;;AACA;;;;;;;;;;IAEMA,gB;;;;;;;;;;;;WAEJ,kBAAS;MAAA;MAAA;;MACP,IAAMC,aAAa,
|
|
1
|
+
{"version":3,"file":"PickerFormat.js","names":["TimePickerFormat","SPickerFormat","Box","asProps","Children","meridiem","styles","SPickerFormatText","label","sstyled","origin","Component","keyboardFocusEnhance"],"sources":["../../src/PickerFormat.jsx"],"sourcesContent":["import React from 'react';\nimport { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nclass TimePickerFormat extends Component {\n static enhance = [keyboardFocusEnhance()];\n render() {\n const SPickerFormat = Root;\n const { Children, meridiem, styles } = this.asProps;\n const SPickerFormatText = 'span';\n\n const label = `Time format ${meridiem}`;\n\n return sstyled(styles)(\n <SPickerFormat render={Box} type=\"button\" tag=\"button\" role=\"switch\" aria-label={label}>\n {Children.origin ? <Children /> : <SPickerFormatText>{meridiem}</SPickerFormatText>}\n </SPickerFormat>,\n );\n }\n}\n\nexport default TimePickerFormat;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AACA;;AADA;;AAEA;;AACA;;;;;;;;;;IAEMA,gB;;;;;;;;;;;;WAEJ,kBAAS;MAAA;MAAA;;MACP,IAAMC,aAAa,GAOMC,YAPzB;MACA,oBAAuC,KAAKC,OAA5C;MAAA,IAAQC,QAAR,iBAAQA,QAAR;MAAA,IAAkBC,QAAlB,iBAAkBA,QAAlB;MAAA,IAA4BC,MAA5B,iBAA4BA,MAA5B;MACA,IAAMC,iBAAiB,GAAG,MAA1B;MAEA,IAAMC,KAAK,yBAAkBH,QAAlB,CAAX;MAEA,eAAO,IAAAI,aAAA,EAAQH,MAAR,CAAP,eACE,gCAAC,aAAD;QAAA,QAAiC,QAAjC;QAAA,OAA8C,QAA9C;QAAA,QAA4D,QAA5D;QAAA,cAAiFE;MAAjF,YACGJ,QAAQ,CAACM,MAAT,gBAAkB,gCAAC,QAAD,2BAAlB,gBAAiC,gCAAC,iBAAD,qCAAoBL,QAApB,CADpC,CADF;IAKD;;;EAd4BM,e;;iCAAzBX,gB,aACa,CAAC,IAAAY,gCAAA,GAAD,C;eAgBJZ,gB"}
|
package/lib/cjs/PickerInput.js
CHANGED
|
@@ -86,7 +86,7 @@ var ItemPicker = /*#__PURE__*/function (_Component) {
|
|
|
86
86
|
}
|
|
87
87
|
|
|
88
88
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
89
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "
|
|
89
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "inputRef", /*#__PURE__*/_react["default"].createRef());
|
|
90
90
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
|
|
91
91
|
dirtyValue: undefined,
|
|
92
92
|
visible: false
|
|
@@ -113,11 +113,6 @@ var ItemPicker = /*#__PURE__*/function (_Component) {
|
|
|
113
113
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleBlur", function (e) {
|
|
114
114
|
return _this.submitChanges(e);
|
|
115
115
|
});
|
|
116
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleFocus", function () {
|
|
117
|
-
var _this$$input;
|
|
118
|
-
|
|
119
|
-
(_this$$input = _this.$input) === null || _this$$input === void 0 ? void 0 : _this$$input.current.select();
|
|
120
|
-
});
|
|
121
116
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleKeyDown", function () {});
|
|
122
117
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleSelect", function (value, e) {
|
|
123
118
|
_this.dispatchOnChange(value, e);
|
|
@@ -190,21 +185,19 @@ var ItemPicker = /*#__PURE__*/function (_Component) {
|
|
|
190
185
|
"visible": visible,
|
|
191
186
|
"value": timeValue
|
|
192
187
|
})), /*#__PURE__*/_react["default"].createElement(SPickerInput, _ref2.cn("SPickerInput", _objectSpread({}, (0, _core.assignProps)({
|
|
193
|
-
"interaction": "focus",
|
|
194
188
|
"tag": _input["default"].Value,
|
|
195
|
-
"
|
|
196
|
-
"aria-expanded": visible,
|
|
197
|
-
"ref": this.$input,
|
|
189
|
+
"ref": this.inputRef,
|
|
198
190
|
"size": size,
|
|
199
191
|
"disabled": disabled,
|
|
200
192
|
"neighborLocation": false,
|
|
201
193
|
"value": value,
|
|
202
|
-
"aria-label": "
|
|
194
|
+
"aria-label": "".concat(this.field, " field"),
|
|
195
|
+
"__excludeProps": ['aria-haspopup', 'aria-controls', 'aria-flowto', 'aria-expanded', 'aria-autocomplete', 'role'],
|
|
203
196
|
"onChange": this.handleChange,
|
|
204
197
|
"onBlur": this.handleBlur,
|
|
205
|
-
"onFocus": this.handleFocus,
|
|
206
198
|
"onKeyDown": this.handleKeyDown
|
|
207
199
|
}, _ref)))), /*#__PURE__*/_react["default"].createElement(_select["default"].Menu, {
|
|
200
|
+
"aria-hidden": "true",
|
|
208
201
|
hMax: 180
|
|
209
202
|
}, getOptions(min, max, step)));
|
|
210
203
|
}
|
|
@@ -261,15 +254,11 @@ var Hours = /*#__PURE__*/function (_ItemPicker) {
|
|
|
261
254
|
}, {
|
|
262
255
|
key: "nextInput",
|
|
263
256
|
value: function nextInput() {
|
|
264
|
-
if (this
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
visible: false
|
|
270
|
-
});
|
|
271
|
-
$input.focus();
|
|
272
|
-
}
|
|
257
|
+
if (this.asProps.minutesInputRef.current) {
|
|
258
|
+
this.setState({
|
|
259
|
+
visible: false
|
|
260
|
+
});
|
|
261
|
+
this.asProps.minutesInputRef.current.focus();
|
|
273
262
|
}
|
|
274
263
|
}
|
|
275
264
|
}, {
|
|
@@ -335,15 +324,11 @@ var Minutes = /*#__PURE__*/function (_ItemPicker2) {
|
|
|
335
324
|
}, {
|
|
336
325
|
key: "prevFocus",
|
|
337
326
|
value: function prevFocus() {
|
|
338
|
-
if (this
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
visible: false
|
|
344
|
-
});
|
|
345
|
-
$input.focus();
|
|
346
|
-
}
|
|
327
|
+
if (this.asProps.hoursInputRef.current) {
|
|
328
|
+
this.setState({
|
|
329
|
+
visible: false
|
|
330
|
+
});
|
|
331
|
+
this.asProps.hoursInputRef.current.focus();
|
|
347
332
|
}
|
|
348
333
|
}
|
|
349
334
|
}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PickerInput.js","names":["MAP_FIELD_TO_TIME","hours","minutes","MAP_SIZE_SELECT","m","l","getOptions","min","max","step","length","Number","toFixed","options","Array","fill","numValue","map","i","index","value","withLeadingZero","String","ItemPicker","React","createRef","dirtyValue","undefined","visible","minMax","Math","e","stopPropagation","numberValue","intOrDefault","NaN","isNaN","setState","slice","submitChanges","$input","current","select","dispatchOnChange","event","asProps","$onValueChange","field","state","parseValueWithMinMax","SPickerInput","Select","Trigger","styles","onSelect","time","size","disabled","onVisibleChange","other","timeValue","sstyled","callAllEventHandlers","handleSelect","handleVisibleChange","Input","Value","handleChange","handleBlur","handleFocus","handleKeyDown","Component","placeholder","Hours","currentTarget","keyCode","selectionStart","selectionEnd","preventDefault","nextInput","is12Hour","focus","prevProps","prevState","Minutes","prevFocus","prevInput"],"sources":["../../src/PickerInput.jsx"],"sourcesContent":["import React from 'react';\nimport Input from '@semcore/input';\nimport Select from '@semcore/select';\nimport { intOrDefault, nextInput, prevInput, withLeadingZero } from './TimePicker';\nimport { Component, sstyled, Root } from '@semcore/core';\nimport { callAllEventHandlers } from '@semcore/utils/lib/assignProps';\n\nconst MAP_FIELD_TO_TIME = {\n hours: 0,\n minutes: 1,\n};\n\nconst MAP_SIZE_SELECT = {\n m: 'm',\n l: 'l',\n};\n\nfunction getOptions(min, max, step = 1) {\n const length = Number(((max + 1 - min) / step).toFixed(0));\n const options = Array(length).fill('');\n let numValue = min;\n return options.map((i, index) => {\n numValue = index === 0 ? numValue : numValue + step;\n const value = withLeadingZero(String(numValue));\n return (\n <Select.Option value={value} key={value}>\n {value}\n </Select.Option>\n );\n });\n}\n\nclass ItemPicker extends Component {\n static defaultProps = {\n placeholder: '00',\n };\n\n $input = React.createRef();\n\n minMax() {\n return [];\n }\n\n state = {\n dirtyValue: undefined,\n visible: false,\n };\n\n parseValueWithMinMax = (value) => {\n const [min, max] = this.minMax();\n return String(Math.max(min, Math.min(max, value)));\n };\n\n dispatchOnChange(value, event) {\n this.setState({ dirtyValue: undefined });\n this.asProps.$onValueChange(value, this.field, event);\n }\n\n submitChanges(event) {\n let { dirtyValue } = this.state;\n if (dirtyValue !== undefined) {\n // if changes value\n if (dirtyValue) dirtyValue = this.parseValueWithMinMax(dirtyValue); // if not \"\"\n this.dispatchOnChange(dirtyValue, event);\n }\n }\n\n handleChange = (value, e) => {\n /* hide props for bubbling events */\n e.stopPropagation();\n const numberValue = intOrDefault(Number(value), NaN);\n\n if (!Number.isNaN(numberValue)) {\n this.setState({ dirtyValue: value.slice(-2) });\n }\n };\n\n handleBlur = (e) => this.submitChanges(e);\n\n handleFocus = () => {\n this.$input?.current.select();\n };\n\n /* rewrite method */\n handleKeyDown = () => {};\n\n handleSelect = (value, e) => {\n this.dispatchOnChange(value, e);\n };\n\n handleVisibleChange = (visible) => this.setState({ visible });\n\n render() {\n const SPickerInput = Root;\n const { styles, step, onSelect, time, size, disabled, onVisibleChange, ...other } =\n this.asProps;\n const { dirtyValue, visible } = this.state;\n const timeValue = time[MAP_FIELD_TO_TIME[this.field]];\n const value = dirtyValue === undefined ? timeValue : dirtyValue;\n const [min, max] = this.minMax();\n\n return sstyled(styles)(\n <Select\n {...other}\n interaction=\"focus\"\n size={size ? MAP_SIZE_SELECT[size] : false}\n onChange={callAllEventHandlers(onSelect, this.handleSelect)}\n onVisibleChange={callAllEventHandlers(onVisibleChange, this.handleVisibleChange)}\n visible={visible}\n value={timeValue}\n >\n <SPickerInput\n interaction=\"focus\"\n render={Select.Trigger}\n tag={Input.Value}\n aria-autocomplete={undefined}\n aria-expanded={visible}\n ref={this.$input}\n size={size}\n disabled={disabled}\n neighborLocation={false}\n value={value}\n aria-label={`Search ${this.field}`}\n onChange={this.handleChange}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n />\n <Select.Menu hMax={180}>{getOptions(min, max, step)}</Select.Menu>\n </Select>,\n );\n }\n}\n\nclass Hours extends ItemPicker {\n field = 'hours';\n\n minMax() {\n const { is12Hour } = this.asProps;\n if (is12Hour) {\n return [1, 12];\n } else {\n return [0, 23];\n }\n }\n\n nextInput() {\n if (this.$input.current) {\n const $input = nextInput(this.$input.current);\n if ($input) {\n this.setState({ visible: false });\n $input.focus();\n }\n }\n }\n\n handleKeyDown = (e) => {\n const { currentTarget } = e;\n if (e.keyCode === 13) this.submitChanges(e);\n if (e.keyCode === 39) {\n if (\n currentTarget.selectionStart >= currentTarget.value.length &&\n currentTarget.selectionStart === currentTarget.selectionEnd\n ) {\n e.preventDefault();\n this.nextInput();\n }\n }\n };\n\n componentDidUpdate(prevProps, prevState) {\n const { dirtyValue } = this.state;\n if (prevState.dirtyValue === undefined || dirtyValue === undefined) return;\n\n if (prevState.dirtyValue.length === 1 && dirtyValue.length === 2) {\n this.nextInput();\n }\n }\n}\n\nclass Minutes extends ItemPicker {\n field = 'minutes';\n\n minMax() {\n return [0, 59];\n }\n\n prevFocus() {\n if (this.$input.current) {\n const $input = prevInput(this.$input.current);\n if ($input) {\n this.setState({ visible: false });\n $input.focus();\n }\n }\n }\n\n handleKeyDown = (e) => {\n const { currentTarget } = e;\n if (e.keyCode === 13) this.submitChanges(e);\n if (e.keyCode === 37) {\n if (\n currentTarget.selectionStart <= 0 &&\n currentTarget.selectionStart === currentTarget.selectionEnd\n ) {\n e.preventDefault();\n this.prevFocus();\n }\n }\n if (e.keyCode === 8) {\n if (currentTarget.value.length === 0) {\n e.preventDefault();\n this.prevFocus();\n }\n }\n };\n}\n\nexport { Hours, Minutes };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PickerInput.js","names":["MAP_FIELD_TO_TIME","hours","minutes","MAP_SIZE_SELECT","m","l","getOptions","min","max","step","length","Number","toFixed","options","Array","fill","numValue","map","i","index","value","withLeadingZero","String","ItemPicker","React","createRef","dirtyValue","undefined","visible","minMax","Math","e","stopPropagation","numberValue","intOrDefault","NaN","isNaN","setState","slice","submitChanges","dispatchOnChange","event","asProps","$onValueChange","field","state","parseValueWithMinMax","SPickerInput","Select","Trigger","styles","onSelect","time","size","disabled","onVisibleChange","other","timeValue","sstyled","callAllEventHandlers","handleSelect","handleVisibleChange","Input","Value","inputRef","handleChange","handleBlur","handleKeyDown","Component","placeholder","Hours","currentTarget","keyCode","selectionStart","selectionEnd","preventDefault","nextInput","is12Hour","minutesInputRef","current","focus","prevProps","prevState","Minutes","prevFocus","hoursInputRef"],"sources":["../../src/PickerInput.jsx"],"sourcesContent":["import React from 'react';\nimport Input from '@semcore/input';\nimport Select from '@semcore/select';\nimport { intOrDefault, withLeadingZero } from './TimePicker';\nimport { Component, sstyled, Root } from '@semcore/core';\nimport { callAllEventHandlers } from '@semcore/utils/lib/assignProps';\n\nconst MAP_FIELD_TO_TIME = {\n hours: 0,\n minutes: 1,\n};\n\nconst MAP_SIZE_SELECT = {\n m: 'm',\n l: 'l',\n};\n\nfunction getOptions(min, max, step = 1) {\n const length = Number(((max + 1 - min) / step).toFixed(0));\n const options = Array(length).fill('');\n let numValue = min;\n return options.map((i, index) => {\n numValue = index === 0 ? numValue : numValue + step;\n const value = withLeadingZero(String(numValue));\n return (\n <Select.Option value={value} key={value}>\n {value}\n </Select.Option>\n );\n });\n}\n\nclass ItemPicker extends Component {\n static defaultProps = {\n placeholder: '00',\n };\n\n inputRef = React.createRef();\n\n minMax() {\n return [];\n }\n\n state = {\n dirtyValue: undefined,\n visible: false,\n };\n\n parseValueWithMinMax = (value) => {\n const [min, max] = this.minMax();\n return String(Math.max(min, Math.min(max, value)));\n };\n\n dispatchOnChange(value, event) {\n this.setState({ dirtyValue: undefined });\n this.asProps.$onValueChange(value, this.field, event);\n }\n\n submitChanges(event) {\n let { dirtyValue } = this.state;\n if (dirtyValue !== undefined) {\n // if changes value\n if (dirtyValue) dirtyValue = this.parseValueWithMinMax(dirtyValue); // if not \"\"\n this.dispatchOnChange(dirtyValue, event);\n }\n }\n\n handleChange = (value, e) => {\n /* hide props for bubbling events */\n e.stopPropagation();\n const numberValue = intOrDefault(Number(value), NaN);\n\n if (!Number.isNaN(numberValue)) {\n this.setState({ dirtyValue: value.slice(-2) });\n }\n };\n\n handleBlur = (e) => this.submitChanges(e);\n\n /* rewrite method */\n handleKeyDown = () => {};\n\n handleSelect = (value, e) => {\n this.dispatchOnChange(value, e);\n };\n\n handleVisibleChange = (visible) => this.setState({ visible });\n\n render() {\n const SPickerInput = Root;\n const { styles, step, onSelect, time, size, disabled, onVisibleChange, ...other } =\n this.asProps;\n const { dirtyValue, visible } = this.state;\n const timeValue = time[MAP_FIELD_TO_TIME[this.field]];\n const value = dirtyValue === undefined ? timeValue : dirtyValue;\n const [min, max] = this.minMax();\n\n return sstyled(styles)(\n <Select\n {...other}\n interaction=\"focus\"\n size={size ? MAP_SIZE_SELECT[size] : false}\n onChange={callAllEventHandlers(onSelect, this.handleSelect)}\n onVisibleChange={callAllEventHandlers(onVisibleChange, this.handleVisibleChange)}\n visible={visible}\n value={timeValue}\n >\n <SPickerInput\n render={Select.Trigger}\n tag={Input.Value}\n ref={this.inputRef}\n size={size}\n disabled={disabled}\n neighborLocation={false}\n value={value}\n aria-label={`${this.field} field`}\n __excludeProps={[\n 'aria-haspopup',\n 'aria-controls',\n 'aria-flowto',\n 'aria-expanded',\n 'aria-autocomplete',\n 'role',\n ]}\n onChange={this.handleChange}\n onBlur={this.handleBlur}\n onKeyDown={this.handleKeyDown}\n />\n <Select.Menu aria-hidden=\"true\" hMax={180}>\n {getOptions(min, max, step)}\n </Select.Menu>\n </Select>,\n );\n }\n}\n\nclass Hours extends ItemPicker {\n field = 'hours';\n\n minMax() {\n const { is12Hour } = this.asProps;\n if (is12Hour) {\n return [1, 12];\n } else {\n return [0, 23];\n }\n }\n\n nextInput() {\n if (this.asProps.minutesInputRef.current) {\n this.setState({ visible: false });\n this.asProps.minutesInputRef.current.focus();\n }\n }\n\n handleKeyDown = (e) => {\n const { currentTarget } = e;\n if (e.keyCode === 13) this.submitChanges(e);\n if (e.keyCode === 39) {\n if (\n currentTarget.selectionStart >= currentTarget.value.length &&\n currentTarget.selectionStart === currentTarget.selectionEnd\n ) {\n e.preventDefault();\n this.nextInput();\n }\n }\n };\n\n componentDidUpdate(prevProps, prevState) {\n const { dirtyValue } = this.state;\n if (prevState.dirtyValue === undefined || dirtyValue === undefined) return;\n\n if (prevState.dirtyValue.length === 1 && dirtyValue.length === 2) {\n this.nextInput();\n }\n }\n}\n\nclass Minutes extends ItemPicker {\n field = 'minutes';\n\n minMax() {\n return [0, 59];\n }\n\n prevFocus() {\n if (this.asProps.hoursInputRef.current) {\n this.setState({ visible: false });\n this.asProps.hoursInputRef.current.focus();\n }\n }\n\n handleKeyDown = (e) => {\n const { currentTarget } = e;\n if (e.keyCode === 13) this.submitChanges(e);\n if (e.keyCode === 37) {\n if (\n currentTarget.selectionStart <= 0 &&\n currentTarget.selectionStart === currentTarget.selectionEnd\n ) {\n e.preventDefault();\n this.prevFocus();\n }\n }\n if (e.keyCode === 8) {\n if (currentTarget.value.length === 0) {\n e.preventDefault();\n this.prevFocus();\n }\n }\n };\n}\n\nexport { Hours, Minutes };\n"],"mappings":"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"}
|
package/lib/cjs/TimePicker.js
CHANGED
|
@@ -12,8 +12,6 @@ exports.formatHoursTo12 = formatHoursTo12;
|
|
|
12
12
|
exports.formatHoursTo24 = formatHoursTo24;
|
|
13
13
|
exports.intOrDefault = intOrDefault;
|
|
14
14
|
exports.meridiemByHours = meridiemByHours;
|
|
15
|
-
exports.nextInput = nextInput;
|
|
16
|
-
exports.prevInput = prevInput;
|
|
17
15
|
exports.withLeadingZero = withLeadingZero;
|
|
18
16
|
|
|
19
17
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
@@ -61,22 +59,22 @@ var style = (
|
|
|
61
59
|
/*__reshadow_css_start__*/
|
|
62
60
|
_core.sstyled.insert(
|
|
63
61
|
/*__inner_css_start__*/
|
|
64
|
-
":root {\n\n /* DEPRECATED START\n Deprecated variables should never be used in\n components styles but preserved for backward\n compatibility if they used in projects\n like `<Badge bg=\"red\">alpha</Badge>`\n */\n /* DEPRECATED END */\n}\n\n.
|
|
62
|
+
":root {\n\n /* DEPRECATED START\n Deprecated variables should never be used in\n components styles but preserved for backward\n compatibility if they used in projects\n like `<Badge bg=\"red\">alpha</Badge>`\n */\n /* DEPRECATED END */\n}\n\n.___STimePicker_1vlmo_gg_ {\n position: relative;\n width: auto;\n}\n\n.___STimePicker_1vlmo_gg_.__disabled_1vlmo_gg_ {\n color: rgba(25, 27, 35, 0.3);\n cursor: default;\n}\n\n.___SPickerInput_1vlmo_gg_ {\n box-sizing: content-box;\n text-align: center;\n z-index: 1\n}\n\n.___SPickerInput_1vlmo_gg_.__placeholder_1vlmo_gg_ {\n text-overflow: initial;\n }\n\n.___SPickerInput_1vlmo_gg_._size_m_1vlmo_gg_ {\n width: 19px;\n}\n\n.___SPickerInput_1vlmo_gg_._size_l_1vlmo_gg_ {\n width: 21px;\n}\n\n.___SPickerFormat_1vlmo_gg_ {\n flex-shrink: 0;\n position: relative;\n display: inline-flex;\n padding: 0;\n white-space: nowrap;\n font-family: inherit;\n font-weight: 500;\n line-height: normal;\n text-decoration: none;\n align-items: center;\n border: 1px solid #c4c7cf;\n border-radius: 0 6px 6px 0;\n outline: 0;\n box-shadow: none;\n cursor: pointer;\n box-sizing: border-box;\n overflow: visible;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n touch-action: manipulation;\n -webkit-tap-highlight-color: transparent;\n color: #6c6e79;\n background-color: rgba(138, 142, 155, 0.1)\n}\n\n.___SPickerFormat_1vlmo_gg_:hover {\n color: #6c6e79;\n background-color: rgba(138, 142, 155, 0.2);\n }\n\n.___SPickerFormat_1vlmo_gg_:active,\n .___SPickerFormat_1vlmo_gg_.__active_1vlmo_gg_ {\n color: #6c6e79;\n background-color: rgba(138, 142, 155, 0.3);\n }\n\n.___SPickerFormat_1vlmo_gg_._size_m_1vlmo_gg_ {\n height: 28px;\n font-size: 14px;\n margin: 0 -1px 0 0\n}\n\n.___SPickerFormat_1vlmo_gg_._size_m_1vlmo_gg_ .___SPickerFormatText_1vlmo_gg_ {\n margin: 0 8px;\n }\n\n.___SPickerFormat_1vlmo_gg_._size_l_1vlmo_gg_ {\n height: 40px;\n font-size: 16px;\n margin: 0 -4px 0 0\n}\n\n.___SPickerFormat_1vlmo_gg_._size_l_1vlmo_gg_ .___SPickerFormatText_1vlmo_gg_ {\n margin: 0 12px;\n }\n\n.___SPickerFormat_1vlmo_gg_.__disabled_1vlmo_gg_ {\n opacity: 0.3;\n cursor: default;\n pointer-events: none;\n border-color: transparent transparent transparent #c4c7cf;\n}\n\n.___SPickerFormat_1vlmo_gg_.__keyboardFocused_1vlmo_gg_ {\n box-shadow: 0 0 0 3px rgba(0, 143, 248, 0.2);\n}\n\n.___STimePickerSeparator_1vlmo_gg_.__disabled_1vlmo_gg_ {\n opacity: 0.3;\n pointer-events: none;\n}\n"
|
|
65
63
|
/*__inner_css_end__*/
|
|
66
|
-
, "
|
|
64
|
+
, "1vlmo_gg_")
|
|
67
65
|
/*__reshadow_css_end__*/
|
|
68
66
|
, {
|
|
69
|
-
"__STimePicker": "
|
|
70
|
-
"_disabled": "
|
|
71
|
-
"__SPickerInput": "
|
|
72
|
-
"_placeholder": "
|
|
73
|
-
"_size_m": "
|
|
74
|
-
"_size_l": "
|
|
75
|
-
"__SPickerFormat": "
|
|
76
|
-
"_active": "
|
|
77
|
-
"__SPickerFormatText": "
|
|
78
|
-
"_keyboardFocused": "
|
|
79
|
-
"__STimePickerSeparator": "
|
|
67
|
+
"__STimePicker": "___STimePicker_1vlmo_gg_",
|
|
68
|
+
"_disabled": "__disabled_1vlmo_gg_",
|
|
69
|
+
"__SPickerInput": "___SPickerInput_1vlmo_gg_",
|
|
70
|
+
"_placeholder": "__placeholder_1vlmo_gg_",
|
|
71
|
+
"_size_m": "_size_m_1vlmo_gg_",
|
|
72
|
+
"_size_l": "_size_l_1vlmo_gg_",
|
|
73
|
+
"__SPickerFormat": "___SPickerFormat_1vlmo_gg_",
|
|
74
|
+
"_active": "__active_1vlmo_gg_",
|
|
75
|
+
"__SPickerFormatText": "___SPickerFormatText_1vlmo_gg_",
|
|
76
|
+
"_keyboardFocused": "__keyboardFocused_1vlmo_gg_",
|
|
77
|
+
"__STimePickerSeparator": "___STimePickerSeparator_1vlmo_gg_"
|
|
80
78
|
});
|
|
81
79
|
var MAP_MERIDIEM = {
|
|
82
80
|
AM: 'PM',
|
|
@@ -87,22 +85,6 @@ var MAP_FIELD_TO_TIME = {
|
|
|
87
85
|
minutes: 1
|
|
88
86
|
};
|
|
89
87
|
|
|
90
|
-
function nextInput(element) {
|
|
91
|
-
do {
|
|
92
|
-
element = element.nextElementSibling;
|
|
93
|
-
} while (element && element.tagName !== 'INPUT');
|
|
94
|
-
|
|
95
|
-
return element;
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
function prevInput(element) {
|
|
99
|
-
do {
|
|
100
|
-
element = element.previousElementSibling;
|
|
101
|
-
} while (element && element.tagName !== 'INPUT');
|
|
102
|
-
|
|
103
|
-
return element;
|
|
104
|
-
}
|
|
105
|
-
|
|
106
88
|
function intOrDefault(value) {
|
|
107
89
|
var def = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
108
90
|
var number = Number.parseInt(value);
|
|
@@ -166,6 +148,8 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
166
148
|
}
|
|
167
149
|
|
|
168
150
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
151
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "hoursInputRef", /*#__PURE__*/_react["default"].createRef());
|
|
152
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "minutesInputRef", /*#__PURE__*/_react["default"].createRef());
|
|
169
153
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_lastMeridiem", 'AM');
|
|
170
154
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleValueChange", function (value, field, event) {
|
|
171
155
|
var is12Hour = _this.asProps.is12Hour;
|
|
@@ -226,7 +210,9 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
226
210
|
size: size,
|
|
227
211
|
is12Hour: is12Hour,
|
|
228
212
|
disabled: disabled,
|
|
229
|
-
$onValueChange: _this.handleValueChange
|
|
213
|
+
$onValueChange: _this.handleValueChange,
|
|
214
|
+
minutesInputRef: _this.minutesInputRef,
|
|
215
|
+
hoursInputRef: _this.hoursInputRef
|
|
230
216
|
};
|
|
231
217
|
});
|
|
232
218
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getHoursProps", _this._getHoursAndMinutesProps);
|
|
@@ -306,23 +292,28 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
306
292
|
key: "getSeparatorProps",
|
|
307
293
|
value: function getSeparatorProps() {
|
|
308
294
|
return {
|
|
309
|
-
disabled: this.asProps.disabled
|
|
295
|
+
disabled: this.asProps.disabled,
|
|
296
|
+
hoursInputRef: this.hoursInputRef
|
|
310
297
|
};
|
|
311
298
|
}
|
|
312
299
|
}, {
|
|
313
300
|
key: "getFormatProps",
|
|
314
301
|
value: function getFormatProps() {
|
|
302
|
+
var _ref4;
|
|
303
|
+
|
|
315
304
|
var _this$asProps2 = this.asProps,
|
|
316
305
|
size = _this$asProps2.size,
|
|
317
306
|
disabled = _this$asProps2.disabled,
|
|
318
|
-
disablePortal = _this$asProps2.disablePortal
|
|
319
|
-
|
|
307
|
+
disablePortal = _this$asProps2.disablePortal,
|
|
308
|
+
value = _this$asProps2.value;
|
|
309
|
+
var valueFulfilled = value === null || value === void 0 ? void 0 : value.split(':').every(function (chunk) {
|
|
310
|
+
return chunk.length > 0;
|
|
311
|
+
});
|
|
312
|
+
return _ref4 = {
|
|
320
313
|
size: size,
|
|
321
314
|
disabled: disabled,
|
|
322
|
-
disablePortal: disablePortal
|
|
323
|
-
|
|
324
|
-
onClick: this.handleMeridiemClick
|
|
325
|
-
};
|
|
315
|
+
disablePortal: disablePortal
|
|
316
|
+
}, (0, _defineProperty2["default"])(_ref4, 'aria-hidden', !valueFulfilled), (0, _defineProperty2["default"])(_ref4, "meridiem", this.meridiem), (0, _defineProperty2["default"])(_ref4, "onClick", this.handleMeridiemClick), _ref4;
|
|
326
317
|
}
|
|
327
318
|
}, {
|
|
328
319
|
key: "render",
|
|
@@ -333,8 +324,15 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
333
324
|
var STimePicker = _input["default"];
|
|
334
325
|
var _this$asProps3 = this.asProps,
|
|
335
326
|
styles = _this$asProps3.styles,
|
|
336
|
-
Children = _this$asProps3.Children
|
|
337
|
-
|
|
327
|
+
Children = _this$asProps3.Children,
|
|
328
|
+
value = _this$asProps3.value,
|
|
329
|
+
is12Hour = _this$asProps3.is12Hour;
|
|
330
|
+
var label = value ? "Time input, entered time is ".concat(value, " ").concat(is12Hour ? this.meridiem : '') : "Time input, no time entered";
|
|
331
|
+
return _ref3 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(STimePicker, _ref3.cn("STimePicker", _objectSpread({}, (0, _core.assignProps)({
|
|
332
|
+
"aria-label": label,
|
|
333
|
+
"aria-valuenow": value || undefined,
|
|
334
|
+
"tabIndex": 0
|
|
335
|
+
}, _ref))), /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {})));
|
|
338
336
|
}
|
|
339
337
|
}]);
|
|
340
338
|
return TimePickerRoot;
|
|
@@ -342,8 +340,8 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
342
340
|
|
|
343
341
|
(0, _defineProperty2["default"])(TimePickerRoot, "displayName", 'TimePicker');
|
|
344
342
|
(0, _defineProperty2["default"])(TimePickerRoot, "style", style);
|
|
345
|
-
(0, _defineProperty2["default"])(TimePickerRoot, "defaultProps", function (
|
|
346
|
-
var is12Hour =
|
|
343
|
+
(0, _defineProperty2["default"])(TimePickerRoot, "defaultProps", function (_ref5) {
|
|
344
|
+
var is12Hour = _ref5.is12Hour;
|
|
347
345
|
return {
|
|
348
346
|
defaultValue: '',
|
|
349
347
|
size: 'm',
|
|
@@ -366,12 +364,11 @@ var Separator = /*#__PURE__*/function (_Component2) {
|
|
|
366
364
|
}
|
|
367
365
|
|
|
368
366
|
_this2 = _super2.call.apply(_super2, [this].concat(args));
|
|
369
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "$el", /*#__PURE__*/_react["default"].createRef());
|
|
370
367
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this2), "handlerClick", function () {
|
|
371
|
-
if (_this2
|
|
372
|
-
var
|
|
368
|
+
if (_this2.asProps.hoursInputRef.current) {
|
|
369
|
+
var _this2$asProps$hoursI;
|
|
373
370
|
|
|
374
|
-
(
|
|
371
|
+
(_this2$asProps$hoursI = _this2.asProps.hoursInputRef.current) === null || _this2$asProps$hoursI === void 0 ? void 0 : _this2$asProps$hoursI.focus();
|
|
375
372
|
}
|
|
376
373
|
});
|
|
377
374
|
return _this2;
|
|
@@ -383,8 +380,8 @@ var Separator = /*#__PURE__*/function (_Component2) {
|
|
|
383
380
|
var _ref2 = this.asProps;
|
|
384
381
|
var STimePickerSeparator = _flexBox.Box;
|
|
385
382
|
return /*#__PURE__*/_react["default"].createElement(STimePickerSeparator, (0, _core.assignProps)({
|
|
386
|
-
"
|
|
387
|
-
"
|
|
383
|
+
"onClick": this.handlerClick,
|
|
384
|
+
"aria-hidden": "true"
|
|
388
385
|
}, _ref2));
|
|
389
386
|
}
|
|
390
387
|
}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimePicker.js","names":["MAP_MERIDIEM","AM","PM","MAP_FIELD_TO_TIME","hours","minutes","nextInput","element","nextElementSibling","tagName","prevInput","previousElementSibling","intOrDefault","value","def","number","Number","parseInt","isNaN","withLeadingZero","String","length","meridiemByHours","formatHoursTo12","nHours","NaN","formatHoursTo24","meridiem","TimePickerRoot","field","event","is12Hour","asProps","time","split","timeToValue","handlers","size","disabled","valueToTime","$onValueChange","handleValueChange","_getHoursAndMinutesProps","undefined","_lastMeridiem","disablePortal","onClick","handleMeridiemClick","STimePicker","Input","styles","Children","sstyled","Component","style","defaultValue","children","Separator","React","createRef","$el","current","focus","STimePickerSeparator","Box","handlerClick","TimePicker","createComponent","Hours","Minutes","Format"],"sources":["../../src/TimePicker.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Input from '@semcore/input';\nimport { Box } from '@semcore/flex-box';\nimport { Hours, Minutes } from './PickerInput';\nimport Format from './PickerFormat';\n\nimport style from './style/time-picker.shadow.css';\n\nconst MAP_MERIDIEM = {\n AM: 'PM',\n PM: 'AM',\n};\nconst MAP_FIELD_TO_TIME = {\n hours: 0,\n minutes: 1,\n};\n\nexport function nextInput(element) {\n do {\n element = element.nextElementSibling;\n } while (element && element.tagName !== 'INPUT');\n return element;\n}\n\nexport function prevInput(element) {\n do {\n element = element.previousElementSibling;\n } while (element && element.tagName !== 'INPUT');\n return element;\n}\n\nexport function intOrDefault(value, def = 0) {\n const number = Number.parseInt(value);\n return Number.isNaN(number) ? def : number;\n}\n\nexport function withLeadingZero(value) {\n value = String(value);\n if (value.length === 1) return `0${value}`;\n return String(value);\n}\n\nexport function meridiemByHours(hours) {\n return hours >= 12 ? 'PM' : 'AM';\n}\n\nexport function formatHoursTo12(hours /* hours by 24 */) {\n const nHours = intOrDefault(hours, NaN); // if not (:00)\n if (Number.isNaN(nHours)) return hours;\n\n // if not (HH:00)\n if (nHours === 0) return 12; // 0 => 12 PM\n if (nHours > 12) return nHours - 12; // 22 => 12 PM\n\n return hours;\n}\n\nexport function formatHoursTo24(hours /* hours by 12 */, meridiem) {\n const nHours = intOrDefault(hours, NaN); // if not (:00)\n\n if (Number.isNaN(nHours)) return hours;\n\n if (meridiem === 'AM') {\n if (nHours === 12) return 0; // 12 AM => 0\n }\n\n if (meridiem === 'PM') {\n if (nHours < 12) return nHours + 12; // 10 PM => 22\n }\n\n return hours;\n}\n\nclass TimePickerRoot extends Component {\n static displayName = 'TimePicker';\n static style = style;\n static defaultProps = ({ is12Hour }) => ({\n defaultValue: '',\n size: 'm',\n children: (\n <>\n <TimePicker.Hours />\n <TimePicker.Separator />\n <TimePicker.Minutes />\n {is12Hour && <TimePicker.Format />}\n </>\n ),\n });\n\n _lastMeridiem = 'AM'; // default AM\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n get value() {\n const { value } = this.asProps;\n return value === null || value === undefined ? ':' : value;\n }\n\n get meridiem() {\n const { value } = this.asProps;\n const [hours = ''] = value.split(':');\n\n const nHours = intOrDefault(hours, NaN);\n\n if (!Number.isNaN(nHours)) {\n this._lastMeridiem = meridiemByHours(nHours);\n }\n\n return this._lastMeridiem;\n }\n\n valueToTime(value) {\n const { is12Hour } = this.asProps;\n let [hours = '', minutes = ''] = value.split(':');\n\n if (is12Hour) hours = formatHoursTo12(hours);\n\n hours = withLeadingZero(hours);\n minutes = withLeadingZero(minutes);\n\n return [hours, minutes];\n }\n\n timeToValue(time, meridiem) {\n const { is12Hour } = this.asProps;\n let [hours = '', minutes = ''] = time;\n\n hours = intOrDefault(hours, hours); // 03 => 3\n minutes = intOrDefault(minutes, minutes); // MM => MM\n\n if (is12Hour) hours = formatHoursTo24(hours, meridiem); // 12 PM -> 0\n\n return `${hours}:${minutes}`;\n }\n\n handleValueChange = (value, field, event) => {\n const { is12Hour } = this.asProps;\n const { meridiem } = this;\n\n let time;\n if (field) {\n time = this.value.split(':');\n time[MAP_FIELD_TO_TIME[field]] = value;\n } else {\n time = value.split(':');\n }\n\n let [hours = '', minutes = ''] = time;\n\n if (is12Hour) hours = String(formatHoursTo12(hours));\n\n value = this.timeToValue([hours, minutes], meridiem);\n this.handlers.value(value, event);\n };\n\n handleMeridiemClick = (event) => {\n const { is12Hour } = this.asProps;\n let { value, meridiem } = this;\n let [hours = '', minutes = ''] = value.split(':');\n\n if (is12Hour) hours = String(formatHoursTo12(hours));\n\n value = this.timeToValue([hours, minutes], MAP_MERIDIEM[meridiem]);\n this.handlers.value(value, event);\n };\n\n _getHoursAndMinutesProps = () => {\n const { is12Hour, size, disabled } = this.asProps;\n const time = this.valueToTime(this.value);\n\n return {\n time,\n size,\n is12Hour,\n disabled,\n $onValueChange: this.handleValueChange,\n };\n };\n\n getHoursProps = this._getHoursAndMinutesProps;\n getMinutesProps = this._getHoursAndMinutesProps;\n\n getSeparatorProps() {\n return {\n disabled: this.asProps.disabled,\n };\n }\n\n getFormatProps() {\n const { size, disabled, disablePortal } = this.asProps;\n return {\n size,\n disabled,\n disablePortal,\n meridiem: this.meridiem,\n onClick: this.handleMeridiemClick,\n };\n }\n\n render() {\n const STimePicker = Root;\n const { styles, Children } = this.asProps;\n\n return sstyled(styles)(\n <STimePicker render={Input}>\n <Children />\n </STimePicker>,\n );\n }\n}\n\nclass Separator extends Component {\n static defaultProps = {\n children: ':',\n };\n\n $el = React.createRef();\n\n handlerClick = () => {\n if (this.$el.current) {\n prevInput(this.$el.current)?.focus();\n }\n };\n\n render() {\n const STimePickerSeparator = Root;\n return <STimePickerSeparator render={Box} ref={this.$el} onClick={this.handlerClick} />;\n }\n}\n\nconst TimePicker = createComponent(TimePickerRoot, {\n Hours,\n Minutes,\n Separator,\n Format,\n});\n\nexport default TimePicker;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TimePicker.js","names":["MAP_MERIDIEM","AM","PM","MAP_FIELD_TO_TIME","hours","minutes","intOrDefault","value","def","number","Number","parseInt","isNaN","withLeadingZero","String","length","meridiemByHours","formatHoursTo12","nHours","NaN","formatHoursTo24","meridiem","TimePickerRoot","React","createRef","field","event","is12Hour","asProps","time","split","timeToValue","handlers","size","disabled","valueToTime","$onValueChange","handleValueChange","minutesInputRef","hoursInputRef","_getHoursAndMinutesProps","undefined","_lastMeridiem","disablePortal","valueFulfilled","every","chunk","handleMeridiemClick","STimePicker","Input","styles","Children","label","sstyled","Component","style","defaultValue","children","Separator","current","focus","STimePickerSeparator","Box","handlerClick","TimePicker","createComponent","Hours","Minutes","Format"],"sources":["../../src/TimePicker.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Input from '@semcore/input';\nimport { Box } from '@semcore/flex-box';\nimport { Hours, Minutes } from './PickerInput';\nimport Format from './PickerFormat';\n\nimport style from './style/time-picker.shadow.css';\n\nconst MAP_MERIDIEM = {\n AM: 'PM',\n PM: 'AM',\n};\nconst MAP_FIELD_TO_TIME = {\n hours: 0,\n minutes: 1,\n};\n\nexport function intOrDefault(value, def = 0) {\n const number = Number.parseInt(value);\n return Number.isNaN(number) ? def : number;\n}\n\nexport function withLeadingZero(value) {\n value = String(value);\n if (value.length === 1) return `0${value}`;\n return String(value);\n}\n\nexport function meridiemByHours(hours) {\n return hours >= 12 ? 'PM' : 'AM';\n}\n\nexport function formatHoursTo12(hours /* hours by 24 */) {\n const nHours = intOrDefault(hours, NaN); // if not (:00)\n if (Number.isNaN(nHours)) return hours;\n\n // if not (HH:00)\n if (nHours === 0) return 12; // 0 => 12 PM\n if (nHours > 12) return nHours - 12; // 22 => 12 PM\n\n return hours;\n}\n\nexport function formatHoursTo24(hours /* hours by 12 */, meridiem) {\n const nHours = intOrDefault(hours, NaN); // if not (:00)\n\n if (Number.isNaN(nHours)) return hours;\n\n if (meridiem === 'AM') {\n if (nHours === 12) return 0; // 12 AM => 0\n }\n\n if (meridiem === 'PM') {\n if (nHours < 12) return nHours + 12; // 10 PM => 22\n }\n\n return hours;\n}\n\nclass TimePickerRoot extends Component {\n static displayName = 'TimePicker';\n static style = style;\n static defaultProps = ({ is12Hour }) => ({\n defaultValue: '',\n size: 'm',\n children: (\n <>\n <TimePicker.Hours />\n <TimePicker.Separator />\n <TimePicker.Minutes />\n {is12Hour && <TimePicker.Format />}\n </>\n ),\n });\n\n hoursInputRef = React.createRef();\n minutesInputRef = React.createRef();\n\n _lastMeridiem = 'AM'; // default AM\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n get value() {\n const { value } = this.asProps;\n return value === null || value === undefined ? ':' : value;\n }\n\n get meridiem() {\n const { value } = this.asProps;\n const [hours = ''] = value.split(':');\n\n const nHours = intOrDefault(hours, NaN);\n\n if (!Number.isNaN(nHours)) {\n this._lastMeridiem = meridiemByHours(nHours);\n }\n\n return this._lastMeridiem;\n }\n\n valueToTime(value) {\n const { is12Hour } = this.asProps;\n let [hours = '', minutes = ''] = value.split(':');\n\n if (is12Hour) hours = formatHoursTo12(hours);\n\n hours = withLeadingZero(hours);\n minutes = withLeadingZero(minutes);\n\n return [hours, minutes];\n }\n\n timeToValue(time, meridiem) {\n const { is12Hour } = this.asProps;\n let [hours = '', minutes = ''] = time;\n\n hours = intOrDefault(hours, hours); // 03 => 3\n minutes = intOrDefault(minutes, minutes); // MM => MM\n\n if (is12Hour) hours = formatHoursTo24(hours, meridiem); // 12 PM -> 0\n\n return `${hours}:${minutes}`;\n }\n\n handleValueChange = (value, field, event) => {\n const { is12Hour } = this.asProps;\n const { meridiem } = this;\n\n let time;\n if (field) {\n time = this.value.split(':');\n time[MAP_FIELD_TO_TIME[field]] = value;\n } else {\n time = value.split(':');\n }\n\n let [hours = '', minutes = ''] = time;\n\n if (is12Hour) hours = String(formatHoursTo12(hours));\n\n value = this.timeToValue([hours, minutes], meridiem);\n this.handlers.value(value, event);\n };\n\n handleMeridiemClick = (event) => {\n const { is12Hour } = this.asProps;\n let { value, meridiem } = this;\n let [hours = '', minutes = ''] = value.split(':');\n\n if (is12Hour) hours = String(formatHoursTo12(hours));\n\n value = this.timeToValue([hours, minutes], MAP_MERIDIEM[meridiem]);\n this.handlers.value(value, event);\n };\n\n _getHoursAndMinutesProps = () => {\n const { is12Hour, size, disabled } = this.asProps;\n const time = this.valueToTime(this.value);\n\n return {\n time,\n size,\n is12Hour,\n disabled,\n $onValueChange: this.handleValueChange,\n minutesInputRef: this.minutesInputRef,\n hoursInputRef: this.hoursInputRef,\n };\n };\n\n getHoursProps = this._getHoursAndMinutesProps;\n getMinutesProps = this._getHoursAndMinutesProps;\n\n getSeparatorProps() {\n return {\n disabled: this.asProps.disabled,\n hoursInputRef: this.hoursInputRef,\n };\n }\n\n getFormatProps() {\n const { size, disabled, disablePortal, value } = this.asProps;\n const valueFulfilled = value?.split(':').every((chunk) => chunk.length > 0);\n\n return {\n size,\n disabled,\n disablePortal,\n ['aria-hidden']: !valueFulfilled,\n meridiem: this.meridiem,\n onClick: this.handleMeridiemClick,\n };\n }\n\n render() {\n const STimePicker = Root;\n const { styles, Children, value, is12Hour } = this.asProps;\n const label = value\n ? `Time input, entered time is ${value} ${is12Hour ? this.meridiem : ''}`\n : `Time input, no time entered`;\n\n return sstyled(styles)(\n <STimePicker\n render={Input}\n aria-label={label}\n aria-valuenow={value || undefined}\n tabIndex={0}\n >\n <Children />\n </STimePicker>,\n );\n }\n}\n\nclass Separator extends Component {\n static defaultProps = {\n children: ':',\n };\n\n handlerClick = () => {\n if (this.asProps.hoursInputRef.current) {\n this.asProps.hoursInputRef.current?.focus();\n }\n };\n\n render() {\n const STimePickerSeparator = Root;\n return <STimePickerSeparator render={Box} onClick={this.handlerClick} aria-hidden=\"true\" />;\n }\n}\n\nconst TimePicker = createComponent(TimePickerRoot, {\n Hours,\n Minutes,\n Separator,\n Format,\n});\n\nexport default TimePicker;\n"],"mappings":"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"}
|
package/lib/es6/PickerFormat.js
CHANGED
|
@@ -42,9 +42,12 @@ var TimePickerFormat = /*#__PURE__*/function (_Component) {
|
|
|
42
42
|
meridiem = _this$asProps.meridiem,
|
|
43
43
|
styles = _this$asProps.styles;
|
|
44
44
|
var SPickerFormatText = 'span';
|
|
45
|
+
var label = "Time format ".concat(meridiem);
|
|
45
46
|
return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SPickerFormat, _ref2.cn("SPickerFormat", _objectSpread({}, _assignProps({
|
|
46
47
|
"type": "button",
|
|
47
|
-
"tag": "button"
|
|
48
|
+
"tag": "button",
|
|
49
|
+
"role": "switch",
|
|
50
|
+
"aria-label": label
|
|
48
51
|
}, _ref))), Children.origin ? /*#__PURE__*/React.createElement(Children, _ref2.cn("Children", {})) : /*#__PURE__*/React.createElement(SPickerFormatText, _ref2.cn("SPickerFormatText", {}), meridiem));
|
|
49
52
|
}
|
|
50
53
|
}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PickerFormat.js","names":["React","Component","sstyled","Root","Box","keyboardFocusEnhance","TimePickerFormat","SPickerFormat","asProps","Children","meridiem","styles","SPickerFormatText","origin"],"sources":["../../src/PickerFormat.jsx"],"sourcesContent":["import React from 'react';\nimport { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nclass TimePickerFormat extends Component {\n static enhance = [keyboardFocusEnhance()];\n render() {\n const SPickerFormat = Root;\n const { Children, meridiem, styles } = this.asProps;\n const SPickerFormatText = 'span';\n\n return sstyled(styles)(\n <SPickerFormat render={Box} type=\"button\" tag=\"button\">\n {Children.origin ? <Children /> : <SPickerFormatText>{meridiem}</SPickerFormatText>}\n </SPickerFormat>,\n );\n }\n}\n\nexport default TimePickerFormat;\n"],"mappings":";;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,OAApB,EAA6BC,IAA7B,QAAyC,eAAzC;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,oBAAP,MAAiC,kDAAjC;;IAEMC,gB;;;;;;;;;;;;;WAEJ,kBAAS;MAAA;MAAA;;MACP,IAAMC,aAAa,
|
|
1
|
+
{"version":3,"file":"PickerFormat.js","names":["React","Component","sstyled","Root","Box","keyboardFocusEnhance","TimePickerFormat","SPickerFormat","asProps","Children","meridiem","styles","SPickerFormatText","label","origin"],"sources":["../../src/PickerFormat.jsx"],"sourcesContent":["import React from 'react';\nimport { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nclass TimePickerFormat extends Component {\n static enhance = [keyboardFocusEnhance()];\n render() {\n const SPickerFormat = Root;\n const { Children, meridiem, styles } = this.asProps;\n const SPickerFormatText = 'span';\n\n const label = `Time format ${meridiem}`;\n\n return sstyled(styles)(\n <SPickerFormat render={Box} type=\"button\" tag=\"button\" role=\"switch\" aria-label={label}>\n {Children.origin ? <Children /> : <SPickerFormatText>{meridiem}</SPickerFormatText>}\n </SPickerFormat>,\n );\n }\n}\n\nexport default TimePickerFormat;\n"],"mappings":";;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,OAApB,EAA6BC,IAA7B,QAAyC,eAAzC;AACA,SAASC,GAAT,QAAoB,mBAApB;AACA,OAAOC,oBAAP,MAAiC,kDAAjC;;IAEMC,gB;;;;;;;;;;;;;WAEJ,kBAAS;MAAA;MAAA;;MACP,IAAMC,aAAa,GAOMH,GAPzB;MACA,oBAAuC,KAAKI,OAA5C;MAAA,IAAQC,QAAR,iBAAQA,QAAR;MAAA,IAAkBC,QAAlB,iBAAkBA,QAAlB;MAAA,IAA4BC,MAA5B,iBAA4BA,MAA5B;MACA,IAAMC,iBAAiB,GAAG,MAA1B;MAEA,IAAMC,KAAK,yBAAkBH,QAAlB,CAAX;MAEA,eAAOR,OAAO,CAACS,MAAD,CAAd,eACE,oBAAC,aAAD;QAAA,QAAiC,QAAjC;QAAA,OAA8C,QAA9C;QAAA,QAA4D,QAA5D;QAAA,cAAiFE;MAAjF,YACGJ,QAAQ,CAACK,MAAT,gBAAkB,oBAAC,QAAD,2BAAlB,gBAAiC,oBAAC,iBAAD,qCAAoBJ,QAApB,CADpC,CADF;IAKD;;;;EAd4BT,S;;gBAAzBK,gB,aACa,CAACD,oBAAoB,EAArB,C;;AAgBnB,eAAeC,gBAAf"}
|
package/lib/es6/PickerInput.js
CHANGED
|
@@ -21,7 +21,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
|
|
|
21
21
|
import React from 'react';
|
|
22
22
|
import Input from '@semcore/input';
|
|
23
23
|
import Select from '@semcore/select';
|
|
24
|
-
import { intOrDefault,
|
|
24
|
+
import { intOrDefault, withLeadingZero } from './TimePicker';
|
|
25
25
|
import { Component, sstyled, Root } from '@semcore/core';
|
|
26
26
|
import { callAllEventHandlers } from '@semcore/utils/lib/assignProps';
|
|
27
27
|
var MAP_FIELD_TO_TIME = {
|
|
@@ -64,7 +64,7 @@ var ItemPicker = /*#__PURE__*/function (_Component) {
|
|
|
64
64
|
|
|
65
65
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
66
66
|
|
|
67
|
-
_defineProperty(_assertThisInitialized(_this), "
|
|
67
|
+
_defineProperty(_assertThisInitialized(_this), "inputRef", /*#__PURE__*/React.createRef());
|
|
68
68
|
|
|
69
69
|
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
70
70
|
dirtyValue: undefined,
|
|
@@ -96,12 +96,6 @@ var ItemPicker = /*#__PURE__*/function (_Component) {
|
|
|
96
96
|
return _this.submitChanges(e);
|
|
97
97
|
});
|
|
98
98
|
|
|
99
|
-
_defineProperty(_assertThisInitialized(_this), "handleFocus", function () {
|
|
100
|
-
var _this$$input;
|
|
101
|
-
|
|
102
|
-
(_this$$input = _this.$input) === null || _this$$input === void 0 ? void 0 : _this$$input.current.select();
|
|
103
|
-
});
|
|
104
|
-
|
|
105
99
|
_defineProperty(_assertThisInitialized(_this), "handleKeyDown", function () {});
|
|
106
100
|
|
|
107
101
|
_defineProperty(_assertThisInitialized(_this), "handleSelect", function (value, e) {
|
|
@@ -179,21 +173,19 @@ var ItemPicker = /*#__PURE__*/function (_Component) {
|
|
|
179
173
|
"visible": visible,
|
|
180
174
|
"value": timeValue
|
|
181
175
|
})), /*#__PURE__*/React.createElement(SPickerInput, _ref2.cn("SPickerInput", _objectSpread({}, _assignProps({
|
|
182
|
-
"interaction": "focus",
|
|
183
176
|
"tag": Input.Value,
|
|
184
|
-
"
|
|
185
|
-
"aria-expanded": visible,
|
|
186
|
-
"ref": this.$input,
|
|
177
|
+
"ref": this.inputRef,
|
|
187
178
|
"size": size,
|
|
188
179
|
"disabled": disabled,
|
|
189
180
|
"neighborLocation": false,
|
|
190
181
|
"value": value,
|
|
191
|
-
"aria-label": "
|
|
182
|
+
"aria-label": "".concat(this.field, " field"),
|
|
183
|
+
"__excludeProps": ['aria-haspopup', 'aria-controls', 'aria-flowto', 'aria-expanded', 'aria-autocomplete', 'role'],
|
|
192
184
|
"onChange": this.handleChange,
|
|
193
185
|
"onBlur": this.handleBlur,
|
|
194
|
-
"onFocus": this.handleFocus,
|
|
195
186
|
"onKeyDown": this.handleKeyDown
|
|
196
187
|
}, _ref)))), /*#__PURE__*/React.createElement(Select.Menu, {
|
|
188
|
+
"aria-hidden": "true",
|
|
197
189
|
hMax: 180
|
|
198
190
|
}, getOptions(min, max, step)));
|
|
199
191
|
}
|
|
@@ -254,15 +246,11 @@ var Hours = /*#__PURE__*/function (_ItemPicker) {
|
|
|
254
246
|
}, {
|
|
255
247
|
key: "nextInput",
|
|
256
248
|
value: function nextInput() {
|
|
257
|
-
if (this
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
visible: false
|
|
263
|
-
});
|
|
264
|
-
$input.focus();
|
|
265
|
-
}
|
|
249
|
+
if (this.asProps.minutesInputRef.current) {
|
|
250
|
+
this.setState({
|
|
251
|
+
visible: false
|
|
252
|
+
});
|
|
253
|
+
this.asProps.minutesInputRef.current.focus();
|
|
266
254
|
}
|
|
267
255
|
}
|
|
268
256
|
}, {
|
|
@@ -330,15 +318,11 @@ var Minutes = /*#__PURE__*/function (_ItemPicker2) {
|
|
|
330
318
|
}, {
|
|
331
319
|
key: "prevFocus",
|
|
332
320
|
value: function prevFocus() {
|
|
333
|
-
if (this
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
visible: false
|
|
339
|
-
});
|
|
340
|
-
$input.focus();
|
|
341
|
-
}
|
|
321
|
+
if (this.asProps.hoursInputRef.current) {
|
|
322
|
+
this.setState({
|
|
323
|
+
visible: false
|
|
324
|
+
});
|
|
325
|
+
this.asProps.hoursInputRef.current.focus();
|
|
342
326
|
}
|
|
343
327
|
}
|
|
344
328
|
}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PickerInput.js","names":["React","Input","Select","intOrDefault","nextInput","prevInput","withLeadingZero","Component","sstyled","Root","callAllEventHandlers","MAP_FIELD_TO_TIME","hours","minutes","MAP_SIZE_SELECT","m","l","getOptions","min","max","step","length","Number","toFixed","options","Array","fill","numValue","map","i","index","value","String","ItemPicker","createRef","dirtyValue","undefined","visible","minMax","Math","e","stopPropagation","numberValue","NaN","isNaN","setState","slice","submitChanges","$input","current","select","dispatchOnChange","event","asProps","$onValueChange","field","state","parseValueWithMinMax","SPickerInput","Trigger","styles","onSelect","time","size","disabled","onVisibleChange","other","timeValue","handleSelect","handleVisibleChange","Value","handleChange","handleBlur","handleFocus","handleKeyDown","placeholder","Hours","currentTarget","keyCode","selectionStart","selectionEnd","preventDefault","is12Hour","focus","prevProps","prevState","Minutes","prevFocus"],"sources":["../../src/PickerInput.jsx"],"sourcesContent":["import React from 'react';\nimport Input from '@semcore/input';\nimport Select from '@semcore/select';\nimport { intOrDefault, nextInput, prevInput, withLeadingZero } from './TimePicker';\nimport { Component, sstyled, Root } from '@semcore/core';\nimport { callAllEventHandlers } from '@semcore/utils/lib/assignProps';\n\nconst MAP_FIELD_TO_TIME = {\n hours: 0,\n minutes: 1,\n};\n\nconst MAP_SIZE_SELECT = {\n m: 'm',\n l: 'l',\n};\n\nfunction getOptions(min, max, step = 1) {\n const length = Number(((max + 1 - min) / step).toFixed(0));\n const options = Array(length).fill('');\n let numValue = min;\n return options.map((i, index) => {\n numValue = index === 0 ? numValue : numValue + step;\n const value = withLeadingZero(String(numValue));\n return (\n <Select.Option value={value} key={value}>\n {value}\n </Select.Option>\n );\n });\n}\n\nclass ItemPicker extends Component {\n static defaultProps = {\n placeholder: '00',\n };\n\n $input = React.createRef();\n\n minMax() {\n return [];\n }\n\n state = {\n dirtyValue: undefined,\n visible: false,\n };\n\n parseValueWithMinMax = (value) => {\n const [min, max] = this.minMax();\n return String(Math.max(min, Math.min(max, value)));\n };\n\n dispatchOnChange(value, event) {\n this.setState({ dirtyValue: undefined });\n this.asProps.$onValueChange(value, this.field, event);\n }\n\n submitChanges(event) {\n let { dirtyValue } = this.state;\n if (dirtyValue !== undefined) {\n // if changes value\n if (dirtyValue) dirtyValue = this.parseValueWithMinMax(dirtyValue); // if not \"\"\n this.dispatchOnChange(dirtyValue, event);\n }\n }\n\n handleChange = (value, e) => {\n /* hide props for bubbling events */\n e.stopPropagation();\n const numberValue = intOrDefault(Number(value), NaN);\n\n if (!Number.isNaN(numberValue)) {\n this.setState({ dirtyValue: value.slice(-2) });\n }\n };\n\n handleBlur = (e) => this.submitChanges(e);\n\n handleFocus = () => {\n this.$input?.current.select();\n };\n\n /* rewrite method */\n handleKeyDown = () => {};\n\n handleSelect = (value, e) => {\n this.dispatchOnChange(value, e);\n };\n\n handleVisibleChange = (visible) => this.setState({ visible });\n\n render() {\n const SPickerInput = Root;\n const { styles, step, onSelect, time, size, disabled, onVisibleChange, ...other } =\n this.asProps;\n const { dirtyValue, visible } = this.state;\n const timeValue = time[MAP_FIELD_TO_TIME[this.field]];\n const value = dirtyValue === undefined ? timeValue : dirtyValue;\n const [min, max] = this.minMax();\n\n return sstyled(styles)(\n <Select\n {...other}\n interaction=\"focus\"\n size={size ? MAP_SIZE_SELECT[size] : false}\n onChange={callAllEventHandlers(onSelect, this.handleSelect)}\n onVisibleChange={callAllEventHandlers(onVisibleChange, this.handleVisibleChange)}\n visible={visible}\n value={timeValue}\n >\n <SPickerInput\n interaction=\"focus\"\n render={Select.Trigger}\n tag={Input.Value}\n aria-autocomplete={undefined}\n aria-expanded={visible}\n ref={this.$input}\n size={size}\n disabled={disabled}\n neighborLocation={false}\n value={value}\n aria-label={`Search ${this.field}`}\n onChange={this.handleChange}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onKeyDown={this.handleKeyDown}\n />\n <Select.Menu hMax={180}>{getOptions(min, max, step)}</Select.Menu>\n </Select>,\n );\n }\n}\n\nclass Hours extends ItemPicker {\n field = 'hours';\n\n minMax() {\n const { is12Hour } = this.asProps;\n if (is12Hour) {\n return [1, 12];\n } else {\n return [0, 23];\n }\n }\n\n nextInput() {\n if (this.$input.current) {\n const $input = nextInput(this.$input.current);\n if ($input) {\n this.setState({ visible: false });\n $input.focus();\n }\n }\n }\n\n handleKeyDown = (e) => {\n const { currentTarget } = e;\n if (e.keyCode === 13) this.submitChanges(e);\n if (e.keyCode === 39) {\n if (\n currentTarget.selectionStart >= currentTarget.value.length &&\n currentTarget.selectionStart === currentTarget.selectionEnd\n ) {\n e.preventDefault();\n this.nextInput();\n }\n }\n };\n\n componentDidUpdate(prevProps, prevState) {\n const { dirtyValue } = this.state;\n if (prevState.dirtyValue === undefined || dirtyValue === undefined) return;\n\n if (prevState.dirtyValue.length === 1 && dirtyValue.length === 2) {\n this.nextInput();\n }\n }\n}\n\nclass Minutes extends ItemPicker {\n field = 'minutes';\n\n minMax() {\n return [0, 59];\n }\n\n prevFocus() {\n if (this.$input.current) {\n const $input = prevInput(this.$input.current);\n if ($input) {\n this.setState({ visible: false });\n $input.focus();\n }\n }\n }\n\n handleKeyDown = (e) => {\n const { currentTarget } = e;\n if (e.keyCode === 13) this.submitChanges(e);\n if (e.keyCode === 37) {\n if (\n currentTarget.selectionStart <= 0 &&\n currentTarget.selectionStart === currentTarget.selectionEnd\n ) {\n e.preventDefault();\n this.prevFocus();\n }\n }\n if (e.keyCode === 8) {\n if (currentTarget.value.length === 0) {\n e.preventDefault();\n this.prevFocus();\n }\n }\n };\n}\n\nexport { Hours, Minutes };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PickerInput.js","names":["React","Input","Select","intOrDefault","withLeadingZero","Component","sstyled","Root","callAllEventHandlers","MAP_FIELD_TO_TIME","hours","minutes","MAP_SIZE_SELECT","m","l","getOptions","min","max","step","length","Number","toFixed","options","Array","fill","numValue","map","i","index","value","String","ItemPicker","createRef","dirtyValue","undefined","visible","minMax","Math","e","stopPropagation","numberValue","NaN","isNaN","setState","slice","submitChanges","dispatchOnChange","event","asProps","$onValueChange","field","state","parseValueWithMinMax","SPickerInput","Trigger","styles","onSelect","time","size","disabled","onVisibleChange","other","timeValue","handleSelect","handleVisibleChange","Value","inputRef","handleChange","handleBlur","handleKeyDown","placeholder","Hours","currentTarget","keyCode","selectionStart","selectionEnd","preventDefault","nextInput","is12Hour","minutesInputRef","current","focus","prevProps","prevState","Minutes","prevFocus","hoursInputRef"],"sources":["../../src/PickerInput.jsx"],"sourcesContent":["import React from 'react';\nimport Input from '@semcore/input';\nimport Select from '@semcore/select';\nimport { intOrDefault, withLeadingZero } from './TimePicker';\nimport { Component, sstyled, Root } from '@semcore/core';\nimport { callAllEventHandlers } from '@semcore/utils/lib/assignProps';\n\nconst MAP_FIELD_TO_TIME = {\n hours: 0,\n minutes: 1,\n};\n\nconst MAP_SIZE_SELECT = {\n m: 'm',\n l: 'l',\n};\n\nfunction getOptions(min, max, step = 1) {\n const length = Number(((max + 1 - min) / step).toFixed(0));\n const options = Array(length).fill('');\n let numValue = min;\n return options.map((i, index) => {\n numValue = index === 0 ? numValue : numValue + step;\n const value = withLeadingZero(String(numValue));\n return (\n <Select.Option value={value} key={value}>\n {value}\n </Select.Option>\n );\n });\n}\n\nclass ItemPicker extends Component {\n static defaultProps = {\n placeholder: '00',\n };\n\n inputRef = React.createRef();\n\n minMax() {\n return [];\n }\n\n state = {\n dirtyValue: undefined,\n visible: false,\n };\n\n parseValueWithMinMax = (value) => {\n const [min, max] = this.minMax();\n return String(Math.max(min, Math.min(max, value)));\n };\n\n dispatchOnChange(value, event) {\n this.setState({ dirtyValue: undefined });\n this.asProps.$onValueChange(value, this.field, event);\n }\n\n submitChanges(event) {\n let { dirtyValue } = this.state;\n if (dirtyValue !== undefined) {\n // if changes value\n if (dirtyValue) dirtyValue = this.parseValueWithMinMax(dirtyValue); // if not \"\"\n this.dispatchOnChange(dirtyValue, event);\n }\n }\n\n handleChange = (value, e) => {\n /* hide props for bubbling events */\n e.stopPropagation();\n const numberValue = intOrDefault(Number(value), NaN);\n\n if (!Number.isNaN(numberValue)) {\n this.setState({ dirtyValue: value.slice(-2) });\n }\n };\n\n handleBlur = (e) => this.submitChanges(e);\n\n /* rewrite method */\n handleKeyDown = () => {};\n\n handleSelect = (value, e) => {\n this.dispatchOnChange(value, e);\n };\n\n handleVisibleChange = (visible) => this.setState({ visible });\n\n render() {\n const SPickerInput = Root;\n const { styles, step, onSelect, time, size, disabled, onVisibleChange, ...other } =\n this.asProps;\n const { dirtyValue, visible } = this.state;\n const timeValue = time[MAP_FIELD_TO_TIME[this.field]];\n const value = dirtyValue === undefined ? timeValue : dirtyValue;\n const [min, max] = this.minMax();\n\n return sstyled(styles)(\n <Select\n {...other}\n interaction=\"focus\"\n size={size ? MAP_SIZE_SELECT[size] : false}\n onChange={callAllEventHandlers(onSelect, this.handleSelect)}\n onVisibleChange={callAllEventHandlers(onVisibleChange, this.handleVisibleChange)}\n visible={visible}\n value={timeValue}\n >\n <SPickerInput\n render={Select.Trigger}\n tag={Input.Value}\n ref={this.inputRef}\n size={size}\n disabled={disabled}\n neighborLocation={false}\n value={value}\n aria-label={`${this.field} field`}\n __excludeProps={[\n 'aria-haspopup',\n 'aria-controls',\n 'aria-flowto',\n 'aria-expanded',\n 'aria-autocomplete',\n 'role',\n ]}\n onChange={this.handleChange}\n onBlur={this.handleBlur}\n onKeyDown={this.handleKeyDown}\n />\n <Select.Menu aria-hidden=\"true\" hMax={180}>\n {getOptions(min, max, step)}\n </Select.Menu>\n </Select>,\n );\n }\n}\n\nclass Hours extends ItemPicker {\n field = 'hours';\n\n minMax() {\n const { is12Hour } = this.asProps;\n if (is12Hour) {\n return [1, 12];\n } else {\n return [0, 23];\n }\n }\n\n nextInput() {\n if (this.asProps.minutesInputRef.current) {\n this.setState({ visible: false });\n this.asProps.minutesInputRef.current.focus();\n }\n }\n\n handleKeyDown = (e) => {\n const { currentTarget } = e;\n if (e.keyCode === 13) this.submitChanges(e);\n if (e.keyCode === 39) {\n if (\n currentTarget.selectionStart >= currentTarget.value.length &&\n currentTarget.selectionStart === currentTarget.selectionEnd\n ) {\n e.preventDefault();\n this.nextInput();\n }\n }\n };\n\n componentDidUpdate(prevProps, prevState) {\n const { dirtyValue } = this.state;\n if (prevState.dirtyValue === undefined || dirtyValue === undefined) return;\n\n if (prevState.dirtyValue.length === 1 && dirtyValue.length === 2) {\n this.nextInput();\n }\n }\n}\n\nclass Minutes extends ItemPicker {\n field = 'minutes';\n\n minMax() {\n return [0, 59];\n }\n\n prevFocus() {\n if (this.asProps.hoursInputRef.current) {\n this.setState({ visible: false });\n this.asProps.hoursInputRef.current.focus();\n }\n }\n\n handleKeyDown = (e) => {\n const { currentTarget } = e;\n if (e.keyCode === 13) this.submitChanges(e);\n if (e.keyCode === 37) {\n if (\n currentTarget.selectionStart <= 0 &&\n currentTarget.selectionStart === currentTarget.selectionEnd\n ) {\n e.preventDefault();\n this.prevFocus();\n }\n }\n if (e.keyCode === 8) {\n if (currentTarget.value.length === 0) {\n e.preventDefault();\n this.prevFocus();\n }\n }\n };\n}\n\nexport { Hours, Minutes };\n"],"mappings":"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"}
|
package/lib/es6/TimePicker.js
CHANGED
|
@@ -30,22 +30,22 @@ var style = (
|
|
|
30
30
|
/*__reshadow_css_start__*/
|
|
31
31
|
_sstyled.insert(
|
|
32
32
|
/*__inner_css_start__*/
|
|
33
|
-
":root {\n\n /* DEPRECATED START\n Deprecated variables should never be used in\n components styles but preserved for backward\n compatibility if they used in projects\n like `<Badge bg=\"red\">alpha</Badge>`\n */\n /* DEPRECATED END */\n}\n\n.
|
|
33
|
+
":root {\n\n /* DEPRECATED START\n Deprecated variables should never be used in\n components styles but preserved for backward\n compatibility if they used in projects\n like `<Badge bg=\"red\">alpha</Badge>`\n */\n /* DEPRECATED END */\n}\n\n.___STimePicker_1vlmo_gg_ {\n position: relative;\n width: auto;\n}\n\n.___STimePicker_1vlmo_gg_.__disabled_1vlmo_gg_ {\n color: rgba(25, 27, 35, 0.3);\n cursor: default;\n}\n\n.___SPickerInput_1vlmo_gg_ {\n box-sizing: content-box;\n text-align: center;\n z-index: 1\n}\n\n.___SPickerInput_1vlmo_gg_.__placeholder_1vlmo_gg_ {\n text-overflow: initial;\n }\n\n.___SPickerInput_1vlmo_gg_._size_m_1vlmo_gg_ {\n width: 19px;\n}\n\n.___SPickerInput_1vlmo_gg_._size_l_1vlmo_gg_ {\n width: 21px;\n}\n\n.___SPickerFormat_1vlmo_gg_ {\n flex-shrink: 0;\n position: relative;\n display: inline-flex;\n padding: 0;\n white-space: nowrap;\n font-family: inherit;\n font-weight: 500;\n line-height: normal;\n text-decoration: none;\n align-items: center;\n border: 1px solid #c4c7cf;\n border-radius: 0 6px 6px 0;\n outline: 0;\n box-shadow: none;\n cursor: pointer;\n box-sizing: border-box;\n overflow: visible;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n touch-action: manipulation;\n -webkit-tap-highlight-color: transparent;\n color: #6c6e79;\n background-color: rgba(138, 142, 155, 0.1)\n}\n\n.___SPickerFormat_1vlmo_gg_:hover {\n color: #6c6e79;\n background-color: rgba(138, 142, 155, 0.2);\n }\n\n.___SPickerFormat_1vlmo_gg_:active,\n .___SPickerFormat_1vlmo_gg_.__active_1vlmo_gg_ {\n color: #6c6e79;\n background-color: rgba(138, 142, 155, 0.3);\n }\n\n.___SPickerFormat_1vlmo_gg_._size_m_1vlmo_gg_ {\n height: 28px;\n font-size: 14px;\n margin: 0 -1px 0 0\n}\n\n.___SPickerFormat_1vlmo_gg_._size_m_1vlmo_gg_ .___SPickerFormatText_1vlmo_gg_ {\n margin: 0 8px;\n }\n\n.___SPickerFormat_1vlmo_gg_._size_l_1vlmo_gg_ {\n height: 40px;\n font-size: 16px;\n margin: 0 -4px 0 0\n}\n\n.___SPickerFormat_1vlmo_gg_._size_l_1vlmo_gg_ .___SPickerFormatText_1vlmo_gg_ {\n margin: 0 12px;\n }\n\n.___SPickerFormat_1vlmo_gg_.__disabled_1vlmo_gg_ {\n opacity: 0.3;\n cursor: default;\n pointer-events: none;\n border-color: transparent transparent transparent #c4c7cf;\n}\n\n.___SPickerFormat_1vlmo_gg_.__keyboardFocused_1vlmo_gg_ {\n box-shadow: 0 0 0 3px rgba(0, 143, 248, 0.2);\n}\n\n.___STimePickerSeparator_1vlmo_gg_.__disabled_1vlmo_gg_ {\n opacity: 0.3;\n pointer-events: none;\n}\n"
|
|
34
34
|
/*__inner_css_end__*/
|
|
35
|
-
, "
|
|
35
|
+
, "1vlmo_gg_")
|
|
36
36
|
/*__reshadow_css_end__*/
|
|
37
37
|
, {
|
|
38
|
-
"__STimePicker": "
|
|
39
|
-
"_disabled": "
|
|
40
|
-
"__SPickerInput": "
|
|
41
|
-
"_placeholder": "
|
|
42
|
-
"_size_m": "
|
|
43
|
-
"_size_l": "
|
|
44
|
-
"__SPickerFormat": "
|
|
45
|
-
"_active": "
|
|
46
|
-
"__SPickerFormatText": "
|
|
47
|
-
"_keyboardFocused": "
|
|
48
|
-
"__STimePickerSeparator": "
|
|
38
|
+
"__STimePicker": "___STimePicker_1vlmo_gg_",
|
|
39
|
+
"_disabled": "__disabled_1vlmo_gg_",
|
|
40
|
+
"__SPickerInput": "___SPickerInput_1vlmo_gg_",
|
|
41
|
+
"_placeholder": "__placeholder_1vlmo_gg_",
|
|
42
|
+
"_size_m": "_size_m_1vlmo_gg_",
|
|
43
|
+
"_size_l": "_size_l_1vlmo_gg_",
|
|
44
|
+
"__SPickerFormat": "___SPickerFormat_1vlmo_gg_",
|
|
45
|
+
"_active": "__active_1vlmo_gg_",
|
|
46
|
+
"__SPickerFormatText": "___SPickerFormatText_1vlmo_gg_",
|
|
47
|
+
"_keyboardFocused": "__keyboardFocused_1vlmo_gg_",
|
|
48
|
+
"__STimePickerSeparator": "___STimePickerSeparator_1vlmo_gg_"
|
|
49
49
|
});
|
|
50
50
|
var MAP_MERIDIEM = {
|
|
51
51
|
AM: 'PM',
|
|
@@ -55,20 +55,6 @@ var MAP_FIELD_TO_TIME = {
|
|
|
55
55
|
hours: 0,
|
|
56
56
|
minutes: 1
|
|
57
57
|
};
|
|
58
|
-
export function nextInput(element) {
|
|
59
|
-
do {
|
|
60
|
-
element = element.nextElementSibling;
|
|
61
|
-
} while (element && element.tagName !== 'INPUT');
|
|
62
|
-
|
|
63
|
-
return element;
|
|
64
|
-
}
|
|
65
|
-
export function prevInput(element) {
|
|
66
|
-
do {
|
|
67
|
-
element = element.previousElementSibling;
|
|
68
|
-
} while (element && element.tagName !== 'INPUT');
|
|
69
|
-
|
|
70
|
-
return element;
|
|
71
|
-
}
|
|
72
58
|
export function intOrDefault(value) {
|
|
73
59
|
var def = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
74
60
|
var number = Number.parseInt(value);
|
|
@@ -129,6 +115,10 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
129
115
|
|
|
130
116
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
131
117
|
|
|
118
|
+
_defineProperty(_assertThisInitialized(_this), "hoursInputRef", /*#__PURE__*/React.createRef());
|
|
119
|
+
|
|
120
|
+
_defineProperty(_assertThisInitialized(_this), "minutesInputRef", /*#__PURE__*/React.createRef());
|
|
121
|
+
|
|
132
122
|
_defineProperty(_assertThisInitialized(_this), "_lastMeridiem", 'AM');
|
|
133
123
|
|
|
134
124
|
_defineProperty(_assertThisInitialized(_this), "handleValueChange", function (value, field, event) {
|
|
@@ -192,7 +182,9 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
192
182
|
size: size,
|
|
193
183
|
is12Hour: is12Hour,
|
|
194
184
|
disabled: disabled,
|
|
195
|
-
$onValueChange: _this.handleValueChange
|
|
185
|
+
$onValueChange: _this.handleValueChange,
|
|
186
|
+
minutesInputRef: _this.minutesInputRef,
|
|
187
|
+
hoursInputRef: _this.hoursInputRef
|
|
196
188
|
};
|
|
197
189
|
});
|
|
198
190
|
|
|
@@ -275,23 +267,28 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
275
267
|
key: "getSeparatorProps",
|
|
276
268
|
value: function getSeparatorProps() {
|
|
277
269
|
return {
|
|
278
|
-
disabled: this.asProps.disabled
|
|
270
|
+
disabled: this.asProps.disabled,
|
|
271
|
+
hoursInputRef: this.hoursInputRef
|
|
279
272
|
};
|
|
280
273
|
}
|
|
281
274
|
}, {
|
|
282
275
|
key: "getFormatProps",
|
|
283
276
|
value: function getFormatProps() {
|
|
277
|
+
var _ref4;
|
|
278
|
+
|
|
284
279
|
var _this$asProps2 = this.asProps,
|
|
285
280
|
size = _this$asProps2.size,
|
|
286
281
|
disabled = _this$asProps2.disabled,
|
|
287
|
-
disablePortal = _this$asProps2.disablePortal
|
|
288
|
-
|
|
282
|
+
disablePortal = _this$asProps2.disablePortal,
|
|
283
|
+
value = _this$asProps2.value;
|
|
284
|
+
var valueFulfilled = value === null || value === void 0 ? void 0 : value.split(':').every(function (chunk) {
|
|
285
|
+
return chunk.length > 0;
|
|
286
|
+
});
|
|
287
|
+
return _ref4 = {
|
|
289
288
|
size: size,
|
|
290
289
|
disabled: disabled,
|
|
291
|
-
disablePortal: disablePortal
|
|
292
|
-
|
|
293
|
-
onClick: this.handleMeridiemClick
|
|
294
|
-
};
|
|
290
|
+
disablePortal: disablePortal
|
|
291
|
+
}, _defineProperty(_ref4, 'aria-hidden', !valueFulfilled), _defineProperty(_ref4, "meridiem", this.meridiem), _defineProperty(_ref4, "onClick", this.handleMeridiemClick), _ref4;
|
|
295
292
|
}
|
|
296
293
|
}, {
|
|
297
294
|
key: "render",
|
|
@@ -302,8 +299,15 @@ var TimePickerRoot = /*#__PURE__*/function (_Component) {
|
|
|
302
299
|
var STimePicker = Input;
|
|
303
300
|
var _this$asProps3 = this.asProps,
|
|
304
301
|
styles = _this$asProps3.styles,
|
|
305
|
-
Children = _this$asProps3.Children
|
|
306
|
-
|
|
302
|
+
Children = _this$asProps3.Children,
|
|
303
|
+
value = _this$asProps3.value,
|
|
304
|
+
is12Hour = _this$asProps3.is12Hour;
|
|
305
|
+
var label = value ? "Time input, entered time is ".concat(value, " ").concat(is12Hour ? this.meridiem : '') : "Time input, no time entered";
|
|
306
|
+
return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(STimePicker, _ref3.cn("STimePicker", _objectSpread({}, _assignProps({
|
|
307
|
+
"aria-label": label,
|
|
308
|
+
"aria-valuenow": value || undefined,
|
|
309
|
+
"tabIndex": 0
|
|
310
|
+
}, _ref))), /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {})));
|
|
307
311
|
}
|
|
308
312
|
}]);
|
|
309
313
|
|
|
@@ -314,8 +318,8 @@ _defineProperty(TimePickerRoot, "displayName", 'TimePicker');
|
|
|
314
318
|
|
|
315
319
|
_defineProperty(TimePickerRoot, "style", style);
|
|
316
320
|
|
|
317
|
-
_defineProperty(TimePickerRoot, "defaultProps", function (
|
|
318
|
-
var is12Hour =
|
|
321
|
+
_defineProperty(TimePickerRoot, "defaultProps", function (_ref5) {
|
|
322
|
+
var is12Hour = _ref5.is12Hour;
|
|
319
323
|
return {
|
|
320
324
|
defaultValue: '',
|
|
321
325
|
size: 'm',
|
|
@@ -339,13 +343,11 @@ var Separator = /*#__PURE__*/function (_Component2) {
|
|
|
339
343
|
|
|
340
344
|
_this2 = _super2.call.apply(_super2, [this].concat(args));
|
|
341
345
|
|
|
342
|
-
_defineProperty(_assertThisInitialized(_this2), "$el", /*#__PURE__*/React.createRef());
|
|
343
|
-
|
|
344
346
|
_defineProperty(_assertThisInitialized(_this2), "handlerClick", function () {
|
|
345
|
-
if (_this2
|
|
346
|
-
var
|
|
347
|
+
if (_this2.asProps.hoursInputRef.current) {
|
|
348
|
+
var _this2$asProps$hoursI;
|
|
347
349
|
|
|
348
|
-
(
|
|
350
|
+
(_this2$asProps$hoursI = _this2.asProps.hoursInputRef.current) === null || _this2$asProps$hoursI === void 0 ? void 0 : _this2$asProps$hoursI.focus();
|
|
349
351
|
}
|
|
350
352
|
});
|
|
351
353
|
|
|
@@ -358,8 +360,8 @@ var Separator = /*#__PURE__*/function (_Component2) {
|
|
|
358
360
|
var _ref2 = this.asProps;
|
|
359
361
|
var STimePickerSeparator = Box;
|
|
360
362
|
return /*#__PURE__*/React.createElement(STimePickerSeparator, _assignProps2({
|
|
361
|
-
"
|
|
362
|
-
"
|
|
363
|
+
"onClick": this.handlerClick,
|
|
364
|
+
"aria-hidden": "true"
|
|
363
365
|
}, _ref2));
|
|
364
366
|
}
|
|
365
367
|
}]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimePicker.js","names":["React","createComponent","Component","sstyled","Root","Input","Box","Hours","Minutes","Format","MAP_MERIDIEM","AM","PM","MAP_FIELD_TO_TIME","hours","minutes","nextInput","element","nextElementSibling","tagName","prevInput","previousElementSibling","intOrDefault","value","def","number","Number","parseInt","isNaN","withLeadingZero","String","length","meridiemByHours","formatHoursTo12","nHours","NaN","formatHoursTo24","meridiem","TimePickerRoot","field","event","is12Hour","asProps","time","split","timeToValue","handlers","size","disabled","valueToTime","$onValueChange","handleValueChange","_getHoursAndMinutesProps","undefined","_lastMeridiem","disablePortal","onClick","handleMeridiemClick","STimePicker","styles","Children","style","defaultValue","children","Separator","createRef","$el","current","focus","STimePickerSeparator","handlerClick","TimePicker"],"sources":["../../src/TimePicker.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Input from '@semcore/input';\nimport { Box } from '@semcore/flex-box';\nimport { Hours, Minutes } from './PickerInput';\nimport Format from './PickerFormat';\n\nimport style from './style/time-picker.shadow.css';\n\nconst MAP_MERIDIEM = {\n AM: 'PM',\n PM: 'AM',\n};\nconst MAP_FIELD_TO_TIME = {\n hours: 0,\n minutes: 1,\n};\n\nexport function nextInput(element) {\n do {\n element = element.nextElementSibling;\n } while (element && element.tagName !== 'INPUT');\n return element;\n}\n\nexport function prevInput(element) {\n do {\n element = element.previousElementSibling;\n } while (element && element.tagName !== 'INPUT');\n return element;\n}\n\nexport function intOrDefault(value, def = 0) {\n const number = Number.parseInt(value);\n return Number.isNaN(number) ? def : number;\n}\n\nexport function withLeadingZero(value) {\n value = String(value);\n if (value.length === 1) return `0${value}`;\n return String(value);\n}\n\nexport function meridiemByHours(hours) {\n return hours >= 12 ? 'PM' : 'AM';\n}\n\nexport function formatHoursTo12(hours /* hours by 24 */) {\n const nHours = intOrDefault(hours, NaN); // if not (:00)\n if (Number.isNaN(nHours)) return hours;\n\n // if not (HH:00)\n if (nHours === 0) return 12; // 0 => 12 PM\n if (nHours > 12) return nHours - 12; // 22 => 12 PM\n\n return hours;\n}\n\nexport function formatHoursTo24(hours /* hours by 12 */, meridiem) {\n const nHours = intOrDefault(hours, NaN); // if not (:00)\n\n if (Number.isNaN(nHours)) return hours;\n\n if (meridiem === 'AM') {\n if (nHours === 12) return 0; // 12 AM => 0\n }\n\n if (meridiem === 'PM') {\n if (nHours < 12) return nHours + 12; // 10 PM => 22\n }\n\n return hours;\n}\n\nclass TimePickerRoot extends Component {\n static displayName = 'TimePicker';\n static style = style;\n static defaultProps = ({ is12Hour }) => ({\n defaultValue: '',\n size: 'm',\n children: (\n <>\n <TimePicker.Hours />\n <TimePicker.Separator />\n <TimePicker.Minutes />\n {is12Hour && <TimePicker.Format />}\n </>\n ),\n });\n\n _lastMeridiem = 'AM'; // default AM\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n get value() {\n const { value } = this.asProps;\n return value === null || value === undefined ? ':' : value;\n }\n\n get meridiem() {\n const { value } = this.asProps;\n const [hours = ''] = value.split(':');\n\n const nHours = intOrDefault(hours, NaN);\n\n if (!Number.isNaN(nHours)) {\n this._lastMeridiem = meridiemByHours(nHours);\n }\n\n return this._lastMeridiem;\n }\n\n valueToTime(value) {\n const { is12Hour } = this.asProps;\n let [hours = '', minutes = ''] = value.split(':');\n\n if (is12Hour) hours = formatHoursTo12(hours);\n\n hours = withLeadingZero(hours);\n minutes = withLeadingZero(minutes);\n\n return [hours, minutes];\n }\n\n timeToValue(time, meridiem) {\n const { is12Hour } = this.asProps;\n let [hours = '', minutes = ''] = time;\n\n hours = intOrDefault(hours, hours); // 03 => 3\n minutes = intOrDefault(minutes, minutes); // MM => MM\n\n if (is12Hour) hours = formatHoursTo24(hours, meridiem); // 12 PM -> 0\n\n return `${hours}:${minutes}`;\n }\n\n handleValueChange = (value, field, event) => {\n const { is12Hour } = this.asProps;\n const { meridiem } = this;\n\n let time;\n if (field) {\n time = this.value.split(':');\n time[MAP_FIELD_TO_TIME[field]] = value;\n } else {\n time = value.split(':');\n }\n\n let [hours = '', minutes = ''] = time;\n\n if (is12Hour) hours = String(formatHoursTo12(hours));\n\n value = this.timeToValue([hours, minutes], meridiem);\n this.handlers.value(value, event);\n };\n\n handleMeridiemClick = (event) => {\n const { is12Hour } = this.asProps;\n let { value, meridiem } = this;\n let [hours = '', minutes = ''] = value.split(':');\n\n if (is12Hour) hours = String(formatHoursTo12(hours));\n\n value = this.timeToValue([hours, minutes], MAP_MERIDIEM[meridiem]);\n this.handlers.value(value, event);\n };\n\n _getHoursAndMinutesProps = () => {\n const { is12Hour, size, disabled } = this.asProps;\n const time = this.valueToTime(this.value);\n\n return {\n time,\n size,\n is12Hour,\n disabled,\n $onValueChange: this.handleValueChange,\n };\n };\n\n getHoursProps = this._getHoursAndMinutesProps;\n getMinutesProps = this._getHoursAndMinutesProps;\n\n getSeparatorProps() {\n return {\n disabled: this.asProps.disabled,\n };\n }\n\n getFormatProps() {\n const { size, disabled, disablePortal } = this.asProps;\n return {\n size,\n disabled,\n disablePortal,\n meridiem: this.meridiem,\n onClick: this.handleMeridiemClick,\n };\n }\n\n render() {\n const STimePicker = Root;\n const { styles, Children } = this.asProps;\n\n return sstyled(styles)(\n <STimePicker render={Input}>\n <Children />\n </STimePicker>,\n );\n }\n}\n\nclass Separator extends Component {\n static defaultProps = {\n children: ':',\n };\n\n $el = React.createRef();\n\n handlerClick = () => {\n if (this.$el.current) {\n prevInput(this.$el.current)?.focus();\n }\n };\n\n render() {\n const STimePickerSeparator = Root;\n return <STimePickerSeparator render={Box} ref={this.$el} onClick={this.handlerClick} />;\n }\n}\n\nconst TimePicker = createComponent(TimePickerRoot, {\n Hours,\n Minutes,\n Separator,\n Format,\n});\n\nexport default TimePicker;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TimePicker.js","names":["React","createComponent","Component","sstyled","Root","Input","Box","Hours","Minutes","Format","MAP_MERIDIEM","AM","PM","MAP_FIELD_TO_TIME","hours","minutes","intOrDefault","value","def","number","Number","parseInt","isNaN","withLeadingZero","String","length","meridiemByHours","formatHoursTo12","nHours","NaN","formatHoursTo24","meridiem","TimePickerRoot","createRef","field","event","is12Hour","asProps","time","split","timeToValue","handlers","size","disabled","valueToTime","$onValueChange","handleValueChange","minutesInputRef","hoursInputRef","_getHoursAndMinutesProps","undefined","_lastMeridiem","disablePortal","valueFulfilled","every","chunk","handleMeridiemClick","STimePicker","styles","Children","label","style","defaultValue","children","Separator","current","focus","STimePickerSeparator","handlerClick","TimePicker"],"sources":["../../src/TimePicker.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Input from '@semcore/input';\nimport { Box } from '@semcore/flex-box';\nimport { Hours, Minutes } from './PickerInput';\nimport Format from './PickerFormat';\n\nimport style from './style/time-picker.shadow.css';\n\nconst MAP_MERIDIEM = {\n AM: 'PM',\n PM: 'AM',\n};\nconst MAP_FIELD_TO_TIME = {\n hours: 0,\n minutes: 1,\n};\n\nexport function intOrDefault(value, def = 0) {\n const number = Number.parseInt(value);\n return Number.isNaN(number) ? def : number;\n}\n\nexport function withLeadingZero(value) {\n value = String(value);\n if (value.length === 1) return `0${value}`;\n return String(value);\n}\n\nexport function meridiemByHours(hours) {\n return hours >= 12 ? 'PM' : 'AM';\n}\n\nexport function formatHoursTo12(hours /* hours by 24 */) {\n const nHours = intOrDefault(hours, NaN); // if not (:00)\n if (Number.isNaN(nHours)) return hours;\n\n // if not (HH:00)\n if (nHours === 0) return 12; // 0 => 12 PM\n if (nHours > 12) return nHours - 12; // 22 => 12 PM\n\n return hours;\n}\n\nexport function formatHoursTo24(hours /* hours by 12 */, meridiem) {\n const nHours = intOrDefault(hours, NaN); // if not (:00)\n\n if (Number.isNaN(nHours)) return hours;\n\n if (meridiem === 'AM') {\n if (nHours === 12) return 0; // 12 AM => 0\n }\n\n if (meridiem === 'PM') {\n if (nHours < 12) return nHours + 12; // 10 PM => 22\n }\n\n return hours;\n}\n\nclass TimePickerRoot extends Component {\n static displayName = 'TimePicker';\n static style = style;\n static defaultProps = ({ is12Hour }) => ({\n defaultValue: '',\n size: 'm',\n children: (\n <>\n <TimePicker.Hours />\n <TimePicker.Separator />\n <TimePicker.Minutes />\n {is12Hour && <TimePicker.Format />}\n </>\n ),\n });\n\n hoursInputRef = React.createRef();\n minutesInputRef = React.createRef();\n\n _lastMeridiem = 'AM'; // default AM\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n get value() {\n const { value } = this.asProps;\n return value === null || value === undefined ? ':' : value;\n }\n\n get meridiem() {\n const { value } = this.asProps;\n const [hours = ''] = value.split(':');\n\n const nHours = intOrDefault(hours, NaN);\n\n if (!Number.isNaN(nHours)) {\n this._lastMeridiem = meridiemByHours(nHours);\n }\n\n return this._lastMeridiem;\n }\n\n valueToTime(value) {\n const { is12Hour } = this.asProps;\n let [hours = '', minutes = ''] = value.split(':');\n\n if (is12Hour) hours = formatHoursTo12(hours);\n\n hours = withLeadingZero(hours);\n minutes = withLeadingZero(minutes);\n\n return [hours, minutes];\n }\n\n timeToValue(time, meridiem) {\n const { is12Hour } = this.asProps;\n let [hours = '', minutes = ''] = time;\n\n hours = intOrDefault(hours, hours); // 03 => 3\n minutes = intOrDefault(minutes, minutes); // MM => MM\n\n if (is12Hour) hours = formatHoursTo24(hours, meridiem); // 12 PM -> 0\n\n return `${hours}:${minutes}`;\n }\n\n handleValueChange = (value, field, event) => {\n const { is12Hour } = this.asProps;\n const { meridiem } = this;\n\n let time;\n if (field) {\n time = this.value.split(':');\n time[MAP_FIELD_TO_TIME[field]] = value;\n } else {\n time = value.split(':');\n }\n\n let [hours = '', minutes = ''] = time;\n\n if (is12Hour) hours = String(formatHoursTo12(hours));\n\n value = this.timeToValue([hours, minutes], meridiem);\n this.handlers.value(value, event);\n };\n\n handleMeridiemClick = (event) => {\n const { is12Hour } = this.asProps;\n let { value, meridiem } = this;\n let [hours = '', minutes = ''] = value.split(':');\n\n if (is12Hour) hours = String(formatHoursTo12(hours));\n\n value = this.timeToValue([hours, minutes], MAP_MERIDIEM[meridiem]);\n this.handlers.value(value, event);\n };\n\n _getHoursAndMinutesProps = () => {\n const { is12Hour, size, disabled } = this.asProps;\n const time = this.valueToTime(this.value);\n\n return {\n time,\n size,\n is12Hour,\n disabled,\n $onValueChange: this.handleValueChange,\n minutesInputRef: this.minutesInputRef,\n hoursInputRef: this.hoursInputRef,\n };\n };\n\n getHoursProps = this._getHoursAndMinutesProps;\n getMinutesProps = this._getHoursAndMinutesProps;\n\n getSeparatorProps() {\n return {\n disabled: this.asProps.disabled,\n hoursInputRef: this.hoursInputRef,\n };\n }\n\n getFormatProps() {\n const { size, disabled, disablePortal, value } = this.asProps;\n const valueFulfilled = value?.split(':').every((chunk) => chunk.length > 0);\n\n return {\n size,\n disabled,\n disablePortal,\n ['aria-hidden']: !valueFulfilled,\n meridiem: this.meridiem,\n onClick: this.handleMeridiemClick,\n };\n }\n\n render() {\n const STimePicker = Root;\n const { styles, Children, value, is12Hour } = this.asProps;\n const label = value\n ? `Time input, entered time is ${value} ${is12Hour ? this.meridiem : ''}`\n : `Time input, no time entered`;\n\n return sstyled(styles)(\n <STimePicker\n render={Input}\n aria-label={label}\n aria-valuenow={value || undefined}\n tabIndex={0}\n >\n <Children />\n </STimePicker>,\n );\n }\n}\n\nclass Separator extends Component {\n static defaultProps = {\n children: ':',\n };\n\n handlerClick = () => {\n if (this.asProps.hoursInputRef.current) {\n this.asProps.hoursInputRef.current?.focus();\n }\n };\n\n render() {\n const STimePickerSeparator = Root;\n return <STimePickerSeparator render={Box} onClick={this.handlerClick} aria-hidden=\"true\" />;\n }\n}\n\nconst TimePicker = createComponent(TimePickerRoot, {\n Hours,\n Minutes,\n Separator,\n Format,\n});\n\nexport default TimePicker;\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/time-picker",
|
|
3
3
|
"description": "Semrush TimePicker Component",
|
|
4
|
-
"version": "3.2.
|
|
4
|
+
"version": "3.2.5",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -9,11 +9,11 @@
|
|
|
9
9
|
"author": "UI-kit team <ui-kit-team@semrush.com>",
|
|
10
10
|
"license": "MIT",
|
|
11
11
|
"dependencies": {
|
|
12
|
-
"@semcore/utils": "^3.15",
|
|
13
|
-
"@semcore/flex-box": "^4",
|
|
14
12
|
"@semcore/button": "^4",
|
|
13
|
+
"@semcore/flex-box": "^4",
|
|
15
14
|
"@semcore/input": "^3.0.0",
|
|
16
|
-
"@semcore/select": "^3.0.0"
|
|
15
|
+
"@semcore/select": "^3.0.0",
|
|
16
|
+
"@semcore/utils": "^3.15"
|
|
17
17
|
},
|
|
18
18
|
"peerDependencies": {
|
|
19
19
|
"@semcore/core": "^1.11",
|
|
@@ -28,8 +28,10 @@
|
|
|
28
28
|
"directory": "semcore/time-picker"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
|
-
"@
|
|
32
|
-
"@
|
|
31
|
+
"@guidepup/playwright": "0.6.1",
|
|
32
|
+
"@playwright/test": "1.25.1",
|
|
33
|
+
"@semcore/jest-preset-ui": "1.0.0",
|
|
34
|
+
"@types/react": "18.0.21"
|
|
33
35
|
},
|
|
34
36
|
"scripts": {
|
|
35
37
|
"build": "pnpm semcore-builder --source=js",
|