@tap-payments/os-micro-frontend-shared 0.1.251 → 0.1.253

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/build/components/Discount/DiscountDropdown/DiscountDropdown.d.ts +13 -0
  2. package/build/components/Discount/DiscountDropdown/DiscountDropdown.js +67 -0
  3. package/build/components/Discount/DiscountDropdown/index.d.ts +2 -0
  4. package/build/components/Discount/DiscountDropdown/index.js +2 -0
  5. package/build/components/Discount/DiscountDropdown/style.d.ts +12 -0
  6. package/build/components/Discount/DiscountDropdown/style.js +40 -0
  7. package/build/components/Discount/DiscountRateDropdown/DiscountRateDropdown.d.ts +12 -0
  8. package/build/components/Discount/DiscountRateDropdown/DiscountRateDropdown.js +53 -0
  9. package/build/components/Discount/DiscountRateDropdown/index.d.ts +2 -0
  10. package/build/components/Discount/DiscountRateDropdown/index.js +2 -0
  11. package/build/components/Discount/DiscountRateDropdown/style.d.ts +7 -0
  12. package/build/components/Discount/DiscountRateDropdown/style.js +33 -0
  13. package/build/components/Discount/TotalDiscount/TotalDiscount.d.ts +12 -0
  14. package/build/components/Discount/TotalDiscount/TotalDiscount.js +29 -0
  15. package/build/components/Discount/TotalDiscount/index.d.ts +1 -0
  16. package/build/components/Discount/TotalDiscount/index.js +1 -0
  17. package/build/components/Discount/TotalDiscount/style.d.ts +12 -0
  18. package/build/components/Discount/TotalDiscount/style.js +5 -0
  19. package/build/components/Discount/index.d.ts +4 -0
  20. package/build/components/Discount/index.js +4 -0
  21. package/build/components/Discount/utils.d.ts +8 -0
  22. package/build/components/Discount/utils.js +12 -0
  23. package/build/components/MerchantLogo/MerchantLogo.d.ts +10 -0
  24. package/build/components/MerchantLogo/MerchantLogo.js +17 -0
  25. package/build/components/MerchantLogo/index.d.ts +1 -0
  26. package/build/components/MerchantLogo/index.js +1 -0
  27. package/build/components/MerchantLogo/style.d.ts +5 -0
  28. package/build/components/MerchantLogo/style.js +13 -0
  29. package/build/components/index.d.ts +2 -0
  30. package/build/components/index.js +2 -0
  31. package/build/types/discount.d.ts +5 -0
  32. package/build/types/discount.js +6 -0
  33. package/build/types/index.d.ts +1 -0
  34. package/build/types/index.js +1 -0
  35. package/build/types/invoice.d.ts +1 -6
  36. package/build/types/invoice.js +0 -6
  37. package/package.json +1 -1
