@blocklet/ui-react 2.9.90 → 2.10.0

package/es/UserCenter/components/storage/preview-nft.js

@@ -1,80 +0,0 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import ReactPlaceholder from "react-placeholder";
-import { Dialog, DialogContent, IconButton } from "@mui/material";
-import CloseOutlinedIcon from "@mui/icons-material/CloseOutlined";
-import EmptySpacesNFT from "./icons/empty-spaces-nft.svg?react";
-function PreviewSpaceNft({ src, alt }) {
-  const [showEmptySpaceNFT, setShowEmptySpaceNFT] = useState(false);
-  const [open, setOpen] = useState(false);
-  const handleOpen = () => setOpen(true);
-  const handleClose = () => setOpen(false);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      ReactPlaceholder,
-      {
-        ready: showEmptySpaceNFT,
-        customPlaceholder: (
-          // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
-          /* @__PURE__ */ jsx(
-            "img",
-            {
-              style: { cursor: "pointer" },
-              alt,
-              src,
-              width: "58px",
-              height: "58px",
-              onError: () => setShowEmptySpaceNFT(true),
-              onClick: handleOpen
-            }
-          )
-        ),
-        children: /* @__PURE__ */ jsx(EmptySpacesNFT, { style: { cursor: "pointer", width: "58px", height: "58px" }, onClick: handleOpen })
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      Dialog,
-      {
-        open,
-        onClose: handleClose,
-        "aria-labelledby": "preview-space-nft-display",
-        "aria-describedby": "preview space nft display",
-        fullWidth: true,
-        maxWidth: "md",
-        children: /* @__PURE__ */ jsxs(DialogContent, { style: { padding: "8px 8px", backgroundColor: "rgba(0,0,0,0.8)" }, children: [
-          /* @__PURE__ */ jsx(
-            IconButton,
-            {
-              color: "inherit",
-              onClick: handleClose,
-              "aria-label": "close",
-              style: { position: "absolute", top: 8, right: 8, color: "white" },
-              children: /* @__PURE__ */ jsx(CloseOutlinedIcon, {})
-            }
-          ),
-          showEmptySpaceNFT ? /* @__PURE__ */ jsx(
-            EmptySpacesNFT,
-            {
-              style: {
-                width: "100%",
-                height: "75vh"
-              }
-            }
-          ) : /* @__PURE__ */ jsx(
-            "img",
-            {
-              src,
-              alt: "",
-              style: {
-                width: "100%",
-                height: "75vh",
-                objectFit: "contain"
-              }
-            }
-          )
-        ] })
-      }
-    )
-  ] });
-}
-export default PreviewSpaceNft;

package/es/UserCenter/components/third-party-login/index.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import type { User } from '../../../@types';
-export default function ThirdPartyLogin({ user }: {
-    user: User;
-}): import("react").JSX.Element;

package/es/UserCenter/components/third-party-login/index.js

