@tap-payments/os-micro-frontend-shared 0.1.249-test.2 → 0.1.249-test.3

package/build/components/Amount/TotalAmount/Loading.d.ts

@@ -0,0 +1 @@
+export declare const Loading: () => import("react/jsx-runtime").JSX.Element;

package/build/components/Amount/TotalAmount/Loading.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Skeleton from '@mui/material/Skeleton';
+export const Loading = () => {
+    return (_jsx(Skeleton, { sx: {
+            height: 32,
+            width: 80,
+            borderRadius: '4px',
+        }, variant: "rectangular" }));
+};

package/build/components/Amount/TotalAmount/TotalAmount.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { Currency, Item } from '../../../types/index.js';
+export interface TotalAmountProps {
+    totalGrossAmount: number;
+    items: Item[];
+    selectedCurrency: Currency;
+    isAmountIsMissing: boolean;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    onResetAllItems: () => void;
+    onAddFirstItem: (amount: number) => void;
+}
+declare function TotalAmount({ totalGrossAmount, items, selectedCurrency, isAmountIsMissing, isDisabled, isLoading, onResetAllItems, onAddFirstItem, }: Readonly<TotalAmountProps>): import("react/jsx-runtime").JSX.Element;
+declare const _default: import("react").MemoExoticComponent<typeof TotalAmount>;
+export default _default;

package/build/components/Amount/TotalAmount/TotalAmount.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useState, useMemo, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
+import Box from '@mui/material/Box';
+import { removeAllItem, unknownIcon } from '../../../constants/index.js';
+import { useConfirmDialog, DisplayAmount } from '../../index.js';
+import { isSafariBrowser, numberToString, getAmountPlaceholder } from '../../../utils/index.js';
+import { InputStyled, TotalAmountWrapper, Error } from './style';
+import { Loading } from './Loading';
+const isSafari = isSafariBrowser();
+function TotalAmount({ totalGrossAmount, items, selectedCurrency, isAmountIsMissing, isDisabled, isLoading, onResetAllItems, onAddFirstItem, }) {
+    const [editMode, setEditMode] = useState(false);
+    const [amount, setAmount] = useState();
+    const { isConfirmed } = useConfirmDialog();
+    const { t } = useTranslation();
+    const currencyPlaceholder = useMemo(() => getAmountPlaceholder(selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.decimals), [selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.decimals]);
+    useEffect(() => {
+        if (!totalGrossAmount) {
+            setAmount(undefined);
+        }
+    }, [totalGrossAmount]);
+    const removeAllItems = () => {
+        isConfirmed({
+            message: t('removeTotalAmount'),
+            confirmText: _jsx(Box, Object.assign({ sx: (theme) => ({ color: theme.palette.error.light }) }, { children: t('remove') })),
+            cancelText: t('cancel') || 'Cancel',
+        }).then((confirmed) => {
+            if (confirmed) {
+                onResetAllItems();
+                setAmount(undefined);
+            }
+        });
+    };
+    const handleChangeInput = (e) => {
+        if (!e.target.value) {
+            setAmount(undefined);
+            return false;
+        }
+        setAmount(Number(numberToString(Number(e.target.value), selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.decimals)));
+    };
+    const handleBlurInput = (e) => {
+        setEditMode(false);
+        onAddFirstItem(Number(numberToString(Number(e.target.value), selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.decimals)));
+    };
+    const isEditable = totalGrossAmount === 0 || (items.length === 1 && totalGrossAmount === items[0].total);
+    if (isLoading) {
+        return _jsx(Loading, {});
+    }
+    return (_jsxs(Box, Object.assign({ sx: Object.assign({}, (isDisabled && { pointerEvents: 'none', opacity: 0.7 })) }, { children: [editMode ? (_jsx(_Fragment, { children: isEditable ? (_jsx(InputStyled, { value: amount, placeholder: currencyPlaceholder, hideArrows: true, inputProps: { step: '0.01' }, onChange: handleChangeInput, onBlur: handleBlurInput, onKeyDown: (evt) => {
+                        if (isSafari && isNaN(Number(evt.key)) && evt.key !== 'Backspace' && evt.key !== '.') {
+                            evt.preventDefault();
+                        }
+                    }, autoFocus: true })) : (_jsx(DisplayAmount, { sx: { fontSize: '36px', textAlign: 'center' }, amount: totalGrossAmount || 0, selectedCurrency: selectedCurrency, onClick: () => {
+                        setEditMode(true);
+                    } })) })) : (_jsxs(TotalAmountWrapper, { children: [_jsx(DisplayAmount, { sx: { fontSize: '36px', textAlign: 'center' }, selectedCurrency: selectedCurrency, amount: totalGrossAmount || 0, onClick: () => {
+                            if (isEditable)
+                                setEditMode(true);
+                        } }), totalGrossAmount > 0 && _jsx(Box, { component: "img", src: removeAllItem, alt: "r", onClick: removeAllItems })] })), isAmountIsMissing && (_jsxs(Error, { children: [_jsx(Box, { component: "img", src: unknownIcon }), _jsx(Box, { children: t('enterAmount') })] }))] })));
+}
+export default memo(TotalAmount);

