@mindly/ui-components 5.98.17 → 5.98.18

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

@@ -0,0 +1,31 @@
+import CountdownTimerFeature from './CountdownTimerFeature';
+const meta = {
+    title: 'V2/Features/CountdownTimerFeature',
+    component: CountdownTimerFeature,
+    argTypes: {
+        onCompleted: {
+            action: 'onCompleted',
+        },
+    },
+};
+export default meta;
+const translate = {
+    'timer.time_left_hint': 'Залишилось {{minutes}} хв {{seconds}} сек',
+};
+const keys = ['{{minutes}}', '{{seconds}}'];
+export const Default = {
+    args: {
+        t: (key, values) => {
+            let translation = translate[key] || key;
+            keys.forEach((placeholder) => {
+                const value = values[placeholder.slice(2, -2).trim()];
+                if (value !== undefined) {
+                    translation = translation.replace(new RegExp(placeholder, 'g'), String(value));
+                }
+            });
+            return translation;
+        },
+        minutes: 1,
+        seconds: 59,
+    },
+};

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

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

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

@@ -0,0 +1,30 @@
+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 { useCallback, useRef } from 'react';
+import { IonItem, IonList, IonModal } from '@ionic/react';
+import { InputSearch } from '../../shared/ui/InputSearch';
+import { AppHeader_v2, Container_v2, Typography } from '../../shared';
+import styles from './CountryOfOriginModal.module.css';
+import classNames from 'classnames';
+const CountryOfOriginModal = (_a) => {
+    var { onSearchChange, onItemClick, searchValue, countries, searchPlaceholder, t } = _a, props = __rest(_a, ["onSearchChange", "onItemClick", "searchValue", "countries", "searchPlaceholder", "t"]);
+    const modalRef = useRef(null);
+    const onCancelClick = useCallback(() => {
+        var _a;
+        (_a = modalRef.current) === null || _a === void 0 ? void 0 : _a.dismiss();
+    }, []);
+    return (_jsxs(IonModal, Object.assign({}, props, { ref: modalRef, className: styles.countryOfOriginContent }, { children: [_jsx(AppHeader_v2, { children: _jsx(InputSearch, { className: "pt-1.5 pb-3", onCancelClick: onCancelClick, onIonChange: onSearchChange, value: searchValue, placeholder: searchPlaceholder, t: t }) }), _jsx(Container_v2, { children: _jsx(IonList, Object.assign({ lines: "none", mode: "ios" }, { children: countries === null || countries === void 0 ? void 0 : countries.map((country, index) => (_jsx(IonItem, Object.assign({ onClick: () => {
+                            onItemClick && onItemClick(country);
+                        }, className: classNames(`h-[46px] cursor-pointer`, styles.ionListItem) }, { children: _jsx(Typography, Object.assign({ className: "m-0" }, { children: country })) }), `${country}_${index}`))) })) })] })));
+};
+export default CountryOfOriginModal;

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

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

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

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

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

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Typography, TypographyVariantsEnum } from '../../shared';
+const ErrorCardFeature = ({ title, description, errorTitle, stackTrace, }) => {
+    return (_jsxs("div", Object.assign({ className: 'h-full flex flex-col items-center justify-center gap-2' }, { children: [_jsx("div", Object.assign({ className: 'text-[88px]' }, { children: "\uD83D\uDE41" })), title && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Title28Semi, align: 'center' }, { children: title }))), description && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text14Regular, align: 'center', opacity: 50 }, { children: description }))), _jsxs("div", Object.assign({ className: 'w-full max-h-48 overflow-y-auto whitespace-pre-wrap bg-[#f7f7f9] border border-[#e1e1e8] text-[#333] text-sm p-2' }, { children: [errorTitle, _jsx("br", {}), _jsx("br", {}), stackTrace] }))] })));
+};
+export default ErrorCardFeature;

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

