@semcore/time-picker 16.1.14-prerelease.9 → 16.2.0-prerelease.1

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

@@ -1,84 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { Component, sstyled, assignProps } 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"*/
-const style = (
-  /*__reshadow_css_start__*/
-  (sstyled.insert(
-    /*__inner_css_start__*/
-    ".___SPickerFormat_11qxx_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, #c4c7cf);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, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}@media (hover:hover){.___SPickerFormat_11qxx_gg_:hover{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-hover, #e0e1e9)}}.___SPickerFormat_11qxx_gg_.__active_11qxx_gg_,.___SPickerFormat_11qxx_gg_:active{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-active, #c4c7cf)}.___SPickerFormat_11qxx_gg_._size_m_11qxx_gg_{height:var(--intergalactic-form-control-m, 28px);font-size:var(--intergalactic-fs-200, 14px);margin:0-1px 0 0}.___SPickerFormat_11qxx_gg_._size_m_11qxx_gg_ .___SPickerFormatText_11qxx_gg_{margin:0 var(--intergalactic-spacing-2x, 8px)}.___SPickerFormat_11qxx_gg_._size_l_11qxx_gg_{height:var(--intergalactic-form-control-l, 40px);font-size:var(--intergalactic-fs-300, 16px);margin:0-1px 0 0}.___SPickerFormat_11qxx_gg_._size_l_11qxx_gg_ .___SPickerFormatText_11qxx_gg_{margin:0 var(--intergalactic-spacing-3x, 12px)}.___SPickerFormat_11qxx_gg_.__disabled_11qxx_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;border-color:transparent transparent transparent var(--intergalactic-border-primary, #c4c7cf)}",
-    /*__inner_css_end__*/
-    "11qxx_gg_"
-  ), /*__reshadow_css_end__*/
-  {
-    "__SPickerFormat": "___SPickerFormat_11qxx_gg_",
-    "_disabled": "__disabled_11qxx_gg_",
-    "_active": "__active_11qxx_gg_",
-    "_size_m": "_size_m_11qxx_gg_",
-    "__SPickerFormatText": "___SPickerFormatText_11qxx_gg_",
-    "_size_l": "_size_l_11qxx_gg_"
-  })
-);
-class TimePickerFormat extends Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "state", {
-      changedFormatNotice: ""
-    });
-    _defineProperty(this, "handleClick", () => {
-      setTimeout(() => {
-        const {
-          meridiem,
-          getI18nText
-        } = this.asProps;
-        this.setState({
-          changedFormatNotice: getI18nText("changedFormatNotice", {
-            meridiem
-          })
-        });
-      }, 0);
-      setTimeout(() => {
-        this.setState({
-          changedFormatNotice: ""
-        });
-      }, 2e3);
-    });
-  }
-  render() {
-    var _ref = this.asProps, _ref2;
-    const SPickerFormat = Box;
-    const {
-      Children,
-      meridiem,
-      styles,
-      getI18nText,
-      uid
-    } = this.asProps;
-    const {
-      changedFormatNotice
-    } = this.state;
-    const SPickerFormatText = "span";
-    return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SPickerFormat, _ref2.cn("SPickerFormat", {
-      ...assignProps({
-        "type": "button",
-        "tag": "button",
-        "tabIndex": 0,
-        "onClick": this.handleClick,
-        "aria-describedby": `${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": `${uid}_describe`
-    }), getI18nText("formatToggler")));
-  }
-}
-_defineProperty(TimePickerFormat, "style", style);
-_defineProperty(TimePickerFormat, "enhance", [uniqueIDEnhancement()]);
-export {
-  TimePickerFormat as default
-};

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

@@ -1,61 +0,0 @@
-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, #c4c7cf);
-  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, #6c6e79);
-  background-color: var(--intergalactic-bg-secondary-neutral, #f4f5f9);
-
-  &:hover {
-    color: var(--intergalactic-text-secondary, #6c6e79);
-    background-color: var(--intergalactic-bg-secondary-neutral-hover, #e0e1e9);
-  }
-
-  &:active,
-  &[active] {
-    color: var(--intergalactic-text-secondary, #6c6e79);
-    background-color: var(--intergalactic-bg-secondary-neutral-active, #c4c7cf);
-  }
-}
-
-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.3);
-  cursor: default;
-  pointer-events: none;
-  border-color: transparent transparent transparent var(--intergalactic-border-primary, #c4c7cf);
-}

package/lib/esm/component/PickerInput/PickerInput.mjs

@@ -1,227 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { Component, sstyled, assignProps } from "@semcore/core";
-import { callAllEventHandlers } from "@semcore/core/lib/utils/assignProps";
-import Input from "@semcore/input";
-import Select from "@semcore/select";
-import React from "react";
-/*!__reshadow-styles__:"./picker-input.shadow.css"*/
-const style = (
-  /*__reshadow_css_start__*/
-  (sstyled.insert(
-    /*__inner_css_start__*/
-    ".___SPickerInput_1bwib_gg_._size_l_1bwib_gg_,.___SPickerInput_1bwib_gg_._size_m_1bwib_gg_{width:19px;margin:0 var(--intergalactic-spacing-2x, 8px);padding:0}.___SPickerInput_1bwib_gg_._size_l_1bwib_gg_{width:21px}",
-    /*__inner_css_end__*/
-    "1bwib_gg_"
-  ), /*__reshadow_css_end__*/
-  {
-    "__SPickerInput": "___SPickerInput_1bwib_gg_",
-    "_size_m": "_size_m_1bwib_gg_",
-    "_size_l": "_size_l_1bwib_gg_"
-  })
-);
-function getOptions(minMax, step = 1) {
-  const [min, max] = minMax;
-  const length = Number(((max + 1 - min) / step).toFixed(0));
-  const options = Array(length).fill("");
-  let numValue = min;
-  return options.map((_i, index) => {
-    numValue = index === 0 ? numValue : numValue + step;
-    const value = String(numValue).padStart(2, "0");
-    return /* @__PURE__ */ React.createElement(Select.Option, {
-      value,
-      key: value
-    }, value);
-  });
-}
-class AbstractPickerInput extends Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "state", {
-      dirtyValue: void 0,
-      visible: false
-    });
-    _defineProperty(this, "inputRef", /* @__PURE__ */ React.createRef());
-    _defineProperty(this, "parseValueWithMinMax", (value) => {
-      const [min, max] = this.minMax;
-      const numberValue = isNaN(Number(value)) ? min : Number(value);
-      return String(Math.max(min, Math.min(max, numberValue)));
-    });
-    _defineProperty(this, "handleChange", (value, event) => {
-      event.stopPropagation();
-      const inputValue = value.replace(/[^0-9]/g, "");
-      const numberValue = Number(inputValue);
-      if (!Number.isNaN(numberValue)) {
-        this.setState({
-          dirtyValue: inputValue.slice(-2)
-        });
-      }
-    });
-    _defineProperty(this, "handleBlur", (event) => this.submitChanges(event));
-    _defineProperty(this, "handleSelect", (value, event) => {
-      this.dispatchOnChange(value, event);
-    });
-    _defineProperty(this, "handleVisibleChange", (visible) => this.setState({
-      visible
-    }));
-  }
-  dispatchOnChange(value, event) {
-    this.setState({
-      dirtyValue: void 0
-    });
-    this.asProps.$onValueChange(value, this.field, event);
-  }
-  submitChanges(event) {
-    let {
-      dirtyValue
-    } = this.state;
-    if (dirtyValue !== void 0) {
-      if (dirtyValue) dirtyValue = this.parseValueWithMinMax(dirtyValue);
-      this.dispatchOnChange(dirtyValue, event);
-    }
-  }
-  render() {
-    var _ref = this.asProps, _ref2;
-    const SPickerInput = Select.Trigger;
-    const {
-      styles,
-      step,
-      onSelect,
-      time,
-      size,
-      disabled,
-      onVisibleChange,
-      ariaLabel,
-      ...other
-    } = this.asProps;
-    const {
-      dirtyValue,
-      visible
-    } = this.state;
-    const value = dirtyValue === void 0 ? time : dirtyValue;
-    return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(Select, _ref2.cn("Select", {
-      ...other,
-      "interaction": "focus",
-      "size": size,
-      "onChange": callAllEventHandlers(onSelect, this.handleSelect),
-      "onVisibleChange": callAllEventHandlers(onVisibleChange, this.handleVisibleChange),
-      "visible": visible,
-      "value": time,
-      "defaultHighlightedIndex": time ? null : 0
-    }), /* @__PURE__ */ React.createElement(SPickerInput, _ref2.cn("SPickerInput", {
-      ...assignProps({
-        "tag": Input.Value,
-        "ref": this.inputRef,
-        "inputMode": "numeric",
-        "size": size,
-        "disabled": disabled,
-        "neighborLocation": false,
-        "value": value,
-        "aria-label": ariaLabel,
-        "onChange": this.handleChange,
-        "onBlur": this.handleBlur,
-        "onKeyDown": this.handleKeyDown
-      }, _ref)
-    })), /* @__PURE__ */ React.createElement(Select.Menu, {
-      hMax: 180
-    }, getOptions(this.minMax, step)));
-  }
-}
-_defineProperty(AbstractPickerInput, "style", style);
-_defineProperty(AbstractPickerInput, "defaultProps", (_) => ({
-  placeholder: "00",
-  offset: [-8, 4]
-}));
-class Hours extends AbstractPickerInput {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "handleKeyDown", (event) => {
-      const {
-        currentTarget
-      } = event;
-      if (event.key === "Enter") {
-        this.submitChanges(event);
-      }
-      if (event.key === "ArrowRight") {
-        if (currentTarget.selectionStart && currentTarget.selectionStart >= currentTarget.value.length && currentTarget.selectionStart === currentTarget.selectionEnd) {
-          event.preventDefault();
-          this.focusNext();
-        }
-      }
-    });
-  }
-  get field() {
-    return "hours";
-  }
-  get minMax() {
-    const {
-      is12Hour
-    } = this.asProps;
-    return is12Hour ? [1, 12] : [0, 23];
-  }
-  focusNext() {
-    if (this.asProps.minutesInputRef.current) {
-      this.setState({
-        visible: false
-      });
-      this.asProps.minutesInputRef.current.focus();
-    }
-  }
-  componentDidUpdate(_, prevState) {
-    const {
-      dirtyValue
-    } = this.state;
-    if (prevState.dirtyValue === void 0 || dirtyValue === void 0) return;
-    if (prevState.dirtyValue.length === 1 && dirtyValue.length === 2) {
-      this.focusNext();
-    }
-  }
-}
-_defineProperty(Hours, "defaultProps", (props) => ({
-  ...AbstractPickerInput.defaultProps(props),
-  ml: props.size === "l" ? 3 : void 0
-}));
-class Minutes extends AbstractPickerInput {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "handleKeyDown", (event) => {
-      const {
-        currentTarget
-      } = event;
-      if (event.key === "ArrowLeft") {
-        if (currentTarget.selectionStart && currentTarget.selectionStart <= 0 && currentTarget.selectionStart === currentTarget.selectionEnd) {
-          event.preventDefault();
-          this.focusPrev();
-        }
-      }
-      if (event.key === "Backspace") {
-        if (currentTarget.value.length === 0) {
-          event.preventDefault();
-          this.focusPrev();
-        }
-      }
-      if (event.key === "Enter") this.submitChanges(event);
-    });
-  }
-  get field() {
-    return "minutes";
-  }
-  get minMax() {
-    return [0, 59];
-  }
-  focusPrev() {
-    if (this.asProps.hoursInputRef.current) {
-      this.setState({
-        visible: false
-      });
-      this.asProps.hoursInputRef.current.focus();
-    }
-  }
-}
-_defineProperty(Minutes, "defaultProps", (props) => ({
-  ...AbstractPickerInput.defaultProps(props),
-  mr: props.size === "l" ? 3 : void 0
-}));
-export {
-  Hours,
-  Minutes
-};

package/lib/esm/component/PickerInput/picker-input.shadow.css

@@ -1,11 +0,0 @@
-SPickerInput[size='m'] {
-  width: 19px;
-  margin: 0 var(--intergalactic-spacing-2x, 8px);
-  padding: 0;
-}
-
-SPickerInput[size='l'] {
-  width: 21px;
-  margin: 0 var(--intergalactic-spacing-2x, 8px);
-  padding: 0;
-}

package/lib/esm/component/TimePicker/TimePicker.mjs

@@ -1,220 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _applyDecs from "@babel/runtime/helpers/esm/applyDecs2311";
-import _identity from "@babel/runtime/helpers/esm/identity";
-import { createComponent, sstyled, Component, assignProps } from "@semcore/core";
-import { ScreenReaderOnly, Box } from "@semcore/base-components";
-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";
-import TimePickerEntity from "../../entity/TimePickerEntity.mjs";
-import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
-import TimePickerFormat from "../PickerFormat/PickerFormat.mjs";
-import { Minutes, Hours } from "../PickerInput/PickerInput.mjs";
-var _Class, _TimePickerRoot3;
-let _initClass, _classDecs, _entityDecs, _init_entity, _init_extra_entity, _TimePickerRoot2, _ref5;
-/*!__reshadow-styles__:"./time-picker.shadow.css"*/
-const style = (
-  /*__reshadow_css_start__*/
-  (sstyled.insert(
-    /*__inner_css_start__*/
-    ".___STimePicker_17xeh_gg_{position:relative;width:auto;outline:0}.___STimePicker_17xeh_gg_ .___SPickerInput_17xeh_gg_{box-sizing:content-box;text-align:center;z-index:1;height:1.5em}.___STimePicker_17xeh_gg_ .___SPickerInput_17xeh_gg_.__placeholder_17xeh_gg_{text-overflow:initial}.___STimePicker_17xeh_gg_ .___SPickerInput_17xeh_gg_:focus{outline:0;background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___STimePicker_17xeh_gg_.__disabled_17xeh_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}.___STimePickerSeparator_17xeh_gg_{color:var(--intergalactic-text-primary, #191b23)}.___STimePickerSeparator_17xeh_gg_.__disabled_17xeh_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);pointer-events:none}",
-    /*__inner_css_end__*/
-    "17xeh_gg_"
-  ), /*__reshadow_css_end__*/
-  {
-    "__STimePicker": "___STimePicker_17xeh_gg_",
-    "_disabled": "__disabled_17xeh_gg_",
-    "__STimePickerSeparator": "___STimePickerSeparator_17xeh_gg_",
-    "__SPickerInput": "___SPickerInput_17xeh_gg_",
-    "_placeholder": "__placeholder_17xeh_gg_"
-  })
-);
-_classDecs = [propsObserver(["value", "is12Hour"])];
-let _TimePickerRoot;
-new (_TimePickerRoot2 = (_ref5 = (_entityDecs = reactive(["meridiem"], function() {
-  this.forceUpdate();
-}), "hoursInputRef"), _TimePickerRoot3 = class TimePickerRoot extends Component {
-  constructor(...args) {
-    super(...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.defaultValue, this.props.is12Hour)));
-    _defineProperty(this, "handleValueChange", (_init_extra_entity(this), (value, field, event) => {
-      this.entity[field] = value;
-      this.handlers.value(this.entity.toString(), event);
-    }));
-    _defineProperty(this, "handleMeridiemClick", (event) => {
-      this.entity.toggleMeridiem();
-      this.handlers.value(this.entity.toString(), event);
-    });
-    _defineProperty(this, "getCommonPickerInputProps", () => {
-      const {
-        is12Hour,
-        size,
-        disabled
-      } = this.asProps;
-      return {
-        size,
-        is12Hour,
-        disabled,
-        $onValueChange: this.handleValueChange,
-        minutesInputRef: this.minutesInputRef,
-        hoursInputRef: this.hoursInputRef
-      };
-    });
-    _defineProperty(this, "getHoursProps", () => {
-      return {
-        ...this.getCommonPickerInputProps(),
-        time: this.entity.hours,
-        ariaLabel: this.asProps.getI18nText("hours"),
-        ref: this.hoursInputRef
-      };
-    });
-    _defineProperty(this, "getMinutesProps", () => {
-      return {
-        ...this.getCommonPickerInputProps(),
-        time: this.entity.minutes,
-        ariaLabel: this.asProps.getI18nText("minutes"),
-        ref: this.minutesInputRef
-      };
-    });
-  }
-  componentDidMount() {
-    const {
-      id,
-      "aria-describedby": ariaDescribedBy
-    } = this.asProps;
-    const selector = `[for=${id}]`;
-    const element = document.querySelector(selector) ?? document.querySelector(`#${ariaDescribedBy}`);
-    if (element) {
-      this.setState({
-        ariaLabel: element.textContent
-      });
-    }
-  }
-  onPropsChange(changedProps) {
-    const {
-      value,
-      is12Hour
-    } = changedProps;
-    if (value !== void 0) {
-      const [hours = "", minutes = ""] = value.split(":");
-      this.entity.hours = hours;
-      this.entity.minutes = minutes;
-    }
-    if (is12Hour !== void 0) {
-      this.entity.is12Hour = is12Hour;
-    }
-  }
-  uncontrolledProps() {
-    return {
-      value: null
-    };
-  }
-  getSeparatorProps() {
-    return {
-      disabled: this.asProps.disabled,
-      hoursInputRef: this.hoursInputRef
-    };
-  }
-  getFormatProps() {
-    const {
-      size,
-      disabled,
-      getI18nText
-    } = this.asProps;
-    return {
-      size,
-      disabled,
-      meridiem: this.entity.meridiem,
-      onClick: this.handleMeridiemClick,
-      getI18nText
-    };
-  }
-  render() {
-    var _ref = this.asProps, _ref3;
-    const STimePicker = Input;
-    const {
-      styles,
-      Children,
-      value,
-      is12Hour,
-      getI18nText,
-      id
-    } = this.asProps;
-    const time = `${this.entity.hours}:${this.entity.minutes}`;
-    const meridiem = is12Hour ? this.entity.meridiem : "";
-    const label = value ? `${this.state.ariaLabel} ${getI18nText("title", {
-      time,
-      meridiem
-    })}` : `${this.state.ariaLabel} ${getI18nText("titleEmpty")}`;
-    return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(STimePicker, _ref3.cn("STimePicker", {
-      ...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": `${time} ${meridiem}`
-    })));
-  }
-}, {
-  e: [_init_entity, _init_extra_entity],
-  c: [_TimePickerRoot, _initClass]
-} = _applyDecs(_TimePickerRoot3, _classDecs, [[_entityDecs, 0, "entity"]], 0, void 0, Component), _TimePickerRoot3), _Class = class extends _identity {
-  constructor() {
-    super(_TimePickerRoot), _defineProperty(this, "displayName", "TimePicker"), _defineProperty(this, "style", style), _defineProperty(this, "enhance", [i18nEnhance(localizedMessages)]), _defineProperty(this, "defaultProps", ({
-      is12Hour
-    }) => ({
-      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();
-  }
-}, _defineProperty(_Class, _TimePickerRoot2, void 0), _Class)();
-class Separator extends Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "handlerClick", () => {
-      var _a;
-      if (this.asProps.hoursInputRef.current) {
-        (_a = this.asProps.hoursInputRef.current) == null ? void 0 : _a.focus();
-      }
-    });
-  }
-  render() {
-    var _ref2 = this.asProps, _ref4;
-    const STimePickerSeparator = Box;
-    const {
-      styles
-    } = this.asProps;
-    return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(STimePickerSeparator, _ref4.cn("STimePickerSeparator", {
-      ...assignProps({
-        "onClick": this.handlerClick,
-        "aria-hidden": "true"
-      }, _ref2)
-    }));
-  }
-}
-_defineProperty(Separator, "defaultProps", {
-  children: ":"
-});
-const TimePicker = createComponent(_TimePickerRoot, {
-  Hours,
-  Minutes,
-  Separator,
-  Format: TimePickerFormat
-});
-export {
-  TimePicker as default
-};

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

@@ -1,34 +0,0 @@
-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, rgba(0, 143, 248, 0.2));
-    }
-  }
-}
-
-STimePicker[disabled] {
-  color: var(--intergalactic-text-secondary, #6c6e79);
-  cursor: default;
-}
-
-STimePickerSeparator {
-  color: var(--intergalactic-text-primary, #191b23);
-}
-
-STimePickerSeparator[disabled] {
-  opacity: var(--intergalactic-disabled-opacity, 0.3);
-  pointer-events: none;
-}