@semcore/time-picker 4.52.2-prerelease.0 → 4.53.0-prerelease.0

package/lib/es6/component/TimePicker/TimePicker.js

@@ -0,0 +1,250 @@
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _callSuper from "@babel/runtime/helpers/callSuper";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _applyDecs from "@babel/runtime/helpers/applyDecs2311";
+import _identity from "@babel/runtime/helpers/identity";
+import { sstyled as _sstyled } from "@semcore/core";
+import { assignProps as _assignProps2 } from "@semcore/core";
+import { assignProps as _assignProps } from "@semcore/core";
+var _Class, _TimePickerRoot3, _applyDecs2, _applyDecs2$e, _applyDecs2$c;
+var _initClass, _classDecs, _entityDecs, _init_entity, _init_extra_entity, _TimePickerRoot2, _ref5;
+import { Box, ScreenReaderOnly } from '@semcore/base-components';
+import { createComponent, Component, sstyled, Root } from '@semcore/core';
+import propsObserver from '@semcore/core/lib/decorators/propsObserver';
+import reactive from '@semcore/core/lib/decorators/reactive';
+import i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';
+import Input from '@semcore/input';
+import React from 'react';
+/*!__reshadow-styles__:"./time-picker.shadow.css"*/
+var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___STimePicker_1p8j0_gg_{position:relative;width:auto;outline:0}.___STimePicker_1p8j0_gg_ .___SPickerInput_1p8j0_gg_{box-sizing:content-box;text-align:center;z-index:1;height:1.5em}.___STimePicker_1p8j0_gg_ .___SPickerInput_1p8j0_gg_.__placeholder_1p8j0_gg_{text-overflow:initial}.___STimePicker_1p8j0_gg_ .___SPickerInput_1p8j0_gg_:focus{outline:0;background-color:var(--intergalactic-bg-highlight-focus, rgb(231, 234, 251))}.___STimePicker_1p8j0_gg_.__disabled_1p8j0_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));cursor:default}@supports (color:color(display-p3 0 0 0%)){.___STimePicker_1p8j0_gg_.__disabled_1p8j0_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___STimePicker_1p8j0_gg_.__disabled_1p8j0_gg_{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}.___STimePickerSeparator_1p8j0_gg_{color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}.___STimePickerSeparator_1p8j0_gg_.__disabled_1p8j0_gg_{opacity:var(--intergalactic-disabled-opacity, 0.4);pointer-events:none}", /*__inner_css_end__*/"1p8j0_gg_"),
+/*__reshadow_css_end__*/
+{
+  "__STimePicker": "___STimePicker_1p8j0_gg_",
+  "_disabled": "__disabled_1p8j0_gg_",
+  "__STimePickerSeparator": "___STimePickerSeparator_1p8j0_gg_",
+  "__SPickerInput": "___SPickerInput_1p8j0_gg_",
+  "_placeholder": "__placeholder_1p8j0_gg_"
+});
+import TimePickerEntity from '../../entity/TimePickerEntity';
+import { localizedMessages } from '../../translations/__intergalactic-dynamic-locales';
+import Format from '../PickerFormat/PickerFormat';
+import { Hours, Minutes } from '../PickerInput/PickerInput';
+_classDecs = [propsObserver(['value', 'is12Hour'])];
+var _TimePickerRoot;
+new (_TimePickerRoot2 = (_ref5 = (_entityDecs = reactive(['meridiem'], function () {
+  this.forceUpdate();
+}), "hoursInputRef"), _TimePickerRoot3 = /*#__PURE__*/function (_Component) {
+  function TimePickerRoot() {
+    var _this$props$value;
+    var _this;
+    _classCallCheck(this, TimePickerRoot);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, TimePickerRoot, [].concat(args));
+    _defineProperty(_this, _ref5, /*#__PURE__*/React.createRef());
+    _defineProperty(_this, "minutesInputRef", /*#__PURE__*/React.createRef());
+    _defineProperty(_this, "state", {
+      ariaLabel: ''
+    });
+    _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)));
+    _defineProperty(_this, "handleValueChange", (_init_extra_entity(_this), function (value, field, event) {
+      _this.entity[field] = value;
+      _this.handlers.value(_this.entity.toString(), event);
+    }));
+    _defineProperty(_this, "handleMeridiemClick", function (event) {
+      _this.entity.toggleMeridiem();
+      _this.handlers.value(_this.entity.toString(), event);
+    });
+    _defineProperty(_this, "getCommonPickerInputProps", function () {
+      var _this$asProps = _this.asProps,
+        is12Hour = _this$asProps.is12Hour,
+        size = _this$asProps.size,
+        disabled = _this$asProps.disabled;
+      return {
+        size: size,
+        is12Hour: is12Hour,
+        disabled: disabled,
+        $onValueChange: _this.handleValueChange,
+        minutesInputRef: _this.minutesInputRef,
+        hoursInputRef: _this.hoursInputRef
+      };
+    });
+    _defineProperty(_this, "getHoursProps", function () {
+      return _objectSpread(_objectSpread({}, _this.getCommonPickerInputProps()), {}, {
+        time: _this.entity.hours,
+        ariaLabel: _this.asProps.getI18nText('hours'),
+        ref: _this.hoursInputRef
+      });
+    });
+    _defineProperty(_this, "getMinutesProps", function () {
+      return _objectSpread(_objectSpread({}, _this.getCommonPickerInputProps()), {}, {
+        time: _this.entity.minutes,
+        ariaLabel: _this.asProps.getI18nText('minutes'),
+        ref: _this.minutesInputRef
+      });
+    });
+    return _this;
+  }
+  _inherits(TimePickerRoot, _Component);
+  return _createClass(TimePickerRoot, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var _document$querySelect;
+      var _this$asProps2 = this.asProps,
+        id = _this$asProps2.id,
+        ariaDescribedBy = _this$asProps2['aria-describedby'];
+      var selector = "[for=".concat(id, "]");
+      var element = (_document$querySelect = document.querySelector(selector)) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("#".concat(ariaDescribedBy));
+      if (element) {
+        this.setState({
+          ariaLabel: element.textContent
+        });
+      }
+    }
+  }, {
+    key: "onPropsChange",
+    value: function onPropsChange(changedProps) {
+      var value = changedProps.value,
+        is12Hour = changedProps.is12Hour;
+      if (value !== undefined) {
+        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;
+        this.entity.hours = hours;
+        this.entity.minutes = minutes;
+      }
+      if (is12Hour !== undefined) {
+        this.entity.is12Hour = is12Hour;
+      }
+    }
+  }, {
+    key: "uncontrolledProps",
+    value: function uncontrolledProps() {
+      return {
+        value: null
+      };
+    }
+  }, {
+    key: "getSeparatorProps",
+    value: function getSeparatorProps() {
+      return {
+        disabled: this.asProps.disabled,
+        hoursInputRef: this.hoursInputRef
+      };
+    }
+  }, {
+    key: "getFormatProps",
+    value: function getFormatProps() {
+      var _this$asProps3 = this.asProps,
+        size = _this$asProps3.size,
+        disabled = _this$asProps3.disabled,
+        getI18nText = _this$asProps3.getI18nText;
+      return {
+        size: size,
+        disabled: disabled,
+        meridiem: this.entity.meridiem,
+        onClick: this.handleMeridiemClick,
+        getI18nText: getI18nText
+      };
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _ref = this.asProps,
+        _ref3;
+      var STimePicker = Input;
+      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;
+      var time = "".concat(this.entity.hours, ":").concat(this.entity.minutes);
+      var meridiem = is12Hour ? this.entity.meridiem : '';
+      var label = value ? "".concat(this.state.ariaLabel, " ").concat(getI18nText('title', {
+        time: time,
+        meridiem: meridiem
+      })) : "".concat(this.state.ariaLabel, " ").concat(getI18nText('titleEmpty'));
+      return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(STimePicker, _ref3.cn("STimePicker", _objectSpread({}, _assignProps({
+        "role": 'group',
+        "aria-label": label,
+        "__excludeProps": ['value', 'id']
+      }, _ref))), /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {}))), /*#__PURE__*/React.createElement(ScreenReaderOnly, _ref3.cn("ScreenReaderOnly", {
+        "tag": 'input',
+        "tabIndex": -1,
+        "id": id,
+        "aria-hidden": true,
+        "value": "".concat(time, " ").concat(meridiem)
+      })));
+    }
+  }]);
+}(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) {
+  function _Class() {
+    var _this2;
+    _classCallCheck(this, _Class);
+    _this2 = _callSuper(this, _Class, [_TimePickerRoot]), _defineProperty(_assertThisInitialized(_this2), "displayName", 'TimePicker'), _defineProperty(_assertThisInitialized(_this2), "style", style), _defineProperty(_assertThisInitialized(_this2), "enhance", [i18nEnhance(localizedMessages)]), _defineProperty(_assertThisInitialized(_this2), "defaultProps", function (_ref6) {
+      var is12Hour = _ref6.is12Hour;
+      return {
+        defaultValue: '',
+        size: 'm',
+        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)),
+        locale: 'en'
+      };
+    }), _initClass();
+    return _this2;
+  }
+  _inherits(_Class, _identity2);
+  return _createClass(_Class);
+}(_identity), _defineProperty(_Class, _TimePickerRoot2, void 0), _Class)();
+var Separator = /*#__PURE__*/function (_Component2) {
+  function Separator() {
+    var _this3;
+    _classCallCheck(this, Separator);
+    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      args[_key2] = arguments[_key2];
+    }
+    _this3 = _callSuper(this, Separator, [].concat(args));
+    _defineProperty(_this3, "handlerClick", function () {
+      if (_this3.asProps.hoursInputRef.current) {
+        var _this3$asProps$hoursI;
+        (_this3$asProps$hoursI = _this3.asProps.hoursInputRef.current) === null || _this3$asProps$hoursI === void 0 || _this3$asProps$hoursI.focus();
+      }
+    });
+    return _this3;
+  }
+  _inherits(Separator, _Component2);
+  return _createClass(Separator, [{
+    key: "render",
+    value: function render() {
+      var _ref2 = this.asProps,
+        _ref4;
+      var STimePickerSeparator = Box;
+      var styles = this.asProps.styles;
+      return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(STimePickerSeparator, _ref4.cn("STimePickerSeparator", _objectSpread({}, _assignProps2({
+        "onClick": this.handlerClick,
+        "aria-hidden": 'true'
+      }, _ref2))));
+    }
+  }]);
+}(Component);
+_defineProperty(Separator, "defaultProps", {
+  children: ':'
+});
+var TimePicker = createComponent(_TimePickerRoot, {
+  Hours: Hours,
+  Minutes: Minutes,
+  Separator: Separator,
+  Format: Format
+});
+export default TimePicker;
+//# sourceMappingURL=TimePicker.js.map

