@king-design/intact 3.3.1 → 3.3.3

package/es/site/src/pages/layout.js

@@ -0,0 +1,79 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import { __decorate } from "tslib";
+import template from './layout.vdt';
+import { Component } from 'intact';
+import { setTheme, bind, Dialog, useConfigContext } from 'kpc';
+var colorList = ['#0191EA', '#FF7F22', '#2238FF'];
+var themeColor = colorList[0];
+Dialog.setHooks({
+  onStart: function onStart(scrollBarWidth) {
+    if (scrollBarWidth) {
+      var header = document.querySelector('.k-layout-header');
+      if (header) {
+        header.style.paddingRight = scrollBarWidth + "px";
+      }
+    }
+  },
+  onEnd: function onEnd() {
+    var header = document.querySelector('.k-layout-header');
+    if (header) {
+      header.style.paddingRight = '0';
+    }
+  }
+});
+var Layout = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(Layout, _Component);
+  function Layout() {
+    var _context;
+    var _this;
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _Component.call.apply(_Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.config = useConfigContext();
+    return _this;
+  }
+  var _proto = Layout.prototype;
+  _proto.handleColorChange = function handleColorChange(color) {
+    if (this.get('themeColor') !== color) {
+      this.set('themeColor', color);
+      themeColor = color;
+      this.set('showThemeColor', false);
+      setTheme({
+        color: {
+          primary: color
+        }
+      });
+      this.forceUpdate();
+    }
+  };
+  _proto.showColorList = function showColorList() {
+    this.set('showThemeColor', true);
+  };
+  _proto.hideColorList = function hideColorList() {
+    this.set('showThemeColor', false);
+  };
+  _proto.setLang = function setLang(langType) {
+    this.set('curLang', langType);
+  };
+  _proto.onChangeVersion = function onChangeVersion(version) {
+    location.href = "/" + version + "/";
+  };
+  return Layout;
+}(Component);
+Layout.template = template;
+Layout.defaults = function () {
+  return {
+    version: 'v1.1.1',
+    themeColor: themeColor,
+    colorList: colorList,
+    showThemeColor: false,
+    curLang: 'cn',
+    videoLevel: 0
+  };
+};
+export { Layout as default };
+__decorate([bind], Layout.prototype, "showColorList", null);
+__decorate([bind], Layout.prototype, "hideColorList", null);
+__decorate([bind], Layout.prototype, "onChangeVersion", null);

package/es/site/src/pages/resource/index.d.ts

@@ -0,0 +1,18 @@
+import Layout from '../layout';
+export declare const getAxure: () => void;
+export declare const getSketch: () => void;
+export declare const getFigma: () => void;
+export declare const getDesign: () => void;
+export declare const getWeights: () => void;
+export default class Index extends Layout {
+    static template: string | import("vdt").Template<any>;
+    static defaults(): {
+        version?: string | undefined;
+        themeColor?: string | undefined;
+        colorList?: string[] | undefined;
+        showThemeColor?: boolean | undefined;
+        curLang?: string | undefined;
+        videoLevel?: number | undefined;
+    };
+    goDoc(link: string): void;
+}

package/es/site/src/pages/resource/index.js

@@ -0,0 +1,37 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import template from './index.vdt';
+import Layout from '../layout';
+import { Link } from '../../components/link';
+export var getAxure = function getAxure() {
+  location.href = 'https://damife.ks3-cn-beijing.ksyuncs.com/kpc/KingDesign-Axure.zip';
+};
+export var getSketch = function getSketch() {
+  location.href = 'https://damife.ks3-cn-beijing.ksyuncs.com/kpc/KingDesign-Sketch.zip';
+};
+export var getFigma = function getFigma() {
+  window.open('https://www.figma.com/community/file/1121633180544246876');
+};
+export var getDesign = function getDesign() {
+  window.open('https://js.design/resourceDetails?id=62c6c0834835c771da15dfe0&source=ksd&plan=web');
+};
+export var getWeights = function getWeights() {
+  location.href = 'https://damife.ks3-cn-beijing.ksyuncs.com/kpc/度量工具.xlsx';
+};
+var Index = /*#__PURE__*/function (_Layout) {
+  _inheritsLoose(Index, _Layout);
+  function Index() {
+    return _Layout.apply(this, arguments) || this;
+  }
+  Index.defaults = function defaults() {
+    return _extends({}, Layout.defaults());
+  };
+  var _proto = Index.prototype;
+  _proto.goDoc = function goDoc(link) {
+    Link.to(link);
+  };
+  return Index;
+}(Layout);
+Index.template = template;
+export { Index as default };
+;

