@strictly/react-form 0.0.5 → 0.0.7

package/dist/index.cjs

@@ -45,7 +45,8 @@ __export(index_exports, {
   mergeValidators: () => mergeValidators,
   prototypingFieldValueFactory: () => prototypingFieldValueFactory,
   subFormFieldAdapters: () => subFormFieldAdapters,
-  useMantineForm: () => useMantineForm,
+  useDefaultMobxFormHooks: () => useDefaultMobxFormHooks,
+  useMantineFormFields: () => useMantineFormFields,
   usePartialComponent: () => usePartialComponent,
   usePartialObserverComponent: () => usePartialObserverComponent,
   validatingConverter: () => validatingConverter
@@ -687,6 +688,59 @@ var FormModel = class {
   }
 };
 
+// core/mobx/hooks.ts
+var import_react = require("react");
+function useDefaultMobxFormHooks(presenter, value, onValidSubmit) {
+  const model = (0, import_react.useMemo)(function() {
+    return presenter.createModel(value);
+  }, [
+    presenter,
+    value
+  ]);
+  const onFieldValueChange = (0, import_react.useCallback)(
+    function(path, value2) {
+      presenter.clearFieldError(model, path);
+      presenter.setFieldValue(model, path, value2);
+    },
+    [
+      presenter,
+      model
+    ]
+  );
+  const onFieldSubmit = (0, import_react.useCallback)(
+    function(valuePath) {
+      if (presenter.validateField(model, valuePath)) {
+        onValidSubmit?.(model, valuePath);
+      }
+      return false;
+    },
+    [
+      presenter,
+      model,
+      onValidSubmit
+    ]
+  );
+  const onFieldBlur = (0, import_react.useCallback)(
+    function(path) {
+      setTimeout(function() {
+        if (presenter.isValuePathActive(model, path)) {
+          presenter.validateField(model, path);
+        }
+      }, 100);
+    },
+    [
+      presenter,
+      model
+    ]
+  );
+  return {
+    model,
+    onFieldValueChange,
+    onFieldSubmit,
+    onFieldBlur
+  };
+}
+
 // core/mobx/merge_field_adapters_with_two_way_converter.ts
 var import_base3 = require("@strictly/base");
 function mergeFieldAdaptersWithTwoWayConverter(fieldAdapters, converter) {
@@ -763,13 +817,33 @@ function mergeAdaptersWithValidators(adapters, validators) {
 }
 
 // core/mobx/sub_form_field_adapters.ts
-function subFormFieldAdapters(subAdapters, prefix) {
+var import_define3 = require("@strictly/define");
+function subFormFieldAdapters(subAdapters, prefix, contextType) {
+  function getSubValuePathAndContext(valuePath, context) {
+    const subValuePath = valuePath.replace(prefix, "$");
+    const subContext = (0, import_define3.flattenValuesOfType)(contextType, context)[prefix];
+    return [
+      subValuePath,
+      subContext
+    ];
+  }
   return Object.entries(subAdapters).reduce((acc, [
     subKey,
     subValue
   ]) => {
     const key = subKey.replace("$", prefix);
-    acc[key] = subValue;
+    const adaptedAdapter = {
+      convert: (from, valuePath, context) => {
+        return subValue.convert(from, ...getSubValuePathAndContext(valuePath, context));
+      },
+      create: (valuePath, context) => {
+        return subValue.create(...getSubValuePathAndContext(valuePath, context));
+      },
+      revert: subValue.revert && ((from, valuePath, context) => {
+        return subValue.revert(from, ...getSubValuePathAndContext(valuePath, context));
+      })
+    };
+    acc[key] = adaptedAdapter;
     return acc;
   }, {});
 }
@@ -806,7 +880,7 @@ var IntegerToStringConverter = class {
 };
 
 // field_converters/nullable_to_boolean_converter.ts
-var import_define3 = require("@strictly/define");
+var import_define4 = require("@strictly/define");
 var NullableToBooleanConverter = class {
   constructor(typeDef, prototype, nullType, defaultToNull = true) {
     this.typeDef = typeDef;
@@ -824,7 +898,7 @@ var NullableToBooleanConverter = class {
   }
   revert(from) {
     if (from) {
-      const value = (0, import_define3.copy)(this.typeDef, this.prototype);
+      const value = (0, import_define4.copy)(this.typeDef, this.prototype);
       return {
         type: 0 /* Success */,
         value
@@ -842,7 +916,7 @@ var NullableToBooleanConverter = class {
 
 // field_converters/select_value_type_converter.ts
 var import_base5 = require("@strictly/base");
-var import_define4 = require("@strictly/define");
+var import_define5 = require("@strictly/define");
 var AbstractSelectValueTypeConverter = class {
   constructor(typeDef, values, defaultValueKey, noSuchValueError, required) {
     this.typeDef = typeDef;
@@ -860,7 +934,7 @@ var AbstractSelectValueTypeConverter = class {
         value: null
       };
     }
-    const value = prototype == null ? prototype : (0, import_define4.copy)(this.typeDef, prototype);
+    const value = prototype == null ? prototype : (0, import_define5.copy)(this.typeDef, prototype);
     return {
       type: 0 /* Success */,
       value
@@ -953,13 +1027,13 @@ var TrimmingStringConverter = class {
 };
 
 // field_converters/validating_converter.ts
-var import_define5 = require("@strictly/define");
+var import_define6 = require("@strictly/define");
 function validatingConverter(validators = []) {
   return function(value, valuePath, context) {
     return validators.reduce(
       function(acc, validator) {
         if (acc.type === 0 /* Success */) {
-          const error = (0, import_define5.validate)(validator, value, valuePath, context);
+          const error = (0, import_define6.validate)(validator, value, valuePath, context);
           if (error != null) {
             return {
               type: 1 /* Failure */,
@@ -990,14 +1064,14 @@ function DefaultErrorRenderer({
 var import_core = require("@mantine/core");
 var import_base6 = require("@strictly/base");
 var import_mobx2 = require("mobx");
-var import_react2 = require("react");
+var import_react4 = require("react");
 
 // util/partial.tsx
 var import_mobx_react = require("mobx-react");
-var import_react = require("react");
+var import_react2 = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
 function createSimplePartialComponent(Component, curriedProps) {
-  return (0, import_react.forwardRef)(
+  return (0, import_react2.forwardRef)(
     function(exposedProps, ref) {
       const C = Component;
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -1012,7 +1086,7 @@ function createSimplePartialComponent(Component, curriedProps) {
   );
 }
 function createPartialComponent(Component, curriedPropsSource, additionalPropKeys = []) {
-  return (0, import_react.forwardRef)(
+  return (0, import_react2.forwardRef)(
     function(props, ref) {
       const C = Component;
       const [
@@ -1054,7 +1128,7 @@ function createPartialComponent(Component, curriedPropsSource, additionalPropKey
   );
 }
 function usePartialComponent(curriedPropsSource, deps, Component, additionalPropKeys = []) {
-  return (0, import_react.useMemo)(
+  return (0, import_react2.useMemo)(
     function() {
       return createPartialComponent(
         Component,
@@ -1081,7 +1155,7 @@ function createPartialObserverComponent(Component, curriedPropsSource, additiona
 }
 function createUnsafePartialObserverComponent(Component, curriedPropsSource, additionalPropKeys = []) {
   return (0, import_mobx_react.observer)(
-    (0, import_react.forwardRef)(
+    (0, import_react2.forwardRef)(
       function(props, ref) {
         const C = Component;
         const [
@@ -1124,7 +1198,7 @@ function createUnsafePartialObserverComponent(Component, curriedPropsSource, add
   );
 }
 function usePartialObserverComponent(curriedPropsSource, deps, Component, additionalPropKeys = []) {
-  return (0, import_react.useMemo)(
+  return (0, import_react2.useMemo)(
     function() {
       return createPartialObserverComponent(
         Component,
@@ -1191,8 +1265,79 @@ function createCheckbox(valuePath, Checkbox) {
   );
 }
 
-// mantine/create_list.tsx
+// mantine/create_fields_view.tsx
+var import_mobx_react2 = require("mobx-react");
 var import_jsx_runtime3 = require("react/jsx-runtime");
+function createFieldsView(valuePath, FieldsView, observableProps) {
+  function toKey(subKey) {
+    return subKey.replace("$", valuePath);
+  }
+  function toSubKey(key) {
+    return key.replace(valuePath, "$");
+  }
+  function onFieldValueChange(subKey, value) {
+    observableProps.onFieldValueChange(toKey(subKey), value);
+  }
+  function onFieldBlur(subKey) {
+    observableProps.onFieldBlur?.(toKey(subKey));
+  }
+  function onFieldFocus(subKey) {
+    observableProps.onFieldFocus?.(toKey(subKey));
+  }
+  function onFieldSubmit(subKey) {
+    observableProps.onFieldSubmit?.(toKey(subKey));
+  }
+  return (0, import_mobx_react2.observer)(function(props) {
+    const subFields = Object.entries(observableProps.fields).reduce((acc, [
+      fieldKey,
+      fieldValue
+    ]) => {
+      if (fieldKey.startsWith(valuePath)) {
+        acc[toSubKey(fieldKey)] = fieldValue;
+      }
+      return acc;
+    }, {});
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      FieldsView,
+      {
+        // maybe we can do this in a more type safe way
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/consistent-type-assertions
+        ...props,
+        fields: subFields,
+        onFieldBlur,
+        onFieldFocus,
+        onFieldSubmit,
+        onFieldValueChange
+      }
+    );
+  });
+}
+
+// mantine/create_form.tsx
+var import_mobx_react3 = require("mobx-react");
+var import_react3 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function createForm(valuePath, Form, observableProps) {
+  return (0, import_mobx_react3.observer)((props) => {
+    const { value } = observableProps.fields[valuePath];
+    const onValueChange = (0, import_react3.useCallback)((value2) => {
+      observableProps.onFieldValueChange(valuePath, value2);
+    }, []);
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      Form,
+      {
+        // maybe we can do this in a more type safe way
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/consistent-type-assertions
+        ...props,
+        onValueChange,
+        value
+      }
+    );
+  });
+}
+
+// mantine/create_list.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
 function createList(valuePath, List) {
   const propSource = () => {
     const values = [...this.fields[valuePath].value];
@@ -1208,7 +1353,7 @@ function DefaultList({
   listPath,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: values.map(function(value, index) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: values.map(function(value, index) {
     const valuePath = `${listPath}.${index}`;
     return children(valuePath, value, index);
   }) });
@@ -1247,7 +1392,7 @@ function createRadio(valuePath, value, Radio) {
 }
 
 // mantine/create_radio_group.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 function createRadioGroup(valuePath, RadioGroup) {
   const onChange = (value) => {
     this.onFieldValueChange?.(valuePath, value);
@@ -1275,7 +1420,7 @@ function createRadioGroup(valuePath, RadioGroup) {
       name: valuePath,
       value,
       required,
-      error: error && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ErrorRenderer, { error }),
+      error: error && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ErrorRenderer, { error }),
       onChange,
       onFocus,
       onBlur,
@@ -1285,53 +1430,8 @@ function createRadioGroup(valuePath, RadioGroup) {
   return createUnsafePartialObserverComponent(RadioGroup, propSource, ["ErrorRenderer"]);
 }
 
-// mantine/create_sub_form.tsx
-var import_mobx_react2 = require("mobx-react");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-function createSubForm(valuePath, SubForm, observableProps) {
-  function toKey(subKey) {
-    return subKey.replace("$", valuePath);
-  }
-  function toSubKey(key) {
-    return key.replace(valuePath, "$");
-  }
-  function onFieldValueChange(subKey, value) {
-    observableProps.onFieldValueChange(toKey(subKey), value);
-  }
-  function onFieldBlur(subKey) {
-    observableProps.onFieldBlur?.(toKey(subKey));
-  }
-  function onFieldFocus(subKey) {
-    observableProps.onFieldFocus?.(toKey(subKey));
-  }
-  function onFieldSubmit(subKey) {
-    observableProps.onFieldSubmit?.(toKey(subKey));
-  }
-  return (0, import_mobx_react2.observer)(function() {
-    const subFields = Object.entries(observableProps.fields).reduce((acc, [
-      fieldKey,
-      fieldValue
-    ]) => {
-      if (fieldKey.startsWith(valuePath)) {
-        acc[toSubKey(fieldKey)] = fieldValue;
-      }
-      return acc;
-    }, {});
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-      SubForm,
-      {
-        fields: subFields,
-        onFieldBlur,
-        onFieldFocus,
-        onFieldSubmit,
-        onFieldValueChange
-      }
-    );
-  });
-}
-
 // mantine/create_text_input.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function createTextInput(valuePath, TextInput) {
   const onChange = (e) => {
     this.onFieldValueChange?.(valuePath, e.target.value);
@@ -1365,7 +1465,7 @@ function createTextInput(valuePath, TextInput) {
       value,
       disabled: readonly,
       required,
-      error: error && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ErrorRenderer, { error }),
+      error: error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorRenderer, { error }),
       onChange,
       onFocus,
       onBlur,
@@ -1380,7 +1480,7 @@ function createTextInput(valuePath, TextInput) {
 }
 
 // mantine/create_value_input.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 function createValueInput(valuePath, ValueInput) {
   const onChange = (value) => {
     this.onFieldValueChange?.(valuePath, value);
@@ -1414,7 +1514,7 @@ function createValueInput(valuePath, ValueInput) {
       value,
       disabled: readonly,
       required,
-      error: error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorRenderer, { error }),
+      error: error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorRenderer, { error }),
       onChange,
       onFocus,
       onBlur,
@@ -1429,18 +1529,18 @@ function createValueInput(valuePath, ValueInput) {
 }
 
 // mantine/hooks.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 function SimpleSelect(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core.Select, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core.Select, { ...props });
 }
-function useMantineForm({
+function useMantineFormFields({
   onFieldValueChange,
   onFieldBlur,
   onFieldFocus,
   onFieldSubmit,
   fields
 }) {
-  const form = (0, import_react2.useMemo)(
+  const form = (0, import_react4.useMemo)(
     function() {
       return new MantineFormImpl(fields);
     },
@@ -1448,7 +1548,7 @@ function useMantineForm({
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
   );
-  (0, import_react2.useEffect)(function() {
+  (0, import_react4.useEffect)(function() {
     (0, import_mobx2.runInAction)(function() {
       form.fields = fields;
     });
@@ -1456,25 +1556,25 @@ function useMantineForm({
     form,
     fields
   ]);
-  (0, import_react2.useEffect)(function() {
+  (0, import_react4.useEffect)(function() {
     form.onFieldValueChange = onFieldValueChange;
   }, [
     form,
     onFieldValueChange
   ]);
-  (0, import_react2.useEffect)(function() {
+  (0, import_react4.useEffect)(function() {
     form.onFieldBlur = onFieldBlur;
   }, [
     form,
     onFieldBlur
   ]);
-  (0, import_react2.useEffect)(function() {
+  (0, import_react4.useEffect)(function() {
     form.onFieldFocus = onFieldFocus;
   }, [
     form,
     onFieldFocus
   ]);
-  (0, import_react2.useEffect)(function() {
+  (0, import_react4.useEffect)(function() {
     form.onFieldSubmit = onFieldSubmit;
   }, [
     form,
@@ -1504,9 +1604,10 @@ var MantineFormImpl = class {
   listCache = new import_base6.Cache(
     createList.bind(this)
   );
-  subFormCache = new import_base6.Cache(
-    createSubForm.bind(this)
+  fieldsViewCache = new import_base6.Cache(
+    createFieldsView.bind(this)
   );
+  formCache = new import_base6.Cache(createForm.bind(this));
   @import_mobx2.observable.ref
   accessor fields;
   onFieldValueChange;
@@ -1572,20 +1673,28 @@ var MantineFormImpl = class {
       DefaultList
     );
   }
-  // TODO have the returned component take any non-overlapping props as props
-  subForm(valuePath, SubForm) {
-    return this.subFormCache.retrieveOrCreate(
+  fieldsView(valuePath, FieldsView) {
+    return this.fieldsViewCache.retrieveOrCreate(
       valuePath,
       // strip props from component since we lose information in the cache
       // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-      SubForm,
+      FieldsView,
+      this
+    );
+  }
+  form(valuePath, Form) {
+    return this.formCache.retrieveOrCreate(
+      valuePath,
+      // strip props from component since we lose information in the cache
+      // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+      Form,
       this
     );
   }
 };
 
 // types/merge_validators.ts
-var import_define6 = require("@strictly/define");
+var import_define7 = require("@strictly/define");
 function mergeValidators(validators1, validators2) {
   const validators = {
     ...validators1,
@@ -1600,16 +1709,16 @@ function mergeValidators(validators1, validators2) {
       validators3[key] = {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         validate: function(value, valuePath, context) {
-          const error = (0, import_define6.validate)(validator1, value, valuePath, context);
+          const error = (0, import_define7.validate)(validator1, value, valuePath, context);
           if (error != null) {
             return error;
           }
-          return (0, import_define6.validate)(validator2, value, valuePath, context);
+          return (0, import_define7.validate)(validator2, value, valuePath, context);
         },
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         annotations: function(valuePath, context) {
-          const annotations1 = (0, import_define6.annotations)(validator1, valuePath, context);
-          const annotations22 = (0, import_define6.annotations)(validator2, valuePath, context);
+          const annotations1 = (0, import_define7.annotations)(validator1, valuePath, context);
+          const annotations22 = (0, import_define7.annotations)(validator2, valuePath, context);
           return {
             readonly: annotations1.readonly || annotations22.readonly,
             required: annotations1.required || annotations22.required
@@ -1649,7 +1758,8 @@ function mergeValidators(validators1, validators2) {
   mergeValidators,
   prototypingFieldValueFactory,
   subFormFieldAdapters,
-  useMantineForm,
+  useDefaultMobxFormHooks,
+  useMantineFormFields,
   usePartialComponent,
   usePartialObserverComponent,
   validatingConverter

package/dist/index.d.cts

@@ -149,29 +149,17 @@ declare class FormModel<T extends Type, ValueToTypePaths extends Readonly<Record
     get accessors(): Readonly<Record<string, Accessor>>;
 }
 
-type MergedOfFieldAdaptersWithTwoWayConverter<FieldAdapters extends Readonly<Record<string, FieldAdapter>>, E, Context> = {
-    [K in keyof FieldAdapters]: FieldAdapter<FromOfFieldAdapter<FieldAdapters[K]>, ToOfFieldAdapter<FieldAdapters[K]>, ErrorOfFieldAdapter<FieldAdapters[K]> | E, ValuePathOfFieldAdapter<FieldAdapters[K]>, Context>;
+type FieldsViewProps<F extends Fields> = {
+    fields: F;
+    onFieldValueChange<K extends keyof F>(this: void, key: K, value: F[K]['value']): void;
+    onFieldFocus?(this: void, key: keyof F): void;
+    onFieldBlur?(this: void, key: keyof F): void;
+    onFieldSubmit?(this: void, key: keyof F): boolean | void;
 };
-type ValuePathsOfFieldAdapters<FieldAdapters extends Readonly<Record<string, FieldAdapter>>> = {
-    [K in keyof FieldAdapters]: ValuePathOfFieldAdapter<FieldAdapters[K]>;
-}[keyof FieldAdapters];
-type TosOfFieldAdapters<FieldAdapters extends Readonly<Record<string, FieldAdapter>>> = {
-    [K in keyof FieldAdapters]: ToOfFieldAdapter<FieldAdapters[K]>;
-}[keyof FieldAdapters];
-declare function mergeFieldAdaptersWithTwoWayConverter<FieldAdapters extends Readonly<Record<string, FieldAdapter>>, E, Context>(fieldAdapters: FieldAdapters, converter: TwoWayFieldConverter<TosOfFieldAdapters<FieldAdapters>, TosOfFieldAdapters<FieldAdapters>, E, ValuePathsOfFieldAdapters<FieldAdapters>, Context>): MergedOfFieldAdaptersWithTwoWayConverter<FieldAdapters, E, Context>;
-
-type MergedOfFieldAdaptersWithValidators<FieldAdapters extends Readonly<Record<Key, FieldAdapter>>, Validators extends Partial<Readonly<Record<string, Validator>>>, Key extends keyof Validators = keyof Validators> = Simplify<{
-    readonly [K in Key]: MergedOfFieldAdapterWithValidator<FieldAdapters[K], Validators[K]>;
-} & {
-    readonly [K in Exclude<keyof FieldAdapters, Key>]: FieldAdapters[K];
-}>;
-type MergedOfFieldAdapterWithValidator<A extends FieldAdapter, V extends Validator | undefined> = undefined extends V ? A : A extends FieldAdapter<infer From, infer To, infer E1, infer P1, infer C1> ? V extends Validator<From, infer E2, infer P2, infer C2> ? FieldAdapter<From, To, E1 | E2, P1 | P2, C1 | C2> : never : never;
-declare function mergeAdaptersWithValidators<FieldAdapters extends Readonly<Record<Key, FieldAdapter>>, Validators extends Readonly<Record<string, Validator>>, Key extends keyof Validators = keyof Validators>(adapters: FieldAdapters, validators: Validators): MergedOfFieldAdaptersWithValidators<FieldAdapters, Validators, Key>;
-
-type SubFormFieldAdapters<SubAdapters extends Record<string, FieldAdapter>, P extends string> = {
-    [K in keyof SubAdapters as K extends StringConcatOf<'$', infer S> ? `${P}${S}` : never]: SubAdapters[K];
+type FormProps<O> = {
+    value: O;
+    onValueChange: (value: O) => void;
 };
-declare function subFormFieldAdapters<SubAdapters extends Record<string, FieldAdapter>, P extends string>(subAdapters: SubAdapters, prefix: P): SubFormFieldAdapters<SubAdapters, P>;
 
 /**
  * Used to extract the supported value paths from a presenter
@@ -191,17 +179,36 @@ type ToValueOfPresenterValuePath<Presenter extends FormPresenter<any, any, any,
  */
 type FormFieldsOfPresenter<Presenter extends FormPresenter<any, any, any, any>> = Presenter extends FormPresenter<infer _1, infer _2, infer _3, infer ValuePathsToAdapters> ? FlattenedConvertedFieldsOf<ValuePathsToAdapters> : never;
 
-type FormProps<F extends Fields> = {
-    fields: F;
-    onFieldValueChange<K extends keyof F>(this: void, key: K, value: F[K]['value']): void;
-    onFieldFocus?(this: void, key: keyof F): void;
-    onFieldBlur?(this: void, key: keyof F): void;
-    onFieldSubmit?(this: void, key: keyof F): boolean | void;
+type ValueOfPresenter<P extends FormPresenter<any, any, any, any>> = P extends FormPresenter<infer T, any, any, any> ? ValueOfType<ReadonlyTypeOfType<T>> : never;
+type ModelOfPresenter<P extends FormPresenter<any, any, any, any>> = ReturnType<P['createModel']>;
+declare function useDefaultMobxFormHooks<P extends FormPresenter<any, any, any, any>>(presenter: P, value: ValueOfPresenter<P>, onValidSubmit?: <Path extends ValuePathsOfPresenter<P>>(model: ModelOfPresenter<P>, valuePath: Path) => void): {
+    model: ModelOfPresenter<P>;
+} & Omit<FieldsViewProps<ModelOfPresenter<P>['fields']>, 'fields'>;
+
+type MergedOfFieldAdaptersWithTwoWayConverter<FieldAdapters extends Readonly<Record<string, FieldAdapter>>, E, Context> = {
+    [K in keyof FieldAdapters]: FieldAdapter<FromOfFieldAdapter<FieldAdapters[K]>, ToOfFieldAdapter<FieldAdapters[K]>, ErrorOfFieldAdapter<FieldAdapters[K]> | E, ValuePathOfFieldAdapter<FieldAdapters[K]>, Context>;
 };
-type EditorProps<O> = {
-    value: O;
-    onValueChange: (value: O) => void;
+type ValuePathsOfFieldAdapters<FieldAdapters extends Readonly<Record<string, FieldAdapter>>> = {
+    [K in keyof FieldAdapters]: ValuePathOfFieldAdapter<FieldAdapters[K]>;
+}[keyof FieldAdapters];
+type TosOfFieldAdapters<FieldAdapters extends Readonly<Record<string, FieldAdapter>>> = {
+    [K in keyof FieldAdapters]: ToOfFieldAdapter<FieldAdapters[K]>;
+}[keyof FieldAdapters];
+declare function mergeFieldAdaptersWithTwoWayConverter<FieldAdapters extends Readonly<Record<string, FieldAdapter>>, E, Context>(fieldAdapters: FieldAdapters, converter: TwoWayFieldConverter<TosOfFieldAdapters<FieldAdapters>, TosOfFieldAdapters<FieldAdapters>, E, ValuePathsOfFieldAdapters<FieldAdapters>, Context>): MergedOfFieldAdaptersWithTwoWayConverter<FieldAdapters, E, Context>;
+
+type MergedOfFieldAdaptersWithValidators<FieldAdapters extends Readonly<Record<Key, FieldAdapter>>, Validators extends Partial<Readonly<Record<string, Validator>>>, Key extends keyof Validators = keyof Validators> = Simplify<{
+    readonly [K in Key]: MergedOfFieldAdapterWithValidator<FieldAdapters[K], Validators[K]>;
+} & {
+    readonly [K in Exclude<keyof FieldAdapters, Key>]: FieldAdapters[K];
+}>;
+type MergedOfFieldAdapterWithValidator<A extends FieldAdapter, V extends Validator | undefined> = undefined extends V ? A : A extends FieldAdapter<infer From, infer To, infer E1, infer P1, infer C1> ? V extends Validator<From, infer E2, infer P2, infer C2> ? FieldAdapter<From, To, E1 | E2, P1 | P2, C1 | C2> : never : never;
+declare function mergeAdaptersWithValidators<FieldAdapters extends Readonly<Record<Key, FieldAdapter>>, Validators extends Readonly<Record<string, Validator>>, Key extends keyof Validators = keyof Validators>(adapters: FieldAdapters, validators: Validators): MergedOfFieldAdaptersWithValidators<FieldAdapters, Validators, Key>;
+
+type SubFormFieldAdapter<F extends FieldAdapter, P extends string, Context> = FieldAdapter<FromOfFieldAdapter<F>, ToOfFieldAdapter<F>, ErrorOfFieldAdapter<F>, P, Context>;
+type SubFormFieldAdapters<SubAdapters extends Record<string, FieldAdapter>, P extends string, Context> = {
+    [K in keyof SubAdapters as K extends StringConcatOf<'$', infer S> ? `${P}${S}` : never]: K extends StringConcatOf<'$', infer S> ? SubFormFieldAdapter<SubAdapters[K], `${P}${S}`, Context> : never;
 };
+declare function subFormFieldAdapters<SubAdapters extends Record<string, FieldAdapter>, P extends string, ContextType extends Type>(subAdapters: SubAdapters, prefix: P, contextType: ContextType): SubFormFieldAdapters<SubAdapters, P, ValueOfType<ContextType>>;
 
 declare class IntegerToStringConverter<E, ValuePath extends string, Context> implements TwoWayFieldConverter<number, string, E, ValuePath, Context> {
     private readonly isNanError;
@@ -360,7 +367,7 @@ type SuppliedValueInputProps<V, T extends Element = Element> = Partial<{
 declare function SimpleSelect(props: SelectProps & {
     onChange?: (value: string | null) => void;
 }): react_jsx_runtime.JSX.Element;
-declare function useMantineForm<F extends Fields>({ onFieldValueChange, onFieldBlur, onFieldFocus, onFieldSubmit, fields, }: FormProps<F>): MantineFormImpl<F>;
+declare function useMantineFormFields<F extends Fields>({ onFieldValueChange, onFieldBlur, onFieldFocus, onFieldSubmit, fields, }: FieldsViewProps<F>): MantineFormImpl<F>;
 declare class MantineFormImpl<F extends Fields> implements MantineForm<F> {
     private readonly textInputCache;
     private readonly valueInputCache;
@@ -369,7 +376,8 @@ declare class MantineFormImpl<F extends Fields> implements MantineForm<F> {
     private readonly radioCache;
     private readonly pillCache;
     private readonly listCache;
-    private readonly subFormCache;
+    private readonly fieldsViewCache;
+    private readonly formCache;
     accessor fields: F;
     onFieldValueChange: <K extends keyof F>(this: void, key: K, value: F[K]['value']) => void;
     onFieldFocus: ((this: void, key: keyof F) => void) | undefined;
@@ -389,7 +397,8 @@ declare class MantineFormImpl<F extends Fields> implements MantineForm<F> {
     pill<K extends keyof AllFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedPillProps, PillProps, ErrorOfField<F[K]>>;
     pill<K extends keyof AllFieldsOfFields<F>, P extends SuppliedPillProps>(valuePath: K, Pill: ComponentType<P>): MantineFieldComponent<SuppliedPillProps, P>;
     list<K extends keyof ListFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedListProps<`${K}.${number}`>, ComponentProps<typeof DefaultList<ElementOfArray<F[K]['value']>, K>>>;
-    subForm<K extends keyof AllFieldsOfFields<F>, S extends SubFormFields<F, K>>(valuePath: K, SubForm: ComponentType<FormProps<S>>): ComponentType;
+    fieldsView<K extends keyof AllFieldsOfFields<F>, P extends FieldsViewProps<Fields> = FieldsViewProps<SubFormFields<F, K>>>(valuePath: K, FieldsView: ComponentType<P>): MantineFieldComponent<FieldsViewProps<P['fields']>, P>;
+    form<K extends keyof AllFieldsOfFields<F>, P extends FormProps<ValueTypeOfField<F[K]>> = FormProps<ValueTypeOfField<F[K]>>>(valuePath: K, Form: ComponentType<P>): MantineFieldComponent<FormProps<ValueTypeOfField<F[K]>>, P>;
 }
 
 type MergedOfValidators<Validators1 extends Partial<Readonly<Record<Keys, Validator>>>, Validators2 extends Partial<Readonly<Record<Keys, Validator>>>, Keys extends string = Extract<keyof Validators1 | keyof Validators2, string>> = Simplify<{
@@ -398,4 +407,4 @@ type MergedOfValidators<Validators1 extends Partial<Readonly<Record<Keys, Valida
 type MergedOfValidator<Validator1 extends Validator, Validator2 extends Validator> = Validator1 extends Validator<infer V, infer E1, infer P, infer C> ? Validator2 extends Validator<V, infer E2, P, C> ? Validator<V, E1 | E2, P, C> : never : never;
 declare function mergeValidators<Validators1 extends Partial<Readonly<Record<Keys, Validator>>>, Validators2 extends Partial<Readonly<Record<Keys, Validator>>>, Keys extends string = Extract<keyof Validators1 | keyof Validators2, string>>(validators1: Validators1, validators2: Validators2): MergedOfValidators<Validators1, Validators2, Keys>;
 
-export { AbstractSelectValueTypeConverter, type AnnotatedFieldConversion, type AnnotatedFieldConverter, type Annotation, DefaultErrorRenderer, type EditorProps, type ErrorOfField, type ErrorOfFieldAdapter, type ErrorRenderer, type ErrorRendererProps, type Field, type FieldAdapter, type FieldAdaptersOfValues, type FieldValueFactory, type Fields, type FlattenedAdaptersOfFields, type FlattenedConvertedFieldsOf, type FlattenedTypePathsToAdaptersOf, type FormFieldsOfFieldAdapters, type FormFieldsOfPresenter, FormModel, FormPresenter, type FormProps, type FromOfFieldAdapter, IntegerToStringConverter, type MergedOfFieldAdaptersWithTwoWayConverter, type MergedOfFieldAdaptersWithValidators, type MergedOfValidator, type MergedOfValidators, NullableToBooleanConverter, type PartialComponent, SelectDiscriminatedUnionConverter, SelectLiteralConverter, SelectStringConverter, type ToOfFieldAdapter, type ToValueOfPresenterValuePath, TrimmingStringConverter, type TwoWayFieldConverter, type TwoWayFieldConverterWithValueFactory, type UnreliableFieldConversion, UnreliableFieldConversionType, type UnreliableFieldConverter, type UnsafePartialComponent, type ValuePathOfFieldAdapter, type ValuePathsOfPresenter, type ValuePathsToAdaptersOf, adapter, adapterFromPrototype, adapterFromTwoWayConverter, createPartialComponent, createPartialObserverComponent, createSimplePartialComponent, createUnsafePartialObserverComponent, identityAdapter, listAdapter, mergeAdaptersWithValidators, mergeFieldAdaptersWithTwoWayConverter, mergeValidators, prototypingFieldValueFactory, subFormFieldAdapters, useMantineForm, usePartialComponent, usePartialObserverComponent, validatingConverter };
+export { AbstractSelectValueTypeConverter, type AnnotatedFieldConversion, type AnnotatedFieldConverter, type Annotation, DefaultErrorRenderer, type ErrorOfField, type ErrorOfFieldAdapter, type ErrorRenderer, type ErrorRendererProps, type Field, type FieldAdapter, type FieldAdaptersOfValues, type FieldValueFactory, type Fields, type FieldsViewProps, type FlattenedAdaptersOfFields, type FlattenedConvertedFieldsOf, type FlattenedTypePathsToAdaptersOf, type FormFieldsOfFieldAdapters, type FormFieldsOfPresenter, FormModel, FormPresenter, type FormProps, type FromOfFieldAdapter, IntegerToStringConverter, type MergedOfFieldAdaptersWithTwoWayConverter, type MergedOfFieldAdaptersWithValidators, type MergedOfValidator, type MergedOfValidators, NullableToBooleanConverter, type PartialComponent, SelectDiscriminatedUnionConverter, SelectLiteralConverter, SelectStringConverter, type ToOfFieldAdapter, type ToValueOfPresenterValuePath, TrimmingStringConverter, type TwoWayFieldConverter, type TwoWayFieldConverterWithValueFactory, type UnreliableFieldConversion, UnreliableFieldConversionType, type UnreliableFieldConverter, type UnsafePartialComponent, type ValuePathOfFieldAdapter, type ValuePathsOfPresenter, type ValuePathsToAdaptersOf, adapter, adapterFromPrototype, adapterFromTwoWayConverter, createPartialComponent, createPartialObserverComponent, createSimplePartialComponent, createUnsafePartialObserverComponent, identityAdapter, listAdapter, mergeAdaptersWithValidators, mergeFieldAdaptersWithTwoWayConverter, mergeValidators, prototypingFieldValueFactory, subFormFieldAdapters, useDefaultMobxFormHooks, useMantineFormFields, usePartialComponent, usePartialObserverComponent, validatingConverter };