react-native-unit-components 1.7.1 → 1.8.0

package/lib/module/styles/fonts.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["FontWeight","UnitSDK","getFontWeightName","familyFonts","fontWeight","fontWeightNumber","Number","selectedFontWeight","Regular","valueOf","minDistance","forEach","fontData","currDistance","Math","abs","Thin","ExtraLight","Light","Medium","SemiBold","Bold","ExtraBold","Black","getFontName","fontFamily","fontsInApp","getFonts","Error","fontWeightName"],"sources":["fonts.ts"],"sourcesContent":["import { FontWeight, UNFontData } from '../types/shared';\nimport { UnitSDK } from '../unitSdkManager/UnitSdkManager';\n\nconst getFontWeightName = (familyFonts: UNFontData[], fontWeight?: number | string) => {\n  /**\n   * Given family variants and the required weight\n   * Return the closet font that defined by the client.\n   */\n  if (!fontWeight || fontWeight === 'normal') return 'Regular';\n\n  if (fontWeight === 'bold') return 'Bold';\n\n  const fontWeightNumber = Number(fontWeight);\n\n  // Select the closet variant\n  let selectedFontWeight = FontWeight.Regular.valueOf();\n  let minDistance = 1000;\n\n  familyFonts.forEach((fontData: UNFontData) => {\n    const currDistance = Math.abs(fontData.fontWeight - fontWeightNumber);\n    if (currDistance < minDistance) {\n      minDistance = currDistance;\n      selectedFontWeight = fontData.fontWeight.valueOf();\n    }\n  });\n\n  // FontWeight to String\n  switch (selectedFontWeight) {\n    case FontWeight.Thin:\n      return 'Thin';\n    case  FontWeight.ExtraLight:\n      return 'ExtraLight';\n    case FontWeight.Light:\n      return 'Light';\n    case FontWeight.Regular:\n      return 'Regular';\n    case FontWeight.Medium:\n      return 'Medium';\n    case FontWeight.SemiBold:\n      return 'SemiBold';\n    case FontWeight.Bold:\n      return 'Bold';\n    case FontWeight.ExtraBold:\n      return 'ExtraBold';\n    case FontWeight.Black:\n      return 'Black';\n    default:\n      return 'Regular';\n  }\n};\n\nexport const getFontName = (fontFamily: string, fontWeight: number | string): string => {\n  /*\n   * Get the font family name and the font weight name from the THEME object.\n   * Then, return a possible font.\n  */\n\n  const fontsInApp = UnitSDK.getFonts();\n  if (!fontsInApp) {\n    throw new Error('Fonts are not found in the app');\n  }\n\n  const familyFonts = fontsInApp[fontFamily];\n  if (!familyFonts) {\n    throw new Error(`Font family ${fontFamily} not found in the app's fonts`);\n  }\n\n  const fontWeightName = getFontWeightName(familyFonts, fontWeight);\n  return `${fontFamily}-${fontWeightName}`;\n};\n"],"mappings":"AAAA,SAASA,UAAU,QAAoB,iBAAiB;AACxD,SAASC,OAAO,QAAQ,kCAAkC;AAE1D,MAAMC,iBAAiB,GAAGA,CAACC,WAAyB,EAAEC,UAA4B,KAAK;EACrF;AACF;AACA;AACA;EACE,IAAI,CAACA,UAAU,IAAIA,UAAU,KAAK,QAAQ,EAAE,OAAO,SAAS;EAE5D,IAAIA,UAAU,KAAK,MAAM,EAAE,OAAO,MAAM;EAExC,MAAMC,gBAAgB,GAAGC,MAAM,CAACF,UAAU,CAAC;;EAE3C;EACA,IAAIG,kBAAkB,GAAGP,UAAU,CAACQ,OAAO,CAACC,OAAO,EAAE;EACrD,IAAIC,WAAW,GAAG,IAAI;EAEtBP,WAAW,CAACQ,OAAO,CAAEC,QAAoB,IAAK;IAC5C,MAAMC,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACH,QAAQ,CAACR,UAAU,GAAGC,gBAAgB,CAAC;IACrE,IAAIQ,YAAY,GAAGH,WAAW,EAAE;MAC9BA,WAAW,GAAGG,YAAY;MAC1BN,kBAAkB,GAAGK,QAAQ,CAACR,UAAU,CAACK,OAAO,EAAE;IACpD;EACF,CAAC,CAAC;;EAEF;EACA,QAAQF,kBAAkB;IACxB,KAAKP,UAAU,CAACgB,IAAI;MAClB,OAAO,MAAM;IACf,KAAMhB,UAAU,CAACiB,UAAU;MACzB,OAAO,YAAY;IACrB,KAAKjB,UAAU,CAACkB,KAAK;MACnB,OAAO,OAAO;IAChB,KAAKlB,UAAU,CAACQ,OAAO;MACrB,OAAO,SAAS;IAClB,KAAKR,UAAU,CAACmB,MAAM;MACpB,OAAO,QAAQ;IACjB,KAAKnB,UAAU,CAACoB,QAAQ;MACtB,OAAO,UAAU;IACnB,KAAKpB,UAAU,CAACqB,IAAI;MAClB,OAAO,MAAM;IACf,KAAKrB,UAAU,CAACsB,SAAS;MACvB,OAAO,WAAW;IACpB,KAAKtB,UAAU,CAACuB,KAAK;MACnB,OAAO,OAAO;IAChB;MACE,OAAO,SAAS;EAAC;AAEvB,CAAC;AAED,OAAO,MAAMC,WAAW,GAAGA,CAACC,UAAkB,EAAErB,UAA2B,KAAa;EACtF;AACF;AACA;AACA;;EAEE,MAAMsB,UAAU,GAAGzB,OAAO,CAAC0B,QAAQ,EAAE;EACrC,IAAI,CAACD,UAAU,EAAE;IACf,MAAM,IAAIE,KAAK,CAAC,gCAAgC,CAAC;EACnD;EAEA,MAAMzB,WAAW,GAAGuB,UAAU,CAACD,UAAU,CAAC;EAC1C,IAAI,CAACtB,WAAW,EAAE;IAChB,MAAM,IAAIyB,KAAK,CAAE,eAAcH,UAAW,+BAA8B,CAAC;EAC3E;EAEA,MAAMI,cAAc,GAAG3B,iBAAiB,CAACC,WAAW,EAAEC,UAAU,CAAC;EACjE,OAAQ,GAAEqB,UAAW,IAAGI,cAAe,EAAC;AAC1C,CAAC"}

package/lib/module/types/shared/fonts.types.js

@@ -0,0 +1,13 @@
+export let FontWeight;
+(function (FontWeight) {
+  FontWeight[FontWeight["Thin"] = 100] = "Thin";
+  FontWeight[FontWeight["ExtraLight"] = 200] = "ExtraLight";
+  FontWeight[FontWeight["Light"] = 300] = "Light";
+  FontWeight[FontWeight["Regular"] = 400] = "Regular";
+  FontWeight[FontWeight["Medium"] = 500] = "Medium";
+  FontWeight[FontWeight["SemiBold"] = 600] = "SemiBold";
+  FontWeight[FontWeight["Bold"] = 700] = "Bold";
+  FontWeight[FontWeight["ExtraBold"] = 800] = "ExtraBold";
+  FontWeight[FontWeight["Black"] = 900] = "Black";
+})(FontWeight || (FontWeight = {}));
+//# sourceMappingURL=fonts.types.js.map

package/lib/module/types/shared/fonts.types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["FontWeight"],"sources":["fonts.types.ts"],"sourcesContent":["export type UNFonts = {\n  [fontFamily: string]: UNFontData[];\n}\n\nexport type UNFontData = {\n  // Using 'field' instead of 'key' to account for potential variants unrelated to font weight.\n  fontWeight: FontWeight;\n  sources: UNFontSource[];\n}\n\nexport type UNFontSource = {\n  // using the fileName for iOS and relative path for Android\n  fileName: string;\n  assetDirRelativePath: string;\n  format?: string;\n}\n\nexport enum FontWeight {\n  Thin = 100,\n  ExtraLight = 200,\n  Light = 300,\n  Regular = 400,\n  Medium = 500,\n  SemiBold = 600,\n  Bold = 700,\n  ExtraBold = 800,\n  Black = 900\n}\n"],"mappings":"AAiBA,WAAYA,UAAU;AAUrB,WAVWA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;EAAVA,UAAU,CAAVA,UAAU;AAAA,GAAVA,UAAU,KAAVA,UAAU"}

package/lib/module/types/shared/index.js

@@ -5,4 +5,6 @@ export * from './achCredit.types';
 export * from './payments.types';
 export * from './account.types';
 export * from './checkDeposit.types';
+export * from './activity.types';
+export * from './fonts.types';
 //# sourceMappingURL=index.js.map

