UNPKG

@open-formulieren/formio-builder

Version:

An opinionated Formio webform builder for Open Forms

233 lines (232 loc) 7.98 kB
import { jsxs as a, jsx as e } from "react/jsx-runtime"; import { useIntl as r, FormattedMessage as i, defineMessage as m } from "react-intl"; import c from "../../components/builder/label.js"; import v from "../../components/builder/description.js"; import M from "../../components/builder/tooltip.js"; import "react"; import "../../context.js"; import { Tabs as y, TabList as R, Tab as w, TabPanel as l } from "../../components/formio/tabs.js"; import "clsx"; import { useErrorChecker as A } from "../../utils/errors.js"; /* empty css */ import "@floating-ui/react"; /* empty css */ import { TextFieldMultiple as n } from "../../components/formio/textfield.js"; import d from "../../components/formio/checkbox.js"; import "../../components/formio/datefield.js"; import "../../components/formio/datetimefield.js"; import "../../components/formio/timefield.js"; import L from "../../components/formio/panel.js"; import "formik"; import "react-select"; import "dompurify"; import "../../components/formio/textarea.js"; import "../../components/formio/datagrid.js"; /* empty css */ import { LABELS as p } from "../../components/builder/messages.js"; import E, { useDeriveComponentKey as T } from "../../components/builder/key.js"; import x from "../../components/builder/hidden.js"; import C from "../../components/builder/clear-on-hide.js"; import S from "../../components/builder/is-sensitive-data.js"; import "../addressNL/index.js"; import "../bsn/index.js"; import "../checkbox/index.js"; import "../children/index.js"; import "../columns/index.js"; import "../content/index.js"; import "../cosignV1/index.js"; import "../cosignV2/index.js"; import "../currency/index.js"; import "../customerProfile/index.js"; import "../date/index.js"; import "../datetime/index.js"; import "./index.js"; import "../email/index.js"; import "../fieldset/index.js"; import "../file/index.js"; import "../iban/index.js"; import "../licenseplate/index.js"; import "../map/index.js"; import "../npFamilyMembers/index.js"; import "../number/index.js"; import "../partners/index.js"; import "../phonenumber/index.js"; import "../postcode/index.js"; import "../radio/index.js"; import "../select/index.js"; import "../selectboxes/index.js"; import "../signature/index.js"; import "../softRequiredErrors/index.js"; import "../textarea/index.js"; import "../textfield/index.js"; import "../time/index.js"; import "@ckeditor/ckeditor5-react"; import "../../components/CKEditor.js"; /* empty css */ import "react-use"; import D from "../../components/builder/validate/required.js"; import H from "../../components/builder/validate/maxlength.js"; import "lodash"; import "../../components/builder/prefill/identifierRole.js"; import { ComponentTranslations as O } from "../../components/builder/i18n.js"; import { Basic as B, Validation as V, Translations as _ } from "../../components/builder/tabs.js"; import "@open-formulieren/monaco-json-editor"; import "../../components/builder/values/values-src.js"; /* empty css */ const u = m({ id: "ehP4dQ", defaultMessage: [{ type: 0, value: "Group label" }] }), f = m({ id: "rkJLBr", defaultMessage: [{ type: 0, value: "'Add another' text" }] }), h = m({ id: "eUowhH", defaultMessage: [{ type: 0, value: "'Save row' text" }] }), b = m({ id: "AyOwJl", defaultMessage: [{ type: 0, value: "'Remove row' text" }] }), k = () => { const t = r(), [o, g] = T(), { hasAnyError: s } = A(); return /* @__PURE__ */ a(y, { children: [ /* @__PURE__ */ a(R, { children: [ /* @__PURE__ */ e(B, { hasErrors: s("label", "key", "groupLabel", "description", "tooltip", "hidden", "clearOnHide", "isSensitiveData", "hideLabel") }), /* @__PURE__ */ e(w, { hasErrors: s("disableAddingRemovingRows", "addAnother", "saveRow", "removeRow"), children: /* @__PURE__ */ e(i, { id: "d3V6A+", defaultMessage: [{ type: 0, value: "Display" }] }) }), /* @__PURE__ */ e(V, { hasErrors: s("validate") }), /* @__PURE__ */ e(_, { hasErrors: s("openForms.translations") }) ] }), /* @__PURE__ */ a(l, { children: [ /* @__PURE__ */ e(c, {}), /* @__PURE__ */ e(E, { isManuallySetRef: o, generatedValue: g }), /* @__PURE__ */ e(v, {}), /* @__PURE__ */ e(M, {}), /* @__PURE__ */ e(I, {}), /* @__PURE__ */ e(x, {}), /* @__PURE__ */ e(C, {}), /* @__PURE__ */ e(S, {}), /* @__PURE__ */ e(K, {}) ] }), /* @__PURE__ */ a(l, { children: [ /* @__PURE__ */ e(P, {}), /* @__PURE__ */ a(L, { collapsible: !0, initialCollapsed: !0, title: /* @__PURE__ */ e(i, { id: "E/biiX", defaultMessage: [{ type: 0, value: "Button labels" }] }), children: [ /* @__PURE__ */ e(F, {}), /* @__PURE__ */ e(W, {}), /* @__PURE__ */ e(G, {}) ] }) ] }), /* @__PURE__ */ a(l, { children: [ /* @__PURE__ */ e(D, {}), /* @__PURE__ */ e(H, {}) ] }), /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(O, { propertyLabels: { label: t.formatMessage(p.label), description: t.formatMessage(p.description), tooltip: t.formatMessage(p.tooltip), groupLabel: t.formatMessage(u), addAnother: t.formatMessage(f), saveRow: t.formatMessage(h), removeRow: t.formatMessage(b) } }) }) ] }); }; k.defaultValues = { components: [], // basic tab label: "", key: "", groupLabel: "Item", description: "", tooltip: "", hidden: !1, clearOnHide: !0, isSensitiveData: !1, hideLabel: !1, // display tab disableAddingRemovingRows: !1, addAnother: "", saveRow: "", removeRow: "Cancel" }; const I = () => { const o = r().formatMessage({ id: "VhCwEK", defaultMessage: [{ type: 0, value: "The label that will be shown above each repeating group in the summary page, the submission report and the confirmation email. The index of the item will be added next to it, i.e. if you enter 'Item' it will be displayed as 'Item 1', 'Item 2', ..." }] }); return /* @__PURE__ */ e(n, { name: "groupLabel", label: /* @__PURE__ */ e(i, { ...u }), tooltip: o }); }, K = () => { const o = r().formatMessage({ id: "fagx6e", defaultMessage: [{ type: 0, value: "Hide the title/label of this component in the form." }] }); return /* @__PURE__ */ e(d, { name: "hideLabel", label: /* @__PURE__ */ e(i, { id: "dWWO3N", defaultMessage: [{ type: 0, value: "Hide label" }] }), tooltip: o }); }, P = () => { const o = r().formatMessage({ id: "AMqUHx", defaultMessage: [{ type: 0, value: "Check if you want to hide/disable the 'Add Another' and 'Remove row' buttons." }] }); return /* @__PURE__ */ e(d, { name: "disableAddingRemovingRows", label: /* @__PURE__ */ e(i, { id: "MTdKuN", defaultMessage: [{ type: 0, value: "Disable adding or removing groups" }] }), tooltip: o }); }, F = () => { const o = r().formatMessage({ id: "o83CBr", defaultMessage: [{ type: 0, value: "Set the text of the 'Add Another' button." }] }); return /* @__PURE__ */ e(n, { name: "addAnother", label: /* @__PURE__ */ e(i, { ...f }), tooltip: o }); }, W = () => { const o = r().formatMessage({ id: "/stTVr", defaultMessage: [{ type: 0, value: "Set the text of the 'Save row' button." }] }); return /* @__PURE__ */ e(n, { name: "saveRow", label: /* @__PURE__ */ e(i, { ...h }), tooltip: o }); }, G = () => { const o = r().formatMessage({ id: "gCQtSJ", defaultMessage: [{ type: 0, value: "Set the text of the 'Remove row' button." }] }); return /* @__PURE__ */ e(n, { name: "removeRow", label: /* @__PURE__ */ e(i, { ...b }), tooltip: o }); }; export { k as default };