Version and readme updated

Author: amoncaldas

.DS_Store

@@ -1,4 +1,4 @@
 {
-  "presets": ["babel-preset-env", "stage-2"],
-  "plugins": ["transform-class-properties"]
-}
+    "presets": ["babel-preset-env", "stage-2"],
+    "plugins": ["transform-class-properties"]
+  }

.babelrc

@@ -11,97 +11,107 @@ npm install --save vue2-leaflet-height-graph
 ```
 
 ## Import
+
 You could either import the component locally where you need it or register it globally.
 
 ### Local
+
 In a `.vue` file:
+
 ```vue
 <script>
-    import LControlHeightGraph from 'vue2-leaflet-height-graph'
+    import LHeightGraph from 'vue2-leaflet-height-graph'
     // ...
     export default {
         // ...
-        components: { 'l-height-graph': LControlHeightGraph }
+        components: { 'l-height-graph': LHeightGraph }
         // ...
     }
 </script>
-<style>
-@import "~vue2-leaflet-height-graph/dist/Vue2LeafletHeightGraph.css";
-</style>
 // ...
 ```
 
 ### Global
+
 In your `main.js`:
+
 ```js
 import Vue from 'vue';
 import Vue2LeafletHeightGraph from 'vue2-leaflet-height-graph';
-import 'vue2-leaflet-heightgraph/dist/Vue2LeafletHeightGraph.css'
 // ...
 Vue.component('l-height-graph', Vue2LeafletHeightGraph);
 // ...
 ```
 
 ## Usage
 
-With the `LControlHeightGraph` component loaded into Vue, add the
+With the `LHeightGraph` component loaded into Vue, add the
 `l-height-graph` element inside an `l-map`.
 
 ```html
 <l-map>
-  <l-height-graph
-    :data="heightGraphData" 
-    :options="{ width: 1000, position: 'bottomleft'}"/>
+  <l-height-graph :data="heightGraphData"/>
   <!-- other map components -->
 </l-map>
 ```
 
 ## Properties
-The following properties can be passed to the `LControlHeightGraph` component:
+
+The following properties can be passed to the `LHeightGraph` component:
 
 ### data
+
 Takes an array of GeoJSON FeatureCollections as described
 in the [Leaflet.Heigthgraph Readme](https://github.com/GIScience/Leaflet.Heightgraph/#supported-data)
 by default.
 
-Specify the `parser` property to use other Array or Object input formats.
+The component will assume the data is in `geoJson` format unless you specify another supported parser via options (see [options](#options) below)
 
 Currently supported formats for parser values:
-- `'ors'`: The response of the [openrouteservice directions endpoint](https://openrouteservice.org/dev/#/api-docs/v2/directions/{profile}/geojson/post)
-in geojson fromat. Don't forget to set `elevation=true`.
 
-Other relevant formats can be made available by contributing a parser. 
+- `ors`: The response of the [openrouteservice directions endpoint](https://openrouteservice.org/dev/#/api-docs/v2/directions/{profile}/geojson/post)
+in geojson format. Don't forget to set `elevation=true`.
+
+- `geojson`: data in a `geoJson` format.
+
+- `noParser`: the data does not need to be parsed [see expected data structure](./src/data/no-parser-example.js)
+
+Other relevant formats can be made available by contributing a parser.
 
 examples: see [data folder](./src/data)
 
 default: `[]`
+
+### width via grid/view breakpoint
+
+This component supports specifying a dynamic width based current screen resolution and as a portion of the parent width, similar to what is used in the [vuetify](https://dev.vuetifyjs.com/en/components/grids).
+So if can be defined the element width for mutiples scenarios, like: md8, lg10, xl6.
+
 ### options
+
 Use the `options` property to specify any of the
 [Leaflet.Heightgraph options](https://github.com/GIScience/Leaflet.Heightgraph#default-options)
 to be set when the control is created.
 
 If no options are specified the default options from Leaflet.Heightgraph are used.
+the wrapper has it own defaults only for:
+
+- width: use the grid system as default. If width is specified it will override the grid system value and not be responsive.
+- parser: = `geoJson`
+- position: `bottomright`
 
 example:
+
 ```js
-{ width: 1000, position: 'bottomleft'}
+{ width: 1000, position: 'bottomleft', parser: 'ors' }
 ```
 
 ### position
+
 String to set the position on the map. Values can be `'bottomleft'`, `'bottomright'`, `'topleft'`, `'topright'`.
 Fast setting for `options.position` (overwriting).
 
 ### expand
+
 Boolean for expanding the heightgraph window on creation. Values are `true` and `false`.
 Fast setting for `options.expand` (overwriting).
-
-### parser
-Set the name of the parser function as String to support different `data` input.
-
-Available parsers:
-- `'normal'`
-- `'ors'`
-
-If you want to support relevant elevation data, consider contributing a parser function.
-
-default: `'normal'`

README.md

@@ -1,17 +1,17 @@
 {
-  "_from": "vue2-leaflet-height-graph@^0.2.0",
-  "_id": "vue2-leaflet-height-graph@0.2.0",
+  "_from": "vue2-leaflet-height-graph@^0.3.0",
+  "_id": "vue2-leaflet-height-graph@0.3.0",
   "_inBundle": false,
   "_integrity": "sha512-atQC+klaDwzyxRbBDtFz4WBtwYA1dJNTv/UzmJupICRkHm9I0ECZ8OIG/5BAGSBklwsqgiTKkZPYAEZK3e7JHg==",
   "_location": "/vue2-leaflet-height-graph",
   "_phantomChildren": {},
   "_requested": {
     "type": "range",
     "registry": true,
-    "raw": "vue2-leaflet-height-graph@^0.2.0",
+    "raw": "vue2-leaflet-height-graph@^0.3.0",
     "name": "vue2-leaflet-height-graph",
     "escapedName": "vue2-leaflet-height-graph",
-    "rawSpec": "^0.2.0",
+    "rawSpec": "^0.3.0",
     "saveSpec": null,
     "fetchSpec": "^0.3.0"
   },
@@ -48,9 +48,6 @@
     "webpack-node-externals": "^1.7.2"
   },
   "eslintConfig": {
-    "extends": [
-      "plugin:vue/base"
-    ],
     "parserOptions": {
       "ecmaVersion": 2019
     }
@@ -83,5 +80,5 @@
     "serve": "vue-cli-service serve",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
-  "version": "0.2.0"
+  "version": "0.3.0"
 }