@blocklet/launcher-layout 2.3.19 → 2.3.21

package/es/nav.js

@@ -1,405 +0,0 @@
-import styled from '@emotion/styled';
-import Check from '@mui/icons-material/Check';
-import Skeleton from '@mui/material/Skeleton';
-import PropTypes from 'prop-types';
-import { useStepContext } from './context/step';
-import AppHeader from './header';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function Nav({
-  blockletMeta,
-  logoUrl,
-  locale,
-  useOfSkeleton,
-  subTitle,
-  loading
-}) {
-  const {
-    steps,
-    activeStep,
-    setActiveStepByKey,
-    setActiveStepByIndex,
-    getStepStatus,
-    canBackToStep
-  } = useStepContext();
-  const showSkeleton = useOfSkeleton ? loading : false;
-  const getNodeClassName = (step, index) => {
-    const classNameList = ['step-block'];
-    const status = getStepStatus(step.key);
-    switch (status) {
-      case 'current':
-        classNameList.push('step-active');
-        break;
-      case 'before':
-        classNameList.push('step-checked');
-        break;
-      case 'after':
-      default:
-    }
-    switch (step.showChild) {
-      case 'activated':
-        if (status === 'after') {
-          classNameList.push('hide-step-child');
-        }
-        break;
-      case 'activating':
-        if (status === 'after' || status === 'before') {
-          classNameList.push('hide-step-child');
-        }
-        break;
-      case 'always':
-        classNameList.push('always-step-child');
-        break;
-      default:
-    }
-    if (step.optional === true && activeStep < index) {
-      classNameList.push('step-optional'); // optional在没有匹配到路由情况下会隐藏；超越这个步骤后就会一直出现
-    }
-    return classNameList.join(' ');
-  };
-  return /*#__PURE__*/_jsxs(Div, {
-    children: [/*#__PURE__*/_jsx(AppHeader, {
-      blockletMeta: blockletMeta,
-      loading: loading,
-      logoUrl: logoUrl,
-      locale: locale,
-      subTitle: subTitle
-    }), /*#__PURE__*/_jsx(StepContainer, {
-      className: `${showSkeleton ? 'hide-child-step-desc' : ''}`,
-      children: steps.map((step, index) => {
-        const canBack = !showSkeleton && canBackToStep(index);
-        return /*#__PURE__*/_jsxs("div", {
-          className: getNodeClassName(step, index),
-          children: [/*#__PURE__*/_jsx("div", {
-            className: "step-icon",
-            children: /*#__PURE__*/_jsx(Check, {
-              style: {
-                fontSize: 16
-              }
-            })
-          }), /*#__PURE__*/_jsx("div", {
-            className: "step-line"
-          }), /*#__PURE__*/_jsxs("div", {
-            className: "step-content",
-            title: step.name,
-            children: [/*#__PURE__*/_jsx("span", {
-              className: `step-content-name ${canBack ? ' step-clickable' : ''}`,
-              onClick: () => {
-                if (canBack) {
-                  if (step.key) {
-                    setActiveStepByKey(step.key);
-                    return;
-                  }
-                  setActiveStepByIndex(index);
-                }
-              },
-              children: showSkeleton ? /*#__PURE__*/_jsx(Skeleton, {
-                variant: "text",
-                width: 100
-              }) : step.name
-            }), step.description && /*#__PURE__*/_jsx("div", {
-              className: "step-desc",
-              children: step.description
-            }), step.children && step.children.length && /*#__PURE__*/_jsx("div", {
-              className: "step-children",
-              children: step.children.map(e => {
-                let className = '';
-                const childStepStatus = getStepStatus(e.key);
-                switch (childStepStatus) {
-                  case 'before':
-                    className = 'step-child-block-checked';
-                    break;
-                  case 'current':
-                    className = 'step-child-block-active';
-                    break;
-                  case 'after':
-                  default:
-                }
-                return /*#__PURE__*/_jsx("div", {
-                  className: `step-child-block ${className}`,
-                  children: e.name
-                }, e.key);
-              })
-            })]
-          })]
-        }, step.key);
-      })
-    })]
-  });
-}
-const Div = styled.div`
-  overflow-y: auto;
-  ${props => props.theme.breakpoints.up('md')} {
-    padding: 24px;
-    border-right: 1px solid ${props => props.theme.palette.grey[100]};
-    flex: 0 0 280px;
-    min-height: 48px;
-
-    .MuiStepConnector-vertical {
-      padding: 0;
-    }
-  }
-
-  ${props => props.theme.breakpoints.down('md')} {
-    padding: 16px;
-
-    .MuiStepConnector-lineVertical {
-      border: none;
-    }
-  }
-
-  .stepper {
-    padding: 0 !important;
-    background: transparent;
-
-    ${props => props.theme.breakpoints.up('sm')} {
-      margin-top: 100px;
-    }
-
-    ${props => props.theme.breakpoints.down('md')} {
-      margin-top: 40px;
-    }
-
-    .step {
-      cursor: pointer;
-    }
-  }
-
-  .always-step-child {
-    .step-child-block {
-      animation: none !important;
-    }
-  }
-`;
-const StepContainer = styled.div`
-  display: flex;
-  flex-direction: column;
-  margin-top: 60px;
-
-  @media (max-height: 900px) {
-    margin-top: 32px;
-  }
-
-  ${props => props.theme.breakpoints.down('md')} {
-    margin-top: 30px;
-  }
-  .step-clickable {
-    cursor: pointer;
-    &:hover {
-      color: ${props => props.theme.palette.primary.main};
-    }
-  }
-  .step-line {
-    display: block;
-    position: absolute;
-    z-index: 1;
-    left: 11px;
-    top: 12px;
-    width: 2px;
-    height: 100%;
-    opacity: 0.5;
-    background-color: ${props => props.theme.palette.grey[400]};
-    transition: all ease 0.2s;
-  }
-  .step-icon {
-    position: relative;
-    z-index: 2;
-    display: flex;
-    flex-shrink: 0;
-    justify-content: center;
-    align-items: center;
-    width: 24px;
-    height: 24px;
-    border-radius: 13px;
-    background-color: ${props => props.theme.palette.grey[400]};
-    color: ${props => props.theme.palette.common.white};
-    transition: all ease 0.3s;
-    &:before {
-      position: absolute;
-      left: 4px;
-      top: 4px;
-      z-index: 3;
-      display: block;
-      background-color: ${props => props.theme.palette.common.white};
-      width: 16px;
-      height: 16px;
-      border-radius: 10px;
-      content: '';
-      transform: scale(0);
-      transition: all ease 0.3s;
-    }
-    & > * {
-      transform: scale(0);
-      transition: all ease 0.2s;
-    }
-  }
-  .step-content {
-    position: relative;
-    flex: 1;
-    padding-top: 1px;
-    margin-left: 22px;
-    font-size: 16px;
-    color: ${props => props.theme.palette.grey[700]};
-    white-space: nowrap;
-  }
-  .step-desc {
-    margin-top: 24px;
-    font-size: 12px;
-    font-weight: 500;
-    height: 17px;
-    color: ${props => props.theme.palette.grey[700]};
-    transition: all ease 0.3s;
-    overflow: hidden;
-  }
-  ${props => props.theme.breakpoints.up('md')} {
-    .step-content-name {
-      position: absolute;
-      left: 0;
-      top: 0;
-      width: 100%;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-  }
-  &.hide-child-step-desc {
-    .step-desc {
-      margin: 0;
-      opacity: 0;
-      height: 0;
-    }
-  }
-  .step-block {
-    position: relative;
-    display: flex;
-    min-height: 70px;
-    opacity: 0.5;
-    overflow: hidden;
-    transition: all ease 0.2s;
-    &:last-child {
-      height: auto;
-      min-height: auto;
-    }
-    &.step-optional {
-      height: 0;
-      opacity: 0;
-      min-height: 0px;
-    }
-
-    &.step-checked,
-    &.step-active {
-      .step-desc {
-        margin: 0;
-        opacity: 0;
-        height: 0;
-      }
-    }
-
-    &.step-checked {
-      opacity: 1;
-      .step-icon {
-        color: ${props => props.theme.palette.common.white};
-        background-color: ${props => props.theme.palette.primary.main};
-        & > * {
-          transform: scale(1);
-        }
-      }
-
-      .step-line {
-        background-color: ${props => props.theme.palette.primary.main};
-        opacity: 1;
-      }
-    }
-
-    &.step-active {
-      opacity: 1;
-      .step-icon {
-        background-color: ${props => props.theme.palette.primary.main};
-      }
-      .step-icon:before {
-        transform: scale(1);
-      }
-      .step-content {
-        color: ${props => props.theme.palette.primary.main};
-      }
-    }
-
-    &:last-child {
-      .step-line {
-        display: none;
-      }
-
-      .step-child-block {
-        &:last-child {
-          padding-bottom: 0;
-        }
-      }
-    }
-
-    &.hide-step-child {
-      .step-children {
-        .step-child-block {
-          margin-top: 0;
-          height: 0;
-          opacity: 0;
-          &:last-child {
-            padding-bottom: 0;
-          }
-        }
-      }
-    }
-  }
-  .step-children {
-    padding-top: 20px;
-    .step-child-block {
-      margin-top: 4px;
-      height: 24px;
-      line-height: 24px;
-      font-size: 14px;
-      color: #9397a1;
-      transition: all ease 0.3s;
-      &:first-of-type {
-        margin-top: 8px;
-      }
-      &:last-child {
-        padding-bottom: 40px;
-      }
-      &.step-child-block-active {
-        color: ${props => props.theme.palette.common.black};
-        font-weight: 700;
-      }
-      &.step-child-block-checked {
-        color: ${props => props.theme.palette.common.black};
-      }
-    }
-  }
-
-  .step-active {
-    .step-child-block {
-      animation: stepChildAnime ease 0.3s;
-    }
-  }
-
-  @keyframes stepChildAnime {
-    0% {
-      height: 0;
-    }
-    100% {
-      height: 24px;
-    }
-  }
-`;
-Nav.propTypes = {
-  blockletMeta: PropTypes.object.isRequired,
-  logoUrl: PropTypes.string,
-  locale: PropTypes.string,
-  useOfSkeleton: PropTypes.bool,
-  subTitle: PropTypes.string,
-  loading: PropTypes.bool
-};
-Nav.defaultProps = {
-  logoUrl: '',
-  locale: '',
-  useOfSkeleton: false,
-  subTitle: '',
-  loading: false
-};
-export default Nav;

