UNPKG

@open-formulieren/formio-builder

Version:

An opinionated Formio webform builder for Open Forms

72 lines (71 loc) 2.84 kB
import { jsx as e, jsxs as o } from "react/jsx-runtime"; import { useFormikContext as m, FieldArray as u } from "formik"; import { useIntl as h, FormattedMessage as t } from "react-intl"; import "../../formio/tabs.js"; import c from "../../formio/component.js"; import "@floating-ui/react"; import "react"; import "clsx"; import "../../../context.js"; import "@formio/vanilla-text-mask"; import "formiojs"; /* empty css */ import "lodash"; /* empty css */ import "react-select"; import "dompurify"; import "../../formio/datagrid.js"; import f from "./option-row.js"; function O({ name: a, withOptionDescription: l }) { const s = h(), { getFieldProps: d } = m(), { value: n = [] } = d(a), p = s.formatMessage({ id: "DJWATl", defaultMessage: [{ type: 0, value: "The values that can be picked for this field. Values are the text that is submitted with the form data. Labels are the text next to radio buttons, checkboxes and options in dropdowns." }] }); return /* @__PURE__ */ e(c, { type: "datagrid", label: /* @__PURE__ */ e(t, { id: "j2vQH3", defaultMessage: [{ type: 0, value: "Values" }] }), tooltip: p, children: /* @__PURE__ */ e(u, { name: a, children: (r) => /* @__PURE__ */ o("table", { className: "table table-bordered", children: [ /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ o("tr", { children: [ /* @__PURE__ */ e("th", {}), /* @__PURE__ */ e("th", { className: "field-required", children: /* @__PURE__ */ e(t, { id: "FOlQaP", defaultMessage: [{ type: 0, value: "Label" }] }) }), /* @__PURE__ */ e("th", { className: "field-required", children: /* @__PURE__ */ e(t, { id: "wRNK2B", defaultMessage: [{ type: 0, value: "Value" }] }) }), /* @__PURE__ */ e("th", { children: /* @__PURE__ */ e("span", { className: "sr-only", children: /* @__PURE__ */ e(t, { id: "RuAQwk", defaultMessage: [{ type: 0, value: "Add/remove" }] }) }) }) ] }) }), /* @__PURE__ */ e("tbody", { children: n.map((b, i) => /* @__PURE__ */ e(f, { name: a, index: i, arrayHelpers: r, withOptionDescription: l }, i)) }), /* @__PURE__ */ e("tfoot", { children: /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e("td", { colSpan: 4, children: /* @__PURE__ */ o("button", { type: "button", className: "btn btn-primary formio-button-add-row", onClick: () => r.push({ value: "", label: "", openForms: { translations: {} } }), children: [ /* @__PURE__ */ e("i", { className: "fa fa-plus", "aria-hidden": "true" }), /* @__PURE__ */ e(t, { id: "p7g2h+", defaultMessage: [{ type: 0, value: "Add another" }] }) ] }) }) }) }) ] }) }) }); } export { O as default };