react-native-unit-components 0.1.0

package/lib/commonjs/helpers/EventBus.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.BusEvent = void 0;
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+let BusEvent;
+exports.BusEvent = BusEvent;
+
+(function (BusEvent) {
+  BusEvent["REQUEST_RENDERING"] = "unitRequestRendering";
+  BusEvent["CARD_STATUS_CHANGED"] = "cardStatusChanged";
+  BusEvent["REQUEST_REFRESH"] = "requestRefresh";
+})(BusEvent || (exports.BusEvent = BusEvent = {}));
+
+class EventBus {
+  constructor() {
+    _defineProperty(this, "eventListeners", {});
+
+    this.eventListeners = {};
+  }
+
+  static get Instance() {
+    return this._instance || (this._instance = new this());
+  }
+
+  event(event, data) {
+    let listeners = this.eventListeners[event.valueOf()];
+
+    if (Array.isArray(listeners)) {
+      listeners.map(listener => {
+        if (typeof listener === 'function') {
+          listener(data);
+        }
+      });
+    }
+  }
+
+  addListener(event, listener) {
+    let listeners = this.eventListeners[event.valueOf()];
+
+    if (Array.isArray(listeners)) {
+      listeners.push(listener);
+    } else {
+      this.eventListeners[event.valueOf()] = [listener];
+    }
+  }
+
+  removeListener(listener) {
+    Object.keys(this.eventListeners).map(eventName => {
+      let listeners = this.eventListeners[eventName];
+
+      if (listeners) {
+        this._remove(listeners, listener);
+
+        if (listeners.length === 0) {
+          delete this.eventListeners[eventName];
+        }
+      }
+    });
+  }
+
+  _remove(array, item) {
+    if (!array) return;
+
+    for (let i = 0, l = array.length; i < l; i++) {
+      if (item === array[i]) array.splice(i, 1);
+    }
+  }
+
+}
+
+exports.default = EventBus;
+
+_defineProperty(EventBus, "_instance", void 0);
+//# sourceMappingURL=EventBus.js.map

package/lib/commonjs/helpers/EventBus.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BusEvent","EventBus","constructor","eventListeners","Instance","_instance","event","data","listeners","valueOf","Array","isArray","map","listener","addListener","push","removeListener","Object","keys","eventName","_remove","length","array","item","i","l","splice"],"sources":["EventBus.ts"],"sourcesContent":["export enum BusEvent {\n  REQUEST_RENDERING = 'unitRequestRendering',\n  CARD_STATUS_CHANGED = 'cardStatusChanged',\n  REQUEST_REFRESH = 'requestRefresh'\n}\n\nexport default class EventBus {\n  private static _instance: EventBus;\n\n  private eventListeners: { [name: string]: Array<(data: any) => void> } = {}\n\n  private constructor() {\n    this.eventListeners = {};\n  }\n\n  public static get Instance() {\n    return this._instance || (this._instance = new this());\n  }\n\n  public event(event: BusEvent, data: any) {\n    let listeners = this.eventListeners[event.valueOf()];\n    if (Array.isArray(listeners)) {\n      listeners.map(listener => {\n        if (typeof listener === 'function') {\n          listener(data);\n        }\n      })\n    }\n  }\n\n  public addListener(event: BusEvent, listener: (data: any) => void) {\n    let listeners = this.eventListeners[event.valueOf()];\n    if (Array.isArray(listeners)) {\n      listeners.push(listener);\n    } else {\n      this.eventListeners[event.valueOf()] = [listener];\n    }\n  }\n\n  public removeListener(listener: (data: any) => void) {\n    Object.keys(this.eventListeners).map(eventName => {\n      let listeners = this.eventListeners[eventName];\n      if (listeners) {\n        this._remove(listeners, listener);\n        if (listeners.length === 0) {\n          delete this.eventListeners[eventName];\n        }\n      }\n    })\n  }\n\n  private _remove(array: Array<(data: any) => void>, item: (data: string) => void) {\n    if (!array) return;\n    for (let i = 0, l = array.length; i < l; i++) {\n      if (item === array[i]) array.splice(i, 1);\n    }\n  }\n}\n"],"mappings":";;;;;;;;;IAAYA,Q;;;WAAAA,Q;EAAAA,Q;EAAAA,Q;EAAAA,Q;GAAAA,Q,wBAAAA,Q;;AAMG,MAAMC,QAAN,CAAe;EAKpBC,WAAW,GAAG;IAAA,wCAFmD,EAEnD;;IACpB,KAAKC,cAAL,GAAsB,EAAtB;EACD;;EAEyB,WAARC,QAAQ,GAAG;IAC3B,OAAO,KAAKC,SAAL,KAAmB,KAAKA,SAAL,GAAiB,IAAI,IAAJ,EAApC,CAAP;EACD;;EAEMC,KAAK,CAACA,KAAD,EAAkBC,IAAlB,EAA6B;IACvC,IAAIC,SAAS,GAAG,KAAKL,cAAL,CAAoBG,KAAK,CAACG,OAAN,EAApB,CAAhB;;IACA,IAAIC,KAAK,CAACC,OAAN,CAAcH,SAAd,CAAJ,EAA8B;MAC5BA,SAAS,CAACI,GAAV,CAAcC,QAAQ,IAAI;QACxB,IAAI,OAAOA,QAAP,KAAoB,UAAxB,EAAoC;UAClCA,QAAQ,CAACN,IAAD,CAAR;QACD;MACF,CAJD;IAKD;EACF;;EAEMO,WAAW,CAACR,KAAD,EAAkBO,QAAlB,EAAiD;IACjE,IAAIL,SAAS,GAAG,KAAKL,cAAL,CAAoBG,KAAK,CAACG,OAAN,EAApB,CAAhB;;IACA,IAAIC,KAAK,CAACC,OAAN,CAAcH,SAAd,CAAJ,EAA8B;MAC5BA,SAAS,CAACO,IAAV,CAAeF,QAAf;IACD,CAFD,MAEO;MACL,KAAKV,cAAL,CAAoBG,KAAK,CAACG,OAAN,EAApB,IAAuC,CAACI,QAAD,CAAvC;IACD;EACF;;EAEMG,cAAc,CAACH,QAAD,EAAgC;IACnDI,MAAM,CAACC,IAAP,CAAY,KAAKf,cAAjB,EAAiCS,GAAjC,CAAqCO,SAAS,IAAI;MAChD,IAAIX,SAAS,GAAG,KAAKL,cAAL,CAAoBgB,SAApB,CAAhB;;MACA,IAAIX,SAAJ,EAAe;QACb,KAAKY,OAAL,CAAaZ,SAAb,EAAwBK,QAAxB;;QACA,IAAIL,SAAS,CAACa,MAAV,KAAqB,CAAzB,EAA4B;UAC1B,OAAO,KAAKlB,cAAL,CAAoBgB,SAApB,CAAP;QACD;MACF;IACF,CARD;EASD;;EAEOC,OAAO,CAACE,KAAD,EAAoCC,IAApC,EAAkE;IAC/E,IAAI,CAACD,KAAL,EAAY;;IACZ,KAAK,IAAIE,CAAC,GAAG,CAAR,EAAWC,CAAC,GAAGH,KAAK,CAACD,MAA1B,EAAkCG,CAAC,GAAGC,CAAtC,EAAyCD,CAAC,EAA1C,EAA8C;MAC5C,IAAID,IAAI,KAAKD,KAAK,CAACE,CAAD,CAAlB,EAAuBF,KAAK,CAACI,MAAN,CAAaF,CAAb,EAAgB,CAAhB;IACxB;EACF;;AAlD2B;;;;gBAATvB,Q"}

