@antv/dumi-theme-antv 0.1.0 → 0.2.2

package/es/builtins/Example.d.ts

@@ -0,0 +1,5 @@
+import './Example.less';
+declare const _default: (props: {
+    route: any;
+}) => JSX.Element;
+export default _default;

package/es/builtins/Previewer.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import type { IPreviewerComponentProps } from 'dumi/theme';
+import './Previewer.less';
+export interface IPreviewerProps extends IPreviewerComponentProps {
+    /**
+     * enable transform to change CSS containing block for demo
+     */
+    transform?: boolean;
+    /**
+     * modify background for demo area
+     */
+    background?: string;
+    /**
+     * collapse padding of demo area
+     */
+    compact?: boolean;
+    /**
+     * configurations for action button
+     */
+    hideActions?: ('CSB' | 'EXTERNAL' | 'RIDDLE')[];
+    /**
+     * show source code by default
+     */
+    defaultShowCode?: boolean;
+    /**
+     * use iframe mode for this demo
+     */
+    iframe?: true | number;
+    /**
+     * replace builtin demo url
+     */
+    demoUrl?: string;
+    /**
+     * control action bar render
+     */
+    actionBarRender?: (actionBarNode: React.ReactNode) => React.ReactNode;
+}
+declare const Previewer: React.FC<IPreviewerProps>;
+export default Previewer;

package/es/builtins/Previewer.js

