@hi-ui/time-picker 4.0.0-beta.3 → 4.0.0-beta.32

package/lib/cjs/@types/index.js

@@ -19,4 +19,3 @@ exports.TimePickerSelectorType = void 0;
   TimePickerSelectorType[TimePickerSelectorType["minute"] = 2] = "minute";
   TimePickerSelectorType[TimePickerSelectorType["second"] = 3] = "second";
 })(exports.TimePickerSelectorType || (exports.TimePickerSelectorType = {}));
-//# sourceMappingURL=index.js.map

package/lib/cjs/Input.js

@@ -138,9 +138,9 @@ var Input = /*#__PURE__*/React.forwardRef(function (props, ref) {
       return undefined;
     };
 
-    return /*#__PURE__*/React__default['default'].createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: componentClass + "__wrapper"
-    }, /*#__PURE__*/React__default['default'].createElement("input", {
+    }, /*#__PURE__*/React__default["default"].createElement("input", {
       className: componentClass + "__interact-area",
       onChange: function onChange(e) {
         var result = dispose(e.target.value);
@@ -155,7 +155,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (props, ref) {
       },
       value: matchValue,
       placeholder: placeholders[index]
-    }), /*#__PURE__*/React__default['default'].createElement("div", {
+    }), /*#__PURE__*/React__default["default"].createElement("div", {
       className: componentClass + "__shadow-text"
     }, matchValue || placeholders[index]));
   }, [componentClass, disabled, placeholders, isFitContent, format, cacheValue, validChecker, getPanelType, _onChange, _onFocus]); // 通知外部，输入框内容合法性变更
@@ -170,12 +170,11 @@ var Input = /*#__PURE__*/React.forwardRef(function (props, ref) {
       }
     };
   }, [value]);
-  return /*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classname.cx(componentClass, componentClass + "--size-" + size, (_cx = {}, _cx[componentClass + "--not-valid"] = !judgeIsValid(cacheValue), _cx[componentClass + "--range"] = type === 'range', _cx[componentClass + "--disabled"] = disabled, _cx[componentClass + "--fit-content"] = isFitContent, _cx))
-  }, renderInput(cacheValue[0], 0), type === 'range' && /*#__PURE__*/React__default['default'].createElement("div", {
+  }, renderInput(cacheValue[0], 0), type === 'range' && /*#__PURE__*/React__default["default"].createElement("div", {
     className: componentClass + "__range-separator"
   }, toText), type === 'range' && renderInput(cacheValue[1], 1));
 });
 Input.displayName = 'Input';
 exports.Input = Input;
-//# sourceMappingURL=Input.js.map

package/lib/cjs/Panel.js

@@ -88,7 +88,7 @@ var Panel = function Panel(props) {
   // }, [selectorTypes, componentPrefix])
 
   var renderSelectors = React.useCallback(function () {
-    return /*#__PURE__*/React__default['default'].createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: componentPrefix + "__selector-container"
     }, selectorTypes.map(function (type, index) {
       var _cx;
@@ -101,10 +101,10 @@ var Panel = function Panel(props) {
         position = Selector.SelectorPosition.right;
       }
 
-      return /*#__PURE__*/React__default['default'].createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: componentPrefix + "__selector-content",
         key: type
-      }, /*#__PURE__*/React__default['default'].createElement(Selector.Selector, {
+      }, /*#__PURE__*/React__default["default"].createElement(Selector.Selector, {
         value: String(separateValue[index]),
         prefix: prefix,
         position: position,
@@ -125,17 +125,16 @@ var Panel = function Panel(props) {
           }).join(':'));
         },
         data: getSelectorData(type)
-      }), /*#__PURE__*/React__default['default'].createElement("div", {
+      }), /*#__PURE__*/React__default["default"].createElement("div", {
         className: classname.cx(componentPrefix + "__indicator", (_cx = {}, _cx[componentPrefix + "__indicator--left"] = index === 0, _cx[componentPrefix + "__indicator--right"] = index === selectorTypes.length - 1, _cx))
       }));
     }));
   }, [selectorTypes, componentPrefix, prefix, getSelectorData, _onChange, separateValue, // itemHeight,
   // fullDisplayItemNumber,
   value]);
-  return /*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: componentPrefix
   }, renderSelectors());
 };
 
 exports.Panel = Panel;
-//# sourceMappingURL=Panel.js.map

package/lib/cjs/PopContent.js

@@ -127,8 +127,8 @@ var PopContent = function PopContent(props) {
           result = [].concat(result, getRange.getRange(0, isLastOne ? startMinute : startMinute - 1));
         } // 开始时间大于结束时间，直接禁用所有
         else if (startHour > hour) {
-            result = [].concat(result, getRange.getRange(0, 59));
-          }
+          result = [].concat(result, getRange.getRange(0, 59));
+        }
       }
     }
 
@@ -174,9 +174,9 @@ var PopContent = function PopContent(props) {
     return prefix + "__pop-content";
   }, [prefix]);
   var renderPanel = React.useCallback(function (index) {
-    return /*#__PURE__*/React__default['default'].createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: componentClass + "__panel-container"
-    }, /*#__PURE__*/React__default['default'].createElement(Panel.Panel // itemHeight={itemHeight}
+    }, /*#__PURE__*/React__default["default"].createElement(Panel.Panel // itemHeight={itemHeight}
     // fullDisplayItemNumber={fullDisplayItemNumber}
     , {
       // itemHeight={itemHeight}
@@ -201,13 +201,12 @@ var PopContent = function PopContent(props) {
   }, [hourStep, minuteStep, secondStep, customDisabledHours, customDisabledMinute, customDisabledSeconds, format, prefix, type, value, _onChange, // fullDisplayItemNumber,
   // itemHeight,
   componentClass]);
-  return /*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: componentClass,
     style: style
-  }, renderPanel(0), type === 'range' && /*#__PURE__*/React__default['default'].createElement("div", {
+  }, renderPanel(0), type === 'range' && /*#__PURE__*/React__default["default"].createElement("div", {
     className: componentClass + "__separator"
   }), type === 'range' && renderPanel(1));
 };
 
 exports.PopContent = PopContent;
