@strictly/react-form 0.0.1

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

@@ -0,0 +1,425 @@
+import { assertExists, assertExistsAndReturn, assertState, checkValidNumber, toArray, UnreachableError, } from '@strictly/base';
+import { flattenAccessorsOf, flattenTypeDefsOf, flattenValueTypeTo, jsonPathPop, mobxCopy, valuePathToTypePath, } from '@strictly/define';
+import { computed, observable, runInAction, } from 'mobx';
+import { FieldConversionResult, } from 'types/field_converters';
+export class FormPresenter {
+    typeDef;
+    adapters;
+    constructor(typeDef, adapters) {
+        this.typeDef = typeDef;
+        this.adapters = adapters;
+    }
+    maybeGetAdapterForValuePath(valuePath) {
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        const typePath = valuePathToTypePath(this.typeDef, valuePath, true);
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        return this.adapters[typePath];
+    }
+    getAdapterForValuePath(valuePath) {
+        return assertExistsAndReturn(this.maybeGetAdapterForValuePath(valuePath), 'expected adapter to be defined {}', valuePath);
+    }
+    typePath(valuePath) {
+        return valuePathToTypePath(this.typeDef, valuePath, true);
+    }
+    setFieldValueAndValidate(model, valuePath, value) {
+        return this.internalSetFieldValue(model, valuePath, value, true);
+    }
+    setFieldValue(model, valuePath, value) {
+        return this.internalSetFieldValue(model, valuePath, value, false);
+    }
+    addListItem(model, valuePath, elementValue, index) {
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        const listValuePath = valuePath;
+        const accessor = model.accessors[valuePath];
+        const listTypePath = this.typePath(valuePath);
+        const definedIndex = index ?? accessor.value.length;
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        const elementTypePath = `${listTypePath}.*`;
+        const elementAdapter = assertExistsAndReturn(this.adapters[elementTypePath], 'no adapter specified for list {} ({})', elementTypePath, valuePath);
+        // TODO validation on new elements
+        const element = elementValue != null
+            ? elementValue[0]
+            : elementAdapter.create(
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            elementTypePath, model.value);
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const originalList = accessor.value;
+        const newList = [
+            ...originalList.slice(0, definedIndex),
+            element,
+            ...originalList.slice(definedIndex),
+        ];
+        // shuffle the overrides around to account for new indices
+        // to so this we need to sort the array indices in descending order
+        const targetPaths = Object.keys(model.fieldOverrides).filter(function (v) {
+            return v.startsWith(`${listValuePath}.`);
+        }).map(function (v) {
+            const parts = v.substring(listValuePath.length + 1).split('.');
+            const index = parseInt(parts[0]);
+            return [
+                index,
+                parts.slice(1),
+            ];
+        }).filter(function ([index]) {
+            return index >= definedIndex;
+        }).sort(function ([a], [b]) {
+            // descending
+            return b - a;
+        });
+        runInAction(function () {
+            targetPaths.forEach(function ([index, postfix,]) {
+                // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                const fromJsonPath = [
+                    listValuePath,
+                    `${index}`,
+                    ...postfix,
+                ].join('.');
+                // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                const toJsonPath = [
+                    listValuePath,
+                    `${index + 1}`,
+                    ...postfix,
+                ].join('.');
+                const fieldOverride = model.fieldOverrides[fromJsonPath];
+                delete model.fieldOverrides[fromJsonPath];
+                model.fieldOverrides[toJsonPath] = fieldOverride;
+                const error = model.errors[fromJsonPath];
+                delete model.errors[fromJsonPath];
+                model.errors[toJsonPath] = error;
+            });
+            accessor.set(newList);
+            // delete any value overrides so the new list isn't shadowed
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            delete model.fieldOverrides[listValuePath];
+        });
+    }
+    removeListItem(model, elementValuePath) {
+        const [listValuePath, elementIndexString,] = assertExistsAndReturn(jsonPathPop(elementValuePath), 'expected a path with two or more segments {}', elementValuePath);
+        const accessor = model.accessors[listValuePath];
+        const elementIndex = checkValidNumber(parseInt(elementIndexString), 'unexpected index {} ({})', elementIndexString, elementValuePath);
+        const newList = [...accessor.value];
+        assertState(elementIndex >= 0 && elementIndex < newList.length, 'invalid index from path {} ({})', elementIndex, elementValuePath);
+        newList.splice(elementIndex, 1);
+        // shuffle the overrides around to account for new indices
+        // to so this we need to sort the array indices in descending order
+        const targetPaths = Object.keys(model.fieldOverrides).filter(function (v) {
+            return v.startsWith(`${listValuePath}.`);
+        }).map(function (v) {
+            const parts = v.substring(listValuePath.length + 1).split('.');
+            const index = parseInt(parts[0]);
+            return [
+                index,
+                parts.slice(1),
+            ];
+        }).filter(function ([index]) {
+            return index > elementIndex;
+        }).sort(function ([a], [b]) {
+            // ascending
+            return a - b;
+        });
+        runInAction(function () {
+            targetPaths.forEach(function ([index, postfix,]) {
+                // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                const fromJsonPath = [
+                    listValuePath,
+                    `${index}`,
+                    ...postfix,
+                ].join('.');
+                // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                const toJsonPath = [
+                    listValuePath,
+                    `${index - 1}`,
+                    ...postfix,
+                ].join('.');
+                const fieldOverride = model.fieldOverrides[fromJsonPath];
+                delete model.fieldOverrides[fromJsonPath];
+                model.fieldOverrides[toJsonPath] = fieldOverride;
+                const error = model.errors[fromJsonPath];
+                delete model.errors[fromJsonPath];
+                model.errors[toJsonPath] = error;
+            });
+            accessor.set(newList);
+            // delete any value overrides so the new list isn't shadowed
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            delete model.fieldOverrides[listValuePath];
+        });
+    }
+    internalSetFieldValue(model, valuePath, value, displayValidation) {
+        const { revert } = this.getAdapterForValuePath(valuePath);
+        assertExists(revert, 'setting value not supported {}', valuePath);
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions, @typescript-eslint/no-explicit-any
+        const conversion = revert(value, valuePath, model.value);
+        const accessor = model.getAccessorForValuePath(valuePath);
+        return runInAction(() => {
+            model.fieldOverrides[valuePath] = {
+                value,
+            };
+            switch (conversion.type) {
+                case FieldConversionResult.Failure:
+                    if (displayValidation) {
+                        model.errors[valuePath] = conversion.error;
+                    }
+                    if (conversion.value != null && accessor != null) {
+                        accessor.set(conversion.value[0]);
+                    }
+                    return false;
+                case FieldConversionResult.Success:
+                    delete model.errors[valuePath];
+                    accessor?.set(conversion.value);
+                    return true;
+                default:
+                    throw new UnreachableError(conversion);
+            }
+        });
+    }
+    clearFieldError(model, valuePath) {
+        const fieldOverride = model.fieldOverrides[valuePath];
+        if (fieldOverride != null) {
+            runInAction(function () {
+                delete model.errors[valuePath];
+            });
+        }
+    }
+    clearFieldValue(model, valuePath) {
+        const typePath = this.typePath(valuePath);
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        const adapter = this.adapters[typePath];
+        if (adapter == null) {
+            return;
+        }
+        const { convert, create, } = adapter;
+        const accessor = model.accessors[valuePath];
+        const value = accessor == null ? create(valuePath, model.value) : accessor.value;
+        const displayValue = convert(value, valuePath, model.value);
+        runInAction(function () {
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            model.fieldOverrides[valuePath] = {
+                value: displayValue,
+            };
+        });
+    }
+    clearAll(model, value) {
+        runInAction(() => {
+            model.errors = {};
+            // TODO this isn't correct, should reload from value
+            model.fieldOverrides = {};
+            model.value = mobxCopy(this.typeDef, value);
+        });
+    }
+    validateField(model, valuePath) {
+        const { convert, revert, create, } = this.getAdapterForValuePath(valuePath);
+        const fieldOverride = model.fieldOverrides[valuePath];
+        const accessor = model.getAccessorForValuePath(valuePath);
+        const storedValue = convert(accessor != null
+            ? accessor.value
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            : create(valuePath, model.value), 
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        valuePath, model.value);
+        const value = fieldOverride != null
+            ? fieldOverride.value
+            : storedValue;
+        const dirty = storedValue !== value;
+        assertExists(revert, 'changing field directly not supported {}', valuePath);
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        const conversion = revert(value, valuePath, model.value);
+        return runInAction(function () {
+            switch (conversion.type) {
+                case FieldConversionResult.Failure:
+                    model.errors[valuePath] = conversion.error;
+                    if (conversion.value != null && accessor != null && dirty) {
+                        accessor.set(conversion.value[0]);
+                    }
+                    return false;
+                case FieldConversionResult.Success:
+                    delete model.errors[valuePath];
+                    if (accessor != null && dirty) {
+                        accessor.set(conversion.value);
+                    }
+                    return true;
+                default:
+                    throw new UnreachableError(conversion);
+            }
+        });
+    }
+    validateAll(model) {
+        // sort keys shortest to longest so parent changes don't overwrite child changes
+        const accessors = toArray(model.accessors).toSorted(function ([a], [b]) {
+            return a.length - b.length;
+        });
+        return runInAction(() => {
+            return accessors.reduce((success, [valuePath, accessor,]) => {
+                // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                const adapterPath = valuePath;
+                const adapter = this.maybeGetAdapterForValuePath(adapterPath);
+                if (adapter == null) {
+                    // no adapter == there should be nothing specified for this field
+                    return success;
+                }
+                const { convert, revert, } = adapter;
+                if (revert == null) {
+                    // no convert method means this field is immutable
+                    return success;
+                }
+                const fieldOverride = model.fieldOverrides[adapterPath];
+                const storedValue = convert(accessor.value, valuePath, model.value);
+                const value = fieldOverride != null
+                    ? fieldOverride.value
+                    : storedValue;
+                // TODO more nuanced comparison
+                const dirty = fieldOverride != null && fieldOverride.value !== storedValue;
+                const conversion = revert(value, valuePath, model.value);
+                switch (conversion.type) {
+                    case FieldConversionResult.Failure:
+                        model.errors[adapterPath] = conversion.error;
+                        if (conversion.value != null && dirty) {
+                            accessor.set(conversion.value[0]);
+                        }
+                        return false;
+                    case FieldConversionResult.Success:
+                        if (dirty) {
+                            accessor.set(conversion.value);
+                        }
+                        delete model.errors[adapterPath];
+                        return success;
+                    default:
+                        throw new UnreachableError(conversion);
+                }
+            }, true);
+        });
+    }
+    createModel(value) {
+        return new FormModel(this.typeDef, value, this.adapters);
+    }
+}
+export class FormModel {
+    typeDef;
+    adapters;
+    @observable.ref
+    accessor value;
+    @observable.shallow
+    accessor fieldOverrides;
+    @observable.shallow
+    accessor errors = {};
+    flattenedTypeDefs;
+    constructor(typeDef, value, adapters) {
+        this.typeDef = typeDef;
+        this.adapters = adapters;
+        this.value = mobxCopy(typeDef, value);
+        this.flattenedTypeDefs = flattenTypeDefsOf(typeDef);
+        // pre-populate field overrides for consistent behavior when default information is overwritten
+        // then returned to
+        this.fieldOverrides = flattenValueTypeTo(typeDef, this.value, () => { }, (_t, value, _setter, typePath, valuePath) => {
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            const adapter = this.adapters[typePath];
+            if (adapter == null) {
+                return;
+            }
+            const { convert, revert, } = adapter;
+            if (revert == null) {
+                // no need to store a temporary value if the value cannot be written back
+                return;
+            }
+            const displayValue = convert(value, valuePath, this.value);
+            return {
+                value: displayValue,
+            };
+        });
+    }
+    @computed
+    get fields() {
+        return new Proxy(this.knownFields, {
+            get: (target, prop) => {
+                // eslint-disable-next-line @typescript-eslint/consistent-type-assertions, @typescript-eslint/no-explicit-any
+                const field = target[prop];
+                if (field != null) {
+                    return field;
+                }
+                if (typeof prop === 'string') {
+                    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                    return this.maybeSynthesizeFieldByValuePath(prop);
+                }
+            },
+        });
+    }
+    @computed
+    get knownFields() {
+        return flattenValueTypeTo(this.typeDef, this.value, () => { }, 
+        // TODO swap these to valuePath, typePath in flatten
+        (_t, _v, _setter, typePath, valuePath) => {
+            return this.synthesizeFieldByPaths(
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            valuePath, 
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            typePath);
+        });
+    }
+    maybeSynthesizeFieldByValuePath(valuePath) {
+        let typePath;
+        try {
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            typePath = valuePathToTypePath(this.typeDef, 
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            valuePath, true);
+        }
+        catch (e) {
+            // TODO make jsonValuePathToTypePath return null in the event of an invalid
+            // value path instead of throwing an exception
+            // assume that the path was invalid
+            return;
+        }
+        return this.synthesizeFieldByPaths(valuePath, typePath);
+    }
+    synthesizeFieldByPaths(valuePath, typePath) {
+        const adapter = this.adapters[typePath];
+        if (adapter == null) {
+            // invalid path, which can happen
+            return;
+        }
+        const { convert, create, } = adapter;
+        const fieldOverride = this.fieldOverrides[valuePath];
+        const accessor = this.getAccessorForValuePath(valuePath);
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        const fieldTypeDef = this.flattenedTypeDefs[typePath];
+        const value = fieldOverride
+            ? fieldOverride.value
+            : convert(accessor != null
+                ? accessor.value
+                : fieldTypeDef != null
+                    ? mobxCopy(fieldTypeDef, 
+                    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                    create(valuePath, this.value))
+                    // fake values can't be copied
+                    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                    : create(valuePath, this.value), 
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            valuePath, this.value);
+        const error = this.errors[valuePath];
+        return {
+            value,
+            error,
+            // if we can't write it back, then we have to disable it
+            disabled: this.isDisabled(valuePath),
+            required: this.isRequired(valuePath),
+        };
+    }
+    getAccessorForValuePath(valuePath) {
+        // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+        return this.accessors[valuePath];
+    }
+    @computed
+    // should only be referenced internally, so loosely typed
+    get accessors() {
+        return flattenAccessorsOf(this.typeDef, this.value, (value) => {
+            this.value = mobxCopy(this.typeDef, value);
+        });
+    }
+    isDisabled(_valuePath) {
+        // TODO infer from types
+        return false;
+    }
+    isRequired(_valuePath) {
+        // TODO infer from types
+        return false;
+    }
+}

