@mindly/ui-components 5.98.17 → 5.98.18

package/dist/esm/lib2/shared/providers/ToastProvider/ToastProvider.js

@@ -0,0 +1,28 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { ToastQueue, useToastQueue } from '@react-stately/toast';
+import { createPortal } from 'react-dom';
+import { ToastRegion } from '../../ui';
+const toastQueue = new ToastQueue({
+    maxVisibleToasts: 1,
+    hasExitAnimation: true,
+});
+export const ToastContext = React.createContext(undefined);
+export function ToastProvider(_a) {
+    var { children } = _a, props = __rest(_a, ["children"]);
+    const state = useToastQueue(toastQueue);
+    return (_jsxs(ToastContext.Provider, Object.assign({ value: state }, { children: [state.visibleToasts.length > 0
+                ? createPortal(_jsx(ToastRegion, Object.assign({}, props, { state: state })), document.body)
+                : null, children] })));
+}

package/dist/esm/lib2/shared/providers/ToastProvider/index.js

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

package/dist/esm/lib2/shared/providers/index.js

@@ -0,0 +1,3 @@
+export * from './ThemeProvider';
+export * from './ToastProvider';
+export * from './CircleRatingProvider';

package/dist/esm/lib2/shared/translators/specialistPayments.js

@@ -0,0 +1,48 @@
+export const translationFunction = (key, obj) => {
+    const translations = {
+        'payments.commission_rate.title': 'Рівень комісії',
+        'payments.details.link': 'Деталі',
+        'payments.sessions_held.title': 'Проведено сеансів',
+        'payments.future_sessions.title': 'Майбутні сеанси',
+        'payments.planned_income.title': 'Плановий дохід (з урах. комісії)',
+        'payments.session_count_range.text': '{{from}}-{{count}} сеансів',
+        'payments.session_count_more.text': '{{count}}+ сеансів',
+        'payments.held_sessions.subtitle': 'Проведенi сеанси',
+        'payments.income.title': 'Дохід (з урах. комісії)',
+        'payments.balance_details.held_tab': 'Попередні',
+        'payments.balance_details.future_tab': 'Майбутні',
+        'payments.payout_in_progress.badge': 'Очікуйте виплату до {{date}}',
+        'payments.payout_paid.badge': 'Виплачено {{date}}',
+        'payments.session_details.price.title': 'Ціна сеансу',
+        'payments.session_details.discount.title': 'Знижка за підписку {{discount}}',
+        'payments.session_details.promocode.title': 'Знижка по промокоду {{discount}}',
+        'payments.session_details.session_amount.title': 'Сплачено клієнтом \nза сеанс',
+        'payments.session_details.fee.title': 'Комісія {{count}}',
+        'payments.session_details.total.title': 'Сума виплати',
+        'payments.session_details.type.title': 'Тип сеансу',
+        'payments.session_details.type.trial': 'Пробний',
+        'payments.session_details.type.subscription': 'По підписці',
+        'payments.session_details.type.subscription_item': '{{count}} сеанс на {{period}} міс',
+        'payments.session_details.description': 'Ваш заробіток та виплати розраховуються в основній валюті — євро. Для вашої зручності ми також відображаємо еквівалент у локальній валюті (гривні), вирахований за актуальним курсом. Через округлення, суми в гривні можуть відрізнятися на кілька копійок.',
+        'payments.session_details.exchange_rate.subtitle': 'Курс {{rate}}',
+        'payments.session_details.future_session.badge': 'Майбутній сеанс',
+        'select_period.title': 'Оберіть період',
+        'select_period.button': 'Обрати',
+        'reviews.today_subtitle': 'Сьогодні',
+        'reviews.days_before_subtitle': '{{count}} день назад',
+    };
+    return obj
+        ? Object.keys(obj).length <= 1
+            ? translations[key]
+                .replace('{{count}}', obj[Object.keys(obj)[0]])
+                .replace('{{date}}', obj[Object.keys(obj)[0]])
+                .replace('{{rate}}', obj[Object.keys(obj)[0]])
+                .replace('{{fee}}', obj[Object.keys(obj)[0]])
+                .replace('{{discount}}', obj[Object.keys(obj)[0]])
+            : translations[key]
+                .replace('{{period}}', obj.period)
+                .replace('{{from}}', obj.from)
+                .replace('{{count}}', obj.count)
+                .replace('{{count}}', obj.count)
+        : translations[key];
+};