@@ -0,0 +1,26 @@
+import ErrorCardFeature from './ErrorCardFeature';
+const meta = {
+    title: 'v2/Features/ErrorCardFeature',
+    component: ErrorCardFeature,
+    argTypes: {},
+};
+export default meta;
+export const Default = {
+    args: {
+        title: 'Упс, щось пішло не так. Перезавантажте додаток, будь ласка',
+        description: 'Будь ласка, зробіть скріншот цього екрану та поділіться ним з нашою службою підтримки. Це допоможе нам виправити цю помилку. Зʼявилась помилка:',
+        errorTitle: 'Error: I crashed!',
+        stackTrace: 'BuggyCounter@https://cdpn.io/gaearon/fullpage/wqvxGa:81:10' +
+            '        ErrorBoundary@https://cdpn.io/gaearon/fullpage/wqvxGa:47:10 div App' +
+            '        BuggyCounter@https://cdpn.io/gaearon/fullpage/wqvxGa:81:10' +
+            '        ErrorBoundary@https://cdpn.io/gaearon/fullpage/wqvxGa:47:10 div App' +
+            '        BuggyCounter@https://cdpn.io/gaearon/fullpage/wqvxGa:81:10' +
+            '        ErrorBoundary@https://cdpn.io/gaearon/fullpage/wqvxGa:47:10 div App' +
+            '        BuggyCounter@https://cdpn.io/gaearon/fullpage/wqvxGa:81:10' +
+            '        ErrorBoundary@https://cdpn.io/gaearon/fullpage/wqvxGa:47:10 div App' +
+            '        BuggyCounter@https://cdpn.io/gaearon/fullpage/wqvxGa:81:10' +
+            '        ErrorBoundary@https://cdpn.io/gaearon/fullpage/wqvxGa:47:10 div App' +
+            '        BuggyCounter@https://cdpn.io/gaearon/fullpage/wqvxGa:81:10' +
+            '        ErrorBoundary@https://cdpn.io/gaearon/fullpage/wqvxGa:47:10 div App',
+    },
+};

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

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

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

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CardModal } from '../CardModal';
+import { AppFooter_v2 as AppFooter } from '../../shared/ui/AppFooter_v2';
+import { Container_v2 as Container } from '../../shared/ui/Container_v2';
+import { Button_v2 as Button } from '../../shared/ui/Button_v2';
+import { Picture } from '../../shared/ui/Picture';
+import { Typography, TypographyVariantsEnum } from '../../shared';
+export function GoogleCalendarModalFeature({ status, isOpen, onSync, isLoading, presentingElement, imageUrl, onDidDismiss, t, }) {
+    return (_jsxs(CardModal, Object.assign({ presentingElement: presentingElement, isOpen: isOpen, onDidDismiss: onDidDismiss }, { children: [_jsxs(Container, Object.assign({ className: "h-full" }, { children: [_jsx("div", Object.assign({ className: "flex justify-center mt-3" }, { children: _jsx(Picture, { width: 335, height: 292, src: {
+                                src: imageUrl,
+                            }, srcType: "image/webp" }) })), _jsxs(Typography, Object.assign({ variant: TypographyVariantsEnum.Title24Semi, className: "mt-6", align: "center" }, { children: [status === 'inactive' && t('google_sync.title'), status === 'access_denied' &&
+                                t('google_calendar.no_permission.title')] })), _jsxs(Typography, Object.assign({ variant: TypographyVariantsEnum.Text14Regular, className: "!text-typography-typography-primary/50 mt-3", align: "center" }, { children: [status === 'inactive' && t('google_sync.description'), status === 'access_denied' &&
+                                t('google_calendar.no_permission.description')] }))] })), _jsx(AppFooter, { children: _jsxs(Button, Object.assign({ size: "large", fullWidth: true, isLoading: isLoading, onClick: onSync }, { children: [status === 'inactive' && t('google_sync.next_button'), status === 'access_denied' &&
+                            t('google_calendar.no_permission.button')] })) })] })));
+}

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

@@ -0,0 +1 @@
+export { GoogleCalendarModalFeature } from './GoogleCalendarModalFeature';

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

