@cube-dev/ui-kit 0.181.0 → 0.183.0

package/dist/components/form/Form/modern/controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"controller.js","names":[],"sources":["../../../../../src/components/form/Form/modern/controller.ts"],"sourcesContent":["import { FORM_BACKEND, isModernFormController } from '../backend';\n\nimport { createFormField } from './field';\nimport { createFormStore } from './store';\n\nimport type { ReactNode } from 'react';\nimport type { FormField, FormFieldOptions } from './field';\nimport type {\n  CheckedFormDependencies,\n  CheckedFormPath,\n  FormValueAtPath,\n} from './path-types';\nimport type { FormReadValue } from './read-types';\nimport type {\n  FieldState,\n  FormState,\n  FormStore,\n  FormStoreOptions,\n  SetValueOptions,\n  ModernFieldValidationResult as StoreFieldValidationResult,\n  ModernSubmitFailure as StoreSubmitFailure,\n  ModernSubmitResult as StoreSubmitResult,\n  ModernValidationResult as StoreValidationResult,\n} from './types';\nimport type { ModernValidationRule as StoreValidationRule } from './validation';\nimport type { FormPath } from './values';\n\nexport type ModernValidationRule = StoreValidationRule<ReactNode>;\nexport type ModernValidationResult = StoreValidationResult<ReactNode>;\nexport type ModernFieldValidationResult = StoreFieldValidationResult<ReactNode>;\nexport type ModernSubmitFailure = StoreSubmitFailure<ReactNode>;\nexport type ModernFieldState<Value = unknown> = Omit<\n  FieldState<ReactNode>,\n  'value' | 'defaultValue'\n> & {\n  readonly value: FormReadValue<Value> | undefined;\n  readonly defaultValue: FormReadValue<Value> | undefined;\n};\n\nexport type ModernSubmitResult = StoreSubmitResult<ReactNode>;\n\nexport type ModernFormState<T extends object = Record<string, unknown>> =\n  FormState<T, ReactNode>;\n\nexport type UseFormControllerOptions<\n  T extends object = Record<string, unknown>,\n> = FormStoreOptions<T, ReactNode>;\n\n/** Public commands; registration and pipeline state tokens stay internal. */\nexport type FormController<T extends object = Record<string, unknown>> =\n  Readonly<\n    Pick<\n      FormStore<T, ReactNode>,\n      | typeof FORM_BACKEND\n      | 'validate'\n      | 'submit'\n      | 'blur'\n      | 'getSnapshot'\n      | 'getValues'\n      | 'getActiveValues'\n      | 'subscribe'\n      | 'setValues'\n      | 'batch'\n      | 'setDefaultValues'\n      | 'adoptDefaultValues'\n      | 'reset'\n      | 'touch'\n      | 'setFieldErrors'\n      | 'clearFieldErrors'\n      | 'setSubmitError'\n      | 'clearSubmitError'\n    > & {\n      getFieldSnapshot<const Path extends FormPath>(\n        path: CheckedFormPath<T, Path>,\n      ): ModernFieldState<FormValueAtPath<T, Path>> | undefined;\n      getValue<const Path extends FormPath>(\n        path: CheckedFormPath<T, Path>,\n      ): FormReadValue<FormValueAtPath<T, Path>> | undefined;\n      setValue<const Path extends FormPath>(\n        path: CheckedFormPath<T, Path>,\n        value: FormValueAtPath<T, NoInfer<Path>> | undefined,\n        options?: SetValueOptions,\n      ): void;\n      field<\n        const Path extends FormPath,\n        const Dependencies extends readonly FormPath[] = readonly FormPath[],\n      >(\n        path: CheckedFormPath<T, Path>,\n        options?: FormFieldOptions<T, FormValueAtPath<T, NoInfer<Path>>> & {\n          dependsOn?: Dependencies & CheckedFormDependencies<T, Dependencies>;\n        },\n      ): FormField<FormValueAtPath<T, Path>>;\n    }\n  >;\n\n// Symbol.for also lets two copies of the kit share a controller, just as the\n// backend brand does. This symbol and the store are not package exports.\nconst CONTROLLER_STORE = Symbol.for('@cube-dev/ui-kit/form-controller-store');\n\ninterface ControllerInternals<T extends object> {\n  store: FormStore<T, ReactNode>;\n  getServerSnapshot(): ModernFormState<T>;\n  getRootElement(): HTMLFormElement | undefined;\n  bindRootElement(element: HTMLFormElement | null): () => void;\n}\n\n/** Pure allocation for the creation hook; no listeners or external effects. */\nexport function createFormController<T extends object>(\n  options?: UseFormControllerOptions<T>,\n): FormController<T> {\n  const store = createFormStore<T, ReactNode>(options);\n  const serverSnapshot = store.getSnapshot();\n  let rootElement: HTMLFormElement | undefined;\n  const internals: ControllerInternals<T> = {\n    store,\n    getServerSnapshot: () => serverSnapshot,\n    getRootElement: () => rootElement,\n    bindRootElement(element) {\n      rootElement = element ?? undefined;\n      return () => {\n        if (rootElement === element) rootElement = undefined;\n      };\n    },\n  };\n  const controller = Object.freeze({\n    [FORM_BACKEND]: 'modern' as const,\n    [CONTROLLER_STORE]: internals,\n    validate: store.validate,\n    submit: store.submit,\n    blur: store.blur,\n    getSnapshot: store.getSnapshot,\n    getFieldSnapshot: store.getFieldSnapshot,\n    getValue: store.getValue,\n    getValues: store.getValues,\n    getActiveValues: store.getActiveValues,\n    subscribe: store.subscribe,\n    setValue: store.setValue,\n    setValues: store.setValues,\n    batch: store.batch,\n    setDefaultValues: store.setDefaultValues,\n    adoptDefaultValues: store.adoptDefaultValues,\n    reset: store.reset,\n    touch: store.touch,\n    setFieldErrors: store.setFieldErrors,\n    clearFieldErrors: store.clearFieldErrors,\n    setSubmitError: store.setSubmitError,\n    clearSubmitError: store.clearSubmitError,\n    field: (path: FormPath, config?: FormFieldOptions<T, unknown>) =>\n      createFormField(controller, path, config),\n  }) as FormController<T>;\n  return controller;\n}\n\nexport function getControllerInternals<T extends object>(\n  controller: FormController<T>,\n  receiver: string,\n): ControllerInternals<T> {\n  const internals = isModernFormController(controller)\n    ? (controller as unknown as Record<symbol, ControllerInternals<T>>)[\n        CONTROLLER_STORE\n      ]\n    : undefined;\n  if (!internals) {\n    throw new Error(\n      `${receiver} requires a modern form controller created by Form.useController(). Legacy Form instances and bare backend brands are not supported.`,\n    );\n  }\n  return internals;\n}\n"],"mappings":";;;;;;AAiGA,MAAM,mBAAmB,OAAO,IAAI,yCAAyC;;AAU7E,SAAgB,qBACd,SACmB;CACnB,MAAM,QAAQ,gBAA8B,QAAQ;CACpD,MAAM,iBAAiB,MAAM,aAAa;CAC1C,IAAI;CACJ,MAAM,YAAoC;EACxC;EACA,yBAAyB;EACzB,sBAAsB;EACtB,gBAAgB,SAAS;AACvB,iBAAc,WAAW;AACzB,gBAAa;AACX,QAAI,gBAAgB,QAAS,eAAc;;;EAGhD;CACD,MAAM,aAAa,OAAO,OAAO;GAC9B,eAAe;GACf,mBAAmB;EACpB,UAAU,MAAM;EAChB,QAAQ,MAAM;EACd,MAAM,MAAM;EACZ,aAAa,MAAM;EACnB,kBAAkB,MAAM;EACxB,UAAU,MAAM;EAChB,WAAW,MAAM;EACjB,iBAAiB,MAAM;EACvB,WAAW,MAAM;EACjB,UAAU,MAAM;EAChB,WAAW,MAAM;EACjB,OAAO,MAAM;EACb,kBAAkB,MAAM;EACxB,oBAAoB,MAAM;EAC1B,OAAO,MAAM;EACb,OAAO,MAAM;EACb,gBAAgB,MAAM;EACtB,kBAAkB,MAAM;EACxB,gBAAgB,MAAM;EACtB,kBAAkB,MAAM;EACxB,QAAQ,MAAgB,WACtB,gBAAgB,YAAY,MAAM,OAAO;EAC5C,CAAC;AACF,QAAO;;AAGT,SAAgB,uBACd,YACA,UACwB;CACxB,MAAM,YAAY,uBAAuB,WAAW,GAC/C,WACC,oBAEF;AACJ,KAAI,CAAC,UACH,OAAM,IAAI,MACR,GAAG,SAAS,sIACb;AAEH,QAAO"}
+{"version":3,"file":"controller.js","names":["FORM_BACKEND","isModernFormController","createFormField","createFormStore","ReactNode","FormField","FormFieldOptions","CheckedFormDependencies","CheckedFormPath","FormValueAtPath","FormReadValue","FieldState","FormState","FormStore","FormStoreOptions","SetValueOptions","ModernFieldValidationResult","StoreFieldValidationResult","ModernSubmitFailure","StoreSubmitFailure","ModernSubmitResult","StoreSubmitResult","ModernValidationResult","StoreValidationResult","ModernValidationRule","StoreValidationRule","FormPath","ModernFieldState","Omit","value","Value","defaultValue","ModernFormState","Record","T","UseFormControllerOptions","FormController","Readonly","Pick","getFieldSnapshot","path","Path","getValue","setValue","NoInfer","options","field","dependsOn","Dependencies","CONTROLLER_STORE","Symbol","for","ControllerInternals","store","getServerSnapshot","getRootElement","HTMLFormElement","bindRootElement","element","createFormController","serverSnapshot","getSnapshot","rootElement","internals","undefined","controller","Object","freeze","const","validate","submit","blur","getValues","getActiveValues","subscribe","setValues","batch","setDefaultValues","adoptDefaultValues","reset","touch","setFieldErrors","clearFieldErrors","setSubmitError","clearSubmitError","config","getControllerInternals","receiver","Error"],"sources":["../../../../../src/components/form/Form/modern/controller.ts"],"sourcesContent":["import { FORM_BACKEND, isModernFormController } from '../backend';\n\nimport { createFormField } from './field';\nimport { createFormStore } from './store';\n\nimport type { ReactNode } from 'react';\nimport type { FormField, FormFieldOptions } from './field';\nimport type {\n  CheckedFormDependencies,\n  CheckedFormPath,\n  FormValueAtPath,\n} from './path-types';\nimport type { FormReadValue } from './read-types';\nimport type {\n  FieldState,\n  FormState,\n  FormStore,\n  FormStoreOptions,\n  SetValueOptions,\n  ModernFieldValidationResult as StoreFieldValidationResult,\n  ModernSubmitFailure as StoreSubmitFailure,\n  ModernSubmitResult as StoreSubmitResult,\n  ModernValidationResult as StoreValidationResult,\n} from './types';\nimport type { ModernValidationRule as StoreValidationRule } from './validation';\nimport type { FormPath } from './values';\n\nexport type ModernValidationRule = StoreValidationRule<ReactNode>;\nexport type ModernValidationResult = StoreValidationResult<ReactNode>;\nexport type ModernFieldValidationResult = StoreFieldValidationResult<ReactNode>;\nexport type ModernSubmitFailure = StoreSubmitFailure<ReactNode>;\nexport type ModernFieldState<Value = unknown> = Omit<\n  FieldState<ReactNode>,\n  'value' | 'defaultValue'\n> & {\n  readonly value: FormReadValue<Value> | undefined;\n  readonly defaultValue: FormReadValue<Value> | undefined;\n};\n\nexport type ModernSubmitResult = StoreSubmitResult<ReactNode>;\n\nexport type ModernFormState<T extends object = Record<string, unknown>> =\n  FormState<T, ReactNode>;\n\nexport type UseFormControllerOptions<\n  T extends object = Record<string, unknown>,\n> = FormStoreOptions<T, ReactNode>;\n\n/** Public commands; registration and pipeline state tokens stay internal. */\nexport type FormController<T extends object = Record<string, unknown>> =\n  Readonly<\n    Pick<\n      FormStore<T, ReactNode>,\n      | typeof FORM_BACKEND\n      | 'validate'\n      | 'submit'\n      | 'blur'\n      | 'getSnapshot'\n      | 'getValues'\n      | 'getActiveValues'\n      | 'subscribe'\n      | 'setValues'\n      | 'batch'\n      | 'setDefaultValues'\n      | 'adoptDefaultValues'\n      | 'reset'\n      | 'touch'\n      | 'setFieldErrors'\n      | 'clearFieldErrors'\n      | 'setSubmitError'\n      | 'clearSubmitError'\n    > & {\n      getFieldSnapshot<const Path extends FormPath>(\n        path: CheckedFormPath<T, Path>,\n      ): ModernFieldState<FormValueAtPath<T, Path>> | undefined;\n      getValue<const Path extends FormPath>(\n        path: CheckedFormPath<T, Path>,\n      ): FormReadValue<FormValueAtPath<T, Path>> | undefined;\n      setValue<const Path extends FormPath>(\n        path: CheckedFormPath<T, Path>,\n        value: FormValueAtPath<T, NoInfer<Path>> | undefined,\n        options?: SetValueOptions,\n      ): void;\n      field<\n        const Path extends FormPath,\n        const Dependencies extends readonly FormPath[] = readonly FormPath[],\n      >(\n        path: CheckedFormPath<T, Path>,\n        options?: FormFieldOptions<T, FormValueAtPath<T, NoInfer<Path>>> & {\n          dependsOn?: Dependencies & CheckedFormDependencies<T, Dependencies>;\n        },\n      ): FormField<FormValueAtPath<T, Path>>;\n    }\n  >;\n\n// Symbol.for also lets two copies of the kit share a controller, just as the\n// backend brand does. This symbol and the store are not package exports.\nconst CONTROLLER_STORE = Symbol.for('@cube-dev/ui-kit/form-controller-store');\n\ninterface ControllerInternals<T extends object> {\n  store: FormStore<T, ReactNode>;\n  getServerSnapshot(): ModernFormState<T>;\n  getRootElement(): HTMLFormElement | undefined;\n  bindRootElement(element: HTMLFormElement | null): () => void;\n}\n\n/** Pure allocation for the creation hook; no listeners or external effects. */\nexport function createFormController<T extends object>(\n  options?: UseFormControllerOptions<T>,\n): FormController<T> {\n  const store = createFormStore<T, ReactNode>(options);\n  const serverSnapshot = store.getSnapshot();\n  let rootElement: HTMLFormElement | undefined;\n  const internals: ControllerInternals<T> = {\n    store,\n    getServerSnapshot: () => serverSnapshot,\n    getRootElement: () => rootElement,\n    bindRootElement(element) {\n      rootElement = element ?? undefined;\n      return () => {\n        if (rootElement === element) rootElement = undefined;\n      };\n    },\n  };\n  const controller = Object.freeze({\n    [FORM_BACKEND]: 'modern' as const,\n    [CONTROLLER_STORE]: internals,\n    validate: store.validate,\n    submit: store.submit,\n    blur: store.blur,\n    getSnapshot: store.getSnapshot,\n    getFieldSnapshot: store.getFieldSnapshot,\n    getValue: store.getValue,\n    getValues: store.getValues,\n    getActiveValues: store.getActiveValues,\n    subscribe: store.subscribe,\n    setValue: store.setValue,\n    setValues: store.setValues,\n    batch: store.batch,\n    setDefaultValues: store.setDefaultValues,\n    adoptDefaultValues: store.adoptDefaultValues,\n    reset: store.reset,\n    touch: store.touch,\n    setFieldErrors: store.setFieldErrors,\n    clearFieldErrors: store.clearFieldErrors,\n    setSubmitError: store.setSubmitError,\n    clearSubmitError: store.clearSubmitError,\n    field: (path: FormPath, config?: FormFieldOptions<T, unknown>) =>\n      createFormField(controller, path, config),\n  }) as FormController<T>;\n  return controller;\n}\n\nexport function getControllerInternals<T extends object>(\n  controller: FormController<T>,\n  receiver: string,\n): ControllerInternals<T> {\n  const internals = isModernFormController(controller)\n    ? (controller as unknown as Record<symbol, ControllerInternals<T>>)[\n        CONTROLLER_STORE\n      ]\n    : undefined;\n  if (!internals) {\n    throw new Error(\n      `${receiver} requires a modern form controller created by Form.useController(). Legacy Form instances and bare backend brands are not supported.`,\n    );\n  }\n  return internals;\n}\n"],"mappings":";;;;;;AAiGA,MAAMiD,mBAAmBC,OAAOC,IAAI,yCAAyC;;AAU7E,SAAgBQ,qBACdd,SACmB;CACnB,MAAMQ,QAAQlD,gBAA8B0C,QAAQ;CACpD,MAAMe,iBAAiBP,MAAMQ,aAAa;CAC1C,IAAIC;CACJ,MAAMC,YAAoC;EACxCV;EACAC,yBAAyBM;EACzBL,sBAAsBO;EACtBL,gBAAgBC,SAAS;AACvBI,iBAAcJ,WAAWM;AACzB,gBAAa;AACX,QAAIF,gBAAgBJ,QAASI,eAAcE;;;EAGhD;CACD,MAAMC,aAAaC,OAAOC,OAAO;GAC9BnE,eAAe;GACfiD,mBAAmBc;EACpBM,UAAUhB,MAAMgB;EAChBC,QAAQjB,MAAMiB;EACdC,MAAMlB,MAAMkB;EACZV,aAAaR,MAAMQ;EACnBtB,kBAAkBc,MAAMd;EACxBG,UAAUW,MAAMX;EAChB8B,WAAWnB,MAAMmB;EACjBC,iBAAiBpB,MAAMoB;EACvBC,WAAWrB,MAAMqB;EACjB/B,UAAUU,MAAMV;EAChBgC,WAAWtB,MAAMsB;EACjBC,OAAOvB,MAAMuB;EACbC,kBAAkBxB,MAAMwB;EACxBC,oBAAoBzB,MAAMyB;EAC1BC,OAAO1B,MAAM0B;EACbC,OAAO3B,MAAM2B;EACbC,gBAAgB5B,MAAM4B;EACtBC,kBAAkB7B,MAAM6B;EACxBC,gBAAgB9B,MAAM8B;EACtBC,kBAAkB/B,MAAM+B;EACxBtC,QAAQN,MAAgB6C,WACtBnF,gBAAgB+D,YAAYzB,MAAM6C,OAAM;EAC3C,CAAC;AACF,QAAOpB;;AAGT,SAAgBqB,uBACdrB,YACAsB,UACwB;CACxB,MAAMxB,YAAY9D,uBAAuBgE,WAAW,GAC/CA,WACChB,oBAEFe;AACJ,KAAI,CAACD,UACH,OAAM,IAAIyB,MACR,GAAGD,SAAQ,sIACZ;AAEH,QAAOxB"}

