waibu-bootstrap 2.8.2 → 2.9.1

package/extend/waibuMpa/theme/component/widget/_lib.js

@@ -1,11 +1,19 @@
 import { sizes } from '../method/after-build-tag/_lib.js'
 
 async function getInputAttr (group, formControl = true, ro) {
-  const { has, omit, forOwn, isPlainObject, isArray, get, isString } = this.app.lib._
+  const { has, omit, isPlainObject, isArray, isString } = this.app.lib._
   const { callHandler } = this.app.bajo
   const { req } = this.component
   const { escape } = this.app.waibu
 
+  const buildOptions = (v, prop) => {
+    if (isString(v)) v = { value: v, text: v }
+    const { camelCase } = this.app.lib._
+    const key = camelCase(`${prop.name} ${v.text}`)
+    if (req.te(key)) v.text = req.t(key)
+    return v
+  }
+
   if (formControl) group._.class.push('form-control')
   const attr = omit(group._, ['hint', 'label', 'wrapper'])
   if (has(attr, 'name') && !has(attr, 'value')) {
@@ -14,26 +22,19 @@ async function getInputAttr (group, formControl = true, ro) {
       const prop = this.getProp(attr.name)
       attr.dataType = attr.dataType ?? prop.type
       attr.dataValue = this.formData[attr.name]
-      if (isPlainObject(attr.dataValue) || isArray(attr.dataValue)) attr.dataValue = JSON.stringify(attr.dataValue)
-      attr.value = escape(get(this.formData, `_fmt.${attr.name}`, attr.dataValue))
-      attr.dataValue = escape(attr.dataValue)
       if (prop.values) {
-        const values = (isString(prop.values) ? await callHandler(prop.values) : [...prop.values]).map(v => {
-          if (isString(v)) v = { value: v, text: v }
-          const { camelCase } = this.app.lib._
-          const key = camelCase(`${prop.name} ${v.text}`)
-          if (req.te(key)) v.text = req.t(key)
-          return v
-        })
-        attr.options = values
+        attr.options = (isString(prop.values) ? await callHandler(prop.values) : [...prop.values]).map(v => buildOptions(v, prop))
+      } else if (isPlainObject(attr.dataValue)) {
+        attr.dataValue = JSON.stringify(attr.dataValue)
+        attr.value = attr.dataValue
+      } else if (isArray(attr.dataValue)) {
+        attr.options = attr.dataValue.map(v => buildOptions(v, prop))
+      } else {
+        attr.value = attr.dataValue
       }
+      attr.dataValue = escape(attr.dataValue)
     }
   }
-  if (attr.href) {
-    forOwn(this.formData, (v, k) => {
-      attr.href = attr.href.replace(`{${k}}`, v)
-    })
-  }
   if (sizes.includes(attr.size) && formControl) attr.class.push(`form-control-${attr.size}`)
   return omit(attr, ['size', 'col'])
 }
