@mindly/ui-components 5.98.16 → 5.98.18

package/dist/esm/lib2/features/ReviewCardFeature/styles.js

@@ -0,0 +1,61 @@
+import { tv } from 'tailwind-variants';
+import { TypographyVariantsEnum } from '../../shared';
+export const reviewCardStyle = tv({
+    slots: {
+        base: 'w-full flex flex-col',
+        user: 'flex items-center gap-4',
+        rating: '!gap-1',
+        review: '',
+        mainTextVariant: '',
+        dateTextVariant: '',
+        ratingSize: null,
+        avatarSize: null,
+    },
+    variants: {
+        size: {
+            default: {
+                base: 'p-4 rounded-3xl',
+                user: 'mb-6',
+                rating: 'mb-2.5',
+                mainTextVariant: TypographyVariantsEnum.Text15Regular,
+                dateTextVariant: TypographyVariantsEnum.Text13Regular,
+                ratingSize: 16,
+                avatarSize: 'small',
+            },
+            small: {
+                base: 'p-2 rounded-xl',
+                user: 'mb-3',
+                rating: 'mb-1',
+                mainTextVariant: TypographyVariantsEnum.Text7Regular,
+                dateTextVariant: TypographyVariantsEnum.Text6Regular,
+                ratingSize: 8,
+                avatarSize: 'smaller',
+            },
+            large: {
+                base: 'p-5 rounded-3xl min-h-[313px]',
+                user: 'mb-6',
+                rating: 'mb-2.5',
+                mainTextVariant: TypographyVariantsEnum.Text15Regular,
+                dateTextVariant: TypographyVariantsEnum.Text13Regular,
+                ratingSize: 20,
+                avatarSize: 'small',
+            },
+        },
+        variant: {
+            default: {
+                base: 'bg-color-background-anti-flash-light',
+            },
+            outlined: {
+                base: 'border border-borders-divider',
+                rating: 'order-1 mb-0',
+                review: 'order-2 mt-2',
+                user: 'order-3 mb-0 mt-8',
+            },
+            full: {
+                base: 'p-0 flex flex-row flex-wrap justify-between min-h-0',
+                user: 'mb-2 flex-shirnk-0',
+                review: 'flex-grow-0 flex-shrink-0 basis-full',
+            },
+        },
+    },
+});

package/dist/esm/lib2/features/ReviewListFeature/ReviewListFeature.js

@@ -0,0 +1,69 @@
+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 classNames from 'classnames';
+import { forwardRef, useImperativeHandle, useRef } from 'react';
+import { Button_v2 as Button, ModalSheet, Container_v2 as Container, ReviewsSummary, } from '../../shared';
+import { ReviewCardFeature } from '../ReviewCardFeature';
+import { useIntersectionObserver } from 'usehooks-ts';
+const ReviewListFeature = forwardRef(({ className, rating, reviews, limit, t, list, presentingElement, onLoadMore, }, ref) => {
+    const modalRef = useRef(null);
+    const listRefs = useRef({});
+    const reviewToScrollId = useRef();
+    const { ref: loadMoreRef } = useIntersectionObserver({
+        threshold: 0.5,
+        onChange: (isIntersecting) => {
+            isIntersecting && (onLoadMore === null || onLoadMore === void 0 ? void 0 : onLoadMore());
+        },
+    });
+    useImperativeHandle(ref, () => ({
+        openModalReviews() {
+            var _a;
+            (_a = modalRef.current) === null || _a === void 0 ? void 0 : _a.present();
+        },
+    }));
+    const scrollToRef = (id) => {
+        var _a;
+        (_a = listRefs.current[id]) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: 'smooth' });
+    };
+    const setRef = (id) => {
+        return (el) => {
+            if (el) {
+                listRefs.current[id] = el;
+            }
+        };
+    };
+    const handleOnDidPresent = () => {
+        if (reviewToScrollId.current) {
+            scrollToRef(reviewToScrollId.current);
+        }
+    };
+    const handleOnWillDismiss = () => {
+        reviewToScrollId.current = undefined;
+    };
+    const handleOpenModal = (id) => () => {
+        var _a;
+        (_a = modalRef.current) === null || _a === void 0 ? void 0 : _a.present();
+        if (id) {
+            reviewToScrollId.current = id;
+        }
+    };
+    return (_jsxs("div", Object.assign({ className: classNames(className) }, { children: [_jsx(ReviewsSummary, { rating: rating, reviews: reviews, t: t }), _jsx("div", Object.assign({ className: "mt-4 mb-4 flex gap-4 flex-nowrap overflow-auto" }, { children: list.slice(0, limit).map((_a) => {
+                    var { id } = _a, review = __rest(_a, ["id"]);
+                    return (_jsx(ReviewCardFeature, Object.assign({ variant: "outlined", size: "large", t: t, className: "!w-56 flex-shrink-0", reviewTextClamp: 5, onExpandReview: handleOpenModal(id), avatarSrc: review.client_avatar || '', name: `${review.client_first_name} ${review.client_last_name || ''}`, date: review.created_at, rating: review.review_rating, review: review.text_of_review || '' }, review), id));
+                }) })), list.length > limit && (_jsx(Button, Object.assign({ fullWidth: true, fill: "outline", onClick: handleOpenModal() }, { children: t === null || t === void 0 ? void 0 : t('therapist_details.show_all') }))), _jsx(ModalSheet, Object.assign({ withCloseButton: true, ref: modalRef, presentingElement: presentingElement, onDidPresent: handleOnDidPresent, onWillDismiss: handleOnWillDismiss }, { children: _jsxs(Container, { children: [_jsx(ReviewsSummary, { rating: rating, reviews: reviews, size: "large", t: t }), _jsxs("div", Object.assign({ className: "flex flex-col gap-10 pt-6 pb-10" }, { children: [list.map((_a) => {
+                                    var { id } = _a, review = __rest(_a, ["id"]);
+                                    return (_jsx(ReviewCardFeature, Object.assign({ variant: "full", size: "large", t: t, ref: setRef(id), avatarSrc: review.client_avatar || '', name: `${review.client_first_name} ${review.client_last_name || ''}`, date: review.created_at, rating: review.review_rating, review: review.text_of_review || '' }, review), id));
+                                }), reviews > list.length && _jsx("div", { ref: loadMoreRef })] }))] }) }))] })));
+});
+ReviewListFeature.displayName = 'ReviewListFeature';
+export default ReviewListFeature;