package/lib/module/types/shared/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from './bookPayment.types';\nexport * from './card.types';\nexport * from './onLoadResponse.types';\nexport * from './achCredit.types';\nexport * from './payments.types';\nexport * from './account.types';\nexport * from './checkDeposit.types';\n"],"mappings":"AAAA,cAAc,qBAAqB;AACnC,cAAc,cAAc;AAC5B,cAAc,wBAAwB;AACtC,cAAc,mBAAmB;AACjC,cAAc,kBAAkB;AAChC,cAAc,iBAAiB;AAC/B,cAAc,sBAAsB"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from './bookPayment.types';\nexport * from './card.types';\nexport * from './onLoadResponse.types';\nexport * from './achCredit.types';\nexport * from './payments.types';\nexport * from './account.types';\nexport * from './checkDeposit.types';\nexport * from './activity.types';\nexport * from './fonts.types';\n"],"mappings":"AAAA,cAAc,qBAAqB;AACnC,cAAc,cAAc;AAC5B,cAAc,wBAAwB;AACtC,cAAc,mBAAmB;AACjC,cAAc,kBAAkB;AAChC,cAAc,iBAAiB;AAC/B,cAAc,sBAAsB;AACpC,cAAc,kBAAkB;AAChC,cAAc,eAAe"}

package/lib/module/unitSdkManager/UnitSdkManager.js

@@ -20,14 +20,16 @@ _defineProperty(UnitSDK, "env", void 0);
 _defineProperty(UnitSDK, "customerToken", void 0);
 _defineProperty(UnitSDK, "theme", void 0);
 _defineProperty(UnitSDK, "language", void 0);
+_defineProperty(UnitSDK, "fonts", void 0);
 _defineProperty(UnitSDK, "signedNonce", void 0);
 _defineProperty(UnitSDK, "pushProvisionModule", void 0);
 _defineProperty(UnitSDK, "ui", void 0);
