ecomlab-components-next 0.1.23 → 0.1.25

package/dist/components/ConstructorComponents/PointsList/PointsList.scss

@@ -0,0 +1,160 @@
+.points-list {
+    display: flex;
+    flex-direction: column;
+    gap: 32px;
+
+    &__title {
+        font-family: "Golos Text";
+        font-size: 42px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 51px;
+    }
+
+    &__content {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 24px,
+    }
+
+    &__item {
+        display: flex;
+        flex-direction: column;
+        gap: 6px;
+        width: 100%;
+        max-width: calc(33% - 13px);
+    }
+
+    &__item-title {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        color: #000;
+        font-family: "Golos Text";
+        font-size: 18px;
+        font-style: normal;
+        font-weight: 400;
+        line-height: 24px;
+    }
+
+    &__item-text {
+        color: #797979;
+        font-family: "Golos Text";
+        font-size: 12px;
+        font-style: normal;
+        font-weight: 400;
+        line-height: 18px;
+    }
+
+    &__btn {
+        display: flex;
+        justify-content: space-between;
+        align-items: flex-start;
+        width: 100%;
+        align-self: stretch;
+        padding: 12px 24px;
+        border-radius: 10px;
+        background: #F0F3FE;
+        border: none;
+        cursor: pointer;
+    }
+
+    &__btn-text {
+        color: #2D42FF;
+        font-family: "Golos Text";
+        font-size: 18px;
+        font-style: normal;
+        font-weight: 400;
+        line-height: 24px;
+    }
+
+    &__btn-text-min {
+        color: #2D42FF;
+        font-family: "Golos Text";
+        font-size: 12px;
+        font-style: normal;
+        font-weight: 400;
+        line-height: 18px;
+    }
+
+    &__btn-info {
+        display: flex;
+        align-items: flex-start;
+        flex-direction: column;
+    }
+
+    .max-points-2 {
+        max-width: calc(50% - 16px);
+    }
+
+    .max-points-3 {
+        max-width: calc(33.33% - 12px);
+    }
+
+    .max-points-4 {
+        max-width: calc(25% - 18px);
+    }
+
+    .max-points-5 {
+        max-width: calc(20% - 14px);
+    }
+}
+
+@media (max-width: 1100px) {
+    .points-list {
+        &__title {
+            font-size: 28px;
+            line-height: 32px;
+        }
+
+        &__item {
+            max-width: calc(50% - 12px);
+        }
+
+        .max-points-2 {
+            max-width: calc(50% - 12px);
+        }
+
+        .max-points-3 {
+            max-width: calc(50% - 12px);
+        }
+
+        .max-points-4 {
+            max-width: calc(50% - 12px);
+        }
+
+        .max-points-5 {
+            max-width: calc(50% - 12px);
+        }
+    }
+}
+
+@media (max-width: 430px) {
+    .points-list {
+
+        &__title {
+            font-size: 24px;
+            line-height: 32px;
+        }
+
+        &__item {
+            max-width: calc(100%);
+        }
+
+        .max-points-2 {
+            max-width: 100%;
+        }
+
+        .max-points-3 {
+            max-width: 100%;
+        }
+
+        .max-points-4 {
+            max-width: 100%;
+        }
+
+        .max-points-5 {
+            max-width: 100%;
+        }
+    }
+}

