@scbt-ecom/ui 0.4.2 → 0.4.3

package/lib/widgets/footer/model/defaultValues.tsx

@@ -1,105 +0,0 @@
-import type { IFooterNavLinks, IFooterPhones, IFooterSocialLinks } from './types'
-
-export const defaultCopyright = (
-  <>
-    © 2004-2024, ПАО «Совкомбанк». Все права защищены. <br /> Генеральная лицензия Банка России №963 от 5 декабря 2014 г.
-  </>
-)
-
-export const defaultLigal = `Кредит на бизнес цели, срок 3, 6, 9, 12, 18, 24, 36, 48, 60 мес. Ставка – от 22,9%*. *Точная процентная ставка
-        устанавливается по соглашению сторон и определяется исходя из платёжеспособности и кредитоспособности клиента, а также
-        иных индивидуальных особенностей клиента. Сумма 100 000 – 50 000 000 руб. Кредит выдается на карту “Халва”, открытый в
-        Банке. Банк вправе отказать в предоставлении кредита без объяснения причины, а также запросить дополнительную информацию о
-        клиенте. Предварительное одобрение не влечет обязательств Банка по выдаче кредита. В некоторых случаях срок рассмотрения
-        заявки может составлять до 3 рабочих дней. Полный электронный документооборот при наличии открытого р/с в ПАО «Совкомбанк»
-        и действующей ЭЦП. Условия рекламы действительны на 20.02.2024г.`
-
-export const defaultPhones: IFooterPhones[] = [
-  { phone: '8 800 100-00-06', text: 'Звонок по России (бесплатно)' },
-  { phone: '+7 (495) 988 00 00', text: 'Для звонков из-за рубежа (платно)' }
-]
-
-export const defaultSocialsLinks: IFooterSocialLinks[] = [
-  { iconName: 'social/vk', href: '/vk' },
-  { iconName: 'social/telegram', href: '/tg' },
-  { iconName: 'social/classmates', href: '/cl' }
-]
-
-export const defaultNavigationLinks: IFooterNavLinks[] = [
-  {
-    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: '/' }
-    ]
-  }
-]

package/lib/widgets/footer/model/types.ts

@@ -1,19 +0,0 @@
-import { type SpritesMap } from '$/shared/ui'
-
-export interface IFooterSocialLinks {
-  iconName: `social/${SpritesMap['social']}`
-  href: string
-}
-
-export interface IFooterNavLinks {
-  groupLabel: string
-  links: {
-    text: string
-    href: string
-  }[]
-}
-
-export interface IFooterPhones {
-  phone: string
-  text: string
-}

package/lib/widgets/footer/ui/Copyright.tsx

@@ -1,15 +0,0 @@
-import * as React from 'react'
-import { cn } from '$/shared/utils'
-
-export type TCopyrightClasses = {
-  text: string
-}
-
-interface ICopyrightProps {
-  text?: string | React.ReactElement
-  classes?: Partial<TCopyrightClasses>
-}
-
-export const Copyright = ({ text, classes }: ICopyrightProps) => {
-  return <div className={cn('desk-body-regular-m text-color-footer', classes?.text)}>{text}</div>
-}

package/lib/widgets/footer/ui/Ligal.tsx

@@ -1,50 +0,0 @@
-'use client'
-
-import * as React from 'react'
-import { cn } from '$/shared//utils'
-
-export type TLigalClasses = {
-  ligalRoot: string
-  ligal: string
-  ligalButton: string
-}
-
-interface ILigalProps {
-  ligal: string | React.ReactElement
-  classes?: Partial<TLigalClasses>
-}
-
-export const Ligal = ({ ligal, classes }: ILigalProps) => {
-  const [isExpanded, setIsExpanded] = React.useState(false)
-  const [isClamped, setIsClamped] = React.useState(false)
-  const ligalRef = React.useRef<HTMLParagraphElement | null>(null)
-
-  React.useEffect(() => {
-    const element = ligalRef.current
-    if (element) {
-      setIsClamped(element.scrollHeight > element.clientHeight)
-    }
-  }, [])
-
-  return (
-    <div className={cn('mt-8 flex flex-col gap-4', classes?.ligalRoot)}>
-      <p ref={ligalRef} className={cn('desk-body-regular-m text-color-footer', { 'line-clamp-3': !isExpanded }, classes?.ligal)}>
-        {ligal}
-      </p>
-
-      {isClamped && (
-        <div
-          tabIndex={0}
-          role='button'
-          onClick={() => setIsExpanded((prev) => !prev)}
-          className={cn(
-            'desk-body-regular-l w-max cursor-pointer font-medium text-color-footer transition-colors hover:text-color-white',
-            classes?.ligalButton
-          )}
-        >
-          Подробнее
-        </div>
-      )}
-    </div>
-  )
-}

