Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@evervault/react

Package Overview
Dependencies
Maintainers
5
Versions
50
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@evervault/react - npm Package Compare versions

Comparing version 0.2.6 to 0.2.7

3

build/lib/index.js

@@ -1,1 +0,2 @@

!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("react"));else if("function"==typeof define&&define.amd)define(["react"],t);else{var r="object"==typeof exports?t(require("react")):t(e.react);for(var n in r)("object"==typeof exports?exports:e)[n]=r[n]}}(window,(function(e){return function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=1)}([function(t,r){t.exports=e},function(e,t,r){"use strict";r.r(t),r.d(t,"EvervaultContext",(function(){return p})),r.d(t,"EvervaultProvider",(function(){return y})),r.d(t,"useEvervault",(function(){return b}));var n=r(0),o=r.n(n);function u(){return(u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function i(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var r=[],n=!0,o=!1,u=void 0;try{for(var i,a=e[Symbol.iterator]();!(n=(i=a.next()).done)&&(r.push(i.value),!t||r.length!==t);n=!0);}catch(e){o=!0,u=e}finally{try{n||null==a.return||a.return()}finally{if(o)throw u}}return r}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}function a(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},u=Object.keys(e);for(n=0;n<u.length;n++)r=u[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var u=Object.getOwnPropertySymbols(e);for(n=0;n<u.length;n++)r=u[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function c(e,t,r,n,o,u,i){try{var a=e[u](i),c=a.value}catch(e){return void r(e)}a.done?t(c):Promise.resolve(c).then(n,o)}var l=/^https:\/\/js\.evervault\.com\/v1\/?(\?.*)?$/,f=null,v=function(){return null!==f?f:f=new Promise((function(e,t){if("undefined"!=typeof window)if(window.Evervault&&console.warn("Evervault has already been loaded"),window.Evervault)e(window.Evervault);else try{var r=d();r?console.warn("Evervault has already been loaded"):r||(r=function(){var e=document.createElement("script");e.src="https://js.evervault.com/v1";var t=document.head||document.body;if(!t)throw new Error("Expected document.body not to be null. Evervault.js requires a <body> element.");return t.appendChild(e),e}()),r.addEventListener("load",(function(){window.Evervault?e(window.Evervault):t(new Error("Evervault.js not available"))})),r.addEventListener("error",(function(){t(new Error("Failed to load Evervault.js"))}))}catch(e){return void t(e)}else e(null)}))},d=function(){for(var e=document.querySelectorAll<HTMLScriptElement>'script[src^="'.concat("https://js.evervault.com/v1",'"]'),t=0;t<e.length;t++){var r=e[t];if(l.test(r.src))return r}return null},s=function(){var e,t=(e=regeneratorRuntime.mark((function e(){var t,r;return regeneratorRuntime.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return t=Promise.resolve().then((function(){return v()})),r=!1,t.catch((function(e){r||console.warn(e)})),r=!0,e.abrupt("return",t.then((function(){if("undefined"!=typeof window)return window.Evervault})));case 5:case"end":return e.stop()}}),e)})),function(){var t=this,r=arguments;return new Promise((function(n,o){var u=e.apply(t,r);function i(e){c(u,n,o,i,a,"next",e)}function a(e){c(u,n,o,i,a,"throw",e)}i(void 0)}))});return function(){return t.apply(this,arguments)}}(),p=o.a.createContext(void 0),y=function(e){var t=e.teamId,r=e.customConfig,n=e.children,c=a(e,["teamId","customConfig","children"]),l=i(o.a.useState(void 0),2),f=l[0],v=l[1];return o.a.useEffect((function(){s().then((function(e){return v(new e(t,r))}))}),[s]),o.a.createElement(p.Provider,u({},c,{value:f}),n)};function b(){if("function"!=typeof o.a.useContext)throw new Error("You must use React >= 16.8 in order to use useEvervault()");return o.a.useContext(p)}}])}));
!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e(require("react"));else if("function"==typeof define&&define.amd)define(["react"],e);else{var r="object"==typeof exports?e(require("react")):e(t.react);for(var n in r)("object"==typeof exports?exports:t)[n]=r[n]}}("undefined"!=typeof self?self:this,(function(t){return function(t){var e={};function r(n){if(e[n])return e[n].exports;var o=e[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=t,r.c=e,r.d=function(t,e,n){r.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},r.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r.t=function(t,e){if(1&e&&(t=r(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)r.d(n,o,function(e){return t[e]}.bind(null,o));return n},r.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(e,"a",e),e},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.p="",r(r.s=6)}([function(e,r){e.exports=t},function(t,e,r){var n=r(13)();t.exports=n;try{regeneratorRuntime=n}catch(t){"object"==typeof globalThis?globalThis.regeneratorRuntime=n:Function("r","regeneratorRuntime = r")(n)}},function(t,e){function r(){return t.exports=r=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(t[n]=r[n])}return t},t.exports.__esModule=!0,t.exports.default=t.exports,r.apply(this,arguments)}t.exports=r,t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e,r){var n=r(7),o=r(8),i=r(9),u=r(11);t.exports=function(t,e){return n(t)||o(t,e)||i(t,e)||u()},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e,r){var n=r(12);t.exports=function(t,e){if(null==t)return{};var r,o,i=n(t,e);if(Object.getOwnPropertySymbols){var u=Object.getOwnPropertySymbols(t);for(o=0;o<u.length;o++)r=u[o],e.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(t,r)&&(i[r]=t[r])}return i},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e){function r(t,e,r,n,o,i,u){try{var a=t[i](u),c=a.value}catch(t){return void r(t)}a.done?e(c):Promise.resolve(c).then(n,o)}t.exports=function(t){return function(){var e=this,n=arguments;return new Promise((function(o,i){var u=t.apply(e,n);function a(t){r(u,o,i,a,c,"next",t)}function c(t){r(u,o,i,a,c,"throw",t)}a(void 0)}))}},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e,r){"use strict";r.r(e),r.d(e,"EvervaultContext",(function(){return g})),r.d(e,"EvervaultProvider",(function(){return b})),r.d(e,"useEvervault",(function(){return E}));var n=r(2),o=r.n(n),i=r(3),u=r.n(i),a=r(4),c=r.n(a),l=r(5),s=r.n(l),f=r(1),p=r.n(f),d=r(0),h=r.n(d),v=/^https:\/\/js\.evervault\.com\/v1\/?(\?.*)?$/,y=null,x=function(){return null!==y?y:y=new Promise((function(t,e){if("undefined"!=typeof window)if(window.Evervault&&console.warn("Evervault has already been loaded"),window.Evervault)t(window.Evervault);else try{var r=m();r?console.warn("Evervault has already been loaded"):r||(r=function(){var t=document.createElement("script");t.src="https://js.evervault.com/v1";var e=document.head||document.body;if(!e)throw new Error("Expected document.body not to be null. Evervault.js requires a <body> element.");return e.appendChild(t),t}()),r.addEventListener("load",(function(){window.Evervault?t(window.Evervault):e(new Error("Evervault.js not available"))})),r.addEventListener("error",(function(){e(new Error("Failed to load Evervault.js"))}))}catch(t){return void e(t)}else t(null)}))},m=function(){for(var t=document.querySelectorAll<HTMLScriptElement>'script[src^="'.concat("https://js.evervault.com/v1",'"]'),e=0;e<t.length;e++){var r=t[e];if(v.test(r.src))return r}return null},w=function(){var t=s()(p.a.mark((function t(){var e,r;return p.a.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return e=Promise.resolve().then((function(){return x()})),r=!1,e.catch((function(t){r||console.warn(t)})),r=!0,t.abrupt("return",e.then((function(){if("undefined"!=typeof window)return window.Evervault})));case 5:case"end":return t.stop()}}),t)})));return function(){return t.apply(this,arguments)}}(),g=h.a.createContext(void 0),b=function(t){var e=t.teamId,r=t.customConfig,n=t.children,i=c()(t,["teamId","customConfig","children"]);if("undefined"==typeof window)return h.a.createElement(g.Provider,null,n);var a=h.a.useState(void 0),l=u()(a,2),s=l[0],f=l[1];return h.a.useEffect((function(){w().then((function(t){return f(new t(e,r))}))}),[w]),h.a.createElement(g.Provider,o()({},i,{value:s}),n)};function E(){if("undefined"!=typeof window){if("function"!=typeof h.a.useContext)throw new Error("You must use React >= 16.8 in order to use useEvervault()");return h.a.useContext(g)}}},function(t,e){t.exports=function(t){if(Array.isArray(t))return t},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e){t.exports=function(t,e){var r=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=r){var n,o,i=[],u=!0,a=!1;try{for(r=r.call(t);!(u=(n=r.next()).done)&&(i.push(n.value),!e||i.length!==e);u=!0);}catch(t){a=!0,o=t}finally{try{u||null==r.return||r.return()}finally{if(a)throw o}}return i}},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e,r){var n=r(10);t.exports=function(t,e){if(t){if("string"==typeof t)return n(t,e);var r=Object.prototype.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?n(t,e):void 0}},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e){t.exports=function(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=new Array(e);r<e;r++)n[r]=t[r];return n},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e){t.exports=function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e){t.exports=function(t,e){if(null==t)return{};var r,n,o={},i=Object.keys(t);for(n=0;n<i.length;n++)r=i[n],e.indexOf(r)>=0||(o[r]=t[r]);return o},t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e,r){var n=r(14).default;function o(){"use strict";
/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */t.exports=o=function(){return e},t.exports.__esModule=!0,t.exports.default=t.exports;var e={},r=Object.prototype,i=r.hasOwnProperty,u="function"==typeof Symbol?Symbol:{},a=u.iterator||"@@iterator",c=u.asyncIterator||"@@asyncIterator",l=u.toStringTag||"@@toStringTag";function s(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{s({},"")}catch(t){s=function(t,e,r){return t[e]=r}}function f(t,e,r,n){var o=e&&e.prototype instanceof h?e:h,i=Object.create(o.prototype),u=new L(n||[]);return i._invoke=function(t,e,r){var n="suspendedStart";return function(o,i){if("executing"===n)throw new Error("Generator is already running");if("completed"===n){if("throw"===o)throw i;return M()}for(r.method=o,r.arg=i;;){var u=r.delegate;if(u){var a=_(u,r);if(a){if(a===d)continue;return a}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if("suspendedStart"===n)throw n="completed",r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n="executing";var c=p(t,e,r);if("normal"===c.type){if(n=r.done?"completed":"suspendedYield",c.arg===d)continue;return{value:c.arg,done:r.done}}"throw"===c.type&&(n="completed",r.method="throw",r.arg=c.arg)}}}(t,r,u),i}function p(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}e.wrap=f;var d={};function h(){}function v(){}function y(){}var x={};s(x,a,(function(){return this}));var m=Object.getPrototypeOf,w=m&&m(m(S([])));w&&w!==r&&i.call(w,a)&&(x=w);var g=y.prototype=h.prototype=Object.create(x);function b(t){["next","throw","return"].forEach((function(e){s(t,e,(function(t){return this._invoke(e,t)}))}))}function E(t,e){var r;this._invoke=function(o,u){function a(){return new e((function(r,a){!function r(o,u,a,c){var l=p(t[o],t,u);if("throw"!==l.type){var s=l.arg,f=s.value;return f&&"object"==n(f)&&i.call(f,"__await")?e.resolve(f.__await).then((function(t){r("next",t,a,c)}),(function(t){r("throw",t,a,c)})):e.resolve(f).then((function(t){s.value=t,a(s)}),(function(t){return r("throw",t,a,c)}))}c(l.arg)}(o,u,r,a)}))}return r=r?r.then(a,a):a()}}function _(t,e){var r=t.iterator[e.method];if(void 0===r){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=void 0,_(t,e),"throw"===e.method))return d;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return d}var n=p(r,t.iterator,e.arg);if("throw"===n.type)return e.method="throw",e.arg=n.arg,e.delegate=null,d;var o=n.arg;return o?o.done?(e[t.resultName]=o.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,d):o:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,d)}function j(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function O(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function L(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(j,this),this.reset(!0)}function S(t){if(t){var e=t[a];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var r=-1,n=function e(){for(;++r<t.length;)if(i.call(t,r))return e.value=t[r],e.done=!1,e;return e.value=void 0,e.done=!0,e};return n.next=n}}return{next:M}}function M(){return{value:void 0,done:!0}}return v.prototype=y,s(g,"constructor",y),s(y,"constructor",v),v.displayName=s(y,l,"GeneratorFunction"),e.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===v||"GeneratorFunction"===(e.displayName||e.name))},e.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,y):(t.__proto__=y,s(t,l,"GeneratorFunction")),t.prototype=Object.create(g),t},e.awrap=function(t){return{__await:t}},b(E.prototype),s(E.prototype,c,(function(){return this})),e.AsyncIterator=E,e.async=function(t,r,n,o,i){void 0===i&&(i=Promise);var u=new E(f(t,r,n,o),i);return e.isGeneratorFunction(r)?u:u.next().then((function(t){return t.done?t.value:u.next()}))},b(g),s(g,l,"Generator"),s(g,a,(function(){return this})),s(g,"toString",(function(){return"[object Generator]"})),e.keys=function(t){var e=[];for(var r in t)e.push(r);return e.reverse(),function r(){for(;e.length;){var n=e.pop();if(n in t)return r.value=n,r.done=!1,r}return r.done=!0,r}},e.values=S,L.prototype={constructor:L,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(O),!t)for(var e in this)"t"===e.charAt(0)&&i.call(this,e)&&!isNaN(+e.slice(1))&&(this[e]=void 0)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var e=this;function r(r,n){return u.type="throw",u.arg=t,e.next=r,n&&(e.method="next",e.arg=void 0),!!n}for(var n=this.tryEntries.length-1;n>=0;--n){var o=this.tryEntries[n],u=o.completion;if("root"===o.tryLoc)return r("end");if(o.tryLoc<=this.prev){var a=i.call(o,"catchLoc"),c=i.call(o,"finallyLoc");if(a&&c){if(this.prev<o.catchLoc)return r(o.catchLoc,!0);if(this.prev<o.finallyLoc)return r(o.finallyLoc)}else if(a){if(this.prev<o.catchLoc)return r(o.catchLoc,!0)}else{if(!c)throw new Error("try statement without catch or finally");if(this.prev<o.finallyLoc)return r(o.finallyLoc)}}}},abrupt:function(t,e){for(var r=this.tryEntries.length-1;r>=0;--r){var n=this.tryEntries[r];if(n.tryLoc<=this.prev&&i.call(n,"finallyLoc")&&this.prev<n.finallyLoc){var o=n;break}}o&&("break"===t||"continue"===t)&&o.tryLoc<=e&&e<=o.finallyLoc&&(o=null);var u=o?o.completion:{};return u.type=t,u.arg=e,o?(this.method="next",this.next=o.finallyLoc,d):this.complete(u)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),d},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),O(r),d}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;O(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:S(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=void 0),d}},e}t.exports=o,t.exports.__esModule=!0,t.exports.default=t.exports},function(t,e){function r(e){return t.exports=r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},t.exports.__esModule=!0,t.exports.default=t.exports,r(e)}t.exports=r,t.exports.__esModule=!0,t.exports.default=t.exports}])}));

