<template>
    <v-flex :class="element.width">
        <component v-bind:is="element.type" :values="values" :element="element" ></component>
    </v-flex>
</template>
<script>
import Vue from 'vue'

const requireElement = require.context('./Elements', true, /\.vue$/);
requireElement.keys().forEach(fileName => {
  // Replace ./ and .vue
    const elementName = fileName.replace(/(\.\/|\.vue)/g, '')
    Vue.component(elementName,
        () => import(`./Elements/${elementName}.vue`)
    )
});

export default {
    props:{
        element:{
            type: Object,
            required: true
        },
        values: {
            required: false,
            type: Object,
        }
    },
}
</script>