package/lib/commonjs/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _components = require("./components");
+
+Object.keys(_components).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _components[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _components[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.tsx"],"sourcesContent":["export * from './components'\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

package/lib/commonjs/nativeComponenet/NativeComponentExample.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UnitReactNativeComponentsView = void 0;
+
+var _reactNative = require("react-native");
+
+const LINKING_ERROR = `The package 'unit-react-native-components' doesn't seem to be linked. Make sure: \n\n` + _reactNative.Platform.select({
+  ios: "- You have run 'pod install'\n",
+  default: ''
+}) + '- You rebuilt the app after installing the package\n' + '- You are not using Expo managed workflow\n';
+const ComponentName = 'UnitReactNativeComponentsView';
+const UnitReactNativeComponentsView = _reactNative.UIManager.getViewManagerConfig(ComponentName) != null ? (0, _reactNative.requireNativeComponent)(ComponentName) : () => {
+  throw new Error(LINKING_ERROR);
+};
+exports.UnitReactNativeComponentsView = UnitReactNativeComponentsView;
+//# sourceMappingURL=NativeComponentExample.js.map

package/lib/commonjs/nativeComponenet/NativeComponentExample.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["LINKING_ERROR","Platform","select","ios","default","ComponentName","UnitReactNativeComponentsView","UIManager","getViewManagerConfig","requireNativeComponent","Error"],"sources":["NativeComponentExample.tsx"],"sourcesContent":["import {\n  requireNativeComponent,\n  UIManager,\n  Platform,\n  ViewStyle,\n} from 'react-native';\n\nconst LINKING_ERROR =\n  `The package 'unit-react-native-components' doesn't seem to be linked. Make sure: \\n\\n` +\n  Platform.select({ ios: \"- You have run 'pod install'\\n\", default: '' }) +\n  '- You rebuilt the app after installing the package\\n' +\n  '- You are not using Expo managed workflow\\n';\n\ntype UnitReactNativeComponentsProps = {\n  color: string;\n  style: ViewStyle;\n};\n\nconst ComponentName = 'UnitReactNativeComponentsView';\n\nexport const UnitReactNativeComponentsView =\n  UIManager.getViewManagerConfig(ComponentName) != null\n    ? requireNativeComponent<UnitReactNativeComponentsProps>(ComponentName)\n    : () => {\n      throw new Error(LINKING_ERROR);\n    };\n"],"mappings":";;;;;;;AAAA;;AAOA,MAAMA,aAAa,GAChB,uFAAD,GACAC,qBAAA,CAASC,MAAT,CAAgB;EAAEC,GAAG,EAAE,gCAAP;EAAyCC,OAAO,EAAE;AAAlD,CAAhB,CADA,GAEA,sDAFA,GAGA,6CAJF;AAWA,MAAMC,aAAa,GAAG,+BAAtB;AAEO,MAAMC,6BAA6B,GACxCC,sBAAA,CAAUC,oBAAV,CAA+BH,aAA/B,KAAiD,IAAjD,GACI,IAAAI,mCAAA,EAAuDJ,aAAvD,CADJ,GAEI,MAAM;EACN,MAAM,IAAIK,KAAJ,CAAUV,aAAV,CAAN;AACD,CALE"}

package/lib/commonjs/webComponent/WebComponent.js

@@ -0,0 +1,75 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.WebComponentType = exports.WebComponent = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactNative = require("react-native");
+
+var _reactNativeWebview = require("react-native-webview");
+
+var _EventBus = _interopRequireWildcard(require("../helpers/EventBus"));
+
+var _html = _interopRequireDefault(require("./html"));
+
+var _unitMessages = require("./webMessages/unitMessages");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+let WebComponentType;
+exports.WebComponentType = WebComponentType;
+
+(function (WebComponentType) {
+  WebComponentType["card"] = "unit-elements-card";
+  WebComponentType["slot"] = "unit-elements-sdk-slot";
+})(WebComponentType || (exports.WebComponentType = WebComponentType = {}));
+
+const WebComponent = /*#__PURE__*/_react.default.forwardRef((props, webRef) => {
+  const [sourceHtml, setSourceHtml] = (0, _react.useState)(null);
+
+  const windowWidth = _reactNative.Dimensions.get('window').width;
+
+  (0, _react.useEffect)(() => {
+    const component = props.type.valueOf();
+
+    let newHtml = _html.default.replace('<COMPONENT>', `<${component} ${props.params || ''}> </${component}>`);
+
+    newHtml = newHtml.replace('<SCRIPT_FROM_NATIVE>', props.script || '');
+    setSourceHtml(newHtml);
+  }, [props.params]);
+
+  const onMessage = e => {
+    const message = JSON.parse(e.nativeEvent.data);
+
+    if (message.type == _unitMessages.UnitMessage.UNIT_REQUEST_REFRESH && message.details) {
+      _EventBus.default.Instance.event(_EventBus.BusEvent.REQUEST_REFRESH, message.details);
+    } else {
+      props.onMessage(message);
+    }
+  };
+
+  if (!sourceHtml) return null;
+  return /*#__PURE__*/_react.default.createElement(_reactNativeWebview.WebView, {
+    ref: webRef,
+    cacheEnabled: false,
+    scrollEnabled: false,
+    overScrollMode: "never",
+    style: {
+      width: windowWidth
+    },
+    source: {
+      html: sourceHtml
+    },
+    onMessage: onMessage
+  });
+});
+
+exports.WebComponent = WebComponent;
+//# sourceMappingURL=WebComponent.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["WebComponentType","WebComponent","React","forwardRef","props","webRef","sourceHtml","setSourceHtml","useState","windowWidth","Dimensions","get","width","useEffect","component","type","valueOf","newHtml","html","replace","params","script","onMessage","e","message","JSON","parse","nativeEvent","data","UnitMessage","UNIT_REQUEST_REFRESH","details","EventBus","Instance","event","BusEvent","REQUEST_REFRESH"],"sources":["WebComponent.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Dimensions } from 'react-native';\nimport {\n  WebView,\n  WebViewMessageEvent\n} from 'react-native-webview'\nimport EventBus, { BusEvent } from '../helpers/EventBus';\n\nimport html from './html';\nimport type { CardEvent, CardMessage } from './webMessages/cardMessage';\nimport type { PageEvent, PageMessage } from './webMessages/pageMessage';\nimport { RequestRefreshEvent, UnitEvent, UnitMessage } from './webMessages/unitMessages';\n\nexport type WebViewMessageType =\n  | PageMessage\n  | CardMessage\n  | UnitMessage\n\ntype WebViewEvent =\n  | PageEvent\n  | UnitEvent\n  | CardEvent\n\nexport interface WebViewMessage {\n  type: WebViewMessageType,\n  details?: WebViewEvent\n}\n\nexport interface WebComponentProps {\n  type: WebComponentType;\n  params?: string;\n  onMessage: (message: WebViewMessage) => void;\n  script?: string;\n}\n\nexport enum WebComponentType {\n  card = 'unit-elements-card',\n  slot = 'unit-elements-sdk-slot'\n}\n\nexport const WebComponent = React.forwardRef<WebView, WebComponentProps>((props, webRef) => {\n  const [sourceHtml, setSourceHtml] = useState<string | null>(null)\n\n  const windowWidth = Dimensions.get('window').width;\n\n  useEffect(() => {\n    const component: string = props.type.valueOf()\n    let newHtml = html.replace('<COMPONENT>', `<${component} ${props.params || ''}> </${component}>`)\n    newHtml = newHtml.replace('<SCRIPT_FROM_NATIVE>', props.script || '')\n    setSourceHtml(newHtml)\n  }, [props.params])\n\n  const onMessage = (e: WebViewMessageEvent) => {\n    const message = JSON.parse(e.nativeEvent.data) as WebViewMessage\n\n    if (message.type == UnitMessage.UNIT_REQUEST_REFRESH && message.details) {\n      EventBus.Instance.event(BusEvent.REQUEST_REFRESH, message.details as RequestRefreshEvent)\n    } else {\n      props.onMessage(message)\n    }\n  }\n\n  if (!sourceHtml) return null\n\n  return (\n    <WebView\n      ref={webRef}\n      cacheEnabled={false}\n      scrollEnabled={false}\n      overScrollMode=\"never\"\n      style={{ width: windowWidth }}\n      source={{ html: sourceHtml }}\n      onMessage={onMessage} />\n  )\n})\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAIA;;AAEA;;AAGA;;;;;;;;IAwBYA,gB;;;WAAAA,gB;EAAAA,gB;EAAAA,gB;GAAAA,gB,gCAAAA,gB;;AAKL,MAAMC,YAAY,gBAAGC,cAAA,CAAMC,UAAN,CAA6C,CAACC,KAAD,EAAQC,MAAR,KAAmB;EAC1F,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,IAAAC,eAAA,EAAwB,IAAxB,CAApC;;EAEA,MAAMC,WAAW,GAAGC,uBAAA,CAAWC,GAAX,CAAe,QAAf,EAAyBC,KAA7C;;EAEA,IAAAC,gBAAA,EAAU,MAAM;IACd,MAAMC,SAAiB,GAAGV,KAAK,CAACW,IAAN,CAAWC,OAAX,EAA1B;;IACA,IAAIC,OAAO,GAAGC,aAAA,CAAKC,OAAL,CAAa,aAAb,EAA6B,IAAGL,SAAU,IAAGV,KAAK,CAACgB,MAAN,IAAgB,EAAG,OAAMN,SAAU,GAAhF,CAAd;;IACAG,OAAO,GAAGA,OAAO,CAACE,OAAR,CAAgB,sBAAhB,EAAwCf,KAAK,CAACiB,MAAN,IAAgB,EAAxD,CAAV;IACAd,aAAa,CAACU,OAAD,CAAb;EACD,CALD,EAKG,CAACb,KAAK,CAACgB,MAAP,CALH;;EAOA,MAAME,SAAS,GAAIC,CAAD,IAA4B;IAC5C,MAAMC,OAAO,GAAGC,IAAI,CAACC,KAAL,CAAWH,CAAC,CAACI,WAAF,CAAcC,IAAzB,CAAhB;;IAEA,IAAIJ,OAAO,CAACT,IAAR,IAAgBc,yBAAA,CAAYC,oBAA5B,IAAoDN,OAAO,CAACO,OAAhE,EAAyE;MACvEC,iBAAA,CAASC,QAAT,CAAkBC,KAAlB,CAAwBC,kBAAA,CAASC,eAAjC,EAAkDZ,OAAO,CAACO,OAA1D;IACD,CAFD,MAEO;MACL3B,KAAK,CAACkB,SAAN,CAAgBE,OAAhB;IACD;EACF,CARD;;EAUA,IAAI,CAAClB,UAAL,EAAiB,OAAO,IAAP;EAEjB,oBACE,6BAAC,2BAAD;IACE,GAAG,EAAED,MADP;IAEE,YAAY,EAAE,KAFhB;IAGE,aAAa,EAAE,KAHjB;IAIE,cAAc,EAAC,OAJjB;IAKE,KAAK,EAAE;MAAEO,KAAK,EAAEH;IAAT,CALT;IAME,MAAM,EAAE;MAAES,IAAI,EAAEZ;IAAR,CANV;IAOE,SAAS,EAAEgB;EAPb,EADF;AAUD,CAlC2B,CAArB"}

package/lib/commonjs/webComponent/html.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+const htmlText = `
+  <!DOCTYPE html>
+  <html lang="en">
+
+  <head lang="en">
+    <title>Unit Web SDK Demo</title>
+    <script>
+      window.UnitMobileSDK = true
+    </script>
+    <script src="https://unit-white-labeled-banking.netlify.app/client-events.js"></script>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
+  </html>
+
+  <body style="margin: 0">
+    <COMPONENT>
+
+    <script>
+      const postMessageToSDK = (message) => {
+        if ('ReactNativeWebView' in window) {
+          const messageString = JSON.stringify(message)
+          window['ReactNativeWebView'].postMessage(messageString)
+        }
+      }
+
+      const postHeight = () => {
+        setTimeout(() => {
+          const height = window.document.documentElement.getBoundingClientRect().height + 36
+          postMessageToSDK({ type: "pageHeight", details: { height } })
+        })
+      }
+
+      window.addEventListener('DOMContentLoaded', e => {
+        postMessageToSDK({ type: "pageLoaded" })
+      });
+
+      window.addEventListener("unitRequestRendering", (e) => {
+        postMessageToSDK({ type: "unitRequestRendering", details: { data: JSON.stringify(e.detail) }})
+      });
+
+      window.addEventListener("unitOnLoad", (e) => {
+        postHeight()
+        postMessageToSDK({ type: "unitOnLoad" })
+      });
+
+      window.addEventListener("unitRequestCloseFlow", (e) => {
+        postMessageToSDK({ type: "unitRequestCloseFlow" })
+      });
+
+      window.addEventListener("unitRequestOpenLink", (e) => {
+        postMessageToSDK({ type: "unitRequestOpenLink", details: e.detail })
+      });
+
+      window.addEventListener("unitCardStatusChanged", (e) => {
+        const response = e.detail
+        response.then((data) => {
+          postMessageToSDK({ type: "cardStatusChanged", details:  { card: JSON.stringify(data.data) }})
+        }).catch((e) => {
+          console.log(e)
+        })
+      });
+
+      const dispatchRenderingEvent = (details) => {
+        const event = new CustomEvent("unitRequestRendering",{ detail: JSON.parse(details) })
+        window.dispatchEvent(event)
+      }
+
+      <SCRIPT_FROM_NATIVE>
+    </script>
+  </body>
+`;
+var _default = htmlText;
+exports.default = _default;
+//# sourceMappingURL=html.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["htmlText"],"sources":["html.ts"],"sourcesContent":["const 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    </script>\n    <script src=\"https://unit-white-labeled-banking.netlify.app/client-events.js\"></script>\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=0\">\n  </html>\n\n  <body style=\"margin: 0\">\n    <COMPONENT>\n\n    <script>\n      const postMessageToSDK = (message) => {\n        if ('ReactNativeWebView' in window) {\n          const messageString = JSON.stringify(message)\n          window['ReactNativeWebView'].postMessage(messageString)\n        }\n      }\n\n      const postHeight = () => {\n        setTimeout(() => {\n          const height = window.document.documentElement.getBoundingClientRect().height + 36\n          postMessageToSDK({ type: \"pageHeight\", details: { height } })\n        })\n      }\n\n      window.addEventListener('DOMContentLoaded', e => {\n        postMessageToSDK({ type: \"pageLoaded\" })\n      });\n\n      window.addEventListener(\"unitRequestRendering\", (e) => {\n        postMessageToSDK({ type: \"unitRequestRendering\", details: { data: JSON.stringify(e.detail) }})\n      });\n\n      window.addEventListener(\"unitOnLoad\", (e) => {\n        postHeight()\n        postMessageToSDK({ type: \"unitOnLoad\" })\n      });\n\n      window.addEventListener(\"unitRequestCloseFlow\", (e) => {\n        postMessageToSDK({ type: \"unitRequestCloseFlow\" })\n      });\n\n      window.addEventListener(\"unitRequestOpenLink\", (e) => {\n        postMessageToSDK({ type: \"unitRequestOpenLink\", details: e.detail })\n      });\n\n      window.addEventListener(\"unitCardStatusChanged\", (e) => {\n        const response = e.detail\n        response.then((data) => {\n          postMessageToSDK({ type: \"cardStatusChanged\", details:  { card: JSON.stringify(data.data) }})\n        }).catch((e) => {\n          console.log(e)\n        })\n      });\n\n      const dispatchRenderingEvent = (details) => {\n        const event = new CustomEvent(\"unitRequestRendering\",{ detail: JSON.parse(details) })\n        window.dispatchEvent(event)\n      }\n\n      <SCRIPT_FROM_NATIVE>\n    </script>\n  </body>\n`\n\nexport default htmlText\n"],"mappings":";;;;;;AAAA,MAAMA,QAAQ,GAAI;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CArEA;eAuEeA,Q"}

package/lib/commonjs/webComponent/webMessages/cardMessage.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CardMessage = void 0;
+let CardMessage;
+exports.CardMessage = CardMessage;
+
+(function (CardMessage) {
+  CardMessage["CARD_STATUS_CHANGE"] = "cardStatusChanged";
+})(CardMessage || (exports.CardMessage = CardMessage = {}));
+//# sourceMappingURL=cardMessage.js.map

package/lib/commonjs/webComponent/webMessages/cardMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CardMessage"],"sources":["cardMessage.ts"],"sourcesContent":["export enum CardMessage {\n  CARD_STATUS_CHANGE = 'cardStatusChanged'\n}\n\nexport interface CardStatusChangedEvent {\n  card: any;\n}\n\nexport type CardEvent =\n  | CardStatusChangedEvent\n"],"mappings":";;;;;;IAAYA,W;;;WAAAA,W;EAAAA,W;GAAAA,W,2BAAAA,W"}

package/lib/commonjs/webComponent/webMessages/pageMessage.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PageMessage = void 0;
+let PageMessage;
+exports.PageMessage = PageMessage;
+
+(function (PageMessage) {
+  PageMessage["PAGE_LOADED"] = "pageLoaded";
+  PageMessage["PAGE_HEIGHT"] = "pageHeight";
+})(PageMessage || (exports.PageMessage = PageMessage = {}));
+//# sourceMappingURL=pageMessage.js.map

package/lib/commonjs/webComponent/webMessages/pageMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PageMessage"],"sources":["pageMessage.ts"],"sourcesContent":["export enum PageMessage {\n  PAGE_LOADED = 'pageLoaded',\n  PAGE_HEIGHT = 'pageHeight'\n}\n\nexport interface HeightEvent {\n  height: number;\n}\n\nexport type PageEvent =\n  | HeightEvent\n"],"mappings":";;;;;;IAAYA,W;;;WAAAA,W;EAAAA,W;EAAAA,W;GAAAA,W,2BAAAA,W"}

package/lib/commonjs/webComponent/webMessages/unitMessages.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UnitMessage = void 0;
+let UnitMessage;
+exports.UnitMessage = UnitMessage;
+
+(function (UnitMessage) {
+  UnitMessage["UNIT_REQUEST_RENDERING"] = "unitRequestRendering";
+  UnitMessage["UNIT_REQUEST_REFRESH"] = "unitRequestRefresh";
+  UnitMessage["UNIT_REQUEST_CLOSE_FLOW"] = "unitRequestCloseFlow";
+  UnitMessage["UNIT_REQUEST_OPEN_LINK"] = "unitRequestOpenLink";
+  UnitMessage["UNIT_ON_LOAD"] = "unitOnLoad";
+})(UnitMessage || (exports.UnitMessage = UnitMessage = {}));
+//# sourceMappingURL=unitMessages.js.map

package/lib/commonjs/webComponent/webMessages/unitMessages.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["UnitMessage"],"sources":["unitMessages.ts"],"sourcesContent":["export enum UnitMessage {\n  UNIT_REQUEST_RENDERING = 'unitRequestRendering',\n  UNIT_REQUEST_REFRESH = 'unitRequestRefresh',\n  UNIT_REQUEST_CLOSE_FLOW = 'unitRequestCloseFlow',\n  UNIT_REQUEST_OPEN_LINK = 'unitRequestOpenLink',\n  UNIT_ON_LOAD = 'unitOnLoad'\n}\n\nexport interface RequestRenderingData {\n  nativePlace: string;\n  nativeComponent: string;\n}\nexport interface RequestRenderingEvent {\n  data: string;\n}\n\nexport interface RequestRefreshEvent {\n  refEvent: string;\n  dependencies: string[];\n  resourceId: string;\n}\n\nexport interface RequestOpenLinkEvent {\n  href: string;\n  target: string\n}\n\nexport type UnitEvent =\n  | RequestRenderingEvent\n  | RequestRefreshEvent\n  | RequestOpenLinkEvent\n"],"mappings":";;;;;;IAAYA,W;;;WAAAA,W;EAAAA,W;EAAAA,W;EAAAA,W;EAAAA,W;EAAAA,W;GAAAA,W,2BAAAA,W"}

