ecomlab-components-next 0.1.159 → 0.1.162

package/dist/stories/TableBox/TableBox.scss

@@ -0,0 +1,418 @@
+@import 'src/common/styles/svg_img.scss';
+
+.table-box-component,
+.table-box-component_no-data {
+    display: flex;
+    flex-direction: column;
+    height: auto;
+    width: 100%;
+    max-width: fit-content;
+    border-radius: 16px;
+    // max-height: 100%;
+    align-items: flex-start;
+    margin-top: 0;
+    // height: 100%;
+    position: relative;
+    z-index: 0;
+
+    &_no-data {
+        max-width: 100%;
+    }
+
+    .scrollbar {
+        padding: 4px;
+        height: 16px;
+        width: 100%;
+        background: #F4F6F4;
+        position: sticky;
+        bottom: 0;
+        z-index: 5;
+        left: 0;
+        right: 0;
+
+        .scroll-box {
+            width: 100%;
+            height: 16px;
+            background: #F4F6F4;
+            position: relative;
+
+            .scroll-point {
+                width: 100px;
+                height: 16px;
+                background-color: #B4B8B4;
+                border-radius: 16px;
+                position: absolute;
+                left: 0;
+            }
+        }
+    }
+
+    .child-box {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        justify-content: flex-start;
+        gap: 12px;
+        width: 100%;
+        min-height: 40px;
+        border: 1px solid #EDEFED;
+        border-radius: 8px;
+        background: #fff;
+        padding: 2px 20px;
+    }
+
+    .panel-with-buttons-left {
+        display: flex;
+        align-items: center;
+        width: fit-content;
+        min-height: 40px;
+        height: 40px;
+        border: 1px solid #EDEFED;
+        background: #fff;
+        padding: 8px 20px;
+        border-radius: 8px;
+        gap: 16px;
+
+        .btn {
+            display: flex;
+            min-width: 24px;
+            width: 24px;
+            height: 24px;
+            justify-content: center;
+            align-items: center;
+            gap: 8px;
+            border-radius: 4px;
+            background: #DED;
+            border: none;
+            background-position: center;
+            background-repeat: no-repeat;
+            cursor: pointer;
+            position: relative;
+
+            &:hover {
+                transition: 0.3s;
+                //    background-color: #3900B1;
+            }
+
+            &:disabled {
+                cursor: not-allowed;
+
+                &::before {
+                    content: '';
+                    position: absolute;
+                    top: 0;
+                    left: 0;
+                    right: 0;
+                    bottom: 0;
+                    //   background-color: rgba(255, 255, 255, 0.5);
+                    z-index: 1;
+                }
+
+                &:hover {
+                    transition: 0.3s;
+                    background-color: #8278F0;
+                }
+            }
+
+
+        }
+
+        .btn-delete {
+            background-image: url('./img/delete_icon.svg');
+        }
+
+        .btn-forward {
+            background-image: url('./img/forward_icon.svg');
+        }
+
+        .btn-more {
+            background-image: url('./img/more_icon.svg');
+        }
+    }
+
+    .panel-with-buttons-right {
+        display: flex;
+        align-items: center;
+        width: fit-content;
+        min-height: 40px;
+        height: 40px;
+        border: 1px solid #EDEFED;
+        border-radius: 8px;
+        background: #fff;
+        padding: 0px 12px;
+    }
+
+    .loader-table-background {
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: 100%;
+        height: 100%;
+        border: none;
+        background-color: white;
+        opacity: 0.6;
+        z-index: 10;
+    }
+
+    &__header {
+        display: flex;
+        align-items: flex-start;
+        justify-content: flex-start;
+        width: 100%;
+        gap: 12px;
+        margin-bottom: 12px;
+
+        .name-box {
+            display: flex;
+            align-items: center;
+            min-width: 50px;
+            font-weight: 400;
+            width: auto;
+            background-color: #ffffff;
+            font-size: 14px;
+            height: 32px;
+            border-radius: 8px;
+            padding-left: 16px;
+            border: 1px solid var(--table-border, #E0E7F2);
+
+            p {
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+            }
+        }
+
+        .statistic-items {
+            display: flex;
+            width: fit-content;
+            align-items: center;
+            height: 100%;
+            justify-content: flex-start;
+            column-gap: 24px;
+            row-gap: 16px;
+            flex-wrap: wrap;
+            padding: 8px;
+
+            .text_violet {
+                display: flex;
+                gap: 6px;
+                color: #636D65;
+                text-align: center;
+                font-family: NunitoSans;
+                font-size: 12px;
+                font-style: normal;
+                font-weight: 600;
+                line-height: 14px;
+                white-space: nowrap;
+
+                span {
+                    color: #0B110B;
+                    font-weight: 800;
+                }
+            }
+        }
+    }
+
+    .extra_wrapper {
+        display: flex;
+        justify-content: space-between;
+    }
+
+
+    .table-paginator-box {
+        width: auto;
+        max-width: 100%;
+        display: flex;
+        flex-direction: column;
+        border-radius: 8px;
+        border: 2px solid rgba(170, 178, 246, 0.12);
+        overflow-x: auto;
+        overflow-y: hidden;
+        background-color: white;
+        // position: relative;
+
+        &::-webkit-scrollbar {
+            width: 0;
+            height: 0;
+        }
+
+        // .toolbar-paginator {
+        //     display: flex;
+        //     align-items: center;
+        //     width: 100%;
+        //     transition: .3s;
+        // }
+    }
+
+    &__content {
+        width: calc(100% + 2px);
+        // overflow: auto;
+        clear: both;
+        min-height: 700px;
+        height: auto;
+        // tb
+        //max-height: 700px;
+
+        &::-webkit-scrollbar {
+            width: 16px;
+            height: 16px;
+        }
+
+        &::-webkit-scrollbar-track-piece {
+            background-color: #F1F5F9;
+            border-radius: 10px;
+            width: 12px;
+            height: 12px;
+        }
+
+        &::-webkit-scrollbar-thumb:vertical {
+            width: 12px;
+            height: 12px;
+            background-color: #94A3B8;
+            border-radius: 10px;
+            scrollbar-width: auto;
+        }
+
+        &::-webkit-scrollbar-thumb:horizontal {
+            height: 12px;
+            background-color: #94A3B8;
+            border-radius: 10px;
+        }
+    }
+
+    .settings_connection_table {
+        height: auto;
+        max-height: 700px;
+    }
+
+    .paginator-and-btn {
+        display: flex;
+        width: 100%;
+        justify-content: flex-end;
+        padding-left: 16px;
+        padding-right: 16px;
+        padding-bottom: 8px;
+    }
+
+    .btn__green {
+        min-width: 200px;
+        width: auto;
+        padding-left: 20px;
+        padding-right: 20px;
+        max-width: 100%;
+        margin-top: 0;
+    }
+
+}
+
+.pop-up {
+    display: flex;
+    width: auto;
+    max-width: calc(100% - 156px);
+    border: 1px solid #D9D9D9;
+    height: auto;
+    white-space: normal;
+    box-shadow: .3em .6em 1.3em rgba(0, 0, 0, .25);
+    padding: 8px 16px;
+    border-radius: 16pxч;
+    text-overflow: clip;
+    z-index: 3000;
+    position: absolute;
+    top: 40px;
+    left: center;
+    opacity: 1;
+    background-color: white;
+    visibility: visible;
+    margin-left: -16px;
+    margin-right: 16px;
+    visibility: hidden;
+    opacity: 0;
+    transition: 0.5s;
+
+    .text_blue {
+        text-decoration: none;
+        white-space: normal;
+        text-overflow: clip;
+        overflow: visible;
+    }
+}
+
+.chars-box-component {
+    .name-box {
+        position: relative;
+        cursor: help;
+
+        &:hover {
+            .pop-up {
+                display: flex;
+                width: auto;
+                max-width: calc(100%);
+                border: 1px solid #D9D9D9;
+                height: auto;
+                white-space: normal;
+                box-shadow: .3em .6em 1.3em rgba(0, 0, 0, .25);
+                padding: 8px 16px;
+                border-radius: 16px;
+                text-overflow: clip;
+                z-index: 3000;
+                position: absolute;
+                top: 40px;
+                left: center;
+                opacity: 1;
+                background-color: white;
+                visibility: visible;
+                margin-left: -16px;
+                margin-right: 16px;
+                opacity: 1;
+
+                .text_violet {
+                    white-space: normal;
+                    text-overflow: clip;
+                    overflow: visible;
+                }
+            }
+        }
+    }
+}
+
+
+
+.toolbar-name-box {
+    cursor: help;
+
+    &:hover {
+        .pop-up {
+            display: flex;
+            width: auto;
+            max-width: calc(100% - 156px);
+            border: 1px solid #D9D9D9;
+            height: auto;
+            white-space: normal;
+            box-shadow: .3em .6em 1.3em rgba(0, 0, 0, .25);
+            padding: 8px 16px;
+            border-radius: 16px;
+            text-overflow: clip;
+            z-index: 3000;
+            position: absolute;
+            top: 40px;
+            left: center;
+            opacity: 1;
+            background-color: white;
+            visibility: visible;
+            margin-left: -16px;
+            margin-right: 16px;
+            opacity: 1;
+
+            .text_blue {
+                white-space: normal;
+                text-overflow: clip;
+                overflow: visible;
+            }
+        }
+    }
+}

package/dist/stories/TableBox/TableBox.stories.js

@@ -0,0 +1,124 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _TableBox = _interopRequireDefault(require("./TableBox"));
+var _addonActions = require("@storybook/addon-actions");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var stubColumnSize = ["65px", "", "90px", "184px", "", "123px", "123px", "123px", "98px", "303px", "303px", "", "", "", "", ""];
+var stubSort = ['Дата', "DESC"];
+var stubHeaders = {
+  "header": ["Фото", 'collectInfo', "Дата", ["Товар", 'Tur'], "", "Оценка", 'График', "Магазин", "Действие", "Отзыв", "Ответ", "photo_links", "category_name", "brand_name", "feedback_id", "api_id"],
+  "type": ["image", 'collectInfo', "fullDate", "textWithLink", "stringLayers", "input", 'chart', "text", "actionBtn", "actionBtn", "actionBtn", "hidden", "hidden", "hidden", "hidden", "hidden"],
+  "tooltips": ["", "", "", "", "Артикул товара", "Название товара", "", "Дата создания в системе ecomru.ru", "Выбранная категория", "Бренд товара", "", "", "", ""],
+  "filterTypes": ["", "", "date", "text", "", "list", "", "list", "", "text", "text", "", "", "", "", ""],
+  "filterList": ["", "", "", "", "", {
+    "1": true,
+    "2": true,
+    "3": true,
+    "4": true,
+    "5": true
+  }, "", {
+    "Элко ВБ": true,
+    "unek_content": true
+  }, "", "", "", "", "", "", "", ""],
+  styles: [[null, null, null, null, [{
+    color: 'blue'
+  }, {
+    color: 'green'
+  }], null, null, null, null, null, null], [null, null, null, null, [{
+    color: 'blue'
+  }, [{
+    color: 'green'
+  }, {
+    color: 'red',
+    fontSize: 15
+  }]], null, null, null, null, null, null]]
+};
+var stubFetchedData = [["https://basket-10.wbbasket.ru/vol1356/part135691/135691601/images/big/1.jpg", ["https://cdn1.ozone.ru/s3/multimedia-m/6820878154.jpg", ["Стиральная машина INDESIT IWUC 4105(CIS), фронтальная загрузка, белая", 'link'], "Стиральная машина", "Indesit", "1273407"], "2024-03-17T23:05:56+03:00", ["Умные часы GT 3 PRO ODIN-B19, серый", "135691601"], ['asd', 'dsa'], ['', 'usd', 123124], {
+  datasets: [[1, 2, 3], [2, 3, 1], [3, 1, 2]],
+  labels: ['05.04', '05.06', '05.07'],
+  label: ['revenue', 'sales', 'expenses']
+}, "Элко ВБ", "https://apps1.ecomru.ru:9001/developerimages/eye-icon.svg", ["Часики хорошие.", ""], ["Добрый день! Благодарим за высокую оценку! Спасибо, что уделили время на написание отзыва. Желаем приятной эксплуатации.\n", ""], [], "Смарт-часы", "Huawei", "kZAeAe8WTR26S8OhfRk7", "wb1360"], [{
+  value: "https://basket-10.wbbasket.ru/vol1317/part131729/131729694/images/big/1.jpg",
+  alt: 'test'
+}, ["https://cdn1.ozone.ru/s3/multimedia-m/6820878154.jpg", "Стиральная машина INDESIT IWUC 4105(CIS), фронтальная загрузка, белая", ["Стиральная машина", 'link'], "Indesit", "1273407"], "2024-03-17T23:02:46+03:00", ["УШМ ИНТЕРСКОЛ 125/700 529.1.0.00", "131729694"], ['asd', ['dsa', '%']], ['', 'usd', 12314324], {
+  datasets: [[1, 2, 3], [2, 3, 1], [3, 1, 2]],
+  labels: ['05.04', '05.06', '05.07'],
+  label: ['revenue', 'sales', 'expenses']
+}, "Элко ВБ", "https://apps1.ecomru.ru:9001/developerimages/eye-icon.svg", ["", ""], ["Добрый день! Спасибо, за вашу оценку! Желаем приятной эксплуатации.", ""], [], "Шлифовальные машины", "ИНТЕРСКОЛ", "sCnINleBLkhU7ZIErE46", "wb1360"]];
+var _default = exports["default"] = {
+  title: 'Components/TableBox',
+  component: _TableBox["default"],
+  parameters: {
+    laout: 'centered'
+  },
+  args: {
+    loading: false,
+    fetchedData: stubFetchedData,
+    headers: stubHeaders,
+    onDelete: (0, _addonActions.action)('onDelete'),
+    onEdit: (0, _addonActions.action)('onEdit'),
+    onCheck: (0, _addonActions.action)('onCheck'),
+    onInputHandler: (0, _addonActions.action)('onInputHandler'),
+    onAddAcc: (0, _addonActions.action)('onAddAcc'),
+    isSortable: true,
+    onBooleanCheckbox: false,
+    onAction: (0, _addonActions.action)('onAction'),
+    fetchCallback: (0, _addonActions.action)('fetchCallback'),
+    sort: stubSort,
+    isInsideTable: false,
+    fetchDataInsideFunc: (0, _addonActions.action)('fetchDataInsideFunc'),
+    nestedTable: false,
+    columnSize: stubColumnSize,
+    setParams: (0, _addonActions.action)('setParams'),
+    fileFilters: [],
+    setFileFilters: (0, _addonActions.action)('setFileFilters'),
+    date: new Date(),
+    basePath: 'main',
+    onRedirect: (0, _addonActions.action)('onRedirect'),
+    lang: 'eng',
+    paginator: true,
+    hideColumn: false,
+    hideExport: false,
+    hideSorting: false,
+    contextMenuArr: [{
+      label: 'Удалить',
+      onClick: (0, _addonActions.action)('onDelete'),
+      type: 'delete'
+    }, {
+      label: 'Редактировать',
+      onClick: (0, _addonActions.action)('onEdit')
+    }, {
+      label: 'Кнопка',
+      onClick: (0, _addonActions.action)('onClick')
+    }],
+    statistic: [{
+      label: 'Товаров',
+      sum: 50
+    }, {
+      label: 'Заказов',
+      sum: 50
+    }, {
+      label: 'Товаров',
+      sum: 50
+    }, {
+      label: 'Заказов',
+      sum: 50
+    }, {
+      label: 'Товаров',
+      sum: 50
+    }, {
+      label: 'Заказов',
+      sum: 50
+    }],
+    panelBtn: true
+  }
+};
+var Default = exports.Default = {
+  render: function render(args) {
+    return /*#__PURE__*/React.createElement(_TableBox["default"], args);
+  }
+};

package/dist/stories/TableBox/img/delete_icon.svg

@@ -0,0 +1,9 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Icon">
+<g id="Device">
+<g id="barcode_fill">
+<path id="&#229;&#189;&#162;&#231;&#138;&#182;" fill-rule="evenodd" clip-rule="evenodd" d="M20 5C21.0544 5 21.9182 5.81588 21.9945 6.85074L22 7V17C22 18.0544 21.1841 18.9182 20.1493 18.9945L20 19H4C2.94564 19 2.08183 18.1841 2.00549 17.1493L2 17V7C2 5.94564 2.81588 5.08183 3.85074 5.00549L4 5H20ZM6 8C5.44772 8 5 8.44772 5 9V15C5 15.5523 5.44772 16 6 16C6.55228 16 7 15.5523 7 15V9C7 8.44772 6.55228 8 6 8ZM12 8C11.4477 8 11 8.44772 11 9C11 8.44772 10.5523 8 10 8C9.48717 8 9.06449 8.38604 9.00673 8.88338L9 9V15C9 15.5523 9.44772 16 10 16C10.5523 16 11 15.5523 11 15C11 15.5523 11.4477 16 12 16C12.5128 16 12.9355 15.614 12.9933 15.1166L13 15V9C13 8.44772 12.5523 8 12 8ZM15 8C14.4872 8 14.0645 8.38604 14.0067 8.88338L14 9V15C14 15.5523 14.4477 16 15 16C15.5128 16 15.9355 15.614 15.9933 15.1166L16 15V9C16 8.44772 15.5523 8 15 8ZM18 8C17.4477 8 17 8.44772 17 9V15C17 15.5523 17.4477 16 18 16C18.5523 16 19 15.5523 19 15V9C19 8.44772 18.5523 8 18 8Z" fill="#15803D"/>
+</g>
+</g>
+</g>
+</svg>

package/dist/stories/TableBox/img/forward_icon.svg

@@ -0,0 +1,9 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Icon">
+<g id="File">
+<g id="archive_fill">
+<path id="&#229;&#189;&#162;&#231;&#138;&#182;" fill-rule="evenodd" clip-rule="evenodd" d="M7.41421 3C6.88378 3 6.37507 3.21071 6 3.58579L3.58579 6C3.30991 6.27588 3.12295 6.62406 3.04336 7H20.9566C20.8771 6.62406 20.6901 6.27588 20.4142 6L18 3.58579C17.6249 3.21071 17.1162 3 16.5858 3H7.41421ZM21 9H3V19C3 20.1046 3.89543 21 5 21H19C20.1046 21 21 20.1046 21 19V9ZM12 11C12.5523 11 13 11.4477 13 12V15.1858L13.4142 14.7715C13.8047 14.381 14.4379 14.381 14.8284 14.7715C15.219 15.1621 15.219 15.7952 14.8284 16.1858L12.7071 18.3071C12.3166 18.6976 11.6834 18.6976 11.2929 18.3071L9.17157 16.1858C8.78105 15.7952 8.78105 15.1621 9.17157 14.7715C9.5621 14.381 10.1953 14.381 10.5858 14.7715L11 15.1858V12C11 11.4477 11.4477 11 12 11Z" fill="#15803D"/>
+</g>
+</g>
+</g>
+</svg>

package/dist/stories/TableBox/img/more_icon.svg

@@ -0,0 +1,10 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_14299_136797)">
+<path d="M16 16C16.5128 16 16.9355 16.386 16.9933 16.8834L17 17V21C17 21.5128 16.614 21.9355 16.1166 21.9933L16 22H8C7.48717 22 7.06449 21.614 7.00673 21.1166L7 21V17C7 16.4872 7.38604 16.0645 7.88338 16.0067L8 16H16ZM19 7C20.6569 7 22 8.34315 22 10V17C22 18.1046 21.1046 19 20 19H19V16C19 14.8954 18.1046 14 17 14H7C5.89543 14 5 14.8954 5 16V19H4C2.89543 19 2 18.1046 2 17V10C2 8.34315 3.34315 7 5 7H19ZM17 9H15C14.4477 9 14 9.44772 14 10C14 10.5128 14.386 10.9355 14.8834 10.9933L15 11H17C17.5523 11 18 10.5523 18 10C18 9.48717 17.614 9.06449 17.1166 9.00673L17 9ZM17 2C17.5523 2 18 2.44772 18 3V5H6V3C6 2.44772 6.44772 2 7 2H17Z" fill="#15803D"/>
+</g>
+<defs>
+<clipPath id="clip0_14299_136797">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/dist/stories/TableBox/img_stories/tag_icon.svg