-//# sourceMappingURL=PopContent.js.map

package/lib/cjs/Selector.js

@@ -48,13 +48,9 @@ var Selector = function Selector(props) {
   var scrollContainerRef = React.useRef(null);
   var topItemGagerRef = React.useRef(null);
   var bottomItemGagerRef = React.useRef(null);
-  var lastValueMatchIndexCache = React.useRef(-1); // const safePadding = useMemo(
-  //   () => ((fullDisplayItemNumber - 1) * (itemHeight + ITEM_MARGIN_SIZE)) / 2,
-  //   [fullDisplayItemNumber, itemHeight]
-  // )
-
+  var lastValueMatchIndexCache = React.useRef(-1);
   var calcCurrentIndex = React.useCallback(function (scrollTop) {
-    return Math.floor(scrollTop / (topItemGagerRef.current.clientHeight + (bottomItemGagerRef.current.offsetTop - topItemGagerRef.current.offsetTop - topItemGagerRef.current.clientHeight)));
+    return Math.round(scrollTop / (topItemGagerRef.current.clientHeight + (bottomItemGagerRef.current.offsetTop - topItemGagerRef.current.offsetTop - topItemGagerRef.current.clientHeight)));
   }, []);
   var scrollToMatchIndex = React.useCallback(function (index) {
     if (scrollContainerRef.current) {
@@ -100,9 +96,9 @@ var Selector = function Selector(props) {
       scrollToMatchIndex(currentIndex);
     }
   }, [data, value, scrollToMatchIndex]);
-  return /*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classname.cx(componentPrefix, componentPrefix + "--position-" + position)
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     onScroll: onScroll,
     ref: scrollContainerRef,
     // 此处使用了取巧的办法
@@ -111,14 +107,14 @@ var Selector = function Selector(props) {
   }, data.map(function (item, index) {
     var _cx;
 
-    return /*#__PURE__*/React__default['default'].createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: classname.cx(componentPrefix + "__item", componentPrefix + "__demarcate", (_cx = {}, _cx[componentPrefix + "__item--disabled"] = item.disabled, _cx[componentPrefix + "__item--active"] = item.id === value, _cx)),
       key: item.id,
       onClick: function onClick() {
         return onItemClick(item, index);
       }
     }, item.title);
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     style: {
       pointerEvents: 'none',
       opacity: '0',
@@ -127,14 +123,13 @@ var Selector = function Selector(props) {
       left: '0',
       top: '0'
     }
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: componentPrefix + "__demarcate",
     ref: topItemGagerRef
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: componentPrefix + "__demarcate",
     ref: bottomItemGagerRef
   }))));
 };
 
 exports.Selector = Selector;
-//# sourceMappingURL=Selector.js.map

package/lib/cjs/TimePicker.js

@@ -70,7 +70,7 @@ var getValueMatchString = function getValueMatchString(value) {
 
   var result = Array.isArray(value) ? value : [value];
   return result.map(function (item) {
-    return typeof item === 'string' ? item : DayJs__default['default'](item).format('HH:mm:ss');
+    return typeof item === 'string' ? item : DayJs__default["default"](item).format('HH:mm:ss');
   });
 };
 
@@ -112,7 +112,9 @@ var TimePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       inputReadonly = _ref$inputReadonly === void 0 ? false : _ref$inputReadonly,
       overlay = _ref.overlay,
       _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'md' : _ref$size;
+      size = _ref$size === void 0 ? 'md' : _ref$size,
+      _ref$invalid = _ref.invalid,
+      invalid = _ref$invalid === void 0 ? false : _ref$invalid;
   var i18n = localeContext.useLocaleContext();
   var confirmText = i18n.get('timePicker.ok');
   var nowText = i18n.get('timePicker.now');
@@ -133,6 +135,10 @@ var TimePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     });
     notifyOutside && notifyOutside(result.length > 1 ? result : result[0]);
   }, [notifyOutside]);
+  var isInSingleValueFormat = React.useMemo(function () {
+    var singleFormat = ['HH', 'mm', 'ss'];
+    return singleFormat.includes(format);
+  }, [format]);
 
   var _useUncontrolledState = useUncontrolledState.useUncontrolledState(formatUncontrolledValue, formatControlledValue, formatNotifyOutside),
       value = _useUncontrolledState[0],
@@ -221,14 +227,13 @@ var TimePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       setShowPopper = _useState4[1];
 
   var showPopperRef = React.useRef(false);
