Refactor code. Fix bugs.

Update to 1.0.2
kotapeter · Jul 14, 2018 · d6def63 · d6def63
1 parent 4077576
commit d6def63
Show file tree

Hide file tree

Showing 26 changed files with 537 additions and 220 deletions.
diff --git a/.babelrc b/.babelrc
@@ -1,10 +1,6 @@
 {
   "presets": [
-    "es2015",
+    ["es2015", { "modules": false }],
     "stage-2"
-  ],
-  "plugins": [
-    "transform-runtime"
-  ],
-  "comments": false
+  ]
 }
diff --git a/.eslintignore b/.eslintignore
@@ -0,0 +1,4 @@
+dist
+doc
+node_modules
+webpack
diff --git a/.eslintrc b/.eslintrc
@@ -0,0 +1,16 @@
+{
+  "parserOptions": {
+    "ecmaVersion": 2017,
+    "sourceType": "module"
+  },
+  "extends": "standard",
+  "env": {
+    "browser": true
+  },
+  "plugins": [
+    "vue"
+  ],
+  "settings": {
+    "import/extensions": [".js", ".vue", ".less"]
+  }
+}
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,4 @@
+dist/
 .idea/
 package-lock.json
 yarn.lock

diff --git a/.npmignore b/.npmignore
@@ -0,0 +1,9 @@
+/docs
+/node_modules
+/webpack
+.babelrc
+.eslintignore
+.eslintrc
+index.html
+.npmignore
+*.tgz
diff --git a/README.md b/README.md
@@ -1,28 +1,26 @@
 # vuetify-datetime-picker
