@innovaccer/design-system 2.13.5 → 2.13.6

package/dist/index.js

@@ -1,8 +1,8 @@
 
   /**
-   * Generated on: 1668603336407 
+   * Generated on: 1670480135361 
    *      Package: @innovaccer/design-system
-   *      Version: v2.13.5
+   *      Version: v2.13.6
    *      License: MIT
    *         Docs: https://innovaccer.github.io/design-system
    */
@@ -1722,6 +1722,16 @@
           cursor = _p[0],
           setCursor = _p[1];
 
+      var _q = React__namespace.useState(),
+          minHeight = _q[0],
+          setMinHeight = _q[1];
+
+      var getMinHeight = function getMinHeight() {
+        var dropdownWrapper = document.querySelector('.Dropdown-wrapper');
+        var minHeight = dropdownWrapper === null || dropdownWrapper === void 0 ? void 0 : dropdownWrapper.offsetHeight;
+        minHeight && setMinHeight(minHeight);
+      };
+
       React__namespace.useEffect(function () {
         var _a;
 
@@ -1738,6 +1748,7 @@
             minWidth: minWidth ? minWidth : popperMinWidth,
             maxWidth: maxWidth ? maxWidth : '100%'
           };
+          requestAnimationFrame(getMinHeight);
           setPopoverStyle(popperWrapperStyle);
 
           if (scrollIndex && tempSelected.length === 0) {
@@ -1754,10 +1765,10 @@
       React__namespace.useEffect(function () {
         if (firstEnabledOption !== cursor) setCursor(firstEnabledOption);
       }, [firstEnabledOption]);
-      var _q = props.triggerSize,
-          triggerSize = _q === void 0 ? 'regular' : _q,
-          _r = props.placeholder,
-          placeholder = _r === void 0 ? 'Select' : _r,
+      var _r = props.triggerSize,
+          triggerSize = _r === void 0 ? 'regular' : _r,
+          _s = props.placeholder,
+          placeholder = _s === void 0 ? 'Select' : _s,
           icon = props.icon,
           error = props.error,
           disabled = props.disabled,
@@ -1782,7 +1793,14 @@
       var dropdownStyle = {
         maxHeight: maxHeight,
         overflowY: 'auto',
-        overflowX: 'hidden'
+        overflowX: 'hidden',
+        minHeight: minHeight
+      };
+      var loaderStyle = {
+        maxHeight: minHeight ? minHeight : maxHeight,
+        overflowY: 'auto',
+        overflowX: 'hidden',
+        minHeight: minHeight
       };
 
       var getDropdownClass = function getDropdownClass(index, isGroup) {
@@ -2000,7 +2018,7 @@
             className: 'Dropdown-loading'
           }, /*#__PURE__*/React__namespace.createElement("div", {
             className: "Dropdown-wrapper",
-            style: dropdownStyle
+            style: loaderStyle
           }, renderLoading(loadersCount)));
         }
 