package/build/components/Amount/TotalAmount/index.d.ts

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

package/build/components/Amount/TotalAmount/index.js

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

package/build/components/Amount/TotalAmount/style.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export declare const InputStyled: import("@emotion/styled").StyledComponent<Omit<Readonly<import("@mui/material").InputProps & {
+    isError?: boolean | undefined;
+    hideArrows?: boolean | undefined;
+}>, "ref"> & import("react").RefAttributes<HTMLInputElement> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const TotalAmountWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const Error: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/Amount/TotalAmount/style.js

@@ -0,0 +1,26 @@
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+import { InputNumber } from '../../index.js';
+export const InputStyled = styled(InputNumber)(() => ({
+    fontSize: '36px !important',
+    textAlign: 'center',
+    border: 'none',
+    height: 49.5,
+    input: {
+        textAlign: 'center',
+    },
+}));
+export const TotalAmountWrapper = styled(Box)(() => ({
+    display: 'flex',
+    gap: '5px',
+    alignItems: 'center',
+    height: 49.5,
+    maxWidth: '-webkit-fill-available',
+    paddingInline: '24px',
+}));
+export const Error = styled(Box)(({ theme }) => ({
+    fontSize: '10px',
+    color: theme.palette.error.dark,
+    display: 'flex',
+    gap: '4px',
+}));

package/build/components/Amount/index.d.ts

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

package/build/components/Amount/index.js

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

package/build/components/Discount/DiscountDropdown/DiscountDropdown.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { BoxProps } from '@mui/material/Box';
+import { Currency, Discount } from '../../../types/index.js';
+interface DiscountDropdownProps extends BoxProps {
+    discount: Discount;
+    maxDiscount?: number;
+    selectedCurrency: Currency;
+    setDiscount: (value: Discount) => void;
+    setIsOpen: (value: boolean) => void;
+}
+declare function DiscountDropdown({ discount, maxDiscount, setDiscount, setIsOpen, selectedCurrency, ...props }: Readonly<DiscountDropdownProps>): import("react/jsx-runtime").JSX.Element;
+declare const _default: import("react").MemoExoticComponent<typeof DiscountDropdown>;
+export default _default;

package/build/components/Discount/DiscountDropdown/DiscountDropdown.js

