@idem.agency/form-builder 0.0.12 → 0.0.13

package/src/shared/model/plugins/PluginManager.ts

@@ -1,84 +0,0 @@
-import type { IPlugin, IPluginContext } from './types';
-import { HookRegistry } from './HookRegistry';
-import { PipelineRegistry } from './PipelineRegistry';
-import { EventBus } from './EventBus';
-import { MiddlewareRegistry } from './MiddlewareRegistry';
-import { FieldRegistry } from './FieldRegistry';
-
-export class PluginManager {
-  private readonly eventRegistry = new HookRegistry();
-  private readonly pipelineRegistry = new PipelineRegistry();
-  private readonly eventBus = new EventBus();
-  private readonly middlewareRegistry = new MiddlewareRegistry();
-  private readonly fieldRegistry = new FieldRegistry();
-  private unsubscribers: Array<() => void> = [];
-  private installed = false;
-
-  constructor(private readonly plugins: IPlugin[]) {}
-
-  install(): void {
-    if (this.installed) return;
-    const context: IPluginContext = {
-      events: {
-        tap: (hook, handler) => {
-          const unsub = this.eventRegistry.tap(hook, handler);
-          this.unsubscribers.push(unsub);
-          return unsub;
-        },
-      },
-      pipeline: {
-        use: (pipeline, stage, priority) => {
-          const unsub = this.pipelineRegistry.use(pipeline, stage, priority);
-          this.unsubscribers.push(unsub);
-          return unsub;
-        },
-        useSync: (pipeline, stage, priority) => {
-          const unsub = this.pipelineRegistry.useSync(pipeline, stage, priority);
-          this.unsubscribers.push(unsub);
-          return unsub;
-        },
-      },
-      eventBus: {
-        on: (event, handler) => {
-          const unsub = this.eventBus.on(event, handler);
-          this.unsubscribers.push(unsub);
-          return unsub;
-        },
-        emit: (event, data) => this.eventBus.emit(event, data),
-      },
-      fields: {
-        register: (type, component) => {
-          const unsub = this.fieldRegistry.register(type, component);
-          this.unsubscribers.push(unsub);
-          return unsub;
-        },
-      },
-      middleware: {
-        use: (middleware) => {
-          const unsub = this.middlewareRegistry.use(middleware);
-          this.unsubscribers.push(unsub);
-          return unsub;
-        },
-      },
-    };
-
-    this.installed = true;
-    for (const plugin of this.plugins) {
-      plugin.install(context);
-    }
-  }
-
-  uninstall(): void {
-    if (!this.installed) return;
-    this.installed = false;
-    [...this.unsubscribers].reverse().forEach((fn) => fn());
-    this.unsubscribers = [];
-    [...this.plugins].reverse().forEach((plugin) => plugin.uninstall?.());
-  }
-
-  callEvents = this.eventRegistry.call.bind(this.eventRegistry);
-  runPipeline = this.pipelineRegistry.run.bind(this.pipelineRegistry);
-  runPipelineSync = this.pipelineRegistry.runSync.bind(this.pipelineRegistry);
-  getMiddleware = this.middlewareRegistry.getAll.bind(this.middlewareRegistry);
-  getFields = this.fieldRegistry.getAll.bind(this.fieldRegistry);
-}

package/src/shared/model/plugins/context.tsx

@@ -1,10 +0,0 @@
-import { createContext, useContext } from 'react';
-import type { PluginManager } from './PluginManager';
-
-export const PluginSystemContext = createContext<PluginManager | null>(null);
-
-export function usePluginManager(): PluginManager {
-  const ctx = useContext(PluginSystemContext);
-  if (!ctx) throw new Error('PluginSystemContext not found');
-  return ctx;
-}

package/src/shared/model/plugins/hooks.ts