package/dist/esm/lib2/features/ReviewListFeature/index.js

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

package/dist/esm/lib2/features/ScreenDrumPickerFormFeature/ScreenDrumPickerFormFeature.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { memo, useCallback, useState } from 'react';
+import { AppFooter_v2 as AppFooter, AppHeader_v2 as AppHeader, Button_v2 as Button, Container_v2 as Container, DrumListPicker, Typography, TypographyVariantsEnum, } from '../../shared';
+const ScreenDrumPickerFormFeature = ({ title, subtitle, buttonText = 'Save', selections, defaults, onChange, compareBy = 'label', isLoading = false, onTouchStart, onTouchEnd, }) => {
+    const [pickerValue, setPickerValue] = useState(defaults);
+    const handleSave = useCallback(() => {
+        if (!pickerValue)
+            return;
+        onChange(pickerValue);
+    }, [pickerValue]);
+    return (_jsxs(_Fragment, { children: [_jsxs(AppHeader, Object.assign({ toolbarClassName: '!p-0' }, { children: [title && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Title28Semi, className: 'mb-1' }, { children: title }))), subtitle && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text15Regular, opacity: 50 }, { children: subtitle })))] })), _jsx(Container, Object.assign({ isFlexContainer: true }, { children: _jsx("div", Object.assign({ className: 'flex flex-col flex-1 justify-center', onTouchStart: onTouchStart, onTouchEnd: onTouchEnd }, { children: _jsx(DrumListPicker, { selections: selections, defaults: pickerValue, onChange: (value) => setPickerValue(Object.keys(value).reduce((acc, key) => {
+                            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                            // @ts-ignore
+                            acc[key] = value[key].value;
+                            return acc;
+                        }, {})), compareBy: compareBy }) })) })), _jsx(AppFooter, { children: _jsx(Button, Object.assign({ fullWidth: true, type: 'button', size: 'large', onClick: handleSave, isLoading: isLoading }, { children: buttonText })) })] }));
+};
+export default memo(ScreenDrumPickerFormFeature);

package/dist/esm/lib2/features/ScreenDrumPickerFormFeature/index.js

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

