test-crud/components/forms/AppTextFieldTraductor.jsx

es una prueba acerca de como publicar un package name

import { Button, Dialog, DialogActions, DialogContent, DialogTitle, FormControl, IconButton, InputLabel, MenuItem, Select, TextField } from "@mui/material"
import SwapHorizIcon from '@mui/icons-material/SwapHoriz'

const AppTextFieldTraductor = ({
  openDialog,
  handleTraslate,
  name,
  handleChangeInput,
  handleClickTraslate,
  handleCheckTraslate,
  handleChangeIdioma,
  handleChangeIdiomaDestino,
  handleSwapValueIdioma,
  value,
  newText1,
  idioma,
  idiomaDestino,
}) => {
  return (
    <Dialog
      open={openDialog}
      onClose={handleTraslate}
      fullWidth
      sx={{ padding: 2.5 }}
      maxWidth="lg"
    >
      <DialogTitle>Traductor</DialogTitle>
      <DialogContent sx={{ display: 'flex', justifyContent: 'space-between' }}>
        <div style={{ width: '100%' }}>
          <FormControl sx={{ mt: 1, width: 200 }} size="small" color="info">
            <InputLabel>Seleccione idioma origen</InputLabel>
            <Select
              value={idioma}
              label="Seleccione idioma origen"
              onChange={handleChangeIdioma}
            >
              <MenuItem value={'EN'}>Ingles</MenuItem>
              <MenuItem value={'ES'}>Español</MenuItem>
            </Select>
          </FormControl>
          <TextField
            id={name}
            name={name}
            type="text"
            value={value ? value : ''}
            onChange={handleChangeInput}
            variant="outlined"
            sx={{ mt: 2, flex: 0.49, width: '100%' }}
            multiline
            rows={4}
          />
        </div>
        <div>
          <IconButton
            onClick={handleSwapValueIdioma}
            aria-label="swap button"
            size="large"
          >
            <SwapHorizIcon fontSize="inherit" />
          </IconButton>
        </div>
        <div style={{ width: '100%' }}>
          <FormControl sx={{ mt: 1, width: 200 }} size="small" color="info">
            <InputLabel>Seleccione idioma destino</InputLabel>
            <Select
              value={idiomaDestino}
              label="Seleccione idioma destino"
              onChange={handleChangeIdiomaDestino}
            >
              <MenuItem value={'EN'}>Ingles</MenuItem>
              <MenuItem value={'ES'}>Español</MenuItem>
            </Select>
          </FormControl>
          <TextField
            id={name}
            name={name}
            type="text"
            value={newText1 ? newText1 : ''}
            onChange={handleChangeInput}
            variant="outlined"
            sx={{ mt: 2, flex: 0.49, width: '100%' }}
            multiline
            rows={4}
          />
        </div>
      </DialogContent>
      <DialogActions sx={{ mb: 1 }}>
        <Button
          type="button"
          variant="outlined"
          color="secondary"
          sx={{ mr: 1.5 }}
          onClick={handleClickTraslate}
        >
          Traducir
        </Button>
        <Button variant="outlined" onClick={handleCheckTraslate} sx={{ mr: 2 }}>
          Usar este texto
        </Button>
      </DialogActions>
    </Dialog>
  )
}

export default AppTextFieldTraductor