@graphcommerce/magento-search 3.5.46 → 4.0.2
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 +181 -152
- package/CategorySearchResult/index.tsx +33 -43
- package/NoSearchResults/index.tsx +26 -22
- package/SearchButton/index.tsx +31 -31
- package/SearchDivider/index.tsx +7 -10
- package/SearchForm/index.tsx +34 -32
- package/package.json +17 -19
package/CHANGELOG.md
CHANGED
|
@@ -1,261 +1,290 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
## 4.0.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#1276](https://github.com/ho-nl/m2-pwa/pull/1276)
|
|
8
|
+
[`ce09388e0`](https://github.com/ho-nl/m2-pwa/commit/ce09388e0d7ef33aee660612340f6fbae15ceec2)
|
|
9
|
+
Thanks [@paales](https://github.com/paales)! - We've moved lots of internal packages from
|
|
10
|
+
`dependencies` to `peerDependencies`. The result of this is that there will be significantly less
|
|
11
|
+
duplicate packages in the node_modules folders.
|
|
12
|
+
|
|
13
|
+
* [#1276](https://github.com/ho-nl/m2-pwa/pull/1276)
|
|
14
|
+
[`52a45bba4`](https://github.com/ho-nl/m2-pwa/commit/52a45bba4dc6dd6df3c81f5023df7d23ed8a534d)
|
|
15
|
+
Thanks [@paales](https://github.com/paales)! - Upgraded to
|
|
16
|
+
[NextJS 12.1](https://nextjs.org/blog/next-12-1)! This is just for compatibility, but we'll be
|
|
17
|
+
implementing
|
|
18
|
+
[On-demand Incremental Static Regeneration](https://nextjs.org/blog/next-12-1#on-demand-incremental-static-regeneration-beta)
|
|
19
|
+
soon.
|
|
20
|
+
|
|
21
|
+
This will greatly reduce the requirement to rebuid stuff and we'll add a management UI on the
|
|
22
|
+
frontend to be able to revalidate pages manually.
|
|
23
|
+
|
|
24
|
+
* Updated dependencies
|
|
25
|
+
[[`381e4c86a`](https://github.com/ho-nl/m2-pwa/commit/381e4c86a8321ce96e1fa5c7d3c0a0c0ff3e02c7),
|
|
26
|
+
[`ce09388e0`](https://github.com/ho-nl/m2-pwa/commit/ce09388e0d7ef33aee660612340f6fbae15ceec2),
|
|
27
|
+
[`e7c8e2756`](https://github.com/ho-nl/m2-pwa/commit/e7c8e2756d637cbcd2e793d62ef5721d35d9fa7b),
|
|
28
|
+
[`52a45bba4`](https://github.com/ho-nl/m2-pwa/commit/52a45bba4dc6dd6df3c81f5023df7d23ed8a534d)]:
|
|
29
|
+
- @graphcommerce/next-ui@4.1.1
|
|
30
|
+
- @graphcommerce/react-hook-form@3.0.2
|
|
31
|
+
- @graphcommerce/graphql@3.0.2
|
|
32
|
+
- @graphcommerce/image@3.0.2
|
|
33
|
+
|
|
34
|
+
## 4.0.1
|
|
35
|
+
|
|
36
|
+
### Patch Changes
|
|
37
|
+
|
|
38
|
+
- [`0cbaa878b`](https://github.com/ho-nl/m2-pwa/commit/0cbaa878b8a844d5abbeb1797b625a33130e6514)
|
|
39
|
+
Thanks [@paales](https://github.com/paales)! - Added homepage and repository package.json files,
|
|
40
|
+
so that the packages link to back to the website and repository
|
|
41
|
+
- Updated dependencies
|
|
42
|
+
[[`0cbaa878b`](https://github.com/ho-nl/m2-pwa/commit/0cbaa878b8a844d5abbeb1797b625a33130e6514)]:
|
|
43
|
+
- @graphcommerce/graphql@3.0.1
|
|
44
|
+
- @graphcommerce/image@3.0.1
|
|
45
|
+
- @graphcommerce/next-ui@4.0.1
|
|
46
|
+
- @graphcommerce/react-hook-form@3.0.1
|
|
47
|
+
|
|
48
|
+
## 4.0.0
|
|
49
|
+
|
|
50
|
+
### Major Changes
|
|
51
|
+
|
|
52
|
+
- [#1258](https://github.com/ho-nl/m2-pwa/pull/1258)
|
|
53
|
+
[`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)
|
|
54
|
+
Thanks [@paales](https://github.com/paales)! - Upgraded to Material UI 5
|
|
55
|
+
|
|
56
|
+
### Patch Changes
|
|
57
|
+
|
|
58
|
+
- Updated dependencies
|
|
59
|
+
[[`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)]:
|
|
60
|
+
- @graphcommerce/graphql@3.0.0
|
|
61
|
+
- @graphcommerce/image@3.0.0
|
|
62
|
+
- @graphcommerce/next-ui@4.0.0
|
|
63
|
+
- @graphcommerce/react-hook-form@3.0.0
|
|
5
64
|
|
|
6
|
-
|
|
65
|
+
All notable changes to this project will be documented in this file. See
|
|
66
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
7
67
|
|
|
68
|
+
## [3.5.40](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.5.39...@graphcommerce/magento-search@3.5.40) (2022-01-20)
|
|
8
69
|
|
|
9
70
|
### Bug Fixes
|
|
10
71
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
72
|
+
- search result label translation
|
|
73
|
+
([7e14ff5](https://github.com/ho-nl/m2-pwa/commit/7e14ff5548d86bc6b4f7afd51c259c0b833878f7))
|
|
16
74
|
|
|
17
75
|
## [3.5.39](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.5.38...@graphcommerce/magento-search@3.5.39) (2022-01-20)
|
|
18
76
|
|
|
19
|
-
|
|
20
77
|
### Bug Fixes
|
|
21
78
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
79
|
+
- search result label
|
|
80
|
+
([a55fdc0](https://github.com/ho-nl/m2-pwa/commit/a55fdc07e3aeb57d3b3a2cb0378ecb227ebf23a2))
|
|
27
81
|
|
|
28
82
|
## [3.5.8](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.5.7...@graphcommerce/magento-search@3.5.8) (2021-12-03)
|
|
29
83
|
|
|
30
|
-
|
|
31
84
|
### Bug Fixes
|
|
32
85
|
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
86
|
+
- search page
|
|
87
|
+
([85cf721](https://github.com/ho-nl/m2-pwa/commit/85cf72130bce4c3d2c392a3745adf05bca8618b1))
|
|
38
88
|
|
|
39
89
|
## [3.5.5](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.5.4...@graphcommerce/magento-search@3.5.5) (2021-12-01)
|
|
40
90
|
|
|
41
|
-
|
|
42
91
|
### Bug Fixes
|
|
43
92
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
93
|
+
- ios zoom bug when using search. Fontsize should always be > 16
|
|
94
|
+
([22abcd4](https://github.com/ho-nl/m2-pwa/commit/22abcd499b152448b3c38f84325debe07d2b9a68))
|
|
49
95
|
|
|
50
96
|
## [3.5.4](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.5.3...@graphcommerce/magento-search@3.5.4) (2021-11-27)
|
|
51
97
|
|
|
52
|
-
|
|
53
98
|
### Bug Fixes
|
|
54
99
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
100
|
+
- replace shadow with border
|
|
101
|
+
([56b2078](https://github.com/ho-nl/m2-pwa/commit/56b20786920c5c73faf35c8fbde425c01a88f411))
|
|
60
102
|
|
|
61
103
|
# [3.5.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.4.20...@graphcommerce/magento-search@3.5.0) (2021-11-12)
|
|
62
104
|
|
|
63
|
-
|
|
64
105
|
### Features
|
|
65
106
|
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
107
|
+
- added tons of translations
|
|
108
|
+
([9bb0ac7](https://github.com/ho-nl/m2-pwa/commit/9bb0ac709b58df6ea6141e92e4923a5ca9ae2963))
|
|
71
109
|
|
|
72
110
|
## [3.4.20](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.4.19...@graphcommerce/magento-search@3.4.20) (2021-11-12)
|
|
73
111
|
|
|
74
|
-
|
|
75
112
|
### Bug Fixes
|
|
76
113
|
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
114
|
+
- searchButton styling
|
|
115
|
+
([846e0cd](https://github.com/ho-nl/m2-pwa/commit/846e0cdb76eec7c5baf5fbfc4c501f99ebe59bf5))
|
|
82
116
|
|
|
83
117
|
## [3.4.19](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.4.18...@graphcommerce/magento-search@3.4.19) (2021-11-12)
|
|
84
118
|
|
|
85
|
-
|
|
86
119
|
### Bug Fixes
|
|
87
120
|
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
121
|
+
- **search-button:** spacings
|
|
122
|
+
([ccb7274](https://github.com/ho-nl/m2-pwa/commit/ccb727444a57941e22f14dff15ce20101cbc160c))
|
|
93
123
|
|
|
94
124
|
## [3.4.16](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.4.15...@graphcommerce/magento-search@3.4.16) (2021-11-09)
|
|
95
125
|
|
|
96
|
-
|
|
97
126
|
### Bug Fixes
|
|
98
127
|
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
128
|
+
- restyle menu to h4
|
|
129
|
+
([642e166](https://github.com/ho-nl/m2-pwa/commit/642e16635dc06f38bed91ffd1a374922ac70439b))
|
|
130
|
+
- **search-button:** add label for accessibility score
|
|
131
|
+
([1871e5b](https://github.com/ho-nl/m2-pwa/commit/1871e5b0b264ae4c98ebf3af1d074bb23d4dbbd8))
|
|
105
132
|
|
|
106
133
|
## [3.4.7](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.4.6...@graphcommerce/magento-search@3.4.7) (2021-11-03)
|
|
107
134
|
|
|
108
|
-
|
|
109
135
|
### Bug Fixes
|
|
110
136
|
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
137
|
+
- various accessibility improvements
|
|
138
|
+
([47481a9](https://github.com/ho-nl/m2-pwa/commit/47481a9a882ba87968de6dd797557b0b275d75fb))
|
|
116
139
|
|
|
117
140
|
# [3.4.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.3.5...@graphcommerce/magento-search@3.4.0) (2021-11-02)
|
|
118
141
|
|
|
119
|
-
|
|
120
142
|
### Bug Fixes
|
|
121
143
|
|
|
122
|
-
|
|
123
|
-
|
|
144
|
+
- darkMode
|
|
145
|
+
([c7573de](https://github.com/ho-nl/m2-pwa/commit/c7573de6bb80643b26931c35ac61735539e7fbf0))
|
|
124
146
|
|
|
125
147
|
### Features
|
|
126
148
|
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
149
|
+
- darkTheme
|
|
150
|
+
([968f4f1](https://github.com/ho-nl/m2-pwa/commit/968f4f1360417bf7daa36454c19e6bc5cf53ae90))
|
|
132
151
|
|
|
133
152
|
## [3.3.1](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.3.0...@graphcommerce/magento-search@3.3.1) (2021-10-28)
|
|
134
153
|
|
|
135
|
-
|
|
136
154
|
### Bug Fixes
|
|
137
155
|
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
156
|
+
- External SVG's can't have alt tags
|
|
157
|
+
([1b1414a](https://github.com/ho-nl/m2-pwa/commit/1b1414a782d55d3acf7b0e6bcaa50f2ad5f18f39))
|
|
143
158
|
|
|
144
159
|
# [3.3.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.2.2...@graphcommerce/magento-search@3.3.0) (2021-10-28)
|
|
145
160
|
|
|
146
|
-
|
|
147
161
|
### Bug Fixes
|
|
148
162
|
|
|
149
|
-
|
|
150
|
-
|
|
163
|
+
- update SvgImage to SvgImageSimple
|
|
164
|
+
([f116543](https://github.com/ho-nl/m2-pwa/commit/f116543730853fa9782abff0ccacee7032e85789))
|
|
151
165
|
|
|
152
166
|
### Features
|
|
153
167
|
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
168
|
+
- dynamic icons, update SvgImage uses to SvgImageSimple
|
|
169
|
+
([3d3cc0e](https://github.com/ho-nl/m2-pwa/commit/3d3cc0e0336fcde1cce6ba19705f82c1edf9bfc6))
|
|
170
|
+
- mobile menu styling
|
|
171
|
+
([3cc3085](https://github.com/ho-nl/m2-pwa/commit/3cc308585d4ded68d2ac8ebf97f96288424ee914))
|
|
160
172
|
|
|
161
173
|
# [3.2.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.1.12...@graphcommerce/magento-search@3.2.0) (2021-10-27)
|
|
162
174
|
|
|
163
|
-
|
|
164
175
|
### Features
|
|
165
176
|
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
177
|
+
- **nextjs:** upgraded to nextjs 12
|
|
178
|
+
([9331bc8](https://github.com/ho-nl/m2-pwa/commit/9331bc801f6419522115cc47d291d49d608d5a90))
|
|
171
179
|
|
|
172
180
|
# [3.1.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.0.18...@graphcommerce/magento-search@3.1.0) (2021-10-13)
|
|
173
181
|
|
|
174
|
-
|
|
175
182
|
### Features
|
|
176
183
|
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
+
- allow adding placeholder to SearchButton
|
|
185
|
+
([95f601a](https://github.com/ho-nl/m2-pwa/commit/95f601ac526991130ba319142452950793661f7b))
|
|
186
|
+
- allow changing SearchButton icon
|
|
187
|
+
([9725ab1](https://github.com/ho-nl/m2-pwa/commit/9725ab14920f585c83457f11908d7e5e408cadb8))
|
|
188
|
+
- implement extensibility for DesktopNavBar, SearchButton
|
|
189
|
+
([5710de8](https://github.com/ho-nl/m2-pwa/commit/5710de8936f59c7d0fcc648978183f0e7fdd26b7))
|
|
184
190
|
|
|
185
191
|
## [3.0.1](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-search@3.0.0...@graphcommerce/magento-search@3.0.1) (2021-09-27)
|
|
186
192
|
|
|
187
193
|
**Note:** Version bump only for package @graphcommerce/magento-search
|
|
188
194
|
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
195
|
# 3.0.0 (2021-09-27)
|
|
194
196
|
|
|
195
|
-
|
|
196
197
|
### Bug Fixes
|
|
197
198
|
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
199
|
+
- **404-page:** prevent auto focus search form
|
|
200
|
+
([9e89ed3](https://github.com/ho-nl/m2-pwa/commit/9e89ed31ea192312641f46f01b69dc5f319331e8))
|
|
201
|
+
- add dependencies for searchbutton
|
|
202
|
+
([c8f9608](https://github.com/ho-nl/m2-pwa/commit/c8f960828daa77675c4f359e971690b227563445))
|
|
203
|
+
- **app-shell:** pages after app shell changes
|
|
204
|
+
([fb74510](https://github.com/ho-nl/m2-pwa/commit/fb74510121f6124009db72ad2ddebf6459c52a85))
|
|
205
|
+
- caption styles bugs
|
|
206
|
+
([f223918](https://github.com/ho-nl/m2-pwa/commit/f223918cc557a996b5f321fbf6910b4981646dcb))
|
|
207
|
+
- empty grid rows still have a gap
|
|
208
|
+
([7ba50c7](https://github.com/ho-nl/m2-pwa/commit/7ba50c740aa7ac5133b933b3e6a22fab853b55a6))
|
|
209
|
+
- ignore md files from triggering version updates
|
|
210
|
+
([4f98392](https://github.com/ho-nl/m2-pwa/commit/4f9839250b3a32d3070da5290e5efcc5e2243fba))
|
|
211
|
+
- **image:** make sure unoptimized images are preloaded correctly and remove preloads from lots of
|
|
212
|
+
images
|
|
213
|
+
([fb2b4fc](https://github.com/ho-nl/m2-pwa/commit/fb2b4fcb5336ff880a9b32775847d7b6738ba1ea))
|
|
214
|
+
- implement next-ui barrel imports
|
|
215
|
+
([75bea70](https://github.com/ho-nl/m2-pwa/commit/75bea703dba898f18a2a1dfa3243ebd0a4e6f0e1))
|
|
216
|
+
- make fab-menu more configurable
|
|
217
|
+
([f73d7ec](https://github.com/ho-nl/m2-pwa/commit/f73d7ecccfba7d5cd9eecdcdd65abb5393a9e7a9))
|
|
218
|
+
- no search results message
|
|
219
|
+
([2ecd6e3](https://github.com/ho-nl/m2-pwa/commit/2ecd6e36481e546dc78acfb46dfff08dcfdd8e6a))
|
|
220
|
+
- pagination & janky search form
|
|
221
|
+
([b4fb982](https://github.com/ho-nl/m2-pwa/commit/b4fb982980c92f3819bb563582979dd66893a733))
|
|
222
|
+
- readonly search field
|
|
223
|
+
([5524847](https://github.com/ho-nl/m2-pwa/commit/552484706520c14b7b3d1708daf8cc64b91f3fe7))
|
|
224
|
+
- rename NextButton to Button, change imports
|
|
225
|
+
([976adb0](https://github.com/ho-nl/m2-pwa/commit/976adb0bf906310d1efce888dcc9be1e28ce0f1b))
|
|
226
|
+
- search button on click type
|
|
227
|
+
([33a6a08](https://github.com/ho-nl/m2-pwa/commit/33a6a0826acf795750503b39bd0d224baa795a47))
|
|
228
|
+
- search not submitting after empying the field
|
|
229
|
+
([a15b5cf](https://github.com/ho-nl/m2-pwa/commit/a15b5cf94f4619e0087c8871a98617ab160f671a))
|
|
230
|
+
- search page routes
|
|
231
|
+
([4161179](https://github.com/ho-nl/m2-pwa/commit/4161179aaf2ecbc0fde0efbba891a7b85524e283))
|
|
232
|
+
- search results text
|
|
233
|
+
([33a496c](https://github.com/ho-nl/m2-pwa/commit/33a496c07fe6b5b0b05f3287dc86f6a32ca34b3b))
|
|
234
|
+
- **search-page:** hide menu and cart fabs when opened virtual keyboard mobile
|
|
235
|
+
([e728768](https://github.com/ho-nl/m2-pwa/commit/e7287680545f33079d0af47df1c6ea519b208978))
|
|
236
|
+
- since all links are of next/link we need to add passHref for custom components
|
|
237
|
+
([16fb931](https://github.com/ho-nl/m2-pwa/commit/16fb93100d367203ea79bb4f93357221253f2ecd))
|
|
238
|
+
- yarn workspace packages hot reload
|
|
239
|
+
([d03fc9f](https://github.com/ho-nl/m2-pwa/commit/d03fc9fdda3486476761786f2b56a934cc92befc))
|
|
219
240
|
|
|
220
241
|
### Features
|
|
221
242
|
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
243
|
+
- Add customer service icon and define MuiIconButton size
|
|
244
|
+
([eefcc52](https://github.com/ho-nl/m2-pwa/commit/eefcc52eeffa03b364464709e1860135127cc4b5))
|
|
245
|
+
- **app-shell:** now consistent
|
|
246
|
+
([fb5b506](https://github.com/ho-nl/m2-pwa/commit/fb5b5062729002b508e888a4962f1b2578e5199b))
|
|
247
|
+
- created stacked-pages package
|
|
248
|
+
([d86008e](https://github.com/ho-nl/m2-pwa/commit/d86008ee659ccb25b194a41d624b394a1ddbd088))
|
|
249
|
+
- full page ui desktop variant
|
|
250
|
+
([a70f301](https://github.com/ho-nl/m2-pwa/commit/a70f3013da36fa131f82fb44457b107fb7705df6))
|
|
251
|
+
- **graphql:** introduced new graphql package that holds all generated files
|
|
252
|
+
([a3e7aa0](https://github.com/ho-nl/m2-pwa/commit/a3e7aa05540540533b5ced9a95f1f802ecbe499f))
|
|
253
|
+
- **image:** introduced completely rewritten Image component
|
|
254
|
+
([e3413b3](https://github.com/ho-nl/m2-pwa/commit/e3413b3a57392d6571ea64cb8d9c8dca05ea31df))
|
|
255
|
+
- minimal page shell
|
|
256
|
+
([1693674](https://github.com/ho-nl/m2-pwa/commit/1693674631fc8438c60d9b74b73e607e08971a2d))
|
|
257
|
+
- next.js 11
|
|
258
|
+
([7d61407](https://github.com/ho-nl/m2-pwa/commit/7d614075a778f488045034f74be4f75b93f63c43))
|
|
259
|
+
- **playwright:** added new playwright package to enable browser testing
|
|
260
|
+
([6f49ec7](https://github.com/ho-nl/m2-pwa/commit/6f49ec7595563775b96ebf21c27e39da1282e8d9))
|
|
261
|
+
- renamed all packages to use [@graphcommerce](https://github.com/graphcommerce) instead of
|
|
262
|
+
[@reachdigital](https://github.com/reachdigital)
|
|
263
|
+
([491e4ce](https://github.com/ho-nl/m2-pwa/commit/491e4cec9a2686472dac36b79f999257c0811ffe))
|
|
264
|
+
- search page
|
|
265
|
+
([c89291b](https://github.com/ho-nl/m2-pwa/commit/c89291b7a65c93cbdb5f131f061f7232fdce3b99))
|
|
266
|
+
- svgimage component
|
|
267
|
+
([f369605](https://github.com/ho-nl/m2-pwa/commit/f3696051e381a24c543fd24e199da5b17f9e124f))
|
|
268
|
+
- upgrade to node 14
|
|
269
|
+
([d079a75](https://github.com/ho-nl/m2-pwa/commit/d079a751e9bfd8dc7f5009d2c9f31c336a0c96ab))
|
|
270
|
+
- upgraded to nextjs 11
|
|
271
|
+
([0053beb](https://github.com/ho-nl/m2-pwa/commit/0053beb7ef597c190add7264256a0eaec35868da))
|
|
238
272
|
|
|
239
273
|
## 2.0.8 (2020-10-28)
|
|
240
274
|
|
|
241
|
-
|
|
242
275
|
### Bug Fixes
|
|
243
276
|
|
|
244
|
-
|
|
245
|
-
|
|
277
|
+
- make sure themes extensions are found
|
|
278
|
+
([5aa18db](https://github.com/ho-nl/m2-pwa/commit/5aa18db514fd2e2f50681367e39523f8e742ece0))
|
|
246
279
|
|
|
247
280
|
### Features
|
|
248
281
|
|
|
249
|
-
|
|
250
|
-
|
|
282
|
+
- split into packages
|
|
283
|
+
([2ee7fd6](https://github.com/ho-nl/m2-pwa/commit/2ee7fd6c0056f467d114f04d92c6c0ddf622d151))
|
|
251
284
|
|
|
252
285
|
### BREAKING CHANGES
|
|
253
286
|
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
287
|
+
- huge folder structure refactor, please read README to reinstall
|
|
259
288
|
|
|
260
289
|
# Change Log
|
|
261
290
|
|
|
@@ -1,60 +1,50 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
Highlight,
|
|
4
|
-
iconChevronRight,
|
|
5
|
-
SvgImageSimple,
|
|
6
|
-
UseStyles,
|
|
7
|
-
} from '@graphcommerce/next-ui'
|
|
8
|
-
import { makeStyles, Theme } from '@material-ui/core'
|
|
1
|
+
import { Highlight, iconChevronRight, SvgIcon, extendableComponent } from '@graphcommerce/next-ui'
|
|
2
|
+
import { Button, SxProps, Theme } from '@mui/material'
|
|
9
3
|
import PageLink from 'next/link'
|
|
10
4
|
import React from 'react'
|
|
11
5
|
import { CategorySearchResultFragment } from './CategorySearchResult.gql'
|
|
12
6
|
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
padding: `${theme.spacings.xs} 18px ${theme.spacings.xs} 14px`,
|
|
18
|
-
display: 'flex',
|
|
19
|
-
justifyContent: 'space-between',
|
|
20
|
-
minWidth: '100%',
|
|
21
|
-
maxWidth: 'unset',
|
|
22
|
-
borderRadius: '0',
|
|
23
|
-
'&:not(&:last-child)': {
|
|
24
|
-
borderBottom: `1px solid ${theme.palette.divider}`,
|
|
25
|
-
},
|
|
26
|
-
'&:focus': {
|
|
27
|
-
boxShadow: 'none',
|
|
28
|
-
},
|
|
29
|
-
'&:hover': {
|
|
30
|
-
background: theme.palette.background.paper,
|
|
31
|
-
},
|
|
32
|
-
},
|
|
33
|
-
totalProducts: {
|
|
34
|
-
minWidth: 'max-content',
|
|
35
|
-
paddingRight: 7,
|
|
36
|
-
},
|
|
37
|
-
}),
|
|
38
|
-
{
|
|
39
|
-
name: 'CategorySearchResult',
|
|
40
|
-
},
|
|
41
|
-
)
|
|
7
|
+
export type CategorySearchResultProps = Omit<CategorySearchResultFragment, 'uid'> & {
|
|
8
|
+
search?: string
|
|
9
|
+
sx?: SxProps<Theme>
|
|
10
|
+
}
|
|
42
11
|
|
|
43
|
-
|
|
44
|
-
|
|
12
|
+
const name = 'CategorySearchResult' as const
|
|
13
|
+
const parts = ['root'] as const
|
|
14
|
+
const { classes } = extendableComponent(name, parts)
|
|
45
15
|
|
|
46
16
|
export default function CategorySearchResult(props: CategorySearchResultProps) {
|
|
47
|
-
const { search = '', ...catProps } = props
|
|
48
|
-
const classes = useStyles(props)
|
|
17
|
+
const { search = '', sx = [], ...catProps } = props
|
|
49
18
|
|
|
50
19
|
return (
|
|
51
20
|
<PageLink href={`/${catProps?.url_path ?? ''}`}>
|
|
52
21
|
<Button
|
|
53
22
|
fullWidth
|
|
54
23
|
variant='contained'
|
|
55
|
-
className={classes.
|
|
24
|
+
className={classes.root}
|
|
56
25
|
disableElevation
|
|
57
|
-
endIcon={<
|
|
26
|
+
endIcon={<SvgIcon src={iconChevronRight} size='small' />}
|
|
27
|
+
sx={[
|
|
28
|
+
(theme) => ({
|
|
29
|
+
background: theme.palette.background.default,
|
|
30
|
+
padding: `${theme.spacings.xs} 18px ${theme.spacings.xs} 14px`,
|
|
31
|
+
display: 'flex',
|
|
32
|
+
justifyContent: 'space-between',
|
|
33
|
+
minWidth: '100%',
|
|
34
|
+
maxWidth: 'unset',
|
|
35
|
+
borderRadius: '0',
|
|
36
|
+
'&:not(&:last-of-type)': {
|
|
37
|
+
borderBottom: `1px solid ${theme.palette.divider}`,
|
|
38
|
+
},
|
|
39
|
+
'&:focus': {
|
|
40
|
+
boxShadow: 'none',
|
|
41
|
+
},
|
|
42
|
+
'&:hover': {
|
|
43
|
+
background: theme.palette.background.paper,
|
|
44
|
+
},
|
|
45
|
+
}),
|
|
46
|
+
...(Array.isArray(sx) ? sx : [sx]),
|
|
47
|
+
]}
|
|
58
48
|
>
|
|
59
49
|
<div>
|
|
60
50
|
{catProps?.breadcrumbs?.map((breadcrumb) => (
|
|
@@ -1,32 +1,36 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
1
|
+
import { extendableComponent } from '@graphcommerce/next-ui'
|
|
2
|
+
import { Trans } from '@lingui/macro'
|
|
3
|
+
import { Box, SxProps, Theme, Typography } from '@mui/material'
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
(theme: Theme) => ({
|
|
7
|
-
container: {
|
|
8
|
-
marginTop: theme.spacings.md,
|
|
9
|
-
marginBottom: theme.spacings.sm,
|
|
10
|
-
textAlign: 'center',
|
|
11
|
-
},
|
|
12
|
-
}),
|
|
13
|
-
{
|
|
14
|
-
name: 'NoSearchResults',
|
|
15
|
-
},
|
|
16
|
-
)
|
|
5
|
+
export type NoSearchResultsProps = { search: string; sx?: SxProps<Theme> }
|
|
17
6
|
|
|
18
|
-
|
|
7
|
+
const name = 'NoSearchResults' as const
|
|
8
|
+
const parts = ['root'] as const
|
|
9
|
+
const { classes } = extendableComponent(name, parts)
|
|
19
10
|
|
|
20
11
|
export default function NoSearchResults(props: NoSearchResultsProps) {
|
|
21
|
-
const { search } = props
|
|
22
|
-
|
|
12
|
+
const { search, sx = [] } = props
|
|
13
|
+
|
|
14
|
+
const term = `'${search}'`
|
|
23
15
|
|
|
24
16
|
return (
|
|
25
|
-
<
|
|
17
|
+
<Box
|
|
18
|
+
className={classes.root}
|
|
19
|
+
sx={[
|
|
20
|
+
(theme) => ({
|
|
21
|
+
marginTop: theme.spacings.md,
|
|
22
|
+
marginBottom: theme.spacings.sm,
|
|
23
|
+
textAlign: 'center',
|
|
24
|
+
}),
|
|
25
|
+
...(Array.isArray(sx) ? sx : [sx]),
|
|
26
|
+
]}
|
|
27
|
+
>
|
|
26
28
|
<Typography variant='h5' align='center'>
|
|
27
|
-
We couldn't find any results for {
|
|
29
|
+
<Trans>We couldn't find any results for {term}</Trans>
|
|
28
30
|
</Typography>
|
|
29
|
-
<p>
|
|
30
|
-
|
|
31
|
+
<p>
|
|
32
|
+
<Trans>Try a different search</Trans>
|
|
33
|
+
</p>
|
|
34
|
+
</Box>
|
|
31
35
|
)
|
|
32
36
|
}
|
package/SearchButton/index.tsx
CHANGED
|
@@ -1,51 +1,51 @@
|
|
|
1
|
-
import { iconSearch, responsiveVal,
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
4
|
-
import React from 'react'
|
|
1
|
+
import { iconSearch, responsiveVal, SvgIcon, extendableComponent } from '@graphcommerce/next-ui'
|
|
2
|
+
import { Trans } from '@lingui/macro'
|
|
3
|
+
import { TextField, TextFieldProps } from '@mui/material'
|
|
5
4
|
|
|
6
|
-
|
|
7
|
-
(theme: Theme) => ({
|
|
8
|
-
root: {
|
|
9
|
-
marginRight: theme.spacings.xxs,
|
|
10
|
-
width: responsiveVal(64, 172),
|
|
11
|
-
'& fieldset': {
|
|
12
|
-
border: `1px solid ${theme.palette.divider}`,
|
|
13
|
-
},
|
|
14
|
-
[theme.breakpoints.down('sm')]: {
|
|
15
|
-
width: '100%',
|
|
16
|
-
marginRight: 0,
|
|
17
|
-
},
|
|
18
|
-
},
|
|
19
|
-
inputRoot: {},
|
|
20
|
-
fullWidth: {
|
|
21
|
-
width: '100%',
|
|
22
|
-
marginRight: 0,
|
|
23
|
-
},
|
|
24
|
-
}),
|
|
25
|
-
{ name: 'SearchButton' },
|
|
26
|
-
)
|
|
5
|
+
export type SearchButtonProps = TextFieldProps
|
|
27
6
|
|
|
28
|
-
|
|
7
|
+
type OwnerState = { fullWidth?: boolean }
|
|
8
|
+
const name = 'SearchButton' as const
|
|
9
|
+
const parts = ['root', 'inputRoot'] as const
|
|
10
|
+
const { withState } = extendableComponent<OwnerState, typeof name, typeof parts>(name, parts)
|
|
29
11
|
|
|
30
12
|
export default function SearchButton(props: SearchButtonProps) {
|
|
31
|
-
const { InputProps, label =
|
|
32
|
-
const classes =
|
|
13
|
+
const { InputProps, label, fullWidth = false, sx = [], ...textFieldProps } = props
|
|
14
|
+
const classes = withState({ fullWidth })
|
|
33
15
|
|
|
34
16
|
return (
|
|
35
17
|
<TextField
|
|
36
18
|
variant='outlined'
|
|
37
19
|
size='small'
|
|
38
|
-
className={
|
|
39
|
-
label={label}
|
|
20
|
+
className={classes.root}
|
|
21
|
+
label={label ?? <Trans>Search...</Trans>}
|
|
40
22
|
id='search-input'
|
|
41
23
|
InputLabelProps={{ shrink: false }}
|
|
42
24
|
InputProps={{
|
|
43
25
|
readOnly: true,
|
|
44
|
-
endAdornment: <
|
|
26
|
+
endAdornment: <SvgIcon src={iconSearch} size='medium' />,
|
|
45
27
|
classes: { root: classes.inputRoot },
|
|
46
28
|
...InputProps,
|
|
47
29
|
}}
|
|
48
30
|
{...textFieldProps}
|
|
31
|
+
sx={[
|
|
32
|
+
(theme) => ({
|
|
33
|
+
marginRight: theme.spacings.xxs,
|
|
34
|
+
width: responsiveVal(64, 172),
|
|
35
|
+
'& fieldset': {
|
|
36
|
+
border: `1px solid ${theme.palette.divider}`,
|
|
37
|
+
},
|
|
38
|
+
[theme.breakpoints.down('md')]: {
|
|
39
|
+
width: '100%',
|
|
40
|
+
marginRight: 0,
|
|
41
|
+
},
|
|
42
|
+
'&.fullWidth': {
|
|
43
|
+
width: '100%',
|
|
44
|
+
marginRight: 0,
|
|
45
|
+
},
|
|
46
|
+
}),
|
|
47
|
+
...(Array.isArray(sx) ? sx : [sx]),
|
|
48
|
+
]}
|
|
49
49
|
/>
|
|
50
50
|
)
|
|
51
51
|
}
|
package/SearchDivider/index.tsx
CHANGED
|
@@ -1,13 +1,10 @@
|
|
|
1
|
-
import { styled } from '@material
|
|
1
|
+
import { styled } from '@mui/material'
|
|
2
2
|
|
|
3
|
-
const SearchDivider = styled('div')(
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
}),
|
|
10
|
-
{ name: 'FormDivider' },
|
|
11
|
-
)
|
|
3
|
+
const SearchDivider = styled('div', { name: 'SearchDivider' })(({ theme }) => ({
|
|
4
|
+
borderBottom: `1px solid ${theme.palette.divider}`,
|
|
5
|
+
width: '100%',
|
|
6
|
+
marginTop: theme.spacings.md,
|
|
7
|
+
marginBottom: theme.spacings.md,
|
|
8
|
+
}))
|
|
12
9
|
|
|
13
10
|
export default SearchDivider
|
package/SearchForm/index.tsx
CHANGED
|
@@ -1,22 +1,14 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
FormRow,
|
|
3
|
+
iconClose,
|
|
4
|
+
iconSearch,
|
|
5
|
+
SvgIcon,
|
|
6
|
+
extendableComponent,
|
|
7
|
+
} from '@graphcommerce/next-ui'
|
|
2
8
|
import { useForm, useFormAutoSubmit, useFormMuiRegister } from '@graphcommerce/react-hook-form'
|
|
3
|
-
import { t,
|
|
4
|
-
import { IconButton,
|
|
9
|
+
import { t, Trans } from '@lingui/macro'
|
|
10
|
+
import { Box, IconButton, SxProps, TextField, TextFieldProps, Theme } from '@mui/material'
|
|
5
11
|
import { useRouter } from 'next/router'
|
|
6
|
-
import React from 'react'
|
|
7
|
-
|
|
8
|
-
const useStyles = makeStyles(
|
|
9
|
-
(theme: Theme) => ({
|
|
10
|
-
totalProducts: {
|
|
11
|
-
minWidth: 'max-content',
|
|
12
|
-
color: theme.palette.grey[500],
|
|
13
|
-
paddingRight: 7,
|
|
14
|
-
},
|
|
15
|
-
}),
|
|
16
|
-
{
|
|
17
|
-
name: 'SearchIndexPage',
|
|
18
|
-
},
|
|
19
|
-
)
|
|
20
12
|
|
|
21
13
|
export type SearchFormProps = {
|
|
22
14
|
totalResults?: number
|
|
@@ -24,11 +16,15 @@ export type SearchFormProps = {
|
|
|
24
16
|
urlHandle?: string
|
|
25
17
|
autoFocus?: boolean
|
|
26
18
|
textFieldProps?: TextFieldProps
|
|
27
|
-
|
|
19
|
+
sx?: SxProps<Theme>
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
const name = 'SearchForm' as const
|
|
23
|
+
const parts = ['root', 'totalProducts'] as const
|
|
24
|
+
const { classes } = extendableComponent(name, parts)
|
|
28
25
|
|
|
29
26
|
export default function SearchForm(props: SearchFormProps) {
|
|
30
|
-
const { totalResults = 0, search = '', urlHandle = 'search', textFieldProps } = props
|
|
31
|
-
const classes = useStyles(props)
|
|
27
|
+
const { totalResults = 0, search = '', urlHandle = 'search', textFieldProps, sx = [] } = props
|
|
32
28
|
const router = useRouter()
|
|
33
29
|
|
|
34
30
|
const form = useForm({ mode: 'onChange', defaultValues: { search } })
|
|
@@ -51,28 +47,33 @@ export default function SearchForm(props: SearchFormProps) {
|
|
|
51
47
|
|
|
52
48
|
const endAdornment = !watch('search') ? (
|
|
53
49
|
<IconButton size='small'>
|
|
54
|
-
<
|
|
50
|
+
<SvgIcon src={iconSearch} />
|
|
55
51
|
</IconButton>
|
|
56
52
|
) : (
|
|
57
53
|
<>
|
|
58
54
|
{totalResults > 0 && (
|
|
59
|
-
<
|
|
60
|
-
{
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
)}
|
|
66
|
-
|
|
55
|
+
<Box
|
|
56
|
+
className={classes.totalProducts}
|
|
57
|
+
sx={(theme) => ({
|
|
58
|
+
minWidth: 'max-content',
|
|
59
|
+
color: theme.palette.text.disabled,
|
|
60
|
+
paddingRight: '7px',
|
|
61
|
+
})}
|
|
62
|
+
>
|
|
63
|
+
{totalResults === 1 && <Trans>{totalResults} result</Trans>}
|
|
64
|
+
{totalResults > 1 && <Trans>{totalResults} results</Trans>}
|
|
65
|
+
</Box>
|
|
67
66
|
)}
|
|
68
67
|
<IconButton onClick={handleReset} size='small'>
|
|
69
|
-
<
|
|
68
|
+
<SvgIcon src={iconClose} />
|
|
70
69
|
</IconButton>
|
|
71
70
|
</>
|
|
72
71
|
)
|
|
73
72
|
|
|
74
73
|
return (
|
|
75
|
-
<
|
|
74
|
+
<Box
|
|
75
|
+
className={classes.root}
|
|
76
|
+
component='form'
|
|
76
77
|
noValidate
|
|
77
78
|
onSubmit={submit}
|
|
78
79
|
onChange={() => {
|
|
@@ -81,6 +82,7 @@ export default function SearchForm(props: SearchFormProps) {
|
|
|
81
82
|
router.replace(`/search`)
|
|
82
83
|
}
|
|
83
84
|
}}
|
|
85
|
+
sx={sx}
|
|
84
86
|
>
|
|
85
87
|
<FormRow>
|
|
86
88
|
<TextField
|
|
@@ -95,6 +97,6 @@ export default function SearchForm(props: SearchFormProps) {
|
|
|
95
97
|
{...textFieldProps}
|
|
96
98
|
/>
|
|
97
99
|
</FormRow>
|
|
98
|
-
</
|
|
100
|
+
</Box>
|
|
99
101
|
)
|
|
100
102
|
}
|
package/package.json
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@graphcommerce/magento-search",
|
|
3
|
-
"
|
|
3
|
+
"homepage": "https://www.graphcommerce.org/",
|
|
4
|
+
"repository": "github:graphcommerce-org/graphcommerce",
|
|
5
|
+
"version": "4.0.2",
|
|
4
6
|
"sideEffects": false,
|
|
5
7
|
"prettier": "@graphcommerce/prettier-config-pwa",
|
|
6
|
-
"browserslist": [
|
|
7
|
-
"extends @graphcommerce/browserslist-config-pwa"
|
|
8
|
-
],
|
|
9
8
|
"eslintConfig": {
|
|
10
9
|
"extends": "@graphcommerce/eslint-config-pwa",
|
|
11
10
|
"parserOptions": {
|
|
@@ -13,23 +12,22 @@
|
|
|
13
12
|
}
|
|
14
13
|
},
|
|
15
14
|
"devDependencies": {
|
|
16
|
-
"@graphcommerce/
|
|
17
|
-
"@graphcommerce/
|
|
18
|
-
"@graphcommerce/
|
|
19
|
-
"@
|
|
20
|
-
"@playwright/test": "^1.17.1"
|
|
15
|
+
"@graphcommerce/eslint-config-pwa": "^4.0.2",
|
|
16
|
+
"@graphcommerce/prettier-config-pwa": "^4.0.1",
|
|
17
|
+
"@graphcommerce/typescript-config-pwa": "^4.0.1",
|
|
18
|
+
"@playwright/test": "^1.19.1"
|
|
21
19
|
},
|
|
22
20
|
"dependencies": {
|
|
23
|
-
"@graphcommerce/graphql": "^
|
|
24
|
-
"@graphcommerce/image": "^
|
|
25
|
-
"@graphcommerce/next-ui": "^
|
|
26
|
-
"@graphcommerce/react-hook-form": "^
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
"
|
|
30
|
-
"
|
|
21
|
+
"@graphcommerce/graphql": "^3.0.2",
|
|
22
|
+
"@graphcommerce/image": "^3.0.2",
|
|
23
|
+
"@graphcommerce/next-ui": "^4.1.1",
|
|
24
|
+
"@graphcommerce/react-hook-form": "^3.0.2"
|
|
25
|
+
},
|
|
26
|
+
"peerDependencies": {
|
|
27
|
+
"@lingui/macro": "^3.13.2",
|
|
28
|
+
"@mui/material": "^5.4.1",
|
|
29
|
+
"next": "^12.0.10",
|
|
31
30
|
"react": "^17.0.2",
|
|
32
31
|
"react-dom": "^17.0.2"
|
|
33
|
-
}
|
|
34
|
-
"gitHead": "41e42c8cd6f565ab0cbba81a1954a0041dc46768"
|
|
32
|
+
}
|
|
35
33
|
}
|