@@ -1,22 +0,0 @@
-import { usePluginManager } from './context';
-import type { StoreMiddleware } from './types';
-
-export function useCallEvents() {
-  const pm = usePluginManager();
-  return pm.callEvents;
-}
-
-export function useRunPipeline() {
-  const pm = usePluginManager();
-  return pm.runPipeline;
-}
-
-export function useRunPipelineSync() {
-  const pm = usePluginManager();
-  return pm.runPipelineSync;
-}
-
-export function useMiddleware(): StoreMiddleware[] {
-  const pm = usePluginManager();
-  return pm.getMiddleware();
-}

package/src/shared/model/plugins/index.ts

@@ -1,23 +0,0 @@
-export type {
-  IPlugin,
-  IPluginContext,
-  IEventRegistry,
-  IPipelineRegistry,
-  IEventBus,
-  IFieldRegistry,
-  IMiddlewareRegistry,
-  FormHookName,
-  HookHandler,
-  AsyncPipelineName,
-  SyncPipelineName,
-  PipelineStage,
-  SyncPipelineStage,
-  AsyncPipelineDataMap,
-  SyncPipelineDataMap,
-  StoreMiddleware,
-  FormAction,
-  FormState,
-} from './types';
-export { PluginManager } from './PluginManager';
-export { PluginSystemContext, usePluginManager } from './context';
-export { useCallEvents, useRunPipeline, useRunPipelineSync, useMiddleware } from './hooks';

package/src/shared/model/plugins/types.ts

@@ -1,99 +0,0 @@
-import type { FormFieldConfig, FormData } from '@/shared/types/common';
-import type { FormElementComponent } from '@/shared/types/common';
-
-// ── Event registry types ─────────────────────────────────────────────────────
-export type FormHookName =
-  | 'form:init'
-  | 'form:destroy'
-  | 'form:reset'
-  | 'form:submit:before'
-  | 'form:submit:after'
-  | 'field:register'
-  | 'field:change'
-  | 'field:validate';
-
-export type HookHandler<T = unknown> = (data: T) => void | Promise<void>;
-
-export interface IEventRegistry {
-  tap<T>(hook: FormHookName, handler: HookHandler<T>): () => void;
-}
-
-// ── Pipeline types ───────────────────────────────────────────────────────────
-export type AsyncPipelineName =
-  | 'field:change'
-  | 'form:submit'
-  | 'form:init'
-  | 'form:validate';
-
-export type SyncPipelineName = 'field:visible';
-
-export type PipelineName = AsyncPipelineName | SyncPipelineName;
-
-export type AsyncPipelineDataMap = {
-  'field:change': { value: any; field: FormFieldConfig; path: string; formData: FormData; errors: string[] };
-  'form:submit': { formData: FormData };
-  'form:init': { formData: FormData };
-  'form:validate': { formData: FormData; errors: Record<string, string[]> };
-};
-
-export type SyncPipelineDataMap = {
-  'field:visible': { visible: boolean; field: FormFieldConfig; path: string; formData: FormData };
-};
-
-export type PipelineStage<T> = (data: T, next: (data: T) => Promise<T>) => Promise<T>;
-export type SyncPipelineStage<T> = (data: T, next: (data: T) => T) => T;
-
-export interface IPipelineRegistry {
-  use<K extends AsyncPipelineName>(
-    pipeline: K,
-    stage: PipelineStage<AsyncPipelineDataMap[K]>,
-    priority?: number
-  ): () => void;
-  useSync<K extends SyncPipelineName>(
-    pipeline: K,
-    stage: SyncPipelineStage<SyncPipelineDataMap[K]>,
-    priority?: number
-  ): () => void;
-}
-
-// ── EventBus types ───────────────────────────────────────────────────────────
-export interface IEventBus {
-  on<T = unknown>(event: string, handler: (data: T) => void): () => void;
-  emit<T = unknown>(event: string, data: T): void;
-}
-
-// ── Middleware types ─────────────────────────────────────────────────────────
-export type FormValues = Record<string, unknown>;
-export type FormAction = { type: string; payload?: unknown };
-export type FormState = { formData: FormValues; errors: Record<string, string[]> };
-
-export type StoreMiddleware = (
-  action: FormAction,
-  next: (action: FormAction) => void,
-  getState: () => FormState
-) => void;
-
-export interface IMiddlewareRegistry {
-  use(middleware: StoreMiddleware): () => void;
-}
-
-// ── FieldRegistry types ──────────────────────────────────────────────────────
-export interface IFieldRegistry {
-  register(type: string, component: FormElementComponent<any>): () => void;
-}
-
-// ── Plugin types ─────────────────────────────────────────────────────────────
-export interface IPluginContext {
-  events: IEventRegistry;
-  pipeline: IPipelineRegistry;
-  eventBus: IEventBus;
-  fields: IFieldRegistry;
-  middleware: IMiddlewareRegistry;
-}
-
-export interface IPlugin {
-  name: string;
-  version?: string;
-  install(context: IPluginContext): void;
-  uninstall?(): void;
-}

