vue-spear-tip 0.1.3 → 0.1.4

package/package.json

@@ -1,17 +1,43 @@
 {
   "name": "vue-spear-tip",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "type": "module",
-  "main": "./index.cjs",
-  "module": "./index.js",
+  "main": "./dist/vue-spear-tip.cjs.js",
+  "module": "./dist/vue-spear-tip.es.js",
+  "scripts": {
+    "build": "vite build",
+    "build:examples": "vite build --mode examples",
+    "dev": "vite dev"
+  },
   "exports": {
     ".": {
-      "import": "./index.js",
-      "require": "./index.cjs",
-      "types": {
-        "require": "./index.d.cts",
-        "default": "./index.d.ts"
-      }
+      "types": "./index.d.ts"
     }
-  }
+  },
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@bunchtogether/vite-plugin-flow": "^1.0.2",
+    "@rollup/plugin-typescript": "^12.1.4",
+    "@vitejs/plugin-vue": "^6.0.1",
+    "pug": "^3.*",
+    "sass-embedded": "^1.93.2",
+    "typescript": "^5.*",
+    "unocss": "^66.*",
+    "unocss-preset-scalpel": "^1.2.7",
+    "vite": "^7.*",
+    "vite-plugin-pug": "^0.4.1",
+    "vue": "^3.5.*"
+  },
+  "license": "MIT",
+  "keywords": [
+    "vue",
+    "typescript",
+    "class",
+    "component",
+    "oop",
+    "kit",
+    "frontend"
+  ]
 }

package/.github/workflows/publish.yml

@@ -1,23 +0,0 @@
-name: Publish Package
-on:
-  release:
-    types: [published]
-
-permissions:
-  contents: read
-
-jobs:
-  publish:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v5
-      - uses: actions/setup-node@v4
-        with:
-          node-version: '22'
-          registry-url: 'https://registry.npmjs.org'
-          token: ${{ secrets.NPM_TOKEN }}
-      - run: npm install -g npm@latest
-      - run: echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" > ~/.npmrc
-      - run: npm publish
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/index.cjs

@@ -1,5 +0,0 @@
-
-
-export default {
-
-}

package/index.js

@@ -1,5 +0,0 @@
-
-
-export default {
-
-}

package/src/Interfaces/IBaseVueComponent.ts

@@ -1,7 +0,0 @@
-import IVueClass from './IVueClass'
-
-export default interface IBaseVueComponent extends IVueClass {
-  readonly $root: {
-    [key:string]:any
-  }
-}

package/src/Interfaces/IVueClass.ts

