@ditojs/admin 2.10.0 → 2.10.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ditojs/admin",
-  "version": "2.10.0",
+  "version": "2.10.2",
   "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,7 +33,7 @@
     "not ie_mob > 0"
   ],
   "dependencies": {
-    "@ditojs/ui": "^2.10.0",
+    "@ditojs/ui": "^2.10.2",
     "@ditojs/utils": "^2.10.0",
     "@kyvg/vue3-notification": "^2.9.1",
     "@lk77/vue3-color": "^3.0.6",
@@ -78,12 +78,12 @@
     "@vitejs/plugin-vue": "^4.2.3",
     "@vue/compiler-sfc": "^3.3.4",
     "pug": "^3.0.2",
-    "sass": "1.62.1",
+    "sass": "1.63.2",
     "typescript": "^5.1.3",
     "vite": "^4.3.9"
   },
   "types": "types",
-  "gitHead": "ef290c4c55a5e65a88fdd124634ca3edae4e735f",
+  "gitHead": "b55fe95fb3e52f5ef6a59d0fc8670c15313985d6",
   "scripts": {
     "build": "vite build",
     "watch": "yarn build --mode 'development' --watch",

package/src/DitoContext.js

@@ -22,7 +22,7 @@ const contexts = new WeakMap()
 
 function get(context, key, defaultValue) {
   const object = contexts.get(toRaw(context))
-  const value = object[key]
+  const value = key in object ? object[key] : undefined
   // If `object` explicitly sets the key to `undefined`, return it.
   return value !== undefined || hasOwnProperty.call(object, key)
     ? value

package/src/components/DitoPane.vue

@@ -292,8 +292,17 @@ export default DitoComponent.component('DitoPane', {
     }
   }
 
+  &--padding-inlined {
+    padding: 0;
+  }
+
   &--padding-nested {
     padding: $form-spacing;
+
+    &:has(> .dito-container--label-vertical:first-of-type) {
+      // Reduce top spacing when the first row has labels.
+      padding-top: $form-spacing-half;
+    }
   }
 
   .dito-break {

package/src/components/DitoSchemaInlined.vue

@@ -7,7 +7,7 @@ DitoSchema.dito-schema-inlined(
   :meta="meta"
   :store="store"
   :label="isCompact ? null : label"
-  padding="inlined"
+  :padding="padding ?? 'inlined'"
   :inlined="true"
   :disabled="disabled"
   :collapsed="collapsed"
@@ -49,6 +49,7 @@ export default DitoComponent.component('DitoSchemaInlined', {
     meta: { type: Object, required: true },
     store: { type: Object, required: true },
     label: { type: [String, Object], default: null },
+    padding: { type: String, default: null },
     disabled: { type: Boolean, required: true },
     collapsed: { type: Boolean, default: false },
     collapsible: { type: Boolean, default: false },

package/src/types/DitoTypeSection.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-.dito-section(:class="{ 'dito-section--labelled': !!schema.label }")
+.dito-section(:class="{ 'dito-section--labelled': hasLabel }")
   DitoSchemaInlined.dito-section__schema(
     :label="label"
     :schema="getItemFormSchema(schema, item, context)"
@@ -7,6 +7,7 @@
     :data="item"
     :meta="meta"
     :store="store"
+    :padding="hasLabel ? 'nested' : 'inlined'"
     :disabled="disabled"
     :collapsed="collapsed"
     :collapsible="collapsible"
@@ -31,6 +32,10 @@ export default DitoTypeComponent.register('section', {
       return this.nested ? this.value : this.data
     },
 
+    hasLabel() {
+      return !!this.schema.label
+    },
+
     collapsible: getSchemaAccessor('collapsible', {
       type: Boolean,
       default: null, // so that `??` below can do its thing:
@@ -69,16 +74,6 @@ export default DitoTypeComponent.register('section', {
     &:has(.dito-schema--open) {
       border-color: $border-color;
     }
-
-    // For animation purposes, move the padding to the contained panes.
-    > .dito-schema > .dito-schema-content > .dito-pane {
-      padding: $form-spacing;
-
-      &:has(> .dito-container--label-vertical:first-of-type) {
-        // Reduce top spacing when the first row has labels.
-        padding-top: $form-spacing-half;
-      }
-    }
   }
 }
 </style>