package/dist/components/form/Form/modern/field-binding.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.181.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { getFieldKey, hasPath, normalizePath, readPath } from "./values.js";
 import { getControllerInternals } from "./controller.js";
 

package/dist/components/form/Form/modern/field-binding.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-binding.js","names":[],"sources":["../../../../../src/components/form/Form/modern/field-binding.ts"],"sourcesContent":["import { getControllerInternals } from './controller';\nimport { getFieldKey, hasPath, normalizePath, readPath } from './values';\n\nimport type { ReactNode } from 'react';\nimport type { FieldCoreProps, ValidateTrigger } from '../../../../shared/form';\nimport type { FormController, ModernFormState } from './controller';\nimport type {\n  FieldState,\n  RegistrationOptions,\n  RegistrationToken,\n} from './types';\nimport type { FormPath } from './values';\n\n/** The only state a bound input renders; metadata stays in selector subscribers. */\nexport type FieldView = Pick<\n  FieldState<ReactNode>,\n  'value' | 'errors' | 'status'\n>;\n\nexport interface FieldBackendHandle {\n  subscribe(listener: () => void): () => void;\n  getSnapshot(): FieldView | undefined;\n  getServerSnapshot(): FieldView | undefined;\n  register(): RegistrationToken<ReactNode> | undefined;\n  change(value: unknown, dontTouch: boolean, trigger: ValidateTrigger): void;\n  blur(): void;\n}\n\nexport function sameFieldView(a?: FieldView, b?: FieldView) {\n  return (\n    Object.is(a?.value, b?.value) &&\n    a?.errors === b?.errors &&\n    a?.status === b?.status\n  );\n}\n\nexport function createModernFieldBackend(\n  form: FormController<any>,\n  name: FormPath,\n): FieldBackendHandle {\n  const { store, getServerSnapshot } = getControllerInternals(\n    form,\n    `The \"${name}\" field`,\n  );\n  const key = getFieldKey(name);\n  const path = normalizePath(name);\n  const views = new WeakMap<object, FieldView>();\n  const view = (state: ModernFormState): FieldView | undefined => {\n    if (state.fields[key]) return state.fields[key];\n    if (!hasPath(state.values, path)) return undefined;\n    let cached = views.get(state);\n    if (!cached) {\n      cached = Object.freeze({\n        value: readPath(state.values, path),\n        errors: Object.freeze([]),\n        status: 'unvalidated',\n      });\n      views.set(state, cached);\n    }\n    return cached;\n  };\n  return {\n    subscribe: store.subscribe,\n    getSnapshot: () => view(store.getSnapshot()),\n    getServerSnapshot: () => view(getServerSnapshot()),\n    register: () => store.register(name),\n    change: (value, dontTouch) =>\n      store.setValue(name, value, {\n        source: 'user',\n        touch: !dontTouch,\n        validate: dontTouch ? 'never' : 'auto',\n      }),\n    blur: () => store.blur(name),\n  };\n}\n\nexport function fieldRegistrationOptions(\n  props: FieldCoreProps & {\n    defaultValue?: unknown;\n    validateTrigger?: ValidateTrigger;\n  },\n  defaultTrigger?: ValidateTrigger,\n): RegistrationOptions<ReactNode> {\n  const rules = props.rules?.flat(Infinity);\n  return {\n    ...(Object.hasOwn(props, 'defaultValue')\n      ? { defaultValue: props.defaultValue }\n      : {}),\n    preserve: props.preserve,\n    dependsOn: props.dependsOn,\n    deps: props.deps,\n    isEqual: props.isEqual,\n    rules:\n      props.isRequired && !rules?.some((rule) => rule.required)\n        ? [{ required: true }, ...(rules ?? [])]\n        : rules,\n    rulesKey: props.rulesKey,\n    validationDelay: props.validationDelay,\n    validateTrigger: props.validateTrigger ?? defaultTrigger ?? 'onBlur',\n    errorPolicy: props.errorPolicy,\n  };\n}\n"],"mappings":";;;;;AA4BA,SAAgB,cAAc,GAAe,GAAe;AAC1D,QACE,OAAO,GAAG,GAAG,OAAO,GAAG,MAAM,IAC7B,GAAG,WAAW,GAAG,UACjB,GAAG,WAAW,GAAG;;AAIrB,SAAgB,yBACd,MACA,MACoB;CACpB,MAAM,EAAE,OAAO,sBAAsB,uBACnC,MACA,QAAQ,KAAK,SACd;CACD,MAAM,MAAM,YAAY,KAAK;CAC7B,MAAM,OAAO,cAAc,KAAK;CAChC,MAAM,wBAAQ,IAAI,SAA4B;CAC9C,MAAM,QAAQ,UAAkD;AAC9D,MAAI,MAAM,OAAO,KAAM,QAAO,MAAM,OAAO;AAC3C,MAAI,CAAC,QAAQ,MAAM,QAAQ,KAAK,CAAE,QAAO;EACzC,IAAI,SAAS,MAAM,IAAI,MAAM;AAC7B,MAAI,CAAC,QAAQ;AACX,YAAS,OAAO,OAAO;IACrB,OAAO,SAAS,MAAM,QAAQ,KAAK;IACnC,QAAQ,OAAO,OAAO,EAAE,CAAC;IACzB,QAAQ;IACT,CAAC;AACF,SAAM,IAAI,OAAO,OAAO;;AAE1B,SAAO;;AAET,QAAO;EACL,WAAW,MAAM;EACjB,mBAAmB,KAAK,MAAM,aAAa,CAAC;EAC5C,yBAAyB,KAAK,mBAAmB,CAAC;EAClD,gBAAgB,MAAM,SAAS,KAAK;EACpC,SAAS,OAAO,cACd,MAAM,SAAS,MAAM,OAAO;GAC1B,QAAQ;GACR,OAAO,CAAC;GACR,UAAU,YAAY,UAAU;GACjC,CAAC;EACJ,YAAY,MAAM,KAAK,KAAK;EAC7B;;AAGH,SAAgB,yBACd,OAIA,gBACgC;CAChC,MAAM,QAAQ,MAAM,OAAO,KAAK,SAAS;AACzC,QAAO;EACL,GAAI,OAAO,OAAO,OAAO,eAAe,GACpC,EAAE,cAAc,MAAM,cAAc,GACpC,EAAE;EACN,UAAU,MAAM;EAChB,WAAW,MAAM;EACjB,MAAM,MAAM;EACZ,SAAS,MAAM;EACf,OACE,MAAM,cAAc,CAAC,OAAO,MAAM,SAAS,KAAK,SAAS,GACrD,CAAC,EAAE,UAAU,MAAM,EAAE,GAAI,SAAS,EAAE,CAAE,GACtC;EACN,UAAU,MAAM;EAChB,iBAAiB,MAAM;EACvB,iBAAiB,MAAM,mBAAmB,kBAAkB;EAC5D,aAAa,MAAM;EACpB"}
+{"version":3,"file":"field-binding.js","names":["getControllerInternals","getFieldKey","hasPath","normalizePath","readPath","ReactNode","FieldCoreProps","ValidateTrigger","FormController","ModernFormState","FieldState","RegistrationOptions","RegistrationToken","FormPath","FieldView","Pick","FieldBackendHandle","subscribe","listener","getSnapshot","getServerSnapshot","register","change","value","dontTouch","trigger","blur","sameFieldView","a","b","Object","is","errors","status","createModernFieldBackend","form","name","store","key","path","views","WeakMap","view","state","fields","values","undefined","cached","get","freeze","set","setValue","source","touch","validate","fieldRegistrationOptions","props","defaultValue","validateTrigger","defaultTrigger","rules","flat","Infinity","hasOwn","preserve","dependsOn","deps","isEqual","isRequired","some","rule","required","rulesKey","validationDelay","errorPolicy"],"sources":["../../../../../src/components/form/Form/modern/field-binding.ts"],"sourcesContent":["import { getControllerInternals } from './controller';\nimport { getFieldKey, hasPath, normalizePath, readPath } from './values';\n\nimport type { ReactNode } from 'react';\nimport type { FieldCoreProps, ValidateTrigger } from '../../../../shared/form';\nimport type { FormController, ModernFormState } from './controller';\nimport type {\n  FieldState,\n  RegistrationOptions,\n  RegistrationToken,\n} from './types';\nimport type { FormPath } from './values';\n\n/** The only state a bound input renders; metadata stays in selector subscribers. */\nexport type FieldView = Pick<\n  FieldState<ReactNode>,\n  'value' | 'errors' | 'status'\n>;\n\nexport interface FieldBackendHandle {\n  subscribe(listener: () => void): () => void;\n  getSnapshot(): FieldView | undefined;\n  getServerSnapshot(): FieldView | undefined;\n  register(): RegistrationToken<ReactNode> | undefined;\n  change(value: unknown, dontTouch: boolean, trigger: ValidateTrigger): void;\n  blur(): void;\n}\n\nexport function sameFieldView(a?: FieldView, b?: FieldView) {\n  return (\n    Object.is(a?.value, b?.value) &&\n    a?.errors === b?.errors &&\n    a?.status === b?.status\n  );\n}\n\nexport function createModernFieldBackend(\n  form: FormController<any>,\n  name: FormPath,\n): FieldBackendHandle {\n  const { store, getServerSnapshot } = getControllerInternals(\n    form,\n    `The \"${name}\" field`,\n  );\n  const key = getFieldKey(name);\n  const path = normalizePath(name);\n  const views = new WeakMap<object, FieldView>();\n  const view = (state: ModernFormState): FieldView | undefined => {\n    if (state.fields[key]) return state.fields[key];\n    if (!hasPath(state.values, path)) return undefined;\n    let cached = views.get(state);\n    if (!cached) {\n      cached = Object.freeze({\n        value: readPath(state.values, path),\n        errors: Object.freeze([]),\n        status: 'unvalidated',\n      });\n      views.set(state, cached);\n    }\n    return cached;\n  };\n  return {\n    subscribe: store.subscribe,\n    getSnapshot: () => view(store.getSnapshot()),\n    getServerSnapshot: () => view(getServerSnapshot()),\n    register: () => store.register(name),\n    change: (value, dontTouch) =>\n      store.setValue(name, value, {\n        source: 'user',\n        touch: !dontTouch,\n        validate: dontTouch ? 'never' : 'auto',\n      }),\n    blur: () => store.blur(name),\n  };\n}\n\nexport function fieldRegistrationOptions(\n  props: FieldCoreProps & {\n    defaultValue?: unknown;\n    validateTrigger?: ValidateTrigger;\n  },\n  defaultTrigger?: ValidateTrigger,\n): RegistrationOptions<ReactNode> {\n  const rules = props.rules?.flat(Infinity);\n  return {\n    ...(Object.hasOwn(props, 'defaultValue')\n      ? { defaultValue: props.defaultValue }\n      : {}),\n    preserve: props.preserve,\n    dependsOn: props.dependsOn,\n    deps: props.deps,\n    isEqual: props.isEqual,\n    rules:\n      props.isRequired && !rules?.some((rule) => rule.required)\n        ? [{ required: true }, ...(rules ?? [])]\n        : rules,\n    rulesKey: props.rulesKey,\n    validationDelay: props.validationDelay,\n    validateTrigger: props.validateTrigger ?? defaultTrigger ?? 'onBlur',\n    errorPolicy: props.errorPolicy,\n  };\n}\n"],"mappings":";;;;;AA4BA,SAAgB2B,cAAcC,GAAeC,GAAe;AAC1D,QACEC,OAAOC,GAAGH,GAAGL,OAAOM,GAAGN,MAAM,IAC7BK,GAAGI,WAAWH,GAAGG,UACjBJ,GAAGK,WAAWJ,GAAGI;;AAIrB,SAAgBC,yBACdC,MACAC,MACoB;CACpB,MAAM,EAAEC,OAAOjB,sBAAsBpB,uBACnCmC,MACA,QAAQC,KAAI,SACb;CACD,MAAME,MAAMrC,YAAYmC,KAAK;CAC7B,MAAMG,OAAOpC,cAAciC,KAAK;CAChC,MAAMI,wBAAQ,IAAIC,SAA4B;CAC9C,MAAMC,QAAQC,UAAkD;AAC9D,MAAIA,MAAMC,OAAON,KAAM,QAAOK,MAAMC,OAAON;AAC3C,MAAI,CAACpC,QAAQyC,MAAME,QAAQN,KAAK,CAAE,QAAOO;EACzC,IAAIC,SAASP,MAAMQ,IAAIL,MAAM;AAC7B,MAAI,CAACI,QAAQ;AACXA,YAASjB,OAAOmB,OAAO;IACrB1B,OAAOnB,SAASuC,MAAME,QAAQN,KAAK;IACnCP,QAAQF,OAAOmB,OAAO,EAAE,CAAC;IACzBhB,QAAQ;IACT,CAAC;AACFO,SAAMU,IAAIP,OAAOI,OAAO;;AAE1B,SAAOA;;AAET,QAAO;EACL9B,WAAWoB,MAAMpB;EACjBE,mBAAmBuB,KAAKL,MAAMlB,aAAa,CAAC;EAC5CC,yBAAyBsB,KAAKtB,mBAAmB,CAAC;EAClDC,gBAAgBgB,MAAMhB,SAASe,KAAK;EACpCd,SAASC,OAAOC,cACda,MAAMc,SAASf,MAAMb,OAAO;GAC1B6B,QAAQ;GACRC,OAAO,CAAC7B;GACR8B,UAAU9B,YAAY,UAAU;GACjC,CAAC;EACJE,YAAYW,MAAMX,KAAKU,KAAI;EAC5B;;AAGH,SAAgBmB,yBACdC,OAIAG,gBACgC;CAChC,MAAMC,QAAQJ,MAAMI,OAAOC,KAAKC,SAAS;AACzC,QAAO;EACL,GAAIhC,OAAOiC,OAAOP,OAAO,eAAe,GACpC,EAAEC,cAAcD,MAAMC,cAAc,GACpC,EAAE;EACNO,UAAUR,MAAMQ;EAChBC,WAAWT,MAAMS;EACjBC,MAAMV,MAAMU;EACZC,SAASX,MAAMW;EACfP,OACEJ,MAAMY,cAAc,CAACR,OAAOS,MAAMC,SAASA,KAAKC,SAAS,GACrD,CAAC,EAAEA,UAAU,MAAM,EAAE,GAAIX,SAAS,EAAE,CAAE,GACtCA;EACNY,UAAUhB,MAAMgB;EAChBC,iBAAiBjB,MAAMiB;EACvBf,iBAAiBF,MAAME,mBAAmBC,kBAAkB;EAC5De,aAAalB,MAAMkB;EACpB"}

