@scbt-ecom/ui 0.16.3 → 0.17.0

package/dist/widgets.js

@@ -0,0 +1,828 @@
+import { j as t, B as j, H as u, c as b, R as k, b as M, P as B, I as a, C as y, S as F, a as W, L as P, d as v } from "./CustomLink-DmCJLTWC.js";
+import { c as o } from "./cn-DIfn7EPB.js";
+import { s as T } from "./scrollToElement-B-reg4jF.js";
+import { u as g } from "./useDevice-L83kSsN7.js";
+import * as R from "react";
+const V = b(
+  "flex flex-col justify-between overflow-hidden rounded-md bg-color-blue-grey-100 py-6 desktop:flex-row desktop:px-0 desktop:py-0",
+  {
+    variants: {
+      intent: {
+        twoCards: "",
+        threeCards: "desktop:first:col-span-full",
+        fourCards: "desktop:first:col-span-2 desktop:last:col-span-2"
+      }
+    }
+  }
+), D = ({
+  description: n,
+  title: e,
+  img: x,
+  mobileImg: d,
+  classes: r,
+  withButton: i,
+  buttonText: p,
+  intent: f,
+  cardColor: h
+}) => {
+  const { isDesktop: l } = g(), m = /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsx(
+    j,
+    {
+      intent: "primary",
+      className: o("desktop:w-[200px]", r == null ? void 0 : r.button),
+      onClick: () => T("personal_form"),
+      size: "lg",
+      children: p
+    }
+  ) });
+  return /* @__PURE__ */ t.jsxs(
+    "li",
+    {
+      className: o(V({ intent: f }), { "pb-0": d }, { "pb-12": !d }, h, r == null ? void 0 : r.item),
+      children: [
+        /* @__PURE__ */ t.jsxs("div", { className: o("flex flex-col items-start justify-between px-4 desktop:px-8 desktop:py-8", r == null ? void 0 : r.itemWrapper), children: [
+          /* @__PURE__ */ t.jsxs("div", { className: o("flex flex-col gap-4", r == null ? void 0 : r.itemTextContainer), children: [
+            /* @__PURE__ */ t.jsx(u, { as: "h4", className: o("desktop:desk-title-bold-s", r == null ? void 0 : r.headingBenefitItem), children: e }),
+            /* @__PURE__ */ t.jsx("p", { className: o("mob-body-regular-l text-icon-blue-grey-800 desktop:desk-body-regular-l", r == null ? void 0 : r.itemDescription), children: n })
+          ] }),
+          i && l && m
+        ] }),
+        (d || l) && x && /* @__PURE__ */ t.jsx("div", { className: o("flex w-full justify-end", r == null ? void 0 : r.imgWrapper), children: /* @__PURE__ */ t.jsx("img", { className: o("h-[246px] object-cover", r == null ? void 0 : r.img), src: x, alt: e }) })
+      ]
+    },
+    x
+  );
+}, O = b("grid gap-4", {
+  variants: {
+    intent: {
+      twoCards: "grid-cols-1 mobile:grid-rows-[repeat(2,400px)] desktop:grid-cols-2",
+      threeCards: "grid-cols-1 desktop:grid-cols-2",
+      fourCards: "grid-cols-1 mobile:grid-rows-[400px,1fr,1fr,400px] desktop:grid-cols-3"
+    }
+  }
+}), ht = ({ heading: n, cards: e, classes: x, intent: d }) => /* @__PURE__ */ t.jsx("section", { className: o("pb-20", x == null ? void 0 : x.section), children: /* @__PURE__ */ t.jsxs(k, { children: [
+  /* @__PURE__ */ t.jsx(u, { className: "mb-8", as: "h2", children: n }),
+  /* @__PURE__ */ t.jsx("ul", { className: o(O({ intent: d }), x == null ? void 0 : x.grid), children: e == null ? void 0 : e.map((r) => /* @__PURE__ */ t.jsx(D, { intent: d, classes: x, ...r }, r.img)) })
+] }) }), A = (n) => {
+  switch (n.variant) {
+    case "withButton":
+      return /* @__PURE__ */ t.jsx(j, { intent: "secondary", size: "sm", ...n.buttonProps, children: "Оформить заявку" });
+    case "withPhone":
+      const { phone: e, phoneText: x } = n;
+      return /* @__PURE__ */ t.jsx(B, { phone: e, text: x, ...n.phoneProps });
+    default:
+      return null;
+  }
+}, lt = (n) => {
+  const { logoPath: e = "/", logoType: x = "main", classes: d } = n;
+  return /* @__PURE__ */ t.jsx("header", { className: o("flex h-[72px] items-center justify-center bg-color-white", d == null ? void 0 : d.header), children: /* @__PURE__ */ t.jsx(k, { className: o(d == null ? void 0 : d.container), children: /* @__PURE__ */ t.jsxs("div", { className: o("flex items-center justify-between gap-5", d == null ? void 0 : d.wrapper), children: [
+    /* @__PURE__ */ t.jsx(
+      "a",
+      {
+        href: e,
+        "aria-label": "logo",
+        target: "_blank",
+        rel: "noreferrer",
+        className: o(
+          "flex items-center justify-center [&_svg]:w-[132px] desktop:[&_svg]:h-[32px] desktop:[&_svg]:w-[192px]",
+          d == null ? void 0 : d.logo
+        ),
+        children: M[x]
+      }
+    ),
+    A(n)
+  ] }) }) });
+}, z = ({ buttonsConfig: n, classes: e, className: x }) => {
+  var r;
+  const d = (n == null ? void 0 : n.secondary) && n.secondary.children;
+  return /* @__PURE__ */ t.jsxs(
+    "div",
+    {
+      "data-id": "banner-buttons-group",
+      className: o(
+        "grid-buttons-apply absolute bottom-6 left-1/2 flex w-full -translate-x-1/2 flex-col justify-self-center px-4 desktop:static desktop:left-auto desktop:max-w-full desktop:translate-x-0 desktop:flex-row desktop:justify-normal desktop:px-0",
+        { "flex items-center gap-4": d },
+        e == null ? void 0 : e.group,
+        x
+      ),
+      children: [
+        /* @__PURE__ */ t.jsx(j, { intent: "primary", ...n.primary, isFull: !0, className: o("desktop:max-w-[216px]", e == null ? void 0 : e.primary), children: n.primary.children }),
+        d && /* @__PURE__ */ t.jsx(
+          j,
+          {
+            intent: "secondary",
+            ...n == null ? void 0 : n.secondary,
+            isFull: !0,
+            className: o("desktop:max-w-[216px]", e == null ? void 0 : e.secondary),
+            children: (r = n == null ? void 0 : n.secondary) == null ? void 0 : r.children
+          }
+        )
+      ]
+    }
+  );
+}, U = ({
+  headTitle: n,
+  subtitle: e,
+  buttonsConfig: x,
+  advantagesList: d,
+  classes: r,
+  img: i,
+  imgSets: p
+}) => {
+  const { isDesktop: f, isMobile: h } = g(), l = /* @__PURE__ */ t.jsx(
+    "div",
+    {
+      "data-id": "banner-advantages",
+      className: o(
+        "flex items-center justify-center pt-4 desktop:absolute desktop:bottom-[-50px] desktop:right-1/2 desktop:translate-x-1/2 desktop:pt-0",
+        r == null ? void 0 : r.advantageContainer
+      ),
+      children: d && (d == null ? void 0 : d.length) > 0 && /* @__PURE__ */ t.jsx(E, { classes: r, advantagesList: d })
+    }
+  );
+  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    /* @__PURE__ */ t.jsxs("section", { "data-id": "banner-section", className: o("relative h-[552px] desktop:h-[456px]", r == null ? void 0 : r.section), children: [
+      /* @__PURE__ */ t.jsx(
+        "div",
+        {
+          "data-id": "banner-img-wrapper",
+          className: "absolute bottom-0 left-0 right-0 top-0 z-[-1] mx-auto h-full max-w-[1920px] desktop:h-[456px]",
+          children: /* @__PURE__ */ t.jsxs("picture", { children: [
+            /* @__PURE__ */ t.jsx("source", { media: "(min-width: 1128px)", srcSet: p == null ? void 0 : p.large }),
+            /* @__PURE__ */ t.jsx("source", { media: "(max-width: 1127px)", srcSet: p == null ? void 0 : p.mob }),
+            /* @__PURE__ */ t.jsx(
+              "img",
+              {
+                "data-id": "banner-image",
+                src: i,
+                alt: "Картинка баннера",
+                className: o("h-full w-full object-cover object-center", r == null ? void 0 : r.image)
+              }
+            )
+          ] })
+        }
+      ),
+      /* @__PURE__ */ t.jsxs(k, { "data-id": "banner-container", className: o("h-full", r == null ? void 0 : r.container), children: [
+        /* @__PURE__ */ t.jsx("div", { "data-id": "banner", className: o("flex h-full", r == null ? void 0 : r.wrapper), children: /* @__PURE__ */ t.jsxs(
+          "div",
+          {
+            "data-id": "banner-text-block",
+            className: o("flex w-[328px] flex-col gap-10 pt-6 desktop:w-full desktop:pt-20", r == null ? void 0 : r.textBlock),
+            children: [
+              /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col gap-4", children: [
+                /* @__PURE__ */ t.jsx(u, { "data-id": "banner-title", as: "h1", className: o("text-color-white", r == null ? void 0 : r.title), children: n }),
+                /* @__PURE__ */ t.jsx("p", { "data-id": "banner-subtitle", className: o("desk-body-regular-l text-color-white", r == null ? void 0 : r.subtitle), children: e })
+              ] }),
+              /* @__PURE__ */ t.jsx(
+                z,
+                {
+                  className: "self-end desktop:self-center",
+                  "data-id": "banner-buttons-group",
+                  buttonsConfig: x,
+                  classes: r
+                }
+              )
+            ]
+          }
+        ) }),
+        f && l
+      ] })
+    ] }),
+    h && l
+  ] });
+}, c = ({
+  headTitle: n,
+  subtitle: e,
+  buttonsConfig: x,
+  advantagesList: d,
+  classes: r,
+  img: i,
+  imgSets: p
+}) => {
+  const { isDesktop: f, isMobile: h } = g(), l = /* @__PURE__ */ t.jsx(
+    "div",
+    {
+      "data-id": "banner-advantages",
+      className: o(
+        "flex items-center justify-center rounded-md bg-color-blue-grey-100 p-4 pb-8 desktop:absolute desktop:bottom-[-50px] desktop:right-1/2 desktop:translate-x-1/2 desktop:p-0",
+        r == null ? void 0 : r.advantageContainer
+      ),
+      children: d && (d == null ? void 0 : d.length) > 0 && /* @__PURE__ */ t.jsx(E, { classes: r, advantagesList: d })
+    }
+  );
+  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    /* @__PURE__ */ t.jsx("section", { "data-id": "banner-section", className: o("bg-banner-skyblue-300 desktop:h-[456px]", r == null ? void 0 : r.section), children: /* @__PURE__ */ t.jsxs(k, { "data-id": "banner-container", className: o("relative", r == null ? void 0 : r.container), children: [
+      /* @__PURE__ */ t.jsxs("div", { "data-id": "banner", className: o("flex flex-col desktop:flex-row desktop:justify-between", r == null ? void 0 : r.wrapper), children: [
+        /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col desktop:gap-10 desktop:pt-20", children: [
+          /* @__PURE__ */ t.jsxs("div", { "data-id": "banner-text-block", className: o("flex flex-col gap-4 pt-6 desktop:pt-0", r == null ? void 0 : r.textBlock), children: [
+            /* @__PURE__ */ t.jsx(u, { "data-id": "banner-title", as: "h1", className: o("text-color-dark", r == null ? void 0 : r.title), children: n }),
+            /* @__PURE__ */ t.jsx("p", { "data-id": "banner-subtitle", className: o("desk-body-regular-l text-color-dark", r == null ? void 0 : r.subtitle), children: e })
+          ] }),
+          /* @__PURE__ */ t.jsx(z, { buttonsConfig: x, classes: r })
+        ] }),
+        /* @__PURE__ */ t.jsx(
+          "div",
+          {
+            "data-id": "banner-image-wrapper",
+            className: o("flex h-[356px] justify-center desktop:h-[456px] desktop:w-[550px]", r == null ? void 0 : r.imageContainer),
+            children: /* @__PURE__ */ t.jsxs("picture", { children: [
+              /* @__PURE__ */ t.jsx("source", { media: "(min-width: 1128px)", srcSet: p == null ? void 0 : p.large }),
+              /* @__PURE__ */ t.jsx("source", { media: "(max-width: 1127px)", srcSet: p == null ? void 0 : p.mob }),
+              /* @__PURE__ */ t.jsx(
+                "img",
+                {
+                  "data-id": "banner-image",
+                  src: i,
+                  alt: "Картинка баннера",
+                  className: o("h-full object-cover", r == null ? void 0 : r.image)
+                }
+              )
+            ] })
+          }
+        )
+      ] }),
+      f && l
+    ] }) }),
+    h && l
+  ] });
+}, at = ({ bannerVariant: n, ...e }) => {
+  switch (n) {
+    case "separateImg":
+      return /* @__PURE__ */ t.jsx(c, { ...e });
+    case "fullImg":
+      return /* @__PURE__ */ t.jsx(U, { ...e });
+    default:
+      return /* @__PURE__ */ t.jsx(c, { ...e });
+  }
+}, E = ({ advantagesList: n, classes: e }) => /* @__PURE__ */ t.jsx(
+  "div",
+  {
+    className: o(
+      "flex w-full max-w-[636px] flex-col gap-8 rounded-md bg-color-white p-6 shadow-sm desktop:w-full desktop:max-w-full desktop:flex-row desktop:items-start desktop:gap-0 desktop:p-0 desktop:py-6",
+      e == null ? void 0 : e.advantageWrapper
+    ),
+    children: n == null ? void 0 : n.map(({ title: x, description: d }) => /* @__PURE__ */ t.jsxs(
+      "div",
+      {
+        className: o(
+          'after:content-[" "] relative flex h-full w-full flex-col gap-1 after:absolute after:-bottom-4 after:left-1/2 after:h-[1px] after:w-full after:-translate-x-1/2 after:bg-color-blue-grey-300 last:after:hidden desktop:w-[285px] desktop:px-8 desktop:after:bottom-auto desktop:after:left-auto desktop:after:right-0 desktop:after:top-1/2 desktop:after:h-10 desktop:after:w-[1px] desktop:after:-translate-y-1/2 desktop:after:translate-x-0',
+          e == null ? void 0 : e.advantageItem
+        ),
+        children: [
+          /* @__PURE__ */ t.jsx(u, { as: "h4", className: o("text-color-dark", e == null ? void 0 : e.advantageTitle), children: x }),
+          /* @__PURE__ */ t.jsx("p", { className: o("desk-body-regular-l text-color-secondary", e == null ? void 0 : e.advantageDescription), children: d })
+        ]
+      },
+      x
+    ))
+  }
+), G = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+  "© 2004-2024, ПАО «Совкомбанк». Все права защищены. ",
+  /* @__PURE__ */ t.jsx("br", { className: "mobile:hidden" }),
+  " Генеральная лицензия Банка России №963 от 5 декабря 2014 г."
+] }), Z = [
+  { phone: "8 800 100-00-06", text: "Звонок по России (бесплатно)" },
+  { phone: "+7 (495) 988 00 00", text: "Для звонков из-за рубежа (платно)" }
+], S = [
+  { iconName: "social/vk", href: "https://vk.com/sovcombank" },
+  { iconName: "social/telegram", href: "https://t.me/sovcombankofficial" },
+  { iconName: "social/classmates", href: "https://ok.ru/paosovcombank" }
+], $ = [
+  {
+    groupLabel: "Совкомбанк",
+    links: [
+      { text: "О банке", href: "/" },
+      { text: "Реквизиты и лицензии", href: "/" },
+      { text: "Пресс-центр", href: "/" },
+      { text: "Удостоверяющий центр ПАО «Совкомбанк»", href: "/" },
+      { text: "Работа у нас", href: "/" },
+      { text: "Контакты", href: "/" },
+      { text: "Раскрытие информации", href: "/" },
+      { text: "Страница раскрытия информации в Интерфакс", href: "/" },
+      { text: "Реализация залогового имущества", href: "/" },
+      { text: "Клиентам и партнерам", href: "/" },
+      { text: "Биометрия", href: "/" },
+      { text: "Стандарты безопасности", href: "/" },
+      { text: "Информация о процентных ставках по договорам банковского вклада с физическими лицами", href: "/" },
+      { text: "ООО «Совком Финанс»", href: "/" },
+      { text: "Безопасность", href: "/" }
+    ]
+  },
+  {
+    groupLabel: "Сервисы",
+    links: [
+      { text: "Подарочная карта «Халва»", href: "/" },
+      { text: "Страховые продукты", href: "/" },
+      { text: "МультиЮрист", href: "/" },
+      { text: "Единая социальная карта «Уралочка»", href: "/" },
+      { text: "Единая Карта Жителя Мурманской области", href: "/" },
+      { text: "Безопасные расчёты", href: "/" },
+      { text: "Улучшение кредитной истории", href: "/" },
+      { text: "Дистанционные сервисы Совкомбанка", href: "/" },
+      { text: "Программы реструктуризации долга", href: "/" }
+    ]
+  },
+  {
+    groupLabel: "Услуги банка",
+    links: [
+      { text: "Карты", href: "/" },
+      { text: "Кредиты", href: "/" },
+      { text: "Кредиты наличными", href: "/" },
+      { text: "Ипотека", href: "/" },
+      { text: "Автокредиты", href: "/" },
+      { text: "Кредитный калькулятор", href: "/" },
+      { text: "Вклады", href: "/" },
+      { text: "Инвестиции", href: "/" },
+      { text: "Платежи", href: "/" },
+      { text: "Сервисы", href: "/" },
+      { text: "Малому бизнесу и ИП", href: "/" },
+      { text: "Корпоративным клиентам", href: "/" },
+      { text: "CIB", href: "/" },
+      { text: "Драгоценные металлы в слитках", href: "/" },
+      { text: "Счета в драгоценных металлах", href: "/" }
+    ]
+  },
+  {
+    groupLabel: "Клиентам других банков",
+    links: [
+      { text: "Держателям карт рассрочки Банка Хоум Кредит", href: "/" },
+      { text: "ПАО КБ «Восточный»", href: "/" },
+      { text: "Держателям карт «Совесть»", href: "/" },
+      { text: "АО «Нордеа Банк»", href: "/" },
+      { text: "ЗАО «ДжиИ Мани банк»", href: "/" },
+      { text: "АО «Меткомбанк»", href: "/" },
+      { text: "АКБ «РосЕвроБанк» (АО)", href: "/" },
+      { text: "ПАО «Татфондбанк»", href: "/" },
+      { text: "АО АКБ «Экспресс-Волга»", href: "/" },
+      { text: "АО «ВКАБАНК»", href: "/" },
+      { text: "ООО «ОНЕЙ БАНК»", href: "/" },
+      { text: "АО «Евразийский»", href: "/" },
+      { text: "АО «НФК»", href: "/" },
+      { text: "ООО «РТС-Капитал»", href: "/" },
+      { text: "ООО «ИК Септем Капитал»", href: "/" },
+      { text: "Помощь", href: "/" },
+      { text: "Офисы и банкоматы", href: "/" }
+    ]
+  }
+], q = ({ socialsLinks: n, classes: e }) => /* @__PURE__ */ t.jsx("div", { className: o("mt-4 flex items-center gap-2 desktop:mt-6", e == null ? void 0 : e.socialRoot), children: n == null ? void 0 : n.map(({ iconName: x, href: d }) => /* @__PURE__ */ t.jsx(
+  "a",
+  {
+    className: o("flex size-8 items-center justify-center rounded-full bg-[#52576a] p-2", e == null ? void 0 : e.socialLink),
+    href: d,
+    "aria-label": x.replace("social/", ""),
+    children: /* @__PURE__ */ t.jsx(a, { name: x, className: o("h-full w-full text-icon-white", e == null ? void 0 : e.socialIcon) })
+  },
+  d
+)) }), J = ({ phones: n, classes: e }) => /* @__PURE__ */ t.jsx("div", { className: o("flex flex-col gap-4 desktop:items-end", e == null ? void 0 : e.phonesRoot), children: n == null ? void 0 : n.map(({ phone: x, text: d }) => /* @__PURE__ */ t.jsx(
+  B,
+  {
+    phone: x,
+    text: d,
+    classes: {
+      wrapper: o(e == null ? void 0 : e.phoneWrapper),
+      text: o("text-color-footer", e == null ? void 0 : e.phoneText),
+      link: o("text-color-white mobile:m-0", e == null ? void 0 : e.phoneLink)
+    }
+  },
+  x
+)) }), K = ({ navigationLinks: n, classes: e }) => /* @__PURE__ */ t.jsx(
+  "div",
+  {
+    className: o(
+      "mt-6 grid grid-cols-1 gap-6 border-b border-blue-grey-500 pb-6 desktop:my-8 desktop:grid-cols-4 desktop:gap-10 desktop:pb-8",
+      e == null ? void 0 : e.navRoot
+    ),
+    children: n == null ? void 0 : n.map(({ groupLabel: x, links: d }) => /* @__PURE__ */ t.jsxs("div", { className: o("flex flex-col gap-4", e == null ? void 0 : e.navGroup), children: [
+      /* @__PURE__ */ t.jsx("div", { className: o("desk-body-medium-l text-color-white", e == null ? void 0 : e.navLabel), children: x }),
+      /* @__PURE__ */ t.jsx("div", { className: o("flex flex-col gap-1", e == null ? void 0 : e.navLinks), children: d == null ? void 0 : d.map(({ text: r, href: i }) => /* @__PURE__ */ t.jsx(
+        y,
+        {
+          href: i,
+          "aria-label": r,
+          intent: "white",
+          classes: {
+            link: e == null ? void 0 : e.navLink,
+            icon: e == null ? void 0 : e.navLinkIcon
+          },
+          children: r
+        },
+        r
+      )) })
+    ] }, x))
+  }
+), Q = ({ text: n, classes: e, withSiteMap: x }) => /* @__PURE__ */ t.jsx("div", { className: o("desk-body-regular-m text-color-footer", { "mt-6 desktop:mt-8": !x }, e == null ? void 0 : e.copyRight), children: n }), X = ({ classes: n }) => /* @__PURE__ */ t.jsx(
+  "a",
+  {
+    "aria-label": "logo",
+    href: "https://sovcombank.ru/",
+    className: o("block h-[24px] w-[132px] desktop:h-[32px] desktop:w-[194px]", n == null ? void 0 : n.footerLogo),
+    children: /* @__PURE__ */ t.jsx(a, { name: "brandLogos/logoWhite", className: o("size-full", n == null ? void 0 : n.footerLogoIcon) })
+  }
+), Y = ({ classes: n }) => /* @__PURE__ */ t.jsx(
+  y,
+  {
+    intent: "white",
+    href: "https://sovcombank.ru/site-map",
+    target: "_blank",
+    "aria-label": "site-map",
+    rel: "noreferrer",
+    classes: {
+      link: o("mobile:mt-6", n == null ? void 0 : n.siteMapLink),
+      icon: n == null ? void 0 : n.siteMapLinkIcon
+    },
+    children: "Карта сайта"
+  }
+), ut = ({
+  renderBlocks: { withSocial: n = !0, withPhones: e = !0, withNavLinks: x = !0, withCopyright: d = !0, withSiteMap: r = !0 } = {},
+  socialsLinks: i = S,
+  phones: p = Z,
+  navigationLinks: f = $,
+  ligal: h,
+  copyright: l = G,
+  classes: m
+}) => /* @__PURE__ */ t.jsx("footer", { className: o("w-full bg-color-footer py-8 desktop:py-10", m == null ? void 0 : m.root), children: /* @__PURE__ */ t.jsx(k, { className: o(m == null ? void 0 : m.footerContainer), children: /* @__PURE__ */ t.jsxs("div", { className: o("mobile:pb-[176px]", m == null ? void 0 : m.footerWrapper), children: [
+  /* @__PURE__ */ t.jsxs(
+    "div",
+    {
+      className: o(
+        "flex flex-col items-start justify-between gap-4 border-b border-solid border-blue-grey-500 pb-6 desktop:flex-row desktop:gap-6 desktop:pb-8",
+        m == null ? void 0 : m.footerHead
+      ),
+      children: [
+        /* @__PURE__ */ t.jsxs("div", { className: o(m == null ? void 0 : m.footerSocialBlock), children: [
+          /* @__PURE__ */ t.jsx(X, { classes: m }),
+          n && /* @__PURE__ */ t.jsx(q, { socialsLinks: i, classes: m })
+        ] }),
+        e && /* @__PURE__ */ t.jsx(J, { phones: p, classes: m })
+      ]
+    }
+  ),
+  x && /* @__PURE__ */ t.jsx(K, { navigationLinks: f, classes: m }),
+  h && h,
+  /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col-reverse items-start justify-between gap-4 desktop:flex-row desktop:gap-6", children: [
+    d && /* @__PURE__ */ t.jsx(Q, { text: l, classes: m, withSiteMap: r }),
+    r && /* @__PURE__ */ t.jsx(Y, { classes: m })
+  ] })
+] }) }) }), L = ({ title: n, description: e, index: x, classes: d }) => /* @__PURE__ */ t.jsxs(
+  "div",
+  {
+    className: o(
+      "flex w-[328px] max-w-[328px] flex-col gap-6 rounded-md border border-solid border-blue-grey-500 p-4 desktop:w-[348px] desktop:max-w-[348px] desktop:border-none desktop:p-0",
+      d == null ? void 0 : d.singleStep
+    ),
+    children: [
+      /* @__PURE__ */ t.jsx(
+        "div",
+        {
+          className: o(
+            "mob-headline-bold-s flex size-10 items-center justify-center rounded-sm bg-color-blue-grey-500 text-color-white desktop:desk-title-bold-l desktop:size-12",
+            d == null ? void 0 : d.numeric
+          ),
+          children: x
+        }
+      ),
+      /* @__PURE__ */ t.jsxs("div", { className: o("flex flex-col gap-4", d == null ? void 0 : d.textBlock), children: [
+        /* @__PURE__ */ t.jsx(u, { as: "h4", className: o("text-color-dark", d == null ? void 0 : d.title), children: n }),
+        /* @__PURE__ */ t.jsx("p", { className: o("desk-body-regular-l text-color-tetriary", d == null ? void 0 : d.description), children: e })
+      ] })
+    ]
+  }
+), kt = ({ heading: n, stepsList: e, classes: x }) => /* @__PURE__ */ t.jsx(F, { children: /* @__PURE__ */ t.jsx(k, { children: /* @__PURE__ */ t.jsxs("div", { className: o("flex flex-col gap-12 desktop:items-start", x == null ? void 0 : x.root), children: [
+  /* @__PURE__ */ t.jsx(u, { as: "h2", className: o("text-color-dark", x == null ? void 0 : x.headline), children: n }),
+  /* @__PURE__ */ t.jsx(
+    "div",
+    {
+      className: o(
+        "flex w-full flex-col items-start gap-6 desktop:flex-row desktop:items-center desktop:gap-12",
+        x == null ? void 0 : x.stepsWrapper
+      ),
+      children: e == null ? void 0 : e.map((d, r) => /* @__PURE__ */ t.jsx(L, { index: r + 1, ...d, classes: x }, d.title))
+    }
+  )
+] }) }) }), s = b("", {
+  variants: {
+    intent: {
+      twoItems: "mob-headline-bold-s mb-6 desktop:desk-headline-bold-m desktop:mb-12",
+      fourItems: "mob-title-bold-l desktop:desk-title-bold-l  mb-8"
+    },
+    desktopHidden: {
+      true: "desktop:hidden"
+    },
+    mobileHidden: {
+      true: "mobile:hidden"
+    }
+  },
+  defaultVariants: {
+    intent: "twoItems"
+  }
+}), tt = b("desktop:max-h-[98px]", {
+  variants: {
+    intent: {
+      twoItems: "",
+      fourItems: ""
+    },
+    withButton: {
+      true: ""
+    }
+  },
+  compoundVariants: [
+    {
+      intent: "twoItems",
+      withButton: !0,
+      class: "mb-8 desktop:flex"
+    },
+    {
+      intent: "twoItems",
+      withButton: !1,
+      class: "desktop:flex"
+    },
+    {
+      intent: "fourItems",
+      withButton: !0,
+      class: "desktop:grid grid-rows-2 mb-8 desktop:gap-x-10 desktop:gap-y-4 grid-flow-col"
+    },
+    {
+      intent: "fourItems",
+      withButton: !1,
+      class: "desktop:grid grid-rows-2 desktop:gap-x-10 desktop:gap-y-4 grid-flow-col"
+    }
+  ]
+}), et = b("border-blue-grey-500 pb-6 mobile:mb-6 mobile:border-b mobile:last:pb-0 mobile:last:mb-0", {
+  variants: {
+    intent: {
+      twoItems: 'last:border-none relative desktop:first:after:top-1/2 desktop:first:after:-translate-y-1/2 desktop:first:after:right-0 desktop:first:after:content-[""] desktop:first:after:block desktop:first:after:absolute desktop:first:after:w-[1px] desktop:first:after:h-[64px] desktop:first:after:bg-color-blue-grey-500  desktop:ml-8 desktop:pr-8 desktop:first:ml-0 desktop:last:pr-0 desktop:pb-3',
+      fourItems: " mobile:last:border-none desktop:w-[264px] desktop:odd:border-b desktop:pb-0 desktop:odd:pb-3"
+    }
+  },
+  defaultVariants: {
+    intent: "twoItems"
+  }
+}), rt = b("mobile:mx-auto mobile:mb-8, h-[172px] w-[280px] ", {
+  variants: {
+    intent: {
+      twoItems: "desktop:h-[232px] desktop:w-[500px]",
+      fourItems: " "
+    },
+    withButton: {
+      true: !0,
+      false: !1
+    }
+  },
+  defaultVariants: {
+    intent: "twoItems"
+  },
+  compoundVariants: [
+    {
+      intent: "fourItems",
+      withButton: !0,
+      class: "desktop:h-[360px] desktop:w-[500px]"
+    },
+    {
+      intent: "fourItems",
+      withButton: !1,
+      class: "desktop:h-[272px] desktop:w-[500px]"
+    }
+  ]
+}), ot = ({ data: n, intent: e }) => {
+  const { title: x, description: d, popoverText: r } = n;
+  return /* @__PURE__ */ t.jsx("li", { className: o(et({ intent: e })), children: /* @__PURE__ */ t.jsxs("div", { className: "desktop:max-w-[264px]", children: [
+    /* @__PURE__ */ t.jsxs("div", { className: o("mb-2 flex items-center gap-2"), children: [
+      /* @__PURE__ */ t.jsx("h4", { className: o("mob-title-bold-m text-color-dark"), children: x }),
+      r && /* @__PURE__ */ t.jsx(W, { triggerElement: /* @__PURE__ */ t.jsx(a, { className: o("size-5 text-icon-blue-grey-600"), name: "info/helpCircle" }), children: r })
+    ] }),
+    /* @__PURE__ */ t.jsx("p", { className: o("mob-body-regular-l text-color-secondary"), children: d })
+  ] }) });
+}, w = ({ intent: n, title: e, desktopHidden: x = !1, mobileHidden: d = !1 }) => /* @__PURE__ */ t.jsx("h2", { className: o(s({ intent: n, desktopHidden: x, mobileHidden: d })), children: e }), nt = ({ textContent: n, intent: e, withButton: x }) => /* @__PURE__ */ t.jsx("ul", { className: o(tt({ intent: e, withButton: x })), children: n == null ? void 0 : n.map((d, r) => /* @__PURE__ */ t.jsx(ot, { intent: e, data: d }, r)) }), bt = ({
+  title: n,
+  buttonConfig: e,
+  intent: x = "twoItems",
+  textContent: d,
+  imageComponent: r,
+  classes: i
+}) => {
+  const p = !!e, f = x === "fourItems", h = x === "twoItems";
+  return /* @__PURE__ */ t.jsx("section", { className: o(i == null ? void 0 : i.section), children: /* @__PURE__ */ t.jsxs(k, { className: o(i == null ? void 0 : i.mainContainer), children: [
+    h && /* @__PURE__ */ t.jsx(w, { intent: x, title: n }),
+    /* @__PURE__ */ t.jsxs(
+      "div",
+      {
+        className: o(
+          "bg-banner-skyblue-100 px-6 pb-8 pt-6 desktop:flex desktop:flex-row-reverse desktop:justify-between desktop:px-0 desktop:py-0 desktop:pl-12",
+          i == null ? void 0 : i.contentContainer
+        ),
+        children: [
+          f && /* @__PURE__ */ t.jsx(w, { intent: x, title: n, desktopHidden: !0 }),
+          /* @__PURE__ */ t.jsx("div", { className: o(rt({ intent: x, withButton: p }), i == null ? void 0 : i.imgContainer), children: r }),
+          /* @__PURE__ */ t.jsxs(
+            "div",
+            {
+              className: o("desktop:flex desktop:flex-col desktop:justify-center desktop:py-10", i == null ? void 0 : i.textWithBtnContainer),
+              children: [
+                f && /* @__PURE__ */ t.jsx(w, { intent: x, title: n, mobileHidden: !0 }),
+                /* @__PURE__ */ t.jsx(nt, { textContent: d, intent: x, withButton: p }),
+                p && /* @__PURE__ */ t.jsx(
+                  j,
+                  {
+                    className: o("w-full px-4 desktop:w-max", i == null ? void 0 : i.button),
+                    size: "lg",
+                    onClick: e.onClick,
+                    intent: "secondary",
+                    children: e.text
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    )
+  ] }) });
+}, jt = () => /* @__PURE__ */ t.jsx("div", { className: o(""), children: "hello" }), N = {
+  ESIA: "esia",
+  MOBILE_ID: "mobileId",
+  COMBINE: "combine"
+}, _ = ({ children: n, isLoading: e, classes: x, loaderProps: d }) => /* @__PURE__ */ t.jsx(
+  "div",
+  {
+    tabIndex: 0,
+    className: o(
+      "relative flex h-[90px] w-full max-w-[328px] items-center justify-center rounded-sm p-2 desktop:max-w-[524px]",
+      "bg-color-white outline outline-1 outline-warm-grey-200 transition-colors focus-visible:outline-primary-focus",
+      x == null ? void 0 : x.root
+    ),
+    children: /* @__PURE__ */ t.jsx(
+      "div",
+      {
+        className: o(
+          "flex h-[74px] flex-1 cursor-pointer rounded-sm px-2 py-3 transition-colors desktop:px-4 desktop:py-3",
+          "bg-color-blue-grey-100 hover:bg-color-blue-grey-200 active:bg-color-blue-grey-300",
+          { "items-center": e },
+          x == null ? void 0 : x.wrapper
+        ),
+        children: e ? /* @__PURE__ */ t.jsx(P, { position: "static", classes: { wrapper: "size-8 m-auto" }, ...d }) : n
+      }
+    )
+  }
+), dt = ({ ...n }) => /* @__PURE__ */ t.jsxs("svg", { width: "32", height: "32", viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...n, children: [
+  /* @__PURE__ */ t.jsx(
+    "path",
+    {
+      d: "M30.3986 10.6149C30.2728 8.96576 29.014 6.85155 27.7553 5.83672C26.3398 4.79816 24.8691 3.83828 23.3497 2.96139C21.8418 2.06068 20.2871 1.24201 18.6923 0.508895C17.8404 0.15868 16.927 -0.0139306 16.007 0.00148264C15.0868 -0.0180029 14.1725 0.154761 13.3217 0.508895C11.7272 1.24253 10.1725 2.06119 8.66438 2.96139C6.23081 4.44134 4.25878 5.83672 4.25878 5.83672C3.22329 6.71008 2.43892 7.83418 1.97146 9.09195C1.87834 9.34251 2.07032 9.59987 2.33762 9.59987H4.2568C4.55401 9.59987 4.82321 9.43281 4.98085 9.18085C5.33539 8.61417 5.77902 8.10202 6.29948 7.66607C6.29948 7.66607 7.92774 6.52186 9.93709 5.3083C11.1823 4.57013 12.466 3.89884 13.7826 3.29725C14.485 3.00687 15.2399 2.8652 15.9998 2.88118C16.7593 2.86854 17.5136 3.01008 18.217 3.29725C19.5337 3.89841 20.8174 4.56972 22.0624 5.3083C23.317 6.02735 24.5313 6.81445 25.7 7.66607C26.7394 8.49823 27.7787 10.2319 27.8826 11.5841C27.8826 11.5841 28.1251 13.5952 28.1598 15.9772C28.1576 17.4483 28.0767 18.9183 27.9173 20.3807C27.6755 21.912 26.8879 23.3038 25.7 24.2988C25.7 24.2988 24.0718 25.4777 22.0624 26.6912C20.8172 27.4294 19.5335 28.1007 18.217 28.7023C17.5145 28.9927 16.7596 29.1343 15.9998 29.1184C15.2409 29.1343 14.4867 28.9963 13.7826 28.7127C12.4658 28.1115 11.1821 27.4402 9.93709 26.7016C7.92774 25.5228 6.29948 24.3092 6.29948 24.3092C5.84515 23.9454 5.39081 23.4094 5.01172 22.8082C4.85581 22.561 4.5896 22.3997 4.2973 22.3997H2.34718C2.07645 22.3997 1.88475 22.6629 1.98611 22.914C2.49249 24.168 3.37564 25.4212 4.25878 26.1332C4.25878 26.1332 6.23081 27.6132 8.66438 29.0508C10.1723 29.9515 11.7269 30.7702 13.3217 31.5033C14.1745 31.8492 15.088 32.0175 16.007 31.998C16.9273 32.0175 17.8416 31.8448 18.6923 31.4906C20.2869 30.757 21.8415 29.9383 23.3497 29.0381C25.7833 27.5582 27.7553 26.1205 27.7553 26.1205C29.1939 24.9072 30.1478 23.2098 30.4406 21.3424C30.6337 19.5589 30.7317 17.7663 30.7343 15.9723C30.6923 13.0673 30.3986 10.6149 30.3986 10.6149Z",
+      fill: "url(#paint0_linear_6493_452)"
+    }
+  ),
+  /* @__PURE__ */ t.jsx(
+    "path",
+    {
+      d: "M1.27985 12.4821C1.27985 12.1286 1.56638 11.8421 1.91985 11.8421H11.8398C12.1933 11.8421 12.4798 12.1286 12.4798 12.4821V14.4021C12.4798 14.7555 12.1933 15.0421 11.8398 15.0421H1.27985V12.4821Z",
+      fill: "#0066B3"
+    }
+  ),
+  /* @__PURE__ */ t.jsx(
+    "path",
+    {
+      d: "M1.27985 16.9618H21.4398C21.7933 16.9618 22.0798 17.2484 22.0798 17.6018V19.5218C22.0798 19.8752 21.7933 20.1618 21.4398 20.1618H1.91985C1.56638 20.1618 1.27985 19.8752 1.27985 19.5218V16.9618Z",
+      fill: "#EE2F53"
+    }
+  ),
+  /* @__PURE__ */ t.jsx("defs", { children: /* @__PURE__ */ t.jsxs("linearGradient", { id: "paint0_linear_6493_452", x1: "16.0071", y1: "0", x2: "16.0071", y2: "31.9996", gradientUnits: "userSpaceOnUse", children: [
+    /* @__PURE__ */ t.jsx("stop", { stopColor: "#0066B3" }),
+    /* @__PURE__ */ t.jsx("stop", { offset: "0.354167", stopColor: "#0066B3" }),
+    /* @__PURE__ */ t.jsx("stop", { offset: "0.6875", stopColor: "#EE2F53" }),
+    /* @__PURE__ */ t.jsx("stop", { offset: "1", stopColor: "#EE2F53" })
+  ] }) })
+] }), H = ({ mainLink: n, subLink: e, isMobile: x, classes: d }) => /* @__PURE__ */ t.jsxs("div", { className: o("flex flex-col", d == null ? void 0 : d.linksWrapper), children: [
+  /* @__PURE__ */ t.jsx(
+    "a",
+    {
+      href: n.href,
+      target: "_blank",
+      rel: "noreferrer",
+      className: o(
+        'before:content=[" "] desk-body-medium-l z-[4] text-color-dark before:absolute before:left-1/2 before:top-1/2 before:h-full before:w-full before:-translate-x-1/2 before:-translate-y-1/2',
+        d == null ? void 0 : d.linksMainLink
+      ),
+      children: x ? n.mobileTitle : n.title
+    }
+  ),
+  (e == null ? void 0 : e.text) && (e == null ? void 0 : e.href) && /* @__PURE__ */ t.jsx(
+    y,
+    {
+      intent: "blue",
+      withUnderline: !0,
+      href: e == null ? void 0 : e.href,
+      target: "_blank",
+      rel: "noreferrer",
+      classes: {
+        link: o("w-max relative z-[6] p-0 desk-body-regular-m text-color-tetriary", d == null ? void 0 : d.linksSubLink)
+      },
+      children: e == null ? void 0 : e.text
+    }
+  )
+] }), C = ({ mainLink: n, subLink: e, isLoading: x, badge: d, loaderProps: r, classes: i }) => {
+  const { isMobile: p } = g();
+  return /* @__PURE__ */ t.jsx(_, { isLoading: x, loaderProps: r, classes: i, children: /* @__PURE__ */ t.jsxs(
+    "div",
+    {
+      className: o(
+        "flex flex-1 items-center justify-between gap-1",
+        { "justify-center": !d && p },
+        i == null ? void 0 : i.innerWrapper
+      ),
+      children: [
+        /* @__PURE__ */ t.jsxs("div", { className: o("flex items-center gap-1 desktop:gap-4", i == null ? void 0 : i.textContent), children: [
+          /* @__PURE__ */ t.jsxs("div", { children: [
+            /* @__PURE__ */ t.jsx(a, { name: "logos/mts", className: o("relative z-[9] size-7 desktop:size-8", i == null ? void 0 : i.mtsLogo) }),
+            /* @__PURE__ */ t.jsx(a, { name: "logos/megafon", className: o("relative z-[8] -ml-4 size-7 desktop:size-8", i == null ? void 0 : i.megafonLogo) }),
+            /* @__PURE__ */ t.jsx(a, { name: "logos/beeline", className: o("relative z-[7] -ml-4 size-7 desktop:size-8", i == null ? void 0 : i.beelineLogo) })
+          ] }),
+          /* @__PURE__ */ t.jsx(H, { mainLink: n, subLink: e, isMobile: p, classes: i }),
+          /* @__PURE__ */ t.jsx(a, { name: "arrows/arrowRight", className: o("mobile:hidden", i == null ? void 0 : i.arrowIcon) })
+        ] }),
+        d && /* @__PURE__ */ t.jsx(v, { className: o("bg-color-positive", i == null ? void 0 : i.badge), children: d })
+      ]
+    }
+  ) });
+}, I = ({ mainLink: n, subLink: e, isLoading: x, badge: d, loaderProps: r, classes: i }) => {
+  const { isMobile: p } = g();
+  return /* @__PURE__ */ t.jsx(_, { isLoading: x, loaderProps: r, classes: i, children: /* @__PURE__ */ t.jsxs(
+    "div",
+    {
+      className: o(
+        "flex flex-1 items-center justify-between gap-1",
+        { "justify-center": !d && p },
+        i == null ? void 0 : i.innerWrapper
+      ),
+      children: [
+        /* @__PURE__ */ t.jsxs("div", { className: o("flex items-center gap-1 desktop:gap-4", i == null ? void 0 : i.textContent), children: [
+          /* @__PURE__ */ t.jsx(dt, { className: o("size-7 desktop:size-8", i == null ? void 0 : i.esiaLogo) }),
+          /* @__PURE__ */ t.jsx(H, { mainLink: n, subLink: e, isMobile: p, classes: i }),
+          /* @__PURE__ */ t.jsx(a, { name: "arrows/arrowRight", className: o("mobile:hidden", i == null ? void 0 : i.arrowIcon) })
+        ] }),
+        d && /* @__PURE__ */ t.jsx(v, { className: o("bg-color-positive", i == null ? void 0 : i.badge), children: d })
+      ]
+    }
+  ) });
+}, it = (n) => {
+  switch (n.mode) {
+    case N.ESIA:
+      return /* @__PURE__ */ t.jsx(I, { ...n });
+    case N.MOBILE_ID:
+      return /* @__PURE__ */ t.jsx(C, { ...n });
+    case N.COMBINE:
+    default:
+      const { esiaConfig: e, mobileIdConfig: x, subtitle: d, badge: r, classes: i } = n, p = !d && !r ? R.Fragment : "div";
+      return /* @__PURE__ */ t.jsxs(
+        "div",
+        {
+          className: o(
+            "flex w-[328px] flex-col items-center justify-center gap-2 rounded-sm bg-color-white px-2 py-4 outline outline-1 outline-warm-grey-200 desktop:w-[524px] desktop:p-4",
+            i == null ? void 0 : i.root
+          ),
+          children: [
+            /* @__PURE__ */ t.jsxs(p, { className: o("flex w-full items-center justify-between gap-2", i == null ? void 0 : i.topContent), children: [
+              d && /* @__PURE__ */ t.jsx("h5", { className: o("desk-body-regular-l flex flex-1 text-color-dark", i == null ? void 0 : i.subtitle), children: d }),
+              r && /* @__PURE__ */ t.jsx(v, { className: o("bg-color-positive", i == null ? void 0 : i.badge), children: r })
+            ] }),
+            /* @__PURE__ */ t.jsxs("div", { className: o("grid w-full grid-cols-2 gap-2 desktop:gap-4", i == null ? void 0 : i.authWrapper), children: [
+              /* @__PURE__ */ t.jsx(
+                I,
+                {
+                  ...e,
+                  classes: {
+                    root: "p-0 outline-0 h-[74px]",
+                    arrowIcon: "hidden",
+                    ...e.classes
+                  }
+                }
+              ),
+              /* @__PURE__ */ t.jsx(
+                C,
+                {
+                  ...x,
+                  classes: {
+                    root: "p-0 outline-0 h-[74px]",
+                    arrowIcon: "hidden",
+                    ...x.classes
+                  }
+                }
+              )
+            ] })
+          ]
+        }
+      );
+  }
+}, gt = (n) => it(n);
+export {
+  E as Advantages,
+  gt as AuthProvider,
+  at as Banner,
+  c as BannerWithSeparateImg,
+  jt as BaseForm,
+  ht as Benefit,
+  ut as Footer,
+  bt as LongBanner,
+  lt as PageHeader,
+  kt as Stepper
+};
+//# sourceMappingURL=widgets.js.map