intelicoreact 1.4.10 → 1.4.12

package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.scss

@@ -4,9 +4,12 @@
   position: relative;
 
   display: flex;
-  flex-direction: column;
+  flex-wrap: nowrap;
+  flex-direction: row;
 
   width: 100%;
+  max-width: 500px;
+
 
   &__container {
     position: fixed;
@@ -35,12 +38,33 @@
     height: fit-content;
     min-height: 28px;
     padding: 1px 24px 1px 5px;
+    width: 100%;
 
     cursor: pointer;
 
     border: 1px solid #e2e5ec;
     border-radius: 3px;
     background: #fff;
+
+    &--with-actions {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+    }
+
+    .input__wrap {
+      border: none;
+
+      &_focus {
+        border: none;
+        filter: none;
+      }
+    }
+  }
+
+  &--focused &__trigger {
+
+    border-color: #6b81dd;
+    filter: drop-shadow(0 0 4px rgb(93 120 255 / 50%));
   }
 
   &__input {
@@ -48,12 +72,31 @@
     flex-grow: 1;
 
     height: 16px;
+    padding: 0;
     padding-right: 2px;
 
     text-overflow: ellipsis;
 
-    border: none;
-    background: none;
+    &:not(.tags-dropdown__input--in-list) {
+      border: none;
+      background: none;
+    }
+
+    &-list-wrapper {
+      padding: 8px 8px 4px;
+    }
+
+    &--in-list {
+      width: 100%;
+      box-sizing: border-box;
+      padding: 4px 8px; 
+      height: 28px;
+
+      &:focus {
+        border-color: #6b81dd;
+        box-shadow: 0px 0px 4px 0px rgba(93, 120, 255, 0.50);
+      }
+    }
   }
 
   &__header,
@@ -79,6 +122,49 @@
     border-bottom: 1px solid #e8e9ec;
   }
 