@@ -0,0 +1,13 @@
1
+ /// <reference types="react" />
2
+ import { BoxProps } from '@mui/material/Box';
3
+ import { Currency, Discount } from '../../../types/index.js';
4
+ interface DiscountDropdownProps extends BoxProps {
5
+ discount: Discount;
6
+ maxDiscount?: number;
7
+ selectedCurrency: Currency;
8
+ setDiscount: (value: Discount) => void;
9
+ setIsOpen: (value: boolean) => void;
10
+ }
11
+ declare function DiscountDropdown({ discount, maxDiscount, setDiscount, setIsOpen, selectedCurrency, ...props }: Readonly<DiscountDropdownProps>): import("react/jsx-runtime").JSX.Element;
12
+ declare const _default: import("react").MemoExoticComponent<typeof DiscountDropdown>;
13
+ export default _default;
@@ -0,0 +1,67 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
12
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
+ import { memo, useState } from 'react';
14
+ import { useTranslation } from 'react-i18next';
15
+ import Box from '@mui/material/Box';
16
+ import { DISCOUNT_TYPE } from '../../../types/index.js';
17
+ import { checkIcon, rightArrow } from '../../../constants/index.js';
18
+ import { AmountInput } from '../../index.js';
19
+ import { Wrapper, Option, Dropdown } from './style';
20
+ import DiscountRateDropdown from '../DiscountRateDropdown';
21
+ function DiscountDropdown(_a) {
22
+ var { discount, maxDiscount, setDiscount, setIsOpen, selectedCurrency } = _a, props = __rest(_a, ["discount", "maxDiscount", "setDiscount", "setIsOpen", "selectedCurrency"]);
23
+ const [isRatDropdownOpen, setIsRatDropdownOpen] = useState(false);
24
+ const [isFlatDropdownOpen, setIsFlatDropdownOpen] = useState(false);
25
+ const { t } = useTranslation();
26
+ const isNoDiscount = discount.type === DISCOUNT_TYPE.NO_DISCOUNT;
27
+ const isPercent = discount.type === DISCOUNT_TYPE.PERCENT;
28
+ const handleSelectDiscount = (newDiscount) => {
29
+ setDiscount(newDiscount);
30
+ };
31
+ const onClickNoneDiscount = (e) => {
32
+ e.stopPropagation();
33
+ setIsOpen(false);
34
+ handleSelectDiscount({
35
+ type: DISCOUNT_TYPE.NO_DISCOUNT,
36
+ value: 0,
37
+ percentage: 0,
38
+ flat: 0,
39
+ });
40
+ if (isRatDropdownOpen)
41
+ setIsRatDropdownOpen(false);
42
+ if (isFlatDropdownOpen)
43
+ setIsFlatDropdownOpen(false);
44
+ };
45
+ const openRatDropdown = (e) => {
46
+ e.stopPropagation();
47
+ setIsRatDropdownOpen(true);
48
+ if (isFlatDropdownOpen)
49
+ setIsFlatDropdownOpen(false);
50
+ };
51
+ const openFLatDropdown = (e) => {
52
+ e.stopPropagation();
53
+ setIsFlatDropdownOpen(true);
54
+ if (isRatDropdownOpen)
55
+ setIsRatDropdownOpen(false);
56
+ };
57
+ 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: {
58
+ position: 'absolute',
59
+ left: '100%',
60
+ top: 0,
61
+ display: isRatDropdownOpen ? 'block' : 'none',
62
+ borderTopLeftRadius: 0,
63
+ }, 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) => {
64
+ handleSelectDiscount(Object.assign(Object.assign({}, discount), { type: DISCOUNT_TYPE.FLAT, flat: Number(value) }));
65
+ }, maxAmount: maxDiscount }) }))] }))] })));
66
+ }
67
+ export default memo(DiscountDropdown);
@@ -0,0 +1,2 @@
1
+ export { default } from './DiscountDropdown';
2
+ export * from './DiscountDropdown';
@@ -0,0 +1,2 @@
1
+ export { default } from './DiscountDropdown';
2
+ export * from './DiscountDropdown';
@@ -0,0 +1,12 @@
1
+ /// <reference types="react" />
2
+ 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"> & {
3
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
5
+ 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"> & {
6
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
7
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
8
+ 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"> & {
9
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
10
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
11
+ isOpen: boolean;
12
+ }, {}, {}>;
@@ -0,0 +1,40 @@
1
+ import Box from '@mui/material/Box';
2
+ import { styled } from '@mui/material/styles';
3
+ export const Wrapper = styled(Box)(({ theme }) => ({
4
+ width: 106,
5
+ boxShadow: theme.shadows[16],
6
+ borderRadius: 4,
7
+ backgroundColor: theme.palette.common.white,
8
+ '.option + .option': {
9
+ borderTop: `1px solid ${theme.palette.divider}`,
10
+ },
11
+ zIndex: 3,
12
+ }));
13
+ export const Option = styled(Box)(({ theme }) => ({
14
+ fontSize: '11px',
15
+ padding: theme.spacing(1),
16
+ display: 'flex',
17
+ justifyContent: 'flex-end',
18
+ alignItems: 'center',
19
+ gap: theme.spacing(1),
20
+ cursor: 'pointer',
21
+ height: 40,
22
+ input: {
23
+ height: 24,
24
+ width: 47,
25
+ textAlign: 'right',
26
+ },
27
+ }));
28
+ export const Dropdown = styled(Box, { shouldForwardProp: (props) => props !== 'isOpen' })(({ isOpen, theme }) => ({
29
+ display: isOpen ? 'block' : 'none',
30
+ position: 'absolute',
31
+ left: '100%',
32
+ top: 0,
33
+ background: theme.palette.common.white,
34
+ padding: '8px',
35
+ borderTopRightRadius: '4px',
36
+ borderBottomRightRadius: '4px',
37
+ overflow: 'hidden',
38
+ minWidth: 112,
39
+ height: 39,
40
+ }));
@@ -0,0 +1,12 @@
1
+ /// <reference types="react" />
2
+ import { BoxProps } from '@mui/material/Box';
3
+ import { Discount } from '../../../types/index.js';
4
+ interface DiscountRateDropdownProps extends BoxProps {
5
+ discount: Discount;
6
+ setDiscount: (value: Discount) => void;
7
+ setIsDropdownOpen?: (value: boolean) => void;
8
+ setIsOpen: (value: boolean) => void;
9
+ }
10
+ declare function DiscountRateDropdown({ discount, setDiscount, setIsDropdownOpen, setIsOpen, ...props }: Readonly<DiscountRateDropdownProps>): import("react/jsx-runtime").JSX.Element;
11
+ declare const _default: import("react").MemoExoticComponent<typeof DiscountRateDropdown>;
12
+ export default _default;
@@ -0,0 +1,53 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
12
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
+ import { memo } from 'react';
14
+ import { DISCOUNT_TYPE } from '../../../types/index.js';
15
+ import { Input } from '../../index.js';
16
+ import { checkIcon, RATES } from '../../../constants/index.js';
17
+ import { removeAllCharsFromNumber } from '../../../utils/index.js';
18
+ import { Wrapper, Option } from './style';
19
+ function DiscountRateDropdown(_a) {
20
+ var { discount, setDiscount, setIsDropdownOpen, setIsOpen } = _a, props = __rest(_a, ["discount", "setDiscount", "setIsDropdownOpen", "setIsOpen"]);
21
+ const { percentage, value } = discount;
22
+ const isFivePercent = percentage === RATES.FIVE;
23
+ const isTenPercent = percentage === RATES.TEN;
24
+ const isFifteenPercent = percentage === RATES.FIFTEEN;
25
+ const isCustomPercent = percentage !== RATES.FIVE && percentage !== RATES.TEN && percentage !== RATES.FIFTEEN && percentage !== RATES.ZERO && value !== RATES.ZERO;
26
+ const discountRATES = [
27
+ { label: '5%', value: RATES.FIVE, selected: isFivePercent },
28
+ { label: '10%', value: RATES.TEN, selected: isTenPercent },
29
+ { label: '15%', value: RATES.FIFTEEN, selected: isFifteenPercent },
30
+ ];
31
+ const selectRate = (percentageValue) => {
32
+ setDiscount({ value, percentage: percentageValue, type: DISCOUNT_TYPE.PERCENT });
33
+ setIsOpen(false);
34
+ };
35
+ const handleCustomRate = (e) => {
36
+ if (Number(e.target.value || !Number(e.target.value)) > 100)
37
+ return false;
38
+ setDiscount({
39
+ value: Number(e.target.value),
40
+ percentage: Number(removeAllCharsFromNumber(e.target.value)),
41
+ type: DISCOUNT_TYPE.PERCENT,
42
+ });
43
+ };
44
+ const renderSelectedIcon = (selected) => {
45
+ return selected ? _jsx("img", { src: checkIcon, alt: "c" }) : _jsx("span", {});
46
+ };
47
+ return (_jsxs(Wrapper, Object.assign({ sx: props.sx }, { children: [discountRATES.map((discountI) => (_jsxs(Option, Object.assign({ className: "option", onClick: () => {
48
+ selectRate(discountI.value);
49
+ if (setIsDropdownOpen)
50
+ setIsDropdownOpen(false);
51
+ } }, { 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 })] }))] })));
52
+ }
53
+ export default memo(DiscountRateDropdown);
@@ -0,0 +1,2 @@
1
+ export { default } from './DiscountRateDropdown';
2
+ export * from './DiscountRateDropdown';
@@ -0,0 +1,2 @@
1
+ export { default } from './DiscountRateDropdown';
2
+ export * from './DiscountRateDropdown';
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ 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"> & {
3
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
5
+ 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"> & {
6
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
7
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
@@ -0,0 +1,33 @@
1
+ import Box from '@mui/material/Box';
2
+ import { styled } from '@mui/material/styles';
3
+ export const Wrapper = styled(Box)(({ theme }) => ({
4
+ width: 112,
5
+ boxShadow: theme.shadows[16],
6
+ borderRadius: 4,
7
+ backgroundColor: theme.palette.common.white,
8
+ '.option + .option': {
9
+ borderTop: `1px solid ${theme.palette.divider}`,
10
+ },
11
+ zIndex: 3,
12
+ }));
13
+ export const Option = styled(Box)(({ theme }) => ({
14
+ fontSize: '11px',
15
+ paddingInlineStart: theme.spacing(2),
16
+ paddingInlineEnd: theme.spacing(1),
17
+ paddingTop: theme.spacing(1.5),
18
+ paddingBottom: theme.spacing(1.5),
19
+ display: 'flex',
20
+ justifyContent: 'space-between',
21
+ alignItems: 'center',
22
+ gap: theme.spacing(1),
23
+ cursor: 'pointer',
24
+ height: 40,
25
+ input: {
26
+ height: 24,
27
+ width: 47,
28
+ textAlign: 'right',
29
+ },
30
+ '&:hover': {
31
+ boxShadow: theme.shadows[3],
32
+ },
33
+ }));
@@ -0,0 +1,12 @@
1
+ /// <reference types="react" />
2
+ import { Currency, Discount } from '../../../types/index.js';
3
+ interface TotalDiscountProps {
4
+ selectedCurrency: Currency;
5
+ totalGrossAmount: number;
6
+ totalDiscount: Discount;
7
+ isDisabled: boolean;
8
+ onChangeTotalDiscount: (newDiscount: Discount) => void;
9
+ }
10
+ declare function TotalDiscount({ selectedCurrency, totalGrossAmount, totalDiscount, onChangeTotalDiscount, isDisabled }: Readonly<TotalDiscountProps>): import("react/jsx-runtime").JSX.Element;
11
+ declare const _default: import("react").MemoExoticComponent<typeof TotalDiscount>;
12
+ export default _default;
@@ -0,0 +1,29 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { memo, useRef, useState } from 'react';
3
+ import { useTranslation } from 'react-i18next';
4
+ import Box from '@mui/material/Box';
5
+ import Popper from '@mui/material/Popper';
6
+ import { CustomBackdrop, DisplayAmount } from '../../index.js';
7
+ import { actionsIcon, activeActionIcon, discountIcon } from '../../../constants/index.js';
8
+ import { LabelWrapper, Label } from './style';
9
+ import DiscountDropdown from '../DiscountDropdown';
10
+ import { getDiscountValue } from '../utils';
11
+ function TotalDiscount({ selectedCurrency, totalGrossAmount, totalDiscount, onChangeTotalDiscount, isDisabled }) {
12
+ const [isOpen, setIsOpen] = useState(false);
13
+ const discountButtonRef = useRef();
14
+ const { t } = useTranslation();
15
+ const toggleDropdown = () => {
16
+ if (!isDisabled)
17
+ setIsOpen(!isOpen);
18
+ };
19
+ const handleDiscount = (newDiscount) => {
20
+ onChangeTotalDiscount(Object.assign(Object.assign({}, newDiscount), { value: getDiscountValue(totalGrossAmount, newDiscount) }));
21
+ };
22
+ const getLabel = () => {
23
+ if (totalDiscount.value === 0)
24
+ return t('noDiscount');
25
+ return (_jsxs(Box, Object.assign({ sx: { display: 'flex', gap: '2px' } }, { children: [_jsx("span", { children: "-" }), _jsx(DisplayAmount, { amount: totalDiscount.value, selectedCurrency: selectedCurrency })] })));
26
+ };
27
+ 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) }) }))] })));
28
+ }
29
+ export default memo(TotalDiscount);
@@ -0,0 +1 @@
1
+ export { default } from './TotalDiscount';
@@ -0,0 +1 @@
1
+ export { default } from './TotalDiscount';
@@ -0,0 +1,12 @@
1
+ /// <reference types="react" />
2
+ 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"> & {
3
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
5
+ isDisabled?: boolean | undefined;
6
+ isOpen?: boolean | undefined;
7
+ }, {}, {}>;
8
+ 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"> & {
9
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
10
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
11
+ isDisabled: boolean;
12
+ }, {}, {}>;
@@ -0,0 +1,5 @@
1
+ import { Box, styled } from '@mui/material';
2
+ export const LabelWrapper = styled(Box, {
3
+ shouldForwardProp: (props) => props !== 'isDisabled' && props !== 'isOpen',
4
+ })(({ 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' }))));
5
+ 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] }))));
@@ -0,0 +1,4 @@
1
+ export * from './utils';
2
+ export { default as DiscountDropdown } from './DiscountDropdown';
3
+ export { default as DiscountRateDropdown } from './DiscountRateDropdown';
4
+ export { default as TotalDiscount } from './TotalDiscount';
@@ -0,0 +1,4 @@
1
+ export * from './utils';
2
+ export { default as DiscountDropdown } from './DiscountDropdown';
3
+ export { default as DiscountRateDropdown } from './DiscountRateDropdown';
4
+ export { default as TotalDiscount } from './TotalDiscount';
@@ -0,0 +1,8 @@
1
+ import { Discount, DISCOUNT_TYPE } from '../../types/index.js';
2
+ export declare const getDiscountValue: (amount: number, totalDiscount: Discount) => number;
3
+ export declare const getItemDiscount: (discount: Discount, itemPrice: number, quantity: number) => {
4
+ value: number;
5
+ type: DISCOUNT_TYPE;
6
+ percentage?: number | undefined;
7
+ flat?: number | undefined;
8
+ };
@@ -0,0 +1,12 @@
1
+ import { DISCOUNT_TYPE } from '../../types/index.js';
2
+ export const getDiscountValue = (amount, totalDiscount) => {
3
+ let newDiscountValue = 0;
4
+ if (totalDiscount.type === DISCOUNT_TYPE.FLAT && !!totalDiscount.flat && totalDiscount.flat > 0) {
5
+ newDiscountValue = totalDiscount.flat;
6
+ }
7
+ if (totalDiscount.type === DISCOUNT_TYPE.PERCENT && !!totalDiscount.percentage && totalDiscount.percentage > 0) {
8
+ newDiscountValue = amount * (totalDiscount.percentage / 100);
9
+ }
10
+ return newDiscountValue;
11
+ };
12
+ export const getItemDiscount = (discount, itemPrice, quantity) => (Object.assign(Object.assign({}, discount), { value: getDiscountValue(itemPrice, discount) * quantity }));
@@ -0,0 +1,10 @@
1
+ import { SxProps } from '@mui/material';
2
+ export type MerchantLogoProps = {
3
+ data?: Blob;
4
+ width?: number | string;
5
+ height?: number | string;
6
+ isError?: boolean;
7
+ isLoading?: boolean;
8
+ sx?: SxProps;
9
+ };
10
+ export default function MerchantLogo({ data, width, height, ...props }: Readonly<MerchantLogoProps>): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,17 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
12
+ import { jsx as _jsx } from "react/jsx-runtime";
13
+ import { BrandLogoStyled, LogoWrapper } from './style';
14
+ export default function MerchantLogo(_a) {
15
+ var { data, width = 51, height = 51 } = _a, props = __rest(_a, ["data", "width", "height"]);
16
+ return (_jsx(LogoWrapper, Object.assign({ width: width, height: height }, { children: _jsx(BrandLogoStyled, Object.assign({ data: data, width: width, height: height }, props)) })));
17
+ }
@@ -0,0 +1 @@
1
+ export { default as MerchantLogo, MerchantLogoProps } from './MerchantLogo';
@@ -0,0 +1 @@
1
+ export { default as MerchantLogo } from './MerchantLogo';
@@ -0,0 +1,5 @@
1
+ /// <reference types="react" />
2
+ export declare const BrandLogoStyled: import("@emotion/styled").StyledComponent<Readonly<import("../BrandLogo").BrandLogoProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
3
+ export declare const LogoWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
4
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
5
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
@@ -0,0 +1,13 @@
1
+ import Box from '@mui/material/Box';
2
+ import { styled } from '@mui/material/styles';
3
+ import { BrandLogo } from '../BrandLogo';
4
+ export const BrandLogoStyled = styled(BrandLogo)(({ theme }) => ({
5
+ filter: 'drop-shadow(0px 0px 28px rgba(0, 0, 0, 0.09))',
6
+ borderRadius: '50%',
7
+ backgroundColor: theme.palette.common.white,
8
+ }));
9
+ export const LogoWrapper = styled(Box)(() => ({
10
+ display: 'flex',
11
+ alignItems: 'center',
12
+ justifyContent: 'center',
13
+ }));
@@ -125,3 +125,5 @@ export * from './Autocomplete';
125
125
  export * from './BrandLogo';
