@activecollab/components 1.0.377 → 1.0.379

package/dist/index.js

@@ -15747,7 +15747,7 @@
   var StyledSpan = styled__default["default"](Typography).withConfig({
     displayName: "Styles__StyledSpan",
     componentId: "sc-1wapx2a-1"
-  })(["visibility:hidden;display:block;padding-left:4px;padding-right:4px;padding-top:1px;padding-bottom:1px;position:relative;border:1px solid transparent;border-radius:6px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:pre;font-variant-numeric:tabular-nums;", " &:empty:before{content:\"i\";}"], function (_ref) {
+  })(["visibility:hidden;display:block;padding-left:4px;padding-right:4px;padding-top:1px;padding-bottom:1px;position:relative;border:1px solid transparent;border-radius:6px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:pre;font-variant-numeric:tabular-nums;", " &:empty:before{content:\" \";}"], function (_ref) {
     var $disabled = _ref.$disabled;
     return $disabled && styled.css(["visibility:visible;"]);
   });
@@ -15914,6 +15914,9 @@
 
   var decimalToHours = function decimalToHours(num) {
     var withLeadingZeroHours = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    if (!num) {
+      return "";
+    }
     if (typeof num === "string" && !num) {
       return withLeadingZeroHours ? "00:00" : "0:00";
     }
@@ -15971,13 +15974,13 @@
     return !Number.isInteger(num);
   };
 
-  var _excluded$c = ["value", "onCancel", "onSave", "inputProps", "allowEmptyValue", "withLeadingZero", "validation", "incrementOnlySelected", "minuteIncrement"];
-  var EditableHours = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
-    var _ref$value = _ref.value,
-      value = _ref$value === void 0 ? 0 : _ref$value,
+  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+
+  var HoursWrapper = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
+    var children = _ref.children,
+      value = _ref.value,
       onCancel = _ref.onCancel,
       onSave = _ref.onSave,
-      inputProps = _ref.inputProps,
       allowEmptyValue = _ref.allowEmptyValue,
       _ref$withLeadingZero = _ref.withLeadingZero,
       withLeadingZero = _ref$withLeadingZero === void 0 ? true : _ref$withLeadingZero,
@@ -15986,25 +15989,14 @@
       _ref$incrementOnlySel = _ref.incrementOnlySelected,
       incrementOnlySelected = _ref$incrementOnlySel === void 0 ? false : _ref$incrementOnlySel,
       _ref$minuteIncrement = _ref.minuteIncrement,
-      minuteIncrement = _ref$minuteIncrement === void 0 ? 1 : _ref$minuteIncrement,
-      rest = _objectWithoutProperties(_ref, _excluded$c);
+      minuteIncrement = _ref$minuteIncrement === void 0 ? 1 : _ref$minuteIncrement;
     var inputRef = React.useRef(null);
     var handleRef = useForkRef(ref, inputRef);
-    var _useState = React.useState(function () {
-        if (value !== undefined) {
-          return decimalToHours(value, withLeadingZero);
-        }
-        return "";
-      }),
+    var _useState = React.useState(decimalToHours(value, withLeadingZero)),
       _useState2 = _slicedToArray(_useState, 2),
       currentValue = _useState2[0],
       setCurrentValue = _useState2[1];
-    var _useState3 = React.useState(function () {
-        if (value !== undefined) {
-          return decimalToHours(value, withLeadingZero);
-        }
-        return "";
-      }),
+    var _useState3 = React.useState(decimalToHours(value, withLeadingZero)),
       _useState4 = _slicedToArray(_useState3, 2),
       prevValue = _useState4[0],
       setPrevValue = _useState4[1];
