intelicoreact 0.1.93 → 0.1.96

package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.scss

@@ -3,6 +3,10 @@
   align-items: center;
   cursor: pointer;
 
+  input {
+    display: none;
+  }
+
   &_disabled {
     opacity: 0.5;
     pointer-events: none;

package/dist/Atomic/FormElements/Input/Input.js

@@ -122,7 +122,7 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 
       if (!isNotValidateASCII) inputValue = (0, _fieldValueFormatters.formatToOnlyASCIICodeText)(inputValue);
       if (symbolsLimit && inputValue.length > +symbolsLimit) inputValue = inputValue.substring(0, +symbolsLimit);
-      if (isPriceInput && isCropFirstNool) inputValue = inputValue[0] == 0 ? '' : (0, _fieldValueFormatters.filterNumeric)(inputValue, onlyNumbers);
+      if (isCropFirstNool && inputValue[0] == 0) return '';
       if (onlyNumbers && isOnlyString || isOnlyString) inputValue = (0, _fieldValueFormatters.formatToLetters)(inputValue, softStringMode);else if (onlyNumbers) inputValue = (0, _fieldValueFormatters.filterNumeric)(inputValue, onlyNumbers);
       onChange(inputValue.toString());
     },

package/dist/Atomic/FormElements/RangeInputs/RangeInputs.js