package/lib/module/components/BottomSheet/BottomSheetComponent.js

@@ -0,0 +1,118 @@
+import React, { useEffect, useRef, useState } from "react";
+import { WebComponent, WebComponentType } from "../../webComponent/WebComponent";
+import { Dimensions, Linking, View } from "react-native";
+import BottomSheet from "../../helpers/BottomSheet";
+import EventBus, { BusEvent } from "../../helpers/EventBus";
+import { PageMessage } from "../../webComponent/webMessages/pageMessage";
+import { UnitMessage } from "../../webComponent/webMessages/unitMessages";
+import { CardMessage } from "../../webComponent/webMessages/cardMessage";
+export const UNBottomSheetComponent = () => {
+  const [isActive, setIsActive] = useState(false);
+  const [height, setHeight] = useState(0);
+  const [renderingRequest, setRenderingRequest] = useState(null);
+  const [waitForLoadingNewComponent, setWaitForLoadingNewComponent] = useState(false);
+  const [newHeightMessage, setNewHeightMessage] = useState(null);
+  const webRef = useRef(null);
+
+  const _listener = data => {
+    setRenderingRequest(data);
+    setIsActive(true);
+  };
+
+  useEffect(() => {
+    if (!webRef.current) return;
+
+    if (renderingRequest) {
+      var _webRef$current;
+
+      (_webRef$current = webRef.current) === null || _webRef$current === void 0 ? void 0 : _webRef$current.injectJavaScript(`dispatchRenderingEvent('${renderingRequest}')`);
+    }
+  }, [webRef.current, renderingRequest]);
+  useEffect(() => {
+    if (!isActive) {
+      setHeight(0);
+      setRenderingRequest(null);
+    }
+  }, [isActive]);
+  useEffect(() => {
+    if (!waitForLoadingNewComponent && newHeightMessage) {
+      setWaitForLoadingNewComponent(false);
+      setNewHeight(newHeightMessage);
+    }
+  }, [waitForLoadingNewComponent, newHeightMessage]);
+  useEffect(() => {
+    EventBus.Instance.addListener(BusEvent.REQUEST_RENDERING, _listener);
+    return () => {
+      EventBus.Instance.removeListener(_listener);
+    };
+  }, []);
+
+  const getBottomSheetScript = () => {
+    return `
+      window.addEventListener("unitRequestRefresh", (e) => {
+        postMessageToSDK({ type: "unitRequestRefresh", details:  e.detail  })
+      });
+    `;
+  };
+
+  const setNewHeight = message => {
+    if (renderingRequest) {
+      const nativePlace = JSON.parse(renderingRequest).nativePlace;
+
+      if (nativePlace == 'overFullScreen') {
+        const windowHeight = Dimensions.get('window').height * 0.94;
+        setHeight(windowHeight);
+      } else {
+        setHeight(message.details.height);
+      }
+    }
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
+    pointerEvents: isActive ? undefined : 'none',
+    style: {
+      position: 'absolute',
+      top: 0,
+      bottom: 0,
+      left: 0,
+      right: 0
+    }
+  }, /*#__PURE__*/React.createElement(BottomSheet, {
+    isOpen: isActive,
+    onClose: () => setIsActive(false),
+    onOpen: () => setIsActive(true)
+  }, /*#__PURE__*/React.createElement(View, {
+    style: {
+      height,
+      paddingTop: height === 0 ? 0 : 10
+    }
+  }, /*#__PURE__*/React.createElement(WebComponent, {
+    ref: webRef,
+    type: WebComponentType.slot,
+    script: getBottomSheetScript(),
+    onMessage: message => {
+      if (renderingRequest && message.type == PageMessage.PAGE_HEIGHT) {
+        setNewHeightMessage(message);
+      } else if (message.type == UnitMessage.UNIT_REQUEST_RENDERING) {
+        const {
+          data
+        } = message.details;
+
+        if (data != renderingRequest) {
+          setHeight(0);
+          setRenderingRequest(data);
+          setWaitForLoadingNewComponent(true);
+          setTimeout(() => setWaitForLoadingNewComponent(false), 400);
+        }
+      } else if (message.type == CardMessage.CARD_STATUS_CHANGE) {
+        EventBus.Instance.event(BusEvent.CARD_STATUS_CHANGED, message.details.card);
+      } else if (message.type == UnitMessage.UNIT_REQUEST_CLOSE_FLOW) {
+        setIsActive(false);
+      } else if (message.type == UnitMessage.UNIT_REQUEST_OPEN_LINK) {
+        const href = message.details.href;
+        Linking.openURL(href);
+      }
+    }
+  })))));
+};
+//# sourceMappingURL=BottomSheetComponent.js.map

