@open-formulieren/formio-builder
Version:
An opinionated Formio webform builder for Open Forms
100 lines (99 loc) • 4 kB
JavaScript
import { jsxs as o, Fragment as f, jsx as t } from "react/jsx-runtime";
import { useFormikContext as u } from "formik";
import { useContext as p } from "react";
import { useIntl as h, FormattedMessage as i } from "react-intl";
import "../../formio/tabs.js";
import "clsx";
/* empty css */
import "@floating-ui/react";
/* empty css */
import { TextFieldMultiple as y } from "../../formio/textfield.js";
import { BuilderContext as _ } from "../../../context.js";
import "lodash";
/* empty css */
import "react-select";
import "dompurify";
import { TextAreaMultiple as v } from "../../formio/textarea.js";
import "../../formio/datagrid.js";
import { ComponentTranslationsContext as g } from "../i18n.js";
function L({
name: a,
withOptionDescription: d
}) {
const c = h(), {
activeLanguage: r
} = p(g), {
getFieldProps: m
} = u(), {
value: s = []
} = m(a), {
formType: b
} = p(_);
return b === "appointment" ? null : (
// Same markup as ComponentTranslations<S> body
/* @__PURE__ */ o(f, { children: [
/* @__PURE__ */ o("tbody", { children: [
/* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("th", { colSpan: 3, style: {
textAlign: "end"
}, children: /* @__PURE__ */ t(i, { id: "kg/eh1", defaultMessage: [{
type: 0,
value: "Choice/option translations"
}] }) }) }),
s.map(({
value: l,
label: n
}, e) => /* @__PURE__ */ o("tr", { children: [
/* @__PURE__ */ t("td", { children: /* @__PURE__ */ t("span", { id: `option-${e}-label`, className: "offb-table__content offb-table__content--allow-break", children: n }) }),
/* @__PURE__ */ t("td", { children: /* @__PURE__ */ t("div", { "aria-describedby": `option-${e}-label`, className: "offb-table__content offb-table__content--allow-break", children: l || "-" }) }),
/* @__PURE__ */ t("td", { children: /* @__PURE__ */ t(y, { name: `${a}[${e}]openForms.translations.${r}.label`, "aria-label": c.formatMessage({
id: "wOq8Pb",
defaultMessage: [{
type: 0,
value: 'Translation for option with value "'
}, {
type: 1,
value: "value"
}, {
type: 0,
value: '"'
}]
}, {
value: l
}) }) })
] }, `option-${e}`))
] }),
d && /* @__PURE__ */ o("tbody", { children: [
/* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("th", { colSpan: 3, style: {
textAlign: "end"
}, children: /* @__PURE__ */ t(i, { id: "aqYeqv", defaultMessage: [{
type: 0,
value: "Description translations"
}] }) }) }),
s.map(({
description: l,
value: n
}, e) => /* @__PURE__ */ o("tr", { children: [
/* @__PURE__ */ t("td", { children: /* @__PURE__ */ t("span", { id: `option-${e}-label`, children: /* @__PURE__ */ t(i, { id: "NdaqDN", defaultMessage: [{
type: 0,
value: "Option description ("
}, {
type: 8,
value: "option",
children: []
}, {
type: 0,
value: ")"
}], values: {
option: () => /* @__PURE__ */ t("code", { className: "offb-table__content offb-table__content--allow-break", children: n || "-" })
} }) }) }),
/* @__PURE__ */ t("td", { children: /* @__PURE__ */ t("div", { "aria-describedby": `option-${e}-label`, className: "offb-table__content offb-table__content--allow-break", children: l || "-" }) }),
/* @__PURE__ */ t("td", { children: /* @__PURE__ */ t(v, { name: `${a}[${e}]openForms.translations.${r}.description`, "aria-labelledby": `option-${e}-label` }) })
] }, `option-description-${e}`))
] })
] })
);
}
export {
L as ValuesTranslations,
L as default
};