package/es/site/src/pages/resource/styles.d.ts

@@ -0,0 +1 @@
+export declare function makeStyles(): string;

package/es/site/src/pages/resource/styles.js

@@ -0,0 +1,10 @@
+import { css } from '@emotion/css';
+import global, { mainBlock, center } from '../../styles/default';
+import resource_bg from '../../imgs/resource_bg.jpg';
+import color_process_bg from '../../imgs/color_process_bg.png';
+import workflow_bg from '../../imgs/workflow_bg.png';
+import color_process_expect from '../../imgs/expect.png';
+import { theme } from 'kpc/styles/theme';
+export function makeStyles() {
+  return /*#__PURE__*/css("font-family:", global.fontFamily, ";.source-nav{", mainBlock(260), ";background-image:url(", resource_bg, ");background-repeat:no-repeat;background-position:right bottom;background-size:cover;padding-left:20px;.content{display:flex;align-items:center;.nav-title{color:#000000;&>div:first-child{font-size:44px;}&>div:last-child{font-size:16px;}}}}.source-content{", mainBlock(961), ";.content-top{height:429px;background:#EFF3FA;border-radius:8px;margin-top:32px;}.main-title{color:#000000;font-weight:600;font-size:24px;padding:26px 0px 0px 40px;}.secondary-title{padding-left:40px;color:#7A7A7A;font-size:16px;}.card-title{margin-bottom:24px;font-size:12px;color:#626262;}.card-content-box{height:141px;display:flex;&>div:not(:last-child){margin-right:27px;}}.card-item{width:168px;height:42px;background:#EFF3FA;border-radius:4px;display:flex;align-items:center;padding-left:9px;color:#434343;margin-bottom:12px;cursor:pointer;img{width:27px;height:27px;border-radius:4px;}&>div:last-child{padding-left:14px;}&:hover{background:#E5EAF4;}&:active{background:#DAE3EF;}.github-logo{width:27px;height:27px;border-radius:4px;", center(), ";background:#fff;margin-right:14px;}.code-resource{display:flex;align-items:center;color:#434343;&>div:last-child{padding-left:14px;}}.sketch-img-box{width:27px;height:27px;border-radius:4px;", center(), ";background:#fff;img{width:70%;height:70%;}}}.workflow-box{background-image:url(", workflow_bg, ");width:1132px;height:252px;margin:32px auto;margin-bottom:18px;background-repeat:no-repeat;display:flex;justify-content:space-around;align-items:center;padding-top:25px;}.line{height:4px;width:100%;background:linear-gradient(90deg, #0191EA 20.07%, #0142EA 84.76%);}.content-bottom{height:420px;margin-top:29px;display:flex;color:#7A7A7A;font-size:16px;.title{color:#000000;font-size:24px;}&>div{background:#EFF3FA;border-radius:8px;}.tool-box{flex-grow:1;margin-right:31px;padding:25px 39px 37px 41px;.tool-item{background:#DAE3EF;border-radius:8px;height:120px;margin-top:30px;display:flex;align-items:center;padding-left:40px;transition:box-shadow ", theme.transition.middle, ";}.tool-item:hover{box-shadow:", global.cardBoxShadow, ";}.process-box{background-image:url(", color_process_bg, ");background-size:contain;span{color:#626262;margin-left:10px;}}.expect-box{background-image:url(", color_process_expect, ");background-size:cover;}}.priciples{margin-top:15px;}.principle{width:505px;padding:28px 49px 29px 41px;.priciple-item{cursor:pointer;color:#000000;height:60px;display:flex;align-items:center;span{flex-grow:1;}.k-icon{color:#5A5A68;}}.priciple-item:not(:last-child){border-bottom:1px solid #B0BDC8;}.priciple-item,.priciple-item i{transition:color .25s linear;}.priciple-item:hover{color:#0191EA;i{color:#0191EA;}}}}}@media (max-width: 768px){.source-content{height:auto;padding:8px;.content-top{height:auto;}.main-title{padding:26px 16px;}.secondary-title{padding-left:16px;}.workflow-box{flex-direction:column;padding:8px;height:auto;width:100%;align-items:normal;}.card-content-box{height:auto;flex-direction:column;}.content-bottom{height:auto;flex-direction:column;.tool-box{padding:26px 16px;margin-right:0;.tool-item{max-width:500px;}.process-box{padding-left:15px;}.expect-box{background-position:-24px;}}.principle{width:auto;margin-top:20px;padding:26px 16px;}}}}");
+}

