@altiore/form - npm Package Compare versions

Comparing version 0.3.21 to 0.3.22

dist/form/form.stories.d.ts

@@ -6,1 +6,2 @@ /// <reference types="react" />
 export declare const SimplestForm: any;
+export declare const FormWithCustomField: any;

dist/form/form.stories.js

@@ -37,4 +37,3 @@ var __assign = (this && this.__assign) || function () {
     children: (React.createElement(React.Fragment, null,
-        React.createElement("input", { name: "test" }),
-        React.createElement(Field, { name: "field", label: "Custom Field" }),
+        React.createElement("input", { name: "name" }),
         React.createElement("button", { type: "submit" }, "Submit"))),
@@ -45,1 +44,24 @@ defaultValues: {
 };
+SimplestForm.parameters = {
+    docs: {
+        source: {
+            code: "\nimport React, {useCallback} from 'react';\n\nimport {Form} from '@altiore/form';\n\nconst MyForm = () => {\n\tconst handleSubmit = useCallback((values) => {\n\t\tconsole.log('form.values is', values);\n\t}, []);\n\n\treturn (\n\t\t<Form onSubmit={handleSubmit}>\n\t\t\t<input name=\"name\" />\n\t\t\t<button type=\"submit\">Submit</button>\n\t\t</Form>\n\t);\n}\n",
+        },
+    },
+};
+export var FormWithCustomField = Template.bind({});
+FormWithCustomField.args = {
+    children: (React.createElement(React.Fragment, null,
+        React.createElement(Field, { label: "Field Label", name: "name" }),
+        React.createElement("button", { type: "submit" }, "Submit"))),
+    defaultValues: {
+        field: 'initial field',
+    },
+};
+FormWithCustomField.parameters = {
+    docs: {
+        source: {
+            code: "\nimport React, {useCallback} from 'react';\n\nimport {createField, Form} from '@altiore/form';\n\nexport const Field = createField(({errors, inputRef, name, /* you can add any extra fields here: */ label}) => {\n\treturn (\n\t\t<div>\n\t\t\t<label htmlFor=\"input-id\">\n\t\t\t\t{label}\n\t\t\t\t<input id=\"input-id\" name={name} ref={inputRef} />\n\t\t\t</label>\n\t\t\t<span>{errors[0]}</span>\n\t\t</div>\n\t);\n});\n\nconst MyForm = () => {\n\tconst handleSubmit = useCallback((values) => {\n\t\tconsole.log('form.values is', values);\n\t}, []);\n\n\treturn (\n\t\t<Form onSubmit={handleSubmit}>\n\t\t\t<Field label=\"Field Label\" name=\"name\" />\n\t\t\t<button type=\"submit\">Submit</button>\n\t\t</Form>\n\t);\n}\n",
+        },
+    },
+};

package.json

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

No alert changes

Improved metrics

Total package byte prevSize

53495

increased by3.11%

Lines of code

1116

increased by2.39%

No dependency changes