UNPKG

@acrsolutions/chat-components

Version:

Un set di componenti per la creazione di un'applicazione di messaggistica

28 lines (27 loc) 2.13 kB
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import SendIcon from '@mui/icons-material/Send'; import { Button, CircularProgress, FormControl, MenuItem, TextField, } from '@mui/material'; import { useCallback } from 'react'; import { StyledAbsWrapper } from '../ui/StyledAbsWrapper'; import { StyledTemplateData } from '../ui/StyledTemplateData'; import { TemplateSchema } from './EXAMPLES/TemplateSchemaEXAMPLE'; /** * * @param selectedTemplate nome del template selezionato * @param onChangeTemplateName funzione per cambiare il nome del template * @param onChange funzione per cambiare i valori delle variabili dentro il template * @param values oggetto che contiene i valori delle variabili * @param onSubmit funzione per inviare il template * @param templateOptions array di stringhe con i nomi dei template * @param templateData oggetto con i dati del template * @param isSendingTemplate booleano che indica se il template è in fase di invio * @returns */ export function TemplateFormZone({ selectedTemplate, onChangeTemplateName, onChange, values, onSubmit, templateOptions, templateData, isSendingTemplate, }) { const handleTemplateNameChange = useCallback((e) => { onChangeTemplateName(e.target.value); }, [onChangeTemplateName]); return (_jsxs(StyledTemplateData, { children: [_jsxs("form", { id: "sendTemplateForm", onSubmit: onSubmit, children: [_jsx(FormControl, { fullWidth: true, children: _jsx(TextField, { fullWidth: true, select: true, name: "name", value: selectedTemplate, helperText: 'Seleziona il nome del template', onChange: handleTemplateNameChange, children: templateOptions.map((temp, i) => { return (_jsx(MenuItem, { value: temp, children: temp }, temp + i)); }) }) }), _jsx(TemplateSchema, { data: templateData, onChange: onChange, values: values })] }), _jsx(StyledAbsWrapper, { children: _jsx(Button, { variant: "contained", type: "submit", form: "sendTemplateForm", children: isSendingTemplate ? (_jsx(CircularProgress, { size: 30 })) : (_jsx(SendIcon, { fontSize: "large" })) }) })] })); }