@@ -0,0 +1,5 @@
+<svg width="12" height="14" viewBox="0 0 12 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="tag">
+<path id="Vector" fill-rule="evenodd" clip-rule="evenodd" d="M9.79497 7.24312L6.14322 10.9672C6.00336 11.1098 5.81392 11.1903 5.61615 11.1911C5.41838 11.192 5.22827 11.1132 5.08722 10.9718L1.74972 7.63006C1.60792 7.48788 1.52731 7.29409 1.52562 7.09131C1.52394 6.88854 1.60131 6.69338 1.74072 6.54877L5.39172 2.75582C5.49636 2.64698 5.62122 2.56049 5.759 2.50141C5.89679 2.44233 6.04475 2.41183 6.19422 2.41171H9.37497C9.57389 2.41171 9.76465 2.49227 9.9053 2.63568C10.046 2.77909 10.125 2.9736 10.125 3.17641V6.43177C10.1249 6.58248 10.0958 6.73171 10.0392 6.87092C9.98254 7.01014 9.89956 7.13661 9.79497 7.24312ZM4.58847 1.95135C4.79796 1.73386 5.04785 1.56111 5.32356 1.4432C5.59926 1.32529 5.89525 1.26459 6.19422 1.26465H9.37497C9.87226 1.26465 10.3492 1.46607 10.7008 1.82459C11.0524 2.18312 11.25 2.66938 11.25 3.17641V6.43177C11.25 6.73314 11.1918 7.03156 11.0787 7.30999C10.9656 7.58842 10.7998 7.8414 10.5907 8.05447L6.93822 11.7786C6.58859 12.1348 6.11517 12.3358 5.62091 12.338C5.12666 12.3401 4.65157 12.1432 4.29897 11.7901L0.961474 8.4483C0.606764 8.09304 0.404968 7.60868 0.400468 7.10174C0.395967 6.59481 0.58913 6.1068 0.937474 5.74506L4.58847 1.95288V1.95135ZM7.87497 5.47053C7.62633 5.47053 7.38788 5.36982 7.21206 5.19056C7.03625 5.0113 6.93747 4.76816 6.93747 4.51465C6.93747 4.26113 7.03625 4.018 7.21206 3.83874C7.38788 3.65947 7.62633 3.55877 7.87497 3.55877C8.12361 3.55877 8.36207 3.65947 8.53789 3.83874C8.7137 4.018 8.81247 4.26113 8.81247 4.51465C8.81247 4.76816 8.7137 5.0113 8.53789 5.19056C8.36207 5.36982 8.12361 5.47053 7.87497 5.47053Z" fill="#B4B8B4"/>
+</g>
+</svg>