package/dist/components/form/Form/modern/field.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.181.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { normalizePath } from "./values.js";
 
 //#region src/components/form/Form/modern/field.ts

package/dist/components/form/Form/modern/field.js.map

@@ -1 +1 @@
-{"version":3,"file":"field.js","names":[],"sources":["../../../../../src/components/form/Form/modern/field.ts"],"sourcesContent":["import { normalizePath } from './values';\n\nimport type { ReactNode } from 'react';\nimport type { FormController } from './controller';\nimport type { CheckedFormPath, FormValueAtPath } from './path-types';\nimport type { FormReadValue, FormValues } from './read-types';\nimport type { RegistrationOptions } from './types';\nimport type { FormPath } from './values';\n\ndeclare const FIELD_VALUE: unique symbol;\n\n/** Pure configuration, never a mutable/reactive field instance. */\nexport interface FormField<Value = unknown> {\n  readonly [FIELD_VALUE]: Value;\n  readonly form: FormController<any>;\n  readonly path: FormPath;\n  readonly options: RegistrationOptions<ReactNode>;\n}\n\nexport interface FormFieldContext<T extends object> {\n  readonly signal: AbortSignal;\n  getValue<const Path extends FormPath>(\n    path: CheckedFormPath<T, Path>,\n  ): FormReadValue<FormValueAtPath<T, Path>> | undefined;\n  getValues(): FormValues<T>;\n}\n\nexport interface FormFieldOptions<T extends object, Value>\n  extends Omit<RegistrationOptions<ReactNode>, 'defaultValue' | 'isEqual'> {\n  readonly validate?: (\n    value: FormReadValue<Value> | undefined,\n    context: FormFieldContext<T>,\n  ) => ReactNode | void | Promise<ReactNode | void>;\n  readonly defaultValue?: Value;\n  readonly isEqual?: (\n    previous: FormReadValue<Value> | undefined,\n    next: FormReadValue<Value> | undefined,\n  ) => boolean;\n}\n\nexport function createFormField<T extends object, Value>(\n  form: FormController<T>,\n  path: FormPath,\n  options: FormFieldOptions<T, Value> = {},\n): FormField<Value> {\n  const { validate, ...registration } = options;\n  const normalized = normalizePath(path);\n  return Object.freeze({\n    form,\n    path: typeof path === 'string' ? path : normalized,\n    options: Object.freeze({\n      ...registration,\n      ...(validate && {\n        rules: [\n          ...(registration.rules ?? []),\n          {\n            // The adapter has fixed source. Retain the authored function for\n            // lazy rule comparison, without changing the consumer's deps.\n            authored: validate,\n            validator: (_rule, value, context) =>\n              validate(value, context as FormFieldContext<T>),\n          },\n        ],\n      }),\n    }),\n  }) as FormField<Value>;\n}\n"],"mappings":";;;;AAwCA,SAAgB,gBACd,MACA,MACA,UAAsC,EAAE,EACtB;CAClB,MAAM,EAAE,UAAU,GAAG,iBAAiB;CACtC,MAAM,aAAa,cAAc,KAAK;AACtC,QAAO,OAAO,OAAO;EACnB;EACA,MAAM,OAAO,SAAS,WAAW,OAAO;EACxC,SAAS,OAAO,OAAO;GACrB,GAAG;GACH,GAAI,YAAY,EACd,OAAO,CACL,GAAI,aAAa,SAAS,EAAE,EAC5B;IAGE,UAAU;IACV,YAAY,OAAO,OAAO,YACxB,SAAS,OAAO,QAA+B;IAClD,CACF,EACF;GACF,CAAC;EACH,CAAC"}
+{"version":3,"file":"field.js","names":["normalizePath","ReactNode","FormController","CheckedFormPath","FormValueAtPath","FormReadValue","FormValues","RegistrationOptions","FormPath","FIELD_VALUE","FormField","Value","form","path","options","FormFieldContext","signal","AbortSignal","getValue","T","Path","getValues","FormFieldOptions","Omit","validate","value","context","Promise","defaultValue","isEqual","previous","next","createFormField","registration","normalized","Object","freeze","rules","authored","validator","_rule"],"sources":["../../../../../src/components/form/Form/modern/field.ts"],"sourcesContent":["import { normalizePath } from './values';\n\nimport type { ReactNode } from 'react';\nimport type { FormController } from './controller';\nimport type { CheckedFormPath, FormValueAtPath } from './path-types';\nimport type { FormReadValue, FormValues } from './read-types';\nimport type { RegistrationOptions } from './types';\nimport type { FormPath } from './values';\n\ndeclare const FIELD_VALUE: unique symbol;\n\n/** Pure configuration, never a mutable/reactive field instance. */\nexport interface FormField<Value = unknown> {\n  readonly [FIELD_VALUE]: Value;\n  readonly form: FormController<any>;\n  readonly path: FormPath;\n  readonly options: RegistrationOptions<ReactNode>;\n}\n\nexport interface FormFieldContext<T extends object> {\n  readonly signal: AbortSignal;\n  getValue<const Path extends FormPath>(\n    path: CheckedFormPath<T, Path>,\n  ): FormReadValue<FormValueAtPath<T, Path>> | undefined;\n  getValues(): FormValues<T>;\n}\n\nexport interface FormFieldOptions<T extends object, Value>\n  extends Omit<RegistrationOptions<ReactNode>, 'defaultValue' | 'isEqual'> {\n  readonly validate?: (\n    value: FormReadValue<Value> | undefined,\n    context: FormFieldContext<T>,\n  ) => ReactNode | void | Promise<ReactNode | void>;\n  readonly defaultValue?: Value;\n  readonly isEqual?: (\n    previous: FormReadValue<Value> | undefined,\n    next: FormReadValue<Value> | undefined,\n  ) => boolean;\n}\n\nexport function createFormField<T extends object, Value>(\n  form: FormController<T>,\n  path: FormPath,\n  options: FormFieldOptions<T, Value> = {},\n): FormField<Value> {\n  const { validate, ...registration } = options;\n  const normalized = normalizePath(path);\n  return Object.freeze({\n    form,\n    path: typeof path === 'string' ? path : normalized,\n    options: Object.freeze({\n      ...registration,\n      ...(validate && {\n        rules: [\n          ...(registration.rules ?? []),\n          {\n            // The adapter has fixed source. Retain the authored function for\n            // lazy rule comparison, without changing the consumer's deps.\n            authored: validate,\n            validator: (_rule, value, context) =>\n              validate(value, context as FormFieldContext<T>),\n          },\n        ],\n      }),\n    }),\n  }) as FormField<Value>;\n}\n"],"mappings":";;;;AAwCA,SAAgBgC,gBACdpB,MACAC,MACAC,UAAsC,EAAE,EACtB;CAClB,MAAM,EAAEU,UAAU,GAAGS,iBAAiBnB;CACtC,MAAMoB,aAAalC,cAAca,KAAK;AACtC,QAAOsB,OAAOC,OAAO;EACnBxB;EACAC,MAAM,OAAOA,SAAS,WAAWA,OAAOqB;EACxCpB,SAASqB,OAAOC,OAAO;GACrB,GAAGH;GACH,GAAIT,YAAY,EACda,OAAO,CACL,GAAIJ,aAAaI,SAAS,EAAE,EAC5B;IAGEC,UAAUd;IACVe,YAAYC,OAAOf,OAAOC,YACxBF,SAASC,OAAOC,QAA8B;IACjD,CAAA,EAEJ;GACF,CAAA;EACF,CAAC"}

