@neeloong/form 0.2.0 → 0.4.0

package/README.md

@@ -34,12 +34,12 @@ const template = `
 
 /** @type {Layout.Options} */
 const layoutOptions = {
-	creteCalc: value => {
+	createCalc: value => {
 		const fn = new Function('globalThis', `with(globalThis) { return ${value} }`);
 		fn.toString = () => value;
 		return /** @type {*} */(fn);
 	},
-	creteEvent: value => {
+	createEvent: value => {
 		const fn = new Function('$event', 'globalThis', `with(globalThis) { ${value} }`);
 		fn.toString = () => value;
 		return /** @type {*} */(fn);
@@ -160,12 +160,13 @@ render(store, layouts, app);
 
 优先级从高到低:
 
-1. 片段标志: `!fragment` 
+1. 模板定义: `!template`
 1. 条件: `!if` `!else`
 1. 子属性: `!value`
 1. 枚举: `!enum`
 1. 别名与计算名: `*别名` `*计算名`
 1. 显式变量: `+变量`
+1. 片段与模板调用: `!fragment` 
 1. 属性与事件: `:绑定属性` `@事件` `普通属性` `!bind`
 1. 子内容: `!text` `!html`
 1. 注释: `!comment`
@@ -175,13 +176,14 @@ render(store, layouts, app);
 1. 字段扩展隐式属性
    - `$value` 
    - `$state` 
+   - `$store` 只读属性
+   - `$schema` 只读属性
    - `$null` 只读属性
    - `$index` 只读属性
    - `$no` 只读属性
    - `$length` 只读属性
    - `$creatable` 只读属性
    - `$immutable` 只读属性
-   - `$schema` 只读属性
    - `$new` 只读属性
    - `$readonly` 只读属性
    - `$hidden` 只读属性
@@ -208,9 +210,13 @@ render(store, layouts, app);
    - `$remove()`
    - `$upMove()`
    - `$downMove()`
+1. 上下文隐式变量
+   - '$store' 只读属性
+   - '$root' 只读属性
 1. 当前范围及组件范围的所有字段（数组字段的成员除外，因为数组字段成员索引为数字，不符合标识符命名规则）都存在 `field$value` 及 `field$$value` 形式的变量
 1. 如果别名为字段的别名，则也存在 `alias$value` 形式的变量
 1. 当存在同名变量时，则会按照变量来源类型决定优先级，从高到低依次为：
+   1. 上下文隐式变量
    1. 显式声明（如别名、计算名、显式变量），如果别名是字段的别名，则也包括 `alias$value` 形式的变量
    1. 全局变量，此部分由 `render` 的参数传入
    1. 字段声明，包括 `field$value` 及 `field$$value` 形式的变量

package/index.d.mts

@@ -1,11 +1,82 @@
 /*!
-* @neeloong/form v0.2.0
+* @neeloong/form v0.4.0
 * (c) 2024-2025 Fierflame
 * @license Apache-2.0
 */
 
 export { Signal } from 'signal-polyfill';
 
+/**
+ *
+ * @param {string} source
+ * @param {Layout.Options} [options]
+ * @returns {(Layout.Node | string)[]}
+ */
+declare function parse(source: string, { createCalc, createEvent, simpleTag, }?: Options): (Node | string)[];
+
+/**
+ *
+ * @param {Layout.Node | (Layout.Node |string)[]} value
+ * @param {boolean} [formable]
+ * @returns {string}
+ */
+declare function toString(value: Node | (Node | string)[], formable?: boolean): string;
+
+type Directives = {
+    template?: string | undefined;
+    fragment?: string | boolean | undefined;
+    if?: string | Calc | undefined;
+    else?: boolean | undefined;
+    /**
+     * 值关联（关联为列表）
+     */
+    value?: string | undefined;
+    /**
+     * 列表属性枚举
+     */
+    enum?: string | boolean | Calc | undefined;
+    bind?: string | boolean | undefined;
+    text?: string | Calc | undefined;
+    html?: string | Calc | undefined;
+    /**
+     * 注释
+     */
+    comment?: string | undefined;
+};
+type Options = {
+    createCalc?: ((t: string) => Calc) | undefined;
+    createEvent?: ((t: string) => EventListener) | undefined;
+    simpleTag?: Set<string> | undefined;
+};
+type Node = {
+    name: string;
+    is?: string | null | undefined;
+    id?: string | undefined;
+    attrs: Record<string, string | {
+        name: string;
+    } | Calc>;
+    params: Record<string, string | Calc>;
+    classes: Record<string, string | boolean | Calc>;
+    styles: Record<string, string | Calc>;
+    events: Record<string, string | EventListener>;
+    vars: Record<string, string | Calc>;
+    aliases: Record<string, string | Calc>;
+    directives: Directives;
+    children: (Node | string)[];
+};
+type Calc = (env: Record<string, any>) => any;
+type EventListener = ($event: any, env: Record<string, any>) => void;
+
+type index_d_Calc = Calc;
+type index_d_Directives = Directives;
+type index_d_EventListener = EventListener;
+type index_d_Node = Node;
+type index_d_Options = Options;
+declare const index_d_parse: typeof parse;
+declare namespace index_d {
+  export { type index_d_Calc as Calc, type index_d_Directives as Directives, type index_d_EventListener as EventListener, type index_d_Node as Node, type index_d_Options as Options, index_d_parse as parse, toString as stringify };
+}
+
 type VerifyError = any;
 type Component = {
     tag: string | ((ctx: any) => Element);
@@ -20,13 +91,13 @@ declare namespace Component {
          * // TODO: 可否计算，可否关联
          */
         isProp?: boolean | undefined;
-        bind?: [event: string, set: ($event: any, global: any) => any, (boolean | undefined)?] | "hidden" | "clearable" | "readonly" | "disabled" | "required" | undefined;
+        bind?: [event: string, set: EventListener, (boolean | undefined)?] | "hidden" | "clearable" | "readonly" | "disabled" | "required" | undefined;
         default?: any;
         immutable?: boolean | undefined;
     };
     type Handler = {
         set: (name: string, value: any) => void;
-        addEvent: (event: string, listener: ($event: any, global: any) => any) => void;
+        addEvent: (event: string, listener: EventListener) => void;
         destroy: () => void;
         tag: any;
         init: () => void;
@@ -52,8 +123,11 @@ declare namespace Component {
         /**
          * 过滤器
          */
-        filters: Record<string, (($event: any, param: string[], env: any) => boolean | null | void) | string>;
+        filters: Record<string, Component.Event.Filter | string>;
     };
+    namespace Event {
+        type Filter = ($event: any, param: string[], env: any) => boolean | null | void;
+    }
 }
 type ComponentGetter = (path: string[], next?: ((path: string[]) => Component | null) | undefined) => Component | null;
 type Schema = Record<string, Schema.Field>;
@@ -308,71 +382,6 @@ declare class ObjectStore extends Store<any> {
     #private;
 }
 
-/**
- *
- * @param {string} source
- * @param {Layout.Options} [options]
- * @returns {(Layout.Node | string)[]}
- */
-declare function parse(source: string, { creteCalc, creteEvent, simpleTag, }?: Options): (Node | string)[];
-
-/**
- *
- * @param {Layout.Node | (Layout.Node |string)[]} value
- * @param {boolean} [formable]
- * @returns {string}
- */
-declare function toString(value: Node | (Node | string)[], formable?: boolean): string;
-
-type Directives = {
-    fragment?: boolean | undefined;
-    if?: string | Function | undefined;
-    else?: boolean | undefined;
-    /**
-     * 值关联（关联为列表）
-     */
-    value?: string | undefined;
-    /**
-     * 列表属性枚举
-     */
-    enum?: string | boolean | Function | undefined;
-    bind?: string | undefined;
-    text?: string | Function | undefined;
-    html?: string | Function | undefined;
-    /**
-     * 注释
-     */
-    comment?: string | Function | undefined;
-};
-type Options = {
-    creteCalc?: ((t: string) => (vars: Record<string, any>) => any) | undefined;
-    creteEvent?: ((t: string) => ($event: any, vars: Record<string, any>) => any) | undefined;
-    simpleTag?: Set<string> | undefined;
-};
-type Node = {
-    name: string;
-    is?: string | null | undefined;
-    id?: string | undefined;
-    attrs: Record<string, string | {
-        name: string;
-    } | ((global: any) => void)>;
-    classes: Record<string, string | boolean | ((global: any) => void)>;
-    styles: Record<string, string | ((global: any) => void)>;
-    events: Record<string, string | (($event: any, global: any) => void)>;
-    vars: Record<string, string | ((global: any) => void)>;
-    aliases: Record<string, string | Function>;
-    directives: Directives;
-    children: (Node | string)[];
-};
-
-type index_d_Directives = Directives;
-type index_d_Node = Node;
-type index_d_Options = Options;
-declare const index_d_parse: typeof parse;
-declare namespace index_d {
-  export { type index_d_Directives as Directives, type index_d_Node as Node, type index_d_Options as Options, index_d_parse as parse, toString as stringify };
-}
-
 /**
  * @overload
  * @param {Store} store