@sonardigital/carbon-ui 1.2.27 → 1.2.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/package.json +1 -1
  2. package/src/components/form/fields/FormDatePicker.tsx +4 -1
  3. package/src/components/form/fields/FormInput.tsx +10 -1
  4. package/src/components/form/fields/FormMultiselect.tsx +5 -1
  5. package/src/components/form/fields/FormNumber.tsx +4 -1
  6. package/src/components/form/fields/FormPassword.tsx +4 -1
  7. package/src/components/form/fields/FormSelect.tsx +5 -1
  8. package/src/components/form/fields/FormSwitch.tsx +4 -1
  9. package/src/components/form/fields/FormTextArea.tsx +4 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sonardigital/carbon-ui",
3
- "version": "1.2.27",
3
+ "version": "1.2.28",
4
4
  "description": "",
5
5
  "main": "src/index.ts",
6
6
  "files": [
package/src/components/form/fields/FormDatePicker.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { Stack } from '@mui/material';
1
+ import { FormHelperText, Stack } from '@mui/material';
2
2
  import { Controller } from 'react-hook-form';
3
3
  import { FormLabel } from '../layout';
4
4
  import { FormError } from '../layout/FormError';
@@ -9,12 +9,14 @@ interface FormDatePickerProps extends Omit<
9
9
  'value' | 'onChange'
10
10
  > {
11
11
  name: string;
12
+ helperText?: string;
12
13
  label: string;
13
14
  }
14
15
 
15
16
  export function FormDatePicker({
16
17
  name,
17
18
  label,
19
+ helperText,
18
20
  ...props
19
21
  }: FormDatePickerProps): React.ReactElement {
20
22
  return (
@@ -27,6 +29,7 @@ export function FormDatePicker({
27
29
  {fieldState.error && (
28
30
  <FormError label={fieldState.error?.message ?? ''} />
29
31
  )}
32
+ {helperText && <FormHelperText>{helperText}</FormHelperText>}
30
33
  </Stack>
31
34
  </FormLabel>
32
35
  )}
package/src/components/form/fields/FormInput.tsx CHANGED
@@ -1,4 +1,9 @@
1
- import { Stack, TextField, TextFieldProps } from '@mui/material';
1
+ import {
2
+ FormHelperText,
3
+ Stack,
4
+ TextField,
5
+ TextFieldProps,
6
+ } from '@mui/material';
2
7
  import { Controller } from 'react-hook-form';
3
8
  import { FormLabel } from '../layout';
4
9
  import { FormError } from '../layout/FormError';
@@ -11,6 +16,7 @@ interface FormInputProps extends TextFieldProps<'standard'> {
11
16
  export function FormInput({
12
17
  name,
13
18
  label,
19
+ helperText,
14
20
  ...props
15
21
  }: FormInputProps): React.ReactElement {
16
22
  return (
@@ -23,6 +29,9 @@ export function FormInput({
23
29
  {fieldState.error && (
24
30
  <FormError label={fieldState.error?.message ?? ''} />
25
31
  )}
32
+ {helperText && (
33
+ <FormHelperText>{helperText}</FormHelperText>
34
+ )}
26
35
  </Stack>
27
36
  </FormLabel>
28
37
  )}
package/src/components/form/fields/FormMultiselect.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { AutocompleteProps, Stack } from '@mui/material';
1
+ import { AutocompleteProps, FormHelperText, Stack } from '@mui/material';
2
2
  import { Controller } from 'react-hook-form';
3
3
  import { FormLabel } from '../layout';
4
4
  import { FormError } from '../layout/FormError';
@@ -22,6 +22,7 @@ export function FormMultiselect({
22
22
  name,
23
23
  label,
24
24
  options,
25
+ helperText,
25
26
  ...rest
26
27
  }: MultiselectAutocompleteProps): React.ReactElement {
27
28
  return (
@@ -42,6 +43,9 @@ export function FormMultiselect({
42
43
  {fieldState.error && (
43
44
  <FormError label={fieldState.error?.message ?? ''} />
44
45
  )}
46
+ {helperText && (
47
+ <FormHelperText>{helperText}</FormHelperText>
48
+ )}
45
49
  </Stack>
46
50
  </FormLabel>
47
51
  );
package/src/components/form/fields/FormNumber.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { Stack } from '@mui/material';
1
+ import { FormHelperText, Stack } from '@mui/material';
2
2
  import { Controller } from 'react-hook-form';
3
3
  import { FormLabel } from '../layout';
4
4
  import { FormError } from '../layout/FormError';
@@ -7,12 +7,14 @@ import { NumberInput } from '../../inputs/Number';
7
7
 
8
8
  interface FormNumberProps extends Omit<NumberProps, 'onChange'> {
9
9
  name: string;
10
+ helperText?: string;
10
11
  label: string;
11
12
  }
12
13
 
13
14
  export function FormNumber({
14
15
  name,
15
16
  label,
17
+ helperText,
16
18
  ...props
17
19
  }: FormNumberProps): React.ReactElement {
18
20
  return (
@@ -25,6 +27,7 @@ export function FormNumber({
25
27
  {fieldState.error && (
26
28
  <FormError label={fieldState.error?.message ?? ''} />
27
29
  )}
30
+ {helperText && <FormHelperText>{helperText}</FormHelperText>}
28
31
  </Stack>
29
32
  </FormLabel>
30
33
  )}
package/src/components/form/fields/FormPassword.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { OutlinedInput, Stack } from '@mui/material';
1
+ import { FormHelperText, OutlinedInput, Stack } from '@mui/material';
2
2
  import { Controller } from 'react-hook-form';
3
3
  import { FormLabel } from '../layout';
4
4
  import { FormError } from '../layout/FormError';
@@ -9,9 +9,11 @@ import { Cursor } from '../../atoms';
9
9
  export function FormPassword({
10
10
  name,
11
11
  label,
12
+ helperText,
12
13
  }: {
13
14
  name: string;
14
15
  label: string;
16
+ helperText?: string;
15
17
  }): React.ReactElement {
16
18
  const [isVisible, setIsVisible] = useState(false);
17
19
  return (
@@ -48,6 +50,7 @@ export function FormPassword({
48
50
  {fieldState.error && (
49
51
  <FormError label={fieldState.error?.message ?? ''} />
50
52
  )}
53
+ {helperText && <FormHelperText>{helperText}</FormHelperText>}
51
54
  </Stack>
52
55
  </FormLabel>
53
56
  )}
package/src/components/form/fields/FormSelect.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { AutocompleteProps, Stack } from '@mui/material';
1
+ import { AutocompleteProps, FormHelperText, Stack } from '@mui/material';
2
2
  import { Controller } from 'react-hook-form';
3
3
  import { FormLabel } from '../layout';
4
4
  import { FormError } from '../layout/FormError';
@@ -26,6 +26,7 @@ export function FormSelect({
26
26
  name,
27
27
  label,
28
28
  options,
29
+ helperText,
29
30
  ...rest
30
31
  }: SelectAutocompleteProps): React.ReactElement {
31
32
  return (
@@ -46,6 +47,9 @@ export function FormSelect({
46
47
  {fieldState.error && (
47
48
  <FormError label={fieldState.error?.message ?? ''} />
48
49
  )}
50
+ {helperText && (
51
+ <FormHelperText>{helperText}</FormHelperText>
52
+ )}
49
53
  </Stack>
50
54
  </FormLabel>
51
55
  );
package/src/components/form/fields/FormSwitch.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import { Stack, SwitchProps, Typography } from '@mui/material';
1
+ import { FormHelperText, Stack, SwitchProps, Typography } from '@mui/material';
2
2
  import { Controller } from 'react-hook-form';
3
3
  import { FormError } from '../layout/FormError';
4
4
  import { Switch } from '../../inputs/Switch';
@@ -6,11 +6,13 @@ import { Switch } from '../../inputs/Switch';
6
6
  interface FormSwitchProps extends SwitchProps {
7
7
  name: string;
8
8
  label: string;
9
+ helperText?: string;
9
10
  }
10
11
 
11
12
  export function FormSwitch({
12
13
  name,
13
14
  label,
15
+ helperText,
14
16
  ...props
15
17
  }: FormSwitchProps): React.ReactElement {
16
18
  return (
@@ -38,6 +40,7 @@ export function FormSwitch({
38
40
  {fieldState.error && (
39
41
  <FormError label={fieldState.error?.message ?? ''} />
40
42
  )}
43
+ {helperText && <FormHelperText>{helperText}</FormHelperText>}
41
44
  </Stack>
42
45
  )}
43
46
  />
package/src/components/form/fields/FormTextArea.tsx CHANGED
@@ -1,4 +1,5 @@
1
1
  import {
2
+ FormHelperText,
2
3
  Stack,
3
4
  TextareaAutosize,
4
5
  TextareaAutosizeProps,
@@ -11,11 +12,13 @@ import { FormError } from '../layout/FormError';
11
12
  interface FormTextareaProps extends TextareaAutosizeProps {
12
13
  name: string;
13
14
  label: string;
15
+ helperText?: string;
14
16
  }
15
17
 
16
18
  export function FormTextarea({
17
19
  name,
18
20
  label,
21
+ helperText,
19
22
  ...props
20
23
  }: FormTextareaProps): React.ReactElement {
21
24
  const theme = useTheme();
@@ -37,6 +40,7 @@ export function FormTextarea({
37
40
  {fieldState.error && (
38
41
  <FormError label={fieldState.error?.message ?? ''} />
39
42
  )}
43
+ {helperText && <FormHelperText>{helperText}</FormHelperText>}
40
44
  </Stack>
41
45
  </FormLabel>
42
46
  )}