@strictly/react-form 0.0.6 → 0.0.8

package/.out/core/mobx/hooks.d.ts

@@ -4,7 +4,11 @@ import { type FormPresenter } from './form_presenter';
 import { type ValuePathsOfPresenter } from './types';
 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']>;
-export 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): {
+export declare function useDefaultMobxFormHooks<P extends FormPresenter<any, any, any, any>>(presenter: P, value: ValueOfPresenter<P>, { onValidFieldSubmit, onValidFormSubmit, }: {
+    onValidFieldSubmit?: <Path extends ValuePathsOfPresenter<P>>(model: ModelOfPresenter<P>, valuePath: Path) => void;
+    onValidFormSubmit?: (model: ModelOfPresenter<P>, value: ValueOfPresenter<P>) => void;
+}): {
     model: ModelOfPresenter<P>;
+    onFormSubmit?: (value: ValueOfPresenter<P>) => void;
 } & Omit<FieldsViewProps<ModelOfPresenter<P>['fields']>, 'fields'>;
 export {};

package/.out/core/mobx/hooks.js

@@ -1,6 +1,6 @@
 import { useCallback, useMemo, } from 'react';
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function useDefaultMobxFormHooks(presenter, value, onValidSubmit) {
+export function useDefaultMobxFormHooks(presenter, value, { onValidFieldSubmit, onValidFormSubmit, }) {
     const model = useMemo(function () {
         // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
         return presenter.createModel(value);
@@ -17,13 +17,13 @@ export function useDefaultMobxFormHooks(presenter, value, onValidSubmit) {
     ]);
     const onFieldSubmit = useCallback(function (valuePath) {
         if (presenter.validateField(model, valuePath)) {
-            onValidSubmit?.(model, valuePath);
+            onValidFieldSubmit?.(model, valuePath);
         }
         return false;
     }, [
         presenter,
         model,
-        onValidSubmit,
+        onValidFieldSubmit,
     ]);
     const onFieldBlur = useCallback(function (path) {
         // work around potential loss of focus prior to state potentially invalidating change triggering
@@ -38,10 +38,20 @@ export function useDefaultMobxFormHooks(presenter, value, onValidSubmit) {
         presenter,
         model,
     ]);
+    const onFormSubmit = useCallback(function () {
+        if (presenter.validateAll(model)) {
+            onValidFormSubmit?.(model, model.value);
+        }
+    }, [
+        presenter,
+        model,
+        onValidFormSubmit,
+    ]);
     return {
         model,
         onFieldValueChange,
         onFieldSubmit,
         onFieldBlur,
+        onFormSubmit,
     };
 }

package/.out/core/mobx/specs/form_presenter.tests.js

@@ -21,18 +21,16 @@ describe('all', function () {
     describe('FlattenedTypePathsToConvertersOf', function () {
         describe('record', function () {
             const typeDef = record(numberType);
-            let t;
             it('equals expected type', function () {
-                expectTypeOf(t).toEqualTypeOf();
+                expectTypeOf().toEqualTypeOf();
             });
         });
         describe('object', function () {
             const typeDef = object()
                 .field('x', stringType)
                 .field('y', booleanType);
-            let t;
             it('equals expected type', function () {
-                expectTypeOf(t).toEqualTypeOf();
+                expectTypeOf().toEqualTypeOf();
             });
             it('matches representative adapters', function () {
                 expectTypeOf().toMatchTypeOf();
@@ -50,9 +48,8 @@ describe('all', function () {
                 '$.b': '$.y',
                 '$.c': '$.z',
             };
-            let t;
             it('equals expected type', function () {
-                expectTypeOf(t).toEqualTypeOf();
+                expectTypeOf().toEqualTypeOf();
             });
         });
     });

package/.out/core/mobx/specs/{merge_field_adapters_with_two_way_converter.js → merge_field_adapters_with_two_way_converter.tests.js}

@@ -9,9 +9,8 @@ const error3 = Symbol();
 const error4 = Symbol();
 const context = Symbol();
 describe('MergedOfFieldAdapterWithTwoWayConverter', function () {
-    let m;
     it('merges the errors', function () {
-        expectTypeOf().toEqualTypeOf(m);
+        expectTypeOf().toEqualTypeOf();
     });
 });
 const originalIntegerAdapter = identityAdapter(0);
@@ -69,20 +68,20 @@ describe('mergeFieldAdaptersWithTwoWayConverter', function () {
                 beforeEach(function () {
                     result = merged.booleanAdapter.revert(true, 'booleanAdapter', context);
                 });
-            });
-            it('returns the same value on revert', function () {
-                expect(result).toEqual(expect.objectContaining({
-                    value: true,
-                    type: UnreliableFieldConversionType.Success,
-                }));
-            });
-            it('calls the mocked converter', function () {
-                expect(converter.revert).toHaveBeenCalledOnce();
-                expect(converter.revert).toHaveBeenCalledWith(true, 'booleanAdapter', context);
-            });
-            it('calls the mocked adapter', function () {
-                expect(booleanAdapter.revert).toHaveBeenCalledOnce();
-                expect(booleanAdapter.revert).toHaveBeenCalledWith(true, 'booleanAdapter', context);
+                it('returns the same value on revert', function () {
+                    expect(result).toEqual(expect.objectContaining({
+                        value: true,
+                        type: UnreliableFieldConversionType.Success,
+                    }));
+                });
+                it('calls the mocked converter', function () {
+                    expect(converter.revert).toHaveBeenCalledOnce();
+                    expect(converter.revert).toHaveBeenCalledWith(true, 'booleanAdapter', context);
+                });
+                it('calls the mocked adapter', function () {
+                    expect(booleanAdapter.revert).toHaveBeenCalledOnce();
+                    expect(booleanAdapter.revert).toHaveBeenCalledWith(true, 'booleanAdapter', context);
+                });
             });
         });
     });

package/.out/core/mobx/specs/sub_form_field_adapters.tests.js

@@ -1,10 +1,10 @@
+import { list, numberType, object, stringType, } from '@strictly/define';
 import { subFormFieldAdapters, } from 'core/mobx/sub_form_field_adapters';
-import { mockDeep } from 'vitest-mock-extended';
+import { UnreliableFieldConversionType } from 'types/field_converters';
+import { mockDeep, mockReset, } from 'vitest-mock-extended';
 describe('subFormFieldAdapters', () => {
-    const fieldAdapter1 = mockDeep();
-    const fieldAdapter2 = mockDeep();
     describe('empty value', () => {
-        const adapters = subFormFieldAdapters({}, '$.a');
+        const adapters = subFormFieldAdapters({}, '$.a', stringType);
         it('equals expected type', () => {
             expectTypeOf(adapters).toEqualTypeOf();
         });
@@ -13,28 +13,143 @@ describe('subFormFieldAdapters', () => {
         });
     });
     describe('single adapter', () => {
-        const adapters = subFormFieldAdapters({
+        const mockedFieldAdapter1 = mockDeep();
+        const fieldAdapter1 = mockedFieldAdapter1;
+        const type = object().field('a', stringType);
+        const subAdapters = {
             $: fieldAdapter1,
-        }, '$.a');
+        };
+        const adapters = subFormFieldAdapters(subAdapters, '$.a', type);
+        beforeEach(() => {
+            mockReset(mockedFieldAdapter1);
+        });
         it('equals expected type', () => {
-            expectTypeOf(adapters).toEqualTypeOf();
+            // TODO toEqualTypeOf (cannot reason about revert optionality, seems to be a TS issue as they
+            // are both optional AFAICT)
+            expectTypeOf(adapters).toMatchTypeOf();
         });
         it('equals expected value', () => {
-            expect(adapters).toEqual({ '$.a': fieldAdapter1 });
+            expect(adapters).toEqual({ '$.a': expect.anything() });
+        });
+        it('calls convert with the correct paths and values', () => {
+            const mockedReturnedValue = {
+                value: false,
+                required: false,
+                readonly: false,
+            };
+            mockedFieldAdapter1.convert.mockReturnValue(mockedReturnedValue);
+            const returnedValue = adapters['$.a'].convert('x', '$.a', { a: 'y' });
+            expect(fieldAdapter1.convert).toHaveBeenCalledWith('x', '$', 'y');
+            expect(returnedValue).toEqual(mockedReturnedValue);
+        });
+        it('calls revert with the correct paths and values', () => {
+            const mockedReturnedValue = {
+                type: UnreliableFieldConversionType.Success,
+                value: 'ok',
+            };
+            mockedFieldAdapter1.revert.mockReturnValue(mockedReturnedValue);
+            const returnedValue = adapters['$.a'].revert?.(true, '$.a', { a: 'y' });
+            expect(fieldAdapter1.revert).toHaveBeenCalledWith(true, '$', 'y');
+            expect(returnedValue).toEqual(mockedReturnedValue);
+        });
+        it('calls create with the correct paths and values', () => {
+            const mockedReturnedValue = 'x';
+            mockedFieldAdapter1.create.mockReturnValue(mockedReturnedValue);
+            const returnedValue = adapters['$.a'].create('$.a', { a: 'y' });
+            expect(fieldAdapter1.create).toHaveBeenCalledWith('$', 'y');
+            expect(returnedValue).toEqual(mockedReturnedValue);
         });
     });
     describe('multiple adapters', () => {
+        const mockedFieldAdapter1 = mockDeep();
+        const fieldAdapter1 = mockedFieldAdapter1;
+        const mockedFieldAdapter2 = mockDeep();
+        const fieldAdapter2 = mockedFieldAdapter2;
+        const type = object()
+            .field('a', object().field('x', stringType).field('y', numberType));
         const adapters = subFormFieldAdapters({
             '$.x': fieldAdapter1,
             '$.y': fieldAdapter2,
-        }, '$.a');
+        }, '$.a', type);
+        beforeEach(() => {
+            mockReset(mockedFieldAdapter1);
+            mockReset(mockedFieldAdapter2);
+        });
         it('equals expected type', () => {
-            expectTypeOf(adapters).toEqualTypeOf();
+            // TODO toEqualTypeOf (seems to be a TS error)
+            expectTypeOf(adapters).toMatchTypeOf();
+        });
+        it('equals expected value', () => {
+            expect(adapters).toEqual({
+                '$.a.x': expect.anything(),
+                '$.a.y': expect.anything(),
+            });
+        });
+        describe('calls convert with correct paths and values', () => {
+            const subContext = {
+                x: 'a',
+                y: 1,
+            };
+            const context = {
+                a: subContext,
+            };
+            it('calls $.a.x', () => {
+                const mockedReturnedValue = {
+                    value: true,
+                    readonly: true,
+                    required: false,
+                };
+                mockedFieldAdapter1.convert.mockReturnValue(mockedReturnedValue);
+                const returnedValue = adapters['$.a.x'].convert('b', '$.a.x', context);
+                expect(fieldAdapter1.convert).toHaveBeenCalledWith('b', '$.x', subContext);
+                expect(returnedValue).toEqual(mockedReturnedValue);
+            });
+            it('calls $.a.y', () => {
+                const mockedReturnedValue = {
+                    value: false,
+                    readonly: false,
+                    required: false,
+                };
+                mockedFieldAdapter2.convert.mockReturnValue(mockedReturnedValue);
+                const returnedValue = adapters['$.a.y'].convert(2, '$.a.y', context);
+                expect(fieldAdapter2.convert).toHaveBeenCalledWith(2, '$.y', subContext);
+                expect(returnedValue).toEqual(mockedReturnedValue);
+            });
+        });
+    });
+    describe('list adapter', () => {
+        const mockedFieldAdapter1 = mockDeep();
+        const fieldAdapter1 = mockedFieldAdapter1;
+        const type = list(stringType);
+        const subAdapters = {
+            $: fieldAdapter1,
+        };
+        const adapters = subFormFieldAdapters(subAdapters, '$.*', type);
+        beforeEach(() => {
+            mockReset(mockedFieldAdapter1);
+        });
+        it('equals expected type', () => {
+            // TODO toEqualTypeOf (seems to be a TS error)
+            expectTypeOf(adapters).toMatchTypeOf();
         });
         it('equals expected value', () => {
             expect(adapters).toEqual({
-                '$.a.x': fieldAdapter1,
-                '$.a.y': fieldAdapter2,
+                '$.*': expect.anything(),
+            });
+        });
+        describe('calls convert with correct paths and values', () => {
+            const subContext = 'a';
+            const context = [subContext];
+            it('calls $.*', () => {
+                const mockedReturnedValue = {
+                    value: false,
+                    readonly: false,
+                    required: false,
+                };
+                mockedFieldAdapter1.convert.mockReturnValue(mockedReturnedValue);
+                const returnedValue = adapters['$.*'].convert('b', '$.0', context);
+                expect(fieldAdapter1.convert).toHaveBeenCalledWith('b', '$', subContext);
+                expect(returnedValue).toEqual(mockedReturnedValue);
             });
         });
     });

package/.out/core/mobx/sub_form_field_adapters.d.ts

@@ -1,7 +1,9 @@
 import { type StringConcatOf } from '@strictly/base';
-import { type FieldAdapter } from './field_adapter';
-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];
+import { type Type, type ValueOfType } from '@strictly/define';
+import { type ErrorOfFieldAdapter, type FieldAdapter, type FromOfFieldAdapter, type ToOfFieldAdapter, type ValuePathOfFieldAdapter } from './field_adapter';
+type SubFormFieldAdapter<F extends FieldAdapter, ValuePath extends string, Context> = FieldAdapter<FromOfFieldAdapter<F>, ToOfFieldAdapter<F>, ErrorOfFieldAdapter<F>, ValuePathOfFieldAdapter<F> extends StringConcatOf<'$', infer ValuePathSuffix> ? `${ValuePath}${ValuePathSuffix}` : string, Context>;
+type SubFormFieldAdapters<SubAdapters extends Record<string, FieldAdapter>, TypePath extends string, ValuePath extends string, Context> = {
+    [K in keyof SubAdapters as K extends StringConcatOf<'$', infer TypePathSuffix> ? `${TypePath}${TypePathSuffix}` : never]: SubFormFieldAdapter<SubAdapters[K], ValuePath, Context>;
 };
-export declare function subFormFieldAdapters<SubAdapters extends Record<string, FieldAdapter>, P extends string>(subAdapters: SubAdapters, prefix: P): SubFormFieldAdapters<SubAdapters, P>;
+export declare function subFormFieldAdapters<SubAdapters extends Record<string, FieldAdapter>, TypePath extends string, TypePathsToValuePaths extends Record<TypePath, string>, ContextType extends Type>(subAdapters: SubAdapters, parentTypePath: TypePath, contextType: ContextType): SubFormFieldAdapters<SubAdapters, TypePath, TypePathsToValuePaths[TypePath], ValueOfType<ContextType>>;
 export {};

package/.out/core/mobx/sub_form_field_adapters.js

@@ -1,8 +1,32 @@
-export function subFormFieldAdapters(subAdapters, prefix) {
+import { flattenValuesOfType, } from '@strictly/define';
+export function subFormFieldAdapters(subAdapters, parentTypePath, contextType) {
+    // assume the number of '.' in the type path will correspond to the number of '.' in the value path
+    const dotCount = parentTypePath.split('.').length;
+    function getSubValuePathAndContext(valuePath, context) {
+        const parentValuePath = valuePath.split('.').slice(0, dotCount).join('.');
+        const subValuePath = valuePath.replace(parentValuePath, '$');
+        const subContext = flattenValuesOfType(contextType, context)[parentValuePath];
+        return [
+            subValuePath,
+            subContext,
+        ];
+    }
     // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-    return Object.entries(subAdapters).reduce((acc, [subKey, subValue,]) => {
-        const key = subKey.replace('$', prefix);
-        acc[key] = subValue;
+    return Object.entries(subAdapters).reduce((acc, [subTypePath, subAdapter,]) => {
+        const typePath = subTypePath.replace('$', parentTypePath);
+        // adapt field adapter with new path and context
+        const adaptedAdapter = {
+            convert: (from, valuePath, context) => {
+                return subAdapter.convert(from, ...getSubValuePathAndContext(valuePath, context));
+            },
+            create: (valuePath, context) => {
+                return subAdapter.create(...getSubValuePathAndContext(valuePath, context));
+            },
+            revert: subAdapter.revert && ((from, valuePath, context) => {
+                return subAdapter.revert(from, ...getSubValuePathAndContext(valuePath, context));
+            }),
+        };
+        acc[typePath] = adaptedAdapter;
         return acc;
     }, {});
 }

package/.out/field_converters/nullable_to_boolean_converter.d.ts

@@ -1,12 +1,12 @@
 import { type ReadonlyTypeOfType, type Type, type ValueOfType } from '@strictly/define';
 import { type AnnotatedFieldConversion, type TwoWayFieldConverterWithValueFactory, type UnreliableFieldConversion } from 'types/field_converters';
-export declare class NullableToBooleanConverter<T extends Type, E, ValuePath extends string, Context, NullType extends null | undefined> implements TwoWayFieldConverterWithValueFactory<ValueOfType<ReadonlyTypeOfType<T>> | NullType, boolean, E, ValuePath, Context> {
+export declare class NullableToBooleanConverter<T extends Type, ValuePath extends string, Context, NullType extends null | undefined> implements TwoWayFieldConverterWithValueFactory<ValueOfType<ReadonlyTypeOfType<T>> | NullType, boolean, never, ValuePath, Context> {
     private readonly typeDef;
     private readonly prototype;
     private readonly nullType;
     readonly defaultValue: ValueOfType<ReadonlyTypeOfType<T>> | NullType;
     constructor(typeDef: T, prototype: ValueOfType<ReadonlyTypeOfType<T>>, nullType: NullType, defaultToNull?: boolean);
     convert(from: ValueOfType<ReadonlyTypeOfType<T>> | NullType): AnnotatedFieldConversion<boolean>;
-    revert(from: boolean): UnreliableFieldConversion<ValueOfType<ReadonlyTypeOfType<T>> | NullType, E>;
+    revert(from: boolean): UnreliableFieldConversion<ValueOfType<ReadonlyTypeOfType<T>> | NullType, never>;
     create(): ValueOfType<ReadonlyTypeOfType<T>> | NullType;
 }

package/.out/mantine/create_checkbox.js

@@ -34,5 +34,6 @@ export function createCheckbox(valuePath, Checkbox) {
             onKeyUp,
         };
     };
+    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
     return createUnsafePartialObserverComponent(Checkbox, propSource, ['ErrorRenderer']);
 }

package/.out/mantine/create_fields_view.d.ts

@@ -4,4 +4,4 @@ import type { AllFieldsOfFields } from 'types/all_fields_of_fields';
 import type { Fields } from 'types/field';
 import type { SubFormFields } from 'types/sub_form_fields';
 import type { MantineFieldComponent } from './types';
-export declare function createFieldsView<F extends Fields, K extends keyof AllFieldsOfFields<F>, P extends FieldsViewProps<Fields> = FieldsViewProps<SubFormFields<F, K>>>(valuePath: K, FieldsView: ComponentType<P>, observableProps: FieldsViewProps<F>): MantineFieldComponent<FieldsViewProps<P['fields']>, P>;
+export declare function createFieldsView<F extends Fields, K extends keyof AllFieldsOfFields<F>, P extends FieldsViewProps<Fields> = FieldsViewProps<SubFormFields<F, K>>>(valuePath: K, FieldsView: ComponentType<P>, observableProps: FieldsViewProps<F>): MantineFieldComponent<FieldsViewProps<P['fields']>, P, never>;

package/.out/mantine/create_fields_view.js

@@ -31,9 +31,9 @@ export function createFieldsView(valuePath, FieldsView, observableProps) {
                 acc[toSubKey(fieldKey)] = fieldValue;
             }
             return acc;
-        }, {});
-        return (_jsx(FieldsView, { ...props, 
-            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-            fields: subFields, onFieldBlur: onFieldBlur, onFieldFocus: onFieldFocus, onFieldSubmit: onFieldSubmit, onFieldValueChange: onFieldValueChange }));
+        }, 
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        {});
+        return (_jsx(FieldsView, { ...props, fields: subFields, onFieldBlur: onFieldBlur, onFieldFocus: onFieldFocus, onFieldSubmit: onFieldSubmit, onFieldValueChange: onFieldValueChange }));
     });
 }