package/dist/esm/lib2/features/ScreenInputFormFeature/ScreenInputFormFeature.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { memo, useCallback, useEffect, useRef, useState, } from 'react';
+import styles from './ScreenInputForm.module.css';
+import { AppFooter_v2 as AppFooter, AppHeader_v2 as AppHeader, Button_v2 as Button, Container_v2 as Container, ScreenInput, Typography, TypographyVariantsEnum, } from '../../shared';
+const ScreenInputFormFeature = ({ type = 'text', title, subtitle, subtitleLink, onSubtitleLinkClick, placeholder, buttonText = 'Зберегти', defaultValue, name, onSubmit, isLoading, resetButtonText, resetValue, autoComplete, required, isFocus = false, pattern, isAutoGrow, icon, isKeyboardShown = false, }) => {
+    const [value, setValue] = useState(defaultValue);
+    const inputRef = useRef(null);
+    useEffect(() => {
+        if (!isFocus)
+            return;
+        if (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) {
+            inputRef.current.focus();
+        }
+    }, [inputRef, isFocus]);
+    const handleSubmit = useCallback(() => {
+        if (!value)
+            return;
+        onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(value, name !== null && name !== void 0 ? name : '');
+    }, [value, name, onSubmit]);
+    const handleReset = useCallback(() => {
+        if (!resetValue)
+            return;
+        setValue(resetValue);
+        onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(resetValue, name !== null && name !== void 0 ? name : '');
+    }, [resetValue, onSubmit]);
+    const handleSubtitleLinkClick = useCallback((e) => {
+        e.preventDefault();
+        onSubtitleLinkClick === null || onSubtitleLinkClick === void 0 ? void 0 : onSubtitleLinkClick();
+    }, [onSubtitleLinkClick]);
+    return (_jsxs(_Fragment, { children: [_jsxs(AppHeader, Object.assign({ toolbarClassName: '!p-0' }, { children: [title && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Title28Semi, className: 'mb-1' }, { children: title }))), subtitle && (_jsxs(Typography, Object.assign({ variant: TypographyVariantsEnum.Text15Regular, opacity: 50 }, { children: [subtitle, ' ', subtitleLink && (_jsx("a", Object.assign({ href: '#', className: 'underline cursor-pointer text-sl opacity-50', onClick: handleSubtitleLinkClick }, { children: subtitleLink })))] })))] })), _jsx(Container, Object.assign({ className: styles.container }, { children: _jsx(ScreenInput, { ref: inputRef, type: type, placeholder: placeholder, value: value, name: name, onChange: (e) => setValue(e.target.value), onKeyDown: (e) => e.key === 'Enter' && handleSubmit(), disabled: isLoading, autoComplete: autoComplete, required: required, pattern: pattern, className: styles.input, isAutoGrow: isAutoGrow, icon: icon }) })), _jsxs(AppFooter, Object.assign({ bottomSaveArea: !isKeyboardShown }, { children: [resetButtonText && (_jsx(Button, Object.assign({ fullWidth: true, type: 'button', fill: 'clear', className: '!mb-2', onClick: handleReset }, { children: resetButtonText }))), _jsx(Button, Object.assign({ type: 'button', fullWidth: true, size: 'large', disabled: !value, isLoading: isLoading, onClick: handleSubmit }, { children: buttonText }))] }))] }));
+};
+export default memo(ScreenInputFormFeature);

package/dist/esm/lib2/features/ScreenInputFormFeature/index.js

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

package/dist/esm/lib2/features/ScreenInputUpdateFeature/ScreenInputUpdateFeature.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { IonPage, useIonViewDidEnter } from '@ionic/react';
+import { AppFooter_v2 as AppFooter, AppHeader_v2 as AppHeader, Button_v2 as Button, Container_v2 as Container, ScreenInput, Typography, TypographyVariantsEnum, } from '../../shared/ui';
+/**
+ * @deprecated Use `ScreenInputFormFeature`
+ * */
+const ScreenInputUpdateFeature = ({ children, title, warnLabel, btnLabel, defaultValue, name, type, placeholder, autocomplete, handleSubmit, isLoading, isDisabled, isKeyboardShown, }) => {
+    const inputRef = useRef(null);
+    const [inputValue, setInputValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : '');
+    useEffect(() => {
+        if (defaultValue && inputValue !== defaultValue) {
+            setInputValue(defaultValue);
+        }
+    }, [defaultValue]);
+    useIonViewDidEnter(() => {
+        if (inputRef.current) {
+            inputRef.current.focus();
+        }
+    }, [inputRef]);
+    const onSubmitAction = () => {
+        handleSubmit(inputValue);
+    };
+    return (_jsxs(IonPage, { children: [_jsx(AppHeader, { children: children }), _jsxs(Container, Object.assign({ isFlexContainer: true }, { children: [_jsxs("div", Object.assign({ className: 'flex flex-col gap-1' }, { children: [_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Title28Semi }, { children: title })), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text15Regular }, { children: warnLabel }))] })), _jsx(ScreenInput, { ref: inputRef, type: type, name: name, placeholder: placeholder, value: inputValue, autoComplete: autocomplete, onChange: (e) => setInputValue(e.target.value), onKeyDown: (e) => e.key === 'Enter' && onSubmitAction(), required: true })] })), _jsx(AppFooter, Object.assign({ transparent: true, bottomSaveArea: !isKeyboardShown }, { children: _jsx(Button, Object.assign({ isLoading: isLoading, disabled: isDisabled, fullWidth: true, size: 'large', onClick: () => onSubmitAction() }, { children: btnLabel })) }))] }));
+};
+export default ScreenInputUpdateFeature;