package/dist/components/form/Form/modern/react.js

@@ -1,43 +1,126 @@
-/** @license MIT | @cube-dev/ui-kit v0.181.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../../utils/react/useLayoutEffect.js";
 import { ModernControllerContext } from "./context.js";
 import { getFieldKey, normalizePath, readPath } from "./values.js";
 import { createFormController, getControllerInternals } from "./controller.js";
-import { useContext, useMemo, useState } from "react";
+import { c } from "react-compiler-runtime";
+import { useContext, useState } from "react";
 import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
 import { useSyncExternalStoreWithSelector } from "use-sync-external-store/with-selector.js";
 
 //#region src/components/form/Form/modern/react.tsx
 function useFormController(options) {
-	const [controller] = useState(() => createFormController(options));
-	const { store } = getControllerInternals(controller, "Form.useController()");
-	useLayoutEffect$1(() => {
-		store.updateCallbacks({
-			onSubmit: options?.onSubmit,
-			onSubmitFailed: options?.onSubmitFailed,
-			onValuesChange: options?.onValuesChange
-		});
-	});
+	const $ = c(9);
+	let t0;
+	if ($[0] !== options) {
+		t0 = () => createFormController(options);
+		$[0] = options;
+		$[1] = t0;
+	} else t0 = $[1];
+	const [controller] = useState(t0);
+	let t1;
+	if ($[2] !== controller) {
+		t1 = getControllerInternals(controller, "Form.useController()");
+		$[2] = controller;
+		$[3] = t1;
+	} else t1 = $[3];
+	const { store } = t1;
+	let t2;
+	if ($[4] !== options?.onSubmit || $[5] !== options?.onSubmitFailed || $[6] !== options?.onValuesChange || $[7] !== store) {
+		t2 = () => {
+			store.updateCallbacks({
+				onSubmit: options?.onSubmit,
+				onSubmitFailed: options?.onSubmitFailed,
+				onValuesChange: options?.onValuesChange
+			});
+		};
+		$[4] = options?.onSubmit;
+		$[5] = options?.onSubmitFailed;
+		$[6] = options?.onValuesChange;
+		$[7] = store;
+		$[8] = t2;
+	} else t2 = $[8];
+	useLayoutEffect$1(t2);
 	return controller;
 }
 function useFormValue(form, path) {
-	const normalized = useMemo(() => normalizePath(path), [path]);
-	return useFormSelector(form, (state) => readPath(state.values, normalized));
+	const $ = c(4);
+	let t0;
+	if ($[0] !== path) {
+		t0 = normalizePath(path);
+		$[0] = path;
+		$[1] = t0;
+	} else t0 = $[1];
+	const normalized = t0;
+	let t1;
+	if ($[2] !== normalized) {
+		t1 = (state) => readPath(state.values, normalized);
+		$[2] = normalized;
+		$[3] = t1;
+	} else t1 = $[3];
+	return useFormSelector(form, t1);
 }
 function useFormFieldState(form, path) {
-	const key = useMemo(() => getFieldKey(path), [path]);
-	return useFormSelector(form, (state) => state.fields[key]);
+	const $ = c(4);
+	let t0;
+	if ($[0] !== path) {
+		t0 = getFieldKey(path);
+		$[0] = path;
+		$[1] = t0;
+	} else t0 = $[1];
+	const key = t0;
+	let t1;
+	if ($[2] !== key) {
+		t1 = (state) => state.fields[key];
+		$[2] = key;
+		$[3] = t1;
+	} else t1 = $[3];
+	return useFormSelector(form, t1);
 }
 function useFormSelector(controller, selector, options) {
-	const { getServerSnapshot } = getControllerInternals(controller, "Form.useSelector()");
+	const $ = c(2);
+	let t0;
+	if ($[0] !== controller) {
+		t0 = getControllerInternals(controller, "Form.useSelector()");
+		$[0] = controller;
+		$[1] = t0;
+	} else t0 = $[1];
+	const { getServerSnapshot } = t0;
 	return useSyncExternalStoreWithSelector(controller.subscribe, controller.getSnapshot, getServerSnapshot, selector, options?.isEqual);
 }
 function FormSubscribe(props) {
+	const $ = c(10);
 	const fromContext = useContext(ModernControllerContext);
-	const controller = Object.hasOwn(props, "form") ? props.form : fromContext;
+	let t0;
+	if ($[0] !== fromContext || $[1] !== props) {
+		t0 = Object.hasOwn(props, "form") ? props.form : fromContext;
+		$[0] = fromContext;
+		$[1] = props;
+		$[2] = t0;
+	} else t0 = $[2];
+	const controller = t0;
 	if (!controller) throw new Error("<Form.Subscribe> requires a modern form prop or a modern <Form> root.");
-	const selected = useFormSelector(controller, props.selector, { isEqual: props.isEqual });
-	return /* @__PURE__ */ jsx(Fragment$1, { children: props.children(selected) });
+	let t1;
+	if ($[3] !== props.isEqual) {
+		t1 = { isEqual: props.isEqual };
+		$[3] = props.isEqual;
+		$[4] = t1;
+	} else t1 = $[4];
+	const selected = useFormSelector(controller, props.selector, t1);
+	let t2;
+	if ($[5] !== props.children || $[6] !== selected) {
+		t2 = props.children(selected);
+		$[5] = props.children;
+		$[6] = selected;
+		$[7] = t2;
+	} else t2 = $[7];
+	let t3;
+	if ($[8] !== t2) {
+		t3 = /* @__PURE__ */ jsx(Fragment$1, { children: t2 });
+		$[8] = t2;
+		$[9] = t3;
+	} else t3 = $[9];
+	return t3;
 }
 
 //#endregion

