feat: use vuepress instead of docute

Author: abichinger

core/src/index.js

@@ -1,16 +1,19 @@
 // Import vue component
+import util from './util'
 import component from './core.vue';
 
 // Declare install function executed by Vue.use()
 export function install(Vue) {
 	if (install.installed) return;
 	install.installed = true;
-	Vue.component('VueCron', component);
+	Vue.component('CronCore', component);
 }
 
 // Create module definition for Vue.use()
 const plugin = {
 	install,
+	component,
+	util
 };
 
 // Auto-install when vue is found (eg. in browser via <script> tag)
@@ -25,4 +28,4 @@ if (GlobalVue) {
 }*/
 
 // To allow use as module (npm/webpack/etc.) export component
-export default component;
+export default plugin;

docs/.gitignore

@@ -1,3 +1,14 @@
-.vscode
+pids
+logs
 node_modules
-dist
+npm-debug.log
+coverage/
+run
+dist
+.DS_Store
+.nyc_output
+.basement
+config.local.js
+basement_dist
+.cache
+.temp

docs/README.md

@@ -1,17 +1,24 @@
 {
   "name": "@vue-js-cron/docs",
-  "version": "1.0.0",
-  "description": "Documentation for renderless Vue.js cron editor.",
+  "version": "0.0.1",
+  "description": "vue-js-cron documentation",
+  "main": "index.js",
+  "authors": {
+    "name": "Andreas Bichinger",
+    "email": "andreas.bichinger@gmail.com"
+  },
+  "repository": "https://github.com/abichinger/vue-js-cron/@vue-js-cron/docs",
   "scripts": {
-    "start": "yarn run serve ."
+    "dev": "vuepress dev src",
+    "build": "vuepress build src"
   },
-  "author": "Andreas Bichinger",
   "license": "MIT",
   "devDependencies": {
-    "serve": "^13.0.2"
+    "vuepress": "^1.8.2"
   },
   "dependencies": {
-    "@vue-js-cron/core": "^1.0.0",
-    "@vue-js-cron/vuetify": "^1.0.0"
+    "@vue-js-cron/core": "1.0.0",
+    "@vue-js-cron/vuetify": "1.0.0",
+    "buefy": "^0.9.13"
   }
 }

docs/index.html

@@ -0,0 +1,19 @@
+<template>
+  <selection-grid v-model="value" :items="items">
+  </selection-grid>
+</template>
+
+<script>
+import core from '@vue-js-cron/core'
+const {util} = core
+
+export default {
+  data() {
+    let a = new Array(60).fill(0)
+    return {
+      value: undefined,
+      items: a.map((_, i) => {return {value: i, text: util.pad(i, 2)}}) 
+    }
+  },
+}
+</script>

docs/package.json

@@ -0,0 +1,70 @@
+<template>
+  <div class="is-flex is-flex-wrap-wrap">
+    <div v-for="item in items" class="flex-shrink has-text-centered p-2" :class="{...columnClasses, 'selected-value': isSelected(item)}" :key="item[valueKey]" @click="select(item)">{{item[textKey]}}</div>
+    <div class="column flex-grow"></div> 
+  </div>
+</template>
+
+<script>
+  export default {
+    props: {
+      multiple: {
+        type: Boolean,
+        default: false
+      },
+      value: {
+        default: function(){
+          return (this.multiple) ? [] : undefined
+        }
+      },
+      items:{
+        type: Array,
+        default: () => []
+      },
+      textKey:{
+        type: String,
+        default: 'text'
+      },
+      valueKey:{
+        type: String,
+        default: 'value'
+      },
+      columnClasses: {
+        type: Object,
+        default: () => {}
+      },
+    },
+    data() {
+      return {}
+    },
+    methods:{
+      select(item){
+        console.log('select', item)
+        if(this.multiple){
+          let value = this.value.slice()
+          value.append(item.value)
+          this.$emit('input', value)
+        }
+        else{
+          this.$emit('input', item.value)
+        }
+      },
+      isSelected(item){
+        if(this.multiple){
+          return this.value.includes(item.value)
+        }
+        else{
+          return this.value === item.value
+        }
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+.selected-value {
+  background-color: blue;
+}
+
+</style>

docs/src/.vuepress/components/example/selection-grid.vue

@@ -0,0 +1,70 @@
+const { description } = require('../../package')
+
+module.exports = {
+  /**
+   * Ref：https://v1.vuepress.vuejs.org/config/#title
+   */
+  title: 'Vue-js-cron Docs',
+  /**
+   * Ref：https://v1.vuepress.vuejs.org/config/#description
+   */
+  description: description,
+
+  /**
+   * Extra tags to be injected to the page HTML `<head>`
+   *
+   * ref：https://v1.vuepress.vuejs.org/config/#head
+   */
+  head: [
+    ['meta', { name: 'theme-color', content: '#3eaf7c' }],
+    ['meta', { name: 'apple-mobile-web-app-capable', content: 'yes' }],
+    ['meta', { name: 'apple-mobile-web-app-status-bar-style', content: 'black' }]
+  ],
+
+  /**
+   * Theme configuration, here is the default theme configuration for VuePress.
+   *
+   * ref：https://v1.vuepress.vuejs.org/theme/default-theme-config.html
+   */
+  themeConfig: {
+    repo: '',
+    editLinks: false,
+    docsDir: '',
+    editLinkText: '',
+    lastUpdated: false,
+    nav: [
+      {
+        text: 'Guide',
+        link: '/guide/',
+      },
+      {
+        text: 'Config',
+        link: '/config/'
+      },
+      {
+        text: 'VuePress',
+        link: 'https://v1.vuepress.vuejs.org'
+      }
+    ],
+    sidebar: {
+      '/guide/': [
+        {
+          title: 'Guide',
+          collapsable: false,
+          children: [
+            '',
+            'getting-started',
+          ]
+        }
+      ],
+    }
+  },
+
+  /**
+   * Apply plugins，ref：https://v1.vuepress.vuejs.org/zh/plugin/
+   */
+  plugins: [
+    '@vuepress/plugin-back-to-top',
+    '@vuepress/plugin-medium-zoom',
+  ]
+}

docs/src/.vuepress/components/selection-grid.vue

@@ -0,0 +1,20 @@
+import Buefy from 'buefy'
+import 'buefy/dist/buefy.css'
+import CronCore from '@vue-js-cron/core'
+import CronVuetify from '@vue-js-cron/vuetify'
+import Vuetify from "vuetify";
+import "vuetify/dist/vuetify.min.css";
+import "@vue-js-cron/vuetify/dist/dist/vuetify.min.css"
+
+export default ({
+  Vue, // the version of Vue being used in the VuePress app
+  options, // the options for the root Vue instance
+  router, // the router instance for the app
+  siteData // site metadata
+}) => {
+  Vue.use(Vuetify);
+  options.vuetify = new Vuetify({})
+  Vue.use(Buefy)
+  Vue.use(CronCore);
+  Vue.use(CronVuetify);
+}

docs/src/.vuepress/config.js

@@ -0,0 +1,8 @@
+/**
+ * Custom Styles here.
+ *
+ * ref：https://v1.vuepress.vuejs.org/config/#index-styl
+ */
+
+.home .hero img
+  max-width 450px!important