package/.out/core/mobx/specs/flattened_adapters_of_fields.tests.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,13 @@
+const error = Symbol();
+describe('FlattenedAdaptersOfFIelds', function () {
+    it('maps the converter types', function () {
+        expectTypeOf().toEqualTypeOf();
+    });
+    it('ignores extraneous types not listed in the fields', function () {
+        expectTypeOf().toEqualTypeOf();
+    });
+    it('handles multiple fields fields', function () {
+        expectTypeOf().toEqualTypeOf();
+    });
+});
+export {};

package/.out/core/mobx/specs/flattened_list_type_defs_of.tests.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,16 @@
+import { list, nullType, numberType, object, record, stringType, union, } from '@strictly/define';
+describe('FlattenedListTypeDefsOf', function () {
+    it('filters lists types', function () {
+        const listTypeDef = list(numberType);
+        const recordTypeDef = record(stringType);
+        const objectTypeDef = object();
+        const unionTypeDef = union().add('0', numberType).add('1', nullType);
+        const typeDef = object()
+            .set('literal', numberType)
+            .set('list', listTypeDef)
+            .set('record', recordTypeDef)
+            .set('object', objectTypeDef)
+            .set('union', unionTypeDef);
+        expectTypeOf().toEqualTypeOf();
+    });
+});

package/.out/core/mobx/specs/form_presenter.tests.d.ts

@@ -0,0 +1 @@
+export {};