intelicoreact 0.2.28 → 0.2.31

package/dist/Atomic/FormElements/InputCalendar/InputCalendar.js

@@ -57,10 +57,10 @@ var InputCalendar = function InputCalendar(_ref) {
       setOpenedByOnFocus = _useState4[1];
 
   var calendarRef = (0, _react.useRef)(null);
-  var formatedMinDate = (0, _momentTimezone.default)(minDate, format).format(format) !== 'Invalid date' ? (0, _momentTimezone.default)(minDate, format).format(format) : null;
-  var formatedMaxDate = (0, _momentTimezone.default)(maxDate, format).format(format) !== 'Invalid date' ? (0, _momentTimezone.default)(maxDate, format).format(format) : null;
-  var momentMinDate = (0, _momentTimezone.default)(formatedMinDate, format).startOf('day');
-  var momentMaxDate = (0, _momentTimezone.default)(formatedMaxDate, format).startOf('day');
+  var formattedMinDate = (0, _momentTimezone.default)(minDate, format).format(format) !== 'Invalid date' ? (0, _momentTimezone.default)(minDate, format).format(format) : null;
+  var formattedMaxDate = (0, _momentTimezone.default)(maxDate, format).format(format) !== 'Invalid date' ? (0, _momentTimezone.default)(maxDate, format).format(format) : null;
+  var momentMinDate = (0, _momentTimezone.default)(formattedMinDate, format).startOf('day');
+  var momentMaxDate = (0, _momentTimezone.default)(formattedMaxDate, format).startOf('day');
   (0, _useClickOutside.useClickOutside)(calendarRef, function () {
     return setIsOpened(false);
   });
@@ -85,7 +85,18 @@ var InputCalendar = function InputCalendar(_ref) {
 
   var handleBlur = function handleBlur(e) {
     var value = e.target.value;
-    if ((0, _momentTimezone.default)(value, format).format(format) === 'Invalid date') onChange('');else if ((0, _momentTimezone.default)(value, format).startOf('day').isBefore(momentMinDate, 'days')) onChange(formatedMinDate);else if ((0, _momentTimezone.default)(value, format).endOf('day').isAfter(momentMaxDate, 'days')) onChange(formatedMaxDate);else onChange((0, _momentTimezone.default)(value, format).format(format));
+    if ((0, _momentTimezone.default)(value, format).format(format) === 'Invalid date') onChange(formattedMaxDate !== null && formattedMaxDate !== void 0 ? formattedMaxDate : '');else if ((0, _momentTimezone.default)(value, format).startOf('day').isBefore(momentMinDate, 'days')) onChange(formattedMinDate);else if ((0, _momentTimezone.default)(value, format).endOf('day').isAfter(momentMaxDate, 'days')) onChange(formattedMaxDate);else onChange((0, _momentTimezone.default)(value, format).format(format));
+  };
+
+  var onKeyUp = function onKeyUp(e) {
+    if (!isOpenedByOnFocus) {
+      if (e.key === 'Enter') e.target.blur();
+      setIsOpened(false);
+    } else if (e.target.value.replace(/[^0-9]/g, "").length === 8) {
+      e.target.blur();
+      handleBlur(e);
+      setIsOpened(false);
+    }
   };
 
   return /*#__PURE__*/_react.default.createElement("div", {
@@ -106,12 +117,7 @@ var InputCalendar = function InputCalendar(_ref) {
       setIsOpened(true);
     },
     onBlur: !isOpened ? handleBlur : function () {},
-    onKeyUp: function onKeyUp(e) {
-      if (!isOpenedByOnFocus) {
-        if (e.key === 'Enter') e.target.blur();
-        setIsOpened(false);
-      }
-    }
+    onKeyUp: onKeyUp
   }), isOpened ? /*#__PURE__*/_react.default.createElement(_Calendar.default, {
     date: getCalendarValue(value),
     setDate: function setDate(newDate) {
@@ -119,8 +125,8 @@ var InputCalendar = function InputCalendar(_ref) {
     },
     params: {
       format: format,
-      minDate: formatedMinDate,
-      maxDate: formatedMaxDate,
+      minDate: formattedMinDate,
+      maxDate: formattedMaxDate,
       momentMinDate: momentMinDate,
       momentMaxDate: momentMaxDate,
       isDontLimitFuture: isDontLimitFuture

package/dist/Atomic/FormElements/RadioInput/RadioInput.js

@@ -25,10 +25,12 @@ var RadioInput = function RadioInput(_ref) {
       disabled = _ref.disabled,
       className = _ref.className,
       value = _ref.value,
+      testId = _ref.testId,
       _ref$onChange = _ref.onChange,
       _onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange;
 
   return /*#__PURE__*/_react.default.createElement("label", {
+    "data-testid": testId ? "test-radio-input--".concat(testId) : 'test-radio-input',
     className: (0, _classnames.default)(RC, className, (0, _defineProperty2.default)({}, "".concat(RC, "_disabled"), disabled)),
     htmlFor: id
   }, /*#__PURE__*/_react.default.createElement("div", {

package/dist/Atomic/FormElements/SwitcherRadio/SwitcherRadio.js

@@ -33,6 +33,8 @@ var SwitcherRadio = function SwitcherRadio(_ref) {
       className = _ref.className,
       value = _ref.value,
       disabled = _ref.disabled,
+      _ref$isHideSwitcher = _ref.isHideSwitcher,
+      isHideSwitcher = _ref$isHideSwitcher === void 0 ? false : _ref$isHideSwitcher,
       _ref$onChange = _ref.onChange,
       _onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
       _ref$isActive = _ref.isActive,
@@ -41,30 +43,39 @@ var SwitcherRadio = function SwitcherRadio(_ref) {
       setIsActive = _ref$setIsActive === void 0 ? function () {} : _ref$setIsActive;
 
   var safelyValue = value || (options === null || options === void 0 ? void 0 : (_options$ = options[0]) === null || _options$ === void 0 ? void 0 : _options$.value) || '';
-  return /*#__PURE__*/_react.default.createElement(_SwitcherHide.default, {
-    isActive: isActive,
-    label: label,
-    hint: hint,
-    hintSide: hintSide,
-    onChange: setIsActive,
-    isLabelBold: isLabelBold,
-    className: (0, _classnames.default)(RC, className),
-    disabled: disabled
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("".concat(RC, "__wrap"), (0, _defineProperty2.default)({}, "switcher-radio_".concat(direction), direction))
-  }, options === null || options === void 0 ? void 0 : options.map(function (option) {
-    return /*#__PURE__*/_react.default.createElement(_RadioInput.default, {
-      key: option.id,
-      className: "switcher-radio__radio",
-      value: option.value,
-      name: option.name,
-      checked: safelyValue,
-      label: option.label,
-      onChange: function onChange(val) {
-        return _onChange(val);
-      }
-    });
-  })));
+
+  var renderRadioGroup = function renderRadioGroup() {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _classnames.default)("".concat(RC, "__wrap"), (0, _defineProperty2.default)({}, "switcher-radio_".concat(direction), direction))
+    }, options === null || options === void 0 ? void 0 : options.map(function (option) {
+      return /*#__PURE__*/_react.default.createElement(_RadioInput.default, {
+        key: option.id,
+        className: "switcher-radio__radio",
+        value: option.value,
+        name: option.name,
+        checked: safelyValue,
+        label: option.label,
+        onChange: function onChange(val) {
+          return _onChange(val);
+        }
+      });
+    }));
+  };
+
+  var renderSwitcher = function renderSwitcher(body) {
+    return /*#__PURE__*/_react.default.createElement(_SwitcherHide.default, {
+      isActive: isActive,
+      label: label,
+      hint: hint,
+      hintSide: hintSide,
+      onChange: setIsActive,
+      isLabelBold: isLabelBold,
+      className: (0, _classnames.default)(RC, className),
+      disabled: disabled
+    }, body);
+  };
+
+  return !isHideSwitcher ? renderSwitcher(renderRadioGroup()) : renderRadioGroup();
 };
 
 var _default = SwitcherRadio;

package/dist/Atomic/UI/AccordionTable/AccordionTable.js

@@ -0,0 +1,144 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _reactFeather = require("react-feather");
+
+var _MonoAccordion = _interopRequireDefault(require("../MonoAccordion/MonoAccordion"));
+
+require("./AccordionTable.scss");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var AccordionTable = function AccordionTable(_ref) {
+  var className = _ref.className,
+      header = _ref.header,
+      rows = _ref.rows;
+
+  var _useState = (0, _react.useState)(rows),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      accordions = _useState2[0],
+      setAccordions = _useState2[1];
+
+  var handle = {
+    accordionChange: function accordionChange(key) {
+      var newArr = accordions === null || accordions === void 0 ? void 0 : accordions.map(function (item) {
+        if (item.key === key) {
+          return _objectSpread(_objectSpread({}, item), {}, {
+            isOpen: !item.isOpen
+          });
+        } else return item;
+      });
+      setAccordions(newArr);
+    }
+  };
+
+  var getHeaderItem = function getHeaderItem(key) {
+    return header === null || header === void 0 ? void 0 : header.find(function (item) {
+      return item.key === key;
+    });
+  };
+
+  var renderTd = function renderTd(tr) {
+    var _Object$entries;
+
+    return (_Object$entries = Object.entries(tr)) === null || _Object$entries === void 0 ? void 0 : _Object$entries.map(function (_ref2) {
+      var _getHeaderItem, _getHeaderItem2;
+
+      var _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
+          key = _ref3[0],
+          value = _ref3[1];
+
+      return /*#__PURE__*/_react.default.createElement("div", {
+        key: key,
+        style: {
+          flexBasis: "".concat((_getHeaderItem = getHeaderItem(key)) === null || _getHeaderItem === void 0 ? void 0 : _getHeaderItem.width, "%")
+        },
+        className: (0, _classnames.default)('accordion-table__td', (_getHeaderItem2 = getHeaderItem(key)) === null || _getHeaderItem2 === void 0 ? void 0 : _getHeaderItem2.className)
+      }, value);
+    });
+  };
+
+  var renderTr = function renderTr(items) {
+    return items === null || items === void 0 ? void 0 : items.map(function (item) {
+      return /*#__PURE__*/_react.default.createElement("div", {
+        key: item.key,
+        className: (0, _classnames.default)('accordion-table__tr', item.className)
+      }, renderTd(item));
+    });
+  };
+
+  var defineAccordionTitle = function defineAccordionTitle(row) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      onClick: function onClick() {
+        return handle.accordionChange(row.key);
+      },
+      className: "accordion-table__accordion-label-box"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "j4"
+    }, /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronDown, {
+      className: (0, _classnames.default)('accordion-label-box__icon', {
+        'accordion-label-box__icon--open': row.isOpen
+      })
+    }), /*#__PURE__*/_react.default.createElement("span", {
+      className: "accordion-label-box__label"
+    }, row.label)), /*#__PURE__*/_react.default.createElement("div", null, row.titleContent));
+  };
+
+  (0, _react.useEffect)(function () {
+    setAccordions(rows);
+  }, [rows]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('accordion-table', className)
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "accordion-table__header"
+  }, header === null || header === void 0 ? void 0 : header.map(function (item) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        flexBasis: "".concat(item.width, "%")
+      },
+      key: item.key,
+      className: (0, _classnames.default)('accordion-table__header-item', item.className)
+    }, item.label);
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "accordion-table__body"
+  }, accordions === null || accordions === void 0 ? void 0 : accordions.map(function (row) {
+    var _row$children;
+
+    return /*#__PURE__*/_react.default.createElement(_MonoAccordion.default, {
+      key: row.key,
+      onClick: function onClick() {
+        return handle.accordionChange(row.key);
+      },
+      isOpen: row.isOpen,
+      className: (0, _classnames.default)('accordion-table__body-accordion', {
+        'accordion-table__body-accordion--closed': !row.isOpen
+      }, row.className),
+      titleJSX: defineAccordionTitle(row)
+    }, (_row$children = row.children) !== null && _row$children !== void 0 ? _row$children : renderTr(row.items));
+  })));
+};
+
+var _default = AccordionTable;
+exports.default = _default;