package/dist/components/form/Form/modern/react.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.js","names":[],"sources":["../../../../../src/components/form/Form/modern/react.tsx"],"sourcesContent":["import { useContext, useMemo, useState } from 'react';\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js';\n\nimport { useLayoutEffect } from '../../../../utils/react/useLayoutEffect';\n\nimport { ModernControllerContext } from './context';\nimport { createFormController, getControllerInternals } from './controller';\nimport { getFieldKey, normalizePath, readPath } from './values';\n\nimport type { ReactNode } from 'react';\nimport type {\n  FormController,\n  ModernFieldState,\n  ModernFormState,\n  UseFormControllerOptions,\n} from './controller';\nimport type { CheckedFormPath, FormValueAtPath } from './path-types';\nimport type { FormReadValue } from './read-types';\nimport type { FormPath } from './values';\n\nexport function useFormController<T extends object = Record<string, unknown>>(\n  options?: UseFormControllerOptions<T>,\n): FormController<T> {\n  // Initial options seed synchronously. A new options object never resets the\n  // controller, and the creator does not subscribe its owner to form changes.\n  const [controller] = useState(() => createFormController(options));\n  const { store } = getControllerInternals(controller, 'Form.useController()');\n  // Intentionally commit after every render: callbacks are live, unlike the\n  // initial defaults/policy. Abandoned renders must never replace callbacks.\n  useLayoutEffect(() => {\n    store.updateCallbacks({\n      onSubmit: options?.onSubmit,\n      onSubmitFailed: options?.onSubmitFailed,\n      onValuesChange: options?.onValuesChange,\n    });\n  });\n  // Do not dispose from effect cleanup: Strict Mode and hidden React trees\n  // reconnect effects while preserving state. Subscriptions own their cleanup;\n  // the controller has no external resources and is collected with its owner.\n  return controller;\n}\n\nexport function useFormValue<T extends object, const Path extends FormPath>(\n  form: FormController<T>,\n  path: CheckedFormPath<T, Path>,\n): FormReadValue<FormValueAtPath<T, Path>> | undefined {\n  const normalized = useMemo(() => normalizePath(path), [path]);\n  return useFormSelector(form, (state) =>\n    readPath(state.values, normalized),\n  ) as FormReadValue<FormValueAtPath<T, Path>> | undefined;\n}\n\nexport function useFormFieldState<\n  T extends object,\n  const Path extends FormPath,\n>(\n  form: FormController<T>,\n  path: CheckedFormPath<T, Path>,\n): ModernFieldState<FormValueAtPath<T, Path>> | undefined {\n  const key = useMemo(() => getFieldKey(path), [path]);\n  return useFormSelector(form, (state) => state.fields[key]) as\n    | ModernFieldState<FormValueAtPath<T, Path>>\n    | undefined;\n}\n\nexport interface FormSelectorOptions<Selected> {\n  isEqual?: (previous: Selected, next: Selected) => boolean;\n}\n\nexport function useFormSelector<T extends object, Selected>(\n  controller: FormController<T>,\n  selector: (state: ModernFormState<T>) => Selected,\n  options?: FormSelectorOptions<Selected>,\n): Selected {\n  const { getServerSnapshot } = getControllerInternals(\n    controller,\n    'Form.useSelector()',\n  );\n  return useSyncExternalStoreWithSelector(\n    controller.subscribe,\n    controller.getSnapshot,\n    getServerSnapshot,\n    selector,\n    options?.isEqual,\n  );\n}\n\nexport interface FormSubscribeProps<T extends object, Selected>\n  extends FormSelectorOptions<Selected> {\n  /** Omit to use modern context. An explicit undefined detaches from context. */\n  form?: FormController<T>;\n  selector: (state: ModernFormState<T>) => Selected;\n  children: (selected: Selected) => ReactNode;\n}\n\nexport function FormSubscribe<\n  T extends object = Record<string, unknown>,\n  Selected = unknown,\n>(props: FormSubscribeProps<T, Selected>) {\n  const fromContext = useContext(ModernControllerContext);\n  const controller = Object.hasOwn(props, 'form') ? props.form : fromContext;\n  if (!controller) {\n    throw new Error(\n      '<Form.Subscribe> requires a modern form prop or a modern <Form> root.',\n    );\n  }\n  const selected = useFormSelector(controller, props.selector, {\n    isEqual: props.isEqual,\n  });\n  return <>{props.children(selected)}</>;\n}\n"],"mappings":";;;;;;;;;;AAoBA,SAAgB,kBACd,SACmB;CAGnB,MAAM,CAAC,cAAc,eAAe,qBAAqB,QAAQ,CAAC;CAClE,MAAM,EAAE,UAAU,uBAAuB,YAAY,uBAAuB;AAG5E,yBAAsB;AACpB,QAAM,gBAAgB;GACpB,UAAU,SAAS;GACnB,gBAAgB,SAAS;GACzB,gBAAgB,SAAS;GAC1B,CAAC;GACF;AAIF,QAAO;;AAGT,SAAgB,aACd,MACA,MACqD;CACrD,MAAM,aAAa,cAAc,cAAc,KAAK,EAAE,CAAC,KAAK,CAAC;AAC7D,QAAO,gBAAgB,OAAO,UAC5B,SAAS,MAAM,QAAQ,WAAW,CACnC;;AAGH,SAAgB,kBAId,MACA,MACwD;CACxD,MAAM,MAAM,cAAc,YAAY,KAAK,EAAE,CAAC,KAAK,CAAC;AACpD,QAAO,gBAAgB,OAAO,UAAU,MAAM,OAAO,KAAK;;AAS5D,SAAgB,gBACd,YACA,UACA,SACU;CACV,MAAM,EAAE,sBAAsB,uBAC5B,YACA,qBACD;AACD,QAAO,iCACL,WAAW,WACX,WAAW,aACX,mBACA,UACA,SAAS,QACV;;AAWH,SAAgB,cAGd,OAAwC;CACxC,MAAM,cAAc,WAAW,wBAAwB;CACvD,MAAM,aAAa,OAAO,OAAO,OAAO,OAAO,GAAG,MAAM,OAAO;AAC/D,KAAI,CAAC,WACH,OAAM,IAAI,MACR,wEACD;CAEH,MAAM,WAAW,gBAAgB,YAAY,MAAM,UAAU,EAC3D,SAAS,MAAM,SAChB,CAAC;AACF,QAAO,4CAAG,MAAM,SAAS,SAAS,GAAI"}
+{"version":3,"file":"react.js","names":["useContext","useMemo","useState","useSyncExternalStoreWithSelector","useLayoutEffect","ModernControllerContext","createFormController","getControllerInternals","getFieldKey","normalizePath","readPath","ReactNode","FormController","ModernFieldState","ModernFormState","UseFormControllerOptions","CheckedFormPath","FormValueAtPath","FormReadValue","FormPath","useFormController","options","$","_c","t0","controller","t1","store","t2","onSubmit","onSubmitFailed","onValuesChange","updateCallbacks","useFormValue","form","path","normalized","state","values","useFormSelector","T","Path","useFormFieldState","key","fields","FormSelectorOptions","isEqual","previous","Selected","next","selector","getServerSnapshot","subscribe","getSnapshot","FormSubscribeProps","children","selected","FormSubscribe","props","fromContext","Object","hasOwn","Error","t3"],"sources":["../../../../../src/components/form/Form/modern/react.tsx"],"sourcesContent":["import { useContext, useMemo, useState } from 'react';\nimport { useSyncExternalStoreWithSelector } from 'use-sync-external-store/with-selector.js';\n\nimport { useLayoutEffect } from '../../../../utils/react/useLayoutEffect';\n\nimport { ModernControllerContext } from './context';\nimport { createFormController, getControllerInternals } from './controller';\nimport { getFieldKey, normalizePath, readPath } from './values';\n\nimport type { ReactNode } from 'react';\nimport type {\n  FormController,\n  ModernFieldState,\n  ModernFormState,\n  UseFormControllerOptions,\n} from './controller';\nimport type { CheckedFormPath, FormValueAtPath } from './path-types';\nimport type { FormReadValue } from './read-types';\nimport type { FormPath } from './values';\n\nexport function useFormController<T extends object = Record<string, unknown>>(\n  options?: UseFormControllerOptions<T>,\n): FormController<T> {\n  // Initial options seed synchronously. A new options object never resets the\n  // controller, and the creator does not subscribe its owner to form changes.\n  const [controller] = useState(() => createFormController(options));\n  const { store } = getControllerInternals(controller, 'Form.useController()');\n  // Intentionally commit after every render: callbacks are live, unlike the\n  // initial defaults/policy. Abandoned renders must never replace callbacks.\n  useLayoutEffect(() => {\n    store.updateCallbacks({\n      onSubmit: options?.onSubmit,\n      onSubmitFailed: options?.onSubmitFailed,\n      onValuesChange: options?.onValuesChange,\n    });\n  });\n  // Do not dispose from effect cleanup: Strict Mode and hidden React trees\n  // reconnect effects while preserving state. Subscriptions own their cleanup;\n  // the controller has no external resources and is collected with its owner.\n  return controller;\n}\n\nexport function useFormValue<T extends object, const Path extends FormPath>(\n  form: FormController<T>,\n  path: CheckedFormPath<T, Path>,\n): FormReadValue<FormValueAtPath<T, Path>> | undefined {\n  const normalized = useMemo(() => normalizePath(path), [path]);\n  return useFormSelector(form, (state) =>\n    readPath(state.values, normalized),\n  ) as FormReadValue<FormValueAtPath<T, Path>> | undefined;\n}\n\nexport function useFormFieldState<\n  T extends object,\n  const Path extends FormPath,\n>(\n  form: FormController<T>,\n  path: CheckedFormPath<T, Path>,\n): ModernFieldState<FormValueAtPath<T, Path>> | undefined {\n  const key = useMemo(() => getFieldKey(path), [path]);\n  return useFormSelector(form, (state) => state.fields[key]) as\n    | ModernFieldState<FormValueAtPath<T, Path>>\n    | undefined;\n}\n\nexport interface FormSelectorOptions<Selected> {\n  isEqual?: (previous: Selected, next: Selected) => boolean;\n}\n\nexport function useFormSelector<T extends object, Selected>(\n  controller: FormController<T>,\n  selector: (state: ModernFormState<T>) => Selected,\n  options?: FormSelectorOptions<Selected>,\n): Selected {\n  const { getServerSnapshot } = getControllerInternals(\n    controller,\n    'Form.useSelector()',\n  );\n  return useSyncExternalStoreWithSelector(\n    controller.subscribe,\n    controller.getSnapshot,\n    getServerSnapshot,\n    selector,\n    options?.isEqual,\n  );\n}\n\nexport interface FormSubscribeProps<T extends object, Selected>\n  extends FormSelectorOptions<Selected> {\n  /** Omit to use modern context. An explicit undefined detaches from context. */\n  form?: FormController<T>;\n  selector: (state: ModernFormState<T>) => Selected;\n  children: (selected: Selected) => ReactNode;\n}\n\nexport function FormSubscribe<\n  T extends object = Record<string, unknown>,\n  Selected = unknown,\n>(props: FormSubscribeProps<T, Selected>) {\n  const fromContext = useContext(ModernControllerContext);\n  const controller = Object.hasOwn(props, 'form') ? props.form : fromContext;\n  if (!controller) {\n    throw new Error(\n      '<Form.Subscribe> requires a modern form prop or a modern <Form> root.',\n    );\n  }\n  const selected = useFormSelector(controller, props.selector, {\n    isEqual: props.isEqual,\n  });\n  return <>{props.children(selected)}</>;\n}\n"],"mappings":"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"}

