Merge branch 'master' into production

Author: jung-han

README.md

@@ -136,7 +136,7 @@ You can use `rowData`, `columnData`, `options`, `theme` and `language` props. Ex
 
     | Type | Required |
     | --- | --- |
-    | Array | O |
+    | Array or Object | O |
 
     These props are row and colume data of the grid. If you change `rowData` or `columnData`, the grid is rendered to change data.
 
@@ -216,6 +216,16 @@ After then you can use methods through `this.$refs`. We provide `getRootElement`
     this.$refs.tuiGrid.invoke('setWidth', 500);
     ```
 
+## Static Methods
+The wrapper component does not provide a way to call [static methods of TOAST UI Grid](http://nhn.github.io/tui.grid/latest/Grid#applyTheme). If you want to use static methods such as `applyTheme` or `setLanguage` you should use it via importing tui-grid directly.
+
+```js
+import TuiGrid from 'tui-grid';
+
+TuiGrid.setLanguage('ko');
+TuiGrid.applyTheme('striped');
+```
+
 ## 🔧 Pull Request Steps
 
 TOAST UI products are open source, so you can create a pull request(PR) after you fix issues.

docs/getting-started.md

@@ -111,7 +111,7 @@ You can use `rowData`, `columnData`, `options`, `theme` and `language` props.
 
     | Type | Required |
     | --- | --- |
-    | Array | O |
+    | Array | Object | O |
 
     These props are row and colume data of the grid. If you change `rowData` or `columnData`, the grid is rendered to change data.
 

example/App.vue

@@ -8,6 +8,8 @@
       :theme="gridProps.myTheme"
       @check="onCheck"
       @uncheck="onUnCheck"
+      :rowHeaders="gridProps.rowHeaders"
+      :columnOptions="gridProps.columnOptions"
     ></grid>
   </div>
 </template>
@@ -21,6 +23,11 @@ export default {
   },
   created() {
     this.gridProps = {
+      rowHeaders: ['checkbox', 'rowNum'],
+      columnOptions: {
+        resizable: true,
+        frozenCount: 1
+      },
       columns: [
         {
           header: 'Name',

src/Grid.vue

@@ -12,7 +12,7 @@ export default {
   name: 'TuiGrid',
   props: {
     data: {
-      type: Array,
+      type: [Array, Object],
       required: true
     },
     columns: {
@@ -25,6 +25,7 @@ export default {
         return {};
       }
     },
+    // @deprecated. You should use it via importing tui-grid directly.
     theme: {
       type: [String, Object],
       validator(value) {
@@ -38,6 +39,7 @@ export default {
         return result;
       }
     },
+    // @deprecated. You should use it via importing tui-grid directly.
     language: {
       type: [String, Object],
       validator(value) {
@@ -53,11 +55,12 @@ export default {
     }
   },
   mounted() {
-    const options = Object.assign({}, this.options, {
+    const options = Object.assign(this.options || {}, this.$attrs, {
       el: this.$refs.tuiGrid,
       data: this.data,
       columns: this.columns
     });
+
     this.gridInstance = new Grid(options);
     this.addEventListeners();
     this.applyTheme();
@@ -76,6 +79,7 @@ export default {
         this.gridInstance.on(eventName, (...args) => this.$emit(eventName, ...args));
       }
     },
+    // @deprecated. You should use it via importing tui-grid directly.
     applyTheme() {
       if (this.theme) {
         if (typeof this.theme === 'string') {
@@ -85,6 +89,7 @@ export default {
         }
       }
     },
+    // @deprecated. You should use it via importing tui-grid directly.
     setLanguage() {
       if (this.language) {
         if (typeof this.language === 'string') {