package/lib/es6/component/TimePicker/TimePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePicker.js","names":["Box","ScreenReaderOnly","createComponent","Component","sstyled","Root","propsObserver","reactive","i18nEnhance","Input","React","style","_sstyled","insert","TimePickerEntity","localizedMessages","Format","Hours","Minutes","_classDecs","_TimePickerRoot","_TimePickerRoot2","_ref5","_entityDecs","forceUpdate","_TimePickerRoot3","_Component","TimePickerRoot","_this$props$value","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","concat","_defineProperty","createRef","ariaLabel","_init_entity","props","value","defaultValue","is12Hour","_init_extra_entity","field","event","entity","handlers","toString","toggleMeridiem","_this$asProps","asProps","size","disabled","$onValueChange","handleValueChange","minutesInputRef","hoursInputRef","_objectSpread","getCommonPickerInputProps","time","hours","getI18nText","ref","minutes","_inherits","_createClass","key","componentDidMount","_document$querySelect","_this$asProps2","id","ariaDescribedBy","selector","element","document","querySelector","setState","textContent","onPropsChange","changedProps","undefined","_value$split","split","_value$split2","_slicedToArray","_value$split2$","_value$split2$2","uncontrolledProps","getSeparatorProps","getFormatProps","_this$asProps3","meridiem","onClick","handleMeridiemClick","render","_ref","_ref3","STimePicker","_this$asProps4","styles","Children","label","state","createElement","Fragment","cn","_assignProps","_applyDecs2","_applyDecs","_applyDecs2$e","e","_applyDecs2$c","c","_initClass","_Class","_identity2","_this2","_assertThisInitialized","_ref6","children","TimePicker","Separator","locale","_identity","_Component2","_this3","_len2","_key2","current","_this3$asProps$hoursI","focus","_ref2","_ref4","STimePickerSeparator","_assignProps2","handlerClick"],"sources":["../../../../src/component/TimePicker/TimePicker.tsx"],"sourcesContent":["import { Box, ScreenReaderOnly } from '@semcore/base-components';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport propsObserver from '@semcore/core/lib/decorators/propsObserver';\nimport reactive from '@semcore/core/lib/decorators/reactive';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport Input from '@semcore/input';\nimport React from 'react';\n\nimport style from './time-picker.shadow.css';\nimport type {\n  TimePickerComponent,\n  TimePickerProps,\n  TimePickerField,\n  TimePickerSeparatorProps,\n} from './TimePicker.type';\nimport TimePickerEntity from '../../entity/TimePickerEntity';\nimport { localizedMessages } from '../../translations/__intergalactic-dynamic-locales';\nimport Format from '../PickerFormat/PickerFormat';\nimport { Hours, Minutes } from '../PickerInput/PickerInput';\n\n@propsObserver(['value', 'is12Hour'])\nclass TimePickerRoot extends Component<TimePickerProps, typeof TimePickerRoot.enhance, { value: null }> {\n  static displayName = 'TimePicker';\n  static style = style;\n  static enhance = [i18nEnhance(localizedMessages)] as const;\n  static defaultProps = ({ is12Hour }: TimePickerProps) => ({\n    defaultValue: '',\n    size: 'm',\n    children: (\n      <>\n        <TimePicker.Hours />\n        <TimePicker.Separator />\n        <TimePicker.Minutes />\n        {is12Hour && <TimePicker.Format />}\n      </>\n    ),\n    locale: 'en',\n  });\n\n  hoursInputRef = React.createRef<HTMLElement>();\n  minutesInputRef = React.createRef<HTMLElement>();\n\n  state = {\n    ariaLabel: '',\n  };\n\n  componentDidMount() {\n    const { id, 'aria-describedby': ariaDescribedBy } = this.asProps;\n    const selector = `[for=${id}]`;\n\n    const element = document.querySelector(selector) ?? document.querySelector(`#${ariaDescribedBy}`);\n\n    if (element) {\n      this.setState({ ariaLabel: element.textContent });\n    }\n  }\n\n  @reactive(['meridiem'], function () {\n    this.forceUpdate();\n  })\n  readonly entity = new TimePickerEntity(this.props.value ?? this.props.defaultValue, this.props.is12Hour);\n\n  onPropsChange(changedProps: TimePickerProps) {\n    const { value, is12Hour } = changedProps;\n\n    if (value !== undefined) {\n      const [hours = '', minutes = ''] = value.split(':');\n\n      this.entity.hours = hours;\n      this.entity.minutes = minutes;\n    }\n\n    if (is12Hour !== undefined) {\n      this.entity.is12Hour = is12Hour;\n    }\n  }\n\n  uncontrolledProps() {\n    return {\n      value: null,\n    };\n  }\n\n  handleValueChange = (value: string, field: TimePickerField, event: React.SyntheticEvent) => {\n    this.entity[field] = value;\n\n    this.handlers.value(this.entity.toString(), event);\n  };\n\n  handleMeridiemClick = (event: React.SyntheticEvent) => {\n    this.entity.toggleMeridiem();\n\n    this.handlers.value(this.entity.toString(), event);\n  };\n\n  private getCommonPickerInputProps = () => {\n    const { is12Hour, size, disabled } = this.asProps;\n\n    return {\n      size,\n      is12Hour,\n      disabled,\n      $onValueChange: this.handleValueChange,\n      minutesInputRef: this.minutesInputRef,\n      hoursInputRef: this.hoursInputRef,\n    };\n  };\n\n  getHoursProps = () => {\n    return {\n      ...this.getCommonPickerInputProps(),\n      time: this.entity.hours,\n      ariaLabel: this.asProps.getI18nText('hours'),\n      ref: this.hoursInputRef,\n    };\n  };\n\n  getMinutesProps = () => {\n    return {\n      ...this.getCommonPickerInputProps(),\n      time: this.entity.minutes,\n      ariaLabel: this.asProps.getI18nText('minutes'),\n      ref: this.minutesInputRef,\n    };\n  };\n\n  getSeparatorProps() {\n    return {\n      disabled: this.asProps.disabled,\n      hoursInputRef: this.hoursInputRef,\n    };\n  }\n\n  getFormatProps() {\n    const { size, disabled, getI18nText } = this.asProps;\n    return {\n      size,\n      disabled,\n      meridiem: this.entity.meridiem,\n      onClick: this.handleMeridiemClick,\n      getI18nText,\n    };\n  }\n\n  render() {\n    const STimePicker = Root;\n    const { styles, Children, value, is12Hour, getI18nText, id } = this.asProps;\n\n    const time = `${this.entity.hours}:${this.entity.minutes}`;\n    const meridiem = is12Hour ? this.entity.meridiem : '';\n\n    const label = value\n      ? `${this.state.ariaLabel} ${getI18nText('title', {\n        time,\n        meridiem,\n      })}`\n      : `${this.state.ariaLabel} ${getI18nText('titleEmpty')}`;\n\n    return sstyled(styles)(\n      <>\n        <STimePicker render={Input} role='group' aria-label={label} __excludeProps={['value', 'id']}>\n          <Children />\n        </STimePicker>\n        <ScreenReaderOnly tag='input' tabIndex={-1} id={id} aria-hidden={true} value={`${time} ${meridiem}`} />\n      </>,\n    );\n  }\n}\nclass Separator extends Component<TimePickerSeparatorProps> {\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    const { styles } = this.asProps;\n    return sstyled(styles)(<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}) as TimePickerComponent;\n\nexport default TimePicker;\n"],"mappings":";;;;;;;;;;;;;;;AAAA,SAASA,GAAG,EAAEC,gBAAgB,QAAQ,0BAA0B;AAChE,SAASC,eAAe,EAAEC,SAAS,EAAEC,OAAO,EAAEC,IAAI,QAAQ,eAAe;AACzE,OAAOC,aAAa,MAAM,4CAA4C;AACtE,OAAOC,QAAQ,MAAM,uCAAuC;AAC5D,OAAOC,WAAW,MAAM,8CAA8C;AACtE,OAAOC,KAAK,MAAM,gBAAgB;AAClC,OAAOC,KAAK,MAAM,OAAO;AAAC;AAAA,IAAAC,KAAA,8BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAS1B,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,SAASC,iBAAiB,QAAQ,oDAAoD;AACtF,OAAOC,MAAM,MAAM,8BAA8B;AACjD,SAASC,KAAK,EAAEC,OAAO,QAAQ,4BAA4B;AAACC,UAAA,IAE3Db,aAAa,CAAC,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;AAAA,IAAAc,eAAA;AAAA,KAAAC,gBAAA,IAAAC,KAAA,IAAAC,WAAA,GAqClChB,QAAQ,CAAC,CAAC,UAAU,CAAC,EAAE,YAAY;EAClC,IAAI,CAACiB,WAAW,CAAC,CAAC;AACpB,CAAC,CAAC,oBAAAC,gBAAA,0BAAAC,UAAA;EAAA,SAAAC,eAAA;IAAA,IAAAC,iBAAA;IAAA,IAAAC,KAAA;IAAAC,eAAA,OAAAH,cAAA;IAAA,SAAAI,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;MAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA;IAAA;IAAAP,KAAA,GAAAQ,UAAA,OAAAV,cAAA,KAAAW,MAAA,CAAAJ,IAAA;IAAAK,eAAA,CAAAV,KAAA,EAAAP,KAAA,eApBcZ,KAAK,CAAC8B,SAAS,CAAc,CAAC;IAAAD,eAAA,CAAAV,KAAA,kCAC5BnB,KAAK,CAAC8B,SAAS,CAAc,CAAC;IAAAD,eAAA,CAAAV,KAAA,WAExC;MACNY,SAAS,EAAE;IACb,CAAC;IAAAF,eAAA,CAAAV,KAAA,YAAAa,YAAA,CAAAb,KAAA,EAgBiB,IAAIf,gBAAgB,EAAAc,iBAAA,GAACC,KAAA,CAAKc,KAAK,CAACC,KAAK,cAAAhB,iBAAA,cAAAA,iBAAA,GAAIC,KAAA,CAAKc,KAAK,CAACE,YAAY,EAAEhB,KAAA,CAAKc,KAAK,CAACG,QAAQ,CAAC;IAAAP,eAAA,CAAAV,KAAA,wBAAAkB,kBAAA,CAAAlB,KAAA,GAuBpF,UAACe,KAAa,EAAEI,KAAsB,EAAEC,KAA2B,EAAK;MAC1FpB,KAAA,CAAKqB,MAAM,CAACF,KAAK,CAAC,GAAGJ,KAAK;MAE1Bf,KAAA,CAAKsB,QAAQ,CAACP,KAAK,CAACf,KAAA,CAAKqB,MAAM,CAACE,QAAQ,CAAC,CAAC,EAAEH,KAAK,CAAC;IACpD,CAAC;IAAAV,eAAA,CAAAV,KAAA,yBAEqB,UAACoB,KAA2B,EAAK;MACrDpB,KAAA,CAAKqB,MAAM,CAACG,cAAc,CAAC,CAAC;MAE5BxB,KAAA,CAAKsB,QAAQ,CAACP,KAAK,CAACf,KAAA,CAAKqB,MAAM,CAACE,QAAQ,CAAC,CAAC,EAAEH,KAAK,CAAC;IACpD,CAAC;IAAAV,eAAA,CAAAV,KAAA,+BAEmC,YAAM;MACxC,IAAAyB,aAAA,GAAqCzB,KAAA,CAAK0B,OAAO;QAAzCT,QAAQ,GAAAQ,aAAA,CAARR,QAAQ;QAAEU,IAAI,GAAAF,aAAA,CAAJE,IAAI;QAAEC,QAAQ,GAAAH,aAAA,CAARG,QAAQ;MAEhC,OAAO;QACLD,IAAI,EAAJA,IAAI;QACJV,QAAQ,EAARA,QAAQ;QACRW,QAAQ,EAARA,QAAQ;QACRC,cAAc,EAAE7B,KAAA,CAAK8B,iBAAiB;QACtCC,eAAe,EAAE/B,KAAA,CAAK+B,eAAe;QACrCC,aAAa,EAAEhC,KAAA,CAAKgC;MACtB,CAAC;IACH,CAAC;IAAAtB,eAAA,CAAAV,KAAA,mBAEe,YAAM;MACpB,OAAAiC,aAAA,CAAAA,aAAA,KACKjC,KAAA,CAAKkC,yBAAyB,CAAC,CAAC;QACnCC,IAAI,EAAEnC,KAAA,CAAKqB,MAAM,CAACe,KAAK;QACvBxB,SAAS,EAAEZ,KAAA,CAAK0B,OAAO,CAACW,WAAW,CAAC,OAAO,CAAC;QAC5CC,GAAG,EAAEtC,KAAA,CAAKgC;MAAa;IAE3B,CAAC;IAAAtB,eAAA,CAAAV,KAAA,qBAEiB,YAAM;MACtB,OAAAiC,aAAA,CAAAA,aAAA,KACKjC,KAAA,CAAKkC,yBAAyB,CAAC,CAAC;QACnCC,IAAI,EAAEnC,KAAA,CAAKqB,MAAM,CAACkB,OAAO;QACzB3B,SAAS,EAAEZ,KAAA,CAAK0B,OAAO,CAACW,WAAW,CAAC,SAAS,CAAC;QAC9CC,GAAG,EAAEtC,KAAA,CAAK+B;MAAe;IAE7B,CAAC;IAAA,OAAA/B,KAAA;EAAA;EAAAwC,SAAA,CAAA1C,cAAA,EAAAD,UAAA;EAAA,OAAA4C,YAAA,CAAA3C,cAAA;IAAA4C,GAAA;IAAA3B,KAAA,EA9ED,SAAA4B,iBAAiBA,CAAA,EAAG;MAAA,IAAAC,qBAAA;MAClB,IAAAC,cAAA,GAAoD,IAAI,CAACnB,OAAO;QAAxDoB,EAAE,GAAAD,cAAA,CAAFC,EAAE;QAAsBC,eAAe,GAAAF,cAAA,CAAnC,kBAAkB;MAC9B,IAAMG,QAAQ,WAAAvC,MAAA,CAAWqC,EAAE,MAAG;MAE9B,IAAMG,OAAO,IAAAL,qBAAA,GAAGM,QAAQ,CAACC,aAAa,CAACH,QAAQ,CAAC,cAAAJ,qBAAA,cAAAA,qBAAA,GAAIM,QAAQ,CAACC,aAAa,KAAA1C,MAAA,CAAKsC,eAAe,CAAE,CAAC;MAEjG,IAAIE,OAAO,EAAE;QACX,IAAI,CAACG,QAAQ,CAAC;UAAExC,SAAS,EAAEqC,OAAO,CAACI;QAAY,CAAC,CAAC;MACnD;IACF;EAAC;IAAAX,GAAA;IAAA3B,KAAA,EAOD,SAAAuC,aAAaA,CAACC,YAA6B,EAAE;MAC3C,IAAQxC,KAAK,GAAewC,YAAY,CAAhCxC,KAAK;QAAEE,QAAQ,GAAKsC,YAAY,CAAzBtC,QAAQ;MAEvB,IAAIF,KAAK,KAAKyC,SAAS,EAAE;QACvB,IAAAC,YAAA,GAAmC1C,KAAK,CAAC2C,KAAK,CAAC,GAAG,CAAC;UAAAC,aAAA,GAAAC,cAAA,CAAAH,YAAA;UAAAI,cAAA,GAAAF,aAAA;UAA5CvB,KAAK,GAAAyB,cAAA,cAAG,EAAE,GAAAA,cAAA;UAAAC,eAAA,GAAAH,aAAA;UAAEpB,OAAO,GAAAuB,eAAA,cAAG,EAAE,GAAAA,eAAA;QAE/B,IAAI,CAACzC,MAAM,CAACe,KAAK,GAAGA,KAAK;QACzB,IAAI,CAACf,MAAM,CAACkB,OAAO,GAAGA,OAAO;MAC/B;MAEA,IAAItB,QAAQ,KAAKuC,SAAS,EAAE;QAC1B,IAAI,CAACnC,MAAM,CAACJ,QAAQ,GAAGA,QAAQ;MACjC;IACF;EAAC;IAAAyB,GAAA;IAAA3B,KAAA,EAED,SAAAgD,iBAAiBA,CAAA,EAAG;MAClB,OAAO;QACLhD,KAAK,EAAE;MACT,CAAC;IACH;EAAC;IAAA2B,GAAA;IAAA3B,KAAA,EA6CD,SAAAiD,iBAAiBA,CAAA,EAAG;MAClB,OAAO;QACLpC,QAAQ,EAAE,IAAI,CAACF,OAAO,CAACE,QAAQ;QAC/BI,aAAa,EAAE,IAAI,CAACA;MACtB,CAAC;IACH;EAAC;IAAAU,GAAA;IAAA3B,KAAA,EAED,SAAAkD,cAAcA,CAAA,EAAG;MACf,IAAAC,cAAA,GAAwC,IAAI,CAACxC,OAAO;QAA5CC,IAAI,GAAAuC,cAAA,CAAJvC,IAAI;QAAEC,QAAQ,GAAAsC,cAAA,CAARtC,QAAQ;QAAES,WAAW,GAAA6B,cAAA,CAAX7B,WAAW;MACnC,OAAO;QACLV,IAAI,EAAJA,IAAI;QACJC,QAAQ,EAARA,QAAQ;QACRuC,QAAQ,EAAE,IAAI,CAAC9C,MAAM,CAAC8C,QAAQ;QAC9BC,OAAO,EAAE,IAAI,CAACC,mBAAmB;QACjChC,WAAW,EAAXA;MACF,CAAC;IACH;EAAC;IAAAK,GAAA;IAAA3B,KAAA,EAED,SAAAuD,MAAMA,CAAA,EAAG;MAAA,IAAAC,IAAA,QAAA7C,OAAA;QAAA8C,KAAA;MACP,IAAMC,WAAW,GAeQ7F,KAAK;MAd9B,IAAA8F,cAAA,GAA+D,IAAI,CAAChD,OAAO;QAAnEiD,MAAM,GAAAD,cAAA,CAANC,MAAM;QAAEC,QAAQ,GAAAF,cAAA,CAARE,QAAQ;QAAE7D,KAAK,GAAA2D,cAAA,CAAL3D,KAAK;QAAEE,QAAQ,GAAAyD,cAAA,CAARzD,QAAQ;QAAEoB,WAAW,GAAAqC,cAAA,CAAXrC,WAAW;QAAES,EAAE,GAAA4B,cAAA,CAAF5B,EAAE;MAE1D,IAAMX,IAAI,MAAA1B,MAAA,CAAM,IAAI,CAACY,MAAM,CAACe,KAAK,OAAA3B,MAAA,CAAI,IAAI,CAACY,MAAM,CAACkB,OAAO,CAAE;MAC1D,IAAM4B,QAAQ,GAAGlD,QAAQ,GAAG,IAAI,CAACI,MAAM,CAAC8C,QAAQ,GAAG,EAAE;MAErD,IAAMU,KAAK,GAAG9D,KAAK,MAAAN,MAAA,CACZ,IAAI,CAACqE,KAAK,CAAClE,SAAS,OAAAH,MAAA,CAAI4B,WAAW,CAAC,OAAO,EAAE;QAChDF,IAAI,EAAJA,IAAI;QACJgC,QAAQ,EAARA;MACF,CAAC,CAAC,OAAA1D,MAAA,CACG,IAAI,CAACqE,KAAK,CAAClE,SAAS,OAAAH,MAAA,CAAI4B,WAAW,CAAC,YAAY,CAAC,CAAE;MAE1D,OAAAmC,KAAA,GAAOjG,OAAO,CAACoG,MAAM,CAAC,eACpB9F,KAAA,CAAAkG,aAAA,CAAAlG,KAAA,CAAAmG,QAAA,qBACEnG,KAAA,CAAAkG,aAAA,CAACN,WAAW,EAAAD,KAAA,CAAAS,EAAA,gBAAAhD,aAAA,KAAAiD,YAAA;QAAA,QAAqB,OAAO;QAAA,cAAaL,KAAK;QAAA,kBAAkB,CAAC,OAAO,EAAE,IAAI;MAAC,GAAAN,IAAA,kBACzF1F,KAAA,CAAAkG,aAAA,CAACH,QAAQ,EAAAJ,KAAA,CAAAS,EAAA,gBAAE,CACA,CAAC,eACdpG,KAAA,CAAAkG,aAAA,CAAC3G,gBAAgB,EAAAoG,KAAA,CAAAS,EAAA;QAAA,OAAK,OAAO;QAAA,YAAW,CAAC,CAAC;QAAA,MAAMnC,EAAE;QAAA,eAAe,IAAI;QAAA,YAAArC,MAAA,CAAY0B,IAAI,OAAA1B,MAAA,CAAI0D,QAAQ;MAAA,EAAK,CACtG,CAAC;IAEP;EAAC;AAAA,EAjJ0B7F,SAAS,GAAA6G,WAAA,GAAAC,UAAA,CAAAxF,gBAAA,EAAAN,UAAA,IAAAI,WAAA,4BAATpB,SAAS,GAAA+G,aAAA,GAAAzB,cAAA,CAAAuB,WAAA,CAAAG,CAAA,MAAAzE,YAAA,GAAAwE,aAAA,KAAAnE,kBAAA,GAAAmE,aAAA,KAAAE,aAAA,GAAA3B,cAAA,CAAAuB,WAAA,CAAAK,CAAA,MAAAjG,eAAA,GAAAgG,aAAA,KAAAE,UAAA,GAAAF,aAAA,KAAA3F,gBAAA,GAAA8F,MAAA,0BAAAC,UAAA;EAAA,SAAAD,OAAA;IAAA,IAAAE,MAAA;IAAA3F,eAAA,OAAAyF,MAAA;IAAAE,MAAA,GAAApF,UAAA,OAAAkF,MAAA,GAAAnG,eAAA,IAAAmB,eAAA,CAAAmF,sBAAA,CAAAD,MAAA,kBACf,YAAY,GAAAlF,eAAA,CAAAmF,sBAAA,CAAAD,MAAA,YAClB9G,KAAK,GAAA4B,eAAA,CAAAmF,sBAAA,CAAAD,MAAA,cACH,CAACjH,WAAW,CAACO,iBAAiB,CAAC,CAAC,GAAAwB,eAAA,CAAAmF,sBAAA,CAAAD,MAAA,mBAC3B,UAAAE,KAAA;MAAA,IAAG7E,QAAQ,GAAA6E,KAAA,CAAR7E,QAAQ;MAAA,OAAyB;QACxDD,YAAY,EAAE,EAAE;QAChBW,IAAI,EAAE,GAAG;QACToE,QAAQ,eACNlH,KAAA,CAAAkG,aAAA,CAAAlG,KAAA,CAAAmG,QAAA,qBACEnG,KAAA,CAAAkG,aAAA,CAACiB,UAAU,CAAC5G,KAAK,MAAE,CAAC,eACpBP,KAAA,CAAAkG,aAAA,CAACiB,UAAU,CAACC,SAAS,MAAE,CAAC,eACxBpH,KAAA,CAAAkG,aAAA,CAACiB,UAAU,CAAC3G,OAAO,MAAE,CAAC,EACrB4B,QAAQ,iBAAIpC,KAAA,CAAAkG,aAAA,CAACiB,UAAU,CAAC7G,MAAM,MAAE,CACjC,CACH;QACD+G,MAAM,EAAE;MACV,CAAC;IAAA,CAAC,GAAAT,UAAA;IAAA,OAAAG,MAAA;EAAA;EAAApD,SAAA,CAAAkD,MAAA,EAAAC,UAAA;EAAA,OAAAlD,YAAA,CAAAiD,MAAA;AAAA,EAAAS,SAAA,GAAAzF,eAAA,CAAAgF,MAAA,EAAAlG,gBAAA,WAAAkG,MAAA;AAAA,IAmIEO,SAAS,0BAAAG,WAAA;EAAA,SAAAH,UAAA;IAAA,IAAAI,MAAA;IAAApG,eAAA,OAAAgG,SAAA;IAAA,SAAAK,KAAA,GAAAnG,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAgG,KAAA,GAAAC,KAAA,MAAAA,KAAA,GAAAD,KAAA,EAAAC,KAAA;MAAAlG,IAAA,CAAAkG,KAAA,IAAApG,SAAA,CAAAoG,KAAA;IAAA;IAAAF,MAAA,GAAA7F,UAAA,OAAAyF,SAAA,KAAAxF,MAAA,CAAAJ,IAAA;IAAAK,eAAA,CAAA2F,MAAA,kBAKE,YAAM;MACnB,IAAIA,MAAA,CAAK3E,OAAO,CAACM,aAAa,CAACwE,OAAO,EAAE;QAAA,IAAAC,qBAAA;QACtC,CAAAA,qBAAA,GAAAJ,MAAA,CAAK3E,OAAO,CAACM,aAAa,CAACwE,OAAO,cAAAC,qBAAA,eAAlCA,qBAAA,CAAoCC,KAAK,CAAC,CAAC;MAC7C;IACF,CAAC;IAAA,OAAAL,MAAA;EAAA;EAAA7D,SAAA,CAAAyD,SAAA,EAAAG,WAAA;EAAA,OAAA3D,YAAA,CAAAwD,SAAA;IAAAvD,GAAA;IAAA3B,KAAA,EAED,SAAAuD,MAAMA,CAAA,EAAG;MAAA,IAAAqC,KAAA,QAAAjF,OAAA;QAAAkF,KAAA;MACP,IAAMC,oBAAoB,GAE2B1I,GAAG;MADxD,IAAQwG,MAAM,GAAK,IAAI,CAACjD,OAAO,CAAvBiD,MAAM;MACd,OAAAiC,KAAA,GAAOrI,OAAO,CAACoG,MAAM,CAAC,eAAC9F,KAAA,CAAAkG,aAAA,CAAC8B,oBAAoB,EAAAD,KAAA,CAAA3B,EAAA,yBAAAhD,aAAA,KAAA6E,aAAA;QAAA,WAAuB,IAAI,CAACC,YAAY;QAAA,eAAc;MAAM,GAAAJ,KAAA,GAAE,CAAC;IAC7G;EAAC;AAAA,EAfqBrI,SAAS;AAAAoC,eAAA,CAA3BuF,SAAS,kBACS;EACpBF,QAAQ,EAAE;AACZ,CAAC;AAeH,IAAMC,UAAU,GAAG3H,eAAe,CAACyB,eAAc,EAAE;EACjDV,KAAK,EAALA,KAAK;EACLC,OAAO,EAAPA,OAAO;EACP4G,SAAS,EAATA,SAAS;EACT9G,MAAM,EAANA;AACF,CAAC,CAAwB;AAEzB,eAAe6G,UAAU","ignoreList":[]}

