UNPKG

@open-formulieren/formio-builder

Version:

An opinionated Formio webform builder for Open Forms

199 lines (198 loc) 7.07 kB
import { jsxs as e, jsx as t } from "react/jsx-runtime"; import { useFormikContext as h } from "formik"; import { useContext as s } from "react"; import { useIntl as d, FormattedMessage as D } from "react-intl"; import b from "../../components/builder/label.js"; import g from "../../components/builder/description.js"; import y from "../../components/builder/tooltip.js"; import { BuilderContext as f } from "../../context.js"; import { Tabs as T, TabList as C, TabPanel as i } from "../../components/formio/tabs.js"; import "clsx"; import { useErrorChecker as E } from "../../utils/errors.js"; /* empty css */ import "@floating-ui/react"; /* empty css */ import "../../components/formio/textfield.js"; import { DateFieldMultiple as x } from "../../components/formio/datefield.js"; import "../../components/formio/datetimefield.js"; import "../../components/formio/timefield.js"; /* empty css */ import "react-select"; import "dompurify"; import "../../components/formio/textarea.js"; import "../../components/formio/datagrid.js"; /* empty css */ import { LABELS as a } from "../../components/builder/messages.js"; import v, { useDeriveComponentKey as F } from "../../components/builder/key.js"; import V from "../../components/builder/multiple.js"; import M from "../../components/builder/hidden.js"; import P from "../../components/builder/clear-on-hide.js"; import S from "../../components/builder/is-sensitive-data.js"; import w from "../../components/builder/readonly.js"; import I from "../../components/builder/presentation-config.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 "./index.js"; import "../datetime/index.js"; import "../editgrid/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 k from "../../components/builder/simple-conditional.js"; import R from "../../components/builder/validate/required.js"; import L from "../../components/builder/validate/validator-select.js"; import q, { useManageValidatorsTranslations as A } from "../../components/builder/validate/i18n.js"; import H from "../../components/builder/registration/registration-attribute.js"; import { PrefillConfiguration as K } from "../../components/builder/prefill/index.js"; import { ComponentTranslations as O } from "../../components/builder/i18n.js"; import { Basic as B, Advanced as j, Validation as J, Registration as _, Prefill as z, Translations as G } from "../../components/builder/tabs.js"; import "@open-formulieren/monaco-json-editor"; import "react-use"; import "../../components/builder/values/values-src.js"; import "lodash"; /* empty css */ import p from "./validation/index.js"; const N = () => { const o = d(), [m, n] = F(), { values: { multiple: l = !1 } } = h(), { formType: u } = s(f), c = u === "appointment", { hasAnyError: r } = E(); return A(c ? ["required"] : ["required", "minDate", "maxDate", "invalid_date"]), /* @__PURE__ */ e(T, { children: [ /* @__PURE__ */ e(C, { children: [ /* @__PURE__ */ t(B, { hasErrors: r("label", "key", "description", "tooltip", "showInSummary", "showInEmail", "showInPDF", "multiple", "hidden", "clearOnHide", "isSensitiveData", "defaultValue", "disabled") }), /* @__PURE__ */ t(j, { hasErrors: r("conditional") }), /* @__PURE__ */ t(J, { hasErrors: r("validate", "openForms.minDate", "openForms.maxDate", "datePicker.minDate", "datePicker.maxDate") }), /* @__PURE__ */ t(_, { hasErrors: r("registration") }), /* @__PURE__ */ t(z, { hasErrors: r("prefill") }), /* @__PURE__ */ t(G, { hasErrors: r("openForms.translations") }) ] }), /* @__PURE__ */ e(i, { children: [ /* @__PURE__ */ t(b, {}), /* @__PURE__ */ t(v, { isManuallySetRef: m, generatedValue: n }), /* @__PURE__ */ t(g, {}), /* @__PURE__ */ t(y, {}), /* @__PURE__ */ t(I, {}), /* @__PURE__ */ t(V, {}), /* @__PURE__ */ t(M, {}), /* @__PURE__ */ t(P, {}), /* @__PURE__ */ t(S, {}), /* @__PURE__ */ t(Q, { multiple: l }), /* @__PURE__ */ t(w, {}) ] }), /* @__PURE__ */ t(i, { children: /* @__PURE__ */ t(k, {}) }), /* @__PURE__ */ e(i, { children: [ /* @__PURE__ */ t(R, {}), /* @__PURE__ */ t(L, {}), /* @__PURE__ */ t(p, { constraint: "minDate" }), /* @__PURE__ */ t(p, { constraint: "maxDate" }), /* @__PURE__ */ t(q, {}) ] }), /* @__PURE__ */ t(i, { children: /* @__PURE__ */ t(H, {}) }), /* @__PURE__ */ t(i, { children: /* @__PURE__ */ t(K, {}) }), /* @__PURE__ */ t(i, { children: /* @__PURE__ */ t(O, { propertyLabels: { label: o.formatMessage(a.label), description: o.formatMessage(a.description), tooltip: o.formatMessage(a.tooltip) } }) }) ] }); }; N.defaultValues = { // basic tab label: "", key: "", description: "", tooltip: "", showInSummary: !0, showInEmail: !1, showInPDF: !0, multiple: !1, hidden: !1, clearOnHide: !0, isSensitiveData: !1, defaultValue: "", disabled: !1, // Advanced tab conditional: { show: void 0, when: "", eq: "" }, // Validation tab validate: { required: !1, plugins: [] }, translatedErrors: {}, datePicker: { minDate: null, maxDate: null }, openForms: { translations: {}, minDate: { mode: "" }, maxDate: { mode: "" } }, // Registration tab registration: { attribute: "" }, // Prefill tab prefill: { plugin: "", attribute: "", identifierRole: "main" } }; const Q = ({ multiple: o }) => { const m = d(), { formType: n } = s(f), l = m.formatMessage({ id: "FffJxu", defaultMessage: [{ type: 0, value: "This will be the initial value for this field before user interaction." }] }); return n === "appointment" ? null : /* @__PURE__ */ t(x, { name: "defaultValue", label: /* @__PURE__ */ t(D, { ...a.defaultValue }), tooltip: l, multiple: o }); }; export { N as default };