package/lib/module/components/BottomSheet/BottomSheetComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useRef","useState","WebComponent","WebComponentType","Dimensions","Linking","View","BottomSheet","EventBus","BusEvent","PageMessage","UnitMessage","CardMessage","UNBottomSheetComponent","isActive","setIsActive","height","setHeight","renderingRequest","setRenderingRequest","waitForLoadingNewComponent","setWaitForLoadingNewComponent","newHeightMessage","setNewHeightMessage","webRef","_listener","data","current","injectJavaScript","setNewHeight","Instance","addListener","REQUEST_RENDERING","removeListener","getBottomSheetScript","message","nativePlace","JSON","parse","windowHeight","get","details","undefined","position","top","bottom","left","right","paddingTop","slot","type","PAGE_HEIGHT","UNIT_REQUEST_RENDERING","setTimeout","CARD_STATUS_CHANGE","event","CARD_STATUS_CHANGED","card","UNIT_REQUEST_CLOSE_FLOW","UNIT_REQUEST_OPEN_LINK","href","openURL"],"sources":["BottomSheetComponent.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\"\nimport type WebView from \"react-native-webview\"\nimport { WebComponent, WebComponentType, WebViewMessage } from \"../../webComponent/WebComponent\"\nimport { Dimensions, Linking, View } from \"react-native\"\nimport BottomSheet from \"../../helpers/BottomSheet\"\nimport EventBus, { BusEvent } from \"../../helpers/EventBus\"\nimport { HeightEvent, PageMessage } from \"../../webComponent/webMessages/pageMessage\"\nimport { RequestOpenLinkEvent, RequestRenderingData, RequestRenderingEvent, UnitMessage } from \"../../webComponent/webMessages/unitMessages\"\nimport { CardMessage, CardStatusChangedEvent } from \"../../webComponent/webMessages/cardMessage\"\n\nexport const UNBottomSheetComponent = () => {\n  const [isActive, setIsActive] = useState(false)\n  const [height, setHeight] = useState(0)\n\n  const [renderingRequest, setRenderingRequest] = useState<string | null>(null)\n\n  const [waitForLoadingNewComponent, setWaitForLoadingNewComponent] = useState(false)\n  const [newHeightMessage, setNewHeightMessage] = useState<WebViewMessage | null>(null)\n\n  const webRef = useRef<WebView>(null)\n\n  const _listener = (data: string) => {\n    setRenderingRequest(data)\n    setIsActive(true)\n  }\n\n  useEffect(() => {\n    if (!webRef.current) return\n    if (renderingRequest) {\n      webRef.current?.injectJavaScript(`dispatchRenderingEvent('${renderingRequest}')`)\n    }\n  }, [webRef.current, renderingRequest])\n\n  useEffect(() => {\n    if (!isActive) {\n      setHeight(0)\n      setRenderingRequest(null)\n    }\n  }, [isActive])\n\n  useEffect(() => {\n    if (!waitForLoadingNewComponent && newHeightMessage) {\n      setWaitForLoadingNewComponent(false)\n      setNewHeight(newHeightMessage)\n    }\n  }, [waitForLoadingNewComponent, newHeightMessage])\n\n  useEffect(() => {\n    EventBus.Instance.addListener(BusEvent.REQUEST_RENDERING, _listener)\n\n    return (() => {\n      EventBus.Instance.removeListener(_listener)\n    })\n  }, [])\n\n  const getBottomSheetScript = () => {\n    return `\n      window.addEventListener(\"unitRequestRefresh\", (e) => {\n        postMessageToSDK({ type: \"unitRequestRefresh\", details:  e.detail  })\n      });\n    `\n  }\n\n  const setNewHeight = (message: WebViewMessage) => {\n    if (renderingRequest) {\n      const nativePlace = (JSON.parse(renderingRequest) as RequestRenderingData).nativePlace;\n      if (nativePlace == 'overFullScreen') {\n        const windowHeight = Dimensions.get('window').height * 0.94;\n        setHeight(windowHeight)\n      } else {\n        setHeight((message.details as HeightEvent).height)\n      }\n    }\n  }\n\n  return (\n    <>\n      <View\n        pointerEvents={isActive ? undefined : 'none'}\n        style={{ position: 'absolute', top: 0, bottom: 0, left: 0, right: 0 }}\n      >\n        <BottomSheet\n          isOpen={isActive}\n          onClose={() => setIsActive(false)}\n          onOpen={() => setIsActive(true)}\n        >\n          <View style={{ height, paddingTop: height === 0 ? 0 : 10 }}>\n            <WebComponent ref={webRef} type={WebComponentType.slot} script={getBottomSheetScript()} onMessage={message => {\n              if (renderingRequest && message.type == PageMessage.PAGE_HEIGHT) {\n                setNewHeightMessage(message)\n              } else if (message.type == UnitMessage.UNIT_REQUEST_RENDERING) {\n                const { data } = (message.details! as RequestRenderingEvent)\n                if (data != renderingRequest) {\n                  setHeight(0)\n                  setRenderingRequest(data)\n                  setWaitForLoadingNewComponent(true)\n                  setTimeout(() => setWaitForLoadingNewComponent(false), 400)\n                }\n              } else if (message.type == CardMessage.CARD_STATUS_CHANGE) {\n                EventBus.Instance.event(BusEvent.CARD_STATUS_CHANGED, (message.details as CardStatusChangedEvent).card)\n              } else if (message.type == UnitMessage.UNIT_REQUEST_CLOSE_FLOW) {\n                setIsActive(false)\n              } else if (message.type == UnitMessage.UNIT_REQUEST_OPEN_LINK) {\n                const href = (message.details as RequestOpenLinkEvent).href\n                Linking.openURL(href)\n              }\n            }} />\n          </View>\n        </BottomSheet>\n      </View>\n    </>\n  )\n}\n"],"mappings":"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"}