package/lib/widgets/footer/ui/NavLinks.tsx

@@ -1,41 +0,0 @@
-import type { IFooterNavLinks } from '../model/types'
-import { cn } from '$/shared/utils'
-
-export type TNavigationLinksClasses = {
-  navRoot: string
-  navGroup: string
-  navLabel: string
-  navWrapper: string
-  navLink: string
-}
-
-interface INavLinksProps {
-  navigationLinks: IFooterNavLinks[]
-  classes?: Partial<TNavigationLinksClasses>
-}
-
-export const NavLinks = ({ navigationLinks, classes }: INavLinksProps) => {
-  return (
-    <div className={cn('grid grid-cols-4 gap-10 border-y border-blue-grey-500 py-8 pt-8', classes?.navRoot)}>
-      {navigationLinks?.map(({ groupLabel, links }) => (
-        <div key={groupLabel} className={cn('flex flex-col gap-4', classes?.navGroup)}>
-          <div className={cn('desk-body-regular-m font-medium text-color-white', classes?.navLabel)}>{groupLabel}</div>
-          <div className={cn('flex flex-col gap-2', classes?.navWrapper)}>
-            {links?.map(({ text, href }) => (
-              <a
-                key={text}
-                href={href}
-                className={cn(
-                  'desk-body-regular-m cursor-pointer text-color-white transition-colors hover:text-color-footer',
-                  classes?.navLink
-                )}
-              >
-                {text}
-              </a>
-            ))}
-          </div>
-        </div>
-      ))}
-    </div>
-  )
-}

package/lib/widgets/footer/ui/PhonesBlock.tsx

@@ -1,34 +0,0 @@
-import type { IFooterPhones } from '../model/types'
-import { PhoneView } from '$/shared/ui'
-import { cn } from '$/shared/utils'
-
-export type TPhoneBlockClasses = {
-  phonesRoot: string
-  phoneWrapper: string
-  phoneText: string
-  phoneLink: string
-}
-
-interface IPhonesBlockProps {
-  phones: IFooterPhones[]
-  classes?: Partial<TPhoneBlockClasses>
-}
-
-export const PhonesBlock = ({ phones, classes }: IPhonesBlockProps) => {
-  return (
-    <div className={cn('flex flex-col items-end gap-4', classes?.phonesRoot)}>
-      {phones?.map(({ phone, text }) => (
-        <PhoneView
-          key={phone}
-          phone={phone}
-          text={text}
-          classes={{
-            wrapper: cn(classes?.phoneWrapper),
-            text: cn('text-color-footer', classes?.phoneText),
-            link: cn('text-color-white', classes?.phoneLink)
-          }}
-        />
-      ))}
-    </div>
-  )
-}

package/lib/widgets/footer/ui/SocialLinks.tsx

@@ -1,30 +0,0 @@
-import type { IFooterSocialLinks } from '../model/types'
-import { Icon } from '$/shared/ui'
-import { cn } from '$/shared/utils'
-
-export type TSocialLinksClasses = {
-  socialRoot: string
-  socialLink: string
-  socialIcon: string
-}
-
-interface ISocialLinksProps {
-  socialsLinks: IFooterSocialLinks[]
-  classes?: Partial<TSocialLinksClasses>
-}
-
-export const SocialLinks = ({ socialsLinks, classes }: ISocialLinksProps) => {
-  return (
-    <div className={cn('mt-6 flex items-center gap-2', classes?.socialRoot)}>
-      {socialsLinks?.map(({ iconName, href }) => (
-        <a
-          className={cn('flex size-8 items-center justify-center rounded-full bg-[#52576a] p-2', classes?.socialLink)}
-          href={href}
-          key={href}
-        >
-          <Icon name={iconName} className={cn('h-full w-full text-icon-white', classes?.socialIcon)} />
-        </a>
-      ))}
-    </div>
-  )
-}

package/lib/widgets/pageHeader/PageHeader.tsx

