annil 1.0.0

package/src/api/RootComponent/Events/test/normal.test.ts

@@ -0,0 +1,142 @@
+import { Checking, type Test } from "hry-types";
+import type {
+  CurrentTargetDataset,
+  Dataset,
+  Detail,
+  Mark,
+  TargetDataset,
+  WMBaseEvent,
+  WMCustomEvent,
+} from "../../../../types/OfficialTypeAlias";
+import type { ComponentDoc } from "../../../DefineComponent/ReturnType/ComponentDoc";
+import { RootComponent } from "../..";
+import type { Bubbles, Capture } from "../../CustomEvents/CustomEventsTag";
+
+/**
+ * 1. 事件参数e的类型默认为官方基础类型
+ */
+RootComponent()({
+  events: {
+    aaa(e) {
+      Checking<typeof e, WMBaseEvent, Test.Pass>;
+    },
+  },
+});
+
+/**
+ * 2. 事件参数e可通过WMBaseEvent和WMCustomEvent(多一个detail类型)定义内部类型。
+ */
+RootComponent()({
+  events: {
+    // 通过WMCustomEvent定义detai,mark,CurrentTargetDataset,targetDataset数据类型
+    customA(
+      e: WMCustomEvent<
+        { detailData: string },
+        { markData: { id: string } },
+        { currentTargetDatasetData: string },
+        { targetDatasetData: number }
+      >,
+    ) {
+      Checking<typeof e.detail.detailData, string, Test.Pass>;
+
+      const markData = e.mark!.markData;
+
+      Checking<typeof markData, { id: string }, Test.Pass>;
+
+      Checking<typeof e.currentTarget.dataset.currentTargetDatasetData, string, Test.Pass>;
+
+      Checking<typeof e.target.dataset.targetDatasetData, number, Test.Pass>;
+    },
+    // 通过Detail定义detai类型
+    bbb(e: Detail<{ str: string }>) {
+      Checking<typeof e.detail.str, string, Test.Pass>;
+    },
+    // 通过Mark定义mark类型
+    ccc(e: Mark<{ id: string }>) {
+      const markId = e.mark!.id;
+
+      Checking<typeof markId, string, Test.Pass>;
+    },
+    // 通过CurrentTargetDataset定义currentTarget.dataset类型
+    ddd(e: CurrentTargetDataset<{ str: string }>) {
+      Checking<typeof e.currentTarget.dataset.str, string, Test.Pass>;
+    },
+    // 通过TargetDataset定义target.dateset类型
+    eee(e: TargetDataset<{ str: string }>) {
+      Checking<typeof e.target.dataset.str, string, Test.Pass>;
+    },
+  },
+});
+
+type ComponentDocA = ComponentDoc<{
+  properties: {
+    aaa_str: string;
+  };
+  customEvents: {
+    aaa_str: string;
+    aaa_num: number | Bubbles;
+  };
+}>;
+
+type ComponentDocB = ComponentDoc<{
+  customEvents: {
+    bbb_str: string;
+    bbb_num: number | Capture;
+  };
+}>;
+
+/**
+ * 6. 当传入子组件文档列表时,提供子组件的冒泡和捕获事件的字段提示
+ */
+const RootDoc = RootComponent<[ComponentDocA, ComponentDocB]>()({
+  events: {
+    // 后缀bubbles表示为子组件的冒泡事件
+    aaa_num_bubbles(e) {
+      Checking<typeof e.detail, number, Test.Pass>;
+    },
+    // 后缀加catch表示阻止事件传递,当前组件类型将不会向上传递此事件类型。
+    aaa_num_bubbles_catch(e) {
+      Checking<typeof e.detail, number, Test.Pass>;
+    },
+    // 后缀capture表示是捕获事件
+    bbb_num_capture(e: Dataset<{ currentTargetDataset: number }, { targetDataset: string }, number>) {
+      Checking<typeof e.detail, number, Test.Pass>;
+
+      Checking<typeof e.currentTarget.dataset.currentTargetDataset, number, Test.Pass>;
+
+      Checking<typeof e.target.dataset.targetDataset, string, Test.Pass>;
+    },
+    // 后缀加catch表示阻止事件传递,由于捕获事件向下阻止,所以当发现捕获事件不触发时应查看上级组件是否有阻止事件。
+    bbb_num_capture_catch(e) {
+      Checking<typeof e.detail, number, Test.Pass>;
+    },
+  },
+});
+
+type RootDocExpect = {
+  events: {
+    aaa_num_bubbles: (e: Detail<number>) => void;
+    aaa_num_bubbles_catch: (e: Detail<number>) => void;
+    bbb_num_capture: (e: Dataset<{ currentTargetDataset: number }, { targetDataset: string }, number>) => void;
+    bbb_num_capture_catch: (e: Detail<number>) => void;
+  };
+};
+
+// 7 返回EventsDoc正常
+Checking<typeof RootDoc, RootDocExpect, Test.Pass>;
+
+/**
+ * 8 events字段为`{}`时,返回类型中无events字段。
+ */
+const EmptyEventsFields = RootComponent<[ComponentDocA, ComponentDocB]>()({
+  events: {},
+});
+
+Checking<typeof EmptyEventsFields, {}, Test.Pass>;
+
+/**
+ * 9 没有events字段时,返回类型中无events字段。
+ */
+const NoEventsFields = RootComponent<[ComponentDocA, ComponentDocB]>()({});
+
+Checking<typeof NoEventsFields, {}, Test.Pass>;

