@evervault/evervault-react-native 1.0.1 → 1.2.0

package/README.md

@@ -1,6 +1,7 @@
 # react-native-evervault-sdk
 
 ## [Documentation](https://docs.evervault.com/sdks/react-native)
+
 Please see our documentation site for a full guide and reference.
 
 ## Installation
@@ -8,29 +9,21 @@ Please see our documentation site for a full guide and reference.
 ```sh
 npm install @evervault/evervault-react-native
 ```
+
 or
+
 ```sh
 yarn add @evervault/evervault-react-native
 ```
 
 ## Usage
+
 ```tsx
-import { init, Card, type CardPayload } from "@evervault/evervault-react-native"
+import { EvervaultProvider, init, Card, type CardPayload } from "@evervault/evervault-react-native"
 
 export default function App() {
   const [cardData, setCardData] = useState<CardPayload | undefined>(undefined);
 
-  useEffect(() => {
-    async function setupEvervault() {
-      try {
-        await init(process.env.EXPO_PUBLIC_EV_TEAM_UUID, process.env.EXPO_PUBLIC_EV_APP_UUID);
-      } catch (err) {
-        throw new Error("Failed to initialize Evervault", err);
-      }
-    }
-    setupEvervault();
-  }, []);
-
   const handleCardChange = (data: CardPayload) => {
     setCardData(data);
 
@@ -42,33 +35,35 @@ export default function App() {
   };
 
   return (
-    <ScrollView contentContainerStyle={styles.container}>
-      <Text style={styles.title}>evervault react native</Text>
-      <Card
-        onChange={setCardData}
-        style={styles.card}
-      >
-        <Text>Card Number</Text>
-        <Card.Number
-          placeholder="4242 4242 4242 4242"
-          style={styles.input}
-        />
-        <Card.Expiry
-          placeholder="MM / YY"
-          style={styles.input}
-        />
-        <Card.Holder
-          placeholder="John Doe"
-          style={styles.input}
-        />
-        <Card.CVC
-          placeholder="523"
-          style={styles.input}
-        />
-      </Card>
-      <Text style={styles.details}>{JSON.stringify(cardData, null, 2)}</Text>
-      <StatusBar style="auto" />
-    </ScrollView>
+    <EvervaultProvider teamUuid="team_4fb7e6ec803f" appUuid="app_f0cb771c8e77">
+      <ScrollView contentContainerStyle={styles.container}>
+        <Text style={styles.title}>evervault react native</Text>
+        <Card
+          onChange={setCardData}
+          style={styles.card}
+        >
+          <Text>Card Number</Text>
+          <Card.Number
+            placeholder="4242 4242 4242 4242"
+            style={styles.input}
+          />
+          <Card.Expiry
+            placeholder="MM / YY"
+            style={styles.input}
+          />
+          <Card.Holder
+            placeholder="John Doe"
+            style={styles.input}
+          />
+          <Card.CVC
+            placeholder="523"
+            style={styles.input}
+          />
+        </Card>
+        <Text style={styles.details}>{JSON.stringify(cardData, null, 2)}</Text>
+        <StatusBar style="auto" />
+      </ScrollView>
+    </EvervaultProvider>
   );
 }
 ```

package/dist/commonjs/components/3DS/ThreeDSecure.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ThreeDSecure = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _EvervaultProvider = require("../EvervaultProvider");
+var _ThreeDSecureFrame = require("./ThreeDSecureFrame");
+var _context = require("./context");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const ThreeDSecure = ({
+  state,
+  children
+}) => {
+  const {
+    appUuid
+  } = (0, _EvervaultProvider.useEvervault)();
+  if (!appUuid) {
+    throw new Error("ThreeDSecure must be used within an Evervault Provider");
+  }
+  const {
+    session,
+    isVisible
+  } = state;
+  if (!session) return null;
+  return /*#__PURE__*/_react.default.createElement(_context.ThreeDSecureContext.Provider, {
+    value: state
+  }, isVisible && children);
+};
+const ThreeDSecureNamespace = exports.ThreeDSecure = Object.assign(ThreeDSecure, {
+  Frame: _ThreeDSecureFrame.ThreeDSecureFrame
+});
+//# sourceMappingURL=ThreeDSecure.js.map

