@mindly/ui-components 8.0.0-alpha.38 → 8.0.0

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

@@ -1,63 +0,0 @@
-import { tv } from 'tailwind-variants';
-export const listItemsStyles = tv({
-    base: '',
-    variants: {
-        withBorders: {
-            true: '',
-        },
-        isDisabled: {
-            true: '',
-        },
-        status: {
-            error: '',
-            attention: '',
-        },
-    },
-    slots: {
-        items: 'lines-none',
-        item: 'px-5',
-        itemInnerContainer: 'flex flex-1 justify-between items-center py-4',
-        itemInnerContentWrapper: 'flex items-center gap-x-4',
-        itemInnerContent: 'flex flex-col',
-    },
-    compoundSlots: [
-        {
-            slots: ['items'],
-            withBorders: true,
-            className: 'rounded-[20px] border border-solid border-[#eeeeee]',
-        },
-        {
-            slots: ['itemInnerContainer'],
-            withBorders: true,
-            className: 'border-b border-b-solid border-b-typography-typography-primary/10',
-        },
-        {
-            slots: ['item'],
-            withBorders: false,
-            className: 'border-b border-b-solid border-b-typography-typography-primary/10',
-        },
-        {
-            slots: ['item'],
-            isDisabled: false,
-            className: 'cursor-pointer',
-        },
-        {
-            slots: ['item'],
-            isDisabled: true,
-            className: 'opacity-30 pointer-events-none cursor-default',
-        },
-        {
-            slots: ['item', 'itemInnerContainer'],
-            status: 'error',
-            className: '!bg-color-info-light-red-not-red !text-color-info-red-not-red',
-        },
-        {
-            slots: ['item', 'itemInnerContainer'],
-            status: 'attention',
-            className: '!bg-badges-attention-bg !text-badges-attention-main',
-        },
-    ],
-    defaultVariants: {
-        withBorders: false,
-    },
-});

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

@@ -1,6 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { TypographyVariantsEnum, Typography, IconCheckboxChecked } from '../../index';
-const ListSimple = ({ list }) => {
-    return (_jsx("div", Object.assign({ className: "flex flex-col" }, { children: list.map((item) => (_jsxs("div", Object.assign({ className: "flex items-center mt-2 first:mt-0" }, { children: [_jsx("div", Object.assign({ className: "min-w-4 mr-2 text-color-info-green" }, { children: _jsx(IconCheckboxChecked, { size: 16 }) })), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text14Regular }, { children: item }))] }), item))) })));
-};
-export default ListSimple;

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

@@ -1,15 +0,0 @@
-import ListSimple from './ListSimple';
-const meta = {
-    title: 'v2/Shared/ListSimple',
-    component: ListSimple,
-};
-export default meta;
-export const Default = {
-    args: {
-        list: [
-            'Психотерапевт, психолог, коуч',
-            'Працює в методиці Когнітивно-поведінкова терапія (КПТ), Психоаналіз, Позитивна психологія та інші',
-            'Допоможе навчитись правильно ставити цілі, розкрити свої сильні сторони',
-        ]
-    },
-};

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

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

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

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import { IonLoading } from '@ionic/react';
-import styles from './Loading.module.css';
-const Loading = ({ isOpen }) => {
-    return (_jsx(IonLoading, { isOpen: isOpen, mode: 'ios', spinner: 'crescent', cssClass: styles.loading }));
-};
-export default React.memo(Loading);

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

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

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

