@innovaccer/design-system 2.17.0 → 2.19.0

package/dist/index.js

@@ -1,8 +1,8 @@
 
   /**
-   * Generated on: 1690223583277 
+   * Generated on: 1692978951414 
    *      Package: @innovaccer/design-system
-   *      Version: v2.17.0
+   *      Version: v2.19.0
    *      License: MIT
    *         Docs: https://innovaccer.github.io/design-system
    */
@@ -2269,12 +2269,13 @@
           _onKeyDown = _a.onKeyDown,
           _b = _a.role,
           role = _b === void 0 ? 'button' : _b,
-          rest = __rest(_a, ["onClick", "onKeyDown", "role"]);
+          tabIndex = _a.tabIndex,
+          rest = __rest(_a, ["onClick", "onKeyDown", "role", "tabIndex"]);
 
       return __assign({}, onClick ? {
         onClick: onClick,
         role: role,
-        tabIndex: 0,
+        tabIndex: tabIndex || 0,
         'aria-label': rest['aria-label'],
         onKeyDown: function onKeyDown(e) {
           if (_onKeyDown) {
@@ -2294,6 +2295,7 @@
         }
       } : {
         role: role,
+        tabIndex: tabIndex,
         'aria-label': rest['aria-label']
       });
     };
@@ -2396,7 +2398,8 @@
           className = props.className,
           selected = props.selected,
           onClose = props.onClose,
-          onClick = props.onClick;
+          onClick = props.onClick,
+          labelPrefix = props.labelPrefix;
       var baseProps = extractBaseProps(props);
 
       var iconClass = function iconClass(align) {
@@ -2430,11 +2433,16 @@
 
       var renderLabel = function renderLabel() {
         if (typeof label === 'string') {
-          return /*#__PURE__*/React__namespace.createElement(Text, {
+          return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, labelPrefix && /*#__PURE__*/React__namespace.createElement(Text, {
+            "data-test": "DesignSystem-GenericChip--LabelPrefix",
+            weight: "medium",
+            color: textColor,
+            className: "Chip-text mr-3"
+          }, labelPrefix), /*#__PURE__*/React__namespace.createElement(Text, {
             "data-test": "DesignSystem-GenericChip--Text",
             color: textColor,
             className: "Chip-text"
-          }, label);
+          }, label));
         }
 
         return label;
@@ -2478,7 +2486,8 @@
           onClose = props.onClose,
           onClick = props.onClick,
           name = props.name,
-          className = props.className;
+          className = props.className,
+          labelPrefix = props.labelPrefix;
       var baseProps = extractBaseProps(props);
 
       var onCloseHandler = function onCloseHandler() {
@@ -2505,7 +2514,8 @@
         className: chipClass,
         onClose: onCloseHandler,
         onClick: onClickHandler,
-        name: name
+        name: name,
+        labelPrefix: labelPrefix
       }));
     };
     Chip.displayName = 'Chip';
@@ -2990,7 +3000,8 @@
             showTodayDate = _b === void 0 ? true : _b,
             _c = _a.children,
             children = _c === void 0 ? /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null) : _c,
-            rest = __rest(_a, ["date", "open", "position", "inputFormat", "outputFormat", "inputOptions", "validators", "withInput", "disabledBefore", "disabledAfter", "onDateChange", "closeOnSelect", "size", "showTodayDate", "children"]);
+            view = _a.view,
+            rest = __rest(_a, ["date", "open", "position", "inputFormat", "outputFormat", "inputOptions", "validators", "withInput", "disabledBefore", "disabledAfter", "onDateChange", "closeOnSelect", "size", "showTodayDate", "children", "view"]);
 
         var date = this.state.date;
         var months = config.months;
@@ -3014,16 +3025,23 @@
           return !isTodayDateDisabled;
         };
 