126
126
  export * from './Amount';
127
127
  export * from './VAT';
128
+ export * from './Discount';
129
+ export * from './MerchantLogo';
@@ -125,3 +125,5 @@ export * from './Autocomplete';
125
125
  export * from './BrandLogo';
126
126
  export * from './Amount';
127
127
  export * from './VAT';
128
+ export * from './Discount';
129
+ export * from './MerchantLogo';
@@ -0,0 +1,5 @@
1
+ export declare enum DISCOUNT_TYPE {
2
+ NO_DISCOUNT = "noDiscount",
3
+ PERCENT = "percent",
4
+ FLAT = "flat"
5
+ }
@@ -0,0 +1,6 @@
1
+ export var DISCOUNT_TYPE;
2
+ (function (DISCOUNT_TYPE) {
3
+ DISCOUNT_TYPE["NO_DISCOUNT"] = "noDiscount";
4
+ DISCOUNT_TYPE["PERCENT"] = "percent";
5
+ DISCOUNT_TYPE["FLAT"] = "flat";
6
+ })(DISCOUNT_TYPE || (DISCOUNT_TYPE = {}));
@@ -26,3 +26,4 @@ export * from './day';
26
26
  export * from './tsUtils';
27
27
  export * from './appEvents';
28
28
  export * from './common';
