ecomlab-components-next 0.1.159 → 0.1.162

package/dist/stories/ArticleMinBox/ArticleMinBox.stories.js

@@ -0,0 +1,56 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.NoData = exports.Default = void 0;
+var _ArticleMinBox = require("./ArticleMinBox");
+var _addonActions = require("@storybook/addon-actions");
+var _default = exports["default"] = {
+  title: 'Article/ArticleMinBox',
+  component: _ArticleMinBox.ArticleMinBox,
+  parameters: {
+    layout: 'centered'
+  },
+  tags: ['autodocs'],
+  argTypes: {
+    selectView: {
+      options: ['Tile-short', 'Tile-long'],
+      control: {
+        type: 'radio'
+      }
+    }
+  },
+  args: {
+    activeLang: 'rus',
+    paginator: /*#__PURE__*/React.createElement("span", null, "paginator"),
+    pathBread: 'main',
+    onRedirect: (0, _addonActions.action)('onRedirect'),
+    showStatus: true
+  }
+};
+var NoData = exports.NoData = {
+  args: {
+    articlesData: {}
+  }
+};
+var Default = exports.Default = {
+  args: {
+    articlesData: {
+      "data": [[52, 1, [{
+        value: "https://apps1.ecomru.ru:9001/developerimages/52_5_2023-06-20_193005.619110.jpeg",
+        alt: ''
+      }, {
+        value: "https://apps1.ecomru.ru:9001/developerimages/52_6_2023-07-26_205440.922556.jpeg",
+        alt: ''
+      }], ["\u043D\u043E\u0432\u043E\u0435\n", "/article/novoe/52"], ['Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать… Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать…', 'https://google.com'], ["add tag", "\u043C\u0430\u0440\u043A\u0435\u0442\u0438\u043D\u0433"], "07 Mar 2023", "-", 1, 194, ["https://dl.ecomru.ru/service-files/account_status_ok.png", "Active"]], [51, 3, [null], ["\u0411\u0438\u043E\u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u0438\u043A\u0430: \u041F\u0435\u0447\u0430\u0442\u043D\u044B\u0435 \u043F\u043B\u0430\u0442\u044B \u0438\u0437 \u0447\u0430\u0439\u043D\u043E\u0433\u043E \u0433\u0440\u0438\u0431\u0430", "/article/bioelektronika-pechatnye-platy-iz-chainogo-griba/51"], ['Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать… Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать…', 'https://google.com'], ["test tag", "\u043C\u0430\u0440\u043A\u0435\u0442\u0438\u043D\u0433"], "08 Mar 2023", "ES", 1, 66, ["https://dl.ecomru.ru/service-files/account_status_ok.png", "Active"]], [79, 1, [null], ["\u0411\u0438\u043E\u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u0438\u043A\u0430: \u041F\u0435\u0447\u0430\u0442\u043D\u044B\u0435 \u043F\u043B\u0430\u0442\u044B \u0438\u0437 \u0447\u0430\u0439\u043D\u043E\u0433\u043E \u0433\u0440\u0438\u0431\u0430", "/article/bioelektronika-pechatnye-platy-iz-chainogo-griba/79"], null, ["marketing", "\u043C\u0430\u0440\u043A", "\u0442\u0435\u0441\u0442"], "08 Mar 2023", "-", 1, 86, ["https://dl.ecomru.ru/svg-storage/icon-waiting.svg", "Update"]], [72, 2, ["blob:https://redactor.ecomru.ru/32b591ba-91be-4561-9b10-79ff2ad437fa"], ["123214", "/article/123214/72"], null, ["\u043C\u0430\u0440\u043A\u0435\u0442\u0438\u043D\u0433"], "08 Mar 2023", "kn", 1, 39, ["https://dl.ecomru.ru/svg-storage/icon-not-published.svg", "Redact"]], [105, 1, [null], ["edit", "/article/edit/105"], null, ["marketing", "\u043C\u0430\u0440\u043A"], "08 Mar 2023", "-", 1, 75, ["https://dl.ecomru.ru/svg-storage/icon-not-published.svg", "Redact"]], [55, 1, [null], ["\u0411\u0438\u043E\u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u0438\u043A\u0430: \u041F\u0435\u0447\u0430\u0442\u043D\u044B\u0435 \u043F\u043B\u0430\u0442\u044B \u0438\u0437 \u0447\u0430\u0439\u043D\u043E\u0433\u043E \u0433\u0440\u0438\u0431\u0430", "/article/bioelektronika-pechatnye-platy-iz-chainogo-griba/55"], ['Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать… Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать…', 'https://google.com'], ["t1", "t3", "\u043C\u0430\u0440\u043A\u0435\u0442\u0438\u043D\u0433"], "08 Mar 2023", "-", 1, 41, ["https://dl.ecomru.ru/svg-storage/icon-not-published.svg", "Redact"]], [54, 1, [null], ["1trA", "/article/1tra/54"], null, [null], "08 Mar 2023", "ES", 1, 38, ["https://dl.ecomru.ru/service-files/account_status_ok.png", "Active"]], [75, 2, [null], ["edited text1 test text", "/article/edited-text1-test-text/75"], ['Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать… Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать…', 'https://google.com'], ["\u043C\u0430\u0440\u043A\u0435\u0442\u0438\u043D\u0433", "\u0442\u0435\u0441\u0442"], "08 Mar 2023", "kn", 1, 8, ["https://dl.ecomru.ru/service-files/account_status_ok.png", "Active"]], [92, 1, ["https://habr.com/ru/company/timeweb/blog/719056/"], ["\u0411\u0438\u043E\u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u0438\u043A\u0430: \u041F\u0435\u0447\u0430\u0442\u043D\u044B\u0435 \u043F\u043B\u0430\u0442\u044B \u0438\u0437 \u0447\u0430\u0439\u043D\u043E\u0433\u043E \u0433\u0440\u0438\u0431\u0430", "/article/bioelektronika-pechatnye-platy-iz-chainogo-griba/92"], ['Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать… Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать…', 'https://google.com'], ["\u043C\u0430\u0440\u043A\u0435\u0442\u0438\u043D\u0433"], "08 Mar 2023", "\u0412\u0430\u043B\u0435\u0440\u0438\u044F", 1, 29, ["https://dl.ecomru.ru/service-files/account_status_ok.png", "Active"]], [73, 3, ["https://habr.com/ru/company/timeweb/blog/719056/"], ["\u0411\u0438\u043E\u044D\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u0438\u043A\u0430: \u041F\u0435\u0447\u0430\u0442\u043D\u044B\u0435 \u043F\u043B\u0430\u0442\u044B \u0438\u0437 \u0447\u0430\u0439\u043D\u043E\u0433\u043E \u0433\u0440\u0438\u0431\u0430", "/article/bioelektronika-pechatnye-platy-iz-chainogo-griba/73"], ['Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать… Когда селлер, торгующий на маркетплейсе, становится популярнее, ему приходится ежедневно обрабатывать…', 'https://google.com'], ["test tag"], "08 Mar 2023", "\u0412\u0430\u043B\u0435\u0440\u0438\u044F", 1, 10, ["https://dl.ecomru.ru/service-files/account_status_ok.png", "Active"]]],
+      "labels": {
+        "header": ["id", "portal_id", "\u0424\u043E\u0442\u043E", "\u041D\u0430\u0437\u0432\u0430\u043D\u0438\u0435", "Аннотация", "\u0422\u0435\u0433\u0438", "\u0414\u0430\u0442\u0430 \u043F\u0443\u0431\u043B\u0438\u043A\u0430\u0446\u0438\u0438", "\u0410\u0432\u0442\u043E\u0440", "\u0412\u0440\u0435\u043C\u044F \u0447\u0442\u0435\u043D\u0438\u044F", "\u041A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u043E \u043F\u0440\u043E\u0441\u043C\u043E\u0442\u0440\u043E\u0432", "Статус"],
+        "type": ["hidden", "hidden", "image", "textWithLink", "text", "stringLayers", "date", "text", "text", "text", "imageWithText"]
+      },
+      "total": 69
+    },
+    selectView: 'Tile-short',
+    hideInfo: false
+  }
+};