@@ -0,0 +1,38 @@
+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 } from "react/jsx-runtime";
+import { memo, useMemo } from 'react';
+import Markdown from 'markdown-to-jsx';
+import classNames from 'classnames';
+import styles from './MarkdownContainer.module.css';
+const MarkdownContainerFeature = ({ children, options, className, }) => {
+    const defaultOptions = useMemo(() => (Object.assign({ overrides: Object.assign({ p: {
+                component: (_a) => {
+                    var { children } = _a, props = __rest(_a, ["children"]);
+                    return (_jsx("p", Object.assign({}, props, { children: children })));
+                },
+            }, ul: {
+                component: (_a) => {
+                    var { children } = _a, props = __rest(_a, ["children"]);
+                    return (_jsx("ul", Object.assign({}, props, { children: children })));
+                },
+                props: { className: 'list-disc list-inside' },
+            }, ol: {
+                component: (_a) => {
+                    var { children } = _a, props = __rest(_a, ["children"]);
+                    return (_jsx("ol", Object.assign({}, props, { children: children })));
+                },
+                props: { className: 'list-decimal list-inside' },
+            } }, options === null || options === void 0 ? void 0 : options.overrides), forceBlock: true, wrapper: ({ children }) => (_jsx("div", Object.assign({ className: classNames('flex flex-col gap-4', styles.markdown, className) }, { children: children }))) }, options)), [options, className]);
+    return children ? (_jsx(Markdown, Object.assign({ options: defaultOptions }, { children: children }))) : null;
+};
+export default memo(MarkdownContainerFeature);

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

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

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingInfoScreenPreviewFeature/OnBoardingInfoScreenPreviewFeature.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import classNames from 'classnames';
+import { MarkdownContainerFeature } from '../../MarkdownContainerFeature';
+import { Picture, Typography, TypographyVariantsEnum, OnBoardingScreenStyleOptions, useElementWidth, } from '../../../shared';
+const OnBoardingInfoScreenPreviewFeature = ({ title, description, image, contentStyle, isPreview, }) => {
+    var _a, _b;
+    const [width, elementRef] = useElementWidth();
+    const textColor = contentStyle === OnBoardingScreenStyleOptions.DARK
+        ? '!text-[#212121]'
+        : '!text-[#FFFFFF]';
+    return (_jsx("div", Object.assign({ ref: elementRef, className: 'flex flex-col gap-4 h-full' }, { children: !!width && (_jsxs("div", Object.assign({ className: classNames('flex flex-col items-center', { 'gap-1': isPreview }, { 'gap-2': !isPreview }) }, { children: [(image === null || image === void 0 ? void 0 : image.file_url) && (_jsx("div", Object.assign({ className: classNames('w-full flex justify-center items-center', { 'mb-3': isPreview }, { 'mb-6': !isPreview }) }, { children: _jsx(Picture, { width: (_a = image === null || image === void 0 ? void 0 : image.width) !== null && _a !== void 0 ? _a : 0, height: (_b = image === null || image === void 0 ? void 0 : image.height) !== null && _b !== void 0 ? _b : 0, src: { src: image.file_url }, srcType: 'image/webp', responsive: true, containerWidth: width }) }))), _jsx(Typography, Object.assign({ variant: isPreview
+                        ? TypographyVariantsEnum.Title14Semi
+                        : TypographyVariantsEnum.Title24Semi, className: textColor }, { children: title })), _jsx(MarkdownContainerFeature, Object.assign({ options: {
+                        overrides: {
+                            p: {
+                                component: Typography,
+                                props: {
+                                    variant: isPreview
+                                        ? TypographyVariantsEnum.Text7Regular
+                                        : TypographyVariantsEnum.Text16Regular,
+                                    className: textColor,
+                                },
+                            },
+                        },
+                    }, className: isPreview ? '!gap-1' : '!gap-4' }, { children: description }))] }))) })));
+};
+export default memo(OnBoardingInfoScreenPreviewFeature);

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingInfoScreenPreviewFeature/index.js

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

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingLoaderScreenPreviewFeature/OnBoardingLoaderScreenPreviewFeature.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useEffect, useMemo, useRef } from 'react';
+import { IconCheckboxChecked, ListBox, ListBoxItem, ProgressBar_v2 as ProgressBar, Typography, TypographyVariantsEnum, } from '../../../shared';
+const OnBoardingLoaderScreenPreviewFeature = ({ title, additionalText, loaderText, answerScreenId, allScreens, selectedAnswers, isPreview, }) => {
+    const containerRef = useRef(null);
+    useEffect(() => {
+        if (!(containerRef === null || containerRef === void 0 ? void 0 : containerRef.current))
+            return;
+        const liElements = containerRef.current.querySelectorAll('.list--flow-items');
+        if (!(liElements === null || liElements === void 0 ? void 0 : liElements.length))
+            return;
+        liElements === null || liElements === void 0 ? void 0 : liElements.forEach((e, index) => {
+            setTimeout(() => {
+                e.classList.replace('opacity-0', 'opacity-1');
+            }, 1500 * index);
+        });
+    }, [containerRef]);
+    const answers = useMemo(() => {
+        if (isPreview)
+            return new Array(5)
+                .fill(0)
+                .map((_, index) => [`{{selected_screen_${index + 1}}}`]);
+        const result = [];
+        if (!answerScreenId || !allScreens || !selectedAnswers)
+            return result;
+        answerScreenId.forEach((screenId) => {
+            const screen = allScreens[screenId];
+            const userAnswers = selectedAnswers[screenId];
+            if (screen && userAnswers && 'options' in screen) {
+                const selectedLabels = userAnswers
+                    .map((answerId) => {
+                    const option = screen.options.find((o) => o.filtrationAnswerId === answerId || o.id === answerId);
+                    return option ? option.label : null;
+                })
+                    .filter((label) => label !== null);
+                if (selectedLabels.length > 0) {
+                    result.push(selectedLabels);
+                }
+            }
+        });
+        return result;
+    }, [selectedAnswers, allScreens, answerScreenId, isPreview]);
+    return (_jsxs("div", Object.assign({ className: 'flex flex-col h-full justify-between', ref: containerRef }, { children: [_jsxs("div", { children: [title && (_jsx(Typography, Object.assign({ variant: isPreview
+                            ? TypographyVariantsEnum.Title12Semi
+                            : TypographyVariantsEnum.Title24Semi, className: isPreview ? 'mb-3' : 'mb-6' }, { children: title }))), _jsx(ListBox, Object.assign({ "aria-label": "MultiSelect", className: `p-0 ${isPreview ? 'mb-4' : 'mb-10'}`, selectionMode: 'none', enableSelection: false }, { children: answers.map((i, index) => (_jsx(ListBoxItem, Object.assign({ className: '!px-0 !py-1' }, { children: _jsxs("div", Object.assign({ className: `list--flow-items transition-opacity duration-[2000ms] flex items-center ${isPreview ? 'gap-1' : 'gap-2'} opacity-0` }, { children: [_jsx(IconCheckboxChecked, { size: isPreview ? 10 : 20, className: 'text-[#02B286]' }), _jsx(Typography, Object.assign({ variant: isPreview
+                                            ? TypographyVariantsEnum.Text8Regular
+                                            : TypographyVariantsEnum.Text16Regular }, { children: i.join(', ') }))] })) }), index))) })), additionalText && (_jsx(Typography, Object.assign({ variant: isPreview
+                            ? TypographyVariantsEnum.Text8Regular
+                            : TypographyVariantsEnum.Text16Regular, className: 'mb-3' }, { children: additionalText })))] }), isPreview && (_jsxs("div", Object.assign({ className: 'px-2 pb-5 flex flex-col items-center gap-2.5' }, { children: [_jsx(ProgressBar, { progress: 0.3, className: 'h-[2px]', variant: 'success' }), loaderText && (_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text8Regular, className: 'mb-3' }, { children: loaderText })))] })))] })));
+};
+export default memo(OnBoardingLoaderScreenPreviewFeature);

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingLoaderScreenPreviewFeature/index.js

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

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingMultiSelectionScreenPreviewFeature/OnBoardingMultiSelectionScreenPreviewFeature.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useCallback, useState } from 'react';
+import classNames from 'classnames';
+import { MarkdownContainerFeature } from '../../MarkdownContainerFeature';
+import { ListBox, ListBoxItem, Typography, TypographyVariantsEnum, } from '../../../shared';
+const OnBoardingMultiSelectionScreenPreviewFeature = ({ options, title, description, isPreview, onChange, defaultValues = [], }) => {
+    const [selectedValue, setSelectValue] = useState(new Set(defaultValues));
+    const onSelectionChange = useCallback((state) => {
+        setSelectValue(state);
+        if (state === 'all')
+            return;
+        onChange === null || onChange === void 0 ? void 0 : onChange(Array.from(state));
+    }, [onChange]);
+    return (_jsxs("div", Object.assign({ className: classNames('h-full flex flex-col', { 'gap-2.5': isPreview }, { 'gap-5': !isPreview }) }, { children: [_jsxs("div", Object.assign({ className: classNames('flex flex-col', { 'gap-0.5': isPreview }, { 'gap-1': !isPreview }) }, { children: [title && (_jsx(Typography, Object.assign({ variant: isPreview
+                            ? TypographyVariantsEnum.Title14Semi
+                            : TypographyVariantsEnum.Title24Semi }, { children: title }))), description && (_jsx(MarkdownContainerFeature, Object.assign({ options: {
+                            overrides: {
+                                p: {
+                                    component: Typography,
+                                    props: {
+                                        variant: isPreview
+                                            ? TypographyVariantsEnum.Text7Regular
+                                            : TypographyVariantsEnum.Text15Regular,
+                                        className: '!text-[#838485]',
+                                    },
+                                },
+                            },
+                        } }, { children: description })))] })), _jsx(ListBox, Object.assign({ "aria-label": "MultiSelect", selectedKeys: selectedValue, onSelectionChange: onSelectionChange, selectionMode: 'multiple', type: 'checkbox', className: 'p-0', selectedIconProps: {
+                    className: isPreview ? '!h-3 !w-3' : '!h-6 !w-6',
+                } }, { children: options.map((item, index) => (_jsx(ListBoxItem, Object.assign({ textValue: item.id, "aria-label": item.label, divider: options.length - 1 !== index, className: isPreview ? '!px-0 !py-2' : '!px-0 !py-4' }, { children: _jsx(Typography, Object.assign({ variant: isPreview
+                            ? TypographyVariantsEnum.Text12Regular
+                            : TypographyVariantsEnum.Text16Regular }, { children: item.label })) }), item.id))) }))] })));
+};
+export default memo(OnBoardingMultiSelectionScreenPreviewFeature);

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingMultiSelectionScreenPreviewFeature/index.js

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

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingProgressFeature/OnBoardingProgressFeature.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import classNames from 'classnames';
+import { AppHeader_v2 as AppHeader, IconArrowLeft, IconButton, ProgressBar_v2 as ProgressBar, OnBoardingScreenStyleOptions, } from '../../../shared';
+import styles from './OnBoardingProgressFeature.module.css';
+const PreviewProgress = ({ children }) => (_jsx("div", Object.assign({ className: 'px-3 h-[28px] shrink-0' }, { children: children })));
+const NormalProgress = ({ children }) => (_jsx(AppHeader, Object.assign({ toolbarClassName: styles.toolbar }, { children: children })));
+const OnBoardingProgressFeature = ({ progress, isPreview, isBackButtonDisabled = true, contentStyle, onBackButtonClick, }) => {
+    const Component = isPreview ? PreviewProgress : NormalProgress;
+    const size = isPreview ? 12 : 24;
+    const progressWidth = isPreview ? 'w-[128px]' : 'w-[200px]';
+    const progressStyle = isPreview
+        ? 'h-[2px] rounded-[2px]'
+        : 'h-[4px] rounded-[4px]';
+    const progressVariant = contentStyle === OnBoardingScreenStyleOptions.LIGHT ? 'light' : 'dark';
+    const backArrowColor = contentStyle === OnBoardingScreenStyleOptions.LIGHT
+        ? 'text-[#FFFFFF]'
+        : 'text-[#212121]';
+    return (_jsx(Component, { children: _jsxs("div", Object.assign({ className: 'relative h-full' }, { children: [!isBackButtonDisabled && (_jsx(IconButton, { className: classNames('absolute left-0 top-1/2 -translate-y-1/2', { '!w-3 !h-3': isPreview }, { '!w-6 !h-6': !isPreview }), icon: _jsx(IconArrowLeft, { size: size, className: backArrowColor }), onClick: onBackButtonClick })), _jsx("div", Object.assign({ className: classNames(progressWidth, 'absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2') }, { children: _jsx(ProgressBar, { progress: progress, className: progressStyle, variant: progressVariant }) }))] })) }));
+};
+export default memo(OnBoardingProgressFeature);

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingProgressFeature/index.js

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

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingReviewsScreenPreviewFeature/OnBoardingReviewsScreenPreviewFeature.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import classNames from 'classnames';
+import { Typography, TypographyVariantsEnum, } from '../../../shared';
+import { ReviewCardFeature, ReviewsCardFeatureSkeleton, } from '../../ReviewCardFeature';
+const OnBoardingReviewsScreenPreviewFeature = ({ title, isPreview, reviews, isLoading, t }) => {
+    return (_jsxs("div", Object.assign({ className: 'h-full flex flex-col' }, { children: [title && (_jsx(Typography, Object.assign({ variant: isPreview
+                    ? TypographyVariantsEnum.Title14Semi
+                    : TypographyVariantsEnum.Title24Semi, className: 'mb-3' }, { children: title }))), _jsx("ul", Object.assign({ className: classNames('flex flex-col', {
+                    'h-[360px] gap-2.5 overscroll-auto overflow-hidden mb-2.5': isPreview,
+                }, { 'gap-5 mb-5': !isPreview }) }, { children: reviews.map((r) => {
+                    var _a, _b;
+                    return (_jsx("li", { children: _jsx(ReviewCardFeature, { name: `${r.client_first_name} ${r.client_last_name}.`, avatarSrc: (_a = r.client_avatar) !== null && _a !== void 0 ? _a : undefined, date: r.created_at, rating: r.review_rating, review: (_b = r.text_of_review) !== null && _b !== void 0 ? _b : '', size: isPreview ? 'small' : 'default', t: t }) }, r.id));
+                }) })), isLoading && _jsx(ReviewsCardFeatureSkeleton, {})] })));
+};
+export default memo(OnBoardingReviewsScreenPreviewFeature);

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingReviewsScreenPreviewFeature/index.js

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

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingSingleSelectionScreenPreviewFeature/OnBoardingSingleSelectionScreenPreviewFeature.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useCallback, useState } from 'react';
+import classNames from 'classnames';
+import { MarkdownContainerFeature } from '../../MarkdownContainerFeature';
+import { ListBox, ListBoxItem, Typography, TypographyVariantsEnum, } from '../../../shared';
+const OnBoardingSingleSelectionScreenPreviewFeature = ({ options, title, description, isPreview, onChange, defaultValues = [], }) => {
+    const [selectedValue, setSelectValue] = useState(new Set(defaultValues));
+    const onSelectionChange = useCallback((state) => {
+        setSelectValue(state);
+        if (state !== 'all' && !state.size)
+            return;
+        onChange === null || onChange === void 0 ? void 0 : onChange(Array.from(state)[0]);
+    }, [onChange]);
+    return (_jsxs("div", Object.assign({ className: classNames('h-full flex flex-col', { 'gap-2.5': isPreview }, { 'gap-5': !isPreview }) }, { children: [_jsxs("div", Object.assign({ className: classNames('flex flex-col', { 'gap-0.5': isPreview }, { 'gap-1': !isPreview }) }, { children: [title && (_jsx(Typography, Object.assign({ variant: isPreview
+                            ? TypographyVariantsEnum.Title14Semi
+                            : TypographyVariantsEnum.Title24Semi }, { children: title }))), description && (_jsx(MarkdownContainerFeature, Object.assign({ options: {
+                            overrides: {
+                                p: {
+                                    component: Typography,
+                                    props: {
+                                        variant: isPreview
+                                            ? TypographyVariantsEnum.Text7Regular
+                                            : TypographyVariantsEnum.Text15Regular,
+                                        className: '!text-[#838485]',
+                                    },
+                                },
+                            },
+                        } }, { children: description })))] })), _jsx(ListBox, Object.assign({ "aria-label": "MultiSelect", selectedKeys: selectedValue, onSelectionChange: onSelectionChange, selectionMode: 'single', type: 'radio', className: 'p-0', selectedIconProps: {
+                    className: isPreview ? '!h-3 !w-3' : '!h-6 !w-6',
+                } }, { children: options.map((item, index) => (_jsx(ListBoxItem, Object.assign({ textValue: item.id, "aria-label": item.label, divider: options.length - 1 !== index, className: isPreview ? '!px-0 !py-2' : '!px-0 !py-4' }, { children: _jsx(Typography, Object.assign({ variant: isPreview
+                            ? TypographyVariantsEnum.Text12Regular
+                            : TypographyVariantsEnum.Text16Regular }, { children: item.label })) }), item.id))) }))] })));
+};
+export default memo(OnBoardingSingleSelectionScreenPreviewFeature);

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingSingleSelectionScreenPreviewFeature/index.js

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

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingStartScreenPreviewFeature/OnBoardingStartScreenPreviewFeature.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import classNames from 'classnames';
+import { MarkdownContainerFeature } from '../../MarkdownContainerFeature';
+import { Picture, Typography, TypographyVariantsEnum, OnBoardingScreenStyleOptions, useElementWidth, } from '../../../shared';
+const OnBoardingStartScreenPreviewFeature = ({ title, description, contentStyle, image, isPreview, }) => {
+    var _a, _b;
+    const [width, elementRef] = useElementWidth();
+    const textColor = contentStyle === OnBoardingScreenStyleOptions.DARK
+        ? '!text-[#212121]'
+        : '!text-[#FFFFFF]';
+    return (_jsx("div", Object.assign({ className: 'flex flex-col h-full justify-center items-center gap-6 px-2', ref: elementRef }, { children: !!width && (_jsxs("div", Object.assign({ className: classNames('flex flex-col items-center', { 'gap-1': isPreview }, { 'gap-2': !isPreview }) }, { children: [(image === null || image === void 0 ? void 0 : image.file_url) && (_jsx("div", Object.assign({ className: classNames('flex justify-center w-full', { 'mb-4': isPreview }, { 'mb-8': !isPreview }) }, { children: _jsx(Picture, { width: (_a = image === null || image === void 0 ? void 0 : image.width) !== null && _a !== void 0 ? _a : 0, height: (_b = image === null || image === void 0 ? void 0 : image.height) !== null && _b !== void 0 ? _b : 0, src: { src: image.file_url }, srcType: 'image/webp', responsive: true, containerWidth: width }) }))), _jsx(Typography, Object.assign({ variant: isPreview
+                        ? TypographyVariantsEnum.Title14Semi
+                        : TypographyVariantsEnum.Title24Semi, className: textColor, align: 'center' }, { children: title })), _jsx(MarkdownContainerFeature, Object.assign({ options: {
+                        overrides: {
+                            p: {
+                                component: Typography,
+                                props: {
+                                    variant: isPreview
+                                        ? TypographyVariantsEnum.Text7Regular
+                                        : TypographyVariantsEnum.Text14Regular,
+                                    className: textColor,
+                                    align: 'center',
+                                },
+                            },
+                        },
+                    }, className: isPreview ? '!gap-1' : '!gap-4' }, { children: description }))] }))) })));
+};
+export default memo(OnBoardingStartScreenPreviewFeature);

