@ditojs/admin 2.2.0 → 2.2.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ditojs/admin",
-  "version": "2.2.0",
+  "version": "2.2.1",
   "type": "module",
   "description": "Dito.js Admin is a schema based admin interface for Dito.js Server, featuring auto-generated views and forms and built with Vue.js",
   "repository": "https://github.com/ditojs/dito/tree/master/packages/admin",
@@ -82,7 +82,7 @@
     "vite": "^4.2.1"
   },
   "types": "types",
-  "gitHead": "fc81c8e9a64e76549d26bd94774a3b1c92afa49f",
+  "gitHead": "306d4d9ef2a0c989b026f1d1cd77f6d4fd60430b",
   "scripts": {
     "build": "vite build",
     "watch": "yarn build --mode 'development' --watch",

package/src/components/DitoContainer.vue

@@ -190,6 +190,7 @@ export default DitoComponent.component('DitoContainer', {
 .dito-container {
   display: flex;
   flex-flow: column;
+  align-items: flex-start;
   // Needed for better vertical alignment:
   align-self: stretch;
   box-sizing: border-box;

package/src/mixins/TypeMixin.js

@@ -3,7 +3,7 @@ import ValidationMixin from './ValidationMixin.js'
 import { getSchemaAccessor } from '../utils/accessor.js'
 import { computeValue } from '../utils/schema.js'
 import { getItem, getParentItem } from '../utils/data.js'
-import { isString, asArray } from '@ditojs/utils'
+import { isString, asArray, camelize } from '@ditojs/utils'
 
 // @vue/component
 export default {
@@ -165,10 +165,18 @@ export default {
       type: String
     }),
 
-    // @overridable
     events() {
-      const { onFocus, onBlur, onInput, onChange } = this
-      return { onFocus, onBlur, onInput, onChange }
+      const events = this.getEvents()
+      // Register callbacks for all provides non-recognized events,
+      // assuming they are native events.
+      // TODO: Move to vue3-style `on[A-Z]` event handlers naming that aren't
+      // namespaced in `schema.events` once the transition is complete.
+      for (const event of Object.keys(this.schema.events || {})) {
+        events[`on${camelize(event, true)}`] ??= () => {
+          this.emitEvent(event)
+        }
+      }
+      return events
     },
 
     attributes() {
@@ -233,6 +241,12 @@ export default {
       }
     },
 
+    // @overridable
+    getEvents() {
+      const { onFocus, onBlur, onInput, onChange } = this
+      return { onFocus, onBlur, onInput, onChange }
+    },
+
     // @overridable
     getValidations() {
       return null

package/src/types/DitoTypeButton.vue

@@ -43,16 +43,16 @@ export default DitoTypeComponent.register(
       closeForm: getSchemaAccessor('closeForm', {
         type: Boolean,
         default: false
-      }),
+      })
+    },
 
+    methods: {
       // @override
-      events() {
+      getEvents() {
         const { onFocus, onBlur, onClick } = this
         return { onFocus, onBlur, onClick }
-      }
-    },
+      },
 
-    methods: {
       async submit(options) {
         return this.resourceComponent?.submit(this, options)
       },