package/dist/stories/BasicSelection/BasicSelection.js

@@ -0,0 +1,143 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _link = _interopRequireDefault(require("next/link"));
+var _headers = _interopRequireDefault(require("../../common/headers"));
+var _NoArticles = _interopRequireDefault(require("./../NoArticles/NoArticles"));
+var _LongTileArticleBox = _interopRequireDefault(require("./../LongTileArticleBox/LongTileArticleBox"));
+var _ShortTileArticleBox = _interopRequireDefault(require("./../ShortTileArticleBox/ShortTileArticleBox"));
+var _reactSpinners = require("react-spinners");
+var _utils = require("../../common/utils");
+var _fetchUrls = require("../../common/fetchUrls");
+var _react = require("react");
+require("./BasicSelection.scss");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+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 BasicSelection = function BasicSelection(_ref) {
+  var _ref$activeLang = _ref.activeLang,
+    activeLang = _ref$activeLang === void 0 ? 'rus' : _ref$activeLang,
+    setSelectedEndLevelValue = _ref.setSelectedEndLevelValue,
+    PORTAL_ID = _ref.PORTAL_ID,
+    _ref$widthContent = _ref.widthContent,
+    widthContent = _ref$widthContent === void 0 ? false : _ref$widthContent;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
+  var translateSeeAll = function translateSeeAll() {
+    if (activeLang == 'eng') return 'See all results';
+    if (activeLang == 'tur') return 'Tüm sonuçları gör';
+    return 'Смотреть все результаты';
+  };
+  var _useState3 = (0, _react.useState)([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    articles = _useState4[0],
+    setArticles = _useState4[1];
+  var fetchArticlesPreview = function fetchArticlesPreview() {
+    var abortController = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : new AbortController();
+    setLoading(true);
+    var url = "".concat(_fetchUrls.RavshanArticlesHttps, "/article/preview");
+    var body = JSON.stringify({
+      portal_id: PORTAL_ID,
+      lang: activeLang
+    });
+    fetch(url, {
+      body: body,
+      method: 'POST',
+      headers: _headers["default"],
+      signal: abortController.signal
+    }).then(function (res) {
+      return res.json();
+    }).then(function (json) {
+      setArticles(json);
+    })["catch"](function (err) {
+      return console.error(err);
+    })["finally"](function () {
+      return setLoading(false);
+    });
+  };
+  (0, _react.useEffect)(function () {
+    var abortController = new AbortController();
+    fetchArticlesPreview(abortController);
+    setSelectedEndLevelValue(null);
+    return function () {
+      if (abortController) abortController.abort();
+    };
+  }, []);
+  (0, _react.useEffect)(function () {
+    var abortController = new AbortController();
+    fetchArticlesPreview(abortController);
+    setSelectedEndLevelValue(null);
+    return function () {
+      if (abortController) abortController.abort();
+    };
+  }, [activeLang]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "basic-selection"
+  }, loading ? /*#__PURE__*/React.createElement("div", {
+    className: "loader-box"
+  }, /*#__PURE__*/React.createElement(_reactSpinners.MoonLoader, {
+    className: "loader",
+    color: "#7b7b7b",
+    speedMultiplier: 0.5,
+    size: 65
+  })) : /*#__PURE__*/React.createElement(React.Fragment, null, articles.length > 0 ? articles === null || articles === void 0 ? void 0 : articles.map(function (_ref2) {
+    var name = _ref2.name,
+      article = _ref2.article,
+      type = _ref2.type,
+      link = _ref2.link;
+    return /*#__PURE__*/React.createElement("section", {
+      className: "basic-selection__item"
+    }, /*#__PURE__*/React.createElement("h2", {
+      className: "title"
+    }, name), /*#__PURE__*/React.createElement("div", {
+      className: "article-group"
+    }, article === null || article === void 0 ? void 0 : article.map(function (data) {
+      return type == 'длинная плитка' && widthContent > 1000 ? /*#__PURE__*/React.createElement(_LongTileArticleBox["default"], {
+        activeLang: activeLang,
+        key: data.id,
+        id: data.id,
+        name: data.cpu,
+        author: data.author,
+        annotation: data.annotation,
+        photoPreview: data === null || data === void 0 ? void 0 : data.value,
+        tags: data.tags,
+        date: new Date(data.date),
+        timeToRead: data.reading_time_min,
+        views: data.clicks,
+        transliter: function transliter(e) {
+          return (0, _utils.transliter)(e);
+        },
+        pathBread: 'main'
+      }) : /*#__PURE__*/React.createElement(_ShortTileArticleBox["default"], {
+        activeLang: activeLang,
+        key: data.id,
+        id: data.id,
+        name: data.cpu,
+        author: data.author,
+        annotation: data.annotation,
+        photoPreview: data === null || data === void 0 ? void 0 : data.value,
+        tags: data.tags,
+        date: new Date(data.date),
+        timeToRead: data.reading_time_min,
+        views: data.clicks,
+        transliter: function transliter(e) {
+          return (0, _utils.transliter)(e);
+        },
+        pathBread: 'main'
+      });
+    })), /*#__PURE__*/React.createElement(_link["default"], {
+      href: "".concat(link),
+      className: "link_grey"
+    }, translateSeeAll()));
+  }) : /*#__PURE__*/React.createElement(_NoArticles["default"], null)));
+};
+var _default = exports["default"] = BasicSelection;

package/dist/stories/BasicSelection/BasicSelection.scss

@@ -0,0 +1,97 @@
+.basic-selection {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    height: 100%;
+    gap: 50px;
+
+    &__item {
+        display: flex;
+        flex-direction: column;
+        width: 100%;
+        height: 100%;
+        gap: 20px;
+
+        .title {
+            color: #0B110B;
+            font-family: NunitoSans;
+            font-size: 28px;
+            font-style: normal;
+            font-weight: 500;
+            line-height: 32px;
+            letter-spacing: -0.56px;
+        }
+
+        .article-group {
+            display: flex;
+            flex-wrap: wrap;
+            width: 100%;
+            gap: 10px;
+            column-gap: 30px;
+            row-gap: 24px;
+
+            .tile-long .article-min .content-box .title {
+                word-break: break-word;
+            }
+        }
+
+        .link_grey {
+            color: #747F90;
+            text-align: right;
+            font-family: NunitoSans;
+            font-size: 16px;
+            font-style: normal;
+            font-weight: 600;
+            line-height: 24px;
+        }
+    }
+}
+
+@media(max-width: 430px) {
+    .basic-selection {
+        flex-direction: column;
+        row-gap: 6px;
+        column-gap: 6px;
+    
+        &__item {
+            display: flex;
+            flex-direction: column;
+           // align-items: center;
+            width: 100%;
+            height: 100%;
+            gap: 20px;
+    
+            .title {
+                color: #0B110B;
+                font-family: NunitoSans;
+                font-size: 26px;
+                font-style: normal;
+                font-weight: 500;
+                line-height: 32px;
+                letter-spacing: -0.56px;
+            }
+    
+            .article-group {
+                gap: 6px !important;
+                column-gap: 6px !important;
+                row-gap: 6px !important;
+    
+                .tile-long .article-min .content-box .title {
+                    word-break: break-word;
+                }
+            }
+    
+            .link_grey {
+                align-self: center;
+                color: #747F90;
+                text-align: right;
+                font-family: NunitoSans;
+                font-size: 16px;
+                font-style: normal;
+                font-weight: 600;
+                line-height: 24px;
+                padding-bottom: 20px;
+            }
+        }
+    }
+}

package/dist/stories/BasicSelection/BasicSelection.stories.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _BasicSelection = _interopRequireDefault(require("./BasicSelection"));
+var _addonActions = require("@storybook/addon-actions");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Article/BasicSelection',
+  component: _BasicSelection["default"],
+  parameters: {
+    layout: 'centered'
+  },
+  args: {
+    activeLang: 'rus',
+    setSelectedEndLevelValue: (0, _addonActions.action)('setSelectedEndLevelValue'),
+    PORTAL_ID: 2,
+    widthContent: false
+  }
+};
+var Default = exports.Default = {
+  render: function render(args) {
+    return /*#__PURE__*/React.createElement("div", {
+      style: {
+        width: '100%',
+        height: '100%'
+      }
+    }, /*#__PURE__*/React.createElement(_BasicSelection["default"], args));
+  }
+};

