ecomlab-components-next 0.1.11 → 0.1.13

package/dist/components/ConstructorComponents/Tariff/TariffPlan.scss

@@ -0,0 +1,485 @@
+.tariffs-plan {
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+    margin-left: auto;
+    margin-right: auto;
+    width: 100%;
+    height: 100%;
+
+    &__title {
+        color: black;
+        font-family: "Golos Text";
+        font-size: 42px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 1.2;
+    }
+
+    &__my-plan {
+        display: flex;
+        width: auto;
+        padding: 5px 13px;
+        align-items: center;
+        gap: 9px;
+        border-radius: 8px;
+        border: 1px solid #D7D7D7;
+        background: #FFF;
+        color: #000;
+        text-align: right;
+        font-family: "Open Sans";
+        font-size: 14px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 18px;
+
+        span {
+            color: #FF7A00;
+            font-size: 24px;
+            font-weight: 500;
+            line-height: 32px;
+        }
+    }
+
+    &__header {
+        display: flex;
+        gap: 16px;
+        max-width: 100%;
+    }
+
+    &__cards {
+        display: flex;
+        justify-content: flex-end;
+
+        gap: 16px;
+        max-width: 100%;
+    }
+
+    &__item {
+        display: flex;
+        width: 100%;
+        flex-direction: column;
+    }
+
+    &__item-min,
+    &__item-min_hide {
+        display: flex;
+        align-items: center;
+        width: 100%;
+        padding-top: 12px;
+        padding-bottom: 12px;
+        min-height: 36px;
+        border-bottom: 1px solid #C5C5C5;
+    }
+
+    &__items,
+    &__items_hide {
+        transition: 0.5s;
+        max-height: 1800px;
+
+        &_hide {
+            overflow: hidden;
+            max-height: 0;
+            padding: 0;
+            transition: 0.5s;
+        }
+
+        .tariffs-plan__item-min {
+            padding-top: 2px;
+            padding-bottom: 2px;
+            min-height: 36px;
+        }
+    }
+
+    &__label-min {
+        display: flex;
+        gap: 6px;
+        color: #333;
+        font-family: "Open Sans";
+        font-size: 14px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 1.4;
+    }
+
+    &__item-section,
+    &__item-section-label {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        min-width: 240px;
+        max-width: 240px;
+        margin-left: 16px;
+    }
+
+    &__item-section-label {
+        justify-content: start;
+        width: 100%;
+        max-width: 100%;
+        margin-left: 0;
+    }
+
+    &__label {
+        display: flex;
+        gap: 6px;
+        align-items: center;
+        color: #333;
+        font-family: "Golos Text";
+        font-size: 20px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 1.4;
+    }
+
+    &__drop,
+    &__drop_hide {
+        border: none;
+        cursor: pointer;
+        background-color: inherit;
+        margin-left: auto;
+
+        &_hide {
+            transform: rotate(-90deg);
+        }
+    }
+
+    &__done {
+        width: 24px;
+        height: 24px;
+    }
+
+    &__text {
+        text-align: center;
+        color: #808080;
+        text-align: center;
+        font-family: "Open Sans";
+        font-size: 12px;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 1.4;
+
+        span {
+            color: #00B45E;
+        }
+    }
+
+    .content-btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+    }
+
+    &__header {
+        display: flex;
+        width: 100%;
+        align-items: center;
+        gap: 24px;
+    }
+
+
+
+    .promo-code {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        gap: 16px;
+        margin-top: 24px;
+
+        .loader_box {
+            width: fit-content;
+            height: fit-content;
+            position: absolute;
+            top: calc(50% - 16px);
+            right: calc(62px - 12px);
+        }
+
+        .text {
+            color: var(--all-text-secondary-text, #475569);
+            font-family: Inter;
+            font-size: 17px;
+            font-style: normal;
+            font-weight: 500;
+            line-height: 1.4;
+        }
+
+        &__container-input {
+            display: flex;
+            position: relative;
+
+            .input-grey {
+                display: flex;
+                padding: 8px 12px 8px 8px;
+                padding-right: 144px;
+                width: 100%;
+                min-width: 328px;
+                max-width: 328px;
+                min-height: 40px;
+                border-radius: 8px;
+                background: #EDF3F8;
+                border: none;
+                text-align: center;
+
+                &:placeholder {
+                    color: #94A3B8;
+                    text-align: center;
+                    font-family: Inter;
+                    font-size: 13px;
+                    font-style: normal;
+                    font-weight: 400;
+                    line-height: 16px;
+                }
+
+                &:focus {
+                    outline: none;
+                }
+            }
+
+            .text_err {
+                position: absolute;
+                top: 40px;
+                color: #EF4444;
+                font-family: Inter;
+                font-size: 11px;
+                font-style: normal;
+                font-weight: 400;
+                line-height: normal;
+            }
+
+            .btn-grey,
+            .btn-grey_active {
+                width: 124px;
+                height: 40px;
+                top: 0;
+                right: 0;
+                position: absolute;
+                gap: 8px;
+                border-radius: 8px;
+                background: #E1E6EA;
+                border: none;
+
+                &_active {
+                    background-color: white;
+                    color: #00B45E;
+                    border: 1px solid #00B45E;
+                }
+
+
+            }
+        }
+    }
+
+    &__top {
+        display: flex;
+        flex-direction: column;
+        gap: 40px;
+        background-color: white;
+        max-width: 100%;
+        width: 100%;
+        border-radius: 10px;
+        background: #FFF;
+        margin-left: auto;
+        margin-right: auto;
+        min-width: 800px;
+
+        .title_tariffs {
+            color: #0C2037;
+            font-family: Rubik;
+            font-size: 18px;
+            font-style: normal;
+            font-weight: 600;
+            line-height: normal;
+        }
+    }
+
+    .cards-group {
+        display: flex;
+        flex-direction: column;
+        gap: 24px;
+        flex-wrap: wrap;
+
+
+        .tabs-green {
+            margin-left: auto;
+
+            .discount {
+                display: flex;
+                padding: 1px 4px;
+                align-items: center;
+                height: 14px;
+                gap: 8px;
+                border-radius: 2px;
+                background: #3A66FF;
+                width: auto;
+                min-height: 19px;
+                color: #767676;
+                text-align: center;
+                font-family: "Open Sans";
+                color: #FFF;
+                text-align: center;
+                font-family: "Open Sans";
+                font-weight: 700;
+                font-size: 12px;
+                line-height: 14px;
+                white-space: nowrap;
+            }
+        }
+
+        .cards-min-grouop {
+            display: flex;
+            border-radius: 4px;
+            background: #F5F5F5;
+            padding: 4px;
+            margin-left: auto;
+            width: auto;
+            justify-content: center;
+
+            
+
+            .tariff-cards-min,
+            .tariff-cards-min_active {
+                display: flex;
+                width: 100%;
+                min-height: 28px;
+                padding: 0px 8px;
+                align-items: center;
+                gap: 4px;
+                border-radius: 4px;
+                color: #767676;
+                text-align: center;
+                text-overflow: ellipsis;
+                font-family: "Open Sans";
+                font-size: 20px;
+                font-style: normal;
+                font-weight: 400;
+                line-height: 18px;
+                cursor: pointer;
+                justify-content: center;
+
+
+
+                p {
+                    display: flex;
+                    align-items: center;
+                    gap: 10px;
+                    white-space: nowrap;
+
+                    .round {
+                        background-color: white;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        width: 20px;
+                        min-width: 20px;
+                        height: 20px;
+                        border: 1px solid #00B45E;
+                        border-radius: 50%;
+                    }
+                }
+            }
+
+            .tariff-cards-min_active,
+            .tariff-cards-min:hover {
+                transition: 0.3s;
+                background-color: #ffffff;
+
+                p {
+                    color: #00B45E;
+
+                    .round {
+                        span {
+                            transition: 0.3s;
+                            width: 10px;
+                            height: 10px;
+                            border-radius: 50%;
+                            background-color: #00B45E;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    .tariff-cards-group {
+        display: flex;
+        gap: 28px;
+        flex-wrap: wrap;
+        margin-left: auto;
+        margin-right: auto;
+    }
+
+    .tariff-card {
+        display: flex;
+        padding: 10px 14px;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 6px;
+        flex-shrink: 0;
+        border-radius: 6px;
+        border: 1px solid #D7D7D7;
+        background: #FFF;
+        min-height: 190px;
+        min-width: 240px;
+        max-width: 240px;
+        position: relative;
+
+        &__name {
+            color: #FF7A00;
+            font-family: "Golos Text";
+            font-size: 20px;
+            font-style: normal;
+            font-weight: 400;
+            line-height: 1.4;
+        }
+
+        &__sum-box {
+            color: #000;
+            white-space: nowrap;
+            font-size: 28px;
+            font-style: normal;
+            font-weight: 500;
+            line-height: 1.4;
+
+            span {
+                 font-family: "Golos Text" !important;
+                 font-weight: 400;
+            }
+        }
+
+        &__description {
+            text-align: left;
+            color: #606060;
+            font-family: "Golos Text";
+            font-size: 16px;
+            font-style: normal;
+            font-weight: 400;
+            line-height: 24px;
+            margin-top: 7px;
+        }
+
+        &__sticker {
+            display: inline-flex;
+            padding: 7px;
+            justify-content: center;
+            align-items: center;
+            gap: 10px;
+            border-radius: 4px;
+            background: #FFBB56;
+            color: #000;
+            font-family: "Golos Text";
+            font-size: 12px;
+            font-style: normal;
+            font-weight: 500;
+            height: 22px;
+            position: absolute;
+            top: -13px;
+            right: calc(50% - 133px/2);
+        }
+    }
+}
+
+@media (max-width: 1439px) {
+    .tariffs-plan {
+        display: none;
+    }
+}

package/dist/components/ConstructorComponents/Tariff/TariffPlan.stories.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.TariffPlanTest = void 0;
+var _react = require("react");
+var _TariffPlan = _interopRequireDefault(require("./TariffPlan"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var _default = exports["default"] = {
+  title: 'TariffPlan',
+  component: _TariffPlan["default"]
+};
+var TariffPlanTest = exports.TariffPlanTest = function TariffPlanTest() {
+  return /*#__PURE__*/React.createElement(_TariffPlan["default"], null);
+};

package/dist/components/ConstructorComponents/Tariff/img/active.svg

@@ -0,0 +1,5 @@
+<svg width="54" height="53" viewBox="0 0 54 53" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="bx-check.svg">
+<path id="Vector" d="M22.5831 34.4153L15.3111 27.1432L12.1885 30.2658L22.5831 40.6604L44.0194 19.2241L40.8968 16.1016L22.5831 34.4153Z" fill="#00B45E"/>
+</g>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/add.svg

@@ -0,0 +1,6 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="bx-plus-circle.svg">
+<path id="Vector" d="M10.8334 5.83337H9.16671V9.16671H5.83337V10.8334H9.16671V14.1667H10.8334V10.8334H14.1667V9.16671H10.8334V5.83337Z" fill="white"/>
+<path id="Vector_2" d="M9.99996 1.66663C5.40496 1.66663 1.66663 5.40496 1.66663 9.99996C1.66663 14.595 5.40496 18.3333 9.99996 18.3333C14.595 18.3333 18.3333 14.595 18.3333 9.99996C18.3333 5.40496 14.595 1.66663 9.99996 1.66663ZM9.99996 16.6666C6.32413 16.6666 3.33329 13.6758 3.33329 9.99996C3.33329 6.32413 6.32413 3.33329 9.99996 3.33329C13.6758 3.33329 16.6666 6.32413 16.6666 9.99996C16.6666 13.6758 13.6758 16.6666 9.99996 16.6666Z" fill="white"/>
+</g>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/bx-chevron-down.svg

@@ -0,0 +1,3 @@
+<svg width="31" height="32" viewBox="0 0 31 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M21.724 12.3906L16 18.1146L10.276 12.3906L8.39062 14.276L16 21.8853L23.6093 14.276L21.724 12.3906Z" fill="black"/>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/bx-face.svg

@@ -0,0 +1,7 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="icons / bx-face.svg">
+<path id="Vector" d="M16.0003 2.66406C8.64833 2.66406 2.66699 8.6454 2.66699 15.9974C2.66699 23.3494 8.64833 29.3307 16.0003 29.3307C23.3523 29.3307 29.3337 23.3494 29.3337 15.9974C29.3337 8.6454 23.3523 2.66406 16.0003 2.66406ZM16.0003 5.33073C20.2843 5.33073 23.9763 7.87473 25.6723 11.5281C25.2604 11.3331 24.8618 11.1113 24.479 10.8641C23.9337 10.5201 23.315 10.1294 22.5323 9.83473C21.6403 9.49473 20.6657 9.33073 19.5537 9.33073C18.4417 9.33073 17.467 9.49473 16.575 9.8334C15.7923 10.1307 15.1737 10.5214 14.6123 10.8747C14.1083 11.1907 13.675 11.4654 13.1417 11.6667C12.547 11.8921 11.9017 11.9974 11.107 11.9974C10.3137 11.9974 9.66833 11.8921 9.07499 11.6667C8.54166 11.4654 8.10433 11.1894 7.60033 10.8694C7.38566 10.7347 7.14699 10.5921 6.90699 10.4521C8.78299 7.38673 12.151 5.33073 16.0003 5.33073ZM16.0003 26.6641C10.119 26.6641 5.33366 21.8787 5.33366 15.9974C5.33366 14.9174 5.49766 13.8774 5.79766 12.8947C5.92299 12.9721 6.04433 13.0414 6.17499 13.1254C6.72299 13.4721 7.34299 13.8641 8.12966 14.1601C9.02166 14.5001 9.99499 14.6641 11.107 14.6641C12.2177 14.6641 13.1923 14.5001 14.087 14.1614C14.8697 13.8641 15.4883 13.4734 16.0497 13.1201C16.5537 12.8041 16.987 12.5294 17.5203 12.3267C18.1137 12.1027 18.759 11.9974 19.5537 11.9974C20.3483 11.9974 20.9937 12.1027 21.587 12.3281C22.119 12.5281 22.5537 12.8027 23.0723 13.1307C23.6177 13.4747 24.2363 13.8654 25.019 14.1614C25.503 14.3454 26.0163 14.4667 26.5563 14.5494C26.6217 15.0254 26.667 15.5054 26.667 15.9974C26.667 21.8787 21.8817 26.6641 16.0003 26.6641Z" fill="#D2547A"/>
+<path id="Vector_2" d="M11.333 20C12.4376 20 13.333 19.1046 13.333 18C13.333 16.8954 12.4376 16 11.333 16C10.2284 16 9.33301 16.8954 9.33301 18C9.33301 19.1046 10.2284 20 11.333 20Z" fill="#D2547A"/>
+<path id="Vector_3" d="M20.667 20C21.7716 20 22.667 19.1046 22.667 18C22.667 16.8954 21.7716 16 20.667 16C19.5624 16 18.667 16.8954 18.667 18C18.667 19.1046 19.5624 20 20.667 20Z" fill="#D2547A"/>
+</g>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/bx-info-circle.svg

@@ -0,0 +1,6 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="bx-info-circle.svg">
+<path id="Vector" d="M9 1.5C4.8645 1.5 1.5 4.8645 1.5 9C1.5 13.1355 4.8645 16.5 9 16.5C13.1355 16.5 16.5 13.1355 16.5 9C16.5 4.8645 13.1355 1.5 9 1.5ZM9 15C5.69175 15 3 12.3082 3 9C3 5.69175 5.69175 3 9 3C12.3082 3 15 5.69175 15 9C15 12.3082 12.3082 15 9 15Z" fill="black"/>
+<path id="Vector_2" d="M8.25 8.25H9.75V12.75H8.25V8.25ZM8.25 5.25H9.75V6.75H8.25V5.25Z" fill="black"/>
+</g>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/bx-package.svg

@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M29.3337 10.6675C29.3466 10.5746 29.3466 10.4804 29.3337 10.3875V10.2808C29.3107 10.2064 29.2794 10.1348 29.2403 10.0675C29.223 10.0291 29.2006 9.9932 29.1737 9.96082L29.0403 9.78749L28.9337 9.70749L28.7737 9.58749L16.7737 2.92082C16.571 2.8038 16.341 2.74219 16.107 2.74219C15.8729 2.74219 15.643 2.8038 15.4403 2.92082L3.44033 9.58749L3.32033 9.68082L3.17366 9.78749C3.13492 9.83108 3.10341 9.8806 3.08033 9.93415C3.03767 9.97242 3.00162 10.0175 2.97366 10.0675C2.93904 10.126 2.91215 10.1887 2.89366 10.2542C2.8862 10.2983 2.8862 10.3434 2.89366 10.3875C2.80199 10.4665 2.72522 10.5614 2.66699 10.6675V21.3342C2.66872 21.5717 2.73391 21.8046 2.85581 22.0085C2.97771 22.2124 3.15189 22.3801 3.36033 22.4942L15.3603 29.1608C15.4154 29.193 15.4735 29.2197 15.5337 29.2408H15.667C15.886 29.294 16.1146 29.294 16.3337 29.2408H16.467L16.6537 29.1608L28.6537 22.4942C28.8596 22.3784 29.0311 22.21 29.1506 22.0061C29.2701 21.8023 29.3333 21.5704 29.3337 21.3342V10.6675ZM16.0003 15.8275L6.74699 10.6675L10.427 8.64082L19.5337 13.8408L16.0003 15.8275ZM16.0003 5.53415L25.2537 10.6675L22.267 12.3342L13.1603 7.12082L16.0003 5.53415ZM5.33366 12.9342L14.667 18.1608V25.7342L5.33366 20.5475V12.9342ZM17.3337 25.7342V18.1608L21.3337 15.9208V20.0008L24.0003 18.6675V14.4275L26.667 12.9475V20.5475L17.3337 25.7342Z" fill="#15AFB9"/>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/copy.svg

@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Basic icons ">
+<path id="Vector" fill-rule="evenodd" clip-rule="evenodd" d="M5.58807 0.815002C5.68169 0.719502 5.8098 0.666016 5.94284 0.666016H9.07181C10.4318 0.666016 11.5356 1.78552 11.5356 3.16602C12.8956 3.16602 13.9993 4.28552 13.9993 5.66602V12.166C13.9993 13.5465 12.8956 14.666 11.5356 14.666H7.59355C6.23355 14.666 5.12978 13.5465 5.12978 12.166C3.76978 12.166 2.66602 11.0465 2.66602 9.66602V4.02951C2.66602 3.89801 2.71531 3.77203 2.80893 3.67853L5.58807 0.815002ZM10.5501 3.16602V9.66602C10.5501 10.4945 9.88978 11.166 9.07181 11.166H5.12978C4.31181 11.166 3.65152 10.4945 3.65152 9.66602V5.16602H6.60804C6.87906 5.16602 7.1008 4.94202 7.1008 4.66602V1.66602H9.07181C9.88978 1.66602 10.5501 2.33752 10.5501 3.16602ZM6.11529 1.69901V4.16602H3.72052L6.11529 1.69901ZM7.59355 13.666C6.77558 13.666 6.11529 12.9945 6.11529 12.166H9.07181C10.4318 12.166 11.5356 11.0465 11.5356 9.66602V4.16602C12.3536 4.16602 13.0138 4.83752 13.0138 5.66602V12.166C13.0138 12.9945 12.3536 13.666 11.5356 13.666H7.59355Z" fill="#70808F"/>
+</g>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/disactive.svg

@@ -0,0 +1,4 @@
+<svg width="28" height="27" viewBox="0 0 28 27" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.595352" y="0.313965" width="26.663" height="26.663" rx="13.3315" fill="#C5CCD3"/>
+<path d="M9.48299 14.5331L12.1493 17.1994L18.3707 10.978" stroke="white" strokeWidth="2.22192" strokeLinecap="round" strokeLinejoin="round"/>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/discount-icon.svg

@@ -0,0 +1,3 @@
+<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 1L7.545 4.13L11 4.635L8.5 7.07L9.09 10.51L6 8.885L2.91 10.51L3.5 7.07L1 4.635L4.455 4.13L6 1Z" stroke="white" strokeLinecap="round" strokeLinejoin="round"/>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/drop_blue.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="shevron down">
+<path id="Vector" d="M6.12612 9L12.0836 15L18.041 9" stroke="#1890FF" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
+</g>
+</svg>

package/dist/components/ConstructorComponents/Tariff/img/stars_glass.svg

@@ -0,0 +1,31 @@
+<svg width="57" height="52" viewBox="0 0 57 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M31.2654 24.9457C31.0644 25.3462 31.0804 25.8174 31.3069 26.2053L34.5246 31.5345C34.7969 31.9864 34.7703 32.5501 34.457 32.977C34.1561 33.4115 33.6233 33.6386 33.0884 33.5643L26.7651 32.7576C26.5445 32.7276 26.3201 32.7488 26.108 32.817L25.7829 32.9315C25.6763 32.9875 25.579 33.0612 25.4983 33.15L21.1988 37.7136C20.9841 37.9337 20.7037 38.0837 20.3951 38.1412C19.6359 38.2615 18.9155 37.7745 18.7717 37.0436L17.6881 30.9625C17.6019 30.5213 17.2995 30.1483 16.8773 29.9621L11.015 27.4298C10.5246 27.2177 10.2062 26.7519 10.1982 26.2332C10.1858 25.7174 10.4697 25.2378 10.9367 24.9878L16.5837 22.0513C17.0202 21.8463 17.3179 21.4393 17.3731 20.9732L18.0371 14.8413C18.0558 14.7034 18.0959 14.5684 18.159 14.4437L18.2363 14.3245C18.27 14.2443 18.316 14.1716 18.3726 14.1057L18.4859 14.0132L18.6592 13.8602L19.1643 13.6823C19.6324 13.5686 20.1279 13.6896 20.4823 14.0061L25.0989 18.2514C25.4338 18.563 25.9062 18.6948 26.3609 18.6068L32.6384 17.3424C33.1685 17.2344 33.7164 17.4223 34.058 17.8274C34.3905 18.237 34.4473 18.795 34.2042 19.2603L31.2654 24.9457Z" fill="url(#paint0_linear_6366_9145)"/>
+<g opacity="0.5" filter="url(#filter0_f_6366_9145)">
+<path d="M25.7355 21.8613C22.99 21.8613 20.7617 24.0156 20.7617 26.6688C20.7617 29.3231 22.99 31.4763 25.7355 31.4763C28.486 31.4763 30.7093 29.3231 30.7093 26.6688C30.7093 24.0156 28.486 21.8613 25.7355 21.8613Z" fill="#1818FF"/>
+</g>
+<g filter="url(#filter1_b_6366_9145)">
+<path d="M45.9063 24.0493C45.3997 24.3319 45.0691 24.8383 45.0212 25.402L44.475 33.2209C44.4282 33.8834 43.9846 34.4577 43.3405 34.6908C42.7038 34.9402 41.9763 34.812 41.4687 34.3655L35.4159 29.162C35.2061 28.9786 34.9545 28.8464 34.6813 28.7719L34.2551 28.6684C34.1017 28.6538 33.9452 28.6642 33.7949 28.7021L25.9103 30.5382C25.5224 30.6218 25.1169 30.5863 24.7502 30.4342C23.8634 30.0378 23.465 29.0295 23.8527 28.1621L27.1968 21.0228C27.4315 20.4996 27.3886 19.8993 27.082 19.4127L22.786 12.7127C22.4268 12.1519 22.4356 11.4429 22.8095 10.8921C23.1768 10.3413 23.8289 10.0326 24.5041 10.0916L32.6056 10.894C33.2155 10.9791 33.8286 10.7563 34.2303 10.3044L39.4491 4.31533C39.5704 4.18318 39.7121 4.06892 39.8703 3.98128L40.0396 3.90925C40.134 3.84815 40.236 3.80341 40.3441 3.77313L40.5314 3.75396L40.8264 3.71248L41.4885 3.8733C42.0645 4.07621 42.4962 4.54469 42.6355 5.12155L44.3589 12.7644C44.4813 13.3226 44.8807 13.7865 45.4236 14.0072L52.9552 17.0017C53.5921 17.2534 54.0295 17.8283 54.09 18.4895C54.1376 19.1491 53.786 19.7748 53.1874 20.0965L45.9063 24.0493Z" fill="#1890FF" fill-opacity="0.4"/>
+<path d="M44.9757 33.2487L44.9757 33.2483L45.5216 25.4335C45.5561 25.0408 45.7865 24.6851 46.1451 24.484C46.1459 24.4835 46.1467 24.4831 46.1475 24.4827L53.4215 20.5338C53.4219 20.5335 53.4223 20.5333 53.4228 20.5331C54.1933 20.1184 54.6526 19.3068 54.5907 18.4469L54.5907 18.4469L54.5899 18.4374C54.5119 17.5863 53.951 16.8567 53.147 16.5388C53.1469 16.5387 53.1467 16.5387 53.1466 16.5386L45.6195 13.5459C45.6189 13.5457 45.6183 13.5455 45.6178 13.5452C45.2206 13.3831 44.9359 13.0464 44.8494 12.6519L44.8487 12.6491L43.1253 5.00624L43.1254 5.00623L43.1236 4.999C42.944 4.2553 42.3904 3.66011 41.6624 3.40363C41.6466 3.39809 41.6306 3.39333 41.6143 3.38938L40.9522 3.22857C40.8905 3.21357 40.8262 3.21043 40.7629 3.21933L40.4774 3.25947L40.2996 3.27767C40.2708 3.28062 40.2422 3.28604 40.2143 3.29387C40.0748 3.33291 39.9392 3.38983 39.8107 3.46747L39.678 3.52395C39.6618 3.53086 39.6459 3.53861 39.6305 3.54715C39.4208 3.66333 39.2361 3.81296 39.0802 3.98277L39.0801 3.98265L39.0715 3.99259L33.8545 9.97955C33.569 10.2996 33.1279 10.4629 32.6824 10.4008C32.6758 10.3998 32.6691 10.399 32.6625 10.3984L24.5609 9.59596L24.5609 9.59592L24.5551 9.59541C23.7012 9.52087 22.8671 9.91048 22.3933 10.6196C21.9061 11.3388 21.8983 12.2611 22.3614 12.9841L22.3615 12.9843L26.6554 19.681C26.6557 19.6815 26.6561 19.6821 26.6564 19.6826C26.8751 20.0309 26.9038 20.4547 26.7403 20.8222L23.3981 27.9574L23.3981 27.9574L23.3944 27.9656C22.8897 29.0947 23.4149 30.3865 24.5387 30.8889L24.5386 30.889L24.5511 30.8942C25.0122 31.0854 25.5219 31.1301 26.0101 31.0249L26.0101 31.025L26.0184 31.023L33.9029 29.1869L33.903 29.187L33.9118 29.1848C33.9929 29.1643 34.0799 29.1565 34.1681 29.1617L34.5483 29.2541C34.7495 29.3099 34.9313 29.4068 35.0811 29.5378L35.0842 29.5405L41.135 34.7422C41.779 35.3072 42.7003 35.4717 43.5127 35.1562C44.3372 34.8552 44.9146 34.1132 44.9757 33.2487Z" stroke="url(#paint1_linear_6366_9145)" strokeLinecap="round" strokeLinejoin="round"/>
+</g>
+<defs>
+<filter id="filter0_f_6366_9145" x="0.761719" y="1.86133" width="49.9473" height="49.6152" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="10" result="effect1_foregroundBlur_6366_9145"/>
+</filter>
+<filter id="filter1_b_6366_9145" x="-2.48047" y="-21.2842" width="81.5781" height="81.0967" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feGaussianBlur in="BackgroundImageFix" stdDeviation="12"/>
+<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_6366_9145"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_6366_9145" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_6366_9145" x1="11.8501" y1="23.079" x2="37.3587" y2="47.8057" gradientUnits="userSpaceOnUse">
+<stop stop-color="#1890FF"/>
+<stop offset="1" stop-color="#F1FFEC"/>
+</linearGradient>
+<linearGradient id="paint1_linear_6366_9145" x1="29.674" y1="4.58146" x2="41.6291" y2="33.1872" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

package/dist/components/ConstructorComponents/Tariff/imgs/bx-bar-chart-square.svg

@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4 6.66667V25.3333C4 26.804 5.196 28 6.66667 28H25.3333C26.804 28 28 26.804 28 25.3333V6.66667C28 5.196 26.804 4 25.3333 4H6.66667C5.196 4 4 5.196 4 6.66667ZM25.3347 25.3333H6.66667V6.66667H25.3333L25.3347 25.3333Z" fill="#005BFF"/>
+<path d="M14.6663 9.33203H17.333V22.6654H14.6663V9.33203ZM19.9997 13.332H22.6663V22.6654H19.9997V13.332ZM9.33301 15.9987H11.9997V22.6654H9.33301V15.9987Z" fill="#005BFF"/>
+</svg>

package/dist/components/ConstructorComponents/Tariff/imgs/bx-book-open.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="bx-book-open.svg">
+<path id="Vector" d="M28.0003 4H18.667C17.6798 4.00334 16.7291 4.37409 16.0003 5.04C15.2715 4.37409 14.3209 4.00334 13.3337 4H4.00033C3.6467 4 3.30756 4.14048 3.05752 4.39052C2.80747 4.64057 2.66699 4.97971 2.66699 5.33333V25.3333C2.66699 25.687 2.80747 26.0261 3.05752 26.2761C3.30756 26.5262 3.6467 26.6667 4.00033 26.6667H11.6777C12.379 26.6667 13.067 26.952 13.563 27.448L15.0577 28.9427C15.0697 28.9547 15.0857 28.9587 15.0977 28.9707C15.2123 29.076 15.3403 29.1693 15.4897 29.232H15.4923C15.8176 29.3667 16.183 29.3667 16.5083 29.232H16.511C16.6603 29.1693 16.7883 29.076 16.903 28.9707C16.915 28.9587 16.931 28.9547 16.943 28.9427L18.4377 27.448C18.9389 26.9497 19.6162 26.669 20.323 26.6667H28.0003C28.3539 26.6667 28.6931 26.5262 28.9431 26.2761C29.1932 26.0261 29.3337 25.687 29.3337 25.3333V5.33333C29.3337 4.97971 29.1932 4.64057 28.9431 4.39052C28.6931 4.14048 28.3539 4 28.0003 4ZM11.6777 24H5.33366V6.66667H13.3337C14.0697 6.66667 14.667 7.26533 14.667 8V24.9187C13.7836 24.323 12.7431 24.0032 11.6777 24ZM26.667 24H20.323C19.2577 24 18.211 24.328 17.3337 24.9187V8C17.3337 7.26533 17.931 6.66667 18.667 6.66667H26.667V24Z" fill="#ED522F"/>
+</g>
+</svg>

package/dist/components/ConstructorComponents/Tariff/imgs/bx-calendar-week.svg

@@ -0,0 +1,6 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="icons / bx-calendar-week.svg">
+<path id="Vector" d="M25.3333 5.33464H21.3333V2.66797H18.6667V5.33464H13.3333V2.66797H10.6667V5.33464H6.66667C5.196 5.33464 4 6.53064 4 8.0013V26.668C4 28.1386 5.196 29.3346 6.66667 29.3346H25.3333C26.804 29.3346 28 28.1386 28 26.668V8.0013C28 6.53064 26.804 5.33464 25.3333 5.33464ZM6.66667 26.668V9.33464H25.3333V8.0013L25.336 26.668H6.66667Z" fill="#F05454"/>
+<path id="Vector_2" d="M9.33301 13.3333V16H22.6663V12H9.33301V13.3333Z" fill="#F05454"/>
+</g>
+</svg>

package/dist/components/ConstructorComponents/Tariff/imgs/bx-cart-alt.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M28.0003 5.33487H2.66699V8.00154H5.73366L10.107 20.0015C10.3821 20.7796 10.8911 21.4535 11.5642 21.931C12.2374 22.4084 13.0417 22.6659 13.867 22.6682H25.3337V20.0015H13.867C13.593 20.0014 13.3256 19.9169 13.1014 19.7594C12.8771 19.602 12.7068 19.3792 12.6137 19.1215L12.0003 17.3349H24.3737C24.9524 17.334 25.5151 17.145 25.9769 16.7962C26.4387 16.4475 26.7745 15.9579 26.9337 15.4015L29.3337 7.0282C29.3879 6.85312 29.4054 6.66873 29.3851 6.48657C29.3649 6.30441 29.3073 6.12838 29.2159 5.96947C29.1246 5.81057 29.0015 5.6722 28.8543 5.56301C28.707 5.45383 28.5389 5.37616 28.3603 5.33487C28.2411 5.31546 28.1195 5.31546 28.0003 5.33487ZM24.3337 14.6682H11.0003L8.57366 8.00154H26.227L24.3337 14.6682Z" fill="#35BA80"/>
+<path d="M14 28C15.1046 28 16 27.1046 16 26C16 24.8954 15.1046 24 14 24C12.8954 24 12 24.8954 12 26C12 27.1046 12.8954 28 14 28Z" fill="#35BA80"/>
+<path d="M22 28C23.1046 28 24 27.1046 24 26C24 24.8954 23.1046 24 22 24C20.8954 24 20 24.8954 20 26C20 27.1046 20.8954 28 22 28Z" fill="#35BA80"/>
+</svg>

package/dist/components/ConstructorComponents/Tariff/imgs/bx-chart.svg

@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.66667 28H25.3333C26.804 28 28 26.804 28 25.3333V6.66667C28 5.196 26.804 4 25.3333 4H6.66667C5.196 4 4 5.196 4 6.66667V25.3333C4 26.804 5.196 28 6.66667 28ZM6.66667 6.66667H25.3333L25.3347 25.3333H6.66667V6.66667Z" fill="#009ADC"/>
+<path d="M18.071 15.5423L12.7376 12.8757L9.47363 19.4023L11.8603 20.5943L13.9296 16.4543L19.263 19.121L22.527 12.5943L20.1403 11.4023L18.071 15.5423Z" fill="#009ADC"/>
+</svg>

package/dist/components/ConstructorComponents/Tariff/imgs/bx-chat.svg

@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.6665 24V29.0213L8.6865 27.8093L15.0358 24H21.3332C22.8038 24 23.9998 22.804 23.9998 21.3333V10.6667C23.9998 9.196 22.8038 8 21.3332 8H5.33317C3.8625 8 2.6665 9.196 2.6665 10.6667V21.3333C2.6665 22.804 3.8625 24 5.33317 24H6.6665ZM5.33317 10.6667H21.3332V21.3333H14.2972L9.33317 24.312V21.3333H5.33317V10.6667Z" fill="#AAB905"/>
+<path d="M26.6667 2.66797H10.6667C9.196 2.66797 8 3.86397 8 5.33464H24C25.4707 5.33464 26.6667 6.53064 26.6667 8.0013V18.668C28.1373 18.668 29.3333 17.472 29.3333 16.0013V5.33464C29.3333 3.86397 28.1373 2.66797 26.6667 2.66797Z" fill="#AAB905"/>
+</svg>

package/dist/components/ConstructorComponents/Tariff/imgs/bx-detail.svg

@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M26.667 4H5.33366C3.86299 4 2.66699 5.196 2.66699 6.66667V25.3333C2.66699 26.804 3.86299 28 5.33366 28H26.667C28.1377 28 29.3337 26.804 29.3337 25.3333V6.66667C29.3337 5.196 28.1377 4 26.667 4ZM5.33366 25.3333V6.66667H26.667L26.6697 25.3333H5.33366Z" fill="#AC2ADA"/>
+<path d="M8 9.33203H24V11.9987H8V9.33203ZM8 14.6654H24V17.332H8V14.6654ZM8 19.9987H16V22.6654H8V19.9987Z" fill="#AC2ADA"/>
+</svg>