@@ -2008,7 +2026,8 @@
           var _c = props.noResultMessage,
               noResultMessage = _c === void 0 ? 'No result found' : _c;
           return /*#__PURE__*/React__namespace.createElement("div", {
-            className: 'Dropdown-errorWrapper',
+            className: "Dropdown-wrapper",
+            style: dropdownStyle,
             "data-test": "DesignSystem-Dropdown--errorWrapper"
           }, /*#__PURE__*/React__namespace.createElement("div", {
             className: 'Option'
@@ -5559,14 +5578,16 @@
           disabled = props.disabled,
           readOnly = props.readOnly,
           valueProp = props.value,
-          rest = __rest(props, ["size", "defaultValue", "name", "placeholder", "icon", "prefix", "suffix", "error", "min", "max", "onChange", "onClick", "onBlur", "onFocus", "className", "autoFocus", "disabled", "readOnly", "value"]);
+          _f = props.showActionButton,
+          showActionButton = _f === void 0 ? true : _f,
+          rest = __rest(props, ["size", "defaultValue", "name", "placeholder", "icon", "prefix", "suffix", "error", "min", "max", "onChange", "onClick", "onBlur", "onFocus", "className", "autoFocus", "disabled", "readOnly", "value", "showActionButton"]);
 
       var ref = React__namespace.useRef(null);
       var isUncontrolled = valueProp === undefined;
 
-      var _f = React__namespace.useState(valueProp || defaultValue),
-          value = _f[0],
-          setValue = _f[1];
+      var _g = React__namespace.useState(valueProp || defaultValue),
+          value = _g[0],
+          setValue = _g[1];
 
       React__namespace.useImperativeHandle(forwardedRef, function () {
         return ref.current;
@@ -5585,7 +5606,7 @@
       }, [valueProp]);
       var baseProps = extractBaseProps(props);
       var classes = classNames__default["default"]((_a = {}, _a['MetricInput'] = true, _a["MetricInput--" + size] = size, _a['MetricInput--disabled'] = disabled || readOnly, _a['MetricInput--error'] = error, _a), className);
-      var inputClass = classNames__default["default"]((_b = {}, _b['MetricInput-input'] = true, _b["MetricInput-input--" + size] = size, _b));
+      var inputClass = classNames__default["default"]((_b = {}, _b['MetricInput-input'] = true, _b["MetricInput-input--" + size] = size, _b["mr-4"] = !suffix && !showActionButton && size === 'regular', _b["mr-6"] = !suffix && !showActionButton && size === 'large', _b));
       var iconClass = classNames__default["default"]((_c = {}, _c['MetricInput-icon'] = true, _c["MetricInput-icon--" + size] = size, _c));
       var actionButton = classNames__default["default"]((_d = {}, _d['p-0'] = true, _d["MetricInput-arrowIcon--" + size] = size, _d['ml-4'] = size === 'regular', _d['ml-6'] = size === 'large', _d));
 
@@ -5636,6 +5657,12 @@
         }
       };
 
+      var handleKeyDown = function handleKeyDown(e) {
+        if (showActionButton) {
+          onKeyDown(e);
+        } else e.preventDefault();
+      };
+
       var actionButtonSize = size === 'large' ? 'regular' : 'tiny';
       return /*#__PURE__*/React__namespace.createElement("div", {
         "data-test": "DesignSystem-MetricInputWrapper",
@@ -5669,13 +5696,13 @@
         onBlur: onBlur,
         onClick: onClick,
         onFocus: onFocus,
-        onKeyDown: onKeyDown
+        onKeyDown: handleKeyDown
       })), suffix && /*#__PURE__*/React__namespace.createElement(Text, {
         "data-test": "DesignSystem-MetricInput--suffix",
         className: size === 'regular' ? 'ml-4' : 'ml-5',
         size: size,
         appearance: "subtle"
-      }, suffix), /*#__PURE__*/React__namespace.createElement("div", {
+      }, suffix), showActionButton && /*#__PURE__*/React__namespace.createElement("div", {
         className: "MetricInput-arrowIcons"
       }, /*#__PURE__*/React__namespace.createElement(Button, {
         icon: "keyboard_arrow_up",
@@ -9049,7 +9076,7 @@
           onClick: function onClick(event) {
             if (onClose) onClose(event, 'IconClick');
           }
-        })))), children && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, headerOptions || footerOptions || footer || header ? /*#__PURE__*/React__namespace.createElement(OverlayBody, {
+        })))), open && children && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, headerOptions || footerOptions || footer || header ? /*#__PURE__*/React__namespace.createElement(OverlayBody, {
           className: bodyClass
         }, this.props.children) : children), (!!footer || !!footerOptions) && /*#__PURE__*/React__namespace.createElement(OverlayFooter, __assign({
           "data-test": "DesignSystem-Modal--footer"
@@ -11285,8 +11312,6 @@
     var Tabs = function Tabs(props) {
       var _a, _b, _c;
 
-      var _d, _e, _f;
-
       var children = props.children,
           withSeparator = props.withSeparator,
           onTabChange = props.onTabChange,
@@ -11297,9 +11322,9 @@
       var inlineComponent = children ? filterInlineComponent(children) : /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null);
       var totalTabs = tabs.length;
 
-      var _g = React__namespace.useState(props.activeIndex && props.activeIndex < totalTabs ? props.activeIndex : 0),
-          activeIndex = _g[0],
-          setActiveTab = _g[1];
+      var _d = React__namespace.useState(props.activeIndex && props.activeIndex < totalTabs ? props.activeIndex : 0),
+          activeIndex = _d[0],
+          setActiveTab = _d[1];
 
       React__namespace.useEffect(function () {
         if (props.activeIndex !== undefined && props.activeIndex < totalTabs) {
@@ -11315,17 +11340,24 @@
         return classNames__default["default"]((_a = {}, _a['Tab-pills'] = true, _a['Tab-pills--disabled'] = disabled, _a));
       };
 
-      var activeTab;
-      var activeTabClass;
+      var getActiveTabClass = function getActiveTabClass() {
+        var _a;
+
+        var activeTab;
+        var activeTabClass;
 
-      if ('props' in tabs[activeIndex]) {
-        activeTab = tabs[activeIndex];
-        activeTabClass = (_d = activeTab.props) === null || _d === void 0 ? void 0 : _d.className;
-      } else {
-        activeTab = tabs[activeIndex];
-        activeTabClass = activeTab.className;
-      }
+        if (tabs && tabs.length && tabs[activeIndex] && 'props' in tabs[activeIndex]) {
+          activeTab = tabs[activeIndex];
+          activeTabClass = (_a = activeTab.props) === null || _a === void 0 ? void 0 : _a.className;
+        } else {
+          activeTab = tabs[activeIndex];
+          activeTabClass = activeTab && activeTab.className;
+        }
+
+        return activeTabClass;
+      };
 
+      var activeTabClass = getActiveTabClass();
       var tabContentClass = classNames__default["default"]((_c = {}, _c['TabsWrapper-content'] = true, _c["" + activeTabClass] = activeTabClass, _c));
 
       var tabClickHandler = function tabClickHandler(tabIndex, isKeyboard) {
@@ -11470,19 +11502,10 @@
         className: wrapperClass
       }), /*#__PURE__*/React__namespace.createElement("div", {
         className: headerClass
-      }, renderTabs, inlineComponent), children && ((_e = tabs[activeIndex].props) === null || _e === void 0 ? void 0 : _e.disabled) ? /*#__PURE__*/React__namespace.createElement("div", {
-        className: "h-100 pb-5",
-        style: {
-          backgroundColor: 'var(--secondary-lightest)'
-        }
-      }, /*#__PURE__*/React__namespace.createElement(EmptyState, {
-        title: "There's a problem loading this page.",
-        description: "Tab is disabled and you are not authorized to see the content of this tab",
-        size: "large"
-      })) : children && !((_f = tabs[activeIndex].props) === null || _f === void 0 ? void 0 : _f.disabled) ? /*#__PURE__*/React__namespace.createElement("div", {
+      }, renderTabs, inlineComponent), children && /*#__PURE__*/React__namespace.createElement("div", {
         className: tabContentClass,
         "data-test": "DesignSystem-Tabs--Content"
-      }, tabs[activeIndex]) : null);
+      }, tabs[activeIndex]));
     };
     Tabs.displayName = 'Tabs';
     Tabs.defaultProps = {
@@ -12705,12 +12728,15 @@
       return sizes[cellType];
     }
 