-  var cls = classname.cx(prefixCls, className, prefixCls + "--appearance-" + appearance, (_cx = {}, _cx[prefixCls + "--active"] = showPopper && !disabled, _cx[prefixCls + "--disabled"] = disabled, _cx[prefixCls + "--input-not-valid"] = !isInputValid, _cx));
+  var cls = classname.cx(prefixCls, className, prefixCls + "--appearance-" + appearance, (_cx = {}, _cx[prefixCls + "--active"] = showPopper && !disabled, _cx[prefixCls + "--disabled"] = disabled, _cx[prefixCls + "--input-not-valid"] = !isInputValid || invalid, _cx));
   var functionButtons = React.useMemo(function () {
-    return /*#__PURE__*/React__default['default'].createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: prefixCls + "__pop-function-buttons"
-    }, /*#__PURE__*/React__default['default'].createElement(button.Button, {
-      className: prefixCls + "__pop-confirm-button",
+    }, /*#__PURE__*/React__default["default"].createElement(button.Button, {
+      className: prefixCls + "__pop-confirm-btn",
       type: 'primary',
-      size: "sm",
       disabled: !isInputValid,
       onClick: function onClick() {
         // 合法，才去通知外部
@@ -241,23 +246,25 @@ var TimePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         showPopperRef.current = false;
         setShowPopper(false);
       }
-    }, confirmText), type === 'single' && /*#__PURE__*/React__default['default'].createElement("div", {
-      className: prefixCls + "__pop-now-button",
+    }, confirmText), type === 'single' && !isInSingleValueFormat && /*#__PURE__*/React__default["default"].createElement(button.Button, {
+      className: prefixCls + "__pop-now-btn",
+      appearance: "link",
+      type: "primary",
       onClick: function onClick() {
-        onCacheChange([getNowString.getNowString(format)]);
+        onChange([getNowString.getNowString(format)]);
         showPopperRef.current = false;
         setShowPopper(false);
       }
     }, nowText));
-  }, [confirmText, nowText, prefixCls, isInputValid, type, format, onCacheChange, cacheValue, value, onChange, validChecker]);
-  return /*#__PURE__*/React__default['default'].createElement("div", {
+  }, [confirmText, nowText, prefixCls, isInputValid, type, format, cacheValue, value, onChange, validChecker, isInSingleValueFormat]);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     ref: ref,
     role: role,
     className: cls
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     ref: setAttachEl,
     className: prefixCls + "__input-wrapper"
-  }, /*#__PURE__*/React__default['default'].createElement(Input.Input, {
+  }, /*#__PURE__*/React__default["default"].createElement(Input.Input, {
     size: size,
     isFitContent: appearance === 'unset',
     ref: inputRef,
@@ -279,7 +286,7 @@ var TimePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       showPopperRef.current = true;
       setShowPopper(true);
     }
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: prefixCls + "__function-button",
     onClick: function onClick() {
       showPopperRef.current = !showPopperRef.current;
@@ -287,12 +294,12 @@ var TimePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         return !pre;
       });
     }