package/dist/esm/lib2/features/ScreenInputUpdateFeature/index.js

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

package/dist/esm/lib2/features/SelectWithSearchFormFeature/SelectWithSearchFormFeature.js

@@ -0,0 +1,46 @@
+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, Fragment as _Fragment } from "react/jsx-runtime";
+import { memo, useCallback, useMemo, useState } from 'react';
+import { AppFooter_v2 as AppFooter, AppHeader_v2 as AppHeader, Button_v2 as Button, Container_v2 as Container, Item, ListBox, ListBoxItem, ListItems, Loading, Typography, TypographyVariantsEnum, } from '../../shared';
+import { CountryOfOriginModal } from '../CountryOfOriginModal';
+const SelectWithSearchFormFeature = (_a) => {
+    var { title, subTitle, items, defaultItems, selectedItems, onChange, isLoading = false, otherText = 'Інша', buttonLabel } = _a, props = __rest(_a, ["title", "subTitle", "items", "defaultItems", "selectedItems", "onChange", "isLoading", "otherText", "buttonLabel"]);
+    const [isSearchModalOpened, setIsSearchModalOpened] = useState(false);
+    const [listItems, setListItems] = useState(defaultItems);
+    const [searchValue, setSearchValue] = useState(null);
+    const [selectedValue, setSelectValue] = useState(selectedItems !== null && selectedItems !== void 0 ? selectedItems : new Set([]));
+    const countries = useMemo(() => items.filter((i) => searchValue ? i.toLowerCase().includes(searchValue.toLowerCase()) : true), [searchValue, items]);
+    const handleChange = useCallback((selected) => {
+        if (selected === 'all')
+            return;
+        if (!selected.size)
+            return;
+        setSelectValue(selected);
+        !buttonLabel && (onChange === null || onChange === void 0 ? void 0 : onChange([...selected.values()][0].toString()));
+    }, [onChange, buttonLabel]);
+    const handleSelect = useCallback((item) => {
+        setListItems((prev) => [item, ...prev.filter((i) => i !== item)]);
+        setSearchValue(null);
+        setIsSearchModalOpened(false);
+        handleChange(new Set([item]));
+    }, [handleChange]);
+    const onButtonClick = useCallback(() => {
+        if (selectedValue === 'all')
+            return;
+        if (!selectedValue.size)
+            return;
+        onChange === null || onChange === void 0 ? void 0 : onChange([...selectedValue.values()][0].toString());
+    }, [onChange, selectedValue]);
+    return (_jsxs(_Fragment, { children: [_jsxs(AppHeader, Object.assign({ toolbarClassName: '!p-0' }, { children: [title && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Title24Semi, className: 'mb-1' }, { children: title }))), subTitle && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text15Regular, opacity: 50 }, { children: subTitle })))] })), _jsxs(Container, { children: [!buttonLabel && _jsx(Loading, { isOpen: isLoading }), _jsx(ListBox, Object.assign({ type: 'radio', selectionMode: "single", selectedKeys: selectedValue, onSelectionChange: handleChange }, { children: listItems.map((i, index) => (_jsx(ListBoxItem, Object.assign({ textValue: i, divider: true }, { children: i }), i))) })), _jsx(ListItems, { children: _jsx(Item, Object.assign({ className: 'p-0', onClick: () => setIsSearchModalOpened(true) }, { children: otherText })) })] }), buttonLabel && (_jsx(AppFooter, { children: _jsx(Button, Object.assign({ fullWidth: true, size: 'large', isLoading: isLoading, onClick: onButtonClick, disabled: selectedValue !== 'all' && !selectedValue.size }, { children: buttonLabel })) })), _jsx(CountryOfOriginModal, Object.assign({ countries: countries, isOpen: isSearchModalOpened, onDidDismiss: () => setIsSearchModalOpened(false), onSearchChange: (e) => { var _a, _b; return setSearchValue((_b = (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : ''); }, onItemClick: handleSelect, searchValue: searchValue !== null && searchValue !== void 0 ? searchValue : '' }, props))] }));
+};
+export default memo(SelectWithSearchFormFeature);

package/dist/esm/lib2/features/SelectWithSearchFormFeature/index.js

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

package/dist/esm/lib2/features/SessionReviewsFeature/ReviewSubscriptionSessionFeature/constants.d.ts

@@ -1,8 +1,9 @@
+import { WithTranslation } from 'react-i18next';
 export type Tag = {
     id: string;
     name: string;
 };
