Convert component template to render function

src/components/mdButton/index.js

@@ -1,10 +1,8 @@
 import MdButton from './mdButton.vue';
-import MdLinkButton from './mdLinkButton.vue';
 import MdButtonTheme from './mdButton.theme';
 
 export default function install(Vue) {
   Vue.component('md-button', Vue.extend(MdButton));
-  Vue.component('md-link-button', Vue.extend(MdLinkButton));
 
   window.VueMaterial.styles.push(MdButtonTheme);
 }

src/components/mdButton/mdButton.vue

@@ -1,14 +1,40 @@
-<template>
-  <button class="md-button" :type="type || 'button'" :disabled="disabled" v-md-ink-ripple="disabled">
-    <slot></slot>
-  </button>
-</template>
-
 <style lang="scss" src="./mdButton.scss"></style>
 
 <script>
   export default {
+    render(createElement) {
+      let isDisabled = Boolean(this.disabled);
+      let hasLink = Boolean(this.href);
+      let tag = 'button';
+      let emitClick = () => {
+        this.$emit('click');
+      };
+      let options = {
+        staticClass: 'md-button',
+        attrs: {
+          type: hasLink || 'button',
+          disabled: isDisabled
+        },
+        directives: [{
+          name: 'md-ink-ripple',
+          value: isDisabled,
+          expression: 'disabled'
+        }],
+        on: {
+          click: emitClick
+        }
+      };
+
+      if (hasLink) {
+        tag = 'a';
+        options.attrs.href = this.href;
+        delete options.attrs.type;
+      }
+
+      return createElement(tag, options, this.$slots.default);
+    },
     props: {
+      href: String,
       type: String,
       disabled: Boolean
     }

src/components/mdButton/mdLinkButton.vue

@@ -1,13 +0,0 @@
-<template>
-  <a class="md-button" :disabled="disabled" v-md-ink-ripple="disabled">
-    <slot></slot>
-  </a>
-</template>
-
-<script>
-  export default {
-    props: {
-      disabled: Boolean
-    }
-  };
-</script>