iguazio.dashboard-react-controls 2.2.19 → 2.2.21

package/dist/components/Backdrop/Backdrop.js

@@ -9,7 +9,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactTransitionGroup = require("react-transition-group");
 require("./Backdrop.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with

package/dist/components/Button/Button.js

@@ -13,7 +13,7 @@ var _types = require("../../types");
 var _constants = require("../../constants");
 require("./Button.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /*
@@ -45,21 +45,19 @@ const Button = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     variant = _constants.TERTIARY_BUTTON,
     ...restProps
   } = _ref;
-  const buttonClassName = (0, _classnames.default)('btn', "btn-".concat(variant), "btn-".concat(density), className);
+  const buttonClassName = (0, _classnames.default)('btn', `btn-${variant}`, `btn-${density}`, className);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
     ...restProps,
     className: buttonClassName,
     ref: ref,
     "data-testid": id,
-    children: [icon && iconPosition === 'left' && icon, tooltip ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+    children: [icon && iconPosition === 'left' && icon, (tooltip || label) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
       template: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextTooltipTemplate.default, {
-        text: tooltip
+        text: tooltip || label
       }),
       children: label && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         children: label
       })
-    }) : label && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      children: label
     }), icon && iconPosition === 'right' && icon]
   });
 });

package/dist/components/ConfirmDialog/ConfirmDialog.js