+  &__creatable-helper {
+    color: var(--Text-Title, #9AA0B9);
+    font-family: Roboto;
+    font-size: 11px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 20px;
+    display: flex;
+    padding: 2px 4px;
+    align-items: center;
+    align-self: stretch;
+  }
+
+  &__create-option {
+    display: flex;
+    height: 24px;
+    padding: 2px 4px;
+    align-items: center;
+    gap: 3px;
+    align-self: stretch;
+    background: var(--Background-Form-Main, #F7FAFC);
+    color: var(--Text-Main, #1E1E2D);
+    font-family: Roboto;
+    font-size: 11px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 20px;
+    cursor: pointer;
+  }
+
+  &__no-options {
+    color: var(--Text-Title, #9AA0B9);
+    font-family: Roboto;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 20px;
+    display: flex;
+    padding: 2px 4px;
+    align-items: center;
+    align-self: stretch;
+  }
+
   &__selector-wrapper {
     position: relative;
 
@@ -92,6 +178,7 @@
     box-shadow: 0 4px 25px rgb(0 0 0 / 25%);
     max-height: 320px;
   }
+  
 
   &__list {
     height: 100%;
@@ -102,7 +189,8 @@
 
     box-sizing: border-box;
     min-width: 100%;
-    padding: 8px 0;
+    // padding: 8px 0;
+    padding: 2px 0;
 
     text-align: left;
 
@@ -129,12 +217,14 @@
       position: relative;
 
       display: flex;
-      justify-content: flex-start;
+      justify-content: space-between;
       align-items: center;
 
       width: 100%;
+      min-width: 100%;
       min-height: 24px;
       padding-left: 35px;
+      padding-right: 4px;
 
       font-size: 13px;
       font-weight: 400;
@@ -144,8 +234,9 @@
       color: $color--dark;
 
       &:hover,
-      &_active {
-        background: $color--gray--gentle;
+      &_active,
+      &--editing {
+        background: #F7FAFC;//$color--gray--gentle;
       }
 
       &_disabled {
@@ -172,6 +263,35 @@
         color: #757f8c;
       }
 
+      &-edit-trigger {
+        display: inline-flex;
+        padding: 2px;
+        align-items: flex-start;
+        gap: 4px;
+
+        &:hover {
+          background-color: #EBEFF2;
+
+          svg {
+            color: #1E1E2D;
+          }
+        }
+
+        svg {
+          width: 16px;
+          height: 16px;
+          color: #9AA0B9;
+        }
+      }
+
+      &--editing &-edit-trigger {
+        background-color: #EBEFF2;
+
+        svg {
+          color: #1E1E2D;
+        }
+      }
+
       pre.inherit-styles {
         font: inherit!important;
         margin: 0;
@@ -196,6 +316,135 @@
     }
   }
 
+  &__actions {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: 1px solid var(--Border-Input, #E2E5EC);
+    border-left: none;
+    border-radius: 0px 2px 2px 0px;
+    overflow: hidden;
+
+    &-item {
+      height: 100%;
+      display: flex;
+      padding: 4px;
+      min-width: 24px;
+      justify-content: center;
+      align-items: center;
+      gap: 4px;
+      align-self: stretch;
+      background: var(--Background-Light-action, #F4F6FF);
+      box-sizing: border-box;
+      cursor: pointer;
+      border-right: 1px solid var(--Border-Input, #E2E5EC);
+
+      &:last-child {
+        border: none;
+      }
+    }
+
+    svg {
+      width: 16px;
+      height: 16px;
+      color: #1E1E2D;
+    }
+  }
+  
+  &__edit-option-modal {
+    position: absolute;
+    display: flex;
+    width: 182px;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 4px;
+    border-radius: 4px;
+    background: var(--White, #FFF);
+    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.25);
+    z-index: 3;
+
+    &-section {
+      display: flex;
+      flex-direction: column;
+      padding: 8px;
+      align-items: flex-start;
+      gap: 8px;
+      align-self: stretch;
+
+      button {
+        display: flex;
+        gap: 4px;
+        padding: 0;
+        height: auto;
+        box-sizing: border-box;
+        align-items: center;
+        color: var(--Text-Main, #1E1E2D);
+
+        .button__text {
+          margin: 0;
+          width: auto;
+          font-family: Roboto;
+          font-size: 13px;
+          font-style: normal;
+          font-weight: 400;
+          line-height: 20px;
+        }
+
+        svg {
+          display: block;
+          width: 16px;
+          height: 16px;
+        }
+      }
+
+      h3 {
+        color: var(--Text-Title, #9AA0B9);
+        font-family: Roboto;
+        font-size: 10px;
+        font-style: normal;
+        font-weight: 400;
+        line-height: 20px;
+        text-transform: uppercase;
+        margin: 0;
+      }
+
+      &-divider {
+        width: 100%;
+        height: 1px;
+        background: #E2E5EC;
+      }
+
+      &-colors {
+        display: flex;
+        gap: 8px;
+        flex-wrap: wrap;
+
+        .color-block {
+          display: flex;
+          width: 20px;
+          height: 20px;
+          padding: 2px;
+          align-items: flex-start;
+          gap: 4px;
+          border-radius: 3px;
+          box-sizing: border-box;
+          border: 1px solid rgba(0, 0, 0, 0.15);
+          cursor: pointer;
+
+          svg {
+            display: flex;
+            width: 16px;
+            height: 16px;
+            justify-content: center;
+            align-items: center;
+            flex-shrink: 0;
+            color: #1E1E2D;
+          }
+        }
+      }
+    }
+  }
+
   &__active-icon {
     position: absolute;
     top: 0;

package/dist/Atomic/FormElements/Text/Text.js

@@ -1,16 +1,21 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _react = _interopRequireDefault(require("react"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 require("./Text.scss");
-const RC = "text";
 
+const RC = "text";
 /**
  *
  * @param value
@@ -23,7 +28,6 @@ const RC = "text";
  * @return {JSX.Element|null}
  * @constructor
  */
-
 //? Прототип лежит на проекте кабинета src\JS\Components\Atomic\FormElements\Text\Text.js
 //? Что поменял?
 //?   - в верстке убрал дополнительную вложенность
@@ -35,18 +39,13 @@ const RC = "text";
 //?   - переработал пропу link, может быть строкой или объектом
 //?     если это объект, то у него могут быть свойства
 //?       - path - значение для href
-
 //?       - target - значение для атрибута target, имеет смысл передавать, если не передаются onClick или redirect
-
 //?       - onClick - альтернативный обработчик нажатия, если он есть то он будет ипользован в приоритете,
 //?         ф-я будет вызвана с 1 аргументом - props, в объекте props будет свойство ev (event) и все содержание link,
 //?         по умолчанию до использования onClick будут вызваны e.preventDefault() и e.stopPropagation
-
 //?       - redirect - альтернативный исполнитель редиректа (например history.push),
 //?         если есть и нет onClick - будет вызван с одним аргументом (link.path)
-
 //?       - isNoPreventDefault - отключает вызов e.preventDefault перед вызовом onClick или redirect
-
 //?       - isNoStopPropagation - отключает вызов e.preventDefault перед вызовом onClick или redirect
 
 const Text = _ref => {
@@ -72,17 +71,19 @@ const Text = _ref => {
     isNoPreventDefault,
     isNoStopPropagation
   } = linkObj;
+
   const preparedPath = (() => {
     if (!isLink) return "";
     return isLinkAsObj ? path : link;
   })();
+
   const atributes = {};
+
   if (typeof onClickInner === "function" || typeof redirect === "function") {
     atributes.onClick = function onClick(ev) {
       if (!isNoPreventDefault) ev.preventDefault();
-      if (!isNoStopPropagation) ev.stopPropagation();
+      if (!isNoStopPropagation) ev.stopPropagation(); //? если переданы и onClick, и redirect, то onClick считается приоритетнее redirect
 
-      //? если переданы и onClick, и redirect, то onClick считается приоритетнее redirect
       if (onClickInner) {
         onClickInner({
           ev,
@@ -90,12 +91,15 @@ const Text = _ref => {
         });
         return;
       }
+
       redirect(preparedPath);
     };
   }
+
   const mainInner = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, icon && /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(RC, "__icon-container")
   }, icon), value);
+
   return /*#__PURE__*/_react.default.createElement("div", {
     "data-testid": "text--".concat(testId),
     className: (0, _classnames.default)(RC, className, {
@@ -111,4 +115,6 @@ const Text = _ref => {
     rel: "noreferrer"
   }), mainInner) : mainInner);
 };
-var _default = exports.default = Text;
+
+var _default = Text;
+exports.default = _default;

package/dist/Atomic/FormElements/TextSwitcher/TextSwitcher.js

@@ -1,14 +1,20 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireDefault(require("react"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 require("./TextSwitcher.scss");
+
 const RC = "text-switcher";
+
 const TextSwitcher = _ref => {
   let {
     isActive,
@@ -37,4 +43,6 @@ const TextSwitcher = _ref => {
     })
   }));
 };
-var _default = exports.default = TextSwitcher;
+
+var _default = TextSwitcher;
+exports.default = _default;

package/dist/Atomic/FormElements/Textarea/Textarea.js

@@ -1,17 +1,26 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 var _fieldValueFormatters = require("../../../Functions/fieldValueFormatters");
+
 require("./Textarea.scss");
-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 && Object.prototype.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; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
+
 const RC = "textarea";
+
 const Textarea = _ref => {
   let {
     id,
@@ -30,15 +39,18 @@ const Textarea = _ref => {
     change: val => {
       let inputValue = val;
       if (!isNotValidateASCII) inputValue = (0, _fieldValueFormatters.formatToOnlyASCIICodeText)(inputValue);
+
       if (inputValue !== val) {
         onChange(inputValue);
       }
     }
   };
+
   const autoGrow = el => {
     el.style.height = "5px";
     el.style.height = el.scrollHeight + "px";
   };
+
   (0, _react.useEffect)(() => {
     if (withAutoGrow) {
       autoGrow(textareaRef === null || textareaRef === void 0 ? void 0 : textareaRef.current);
@@ -58,4 +70,6 @@ const Textarea = _ref => {
     ref: textareaRef
   }));
 };
-var _default = exports.default = Textarea;
+
+var _default = Textarea;
+exports.default = _default;

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

@@ -1,20 +1,32 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 var _utils = require("../../../Functions/utils");
+
 var _CheckboxInput = _interopRequireDefault(require("../CheckboxInput/CheckboxInput"));
+
 var _AccordionWithCheckbox = _interopRequireDefault(require("./partial/AccordionWithCheckbox"));
+
 require("./TieredCheckboxes.scss");
-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 && Object.prototype.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; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
+
 const RC = "tiered-checkboxes";
+
 const TieredCheckboxes = _ref => {
   let {
     items = {},
@@ -31,6 +43,7 @@ const TieredCheckboxes = _ref => {
     changeParent: (value, key, prop) => {
       const parent = items.find(item => item.key === key);
       if (prop) parent[prop] = value;else parent.value = value;
+
       if (!prop) {
         if (value) parent.children.filter(_ref2 => {
           let {
@@ -44,6 +57,7 @@ const TieredCheckboxes = _ref => {
           return !disabled;
         }).forEach(item => item.value = false);
       }
+
       onChange([...items]);
     },
     changeChild: (value, key, parentKey) => {
@@ -58,6 +72,7 @@ const TieredCheckboxes = _ref => {
             item.disabled = false;
             parent.disabled = false;
           } else item.disabled = false;
+
           return item;
         });
         parent.disabled = true;
@@ -66,6 +81,7 @@ const TieredCheckboxes = _ref => {
         parent.children.find(item => item.key === key).value = value;
         if (parent.children.every(item => item.value)) parent.value = true;else parent.value = false;
       }
+
       onChange([...items]);
     },
     isAllChecked: item => {
@@ -74,22 +90,30 @@ const TieredCheckboxes = _ref => {
   };
   const preparedItems = (0, _react.useMemo)(() => {
     let newItems = [...items];
+
     if (sortGroups) {
       var _newItems;
+
       newItems = (_newItems = newItems) === null || _newItems === void 0 ? void 0 : _newItems.sort(_utils.compareAlphabetical);
     }
+
     if (sortGroupItems) {
       var _newItems2;
+
       newItems = (_newItems2 = newItems) === null || _newItems2 === void 0 ? void 0 : _newItems2.map(parent => {
         if (parent !== null && parent !== void 0 && parent.children) {
           var _parent$children;
-          parent.children = parent === null || parent === void 0 || (_parent$children = parent.children) === null || _parent$children === void 0 ? void 0 : _parent$children.sort(_utils.compareAlphabetical);
+
+          parent.children = parent === null || parent === void 0 ? void 0 : (_parent$children = parent.children) === null || _parent$children === void 0 ? void 0 : _parent$children.sort(_utils.compareAlphabetical);
         }
+
         return parent;
       });
     }
+
     return newItems;
   }, [items]);
+
   const renderInner = parent => {
     return parent.children && parent.children.map(child => /*#__PURE__*/_react.default.createElement("div", {
       key: child.key,
@@ -102,12 +126,14 @@ const TieredCheckboxes = _ref => {
       onChange: value => handle.changeChild(value, child.key, parent.key)
     })));
   };
+
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)(RC, className)
   }, preparedItems.map(parent => {
     const datasetProp = isUseParentsClassesAsDataset && parent !== null && parent !== void 0 && parent.className ? {
       "data-key": parent === null || parent === void 0 ? void 0 : parent.className
     } : {};
+
     if (isUseAccordionForGroup) {
       return /*#__PURE__*/_react.default.createElement(_AccordionWithCheckbox.default, {
         key: parent.key,
@@ -118,10 +144,11 @@ const TieredCheckboxes = _ref => {
         className: "".concat(RC, "__mono-accordion"),
         setIsOpen: () => handle.changeParent(!parent.isOpen, parent.key, "isOpen"),
         onChange: value => handle.changeParent(value, parent.key),
-        icon: !parent.isOpen ? (accordionIcons === null || accordionIcons === void 0 ? void 0 : accordionIcons[0]) || null : (accordionIcons === null || accordionIcons === void 0 ? void 0 : accordionIcons[1]) || null
-        // disabled={parent.children?.every?.((child) => child.disabled)}
+        icon: !parent.isOpen ? (accordionIcons === null || accordionIcons === void 0 ? void 0 : accordionIcons[0]) || null : (accordionIcons === null || accordionIcons === void 0 ? void 0 : accordionIcons[1]) || null // disabled={parent.children?.every?.((child) => child.disabled)}
+
       }, renderInner(parent));
     }
+
     return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, datasetProp, {
       key: parent.key,
       className: (0, _classnames.default)("".concat(RC, "__parents"), {
@@ -143,4 +170,6 @@ const TieredCheckboxes = _ref => {
     }, renderInner(parent)));
   }));
 };
-var _default = exports.default = TieredCheckboxes;
+
+var _default = TieredCheckboxes;
+exports.default = _default;