-  }, showPopper ? /*#__PURE__*/React__default['default'].createElement(icons.CloseCircleFilled, {
+  }, showPopper ? /*#__PURE__*/React__default["default"].createElement(icons.CloseCircleFilled, {
     className: prefixCls + "__close-button",
     onClick: function onClick() {
       onCacheChange(type === 'single' ? [''] : ['', '']);
     }
-  }) : /*#__PURE__*/React__default['default'].createElement(icons.TimeOutlined, null))), /*#__PURE__*/React__default['default'].createElement(popper.PopperPortal, Object.assign({}, overlay || {}, {
+  }) : /*#__PURE__*/React__default["default"].createElement(icons.TimeOutlined, null))), /*#__PURE__*/React__default["default"].createElement(popper.Popper, Object.assign({}, overlay || {}, {
     unmountOnClose: false,
     visible: showPopper && !disabled,
     attachEl: attachEl,
@@ -308,7 +315,7 @@ var TimePicker = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.refresh();
     },
     preload: true
-  }), /*#__PURE__*/React__default['default'].createElement(PopContent.PopContent // itemHeight={itemHeight}
+  }), /*#__PURE__*/React__default["default"].createElement(PopContent.PopContent // itemHeight={itemHeight}
   // fullDisplayItemNumber={fullDisplayItemNumber}
   , {
     // itemHeight={itemHeight}
@@ -346,4 +353,3 @@ if (env.__DEV__) {
 
 exports.TimePicker = TimePicker;
 exports.timePickerPrefix = timePickerPrefix;
-//# sourceMappingURL=TimePicker.js.map

package/lib/cjs/hooks/useFilter.js

@@ -36,4 +36,3 @@ var useFilter = function useFilter(original) {
 };
 
 exports.useFilter = useFilter;
-//# sourceMappingURL=useFilter.js.map

package/lib/cjs/index.js

@@ -31,4 +31,3 @@ Object.defineProperty(exports, 'TimePickerSelectorType', {
 exports.TimePicker = TimePicker.TimePicker;
 exports["default"] = TimePicker.TimePicker;
 exports.timePickerPrefix = TimePicker.timePickerPrefix;
-//# sourceMappingURL=index.js.map

package/lib/cjs/styles/index.scss.js

@@ -12,11 +12,10 @@
 Object.defineProperty(exports, '__esModule', {
   value: true
 });
-var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-time-picker {\n  width: -webkit-fit-content;\n  width: -moz-fit-content;\n  width: fit-content;\n  border-radius: 4px;\n  -webkit-box-shadow: 0 0 0 2px transparent;\n          box-shadow: 0 0 0 2px transparent; }\n.hi-v4-time-picker__input-wrapper {\n    border: 1px solid transparent;\n    border: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-static-transparent, transparent);\n    border-radius: 4px;\n    border-radius: var(--hi-v4-border-radius-md, 4px); }\n.hi-v4-time-picker--appearance-line {\n    position: relative;\n    z-index: 0; }\n.hi-v4-time-picker--appearance-line .hi-v4-time-picker__input-wrapper {\n      background: #fff;\n      background: var(--hi-v4-color-static-white, #fff);\n      border-color: #dfe2e8;\n      border-color: var(--hi-v4-color-gray-300, #dfe2e8); }\n.hi-v4-time-picker--appearance-line:hover .hi-v4-time-picker__input-wrapper {\n      border-color: #237ffa;\n      border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-time-picker--appearance-filled {\n    background: #f2f4f7;\n    background: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-time-picker--appearance-filled:hover {\n      background: #ebedf0;\n      background: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-time-picker--appearance-unset:hover {\n    background: #f2f4f7;\n    background: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-time-picker--active {\n    -webkit-box-shadow: 0 0 0 2px #bde2ff;\n            box-shadow: 0 0 0 2px #bde2ff;\n    -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n            box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n    background: transparent; }\n.hi-v4-time-picker--active .hi-v4-time-picker__input-wrapper {\n      border-color: #237ffa;\n      border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-time-picker--active:hover {\n      background: transparent; }\n.hi-v4-time-picker--input-not-valid {\n    -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n            box-shadow: 0 0 0 2px #ffd1c9;\n    -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9);\n            box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9); }\n.hi-v4-time-picker--input-not-valid .hi-v4-time-picker__input-wrapper {\n      border-color: #ff5959;\n      border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-time-picker__input-wrapper {\n    width: -webkit-fit-content;\n    width: -moz-fit-content;\n    width: fit-content;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center; }\n.hi-v4-time-picker__pop-function-buttons {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-pack: justify;\n        -ms-flex-pack: justify;\n            justify-content: space-between;\n    padding: 6px 8px;\n    border-top: 1px solid #f2f4f7;\n    border-top: 1px solid var(--hi-v4-color-gray-100, #f2f4f7);\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -ms-flex-wrap: wrap;\n        flex-wrap: wrap;\n    -webkit-box-orient: horizontal;\n    -webkit-box-direction: reverse;\n        -ms-flex-direction: row-reverse;\n            flex-direction: row-reverse; }\n.hi-v4-time-picker__pop-now-button {\n    height: 22px;\n    width: 48px;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    font-size: 0.75rem;\n    font-size: var(--hi-v4-text-size-sm, 0.75rem);\n    color: #237ffa;\n    color: var(--hi-v4-color-brandblue-500, #237ffa);\n    cursor: pointer;\n    margin-right: 12px;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none; }\n.hi-v4-time-picker__function-button {\n    margin-right: 8px;\n    font-size: 14px;\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    color: #929aa6;\n    color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-time-picker--disabled {\n    cursor: not-allowed;\n    background: #dfe2e8; }\n.hi-v4-time-picker--disabled .hi-v4-time-picker__input-wrapper {\n      pointer-events: none;\n      opacity: 0.3; }\n.hi-v4-time-picker__close-button:hover {\n    color: #5f6a7a; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-time-picker__selector {\n  cursor: pointer;\n  position: relative;\n  z-index: 0;\n  width: 54px;\n  color: #5f6a7a;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center; }\n.hi-v4-time-picker__selector:hover .hi-v4-time-picker__selector__shortcut {\n    opacity: 1; }\n.hi-v4-time-picker__selector--position-left {\n    margin-right: 1px; }\n.hi-v4-time-picker__selector--position-left .hi-v4-time-picker__selector__item {\n      border-radius: 4px 0 0 4px; }\n.hi-v4-time-picker__selector--position-right {\n    margin-left: 1px; }\n.hi-v4-time-picker__selector--position-right .hi-v4-time-picker__selector__item {\n      border-radius: 0 4px 4px 0; }\n.hi-v4-time-picker__selector--position-single .hi-v4-time-picker__selector__item {\n    border-radius: 4px; }\n.hi-v4-time-picker__selector__item {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    font-size: 14px; }\n.hi-v4-time-picker__selector__item:hover {\n      background: #f2f4f7;\n      background: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-time-picker__selector__item.hi-v4-time-picker__selector__item--disabled {\n      opacity: 0.2;\n      cursor: not-allowed;\n      background: transparent; }\n.hi-v4-time-picker__selector__demarcate {\n    margin: 8px 0;\n    height: 24px; }\n.hi-v4-time-picker__selector__demarcate:first-of-type {\n      margin-top: 0; }\n.hi-v4-time-picker__selector__demarcate:last-of-type {\n      margin-bottom: 0; }\n.hi-v4-time-picker__selector__scroll-part {\n    overflow-y: auto;\n    -webkit-box-sizing: content-box;\n            box-sizing: content-box;\n    scroll-behavior: smooth;\n    scrollbar-width: none;\n    /* firefox */\n    -ms-overflow-style: none;\n    /* IE 10+ */\n    padding: 100px 0;\n    width: 100%;\n    position: relative;\n    z-index: 0; }\n.hi-v4-time-picker__selector__scroll-part::-webkit-scrollbar {\n      display: none;\n      /* Chrome Safari */ }\n.hi-v4-time-picker__selector__shortcut {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    height: 12px;\n    opacity: 0; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-time-picker__panel {\n  padding: 4px 8px;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  height: 100%; }\n.hi-v4-time-picker__panel__selector-container {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    position: relative;\n    z-index: 0;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center; }\n.hi-v4-time-picker__panel__selector-content {\n    position: relative; }\n.hi-v4-time-picker__panel__indicator {\n    position: absolute;\n    top: 50%;\n    -webkit-transform: translateY(-50%);\n            transform: translateY(-50%);\n    pointer-events: none;\n    background: #e2f3fe;\n    background: var(--hi-v4-color-brandblue-50, #e2f3fe);\n    z-index: -1;\n    width: 54px;\n    height: 24px; }\n.hi-v4-time-picker__panel__indicator--left {\n      border-top-left-radius: 4px;\n      border-bottom-left-radius: 4px;\n      left: 0; }\n.hi-v4-time-picker__panel__indicator--right {\n      border-top-right-radius: 4px;\n      border-bottom-right-radius: 4px;\n      right: 0; }\n.hi-v4-time-picker__panel__indicator--middle {\n      left: 0; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-time-picker__input {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  width: -webkit-fit-content;\n  width: -moz-fit-content;\n  width: fit-content;\n  color: #1f2733;\n  color: var(--hi-v4-color-gray-700, #1f2733); }\n.hi-v4-time-picker__input--disabled {\n    color: #c9ced6;\n    color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-time-picker__input--not-valid {\n    color: #ff5959;\n    color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-time-picker__input--range .hi-v4-time-picker__input__interact-area {\n    text-align: center; }\n.hi-v4-time-picker__input--fit-content .hi-v4-time-picker__input__wrapper {\n    width: -webkit-fit-content;\n    width: -moz-fit-content;\n    width: fit-content; }\n.hi-v4-time-picker__input--size-sm {\n    line-height: 24px;\n    line-height: var(--hi-v4-height-xs, 24px);\n    font-size: 0.75rem;\n    font-size: var(--hi-v4-text-size-sm, 0.75rem); }\n.hi-v4-time-picker__input--size-sm .hi-v4-time-picker__input__wrapper {\n      height: 24px;\n      height: var(--hi-v4-height-xs, 24px); }\n.hi-v4-time-picker__input--size-md {\n    line-height: 32px;\n    line-height: var(--hi-v4-height-normal, 32px);\n    font-size: 0.875rem;\n    font-size: var(--hi-v4-text-size-normal, 0.875rem); }\n.hi-v4-time-picker__input--size-md .hi-v4-time-picker__input__wrapper {\n      height: 32px;\n      height: var(--hi-v4-height-normal, 32px); }\n.hi-v4-time-picker__input--size-lg {\n    line-height: 40px;\n    line-height: var(--hi-v4-height-xl, 40px);\n    font-size: 1rem;\n    font-size: var(--hi-v4-text-size-lg, 1rem); }\n.hi-v4-time-picker__input--size-lg .hi-v4-time-picker__input__wrapper {\n      height: 40px;\n      height: var(--hi-v4-height-xl, 40px); }\n.hi-v4-time-picker__input__wrapper {\n    width: 208px;\n    -webkit-box-sizing: border-box;\n            box-sizing: border-box;\n    position: relative;\n    z-index: 0;\n    height: 30px;\n    line-height: 30px;\n    padding: 0 12px; }\n.hi-v4-time-picker__input__shadow-text {\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    font-family: inherit;\n    color: transparent; }\n.hi-v4-time-picker__input__interact-area {\n    -webkit-box-sizing: border-box;\n            box-sizing: border-box;\n    width: 100%;\n    padding: 0 12px;\n    color: inherit;\n    border: none;\n    outline: none;\n    height: 100%;\n    font-size: inherit;\n    background: transparent;\n    font-weight: inherit;\n    font-family: inherit;\n    position: absolute;\n    left: 0;\n    top: 0; }\n.hi-v4-time-picker__input__interact-area:disabled {\n      background: transparent; }\n.hi-v4-time-picker__input__interact-area::-webkit-input-placeholder {\n      color: #929aa6;\n      color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-time-picker__input__interact-area::-moz-placeholder {\n      color: #929aa6;\n      color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-time-picker__input__interact-area::-ms-input-placeholder {\n      color: #929aa6;\n      color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-time-picker__input__interact-area:-ms-input-placeholder {\n      color: #929aa6;\n      color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-time-picker__input__interact-area::placeholder {\n      color: #929aa6;\n      color: var(--hi-v4-color-gray-500, #929aa6); }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-time-picker__pop-content {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  width: -webkit-fit-content;\n  width: -moz-fit-content;\n  width: fit-content;\n  position: relative;\n  -webkit-box-align: stretch;\n      -ms-flex-align: stretch;\n          align-items: stretch;\n  min-width: 100%;\n  -webkit-box-pack: center;\n      -ms-flex-pack: center;\n          justify-content: center; }\n.hi-v4-time-picker__pop-content__separator {\n    width: 40px;\n    border-left: 1px solid #f2f4f7;\n    border-left: 1px solid var(--hi-v4-color-gray-100, #f2f4f7);\n    border-right: 1px solid #f2f4f7;\n    border-right: 1px solid var(--hi-v4-color-gray-100, #f2f4f7); }\n";
+var css_248z = ".hi-v4-time-picker {width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;border-radius: 4px;-webkit-box-shadow: 0 0 0 2px transparent;box-shadow: 0 0 0 2px transparent; }.hi-v4-time-picker__input-wrapper {border: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-static-transparent, transparent);border-radius: var(--hi-v4-border-radius-md, 4px);width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center; }.hi-v4-time-picker--appearance-line {position: relative;z-index: 0; }.hi-v4-time-picker--appearance-line .hi-v4-time-picker__input-wrapper {background: var(--hi-v4-color-static-white, #fff);border-color: var(--hi-v4-color-gray-300, #dfe2e8); }.hi-v4-time-picker--appearance-line:hover .hi-v4-time-picker__input-wrapper {border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-time-picker--appearance-filled {background: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-time-picker--appearance-filled:hover {background: var(--hi-v4-color-gray-200, #ebedf0); }.hi-v4-time-picker--appearance-unset:hover {background: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-time-picker--active {-webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));box-shadow: 0 0 0 2px var(--hi-v4-color-primary-100, var(--hi-v4-color-brandblue-100, #bde2ff));background: transparent; }.hi-v4-time-picker--active .hi-v4-time-picker__input-wrapper {border-color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-time-picker--active:hover {background: transparent; }.hi-v4-time-picker--input-not-valid {-webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9));box-shadow: 0 0 0 2px var(--hi-v4-color-danger-100, var(--hi-v4-color-red-100, #ffd1c9)); }.hi-v4-time-picker--input-not-valid .hi-v4-time-picker__input-wrapper, .hi-v4-time-picker--input-not-valid .hi-v4-time-picker__input-wrapper:hover {border-color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-time-picker__pop-function-buttons {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;padding: 6px 8px;border-top: 1px solid var(--hi-v4-color-gray-100, #f2f4f7);-webkit-box-align: center;-ms-flex-align: center;align-items: center;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-orient: horizontal;-webkit-box-direction: reverse;-ms-flex-direction: row-reverse;flex-direction: row-reverse; }.hi-v4-time-picker__pop-function-buttons .hi-v4-time-picker__pop-now-btn {-webkit-margin-start: 0;margin-inline-start: 0;-webkit-margin-end: var(--hi-v4-spacing-6, 12px);margin-inline-end: var(--hi-v4-spacing-6, 12px); }.hi-v4-time-picker__function-button {margin-right: 8px;font-size: 14px;cursor: pointer;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-time-picker--disabled {cursor: not-allowed;background: #dfe2e8; }.hi-v4-time-picker--disabled .hi-v4-time-picker__input-wrapper {pointer-events: none;opacity: 0.3; }.hi-v4-time-picker__close-button:hover {color: #5f6a7a; }.hi-v4-time-picker__selector {cursor: pointer;position: relative;z-index: 0;width: 54px;color: #5f6a7a;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-time-picker__selector:hover .hi-v4-time-picker__selector__shortcut {opacity: 1; }.hi-v4-time-picker__selector--position-left {margin-right: 1px; }.hi-v4-time-picker__selector--position-left .hi-v4-time-picker__selector__item {border-radius: 4px 0 0 4px; }.hi-v4-time-picker__selector--position-right {margin-left: 1px; }.hi-v4-time-picker__selector--position-right .hi-v4-time-picker__selector__item {border-radius: 0 4px 4px 0; }.hi-v4-time-picker__selector--position-single .hi-v4-time-picker__selector__item {border-radius: 4px; }.hi-v4-time-picker__selector__item {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;font-size: 14px; }.hi-v4-time-picker__selector__item:hover {background: var(--hi-v4-color-gray-100, #f2f4f7); }.hi-v4-time-picker__selector__item.hi-v4-time-picker__selector__item--active {color: var(--hi-v4-color-primary-500, var(--hi-v4-color-brandblue-500, #237ffa)); }.hi-v4-time-picker__selector__item.hi-v4-time-picker__selector__item--disabled {opacity: 0.2;cursor: not-allowed;background: transparent; }.hi-v4-time-picker__selector__demarcate {margin: 2px 0;height: 32px; }.hi-v4-time-picker__selector__demarcate:first-of-type {margin-top: 0; }.hi-v4-time-picker__selector__demarcate:last-of-type {margin-bottom: 0; }.hi-v4-time-picker__selector__scroll-part {overflow-y: auto;-webkit-box-sizing: content-box;box-sizing: content-box;scroll-behavior: smooth;scrollbar-width: none;/* firefox */-ms-overflow-style: none;/* IE 10+ */padding: 100px 0;width: 100%;position: relative;z-index: 0; }.hi-v4-time-picker__selector__scroll-part::-webkit-scrollbar {display: none;/* Chrome Safari */ }.hi-v4-time-picker__selector__shortcut {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;height: 12px;opacity: 0; }.hi-v4-time-picker__panel {padding: 4px 8px;-webkit-box-sizing: border-box;box-sizing: border-box;height: 100%; }.hi-v4-time-picker__panel__selector-container {display: -webkit-box;display: -ms-flexbox;display: flex;position: relative;z-index: 0;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-time-picker__panel__selector-content {position: relative; }.hi-v4-time-picker__panel__indicator {position: absolute;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);pointer-events: none;background: var(--hi-v4-color-primary-50, var(--hi-v4-color-brandblue-50, #e2f3fe));z-index: -1;width: 54px;height: 32px; }.hi-v4-time-picker__panel__indicator--left {border-top-left-radius: 4px;border-bottom-left-radius: 4px;left: 0; }.hi-v4-time-picker__panel__indicator--right {border-top-right-radius: 4px;border-bottom-right-radius: 4px;right: 0; }.hi-v4-time-picker__panel__indicator--middle {left: 0; }.hi-v4-time-picker__input {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;color: var(--hi-v4-color-gray-700, #1f2733); }.hi-v4-time-picker__input--disabled {color: var(--hi-v4-color-gray-400, #c9ced6); }.hi-v4-time-picker__input--not-valid {color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-time-picker__input--range .hi-v4-time-picker__input__interact-area {text-align: left; }.hi-v4-time-picker__input--fit-content .hi-v4-time-picker__input__wrapper {width: -webkit-fit-content;width: -moz-fit-content;width: fit-content; }.hi-v4-time-picker__input--size-sm {line-height: var(--hi-v4-height-6, 24px);font-size: var(--hi-v4-text-size-sm, 0.75rem); }.hi-v4-time-picker__input--size-sm .hi-v4-time-picker__input__wrapper {height: var(--hi-v4-height-6, 24px); }.hi-v4-time-picker__input--size-md {line-height: var(--hi-v4-height-8, 32px);font-size: var(--hi-v4-text-size-md, 0.875rem); }.hi-v4-time-picker__input--size-md .hi-v4-time-picker__input__wrapper {height: var(--hi-v4-height-8, 32px); }.hi-v4-time-picker__input--size-lg {line-height: var(--hi-v4-height-10, 40px);font-size: var(--hi-v4-text-size-lg, 1rem); }.hi-v4-time-picker__input--size-lg .hi-v4-time-picker__input__wrapper {height: var(--hi-v4-height-10, 40px); }.hi-v4-time-picker__input__wrapper {width: 208px;-webkit-box-sizing: border-box;box-sizing: border-box;position: relative;z-index: 0;height: 30px;line-height: 30px;padding: 0 12px; }.hi-v4-time-picker__input__shadow-text {display: inline-block;font-size: inherit;font-weight: inherit;font-family: inherit;color: transparent; }.hi-v4-time-picker__input__interact-area {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;padding: 0 12px;color: inherit;border: none;outline: none;height: 100%;font-size: inherit;background: transparent;font-weight: inherit;font-family: inherit;position: absolute;left: 0;top: 0; }.hi-v4-time-picker__input__interact-area:disabled {background: transparent; }.hi-v4-time-picker__input__interact-area::-webkit-input-placeholder {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-time-picker__input__interact-area::-moz-placeholder {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-time-picker__input__interact-area::-ms-input-placeholder {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-time-picker__input__interact-area:-ms-input-placeholder {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-time-picker__input__interact-area::placeholder {color: var(--hi-v4-color-gray-500, #929aa6); }.hi-v4-time-picker__pop-content {display: -webkit-box;display: -ms-flexbox;display: flex;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;position: relative;-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;min-width: 100%;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; }.hi-v4-time-picker__pop-content__separator {width: 1px;background-color: var(--hi-v4-color-gray-100, #f2f4f7);border-left: none;border-right: none; }";
 
-var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
+var __styleInject__ = require('inject-head-style')["default"];
 
 __styleInject__(css_248z);
 
 exports["default"] = css_248z;
-//# sourceMappingURL=index.scss.js.map

package/lib/cjs/utils/analysisFormat.js

@@ -39,4 +39,3 @@ var analysisFormat = function analysisFormat(format) {
 };
 
 exports.analysisFormat = analysisFormat;
-//# sourceMappingURL=analysisFormat.js.map

package/lib/cjs/utils/disposeInputValue.js

@@ -33,8 +33,8 @@ var disposeInputValue = function disposeInputValue(format, original) {
       return rough.slice(0, rough.length - 1);
     } // 字符串还有添加空间，则自动添加:在新字符前方
     else {
-        return rough.slice(0, rough.length - 1) + ':' + rough.slice(rough.length - 1);
-      }
+      return rough.slice(0, rough.length - 1) + ':' + rough.slice(rough.length - 1);
+    }
   } // 在某个部分只输入了一个数字，然后输入 : 想要结束这个部分
 
 
@@ -46,12 +46,11 @@ var disposeInputValue = function disposeInputValue(format, original) {
     } // 输入没有达到最大，则，此时输入 : 是有效的
     // 自动补充此章节，添加 0
     else {
-        return rough.slice(0, rough.length - 2) + '0' + rough.slice(rough.length - 2, rough.length);
-      }
+      return rough.slice(0, rough.length - 2) + '0' + rough.slice(rough.length - 2, rough.length);
+    }
   }
 
   return rough;
 };
 
 exports.disposeInputValue = disposeInputValue;
