Skip to content

Commit ab3569c

Browse files
guoyunheguoyunhe
authored
fix(Breadcrumb): custom itemRender style for 6.x (ant-design#56253)
1 parent 8bedd4c commit ab3569c

10 files changed

Lines changed: 416 additions & 146 deletions

File tree

‎components/breadcrumb/BreadcrumbItem.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import * as React from 'react';
22
import DownOutlined from '@ant-design/icons/DownOutlined';
3+
import clsx from 'clsx';
34

45
import isNonNullable from '../_util/isNonNullable';
56
import { ConfigContext } from '../config-provider';
@@ -86,7 +87,10 @@ export const InternalBreadcrumbItem: React.FC<BreadcrumbItemProps> = (props) =>
8687
if (isNonNullable(link)) {
8788
return (
8889
<>
89-
<li className={mergedClassNames?.item} style={mergedStyles?.item}>
90+
<li
91+
className={clsx(`${prefixCls}-item`, mergedClassNames?.item)}
92+
style={mergedStyles?.item}
93+
>
9094
{link}
9195
</li>
9296
{separator && <BreadcrumbSeparator>{separator}</BreadcrumbSeparator>}

‎components/breadcrumb/__tests__/__snapshots__/Breadcrumb.test.tsx.snap‎

Lines changed: 63 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,9 @@ exports[`Breadcrumb filter React.Fragment 1`] = `
55
class="ant-breadcrumb css-var-root"
66
>
77
<ol>
8-
<li>
8+
<li
9+
class="ant-breadcrumb-item"
10+
>
911
<span
1012
class="ant-breadcrumb-link"
1113
>
@@ -18,7 +20,9 @@ exports[`Breadcrumb filter React.Fragment 1`] = `
1820
>
1921
:
2022
</li>
21-
<li>
23+
<li
24+
class="ant-breadcrumb-item"
25+
>
2226
<a
2327
class="ant-breadcrumb-link"
2428
href=""
@@ -57,7 +61,9 @@ exports[`Breadcrumb should allow Breadcrumb.Item is null or undefined 1`] = `
5761
class="ant-breadcrumb css-var-root"
5862
>
5963
<ol>
60-
<li>
64+
<li
65+
class="ant-breadcrumb-item"
66+
>
6167
<span
6268
class="ant-breadcrumb-link"
6369
>
@@ -73,7 +79,9 @@ exports[`Breadcrumb should not display Breadcrumb Item when its children is fals
7379
class="ant-breadcrumb css-var-root"
7480
>
7581
<ol>
76-
<li>
82+
<li
83+
class="ant-breadcrumb-item"
84+
>
7785
<span
7886
class="ant-breadcrumb-link"
7987
>
@@ -86,7 +94,9 @@ exports[`Breadcrumb should not display Breadcrumb Item when its children is fals
8694
>
8795
/
8896
</li>
89-
<li>
97+
<li
98+
class="ant-breadcrumb-item"
99+
>
90100
<span
91101
class="ant-breadcrumb-link"
92102
>
@@ -102,7 +112,9 @@ exports[`Breadcrumb should render a menu 1`] = `
102112
class="ant-breadcrumb css-var-root"
103113
>
104114
<ol>
105-
<li>
115+
<li
116+
class="ant-breadcrumb-item"
117+
>
106118
<a
107119
class="ant-breadcrumb-link"
108120
href="#/index"
@@ -116,7 +128,9 @@ exports[`Breadcrumb should render a menu 1`] = `
116128
>
117129
/
118130
</li>
119-
<li>
131+
<li
132+
class="ant-breadcrumb-item"
133+
>
120134
<span
121135
class="ant-dropdown-trigger ant-breadcrumb-overlay-link"
122136
>
@@ -153,7 +167,9 @@ exports[`Breadcrumb should render a menu 1`] = `
153167
>
154168
/
155169
</li>
156-
<li>
170+
<li
171+
class="ant-breadcrumb-item"
172+
>
157173
<a
158174
class="ant-breadcrumb-link"
159175
href="#/index/first/second"
@@ -167,7 +183,9 @@ exports[`Breadcrumb should render a menu 1`] = `
167183
>
168184
/
169185
</li>
170-
<li>
186+
<li
187+
class="ant-breadcrumb-item"
188+
>
171189
<a
172190
class="ant-breadcrumb-link"
173191
href="#/index/first/second/third"
@@ -182,7 +200,9 @@ exports[`Breadcrumb should render correct 1`] = `
182200
class="ant-breadcrumb css-var-root"
183201
>
184202
<ol>
185-
<li>
203+
<li
204+
class="ant-breadcrumb-item"
205+
>
186206
<a
187207
class="ant-breadcrumb-link"
188208
href="#/"
@@ -198,7 +218,9 @@ exports[`Breadcrumb should render correct 1`] = `
198218
>
199219
/
200220
</li>
201-
<li>
221+
<li
222+
class="ant-breadcrumb-item"
223+
>
202224
<span
203225
class="ant-breadcrumb-link"
204226
>
@@ -214,7 +236,9 @@ exports[`Breadcrumb should support Breadcrumb.Item default separator 1`] = `
214236
class="ant-breadcrumb css-var-root"
215237
>
216238
<ol>
217-
<li>
239+
<li
240+
class="ant-breadcrumb-item"
241+
>
218242
<span
219243
class="ant-breadcrumb-link"
220244
>
@@ -228,7 +252,9 @@ exports[`Breadcrumb should support Breadcrumb.Item default separator 1`] = `
228252
/
229253
</li>
230254
<span>
231-
<li>
255+
<li
256+
class="ant-breadcrumb-item"
257+
>
232258
<span
233259
class="ant-breadcrumb-link"
234260
>
@@ -242,7 +268,9 @@ exports[`Breadcrumb should support Breadcrumb.Item default separator 1`] = `
242268
/
243269
</li>
244270
</span>
245-
<li>
271+
<li
272+
class="ant-breadcrumb-item"
273+
>
246274
<span
247275
class="ant-breadcrumb-link"
248276
>
@@ -258,7 +286,9 @@ exports[`Breadcrumb should support React.Fragment and falsy children 1`] = `
258286
class="ant-breadcrumb css-var-root"
259287
>
260288
<ol>
261-
<li>
289+
<li
290+
class="ant-breadcrumb-item"
291+
>
262292
<span
263293
class="ant-breadcrumb-link"
264294
>
@@ -271,7 +301,9 @@ exports[`Breadcrumb should support React.Fragment and falsy children 1`] = `
271301
>
272302
/
273303
</li>
274-
<li>
304+
<li
305+
class="ant-breadcrumb-item"
306+
>
275307
<span
276308
class="ant-breadcrumb-link"
277309
>
@@ -284,7 +316,9 @@ exports[`Breadcrumb should support React.Fragment and falsy children 1`] = `
284316
>
285317
/
286318
</li>
287-
<li>
319+
<li
320+
class="ant-breadcrumb-item"
321+
>
288322
<span
289323
class="ant-breadcrumb-link"
290324
>
@@ -308,7 +342,9 @@ exports[`Breadcrumb should support custom attribute 1`] = `
308342
data-custom="custom"
309343
>
310344
<ol>
311-
<li>
345+
<li
346+
class="ant-breadcrumb-item"
347+
>
312348
<span
313349
class="ant-breadcrumb-link"
314350
data-custom="custom-item"
@@ -322,7 +358,9 @@ exports[`Breadcrumb should support custom attribute 1`] = `
322358
>
323359
/
324360
</li>
325-
<li>
361+
<li
362+
class="ant-breadcrumb-item"
363+
>
326364
<span
327365
class="ant-breadcrumb-link"
328366
>
@@ -338,7 +376,9 @@ exports[`Breadcrumb should support string \`0\` and number \`0\` 1`] = `
338376
class="ant-breadcrumb css-var-root"
339377
>
340378
<ol>
341-
<li>
379+
<li
380+
class="ant-breadcrumb-item"
381+
>
342382
<span
343383
class="ant-breadcrumb-link"
344384
>
@@ -351,7 +391,9 @@ exports[`Breadcrumb should support string \`0\` and number \`0\` 1`] = `
351391
>
352392
/
353393
</li>
354-
<li>
394+
<li
395+
class="ant-breadcrumb-item"
396+
>
355397
<span
356398
class="ant-breadcrumb-link"
357399
>

0 commit comments

Comments
 (0)