@mythpe/quasar-app-extension-qui 0.0.27 → 0.5.1

package/README.md

@@ -1,44 +1,50 @@
-# Quasar App Extension @mythpe/qui
+<p align="center">
+    <a href="https://4myth.com">
+        <img src="https://4myth.com/logo.png" width="120" alt="Ahmed Faiz MyTh">
+    </a>
+</p>
 
-> Add a short description of your App Extension. What does it do? How is it beneficial? Why would someone want to use it?
+[![npm](https://img.shields.io/npm/v/quasar-app-extension-qui.svg?label=quasar-app-extension-qui)](https://www.npmjs.com/package/quasar-app-extension-qui)
+[![npm](https://img.shields.io/npm/dt/quasar-app-extension-qui.svg)](https://www.npmjs.com/package/quasar-app-extension-qui)
 
-[![npm](https://img.shields.io/npm/v/@mythpe/quasar-app-extension-qui.svg?label=@mythpe/quasar-app-extension-qui)](https://www.npmjs.com/package/@mythpe/quasar-app-extension-qui)
-[![npm](https://img.shields.io/npm/dt/@mythpe/quasar-app-extension-qui.svg)](https://www.npmjs.com/package/@mythpe/quasar-app-extension-qui)
+# Quasar App Extension QUI
 
-# Install
+This extension allows you to effortlessly integrate **QUI** components into your Quasar Framework applications with zero configuration.
 
-```bash
-quasar ext add @mythpe/qui
-```
-Quasar CLI will retrieve it from NPM and install the extension.
+## 💻 Installation
 
-# Invoke
+To automatically install the extension and trigger the **invoke** script, run:
 
 ```bash
-quasar ext invoke @mythpe/qui
+quasar ext add "@mythpe/qui"
 ```
 
+```bash
+quasar ext invoke "@mythpe/qui"
+```
 
-## Prompts
-
-> If your app extension uses prompts, explain them here, otherwise remove this section and remove prompts.js file.
-
-# Uninstall
+## 🛠️ Uninstall
 
 ```bash
-quasar ext remove @mythpe/qui
+quasar ext remove "@mythpe/qui"
 ```
 
-# Uninvoke
-
 ```bash
-quasar ext uninvoke @mythpe/qui
+quasar ext uninvoke "@mythpe/qui"
 ```
 
-# Info
+## 🔗 Related Packages
+
+- **[@mythpe/quasar-ui-qui](https://www.npmjs.com/package/@mythpe/quasar-ui-qui)**: Core UI library package.
+
+## 📞 Support & Contact
+
+Developed with 💙 by **Ahmed Faiz (MyTh)**.
 
-> Add longer information here that will help the user of your app extension.
+- 🌐 **Website:** [4myth.com](https://4myth.com)
+- 📧 **Email:** mythpe@gmail.com
+- 📱 **WhatsApp:** [+966 59 047 0092](https://wa.me)
 
-# License
+## 📄 License
 
-MIT (c) MyTh <mythpe@gmail.com>
+MIT (c) 2026 **Ahmed Faiz (MyTh)**

package/dist/boot/register.js

@@ -0,0 +1 @@
+"use strict";var r=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var l=Object.prototype.hasOwnProperty;var f=(o,p)=>{for(var e in p)r(o,e,{get:p[e],enumerable:!0})},n=(o,p,e,i)=>{if(p&&typeof p=="object"||typeof p=="function")for(let t of s(p))!l.call(o,t)&&t!==e&&r(o,t,{get:()=>p[t],enumerable:!(i=u(p,t))||i.enumerable});return o};var d=o=>n(r({},"__esModule",{value:!0}),o);var b={};f(b,{default:()=>A});module.exports=d(b);var a=require("quasar/wrappers"),m=require("@mythpe/quasar-ui-qui"),A=(0,a.boot)(({app:o})=>{o.use(m.install),console.log("\u{1F4B5}\u2764\uFE0F Quasar App Extension @mythpe/quasar-ui-qui booted")});

package/dist/index.js

@@ -0,0 +1 @@
+"use strict";var n=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var o=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var u=(e,a)=>{for(var t in a)n(e,t,{get:a[t],enumerable:!0})},d=(e,a,t,s)=>{if(a&&typeof a=="object"||typeof a=="function")for(let r of o(a))!p.call(e,r)&&r!==t&&n(e,r,{get:()=>a[r],enumerable:!(s=i(a,r))||s.enumerable});return e};var c=e=>d(n({},"__esModule",{value:!0}),e);var b={};u(b,{default:()=>h});module.exports=c(b);function m(e,a){if(e.boot.push("~@mythpe/quasar-app-extension-qui/dist/boot/register.js"),a.hasWebpack){let t=e.build.webpackTranspileDependencies||e.build.transpileDependencies;t&&typeof t.push=="function"&&t.push(/@mythpe\/quasar-app-extension-qui[\\/]dist/)}}function h(e){e.compatibleWith("quasar","^2.0.0"),e.hasVite?e.compatibleWith("@quasar/app-vite","^1.5.0 || ^2.0.0"):e.hasWebpack&&e.compatibleWith("@quasar/app-webpack","^3.10.0 || ^4.0.0"),e.extendQuasarConf(a=>m(a,e)),e.registerCommand("myth-command",({args:a,params:t})=>{})}

package/dist/install.js

@@ -0,0 +1 @@
+"use strict";var p=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var o=Object.getOwnPropertyNames;var r=Object.prototype.hasOwnProperty;var c=(a,t)=>{for(var i in t)p(a,i,{get:t[i],enumerable:!0})},u=(a,t,i,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of o(t))!r.call(a,e)&&e!==i&&p(a,e,{get:()=>t[e],enumerable:!(l=s(t,e))||l.enumerable});return a};var b=a=>u(p({},"__esModule",{value:!0}),a);var h={};c(h,{default:()=>f});module.exports=b(h);function f(a){a.compatibleWith("quasar","^2.0.0"),a.hasVite?a.compatibleWith("@quasar/app-vite","^1.0.0 || ^2.0.0"):a.hasWebpack&&a.compatibleWith("@quasar/app-webpack","^3.10.0 || ^4.0.0")}

package/dist/prompts.js

@@ -0,0 +1 @@
+"use strict";var a=Object.defineProperty;var o=Object.getOwnPropertyDescriptor;var s=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var m=(e,r)=>{for(var n in r)a(e,n,{get:r[n],enumerable:!0})},u=(e,r,n,i)=>{if(r&&typeof r=="object"||typeof r=="function")for(let t of s(r))!p.call(e,t)&&t!==n&&a(e,t,{get:()=>r[t],enumerable:!(i=o(r,t))||i.enumerable});return e};var c=e=>u(a({},"__esModule",{value:!0}),e);var f={};m(f,{default:()=>d});module.exports=c(f);function d(e){return[]}

package/dist/uninstall.js

@@ -0,0 +1 @@
+"use strict";var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var e=Object.getOwnPropertyNames;var r=Object.prototype.hasOwnProperty;var f=(t,a)=>{for(var n in a)l(t,n,{get:a[n],enumerable:!0})},s=(t,a,n,o)=>{if(a&&typeof a=="object"||typeof a=="function")for(let i of e(a))!r.call(t,i)&&i!==n&&l(t,i,{get:()=>a[i],enumerable:!(o=p(a,i))||o.enumerable});return t};var u=t=>s(l({},"__esModule",{value:!0}),t);var m={};f(m,{default:()=>d});module.exports=u(m);function d(t){}

package/package.json

@@ -1,25 +1,64 @@
 {
   "name": "@mythpe/quasar-app-extension-qui",
-  "version": "0.0.27",
-  "description": "MyTh Quasar UI Kit App Extension",
-  "author": "MyTh Ahmed Faiz <mythpe@gmail.com>",
-  "email": "mythpe@gmail.com",
-  "mobile": "+966590470092",
+  "version": "0.5.1",
+  "author": {
+    "name": "MyTh Ahmed Faiz",
+    "mobile": "+966590470092",
+    "email": "mythpe@gmail.com",
+    "url": "https://www.4myth.com"
+  },
+  "description": "MyTh Quasar App Extension for MyTh UI Kit",
+  "keywords": [
+    "MyTh",
+    "Quasar",
+    "Vue js",
+    "UI",
+    "Components",
+    "Form Validation",
+    "Internationalization",
+    "UI Kit",
+    "Quasar Extension"
+  ],
   "license": "MIT",
-  "type": "module",
-  "main": "src/index.js",
+  "main": "dist/index.cjs",
+  "type": "commonjs",
+  "files": [
+    "dist"
+  ],
   "scripts": {
-    "lint": "eslint --ext .js,.ts,.vue ./",
-    "lint:fix": "eslint --ext .js,.ts,.vue ./ --fix",
-    "build": "node build/index.cjs",
-    "build:js": "node build/script.javascript.cjs",
-    "build:css": "node build/script.css.cjs"
+    "clean": "rimraf dist",
+    "build": "yarn clean && tsup src/index.ts src/install.ts src/prompts.ts src/uninstall.ts src/boot/register.ts --format cjs --clean --minify",
+    "release": "yarn version --patch --no-git-tag-version",
+    "minor": "yarn version --minor --no-git-tag-version",
+    "major": "yarn version --major --no-git-tag-version"
+  },
+  "peerDependencies": {
+    "@mythpe/quasar-ui-qui": "0.5.1",
+    "quasar": "^2.19.3",
+    "@quasar/app-vite": "^2.6.0",
+    "vue": "^3.5.34",
+    "vue-router": "^5.0.7",
+    "vee-validate": "^4.15.1",
+    "vue-i18n": "^11.4.4"
   },
-  "dependencies": {
-    "@mythpe/quasar-ui-qui": "^0.0.27"
+  "devDependencies": {
+    "@quasar/app-vite": "^2.6.0",
+    "quasar": "^2.19.3",
+    "vue": "^3.5.34",
+    "@eslint/js": "^10.0.1",
+    "@types/node": "^25.9.0",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "@vue/eslint-config-typescript": "^14.7.0",
+    "eslint": "^10.4.0",
+    "eslint-plugin-vue": "^10.9.1",
+    "globals": "^17.6.0",
+    "prettier": "^3.8.3",
+    "rimraf": "^6.1.3",
+    "tsup": "^8.5.1",
+    "typescript": "^6.0.3"
   },
   "engines": {
-    "node": "^24 || ^22 || ^20 || ^18",
+    "node": "^28 || ^26 || ^24 || ^22.12",
     "npm": ">= 6.13.4",
     "yarn": ">= 1.21.1"
   }

package/jsconfig.json

@@ -1,5 +0,0 @@
-{
-  "compilerOptions": {
-    "baseUrl": "."
-  }
-}

package/src/boot/register.js

@@ -1,6 +0,0 @@
-import { boot } from 'quasar/wrappers'
-import VuePlugin from '@mythpe/quasar-ui-qui'
-
-export default boot(({ app }) => {
-  app.use(VuePlugin)
-})

package/src/components/form/MBtn.vue

@@ -1,168 +0,0 @@
-<script lang="ts" setup>
-import type { MBtnProps } from '../../types'
-import { useI18n } from 'vue-i18n'
-import { computed } from 'vue'
-import { extend } from 'quasar'
-import { myth } from '../../utils/myth'
-
-const props = defineProps<MBtnProps>()
-const options = computed(() => myth.options.value.btn ?? {})
-const { t, te } = useI18n({ useScope: 'global' })
-const getLabel = computed(() => {
-  if (props.label !== undefined) {
-    if (te(`attributes.${props.label}`)) {
-      return t(`attributes.${props.label}`)
-    }
-    if (te(`${props.label}`)) {
-      return t(`${props.label}`)
-    }
-  }
-  return props.label
-})
-defineOptions({
-  name: 'MBtn',
-  inheritAttrs: !1
-})
-</script>
-
-<template>
-  <q-btn v-bind="extend(!0,{...$attrs},options.props,{...$props},{label: getLabel})">
-    <template
-      v-if="!!options.loading && !$slots.loading"
-      #loading
-    >
-      <q-spinner-audio
-        v-if="options.loading.type === 'audio'"
-        :color="options.loading.color"
-        :size="options.loading.size"
-        class="on-left"
-      />
-      <q-spinner-ball
-        v-if="options.loading.type === 'ball'"
-        :color="options.loading.color"
-        :size="options.loading.size"
-        class="on-left"
-      />
-      <q-spinner-bars
-        v-if="options.loading.type === 'bars'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-box
-        v-if="options.loading.type === 'box'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-clock
-        v-if="options.loading.type === 'clock'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-comment
-        v-if="options.loading.type === 'comment'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-cube
-        v-if="options.loading.type === 'cube'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-dots
-        v-if="options.loading.type === 'dots'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-facebook
-        v-if="options.loading.type === 'facebook'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-gears
-        v-if="options.loading.type === 'gears'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-grid
-        v-if="options.loading.type === 'grid'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-hearts
-        v-if="options.loading.type === 'hearts'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-hearts
-        v-if="options.loading.type === 'hearts'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-hourglass
-        v-if="options.loading.type === 'hourglass'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-infinity
-        v-if="options.loading.type === 'infinity'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-ios
-        v-if="options.loading.type === 'ios'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-orbit
-        v-if="options.loading.type === 'orbit'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-oval
-        v-if="options.loading.type === 'oval'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-pie
-        v-if="options.loading.type === 'pie'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-puff
-        v-if="options.loading.type === 'puff'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-radio
-        v-if="options.loading.type === 'radio'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-rings
-        v-if="options.loading.type === 'rings'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <q-spinner-tail
-        v-if="options.loading.type === 'tail'"
-        :color="options.loading.color"
-        class="on-left"
-      />
-      <template v-if="options.loading.label === !0">
-        {{ getLabel }}
-      </template>
-    </template>
-    <template
-      v-else-if="!!$slots.loading"
-      #loading
-    >
-      <slot name="loading" />
-    </template>
-    <template
-      v-if="!!$slots.default"
-      #default
-    >
-      <slot name="default" />
-    </template>
-  </q-btn>
-</template>

package/src/components/grid/MBlock.vue

@@ -1,38 +0,0 @@
-<script lang="ts" setup>
-import type { MBlockProps } from '../../types'
-import { computed } from 'vue'
-import MythOptions from '../../utils/myth'
-import { extend } from 'quasar'
-
-interface Props {
-  size?: MBlockProps['size'];
-  rounded?: MBlockProps['rounded'];
-  shadow?: MBlockProps['shadow'];
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  size: 'md',
-  rounded: !1,
-  shadow: 'none'
-})
-const block = computed(() => MythOptions.options.value.block ?? {})
-const options = computed<Props>(() => extend(!0, { ...props }, block.value))
-defineOptions({
-  name: 'MBlock',
-  inheritAttrs: !1
-})
-</script>
-
-<template>
-  <div
-    :class="{
-      'm---block' : !0,
-      [`q-pa-${options.size}`] : options.size && options.size !== 'none',
-      'rounded-borders' : options.rounded === !0,
-      [`shadow-${options.shadow}`] : options.shadow && options.shadow !== 'none'
-    }"
-    v-bind="$attrs"
-  >
-    <slot />
-  </div>
-</template>

package/src/components/grid/MCol.vue

@@ -1,64 +0,0 @@
-<script
-  lang="ts"
-  setup
->
-import { computed } from 'vue'
-import { uniq } from 'lodash'
-import type { MColProps } from '../../types'
-
-interface Props {
-  name?: MColProps['name']
-  auto?: MColProps['auto']
-  col?: MColProps['col']
-  xs?: MColProps['xs']
-  sm?: MColProps['sm']
-  md?: MColProps['md']
-  lg?: MColProps['lg']
-  xl?: MColProps['xl']
-}
-
-const props = defineProps<Props>()
-const classes = computed(() => {
-  const list: string[] = ['m--col']
-  if (props.auto === !0) {
-    list.push('col-auto')
-  }
-  if (props.col === 'grow') {
-    list.push('col-grow')
-  } else if (props.col === 'shrink') {
-    list.push('col-shrink')
-  } else if (typeof props.col === 'string') {
-    if (props.col?.toString()?.trim()?.length > 0 && !list.includes(`col-${props.col}`)) {
-      list.push(`col-${props.col}`)
-    }
-  }
-
-  for (const k of (['xs', 'sm', 'md', 'lg', 'xl'] as (keyof Props)[])) {
-    if (props[k] && typeof props[k] !== 'boolean') {
-      if (!list.includes(`col-${k}-${props[k]}`)) {
-        list.push(`col-${k}-${props[k]}`)
-      }
-    }
-  }
-
-  if (list.length === 1 && props.col !== !1) {
-    list.push('col')
-  }
-  return uniq(list)
-  // return list
-})
-defineOptions({
-  name: 'MCol',
-  inheritAttrs: !1
-})
-</script>
-
-<template>
-  <div
-    :class="classes"
-    :data-input-name="name??undefined"
-    v-bind="$attrs"
-  >
-    <slot />
-  </div>
-</template>

package/src/components/grid/MColumn.vue

@@ -1,15 +0,0 @@
-<script lang="ts" setup>
-defineOptions({
-  name: 'MColumn',
-  inheritAttrs: !1
-})
-</script>
-
-<template>
-  <div
-    class="m--column column"
-    v-bind="$attrs"
-  >
-    <slot />
-  </div>
-</template>

package/src/components/grid/MContainer.vue

@@ -1,46 +0,0 @@
-<!--
-  - MyTh Ahmed Faiz Copyright © 2016-2024 All rights reserved.
-  - Email: mythpe@gmail.com
-  - Mobile: +966590470092
-  - Website: https://www.4myth.com
-  - Github: https://github.com/mythpe
-  -->
-
-<script lang="ts" setup>
-import type { MContainerProps } from '../../types'
-import MythOptions from '../../utils/myth'
-import { computed } from 'vue'
-
-interface Props {
-  size?: MContainerProps['size'];
-  fluid?: MContainerProps['fluid'];
-  dense?: MContainerProps['dense'];
-}
-
-const props = defineProps<Props>()
-const styles = computed(() => MythOptions.options.value?.style ?? {})
-const sizeProp = computed(() => {
-  if (props.size !== undefined) {
-    return props.size
-  }
-  return styles.value.gutters
-})
-defineOptions({
-  name: 'MContainer',
-  inheritAttrs: !1
-})
-</script>
-
-<template>
-  <div
-    :class="{
-      'm--container' : !0,
-      'm--container__fluid' : (fluid !== !1 && fluid !== undefined) || (styles.fluid === !0 && (fluid !== !1 && fluid !== undefined)),
-      'm--container__dense' : dense !== !1 && dense !== undefined,
-      [`q-pa-${sizeProp||''}`]: sizeProp && sizeProp !== 'none'
-    }"
-    v-bind="$attrs"
-  >
-    <slot />
-  </div>
-</template>

package/src/components/grid/MHelpRow.vue

@@ -1,62 +0,0 @@
-<!--
-  - MyTh Ahmed Faiz Copyright © 2016-2024 All rights reserved.
-  - Email: mythpe@gmail.com
-  - Mobile: +966590470092
-  - Website: https://www.4myth.com
-  - Github: https://github.com/mythpe
-  -->
-
-<script
-  lang="ts"
-  setup
->
-import { useI18n } from 'vue-i18n'
-
-interface Props {
-  text?: string | undefined;
-  icon?: string | undefined;
-  tooltip?: boolean | undefined;
-}
-
-defineProps<Props>()
-const { t, te } = useI18n({ useScope: 'global' })
-const __ = (s: any) => !s ? '' : te(`attributes.${s}`) ? t(`attributes.${s}`) : te(s) ? t(s) : s
-defineOptions({
-  name: 'MHelpRow',
-  inheritAttrs: !1
-})
-</script>
-
-<template>
-  <div class="row">
-    <div class="col-auto">
-      <q-icon
-        :left="!!text && !tooltip"
-        class="cursor-pointer"
-        name="ion-ios-information-circle-outline"
-        size="19px"
-      >
-        <q-tooltip
-          v-if="!!tooltip"
-          anchor="center end"
-          class="bg-transparent text-black text-justify"
-          self="center start"
-          transition-hide="jump-right"
-          transition-show="jump-left"
-        >
-          <q-card style="max-width: 280px">
-            <q-card-section style="font-size: 13px">
-              {{ __(text) }}
-            </q-card-section>
-          </q-card>
-        </q-tooltip>
-      </q-icon>
-    </div>
-    <div
-      v-if="!tooltip && !!text"
-      class="col"
-    >
-      <div v-text="__(text)" />
-    </div>
-  </div>
-</template>

package/src/components/grid/MRow.vue

@@ -1,35 +0,0 @@
-<script
-  lang="ts"
-  setup
->
-import type { MRowProps } from '../../types'
-import { computed } from 'vue'
-import MythOptions from '../../utils/myth'
-
-interface Props {
-  gutter?: MRowProps['gutter'];
-  col?: MRowProps['col'];
-}
-
-const props = defineProps<Props>()
-const defSize = computed<string>(() => MythOptions.options.value.style?.gutters || '')
-const gutterSize = computed<string>(() => props.gutter === !0 ? defSize.value : (props.gutter || defSize.value))
-const colSize = computed<string>(() => props.gutter === !0 ? defSize.value : (props.gutter || defSize.value))
-defineOptions({
-  name: 'MRow',
-  inheritAttrs: !1
-})
-</script>
-
-<template>
-  <div
-    :class="{
-      'm--row row': !0,
-      [`q-gutter-${gutterSize}`]: gutter !== !1 && gutter !== undefined,
-      [`q-col-gutter-${colSize}`]: col !== !1 && col !== undefined,
-    }"
-    v-bind="$attrs"
-  >
-    <slot />
-  </div>
-</template>

package/src/components/typography/MTypingString.vue

@@ -1,78 +0,0 @@
-<script
-  lang="ts"
-  setup
->
-
-import Typed, { type TypedOptions } from 'typed.js'
-import { computed, onBeforeUnmount, onMounted, watch } from 'vue'
-import type { MTypingStringProps } from '../../types'
-
-interface Props {
-  name: MTypingStringProps['name'];
-  tag?: MTypingStringProps['tag'];
-  string: MTypingStringProps['string'];
-  loop?: MTypingStringProps['loop'];
-  typeSpeed?: MTypingStringProps['typeSpeed'];
-  backDelay?: MTypingStringProps['backDelay'];
-  fadeOut?: MTypingStringProps['fadeOut'];
-  options?: MTypingStringProps['options'];
-}
-
-const props = defineProps<Props>()
-
-const elmId = computed(() => `typed-content-${props.name}`)
-const computedOptions = computed(() => ({
-  loop: props.loop === undefined ? !1 : props.loop,
-  typeSpeed: props.typeSpeed === undefined ? 300 : props.typeSpeed,
-  backDelay: props.backDelay,
-  fadeOut: props.fadeOut,
-  strings: typeof props.string === 'string' ? [props.string] : props.string,
-  ...props.options
-} as TypedOptions))
-let typed: Typed | undefined
-const iniTyped = () => {
-  try {
-    typed = new Typed(`#${elmId.value}`, computedOptions.value)
-  } catch (e) {
-    console.log(e)
-  }
-}
-const destroy = () => {
-  if (typed) {
-    try {
-      typed.destroy()
-    } catch (e) {
-
-    }
-  }
-}
-watch(() => props.string, () => {
-  destroy()
-  iniTyped()
-})
-onMounted(() => {
-  if (props.string) {
-    try {
-      iniTyped()
-    } catch (e) {
-      console.log(e)
-      const a = document.getElementById(elmId.value)
-      a && (a.innerHTML = typeof props.string === 'string' ? props.string : props.string.join('<br />'))
-    }
-  }
-})
-onBeforeUnmount(() => destroy())
-defineExpose({ typed })
-defineOptions({
-  name: 'MTypingString',
-  inheritAttrs: !1
-})
-</script>
-
-<template>
-  <component
-    :is="tag || 'span'"
-    :id="elmId"
-    v-bind="$attrs"
-  />
-</template>

package/src/index.js

@@ -1,48 +0,0 @@
-/**
- * Quasar App Extension index/runner script
- * (runs on each dev/build)
- *
- * Docs: https://quasar.dev/app-extensions/development-guide/index-api
- */
-
-function extendConf (conf, api) {
-  // register our boot file
-  conf.boot.push('~quasar-app-extension-qui/src/boot/register.js')
-
-  if (api.hasWebpack) {
-    // make sure app extension files & ui package gets transpiled
-    const transpileTarget = (
-      conf.build.webpackTranspileDependencies // q/app-webpack >= v4
-      || conf.build.transpileDependencies // q/app-webpack v3
-    )
-    transpileTarget.push(/quasar-app-extension-qui[\\/]src/)
-  }
-
-  // make sure the stylesheet goes through webpack to avoid SSR issues
-  conf.css.push('~quasar-ui-qui/src/index.sass')
-}
-
-export default function (api) {
-  // Quasar compatibility check; you may need
-  // hard dependencies, as in a minimum version of the "quasar"
-  // package or a minimum version of "@quasar/app-*" CLI
-  api.compatibleWith('quasar', '^2.0.0')
-
-  if (api.hasVite) {
-    api.compatibleWith('@quasar/app-vite', '^1.5.0 || ^2.0.0-rc.1')
-  }
-  else if (api.hasWebpack) {
-    api.compatibleWith('@quasar/app-webpack', '^3.10.0 || ^4.0.0-rc.1')
-  }
-
-
-  // Uncomment the line below if you provide a JSON API for your component
-  // api.registerDescribeApi('MyComponent', '~quasar-ui-qui/src/components/MyComponent.json')
-
-  // Uncomment the line below if you provide a JSON API for your directive
-  // api.registerDescribeApi('my-directive', '~quasar-ui-qui/src/directives/my-directive.json')
-
-
-  // We extend /quasar.conf.js
-  api.extendQuasarConf(extendConf)
-}

package/src/index.sass

@@ -1,27 +0,0 @@
-@import 'quasar/src/css/variables.sass'
-$m--container-padding: $space-base !default
-$m--container-fluid-width: 1440px !default
-$m--row-margin-top: $m--container-padding !default
-
-.flex-break
-  flex: 1 0 100% !important
-
-.row
-  .flex-break
-    height: 0 !important
-
-.column
-  .flex-break
-    width: 0 !important
-
-.m--container
-  &__dense
-    padding: 0 !important
-
-  &__fluid
-    max-width: $m--container-fluid-width
-    margin-left: auto
-    margin-right: auto
-
-.m--row + .m--row
-  margin-top: $m--row-margin-top

package/src/install.js

@@ -1,18 +0,0 @@
-/**
- * Quasar App Extension install script
- *
- * Docs: https://quasar.dev/app-extensions/development-guide/install-api
- */
-
-export default function (api) {
-  // Quasar compatibility check; you may need
-  // hard dependencies, as in a minimum version of the "quasar"
-  // package or a minimum version of "@quasar/app-*" CLI
-  api.compatibleWith('quasar', '^2.0.0')
-
-  if (api.hasVite) {
-    api.compatibleWith('@quasar/app-vite', '^1.0.0 || ^2.0.0-rc.1')
-  } else if (api.hasWebpack) {
-    api.compatibleWith('@quasar/app-webpack', '^3.10.0 || ^4.0.0-rc.1')
-  }
-}

package/src/prompts.js

@@ -1,44 +0,0 @@
-/**
- * Quasar App Extension prompts script
- *
- * Docs: https://quasar.dev/app-extensions/development-guide/prompts-api
- *
- * Inquirer prompts
- * (answers are available as "api.prompts" in the other scripts)
- * https://www.npmjs.com/package/inquirer#question
- *
- * Example:
-
-  return [
-    {
-      name: 'name',
-      type: 'string',
-      required: true,
-      message: 'Quasar CLI Extension name (without prefix)',
-    },
-    {
-      name: 'preset',
-      type: 'checkbox',
-      message: 'Check the features needed for your project:',
-      choices: [
-        {
-          name: 'Install script',
-          value: 'install'
-        },
-        {
-          name: 'Prompts script',
-          value: 'prompts'
-        },
-        {
-          name: 'Uninstall script',
-          value: 'uninstall'
-        }
-      ]
-    }
-  ]
-
- */
-
-export default function (api) {
-  return []
-}

package/src/types/components.d.ts

@@ -1,163 +0,0 @@
-import type { GlobalComponentConstructor, QBtnProps, QBtnSlots, QItemProps } from 'quasar'
-import type { VNode } from 'vue'
-import { TypedOptions } from 'typed.js'
-
-export type StyleSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'none';
-
-export interface MBtnProps extends QBtnProps {
-  //
-}
-
-export interface MBtnSlots extends QBtnSlots {
-  /**
-   * Use for custom content, instead of relying on 'icon' and 'label' props
-   */
-  default: () => VNode[];
-  /**
-   * Override the default QSpinner when in 'loading' state
-   */
-  loading: () => VNode[];
-}
-
-export interface MBlockProps {
-  /**
-   * Size of the padding block.
-   * Default: 'md'
-   */
-  readonly size?: StyleSize | undefined;
-  /**
-   * Rounded block
-   */
-  readonly rounded?: boolean | undefined;
-  /**
-   * Shadow level
-   */
-  readonly shadow?: string | number | 'transition' | 'none' | undefined;
-}
-
-export interface MBlockSlots {
-  default: () => VNode[];
-}
-
-export type ColStyleType =
-  boolean
-  | undefined
-  | string
-  | number
-  | 'auto'
-  | 'grow'
-  | 'shrink'
-  | '1'
-  | '2'
-  | '3'
-  | '4'
-  | '5'
-  | '6'
-  | '7'
-  | '8'
-  | '9'
-  | '10'
-  | '11'
-  | '12'
-  | 1
-  | 2
-  | 3
-  | 4
-  | 5
-  | 6
-  | 7
-  | 8
-  | 9
-  | 10
-  | 11
-  | 12
-
-export interface MColProps {
-  readonly auto?: boolean | undefined;
-  readonly col?: ColStyleType;
-  readonly xs?: ColStyleType;
-  readonly sm?: ColStyleType;
-  readonly md?: ColStyleType;
-  readonly lg?: ColStyleType;
-  readonly xl?: ColStyleType;
-  readonly name?: string;
-}
-
-export interface MColSlots {
-  default: () => VNode[];
-}
-
-export interface MColumnProps {
-  [key: string]: any;
-}
-
-export interface MColumnSlots {
-  default: () => VNode[];
-}
-
-export interface MContainerProps {
-  readonly size?: StyleSize | string | undefined;
-  readonly dense?: boolean | undefined;
-  readonly fluid?: boolean | undefined;
-}
-
-export interface MContainerSlots {
-  default: () => VNode[];
-}
-
-export interface MRowProps {
-  /**
-   * Default: false.
-   */
-  gutter?: boolean | StyleSize | undefined;
-  /**
-   * Default: false.
-   */
-  col?: boolean | StyleSize | undefined;
-}
-
-export interface MRowSlots {
-  default: () => VNode[];
-}
-
-export interface MHelpRowProps extends Partial<QItemProps> {
-  text?: string | undefined;
-  icon?: string | undefined;
-  tooltip?: boolean | undefined;
-}
-
-export interface MHelpRowSlots {
-  default: () => VNode[];
-}
-
-export interface MTypingStringProps {
-  name: number | string;
-  tag?: string;
-  string: string | string[];
-  loop?: TypedOptions['loop'];
-  typeSpeed?: TypedOptions['typeSpeed'];
-  backDelay?: TypedOptions['backDelay'];
-  fadeOut?: TypedOptions['fadeOut'];
-  options?: Omit<TypedOptions, 'loop' | 'typeSpeed' | 'backDelay' | 'fadeOut'>;
-}
-
-export interface MTypingStringSlots {
-  default: () => VNode[];
-}
-
-declare module '@vue/runtime-core' {
-  interface GlobalComponents {
-    // Form.
-    MBtn: GlobalComponentConstructor<MBtnProps, MBtnSlots>;
-
-    // Grid.
-    MBlock: GlobalComponentConstructor<MBlockProps, MBlockSlots>;
-    MCol: GlobalComponentConstructor<MColProps, MColSlots>;
-    MColumn: GlobalComponentConstructor<MColumnProps, MColumnSlots>;
-    MContainer: GlobalComponentConstructor<MContainerProps, MContainerSlots>;
-    MHelpRow: GlobalComponentConstructor<MHelpRowProps, MHelpRowSlots>;
-    MRow: GlobalComponentConstructor<MRowProps, MRowSlots>;
-    // Typography.
-    MTypingString: GlobalComponentConstructor<MTypingStringProps, MTypingStringSlots>;
-  }
-}

package/src/types/index.d.ts

@@ -1,2 +0,0 @@
-export * from './components'
-export * from './myth'

package/src/types/myth.d.ts

@@ -1,42 +0,0 @@
-import type { QBtnProps } from 'quasar'
-import type { Ref } from 'vue'
-import type { MBlockProps, StyleSize } from './components'
-
-export interface UiOptionsContext {
-  /**
-   * Style of the components.
-   */
-  style?: {
-    /**
-     * Apply Padding on all sides of components.
-     */
-    gutters?: StyleSize | undefined;
-    /**
-     * Apply Fluid on all sides of containers.
-     */
-    fluid?: boolean | undefined;
-  };
-  /**
-   * MBtn component.
-   */
-  btn?: {
-    props?: Partial<QBtnProps>;
-    loading?: {
-      type: 'audio' | 'ball' | 'bars' | 'box' | 'clock' | 'comment' | 'cube' | 'dots' | 'facebook' | 'gears' | 'grid' | 'hearts' | 'hourglass' | 'infinity' | 'ios' | 'orbit' | 'oval' | 'pie' | 'puff' | 'radio' | 'rings' | 'tail';
-      color?: string | undefined;
-      size?: string | undefined;
-      label?: boolean | undefined;
-    }
-  };
-  /**
-   * MBlock component.
-   */
-  block?: Partial<MBlockProps>;
-}
-
-export interface MythContext {
-  options: Ref<UiOptionsContext>;
-  setOptions: (values: Partial<UiOptionsContext>) => void;
-  withOptions: (values: Partial<UiOptionsContext>) => void;
-  withBtnOptions: (values: Partial<QBtnProps>) => void;
-}

package/src/uninstall.js

@@ -1,9 +0,0 @@
-/**
- * Quasar App Extension uninstall script
- *
- * Docs: https://quasar.dev/app-extensions/development-guide/uninstall-api
- */
-
-export default function (api) {
-  //
-}

package/src/utils/myth.ts

@@ -1,30 +0,0 @@
-import { ref } from 'vue'
-import type { QBtnProps } from 'quasar'
-import { extend } from 'quasar'
-import type { MythContext, UiOptionsContext } from '../types'
-
-const defGutters = 'md'
-const defaultOptions: UiOptionsContext = {
-  style: {
-    gutters: defGutters
-  }
-}
-const optionsRef = ref<UiOptionsContext>({ ...defaultOptions })
-
-export const myth : MythContext = {
-  options: optionsRef,
-  setOptions (values: Partial<UiOptionsContext>) {
-    optionsRef.value = extend(!0, defaultOptions, values)
-  },
-  withOptions (values: Partial<UiOptionsContext>) {
-    optionsRef.value = extend(!0, defaultOptions, optionsRef.value, values)
-  },
-  withBtnOptions (values: Partial<QBtnProps>) {
-    this.withOptions({
-      btn: {
-        props: values
-      }
-    })
-  }
-}
-export default myth

package/src/utils/vue-plugin.ts

@@ -1,41 +0,0 @@
-import js from '../../package.json'
-import myth from './myth'
-import MBtn from '../components/form/MBtn.vue'
-import MBlock from '../components/grid/MBlock.vue'
-import MCol from '../components/grid/MCol.vue'
-import MColumn from '../components/grid/MColumn.vue'
-import MContainer from '../components/grid/MContainer.vue'
-import MHelpRow from '../components/grid/MHelpRow.vue'
-import MRow from '../components/grid/MRow.vue'
-import MTypingString from '../components/typography/MTypingString.vue'
-import type { App } from 'vue'
-
-const name = js.name
-const version = js.version
-
-function install (app: App, options = {}) {
-  myth.withOptions(options)
-
-  // Form.
-  app.component('MBtn', MBtn)
-
-  // Grid.
-  app.component('MBlock', MBlock)
-  app.component('MCol', MCol)
-  app.component('MColumn', MColumn)
-  app.component('MContainer', MContainer)
-  app.component('MHelpRow', MHelpRow)
-  app.component('MRow', MRow)
-
-  // Typography.
-  app.component('MTypingString', MTypingString)
-}
-
-export const e = {
-  name,
-  version,
-  install,
-  myth
-}
-
-export default e

package/tsconfig.json

@@ -1,34 +0,0 @@
-{
-  "compilerOptions": {
-    "baseUrl": "./",
-    "rootDir": "./",
-    "outDir": "./dist",
-    "esModuleInterop": true,
-    "skipLibCheck": true,
-    "target": "esnext",
-    "allowJs": true,
-    "resolveJsonModule": true,
-    "moduleDetection": "force",
-    "isolatedModules": true,
-    "verbatimModuleSyntax": true,
-    "module": "preserve",
-    "noEmit": true,
-    "lib": [
-      "esnext",
-      "dom",
-      "dom.iterable"
-    ],
-    "strict": true,
-    "allowUnreachableCode": false,
-    "allowUnusedLabels": false,
-    "noImplicitOverride": true,
-    "exactOptionalPropertyTypes": true,
-    "noUncheckedIndexedAccess": true
-  },
-  "exclude": [
-    "./build"
-  ],
-  "include": [
-    "src/**/*"
-  ]
-}