-//# sourceMappingURL=disposeInputValue.js.map

package/lib/cjs/utils/generateSelectorData.js

@@ -55,4 +55,3 @@ var generateSelectorData = function generateSelectorData(info) {
 };
 
 exports.generateSelectorData = generateSelectorData;
-//# sourceMappingURL=generateSelectorData.js.map

package/lib/cjs/utils/getFormatDefault.js

@@ -18,4 +18,3 @@ var getFormatDefault = function getFormatDefault(format) {
 };
 
 exports.getFormatDefault = getFormatDefault;
-//# sourceMappingURL=getFormatDefault.js.map

package/lib/cjs/utils/getNowString.js

@@ -29,4 +29,3 @@ var getNowString = function getNowString(formatString) {
 };
 
 exports.getNowString = getNowString;
-//# sourceMappingURL=getNowString.js.map

package/lib/cjs/utils/getRange.js

@@ -32,4 +32,3 @@ var getRange = function getRange(min, max) {
 };
 
 exports.getRange = getRange;
-//# sourceMappingURL=getRange.js.map

package/lib/cjs/utils/valueChecker.js

@@ -84,4 +84,3 @@ var valueChecker = function valueChecker(info) {
 };
 
 exports.valueChecker = valueChecker;
-//# sourceMappingURL=valueChecker.js.map

