@d-mok/quasar-app-extension-quasar-axe 2.1.78 → 2.1.80

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@d-mok/quasar-app-extension-quasar-axe",
-    "version": "2.1.78",
+    "version": "2.1.80",
     "description": "A Quasar App Extension",
     "author": "d-mok <49301824+d-mok@users.noreply.github.com>",
     "license": "MIT",
@@ -27,7 +27,7 @@
         "lodash": "^4.17.21",
         "mime-types": "^2.1.35",
         "papaparse": "^5.4.1",
-        "sapphire-js": "^2.0.32",
+        "sapphire-js": "^2.1.3",
         "sortablejs": "^1.15.0",
         "vuedraggable": "^4.1.0"
     },

package/src/templates/src/boot/axe/components/QxBtn.vue

@@ -2,6 +2,7 @@
     <q-btn v-bind="$attrs">
         <q-tooltip
             class="text-body1"
+            style="white-space: break-spaces"
             v-if="tooltip"
             :delay="150"
             >{{ tooltip }}</q-tooltip

package/src/templates/src/boot/axe/components/QxBtnToggle.vue

@@ -8,6 +8,7 @@
 
 <script lang="ts" setup generic="T extends Object">
 import { computed } from 'vue'
+import { getLabelFunc } from '../../../utils/tool'
 
 const modelValue = defineModel<T>()
 
@@ -18,7 +19,7 @@ const { options, optionLabel } = defineProps<{
 
 let opts = computed(() =>
     options.map($ => ({
-        label: String($.pipe(optionLabel ?? ($ => String($)))),
+        label: getLabelFunc(optionLabel)($),
         value: $,
     }))
 )

package/src/templates/src/boot/axe/components/QxRadio.vue

@@ -8,6 +8,7 @@
 
 <script lang="ts" setup generic="T extends Object">
 import { computed } from 'vue'
+import { getLabelFunc } from '../../../utils/tool'
 
 let modelValue = defineModel<T>()
 
@@ -18,7 +19,7 @@ const { options, optionLabel } = defineProps<{
 
 let opts = computed(() =>
     options.map($ => ({
-        label: String($.pipe(optionLabel ?? ($ => String($)))),
+        label: getLabelFunc(optionLabel)($),
         value: $,
     }))
 )

package/src/templates/src/boot/axe/components/QxSortable.vue

@@ -22,9 +22,7 @@
                 <tr style="cursor: move">
                     <td>{{ index + 1 }}</td>
                     <td>
-                        <b>{{
-                            element.pipe(label ?? (($: any) => String($)))
-                        }}</b>
+                        <b>{{ labeler(element) }}</b>
                     </td>
                 </tr>
             </template>
@@ -34,6 +32,7 @@
 
 <script lang="ts" setup generic="T extends Object">
 import draggable from 'vuedraggable'
+import { getLabelFunc } from '../../../utils/tool'
 
 let modelValue = defineModel<T[]>()
 
@@ -50,6 +49,10 @@ const {
 function identity($: any) {
     return $
 }
+
+function labeler(v: any) {
+    return getLabelFunc(label)(v)
+}
 </script>
 
 <style scoped>

package/src/templates/src/utils/dialog/advanced.ts

@@ -5,6 +5,7 @@ import dialogForm from './custom/dialogForm.vue'
 import dialogBtn from './custom/dialogBtn.vue'
 import dialogFile from './custom/dialogFile.vue'
 import { throwError } from './basic'
+import { getLabelFunc } from '../../utils/tool'
 
 type Predicate<T> = (_: T) => boolean
 type Mapper<T, S> = (_: T) => S
@@ -61,7 +62,7 @@ export async function askBtn<T>(
         title,
         message,
         items,
-        labelFunc: ($: any) => $.pipe(label),
+        labelFunc: ($: any) => getLabelFunc(label)($),
         cancel: true,
     })
 }

package/src/templates/src/utils/dialog/basic.ts

@@ -1,4 +1,5 @@
 import { Dialog, QDialogOptions } from 'quasar'
+import { getLabelFunc } from '../tool'
 
 type Predicate<T> = (_: T) => boolean
 type Mapper<T, S> = (_: T) => S
@@ -142,7 +143,7 @@ export async function askRadio<T>(
     items: T[],
     label: (string & keyof T) | Mapper<T, string> = $ => String($)
 ): Promise<T> {
-    let labelFunc = ($: any) => $.pipe(label)
+    let labelFunc = ($: any) => getLabelFunc(label)($)
     let values = items.map(labelFunc)
 
     let value = await base({

package/src/templates/src/utils/tool.ts

@@ -0,0 +1,11 @@
+type Labeler<T> = (string & keyof T) | ((_: T) => string)
+
+export function getLabelFunc<T>(labeler: Labeler<T> | undefined) {
+    if (typeof labeler === 'string') {
+        return ($: T) => String($[labeler])
+    }
+    if (typeof labeler === 'function') {
+        return labeler
+    }
+    return ($: T) => String($)
+}

package/src/templates/src/utils/dialog/tool.ts

@@ -1,11 +0,0 @@
-// type Labeler<T> = (string & keyof T) | ((_: T) => string)
-
-// export function getLabelFunc<T>(labeler?: Labeler<T>) {
-//     if (typeof labeler === 'string') {
-//         return ($: T) => String($[labeler])
-//     }
-//     if (typeof labeler === 'function') {
-//         return labeler
-//     }
-//     return ($: T) => String($)
-// }