package/dist/esm/lib2/features/OnBoardingFlow/OnBoardingStartScreenPreviewFeature/index.js

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

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

@@ -0,0 +1,7 @@
+export * from './OnBoardingStartScreenPreviewFeature';
+export * from './OnBoardingInfoScreenPreviewFeature';
+export * from './OnBoardingMultiSelectionScreenPreviewFeature';
+export * from './OnBoardingSingleSelectionScreenPreviewFeature';
+export * from './OnBoardingLoaderScreenPreviewFeature';
+export * from './OnBoardingProgressFeature';
+export * from './OnBoardingReviewsScreenPreviewFeature';

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

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AppFooter_v2 as AppFooter, Button_v2 as Button, Container_v2 as Container, Typography, TypographyVariantsEnum, } from '../../shared';
+import { CardModal } from '../CardModal';
+export function OutdatedPersonalDataFeature({ isOpen, presentingElement, onApply, onDismiss, subtitle, title, applyText, }) {
+    return (_jsxs(CardModal, Object.assign({ isOpen: isOpen, presentingElement: presentingElement, onDidDismiss: onDismiss }, { children: [_jsxs(Container, { children: [_jsx(Typography, Object.assign({ className: "text-8xl mt-12", align: "center" }, { children: "\u261D\uFE0F" })), _jsx(Typography, Object.assign({ className: "mt-5", variant: TypographyVariantsEnum.Title24Semi, align: "center" }, { children: title })), _jsx(Typography, Object.assign({ className: "mt-2", variant: TypographyVariantsEnum.Text14Regular, align: "center", opacity: 50 }, { children: subtitle }))] }), _jsx(AppFooter, { children: _jsx(Button, Object.assign({ size: "large", fullWidth: true, onClick: onApply }, { children: applyText })) })] })));
+}

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

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

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

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

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

