mirror of
https://gitee.com/baidu/amis.git
synced 2024-11-29 18:48:45 +08:00
chore: 升级 react-router 到 v5 (#3552)
* chore: 升级 react-router 到 v5 * 更新 snapshot
This commit is contained in:
liaoxuezhi
GitHub
parent
799bdfacd4
commit
75119817fa
@ -2,7 +2,7 @@
|
||||
|
||||
exports[`Components:404 Custom code & messages 1`] = `
|
||||
<div
|
||||
className="container w-xxl w-auto-xs"
|
||||
className="container w-xxl w-auto-xs m-auto"
|
||||
>
|
||||
<div
|
||||
className="text-center m-b-lg"
|
||||
@ -23,7 +23,7 @@ exports[`Components:404 Custom code & messages 1`] = `
|
||||
|
||||
exports[`Components:404 default View 1`] = `
|
||||
<div
|
||||
className="container w-xxl w-auto-xs"
|
||||
className="container w-xxl w-auto-xs m-auto"
|
||||
>
|
||||
<div
|
||||
className="text-center m-b-lg"
|
||||
|
||||
@ -6,21 +6,13 @@ import {
|
||||
AlertComponent,
|
||||
Button,
|
||||
Drawer,
|
||||
Spinner,
|
||||
ToastComponent
|
||||
} from '../../src/components/index';
|
||||
import {eachTree, mapTree} from '../../src/utils/helper';
|
||||
import {Icon} from '../../src/components/icons';
|
||||
import '../../src/locale/en-US';
|
||||
import {
|
||||
Router,
|
||||
Route,
|
||||
IndexRoute,
|
||||
browserHistory,
|
||||
hashHistory,
|
||||
Link,
|
||||
Redirect,
|
||||
withRouter
|
||||
} from 'react-router';
|
||||
import {withRouter} from 'react-router';
|
||||
import Select from '../../src/components/Select';
|
||||
import InputBox from '../../src/components/InputBox';
|
||||
import DocSearch from './DocSearch';
|
||||
@ -29,7 +21,14 @@ import DocNavCN from './DocNavCN';
|
||||
import Example, {examples} from './Example';
|
||||
import CSSDocs, {cssDocs} from './CssDocs';
|
||||
import Components, {components} from './Components';
|
||||
|
||||
import {
|
||||
BrowserRouter as Router,
|
||||
Route,
|
||||
Redirect,
|
||||
Switch,
|
||||
Link,
|
||||
NavLink
|
||||
} from 'react-router-dom';
|
||||
declare const _hmt: any;
|
||||
|
||||
let ContextPath = '';
|
||||
@ -102,7 +101,7 @@ const docVersions = [
|
||||
}
|
||||
];
|
||||
|
||||
function getPath(path) {
|
||||
function getPath(path: string) {
|
||||
return path
|
||||
? path[0] === '/'
|
||||
? ContextPath + path
|
||||
@ -155,20 +154,20 @@ export class App extends React.PureComponent<{
|
||||
themes.find(item => item?.value === localStorage.getItem('amis-theme')) ||
|
||||
themes[0],
|
||||
locale: localStorage.getItem('amis-locale')
|
||||
? localStorage.getItem('amis-locale').replace('zh-cn', 'zh-CN')
|
||||
? localStorage.getItem('amis-locale')?.replace('zh-cn', 'zh-CN')
|
||||
: '',
|
||||
navigations: [],
|
||||
filter: '' // 导航过滤，方便找组件
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
constructor(props: any) {
|
||||
super(props);
|
||||
this.setNavigations = this.setNavigations.bind(this);
|
||||
this.setNavigationFilter = this.setNavigationFilter.bind(this);
|
||||
document.querySelector('body').classList.add(this.state.theme.value);
|
||||
document.querySelector('body')?.classList.add(this.state.theme.value);
|
||||
}
|
||||
|
||||
componentDidUpdate(preProps, preState) {
|
||||
componentDidUpdate(preProps: any, preState: any) {
|
||||
const props = this.props;
|
||||
|
||||
if (preState.theme.value !== this.state.theme.value) {
|
||||
@ -178,7 +177,7 @@ export class App extends React.PureComponent<{
|
||||
const theme = item.getAttribute('title');
|
||||
item.disabled = theme !== this.state.theme.value;
|
||||
});
|
||||
const body = document.querySelector('body');
|
||||
const body = document.body;
|
||||
body.classList.remove(preState.theme.value);
|
||||
body.classList.add(this.state.theme.value);
|
||||
}
|
||||
@ -269,25 +268,31 @@ export class App extends React.PureComponent<{
|
||||
)}
|
||||
|
||||
<ul className={`HeaderLinks`}>
|
||||
<Link to={`${ContextPath}/zh-CN/docs`} activeClassName="is-active">
|
||||
<NavLink
|
||||
to={`${ContextPath}/zh-CN/docs`}
|
||||
activeClassName="is-active"
|
||||
>
|
||||
文档
|
||||
</Link>
|
||||
</NavLink>
|
||||
|
||||
<Link
|
||||
<NavLink
|
||||
to={`${ContextPath}/zh-CN/components`}
|
||||
activeClassName="is-active"
|
||||
>
|
||||
组件
|
||||
</Link>
|
||||
<Link to={`${ContextPath}/zh-CN/style`} activeClassName="is-active">
|
||||
</NavLink>
|
||||
<NavLink
|
||||
to={`${ContextPath}/zh-CN/style`}
|
||||
activeClassName="is-active"
|
||||
>
|
||||
样式
|
||||
</Link>
|
||||
<Link
|
||||
</NavLink>
|
||||
<NavLink
|
||||
to={`${ContextPath}/examples/index`}
|
||||
activeClassName="is-active"
|
||||
>
|
||||
示例
|
||||
</Link>
|
||||
</NavLink>
|
||||
<a
|
||||
href="https://github.com/fex-team/amis-editor-demo"
|
||||
target="_blank"
|
||||
@ -307,8 +312,8 @@ export class App extends React.PureComponent<{
|
||||
value={this.state.locale || 'zh-CN'}
|
||||
options={locales}
|
||||
onChange={locale => {
|
||||
this.setState({locale: locale.value});
|
||||
localStorage.setItem('amis-locale', locale.value);
|
||||
this.setState({locale: (locale as any).value});
|
||||
localStorage.setItem('amis-locale', (locale as any).value);
|
||||
window.location.reload();
|
||||
}}
|
||||
/>
|
||||
@ -323,10 +328,12 @@ export class App extends React.PureComponent<{
|
||||
options={this.state.themes}
|
||||
onChange={theme => {
|
||||
this.setState({theme});
|
||||
localStorage.setItem('amis-theme', `${theme.value}`);
|
||||
localStorage.setItem('amis-theme', `${(theme as any).value}`);
|
||||
document
|
||||
.querySelector('body')
|
||||
.classList[theme.value === 'dark' ? 'add' : 'remove']('dark');
|
||||
?.classList[
|
||||
(theme as any).value === 'dark' ? 'add' : 'remove'
|
||||
]('dark');
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@ -339,8 +346,8 @@ export class App extends React.PureComponent<{
|
||||
value={this.state.viewMode || 'pc'}
|
||||
options={viewModes}
|
||||
onChange={viewMode => {
|
||||
this.setState({viewMode: viewMode.value});
|
||||
localStorage.setItem('amis-viewMode', viewMode.value);
|
||||
this.setState({viewMode: (viewMode as any).value});
|
||||
localStorage.setItem('amis-viewMode', (viewMode as any).value);
|
||||
window.location.reload();
|
||||
}}
|
||||
/>
|
||||
@ -353,7 +360,7 @@ export class App extends React.PureComponent<{
|
||||
theme={this.state.theme.value}
|
||||
value={docVersions[0].value}
|
||||
options={docVersions}
|
||||
onChange={doc => {
|
||||
onChange={(doc: any) => {
|
||||
if (doc.url && /^https?\:\/\//.test(doc.url)) {
|
||||
window.open(doc.url);
|
||||
} else {
|
||||
@ -418,17 +425,17 @@ export class App extends React.PureComponent<{
|
||||
|
||||
return (
|
||||
<AsideNav
|
||||
navigations={this.state.navigations.map(item => ({
|
||||
navigations={this.state.navigations.map((item: any) => ({
|
||||
...item,
|
||||
children: item.children
|
||||
? item.children
|
||||
.filter(item => {
|
||||
.filter((item: any) => {
|
||||
if (item.label) {
|
||||
return filterReg.exec(item.label);
|
||||
}
|
||||
return true;
|
||||
})
|
||||
.map(item => ({
|
||||
.map((item: any) => ({
|
||||
...item,
|
||||
className: 'is-top'
|
||||
}))
|
||||
@ -528,7 +535,7 @@ export class App extends React.PureComponent<{
|
||||
<ToastComponent theme={theme.value} locale={this.state.locale} />
|
||||
<AlertComponent theme={theme.value} locale={this.state.locale} />
|
||||
|
||||
{React.cloneElement(this.props.children as any, {
|
||||
{/* {React.cloneElement(this.props.children as any, {
|
||||
key: theme.value,
|
||||
...(this.props.children as any).props,
|
||||
setNavigations: this.setNavigations,
|
||||
@ -538,11 +545,165 @@ export class App extends React.PureComponent<{
|
||||
locale: this.state.locale,
|
||||
offScreen: this.state.offScreen,
|
||||
ContextPath
|
||||
})}
|
||||
})} */}
|
||||
{this.renderContent()}
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
renderContent() {
|
||||
const locale = 'zh-CN'; // 暂时不支持切换，因为目前只有中文文档
|
||||
const theme = this.state.theme;
|
||||
|
||||
return (
|
||||
<React.Suspense
|
||||
fallback={<Spinner overlay spinnerClassName="m-t-lg" size="lg" />}
|
||||
>
|
||||
<Switch>
|
||||
<Redirect
|
||||
from={`${ContextPath}/`}
|
||||
to={`${ContextPath}/${locale}/docs/index`}
|
||||
exact
|
||||
/>
|
||||
|
||||
{/* docs */}
|
||||
<Redirect
|
||||
from={`${ContextPath}/docs`}
|
||||
to={`${ContextPath}/${locale}/docs/index`}
|
||||
exact
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/docs/index`}
|
||||
to={`${ContextPath}/${locale}/docs/index`}
|
||||
exact
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/docs/*`}
|
||||
to={`${ContextPath}/${locale}/docs/*`}
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/${locale}/docs`}
|
||||
to={`${ContextPath}/${locale}/docs/index`}
|
||||
exact
|
||||
/>
|
||||
|
||||
{/* components */}
|
||||
<Redirect
|
||||
from={`${ContextPath}/components`}
|
||||
to={`${ContextPath}/${locale}/components/page`}
|
||||
exact
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/components/page`}
|
||||
to={`${ContextPath}/${locale}/components/page`}
|
||||
exact
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/components/*`}
|
||||
to={`${ContextPath}/${locale}/components/*`}
|
||||
exact
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/${locale}/components`}
|
||||
to={`${ContextPath}/${locale}/components/page`}
|
||||
exact
|
||||
/>
|
||||
|
||||
{/* expamles */}
|
||||
<Redirect
|
||||
from={`${ContextPath}/examples`}
|
||||
to={`${ContextPath}/examples/index`}
|
||||
exact
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/${locale}/style`}
|
||||
to={`${ContextPath}/${locale}/style/index`}
|
||||
exact
|
||||
/>
|
||||
<Route
|
||||
path={`${ContextPath}/${locale}/docs`}
|
||||
render={(props: any) => (
|
||||
<Doc
|
||||
{...{
|
||||
setNavigations: this.setNavigations,
|
||||
theme: theme.value,
|
||||
classPrefix: theme.ns,
|
||||
viewMode: this.state.viewMode,
|
||||
locale: this.state.locale,
|
||||
offScreen: this.state.offScreen,
|
||||
ContextPath,
|
||||
showCode: false
|
||||
}}
|
||||
{...props}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
<Route
|
||||
path={`${ContextPath}/${locale}/components`}
|
||||
render={(props: any) => (
|
||||
<Components
|
||||
{...{
|
||||
setNavigations: this.setNavigations,
|
||||
theme: theme.value,
|
||||
classPrefix: theme.ns,
|
||||
viewMode: this.state.viewMode,
|
||||
locale: this.state.locale,
|
||||
offScreen: this.state.offScreen,
|
||||
ContextPath,
|
||||
showCode: false
|
||||
}}
|
||||
{...props}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
<Route
|
||||
path={`${ContextPath}/examples`}
|
||||
render={(props: any) => (
|
||||
<Example
|
||||
{...{
|
||||
setNavigations: this.setNavigations,
|
||||
theme: theme.value,
|
||||
classPrefix: theme.ns,
|
||||
viewMode: this.state.viewMode,
|
||||
locale: this.state.locale,
|
||||
offScreen: this.state.offScreen,
|
||||
ContextPath,
|
||||
showCode: false
|
||||
}}
|
||||
{...props}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
<Route
|
||||
path={`${ContextPath}/${locale}/style`}
|
||||
render={(props: any) => (
|
||||
<CSSDocs
|
||||
{...{
|
||||
setNavigations: this.setNavigations,
|
||||
theme: theme.value,
|
||||
classPrefix: theme.ns,
|
||||
viewMode: this.state.viewMode,
|
||||
locale: this.state.locale,
|
||||
offScreen: this.state.offScreen,
|
||||
ContextPath,
|
||||
showCode: false
|
||||
}}
|
||||
{...props}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
<Route
|
||||
render={() => (
|
||||
<div className="Doc-content">
|
||||
<NotFound />
|
||||
</div>
|
||||
)}
|
||||
/>
|
||||
</Switch>
|
||||
</React.Suspense>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
const theme = this.state.theme;
|
||||
const location = this.props.location;
|
||||
@ -552,7 +713,7 @@ export class App extends React.PureComponent<{
|
||||
<>
|
||||
<ToastComponent theme={theme.value} locale={this.state.locale} />
|
||||
<AlertComponent theme={theme.value} locale={this.state.locale} />
|
||||
{React.cloneElement(this.props.children as any, {
|
||||
{/* {React.cloneElement(this.props.children as any, {
|
||||
key: theme.value,
|
||||
...(this.props.children as any).props,
|
||||
setNavigations: this.setNavigations,
|
||||
@ -563,7 +724,8 @@ export class App extends React.PureComponent<{
|
||||
offScreen: this.state.offScreen,
|
||||
ContextPath,
|
||||
showCode: false
|
||||
})}
|
||||
})} */}
|
||||
{this.renderContent()}
|
||||
</>
|
||||
);
|
||||
} else if (/examples/.test(location.pathname)) {
|
||||
@ -597,32 +759,32 @@ export class App extends React.PureComponent<{
|
||||
position="left"
|
||||
>
|
||||
<ul className={`HeaderLinks`}>
|
||||
<Link
|
||||
<NavLink
|
||||
to={`${ContextPath}/zh-CN/docs`}
|
||||
activeClassName="is-active"
|
||||
>
|
||||
文档
|
||||
</Link>
|
||||
</NavLink>
|
||||
|
||||
<Link
|
||||
<NavLink
|
||||
to={`${ContextPath}/zh-CN/components`}
|
||||
activeClassName="is-active"
|
||||
>
|
||||
组件
|
||||
</Link>
|
||||
<Link
|
||||
</NavLink>
|
||||
<NavLink
|
||||
to={`${ContextPath}/zh-CN/style`}
|
||||
activeClassName="is-active"
|
||||
>
|
||||
样式
|
||||
</Link>
|
||||
</NavLink>
|
||||
</ul>
|
||||
{this.renderNavigation()}
|
||||
</Drawer>
|
||||
|
||||
<BackTop />
|
||||
|
||||
{React.cloneElement(this.props.children as any, {
|
||||
{/* {React.cloneElement(this.props.children as any, {
|
||||
key: theme.value,
|
||||
...(this.props.children as any).props,
|
||||
setNavigations: this.setNavigations,
|
||||
@ -632,7 +794,8 @@ export class App extends React.PureComponent<{
|
||||
locale: this.state.locale,
|
||||
offScreen: this.state.offScreen,
|
||||
ContextPath
|
||||
})}
|
||||
})} */}
|
||||
{this.renderContent()}
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
@ -643,35 +806,40 @@ function isActive(link: any, location: any) {
|
||||
return !!(link.path && getPath(link.path) === location.pathname);
|
||||
}
|
||||
|
||||
function navigations2route(navigations) {
|
||||
let routes = [];
|
||||
export function navigations2route(
|
||||
navigations: any,
|
||||
additionalProperties?: any
|
||||
) {
|
||||
let routes: any = [];
|
||||
|
||||
navigations.forEach(root => {
|
||||
navigations.forEach((root: any) => {
|
||||
root.children &&
|
||||
eachTree(root.children, (item: any) => {
|
||||
if (item.path && item.component) {
|
||||
routes.push(
|
||||
<Route
|
||||
key={routes.length + 1}
|
||||
path={
|
||||
item.path[0] === '/'
|
||||
? ContextPath + item.path
|
||||
: `${ContextPath}/${item.path}`
|
||||
}
|
||||
component={item.component}
|
||||
/>
|
||||
);
|
||||
} else if (item.path && item.getComponent) {
|
||||
routes.push(
|
||||
<Route
|
||||
key={routes.length + 1}
|
||||
path={
|
||||
item.path[0] === '/'
|
||||
? ContextPath + item.path
|
||||
: `${ContextPath}/${item.path}`
|
||||
}
|
||||
getComponent={item.getComponent}
|
||||
/>
|
||||
additionalProperties ? (
|
||||
<Route
|
||||
key={routes.length + 1}
|
||||
path={
|
||||
item.path[0] === '/'
|
||||
? ContextPath + item.path
|
||||
: `${ContextPath}/${item.path}`
|
||||
}
|
||||
render={(props: any) => (
|
||||
<item.component {...additionalProperties} {...props} />
|
||||
)}
|
||||
/>
|
||||
) : (
|
||||
<Route
|
||||
key={routes.length + 1}
|
||||
path={
|
||||
item.path[0] === '/'
|
||||
? ContextPath + item.path
|
||||
: `${ContextPath}/${item.path}`
|
||||
}
|
||||
component={item.component}
|
||||
/>
|
||||
)
|
||||
);
|
||||
}
|
||||
});
|
||||
@ -680,80 +848,15 @@ function navigations2route(navigations) {
|
||||
return routes;
|
||||
}
|
||||
|
||||
export default function entry({pathPrefix}) {
|
||||
export default function entry() {
|
||||
// PathPrefix = pathPrefix || DocPathPrefix;
|
||||
const locate = 'zh-CN'; // 暂时不支持切换，因为目前只有中文文档
|
||||
|
||||
return (
|
||||
<Router history={browserHistory}>
|
||||
<Route component={App}>
|
||||
<Redirect
|
||||
from={`${ContextPath}/`}
|
||||
to={`${ContextPath}/${locate}/docs/index`}
|
||||
/>
|
||||
|
||||
{/* docs */}
|
||||
<Redirect
|
||||
from={`${ContextPath}/docs`}
|
||||
to={`${ContextPath}/${locate}/docs/index`}
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/docs/index`}
|
||||
to={`${ContextPath}/${locate}/docs/index`}
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/docs/*`}
|
||||
to={`${ContextPath}/${locate}/docs/*`}
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/${locate}/docs`}
|
||||
to={`${ContextPath}/${locate}/docs/index`}
|
||||
/>
|
||||
|
||||
{/* components */}
|
||||
<Redirect
|
||||
from={`${ContextPath}/components`}
|
||||
to={`${ContextPath}/${locate}/components/page`}
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/components/page`}
|
||||
to={`${ContextPath}/${locate}/components/page`}
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/components/*`}
|
||||
to={`${ContextPath}/${locate}/components/*`}
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/${locate}/components`}
|
||||
to={`${ContextPath}/${locate}/components/page`}
|
||||
/>
|
||||
|
||||
{/* expamles */}
|
||||
<Redirect
|
||||
from={`${ContextPath}/examples`}
|
||||
to={`${ContextPath}/examples/index`}
|
||||
/>
|
||||
<Redirect
|
||||
from={`${ContextPath}/${locate}/style`}
|
||||
to={`${ContextPath}/${locate}/style/index`}
|
||||
/>
|
||||
<Route path={`${ContextPath}/${locate}/docs`} component={Doc}>
|
||||
{navigations2route(DocNavCN)}
|
||||
</Route>
|
||||
<Route
|
||||
path={`${ContextPath}/${locate}/components`}
|
||||
component={Components}
|
||||
>
|
||||
{navigations2route(components)}
|
||||
</Route>
|
||||
<Route path={`${ContextPath}/examples`} component={Example}>
|
||||
{navigations2route(examples)}
|
||||
</Route>
|
||||
<Route path={`${ContextPath}/${locate}/style`} component={CSSDocs}>
|
||||
{navigations2route(cssDocs)}
|
||||
</Route>
|
||||
</Route>
|
||||
|
||||
<Route path="*" component={NotFound} />
|
||||
<Router>
|
||||
<Switch>
|
||||
<Route component={App}></Route>
|
||||
<Route component={NotFound} />
|
||||
</Switch>
|
||||
</Router>
|
||||
);
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,5 +1,12 @@
|
||||
import React from 'react';
|
||||
import {Switch} from 'react-router-dom';
|
||||
import {navigations2route} from './App';
|
||||
import makeMarkdownRenderer from './MdRenderer';
|
||||
function wrapDoc(doc: any) {
|
||||
return {
|
||||
default: makeMarkdownRenderer(doc)
|
||||
};
|
||||
}
|
||||
|
||||
export const cssDocs = [
|
||||
{
|
||||
@ -8,40 +15,30 @@ export const cssDocs = [
|
||||
{
|
||||
label: '快速开始',
|
||||
path: '/zh-CN/style/index',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(['../../docs/zh-CN/style/index.md'], (doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
})
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/style/index.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'CSS 变量',
|
||||
path: '/zh-CN/style/css-vars',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../docs/zh-CN/style/css-vars.md'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/style/css-vars.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '辅助类 - 响应式设计',
|
||||
path: '/zh-CN/style/responsive-design',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../docs/zh-CN/style/responsive-design.md'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/style/responsive-design.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '辅助类 - 状态样式',
|
||||
path: '/zh-CN/style/state',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(['../../docs/zh-CN/style/state.md'], (doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
})
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/style/state.md').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -53,109 +50,75 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Box Sizing',
|
||||
path: '/zh-CN/style/layout/box-sizing',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_box-sizing.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_box-sizing.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Display',
|
||||
path: '/zh-CN/style/layout/display',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_display.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_display.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Floats',
|
||||
path: '/zh-CN/style/layout/floats',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_float.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_float.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Clear',
|
||||
path: '/zh-CN/style/layout/clear',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_clear.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_clear.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Overflow',
|
||||
path: '/zh-CN/style/layout/overflow',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_overflow.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_overflow.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Position',
|
||||
path: '/zh-CN/style/layout/position',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_position.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_position.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Top / Right / Bottom / Left',
|
||||
path: '/zh-CN/style/layout/top-right-bottom-left',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_top-right-bottom-left.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_top-right-bottom-left.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Visibility',
|
||||
path: '/zh-CN/style/layout/visibility',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_visibility.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_visibility.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Z-Index',
|
||||
path: '/zh-CN/style/layout/z-index',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/layout/_z-index.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/layout/_z-index.scss').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -166,73 +129,49 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Flex Direction',
|
||||
path: '/zh-CN/style/flexbox/direction',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/flex/_direction.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/flex/_direction.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Flex Wrap',
|
||||
path: '/zh-CN/style/flexbox/wrap',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/flex/_wrap.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/flex/_wrap.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Flex',
|
||||
path: '/zh-CN/style/flexbox/flex',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/flex/_flex.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/flex/_flex.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Flex Grow',
|
||||
path: '/zh-CN/style/flexbox/grow',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/flex/_grow.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/flex/_grow.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Flex Shrink',
|
||||
path: '/zh-CN/style/flexbox/shrink',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/flex/_shrink.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/flex/_shrink.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Flex Order',
|
||||
path: '/zh-CN/style/flexbox/order',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/flex/_order.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/flex/_order.scss').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -243,87 +182,58 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Grid Template Columns',
|
||||
path: '/zh-CN/style/grid/columns',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/grid/_columns.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/grid/_columns.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Grid Column Start / End',
|
||||
path: '/zh-CN/style/grid/column-start-end',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/grid/_column-start-end.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/grid/_column-start-end.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Grid Template Rows',
|
||||
path: '/zh-CN/style/grid/rows',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/grid/_rows.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/grid/_rows.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Grid Row Start / End',
|
||||
path: '/zh-CN/style/grid/row-start-end',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/grid/_row-start-end.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/grid/_row-start-end.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Grid Auto Flow',
|
||||
path: '/zh-CN/style/grid/auto-flow',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/grid/_auto-flow.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/grid/_auto-flow.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Grid Auto Columns',
|
||||
path: '/zh-CN/style/grid/auto-columns',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/grid/_auto-columns.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/grid/_auto-columns.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Grid Auto Rows',
|
||||
path: '/zh-CN/style/grid/auto-rows',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/grid/_auto-rows.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/grid/_auto-rows.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Gap',
|
||||
path: '/zh-CN/style/grid/gap',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(['../../scss/helper/grid/_gap.scss'], (doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
})
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/grid/_gap.scss').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -333,109 +243,91 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Justify Content',
|
||||
path: '/zh-CN/style/box-alignment/justify-content',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_justify-content.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_justify-content.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Justify Items',
|
||||
path: '/zh-CN/style/box-alignment/justify-items',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_justify-items.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_justify-items.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Justify Self',
|
||||
path: '/zh-CN/style/box-alignment/justify-self',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_justify-self.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_justify-self.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Align Content',
|
||||
path: '/zh-CN/style/box-alignment/align-content',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_align-content.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_align-content.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Align Items',
|
||||
path: '/zh-CN/style/box-alignment/align-items',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_align-items.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_align-items.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Align Self',
|
||||
path: '/zh-CN/style/box-alignment/align-self',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_align-self.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_align-self.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Place Content',
|
||||
path: '/zh-CN/style/box-alignment/place-content',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_place-content.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_place-content.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Place Items',
|
||||
path: '/zh-CN/style/box-alignment/place-items',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_place-items.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_place-items.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Place Self',
|
||||
path: '/zh-CN/style/box-alignment/place-self',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/box-alignment/_place-self.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/box-alignment/_place-self.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -446,37 +338,25 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Padding',
|
||||
path: '/zh-CN/style/spacing/padding',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/spacing/_padding.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/spacing/_padding.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Margin',
|
||||
path: '/zh-CN/style/spacing/margin',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/spacing/_margin.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/spacing/_margin.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Space Between',
|
||||
path: '/zh-CN/style/spacing/space-between',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/spacing/_space-between.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/spacing/_space-between.scss').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -487,24 +367,16 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Width',
|
||||
path: '/zh-CN/style/sizing/width',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/sizing/_width.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/sizing/_width.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Height',
|
||||
path: '/zh-CN/style/sizing/height',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/sizing/_height.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/sizing/_height.scss').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -515,169 +387,123 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Font Family',
|
||||
path: '/zh-CN/style/typography/font-family',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_font-family.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_font-family.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Font Size',
|
||||
path: '/zh-CN/style/typography/font-size',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_font-size.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_font-size.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Font style',
|
||||
path: '/zh-CN/style/typography/font-style',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_font-style.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_font-style.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Font Weight',
|
||||
path: '/zh-CN/style/typography/font-weight',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_font-weight.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_font-weight.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Letter Spacing',
|
||||
path: '/zh-CN/style/typography/letter-spacing',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_letter-spacing.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_letter-spacing.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Line Height',
|
||||
path: '/zh-CN/style/typography/line-height',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_line-height.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_line-height.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'List Style Type',
|
||||
path: '/zh-CN/style/typography/list-style-type',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_list-style-type.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_list-style-type.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Text Alignment',
|
||||
path: '/zh-CN/style/typography/text-align',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_text-align.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_text-align.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Text Color',
|
||||
path: '/zh-CN/style/typography/text-color',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_text-color.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_text-color.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Text Decoration',
|
||||
path: '/zh-CN/style/typography/text-decoration',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_text-decoration.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_text-decoration.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Text Transform',
|
||||
path: '/zh-CN/style/typography/text-transform',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_text-transform.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_text-transform.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Vertical Alignment',
|
||||
path: '/zh-CN/style/typography/vertical-align',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_vertical-align.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_vertical-align.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Whitespace',
|
||||
path: '/zh-CN/style/typography/whitespace',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_whitespace.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_whitespace.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Word Break',
|
||||
path: '/zh-CN/style/typography/word-break',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/typography/_word-break.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/typography/_word-break.scss').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -688,13 +514,11 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Background Color',
|
||||
path: '/zh-CN/style/background/background-color',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/background/_background-color.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/background/_background-color.scss').then(
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -705,49 +529,33 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Border Radius',
|
||||
path: '/zh-CN/style/border/border-radius',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/border/_border-radius.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/border/_border-radius.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Border Width',
|
||||
path: '/zh-CN/style/border/border-width',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/border/_border-width.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/border/_border-width.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Border Color',
|
||||
path: '/zh-CN/style/border/border-color',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/border/_border-color.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/border/_border-color.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Border Style',
|
||||
path: '/zh-CN/style/border/border-style',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/border/_border-style.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/border/_border-style.scss').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -758,25 +566,17 @@ export const cssDocs = [
|
||||
{
|
||||
label: 'Box Shadow',
|
||||
path: '/zh-CN/style/effect/box-shadow',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/effect/_box-shadow.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/effect/_box-shadow.scss').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: 'Opacity',
|
||||
path: '/zh-CN/style/effect/opacity',
|
||||
getComponent: (location: any, cb: any) =>
|
||||
(require as any)(
|
||||
['../../scss/helper/effect/_opacity.scss'],
|
||||
(doc: any) => {
|
||||
cb(null, makeMarkdownRenderer(doc));
|
||||
}
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../scss/helper/effect/_opacity.scss').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -793,16 +593,23 @@ export default class CSSDocs extends React.PureComponent<any> {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
{React.cloneElement(this.props.children as any, {
|
||||
...(this.props.children as any).props,
|
||||
<Switch>
|
||||
{navigations2route(cssDocs, {
|
||||
theme: this.props.theme,
|
||||
classPrefix: this.props.classPrefix,
|
||||
locale: this.props.locale,
|
||||
viewMode: this.props.viewMode,
|
||||
offScreen: this.props.offScreen
|
||||
})}
|
||||
</>
|
||||
{/* {React.cloneElement(this.props.children as any, {
|
||||
...(this.props.children as any).props,
|
||||
theme: this.props.theme,
|
||||
classPrefix: this.props.classPrefix,
|
||||
locale: this.props.locale,
|
||||
viewMode: this.props.viewMode,
|
||||
offScreen: this.props.offScreen
|
||||
})} */}
|
||||
</Switch>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,10 +1,12 @@
|
||||
import React from 'react';
|
||||
import {Switch} from 'react-router-dom';
|
||||
|
||||
import {flattenTree, filterTree, mapTree} from '../../src/utils/helper';
|
||||
import {navigations2route} from './App';
|
||||
|
||||
import DocNavCN from './DocNavCN';
|
||||
|
||||
export default class Doc extends React.PureComponent {
|
||||
export default class Doc extends React.PureComponent<any> {
|
||||
state = {
|
||||
prevDoc: null,
|
||||
nextDoc: null
|
||||
@ -29,7 +31,7 @@ export default class Doc extends React.PureComponent {
|
||||
this.setDocFooter();
|
||||
}
|
||||
|
||||
componentDidUpdate(preProps) {
|
||||
componentDidUpdate(preProps: any) {
|
||||
if (this.props.location.pathname !== preProps.location.pathname) {
|
||||
this.props.setNavigations(DocNavCN, false);
|
||||
this.setDocFooter();
|
||||
@ -37,11 +39,11 @@ export default class Doc extends React.PureComponent {
|
||||
}
|
||||
|
||||
setDocFooter() {
|
||||
const newDocs = mapTree(DocNavCN, doc => ({
|
||||
const newDocs = mapTree(DocNavCN, (doc: any) => ({
|
||||
...doc,
|
||||
children:
|
||||
Array.isArray(doc.children) && doc.children.length
|
||||
? doc.children.map(item => ({
|
||||
? doc.children.map((item: any) => ({
|
||||
...item,
|
||||
group: doc.group || doc.label
|
||||
}))
|
||||
@ -59,9 +61,8 @@ export default class Doc extends React.PureComponent {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
{React.cloneElement(this.props.children, {
|
||||
...this.props.children.props,
|
||||
<Switch>
|
||||
{navigations2route(DocNavCN, {
|
||||
theme: this.props.theme,
|
||||
classPrefix: this.props.classPrefix,
|
||||
locale: this.props.locale,
|
||||
@ -71,7 +72,19 @@ export default class Doc extends React.PureComponent {
|
||||
prevDoc: this.state.prevDoc,
|
||||
nextDoc: this.state.nextDoc
|
||||
})}
|
||||
</>
|
||||
|
||||
{/* {React.cloneElement(this.props.children, {
|
||||
...this.props.children.props,
|
||||
theme: this.props.theme,
|
||||
classPrefix: this.props.classPrefix,
|
||||
locale: this.props.locale,
|
||||
viewMode: this.props.viewMode,
|
||||
offScreen: this.props.offScreen,
|
||||
ContextPath: this.props.ContextPath,
|
||||
prevDoc: this.state.prevDoc,
|
||||
nextDoc: this.state.nextDoc
|
||||
})} */}
|
||||
</Switch>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,4 +1,10 @@
|
||||
import React from 'react';
|
||||
import makeMarkdownRenderer from './MdRenderer';
|
||||
function wrapDoc(doc: any) {
|
||||
return {
|
||||
default: makeMarkdownRenderer(doc)
|
||||
};
|
||||
}
|
||||
|
||||
export default [
|
||||
{
|
||||
@ -8,35 +14,33 @@ export default [
|
||||
{
|
||||
label: '介绍',
|
||||
path: '/zh-CN/docs/index',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/index.md').then(makeMarkdownRenderer)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/index.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: '快速开始',
|
||||
path: '/zh-CN/docs/start/getting-started',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/start/getting-started.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/start/getting-started.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: '1.2.0 版本变更',
|
||||
path: '/zh-CN/docs/start/1-2-0',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/start/1-2-0.md').then(makeMarkdownRenderer)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/start/1-2-0.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
|
||||
{
|
||||
label: '常见问题',
|
||||
path: '/zh-CN/docs/start/faq',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/start/faq.md').then(makeMarkdownRenderer)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/start/faq.md').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -47,74 +51,60 @@ export default [
|
||||
{
|
||||
label: '配置与组件',
|
||||
path: '/zh-CN/docs/concepts/schema',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/concepts/schema.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/concepts/schema.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '数据域与数据链',
|
||||
path: '/zh-CN/docs/concepts/datascope-and-datachain',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/concepts/datascope-and-datachain.md').then(
|
||||
makeMarkdownRenderer
|
||||
wrapDoc
|
||||
)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '模板',
|
||||
path: '/zh-CN/docs/concepts/template',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/concepts/template.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/concepts/template.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '数据映射',
|
||||
path: '/zh-CN/docs/concepts/data-mapping',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/concepts/data-mapping.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/concepts/data-mapping.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '表达式',
|
||||
path: '/zh-CN/docs/concepts/expression',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/concepts/expression.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/concepts/expression.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '联动',
|
||||
path: '/zh-CN/docs/concepts/linkage',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/concepts/linkage.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/concepts/linkage.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '行为',
|
||||
path: '/zh-CN/docs/concepts/action',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/concepts/action.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/concepts/action.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '样式',
|
||||
path: '/zh-CN/docs/concepts/style',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/concepts/style.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/concepts/style.md').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -125,36 +115,30 @@ export default [
|
||||
{
|
||||
label: 'SchemaNode',
|
||||
path: '/zh-CN/docs/types/schemanode',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/types/schemanode.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/types/schemanode.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'ClassName',
|
||||
path: '/zh-CN/docs/types/classname',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/types/classname.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/types/classname.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'API',
|
||||
path: '/zh-CN/docs/types/api',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/types/api.md').then(makeMarkdownRenderer)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/types/api.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: 'Definitions',
|
||||
path: '/zh-CN/docs/types/definitions',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/types/definitions.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/types/definitions.md').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -165,84 +149,72 @@ export default [
|
||||
{
|
||||
label: '工作原理',
|
||||
path: '/zh-CN/docs/extend/internal',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/internal.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/internal.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '自定义组件 - SDK',
|
||||
path: '/zh-CN/docs/extend/custom-sdk',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/custom-sdk.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/custom-sdk.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '自定义组件 - React',
|
||||
path: '/zh-CN/docs/extend/custom-react',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/custom-react.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/custom-react.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '将 amis 当成 UI 库用',
|
||||
path: '/zh-CN/docs/extend/ui-library',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/ui-library.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/ui-library.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '扩展现有组件',
|
||||
path: '/zh-CN/docs/extend/addon',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/addon.md').then(makeMarkdownRenderer)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/addon.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '页面交互行为跟踪',
|
||||
path: '/zh-CN/docs/extend/tracker',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/tracker.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/tracker.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '调试工具',
|
||||
path: '/zh-CN/docs/extend/debug',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/debug.md').then(makeMarkdownRenderer)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/debug.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '移动端定制',
|
||||
path: '/zh-CN/docs/extend/mobile',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/mobile.md').then(makeMarkdownRenderer)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/mobile.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '多语言',
|
||||
path: '/zh-CN/docs/extend/i18n',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/i18n.md').then(makeMarkdownRenderer)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/i18n.md').then(wrapDoc)
|
||||
)
|
||||
},
|
||||
{
|
||||
label: '如何贡献代码',
|
||||
path: '/zh-CN/docs/extend/contribute',
|
||||
getComponent: () =>
|
||||
// @ts-ignore
|
||||
import('../../docs/zh-CN/extend/contribute.md').then(
|
||||
makeMarkdownRenderer
|
||||
)
|
||||
component: React.lazy(() =>
|
||||
import('../../docs/zh-CN/extend/contribute.md').then(wrapDoc)
|
||||
)
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -99,6 +99,8 @@ import Tab3Schema from './Tabs/Tab3';
|
||||
import TestComponent from './Test';
|
||||
|
||||
import {normalizeLink} from '../../src/utils/normalizeLink';
|
||||
import {Switch} from 'react-router-dom';
|
||||
import {navigations2route} from './App';
|
||||
|
||||
export const examples = [
|
||||
{
|
||||
@ -698,16 +700,23 @@ export default class Example extends React.PureComponent {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
{React.cloneElement(this.props.children, {
|
||||
<Switch>
|
||||
{/* {React.cloneElement(this.props.children, {
|
||||
...this.props.children.props,
|
||||
theme: this.props.theme,
|
||||
classPrefix: this.props.classPrefix,
|
||||
locale: this.props.locale,
|
||||
viewMode: this.props.viewMode,
|
||||
offScreen: this.props.offScreen
|
||||
})} */}
|
||||
{navigations2route(examples, {
|
||||
theme: this.props.theme,
|
||||
classPrefix: this.props.classPrefix,
|
||||
locale: this.props.locale,
|
||||
viewMode: this.props.viewMode,
|
||||
offScreen: this.props.offScreen
|
||||
})}
|
||||
</>
|
||||
</Switch>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@ -9,7 +9,7 @@ import Overlay from '../../src/components/Overlay';
|
||||
import PopOver from '../../src/components/PopOver';
|
||||
import NestedLinks from '../../src/components/AsideNav';
|
||||
import classnames from 'classnames';
|
||||
import {Link} from 'react-router';
|
||||
import {Link} from 'react-router-dom';
|
||||
import Play from './Play';
|
||||
|
||||
class CodePreview extends React.Component<any> {
|
||||
@ -157,7 +157,7 @@ class Preview extends React.Component {
|
||||
}
|
||||
}
|
||||
|
||||
export default function (doc) {
|
||||
export default function (doc: any) {
|
||||
return class extends React.Component {
|
||||
popoverDom = null;
|
||||
|
||||
|
||||
@ -280,7 +280,7 @@ export default class PlayGround extends React.Component {
|
||||
const query = props.location.query;
|
||||
|
||||
try {
|
||||
const scope = query.scope || props.scope;
|
||||
const scope = props.scope;
|
||||
|
||||
if (scope && scopes[scope]) {
|
||||
schemaContent = scopes[scope].replace(
|
||||
|
||||
@ -119,7 +119,7 @@
|
||||
"@types/react-dom": "^16.0.7",
|
||||
"@types/react-dropzone": "^5.1.0",
|
||||
"@types/react-onclickoutside": "^6.0.2",
|
||||
"@types/react-router": "^3.0.24",
|
||||
"@types/react-router-dom": "^5.3.3",
|
||||
"@types/react-test-renderer": "^16.8.1",
|
||||
"@types/react-transition-group": "4.4.3",
|
||||
"@types/sortablejs": "^1.3.32",
|
||||
@ -163,7 +163,8 @@
|
||||
"prettier": "^2.4.1",
|
||||
"pretty-quick": "^3.1.1",
|
||||
"prismjs": "^1.25.0",
|
||||
"react-router": "3.2.0",
|
||||
"react-router": "^5.2.1",
|
||||
"react-router-dom": "5.3.0",
|
||||
"react-test-renderer": "^16.8.6",
|
||||
"ts-jest": "^27.0.5",
|
||||
"ts-json-schema-generator": "0.96.0",
|
||||
|
||||
@ -20,7 +20,7 @@ export class NotFound extends React.Component<NotFoundProps, any> {
|
||||
const {links, footerText, description, children, code} = this.props;
|
||||
|
||||
return (
|
||||
<div className="container w-xxl w-auto-xs">
|
||||
<div className="container w-xxl w-auto-xs m-auto">
|
||||
<div className="text-center m-b-lg">
|
||||
<h1 className="text-shadow text-white">{code || '404'}</h1>
|
||||
{description ? (
|
||||
|
||||
5
types/custom/index.d.ts
vendored
5
types/custom/index.d.ts
vendored
@ -7,3 +7,8 @@ declare module '*.md' {
|
||||
const content: any;
|
||||
export default content;
|
||||
}
|
||||
|
||||
declare module '*.scss' {
|
||||
const content: any;
|
||||
export default content;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user