package/lib/es6/component/TimePicker/TimePicker.type.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=TimePicker.type.js.map

package/lib/es6/component/TimePicker/TimePicker.type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePicker.type.js","names":[],"sources":["../../../../src/component/TimePicker/TimePicker.type.ts"],"sourcesContent":["import type { Box } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { InputProps, InputValueProps } from '@semcore/input';\n\nimport type { TimePickerFormatProps } from '../PickerFormat/PickerFormat.type';\n\nexport type TimePickerProps = Omit<InputProps, 'size'> & {\n  /** Time in the hh:mm format */\n  value?: string;\n  /** Default value if `value` property is not provided */\n  defaultValue?: string;\n  /** The event responses upon time changing */\n  onChange?: (time: string, event?: React.SyntheticEvent) => void;\n  /** In charge of the component blocking */\n  disabled?: boolean;\n  /** Control size\n   * @default m */\n  size?: 'm' | 'l';\n  /** 12-hour time format */\n  is12Hour?: boolean;\n  /** Specifies the locale for i18n support */\n  locale?: string;\n};\n\nexport type TimePickerSeparatorProps = {\n  /** @Internal */\n  hoursInputRef: React.RefObject<HTMLElement>;\n  /** @Internal */\n  disabled?: boolean;\n};\n\nexport type TimePickerItemProps = InputValueProps & {\n  /** Step for changing of the values in the dropdown list */\n  step?: number;\n};\n\nexport type TimePickerContext = {\n  getHoursProps: PropGetterFn;\n  getFormatProps: PropGetterFn;\n  getMinutesProps: PropGetterFn;\n  getSeparatorProps: PropGetterFn;\n};\n\nexport type TimePickerHandlers = {\n  value: (value: string) => void;\n};\n\nexport type TimePickerMeridiem = 'AM' | 'PM';\n\nexport type TimePickerField = 'hours' | 'minutes';\n\nexport type TimePickerComponent = Intergalactic.Component<\n  'div',\n  TimePickerProps,\n  TimePickerContext,\n  [handlers: TimePickerHandlers]\n> & {\n  Hours: Intergalactic.Component<'div', TimePickerItemProps>;\n  Minutes: Intergalactic.Component<'div', TimePickerItemProps>;\n  Separator: typeof Box;\n  Format: Intergalactic.Component<'div', TimePickerFormatProps>;\n};\n"],"mappings":"","ignoreList":[]}