package/es/site/src/pages/solution/index.d.ts

@@ -0,0 +1,17 @@
+import Layout from '../layout';
+export default class Index extends Layout {
+    static template: string | import("vdt").Template<any>;
+    static defaults(): {
+        curImgList: never[];
+        showImgBox: boolean;
+        version?: string | undefined;
+        themeColor?: string | undefined;
+        colorList?: string[] | undefined;
+        showThemeColor?: boolean | undefined;
+        curLang?: string | undefined;
+        videoLevel?: number | undefined;
+    };
+    handleImgClick(info: any): void;
+    handleBoxClose(): void;
+    downloadSketch(info: any): void;
+}

package/es/site/src/pages/solution/index.js

@@ -0,0 +1,30 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import template from './index.vdt';
+import Layout from '../layout';
+var Index = /*#__PURE__*/function (_Layout) {
+  _inheritsLoose(Index, _Layout);
+  function Index() {
+    return _Layout.apply(this, arguments) || this;
+  }
+  Index.defaults = function defaults() {
+    return _extends({}, Layout.defaults(), {
+      curImgList: [],
+      showImgBox: false
+    });
+  };
+  var _proto = Index.prototype;
+  _proto.handleImgClick = function handleImgClick(info) {
+    this.set('curImgList', info.templateList);
+    this.set('showImgBox', true);
+  };
+  _proto.handleBoxClose = function handleBoxClose() {
+    this.set('showImgBox', false);
+  };
+  _proto.downloadSketch = function downloadSketch(info) {
+    location.href = "https://damife.ks3-cn-beijing.ksyuncs.com/kpc/" + info.downloadFileName;
+  };
+  return Index;
+}(Layout);
+Index.template = template;
+export { Index as default };

package/es/site/src/pages/solution/styles.d.ts

@@ -0,0 +1 @@
+export declare function makeStyles(): string;

package/es/site/src/pages/solution/styles.js

