@graphcommerce/magento-category 3.5.41 → 4.0.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,257 +1,268 @@
1
1
  # Change Log
2
2
 
3
- All notable changes to this project will be documented in this file.
4
- See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
3
+ ## 4.0.0
5
4
 
6
- ## [3.5.2](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.5.1...@graphcommerce/magento-category@3.5.2) (2021-12-03)
5
+ ### Major Changes
7
6
 
7
+ - [#1258](https://github.com/ho-nl/m2-pwa/pull/1258)
8
+ [`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)
9
+ Thanks [@paales](https://github.com/paales)! - Upgraded to Material UI 5
8
10
 
9
- ### Bug Fixes
11
+ ### Patch Changes
10
12
 
11
- * spacing of LayoutTItle ([7afcd31](https://github.com/ho-nl/m2-pwa/commit/7afcd3163d16e902cf2ff7917f56ee6a8798f55b))
13
+ - Updated dependencies
14
+ [[`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)]:
15
+ - @graphcommerce/framer-scroller@2.0.0
16
+ - @graphcommerce/graphql@3.0.0
17
+ - @graphcommerce/image@3.0.0
18
+ - @graphcommerce/magento-product@4.0.0
19
+ - @graphcommerce/magento-store@4.0.0
20
+ - @graphcommerce/next-ui@4.0.0
12
21
 
