@mythpe/quasar-ui-qui 0.1.53 → 0.1.54

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mythpe/quasar-ui-qui",
-  "version": "0.1.53",
+  "version": "0.1.54",
   "description": "MyTh Quasar UI Kit App Extension",
   "author": {
     "name": "MyTh Ahmed Faiz",

package/src/components/datatable/MDatatable.vue

@@ -13,7 +13,7 @@
 import type { MDatatableProps } from '../../types'
 import type { InvalidSubmissionHandler, SubmissionHandler } from 'vee-validate'
 import { useForm } from 'vee-validate'
-import { onMounted, ref, toValue, watch } from 'vue'
+import { computed, onMounted, ref, toValue, watch } from 'vue'
 import { is as quasarHelpers, QCardSection, QTable, useQuasar } from 'quasar'
 import lodash from 'lodash'
 import { useDtHelpers, useMyth } from '../../composable'
@@ -380,7 +380,9 @@ watch(formDialogModel, (v) => {
     dialogErrors.value = {}
   }
 })
-
+const activeContextItems = computed(() => {
+  return contextmenuItems.value.filter((e, i) => typeof e.showIf === 'function' ? e.showIf(e, i) : e.showIf !== !1) as Required<MDatatableProps['contextItems']> || []
+})
 const table = ref<InstanceType<typeof QTable>>()
 defineOptions({
   name: 'MDatatable',
@@ -451,7 +453,7 @@ defineExpose({
           :key="i"
         >
           <MDtBtn
-            v-if="typeof contextmenuItem.showIf === 'function' ? contextmenuItem.showIf(dialogItem,dialogItemIndex) : contextmenuItem.showIf"
+            v-if="typeof contextmenuItem.showIf === 'function' ? contextmenuItem.showIf(dialogItem,dialogItemIndex) : contextmenuItem.showIf !== !1"
             :[contextmenuItem.name]="!0"
             :dense="dense === undefined ? (theme.buttons.dense !== undefined ? theme.buttons.dense : pluginOptions.datatable?.dense) : dense"
             :label="contextmenuItem.contextLabel !== undefined ? (contextmenuItem.contextLabel === null ? undefined : __(contextmenuItem.contextLabel)) : __(contextmenuItem.label || contextmenuItem.name) "
@@ -967,7 +969,8 @@ defineExpose({
                     :key="`top-s-${i}`"
                   >
                     <MDtBtn
-                      v-if="(typeof contextBtn.showIf === 'function' ? contextBtn.showIf(selected[0],0) : contextBtn.showIf) && ( (contextBtn.click && isSingleSelectedItem) || (contextBtn.multiClick && !isSingleSelectedItem) )"
+                      v-if="(typeof contextBtn.showIf === 'function' ? contextBtn.showIf(selected[0],0) : contextBtn.showIf !==!1) && ( (contextBtn.click && isSingleSelectedItem)
+                        || (contextBtn.multiClick && !isSingleSelectedItem) )"
                       :tooltip="contextBtn.tooltip?__(contextBtn.tooltip):(contextBtn.label?(te(`labels.${contextBtn.label}`) ?
                         __(`labels.${contextBtn.label}`) : __(contextBtn.label) ):undefined)"
                       v-bind="{...defaultTopBtnProps,...pluginOptions.dt?.topSelection?.btn as any,...contextBtn as any,...contextBtn.attr as any}"
@@ -1098,7 +1101,7 @@ defineExpose({
             <q-td :props="noBodyProps">
               <!--Control-->
               <q-btn-dropdown
-                v-if="contextmenuItems.length > contextItemsLength"
+                v-if="activeContextItems.length > contextItemsLength"
                 v-close-popup
                 :menu-offset="[0,10]"
                 color="primary"

package/src/components/datatable/MDtContextmenuItems.vue

@@ -46,7 +46,7 @@ defineOptions({
       :key="`MDtContextmenuItems-i${i}`"
     >
       <MDtBtn
-        v-if="typeof m.showIf === 'function' ? m.showIf(item,index) : m.showIf"
+        v-if="typeof m.showIf === 'function' ? m.showIf(item,index) : m.showIf !== !1"
         :[m.name]="!0"
         :label="itemMode&&m.label===undefined?(te(`labels.${m.name}`)?__(`labels.${m.name}`):__(m.tooltip || m.attr?.label || m.attr?.tooltip || m.name)):(m.label!==undefined?__(m.label || m.name):undefined)"
         :list-item="itemMode"

package/src/components/form/MInputLabel.vue

@@ -33,6 +33,7 @@ defineOptions({
     }"
     v-bind="$attrs"
   >
+    <slot name="before" />
     <div class="m--input__top-label__content">
       {{ label !== undefined ? __(label) : field?.label }}
     </div>

package/src/components/form/MOptions.vue

@@ -132,18 +132,21 @@ defineOptions({
         v-if="!!getLabel && (!viewMode || (theme.topLabel || getProp('topLabel')))"
         :field="scopes"
       >
-        <MHelpRow
-          v-if="!!help"
-          :text="help"
-          tooltip
-        />
-        <template v-if="loading">
-          <div class="flex-break" />
-          <q-spinner-dots
-            class="q-mt-lg q-ml-lg"
-            color="primary"
-            size="22px"
+        <template #default>
+          <MHelpRow
+            v-if="!!help"
+            :text="help"
+            class="q-ml-lg"
+            tooltip
           />
+          <template v-if="loading">
+            <div class="flex-break" />
+            <q-spinner-dots
+              class="q-mt-lg q-ml-lg"
+              color="primary"
+              size="22px"
+            />
+          </template>
         </template>
       </MInputLabel>
     </slot>

package/src/components/grid/MHelpRow.vue

@@ -29,6 +29,7 @@ defineOptions({
   <div
     v-if="text || tooltip"
     class="m--help-row row"
+    v-bind="$attrs"
   >
     <div class="col-auto">
       <q-icon

package/src/components/parials/MUploaderItem.vue

@@ -174,6 +174,7 @@ defineOptions({ name: 'MUploaderItem' })
         :ratio="1"
         :src="modelValue.__img ? modelValue.__img.src : mediaProp.url"
         fit="contain"
+        no-spinner
       />
       <q-icon
         v-else

package/src/types/components.d.ts

@@ -208,6 +208,7 @@ export type MInputFieldControlSlots = {
 export type MInputLabelProps = BaseInputFieldProps
 
 export type MInputLabelSlots = {
+  before?: () => VNode[];
   default?: () => VNode[];
 }