styled-hook-form
Version:
React form library for styled-components based on grommet and react-hook-form
45 lines (44 loc) • 1.81 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.ValuePriority = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const form_builder_1 = require("components/form-builder/form-builder");
const types_1 = require("components/form-builder/types");
const grommet_1 = require("grommet");
const ValuePriority = () => {
let fields = [
{
name: "option",
label: "Option",
type: types_1.FormFieldType.DropDown,
tip: (jsx_runtime_1.jsx(grommet_1.Box, Object.assign({ width: "medium" }, { children: "Value provided through the model prop of FormBuilder will override the one provided through the defaultValue prop of the FormField" }), void 0)),
options: [
{
text: "Opt1",
value: "opt1",
},
{
text: "Opt2",
value: "opt2",
},
{
text: "Opt3",
value: "opt3",
},
],
defaultValue: "opt2",
itemLabelKey: "text",
itemValueKey: "value",
},
];
const handleSubmit = (values) => {
alert(JSON.stringify(values));
};
return (jsx_runtime_1.jsx(grommet_1.Box, Object.assign({ width: "medium" }, { children: jsx_runtime_1.jsx(form_builder_1.FormBuilder, Object.assign({ fields: fields, onSubmit: handleSubmit, model: {
option: "opt3",
} }, { children: jsx_runtime_1.jsx(grommet_1.Button, { label: "Submit", primary: true, type: "submit" }, void 0) }), void 0) }), void 0));
};
exports.ValuePriority = ValuePriority;
exports.default = {
title: "Form Builder/Editors/DropDown/Value Priority",
};