@arcblock/ux 3.0.34 → 3.0.36

package/lib/DIDConnect/icons/did-wallet-logo.d.ts

@@ -0,0 +1,7 @@
+type LogoSize = number | string;
+export default function DIDWalletLogo({ width, height, ...rest }: {
+    width?: LogoSize;
+    height?: LogoSize;
+    [key: string]: any;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/DIDConnect/icons/did-wallet-logo.js

@@ -0,0 +1,12 @@
+import { jsx as L } from "react/jsx-runtime";
+import { Box as N } from "@mui/material";
+function i({
+  width: M = "100%",
+  height: I = "100%",
+  ...j
+}) {
+  return /* @__PURE__ */ L(N, { component: "img", width: M, height: I, alt: "did-wallet-logo", ...j, src: "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgY2xpcC1wYXRoPSJ1cmwoI3ByZWZpeF9fY2xpcDApIj48cmVjdCB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHJ4PSI2IiBmaWxsPSJ1cmwoI3ByZWZpeF9fcGFpbnQwX2xpbmVhcikiLz48ZyBmaWx0ZXI9InVybCgjcHJlZml4X19maWx0ZXIwX2kpIj48cGF0aCBkPSJNMy41MiA3LjM2QTIuNTYgMi41NiAwIDAxNi4wOCA0LjhoMTkuODRhMi41NiAyLjU2IDAgMDEyLjU2IDIuNTZ2MTIuMTZhMi41NiAyLjU2IDAgMDEtMi41NiAyLjU2SDYuMDhhMi41NiAyLjU2IDAgMDEtMi41Ni0yLjU2VjcuMzZ6IiBmaWxsPSIjOUZDQkZGIi8+PC9nPjxnIGZpbHRlcj0idXJsKCNwcmVmaXhfX2ZpbHRlcjFfZCkiPjxwYXRoIGQ9Ik0yLjU2IDkuMjhhMi41NiAyLjU2IDAgMDEyLjU2LTIuNTZoMjEuNzZhMi41NiAyLjU2IDAgMDEyLjU2IDIuNTZ2MTMuNmEyLjU2IDIuNTYgMCAwMS0yLjU2IDIuNTZINS4xMmEyLjU2IDIuNTYgMCAwMS0yLjU2LTIuNTZWOS4yOHoiIGZpbGw9InVybCgjcHJlZml4X19wYWludDFfbGluZWFyKSIvPjwvZz48ZyBmaWx0ZXI9InVybCgjcHJlZml4X19maWx0ZXIyX2QpIj48cGF0aCBkPSJNMCAyMi4zMmwzMi02LjE2VjMySDB2LTkuNjh6IiBmaWxsPSJ1cmwoI3ByZWZpeF9fcGFpbnQyX2xpbmVhcikiLz48L2c+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjUzNiA5LjI0OGg4LjI4OGMuNDA4IDAgLjc0LjMuNzQuNjcydjQuNjRjMCAuMzcxLS4zMzIuNjcyLS43NC42NzJINS41MzZjLS40MDggMC0uNzQtLjMtLjc0LS42NzJ2LS4wNGEuMTU4LjE1OCAwIDEwLS4zMTYgMHYuMDRjMCAuNTMuNDczLjk2IDEuMDU2Ljk2aDguMjg4Yy41ODMgMCAxLjA1Ni0uNDMgMS4wNTYtLjk2VjkuOTJjMC0uNTMtLjQ3My0uOTYtMS4wNTYtLjk2SDUuNTM2Yy0uNTgzIDAtMS4wNTYuNDMtMS4wNTYuOTZ2LjA0YS4xNTguMTU4IDAgMDAuMzE3IDB2LS4wNGMwLS4zNzEuMzMtLjY3Mi43MzktLjY3MnptLTEuMDIzIDQuNjM4YS4xMjcuMTI3IDAgMDAuMDg3LjAzNGgxLjI2N2MuNDcyIDAgLjgzLS4xMDcgMS4wNzYtLjMyMi4yNS0uMjE3LjM4MS0uNTQ4LjM5Ny0uOTkzYTExLjI4MSAxMS4yODEgMCAwMDAtLjczNGMtLjAxMi0uNDI2LS4xNDgtLjc1MS0uNDA2LS45NzUtLjI1OC0uMjI0LS42MjItLjMzNi0xLjA5LS4zMzZINC42YS4xMjcuMTI3IDAgMDAtLjA4Ny4wMzQuMTE3LjExNyAwIDAwLS4wMzMuMDg2djMuMTJjMCAuMDMyLjAxMS4wNi4wMzMuMDg2em0xLjc5NC0uODA2Yy0uMDk5LjEtLjI1My4xNDktLjQ2NC4xNDloLS41MDJWMTEuMjVoLjQ3OGMuMjEgMCAuMzY5LjA1MS40NzQuMTU0LjEwOC4xMDIuMTY2LjI2LjE3Mi40NzUuMDA2LjA5LjAxLjIwOC4wMS4zNTVzLS4wMDQuMjY3LS4wMS4zNmMtLjAwNi4yMjEtLjA1OS4zODMtLjE1OC40ODV6bTEuNjMuODA2YS4xMjcuMTI3IDAgMDAuMDg3LjAzNGguNjRhLjExNi4xMTYgMCAwMC4wODctLjAzNC4xMS4xMSAwIDAwLjAzOC0uMDg2di0zLjEyYS4xMS4xMSAwIDAwLS4wMzgtLjA4Ni4xMTYuMTE2IDAgMDAtLjA4Ni0uMDM0aC0uNjQxYS4xMjcuMTI3IDAgMDAtLjA4Ny4wMzQuMTE3LjExNyAwIDAwLS4wMzMuMDg2djMuMTJjMCAuMDMyLjAxMS4wNi4wMzMuMDg2em0xLjYzNy4wMzRhLjEyNy4xMjcgMCAwMS0uMDg2LS4wMzQuMTI4LjEyOCAwIDAxLS4wMzMtLjA4NnYtMy4xMmMwLS4wMzUuMDEtLjA2NC4wMzMtLjA4NmEuMTI3LjEyNyAwIDAxLjA4Ni0uMDM0aDEuMjQ0Yy40NjkgMCAuODMyLjExMiAxLjA5LjMzNi4yNTkuMjI0LjM5NC41NDkuNDA3Ljk3NGExMS4yNDQgMTEuMjQ0IDAgMDEwIC43MzVjLS4wMTYuNDQ1LS4xNDguNzc2LS4zOTcuOTkzLS4yNDUuMjE1LS42MDQuMzIyLTEuMDc2LjMyMkg5LjU3NHptMS4yNDQtLjY5MWMuMjEgMCAuMzY1LS4wNS40NjQtLjE0OS4wOTktLjEwMi4xNTItLjI2NC4xNTgtLjQ4NWE1LjUyIDUuNTIgMCAwMC4wMS0uMzZjMC0uMTQ3LS4wMDQtLjI2NS0uMDEtLjM1NS0uMDA2LS4yMTQtLjA2NC0uMzczLS4xNzItLjQ3NS0uMTA2LS4xMDMtLjI2My0uMTU0LS40NzQtLjE1NGgtLjQ3OHYxLjk3OGguNTAyem0yLjQ2OC0xLjM4MmEuMjg4LjI4OCAwIDAxLS4yODgtLjI4Ni4yODguMjg4IDAgMDEuNTc2IDBjMCAuMTU4LS4xMy4yODYtLjI4OC4yODZ6bTAgMS40OTVhLjI4OC4yODggMCAwMS0uMjg4LS4yODYuMjg4LjI4OCAwIDAxLjU3NiAwYzAgLjE1OC0uMTMuMjg3LS4yODguMjg3eiIgZmlsbD0iIzQ1OThGQSIvPjwvZz48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9InByZWZpeF9fcGFpbnQwX2xpbmVhciIgeDE9IjE2IiB5MT0iMCIgeDI9IjE2IiB5Mj0iMzIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBzdG9wLWNvbG9yPSIjNEY5REY2Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMEE3OUY4Ii8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgaWQ9InByZWZpeF9fcGFpbnQxX2xpbmVhciIgeDE9IjE2IiB5MT0iNi43MiIgeDI9IjE2IiB5Mj0iMjUuNDQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBzdG9wLWNvbG9yPSIjZmZmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjRUNFRkZGIi8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgaWQ9InByZWZpeF9fcGFpbnQyX2xpbmVhciIgeDE9IjE2IiB5MT0iMTkuMiIgeDI9IjE4LjQ4IiB5Mj0iMzIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBvZmZzZXQ9Ii4wMDciIHN0b3AtY29sb3I9IiM3N0IyRjYiLz48c3RvcCBvZmZzZXQ9Ii4wNTUiIHN0b3AtY29sb3I9IiM0RjlERjYiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiM0NTk4RkEiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9InByZWZpeF9fZmlsdGVyMF9pIiB4PSIzLjUyIiB5PSIxLjgiIHdpZHRoPSIyNC45NiIgaGVpZ2h0PSIyMC4yOCIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPjxmZUZsb29kIGZsb29kLW9wYWNpdHk9IjAiIHJlc3VsdD0iQmFja2dyb3VuZEltYWdlRml4Ii8+PGZlQmxlbmQgaW49IlNvdXJjZUdyYXBoaWMiIGluMj0iQmFja2dyb3VuZEltYWdlRml4IiByZXN1bHQ9InNoYXBlIi8+PGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDEyNyAwIiByZXN1bHQ9ImhhcmRBbHBoYSIvPjxmZU9mZnNldCBkeT0iLTMiLz48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+PGZlQ29tcG9zaXRlIGluMj0iaGFyZEFscGhhIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazI9Ii0xIiBrMz0iMSIvPjxmZUNvbG9yTWF0cml4IHZhbHVlcz0iMCAwIDAgMCAxIDAgMCAwIDAgMSAwIDAgMCAwIDEgMCAwIDAgMC4yIDAiLz48ZmVCbGVuZCBpbjI9InNoYXBlIiByZXN1bHQ9ImVmZmVjdDFfaW5uZXJTaGFkb3ciLz48L2ZpbHRlcj48ZmlsdGVyIGlkPSJwcmVmaXhfX2ZpbHRlcjFfZCIgeD0iLTEuNDQiIHk9IjEuNzIiIHdpZHRoPSIzNC44OCIgaGVpZ2h0PSIyNi43MiIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPjxmZUZsb29kIGZsb29kLW9wYWNpdHk9IjAiIHJlc3VsdD0iQmFja2dyb3VuZEltYWdlRml4Ii8+PGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDEyNyAwIiByZXN1bHQ9ImhhcmRBbHBoYSIvPjxmZU9mZnNldCBkeT0iLTEiLz48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAuMjIwNzY3IDAgMCAwIDAgMC40NzA4MDMgMCAwIDAgMCAwLjcwMTYwNSAwIDAgMCAwLjE4IDAiLz48ZmVCbGVuZCBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3ciLz48ZmVCbGVuZCBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QxX2Ryb3BTaGFkb3ciIHJlc3VsdD0ic2hhcGUiLz48L2ZpbHRlcj48ZmlsdGVyIGlkPSJwcmVmaXhfX2ZpbHRlcjJfZCIgeD0iLTUiIHk9IjExLjE2IiB3aWR0aD0iNDIiIGhlaWdodD0iMjUuODQiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj48ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPjxmZUNvbG9yTWF0cml4IGluPSJTb3VyY2VBbHBoYSIgdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAxMjcgMCIgcmVzdWx0PSJoYXJkQWxwaGEiLz48ZmVPZmZzZXQvPjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIuNSIvPjxmZUNvbG9yTWF0cml4IHZhbHVlcz0iMCAwIDAgMCAwLjE0MzgyIDAgMCAwIDAgMC4yMDUwNjUgMCAwIDAgMCAwLjUyMjYzNCAwIDAgMCAwLjI1IDAiLz48ZmVCbGVuZCBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3ciLz48ZmVCbGVuZCBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QxX2Ryb3BTaGFkb3ciIHJlc3VsdD0ic2hhcGUiLz48L2ZpbHRlcj48Y2xpcFBhdGggaWQ9InByZWZpeF9fY2xpcDAiPjxyZWN0IHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgcng9IjYiIGZpbGw9IiNmZmYiLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=" });
+}
+export {
+  i as default
+};

package/lib/DIDConnect/icons/github-logo.d.ts

@@ -0,0 +1,7 @@
+type LogoSize = number | string;
+export default function GithubLogo({ width, height, ...props }: {
+    width?: LogoSize;
+    height?: LogoSize;
+    [key: string]: any;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/DIDConnect/icons/github-logo.js

@@ -0,0 +1,11 @@
+import { jsx as c } from "react/jsx-runtime";
+function e({
+  width: m = 24,
+  height: t = 24,
+  ...o
+}) {
+  return /* @__PURE__ */ c("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 256 250", width: m, height: t, ...o, children: /* @__PURE__ */ c("path", { d: "M128.001 0C57.317 0 0 57.307 0 128.001c0 56.554 36.676 104.535 87.535 121.46c6.397 1.185 8.746-2.777 8.746-6.158c0-3.052-.12-13.135-.174-23.83c-35.61 7.742-43.124-15.103-43.124-15.103c-5.823-14.795-14.213-18.73-14.213-18.73c-11.613-7.944.876-7.78.876-7.78c12.853.902 19.621 13.19 19.621 13.19c11.417 19.568 29.945 13.911 37.249 10.64c1.149-8.272 4.466-13.92 8.127-17.116c-28.431-3.236-58.318-14.212-58.318-63.258c0-13.975 5-25.394 13.188-34.358c-1.329-3.224-5.71-16.242 1.24-33.874c0 0 10.749-3.44 35.21 13.121c10.21-2.836 21.16-4.258 32.038-4.307c10.878.049 21.837 1.47 32.066 4.307c24.431-16.56 35.165-13.12 35.165-13.12c6.967 17.63 2.584 30.65 1.255 33.873c8.207 8.964 13.173 20.383 13.173 34.358c0 49.163-29.944 59.988-58.447 63.157c4.591 3.972 8.682 11.762 8.682 23.704c0 17.126-.148 30.91-.148 35.126c0 3.407 2.304 7.398 8.792 6.14C219.37 232.5 256 184.537 256 128.002C256 57.307 198.691 0 128.001 0m-80.06 182.34c-.282.636-1.283.827-2.194.39c-.929-.417-1.45-1.284-1.15-1.922c.276-.655 1.279-.838 2.205-.399c.93.418 1.46 1.293 1.139 1.931m6.296 5.618c-.61.566-1.804.303-2.614-.591c-.837-.892-.994-2.086-.375-2.66c.63-.566 1.787-.301 2.626.591c.838.903 1 2.088.363 2.66m4.32 7.188c-.785.545-2.067.034-2.86-1.104c-.784-1.138-.784-2.503.017-3.05c.795-.547 2.058-.055 2.861 1.075c.782 1.157.782 2.522-.019 3.08m7.304 8.325c-.701.774-2.196.566-3.29-.49c-1.119-1.032-1.43-2.496-.726-3.27c.71-.776 2.213-.558 3.315.49c1.11 1.03 1.45 2.505.701 3.27m9.442 2.81c-.31 1.003-1.75 1.459-3.199 1.033c-1.448-.439-2.395-1.613-2.103-2.626c.301-1.01 1.747-1.484 3.207-1.028c1.446.436 2.396 1.602 2.095 2.622m10.744 1.193c.036 1.055-1.193 1.93-2.715 1.95c-1.53.034-2.769-.82-2.786-1.86c0-1.065 1.202-1.932 2.733-1.958c1.522-.03 2.768.818 2.768 1.868m10.555-.405c.182 1.03-.875 2.088-2.387 2.37c-1.485.271-2.861-.365-3.05-1.386c-.184-1.056.893-2.114 2.376-2.387c1.514-.263 2.868.356 3.061 1.403" }) });
+}
+export {
+  e as default
+};

package/lib/DIDConnect/provider-icon.d.ts

@@ -0,0 +1,7 @@
+import { BoxProps } from '@mui/material';
+import { LOGIN_PROVIDER } from '../Util/constant';
+declare function ProviderIcon({ provider, ...rest }: {
+    provider?: (typeof LOGIN_PROVIDER)[keyof typeof LOGIN_PROVIDER] | 'wallet-web';
+} & BoxProps): import("react/jsx-runtime").JSX.Element | null;
+declare const _default: import('react').MemoExoticComponent<typeof ProviderIcon>;
+export default _default;

package/lib/DIDConnect/provider-icon.js

@@ -0,0 +1,52 @@
+import { jsx as t } from "react/jsx-runtime";
+import { memo as e } from "react";
+import c from "@iconify-icons/material-symbols/mail-outline-rounded";
+import f from "@iconify-icons/logos/apple";
+import p from "@iconify-icons/logos/google-icon";
+import h from "@iconify-icons/logos/auth0-icon";
+import a from "@iconify-icons/material-symbols/passkey-rounded";
+import { Icon as u } from "@iconify/react";
+import { Box as n } from "@mui/material";
+import { LOGIN_PROVIDER as o } from "../Util/constant.js";
+import { mergeSx as m } from "../Util/style.js";
+import I from "./icons/did-wallet-logo.js";
+import d from "./icons/github-logo.js";
+function L({
+  provider: l = "wallet",
+  ...r
+}) {
+  if (["wallet", "wallet-web"].includes(l))
+    return /* @__PURE__ */ t(I, { ...r });
+  if (l === o.GITHUB)
+    return /* @__PURE__ */ t(n, { component: "span", ...r, sx: m({ display: "inline-block" }, r.sx), children: /* @__PURE__ */ t(d, { width: "100%", height: "100%", fill: "currentColor" }) });
+  const i = {
+    [o.AUTH0]: h,
+    [o.EMAIL]: c,
+    [o.APPLE]: f,
+    [o.GOOGLE]: p,
+    [o.PASSKEY]: a,
+    [o.TWITTER]: {
+      body: '<path fill="currentColor" d="M149.079 108.399L242.33 0h-22.098l-80.97 94.12L74.59 0H0l97.796 142.328L0 256h22.1l85.507-99.395L175.905 256h74.59L149.073 108.399zM118.81 143.58l-9.909-14.172l-78.84-112.773h33.943l63.625 91.011l9.909 14.173l82.705 118.3H186.3l-67.49-96.533z"/>',
+      width: 251,
+      height: 251
+    }
+  };
+  return i[l] ? /* @__PURE__ */ t(
+    n,
+    {
+      component: u,
+      icon: i[l],
+      fill: "currentColor",
+      ...r,
+      sx: m(
+        { width: "100%", height: "100%" },
+        l === o.TWITTER ? { scale: "0.8" } : {},
+        r.sx
+      )
+    }
+  ) : null;
+}
+const M = e(L);
+export {
+  M as default
+};

package/lib/Util/constant.d.ts

@@ -23,6 +23,7 @@ export declare const LOGIN_PROVIDER: {
     WALLET: string;
     NFT: string;
     PASSKEY: string;
+    TWITTER: string;
 };
 export declare const LOGIN_PROVIDER_NAME: {
     [x: string]: string;
@@ -33,6 +34,7 @@ export declare const OAUTH_PROVIDER: {
     apple: string;
     github: string;
     google: string;
+    twitter: string;
 };
 export declare const DID_CONNECT_SMALL_WIDTH = 360;
 export declare const DID_CONNECT_MEDIUM_WIDTH = 576;

package/lib/Util/constant.js

@@ -1,4 +1,4 @@
-const o = 300, t = 1800, _ = "/.well-known/service", A = "login_token", I = "refresh_token", T = "/.well-known/service", e = "/api/did", n = `${_}/admin`, s = `${_}/user`, O = `${_}/user/did-spaces`, D = `${_}/admin/navigation`, L = "did:abt:", R = {
+const T = 300, _ = 1800, t = "/.well-known/service", o = "login_token", I = "refresh_token", e = "/.well-known/service", A = "/api/did", n = `${t}/admin`, s = `${t}/user`, O = `${t}/user/did-spaces`, R = `${t}/admin/navigation`, D = "did:abt:", L = {
   VALID: "valid",
   REVOKED: "revoked"
 }, E = {
@@ -9,8 +9,9 @@ const o = 300, t = 1800, _ = "/.well-known/service", A = "login_token", I = "ref
   GOOGLE: "google",
   WALLET: "wallet",
   NFT: "nft",
-  PASSKEY: "passkey"
-}, l = {
+  PASSKEY: "passkey",
+  TWITTER: "twitter"
+}, i = {
   [E.EMAIL]: "Email",
   [E.AUTH0]: "Auth0",
   [E.APPLE]: "Apple",
@@ -18,31 +19,33 @@ const o = 300, t = 1800, _ = "/.well-known/service", A = "login_token", I = "ref
   [E.GOOGLE]: "Google",
   [E.WALLET]: "DID Wallet",
   [E.NFT]: "NFT",
-  [E.PASSKEY]: "Passkey"
-}, c = {
+  [E.PASSKEY]: "Passkey",
+  [E.TWITTER]: "X"
+}, l = {
   email: "Email",
   auth0: "Auth0",
   apple: "Apple",
   github: "Github",
-  google: "Google"
-}, a = 360, i = 576;
+  google: "Google",
+  twitter: "X"
+}, c = 360, a = 576;
 export {
-  e as API_DID_PREFIX,
-  _ as BLOCKLET_SERVICE_PATH_PREFIX,
+  A as API_DID_PREFIX,
+  t as BLOCKLET_SERVICE_PATH_PREFIX,
   n as DASHBOARD_URL,
-  o as DEFAULT_TIMEOUT,
-  t as DEFAULT_WINDOW_TIMEOUT,
-  i as DID_CONNECT_MEDIUM_WIDTH,
-  a as DID_CONNECT_SMALL_WIDTH,
-  L as DID_PREFIX,
+  T as DEFAULT_TIMEOUT,
+  _ as DEFAULT_WINDOW_TIMEOUT,
+  a as DID_CONNECT_MEDIUM_WIDTH,
+  c as DID_CONNECT_SMALL_WIDTH,
+  D as DID_PREFIX,
   O as DID_SPACE_URL,
   E as LOGIN_PROVIDER,
-  l as LOGIN_PROVIDER_NAME,
-  D as NAVIGATION_URL,
-  c as OAUTH_PROVIDER,
-  R as PASSPORT_STATUS,
+  i as LOGIN_PROVIDER_NAME,
+  R as NAVIGATION_URL,
+  l as OAUTH_PROVIDER,
+  L as PASSPORT_STATUS,
   s as PROFILE_URL,
   I as REFRESH_TOKEN_STORAGE_KEY,
-  T as RELAY_SOCKET_PREFIX,
-  A as SESSION_TOKEN_STORAGE_KEY
+  e as RELAY_SOCKET_PREFIX,
+  o as SESSION_TOKEN_STORAGE_KEY
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "3.0.34",
+  "version": "3.0.36",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -60,16 +60,16 @@
     "react": "^19.0.0",
     "react-router-dom": "^6.22.3"
   },
-  "gitHead": "e2822eb021fb9aebfcf80f71dd4da4ca76b2372b",
+  "gitHead": "8d2ee041615e72c57199253d5425b50872642e6e",
   "dependencies": {
-    "@arcblock/bridge": "3.0.34",
+    "@arcblock/bridge": "3.0.36",
     "@arcblock/did": "^1.21.0",
     "@arcblock/did-motif": "^1.1.14",
-    "@arcblock/icons": "3.0.34",
-    "@arcblock/nft-display": "3.0.34",
-    "@arcblock/react-hooks": "3.0.34",
+    "@arcblock/icons": "3.0.36",
+    "@arcblock/nft-display": "3.0.36",
+    "@arcblock/react-hooks": "3.0.36",
     "@blocklet/js-sdk": "^1.16.46",
-    "@blocklet/theme": "3.0.34",
+    "@blocklet/theme": "3.0.36",
     "@fontsource/roboto": "~5.1.1",
     "@fontsource/ubuntu-mono": "^5.2.6",
     "@iconify-icons/logos": "^1.2.36",

package/src/DIDConnect/icons/did-wallet-logo.tsx

@@ -0,0 +1,18 @@
+import { Box } from '@mui/material';
+
+type LogoSize = number | string;
+
+export default function DIDWalletLogo({
+  width = '100%',
+  height = '100%',
+  ...rest
+}: {
+  width?: LogoSize;
+  height?: LogoSize;
+  [key: string]: any;
+}) {
+  const didWalletLogo =
+    'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgY2xpcC1wYXRoPSJ1cmwoI3ByZWZpeF9fY2xpcDApIj48cmVjdCB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHJ4PSI2IiBmaWxsPSJ1cmwoI3ByZWZpeF9fcGFpbnQwX2xpbmVhcikiLz48ZyBmaWx0ZXI9InVybCgjcHJlZml4X19maWx0ZXIwX2kpIj48cGF0aCBkPSJNMy41MiA3LjM2QTIuNTYgMi41NiAwIDAxNi4wOCA0LjhoMTkuODRhMi41NiAyLjU2IDAgMDEyLjU2IDIuNTZ2MTIuMTZhMi41NiAyLjU2IDAgMDEtMi41NiAyLjU2SDYuMDhhMi41NiAyLjU2IDAgMDEtMi41Ni0yLjU2VjcuMzZ6IiBmaWxsPSIjOUZDQkZGIi8+PC9nPjxnIGZpbHRlcj0idXJsKCNwcmVmaXhfX2ZpbHRlcjFfZCkiPjxwYXRoIGQ9Ik0yLjU2IDkuMjhhMi41NiAyLjU2IDAgMDEyLjU2LTIuNTZoMjEuNzZhMi41NiAyLjU2IDAgMDEyLjU2IDIuNTZ2MTMuNmEyLjU2IDIuNTYgMCAwMS0yLjU2IDIuNTZINS4xMmEyLjU2IDIuNTYgMCAwMS0yLjU2LTIuNTZWOS4yOHoiIGZpbGw9InVybCgjcHJlZml4X19wYWludDFfbGluZWFyKSIvPjwvZz48ZyBmaWx0ZXI9InVybCgjcHJlZml4X19maWx0ZXIyX2QpIj48cGF0aCBkPSJNMCAyMi4zMmwzMi02LjE2VjMySDB2LTkuNjh6IiBmaWxsPSJ1cmwoI3ByZWZpeF9fcGFpbnQyX2xpbmVhcikiLz48L2c+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjUzNiA5LjI0OGg4LjI4OGMuNDA4IDAgLjc0LjMuNzQuNjcydjQuNjRjMCAuMzcxLS4zMzIuNjcyLS43NC42NzJINS41MzZjLS40MDggMC0uNzQtLjMtLjc0LS42NzJ2LS4wNGEuMTU4LjE1OCAwIDEwLS4zMTYgMHYuMDRjMCAuNTMuNDczLjk2IDEuMDU2Ljk2aDguMjg4Yy41ODMgMCAxLjA1Ni0uNDMgMS4wNTYtLjk2VjkuOTJjMC0uNTMtLjQ3My0uOTYtMS4wNTYtLjk2SDUuNTM2Yy0uNTgzIDAtMS4wNTYuNDMtMS4wNTYuOTZ2LjA0YS4xNTguMTU4IDAgMDAuMzE3IDB2LS4wNGMwLS4zNzEuMzMtLjY3Mi43MzktLjY3MnptLTEuMDIzIDQuNjM4YS4xMjcuMTI3IDAgMDAuMDg3LjAzNGgxLjI2N2MuNDcyIDAgLjgzLS4xMDcgMS4wNzYtLjMyMi4yNS0uMjE3LjM4MS0uNTQ4LjM5Ny0uOTkzYTExLjI4MSAxMS4yODEgMCAwMDAtLjczNGMtLjAxMi0uNDI2LS4xNDgtLjc1MS0uNDA2LS45NzUtLjI1OC0uMjI0LS42MjItLjMzNi0xLjA5LS4zMzZINC42YS4xMjcuMTI3IDAgMDAtLjA4Ny4wMzQuMTE3LjExNyAwIDAwLS4wMzMuMDg2djMuMTJjMCAuMDMyLjAxMS4wNi4wMzMuMDg2em0xLjc5NC0uODA2Yy0uMDk5LjEtLjI1My4xNDktLjQ2NC4xNDloLS41MDJWMTEuMjVoLjQ3OGMuMjEgMCAuMzY5LjA1MS40NzQuMTU0LjEwOC4xMDIuMTY2LjI2LjE3Mi40NzUuMDA2LjA5LjAxLjIwOC4wMS4zNTVzLS4wMDQuMjY3LS4wMS4zNmMtLjAwNi4yMjEtLjA1OS4zODMtLjE1OC40ODV6bTEuNjMuODA2YS4xMjcuMTI3IDAgMDAuMDg3LjAzNGguNjRhLjExNi4xMTYgMCAwMC4wODctLjAzNC4xMS4xMSAwIDAwLjAzOC0uMDg2di0zLjEyYS4xMS4xMSAwIDAwLS4wMzgtLjA4Ni4xMTYuMTE2IDAgMDAtLjA4Ni0uMDM0aC0uNjQxYS4xMjcuMTI3IDAgMDAtLjA4Ny4wMzQuMTE3LjExNyAwIDAwLS4wMzMuMDg2djMuMTJjMCAuMDMyLjAxMS4wNi4wMzMuMDg2em0xLjYzNy4wMzRhLjEyNy4xMjcgMCAwMS0uMDg2LS4wMzQuMTI4LjEyOCAwIDAxLS4wMzMtLjA4NnYtMy4xMmMwLS4wMzUuMDEtLjA2NC4wMzMtLjA4NmEuMTI3LjEyNyAwIDAxLjA4Ni0uMDM0aDEuMjQ0Yy40NjkgMCAuODMyLjExMiAxLjA5LjMzNi4yNTkuMjI0LjM5NC41NDkuNDA3Ljk3NGExMS4yNDQgMTEuMjQ0IDAgMDEwIC43MzVjLS4wMTYuNDQ1LS4xNDguNzc2LS4zOTcuOTkzLS4yNDUuMjE1LS42MDQuMzIyLTEuMDc2LjMyMkg5LjU3NHptMS4yNDQtLjY5MWMuMjEgMCAuMzY1LS4wNS40NjQtLjE0OS4wOTktLjEwMi4xNTItLjI2NC4xNTgtLjQ4NWE1LjUyIDUuNTIgMCAwMC4wMS0uMzZjMC0uMTQ3LS4wMDQtLjI2NS0uMDEtLjM1NS0uMDA2LS4yMTQtLjA2NC0uMzczLS4xNzItLjQ3NS0uMTA2LS4xMDMtLjI2My0uMTU0LS40NzQtLjE1NGgtLjQ3OHYxLjk3OGguNTAyem0yLjQ2OC0xLjM4MmEuMjg4LjI4OCAwIDAxLS4yODgtLjI4Ni4yODguMjg4IDAgMDEuNTc2IDBjMCAuMTU4LS4xMy4yODYtLjI4OC4yODZ6bTAgMS40OTVhLjI4OC4yODggMCAwMS0uMjg4LS4yODYuMjg4LjI4OCAwIDAxLjU3NiAwYzAgLjE1OC0uMTMuMjg3LS4yODguMjg3eiIgZmlsbD0iIzQ1OThGQSIvPjwvZz48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9InByZWZpeF9fcGFpbnQwX2xpbmVhciIgeDE9IjE2IiB5MT0iMCIgeDI9IjE2IiB5Mj0iMzIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBzdG9wLWNvbG9yPSIjNEY5REY2Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMEE3OUY4Ii8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgaWQ9InByZWZpeF9fcGFpbnQxX2xpbmVhciIgeDE9IjE2IiB5MT0iNi43MiIgeDI9IjE2IiB5Mj0iMjUuNDQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBzdG9wLWNvbG9yPSIjZmZmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjRUNFRkZGIi8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgaWQ9InByZWZpeF9fcGFpbnQyX2xpbmVhciIgeDE9IjE2IiB5MT0iMTkuMiIgeDI9IjE4LjQ4IiB5Mj0iMzIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj48c3RvcCBvZmZzZXQ9Ii4wMDciIHN0b3AtY29sb3I9IiM3N0IyRjYiLz48c3RvcCBvZmZzZXQ9Ii4wNTUiIHN0b3AtY29sb3I9IiM0RjlERjYiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiM0NTk4RkEiLz48L2xpbmVhckdyYWRpZW50PjxmaWx0ZXIgaWQ9InByZWZpeF9fZmlsdGVyMF9pIiB4PSIzLjUyIiB5PSIxLjgiIHdpZHRoPSIyNC45NiIgaGVpZ2h0PSIyMC4yOCIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPjxmZUZsb29kIGZsb29kLW9wYWNpdHk9IjAiIHJlc3VsdD0iQmFja2dyb3VuZEltYWdlRml4Ii8+PGZlQmxlbmQgaW49IlNvdXJjZUdyYXBoaWMiIGluMj0iQmFja2dyb3VuZEltYWdlRml4IiByZXN1bHQ9InNoYXBlIi8+PGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDEyNyAwIiByZXN1bHQ9ImhhcmRBbHBoYSIvPjxmZU9mZnNldCBkeT0iLTMiLz48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+PGZlQ29tcG9zaXRlIGluMj0iaGFyZEFscGhhIiBvcGVyYXRvcj0iYXJpdGhtZXRpYyIgazI9Ii0xIiBrMz0iMSIvPjxmZUNvbG9yTWF0cml4IHZhbHVlcz0iMCAwIDAgMCAxIDAgMCAwIDAgMSAwIDAgMCAwIDEgMCAwIDAgMC4yIDAiLz48ZmVCbGVuZCBpbjI9InNoYXBlIiByZXN1bHQ9ImVmZmVjdDFfaW5uZXJTaGFkb3ciLz48L2ZpbHRlcj48ZmlsdGVyIGlkPSJwcmVmaXhfX2ZpbHRlcjFfZCIgeD0iLTEuNDQiIHk9IjEuNzIiIHdpZHRoPSIzNC44OCIgaGVpZ2h0PSIyNi43MiIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPjxmZUZsb29kIGZsb29kLW9wYWNpdHk9IjAiIHJlc3VsdD0iQmFja2dyb3VuZEltYWdlRml4Ii8+PGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB2YWx1ZXM9IjAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDEyNyAwIiByZXN1bHQ9ImhhcmRBbHBoYSIvPjxmZU9mZnNldCBkeT0iLTEiLz48ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAuMjIwNzY3IDAgMCAwIDAgMC40NzA4MDMgMCAwIDAgMCAwLjcwMTYwNSAwIDAgMCAwLjE4IDAiLz48ZmVCbGVuZCBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3ciLz48ZmVCbGVuZCBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QxX2Ryb3BTaGFkb3ciIHJlc3VsdD0ic2hhcGUiLz48L2ZpbHRlcj48ZmlsdGVyIGlkPSJwcmVmaXhfX2ZpbHRlcjJfZCIgeD0iLTUiIHk9IjExLjE2IiB3aWR0aD0iNDIiIGhlaWdodD0iMjUuODQiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj48ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPjxmZUNvbG9yTWF0cml4IGluPSJTb3VyY2VBbHBoYSIgdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAxMjcgMCIgcmVzdWx0PSJoYXJkQWxwaGEiLz48ZmVPZmZzZXQvPjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjIuNSIvPjxmZUNvbG9yTWF0cml4IHZhbHVlcz0iMCAwIDAgMCAwLjE0MzgyIDAgMCAwIDAgMC4yMDUwNjUgMCAwIDAgMCAwLjUyMjYzNCAwIDAgMCAwLjI1IDAiLz48ZmVCbGVuZCBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3ciLz48ZmVCbGVuZCBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QxX2Ryb3BTaGFkb3ciIHJlc3VsdD0ic2hhcGUiLz48L2ZpbHRlcj48Y2xpcFBhdGggaWQ9InByZWZpeF9fY2xpcDAiPjxyZWN0IHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgcng9IjYiIGZpbGw9IiNmZmYiLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=';
+
+  return <Box component="img" width={width} height={height} alt="did-wallet-logo" {...rest} src={didWalletLogo} />;
+}

package/src/DIDConnect/icons/github-logo.tsx

@@ -0,0 +1,17 @@
+type LogoSize = number | string;
+
+export default function GithubLogo({
+  width = 24,
+  height = 24,
+  ...props
+}: {
+  width?: LogoSize;
+  height?: LogoSize;
+  [key: string]: any;
+}) {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 250" width={width} height={height} {...props}>
+      <path d="M128.001 0C57.317 0 0 57.307 0 128.001c0 56.554 36.676 104.535 87.535 121.46c6.397 1.185 8.746-2.777 8.746-6.158c0-3.052-.12-13.135-.174-23.83c-35.61 7.742-43.124-15.103-43.124-15.103c-5.823-14.795-14.213-18.73-14.213-18.73c-11.613-7.944.876-7.78.876-7.78c12.853.902 19.621 13.19 19.621 13.19c11.417 19.568 29.945 13.911 37.249 10.64c1.149-8.272 4.466-13.92 8.127-17.116c-28.431-3.236-58.318-14.212-58.318-63.258c0-13.975 5-25.394 13.188-34.358c-1.329-3.224-5.71-16.242 1.24-33.874c0 0 10.749-3.44 35.21 13.121c10.21-2.836 21.16-4.258 32.038-4.307c10.878.049 21.837 1.47 32.066 4.307c24.431-16.56 35.165-13.12 35.165-13.12c6.967 17.63 2.584 30.65 1.255 33.873c8.207 8.964 13.173 20.383 13.173 34.358c0 49.163-29.944 59.988-58.447 63.157c4.591 3.972 8.682 11.762 8.682 23.704c0 17.126-.148 30.91-.148 35.126c0 3.407 2.304 7.398 8.792 6.14C219.37 232.5 256 184.537 256 128.002C256 57.307 198.691 0 128.001 0m-80.06 182.34c-.282.636-1.283.827-2.194.39c-.929-.417-1.45-1.284-1.15-1.922c.276-.655 1.279-.838 2.205-.399c.93.418 1.46 1.293 1.139 1.931m6.296 5.618c-.61.566-1.804.303-2.614-.591c-.837-.892-.994-2.086-.375-2.66c.63-.566 1.787-.301 2.626.591c.838.903 1 2.088.363 2.66m4.32 7.188c-.785.545-2.067.034-2.86-1.104c-.784-1.138-.784-2.503.017-3.05c.795-.547 2.058-.055 2.861 1.075c.782 1.157.782 2.522-.019 3.08m7.304 8.325c-.701.774-2.196.566-3.29-.49c-1.119-1.032-1.43-2.496-.726-3.27c.71-.776 2.213-.558 3.315.49c1.11 1.03 1.45 2.505.701 3.27m9.442 2.81c-.31 1.003-1.75 1.459-3.199 1.033c-1.448-.439-2.395-1.613-2.103-2.626c.301-1.01 1.747-1.484 3.207-1.028c1.446.436 2.396 1.602 2.095 2.622m10.744 1.193c.036 1.055-1.193 1.93-2.715 1.95c-1.53.034-2.769-.82-2.786-1.86c0-1.065 1.202-1.932 2.733-1.958c1.522-.03 2.768.818 2.768 1.868m10.555-.405c.182 1.03-.875 2.088-2.387 2.37c-1.485.271-2.861-.365-3.05-1.386c-.184-1.056.893-2.114 2.376-2.387c1.514-.263 2.868.356 3.061 1.403" />
+    </svg>
+  );
+}

package/src/DIDConnect/provider-icon.tsx

@@ -0,0 +1,62 @@
+import { memo } from 'react';
+import mailOutlineRoundedIcon from '@iconify-icons/material-symbols/mail-outline-rounded';
+import appleIcon from '@iconify-icons/logos/apple';
+import googleIcon from '@iconify-icons/logos/google-icon';
+import auth0Icon from '@iconify-icons/logos/auth0-icon';
+import passKeyRoundedIcon from '@iconify-icons/material-symbols/passkey-rounded';
+import { Icon } from '@iconify/react';
+import { Box, BoxProps, SxProps } from '@mui/material';
+
+import { LOGIN_PROVIDER } from '../Util/constant';
+import { mergeSx } from '../Util/style';
+import DIDWalletLogo from './icons/did-wallet-logo';
+import GithubLogo from './icons/github-logo';
+
+function ProviderIcon({
+  provider = 'wallet',
+  ...rest
+}: {
+  provider?: (typeof LOGIN_PROVIDER)[keyof typeof LOGIN_PROVIDER] | 'wallet-web';
+} & BoxProps) {
+  if (['wallet', 'wallet-web'].includes(provider)) {
+    // @ts-ignore
+    return <DIDWalletLogo {...rest} />;
+  }
+
+  if (provider === LOGIN_PROVIDER.GITHUB) {
+    return (
+      <Box component="span" {...rest} sx={mergeSx({ display: 'inline-block' }, rest.sx as SxProps)}>
+        <GithubLogo width="100%" height="100%" fill="currentColor" />
+      </Box>
+    );
+  }
+
+  const iconMap = {
+    [LOGIN_PROVIDER.AUTH0]: auth0Icon,
+    [LOGIN_PROVIDER.EMAIL]: mailOutlineRoundedIcon,
+    [LOGIN_PROVIDER.APPLE]: appleIcon,
+    [LOGIN_PROVIDER.GOOGLE]: googleIcon,
+    [LOGIN_PROVIDER.PASSKEY]: passKeyRoundedIcon,
+    [LOGIN_PROVIDER.TWITTER]: {
+      body: '<path fill="currentColor" d="M149.079 108.399L242.33 0h-22.098l-80.97 94.12L74.59 0H0l97.796 142.328L0 256h22.1l85.507-99.395L175.905 256h74.59L149.073 108.399zM118.81 143.58l-9.909-14.172l-78.84-112.773h33.943l63.625 91.011l9.909 14.173l82.705 118.3H186.3l-67.49-96.533z"/>',
+      width: 251,
+      height: 251,
+    },
+  };
+
+  return iconMap[provider] ? (
+    <Box
+      component={Icon}
+      icon={iconMap[provider]}
+      fill="currentColor"
+      {...rest}
+      sx={mergeSx(
+        { width: '100%', height: '100%' },
+        provider === LOGIN_PROVIDER.TWITTER ? { scale: '0.8' } : {},
+        rest.sx as SxProps
+      )}
+    />
+  ) : null;
+}
+
+export default memo(ProviderIcon);

package/src/Util/constant.ts

@@ -28,6 +28,7 @@ export const LOGIN_PROVIDER = {
   WALLET: 'wallet',
   NFT: 'nft',
   PASSKEY: 'passkey',
+  TWITTER: 'twitter',
 };
 
 export const LOGIN_PROVIDER_NAME = {
@@ -39,6 +40,7 @@ export const LOGIN_PROVIDER_NAME = {
   [LOGIN_PROVIDER.WALLET]: 'DID Wallet',
   [LOGIN_PROVIDER.NFT]: 'NFT',
   [LOGIN_PROVIDER.PASSKEY]: 'Passkey',
+  [LOGIN_PROVIDER.TWITTER]: 'X',
 };
 
 // HACK: 目前这里的键值不能使用 [LOGIN_PROVIDER.AUTH0] 形式，否则会影响 ts 的 keyof typeof OAUTH_PROVIDER 来获取键值作为类型的判断
@@ -48,6 +50,7 @@ export const OAUTH_PROVIDER = {
   apple: 'Apple',
   github: 'Github',
   google: 'Google',
+  twitter: 'X',
 };
 
 export const DID_CONNECT_SMALL_WIDTH = 360;