@@ -12,7 +12,7 @@ var _PopUpDialog = _interopRequireDefault(require("../PopUpDialog/PopUpDialog"))
 var _types = require("../../types");
 require("./confirmDialog.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with

package/dist/components/FormCheckBox/FormCheckBox.js

@@ -10,7 +10,7 @@ var _reactFinalForm = require("react-final-form");
 var _classnames = _interopRequireDefault(require("classnames"));
 require("./formCheckBox.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /*
@@ -48,7 +48,6 @@ const FormCheckBox = _ref => {
     value: inputProps.value,
     type: "checkbox",
     children: _ref2 => {
-      var _inputProps$value, _inputProps$value2;
       let {
         input
       } = _ref2;
@@ -59,13 +58,13 @@ const FormCheckBox = _ref => {
           ref: inputRef,
           className: (0, _classnames.default)(input.checked ? 'checked' : 'unchecked'),
           type: "checkbox",
-          "data-testid": name ? "".concat(name, "-form-checkbox") : 'form-checkbox',
-          id: (_inputProps$value = inputProps.value) !== null && _inputProps$value !== void 0 ? _inputProps$value : name,
+          "data-testid": name ? `${name}-form-checkbox` : 'form-checkbox',
+          id: inputProps.value ?? name,
           ...input,
           ...inputProps,
           value: String(input.checked)
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
-          htmlFor: (_inputProps$value2 = inputProps.value) !== null && _inputProps$value2 !== void 0 ? _inputProps$value2 : name,
+          htmlFor: inputProps.value ?? name,
           className: labelClassNames,
           children: [label ? label : '', children]
         })]

package/dist/components/FormChipCell/FormChip/FormChip.js

@@ -10,7 +10,7 @@ var _NewChipForm = _interopRequireDefault(require("../NewChipForm/NewChipForm"))
 var _types = require("../../../types");
 require("./formChip.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /*

package/dist/components/FormChipCell/FormChip/formChip.scss

@@ -19,6 +19,12 @@
   &__content {
     display: flex;
     align-items: center;
+
+    &-item {
+      flex: 1 1 50%;
+      max-width: fit-content;
+      align-self: flex-start;
+    }
   }
 
   &__delimiter {

package/dist/components/FormChipCell/FormChipCell.js

@@ -18,7 +18,7 @@ var _formChipCell = require("./formChipCell.util");
 var _hooks = require("../../hooks");
 require("./formChipCell.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /*
@@ -100,8 +100,7 @@ const FormChipCell = _ref => {
     });
   }, [initialValues, name, formState]);
   const handleAddNewChip = (0, _react.useCallback)((event, fields) => {
-    var _fields$value;
-    const fieldsLength = ((_fields$value = fields.value) === null || _fields$value === void 0 ? void 0 : _fields$value.length) || 0;
+    const fieldsLength = fields.value?.length || 0;
     if (!editConfig.isEdit && !editConfig.chipIndex) {
       formState.form.mutators.push(name, {
         id: fieldsLength + new Date(),
@@ -134,7 +133,7 @@ const FormChipCell = _ref => {
       key,
       value
     } = fields.value[editConfig.chipIndex];
-    const isChipNotEmpty = !!(key !== null && key !== void 0 && key.trim() && value !== null && value !== void 0 && value.trim());
+    const isChipNotEmpty = !!(key?.trim() && value?.trim());
     if (nameEvent === _constants.CLICK) {
       if (!isChipNotEmpty) {
         handleRemoveChip(event, fields, editConfig.chipIndex, isOutsideClick);
@@ -287,7 +286,7 @@ const FormChipCell = _ref => {
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: chipsClassName,
-    "data-testid": "".concat(name, "-chips"),
+    "data-testid": `${name}-chips`,
     children: [label && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "chips__label",
       children: label

package/dist/components/FormChipCell/FormChipCellView.js

@@ -18,7 +18,7 @@ var _common = require("../../utils/common.util");
 var _formChipCell = require("./formChipCell.util");
 var _add = require("../../images/add.svg");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with
@@ -70,9 +70,9 @@ const FormChipCellView = /*#__PURE__*/_react.default.forwardRef((_ref, _ref2) =>
     hiddenChipsCounterRef,
     hiddenChipsPopUpRef
   } = _ref2;
-  const buttonAddClassNames = (0, _classnames.default)('button-add', chipOptions.background && "button-add-background_".concat(chipOptions.background), chipOptions.borderColor && "button-add-border_".concat(chipOptions.borderColor), chipOptions.font && "button-add-font_".concat(chipOptions.font), chipOptions.density && "button-add-density_".concat(chipOptions.density));
+  const buttonAddClassNames = (0, _classnames.default)('button-add', chipOptions.background && `button-add-background_${chipOptions.background}`, chipOptions.borderColor && `button-add-border_${chipOptions.borderColor}`, chipOptions.font && `button-add-font_${chipOptions.font}`, chipOptions.density && `button-add-density_${chipOptions.density}`);
   const wrapperClassNames = (0, _classnames.default)('chips-wrapper', isEditable && 'fixed-max-width');
-  const chipClassNames = (0, _classnames.default)('chip', 'chip__content', isEditable && 'data-ellipsis', shortChips && 'chip_short', chips.hiddenChips && 'chip_hidden', chipOptions.density && "chip-density_".concat(chipOptions.density), chipOptions.borderRadius && "chip-border_".concat(chipOptions.borderRadius), chipOptions.background && "chip-background_".concat(chipOptions.background), chipOptions.borderColor && "chip-border_".concat(chipOptions.borderColor), chipOptions.font && "chip-font_".concat(chipOptions.font), isEditable && 'editable', (showChips || isEditable) && 'chip_visible');
+  const chipClassNames = (0, _classnames.default)('chip', 'chip__content', isEditable && 'data-ellipsis', shortChips && 'chip_short', chips.hiddenChips && 'chip_hidden', chipOptions.density && `chip-density_${chipOptions.density}`, chipOptions.borderRadius && `chip-border_${chipOptions.borderRadius}`, chipOptions.background && `chip-background_${chipOptions.background}`, chipOptions.borderColor && `chip-border_${chipOptions.borderColor}`, chipOptions.font && `chip-font_${chipOptions.font}`, isEditable && 'editable', (showChips || isEditable) && 'chip_visible');
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalFormArrays.FieldArray, {
     name: name,
     validate: validateFields,
@@ -91,20 +91,25 @@ const FormChipCellView = /*#__PURE__*/_react.default.forwardRef((_ref, _ref2) =>
           className: wrapperClassNames,
           ref: chipsWrapperRef,
           children: [fields.map((contentItem, index) => {
-            var _chips$visibleChips;
             const chipData = fields.value[index];
-            return index < ((_chips$visibleChips = chips.visibleChips) === null || _chips$visibleChips === void 0 ? void 0 : _chips$visibleChips.length) && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            return index < chips.visibleChips?.length && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: "chip-block",
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
                 hidden: editConfig.isEdit && !chipData.tooltip,
                 template: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextTooltipTemplate.default, {
                   text: chipData.tooltip || /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
                     className: "chip__content",
-                    children: [chipData.key, !chipData.isKeyOnly && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+                    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                      className: "chip__content-item",
+                      children: chipData.key
+                    }), !chipData.isKeyOnly && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
                       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
                         className: "chip__delimiter",
                         children: chipData.delimiter ? chipData.delimiter : ':'
-                      }), chipData.value]
+                      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                        className: "chip__content-item",
+                        children: chipData.value
+                      })]
                     })]
                   })
                 }),
@@ -117,13 +122,13 @@ const FormChipCellView = /*#__PURE__*/_react.default.forwardRef((_ref, _ref2) =>
                   handleRemoveChip: (event, index) => handleRemoveChip(event, fields, index),
                   handleToEditMode: handleToEditMode,
                   isEditable: isEditable,
-                  keyName: "".concat(contentItem, ".key"),
+                  keyName: `${contentItem}.key`,
                   meta: meta,
                   ref: chipsCellRef,
                   setChipsSizes: setChipsSizes,
                   setEditConfig: setEditConfig,
                   validationRules: validationRules,
-                  valueName: "".concat(contentItem, ".value")
+                  valueName: `${contentItem}.value`
                 })
               }, chipData.id)
             }, chipData.id);
