Skip to content

Releases: toggle-corp/toggle-form

v2.0.1

12 Dec 10:27
8f1e812
Compare
Choose a tag to compare
  • Fix issue with declaration files

v2.0.0

15 Nov 05:40
ea54c64
Compare
Choose a tag to compare

Build Changes

  • Update build to be tree-shakable
  • Update babel config to use polyfill-corejs3 usage pure
  • Update package.json and remove unused dependencies
  • Use functions from fujs
  • Setup storybook using vite
  • Style storybook
  • Add unimported config

Non Breaking Changes

  • Rename type args
  • Only run "required" validation when the field has explicitly changed (not when deps have changed)
  • Pass depsChanged to futher invocation and execute validation when depsChanged is true from parent and field also has dependencies

Breaking Changes

  • Change literal schema to object with these fields
    • required
    • requiredValidation
    • forceValue
    • defaultValue
    • validations
  • Rename symbol internal to nonFieldError
  • Update arguments order in accumulate functions:
    • accumulateValues
    • accumulateDifferentialErrors
  • Remove special validation functions:
    • defaultUndefinedType (use { defaultValue: undefinedValue })
    • defaultEmptyArrayType (use { defaultValue: [] })
    • forceNullType (use { forceValue: nullValue })
    • forceUndefinedType (use { forceValue: undefinedValue })
    • forceEmptyArrayType (use { forceValue: [] })
  • Remove fieldDependencies in object schema (use addCondition instead)

Example

Old Schema

const schema: FormSchema = {
    fields: (value): FormSchemaFields => {
        let baseSchema: FormSchemaFields = {
            firstName: [requiredStringCondition, lengthGreaterThanCondition(10)],
            detailed: [],
            age: [forceNullType],
            address: [forceNullType],
        };
        if (value?.detailed) {
            baseSchema = {
                ...baseSchema,
                age: [requiredCondition],
                address: [requiredStringCondition],
            };
        }
        return baseSchema;
    },
    fieldDependencies: () => ({
        age: ['detailed'],
        address: ['detailed'],
    }),
};

New Schema

const schema: FormSchema = {
    fields: (value): FormSchemaFields => {
        let baseSchema: FormSchemaFields = {
            firstName: {
                required: true,
                requiredCondition: requiredStringCondition,
                validations: [lengthGreaterThanCondition(10)],
            },
            detailed: {},
        };
        baseSchema = addCondition(
            baseSchema,
            value,
            ['detailed'] as const,
            ['age', 'address'] as const,
            (props) => (props?.detailed ? {
                age: { required: true },
                address: {
                    required: true,
                    requiredCondition: requiredStringCondition,
                },
            } : {
                age: { forceValue: nullValue },
                address: { forceValue: nullValue },
            }),
        );
        return baseSchema;
    },
};