package/src/shared/model/store/createStoreContext.tsx

@@ -1,70 +0,0 @@
-import {
-  createContext,
-  useContext,
-  useRef,
-  useSyncExternalStore
-} from "react";
-
-import { createStore, type Reducer, type Store } from "./store";
-
-export function createStoreContext<S, A>(
-  reducer: Reducer<S, A>,
-  defaultState: S
-) {
-  const StoreContext = createContext<Store<S, A> | null>(null);
-  const Provider: React.FC<{ children: React.ReactNode, initialState?: S }> = ({
-                                                               children,
-                                                               initialState
-                                                             }) => {
-    const storeRef = useRef<Store<S, A>>(createStore(reducer, initialState ?? defaultState));
-
-    return (
-      <StoreContext.Provider value={storeRef.current}>
-        {children}
-      </StoreContext.Provider>
-    );
-  };
-  
-  function useStore<T>(
-    selector: (state: S) => T
-  ): T {
-    const store = useContext(StoreContext);
-
-    if (!store) {
-      throw new Error("StoreProvider missing");
-    }
-    
-    return useSyncExternalStore(
-      store.subscribe,
-      () => selector(store.getState()),
-      () => selector(store.getState())
-    );
-  }
-  
-  function useDispatch() {
-    const store = useContext(StoreContext);
-    
-    if (!store) {
-      throw new Error("StoreProvider missing");
-    }
-    
-    return store.dispatch;
-  }
-  
-  function useStoreInstance(): Store<S, A> {
-    const store = useContext(StoreContext);
-
-    if (!store) {
-      throw new Error("StoreProvider missing");
-    }
-
-    return store;
-  }
-  
-  return {
-    Provider,
-    useStore,
-    useDispatch,
-    useStoreInstance,
-  };
-}

package/src/shared/model/store/index.test.tsx

