schema extensions

zero.Backoffice.UI/app/editor/_fields/pagepicker.vue

@@ -1,24 +0,0 @@
-<template>
-  <ui-pagepicker :config="config" :value="value" @input="$emit('input', $event)" :disabled="disabled" :limit="1" />
-</template>
-
-
-<script>
-  export default {
-    props: {
-      value: {
-        type: [String, Array],
-        default: null
-      },
-      disabled: {
-        type: Boolean,
-        default: false
-      },
-      limit: {
-        type: Number,
-        default: 1
-      },
-      config: Object
-    },
-  }
-</script>

zero.Backoffice.UI/app/editor/compile.ts

@@ -8,6 +8,8 @@ import { ZeroEditorFieldConfiguration, ZeroEditorFieldFilterPreview } from "./ed
 import { localize } from '../services/localization';
 
 
+let appliedExtensionsTo: string[] = [];
+
 export interface ZeroCompiledEditor
 {
   alias: string;
@@ -162,6 +164,18 @@ export function compileEditor(zero: Zero, editor: ZeroEditor): ZeroCompiledEdito
     return null;
   }
 
+  if (appliedExtensionsTo.indexOf(editor.alias) < 0)
+  {
+    appliedExtensionsTo.push(editor.alias);
+
+    let extensions = zero.getSchemaExtensions(editor.alias);
+
+    extensions.forEach(extension =>
+    {
+      extension.extension(editor);
+    });
+  }
+
   let model = {
     alias: editor.alias,
     blueprint: null,

zero.Backoffice.UI/app/editor/editor-canvas.ts

@@ -21,6 +21,11 @@ export class ZeroEditorCanvasBase
     this.fields.push(proxy);
     return proxy;
   }
+
+  getField(path: string): ZeroEditorField | undefined
+  {
+    return this.fields.find(x => x.path == path);
+  }
 }
 
 
@@ -55,6 +60,11 @@ export class ZeroEditorCanvas extends ZeroEditorCanvasBaseWithFieldset
     this.tabs.push(tab);
     return tab;
   }
+
+  getTab(alias: string): ZeroEditorTab | undefined
+  {
+    return this.tabs.find(x => x.alias == alias);
+  }
 }
 
 

zero.Backoffice.UI/app/editor/fields/createFields.ts

@@ -6,6 +6,7 @@ export default function createFields(app: ZeroPluginOptions): void
 {
   app.fieldType('text', defineAsyncComponent(() => import('./text.vue')));
   app.fieldType('number', defineAsyncComponent(() => import('./number.vue')));
+  app.fieldType('password', defineAsyncComponent(() => import('./password.vue')));
   app.fieldType('toggle', defineAsyncComponent(() => import('./toggle.vue')));
   app.fieldType('rte', defineAsyncComponent(() => import('./rte.vue')));
   app.fieldType('output', defineAsyncComponent(() => import('./output.vue')));

zero.Backoffice.UI/app/editor/fields/editor-field-extensions.d.ts

@@ -22,6 +22,12 @@ declare module 'zero/schemas'
      */
     number(options?: NumberFieldOptions): ZeroEditorField;
 
+    /**
+     * Render a password input
+     * @param {TextFieldOptions} [options] - Custom options
+     */
+    password(options?: TextFieldOptions): ZeroEditorField;
+
     /**
      * Render a toggle
      * @param {ToggleFieldOptions} [options] - Custom options
@@ -132,7 +138,7 @@ declare module 'zero/schemas'
 
   export interface SelectFieldOptions
   {
-    items: SelectFieldItem[];
+    items: SelectFieldItem[] | ((model: any) => SelectFieldItem[]);
     emptyOption?: boolean | null;
   }
 
@@ -156,6 +162,7 @@ declare module 'zero/schemas'
     limit?: number;
     reverse?: boolean | null;
     labelKey?: string;
+    descriptionKey?: string;
     idKey?: string;
   }
 

zero.Backoffice.UI/app/editor/fields/nested.vue

@@ -127,8 +127,6 @@
           width: this.width,
         });
 
-        console.info('nested result: ', result);
-
         if (result.eventType == 'confirm')
         {
           if (isAdd)
@@ -141,6 +139,8 @@
             this.removeItem(index);
             this.items.splice(index, 0, result.value);
           }
+
+          this.onChange();
         }
       },
 
@@ -154,7 +154,9 @@
 
       onChange()
       {
-        this.$emit('input', this.multiple ? this.items : (this.items.length > 0 ? this.items[0] : null));
+        let value = this.multiple ? this.items : (this.items.length > 0 ? this.items[0] : null)
+        this.$emit('input', value);
+        this.$emit('update:value', value);
       },
 
 

zero.Backoffice.UI/app/editor/fields/password.vue

@@ -1,28 +1,22 @@
 <template>
-  <input :value="value" @input="$emit('input', $event.target.value)" type="password" class="ui-input" v-placeholder="{ placeholder, model: entity }" :maxlength="maxLength" :disabled="disabled" />
+  <input :value="value" @input="$emit('input', $event.target.value)" type="password" class="ui-input" v-placeholder="{ placeholder, model: config.model }" :maxlength="maxLength" :disabled="config.disabled" />
 </template>
 
 
 <script>
   export default {
     props: {
-      value: {
-        type: String,
-        default: null
-      },
+      value: String,
+      config: Object,
+
       maxLength: {
         type: Number,
         default: null
       },
-      disabled: {
-        type: Boolean,
-        default: false
-      },
       placeholder: {
-        type: String,
+        type: [String, Function],
         default: null
-      },
-      entity: Object
+      }
     }
   }
 </script>

zero.Backoffice.UI/app/editor/fields/select.vue

@@ -32,13 +32,15 @@
     watch: {
       items: {
         deep: true,
-        handler()
+        handler(val)
         {
-          this.rebuild();
-          this.onChange({ target: { value: this.value } });
+          if (typeof val !== 'function')
+          {
+            this.rebuild();
+          }
         }
       },
-      'config.model.addresses': {
+      'config.model': {
         deep: true,
         handler()
         {
@@ -52,20 +54,24 @@
       rebuild()
       {
         let items = [];
+        let options = [];
 
         if (!this.config.model || !this.items)
         {
-          this.options = items;
-          return;
+          options = items;
         }
-
-        if (typeof this.items === 'function')
+        else if (typeof this.items === 'function')
         {
-          this.options = this.items(this.config.model);
+          options = this.items(this.config.model);
         }
         else
         {
-          this.options = [...this.items];
+          options = [...this.items];
+        }
+
+        if (JSON.stringify(options) !== JSON.stringify(this.options))
+        {
+          this.options = options;
         }
       },
 
@@ -78,7 +84,13 @@
           value = null;
         }
 
+        if (this.value === value)
+        {
+          return;
+        }
+
         this.$emit('input', value);
+        this.$emit('update:value', value);
       }
     }
   }