@@ -0,0 +1,67 @@
+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 { memo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import Box from '@mui/material/Box';
+import { DISCOUNT_TYPE } from '../../../types/index.js';
+import { checkIcon, rightArrow } from '../../../constants/index.js';
+import { AmountInput } from '../../index.js';
+import { Wrapper, Option, Dropdown } from './style';
+import DiscountRateDropdown from '../DiscountRateDropdown';
+function DiscountDropdown(_a) {
+    var { discount, maxDiscount, setDiscount, setIsOpen, selectedCurrency } = _a, props = __rest(_a, ["discount", "maxDiscount", "setDiscount", "setIsOpen", "selectedCurrency"]);
+    const [isRatDropdownOpen, setIsRatDropdownOpen] = useState(false);
+    const [isFlatDropdownOpen, setIsFlatDropdownOpen] = useState(false);
+    const { t } = useTranslation();
+    const isNoDiscount = discount.type === DISCOUNT_TYPE.NO_DISCOUNT;
+    const isPercent = discount.type === DISCOUNT_TYPE.PERCENT;
+    const handleSelectDiscount = (newDiscount) => {
+        setDiscount(newDiscount);
+    };
+    const onClickNoneDiscount = (e) => {
+        e.stopPropagation();
+        setIsOpen(false);
+        handleSelectDiscount({
+            type: DISCOUNT_TYPE.NO_DISCOUNT,
+            value: 0,
+            percentage: 0,
+            flat: 0,
+        });
+        if (isRatDropdownOpen)
+            setIsRatDropdownOpen(false);
+        if (isFlatDropdownOpen)
+            setIsFlatDropdownOpen(false);
+    };
+    const openRatDropdown = (e) => {
+        e.stopPropagation();
+        setIsRatDropdownOpen(true);
+        if (isFlatDropdownOpen)
+            setIsFlatDropdownOpen(false);
+    };
+    const openFLatDropdown = (e) => {
+        e.stopPropagation();
+        setIsFlatDropdownOpen(true);
+        if (isRatDropdownOpen)
+            setIsRatDropdownOpen(false);
+    };
+    return (_jsxs(Wrapper, Object.assign({ sx: Object.assign(Object.assign({}, props.sx), (isFlatDropdownOpen && { borderBottomRightRadius: 0 })) }, { children: [_jsxs(Option, Object.assign({ className: "option", onClick: onClickNoneDiscount, sx: { justifyContent: 'flex-start' } }, { children: [isNoDiscount ? _jsx("img", { src: checkIcon, alt: "c" }) : _jsx(Box, { width: "12px" }), _jsx("span", { children: t('none') })] })), _jsxs(Option, Object.assign({ className: "option", onClick: openRatDropdown, sx: (theme) => (Object.assign({ justifyContent: 'space-between', position: 'relative' }, (isRatDropdownOpen && { boxShadow: theme.shadows[3] }))) }, { children: [_jsxs(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center', gap: '6px' } }, { children: [isPercent ? _jsx("img", { src: checkIcon, alt: "check" }) : _jsx(Box, { width: "12px" }), _jsx("span", { children: "%" })] })), _jsx("img", { src: rightArrow, alt: "r" }), _jsx(DiscountRateDropdown, { sx: {
+                            position: 'absolute',
+                            left: '100%',
+                            top: 0,
+                            display: isRatDropdownOpen ? 'block' : 'none',
+                            borderTopLeftRadius: 0,
+                        }, setIsOpen: setIsOpen, discount: discount, setDiscount: setDiscount })] })), _jsxs(Option, Object.assign({ className: "option", onClick: openFLatDropdown, sx: (theme) => (Object.assign({ justifyContent: 'space-between', position: 'relative' }, (isFlatDropdownOpen && { boxShadow: theme.shadows[3] }))) }, { children: [_jsxs(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center', gap: '6px' } }, { children: [discount.type === DISCOUNT_TYPE.FLAT ? _jsx("img", { src: checkIcon, alt: "c" }) : _jsx(Box, { width: "12px" }), _jsx("span", { children: t('flat') })] })), _jsx("img", { src: rightArrow, alt: "r" }), _jsx(Dropdown, Object.assign({ isOpen: isFlatDropdownOpen }, { children: _jsx(AmountInput, { selectedCurrency: selectedCurrency, sx: { height: 24, width: '100%', input: { height: 20, width: '100%', textAlign: 'right', flexGrow: 1 } }, amount: discount.type === DISCOUNT_TYPE.FLAT ? Number(discount.flat) : '', setAmount: (value) => {
+                                handleSelectDiscount(Object.assign(Object.assign({}, discount), { type: DISCOUNT_TYPE.FLAT, flat: Number(value) }));
+                            }, maxAmount: maxDiscount }) }))] }))] })));
+}
+export default memo(DiscountDropdown);

package/build/components/Discount/DiscountDropdown/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './DiscountDropdown';
+export * from './DiscountDropdown';

package/build/components/Discount/DiscountDropdown/index.js

@@ -0,0 +1,2 @@
+export { default } from './DiscountDropdown';
+export * from './DiscountDropdown';

package/build/components/Discount/DiscountDropdown/style.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare const Wrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const Option: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const Dropdown: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+    isOpen: boolean;
+}, {}, {}>;

package/build/components/Discount/DiscountDropdown/style.js

