@tap-payments/os-micro-frontend-shared 0.1.306 → 0.1.307

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 (12) hide show
  1. package/build/components/PaymentSourceFilter/PaymentMethods.js +10 -8
  2. package/build/components/PaymentSourceFilter/PaymentSchemes.d.ts +1 -1
  3. package/build/components/PaymentSourceFilter/PaymentSchemes.js +8 -6
  4. package/build/constants/payment.d.ts +5 -0
  5. package/build/constants/payment.js +20 -9
  6. package/build/types/segment.d.ts +9 -0
  7. package/build/types/segment.js +10 -1
  8. package/build/utils/index.d.ts +1 -0
  9. package/build/utils/index.js +1 -0
  10. package/build/utils/merchantSource.d.ts +32 -0
  11. package/build/utils/merchantSource.js +37 -0
  12. package/package.json +1 -1
package/build/components/PaymentSourceFilter/PaymentMethods.js CHANGED
@@ -16,9 +16,10 @@ import { rightArrow } from '../../constants/index.js';
16
16
  import PaymentMethod from './PaymentMethod';
17
17
  import { MenuItemStyled } from './style';
18
18
  export default function PaymentMethods({ paymentMethodsSource, filters, setFilters }) {
19
- var _a, _b;
19
+ var _a, _b, _c;
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 = !((_b = paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.options) === null || _b === void 0 ? void 0 : _b.length);
22
23
  const onOpen = (e) => {
23
24
  setPaymentMethodsEl(e.currentTarget);
24
25
  };
@@ -27,22 +28,23 @@ 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 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]);
37
+ const isSelected = useMemo(() => (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]);
38
+ const isIndeterminate = useMemo(() => !isSelected && filterPaymentMethods.length > 0, [filterPaymentMethods.length, isSelected]);
38
39
  const onClick = () => {
40
+ if (isDisabled)
41
+ return;
39
42
  if (isSelected) {
40
43
  const { payment_methods } = filters, resetFilters = __rest(filters, ["payment_methods"]);
41
44
  setFilters(resetFilters);
45
+ return;
42
46
  }
43
- else {
44
- setFilters(Object.assign(Object.assign({}, filters), { payment_methods: paymentMethodsAll }));
45
- }
47
+ setFilters(Object.assign(Object.assign({}, filters), { payment_methods: paymentMethodsAll }));
46
48
  };
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))) }))] })));
49
+ 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: (_c = paymentMethodsSource === null || paymentMethodsSource === void 0 ? void 0 : paymentMethodsSource.options) === null || _c === void 0 ? void 0 : _c.map((paymentMethod) => (_jsx(PaymentMethod, Object.assign({}, paymentMethod, { filters: filters, setFilters: setFilters }), paymentMethod.type))) }))] })));
48
50
  }
package/build/components/PaymentSourceFilter/PaymentSchemes.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { Filters } from './type';
2
1
  import { SourceFilter } from '../../types/index.js';
2
+ import { Filters } from './type';
3
3
  interface PaymentSchemesProps extends Filters {
4
4
  paymentSchemesSource: SourceFilter;
5
5
  }
package/build/components/PaymentSourceFilter/PaymentSchemes.js CHANGED
@@ -15,27 +15,29 @@ import { Menu } from '../index.js';
15
15
  import { rightArrow } from '../../constants/index.js';
16
16
  import { MenuItemStyled } from './style';
17
17
  export default function PaymentSchemes({ paymentSchemesSource, filters, setFilters }) {
18
- var _a, _b, _c;
18
+ var _a, _b, _c, _d;
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 = !((_b = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _b === void 0 ? void 0 : _b.length);
21
22
  const onOpen = (e) => {
22
23
  setAnchorEl(e.currentTarget);
23
24
  };
24
25
  const onClose = () => {
25
26
  setAnchorEl(null);
26
27
  };
27
- const isSelected = useMemo(() => { var _a; return paymentScheme.length === ((_a = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _a === void 0 ? void 0 : _a.length); }, [paymentScheme.length, (_b = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _b === void 0 ? void 0 : _b.length]);
28
+ const isSelected = useMemo(() => { var _a; return paymentScheme.length === ((_a = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _a === void 0 ? void 0 : _a.length) && paymentScheme.length > 0; }, [paymentScheme.length, (_c = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _c === void 0 ? void 0 : _c.length]);
28
29
  const isIndeterminate = useMemo(() => !isSelected && paymentScheme.length > 0, [paymentScheme.length, isSelected]);
29
30
  const isSelectedPaymentScheme = useCallback((selectedPaymentScheme) => { var _a; return (_a = paymentScheme.includes(selectedPaymentScheme)) !== null && _a !== void 0 ? _a : false; }, [paymentScheme]);
30
31
  const onClick = () => {
31
32
  var _a, _b;
33
+ if (isDisabled)
34
+ return;
32
35
  if (isSelected) {
33
36
  const { payment_scheme } = filters, resetFilters = __rest(filters, ["payment_scheme"]);
34
37
  setFilters(resetFilters);
38
+ return;
35
39
  }
36
- else {
37
- setFilters(Object.assign(Object.assign({}, filters), { payment_scheme: (_b = (_a = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _a === void 0 ? void 0 : _a.map((paymentSchemeItem) => paymentSchemeItem.type)) !== null && _b !== void 0 ? _b : [] }));
38
- }
40
+ setFilters(Object.assign(Object.assign({}, filters), { payment_scheme: (_b = (_a = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _a === void 0 ? void 0 : _a.map((paymentSchemeItem) => paymentSchemeItem.type)) !== null && _b !== void 0 ? _b : [] }));
39
41
  };
40
42
  const onClickPaymentScheme = (e, selectedPaymentScheme) => {
41
43
  var _a, _b;
@@ -47,5 +49,5 @@ export default function PaymentSchemes({ paymentSchemesSource, filters, setFilte
47
49
  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
50
  }
49
51
  };
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))) }))] })));
52
+ 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: (_d = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _d === void 0 ? void 0 : _d.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
53
  }
