@ditojs/admin 2.75.1 → 2.75.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ditojs/admin",
-  "version": "2.75.1",
+  "version": "2.75.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",
@@ -93,5 +93,5 @@
     "typescript": "^5.9.3",
     "vite": "^7.3.1"
   },
-  "gitHead": "d16421580ee018bd1e606570bbf7b41c0f537fc8"
+  "gitHead": "70ff8a3042925a27c2b2a792505db04038f92493"
 }

package/src/components/DitoAffixes.vue

@@ -21,6 +21,10 @@
     @mousedown.stop
   )
   slot(name="append")
+  .dito-info(
+    v-if="inlineInfo"
+    :data-info="inlineInfo"
+  )
 </template>
 
 <script>
@@ -41,6 +45,7 @@ export default DitoComponent.component('DitoAffixes', {
     absolute: { type: Boolean, default: false },
     clearable: { type: Boolean, default: false },
     disabled: { type: Boolean, default: false },
+    inlineInfo: { type: String, default: null },
     parentContext: { type: Object, required: true }
   },
 
@@ -85,6 +90,7 @@ export default DitoComponent.component('DitoAffixes', {
       return (
         this.visibleItems.length > 0 ||
         this.clearable ||
+        this.inlineInfo ||
         hasSlotContent(this.$slots.prepend) ||
         hasSlotContent(this.$slots.append)
       )

package/src/components/DitoContainer.vue

@@ -210,9 +210,9 @@ export default DitoComponent.component('DitoContainer', {
       const { class: classes } = this.schema
       const prefix = 'dito-container'
       return {
-        [`${prefix}--single`]: this.single,
         [`${prefix}--disabled`]: this.componentDisabled,
         [`${prefix}--has-errors`]: !!this.errors,
+        [`${prefix}--single`]: this.single,
         [`${prefix}--compact`]: this.compact,
         [`${prefix}--label-vertical`]: this.verticalLabels,
         [`${prefix}--omit-spacing`]: omitSpacing(this.schema),

package/src/components/DitoLabel.vue

@@ -122,6 +122,8 @@ export default DitoComponent.component('DitoLabel', {
   }
 
   label {
+    @include ellipsis;
+
     cursor: inherit;
     font-weight: bold;
     line-height: $input-height;

package/src/components/DitoNotifications.vue

@@ -23,7 +23,7 @@ export default DitoComponent.component('DitoNotifications', {
   },
 
   methods: {
-    notify({ type = 'info', title, text, error } = {}) {
+    notify({ type = 'info', title, text, error, duration } = {}) {
       title ||= (
         {
           warning: 'Warning',
@@ -59,8 +59,13 @@ export default DitoComponent.component('DitoNotifications', {
         // amount of milliseconds multiplied with the amount of characters
         // displayed in the notification, plus 40 (40 + title + message):
         const { durationFactor = 20 } = notifications
-        const duration = (40 + text.length + title.length) * durationFactor
-        this.$notify({ type, title, text, duration })
+        duration ??= (40 + text.length + title.length) * durationFactor
+        this.$notify({
+          type,
+          title,
+          text,
+          duration: duration === 0 ? -1 : duration // < 0 -> <= 0 = sticky
+        })
       }
     },
 

package/src/components/DitoPane.vue

@@ -65,8 +65,8 @@ export default DitoComponent.component('DitoPane', {
     meta: { type: Object, required: true },
     store: { type: Object, required: true },
     tab: { type: String, default: null },
-    padding: { type: String, default: null },
     single: { type: Boolean, default: false },
+    padding: { type: String, default: null },
     disabled: { type: Boolean, default: false },
     compact: { type: Boolean, default: false },
     generateLabels: { type: Boolean, default: false },
@@ -86,9 +86,10 @@ export default DitoComponent.component('DitoPane', {
     },
 
     classes() {
+      const prefix = 'dito-pane'
       return {
-        'dito-pane--single': this.isSingleComponent,
-        [`dito-pane--padding-${this.padding}`]: !!this.padding
+        [`${prefix}--single`]: this.isSingleComponent,
+        [`${prefix}--padding-${this.padding}`]: !!this.padding
       }
     },
 

package/src/components/DitoSchema.vue

@@ -72,7 +72,7 @@ slot(name="prepend")
             :meta="meta"
             :store="store"
             :padding="padding"
-            :single="!inlined && !hasMainPane"
+            :single="single && !inlined && !hasMainPane"
             :disabled="disabled"
             :compact="compact"
             :generateLabels="generateLabels"
@@ -87,7 +87,7 @@ slot(name="prepend")
         :meta="meta"
         :store="store"
         :padding="padding"
-        :single="!inlined && !hasTabs"
+        :single="single && !inlined && !hasTabs"
         :disabled="disabled"
         :compact="compact"
         :generateLabels="generateLabels"
@@ -156,6 +156,7 @@ export default DitoComponent.component('DitoSchema', {
     meta: { type: Object, default: () => ({}) },
     store: { type: Object, default: () => ({}) },
     label: { type: [String, Object], default: null },
+    single: { type: Boolean, default: false },
     padding: { type: String, default: null },
     active: { type: Boolean, default: true },
     inlined: { type: Boolean, default: false },

package/src/components/DitoView.vue

@@ -23,6 +23,7 @@ template(
       padding="root"
       :disabled="isLoading"
       scrollable
+      single
     )
 </template>
 

package/src/mixins/TypeMixin.js

@@ -101,6 +101,17 @@ export default {
       type: String
     }),
 
+    info: getSchemaAccessor('info', {
+      type: String,
+      default: null
+    }),
+
+    inlineInfo() {
+      // When a label is present, info is shown in the label component.
+      // Otherwise, we have to show it inline.
+      return !this.label ? this.info : null
+    },
+
     events() {
       const events = this.getEvents()
       // Register callbacks for all provides non-recognized events,

package/src/types/DitoTypeButton.vue

@@ -72,11 +72,6 @@ export default DitoTypeComponent.register(
         return this.text || labelize(this.verb)
       },
 
-      info: getSchemaAccessor('info', {
-        type: String,
-        default: null
-      }),
-
       prefixes() {
         return asArray(this.schema.prefix)
       },

package/src/types/DitoTypeColor.vue

@@ -28,6 +28,7 @@ DitoTrigger.dito-color(
           mode="input"
           :clearable="showClearButton"
           :disabled="disabled"
+          :inlineInfo="inlineInfo"
           :parentContext="context"
           @clear="clear"
         )

package/src/types/DitoTypeDate.vue

@@ -26,6 +26,7 @@
         absolute
         :clearable="showClearButton"
         :disabled="disabled"
+        :inlineInfo="inlineInfo"
         :parentContext="context"
         @clear="clear"
       )

package/src/types/DitoTypeMultiselect.vue

@@ -42,6 +42,7 @@
       absolute
       :clearable="showClearButton"
       :disabled="disabled"
+      :inlineInfo="inlineInfo"
       :parentContext="context"
       @clear="clear"
     )

package/src/types/DitoTypeNumber.vue

@@ -24,6 +24,7 @@ DitoInput.dito-number(
       mode="input"
       :clearable="showClearButton"
       :disabled="disabled"
+      :inlineInfo="inlineInfo"
       :parentContext="context"
       @clear="clear"
     )

package/src/types/DitoTypeSelect.vue

@@ -47,6 +47,7 @@
       absolute
       :clearable="showClearButton"
       :disabled="disabled"
+      :inlineInfo="inlineInfo"
       :parentContext="context"
       @clear="clear"
     )

package/src/types/DitoTypeText.vue

@@ -21,6 +21,7 @@ DitoInput.dito-text(
       mode="input"
       :clearable="showClearButton"
       :disabled="disabled"
+      :inlineInfo="inlineInfo"
       :parentContext="context"
       @clear="clear"
     )