@neeloong/form 0.27.0 → 0.29.0

package/index.full.js

@@ -1,5 +1,5 @@
 /*!
-* @neeloong/form v0.27.0
+* @neeloong/form v0.29.0
 * (c) 2024-2026 Fierflame
 * @license Apache-2.0
 */
@@ -881,6 +881,12 @@
    * @template {Object.<string, Schema.State>} [S=Object.<string, Schema.State>]
    */
   class Store {
+  	/** @type {Store<T, M, S>?} */
+  	#originStore = null;
+
+  	/** @type {Schema.Field<M, S>}  字段的 Schema 定义 */
+  	#schema;
+  	get schema() { return this.#schema; }
   	/** @type {Map<string, Set<(value: any, store: any) => void | boolean | null>>} */
   	#events = new Map();
   	/**
@@ -888,8 +894,11 @@
   	 * @template {keyof Schema.Events} K
   	 * @param {K} event 
   	 * @param  {Schema.Events[K]} value 
+  	 * @returns {boolean}
   	 */
   	emit(event, value) {
+  		const originStore = this.#originStore;
+  		if (originStore) { return originStore.emit(event, value); }
   		const key = typeof event === 'number' ? String(event) : event;
   		const events = this.#events;
   		let canceled = false;
@@ -906,6 +915,8 @@
   	 * @returns {() => void}
   	 */
   	listen(event, listener) {
+  		const originStore = this.#originStore;
+  		if (originStore) { return originStore.listen(event, p => listener.call(this, p, this)); }
   		const fn = listener.bind(this);
   		const events = this.#events;
   		const key = typeof event === 'number' ? String(event) : event;
@@ -946,51 +957,93 @@
   	#ref = null;
   	get ref() { return this.#ref || createRef(this); }
   	/**
-  	 * @param {Schema.Field<M, S>} schema 字段的 Schema 定义
-  	 * @param {object} [options] 可选配置
-  	 * @param {Store?} [options.parent] 
-  	 * @param {Partial<S>?} [options.states] 
-  	 * @param {((store: Store, value?: any) => any) | object | number | string | boolean | null | undefined} [options.default]
-  	 * @param {number | string | null} [options.index] 
-  	 * @param {number | Signal.State<number> | Signal.Computed<number>} [options.size] 
-  	 * @param {boolean} [options.null] 
-  	 * @param {boolean} [options.new] 
-  	 * @param {boolean} [options.hidden] 
-  	 * @param {boolean} [options.clearable] 
-  	 * @param {boolean} [options.required] 
-  	 * @param {boolean} [options.disabled] 
-  	 * @param {boolean} [options.readonly] 
-  	 * @param {boolean} [options.removable] 
-  	 * 
-  	 * @param {string} [options.label] 字段标签
-  	 * @param {string} [options.description] 字段描述
-  	 * @param {string} [options.placeholder] 占位符
-  	 * @param {number} [options.min] 日期、时间、数字的最小值
-  	 * @param {number} [options.max] 日期、时间、数字的最大值
-  	 * @param {number} [options.step] 日期、时间、数字的步长
-  	 * @param {number} [options.minLength] 
-  	 * @param {number} [options.maxLength] 
-  	 * @param {RegExp} [options.pattern] 
-  	 * @param {(Schema.Value.Group | Schema.Value | string | number)[]} [options.values] 可选值
-  	 * @param {Schema.Validator | Schema.Validator[] | null} [options.validator]
-  	 * @param {{[k in keyof Schema.Events]?: Schema.AsyncValidator | Schema.AsyncValidator[] | null}} [options.validators]
-  	 * 
-  	 * @param {Ref?} [options.ref]
-  	 * 
-  	 * @param {((value: any) => any)?} [options.setValue] 
-  	 * @param {((value: any) => any)?} [options.convert] 
-  	 * 
-  	 * @param {((value: T?, index: any, store: Store) => void)?} [options.onUpdate] 
+  	 * @param {Schema.Field<M, S> | Store<T,M,S>} schema 字段的 Schema 定义
+  	 * @param {StoreOptions | AbortSignal | null} [options] 可选配置
   	 */
-  	constructor(schema, {
-  		null: isNull, ref, default: defaultValue,
-  		setValue, convert, onUpdate, states,
-  		validator, validators,
-  		index, size, new: isNew, parent: parentNode,
-  		hidden, clearable, required, disabled, readonly, removable,
-  		label, description, placeholder, min, max, step, minLength, maxLength, pattern, values: values$1
-  	} = {}) {
-  		this.schema = schema;
+  	constructor(schema, options) {
+  		if (schema instanceof Store) {
+  			const store = schema.#originStore || schema;
+  			this.#originStore= store;
+  			this.#schema= store.#schema;
+  			this.#null= store.#null;
+  			this.#ref= store.#ref;
+  			this.#states= store.#states;
+  			this.#layout= store.#layout;
+  			this.#createDefault= store.#createDefault;
+  			this.#setValue= store.#setValue;
+  			this.#convert= store.#convert;
+  			this.#onUpdate= store.#onUpdate;
+  			this.#parent= store.#parent;
+  			this.#root= store.#root;
+  			this.#type= store.#type;
+  			this.#meta= store.#meta;
+  			this.#component= store.#component;
+  			this.#selfLoading= store.#selfLoading;
+  			this.#loading= store.#loading;
+  			this.#size= store.#size;
+  			this.#index= store.#index;
+  			this.#creatable= store.#creatable;
+  			this.#immutable= store.#immutable;
+  			this.#new= store.#new;
+  			this.#selfNew= store.#selfNew;
+  			this.#selfHidden= store.#selfHidden;
+  			this.#hidden= store.#hidden;
+  			this.#selfClearable= store.#selfClearable;
+  			this.#clearable= store.#clearable;
+  			this.#selfRequired= store.#selfRequired;
+  			this.#required= store.#required;
+  			this.#selfDisabled= store.#selfDisabled;
+  			this.#disabled= store.#disabled;
+  			this.#selfReadonly= store.#selfReadonly;
+  			this.#readonly= store.#readonly;
+  			this.#selfRemovable= store.#selfRemovable;
+  			this.#removable= store.#removable;
+  			this.#selfLabel= store.#selfLabel;
+  			this.#label= store.#label;
+  			this.#selfDescription= store.#selfDescription;
+  			this.#description= store.#description;
+  			this.#selfPlaceholder= store.#selfPlaceholder;
+  			this.#placeholder= store.#placeholder;
+  			this.#selfMin= store.#selfMin;
+  			this.#min= store.#min;
+  			this.#selfMax= store.#selfMax;
+  			this.#max= store.#max;
+  			this.#selfStep= store.#selfStep;
+  			this.#step= store.#step;
+  			this.#selfMinLength= store.#selfMinLength;
+  			this.#minLength= store.#minLength;
+  			this.#selfMaxLength= store.#selfMaxLength;
+  			this.#maxLength= store.#maxLength;
+  			this.#selfPattern= store.#selfPattern;
+  			this.#pattern= store.#pattern;
+  			this.#selfValues= store.#selfValues;
+  			this.#values= store.#values;
+  			this.#errors= store.#errors;
+  			this.#validatorResult= store.#validatorResult;
+  			this.#changed= store.#changed;
+  			this.#blurred= store.#blurred;
+  			this.#cancelChange= store.#cancelChange;
+  			this.#cancelBlur= store.#cancelBlur;
+  			this.#set= store.#set;
+  			this.#initValue= store.#initValue;
+  			this.#value= store.#value;
+  			const signal = options instanceof AbortSignal ? options : null;
+  			if (signal?.aborted) { return; }
+  			const subBindStores= store.#subBindStores;
+  			subBindStores.add(this);
+  			signal?.addEventListener('abort', () => subBindStores.delete(this));
+  			store.#requestUpdate();
+  			return;
+  		}
+  		const {
+  			null: isNull, ref, default: defaultValue,
+  			setValue, convert, onUpdate, states,
+  			validator, validators,
+  			index, size, new: isNew, parent: parentNode,
+  			hidden, clearable, required, disabled, readonly, removable,
+  			label, description, placeholder, min, max, step, minLength, maxLength, pattern, values: values$1
+  		} = !(options instanceof AbortSignal) && options || {};
+  		this.#schema = schema;
   		const parent = parentNode instanceof Store ? parentNode : null;
   		if (parent) {
   			this.#parent = parent;
@@ -1118,6 +1171,7 @@
   	/** @type {StoreLayout.Field<any>} */
   	#layout;
   	get layout() { return this.#layout; }
+  	/** @type {(value?: any) => unknown} */
   	#createDefault;
   	/** @param {any} [value] @returns {any} */
   	createDefault(value) { return this.#createDefault(value); }
@@ -1399,40 +1453,8 @@
   	#initValue = new exports.Signal.State(/** @type {T?} */(null));
   	#value = new exports.Signal.State(this.#initValue.get());
 
-  	/**
-  	 * @template [M=any]
-  	 * @template {Object.<string, Schema.State>} [S=Object.<string, Schema.State>]
-  	 * @param {Schema<M, S>} schema 数据结构模式
-  	 */
-  	bindObject(schema) {
-  		const bindStores = this.#bindStores;
-  		/** @type {Store[]} */
-  		const list = [];
-  		for (const [index, field] of Object.entries(schema)) {
-  			const bindStore = create(field, {
-  				index, parent: this,
-  				/** @param {*} value @param {*} currentIndex @param {Store} store */
-  				onUpdate: (value, currentIndex, store) => {
-  					if (index !== currentIndex) { return; }
-  					if (bindStores.has(store)) { return; }
-  					const val = this.#value ?? null;
-  					if (typeof val !== 'object' || Array.isArray(val)) { return }
-  					// @ts-ignore
-  					this.value = { ...val, [currentIndex]: value };
-  				},
-  			});
-  			list.push(bindStore);
-  			bindStores.set(bindStore, index);
-  		}
-  		this.#requestUpdate();
-  		return () => {
-  			for (const bindStore of list) {
-  				bindStores.delete(bindStore);
-  			}
-  		};
-  	}
-  	/** @type {Map<Store, string>} */
-  	#bindStores = new Map();
+  	/** @type {Set<Store>} */
+  	#subBindStores = new Set();
 
   	/** 内容是否已改变 */
   	get changed() { return !Object.is(this.#value.get(), this.#initValue.get()); }
@@ -1440,6 +1462,8 @@
   	/** 字段当前值 */
   	get value() { return this.#value.get(); }
   	set value(v) {
+  		const originStore = this.#originStore;
+  		if (originStore) { originStore.value = v; return; }
   		const newValue = this.#setValue?.(v);
   		const val = newValue === undefined ? v : newValue;
   		this.#value.set(val);
@@ -1460,6 +1484,8 @@
   	}
   	/** 重置数据 */
   	reset(value = this.#set ? this.#initValue.get() : this.#createDefault(), isNew = this.#selfNew.get()) {
+  		const originStore = this.#originStore;
+  		if (originStore) { originStore.reset(value, isNew); return; }
   		this.#reset(value, Boolean(isNew));
   	}
   	/**
@@ -1476,11 +1502,10 @@
   		this.#cancelBlur();
   		this.#set = true;
   		if (!value || typeof value !== 'object') {
-  			for (const [, field] of this) {
-  				field.#reset(null, false);
-  			}
-  			for (const [field] of this.#bindStores) {
-  				field.#reset(null, false);
+  			for (const bind of [this, ...this.#subBindStores]) {
+  				for (const [, field] of bind) {
+  					field.#reset(null, false);
+  				}
   			}
   			this.#value.set(value);
   			this.#initValue.set(value);
@@ -1489,11 +1514,10 @@
   		}
   		/** @type {*} */
   		const newValues = Array.isArray(value) ? [...value] : { ...value };
-  		for (const [key, field] of this) {
-  			newValues[key] = field.#reset(Object.hasOwn(newValues, key) ? newValues[key] : undefined, false);
-  		}
-  		for (const [field, key] of this.#bindStores) {
-  			newValues[key] = field.#reset(Object.hasOwn(newValues, key) ? newValues[key] : undefined, false);
+  		for (const bind of [this, ...this.#subBindStores]) {
+  			for (const [key, field] of bind) {
+  				newValues[key] = field.#reset(Object.hasOwn(newValues, key) ? newValues[key] : undefined, false);
+  			}
   		}
   		this.#value.set(newValues);
   		this.#initValue.set(newValues);
@@ -1527,23 +1551,16 @@
   			// @ts-ignore
   			let newValues = Array.isArray(val) ? [...val] : { ...val };
   			let updated = false;
-  			for (const [key, field] of this) {
-  				// @ts-ignore
-  				const data = Object.hasOwn(val, key) ? val[key] : undefined;
-  				const newData = field.#toUpdate(data);
-  				if (Object.is(data, newData)) { continue; }
-  				// @ts-ignore
-  				newValues[key] = newData;
-  				updated = true;
-  			}
-  			for (const [field, key] of this.#bindStores) {
-  				// @ts-ignore
-  				const data = Object.hasOwn(val, key) ? val[key] : undefined;
-  				const newData = field.#toUpdate(data);
-  				if (Object.is(data, newData)) { continue; }
-  				// @ts-ignore
-  				newValues[key] = newData;
-  				updated = true;
+  			for (const bind of [this, ...this.#subBindStores]) {
+  				for (const [key, field] of bind) {
+  					// @ts-ignore
+  					const data = Object.hasOwn(val, key) ? val[key] : undefined;
+  					const newData = field.#toUpdate(data);
+  					if (Object.is(data, newData)) { continue; }
+  					// @ts-ignore
+  					newValues[key] = newData;
+  					updated = true;
+  				}
   			}
   			if (updated) {
   				val = newValues;
@@ -1577,6 +1594,7 @@
   	 */
   	validate(path) {
   		if (path === true) {
+  			if (this.#originStore) { return Promise.resolve(null); }
   			return Promise.all([this.#validatorResult.get(), this.#changed(), this.#blurred()])
   				.then(v => {
   					const errors = v.flat();
@@ -1584,7 +1602,7 @@
   				});
   		}
   		const selfPath = Array.isArray(path) ? path : [];
-  		if (this.#hidden.get()) { return Promise.resolve([]); }
+  		if (!this.#originStore && this.#hidden.get()) { return Promise.resolve([]); }
   		const list = [this.validate(true).then(errors => {
   			if (!errors?.length) { return []; }
   			return [{ path: [...selfPath], store: /** @type {Store} */(this), errors }];
@@ -1592,13 +1610,53 @@
   		for (const [key, field] of this) {
   			list.push(field.validate([...selfPath, key]));
   		}
-  		for (const [field, key] of this.#bindStores) {
-  			list.push(field.validate([...selfPath, key]));
+  		for (const sub of this.#subBindStores) {
+  			list.push(sub.validate(selfPath));
   		}
   		return Promise.all(list).then(v => v.flat());
   	}
   }
 
+  /**
+   * @template [T=any]
+   * @template [M=any]
+   * @template {Object.<string, Schema.State>} [S=Object.<string, Schema.State>]
+   * @typedef {object} StoreOptions
+   * @property {Store?} [parent] 
+   * @property {Partial<S>?} [states] 
+   * @property {((store: Store, value?: any) => any) | object | number | string | boolean | null | undefined} [default]
+   * @property {number | string | null} [index] 
+   * @property {number | Signal.State<number> | Signal.Computed<number>} [size] 
+   * @property {boolean} [null] 
+   * @property {boolean} [new] 
+   * @property {boolean} [hidden] 
+   * @property {boolean} [clearable] 
+   * @property {boolean} [required] 
+   * @property {boolean} [disabled] 
+   * @property {boolean} [readonly] 
+   * @property {boolean} [removable] 
+   * 
+   * @property {string} [label] 字段标签
+   * @property {string} [description] 字段描述
+   * @property {string} [placeholder] 占位符
+   * @property {number} [min] 日期、时间、数字的最小值
+   * @property {number} [max] 日期、时间、数字的最大值
+   * @property {number} [step] 日期、时间、数字的步长
+   * @property {number} [minLength] 
+   * @property {number} [maxLength] 
+   * @property {RegExp} [pattern] 
+   * @property {(Schema.Value.Group | Schema.Value | string | number)[]} [values] 可选值
+   * @property {Schema.Validator | Schema.Validator[] | null} [validator]
+   * @property {{[k in keyof Schema.Events]?: Schema.AsyncValidator | Schema.AsyncValidator[] | null}} [validators]
+   * 
+   * @property {Ref?} [ref]
+   * 
+   * @property {((value: any) => any)?} [setValue] 
+   * @property {((value: any) => any)?} [convert] 
+   * 
+   * @property {((value: T?, index: any, store: Store) => void)?} [onUpdate] 
+   */
+
   /** @import { Schema } from '../Schema.types.mjs' */
 
   /**
@@ -1904,6 +1962,51 @@
   // @ts-ignore
   setArrayStore(ArrayStore);
 
+  /** @import { Schema } from '../Schema.types.mjs' */
+
+  /**
+   * @template [T=any]
+   * @template [M=any]
+   * @template {Object.<string, Schema.State>} [S=Object.<string, Schema.State>]
+   * @extends {Store<T, M, S>}
+   */
+  class BindObjectStore extends Store {
+
+  	get kind() { return 'object'; }
+  	/** @type {Record<string, Store>} */
+  	#children = Object.create(null);
+  	*[Symbol.iterator]() { yield* Object.entries(this.#children); }
+  	/**
+  	 * 
+  	 * @param {string | number} key 
+  	 * @returns {Store?}
+  	 */
+  	child(key) { return this.#children[key] || null; }
+  	/**
+  	 * @param {Schema<any, Object.<string, Schema.State>>} schema 数据结构模式
+  	 * @param {Store<T, M, S>} store
+  	 * @param {AbortSignal} [signal]
+  	 */
+  	constructor(schema, store, signal) {
+  		super(store, signal);
+  		const children = this.#children;
+  		for (const [index, field] of Object.entries(schema)) {
+  			const bindStore = create(field, {
+  				index, parent: this,
+  				/** @param {*} value @param {*} index @param {Store} store */
+  				onUpdate: (value, index, store) => {
+  					if (store !== children[index]) { return; }
+  					const val = this.value ?? null;
+  					if (typeof val !== 'object' || Array.isArray(val)) { return; }
+  					// @ts-ignore
+  					this.value = { ...val, [index]: value };
+  				},
+  			});
+  			children[index] = bindStore;
+  		}
+  	}
+  }
+
   /** @import * as Layout from './index.mjs' */
 
   /** @import { OldNode } from './createElement.mjs' */
@@ -7065,6 +7168,7 @@
   }
 
   exports.ArrayStore = ArrayStore;
+  exports.BindObjectStore = BindObjectStore;
   exports.Layout = index;
   exports.ObjectStore = ObjectStore;
   exports.Store = Store;