22
+ All notable changes to this project will be documented in this file. See
23
+ [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
13
24
 
25
+ ## [3.5.2](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.5.1...@graphcommerce/magento-category@3.5.2) (2021-12-03)
14
26
 
27
+ ### Bug Fixes
15
28
 
29
+ - spacing of LayoutTItle
30
+ ([7afcd31](https://github.com/ho-nl/m2-pwa/commit/7afcd3163d16e902cf2ff7917f56ee6a8798f55b))
16
31
 
17
32
  # [3.5.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.4.4...@graphcommerce/magento-category@3.5.0) (2021-12-01)
18
33
 
19
-
20
34
  ### Features
21
35
 
22
- * borderRadius based on theme.shape.borderRadius ([7c34937](https://github.com/ho-nl/m2-pwa/commit/7c349376cd41a131c628324c299106fdb7e60484))
23
- * introduce borderRadius ([183afbc](https://github.com/ho-nl/m2-pwa/commit/183afbc8ee269f6694c372b06afdf41302f86c09))
24
-
25
-
26
-
27
-
36
+ - borderRadius based on theme.shape.borderRadius
37
+ ([7c34937](https://github.com/ho-nl/m2-pwa/commit/7c349376cd41a131c628324c299106fdb7e60484))
38
+ - introduce borderRadius
39
+ ([183afbc](https://github.com/ho-nl/m2-pwa/commit/183afbc8ee269f6694c372b06afdf41302f86c09))
28
40
 
29
41
  # [3.4.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.3.29...@graphcommerce/magento-category@3.4.0) (2021-11-12)
30
42
 
31
-
32
43
  ### Features
33
44
 
34
- * added tons of translations ([9bb0ac7](https://github.com/ho-nl/m2-pwa/commit/9bb0ac709b58df6ea6141e92e4923a5ca9ae2963))
35
-
36
-
37
-
38
-
45
+ - added tons of translations
46
+ ([9bb0ac7](https://github.com/ho-nl/m2-pwa/commit/9bb0ac709b58df6ea6141e92e4923a5ca9ae2963))
39
47
 
40
48
  ## [3.3.28](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.3.27...@graphcommerce/magento-category@3.3.28) (2021-11-12)
41
49
 
42
-
43
50
  ### Bug Fixes
44
51
 
45
- * fix spacing category video ([592f569](https://github.com/ho-nl/m2-pwa/commit/592f5690b28a423f10efaa4e685fdf7aaa9260dd))
46
- * safari video height stretch fix ([76a800b](https://github.com/ho-nl/m2-pwa/commit/76a800b80bd29fd92f55ff9d9e24bb8e1bfdf830))
47
-
48
-
49
-
50
-
52
+ - fix spacing category video
53
+ ([592f569](https://github.com/ho-nl/m2-pwa/commit/592f5690b28a423f10efaa4e685fdf7aaa9260dd))
54
+ - safari video height stretch fix
55
+ ([76a800b](https://github.com/ho-nl/m2-pwa/commit/76a800b80bd29fd92f55ff9d9e24bb8e1bfdf830))
51
56
 
52
57
  ## [3.3.26](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.3.25...@graphcommerce/magento-category@3.3.26) (2021-11-11)
53
58
 
54
-
55
59
  ### Bug Fixes
56
60
 
57
- * **category-hero-nav:** category children mobile styles ([7928853](https://github.com/ho-nl/m2-pwa/commit/79288538bb3b99682a7beea22223d35106a5d9c2))
58
- * **category-hero-nav:** category positioning ([2921dde](https://github.com/ho-nl/m2-pwa/commit/2921ddec4731e19c1ccb11f941ec59826a1f908d))
59
- * **category-hero-nav:** spacing ([94de2cf](https://github.com/ho-nl/m2-pwa/commit/94de2cf7be9c82a6408dbe33438275051d57143d))
60
-
61
-
62
-
63
-
61
+ - **category-hero-nav:** category children mobile styles
62
+ ([7928853](https://github.com/ho-nl/m2-pwa/commit/79288538bb3b99682a7beea22223d35106a5d9c2))
63
+ - **category-hero-nav:** category positioning
64
+ ([2921dde](https://github.com/ho-nl/m2-pwa/commit/2921ddec4731e19c1ccb11f941ec59826a1f908d))
65
+ - **category-hero-nav:** spacing
66
+ ([94de2cf](https://github.com/ho-nl/m2-pwa/commit/94de2cf7be9c82a6408dbe33438275051d57143d))
64
67
 
65
68
  ## [3.3.6](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.3.5...@graphcommerce/magento-category@3.3.6) (2021-11-02)
66
69
 
67
-
68
70
  ### Bug Fixes
69
71
 
70
- * darkMode ([c7573de](https://github.com/ho-nl/m2-pwa/commit/c7573de6bb80643b26931c35ac61735539e7fbf0))
71
-
72
-
73
-
74
-
72
+ - darkMode
73
+ ([c7573de](https://github.com/ho-nl/m2-pwa/commit/c7573de6bb80643b26931c35ac61735539e7fbf0))
75
74
 
76
75
  ## [3.3.3](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.3.2...@graphcommerce/magento-category@3.3.3) (2021-11-01)
77
76
 
78
-
79
77
  ### Bug Fixes
80
78
 
81
- * category page design fixs ([d3fccc2](https://github.com/ho-nl/m2-pwa/commit/d3fccc2a86106b854e9a1fd89040a248fe20c99a))
82
-
83
-
84
-
85
-
79
+ - category page design fixs
80
+ ([d3fccc2](https://github.com/ho-nl/m2-pwa/commit/d3fccc2a86106b854e9a1fd89040a248fe20c99a))
86
81
 
87
82
  ## [3.3.2](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.3.1...@graphcommerce/magento-category@3.3.2) (2021-10-29)
88
83
 
89
-
90
84
  ### Bug Fixes
91
85
 
92
- * spacing of title on category landing on mobile ([8ed3550](https://github.com/ho-nl/m2-pwa/commit/8ed35502fd231d1d6a8e0a282f8961335d9dead3))
93
-
94
-
95
-
96
-
86
+ - spacing of title on category landing on mobile
87
+ ([8ed3550](https://github.com/ho-nl/m2-pwa/commit/8ed35502fd231d1d6a8e0a282f8961335d9dead3))
97
88
 
98
89
  # [3.3.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.2.2...@graphcommerce/magento-category@3.3.0) (2021-10-28)
99
90
 
100
-
101
91
  ### Bug Fixes
102
92
 
103
- * category h2 styling ([5b26f2b](https://github.com/ho-nl/m2-pwa/commit/5b26f2b92f55356c58cc207fa028d03a38a8b16a))
104
- * remove legacy, title from category description ([574208c](https://github.com/ho-nl/m2-pwa/commit/574208ca71e6ed387f1f355d5c4a22f5c13783ea))
105
- * subtitles ([9ef1d8b](https://github.com/ho-nl/m2-pwa/commit/9ef1d8b9079c50340015e482fe6f1bf577610269))
106
-
93
+ - category h2 styling
94
+ ([5b26f2b](https://github.com/ho-nl/m2-pwa/commit/5b26f2b92f55356c58cc207fa028d03a38a8b16a))
95
+ - remove legacy, title from category description
96
+ ([574208c](https://github.com/ho-nl/m2-pwa/commit/574208ca71e6ed387f1f355d5c4a22f5c13783ea))
97
+ - subtitles
98
+ ([9ef1d8b](https://github.com/ho-nl/m2-pwa/commit/9ef1d8b9079c50340015e482fe6f1bf577610269))
107
99
 
108
100
  ### Features
109
101
 
110
- * set correct font sizes ([9317448](https://github.com/ho-nl/m2-pwa/commit/9317448c94a9fb4408dfbcaa320adccc363964d0))
111
-
112
-
113
-
114
-
102
+ - set correct font sizes
103
+ ([9317448](https://github.com/ho-nl/m2-pwa/commit/9317448c94a9fb4408dfbcaa320adccc363964d0))
115
104
 
116
105
  # [3.2.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.1.7...@graphcommerce/magento-category@3.2.0) (2021-10-27)
117
106
 
118
-
119
107
  ### Features
120
108
 
121
- * **nextjs:** upgraded to nextjs 12 ([9331bc8](https://github.com/ho-nl/m2-pwa/commit/9331bc801f6419522115cc47d291d49d608d5a90))
122
-
123
-
124
-
125
-
109
+ - **nextjs:** upgraded to nextjs 12
110
+ ([9331bc8](https://github.com/ho-nl/m2-pwa/commit/9331bc801f6419522115cc47d291d49d608d5a90))
126
111
 
127
112
  ## [3.1.2](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.1.1...@graphcommerce/magento-category@3.1.2) (2021-10-19)
128
113
 
129
-
130
114
  ### Bug Fixes
131
115
 
132
- * positioning children categories ([33568ee](https://github.com/ho-nl/m2-pwa/commit/33568ee7a798f8cab149b6c23b6e044d81642f53))
133
-
134
-
135
-
136
-
116
+ - positioning children categories
117
+ ([33568ee](https://github.com/ho-nl/m2-pwa/commit/33568ee7a798f8cab149b6c23b6e044d81642f53))
137
118
 
138
119
  # [3.1.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.0.30...@graphcommerce/magento-category@3.1.0) (2021-10-19)
139
120
 
140
-
141
121
  ### Features
142
122
 
143
- * **framer-scroller:** better defaults so the Scroller doesn't look broken when providing no props ([b177ce9](https://github.com/ho-nl/m2-pwa/commit/b177ce9570abb9ccfd4eb5cc34e43d157bb4e81a))
144
-
145
-
146
-
147
-
123
+ - **framer-scroller:** better defaults so the Scroller doesn't look broken when providing no props
124
+ ([b177ce9](https://github.com/ho-nl/m2-pwa/commit/b177ce9570abb9ccfd4eb5cc34e43d157bb4e81a))
148
125
 
149
126
  ## [3.0.11](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.0.10...@graphcommerce/magento-category@3.0.11) (2021-10-04)
150
127
 
151
-
152
128
  ### Bug Fixes
153
129
 
154
- * **category-childeren:** scrollbar shown ([638e3ef](https://github.com/ho-nl/m2-pwa/commit/638e3efea3a537f90d23fb2f8953a62acb370288))
155
- * **category-children:** scrollbar shown ([3ccc78b](https://github.com/ho-nl/m2-pwa/commit/3ccc78b329fa844c57bfeb2406c593d0533039d2))
156
-
157
-
158
-
159
-
130
+ - **category-childeren:** scrollbar shown
131
+ ([638e3ef](https://github.com/ho-nl/m2-pwa/commit/638e3efea3a537f90d23fb2f8953a62acb370288))
132
+ - **category-children:** scrollbar shown
133
+ ([3ccc78b](https://github.com/ho-nl/m2-pwa/commit/3ccc78b329fa844c57bfeb2406c593d0533039d2))
160
134
 
161
135
  ## [3.0.1](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@3.0.0...@graphcommerce/magento-category@3.0.1) (2021-09-27)
162
136
 
163
137
  **Note:** Version bump only for package @graphcommerce/magento-category
164
138
 
165
-
166
-
167
-
168
-
169
139
  # 3.0.0 (2021-09-27)
170
140
 
171
-
172
141
  ### Bug Fixes
173
142
 
174
- * **app-shell-header:** title offset top not correctly set ([c144309](https://github.com/ho-nl/m2-pwa/commit/c1443095317c1779074f3a4058f4041159c8e31b))
175
- * **app-shell:** pages after app shell changes ([fb74510](https://github.com/ho-nl/m2-pwa/commit/fb74510121f6124009db72ad2ddebf6459c52a85))
176
- * canonical urls ([9ff8d3f](https://github.com/ho-nl/m2-pwa/commit/9ff8d3f950098fb28440f31f5dd93a835dce0bda))
177
- * category children and swatch renderer ([1ee008d](https://github.com/ho-nl/m2-pwa/commit/1ee008d9ecf3bf5ec4b2d82243e4bcbbec384411))
178
- * category children mobile positioning ([fafa02d](https://github.com/ho-nl/m2-pwa/commit/fafa02d393919cdb7f89d72afa17da07228f8093))
179
- * category hero nav margin top ([31f8dee](https://github.com/ho-nl/m2-pwa/commit/31f8deed1d545d78bb856d4cfdfe0c7ec8671308))
180
- * CategoryHeroNav styles ([6f185e7](https://github.com/ho-nl/m2-pwa/commit/6f185e74ee4c756efdf94ebcdee9b4593077f415))
181
- * empty grid rows still have a gap ([7ba50c7](https://github.com/ho-nl/m2-pwa/commit/7ba50c740aa7ac5133b933b3e6a22fab853b55a6))
182
- * filters sometimes do not apply ([b8bc412](https://github.com/ho-nl/m2-pwa/commit/b8bc4122c82c6b27bdc76481dd6ece1da021266a))
183
- * **framer-next-page:** usePageRouter in SharedLayout ([c2fb164](https://github.com/ho-nl/m2-pwa/commit/c2fb164b342770089b787378a3f79529c36d2152))
184
- * getStaticPaths shouldn’t have the url suffix ([0fc9e1c](https://github.com/ho-nl/m2-pwa/commit/0fc9e1cec78ba653e32de042fb60a3ca88eb494d))
185
- * ignore md files from triggering version updates ([4f98392](https://github.com/ho-nl/m2-pwa/commit/4f9839250b3a32d3070da5290e5efcc5e2243fba))
186
- * implement next-ui barrel imports ([75bea70](https://github.com/ho-nl/m2-pwa/commit/75bea703dba898f18a2a1dfa3243ebd0a4e6f0e1))
187
- * remove conflicting files ([0c17ae4](https://github.com/ho-nl/m2-pwa/commit/0c17ae46be62b775ac83b35f11c532ce2d9401a3))
188
- * remove magento-category package from magento-product solving a circular dependency ([7379e6e](https://github.com/ho-nl/m2-pwa/commit/7379e6ede4829392b35008c17743181d9cac0636))
189
- * search page routes ([4161179](https://github.com/ho-nl/m2-pwa/commit/4161179aaf2ecbc0fde0efbba891a7b85524e283))
190
- * since all links are of next/link we need to add passHref for custom components ([16fb931](https://github.com/ho-nl/m2-pwa/commit/16fb93100d367203ea79bb4f93357221253f2ecd))
191
- * solve issue if an attribute was named ‘size’ ([dab088e](https://github.com/ho-nl/m2-pwa/commit/dab088ed5f1a2916dc991a7d5c0b8d703a2ea3b7))
192
- * spelling errors, wrong imports ([01cb889](https://github.com/ho-nl/m2-pwa/commit/01cb889513d69ce0555ac7aaa1a37702d75b0a0d))
193
- * update magento-product imports ([63621b4](https://github.com/ho-nl/m2-pwa/commit/63621b44be7149014f4a5af8ac87ad1c4b0327be))
194
- * word-break for category hero nav ([be47595](https://github.com/ho-nl/m2-pwa/commit/be4759519a23889950430d60a9264d9806df552c))
195
- * yarn workspace packages hot reload ([d03fc9f](https://github.com/ho-nl/m2-pwa/commit/d03fc9fdda3486476761786f2b56a934cc92befc))
196
-
143
+ - **app-shell-header:** title offset top not correctly set
144
+ ([c144309](https://github.com/ho-nl/m2-pwa/commit/c1443095317c1779074f3a4058f4041159c8e31b))
145
+ - **app-shell:** pages after app shell changes
146
+ ([fb74510](https://github.com/ho-nl/m2-pwa/commit/fb74510121f6124009db72ad2ddebf6459c52a85))
147
+ - canonical urls
148
+ ([9ff8d3f](https://github.com/ho-nl/m2-pwa/commit/9ff8d3f950098fb28440f31f5dd93a835dce0bda))
149
+ - category children and swatch renderer
150
+ ([1ee008d](https://github.com/ho-nl/m2-pwa/commit/1ee008d9ecf3bf5ec4b2d82243e4bcbbec384411))
151
+ - category children mobile positioning
152
+ ([fafa02d](https://github.com/ho-nl/m2-pwa/commit/fafa02d393919cdb7f89d72afa17da07228f8093))
153
+ - category hero nav margin top
154
+ ([31f8dee](https://github.com/ho-nl/m2-pwa/commit/31f8deed1d545d78bb856d4cfdfe0c7ec8671308))
155
+ - CategoryHeroNav styles
156
+ ([6f185e7](https://github.com/ho-nl/m2-pwa/commit/6f185e74ee4c756efdf94ebcdee9b4593077f415))
157
+ - empty grid rows still have a gap
158
+ ([7ba50c7](https://github.com/ho-nl/m2-pwa/commit/7ba50c740aa7ac5133b933b3e6a22fab853b55a6))
159
+ - filters sometimes do not apply
160
+ ([b8bc412](https://github.com/ho-nl/m2-pwa/commit/b8bc4122c82c6b27bdc76481dd6ece1da021266a))
161
+ - **framer-next-page:** usePageRouter in SharedLayout
162
+ ([c2fb164](https://github.com/ho-nl/m2-pwa/commit/c2fb164b342770089b787378a3f79529c36d2152))
163
+ - getStaticPaths shouldn’t have the url suffix
164
+ ([0fc9e1c](https://github.com/ho-nl/m2-pwa/commit/0fc9e1cec78ba653e32de042fb60a3ca88eb494d))
165
+ - ignore md files from triggering version updates
166
+ ([4f98392](https://github.com/ho-nl/m2-pwa/commit/4f9839250b3a32d3070da5290e5efcc5e2243fba))
167
+ - implement next-ui barrel imports
168
+ ([75bea70](https://github.com/ho-nl/m2-pwa/commit/75bea703dba898f18a2a1dfa3243ebd0a4e6f0e1))
169
+ - remove conflicting files
170
+ ([0c17ae4](https://github.com/ho-nl/m2-pwa/commit/0c17ae46be62b775ac83b35f11c532ce2d9401a3))
171
+ - remove magento-category package from magento-product solving a circular dependency
172
+ ([7379e6e](https://github.com/ho-nl/m2-pwa/commit/7379e6ede4829392b35008c17743181d9cac0636))
173
+ - search page routes
174
+ ([4161179](https://github.com/ho-nl/m2-pwa/commit/4161179aaf2ecbc0fde0efbba891a7b85524e283))
175
+ - since all links are of next/link we need to add passHref for custom components
176
+ ([16fb931](https://github.com/ho-nl/m2-pwa/commit/16fb93100d367203ea79bb4f93357221253f2ecd))
177
+ - solve issue if an attribute was named ‘size’
178
+ ([dab088e](https://github.com/ho-nl/m2-pwa/commit/dab088ed5f1a2916dc991a7d5c0b8d703a2ea3b7))
179
+ - spelling errors, wrong imports
180
+ ([01cb889](https://github.com/ho-nl/m2-pwa/commit/01cb889513d69ce0555ac7aaa1a37702d75b0a0d))
181
+ - update magento-product imports
182
+ ([63621b4](https://github.com/ho-nl/m2-pwa/commit/63621b44be7149014f4a5af8ac87ad1c4b0327be))
183
+ - word-break for category hero nav
184
+ ([be47595](https://github.com/ho-nl/m2-pwa/commit/be4759519a23889950430d60a9264d9806df552c))
185
+ - yarn workspace packages hot reload
186
+ ([d03fc9f](https://github.com/ho-nl/m2-pwa/commit/d03fc9fdda3486476761786f2b56a934cc92befc))
197
187
 
198
188
  ### Features
199
189
 
200
- * add barrel file for magento-category ([c5ba8c9](https://github.com/ho-nl/m2-pwa/commit/c5ba8c98cbb8192f1c1c85242ff6efa83b1fbdcc))
201
- * add getFilterTypes to shared client, faster generation ([beccfde](https://github.com/ho-nl/m2-pwa/commit/beccfde6ebc8aaf6223f0e8b33fabf4f5039efed))
202
- * add graphcms asset to category page ([a760f25](https://github.com/ho-nl/m2-pwa/commit/a760f2547485e56b1fd4ecb03dd3cfb0a1c4819e))
203
- * animated filters ([846e233](https://github.com/ho-nl/m2-pwa/commit/846e233c9653821afbe9cfe7742dc42bb869a078))
204
- * better 404 handling and simplified getStaticProps ([321ace1](https://github.com/ho-nl/m2-pwa/commit/321ace1850642ee3eddfa674c37e6fca8adcdb74))
205
- * canonical urls using abstract page meta component ([7d52cfc](https://github.com/ho-nl/m2-pwa/commit/7d52cfc76af2766dedf883b1e3fa5a5101eca823))
206
- * category navigation ([00d1997](https://github.com/ho-nl/m2-pwa/commit/00d199741bb1ab266900869d27ac7251841aaf94))
207
- * created stable layout for category filters ([08d9351](https://github.com/ho-nl/m2-pwa/commit/08d9351dac5c9ede864ff336a60d758875d8efe4))
208
- * created stacked-pages package ([d86008e](https://github.com/ho-nl/m2-pwa/commit/d86008ee659ccb25b194a41d624b394a1ddbd088))
209
- * data agnostic animated header ([17047a6](https://github.com/ho-nl/m2-pwa/commit/17047a6d754494d9443c8f2e486cc232cf199c45))
210
- * **framer-next-pages:** implemented the FullPageShell for the remaining pages ([88386b4](https://github.com/ho-nl/m2-pwa/commit/88386b4652abb7765d6e755c7fb7a3cb6285a0e7))
211
- * **framer-scroller:** implemented the scroller on all pages ([73fb518](https://github.com/ho-nl/m2-pwa/commit/73fb518eff74edb2b3212e892b3d8cc2b088011b))
212
- * **graphql:** introduced new graphql package that holds all generated files ([a3e7aa0](https://github.com/ho-nl/m2-pwa/commit/a3e7aa05540540533b5ced9a95f1f802ecbe499f))
213
- * i18n routing added (/ and /fr for demo) ([bb3b339](https://github.com/ho-nl/m2-pwa/commit/bb3b339fbc9fceddd264a891ad81f00327a241ae))
214
- * **image:** introduced completely rewritten Image component ([e3413b3](https://github.com/ho-nl/m2-pwa/commit/e3413b3a57392d6571ea64cb8d9c8dca05ea31df))
215
- * introduced magento-product-types package ([1a0932b](https://github.com/ho-nl/m2-pwa/commit/1a0932b5d882608dcf8fd2e3b17ee9868f5f5776))
216
- * introduces framer-next-pages and framer-sheet to next-ui and soxbase package ([e04ad8a](https://github.com/ho-nl/m2-pwa/commit/e04ad8a94cd1fd5a7c5575c9db7916b6e8a88f16))
217
- * **magento-graphql:** added core magentoTypePolicies ([bdf15d0](https://github.com/ho-nl/m2-pwa/commit/bdf15d0d3c04e88339a8385d76f3b1ab9589fde3))
218
- * major performance refactor ([03f8e2f](https://github.com/ho-nl/m2-pwa/commit/03f8e2fa16ef919bd6bd6eadd36922d0245ed960))
219
- * next.js 11 ([7d61407](https://github.com/ho-nl/m2-pwa/commit/7d614075a778f488045034f74be4f75b93f63c43))
220
- * **playwright:** added new playwright package to enable browser testing ([6f49ec7](https://github.com/ho-nl/m2-pwa/commit/6f49ec7595563775b96ebf21c27e39da1282e8d9))
221
- * remove wrapper div from ScrollSnapSlider ([476add8](https://github.com/ho-nl/m2-pwa/commit/476add8db64811f2c7e3fc482487967cd7573cf6))
222
- * renamed all packages to use [@graphcommerce](https://github.com/graphcommerce) instead of [@reachdigital](https://github.com/reachdigital) ([491e4ce](https://github.com/ho-nl/m2-pwa/commit/491e4cec9a2686472dac36b79f999257c0811ffe))
223
- * upgrade to node 14 ([d079a75](https://github.com/ho-nl/m2-pwa/commit/d079a751e9bfd8dc7f5009d2c9f31c336a0c96ab))
224
- * upgraded to nextjs 11 ([0053beb](https://github.com/ho-nl/m2-pwa/commit/0053beb7ef597c190add7264256a0eaec35868da))
225
- * video support for CategoryHeroNav ([e24fe60](https://github.com/ho-nl/m2-pwa/commit/e24fe600f776aaf41735178472b2d1343c5252e6))
226
-
190
+ - add barrel file for magento-category
191
+ ([c5ba8c9](https://github.com/ho-nl/m2-pwa/commit/c5ba8c98cbb8192f1c1c85242ff6efa83b1fbdcc))
192
+ - add getFilterTypes to shared client, faster generation
193
+ ([beccfde](https://github.com/ho-nl/m2-pwa/commit/beccfde6ebc8aaf6223f0e8b33fabf4f5039efed))
194
+ - add graphcms asset to category page
195
+ ([a760f25](https://github.com/ho-nl/m2-pwa/commit/a760f2547485e56b1fd4ecb03dd3cfb0a1c4819e))
196
+ - animated filters
197
+ ([846e233](https://github.com/ho-nl/m2-pwa/commit/846e233c9653821afbe9cfe7742dc42bb869a078))
198
+ - better 404 handling and simplified getStaticProps
199
+ ([321ace1](https://github.com/ho-nl/m2-pwa/commit/321ace1850642ee3eddfa674c37e6fca8adcdb74))
200
+ - canonical urls using abstract page meta component
201
+ ([7d52cfc](https://github.com/ho-nl/m2-pwa/commit/7d52cfc76af2766dedf883b1e3fa5a5101eca823))
202
+ - category navigation
203
+ ([00d1997](https://github.com/ho-nl/m2-pwa/commit/00d199741bb1ab266900869d27ac7251841aaf94))
204
+ - created stable layout for category filters
205
+ ([08d9351](https://github.com/ho-nl/m2-pwa/commit/08d9351dac5c9ede864ff336a60d758875d8efe4))
206
+ - created stacked-pages package
207
+ ([d86008e](https://github.com/ho-nl/m2-pwa/commit/d86008ee659ccb25b194a41d624b394a1ddbd088))
208
+ - data agnostic animated header
209
+ ([17047a6](https://github.com/ho-nl/m2-pwa/commit/17047a6d754494d9443c8f2e486cc232cf199c45))
210
+ - **framer-next-pages:** implemented the FullPageShell for the remaining pages
211
+ ([88386b4](https://github.com/ho-nl/m2-pwa/commit/88386b4652abb7765d6e755c7fb7a3cb6285a0e7))
212
+ - **framer-scroller:** implemented the scroller on all pages
213
+ ([73fb518](https://github.com/ho-nl/m2-pwa/commit/73fb518eff74edb2b3212e892b3d8cc2b088011b))
214
+ - **graphql:** introduced new graphql package that holds all generated files
215
+ ([a3e7aa0](https://github.com/ho-nl/m2-pwa/commit/a3e7aa05540540533b5ced9a95f1f802ecbe499f))
216
+ - i18n routing added (/ and /fr for demo)
217
+ ([bb3b339](https://github.com/ho-nl/m2-pwa/commit/bb3b339fbc9fceddd264a891ad81f00327a241ae))
218
+ - **image:** introduced completely rewritten Image component
219
+ ([e3413b3](https://github.com/ho-nl/m2-pwa/commit/e3413b3a57392d6571ea64cb8d9c8dca05ea31df))
220
+ - introduced magento-product-types package
221
+ ([1a0932b](https://github.com/ho-nl/m2-pwa/commit/1a0932b5d882608dcf8fd2e3b17ee9868f5f5776))
222
+ - introduces framer-next-pages and framer-sheet to next-ui and soxbase package
223
+ ([e04ad8a](https://github.com/ho-nl/m2-pwa/commit/e04ad8a94cd1fd5a7c5575c9db7916b6e8a88f16))
224
+ - **magento-graphql:** added core magentoTypePolicies
225
+ ([bdf15d0](https://github.com/ho-nl/m2-pwa/commit/bdf15d0d3c04e88339a8385d76f3b1ab9589fde3))
226
+ - major performance refactor
227
+ ([03f8e2f](https://github.com/ho-nl/m2-pwa/commit/03f8e2fa16ef919bd6bd6eadd36922d0245ed960))
228
+ - next.js 11
229
+ ([7d61407](https://github.com/ho-nl/m2-pwa/commit/7d614075a778f488045034f74be4f75b93f63c43))
230
+ - **playwright:** added new playwright package to enable browser testing
231
+ ([6f49ec7](https://github.com/ho-nl/m2-pwa/commit/6f49ec7595563775b96ebf21c27e39da1282e8d9))
232
+ - remove wrapper div from ScrollSnapSlider
233
+ ([476add8](https://github.com/ho-nl/m2-pwa/commit/476add8db64811f2c7e3fc482487967cd7573cf6))
234
+ - renamed all packages to use [@graphcommerce](https://github.com/graphcommerce) instead of
235
+ [@reachdigital](https://github.com/reachdigital)
236
+ ([491e4ce](https://github.com/ho-nl/m2-pwa/commit/491e4cec9a2686472dac36b79f999257c0811ffe))
237
+ - upgrade to node 14
238
+ ([d079a75](https://github.com/ho-nl/m2-pwa/commit/d079a751e9bfd8dc7f5009d2c9f31c336a0c96ab))
239
+ - upgraded to nextjs 11
240
+ ([0053beb](https://github.com/ho-nl/m2-pwa/commit/0053beb7ef597c190add7264256a0eaec35868da))
241
+ - video support for CategoryHeroNav
242
+ ([e24fe60](https://github.com/ho-nl/m2-pwa/commit/e24fe600f776aaf41735178472b2d1343c5252e6))
227
243
 
228
244
  ### Reverts
229
245
 
230
- * Revert "chore: upgrade @apollo/client" ([55ff24e](https://github.com/ho-nl/m2-pwa/commit/55ff24ede0e56c85b8095edadadd1ec5e0b1b8d2))
231
-
232
-
246
+ - Revert "chore: upgrade @apollo/client"
247
+ ([55ff24e](https://github.com/ho-nl/m2-pwa/commit/55ff24ede0e56c85b8095edadadd1ec5e0b1b8d2))
233
248
 
234
249
  ## 2.0.8 (2020-10-28)
235
250
 
236
-
237
251
  ### Bug Fixes
238
252
 
239
- * make sure themes extensions are found ([5aa18db](https://github.com/ho-nl/m2-pwa/commit/5aa18db514fd2e2f50681367e39523f8e742ece0))
240
-
253
+ - make sure themes extensions are found
254
+ ([5aa18db](https://github.com/ho-nl/m2-pwa/commit/5aa18db514fd2e2f50681367e39523f8e742ece0))
241
255
 
242
256
  ### Features
243
257
 
244
- * added generated graphql.ts files ([3e44415](https://github.com/ho-nl/m2-pwa/commit/3e44415b018e74b502e9e98479aa5e84041f337d))
245
- * split into packages ([2ee7fd6](https://github.com/ho-nl/m2-pwa/commit/2ee7fd6c0056f467d114f04d92c6c0ddf622d151))
246
-
258
+ - added generated graphql.ts files
259
+ ([3e44415](https://github.com/ho-nl/m2-pwa/commit/3e44415b018e74b502e9e98479aa5e84041f337d))
260
+ - split into packages
261
+ ([2ee7fd6](https://github.com/ho-nl/m2-pwa/commit/2ee7fd6c0056f467d114f04d92c6c0ddf622d151))
247
262
 
248
263
  ### BREAKING CHANGES
249
264
 
250
- * huge folder structure refactor, please read README to reinstall
251
-
252
-
253
-
254
-
265
+ - huge folder structure refactor, please read README to reinstall
255
266
 
256
267
  # Change Log
257
268
 
@@ -290,8 +301,7 @@ All notable changes to this project will be documented in this file. See
290
301
 
291
302
  ### Bug Fixes
292
303
 
293
- - remove magento-category package from magento-product solving a circular
294
- dependency
304
+ - remove magento-category package from magento-product solving a circular dependency
295
305
  ([7379e6e](https://github.com/ho-nl/m2-pwa/commit/7379e6ede4829392b35008c17743181d9cac0636))
296
306
 
297
307
  # [2.101.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-category@2.100.18...@graphcommerce/magento-category@2.101.0) (2021-07-26)
@@ -1,67 +1,42 @@
1
- import { cloneDeep } from '@apollo/client/utilities'
2
1
  import { Scroller, ScrollerProvider } from '@graphcommerce/framer-scroller'
2
+ import { cloneDeep } from '@graphcommerce/graphql'
3
3
  import { ProductListLink, ProductListParams } from '@graphcommerce/magento-product'
4
- import { UseStyles } from '@graphcommerce/next-ui'
5
- import { makeStyles, Theme } from '@material-ui/core'
6
- import React from 'react'
4
+ import { extendableComponent } from '@graphcommerce/next-ui'
5
+ import { Box, SxProps, Theme } from '@mui/material'
7
6
  import { CategoryChildrenFragment } from './CategoryChildren.gql'
8
7
 
9
- const useStyles = makeStyles(
10
- (theme: Theme) => ({
11
- container: {
12
- display: 'flex',
13
- justifyContent: 'center',
14
- marginBottom: theme.spacings.sm,
15
- },
16
- scroller: {
17
- gridAutoColumns: `max-content`,
18
- },
19
- link: {
20
- whiteSpace: 'nowrap',
21
- display: 'block',
22
- marginRight: `${theme.spacings.xxs}`,
23
- marginLeft: `${theme.spacings.xxs}`,
24
- ...theme.typography.h6,
25
- position: 'relative',
26
- paddingBottom: 8,
27
- '&:before': {
28
- content: '""',
29
- width: 40,
30
- height: 2,
31
- background: theme.palette.primary.main,
32
- position: 'absolute',
33
- left: 0,
34
- right: 0,
35
- margin: '0 auto',
36
- opacity: 0,
37
- transition: 'opacity .2s ease, bottom .2s ease',
38
- bottom: 0,
39
- },
40
- '&:hover': {
41
- '&:before': {
42
- opacity: 1,
43
- bottom: 5,
44
- },
45
- },
46
- },
47
- }),
48
- { name: 'CategoryChildren' },
49
- )
50
-
51
8
  type CategoryChildrenProps = Omit<CategoryChildrenFragment, 'uid'> & {
52
9
  params: ProductListParams
53
- } & UseStyles<typeof useStyles>
10
+ sx?: SxProps<Theme>
11
+ }
12
+
13
+ const name = 'CategoryChildren' as const
14
+ const parts = ['container', 'scroller', 'link'] as const
15
+ const { classes } = extendableComponent(name, parts)
54
16
 
55
17
  export default function CategoryChildren(props: CategoryChildrenProps) {
56
- const { children, params } = props
57
- const classes = useStyles(props)
18
+ const { children, params, sx = [] } = props
58
19
 
59
20
  if (!children || children.length === 0) return null
60
21
 
61
22
  return (
62
23
  <ScrollerProvider scrollSnapAlign='none'>
63
- <div className={classes.container}>
64
- <Scroller className={classes.scroller} hideScrollbar>
24
+ <Box
25
+ className={classes.container}
26
+ sx={[
27
+ (theme) => ({
28
+ display: 'flex',
29
+ justifyContent: 'center',
30
+ marginBottom: theme.spacings.sm,
31
+ }),
32
+ ...(Array.isArray(sx) ? sx : [sx]),
33
+ ]}
34
+ >
35
+ <Scroller
36
+ className={classes.scroller}
37
+ hideScrollbar
38
+ sx={{ gridAutoColumns: `max-content` }}
39
+ >
65
40
  {children.map((cat) => {
66
41
  if (!cat?.url_path || !cat.name) return null
67
42
 
@@ -76,13 +51,41 @@ export default function CategoryChildren(props: CategoryChildrenProps) {
76
51
  color='inherit'
77
52
  {...linkParams}
78
53
  className={classes.link}
54
+ sx={(theme) => ({
55
+ whiteSpace: 'nowrap',
56
+ display: 'block',
57
+ marginRight: `${theme.spacings.xxs}`,
58
+ marginLeft: `${theme.spacings.xxs}`,
59
+ typography: 'h6',
60
+ position: 'relative',
61
+ paddingBottom: '8px',
62
+ '&:before': {
63
+ content: '""',
64
+ width: 40,
65
+ height: 2,
66
+ background: theme.palette.primary.main,
67
+ position: 'absolute',
68
+ left: 0,
69
+ right: 0,
70
+ margin: '0 auto',
71
+ opacity: 0,
72
+ transition: 'opacity .2s ease, bottom .2s ease',
73
+ bottom: 0,
74
+ },
75
+ '&:hover': {
76
+ '&:before': {
77
+ opacity: 1,
78
+ bottom: 5,
79
+ },
80
+ },
81
+ })}
79
82
  >
80
83
  {cat.name}
81
84
  </ProductListLink>
82
85
  )
83
86
  })}
84
87
  </Scroller>
85
- </div>
88
+ </Box>
86
89
  </ScrollerProvider>
87
90
  )
88
91
  }
@@ -1,37 +1,38 @@
1
- import { UseStyles } from '@graphcommerce/next-ui'
2
- import { makeStyles, Theme } from '@material-ui/core'
3
- import React from 'react'
1
+ import { extendableComponent } from '@graphcommerce/next-ui'
2
+ import { Box, SxProps, Theme } from '@mui/material'
4
3
  import { CategoryDescriptionFragment } from './CategoryDescription.gql'
5
4
 
6
- type CategoryDescriptionProps = Omit<CategoryDescriptionFragment, 'uid'> &
7
- JSX.IntrinsicElements['div'] &
8
- UseStyles<typeof useStyles>
5
+ type CategoryDescriptionProps = Omit<CategoryDescriptionFragment, 'uid'> & { sx?: SxProps<Theme> }
9
6
 
10
- const useStyles = makeStyles(
11
- (theme: Theme) => ({
12
- root: {
13
- gridArea: 'description',
14
- margin: `0 auto ${theme.spacings.sm}`,
15
- padding: `0 ${theme.page.horizontal}`,
16
- textAlign: 'center',
17
- [theme.breakpoints.up('md')]: {
18
- maxWidth: '50%',
19
- },
20
- [theme.breakpoints.up('xl')]: {
21
- maxWidth: '30%',
22
- },
23
- ...theme.typography.subtitle1,
24
- },
25
- }),
26
- { name: 'CategoryDescription' },
27
- )
7
+ const cmpName = 'CategoryDescription' as const
8
+ const parts = ['root'] as const
9
+ const { classes } = extendableComponent(cmpName, parts)
28
10
 
29
11
  export default function CategoryDescription(props: CategoryDescriptionProps) {
30
- const { name, description, display_mode, ...divProps } = props
31
- const classes = useStyles(props)
12
+ const { name, description, display_mode, sx = [], ...divProps } = props
32
13
 
33
14
  return description ? (
34
15
  // eslint-disable-next-line react/no-danger
35
- <div {...divProps} className={classes.root} dangerouslySetInnerHTML={{ __html: description }} />
16
+ <Box
17
+ {...divProps}
18
+ className={classes.root}
19
+ dangerouslySetInnerHTML={{ __html: description }}
20
+ sx={[
21
+ (theme) => ({
22
+ gridArea: 'description',
23
+ margin: `0 auto ${theme.spacings.sm}`,
24
+ padding: `0 ${theme.page.horizontal}`,
25
+ textAlign: 'center',
26
+ [theme.breakpoints.up('md')]: {
27
+ maxWidth: '50%',
28
+ },
29
+ [theme.breakpoints.up('xl')]: {
30
+ maxWidth: '30%',
31
+ },
32
+ typography: 'subtitle1',
33
+ }),
34
+ ...(Array.isArray(sx) ? sx : [sx]),
35
+ ]}
36
+ />
36
37
  ) : null
37
38
  }
@@ -1,104 +1,90 @@
1
1
  import { ProductListLink } from '@graphcommerce/magento-product'
2
- import { responsiveVal, Row } from '@graphcommerce/next-ui'
3
- import { makeStyles, Theme, Typography } from '@material-ui/core'
2
+ import { responsiveVal, Row, extendableComponent } from '@graphcommerce/next-ui'
3
+ import { Box, SxProps, Theme, Typography } from '@mui/material'
4
4
  import React from 'react'
5
5
  import { CategoryHeroNavFragment } from './CategoryHeroNav.gql'
6
6
 
7
- const useStyles = makeStyles(
8
- (theme: Theme) => ({
9
- wrapper: {
10
- display: 'grid',
11
- gridTemplateColumns: '1fr',
12
- gridTemplateAreas: `
13
- "title"
14
- "categories"
15
- "placeholder"
16
- `,
17
- gridTemplateRows: 'auto auto 1fr',
18
- borderBottom: `1px solid ${theme.palette.divider}`,
19
- marginBottom: theme.spacings.xxl,
20
- paddingBottom: theme.page.vertical,
21
- [theme.breakpoints.up('md')]: {
22
- rowGap: theme.spacings.md,
23
- width: '100%',
24
- paddingRight: theme.page.horizontal,
25
- },
26
- },
27
- categories: {
28
- gridArea: 'categories',
29
- display: 'grid',
30
- gridColumnGap: theme.spacings.xxl,
31
- gridRowGap: theme.spacings.lg,
32
- height: 'min-content',
33
- maxWidth: '80vw',
34
- justifySelf: 'center',
35
- alignSelf: 'start',
36
- gridTemplateColumns: '1fr 1fr',
37
- marginBottom: theme.spacings.lg,
38
- [theme.breakpoints.up('md')]: {
39
- margin: 0,
40
- gridColumnGap: theme.spacings.md,
41
- gridRowGap: theme.spacings.md,
42
- maxWidth: '100vw',
43
- width: '100%',
44
- justifySelf: 'start',
45
- },
46
- },
47
- title: {
48
- gridArea: 'title',
49
- alignSelf: 'center',
50
- [theme.breakpoints.up('md')]: {
51
- alignSelf: 'end',
52
- },
53
- },
54
- placeholder: {
55
- gridArea: 'placeholder',
56
- minHeight: '40vh',
57
- overflow: 'hidden',
58
- display: 'flex',
59
- '& > div': {
60
- display: 'flex',
61
- },
62
- '& video': {
63
- objectFit: 'cover',
64
- width: '100%',
65
- borderRadius: responsiveVal(theme.shape.borderRadius * 2, theme.shape.borderRadius * 3),
66
- },
67
- },
68
- [theme.breakpoints.up('md')]: {
69
- placeholder: {
70
- minHeight: '80vh',
71
- },
72
- wrapper: {
73
- paddingTop: 0,
74
- gridColumnGap: 0,
75
- display: 'grid',
76
- gridTemplateAreas: `
77
- ". title . placeholder"
78
- ". categories . placeholder"
79
- `,
80
- gridTemplateColumns: '1fr 4.6fr 0.4fr 8fr',
81
- gridTemplateRows: '0.3fr 0.7fr',
82
- },
83
- },
84
- }),
85
- { name: 'CategoryHeroNav' },
86
- )
87
-
88
- type Props = {
7
+ export type CategoryHeroNavProps = {
89
8
  title: React.ReactNode
90
9
  asset?: React.ReactNode
91
- }
92
-
93
- type CategoryHeroNavProps = Props & CategoryHeroNavFragment
10
+ sx?: SxProps<Theme>
11
+ } & CategoryHeroNavFragment
94
12
 
95
- export default function CategoryHeroNav({ children, title, asset }: CategoryHeroNavProps) {
96
- const classes = useStyles()
13
+ const cmpName = 'CategoryHeroNav' as const
14
+ const parts = ['wrapper', 'categories', 'title', 'placeholder'] as const
15
+ const { classes } = extendableComponent(cmpName, parts)
97
16
 
17
+ export default function CategoryHeroNav({ children, title, asset, sx = [] }: CategoryHeroNavProps) {
98
18
  return (
99
- <Row className={classes.wrapper} maxWidth={false}>
100
- <div className={classes.title}>{title}</div>
101
- <div className={classes.categories}>
19
+ <Row
20
+ className={classes.wrapper}
21
+ maxWidth={false}
22
+ sx={[
23
+ (theme) => ({
24
+ display: 'grid',
25
+ gridTemplateColumns: '1fr',
26
+ gridTemplateAreas: `
27
+ "title"
28
+ "categories"
29
+ "placeholder"
30
+ `,
31
+ gridTemplateRows: 'auto auto 1fr',
32
+ borderBottom: `1px solid ${theme.palette.divider}`,
33
+ marginBottom: theme.spacings.xxl,
34
+ paddingBottom: theme.page.vertical,
35
+ [theme.breakpoints.up('md')]: {
36
+ rowGap: theme.spacings.md,
37
+ width: '100%',
38
+ paddingRight: theme.page.horizontal,
39
+ paddingTop: 0,
40
+ gridColumnGap: 0,
41
+ display: 'grid',
42
+ gridTemplateAreas: `
43
+ ". title . placeholder"
44
+ ". categories . placeholder"
45
+ `,
46
+ gridTemplateColumns: '1fr 4.6fr 0.4fr 8fr',
47
+ gridTemplateRows: '0.3fr 0.7fr',
48
+ },
49
+ }),
50
+ ...(Array.isArray(sx) ? sx : [sx]),
51
+ ]}
52
+ >
53
+ <Box
54
+ className={classes.title}
55
+ sx={(theme) => ({
56
+ gridArea: 'title',
57
+ alignSelf: 'center',
58
+ [theme.breakpoints.up('md')]: {
59
+ alignSelf: 'end',
60
+ },
61
+ })}
62
+ >
63
+ {title}
64
+ </Box>
65
+ <Box
66
+ className={classes.categories}
67
+ sx={(theme) => ({
68
+ gridArea: 'categories',
69
+ display: 'grid',
70
+ gridColumnGap: theme.spacings.xxl,
71
+ gridRowGap: theme.spacings.lg,
72
+ height: 'min-content',
73
+ maxWidth: '80vw',
74
+ justifySelf: 'center',
75
+ alignSelf: 'start',
76
+ gridTemplateColumns: '1fr 1fr',
77
+ marginBottom: theme.spacings.lg,
78
+ [theme.breakpoints.up('md')]: {
79
+ margin: 0,
80
+ gridColumnGap: theme.spacings.md,
81
+ gridRowGap: theme.spacings.md,
82
+ maxWidth: '100vw',
83
+ width: '100%',
84
+ justifySelf: 'start',
85
+ },
86
+ })}
87
+ >
102
88
  {children?.map((category) => {
103
89
  if (!category?.url_path || !category.uid || !category.name) return null
104
90
  return (
@@ -116,10 +102,29 @@ export default function CategoryHeroNav({ children, title, asset }: CategoryHero
116
102
  </ProductListLink>
117
103
  )
118
104
  })}
119
- </div>
120
- <div className={classes.placeholder}>
121
- <div>{asset}</div>
122
- </div>
105
+ </Box>
106
+ <Box
107
+ className={classes.placeholder}
108
+ sx={(theme) => ({
109
+ gridArea: 'placeholder',
110
+ minHeight: '40vh',
111
+ overflow: 'hidden',
112
+ display: 'flex',
113
+ '& > div': {
114
+ display: 'flex',
115
+ },
116
+ '& video': {
117
+ objectFit: 'cover',
118
+ width: '100%',
119
+ borderRadius: responsiveVal(theme.shape.borderRadius * 2, theme.shape.borderRadius * 3),
120
+ },
121
+ [theme.breakpoints.up('md')]: {
122
+ minHeight: '80vh',
123
+ },
124
+ })}
125
+ >
126
+ <Box>{asset}</Box>
127
+ </Box>
123
128
  </Row>
124
129
  )
125
130
  }
@@ -1,31 +1,30 @@
1
1
  import { LayoutTitle } from '@graphcommerce/next-ui'
2
- import { makeStyles, Theme } from '@material-ui/core'
2
+ import { SxProps, Theme } from '@mui/material'
3
3
  import React from 'react'
4
4
 
5
- const useStyles = makeStyles(
6
- (theme: Theme) => ({
7
- container: {
8
- justifyContent: 'center',
9
- [theme.breakpoints.up('md')]: {
10
- margin: 0,
11
- alignItems: 'start',
12
- justifyContent: 'end',
13
- },
14
- },
15
- }),
16
- { name: 'CategoryHeroNavTitle' },
17
- )
18
-
19
5
  type CategoryHeroNavTitleProps = {
20
6
  children: React.ReactNode
7
+ sx?: SxProps<Theme>
21
8
  }
22
9
 
23
10
  export default function CategoryHeroNavTitle(props: CategoryHeroNavTitleProps) {
24
- const { children } = props
25
- const classes = useStyles()
11
+ const { children, sx = [] } = props
26
12
 
27
13
  return (
28
- <LayoutTitle classes={classes} variant='h1'>
14
+ <LayoutTitle
15
+ variant='h1'
16
+ sx={[
17
+ (theme) => ({
18
+ justifyContent: 'center',
19
+ [theme.breakpoints.up('md')]: {
20
+ margin: 0,
21
+ alignItems: 'start',
22
+ justifyContent: 'end',
23
+ },
24
+ }),
25
+ ...(Array.isArray(sx) ? sx : [sx]),
26
+ ]}
27
+ >
29
28
  {children}
30
29
  </LayoutTitle>
31
30
  )
package/package.json CHANGED
@@ -1,11 +1,8 @@
1
1
  {
2
2
  "name": "@graphcommerce/magento-category",
3
- "version": "3.5.41",
3
+ "version": "4.0.0",
4
4
  "sideEffects": false,
5
5
  "prettier": "@graphcommerce/prettier-config-pwa",
6
- "browserslist": [
7
- "extends @graphcommerce/browserslist-config-pwa"
8
- ],
9
6
  "eslintConfig": {
10
7
  "extends": "@graphcommerce/eslint-config-pwa",
11
8
  "parserOptions": {
@@ -13,26 +10,23 @@
13
10
  }
14
11
  },
15
12
  "devDependencies": {
16
- "@graphcommerce/browserslist-config-pwa": "^3.0.3",
17
- "@graphcommerce/eslint-config-pwa": "^3.1.10",
18
- "@graphcommerce/prettier-config-pwa": "^3.0.5",
19
- "@graphcommerce/typescript-config-pwa": "^3.1.2",
20
- "@playwright/test": "^1.17.1"
13
+ "@graphcommerce/eslint-config-pwa": "^4.0.0",
14
+ "@graphcommerce/prettier-config-pwa": "^4.0.0",
15
+ "@graphcommerce/typescript-config-pwa": "^4.0.0",
16
+ "@playwright/test": "^1.18.1"
21
17
  },
22
18
  "dependencies": {
23
- "@apollo/client": "^3.5.6",
24
- "@graphcommerce/framer-scroller": "^1.2.10",
25
- "@graphcommerce/graphql": "^2.105.13",
26
- "@graphcommerce/image": "^2.105.13",
27
- "@graphcommerce/magento-product": "^3.8.11",
28
- "@graphcommerce/magento-store": "^3.4.10",
29
- "@graphcommerce/next-ui": "^3.25.1",
30
- "@lingui/macro": "^3.13.0",
31
- "@material-ui/core": "^4.12.3",
32
- "next": "^12.0.7",
19
+ "@graphcommerce/framer-scroller": "^2.0.0",
20
+ "@graphcommerce/graphql": "^3.0.0",
21
+ "@graphcommerce/image": "^3.0.0",
22
+ "@graphcommerce/magento-product": "^4.0.0",
23
+ "@graphcommerce/magento-store": "^4.0.0",
24
+ "@graphcommerce/next-ui": "^4.0.0",
25
+ "@lingui/macro": "^3.13.2",
26
+ "@mui/material": "^5.4.1",
27
+ "next": "^12.0.10",
33
28
  "react": "^17.0.2",
34
29
  "react-dom": "^17.0.2",
35
- "type-fest": "^2.8.0"
36
- },
37
- "gitHead": "2ae11143f3c64c46ef62a1f43360eca953a1f366"
30
+ "type-fest": "^2.11.2"
31
+ }
38
32
  }
@@ -1,4 +1,4 @@
1
- import { ApolloClient, NormalizedCacheObject } from '@apollo/client'
1
+ import { ApolloClient, NormalizedCacheObject } from '@graphcommerce/graphql'
2
2
  import { StoreConfigDocument } from '@graphcommerce/magento-store'
3
3
  import { GetStaticPathsResult } from 'next'
4
4
  import {