package/src/api/RootComponent/Instance/CustomEventMethods.ts

@@ -0,0 +1,11 @@
+import type { IfExtends } from "hry-types/src/Any/IfExtends";
+import type { CustomEventsTags } from "../CustomEvents/CustomEventsTag";
+
+export type CustomEventMethods<O extends object> = {
+  [k in keyof O]: IfExtends<
+    Exclude<O[k], CustomEventsTags> & {},
+    never,
+    () => void,
+    (detail: Exclude<O[k], CustomEventsTags>) => void
+  >;
+};

package/src/api/RootComponent/Instance/CustomSetData.ts

@@ -0,0 +1,17 @@
+import type { O } from "hry-types";
+import type { IfExtends } from "hry-types/src/Any/IfExtends";
+import type { EmptyObject } from "hry-types/src/Misc/EmptyObject";
+import type { AddSubObjectKey } from "hry-types/src/Object/AddSubObjectKey";
+
+/**
+ * 重写实例的setData类型
+ */
+export type CustomSetData<TData extends object> = {
+  /**
+   * setData只可以对自身data中非响应式数据字段进行设置
+   */
+  setData(
+    options: IfExtends<{}, TData, EmptyObject, O.ComputeIntersectionDeep<Partial<AddSubObjectKey<TData>>>>,
+    callback?: () => void,
+  ): void;
+};

package/src/api/RootComponent/Instance/RootComponentInstance.ts

@@ -0,0 +1,34 @@
+import type { ReadonlyDeep } from "hry-types/src/Any/_api";
+import type { IfExtends } from "hry-types/src/Any/IfExtends";
+import type { Func } from "hry-types/src/Misc/Func";
+import type { ComputeIntersection } from "hry-types/src/Object/ComputeIntersection";
+import type { IReactionDisposer } from "mobx";
+
+import type { WMComponentInstance, WMInstanceMethods, WMPageInstance } from "../../../types/OfficialTypeAlias";
+import type { CustomEventMethods } from "./CustomEventMethods";
+import type { CustomSetData } from "./CustomSetData";
+export type RootComponentInstance<
+  TIsPage extends boolean,
+  TMethods extends object,
+  TData extends object,
+  AllData extends object,
+  CustomEventsDoc extends object,
+  StoreDoc extends object,
+> =
+  // 官方实例属性is  options  dataset等
+  & IfExtends<false, TIsPage, WMComponentInstance, WMPageInstance>
+  // 官方实例方法去除setData,因其类型宽泛
+  & Omit<WMInstanceMethods<{}>, "setData">
+  // 加入自定义setData方法
+  & CustomSetData<TData>
+  & IfExtends<{}, StoreDoc, unknown, {
+    disposer?: { [k in keyof StoreDoc]: IReactionDisposer };
+    applySetData: Func;
+  }>
+  & TMethods
+  & CustomEventMethods<CustomEventsDoc>
+  & { data: ReadonlyDeep<ComputeIntersection<AllData>> };
+
+export type ComponentInstance = RootComponentInstance<false, {}, {}, {}, {}, {}>;
+
+export type PageInstance = RootComponentInstance<true, {}, {}, {}, {}, {}>;

package/src/api/RootComponent/Instance/test/CustomEventsDoc.test.ts