package/dist/esm/lib2/shared/types/common.js

@@ -0,0 +1,32 @@
+export var SupportedCurrency;
+(function (SupportedCurrency) {
+    SupportedCurrency["UAH"] = "UAH";
+    SupportedCurrency["EUR"] = "EUR";
+    SupportedCurrency["PLN"] = "PLN";
+    SupportedCurrency["USD"] = "USD";
+})(SupportedCurrency || (SupportedCurrency = {}));
+export const CurrencyLocaleMapper = {
+    UAH: 'uk',
+    EUR: 'eur',
+    PLN: 'pl',
+    USD: 'es',
+};
+export var CurrencySignByLocale;
+(function (CurrencySignByLocale) {
+    CurrencySignByLocale["uk"] = "\u20B4";
+    CurrencySignByLocale["pl"] = "z\u0142";
+    CurrencySignByLocale["eur"] = "\u20AC";
+    CurrencySignByLocale["es"] = "$";
+})(CurrencySignByLocale || (CurrencySignByLocale = {}));
+export var ShortCurrencySignByLocale;
+(function (ShortCurrencySignByLocale) {
+    ShortCurrencySignByLocale["uk"] = "\u0433\u0440\u043D";
+    ShortCurrencySignByLocale["pl"] = "z\u0142o";
+    ShortCurrencySignByLocale["eur"] = "EUR";
+    ShortCurrencySignByLocale["es"] = "USD";
+})(ShortCurrencySignByLocale || (ShortCurrencySignByLocale = {}));
+export const StripeSupportedCurrency = [
+    SupportedCurrency.EUR,
+    SupportedCurrency.PLN,
+    SupportedCurrency.USD,
+];

package/dist/esm/lib2/shared/types/consultation.d.ts

@@ -0,0 +1,45 @@
+import { ClientSpecialistContractStatusEnum } from './contract';
+import { Specialist } from './specialistTypes';
+export type Consultation = {
+    id: string;
+    consultation_time: {
+        _seconds: number;
+        nanoseconds: number;
+    } | string;
+    consultation_with: string;
+    duration: number;
+    exchange_rate: string;
+    payment_date: {
+        _seconds: number;
+        nanoseconds: number;
+    };
+    payment_type?: string;
+    price: number;
+    price_uah: number;
+    psychologist_avatar: string;
+    psychologist_id: string;
+    psychologist_name: string;
+    psychologist_timezone: string;
+    user_avatar: string;
+    user_id: string;
+    user_name: string;
+    user_timezone: string;
+    videochat_url: string;
+    was_rescheduled: boolean;
+    session_status?: 'client_showed' | 'client_not_showed';
+    consultation_time_before_rescheduling?: {
+        _seconds: number;
+        nanoseconds: number;
+    };
+    therapist?: Specialist;
+    client?: {
+        specialist_client_contract_id?: string | null;
+        specialist_client_contract_status?: ClientSpecialistContractStatusEnum | null;
+    };
+    applied_promotional_code?: string | null;
+    auto_booking_status?: 'enable' | 'disable';
+    subscription_id?: string | null;
+    price_type?: string;
+    price_default?: number;
+    payment_intent_id?: string;
+};

package/dist/esm/lib2/shared/types/contract.js

@@ -0,0 +1,14 @@
+export var ContractStatusEnum;
+(function (ContractStatusEnum) {
+    ContractStatusEnum["active"] = "active";
+    ContractStatusEnum["pending"] = "pending";
+    ContractStatusEnum["expired"] = "expired";
+    ContractStatusEnum["outdated"] = "outdated";
+})(ContractStatusEnum || (ContractStatusEnum = {}));
+export var ClientSpecialistContractStatusEnum;
+(function (ClientSpecialistContractStatusEnum) {
+    ClientSpecialistContractStatusEnum["active"] = "active";
+    ClientSpecialistContractStatusEnum["signed_by_specialist"] = "signed_by_specialist";
+    ClientSpecialistContractStatusEnum["signed_by_client"] = "signed_by_client";
+    ClientSpecialistContractStatusEnum["expired"] = "expired";
+})(ClientSpecialistContractStatusEnum || (ClientSpecialistContractStatusEnum = {}));