@@ -0,0 +1,7 @@
+import { css } from '@emotion/css';
+import global, { mainBlock } from '../../styles/default';
+import solution_bg from '../../imgs/solution_bg.jpg';
+import { theme } from 'kpc/styles/theme';
+export function makeStyles() {
+  return /*#__PURE__*/css("font-family:", global.fontFamily, ";.solution-nav{", mainBlock(260), ";background-image:url(", solution_bg, ");background-repeat:no-repeat;background-position:right bottom;background-size:cover;.content{display:flex;align-items:center;.nav-title{color:#000000;&>div:first-child{font-size:44px;}&>div:last-child{font-size:16px;}}}}.solution-content{background:#F7F8FA;padding-bottom:40px;", mainBlock(1030), ";height:auto;&>div{padding-top:20px;}.solution-title{font-family:PingFangSC-Regular;font-size:16px;color:#000000;margin-bottom:30px;margin-top:10px;}.solution-box{display:flex;flex-wrap:wrap;}.solution-item{width:285px;height:310px;background:#ffffff;margin-bottom:20px;border-radius:10px;transition:box-shadow ", theme.transition.middle, ";img{width:100%;border-radius:10px 10px 0 0;cursor:pointer;}&:hover{box-shadow:", global.cardBoxShadow, ";}}.solution-item:not(:nth-child(4)){margin-right:20px;}.solution-item:hover{box-shadow:", global.cardBoxShadow, ";}.solution-info{padding:20px;&>div:first-child{font-size:16px;}&>div:last-child{display:flex;align-items:center;.sketch-logo{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid #E6E6E6;border-radius:6px;cursor:pointer;transition:background ", theme.transition.middle, ";}.sketch-logo:hover{background:#F3F3F3;border-color:#F3F3F3;}.solution-desc{flex-grow:1;color:#8A8A8A;}img{width:70%;}}}}@media (max-width: 768px){.solution-nav{.content{padding-left:20px;}}.solution-title{padding-left:20px;}.solution-content{.solution-row{flex-direction:column;padding:0 16px;}}.solution-box{padding:0 20px;}.solution-content{.solution-item{margin:0 0 20px 0!important;width:100%;height:340px;}}}");
+}

package/es/site/src/pages/styles.d.ts

@@ -0,0 +1,2 @@
+export declare function makeHeaderStyles(k: string): string;
+export declare function makeLayoutStyles(): string;

package/es/site/src/pages/styles.js

@@ -0,0 +1,11 @@
+import { css } from '@emotion/css';
+import headerLogo from '../imgs/header_logo.png';
+import headerLogo2x from '../imgs/header_logo_x2.png';
+import { center } from '../styles/default';
+import { theme } from 'kpc/styles/theme';
+export function makeHeaderStyles(k) {
+  return /*#__PURE__*/css("&.", k, "-layout-header{background:rgba(255, 255, 255, 0.65);box-shadow:0px 2px 10px 0px rgba(11, 11, 11, 0.05);color:#000;backdrop-filter:blur(20px);-moz-backdrop-filter:blur(20px);justify-content:space-between;.logo{background-image:url(", headerLogo, ");width:226px;height:40px;background-size:cover;margin-left:22px;cursor:pointer;}@media screen and (-webkit-min-device-pixel-ratio: 2){.logo{background-image:url(", headerLogo2x, ");}}.", k, "-tabs{border:none;display:flex;align-items:center;}.", k, "-tab{a{color:inherit;}}.", k, "-select.versions{background:transparent;}.lang-wrapper{height:100%;display:flex;align-items:center;}.lang-box{display:flex;background:#DFEAF2;border-radius:2px;padding:4px;&>div{color:#090909;width:66px;height:24px;border-radius:2px;line-height:24px;text-align:center;}&>div.active{background:#FFFFFF;color:#0191EA;}}.main{height:100%;display:flex;align-items:center;.", k, "-tabs{margin-right:40px;.", k, "-tab{color:#000000;}}.theme-color-box{font-size:14px;position:relative;height:100%;display:flex;align-items:center;padding:0 16px;white-space:nowrap;&:hover{background:#ffffff;&>div:first-child{background:#ffffff;}}&>div:first-child{display:flex;align-items:center;height:100%;padding-right:10px;}.cur-color{height:100%;", center(), ";flex-grow:1;}.theme-color-option{width:100%;position:absolute;left:0;top:65px;background:#ffffff;box-shadow:0px 4px 20px rgba(108, 103, 103, 0.25);border-radius:4px;overflow:hidden;&>div{height:62px;", center(), ";}&>div:hover{background:#F8F8F8;}}.color-item{", center(), ";cursor:pointer;width:34px;height:34px;border-radius:50%;color:#ffffff;border:4px solid #FFFFFF;box-shadow:0px 4px 20px rgba(108, 103, 103, 0.25);box-sizing:border-box;}.color-item:hover{box-shadow:0 0 16px rgba(0, 0, 0, .1);}}}.menu-btn{display:none;margin-right:20px;}@media (max-width: 768px){.logo{width:50px;}.", k, "-tabs{display:none;}.menu-btn{display:block;}.nav-menu-list{width:100%;.active{color:", theme.color.primary, ";}}}}");
+}
+export function makeLayoutStyles() {
+  return /*#__PURE__*/css("min-width:1240px;a,a code{color:", theme.color.link, ";text-decoration:none;&:hover{color:", theme.color.linkHover, ";}}@media (max-width: 768px){min-width:auto;}");
+}