@@ -1,226 +0,0 @@
-import {VNode} from '@vue/runtime-core'
-
-/**
- * Наследуемый интерфейс компонента vue
- * @interface IVueClass
- * @typedef {Function} mounted Mount
- */
-export default interface IVueClass {
-  readonly mixins: Array<any>
-  readonly components: {[key:string|symbol|number]:any}
-  readonly emits: Array<string>
-  readonly emitsParent: Array<string>
-  readonly inject: Array<string>
-  readonly injectParent: Array<string>
-  readonly provide: {[key:string]:any}
-  readonly provideParent: {[key:string]:(...args: any) => any}
-  
-  /**
-   * Название компонента. Определяется автоматически по названию класса если наследовать от View.
-   */
-  readonly name: string
-  
-  /**
-   * Экземпляр класса. Учтите, что контекст this не будет содержать vue элементов.
-   */
-  readonly instance?: this
-  
-  /**
-   * Содержит привязки атрибутов и события в родительском компоненте,
-   * которые не были распознаны (и исключены) как
-   * [входные параметры](https://v3.ru.vuejs.org/ru/api/options-data.html#props)
-   * компонента или пользовательские события.
-   * Если компонент не объявляет входные параметры или
-   * [пользовательские события](https://v3.ru.vuejs.org/ru/api/options-data.html#emits),
-   * тут будут все привязки из родительского компонента,
-   * которые можно передать через v-bind="$attrs" внутреннему компоненту —
-   * удобно при создании компонентов высшего порядка (HOC, High Order Components).
-   *
-   * **См. также**
-   *
-   * [$attrs](https://v3.ru.vuejs.org/ru/api/instance-properties.html#attrs)
-   *
-   * [Передача обычных атрибутов](https://v3.ru.vuejs.org/ru/guide/component-attrs.html)
-   *
-   * [Options API / Разное — inheritAttrs](https://v3.ru.vuejs.org/ru/api/options-misc.html#inheritattrs)
-   */
-  readonly $attrs: Object
-  
-  /**
-   * Объект с данными, за которыми осуществляет наблюдение экземпляр компонента.
-   * Экземпляр компонента проксирует доступ к свойствам объекта данных.
-   *
-   * **См. также**
-   *
-   * [$data](https://v3.ru.vuejs.org/ru/api/instance-properties.html#data)
-   *
-   * [Options API / Локальное состояние — data](https://v3.ru.vuejs.org/ru/api/options-data.html#data)
-   */
-  readonly $data: Object
-  
-  /**
-   * Корневой элемент DOM, которым управляет экземпляр компонента.
-   *
-   * Для компонентов использующих [фрагменты](https://v3.ru.vuejs.org/ru/guide/migration/fragments.html),
-   * `$el` будет узлом DOM, с помощью которого Vue будет отслеживать место компонента в DOM.
-   * Рекомендуется использовать ссылки на элементы шаблона для доступа к элементам DOM напрямую,
-   * а не полагаться на `$el`
-   *
-   * **См. также**
-   *
-   * [$el](https://v3.ru.vuejs.org/ru/api/instance-properties.html#el)
-   */
-  readonly $el: HTMLElement
-  
-  /**
-   * Опции инициализации, используемые для текущего экземпляра компонента.
-   * Полезно, если потребуется добавить пользовательские свойства в опции:
-   *
-   * **См. также**
-   *
-   * [$options](https://v3.ru.vuejs.org/ru/api/instance-properties.html#options)
-   */
-  readonly $options: {
-    __scopeId: string
-    __file: string
-  }
-  
-  /**
-   * Родительский экземпляр, если таковой имеется
-   *
-   * **См. также**
-   *
-   * [$parent](https://v3.ru.vuejs.org/ru/api/instance-properties.html#parent)
-   */
-  readonly $parent: IVueClass|null
-  
-  /**
-   * Объект, содержащий текущие входные параметры, которые получил компонент.
-   * Экземпляр компонента проксирует доступ к свойствам объекта входных параметров.
-   *
-   * **См. также**
-   *
-   * [$props](https://v3.ru.vuejs.org/ru/api/instance-properties.html#props)
-   */
-  readonly $props: {[key:string]:any}
-  
-  /**
-   * Объект из DOM-элементов и экземпляров компонентов, зарегистрированных с помощью
-   * [атрибутов ref](https://v3.ru.vuejs.org/ru/guide/component-template-refs.html).
-   *
-   * **См. также**
-   *
-   * [Ссылки на элементы шаблона](https://v3.ru.vuejs.org/ru/guide/component-template-refs.html)
-   * [Специальные атрибуты — ref](https://v3.ru.vuejs.org/ru/api/special-attributes.html#ref)
-   */
-  readonly $refs: {
-    [key:string]:HTMLElement|HTMLInputElement|undefined|
-    HTMLElement[]|HTMLInputElement[]
-  }
-  
-  /**
-   * Экземпляр корневого компонента текущего дерева компонентов.
-   * Если у текущего экземпляра нет родителя, то значением будет он сам.
-   */
-  readonly $root: {
-    // [key:string]:any
-    readonly APP?: any
-  }|this|any
-  
-  /**
-   * Используется для программного доступа к содержимому, распределяемому с помощью слотов.
-   * Каждый именованный слот имеет соответствующее свойство
-   * (например, содержимое v-slot:foo будет доступно через this.$slots.foo()).
-   */
-  readonly $slots: {
-    default: () => VNode[]
-  } & {
-    [key: string]: (() => VNode[]) | undefined
-  }
-  
-  /**
-   * Генерирует событие на текущем экземпляре.
-   * Любые дополнительные аргументы будут переданы в callback функции прослушивания события.
-   * @param {String} eventName Название события
-   * @param {*} args Аргументы передаваемые в него
-   */
-  $emit(eventName: string, ...args: any[]): void
-  
-  /**
-   * Откладывает вызов коллбэка до следующего цикла обновления DOM.
-   * @param {Function} callback
-   */
-  $forceUpdate(callback?: Function): void
-  
-  /**
-   * Отслеживание изменений реактивного свойства или функции вычисляемого свойства.
-   * @param {String} source
-   * @param {Function} callback
-   * @param {VueWatchOptions} options
-   */
-  $watch(source?: string | Function, callback?: Function | object, options?: VueWatchOptions): void
-  
-  /**
-   * Откладывает вызов коллбэка до следующего цикла обновления DOM.
-   * @param {Function} callback
-   */
-  $nextTick(callback?: Function): void
-  
-  /** Параметры vue компонента */
-  readonly $: {
-    [key: string]: any,
-    uid: number,
-    app: {
-      [key: string]: any,
-      appContext: {
-        [key: string]: any,
-        version: string
-      }
-    },
-    vnode: {
-      [key: string]: any,
-      scopeId: string,
-    }
-  }
-  
-  
-  // Хуки жизненного цикла
-  beforeCreate(): void
-  created(): void
-  beforeMount(): void
-  mounted(): void
-  beforeUpdate(): void
-  updated(): void
-  beforeUnmount(): void
-  unmounted(): void
-  
-  // Родительские хуки
-  beforeCreateParent(): void
-  createdParent(): void
-  beforeMountParent(): void
-  mountedParent(): void
-  beforeUpdateParent(): void
-  updatedParent(): void
-  beforeUnmountParent(): void
-  unmountedParent(): void
-  
-  /**
-   * Рекурсивный пропуск шагов
-   * @param {Function} callback
-   * @param {Number} steps Количество шагов (тиков, смен сцен), которые нужно пропустить
-   */
-  nextTick(callback: () => void, steps?: number): void
-  
-  /**
-   * Проверка наличия внешнего обработчика события
-   * @param name
-   */
-  hasExternalHandlerEvent(name: string): boolean
-}
-
-export interface VueWatchOptions {
-  deep?: boolean,
-  immediate?: boolean,
-  once?: boolean,
-  flush?: string,
-}