package/.out/mantine/create_form.d.ts

@@ -4,4 +4,4 @@ import { type AllFieldsOfFields } from 'types/all_fields_of_fields';
 import { type Fields } from 'types/field';
 import { type ValueTypeOfField } from 'types/value_type_of_field';
 import { type MantineFieldComponent } from './types';
-export declare function createForm<F extends Fields, K extends keyof AllFieldsOfFields<F>, P extends FormProps<ValueTypeOfField<F[K]>> = FormProps<ValueTypeOfField<F[K]>>>(valuePath: K, Form: ComponentType<P>, observableProps: FieldsViewProps<F>): MantineFieldComponent<FormProps<ValueTypeOfField<F[K]>>, P>;
+export declare function createForm<F extends Fields, K extends keyof AllFieldsOfFields<F>, P extends FormProps<ValueTypeOfField<F[K]>> = FormProps<ValueTypeOfField<F[K]>>>(valuePath: K, Form: ComponentType<P>, observableProps: FieldsViewProps<F>): MantineFieldComponent<FormProps<ValueTypeOfField<F[K]>>, P, never>;

package/.out/mantine/create_list.d.ts

@@ -10,7 +10,7 @@ export type SuppliedListProps<Value = any, ListPath extends string = string> = {
 };
 export declare function createList<F extends Fields, K extends keyof ListFieldsOfFields<F>, Props extends SuppliedListProps<ElementOfArray<ValueTypeOfField<F[K]>>> & {
     children: (valuePath: `${K}.${number}`, value: ElementOfArray<ValueTypeOfField<F[K]>>, index: number) => React.ReactNode;
-}>(this: MantineForm<F>, valuePath: K, List: ComponentType<Props>): MantineFieldComponent<SuppliedListProps<ElementOfArray<ValueTypeOfField<F[K]>>>, Props>;
+}>(this: MantineForm<F>, valuePath: K, List: ComponentType<Props>): MantineFieldComponent<SuppliedListProps<ElementOfArray<ValueTypeOfField<F[K]>>>, Props, never>;
 export declare function DefaultList<Value, ListPath extends string>({ values, listPath, children, }: SuppliedListProps<Value, ListPath> & {
     children: (valuePath: `${ListPath}.${number}`, value: Value, index: number) => React.ReactNode;
 }): import("react/jsx-runtime").JSX.Element;