@@ -16023,7 +16015,6 @@
     var handleBlur = React.useCallback(function (e) {
       if (escapeRef.current) {
         setCurrentValue(prevValue);
-        escapeRef.current = false;
       } else {
         if (e.target.value.trim().length > 0 && prevValue !== e.target.value) {
           var _value = decimalToHours(e.target.value, withLeadingZero);
@@ -16106,10 +16097,16 @@
         escapeRef.current = true;
         e.target.blur();
         typeof onCancel === "function" && onCancel();
+        escapeRef.current = false;
       }
       if (e.key === "Backspace") {
         return;
       }
+      if ((e.metaKey || e.ctrlKey) && e.key === "a") {
+        var _inputRef$current2;
+        (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.select();
+        return;
+      }
       var input = e.target;
       var start = input.selectionStart;
       var end = input.selectionEnd;
@@ -16120,17 +16117,17 @@
             var newDotsIndex = currentValue.indexOf(":");
             var isMinutesSelected = start > newDotsIndex;
             if (isMinutesSelected) {
-              var _inputRef$current2;
+              var _inputRef$current3;
               e.preventDefault();
-              (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.setSelectionRange(0, newDotsIndex);
+              (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.setSelectionRange(0, newDotsIndex);
             }
           } else {
             var _newDotsIndex = currentValue.indexOf(":");
             var isHoursSelected = start < _newDotsIndex;
             if (isHoursSelected) {
-              var _inputRef$current3;
+              var _inputRef$current4;
               e.preventDefault();
-              (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.setSelectionRange(_newDotsIndex + 1, currentValue.length);
+              (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.setSelectionRange(_newDotsIndex + 1, currentValue.length);
             }
           }
         }
@@ -16162,38 +16159,87 @@
       setCurrentValue(e.target.value);
     }, []);
     var handleClick = function handleClick() {
-      var _inputRef$current4;
-      var selectionStart = (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.selectionStart;
+      var _inputRef$current5;
+      var selectionStart = (_inputRef$current5 = inputRef.current) === null || _inputRef$current5 === void 0 ? void 0 : _inputRef$current5.selectionStart;
       if (inputRef.current && currentValue && currentValue.length > 0 && typeof selectionStart === "number") {
         var dotsIndex = currentValue.indexOf(":");
         if (selectionStart < dotsIndex) {
-          var _inputRef$current5;
-          (_inputRef$current5 = inputRef.current) === null || _inputRef$current5 === void 0 ? void 0 : _inputRef$current5.setSelectionRange(0, dotsIndex);
-        } else if (selectionStart >= dotsIndex) {
           var _inputRef$current6;
-          (_inputRef$current6 = inputRef.current) === null || _inputRef$current6 === void 0 ? void 0 : _inputRef$current6.setSelectionRange(dotsIndex + 1, currentValue.length);
+          (_inputRef$current6 = inputRef.current) === null || _inputRef$current6 === void 0 ? void 0 : _inputRef$current6.setSelectionRange(0, dotsIndex);
+        } else if (selectionStart >= dotsIndex) {
+          var _inputRef$current7;
+          (_inputRef$current7 = inputRef.current) === null || _inputRef$current7 === void 0 ? void 0 : _inputRef$current7.setSelectionRange(dotsIndex + 1, currentValue.length);
         }
       }
     };
     var handleDoubleClick = function handleDoubleClick() {
       if (inputRef.current) {
-        var _inputRef$current7;
-        (_inputRef$current7 = inputRef.current) === null || _inputRef$current7 === void 0 ? void 0 : _inputRef$current7.setSelectionRange(0, currentValue.length);
+        var _inputRef$current8;
+        (_inputRef$current8 = inputRef.current) === null || _inputRef$current8 === void 0 ? void 0 : _inputRef$current8.select();
       }
     };
-    return /*#__PURE__*/React__default["default"].createElement(EditableContent, _extends({
+    var inputProps = {
+      value: currentValue,
+      onBlur: handleBlur,
+      onKeyDown: handleKeyDown,
+      onChange: handleChange,
+      onClick: handleClick,
+      onDoubleClick: handleDoubleClick
+    };
+    if (!children) {
+      console.error("No children provided!");
+      return null;
+    }
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].Children.map(children, function (child) {
+      var el = child;
+      if (el && el.type === EditableContent) {
+        return /*#__PURE__*/React__default["default"].cloneElement(child, {
+          ref: handleRef,
+          inputProps: inputProps
+        });
+      }
+      return /*#__PURE__*/React__default["default"].cloneElement(child, _objectSpread2({
+        ref: handleRef
+      }, inputProps));
+    }));
+  });
+  HoursWrapper.displayName = "HoursWrapper";
+
+  var _excluded$c = ["value", "onCancel", "onSave", "allowEmptyValue", "withLeadingZero", "validation", "incrementOnlySelected", "minuteIncrement", "className", "inputProps"];
+  var EditableHours = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
+    var value = _ref.value,
+      onCancel = _ref.onCancel,
+      onSave = _ref.onSave,
+      allowEmptyValue = _ref.allowEmptyValue,
+      _ref$withLeadingZero = _ref.withLeadingZero,
+      withLeadingZero = _ref$withLeadingZero === void 0 ? true : _ref$withLeadingZero,
+      _ref$validation = _ref.validation,
+      validation = _ref$validation === void 0 ? validateTimeInput : _ref$validation,
+      _ref$incrementOnlySel = _ref.incrementOnlySelected,
+      incrementOnlySelected = _ref$incrementOnlySel === void 0 ? false : _ref$incrementOnlySel,
+      _ref$minuteIncrement = _ref.minuteIncrement,
+      minuteIncrement = _ref$minuteIncrement === void 0 ? 1 : _ref$minuteIncrement,
+      className = _ref.className,
+      inputProps = _ref.inputProps,
+      rest = _objectWithoutProperties(_ref, _excluded$c);
+    var inputRef = React.useRef(null);
+    var handleRef = useForkRef(ref, inputRef);
+    return /*#__PURE__*/React__default["default"].createElement(HoursWrapper, {
+      value: value,
+      onCancel: onCancel,
+      onSave: onSave,
+      incrementOnlySelected: incrementOnlySelected,
+      minuteIncrement: minuteIncrement,
+      allowEmptyValue: allowEmptyValue,
+      withLeadingZero: withLeadingZero,
+      validation: validation
+    }, /*#__PURE__*/React__default["default"].createElement(EditableContent, _extends({
       ref: handleRef,
       inputProps: _objectSpread2(_objectSpread2({}, inputProps), {}, {
-        value: currentValue,
-        onBlur: handleBlur,
-        onKeyDown: handleKeyDown,
-        onChange: handleChange,
         type: "text",
-        onClick: handleClick,
-        onDoubleClick: handleDoubleClick,
-        className: classNames__default["default"]("c-input", inputProps === null || inputProps === void 0 ? void 0 : inputProps.className)
+        className: classNames__default["default"]("c-input", className)
       })
-    }, rest));
+    }, rest)));
   });
   EditableHours.displayName = "EditableHours";