package/src/components/BaseComponent.vue

@@ -1,22 +0,0 @@
-<script lang="ts">
-import IBaseVueComponent from '../Interfaces/IBaseVueComponent'
-import VueClass from '../Vue/VueClass'
-
-/**
- * Базовый компонент.
- * В дальнейшем планируется в него внедрять полезные методы и реактивные свойства (размеры окна, тип и т.д.).
- * От него можно наследовать любой компонент.
- */
-export default abstract class BaseComponent extends VueClass implements IBaseVueComponent {
-  emitsParent = ['update:modelValue']
-  declare readonly $root: {
-    [key: string]: any
-  }
-  constructor() {
-    super()
-  }
-  mountedParent() {
-
-  }
-}
-</script>

package/src/core/Computed.ts

@@ -1,38 +0,0 @@
-/**
- * Трансформация метода в vue computed функцию
- * @param {String} propertyName Название свойства
- * @constructor
- */
-export const Computed = function(propertyName: string): any {
-  return (target: any, propertyKey: string, descriptor: PropertyDescriptor) => { // @ts-ignore
-    if(!globalThis._vueClassInstances[target.constructor.name]) { // @ts-ignore
-      globalThis._vueClassInstances[target.constructor.name] = new target.constructor // @ts-ignore
-      globalThis._vueClassInstances[target.constructor.name].name = 'test' // @ts-ignore
-      globalThis._vueClassInstances[target.constructor.name].name = // @ts-ignore
-        globalThis._vueClassInstances[target.constructor.name]?.constructor?.name?.toString() // @ts-ignore
-        ?? globalThis._vueClassInstances[target.constructor.name]['name'] // @ts-ignore
-        ??  ''
-    }
-    if(!target?.constructor?.prototype?.__vue_computed__) {
-      target.constructor.prototype.__vue_computed__ = {}
-    }
-    if(!target?.constructor?.prototype?.__vue_computed__[target.constructor.name]) {
-      target.constructor.prototype.__vue_computed__[target.constructor.name] = {}
-    }
-    target.constructor.prototype.__vue_computed__[target.constructor.name][propertyName ?? propertyKey]  // @ts-ignore
-      = globalThis._vueClassInstances[target.constructor.name][propertyKey]
-
-    // @ts-ignore
-    if(!globalThis._vueComputed[target.constructor.name]) { // @ts-ignore
-      globalThis._vueComputed[target.constructor.name] = {}
-    }
-
-    // @ts-ignore
-    let callback = globalThis._vueClassInstances[target.constructor.name][propertyKey] // @ts-ignore
-    globalThis._vueClassInstances[target.constructor.name][propertyKey] = undefined // @ts-ignore
-    delete globalThis._vueClassInstances[target.constructor.name][propertyKey] // @ts-ignore
-    globalThis._vueComputed[target.constructor.name][propertyName ?? propertyKey] = {
-      get: callback
-    }
-  }
-}