package/.out/mantine/create_pill.d.ts

@@ -4,4 +4,4 @@ import { type AllFieldsOfFields } from 'types/all_fields_of_fields';
 import { type Fields } from 'types/field';
 import { type MantineFieldComponent, type MantineForm } from './types';
 export type SuppliedPillProps = Pick<PillProps, 'children' | 'disabled'>;
-export declare function createPill<F extends Fields, K extends keyof AllFieldsOfFields<F>, Props extends SuppliedPillProps>(this: MantineForm<F>, valuePath: K, Pill: ComponentType<Props>): MantineFieldComponent<SuppliedPillProps, Props>;
+export declare function createPill<F extends Fields, K extends keyof AllFieldsOfFields<F>, Props extends SuppliedPillProps>(this: MantineForm<F>, valuePath: K, Pill: ComponentType<Props>): MantineFieldComponent<SuppliedPillProps, Props, never>;

package/.out/mantine/create_radio.d.ts

@@ -5,4 +5,4 @@ import { type StringFieldsOfFields } from 'types/string_fields_of_fields';
 import { type ValueTypeOfField } from 'types/value_type_of_field';
 import { type MantineFieldComponent, type MantineForm } from './types';
 export type SuppliedRadioProps = Pick<RadioProps, 'value' | 'disabled'>;