-DatetimePicker component for Vue.js.
+[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/darrenfang/vuetify-datetime-picker/blob/master/LICENSE)
+[![npm version](https://img.shields.io/npm/v/vuetify-datetime-picker.svg?style=flat)](https://www.npmjs.com/package/vuetify-datetime-picker)
+[![CircleCI](https://img.shields.io/circleci/project/github/darrenfang/vuetify-datetime-picker.svg)](https://circleci.com/gh/darrenfang/vuetify-datetime-picker)
+
+DatetimePicker component for Vuetify.js.
 
 ## Installation
 
 ```shell
 npm install --save vuetify-datetime-picker
-```
-
-### Browser
 
-Include the script file, then install the component with `Vue.use(VuetifyDatetimePicker);` e.g.:
+or
 
-```html
-<script type="text/javascript" src="node_modules/vuejs/dist/vue.min.js"></script>
-<script type="text/javascript" src="node_modules/vuetify-datetime-picker/dist/vuetify-datetime-picker.min.js"></script>
-<script type="text/javascript">
-  Vue.use(VuetifyDatetimePicker);
-</script>
+yarn add vuetify-datetime-picker
 ```
 
-### Module
-
 ```js
-import DatetimePicker from 'vuetify-datetime-picker';
+import Vue from 'vue'
+import DatetimePicker from 'vuetify-datetime-picker'
+import 'vuetify-datetime-picker/src/stylus/main.styl'
+
+Vue.use(DatetimePicker)
 ```
 
 ## Usage
@@ -32,7 +30,23 @@ Once installed, it can be used in a template as simply as:
 ```html
 <v-datetime-picker
         label="Select Datetime"
-        :datetime="datetime"
         v-model="datetime">
 </v-datetime-picker>
 ```
+
+## Properties
+
+|        Name        |    Default Value    |       Description        |
+| ------------------ | ------------------- | ------------------------ |
+| datetime           |                     | Time picker model        |
+| label              |                     | Sets input label         |
+| width              | 320                 | The width of the content |
+| format             | YYYY-MM-DD HH:mm:ss | Defines the format of a datetime displayed in field. |
+| timePickerFormat   | 24hr                | Defines the format of a time displayed in picker. Available options are ampm and 24hr. |
+| locale             | en-us               | Sets the locale. Accepts a string with a BCP 47 language tag. |
+
+## Events
+
+|    Name    |    Arguments    |       Description        |
+| -----------| ----------------| ------------------------ |
+| input      | value (string)  | The updated bound model  |
diff --git a/dist/vuetify-datetime-picker.js b/dist/vuetify-datetime-picker.js
diff --git a/dist/vuetify-datetime-picker.min.js b/dist/vuetify-datetime-picker.min.js
diff --git a/index.html b/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>vuetify-datetime-picker</title>
+    <link href='https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons' rel="stylesheet">
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
+</head>
+<body>
+<div id="app"></div>
+</body>
+</html>
diff --git a/package.json b/package.json
@@ -1,32 +1,54 @@
 {
   "name": "vuetify-datetime-picker",
-  "version": "1.0.1",
-  "description": "DatetimePicker component for Vue.js.",
-  "main": "dist/vuetify-datetime-picker.js",
+  "version": "1.0.2",
+  "description": "DatetimePicker component for Vuetify.js.",
+  "main": "dist/index.js",
   "scripts": {
-    "build": "rimraf ./dist && webpack --config ./webpack.config.js",
+    "dev": "node_modules/.bin/webpack-dev-server --config webpack/dev.js",
+    "doc": "node_modules/.bin/webpack -p --config webpack/doc.js --progress --profile --colors",
+    "build": "node_modules/.bin/webpack -p --config webpack/build.js --progress --profile --colors",
     "deploy": "npm run build && npm publish --registry https://registry.npmjs.org/"
   },
-  "author": "Darren Fang",
+  "author": "Darren Fang <idarrenfang@gmail.com>",
   "license": "MIT",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/darrenfang/vuetify-datetime-picker"
   },
   "devDependencies": {
-    "babel-core": "^6.10.4",
-    "babel-loader": "^6.2.4",
-    "babel-plugin-transform-runtime": "^6.9.0",
-    "babel-preset-es2015": "^6.9.0",
-    "babel-preset-stage-2": "^6.11.0",
-    "babel-runtime": "^6.9.2",
-    "rimraf": "^2.6.1",
-    "vue": "^2.2.1",
-    "vue-html-loader": "^1.2.3",
-    "vue-loader": "^11.1.4",
-    "vue-style-loader": "^2.0.3",
-    "vue-template-compiler": "^2.2.1",
-    "webpack": "1.13.1",
+    "babel-core": "^6.24.1",
+    "babel-loader": "^7.0.0",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-stage-2": "^6.24.1",
+    "clean-webpack-plugin": "^0.1.16",
+    "css-loader": "^0.28.1",
+    "eslint": "^3.19.0",
+    "eslint-config-standard": "^10.2.1",
+    "eslint-config-vue": "^2.0.2",
+    "eslint-loader": "^1.7.1",
+    "eslint-plugin-import": "^2.2.0",
+    "eslint-plugin-node": "^4.2.2",
+    "eslint-plugin-promise": "^3.5.0",
+    "eslint-plugin-standard": "^3.0.1",
+    "eslint-plugin-vue": "^2.0.1",
+    "extract-text-webpack-plugin": "^2.1.0",
+    "file-loader": "^0.11.1",
+    "html-webpack-plugin": "^2.28.0",
+    "less": "^2.7.2",
+    "less-loader": "^4.0.3",
+    "stylus": "^0.54.5",
+    "stylus-loader": "^3.0.2",
+    "url-loader": "^0.5.8",
+    "vue-loader": "^12.0.2",
+    "vue-style-loader": "^4.1.0",
+    "vue-template-compiler": "^2.3.0",
+    "webpack": "^2.4.1",
+    "webpack-dev-server": "^2.4.5",
     "webpack-merge": "^4.1.0"
+  },
+  "dependencies": {
+    "moment": "^2.22.2",
+    "vue": "^2.3.0",
+    "vuetify": "^1.1.4"
   }
 }
diff --git a/src/DatetimePicker.vue b/src/DatetimePicker.vue
diff --git a/src/app.vue b/src/app.vue
@@ -0,0 +1,21 @@
+<template>
+    <v-app dark>
+        <v-container>
+            <v-layout row justify-center>
+                <v-flex xs4>
+                    <v-datetime-picker v-model="datetime"></v-datetime-picker>
+                </v-flex>
+            </v-layout>
+        </v-container>
+    </v-app>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        datetime: null
+      }
+    }
+  }
+</script>