package/dist/Atomic/UI/AccordionTable/AccordionTable.scss

@@ -0,0 +1,151 @@
+.accordion-table {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: flex-start;
+  overflow-x: auto;
+  width: 100%;
+  min-width: 700px;
+
+  &__header {
+    display: flex;
+    flex-wrap: nowrap;
+    width: 100%;
+    height: 32px;
+  }
+
+  &__header-item {
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+    user-select: none;
+    text-transform: uppercase;
+    color: #757f8c;
+    font-size: 11px;
+    font-weight: 500;
+    padding: 5px 10px;
+    background-color: #ebeff2;
+
+    &:first-child {
+      border-top-left-radius: 8px;
+      padding-left: 15px;
+    }
+    &:last-child {
+      border-top-right-radius: 8px;
+      padding-right: 15px;
+    }
+  }
+
+  &__body {
+    width: 100%;
+  }
+
+  &__body-accordion {
+    &:not(:first-child) {
+      border-top: 1px solid #ebeff2;
+    }
+    &:last-child {
+      .mono-accordion__container {
+        border-bottom-left-radius: 8px;
+        border-bottom-right-radius: 8px;
+      }
+    }
+
+    &--closed {
+      .mono-accordion__head {
+        transition: all 0.3s ease-out;
+        box-shadow: 0px 5px 8px rgba(255, 255, 255, 0.12)!important;
+      }
+
+      .mono-accordion__container {
+        transition: all 0.3s ease-out;
+        opacity: 0;
+      }
+      &:last-child {
+        .mono-accordion__head {
+          border-bottom-left-radius: 8px;
+          border-bottom-right-radius: 8px;
+        }
+      }
+    }
+  }
+
+  &__tr {
+    display: flex;
+    width: 100%;
+
+    &:last-child {
+      .accordion-table__td {
+        border: none;
+      }
+    }
+  }
+
+  &__td {
+    padding: 15px 0px;
+    border-bottom: 1px solid #ebeff2;
+    white-space: nowrap;
+    font-size: 14px;
+    font-weight: 400;
+
+    &:first-child {
+      margin-left: 50px;
+    }
+
+    &:last-child {
+      margin-right: 15px;
+    }
+
+    &:not(:first-child):not(:last-child) {
+      padding-right: 30px;
+    }
+  }
+
+  &__accordion-label-box {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+
+  .accordion-label-box {
+    &__label {
+      user-select: none;
+    }
+    &__icon {
+      transition: all 0.2s ease-out;
+      color: #757f8c;
+      margin-right: 5px;
+      min-width: 32px;
+      max-width: 32px;
+      min-height: 16px;
+      max-height: 16px;
+
+      &--open {
+        transform: rotate(180deg);
+      }
+    }
+    &__status {
+      font-size: 12px;
+      font-weight: 400;
+    }
+  }
+
+  .mono-accordion {
+    &__head {
+      padding: 14.5px;
+      box-shadow: 0px 5px 8px rgba(39, 73, 113, 0.12);
+      background-color: #ffff;
+      position: relative;
+      z-index: 2;
+    }
+    &__container {
+      flex-direction: row;
+      position: relative;
+      background-color: #ffff;
+    }
+    &__content-wrapper {
+      width: 100%;
+      padding: 0;
+    }
+  }
+}

package/dist/Atomic/UI/MonoAccordion/MonoAccordion.js

@@ -64,7 +64,7 @@ var MonoAccordion = function MonoAccordion(_ref) {
     if (!Array.from(titleRef.current.childNodes).some(function (el) {
       return el.contains(e.target);
     })) {
-      onClick();
+      onClick(e);
       e.stopPropagation();
     } else return e;
   };

package/dist/Atomic/UI/NavLine/NavLine.js

@@ -216,18 +216,26 @@ var NavLine = function NavLine(_ref) {
   var onWheel = function onWheel(e) {
     e.preventDefault();
     e.stopPropagation();
-    var deltaY = e.deltaY;
-    deltaY > 0 ? pushScrollTask('next') : pushScrollTask('prev');
+    var deltaY = e.deltaY,
+        shiftKey = e.shiftKey;
+
+    if (shiftKey) {
+      if (deltaY > 0) pushScrollTask('next');else pushScrollTask('prev');
+    }
   };
 
   var onTabChange = function onTabChange(item) {
     onChange(item.tabId);
-  }; // useEffect(() => {
-  //   if (!wrapperRef?.current) return false;
-  //   wrapperRef?.current?.addEventListener("mousewheel", onWheel, { passive: false });
-  // }, [wrapperRef]);
-  // Count Total NavLine Items Width
+  };
 
+  (0, _react.useEffect)(function () {
+    var _wrapperRef$current;
+
+    if (!(wrapperRef !== null && wrapperRef !== void 0 && wrapperRef.current)) return false;
+    wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.addEventListener("mousewheel", onWheel, {
+      passive: false
+    });
+  }, [wrapperRef]); // Count Total NavLine Items Width
 
   (0, _react.useEffect)(function () {
     var _navLineItems$0$ref$c, _navLineItems$, _navLineItems$$ref, _navLineItems$$ref$cu;
@@ -251,9 +259,9 @@ var NavLine = function NavLine(_ref) {
   }, [navLineItems === null || navLineItems === void 0 ? void 0 : navLineItems.length]); // Count Wrapper Width
 
   (0, _react.useEffect)(function () {
-    var _wrapperRef$current$g, _wrapperRef$current, _wrapperRef$current$g2;
+    var _wrapperRef$current$g, _wrapperRef$current2, _wrapperRef$current2$;
 
-    setWrapperRefWidth((_wrapperRef$current$g = wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : (_wrapperRef$current$g2 = _wrapperRef$current.getBoundingClientRect()) === null || _wrapperRef$current$g2 === void 0 ? void 0 : _wrapperRef$current$g2.width) !== null && _wrapperRef$current$g !== void 0 ? _wrapperRef$current$g : 0);
+    setWrapperRefWidth((_wrapperRef$current$g = wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef$current2 = wrapperRef.current) === null || _wrapperRef$current2 === void 0 ? void 0 : (_wrapperRef$current2$ = _wrapperRef$current2.getBoundingClientRect()) === null || _wrapperRef$current2$ === void 0 ? void 0 : _wrapperRef$current2$.width) !== null && _wrapperRef$current$g !== void 0 ? _wrapperRef$current$g : 0);
   }, [wrapperRef]); //Init NavLine Items
 
   (0, _react.useEffect)(function () {

package/dist/Atomic/UI/Status/Status.scss

@@ -57,6 +57,11 @@
     background-color: $color--sandy-beach;
   }
 
+  &--info {
+    color: #1F7499;
+    background-color: #CDE1FF;
+  }
+
   &--number-active,
   &--Yes {
     color: $color--green-haze;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intelicoreact",
-  "version": "0.2.28",
+  "version": "0.2.31",
   "description": "",
   "main": "dist/index.js",
   "files": [