package/src/core/Props.ts

@@ -1,70 +0,0 @@
-// @ts-ignore
-import {DebuggerEvent} from 'vue/dist/vue.esm-bundler'
-
-type VuePropsTypes = typeof String | typeof Number | typeof Array | typeof Boolean | typeof Object |
-  typeof Date | typeof Function | typeof Symbol | null
-
-type WatchCallback<T> = (
-  value: T,
-  oldValue: T,
-  onCleanup: (cleanupFn: () => void) => void
-) => void
-
-interface VuePropObj {
-  type: VuePropsTypes | VuePropsTypes[],
-  validator?: Function,
-  default?: any,
-  required?: boolean,
-  event?: string,
-  deep?: boolean, // default: false
-  handler?: WatchCallback<any> | string
-  immediate?: boolean // default: false
-  flush?: 'pre' | 'post' | 'sync' // default: 'pre'
-  onTrack?: (event: DebuggerEvent) => void
-  onTrigger?: (event: DebuggerEvent) => void
-}
-
-/**
- * Трансформация свойства во vue property
- * @param propDataOrType
- * @param types
- * @constructor
- */
-export const Prop = (
-  propDataOrType: VuePropsTypes | VuePropObj,
-  ...types: (VuePropsTypes)[]
-): any => {
-  return (target: any, propertyKey: string, descriptor: PropertyDescriptor) => {
-    // @ts-ignore
-    if(!globalThis._vueClassInstances[target.constructor.name]) {
-      // @ts-ignore
-      globalThis._vueClassInstances[target.constructor.name] = new target.constructor
-      // @ts-ignore
-      globalThis._vueClassInstances[target.constructor.name].name =
-          // @ts-ignore
-          globalThis._vueClassInstances[target.constructor.name]?.constructor?.name?.toString()
-          // @ts-ignore
-          ?? globalThis._vueClassInstances[target.constructor.name]['name']
-          ??  ''
-    }
-
-    let TypeObj = typeof propDataOrType == 'object' ? propDataOrType : {
-      type: [propDataOrType, ...types]
-    }
-    // @ts-ignore
-    if(globalThis._vueClassInstances[target.constructor.name][propertyKey]) {
-      // @ts-ignore
-      TypeObj.default = globalThis._vueClassInstances[target.constructor.name][propertyKey]
-    }
-
-    // @ts-ignore
-    if(!globalThis._vueClassProps[target.constructor.name]) {
-      // @ts-ignore
-      globalThis._vueClassProps[target.constructor.name] = {}
-    }
-
-    // @ts-ignore
-    globalThis._vueClassProps[target.constructor.name][propertyKey] = TypeObj
-    // console.log(globalThis._vueClassInstances[target.constructor.name], target.constructor.name, globalThis._vueClassProps[target.constructor.name])
-  }
-}

package/src/core/VueClass.ts

