doc: 添加 typedoc 和 docusaurus

.gitignore

@@ -88,6 +88,10 @@ dist
 # https://nextjs.org/blog/next-9-1#public-directory-support
 # public
 
+# Docusaurus
+.Docusaurus
+website/build
+
 # vuepress build output
 .vuepress/dist
 
@@ -102,3 +106,7 @@ dist
 
 # TernJS port file
 .tern-port
+
+# Other
+.DS_Store
+.temp

README.md

@@ -1,29 +1,32 @@
 <div align="center">
-    <h1>Taro3 UI</h1>
+    <h1>TaroX UI</h1>
 </div>
 <div align="center">
-    <strong>我们重新发明了 taro-ui</strong>
+    <strong>我们重新(zào)发(lún)明(zi)了 <a href="https://github.com/NervJS/taro-ui" target="_blank">Taro UI</a></strong>
 </div>
 
 <br />
 
 <div align="center">
     <a href="https://github.com/tarojsx/ui/blob/master/LICENSE">
-        <img src="https://img.shields.io/github/license/tarojsx/ui.svg" alt="License" />
+        <img src="https://badgen.net/github/license/tarojsx/ui" alt="License" />
     </a>
     <a href="https://www.npmjs.com/package/@tarojsx/ui">
-        <img src="https://img.shields.io/npm/v/@tarojsx/ui.svg" alt="npm version" />
+        <img src="https://npm.taobao.org/badge/v/@tarojsx/ui.svg" alt="npm version" />
     </a>
     <a href="https://www.npmjs.com/org/tarojsx">
-        <img src="https://img.shields.io/npm/dm/@tarojsx/ui.svg" alt="npm downloads" />
+        <img src="https://npm.taobao.org/badge/d/@tarojsx/ui.svg" alt="npm downloads" />
+    </a>
+    <a href="https://github.com/tarojsx/ui/blob/master/package.json">
+        <img src="https://badgen.net/github/dependents-pkg/tarojsx/ui" alt="npm downloads" />
     </a>
     <a href="http://makeapullrequest.com">
-        <img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square" alt="PRs welcome" />
+        <img src="https://badgen.net/badge/PRs/welcome/green" alt="PRs welcome" />
     </a>
 </div>
 
 <div align="center">
-    <sub>Built with :purple_heart: by
+    <sub>Built with :purple_heart: by</sub>
     <a href="https://github.com/cncolder">@Colder</a> and
     <a href="https://github.com/tarojsx/ui/graphs/contributors">
         Contributors
@@ -37,11 +40,11 @@
 
 _当前代码提交频繁, 一些特性时有变化._
 