@@ -0,0 +1,40 @@
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+export const Wrapper = styled(Box)(({ theme }) => ({
+    width: 106,
+    boxShadow: theme.shadows[16],
+    borderRadius: 4,
+    backgroundColor: theme.palette.common.white,
+    '.option + .option': {
+        borderTop: `1px solid ${theme.palette.divider}`,
+    },
+    zIndex: 3,
+}));
+export const Option = styled(Box)(({ theme }) => ({
+    fontSize: '11px',
+    padding: theme.spacing(1),
+    display: 'flex',
+    justifyContent: 'flex-end',
+    alignItems: 'center',
+    gap: theme.spacing(1),
+    cursor: 'pointer',
+    height: 40,
+    input: {
+        height: 24,
+        width: 47,
+        textAlign: 'right',
+    },
+}));
+export const Dropdown = styled(Box, { shouldForwardProp: (props) => props !== 'isOpen' })(({ isOpen, theme }) => ({
+    display: isOpen ? 'block' : 'none',
+    position: 'absolute',
+    left: '100%',
+    top: 0,
+    background: theme.palette.common.white,
+    padding: '8px',
+    borderTopRightRadius: '4px',
+    borderBottomRightRadius: '4px',
+    overflow: 'hidden',
+    minWidth: 112,
+    height: 39,
+}));

package/build/components/Discount/DiscountRateDropdown/DiscountRateDropdown.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { BoxProps } from '@mui/material/Box';
+import { Discount } from '../../../types/index.js';
+interface DiscountRateDropdownProps extends BoxProps {
+    discount: Discount;
+    setDiscount: (value: Discount) => void;
+    setIsDropdownOpen?: (value: boolean) => void;
+    setIsOpen: (value: boolean) => void;
+}
+declare function DiscountRateDropdown({ discount, setDiscount, setIsDropdownOpen, setIsOpen, ...props }: Readonly<DiscountRateDropdownProps>): import("react/jsx-runtime").JSX.Element;
+declare const _default: import("react").MemoExoticComponent<typeof DiscountRateDropdown>;
+export default _default;

package/build/components/Discount/DiscountRateDropdown/DiscountRateDropdown.js

@@ -0,0 +1,53 @@
+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 { memo } from 'react';
+import { DISCOUNT_TYPE } from '../../../types/index.js';
+import { Input } from '../../index.js';
+import { checkIcon, RATES } from '../../../constants/index.js';
+import { removeAllCharsFromNumber } from '../../../utils/index.js';
+import { Wrapper, Option } from './style';
+function DiscountRateDropdown(_a) {
+    var { discount, setDiscount, setIsDropdownOpen, setIsOpen } = _a, props = __rest(_a, ["discount", "setDiscount", "setIsDropdownOpen", "setIsOpen"]);
+    const { percentage, value } = discount;
+    const isFivePercent = percentage === RATES.FIVE;
+    const isTenPercent = percentage === RATES.TEN;
+    const isFifteenPercent = percentage === RATES.FIFTEEN;
+    const isCustomPercent = percentage !== RATES.FIVE && percentage !== RATES.TEN && percentage !== RATES.FIFTEEN && percentage !== RATES.ZERO && value !== RATES.ZERO;
+    const discountRATES = [
+        { label: '5%', value: RATES.FIVE, selected: isFivePercent },
+        { label: '10%', value: RATES.TEN, selected: isTenPercent },
+        { label: '15%', value: RATES.FIFTEEN, selected: isFifteenPercent },
+    ];
+    const selectRate = (percentageValue) => {
+        setDiscount({ value, percentage: percentageValue, type: DISCOUNT_TYPE.PERCENT });
+        setIsOpen(false);
+    };
+    const handleCustomRate = (e) => {
+        if (Number(e.target.value || !Number(e.target.value)) > 100)
+            return false;
+        setDiscount({
+            value: Number(e.target.value),
+            percentage: Number(removeAllCharsFromNumber(e.target.value)),
+            type: DISCOUNT_TYPE.PERCENT,
+        });
+    };
+    const renderSelectedIcon = (selected) => {
+        return selected ? _jsx("img", { src: checkIcon, alt: "c" }) : _jsx("span", {});
+    };
+    return (_jsxs(Wrapper, Object.assign({ sx: props.sx }, { children: [discountRATES.map((discountI) => (_jsxs(Option, Object.assign({ className: "option", onClick: () => {
+                    selectRate(discountI.value);
+                    if (setIsDropdownOpen)
+                        setIsDropdownOpen(false);
+                } }, { children: [renderSelectedIcon(discountI.selected), _jsx("span", { children: discountI.label })] }), discountI.value))), _jsxs(Option, Object.assign({ className: "option" }, { children: [renderSelectedIcon(isCustomPercent), _jsx(Input, { placeholder: "%", sx: { input: { width: '100% !important' } }, value: isCustomPercent ? percentage : '', onChange: handleCustomRate })] }))] })));
+}
+export default memo(DiscountRateDropdown);