29
+ export * from './discount';
@@ -26,3 +26,4 @@ export * from './day';
26
26
  export * from './tsUtils';
27
27
  export * from './appEvents';
28
28
  export * from './common';
29
+ export * from './discount';
@@ -1,9 +1,4 @@
1
- import { Country, Currency } from './index.js';
2
- export declare enum DISCOUNT_TYPE {
3
- NO_DISCOUNT = "noDiscount",
4
- PERCENT = "percent",
5
- FLAT = "flat"
6
- }
1
+ import { Country, Currency, DISCOUNT_TYPE } from './index.js';
7
2
  export declare enum RECURRENCE_TYPE {
8
3
  ONE_TIME = "oneTime",
9
4
  DAILY = "daily",
@@ -1,9 +1,3 @@
1
- export var DISCOUNT_TYPE;
2
- (function (DISCOUNT_TYPE) {
3
- DISCOUNT_TYPE["NO_DISCOUNT"] = "noDiscount";
4
- DISCOUNT_TYPE["PERCENT"] = "percent";
5
- DISCOUNT_TYPE["FLAT"] = "flat";
6
- })(DISCOUNT_TYPE || (DISCOUNT_TYPE = {}));
7
1
  export var RECURRENCE_TYPE;
8
2
  (function (RECURRENCE_TYPE) {
9
3
  RECURRENCE_TYPE["ONE_TIME"] = "oneTime";
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tap-payments/os-micro-frontend-shared",
3
3
  "description": "Shared components and utilities for Tap Payments micro frontends",
4
- "version": "0.1.251",
4
+ "version": "0.1.253",
5
5
  "testVersion": 0,
6
6
  "type": "module",
7
7
  "main": "build/index.js",