package/es/page-header.js

@@ -1,66 +0,0 @@
-import styled from '@emotion/styled';
-import PropTypes from 'prop-types';
-import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function PageHeader({
-  title,
-  subTitle,
-  onClickBack,
-  ...rest
-}) {
-  return /*#__PURE__*/_jsxs(Content, {
-    ...rest,
-    children: [onClickBack && /*#__PURE__*/_jsx(ArrowBackIosIcon, {
-      className: "back-btn",
-      onClick: onClickBack
-    }), /*#__PURE__*/_jsx("div", {
-      className: "title",
-      children: title
-    }), /*#__PURE__*/_jsx("div", {
-      className: "sub-title",
-      children: subTitle
-    })]
-  });
-}
-const Content = styled.div`
-  position: relative;
-  width: 100%;
-  text-align: center;
-
-  .title {
-    font-size: 24px;
-    font-weight: 700;
-    color: ${props => props.theme.palette.common.black};
-
-    ${props => props.theme.breakpoints.down('md')} {
-      font-size: 20px;
-    }
-  }
-
-  .sub-title {
-    font-size: 14px;
-    color: ${props => props.theme.palette.grey[600]};
-    padding: 0 14px;
-    font-weight: 400;
-  }
-
-  .back-btn {
-    position: absolute;
-    left: 0;
-    top: 8px;
-    color: #9397a1;
-    font-size: 18px;
-    cursor: pointer;
-  }
-`;
-export default PageHeader;
-PageHeader.propTypes = {
-  title: PropTypes.string,
-  subTitle: PropTypes.string,
-  onClickBack: PropTypes.oneOfType([PropTypes.func, PropTypes.string])
-};
-PageHeader.defaultProps = {
-  title: '',
-  subTitle: '',
-  onClickBack: ''
-};