package/lib/esm/@types/index.js

@@ -16,4 +16,3 @@ var TimePickerSelectorType;
 })(TimePickerSelectorType || (TimePickerSelectorType = {}));
 
 export { TimePickerSelectorType };
-//# sourceMappingURL=index.js.map

package/lib/esm/Input.js

@@ -157,4 +157,3 @@ var Input = /*#__PURE__*/forwardRef(function (props, ref) {
 });
 Input.displayName = 'Input';
 export { Input };
-//# sourceMappingURL=Input.js.map

package/lib/esm/Panel.js

@@ -118,4 +118,3 @@ var Panel = function Panel(props) {
 };
 
 export { Panel };
-//# sourceMappingURL=Panel.js.map

package/lib/esm/PopContent.js

@@ -104,8 +104,8 @@ var PopContent = function PopContent(props) {
           result = [].concat(result, getRange(0, isLastOne ? startMinute : startMinute - 1));
         } // 开始时间大于结束时间，直接禁用所有
         else if (startHour > hour) {
-            result = [].concat(result, getRange(0, 59));
-          }
+          result = [].concat(result, getRange(0, 59));
+        }
       }
     }
 
@@ -187,4 +187,3 @@ var PopContent = function PopContent(props) {
 };
 
 export { PopContent };
-//# sourceMappingURL=PopContent.js.map