+        var todayChipClass = classNames__default["default"]({
+          'd-flex justify-content-center': true,
+          'pb-5': size === 'small',
+          'pb-6': size === 'large',
+          'pt-3': size === 'large' && view === 'year'
+        });
         return /*#__PURE__*/React__namespace.createElement("div", null, /*#__PURE__*/React__namespace.createElement("div", {
           className: "d-flex"
         }, children, /*#__PURE__*/React__namespace.createElement(Calendar, __assign({}, rest, {
           size: size,
           date: currDate,
+          view: view,
           disabledBefore: dateDisabledBefore,
           disabledAfter: dateDisabledAfter,
           onDateChange: this.onDateChangeHandler
         }))), showTodayDate && /*#__PURE__*/React__namespace.createElement("div", {
-          className: "d-flex justify-content-center pb-6",
+          className: todayChipClass,
           "data-test": "DesignSystem-Select--TodaysDate-wrapper"
         }, /*#__PURE__*/React__namespace.createElement(Chip, {
           label: "Today, " + todayMonthAndDate,
@@ -3618,7 +3636,8 @@
           showDuration = props.showDuration,
           noResultMessage = props.noResultMessage,
           disabledSlotList = props.disabledSlotList,
-          fetchTimeOptions = props.fetchTimeOptions;
+          fetchTimeOptions = props.fetchTimeOptions,
+          error = props.error;
 
       var _a = React__namespace.useState(0),
           tabIndex = _a[0],
@@ -3710,7 +3729,8 @@
         staticLimit: dropdownOptionList.length,
         onPopperToggle: function onPopperToggle() {
           setOpenPopover(!openPopover);
-        }
+        },
+        error: error
       });
     };
     TimePickerWithSearch.defaultProps = {
@@ -3725,7 +3745,8 @@
           inputFormat = props.inputFormat,
           outputFormat = props.outputFormat,
           onTimeChange = props.onTimeChange,
-          timeProp = props.time;
+          timeProp = props.time,
+          error = props.error;
 
       var _a = React__namespace.useState(timeProp),
           time$1 = _a[0],
@@ -3794,6 +3815,7 @@
         onChange: onChangeHandler,
         onClear: onClearHandler,
         onBlur: onBlurHandler,
+        error: error,
         id: "parent-TimePicker"
       }));
     };
@@ -6299,6 +6321,7 @@
           'd-flex flex-column flex-grow-1': true
         }, className);
       }, [className]);
+      var isValueEqualPlaceholder = value === defaultPlaceholderValue;
       return /*#__PURE__*/React__namespace.createElement("div", {
         className: classes,
         "data-test": "DesignSystem-InputMask--Wrapper"
@@ -6308,7 +6331,7 @@
         required: required,
         onFocus: onFocusHandler,
         onChange: onChangeHandler,
-        onClear: onClearHandler,
+        onClear: !isValueEqualPlaceholder ? onClearHandler : undefined,
         onBlur: onBlurHandler,
         onPaste: onPasteHandler,
         autoComplete: 'off',
@@ -6388,7 +6411,7 @@
         "data-test": "DesignSystem-Label--Text",
         className: classes,
         componentType: "label"
-      }, rest), children), renderInfo(required, optional), info && renderIndicator(info));
+      }, rest), children, renderInfo(required, optional), info && renderIndicator(info)));
     };
     Label.displayName = 'Label';
 
@@ -8488,7 +8511,7 @@
       }, [value]);
       var ChipInputClass = classNames__default["default"]((_a = {
         ChipInput: true
-      }, _a['ChipInput--disabled'] = disabled, _a['ChipInput--withChips'] = chips.length > 0, _a), className);
+      }, _a['ChipInput--disabled'] = disabled, _a['ChipInput--withChips'] = chips && chips.length > 0, _a), className);
 
       var onUpdateChips = function onUpdateChips(updatedChips) {
         if (onChange) onChange(updatedChips);
@@ -8574,7 +8597,7 @@
           type: type,
           disabled: disabled,
           key: index,
-          className: "my-2 mx-2",
+          className: "my-3 mx-2",
           onClick: function onClick() {
             return _onClick && _onClick(chip, index);
           },
@@ -8583,11 +8606,15 @@
           }
         }, rest));
       });