-export declare function createRadio<F extends Fields, K extends keyof StringFieldsOfFields<F>, Props extends SuppliedRadioProps>(this: MantineForm<F>, valuePath: K, value: ValueTypeOfField<F[K]>, Radio: ComponentType<Props>): MantineFieldComponent<SuppliedRadioProps, Props>;
+export declare function createRadio<F extends Fields, K extends keyof StringFieldsOfFields<F>, Props extends SuppliedRadioProps>(this: MantineForm<F>, valuePath: K, value: ValueTypeOfField<F[K]>, Radio: ComponentType<Props>): MantineFieldComponent<SuppliedRadioProps, Props, never>;

package/.out/mantine/create_radio_group.js

@@ -31,5 +31,6 @@ export function createRadioGroup(valuePath, RadioGroup) {
             onKeyUp,
         };
     };
+    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
     return createUnsafePartialObserverComponent(RadioGroup, propSource, ['ErrorRenderer']);
 }

package/.out/mantine/create_text_input.js

@@ -19,9 +19,13 @@ export function createTextInput(valuePath, TextInput) {
         }
     };
     const propSource = ({ ErrorRenderer = DefaultErrorRenderer, }) => {
-        const { readonly, required, value, error,
         // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-         } = this.fields[valuePath];
+        const field = this.fields[valuePath];
+        if (field == null) {
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            throw new Error(`invalid field ${valuePath}`);
+        }
+        const { readonly, required, value, error, } = field;
         return {
             // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
             name: valuePath,
@@ -35,5 +39,6 @@ export function createTextInput(valuePath, TextInput) {
             onKeyUp,
         };
     };
+    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
     return createUnsafePartialObserverComponent(TextInput, propSource, ['ErrorRenderer']);
 }

package/.out/mantine/create_value_input.js

@@ -35,5 +35,6 @@ export function createValueInput(valuePath, ValueInput) {
             onKeyUp,
         };
     };
