@arcblock/ux 2.9.90 → 2.10.0

package/es/Theme/theme-provider.js

@@ -1,39 +0,0 @@
-import PropTypes from 'prop-types';
-import { ThemeProvider as MuiThemeProvider } from '@mui/material/styles';
-import StyledEngineProvider from '@mui/material/StyledEngineProvider';
-import CssBaseline from '@mui/material/CssBaseline';
-import { createTheme } from './theme';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const defaultTheme = createTheme();
-
-/**
- * 默认的 theme provider, 可以为 webapp/blocklet 快捷的配置好 mui theme provider
- */
-export default function ThemeProvider({
-  children,
-  theme,
-  injectFirst
-}) {
-  return (
-    /*#__PURE__*/
-    // injectFirst 会影响 makeStyles 自定义样式和 mui styles 覆盖问题
-    _jsx(StyledEngineProvider, {
-      injectFirst: injectFirst,
-      children: /*#__PURE__*/_jsxs(MuiThemeProvider, {
-        theme: theme,
-        children: [/*#__PURE__*/_jsx(CssBaseline, {}), children]
-      })
-    })
-  );
-}
-ThemeProvider.propTypes = {
-  children: PropTypes.any,
-  theme: PropTypes.any,
-  injectFirst: PropTypes.bool
-};
-ThemeProvider.defaultProps = {
-  children: null,
-  theme: defaultTheme,
-  injectFirst: true
-};

package/es/Theme/theme.js