package/lib/esm/Selector.js

@@ -30,13 +30,9 @@ var Selector = function Selector(props) {
   var scrollContainerRef = useRef(null);
   var topItemGagerRef = useRef(null);
   var bottomItemGagerRef = useRef(null);
-  var lastValueMatchIndexCache = useRef(-1); // const safePadding = useMemo(
-  //   () => ((fullDisplayItemNumber - 1) * (itemHeight + ITEM_MARGIN_SIZE)) / 2,
-  //   [fullDisplayItemNumber, itemHeight]
-  // )
-
+  var lastValueMatchIndexCache = useRef(-1);
   var calcCurrentIndex = useCallback(function (scrollTop) {
-    return Math.floor(scrollTop / (topItemGagerRef.current.clientHeight + (bottomItemGagerRef.current.offsetTop - topItemGagerRef.current.offsetTop - topItemGagerRef.current.clientHeight)));
+    return Math.round(scrollTop / (topItemGagerRef.current.clientHeight + (bottomItemGagerRef.current.offsetTop - topItemGagerRef.current.offsetTop - topItemGagerRef.current.clientHeight)));
   }, []);
   var scrollToMatchIndex = useCallback(function (index) {
     if (scrollContainerRef.current) {
@@ -119,4 +115,3 @@ var Selector = function Selector(props) {
 };
 
 export { Selector, SelectorPosition };
-//# sourceMappingURL=Selector.js.map

package/lib/esm/TimePicker.js

@@ -12,7 +12,7 @@ import { getPrefixCls, cx } from '@hi-ui/classname';
 import { __DEV__ } from '@hi-ui/env';
 import { Input } from './Input.js';
 import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state';
-import { PopperPortal } from '@hi-ui/popper';
+import { Popper } from '@hi-ui/popper';
 import { CloseCircleFilled, TimeOutlined } from '@hi-ui/icons';
 import { PopContent } from './PopContent.js';
 import { valueChecker } from './utils/valueChecker.js';
@@ -80,7 +80,9 @@ var TimePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
       inputReadonly = _ref$inputReadonly === void 0 ? false : _ref$inputReadonly,
       overlay = _ref.overlay,
       _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'md' : _ref$size;
+      size = _ref$size === void 0 ? 'md' : _ref$size,
+      _ref$invalid = _ref.invalid,
+      invalid = _ref$invalid === void 0 ? false : _ref$invalid;
   var i18n = useLocaleContext();
   var confirmText = i18n.get('timePicker.ok');
   var nowText = i18n.get('timePicker.now');
@@ -101,6 +103,10 @@ var TimePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
     });
     notifyOutside && notifyOutside(result.length > 1 ? result : result[0]);
   }, [notifyOutside]);
