UNPKG

@open-formulieren/formio-builder

Version:

An opinionated Formio webform builder for Open Forms

164 lines (163 loc) 5.9 kB
import { jsxs as o, jsx as t } from "react/jsx-runtime"; import { useFormikContext as h } from "formik"; import { useContext as p } 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 r } from "../../components/formio/tabs.js"; import "clsx"; import { useErrorChecker as E } from "../../utils/errors.js"; /* empty css */ import "@floating-ui/react"; /* empty css */ import "@formio/vanilla-text-mask"; import "formiojs"; import { DateFieldMultiple as x } from "../../components/formio/datefield.js"; import "lodash"; /* empty css */ import "react-select"; import "dompurify"; import "../../components/formio/datagrid.js"; 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 "@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"; /* empty css */ import s from "./validation/index.js"; const N = () => { const i = d(), [n, l] = F(), { values: { multiple: m = !1 } } = h(), { formType: u } = p(f), c = u === "appointment", { hasAnyError: e } = E(); return A(c ? ["required"] : ["required", "minDate", "maxDate", "invalid_date"]), /* @__PURE__ */ o(T, { children: [ /* @__PURE__ */ o(C, { children: [ /* @__PURE__ */ t(B, { hasErrors: e("label", "key", "description", "tooltip", "showInSummary", "showInEmail", "showInPDF", "multiple", "hidden", "clearOnHide", "isSensitiveData", "defaultValue", "disabled") }), /* @__PURE__ */ t(j, { hasErrors: e("conditional") }), /* @__PURE__ */ t(J, { hasErrors: e("validate", "openForms.minDate", "openForms.maxDate", "datePicker.minDate", "datePicker.maxDate") }), /* @__PURE__ */ t(_, { hasErrors: e("registration") }), /* @__PURE__ */ t(z, { hasErrors: e("prefill") }), /* @__PURE__ */ t(G, { hasErrors: e("openForms.translations") }) ] }), /* @__PURE__ */ o(r, { children: [ /* @__PURE__ */ t(b, {}), /* @__PURE__ */ t(v, { isManuallySetRef: n, generatedValue: l }), /* @__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: m }), /* @__PURE__ */ t(w, {}) ] }), /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(k, {}) }), /* @__PURE__ */ o(r, { children: [ /* @__PURE__ */ t(R, {}), /* @__PURE__ */ t(L, {}), /* @__PURE__ */ t(s, { constraint: "minDate" }), /* @__PURE__ */ t(s, { constraint: "maxDate" }), /* @__PURE__ */ t(q, {}) ] }), /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(H, {}) }), /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(K, {}) }), /* @__PURE__ */ t(r, { children: /* @__PURE__ */ t(O, { propertyLabels: { label: i.formatMessage(a.label), description: i.formatMessage(a.description), tooltip: i.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: i }) => { const n = d(), { formType: l } = p(f), m = n.formatMessage({ id: "FffJxu", defaultMessage: [{ type: 0, value: "This will be the initial value for this field before user interaction." }] }); return l === "appointment" ? null : /* @__PURE__ */ t(x, { name: "defaultValue", label: /* @__PURE__ */ t(D, { ...a.defaultValue }), tooltip: m, multiple: i }); }; export { N as default };