package/dist/commonjs/components/3DS/ThreeDSecure.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_EvervaultProvider","_ThreeDSecureFrame","_context","obj","__esModule","default","ThreeDSecure","state","children","appUuid","useEvervault","Error","session","isVisible","createElement","ThreeDSecureContext","Provider","value","ThreeDSecureNamespace","exports","Object","assign","Frame","ThreeDSecureFrame"],"sourceRoot":"../../../../src","sources":["components/3DS/ThreeDSecure.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,kBAAA,GAAAD,OAAA;AACA,IAAAE,kBAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAAgD,SAAAD,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAGhD,MAAMG,YAAY,GAAGA,CAAC;EAAEC,KAAK;EAAEC;AAAoC,CAAC,KAAK;EACvE,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,+BAAY,EAAC,CAAC;EAElC,IAAI,CAACD,OAAO,EAAE;IACZ,MAAM,IAAIE,KAAK,CAAC,wDAAwD,CAAC;EAC3E;EAEA,MAAM;IAAEC,OAAO;IAAEC;EAAU,CAAC,GAAGN,KAAK;EAEpC,IAAI,CAACK,OAAO,EAAE,OAAO,IAAI;EAEzB,oBACEf,MAAA,CAAAQ,OAAA,CAAAS,aAAA,CAACZ,QAAA,CAAAa,mBAAmB,CAACC,QAAQ;IAACC,KAAK,EAAEV;EAAM,GACxCM,SAAS,IAAIL,QACc,CAAC;AAEnC,CAAC;AAID,MAAMU,qBAAqB,GAAAC,OAAA,CAAAb,YAAA,GAAGc,MAAM,CAACC,MAAM,CAACf,YAAY,EAAE;EACxDgB,KAAK,EAAEC;AACT,CAAC,CAAC","ignoreList":[]}

package/dist/commonjs/components/3DS/ThreeDSecureFrame.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ThreeDSecureFrame = ThreeDSecureFrame;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _EvervaultProvider = require("../EvervaultProvider");
+var _reactNativeWebview = _interopRequireDefault(require("react-native-webview"));
+var _config = require("./config");
+var _styles = require("./styles");
+var _context = require("./context");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ThreeDSecureFrame() {
+  const {
+    teamUuid,
+    appUuid
+  } = (0, _EvervaultProvider.useEvervault)();
+  const context = (0, _react.useContext)(_context.ThreeDSecureContext);
+  if (!teamUuid || !appUuid) {
+    throw new Error('Missing Evervault Team or App Uuid. Make sure the ThreeDSecureFrame is nested within the Evervault Provider');
+  }
+  if (!context) {
+    throw new Error("ThreeDSecure.Frame must be used within an Evervault ThreeDSecure provider component");
+  }
+  const {
+    session
+  } = context;
+  if (!session) {
+    return null; // 3DS Session not started yet
+  }
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: _styles.defaultThreeDSecureFrameStyles.threeDSFrame
+  }, /*#__PURE__*/_react.default.createElement(_reactNativeWebview.default, {
+    source: {
+      uri: `https://${_config.CHALLENGE_DOMAIN_3DS}/?session=${session.sessionId}&app=${appUuid}&team=${teamUuid}`
+    },
+    containerStyle: _styles.defaultThreeDSecureFrameStyles.webView,
+    overScrollMode: "content"
+  }));
+}
+//# sourceMappingURL=ThreeDSecureFrame.js.map