package/dist/stories/TextareaDynamicPlaceholder/TextareaDynamicPlaceholder.js

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = require("react");
+var _material = require("@mui/material");
+require("./TextareaDynamicPlaceholder.scss");
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+var TextareaDynamicPlaceholder = function TextareaDynamicPlaceholder(_ref) {
+  var _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? false : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? false : _ref$height,
+    disabled = _ref.disabled,
+    changeValue = _ref.changeValue,
+    _ref$onChange = _ref.onChange,
+    _onChange = _ref$onChange === void 0 ? false : _ref$onChange,
+    _ref$setChangeValue = _ref.setChangeValue,
+    setChangeValue = _ref$setChangeValue === void 0 ? false : _ref$setChangeValue,
+    _ref$tooltip = _ref.tooltip,
+    tooltip = _ref$tooltip === void 0 ? false : _ref$tooltip;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isFocus = _useState2[0],
+    setIsFocus = _useState2[1];
+  var _useState3 = (0, _react.useState)(changeValue ? changeValue : ''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    valueInside = _useState4[0],
+    setValueInside = _useState4[1];
+  var textAreaRef = (0, _react.useRef)();
+  (0, _react.useEffect)(function () {
+    if (_onChange) {
+      _onChange(valueInside);
+    }
+  }, [valueInside]);
+  (0, _react.useEffect)(function () {
+    if (changeValue || changeValue === 0 || changeValue === '') {
+      setValueInside(changeValue);
+      if (setChangeValue) {
+        setChangeValue(false);
+      }
+    }
+  }, [changeValue]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "textarea-dynamic-placeholder",
+    style: {
+      width: width ? width : ''
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "textarea-dynamic-placeholder__content",
+    style: {
+      border: isFocus ? '1px solid #57CC6A' : ''
+    },
+    onClick: function onClick(e) {
+      var _textAreaRef$current;
+      return textAreaRef === null || textAreaRef === void 0 || (_textAreaRef$current = textAreaRef.current) === null || _textAreaRef$current === void 0 ? void 0 : _textAreaRef$current.focus();
+    }
+  }, placeholder && /*#__PURE__*/React.createElement("div", {
+    className: (valueInside === null || valueInside === void 0 ? void 0 : valueInside.length) > 0 ? isFocus ? 'placeholder-dinamyc_min-blue' : 'placeholder-dinamyc_min' : 'placeholder-dinamyc'
+  }, /*#__PURE__*/React.createElement("label", null, placeholder)), /*#__PURE__*/React.createElement(_material.TextareaAutosize, {
+    ref: textAreaRef,
+    style: {
+      backgroundColor: disabled && !isEdit ? '#e0e0e0' : '',
+      overflow: 'auto'
+    },
+    onFocus: function onFocus(e) {
+      setIsFocus(true);
+    },
+    onBlur: function onBlur(e) {
+      setIsFocus(false);
+    },
+    value: valueInside,
+    disabled: disabled && !isEdit,
+    onChange: function onChange(e) {
+      setValueInside(e.target.value);
+      _onChange(e.target.value);
+    }
+  })), tooltip && /*#__PURE__*/React.createElement("p", {
+    className: "textarea-dynamic-placeholder__tooltip"
+  }, tooltip));
+};
+var _default = exports["default"] = TextareaDynamicPlaceholder;