package/es/theme-provider.js

@@ -1,41 +0,0 @@
-import { createContext, useEffect, useState, useContext } from 'react';
-import PropTypes from 'prop-types';
-import { ThemeProvider as EmotionThemeProvider } from '@emotion/react';
-import { ThemeProvider as UxThemeProvider, create } from '@arcblock/ux/lib/Theme';
-import { jsx as _jsx } from "react/jsx-runtime";
-const defaultTheme = create({});
-const ThemeContext = /*#__PURE__*/createContext({});
-export default function ThemeProvider({
-  children,
-  theme: _theme
-} = {}) {
-  const [theme, setTheme] = useState(defaultTheme);
-  useEffect(() => {
-    if (_theme && typeof _theme === 'object') setTheme(_theme);
-  }, [_theme]);
-  if (theme) {
-    return /*#__PURE__*/_jsx(ThemeContext.Provider, {
-      value: theme,
-      children: /*#__PURE__*/_jsx(ThemeContext.Consumer, {
-        children: themeValue => {
-          return /*#__PURE__*/_jsx(UxThemeProvider, {
-            theme: themeValue,
-            children: /*#__PURE__*/_jsx(EmotionThemeProvider, {
-              theme: themeValue,
-              children: children
-            })
-          });
-        }
-      })
-    });
-  }
-  return children;
-}
-ThemeProvider.propTypes = {
-  children: PropTypes.any.isRequired,
-  theme: PropTypes.object.isRequired
-};
-function useThemeContext() {
-  return useContext(ThemeContext);
-}
-export { ThemeProvider, useThemeContext };