+    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
     return createUnsafePartialObserverComponent(ValueInput, propSource, ['ErrorRenderer']);
 }

package/.out/mantine/error_renderer.d.ts

@@ -3,4 +3,4 @@ export type ErrorRendererProps<E> = {
     error: E;
 };
 export type ErrorRenderer<E = any> = ComponentType<ErrorRendererProps<E>>;
-export declare function DefaultErrorRenderer({ error, }: ErrorRendererProps<any>): any;
+export declare function DefaultErrorRenderer({ error, }: ErrorRendererProps<any>): string;

package/.out/mantine/error_renderer.js

@@ -1,5 +1,5 @@
 export function DefaultErrorRenderer({ error,
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
  }) {
-    return error;
+    return JSON.stringify(error);
 }

package/.out/mantine/hooks.d.ts

@@ -38,20 +38,20 @@ declare class MantineFormImpl<F extends Fields> implements MantineForm<F> {
     onFieldBlur: ((this: void, key: keyof F) => void) | undefined;
     onFieldSubmit: ((this: void, key: keyof F) => boolean | void) | undefined;
     constructor(fields: F);
-    textInput<K extends keyof StringFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedTextInputProps, TextInputProps>;
-    textInput<K extends keyof StringFieldsOfFields<F>, P extends SuppliedTextInputProps<any>>(valuePath: K, TextInput?: ComponentType<P>): MantineFieldComponent<SuppliedTextInputProps, P>;
+    textInput<K extends keyof StringFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedTextInputProps, TextInputProps, ErrorOfField<F[K]>>;
+    textInput<K extends keyof StringFieldsOfFields<F>, P extends SuppliedTextInputProps<any>>(valuePath: K, TextInput?: ComponentType<P>): MantineFieldComponent<SuppliedTextInputProps, P, ErrorOfField<F[K]>>;
     valueInput<K extends keyof AllFieldsOfFields<F>, P extends SuppliedValueInputProps<ValueTypeOfField<F[K]>, any>>(valuePath: K, ValueInput: ComponentType<P>): MantineFieldComponent<SuppliedValueInputProps<ValueTypeOfField<F[K]>>, P, ErrorOfField<F[K]>>;
     select<K extends keyof StringFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedTextInputProps, ComponentProps<typeof SimpleSelect>, ErrorOfField<F[K]>>;
-    checkbox<K extends keyof BooleanFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedCheckboxProps, CheckboxProps>;
+    checkbox<K extends keyof BooleanFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedCheckboxProps, CheckboxProps, ErrorOfField<F[K]>>;
     checkbox<K extends keyof BooleanFieldsOfFields<F>, P extends SuppliedCheckboxProps>(valuePath: K, Checkbox: ComponentType<P>): MantineFieldComponent<SuppliedCheckboxProps, P, ErrorOfField<F[K]>>;
-    radioGroup<K extends keyof StringFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedRadioGroupProps, RadioGroupProps>;
-    radioGroup<K extends keyof StringFieldsOfFields<F>, P extends SuppliedRadioGroupProps>(valuePath: K, RadioGroup: ComponentType<P>): MantineFieldComponent<SuppliedRadioGroupProps, P>;
+    radioGroup<K extends keyof StringFieldsOfFields<F>, P extends RadioGroupProps = RadioGroupProps>(valuePath: K): MantineFieldComponent<SuppliedRadioGroupProps, P, ErrorOfField<F[K]>>;
+    radioGroup<K extends keyof StringFieldsOfFields<F>, P extends SuppliedRadioGroupProps>(valuePath: K, RadioGroup: ComponentType<P>): MantineFieldComponent<SuppliedRadioGroupProps, P, ErrorOfField<F[K]>>;
     radio<K extends keyof StringFieldsOfFields<F>>(valuePath: K, value: ValueTypeOfField<F[K]>): MantineFieldComponent<SuppliedRadioProps, RadioProps, ErrorOfField<F[K]>>;
     radio<K extends keyof StringFieldsOfFields<F>, P extends SuppliedRadioProps>(valuePath: K, value: ValueTypeOfField<F[K]>, Radio: ComponentType<P>): MantineFieldComponent<SuppliedRadioProps, P, ErrorOfField<F[K]>>;
     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>>>;
-    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>;
+    pill<K extends keyof AllFieldsOfFields<F>, P extends SuppliedPillProps>(valuePath: K, Pill: ComponentType<P>): MantineFieldComponent<SuppliedPillProps, P, ErrorOfField<F[K]>>;
+    list<K extends keyof ListFieldsOfFields<F>>(valuePath: K): MantineFieldComponent<SuppliedListProps<`${K}.${number}`>, ComponentProps<typeof DefaultList<ElementOfArray<F[K]['value']>, K>>, never>;
+    fieldsView<K extends keyof AllFieldsOfFields<F>, P extends FieldsViewProps<Fields> = FieldsViewProps<SubFormFields<F, K>>>(valuePath: K, FieldsView: ComponentType<P>): MantineFieldComponent<FieldsViewProps<P['fields']>, P, never>;
+    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, never>;
 }
 export {};

