@graphcommerce/graphcms-ui 3.0.3 → 3.0.6

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 (8) hide show
  1. package/CHANGELOG.md +80 -118
  2. package/components/Asset/{index.tsx → Asset.tsx} +10 -1
  3. package/components/RichText/RichText.tsx +87 -21
  4. package/components/RichText/defaultRenderers.tsx +4 -1
  5. package/components/RichText/defaultSxRenderer.ts +9 -5
  6. package/components/RichText/types.ts +13 -5
  7. package/index.ts +1 -1
  8. package/package.json +7 -7
package/CHANGELOG.md CHANGED
@@ -1,21 +1,44 @@
1
1
  # Change Log
2
2
 
3
+ ## 3.0.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [#1322](https://github.com/graphcommerce-org/graphcommerce/pull/1322) [`ae7385b94`](https://github.com/graphcommerce-org/graphcommerce/commit/ae7385b943e591fcd6fe9e5747f22e03a73e481a) Thanks [@paales](https://github.com/paales)! - RichText component’s first and last element should have no marginTop and marginBottom respectively unless withMargin is specified
8
+
9
+ - Updated dependencies [[`5266388ea`](https://github.com/graphcommerce-org/graphcommerce/commit/5266388eaffda41592623ef7a3ddbbe03c8e0dad), [`9b35403d9`](https://github.com/graphcommerce-org/graphcommerce/commit/9b35403d9dbb2606ac7cf3bb641a0f9cc3d8a2ba), [`0298a0de1`](https://github.com/graphcommerce-org/graphcommerce/commit/0298a0de1d13e543c4124a6a099297b4e27e2b05), [`815132ea4`](https://github.com/graphcommerce-org/graphcommerce/commit/815132ea43937b4b84b59ec9974ac593cb4eb456), [`3326742a0`](https://github.com/graphcommerce-org/graphcommerce/commit/3326742a0dceb45f0cac4741ca09dc4d4f09ad90), [`7a3799bfc`](https://github.com/graphcommerce-org/graphcommerce/commit/7a3799bfc107f26aa9991a91db5f228e3476f4aa), [`9a77f88ed`](https://github.com/graphcommerce-org/graphcommerce/commit/9a77f88ed26cbecdae9a135c3cb234a5b7ecf4df), [`0eeaad304`](https://github.com/graphcommerce-org/graphcommerce/commit/0eeaad30461b1d5b486438f0287fa76d49429044), [`bc5213547`](https://github.com/graphcommerce-org/graphcommerce/commit/bc52135471479c83d989449dad24798112e898f4), [`3f1912f55`](https://github.com/graphcommerce-org/graphcommerce/commit/3f1912f553318d5888f8af2b841918ef4ae96a84), [`b6c68cda8`](https://github.com/graphcommerce-org/graphcommerce/commit/b6c68cda8836a1d0c78ef351899cec9ec1037385)]:
10
+ - @graphcommerce/next-ui@4.3.0
11
+
12
+ ## 3.0.5
13
+
14
+ ### Patch Changes
15
+
16
+ - [#1307](https://github.com/ho-nl/m2-pwa/pull/1307) [`bd10506d3`](https://github.com/ho-nl/m2-pwa/commit/bd10506d32fdbc91d01dadc29a12ebd1e0943655) Thanks [@paales](https://github.com/paales)! - All default exports are now named exports internally and all `index.tsx` are renamed to the component name.
17
+
18
+ * [#1307](https://github.com/ho-nl/m2-pwa/pull/1307) [`27cb1f2d8`](https://github.com/ho-nl/m2-pwa/commit/27cb1f2d8dbfb8f1b301ce56fb6a2b6c1fc6a5ef) Thanks [@paales](https://github.com/paales)! - upgrade dependencies
19
+
20
+ * Updated dependencies [[`3d63b39f7`](https://github.com/ho-nl/m2-pwa/commit/3d63b39f7e330d1827a32dba782667d7b21adaba), [`bd10506d3`](https://github.com/ho-nl/m2-pwa/commit/bd10506d32fdbc91d01dadc29a12ebd1e0943655), [`27cb1f2d8`](https://github.com/ho-nl/m2-pwa/commit/27cb1f2d8dbfb8f1b301ce56fb6a2b6c1fc6a5ef)]:
21
+ - @graphcommerce/next-ui@4.2.4
22
+ - @graphcommerce/graphql@3.0.4
23
+ - @graphcommerce/image@3.1.1
24
+
25
+ ## 3.0.4
26
+
27
+ ### Patch Changes
28
+
29
+ - [#1285](https://github.com/ho-nl/m2-pwa/pull/1285) [`27368edbd`](https://github.com/ho-nl/m2-pwa/commit/27368edbdb0543658bf925cfa33b61de0e6dda38) Thanks [@paales](https://github.com/paales)! - Make sure svg icons from graphcms aren't actually processed by the next image optimization
30
+ - Updated dependencies [[`c85294ba6`](https://github.com/ho-nl/m2-pwa/commit/c85294ba6d742ce78c074559a1e95409b25a5017)]:
31
+ - @graphcommerce/next-ui@4.1.3
32
+
3
33
  ## 3.0.3
4
34
 
5
35
  ### Patch Changes
6
36
 
7
- - [`973ff8645`](https://github.com/ho-nl/m2-pwa/commit/973ff86452a70ade9f4db13fdda6e963d7220e96)
8
- Thanks [@paales](https://github.com/paales)! - made packages public
37
+ - [`973ff8645`](https://github.com/ho-nl/m2-pwa/commit/973ff86452a70ade9f4db13fdda6e963d7220e96) Thanks [@paales](https://github.com/paales)! - made packages public
9
38
 
10
- * [#1278](https://github.com/ho-nl/m2-pwa/pull/1278)
11
- [`81ea406d5`](https://github.com/ho-nl/m2-pwa/commit/81ea406d54d6b5c662c030a7fea444abc4117a20)
12
- Thanks [@ErwinOtten](https://github.com/ErwinOtten)! - Upgraded dependencies to the latest version
39
+ * [#1278](https://github.com/ho-nl/m2-pwa/pull/1278) [`81ea406d5`](https://github.com/ho-nl/m2-pwa/commit/81ea406d54d6b5c662c030a7fea444abc4117a20) Thanks [@ErwinOtten](https://github.com/ErwinOtten)! - Upgraded dependencies to the latest version
13
40
 
14
- * Updated dependencies
15
- [[`973ff8645`](https://github.com/ho-nl/m2-pwa/commit/973ff86452a70ade9f4db13fdda6e963d7220e96),
16
- [`81ea406d5`](https://github.com/ho-nl/m2-pwa/commit/81ea406d54d6b5c662c030a7fea444abc4117a20),
17
- [`3a719c88c`](https://github.com/ho-nl/m2-pwa/commit/3a719c88cad1eab58602de28c41adc0fc4827e1d),
18
- [`5ffcb56bf`](https://github.com/ho-nl/m2-pwa/commit/5ffcb56bfcbe49ebeaf24f9341e819a145ab9a14)]:
41
+ * Updated dependencies [[`973ff8645`](https://github.com/ho-nl/m2-pwa/commit/973ff86452a70ade9f4db13fdda6e963d7220e96), [`81ea406d5`](https://github.com/ho-nl/m2-pwa/commit/81ea406d54d6b5c662c030a7fea444abc4117a20), [`3a719c88c`](https://github.com/ho-nl/m2-pwa/commit/3a719c88cad1eab58602de28c41adc0fc4827e1d), [`5ffcb56bf`](https://github.com/ho-nl/m2-pwa/commit/5ffcb56bfcbe49ebeaf24f9341e819a145ab9a14)]:
19
42
  - @graphcommerce/graphql@3.0.3
20
43
  - @graphcommerce/image@3.1.0
21
44
  - @graphcommerce/next-ui@4.1.2
@@ -24,28 +47,13 @@
24
47
 
25
48
  ### Patch Changes
26
49
 
27
- - [#1276](https://github.com/ho-nl/m2-pwa/pull/1276)
28
- [`ce09388e0`](https://github.com/ho-nl/m2-pwa/commit/ce09388e0d7ef33aee660612340f6fbae15ceec2)
29
- Thanks [@paales](https://github.com/paales)! - We've moved lots of internal packages from
30
- `dependencies` to `peerDependencies`. The result of this is that there will be significantly less
31
- duplicate packages in the node_modules folders.
32
-
33
- * [#1276](https://github.com/ho-nl/m2-pwa/pull/1276)
34
- [`52a45bba4`](https://github.com/ho-nl/m2-pwa/commit/52a45bba4dc6dd6df3c81f5023df7d23ed8a534d)
35
- Thanks [@paales](https://github.com/paales)! - Upgraded to
36
- [NextJS 12.1](https://nextjs.org/blog/next-12-1)! This is just for compatibility, but we'll be
37
- implementing
38
- [On-demand Incremental Static Regeneration](https://nextjs.org/blog/next-12-1#on-demand-incremental-static-regeneration-beta)
39
- soon.
40
-
41
- This will greatly reduce the requirement to rebuid stuff and we'll add a management UI on the
42
- frontend to be able to revalidate pages manually.
43
-
44
- * Updated dependencies
45
- [[`381e4c86a`](https://github.com/ho-nl/m2-pwa/commit/381e4c86a8321ce96e1fa5c7d3c0a0c0ff3e02c7),
46
- [`ce09388e0`](https://github.com/ho-nl/m2-pwa/commit/ce09388e0d7ef33aee660612340f6fbae15ceec2),
47
- [`e7c8e2756`](https://github.com/ho-nl/m2-pwa/commit/e7c8e2756d637cbcd2e793d62ef5721d35d9fa7b),
48
- [`52a45bba4`](https://github.com/ho-nl/m2-pwa/commit/52a45bba4dc6dd6df3c81f5023df7d23ed8a534d)]:
50
+ - [#1276](https://github.com/ho-nl/m2-pwa/pull/1276) [`ce09388e0`](https://github.com/ho-nl/m2-pwa/commit/ce09388e0d7ef33aee660612340f6fbae15ceec2) Thanks [@paales](https://github.com/paales)! - We've moved lots of internal packages from `dependencies` to `peerDependencies`. The result of this is that there will be significantly less duplicate packages in the node_modules folders.
51
+
52
+ * [#1276](https://github.com/ho-nl/m2-pwa/pull/1276) [`52a45bba4`](https://github.com/ho-nl/m2-pwa/commit/52a45bba4dc6dd6df3c81f5023df7d23ed8a534d) Thanks [@paales](https://github.com/paales)! - Upgraded to [NextJS 12.1](https://nextjs.org/blog/next-12-1)! This is just for compatibility, but we'll be implementing [On-demand Incremental Static Regeneration](https://nextjs.org/blog/next-12-1#on-demand-incremental-static-regeneration-beta) soon.
53
+
54
+ This will greatly reduce the requirement to rebuid stuff and we'll add a management UI on the frontend to be able to revalidate pages manually.
55
+
56
+ * Updated dependencies [[`381e4c86a`](https://github.com/ho-nl/m2-pwa/commit/381e4c86a8321ce96e1fa5c7d3c0a0c0ff3e02c7), [`ce09388e0`](https://github.com/ho-nl/m2-pwa/commit/ce09388e0d7ef33aee660612340f6fbae15ceec2), [`e7c8e2756`](https://github.com/ho-nl/m2-pwa/commit/e7c8e2756d637cbcd2e793d62ef5721d35d9fa7b), [`52a45bba4`](https://github.com/ho-nl/m2-pwa/commit/52a45bba4dc6dd6df3c81f5023df7d23ed8a534d)]:
49
57
  - @graphcommerce/next-ui@4.1.1
50
58
  - @graphcommerce/graphql@3.0.2
51
59
  - @graphcommerce/image@3.0.2
@@ -54,11 +62,8 @@
54
62
 
55
63
  ### Patch Changes
56
64
 
57
- - [`0cbaa878b`](https://github.com/ho-nl/m2-pwa/commit/0cbaa878b8a844d5abbeb1797b625a33130e6514)
58
- Thanks [@paales](https://github.com/paales)! - Added homepage and repository package.json files,
59
- so that the packages link to back to the website and repository
60
- - Updated dependencies
61
- [[`0cbaa878b`](https://github.com/ho-nl/m2-pwa/commit/0cbaa878b8a844d5abbeb1797b625a33130e6514)]:
65
+ - [`0cbaa878b`](https://github.com/ho-nl/m2-pwa/commit/0cbaa878b8a844d5abbeb1797b625a33130e6514) Thanks [@paales](https://github.com/paales)! - Added homepage and repository package.json files, so that the packages link to back to the website and repository
66
+ - Updated dependencies [[`0cbaa878b`](https://github.com/ho-nl/m2-pwa/commit/0cbaa878b8a844d5abbeb1797b625a33130e6514)]:
62
67
  - @graphcommerce/graphql@3.0.1
63
68
  - @graphcommerce/image@3.0.1
64
69
  - @graphcommerce/next-ui@4.0.1
@@ -67,100 +72,79 @@
67
72
 
68
73
  ### Major Changes
69
74
 
70
- - [#1258](https://github.com/ho-nl/m2-pwa/pull/1258)
71
- [`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)
72
- Thanks [@paales](https://github.com/paales)! - Upgraded to Material UI 5
75
+ - [#1258](https://github.com/ho-nl/m2-pwa/pull/1258) [`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05) Thanks [@paales](https://github.com/paales)! - Upgraded to Material UI 5
73
76
 
74
77
  ### Patch Changes
75
78
 
76
- - Updated dependencies
77
- [[`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)]:
79
+ - Updated dependencies [[`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)]:
78
80
  - @graphcommerce/graphql@3.0.0
79
81
  - @graphcommerce/image@3.0.0
80
82
  - @graphcommerce/next-ui@4.0.0
81
83
 
82
- All notable changes to this project will be documented in this file. See
83
- [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
84
+ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
84
85
 
85
86
  ## [2.106.12](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.106.11...@graphcommerce/graphcms-ui@2.106.12) (2021-12-17)
86
87
 
87
88
  ### Bug Fixes
88
89
 
89
- - make sure we're able to render table_header_cell and do not throw when rendering unknown elements
90
- in production
91
- ([f7b7972](https://github.com/ho-nl/m2-pwa/commit/f7b797272f5765801c3f2e217fa9905f65dbe6d6))
90
+ - make sure we're able to render table_header_cell and do not throw when rendering unknown elements in production ([f7b7972](https://github.com/ho-nl/m2-pwa/commit/f7b797272f5765801c3f2e217fa9905f65dbe6d6))
92
91
 
93
92
  # [2.106.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.105.4...@graphcommerce/graphcms-ui@2.106.0) (2021-12-01)
94
93
 
95
94
  ### Bug Fixes
96
95
 
97
96
  - build ([72d9353](https://github.com/ho-nl/m2-pwa/commit/72d935376a1967cc976c20b984ef15a862e5d0f4))
98
- - fontWeights
99
- ([7172527](https://github.com/ho-nl/m2-pwa/commit/71725272fe9f0b854d918ae357a668f641bfe8e5))
100
- - hero text spacing
101
- ([79dd6aa](https://github.com/ho-nl/m2-pwa/commit/79dd6aa2fe576104ebbbdd092f6b415d319dec48))
102
- - render bug stroke variable fonts
103
- ([582de18](https://github.com/ho-nl/m2-pwa/commit/582de187800ee9c53718bf43a39ca77398d21b91)),
104
- closes
105
- [/github.com/rsms/inter/issues/292#issuecomment-674993644](https://github.com//github.com/rsms/inter/issues/292/issues/issuecomment-674993644)
97
+ - fontWeights ([7172527](https://github.com/ho-nl/m2-pwa/commit/71725272fe9f0b854d918ae357a668f641bfe8e5))
98
+ - hero text spacing ([79dd6aa](https://github.com/ho-nl/m2-pwa/commit/79dd6aa2fe576104ebbbdd092f6b415d319dec48))
99
+ - render bug stroke variable fonts ([582de18](https://github.com/ho-nl/m2-pwa/commit/582de187800ee9c53718bf43a39ca77398d21b91)), closes [/github.com/rsms/inter/issues/292#issuecomment-674993644](https://github.com//github.com/rsms/inter/issues/292/issues/issuecomment-674993644)
106
100
 
107
101
  ### Features
108
102
 
109
- - breakpointVal
110
- ([0294503](https://github.com/ho-nl/m2-pwa/commit/029450343051cf6995babad9f9b42c7e6ad1094e))
111
- - responsiveTyp
112
- ([6108b61](https://github.com/ho-nl/m2-pwa/commit/6108b6148e76ddbbe2db1614f10aaf88423db5ca))
103
+ - breakpointVal ([0294503](https://github.com/ho-nl/m2-pwa/commit/029450343051cf6995babad9f9b42c7e6ad1094e))
104
+ - responsiveTyp ([6108b61](https://github.com/ho-nl/m2-pwa/commit/6108b6148e76ddbbe2db1614f10aaf88423db5ca))
113
105
 
114
106
  # [2.105.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.104.29...@graphcommerce/graphcms-ui@2.105.0) (2021-11-12)
115
107
 
116
108
  ### Features
117
109
 
118
- - added tons of translations
119
- ([9bb0ac7](https://github.com/ho-nl/m2-pwa/commit/9bb0ac709b58df6ea6141e92e4923a5ca9ae2963))
110
+ - added tons of translations ([9bb0ac7](https://github.com/ho-nl/m2-pwa/commit/9bb0ac709b58df6ea6141e92e4923a5ca9ae2963))
120
111
 
121
112
  ## [2.104.29](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.104.28...@graphcommerce/graphcms-ui@2.104.29) (2021-11-12)
122
113
 
123
114
  ### Bug Fixes
124
115
 
125
- - must have smaller sizes for mobile
126
- ([34cf81e](https://github.com/ho-nl/m2-pwa/commit/34cf81eed6c5996f70be8b2c10888e44fad4d57f))
116
+ - must have smaller sizes for mobile ([34cf81e](https://github.com/ho-nl/m2-pwa/commit/34cf81eed6c5996f70be8b2c10888e44fad4d57f))
127
117
 
128
118
  ## [2.104.18](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.104.17...@graphcommerce/graphcms-ui@2.104.18) (2021-11-04)
129
119
 
130
120
  ### Bug Fixes
131
121
 
132
- - remove hardcoded fontSize
133
- ([e4e09e1](https://github.com/ho-nl/m2-pwa/commit/e4e09e11baeb8edeff634550b8cdb88571d96911))
122
+ - remove hardcoded fontSize ([e4e09e1](https://github.com/ho-nl/m2-pwa/commit/e4e09e11baeb8edeff634550b8cdb88571d96911))
134
123
 
135
124
  ## [2.104.16](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.104.15...@graphcommerce/graphcms-ui@2.104.16) (2021-11-03)
136
125
 
137
126
  ### Bug Fixes
138
127
 
139
- - various accessibility improvements
140
- ([47481a9](https://github.com/ho-nl/m2-pwa/commit/47481a9a882ba87968de6dd797557b0b275d75fb))
128
+ - various accessibility improvements ([47481a9](https://github.com/ho-nl/m2-pwa/commit/47481a9a882ba87968de6dd797557b0b275d75fb))
141
129
 
142
130
  ## [2.104.9](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.104.8...@graphcommerce/graphcms-ui@2.104.9) (2021-11-02)
143
131
 
144
132
  ### Bug Fixes
145
133
 
146
- - color from palette
147
- ([283cca1](https://github.com/ho-nl/m2-pwa/commit/283cca169ec00cbac8b973e14e6b77a443e26c99))
148
- - darkMode
149
- ([c7573de](https://github.com/ho-nl/m2-pwa/commit/c7573de6bb80643b26931c35ac61735539e7fbf0))
134
+ - color from palette ([283cca1](https://github.com/ho-nl/m2-pwa/commit/283cca169ec00cbac8b973e14e6b77a443e26c99))
135
+ - darkMode ([c7573de](https://github.com/ho-nl/m2-pwa/commit/c7573de6bb80643b26931c35ac61735539e7fbf0))
150
136
 
151
137
  ## [2.104.3](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.104.2...@graphcommerce/graphcms-ui@2.104.3) (2021-10-28)
152
138
 
153
139
  ### Bug Fixes
154
140
 
155
- - default heading margins for CMS content
156
- ([ac7c24f](https://github.com/ho-nl/m2-pwa/commit/ac7c24f731abf9573ad93d534d84b9f7c1b16a2b))
141
+ - default heading margins for CMS content ([ac7c24f](https://github.com/ho-nl/m2-pwa/commit/ac7c24f731abf9573ad93d534d84b9f7c1b16a2b))
157
142
 
158
143
  # [2.104.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.103.30...@graphcommerce/graphcms-ui@2.104.0) (2021-10-27)
159
144
 
160
145
  ### Features
161
146
 
162
- - **nextjs:** upgraded to nextjs 12
163
- ([9331bc8](https://github.com/ho-nl/m2-pwa/commit/9331bc801f6419522115cc47d291d49d608d5a90))
147
+ - **nextjs:** upgraded to nextjs 12 ([9331bc8](https://github.com/ho-nl/m2-pwa/commit/9331bc801f6419522115cc47d291d49d608d5a90))
164
148
 
165
149
  ## [2.103.1](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.103.0...@graphcommerce/graphcms-ui@2.103.1) (2021-09-27)
166
150
 
@@ -170,75 +154,53 @@ All notable changes to this project will be documented in this file. See
170
154
 
171
155
  ### Bug Fixes
172
156
 
173
- - ignore md files from triggering version updates
174
- ([4f98392](https://github.com/ho-nl/m2-pwa/commit/4f9839250b3a32d3070da5290e5efcc5e2243fba))
175
- - implement next-ui barrel imports
176
- ([75bea70](https://github.com/ho-nl/m2-pwa/commit/75bea703dba898f18a2a1dfa3243ebd0a4e6f0e1))
177
- - narrow quote on mobile
178
- ([e06ccc2](https://github.com/ho-nl/m2-pwa/commit/e06ccc25048124431dcdb786f1719f688a5e429c))
179
- - remove conflicting files
180
- ([0c17ae4](https://github.com/ho-nl/m2-pwa/commit/0c17ae46be62b775ac83b35f11c532ce2d9401a3))
181
- - since all links are of next/link we need to add passHref for custom components
182
- ([16fb931](https://github.com/ho-nl/m2-pwa/commit/16fb93100d367203ea79bb4f93357221253f2ecd))
157
+ - ignore md files from triggering version updates ([4f98392](https://github.com/ho-nl/m2-pwa/commit/4f9839250b3a32d3070da5290e5efcc5e2243fba))
158
+ - implement next-ui barrel imports ([75bea70](https://github.com/ho-nl/m2-pwa/commit/75bea703dba898f18a2a1dfa3243ebd0a4e6f0e1))
159
+ - narrow quote on mobile ([e06ccc2](https://github.com/ho-nl/m2-pwa/commit/e06ccc25048124431dcdb786f1719f688a5e429c))
160
+ - remove conflicting files ([0c17ae4](https://github.com/ho-nl/m2-pwa/commit/0c17ae46be62b775ac83b35f11c532ce2d9401a3))
161
+ - 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))
183
162
 
184
163
  ### Features
185
164
 
186
- - created stacked-pages package
187
- ([d86008e](https://github.com/ho-nl/m2-pwa/commit/d86008ee659ccb25b194a41d624b394a1ddbd088))
188
- - **image:** introduced completely rewritten Image component
189
- ([e3413b3](https://github.com/ho-nl/m2-pwa/commit/e3413b3a57392d6571ea64cb8d9c8dca05ea31df))
190
- - implemented the ability to load graphcms content by URL
191
- ([99bc970](https://github.com/ho-nl/m2-pwa/commit/99bc970fc46d40b7efa99a71819529aeaa206bb4))
192
- - introduced graphcms-ui package to quickly build pages
193
- ([04d89c3](https://github.com/ho-nl/m2-pwa/commit/04d89c3fecf25f64923caf437eeb4b73f8887102))
194
- - introduces framer-next-pages and framer-sheet to next-ui and soxbase package
195
- ([e04ad8a](https://github.com/ho-nl/m2-pwa/commit/e04ad8a94cd1fd5a7c5575c9db7916b6e8a88f16))
196
- - next.js 11
197
- ([7d61407](https://github.com/ho-nl/m2-pwa/commit/7d614075a778f488045034f74be4f75b93f63c43))
198
- - **playwright:** added new playwright package to enable browser testing
199
- ([6f49ec7](https://github.com/ho-nl/m2-pwa/commit/6f49ec7595563775b96ebf21c27e39da1282e8d9))
200
- - renamed all packages to use [@graphcommerce](https://github.com/graphcommerce) instead of
201
- [@reachdigital](https://github.com/reachdigital)
202
- ([491e4ce](https://github.com/ho-nl/m2-pwa/commit/491e4cec9a2686472dac36b79f999257c0811ffe))
203
- - upgrade to node 14
204
- ([d079a75](https://github.com/ho-nl/m2-pwa/commit/d079a751e9bfd8dc7f5009d2c9f31c336a0c96ab))
205
- - upgraded to nextjs 11
206
- ([0053beb](https://github.com/ho-nl/m2-pwa/commit/0053beb7ef597c190add7264256a0eaec35868da))
165
+ - created stacked-pages package ([d86008e](https://github.com/ho-nl/m2-pwa/commit/d86008ee659ccb25b194a41d624b394a1ddbd088))
166
+ - **image:** introduced completely rewritten Image component ([e3413b3](https://github.com/ho-nl/m2-pwa/commit/e3413b3a57392d6571ea64cb8d9c8dca05ea31df))
167
+ - implemented the ability to load graphcms content by URL ([99bc970](https://github.com/ho-nl/m2-pwa/commit/99bc970fc46d40b7efa99a71819529aeaa206bb4))
168
+ - introduced graphcms-ui package to quickly build pages ([04d89c3](https://github.com/ho-nl/m2-pwa/commit/04d89c3fecf25f64923caf437eeb4b73f8887102))
169
+ - introduces framer-next-pages and framer-sheet to next-ui and soxbase package ([e04ad8a](https://github.com/ho-nl/m2-pwa/commit/e04ad8a94cd1fd5a7c5575c9db7916b6e8a88f16))
170
+ - next.js 11 ([7d61407](https://github.com/ho-nl/m2-pwa/commit/7d614075a778f488045034f74be4f75b93f63c43))
171
+ - **playwright:** added new playwright package to enable browser testing ([6f49ec7](https://github.com/ho-nl/m2-pwa/commit/6f49ec7595563775b96ebf21c27e39da1282e8d9))
172
+ - 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))
173
+ - upgrade to node 14 ([d079a75](https://github.com/ho-nl/m2-pwa/commit/d079a751e9bfd8dc7f5009d2c9f31c336a0c96ab))
174
+ - upgraded to nextjs 11 ([0053beb](https://github.com/ho-nl/m2-pwa/commit/0053beb7ef597c190add7264256a0eaec35868da))
207
175
 
208
176
  ### Reverts
209
177
 
210
- - Revert "chore: upgrade @apollo/client"
211
- ([55ff24e](https://github.com/ho-nl/m2-pwa/commit/55ff24ede0e56c85b8095edadadd1ec5e0b1b8d2))
178
+ - Revert "chore: upgrade @apollo/client" ([55ff24e](https://github.com/ho-nl/m2-pwa/commit/55ff24ede0e56c85b8095edadadd1ec5e0b1b8d2))
212
179
 
213
180
  # Change Log
214
181
 
215
- All notable changes to this project will be documented in this file. See
216
- [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
182
+ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
217
183
 
218
184
  # [2.102.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.101.9...@graphcommerce/graphcms-ui@2.102.0) (2021-08-12)
219
185
 
220
186
  ### Features
221
187
 
222
- - upgraded to nextjs 11
223
- ([0053beb](https://github.com/ho-nl/m2-pwa/commit/0053beb7ef597c190add7264256a0eaec35868da))
188
+ - upgraded to nextjs 11 ([0053beb](https://github.com/ho-nl/m2-pwa/commit/0053beb7ef597c190add7264256a0eaec35868da))
224
189
 
225
190
  ## [2.101.9](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.101.8...@graphcommerce/graphcms-ui@2.101.9) (2021-08-09)
226
191
 
227
192
  ### Reverts
228
193
 
229
- - Revert "chore: upgrade @apollo/client"
230
- ([55ff24e](https://github.com/ho-nl/m2-pwa/commit/55ff24ede0e56c85b8095edadadd1ec5e0b1b8d2))
194
+ - Revert "chore: upgrade @apollo/client" ([55ff24e](https://github.com/ho-nl/m2-pwa/commit/55ff24ede0e56c85b8095edadadd1ec5e0b1b8d2))
231
195
 
232
196
  # [2.101.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.100.18...@graphcommerce/graphcms-ui@2.101.0) (2021-07-26)
233
197
 
234
198
  ### Features
235
199
 
236
- - **playwright:** added new playwright package to enable browser testing
237
- ([6f49ec7](https://github.com/ho-nl/m2-pwa/commit/6f49ec7595563775b96ebf21c27e39da1282e8d9))
200
+ - **playwright:** added new playwright package to enable browser testing ([6f49ec7](https://github.com/ho-nl/m2-pwa/commit/6f49ec7595563775b96ebf21c27e39da1282e8d9))
238
201
 
239
202
  ## [2.100.11](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/graphcms-ui@2.100.10...@graphcommerce/graphcms-ui@2.100.11) (2021-07-20)
240
203
 
241
204
  ### Bug Fixes
242
205
 
243
- - ignore md files from triggering version updates
244
- ([4f98392](https://github.com/ho-nl/m2-pwa/commit/4f9839250b3a32d3070da5290e5efcc5e2243fba))
206
+ - ignore md files from triggering version updates ([4f98392](https://github.com/ho-nl/m2-pwa/commit/4f9839250b3a32d3070da5290e5efcc5e2243fba))
package/components/Asset/{index.tsx → Asset.tsx} RENAMED
@@ -22,7 +22,16 @@ export function Asset(props: AssetProps) {
22
22
 
23
23
  if (isImage(asset)) {
24
24
  const { url, height, mimeType, size, width, ...assetProps } = removeNull(asset)
25
- return <Image src={url} height={height} width={width} {...imgProps} {...assetProps} />
25
+ return (
26
+ <Image
27
+ src={url}
28
+ height={height}
29
+ width={width}
30
+ {...imgProps}
31
+ {...assetProps}
32
+ unoptimized={mimeType === 'image/svg+xml'}
33
+ />
34
+ )
26
35
  }
27
36
 
28
37
  if (asset.mimeType === 'video/mp4') {
package/components/RichText/RichText.tsx CHANGED
@@ -1,22 +1,59 @@
1
+ /* eslint-disable @typescript-eslint/no-use-before-define */
1
2
  import { SxProps, Theme } from '@mui/material'
2
3
  import { defaultRenderers } from './defaultRenderers'
3
4
  import { defaultSxRenderer } from './defaultSxRenderer'
4
5
  import {
5
6
  AdditionalProps,
6
7
  Renderers,
8
+ Renderer,
7
9
  SxRenderer,
8
10
  TextNode,
9
11
  ElementOrTextNode,
10
12
  ElementNode,
13
+ SimpleElement,
11
14
  } from './types'
12
15
 
13
- const RenderText = ({ classes, text, ...textProps }: TextNode) => {
14
- let result = <>{text}</>
15
- if (textProps.bold) result = <strong>{result}</strong>
16
- if (textProps.italic) result = <em>{result}</em>
17
- if (textProps.underlined) result = <em>{result}</em>
16
+ const sxArr = (sxAny?: SxProps<Theme> | false) => {
17
+ if (!sxAny) return []
18
+ return Array.isArray(sxAny) ? sxAny : [sxAny]
19
+ }
20
+
21
+ function useRenderProps(
22
+ { first, last, sxRenderer }: Pick<AdditionalProps, 'first' | 'last' | 'sxRenderer'>,
23
+ type?: ElementNode['type'],
24
+ ) {
25
+ if (!type) return []
26
+ const sx: SxProps<Theme> = sxRenderer?.[type] ?? []
27
+
28
+ return [
29
+ ...sxArr(sxRenderer.all),
30
+ ...sxArr(sx),
31
+ ...sxArr(first && sxRenderer.first),
32
+ ...sxArr(last && sxRenderer.last),
33
+ ]
34
+ }
35
+
36
+ function RenderText({
37
+ text,
38
+ renderers,
39
+ sxRenderer,
40
+ first,
41
+ last,
42
+ ...textProps
43
+ }: TextNode & AdditionalProps) {
44
+ let type: 'bold' | 'italic' | 'underlined' | undefined
45
+
46
+ if (textProps.bold) type = 'bold'
47
+ if (textProps.italic) type = 'italic'
48
+ if (textProps.underlined) type = 'underlined'
18
49
 
19
- return result
50
+ const sx = useRenderProps({ first, last, sxRenderer }, type)
51
+
52
+ if (!type) return <>{text}</>
53
+
54
+ const Component: Renderer<SimpleElement> = renderers[type]
55
+
56
+ return <Component sx={sx}>{text}</Component>
20
57
  }
21
58
 
22
59
  export function isTextNode(node: ElementOrTextNode): node is TextNode {
@@ -46,29 +83,37 @@ function RenderNode(node: ElementOrTextNode & AdditionalProps) {
46
83
 
47
84
  function RenderChildren({
48
85
  childNodes,
86
+ noMargin,
49
87
  ...props
50
- }: { childNodes: ElementNode['children'] } & AdditionalProps) {
88
+ }: { childNodes: ElementNode['children']; noMargin?: boolean } & AdditionalProps) {
51
89
  return (
52
90
  <>
53
91
  {childNodes.map((node, key) => (
54
- // Since we don't know any unique identifiers of the element and since this doesn't rerender often this is fine.
55
- // eslint-disable-next-line react/no-array-index-key
56
- <RenderNode {...node} {...props} key={key} />
92
+ <RenderNode
93
+ {...node}
94
+ {...props}
95
+ // Since we don't know any unique identifiers of the element and since this doesn't rerender often this is fine.
96
+ // eslint-disable-next-line react/no-array-index-key
97
+ key={key}
98
+ first={noMargin && key === 0}
99
+ last={noMargin && key === childNodes.length - 1}
100
+ />
57
101
  ))}
58
102
  </>
59
103
  )
60
104
  }
61
105
 
62
106
  function RenderElement(element: ElementNode & AdditionalProps) {
63
- const { type, children, sxRenderer, renderers, ...props } = element
107
+ const { type, children, sxRenderer, renderers, first, last, ...props } = element
64
108
 
65
109
  // todo: this has the any type, could be improved
66
- const Component = renderers[type]
67
- const sx = sxRenderer?.[type] ?? []
110
+ const Component: Renderer<SimpleElement> = renderers[type]
111
+
112
+ const sx = useRenderProps({ first, last, sxRenderer }, type)
68
113
 
69
114
  if (Component) {
70
115
  return (
71
- <Component {...props} sx={[sxRenderer.all, ...(Array.isArray(sx) ? sx : [sx])]}>
116
+ <Component {...props} sx={sx}>
72
117
  <RenderChildren childNodes={children} sxRenderer={sxRenderer} renderers={renderers} />
73
118
  </Component>
74
119
  )
@@ -81,12 +126,7 @@ function RenderElement(element: ElementNode & AdditionalProps) {
81
126
  return <RenderChildren childNodes={children} sxRenderer={sxRenderer} renderers={renderers} />
82
127
  }
83
128
 
84
- export type RichTextProps = { raw: ElementNode } & {
85
- renderers?: Partial<Renderers>
86
- sxRenderer?: SxRenderer
87
- }
88
-
89
- export function mergeSxRenderer(base: SxRenderer, sxRenderer?: SxRenderer) {
129
+ function mergeSxRenderer(base: SxRenderer, sxRenderer?: SxRenderer) {
90
130
  if (!sxRenderer) return base
91
131
 
92
132
  return Object.fromEntries(
@@ -106,12 +146,38 @@ export function mergeSxRenderer(base: SxRenderer, sxRenderer?: SxRenderer) {
106
146
  ) as SxRenderer
107
147
  }
108
148
 
109
- export function RichText({ raw, sxRenderer, renderers }: RichTextProps) {
149
+ export type RichTextProps = { raw: ElementNode } & {
150
+ renderers?: Partial<Renderers>
151
+ /**
152
+ * Allows you to theme all the types of components
153
+ *
154
+ * ```tsx
155
+ * function MyComponent()f {
156
+ * return <RichText
157
+ * sxRenderer={{
158
+ * paragraph: (theme) => ({
159
+ * columnCount: { xs: 1, md: getColumnCount(props, 2) },
160
+ * columnGap: theme.spacings.md,
161
+ * }),
162
+ * //other props here
163
+ * }}
164
+ * />
165
+ * }
166
+ * ```
167
+ */
168
+ sxRenderer?: SxRenderer
169
+
170
+ /** By default the component will render the first and last element without any margins */
171
+ withMargin?: boolean
172
+ }
173
+
174
+ export function RichText({ raw, sxRenderer, renderers, withMargin = false }: RichTextProps) {
110
175
  return (
111
176
  <RenderChildren
112
177
  childNodes={raw.children}
113
178
  sxRenderer={mergeSxRenderer(defaultSxRenderer, sxRenderer)}
114
179
  renderers={{ ...defaultRenderers, ...renderers }}
180
+ noMargin={!withMargin}
115
181
  />
116
182
  )
117
183
  }
package/components/RichText/defaultRenderers.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import { Box, Typography, Link } from '@mui/material'
2
2
  import PageLink from 'next/link'
3
- import { Asset } from '../Asset'
3
+ import { Asset } from '../Asset/Asset'
4
4
  import { Renderers } from './types'
5
5
 
6
6
  export const defaultRenderers: Renderers = {
@@ -39,4 +39,7 @@ export const defaultRenderers: Renderers = {
39
39
  table_row: (props) => <Box component='tr' {...props} />,
40
40
  table_cell: (props) => <Box component='td' {...props} />,
41
41
  code: (props) => <Box component='code' {...props} />,
42
+ bold: (props) => <Box component='strong' fontWeight='bold' {...props} />,
43
+ italic: (props) => <Box component='em' fontStyle='italic' {...props} />,
44
+ underlined: (props) => <Box component='span' {...props} />,
42
45
  }
package/components/RichText/defaultSxRenderer.ts CHANGED
@@ -5,7 +5,12 @@ export const defaultSxRenderer: SxRenderer = {
5
5
  '&:empty': {
6
6
  display: 'none',
7
7
  },
8
- '&:last-of-type': { marginBottom: 0 },
8
+ },
9
+ first: {
10
+ marginTop: 0,
11
+ },
12
+ last: {
13
+ marginBottom: 0,
9
14
  },
10
15
  paragraph: {
11
16
  marginBottom: '1em',
@@ -18,22 +23,18 @@ export const defaultSxRenderer: SxRenderer = {
18
23
  'heading-two': {
19
24
  marginTop: '0.5em',
20
25
  marginBottom: '0.5em',
21
- '&:first-of-type': { marginTop: 0 },
22
26
  },
23
27
  'heading-three': {
24
28
  marginTop: '0.5em',
25
29
  marginBottom: '0.5em',
26
- '&:first-of-type': { marginTop: 0 },
27
30
  },
28
31
  'heading-four': {
29
32
  marginTop: '0.5em',
30
33
  marginBottom: '0.5em',
31
- '&:first-of-type': { marginTop: 0 },
32
34
  },
33
35
  'heading-five': {
34
36
  marginTop: '0.5em',
35
37
  marginBottom: '0.5em',
36
- '&:first-of-type': { marginTop: 0 },
37
38
  },
38
39
  image: {
39
40
  width: '100%',
@@ -100,4 +101,7 @@ export const defaultSxRenderer: SxRenderer = {
100
101
  link: {
101
102
  wordBreak: 'break-word',
102
103
  },
104
+ underlined: {
105
+ textDecoration: 'underline',
106
+ },
103
107
  }
package/components/RichText/types.ts CHANGED
@@ -22,8 +22,11 @@ type BaseElementTypes =
22
22
  | 'table_row'
23
23
  | 'table_cell'
24
24
  | 'code'
25
+ | 'bold'
26
+ | 'italic'
27
+ | 'underlined'
25
28
 
26
- type SimpleElement = {
29
+ export type SimpleElement = {
27
30
  children: ElementOrTextNode[]
28
31
  type: LiteralUnion<BaseElementTypes, string>
29
32
  }
@@ -72,8 +75,8 @@ export type ElementNode = SimpleElement | LinkElement | ImageElement | VideoElem
72
75
  export type ElementOrTextNode = ElementNode | TextNode
73
76
 
74
77
  type RendererBase = { sx?: SxProps<Theme>; children?: React.ReactNode }
75
- type Renderer<P extends ElementNode> = (
76
- props: Omit<P, 'children'> & RendererBase,
78
+ export type Renderer<P extends ElementNode> = (
79
+ props: Omit<P, 'children' | 'type'> & RendererBase,
77
80
  ) => React.ReactElement | null
78
81
 
79
82
  export type Renderers = {
@@ -86,7 +89,12 @@ export type Renderers = {
86
89
  }
87
90
 
88
91
  export type SxRenderer = {
89
- [k in keyof Renderers | 'all']?: SxProps<Theme>
92
+ [k in keyof Renderers | 'all' | 'first' | 'last']?: SxProps<Theme>
90
93
  }
91
94
 
92
- export type AdditionalProps = { renderers: Renderers; sxRenderer: SxRenderer }
95
+ export type AdditionalProps = {
96
+ renderers: Renderers
97
+ sxRenderer: SxRenderer
98
+ first?: boolean
99
+ last?: boolean
100
+ }
package/index.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  export * from './components/RichText'
2
- export * from './components/Asset'
2
+ export * from './components/Asset/Asset'
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@graphcommerce/graphcms-ui",
3
3
  "homepage": "https://www.graphcommerce.org/",
4
4
  "repository": "github:graphcommerce-org/graphcommerce",
5
- "version": "3.0.3",
5
+ "version": "3.0.6",
6
6
  "sideEffects": false,
7
7
  "prettier": "@graphcommerce/prettier-config-pwa",
8
8
  "eslintConfig": {
@@ -12,15 +12,15 @@
12
12
  }
13
13
  },
14
14
  "devDependencies": {
15
- "@graphcommerce/eslint-config-pwa": "^4.0.3",
16
- "@graphcommerce/prettier-config-pwa": "^4.0.2",
15
+ "@graphcommerce/eslint-config-pwa": "^4.0.5",
16
+ "@graphcommerce/prettier-config-pwa": "^4.0.3",
17
17
  "@graphcommerce/typescript-config-pwa": "^4.0.2",
18
- "@playwright/test": "^1.19.1"
18
+ "@playwright/test": "^1.19.2"
19
19
  },
20
20
  "dependencies": {
21
- "@graphcommerce/graphql": "^3.0.3",
22
- "@graphcommerce/image": "^3.1.0",
23
- "@graphcommerce/next-ui": "^4.1.2",
21
+ "@graphcommerce/graphql": "^3.0.4",
22
+ "@graphcommerce/image": "^3.1.1",
23
+ "@graphcommerce/next-ui": "^4.3.0",
24
24
  "type-fest": "^2.12.0"
25
25
  },
26
26
  "peerDependencies": {