@lookiero/checkout 9.9.0-beta.1 → 9.9.0-beta.2

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.
@@ -1,21 +1,23 @@
1
1
  import { FC, ForwardRefExoticComponent, PropsWithChildren, RefAttributes } from "react";
2
+ import { PaymentPayload } from "@lookiero/payments-front";
2
3
  declare const setPaymentsBridge: () => undefined;
3
4
  declare const PaymentsQueryProvider: FC<PropsWithChildren>;
4
5
  declare const PaymentInstrumentSelect: FC;
5
- interface StartLegacyBoxCheckoutCallbackArgs {
6
- readonly status: string;
7
- readonly final: boolean;
8
- }
9
6
  interface StartLegacyBoxCheckoutFunction {
10
- (paymentFlowPayload: unknown, callback: (params: StartLegacyBoxCheckoutCallbackArgs) => Promise<void>): void;
7
+ (paymentFlowPayload: unknown): void;
11
8
  }
12
9
  interface PaymentFlowRef {
13
10
  readonly startLegacyBoxCheckout: StartLegacyBoxCheckoutFunction;
14
11
  }
15
12
  declare const paymentFlowRef: PaymentFlowRef;
16
13
  declare const PaymentFlow: ForwardRefExoticComponent<RefAttributes<PaymentFlowRef>>;
14
+ interface UsePaymentStatusManagerResult {
15
+ isLoading: boolean;
16
+ consumePayload: (callback: (payload: PaymentPayload) => void) => void;
17
+ }
18
+ declare const usePaymentStatusManager: (section: Section) => UsePaymentStatusManagerResult;
17
19
  declare enum Section {
18
20
  BOX_CHECKOUT = "box-checkout"
19
21
  }
20
22
  export type { PaymentFlowRef };
21
- export { PaymentsQueryProvider, PaymentInstrumentSelect, PaymentFlow, Section, setPaymentsBridge, paymentFlowRef };
23
+ export { PaymentsQueryProvider, PaymentInstrumentSelect, PaymentFlow, Section, setPaymentsBridge, paymentFlowRef, usePaymentStatusManager, };
@@ -4,17 +4,20 @@ const setPaymentsBridge = () => void 0;
4
4
  const PaymentsQueryProvider = ({ children }) => children;
5
5
  const PaymentInstrumentSelect = () => null;
6
6
  const paymentFlowRef = {
7
- startLegacyBoxCheckout: async (_paymentFlowPayload, callback) => {
8
- await callback({ status: "EXECUTED", final: true });
9
- },
7
+ startLegacyBoxCheckout: async () => { },
10
8
  };
11
9
  const PaymentFlow = forwardRef((_props, ref) => {
12
10
  useImperativeHandle(ref, () => paymentFlowRef, []);
13
11
  return null;
14
12
  });
15
13
  PaymentFlow.displayName = "PaymentFlow";
14
+ const paymentStatusManagerResult = {
15
+ isLoading: false,
16
+ consumePayload: (callback) => callback({ success: true }),
17
+ };
18
+ const usePaymentStatusManager = () => paymentStatusManagerResult;
16
19
  var Section;
17
20
  (function (Section) {
18
21
  Section["BOX_CHECKOUT"] = "box-checkout";
19
22
  })(Section || (Section = {}));
20
- export { PaymentsQueryProvider, PaymentInstrumentSelect, PaymentFlow, Section, setPaymentsBridge, paymentFlowRef };
23
+ export { PaymentsQueryProvider, PaymentInstrumentSelect, PaymentFlow, Section, setPaymentsBridge, paymentFlowRef, usePaymentStatusManager, };
@@ -1,3 +1,4 @@
1
+ import { PortalProvider } from "@gorhom/portal";
1
2
  import { useFonts } from "expo-font";
2
3
  import "expo/build/Expo.fx";
3
4
  import React, { useCallback, useState } from "react";
@@ -24,7 +25,7 @@ const order = {
24
25
  coupon: "MYLOOKIERO",
25
26
  };
