@activecollab/components 2.0.2 → 2.0.4

package/dist/index.js

@@ -733,7 +733,7 @@
       }
     }, [disableCloseOnEsc, onClose, onKeyDown]);
     var handleClick = React.useCallback(function (event) {
-      event === null || event === void 0 ? void 0 : event.stopPropagation();
+      event === null || event === void 0 || event.stopPropagation();
       typeof onClick === "function" && onClick(event);
     }, [onClick]);
     return /*#__PURE__*/React__default["default"].createElement(Portal, null, /*#__PURE__*/React__default["default"].createElement(FocusLock__default["default"], {
@@ -881,11 +881,11 @@
     var handleRef = useForkRef(handleRefRef, elementRef);
     var handleOpen = React.useCallback(function (event) {
       var _target$props;
-      event === null || event === void 0 ? void 0 : event.preventDefault();
-      event === null || event === void 0 ? void 0 : event.stopPropagation();
+      event === null || event === void 0 || event.preventDefault();
+      event === null || event === void 0 || event.stopPropagation();
       setOpen(true);
       typeof onOpen === "function" && onOpen();
-      typeof (target === null || target === void 0 ? void 0 : (_target$props = target.props) === null || _target$props === void 0 ? void 0 : _target$props.onClick) === "function" && target.props.onClick(event);
+      typeof (target === null || target === void 0 || (_target$props = target.props) === null || _target$props === void 0 ? void 0 : _target$props.onClick) === "function" && target.props.onClick(event);
     }, [onOpen, target === null || target === void 0 ? void 0 : target.props]);
     var handleClose = React.useCallback(function () {
       if (typeof onBeforeClose === "function" && !onBeforeClose()) {
@@ -907,7 +907,7 @@
         isOpenAtLeastOnce.current = true;
       } else if (!open && isOpenAtLeastOnce.current) {
         var _elementRef$current;
-        (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.focus();
+        (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 || _elementRef$current.focus();
         isOpenAtLeastOnce.current = false;
       }
     }, [open]);
@@ -7930,9 +7930,9 @@
     React.useEffect(function () {
       var diffWidth = childWidth - parentWidth;
       if (diffWidth > 0) {
-        var _offsetWidth, _olRef$current, _olRef$current$queryS, _olRef$current$queryS2, _olRef$current2, _breadcrumbItems$leng;
-        var separatorWidth = (_offsetWidth = (_olRef$current = olRef.current) === null || _olRef$current === void 0 ? void 0 : (_olRef$current$queryS = _olRef$current.querySelectorAll(`[data-role="separator"]`)[0]) === null || _olRef$current$queryS === void 0 ? void 0 : _olRef$current$queryS.offsetWidth) !== null && _offsetWidth !== void 0 ? _offsetWidth : 0;
-        var breadcrumbItems = (_olRef$current$queryS2 = (_olRef$current2 = olRef.current) === null || _olRef$current2 === void 0 ? void 0 : _olRef$current2.querySelectorAll(`[data-role="item"]`)) !== null && _olRef$current$queryS2 !== void 0 ? _olRef$current$queryS2 : [];
+        var _offsetWidth, _olRef$current, _olRef$current$queryS, _olRef$current2, _breadcrumbItems$leng;
+        var separatorWidth = (_offsetWidth = (_olRef$current = olRef.current) === null || _olRef$current === void 0 || (_olRef$current = _olRef$current.querySelectorAll(`[data-role="separator"]`)[0]) === null || _olRef$current === void 0 ? void 0 : _olRef$current.offsetWidth) !== null && _offsetWidth !== void 0 ? _offsetWidth : 0;
+        var breadcrumbItems = (_olRef$current$queryS = (_olRef$current2 = olRef.current) === null || _olRef$current2 === void 0 ? void 0 : _olRef$current2.querySelectorAll(`[data-role="item"]`)) !== null && _olRef$current$queryS !== void 0 ? _olRef$current$queryS : [];
         var childWidthCollection = [];
         var maxIndex = ((_breadcrumbItems$leng = breadcrumbItems === null || breadcrumbItems === void 0 ? void 0 : breadcrumbItems.length) !== null && _breadcrumbItems$leng !== void 0 ? _breadcrumbItems$leng : 1) - 1;
         var currentIndex = 0;
@@ -10839,7 +10839,7 @@
     React.useEffect(function () {
       if (hover === id && type !== "single") {
         var _document$getElementB;
-        (_document$getElementB = document.getElementById(`${id}`)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.focus();
+        (_document$getElementB = document.getElementById(`${id}`)) === null || _document$getElementB === void 0 || _document$getElementB.focus();
       }
     }, [hover, type, id]);
     var isAllOptionsChecked = React.useMemo(function () {
@@ -11401,7 +11401,7 @@
       }
       if (handleEmptyAction) {
         var _inputEl$current;
-        inputEl === null || inputEl === void 0 ? void 0 : (_inputEl$current = inputEl.current) === null || _inputEl$current === void 0 ? void 0 : _inputEl$current.focus();
+        inputEl === null || inputEl === void 0 || (_inputEl$current = inputEl.current) === null || _inputEl$current === void 0 || _inputEl$current.focus();
         setFilter("");
         handleEmptyAction(filter);
       }
@@ -11756,7 +11756,7 @@
     var handleRef = useForkRef(ref, intInputRef);
     var handleWrapperClick = React.useCallback(function () {
       var _intInputRef$current;
-      (_intInputRef$current = intInputRef.current) === null || _intInputRef$current === void 0 ? void 0 : _intInputRef$current.focus();
+      (_intInputRef$current = intInputRef.current) === null || _intInputRef$current === void 0 || _intInputRef$current.focus();
       wrapperClick && wrapperClick();
     }, [wrapperClick]);
     return /*#__PURE__*/React__default["default"].createElement(StyledInputWrapper, {
@@ -12020,7 +12020,7 @@
   };
   OptionContent.displayName = "OptionContent";
 
-  var _excluded$M = ["type", "mode", "target", "options", "selected", "position", "onChange", "actionIcon", "actionLabel", "placeholder", "emptyAction", "disableSearch", "forceCloseMenu", "selectClassName", "keepSameOptionsOrder", "onSelectOpen", "onSelectClose", "renderOption", "handleDefaultOptionChange", "preselectDefaultValue"];
+  var _excluded$M = ["type", "mode", "target", "options", "selected", "position", "onChange", "placeholder", "emptyAction", "disableSearch", "forceCloseMenu", "selectClassName", "keepSameOptionsOrder", "onSelectOpen", "onSelectClose", "renderOption", "handleDefaultOptionChange", "preselectDefaultValue", "startAdornment", "endAdornment"];
   var Select = function Select(_ref) {
     var _ref$type = _ref.type,
       type = _ref$type === void 0 ? "single" : _ref$type,
@@ -12035,8 +12035,6 @@
       onChange = _ref$onChange === void 0 ? function () {
         return null;
       } : _ref$onChange,
-      actionIcon = _ref.actionIcon,
-      actionLabel = _ref.actionLabel,
       placeholder = _ref.placeholder,
       _ref$emptyAction = _ref.emptyAction,
       emptyAction = _ref$emptyAction === void 0 ? function () {
@@ -12054,7 +12052,12 @@
       handleDefaultOptionChange = _ref.handleDefaultOptionChange,
       _ref$preselectDefault = _ref.preselectDefaultValue,
       preselectDefaultValue = _ref$preselectDefault === void 0 ? type === "single" : _ref$preselectDefault,
+      startAdornment = _ref.startAdornment,
+      endAdornment = _ref.endAdornment,
       prop = _objectWithoutProperties(_ref, _excluded$M);
+    if (disableSearch && (startAdornment || endAdornment)) {
+      console.warn("Adornments are not visible when search bar is hidden");
+    }
     var childNode = React.useRef();
     var elementRef = React.useRef(null);
     var handleRef = useForkRef(childNode, elementRef);
@@ -12096,7 +12099,7 @@
     }, [allOptionValues, selectedOptions]);
     React.useEffect(function () {
       var _childNode$current;
-      open && (childNode === null || childNode === void 0 ? void 0 : (_childNode$current = childNode.current) === null || _childNode$current === void 0 ? void 0 : _childNode$current.focus());
+      open && (childNode === null || childNode === void 0 || (_childNode$current = childNode.current) === null || _childNode$current === void 0 ? void 0 : _childNode$current.focus());
     }, [childNode, open]);
     var handleChange = React.useCallback(function (selectedValue) {
       if (forceCloseMenu) {
@@ -12131,7 +12134,7 @@
           position,
           onPopperOpen: function onPopperOpen() {
             var _elementRef$current;
-            return elementRef === null || elementRef === void 0 ? void 0 : (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.focus();
+            return elementRef === null || elementRef === void 0 || (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.focus();
           }
         };
       }
@@ -12145,7 +12148,7 @@
       if (forceCloseMenu) {
         setOpen(false);
       }
-      (_formRef$current = formRef.current) === null || _formRef$current === void 0 ? void 0 : _formRef$current.reset();
+      (_formRef$current = formRef.current) === null || _formRef$current === void 0 || _formRef$current.reset();
     }, [emptyAction, forceCloseMenu]);
     var handleDefaultOptionChangeCallback = React.useCallback(function () {
       if (type === "multiple") {
@@ -12192,15 +12195,10 @@
     }, [isAllOptionsChecked, renderOption, selectedOptions, type, someOptionsChecked]);
     return /*#__PURE__*/React__default["default"].createElement(Tag, props, /*#__PURE__*/React__default["default"].createElement("div", null, !disableSearch ? /*#__PURE__*/React__default["default"].createElement(StyledSelectForm, {
       ref: formRef
-    }, /*#__PURE__*/React__default["default"].createElement(StyledSelectInput, {
+    }, startAdornment, /*#__PURE__*/React__default["default"].createElement(StyledSelectInput, {
       ref: handleRef,
       placeholder: placeholder
-    }), actionIcon && actionLabel && /*#__PURE__*/React__default["default"].createElement(Tooltip, {
-      popperTooltipStyle: {
-        zIndex: 1301
-      },
-      title: actionLabel
-    }, /*#__PURE__*/React__default["default"].createElement("div", null, actionIcon)), actionIcon && !actionLabel && actionIcon) : null, /*#__PURE__*/React__default["default"].createElement(Autocomplete, _extends({}, prop, {
+    }), endAdornment) : null, /*#__PURE__*/React__default["default"].createElement(Autocomplete, _extends({}, prop, {
       clearInputOnSelect: true,
       inputEl: childNode,
       handleEmptyAction: handleEmptyAction,
@@ -12773,7 +12771,7 @@
               var isHoursSelected = selectionStart < newDotsIndex;
               var newSelectionStart = isHoursSelected ? 0 : newDotsIndex + 1;
               var selectionEnd = isHoursSelected ? newDotsIndex : newValue.length;
-              (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.setSelectionRange(newSelectionStart, selectionEnd);
+              (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.setSelectionRange(newSelectionStart, selectionEnd);
             });
           }
         }
@@ -12801,7 +12799,7 @@
       }
       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();
+        (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.select();
         return;
       }
       var input = e.target;
@@ -12816,7 +12814,7 @@
             if (isMinutesSelected) {
               var _inputRef$current3;
               e.preventDefault();
-              (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.setSelectionRange(0, newDotsIndex);
+              (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.setSelectionRange(0, newDotsIndex);
             }
           } else {
             var _newDotsIndex = currentValue.indexOf(":");
@@ -12824,7 +12822,7 @@
             if (isHoursSelected) {
               var _inputRef$current4;
               e.preventDefault();
-              (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.setSelectionRange(_newDotsIndex + 1, currentValue.length);
+              (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 || _inputRef$current4.setSelectionRange(_newDotsIndex + 1, currentValue.length);
             }
           }
         }
@@ -12863,10 +12861,10 @@
         var dotsIndex = currentValue.indexOf(":");
         if (selectionStart < dotsIndex) {
           var _inputRef$current6;
-          (_inputRef$current6 = inputRef.current) === null || _inputRef$current6 === void 0 ? void 0 : _inputRef$current6.setSelectionRange(0, dotsIndex);
+          (_inputRef$current6 = inputRef.current) === null || _inputRef$current6 === 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);
+          (_inputRef$current7 = inputRef.current) === null || _inputRef$current7 === void 0 || _inputRef$current7.setSelectionRange(dotsIndex + 1, currentValue.length);
         }
       }
       if (typeof onClick === "function") {
@@ -12876,7 +12874,7 @@
     var handleDoubleClick = React.useCallback(function () {
       if (inputRef.current) {
         var _inputRef$current8;
-        (_inputRef$current8 = inputRef.current) === null || _inputRef$current8 === void 0 ? void 0 : _inputRef$current8.select();
+        (_inputRef$current8 = inputRef.current) === null || _inputRef$current8 === void 0 || _inputRef$current8.select();
       }
     }, [inputRef]);
     var inputProps = React.useMemo(function () {
@@ -15537,8 +15535,8 @@
     }, [focused, open, selectedName, type]);
     React.useEffect(function () {
       var _childNode$current, _childNode$current2;
-      open && (childNode === null || childNode === void 0 ? void 0 : (_childNode$current = childNode.current) === null || _childNode$current === void 0 ? void 0 : _childNode$current.focus());
-      !open && (childNode === null || childNode === void 0 ? void 0 : (_childNode$current2 = childNode.current) === null || _childNode$current2 === void 0 ? void 0 : _childNode$current2.blur());
+      open && (childNode === null || childNode === void 0 || (_childNode$current = childNode.current) === null || _childNode$current === void 0 ? void 0 : _childNode$current.focus());
+      !open && (childNode === null || childNode === void 0 || (_childNode$current2 = childNode.current) === null || _childNode$current2 === void 0 ? void 0 : _childNode$current2.blur());
     }, [childNode, open]);
     React.useEffect(function () {
       setValue(selectedName);
@@ -15551,7 +15549,7 @@
       }
     }, [focused, isFirstRender, onClose, open]);
     var emptyAction = React.useCallback(function (v) {
-      handleEmptyAction === null || handleEmptyAction === void 0 ? void 0 : handleEmptyAction(v);
+      handleEmptyAction === null || handleEmptyAction === void 0 || handleEmptyAction(v);
       setOpen(false);
     }, [handleEmptyAction]);
     var handleChange = React.useCallback(function (selectedValue) {
@@ -15591,11 +15589,11 @@
       if (typeof onDeselect === "function") {
         onDeselect();
       } else if (type === "multiple") {
-        onChange === null || onChange === void 0 ? void 0 : onChange([]);
+        onChange === null || onChange === void 0 || onChange([]);
       } else {
-        onChange === null || onChange === void 0 ? void 0 : onChange("");
+        onChange === null || onChange === void 0 || onChange("");
       }
-      onClear === null || onClear === void 0 ? void 0 : onClear();
+      onClear === null || onClear === void 0 || onClear();
       setOpen(false);
     }, [type, onChange, onClear, onDeselect]);
     var handleMouseDown = React.useCallback(function (e) {
@@ -15736,7 +15734,7 @@
       className: classNames__default["default"]("c-combo-box-input-wrapper", inputWrapperClassName),
       onClick: function onClick() {
         var _elementRef$current;
-        (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.click();
+        (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 || _elementRef$current.click();
       },
       $_css3: autoSize === "auto" ? "auto" : undefined,
       $_css4: autoSize === "auto" && scrollWrapper ? "scroll" : undefined,
@@ -17073,7 +17071,7 @@
     var height = dimensions === null || dimensions === void 0 ? void 0 : dimensions.height;
     React.useEffect(function () {
       if (height && height > 0 && !indexPage) {
-        onHeightChange === null || onHeightChange === void 0 ? void 0 : onHeightChange(height);
+        onHeightChange === null || onHeightChange === void 0 || onHeightChange(height);
       }
     }, [height, onHeightChange, indexPage]);
     return /*#__PURE__*/React__default["default"].createElement("div", {
@@ -17943,14 +17941,14 @@
     var listWrapperRef = React.useRef(null);
     var scrollToTop = function scrollToTop() {
       var _listWrapperRef$curre;
-      (_listWrapperRef$curre = listWrapperRef.current) === null || _listWrapperRef$curre === void 0 ? void 0 : _listWrapperRef$curre.scrollTo({
+      (_listWrapperRef$curre = listWrapperRef.current) === null || _listWrapperRef$curre === void 0 || _listWrapperRef$curre.scrollTo({
         top: 0,
         behavior: "smooth"
       });
     };
     var scrollToBottom = function scrollToBottom() {
       var _listWrapperRef$curre2;
-      (_listWrapperRef$curre2 = listWrapperRef.current) === null || _listWrapperRef$curre2 === void 0 ? void 0 : _listWrapperRef$curre2.scrollTo({
+      (_listWrapperRef$curre2 = listWrapperRef.current) === null || _listWrapperRef$curre2 === void 0 || _listWrapperRef$curre2.scrollTo({
         top: listWrapperRef.current.scrollHeight,
         behavior: "smooth"
       });