package/build/components/Discount/DiscountRateDropdown/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './DiscountRateDropdown';
+export * from './DiscountRateDropdown';

package/build/components/Discount/DiscountRateDropdown/index.js

@@ -0,0 +1,2 @@
+export { default } from './DiscountRateDropdown';
+export * from './DiscountRateDropdown';

package/build/components/Discount/DiscountRateDropdown/style.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const Wrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const Option: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/Discount/DiscountRateDropdown/style.js

@@ -0,0 +1,33 @@
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+export const Wrapper = styled(Box)(({ theme }) => ({
+    width: 112,
+    boxShadow: theme.shadows[16],
+    borderRadius: 4,
+    backgroundColor: theme.palette.common.white,
+    '.option + .option': {
+        borderTop: `1px solid ${theme.palette.divider}`,
+    },
+    zIndex: 3,
+}));
+export const Option = styled(Box)(({ theme }) => ({
+    fontSize: '11px',
+    paddingInlineStart: theme.spacing(2),
+    paddingInlineEnd: theme.spacing(1),
+    paddingTop: theme.spacing(1.5),
+    paddingBottom: theme.spacing(1.5),
+    display: 'flex',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    gap: theme.spacing(1),
+    cursor: 'pointer',
+    height: 40,
+    input: {
+        height: 24,
+        width: 47,
+        textAlign: 'right',
+    },
+    '&:hover': {
+        boxShadow: theme.shadows[3],
+    },
+}));

package/build/components/Discount/TotalDiscount/TotalDiscount.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { Currency, Discount } from '../../../types/index.js';
+interface TotalDiscountProps {
+    selectedCurrency: Currency;
+    totalGrossAmount: number;
+    totalDiscount: Discount;
+    isDisabled: boolean;
+    onChangeTotalDiscount: (newDiscount: Discount) => void;
+}
+declare function TotalDiscount({ selectedCurrency, totalGrossAmount, totalDiscount, onChangeTotalDiscount, isDisabled }: Readonly<TotalDiscountProps>): import("react/jsx-runtime").JSX.Element;
+declare const _default: import("react").MemoExoticComponent<typeof TotalDiscount>;
+export default _default;

package/build/components/Discount/TotalDiscount/TotalDiscount.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import Box from '@mui/material/Box';
+import Popper from '@mui/material/Popper';
+import { CustomBackdrop, DisplayAmount } from '../../index.js';
+import { actionsIcon, activeActionIcon, discountIcon } from '../../../constants/index.js';
+import { LabelWrapper, Label } from './style';
+import DiscountDropdown from '../DiscountDropdown';
+import { getDiscountValue } from '../utils';
+function TotalDiscount({ selectedCurrency, totalGrossAmount, totalDiscount, onChangeTotalDiscount, isDisabled }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const discountButtonRef = useRef();
+    const { t } = useTranslation();
+    const toggleDropdown = () => {
+        if (!isDisabled)
+            setIsOpen(!isOpen);
+    };
+    const handleDiscount = (newDiscount) => {
+        onChangeTotalDiscount(Object.assign(Object.assign({}, newDiscount), { value: getDiscountValue(totalGrossAmount, newDiscount) }));
+    };
+    const getLabel = () => {
+        if (totalDiscount.value === 0)
+            return t('noDiscount');
+        return (_jsxs(Box, Object.assign({ sx: { display: 'flex', gap: '2px' } }, { children: [_jsx("span", { children: "-" }), _jsx(DisplayAmount, { amount: totalDiscount.value, selectedCurrency: selectedCurrency })] })));
+    };
+    return (_jsxs(LabelWrapper, Object.assign({ isOpen: isOpen, isDisabled: isDisabled, onClick: toggleDropdown, ref: discountButtonRef, sx: Object.assign({}, (isDisabled && { pointerEvents: 'none', opacity: 0.7 })) }, { children: [_jsx("img", { src: discountIcon, alt: "p" }), _jsx(Label, Object.assign({ isDisabled: isDisabled }, { children: getLabel() })), _jsx(Box, { component: "img", src: isOpen ? activeActionIcon : actionsIcon, alt: "a" }), isOpen && _jsx(CustomBackdrop, { onClick: toggleDropdown }), _jsx(Popper, Object.assign({ open: Boolean(isOpen), anchorEl: discountButtonRef.current, placement: "bottom-start" }, { children: _jsx(DiscountDropdown, { sx: { position: 'absolute', top: 8, left: 0, display: isOpen ? 'block' : 'none' }, selectedCurrency: selectedCurrency, discount: totalDiscount, setDiscount: handleDiscount, setIsOpen: setIsOpen, maxDiscount: Number(totalGrossAmount) }) }))] })));
+}
+export default memo(TotalDiscount);