@@ -1,110 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useContext, useState } from "react";
-import { Box } from "@mui/material";
-import { useAsyncEffect, useCreation } from "ahooks";
-import { getConnectedAccounts, getSourceProvider } from "@arcblock/ux/lib/SessionUser/libs/utils";
-import { LOGIN_PROVIDER } from "@arcblock/ux/lib/Util/constant";
-import { SessionContext } from "@arcblock/did-connect/lib/Session";
-import ThirdPartyItem from "./third-party-item.js";
-export default function ThirdPartyLogin({ user }) {
-  const { session } = useContext(SessionContext);
-  const [oauthConfigs, setOauthConfigs] = useState({});
-  const { getOAuthConfigs } = session.useOAuth();
-  useAsyncEffect(async () => {
-    const data = await getOAuthConfigs({
-      sourceAppPid: user?.sourceAppPid
-    });
-    setOauthConfigs(data);
-  }, [user?.sourceAppPid]);
-  const availableProviders = useCreation(() => {
-    const oauthList = Object.keys(oauthConfigs).map((x) => {
-      return {
-        ...oauthConfigs[x],
-        provider: x
-      };
-    }).filter((x) => x.enabled);
-    return oauthList;
-  }, [oauthConfigs]);
-  const normalizedAccounts = useCreation(() => {
-    const connectedAccounts = getConnectedAccounts(user);
-    let removeAuth0 = false;
-    let patchProvider = "";
-    let sourceProvider = getSourceProvider(user);
-    const auth0ConnectedAccount = connectedAccounts.find((x) => x.provider === LOGIN_PROVIDER.AUTH0);
-    if (auth0ConnectedAccount) {
-      if (auth0ConnectedAccount.id.startsWith("google-oauth2|")) {
-        if (!connectedAccounts.some((x) => x.provider === "google")) {
-          removeAuth0 = true;
-          patchProvider = LOGIN_PROVIDER.GOOGLE;
-          if (sourceProvider === LOGIN_PROVIDER.AUTH0) {
-            sourceProvider = LOGIN_PROVIDER.GOOGLE;
-          }
-        }
-      }
-      if (auth0ConnectedAccount.id.startsWith("appleid|")) {
-        if (!connectedAccounts.some((x) => x.provider === LOGIN_PROVIDER.APPLE)) {
-          removeAuth0 = true;
-          patchProvider = LOGIN_PROVIDER.APPLE;
-          if (sourceProvider === LOGIN_PROVIDER.AUTH0) {
-            sourceProvider = LOGIN_PROVIDER.APPLE;
-          }
-        }
-      }
-      if (auth0ConnectedAccount.id.startsWith("github|")) {
-        if (!connectedAccounts.some((x) => x.provider === LOGIN_PROVIDER.GITHUB)) {
-          removeAuth0 = true;
-          patchProvider = LOGIN_PROVIDER.GITHUB;
-          if (sourceProvider === LOGIN_PROVIDER.AUTH0) {
-            sourceProvider = LOGIN_PROVIDER.GITHUB;
-          }
-        }
-      }
-    }
-    const transformedProviders = availableProviders.map((x) => {
-      if (x.provider === LOGIN_PROVIDER.AUTH0 && removeAuth0) {
-        return null;
-      }
-      const findConnectedAccount = removeAuth0 && x.provider === patchProvider ? connectedAccounts.find((i) => i.provider === LOGIN_PROVIDER.AUTH0) : connectedAccounts.find((i) => i.provider === x.provider);
-      if (findConnectedAccount) {
-        return {
-          ...x,
-          provider: x.provider,
-          did: findConnectedAccount.did,
-          pk: findConnectedAccount.pk,
-          userInfo: findConnectedAccount.userInfo,
-          _bind: true,
-          _rawProvider: findConnectedAccount.provider,
-          _mainProvider: x.provider === sourceProvider
-        };
-      }
-      return {
-        ...x,
-        provider: x.provider,
-        _rawProvider: x.provider,
-        _mainProvider: x.provider === sourceProvider
-      };
-    }).filter(Boolean).sort((a, b) => {
-      if (a?.order !== void 0 && b?.order !== void 0) {
-        return a.order - b.order;
-      }
-      if (a?.order !== void 0) {
-        return -1;
-      }
-      return 1;
-    });
-    return transformedProviders;
-  }, [user?.connectedAccounts, availableProviders]);
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      sx: {
-        gap: 1,
-        display: "grid",
-        gridTemplateColumns: "1fr min-content"
-      },
-      children: normalizedAccounts.map((account) => {
-        return /* @__PURE__ */ jsx(ThirdPartyItem, { item: account }, account?.provider);
-      })
-    }
-  );
-}

package/es/UserCenter/components/third-party-login/third-party-item.d.ts

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-import type { OAuthAccount } from '../../../@types';
-export default function ThirdPartyItem({ item, }: {
-    item: {
-        provider: string;
-        did: string;
-        pk: string;
-        userInfo?: OAuthAccount['userInfo'];
-        _bind?: boolean;
-        _rawProvider?: string;
-        _mainProvider?: boolean;
-    };
-}): import("react").JSX.Element;

package/es/UserCenter/components/third-party-login/third-party-item.js