package/dist/commonjs/components/3DS/ThreeDSecureFrame.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_EvervaultProvider","_reactNativeWebview","_interopRequireDefault","_config","_styles","_context","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ThreeDSecureFrame","teamUuid","appUuid","useEvervault","context","useContext","ThreeDSecureContext","Error","session","createElement","View","style","defaultStyles","threeDSFrame","source","uri","CHALLENGE_DOMAIN_3DS","sessionId","containerStyle","webView","overScrollMode"],"sourceRoot":"../../../../src","sources":["components/3DS/ThreeDSecureFrame.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,kBAAA,GAAAF,OAAA;AACA,IAAAG,mBAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,OAAA,GAAAN,OAAA;AACA,IAAAO,QAAA,GAAAP,OAAA;AAAgD,SAAAI,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAb,wBAAAa,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAH,UAAA,SAAAG,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAF,OAAA,EAAAE,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAJ,CAAA,UAAAG,CAAA,CAAAE,GAAA,CAAAL,CAAA,OAAAM,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAZ,CAAA,oBAAAY,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAd,CAAA,EAAAY,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAX,CAAA,EAAAY,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAZ,CAAA,CAAAY,CAAA,YAAAN,CAAA,CAAAR,OAAA,GAAAE,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAa,GAAA,CAAAhB,CAAA,EAAAM,CAAA,GAAAA,CAAA;AAEzC,SAASW,iBAAiBA,CAAA,EAAG;EAClC,MAAM;IAAEC,QAAQ;IAAEC;EAAQ,CAAC,GAAG,IAAAC,+BAAY,EAAC,CAAC;EAC5C,MAAMC,OAAO,GAAG,IAAAC,iBAAU,EAACC,4BAAmB,CAAC;EAG/C,IAAI,CAACL,QAAQ,IAAI,CAACC,OAAO,EAAE;IACzB,MAAM,IAAIK,KAAK,CAAC,6GAA6G,CAAC;EAChI;EAEA,IAAI,CAACH,OAAO,EAAE;IACZ,MAAM,IAAIG,KAAK,CAAC,qFAAqF,CAAC;EACxG;EAEA,MAAM;IAAEC;EAAQ,CAAC,GAAGJ,OAAO;EAE3B,IAAI,CAACI,OAAO,EAAE;IACZ,OAAO,IAAI,CAAC,CAAC;EACf;EAEA,oBACEvC,MAAA,CAAAY,OAAA,CAAA4B,aAAA,CAACrC,YAAA,CAAAsC,IAAI;IAACC,KAAK,EAAEC,sCAAa,CAACC;EAAa,gBACtC5C,MAAA,CAAAY,OAAA,CAAA4B,aAAA,CAACnC,mBAAA,CAAAO,OAAO;IACNiC,MAAM,EAAE;MACNC,GAAG,EAAG,WAAUC,4BAAqB,aAAYR,OAAO,CAACS,SAAU,QAAOf,OAAQ,SAAQD,QAAS;IACrG,CAAE;IACFiB,cAAc,EAAEN,sCAAa,CAACO,OAAQ;IACtCC,cAAc,EAAC;EAAS,CACzB,CACG,CAAC;AAEX","ignoreList":[]}

package/dist/commonjs/components/3DS/config.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EV_API_DOMAIN = exports.CHALLENGE_DOMAIN_3DS = void 0;
+const EV_API_DOMAIN = exports.EV_API_DOMAIN = process.env.EV_API_DOMAIN || 'api.evervault.com';
+const CHALLENGE_DOMAIN_3DS = exports.CHALLENGE_DOMAIN_3DS = process.env.CHALLENGE_DOMAIN_3DS || 'c713-2a09-bac5-3a69-ebe-00-178-198.ngrok-free.app';
+//# sourceMappingURL=config.js.map

package/dist/commonjs/components/3DS/config.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["EV_API_DOMAIN","exports","process","env","CHALLENGE_DOMAIN_3DS"],"sourceRoot":"../../../../src","sources":["components/3DS/config.ts"],"mappings":";;;;;;AAAO,MAAMA,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAGE,OAAO,CAACC,GAAG,CAACH,aAAa,IAAI,mBAAmB;AACtE,MAAMI,oBAAoB,GAAAH,OAAA,CAAAG,oBAAA,GAAGF,OAAO,CAACC,GAAG,CAACC,oBAAoB,IAAI,mDAAmD","ignoreList":[]}

package/dist/commonjs/components/3DS/context.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ThreeDSecureContext = void 0;
+var _react = require("react");
+const ThreeDSecureContext = exports.ThreeDSecureContext = /*#__PURE__*/(0, _react.createContext)(null);
+//# sourceMappingURL=context.js.map

package/dist/commonjs/components/3DS/context.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","ThreeDSecureContext","exports","createContext"],"sourceRoot":"../../../../src","sources":["components/3DS/context.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAGO,MAAMC,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,gBAAG,IAAAE,oBAAa,EAA2B,IAAI,CAAC","ignoreList":[]}

package/dist/commonjs/components/3DS/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ThreeDSecure", {
+  enumerable: true,
+  get: function () {
+    return _ThreeDSecure.ThreeDSecure;
+  }
+});
+Object.defineProperty(exports, "useThreeDSecure", {
+  enumerable: true,
+  get: function () {
+    return _useThreeDSecure.useThreeDSecure;
+  }
+});
+var _ThreeDSecure = require("./ThreeDSecure");
+var _useThreeDSecure = require("./useThreeDSecure");
+//# sourceMappingURL=index.js.map

