@open-formulieren/formio-builder/lib/esm/components/builder/rich-text.js

An opinionated Formio webform builder for Open Forms

import { jsxs as s, jsx as o } from "react/jsx-runtime";
import { CKEditor as f } from "@ckeditor/ckeditor5-react";
import { useFormikContext as u, useField as c } from "formik";
import { useContext as d } from "react";
import x from "../CKEditor.js";
import "react-intl";
import "../formio/tabs.js";
import h from "../formio/component.js";
import C from "../formio/description.js";
import "@floating-ui/react";
import "clsx";
import { BuilderContext as b } from "../../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 "./messages.js";
/* empty css              */
import "react-use";
import "../../registry/addressNL/edit.js";
import "../../registry/validation.js";
/* empty css                                    */
import "../../registry/bsn/edit.js";
import "../../registry/checkbox/edit.js";
import "../../registry/children/edit.js";
import "../../registry/columns/edit.js";
import "zod";
/* empty css                                   */
import "../../registry/content/edit.js";
import "../../registry/cosignV1/edit.js";
import "../../registry/cosignV2/edit.js";
import "../../registry/cosignV2/edit-validation.js";
import "../../registry/currency/edit.js";
import "../../registry/currency/edit-validation.js";
import "../../registry/customerProfile/edit.js";
import "../../registry/customerProfile/edit-validation.js";
import "../../registry/customerProfile/preview.js";
import "../../registry/date/edit.js";
import "../../registry/date/edit-validation.js";
import "../../registry/datetime/edit.js";
import "../../registry/datetime/edit-validation.js";
import "../../registry/editgrid/edit.js";
/* empty css                                            */
import "../../registry/email/edit.js";
import "../../registry/email/edit-validation.js";
/* empty css                                 */
import "../../registry/fieldset/edit.js";
import "../../registry/file/edit.js";
import "../../registry/file/edit-validation.js";
import "../../registry/iban/edit.js";
import "../../registry/iban/edit-validation.js";
import "../../registry/licenseplate/edit.js";
import "../../registry/licenseplate/edit-validation.js";
import "proj4leaflet";
import "../../registry/map/edit.js";
import "@open-formulieren/leaflet-tools/lib/tiles.js";
import "@open-formulieren/leaflet-tools";
import "react-leaflet";
import "react-leaflet-draw";
/* empty css                               */
import "../../registry/npFamilyMembers/edit.js";
import "../../registry/number/edit.js";
import "../../registry/number/edit-validation.js";
import "../../registry/partners/edit.js";
import "../../registry/phonenumber/edit.js";
import "../../registry/postcode/edit.js";
import "../../registry/postcode/edit-validation.js";
import "../../registry/radio/edit.js";
import "../../registry/select/edit.js";
import "../../registry/selectboxes/edit.js";
import "../../registry/signature/edit.js";
import "react-signature-canvas";
import "../../registry/softRequiredErrors/edit.js";
import "../../registry/textarea/edit.js";
import "../../registry/textarea/edit-validation.js";
import "../../registry/textfield/edit.js";
import "../../registry/time/edit.js";
import g from "./templating-hint.js";
import "./prefill/identifierRole.js";
import "./i18n.js";
import "./tabs.js";
import "@open-formulieren/monaco-json-editor";
import "./values/values-src.js";
/* empty css                       */
const rt = ({
  name: t,
  required: i,
  supportsBackendTemplating: m = !1
}) => {
  const {
    richTextColors: p
  } = d(b), {
    values: {
      type: e
    }
  } = u(), [n, , r] = c(t);
  return /* @__PURE__ */ s(h, { type: e, field: t, required: i, className: "offb-rich-text", children: [
    /* @__PURE__ */ o(f, { editor: x, config: {
      link: {
        decorators: {
          openInNewTab: {
            mode: "manual",
            label: "Open in a new tab",
            defaultValue: !0,
            // This option will be selected by default.
            attributes: {
              target: "_blank",
              rel: "noopener noreferrer"
            }
          }
        }
      },
      fontColor: {
        colors: p
      }
    }, data: n.value || "", onChange: (T, a) => {
      const l = a.getData();
      r.setValue(l);
    }, onBlur: () => {
      r.setTouched(!0);
    } }),
    m && /* @__PURE__ */ o(C, { text: /* @__PURE__ */ o(g, {}) })
  ] });
};
export {
  rt as default
};