@@ -0,0 +1,23 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useState, useEffect } from 'react';
+import { IconCalendar } from '../../shared';
+import { CalendarPickerFeature } from '../CalendarPickerFeature';
+const PaymentCalendarFeature = ({ t, date, locale, lastDate, dateCallback }) => {
+    const [selectedDate, setSelectedDate] = useState(date);
+    const [isPickerOpen, setIsPickerOpen] = useState(false);
+    useEffect(() => {
+        if (date !== selectedDate) {
+            setSelectedDate(date);
+        }
+    }, [date]);
+    const openPicker = () => {
+        setIsPickerOpen(true);
+    };
+    const selectDate = (date) => {
+        setIsPickerOpen(false);
+        setSelectedDate(date);
+        dateCallback(date);
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(IconCalendar, { onClick: openPicker, className: "cursor-pointer" }), _jsx(CalendarPickerFeature, { t: t, date: date, locale: locale, lastDate: lastDate, mode: 'button', opened: isPickerOpen, dateCallback: selectDate })] }));
+};
+export default memo(PaymentCalendarFeature);

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

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

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

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { Button_v2 as Button, Typography, TypographyVariantsEnum, } from '../../shared';
+export function PushNotificationsIsDisabledBanner({ onOpenNativeSettings, className, title, description, buttonText, }) {
+    return (_jsx("div", Object.assign({ className: classNames('bg-badges-attention-bg px-5 py-4 rounded-[30px]', className) }, { children: _jsxs("div", Object.assign({ className: "flex gap-x-5" }, { children: [_jsx("div", Object.assign({ className: "flex flex-col justify-center" }, { children: _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Title24Semi }, { children: "\uD83D\uDD15" })) })), _jsxs("div", Object.assign({ className: "flex flex-col items-start" }, { children: [_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text15Semi }, { children: title })), _jsx(Typography, Object.assign({ className: "mb-3 !leading-[150%]", variant: TypographyVariantsEnum.Text13Regular }, { children: description })), _jsx(Button, Object.assign({ fill: "outline", size: "small", onClick: onOpenNativeSettings }, { children: buttonText }))] }))] })) })));
+}

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

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

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

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

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