@@ -1,145 +0,0 @@
-// https://app.zeplin.io/styleguide/5d1436f1e97c2156f49c0725/colors
-import { createTheme as _createTheme, responsiveFontSizes } from '@mui/material/styles';
-// 为了避免加载全量的字体导致打包后体积太大，目前只选择了 latin 语系的字体
-import '@fontsource/inter/latin-300.css';
-import '@fontsource/inter/latin-400.css';
-import '@fontsource/inter/latin-500.css';
-import '@fontsource/inter/latin-700.css';
-import '@fontsource/inter/latin-ext-300.css';
-import '@fontsource/inter/latin-ext-400.css';
-import '@fontsource/inter/latin-ext-500.css';
-import '@fontsource/inter/latin-ext-700.css';
-import colors from '../Colors';
-const muiDarkTheme = _createTheme({
-  palette: {
-    mode: 'dark'
-  }
-});
-
-// https://material-ui.com/customization/default-theme/
-// eslint-disable-next-line import/prefer-default-export
-export const create = ({
-  mode = 'light',
-  pageWidth = 'md',
-  palette,
-  typography,
-  overrides,
-  ...rest
-} = {}) => {
-  // palette 考虑 light & dark mode, dark mode 需要持续完善
-  // - 能配合 ColorModeContext 使用
-  // - 为 dark mode 系统的设计整个 palette, 不要单个 color 设置
-  const _palette = mode === 'light' ? Object.assign({
-    ...colors,
-    background: {
-      paper: colors.common.white,
-      default: colors.background.default
-    },
-    mode
-  }, palette || {}) : Object.assign({
-    ...muiDarkTheme.palette,
-    background: {
-      paper: colors.grey[900],
-      default: colors.grey[900]
-    },
-    mode
-  }, palette || {});
-  const theme = _createTheme({
-    themeName: 'ArcBlock',
-    palette: _palette,
-    typography: Object.assign({
-      useNextVariants: true,
-      color: {
-        // 此处 #222222 必须硬编码, layout/sidebar.js -> Icon/image 加载图片时 color 会影响加载路径
-        // TODO: 此处硬编码的色值后面需要改为 colors.grey[900],
-        //       或者如果可以的话直接删掉 typography#color, 文本颜色建议使用 theme.palette.text 中的色值?
-        //       layout 组件建议重构, sidebar 中建议使用 icon 替换 img (#366)
-        main: mode === 'light' ? '#222222' : colors.common.white,
-        gray: mode === 'light' ? colors.grey[500] : colors.grey[300]
-      },
-      fontFamily: ['Inter', 'Avenir', '-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Roboto', '"Helvetica Neue"', 'Arial', 'sans-serif', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"'].join(','),
-      // button 默认使用粗体
-      button: {
-        fontWeight: 700
-      }
-    }, typography || {}),
-    components: {
-      MuiButton: {
-        styleOverrides: {
-          root: {
-            boxShadow: 'none'
-          }
-        }
-      },
-      MuiButtonGroup: {
-        styleOverrides: {
-          root: {
-            boxShadow: 'none'
-          }
-        }
-      },
-      MuiTableCell: {
-        styleOverrides: {
-          root: ({
-            ownerState
-          }) => ({
-            ...(ownerState.size === 'small' ? {
-              borderBottomWidth: '0',
-              paddingTop: '8px',
-              paddingBottom: '8px',
-              paddingLeft: 0,
-              paddingRight: '20px'
-            } : {
-              borderBottomWidth: '0',
-              paddingTop: '14px',
-              paddingBottom: '14px',
-              paddingLeft: 0,
-              paddingRight: '30px'
-            })
-          }),
-          head: {
-            textTransform: 'uppercase',
-            color: mode === 'light' ? colors.grey[900] : colors.grey[300]
-          },
-          body: {
-            color: mode === 'light' ? colors.grey[900] : colors.grey[300]
-          }
-        }
-      },
-      ...overrides
-    },
-    pageWidth,
-    // TODO: 过时的 colors, 需要各项目负责人检查项目中是否使用 "theme.colors", 如果有需要清除,
-    //       可以从 Colors 模块/theme.palette/mui colors 中取值
-    colors: {
-      white: '#FFFFFF',
-      dark: '#4A707C',
-      gray: '#222222',
-      minor: '#9B9B9B',
-      darkText: '#DCDCDC',
-      background: '#F7F8F8',
-      yellow: '#FFCF71',
-      green: '#44cdc6',
-      red: '#D0021B',
-      blue: '#4E6AF6',
-      primary: '#222222',
-      black: '#222222',
-      secondary: '#44cdc6',
-      mint: '#44cdc6',
-      textSecondary: '#4A4A4A',
-      active: '#5b9025',
-      danger: '#D0021B',
-      lightGrey: '#BCBCBC'
-    },
-    mode,
-    ...rest
-  });
-  const enhanced = responsiveFontSizes(theme, {
-    breakpoints: ['xs', 'sm', 'md', 'lg'],
-    disableAlign: false,
-    factor: 3,
-    variants: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle1', 'subtitle2', 'body1', 'body2', 'caption', 'button', 'overline']
-  });
-  return enhanced;
-};
-export const createTheme = create;

package/es/Toast/index.js

@@ -1,97 +0,0 @@
-import { createRef } from 'react';
-import { SnackbarProvider, useSnackbar } from 'notistack';
-import IconButton from '@mui/material/IconButton';
-import CloseIcon from '@mui/icons-material/Close';
-import noop from 'lodash/noop';
-
-/**
- *
- * @typedef {(message: import('notistack').SnackbarMessage, options?: import('notistack').OptionsObject, ...args: any[]) => import('notistack').SnackbarKey} EnqueueSnackbarFunc
- *
- */
-
-/**
- * @type {import('notistack').ProviderContext['enqueueSnackbar']}
- */
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-let success = noop;
-let error = noop;
-let warning = noop;
-let info = noop;
-/**
- * @description
- * @param {(message: import('notistack').SnackbarMessage, options?: import('notistack').OptionsObject) => import('notistack').SnackbarKey} enqueueSnackbar
- * @param {import('notistack').ProviderContext['enqueueSnackbar']} enqueueSnackbar
- * @param {import('notistack').VariantType} variant
- * @returns {import('notistack').ProviderContext['enqueueSnackbar']}
- */
-const genFn = (enqueueSnackbar, variant) => (message, opts = {}) => {
-  enqueueSnackbar(message, {
-    autoHideDuration: 5000,
-    variant,
-    ...opts
-  });
-};
-
-// eslint-disable-next-line react/prop-types
-function ToastProvider({
-  children
-}) {
-  const notistackRef = /*#__PURE__*/createRef();
-  const onClickDismiss = key => () => {
-    notistackRef.current.closeSnackbar(key);
-  };
-  return /*#__PURE__*/_jsxs(SnackbarProvider, {
-    anchorOrigin: {
-      vertical: 'top',
-      horizontal: 'right'
-    },
-    ref: notistackRef
-    // eslint-disable-next-line react/no-unstable-nested-components
-    ,
-    action: key => /*#__PURE__*/_jsx(IconButton, {
-      "aria-label": "close",
-      color: "inherit",
-      onClick: onClickDismiss(key),
-      size: "large",
-      children: /*#__PURE__*/_jsx(CloseIcon, {
-        style: {
-          fontSize: 16
-        }
-      })
-    }, "close"),
-    children: [/*#__PURE__*/_jsx(Toast, {}), children]
-  });
-}
-function Toast() {
-  const {
-    enqueueSnackbar
-  } = useSnackbar();
-  success = genFn(enqueueSnackbar, 'success');
-  error = genFn(enqueueSnackbar, 'error');
-  warning = genFn(enqueueSnackbar, 'warning');
-  info = genFn(enqueueSnackbar, 'info');
-  return null;
-}
-export { ToastProvider };
-export default {
-  /**
-   * @type {EnqueueSnackbarFunc}
-   */
-  success: (message, options = {}, ...args) => success(message, options, ...args),
-  /**
-   * @type {EnqueueSnackbarFunc}
-   */
-  error: (message, options = {
-    autoHideDuration: 15000
-  }, ...args) => error(message, options, ...args),
-  /**
-   * @type {EnqueueSnackbarFunc}
-   */
-  warning: (message, options = {}, ...args) => warning(message, options, ...args),
-  /**
-   * @type {EnqueueSnackbarFunc}
-   */
-  info: (message, options = {}, ...args) => info(message, options, ...args)
-};

package/es/Typography/index.js

@@ -1,95 +0,0 @@
-import PropTyps from 'prop-types';
-import { Box, Typography as MuiTypography, Skeleton } from '@mui/material';
-import { useCreation, useReactive, useSize } from 'ahooks';
-import { useEffect, useRef } from 'react';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function Typography({
-  minFontSize,
-  fontSize,
-  children,
-  sx,
-  ...rest
-}) {
-  const refMock = useRef(null);
-  const refContainer = useRef(null);
-  const state = useReactive({
-    fontSize,
-    loading: true,
-    initialSize: undefined
-  });
-  const mockSize = useSize(refMock.current);
-  const containerSize = useSize(refContainer.current);
-  useEffect(() => {
-    if (state.loading) {
-      if (fontSize === 'auto') {
-        if (mockSize && !state.initialSize) {
-          const styleSize = getComputedStyle(refMock.current).fontSize;
-          state.initialSize = Number(styleSize.replace('px', ''));
-          state.fontSize = state.initialSize;
-        }
-        if (containerSize && mockSize) {
-          if (containerSize.width < mockSize.width && state.fontSize > minFontSize) {
-            state.fontSize--;
-          } else {
-            state.loading = false;
-          }
-        }
-      } else {
-        state.loading = false;
-      }
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [fontSize, mockSize?.width, containerSize?.width]);
-  const loading = useCreation(() => {
-    if (fontSize === 'auto') {
-      return state.loading;
-    }
-    return false;
-  }, [fontSize, state.loading]);
-  return loading ? /*#__PURE__*/_jsxs(Box, {
-    ref: refContainer,
-    flex: 1,
-    children: [/*#__PURE__*/_jsx(MuiTypography, {
-      ...rest,
-      sx: sx,
-      noWrap: true,
-      children: /*#__PURE__*/_jsx(Skeleton, {
-        variant: "text",
-        sx: {
-          fontSize: '1rem'
-        }
-      })
-    }), /*#__PURE__*/_jsx(MuiTypography, {
-      ref: refMock,
-      ...rest,
-      sx: {
-        ...sx,
-        fontSize: `${state.fontSize}px !important`,
-        position: 'fixed',
-        top: -1000,
-        left: -1000
-      },
-      noWrap: true,
-      children: children
-    })]
-  }) : /*#__PURE__*/_jsx(MuiTypography, {
-    ...rest,
-    sx: {
-      ...sx,
-      fontSize: `${state.fontSize}px !important`
-    },
-    children: children
-  });
-}
-Typography.propTypes = {
-  fontSize: PropTyps.oneOfType([PropTyps.string, PropTyps.number]),
-  children: PropTyps.any.isRequired,
-  minFontSize: PropTyps.number,
-  sx: PropTyps.object
-};
-Typography.defaultProps = {
-  fontSize: undefined,
-  minFontSize: 12,
-  sx: {}
-};

package/es/Util/constant.js

@@ -1,42 +0,0 @@
-export const DEFAULT_TIMEOUT = 5 * 60;
-export const DEFAULT_WINDOW_TIMEOUT = 30 * 60;
-export const WELLKNOWN_SERVICE_PATH_PREFIX = '/.well-known/service';
-export const AUTH_SERVICE_PREFIX = '/.well-known/service';
-export const SESSION_TOKEN_STORAGE_KEY = 'login_token';
-export const REFRESH_TOKEN_STORAGE_KEY = 'refresh_token';
-export const RELAY_SOCKET_PREFIX = '/.well-known/service';
-export const API_DID_PREFIX = '/api/did';
-export const DASHBOARD_URL = `${AUTH_SERVICE_PREFIX}/admin`;
-export const PROFILE_URL = `${AUTH_SERVICE_PREFIX}/user`;
-export const NAVIGATION_URL = `${AUTH_SERVICE_PREFIX}/admin/navigation`;
-export const DID_PREFIX = 'did:abt:';
-export const PASSPORT_STATUS = {
-  VALID: 'valid',
-  REVOKED: 'revoked'
-};
-export const LOGIN_PROVIDER = {
-  // EMAIL: 'Email',
-  AUTH0: 'auth0',
-  APPLE: 'apple',
-  GITHUB: 'github',
-  GOOGLE: 'google',
-  WALLET: 'wallet',
-  NFT: 'nft'
-};
-export const LOGIN_PROVIDER_NAME = {
-  // [LOGIN_PROVIDER.EMAIL]: 'Email',
-  [LOGIN_PROVIDER.AUTH0]: 'Email',
-  [LOGIN_PROVIDER.APPLE]: 'Apple',
-  [LOGIN_PROVIDER.GITHUB]: 'Github',
-  [LOGIN_PROVIDER.GOOGLE]: 'Google',
-  [LOGIN_PROVIDER.WALLET]: 'DID Wallet',
-  [LOGIN_PROVIDER.NFT]: 'NFT'
-};
-
-// HACK: 目前这里的键值不能使用 [LOGIN_PROVIDER.AUTH0] 形式，否则会影响 ts 的 keyof typeof OAUTH_PROVIDER 来获取键值作为类型的判断
-export const OAUTH_PROVIDER = {
-  auth0: 'Email',
-  apple: 'Apple',
-  github: 'Github',
-  google: 'Google'
-};

package/es/Util/deprecate.js

@@ -1,28 +0,0 @@
-import { useEffect } from 'react';
-import { jsx as _jsx } from "react/jsx-runtime";
-const warn = (name, alternative) => {
-  if (process.env.NODE_ENV === 'production') {
-    return;
-  }
-  if (typeof console?.warn === 'function') {
-    if (alternative) {
-      console.warn(`DEPRECATED: ${name} is deprecated, use ${alternative} instead.`);
-    } else {
-      console.warn(`DEPRECATED: ${name} is deprecated.`);
-    }
-  }
-};
-const withDeprecated = (Component, {
-  name,
-  alternative
-}) => {
-  return function Deprecated(props) {
-    useEffect(() => {
-      warn(name, alternative);
-    }, []);
-    return /*#__PURE__*/_jsx(Component, {
-      ...props
-    });
-  };
-};
-export { warn, withDeprecated };

package/es/Util/federated.js

@@ -1,91 +0,0 @@
-import isEmpty from 'lodash/isEmpty';
-export function getMaster(blocklet = window.blocklet) {
-  const federated = blocklet?.settings?.federated || {};
-  return federated.master;
-}
-export function getConfig(blocklet = window.blocklet) {
-  const federated = blocklet?.settings?.federated || {};
-  return federated.config;
-}
-export function getFederatedEnabled(blocklet = window.blocklet) {
-  const config = getConfig(blocklet);
-  return config?.status === 'approved';
-}
-export function getSourceAppPid(blocklet = window.blocklet) {
-  const master = getMaster(blocklet);
-  return master?.appPid;
-}
-export function getFederatedApp(blocklet = window.blocklet) {
-  const master = getMaster(blocklet);
-  const isFederatedMode = !isEmpty(master);
-  return isFederatedMode ? {
-    appId: master.appId,
-    appName: master.appName,
-    appDescription: master.appDescription,
-    appLogo: master.appLogo,
-    appPid: master.appPid,
-    appUrl: master.appUrl,
-    version: master.version,
-    sourceAppPid: master.appPid,
-    provider: 'wallet'
-  } : null;
-}
-export function getCurrentApp(blocklet = window.blocklet) {
-  // 适用于 blocklet 项目
-  if (blocklet) {
-    return {
-      appId: blocklet.appId,
-      appName: blocklet.appName,
-      appDescription: blocklet.appDescription,
-      appLogo: blocklet.appLogo,
-      appPid: blocklet.appPid,
-      appUrl: blocklet.appUrl,
-      version: blocklet.version,
-      // NOTICE: null 代表该值置空
-      sourceAppPid: null,
-      provider: 'wallet'
-    };
-  }
-  // HACK: 适用于 blockelt-server
-  if (window.env) {
-    // eslint-disable-next-line no-param-reassign
-    blocklet = window.env;
-    return {
-      appId: blocklet.appId,
-      appName: blocklet.appName,
-      appDescription: blocklet.appDescription,
-      appUrl: blocklet.baseUrl,
-      // NOTICE: null 代表该值置空
-      sourceAppPid: null,
-      provider: 'wallet',
-      type: 'server'
-    };
-  }
-  return null;
-}
-export function getApps(blocklet) {
-  const appList = [];
-  const masterApp = getFederatedApp(blocklet);
-  const currentApp = getCurrentApp(blocklet);
-  const federatedEnabled = getFederatedEnabled(blocklet);
-  if (currentApp) {
-    appList.push(currentApp);
-  }
-  if (masterApp && masterApp?.appId !== currentApp?.appId && federatedEnabled) {
-    appList.push(masterApp);
-  }
-  // NOTICE: masterApp 应该排在前面
-  return appList.reverse();
-}
-export async function getBlockletData(appUrl) {
-  try {
-    const url = new URL('__blocklet__.js', appUrl);
-    url.searchParams.set('type', 'json');
-    const res = await fetch(url.href);
-    const jsonData = await res.json();
-    return jsonData;
-  } catch (err) {
-    console.error(`Failed to get blocklet data: ${appUrl}`, err);
-    return null;
-  }
-}