package/dist/components/form/Form/modern/store.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.181.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { FORM_BACKEND } from "../backend.js";
 import { createValueSnapshotter, defineValue, formValueEqual, freezeContainer, getFieldKey, hasPath, isPlainObject, normalizePath, pathValueChanged, readPath, readonlySet, sameMembers, writePath } from "./values.js";
 import { rulesSignature, runRules } from "./validation.js";
@@ -659,10 +659,13 @@ function createFormStore(inputOptions = {}) {
 			submission = void 0;
 		});
 	}
-	function bindCallbacks(callbacks) {
+	function bindCallbacks(callbacks, onSubmitted) {
 		assertLive();
 		if (binding) developmentError("A second Form root owns this controller; the newest callback binding wins.");
-		const own = { callbacks: { ...callbacks } };
+		const own = {
+			callbacks: { ...callbacks },
+			onSubmitted
+		};
 		binding = own;
 		let released = false;
 		return Object.freeze({
@@ -712,6 +715,7 @@ function createFormStore(inputOptions = {}) {
 					finish({ status: "stale" });
 					return;
 				}
+				const owner = binding;
 				const callbacks = resolveCallbacks();
 				let result;
 				if (!validation.isValid) {
@@ -761,6 +765,11 @@ function createFormStore(inputOptions = {}) {
 				if (!settled) {
 					token.complete(result.status === "failed" ? { error: result.error } : void 0);
 					finish(result);
+					if (result.status === "submitted" && binding === owner) try {
+						owner?.onSubmitted?.();
+					} catch (error) {
+						report(error);
+					}
 				}
 			};
 			run().catch((error) => {
@@ -825,6 +834,7 @@ function createFormStore(inputOptions = {}) {
 		validate,
 		submit,
 		bindCallbacks,
+		cancelSubmission,
 		updateCallbacks(callbacks) {
 			options.onSubmit = callbacks.onSubmit;
 			options.onSubmitFailed = callbacks.onSubmitFailed;