@@ -1,54 +0,0 @@
-import { brandLogos, Button, PhoneView, ResponsiveContainer, type TBrandLogoVariant } from '$/shared/ui'
-
-export interface ICommonHeaderProps {
-  logoPath?: string
-  logoType?: TBrandLogoVariant
-}
-interface IHeaderWithPhone extends ICommonHeaderProps {
-  variant: 'withPhone'
-  phone: string
-  phoneText: string
-}
-interface IHeaderWithButton extends ICommonHeaderProps {
-  variant: 'withButton'
-}
-
-export type TPageHeaderProps = IHeaderWithButton | IHeaderWithPhone
-
-const renderContentVariant = (props: TPageHeaderProps) => {
-  switch (props.variant) {
-    case 'withButton':
-      return (
-        <Button intent='secondary' size='sm'>
-          Оформить заявку
-        </Button>
-      )
-    case 'withPhone':
-      const { phone, phoneText } = props as IHeaderWithPhone
-      return <PhoneView phone={phone} text={phoneText} />
-    default:
-      return null
-  }
-}
-
-export const PageHeader = (props: TPageHeaderProps) => {
-  const { logoPath = '/', logoType = 'main' } = props
-
-  return (
-    <header className='flex h-[72px] items-center justify-center bg-color-blue-grey-200'>
-      <ResponsiveContainer>
-        <div className='flex items-center justify-between gap-5'>
-          <a
-            href={logoPath}
-            target='_blank'
-            rel='noreferrer'
-            className='flex items-center justify-center [&_svg]:h-[32px] [&_svg]:w-[192px]'
-          >
-            {brandLogos[logoType]}
-          </a>
-          {renderContentVariant(props)}
-        </div>
-      </ResponsiveContainer>
-    </header>
-  )
-}

package/lib/widgets/stepper/Stepper.tsx

@@ -1,43 +0,0 @@
-import * as React from 'react'
-import { SingleStep, type TSingleStepClasses } from './ui/SingleStep'
-import { Heading, ResponsiveContainer, Section } from '$/shared/ui'
-import { cn } from '$/shared/utils'
-
-type TStepperClasses = TSingleStepClasses & {
-  root: string
-  headline: string
-  stepsWrapper: string
-}
-
-export interface ISingleStep {
-  title: string
-  description: string | React.ReactElement
-}
-
-export interface IStepperProps {
-  heading: string
-  stepsList: ISingleStep[]
-  classes?: Partial<TStepperClasses>
-}
-
-export const Stepper = ({ heading, stepsList, classes }: IStepperProps) => {
-  return (
-    <Section>
-      <ResponsiveContainer>
-        <div className={cn('flex flex-col gap-12', classes?.root)}>
-          <Heading as='h2' className={cn('text-color-dark', classes?.headline)}>
-            {heading}
-          </Heading>
-          <div
-            className={cn(
-              'flex flex-col items-start gap-6 desktop:flex-row desktop:items-center desktop:gap-12',
-              classes?.stepsWrapper
-            )}
-          >
-            {stepsList?.map((step, index) => <SingleStep key={step.title} index={index + 1} {...step} classes={classes} />)}
-          </div>
-        </div>
-      </ResponsiveContainer>
-    </Section>
-  )
-}

package/lib/widgets/stepper/ui/SingleStep.tsx

@@ -1,42 +0,0 @@
-import type { ISingleStep } from '../Stepper'
-import { Heading } from '$/shared/ui'
-import { cn } from '$/shared/utils'
-
-export type TSingleStepClasses = {
-  singleStep: string
-  numeric: string
-  textBlock: string
-  title: string
-  description: string
-}
-
-interface ISingleStepProps extends ISingleStep {
-  index: number
-  classes?: Partial<TSingleStepClasses>
-}
-
-export const SingleStep = ({ title, description, index, classes }: ISingleStepProps) => {
-  return (
-    <div
-      className={cn(
-        'mobile:border-color-blue-grey-500 flex w-[328px] max-w-[328px] flex-col gap-6 mobile:rounded-md mobile:border mobile:border-solid mobile:p-4 desktop:w-[348px] desktop:max-w-[348px]',
-        classes?.singleStep
-      )}
-    >
-      <div
-        className={cn(
-          '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',
-          classes?.numeric
-        )}
-      >
-        {index}
-      </div>
-      <div className={cn('flex flex-col gap-4', classes?.textBlock)}>
-        <Heading as='h4' className={cn('text-color-dark', classes?.title)}>
-          {title}
-        </Heading>
-        <p className={cn('desk-body-regular-l text-color-tetriary', classes?.description)}>{description}</p>
-      </div>
-    </div>
-  )
-}

package/postcss.config.mjs

@@ -1,8 +0,0 @@
-/** @type {import('postcss-load-config').Config} */
-const config = {
-  plugins: {
-    tailwindcss: {}
-  }
-}
-
-export default config

package/src/App.tsx

@@ -1,9 +0,0 @@
-export const App = () => {
-  return (
-    <div className='flex min-h-screen items-center justify-center'>
-      <h2 className='desk-title-bold-s text-color-tetriary'>
-        use <span className='desk-title-bold-s text-color-primary-default'> npm run start </span> for run storybook
-      </h2>
-    </div>
-  )
-}

package/src/app/providers/RootProvider.tsx

@@ -1,11 +0,0 @@
-import type { IProviderProps } from './model/types'
-import { NotificationProvider } from '$/shared/ui'
-
-export const RootProvider = ({ children }: IProviderProps) => {
-  return (
-    <>
-      <NotificationProvider />
-      {children}
-    </>
-  )
-}