@@ -1,79 +0,0 @@
-import { VNode } from "@vue/runtime-core"
-import IVueClass from '../Interfaces/IVueClass'
-
-export default abstract class VueClass implements IVueClass {
-  public readonly mixins: Array<any> = []
-  public readonly components: {[key:string|symbol|number]:any} = {}
-  public readonly emits: Array<string> = []
-  public readonly emitsParent: Array<string> = []
-  public readonly inject: Array<string> = []
-  public readonly injectParent: Array<string> = []
-  public readonly provide: {[key:string]:any} = {}
-  public readonly provideParent: {[key:string]:(...args: any) => any} = {}
-
-  readonly name: string
-  readonly instance?: this = this
-  readonly $attrs: {[key:string]:any} = {}
-  readonly $data: {[key:string]:any} = {}
-  readonly $el: HTMLElement // $I.Frontend.HTML.Element
-  readonly $options: {
-    __scopeId: string
-    __file: string
-  }
-  readonly $parent: VueClass|null
-  readonly $props: Object
-  readonly $refs: {
-    [key:string]: HTMLElement|HTMLInputElement|HTMLElement[]|HTMLInputElement[]
-  }
-  readonly $root: {
-    // [key:string]:any
-    readonly APP?: any
-  }|this|any
-  readonly $slots: {
-    default: () => VNode[]
-  } & {
-    [key: string]: (() => VNode[]) | undefined
-  }
-
-  $emit(eventName: string, ...args: any[]): void {}
-  $forceUpdate(callback?: Function): void {}
-  $watch(source?: string | Function, callback?: Function | object, options?: any /* VueWatchOptions */): void {}
-  $nextTick(callback?: Function): void {}
-
-  readonly $: {
-    [key: string]: any,
-    uid: number,
-    app: {
-      [key: string]: any,
-      appContext: {
-        [key: string]: any,
-        version: string
-      }
-    },
-    vnode: {
-      [key: string]: any,
-      scopeId: string,
-    }
-  } = {} as any
-
-  beforeCreate() {}
-  created() {}
-  beforeMount() {}
-  mounted() {}
-  beforeUpdate() {}
-  updated() {}
-  beforeUnmount() {}
-  unmounted() {}
-
-  beforeCreateParent() {}
-  createdParent() {}
-  beforeMountParent() {}
-  mountedParent() {}
-  beforeUpdateParent() {}
-  updatedParent() {}
-  beforeUnmountParent() {}
-  unmountedParent() {}
-
-  nextTick(callback: () => void, steps: number = 1) {}
-  hasExternalHandlerEvent(name: string): boolean {return false}
-}

package/src/core/VueClassComponent.ts