@@ -0,0 +1,66 @@
+import { Checking, type Test } from "hry-types";
+import type { SpecificType } from "../../../..";
+import { RootComponent } from "../..";
+RootComponent()({
+  customEvents: {
+    str: String,
+    num: Number as SpecificType<1 | 2>,
+    union: [String as SpecificType<"male" | "femal">, Number],
+    null: null,
+    bubbles: {
+      detailType: String,
+      options: {
+        bubbles: true,
+      },
+    },
+    capturePhase: {
+      detailType: Number,
+      options: {
+        capturePhase: true,
+      },
+    },
+    bubblesComposed: {
+      detailType: Number,
+      options: {
+        bubbles: true,
+        composed: true,
+      },
+    },
+    capturePhaseComposed: {
+      detailType: Number,
+      options: {
+        capturePhase: true,
+        composed: true,
+      },
+    },
+    bubblesCapturePhaseComposed: {
+      detailType: null,
+      options: {
+        bubbles: true,
+        capturePhase: true,
+        composed: true,
+      },
+    },
+  },
+  methods: {
+    M1() {
+      Checking<(detail: string) => void, typeof this.str, Test.Pass>;
+
+      Checking<(detail: 1 | 2) => void, typeof this.num, Test.Pass>;
+
+      Checking<(detail: "male" | "femal" | number) => void, typeof this.union, Test.Pass>;
+
+      Checking<() => void, typeof this.null, Test.Pass>;
+
+      Checking<(detail: string) => void, typeof this.str, Test.Pass>;
+
+      Checking<(detail: number) => void, typeof this.capturePhase, Test.Pass>;
+
+      Checking<(detail: number) => void, typeof this.bubblesComposed, Test.Pass>;
+
+      Checking<(detail: number) => void, typeof this.capturePhaseComposed, Test.Pass>;
+
+      Checking<() => void, typeof this.bubblesCapturePhaseComposed, Test.Pass>;
+    },
+  },
+});

package/src/api/RootComponent/Instance/test/CustomSetData.test.ts

@@ -0,0 +1,44 @@
+import { RootComponent } from "../..";
+
+RootComponent()({
+  properties: {
+    a: String,
+  },
+  data: {
+    str: "str",
+    num: 123,
+    bool: true,
+    arr: [1, 2, 3],
+    obj: { a: 1, b: "str" },
+    reactiveData: () => 123,
+  },
+  computed: {
+    Cstr() {
+      return this.data.str;
+    },
+  },
+  methods: {
+    M1() {
+      this.setData({
+        str: "string",
+        num: 456,
+        bool: false,
+        arr: [1, 2, 3],
+        obj: {
+          a: 456,
+          b: "str",
+        },
+        "obj.a": 456,
+        "obj.b": "str",
+        // @ts-expect-error 不可设置data中响应式数据
+        reactiveData: 456,
+      });
+    },
+    errField() {
+      this.setData({
+        // @ts-expect-error 不能设置不存在的字段
+        "nonexistent": {},
+      });
+    },
+  },
+});

package/src/api/RootComponent/Instance/test/customEvents/error.test.ts

@@ -0,0 +1,13 @@
+import { RootComponent } from "../../../../..";
+
+RootComponent()({
+  customEvents: {
+    eventA: String,
+  },
+  methods: {
+    test() {
+      // @ts-expect-error 不可调用不存在的自定义事件
+      this.eventB();
+    },
+  },
+});

package/src/api/RootComponent/Instance/test/customEvents/normal.test.ts