package/lib/es6/component/TimePicker/time-picker.shadow.css

@@ -0,0 +1,34 @@
+STimePicker {
+  position: relative;
+  width: auto;
+  outline: none;
+
+  SPickerInput {
+    box-sizing: content-box;
+    text-align: center;
+    z-index: 1;
+    height: 1.5em;
+
+    &[placeholder] {
+      text-overflow: initial;
+    }
+    &:focus {
+      outline: none;
+      background-color: var(--intergalactic-bg-highlight-focus, oklch(0.94 0.023 278.4));
+    }
+  }
+}
+
+STimePicker[disabled] {
+  color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+  cursor: default;
+}
+
+STimePickerSeparator {
+  color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
+}
+
+STimePickerSeparator[disabled] {
+  opacity: var(--intergalactic-disabled-opacity, 0.4);
+  pointer-events: none;
+}

package/lib/es6/entity/TimePickerEntity.js

@@ -0,0 +1,94 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var TimePickerEntity = /*#__PURE__*/function () {
+  function TimePickerEntity() {
+    var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : ':';
+    var is12Hour = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    _classCallCheck(this, TimePickerEntity);
+    _defineProperty(this, "_hours", '');
+    _defineProperty(this, "_minutes", '');
+    _defineProperty(this, "_is12Hour", void 0);
+    _defineProperty(this, "_meridiem", 'AM');
+    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;
+    this._is12Hour = is12Hour;
+    this._hours = hours;
+    this._minutes = minutes;
+  }
+  return _createClass(TimePickerEntity, [{
+    key: "meridiem",
+    get: function get() {
+      return this._meridiem;
+    },
+    set: function set(newMeridiem) {
+      this._meridiem = newMeridiem;
+    }
+  }, {
+    key: "hours",
+    get: function get() {
+      return this._is12Hour ? this.formatHoursTo12(this._hours) : this.formatHoursTo24(this._hours);
+    },
+    set: function set(newHours) {
+      this._hours = newHours;
+    }
+  }, {
+    key: "minutes",
+    get: function get() {
+      return this._minutes && this.withLeadingZero(this._minutes);
+    },
+    set: function set(newMinutes) {
+      this._minutes = newMinutes;
+    }
+  }, {
+    key: "is12Hour",
+    set: function set(newIs12Hour) {
+      this._is12Hour = newIs12Hour;
+    }
+  }, {
+    key: "withLeadingZero",
+    value: function withLeadingZero(value) {
+      return String(value).padStart(2, '0');
+    }
+  }, {
+    key: "formatHoursTo12",
+    value: function formatHoursTo12(hours) {
+      var numberHours = Number.parseInt(hours, 10);
+      if (Number.isNaN(numberHours)) return hours;
+      if (numberHours === 0) {
+        return '12';
+      } else if (numberHours > 12) {
+        return this.withLeadingZero(numberHours - 12);
+      }
+      return this.withLeadingZero(numberHours);
+    }
+  }, {
+    key: "formatHoursTo24",
+    value: function formatHoursTo24(hours) {
+      var numberHours = Number.parseInt(hours, 10);
+      if (Number.isNaN(numberHours)) return hours;
+      if (this.meridiem === 'AM') {
+        return this.withLeadingZero(numberHours === 12 ? 0 : numberHours);
+      }
+      return this.withLeadingZero(numberHours < 12 ? numberHours + 12 : numberHours);
+    }
+  }, {
+    key: "toggleMeridiem",
+    value: function toggleMeridiem() {
+      this.meridiem = this._meridiem === 'AM' ? 'PM' : 'AM';
+    }
+  }, {
+    key: "toString",
+    value: function toString() {
+      var hours = this._is12Hour ? this.formatHoursTo24(this.hours) : this.hours;
+      return "".concat(hours, ":").concat(this.minutes);
+    }
+  }]);
+}();
+export default TimePickerEntity;
+//# sourceMappingURL=TimePickerEntity.js.map

