styled-hook-form
Version:
React form library for styled-components based on grommet and react-hook-form
32 lines (31 loc) • 1.39 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SubForm = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const context_1 = require("../../../context");
const __1 = require("..");
const grommet_1 = require("grommet");
exports.default = {
title: "Form Builder/Sub Form",
};
const SubForm = () => {
const subFormFields = [
{
name: "subField1",
label: "Sub Field 1",
type: __1.FormFieldType.Text,
},
{
name: "subField2",
label: "Sub Field 2",
type: __1.FormFieldType.Text,
},
];
return (jsx_runtime_1.jsx(context_1.FormBuilderContextProvider, { children: jsx_runtime_1.jsxs(__1.FormBuilder, { children: [jsx_runtime_1.jsx(__1.FieldView, { name: "topLevel1", label: "Top level Field 1", type: __1.FormFieldType.Text }, void 0),
jsx_runtime_1.jsx(__1.FieldView, { name: "topLevel2", label: "Top level Field 2", type: __1.FormFieldType.Text }, void 0),
jsx_runtime_1.jsx(__1.FieldView, { name: "", label: "", type: __1.FormFieldType.SubForm, plain: true, formProps: {
fields: subFormFields,
} }, void 0),
jsx_runtime_1.jsx(grommet_1.Button, { type: "submit", label: "save" }, void 0)] }, void 0) }, void 0));
};
exports.SubForm = SubForm;