@ditojs/admin 1.11.0 → 1.13.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ditojs/admin",
-  "version": "1.11.0",
+  "version": "1.13.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",
@@ -17,12 +17,14 @@
   },
   "files": [
     "src/",
-    "dist/"
+    "dist/",
+    "types/"
   ],
   "scripts": {
     "build": "vite build",
     "watch": "yarn build --mode 'development' --watch",
-    "prepare": "yarn build"
+    "prepare": "yarn build",
+    "types": "tsc --noEmit types/index.d.ts"
   },
   "engines": {
     "node": ">= 18.0.0",
@@ -35,8 +37,8 @@
     "not ie_mob > 0"
   ],
   "dependencies": {
-    "@ditojs/ui": "^1.11.0",
-    "@ditojs/utils": "^1.11.0",
+    "@ditojs/ui": "^1.13.0",
+    "@ditojs/utils": "^1.13.0",
     "codeflask": "^1.4.1",
     "filesize": "^10.0.5",
     "filesize-parser": "^1.5.0",
@@ -58,11 +60,14 @@
     "vuedraggable": "^2.24.3"
   },
   "devDependencies": {
-    "@ditojs/build": "^1.11.0",
+    "@ditojs/build": "^1.13.0",
     "pug": "^3.0.2",
     "sass": "1.55.0",
+    "type-fest": "^3.1.0",
+    "typescript": "^4.8.4",
     "vite": "^3.2.2",
     "vite-plugin-vue2": "^2.0.2"
   },
-  "gitHead": "cc2a838ccf15a75f435844f3087698c4efaf44e4"
+  "types": "types",
+  "gitHead": "b65d7d15871b0d11579565df92780536ef2926da"
 }

package/src/DitoAdmin.js

