2.7.53 • Published 6 months ago

react-declarative-lite v2.7.53

Weekly downloads
-
License
MIT
Repository
github
Last release
6 months ago

⚛️ react-declarative-lite

The lite verion of the react-declarative

npm

meme

This is a lighter version of react-declarative which exports the <One /> component and dependencies only and as such makes the library slightly faster and smaller. Unlike react-declarative, it doesn't provide any additional overhead like state management. For a note, that library should be used when you want to use <One /> forms in existing app

Contribute

!IMPORTANT Made by using react-declarative to solve your problems. ⭐Star and 💻Fork It on github will be appreciated

Usage

npm install react-declarative-lite

Example

import { One, TypedField, FieldType, getInvalidFields } from "react-declarative-lite";

export const fields: TypedField[] = [
    {
        type: FieldType.Outline,
        fields: [
            {
                type: FieldType.Typography,
                typoVariant: 'h6',
                placeholder: 'Example form',
            },
            {
                type: FieldType.Text,
                validation: {
                    required: true,
                    numeric: true,
                    minNum: 5
                },
                name: 'first_field',
            },
            {
                type: FieldType.Text,
                validation: {
                    required: true,
                },
                name: 'second_field',
            },
            {
                type: FieldType.Text,
                validation: {
                    required: true,
                },
                name: 'third_field',
            },
            {
                type: FieldType.Button,
                sx: {
                    mt: 3
                },
                buttonVariant: 'contained',
                title: 'Submit',
                click: (name, e, data, payload) => {
                    const errors = getInvalidFields(fields, data, payload);
                    if (errors) {
                        const [error] = errors;
                        notify(`${error.title}: ${error.error}`);
                    } else {
                        notify("The form is valid");
                    }
                },
            }
        ]
    }
];

...

<One
    fields={fields}
/>
2.7.53

6 months ago

2.7.52

6 months ago

2.7.2

12 months ago

2.7.1

12 months ago

2.7.41

11 months ago

2.6.175

12 months ago

2.6.194

12 months ago

2.6.195

12 months ago

2.6.173

12 months ago

2.7.51

11 months ago

2.7.50

11 months ago

2.6.177

12 months ago

2.6.170

1 year ago

2.6.169

1 year ago

2.6.168

1 year ago

2.6.163

1 year ago

2.6.162

1 year ago

2.6.159

1 year ago

2.6.158

1 year ago

2.6.157

1 year ago

2.6.156

1 year ago

2.6.155

1 year ago

2.6.154

1 year ago

2.6.153

1 year ago

2.6.151

1 year ago

2.6.149

1 year ago

2.6.148

1 year ago

2.6.147

1 year ago

2.6.146

1 year ago

2.6.144

1 year ago

2.6.136

1 year ago

2.6.134

1 year ago

2.6.133

1 year ago

2.6.132

1 year ago