@@ -67,7 +67,12 @@ var RangeInputs = function RangeInputs(_ref) {
 
   var inputFromRef = (0, _react.useRef)(null);
   var inputToRef = (0, _react.useRef)(null);
-  var isValidRange = !!(valueObj !== null && valueObj !== void 0 && valueObj.from && valueObj !== null && valueObj !== void 0 && valueObj.to && +(valueObj === null || valueObj === void 0 ? void 0 : valueObj.from) <= +(valueObj === null || valueObj === void 0 ? void 0 : valueObj.to));
+
+  var isValidRange = function isValidRange(from, to) {
+    var correctFrom = +(from === null || from === void 0 ? void 0 : from.replace(/[^\d]/g, ''));
+    var correntTo = +(to === null || to === void 0 ? void 0 : to.replace(/[^\d]/g, ''));
+    return !!(correctFrom && correntTo && correctFrom <= correntTo);
+  };
 
   var valueFormatter = function valueFormatter(value) {
     if (type === 'float') return (0, _fieldValueFormatters.filterFloat)(value);else if (isPrice) return (0, _utils.addBitDepthPoints)(value.replace(/[^\d]/g, ''));else return (0, _fieldValueFormatters.formatOnlyNumbers)(value);
@@ -90,7 +95,7 @@ var RangeInputs = function RangeInputs(_ref) {
     } else if (!valueObj[oppositeKey]) {
       var mustToFocus = key === 'from' ? inputToRef.current : inputFromRef.current;
       mustToFocus.focus();
-    } else if (!isValidRange) {
+    } else if (!isValidRange(valueObj === null || valueObj === void 0 ? void 0 : valueObj.from, valueObj === null || valueObj === void 0 ? void 0 : valueObj.to)) {
       if (!(valueObj !== null && valueObj !== void 0 && valueObj.from)) setError(_objectSpread(_objectSpread({}, error), {}, {
         from: 'Invalid range'
       }));else setError(_objectSpread(_objectSpread({}, error), {}, {

package/dist/Atomic/FormElements/TieredCheckboxes/TieredCheckboxes.js

@@ -7,6 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 
 var _react = _interopRequireDefault(require("react"));
@@ -20,7 +24,8 @@ require("./TieredCheckboxes.scss");
 var TieredCheckboxes = function TieredCheckboxes(_ref) {
   var items = _ref.items,
       className = _ref.className,
-      onChange = _ref.onChange;
+      onChange = _ref.onChange,
+      isUseParentsClassesAsDataset = _ref.isUseParentsClassesAsDataset;
   var handle = {
     changeParent: function changeParent(value, key) {
       var parent = items.find(function (item) {
@@ -57,10 +62,13 @@ var TieredCheckboxes = function TieredCheckboxes(_ref) {
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('tiered-checkboxes', className)
   }, items.map(function (parent) {
-    return /*#__PURE__*/_react.default.createElement("div", {
+    var datasetProp = isUseParentsClassesAsDataset ? {
+      'data-key': parent === null || parent === void 0 ? void 0 : parent.className
+    } : {};
+    return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, datasetProp, {
       key: parent.key,
-      className: "tiered-checkboxes__parents"
-    }, /*#__PURE__*/_react.default.createElement(_CheckboxInput.default, {
+      className: (0, _classnames.default)('tiered-checkboxes__parents', (0, _defineProperty2.default)({}, "".concat(parent.className), !isUseParentsClassesAsDataset))
+    }), /*#__PURE__*/_react.default.createElement(_CheckboxInput.default, {
       isStark: handle.isAllChecked(parent),
       label: parent.label,
       value: parent.value,

package/dist/Atomic/UI/Tag/Tag.js

@@ -17,16 +17,21 @@ var _reactFeather = require("react-feather");
 
 require("./Tag.scss");
 
+var _utils = require("../../../Functions/utils");
+
 var Tag = function Tag(_ref) {
   var className = _ref.className,
       label = _ref.label,
       warning = _ref.warning,
       removeItem = _ref.removeItem,
-      name = _ref.name;
+      name = _ref.name,
+      _ref$onClick = _ref.onClick,
+      onClick = _ref$onClick === void 0 ? function () {} : _ref$onClick;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('tag', className, {
       'tag-warn': warning
-    })
+    }),
+    onClick: onClick
   }, warning && /*#__PURE__*/_react.default.createElement(_io.IoWarningOutline, {
     className: "advanced-tags--warning-icon mr5"
   }), /*#__PURE__*/_react.default.createElement("span", {

package/dist/Atomic/UI/TagList/TagList.js

@@ -0,0 +1,211 @@
+"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 _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _io = require("react-icons/io5");
+
+var _reactFeather = require("react-feather");
+
+var _Tag = _interopRequireDefault(require("../Tag/Tag"));
+
+var _utils = require("../../../Functions/utils");
+
+require("./TagList.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 TagList = function TagList(_ref) {
+  var className = _ref.className,
+      warning = _ref.warning,
+      _ref$removeItem = _ref.removeItem,
+      removeItem = _ref$removeItem === void 0 ? null : _ref$removeItem,
+      items = _ref.items,
+      _ref$withToggle = _ref.withToggle,
+      withToggle = _ref$withToggle === void 0 ? true : _ref$withToggle,
+      _ref$shownItemsCount = _ref.shownItemsCount,
+      shownItemsCount = _ref$shownItemsCount === void 0 ? 'auto' : _ref$shownItemsCount;
+  var wrapperRef = (0, _react.useRef)(null);
+
+  var _useState = (0, _react.useState)(-1),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      wrapperWidth = _useState2[0],
+      setWrapperWidth = _useState2[1];
+
+  var _useState3 = (0, _react.useState)([]),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      tagList = _useState4[0],
+      setTagList = _useState4[1];
+
+  var _useState5 = (0, _react.useState)(-1),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      staticTagsCount = _useState6[0],
+      setStaticTagsCount = _useState6[1];
+
+  var _useState7 = (0, _react.useState)(-1),
+      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+      renderItemsCount = _useState8[0],
+      setRenderItemsCount = _useState8[1];
+
+  var _useState9 = (0, _react.useState)(!withToggle),
+      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+      renderAll = _useState10[0],
+      setRenderAll = _useState10[1];
+
+  var _useState11 = (0, _react.useState)(-1),
+      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+      lastCheckTime = _useState12[0],
+      setLastCheckTime = _useState12[1];
+
+  var _useState13 = (0, _react.useState)(Date.now()),
+      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
+      checkTagsRefDate = _useState14[0],
+      setCheckTagsRefDate = _useState14[1];
+
+  var isTagsRefSet = function isTagsRefSet() {
+    if (!tagList.length) return false;
+    return tagList.map(function (_ref2) {
+      var itemRef = _ref2.itemRef;
+      return itemRef;
+    }).reduce(function (result, itemRef, i) {
+      if (!(itemRef !== null && itemRef !== void 0 && itemRef.current)) return false;
+      return result;
+    }, true);
+  };
+
+  var getStaticTagsCount = function getStaticTagsCount() {
+    if (typeof shownItemsCount === 'number') return shownItemsCount;
+    var result = tagList.map(function (_ref3) {
+      var itemRef = _ref3.itemRef;
+      return itemRef;
+    }).reduce(function (result, itemRef) {
+      // const itemWidth = itemRef.current.getBoundingClientRect();
+      var itemWidth = parseInt(window.getComputedStyle(itemRef === null || itemRef === void 0 ? void 0 : itemRef.current).getPropertyValue('width')) + parseInt(window.getComputedStyle(itemRef === null || itemRef === void 0 ? void 0 : itemRef.current).getPropertyValue('margin-left')) + parseInt(window.getComputedStyle(itemRef === null || itemRef === void 0 ? void 0 : itemRef.current).getPropertyValue('margin-right'));
+
+      if (!isNaN(itemWidth) && itemWidth > 0 && itemWidth + result.width < wrapperWidth) {
+        result = {
+          count: result.count + 1,
+          width: result.width + itemWidth,
+          items: [].concat((0, _toConsumableArray2.default)(result.items), [{
+            w: itemWidth,
+            r: itemRef === null || itemRef === void 0 ? void 0 : itemRef.current
+          }])
+        };
+      }
+
+      return result;
+    }, {
+      count: 0,
+      width: 0,
+      items: []
+    });
+    return result === null || result === void 0 ? void 0 : result.count;
+  }; // Set TagList Wrapper Width
+
+
+  (0, _react.useLayoutEffect)(function () {
+    var wrapperNewWidth = parseInt(window.getComputedStyle(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current).getPropertyValue('width')) - 48;
+
+    if (wrapperRef.current && wrapperNewWidth !== wrapperWidth) {
+      setWrapperWidth(wrapperNewWidth);
+    }
+  }); // Set TagList Items
+
+  (0, _react.useEffect)(function () {
+    setTagList(items.map(function (item) {
+      return _objectSpread(_objectSpread({}, item), {}, {
+        itemRef: /*#__PURE__*/(0, _react.createRef)()
+      });
+    }));
+  }, [items]); // Count Row Tags
+
+  (0, _react.useEffect)(function () {
+    if (!withToggle) return false;
+
+    if (!isTagsRefSet()) {
+      setLastCheckTime(Date.now());
+      return false;
+    }
+
+    setStaticTagsCount(getStaticTagsCount());
+  }, [tagList, wrapperWidth, lastCheckTime]); //
+
+  (0, _react.useEffect)(function () {
+    setRenderItemsCount(staticTagsCount);
+  }, [staticTagsCount]); // Toggle Show/Hide More Tags
+
+  (0, _react.useEffect)(function () {
+    setRenderItemsCount(renderAll ? tagList.length : staticTagsCount);
+  }, [renderAll]);
+
+  var renderTags = function renderTags() {
+    return tagList.map(function (item, i) {
+      return _objectSpread(_objectSpread({}, item), {}, {
+        isHidden: renderItemsCount !== -1 ? i >= renderItemsCount : false
+      });
+    }).map(function (item, i) {
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: "tag-list_wrapper_item ".concat(item.isHidden ? 'tag-list_wrapper_item--hidden' : ''),
+        key: "tag-list-item-".concat(i),
+        ref: (0, _utils.checkedRef)(item === null || item === void 0 ? void 0 : item.itemRef)
+      }, /*#__PURE__*/_react.default.createElement(_Tag.default, (0, _extends2.default)({}, item, {
+        removeItem: removeItem
+      })));
+    });
+  };
+
+  var renderMoreTags = function renderMoreTags() {
+    var restItems = tagList.length - renderItemsCount;
+    if (restItems === 0 || !withToggle || staticTagsCount === -1) return null;
+    return /*#__PURE__*/_react.default.createElement(_Tag.default, {
+      label: "+".concat(restItems),
+      className: "tag-list_wrapper_render-more",
+      onClick: function onClick() {
+        return setRenderAll(true);
+      }
+    });
+  };
+
+  var renderHideTags = function renderHideTags() {
+    if (renderItemsCount !== tagList.length || !withToggle || staticTagsCount === -1 || staticTagsCount === tagList.length) return null;
+    return /*#__PURE__*/_react.default.createElement(_Tag.default, {
+      label: "...",
+      className: "tag-list_wrapper_hide-more",
+      onClick: function onClick() {
+        return setRenderAll(false);
+      }
+    });
+  };
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "tag-list_wrapper ".concat(renderItemsCount !== tagList.length || !withToggle || staticTagsCount === -1 || staticTagsCount === tagList.length ? 'tag-list_wrapper--only-static-items' : 'tag-list_wrapper--all-items', " ").concat(className !== null && className !== void 0 ? className : ''),
+    ref: wrapperRef
+  }, renderTags(), renderMoreTags(), renderHideTags());
+};
+
+var _default = TagList;
+exports.default = _default;

package/dist/Atomic/UI/TagList/TagList.scss

@@ -0,0 +1,34 @@
+.tag-list_wrapper{
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  min-width: 100%;
+
+  &--only-static-items{
+    .tag-list_wrapper_item{
+      margin-bottom: 0!important;
+    }
+  }
+
+  &_item{
+    display: inline-block;
+    margin-right: 8px;
+    margin-bottom: 8px;
+
+    &--hidden{
+      display: none;
+    }
+  }
+
+  &_render-more,
+  &_hide-more{
+    background: #FFEDC8;
+    cursor: pointer;
+  }
+
+  .tag{
+    margin-bottom: 0!important;
+    margin-right: 0!important;
+    margin: 0!important;
+  }
+}

package/dist/Atomic/UI/TagList/TagListStories.scss

@@ -0,0 +1,8 @@
+.tag-list_wrapper{
+  width: 25%!important;
+  // min-width: 25%!important;
+  // max-width: 25%!important;
+  background-color: #fbf9f9;
+  padding: 25px;
+  flex-wrap: wrap;
+}

package/dist/Functions/utils.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.firstLetterCapital = exports.changeMeta = exports.addBitDepthPoints = exports.throttle = exports.debounce = exports.getColorById = exports.getStyles = exports.logout = exports.useOutsideToggle = exports.handleObjectChange = void 0;
+exports.checkedRef = exports.firstLetterCapital = exports.changeMeta = exports.addBitDepthPoints = exports.throttle = exports.debounce = exports.getColorById = exports.getStyles = exports.logout = exports.useOutsideToggle = exports.handleObjectChange = void 0;
 
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 
@@ -161,4 +161,12 @@ var firstLetterCapital = function firstLetterCapital(str) {
   return "".concat(str.charAt(0).toUpperCase()).concat(str.slice(1));
 };
 
-exports.firstLetterCapital = firstLetterCapital;
+exports.firstLetterCapital = firstLetterCapital;
+
+var checkedRef = function checkedRef(ref) {
+  return ref ? typeof ref === 'function' ? function (node) {
+    return ref(node, key);
+  } : ref : null;
+};
+
+exports.checkedRef = checkedRef;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "intelicoreact",
-  "version": "0.1.93",
-  "description": "Input crop first 0 and comma in rengeInputs",
+  "version": "0.1.96",
+  "description": "",
   "main": "dist/index.js",
   "files": [
     "dist/*",