26
27
  const customer = {
27
- customerId: "9413fe3a-09fc-4264-905e-040bb7b4ca75",
28
+ customerId: "d3c2354b-9811-46d4-b2ba-5fba012ed94d",
28
29
  country: Country.ES,
29
30
  segment: Segment.WOMEN,
30
31
  email: "email@example.com",
@@ -41,7 +42,7 @@ const apiUrl = Platform.OS !== "web"
41
42
  : __DEV__
42
43
  ? "/local-to-dev"
43
44
  : "/checkout/api";
44
- const authToken = "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NTIwMjgsImV4cCI6MTczOTQ0MTYwMSwiZGlzcGxheU5hbWUiOiJNaWtlbCIsImNvdW50cnlfY29kZSI6IkVTIiwiYWNjZXNzVmlhIjoiZW1haWwiLCJzdWJzY3JpcHRpb25TdGFydGluZ0RhdGUiOiIyMDI0LTExLTE4IiwiaW1wZXJzb25hdGVkIjpmYWxzZSwidXVpZCI6Ijk0MTNmZTNhLTA5ZmMtNDI2NC05MDVlLTA0MGJiN2I0Y2E3NSIsImlhdCI6MTczNjc2MzIwMn0.ZaFu4743f9XR0aK3LgMMhbmRHNloHtC1Sm0FDUtj8B8";
45
+ const authToken = "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NDk0NjYsImV4cCI6MTc0MjQ3MDI5OSwiZGlzcGxheU5hbWUiOiJNaWtlbCIsImNvdW50cnlfY29kZSI6IkVTIiwiYWNjZXNzVmlhIjoiZW1haWwiLCJzdWJzY3JpcHRpb25TdGFydGluZ0RhdGUiOiIyMDI0LTExLTExIiwiaW1wZXJzb25hdGVkIjpmYWxzZSwidXVpZCI6ImQzYzIzNTRiLTk4MTEtNDZkNC1iMmJhLTVmYmEwMTJlZDk0ZCIsImlhdCI6MTc0MDA1MTA5OX0.AkuUZTsn9mgplQwatg0dPKyv1Hsc6r267UMahxMH19g";
45
46
  const getAuthToken = () => Promise.resolve(authToken);
46
47
  const externalTranslationsUrl = Platform.OS !== "web"
47
48
  ? "https://backend-for-user.dev.envs.lookiero.tech/api/v2/translations"
@@ -106,13 +107,14 @@ const ExpoRoot = () => {
106
107
  });
107
108
  const [isAccessible, setIsAccessible] = useState();
108
109
  const onNotAccessible = useCallback(() => setIsAccessible(false), []);
109
- return fontsLoaded ? (React.createElement(PaymentsQueryProvider, null,
110
- React.createElement(EventProvider, null,
111
- React.createElement(Aurora, null,
112
- isAccessible === false && React.createElement(Text, { heading: true }, "Checkout is not accessible!"),
113
- React.createElement(Router, null,
114
- React.createElement(Routes, null,
115
- React.createElement(Route, { path: "/checkout/*", element: React.createElement(Root, { basePath: "/checkout", customer: customer, layout: DummyLayout, locale: locale, order: order, subscription: subscription, useRedirect: useRedirect, onNotAccessible: onNotAccessible }) }),
116
- React.createElement(Route, { element: React.createElement(Navigate, { to: "/checkout", replace: true }), path: "*" }))))))) : null;
110
+ return fontsLoaded ? (React.createElement(PortalProvider, null,
111
+ React.createElement(PaymentsQueryProvider, null,
112
+ React.createElement(EventProvider, null,
113
+ React.createElement(Aurora, null,
114
+ isAccessible === false && React.createElement(Text, { heading: true }, "Checkout is not accessible!"),
115
+ React.createElement(Router, null,
116
+ React.createElement(Routes, null,
117
+ React.createElement(Route, { path: "/checkout/*", element: React.createElement(Root, { basePath: "/checkout", customer: customer, layout: DummyLayout, locale: locale, order: order, subscription: subscription, useRedirect: useRedirect, onNotAccessible: onNotAccessible }) }),
118
+ React.createElement(Route, { element: React.createElement(Navigate, { to: "/checkout", replace: true }), path: "*" })))))))) : null;
117
119
  };