@@ -1,224 +0,0 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Icon } from "@iconify/react";
-import { Box, Tooltip, Typography } from "@mui/material";
-import LinkRoundedIcon from "@iconify-icons/material-symbols/link-rounded";
-import { temp as colors } from "@arcblock/ux/lib/Colors";
-import Button from "@arcblock/ux/lib/Button";
-import Avatar from "@arcblock/ux/lib/Avatar";
-import { useCreation, useMemoizedFn, useReactive } from "ahooks";
-import { translate } from "@arcblock/ux/lib/Locale/util";
-import { useConfirm } from "@arcblock/ux/lib/Dialog";
-import { useLocaleContext } from "@arcblock/ux/lib/Locale/context";
-import MailOutlineRoundedIcon from "@iconify-icons/material-symbols/mail-outline-rounded";
-import InfoOutlineRoundedIcon from "@iconify-icons/material-symbols/info-outline-rounded";
-import AppleIcon from "@iconify-icons/logos/apple";
-import GithubIcon from "@iconify-icons/logos/github-icon";
-import GoogleIcon from "@iconify-icons/logos/google-icon";
-import { SessionContext } from "@arcblock/did-connect/lib/Session";
-import { useContext } from "react";
-import pick from "lodash/pick";
-import { getFederatedEnabled, getMaster } from "@arcblock/ux/lib/Util/federated";
-import { LOGIN_PROVIDER, OAUTH_PROVIDER } from "@arcblock/ux/lib/Util/constant";
-import { translations } from "../../libs/locales.js";
-export default function ThirdPartyItem({
-  item
-}) {
-  const { confirmApi, confirmHolder } = useConfirm();
-  const currentState = useReactive({
-    loading: false
-  });
-  const { locale } = useLocaleContext();
-  const t = useMemoizedFn((key, data = {}) => {
-    return translate(translations, key, locale, "en", data);
-  });
-  const { session } = useContext(SessionContext);
-  const { bindOAuth, unbindOAuth, setBaseUrl, baseUrl: oauthBaseUrl } = session.useOAuth();
-  const iconMap = {
-    // email: MailOutlineRoundedIcon,
-    [LOGIN_PROVIDER.AUTH0]: MailOutlineRoundedIcon,
-    [LOGIN_PROVIDER.APPLE]: AppleIcon,
-    [LOGIN_PROVIDER.GITHUB]: GithubIcon,
-    [LOGIN_PROVIDER.GOOGLE]: GoogleIcon
-  };
-  const icon = useCreation(() => {
-    return iconMap[item?.provider];
-  }, [item?.provider]);
-  const title = useCreation(() => {
-    return OAUTH_PROVIDER[item?.provider] || "unknown";
-  }, [item?.provider]);
-  const toggleBind = useMemoizedFn(async () => {
-    try {
-      currentState.loading = true;
-      await new Promise((resolve, reject) => {
-        if (item?._bind) {
-          confirmApi.open({
-            title: t("thirdPartyLogin.confirmUnbind", { name: title }),
-            content: t("thirdPartyLogin.confirmUnbindDescription", { name: title }),
-            confirmButtonText: t("common.confirm"),
-            cancelButtonText: t("common.cancel"),
-            onConfirm(close) {
-              unbindOAuth({
-                session,
-                connectedAccount: {
-                  ...pick(item, ["did", "pk"]),
-                  showProvider: item.provider,
-                  provider: item._rawProvider
-                }
-              }).then(resolve).catch(reject);
-              close();
-            },
-            onCancel: resolve
-          });
-        } else {
-          const backupBaseUrl = oauthBaseUrl;
-          const blocklet = window?.blocklet;
-          let baseUrl = "/";
-          const federatedEnabled = getFederatedEnabled(blocklet);
-          const master = getMaster(blocklet);
-          if (federatedEnabled && master?.appPid && session?.user?.sourceAppPid) {
-            baseUrl = master.appUrl;
-          }
-          setBaseUrl(baseUrl);
-          bindOAuth({
-            session,
-            oauthItem: {
-              ...item,
-              provider: item._rawProvider
-            }
-          }).then(resolve).catch(reject).finally(() => {
-            setBaseUrl(backupBaseUrl);
-          });
-        }
-      });
-    } catch (err) {
-      console.error(`Failed to ${item?._bind ? "unbind" : "bind"} oauth account`, err);
-    } finally {
-      currentState.loading = false;
-    }
-  });
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(
-      Box,
-      {
-        sx: {
-          borderRadius: 2,
-          border: `1px solid ${colors.strokeBorderBase}`,
-          background: colors.backgroundsBgField,
-          display: "flex",
-          alignItems: "center",
-          py: 1,
-          px: 1.5,
-          gap: 0.75,
-          fontSize: "14px",
-          lineHeight: 1,
-          overflow: "hidden"
-        },
-        children: [
-          /* @__PURE__ */ jsx(Box, { component: Icon, icon, width: "1em", height: "1em", sx: { flexShrink: 0, fontSize: 16 } }),
-          /* @__PURE__ */ jsx(
-            Box,
-            {
-              sx: {
-                flex: 1
-              },
-              children: title
-            }
-          ),
-          /* @__PURE__ */ jsxs(
-            Box,
-            {
-              sx: {
-                display: "flex",
-                alignItems: "center",
-                gap: 0.5
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  Box,
-                  {
-                    sx: {
-                      flex: 1,
-                      textOverflow: "ellipsis",
-                      overflow: "hidden",
-                      lineHeight: "normal"
-                    },
-                    children: item.userInfo?.email || item.did
-                  }
-                ),
-                item.userInfo?.email ? /* @__PURE__ */ jsx(
-                  Tooltip,
-                  {
-                    title: /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
-                      /* @__PURE__ */ jsx(Avatar, { size: 36, variant: "circle", shape: "circle", src: item.userInfo?.picture, did: item.did }),
-                      /* @__PURE__ */ jsxs(Box, { children: [
-                        /* @__PURE__ */ jsx(
-                          Typography,
-                          {
-                            sx: {
-                              whiteSpace: "normal",
-                              wordBreak: "break-all",
-                              fontSize: "0.9rem"
-                            },
-                            children: item.userInfo?.name
-                          }
-                        ),
-                        /* @__PURE__ */ jsx(
-                          Typography,
-                          {
-                            sx: {
-                              whiteSpace: "normal",
-                              wordBreak: "break-all",
-                              fontSize: "0.9rem"
-                            },
-                            children: item.userInfo?.email
-                          }
-                        )
-                      ] })
-                    ] }) }),
-                    children: /* @__PURE__ */ jsx(
-                      Box,
-                      {
-                        component: Icon,
-                        icon: InfoOutlineRoundedIcon,
-                        color: colors.textSubtitle,
-                        fontSize: 16,
-                        sx: { cursor: "pointer", flexShrink: 0 }
-                      }
-                    )
-                  }
-                ) : null
-              ]
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(Tooltip, { title: item._mainProvider ? t("thirdPartyLogin.mainProviderCantRemove") : "", children: /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "outlined",
-        size: "small",
-        sx: {
-          color: item?._bind ? colors.red : colors.foregroundsFgBase,
-          borderColor: item?._bind ? colors.red : colors.strokeBorderBase,
-          backgroundColor: colors.buttonsButtonNeutral,
-          "&:hover": {
-            borderColor: item?._bind ? colors.red : colors.strokeBorderBase,
-            backgroundColor: colors.buttonsButtonNeutralHover
-          },
-          py: 0.5,
-          borderRadius: 2,
-          fontWeight: 500,
-          whiteSpace: "nowrap"
-        },
-        fullWidth: true,
-        startIcon: currentState.loading ? null : /* @__PURE__ */ jsx(Icon, { icon: LinkRoundedIcon }),
-        onClick: toggleBind,
-        disabled: item._mainProvider,
-        loading: currentState.loading,
-        children: item?._bind ? t("thirdPartyLogin.disconnect") : t("thirdPartyLogin.connect")
-      }
-    ) }) }),
-    confirmHolder
-  ] });
-}

package/es/UserCenter/components/user-center.d.ts

@@ -1,15 +0,0 @@
-/// <reference types="react" />
-import type { BoxProps } from '@mui/material';
-export default function UserCenter({ children, notLoginContent, currentTab, contentProps, disableAutoRedirect, autoPopupSetting, hideFooter, headerProps, footerProps, userDid, stickySidebar, }: {
-    readonly children: any;
-    readonly notLoginContent: any;
-    readonly currentTab: string;
-    readonly contentProps?: BoxProps;
-    readonly disableAutoRedirect?: boolean;
-    readonly autoPopupSetting?: boolean;
-    readonly hideFooter?: boolean;
-    readonly headerProps?: any;
-    readonly footerProps?: any;
-    readonly userDid?: string;
-    readonly stickySidebar?: boolean;
-}): import("react").JSX.Element | null;