onChange(null)}\n onChange={_onChange}\n onInputChange={onInputChange}\n options={filteredOptions}\n placeholder={placeholder}\n value={value}\n disabled={disabled}\n />\n );\n}\n\nCountrySelector.propTypes = {\n onChange: PropTypes.func,\n value: PropTypes.string,\n placeholder: PropTypes.node,\n disabled: PropTypes.bool,\n className: PropTypes.string\n};\n\nexport function CountrySelectorLabel({ className = null, label = null, optionalText = null, ...rest }) {\n return (\n \n \n \n \n );\n}\n\nCountrySelectorLabel.propTypes = {\n label: PropTypes.string,\n optionalText: PropTypes.string,\n className: PropTypes.string\n};\n","import React from 'react';\nimport Style from './formPreview.module.css';\nimport { InputLabel, InputSublabel, ToastContext } from '@weezevent/nacre';\nimport { useTranslation } from 'react-i18next';\nimport UploadFileZone from '../../../components/upload/uploadFileZone';\nimport useAppContext from '../../../context/useAppContext';\nimport { getWeezFileUrl } from '../../../components/upload/utils';\n\nconst FIELD_ID_PHOTO = 'ws-46';\nconst RATIO_ID_PHOTO = 7 / 9;\n\nexport default function FormImage({ field, label, value = null, id = null, onChangeForm = () => {} }) {\n const toast = React.useContext(ToastContext);\n const [{ organization }] = useAppContext();\n const { t } = useTranslation();\n\n const onChange = React.useCallback(\n v => {\n if (id) {\n onChangeForm(id, v);\n }\n },\n [id]\n );\n\n const imgUrl = React.useMemo(() => {\n return getWeezFileUrl(value, window.weezConfig.aws.weez_bucket_form);\n }, [value]);\n\n const onError = React.useCallback(e => {\n toast.error(t('nacre.previewFile.error.loading'));\n console.error(e);\n });\n\n return (\n \n onChange(image.url)}\n onError={onError}\n title={}\n subtitle={field.form_field.description && }\n labelDropzone={t('ticket.event.dropzone_label')}\n subLabelDropzone={t('ticket.event.dropzone_label_min_size')}\n maxSize={2097152}\n file={imgUrl}\n onDelete={() => onChange(null)}\n cropModalProps={{\n ratio: id === FIELD_ID_PHOTO ? RATIO_ID_PHOTO : null,\n forceRatio: id === FIELD_ID_PHOTO\n }}\n />\n
\n );\n}\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { FrameCard } from '@weezevent/nacre';\nimport FormDivider from './formDivider';\nimport FormInput from './formInput';\nimport FormSelect from './formSelect';\nimport FormCheckbox from './formCheckbox';\nimport FormPhone from './formPhone';\nimport FormAreafield from './formAreafield';\nimport FormFile from './formFile';\nimport FormBirthdate from './formBirthdate';\nimport FormCountry from './formCountry';\nimport { useTranslation } from 'react-i18next';\nimport i18n from '../../../i18n/i18n';\nimport FormTitle from './formTitle';\nimport Style from './formPreview.module.css';\nimport FormImage from './formImage';\n\n//For FIELDS.date : it is a field which is not at all formatted in a homogeneous way in Menhir.\n//For the moment we propose an inputText to ensure backwards compatibility.\n//In the near future, we must create a custom date field on the Menhir side which, as output, returns an isoString\nconst FIELDS = {\n phone: FormPhone,\n textfield: FormInput,\n email: FormInput,\n textarea: FormAreafield,\n file: FormFile,\n image: FormImage,\n checkbox: FormCheckbox,\n select: FormSelect,\n divider: FormDivider,\n country: FormCountry,\n birthdate: FormBirthdate,\n title: FormTitle,\n date: FormInput\n};\n\nfunction GenericField({ field, ...rest }) {\n const label = field.form_field.get_translated_label(i18n.language.toLowerCase());\n\n if (field.form_field.subtype) {\n const Component = FIELDS[field.form_field.subtype];\n if (Component) {\n return ;\n }\n }\n\n if (!FIELDS[field.form_field.field_type]) {\n return ;\n }\n\n const ComponentType = FIELDS[field.form_field.field_type];\n return ;\n}\n\nfunction Form({ fields, form, ...rest }) {\n if (!fields.length) {\n return null;\n }\n\n return (\n <>\n {fields\n .sort((a, b) => a.order - b.order)\n .map((field, index) => (\n \n ))}\n \n );\n}\n\nexport function FormPreview({ fields, form = null, onChangeForm = () => {}, usage = 'attendee', locale = 'en-GB', withPadding = true }) {\n const { t } = useTranslation();\n\n return (\n \n {!form ? (\n
\n \n \n \n \n
\n ) : (\n
\n
\n {field.form_field.description &&
}\n
\n
\n \n {field.form_field.description && }\n