@mythpe/quasar-ui-qui 0.0.24-dev → 0.0.25-dev

package/package.json

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

package/src/components/form/MCheckbox.vue

@@ -35,7 +35,10 @@ const listeners = {
 const input = useTemplateRef<InstanceType<typeof QCheckbox> | null>('input')
 const scopes = reactive(inputScope)
 defineExpose<typeof scopes & { input: typeof input }>({ input, ...scopes })
-defineOptions({ name: 'MCheckbox', inheritAttrs: !1 })
+defineOptions({
+  name: 'MCheckbox',
+  inheritAttrs: !1
+})
 </script>
 
 <template>

package/src/components/form/MField.vue

@@ -65,7 +65,10 @@ const value = useFieldValue(() => props.name)
 const errorMessage = useFieldError(() => props.name)
 const input = useTemplateRef<InstanceType<typeof QField>>('input')
 defineExpose<{ input: typeof input }>({ input })
-defineOptions({ name: 'MField', inheritAttrs: !1 })
+defineOptions({
+  name: 'MField',
+  inheritAttrs: !1
+})
 </script>
 
 <template>

package/src/components/form/MFile.vue

@@ -11,7 +11,7 @@
 import { QField, QFile, QFileSlots } from 'quasar'
 import { useBindInput, useMyth } from '../../composable'
 import { useField } from 'vee-validate'
-import { defineProps, reactive, ref, toValue } from 'vue'
+import { defineProps, reactive, toValue, useTemplateRef } from 'vue'
 import type { MFileProps as Props } from '../../types'
 import { myth } from '../../utils'
 
@@ -88,7 +88,7 @@ const listeners = {
   clear: (v: Event) => handleBlur(v, !0),
   'update:modelValue': (v: Props['modelValue']) => handleChange(v, !!errorMessage.value)
 }
-const input = ref<InstanceType<typeof QFile | typeof QField> | null>(null)
+const input = useTemplateRef<InstanceType<typeof QFile> | InstanceType<typeof QField>>('input')
 const scopes = reactive(inputScope)
 
 const pickFiles = (evt?: Event) => (input.value as QFile)?.pickFiles(evt)
@@ -111,7 +111,10 @@ const methods = {
 }
 
 defineExpose({ input, ...scopes, ...methods })
-defineOptions({ name: 'MFile', inheritAttrs: !1 })
+defineOptions({
+  name: 'MFile',
+  inheritAttrs: !1
+})
 </script>
 
 <template>

package/src/components/form/MForm.vue

@@ -55,7 +55,10 @@ const onErrorSubmission: InvalidSubmissionHandler = ({ errors }) => {
 const defaultSubmit = props.emitValues ? handleSubmit(onSuccessSubmission, onErrorSubmission) : handleSubmit.withControlled(onSuccessSubmission,
   onErrorSubmission)
 defineExpose({ ...scope, defaultSubmit })
-defineOptions({ name: 'MForm', inheritAttrs: !1 })
+defineOptions({
+  name: 'MForm',
+  inheritAttrs: !1
+})
 const options = { deep: !0, immediate: !0 }
 const stateComputed = computed(() => props.state ? toValue(props.state) : {})
 watch(stateComputed, v => v && resetForm(v), options)

package/src/components/form/MHidden.vue

@@ -8,7 +8,7 @@
 
 <script
   lang="ts"
-        setup
+  setup
 >
 
 import { useField } from 'vee-validate'
@@ -60,7 +60,10 @@ const { value, errorMessage } = inputScope
 
 const scopes = reactive(inputScope)
 defineExpose<typeof scopes>({ ...scopes })
-defineOptions({ name: 'MHidden', inheritAttrs: !1 })
+defineOptions({
+  name: 'MHidden',
+  inheritAttrs: !1
+})
 </script>
 
 <template>

package/src/components/form/MMobile.vue

@@ -16,7 +16,10 @@ const modelValue = defineModel<Props['modelValue']>({ required: !1, default: und
 const input = useTemplateRef<InstanceType<typeof MInput>>('input')
 const { props: options } = myth
 defineExpose<{ input: typeof input }>({ input })
-defineOptions({ name: 'MMobile', inheritAttrs: !1 })
+defineOptions({
+  name: 'MMobile',
+  inheritAttrs: !1
+})
 </script>
 
 <template>

package/src/components/form/MPicker.vue

@@ -126,7 +126,10 @@ const saveDialog = () => {
 const dateElm = useTemplateRef<InstanceType<typeof QDate>>('dateElm')
 const timeElm = useTemplateRef<InstanceType<typeof QTime>>('timeElm')
 defineExpose<{ input: typeof dateElm | typeof timeElm }>({ input: isDate.value ? dateElm : timeElm })
-defineOptions({ name: 'MPicker', inheritAttrs: !1 })
+defineOptions({
+  name: 'MPicker',
+  inheritAttrs: !1
+})
 </script>
 
 <template>

package/src/components/form/MRadio.vue

@@ -8,7 +8,7 @@
 
 <script lang="ts" setup>
 import { useField } from 'vee-validate'
-import { defineProps, reactive, ref, toValue } from 'vue'
+import { defineProps, reactive, toValue, useTemplateRef } from 'vue'
 import { useBindInput, useMyth } from '../../composable'
 import type { MRadioProps as Props } from '../../types'
 import { QField, QRadio } from 'quasar'
@@ -77,10 +77,13 @@ const { props: options } = myth
 const listeners = {
   'update:modelValue': (v: Props['modelValue']) => handleChange(v, !!errorMessage.value)
 }
-const input = ref<InstanceType<typeof QRadio> | null>(null)
+const input = useTemplateRef<InstanceType<typeof QRadio>>('input')
 const scopes = reactive(inputScope)
 defineExpose<typeof scopes & { input: typeof input }>({ input, ...scopes })
-defineOptions({ name: 'MRadio', inheritAttrs: !1 })
+defineOptions({
+  name: 'MRadio',
+  inheritAttrs: !1
+})
 </script>
 
 <template>

package/src/components/form/MSelect.vue

@@ -10,7 +10,7 @@
 
 import { useField } from 'vee-validate'
 import type { MSelectProps as Props } from '../../types'
-import { computed, reactive, ref, toValue } from 'vue'
+import { computed, reactive, toValue, useTemplateRef } from 'vue'
 import { useBindInput, useMyth } from '../../composable'
 import { QField, QSelect, type QSelectSlots } from 'quasar'
 import { myth } from '../../utils'
@@ -164,10 +164,16 @@ const listeners = {
   inputValue: (v: string) => (search.value = v?.toString() || ''),
   filter: filterFn
 }
-const input = ref<InstanceType<typeof QSelect | typeof QField> | null>(null)
+const input = useTemplateRef<InstanceType<typeof QSelect> | InstanceType<typeof QField>>('input')
 const scopes = reactive(inputScope)
-defineExpose<typeof scopes & { input: typeof input, onDoneOptions: typeof onDoneOptions }>({ input, ...scopes, onDoneOptions })
-defineOptions({ name: 'MSelect', inheritAttrs: !1 })
+defineExpose<typeof scopes & {
+  input: typeof input,
+  onDoneOptions: typeof onDoneOptions
+}>({ input, ...scopes, onDoneOptions })
+defineOptions({
+  name: 'MSelect',
+  inheritAttrs: !1
+})
 </script>
 
 <template>

package/src/types/api-helpers.d.ts

@@ -6,7 +6,7 @@
  * Github: https://github.com/mythpe
  */
 
-import type { AxiosRequestConfig, AxiosResponse, AxiosError } from 'axios'
+import type { AxiosError, AxiosRequestConfig, AxiosResponse } from 'axios'
 import { ApiServiceParams } from './dt'
 
 // Axios

package/src/types/components.d.ts

@@ -13,7 +13,9 @@ import type {
   QBtnProps,
   QBtnSlots,
   QCheckboxProps,
-  QDateProps, QEditorProps, QEditorSlots,
+  QDateProps,
+  QEditorProps,
+  QEditorSlots,
   QFieldSlots,
   QFileProps,
   QFileSlots,
@@ -21,7 +23,9 @@ import type {
   QInputProps,
   QInputSlots,
   QItemProps,
-  QRadioProps, QSelectProps, QTableProps,
+  QRadioProps,
+  QSelectProps,
+  QTableProps,
   QTimeProps
 } from 'quasar'
 import type { MaybeRefOrGetter, TransitionGroupProps, TransitionProps, UnwrapNestedRefs, VNode } from 'vue'
@@ -30,7 +34,8 @@ import type { FieldContext, FieldOptions, FormContext, FormOptions, FormState }
 
 import type { ThemeShadow, ThemeSize } from './theme'
 import type {
-  GenericMDtBtn, MDtExportOptions,
+  GenericMDtBtn,
+  MDtExportOptions,
   MDtItem,
   MDtRequestParamsCallbackProp,
   MDtRequestParamsObjectProp,
@@ -664,6 +669,7 @@ export type MFormScope = FormContext<Record<string, any>>;
 export interface MFormSlots {
   default: (scope: MFormScope) => VNode[];
 }
+
 export declare type GenericFormValues = Record<any, any>;
 
 export interface MDtBtnProps extends MBtnProps {

package/src/types/dt.d.ts

@@ -2,6 +2,7 @@ import type { QTableProps } from 'quasar'
 import type { GenericFormValues, MDatatableProps, MDtBtnProps } from './components'
 import type { MaybeRef, Ref, UnwrapRef } from 'vue'
 import type { AxiosResponse } from 'axios'
+
 type Generic = Record<any, any>;
 
 export type MDtItem<T extends object = Record<keyof T, any>> = T & {
@@ -54,6 +55,7 @@ export interface ApiServiceParams {
 
   [key: string]: any;
 }
+
 export type MDtServiceNameCallbackProp = (() => Record<string, (() => Promise<AxiosResponse>)>)
 export type MDtServiceNameStringProp = string
 export type MDtRequestParamsCallbackProp = (params: ApiServiceParams) => Partial<GenericFormValues>

package/src/utils/Helpers.ts

@@ -9,14 +9,7 @@
 import { AxiosInstance, AxiosRequestConfig } from 'axios'
 import lodash from 'lodash'
 import { openURL, scroll } from 'quasar'
-import type {
-  ConfigType,
-  DownloadFromResponse,
-  DownloadFromResponseCode,
-  HelpersStubSchema,
-  ParamsType,
-  UrlType
-} from '../types'
+import type { ConfigType, DownloadFromResponse, DownloadFromResponseCode, HelpersStubSchema, ParamsType, UrlType } from '../types'
 
 import { nextTick } from 'vue'
 

package/src/utils/Str.ts

@@ -10,6 +10,7 @@ import _ from 'lodash'
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore
 import inflection from 'lodash-inflection'
+
 _.mixin(inflection)
 
 export const Str = {