@titaui/pc 1.11.4-0 → 1.11.4-0.beta-2

package/lib/components/time-picker/time-picker.js

@@ -21,7 +21,7 @@ var _utils = require("./utils");
 
 require("./index.css");
 
-var _excluded = ["hourStep", "minuteStep", "onChange", "value"];
+var _excluded = ["disabled", "enableKeyBoard", "timeFormat", "hourStep", "minuteStep", "onChange", "value"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -31,6 +31,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -48,56 +50,70 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 var TimePicker = function TimePicker(props) {
-  var _props$hourStep = props.hourStep,
+  var disabled = props.disabled,
+      _props$enableKeyBoard = props.enableKeyBoard,
+      enableKeyBoard = _props$enableKeyBoard === void 0 ? true : _props$enableKeyBoard,
+      _props$timeFormat = props.timeFormat,
+      timeFormat = _props$timeFormat === void 0 ? 'hh:mm' : _props$timeFormat,
+      _props$hourStep = props.hourStep,
       hourStep = _props$hourStep === void 0 ? 1 : _props$hourStep,
       _props$minuteStep = props.minuteStep,
       minuteStep = _props$minuteStep === void 0 ? 1 : _props$minuteStep,
       onChange = props.onChange,
       _props$value = props.value,
-      value = _props$value === void 0 ? "00:00" : _props$value,
+      value = _props$value === void 0 ? '00:00' : _props$value,
       restProps = _objectWithoutProperties(props, _excluded);
 
-  var _useState = (0, _react.useState)((0, _moment["default"])(value, "hh:mm").format("HH")),
+  var _useState = (0, _react.useState)(''),
       _useState2 = _slicedToArray(_useState, 2),
-      hour = _useState2[0],
-      setHour = _useState2[1];
+      timeSetingtType = _useState2[0],
+      setTimeSettingType = _useState2[1];
 
-  var _useState3 = (0, _react.useState)((0, _moment["default"])(value, "hh:mm").format("mm")),
+  var _useState3 = (0, _react.useState)(false),
       _useState4 = _slicedToArray(_useState3, 2),
-      minute = _useState4[0],
-      setMinute = _useState4[1];
-
-  var _useState5 = (0, _react.useState)(),
-      _useState6 = _slicedToArray(_useState5, 2),
-      target = _useState6[0],
-      setTarget = _useState6[1];
-
-  var _useState7 = (0, _react.useState)(false),
-      _useState8 = _slicedToArray(_useState7, 2),
-      visible = _useState8[0],
-      setVisible = _useState8[1];
+      visible = _useState4[0],
+      setVisible = _useState4[1];
 
-  var hourRef = (0, _react.useRef)(hour);
+  var hourRef = (0, _react.useRef)((0, _moment["default"])(value || '00:00', timeFormat).format('HH'));
   var hInputRef = (0, _react.useRef)();
   var mInputRef = (0, _react.useRef)();
-  var minuteRef = (0, _react.useRef)(minute);
+  var minuteRef = (0, _react.useRef)((0, _moment["default"])(value || '00:00', timeFormat).format('mm'));
   var triggerRef = (0, _react.useRef)();
   var hours = (0, _utils.getHours)(hourStep);
   var minutes = (0, _utils.getMinutes)(minuteStep);
 
-  var onHourInputBlur = function onHourInputBlur() {
-    setHour(function (prevHour) {
-      var nextHour = (Array(2).join("0") + prevHour).slice(-2);
-
-      if (Number(prevHour) > Number(hours[hours.length - 1])) {
-        nextHour = "0".concat(prevHour.slice(0, 1));
-      }
+  var onTimeChange = function onTimeChange() {
+    return onChange === null || onChange === void 0 ? void 0 : onChange("".concat(hourRef.current, ":").concat(minuteRef.current));
+  };
 
-      return nextHour;
+  var onInputClickHandler = function onInputClickHandler(type) {
+    return setTimeSettingType(function () {
+      return type;
     });
+  };
+
+  var onKeyDownHandler = function onKeyDownHandler(e) {
+    var keyCode = e.keyCode;
 
-    if (target === "hour" && hInputRef.current) {
-      hInputRef.current.focus();
+    if ([_utils.KEYCODE.directionLeft, _utils.KEYCODE.directionRight].includes(keyCode)) {
+      setTimeSettingType(_utils.TargetMapByKeyCode[keyCode]);
+    }
+
+    if ([_utils.KEYCODE.directionUp, _utils.KEYCODE.directionDown].includes(keyCode)) {
+      switch (timeSetingtType) {
+        case 'hour':
+          hourRef.current = setTimeOnKeyboardDirectionChange(keyCode, 'hour', hourRef.current);
+          break;
+
+        case 'minute':
+          minuteRef.current = setTimeOnKeyboardDirectionChange(keyCode, 'minute', minuteRef.current);
+          break;
+
+        default:
+          break;
+      }
+
+      onTimeChange();
     }
   };
 
@@ -105,44 +121,14 @@ var TimePicker = function TimePicker(props) {
     var v = e.target.value;
 
     if (!Number.isNaN(Number(v))) {
-      setHour(v);
+      // setHour(v);
+      hourRef.current = v;
       setTimeout(function () {
         if (hInputRef.current) {
           hInputRef.current.blur();
         }
       }, 1000);
-    }
-  };
-
-  var onHourInputClick = function onHourInputClick() {
-    setTarget("hour");
-    setTimeout(function () {
-      if (hInputRef.current) {
-        hInputRef.current.focus();
-      }
-    }, 0);
-  };
-
-  var onMinuteInputBlur = function onMinuteInputBlur() {
-    setMinute(function (prevMinute) {
-      var nextMinute = prevMinute;
-      minutes.forEach(function (m, i) {
-        var mNum = Number(m);
-        var nextMinuteNum = Number(nextMinute);
-
-        if (mNum === nextMinuteNum) {
-          nextMinute = m;
-        } else if (mNum < nextMinuteNum && Number(minutes[i + 1]) > nextMinuteNum) {
-          nextMinute = m;
-        } else if (nextMinuteNum > Number(minutes[minutes.length - 1])) {
-          nextMinute = "00";
-        }
-      });
-      return nextMinute;
-    });
-
-    if (target === "minute" && mInputRef.current) {
-      mInputRef.current.focus();
+      onTimeChange();
     }
   };
 
@@ -150,26 +136,19 @@ var TimePicker = function TimePicker(props) {
     var v = e.target.value;
 
     if (!Number.isNaN(Number(v))) {
-      setMinute(v);
+      // setMinute(v);
+      minuteRef.current = v;
       setTimeout(function () {
         if (mInputRef.current) {
           mInputRef.current.blur();
         }
       }, 1000);
+      onTimeChange();
     }
   };
 
-  var onMinuteInputClick = function onMinuteInputClick() {
-    setTarget("minute");
-    setTimeout(function () {
-      if (mInputRef.current) {
-        mInputRef.current.focus();
-      }
-    }, 0);
-  };
-
   var setTimeOnKeyboardDirectionChange = function setTimeOnKeyboardDirectionChange(keyCode, type, currTime) {
-    var datas = JSON.parse(JSON.stringify(type === "hour" ? hours : minutes));
+    var datas = JSON.parse(JSON.stringify(type === 'hour' ? hours : minutes));
     var currentTimeIndex;
     datas.forEach(function (item, index) {
       if (item === currTime) {
@@ -179,31 +158,31 @@ var TimePicker = function TimePicker(props) {
         var nextData = datas[nextIndex];
 
         if (!nextData || nextData && nextData > currTime) {
-          currentTimeIndex = keyCode === 38 || !nextData ? index : nextIndex;
+          currentTimeIndex = keyCode === _utils.KEYCODE.directionUp || !nextData ? index : nextIndex;
         }
       }
     });
 
-    if (keyCode === 38) {
+    if (keyCode === _utils.KEYCODE.directionUp) {
       // 方向键：↑
       var nextIndex = currentTimeIndex + 1 === datas.length ? 0 : currentTimeIndex + 1;
       var nextValue = datas[nextIndex];
 
       if (currentTimeIndex > -1 && !!nextValue) {
-        if (type === "minute" && nextValue === datas[0]) {
-          setHour(setTimeOnKeyboardDirectionChange(keyCode, "hour", hourRef.current));
+        if (type === 'minute' && nextValue === datas[0]) {
+          hourRef.current = setTimeOnKeyboardDirectionChange(keyCode, 'hour', hourRef.current);
         }
 
         return nextValue;
       }
-    } else if (keyCode === 40) {
+    } else if (keyCode === _utils.KEYCODE.directionDown) {
       // 方向键：↓
       var prevIndex = currentTimeIndex - 1 < 0 ? datas.length - 1 : currentTimeIndex - 1;
       var prevValue = datas[prevIndex];
 
       if (currentTimeIndex > -1 && !!prevValue) {
-        if (type === "minute" && prevValue === datas[datas.length - 1]) {
-          setHour(setTimeOnKeyboardDirectionChange(keyCode, "hour", hourRef.current));
+        if (type === 'minute' && prevValue === datas[datas.length - 1]) {
+          hourRef.current = setTimeOnKeyboardDirectionChange(keyCode, 'hour', hourRef.current);
         }
 
         return prevValue;
@@ -213,66 +192,47 @@ var TimePicker = function TimePicker(props) {
     return currTime;
   };
 
-  var handleKeyDown = function handleKeyDown(e) {
-    if (e.keyCode === 37 || e.keyCode === 39) {
-      setTarget(_utils.TargetMapByKeyCode[e.keyCode]);
-    }
-
-    if (e.keyCode !== 38 && e.keyCode !== 40) return;
-
-    switch (target) {
-      case "hour":
-        setHour(setTimeOnKeyboardDirectionChange(e.keyCode, "hour", hourRef.current));
-        break;
-
-      case "minute":
-        setMinute(setTimeOnKeyboardDirectionChange(e.keyCode, "minute", minuteRef.current));
-        break;
-
-      default:
-        break;
-    }
+  var showSelectorPop = function showSelectorPop() {
+    return setVisible(true);
   };
 
-  (0, _react.useEffect)(function () {
-    document.addEventListener("keydown", handleKeyDown);
-    return function () {
-      document.removeEventListener("keydown", handleKeyDown);
-    };
-  }, [target]);
-  (0, _react.useEffect)(function () {
-    hourRef.current = hour;
-    minuteRef.current = minute;
-    onChange === null || onChange === void 0 ? void 0 : onChange("".concat(hour, ":").concat(minute));
-  }, [hour, minutes]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: _utils.TimePickerClass
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(_utils.TimePickerClass, "-trigger"),
+    className: (0, _classnames["default"])("".concat(_utils.TimePickerClass, "-trigger"), _defineProperty({}, "".concat(_utils.TimePickerClass, "-trigger--disabled"), disabled)),
     ref: triggerRef
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(_utils.TimePickerClass, "-inputs")
-  }, /*#__PURE__*/_react["default"].createElement(_timerPickerInput["default"], {
+    className: (0, _classnames["default"])("".concat(_utils.TimePickerClass, "-inputs"), _defineProperty({}, "".concat(_utils.TimePickerClass, "-inputs--placeholder"), !value)),
+    onClick: function onClick() {
+      return !enableKeyBoard && showSelectorPop();
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_timerPickerInput["default"], _extends({
     className: (0, _classnames["default"])("".concat(_utils.TimePickerClass, "-input"), {
-      active: target === "hour"
+      active: enableKeyBoard && timeSetingtType === 'hour'
     }),
+    disabled: disabled,
     maxLength: 2,
-    onBlur: onHourInputBlur,
     onChange: onHourInputChange,
-    onClick: onHourInputClick,
+    onClick: function onClick() {
+      return onInputClickHandler('hour');
+    },
+    onKeyDown: onKeyDownHandler,
     ref: hInputRef,
-    value: hour
-  }), /*#__PURE__*/_react["default"].createElement("span", null, ":"), /*#__PURE__*/_react["default"].createElement(_timerPickerInput["default"], {
+    value: hourRef.current
+  }, restProps)), /*#__PURE__*/_react["default"].createElement("span", null, ":"), /*#__PURE__*/_react["default"].createElement(_timerPickerInput["default"], {
     className: (0, _classnames["default"])("".concat(_utils.TimePickerClass, "-input"), {
-      active: target === "minute"
+      active: enableKeyBoard && timeSetingtType === 'minute'
     }),
+    disabled: disabled,
     maxLength: 2,
-    onBlur: onMinuteInputBlur,
     onChange: onMinuteInputChange,
-    onClick: onMinuteInputClick,
+    onClick: function onClick() {
+      return onInputClickHandler('minute');
+    },
+    onKeyDown: onKeyDownHandler,
     ref: mInputRef,
-    value: minute
-  })), /*#__PURE__*/_react["default"].createElement(_timePickerSelector["default"], _extends({
+    value: minuteRef.current
+  })), !disabled && /*#__PURE__*/_react["default"].createElement(_timePickerSelector["default"], _extends({
     popupAlign: {
       offset: [12, 8],
       overflow: {
@@ -286,20 +246,21 @@ var TimePicker = function TimePicker(props) {
       minutes: minutes
     },
     timeSetting: {
-      hour: hour,
-      setHour: setHour,
-      minute: minute,
-      setMinute: setMinute
+      hour: hourRef.current,
+      minute: minuteRef.current,
+      setTime: function setTime(time) {
+        hourRef.current = (0, _moment["default"])(time, 'HH:mm').format('HH');
+        minuteRef.current = (0, _moment["default"])(time, 'HH:mm').format('mm');
+        onChange(time);
+      }
     },
     visibleSetting: {
       visible: visible,
       setVisible: setVisible
     }
   }, restProps), /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(_utils.TimePickerClass, "-icon tu-icon-arrow-down"),
-    onClick: function onClick() {
-      setVisible(true);
-    }
+    className: "".concat(_utils.TimePickerClass, "-icon tu-icon-caret-down"),
+    onClick: showSelectorPop
   }))));
 };
 

package/lib/components/time-picker/timer-picker-input.js

@@ -32,7 +32,7 @@ var TimePickerInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
       _props$stopPropagatio = props.stopPropagation,
       stopPropagation = _props$stopPropagatio === void 0 ? true : _props$stopPropagatio,
       _props$type = props.type,
-      type = _props$type === void 0 ? "text" : _props$type,
+      type = _props$type === void 0 ? 'text' : _props$type,
       value = props.value,
       restProps = _objectWithoutProperties(props, _excluded);
 
@@ -57,11 +57,6 @@ var TimePickerInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     onClick === null || onClick === void 0 ? void 0 : onClick(e);
   };
 
-  var onFocusHandler = function onFocusHandler(e) {
-    setSelectionRange(0);
-    onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
-  };
-
   var onChangeHandler = function onChangeHandler(e) {
     return onChange === null || onChange === void 0 ? void 0 : onChange(e);
   };
@@ -80,11 +75,12 @@ var TimePickerInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     setSelectionRange(changeTimeout);
   }, [value]);
   return /*#__PURE__*/_react["default"].createElement("input", _extends({
+    autoFocus: false,
+    autoComplete: "off",
     className: className,
     maxLength: maxLength,
     onClick: onClickHandler,
     onChange: onChangeHandler,
-    onFocus: onFocusHandler,
     ref: inputRef,
     type: type,
     value: value

package/lib/components/time-picker/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TimePickerClass = exports.TargetMapByKeyCode = void 0;
+exports.TimePickerClass = exports.TargetMapByKeyCode = exports.KEYCODE = void 0;
 exports.getHours = getHours;
 exports.getMinutes = getMinutes;
 var TimePickerClass = "tita-ui__time-picker";
@@ -38,4 +38,15 @@ function getMinutes() {
   }
 
   return minutes;
-}
+} // eslint-disable-next-line no-shadow
+
+
+var KEYCODE;
+exports.KEYCODE = KEYCODE;
+
+(function (KEYCODE) {
+  KEYCODE[KEYCODE["directionLeft"] = 37] = "directionLeft";
+  KEYCODE[KEYCODE["directionUp"] = 38] = "directionUp";
+  KEYCODE[KEYCODE["directionRight"] = 39] = "directionRight";
+  KEYCODE[KEYCODE["directionDown"] = 40] = "directionDown";
+})(KEYCODE || (exports.KEYCODE = KEYCODE = {}));

package/lib/components/user-selector/select-tree/tree-nodes/tree-person-node/index.css

@@ -14,6 +14,7 @@
   line-height: 28px;
   border-radius: 50%;
   overflow: hidden;
+  display: flex;
 }
 
 .perspm-person--small .perspm-person__info {

package/lib/components/wechat-btn/index.css

@@ -0,0 +1,14 @@
+.titaui-wechat-btn {
+  font-size: 18px;
+  color: #a4acb9;
+  margin: 0 8px;
+  cursor: pointer;
+}
+
+.titaui-wechat-btn:hover {
+  color: #2879ff;
+}
+
+.titaui-wechat-btn__chat {
+  color: #2879ff;
+}