package/lib/es6/entity/TimePickerEntity.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePickerEntity.js","names":["TimePickerEntity","value","arguments","length","undefined","is12Hour","_classCallCheck","_defineProperty","_value$split","split","_value$split2","_slicedToArray","_value$split2$","hours","_value$split2$2","minutes","_is12Hour","_hours","_minutes","_createClass","key","get","_meridiem","set","newMeridiem","formatHoursTo12","formatHoursTo24","newHours","withLeadingZero","newMinutes","newIs12Hour","String","padStart","numberHours","Number","parseInt","isNaN","meridiem","toggleMeridiem","toString","concat"],"sources":["../../../src/entity/TimePickerEntity.ts"],"sourcesContent":["import type { TimePickerMeridiem } from '../component/TimePicker/TimePicker.type';\n\nclass TimePickerEntity {\n  private _hours: string = '';\n  private _minutes: string = '';\n  private _is12Hour: boolean;\n  private _meridiem: TimePickerMeridiem = 'AM';\n\n  constructor(\n    value: string = ':', // should be in the format 'HH:mm'\n    is12Hour: boolean = false,\n  ) {\n    const [hours = '', minutes = ''] = value.split(':');\n\n    this._is12Hour = is12Hour;\n    this._hours = hours;\n    this._minutes = minutes;\n  }\n\n  get meridiem() {\n    return this._meridiem;\n  }\n\n  get hours() {\n    return this._is12Hour ? this.formatHoursTo12(this._hours) : this.formatHoursTo24(this._hours);\n  }\n\n  get minutes() {\n    return this._minutes && this.withLeadingZero(this._minutes);\n  }\n\n  set is12Hour(newIs12Hour: boolean) {\n    this._is12Hour = newIs12Hour;\n  }\n\n  set hours(newHours) {\n    this._hours = newHours;\n  }\n\n  set minutes(newMinutes) {\n    this._minutes = newMinutes;\n  }\n\n  private set meridiem(newMeridiem) {\n    this._meridiem = newMeridiem;\n  }\n\n  private withLeadingZero(value: string | number) {\n    return String(value).padStart(2, '0');\n  }\n\n  private formatHoursTo12(hours: string) {\n    const numberHours = Number.parseInt(hours, 10);\n\n    if (Number.isNaN(numberHours)) return hours;\n\n    if (numberHours === 0) {\n      return '12';\n    } else if (numberHours > 12) {\n      return this.withLeadingZero(numberHours - 12);\n    }\n\n    return this.withLeadingZero(numberHours);\n  }\n\n  private formatHoursTo24(hours: string) {\n    const numberHours = Number.parseInt(hours, 10);\n\n    if (Number.isNaN(numberHours)) return hours;\n\n    if (this.meridiem === 'AM') {\n      return this.withLeadingZero(numberHours === 12 ? 0 : numberHours);\n    }\n\n    return this.withLeadingZero(numberHours < 12 ? numberHours + 12 : numberHours);\n  }\n\n  toggleMeridiem() {\n    this.meridiem = this._meridiem === 'AM' ? 'PM' : 'AM';\n  }\n\n  toString() {\n    const hours = this._is12Hour ? this.formatHoursTo24(this.hours) : this.hours;\n\n    return `${hours}:${this.minutes}`;\n  }\n}\n\nexport default TimePickerEntity;\n"],"mappings":"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","ignoreList":[]}

package/lib/es6/index.js

@@ -1,3 +1,3 @@
-export { default } from './TimePicker';
-export * from './TimePicker';
+export { default } from './component/TimePicker/TimePicker';
+export * from './component/TimePicker/TimePicker.type';
 //# sourceMappingURL=index.js.map

package/lib/es6/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './TimePicker';\nexport * from './TimePicker';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,cAAc;AACtC,cAAc,cAAc"}
+{"version":3,"file":"index.js","names":["default"],"sources":["../../src/index.ts"],"sourcesContent":["export { default } from './component/TimePicker/TimePicker';\nexport * from './component/TimePicker/TimePicker.type';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,mCAAmC;AAC3D,cAAc,wCAAwC","ignoreList":[]}

package/lib/es6/translations/__intergalactic-dynamic-locales.js

@@ -6,12 +6,12 @@ import it from './it.json';
 import ja from './ja.json';
 import ko from './ko.json';
 import nl from './nl.json';
+import pl from './pl.json';
 import pt from './pt.json';
+import sv from './sv.json';
 import tr from './tr.json';
 import vi from './vi.json';
 import zh from './zh.json';
-import pl from './pl.json';
-import sv from './sv.json';
 export var localizedMessages = {
   de: de,
   en: en,

package/lib/es6/translations/__intergalactic-dynamic-locales.js.map

@@ -1 +1 @@
-{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["de","en","es","fr","it","ja","ko","nl","pt","tr","vi","zh","pl","sv","localizedMessages"],"sources":["../../../src/translations/__intergalactic-dynamic-locales.ts"],"sourcesContent":["import de from './de.json';\nimport en from './en.json';\nimport es from './es.json';\nimport fr from './fr.json';\nimport it from './it.json';\nimport ja from './ja.json';\nimport ko from './ko.json';\nimport nl from './nl.json';\nimport pt from './pt.json';\nimport tr from './tr.json';\nimport vi from './vi.json';\nimport zh from './zh.json';\nimport pl from './pl.json';\nimport sv from './sv.json';\n\nexport const localizedMessages = {\n  de,\n  en,\n  es,\n  fr,\n  it,\n  ja,\n  ko,\n  nl,\n  pt,\n  tr,\n  vi,\n  zh,\n  pl,\n  sv,\n};\n"],"mappings":"AAAA,OAAOA,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAE1B,OAAO,IAAMC,iBAAiB,GAAG;EAC/Bd,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA;AACF,CAAC"}
+{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["de","en","es","fr","it","ja","ko","nl","pl","pt","sv","tr","vi","zh","localizedMessages"],"sources":["../../../src/translations/__intergalactic-dynamic-locales.ts"],"sourcesContent":["import de from './de.json';\nimport en from './en.json';\nimport es from './es.json';\nimport fr from './fr.json';\nimport it from './it.json';\nimport ja from './ja.json';\nimport ko from './ko.json';\nimport nl from './nl.json';\nimport pl from './pl.json';\nimport pt from './pt.json';\nimport sv from './sv.json';\nimport tr from './tr.json';\nimport vi from './vi.json';\nimport zh from './zh.json';\n\nexport const localizedMessages = {\n  de,\n  en,\n  es,\n  fr,\n  it,\n  ja,\n  ko,\n  nl,\n  pt,\n  tr,\n  vi,\n  zh,\n  pl,\n  sv,\n};\n"],"mappings":"AAAA,OAAOA,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAE1B,OAAO,IAAMC,iBAAiB,GAAG;EAC/Bd,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFE,EAAE,EAAFA,EAAE;EACFE,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFL,EAAE,EAAFA,EAAE;EACFE,EAAE,EAAFA;AACF,CAAC","ignoreList":[]}

package/lib/esm/component/PickerFormat/PickerFormat.mjs

@@ -0,0 +1,86 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import { sstyled, assignProps, Component } from "@semcore/core";
+import { Box, ScreenReaderOnly } from "@semcore/base-components";
+import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
+import React from "react";
+/*!__reshadow-styles__:"./picker-format.shadow.css"*/
+var style = (
+  /*__reshadow_css_start__*/
+  (sstyled.insert(
+    /*__inner_css_start__*/
+    ".___SPickerFormat_294sn_gg_{flex-shrink:0;position:relative;display:inline-flex;padding:0;white-space:nowrap;font-family:inherit;font-weight:var(--intergalactic-medium, 500);line-height:normal;-webkit-text-decoration:none;text-decoration:none;align-items:center;border:1px solid var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161));border-radius:0 var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0;box-shadow:none;cursor:pointer;box-sizing:border-box;overflow:visible;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));background-color:var(--intergalactic-bg-secondary-neutral, rgb(248, 249, 248))}@supports (color:color(display-p3 0 0 0%)){.___SPickerFormat_294sn_gg_{border:1px solid var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161));color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SPickerFormat_294sn_gg_{border:1px solid var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161));color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}@media (hover:hover){.___SPickerFormat_294sn_gg_:hover{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));background-color:var(--intergalactic-bg-secondary-neutral-hover, rgb(241, 242, 242))}@supports (color:color(display-p3 0 0 0%)){.___SPickerFormat_294sn_gg_:hover{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SPickerFormat_294sn_gg_:hover{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}}.___SPickerFormat_294sn_gg_.__active_294sn_gg_,.___SPickerFormat_294sn_gg_:active{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583));background-color:var(--intergalactic-bg-secondary-neutral-active, rgb(234, 235, 235))}@supports (color:color(display-p3 0 0 0%)){.___SPickerFormat_294sn_gg_.__active_294sn_gg_,.___SPickerFormat_294sn_gg_:active{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SPickerFormat_294sn_gg_.__active_294sn_gg_,.___SPickerFormat_294sn_gg_:active{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}.___SPickerFormat_294sn_gg_._size_m_294sn_gg_{height:var(--intergalactic-form-control-m, 28px);font-size:var(--intergalactic-fs-200, 14px);margin:0-1px 0 0}.___SPickerFormat_294sn_gg_._size_m_294sn_gg_ .___SPickerFormatText_294sn_gg_{margin:0 var(--intergalactic-spacing-2x, 8px)}.___SPickerFormat_294sn_gg_._size_l_294sn_gg_{height:var(--intergalactic-form-control-l, 40px);font-size:var(--intergalactic-fs-300, 16px);margin:0-1px 0 0}.___SPickerFormat_294sn_gg_._size_l_294sn_gg_ .___SPickerFormatText_294sn_gg_{margin:0 var(--intergalactic-spacing-3x, 12px)}.___SPickerFormat_294sn_gg_.__disabled_294sn_gg_{opacity:var(--intergalactic-disabled-opacity, 0.4);cursor:default;pointer-events:none;border-color:transparent transparent transparent var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@supports (color:color(display-p3 0 0 0%)){.___SPickerFormat_294sn_gg_.__disabled_294sn_gg_{border-color:transparent transparent transparent var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SPickerFormat_294sn_gg_.__disabled_294sn_gg_{border-color:transparent transparent transparent var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}",
+    /*__inner_css_end__*/
+    "294sn_gg_"
+  ), /*__reshadow_css_end__*/
+  {
+    "__SPickerFormat": "___SPickerFormat_294sn_gg_",
+    "_disabled": "__disabled_294sn_gg_",
+    "_active": "__active_294sn_gg_",
+    "_size_m": "_size_m_294sn_gg_",
+    "__SPickerFormatText": "___SPickerFormatText_294sn_gg_",
+    "_size_l": "_size_l_294sn_gg_"
+  })
+);
+var TimePickerFormat = /* @__PURE__ */ (function(_Component) {
+  function TimePickerFormat2() {
+    var _this;
+    _classCallCheck(this, TimePickerFormat2);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, TimePickerFormat2, [].concat(args));
+    _defineProperty(_this, "state", {
+      changedFormatNotice: ""
+    });
+    _defineProperty(_this, "handleClick", function() {
+      setTimeout(function() {
+        var _this$asProps = _this.asProps, meridiem = _this$asProps.meridiem, getI18nText = _this$asProps.getI18nText;
+        _this.setState({
+          changedFormatNotice: getI18nText("changedFormatNotice", {
+            meridiem
+          })
+        });
+      }, 0);
+      setTimeout(function() {
+        _this.setState({
+          changedFormatNotice: ""
+        });
+      }, 2e3);
+    });
+    return _this;
+  }
+  _inherits(TimePickerFormat2, _Component);
+  return _createClass(TimePickerFormat2, [{
+    key: "render",
+    value: function render() {
+      var _ref = this.asProps, _ref2;
+      var SPickerFormat = Box;
+      var _this$asProps2 = this.asProps, Children = _this$asProps2.Children, meridiem = _this$asProps2.meridiem, styles = _this$asProps2.styles, getI18nText = _this$asProps2.getI18nText, uid = _this$asProps2.uid;
+      var changedFormatNotice = this.state.changedFormatNotice;
+      var SPickerFormatText = "span";
+      return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SPickerFormat, _ref2.cn("SPickerFormat", _objectSpread({}, assignProps({
+        "type": "button",
+        "tag": "button",
+        "tabIndex": 0,
+        "onClick": this.handleClick,
+        "aria-describedby": "".concat(uid, "_describe")
+      }, _ref))), Children.origin ? /* @__PURE__ */ React.createElement(Children, _ref2.cn("Children", {})) : /* @__PURE__ */ React.createElement(SPickerFormatText, _ref2.cn("SPickerFormatText", {}), meridiem)), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref2.cn("ScreenReaderOnly", {
+        "role": "status",
+        "aria-live": "polite"
+      }), changedFormatNotice), /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref2.cn("ScreenReaderOnly", {
+        "aria-hidden": "true",
+        "id": "".concat(uid, "_describe")
+      }), getI18nText("formatToggler")));
+    }
+  }]);
+})(Component);
+_defineProperty(TimePickerFormat, "style", style);
+_defineProperty(TimePickerFormat, "enhance", [uniqueIDEnhancement()]);
+export {
+  TimePickerFormat as default
+};