@@ -102,19 +103,11 @@ export async function buildFormRadioToggle (group, params) {
 }
 
 export async function buildFormPlaintext (group, params) {
+  const { omit } = this.app.lib._
   const attr = await getInputAttr.call(this, group, false, true)
   attr.class.push('form-control-plaintext')
   attr.readonly = ''
-  if (['object', 'array', 'text'].includes(attr.dataType)) {
-    attr.style.minHeight = '100px'
-    return await this.component.buildTag({ tag: 'textarea', attr, html: attr.value })
-  }
-  if (attr.href) {
-    const content = attr.value ? this.component.req.t(attr.value) : attr.href
-    const html = await this.component.buildTag({ tag: 'a', attr: { href: attr.href, content } })
-    return await this.component.buildTag({ tag: 'div', attr, html })
-  }
-  return await this.component.buildTag({ tag: 'input', attr, selfClosing: true })
+  return await this.component.buildTag({ tag: 'div', attr: omit(attr, ['value']), html: attr.value })
 }
 
 export async function buildFormColor (group, params) {
@@ -143,7 +136,12 @@ export async function buildFormSelect (group, params) {
   const { omit, trim } = this.app.lib._
   const { isSet } = this.app.lib.aneka
   const { $ } = this.component
+  const { unescape } = this.app.waibu
   let attr = await getInputAttr.call(this, group, false)
+  if (attr.remoteUrl) delete attr.options
+  try {
+    attr.dataValue = JSON.parse(unescape(attr.dataValue)).join('|')
+  } catch (err) {}
   attr.value = isSet(attr.value) ? (attr.value + '') : undefined
   attr.class.push('form-select')
   let html = params.html

package/extend/waibuMpa/theme/component/widget/form-plaintext.js

@@ -4,9 +4,9 @@ import { build } from './form-input.js'
 async function formPlaintext () {
   return class FormPlaintext extends this.app.baseClass.MpaWidget {
     build = async () => {
+      const { req } = this.component
       const { isEmpty, get } = this.app.lib._
       const { escape } = this.app.waibu
-      const { isHtmlLink } = this.app.bajoExtra
       this.params.attr.disabled = true
       const { name } = this.params.attr
       if (this.params.attr.labelFloating) this.params.attr.class.push('border', 'rounded')
@@ -17,11 +17,13 @@ async function formPlaintext () {
         const format = get(this.schema, `view.format.${name}`)
         const labelField = get(this.schema, `view.widget.${name}.attr.labelField`)
         if (prop.ref) {
-          const newValue = this.getRefValue({ field: name, labelField, refName: this.getRefName(name) })
-          if (format && !isEmpty(newValue)) this.params.attr.href = await format.call(this, newValue, this.formData, { linkOnly: true })
-        } else if (format && !isEmpty(value)) value = await format.call(this, value, this.formData)
+          const result = this.getRefValue({ field: name, labelField, refName: this.getRefName(name) })
+          if (result) {
+            value = format ? await format.call(this, value, this.formData, { req }) : result
+          }
+        } else if (format) value = await format.call(this, value, this.formData, { req })
         this.params.attr.dataValue = escape(dataValue)
-        if (!isHtmlLink(value)) this.params.attr.value = escape(value)
+        this.params.attr.value = value
         this.params.attr.dataType = prop.type
       }
       await build.call(this, buildFormPlaintext, this.params)

package/extend/waibuMpa/theme/component/widget/form-select-ext.js

@@ -25,13 +25,20 @@ async function formSelectExt () {
       this.params.attr.id = this.params.attr.id ?? generateId('alpha')
       this.params.attr['x-ref'] = xref
       const xData = ['instance: null', 'value: null']
-      const plugins = ['drag_drop']
-      if (!this.params.attr.noDropdownInput) plugins.push('dropdown_input')
-      if (this.params.attr.removeBtn) plugins.push('remove_button')
-      if (this.params.attr.clearBtn) plugins.push('clear_button')
-      if (this.params.attr.optgroupColumns) plugins.push('optgroup_columns')
+      const plugins = {
+        drag_drop: {}
+      }
+      if (!this.params.attr.noDropdownInput) plugins.dropdown_input = {}
+      // if (this.params.attr.removeBtn) plugins.remove_button = {}
+      if (this.params.attr.clearBtn) plugins.clear_button = {}
+      if (this.params.attr.optgroupColumns) plugins.optgroup_columns = {}
+      if (this.params.attr.multiple) {
+        plugins.checkbox_options = {}
+        plugins.clear_button = {}
+      }
       if (this.params.attr.noCaret) this.params.attr.class.push('no-caret') // TODO: no caret remove caret on ALL instances, need to make it instance specific
       let opts = { plugins }
+      if (this.params.attr.allowCreate) opts.create = true
       let cOpts = {}
       if (this.params.attr.cOpts) {
         try {
@@ -124,6 +131,11 @@ async function formSelectExt () {
               })
           }
         `
+      } else {
+        text += `if (!_.isEmpty(this.value)) {
+          if (!_.isArray(this.value)) this.value = [this.value]
+          this.instance.setValue(this.value)
+        }`
       }
       text += '}'
       xData.push(text)
@@ -131,6 +143,7 @@ async function formSelectExt () {
       // this.params.attr['@load.window'] = 'onLoad()'
       this.params.attr['x-init'] = 'onLoad()'
       await build.call(this, buildFormSelect, this.params)
+      /*
       let options = []
       if (this.params.attr.options) {
         try {
@@ -140,6 +153,7 @@ async function formSelectExt () {
         }
       }
       if (options.length > 0) this.params.attr.options = options
+      */
       this.params.attr = omit(this.params.attr, ['noDropdownInput', 'removeBtn', 'clearBtn', 'c-opts', 'remoteUrl', 'remoteSearchField', 'remoteLabelField', 'remoteValueField', 'remoteQuery', 'remoteApiKey'])
     }
   }

package/extend/waibuMpa/theme.js

@@ -7,7 +7,10 @@ async function theme () {
     'waibuBootstrap.virtual:/bootstrap/js/bootstrap.bundle.min.js',
     'bajo.virtual:/lodash/lodash.min.js',
     '$waibuMpa:/wmpa.js',
-    '$waibuBootstrap.asset:/js/wbs.js'
+    {
+      src: '$waibuBootstrap.asset:/js/wbs.js',
+      defer: true
+    }
   ]
   const meta = [{
     name: 'viewport',

package/extend/waibuStatic/asset/js/wbs.js

@@ -3,10 +3,6 @@
 class Wbs {
   constructor () {
     this.engine = window.mdb ?? window.bootstrap
-    this.init()
-  }
-
-  init () {
     window.addEventListener('load', evt => {
       const popoverTriggerList = document.querySelectorAll('[data-bs-toggle="popover"]')
       const popoverList = [...popoverTriggerList].map(popoverTriggerEl => new this.engine.Popover(popoverTriggerEl)) // eslint-disable-line no-unused-vars

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "waibu-bootstrap",
-  "version": "2.8.2",
+  "version": "2.9.1",
   "description": "Bootstrap suport for Waibu Framework",
   "main": "index.js",
   "scripts": {

package/wiki/CHANGES.md

@@ -1,5 +1,20 @@
 # Changes
 
+## 2026-05-16
+
+- [2.9.1] Bug fix in ```form-select-ext``` widget
+- [2.9.1] Bug fix in ```util.getInputAttr``` helper
+
+## 2026-05-11
+
+- [2.9.0] Updates to match ```dobo@2.23.0``` specs
+- [2.9.0] Bug fix in ```theme.js```
+- [2.9.0] Auto link for widget bound to database with refs
+
+## 2026-05-03
+
+- [2.8.2] Bug fix in ```form-plaintext``` widgets
+
 ## 2026-04-25
 
 - [2.8.0] Change options to format value using the new key set by dobo