@@ -1,20 +0,0 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import classNames from 'classnames';
-import React, { useMemo } from 'react';
-import { Typography, TypographyVariantsEnum } from '../Typography';
-const MatchProgress = ({ className, percentMatch, children, }) => {
-    const colorBorder = useMemo(() => {
-        if (percentMatch >= 80)
-            return '--color-info-green';
-        return '--color-info-orange';
-    }, [percentMatch]);
-    const colorBg = useMemo(() => {
-        if (percentMatch >= 80)
-            return 'bg-badges-success-main';
-        return 'bg-badges-attention-main';
-    }, [percentMatch]);
-    return (_jsxs("div", Object.assign({ className: classNames('relative inline-flex justify-center items-center rounded-full p-[4px]', className), style: {
-            background: `conic-gradient(rgba(var(${colorBorder})) ${percentMatch}%, #ffffff ${percentMatch}% 100%)`,
-        } }, { children: [percentMatch > 0 && (_jsxs(Typography, Object.assign({ variant: TypographyVariantsEnum.Badge12Semi, className: classNames('py-1 px-2 !text-color-white rounded-2xl absolute top-full -translate-y-1/2 left-1/2 -translate-x-1/2 -mt-1 z-20', colorBg) }, { children: [percentMatch, "%"] }))), _jsx("div", Object.assign({ className: "relative z-10 bg-color-white rounded-full" }, { children: children }))] })));
-};
-export default React.memo(MatchProgress);

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

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

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

@@ -1,29 +0,0 @@
-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 { IonModal } from '@ionic/react';
-import classNames from 'classnames';
-import styles from './ModalSheet.module.css';
-import { Button_v2 as Button } from '../Button_v2';
-import { IconClose } from '../../assets';
-const ModalSheet = React.forwardRef(function ModalSheet(_a, ref) {
-    var { heightInPx, className, initialBreakpoint = 1, breakpoints = [0, 1], withCloseButton, children } = _a, props = __rest(_a, ["heightInPx", "className", "initialBreakpoint", "breakpoints", "withCloseButton", "children"]);
-    const handleDismiss = () => {
-        var _a;
-        if (ref && 'current' in ref) {
-            (_a = ref.current) === null || _a === void 0 ? void 0 : _a.dismiss();
-        }
-    };
-    return (_jsxs(IonModal, Object.assign({}, props, { ref: ref, style: Object.assign({}, (heightInPx && { '--height': `${heightInPx}px` })), initialBreakpoint: initialBreakpoint, breakpoints: breakpoints, className: classNames(styles.root, className) }, { children: [withCloseButton && (_jsx("div", Object.assign({ className: "flex justify-end mt-4" }, { children: _jsx(Button, { fill: "clear", onClick: handleDismiss, customSize: "smaller", icon: _jsx(IconClose, {}) }) }))), children] })));
-});
-export default ModalSheet;

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

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

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

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

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

@@ -1,37 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useCallback, useMemo } from 'react';
-import { useInView } from 'react-intersection-observer';
-import { PictureWrapper } from './Picture.style';
-import { Skeleton_v2 } from '../Skeleton_v2';
-const Picture = ({ width, height, src, srcType, alt, className = '', responsive, containerWidth, }) => {
-    const { ref, inView } = useInView({
-        triggerOnce: true,
-        rootMargin: '200px 0px',
-    });
-    const [isLoading, setIsLoading] = React.useState(true);
-    const onLoad = useCallback(() => {
-        setIsLoading(false);
-    }, []);
-    const aspectRatio = useMemo(() => {
-        return height && width ? height / width : 0;
-    }, [height, width]);
-    const [calculatedWidth, calculatedHeight] = useMemo(() => {
-        if (!containerWidth) {
-            return [width, height];
-        }
-        const newWidth = containerWidth < width ? containerWidth : width;
-        const newHeight = newWidth * aspectRatio;
-        return [newWidth, newHeight];
-    }, [containerWidth, width, height, aspectRatio]);
-    return (_jsxs(PictureWrapper, Object.assign({ ref: ref, style: responsive
-            ? {
-                position: 'relative',
-                width: `${calculatedWidth}px`,
-                height: `${calculatedHeight}px`,
-            }
-            : {
-                width: `${width}px`,
-                height: `${height}px`,
-            }, className: className }, { children: [isLoading && _jsx(Skeleton_v2, { className: 'skeleton' }), inView ? (_jsxs("picture", { children: [(!!(src === null || src === void 0 ? void 0 : src.webp) || !!(src === null || src === void 0 ? void 0 : src.webp2x)) && (_jsx("source", { srcSet: `${(src === null || src === void 0 ? void 0 : src.webp) ? src.webp + ' 1x,' : ''} ${(src === null || src === void 0 ? void 0 : src.webp2x) ? src.webp2x + ' 2x' : ''}`, type: "image/webp" })), _jsx("source", { srcSet: `${(src === null || src === void 0 ? void 0 : src.src) ? src.src + ' 1x,' : ''} ${(src === null || src === void 0 ? void 0 : src.src2x) ? src.src2x + ' 2x' : ''}`, type: srcType }), _jsx("img", { src: src === null || src === void 0 ? void 0 : src.src, loading: 'lazy', alt: alt, onLoad: onLoad })] })) : null] })));
-};
-export default React.memo(Picture);

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