package/dist/components/ConstructorComponents/PointsList/PointsList.stories.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.PointsListTest = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _PointsList = _interopRequireDefault(require("./PointsList"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var point_list = [{
+  title: 'Загружай свои файлы и документы',
+  description: "\u0417\u0430\u0433\u0440\u0443\u0436\u0430\u0439 \u0441\u0432\u043E\u0438 \u0444\u0430\u0439\u043B\u044B \u0438 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u044B \u043D\u0430 \u043F\u043B\u0430\u0442\u0444\u043E\u0440\u043C\u0443 \u0432 \n        \u0444\u043E\u0440\u043C\u0430\u0442\u0435 PDF, \u043D\u0430\u043F\u0440\u0438\u043C\u0435\u0440: \u0438\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0438\u0438, \u043F\u043E\u043B\u0438\u0442\u0438\u043A\u0443 \u043A\u043E\u043C\u043F\u0430\u043D\u0438\u0438, \n        \u043E\u043F\u0438\u0441\u0430\u043D\u0438\u044F \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u043E\u0432 \u0438 \u0443\u0441\u043B\u0443\u0433, \u043E\u0442\u0432\u0435\u0442\u044B \u043D\u0430 \u0432\u043E\u043F\u0440\u043E\u0441\u044B \n        (FAQ), \u043F\u0440\u0435\u0437\u0435\u043D\u0442\u0430\u0446\u0438\u0438 \u0438 \u043F\u0440\u043E\u0447\u0438\u0435 \u0434\u0430\u043D\u043D\u044B\u0435."
+}, {
+  title: 'Обработка до 90% запросов',
+  description: "\u041D\u0430 \u043E\u0441\u043D\u043E\u0432\u0435 \u043F\u043E\u043B\u0443\u0447\u0435\u043D\u043D\u043E\u0439 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0438, \u043F\u043B\u0430\u0442\u0444\u043E\u0440\u043C\u0430 \n        \u0441\u043E\u0437\u0434\u0430\u0441\u0442 \u0443\u043D\u0438\u043A\u0430\u043B\u044C\u043D\u0443\u044E \u0431\u0430\u0437\u0443 \u0434\u0430\u043D\u043D\u044B\u0445, \u043A\u043E\u0442\u043E\u0440\u0430\u044F \u043F\u043E\u043C\u043E\u0436\u0435\u0442 \n        \u0441\u0434\u0435\u043B\u0430\u0442\u044C \u0442\u0432\u043E\u0435\u0433\u043E \u043B\u0438\u0447\u043D\u043E\u0433\u043E \u0431\u043E\u0442\u0430, \u0441\u043F\u043E\u0441\u043E\u0431\u043D\u043E\u0433\u043E \n        \u043E\u0431\u0440\u0430\u0431\u0430\u0442\u044B\u0432\u0430\u0442\u044C \u0434\u043E 90% \u0437\u0430\u043F\u0440\u043E\u0441\u043E\u0432 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u0435\u0439."
+}, {
+  title: 'Повышаем известность магазина',
+  description: "\u041F\u043E\u0441\u043B\u0435 \u0437\u0430\u043F\u0440\u043E\u0441\u0430 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044F \u0432 \u0447\u0430\u0442\u0435, \u0441\u0438\u0441\u0442\u0435\u043C\u0430 RAG \n        \u043D\u0430\u0445\u043E\u0434\u0438\u0442 \u043D\u0443\u0436\u043D\u044B\u0439 \u044D\u043B\u0435\u043C\u0435\u043D\u0442 \u0432 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043D\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445, \u0430 \u0431\u043E\u0442 \n        \u043F\u0440\u0435\u043E\u0431\u0440\u0430\u0437\u0443\u0435\u0442 \u0435\u0433\u043E \u0432 \u0447\u0438\u0442\u0430\u0431\u0435\u043B\u044C\u043D\u044B\u0439 \u0444\u043E\u0440\u043C\u0430\u0442 \u0438 \u043D\u0430\u043F\u0440\u0430\u0432\u043B\u044F\u0435\u0442 \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044E."
+}, {
+  title: 'Создай свою базу внутри чат бота',
+  description: "\u0421\u043E\u0437\u0434\u0430\u0439\u0442\u0435 \u0431\u0430\u0437\u0443 \u0437\u043D\u0430\u043D\u0438\u0439 \u0432\u043D\u0443\u0442\u0440\u0438 \u0447\u0430\u0442 \u0431\u043E\u0442\u0430, \n        \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0432 \u043D\u0430 \u043F\u043B\u0430\u0442\u0444\u043E\u0440\u043C\u0443 \u043D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u044B\u0435 \u0434\u0430\u043D\u043D\u044B\u0435 \u0432 PDF. \u041F\u043E\u0441\u043B\u0435 \n        \u043E\u0431\u0440\u0430\u0449\u0435\u043D\u0438\u044F \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044F, \u043F\u0440\u043E\u0433\u0440\u0430\u043C\u043C\u0430 \u043E\u0431\u0440\u0430\u0431\u043E\u0442\u0430\u0435\u0442 \u0437\u0430\u043F\u0440\u043E\u0441 \u0438 \n        \u0432\u044B\u0434\u0430\u0441\u0442 \u043E\u0442\u0432\u0435\u0442 \u043D\u0430 \u043E\u0441\u043D\u043E\u0432\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043D\u043D\u043E\u0439 \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u0438."
+}, {
+  title: 'Время ответа от 3 до 10 секунд',
+  description: "\u0412\u0440\u0435\u043C\u044F \u043E\u0442\u0432\u0435\u0442\u0430 \u0431\u043E\u0442\u0430 \u0441\u043E\u0441\u0442\u0430\u0432\u043B\u044F\u0435\u0442 \u043E\u0442 3 \u0434\u043E 10 \u0441\u0435\u043A\u0443\u043D\u0434, \n        \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043C\u043E\u0441\u0442\u0438 \u043E\u0442 \u0441\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0438 \u0437\u0430\u043F\u0440\u043E\u0441\u0430 \u0438 \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043D\u043D\u044B\u0445 \u0434\u0430\u043D\u043D\u044B\u0445."
+}
+// {
+//     title: 'Улучшаем ранжирование товаров',
+//     description: `Сформируем дополнительные рекламные 
+//     ставки, за счёт которых твои товары окажутся 
+//     выше в поисковой выдаче и попадут на специальные рекламные позиции.`,
+// },
+];
+var _default = exports["default"] = {
+  title: 'PointsList',
+  component: _PointsList["default"]
+};
+var PointsListTest = exports.PointsListTest = function PointsListTest() {
+  return /*#__PURE__*/_react["default"].createElement(_PointsList["default"], {
+    list: point_list,
+    title: 'Возможности нашего сервиса',
+    className: 'max-items-3'
+  });
+};

package/dist/components/ConstructorComponents/PointsList/img/bx-right-arrow-alt.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="bx-right-arrow-alt.svg">
+<path id="Vector" d="M15.0573 23.9561L16.9427 25.8414L25.8853 16.8987L16.9427 7.95605L15.0573 9.84139L20.7813 15.5654H8V18.2321H20.7813L15.0573 23.9561Z" fill="#2D42FF"/>
+</g>
+</svg>

package/dist/index.js

@@ -33,12 +33,24 @@ Object.defineProperty(exports, "ButtonBasic", {
     return _ButtonBasic["default"];
   }
 });
+Object.defineProperty(exports, "CardsGrey", {
+  enumerable: true,
+  get: function get() {
+    return _CardsGrey["default"];
+  }
+});
 Object.defineProperty(exports, "CardsInfo", {
   enumerable: true,
   get: function get() {
     return _CardsInfo["default"];
   }
 });
+Object.defineProperty(exports, "Carousel", {
+  enumerable: true,
+  get: function get() {
+    return _Carousel["default"];
+  }
+});
 Object.defineProperty(exports, "ClientsAboutUs", {
   enumerable: true,
   get: function get() {
@@ -57,12 +69,30 @@ Object.defineProperty(exports, "Header", {
     return _Header["default"];
   }
 });
+Object.defineProperty(exports, "MainContainer", {
+  enumerable: true,
+  get: function get() {
+    return _MainContainer["default"];
+  }
+});
+Object.defineProperty(exports, "MarqueImgs", {
+  enumerable: true,
+  get: function get() {
+    return _MarqueImgs["default"];
+  }
+});
 Object.defineProperty(exports, "PhoneBlock", {
   enumerable: true,
   get: function get() {
     return _PhoneBlock["default"];
   }
 });
+Object.defineProperty(exports, "PointsList", {
+  enumerable: true,
+  get: function get() {
+    return _PointsList["default"];
+  }
+});
 Object.defineProperty(exports, "Questions", {
   enumerable: true,
   get: function get() {
@@ -107,5 +137,10 @@ var _FormWithBtn = _interopRequireDefault(require("./components/ConstructorCompo
 var _BlocksInfo = _interopRequireDefault(require("./components/ConstructorComponents/BlocksInfo/BlocksInfo"));
 var _StepItems = _interopRequireDefault(require("./components/ConstructorComponents/StepItems/StepItems"));
 var _StatisticCard = _interopRequireDefault(require("./components/ConstructorComponents/StatisticCard/StatisticCard"));
+var _MainContainer = _interopRequireDefault(require("./components/ConstructorComponents/MainContainer/MainContainer"));
+var _CardsGrey = _interopRequireDefault(require("./components/ConstructorComponents/CardsGrey/CardsGrey"));
+var _MarqueImgs = _interopRequireDefault(require("./components/ConstructorComponents/MarqueImgs/MarqueImgs"));
+var _Carousel = _interopRequireDefault(require("./components/ConstructorComponents/Carousel/Carousel"));
+var _PointsList = _interopRequireDefault(require("./components/ConstructorComponents/PointsList/PointsList"));
 var _ButtonBasic = _interopRequireDefault(require("./components/Buttons/ButtonBasic/ButtonBasic"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ecomlab-components-next",
-  "version": "0.1.23",
+  "version": "0.1.25",
   "description": "A set of common and reusable React components",
   "main": "dist/index.js",
   "files": [
@@ -49,7 +49,9 @@
     "react-select": "^5.8.0",
     "imask": "^7.6.1",
     "@emotion/react": "11.11.1",
-    "@emotion/styled": "11.11.0"
+    "@emotion/styled": "11.11.0",
+    "react-fast-marquee": "^1.6.5",
+    "react-multi-carousel": "^2.8.5"
   },
   "eslintConfig": {
     "extends": [