UNPKG

@open-formulieren/formio-builder

Version:

An opinionated Formio webform builder for Open Forms

33 lines (32 loc) 1.65 kB
import { jsx as _jsx } from "react/jsx-runtime"; import { useFormikContext } from 'formik'; import { useContext } from 'react'; import { FormattedMessage, useIntl } from 'react-intl'; import useAsync from 'react-use/esm/useAsync'; import { BuilderContext } from '../../../context'; import Select from '../../formio/select'; function isValidatorOptions(options) { return options !== undefined; } /** * Fetch the available validator plugins and display them in a multiselect. * * This requires an async function `getValidatorPlugins` to be provided to the * BuilderContext which is responsible for retrieving the list of available plugins. * * If a fetch error occurs, it is thrown during rendering - you should provide your * own error boundary to catch this. */ const ValidatorPluginSelect = () => { const intl = useIntl(); const { values } = useFormikContext(); const { getValidatorPlugins } = useContext(BuilderContext); const { value: options, loading, error, } = useAsync(async () => await getValidatorPlugins(values.type || ''), []); if (error) { throw error; } const tooltip = intl.formatMessage({ id: "UGLnLd", defaultMessage: [{ type: 0, value: "Select the plugin(s) to use for the validation functionality." }] }); const _options = isValidatorOptions(options) ? options : []; return (_jsx(Select, { name: "validate.plugins", label: _jsx(FormattedMessage, { id: 'UCGSib', defaultMessage: [{ type: 0, value: "Plugin(s)" }] }), tooltip: tooltip, isLoading: loading, isMulti: true, isClearable: true, options: _options, valueProperty: "id" })); }; export default ValidatorPluginSelect;