@@ -0,0 +1,19 @@
+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 { IonImg } from '@ionic/react';
+import { AppFooter_v2 as AppFooter, Button_v2 as Button, Container_v2 as Container, Typography, TypographyVariantsEnum, } from '../../shared';
+import { CardModal } from '../CardModal';
+export function PushNotificationsModal(_a) {
+    var { onApplyPermission, isOpen, title, description, image, applyPermissionText } = _a, props = __rest(_a, ["onApplyPermission", "isOpen", "title", "description", "image", "applyPermissionText"]);
+    return (_jsxs(CardModal, Object.assign({ isShowCloseButton: false, isShowHandle: false, isOpen: isOpen }, props, { children: [_jsx(Container, { children: _jsxs("div", Object.assign({ className: "mb-5" }, { children: [_jsx("div", Object.assign({ className: "mt-[88px] w-full height-[296px] flex justify-center" }, { children: _jsx(IonImg, { src: image }) })), _jsx(Typography, Object.assign({ align: "center", variant: TypographyVariantsEnum.Title24Semi, className: "mt-6 !whitespace-pre-wrap" }, { children: title })), _jsx(Typography, Object.assign({ align: "center", variant: TypographyVariantsEnum.Text14Regular, className: "mt-3 !text-typography-typography-primary/50 !whitespace-pre-wrap" }, { children: description }))] })) }), _jsx(AppFooter, { children: _jsx("div", Object.assign({ className: "flex flex-col gay-2" }, { children: _jsx(Button, Object.assign({ size: "large", fullWidth: true, onClick: onApplyPermission }, { children: applyPermissionText })) })) })] })));
+}

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

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

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

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

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

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, memo, useMemo } from 'react';
+import { DateTime } from 'luxon';
+import { Avatar_v2 as Avatar, Rating, Typography, } from '../../shared';
+import { reviewCardStyle } from './styles';
+import { TextWithClampFeature } from '../TextWithClampFeature';
+import classNames from 'classnames';
+const ReviewCardFeature = forwardRef(({ avatarSrc, name, date, rating, review, size = 'default', variant = 'default', reviewTextClamp, onExpandReview, t, className, }, ref) => {
+    const { base, user, rating: ratingStyle, mainTextVariant, dateTextVariant, ratingSize, avatarSize, review: reviewStyle, } = reviewCardStyle({ size, variant });
+    const daysAgo = useMemo(() => {
+        const dateNow = DateTime.now().startOf('day');
+        const dateReview = DateTime.fromSeconds(date).startOf('day');
+        const diff = dateNow.diff(dateReview, 'days').toObject();
+        return diff.days ? Math.ceil(diff.days) : 0;
+    }, [date]);
+    const mainTextStyle = mainTextVariant();
+    const dateTextStyle = dateTextVariant();
+    const ratingSizeValue = ratingSize();
+    const handleExpand = () => {
+        onExpandReview === null || onExpandReview === void 0 ? void 0 : onExpandReview();
+    };
+    return (_jsxs("div", Object.assign({ className: classNames(base(), className), ref: ref }, { children: [_jsxs("div", Object.assign({ className: user() }, { children: [_jsx(Avatar, { src: avatarSrc, variant: avatarSize() }), _jsxs("div", { children: [_jsx(Typography, Object.assign({ variant: mainTextStyle }, { children: name })), _jsx(Typography, Object.assign({ variant: dateTextStyle, opacity: 50 }, { children: daysAgo <= 0
+                                    ? t === null || t === void 0 ? void 0 : t('reviews.today_subtitle')
+                                    : t === null || t === void 0 ? void 0 : t('reviews.days_before_subtitle', {
+                                        count: daysAgo,
+                                    }) }))] })] })), _jsx(Rating, { readonly: true, initialRating: rating, size: ratingSizeValue, className: ratingStyle() }), _jsx("div", Object.assign({ className: reviewStyle() }, { children: _jsx(TextWithClampFeature, { variant: mainTextStyle, countLines: reviewTextClamp, text: review, onExpand: handleExpand, t: t }) }))] })));
+});
+ReviewCardFeature.displayName = 'ReviewCardFeature';
+export default memo(ReviewCardFeature);

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

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import { Skeleton_v2 as Skeleton } from '../../shared';
+import { reviewCardStyle } from './styles';
+const ReviewsCardFeatureSkeletonMemoized = () => {
+    const items = new Array(6).fill(0);
+    const { base, user } = reviewCardStyle({ size: 'default' });
+    return (_jsx("ul", Object.assign({ className: 'flex flex-col gap-5' }, { children: items.map((_, index) => (_jsxs("div", Object.assign({ className: base(), style: {
+                opacity: index === 0 ? 1 : index >= 3 ? 0.4 : 1 - (index + index) / 10,
+            } }, { children: [_jsxs("div", Object.assign({ className: user() }, { children: [_jsx(Skeleton, { className: 'w-10 h-10 rounded-full shrink-0' }), _jsxs("div", Object.assign({ className: 'flex flex-col gap-2 w-full' }, { children: [_jsx(Skeleton, { className: 'w-7/12 h-3.5 rounded-xl' }), _jsx(Skeleton, { className: 'w-5/12 h-2.5 rounded-xl' })] }))] })), _jsx(Skeleton, { className: 'w-7/12 h-3.5 rounded-xl' }), _jsxs("div", Object.assign({ className: 'flex flex-col gap-2 w-full mt-[26px]' }, { children: [_jsx(Skeleton, { className: 'w-full h-2.5 rounded-xl' }), _jsx(Skeleton, { className: 'w-8/12 h-2.5 rounded-xl' })] }))] }), index))) })));
+};
+export const ReviewsCardFeatureSkeleton = memo(ReviewsCardFeatureSkeletonMemoized);

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

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