@@ -1,18 +0,0 @@
-import styled from 'styled-components';
-export const PictureWrapper = styled.div `
-  position: relative;
-
-  picture {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-  }
-
-  .skeleton {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    margin: 0;
-    padding: 0;
-  }
-`;

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

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

package/dist/esm/lib2/shared/ui/ProgressBarDashed/ProgressBarDash.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import classNames from 'classnames';
-import { IonProgressBar } from '@ionic/react';
-import { Typography, TypographyVariantsEnum } from '../Typography';
-import { EDGE_VALUE } from './constants';
-import moduleStyles from './ProgressBarDashed.module.css';
-import { progressBarDashedStyles } from './styles';
-export const ProgressBarDash = ({ t, width, value, maxValue, start, end, progress, isLast, isCurrentRange, }) => {
-    const styles = progressBarDashedStyles();
-    const { widthRatio, progressValue, } = useMemo(() => {
-        const getValueRatio = (value) => {
-            let val = (value - (start - 1)) / ((end > EDGE_VALUE ? EDGE_VALUE : end) - (start - 1));
-            if (val > 1)
-                val = 1;
-            if (val < 0)
-                val = 0;
-            return val;
-        };
-        return {
-            widthRatio: getValueRatio(maxValue),
-            progressValue: getValueRatio(progress),
-        };
-    }, [start, end, maxValue, progress]);
-    return (_jsxs("div", Object.assign({ className: 'flex flex-col', style: { width } }, { children: [_jsxs("div", Object.assign({ className: styles.barArea() }, { children: [_jsx(IonProgressBar, { mode: "ios", value: progressValue * (1 / widthRatio), className: `${styles.barPrimary()} ${classNames(moduleStyles.init, moduleStyles.success)}`, style: { width: `${100 * widthRatio}%`, left: 0, zIndex: 2 }, reversed: false }), widthRatio < 1 &&
-                        _jsx(IonProgressBar, { mode: "ios", value: 0, className: `${styles.barDefault()} ${classNames(moduleStyles.init, moduleStyles.default)}`, style: { zIndex: 1 }, reversed: false })] })), _jsxs(Typography, Object.assign({ variant: TypographyVariantsEnum[!isCurrentRange ? 'Text14Regular' : 'Text14Semi'], opacity: !isCurrentRange ? 50 : 100, className: 'text-typography-typography-secondary mb-1' }, { children: [value * 100, "%"] })), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text12Regular, opacity: 50, className: 'text-typography-typography-secondary' }, { children: !isLast
-                    ? t('payments.session_count_range.text', {
-                        from: start,
-                        count: end,
-                    })
-                    : t('payments.session_count_more.text', {
-                        count: start
-                    }) }))] })));
-};

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

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ProgressBarDash } from './ProgressBarDash';
-import { progressBarDashedStyles } from './styles';
-const ProgressBarDashed = ({ t, ranges, maxValue, progress, className, }) => {
-    var _a;
-    const styles = progressBarDashedStyles();
-    const currentRange = (_a = ranges.find((range) => (maxValue !== null && maxValue !== void 0 ? maxValue : 0) <= range.end)) !== null && _a !== void 0 ? _a : {
-        start: 0,
-    };
-    return (_jsx("div", Object.assign({ className: `${styles.progressBar()} ${className}` }, { children: ranges.map((range, index) => (_jsx(ProgressBarDash, { width: `${index === ranges.length - 1 ? 28.13 : 35.25}%`, t: t, maxValue: maxValue, value: range.value, start: range.start, end: range.end, isCurrentRange: !!(currentRange.start === range.start), progress: progress || 0, isLast: index === ranges.length - 1 }, index))) })));
-};
-export default ProgressBarDashed;

