Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 2766 | Rev 2791 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
2073 stevensc 1 
import React from 'react'
2080 stevensc 2 
import {
3 
  FormControl,
4 
  InputAdornment,
5 
  InputBase,
6 
  InputLabel,
7 
  styled
8 
} from '@mui/material'
2773 stevensc 9 
import { Controller } from 'react-hook-form'
10 
 
11 
import { colors } from '@app/styles/mui/colors'
12 
 
2080 stevensc 13 
import FormErrorFeedback from '../form/FormErrorFeedback'
2073 stevensc 14 
 
2773 stevensc 15 
const CustomInput = styled(InputBase)(({ theme }) => ({
2084 stevensc 16 
  borderRadius: 4,
17 
  position: 'relative',
2773 stevensc 18 
  backgroundColor: colors.main,
2084 stevensc 19 
  border: `1px solid var(--border-primary)`,
20 
  fontSize: 14,
21 
  padding: '5px 10px',
22 
  transition: theme.transitions.create([
23 
    'border-color',
24 
    'background-color',
25 
    'box-shadow'
26 
  ]),
2077 stevensc 27 
  '& .MuiInputBase-input': {
2085 stevensc 28 
    paddingTop: 0,
2766 stevensc 29 
    paddingBottom: 0,
30 
    '&::file-selector-button': {
31 
      lineHeight: 1
32 
    }
2073 stevensc 33 
  },
34 
  '& svg': {
35 
    fontSize: '1.3rem'
36 
  }
37 
}))
38 
 
2080 stevensc 39 
const Input = ({
2773 stevensc 40 
  name,
41 
  control,
2081 stevensc 42 
  label,
2773 stevensc 43 
  rules,
44 
  defaultValue = '',
45 
  onChange,
46 
  value: propValue,
47 
  icon,
2081 stevensc 48 
  accept,
2773 stevensc 49 
  error,
50 
  ...props
2080 stevensc 51 
}) => {
2773 stevensc 52 
  if (control) {
53 
    return (
54 
      <Controller
55 
        name={name}
56 
        control={control}
57 
        defaultValue={defaultValue}
58 
        rules={rules}
59 
        render={(field) => (
60 
          <FormControl variant='standard' fullWidth>
61 
            <InputLabel shrink>{label}</InputLabel>
62 
 
63 
            <CustomInput
64 
              {...field}
65 
              inputProps={{
66 
                accept
67 
              }}
68 
              startAdornment={
69 
                icon ? <InputAdornment>{icon}</InputAdornment> : null
70 
              }
71 
              fullWidth
72 
              {...props}
73 
            />
74 
 
75 
            {error ? <FormErrorFeedback>{error}</FormErrorFeedback> : null}
76 
          </FormControl>
77 
        )}
78 
      />
79 
    )
80 
  }
81 
 
2077 stevensc 82 
  return (
2079 stevensc 83 
    <FormControl variant='standard' fullWidth>
2078 stevensc 84 
      <InputLabel shrink>{label}</InputLabel>
2099 stevensc 85 
 
2773 stevensc 86 
      <CustomInput
2080 stevensc 87 
        name={name}
88 
        onChange={onChange}
2773 stevensc 89 
        defaultValue={defaultValue}
90 
        value={propValue}
2099 stevensc 91 
        inputProps={{
92 
          accept
93 
        }}
2773 stevensc 94 
        startAdornment={icon ? <InputAdornment>{icon}</InputAdornment> : null}
2080 stevensc 95 
        fullWidth
2773 stevensc 96 
        {...props}
2080 stevensc 97 
      />
2099 stevensc 98 
 
2080 stevensc 99 
      {error ? <FormErrorFeedback>{error}</FormErrorFeedback> : null}
2078 stevensc 100 
    </FormControl>
2077 stevensc 101 
  )
2073 stevensc 102 
}
103 
 
104 
export default Input