intelicoreact 0.1.91 → 0.1.94

package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.js

@@ -18,6 +18,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
 require("./CheckboxInput.scss");
 
 var CheckboxInput = function CheckboxInput(_ref) {
+  var _cn2;
+
   var label = _ref.label,
       id = _ref.id,
       value = _ref.value,
@@ -29,7 +31,7 @@ var CheckboxInput = function CheckboxInput(_ref) {
     className: (0, _classnames.default)('checkbox-input', className, (0, _defineProperty2.default)({}, "checkbox-input_disabled", disabled)),
     htmlFor: id
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("checkbox-input__input", (0, _defineProperty2.default)({}, "checkbox-input__input_checked", value))
+    className: (0, _classnames.default)("checkbox-input__input", (_cn2 = {}, (0, _defineProperty2.default)(_cn2, "checkbox-input__input_checked", value), (0, _defineProperty2.default)(_cn2, "checkbox-input__input_indeterminate", isStark), _cn2))
   }, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({}, id ? (0, _defineProperty2.default)({
     id: id
   }, 'data-id', id) : {}, {

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

@@ -16,10 +16,11 @@
   }
 
   &__input {
+    box-sizing: border-box;
     position: relative;
-    height: 14px;
-    width: 14px;
-    min-width: 14px;
+    height: 16px;
+    width: 16px;
+    min-width: 16px;
     border: 1px solid #9aa0b9;
     border-radius: 2px;
     overflow: hidden;
@@ -28,12 +29,16 @@
     transition: background-color 0.2s ease;
     background-color: #ffff;
 
-    &_checked {
-      border-color: #6b81dd;
+    &_checked,
+    &_indeterminate {
+      border: none;
     }
 
     .checkbox-input__checkbox:checked ~ .checkbox-input__mark {
       display: block;
+      width: 100%;
+      height: 100%;
+      border-radius: 2px;
     }
   }
 
@@ -47,8 +52,8 @@
   &__mark {
     display: none;
     position: absolute;
-    width: 14px;
-    height: 14px;
+    width: 100%;
+    height: 100%;
     background-color: #6b81dd;
 
     &:after {
@@ -98,11 +103,11 @@
         position: absolute;
         top: 50%;
         left: 50%;
-        transform: translate(-50%, -50%);
-        width: 65%;
+        width: 45%;
         border: solid white;
         border-radius: 2px;
-        border-width: 0 2px 2px 0;
+        border-width: 0 1px 2px 0;
+        transform: scale(1, 0.9) translateX(-50%) translateY(-50%);
         z-index: 1;
       }
     }

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

@@ -72,7 +72,9 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       _ref$isNotValidateASC = _ref.isNotValidateASCII,
       isNotValidateASCII = _ref$isNotValidateASC === void 0 ? false : _ref$isNotValidateASC,
       _ref$isNumericMobileK = _ref.isNumericMobileKeyboard,
-      isNumericMobileKeyboard = _ref$isNumericMobileK === void 0 ? false : _ref$isNumericMobileK;
+      isNumericMobileKeyboard = _ref$isNumericMobileK === void 0 ? false : _ref$isNumericMobileK,
+      _ref$isCropFirstNool = _ref.isCropFirstNool,
+      isCropFirstNool = _ref$isCropFirstNool === void 0 ? false : _ref$isCropFirstNool;
   var DEFAULT_BLINK_TIME = 100; // STATES
 
   var _useState = (0, _react.useState)(false),
@@ -120,6 +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 (isCropFirstNool) inputValue = inputValue[0] == 0 ? '' : (0, _fieldValueFormatters.filterNumeric)(inputValue, onlyNumbers);
       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/NumericInput/NumericInput.js

@@ -129,6 +129,7 @@ var NumericInput = function NumericInput(_ref) {
       var inputValue = e.target ? (0, _fieldValueFormatters.filterNumeric)(e.target.value, {
         type: 'int'
       }) : e;
+      if (inputValue == '0') inputValue = min || '';
 
       if (inputValue && (decRef.current.contains(e.target) || incRef.current.contains(e.target))) {
         inputValue = parseFloat(inputValue);
@@ -138,10 +139,8 @@ var NumericInput = function NumericInput(_ref) {
         } else if (max && +max < inputValue) inputValue = max;
       }
 
-      if (symbolsLimit) {
-        inputValue = inputValue.toString().substring(0, +symbolsLimit);
-      }
-
+      if (symbolsLimit) inputValue = inputValue.toString().substring(0, +symbolsLimit);
+      if (isPriceInput) inputValue = (0, _fieldValueFormatters.formatToAddBitDepthPoints)(inputValue);
       setInputValue(inputValue.toString());
     },
     clear: function clear() {

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

@@ -19,6 +19,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _fieldValueFormatters = require("../../../Functions/fieldValueFormatters");
 
+var _utils = require("../../../Functions/utils.js");
+
 var _Input = _interopRequireDefault(require("../Input/Input"));
 
 var _Label = _interopRequireDefault(require("../Label/Label"));
@@ -51,7 +53,9 @@ var RangeInputs = function RangeInputs(_ref) {
       type = _ref$type === void 0 ? 'int' : _ref$type,
       setInnerError = _ref.setError,
       _ref$label = _ref.label,
-      label = _ref$label === void 0 ? '' : _ref$label;
+      label = _ref$label === void 0 ? '' : _ref$label,
+      _ref$isPrice = _ref.isPrice,
+      isPrice = _ref$isPrice === void 0 ? false : _ref$isPrice;
 
   var _useState = (0, _react.useState)({
     from: '',
@@ -65,8 +69,12 @@ var RangeInputs = function RangeInputs(_ref) {
   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 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);
+  };
+
   var handleChange = function handleChange(prop, val) {
-    onChange(_objectSpread(_objectSpread({}, valueObj), {}, (0, _defineProperty2.default)({}, prop, type === 'float' ? (0, _fieldValueFormatters.filterFloat)(val) : (0, _fieldValueFormatters.formatOnlyNumbers)(val))));
+    onChange(_objectSpread(_objectSpread({}, valueObj), {}, (0, _defineProperty2.default)({}, prop, valueFormatter(val))));
   };
 
   var rangeValidation = function rangeValidation(e, key) {

package/dist/Atomic/UI/PriceRange/PriceRange.js

@@ -17,7 +17,7 @@ var PriceRange = function PriceRange(_ref) {
       mode = _ref.mode;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "j4"
-  }, mode === 'simple' ? /*#__PURE__*/_react.default.createElement("span", null, from, " - ", to) : /*#__PURE__*/_react.default.createElement("span", null, "$", (0, _fieldValueFormatters.formatToPriceInputAndDollarSymbol)(from.toString()), " - ", (0, _fieldValueFormatters.formatToPriceInputAndDollarSymbol)(to.toString())));
+  }, mode === 'simple' ? /*#__PURE__*/_react.default.createElement("span", null, from, " - ", to) : /*#__PURE__*/_react.default.createElement("span", null, (0, _fieldValueFormatters.formatToPriceInputAndDollarSymbol)(from.toString()), " - ", (0, _fieldValueFormatters.formatToPriceInputAndDollarSymbol)(to.toString())));
 };
 
 var _default = PriceRange;

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,210 @@
+"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 _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)(0),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      rowTagsCount = _useState6[0],
+      setRowTagsCount = _useState6[1];
+
+  var _useState7 = (0, _react.useState)(items.length),
+      _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)(false),
+      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+      isInit = _useState12[0],
+      setIsInit = _useState12[1];
+
+  var _useState13 = (0, _react.useState)(Date.now()),
+      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
+      checkTagsRefDate = _useState14[0],
+      setCheckTagsRefDate = _useState14[1];
+
+  var checkTagsRef = function checkTagsRef() {
+    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 countTagsInRow = function countTagsInRow() {
+    var _tagList$map$reduce;
+
+    if (typeof shownItemsCount === 'number') return shownItemsCount;
+    return (_tagList$map$reduce = tagList.map(function (_ref3) {
+      var itemRef = _ref3.itemRef;
+      return itemRef;
+    }).reduce(function (result, itemRef) {
+      var _itemRef$current$getB = itemRef.current.getBoundingClientRect(),
+          itemWidth = _itemRef$current$getB.width;
+
+      if (itemWidth > 0 && itemWidth + result.width < wrapperWidth) {
+        result = {
+          count: result.count + 1,
+          width: result.width + itemWidth
+        };
+      }
+
+      return result;
+    }, {
+      count: 0,
+      width: 0
+    })) === null || _tagList$map$reduce === void 0 ? void 0 : _tagList$map$reduce.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')) - 24;
+
+    if (wrapperRef.current && wrapperNewWidth !== wrapperWidth) {
+      setWrapperWidth(wrapperNewWidth);
+    }
+  });
+  (0, _react.useEffect)(function () {
+    setRenderItemsCount(items.length);
+    setIsInit(false);
+  }, [wrapperWidth]); // 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 || isInit) return false;
+
+    if (!checkTagsRef()) {
+      setIsInit(false);
+      return false;
+    }
+
+    setRowTagsCount(countTagsInRow());
+    setIsInit(true);
+  }, [tagList.length, isInit, wrapperWidth]);
+  (0, _react.useEffect)(function () {
+    if (rowTagsCount > 0) {
+      setRenderItemsCount(rowTagsCount);
+    }
+  }, [rowTagsCount]);
+  (0, _react.useEffect)(function () {
+    setRenderItemsCount(renderAll ? tagList.length : rowTagsCount);
+  }, [renderAll]);
+
+  var renderTags = function renderTags() {
+    return tagList.map(function (item, i) {
+      return _objectSpread(_objectSpread({}, item), {}, {
+        isHidden: renderItemsCount === 0 ? true : !(i < renderItemsCount)
+      });
+    }).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) 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) 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(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,19 @@
+.tag-list_wrapper{
+  display: flex;
+  width: 100%;
+
+  &_item{
+    display: flex;
+    margin: 0 4px 8px 0;
+
+    &--hidden{
+      display: none;
+    }
+  }
+
+  &_render-more,
+  &_hide-more{
+    background: #FFEDC8;
+    cursor: pointer;
+  }
+}

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

@@ -0,0 +1,6 @@
+.tag-list_wrapper{
+  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"));
 
@@ -126,14 +126,14 @@ exports.throttle = throttle;
 var addBitDepthPoints = function addBitDepthPoints(value) {
   var step = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3;
   //содержит ли value точку
-  var isFraction = value.includes('.'); //взять строку до точки
+  var isFraction = value === null || value === void 0 ? void 0 : value.includes('.'); //взять строку до точки
 
-  var valueBeforeDot = isFraction ? value.slice(0, value.indexOf('.')) : value; //расстановка запятых после каждой 3й цифры с конца
+  var valueBeforeDot = isFraction ? value === null || value === void 0 ? void 0 : value.slice(0, value === null || value === void 0 ? void 0 : value.indexOf('.')) : value; //расстановка запятых после каждой 3й цифры с конца
 
   var intPart = valueBeforeDot.split('').reverse().reduce(function (acc, item, idx) {
     return idx % step === 0 && idx !== 0 ? [].concat((0, _toConsumableArray2.default)(acc), [',', item]) : [].concat((0, _toConsumableArray2.default)(acc), [item]);
   }, []).reverse().join('');
-  return isFraction ? intPart + value.slice(value.indexOf('.')) : intPart;
+  return isFraction ? intPart + (value === null || value === void 0 ? void 0 : value.slice(value === null || value === void 0 ? void 0 : value.indexOf('.'))) : intPart;
 };
 
 exports.addBitDepthPoints = addBitDepthPoints;
@@ -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.91",
-  "description": "dollar format ",
+  "version": "0.1.94",
+  "description": "",
   "main": "dist/index.js",
   "files": [
     "dist/*",