package/dist/esm/lib2/shared/ui/ProgressBarDashed/constants.js

@@ -1 +0,0 @@
-export const EDGE_VALUE = 60;

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

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

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

@@ -1,9 +0,0 @@
-import { tv } from 'tailwind-variants';
-export const progressBarDashedStyles = tv({
-    slots: {
-        progressBar: 'w-full flex justify-between items-start',
-        barArea: 'w-full h-2 mb-2 relative',
-        barPrimary: 'w-full h-2 rounded-full absolute bg-color-info-light-mint',
-        barDefault: 'w-full h-2 rounded-full absolute ',
-    },
-});

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

@@ -1,35 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React, { useEffect, useState } from 'react';
-import { IonProgressBar } from '@ionic/react';
-import classNames from 'classnames';
-import styles from './ProgressBar_v2.module.css';
-const ProgressBar_v2 = ({ variant = 'default', progress, className, reversed = false, animationDuration, onProgressEnd, }) => {
-    const [animatedProgress, setAnimatedProgress] = useState(progress);
-    useEffect(() => {
-        if (animatedProgress === 1) {
-            onProgressEnd === null || onProgressEnd === void 0 ? void 0 : onProgressEnd();
-        }
-    }, [animatedProgress, onProgressEnd]);
-    useEffect(() => {
-        if (animationDuration) {
-            setAnimatedProgress(0);
-            const interval = setInterval(() => {
-                setAnimatedProgress((prev) => {
-                    if (prev === 1) {
-                        clearInterval(interval);
-                        return 1;
-                    }
-                    else {
-                        return Number((prev + 0.01).toFixed(2));
-                    }
-                });
-            }, animationDuration);
-            return () => clearInterval(interval); // Очищаем интервал при размонтировании компонента
-        }
-        else {
-            setAnimatedProgress(progress); // Если анимация не включена, используем статичный прогресс
-        }
-    }, [progress, animationDuration]);
-    return (_jsx(IonProgressBar, { mode: "ios", value: animatedProgress, className: classNames(styles.init, styles[variant], className), reversed: reversed }));
-};
-export default React.memo(ProgressBar_v2);

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

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

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

@@ -1,20 +0,0 @@
-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 React from 'react';
-import ReactRating from 'react-rating';
-import { IconStar, IconStarFilled } from '../../assets';
-const Rating = (_a) => {
-    var { size = 40, className = '' } = _a, props = __rest(_a, ["size", "className"]);
-    return (_jsx(ReactRating, Object.assign({ className: `leading-[0] !inline-flex flex-nowrap gap-4 ${className}`, emptySymbol: _jsx(IconStar, { className: 'text-controls-element-unselected', width: size, height: size }), fullSymbol: _jsx(IconStarFilled, { className: 'text-controls-element-selected', width: size, height: size }) }, props)));
-};
-export default React.memo(Rating);

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

@@ -1,13 +0,0 @@
-import Rating from './Rating';
-const meta = {
-    title: 'v2/Shared/Rating',
-    component: Rating,
-};
-export default meta;
-export const Default = {
-    args: {
-        initialRating: 0,
-        readonly: false,
-        size: 40,
-    },
-};

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

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

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

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

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