118
120
  export { ExpoRoot };
@@ -1,15 +1,14 @@
1
- import { PortalProvider } from "@gorhom/portal";
1
+ import { PortalHost } from "@gorhom/portal";
2
2
  import React from "react";
3
3
  import { StatusBar } from "react-native";
4
4
  import { SafeAreaProvider } from "react-native-safe-area-context";
5
- import { PortalProvider as AuroraPortalProvider } from "@lookiero/aurora";
6
5
  import { Notifications } from "@lookiero/sty-psp-notifications";
7
6
  import { theme } from "@lookiero/sty-psp-ui";
8
7
  import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
9
8
  const { colorBgBase } = theme();
10
9
  const App = ({ children }) => (React.createElement(SafeAreaProvider, null,
11
- React.createElement(PortalProvider, { rootHostName: "Checkout" },
12
- React.createElement(StatusBar, { backgroundColor: colorBgBase, barStyle: "dark-content", translucent: true }),
13
- React.createElement(Notifications, { contextId: MESSAGING_CONTEXT_ID, portalHostName: "Checkout" }),
14
- React.createElement(AuroraPortalProvider, null, children))));
10
+ React.createElement(StatusBar, { backgroundColor: colorBgBase, barStyle: "dark-content", translucent: true }),
11
+ React.createElement(Notifications, { contextId: MESSAGING_CONTEXT_ID, portalHostName: "Checkout" }),
12
+ React.createElement(PortalHost, { name: "Checkout" }),
13
+ children));
15
14
  export { App };
@@ -1 +1 @@
1
- export declare const VERSION = "9.9.0-beta.1";
1
+ export declare const VERSION = "9.9.0-beta.2";
@@ -1 +1 @@
1
- export const VERSION = "9.9.0-beta.1";
1
+ export const VERSION = "9.9.0-beta.2";
@@ -7,34 +7,57 @@ import {
7
7
  RefAttributes,
8
8
  useImperativeHandle,
9
9
  } from "react";
10
+ import { PaymentPayload } from "@lookiero/payments-front";
10
11
 
11
12
  const setPaymentsBridge = () => void 0;
12
13
  const PaymentsQueryProvider: FC<PropsWithChildren> = ({ children }) => children;
13
14
  const PaymentInstrumentSelect: FC = () => null;
14
- interface StartLegacyBoxCheckoutCallbackArgs {
15
- readonly status: string;
16
- readonly final: boolean;
17
- }
15
+
18
16
  interface StartLegacyBoxCheckoutFunction {
19
- (paymentFlowPayload: unknown, callback: (params: StartLegacyBoxCheckoutCallbackArgs) => Promise<void>): void;
17
+ (paymentFlowPayload: unknown): void;
20
18
  }
19
+
21
20
  interface PaymentFlowRef {
22
21
  readonly startLegacyBoxCheckout: StartLegacyBoxCheckoutFunction;
23
22
  }
23
+
24
24
  const paymentFlowRef: PaymentFlowRef = {
25
- startLegacyBoxCheckout: async (_paymentFlowPayload, callback) => {
26
- await callback({ status: "EXECUTED", final: true });
27
- },
25
+ startLegacyBoxCheckout: async () => {},
28
26
  };
27
+
29
28
  const PaymentFlow: ForwardRefExoticComponent<RefAttributes<PaymentFlowRef>> = forwardRef<PaymentFlowRef, unknown>(
30
29
  (_props, ref) => {
31
30
  useImperativeHandle(ref, () => paymentFlowRef, []);
32
31
  return null;
33
32
  },
34
33
  );
34
+
35
35
  PaymentFlow.displayName = "PaymentFlow";
36
+
37
+ interface UsePaymentStatusManagerResult {
38
+ isLoading: boolean;
39
+ consumePayload: (callback: (payload: PaymentPayload) => void) => void;
40
+ }
41
+
42
+ const paymentStatusManagerResult: UsePaymentStatusManagerResult = {
43
+ isLoading: false,
44
+ consumePayload: (callback) => callback({ success: true } as PaymentPayload),
45
+ };
46
+
47
+ const usePaymentStatusManager: (section: Section) => UsePaymentStatusManagerResult = () => paymentStatusManagerResult;
48
+
36
49
  enum Section {
37
50
  BOX_CHECKOUT = "box-checkout",
38
51
  }
