decorator util

Author: ruojianll

src/component.ts

@@ -1,5 +1,5 @@
 import { defineComponent, type ComponentCustomOptions, type MethodOptions } from 'vue';
-import { obtainSlot, getSuperSlot, getProviderFunction } from './utils'
+import { obtainSlot, getSuperSlot, getProviderFunction, optionNullableClassDecorator } from './utils'
 import { build as optionSetup } from './option/setup'
 import { build as optionComputed } from './option/computed'
 import { build as optionData } from './option/data'
@@ -15,7 +15,6 @@ import { build as optionAccessor } from './option/accessor'
 import type { SetupContext } from 'vue';
 import type { OptionBuilder } from './optionBuilder'
 import type { VueCons } from './class'
-import * as DecoratorCompatible from './deco3/utils'
 type SetupFunction<T> = (this: void, props: Readonly<any>, ctx: SetupContext<any>) => T | Promise<T>
 export type OptionSetupFunction = SetupFunction<any>
 export type ComponentSetupFunction = SetupFunction<Record<string, any>>
@@ -71,8 +70,6 @@ type ComponentOption = {
     methods?: MethodOptions
 }
 
-type ComponentConsOption = VueCons | ComponentOption
-
 function buildComponent(cons: VueCons, arg: ComponentOption, extend?: any): any {
     const option = ComponentOption(cons, extend)
     const slot = obtainSlot(cons.prototype)
@@ -164,22 +161,9 @@ function build(cons: VueCons, option: ComponentOption) {
     (cons as any).__vccOpts = component
 }
 
-export function ComponentBase(arg: ComponentConsOption, ctx?: ClassDecoratorContext): any {
-    function process(cons: VueCons, option: ComponentOption) {
-        build(cons, option)
-        return cons
-    }
-    if (typeof arg === 'function') {
-        return DecoratorCompatible.compatibleClassDecorator(function (cons: VueCons) {
-            return process(cons, {})
-        })(arg, ctx)
-    }
-    return DecoratorCompatible.compatibleClassDecorator(function (cons: VueCons) {
-        return process(cons, arg)
-    })
-}
-
-
+export const ComponentBase = optionNullableClassDecorator((cons: VueCons, option?: ComponentOption) => {
+    build(cons, option ?? {})
+})
 
 export function toNative<T extends VueCons>(cons: T): T {
     const slot = obtainSlot(cons.prototype)

src/deco3/utils.ts

@@ -1,3 +1,4 @@
+import { VueCons } from '../class'
 import { obtainSlot } from '../utils'
 export const Compatible: {
     fakePrototype?: any,
@@ -6,37 +7,38 @@ export const Compatible: {
 
 }
 export function compatibleClassDecorator(deco: Function) {
-    return function (arg: any, ctx?: DecoratorContext) {
-
-        if (ctx) {//stage 3
-
+    return function (cons: VueCons, ctx?: ClassDecoratorContext) {
+        if (ctx) {//stage 3 arg is constructor, ctx is ClassDecoratorContext
             if (ctx.kind !== 'class') {
                 throw 'deco stage 3 class'
             }
             const proto = Compatible.fakePrototype ??= {}
             const slot = obtainSlot(proto)
             delete Compatible.fakePrototype
 
-            obtainSlot(arg.prototype, slot)
-            const ret = deco(arg)
+            obtainSlot(cons.prototype, slot)
+            const ret = deco(cons)
 
             return ret
         }
-        else {
-
-            return deco(arg)
+        else {//stage 2 arg is constructor
+            return deco(cons)
         }
     }
 }
 
 export function compatibleMemberDecorator(deco: Function) {
-    return function (arg: any, ctx: DecoratorContext | string) {
-        if (typeof ctx === 'object') {//stage 3
+    return function (protoOrValue: any, nameOrCtx: ClassMemberDecoratorContext | string) {
+        if (typeof nameOrCtx === 'object') {//stage 3 arg is value, ctx is ClassMemberDecoratorContext
+            const ctx = nameOrCtx
+            const value = protoOrValue
             const proto = Compatible.fakePrototype ??= {};
-            proto[ctx.name!] = arg
+            proto[ctx.name!] = value
             return deco(proto, ctx.name)
-        } else {
-            return deco(arg, ctx)
+        } else { //stage 2 arg is prototype, ctx is name stirng
+            const name = nameOrCtx
+            const proto = protoOrValue
+            return deco(proto, name)
         }
     }
 }

src/utils.ts

@@ -1,5 +1,4 @@
 import { Metadata } from 'facing-metadata'
-import { Base } from './index'
 import type { Identity } from './identity'
 import type { InjectConfig } from "./option/inject";
 import type { EmitConfig } from "./option/emit";
@@ -11,7 +10,9 @@ import type { SetupConfig } from './option/setup'
 import type { Record as CustomDecoratorRecord } from './custom/custom'
 import type { RefConfig } from './option/ref';
 import type { ProvideConfig } from './option/provide';
-import { compatibleMemberDecorator } from './deco3/utils';
+import { compatibleMemberDecorator, compatibleClassDecorator } from './deco3/utils';
+import { type VueCons, Base } from './class';
+
 
 const SlotSymbol = Symbol('vue-facing-decorator-slot')
 
@@ -62,7 +63,7 @@ export function makeSlot(obj: any, defaultSlot?: Slot): Slot {
         defaultSlot.master = obj
     }
     const slot = defaultSlot ?? new Slot(obj)
-    metadata.create(obj,slot)
+    metadata.create(obj, slot)
     return slot
 }
 
@@ -152,25 +153,50 @@ export function getValidNames(obj: any, filter: (des: PropertyDescriptor, name:
 }
 
 export function optionNullableMemberDecorator<T>(handler: { (proto: any, name: string, option?: T): any }) {
-    function decorator(option?: T): any
-    function decorator(proto: Identity, name: any): any
+    function decorator(): any
+    function decorator(option: T): any//option
+    function decorator(proto: Identity, name: any): any//deco stage 2
     function decorator(value: any, ctx: ClassMemberDecoratorContext): any //deco stage 3
-    function decorator(optionOrProto?: T | Identity | any, name?: string | ClassMemberDecoratorContext): any {
-        if (name) {
+    function decorator(optionOrProtoOrValue?: T | Identity | any, nameOrCtx?: string | ClassMemberDecoratorContext): any {
+        if (nameOrCtx) {//no option
+            const protoOrValue = optionOrProtoOrValue as Identity | any
             compatibleMemberDecorator(function (proto: any, name: any) {
                 handler(proto, name)
-            })(optionOrProto, name)
+            })(protoOrValue, nameOrCtx)
         }
-        else {
+        else {//with option
+            const option = optionOrProtoOrValue as T
             return compatibleMemberDecorator(function (proto: any, name: any) {
-                handler(proto, name, optionOrProto as T | undefined)
+                handler(proto, name, option as T | undefined)
             })
         }
     }
 
     return decorator
 }
 
+export function optionNullableClassDecorator<T>(handler: { (cons: VueCons, option?: T): any }) {
+    function decorator(): any
+    function decorator(option: T): any//option
+    function decorator(cons: VueCons): any//deco stage 2
+    function decorator(cons: VueCons, ctx: ClassDecoratorContext): any//deco stage 3
+    function decorator(optionOrCons?: T | VueCons, ctx?: ClassDecoratorContext) {
+        if (typeof optionOrCons === 'function') {
+            const cons = optionOrCons as VueCons
+            compatibleClassDecorator(function (cons: VueCons) {
+                handler(cons)
+            })(cons, ctx)
+
+        } else {
+            const option = optionOrCons as T
+            return compatibleClassDecorator(function (cons: VueCons) {
+                handler(cons, option)
+            })
+        }
+    }
+    return decorator
+}
+
 export function getProviderFunction(provide: any): () => {} {
     if (typeof provide === 'function') return provide
     return function () { return provide || {} }