package/dist/esm/lib2/shared/types/getCountryKeyByName.js

@@ -0,0 +1,41 @@
+export var SupportedLangs;
+(function (SupportedLangs) {
+    SupportedLangs["en"] = "en";
+    SupportedLangs["uk"] = "uk";
+    SupportedLangs["pl"] = "pl";
+    SupportedLangs["es"] = "es";
+})(SupportedLangs || (SupportedLangs = {}));
+const UKRAINE_COUNTRIES_MAPPER = {
+    Ukraine: SupportedLangs.uk,
+};
+const POLAND_COUNTRIES_MAPPER = {
+    Poland: SupportedLangs.pl,
+};
+const SPANISH_COUNTRIES_MAPPER = {
+    Spain: SupportedLangs.es,
+    Argentina: SupportedLangs.es,
+    Bolivia: SupportedLangs.es,
+    Chile: SupportedLangs.es,
+    Colombia: SupportedLangs.es,
+    'Costa Rica': SupportedLangs.es,
+    'Costa rica': SupportedLangs.es,
+    Cuba: SupportedLangs.es,
+    'Dominican Republic': SupportedLangs.es,
+    'Dominican republic': SupportedLangs.es,
+    Ecuador: SupportedLangs.es,
+    'El Salvador': SupportedLangs.es,
+    'El salvador': SupportedLangs.es,
+    'Equatorial Guinea': SupportedLangs.es,
+    'Equatorial guinea': SupportedLangs.es,
+    Guatemala: SupportedLangs.es,
+    Honduras: SupportedLangs.es,
+    Mexico: SupportedLangs.es,
+    Nicaragua: SupportedLangs.es,
+    Panama: SupportedLangs.es,
+    Paraguay: SupportedLangs.es,
+    Peru: SupportedLangs.es,
+    Uruguay: SupportedLangs.es,
+    Venezuela: SupportedLangs.es,
+};
+export const COUNTRIES_MAPPER = Object.assign(Object.assign(Object.assign({}, UKRAINE_COUNTRIES_MAPPER), POLAND_COUNTRIES_MAPPER), SPANISH_COUNTRIES_MAPPER);
+export const getCountryKeyByName = (countryName) => { var _a; return (_a = COUNTRIES_MAPPER[countryName]) !== null && _a !== void 0 ? _a : SupportedLangs.en; };

package/dist/esm/lib2/shared/types/iconProps.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/lib2/shared/types/index.js

@@ -0,0 +1,11 @@
+export * from './ratingCircleTypes';
+export * from './specialistPaymentTypes';
+export * from './iconProps';
+export * from './common';
+export * from './getCountryKeyByName';
+export * from './responseFileType';
+export * from './onBoardingFlow.type';
+export * from './specialistTypes';
+export * from './review';
+export * from './contract';
+export * from './user';

package/dist/esm/lib2/shared/types/onBoardingFlow.type.js

@@ -0,0 +1,18 @@
+export var ConditionRulesType;
+(function (ConditionRulesType) {
+    ConditionRulesType["IS"] = "is";
+})(ConditionRulesType || (ConditionRulesType = {}));
+export var OnBoardingScreenStyleOptions;
+(function (OnBoardingScreenStyleOptions) {
+    OnBoardingScreenStyleOptions["DARK"] = "DARK";
+    OnBoardingScreenStyleOptions["LIGHT"] = "LIGHT";
+})(OnBoardingScreenStyleOptions || (OnBoardingScreenStyleOptions = {}));
+export var OnBoardingScreenOptions;
+(function (OnBoardingScreenOptions) {
+    OnBoardingScreenOptions["START"] = "START";
+    OnBoardingScreenOptions["MULTI_SELECT"] = "MULTI_SELECT";
+    OnBoardingScreenOptions["SINGLE_SELECT"] = "SINGLE_SELECT";
+    OnBoardingScreenOptions["INFO"] = "INFO";
+    OnBoardingScreenOptions["LOADER"] = "LOADER";
+    OnBoardingScreenOptions["REVIEWS"] = "REVIEWS";
+})(OnBoardingScreenOptions || (OnBoardingScreenOptions = {}));