@@ -39,8 +39,8 @@ export default class DitoAdmin {
     api.locale ||= 'en-US'
     api.formats = merge({}, defaultFormats, api.formats)
     api.request ||= options => request(api, options)
-    api.getApiUrl ||= path => getApiUrl(api, path)
-    api.isApiRequest ||= url => isApiRequest(api, url)
+    api.getApiUrl ||= options => getApiUrl(api, options)
+    api.isApiUrl ||= url => isApiUrl(api, url)
     // Setting `api.normalizePaths = true (plural) sets both:
     // `api.normalizePath = hyphenate` and `api.denormalizePath = camelize`
     api.normalizePath ||= api.normalizePaths ? hyphenate : val => val
@@ -199,8 +199,8 @@ class RequestError extends Error {
 async function request(api, {
   url,
   method = 'get',
-  // TODO: `params` was deprecated in favor of `query` on 2022-11-01, remove
-  // once not in use anywhere anymore.
+  // TODO: `request.params` was deprecated in favor of `query` on 2022-11-01,
+  // remove once not in use anywhere anymore.
   params = null,
   query = params || null,
   headers = null,
@@ -210,39 +210,40 @@ async function request(api, {
     deprecate(`request.params is deprecated. Use action.method and action.path instead.`)
   }
 
-  const isApiRequest = api.isApiRequest(url)
-  if (isApiRequest && !isAbsoluteUrl(url)) {
-    url = api.getApiUrl(url)
-  }
+  const isApiUrl = api.isApiUrl(url)
 
-  const search = query && new URLSearchParams(query).toString()
-  if (search) {
-    url = `${url}?${search}`
-  }
-
-  const response = await fetch(url, {
+  const response = await fetch(api.getApiUrl({ url, query }), {
     method: method.toUpperCase(),
     ...(data && { body: JSON.stringify(data) }),
     headers: {
-      ...(isApiRequest && api.headers),
+      ...(isApiUrl && api.headers),
       ...headers
     },
-    credentials: isApiRequest && api.cors?.credentials
+    credentials: isApiUrl && api.cors?.credentials
       ? 'include'
       : 'same-origin'
   })
-  response.data = await response.json()
+
+  if (response.headers.get('Content-Type')?.includes('application/json')) {
+    response.data = await response.json()
+  }
+
   if (!response.ok) {
     throw new RequestError(response)
   }
   return response
 }
 
-function getApiUrl(api, path) {
-  // Use same approach as axios `combineURLs()` to join baseURL with path:
-  return `${api.url.replace(/\/+$/, '')}/${path.replace(/^\/+/, '')}`
+function getApiUrl(api, { url, query }) {
+  if (!isAbsoluteUrl(url)) {
+    // Use same approach as axios `combineURLs()` to join baseURL with path:
+    url = `${api.url.replace(/\/+$/, '')}/${url.replace(/^\/+/, '')}`
+  }
+  // Support optional query parameters, to be are added to the URL.
+  const search = query && new URLSearchParams(query).toString()
+  return search ? `${url}?${search}` : url
 }
 
-function isApiRequest(api, url) {
+function isApiUrl(api, url) {
   return !isAbsoluteUrl(url) || url.startsWith(api.url)
 }

package/src/mixins/DitoMixin.js

@@ -292,19 +292,14 @@ export default {
     },
 
     getResourceUrl(resource) {
-      const path = this.getResourcePath(resource)
-      if (!path) return null
-      const url = this.api.getApiUrl(path)
-      // Support optional query parameters, to be are added to the URL.
-      const { query } = resource
-      const search = query && new URLSearchParams(query).toString()
-      return search ? `${url}?${search}` : url
+      const url = this.getResourcePath(resource)
+      return url ? this.api.getApiUrl({ url, query: resource.query }) : null
     },
 
     async sendRequest({ method, url, resource, query, data, internal }) {
       url ||= this.getResourcePath(resource)
       method ||= resource?.method
-      const checkUser = !internal && this.api.isApiRequest(url)
+      const checkUser = !internal && this.api.isApiUrl(url)
       if (checkUser) {
         await this.rootComponent.ensureUser()
       }
@@ -334,7 +329,9 @@ export default {
       const cacheKey = loadCache && `${
         options.method || 'get'} ${
         options.url} ${
-        JSON.stringify(options.params || '')} ${
+        // TODO: `request.params` was deprecated in favor of `query` on
+        // 2022-11-01, remove once not in use anywhere anymore.
+        JSON.stringify(options.query || options.params || '')} ${
         JSON.stringify(options.data || '')
       }`
       if (loadCache && (cacheKey in loadCache)) {
@@ -383,13 +380,10 @@ export default {
       if (isString(options)) {
         options = { url: options }
       }
-      const { url, filename } = options
       // See: https://stackoverflow.com/a/49917066/1163708
       const a = document.createElement('a')
-      a.href = url
-      if (filename) {
-        a.download = filename
-      }
+      a.href = this.api.getApiUrl(options)
+      a.download = options.filename ?? null
       const { body } = document
       body.appendChild(a)
       a.click()

package/src/types/TypeColor.vue

@@ -135,11 +135,13 @@ export default TypeComponent.register('color', {
       default: 'hex'
     }),
 
+    // TODO: Rename to `showAlpha`?
     alpha: getSchemaAccessor('alpha', {
       type: Boolean,
       default: false
     }),
 
+    // TODO: Rename to `showInputs`?
     inputs: getSchemaAccessor('inputs', {
       type: Boolean,
       default: true

package/src/types/TypeMultiselect.vue

@@ -293,8 +293,8 @@ export default TypeComponent.register('multiselect', {
     placeholder() {
       const { placeholder, searchable, taggable } = this.schema
       return placeholder || (
-        searchable && taggable ? 'Search or add a tag'
-        : searchable ? 'Select or search entry'
+        searchable && taggable ? `Search or add a ${this.label}`
+        : searchable ? `Select or search ${this.label}`
         : undefined
       )
     }

package/src/types/TypeSlider.vue

@@ -50,6 +50,7 @@ export default TypeComponent.register('slider', {
   nativeField: true,
 
   computed: {
+    // TODO: Rename to `showInput`?
     input: getSchemaAccessor('input', {
       type: Boolean,
       default: true