package/.out/mantine/specs/checkbox_hooks.stories.d.ts

@@ -1,12 +1,9 @@
 import { type Meta, type StoryObj } from '@storybook/react';
 import { type FieldsViewProps } from 'core/props';
-import { type ErrorRenderer } from 'mantine/error_renderer';
 import { type Field } from 'types/field';
-declare function Component({ ErrorRenderer, ...props }: FieldsViewProps<{
+declare function Component({ ...props }: FieldsViewProps<{
     $: Field<boolean, string>;
-}> & {
-    ErrorRenderer?: ErrorRenderer;
-}): import("react/jsx-runtime").JSX.Element;
+}>): import("react/jsx-runtime").JSX.Element;
 declare const meta: Meta<typeof Component>;
 export default meta;
 type Story = StoryObj<typeof Component>;
@@ -15,4 +12,3 @@ export declare const On: Story;
 export declare const Required: Story;
 export declare const Disabled: Story;
 export declare const Error: Story;
-export declare const CustomError: Story;

package/.out/mantine/specs/checkbox_hooks.stories.js

@@ -2,7 +2,10 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { action } from '@storybook/addon-actions';
 import { useMantineFormFields } from 'mantine/hooks';
 import { CHECKBOX_LABEL } from './checkbox_constants';
-function Component({ ErrorRenderer, ...props }) {
+function ErrorRenderer({ error }) {
+    return `Error ${error}`;
+}
+function Component({ ...props }) {
     const inputProps = useMantineFormFields(props);
     const CheckboxComponent = inputProps.checkbox('$');
     return (_jsx(CheckboxComponent, { ErrorRenderer: ErrorRenderer, label: CHECKBOX_LABEL }));
@@ -73,18 +76,3 @@ export const Error = {
         },
     },
 };