package/es/site/src/router/index.d.ts

@@ -0,0 +1,13 @@
+import Router from 'universal-router';
+import { ComponentConstructor } from 'intact';
+export type RouteResult = Promise<RouteAction>;
+type RouteAction = {
+    Page: ComponentConstructor;
+    data?: Data;
+};
+type Data = {
+    path?: string;
+};
+export declare const version: string;
+declare const _default: Router<RouteResult, import("universal-router").RouterContext>;
+export default _default;

package/es/site/src/router/index.js

@@ -0,0 +1,354 @@
+import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
+import Router from 'universal-router';
+function getVersion() {
+  var pathname = location.pathname;
+  var versionRE = /^(\/v(?:\d.?)+(-beta\.\d+)?)\/.*/;
+  var matches = pathname.match(versionRE);
+  if (matches) {
+    return matches[1];
+  }
+  return '';
+}
+export var version = getVersion();
+export default new Router({
+  path: '',
+  action: function action(_ref) {
+    return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var next, child;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            next = _ref.next;
+            _context.next = 3;
+            return next();
+          case 3:
+            child = _context.sent;
+            window.scrollTo(0, 0);
+            return _context.abrupt("return", child);
+          case 6:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }))();
+  },
+  children: [{
+    path: /^\/?$/,
+    action: function () {
+      var _action = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              _context2.next = 2;
+              return import('../pages/index');
+            case 2:
+              _context2.t0 = _context2.sent.default;
+              return _context2.abrupt("return", {
+                Page: _context2.t0
+              });
+            case 4:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2);
+      }));
+      function action() {
+        return _action.apply(this, arguments);
+      }
+      return action;
+    }()
+  }, {
+    path: /^(\/docs\/design\/.*)$/,
+    action: function () {
+      var _action2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(context) {
+        return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
+            case 0:
+              _context3.next = 2;
+              return import('../pages/design');
+            case 2:
+              _context3.t0 = _context3.sent.default;
+              _context3.t1 = {
+                path: context.params[0]
+              };
+              return _context3.abrupt("return", {
+                Page: _context3.t0,
+                data: _context3.t1
+              });
+            case 5:
+            case "end":
+              return _context3.stop();
+          }
+        }, _callee3);
+      }));
+      function action(_x) {
+        return _action2.apply(this, arguments);
+      }
+      return action;
+    }()
+  },
+  // {
+  // path: /^(?:\/kpc)?(\/docs\/blogs\/.*)$/,
+  // action: async (context) => {
+  // return {
+  // Page: (await import('../pages/blog')).default,
+  // data: {
+  // path: context.params[0]
+  // }
+  // };
+  // }
+  // },
+  // {
+  // path: '/docs/resources',
+  // action: async context => {
+  // return {
+  // Page: (await import('../pages/resource')).default,
+  // }
+  // }
+  // },
+  // // {
+  // // path: "/demo.html",
+  // // action: async context => {
+  // // return {
+  // // Page: (await import('../pages/demo')).default,
+  // // }
+  // // }
+  // // },
+  {
+    path: '/demo\/(.*)/',
+    action: function () {
+      var _action3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(context) {
+        return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
+            case 0:
+              _context4.next = 2;
+              return import('../pages/demo');
+            case 2:
+              _context4.t0 = _context4.sent.default;
+              _context4.t1 = {
+                path: context.params[0]
+              };
+              return _context4.abrupt("return", {
+                Page: _context4.t0,
+                data: _context4.t1
+              });
+            case 5:
+            case "end":
+              return _context4.stop();
+          }
+        }, _callee4);
+      }));
+      function action(_x2) {
+        return _action3.apply(this, arguments);
+      }
+      return action;
+    }()
+  }, {
+    path: '/iframe/:frameName',
+    action: function () {
+      var _action4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(context) {
+        return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+          while (1) switch (_context5.prev = _context5.next) {
+            case 0:
+              _context5.next = 2;
+              return import("../pages/iframe/" + context.params.frameName + "/index");
+            case 2:
+              _context5.t0 = _context5.sent.default;
+              _context5.t1 = {
+                path: context.params[0]
+              };
+              return _context5.abrupt("return", {
+                Page: _context5.t0,
+                data: _context5.t1
+              });
+            case 5:
+            case "end":
+              return _context5.stop();
+          }
+        }, _callee5);
+      }));
+      function action(_x3) {
+        return _action4.apply(this, arguments);
+      }
+      return action;
+    }()
+  }, {
+    path: '/resources',
+    action: function () {
+      var _action5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6(context) {
+        return _regeneratorRuntime.wrap(function _callee6$(_context6) {
+          while (1) switch (_context6.prev = _context6.next) {
+            case 0:
+              _context6.next = 2;
+              return import("../pages/resource/index");
+            case 2:
+              _context6.t0 = _context6.sent.default;
+              _context6.t1 = {
+                path: context.params[0]
+              };
+              return _context6.abrupt("return", {
+                Page: _context6.t0,
+                data: _context6.t1
+              });
+            case 5:
+            case "end":
+              return _context6.stop();
+          }
+        }, _callee6);
+      }));
+      function action(_x4) {
+        return _action5.apply(this, arguments);
+      }
+      return action;
+    }()
+  }, {
+    path: '/solutions',
+    action: function () {
+      var _action6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7(context) {
+        return _regeneratorRuntime.wrap(function _callee7$(_context7) {
+          while (1) switch (_context7.prev = _context7.next) {
+            case 0:
+              _context7.next = 2;
+              return import("../pages/solution/index");
+            case 2:
+              _context7.t0 = _context7.sent.default;
+              _context7.t1 = {
+                path: context.params[0]
+              };
+              return _context7.abrupt("return", {
+                Page: _context7.t0,
+                data: _context7.t1
+              });
+            case 5:
+            case "end":
+              return _context7.stop();
+          }
+        }, _callee7);
+      }));
+      function action(_x5) {
+        return _action6.apply(this, arguments);
+      }
+      return action;
+    }()
+  }, {
+    path: '/font',
+    action: function () {
+      var _action7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee8(context) {
+        return _regeneratorRuntime.wrap(function _callee8$(_context8) {
+          while (1) switch (_context8.prev = _context8.next) {
+            case 0:
+              _context8.next = 2;
+              return import("../pages/font/index");
+            case 2:
+              _context8.t0 = _context8.sent.default;
+              _context8.t1 = {
+                path: context.params[0]
+              };
+              return _context8.abrupt("return", {
+                Page: _context8.t0,
+                data: _context8.t1
+              });
+            case 5:
+            case "end":
+              return _context8.stop();
+          }
+        }, _callee8);
+      }));
+      function action(_x6) {
+        return _action7.apply(this, arguments);
+      }
+      return action;
+    }()
+  }, {
+    path: '/colorProcess',
+    action: function () {
+      var _action8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee9(context) {
+        return _regeneratorRuntime.wrap(function _callee9$(_context9) {
+          while (1) switch (_context9.prev = _context9.next) {
+            case 0:
+              _context9.next = 2;
+              return import("../pages/colorProcess/index");
+            case 2:
+              _context9.t0 = _context9.sent.default;
+              _context9.t1 = {
+                path: context.params[0]
+              };
+              return _context9.abrupt("return", {
+                Page: _context9.t0,
+                data: _context9.t1
+              });
+            case 5:
+            case "end":
+              return _context9.stop();
+          }
+        }, _callee9);
+      }));
+      function action(_x7) {
+        return _action8.apply(this, arguments);
+      }
+      return action;
+    }()
+  }, {
+    path: '/demo\/(.*)/',
+    action: function () {
+      var _action9 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee10(context) {
+        return _regeneratorRuntime.wrap(function _callee10$(_context10) {
+          while (1) switch (_context10.prev = _context10.next) {
+            case 0:
+              _context10.next = 2;
+              return import('../pages/demo');
+            case 2:
+              _context10.t0 = _context10.sent.default;
+              _context10.t1 = {
+                path: context.params[0]
+              };
+              return _context10.abrupt("return", {
+                Page: _context10.t0,
+                data: _context10.t1
+              });
+            case 5:
+            case "end":
+              return _context10.stop();
+          }
+        }, _callee10);
+      }));
+      function action(_x8) {
+        return _action9.apply(this, arguments);
+      }
+      return action;
+    }()
+  }, {
+    path: /(.*)/,
+    name: 'otherwise',
+    action: function () {
+      var _action10 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee11(context) {
+        return _regeneratorRuntime.wrap(function _callee11$(_context11) {
+          while (1) switch (_context11.prev = _context11.next) {
+            case 0:
+              _context11.next = 2;
+              return import('../pages/document');
+            case 2:
+              _context11.t0 = _context11.sent.default;
+              _context11.t1 = {
+                path: context.params[0]
+              };
+              return _context11.abrupt("return", {
+                Page: _context11.t0,
+                data: _context11.t1
+              });
+            case 5:
+            case "end":
+              return _context11.stop();
+          }
+        }, _callee11);
+      }));
+      function action(_x9) {
+        return _action10.apply(this, arguments);
+      }
+      return action;
+    }()
+  }]
+}, {
+  baseUrl: version
+});