-Taro3 释放了 React 的潜能, 是时候对 [Taro UI](https://github.com/NervJS/taro-ui) 进行改进了.
+Taro3 释放了 React 的潜能, 是时候对 Taro UI 进行改进了.
 
 ## 特性
 
-- :electric_plug: 安装方式不变, 使用上尽可能向后兼容.
+- :electric_plug: 一键安装, 使用上尽可能向后兼容.
 
 - :clapper: 复用 taro-ui 样式, 不改变组件外观.
 
@@ -55,7 +58,8 @@ Taro3 释放了 React 的潜能, 是时候对 [Taro UI](https://github.com/NervJ
 
 ## 需求
 
-* taro3+
+* taro 3+
+* react 16.8+
 
 ## 安装
 

babel.config.js

@@ -0,0 +1,13 @@
+// babel-preset-taro 更多选项和默认值：
+// https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md
+module.exports = {
+    presets: [
+        [
+            'taro',
+            {
+                framework: 'react',
+                ts: true,
+            },
+        ],
+    ],
+}

config/dev.js

@@ -0,0 +1,8 @@
+const webpack = require('webpack')
+const webpackChain = require('webpack-chain')
+
+module.exports = {
+    env: {
+        NODE_ENV: '"development"',
+    },
+}

config/index.js

@@ -0,0 +1,59 @@
+/// <reference types="webpack" />
+/// <reference types="webpack-chain" />
+
+const path = require('path')
+const util = require('util')
+const webpack = require('webpack')
+const webpackChain = require('webpack-chain')
+// const DashboardPlugin = require('webpack-dashboard/plugin')
+// const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
+// const { TaroProvidePlugin } = require('@tarojsx/polyfill/dist/plugins')
+
+// @ts-ignore
+const log = (...args) => console.log(...args.map(arg => util.inspect(arg, { depth: null })))
+
+const config = {
+    projectName: '@tarojsx/ui',
+    framework: 'react',
+    date: '2020-03-20',
+    designWidth: 750,
+    deviceRatio: {
+        640: 2.34 / 2,
+        750: 1,
+        828: 1.81 / 2,
+    },
+    sourceRoot: 'website/src',
+    outputRoot: 'website/build/preview',
+    copy: {
+        patterns: [
+            // { from: 'src/sitemap.json', to: 'dist/sitemap.json' },
+        ],
+    },
+    alias: {},
+    env: {},
+    defineConstants: {},
+    h5: {
+        publicPath: '/',
+        staticDirectory: 'static',
+        postcss: {
+            autoprefixer: {
+                enable: true,
+                config: {},
+            },
+            cssModules: {
+                enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
+                config: {
+                    namingPattern: 'module', // 转换模式，取值为 global/module
+                    generateScopedName: '[name]__[local]___[hash:base64:5]',
+                },
+            },
+        },
+    },
+}
+
+module.exports = function(merge) {
+    if (process.env.NODE_ENV === 'development') {
+        return merge({}, config, require('./dev'))
+    }
+    return merge({}, config, require('./prod'))
+}

config/prod.js

@@ -0,0 +1,12 @@
+const util = require('util')
+const webpack = require('webpack')
+const webpackChain = require('webpack-chain')
+
+// @ts-ignore
+const log = (...args) => console.log(...args.map(arg => util.inspect(arg, { depth: null })))
+
+module.exports = {
+    env: {
+        NODE_ENV: '"production"',
+    },
+}

docs/components.md

@@ -0,0 +1,14 @@
+---
+id: components
+title: 组件说明
+---
+
+## 命名
+
+取 `taro-ui` 组件名, 去掉 `At` 前缀.
+
+如需使用 `taro-ui` 原有的命名规则, 可以 `import { AtButton } from '@tarojsx/ui/dist/taro-ui`
+
+## 样式
+
+组件自动导入所需的样式, 无需重复导入.

docs/components/Button.mdx

@@ -0,0 +1,79 @@
+---
+id: button
+title: Button
+sidebar_label: Button
+---
+
+## Hello from Docusaurus
+
+Are you ready to create the documentation site for your open source project?
+
+### type
+
+import { Button } from '../../../src/Button'
+
+```tsx
+<Button>default</Button>
+
+<Button type="primary">primary</Button>
+
+<Button type="secondary">secondary</Button>
+
+<Button type="warn">warn</Button>
+
+<Button type="error">error</Button>
+```
+
+export const Highlight = ({ children, color }) => (
+    <span
+        style={{
+            backgroundColor: color,
+            borderRadius: '2px',
+            color: '#fff',
+            padding: '0.2rem',
+        }}
+    >
+        {children}
+    </span>
+)
+
+<Highlight color="#25c2a0">Docusaurus green</Highlight> and
+<Highlight color="#1877F2">Facebook blue</Highlight> are my favorite colors.
+
+I can write **Markdown** alongside my _JSX_!
+
+```tsx live
+function Clock(props) {
+    const [date, setDate] = useState(new Date())
+    useEffect(() => {
+        var timerID = setInterval(() => tick(), 1000)
+
+        return function cleanup() {
+            clearInterval(timerID)
+        }
+    })
+
+    function tick() {
+        setDate(new Date())
+    }
+
+    return (
+        <div>
+            <h2>It is {date.toLocaleTimeString()}.</h2>
+        </div>
+    )
+}
+```
+
+:::note
+The content and title _can_ include markdown.
+:::
+
+:::tip 提示
+The content and title _can_ include markdown.
+:::
+
+## API
+
+-   [`<Button />`](modules/_button_.md)
+-   [`ButtonProps`](interfaces/_button_.buttonprops.md)

docs/globals.md

@@ -0,0 +1,49 @@
+---
+id: "globals"
+title: "@tarojsx/ui"
+sidebar_label: "Globals"
+---
+
+## Index
+
+### Modules
+
+* ["ActionSheet"](modules/_actionsheet_.md)
+* ["ActivityIndicator"](modules/_activityindicator_.md)
+* ["Avatar"](modules/_avatar_.md)
+* ["Badge"](modules/_badge_.md)
+* ["Button"](modules/_button_.md)
+* ["Calendar/body/index"](modules/_calendar_body_index_.md)
+* ["Calendar/body/interface"](modules/_calendar_body_interface_.md)
+* ["Calendar/common/constant"](modules/_calendar_common_constant_.md)
+* ["Calendar/common/helper"](modules/_calendar_common_helper_.md)
+* ["Calendar/common/plugins"](modules/_calendar_common_plugins_.md)
+* ["Calendar/controller/index"](modules/_calendar_controller_index_.md)
+* ["Calendar/controller/interface"](modules/_calendar_controller_interface_.md)
+* ["Calendar/index"](modules/_calendar_index_.md)
+* ["Calendar/interface"](modules/_calendar_interface_.md)
+* ["Calendar/ui/date-list/index"](modules/_calendar_ui_date_list_index_.md)
+* ["Calendar/ui/day-list/index"](modules/_calendar_ui_day_list_index_.md)
+* ["CustomTabBar"](modules/_customtabbar_.md)
+* ["FloatLayout"](modules/_floatlayout_.md)
+* ["Form"](modules/_form_.md)
+* ["Icon"](modules/_icon_.md)
+* ["ImagePicker"](modules/_imagepicker_.md)
+* ["Input"](modules/_input_.md)
+* ["List"](modules/_list_.md)
+* ["ListHeader"](modules/_listheader_.md)
+* ["ListItem"](modules/_listitem_.md)
+* ["Loading"](modules/_loading_.md)
+* ["Message"](modules/_message_.md)
+* ["Modal"](modules/_modal_.md)
+* ["Progress"](modules/_progress_.md)
+* ["Statistic"](modules/_statistic_.md)
+* ["Steps"](modules/_steps_.md)
+* ["TabBar"](modules/_tabbar_.md)
+* ["Tabs"](modules/_tabs_.md)
+* ["TabsPane"](modules/_tabspane_.md)
+* ["Tag"](modules/_tag_.md)
+* ["Textarea"](modules/_textarea_.md)
+* ["index"](modules/_index_.md)
+* ["taro-ui"](modules/_taro_ui_.md)
+* ["utils"](modules/_utils_.md)