@wf-financing/ui 0.1.0 → 0.1.1

package/dist/index.es.js

@@ -90920,25 +90920,24 @@ const Htt = /* @__PURE__ */ k.forwardRef(Btt), ztt = [
       ]
     }
   ) }) }) });
-}, Xtt = async (e, t, n) => await (await Qde(e, t)).startHostedApplication(n), Ktt = () => {
-  const { companyToken: e, isMockedMode: t } = k.useContext(mH);
+}, Xtt = async (e, t, n) => {
+  let r = await n();
+  const i = await Qde(e, t);
+  return r || (r = {}), await i.startHostedApplication(r);
+}, Ktt = () => {
+  const { companyToken: e, isMockedMode: t, partnerCallback: n } = k.useContext(mH);
   return Aye({
-    mutationFn: ({
-      partnerData: n
-    }) => Xtt(e, t, n)
+    mutationFn: () => Xtt(e, t, n)
   });
 }, Jtt = ({ setOpen: e }) => {
   const { formatMessage: t } = mC(), n = Ktt(), r = () => {
-    const i = {};
-    n.mutate({
-      partnerData: i
-    }, {
-      onSuccess: (a) => {
-        const { next: o } = a;
-        window.open(o);
+    n.mutate(void 0, {
+      onSuccess: (i) => {
+        const { next: a } = i;
+        window.open(a);
       },
-      onError: (a) => {
-        console.error("Failed to start application", a);
+      onError: (i) => {
+        console.error("Failed to start application", i);
       }
     });
   };
@@ -91006,8 +91005,8 @@ const Htt = /* @__PURE__ */ k.forwardRef(Btt), ztt = [
     e && /* @__PURE__ */ Kt.jsx(qde, {})
   ] });
 }, rnt = () => {
-  const e = vH(), t = () => console.log("close widget");
-  return /* @__PURE__ */ Kt.jsx(Kt.Fragment, { children: !e.isLoading && /* @__PURE__ */ Kt.jsx(nnt, { closeWidget: t }) });
+  const e = vH();
+  return /* @__PURE__ */ Kt.jsx(Kt.Fragment, { children: !e.isLoading && /* @__PURE__ */ Kt.jsx(nnt, {}) });
 }, int = {
   "common.cancel": "Cancel",
   "ctaModal.call": "Get funded",
@@ -91025,37 +91024,38 @@ const Htt = /* @__PURE__ */ k.forwardRef(Btt), ztt = [
   "ctaModal.step3.time": "24 hrs"
 }, ant = new sJ(), ont = {
   en: int
-}, snt = ({ partnerDesignId: e, companyToken: t, isMockedMode: n }) => {
-  const r = "en", i = VL(
+}, snt = ({ partnerDesignId: e, companyToken: t, isMockedMode: n, partnerCallback: r }) => {
+  const i = "en", a = VL(
     {
-      locale: r,
-      messages: ont[r]
+      locale: i,
+      messages: ont[i]
     },
     D$()
   );
-  return /* @__PURE__ */ Kt.jsx(hye, { client: ant, children: /* @__PURE__ */ Kt.jsx(mH.Provider, { value: { companyToken: t, isMockedMode: n }, children: /* @__PURE__ */ Kt.jsx(h2e, { theme: e, intl: i, children: /* @__PURE__ */ Kt.jsx(rnt, {}) }) }) });
-}, OK = /* @__PURE__ */ new Map(), NK = (e, t, n, r) => {
-  const i = document.getElementById(e);
-  if (!i) {
+  return /* @__PURE__ */ Kt.jsx(hye, { client: ant, children: /* @__PURE__ */ Kt.jsx(mH.Provider, { value: { companyToken: t, isMockedMode: n, partnerCallback: r }, children: /* @__PURE__ */ Kt.jsx(h2e, { theme: e, intl: a, children: /* @__PURE__ */ Kt.jsx(rnt, {}) }) }) });
+}, OK = /* @__PURE__ */ new Map(), NK = (e, t, n, r, i) => {
+  const a = document.getElementById(e);
+  if (!a) {
     console.warn(`Target element with id "${e}" not found.`);
     return;
   }
-  let a = OK.get(i);
-  a || (a = lI.createRoot(i), OK.set(i, a)), a.render(
+  let o = OK.get(a);
+  o || (o = lI.createRoot(a), OK.set(a, o)), o.render(
     /* @__PURE__ */ Kt.jsx(
       snt,
       {
         partnerDesignId: t,
-        companyToken: n,
-        isMockedMode: r
+        companyToken: r,
+        isMockedMode: i,
+        partnerCallback: n
       }
     )
   );
-}, nrt = (e, t, n, r) => {
+}, nrt = (e, t, n, r, i) => {
   document.readyState === "loading" ? document.addEventListener(
     "DOMContentLoaded",
-    () => NK(e, t, n, r)
-  ) : NK(e, t, n, r);
+    () => NK(e, t, n, r, i)
+  ) : NK(e, t, n, r, i);
 };
 export {
   nrt as mount

package/index.ts

@@ -1,18 +1,20 @@
 import type { Themes } from '@wayflyer/flyui';
+import { PartnerCallbackType } from '@wf-financing/embedded-types';
 
 import { mountToTarget } from './src/main';
 
 export const mount = (
   targetId: string,
   partnerDesignId: Themes,
+  partnerCallback: PartnerCallbackType,
   companyToken: string,
   isMockedMode?: boolean,
 ) => {
   if (document.readyState === 'loading') {
     document.addEventListener('DOMContentLoaded', () =>
-      mountToTarget(targetId, partnerDesignId, companyToken, isMockedMode),
+      mountToTarget(targetId, partnerDesignId, partnerCallback, companyToken, isMockedMode),
     );
   } else {
-    mountToTarget(targetId, partnerDesignId, companyToken, isMockedMode);
+    mountToTarget(targetId, partnerDesignId, partnerCallback, companyToken, isMockedMode);
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wf-financing/ui",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "exports": {
     ".": {
       "import": "./dist/index.es.js",
@@ -23,7 +23,7 @@
     "react-aria": "^3.41.1",
     "react-intl": "^6.2.5",
     "styled-components": "^6.1.19",
-    "@wf-financing/embedded-types": "^0.1.3"
+    "@wf-financing/embedded-types": "^0.1.4"
   },
   "publishConfig": {
     "access": "public"

package/src/App.tsx

@@ -1,5 +1,6 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { FlyUIProvider, Themes } from '@wayflyer/flyui';
+import { PartnerCallbackType } from '@wf-financing/embedded-types';
 import { createIntl, createIntlCache, IntlShape } from 'react-intl';
 
 import { CtaWidget } from './CtaWidget';
@@ -10,6 +11,7 @@ type AppPropsType = {
   partnerDesignId: Themes;
   companyToken: string;
   isMockedMode?: boolean;
+  partnerCallback: PartnerCallbackType,
 };
 
 const queryClient = new QueryClient();
@@ -17,7 +19,7 @@ const messages = {
   en: enMessages,
 };
 
-export const App = ({ partnerDesignId, companyToken, isMockedMode }: AppPropsType) => {
+export const App = ({ partnerDesignId, companyToken, isMockedMode, partnerCallback }: AppPropsType) => {
   const locale = 'en';
 
   const intl: IntlShape = createIntl(
@@ -30,7 +32,7 @@ export const App = ({ partnerDesignId, companyToken, isMockedMode }: AppPropsTyp
 
   return (
     <QueryClientProvider client={queryClient}>
-      <PartnerContext.Provider value={{ companyToken, isMockedMode }}>
+      <PartnerContext.Provider value={{ companyToken, isMockedMode, partnerCallback }}>
         <FlyUIProvider theme={partnerDesignId} intl={intl}>
           <CtaWidget />
         </FlyUIProvider>

package/src/CtaWidget.tsx

@@ -3,12 +3,11 @@ import { useCtaBanner } from './hooks/useCtaBanner';
 
 export const CtaWidget = () => {
   const banner = useCtaBanner();
-  const handleCloseWidget = () => console.log('close widget');
 
   return (
     <>
       {!banner.isLoading && (
-          <CtaBanner closeWidget={handleCloseWidget} />
+          <CtaBanner />
       )}
     </>
   );

package/src/api/startHostedApplication.ts

@@ -1,9 +1,19 @@
-import { StartHostedApplicationRequestType } from '@wf-financing/embedded-types';
+import { PartnerCallbackType } from '@wf-financing/embedded-types';
 
 import { getHeadlessSdkInstance } from './getHeadlessSdkInstance';
 
-export const startHostedApplication = async (companyToken: string, isMockedMode: boolean, partnerData: StartHostedApplicationRequestType) => {
+export const startHostedApplication = async (
+  companyToken: string,
+  isMockedMode: boolean,
+  partnerCallback: PartnerCallbackType,
+) => {
+  let partnerData = await partnerCallback();
   const sdk = await getHeadlessSdkInstance(companyToken, isMockedMode);
+
+  if (!partnerData) {
+    partnerData = {};
+  }
+
   const nextUrl = await sdk.startHostedApplication(partnerData);
 
   return nextUrl;

package/src/components/modal/ModalFooter.tsx

@@ -13,16 +13,11 @@ export const ModalFooter = ({ setOpen }: ModalFooterType) => {
   const startHostedAppMutation = useStartHostedApplication();
 
   const handleStartApplication = () => {
-    const partnerData = {};
-
-    startHostedAppMutation.mutate({
-      partnerData,
-    }, {
-      onSuccess: (nextUrl: StartHostedApplicationResponseType) => {
-        const { next } = nextUrl;
-
-        window.open(next);
-      },
+  startHostedAppMutation.mutate(undefined, {
+    onSuccess: (nextUrl: StartHostedApplicationResponseType) => {
+      const { next } = nextUrl;
+      window.open(next);
+    },
       onError: (error) => {
         console.error('Failed to start application', error);
       },

package/src/hooks/useStartHostedApplication.ts

@@ -1,4 +1,4 @@
-import { StartHostedApplicationRequestType } from '@wf-financing/embedded-types';
+import { PartnerCallbackType } from '@wf-financing/embedded-types';
 import { useContext } from "react";
 
 import { PartnerContext } from "../utils/partnerContext";
@@ -6,19 +6,16 @@ import { PartnerContext } from "../utils/partnerContext";
 type PartnerDataType = {
   companyToken: string;
   isMockedMode: boolean;
+  partnerCallback: PartnerCallbackType;
 };
 
 import { useMutation } from '@tanstack/react-query';
 import { startHostedApplication } from '../api/startHostedApplication';
 
 export const useStartHostedApplication = () => {
-  const { companyToken, isMockedMode } = useContext(PartnerContext) as PartnerDataType;
+  const { companyToken, isMockedMode, partnerCallback } = useContext(PartnerContext) as PartnerDataType;
 
   return useMutation({
-    mutationFn: ({
-      partnerData,
-    }: {
-      partnerData: StartHostedApplicationRequestType;
-    }) => startHostedApplication(companyToken, isMockedMode, partnerData),
+    mutationFn: () => startHostedApplication(companyToken, isMockedMode, partnerCallback),
   });
-}
+};

package/src/main.tsx

@@ -1,11 +1,15 @@
+import type { Themes } from '@wayflyer/flyui';
+import { PartnerCallbackType } from '@wf-financing/embedded-types';
 import ReactDOM from 'react-dom/client';
+
 import { App } from './App';
 
 const roots = new Map<HTMLElement, ReactDOM.Root>();
 
 export const mountToTarget = (
   targetId: string,
-  partnerDesignId: 'wayflyer' | 'defaultTheme' | 'staff' | 'whiteLabel' | 'bigCommerce',
+  partnerDesignId: Themes,
+  partnerCallback: PartnerCallbackType,
   companyToken: string,
   isMockedMode?: boolean,
 ) => {
@@ -28,6 +32,7 @@ export const mountToTarget = (
       partnerDesignId={partnerDesignId}
       companyToken={companyToken}
       isMockedMode={isMockedMode}
+      partnerCallback={partnerCallback}
     />
   );
 };

package/src/utils/partnerContext.ts

@@ -1,8 +1,10 @@
+import { PartnerCallbackType } from '@wf-financing/embedded-types';
 import { createContext } from "react";
 
 type PartnerContextType = {
   companyToken: string;
   isMockedMode?: boolean;
+  partnerCallback: PartnerCallbackType,
 } | null;
 
 export const PartnerContext = createContext<PartnerContextType>(null);

package/tsconfig.json

@@ -2,7 +2,7 @@
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
     "rootDir": ".",
-    "baseUrl": ".",
+    "baseUrl": "."
   },
   "include": ["**/*.ts", "**.ts", "**/*.tsx", "**.tsx"],
   "exclude": ["dist", "mocks", "tests", "playground"]