package/lib/module/components/Card/CardComponent.js

@@ -0,0 +1,75 @@
+import React, { useEffect, useRef, useState } from "react";
+import { View } from "react-native";
+import { PageMessage } from "../../webComponent/webMessages/pageMessage";
+import { UnitMessage } from "../../webComponent/webMessages/unitMessages";
+import EventBus, { BusEvent } from "../../helpers/EventBus";
+import { WebComponent, WebComponentType } from "../../webComponent/WebComponent";
+export const UNCardComponent = props => {
+  const [height, setHeight] = useState(0);
+  const [requestRefreshEvent, setRequestRefreshEvent] = useState(null);
+  const webRef = useRef(null);
+  useEffect(() => {
+    EventBus.Instance.addListener(BusEvent.CARD_STATUS_CHANGED, _cardStatusChanged);
+    EventBus.Instance.addListener(BusEvent.REQUEST_REFRESH, _requestRefresh);
+    return () => {
+      EventBus.Instance.removeListener(_cardStatusChanged);
+      EventBus.Instance.removeListener(_requestRefresh);
+    };
+  }, []);
+
+  const _cardStatusChanged = card => {
+    if (props.onStatusChanged) {
+      props.onStatusChanged(card);
+    }
+  };
+
+  const _requestRefresh = data => {
+    setRequestRefreshEvent(data);
+  };
+
+  useEffect(() => {
+    if (requestRefreshEvent && requestRefreshEvent.dependencies.includes(WebComponentType.card.valueOf()) && requestRefreshEvent.resourceId == props.cardId) {
+      var _webRef$current;
+
+      (_webRef$current = webRef.current) === null || _webRef$current === void 0 ? void 0 : _webRef$current.injectJavaScript(`dispatchRefreshEvent('${JSON.stringify(requestRefreshEvent)}')`);
+    }
+  }, [requestRefreshEvent]);
+
+  const getCardParams = () => {
+    return `
+      cardId="${props.cardId}"
+      customerToken="${props.customerToken}"
+      src="https://d1xlopvhx2cz8k.cloudfront.net/resources/outlay.json"
+    `;
+  };
+
+  const getCardScript = () => {
+    return `
+      const dispatchRefreshEvent = (details) => {
+        const event = new CustomEvent("unitRequestRefresh",{ detail: JSON.parse(details) })
+        window.dispatchEvent(event)
+      }
+    `;
+  };
+
+  return /*#__PURE__*/React.createElement(View, {
+    style: {
+      height
+    }
+  }, /*#__PURE__*/React.createElement(WebComponent, {
+    ref: webRef,
+    type: WebComponentType.card,
+    params: getCardParams(),
+    script: getCardScript(),
+    onMessage: message => {
+      if (message.type === UnitMessage.UNIT_REQUEST_RENDERING) {
+        EventBus.Instance.event(BusEvent.REQUEST_RENDERING, message.details.data);
+      }
+
+      if (message.type == PageMessage.PAGE_HEIGHT) {
+        setHeight(message.details.height);
+      }
+    }
+  }));
+};
+//# sourceMappingURL=CardComponent.js.map