package/dist/esm/lib2/shared/types/ratingCircleTypes.js

@@ -0,0 +1,6 @@
+export var CircleRatingSize;
+(function (CircleRatingSize) {
+    CircleRatingSize["S"] = "S";
+    CircleRatingSize["M"] = "M";
+    CircleRatingSize["L"] = "L";
+})(CircleRatingSize || (CircleRatingSize = {}));

package/dist/esm/lib2/shared/types/responseFileType.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/lib2/shared/types/review.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/lib2/shared/types/specialistPaymentTypes.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/lib2/shared/types/specialistTypes.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/lib2/shared/types/user.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/lib2/shared/ui/AlertCard/AlertCard.js

@@ -0,0 +1,24 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { alertCardStyles } from './styles';
+import { Typography, TypographyVariantsEnum } from '../Typography';
+import { Button_v2 } from '../Button_v2';
+const AlertCard = React.forwardRef(function AlertCard(props, ref) {
+    const { variant, size = 'XY4', title, text, icon: IconComponent, button, children, className } = props, restProps = __rest(props, ["variant", "size", "title", "text", "icon", "button", "children", "className"]);
+    const cardStyles = React.useMemo(() => {
+        return alertCardStyles({ size, className, variant });
+    }, [variant, size, className]);
+    return (_jsxs("div", Object.assign({ ref: ref, className: `${cardStyles} flex flex-row items-center justify-start` }, restProps, { children: [IconComponent && (_jsx("div", Object.assign({ className: "flex-shrink-0 text-2xl mr-4 items-center" }, { children: IconComponent }))), _jsxs("div", Object.assign({ className: "flex flex-col flex-grow" }, { children: [!!title && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text15Semi }, { children: title }))), !!text && (_jsx(Typography, Object.assign({ className: title ? 'mt-1' : '', variant: TypographyVariantsEnum.Text13Regular150 }, { children: text }))), button && (_jsx(Button_v2, Object.assign({ fill: "outline", className: `flex fit-w justify-center items-center border-color-black rounded-[40px] w-fit !mt-3 ${button.className || ''}`, onClick: button.onClick }, { children: button.text })))] })), children] })));
+});
+export default React.memo(AlertCard);

package/dist/esm/lib2/shared/ui/AlertCard/index.js

@@ -0,0 +1 @@
+export { default as AlertCard } from './AlertCard';

package/dist/esm/lib2/shared/ui/AlertCard/styles.js

@@ -0,0 +1,16 @@
+import { tv } from 'tailwind-variants';
+export const alertCardStyles = tv({
+    base: 'rounded-[30px]',
+    variants: {
+        variant: {
+            yellow: 'bg-color-info-light-orange',
+            blue: 'bg-color-info-light-blue',
+            transparent: 'bg-transparent border border-color-black !border-opacity-35',
+        },
+        size: {
+            XY4: 'p-4',
+            X5Y4: 'px-5 py-4',
+            XY5: 'p-5',
+        },
+    },
+});

package/dist/esm/lib2/shared/ui/AlertCard/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/lib2/shared/ui/AppFooter_v2/AppFooter_v2.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { AppFooterStyled } from './AppFooter_v2.style';
+import { IonToolbar } from '@ionic/react';
+import classNames from 'classnames';
+const AppFooter_v2 = ({ children, transparent, bottomSaveArea = true, borderTop = false, style, toolbarStyle, className = '', }) => {
+    return (_jsx(AppFooterStyled, Object.assign({ mode: 'ios', className: classNames('ion-no-border', { 'border-t-[1px] border-t-solid border-t-skeleton-color': borderTop }, { transparent: transparent }, { bottomSaveArea: bottomSaveArea }, className), style: style }, { children: _jsx(IonToolbar, Object.assign({ mode: "ios", style: toolbarStyle }, { children: children })) })));
+};
+export default React.memo(AppFooter_v2);

