update wip

Author: selfagency

package.json

@@ -29,18 +29,18 @@
   },
   "dependencies": {
     "element-ready": "^4.1.1",
-    "gridjs": "^1.5.0",
+    "gridjs": "^1.7.0",
     "nanoid": "^3.1.10",
     "vue-runtime-helpers": "1.1.2"
   },
   "devDependencies": {
-    "@babel/core": "^7.10.2",
-    "@babel/preset-env": "^7.10.2",
-    "@vue/cli-plugin-babel": "~4.4.0",
-    "@vue/cli-plugin-eslint": "~4.4.0",
-    "@vue/cli-plugin-unit-jest": "~4.4.0",
-    "@vue/cli-service": "~4.4.0",
-    "@vue/cli-service-global": "^4.4.4",
+    "@babel/core": "^7.10.3",
+    "@babel/preset-env": "^7.10.3",
+    "@vue/cli-plugin-babel": "~4.4.6",
+    "@vue/cli-plugin-eslint": "~4.4.6",
+    "@vue/cli-plugin-unit-jest": "~4.4.6",
+    "@vue/cli-service": "~4.4.6",
+    "@vue/cli-service-global": "^4.4.6",
     "@vue/compiler-sfc": "^3.0.0-beta.15",
     "@vue/eslint-config-prettier": "^6.0.0",
     "@vue/test-utils": "^1.0.3",
@@ -50,13 +50,15 @@
     "bili-babel": "^0.2.0",
     "core-js": "^3.6.5",
     "cross-env": "^5.2.0",
-    "eslint": "^6.7.2",
+    "eslint": "^7.3.1",
     "eslint-plugin-import": "^2.21.2",
     "eslint-plugin-prettier": "^3.1.3",
     "eslint-plugin-vue": "^6.2.2",
-    "prettier": "^1.19.1",
+    "prettier": "^2.0.5",
+    "raw-loader": "^4.0.1",
     "rollup-plugin-css": "^1.0.10",
     "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-string": "^3.0.0",
     "rollup-plugin-vue": "5",
     "typescript": "^3.9.5",
     "vue": "^2.6.11",

src/gridjs-vue.vue

@@ -14,6 +14,10 @@ export default {
       type: Boolean,
       default: true
     },
+    classNames: {
+      type: Object,
+      default: undefined
+    },
     cols: {
       type: Array,
       default: undefined
@@ -46,6 +50,10 @@ export default {
       type: [Object, Boolean],
       default: false
     },
+    styles: {
+      type: Object,
+      default: undefined
+    },
     theme: {
       type: String,
       default: 'mermaid'
@@ -79,10 +87,14 @@ export default {
         width: this.width
       }
 
+      // let classNames
+
+      if (this.classNames) options.className = this.classNames
       if (this.from) options.from = this.from
       if (this.language) options.language = this.language
       if (this.search) options.search = this.search
       if (this.server) options.server = this.server
+      if (this.styles) options.style = this.styles
 
       return options
     }
@@ -144,7 +156,7 @@ export default {
       const themes = ['mermaid']
 
       if (themes.includes(this.theme)) {
-        await import(`./themes/${this.theme}.css`)
+        console.log(await import(`raw-loader!gridjs/dist/theme/${this.theme}.css`))
       }
 
       const styleSheets = document.styleSheets