@graphcommerce/magento-cart-coupon 3.0.29 → 3.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.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,35 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
+
## 3.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#1524](https://github.com/graphcommerce-org/graphcommerce/pull/1524) [`c80e10d96`](https://github.com/graphcommerce-org/graphcommerce/commit/c80e10d96de18de73e7768f93aae806ce9cc45de) Thanks [@paales](https://github.com/paales)! - Use default MUI Accordion for the Coupon component.
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [[`d140fca34`](https://github.com/graphcommerce-org/graphcommerce/commit/d140fca3463b73e761e23fd1d9216305727f0c1a), [`9ec0338df`](https://github.com/graphcommerce-org/graphcommerce/commit/9ec0338dfe34d37b0f2c24e36ffa6ed13ea1145e), [`735b78672`](https://github.com/graphcommerce-org/graphcommerce/commit/735b786724d5401cbe6e88f2515e121a1a0945b2)]:
|
|
12
|
+
- @graphcommerce/magento-cart@4.4.6
|
|
13
|
+
- @graphcommerce/next-ui@4.11.0
|
|
14
|
+
- @graphcommerce/magento-store@4.2.12
|
|
15
|
+
- @graphcommerce/graphql@3.3.0
|
|
16
|
+
|
|
17
|
+
## 3.0.31
|
|
18
|
+
|
|
19
|
+
### Patch Changes
|
|
20
|
+
|
|
21
|
+
- Updated dependencies []:
|
|
22
|
+
- @graphcommerce/magento-cart@4.4.5
|
|
23
|
+
|
|
24
|
+
## 3.0.30
|
|
25
|
+
|
|
26
|
+
### Patch Changes
|
|
27
|
+
|
|
28
|
+
- Updated dependencies [[`371e6cf52`](https://github.com/graphcommerce-org/graphcommerce/commit/371e6cf52916a3b6c44192bd40cc8271bd608832), [`4143483f3`](https://github.com/graphcommerce-org/graphcommerce/commit/4143483f37c038d2bbf218be2685e27a31a35745)]:
|
|
29
|
+
- @graphcommerce/next-ui@4.10.0
|
|
30
|
+
- @graphcommerce/magento-cart@4.4.4
|
|
31
|
+
- @graphcommerce/magento-store@4.2.11
|
|
32
|
+
|
|
3
33
|
## 3.0.29
|
|
4
34
|
|
|
5
35
|
### Patch Changes
|
|
@@ -1,15 +1,7 @@
|
|
|
1
1
|
import { useCartQuery } from '@graphcommerce/magento-cart'
|
|
2
|
-
import {
|
|
3
|
-
AnimatedRow,
|
|
4
|
-
iconChevronDown,
|
|
5
|
-
iconChevronUp,
|
|
6
|
-
responsiveVal,
|
|
7
|
-
IconSvg,
|
|
8
|
-
extendableComponent,
|
|
9
|
-
} from '@graphcommerce/next-ui'
|
|
2
|
+
import { iconChevronDown, IconSvg, extendableComponent } from '@graphcommerce/next-ui'
|
|
10
3
|
import { Trans } from '@lingui/react'
|
|
11
|
-
import {
|
|
12
|
-
import { AnimatePresence, m } from 'framer-motion'
|
|
4
|
+
import { SxProps, Theme, Accordion, AccordionSummary, AccordionDetails } from '@mui/material'
|
|
13
5
|
import { useState } from 'react'
|
|
14
6
|
import { ApplyCouponForm } from '../ApplyCouponForm/ApplyCouponForm'
|
|
15
7
|
import { RemoveCouponForm } from '../RemoveCouponForm/RemoveCouponForm'
|
|
@@ -22,8 +14,6 @@ const name = 'CouponAccordion' as const
|
|
|
22
14
|
const parts = ['accordion', 'button', 'couponFormWrap'] as const
|
|
23
15
|
const { withState } = extendableComponent<OwnerState, typeof name, typeof parts>(name, parts)
|
|
24
16
|
|
|
25
|
-
const MotionDiv = styled(m.div)({})
|
|
26
|
-
|
|
27
17
|
export function CouponAccordion(props: CouponAccordionProps) {
|
|
28
18
|
const { sx = [] } = props
|
|
29
19
|
const { data } = useCartQuery(GetCouponDocument)
|
|
@@ -37,108 +27,47 @@ export function CouponAccordion(props: CouponAccordionProps) {
|
|
|
37
27
|
open: Boolean(!coupon && open),
|
|
38
28
|
disabled: Boolean(coupon),
|
|
39
29
|
})
|
|
30
|
+
const handleChange = () => setOpen(!coupon && !open)
|
|
40
31
|
|
|
41
32
|
return (
|
|
42
|
-
<
|
|
43
|
-
|
|
44
|
-
|
|
33
|
+
<Accordion
|
|
34
|
+
className={classes.accordion}
|
|
35
|
+
onChange={handleChange}
|
|
36
|
+
expanded={!coupon && open}
|
|
37
|
+
variant='outlined'
|
|
38
|
+
sx={[
|
|
39
|
+
{
|
|
40
|
+
borderRadius: 1,
|
|
41
|
+
'::before': { display: 'none' },
|
|
42
|
+
},
|
|
43
|
+
...(Array.isArray(sx) ? sx : [sx]),
|
|
44
|
+
]}
|
|
45
|
+
>
|
|
46
|
+
<AccordionSummary
|
|
47
|
+
onClick={(e) => e.preventDefault()}
|
|
48
|
+
expandIcon={!coupon && <IconSvg src={iconChevronDown} />}
|
|
45
49
|
sx={[
|
|
46
50
|
(theme) => ({
|
|
47
|
-
|
|
48
|
-
|
|
51
|
+
px: theme.spacings.sm,
|
|
52
|
+
'& .MuiAccordionSummary-content': {
|
|
53
|
+
alignItems: 'center',
|
|
54
|
+
columnGap: 2,
|
|
55
|
+
justifyContent: 'space-between',
|
|
49
56
|
},
|
|
50
|
-
boxShadow: 'none',
|
|
51
|
-
border: `1px solid ${theme.palette.divider}`,
|
|
52
|
-
borderRadius: responsiveVal(theme.shape.borderRadius * 3, theme.shape.borderRadius * 4),
|
|
53
|
-
overflow: 'hidden',
|
|
54
57
|
}),
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
>
|
|
58
|
-
<Button
|
|
59
|
-
component={coupon ? 'div' : 'button'}
|
|
60
|
-
onClick={() => setOpen(!open)}
|
|
61
|
-
disableRipple={!!coupon}
|
|
62
|
-
className={classes.button}
|
|
63
|
-
sx={(theme) => ({
|
|
64
|
-
justifyContent: 'space-between',
|
|
65
|
-
gap: theme.spacings.sm,
|
|
66
|
-
padding: `${theme.spacings.xs} ${theme.spacings.sm}`,
|
|
67
|
-
width: '100%',
|
|
68
|
-
borderRadius: responsiveVal(theme.shape.borderRadius * 3, theme.shape.borderRadius * 4),
|
|
69
|
-
|
|
70
|
-
'& .MuiButton-label': {
|
|
71
|
-
display: 'flex',
|
|
72
|
-
justifyContent: 'flex-start',
|
|
73
|
-
'& span:last-of-type': {
|
|
74
|
-
marginLeft: 'auto',
|
|
75
|
-
},
|
|
76
|
-
},
|
|
77
|
-
'& > span': {
|
|
78
|
-
display: 'inline',
|
|
79
|
-
'& > h6': {
|
|
80
|
-
textAlign: 'left',
|
|
81
|
-
marginRight: theme.spacings.sm,
|
|
82
|
-
},
|
|
83
|
-
},
|
|
84
|
-
|
|
85
|
-
'&.open': {
|
|
86
|
-
background: 'rgba(0,0,0,0.04)',
|
|
87
|
-
borderBottomLeftRadius: 0,
|
|
88
|
-
borderBottomRightRadius: 0,
|
|
89
|
-
},
|
|
90
|
-
'&.disabled': {
|
|
58
|
+
Boolean(coupon) && {
|
|
59
|
+
'&:hover:not(.Mui-disabled)': {
|
|
91
60
|
cursor: 'default',
|
|
92
|
-
justifyContent: 'flex-start',
|
|
93
|
-
'&:hover': {
|
|
94
|
-
background: 'transparent',
|
|
95
|
-
},
|
|
96
61
|
},
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
}
|
|
108
|
-
>
|
|
109
|
-
<Typography variant='subtitle1'>
|
|
110
|
-
<Trans id='Discount code' />
|
|
111
|
-
</Typography>
|
|
112
|
-
<AnimatePresence>
|
|
113
|
-
{coupon && (
|
|
114
|
-
<m.div
|
|
115
|
-
key='remove'
|
|
116
|
-
initial={{ opacity: 0 }}
|
|
117
|
-
animate={{ opacity: 1 }}
|
|
118
|
-
exit={{ opacity: 0 }}
|
|
119
|
-
>
|
|
120
|
-
<RemoveCouponForm {...data.cart} />
|
|
121
|
-
</m.div>
|
|
122
|
-
)}
|
|
123
|
-
</AnimatePresence>
|
|
124
|
-
</Button>
|
|
125
|
-
|
|
126
|
-
<AnimatePresence>
|
|
127
|
-
{open && !coupon && (
|
|
128
|
-
<AnimatedRow key='discount-codes-form-wrap'>
|
|
129
|
-
<Box
|
|
130
|
-
className={classes.couponFormWrap}
|
|
131
|
-
sx={(theme) => ({
|
|
132
|
-
background: 'rgba(0,0,0,0.04)',
|
|
133
|
-
padding: `0 ${theme.spacings.sm} ${theme.spacings.xs}`,
|
|
134
|
-
})}
|
|
135
|
-
>
|
|
136
|
-
<ApplyCouponForm />
|
|
137
|
-
</Box>
|
|
138
|
-
</AnimatedRow>
|
|
139
|
-
)}
|
|
140
|
-
</AnimatePresence>
|
|
141
|
-
</MotionDiv>
|
|
142
|
-
</AnimatedRow>
|
|
62
|
+
},
|
|
63
|
+
]}
|
|
64
|
+
>
|
|
65
|
+
<Trans id='Discount code' />
|
|
66
|
+
<RemoveCouponForm {...data.cart} />
|
|
67
|
+
</AccordionSummary>
|
|
68
|
+
<AccordionDetails sx={(theme) => ({ px: theme.spacings.sm })}>
|
|
69
|
+
<ApplyCouponForm />
|
|
70
|
+
</AccordionDetails>
|
|
71
|
+
</Accordion>
|
|
143
72
|
)
|
|
144
73
|
}
|
|
@@ -17,15 +17,15 @@ export function RemoveCouponForm(props: RemoveCouponFormProps) {
|
|
|
17
17
|
const { handleSubmit, error } = form
|
|
18
18
|
const submitHandler = handleSubmit(() => {})
|
|
19
19
|
|
|
20
|
+
if (!applied_coupons?.[0]?.code) return null
|
|
21
|
+
|
|
20
22
|
return (
|
|
21
23
|
<Box className={classes.root} sx={sx}>
|
|
22
24
|
<Chip
|
|
23
25
|
label={applied_coupons?.[0]?.code}
|
|
24
26
|
onDelete={submitHandler}
|
|
25
27
|
size='responsive'
|
|
26
|
-
sx={
|
|
27
|
-
...theme.typography.overline,
|
|
28
|
-
})}
|
|
28
|
+
sx={{ typography: 'overline' }}
|
|
29
29
|
/>
|
|
30
30
|
<ApolloCartErrorAlert error={error} />
|
|
31
31
|
</Box>
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@graphcommerce/magento-cart-coupon",
|
|
3
3
|
"homepage": "https://www.graphcommerce.org/",
|
|
4
4
|
"repository": "github:graphcommerce-org/graphcommerce",
|
|
5
|
-
"version": "3.0
|
|
5
|
+
"version": "3.1.0",
|
|
6
6
|
"sideEffects": false,
|
|
7
7
|
"prettier": "@graphcommerce/prettier-config-pwa",
|
|
8
8
|
"eslintConfig": {
|
|
@@ -18,11 +18,11 @@
|
|
|
18
18
|
"@playwright/test": "^1.21.1"
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"@graphcommerce/graphql": "3.
|
|
21
|
+
"@graphcommerce/graphql": "3.3.0",
|
|
22
22
|
"@graphcommerce/image": "3.1.7",
|
|
23
|
-
"@graphcommerce/magento-cart": "4.4.
|
|
24
|
-
"@graphcommerce/magento-store": "4.2.
|
|
25
|
-
"@graphcommerce/next-ui": "4.
|
|
23
|
+
"@graphcommerce/magento-cart": "4.4.6",
|
|
24
|
+
"@graphcommerce/magento-store": "4.2.12",
|
|
25
|
+
"@graphcommerce/next-ui": "4.11.0",
|
|
26
26
|
"@graphcommerce/react-hook-form": "3.2.2"
|
|
27
27
|
},
|
|
28
28
|
"peerDependencies": {
|