@@ -1,36 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState, useEffect, useRef } from 'react';
-import { useRatingContext } from '../../hooks';
-const RatingCircle = () => {
-    const overlapTimer = useRef(null);
-    const [overlapAnimation, setOverlapAnimation] = useState(false);
-    const [overlapValue, setOverlapValue] = useState(0);
-    const { progress, animationSeconds = 1, isRatingDisabled, circleSize, radius, circumference, dash, overlap, viewBox, strokeWidth, isColorless, styles, isReverse, isWithOverlap, isWithAnimation, } = useRatingContext();
-    useEffect(() => {
-        setOverlapAnimation(false);
-        setOverlapValue(0);
-        overlapTimer.current = setTimeout(() => {
-            setOverlapAnimation(true);
-            clearTimeout(overlapTimer.current);
-            overlapTimer.current = null;
-        }, isWithAnimation ? animationSeconds * 1000 : 0);
-    }, [progress]);
-    useEffect(() => {
-        if (overlap && overlapAnimation) {
-            setOverlapValue(overlap);
-        }
-    }, [overlapAnimation, overlap]);
-    return (_jsx("div", Object.assign({ style: { width: circleSize, height: circleSize }, className: 'relative' }, { children: _jsxs("svg", Object.assign({ width: circleSize, height: circleSize, viewBox: viewBox }, { children: [_jsx("circle", { fill: "none", className: styles.defaultStroke(), cx: circleSize / 2, cy: circleSize / 2, r: radius, strokeWidth: `${strokeWidth}px` }), !isRatingDisabled &&
-                    _jsxs(_Fragment, { children: [_jsx("circle", { fill: "none", className: styles.coloredStroke(), cx: circleSize / 2, cy: circleSize / 2, r: radius, strokeWidth: `${strokeWidth}px`, transform: `rotate(-90 ${circleSize / 2} ${circleSize / 2})`, strokeDasharray: `${dash},${circumference - dash}`, strokeLinecap: "round", style: { transition: isWithAnimation ? `all ${animationSeconds !== null && animationSeconds !== void 0 ? animationSeconds : 1}s` : 'none' } }), isWithOverlap && !isReverse &&
-                                _jsxs(_Fragment, { children: [_jsx("defs", { children: _jsxs("linearGradient", Object.assign({ id: "gradient", x1: "0%", y1: "0%", x2: "100%", y2: "0%" }, { children: [_jsx("stop", { offset: "0%", style: {
-                                                            'stopOpacity': 1,
-                                                            'stopColor': !isColorless ? 'rgb(34, 89, 42)' : 'rgb(61, 61, 62)',
-                                                        } }), _jsx("stop", { offset: "100%", style: {
-                                                            'stopOpacity': 0,
-                                                            'stopColor': !isColorless ? 'rgb(50, 131, 62)' : 'rgb(131, 132, 133)',
-                                                        } })] })) }), _jsx("circle", { fill: "none", cx: circleSize / 2, cy: circleSize / 2, r: radius, stroke: `${overlapValue > 0 ? 'url(#gradient)' : 'none'}`, strokeWidth: `${strokeWidth}px`, transform: `rotate(270 ${circleSize / 2} ${circleSize / 2})`, strokeDasharray: `${overlapValue}, ${circumference}`, strokeLinecap: "round", style: { transition: isWithAnimation
-                                                    ? `all ${animationSeconds >= 2 ? (animationSeconds !== null && animationSeconds !== void 0 ? animationSeconds : 1) / 2 : 1}s`
-                                                    : 'none'
-                                            } })] })] })] })) })));
-};
-export default RatingCircle;

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