-export declare const TAGS_LIST_1_SUBSCRIPTION: (t?: any) => Tag[];
-export declare const TAGS_LIST_2_SUBSCRIPTION: (t?: any) => Tag[];
-export declare const TAGS_LIST_3_SUBSCRIPTION: (t?: any) => Tag[];
-export declare const TAGS_BY_RATING_SUBSCRIPTION: (t?: any) => Record<number, Tag[]>;
+export declare const TAGS_LIST_1_SUBSCRIPTION: (t?: WithTranslation['t']) => Tag[];
+export declare const TAGS_LIST_2_SUBSCRIPTION: (t?: WithTranslation['t']) => Tag[];
+export declare const TAGS_LIST_3_SUBSCRIPTION: (t?: WithTranslation['t']) => Tag[];
+export declare const TAGS_BY_RATING_SUBSCRIPTION: (t?: WithTranslation['t']) => Record<number, Tag[]>;

package/dist/esm/lib2/features/SessionReviewsFeature/ReviewTrialSessionFeature/constants.d.ts

@@ -1,8 +1,9 @@
+import { WithTranslation } from 'react-i18next';
 export type Tag = {
     id: string;
     name: string;
 };
-export declare const TAGS_LIST_1_TRIAL: (t?: any) => Tag[];
-export declare const TAGS_LIST_2_TRIAL: (t?: any) => Tag[];
-export declare const TAGS_LIST_3_TRIAL: (t?: any) => Tag[];
-export declare const TAGS_BY_RATING_TRIAL: (t?: any) => Record<number, Tag[]>;
+export declare const TAGS_LIST_1_TRIAL: (t?: WithTranslation['t']) => Tag[];
+export declare const TAGS_LIST_2_TRIAL: (t?: WithTranslation['t']) => Tag[];
+export declare const TAGS_LIST_3_TRIAL: (t?: WithTranslation['t']) => Tag[];
+export declare const TAGS_BY_RATING_TRIAL: (t?: WithTranslation['t']) => Record<number, Tag[]>;

package/dist/esm/lib2/features/ShareModalFeature/ShareModalFeature.js

@@ -0,0 +1,50 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from 'react';
+import { IonContent, IonModal, isPlatform } from '@ionic/react';
+import { Share } from '@capacitor/share';
+import { Clipboard } from '@capacitor/clipboard';
+import styles from './ShareModalFeature.module.css';
+import { IconLink, IconShare, Typography } from '../../shared';
+import classNames from 'classnames';
+const ShareModalFeature = ({ isOpen, shareUrl, shareTitle, shareText, onDidDismiss, onLinkCopied, onShare, t, }) => {
+    const [isShare, setIsShare] = useState(false);
+    useEffect(() => {
+        (() => __awaiter(void 0, void 0, void 0, function* () {
+            const { value: isCanShare } = yield Share.canShare();
+            if (isCanShare) {
+                setIsShare(true);
+            }
+        }))();
+    }, [Share]);
+    const handleCopyLink = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
+        yield Clipboard.write({
+            string: shareUrl,
+        });
+        onLinkCopied === null || onLinkCopied === void 0 ? void 0 : onLinkCopied();
+    }), [shareUrl, onLinkCopied]);
+    const handleShareLink = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
+        onShare === null || onShare === void 0 ? void 0 : onShare();
+        const shareData = {
+            title: shareTitle,
+            text: shareText,
+            url: shareUrl,
+        };
+        if (isPlatform('android')) {
+            yield Share.share(Object.assign(Object.assign({}, shareData), { dialogTitle: shareTitle }));
+        }
+        else {
+            yield navigator.share(shareData);
+        }
+    }), [shareUrl, shareText, shareTitle, onShare]);
+    return (_jsxs(IonModal, Object.assign({ isOpen: isOpen, onDidDismiss: onDidDismiss, initialBreakpoint: 1, breakpoints: [0, 1], className: classNames(styles.container, { [styles.withShare]: isShare }) }, { children: [_jsx("div", { className: 'h-6' }), _jsx(IonContent, { children: _jsx("div", Object.assign({ className: 'px-5 pb-6' }, { children: _jsxs("ul", Object.assign({ className: 'flex flex-col divide-y divide-solid divide-borders-divider text-color-black' }, { children: [_jsxs("li", Object.assign({ className: 'flex items-center gap-4 py-5 cursor-pointer', onClick: handleCopyLink }, { children: [_jsx(IconLink, {}), _jsx(Typography, { children: t === null || t === void 0 ? void 0 : t('therapist_details.copy_profile_link') })] })), isShare && (_jsxs("li", Object.assign({ className: 'flex items-center gap-4 py-5 cursor-pointer', onClick: handleShareLink }, { children: [_jsx(IconShare, {}), ' ', _jsx(Typography, { children: t === null || t === void 0 ? void 0 : t('therapist_details.share_profile') })] })))] })) })) })] })));
+};
+export default ShareModalFeature;