package/build/constants/payment.d.ts CHANGED
@@ -1,8 +1,13 @@
1
+ export declare const PAYMENT_TYPES_ICONS: {
2
+ [key: string]: string;
3
+ };
1
4
  export declare const PAYMENT_TYPES: {
2
5
  name: string;
3
6
  label: string;
4
7
  icon: string;
5
8
  }[];
9
+ export declare const PAYMENT_INITIATED_CUSTOMER_KEY = "customer";
10
+ export declare const PAYMENT_INITIATED_MERCHANT_KEY = "merchant";
6
11
  export declare const PAYMENT_INITIATED_OPTIONS: {
7
12
  key: string;
8
13
  value: string;
package/build/constants/payment.js CHANGED
@@ -1,42 +1,53 @@
1
1
  import { lightUrl } from './assets';
2
+ export const PAYMENT_TYPES_ICONS = {
3
+ DEVICE: `${lightUrl}/device.svg`,
4
+ CARD: `${lightUrl}/payment-method/card.svg`,
5
+ PASS_THRU_WALLET: `${lightUrl}/passThruWallet.svg`,
6
+ EXPRESS_CHECKOUT: `${lightUrl}/express_checkout.svg`,
7
+ STORED_VALUE_WALLET: `${lightUrl}/storedValueWallet.svg`,
8
+ CASH_WALLET: `${lightUrl}/cash.svg`,
9
+ BUY_NOW_PAY_LATER: `${lightUrl}/buyNowPayLater.svg`,
10
+ };
2
11
  export const PAYMENT_TYPES = [
3
12
  {
4
13
  name: 'CARD',
5
14
  label: 'Card',
6
- icon: `${lightUrl}/payment-method/card.svg`,
15
+ icon: PAYMENT_TYPES_ICONS.CARD,
7
16
  },
8
17
  {
9
18
  name: 'EXPRESS',
10
19
  label: 'Express Checkout',
11
- icon: `${lightUrl}/express_checkout.svg`,
20
+ icon: PAYMENT_TYPES_ICONS.EXPRESS_CHECKOUT,
12
21
  },
13
22
  {
14
23
  name: 'DEVICE',
15
24
  label: 'Device',
16
- icon: `${lightUrl}/device.svg`,
25
+ icon: PAYMENT_TYPES_ICONS.DEVICE,
17
26
  },
18
27
  {
19
28
  name: 'PT_WALLET',
20
29
  label: 'Pass-Thru Wallet',
21
- icon: `${lightUrl}/passThruWallet.svg`,
30
+ icon: PAYMENT_TYPES_ICONS.PASS_THRU_WALLET,
22
31
  },
23
32
  {
24
33
  name: 'SV_WALLET',
25
34
  label: 'Stored Value Wallet',
26
- icon: `${lightUrl}/storedValueWallet.svg`,
35
+ icon: PAYMENT_TYPES_ICONS.STORED_VALUE_WALLET,
27
36
  },
28
37
  {
29
38
  name: 'BNPL',
30
39
  label: 'Buy Now Pay Later',
31
- icon: `${lightUrl}/buyNowPayLater.svg`,
40
+ icon: PAYMENT_TYPES_ICONS.BUY_NOW_PAY_LATER,
32
41
  },
33
42
  {
34
43
  name: 'CASH',
35
44
  label: 'Cash Wallet',
36
- icon: `${lightUrl}/cash.svg`,
45
+ icon: PAYMENT_TYPES_ICONS.CASH_WALLET,
37
46
  },
38
47
  ];
48
+ export const PAYMENT_INITIATED_CUSTOMER_KEY = 'customer';
49
+ export const PAYMENT_INITIATED_MERCHANT_KEY = 'merchant';
39
50
  export const PAYMENT_INITIATED_OPTIONS = [
40
- { key: 'customer', value: 'true', label: 'Customer' },
41
- { key: 'merchant', value: 'false', label: 'Merchant' },
51
+ { key: PAYMENT_INITIATED_CUSTOMER_KEY, value: 'true', label: 'Customer' },
52
+ { key: PAYMENT_INITIATED_MERCHANT_KEY, value: 'false', label: 'Merchant' },
42
53
  ];
package/build/types/segment.d.ts CHANGED
@@ -4,3 +4,12 @@ export interface SegmentData extends Segment {
4
4
  defaultCountry?: SegmentCountry;
5
5
  defaultEntity?: Entity;
6
6
  }
7
+ export declare enum SEGMENT_CODE {
8
+ BUSINESS = "BUSINESS",
9
+ PLATFORM = "PLATFORM",
10
+ DEVELOPMENT = "DEVELOPMENT",
11
+ PAYMENT_TECHNOLOGY = "PAYMENT_TECHNOLOGY",
12
+ PAYMENT_FACILITATOR = "PAYMENT_FACILITATOR",
13
+ PAYMENT_ACQUIRER = "PAYMENT_ACQUIRER",
14
+ PAYMENT_GATEWAY = "PAYMENT_GATEWAY"
15
+ }
package/build/types/segment.js CHANGED
@@ -1 +1,10 @@
1
- export {};
1
+ export var SEGMENT_CODE;
2
+ (function (SEGMENT_CODE) {
3
+ SEGMENT_CODE["BUSINESS"] = "BUSINESS";
4
+ SEGMENT_CODE["PLATFORM"] = "PLATFORM";
5
+ SEGMENT_CODE["DEVELOPMENT"] = "DEVELOPMENT";
6
+ SEGMENT_CODE["PAYMENT_TECHNOLOGY"] = "PAYMENT_TECHNOLOGY";
7
+ SEGMENT_CODE["PAYMENT_FACILITATOR"] = "PAYMENT_FACILITATOR";
8
+ SEGMENT_CODE["PAYMENT_ACQUIRER"] = "PAYMENT_ACQUIRER";
9
+ SEGMENT_CODE["PAYMENT_GATEWAY"] = "PAYMENT_GATEWAY";
10
+ })(SEGMENT_CODE || (SEGMENT_CODE = {}));
package/build/utils/index.d.ts CHANGED
@@ -44,3 +44,4 @@ export * from './style';
44
44
  export * from './boolean';
45
45
  export * from './columnResizeStorage';
46
46
  export * from './timezone';
47
+ export * from './merchantSource';
package/build/utils/index.js CHANGED
@@ -44,3 +44,4 @@ export * from './style';
44
44
  export * from './boolean';
45
45
  export * from './columnResizeStorage';
46
46
  export * from './timezone';
47
+ export * from './merchantSource';
package/build/utils/merchantSource.d.ts ADDED
@@ -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
+ }[] | 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 {};
package/build/utils/merchantSource.js ADDED
@@ -0,0 +1,37 @@
1
+ import capitalize from 'lodash/capitalize';
2
+ import { lightUrl, PAYMENT_TYPES_ICONS } from '../constants/index.js';
3
+ import { getNameText } from './language';
4
+ export function transformPaymentMethodsData(data) {
5
+ return {
6
+ name: 'Payment Methods',
7
+ type: 'payment_methods',
8
+ options: data === null || data === void 0 ? void 0 : data.map((category) => {
9
+ var _a;
10
+ return {
11
+ name: capitalize(getNameText(category === null || category === void 0 ? void 0 : category.name)),
12
+ type: category === null || category === void 0 ? void 0 : category.code,
13
+ icon: PAYMENT_TYPES_ICONS[category.code],
14
+ options: (_a = category.payment_methods) === null || _a === void 0 ? void 0 : _a.map((method) => ({
15
+ name: getNameText(method.name),
16
+ type: method.code,
17
+ icon: `${lightUrl}/payment-method/${method.code}.svg`,
18
+ })),
19
+ };
20
+ }),
21
+ };
22
+ }
23
+ export function transformPaymentSchemesData(data = []) {
24
+ return {
25
+ name: 'Payment Schemes',
26
+ type: 'payment_scheme',
27
+ options: data
28
+ .filter((scheme) => scheme.code)
29
+ .map((scheme) => {
30
+ return {
31
+ name: getNameText(scheme === null || scheme === void 0 ? void 0 : scheme.name),
32
+ type: scheme === null || scheme === void 0 ? void 0 : scheme.code,
33
+ icon: `${lightUrl}/payment-method/${scheme.code}.svg`,
34
+ };
35
+ }),
36
+ };
37
+ }
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.306",
4
+ "version": "0.1.307",
5
5
  "testVersion": 0,
6
6
  "type": "module",
7
7
  "main": "build/index.js",