package/dist/commonjs/components/3DS/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_ThreeDSecure","require","_useThreeDSecure"],"sourceRoot":"../../../../src","sources":["components/3DS/index.ts"],"mappings":";;;;;;;;;;;;;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA","ignoreList":[]}

package/dist/commonjs/components/3DS/styles.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultThreeDSecureFrameStyles = exports.defaultModalStyles = void 0;
+var _reactNative = require("react-native");
+const defaultModalStyles = exports.defaultModalStyles = _reactNative.StyleSheet.create({
+  modalContainer: {
+    flex: 1,
+    justifyContent: "flex-end",
+    backgroundColor: "rgba(0, 0, 0, 0.5)"
+  },
+  modalContent: {
+    width: "100%",
+    height: "95%",
+    backgroundColor: "#fff",
+    padding: 0,
+    justifyContent: "flex-start",
+    borderTopLeftRadius: 20,
+    borderTopRightRadius: 20
+  },
+  titleBar: {
+    justifyContent: "center",
+    alignItems: "center",
+    padding: 10,
+    backgroundColor: "#f5f5f5",
+    borderBottomWidth: 1,
+    borderBottomColor: "#ccc",
+    position: "relative",
+    width: "100%",
+    borderTopLeftRadius: 20,
+    borderTopRightRadius: 20
+  },
+  titleText: {
+    fontSize: 18,
+    fontWeight: "bold"
+  },
+  closeButton: {
+    position: "absolute",
+    left: 10,
+    padding: 10
+  },
+  closeButtonText: {
+    fontSize: 18,
+    fontWeight: "bold",
+    color: "black"
+  }
+});
+const defaultThreeDSecureFrameStyles = exports.defaultThreeDSecureFrameStyles = _reactNative.StyleSheet.create({
+  threeDSFrame: {
+    flex: 1
+  },
+  webView: {
+    flex: 1
+  },
+  spinnerOverlay: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  }
+});
+//# sourceMappingURL=styles.js.map

package/dist/commonjs/components/3DS/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","defaultModalStyles","exports","StyleSheet","create","modalContainer","flex","justifyContent","backgroundColor","modalContent","width","height","padding","borderTopLeftRadius","borderTopRightRadius","titleBar","alignItems","borderBottomWidth","borderBottomColor","position","titleText","fontSize","fontWeight","closeButton","left","closeButtonText","color","defaultThreeDSecureFrameStyles","threeDSFrame","webView","spinnerOverlay"],"sourceRoot":"../../../../src","sources":["components/3DS/styles.tsx"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AAEA,MAAMC,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAGE,uBAAU,CAACC,MAAM,CAAC;EACzCC,cAAc,EAAE;IACZC,IAAI,EAAE,CAAC;IACPC,cAAc,EAAE,UAAU;IAC1BC,eAAe,EAAE;EACrB,CAAC;EACDC,YAAY,EAAE;IACVC,KAAK,EAAE,MAAM;IACbC,MAAM,EAAE,KAAK;IACbH,eAAe,EAAE,MAAM;IACvBI,OAAO,EAAE,CAAC;IACVL,cAAc,EAAE,YAAY;IAC5BM,mBAAmB,EAAE,EAAE;IACvBC,oBAAoB,EAAE;EAC1B,CAAC;EACDC,QAAQ,EAAE;IACNR,cAAc,EAAE,QAAQ;IACxBS,UAAU,EAAE,QAAQ;IACpBJ,OAAO,EAAE,EAAE;IACXJ,eAAe,EAAE,SAAS;IAC1BS,iBAAiB,EAAE,CAAC;IACpBC,iBAAiB,EAAE,MAAM;IACzBC,QAAQ,EAAE,UAAU;IACpBT,KAAK,EAAE,MAAM;IACbG,mBAAmB,EAAE,EAAE;IACvBC,oBAAoB,EAAE;EAC1B,CAAC;EACDM,SAAS,EAAE;IACPC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE;EAChB,CAAC;EACDC,WAAW,EAAE;IACTJ,QAAQ,EAAE,UAAU;IACpBK,IAAI,EAAE,EAAE;IACRZ,OAAO,EAAE;EACb,CAAC;EACDa,eAAe,EAAE;IACbJ,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,MAAM;IAClBI,KAAK,EAAE;EACX;AACJ,CAAC,CAAC;AAEF,MAAMC,8BAA8B,GAAAzB,OAAA,CAAAyB,8BAAA,GAAGxB,uBAAU,CAACC,MAAM,CAAC;EACvDwB,YAAY,EAAE;IACZtB,IAAI,EAAE;EACR,CAAC;EACDuB,OAAO,EAAE;IACPvB,IAAI,EAAE;EACR,CAAC;EACDwB,cAAc,EAAE;IACdxB,IAAI,EAAE,CAAC;IACPC,cAAc,EAAE,QAAQ;IACxBS,UAAU,EAAE;EACd;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/commonjs/components/3DS/threeDSSession.js