-      return /*#__PURE__*/React__namespace.createElement("div", __assign({
+      return /*#__PURE__*/React__namespace.createElement("div", {
+        "data-test": "DesignSystem-ChipInput--Border",
+        className: "ChipInput-border"
+      }, /*#__PURE__*/React__namespace.createElement("div", __assign({
         "data-test": "DesignSystem-ChipInput"
       }, baseProps, {
         className: ChipInputClass,
-        onClick: onClickHandler
+        onClick: onClickHandler,
+        tabIndex: disabled ? -1 : 0
       }), /*#__PURE__*/React__namespace.createElement("div", {
         className: "ChipInput-wrapper"
       }, chips && chips.length > 0 && chipComponents, /*#__PURE__*/React__namespace.createElement("input", {
@@ -8595,7 +8622,7 @@
         ref: inputRef,
         className: "ChipInput-input",
         autoFocus: autoFocus,
-        placeholder: placeholder,
+        placeholder: chips && chips.length > 0 ? '' : placeholder,
         disabled: disabled,
         value: inputValue,
         onBlur: onBlur,
@@ -8605,10 +8632,11 @@
       })), chips.length > 0 && /*#__PURE__*/React__namespace.createElement(Icon, {
         "data-test": "DesignSystem-ChipInput--Icon",
         name: "close",
-        appearance: "subtle",
+        appearance: disabled ? 'disabled' : 'subtle',
         className: "ChipInput-icon",
-        onClick: onDeleteAllHandler
-      }));
+        onClick: onDeleteAllHandler,
+        tabIndex: disabled ? -1 : 0
+      })));
     };
     ChipInput.displayName = 'ChipInput';
     ChipInput.defaultProps = {
@@ -10520,15 +10548,10 @@
             position: "right",
             className: "px-6 py-6 d-flex align-items-center",
             on: "hover"
-          }, /*#__PURE__*/React__namespace.createElement(Icon, {
-            name: "error",
-            appearance: 'alert',
-            className: "mr-4"
-          }), /*#__PURE__*/React__namespace.createElement(Text, {
-            "data-test": "DesignSystem-EditableInput--ErrorPopper",
-            appearance: "destructive",
-            weight: "medium"
-          }, errorMessage)) : inputComponent;
+          }, /*#__PURE__*/React__namespace.createElement(InlineMessage, {
+            appearance: "alert",
+            description: errorMessage
+          })) : inputComponent;
         }
 
         return /*#__PURE__*/React__namespace.createElement("div", {
@@ -13426,22 +13449,6 @@
     }));
     var GridProvider = context.Provider;
 
-    var GridNestedRow = function GridNestedRow(props) {
-      var context$1 = React__namespace.useContext(context);
-      var schema = context$1.schema,
-          loading = context$1.loading,
-          nestedRowRenderer = context$1.nestedRowRenderer;
-      var data = props.data,
-          rowIndex = props.rowIndex;
-      if (nestedRowRenderer) return nestedRowRenderer({
-        data: data,
-        schema: schema,
-        loading: loading,
-        rowIndex: rowIndex
-      });
-      return null;
-    };
-
     var HeaderCell = function HeaderCell(props) {
       var context$1 = React__namespace.useContext(context);
       var schema = props.schema,
@@ -13626,7 +13633,8 @@
           schema = props.schema,
           expandedState = props.expandedState,
           rowIndex = props.rowIndex,
-          colIndex = props.colIndex;
+          colIndex = props.colIndex,
+          nestedRowData = props.nestedRowData;
       var size = context$1.size,
           loading = context$1.loading,
           nestedRows = context$1.nestedRows;
@@ -13641,20 +13649,15 @@
         loading: loading,
         expanded: expanded
       };
