add display template interface

app/src/interfaces/display-template/display-template.vue

@@ -0,0 +1,25 @@
+<template>
+	<v-field-template />
+</template>
+
+<script lang="ts">
+import { defineComponent, PropType } from '@vue/composition-api';
+
+export default defineComponent({
+	props: {
+		disabled: {
+			type: Boolean,
+			default: false,
+		},
+		value: {
+			type: String,
+			default: null,
+		},
+		collection: {
+			type: String,
+			default: null,
+			required: true,
+		},
+	},
+});
+</script>

app/src/interfaces/display-template/index.ts

@@ -0,0 +1,42 @@
+import { defineInterface } from '@/interfaces/define';
+import VFieldTemplate from '@/components/v-field-template';
+
+export default defineInterface(({ i18n }) => ({
+	id: 'display-template',
+	name: i18n.t('display-template'),
+	icon: 'arrow_drop_down_circle',
+	component: VFieldTemplate,
+	types: ['string'],
+	options: [
+		{
+			field: 'value',
+			name: i18n.t('value'),
+			type: 'string',
+			meta: {
+				width: 'full',
+				interface: 'text-input',
+				default_value: '',
+			},
+		},
+		{
+			field: 'disabled',
+			type: 'boolean',
+			name: i18n.t('disabled'),
+			meta: {
+				width: 'half',
+				interface: 'toggle',
+				default_value: false,
+			},
+		},
+		{
+			field: 'collection',
+			name: i18n.t('collection'),
+			type: 'string',
+			meta: {
+				width: 'half',
+				interface: 'text-input',
+				default_value: '',
+			},
+		},
+	],
+}));

app/src/interfaces/display-template/readme.md

@@ -0,0 +1,12 @@
+# Display template
+
+This is the interface version of the v-field-template component.
+
+## Options
+
+| Option        | Description                            | Default |
+|---------------|----------------------------------------|---------|
+| `placeholder` | Text to show when no input is entered  | `null`  |
+| `allow-none`  | Allow the user to deselect the value   | `false` |
+| `allow-other` | Allow the user to enter a custom value | `false` |
+| `choices`     | What choices to present to the user    | `null`  |