package/es/wizard/server-eula.js

@@ -1,96 +0,0 @@
-/* eslint-disable react/jsx-wrap-multilines */
-import { useState } from 'react';
-import styled from '@emotion/styled';
-import PropTypes from 'prop-types';
-import Spinner from '@mui/material/CircularProgress';
-import Button from '@arcblock/ux/lib/Button';
-import Dialog from '@arcblock/ux/lib/Dialog';
-import SubmitHotKey from '@blocklet/launcher-ux/lib/hot-key/submit';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-function ServerEula({
-  onContinue,
-  nextDisabled,
-  launching,
-  texts,
-  description
-}) {
-  const [open, setOpen] = useState(false);
-  const handleOpen = () => setOpen(x => !x);
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Div, {
-      children: /*#__PURE__*/_jsxs(SubmitHotKey, {
-        disabled: nextDisabled,
-        onConfirm: onContinue,
-        children: [/*#__PURE__*/_jsx("div", {
-          className: "eula-trigger",
-          onClick: handleOpen,
-          children: texts.listenName
-        }), /*#__PURE__*/_jsx(Button, {
-          disabled: nextDisabled,
-          color: "primary",
-          variant: "contained",
-          className: "next-button",
-          onClick: onContinue,
-          children: launching ? /*#__PURE__*/_jsxs(_Fragment, {
-            children: [/*#__PURE__*/_jsx(Spinner, {
-              size: 14
-            }), texts.launchingText]
-          }) : texts.buttonNext
-        })]
-      })
-    }), /*#__PURE__*/_jsx(Dialog, {
-      open: open,
-      title: texts.listenName,
-      onClose: () => setOpen(false),
-      children: description
-    })]
-  });
-}
-ServerEula.propTypes = {
-  onContinue: PropTypes.func.isRequired,
-  nextDisabled: PropTypes.bool,
-  launching: PropTypes.bool,
-  description: PropTypes.any,
-  texts: PropTypes.object
-};
-ServerEula.defaultProps = {
-  nextDisabled: false,
-  launching: false,
-  description: '',
-  texts: {
-    listenName: '',
-    launchingText: '',
-    buttonNext: ''
-  }
-};
-const Div = styled.div`
-  margin: 0 auto;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-
-  @media (max-width: ${props => props.theme.breakpoints.values.sm}px) {
-    flex-direction: column;
-  }
-
-  .eula-trigger {
-    cursor: pointer;
-    text-decoration: underline;
-    ${props => props.theme.breakpoints.up('md')} {
-      padding-right: 24px;
-    }
-    ${props => props.theme.breakpoints.down('md')} {
-      padding: 16px;
-    }
-    font-size: 14px;
-    white-space: nowrap;
-    &:hover {
-      color: ${props => props.theme.palette.primary.main};
-    }
-  }
-
-  .next-button {
-    min-width: 200px;
-  }
-`;
-export default ServerEula;