-export const CustomError = {
-    args: {
-        fields: {
-            $: {
-                readonly: false,
-                required: false,
-                value: true,
-                error: 'error',
-            },
-        },
-        ErrorRenderer: function () {
-            return 'custom error';
-        },
-    },
-};

package/.out/mantine/specs/fields_view_hooks.stories.d.ts

@@ -12,4 +12,4 @@ export declare const Empty: Story;
 export declare const Populated: Story;
 export declare const Required: Story;
 export declare const Disabled: Story;
-export declare const CustomError: Story;
+export declare const Errors: Story;

package/.out/mantine/specs/fields_view_hooks.stories.js

@@ -3,16 +3,19 @@ import { Button, Stack, } from '@mantine/core';
 import { action } from '@storybook/addon-actions';
 import { useMantineFormFields } from 'mantine/hooks';
 const onClick = action('some button clicked');
+function ErrorRenderer({ error }) {
+    return `error ${error}`;
+}
 function SubFieldsView(props) {
     const form = useMantineFormFields(props);
     const TextInput = form.textInput('$');
-    return (_jsxs(Stack, { children: [_jsx(TextInput, { label: 'sub fields view' }), _jsx(Button, { onClick: props.onClick, children: "Bonus Button" })] }));
+    return (_jsxs(Stack, { children: [_jsx(TextInput, { ErrorRenderer: ErrorRenderer, label: 'sub fields view' }), _jsx(Button, { onClick: props.onClick, children: "Bonus Button" })] }));
 }
 function Component(props) {
     const form = useMantineFormFields(props);
     const FieldsView = form.fieldsView('$.a', SubFieldsView);
     const TextInput = form.textInput('$');
-    return (_jsxs(Stack, { children: [_jsx(TextInput, { label: 'fields view' }), _jsx(FieldsView, { onClick: onClick })] }));
+    return (_jsxs(Stack, { children: [_jsx(TextInput, { ErrorRenderer: ErrorRenderer, label: 'fields view' }), _jsx(FieldsView, { onClick: onClick })] }));
 }
 const meta = {
     component: Component,
@@ -88,7 +91,7 @@ export const Disabled = {
         },
     },
 };
-export const CustomError = {
+export const Errors = {
     args: {
         fields: {
             $: {