@ditojs/admin 0.275.0 → 1.0.0

package/src/types/TypeComponent.vue

@@ -14,7 +14,7 @@
 //   component: import('./component')
 // }
 
-import TypeComponent from '@/TypeComponent'
+import TypeComponent from '../TypeComponent.js'
 
 // @vue/component
 export default TypeComponent.register('component', {

package/src/types/TypeComputed.vue

@@ -13,9 +13,9 @@
 </template>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import TypeMixin from '@/mixins/TypeMixin'
-import DataMixin from '@/mixins/DataMixin'
+import TypeComponent from '../TypeComponent.js'
+import TypeMixin from '../mixins/TypeMixin.js'
+import DataMixin from '../mixins/DataMixin.js'
 
 export default TypeComponent.register([
   'computed', 'data', 'hidden'

package/src/types/TypeDate.vue

@@ -13,8 +13,8 @@
 </template>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import { getSchemaAccessor } from '@/utils/accessor'
+import TypeComponent from '../TypeComponent.js'
+import { getSchemaAccessor } from '../utils/accessor.js'
 import { DatePicker, TimePicker, DateTimePicker } from '@ditojs/ui'
 import { isDate } from '@ditojs/utils'
 

package/src/types/TypeLabel.vue

@@ -9,7 +9,7 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
+import TypeComponent from '../TypeComponent.js'
 
 // @vue/component
 export default TypeComponent.register('label', {

package/src/types/TypeList.vue

@@ -167,14 +167,14 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import DitoContext from '@/DitoContext'
-import SourceMixin from '@/mixins/SourceMixin'
-import OrderedMixin from '@/mixins/OrderedMixin'
+import TypeComponent from '../TypeComponent.js'
+import DitoContext from '../DitoContext.js'
+import SourceMixin from '../mixins/SourceMixin.js'
+import OrderedMixin from '../mixins/OrderedMixin.js'
 import VueDraggable from 'vuedraggable'
-import { getNamedSchemas, getViewEditPath } from '@/utils/schema'
-import { getFiltersPanel } from '@/utils/filter'
-import { appendDataPath } from '@/utils/data'
+import { getNamedSchemas, getViewEditPath } from '../utils/schema.js'
+import { getFiltersPanel } from '../utils/filter.js'
+import { appendDataPath } from '../utils/data.js'
 import { pickBy, equals, hyphenate } from '@ditojs/utils'
 
 // @vue/component

package/src/types/TypeMarkup.vue

@@ -115,9 +115,9 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import DomMixin from '@/mixins/DomMixin'
-import { getSchemaAccessor } from '@/utils/accessor'
+import TypeComponent from '../TypeComponent.js'
+import DomMixin from '../mixins/DomMixin.js'
+import { getSchemaAccessor } from '../utils/accessor.js'
 import { Editor, EditorContent, EditorMenuBar, Mark } from 'tiptap'
 import { toggleMark } from 'tiptap-commands'
 import {

package/src/types/TypeMultiselect.vue

@@ -140,7 +140,7 @@
         line-height: $tag-line-height
     .multiselect__option--highlight
       &::after
-        diplay: block
+        display: block
         position: absolute
         background: transparent
         color: $color-white
@@ -223,11 +223,11 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import DitoContext from '@/DitoContext'
-import OptionsMixin from '@/mixins/OptionsMixin'
+import TypeComponent from '../TypeComponent.js'
+import DitoContext from '../DitoContext.js'
+import OptionsMixin from '../mixins/OptionsMixin.js'
 import VueMultiselect from 'vue-multiselect'
-import { getSchemaAccessor } from '@/utils/accessor'
+import { getSchemaAccessor } from '../utils/accessor.js'
 import 'vue-multiselect/dist/vue-multiselect.min.css'
 
 // @vue/component

package/src/types/TypeNumber.vue

@@ -22,8 +22,8 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import NumberMixin from '@/mixins/NumberMixin'
+import TypeComponent from '../TypeComponent.js'
+import NumberMixin from '../mixins/NumberMixin.js'
 import { InputField } from '@ditojs/ui'
 
 export default TypeComponent.register([

package/src/types/TypeObject.vue

@@ -68,9 +68,9 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import DitoContext from '@/DitoContext'
-import SourceMixin from '@/mixins/SourceMixin'
+import TypeComponent from '../TypeComponent.js'
+import DitoContext from '../DitoContext.js'
+import SourceMixin from '../mixins/SourceMixin.js'
 
 // @vue/component
 export default TypeComponent.register('object', {

package/src/types/TypePanel.vue

@@ -1,5 +1,5 @@
 <script>
-import TypeComponent from '@/TypeComponent'
+import TypeComponent from '../TypeComponent.js'
 
 // @vue/component
 export default TypeComponent.register('panel', {

package/src/types/TypeProgress.vue

@@ -10,8 +10,8 @@
 </template>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import NumberMixin from '@/mixins/NumberMixin'
+import TypeComponent from '../TypeComponent.js'
+import NumberMixin from '../mixins/NumberMixin.js'
 
 // @vue/component
 export default TypeComponent.register('progress', {

package/src/types/TypeRadio.vue

@@ -25,8 +25,8 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import OptionsMixin from '@/mixins/OptionsMixin'
+import TypeComponent from '../TypeComponent.js'
+import OptionsMixin from '../mixins/OptionsMixin.js'
 
 // @vue/component
 export default TypeComponent.register('radio', {

package/src/types/TypeSection.vue

@@ -22,8 +22,8 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import { getItemFormSchema } from '@/utils/schema'
+import TypeComponent from '../TypeComponent.js'
+import { getItemFormSchema, processSchemaComponents } from '../utils/schema.js'
 
 // @vue/component
 export default TypeComponent.register('section', {
@@ -41,6 +41,11 @@ export default TypeComponent.register('section', {
 
   methods: {
     getItemFormSchema
+  },
+
+  async processSchema(api, schema, name, routes, level) {
+    // Process section components so their forms get resolved too.
+    await processSchemaComponents(api, schema, routes, level)
   }
 })
 </script>

package/src/types/TypeSelect.vue

@@ -68,8 +68,8 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import OptionsMixin from '@/mixins/OptionsMixin'
+import TypeComponent from '../TypeComponent.js'
+import OptionsMixin from '../mixins/OptionsMixin.js'
 
 // @vue/component
 export default TypeComponent.register('select', {

package/src/types/TypeSlider.vue

@@ -38,9 +38,9 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import NumberMixin from '@/mixins/NumberMixin'
-import { getSchemaAccessor } from '@/utils/accessor'
+import TypeComponent from '../TypeComponent.js'
+import NumberMixin from '../mixins/NumberMixin.js'
+import { getSchemaAccessor } from '../utils/accessor.js'
 import { InputField } from '@ditojs/ui'
 
 // @vue/component

package/src/types/TypeSwitch.vue

@@ -17,7 +17,7 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
+import TypeComponent from '../TypeComponent.js'
 import { SwitchButton } from '@ditojs/ui'
 
 // @vue/component

package/src/types/TypeText.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script>
-import TypeComponent from '@/TypeComponent'
+import TypeComponent from '../TypeComponent.js'
 import { InputField } from '@ditojs/ui'
 
 const maskedPassword = '****************'

package/src/types/TypeTextarea.vue

@@ -20,8 +20,8 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import { getSchemaAccessor } from '@/utils/accessor'
+import TypeComponent from '../TypeComponent.js'
+import { getSchemaAccessor } from '../utils/accessor.js'
 
 // @vue/component
 export default TypeComponent.register('textarea', {

package/src/types/TypeTreeList.vue

@@ -40,9 +40,9 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import SourceMixin from '@/mixins/SourceMixin'
-import { hasFormSchema, getFormSchemas } from '@/utils/schema'
+import TypeComponent from '../TypeComponent.js'
+import SourceMixin from '../mixins/SourceMixin.js'
+import { hasFormSchema, getFormSchemas } from '../utils/schema.js'
 
 export default TypeComponent.register([
   'tree-list', 'tree-object'

package/src/types/TypeUpload.vue

@@ -105,15 +105,15 @@
 </style>
 
 <script>
-import TypeComponent from '@/TypeComponent'
-import DitoContext from '@/DitoContext'
-import OrderedMixin from '@/mixins/OrderedMixin'
+import TypeComponent from '../TypeComponent.js'
+import DitoContext from '../DitoContext.js'
+import OrderedMixin from '../mixins/OrderedMixin.js'
 import VueUpload from 'vue-upload-component'
 import VueDraggable from 'vuedraggable'
 import parseFileSize from 'filesize-parser'
-import { getSchemaAccessor } from '@/utils/accessor'
-import { formatFileSize } from '@/utils/units'
-import { appendDataPath } from '@/utils/data'
+import { getSchemaAccessor } from '../utils/accessor.js'
+import { formatFileSize } from '../utils/units.js'
+import { appendDataPath } from '../utils/data.js'
 import { isArray, asArray, escapeHtml } from '@ditojs/utils'
 
 // @vue/component

package/src/types/index.js

@@ -2,28 +2,28 @@
 // DitoComponent and can be retrieved through TypeComponent.get(type) and
 // rendered through their component-names (e.g. dito-type-list).
 
-import './TypeButton'
-import './TypeCheckbox'
-import './TypeCheckboxes'
-import './TypeCode'
-import './TypeColor'
-import './TypeComponent'
-import './TypeComputed'
-import './TypeDate'
-import './TypeList'
-import './TypeLabel'
-import './TypeMarkup'
-import './TypeMultiselect'
-import './TypeNumber'
-import './TypeObject'
-import './TypePanel'
-import './TypeProgress'
-import './TypeRadio'
-import './TypeSection'
-import './TypeSelect'
-import './TypeSlider'
-import './TypeSwitch'
-import './TypeText'
-import './TypeTextarea'
-import './TypeTreeList'
-import './TypeUpload'
+export { default as TypeButton } from './TypeButton.vue'
+export { default as TypeCheckbox } from './TypeCheckbox.vue'
+export { default as TypeCheckboxes } from './TypeCheckboxes.vue'
+export { default as TypeCode } from './TypeCode.vue'
+export { default as TypeColor } from './TypeColor.vue'
+export { default as TypeComponent } from './TypeComponent.vue'
+export { default as TypeComputed } from './TypeComputed.vue'
+export { default as TypeDate } from './TypeDate.vue'
+export { default as TypeList } from './TypeList.vue'
+export { default as TypeLabel } from './TypeLabel.vue'
+export { default as TypeMarkup } from './TypeMarkup.vue'
+export { default as TypeMultiselect } from './TypeMultiselect.vue'
+export { default as TypeNumber } from './TypeNumber.vue'
+export { default as TypeObject } from './TypeObject.vue'
+export { default as TypePanel } from './TypePanel.vue'
+export { default as TypeProgress } from './TypeProgress.vue'
+export { default as TypeRadio } from './TypeRadio.vue'
+export { default as TypeSection } from './TypeSection.vue'
+export { default as TypeSelect } from './TypeSelect.vue'
+export { default as TypeSlider } from './TypeSlider.vue'
+export { default as TypeSwitch } from './TypeSwitch.vue'
+export { default as TypeText } from './TypeText.vue'
+export { default as TypeTextarea } from './TypeTextarea.vue'
+export { default as TypeTreeList } from './TypeTreeList.vue'
+export { default as TypeUpload } from './TypeUpload.vue'

package/src/utils/SchemaGraph.js

@@ -1,4 +1,4 @@
-import { isTemporaryId } from './data'
+import { isTemporaryId } from './data.js'
 import {
   isInteger, asArray, parseDataPath, getValueAtDataPath
 } from '@ditojs/utils'

package/src/utils/schema.js

@@ -1,10 +1,10 @@
 import Vue from 'vue'
-import DitoContext from '@/DitoContext'
-import { getUid } from './uid'
-import { SchemaGraph } from './SchemaGraph'
-import { appendDataPath, isTemporaryId } from './data'
+import DitoContext from '../DitoContext.js'
+import { getUid } from './uid.js'
+import { SchemaGraph } from './SchemaGraph.js'
+import { appendDataPath, isTemporaryId } from './data.js'
 import {
-  isObject, isString, isArray, isFunction, isPromise, clone, camelize
+  isObject, isString, isArray, isFunction, isPromise, clone, camelize, isModule
 } from '@ditojs/utils'
 
 const typeComponents = {}
@@ -71,20 +71,68 @@ export function everySchemaComponent(schema, callback) {
   ) !== false
 }
 
-export async function resolveViews(unresolvedViews) {
-  let views = isFunction(unresolvedViews)
-    ? unresolvedViews()
-    : unresolvedViews
-  if (isPromise(views)) {
-    views = await views
+export async function resolveSchema(schema, unwrapModule = false) {
+  if (isFunction(schema)) {
+    schema = schema()
+  }
+  if (isPromise(schema)) {
+    schema = await schema
+  }
+  if (isModule(schema)) {
+    // Copy to convert from module to object:
+    schema = { ...schema }
+    // Unwrap default or named schema
+    if (!schema.name && (unwrapModule || schema.default)) {
+      const keys = Object.keys(schema)
+      if (keys.length === 1) {
+        const name = keys[0]
+        schema = schema[name]
+        schema.name = name
+      }
+    }
+  }
+  return schema
+}
+
+export async function resolveSchemas(
+  unresolvedSchemas,
+  resolveItem = resolveSchema
+) {
+  let schemas = isFunction(unresolvedSchemas)
+    ? unresolvedSchemas()
+    : unresolvedSchemas
+  schemas = await resolveSchema(schemas, false)
+  if (isArray(schemas)) {
+    // Translate an array of dynamic import, each importing one named schema
+    // module to an object with named entries.
+    schemas = Object.fromEntries(await Promise.all(schemas.map(
+      async item => {
+        const schema = await resolveItem(item, true)
+        return [schema.name, schema]
+      }
+    )))
+  } else if (isObject(schemas)) {
+    schemas = Object.fromEntries(await Promise.all(Object.entries(schemas).map(
+      async ([key, item]) => {
+        const schema = await resolveItem(item, true)
+        return [key, schema]
+      }
+    )))
+  }
+  return schemas
+}
+
+export async function resolvePanels(schema) {
+  const { panels } = schema
+  if (schema.panels) {
+    schema.panels = await resolveSchemas(panels)
   }
-  // Copy views to convert from module to object, and keep  a global reference:
-  return { ...views }
 }
 
 export async function processView(component, api, schema, name, routes) {
   const children = []
   processRouteSchema(api, schema, name)
+  await resolvePanels(schema)
   if (isSingleComponentView(schema)) {
     await processComponent(api, schema, name, children, 0)
   } else {
@@ -128,7 +176,7 @@ export async function processForms(api, schema, level) {
   // First resolve the forms and store the results back on the schema.
   let { form, forms, components } = schema
   if (forms) {
-    forms = schema.forms = await resolveForms(forms)
+    forms = schema.forms = await resolveSchemas(forms, resolveForm)
   } else if (form) {
     form = schema.form = await resolveForm(form)
   } else if (components) {
@@ -147,36 +195,13 @@ export async function processForms(api, schema, level) {
 }
 
 export async function resolveForm(form) {
-  if (isFunction(form)) {
-    form = form()
-  }
-  if (isPromise(form)) {
-    form = await form
-  }
-  // When dynamically importing forms, the actual form can be received named or
-  // as `default` in a nested object, detect and handle this case:
-  if (form && !('components' in form)) {
-    // Assume the form is the first export (named or default)
-    const name = Object.keys(form)[0]
-    form = form[name]
-    if (form && name !== 'default') {
-      form.name = name
-    }
+  form = await resolveSchema(form, true)
+  if (form) {
+    await resolvePanels(form)
   }
   return form
 }
 
-export async function resolveForms(forms) {
-  const results = await Promise.all(Object.values(forms).map(resolveForm))
-  return Object.keys(forms).reduce(
-    (mapped, key, index) => {
-      mapped[key] = results[index]
-      return mapped
-    },
-    {}
-  )
-}
-
 export function isSingleComponentView(schema) {
   // If the schema has a type, it is a single-component view.
   return !!schema.type

package/src/validations/index.js

@@ -1,12 +1,12 @@
-export * from './_creditcard'
-export * from './_decimals'
-export * from './_email'
-export * from './_hostname'
-export * from './_domain'
-export * from './_integer'
-export * from './_max'
-export * from './_min'
-export * from './_password'
-export * from './_range'
-export * from './_required'
-export * from './_url'
+export * from './_creditcard.js'
+export * from './_decimals.js'
+export * from './_email.js'
+export * from './_hostname.js'
+export * from './_domain.js'
+export * from './_integer.js'
+export * from './_max.js'
+export * from './_min.js'
+export * from './_password.js'
+export * from './_range.js'
+export * from './_required.js'
+export * from './_url.js'

package/LICENSE

@@ -1,20 +0,0 @@
-MIT License
-
-Copyright (c) 2018-2021 Lineto GmbH & Jürg Lehni <juerg@scratchdisk.com>
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
-FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
-COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
-IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
-CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/dist/demo.html

@@ -1,8 +0,0 @@
-<meta charset="utf-8">
-<title>dito-admin demo</title>
-<script src="./dito-admin.umd.js"></script>
-
-
-<script>
-console.log(dito-admin)
-</script>