@@ -1,347 +0,0 @@
-import {defineComponent, getCurrentInstance, nextTick} from 'vue' // @ts-ignore
-import VueClass from "./VueClass.ts"
-
-/**
- * Параметры readonly из экземпляра vue
- */
-const vueDefaultProps = [
-  '$attrs', '$data', '$el', '$off', '$on','$emit',  '$forceUpdate',
-  '$nextTick', '$options', '$parent', '$props',  '$refs',
-  '$root', '$slots', '$watch'
-]
-
-type VueProps = {
-  /** Название компонента */
-  name?: string
-}
-
-// Объявляем типы для глобального хранилища
-declare global {
-  var _vueClassInstances: Record<string, any>
-  var _vueClassProps: Record<string, Record<string, any>>
-  var _vueClassWatchers: Record<string, Record<string, any>>
-  var _vueComputed: Record<string, Record<string, any>>
-}
-
-// Инициализация глобальных объектов, если они не существуют
-if (typeof globalThis._vueClassInstances === 'undefined') {
-  globalThis._vueClassInstances = {}
-}
-if (typeof globalThis._vueClassProps === 'undefined') {
-  globalThis._vueClassProps = {}
-}
-if (typeof globalThis._vueClassWatchers === 'undefined') {
-  globalThis._vueClassWatchers = {}
-}
-if (typeof globalThis._vueComputed === 'undefined') {
-  globalThis._vueComputed = {}
-}
-
-/**
- * Декоратор для создания компонента на основе класса VueClass
- * @param options - опции компонента или конструктор класса
- * @example
- * \@VueClassComponent({ // TODO нужно обновлять при разработке и получать при сборке, необходим написать vite плагин
- *   makeGlobal: true, // <- сделать глобальным, если название совпадёт с системным, то будет проигнорировано
- * }) ComponentNameWebview extends Webview {
- *
- * }
- * @example
- * \@VueClassComponent ComponentNameWebview extends Webview {
- *
- * }
- * @returns - декоратор для класса
- */
-function VueClassComponentDecorator<P = {}>(
-  options: P | (new (...args: any[]) => any)
-): any {
-  // Если передан конструктор (используется как @VueClassComponent)
-  if (typeof options === 'function') { // @ts-ignore
-    return createComponent(options)
-  }
-
-  // Если передан объект с опциями (используется как @VueClassComponent(options))
-  return function(constructor: new (...args: any[]) => any) {
-
-    // @ts-ignore
-    return createComponent(constructor, options)
-  }
-}
-
-
-function createComponent<T extends { new(...args: any[]): {} }>(
-  constructor: T,
-  options: any = {}
-): T & VueClass {
-  // Создаем инстанс класса или получаем существующий
-  let vueClassInstance = globalThis?._vueClassInstances[constructor.name] ?? new constructor()
-
-  // Проверка наследования от VueClass
-  if (!(vueClassInstance instanceof VueClass)) {
-    throw `Класс ${constructor.name} должен наследоваться от класса VueClass или его потомков`
-  }
-
-  // Сохраняем инстанс, если его еще нет
-  if (!globalThis?._vueClassInstances[constructor.name]) {
-    globalThis._vueClassInstances[constructor.name] = vueClassInstance
-  }
-
-  // Получаем методы
-  const methods = {}
-  const VCC = new VueClassChild()
-  for (let m of arrayDiff(getMethods(vueClassInstance), getMethods(VCC, true))) { // @ts-ignore
-    methods[m] = vueClassInstance[m]
-  }
-
-  // Обработка props
-  const dataProps = {}
-  let props = Object.assign({}, (globalThis._vueClassProps[constructor.name] ?? {}))
-  let pProps = Object.getPrototypeOf(vueClassInstance)
-
-  do {
-    props = Object.assign(props, (globalThis._vueClassProps[pProps.constructor.name] ?? {}))
-  } while ((pProps = Object.getPrototypeOf(pProps)) instanceof VueClass)
-
-  // Обработка свойств объекта
-  for (let p of getObjProps(vueClassInstance)) {
-    if (!props[p]) { // @ts-ignore
-      dataProps[p] = vueClassInstance[p]
-    }
-  }
-
-  // Обработка watchers
-  let watch = Object.assign({}, (globalThis._vueClassWatchers[constructor.name] ?? {}))
-  let pWatch = Object.getPrototypeOf(vueClassInstance)
-
-  do {
-    watch = Object.assign(watch, (globalThis._vueClassWatchers[pWatch.constructor.name] ?? {}))
-  } while ((pWatch = Object.getPrototypeOf(pWatch)) instanceof VueClass)
-
-  // Обработка computed свойств
-  let computed = Object.assign({}, (globalThis._vueComputed[constructor.name] ?? {}))
-  for (let name in computed) { // @ts-ignore
-    delete vueClassInstance[name]
-  }
-
-  let componentOutHandlers: string[] = []
-
-  // @ts-ignore Возвращаем Vue компонент
-  return defineComponent({
-    props,
-    watch,
-    computed,
-    name: vueClassInstance['name'] ?? vueClassInstance['instance']?.constructor?.name,
-    mixins: vueClassInstance.mixins,
-    components: vueClassInstance.components,
-    emits: vueClassInstance.emits.concat(vueClassInstance.emitsParent),
-    inject: vueClassInstance.inject.concat(vueClassInstance.injectParent),
-    provide: {...vueClassInstance.provideParent, ...vueClassInstance.provide},
-    beforeCreate: function() {
-      // @ts-ignore
-      // console.log(this.$parent?.$options.__scopeId, this.$options.__scopeId)
-      // @ts-ignore Пересоздаём экземпляр, так как функция декоратора вызывается один раз
-      vueClassInstance = new constructor()
-      // console.log(getCurrentInstance()?.parent?.vnode?.type?.__scopeId)
-      vueClassInstance.$options = this.$options
-      vueClassInstance.$parent = this.$parent
-      vueClassInstance.$root = this.$root
-      vueClassInstance.$slots = this.$slots
-      // console.log(vueClassInstance, vueClassInstance.__vue_props__)
-
-      // @ts-ignore
-      vueClassInstance['instance'] = vueClassInstance // @ts-ignore
-      this.name = vueClassInstance['name'] ?? vueClassInstance['instance']?.constructor.name
-      /**
-       * Рекурсивный пропуск шагов
-       * @see $nextTick
-       * @param {Function} callback
-       * @param {Number} steps Количество шагов, которые нужно пропустить
-       */ // @ts-ignore
-      this.nextTick = vueClassInstance.nextTick = (callback: () => void, steps: number = 1) => {
-        const recursiveNextTick = (remainingSteps: number) => {
-          this.$nextTick(() => {
-            if (remainingSteps > 1) {
-              recursiveNextTick(remainingSteps - 1)
-            }
-            else if (typeof callback == 'function' && !(callback instanceof Promise)) {
-              callback?.call?.(this)
-            }
-          })
-        }
-        recursiveNextTick(steps)
-      }
-      vueClassInstance.beforeCreateParent.call(this)
-      vueClassInstance.beforeCreate.call(this)
-    },
-    created: function() { // @ts-ignore
-      this.name = vueClassInstance['name'] ?? vueClassInstance['instance']?.constructor.name
-      for(let method in methods) { // @ts-ignore
-        this[method] = vueClassInstance[method].bind(this)
-      }
-      vueClassInstance.createdParent.call(this)
-      vueClassInstance.created.call(this)
-    },
-    beforeMount: function() {
-      vueClassInstance.beforeMountParent.call(this)
-      vueClassInstance.beforeMount.call(this)
-      const updateEventHandlers = () => {
-        const instance = getCurrentInstance() // @ts-ignore
-        if (instance && instance.vnode.props) { // @ts-ignore
-          componentOutHandlers = Object.keys(instance.vnode.props)
-            .filter(key => key.startsWith('on'))
-            .map(key => key.slice(2).toLowerCase())
-        }
-      }
-
-      updateEventHandlers()
-
-      // Дополнительная проверка после монтирования
-      nextTick(() => {
-        updateEventHandlers()
-      }) // @ts-ignore
-      this['hasExternalHandlerEvent'] = (event: string) => componentOutHandlers.includes(event)
-    },
-    mounted: function() {
-      vueClassInstance.mountedParent.call(this)
-      vueClassInstance.mounted.call(this)
-      // console.log(this.computed)
-    },
-    beforeUpdate: function() {
-      vueClassInstance.beforeUpdateParent.call(this)
-      vueClassInstance.beforeUpdate.call(this)
-      const updateEventHandlers = () => {
-        const instance = getCurrentInstance() // @ts-ignore
-        if (instance && instance.vnode.props) { // @ts-ignore
-          componentOutHandlers = Object.keys(instance.vnode.props)
-            .filter(key => key.startsWith('on'))
-            .map(key => key.slice(2).toLowerCase())
-        }
-      }
-
-      updateEventHandlers()
-
-      // Дополнительная проверка после монтирования
-      nextTick(() => {
-        updateEventHandlers()
-      }) // @ts-ignore
-      this['hasExternalHandlerEvent'] = (event: string) => componentOutHandlers.includes(event)
-    },
-    updated: function() {
-      vueClassInstance.updatedParent.call(this)
-      vueClassInstance.updated.call(this)
-    },
-    beforeUnmount: function() {
-      vueClassInstance.beforeUnmountParent.call(this)
-      vueClassInstance.beforeUnmount.call(this)
-    },
-    unmounted: function() {
-      vueClassInstance.unmountedParent.call(this)
-      vueClassInstance.unmounted.call(this)
-    },
-    data: function() {
-      return {...dataProps, ...{__vue_class_instance__:null}}
-    },
-  })
-}
-
-export const VueClassComponent = VueClassComponentDecorator
-
-/**
- * Получение списка методов из класса
- * @param {Object} obj Запущенный экземпляр класса
- * @param {Boolean} ignoreVueClassBreak Игнорировать ли методы класса `VueClass`
- */
-function getMethods(obj: object, ignoreVueClassBreak: boolean = false) {
-  let properties = new Set()
-  let currentObj = obj
-  do {
-    if(!ignoreVueClassBreak && currentObj.constructor.name == 'VueClass') {
-      break
-    }
-    Object.getOwnPropertyNames(currentObj).map(item => properties.add(item))
-  } while ((currentObj = Object.getPrototypeOf(currentObj))) // @ts-ignore
-  return [...properties.keys()].filter((item: any) => typeof obj[item] === 'function' && typeof Object[item] != 'function')
-}
-
-/**
- * Получение списка параметров из класса
- * @param {Object} obj Запущенный экземпляр класса
- * @param {Boolean} ignoreVueClassBreak Игнорировать ли методы класса `VueClass`
- */
-function getObjProps(obj: any, ignoreVueClassBreak: boolean = false): any[] {
-  let properties = new Set()
-  let currentObj = obj
-  do {
-    if(!ignoreVueClassBreak && currentObj.constructor.name == 'VueClass') {
-      break
-    }
-    Object.getOwnPropertyNames(currentObj).map(item => properties.add(item))
-  } while ((currentObj = Object.getPrototypeOf(currentObj))) // @ts-ignore
-    return [...properties.keys()].filter((item: any) => {
-      return vueDefaultProps.indexOf(item) == -1
-        && item != '__vue_props__'
-        && obj[item] !== 'function' // @ts-ignore
-        && typeof Object[item] != 'function'
-    }
-  )
-}
-
-/**
- * Расширение Vue объекта
- * @param vueInstance
- * @param watch
- * @param computed
- */
-function extendVueInstance(vueInstance: any, watch: any, computed: any) {
-  const p = new Proxy(vueInstance, {
-    get(target, prop, receiver) {
-
-
-      // -----------------------------------
-      // Дополнение метода `$nextTick`
-      // -----------------------------------
-      if (prop === '$nextTick') {
-        return function(fn: () => void, steps: number = 1) {
-          const recursiveNextTick = function (remainingSteps: number) {
-            vueInstance.$nextTick(() => {
-              if (remainingSteps > 1) {
-                recursiveNextTick(remainingSteps - 1)
-              }
-              else {
-                fn.call(vueInstance)
-              }
-            })
-          }.bind(vueInstance)
-
-          recursiveNextTick(steps)
-        }.bind(vueInstance)
-      }
-
-      return target[prop]
-    }
-  })
-  for (let n in watch) {
-    watch[n].handler = watch[n].handler.bind(p)
-  }
-  for (let n in computed) {
-    computed[n].get = computed[n].get.bind(p)
-  }
-  return p
-}
-
-/**
- * Получение различий из массивов
- * @param {Array} a
- * @param {Array} b
- */
-function arrayDiff(a: any[], b: any[]): any[] {
-  return a.filter((v) => !b.includes(v))
-}
-
-
-class VueClassChild extends VueClass {}
-
-
-export {
-  VueClass
-}

