@semcore/time-picker 16.2.0 → 16.2.1

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.
Files changed (74) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/lib/cjs/PickerFormat.js +81 -0
  3. package/lib/cjs/PickerFormat.js.map +1 -0
  4. package/lib/cjs/{component/PickerInput/PickerInput.js → PickerInput.js} +82 -72
  5. package/lib/cjs/PickerInput.js.map +1 -0
  6. package/lib/cjs/TimePicker.js +348 -0
  7. package/lib/cjs/TimePicker.js.map +1 -0
  8. package/lib/cjs/index.d.js +2 -0
  9. package/lib/cjs/index.d.js.map +1 -0
  10. package/lib/cjs/index.js +5 -6
  11. package/lib/cjs/index.js.map +1 -1
  12. package/lib/cjs/{component/PickerFormat/picker-format.shadow.css → style/time-picker.shadow.css} +56 -1
  13. package/lib/es6/PickerFormat.js +75 -0
  14. package/lib/es6/PickerFormat.js.map +1 -0
  15. package/lib/es6/{component/PickerInput/PickerInput.js → PickerInput.js} +82 -73
  16. package/lib/es6/PickerInput.js.map +1 -0
  17. package/lib/es6/TimePicker.js +339 -0
  18. package/lib/es6/TimePicker.js.map +1 -0
  19. package/lib/es6/index.d.js +2 -0
  20. package/lib/es6/index.d.js.map +1 -0
  21. package/lib/es6/index.js +2 -2
  22. package/lib/es6/index.js.map +1 -1
  23. package/lib/{esm/component/PickerFormat/picker-format.shadow.css → es6/style/time-picker.shadow.css} +56 -1
  24. package/lib/esm/PickerFormat.mjs +67 -0
  25. package/lib/esm/{component/PickerInput/PickerInput.mjs → PickerInput.mjs} +76 -75
  26. package/lib/esm/TimePicker.mjs +297 -0
  27. package/lib/esm/index.mjs +7 -3
  28. package/lib/{es6/component/PickerFormat/picker-format.shadow.css → esm/style/time-picker.shadow.css} +56 -1
  29. package/lib/types/index.d.ts +63 -2
  30. package/package.json +5 -5
  31. package/lib/cjs/component/PickerFormat/PickerFormat.js +0 -93
  32. package/lib/cjs/component/PickerFormat/PickerFormat.js.map +0 -1
  33. package/lib/cjs/component/PickerFormat/PickerFormat.type.js +0 -2
  34. package/lib/cjs/component/PickerFormat/PickerFormat.type.js.map +0 -1
  35. package/lib/cjs/component/PickerInput/PickerInput.js.map +0 -1
  36. package/lib/cjs/component/PickerInput/PickerInput.type.js +0 -2
  37. package/lib/cjs/component/PickerInput/PickerInput.type.js.map +0 -1
  38. package/lib/cjs/component/PickerInput/picker-input.shadow.css +0 -11
  39. package/lib/cjs/component/TimePicker/TimePicker.js +0 -254
  40. package/lib/cjs/component/TimePicker/TimePicker.js.map +0 -1
  41. package/lib/cjs/component/TimePicker/TimePicker.type.js +0 -2
  42. package/lib/cjs/component/TimePicker/TimePicker.type.js.map +0 -1
  43. package/lib/cjs/component/TimePicker/time-picker.shadow.css +0 -34
  44. package/lib/cjs/entity/TimePickerEntity.js +0 -101
  45. package/lib/cjs/entity/TimePickerEntity.js.map +0 -1
  46. package/lib/es6/component/PickerFormat/PickerFormat.js +0 -88
  47. package/lib/es6/component/PickerFormat/PickerFormat.js.map +0 -1
  48. package/lib/es6/component/PickerFormat/PickerFormat.type.js +0 -2
  49. package/lib/es6/component/PickerFormat/PickerFormat.type.js.map +0 -1
  50. package/lib/es6/component/PickerInput/PickerInput.js.map +0 -1
  51. package/lib/es6/component/PickerInput/PickerInput.type.js +0 -2
  52. package/lib/es6/component/PickerInput/PickerInput.type.js.map +0 -1
  53. package/lib/es6/component/PickerInput/picker-input.shadow.css +0 -11
  54. package/lib/es6/component/TimePicker/TimePicker.js +0 -250
  55. package/lib/es6/component/TimePicker/TimePicker.js.map +0 -1
  56. package/lib/es6/component/TimePicker/TimePicker.type.js +0 -2
  57. package/lib/es6/component/TimePicker/TimePicker.type.js.map +0 -1
  58. package/lib/es6/component/TimePicker/time-picker.shadow.css +0 -34
  59. package/lib/es6/entity/TimePickerEntity.js +0 -94
  60. package/lib/es6/entity/TimePickerEntity.js.map +0 -1
  61. package/lib/esm/component/PickerFormat/PickerFormat.mjs +0 -86
  62. package/lib/esm/component/PickerInput/picker-input.shadow.css +0 -11
  63. package/lib/esm/component/TimePicker/TimePicker.mjs +0 -233
  64. package/lib/esm/component/TimePicker/TimePicker.type.mjs +0 -1
  65. package/lib/esm/component/TimePicker/time-picker.shadow.css +0 -34
  66. package/lib/esm/entity/TimePickerEntity.mjs +0 -90
  67. package/lib/types/component/PickerFormat/PickerFormat.d.ts +0 -17
  68. package/lib/types/component/PickerFormat/PickerFormat.type.d.ts +0 -16
  69. package/lib/types/component/PickerInput/PickerInput.d.ts +0 -54
  70. package/lib/types/component/PickerInput/PickerInput.type.d.ts +0 -13
  71. package/lib/types/component/TimePicker/TimePicker.d.ts +0 -3
  72. package/lib/types/component/TimePicker/TimePicker.type.d.ts +0 -50
  73. package/lib/types/entity/TimePickerEntity.d.ts +0 -22
  74. package/lib/types/translations/__intergalactic-dynamic-locales.d.ts +0 -114