package/dist/esm/lib2/features/ShareModalFeature/index.js

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

package/dist/esm/lib2/features/SlotsGrid/SlotsGrid.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useCallback, useMemo } from 'react';
+import SlotsGridItem from './SlotsGridItem';
+import { slotsStyles } from './styles';
+function SlotsGrid({ times = [], selectedKeys, onSelectionChange, classNameSlot, classNameList, isDisabled = false, }) {
+    const isSelected = useCallback((key) => selectedKeys.has(key), [selectedKeys]);
+    const { list } = useMemo(() => {
+        return slotsStyles();
+    }, [isDisabled, classNameList]);
+    return (_jsx("ul", Object.assign({ className: list({ isDisabled, className: classNameList }) }, { children: times.map((time) => (_jsx(SlotsGridItem, { time: time, className: classNameSlot, isDisabled: isDisabled, isSelected: isSelected(time), onSelectionChange: () => !isDisabled && onSelectionChange(time) }, time))) })));
+}
+export default React.memo(SlotsGrid);

package/dist/esm/lib2/features/SlotsGrid/SlotsGrid.stories.js

@@ -0,0 +1,12 @@
+import SlotsGrid from './SlotsGrid';
+const meta = {
+    title: 'V2/Features/SlotsGrid',
+    component: SlotsGrid,
+};
+export default meta;
+export const Default = {
+    args: {
+        times: ['14:00', '15:00', '16:00', '17:00'],
+        selectedKeys: new Set(['14:00']),
+    },
+};

package/dist/esm/lib2/features/SlotsGrid/SlotsGridItem.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { Typography, TypographyVariantsEnum } from '../../shared/ui/Typography';
+import { slotsStyles } from './styles';
+function SlotsGridItem({ isSelected, isDisabled, time, className, onSelectionChange, }) {
+    const { listItem } = slotsStyles({ isSelected, isDisabled });
+    return (_jsx("button", Object.assign({ onClick: onSelectionChange, disabled: isDisabled }, { children: _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text14Regular, className: listItem({ className }) }, { children: time })) })));
+}
+export default React.memo(SlotsGridItem);

package/dist/esm/lib2/features/SlotsGrid/index.js

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

package/dist/esm/lib2/features/SlotsGrid/styles.js

@@ -0,0 +1,39 @@
+import { tv } from 'tailwind-variants';
+export const slotsStyles = tv({
+    slots: {
+        list: 'grid grid-cols-4 gap-x-2 gap-y-3',
+        listItem: 'border border-solid border-typography-typography-primary/10 p-2 rounded-[18px] text-center cursor-pointer',
+    },
+    variants: {
+        isSelected: {
+            true: {},
+        },
+        isDisabled: {
+            true: {},
+        },
+    },
+    compoundSlots: [
+        {
+            slots: ['list'],
+            isDisabled: true,
+            className: '',
+        },
+        {
+            slots: ['listItem'],
+            isSelected: true,
+            className: 'bg-typography-typography-primary !text-color-background-white',
+        },
+        {
+            slots: ['listItem'],
+            isDisabled: true,
+            isSelected: true,
+            className: '!opacity-30 !cursor-default',
+        },
+        {
+            slots: ['listItem'],
+            isDisabled: true,
+            isSelected: false,
+            className: '!cursor-default !text-typography-typography-primary/30 !border-typography-typography-primary/6',
+        },
+    ],
+});

package/dist/esm/lib2/features/SlotsGrid/types.js

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

package/dist/esm/lib2/features/SpecialistAreaListFeature/SpecialistAreaListFeature.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMemo, useRef } from 'react';
+import { TypographyVariantsEnum, Typography, IconCheckboxChecked, ShowMore, ModalSheet, Container_v2 as Container, IconDot, } from '../../index';
+import classNames from 'classnames';
+const SpecialistAreaList = ({ list, title, limit, className, classNameTitle, fillTextWithMatch, t, presentingElement, }) => {
+    const modalRef = useRef(null);
+    const titleContent = (variant) => title && (_jsx(Typography, Object.assign({ variant: variant || TypographyVariantsEnum.Title18Semi, className: classNames('mt-6 mb-2', classNameTitle) }, { children: title })));
+    const listLength = useMemo(() => list.length, [list.length]);
+    const renderList = (limitItems = limit) => {
+        return (_jsx("div", Object.assign({ className: classNames('flex flex-col', className) }, { children: list.slice(0, limitItems).map(({ text, hasMatch }, index) => (
+            // this array is not mutable so we can use index as key
+            _jsxs("div", Object.assign({ className: "flex items-center mt-2 first:mt-0" }, { children: [_jsx("div", Object.assign({ className: classNames('min-w-4 mr-2', {
+                            'text-color-info-green': hasMatch,
+                            'text-color-black': !hasMatch,
+                        }) }, { children: hasMatch ? _jsx(IconCheckboxChecked, { size: 16 }) : _jsx(IconDot, {}) })), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text14Regular, className: classNames({
+                            '!text-color-info-green': hasMatch && fillTextWithMatch,
+                        }) }, { children: text }))] }), index))) })));
+    };
+    const handleOpenModal = () => {
+        var _a;
+        (_a = modalRef.current) === null || _a === void 0 ? void 0 : _a.present();
+    };
+    return (_jsxs(_Fragment, { children: [titleContent(), renderList(), limit && listLength > limit && (_jsx(ShowMore, Object.assign({ className: "mt-3", onClick: handleOpenModal }, { children: t === null || t === void 0 ? void 0 : t('therapist_details.show_more') }))), _jsx(ModalSheet, Object.assign({ ref: modalRef, withCloseButton: true, presentingElement: presentingElement }, { children: _jsxs(Container, { children: [titleContent(TypographyVariantsEnum.Title28Semi), renderList(listLength)] }) }))] }));
+};
+export default SpecialistAreaList;

