intelicoreact 1.4.72 → 1.4.73

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

@@ -55,26 +55,22 @@ const TagList = _ref => {
     onToggleRenderAll === null || onToggleRenderAll === void 0 ? void 0 : onToggleRenderAll(v);
   };
 
-  const getStaticTagsCount = () => {
-    var _window$getComputedSt;
+  const getStaticTagsCount = computedWidth => {
+    var _result$items;
 
     if (typeof shownItemsCount === "number") return shownItemsCount;
-    const computedWidth = wrapperWidth || parseInt(wrapperRef !== null && wrapperRef !== void 0 && wrapperRef.current ? (_window$getComputedSt = window.getComputedStyle(wrapperRef.current)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.width : 0);
     const delta = typeof onEditClick === "function" ? 60 : 32;
-    if (isNaN(computedWidth)) return -1;
-    const result = tagList.map(_ref2 => {
+    const result = tagList.reduce((result, _ref2, index) => {
       let {
         itemRef
       } = _ref2;
-      return itemRef;
-    }).reduce((result, itemRef) => {
       const itemStyle = (itemRef === null || itemRef === void 0 ? void 0 : itemRef.current) && window.getComputedStyle(itemRef.current);
       const itemWidth = [parseInt(itemStyle === null || itemStyle === void 0 ? void 0 : itemStyle.width, 10), parseInt(itemStyle === null || itemStyle === void 0 ? void 0 : itemStyle.marginLeft, 10), parseInt(itemStyle === null || itemStyle === void 0 ? void 0 : itemStyle.marginRight, 10)].reduce((result, item) => {
         if (!isNaN(item)) result += item;
         return result;
       }, 0);
 
-      if (!isNaN(itemWidth) && itemWidth > 0 && itemWidth + result.width < wrapperWidth - delta) {
+      if (!isNaN(itemWidth) && itemWidth > 0 && itemWidth + result.width < computedWidth - delta || index === 0) {
         result = {
           count: result.count + 1,
           width: result.width + itemWidth,
@@ -91,6 +87,11 @@ const TagList = _ref => {
       width: 0,
       items: []
     });
+
+    if ((result === null || result === void 0 ? void 0 : (_result$items = result.items) === null || _result$items === void 0 ? void 0 : _result$items.length) === 1) {
+      result.items[0].r.style.maxWidth = "".concat(computedWidth - delta - 8, "px");
+    }
+
     return result === null || result === void 0 ? void 0 : result.count;
   };
 
@@ -102,24 +103,14 @@ const TagList = _ref => {
   };
 
   const renderTags = () => {
-    const tagsRenderOrder = renderOrder !== null && renderOrder !== void 0 ? renderOrder : tagList.map(_ref3 => {
-      let {
-        value,
-        id
-      } = _ref3;
-      return value !== null && value !== void 0 ? value : id;
-    });
-    return tagsRenderOrder.map((v, i) => {
+    // const tagsRenderOrder =
+    //   renderOrder ?? tagList.map(({ value, id }) => value ?? id);
+    console.log("render", [...tagList]);
+    return tagList.map((item, i) => {
       var _item$id, _item$id2;
 
-      const item = tagList.find(_ref4 => {
-        let {
-          value,
-          id
-        } = _ref4;
-        return (value !== null && value !== void 0 ? value : id) === v;
-      });
-      if (!item) return null;
+      // const item = tagList.find(({ value, id }) => (value ?? id) === v);
+      // if (!item) return null;
       const isHidden = renderItemsCount !== -1 && staticTagsCount !== -1 ? i >= renderItemsCount : false;
       return /*#__PURE__*/_react.default.createElement("div", {
         className: "tag-list_wrapper_item ".concat(isHidden ? "tag-list_wrapper_item--hidden" : ""),
@@ -169,13 +160,13 @@ const TagList = _ref => {
       let computedWidth = wrapperWidth;
 
       if (computedWidth === 0) {
-        var _window$getComputedSt2;
+        var _window$getComputedSt;
 
-        computedWidth = parseInt(wrapperRef !== null && wrapperRef !== void 0 && wrapperRef.current ? (_window$getComputedSt2 = window.getComputedStyle(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current)) === null || _window$getComputedSt2 === void 0 ? void 0 : _window$getComputedSt2.width : 0);
+        computedWidth = parseInt(wrapperRef !== null && wrapperRef !== void 0 && wrapperRef.current ? (_window$getComputedSt = window.getComputedStyle(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.width : 0);
       }
 
       if (!isNaN(computedWidth)) {
-        setStaticTagsCount(getStaticTagsCount());
+        setStaticTagsCount(getStaticTagsCount(computedWidth));
       }
     }
   }, [tagList, wrapperWidth, wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current]); //

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

@@ -23,6 +23,18 @@
 
   &_item {
     display: inline-block;
+    box-sizing: border-box;
+    overflow: hidden;
+
+    .tag {
+      max-width: 100%;
+      box-sizing: border-box;
+
+      &__label {
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
 
     &--hidden {
       display: none;

package/package.json

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