-_defineProperty(UnitSDK, "init", async (env, theme, language) => {
+_defineProperty(UnitSDK, "init", async (env, theme, language, fonts) => {
   try {
     UnitSDK.env = env;
     UnitSDK.theme = theme;
     UnitSDK.language = language;
+    UnitSDK.fonts = fonts;
     UnitSDK.ui = new UnitUiManager();
     await fetchUnitScript();
     EventBus.Instance.event(SDKMessage.IS_SDK_INITIALIZED, {});
@@ -53,6 +55,9 @@ _defineProperty(UnitSDK, "getTheme", () => {
 _defineProperty(UnitSDK, "getLanguage", () => {
   return UnitSDK.language;
 });
+_defineProperty(UnitSDK, "getFonts", () => {
+  return UnitSDK.fonts;
+});
 _defineProperty(UnitSDK, "getSignedNonce", () => {
   return UnitSDK.signedNonce;
 });

package/lib/module/unitSdkManager/UnitSdkManager.js.map

@@ -1 +1 @@
-{"version":3,"names":["EventBus","SDKMessage","fetchUnitScript","UnitUiManager","UNEnvironment","UNIT_WEB_VERSION","UNIT_SCRIPT_URL","sandbox","production","UnitSDK","_defineProperty","env","theme","language","ui","Instance","event","IS_SDK_INITIALIZED","e","console","log","pushProvisionModule","signedNonce","customerToken"],"sources":["UnitSdkManager.ts"],"sourcesContent":["import type { NativeModules } from 'react-native';\nimport EventBus from '../helpers/EventBus';\nimport { SDKMessage } from '../messages/nativeMessages/sdkMessage';\nimport { fetchUnitScript } from './UnitSdk.api';\nimport { UnitUiManager } from './unitUiManager/unitUiManager';\n\nexport enum UNEnvironment {\n  sandbox = 'sandbox',\n  production = 'production'\n}\n\nconst UNIT_WEB_VERSION = '1';\n\nexport const UNIT_SCRIPT_URL = {\n  [UNEnvironment.sandbox]: `https://ui.s.unit.sh/release/${UNIT_WEB_VERSION}/components.js`,\n  [UNEnvironment.production]: `https://ui.unit.co/release/${UNIT_WEB_VERSION}/components.js`\n};\nexport class UnitSDK {\n  protected static env?: UNEnvironment;\n  protected static customerToken?: string;\n  protected static theme?: string;\n  protected static language?: string;\n\n  protected static signedNonce?: string;\n  protected static pushProvisionModule?: typeof NativeModules;\n\n  public static ui: UnitUiManager;\n\n  public static init = async (env: UNEnvironment, theme?: string, language?: string) => {\n    try {\n      this.env = env;\n      this.theme = theme;\n      this.language = language;\n      this.ui = new UnitUiManager();\n      await fetchUnitScript();\n      EventBus.Instance.event(SDKMessage.IS_SDK_INITIALIZED, {});\n    } catch (e) {\n      console.log(e);\n    }\n  };\n\n  public static setPushProvisioningModule = (pushProvisionModule: typeof NativeModules) => {\n    this.pushProvisionModule = pushProvisionModule;\n  };\n\n  public static getPushProvisionModule = () => {\n    return this.pushProvisionModule;\n  };\n\n  public static setSignedNonce = (signedNonce: string) => {\n    this.signedNonce = signedNonce;\n  };\n\n  public static getEnv = () => {\n    return this.env;\n  };\n\n  public static getTheme = () => {\n    return this.theme;\n  };\n\n  public static getLanguage = () => {\n    return this.language;\n  };\n\n  public static getSignedNonce = () => {\n    return this.signedNonce;\n  };\n\n  public static setCustomerToken = (customerToken: string) => {\n    this.customerToken = customerToken;\n  };\n\n  public static getCustomerToken = () => {\n    return this.customerToken;\n  };\n}\n"],"mappings":";;;AACA,OAAOA,QAAQ,MAAM,qBAAqB;AAC1C,SAASC,UAAU,QAAQ,uCAAuC;AAClE,SAASC,eAAe,QAAQ,eAAe;AAC/C,SAASC,aAAa,QAAQ,+BAA+B;AAE7D,WAAYC,aAAa;AAGxB,WAHWA,aAAa;EAAbA,aAAa;EAAbA,aAAa;AAAA,GAAbA,aAAa,KAAbA,aAAa;AAKzB,MAAMC,gBAAgB,GAAG,GAAG;AAE5B,OAAO,MAAMC,eAAe,GAAG;EAC7B,CAACF,aAAa,CAACG,OAAO,GAAI,gCAA+BF,gBAAiB,gBAAe;EACzF,CAACD,aAAa,CAACI,UAAU,GAAI,8BAA6BH,gBAAiB;AAC7E,CAAC;AACD,OAAO,MAAMI,OAAO,CAAC;AA2DpBC,eAAA,CA3DYD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO,UAWG,OAAOE,GAAkB,EAAEC,KAAc,EAAEC,QAAiB,KAAK;EACpF,IAAI;IAZKJ,OAAO,CAaTE,GAAG,GAAGA,GAAG;IAbPF,OAAO,CAcTG,KAAK,GAAGA,KAAK;IAdXH,OAAO,CAeTI,QAAQ,GAAGA,QAAQ;IAfjBJ,OAAO,CAgBTK,EAAE,GAAG,IAAIX,aAAa,EAAE;IAC7B,MAAMD,eAAe,EAAE;IACvBF,QAAQ,CAACe,QAAQ,CAACC,KAAK,CAACf,UAAU,CAACgB,kBAAkB,EAAE,CAAC,CAAC,CAAC;EAC5D,CAAC,CAAC,OAAOC,CAAC,EAAE;IACVC,OAAO,CAACC,GAAG,CAACF,CAAC,CAAC;EAChB;AACF,CAAC;AAAAR,eAAA,CAtBUD,OAAO,+BAwByBY,mBAAyC,IAAK;EAxB9EZ,OAAO,CAyBXY,mBAAmB,GAAGA,mBAAmB;AAChD,CAAC;AAAAX,eAAA,CA1BUD,OAAO,4BA4BqB,MAAM;EAC3C,OA7BSA,OAAO,CA6BJY,mBAAmB;AACjC,CAAC;AAAAX,eAAA,CA9BUD,OAAO,oBAgCca,WAAmB,IAAK;EAhC7Cb,OAAO,CAiCXa,WAAW,GAAGA,WAAW;AAChC,CAAC;AAAAZ,eAAA,CAlCUD,OAAO,YAoCK,MAAM;EAC3B,OArCSA,OAAO,CAqCJE,GAAG;AACjB,CAAC;AAAAD,eAAA,CAtCUD,OAAO,cAwCO,MAAM;EAC7B,OAzCSA,OAAO,CAyCJG,KAAK;AACnB,CAAC;AAAAF,eAAA,CA1CUD,OAAO,iBA4CU,MAAM;EAChC,OA7CSA,OAAO,CA6CJI,QAAQ;AACtB,CAAC;AAAAH,eAAA,CA9CUD,OAAO,oBAgDa,MAAM;EACnC,OAjDSA,OAAO,CAiDJa,WAAW;AACzB,CAAC;AAAAZ,eAAA,CAlDUD,OAAO,sBAoDgBc,aAAqB,IAAK;EApDjDd,OAAO,CAqDXc,aAAa,GAAGA,aAAa;AACpC,CAAC;AAAAb,eAAA,CAtDUD,OAAO,sBAwDe,MAAM;EACrC,OAzDSA,OAAO,CAyDJc,aAAa;AAC3B,CAAC"}
+{"version":3,"names":["EventBus","SDKMessage","fetchUnitScript","UnitUiManager","UNEnvironment","UNIT_WEB_VERSION","UNIT_SCRIPT_URL","sandbox","production","UnitSDK","_defineProperty","env","theme","language","fonts","ui","Instance","event","IS_SDK_INITIALIZED","e","console","log","pushProvisionModule","signedNonce","customerToken"],"sources":["UnitSdkManager.ts"],"sourcesContent":["import type { NativeModules } from 'react-native';\nimport EventBus from '../helpers/EventBus';\nimport { SDKMessage } from '../messages/nativeMessages/sdkMessage';\nimport { fetchUnitScript } from './UnitSdk.api';\nimport { UnitUiManager } from './unitUiManager/unitUiManager';\nimport type { UNFonts } from '../types/shared/fonts.types';\n\nexport enum UNEnvironment {\n  sandbox = 'sandbox',\n  production = 'production'\n}\n\nconst UNIT_WEB_VERSION = '1';\n\nexport const UNIT_SCRIPT_URL = {\n  [UNEnvironment.sandbox]: `https://ui.s.unit.sh/release/${UNIT_WEB_VERSION}/components.js`,\n  [UNEnvironment.production]: `https://ui.unit.co/release/${UNIT_WEB_VERSION}/components.js`\n};\nexport class UnitSDK {\n  protected static env?: UNEnvironment;\n  protected static customerToken?: string;\n  protected static theme?: string;\n  protected static language?: string;\n  protected static fonts?: UNFonts;\n\n  protected static signedNonce?: string;\n  protected static pushProvisionModule?: typeof NativeModules;\n\n  public static ui: UnitUiManager;\n\n  public static init = async (env: UNEnvironment, theme?: string, language?: string, fonts?: UNFonts) => {\n    try {\n      this.env = env;\n      this.theme = theme;\n      this.language = language;\n      this.fonts = fonts;\n\n      this.ui = new UnitUiManager();\n      await fetchUnitScript();\n      EventBus.Instance.event(SDKMessage.IS_SDK_INITIALIZED, {});\n    } catch (e) {\n      console.log(e);\n    }\n  };\n\n  public static setPushProvisioningModule = (pushProvisionModule: typeof NativeModules) => {\n    this.pushProvisionModule = pushProvisionModule;\n  };\n\n  public static getPushProvisionModule = () => {\n    return this.pushProvisionModule;\n  };\n\n  public static setSignedNonce = (signedNonce: string) => {\n    this.signedNonce = signedNonce;\n  };\n\n  public static getEnv = () => {\n    return this.env;\n  };\n\n  public static getTheme = () => {\n    return this.theme;\n  };\n\n  public static getLanguage = () => {\n    return this.language;\n  };\n\n  public static getFonts = () => {\n    return this.fonts;\n  };\n\n  public static getSignedNonce = () => {\n    return this.signedNonce;\n  };\n\n  public static setCustomerToken = (customerToken: string) => {\n    this.customerToken = customerToken;\n  };\n\n  public static getCustomerToken = () => {\n    return this.customerToken;\n  };\n}\n"],"mappings":";;;AACA,OAAOA,QAAQ,MAAM,qBAAqB;AAC1C,SAASC,UAAU,QAAQ,uCAAuC;AAClE,SAASC,eAAe,QAAQ,eAAe;AAC/C,SAASC,aAAa,QAAQ,+BAA+B;AAG7D,WAAYC,aAAa;AAGxB,WAHWA,aAAa;EAAbA,aAAa;EAAbA,aAAa;AAAA,GAAbA,aAAa,KAAbA,aAAa;AAKzB,MAAMC,gBAAgB,GAAG,GAAG;AAE5B,OAAO,MAAMC,eAAe,GAAG;EAC7B,CAACF,aAAa,CAACG,OAAO,GAAI,gCAA+BF,gBAAiB,gBAAe;EACzF,CAACD,aAAa,CAACI,UAAU,GAAI,8BAA6BH,gBAAiB;AAC7E,CAAC;AACD,OAAO,MAAMI,OAAO,CAAC;AAkEpBC,eAAA,CAlEYD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO;AAAAC,eAAA,CAAPD,OAAO,UAYG,OAAOE,GAAkB,EAAEC,KAAc,EAAEC,QAAiB,EAAEC,KAAe,KAAK;EACrG,IAAI;IAbKL,OAAO,CAcTE,GAAG,GAAGA,GAAG;IAdPF,OAAO,CAeTG,KAAK,GAAGA,KAAK;IAfXH,OAAO,CAgBTI,QAAQ,GAAGA,QAAQ;IAhBjBJ,OAAO,CAiBTK,KAAK,GAAGA,KAAK;IAjBXL,OAAO,CAmBTM,EAAE,GAAG,IAAIZ,aAAa,EAAE;IAC7B,MAAMD,eAAe,EAAE;IACvBF,QAAQ,CAACgB,QAAQ,CAACC,KAAK,CAAChB,UAAU,CAACiB,kBAAkB,EAAE,CAAC,CAAC,CAAC;EAC5D,CAAC,CAAC,OAAOC,CAAC,EAAE;IACVC,OAAO,CAACC,GAAG,CAACF,CAAC,CAAC;EAChB;AACF,CAAC;AAAAT,eAAA,CAzBUD,OAAO,+BA2ByBa,mBAAyC,IAAK;EA3B9Eb,OAAO,CA4BXa,mBAAmB,GAAGA,mBAAmB;AAChD,CAAC;AAAAZ,eAAA,CA7BUD,OAAO,4BA+BqB,MAAM;EAC3C,OAhCSA,OAAO,CAgCJa,mBAAmB;AACjC,CAAC;AAAAZ,eAAA,CAjCUD,OAAO,oBAmCcc,WAAmB,IAAK;EAnC7Cd,OAAO,CAoCXc,WAAW,GAAGA,WAAW;AAChC,CAAC;AAAAb,eAAA,CArCUD,OAAO,YAuCK,MAAM;EAC3B,OAxCSA,OAAO,CAwCJE,GAAG;AACjB,CAAC;AAAAD,eAAA,CAzCUD,OAAO,cA2CO,MAAM;EAC7B,OA5CSA,OAAO,CA4CJG,KAAK;AACnB,CAAC;AAAAF,eAAA,CA7CUD,OAAO,iBA+CU,MAAM;EAChC,OAhDSA,OAAO,CAgDJI,QAAQ;AACtB,CAAC;AAAAH,eAAA,CAjDUD,OAAO,cAmDO,MAAM;EAC7B,OApDSA,OAAO,CAoDJK,KAAK;AACnB,CAAC;AAAAJ,eAAA,CArDUD,OAAO,oBAuDa,MAAM;EACnC,OAxDSA,OAAO,CAwDJc,WAAW;AACzB,CAAC;AAAAb,eAAA,CAzDUD,OAAO,sBA2DgBe,aAAqB,IAAK;EA3DjDf,OAAO,CA4DXe,aAAa,GAAGA,aAAa;AACpC,CAAC;AAAAd,eAAA,CA7DUD,OAAO,sBA+De,MAAM;EACrC,OAhESA,OAAO,CAgEJe,aAAa;AAC3B,CAAC"}

package/lib/module/webComponent/WebComponent.js

@@ -11,6 +11,7 @@ import { fetchUnitScript, globalUnitScript } from '../unitSdkManager/UnitSdk.api
 import { UnitSDK } from '../unitSdkManager/UnitSdkManager';
 import { SDKMessage } from '../messages/nativeMessages/sdkMessage';
 import { handleRequestDownload } from './WebComponent.utils';
+import { getFontFacesString } from '../scripts/html/fontFaces';
 const {
   UNAppInfo
 } = NativeModules;
@@ -61,7 +62,9 @@ export const WebComponent = /*#__PURE__*/React.forwardRef(function WebComponent(
     const themeParam = componentCurrentTheme ? ` theme="${componentCurrentTheme}"` : '';
     const languageParam = componentCurrentLanguage ? ` language="${componentCurrentLanguage}"` : '';
     const componentParams = (props.params || '') + themeParam + languageParam;
+    const fontFaces = getFontFacesString(UnitSDK.getFonts());
     let newHtml = html.replace(HTML_PLACEHOLDER.BODY, getHtmlBody(props.type.valueOf(), componentParams, props.presentationMode));
+    newHtml = newHtml.replace(HTML_PLACEHOLDER.FONT_FACES, fontFaces);
     newHtml = newHtml.replace(HTML_PLACEHOLDER.SCRIPT_FROM_NATIVE, props.script || '');
     newHtml = newHtml.replace(HTML_PLACEHOLDER.WINDOW_PARAMS, props.windowParams || '');
     setSourceHtml(newHtml);
@@ -110,7 +113,7 @@ export const WebComponent = /*#__PURE__*/React.forwardRef(function WebComponent(
     },
     source: {
       html: sourceHtml,
-      baseUrl: `https://${baseName}`
+      baseUrl: Platform.OS === 'android' ? `https://${baseName}` : ''
     },
     onMessage: onMessage,
     androidHardwareAccelerationDisabled: true

package/lib/module/webComponent/WebComponent.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useState","NativeModules","Platform","WebView","EventBus","html","HTML_PLACEHOLDER","UnitMessage","useListenerToBus","getHtmlBody","fetchUnitScript","globalUnitScript","UnitSDK","SDKMessage","handleRequestDownload","UNAppInfo","WebComponent","forwardRef","props","webRef","unitScript","setUnitScript","sourceHtml","setSourceHtml","componentCurrentTheme","setComponentCurrentTheme","theme","getTheme","componentCurrentLanguage","setComponentCurrentLanguage","language","getLanguage","baseName","setBaseName","updateUnitScript","data","updateInitializedParams","busEventKey","IS_SCRIPT_FETCHED","action","IS_SDK_INITIALIZED","getAppName","OS","name","getBundleName","replace","error","console","themeParam","languageParam","componentParams","params","newHtml","BODY","type","valueOf","presentationMode","SCRIPT_FROM_NATIVE","script","WINDOW_PARAMS","windowParams","onMessage","e","message","JSON","parse","nativeEvent","UNIT_REQUEST_REFRESH","details","Instance","event","UNIT_REQUEST_DOWNLOAD","UNIT_REQUEST_CLOSE_FLOW","_onScroll","handleScroll","createElement","ref","originWhitelist","mediaPlaybackRequiresUserAction","allowsInlineMediaPlayback","cacheEnabled","scrollEnabled","isScrollable","nestedScrollEnabled","onScroll","overScrollMode","injectedJavaScript","style","width","flex","opacity","backgroundColor","source","baseUrl","androidHardwareAccelerationDisabled"],"sources":["WebComponent.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useEffect, useState } from 'react';\nimport { NativeModules, Platform } from 'react-native';\nimport { WebView, WebViewMessageEvent } from 'react-native-webview';\nimport EventBus from '../helpers/EventBus';\nimport html, { HTML_PLACEHOLDER } from './html';\nimport { RequestRefreshEvent, UnitMessage, RequestDownloadEvent } from '../messages/webMessages/unitMessages';\nimport { useListenerToBus } from '../hooks/listenerToBus';\nimport { getHtmlBody } from '../scripts/html/bodyHtml';\nimport { fetchUnitScript, globalUnitScript } from '../unitSdkManager/UnitSdk.api';\nimport { UnitSDK } from '../unitSdkManager/UnitSdkManager';\nimport type { WebViewMessage } from '../messages/webMessages';\nimport { SDKMessage, SdkScriptFetched } from '../messages/nativeMessages/sdkMessage';\nimport { handleRequestDownload } from './WebComponent.utils';\nimport type { PresentationMode, WebComponentType } from '../types/internal/webComponent.types';\n\nconst { UNAppInfo } = NativeModules;\n\nexport interface WebComponentProps {\n  type: WebComponentType;\n  presentationMode?: PresentationMode,\n  params?: string;\n  theme?: string;\n  language?: string;\n  onMessage?: (message: WebViewMessage) => void;\n  script?: string;\n  isScrollable?: boolean,\n  nestedScrollEnabled?: boolean,\n  handleScroll?: (event: any) => void,\n  windowParams?: string;\n}\n\nexport const WebComponent = React.forwardRef<WebView, WebComponentProps>(function WebComponent(props, webRef) {\n  const [unitScript, setUnitScript] = useState<string | undefined>(globalUnitScript);\n  const [sourceHtml, setSourceHtml] = useState<string | null>(null);\n  const [componentCurrentTheme, setComponentCurrentTheme] = useState<string | undefined>(props.theme ?? UnitSDK.getTheme());\n  const [componentCurrentLanguage, setComponentCurrentLanguage] = useState<string | undefined>(props.language ?? UnitSDK.getLanguage());\n  const [baseName, setBaseName] = useState<string>();\n\n  const updateUnitScript = (data: SdkScriptFetched) => {\n    setUnitScript(data.unitScript);\n  };\n\n  const updateInitializedParams = () => {\n    setComponentCurrentTheme(props.theme ?? UnitSDK.getTheme());\n    setComponentCurrentLanguage(props.language ?? UnitSDK.getLanguage());\n  };\n\n  useListenerToBus({ busEventKey: SDKMessage.IS_SCRIPT_FETCHED, action: updateUnitScript });\n  useListenerToBus({ busEventKey: SDKMessage.IS_SDK_INITIALIZED, action: updateInitializedParams });\n\n  useEffect(() => {\n\n    const getAppName = async () => {\n      // For iOS, we extend the app name from the HTML to display a prettier access request message.\n      // On Android, there is no request message sent from HTML.\n      try {\n        if (Platform.OS == 'ios') {\n          const name = await UNAppInfo.getBundleName();\n          setBaseName(name.replace(/ /g, '-'));\n        } else { // android\n          setBaseName('unit');\n        }\n      } catch (error: any) {\n        console.error(error);\n      }\n    };\n\n    getAppName();\n  }, []);\n\n  useEffect(() => {\n    if (!unitScript) {\n      fetchUnitScript();\n      return;\n    }\n\n    const themeParam = componentCurrentTheme ? ` theme=\"${componentCurrentTheme}\"` : '';\n    const languageParam = componentCurrentLanguage ? ` language=\"${componentCurrentLanguage}\"` : '';\n\n    const componentParams = (props.params || '') + themeParam + languageParam;\n    let newHtml = html.replace(HTML_PLACEHOLDER.BODY, getHtmlBody(props.type.valueOf(), componentParams, props.presentationMode));\n    newHtml = newHtml.replace(HTML_PLACEHOLDER.SCRIPT_FROM_NATIVE, props.script || '');\n    newHtml = newHtml.replace(HTML_PLACEHOLDER.WINDOW_PARAMS, props.windowParams || '');\n    setSourceHtml(newHtml);\n  }, [props.params, unitScript, props.presentationMode, componentCurrentTheme, componentCurrentLanguage, props.script, props.windowParams]);\n\n  const onMessage = (e: WebViewMessageEvent) => {\n    const message = JSON.parse(e.nativeEvent.data) as WebViewMessage;\n    switch (message.type) {\n      case UnitMessage.UNIT_REQUEST_REFRESH:\n        message.details &&\n          EventBus.Instance.event(UnitMessage.UNIT_REQUEST_REFRESH, message.details as RequestRefreshEvent);\n        break;\n      case UnitMessage.UNIT_REQUEST_DOWNLOAD:\n        message.details &&\n          handleRequestDownload(message.details as RequestDownloadEvent, () => {\n            EventBus.Instance.event(UnitMessage.UNIT_REQUEST_CLOSE_FLOW, {});\n          });\n        break;\n      default:\n        props.onMessage && props.onMessage(message);\n    }\n  };\n\n  if (!sourceHtml) return null;\n\n  const _onScroll = (event: any) => {\n    if (props.handleScroll) {\n      props.handleScroll(event);\n    }\n\n    return null;\n  };\n\n  if (!baseName) {\n    return null;\n  }\n\n  return (\n    <WebView\n      ref={webRef}\n      originWhitelist={['*']}\n      mediaPlaybackRequiresUserAction={false}\n      allowsInlineMediaPlayback={true}\n      cacheEnabled={false}\n      scrollEnabled={props.isScrollable}\n      nestedScrollEnabled={props.nestedScrollEnabled}\n      onScroll={_onScroll}\n      overScrollMode=\"never\"\n      injectedJavaScript={unitScript}\n      style={{ width: '100%', flex: 1, opacity: 0.99, backgroundColor: 'transparent' }}\n      source={{ html: sourceHtml, baseUrl: `https://${baseName}` }}\n      onMessage={onMessage}\n      androidHardwareAccelerationDisabled\n    />\n  );\n});\n"],"mappings":"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"}
+{"version":3,"names":["React","useEffect","useState","NativeModules","Platform","WebView","EventBus","html","HTML_PLACEHOLDER","UnitMessage","useListenerToBus","getHtmlBody","fetchUnitScript","globalUnitScript","UnitSDK","SDKMessage","handleRequestDownload","getFontFacesString","UNAppInfo","WebComponent","forwardRef","props","webRef","unitScript","setUnitScript","sourceHtml","setSourceHtml","componentCurrentTheme","setComponentCurrentTheme","theme","getTheme","componentCurrentLanguage","setComponentCurrentLanguage","language","getLanguage","baseName","setBaseName","updateUnitScript","data","updateInitializedParams","busEventKey","IS_SCRIPT_FETCHED","action","IS_SDK_INITIALIZED","getAppName","OS","name","getBundleName","replace","error","console","themeParam","languageParam","componentParams","params","fontFaces","getFonts","newHtml","BODY","type","valueOf","presentationMode","FONT_FACES","SCRIPT_FROM_NATIVE","script","WINDOW_PARAMS","windowParams","onMessage","e","message","JSON","parse","nativeEvent","UNIT_REQUEST_REFRESH","details","Instance","event","UNIT_REQUEST_DOWNLOAD","UNIT_REQUEST_CLOSE_FLOW","_onScroll","handleScroll","createElement","ref","originWhitelist","mediaPlaybackRequiresUserAction","allowsInlineMediaPlayback","cacheEnabled","scrollEnabled","isScrollable","nestedScrollEnabled","onScroll","overScrollMode","injectedJavaScript","style","width","flex","opacity","backgroundColor","source","baseUrl","androidHardwareAccelerationDisabled"],"sources":["WebComponent.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useEffect, useState } from 'react';\nimport { NativeModules, Platform } from 'react-native';\nimport { WebView, WebViewMessageEvent } from 'react-native-webview';\nimport EventBus from '../helpers/EventBus';\nimport html, { HTML_PLACEHOLDER } from './html';\nimport { RequestRefreshEvent, UnitMessage, RequestDownloadEvent } from '../messages/webMessages/unitMessages';\nimport { useListenerToBus } from '../hooks/listenerToBus';\nimport { getHtmlBody } from '../scripts/html/bodyHtml';\nimport { fetchUnitScript, globalUnitScript } from '../unitSdkManager/UnitSdk.api';\nimport { UnitSDK } from '../unitSdkManager/UnitSdkManager';\nimport type { WebViewMessage } from '../messages/webMessages';\nimport { SDKMessage, SdkScriptFetched } from '../messages/nativeMessages/sdkMessage';\nimport { handleRequestDownload } from './WebComponent.utils';\nimport type { PresentationMode, WebComponentType } from '../types/internal/webComponent.types';\nimport { getFontFacesString } from '../scripts/html/fontFaces';\n\nconst { UNAppInfo } = NativeModules;\n\nexport interface WebComponentProps {\n  type: WebComponentType;\n  presentationMode?: PresentationMode,\n  params?: string;\n  theme?: string;\n  language?: string;\n  onMessage?: (message: WebViewMessage) => void;\n  script?: string;\n  isScrollable?: boolean,\n  nestedScrollEnabled?: boolean,\n  handleScroll?: (event: any) => void,\n  windowParams?: string;\n}\n\nexport const WebComponent = React.forwardRef<WebView, WebComponentProps>(function WebComponent(props, webRef) {\n  const [unitScript, setUnitScript] = useState<string | undefined>(globalUnitScript);\n  const [sourceHtml, setSourceHtml] = useState<string | null>(null);\n  const [componentCurrentTheme, setComponentCurrentTheme] = useState<string | undefined>(props.theme ?? UnitSDK.getTheme());\n  const [componentCurrentLanguage, setComponentCurrentLanguage] = useState<string | undefined>(props.language ?? UnitSDK.getLanguage());\n  const [baseName, setBaseName] = useState<string>();\n\n  const updateUnitScript = (data: SdkScriptFetched) => {\n    setUnitScript(data.unitScript);\n  };\n\n  const updateInitializedParams = () => {\n    setComponentCurrentTheme(props.theme ?? UnitSDK.getTheme());\n    setComponentCurrentLanguage(props.language ?? UnitSDK.getLanguage());\n  };\n\n  useListenerToBus({ busEventKey: SDKMessage.IS_SCRIPT_FETCHED, action: updateUnitScript });\n  useListenerToBus({ busEventKey: SDKMessage.IS_SDK_INITIALIZED, action: updateInitializedParams });\n\n  useEffect(() => {\n\n    const getAppName = async () => {\n      // For iOS, we extend the app name from the HTML to display a prettier access request message.\n      // On Android, there is no request message sent from HTML.\n      try {\n        if (Platform.OS == 'ios') {\n          const name = await UNAppInfo.getBundleName();\n          setBaseName(name.replace(/ /g, '-'));\n        } else { // android\n          setBaseName('unit');\n        }\n      } catch (error: any) {\n        console.error(error);\n      }\n    };\n\n    getAppName();\n  }, []);\n\n  useEffect(() => {\n    if (!unitScript) {\n      fetchUnitScript();\n      return;\n    }\n\n    const themeParam = componentCurrentTheme ? ` theme=\"${componentCurrentTheme}\"` : '';\n    const languageParam = componentCurrentLanguage ? ` language=\"${componentCurrentLanguage}\"` : '';\n\n    const componentParams = (props.params || '') + themeParam + languageParam;\n\n    const fontFaces = getFontFacesString(UnitSDK.getFonts());\n\n    let newHtml = html.replace(HTML_PLACEHOLDER.BODY, getHtmlBody(props.type.valueOf(), componentParams, props.presentationMode));\n    newHtml = newHtml.replace(HTML_PLACEHOLDER.FONT_FACES, fontFaces);\n    newHtml = newHtml.replace(HTML_PLACEHOLDER.SCRIPT_FROM_NATIVE, props.script || '');\n    newHtml = newHtml.replace(HTML_PLACEHOLDER.WINDOW_PARAMS, props.windowParams || '');\n    setSourceHtml(newHtml);\n  }, [props.params, unitScript, props.presentationMode, componentCurrentTheme, componentCurrentLanguage, props.script, props.windowParams]);\n\n  const onMessage = (e: WebViewMessageEvent) => {\n    const message = JSON.parse(e.nativeEvent.data) as WebViewMessage;\n    switch (message.type) {\n      case UnitMessage.UNIT_REQUEST_REFRESH:\n        message.details &&\n          EventBus.Instance.event(UnitMessage.UNIT_REQUEST_REFRESH, message.details as RequestRefreshEvent);\n        break;\n      case UnitMessage.UNIT_REQUEST_DOWNLOAD:\n        message.details &&\n          handleRequestDownload(message.details as RequestDownloadEvent, () => {\n            EventBus.Instance.event(UnitMessage.UNIT_REQUEST_CLOSE_FLOW, {});\n          });\n        break;\n      default:\n        props.onMessage && props.onMessage(message);\n    }\n  };\n\n  if (!sourceHtml) return null;\n\n  const _onScroll = (event: any) => {\n    if (props.handleScroll) {\n      props.handleScroll(event);\n    }\n\n    return null;\n  };\n\n  if (!baseName) {\n    return null;\n  }\n\n  return (\n    <WebView\n      ref={webRef}\n      originWhitelist={['*']}\n      mediaPlaybackRequiresUserAction={false}\n      allowsInlineMediaPlayback={true}\n      cacheEnabled={false}\n      scrollEnabled={props.isScrollable}\n      nestedScrollEnabled={props.nestedScrollEnabled}\n      onScroll={_onScroll}\n      overScrollMode=\"never\"\n      injectedJavaScript={unitScript}\n      style={{ width: '100%', flex: 1, opacity: 0.99, backgroundColor: 'transparent' }}\n      source={{ html: sourceHtml, baseUrl: Platform.OS === 'android' ?  `https://${baseName}` : ''}}\n      onMessage={onMessage}\n      androidHardwareAccelerationDisabled\n    />\n  );\n});\n"],"mappings":"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"}

package/lib/module/webComponent/html.js

@@ -4,7 +4,8 @@ export const HTML_PLACEHOLDER = {
   SCRIPT_UNIT: '<SCRIPT_UNIT>',
   BODY: '<BODY_HTML_CODE>',
   SCRIPT_FROM_NATIVE: '<SCRIPT_FROM_NATIVE>',
-  WINDOW_PARAMS: '<WINDOW_PARAMS>'
+  WINDOW_PARAMS: '<WINDOW_PARAMS>',
+  FONT_FACES: '<FONT_FACES>'
 };
 const htmlText = `
   <!DOCTYPE html>
@@ -21,9 +22,17 @@ const htmlText = `
     ${HTML_PLACEHOLDER.WINDOW_PARAMS}
     </script>
     <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
+
+    <style type="text/css">
+      ${HTML_PLACEHOLDER.FONT_FACES}
+
+      body {
+        margin: 0;
+      }
+    </style>
   </head>
 
-  <body style="margin: 0;">
+  <body>
     ${HTML_PLACEHOLDER.BODY}
 
     <script>

package/lib/module/webComponent/html.js.map

@@ -1 +1 @@
-{"version":3,"names":["Platform","DISPATCH_RENDERING_EVENT","LISTENERS","POST_MESSAGE_TO_SDK","POST_PAGE_HEIGHT","DISPATCH_REQUEST_CARD_ACTION","DISPATCH_OPEN_ACTIONS_MENU","DISPATCH_REQUEST_ACCOUNT_ACTION","DISPATCH_ACTIVITY_FILTER_CHANGED_EVENT","HTML_PLACEHOLDER","SCRIPT_UNIT","BODY","SCRIPT_FROM_NATIVE","WINDOW_PARAMS","htmlText","OS","isPageLoaded","onLoad","unitRequestDownload","requestRendering","requestOpenLink","requestCloseFlow","cardActivated","cardStatusChange","unitRequestExternalSdk","unitAccountChanged","unitActivityFiltersChanged"],"sources":["html.ts"],"sourcesContent":["import { Platform } from 'react-native';\nimport { DISPATCH_RENDERING_EVENT, LISTENERS, POST_MESSAGE_TO_SDK, POST_PAGE_HEIGHT, DISPATCH_REQUEST_CARD_ACTION, DISPATCH_OPEN_ACTIONS_MENU, DISPATCH_REQUEST_ACCOUNT_ACTION, DISPATCH_ACTIVITY_FILTER_CHANGED_EVENT } from '../scripts/html/bodyScript';\n\nexport const HTML_PLACEHOLDER = {\n  SCRIPT_UNIT: '<SCRIPT_UNIT>',\n  BODY: '<BODY_HTML_CODE>',\n  SCRIPT_FROM_NATIVE: '<SCRIPT_FROM_NATIVE>',\n  WINDOW_PARAMS: '<WINDOW_PARAMS>'\n};\n\nconst htmlText = `\n  <!DOCTYPE html>\n  <html lang=\"en\">\n\n  <head lang=\"en\">\n    <title>Unit Web SDK Demo</title>\n    <script>\n    window.UnitMobileSDK = true\n    window.UnitMobileSDKConfig = {\n      os: \"${Platform.OS}\",\n      walletName: \"${Platform.OS === 'ios' ? 'Apple' : 'Google'}\",\n    }\n    ${HTML_PLACEHOLDER.WINDOW_PARAMS}\n    </script>\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=0\">\n  </head>\n\n  <body style=\"margin: 0;\">\n    ${HTML_PLACEHOLDER.BODY}\n\n    <script>\n      ${POST_MESSAGE_TO_SDK}\n\n      ${POST_PAGE_HEIGHT}\n\n      ${LISTENERS.isPageLoaded}\n\n      ${LISTENERS.onLoad}\n\n      ${LISTENERS.unitRequestDownload}\n\n      ${LISTENERS.requestRendering}\n\n      ${LISTENERS.requestOpenLink}\n\n      ${LISTENERS.requestCloseFlow}\n\n      ${LISTENERS.cardActivated}\n\n      ${LISTENERS.cardStatusChange}\n\n      ${LISTENERS.unitRequestExternalSdk}\n\n      ${LISTENERS.unitAccountChanged}\n\n      ${LISTENERS.unitActivityFiltersChanged}\n\n      ${DISPATCH_RENDERING_EVENT}\n\n      ${DISPATCH_OPEN_ACTIONS_MENU}\n\n      ${DISPATCH_REQUEST_CARD_ACTION}\n\n      ${DISPATCH_ACTIVITY_FILTER_CHANGED_EVENT}\n\n      ${DISPATCH_REQUEST_ACCOUNT_ACTION}\n\n      ${HTML_PLACEHOLDER.SCRIPT_FROM_NATIVE}\n    </script>\n  </body>\n  </html>\n`;\n\nexport default htmlText;\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,cAAc;AACvC,SAASC,wBAAwB,EAAEC,SAAS,EAAEC,mBAAmB,EAAEC,gBAAgB,EAAEC,4BAA4B,EAAEC,0BAA0B,EAAEC,+BAA+B,EAAEC,sCAAsC,QAAQ,4BAA4B;AAE1P,OAAO,MAAMC,gBAAgB,GAAG;EAC9BC,WAAW,EAAE,eAAe;EAC5BC,IAAI,EAAE,kBAAkB;EACxBC,kBAAkB,EAAE,sBAAsB;EAC1CC,aAAa,EAAE;AACjB,CAAC;AAED,MAAMC,QAAQ,GAAI;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAad,QAAQ,CAACe,EAAG;AACzB,qBAAqBf,QAAQ,CAACe,EAAE,KAAK,KAAK,GAAG,OAAO,GAAG,QAAS;AAChE;AACA,MAAMN,gBAAgB,CAACI,aAAc;AACrC;AACA;AACA;AACA;AACA;AACA,MAAMJ,gBAAgB,CAACE,IAAK;AAC5B;AACA;AACA,QAAQR,mBAAoB;AAC5B;AACA,QAAQC,gBAAiB;AACzB;AACA,QAAQF,SAAS,CAACc,YAAa;AAC/B;AACA,QAAQd,SAAS,CAACe,MAAO;AACzB;AACA,QAAQf,SAAS,CAACgB,mBAAoB;AACtC;AACA,QAAQhB,SAAS,CAACiB,gBAAiB;AACnC;AACA,QAAQjB,SAAS,CAACkB,eAAgB;AAClC;AACA,QAAQlB,SAAS,CAACmB,gBAAiB;AACnC;AACA,QAAQnB,SAAS,CAACoB,aAAc;AAChC;AACA,QAAQpB,SAAS,CAACqB,gBAAiB;AACnC;AACA,QAAQrB,SAAS,CAACsB,sBAAuB;AACzC;AACA,QAAQtB,SAAS,CAACuB,kBAAmB;AACrC;AACA,QAAQvB,SAAS,CAACwB,0BAA2B;AAC7C;AACA,QAAQzB,wBAAyB;AACjC;AACA,QAAQK,0BAA2B;AACnC;AACA,QAAQD,4BAA6B;AACrC;AACA,QAAQG,sCAAuC;AAC/C;AACA,QAAQD,+BAAgC;AACxC;AACA,QAAQE,gBAAgB,CAACG,kBAAmB;AAC5C;AACA;AACA;AACA,CAAC;AAED,eAAeE,QAAQ"}
+{"version":3,"names":["Platform","DISPATCH_RENDERING_EVENT","LISTENERS","POST_MESSAGE_TO_SDK","POST_PAGE_HEIGHT","DISPATCH_REQUEST_CARD_ACTION","DISPATCH_OPEN_ACTIONS_MENU","DISPATCH_REQUEST_ACCOUNT_ACTION","DISPATCH_ACTIVITY_FILTER_CHANGED_EVENT","HTML_PLACEHOLDER","SCRIPT_UNIT","BODY","SCRIPT_FROM_NATIVE","WINDOW_PARAMS","FONT_FACES","htmlText","OS","isPageLoaded","onLoad","unitRequestDownload","requestRendering","requestOpenLink","requestCloseFlow","cardActivated","cardStatusChange","unitRequestExternalSdk","unitAccountChanged","unitActivityFiltersChanged"],"sources":["html.ts"],"sourcesContent":["import { Platform } from 'react-native';\nimport { DISPATCH_RENDERING_EVENT, LISTENERS, POST_MESSAGE_TO_SDK, POST_PAGE_HEIGHT, DISPATCH_REQUEST_CARD_ACTION, DISPATCH_OPEN_ACTIONS_MENU, DISPATCH_REQUEST_ACCOUNT_ACTION, DISPATCH_ACTIVITY_FILTER_CHANGED_EVENT } from '../scripts/html/bodyScript';\n\nexport const HTML_PLACEHOLDER = {\n  SCRIPT_UNIT: '<SCRIPT_UNIT>',\n  BODY: '<BODY_HTML_CODE>',\n  SCRIPT_FROM_NATIVE: '<SCRIPT_FROM_NATIVE>',\n  WINDOW_PARAMS: '<WINDOW_PARAMS>',\n  FONT_FACES: '<FONT_FACES>'\n};\n\nconst htmlText = `\n  <!DOCTYPE html>\n  <html lang=\"en\">\n\n  <head lang=\"en\">\n    <title>Unit Web SDK Demo</title>\n    <script>\n    window.UnitMobileSDK = true\n    window.UnitMobileSDKConfig = {\n      os: \"${Platform.OS}\",\n      walletName: \"${Platform.OS === 'ios' ? 'Apple' : 'Google'}\",\n    }\n    ${HTML_PLACEHOLDER.WINDOW_PARAMS}\n    </script>\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=0\">\n\n    <style type=\"text/css\">\n      ${HTML_PLACEHOLDER.FONT_FACES}\n\n      body {\n        margin: 0;\n      }\n    </style>\n  </head>\n\n  <body>\n    ${HTML_PLACEHOLDER.BODY}\n\n    <script>\n      ${POST_MESSAGE_TO_SDK}\n\n      ${POST_PAGE_HEIGHT}\n\n      ${LISTENERS.isPageLoaded}\n\n      ${LISTENERS.onLoad}\n\n      ${LISTENERS.unitRequestDownload}\n\n      ${LISTENERS.requestRendering}\n\n      ${LISTENERS.requestOpenLink}\n\n      ${LISTENERS.requestCloseFlow}\n\n      ${LISTENERS.cardActivated}\n\n      ${LISTENERS.cardStatusChange}\n\n      ${LISTENERS.unitRequestExternalSdk}\n\n      ${LISTENERS.unitAccountChanged}\n\n      ${LISTENERS.unitActivityFiltersChanged}\n\n      ${DISPATCH_RENDERING_EVENT}\n\n      ${DISPATCH_OPEN_ACTIONS_MENU}\n\n      ${DISPATCH_REQUEST_CARD_ACTION}\n\n      ${DISPATCH_ACTIVITY_FILTER_CHANGED_EVENT}\n\n      ${DISPATCH_REQUEST_ACCOUNT_ACTION}\n\n      ${HTML_PLACEHOLDER.SCRIPT_FROM_NATIVE}\n    </script>\n  </body>\n  </html>\n`;\n\nexport default htmlText;\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,cAAc;AACvC,SAASC,wBAAwB,EAAEC,SAAS,EAAEC,mBAAmB,EAAEC,gBAAgB,EAAEC,4BAA4B,EAAEC,0BAA0B,EAAEC,+BAA+B,EAAEC,sCAAsC,QAAQ,4BAA4B;AAE1P,OAAO,MAAMC,gBAAgB,GAAG;EAC9BC,WAAW,EAAE,eAAe;EAC5BC,IAAI,EAAE,kBAAkB;EACxBC,kBAAkB,EAAE,sBAAsB;EAC1CC,aAAa,EAAE,iBAAiB;EAChCC,UAAU,EAAE;AACd,CAAC;AAED,MAAMC,QAAQ,GAAI;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAaf,QAAQ,CAACgB,EAAG;AACzB,qBAAqBhB,QAAQ,CAACgB,EAAE,KAAK,KAAK,GAAG,OAAO,GAAG,QAAS;AAChE;AACA,MAAMP,gBAAgB,CAACI,aAAc;AACrC;AACA;AACA;AACA;AACA,QAAQJ,gBAAgB,CAACK,UAAW;AACpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAML,gBAAgB,CAACE,IAAK;AAC5B;AACA;AACA,QAAQR,mBAAoB;AAC5B;AACA,QAAQC,gBAAiB;AACzB;AACA,QAAQF,SAAS,CAACe,YAAa;AAC/B;AACA,QAAQf,SAAS,CAACgB,MAAO;AACzB;AACA,QAAQhB,SAAS,CAACiB,mBAAoB;AACtC;AACA,QAAQjB,SAAS,CAACkB,gBAAiB;AACnC;AACA,QAAQlB,SAAS,CAACmB,eAAgB;AAClC;AACA,QAAQnB,SAAS,CAACoB,gBAAiB;AACnC;AACA,QAAQpB,SAAS,CAACqB,aAAc;AAChC;AACA,QAAQrB,SAAS,CAACsB,gBAAiB;AACnC;AACA,QAAQtB,SAAS,CAACuB,sBAAuB;AACzC;AACA,QAAQvB,SAAS,CAACwB,kBAAmB;AACrC;AACA,QAAQxB,SAAS,CAACyB,0BAA2B;AAC7C;AACA,QAAQ1B,wBAAyB;AACjC;AACA,QAAQK,0BAA2B;AACnC;AACA,QAAQD,4BAA6B;AACrC;AACA,QAAQG,sCAAuC;AAC/C;AACA,QAAQD,+BAAgC;AACxC;AACA,QAAQE,gBAAgB,CAACG,kBAAmB;AAC5C;AACA;AACA;AACA,CAAC;AAED,eAAeG,QAAQ"}

package/lib/typescript/scripts/html/fontFaces.d.ts

@@ -0,0 +1,2 @@
+import type { UNFonts } from '../../types/shared/fonts.types';
+export declare const getFontFacesString: (fonts?: UNFonts) => string;

package/lib/typescript/styles/fonts.d.ts

@@ -0,0 +1 @@
+export declare const getFontName: (fontFamily: string, fontWeight: number | string) => string;

package/lib/typescript/types/shared/fonts.types.d.ts

@@ -0,0 +1,23 @@
+export type UNFonts = {
+    [fontFamily: string]: UNFontData[];
+};
+export type UNFontData = {
+    fontWeight: FontWeight;
+    sources: UNFontSource[];
+};
+export type UNFontSource = {
+    fileName: string;
+    assetDirRelativePath: string;
+    format?: string;
+};
+export declare enum FontWeight {
+    Thin = 100,
+    ExtraLight = 200,
+    Light = 300,
+    Regular = 400,
+    Medium = 500,
+    SemiBold = 600,
+    Bold = 700,
+    ExtraBold = 800,
+    Black = 900
+}

package/lib/typescript/types/shared/index.d.ts

@@ -5,3 +5,5 @@ export * from './achCredit.types';
 export * from './payments.types';
 export * from './account.types';
 export * from './checkDeposit.types';
+export * from './activity.types';
+export * from './fonts.types';

package/lib/typescript/unitSdkManager/UnitSdkManager.d.ts

@@ -1,5 +1,6 @@
 import type { NativeModules } from 'react-native';
 import { UnitUiManager } from './unitUiManager/unitUiManager';
+import type { UNFonts } from '../types/shared/fonts.types';
 export declare enum UNEnvironment {
     sandbox = "sandbox",
     production = "production"
@@ -13,16 +14,18 @@ export declare class UnitSDK {
     protected static customerToken?: string;
     protected static theme?: string;
     protected static language?: string;
+    protected static fonts?: UNFonts;
     protected static signedNonce?: string;
     protected static pushProvisionModule?: typeof NativeModules;
     static ui: UnitUiManager;
-    static init: (env: UNEnvironment, theme?: string, language?: string) => Promise<void>;
+    static init: (env: UNEnvironment, theme?: string, language?: string, fonts?: UNFonts) => Promise<void>;
     static setPushProvisioningModule: (pushProvisionModule: typeof NativeModules) => void;
     static getPushProvisionModule: () => import("react-native").NativeModulesStatic | undefined;
     static setSignedNonce: (signedNonce: string) => void;
     static getEnv: () => UNEnvironment | undefined;
     static getTheme: () => string | undefined;
     static getLanguage: () => string | undefined;
+    static getFonts: () => UNFonts | undefined;
     static getSignedNonce: () => string | undefined;
     static setCustomerToken: (customerToken: string) => void;
     static getCustomerToken: () => string | undefined;

package/lib/typescript/webComponent/html.d.ts

@@ -3,6 +3,7 @@ export declare const HTML_PLACEHOLDER: {
     BODY: string;
     SCRIPT_FROM_NATIVE: string;
     WINDOW_PARAMS: string;
+    FONT_FACES: string;
 };
 declare const htmlText: string;
 export default htmlText;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-unit-components",
-  "version": "1.7.1",
+  "version": "1.8.0",
   "description": "Unit React Native components",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

package/src/helpers/pushProvisioningService/hooks/useCardWallet.ts

@@ -20,7 +20,7 @@ export const useCardWallet = (cardId: string) => {
       return encryptedPayload;
     };
 
-    const getCardWalletData = async ()  => {
+    const getCardWalletData = async () => {
       const currentProvisioningModule = UnitSDK.getPushProvisionModule();
       if (!currentProvisioningModule) return;
       try {
@@ -46,7 +46,7 @@ export const useCardWallet = (cardId: string) => {
 
 };
 
-const parseWalletsResponse = (walletsResponse: string): UNWallet | null  => {
+const parseWalletsResponse = (walletsResponse: string): UNWallet | null => {
   try {
     const parsedWalletsResponse = JSON.parse(walletsResponse);
     const wallets = parsedWalletsResponse.wallets;

package/src/scripts/html/fontFaces.ts

@@ -0,0 +1,56 @@
+import { Platform } from 'react-native';
+import type { FontWeight, UNFonts, UNFontSource, UNFontData } from '../../types/shared/fonts.types';
+
+const getUrl = (source: UNFontSource): string => {
+  if (Platform.OS == 'ios') {
+    return `url('${source.fileName}')`;
+  }
+
+  // Handle '/' of dir Relative path
+  let relativeDirPath = source.assetDirRelativePath;
+  if (source.assetDirRelativePath[-1] !== '/') {
+    relativeDirPath = `${source.assetDirRelativePath}/`;
+  }
+  if (source.assetDirRelativePath[0] !== '/') {
+    relativeDirPath = `/${source.assetDirRelativePath}`;
+  }
+
+  return `url('file:///android_asset${relativeDirPath}${source.fileName}')`;
+};
+const getFontFace = (fontFamily: string, fontWeight: FontWeight, sources: UNFontSource[]): string => {
+  const numOfSources = sources.length;
+
+  const sourcesString = sources
+    .map((source, index) => {
+      const suffix = index === numOfSources - 1 ? ';' : ',';
+      const url = getUrl(source);
+      const format = source?.format ? `format('${source.format}')` : '';
+      return `${url} ${format}${suffix}`;
+    })
+    .join('\n');
+
+  return `
+    @font-face {
+      font-family: '${fontFamily}';
+      src: ${sourcesString}
+      font-weight: ${fontWeight.valueOf()};
+    }
+  `;
+};
+
+export const getFontFacesString = (fonts?: UNFonts): string => {
+  if (!fonts) return '';
+
+  const fontFaces: string[] = [];
+
+  // Iterate over all the fonts and their variants
+  // create font-face for each variant
+  Object.entries(fonts).forEach(([familyName, familyFonts]) => {
+    familyFonts.forEach((fontData: UNFontData) => {
+      fontFaces.push(getFontFace(familyName, fontData.fontWeight, fontData.sources));
+    });
+  });
+
+  // Combine all the font faces into a single string
+  return fontFaces.join('\n');
+};

package/src/styles/fonts.ts

@@ -0,0 +1,70 @@
+import { FontWeight, UNFontData } from '../types/shared';
+import { UnitSDK } from '../unitSdkManager/UnitSdkManager';
+
+const getFontWeightName = (familyFonts: UNFontData[], fontWeight?: number | string) => {
+  /**
+   * Given family variants and the required weight
+   * Return the closet font that defined by the client.
+   */
+  if (!fontWeight || fontWeight === 'normal') return 'Regular';
+
+  if (fontWeight === 'bold') return 'Bold';
+
+  const fontWeightNumber = Number(fontWeight);
+
+  // Select the closet variant
+  let selectedFontWeight = FontWeight.Regular.valueOf();
+  let minDistance = 1000;
+
+  familyFonts.forEach((fontData: UNFontData) => {
+    const currDistance = Math.abs(fontData.fontWeight - fontWeightNumber);
+    if (currDistance < minDistance) {
+      minDistance = currDistance;
+      selectedFontWeight = fontData.fontWeight.valueOf();
+    }
+  });
+
+  // FontWeight to String
+  switch (selectedFontWeight) {
+    case FontWeight.Thin:
+      return 'Thin';
+    case  FontWeight.ExtraLight:
+      return 'ExtraLight';
+    case FontWeight.Light:
+      return 'Light';
+    case FontWeight.Regular:
+      return 'Regular';
+    case FontWeight.Medium:
+      return 'Medium';
+    case FontWeight.SemiBold:
+      return 'SemiBold';
+    case FontWeight.Bold:
+      return 'Bold';
+    case FontWeight.ExtraBold:
+      return 'ExtraBold';
+    case FontWeight.Black:
+      return 'Black';
+    default:
+      return 'Regular';
+  }
+};
+
+export const getFontName = (fontFamily: string, fontWeight: number | string): string => {
+  /*
+   * Get the font family name and the font weight name from the THEME object.
+   * Then, return a possible font.
+  */
+
+  const fontsInApp = UnitSDK.getFonts();
+  if (!fontsInApp) {
+    throw new Error('Fonts are not found in the app');
+  }
+
+  const familyFonts = fontsInApp[fontFamily];
+  if (!familyFonts) {
+    throw new Error(`Font family ${fontFamily} not found in the app's fonts`);
+  }
+
+  const fontWeightName = getFontWeightName(familyFonts, fontWeight);
+  return `${fontFamily}-${fontWeightName}`;
+};

package/src/types/shared/fonts.types.ts

@@ -0,0 +1,28 @@
+export type UNFonts = {
+  [fontFamily: string]: UNFontData[];
+}
+
+export type UNFontData = {
+  // Using 'field' instead of 'key' to account for potential variants unrelated to font weight.
+  fontWeight: FontWeight;
+  sources: UNFontSource[];
+}
+
+export type UNFontSource = {
+  // using the fileName for iOS and relative path for Android
+  fileName: string;
+  assetDirRelativePath: string;
+  format?: string;
+}
+
+export enum FontWeight {
+  Thin = 100,
+  ExtraLight = 200,
+  Light = 300,
+  Regular = 400,
+  Medium = 500,
+  SemiBold = 600,
+  Bold = 700,
+  ExtraBold = 800,
+  Black = 900
+}

package/src/types/shared/index.ts

@@ -5,3 +5,5 @@ export * from './achCredit.types';
 export * from './payments.types';
 export * from './account.types';
 export * from './checkDeposit.types';
+export * from './activity.types';
+export * from './fonts.types';

package/src/unitSdkManager/UnitSdkManager.ts

@@ -3,6 +3,7 @@ import EventBus from '../helpers/EventBus';
 import { SDKMessage } from '../messages/nativeMessages/sdkMessage';
 import { fetchUnitScript } from './UnitSdk.api';
 import { UnitUiManager } from './unitUiManager/unitUiManager';
+import type { UNFonts } from '../types/shared/fonts.types';
 
 export enum UNEnvironment {
   sandbox = 'sandbox',
@@ -20,17 +21,20 @@ export class UnitSDK {
   protected static customerToken?: string;
   protected static theme?: string;
   protected static language?: string;
+  protected static fonts?: UNFonts;
 
   protected static signedNonce?: string;
   protected static pushProvisionModule?: typeof NativeModules;
 
   public static ui: UnitUiManager;
 
-  public static init = async (env: UNEnvironment, theme?: string, language?: string) => {
+  public static init = async (env: UNEnvironment, theme?: string, language?: string, fonts?: UNFonts) => {
     try {
       this.env = env;
       this.theme = theme;
       this.language = language;
+      this.fonts = fonts;
+
       this.ui = new UnitUiManager();
       await fetchUnitScript();
       EventBus.Instance.event(SDKMessage.IS_SDK_INITIALIZED, {});
@@ -63,6 +67,10 @@ export class UnitSDK {
     return this.language;
   };
 
+  public static getFonts = () => {
+    return this.fonts;
+  };
+
   public static getSignedNonce = () => {
     return this.signedNonce;
   };

package/src/webComponent/WebComponent.tsx

@@ -13,6 +13,7 @@ import type { WebViewMessage } from '../messages/webMessages';
 import { SDKMessage, SdkScriptFetched } from '../messages/nativeMessages/sdkMessage';
 import { handleRequestDownload } from './WebComponent.utils';
 import type { PresentationMode, WebComponentType } from '../types/internal/webComponent.types';
+import { getFontFacesString } from '../scripts/html/fontFaces';
 
 const { UNAppInfo } = NativeModules;
 
@@ -79,7 +80,11 @@ export const WebComponent = React.forwardRef<WebView, WebComponentProps>(functio
     const languageParam = componentCurrentLanguage ? ` language="${componentCurrentLanguage}"` : '';
 
     const componentParams = (props.params || '') + themeParam + languageParam;
+
+    const fontFaces = getFontFacesString(UnitSDK.getFonts());
+
     let newHtml = html.replace(HTML_PLACEHOLDER.BODY, getHtmlBody(props.type.valueOf(), componentParams, props.presentationMode));
+    newHtml = newHtml.replace(HTML_PLACEHOLDER.FONT_FACES, fontFaces);
     newHtml = newHtml.replace(HTML_PLACEHOLDER.SCRIPT_FROM_NATIVE, props.script || '');
     newHtml = newHtml.replace(HTML_PLACEHOLDER.WINDOW_PARAMS, props.windowParams || '');
     setSourceHtml(newHtml);
@@ -130,7 +135,7 @@ export const WebComponent = React.forwardRef<WebView, WebComponentProps>(functio
       overScrollMode="never"
       injectedJavaScript={unitScript}
       style={{ width: '100%', flex: 1, opacity: 0.99, backgroundColor: 'transparent' }}
-      source={{ html: sourceHtml, baseUrl: `https://${baseName}` }}
+      source={{ html: sourceHtml, baseUrl: Platform.OS === 'android' ?  `https://${baseName}` : ''}}
       onMessage={onMessage}
       androidHardwareAccelerationDisabled
     />

package/src/webComponent/html.ts

@@ -5,7 +5,8 @@ export const HTML_PLACEHOLDER = {
   SCRIPT_UNIT: '<SCRIPT_UNIT>',
   BODY: '<BODY_HTML_CODE>',
   SCRIPT_FROM_NATIVE: '<SCRIPT_FROM_NATIVE>',
-  WINDOW_PARAMS: '<WINDOW_PARAMS>'
+  WINDOW_PARAMS: '<WINDOW_PARAMS>',
+  FONT_FACES: '<FONT_FACES>'
 };
 
 const htmlText = `
@@ -23,9 +24,17 @@ const htmlText = `
     ${HTML_PLACEHOLDER.WINDOW_PARAMS}
     </script>
     <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
+
+    <style type="text/css">
+      ${HTML_PLACEHOLDER.FONT_FACES}
+
+      body {
+        margin: 0;
+      }
+    </style>
   </head>
 
-  <body style="margin: 0;">
+  <body>
     ${HTML_PLACEHOLDER.BODY}
 
     <script>