@altiore/form - npm Package Compare versions

Comparing version 0.3.33 to 0.3.34

package.json

		{
		"name": "@altiore/form",
		"version": "0.3.33",
		"version": "0.3.34",
		"description": "Form helper for building powerful forms",
		@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

		@@ -52,1 +52,43 @@ # Altiore Form
		```

		## Custom form

		\\Custom form allows adding fields of any type to vary your forms. Adding and deleting fields to form gives you new advantages.

		```tsx
		import React, {useCallback} from 'react';

		import {createField, Form} from '@altiore/form';

		export const Field = createField(
		({
		errors,
		inputRef,
		name,
		/* you can add any extra fields here: */ label,
		}) => {
		return (
		<div>
		<label htmlFor="input-id">
		{label}
		<input id="input-id" name={name} ref="{inputRef}" />
		</label>
		<span>{errors[0]}</span>
		</div>
		);
		},
		);

		const MyForm = () => {
		const handleSubmit = useCallback((values) => {
		console.log('form.values is', values);
		}, []);

		return (
		<Form onSubmit={handleSubmit}>
		<Field label="Field Label" name="name" />
		<button type="submit">Submit</button>
		</Form>
		);
		};
		```

README.RU.md

		@@ -52,1 +52,43 @@ # Altiore Form
		```

		## Пользовательская форма

		\\Пользовательский вариант дает возможность разнообразить форму

		```tsx
		import React, {useCallback} from 'react';

		import {createField, Form} from '@altiore/form';

		export const Field = createField(
		({
		errors,
		inputRef,
		name,
		/* you can add any extra fields here: */ label,
		}) => {
		return (
		<div>
		<label htmlFor="input-id">
		{label}
		<input id="input-id" name={name} ref="{inputRef}" />
		</label>
		<span>{errors[0]}</span>
		</div>
		);
		},
		);

		const MyForm = () => {
		const handleSubmit = useCallback((values) => {
		console.log('form.values is', values);
		}, []);

		return (
		<Form onSubmit={handleSubmit}>
		<Field label="Field Label" name="name" />
		<button type="submit">Submit</button>
		</Form>
		);
		};
		```

New alerts