@octanejs/formisch 0.0.1

package/src/methods/swap/swap.ts

@@ -0,0 +1,85 @@
+import {
+	type BaseFormStore,
+	batch,
+	type FormSchema,
+	getFieldStore,
+	INTERNAL,
+	type InternalArrayStore,
+	type RequiredPath,
+	swapItemState,
+	untrack,
+	type ValidArrayPath,
+	validateIfRequired,
+} from '../../core/index.ts';
+import type * as v from 'valibot';
+
+/**
+ * Swap array field config interface.
+ */
+export interface SwapConfig<TSchema extends FormSchema, TFieldArrayPath extends RequiredPath> {
+	/**
+	 * The path to the field array to swap items within.
+	 */
+	readonly path: ValidArrayPath<v.InferInput<TSchema>, TFieldArrayPath>;
+	/**
+	 * The index of the first item to swap.
+	 */
+	readonly at: number;
+	/**
+	 * The index of the second item to swap with the first.
+	 */
+	readonly and: number;
+}
+
+/**
+ * Swaps two items in a field array by exchanging their positions.
+ *
+ * @param form The form store containing the field array.
+ * @param config The swap configuration specifying the path and indices to swap.
+ */
+export function swap<TSchema extends FormSchema, TFieldArrayPath extends RequiredPath>(
+	form: BaseFormStore<TSchema>,
+	config: SwapConfig<TSchema, TFieldArrayPath>,
+): void {
+	// Get internal form and array store
+	const internalFormStore = form[INTERNAL];
+	const internalArrayStore = getFieldStore(internalFormStore, config.path) as InternalArrayStore;
+
+	// Get current items of field array
+	const items = untrack(() => internalArrayStore.items.value);
+
+	// Continue if both specified indices are valid
+	if (
+		config.at >= 0 &&
+		config.at <= items.length - 1 &&
+		config.and >= 0 &&
+		config.and <= items.length - 1 &&
+		config.at !== config.and
+	) {
+		batch(() => {
+			// Swap item IDs in items array
+			const newItems = [...items];
+			const tempItemId = newItems[config.at];
+			newItems[config.at] = newItems[config.and];
+			newItems[config.and] = tempItemId;
+			internalArrayStore.items.value = newItems;
+
+			// Swap child stores directly
+			swapItemState(
+				internalFormStore,
+				internalArrayStore.children[config.at],
+				internalArrayStore.children[config.and],
+			);
+
+			// Mark field array as touched and edited and update dirty state
+			internalArrayStore.isTouched.value = true;
+			internalArrayStore.isEdited.value = true;
+			internalArrayStore.isDirty.value =
+				internalArrayStore.startItems.value.join() !== newItems.join();
+
+			// Validate if required
+			// TODO: Should we validate on touch, change and blur too?
+			validateIfRequired(internalFormStore, internalArrayStore, 'input');
+		});
+	}
+}

package/src/methods/validate/index.ts

@@ -0,0 +1 @@
+export * from './validate.ts';

package/src/methods/validate/validate.ts

@@ -0,0 +1,34 @@
+import {
+	type BaseFormStore,
+	type FormSchema,
+	INTERNAL,
+	validateFormInput,
+} from '../../core/index.ts';
+import type * as v from 'valibot';
+
+/**
+ * Validate form config interface.
+ */
+export interface ValidateFormConfig {
+	/**
+	 * Whether to focus the first field with errors after validation. Defaults to false.
+	 */
+	readonly shouldFocus?: boolean | undefined;
+}
+
+/**
+ * Validates the entire form input against its schema. Returns a safe parse result
+ * indicating success or failure with detailed issues. Optionally focuses the first
+ * field with validation errors.
+ *
+ * @param form The form store to validate.
+ * @param config The validate form configuration specifying focus behavior.
+ *
+ * @returns A promise resolving to the validation result.
+ */
+export function validate<TSchema extends FormSchema>(
+	form: BaseFormStore<TSchema>,
+	config?: ValidateFormConfig,
+): Promise<v.SafeParseResult<TSchema>> {
+	return validateFormInput(form[INTERNAL], config) as Promise<v.SafeParseResult<TSchema>>;
+}

package/src/types/field.ts

@@ -0,0 +1,48 @@
+import type {
+	FieldElement,
+	FormSchema,
+	PartialValues,
+	PathValue,
+	RequiredPath,
+	ValidArrayPath,
+	ValidPath,
+} from '../core/index.ts';
+import type * as v from 'valibot';
+
+export interface FieldElementProps {
+	readonly name: string;
+	readonly autoFocus: boolean;
+	readonly ref: (element: FieldElement | null) => void;
+	readonly onFocus: (event: FocusEvent) => void;
+	readonly onInput: (event: InputEvent) => void;
+	readonly onChange: (event: Event) => void;
+	readonly onBlur: (event: FocusEvent) => void;
+}
+
+export interface FieldStore<
+	TSchema extends FormSchema = FormSchema,
+	TFieldPath extends RequiredPath = RequiredPath,
+> {
+	readonly path: ValidPath<v.InferInput<TSchema>, TFieldPath>;
+	readonly input: PartialValues<PathValue<v.InferInput<TSchema>, TFieldPath>>;
+	readonly errors: [string, ...string[]] | null;
+	readonly isTouched: boolean;
+	readonly isEdited: boolean;
+	readonly isDirty: boolean;
+	readonly isValid: boolean;
+	readonly onChange: (value: PartialValues<PathValue<v.InferInput<TSchema>, TFieldPath>>) => void;
+	readonly props: FieldElementProps;
+}
+
+export interface FieldArrayStore<
+	TSchema extends FormSchema = FormSchema,
+	TFieldArrayPath extends RequiredPath = RequiredPath,
+> {
+	readonly path: ValidArrayPath<v.InferInput<TSchema>, TFieldArrayPath>;
+	readonly items: string[];
+	readonly errors: [string, ...string[]] | null;
+	readonly isTouched: boolean;
+	readonly isEdited: boolean;
+	readonly isDirty: boolean;
+	readonly isValid: boolean;
+}

package/src/types/form.ts

@@ -0,0 +1,12 @@
+import type { BaseFormStore, FormSchema } from '../core/index.ts';
+
+export interface FormStore<TSchema extends FormSchema = FormSchema> extends BaseFormStore<TSchema> {
+	readonly isSubmitting: boolean;
+	readonly isSubmitted: boolean;
+	readonly isValidating: boolean;
+	readonly isTouched: boolean;
+	readonly isEdited: boolean;
+	readonly isDirty: boolean;
+	readonly isValid: boolean;
+	readonly errors: [string, ...string[]] | null;
+}

package/src/types/index.ts

@@ -0,0 +1,2 @@
+export * from './field.ts';
+export * from './form.ts';