package/dist/esm/lib2/shared/ui/AppFooter_v2/AppFooter_v2.style.js

@@ -0,0 +1,41 @@
+import { IonFooter, isPlatform } from '@ionic/react';
+import styled from 'styled-components';
+export const AppFooterStyled = styled(IonFooter) `
+  background: #ffffff !important;
+  display: flex;
+  justify-content: center;
+
+  ion-toolbar {
+    --background: #ffffff !important;
+    --padding-bottom: 10px;
+    --padding-top: 10px;
+    --padding-start: 20px;
+    --padding-end: 20px;
+    --border-width: 0;
+    max-width: ${isPlatform('desktop') || isPlatform('tablet')
+    ? '410px'
+    : '100%'};
+    padding: 0 !important;
+  }
+
+  &.bottomSaveArea {
+    ion-toolbar {
+      --padding-bottom: calc(10px + var(--ion-safe-area-bottom));
+    }
+  }
+
+  .controls {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 20px;
+  }
+
+  &.transparent {
+    background: transparent;
+
+    ion-toolbar {
+      --background: transparent;
+    }
+  }
+`;

package/dist/esm/lib2/shared/ui/AppFooter_v2/index.js

@@ -0,0 +1 @@
+export { default as AppFooter_v2 } from './AppFooter_v2';

package/dist/esm/lib2/shared/ui/AppHeader_v2/AppHeader_v2.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { IonHeader, IonToolbar, isPlatform } from '@ionic/react';
+import styles from './AppHeader_v2.module.css';
+import classNames from 'classnames';
+const AppHeader_v2 = ({ fullwidth = false, className, style, toolbarClassName, toolbarStyle, children, }) => {
+    const isNotMobile = !fullwidth && (isPlatform('desktop') || isPlatform('tablet'));
+    return (_jsx(IonHeader, Object.assign({ className: classNames(`bg-white shadow-none flex justify-center`, className, styles.appHeaderContainer), style: style }, { children: _jsx(IonToolbar, Object.assign({ className: classNames(`${isNotMobile ? 'max-w-container' : 'max-w-full'} ${styles.appHeaderToolbar}`, toolbarClassName), style: toolbarStyle }, { children: children })) })));
+};
+export default AppHeader_v2;

package/dist/esm/lib2/shared/ui/AppHeader_v2/AppHeader_v2.stories.js

@@ -0,0 +1,21 @@
+import { AppHeader_v2 } from './index';
+const meta = {
+    title: 'v2/Shared/AppHeader',
+    component: AppHeader_v2,
+    argTypes: {
+        fullwidth: {
+            control: 'boolean',
+            description: 'Flag to indicate if the header should take up the full width.',
+        },
+        className: {
+            control: 'text',
+            description: 'Additional class names for styling.',
+        },
+    },
+};
+export default meta;
+export const Default = {
+    args: {
+        children: 'App Header',
+    },
+};

package/dist/esm/lib2/shared/ui/AppHeader_v2/index.js

@@ -0,0 +1 @@
+export { default as AppHeader_v2 } from './AppHeader_v2';