package/lib/module/components/Card/CardComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useRef","useState","View","PageMessage","UnitMessage","EventBus","BusEvent","WebComponent","WebComponentType","UNCardComponent","props","height","setHeight","requestRefreshEvent","setRequestRefreshEvent","webRef","Instance","addListener","CARD_STATUS_CHANGED","_cardStatusChanged","REQUEST_REFRESH","_requestRefresh","removeListener","card","onStatusChanged","data","dependencies","includes","valueOf","resourceId","cardId","current","injectJavaScript","JSON","stringify","getCardParams","customerToken","getCardScript","message","type","UNIT_REQUEST_RENDERING","event","REQUEST_RENDERING","details","PAGE_HEIGHT"],"sources":["CardComponent.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\"\nimport { View } from \"react-native\";\nimport type WebView from \"react-native-webview\";\nimport { HeightEvent, PageMessage } from \"../../webComponent/webMessages/pageMessage\";\nimport { RequestRefreshEvent, RequestRenderingEvent, UnitMessage } from \"../../webComponent/webMessages/unitMessages\";\nimport EventBus, { BusEvent } from \"../../helpers/EventBus\"\nimport { WebComponent, WebComponentType } from \"../../webComponent/WebComponent\"\n\nexport interface UNCardComponentProps {\n  cardId: string;\n  customerToken: string;\n  onStatusChanged?: (card: any) => void; // TODO - UNCard\n}\n\nexport const UNCardComponent = (props: UNCardComponentProps) => {\n  const [height, setHeight] = useState(0)\n  const [requestRefreshEvent, setRequestRefreshEvent] = useState<RequestRefreshEvent | null>(null)\n\n  const webRef = useRef<WebView>(null)\n\n  useEffect(() => {\n    EventBus.Instance.addListener(BusEvent.CARD_STATUS_CHANGED, _cardStatusChanged)\n    EventBus.Instance.addListener(BusEvent.REQUEST_REFRESH, _requestRefresh)\n    return (() => {\n      EventBus.Instance.removeListener(_cardStatusChanged)\n      EventBus.Instance.removeListener(_requestRefresh)\n    })\n  }, [])\n\n  const _cardStatusChanged = (card: any) => {\n    if (props.onStatusChanged) {\n      props.onStatusChanged(card)\n    }\n  }\n\n  const _requestRefresh = (data: RequestRefreshEvent) => {\n    setRequestRefreshEvent(data)\n  }\n\n  useEffect(() => {\n    if (requestRefreshEvent && requestRefreshEvent.dependencies.includes(WebComponentType.card.valueOf()) && requestRefreshEvent.resourceId == props.cardId) {\n      webRef.current?.injectJavaScript(`dispatchRefreshEvent('${JSON.stringify(requestRefreshEvent)}')`)\n    }\n  }, [requestRefreshEvent])\n\n  const getCardParams = () => {\n    return `\n      cardId=\"${props.cardId}\"\n      customerToken=\"${props.customerToken}\"\n      src=\"https://d1xlopvhx2cz8k.cloudfront.net/resources/outlay.json\"\n    `\n  }\n\n  const getCardScript = () => {\n    return `\n      const dispatchRefreshEvent = (details) => {\n        const event = new CustomEvent(\"unitRequestRefresh\",{ detail: JSON.parse(details) })\n        window.dispatchEvent(event)\n      }\n    `\n  }\n\n  return (\n    <View style={{ height }}>\n      <WebComponent ref={webRef} type={WebComponentType.card} params={getCardParams()} script={getCardScript()} onMessage={message => {\n        if (message.type === UnitMessage.UNIT_REQUEST_RENDERING) {\n          EventBus.Instance.event(BusEvent.REQUEST_RENDERING, (message.details as RequestRenderingEvent).data)\n        }\n        if (message.type == PageMessage.PAGE_HEIGHT) {\n          setHeight((message.details as HeightEvent).height)\n        }\n      }} />\n    </View>\n  )\n}\n"],"mappings":"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"}

package/lib/module/components/index.js

@@ -0,0 +1,3 @@
+export * from './Card/CardComponent';
+export * from './BottomSheet/BottomSheetComponent';
+//# sourceMappingURL=index.js.map

package/lib/module/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from './Card/CardComponent'\nexport * from './BottomSheet/BottomSheetComponent'\n"],"mappings":"AAAA,cAAc,sBAAd;AACA,cAAc,oCAAd"}