Skip to content

Commit 6ad497d

Browse files
committed
fix: set min width of the current item
1 parent 7f9e5e6 commit 6ad497d

File tree

1 file changed

+6
-0
lines changed

1 file changed

+6
-0
lines changed

src/components/Breadcrumbs/Breadcrumbs.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,11 @@ export const Breadcrumbs = React.forwardRef(function Breadcrumbs(
6262
typeof props.maxItems === 'number' && props.maxItems < items.length
6363
? props.maxItems - 1
6464
: undefined,
65+
getChildWidth: (child) => {
66+
const width = child.getBoundingClientRect().width;
67+
const maxWidth = child.dataset.current ? 200 : Infinity;
68+
return Math.min(maxWidth, width);
69+
},
6570
});
6671

6772
useResizeObserver({
@@ -155,6 +160,7 @@ export const Breadcrumbs = React.forwardRef(function Breadcrumbs(
155160
ref={isMenu ? menuRef : undefined}
156161
key={isMenu ? 'menu' : `item-${key}`}
157162
className={b('item', {calculating: isCurrent && !calculated, current: isCurrent})}
163+
data-current={isCurrent ? isCurrent : undefined}
158164
>
159165
{item}
160166
{isCurrent ? null : <BreadcrumbsSeparator separator={props.separator} />}

0 commit comments

Comments
 (0)