@@ -1,113 +0,0 @@
-import { describe, it, expect } from 'vitest'
-import { render, act } from '@testing-library/react'
-import React from 'react'
-import { FormStoreProvider, useFormStore, useFormDispatch } from './index'
-
-function wrapper(children: React.ReactNode, formData?: Record<string, any>) {
-  return render(
-    <FormStoreProvider formData={formData}>{children}</FormStoreProvider>
-  )
-}
-
-describe('FormStore reducer', () => {
-  it('setValue updates formData', () => {
-    let dispatch: ReturnType<typeof useFormDispatch>
-    const Comp = () => {
-      const value = useFormStore(s => s.formData.name)
-      dispatch = useFormDispatch()
-      return <span data-testid="val">{value}</span>
-    }
-    const { getByTestId } = wrapper(<Comp />)
-    act(() => dispatch({ type: 'setValue', path: 'name', value: 'John' }))
-    expect(getByTestId('val').textContent).toBe('John')
-  })
-
-  it('setFieldValue updates formData and errors', () => {
-    let dispatch: ReturnType<typeof useFormDispatch>
-    const Comp = () => {
-      const value = useFormStore(s => s.formData.email)
-      const errors = useFormStore(s => s.errors.email)
-      dispatch = useFormDispatch()
-      return (
-        <>
-          <span data-testid="val">{value}</span>
-          <span data-testid="err">{JSON.stringify(errors)}</span>
-        </>
-      )
-    }
-    const { getByTestId } = wrapper(<Comp />)
-    act(() => dispatch({ type: 'setFieldValue', path: 'email', value: 'bad', errors: ['Invalid'] }))
-    expect(getByTestId('val').textContent).toBe('bad')
-    expect(getByTestId('err').textContent).toBe('["Invalid"]')
-  })
-
-  it('setFieldValue clears errors when errors array is empty', () => {
-    let dispatch: ReturnType<typeof useFormDispatch>
-    const Comp = () => {
-      const errors = useFormStore(s => s.errors.email)
-      dispatch = useFormDispatch()
-      return <span data-testid="err">{JSON.stringify(errors)}</span>
-    }
-    const { getByTestId } = wrapper(<Comp />)
-    act(() => dispatch({ type: 'setFieldValue', path: 'email', value: 'ok@ok.com', errors: [] }))
-    expect(getByTestId('err').textContent).toBe('null')
-  })
-
-  it('setError updates specific error', () => {
-    let dispatch: ReturnType<typeof useFormDispatch>
-    const Comp = () => {
-      const error = useFormStore(s => s.errors.name)
-      dispatch = useFormDispatch()
-      return <span data-testid="err">{error}</span>
-    }
-    const { getByTestId } = wrapper(<Comp />)
-    act(() => dispatch({ type: 'setError', path: 'name', value: 'Required' }))
-    expect(getByTestId('err').textContent).toBe('Required')
-  })
-
-  it('reset clears formData and errors', () => {
-    let dispatch: ReturnType<typeof useFormDispatch>
-    const Comp = () => {
-      const value = useFormStore(s => s.formData.name)
-      const error = useFormStore(s => s.errors.name)
-      dispatch = useFormDispatch()
-      return (
-        <>
-          <span data-testid="val">{value}</span>
-          <span data-testid="err">{error}</span>
-        </>
-      )
-    }
-    const { getByTestId } = wrapper(<Comp />)
-    act(() => {
-      dispatch({ type: 'setValue', path: 'name', value: 'John' })
-      dispatch({ type: 'setError', path: 'name', value: 'Error' })
-    })
-    act(() => dispatch({ type: 'reset' }))
-    expect(getByTestId('val').textContent).toBe('')
-    expect(getByTestId('err').textContent).toBe('')
-  })
-
-  it('setErrors replaces all errors', () => {
-    let dispatch: ReturnType<typeof useFormDispatch>
-    const Comp = () => {
-      const errors = useFormStore(s => s.errors)
-      dispatch = useFormDispatch()
-      return <span data-testid="err">{JSON.stringify(errors)}</span>
-    }
-    const { getByTestId } = wrapper(<Comp />)
-    act(() => dispatch({ type: 'setErrors', errors: { name: ['Required'], email: ['Invalid'] } }))
-    const errors = JSON.parse(getByTestId('err').textContent!)
-    expect(errors.name).toEqual(['Required'])
-    expect(errors.email).toEqual(['Invalid'])
-  })
-
-  it('FormStoreProvider accepts initial formData', () => {
-    const Comp = () => {
-      const value = useFormStore(s => s.formData.name)
-      return <span data-testid="val">{value}</span>
-    }
-    const { getByTestId } = wrapper(<Comp />, { name: 'InitialName' })
-    expect(getByTestId('val').textContent).toBe('InitialName')
-  })
-})

package/src/shared/model/store/index.tsx

