add: theme provider component

Author: codebender828

kue.config.js renamed to kiwi.config.js

@@ -1,5 +1,5 @@
 export default {
-  pallette: {
+  palette: {
     primary: 'hsl(209, 100%, 50%)',
     secondary: 'hsl(278, 100%, 69%)',
     success: 'hsl(160, 100%, 43%)',

src/App.vue

@@ -0,0 +1,26 @@
+<template>
+  <div>
+    {{ greeting }}
+    <k-button>Simple text</k-button>
+  </div>
+</template>
+
+<script>
+import KButton from './components/Button/index'
+
+export default {
+  name: 'App',
+  components: {
+    KButton
+  },
+  data () {
+    return {
+      greeting: 'Hi!'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/components/Button/index.vue

@@ -21,6 +21,7 @@
 <script>
 export default {
   name: 'Button',
+  inject: ['KiwiTheme'],
   props: {
     as: {
       type: String,

src/components/ThemeContext/index.js

@@ -0,0 +1,16 @@
+import Theme from '../../../kiwi.config'
+
+/**
+ * @type {Object}
+ */
+const ThemeProvider = {
+  name: 'ThemeProvider',
+  provide: {
+    KiwiTheme: Theme
+  },
+  render (h) {
+    return this.$slots.default[0]
+  }
+}
+
+export default ThemeProvider

src/main.js

@@ -1,9 +1,10 @@
 import Vue from 'vue'
 import App from './App.vue'
 import './registerServiceWorker'
+import ThemeProvider from './components/ThemeContext/index.js'
 
 Vue.config.productionTip = false
 
 new Vue({
-  render: h => h(App)
+  render: h => h(ThemeProvider, {}, [h(App)])
 }).$mount('#app')