package/dist/stories/Breadcrumb/Breadcrumb.js

@@ -0,0 +1,113 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _link = _interopRequireDefault(require("next/link"));
+var _home_icon = _interopRequireDefault(require("./img/home_icon.svg"));
+var _router = require("next/router");
+require("./Breadcrumb.scss");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread 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 _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+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; } // import { transliter } from '../../common/utils';
+// import { useEffect, useState } from 'react';
+var translate = {
+  news: {
+    rus: 'новостей',
+    eng: 'news'
+  }
+};
+var Breadcrumb = function Breadcrumb(_ref) {
+  var breadcrumbs = _ref.breadcrumbs,
+    elementTitle = _ref.elementTitle,
+    localizedPath = _ref.localizedPath,
+    noPortal = _ref.noPortal,
+    firstItem = _ref.firstItem,
+    newsCount = _ref.newsCount,
+    _ref$activeLang = _ref.activeLang,
+    activeLang = _ref$activeLang === void 0 ? 'rus' : _ref$activeLang,
+    _ref$hideTitle = _ref.hideTitle,
+    hideTitle = _ref$hideTitle === void 0 ? false : _ref$hideTitle,
+    paths = _ref.paths,
+    setPaths = _ref.setPaths,
+    pathsWebName = _ref.pathsWebName,
+    setPathsWebName = _ref.setPathsWebName;
+  var router = (0, _router.useRouter)();
+  var translateMain = function translateMain() {
+    if (activeLang == 'eng') return 'Main';
+    if (activeLang == 'tur') return 'Ana Sayfa';
+    return 'Главная';
+  };
+  var getPathToLink = function getPathToLink(index) {
+    return pathsWebName === null || pathsWebName === void 0 ? void 0 : pathsWebName.filter(function (p) {
+      return p;
+    }).reduce(function (previous, current, i) {
+      return i <= index ? "".concat(previous, "/").concat(current) : previous;
+    }, '');
+  };
+  var onClickHandler = function onClickHandler(item, path) {
+    router.push(path);
+    if (item === 'main') {
+      if (typeof setPaths === 'function') {
+        return setPaths([]);
+      }
+      if (typeof setPathsWebName === 'function') {
+        return setPathsWebName([]);
+      }
+    }
+    var index = paths === null || paths === void 0 ? void 0 : paths.indexOf(item);
+    setPaths(function (prev) {
+      return index > -1 ? prev === null || prev === void 0 ? void 0 : prev.slice(0, index + 1) : [].concat(_toConsumableArray(prev), [item]);
+    });
+    setPathsWebName(function (prev) {
+      return index > -1 ? prev === null || prev === void 0 ? void 0 : prev.slice(0, index + 1) : [].concat(_toConsumableArray(prev), [item]);
+    });
+  };
+  var mainPath = '/articles/main';
+  return /*#__PURE__*/React.createElement("div", {
+    className: "header-breadcrumb"
+  }, /*#__PURE__*/React.createElement("nav", {
+    className: "breadcrumb__nav"
+  }, /*#__PURE__*/React.createElement("ul", {
+    className: "breadcrumb"
+  }, /*#__PURE__*/React.createElement("li", {
+    className: "breadcrumb__link",
+    onClick: function onClick(e) {
+      return onClickHandler('main', mainPath);
+    }
+  }, /*#__PURE__*/React.createElement("img", _extends({
+    className: "img-home"
+  }, _home_icon["default"])), /*#__PURE__*/React.createElement(_link["default"], {
+    href: mainPath
+  }, firstItem ? firstItem : translateMain())), localizedPath && /*#__PURE__*/React.createElement("li", {
+    className: "breadcrumb__link"
+  }, /*#__PURE__*/React.createElement(_link["default"], {
+    href: '/'
+  }, localizedPath)), paths === null || paths === void 0 ? void 0 : paths.filter(function (p) {
+    return p;
+  }).map(function (path, i) {
+    var url = "/articles".concat(getPathToLink(i));
+    return /*#__PURE__*/React.createElement("li", {
+      key: path,
+      className: "breadcrumb__link",
+      onClick: function onClick(e) {
+        return onClickHandler(path, url);
+      }
+    }, /*#__PURE__*/React.createElement(_link["default"], {
+      href: url
+    }, path));
+  }), elementTitle && /*#__PURE__*/React.createElement("li", {
+    className: "element-title"
+  }, elementTitle))), !hideTitle && /*#__PURE__*/React.createElement("h2", {
+    className: "title"
+  }, !hideTitle ? elementTitle ? elementTitle : paths.at(-1) : 'ㅤ', newsCount !== 0 && newsCount !== undefined && newsCount !== null && newsCount !== "" && /*#__PURE__*/React.createElement("span", {
+    className: "text_grey"
+  }, "".concat(newsCount, " ").concat(translate.news[activeLang]))));
+};
+var _default = exports["default"] = Breadcrumb;

