docs: update

Author: ulivz

docs/.vuepress/config.js

@@ -4,8 +4,14 @@ module.exports = {
   themeConfig: {
     repo: 'ulivz/vuepress-plugin-blog',
     nav: [
-      { text: 'Config', link: '/config/' }
-    ]
-  }
+      { text: 'Config', link: '/config/' },
+      { text: 'Components', link: '/components/' },
+    ],
+    sidebarDepth: 3,
+    sidebar: [
+      '/config/',
+      '/pagination/'
+    ],
+  },
 }
 

docs/README.md

@@ -1,5 +1,6 @@
 ---
 sidebar: auto
+title: Getting Started
 ---
 
 # @vuepress/plugin-blog
@@ -50,8 +51,10 @@ Directory Classifier, that classifies the source pages placed in a same director
 Suppose you have the following files structure:
 
 ```vue
-. └── _posts    ├── 2018-4-4-intro-to-vuepress.md    └──
-2019-6-8-intro-to-vuepress-next.md
+.
+└── _posts    
+    ├── 2018-4-4-intro-to-vuepress.md    
+    └── 2019-6-8-intro-to-vuepress-next.md
 ```
 
 In the traditional VuePress site, the converted page URLs will be:

docs/classifier/README.md

@@ -0,0 +1,39 @@
+# Components
+
+## `<SimplePagination>`
+
+- Using it at your layout component:
+
+```vue
+<template>
+  <SimplePagination />
+</template>
+
+<script>
+import { SimplePagination } from '@vuepress/plugin-blog/lib/client/components'
+export default {
+  components: {
+    SimplePagination
+  }
+}
+</script>
+```
+
+## `<Pagination>`
+
+- Using it at your layout component:
+
+```vue
+<template>
+  <Pagination />
+</template>
+
+<script>
+import { Pagination } from '@vuepress/plugin-blog/lib/client/components'
+export default {
+  components: {
+    Pagination
+  }
+}
+</script>
+```

docs/components/README.md

@@ -1,7 +1,3 @@
----
-sidebar: auto
----
-
 # Config
 
 ## directories
@@ -93,14 +89,85 @@ For more details about permalinks, please head to [Permalinks](https://v1.vuepre
 ### pagination
 
 - Type: `Pagination`
-- Default: `{ perPagePosts: 10 }`
+- Default: `{ lengthPerPage: 10 }`
 - Required: `false`
 
-All available options of pagination are as follows:
-
-- pagination.perPagePosts: Maximum number of posts per page.
-- pagination.pagesSorter: Maximum number of posts per page.
+Please head to [Pagination Config](../pagination/README.md#config) section to get all available options.
 
 ## frontmatters
 
-> TODO, contribution welcome.
+### id
+
+- Type: `string`
+- Default: `undefined`
+- Required: `true`
+
+Unique id for current classifier, e.g. `tag`.
+
+### keys
+
+- Type: `string`
+- Default: `undefined`
+- Required: `true`
+
+Frontmatter keys used to classify pages.
+
+You can also merge multiple tags with the same meaning, e.g.
+
+```js
+module.exports = {
+  plugins: [
+    ['@vuepress/plugin-blog', {
+      frontmatters: [
+        {
+          id: "tag",
+          keys: ['tag', 'tags'],
+        },
+      ]
+    }],
+  ],
+}
+```
+
+### path
+
+- Type: `string`
+- Default: `/${id}/`
+- Required: `false`
+
+Entry page for current classifier, e.g. `/` or `/post/`.
+
+
+### path
+
+- Type: `string`
+- Default: `/${id}/`
+- Required: `false`
+
+Entry page for current classifier, e.g. `/` or `/post/`.
+
+
+### layout
+
+- Type: `string`
+- Default: `'IndexPost' || 'Layout'`
+- Required: `false`
+
+Layout component name for entry page.
+
+
+### frontmatter
+
+- Type: `Record<string, any>`
+- Default: `{}`
+- Required: `false`
+
+[Frontmatter](https://v1.vuepress.vuejs.org/guide/frontmatter.html) for entry page.
+
+### pagination
+
+- Type: `Pagination`
+- Default: `{ lengthPerPage: 10 }`
+- Required: `false`
+
+Please head to [Pagination Config](../pagination/README.md#config) section to get all available options.

docs/config/README.md

@@ -0,0 +1,92 @@
+# Pagination
+
+## Config
+
+### sorter
+
+- Type: string
+- Default: `See Below`
+
+Sorter for matched pages, the default sorter is as follows:
+
+```typescript
+function sorter(prev: VuePressPage, next: VuePressPage){
+  const prevTime = new Date(prev.frontmatter.date).getTime()
+  const nextTime = new Date(next.frontmatter.date).getTime()
+  return prevTime - nextTime > 0 ? -1 : 1
+},
+```
+
+### lengthPerPage
+
+- Type: string
+- Default: `10`
+
+Maximum number of posts per page.
+
+### layout
+
+- Type: string
+- Default: `DirectoryPagination || Layout`
+
+Layout for pagination page (Except the index page.)
+
+### getPaginationPageUrl
+
+- Type: string
+- Default: `See Below`
+
+A function to get the url of pagination page dynamically:
+
+```js
+function getPaginationPageUrl(index) {
+  if (index === 0) {
+    return indexPath
+  }
+  return `${indexPath}page/${index + 1}/`
+}
+```
+
+- For [directory classifier](../README.md#directory-classifier), the `indexPath` defaults to `/${classifier.id}/` (e.g
+. `/post/`)
+- For [frontmatter classifier](../README.md#frontmatter-classifier), the `indexPath` defaults to `/${classifier
+.pid}/${classifier.id}` (e.g. 
+`/tag/js/`)
+
+
+## Client API
+
+### $pagination
+
+#### $pagination.pages
+
+Matched pages for current route.
+
+#### $pagination.length
+
+Length of current paginations.
+
+#### $pagination.hasPrev
+
+Whether previous pagination page exists.
+
+#### $pagination.prevLink
+
+Link of previous pagination page.
+
+#### $pagination.hasNext
+
+Whether next pagination page exists.
+
+#### $pagination.nextLink
+
+Link of next pagination page.
+
+#### $pagination.getSpecificPageLink
+
+Get specific pagination page via page number.
+
+
+
+
+