@@ -115,2 +115,10 @@ /** @format */

export const EvervaultProvider = ({ teamId, customConfig, children, ...props }) => {
if(typeof window === 'undefined') {
return (
<EvervaultContext.Provider>
{children}
</EvervaultContext.Provider>
);
}
const [ev, setEv] = React.useState(undefined);

@@ -130,2 +138,6 @@

export function useEvervault() {
if(typeof window === 'undefined') {
return;
}
if (typeof React.useContext !== 'function') {

@@ -132,0 +144,0 @@ throw new Error(

{
"name": "@evervault/react",
"version": "0.2.6",
"version": "0.2.7",
"description": "React package for the Evervault SDK",

@@ -16,2 +16,3 @@ "main": "./build/lib/index.js",

"dependencies": {
"@babel/runtime": "^7.18.3",
"@evervault/sdk": "^0.6.0",

@@ -24,3 +25,3 @@ "prop-types": "^15.7.2"

"@babel/plugin-transform-react-jsx": "^7.10.4",
"@babel/plugin-transform-runtime": "^7.10.5",
"@babel/plugin-transform-runtime": "^7.18.5",
"@babel/preset-env": "^7.7.4",

@@ -27,0 +28,0 @@ "@babel/preset-react": "^7.7.4",

@@ -25,35 +25,50 @@ [![Evervault](https://evervault.com/evervault.svg)](https://evervault.com/)

## Setup
## Initialization
To make Evervault available for use in your app, use an `EvervaultProvider` component as a provider for your app.
Once installed, initialize the React.js SDK with your team's unique ID found in the [Settings](https://app.evervault.com/settings). Use an `EvervaultProvider` component as a provider for your app.
```javascript
import { EvervaultProvider } from '@evervault/react';
export const App = () => {
<EvervaultProvider teamId={'<YOUR-TEAM-ID>'}>
import { EvervaultProvider } from "@evervault/react";
export const App = () => (
<EvervaultProvider teamId={"<YOUR-TEAM-ID>"}>
<ChildComponent />
</EvervaultProvider>
}
</EvervaultProvider>;
);
```
Then any time you want to encrypt data, simply import `useEvervault` in your component.
## Reference
The Evervault React.js SDK exposes two functions.
### evervault.encrypt()
`evervault.encrypt()` encrypts data for use in your [Cages](https://docs.evervault.com/tutorial). To encrypt data on the client, simply pass the value into the `evervault.encrypt()` function. Store the encrypted data in your database as normal. Send it to your API and use our [Node.js SDK](https://docs.evervault.com/nodejs) to forward the data to your Cage.
```javascript
async evervault.encrypt(data: Object | Array | String | Number);
```
| Parameter | Type | Description |
| --------- | --------------------------------------- | --------------------- |
| data | `Object`, `Array`, `String` or `Number` | Data to be encrypted. |
Any time you want to encrypt data, simply import `useEvervault` in your component.
```jsx
import React from 'react';
import { useEvervault } from '@evervault/react';
export const MyComponent = ({ someState }) => {
export const MyComponent = ({ someState }) => {
const evervault = useEvervault();
const [encryptedState, setEncryptedState] = React.useState(undefined);
const encryptState = React.useCallback(
async () => setEncryptedState(await evervault.encrypt(someState)),
[setEncryptedState, evervault]
async () => setEncryptedState(await evervault.encrypt(someState)),
[setEncryptedState, evervault]
);
React.useEffect(() => encryptState(), [encryptState])
return (
{ encryptedState && (<p>encryptedState</p>) }
{encryptedState && <p>encryptedState</p>}
);

@@ -63,18 +78,73 @@ }

## Reference
### evervault.inputs()
The Evervault React.js SDK exposes one function.
`evervault.inputs()` initializes Evervault Inputs which make it easy to collect encrypted cardholder data in a completely PCI-compliant environment.
### evervault.encrypt()
Evervault Inputs are served within an iFrame retrieved directly from Evervault’s PCI-compliant infrastructure, which can reduce your PCI DSS compliance scope to the simplest form (SAQ-A) once integrated correctly.
`evervault.encrypt()` encrypts data for use in your [Cages](https://docs.evervault.com/tutorial). To encrypt data on the client, simply pass an object or string into the `evervault.encrypt()` function. Store the encrypted data in your database as normal. Send it to your API and use our [Node.js SDK](https://docs.evervault.com/nodejs) to forward the data to your Cage.
Simply pass the id of the element in which the iFrame should be embedded.
We also support [themes](https://docs.evervault.com/concepts/inputs/overview#customising-inputs) so you can customise how Inputs looks in your UI.
```javascript
async evervault.encrypt(data: Object | String);
evervault.inputs(id: String, theme: String);
```
| Parameter | Type | Description |
| --------- | ---- | ----------- |
| data | Object or String | Data to be encrypted. |
| Parameter | Type | Description |
| --------- | ------ | ------------------------------------------------------------------------- |
| id | string | Id of the element in which the Evervault Inputs iFrame should be embedded |
| theme | string | Optional theme for styling Inputs, currently supported: minimal |
#### Retrieving card data
There are two ways of accessing encrypted card data once it has been entered.
In each case, a `cardData` object containing details about the card data your user has entered is returned.
```json
{
"card": {
"type": "visa_credit",
"number": "ev:encrypted:abc123",
"cvc": "ev:encrypted:def456",
"expMonth": "01",
"expYear": "23"
},
"isValid": true,
"isPotentiallyValid": true,
"isEmpty": false,
"error": {
"type": "invalid_pan",
"message": "The credit card number you entered was invalid"
}
}
```
##### `onChange` hook
This option is best when you are looking to handle the card values in realtime, like displaying validation errors as a user is inputting their card data. The callback for the hook is run every time your user updates the card data.
```javascript
const evervault = useEvervault();
const [encryptedData, setEncryptedData] = useState(undefined);
const initEvForm = async () => {
const encryptedInput = evervault?.input?.generate("encryptedInput");
encryptedInput?.on("change", async (cardData) => {
setEncryptedData(cardData);
});
useEffect(() => {
initEvForm();
}, [evervault]);
};
```
#### `getData` method
This option is best when you are looking to retrieve card data occasionally, like when your form is submitted.
```javascript
const cardData = await inputs.getData();
```
## Contributing

@@ -81,0 +151,0 @@

@@ -10,3 +10,4 @@

library: '',
libraryTarget: 'umd'
libraryTarget: 'umd',
globalObject: 'typeof self !== \'undefined\' ? self : this'
},

@@ -24,3 +25,4 @@ module: {

'@babel/plugin-transform-react-jsx',
'@babel/plugin-transform-regenerator'
'@babel/plugin-transform-regenerator',
'@babel/plugin-transform-runtime',
]

@@ -27,0 +29,0 @@ }

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc