@arcblock/did-connect-react 3.1.0

package/lib/Connect/components/refresh-overlay.js

@@ -0,0 +1,57 @@
+import { jsx as o } from "react/jsx-runtime";
+import i from "prop-types";
+import { useTheme as a, Box as r } from "@mui/material";
+import { Icon as c } from "@iconify/react";
+import f from "@iconify-icons/material-symbols/refresh-rounded";
+function l({ onRefresh: n, ...e }) {
+  const { palette: t } = a();
+  return /* @__PURE__ */ o(
+    r,
+    {
+      ...e,
+      onClick: (s) => {
+        s.stopPropagation(), n();
+      },
+      sx: {
+        position: "absolute",
+        top: 0,
+        bottom: 0,
+        left: 0,
+        right: 0,
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        backgroundColor: "rgba(255, 255, 255, 0.75)",
+        cursor: "pointer",
+        ...e.sx
+      },
+      children: /* @__PURE__ */ o(
+        r,
+        {
+          sx: {
+            backgroundColor: "secondary.main",
+            borderRadius: "100%",
+            fontSize: 0
+          },
+          children: /* @__PURE__ */ o(
+            c,
+            {
+              icon: f,
+              fontSize: 52,
+              style: {
+                transform: "scale(0.7)",
+                color: t.secondary.contrastText
+              }
+            }
+          )
+        }
+      )
+    }
+  );
+}
+l.propTypes = {
+  onRefresh: i.func.isRequired
+};
+export {
+  l as default
+};

package/lib/Connect/components/switch-app.js

@@ -0,0 +1,70 @@
+import { jsxs as u, Fragment as f, jsx as r } from "react/jsx-runtime";
+import { useRef as m } from "react";
+import { Box as x, Menu as l, MenuItem as d } from "@mui/material";
+import { useReactive as h } from "ahooks";
+import { mergeSx as P } from "@arcblock/ux/lib/Util/style";
+import t from "prop-types";
+import { AppInfoItem as A } from "@arcblock/ux/lib/DIDConnect";
+import { useStateContext as y } from "../contexts/state.js";
+function S({ sx: s = {}, children: i }) {
+  const { appInfoList: p, extraParams: c, connectState: a } = y(), n = m(null), e = h({
+    open: !1
+  });
+  return p.length <= 1 ? null : /* @__PURE__ */ u(f, { children: [
+    /* @__PURE__ */ r(
+      x,
+      {
+        component: "span",
+        ref: n,
+        sx: P(
+          {
+            color: "text.secondary",
+            cursor: "pointer"
+          },
+          s
+        ),
+        onClick: () => {
+          e.open = !0;
+        },
+        children: i
+      }
+    ),
+    /* @__PURE__ */ r(
+      l,
+      {
+        anchorEl: n.current,
+        open: e.open,
+        onClose: () => {
+          e.open = !1;
+        },
+        slotProps: {
+          paper: {
+            variant: "outlined",
+            sx: {
+              border: 0,
+              boxShadow: ({ palette: o }) => `0px 4px 8px 0px ${o.grey[100]}, 0px 0px 0px 1px ${o.grey[100]}`,
+              borderRadius: 1
+            }
+          }
+        },
+        children: p.map((o) => /* @__PURE__ */ r(
+          d,
+          {
+            onClick: () => {
+              e.open = !1, a.sourceAppPid = o.sourceAppPid;
+            },
+            children: /* @__PURE__ */ r(A, { appInfo: o, active: o.sourceAppPid === c?.sourceAppPid })
+          },
+          o.appPid
+        ))
+      }
+    )
+  ] });
+}
+S.propTypes = {
+  sx: t.object,
+  children: t.any.isRequired
+};
+export {
+  S as default
+};

package/lib/Connect/contexts/state.js

@@ -0,0 +1,142 @@
+import { jsx as I } from "react/jsx-runtime";
+import r from "prop-types";
+import { createContext as K, useState as x, use as O, useRef as D, useEffect as Q } from "react";
+import V from "@arcblock/react-hooks/lib/useBrowser";
+import { useUpdate as X, useCreation as s, useMemoizedFn as S, useLatest as Y, useReactive as Z, useSize as _ } from "ahooks";
+import E from "lodash/isUndefined";
+import $ from "lodash/noop";
+import { Box as ee } from "@mui/material";
+import { translate as te } from "@arcblock/ux/lib/Locale/util";
+import { getMaster as R, getCurrentApp as oe } from "@arcblock/ux/lib/Util/federated";
+import { getDIDMotifInfo as re } from "@arcblock/did-motif";
+import { isEthereumDid as ne, getDIDColor as ie } from "@arcblock/ux/lib/Util";
+import se from "../hooks/use-apps.js";
+import { SessionContext as pe } from "../../Session/context.js";
+import ce from "../assets/locale.js";
+const T = K({
+  isWalletWebview: !1,
+  isMobile: !1,
+  matchSmallScreen: !1,
+  blocklet: null
+}), { Provider: ue, Consumer: Ie } = T;
+function de({
+  children: W,
+  blocklet: p,
+  masterBlocklet: h = void 0,
+  action: d,
+  extraParams: t = {},
+  locale: a = "en",
+  testOnlyBorderColor: f = void 0,
+  ...j
+}) {
+  const P = X(), [l, q] = x([]), [m, z] = x(""), J = s(() => new Map(l.map((e) => [e.name, e])), [l]), N = S((e) => J.get(e)), U = Y(m), k = S((e, i = {}) => te(ce, e, a, "en", i)), g = O(pe), o = Z({
+    sourceAppPid: void 0,
+    status: "created",
+    autoActiveWebview: !0,
+    deeplink: void 0,
+    chooseMethod: "",
+    retryConnect: $
+  }), B = D({
+    cancelCount: 0
+  }), n = V(), { appInfoList: w, autoGenerateSourceAppPid: A, canSwitchApp: b } = se({
+    blocklet: p,
+    connectState: o,
+    action: d,
+    sourceAppPid: t?.sourceAppPid,
+    enableSwitchApp: t?.forceSwitch || t?.enableSwitchApp
+  }), v = D(null), C = _(v), M = s(() => (C?.width || 0) < 500, [C?.width]), c = s(() => {
+    if (b)
+      return {
+        ...t,
+        sourceAppPid: E(o.sourceAppPid) ? A : o.sourceAppPid
+      };
+    const e = R(p)?.appPid, i = R(globalThis.blocklet)?.appPid;
+    return g?.session?.user && (e === i || !e) ? E(t?.sourceAppPid) ? {
+      ...t,
+      sourceAppPid: g.session.user?.sourceAppPid
+    } : t : {
+      ...t,
+      sourceAppPid: A
+    };
+  }, [
+    b,
+    t,
+    o.sourceAppPid,
+    d,
+    A,
+    g?.session?.user
+  ]), L = s(() => {
+    const e = window?.navigator?.userAgent;
+    return e.indexOf("Edge") > -1 || e.indexOf("Edg") > -1 ? "edge" : e.indexOf("Chrome") > -1 ? "chrome" : "unknown";
+  }, []);
+  Q(() => {
+    o.sourceAppPid = c.sourceAppPid;
+  }, [c.sourceAppPid]);
+  const F = S((e) => {
+    o.status = e || "created";
+  }), u = globalThis.blocklet ? oe(p) : globalThis.env, y = s(() => {
+    if (f)
+      return f;
+    const e = u.appPid, i = ne(e), H = i ? void 0 : re(e);
+    return i ? ie(e) : H.color;
+  }, [u.appId, f]), G = s(() => ({
+    isWalletWebview: n.wallet || n.arcSphere,
+    isMobile: n.mobile.any,
+    matchSmallScreen: M,
+    connectState: o,
+    staticState: B,
+    reactiveState: o,
+    appInfoList: w,
+    extraParams: c,
+    blocklet: p,
+    masterBlocklet: h,
+    browserBrand: L,
+    currentAppInfo: u,
+    currentAppColor: y,
+    t: k,
+    locale: a,
+    action: d,
+    changeStatus: F,
+    getPlugin: N,
+    latestActivePlugin: U,
+    plugins: l,
+    setPlugins: q,
+    selectedPlugin: m,
+    setSelectedPlugin: z,
+    forceUpdate: P
+  }), [
+    n.wallet,
+    n.arcSphere,
+    n.mobile.any,
+    M,
+    JSON.stringify(o),
+    JSON.stringify(w),
+    JSON.stringify(c),
+    p,
+    h,
+    a,
+    m,
+    P,
+    u,
+    y
+  ]);
+  return /* @__PURE__ */ I(ue, { value: G, children: /* @__PURE__ */ I(ee, { ...j, ref: v, children: W }) });
+}
+de.propTypes = {
+  children: r.any.isRequired,
+  blocklet: r.object.isRequired,
+  masterBlocklet: r.object,
+  action: r.string.isRequired,
+  extraParams: r.object,
+  locale: r.string,
+  testOnlyBorderColor: r.string
+};
+function xe() {
+  return O(T);
+}
+export {
+  Ie as StateConsumer,
+  T as StateContext,
+  de as StateProvider,
+  xe as useStateContext
+};

package/lib/Connect/fullpage.js

@@ -0,0 +1,5 @@
+import "@arcblock/ux/lib/DIDConnect/landing-page";
+import { default as f } from "@arcblock/ux/lib/DIDConnect/landing-page";
+export {
+  f as default
+};

package/lib/Connect/hooks/auth-url.js

@@ -0,0 +1,23 @@
+import { useCreation as p } from "ahooks";
+import { useStateContext as l } from "../contexts/state.js";
+import m from "./security.js";
+import "../../utils.js";
+import { getVisitorId as d } from "@arcblock/ux/lib/Util";
+function A({ disableSwitchApp: c, tokenState: t }) {
+  const { appInfoList: o, connectState: s } = l(), { encryptKey: i } = m();
+  return p(() => {
+    if (!t.url)
+      return "";
+    const u = !c && o.length > 1, e = new URL(t.url || "https://www.didwallet.io"), a = e.searchParams.get("url");
+    if (a && u) {
+      const r = new URL(decodeURIComponent(a));
+      r.searchParams.set("_ek_", i);
+      const n = d();
+      n && r.searchParams.set("vid", n), s?.sourceAppPid && r.searchParams.set("spid", s?.sourceAppPid), e.searchParams.set("url", r.toString());
+    }
+    return e.toString();
+  }, [t.url, o.length, s?.sourceAppPid, i]);
+}
+export {
+  A as default
+};

package/lib/Connect/hooks/method-list.js

@@ -0,0 +1,46 @@
+import { useBrowser as R } from "@arcblock/react-hooks";
+import { detectWalletExtension as v } from "@arcblock/ux/lib/Util";
+import { useRequest as D, useCreation as r } from "ahooks";
+import W from "lodash/intersection";
+import { OAUTH_PROVIDER as x } from "@arcblock/ux/lib/Util/constant";
+import { useOAuth as C } from "../../OAuth/context.js";
+import "../../utils.js";
+import { checkSameProtocol as I, getWebWalletUrl as M } from "@arcblock/ux/lib/Util/wallet";
+function F({
+  enabledConnectTypes: o = [],
+  allowWallet: n = !0,
+  passkeyBehavior: g = "none",
+  webWalletUrl: L = M(),
+  action: e,
+  sourceAppPid: f,
+  mode: c = "dialog",
+  blocklet: u = globalThis.blocklet,
+  isSmallView: d = !1
+}) {
+  const s = ["login", "invite", "connect-to-did-space", "connect-to-did-domain", "destroy-self"], { getOAuthConfigList: w } = C(), i = R(), a = v(), { data: m = [] } = D(
+    async () => await w({ sourceAppPid: f }),
+    { refreshDeps: [f] }
+  ), l = r(() => {
+    const t = W(Object.keys(x), o);
+    return m.filter((P) => t.includes(P.provider));
+  }, [m, o]), O = r(() => s.includes(e) ? l.length > 0 : !1, [l, e]), h = r(() => {
+    let t = n;
+    return s.includes(e) || (t = !0), t && o.includes("mobile");
+  }, [n, o, e]), b = I(L), p = r(() => {
+    let t = n;
+    return s.includes(e) || (t = !0), t && o.includes("web") && (b || a) && (!i.mobile.any || a);
+  }, [n, o, i?.mobile?.any, e]), _ = r(() => g !== "none" && !i.wallet && !i.arcSphere, [e]), A = r(() => !s.includes(e) || !["true", void 0, null].includes(u?.DID_CONNECT_ALLOW_EMAIL) ? !1 : u?.settings?.notification?.email?.enabled ?? !1, [e, u]), E = r(() => !1);
+  return {
+    hideQRCode: r(() => !!(c === "drawer" || d && i.mobile.any || s.includes(e) && !h), [c, d]),
+    hideChooseList: E,
+    showOAuthLogin: O,
+    showMobileLogin: h,
+    showWebLogin: p,
+    showPasskeyLogin: _,
+    showEmailLogin: A,
+    oauthProviderList: l
+  };
+}
+export {
+  F as default
+};

package/lib/Connect/hooks/page-show.js

@@ -0,0 +1,17 @@
+import { useRef as c, useEffect as i } from "react";
+function u(e) {
+  const t = c(e);
+  i(() => {
+    t.current = e;
+  }, [e]), i(() => {
+    const n = (r) => {
+      !document.hidden && t.current && t.current(r);
+    };
+    return document.addEventListener("visibilitychange", n), () => {
+      document.removeEventListener("visibilitychange", n);
+    };
+  }, []);
+}
+export {
+  u as default
+};

package/lib/Connect/hooks/security.js

@@ -0,0 +1,27 @@
+import l from "tweetnacl";
+import { useLocalStorageState as a } from "ahooks";
+import { useEffect as s } from "react";
+import { encodeKey as t, encrypt as d, decrypt as u } from "../../utils.js";
+const r = l.box.keyPair();
+function z() {
+  const [c, i] = a("__encKey", {
+    defaultValue: t(r.publicKey),
+    deserializer: (e) => e,
+    serializer: (e) => e
+  }), [o, p] = a("__decKey", {
+    defaultValue: t(r.secretKey),
+    deserializer: (e) => e,
+    serializer: (e) => e
+  });
+  return s(() => {
+    localStorage.getItem("__encKey") || i(t(r.publicKey)), localStorage.getItem("__decKey") || p(t(r.secretKey));
+  }, []), {
+    encryptKey: c,
+    decryptKey: o,
+    decrypt: (e, y = c, n = o) => u(e, y, n),
+    encrypt: (e, y = c) => d(e, y)
+  };
+}
+export {
+  z as default
+};