package/dist/esm/lib2/shared/ui/Avatar_v2/Avatar_v2.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useCallback, useEffect } from 'react';
+import { IonImg } from '@ionic/react';
+import { AvatarWrapper } from './Avatar_v2.style';
+import { ReactComponent as UserIcon } from './user.svg';
+import { Skeleton_v2 } from '../Skeleton_v2';
+const Avatar_v2 = ({ variant = 'small', round = 'circle', className, src, alt, showSkeleton, onClick, }) => {
+    const [isLoading, setIsLoading] = React.useState(true);
+    const [isError, setIsError] = React.useState(false);
+    useEffect(() => {
+        if (!src && !showSkeleton) {
+            setIsError(true);
+        }
+        else {
+            setIsError(false);
+        }
+    }, [src, showSkeleton]);
+    const handleAvatarError = useCallback(() => {
+        setIsError(true);
+        setIsLoading(false);
+    }, []);
+    return (_jsxs(AvatarWrapper, Object.assign({ className: `${variant} ${isError && 'error'}`, round: round, isLoading: isLoading, onClick: onClick }, { children: [(isLoading || showSkeleton) && !isError && (_jsx(Skeleton_v2, { className: `avatar-loader` })), isError && _jsx(UserIcon, { className: 'empty-icon' }), !isError && (_jsx(IonImg, { className: `avatar-img ${className}`, src: src, alt: alt, onIonImgDidLoad: () => {
+                    setIsError(false);
+                    setIsLoading(false);
+                }, onIonError: handleAvatarError, onIonImgWillLoad: () => {
+                    setIsError(false);
+                    setIsLoading(true);
+                } }))] })));
+};
+export default React.memo(Avatar_v2);

package/dist/esm/lib2/shared/ui/Avatar_v2/Avatar_v2.style.js

@@ -0,0 +1,91 @@
+import styled from 'styled-components';
+export function getBorderRadius(props) {
+    switch (props === null || props === void 0 ? void 0 : props.round) {
+        case 'circle':
+            return '50%';
+        case 'drop':
+            return '00% 50% 50% 50%;';
+        default:
+            return '50%';
+    }
+}
+function getBackground(props) {
+    return props.round === 'drop' && !props.isLoading ? '#212121' : undefined;
+}
+export const AvatarWrapper = styled.div `
+  border-radius: ${getBorderRadius};
+  background-color: ${getBackground};
+  flex-grow: 0;
+  flex-shrink: 0;
+  overflow: hidden;
+  position: relative;
+  border: 1px solid rgb(var(--borders-divider) / 0.1);
+  background-clip: padding-box;
+
+  &.small {
+    width: 40px;
+    height: 40px;
+  }
+
+  &.error {
+    background-color: #28bfa1;
+  }
+
+  .avatar-loader {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
+  }
+
+  .empty-icon {
+    color: #fff;
+    width: 24px;
+    height: 24px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+  }
+
+  .avatar-img {
+    width: 100%;
+    height: 100%;
+
+    &::part(image) {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+  }
+
+  &.medium {
+    width: 72px;
+    height: 72px;
+
+    .empty-icon {
+      width: 43px;
+      height: 43px;
+    }
+  }
+
+  &.smaller {
+    width: 20px;
+    height: 20px;
+
+    .empty-icon {
+      width: 10px;
+      height: 10px;
+    }
+  }
+
+  &.large {
+    width: 80px;
+    height: 80px;
+
+    .empty-icon {
+      width: 48px;
+      height: 48px;
+    }
+  }
+`;

package/dist/esm/lib2/shared/ui/Avatar_v2/index.js

@@ -0,0 +1 @@
+export { default as Avatar_v2 } from './Avatar_v2';

package/dist/esm/lib2/shared/ui/Badge/Badge.js

@@ -0,0 +1,32 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { badge } from './styles';
+import { IconCheck } from '../../assets/icons';
+import { useMemo } from 'react';
+const Badge = React.forwardRef(function Badge(props, ref) {
+    const { variant, size = 'S', type = 'default', children, className, iconType } = props, restProps = __rest(props, ["variant", "size", "type", "children", "className", "iconType"]);
+    const badgeStyles = React.useMemo(() => {
+        return badge({ type, size, className, variant });
+    }, [variant, size, type, className]);
+    const icon = useMemo(() => {
+        switch (iconType) {
+            case 'check':
+                return _jsx(IconCheck, { className: "w-4 h-4" });
+            default:
+                return null;
+        }
+    }, [iconType]);
+    return (_jsxs("span", Object.assign({ ref: ref, className: badgeStyles }, restProps, { children: [icon, children] })));
+});
+export default React.memo(Badge);

package/dist/esm/lib2/shared/ui/Badge/index.js

@@ -0,0 +1 @@
+export { default as Badge } from './Badge';