@tap-payments/os-micro-frontend-shared 0.1.300-test.2-test.3 → 0.1.301-test.1
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.
- package/build/components/Customer/CustomerDropdown/CustomerDropdown.d.ts +2 -2
- package/build/components/Customer/CustomerDropdown/CustomerDropdown.js +1 -1
- package/build/components/Customer/CustomerDropdown/index.d.ts +1 -1
- package/build/components/Customer/CustomerForms/CustomerEmailForm.d.ts +12 -0
- package/build/components/Customer/CustomerForms/{EmailForm.js → CustomerEmailForm.js} +2 -2
- package/build/components/Customer/CustomerForms/{FullInfo.d.ts → CustomerFullInfo.d.ts} +3 -3
- package/build/components/Customer/CustomerForms/{FullInfo.js → CustomerFullInfo.js} +2 -2
- package/build/components/Customer/CustomerForms/CustomerFullInfoForm.d.ts +12 -0
- package/build/components/Customer/CustomerForms/{FullInfoForm.js → CustomerFullInfoForm.js} +2 -2
- package/build/components/Customer/CustomerForms/CustomerPhoneNumberForm.d.ts +12 -0
- package/build/components/Customer/CustomerForms/{PhoneNumberForm.js → CustomerPhoneNumberForm.js} +2 -2
- package/build/components/Customer/CustomerForms/index.d.ts +8 -8
- package/build/components/Customer/CustomerForms/index.js +8 -8
- package/build/components/Customer/index.d.ts +2 -1
- package/build/components/Customer/index.js +1 -0
- package/build/components/PaymentSourceFilter/PaymentMethods.js +4 -3
- package/build/components/PaymentSourceFilter/PaymentSchemes.js +2 -1
- package/build/components/index.d.ts +0 -1
- package/build/components/index.js +0 -1
- package/build/constants/payment.d.ts +2 -0
- package/build/constants/payment.js +4 -2
- package/build/utils/index.d.ts +1 -0
- package/build/utils/index.js +1 -0
- package/build/utils/merchantSource.d.ts +32 -0
- package/build/utils/merchantSource.js +76 -0
- package/package.json +2 -2
- package/build/components/Customer/CustomerForms/EmailForm.d.ts +0 -12
- package/build/components/Customer/CustomerForms/FullInfoForm.d.ts +0 -12
- package/build/components/Customer/CustomerForms/PhoneNumberForm.d.ts +0 -12
- package/build/components/VerificationIcon/VerificationIcon.d.ts +0 -5
- package/build/components/VerificationIcon/VerificationIcon.js +0 -7
- package/build/components/VerificationIcon/VerificationIconWithBg.d.ts +0 -5
- package/build/components/VerificationIcon/VerificationIconWithBg.js +0 -15
- package/build/components/VerificationIcon/constant.d.ts +0 -2
- package/build/components/VerificationIcon/constant.js +0 -18
- package/build/components/VerificationIcon/index.d.ts +0 -3
- package/build/components/VerificationIcon/index.js +0 -3
- package/build/components/VerificationIcon/type.d.ts +0 -2
- package/build/components/VerificationIcon/type.js +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import {
|
|
3
|
-
interface CustomerDropdownProps extends
|
|
2
|
+
import { CustomerFullInfoProps } from '../CustomerForms/CustomerFullInfo';
|
|
3
|
+
export interface CustomerDropdownProps extends CustomerFullInfoProps {
|
|
4
4
|
isDisabled?: boolean;
|
|
5
5
|
}
|
|
6
6
|
declare function CustomerDropdown({ ...props }: Readonly<CustomerDropdownProps>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -17,7 +17,7 @@ import { getRandomGradientColor } from '../../../utils/index.js';
|
|
|
17
17
|
import { CustomBackdrop } from '../../index.js';
|
|
18
18
|
import { customerIcon2 } from '../../../constants/index.js';
|
|
19
19
|
import { Wrapper, AvatarStyled, Button } from './style';
|
|
20
|
-
import FullInfo from '../CustomerForms/
|
|
20
|
+
import FullInfo from '../CustomerForms/CustomerFullInfo';
|
|
21
21
|
function CustomerDropdown(_a) {
|
|
22
22
|
var _b, _c;
|
|
23
23
|
var props = __rest(_a, []);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { default } from './CustomerDropdown';
|
|
1
|
+
export { default, CustomerDropdownProps } from './CustomerDropdown';
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { Item } from '../../../types/index.js';
|
|
3
|
+
import { CustomerFullInfoProps } from './CustomerFullInfo';
|
|
4
|
+
export interface CustomerEmailFormProps extends Pick<CustomerFullInfoProps, 'onCustomerChange' | 'isCustomerNotValid' | 'customer'> {
|
|
5
|
+
items: Item[];
|
|
6
|
+
isItemsNotValid: boolean;
|
|
7
|
+
submitButtonText: string;
|
|
8
|
+
onSubmit: () => void;
|
|
9
|
+
}
|
|
10
|
+
declare function CustomerEmailForm({ submitButtonText, onSubmit, customer, isItemsNotValid, items, onCustomerChange }: Readonly<CustomerEmailFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
declare const _default: import("react").MemoExoticComponent<typeof CustomerEmailForm>;
|
|
12
|
+
export default _default;
|
|
@@ -17,7 +17,7 @@ import { Controller, useForm } from 'react-hook-form';
|
|
|
17
17
|
import { useTranslation } from 'react-i18next';
|
|
18
18
|
import { FormWrapper, InputStyled, SubmitButton, ErrorStyled } from './style';
|
|
19
19
|
import { validationEmailFromSchema } from './validation';
|
|
20
|
-
function
|
|
20
|
+
function CustomerEmailForm({ submitButtonText, onSubmit, customer, isItemsNotValid, items, onCustomerChange }) {
|
|
21
21
|
const firstNameRef = useRef();
|
|
22
22
|
const lastNameRef = useRef();
|
|
23
23
|
const emailRef = useRef();
|
|
@@ -73,4 +73,4 @@ function EmailForm({ submitButtonText, onSubmit, customer, isItemsNotValid, item
|
|
|
73
73
|
}, error: Boolean(error === null || error === void 0 ? void 0 : error.message) })), (error === null || error === void 0 ? void 0 : error.message) && _jsx(ErrorStyled, { error: t(error.message) })] })));
|
|
74
74
|
} }), _jsx(SubmitButton, Object.assign({ type: "button", "data-testid": "EmailForm_submit", onClick: onSubmit, disabled: !isValid || isItemsNotValid || !items.length }, { children: submitButtonText }))] })));
|
|
75
75
|
}
|
|
76
|
-
export default memo(
|
|
76
|
+
export default memo(CustomerEmailForm);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Country, CustomerInfo, SegmentCountry } from '../../../types/index.js';
|
|
2
|
-
export interface
|
|
2
|
+
export interface CustomerFullInfoProps {
|
|
3
3
|
customer: CustomerInfo;
|
|
4
4
|
country: Country;
|
|
5
5
|
defaultCountry: SegmentCountry;
|
|
@@ -9,5 +9,5 @@ export interface FullInfoProps {
|
|
|
9
9
|
onCustomerChange: (customer: CustomerInfo) => void;
|
|
10
10
|
isCustomerNotValid?: (value: boolean, err?: string) => void;
|
|
11
11
|
}
|
|
12
|
-
declare function
|
|
13
|
-
export default
|
|
12
|
+
declare function CustomerFullInfo({ customer, country, defaultCountry, countries, isCountriesLoading, onCustomerChange, onCountryChange, isCustomerNotValid, }: Readonly<CustomerFullInfoProps>): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export default CustomerFullInfo;
|
|
@@ -18,7 +18,7 @@ import { useTranslation } from 'react-i18next';
|
|
|
18
18
|
import { MobileWrapper, FormWrapper, InputStyled, InputNumberStyled, ErrorStyled } from './style';
|
|
19
19
|
import { validationFullInfoSchema } from './validation';
|
|
20
20
|
import CountriesDropdown from '../../Inputs/CountriesDropDown';
|
|
21
|
-
function
|
|
21
|
+
function CustomerFullInfo({ customer, country, defaultCountry, countries, isCountriesLoading, onCustomerChange, onCountryChange, isCustomerNotValid, }) {
|
|
22
22
|
const firstNameRef = useRef();
|
|
23
23
|
const lastNameRef = useRef();
|
|
24
24
|
const emailRef = useRef();
|
|
@@ -69,4 +69,4 @@ function FullInfo({ customer, country, defaultCountry, countries, isCountriesLoa
|
|
|
69
69
|
}, hideArrows: true }))] })), (error === null || error === void 0 ? void 0 : error.message) && _jsx(ErrorStyled, { error: t(error.message, { numberLen: country.max_digits }) })] })));
|
|
70
70
|
} }, "fullInfoPhoneNumber")] })));
|
|
71
71
|
}
|
|
72
|
-
export default
|
|
72
|
+
export default CustomerFullInfo;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { Item } from '../../../types/index.js';
|
|
3
|
+
import { CustomerFullInfoProps } from './CustomerFullInfo';
|
|
4
|
+
export interface CustomerFullInfoFormProps extends CustomerFullInfoProps {
|
|
5
|
+
items: Item[];
|
|
6
|
+
isItemsNotValid: boolean;
|
|
7
|
+
submitButtonText: string;
|
|
8
|
+
onSubmit: () => void;
|
|
9
|
+
}
|
|
10
|
+
declare function CustomerFullInfoForm({ submitButtonText, onSubmit, customer, country, items, isItemsNotValid, defaultCountry, countries, isCountriesLoading, onCustomerChange, onCountryChange, }: Readonly<CustomerFullInfoFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
declare const _default: import("react").MemoExoticComponent<typeof CustomerFullInfoForm>;
|
|
12
|
+
export default _default;
|
|
@@ -19,7 +19,7 @@ import { InputNumberStyled, MobileWrapper } from '../../index.js';
|
|
|
19
19
|
import { FormWrapper, SubmitButton, InputStyled, ErrorStyled } from './style';
|
|
20
20
|
import { validationFullInfoSchema } from './validation';
|
|
21
21
|
import CountriesDropdown from '../../Inputs/CountriesDropDown';
|
|
22
|
-
function
|
|
22
|
+
function CustomerFullInfoForm({ submitButtonText, onSubmit, customer, country, items, isItemsNotValid, defaultCountry, countries, isCountriesLoading, onCustomerChange, onCountryChange, }) {
|
|
23
23
|
const firstNameRef = useRef();
|
|
24
24
|
const lastNameRef = useRef();
|
|
25
25
|
const emailRef = useRef();
|
|
@@ -71,4 +71,4 @@ function FullInfoForm({ submitButtonText, onSubmit, customer, country, items, is
|
|
|
71
71
|
}, hideArrows: true }))] })), (error === null || error === void 0 ? void 0 : error.message) && _jsx(ErrorStyled, { error: t(error.message, { numberLen: country.max_digits }) })] })));
|
|
72
72
|
} }), _jsx(SubmitButton, Object.assign({ onClick: onSubmit, disabled: !isValid || isItemsNotValid || !items.length }, { children: submitButtonText }))] })));
|
|
73
73
|
}
|
|
74
|
-
export default memo(
|
|
74
|
+
export default memo(CustomerFullInfoForm);
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { Item } from '../../../types/index.js';
|
|
3
|
+
import { CustomerFullInfoProps } from './CustomerFullInfo';
|
|
4
|
+
export interface CustomerPhoneNumberFormProps extends Pick<CustomerFullInfoProps, 'customer' | 'country' | 'onCountryChange' | 'onCustomerChange' | 'defaultCountry' | 'countries' | 'isCountriesLoading'> {
|
|
5
|
+
isItemsNotValid: boolean;
|
|
6
|
+
items: Item[];
|
|
7
|
+
submitButtonText: string;
|
|
8
|
+
onSubmit: () => void;
|
|
9
|
+
}
|
|
10
|
+
declare function CustomerPhoneNumberForm({ submitButtonText, onSubmit, customer, country, isItemsNotValid, items, defaultCountry, countries, isCountriesLoading, onCustomerChange, onCountryChange, }: Readonly<CustomerPhoneNumberFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
declare const _default: import("react").MemoExoticComponent<typeof CustomerPhoneNumberForm>;
|
|
12
|
+
export default _default;
|
package/build/components/Customer/CustomerForms/{PhoneNumberForm.js → CustomerPhoneNumberForm.js}
RENAMED
|
@@ -18,7 +18,7 @@ import { useTranslation } from 'react-i18next';
|
|
|
18
18
|
import { CountriesDropdown, InputNumberStyled, MobileWrapper } from '../../index.js';
|
|
19
19
|
import { FormWrapper, SubmitButton, InputStyled, ErrorStyled } from './style';
|
|
20
20
|
import { validationPhoneNumberSchema } from './validation';
|
|
21
|
-
function
|
|
21
|
+
function CustomerPhoneNumberForm({ submitButtonText, onSubmit, customer, country, isItemsNotValid, items, defaultCountry, countries, isCountriesLoading, onCustomerChange, onCountryChange, }) {
|
|
22
22
|
const firstNameRef = useRef();
|
|
23
23
|
const lastNameRef = useRef();
|
|
24
24
|
const phoneNumberRef = useRef();
|
|
@@ -68,4 +68,4 @@ function PhoneNumberForm({ submitButtonText, onSubmit, customer, country, isItem
|
|
|
68
68
|
return (_jsxs(Box, Object.assign({ ref: lastNameRef }, { children: [_jsx(InputStyled, Object.assign({}, field, { placeholder: t('lastName'), inputProps: { autoComplete: 'off' }, error: Boolean(error === null || error === void 0 ? void 0 : error.message) })), (error === null || error === void 0 ? void 0 : error.message) && _jsx(ErrorStyled, { error: t(error.message) })] })));
|
|
69
69
|
} }, "phoneNumberFormLastName"), _jsx(SubmitButton, Object.assign({ onClick: onSubmit, disabled: !isValid || isItemsNotValid || !items.length }, { children: submitButtonText }))] })));
|
|
70
70
|
}
|
|
71
|
-
export default memo(
|
|
71
|
+
export default memo(CustomerPhoneNumberForm);
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export * from './validation';
|
|
2
|
-
export * from './
|
|
3
|
-
export { default as
|
|
4
|
-
export * from './
|
|
5
|
-
export { default as
|
|
6
|
-
export * from './
|
|
7
|
-
export { default as
|
|
8
|
-
export * from './
|
|
9
|
-
export { default as
|
|
2
|
+
export * from './CustomerEmailForm';
|
|
3
|
+
export { default as CustomerEmailForm } from './CustomerEmailForm';
|
|
4
|
+
export * from './CustomerFullInfo';
|
|
5
|
+
export { default as CustomerFullInfo } from './CustomerFullInfo';
|
|
6
|
+
export * from './CustomerFullInfoForm';
|
|
7
|
+
export { default as CustomerFullInfoForm } from './CustomerFullInfoForm';
|
|
8
|
+
export * from './CustomerPhoneNumberForm';
|
|
9
|
+
export { default as CustomerPhoneNumberForm } from './CustomerPhoneNumberForm';
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export * from './validation';
|
|
2
|
-
export * from './
|
|
3
|
-
export { default as
|
|
4
|
-
export * from './
|
|
5
|
-
export { default as
|
|
6
|
-
export * from './
|
|
7
|
-
export { default as
|
|
8
|
-
export * from './
|
|
9
|
-
export { default as
|
|
2
|
+
export * from './CustomerEmailForm';
|
|
3
|
+
export { default as CustomerEmailForm } from './CustomerEmailForm';
|
|
4
|
+
export * from './CustomerFullInfo';
|
|
5
|
+
export { default as CustomerFullInfo } from './CustomerFullInfo';
|
|
6
|
+
export * from './CustomerFullInfoForm';
|
|
7
|
+
export { default as CustomerFullInfoForm } from './CustomerFullInfoForm';
|
|
8
|
+
export * from './CustomerPhoneNumberForm';
|
|
9
|
+
export { default as CustomerPhoneNumberForm } from './CustomerPhoneNumberForm';
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
export { default as CustomerDropdown } from './CustomerDropdown';
|
|
1
|
+
export { default as CustomerDropdown, type CustomerDropdownProps } from './CustomerDropdown';
|
|
2
|
+
export { CustomerEmailForm, CustomerFullInfoForm, CustomerPhoneNumberForm, type CustomerFullInfoProps, type CustomerFullInfoFormProps, type CustomerPhoneNumberFormProps, type CustomerEmailFormProps, } from './CustomerForms';
|
|
@@ -19,6 +19,7 @@ export default function PaymentMethods({ paymentMethodsSource, filters, setFilte
|
|
|
19
19
|
var _a, _b;
|
|
20
20
|
const [paymentMethodsEl, setPaymentMethodsEl] = useState(null);
|
|
21
21
|
const filterPaymentMethods = (_a = filters === null || filters === void 0 ? void 0 : filters.payment_methods) !== null && _a !== void 0 ? _a : [];
|
|
22
|
+
const isDisabled = !(paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.options) || !(paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.options.length);
|
|
22
23
|
const onOpen = (e) => {
|
|
23
24
|
setPaymentMethodsEl(e.currentTarget);
|
|
24
25
|
};
|
|
@@ -27,13 +28,13 @@ export default function PaymentMethods({ paymentMethodsSource, filters, setFilte
|
|
|
27
28
|
};
|
|
28
29
|
const paymentMethodsAll = useMemo(() => {
|
|
29
30
|
var _a, _b, _c;
|
|
30
|
-
return (_c = (_b = ((_a = paymentMethodsSource.options) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.reduce((acc, method) => {
|
|
31
|
+
return (_c = (_b = ((_a = paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.options) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.reduce((acc, method) => {
|
|
31
32
|
var _a, _b, _c;
|
|
32
33
|
acc.push(...((_c = (_b = ((_a = method.options) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.map((m) => m.type)) !== null && _c !== void 0 ? _c : []));
|
|
33
34
|
return acc;
|
|
34
35
|
}, [])) !== null && _c !== void 0 ? _c : [];
|
|
35
36
|
}, []);
|
|
36
|
-
const isSelected = useMemo(() => (paymentMethodsAll === null || paymentMethodsAll === void 0 ? void 0 : paymentMethodsAll.length) === filterPaymentMethods.length, [filterPaymentMethods.length, paymentMethodsAll === null || paymentMethodsAll === void 0 ? void 0 : paymentMethodsAll.length]);
|
|
37
|
+
const isSelected = useMemo(() => (paymentMethodsAll === null || paymentMethodsAll === void 0 ? void 0 : paymentMethodsAll.length) === filterPaymentMethods.length && !isDisabled, [filterPaymentMethods.length, paymentMethodsAll === null || paymentMethodsAll === void 0 ? void 0 : paymentMethodsAll.length, isDisabled]);
|
|
37
38
|
const isIndeterminate = useMemo(() => !isSelected && (paymentMethodsAll === null || paymentMethodsAll === void 0 ? void 0 : paymentMethodsAll.length) !== filterPaymentMethods.length && filterPaymentMethods.length > 0, [filterPaymentMethods.length, paymentMethodsAll === null || paymentMethodsAll === void 0 ? void 0 : paymentMethodsAll.length, isSelected]);
|
|
38
39
|
const onClick = () => {
|
|
39
40
|
if (isSelected) {
|
|
@@ -44,5 +45,5 @@ export default function PaymentMethods({ paymentMethodsSource, filters, setFilte
|
|
|
44
45
|
setFilters(Object.assign(Object.assign({}, filters), { payment_methods: paymentMethodsAll }));
|
|
45
46
|
}
|
|
46
47
|
};
|
|
47
|
-
return (_jsxs(MenuItemStyled, Object.assign({ isSelected: isSelected, isIndeterminate: isIndeterminate, onMouseEnter: onOpen, onMouseLeave: onClose, onClick: onClick }, { children: [_jsx("span", Object.assign({ className: "label" }, { children: paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.name })), _jsx("img", { src: rightArrow, alt: "arrow", style: { height: 12 } }), _jsx(Menu, Object.assign({ open: Boolean(paymentMethodsEl), anchorEl: paymentMethodsEl, placement: "right-start" }, { children: (_b = paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.options) === null || _b === void 0 ? void 0 : _b.map((paymentMethod) => (_jsx(PaymentMethod, Object.assign({}, paymentMethod, { filters: filters, setFilters: setFilters }), paymentMethod.type))) }))] })));
|
|
48
|
+
return (_jsxs(MenuItemStyled, Object.assign({ isSelected: isSelected, isIndeterminate: isIndeterminate, onMouseEnter: onOpen, onMouseLeave: onClose, onClick: onClick, sx: Object.assign({}, (isDisabled && { opacity: 0.5, pointerEvents: 'none' })) }, { children: [_jsx("span", Object.assign({ className: "label" }, { children: paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.name })), _jsx("img", { src: rightArrow, alt: "arrow", style: { height: 12 } }), _jsx(Menu, Object.assign({ open: Boolean(paymentMethodsEl), anchorEl: paymentMethodsEl, placement: "right-start" }, { children: (_b = paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.options) === null || _b === void 0 ? void 0 : _b.map((paymentMethod) => (_jsx(PaymentMethod, Object.assign({}, paymentMethod, { filters: filters, setFilters: setFilters }), paymentMethod.type))) }))] })));
|
|
48
49
|
}
|
|
@@ -18,6 +18,7 @@ export default function PaymentSchemes({ paymentSchemesSource, filters, setFilte
|
|
|
18
18
|
var _a, _b, _c;
|
|
19
19
|
const [anchorEl, setAnchorEl] = useState(null);
|
|
20
20
|
const paymentScheme = (_a = filters === null || filters === void 0 ? void 0 : filters.payment_scheme) !== null && _a !== void 0 ? _a : [];
|
|
21
|
+
const isDisabled = !paymentSchemesSource.options || !(paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options.length);
|
|
21
22
|
const onOpen = (e) => {
|
|
22
23
|
setAnchorEl(e.currentTarget);
|
|
23
24
|
};
|
|
@@ -47,5 +48,5 @@ export default function PaymentSchemes({ paymentSchemesSource, filters, setFilte
|
|
|
47
48
|
setFilters(Object.assign(Object.assign({}, filters), { payment_scheme: [...((_b = filters === null || filters === void 0 ? void 0 : filters.payment_scheme) !== null && _b !== void 0 ? _b : []), selectedPaymentScheme] }));
|
|
48
49
|
}
|
|
49
50
|
};
|
|
50
|
-
return (_jsxs(MenuItemStyled, Object.assign({ isSelected: isSelected, isIndeterminate: isIndeterminate, onMouseEnter: onOpen, onMouseLeave: onClose, onClick: onClick }, { children: [_jsx("span", Object.assign({ className: "label" }, { children: paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.name })), _jsx("img", { src: rightArrow, alt: "arrow", style: { height: 12 } }), _jsx(Menu, Object.assign({ open: Boolean(anchorEl), anchorEl: anchorEl, placement: "right-start" }, { children: (_c = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _c === void 0 ? void 0 : _c.map((scheme) => (_jsx(MenuItemStyled, Object.assign({ isSelected: isSelectedPaymentScheme(scheme.type), onClick: (e) => onClickPaymentScheme(e, scheme.type) }, { children: _jsx("img", { src: scheme.icon, alt: scheme === null || scheme === void 0 ? void 0 : scheme.name, style: { height: 24 } }) }), scheme.type))) }))] })));
|
|
51
|
+
return (_jsxs(MenuItemStyled, Object.assign({ isSelected: isSelected, isIndeterminate: isIndeterminate, onMouseEnter: onOpen, onMouseLeave: onClose, onClick: onClick, sx: Object.assign({}, (isDisabled && { opacity: 0.5, pointerEvents: 'none' })) }, { children: [_jsx("span", Object.assign({ className: "label" }, { children: paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.name })), _jsx("img", { src: rightArrow, alt: "arrow", style: { height: 12 } }), _jsx(Menu, Object.assign({ open: Boolean(anchorEl), anchorEl: anchorEl, placement: "right-start" }, { children: (_c = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _c === void 0 ? void 0 : _c.map((scheme) => (_jsx(MenuItemStyled, Object.assign({ isSelected: isSelectedPaymentScheme(scheme.type), onClick: (e) => onClickPaymentScheme(e, scheme.type) }, { children: _jsx("img", { src: scheme.icon, alt: scheme === null || scheme === void 0 ? void 0 : scheme.name, style: { height: 24 } }) }), scheme.type))) }))] })));
|
|
51
52
|
}
|
|
@@ -3,6 +3,8 @@ export declare const PAYMENT_TYPES: {
|
|
|
3
3
|
label: string;
|
|
4
4
|
icon: string;
|
|
5
5
|
}[];
|
|
6
|
+
export declare const PAYMENT_INITIATED_CUSTOMER_KEY = "customer";
|
|
7
|
+
export declare const PAYMENT_INITIATED_MERCHANT_KEY = "merchant";
|
|
6
8
|
export declare const PAYMENT_INITIATED_OPTIONS: {
|
|
7
9
|
key: string;
|
|
8
10
|
value: string;
|
|
@@ -36,7 +36,9 @@ export const PAYMENT_TYPES = [
|
|
|
36
36
|
icon: `${lightUrl}/cash.svg`,
|
|
37
37
|
},
|
|
38
38
|
];
|
|
39
|
+
export const PAYMENT_INITIATED_CUSTOMER_KEY = 'customer';
|
|
40
|
+
export const PAYMENT_INITIATED_MERCHANT_KEY = 'merchant';
|
|
39
41
|
export const PAYMENT_INITIATED_OPTIONS = [
|
|
40
|
-
{ key:
|
|
41
|
-
{ key:
|
|
42
|
+
{ key: PAYMENT_INITIATED_CUSTOMER_KEY, value: 'true', label: 'Customer' },
|
|
43
|
+
{ key: PAYMENT_INITIATED_MERCHANT_KEY, value: 'false', label: 'Merchant' },
|
|
42
44
|
];
|
package/build/utils/index.d.ts
CHANGED
package/build/utils/index.js
CHANGED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { TextAndLang } from '../types/index.js';
|
|
2
|
+
interface Source {
|
|
3
|
+
code: string;
|
|
4
|
+
name: TextAndLang[];
|
|
5
|
+
}
|
|
6
|
+
interface PaymentMethod extends Source {
|
|
7
|
+
payment_methods: Source[];
|
|
8
|
+
}
|
|
9
|
+
export declare function transformPaymentMethodsData(data?: PaymentMethod[]): {
|
|
10
|
+
name: string;
|
|
11
|
+
type: string;
|
|
12
|
+
options: ({
|
|
13
|
+
name: string;
|
|
14
|
+
type: string;
|
|
15
|
+
icon: string;
|
|
16
|
+
options: {
|
|
17
|
+
name: string | undefined;
|
|
18
|
+
type: string;
|
|
19
|
+
icon: string;
|
|
20
|
+
}[];
|
|
21
|
+
} | null)[] | undefined;
|
|
22
|
+
};
|
|
23
|
+
export declare function transformPaymentSchemesData(data?: Source[]): {
|
|
24
|
+
name: string;
|
|
25
|
+
type: string;
|
|
26
|
+
options: {
|
|
27
|
+
name: string | undefined;
|
|
28
|
+
type: string;
|
|
29
|
+
icon: string;
|
|
30
|
+
}[];
|
|
31
|
+
};
|
|
32
|
+
export {};
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { lightUrl } from '../constants/index.js';
|
|
2
|
+
import { getNameText } from './language';
|
|
3
|
+
const PAYMENT_TYPES = {
|
|
4
|
+
DEVICE: {
|
|
5
|
+
name: 'Device',
|
|
6
|
+
type: 'device',
|
|
7
|
+
icon: `${lightUrl}/device.svg`,
|
|
8
|
+
},
|
|
9
|
+
CARD: {
|
|
10
|
+
name: 'Cards',
|
|
11
|
+
type: 'cards',
|
|
12
|
+
icon: `${lightUrl}/payment-method/card.svg`,
|
|
13
|
+
},
|
|
14
|
+
PASS_THRU_WALLET: {
|
|
15
|
+
name: 'Pass-Thru Wallet',
|
|
16
|
+
type: 'pass_thru_wallet',
|
|
17
|
+
icon: `${lightUrl}/passThruWallet.svg`,
|
|
18
|
+
},
|
|
19
|
+
EXPRESS_CHECKOUT: {
|
|
20
|
+
name: 'Express Checkout',
|
|
21
|
+
type: 'express_checkout',
|
|
22
|
+
icon: `${lightUrl}/express_checkout.svg`,
|
|
23
|
+
},
|
|
24
|
+
STORED_VALUE_WALLET: {
|
|
25
|
+
name: 'Stored Value Wallet',
|
|
26
|
+
type: 'stored_value_wallet',
|
|
27
|
+
icon: `${lightUrl}/storedValueWallet.svg`,
|
|
28
|
+
},
|
|
29
|
+
CASH_WALLET: {
|
|
30
|
+
name: 'Cash Wallet',
|
|
31
|
+
type: 'cash_wallet',
|
|
32
|
+
icon: `${lightUrl}/cash.svg`,
|
|
33
|
+
},
|
|
34
|
+
BUY_NOW_PAY_LATER: {
|
|
35
|
+
name: 'Buy Now Pay Later',
|
|
36
|
+
type: 'buy_now_pay_later',
|
|
37
|
+
icon: `${lightUrl}/buyNowPayLater.svg`,
|
|
38
|
+
},
|
|
39
|
+
};
|
|
40
|
+
export function transformPaymentMethodsData(data) {
|
|
41
|
+
return {
|
|
42
|
+
name: 'Payment Methods',
|
|
43
|
+
type: 'payment_methods',
|
|
44
|
+
options: data === null || data === void 0 ? void 0 : data.map((category) => {
|
|
45
|
+
var _a, _b;
|
|
46
|
+
const paymentType = (_a = PAYMENT_TYPES[category.code]) !== null && _a !== void 0 ? _a : {};
|
|
47
|
+
if (!paymentType)
|
|
48
|
+
return null;
|
|
49
|
+
return {
|
|
50
|
+
name: paymentType === null || paymentType === void 0 ? void 0 : paymentType.name,
|
|
51
|
+
type: paymentType === null || paymentType === void 0 ? void 0 : paymentType.type,
|
|
52
|
+
icon: paymentType === null || paymentType === void 0 ? void 0 : paymentType.icon,
|
|
53
|
+
options: (_b = category.payment_methods) === null || _b === void 0 ? void 0 : _b.map((method) => ({
|
|
54
|
+
name: getNameText(method.name),
|
|
55
|
+
type: method.code,
|
|
56
|
+
icon: `${lightUrl}/payment-method/${method.code}.svg`,
|
|
57
|
+
})),
|
|
58
|
+
};
|
|
59
|
+
}),
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
export function transformPaymentSchemesData(data = []) {
|
|
63
|
+
return {
|
|
64
|
+
name: 'Payment Schemes',
|
|
65
|
+
type: 'payment_scheme',
|
|
66
|
+
options: data
|
|
67
|
+
.filter((scheme) => scheme.code)
|
|
68
|
+
.map((scheme) => {
|
|
69
|
+
return {
|
|
70
|
+
name: getNameText(scheme === null || scheme === void 0 ? void 0 : scheme.name),
|
|
71
|
+
type: scheme === null || scheme === void 0 ? void 0 : scheme.code,
|
|
72
|
+
icon: `${lightUrl}/payment-method/${scheme.code}.svg`,
|
|
73
|
+
};
|
|
74
|
+
}),
|
|
75
|
+
};
|
|
76
|
+
}
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
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.
|
|
5
|
-
"testVersion":
|
|
4
|
+
"version": "0.1.301-test.1",
|
|
5
|
+
"testVersion": 1,
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "build/index.js",
|
|
8
8
|
"module": "build/index.js",
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { Item } from '../../../types/index.js';
|
|
3
|
-
import { FullInfoProps } from './FullInfo';
|
|
4
|
-
export interface EmailFormProps extends Pick<FullInfoProps, 'onCustomerChange' | 'isCustomerNotValid' | 'customer'> {
|
|
5
|
-
items: Item[];
|
|
6
|
-
isItemsNotValid: boolean;
|
|
7
|
-
submitButtonText: string;
|
|
8
|
-
onSubmit: () => void;
|
|
9
|
-
}
|
|
10
|
-
declare function EmailForm({ submitButtonText, onSubmit, customer, isItemsNotValid, items, onCustomerChange }: Readonly<EmailFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
declare const _default: import("react").MemoExoticComponent<typeof EmailForm>;
|
|
12
|
-
export default _default;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import type { Item } from '../../../types/index.js';
|
|
3
|
-
import { FullInfoProps } from './FullInfo';
|
|
4
|
-
export interface FullInfoFormProps extends FullInfoProps {
|
|
5
|
-
items: Item[];
|
|
6
|
-
isItemsNotValid: boolean;
|
|
7
|
-
submitButtonText: string;
|
|
8
|
-
onSubmit: () => void;
|
|
9
|
-
}
|
|
10
|
-
declare function FullInfoForm({ submitButtonText, onSubmit, customer, country, items, isItemsNotValid, defaultCountry, countries, isCountriesLoading, onCustomerChange, onCountryChange, }: Readonly<FullInfoFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
declare const _default: import("react").MemoExoticComponent<typeof FullInfoForm>;
|
|
12
|
-
export default _default;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { Item } from '../../../types/index.js';
|
|
3
|
-
import { FullInfoProps } from './FullInfo';
|
|
4
|
-
export interface PhoneNumberFormProps extends Pick<FullInfoProps, 'customer' | 'country' | 'onCountryChange' | 'onCustomerChange' | 'defaultCountry' | 'countries' | 'isCountriesLoading'> {
|
|
5
|
-
isItemsNotValid: boolean;
|
|
6
|
-
items: Item[];
|
|
7
|
-
submitButtonText: string;
|
|
8
|
-
onSubmit: () => void;
|
|
9
|
-
}
|
|
10
|
-
declare function PhoneNumberForm({ submitButtonText, onSubmit, customer, country, isItemsNotValid, items, defaultCountry, countries, isCountriesLoading, onCustomerChange, onCountryChange, }: Readonly<PhoneNumberFormProps>): import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
declare const _default: import("react").MemoExoticComponent<typeof PhoneNumberForm>;
|
|
12
|
-
export default _default;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import startCase from 'lodash/startCase';
|
|
3
|
-
import { Tooltip } from '../index.js';
|
|
4
|
-
import { statusIcon } from './constant';
|
|
5
|
-
export const VerificationIcon = ({ status }) => {
|
|
6
|
-
return (_jsx(Tooltip, Object.assign({ title: startCase(status) }, { children: _jsx("img", { loading: "lazy", src: statusIcon[((status === null || status === void 0 ? void 0 : status.toLowerCase()) || '')] || statusIcon.default, alt: status, width: 10.5, height: 10.5 }) })));
|
|
7
|
-
};
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import startCase from 'lodash/startCase';
|
|
3
|
-
import { Box, Tooltip } from '@mui/material';
|
|
4
|
-
import { statusIcon, statusIconBG } from './constant';
|
|
5
|
-
export const VerificationIconWithBg = ({ status }) => {
|
|
6
|
-
return (_jsx(Tooltip, Object.assign({ title: startCase(status) }, { children: _jsx(Box, Object.assign({ component: 'li', sx: {
|
|
7
|
-
display: 'flex',
|
|
8
|
-
alignItems: 'center',
|
|
9
|
-
justifyContent: 'center',
|
|
10
|
-
width: '24px',
|
|
11
|
-
height: '24px',
|
|
12
|
-
borderRadius: '50%',
|
|
13
|
-
backgroundColor: statusIconBG[status]
|
|
14
|
-
} }, { children: _jsx("img", { loading: 'lazy', src: statusIcon[((status === null || status === void 0 ? void 0 : status.toLowerCase()) || '')] || statusIcon.default, alt: status, width: 10.5, height: 10.5 }) })) })));
|
|
15
|
-
};
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { blueVerifyIcon, grayVerifyIcon, greenVerifyIcon, redVerifyIcon } from '../../constants/index.js';
|
|
2
|
-
export const statusIcon = {
|
|
3
|
-
verified: greenVerifyIcon,
|
|
4
|
-
reviewed: blueVerifyIcon,
|
|
5
|
-
completed: blueVerifyIcon,
|
|
6
|
-
incomplete: grayVerifyIcon,
|
|
7
|
-
complete: blueVerifyIcon,
|
|
8
|
-
rejected: redVerifyIcon,
|
|
9
|
-
default: grayVerifyIcon,
|
|
10
|
-
};
|
|
11
|
-
export const statusIconBG = {
|
|
12
|
-
incomplete: '#D9D9D929',
|
|
13
|
-
completed: '#11D0FA29',
|
|
14
|
-
complete: '#11D0FA29',
|
|
15
|
-
reviewed: '#11D0FA29',
|
|
16
|
-
verified: '#2ACE0029',
|
|
17
|
-
rejected: '#FF3D0029',
|
|
18
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|