@@ -0,0 +1,109 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.startSession = exports.pollSession = void 0;
+exports.threeDSecureSession = threeDSecureSession;
+var _config = require("./config");
+const stopPolling = (intervalRef, setIsVisible) => {
+  setIsVisible(false);
+  clearInterval(intervalRef.current);
+  intervalRef.current = null;
+};
+const startSession = async (session, callbacks, intervalRef, setIsVisible) => {
+  try {
+    const sessionState = await session.get();
+    switch (sessionState.status) {
+      case "success":
+        stopPolling(intervalRef, setIsVisible);
+        callbacks.onSuccess();
+        break;
+      case "failure":
+        stopPolling(intervalRef, setIsVisible);
+        callbacks.onFailure(new Error("3DS session failed"));
+        break;
+      case "action-required":
+        setIsVisible(true);
+        pollSession(session, callbacks, intervalRef, setIsVisible);
+        break;
+      default:
+        break;
+    }
+  } catch (error) {
+    console.error("Error checking session state", error);
+    callbacks.onError(new Error("Failed to check 3DS session state"));
+  }
+};
+exports.startSession = startSession;
+const pollSession = (session, callbacks, intervalRef, setIsVisible, interval = 3000) => {
+  intervalRef.current = setInterval(async () => {
+    try {
+      const pollResponse = await session.get();
+      if (pollResponse.status === "success") {
+        stopPolling(intervalRef, setIsVisible);
+        callbacks.onSuccess();
+      } else if (pollResponse.status === "failure") {
+        stopPolling(intervalRef, setIsVisible);
+        callbacks.onFailure(new Error("3DS session failed"));
+      } else {
+        setIsVisible(true);
+      }
+    } catch (error) {
+      stopPolling(intervalRef, setIsVisible);
+      console.error("Error polling session", error);
+      callbacks.onError(new Error("Error polling 3DS session"));
+    }
+  }, interval);
+};
+exports.pollSession = pollSession;
+function threeDSecureSession({
+  sessionId,
+  appId,
+  callbacks,
+  intervalRef,
+  setIsVisible
+}) {
+  const get = async () => {
+    try {
+      const response = await fetch(`https://${_config.EV_API_DOMAIN}/frontend/3ds/browser-sessions/${sessionId}`, {
+        headers: {
+          "x-evervault-app-id": appId
+        }
+      });
+      const result = await response.json();
+      return result;
+    } catch (error) {
+      console.error("Error fetching 3DS session status", error);
+      throw error;
+    }
+  };
+  const cancel = async () => {
+    try {
+      await fetch(`https://${_config.EV_API_DOMAIN}/frontend/3ds/browser-sessions/${sessionId}`, {
+        method: "PATCH",
+        headers: {
+          "Content-Type": "application/json",
+          "x-evervault-app-id": appId
+        },
+        body: JSON.stringify({
+          outcome: "cancelled"
+        })
+      });
+      callbacks.onFailure(new Error("3DS session cancelled by user"));
+      setIsVisible(false);
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+      }
+    } catch (error) {
+      console.error("Error cancelling 3DS session", error);
+      throw error;
+    }
+  };
+  return {
+    sessionId,
+    get,
+    cancel
+  };
+}
+//# sourceMappingURL=threeDSSession.js.map

package/dist/commonjs/components/3DS/threeDSSession.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_config","require","stopPolling","intervalRef","setIsVisible","clearInterval","current","startSession","session","callbacks","sessionState","get","status","onSuccess","onFailure","Error","pollSession","error","console","onError","exports","interval","setInterval","pollResponse","threeDSecureSession","sessionId","appId","response","fetch","EV_API_DOMAIN","headers","result","json","cancel","method","body","JSON","stringify","outcome"],"sourceRoot":"../../../../src","sources":["components/3DS/threeDSSession.ts"],"mappings":"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","ignoreList":[]}