package/es/site/src/styles/default.d.ts

@@ -0,0 +1,9 @@
+declare const global: {
+    contentWidth: number;
+    fontFamily: string;
+    cardBoxShadow: string;
+};
+export declare const mainBlock: (height: number) => string;
+export declare const center: () => string;
+export declare const fullfill: () => string;
+export default global;

package/es/site/src/styles/default.js

@@ -0,0 +1,15 @@
+var global = {
+  contentWidth: 1200,
+  fontFamily: 'PingFang SC',
+  cardBoxShadow: '0px 0px 16px rgba(0, 0, 0, .1)'
+};
+export var mainBlock = function mainBlock(height) {
+  return "\n        width: 100%;\n        height: " + height + "px;\n        display: flex;\n        justify-content: center;\n        & > div:first-child {\n            width: " + global.contentWidth + "px;\n        }\n        @media (max-width: 768px) {\n            & > div:first-child {\n                width: 100%;\n            }\n        }\n    ";
+};
+export var center = function center() {
+  return "\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    ";
+};
+export var fullfill = function fullfill() {
+  return "\n        width: 100%;\n        height: 100%;\n    ";
+};
+export default global;

package/es/test/demos.d.ts

@@ -0,0 +1 @@
+export {};

package/es/test/demos.js

@@ -0,0 +1,34 @@
+import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
+import { mount, testDemos, unmount, nextFrame } from './utils';
+var req = require.context('~/components/', true, /^((?!(affix|code)).)*\/demos\/.*index\.ts$/);
+// const req = require.context('~/components/', true, /upload\/demos\/.*index\.ts$/);
+// const vueReq = require.context('~/components/', true, /^((?!(affix|code)).)*\/demos\/.*index\.vue$/);
+describe('Demos', function () {
+  afterEach(function () {
+    return unmount();
+  });
+  describe('Intact', function () {
+    testDemos(req, /*#__PURE__*/function () {
+      var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(Demo) {
+        var _mount, instance, element;
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _mount = mount(Demo), instance = _mount[0], element = _mount[1];
+              _context.next = 3;
+              return nextFrame();
+            case 3:
+              expect(element.outerHTML).to.matchSnapshot();
+            case 4:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+      return function (_x) {
+        return _ref.apply(this, arguments);
+      };
+    }());
+  });
+});

package/es/test/index.d.ts

@@ -0,0 +1 @@
+import './test.styl';