@graphcommerce/ecommerce-ui 6.0.2-canary.8 → 6.1.0

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 (4) hide show
  1. package/CHANGELOG.md +44 -0
  2. package/components/FormComponents/CheckboxElement.tsx +9 -2
  3. package/components/FormComponents/SelectElement.tsx +2 -1
  4. package/package.json +7 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,49 @@
1
1
  # @graphcommerce/ecommerce-ui
2
2
 
3
+ ## 6.1.0
4
+
5
+ ### Patch Changes
6
+
7
+ - [#1900](https://github.com/graphcommerce-org/graphcommerce/pull/1900) [`92e1f1742`](https://github.com/graphcommerce-org/graphcommerce/commit/92e1f1742b03cfc0aed7e1d103b8295509a2ca45) - make the SelectElement validation message translatable ([@carlocarels90](https://github.com/carlocarels90))
8
+
9
+ - [#1871](https://github.com/graphcommerce-org/graphcommerce/pull/1871) [`1e2d2e5c6`](https://github.com/graphcommerce-org/graphcommerce/commit/1e2d2e5c615f072a2d0b60074d9aa5a467876f2f) - Allow styling FormControl in CheckboxElement ([@bramvanderholst](https://github.com/bramvanderholst))
10
+
11
+ ## 6.0.2-canary.22
12
+
13
+ ### Patch Changes
14
+
15
+ - [#1900](https://github.com/graphcommerce-org/graphcommerce/pull/1900) [`92e1f1742`](https://github.com/graphcommerce-org/graphcommerce/commit/92e1f1742b03cfc0aed7e1d103b8295509a2ca45) - make the SelectElement validation message translatable ([@carlocarels90](https://github.com/carlocarels90))
16
+
17
+ ## 6.0.2-canary.21
18
+
19
+ ## 6.0.2-canary.20
20
+
21
+ ## 6.0.2-canary.19
22
+
23
+ ## 6.0.2-canary.18
24
+
25
+ ## 6.0.2-canary.17
26
+
27
+ ## 6.0.2-canary.16
28
+
29
+ ## 6.0.2-canary.15
30
+
31
+ ## 6.0.2-canary.14
32
+
33
+ ## 6.0.2-canary.13
34
+
35
+ ## 6.0.2-canary.12
36
+
37
+ ### Patch Changes
38
+
39
+ - [#1871](https://github.com/graphcommerce-org/graphcommerce/pull/1871) [`1e2d2e5c6`](https://github.com/graphcommerce-org/graphcommerce/commit/1e2d2e5c615f072a2d0b60074d9aa5a467876f2f) - Allow styling FormControl in CheckboxElement ([@bramvanderholst](https://github.com/bramvanderholst))
40
+
41
+ ## 6.0.2-canary.11
42
+
43
+ ## 6.0.2-canary.10
44
+
45
+ ## 6.0.2-canary.9
46
+
3
47
  ## 6.0.2-canary.8
4
48
 
5
49
  ## 6.0.2-canary.7
package/components/FormComponents/CheckboxElement.tsx CHANGED
@@ -10,14 +10,19 @@ import {
10
10
  FormControl,
11
11
  FormControlLabel,
12
12
  FormControlLabelProps,
13
+ FormControlProps,
13
14
  FormGroup,
14
15
  FormHelperText,
16
+ SxProps,
17
+ Theme,
15
18
  } from '@mui/material'
16
19
 
17
20
  export type CheckboxElementProps<T extends FieldValues> = Omit<CheckboxProps, 'name'> & {
18
21
  parseError?: (error: FieldError) => string
19
22
  label?: FormControlLabelProps['label']
20
23
  helperText?: string
24
+ sx?: SxProps<Theme>
25
+ formControl?: Omit<FormControlProps<'div'>, 'required' | 'error'>
21
26
  } & Omit<ControllerProps<T>, 'render'>
22
27
 
23
28
  export function CheckboxElement<TFieldValues extends FieldValues>({
@@ -28,6 +33,8 @@ export function CheckboxElement<TFieldValues extends FieldValues>({
28
33
  label,
29
34
  control,
30
35
  helperText,
36
+ sx,
37
+ formControl,
31
38
  ...rest
32
39
  }: CheckboxElementProps<TFieldValues>): JSX.Element {
33
40
  if (required && !rules.required) {
@@ -46,7 +53,7 @@ export function CheckboxElement<TFieldValues extends FieldValues>({
46
53
  : error.message
47
54
  : helperText
48
55
  return (
49
- <FormControl required={required} error={invalid}>
56
+ <FormControl required={required} error={invalid} {...formControl}>
50
57
  <FormGroup row>
51
58
  <FormControlLabel
52
59
  label={label || ''}
@@ -55,7 +62,7 @@ export function CheckboxElement<TFieldValues extends FieldValues>({
55
62
  {...rest}
56
63
  color={rest.color || 'primary'}
57
64
  sx={{
58
- ...rest.sx,
65
+ ...(Array.isArray(sx) ? sx : [sx]),
59
66
  color: invalid ? 'error.main' : undefined,
60
67
  }}
61
68
  value={value}
package/components/FormComponents/SelectElement.tsx CHANGED
@@ -1,4 +1,5 @@
1
1
  import { Controller, ControllerProps, FieldValues } from '@graphcommerce/react-hook-form'
2
+ import { i18n } from '@lingui/core'
2
3
  import { MenuItem, TextField, TextFieldProps } from '@mui/material'
3
4
 
4
5
  export type SelectElementProps<T extends FieldValues> = Omit<
@@ -31,7 +32,7 @@ export function SelectElement<TFieldValues extends FieldValues>({
31
32
  const ChildComponent = isNativeSelect ? 'option' : MenuItem
32
33
 
33
34
  if (required && !validation.required) {
34
- validation.required = 'This field is required'
35
+ validation.required = i18n._(/* i18n */ 'This field is required')
35
36
  }
36
37
 
37
38
  return (
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@graphcommerce/ecommerce-ui",
3
3
  "homepage": "https://www.graphcommerce.org/",
4
4
  "repository": "github:graphcommerce-org/graphcommerce",
5
- "version": "6.0.2-canary.8",
5
+ "version": "6.1.0",
6
6
  "sideEffects": false,
7
7
  "prettier": "@graphcommerce/prettier-config-pwa",
8
8
  "eslintConfig": {
@@ -12,14 +12,14 @@
12
12
  }
13
13
  },
14
14
  "dependencies": {
15
- "@graphcommerce/graphql": "6.0.2-canary.8",
16
- "@graphcommerce/next-ui": "6.0.2-canary.8",
17
- "@graphcommerce/react-hook-form": "6.0.2-canary.8"
15
+ "@graphcommerce/graphql": "6.1.0",
16
+ "@graphcommerce/next-ui": "6.1.0",
17
+ "@graphcommerce/react-hook-form": "6.1.0"
18
18
  },
19
19
  "devDependencies": {
20
- "@graphcommerce/eslint-config-pwa": "6.0.2-canary.8",
21
- "@graphcommerce/prettier-config-pwa": "6.0.2-canary.8",
22
- "@graphcommerce/typescript-config-pwa": "6.0.2-canary.8"
20
+ "@graphcommerce/eslint-config-pwa": "6.1.0",
21
+ "@graphcommerce/prettier-config-pwa": "6.1.0",
22
+ "@graphcommerce/typescript-config-pwa": "6.1.0"
23
23
  },
24
24
  "peerDependencies": {
25
25
  "@lingui/react": "^3.13.2",