@open-formulieren/formio-builder
Version:
An opinionated Formio webform builder for Open Forms
53 lines (52 loc) • 2.11 kB
JavaScript
import { jsxs as g, jsx as t } from "react/jsx-runtime";
import { useState as S, useDeferredValue as M, useMemo as i } from "react";
import { useIntl as C, FormattedMessage as d } from "react-intl";
import R from "./ComponentsGroup.js";
/* empty css */
import { FORM_DESIGNER_GROUPS as y, FORM_DESIGNER_PRESETS as E, FORM_DESIGNER_GROUP_LABELS as G } from "./constants.js";
import { normalizeComponentConfiguration as N } from "./normalizeComponentConfiguration.js";
const j = () => {
const [c, f] = S(""), a = M(c), r = C(), n = a !== "", m = i(() => {
const e = y.map((o) => ({
groupName: o.name,
components: N(o, r)
}));
return e.push({
groupName: "preset",
components: E
}), e;
}, [r]), p = i(() => n ? m.map(({
groupName: e,
components: o
}) => ({
groupName: e,
components: o.filter((s) => [s.key.toLowerCase(), s.label.toLowerCase()].some((h) => h.includes(a.toLowerCase())))
})) : m, [n, a, m]), u = p.some(({
components: e
}) => e.length > 0), l = "no-search-results";
return /* @__PURE__ */ g("div", { className: "offb-components-list", children: [
/* @__PURE__ */ t("input", { className: "form-control offb-components-list__search-input", type: "search", placeholder: r.formatMessage({
id: "N46vH2",
defaultMessage: [{
type: 0,
value: "Search component(s)"
}]
}), value: c, onChange: (e) => f(e.target.value), "aria-label": r.formatMessage({
id: "M/Akft",
defaultMessage: [{
type: 0,
value: "Search component(s)"
}]
}), "aria-describedby": u ? void 0 : l }),
u ? p.map(({
groupName: e,
components: o
}, s) => /* @__PURE__ */ t(R, { isSearching: n, isDefault: s === 0, testId: `component-group--${e}`, title: /* @__PURE__ */ t(d, { ...G[e] }), componentConfigurations: o }, s)) : /* @__PURE__ */ t("p", { className: "text-muted", id: l, children: /* @__PURE__ */ t(d, { id: "g8jZU+", defaultMessage: [{
type: 0,
value: "No matching components found."
}] }) })
] });
};
export {
j as default
};