package/src/app/providers/index.ts

@@ -1 +0,0 @@
-export * from './RootProvider'

package/src/app/providers/model/types.ts

@@ -1,5 +0,0 @@
-import type { ReactNode } from 'react'
-
-export interface IProviderProps {
-  children: ReactNode
-}

package/src/configs/setup.ts

@@ -1,9 +0,0 @@
-import * as matchers from '@testing-library/jest-dom/matchers'
-import { cleanup } from '@testing-library/react'
-import { afterEach, expect } from 'vitest'
-
-expect.extend(matchers)
-
-afterEach(() => {
-  cleanup()
-})

package/src/configs/storybook.config.ts

@@ -1,23 +0,0 @@
-export const STORYBOOK_VIEWPORTS = {
-  mobile: {
-    name: 'mobile',
-    styles: {
-      width: '360px',
-      height: '700px'
-    }
-  },
-  desktop: {
-    name: 'desktop',
-    styles: {
-      width: '1188px',
-      height: '700px'
-    }
-  },
-  fullscreen: {
-    name: 'fullscreen',
-    styles: {
-      width: '100%',
-      height: '100%'
-    }
-  }
-}

package/src/main.tsx

@@ -1,10 +0,0 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-import '$/shared/style.css'
-import { App } from './App.tsx'
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-)

package/src/stories/primitives/Accordion.stories.tsx

@@ -1,66 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react'
-import { Accordion } from '$/shared/ui'
-
-const meta = {
-  title: 'INTERACTIVE/Accordion',
-  component: Accordion,
-  tags: ['autodocs'],
-  decorators: [
-    (Story) => (
-      <div className='m-auto mt-8 max-w-[800px]'>
-        <Story />
-      </div>
-    )
-  ]
-} satisfies Meta<typeof Accordion>
-
-export default meta
-
-type Story = StoryObj<typeof Accordion>
-
-const mock_accordion_list = [
-  {
-    label: 'Заголовок аккордеон 1',
-    content: 'Контент аккордеона 1'
-  },
-  {
-    label: 'Заголовок аккордеон 2',
-    content: 'Контент аккордеона 2'
-  },
-  {
-    label: 'Заголовок аккордеон 3',
-    content: 'Контент аккордеона 3'
-  }
-]
-
-export const Base: Story = {
-  args: {
-    label: 'Заголовок аккордеон',
-    children: 'Контент аккордеона'
-  }
-}
-
-export const WithDefaultOpen: Story = {
-  args: {
-    defaultOpen: ['Заголовок аккордеон'],
-    label: 'Заголовок аккордеон',
-    children: 'Контент аккордеона'
-  }
-}
-
-export const MappedWithDefaultOpen: Story = {
-  render: (...args) => (
-    <div className='flex flex-col gap-6'>
-      {mock_accordion_list?.map(({ label, content }) => (
-        <Accordion
-          defaultOpen={['Заголовок аккордеон 1', 'Заголовок аккордеон 2']}
-          key={label.toString()}
-          label={label}
-          {...args}
-        >
-          {content}
-        </Accordion>
-      ))}
-    </div>
-  )
-}

package/src/stories/primitives/Badge.stories.tsx

@@ -1,28 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react'
-import { Badge } from '$/shared/ui'
-
-const meta = {
-  title: 'Base/Badge',
-  component: Badge,
-  parameters: {
-    layout: 'centered'
-  },
-  tags: ['autodocs']
-} satisfies Meta<typeof Badge>
-
-export default meta
-
-type Story = StoryObj<typeof meta>
-
-export const Base: Story = {
-  args: {
-    children: 'Text container'
-  }
-}
-
-export const MinWidth: Story = {
-  args: {
-    children: '2',
-    className: 'bg-color-primary-default'
-  }
-}

package/src/stories/primitives/Breadcrumbs.stories.tsx

@@ -1,29 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react'
-import { Breadcrumbs } from '$/shared/ui'
-import type { TLinksList } from '$/shared/ui/Breadcrumbs'
-
-const meta = {
-  title: 'Navigation/Breadcrumbs',
-  component: Breadcrumbs,
-  parameters: {
-    layout: 'centered'
-  },
-
-  tags: ['autodocs']
-} satisfies Meta<typeof Breadcrumbs>
-
-export default meta
-
-type Story = StoryObj<typeof meta>
-
-const linksList: TLinksList = [
-  { label: 'Главная', path: 'https://sovcombank.ru/' },
-  { label: 'Займы', path: 'https://sovcombank.ru/apply/credit/zajm-online/' },
-  { label: 'Главная' }
-]
-
-export const Base: Story = {
-  args: {
-    linksList
-  }
-}