package/dist/stories/Breadcrumb/Breadcrumb.scss

@@ -0,0 +1,92 @@
+.breadcrumb {
+    display: flex;
+    list-style: none;
+    flex-wrap: wrap;
+    color: #2B2B46;
+    font-family: NunitoSans;
+    font-size: 16px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 20px;
+
+    &__nav {
+        display: block;
+        width: 100%;
+        height: auto;
+        margin-left: auto;
+        margin-right: auto;
+        color: #AAAAAA;
+        font-size: 14px;
+    }
+
+    li:last-child {
+        &::after {
+            display: none;
+        }
+    }
+
+    &__link {
+        display: flex;
+        align-items: center;
+
+        .img-home {
+            margin-right: 8px;
+        }
+
+        &::after,
+        &::before {
+            content: "/";
+            display: inline-block;
+            // background-image: url("./img/drop-right.svg");
+            // background-position: center;
+            // background-repeat: no-repeat;
+            // width: 6px;
+            // height: 12px;
+            vertical-align: middle;
+            margin-left: 8px;
+            margin-right: 8px;
+            color: #2B2B46;
+            font-family: NunitoSans;
+            font-size: 18px;
+            font-style: normal;
+            font-weight: 400;
+            line-height: 22px;
+        }
+
+        &::before {
+            content: "";
+            display: none;
+            transform: rotate(180deg);
+        }
+    }
+
+    .element-title {
+        //  color: #88306D;
+    }
+}
+
+.header-breadcrumb {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+
+    .title {
+        color: #2B2B46;
+        font-family: "Golos Text";
+        font-size: 30px;
+        font-style: normal;
+        font-weight: 600;
+        line-height: 38px;
+
+        .text_grey {
+            display: inline-block;
+            margin-left: 16px;
+            color: var(--unnamed, #AAA);
+            font-family: "Golos Text";
+            font-size: 14px;
+            font-style: normal;
+            font-weight: 400;
+            line-height: normal;
+        }
+    }
+}

package/dist/stories/Breadcrumb/Breadcrums.stories.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _Breadcrumb = _interopRequireDefault(require("./Breadcrumb"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'Article/Breadcrumbs',
+  component: _Breadcrumb["default"],
+  parameters: {
+    layout: 'centered'
+  },
+  args: {
+    baseRoute: 'articles',
+    breadcrumbs: {
+      'portal_name': 'gtcom.io',
+      '1level_name': 'services',
+      '2level_name': 'parsing'
+    },
+    elementTitle: 'test article',
+    localizedPath: 'статьи',
+    // mainRoute: 'main',
+    firstItem: undefined,
+    newsCount: 15,
+    activeLang: 'eng',
+    hideTitle: false
+  }
+};
+var Default = exports.Default = {};

package/dist/stories/Breadcrumb/img/drop-right.svg

@@ -0,0 +1,3 @@
+<svg width="8" height="17" viewBox="0 0 8 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2.20041 5.23966C2.48226 4.93613 2.95681 4.91856 3.26034 5.20041L6.76034 8.45041C6.91317 8.59232 7 8.79145 7 9C7 9.20856 6.91317 9.40769 6.76034 9.5496L3.26034 12.7996C2.95681 13.0815 2.48226 13.0639 2.20041 12.7603C1.91856 12.4568 1.93613 11.9823 2.23966 11.7004L5.14779 9L2.23966 6.2996C1.93613 6.01775 1.91856 5.5432 2.20041 5.23966Z" fill="#111111"/>
+</svg>

package/dist/stories/Breadcrumb/img/home_icon.svg

@@ -0,0 +1,5 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="material-symbols:home">
+<path id="Vector" d="M3 15.75V6.75L9 2.25L15 6.75V15.75H10.5V10.5H7.5V15.75H3Z" fill="#636D65"/>
+</g>
+</svg>

package/dist/stories/ButtonBasic/ButtonBasic.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ButtonBasic = void 0;
+require("./ButtonBasic.scss");
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var ButtonBasic = exports.ButtonBasic = function ButtonBasic(_ref) {
+  var text = _ref.text,
+    _onClick = _ref.onClick,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? 210 : _ref$width,
+    minWidth = _ref.minWidth,
+    size = _ref.size,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    props = _ref.props,
+    maxWidth = _ref.maxWidth,
+    style = _ref.style,
+    _ref$blue = _ref.blue,
+    blue = _ref$blue === void 0 ? false : _ref$blue,
+    _ref$orange = _ref.orange,
+    orange = _ref$orange === void 0 ? false : _ref$orange,
+    _ref$red = _ref.red,
+    red = _ref$red === void 0 ? false : _ref$red,
+    _ref$green = _ref.green,
+    green = _ref$green === void 0 ? false : _ref$green,
+    _ref$whiteBlue = _ref.whiteBlue,
+    whiteBlue = _ref$whiteBlue === void 0 ? false : _ref$whiteBlue,
+    _ref$violet = _ref.violet,
+    violet = _ref$violet === void 0 ? false : _ref$violet,
+    _ref$action = _ref.action,
+    action = _ref$action === void 0 ? false : _ref$action,
+    _ref$whiteGreen = _ref.whiteGreen,
+    whiteGreen = _ref$whiteGreen === void 0 ? false : _ref$whiteGreen;
+  // Если передан только "width" - то она становится статичной шириной, кнопка не расширяется и не сужается
+  // Если передана "minWidth" кнопка становится пластичной и тянется до with(наибольшей ширины), minWidt(наименьшей ширины)
+
+  var colorClassName = function colorClassName() {
+    if (blue) return 'blue-btn';
+    if (whiteBlue) return 'white-blue-btn';
+    if (green) return 'green-btn';
+    if (orange) return 'orange-btn';
+    if (red) return 'red-btn';
+    if (violet) return 'violet-btn';
+    if (action) return 'action-btn';
+    if (whiteGreen) return 'white-green-btn';
+  };
+  return /*#__PURE__*/React.createElement("button", _extends({
+    className: "btn-basic ".concat(colorClassName() || 'blue-btn'),
+    disabled: disabled,
+    style: _objectSpread(_defineProperty({
+      minWidth: minWidth ? minWidth : '',
+      maxWidth: width,
+      height: size ? size : '40px'
+    }, "maxWidth", maxWidth ? maxWidth : ''), style),
+    onClick: function onClick(e) {
+      if (typeof _onClick === 'function') {
+        _onClick(e);
+      }
+    }
+  }, props), text);
+};