@@ -1,96 +0,0 @@
-import { createStoreContext } from "./createStoreContext";
-import type { FormData } from "@/shared/types/common";
-import { updateNestedValue } from "@/shared/utils";
-import { createContext, useContext, useMemo, type ReactNode } from "react";
-import { PluginSystemContext } from "@/shared/model/plugins/context";
-import type { StoreMiddleware, FormAction as PluginFormAction, FormState as PluginFormState } from "@/shared/model/plugins/types";
-
-type State = {
-  formData: FormData
-  errors: Record<string, any>
-};
-
-type Action =
-  | { type: "setValue"; path: string; value: unknown }
-  | { type: "setFieldValue"; path: string; value: unknown, errors?: string[] }
-  | { type: "setError"; path: string; value?: string }
-  | { type: "reset"; }
-  | { type: "setErrors"; errors?: object };
-
-function reducer(state: State, action: Action): State {
-  const newData = { ...state };
-  switch (action.type) {
-    case 'setValue':
-      newData.formData = updateNestedValue(newData.formData, action.path, action.value);
-      break;
-    case 'setFieldValue':
-      newData.formData = updateNestedValue(newData.formData, action.path, action.value);
-      newData.errors = updateNestedValue(newData.errors, action.path, action?.errors?.length ? action.errors : null);
-      break;
-    case 'setError':
-      newData.errors = updateNestedValue(newData.errors, action.path, action.value);
-      break;
-    case 'reset':
-      newData.formData = {};
-      newData.errors = {};
-      break;
-    case 'setErrors':
-      newData.errors = { ...action.errors };
-      break;
-  }
-  return newData;
-}
-
-function composeMiddleware(
-  middlewares: StoreMiddleware[],
-  baseDispatch: (action: Action) => void,
-  getState: () => State
-): (action: Action) => void {
-  if (middlewares.length === 0) return baseDispatch;
-  return middlewares.reduceRight(
-    (next, m) => (action: Action) =>
-      m(
-        action as PluginFormAction,
-        next as (a: PluginFormAction) => void,
-        getState as () => PluginFormState
-      ),
-    baseDispatch as (action: Action) => void
-  );
-}
-
-const {
-  Provider,
-  useStore: useFormStore,
-  useDispatch: _useRawDispatch,
-  useStoreInstance: useFormStoreInstance,
-} = createStoreContext(reducer, { formData: {}, errors: {} });
-
-const DispatchContext = createContext<((action: Action) => void) | null>(null);
-
-const DispatchEnhancer: React.FC<{ children: ReactNode }> = ({ children }) => {
-  const pluginManager = useContext(PluginSystemContext);
-  const store = useFormStoreInstance();
-  const rawDispatch = _useRawDispatch();
-  const middlewares = pluginManager ? pluginManager.getMiddleware() : [];
-
-  const dispatch = useMemo(
-    () => composeMiddleware(middlewares, rawDispatch, store.getState as () => State),
-    [] // middleware is fixed at mount time
-  );
-
-  return <DispatchContext.Provider value={dispatch}>{children}</DispatchContext.Provider>;
-};
-
-const FormStoreProvider: React.FC<{ children: ReactNode; formData?: FormData }> = ({ children, formData }) => (
-  <Provider initialState={{ formData: formData ?? {}, errors: {} }}>
-    <DispatchEnhancer>{children}</DispatchEnhancer>
-  </Provider>
-);
-
-function useFormDispatch(): (action: Action) => void {
-  const ctx = useContext(DispatchContext);
-  if (!ctx) throw new Error("FormStoreProvider missing");
-  return ctx;
-}
-
-export { FormStoreProvider, useFormStore, useFormDispatch, useFormStoreInstance };

package/src/shared/model/store/store.test.ts