package/build/components/Discount/TotalDiscount/index.d.ts

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

package/build/components/Discount/TotalDiscount/index.js

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

package/build/components/Discount/TotalDiscount/style.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare const LabelWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
+    isDisabled?: boolean | undefined;
+    isOpen?: boolean | undefined;
+}, {}, {}>;
+export declare const Label: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
+    isDisabled: boolean;
+}, {}, {}>;

package/build/components/Discount/TotalDiscount/style.js

@@ -0,0 +1,5 @@
+import { Box, styled } from '@mui/material';
+export const LabelWrapper = styled(Box, {
+    shouldForwardProp: (props) => props !== 'isDisabled' && props !== 'isOpen',
+})(({ theme, isOpen, isDisabled }) => (Object.assign(Object.assign({ display: 'flex', gap: theme.spacing(1), alignItems: 'center', justifyContent: 'space-between', fontSize: '11px', border: `1px solid ${theme.palette.divider}`, height: 32, padding: theme.spacing(1), borderRadius: '4px' }, (isOpen && { borderColor: theme.palette.info.dark, position: 'relative' })), (isDisabled ? { color: theme.palette.grey[700], cursor: 'not-allowed' } : { cursor: 'pointer' }))));
+export const Label = styled(Box, { shouldForwardProp: (props) => props !== 'isDisabled' })(({ theme, isDisabled }) => (Object.assign({ fontSize: '11px', fontWeight: 600, color: theme.palette.text.primary }, (isDisabled && { color: theme.palette.grey[700] }))));

package/build/components/Discount/index.d.ts

@@ -0,0 +1,4 @@
+export * from './utils';
+export { default as DiscountDropdown } from './DiscountDropdown';
+export { default as DiscountRateDropdown } from './DiscountRateDropdown';
+export { default as TotalDiscount } from './TotalDiscount';

package/build/components/Discount/index.js

@@ -0,0 +1,4 @@
+export * from './utils';
+export { default as DiscountDropdown } from './DiscountDropdown';
+export { default as DiscountRateDropdown } from './DiscountRateDropdown';
+export { default as TotalDiscount } from './TotalDiscount';

package/build/components/Discount/utils.d.ts

@@ -0,0 +1,8 @@
+import { Discount, DISCOUNT_TYPE } from '../../types/index.js';
+export declare const getDiscountValue: (amount: number, totalDiscount: Discount) => number;
+export declare const getItemDiscount: (discount: Discount, itemPrice: number, quantity: number) => {
+    value: number;
+    type: DISCOUNT_TYPE;
+    percentage?: number | undefined;
+    flat?: number | undefined;
+};

package/build/components/Discount/utils.js

@@ -0,0 +1,12 @@
+import { DISCOUNT_TYPE } from '../../types/index.js';
+export const getDiscountValue = (amount, totalDiscount) => {
+    let newDiscountValue = 0;
+    if (totalDiscount.type === DISCOUNT_TYPE.FLAT && !!totalDiscount.flat && totalDiscount.flat > 0) {
+        newDiscountValue = totalDiscount.flat;
+    }
+    if (totalDiscount.type === DISCOUNT_TYPE.PERCENT && !!totalDiscount.percentage && totalDiscount.percentage > 0) {
+        newDiscountValue = amount * (totalDiscount.percentage / 100);
+    }
+    return newDiscountValue;
+};
+export const getItemDiscount = (discount, itemPrice, quantity) => (Object.assign(Object.assign({}, discount), { value: getDiscountValue(itemPrice, discount) * quantity }));