package/dist/commonjs/components/3DS/types.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=types.js.map

package/dist/commonjs/components/3DS/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/3DS/types.ts"],"mappings":"","ignoreList":[]}

package/dist/commonjs/components/3DS/useThreeDSecure.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useThreeDSecure = void 0;
+var _react = require("react");
+var _EvervaultProvider = require("../EvervaultProvider");
+var _threeDSSession = require("./threeDSSession");
+const useThreeDSecure = () => {
+  const {
+    appUuid
+  } = (0, _EvervaultProvider.useEvervault)();
+  const intervalRef = (0, _react.useRef)(null);
+  const [session, setSession] = (0, _react.useState)(null);
+  const [isVisible, setIsVisible] = (0, _react.useState)(false);
+  if (!appUuid) {
+    throw new Error("useThreeDSecure must be used within an Evervault Provider");
+  }
+  const start = (sessionId, callbacks) => {
+    const session = (0, _threeDSSession.threeDSecureSession)({
+      sessionId,
+      appId: appUuid,
+      callbacks,
+      intervalRef,
+      setIsVisible
+    });
+    setSession(session);
+    (0, _threeDSSession.startSession)(session, callbacks, intervalRef, setIsVisible);
+  };
+  const cancel = async () => {
+    if (session) {
+      await session.cancel();
+    } else {
+      console.warn("No 3DS session to cancel");
+    }
+  };
+  return {
+    start,
+    cancel,
+    session,
+    isVisible: isVisible
+  };
+};
+exports.useThreeDSecure = useThreeDSecure;
+//# sourceMappingURL=useThreeDSecure.js.map

package/dist/commonjs/components/3DS/useThreeDSecure.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_EvervaultProvider","_threeDSSession","useThreeDSecure","appUuid","useEvervault","intervalRef","useRef","session","setSession","useState","isVisible","setIsVisible","Error","start","sessionId","callbacks","threeDSecureSession","appId","startSession","cancel","console","warn","exports"],"sourceRoot":"../../../../src","sources":["components/3DS/useThreeDSecure.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,kBAAA,GAAAD,OAAA;AACA,IAAAE,eAAA,GAAAF,OAAA;AAOO,MAAMG,eAAe,GAAGA,CAAA,KAAyB;EACtD,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,+BAAY,EAAC,CAAC;EAClC,MAAMC,WAAW,GAAG,IAAAC,aAAM,EAAwB,IAAI,CAAC;EACvD,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAG,IAAAC,eAAQ,EAA6B,IAAI,CAAC;EACxE,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAG,IAAAF,eAAQ,EAAC,KAAK,CAAC;EAEjD,IAAI,CAACN,OAAO,EAAE;IACZ,MAAM,IAAIS,KAAK,CACb,2DACF,CAAC;EACH;EAEA,MAAMC,KAAK,GAAGA,CAACC,SAAiB,EAAEC,SAAgC,KAAK;IACrE,MAAMR,OAAO,GAAG,IAAAS,mCAAmB,EAAC;MAClCF,SAAS;MACTG,KAAK,EAAEd,OAAO;MACdY,SAAS;MACTV,WAAW;MACXM;IACF,CAAC,CAAC;IAEFH,UAAU,CAACD,OAAO,CAAC;IAEnB,IAAAW,4BAAY,EAACX,OAAO,EAAEQ,SAAS,EAAEV,WAAW,EAAEM,YAAY,CAAC;EAC7D,CAAC;EAED,MAAMQ,MAAM,GAAG,MAAAA,CAAA,KAAY;IACzB,IAAIZ,OAAO,EAAE;MACX,MAAMA,OAAO,CAACY,MAAM,CAAC,CAAC;IACxB,CAAC,MAAM;MACLC,OAAO,CAACC,IAAI,CAAC,0BAA0B,CAAC;IAC1C;EACF,CAAC;EAED,OAAO;IACLR,KAAK;IACLM,MAAM;IACNZ,OAAO;IACPG,SAAS,EAAEA;EACb,CAAC;AACH,CAAC;AAACY,OAAA,CAAApB,eAAA,GAAAA,eAAA","ignoreList":[]}

package/dist/commonjs/components/Card/Card.js