@@ -1,48 +0,0 @@
-import RatingCircleWrapper from './RatingCircleWrapper';
-const meta = {
-    title: 'v2/Shared/RatingCircle',
-    component: RatingCircleWrapper,
-};
-export default meta;
-export const Default = {
-    args: {
-        t: (key, { value }) => {
-            const translations = {
-                'legend.more_than': 'Більше {{value}}',
-                'legend.less_than': 'Менше {{value}}',
-            };
-            return translations[key];
-        },
-        animationSeconds: 1,
-        isReverse: false,
-        isRatingDisabled: false,
-        isColorless: false,
-        isShowLegend: true,
-        isShowBreakPoints: true,
-        isZeroTransparent: true,
-        isWithOverlap: true,
-        isWithAnimation: true,
-        progress: 12.00,
-        decimal: 2,
-        size: 'L',
-        content: {
-            text: 'some long long long long long long long loooooooooong text',
-            isPercentage: true,
-            showIcon: false,
-        },
-        ranges: [
-            {
-                min: 0,
-                max: 19.99,
-            },
-            {
-                min: 20,
-                max: 40,
-            },
-            {
-                min: 40.01,
-                max: 60,
-            },
-        ],
-    },
-};

package/dist/esm/lib2/shared/ui/RatingCircle/RatingCircleBreakpoints.js

@@ -1,17 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { useBreakPointsPosition, useRatingContext } from '../../hooks';
-import { CircleBreakpointIcon } from './RatingCircleIcons';
-const RatingCircleBreakpoints = () => {
-    const { size, circleSize, breakPoints, isShowBreakPoints, strokeWidth, maxValue, styles, } = useRatingContext();
-    const breakPointsPosition = useBreakPointsPosition({
-        radius: circleSize / 2,
-        strokeWidth,
-        breakPoints,
-        maxValue,
-    });
-    if (size !== 'L' || !isShowBreakPoints || !(breakPoints === null || breakPoints === void 0 ? void 0 : breakPoints.length)) {
-        return null;
-    }
-    return (_jsx(_Fragment, { children: breakPointsPosition.map((position, index) => (_jsx("div", { children: CircleBreakpointIcon(Object.assign({ className: styles.breakPoint({ className: 'absolute' }), index }, position)) }, index))) }));
-};
-export default RatingCircleBreakpoints;

package/dist/esm/lib2/shared/ui/RatingCircle/RatingCircleContent.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useRangeIndex, useRatingContext, useRatingCircleContentValue } from '../../hooks';
-import { CircleRatingIcon } from './RatingCircleIcons';
-import { Typography, TypographyVariantsEnum } from '../Typography';
-const RatingCircleContent = () => {
-    const { size, decimal, isReverse, content, maxValue, progress, ranges, styles, } = useRatingContext();
-    const contentValue = useRatingCircleContentValue({ progress, isPercentage: content === null || content === void 0 ? void 0 : content.isPercentage, decimal });
-    const index = useRangeIndex({ progress, maxValue, ranges, isReverse });
-    if (!content) {
-        return null;
-    }
-    if (!(content === null || content === void 0 ? void 0 : content.showIcon) && size !== 'S') {
-        return (_jsxs("div", Object.assign({ className: styles.contentWrapper() }, { children: [_jsx(Typography, Object.assign({ variant: TypographyVariantsEnum[size === 'L' ? 'Title48Semi' : 'Text13Semi'], className: styles.contentColor({
-                        className: "capitalize text-center",
-                    }) }, { children: contentValue })), !!(content === null || content === void 0 ? void 0 : content.text) &&
-                    _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum[size === 'L' ? 'Text13Regular' : 'Text12Regular'], className: "text-center w-3/5" }, { children: content === null || content === void 0 ? void 0 : content.text }))] })));
-    }
-    else if (content === null || content === void 0 ? void 0 : content.showIcon) {
-        return (_jsx("div", Object.assign({ className: styles.contentWrapper() }, { children: CircleRatingIcon({ index, className: styles.icon() }) })));
-    }
-    else {
-        return null;
-    }
-};
-export default RatingCircleContent;