@@ -24,10 +24,10 @@ import './Previewer.less';
  */
 
 function getSourceType(file, source) {
-  var _file$match;
+  var _a; // use file extension as source type first
 
-  // use file extension as source type first
-  var type = (_file$match = file.match(/\.(\w+)$/)) === null || _file$match === void 0 ? void 0 : _file$match[1];
+
+  var type = (_a = file.match(/\.(\w+)$/)) === null || _a === void 0 ? void 0 : _a[1];
 
   if (!type) {
     type = source.tsx ? 'tsx' : 'jsx';
@@ -37,7 +37,7 @@ function getSourceType(file, source) {
 }
 
 var Previewer = function Previewer(oProps) {
-  var _props$hideActions, _props$hideActions2, _props$hideActions3;
+  var _a, _b, _c;
 
   var demoRef = useRef();
 
@@ -49,8 +49,8 @@ var Previewer = function Previewer(oProps) {
   var demoUrl = props.demoUrl || builtinDemoUrl;
   var isActive = (history === null || history === void 0 ? void 0 : history.location.hash) === "#".concat(props.identifier);
   var isSingleFile = Object.keys(props.sources).length === 1;
-  var openCSB = useCodeSandbox(((_props$hideActions = props.hideActions) === null || _props$hideActions === void 0 ? void 0 : _props$hideActions.includes('CSB')) ? null : props);
-  var openRiddle = useRiddle(((_props$hideActions2 = props.hideActions) === null || _props$hideActions2 === void 0 ? void 0 : _props$hideActions2.includes('RIDDLE')) ? null : props);
+  var openCSB = useCodeSandbox(((_a = props.hideActions) === null || _a === void 0 ? void 0 : _a.includes('CSB')) ? null : props);
+  var openRiddle = useRiddle(((_b = props.hideActions) === null || _b === void 0 ? void 0 : _b.includes('RIDDLE')) ? null : props);
 
   var _useMotions = useMotions(props.motions || [], demoRef.current),
       _useMotions2 = _slicedToArray(_useMotions, 2),
@@ -168,7 +168,7 @@ var Previewer = function Previewer(oProps) {
     onClick: function onClick() {
       return setIframeKey(Math.random());
     }
-  }), !((_props$hideActions3 = props.hideActions) === null || _props$hideActions3 === void 0 ? void 0 : _props$hideActions3.includes('EXTERNAL')) && /*#__PURE__*/React.createElement(Link, {
+  }), !((_c = props.hideActions) === null || _c === void 0 ? void 0 : _c.includes('EXTERNAL')) && /*#__PURE__*/React.createElement(Link, {
     target: "_blank",
     to: demoUrl
   }, /*#__PURE__*/React.createElement("button", {

package/es/builtins/SourceCode.d.ts

@@ -0,0 +1,10 @@
+import type { Language } from 'prism-react-renderer';
+import 'prismjs/themes/prism.css';
+import './SourceCode.less';
+export interface ICodeBlockProps {
+    code: string;
+    lang: Language;
+    showCopy?: boolean;
+}
+declare const _default: ({ code, lang, showCopy }: ICodeBlockProps) => JSX.Element;
+export default _default;

package/es/builtins/SourceCode.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -38,7 +36,7 @@ export default (function (_ref) {
 
   return /*#__PURE__*/React.createElement("div", {
     className: "__dumi-default-code-block"
-  }, /*#__PURE__*/React.createElement(Highlight, _extends({}, defaultProps, {
+  }, /*#__PURE__*/React.createElement(Highlight, Object.assign({}, defaultProps, {
     code: code,
     language: SIMILAR_DSL[lang] || lang,
     theme: undefined
@@ -58,14 +56,14 @@ export default (function (_ref) {
         return copyCode(code);
       }
     }), tokens.map(function (line, i) {
-      return /*#__PURE__*/React.createElement("div", getLineProps({
+      return /*#__PURE__*/React.createElement("div", Object.assign({}, getLineProps({
         line: line,
         key: i
-      }), line.map(function (token, key) {
-        return /*#__PURE__*/React.createElement("span", getTokenProps({
+      })), line.map(function (token, key) {
+        return /*#__PURE__*/React.createElement("span", Object.assign({}, getTokenProps({
           token: token,
           key: key
-        }));
+        })));
       }));
     }));
   }));

package/es/builtins/Table.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './Table.less';
+declare const Table: React.FC;
+export default Table;

package/es/builtins/Tree.d.ts

@@ -0,0 +1,4 @@
+import type { ComponentProps } from 'react';
+import './Tree.less';
+declare const _default: (props: ComponentProps<'div'>) => JSX.Element;
+export default _default;

package/es/builtins/Tree.js

@@ -1,9 +1,3 @@
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -76,13 +70,13 @@ function getTreeFromList(nodes) {
   var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   var data = [];
   [].concat(nodes).forEach(function (node, i) {
-    var _data;
+    var _a;
 
     var key = "".concat(prefix ? "".concat(prefix, "-") : '').concat(i);
 
     switch (node.type) {
       case 'ul':
-        var parent = ((_data = data[data.length - 1]) === null || _data === void 0 ? void 0 : _data.children) || data;
+        var parent = ((_a = data[data.length - 1]) === null || _a === void 0 ? void 0 : _a.children) || data;
         var ulLeafs = getTreeFromList(node.props.children || [], key);
         parent.push.apply(parent, _toConsumableArray(ulLeafs));
         break;
@@ -204,7 +198,7 @@ export default (function (props) {
     itemHeight: 20,
     showLine: true,
     selectable: false,
-    motion: _objectSpread(_objectSpread({}, collapseMotion), {}, {
+    motion: Object.assign(Object.assign({}, collapseMotion), {
       motionAppear: false
     }),
     onClick: onClick,

package/es/components/Dark.d.ts

@@ -0,0 +1,9 @@
+import type { FC } from 'react';
+import './Dark.less';
+interface darkProps {
+    darkSwitch: boolean;
+    isSideMenu: boolean;
+    onDarkSwitchClick?: (ev: any) => void;
+}
+declare const Dark: FC<darkProps>;
+export default Dark;

package/es/components/LocaleSelect.d.ts

@@ -0,0 +1,6 @@
+import type { FC } from 'react';
+import './LocaleSelect.less';
+declare const LocaleSelect: FC<{
+    location: any;
+}>;
+export default LocaleSelect;

package/es/components/Navbar.d.ts

@@ -0,0 +1,10 @@
+import type { FC, MouseEvent } from 'react';
+import React from 'react';
+import './Navbar.less';
+interface INavbarProps {
+    location: any;
+    navPrefix?: React.ReactNode;
+    onMobileMenuClick: (ev: MouseEvent<HTMLButtonElement>) => void;
+}
+declare const Navbar: FC<INavbarProps>;
+export default Navbar;

package/es/components/Navbar.js

@@ -116,9 +116,9 @@ var Navbar = function Navbar(_ref) {
       verticalAlign: 'top'
     }
   }, title))), /*#__PURE__*/React.createElement("nav", null, navPrefix, navItems.map(function (nav) {
-    var _nav$children;
+    var _a;
 
-    var child = Boolean((_nav$children = nav.children) === null || _nav$children === void 0 ? void 0 : _nav$children.length) && /*#__PURE__*/React.createElement("ul", null, nav.children.map(function (item) {
+    var child = Boolean((_a = nav.children) === null || _a === void 0 ? void 0 : _a.length) && /*#__PURE__*/React.createElement("ul", null, nav.children.map(function (item) {
       return /*#__PURE__*/React.createElement("li", {
         key: item.path
       }, /*#__PURE__*/React.createElement(NavLink, {
@@ -131,7 +131,7 @@ var Navbar = function Navbar(_ref) {
       to: nav.path,
       key: nav.path
     }, nav.title) : nav.title, child);
-  }), /*#__PURE__*/React.createElement("span", productItemProps, "\u6240\u6709\u4EA7\u54C1", /*#__PURE__*/React.createElement("img", {
+  }), /*#__PURE__*/React.createElement("span", Object.assign({}, productItemProps), "\u6240\u6709\u4EA7\u54C1", /*#__PURE__*/React.createElement("img", {
     src: "https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png",
     alt: "antv logo arrow",
     className: "arrow ".concat(productMenuVisible && 'open')

package/es/components/SearchBar.d.ts

@@ -0,0 +1,4 @@
+import './SearchBar.less';
+export declare const highlight: (key: string, title: string) => JSX.Element;
+declare const _default: () => JSX.Element;
+export default _default;

package/es/components/SearchBar.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -55,7 +53,7 @@ export default (function () {
   }, [result]);
   return /*#__PURE__*/React.createElement("div", {
     className: "__dumi-default-search"
-  }, /*#__PURE__*/React.createElement("input", _extends({
+  }, /*#__PURE__*/React.createElement("input", Object.assign({
     className: "__dumi-default-search-input",
     type: "search",
     ref: input
@@ -65,7 +63,7 @@ export default (function () {
       return setKeywords(ev.target.value);
     }
   } : {})), /*#__PURE__*/React.createElement("ul", null, items.length > 0 && items.map(function (meta) {
-    var _meta$parent;
+    var _a;
 
     return /*#__PURE__*/React.createElement("li", {
       key: meta.path,
@@ -74,7 +72,7 @@ export default (function () {
       }
     }, /*#__PURE__*/React.createElement(AnchorLink, {
       to: meta.path
-    }, ((_meta$parent = meta.parent) === null || _meta$parent === void 0 ? void 0 : _meta$parent.title) && /*#__PURE__*/React.createElement("span", null, meta.parent.title), highlight(keywords, meta.title)));
+    }, ((_a = meta.parent) === null || _a === void 0 ? void 0 : _a.title) && /*#__PURE__*/React.createElement("span", null, meta.parent.title), highlight(keywords, meta.title)));
   }), items.length === 0 && keywords && /*#__PURE__*/React.createElement("li", {
     style: {
       textAlign: 'center'

package/es/components/SideMenu.d.ts

@@ -0,0 +1,10 @@
+import type { FC } from 'react';
+import React from 'react';
+import './SideMenu.less';
+interface INavbarProps {
+    mobileMenuCollapsed: boolean;
+    location: any;
+    darkPrefix?: React.ReactNode;
+}
+declare const SideMenu: FC<INavbarProps>;
+export default SideMenu;

package/es/components/SideMenu.js

@@ -45,9 +45,9 @@ var SideMenu = function SideMenu(_ref) {
   }, !!navItems.length && /*#__PURE__*/React.createElement("ul", {
     className: "__dumi-default-menu-nav-list"
   }, navItems.map(function (nav) {
-    var _nav$children;
+    var _a;
 
-    var child = Boolean((_nav$children = nav.children) === null || _nav$children === void 0 ? void 0 : _nav$children.length) && /*#__PURE__*/React.createElement("ul", null, nav.children.map(function (item) {
+    var child = Boolean((_a = nav.children) === null || _a === void 0 ? void 0 : _a.length) && /*#__PURE__*/React.createElement("ul", null, nav.children.map(function (item) {
       return /*#__PURE__*/React.createElement("li", {
         key: item.path || item.title
       }, /*#__PURE__*/React.createElement(NavLink, {
@@ -64,10 +64,10 @@ var SideMenu = function SideMenu(_ref) {
   }), darkPrefix), /*#__PURE__*/React.createElement("ul", {
     className: "__dumi-default-menu-list"
   }, !isHiddenMenus && menu.map(function (item) {
-    var _meta$slugs;
+    var _a; // always use meta from routes to reduce menu data size
 
-    // always use meta from routes to reduce menu data size
-    var hasSlugs = Boolean((_meta$slugs = meta.slugs) === null || _meta$slugs === void 0 ? void 0 : _meta$slugs.length);
+
+    var hasSlugs = Boolean((_a = meta.slugs) === null || _a === void 0 ? void 0 : _a.length);
     var hasChildren = item.children && Boolean(item.children.length);
     var show1LevelSlugs = meta.toc === 'menu' && !hasChildren && hasSlugs && item.path === location.pathname.replace(/([^^])\/$/, '$1');
     var menuPaths = hasChildren ? item.children.map(function (i) {

package/es/components/SlugList.d.ts

@@ -0,0 +1,7 @@
+import type { FC } from 'react';
+import './SlugList.less';
+declare const SlugsList: FC<{
+    slugs: any;
+    className?: string;
+}>;
+export default SlugsList;

package/es/components/SlugList.js

@@ -1,23 +1,28 @@
-var _excluded = ["slugs"];
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
 
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
 
 import React from 'react';
 import { AnchorLink } from 'dumi/theme';
 import './SlugList.less';
 
-var SlugsList = function SlugsList(_ref) {
-  var slugs = _ref.slugs,
-      props = _objectWithoutProperties(_ref, _excluded);
+var SlugsList = function SlugsList(_a) {
+  var slugs = _a.slugs,
+      props = __rest(_a, ["slugs"]);
 
-  return /*#__PURE__*/React.createElement("ul", _extends({
+  return /*#__PURE__*/React.createElement("ul", Object.assign({
     role: "slug-list"
-  }, props), slugs.filter(function (_ref2) {
-    var depth = _ref2.depth;
+  }, props), slugs.filter(function (_ref) {
+    var depth = _ref.depth;
     return depth > 1 && depth < 4;
   }).map(function (slug) {
     return /*#__PURE__*/React.createElement("li", {

package/es/declaration.d.ts

@@ -0,0 +1 @@
+declare module "*.module.less";

package/es/layout.d.ts

@@ -0,0 +1,5 @@
+import type { IRouteComponentProps } from '@umijs/types';
+import React from 'react';
+import './style/layout.less';
+declare const Layout: React.FC<IRouteComponentProps>;
+export default Layout;

package/es/layout.js

@@ -118,8 +118,8 @@ var BannerPanel = function BannerPanel(banner) {
   });
   return /*#__PURE__*/React.createElement(Banner, {
     coverImage: coverImage,
-    title: title // @ts-ignore
-    ,
+    title: title,
+    // @ts-ignore
     description: description,
     notifications: notifications,
     buttons: actions,
@@ -147,10 +147,11 @@ var Features = function Features(features) {
 };
 
 var Layout = function Layout(_ref) {
-  var _meta$slugs, _match;
-
   var children = _ref.children,
       location = _ref.location;
+
+  var _a, _b;
+
   var Context = useContext(context);
   var _Context$config = Context.config,
       mode = _Context$config.mode,
@@ -161,7 +162,6 @@ var Layout = function Layout(_ref) {
       meta = _processRedirect.meta,
       isDirect = _processRedirect.isDirect;
 
-  console.log('Context', Context, 'calculate meta', meta);
   var repoUrl = repository.url,
       branch = repository.branch,
       platform = repository.platform;
@@ -178,7 +178,7 @@ var Layout = function Layout(_ref) {
   var showFeatures = isSiteMode && meta.features;
   var showIdeas = isSiteMode && meta.ideas;
   var showSideMenu = meta.sidemenu !== false && !showHero && !showBanner && !showFeatures && !meta.gapless;
-  var showSlugs = !showHero && !showBanner && !showFeatures && Boolean((_meta$slugs = meta.slugs) === null || _meta$slugs === void 0 ? void 0 : _meta$slugs.length) && (meta.toc === 'content' || meta.toc === undefined) && !meta.gapless;
+  var showSlugs = !showHero && !showBanner && !showFeatures && Boolean((_a = meta.slugs) === null || _a === void 0 ? void 0 : _a.length) && (meta.toc === 'content' || meta.toc === undefined) && !meta.gapless;
   var isCN = /^zh|cn$/i.test(locale); // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
   var updatedTime = new Date(meta.updatedTime).toLocaleString([], {
@@ -187,7 +187,7 @@ var Layout = function Layout(_ref) {
   var repoPlatform = {
     github: 'GitHub',
     gitlab: 'GitLab'
-  }[((_match = (repoUrl || '').match(/(github|gitlab)/)) === null || _match === void 0 ? void 0 : _match[1]) || 'nothing'] || platform; // 等dumi最新版发布后解决路由匹配问题
+  }[((_b = (repoUrl || '').match(/(github|gitlab)/)) === null || _b === void 0 ? void 0 : _b[1]) || 'nothing'] || platform; // 等dumi最新版发布后解决路由匹配问题
 
   if (isEmpty(meta) && !isDirect) {
     return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {

package/package.json

@@ -1,13 +1,15 @@
 {
   "name": "@antv/dumi-theme-antv",
-  "version": "0.1.0",
+  "version": "0.2.2",
   "description": "The official antv site theme of dumi",
   "files": [
     "es",
     "src"
   ],
   "sideEffects": [
-    "*.less"
+    "*.less",
+    "*.module.less",
+    "*.css"
   ],
   "scripts": {
     "start": "father build --watch",
@@ -23,6 +25,7 @@
     "i18next": "^21.6.14",
     "lodash": "^4.17.21",
     "lodash.throttle": "^4.1.1",
+    "omit.js": "^2.0.2",
     "parse-github-url": "^1.0.2",
     "prism-react-renderer": "^1.1.1",
     "prismjs": "^1.21.0",
@@ -33,7 +36,9 @@
     "react": "^17.0.1",
     "react-github-button": "^0.1.11",
     "react-i18next": "^11.16.2",
-    "react-use": "^17.3.2"
+    "react-slick": "^0.28.1",
+    "react-use": "^17.3.2",
+    "slick-carousel": "^1.8.1"
   },
   "repository": {
     "type": "git",

package/src/antv/Banner/index.tsx

@@ -1,16 +1,12 @@
-/* eslint-disable react/no-array-index-key */
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import React, { useContext } from 'react';
-
-import GitHubButton from 'react-github-button';
-import gh from 'parse-github-url';
-import classNames from 'classnames';
-import { context } from 'dumi/theme';
-// @ts-ignore
-import styles from './Banner.module.less';
-import Notification, { NotificationProps } from './Notification';
-
-type BannerButtonShape = 'round' | 'square';
+import classNames from "classnames";
+import { context } from "dumi/theme";
+import gh from "parse-github-url";
+import React, { useContext } from "react";
+import GitHubButton from "react-github-button";
+//@ts-ignore
+import styles from "./Banner.module.less";
+import Notification, { NotificationProps } from "./Notification";
+type BannerButtonShape = "round" | "square";
 
 interface BannerButton {
   text: string;
@@ -34,7 +30,8 @@ interface BannerProps {
   onPlayVideo?: () => void;
 }
 
-const backLeftBottom = 'https://gw.alipayobjects.com/zos/basement_prod/441d5eaf-e623-47cd-b9b9-2a581d9ce1e3.svg';
+const backLeftBottom =
+  "https://gw.alipayobjects.com/zos/basement_prod/441d5eaf-e623-47cd-b9b9-2a581d9ce1e3.svg";
 
 const Banner: React.FC<BannerProps> = ({
   coverImage,
@@ -54,32 +51,34 @@ const Banner: React.FC<BannerProps> = ({
 
   const notificationsNode = notifications
     .slice(0, 2)
-    .map((notification, i) => <Notification index={i} key={i} {...notification} />);
+    .map((notification, i) => (
+      <Notification index={i} key={i} {...notification} />
+    ));
 
   const renderButtons = buttons.map((button: BannerButton, i) => {
-    const ButtonLink = 'a';
+    const ButtonLink = "a";
     const buttonProps = {} as any;
-    if (button.link.startsWith('http')) {
-      buttonProps.target = '_blank';
-      buttonProps.rel = 'noopener noreferrer';
+    if (button.link.startsWith("http")) {
+      buttonProps.target = "_blank";
+      buttonProps.rel = "noopener noreferrer";
     }
-    if (ButtonLink === 'a') {
+    if (ButtonLink === "a") {
       buttonProps.href = button.link;
     } else {
       buttonProps.to = button.link;
     }
-    const { shape = 'round' } = button;
+    const { shape = "round" } = button;
     return (
       <ButtonLink
         {...buttonProps}
         className={classNames(
           styles.buttonLink,
-          styles[button.type || ''],
-          button.type === 'primary' ? 'primary-button' : 'common-button',
+          styles[button.type || ""],
+          button.type === "primary" ? "primary-button" : "common-button"
         )}
         key={i}
         style={{
-          borderRadius: shape === 'round' ? '1000px' : '4px',
+          borderRadius: shape === "round" ? "1000px" : "4px",
           ...button.style,
         }}
       >
@@ -94,8 +93,13 @@ const Banner: React.FC<BannerProps> = ({
     if (githubObj && githubObj.owner && githubObj.name) {
       renderButtons.push(
         <div key="github" className={styles.githubWrapper}>
-          <GitHubButton type="stargazers" size="large" namespace={githubObj.owner} repo={githubObj.name} />
-        </div>,
+          <GitHubButton
+            type="stargazers"
+            size="large"
+            namespace={githubObj.owner}
+            repo={githubObj.name}
+          />
+        </div>
       );
     }
   }
@@ -104,15 +108,29 @@ const Banner: React.FC<BannerProps> = ({
     <section className={classNames(styles.wrapper, className)} style={style}>
       <div className={styles.content}>
         <div className={styles.text}>
-          <div className={classNames(styles.title, 'banner-title')}>{title}</div>
-          <div className={classNames(styles.description, 'banner-description')}>{description}</div>
-          <div className={classNames(styles.buttons, 'banner-buttons')}>{renderButtons}</div>
+          <div className={classNames(styles.title, "banner-title")}>
+            {title}
+          </div>
+          <div className={classNames(styles.description, "banner-description")}>
+            {description}
+          </div>
+          <div className={classNames(styles.buttons, "banner-buttons")}>
+            {renderButtons}
+          </div>
+        </div>
+        <div className={classNames(styles.notifications, "notifications")}>
+          {notificationsNode}
         </div>
-        <div className={classNames(styles.notifications, 'notifications')}>{notificationsNode}</div>
-        <div className={classNames(styles.teaser, 'teaser')}>
-          <div className={classNames(styles.teaserimg, 'teaser-img')}>{coverImage}</div>
+        <div className={classNames(styles.teaser, "teaser")}>
+          <div className={classNames(styles.teaserimg, "teaser-img")}>
+            {coverImage}
+          </div>
         </div>
-        <img className={styles.backLeftBottom} src={backLeftBottom} alt="back" />
+        <img
+          className={styles.backLeftBottom}
+          src={backLeftBottom}
+          alt="back"
+        />
       </div>
     </section>
   );

package/src/declaration.d.ts

@@ -0,0 +1 @@
+declare module "*.module.less";

package/src/layout.tsx

@@ -15,6 +15,7 @@ import SearchBar from './components/SearchBar';
 import SideMenu from './components/SideMenu';
 import SlugList from './components/SlugList';
 import './style/layout.less';
+
 i18n
   .use(initReactI18next) // passes i18n down to react-i18next
   .init({
@@ -120,7 +121,6 @@ const Layout: React.FC<IRouteComponentProps> = ({ children, location }) => {
   } = Context;
 
   const { meta, isDirect } = processRedirect(Context, location);
-  console.log('Context', Context, 'calculate meta', meta);
   const { url: repoUrl, branch, platform } = repository;
   const [menuCollapsed, setMenuCollapsed] = useState<boolean>(true);
   const isSiteMode = mode === 'site';