@@ -1,64 +0,0 @@
-import { describe, it, expect, vi } from 'vitest'
-import { createStore } from './store'
-
-type State = { count: number; name: string }
-type Action = { type: 'increment' } | { type: 'setName'; name: string }
-
-function reducer(state: State, action: Action): State {
-  switch (action.type) {
-    case 'increment':
-      return { ...state, count: state.count + 1 }
-    case 'setName':
-      return { ...state, name: action.name }
-    default:
-      return state
-  }
-}
-
-describe('createStore', () => {
-  it('getState returns initial state', () => {
-    const store = createStore(reducer, { count: 0, name: 'test' })
-    expect(store.getState()).toEqual({ count: 0, name: 'test' })
-  })
-
-  it('dispatch updates state via reducer', () => {
-    const store = createStore(reducer, { count: 0, name: '' })
-    store.dispatch({ type: 'increment' })
-    expect(store.getState().count).toBe(1)
-  })
-
-  it('subscribe notifies listener on dispatch', () => {
-    const store = createStore(reducer, { count: 0, name: '' })
-    const listener = vi.fn()
-    store.subscribe(listener)
-    store.dispatch({ type: 'increment' })
-    expect(listener).toHaveBeenCalledTimes(1)
-  })
-
-  it('unsubscribe removes listener', () => {
-    const store = createStore(reducer, { count: 0, name: '' })
-    const listener = vi.fn()
-    const unsub = store.subscribe(listener)
-    unsub()
-    store.dispatch({ type: 'increment' })
-    expect(listener).not.toHaveBeenCalled()
-  })
-
-  it('subscribeSelector calls listener only when selected value changes', () => {
-    const store = createStore(reducer, { count: 0, name: '' })
-    const listener = vi.fn()
-    store.subscribeSelector(s => s.count, listener)
-    store.dispatch({ type: 'setName', name: 'hello' })
-    expect(listener).not.toHaveBeenCalled()
-    store.dispatch({ type: 'increment' })
-    expect(listener).toHaveBeenCalledWith(1)
-  })
-
-  it('subscribeSelector does not call listener on unrelated changes', () => {
-    const store = createStore(reducer, { count: 0, name: '' })
-    const listener = vi.fn()
-    store.subscribeSelector(s => s.name, listener)
-    store.dispatch({ type: 'increment' })
-    expect(listener).not.toHaveBeenCalled()
-  })
-})

package/src/shared/model/store/store.ts

@@ -1,38 +0,0 @@
-export type Reducer<S, A> = (state: S, action: A) => S;
-
-export function createStore<S, A>(
-  reducer: Reducer<S, A>,
-  initialState: S
-) {
-  let state = initialState;
-  const listeners = new Set<() => void>();
-  
-  return {
-    getState(): S {
-      return state;
-    },
-    
-    dispatch(action: A) {
-      state = reducer(state, action);
-      listeners.forEach(l => l());
-    },
-    
-    subscribe(listener: () => void) {
-      listeners.add(listener);
-      return () => { listeners.delete(listener) };
-    },
-
-    subscribeSelector<T>(selector: (state: S) => T, listener: (value: T) => void) {
-      let prev = selector(state);
-      return this.subscribe(() => {
-        const next = selector(state);
-        if (next !== prev) {
-          prev = next;
-          listener(next);
-        }
-      });
-    }
-  };
-}
-
-export type Store<S, A> = ReturnType<typeof createStore<S, A>>;

package/src/shared/test-utils.tsx

@@ -1,33 +0,0 @@
-import React, { useMemo } from 'react'
-import { render } from '@testing-library/react'
-import { FormStoreProvider } from '@/shared/model/store'
-import { PluginManager } from '@/shared/model/plugins/PluginManager'
-import { PluginSystemContext } from '@/shared/model/plugins/context'
-import { createValidationPlugin } from '@/plugins/validation'
-import { BuilderProvider } from '@/entity/dynamicBuilder'
-import type { TValidator } from '@/plugins/validation'
-import type { FormData, FormElementRegistry } from '@/shared/types/common'
-
-type RenderOptions = {
-  formData?: FormData
-  validator?: TValidator
-  fields?: FormElementRegistry
-}
-
-export function renderWithProviders(
-  ui: React.ReactElement,
-  { formData, validator, fields }: RenderOptions = {}
-) {
-  const pm = new PluginManager([createValidationPlugin(validator)]);
-  pm.install();
-
-  return render(
-    <PluginSystemContext.Provider value={pm}>
-      <FormStoreProvider formData={formData}>
-        <BuilderProvider fields={fields ?? {}}>
-          {ui}
-        </BuilderProvider>
-      </FormStoreProvider>
-    </PluginSystemContext.Provider>
-  )
-}