package/build/components/FilterDropdown/FilterDropdown.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+interface FilterDropdownProps {
+    children?: React.ReactNode;
+    onConfirm: () => void;
+    onCancel: () => void;
+    isOkayButDisabled?: boolean;
+    isDisabled?: boolean;
+}
+export default function FilterDropdown({ onConfirm, onCancel, isOkayButDisabled, children, isDisabled }: Readonly<FilterDropdownProps>): import("react/jsx-runtime").JSX.Element;
+export {};

package/build/components/FilterDropdown/FilterDropdown.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Box from '@mui/material/Box';
+import { useTranslation } from 'react-i18next';
+import { useState, useEffect } from 'react';
+import { ClickAwayListener } from '@mui/material';
+import { darkFilterIcon } from '../../constants/index.js';
+import { Menu, CustomBackdrop } from '../index.js';
+import { CancelButton, FilterButton, Footer, OkayButton, TitleStyled } from './style';
+export default function FilterDropdown({ onConfirm, onCancel, isOkayButDisabled, children, isDisabled }) {
+    const [anchorEl, setAnchorEl] = useState(null);
+    const open = Boolean(anchorEl);
+    const { t } = useTranslation();
+    // Lock body scroll when filter dropdown is open (Safari fix)
+    useEffect(() => {
+        if (open) {
+            const scrollY = window.scrollY;
+            document.body.style.position = 'fixed';
+            document.body.style.top = `-${scrollY}px`;
+            document.body.style.width = '100%';
+            document.body.style.overflow = 'hidden';
+            return () => {
+                document.body.style.position = '';
+                document.body.style.top = '';
+                document.body.style.width = '';
+                document.body.style.overflow = '';
+                window.scrollTo(0, scrollY);
+            };
+        }
+    }, [open]);
+    const onOpen = (e) => {
+        if (isDisabled)
+            return;
+        if (!open) {
+            setAnchorEl(e.currentTarget);
+            return;
+        }
+        onClose();
+    };
+    const onClose = () => {
+        setAnchorEl(null);
+        onCancel();
+    };
+    const handleCancel = () => {
+        if (!open)
+            return;
+        onCancel();
+        onClose();
+    };
+    const handleConfirm = () => {
+        onConfirm();
+        onClose();
+    };
+    return (_jsx(ClickAwayListener, Object.assign({ onClickAway: handleCancel }, { children: _jsxs(Box, { children: [_jsx(FilterButton, Object.assign({ isActive: open, onClick: onOpen, sx: Object.assign({}, (isDisabled && { pointerEvents: 'none', opacity: 0.5 })) }, { children: _jsx(Box, { component: "img", src: darkFilterIcon, alt: "filter" }) })), _jsxs(Menu, Object.assign({ anchorEl: anchorEl, open: open, sx: { marginTop: '8px', marginBottom: '8px', width: 193 }, placement: "bottom-end" }, { children: [_jsx(TitleStyled, Object.assign({ component: "span" }, { children: t('filterBy') })), children, _jsxs(Footer, { children: [_jsx(CancelButton, Object.assign({ onClick: handleCancel }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ disabled: isOkayButDisabled, onClick: handleConfirm }, { children: t('okay') }))] })] })), open && _jsx(CustomBackdrop, { onClick: onClose })] }) })));
+}

package/build/components/FilterDropdown/components/BrandItem/BrandItem.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { MerchantItemProps } from '../MerchantItem';
+import { BrandProps } from '../../type';
+interface BrandItemProps extends Pick<MerchantItemProps, 'atLeastOneMerchantSelected' | 'merchantsIds'> {
+    brand: BrandProps;
+    isDisabled?: boolean;
+    showSearchInput?: boolean;
+    renderBrandLogo: (logo: string) => React.ReactNode;
+    onChangeMerchant?: (value: string[]) => void;
+}
+export default function BrandItem({ brand, merchantsIds, isDisabled, atLeastOneMerchantSelected, showSearchInput, renderBrandLogo, onChangeMerchant, }: Readonly<BrandItemProps>): import("react/jsx-runtime").JSX.Element;
+export {};