@@ -141,12 +146,12 @@ const FormChipCellView = /*#__PURE__*/_react.default.forwardRef((_ref, _ref2) =>
               textOverflowEllipsis: true
             }), chips.hiddenChipsNumber && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
               ref: hiddenChipsCounterRef,
-              className: "".concat(chipClassNames, " chips_button"),
+              className: `${chipClassNames} chips_button`,
               onClick: handleShowElements,
               children: chips.hiddenChipsNumber
             })]
           }), isEditable && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-            "data-testid": "".concat(name, "-add-chip"),
+            "data-testid": `${name}-add-chip`,
             className: buttonAddClassNames,
             onClick: e => handleAddNewChip(e, fields),
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_add.ReactComponent, {})

package/dist/components/FormChipCell/HiddenChipsBlock/HiddenChipsBlock.js

@@ -13,7 +13,7 @@ var _TextTooltipTemplate = _interopRequireDefault(require("../../TooltipTemplate
 var _types = require("../../../types");
 var _hooks = require("../../../hooks");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /*
@@ -51,21 +51,20 @@ const HiddenChipsBlock = /*#__PURE__*/_react.default.forwardRef((_ref, _ref2) =>
   const chipLabelClassNames = (0, _classnames.default)('chip__label', textOverflowEllipsis && 'data-ellipsis');
   const chipValueClassNames = (0, _classnames.default)('chip__value', textOverflowEllipsis && 'data-ellipsis', chipOptions.boldValue && 'chip-value_bold');
   const generateChipData = chip => {
-    return chip.isKeyOnly ? chip.key : "".concat(chip.key).concat(chip.delimiter ? chip.delimiter : ':', " ").concat(chip.value);
+    return chip.isKeyOnly ? chip.key : `${chip.key}${chip.delimiter ? chip.delimiter : ':'} ${chip.value}`;
   };
   (0, _react.useEffect)(() => {
     if (chips.length === 0) {
       handleShowElements();
     }
   });
-  return /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+  return /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     ref: hiddenChipsPopUpRef,
     className: hiddenChipsBlockClassNames,
     onClick: event => event.stopPropagation(),
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "chip-block-hidden__scrollable-container",
-      children: chips === null || chips === void 0 ? void 0 : chips.map(element => {
-        var _element$delimiter;
+      children: chips?.map(element => {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
           template: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextTooltipTemplate.default, {
             text: element.delimiter ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
@@ -86,7 +85,7 @@ const HiddenChipsBlock = /*#__PURE__*/_react.default.forwardRef((_ref, _ref2) =>
             }), element.value && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                 className: "chip__delimiter",
-                children: (_element$delimiter = element.delimiter) !== null && _element$delimiter !== void 0 ? _element$delimiter : ':'
+                children: element.delimiter ?? ':'
               }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                 className: chipValueClassNames,
                 children: element.value

package/dist/components/FormChipCell/NewChipForm/NewChipForm.js

@@ -17,7 +17,7 @@ var _formChipCell = require("../formChipCell.util");
 var _close = require("../../../images/close.svg");
 require("./newChipForm.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /*
@@ -67,8 +67,7 @@ const NewChipForm = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   const [validationRules, setValidationRules] = (0, _react.useState)(rules);
   const [showValidationRules, setShowValidationRules] = (0, _react.useState)(false);
   const maxWidthInput = (0, _react.useMemo)(() => {
-    var _ref$current;
-    return ((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.clientWidth) - 50;
+    return ref.current?.clientWidth - 50;
   }, [ref]);
   const {
     background,
@@ -87,7 +86,7 @@ const NewChipForm = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   const refInputValue = _react.default.useRef({});
   const refInputContainer = _react.default.useRef();
   const labelKeyClassName = (0, _classnames.default)(className, !editConfig.isKeyFocused && 'item_edited', !(0, _lodash.isEmpty)((0, _lodash.get)(meta, ['error', chipIndex, 'key'], [])) && !(0, _lodash.isEmpty)(chipData.key) && !chip.disabled && 'item_edited_invalid');
-  const labelContainerClassName = (0, _classnames.default)('edit-chip-container', background && "edit-chip-container-background_".concat(background), borderColor && "edit-chip-container-border_".concat(borderColor), font && "edit-chip-container-font_".concat(font), density && "edit-chip-container-density_".concat(density), borderRadius && "edit-chip-container-border_".concat(borderRadius), (editConfig.isEdit || editConfig.isNewChip) && 'edit-chip-container_edited', chip.disabled && 'edit-chip-container_disabled edit-chip-container-font_disabled');
+  const labelContainerClassName = (0, _classnames.default)('edit-chip-container', background && `edit-chip-container-background_${background}`, borderColor && `edit-chip-container-border_${borderColor}`, font && `edit-chip-container-font_${font}`, density && `edit-chip-container-density_${density}`, borderRadius && `edit-chip-container-border_${borderRadius}`, (editConfig.isEdit || editConfig.isNewChip) && 'edit-chip-container_edited', chip.disabled && 'edit-chip-container_disabled edit-chip-container-font_disabled');
   const labelValueClassName = (0, _classnames.default)('input-label-value', !editConfig.isValueFocused && 'item_edited', !(0, _lodash.isEmpty)((0, _lodash.get)(meta, ['error', chipIndex, 'value'], [])) && !(0, _lodash.isEmpty)(chipData.value) && 'item_edited_invalid');
   const closeButtonClass = (0, _classnames.default)('item-icon-close', !chip.disabled && editConfig.chipIndex === chipIndex && isEditable && 'item-icon-close_invisible', !isEditable && 'item-icon-close_hidden');
   (0, _react.useLayoutEffect)(() => {
@@ -125,8 +124,7 @@ const NewChipForm = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   }, [editConfig.isKeyFocused, editConfig.isValueFocused, refInputKey, refInputValue, chipIndex, editConfig.chipIndex]);
   const outsideClick = (0, _react.useCallback)(event => {
     if (editConfig.chipIndex === chipIndex) {
-      var _event$path, _event$composedPath;
-      const elementPath = (_event$path = event.path) !== null && _event$path !== void 0 ? _event$path : (_event$composedPath = event.composedPath) === null || _event$composedPath === void 0 ? void 0 : _event$composedPath.call(event);
+      const elementPath = event.path ?? event.composedPath?.();
       if (!elementPath.includes(refInputContainer.current)) {
         onChange(event, _constants.CLICK, true);
         window.getSelection().removeAllRanges();
@@ -197,14 +195,11 @@ const NewChipForm = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
       }));
     } else {
       const currentWidthValueInput = (0, _formChipCell.getTextWidth)(refInputValue.current);
-      setChipData(prevState => {
-        var _refInputValue$curren;
-        return {
-          ...prevState,
-          value: refInputValue.current.value,
-          valueFieldWidth: ((_refInputValue$curren = refInputValue.current.value) === null || _refInputValue$curren === void 0 ? void 0 : _refInputValue$curren.length) <= 1 ? minWidthValueInput : currentWidthValueInput >= maxWidthInput ? maxWidthInput : currentWidthValueInput > minWidthValueInput ? currentWidthValueInput + 2 : minWidthValueInput
-        };
-      });
+      setChipData(prevState => ({
+        ...prevState,
+        value: refInputValue.current.value,
+        valueFieldWidth: refInputValue.current.value?.length <= 1 ? minWidthValueInput : currentWidthValueInput >= maxWidthInput ? maxWidthInput : currentWidthValueInput > minWidthValueInput ? currentWidthValueInput + 2 : minWidthValueInput
+      }));
     }
   }, [keyName, minWidthInput, maxWidthInput, minWidthValueInput]);
   (0, _react.useLayoutEffect)(() => {
@@ -220,10 +215,9 @@ const NewChipForm = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   (0, _react.useEffect)(() => {
     if (meta.error) {
       setValidationRules(prevState => {
-        var _prevState$selectedIn;
         return {
           ...prevState,
-          [selectedInput]: (_prevState$selectedIn = prevState[selectedInput]) === null || _prevState$selectedIn === void 0 ? void 0 : _prevState$selectedIn.map(rule => {
+          [selectedInput]: prevState[selectedInput]?.map(rule => {
             return {
               ...rule,
               isValid: (0, _lodash.isEmpty)((0, _lodash.get)(meta, ['error', editConfig.chipIndex, selectedInput], [])) ? true : !meta.error[editConfig.chipIndex][selectedInput].some(err => err && err.name === rule.name)
@@ -235,8 +229,7 @@ const NewChipForm = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
     }
   }, [meta, showValidationRules, selectedInput, editConfig.chipIndex]);
   const getValidationRules = (0, _react.useCallback)(() => {
-    var _validationRules$sele;
-    return (_validationRules$sele = validationRules[selectedInput]) === null || _validationRules$sele === void 0 ? void 0 : _validationRules$sele.map(_ref2 => {
+    return validationRules[selectedInput]?.map(_ref2 => {
       let {
         isValid = false,
         label,

package/dist/components/FormChipCell/NewChipInput/NewChipInput.js

@@ -8,7 +8,7 @@ var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactFinalForm = require("react-final-form");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with

package/dist/components/FormChipCell/formChipCell.util.js

@@ -25,7 +25,6 @@ const uniquenessError = exports.uniquenessError = {
   label: 'Key must be unique'
 };
 const getTextWidth = elementWithText => {
-  var _hiddenElement$offset;
   if (!elementWithText) {
     return 0;
   }
@@ -48,6 +47,6 @@ const getTextWidth = elementWithText => {
     document.body.append(hiddenElement);
   }
   hiddenElement.textContent = elementWithText.value;
-  return (_hiddenElement$offset = hiddenElement.offsetWidth) !== null && _hiddenElement$offset !== void 0 ? _hiddenElement$offset : 0;
+  return hiddenElement.offsetWidth ?? 0;
 };
 exports.getTextWidth = getTextWidth;

package/dist/components/FormCombobox/FormCombobox.js

@@ -22,7 +22,7 @@ var _warning = require("../../images/warning.svg");
 var _exclamationMark = require("../../images/exclamation-mark.svg");
 require("./formCombobox.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /*
@@ -157,13 +157,13 @@ const FormCombobox = _ref => {
   const handleInputChange = event => {
     const target = event.target;
     setDropdownStyle({
-      left: "".concat(target.selectionStart < 30 ? target.selectionStart : 30, "ch")
+      left: `${target.selectionStart < 30 ? target.selectionStart : 30}ch`
     });
     if (searchIsFocused) {
       setSearchIsFocused(false);
     }
     setInputValue(target.value);
-    input.onChange("".concat(selectValue.id).concat(target.value));
+    input.onChange(`${selectValue.id}${target.value}`);
     onChange && onChange(selectValue.id, target.value);
     if (dropdownList.length > 0) {
       setShowSuggestionList(true);
@@ -183,7 +183,7 @@ const FormCombobox = _ref => {
   const handleSuggestionListOptionClick = option => {
     const inputValueItems = inputValue.split('/');
     const valueIndex = inputValueItems.length - 1;
-    let formattedValue = option.customDelimiter ? inputValueItems[valueIndex].replace(new RegExp("".concat(option.customDelimiter, ".*")), '') + option.id : option.id;
+    let formattedValue = option.customDelimiter ? inputValueItems[valueIndex].replace(new RegExp(`${option.customDelimiter}.*`), '') + option.id : option.id;
     if (inputValueItems.length <= maxSuggestedMatches - 1) formattedValue += '/';
     inputValueItems[valueIndex] = formattedValue;
     if (searchIsFocused) {
@@ -191,13 +191,13 @@ const FormCombobox = _ref => {
     }
     if (inputValueItems.join('/') !== inputValue) {
       setInputValue(inputValueItems.join('/'));
-      input.onChange("".concat(selectValue.id).concat(inputValueItems.join('/')));
+      input.onChange(`${selectValue.id}${inputValueItems.join('/')}`);
       onChange && onChange(selectValue.id, inputValueItems.join('/'));
     }
     setShowSuggestionList(false);
     inputRef.current.focus();
     setDropdownStyle({
-      left: "".concat(inputRef.current.selectionStart < 30 ? inputRef.current.selectionStart : 30, "ch")
+      left: `${inputRef.current.selectionStart < 30 ? inputRef.current.selectionStart : 30}ch`
     });
   };
   const inputOnFocus = () => {
@@ -233,7 +233,7 @@ const FormCombobox = _ref => {
   const validateField = function () {
     let value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
     let allValues = arguments.length > 1 ? arguments[1] : undefined;
-    const valueToValidate = value.startsWith(selectValue.id) ? value.substring(selectValue.id.length) : value !== null && value !== void 0 ? value : '';
+    const valueToValidate = value.startsWith(selectValue.id) ? value.substring(selectValue.id.length) : value ?? '';
     let validationError = null;
     if (!(0, _lodash.isEmpty)(validationRules)) {
       const [newRules, isValidField] = (0, _validation.checkPatternsValidity)(rules, valueToValidate);
@@ -270,12 +270,11 @@ const FormCombobox = _ref => {
   const comboboxClassNames = (0, _classnames.default)(comboboxClassName, 'form-field-combobox', 'form-field', isInvalid && 'form-field-combobox_invalid');
   const iconClassNames = (0, _classnames.default)(showSelectDropdown && 'form-field-combobox__icon_open', 'form-field-combobox__icon');
   const selectValueClassNames = (0, _classnames.default)(selectValue.className);
-  const wrapperClassNames = (0, _classnames.default)('form-field__wrapper', "form-field__wrapper-".concat(density), disabled && 'form-field__wrapper-disabled', isInvalid && 'form-field__wrapper-invalid', withoutBorder && 'without-border');
+  const wrapperClassNames = (0, _classnames.default)('form-field__wrapper', `form-field__wrapper-${density}`, disabled && 'form-field__wrapper-disabled', isInvalid && 'form-field__wrapper-invalid', withoutBorder && 'without-border');
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFinalForm.Field, {
     name: name,
     validate: validateField,
     children: _ref3 => {
-      var _meta$error$label, _meta$error;
       let {
         input,
         meta
@@ -283,7 +282,7 @@ const FormCombobox = _ref => {
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: comboboxClassNames,
         ref: comboboxRef,
-        "data-testid": name ? "".concat(name, "-form-combobox") : 'form-combobox',
+        "data-testid": name ? `${name}-form-combobox` : 'form-combobox',
         children: [label && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           className: labelClassNames,
           children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
@@ -340,7 +339,7 @@ const FormCombobox = _ref => {
             })]
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
             className: inputClassNames,
-            "data-testid": name ? "".concat(name, "-form-combobox-input") : 'form-combobox-input',
+            "data-testid": name ? `${name}-form-combobox-input` : 'form-combobox-input',
             id: input.name,
             onChange: handleInputChange,
             onFocus: inputOnFocus,
@@ -364,7 +363,7 @@ const FormCombobox = _ref => {
               children: [!hideSearchInput && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
                 className: "form-field-combobox__search-wrapper",
                 children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
-                  "data-testid": name ? "".concat(name, "-form-combobox-search") : 'form-combobox-search',
+                  "data-testid": name ? `${name}-form-combobox-search` : 'form-combobox-search',
                   className: "form-field-combobox__search form-field__control",
                   onChange: suggestionListSearchChange,
                   onFocus: () => setSearchIsFocused(true),
@@ -388,7 +387,7 @@ const FormCombobox = _ref => {
             children: [isInvalid && !Array.isArray(meta.error) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
               className: "form-field__warning",
               template: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextTooltipTemplate.default, {
-                text: (_meta$error$label = (_meta$error = meta.error) === null || _meta$error === void 0 ? void 0 : _meta$error.label) !== null && _meta$error$label !== void 0 ? _meta$error$label : invalidText,
+                text: meta.error?.label ?? invalidText,
                 warning: true
               }),
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_exclamationMark.ReactComponent, {})