package/dist/esm/lib2/features/SpecialistAreaListFeature/SpecialistAreaListFeature.stories.js

@@ -0,0 +1,45 @@
+import SpecialistAreaListFeature from './SpecialistAreaListFeature';
+import { mockT } from '../../shared/utils/mock';
+const meta = {
+    title: 'v2/Features/SpecialistAreaListFeature',
+    component: SpecialistAreaListFeature,
+};
+export default meta;
+const t = mockT();
+export const Default = {
+    args: {
+        t,
+        list: [
+            { text: 'Психотерапевт, психолог, + ще 3', hasMatch: true },
+            {
+                text: 'Працює в методиці Когнітивно-поведінкова терапія (КПТ), Психоаналіз, Позитивна психологія та інші',
+                hasMatch: true,
+            },
+        ],
+    },
+};
+export const WithoutMatch = {
+    args: {
+        t,
+        list: [
+            { text: 'Психотерапевт, психолог, + ще 3', hasMatch: false },
+            {
+                text: 'Працює в методиці Когнітивно-поведінкова терапія (КПТ), Психоаналіз, Позитивна психологія та інші',
+                hasMatch: false,
+            },
+        ],
+    },
+};
+export const WithLimit = {
+    args: {
+        t,
+        limit: 3,
+        list: [
+            { text: 'Когнітивно-поведінкова терапія', hasMatch: true },
+            { text: 'Тілесна терапія', hasMatch: false },
+            { text: 'Гештальт-підхід', hasMatch: false },
+            { text: 'Дитячо-батьківські відносини', hasMatch: false },
+            { text: 'Танцювально-рухова терапія', hasMatch: false },
+        ],
+    },
+};

package/dist/esm/lib2/features/SpecialistAreaListFeature/index.js

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

package/dist/esm/lib2/features/SpecialistAreaListFeature/types.js

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

package/dist/esm/lib2/features/SpecialistEducationsFeature/SpecialistEducationsFeature.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMemo, useRef } from 'react';
+import { TypographyVariantsEnum, Typography, ShowMore, ModalSheet, Container_v2 as Container, } from '../../index';
+import classNames from 'classnames';
+import { EducationCard_v2 as EducationCard } from '../../shared/ui/EducationCard_v2';
+const SpecialistEducationsFeature = ({ list, limit, className, classNameTitle, presentingElement, t, }) => {
+    const modalRef = useRef(null);
+    const titleContent = (variant) => (_jsx(Typography, Object.assign({ variant: variant || TypographyVariantsEnum.Title18Semi, className: classNames('mt-6', classNameTitle) }, { children: t === null || t === void 0 ? void 0 : t('therapist_details.education.title') })));
+    const listLength = useMemo(() => list.length, [list.length]);
+    const renderList = (limitItems = limit) => {
+        return (_jsx("div", Object.assign({ className: classNames('flex flex-col', className) }, { children: list.slice(0, limitItems).map((it, index) => (
+            // this array is not mutable so we can use index as key
+            _jsx(EducationCard, { education: it, t: t }, index))) })));
+    };
+    const handleOpenModal = () => {
+        var _a;
+        (_a = modalRef.current) === null || _a === void 0 ? void 0 : _a.present();
+    };
+    return (_jsxs(_Fragment, { children: [titleContent(), renderList(), limit && listLength > limit && (_jsx(ShowMore, Object.assign({ onClick: handleOpenModal }, { children: t === null || t === void 0 ? void 0 : t('therapist_details.show_more') }))), _jsx(ModalSheet, Object.assign({ ref: modalRef, presentingElement: presentingElement, withCloseButton: true }, { children: _jsxs(Container, { children: [titleContent(TypographyVariantsEnum.Title28Semi), renderList(listLength)] }) }))] }));
+};
+export default SpecialistEducationsFeature;