package/src/core/Watch.ts

@@ -1,45 +0,0 @@
-/**
- * Трансформация метода в vue watch функцию
- * @param {String} propertyName Название свойства
- * @param {boolean} deep Следить ли за изменениями объекта в глубину
- * @param {boolean} immediate Выполнить ли метод сразу, не учитывая есть ли изменения
- * @constructor
- */
-export const Watch = function(propertyName: string, deep: boolean = false, immediate: boolean = false): any {
-  return (target: any, propertyKey: string, descriptor: PropertyDescriptor) => {
-    // @ts-ignore
-    if(!globalThis._vueClassInstances[target.constructor.name]) {
-      // @ts-ignore
-      globalThis._vueClassInstances[target.constructor.name] = new target.constructor
-      // @ts-ignore
-      globalThis._vueClassInstances[target.constructor.name].name =
-        // @ts-ignore
-        globalThis._vueClassInstances[target.constructor.name]?.constructor?.name?.toString()
-        // @ts-ignore
-        ?? globalThis._vueClassInstances[target.constructor.name]['name']
-        ??  ''
-    }
-    if(!target?.constructor?.prototype?.__vue_watch__) {
-      target.constructor.prototype.__vue_watch__ = {}
-    }
-    if(!target?.constructor?.prototype?.__vue_watch__[target.constructor.name]) {
-      target.constructor.prototype.__vue_watch__[target.constructor.name] = {}
-    }
-    // @ts-ignore
-    target.constructor.prototype.__vue_watch__[target.constructor.name][propertyName] = globalThis._vueClassInstances[target.constructor.name][propertyKey]
-
-    // @ts-ignore
-    if(!globalThis._vueClassWatchers[target.constructor.name]) {
-      // @ts-ignore
-      globalThis._vueClassWatchers[target.constructor.name] = {}
-    }
-
-    // @ts-ignore
-    globalThis._vueClassWatchers[target.constructor.name][propertyName] = {
-      // @ts-ignore
-      handler: globalThis._vueClassInstances[target.constructor.name][propertyKey],
-      deep: deep,
-      immediate: immediate,
-    }
-  }
-}

package/src/core/index.ts

@@ -1,9 +0,0 @@
-// @ts-ignore
-globalThis._vueClassInstances = {};globalThis._vueClassProps = {};globalThis._vueClassWatchers = {};globalThis._vueComputed = {}
-
-export * from './VueClassComponent'
-export * from './Props'
-export * from './Watch'
-export * from './Computed' // @ts-ignore
-export {BaseComponent} from '../Components/BaseComponent.vue'
-

package/tsconfig.json

@@ -1,14 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "esnext",
-    "module": "esnext",
-    "moduleResolution": "node",
-    "strict": true,
-    "declaration": true,
-    "outDir": "dist",
-    "skipLibCheck": true,
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true
-  },
-  "include": ["vite.config.*", "src/**/*", "src/**/*.vue"]
-}