-      var nestedProps = {
-        data: data,
-        rowIndex: rowIndex
-      };
-      var isNestedRowDisabled = !GridNestedRow(nestedProps);
       return /*#__PURE__*/React__namespace.createElement("div", {
         className: "Grid-cellContent"
-      }, colIndex === 0 && nestedRows && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, !isNestedRowDisabled ? /*#__PURE__*/React__namespace.createElement(Icon, {
+      }, colIndex === 0 && nestedRows && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, nestedRowData ? /*#__PURE__*/React__namespace.createElement(Icon, {
         className: 'Grid-nestedRowTrigger',
         name: expanded ? 'keyboard_arrow_up' : 'keyboard_arrow_down',
         size: 20,
         appearance: 'default',
         onClick: function onClick(e) {
-          if (!isNestedRowDisabled) {
+          if (nestedRowData) {
             e.stopPropagation();
             setExpanded(!expanded);
           }
@@ -13680,7 +13683,8 @@
           onMenuChange = _a.onMenuChange,
           onFilterChange = _a.onFilterChange,
           updateColumnSchema = _a.updateColumnSchema,
-          reorderColumn = _a.reorderColumn;
+          reorderColumn = _a.reorderColumn,
+          nestedRowData = _a.nestedRowData;
       var draggable = context$1.draggable,
           separator = context$1.separator,
           nestedRows = context$1.nestedRows,
@@ -13778,7 +13782,8 @@
         colIndex: colIndex,
         data: data,
         schema: schema,
-        expandedState: expandedState
+        expandedState: expandedState,
+        nestedRowData: nestedRowData
       }));
     };
 
@@ -13854,6 +13859,24 @@
       }, renderSchema(leftPinnedSchema, !!leftPinnedSchema.length, 'left'), renderSchema(unpinnedSchema, !leftPinnedSchema.length && !!unpinnedSchema.length), renderSchema(rightPinnedSchema, false, 'right')));
     };
 
+    var GridNestedRow = function GridNestedRow(props) {
+      var context$1 = React__namespace.useContext(context);
+      var schema = context$1.schema,
+          loading = context$1.loading,
+          nestedRowRenderer = context$1.nestedRowRenderer;
+      var data = props.data,
+          rowIndex = props.rowIndex,
+          expanded = props.expanded;
+      if (nestedRowRenderer) return nestedRowRenderer({
+        data: data,
+        schema: schema,
+        loading: loading,
+        rowIndex: rowIndex,
+        expanded: expanded
+      });
+      return null;
+    };
+
     var GridRow = function GridRow(props) {
       var context$1 = React__namespace.useContext(context);
       var type = context$1.type,
@@ -13895,6 +13918,12 @@
       var unpinnedSchema = schema.filter(function (s) {
         return !s.hidden && !s.pinned;
       });
+      var nestedProps = {
+        data: data,
+        rowIndex: rI,
+        expanded: expanded
+      };
+      var nestedRowData = GridNestedRow(nestedProps);
 
       var renderCheckbox = function renderCheckbox(show) {
         if (!show || !withCheckbox) return null;
@@ -13932,7 +13961,8 @@
               firstCell: !index,
               schema: s,
               data: data,
-              expandedState: [expanded, setExpanded]
+              expandedState: [expanded, setExpanded],
+              nestedRowData: nestedRowData
             });
           }));
         }
@@ -13952,10 +13982,7 @@
         ref: rowRef
       }, renderSchema(leftPinnedSchema, !!leftPinnedSchema.length, 'left'), renderSchema(unpinnedSchema, !leftPinnedSchema.length && !!unpinnedSchema.length), renderSchema(rightPinnedSchema, false, 'right')), nestedRows && expanded && /*#__PURE__*/React__namespace.createElement("div", {
         className: "Grid-nestedRow"
-      }, /*#__PURE__*/React__namespace.createElement(GridNestedRow, {
-        data: data,
-        rowIndex: rI
-      })));
+      }, nestedRowData));
     };
     GridRow.defaultProps = {
       data: {}
@@ -16132,7 +16159,7 @@
       iconAlign: 'left'
     };
 
-    var version = "2.17.0";
+    var version = "2.19.0";
 
     exports.Avatar = Avatar;
     exports.AvatarGroup = AvatarGroup;