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

11 months ago

2.7.1

11 months ago

2.7.41

11 months ago

2.6.175

11 months ago

2.6.194

11 months ago

2.6.195

11 months ago

2.6.173

11 months ago

2.7.51

11 months ago

2.7.50

11 months ago

2.6.177

11 months ago

2.6.170

11 months ago

2.6.169

11 months ago

2.6.168

12 months ago

2.6.163

12 months ago

2.6.162

12 months ago

2.6.159

12 months ago

2.6.158

12 months ago

2.6.157

12 months ago

2.6.156

12 months ago

2.6.155

12 months ago

2.6.154

12 months ago

2.6.153

12 months 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