package/dist/esm/lib2/shared/ui/RatingCircle/RatingCircleIcons.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { BREAKPOINT_ICON_SIZE } from '../../hooks';
-import { IconClose, IconCancelRounded, IconWarning, IconCheck, IconCapFilled } from '../../assets';
-export function CircleRatingIcon({ index, className, }) {
-    const ICONS = {
-        0: _jsx(IconClose, { className: className, color: "currentColor" }),
-        1: _jsx(IconWarning, { className: className, color: "currentColor" }),
-        2: _jsx(IconCheck, { className: className, color: "currentColor" }),
-    };
-    return ICONS[index];
-}
-export function CircleBreakpointIcon({ index, top, left, className, }) {
-    const ICONS = {
-        0: _jsx(IconCancelRounded, { size: BREAKPOINT_ICON_SIZE, className: className, color: "currentColor", style: { top, left } }),
-        1: _jsx(IconCapFilled, { size: BREAKPOINT_ICON_SIZE, className: className, color: "currentColor", style: { top, left } }),
-    };
-    return ICONS[index];
-}

package/dist/esm/lib2/shared/ui/RatingCircle/RatingCircleLegend.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Typography, TypographyVariantsEnum } from '../Typography';
-import { useRatingContext } from '../../hooks';
-const RatingCircleLegend = () => {
-    const { size, styles, legend, isShowLegend } = useRatingContext();
-    if (size !== 'L' || !isShowLegend || !(legend === null || legend === void 0 ? void 0 : legend.length)) {
-        return null;
-    }
-    return (_jsx("div", Object.assign({ className: "flex justify-between flex-row-reverse" }, { children: legend.map((item, index) => (_jsxs("div", Object.assign({ className: "flex flex-col items-center mt-6 w-1/3" }, { children: [_jsx("div", { className: styles.legendItem({
-                        color: index,
-                        className: 'w-4 h-4 rounded-full items-center mb-2',
-                    }) }), _jsx(Typography, Object.assign({ variant: TypographyVariantsEnum.Text13Regular, className: "text-center" }, { children: item }))] }), index))) })));
-};
-export default RatingCircleLegend;

package/dist/esm/lib2/shared/ui/RatingCircle/RatingCircleWrapper.js

@@ -1,26 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CircleRatingProvider } from '../../providers';
-import RatingCircle from './RatingCircle';
-import RatingCircleContent from './RatingCircleContent';
-import RatingCircleLegend from './RatingCircleLegend';
-import RatingCircleBreakpoints from './RatingCircleBreakpoints';
-import { SIZES } from '../../hooks';
-const RatingCircleWrapper = ({ size = 'S', progress = 0, ranges = [], content = {}, isColorless = false, isShowLegend = false, isShowBreakPoints = false, isRatingDisabled = false, isReverse = false, isZeroTransparent = false, isWithOverlap = false, isWithAnimation = false, className, decimal, animationSeconds = 1, t, }) => {
-    return (_jsx(CircleRatingProvider, Object.assign({ t: t, data: {
-            size,
-            progress,
-            ranges,
-            decimal,
-            content,
-            isColorless,
-            isRatingDisabled,
-            isReverse,
-            isShowLegend,
-            animationSeconds,
-            isShowBreakPoints,
-            isZeroTransparent,
-            isWithOverlap,
-            isWithAnimation,
-        } }, { children: _jsxs("div", Object.assign({ className: `${className || ''}` }, { children: [_jsxs("div", Object.assign({ style: { width: SIZES[size], height: SIZES[size] }, className: 'relative m-auto' }, { children: [_jsx(RatingCircle, {}), _jsx(RatingCircleBreakpoints, {}), _jsx(RatingCircleContent, {})] })), _jsx("div", Object.assign({ className: 'w-full relative' }, { children: _jsx(RatingCircleLegend, {}) }))] })) })));
-};
-export default RatingCircleWrapper;

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

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