@tap-payments/os-micro-frontend-shared 0.1.287 → 0.1.288

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

@@ -9,6 +9,7 @@ import { InputStyled, TotalAmountWrapper, Error } from './style';
 import { Loading } from './Loading';
 const isSafari = isSafariBrowser();
 function TotalAmount({ totalGrossAmount, items, selectedCurrency, isAmountIsMissing, isDisabled, isLoading, onResetAllItems, onAddFirstItem, }) {
+    var _a;
     const [editMode, setEditMode] = useState(false);
     const [amount, setAmount] = useState();
     const { isConfirmed } = useConfirmDialog();
@@ -43,6 +44,7 @@ function TotalAmount({ totalGrossAmount, items, selectedCurrency, isAmountIsMiss
         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);
+    const currencyCode = ((_a = selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.code) === null || _a === void 0 ? void 0 : _a.english) || '';
     if (isLoading) {
         return _jsx(Loading, {});
     }
@@ -50,9 +52,9 @@ function TotalAmount({ totalGrossAmount, items, selectedCurrency, isAmountIsMiss
                         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: () => {
+                    }, autoFocus: true })) : (_jsx(DisplayAmount, { sx: { fontSize: '36px', textAlign: 'center' }, amount: totalGrossAmount || 0, currencyCode: currencyCode, onClick: () => {
                         setEditMode(true);
-                    } })) })) : (_jsxs(TotalAmountWrapper, { children: [_jsx(DisplayAmount, { sx: { fontSize: '36px', textAlign: 'center' }, selectedCurrency: selectedCurrency, amount: totalGrossAmount || 0, onClick: () => {
+                    } })) })) : (_jsxs(TotalAmountWrapper, { children: [_jsx(DisplayAmount, { sx: { fontSize: '36px', textAlign: 'center' }, currencyCode: currencyCode, 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') })] }))] })));

package/build/components/AmountInput/AmountInput.d.ts

@@ -9,6 +9,6 @@ interface AmountInputI extends BoxProps {
     placeholder?: string;
     selectedCurrency: Currency;
 }
-declare function AmountInput({ amount, setAmount, placeholder, maxAmount, isError, selectedCurrency, ...props }: AmountInputI): import("react/jsx-runtime").JSX.Element;
+declare function AmountInput({ amount, setAmount, maxAmount, isError, selectedCurrency, ...props }: AmountInputI): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof AmountInput>;
 export default _default;

package/build/components/AmountInput/AmountInput.js

@@ -16,7 +16,8 @@ import { DisplayAmount } from '../index.js';
 import { Wrapper, InputStyled } from './style';
 const isSafari = isSafariBrowser();
 function AmountInput(_a) {
-    var { amount, setAmount, placeholder, maxAmount, isError, selectedCurrency } = _a, props = __rest(_a, ["amount", "setAmount", "placeholder", "maxAmount", "isError", "selectedCurrency"]);
+    var _b;
+    var { amount, setAmount, maxAmount, isError, selectedCurrency } = _a, props = __rest(_a, ["amount", "setAmount", "maxAmount", "isError", "selectedCurrency"]);
     const [editMode, setEditMode] = useState(false);
     const [value, setValue] = useState(amount || '');
     const currencyPlaceholder = useMemo(() => getAmountPlaceholder(selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.decimals), [selectedCurrency]);
@@ -36,7 +37,7 @@ function AmountInput(_a) {
             evt.preventDefault();
         }
     };
-    return (_jsx(Wrapper, Object.assign({ sx: props.sx }, { children: editMode ? (_jsx(InputStyled, { placeholder: currencyPlaceholder, value: value, onChange: onChange, onBlur: onBlur, onKeyDown: onKeyDown, isError: isError, inputProps: { step: '0.01' }, hideArrows: true, autoFocus: true })) : (_jsx(DisplayAmount, { selectedCurrency: selectedCurrency, amount: amount, onClick: () => {
+    return (_jsx(Wrapper, Object.assign({ sx: props.sx }, { children: editMode ? (_jsx(InputStyled, { placeholder: currencyPlaceholder, value: value, onChange: onChange, onBlur: onBlur, onKeyDown: onKeyDown, isError: isError, inputProps: { step: '0.01' }, hideArrows: true, autoFocus: true })) : (_jsx(DisplayAmount, { currencyCode: (_b = selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.code) === null || _b === void 0 ? void 0 : _b.english, amount: amount, onClick: () => {
                 setEditMode(true);
             } })) })));
 }

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

@@ -20,9 +20,10 @@ function TotalDiscount({ selectedCurrency, totalGrossAmount, totalDiscount, onCh
         onChangeTotalDiscount(Object.assign(Object.assign({}, newDiscount), { value: getDiscountValue(totalGrossAmount, newDiscount) }));
     };
     const getLabel = () => {
+        var _a;
         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(Box, Object.assign({ sx: { display: 'flex', gap: '2px' } }, { children: [_jsx("span", { children: "-" }), _jsx(DisplayAmount, { amount: totalDiscount.value, currencyCode: (_a = selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.code) === null || _a === void 0 ? void 0 : _a.english })] })));
     };
     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) }) }))] })));
 }

package/build/components/DisplayAmount/DisplayAmount.d.ts

@@ -1,10 +1,9 @@
 /// <reference types="react" />
 import { BoxProps } from '@mui/material/Box';
-import { Currency } from '../../types/index.js';
 interface DisplayAmountI extends BoxProps {
     amount: number;
-    selectedCurrency: Currency;
+    currencyCode: string;
 }
-declare function DisplayAmount({ amount, selectedCurrency, ...props }: DisplayAmountI): import("react/jsx-runtime").JSX.Element;
+declare function DisplayAmount({ amount, currencyCode, ...props }: DisplayAmountI): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof DisplayAmount>;
 export default _default;

package/build/components/DisplayAmount/DisplayAmount.js

@@ -14,9 +14,8 @@ import { memo } from 'react';
 import { formatAmountWithCurrency } from '../../utils/index.js';
 import { DecimalSpan, CurrencySpan } from './style';
 function DisplayAmount(_a) {
-    var _b;
-    var { amount, selectedCurrency } = _a, props = __rest(_a, ["amount", "selectedCurrency"]);
-    const { integerAmount, decimalAmount } = formatAmountWithCurrency(amount, (_b = selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.code) === null || _b === void 0 ? void 0 : _b.english);
+    var { amount, currencyCode } = _a, props = __rest(_a, ["amount", "currencyCode"]);
+    const { integerAmount, decimalAmount } = formatAmountWithCurrency(amount, currencyCode);
     return (_jsxs(CurrencySpan, Object.assign({}, props, { children: [_jsx("span", { children: integerAmount }), _jsx("span", { children: "." }), _jsx(DecimalSpan, { children: decimalAmount })] })));
 }
 export default memo(DisplayAmount);

package/build/components/VAT/TotalVAT/TotalVAT.js

@@ -9,6 +9,7 @@ import { Label, LabelWrapper } from './style';
 import { getVatValue } from '../utils';
 import VATDropdown from '../VATDropdown';
 function TotalVAT({ totalGrossAmount, totalVat, selectedCurrency, onChangeTotalVat, isDisabled }) {
+    var _a;
     const [isOpen, setIsOpen] = useState(false);
     const vatButtonRef = useRef();
     const { t } = useTranslation();
@@ -19,12 +20,13 @@ function TotalVAT({ totalGrossAmount, totalVat, selectedCurrency, onChangeTotalV
     const modifyTotalVAT = (newVat) => {
         onChangeTotalVat(Object.assign(Object.assign({}, newVat), { value: getVatValue(totalGrossAmount, newVat) }));
     };
+    const currencyCode = ((_a = selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.code) === null || _a === void 0 ? void 0 : _a.english) || '';
     const getLabel = () => {
         if (totalVat.percentage === 0)
             return t('noVat');
         if (!totalVat.isInclusive)
-            return _jsx(DisplayAmount, { selectedCurrency: selectedCurrency, amount: totalVat.value });
-        return (_jsxs(Box, Object.assign({ sx: { display: 'flex', gap: '4px' } }, { children: [_jsxs("span", { children: [t('inclusive'), " "] }), _jsx(DisplayAmount, { amount: totalVat.value, selectedCurrency: selectedCurrency })] })));
+            return _jsx(DisplayAmount, { currencyCode: currencyCode, amount: totalVat.value });
+        return (_jsxs(Box, Object.assign({ sx: { display: 'flex', gap: '4px' } }, { children: [_jsxs("span", { children: [t('inclusive'), " "] }), _jsx(DisplayAmount, { amount: totalVat.value, currencyCode: currencyCode })] })));
     };
     return (_jsxs(LabelWrapper, Object.assign({ isDisabled: isDisabled, isOpen: isOpen, onClick: toggleDropdown, ref: vatButtonRef, sx: Object.assign({}, (isDisabled && { pointerEvents: 'none', opacity: 0.7 })) }, { children: [_jsx("img", { src: taxIcon, 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: vatButtonRef.current, placement: "bottom-start" }, { children: _jsx(VATDropdown, { setIsOpen: setIsOpen, vat: totalVat, setVat: modifyTotalVAT, sx: { position: 'absolute', top: 8, left: 0, display: isOpen ? 'block' : 'none' } }) }))] })));
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.1.287",
+  "version": "0.1.288",
   "testVersion": 0,
   "type": "module",
   "main": "build/index.js",