@@ -1,233 +0,0 @@
1
- import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
2
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
- import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
4
- import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
5
- import _createClass from "@babel/runtime/helpers/esm/createClass";
6
- import _callSuper from "@babel/runtime/helpers/esm/callSuper";
7
- import _inherits from "@babel/runtime/helpers/esm/inherits";
8
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
9
- import _applyDecs from "@babel/runtime/helpers/esm/applyDecs2311";
10
- import _identity from "@babel/runtime/helpers/esm/identity";
11
- import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
12
- import { ScreenReaderOnly, Box } from "@semcore/base-components";
13
- import propsObserver from "@semcore/core/lib/decorators/propsObserver";
14
- import reactive from "@semcore/core/lib/decorators/reactive";
15
- import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
16
- import Input from "@semcore/input";
17
- import React from "react";
18
- import TimePickerEntity from "../../entity/TimePickerEntity.mjs";
19
- import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
20
- import TimePickerFormat from "../PickerFormat/PickerFormat.mjs";
21
- import { Minutes, Hours } from "../PickerInput/PickerInput.mjs";
22
- var _Class, _TimePickerRoot3, _applyDecs2, _applyDecs2$e, _applyDecs2$c;
23
- var _initClass, _classDecs, _entityDecs, _init_entity, _init_extra_entity, _TimePickerRoot2, _ref5;
24
- /*!__reshadow-styles__:"./time-picker.shadow.css"*/
25
- var style = (
26
- /*__reshadow_css_start__*/
27
- (sstyled.insert(
28
- /*__inner_css_start__*/
29
- ".___STimePicker_1p1i0_gg_{position:relative;width:auto;outline:0}.___STimePicker_1p1i0_gg_ .___SPickerInput_1p1i0_gg_{box-sizing:content-box;text-align:center;z-index:1;height:1.5em}.___STimePicker_1p1i0_gg_ .___SPickerInput_1p1i0_gg_.__placeholder_1p1i0_gg_{text-overflow:initial}.___STimePicker_1p1i0_gg_ .___SPickerInput_1p1i0_gg_:focus{outline:0;background-color:var(--intergalactic-bg-highlight-focus, rgba(1, 79, 255, 0.116))}@supports (color:color(display-p3 0 0 0%)){.___STimePicker_1p1i0_gg_ .___SPickerInput_1p1i0_gg_:focus{background-color:var(--intergalactic-bg-highlight-focus, rgba(1, 79, 255, 0.116))}@media (color-gamut:p3){.___STimePicker_1p1i0_gg_ .___SPickerInput_1p1i0_gg_:focus{background-color:var(--intergalactic-bg-highlight-focus, color(display-p3 0.12361 0.30547 0.96332 / 0.116))}}}.___STimePicker_1p1i0_gg_.__disabled_1p1i0_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));cursor:default}@supports (color:color(display-p3 0 0 0%)){.___STimePicker_1p1i0_gg_.__disabled_1p1i0_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___STimePicker_1p1i0_gg_.__disabled_1p1i0_gg_{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}.___STimePickerSeparator_1p1i0_gg_{color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}.___STimePickerSeparator_1p1i0_gg_.__disabled_1p1i0_gg_{opacity:var(--intergalactic-disabled-opacity, 0.4);pointer-events:none}",
30
- /*__inner_css_end__*/
31
- "1p1i0_gg_"
32
- ), /*__reshadow_css_end__*/
33
- {
34
- "__STimePicker": "___STimePicker_1p1i0_gg_",
35
- "_disabled": "__disabled_1p1i0_gg_",
36
- "__STimePickerSeparator": "___STimePickerSeparator_1p1i0_gg_",
37
- "__SPickerInput": "___SPickerInput_1p1i0_gg_",
38
- "_placeholder": "__placeholder_1p1i0_gg_"
39
- })
40
- );
41
- _classDecs = [propsObserver(["value", "is12Hour"])];
42
- var _TimePickerRoot;
43
- new (_TimePickerRoot2 = (_ref5 = (_entityDecs = reactive(["meridiem"], function() {
44
- this.forceUpdate();
45
- }), "hoursInputRef"), _TimePickerRoot3 = /* @__PURE__ */ (function(_Component) {
46
- function TimePickerRoot() {
47
- var _this$props$value;
48
- var _this;
49
- _classCallCheck(this, TimePickerRoot);
50
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
51
- args[_key] = arguments[_key];
52
- }
53
- _this = _callSuper(this, TimePickerRoot, [].concat(args));
54
- _defineProperty(_this, _ref5, /* @__PURE__ */ React.createRef());
55
- _defineProperty(_this, "minutesInputRef", /* @__PURE__ */ React.createRef());
56
- _defineProperty(_this, "state", {
57
- ariaLabel: ""
58
- });
59
- _defineProperty(_this, "entity", _init_entity(_this, new TimePickerEntity((_this$props$value = _this.props.value) !== null && _this$props$value !== void 0 ? _this$props$value : _this.props.defaultValue, _this.props.is12Hour)));
60
- _defineProperty(_this, "handleValueChange", (_init_extra_entity(_this), function(value, field, event) {
61
- _this.entity[field] = value;
62
- _this.handlers.value(_this.entity.toString(), event);
63
- }));
64
- _defineProperty(_this, "handleMeridiemClick", function(event) {
65
- _this.entity.toggleMeridiem();
66
- _this.handlers.value(_this.entity.toString(), event);
67
- });
68
- _defineProperty(_this, "getCommonPickerInputProps", function() {
69
- var _this$asProps = _this.asProps, is12Hour = _this$asProps.is12Hour, size = _this$asProps.size, disabled = _this$asProps.disabled;
70
- return {
71
- size,
72
- is12Hour,
73
- disabled,
74
- $onValueChange: _this.handleValueChange,
75
- minutesInputRef: _this.minutesInputRef,
76
- hoursInputRef: _this.hoursInputRef
77
- };
78
- });
79
- _defineProperty(_this, "getHoursProps", function() {
80
- return _objectSpread(_objectSpread({}, _this.getCommonPickerInputProps()), {}, {
81
- time: _this.entity.hours,
82
- ariaLabel: _this.asProps.getI18nText("hours"),
83
- ref: _this.hoursInputRef
84
- });
85
- });
86
- _defineProperty(_this, "getMinutesProps", function() {
87
- return _objectSpread(_objectSpread({}, _this.getCommonPickerInputProps()), {}, {
88
- time: _this.entity.minutes,
89
- ariaLabel: _this.asProps.getI18nText("minutes"),
90
- ref: _this.minutesInputRef
91
- });
92
- });
93
- return _this;
94
- }
95
- _inherits(TimePickerRoot, _Component);
96
- return _createClass(TimePickerRoot, [{
97
- key: "componentDidMount",
98
- value: function componentDidMount() {
99
- var _document$querySelect;
100
- var _this$asProps2 = this.asProps, id = _this$asProps2.id, ariaDescribedBy = _this$asProps2["aria-describedby"];
101
- var selector = "[for=".concat(id, "]");
102
- var element = (_document$querySelect = document.querySelector(selector)) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("#".concat(ariaDescribedBy));
103
- if (element) {
104
- this.setState({
105
- ariaLabel: element.textContent
106
- });
107
- }
108
- }
109
- }, {
110
- key: "onPropsChange",
111
- value: function onPropsChange(changedProps) {
112
- var value = changedProps.value, is12Hour = changedProps.is12Hour;
113
- if (value !== void 0) {
114
- var _value$split = value.split(":"), _value$split2 = _slicedToArray(_value$split, 2), _value$split2$ = _value$split2[0], hours = _value$split2$ === void 0 ? "" : _value$split2$, _value$split2$2 = _value$split2[1], minutes = _value$split2$2 === void 0 ? "" : _value$split2$2;
115
- this.entity.hours = hours;
116
- this.entity.minutes = minutes;
117
- }
118
- if (is12Hour !== void 0) {
119
- this.entity.is12Hour = is12Hour;
120
- }
121
- }
122
- }, {
123
- key: "uncontrolledProps",
124
- value: function uncontrolledProps() {
125
- return {
126
- value: null
127
- };
128
- }
129
- }, {
130
- key: "getSeparatorProps",
131
- value: function getSeparatorProps() {
132
- return {
133
- disabled: this.asProps.disabled,
134
- hoursInputRef: this.hoursInputRef
135
- };
136
- }
137
- }, {
138
- key: "getFormatProps",
139
- value: function getFormatProps() {
140
- var _this$asProps3 = this.asProps, size = _this$asProps3.size, disabled = _this$asProps3.disabled, getI18nText = _this$asProps3.getI18nText;
141
- return {
142
- size,
143
- disabled,
144
- meridiem: this.entity.meridiem,
145
- onClick: this.handleMeridiemClick,
146
- getI18nText
147
- };
148
- }
149
- }, {
150
- key: "render",
151
- value: function render() {
152
- var _ref = this.asProps, _ref3;
153
- var STimePicker = Input;
154
- var _this$asProps4 = this.asProps, styles = _this$asProps4.styles, Children = _this$asProps4.Children, value = _this$asProps4.value, is12Hour = _this$asProps4.is12Hour, getI18nText = _this$asProps4.getI18nText, id = _this$asProps4.id;
155
- var time = "".concat(this.entity.hours, ":").concat(this.entity.minutes);
156
- var meridiem = is12Hour ? this.entity.meridiem : "";
157
- var label = value ? "".concat(this.state.ariaLabel, " ").concat(getI18nText("title", {
158
- time,
159
- meridiem
160
- })) : "".concat(this.state.ariaLabel, " ").concat(getI18nText("titleEmpty"));
161
- return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(STimePicker, _ref3.cn("STimePicker", _objectSpread({}, assignProps({
162
- "role": "group",
163
- "aria-label": label,
164
- "__excludeProps": ["value", "id"]
165
- }, _ref))), /* @__PURE__ */ React.createElement(Children, _ref3.cn("Children", {}))), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref3.cn("ScreenReaderOnly", {
166
- "tag": "input",
167
- "tabIndex": -1,
168
- "id": id,
169
- "aria-hidden": true,
170
- "value": "".concat(time, " ").concat(meridiem)
171
- })));
172
- }
173
- }]);
174
- })(Component), _applyDecs2 = _applyDecs(_TimePickerRoot3, _classDecs, [[_entityDecs, 0, "entity"]], 0, void 0, Component), _applyDecs2$e = _slicedToArray(_applyDecs2.e, 2), _init_entity = _applyDecs2$e[0], _init_extra_entity = _applyDecs2$e[1], _applyDecs2$c = _slicedToArray(_applyDecs2.c, 2), _TimePickerRoot = _applyDecs2$c[0], _initClass = _applyDecs2$c[1], _TimePickerRoot3), _Class = /* @__PURE__ */ (function(_identity2) {
175
- function _Class2() {
176
- var _this2;
177
- _classCallCheck(this, _Class2);
178
- _this2 = _callSuper(this, _Class2, [_TimePickerRoot]), _defineProperty(_assertThisInitialized(_this2), "displayName", "TimePicker"), _defineProperty(_assertThisInitialized(_this2), "style", style), _defineProperty(_assertThisInitialized(_this2), "enhance", [i18nEnhance(localizedMessages)]), _defineProperty(_assertThisInitialized(_this2), "defaultProps", function(_ref6) {
179
- var is12Hour = _ref6.is12Hour;
180
- return {
181
- defaultValue: "",
182
- size: "m",
183
- children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TimePicker.Hours, null), /* @__PURE__ */ React.createElement(TimePicker.Separator, null), /* @__PURE__ */ React.createElement(TimePicker.Minutes, null), is12Hour && /* @__PURE__ */ React.createElement(TimePicker.Format, null)),
184
- locale: "en"
185
- };
186
- }), _initClass();
187
- return _this2;
188
- }
189
- _inherits(_Class2, _identity2);
190
- return _createClass(_Class2);
191
- })(_identity), _defineProperty(_Class, _TimePickerRoot2, void 0), _Class)();
192
- var Separator = /* @__PURE__ */ (function(_Component2) {
193
- function Separator2() {
194
- var _this3;
195
- _classCallCheck(this, Separator2);
196
- for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
197
- args[_key2] = arguments[_key2];
198
- }
199
- _this3 = _callSuper(this, Separator2, [].concat(args));
200
- _defineProperty(_this3, "handlerClick", function() {
201
- if (_this3.asProps.hoursInputRef.current) {
202
- var _this3$asProps$hoursI;
203
- (_this3$asProps$hoursI = _this3.asProps.hoursInputRef.current) === null || _this3$asProps$hoursI === void 0 || _this3$asProps$hoursI.focus();
204
- }
205
- });
206
- return _this3;
207
- }
208
- _inherits(Separator2, _Component2);
209
- return _createClass(Separator2, [{
210
- key: "render",
211
- value: function render() {
212
- var _ref2 = this.asProps, _ref4;
213
- var STimePickerSeparator = Box;
214
- var styles = this.asProps.styles;
215
- return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(STimePickerSeparator, _ref4.cn("STimePickerSeparator", _objectSpread({}, assignProps({
216
- "onClick": this.handlerClick,
217
- "aria-hidden": "true"
218
- }, _ref2))));
219
- }
220
- }]);
221
- })(Component);
222
- _defineProperty(Separator, "defaultProps", {
223
- children: ":"
224
- });
225
- var TimePicker = createComponent(_TimePickerRoot, {
226
- Hours,
227
- Minutes,
228
- Separator,
229
- Format: TimePickerFormat
230
- });
231
- export {
232
- TimePicker as default
233
- };
@@ -1,34 +0,0 @@
1
- STimePicker {
2
- position: relative;
3
- width: auto;
4
- outline: none;
5
-
6
- SPickerInput {
7
- box-sizing: content-box;
8
- text-align: center;
9
- z-index: 1;
10
- height: 1.5em;
11
-
12
- &[placeholder] {
13
- text-overflow: initial;
14
- }
15
- &:focus {
16
- outline: none;
17
- background-color: var(--intergalactic-bg-highlight-focus, oklch(0.524 0.266 263.1 / 0.116));
18
- }
19
- }
20
- }
21
-
22
- STimePicker[disabled] {
23
- color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
24
- cursor: default;
25
- }
26
-
27
- STimePickerSeparator {
28
- color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
29
- }
30
-
31
- STimePickerSeparator[disabled] {
32
- opacity: var(--intergalactic-disabled-opacity, 0.4);
33
- pointer-events: none;
34
- }
@@ -1,90 +0,0 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
3
- import _createClass from "@babel/runtime/helpers/esm/createClass";
4
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
5
- var TimePickerEntity = /* @__PURE__ */ (function() {
6
- function TimePickerEntity2() {
7
- var value = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : ":";
8
- var is12Hour = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
9
- _classCallCheck(this, TimePickerEntity2);
10
- _defineProperty(this, "_hours", "");
11
- _defineProperty(this, "_minutes", "");
12
- _defineProperty(this, "_is12Hour", void 0);
13
- _defineProperty(this, "_meridiem", "AM");
14
- var _value$split = value.split(":"), _value$split2 = _slicedToArray(_value$split, 2), _value$split2$ = _value$split2[0], hours = _value$split2$ === void 0 ? "" : _value$split2$, _value$split2$2 = _value$split2[1], minutes = _value$split2$2 === void 0 ? "" : _value$split2$2;
15
- this._is12Hour = is12Hour;
16
- this._hours = hours;
17
- this._minutes = minutes;
18
- }
19
- return _createClass(TimePickerEntity2, [{
20
- key: "meridiem",
21
- get: function get() {
22
- return this._meridiem;
23
- },
24
- set: function set(newMeridiem) {
25
- this._meridiem = newMeridiem;
26
- }
27
- }, {
28
- key: "hours",
29
- get: function get() {
30
- return this._is12Hour ? this.formatHoursTo12(this._hours) : this.formatHoursTo24(this._hours);
31
- },
32
- set: function set(newHours) {
33
- this._hours = newHours;
34
- }
35
- }, {
36
- key: "minutes",
37
- get: function get() {
38
- return this._minutes && this.withLeadingZero(this._minutes);
39
- },
40
- set: function set(newMinutes) {
41
- this._minutes = newMinutes;
42
- }
43
- }, {
44
- key: "is12Hour",
45
- set: function set(newIs12Hour) {
46
- this._is12Hour = newIs12Hour;
47
- }
48
- }, {
49
- key: "withLeadingZero",
50
- value: function withLeadingZero(value) {
51
- return String(value).padStart(2, "0");
52
- }
53
- }, {
54
- key: "formatHoursTo12",
55
- value: function formatHoursTo12(hours) {
56
- var numberHours = Number.parseInt(hours, 10);
57
- if (Number.isNaN(numberHours)) return hours;
58
- if (numberHours === 0) {
59
- return "12";
60
- } else if (numberHours > 12) {
61
- return this.withLeadingZero(numberHours - 12);
62
- }
63
- return this.withLeadingZero(numberHours);
64
- }
65
- }, {
66
- key: "formatHoursTo24",
67
- value: function formatHoursTo24(hours) {
68
- var numberHours = Number.parseInt(hours, 10);
69
- if (Number.isNaN(numberHours)) return hours;
70
- if (this.meridiem === "AM") {
71
- return this.withLeadingZero(numberHours === 12 ? 0 : numberHours);
72
- }
73
- return this.withLeadingZero(numberHours < 12 ? numberHours + 12 : numberHours);
74
- }
75
- }, {
76
- key: "toggleMeridiem",
77
- value: function toggleMeridiem() {
78
- this.meridiem = this._meridiem === "AM" ? "PM" : "AM";
79
- }
80
- }, {
81
- key: "toString",
82
- value: function toString() {
83
- var hours = this._is12Hour ? this.formatHoursTo24(this.hours) : this.hours;
84
- return "".concat(hours, ":").concat(this.minutes);
85
- }
86
- }]);
87
- })();
88
- export {
89
- TimePickerEntity as default
90
- };
@@ -1,17 +0,0 @@
1
- import { Component } from '@semcore/core';
2
- import React from 'react';
3
- import type { TimePickerFormatProps, TimePickerFormatPropsInternal } from './PickerFormat.type';
4
- declare class TimePickerFormat extends Component<TimePickerFormatProps, typeof TimePickerFormat.enhance, {}, TimePickerFormatPropsInternal> {
5
- static style: {
6
- [key: string]: string;
7
- };
8
- static enhance: readonly [(props: any) => {
9
- uid: ReturnType<typeof import("@semcore/core/lib/utils/uniqueID").useUID>;
10
- }];
11
- state: {
12
- changedFormatNotice: string;
13
- };
14
- handleClick: () => void;
15
- render(): React.ReactNode;
16
- }
17
- export default TimePickerFormat;
@@ -1,16 +0,0 @@
1
- import type { BoxProps } from '@semcore/base-components';
2
- import type { useI18n } from '@semcore/core/lib/utils/enhances/WithI18n';
3
- import type { TimePickerMeridiem } from '../TimePicker/TimePicker.type';
4
- export type TimePickerFormatProps = BoxProps & {};
5
- export type TimePickerFormatPropsInternal = {
6
- /** @Internal */
7
- getI18nText: ReturnType<typeof useI18n>;
8
- /** @Internal */
9
- size: 'm' | 'l';
10
- /** @Internal */
11
- disabled: boolean;
12
- /** @Internal */
13
- meridiem: TimePickerMeridiem;
14
- /** @Internal */
15
- onClick: (event: React.SyntheticEvent) => void;
16
- };
@@ -1,54 +0,0 @@
1
- import { Component } from '@semcore/core';
2
- import React from 'react';
3
- import type { PickerInputMinMax, PickerInputProps } from './PickerInput.type';
4
- import type { TimePickerField } from '../TimePicker/TimePicker.type';
5
- type State = {
6
- dirtyValue?: string;
7
- visible: boolean;
8
- };
9
- declare abstract class AbstractPickerInput extends Component<PickerInputProps, [], {}, {}, State> {
10
- static style: {
11
- [key: string]: string;
12
- };
13
- static defaultProps: (_: PickerInputProps) => {
14
- placeholder: string;
15
- offset: number[];
16
- };
17
- state: State;
18
- inputRef: React.RefObject<unknown>;
19
- abstract get field(): TimePickerField;
20
- abstract get minMax(): PickerInputMinMax;
21
- abstract handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void;
22
- parseValueWithMinMax: (value: string) => string;
23
- dispatchOnChange(value: string, event: React.SyntheticEvent): void;
24
- submitChanges(event: React.SyntheticEvent): void;
25
- handleChange: (value: string, event: React.SyntheticEvent) => void;
26
- handleBlur: (event: React.SyntheticEvent) => void;
27
- handleSelect: (value: string, event: React.SyntheticEvent) => void;
28
- handleVisibleChange: (visible: boolean) => void;
29
- render(): React.ReactNode;
30
- }
31
- declare class Hours extends AbstractPickerInput {
32
- static defaultProps: (props: PickerInputProps) => {
33
- ml: number | undefined;
34
- placeholder: string;
35
- offset: number[];
36
- };
37
- get field(): TimePickerField;
38
- get minMax(): PickerInputMinMax;
39
- focusNext(): void;
40
- handleKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
41
- componentDidUpdate(_: PickerInputProps, prevState: State): void;
42
- }
43
- declare class Minutes extends AbstractPickerInput {
44
- static defaultProps: (props: PickerInputProps) => {
45
- mr: number | undefined;
46
- placeholder: string;
47
- offset: number[];
48
- };
49
- get field(): TimePickerField;
50
- get minMax(): PickerInputMinMax;
51
- focusPrev(): void;
52
- handleKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
53
- }
54
- export { Hours, Minutes };
@@ -1,13 +0,0 @@
1
- import type { SelectProps } from '@semcore/select';
2
- import type { TimePickerField, TimePickerItemProps } from '../TimePicker/TimePicker.type';
3
- export type PickerInputProps = SelectProps & TimePickerItemProps & {
4
- time: string;
5
- size?: 'm' | 'l';
6
- is12Hour?: boolean;
7
- disabled?: boolean;
8
- $onValueChange: (value: string, field: TimePickerField, event: React.SyntheticEvent) => void;
9
- minutesInputRef: React.RefObject<HTMLElement>;
10
- hoursInputRef: React.RefObject<HTMLElement>;
11
- ariaLabel: string;
12
- };
13
- export type PickerInputMinMax = [number, number];
@@ -1,3 +0,0 @@
1
- import type { TimePickerComponent } from './TimePicker.type';
2
- declare const TimePicker: TimePickerComponent;
3
- export default TimePicker;
@@ -1,50 +0,0 @@
1
- import type { Box } from '@semcore/base-components';
2
- import type { PropGetterFn, Intergalactic } from '@semcore/core';
3
- import type { InputProps, InputValueProps } from '@semcore/input';
4
- import type { TimePickerFormatProps } from '../PickerFormat/PickerFormat.type';
5
- export type TimePickerProps = Omit<InputProps, 'size'> & {
6
- /** Time in the hh:mm format */
7
- value?: string;
8
- /** Default value if `value` property is not provided */
9
- defaultValue?: string;
10
- /** The event responses upon time changing */
11
- onChange?: (time: string, event?: React.SyntheticEvent) => void;
12
- /** In charge of the component blocking */
13
- disabled?: boolean;
14
- /** Control size
15
- * @default m */
16
- size?: 'm' | 'l';
17
- /** 12-hour time format */
18
- is12Hour?: boolean;
19
- /** Specifies the locale for i18n support */
20
- locale?: string;
21
- };
22
- export type TimePickerSeparatorProps = {
23
- /** @Internal */
24
- hoursInputRef: React.RefObject<HTMLElement>;
25
- /** @Internal */
26
- disabled?: boolean;
27
- };
28
- export type TimePickerItemProps = InputValueProps & {
29
- /** Step for changing of the values in the dropdown list */
30
- step?: number;
31
- };
32
- export type TimePickerContext = {
33
- getHoursProps: PropGetterFn;
34
- getFormatProps: PropGetterFn;
35
- getMinutesProps: PropGetterFn;
36
- getSeparatorProps: PropGetterFn;
37
- };
38
- export type TimePickerHandlers = {
39
- value: (value: string) => void;
40
- };
41
- export type TimePickerMeridiem = 'AM' | 'PM';
42
- export type TimePickerField = 'hours' | 'minutes';
43
- export type TimePickerComponent = Intergalactic.Component<'div', TimePickerProps, TimePickerContext, [
44
- handlers: TimePickerHandlers
45
- ]> & {
46
- Hours: Intergalactic.Component<'div', TimePickerItemProps>;
47
- Minutes: Intergalactic.Component<'div', TimePickerItemProps>;
48
- Separator: typeof Box;
49
- Format: Intergalactic.Component<'div', TimePickerFormatProps>;
50
- };
@@ -1,22 +0,0 @@
1
- import type { TimePickerMeridiem } from '../component/TimePicker/TimePicker.type';
2
- declare class TimePickerEntity {
3
- private _hours;
4
- private _minutes;
5
- private _is12Hour;
6
- private _meridiem;
7
- constructor(value?: string, // should be in the format 'HH:mm'
8
- is12Hour?: boolean);
9
- get meridiem(): TimePickerMeridiem;
10
- get hours(): string;
11
- get minutes(): string;
12
- set is12Hour(newIs12Hour: boolean);
13
- set hours(newHours: string);
14
- set minutes(newMinutes: string);
15
- private set meridiem(value);
16
- private withLeadingZero;
17
- private formatHoursTo12;
18
- private formatHoursTo24;
19
- toggleMeridiem(): void;
20
- toString(): string;
21
- }
22
- export default TimePickerEntity;
@@ -1,114 +0,0 @@
1
- export declare const localizedMessages: {
2
- de: {
3
- title: string;
4
- titleEmpty: string;
5
- hours: string;
6
- minutes: string;
7
- formatToggler: string;
8
- changedFormatNotice: string;
9
- };
10
- en: {
11
- title: string;
12
- titleEmpty: string;
13
- hours: string;
14
- minutes: string;
15
- formatToggler: string;
16
- changedFormatNotice: string;
17
- };
18
- es: {
19
- title: string;
20
- titleEmpty: string;
21
- hours: string;
22
- minutes: string;
23
- formatToggler: string;
24
- changedFormatNotice: string;
25
- };
26
- fr: {
27
- title: string;
28
- titleEmpty: string;
29
- hours: string;
30
- minutes: string;
31
- formatToggler: string;
32
- changedFormatNotice: string;
33
- };
34
- it: {
35
- title: string;
36
- titleEmpty: string;
37
- hours: string;
38
- minutes: string;
39
- formatToggler: string;
40
- changedFormatNotice: string;
41
- };
42
- ja: {
43
- title: string;
44
- titleEmpty: string;
45
- hours: string;
46
- minutes: string;
47
- formatToggler: string;
48
- changedFormatNotice: string;
49
- };
50
- ko: {
51
- title: string;
52
- titleEmpty: string;
53
- hours: string;
54
- minutes: string;
55
- formatToggler: string;
56
- changedFormatNotice: string;
57
- };
58
- nl: {
59
- title: string;
60
- titleEmpty: string;
61
- hours: string;
62
- minutes: string;
63
- formatToggler: string;
64
- changedFormatNotice: string;
65
- };
66
- pt: {
67
- title: string;
68
- titleEmpty: string;
69
- hours: string;
70
- minutes: string;
71
- formatToggler: string;
72
- changedFormatNotice: string;
73
- };
74
- tr: {
75
- title: string;
76
- titleEmpty: string;
77
- hours: string;
78
- minutes: string;
79
- formatToggler: string;
80
- changedFormatNotice: string;
81
- };
82
- vi: {
83
- title: string;
84
- titleEmpty: string;
85
- hours: string;
86
- minutes: string;
87
- formatToggler: string;
88
- changedFormatNotice: string;
89
- };
90
- zh: {
91
- title: string;
92
- titleEmpty: string;
93
- hours: string;
94
- minutes: string;
95
- formatToggler: string;
96
- changedFormatNotice: string;
97
- };
98
- pl: {
99
- title: string;
100
- titleEmpty: string;
101
- hours: string;
102
- minutes: string;
103
- formatToggler: string;
104
- changedFormatNotice: string;
105
- };
106
- sv: {
107
- title: string;
108
- titleEmpty: string;
109
- hours: string;
110
- minutes: string;
111
- formatToggler: string;
112
- changedFormatNotice: string;
113
- };
114
- };