package/dist/esm/lib2/features/SpecialistEducationsFeature/SpecialistEducationsFeature.stories.js

@@ -0,0 +1,38 @@
+import SpecialistEducationsFeature from './SpecialistEducationsFeature';
+import { mockT } from '../../shared/utils/mock';
+const meta = {
+    title: 'v2/Features/SpecialistEducationsFeature',
+    component: SpecialistEducationsFeature,
+};
+export default meta;
+const t = mockT();
+export const Default = {
+    args: {
+        limit: 2,
+        t,
+        list: [
+            {
+                faculty: 'Діти і Війна. Техніки зцілення',
+                institution_name: 'Український інститут когнітивно-поведінкової терапії',
+                year_start: 2022,
+            },
+            {
+                institution_name: 'Програма захисту дітей «Save the Children»',
+                faculty: 'Перша психологічна допомога дітям в надзвичайних ситуаціях',
+                year_start: 2015,
+                year_end: 2022,
+            },
+            {
+                faculty: 'Психологія',
+                institution_name: 'Київський національний економічний університет ім. Вадима Гетьмана',
+                year_start: 2017,
+                year_end: 2020,
+            },
+            {
+                institution_name: 'Український інститут когнітивно-поведінкової терапії',
+                faculty: 'Діти і Війна. Техніки зцілення',
+                year_start: 2022,
+            },
+        ],
+    },
+};

package/dist/esm/lib2/features/SpecialistEducationsFeature/index.js

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

package/dist/esm/lib2/features/SpecialistInfoColumnFeature/SpecialistInfoColumnFeature.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { TypographyVariantsEnum, Typography, IconStarFilled, IconButton, priceNormalize, SupportedCurrency, } from '../../shared';
+import { IconHeart } from '../../shared/assets/icons/IconHeart';
+import { formatByDigits, roundToPrecision } from '../../shared/utils/format';
+const SpecialistInfoColumnFeature = ({ t, rating = 0, reviews = 0, yearsOfExperience, hoursOfPractice, sessionPrice, currentPriceType, isFavourite, onToggleFavourite, sessionDurationMinutes, }) => {
+    return (_jsxs("div", Object.assign({ className: "flex flex-col gap-4" }, { children: [_jsxs("div", Object.assign({ className: "flex justify-between" }, { children: [_jsxs("div", Object.assign({ className: "flex flex-col w-1/2" }, { children: [_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text18Semi }, { children: priceNormalize({
+                                    price: sessionPrice,
+                                    currency: currentPriceType,
+                                    roundingTo: currentPriceType === SupportedCurrency.UAH ? 0 : 2,
+                                }) })), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text13Regular }, { children: t === null || t === void 0 ? void 0 : t('therapist_list_item.session_duration', {
+                                    value: sessionDurationMinutes,
+                                }) }))] })), _jsxs("div", Object.assign({ className: "flex flex-col w-1/2" }, { children: [_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text18Semi }, { children: _jsxs("div", Object.assign({ className: "flex items-center" }, { children: [_jsx(IconStarFilled, { className: "w-5 h-5" }), " ", roundToPrecision(rating)] })) })), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text13Regular }, { children: t === null || t === void 0 ? void 0 : t('therapist_list_item.number_of_reviews', { count: reviews }) }))] })), _jsx(IconButton, { onClick: onToggleFavourite, icon: _jsx(IconHeart, { filled: isFavourite }), className: "flex-shrink-0" })] })), _jsxs("div", Object.assign({ className: "flex justify-between" }, { children: [_jsxs("div", Object.assign({ className: "flex flex-col w-1/2" }, { children: [_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text18Semi }, { children: t === null || t === void 0 ? void 0 : t('therapist_list_item.years_of_experience', {
+                                    count: yearsOfExperience,
+                                }) })), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text13Regular }, { children: t === null || t === void 0 ? void 0 : t('therapist_list_item.years_of_experience_label') }))] })), _jsxs("div", Object.assign({ className: "flex flex-col w-1/2" }, { children: [_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text18Semi }, { children: hoursOfPractice &&
+                                    (t === null || t === void 0 ? void 0 : t('therapist_list_item.hours_of_practice', {
+                                        value: formatByDigits(hoursOfPractice),
+                                        count: hoursOfPractice,
+                                    })) })), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text13Regular }, { children: t === null || t === void 0 ? void 0 : t('therapist_list_item.hours_of_practice_label') }))] })), _jsx("div", { className: "flex-shrink-0 w-4" })] }))] })));
+};
+export default SpecialistInfoColumnFeature;