@evervault/react - npm Package Compare versions

Comparing version 2.5.0 to 2.5.1

dist/evervault-react.main.d.ts

@@ -16,3 +16,3 @@ import { events } from 'events';
 
-export declare function Card({ theme, fields, onSwipe, onReady, onError, onChange, onComplete, translations, }: CardProps): React_2.JSX.Element;
+export declare function Card({ theme, fields, autoFocus, translations, onSwipe, onReady, onError, onChange, onComplete, }: CardProps): React_2.JSX.Element;
 
@@ -99,2 +99,3 @@ declare class Card_2 {
 declare interface CardProps {
+    autoFocus?: boolean;
     theme?: ThemeDefinition;
@@ -678,3 +679,3 @@ translations?: CardTranslations;
 
-export declare function Pin({ theme, onReady, onChange, onError, length }: PinProps): React_2.JSX.Element;
+export declare function Pin({ theme, autoFocus, mode, inputType, length, onReady, onChange, onError, }: PinProps): React_2.JSX.Element;
 
@@ -681,0 +682,0 @@ declare class Pin_2 {

dist/evervault-react.main.js

 "use client";
-import * as u from "react";
-import { createContext as S, useContext as I, useState as g, useRef as v, useLayoutEffect as E, useEffect as h, useMemo as z } from "react";
-function C(e) {
+import * as l from "react";
+import { createContext as L, useContext as C, useState as S, useRef as p, useLayoutEffect as y, useEffect as m, useMemo as B } from "react";
+function T(e) {
   return (t) => ({
@@ -54,3 +54,3 @@ styles: {
 }
-function T(e) {
+function j(e) {
   return (t) => ({
@@ -125,3 +125,3 @@ styles: {
 }
-function j(e) {
+function _(e) {
   return (t) => ({
@@ -244,16 +244,16 @@ styles: {
 }
-const H = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const D = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  clean: C,
-  material: T,
-  minimal: j
-}, Symbol.toStringTag, { value: "Module" })), x = S(null);
-function b() {
+  clean: T,
+  material: j,
+  minimal: _
+}, Symbol.toStringTag, { value: "Module" })), R = L(null);
+function E() {
   if (typeof window > "u")
     return null;
-  if (typeof u.useContext != "function")
+  if (typeof l.useContext != "function")
     throw new Error(
       "You must use React >= 18.0 in order to use useEvervault()"
     );
-  const e = u.useContext(x);
+  const e = l.useContext(R);
   if (!e)
@@ -265,7 +265,7 @@ throw new Error(
 }
-const L = S(
+const P = L(
   void 0
 );
-function B() {
-  const e = I(L);
+function k() {
+  const e = C(P);
   if (!e)
@@ -275,3 +275,3 @@ throw new Error("Reveal consumers must be used within a Reveal component");
 }
-function _({
+function O({
   path: e,
@@ -281,136 +281,150 @@ onCopy: t,
 }) {
-  const [r, a] = g(null), d = v(null), { reveal: n } = B();
-  return u.useEffect(() => {
+  const [r, a] = S(null), u = p(null), { reveal: n } = k();
+  return l.useEffect(() => {
     if (!(!r || !t))
       return r == null ? void 0 : r.on("copy", t);
-  }, [r, t]), E(() => {
-    if ((!d.current || r) ?? !n)
+  }, [r, t]), y(() => {
+    if ((!u.current || r) ?? !n)
       return;
-    const l = n == null ? void 0 : n.copyButton(e, o);
-    l.mount(d.current), a(l);
-  }, [n, e, o, r]), /* @__PURE__ */ u.createElement("div", { ref: d });
+    const c = n == null ? void 0 : n.copyButton(e, o);
+    c.mount(u.current), a(c);
+  }, [n, e, o, r]), /* @__PURE__ */ l.createElement("div", { ref: u });
 }
-function O({ path: e, theme: t, format: o }) {
-  const [r, a] = g(null), d = v(null), { reveal: n } = B();
-  return E(() => {
-    if ((!d.current || r) ?? !n)
+function M({ path: e, theme: t, format: o }) {
+  const [r, a] = S(null), u = p(null), { reveal: n } = k();
+  return y(() => {
+    if ((!u.current || r) ?? !n)
       return;
-    const l = n.text(e, {
+    const c = n.text(e, {
       theme: t,
       format: o
     });
-    l.mount(d.current), a(l);
-  }, [n, e, t, o, r]), /* @__PURE__ */ u.createElement("div", { ref: d });
+    c.mount(u.current), a(c);
+  }, [n, e, t, o, r]), /* @__PURE__ */ l.createElement("div", { ref: u });
 }
-function P({ request: e, children: t, onReady: o, onError: r }) {
-  const a = v(!1), d = b(), [n, l] = g(null), s = v(null);
-  return u.useEffect(() => {
+function I({ request: e, children: t, onReady: o, onError: r }) {
+  const a = p(!1), u = E(), [n, c] = S(null), s = p(null);
+  return l.useEffect(() => {
     if (!(!n || !o))
       return n == null ? void 0 : n.on("ready", o);
-  }, [n, o]), u.useEffect(() => {
+  }, [n, o]), l.useEffect(() => {
     if (!(!n || !r))
       return n == null ? void 0 : n.on("error", r);
-  }, [n, r]), h(() => {
+  }, [n, r]), m(() => {
     if (!s.current || a.current)
       return;
-    async function c() {
+    async function f() {
       a.current = !0;
-      const f = await d;
-      if (!f)
+      const d = await u;
+      if (!d)
         return;
-      const i = f.ui.reveal(e);
-      l(i);
+      const v = d.ui.reveal(e);
+      c(v);
     }
-    c().catch(console.error);
-  }, [n, e, d]), /* @__PURE__ */ u.createElement(L.Provider, { value: { reveal: n } }, /* @__PURE__ */ u.createElement(u.Fragment, null, /* @__PURE__ */ u.createElement("div", { ref: s }), t));
+    f().catch(console.error);
+  }, [n, e, u]), /* @__PURE__ */ l.createElement(P.Provider, { value: { reveal: n } }, /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement("div", { ref: s }), t));
 }
-P.Text = O;
-P.CopyButton = _;
-function q({
+I.Text = M;
+I.CopyButton = O;
+function F({
   theme: e,
   fields: t,
-  onSwipe: o,
-  onReady: r,
-  onError: a,
-  onChange: d,
-  onComplete: n,
-  translations: l
+  autoFocus: o,
+  translations: r,
+  onSwipe: a,
+  onReady: u,
+  onError: n,
+  onChange: c,
+  onComplete: s
 }) {
-  const s = b(), c = v(!1), f = v(null), [i, p] = u.useState(null);
-  h(() => {
-    if (!(!i || !r))
-      return i == null ? void 0 : i.on("ready", r);
-  }, [i, r]), h(() => {
+  const f = E(), d = p(!1), v = p(null), [i, h] = l.useState(null);
+  m(() => {
+    if (!(!i || !u))
+      return i == null ? void 0 : i.on("ready", u);
+  }, [i, u]), m(() => {
+    if (!(!i || !n))
+      return i == null ? void 0 : i.on("error", n);
+  }, [i, n]), m(() => {
     if (!(!i || !a))
-      return i == null ? void 0 : i.on("error", a);
-  }, [i, a]), h(() => {
-    if (!(!i || !o))
-      return i == null ? void 0 : i.on("swipe", o);
-  }, [i, o]), h(() => {
-    if (!(!i || !d))
-      return i == null ? void 0 : i.on("change", d);
-  }, [i, d]), h(() => {
-    if (!(!i || !n))
-      return i == null ? void 0 : i.on("complete", n);
-  }, [i, n]);
-  const m = z(
+      return i == null ? void 0 : i.on("swipe", a);
+  }, [i, a]), m(() => {
+    if (!(!i || !c))
+      return i == null ? void 0 : i.on("change", c);
+  }, [i, c]), m(() => {
+    if (!(!i || !s))
+      return i == null ? void 0 : i.on("complete", s);
+  }, [i, s]);
+  const b = B(
     () => ({
       theme: e,
       fields: t,
-      translations: l
+      autoFocus: o,
+      translations: r
     }),
-    [e, l, t]
+    [e, r, t, o]
   );
-  return E(() => {
-    if (!f.current)
+  return y(() => {
+    if (!v.current)
       return;
-    async function k() {
-      if (c.current || !f.current)
+    async function x() {
+      if (d.current || !v.current)
         return;
-      c.current = !0;
-      const y = await s;
-      if (!y)
+      d.current = !0;
+      const w = await f;
+      if (!w)
         return;
-      const R = y.ui.card(m);
-      R.mount(f.current), p(R);
+      const z = w.ui.card(b);
+      z.mount(v.current), h(z);
     }
-    i ? i.update(m) : k().catch(console.error);
-  }, [m, i]), /* @__PURE__ */ u.createElement("div", { ref: f });
+    i ? i.update(b) : x().catch(console.error);
+  }, [b, i]), /* @__PURE__ */ l.createElement("div", { ref: v });
 }
-function D({ theme: e, onReady: t, onChange: o, onError: r, length: a }) {
-  const d = b(), n = v(!1), [l, s] = u.useState(null), c = v(null);
-  u.useEffect(() => {
-    if (!(!l || !t))
-      return l == null ? void 0 : l.on("ready", t);
-  }, [l, t]), u.useEffect(() => {
-    if (!(!l || !r))
-      return l == null ? void 0 : l.on("error", r);
-  }, [l, r]), u.useEffect(() => {
-    if (!(!l || !o))
-      return l == null ? void 0 : l.on("change", o);
-  }, [l, o]);
-  const f = z(
+function G({
+  theme: e,
+  autoFocus: t,
+  mode: o,
+  inputType: r,
+  length: a,
+  onReady: u,
+  onChange: n,
+  onError: c
+}) {
+  const s = E(), f = p(!1), [d, v] = l.useState(null), i = p(null);
+  l.useEffect(() => {
+    if (!(!d || !u))
+      return d == null ? void 0 : d.on("ready", u);
+  }, [d, u]), l.useEffect(() => {
+    if (!(!d || !c))
+      return d == null ? void 0 : d.on("error", c);
+  }, [d, c]), l.useEffect(() => {
+    if (!(!d || !n))
+      return d == null ? void 0 : d.on("change", n);
+  }, [d, n]);
+  const h = B(
     () => ({
       theme: e,
-      length: a
+      length: a,
+      autoFocus: t,
+      mode: o,
+      inputType: r
     }),
-    [e, a]
+    [e, a, t, o, r]
   );
-  return E(() => {
-    if (!c.current)
+  return y(() => {
+    if (!i.current)
       return;
-    async function i() {
-      if (n.current || !c.current)
+    async function b() {
+      if (f.current || !i.current)
         return;
-      n.current = !0;
-      const p = await d;
-      if (!p)
+      f.current = !0;
+      const x = await s;
+      if (!x)
         return;
-      const m = p.ui.pin(f);
-      m.mount(c.current), s(m);
+      const w = x.ui.pin(h);
+      w.mount(i.current), v(w);
     }
-    l ? l.update(f) : i().catch(console.error);
-  }, [l, f]), /* @__PURE__ */ u.createElement("div", { ref: c });
+    d ? d.update(h) : b().catch(console.error);
+  }, [d, h]), /* @__PURE__ */ l.createElement("div", { ref: i });
 }
-class M extends Promise {
+class Y extends Promise {
   async encrypt(t) {
@@ -423,6 +437,6 @@ return (await this).encrypt(t);
 }
-const Y = "https://js.evervault.com/v2";
-function F(e) {
+const U = "https://js.evervault.com/v2";
+function V(e) {
   const t = document.createElement("script");
-  e ? t.src = e : t.src = Y;
+  e ? t.src = e : t.src = U;
   const o = document.head || document.body;
@@ -435,5 +449,5 @@ if (!o)
 }
-let w = null;
-function U(e) {
-  return w !== null || (w = new Promise((t, o) => {
+let g = null;
+function A(e) {
+  return g !== null || (g = new Promise((t, o) => {
     if (typeof window > "u") {
@@ -448,3 +462,3 @@ t(void 0);
     try {
-      const r = F(e);
+      const r = V(e);
       r.addEventListener("load", () => {
@@ -458,6 +472,6 @@ window.Evervault ? t(window.Evervault) : o(new Error("Evervault.js not available"));
     }
-  })), w;
+  })), g;
 }
-function V(e) {
-  const t = Promise.resolve().then(() => U(e));
+function H(e) {
+  const t = Promise.resolve().then(() => A(e));
   let o = !1;
@@ -468,3 +482,3 @@ return t.catch((r) => {
 }
-const G = ({
+const J = ({
   teamId: e,
@@ -477,14 +491,14 @@ appId: t,
   if (typeof window > "u")
-    return /* @__PURE__ */ u.createElement(x.Provider, { value: null }, r);
-  const d = u.useMemo(
-    () => new M((n, l) => {
-      V(o == null ? void 0 : o.jsSdkUrl).then((s) => {
-        s !== void 0 ? n(new s(e, t, o)) : (console.error("Evervault.js not available"), l("Evervault.js not available"));
-      }).catch((s) => l(s));
+    return /* @__PURE__ */ l.createElement(R.Provider, { value: null }, r);
+  const u = l.useMemo(
+    () => new Y((n, c) => {
+      H(o == null ? void 0 : o.jsSdkUrl).then((s) => {
+        s !== void 0 ? n(new s(e, t, o)) : (console.error("Evervault.js not available"), c("Evervault.js not available"));
+      }).catch((s) => c(s));
     }),
     []
   );
-  return /* @__PURE__ */ u.createElement(x.Provider, { ...a, value: d }, r);
+  return /* @__PURE__ */ l.createElement(R.Provider, { ...a, value: u }, r);
 };
-function J({
+function K({
   onChange: e,
@@ -494,16 +508,16 @@ config: t,
 }) {
-  const r = u.useId();
+  const r = l.useId();
   if (typeof window > "u")
-    return /* @__PURE__ */ u.createElement("div", { id: r });
-  const a = b(), { height: d = "auto", ...n } = t ?? {}, l = n ? { height: d, ...n } : { height: d };
-  return u.useEffect(() => {
+    return /* @__PURE__ */ l.createElement("div", { id: r });
+  const a = E(), { height: u = "auto", ...n } = t ?? {}, c = n ? { height: u, ...n } : { height: u };
+  return l.useEffect(() => {
     a == null || a.then((s) => {
-      const c = s.inputs(r, l);
-      c == null || c.on("change", (f) => {
-        typeof e == "function" && e(f);
-      }), o && (c == null ? void 0 : c.isInputsLoaded) != null && c.isInputsLoaded instanceof Promise && c.isInputsLoaded.then(() => o());
+      const f = s.inputs(r, c);
+      f == null || f.on("change", (d) => {
+        typeof e == "function" && e(d);
+      }), o && (f == null ? void 0 : f.isInputsLoaded) != null && f.isInputsLoaded instanceof Promise && f.isInputsLoaded.then(() => o());
     });
-  }, [a]), /* @__PURE__ */ u.createElement("div", { id: r });
+  }, [a]), /* @__PURE__ */ l.createElement("div", { id: r });
 }
-function K({
+function N({
   request: e,
@@ -515,27 +529,27 @@ config: t,
 }) {
-  const d = u.useId();
+  const u = l.useId();
   if (typeof window > "u")
-    return /* @__PURE__ */ u.createElement("div", { id: d });
-  const n = b(), { height: l = "auto", ...s } = t ?? {}, c = s ? { height: l, ...s } : { height: l };
-  return u.useEffect(() => {
-    n == null || n.then((f) => {
-      const i = f.reveal(d, e, c, o);
-      (i == null ? void 0 : i.isRevealLoaded) != null && i.isRevealLoaded instanceof Promise && i.isRevealLoaded.then(() => {
+    return /* @__PURE__ */ l.createElement("div", { id: u });
+  const n = E(), { height: c = "auto", ...s } = t ?? {}, f = s ? { height: c, ...s } : { height: c };
+  return l.useEffect(() => {
+    n == null || n.then((d) => {
+      const v = d.reveal(u, e, f, o);
+      (v == null ? void 0 : v.isRevealLoaded) != null && v.isRevealLoaded instanceof Promise && v.isRevealLoaded.then(() => {
         r && r();
-      }).catch((p) => {
-        a && a(p);
+      }).catch((i) => {
+        a && a(i);
       });
     });
-  }, [n]), /* @__PURE__ */ u.createElement("div", { id: d });
+  }, [n]), /* @__PURE__ */ l.createElement("div", { id: u });
 }
 export {
-  q as Card,
-  J as EvervaultInput,
-  G as EvervaultProvider,
-  K as EvervaultReveal,
-  D as Pin,
-  M as PromisifiedEvervaultClient,
-  P as Reveal,
-  H as themes,
-  b as useEvervault
+  F as Card,
+  K as EvervaultInput,
+  J as EvervaultProvider,
+  N as EvervaultReveal,
+  G as Pin,
+  Y as PromisifiedEvervaultClient,
+  I as Reveal,
+  D as themes,
+  E as useEvervault
 };

package.json

 {
   "private": false,
   "name": "@evervault/react",
-  "version": "2.5.0",
+  "version": "2.5.1",
   "description": "React package for the Evervault SDK",
@@ -36,6 +36,6 @@ "license": "MIT",
     "vite-plugin-dts": "^3.6.3",
+    "types": "^0.0.0",
     "themes": "^0.0.0",
-    "types": "^0.0.0",
-    "tsconfig": "^0.0.1",
-    "@evervault/browser": "^2.18.0"
+    "@evervault/browser": "^2.18.0",
+    "tsconfig": "^0.0.1"
   },
@@ -42,0 +42,0 @@ "scripts": {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

68216

increased by0.47%

Lines of code

1371

increased by1.11%

No dependency changes