@@ -0,0 +1,67 @@
+import { Checking, type Test } from "hry-types";
+import type { SpecificType } from "../../../../..";
+import { RootComponent } from "../../..";
+
+RootComponent()({
+  customEvents: {
+    str: String,
+    num: Number as SpecificType<1 | 2>,
+    union: [String as SpecificType<"male" | "femal">, Number],
+    null: null,
+    bubbles: {
+      detailType: String,
+      options: {
+        bubbles: true,
+      },
+    },
+    capturePhase: {
+      detailType: Number,
+      options: {
+        capturePhase: true,
+      },
+    },
+    bubblesComposed: {
+      detailType: Number,
+      options: {
+        bubbles: true,
+        composed: true,
+      },
+    },
+    capturePhaseComposed: {
+      detailType: Number,
+      options: {
+        capturePhase: true,
+        composed: true,
+      },
+    },
+    bubblesCapturePhaseComposed: {
+      detailType: null,
+      options: {
+        bubbles: true,
+        capturePhase: true,
+        composed: true,
+      },
+    },
+  },
+  methods: {
+    M1() {
+      Checking<(detail: string) => void, typeof this.str, Test.Pass>;
+
+      Checking<(detail: 1 | 2) => void, typeof this.num, Test.Pass>;
+
+      Checking<(detail: "male" | "femal" | number) => void, typeof this.union, Test.Pass>;
+
+      Checking<() => void, typeof this.null, Test.Pass>;
+
+      Checking<(detail: string) => void, typeof this.str, Test.Pass>;
+
+      Checking<(detail: number) => void, typeof this.capturePhase, Test.Pass>;
+
+      Checking<(detail: number) => void, typeof this.bubblesComposed, Test.Pass>;
+
+      Checking<(detail: number) => void, typeof this.capturePhaseComposed, Test.Pass>;
+
+      Checking<() => void, typeof this.bubblesCapturePhaseComposed, Test.Pass>;
+    },
+  },
+});

package/src/api/RootComponent/Instance/test/methods/error.test.ts

@@ -0,0 +1,14 @@
+import { RootComponent } from "../../../../..";
+
+RootComponent()({
+  methods: {
+    M1() {
+      return 1;
+    },
+
+    M2() {
+      // @ts-expect-error 不可调用不存在的方法
+      this.M3();
+    },
+  },
+});

package/src/api/RootComponent/Instance/test/methods/mormal.test.ts

@@ -0,0 +1,18 @@
+import { Checking, type Test } from "hry-types";
+import { RootComponent } from "../../../../..";
+
+RootComponent()({
+  methods: {
+    M1() {
+      return 1;
+    },
+
+    M2(str: string) {
+      Checking<typeof this.M1, () => 1, Test.Pass>;
+
+      Checking<typeof this.M2, (str: string) => string, Test.Pass>;
+
+      return str;
+    },
+  },
+});

package/src/api/RootComponent/Instance/test/properties/mormal.test.ts

@@ -0,0 +1,48 @@
+import { Checking, type Test } from "hry-types";
+import type { ReadonlyDeep } from "hry-types/src/Any/ReadonlyDeep";
+import { RootComponent, type SpecificType } from "../../../../..";
+
+// 组件时
+RootComponent()({
+  properties: {
+    obj: Object,
+    optionalObj: {
+      type: Object as SpecificType<{ name: string }>,
+      value: { name: "zhao" },
+    },
+  },
+  lifetimes: {
+    attached() {
+      // 组件实例对象格外添加null类型
+      Checking<typeof this.data, ReadonlyDeep<{ optionalObj: { name: string } | null; obj: object | null }>, Test.Pass>;
+    },
+  },
+});
+
+// 页面时
+RootComponent()({
+  isPage: true,
+  properties: {
+    obj: Object,
+    optionalObj: {
+      type: Object as SpecificType<{ name: string }>,
+      value: { name: "zhao" },
+    },
+  },
+  pageLifetimes: {
+    onLoad(data) {
+      Checking<typeof data, {
+        optionalObj: {
+          name: string;
+        };
+        obj: object;
+      }, Test.Pass>;
+
+      // 页面实例对象不额外添加null
+      Checking<typeof this.data.optionalObj, ReadonlyDeep<{ name: string }>, Test.Pass>;
+
+      // 页面实例对象不额外添加null
+      Checking<typeof this.data.obj, object, Test.Pass>;
+    },
+  },
+});

package/src/api/RootComponent/Instance/test/setData/error.test.ts