+  var isInSingleValueFormat = useMemo(function () {
+    var singleFormat = ['HH', 'mm', 'ss'];
+    return singleFormat.includes(format);
+  }, [format]);
 
   var _useUncontrolledState = useUncontrolledState(formatUncontrolledValue, formatControlledValue, formatNotifyOutside),
       value = _useUncontrolledState[0],
@@ -189,14 +195,13 @@ var TimePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
       setShowPopper = _useState4[1];
 
   var showPopperRef = useRef(false);
-  var cls = cx(prefixCls, className, prefixCls + "--appearance-" + appearance, (_cx = {}, _cx[prefixCls + "--active"] = showPopper && !disabled, _cx[prefixCls + "--disabled"] = disabled, _cx[prefixCls + "--input-not-valid"] = !isInputValid, _cx));
+  var cls = cx(prefixCls, className, prefixCls + "--appearance-" + appearance, (_cx = {}, _cx[prefixCls + "--active"] = showPopper && !disabled, _cx[prefixCls + "--disabled"] = disabled, _cx[prefixCls + "--input-not-valid"] = !isInputValid || invalid, _cx));
   var functionButtons = useMemo(function () {
     return /*#__PURE__*/React.createElement("div", {
       className: prefixCls + "__pop-function-buttons"
     }, /*#__PURE__*/React.createElement(Button, {
-      className: prefixCls + "__pop-confirm-button",
+      className: prefixCls + "__pop-confirm-btn",
       type: 'primary',
-      size: "sm",
       disabled: !isInputValid,
       onClick: function onClick() {
         // 合法，才去通知外部
@@ -209,15 +214,17 @@ var TimePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
         showPopperRef.current = false;
         setShowPopper(false);
       }
-    }, confirmText), type === 'single' && /*#__PURE__*/React.createElement("div", {
-      className: prefixCls + "__pop-now-button",
+    }, confirmText), type === 'single' && !isInSingleValueFormat && /*#__PURE__*/React.createElement(Button, {
+      className: prefixCls + "__pop-now-btn",
+      appearance: "link",
+      type: "primary",
       onClick: function onClick() {
-        onCacheChange([getNowString(format)]);
+        onChange([getNowString(format)]);
         showPopperRef.current = false;
         setShowPopper(false);
       }
     }, nowText));
-  }, [confirmText, nowText, prefixCls, isInputValid, type, format, onCacheChange, cacheValue, value, onChange, validChecker]);
+  }, [confirmText, nowText, prefixCls, isInputValid, type, format, cacheValue, value, onChange, validChecker, isInSingleValueFormat]);
   return /*#__PURE__*/React.createElement("div", {
     ref: ref,
     role: role,
@@ -260,7 +267,7 @@ var TimePicker = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onClick: function onClick() {
       onCacheChange(type === 'single' ? [''] : ['', '']);
     }
-  }) : /*#__PURE__*/React.createElement(TimeOutlined, null))), /*#__PURE__*/React.createElement(PopperPortal, Object.assign({}, overlay || {}, {
+  }) : /*#__PURE__*/React.createElement(TimeOutlined, null))), /*#__PURE__*/React.createElement(Popper, Object.assign({}, overlay || {}, {
     unmountOnClose: false,
     visible: showPopper && !disabled,
     attachEl: attachEl,
@@ -313,4 +320,3 @@ if (__DEV__) {
 }
 
 export { TimePicker, timePickerPrefix };
-//# sourceMappingURL=TimePicker.js.map

package/lib/esm/hooks/useFilter.js

@@ -30,4 +30,3 @@ var useFilter = function useFilter(original) {
 };
 
 export { useFilter };
-//# sourceMappingURL=useFilter.js.map

package/lib/esm/index.js

@@ -11,4 +11,3 @@ import './styles/index.scss.js';
 export { PopContent as TimePickerPopContent } from './PopContent.js';
 export { TimePickerSelectorType } from './@types/index.js';
 export { TimePicker, TimePicker as default, timePickerPrefix } from './TimePicker.js';
-//# sourceMappingURL=index.js.map