52
+
39
53
  export type { PaymentFlowRef };
40
- export { PaymentsQueryProvider, PaymentInstrumentSelect, PaymentFlow, Section, setPaymentsBridge, paymentFlowRef };
54
+
55
+ export {
56
+ PaymentsQueryProvider,
57
+ PaymentInstrumentSelect,
58
+ PaymentFlow,
59
+ Section,
60
+ setPaymentsBridge,
61
+ paymentFlowRef,
62
+ usePaymentStatusManager,
63
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lookiero/checkout",
3
- "version": "9.9.0-beta.1",
3
+ "version": "9.9.0-beta.2",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "sideEffects": "false",
@@ -46,7 +46,7 @@
46
46
  "@cypress/webpack-preprocessor": "^6.0.2",
47
47
  "@lookiero/eslint-config-sty-psp": "*",
48
48
  "@lookiero/event": "^0.3",
49
- "@lookiero/payments-front": "7.0.0-LK-37736-2025.2.12.160011",
49
+ "@lookiero/payments-front": "7.0.0-ideal-integration-2025.2.24.164234",
50
50
  "@lookiero/sty-psp-jest-config": "*",
51
51
  "@lookiero/sty-psp-prettier-config": "*",
52
52
  "@lookiero/sty-psp-scripts": "*",
package/src/ExpoRoot.tsx CHANGED
@@ -1,3 +1,4 @@
1
+ import { PortalProvider } from "@gorhom/portal";
1
2
  import { useFonts } from "expo-font";
2
3
  import "expo/build/Expo.fx";
3
4
  import React, { FC, useCallback, useState } from "react";
@@ -32,7 +33,7 @@ const order: Order = {
32
33
  };
33
34
 
34
35
  const customer: Customer = {
35
- customerId: "9413fe3a-09fc-4264-905e-040bb7b4ca75",
36
+ customerId: "d3c2354b-9811-46d4-b2ba-5fba012ed94d",
36
37
  country: Country.ES,
37
38
  segment: Segment.WOMEN,
38
39
  email: "email@example.com",
@@ -53,7 +54,7 @@ const apiUrl =
53
54
  ? "/local-to-dev"
54
55
  : "/checkout/api";
55
56
  const authToken =
56
- "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NTIwMjgsImV4cCI6MTczOTQ0MTYwMSwiZGlzcGxheU5hbWUiOiJNaWtlbCIsImNvdW50cnlfY29kZSI6IkVTIiwiYWNjZXNzVmlhIjoiZW1haWwiLCJzdWJzY3JpcHRpb25TdGFydGluZ0RhdGUiOiIyMDI0LTExLTE4IiwiaW1wZXJzb25hdGVkIjpmYWxzZSwidXVpZCI6Ijk0MTNmZTNhLTA5ZmMtNDI2NC05MDVlLTA0MGJiN2I0Y2E3NSIsImlhdCI6MTczNjc2MzIwMn0.ZaFu4743f9XR0aK3LgMMhbmRHNloHtC1Sm0FDUtj8B8";
57
+ "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjU2NDk0NjYsImV4cCI6MTc0MjQ3MDI5OSwiZGlzcGxheU5hbWUiOiJNaWtlbCIsImNvdW50cnlfY29kZSI6IkVTIiwiYWNjZXNzVmlhIjoiZW1haWwiLCJzdWJzY3JpcHRpb25TdGFydGluZ0RhdGUiOiIyMDI0LTExLTExIiwiaW1wZXJzb25hdGVkIjpmYWxzZSwidXVpZCI6ImQzYzIzNTRiLTk4MTEtNDZkNC1iMmJhLTVmYmEwMTJlZDk0ZCIsImlhdCI6MTc0MDA1MTA5OX0.AkuUZTsn9mgplQwatg0dPKyv1Hsc6r267UMahxMH19g";
57
58
  const getAuthToken = () => Promise.resolve(authToken);
58
59
 
59
60
  const externalTranslationsUrl =
@@ -131,35 +132,37 @@ const ExpoRoot: FC = () => {
131
132
  const onNotAccessible = useCallback(() => setIsAccessible(false), []);
132
133
 
133
134
  return fontsLoaded ? (
134
- <PaymentsQueryProvider>
135
- <EventProvider>
136
- <Aurora>
137
- {isAccessible === false && <Text heading={true}>Checkout is not accessible!</Text>}
135
+ <PortalProvider>
136
+ <PaymentsQueryProvider>
137
+ <EventProvider>
138
+ <Aurora>
139
+ {isAccessible === false && <Text heading={true}>Checkout is not accessible!</Text>}
138
140
 
139
- <Router>
140
- <Routes>
141
- <Route
142
- path="/checkout/*"
143
- element={
144
- <Root
145
- basePath="/checkout"
146
- customer={customer}
147
- layout={DummyLayout}
148
- locale={locale}
149
- order={order}
150
- subscription={subscription}
151
- useRedirect={useRedirect}
152
- onNotAccessible={onNotAccessible}
153
- />
154
- }
155
- />
141
+ <Router>
142
+ <Routes>
143
+ <Route
144
+ path="/checkout/*"
145
+ element={
146
+ <Root
147
+ basePath="/checkout"
148
+ customer={customer}
149
+ layout={DummyLayout}
150
+ locale={locale}
151
+ order={order}
152
+ subscription={subscription}
153
+ useRedirect={useRedirect}
154
+ onNotAccessible={onNotAccessible}
155
+ />
156
+ }
157
+ />
156
158
 
157
- <Route element={<Navigate to="/checkout" replace />} path="*" />
158
- </Routes>
159
- </Router>
160
- </Aurora>
161
- </EventProvider>
162
- </PaymentsQueryProvider>
159
+ <Route element={<Navigate to="/checkout" replace />} path="*" />
160
+ </Routes>
161
+ </Router>
162
+ </Aurora>
163
+ </EventProvider>
164
+ </PaymentsQueryProvider>
165
+ </PortalProvider>
163
166
  ) : null;
164
167
  };
165
168
 
@@ -1,8 +1,7 @@
1
- import { PortalProvider } from "@gorhom/portal";
1
+ import { PortalHost } from "@gorhom/portal";
2
2
  import React, { FC } from "react";
3
3
  import { StatusBar } from "react-native";
4
4
  import { SafeAreaProvider } from "react-native-safe-area-context";
5
- import { PortalProvider as AuroraPortalProvider } from "@lookiero/aurora";
6
5
  import { Notifications } from "@lookiero/sty-psp-notifications";
7
6
  import { theme } from "@lookiero/sty-psp-ui";
8
7
  import { MESSAGING_CONTEXT_ID } from "../../delivery/baseBootstrap";
@@ -15,17 +14,10 @@ interface AppProps {
15
14
 
16
15
  const App: FC<AppProps> = ({ children }) => (
17
16
  <SafeAreaProvider>
18
- <PortalProvider rootHostName="Checkout">
19
- <StatusBar backgroundColor={colorBgBase} barStyle="dark-content" translucent />
20
- <Notifications contextId={MESSAGING_CONTEXT_ID} portalHostName="Checkout" />
21
- {/*
22
- We are using the Aurora's PortalProvider at this level for notifications to work properly.
23
-
24
- PaymentInstrumentSelect uses Aurora's Portal, and if we rely on UAF's Portal (injected by <Aurora>)
25
- notifications would be displayed in a layer below Portal's one (not visible).
26
- */}
27
- <AuroraPortalProvider>{children}</AuroraPortalProvider>
28
- </PortalProvider>
17
+ <StatusBar backgroundColor={colorBgBase} barStyle="dark-content" translucent />
18
+ <Notifications contextId={MESSAGING_CONTEXT_ID} portalHostName="Checkout" />
19
+ <PortalHost name="Checkout" />
20
+ {children}
29
21
  </SafeAreaProvider>
30
22
  );
31
23