package/lib/esm/component/PickerFormat/picker-format.shadow.css

@@ -0,0 +1,61 @@
+SPickerFormat {
+  flex-shrink: 0;
+  position: relative;
+  display: inline-flex;
+  padding: 0;
+  white-space: nowrap;
+  font-family: inherit;
+  font-weight: var(--intergalactic-medium, 500);
+  line-height: normal;
+  text-decoration: none;
+  align-items: center;
+  border: 1px solid var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
+  border-radius: 0 var(--intergalactic-control-rounded, 6px)
+    var(--intergalactic-control-rounded, 6px) 0;
+  box-shadow: none;
+  cursor: pointer;
+  box-sizing: border-box;
+  overflow: visible;
+  user-select: none;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
+  color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+  background-color: var(--intergalactic-bg-secondary-neutral, oklch(0.98 0.001 180));
+
+  &:hover {
+    color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+    background-color: var(--intergalactic-bg-secondary-neutral-hover, oklch(0.96 0.001 180));
+  }
+
+  &:active,
+  &[active] {
+    color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
+    background-color: var(--intergalactic-bg-secondary-neutral-active, oklch(0.94 0.002 180));
+  }
+}
+
+SPickerFormat[size='m'] {
+  height: var(--intergalactic-form-control-m, 28px);
+  font-size: var(--intergalactic-fs-200, 14px);
+  /* disable-tokens-validator */
+  margin: 0 -1px 0 0;
+  & SPickerFormatText {
+    margin: 0 var(--intergalactic-spacing-2x, 8px);
+  }
+}
+
+SPickerFormat[size='l'] {
+  height: var(--intergalactic-form-control-l, 40px);
+  font-size: var(--intergalactic-fs-300, 16px);
+  margin: 0 -1px 0 0;
+  & SPickerFormatText {
+    margin: 0 var(--intergalactic-spacing-3x, 12px);
+  }
+}
+
+SPickerFormat[disabled] {
+  opacity: var(--intergalactic-disabled-opacity, 0.4);
+  cursor: default;
+  pointer-events: none;
+  border-color: transparent transparent transparent var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
+}