@ditojs/admin 1.28.0 → 1.30.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ditojs/admin",
-  "version": "1.28.0",
+  "version": "1.30.0",
   "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",
@@ -33,9 +33,9 @@
     "not ie_mob > 0"
   ],
   "dependencies": {
-    "@ditojs/build": "^1.28.0",
-    "@ditojs/ui": "^1.28.0",
-    "@ditojs/utils": "^1.28.0",
+    "@ditojs/build": "^1.30.0",
+    "@ditojs/ui": "^1.30.0",
+    "@ditojs/utils": "^1.30.0",
     "codeflask": "^1.4.1",
     "filesize": "^10.0.6",
     "filesize-parser": "^1.5.0",
@@ -59,14 +59,14 @@
   "devDependencies": {
     "@ditojs/build": "^1.19.0",
     "pug": "^3.0.2",
-    "sass": "1.58.3",
+    "sass": "1.59.3",
     "type-fest": "^3.6.1",
-    "typescript": "^4.9.5",
-    "vite": "^4.1.4",
+    "typescript": "^5.0.2",
+    "vite": "^4.2.1",
     "vite-plugin-vue2": "^2.0.3"
   },
   "types": "types",
-  "gitHead": "9e43f6a450f6c38a5147502863d1f44738fcecef",
+  "gitHead": "5d09dc24ecb77b511f3c25643275ea1b9514fb52",
   "scripts": {
     "build": "vite build",
     "watch": "yarn build --mode 'development' --watch",

package/src/components/DitoSchemaInlined.vue

@@ -44,9 +44,12 @@
           --label-padding: #{$form-spacing}
           margin: 0
           width: 100%
-          box-sizing: border-box
+          box-sizing: content-box
           // Because tables have a funny way of allowing too much width growth:
           max-width: $content-width
+          // Prevent collapsing to min-height when alone in
+          // .dito-schema-content, due to grid-template-rows: min-content
+          min-height: 2em
         & +.dito-pane
           // Needed for transition-height in DitoSchema:
           min-height: $form-spacing

package/src/mixins/ItemMixin.js

@@ -88,6 +88,9 @@ export default {
         }
         // It's up to `itemLabel()` entirely to produce the label:
         extended = false
+      } else if (isString(itemLabel) && !(itemLabel in item)) {
+        // `itemLabel` can be both a key, or simply a label.
+        text = itemLabel
       } else {
         // Look up the name on the item, by these rules:
         // 1. If `itemLabel` is a string, use it as the property key
@@ -102,14 +105,13 @@ export default {
         text = item[key]
       }
       const hadLabel = !!text
-      text ||= ''
       // If no label was found so far, try to produce one from the index.
-      if (!text) {
+      if (text == null) {
         // Always use extended style when auto-generating labels from index/id:
         extended = true
-        if (isListSource(sourceSchema) && index !== null) {
-          text = `${index + 1}`
-        }
+        text = (isListSource(sourceSchema) && index !== null)
+          ? text = `${index + 1}`
+          : ''
       }
       if (extended) {
         const formLabel = getFormLabel()

package/src/types/TypeObject.vue

@@ -11,6 +11,7 @@
       // Support the same rendering options as TypeList:
       dito-schema-inlined(
         v-if="isInlined"
+        :label="objectLabel"
         :schema="getItemFormSchema(schema, objectData, context)"
         :dataPath="dataPath"
         :data="objectData"
@@ -83,6 +84,15 @@ export default TypeComponent.register('object', {
     return type
   },
 
+  computed: {
+    objectLabel() {
+      // Only show a label if the object is collapsible.
+      return this.collapsible
+        ? this.getItemLabel(this.schema, this.objectData, { asObject: true })
+        : null
+    }
+  },
+
   methods: {
     getContext() {
       return new DitoContext(this, { data: this.objectData })