@@ -28,51 +28,51 @@ function Card({
   const [registeredFields, setRegisteredFields] = (0, _react.useState)(new Set());
   const form = (0, _useForm.useForm)({
     initialValues: initialValue ?? {
-      cvc: '',
-      expiry: '',
-      number: '',
-      name: ''
+      cvc: "",
+      expiry: "",
+      number: "",
+      name: ""
     },
     validate: {
       name: values => {
-        if (!registeredFields.has('name')) {
+        if (!registeredFields.has("name")) {
           return undefined;
         }
         if (values.name.length === 0) {
-          return 'invalid';
+          return "invalid";
         }
         return undefined;
       },
       number: values => {
-        if (!registeredFields.has('number')) {
+        if (!registeredFields.has("number")) {
           return undefined;
         }
         const cardValidation = (0, _cardValidator.validateNumber)(values.number);
         if (!cardValidation.isValid) {
-          return 'invalid';
+          return "invalid";
         }
         if (!(0, _utilities.isAcceptedBrand)(config?.acceptedBrands, cardValidation)) {
-          return 'unsupportedBrand';
+          return "unsupportedBrand";
         }
         return undefined;
       },
       expiry: values => {
-        if (!registeredFields.has('expiry')) {
+        if (!registeredFields.has("expiry")) {
           return undefined;
         }
         const expiryValidation = (0, _cardValidator.validateExpiry)(values.expiry);
         if (!expiryValidation.isValid) {
-          return 'invalid';
+          return "invalid";
         }
         return undefined;
       },
       cvc: values => {
-        if (!registeredFields.has('cvc')) {
+        if (!registeredFields.has("cvc")) {
           return undefined;
         }
         const cvcValidation = (0, _cardValidator.validateCVC)(values.cvc, values.number);
         if (!cvcValidation.isValid) {
-          return 'invalid';
+          return "invalid";
         }
         return undefined;
       }

package/dist/commonjs/components/Card/CardCVC.js

@@ -16,21 +16,21 @@ const CardCVC = props => {
   const context = (0, _context.useCardContext)();
   const mask = (0, _react.useMemo)(() => {
     if (!context.values.number) {
-      return '9999';
+      return "9999";
     }
     const type = (0, _cardValidator.validateNumber)(context.values.number).brand;
-    if (type === 'american-express') {
-      return '9999';
+    if (type === "american-express") {
+      return "9999";
     }
-    return '999';
+    return "999";
   }, [context.values.number]);
   const {
     onChange,
     onBlur
-  } = context.register('cvc');
+  } = context.register("cvc");
   (0, _react.useEffect)(() => {
-    context.setRegisteredFields(prev => new Set(prev).add('cvc'));
-    return () => context.setRegisteredFields(prev => (0, _context.removeFieldFromSet)(prev, 'cvc'));
+    context.setRegisteredFields(prev => new Set(prev).add("cvc"));
+    return () => context.setRegisteredFields(prev => (0, _context.removeFieldFromSet)(prev, "cvc"));
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   return /*#__PURE__*/React.createElement(_reactNativeMaskedText.TextInputMask, _extends({}, props, {

package/dist/commonjs/components/Card/CardExpiry.js

@@ -16,10 +16,10 @@ function CardExpiry(props) {
   const {
     onBlur,
     onChange
-  } = context.register('expiry');
+  } = context.register("expiry");
   (0, _react.useEffect)(() => {
-    context.setRegisteredFields(prev => new Set(prev).add('expiry'));
-    return () => context.setRegisteredFields(prev => (0, _context.removeFieldFromSet)(prev, 'expiry'));
+    context.setRegisteredFields(prev => new Set(prev).add("expiry"));
+    return () => context.setRegisteredFields(prev => (0, _context.removeFieldFromSet)(prev, "expiry"));
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   return /*#__PURE__*/React.createElement(_reactNativeMaskedText.TextInputMask, _extends({}, props, {
@@ -27,16 +27,16 @@ function CardExpiry(props) {
     value: context.values.expiry
     // store the expiry as MMYY not MM / YY
     ,
-    onChangeText: rawExpiry => onChange(rawExpiry.replace(' / ', '')),
+    onChangeText: rawExpiry => onChange(rawExpiry.replace(" / ", "")),
     options: {
-      format: '99 / 99'
+      format: "99 / 99"
     },
     id: "expiry",
     onBlur: e => {
       onBlur(e);
       props.onBlur?.(e);
     },
-    placeholder: props.placeholder ?? 'MM / YY',
+    placeholder: props.placeholder ?? "MM / YY",
     inputMode: "numeric",
     autoComplete: "cc-exp"
   }));