-    var updateBatchData = function updateBatchData(data, rowIndexes, dataUpdate) {
+    var updateBatchData = function updateBatchData(data, rowIndexes, dataUpdate, selectDisabledRow) {
       var updatedData = __spreadArrays(data);
 
       for (var _i = 0, rowIndexes_1 = rowIndexes; _i < rowIndexes_1.length; _i++) {
         var rowIndex = rowIndexes_1[_i];
-        updatedData[rowIndex] = __assign(__assign({}, updatedData[rowIndex]), dataUpdate);
+
+        if (data[rowIndex].disabled && selectDisabledRow || !data[rowIndex].disabled) {
+          updatedData[rowIndex] = __assign(__assign({}, updatedData[rowIndex]), dataUpdate);
+        }
       }
 
       return updatedData;
@@ -12817,7 +12843,11 @@
     var getTotalPages = function getTotalPages(totalRecords, pageSize) {
       return Math.ceil(totalRecords / pageSize);
     };
-    var getSelectAll = function getSelectAll(data) {
+    var getSelectAll = function getSelectAll(tableData, selectDisabledRow) {
+      var data = tableData.filter(function (d) {
+        return d.disabled && selectDisabledRow || !d.disabled;
+      });
+
       if (data.length) {
         var anyUnSelected = data.some(function (d) {
           return !d._selected;
@@ -13323,7 +13353,8 @@
           setExpanded = _a[1];
 
       var rowClasses = classNames__default["default"]('Grid-row', 'Grid-row--body', {
-        'Grid-row--selected': data._selected
+        'Grid-row--selected': data._selected,
+        'Grid-row--disabled': data.disabled
       });
       var onClickHandler = React__namespace.useCallback(function () {
         if (type === 'resource' && !loading) {
@@ -13395,6 +13426,7 @@
       return /*#__PURE__*/React__namespace.createElement("div", {
         className: wrapperClasses
       }, /*#__PURE__*/React__namespace.createElement("div", {
+        "data-test": "DesignSystem-Grid-row",
         className: rowClasses,
         onClick: onClickHandler,
         ref: rowRef
@@ -14157,7 +14189,8 @@
           updateSearchTerm = props.updateSearchTerm,
           dynamicColumn = props.dynamicColumn,
           allowSelectAll = props.allowSelectAll,
-          showFilters = props.showFilters;
+          showFilters = props.showFilters,
+          customSelectionLabel = props.customSelectionLabel;
 
       var _c = React__namespace.useState(false),
           selectAllRecords = _c[0],
@@ -14219,12 +14252,13 @@
         if (updateSchema) updateSchema(newSchema);
       };
 
+      var customLabel = customSelectionLabel ? customSelectionLabel : 'item';
       var selectedCount = data.filter(function (d) {
         return d._selected;
       }).length;
       var startIndex = (page - 1) * pageSize + 1;
       var endIndex = Math.min(page * pageSize, totalRecords);
-      var label = error ? 'Showing 0 items' : withCheckbox && selectedCount ? selectAllRecords ? "Selected all " + totalRecords + " item" + getPluralSuffix(totalRecords) : "Selected " + selectedCount + " item" + getPluralSuffix(totalRecords) + " on this page" : withPagination ? "Showing " + startIndex + "-" + endIndex + " of " + totalRecords + " item" + getPluralSuffix(totalRecords) : "Showing " + totalRecords + " item" + getPluralSuffix(totalRecords);
+      var label = error ? "Showing 0 " + customLabel + "s" : withCheckbox && selectedCount ? selectAllRecords ? "Selected all " + totalRecords + " " + customLabel + getPluralSuffix(totalRecords) : "Selected " + selectedCount + " " + customLabel + getPluralSuffix(totalRecords) + " on this page" : withPagination ? "Showing " + startIndex + "-" + endIndex + " of " + totalRecords + " " + customLabel + getPluralSuffix(totalRecords) : "Showing " + totalRecords + " " + customLabel + getPluralSuffix(totalRecords);
       return /*#__PURE__*/React__namespace.createElement("div", {
         className: "Header"
       }, /*#__PURE__*/React__namespace.createElement("div", {
@@ -14241,7 +14275,8 @@
         onClear: function onClear() {
           return updateSearchTerm && updateSearchTerm('');
         },
-        disabled: loading && !hasSchema(schema)
+        disabled: loading && !hasSchema(schema),
+        autoComplete: "off"
       })), showFilters && filterSchema.length > 0 && /*#__PURE__*/React__namespace.createElement("div", {
         className: "Header-dropdown"
       }, /*#__PURE__*/React__namespace.createElement("div", {
@@ -14291,7 +14326,7 @@
         onClick: function onClick() {
           return setSelectAllRecords(true);
         }
-      }, "Select all " + totalRecords + " items") : /*#__PURE__*/React__namespace.createElement(Button, {
+      }, "Select all " + totalRecords + " " + customLabel + "s") : /*#__PURE__*/React__namespace.createElement(Button, {
         "data-test": "DesignSystem-Table-Header--clearSelectionItemsButton",
         size: "tiny",
         onClick: function onClick() {
@@ -14406,7 +14441,7 @@
                   _this.setState({
                     data: data,
                     schema: schema,
-                    selectAll: getSelectAll(data),
+                    selectAll: getSelectAll(data, _this.props.selectDisabledRow),
                     totalRecords: res.count,
                     loading: false,
                     error: !data.length,
@@ -14439,7 +14474,7 @@
               totalRecords: totalRecords,
               error: !renderedData.length,
               errorType: 'NO_RECORDS_FOUND',
-              selectAll: getSelectAll(renderedData),
+              selectAll: getSelectAll(renderedData, _this.props.selectDisabledRow),
               schema: renderedSchema,
               data: renderedData
             });
@@ -14455,11 +14490,11 @@
           if (rowIndexes >= 0) {
             newData = updateBatchData(data, indexes, {
               _selected: selected
-            });
+            }, _this.props.selectDisabledRow);
 
             _this.setState({
               data: newData,
-              selectAll: getSelectAll(newData)
+              selectAll: getSelectAll(newData, _this.props.selectDisabledRow)
             });
           }
 
@@ -14480,17 +14515,23 @@
           });
           var newData = updateBatchData(data, indexes, {
             _selected: selected
+          }, _this.props.selectDisabledRow);
+          var selectedIndex = [];
+          newData.forEach(function (item, key) {
+            if (item._selected) {
+              selectedIndex.push(key);
+            }
           });
 
           if (onSelect) {
-            onSelect(indexes, selected, newData.filter(function (d) {
+            onSelect(selectedIndex, selected, newData.filter(function (d) {
               return d._selected;
             }), selectAll);
           }
 
           _this.setState({
             data: newData,
-            selectAll: getSelectAll(newData)
+            selectAll: getSelectAll(newData, _this.props.selectDisabledRow)
           });
         };
 
@@ -14558,7 +14599,7 @@
         var _this = this;
 
         if (!this.state.async) {
-          if (prevProps.loading !== this.props.loading || prevProps.error !== this.props.error || this.props.schema !== prevProps.schema) {
+          if (prevProps.loading !== this.props.loading || prevProps.error !== this.props.error) {
             var _a = this.props,
                 _b = _a.data,
                 data = _b === void 0 ? [] : _b,
@@ -15317,7 +15358,7 @@
           size = props.size;
       var baseProps = extractBaseProps(props);
       var InlineMessageClass = classNames__default["default"]((_a = {}, _a['InlineMessage'] = true, _a), className);
-      var IconClass = classNames__default["default"]((_b = {}, _b['InlineMessage-icon'] = true, _b['InlineMessage-icon--warning'] = appearance === 'warning', _b));
+      var IconClass = classNames__default["default"]((_b = {}, _b['InlineMessage-icon--warning'] = appearance === 'warning', _b['InlineMessage-icon--small'] = size === 'small', _b['InlineMessage-icon--regular'] = size === 'regular', _b));
       var DescriptionClass = classNames__default["default"]((_c = {}, _c["InlineMessage-text--" + appearance] = appearance, _c));
       var IconSize = size === 'small' ? 14 : 16;
       var TextWeight = size === 'small' ? 'medium' : undefined;
@@ -15505,7 +15546,7 @@
     };
     HelpText.displayName = 'HelpText';
 
-    var version = "2.13.5";
+    var version = "2.13.6";
 
     exports.Avatar = Avatar;
     exports.AvatarGroup = AvatarGroup;