@@ -0,0 +1,75 @@
+import { RootComponent } from "../../..";
+
+RootComponent()({
+  properties: {
+    Pobj: Object,
+  },
+  data: {
+    str: "str",
+    num: 123,
+    literal: <456 | 789> 456,
+    bool: true,
+    arr: [1, 2, 3],
+    obj: { num: 1, str: "str" },
+  },
+  store: {
+    Snum: () => 123,
+  },
+  computed: {
+    Cnum() {
+      return this.data.Snum;
+    },
+  },
+  methods: {
+    M1() {
+      this.setData({
+        // @ts-expect-error  不可对properties字段setData
+        Pobj: {},
+      });
+
+      this.setData({
+        // @ts-expect-error  不可对Store字段setData
+        Snum: 123,
+      });
+
+      this.setData({
+        // @ts-expect-error  不可对computed字段setData
+        Cnum: 123,
+      });
+
+      // 对data字段set时有类型检查
+      this.setData({
+        // @ts-expect-error 类型错误 string
+        str: 123,
+        // @ts-expect-error 类型错误 number
+        num: "str",
+        // @ts-expect-error 类型错误  456 | 789
+        literal: 123,
+        // @ts-expect-error 类型错误 boolean
+        bool: 123,
+        // @ts-expect-error 类型错误 number[]
+        arr: [1, 2, 3, "a"],
+        obj: {
+          // @ts-expect-error 类型错误 number
+          num: "str",
+          // @ts-expect-error 类型错误 number
+          str: 123,
+        },
+        // @ts-expect-error 类型错误 number
+        "obj.num": "str",
+        // @ts-expect-error 类型错误 string
+        "obj.str": 123,
+      });
+    },
+  },
+});
+
+RootComponent()({
+  store: {},
+  lifetimes: {
+    attached() {
+      // @ts-expect-error 没有store字段时不可以调用applySetData
+      this.applySetData();
+    },
+  },
+});

package/src/api/RootComponent/Instance/test/setData/normal.test.ts

@@ -0,0 +1,54 @@
+import { observable, runInAction } from "mobx";
+import { RootComponent } from "../../..";
+
+// 可以对data数据进行setData
+RootComponent()({
+  data: {
+    str: "str",
+    num: 123,
+    literal: <456 | 789> 456,
+    bool: true,
+    arr: [1, 2, 3],
+    obj: { a: 1, b: "str" },
+  },
+
+  methods: {
+    M1() {
+      // 可以对data数据进行setData
+      this.setData({
+        str: "string",
+        num: 456,
+        bool: false,
+        literal: 456,
+        arr: [1, 2, 3],
+        obj: {
+          a: 456,
+          b: "str",
+        },
+        "obj.a": 456,
+        "obj.b": "str",
+      });
+    },
+  },
+});
+
+const store = observable({
+  name: "zhao",
+  age: 20,
+});
+
+RootComponent()({
+  store: {
+    name: () => store.name,
+  },
+  lifetimes: {
+    attached() {
+      runInAction(() => {
+        store.name = "liil";
+      });
+
+      // 有store字段时可以调用applySetData
+      this.applySetData();
+    },
+  },
+});

package/src/api/RootComponent/IsPage/IsPageOption.ts

@@ -0,0 +1 @@
+export type IsPageOption<TIsPage extends boolean> = { isPage?: TIsPage };

package/src/api/RootComponent/IsPage/test/normal.test.ts

@@ -0,0 +1,27 @@
+import { Checking, type Test } from "hry-types";
+import { RootComponent } from "../..";
+
+/**
+ * 1. 无isPage字段时,返回Doc中无isPage字段
+ */
+const noIsPage = RootComponent()({});
+
+Checking<typeof noIsPage, {}, Test.Pass>;
+
+/**
+ * 2. isPage字段为false时,返回Doc中无isPage字段
+ */
+const isPageIsfalse = RootComponent()({
+  isPage: false,
+});
+
+Checking<typeof isPageIsfalse, {}, Test.Pass>;
+
+/**
+ * 3. isPage字段为true时,返回Doc中isPage为true
+ */
+const isPageIsTrue = RootComponent()({
+  isPage: true,
+});
+
+Checking<typeof isPageIsTrue, { isPage: true }, Test.Pass>;

package/src/api/RootComponent/Lifetimes/LifetimesConstraint.ts

@@ -0,0 +1,10 @@
+import type { WMCompLifetimes } from "../../../types/OfficialTypeAlias";
+
+export type LifetimesConstraint = // 官方组件生命周期
+  WMCompLifetimes["lifetimes"];
+// & {
+//   /**
+//    * 建立组件时的真正配置对象
+//    */
+//   beforeCreate?: (options: WMTrivialOption<any, any, any, any, false>) => void;
+// };

package/src/api/RootComponent/Lifetimes/LifetimesOption.ts

@@ -0,0 +1,8 @@
+import type { LifetimesConstraint } from "./LifetimesConstraint";
+
+export type LifetimesOption<TIsPage extends boolean> = TIsPage extends false // 组件开通lifetimes字段
+  ? {
+    lifetimes?: LifetimesConstraint;
+  }
+  // 页面关闭lifetimes字段(其实也可以开启)
+  : unknown;