@awsui/components-react
Version:
On July 19th, 2022, we launched [Cloudscape Design System](https://cloudscape.design). Cloudscape is an evolution of AWS-UI. It consists of user interface guidelines, front-end components, design resources, and development tools for building intuitive, en
33 lines • 1.11 kB
JavaScript
export const getEventDetail = (item) => ({
item,
text: item.text,
href: item.href,
});
const MIN_BREADCRUMB_WIDTH = 70;
const ELLIPSIS_WIDTH = 50;
export const getItemsDisplayProperties = (itemsWidths, navWidth) => {
const widthsWithFinalCollapsed = [...itemsWidths];
widthsWithFinalCollapsed[itemsWidths.length - 1] = Math.min(itemsWidths[itemsWidths.length - 1], MIN_BREADCRUMB_WIDTH);
return {
collapsed: computeNumberOfCollapsedItems(widthsWithFinalCollapsed, navWidth),
};
};
const computeNumberOfCollapsedItems = (itemWidths, navWidth) => {
if (typeof navWidth !== 'number') {
return 0;
}
let usedWidth = itemWidths.reduce((acc, width) => acc + width, 0);
let collapsedItems = 0;
while (collapsedItems < itemWidths.length - 1) {
if (usedWidth <= navWidth) {
break;
}
collapsedItems += 1;
usedWidth = usedWidth - itemWidths[collapsedItems];
if (collapsedItems === 1) {
usedWidth += ELLIPSIS_WIDTH;
}
}
return collapsedItems;
};
//# sourceMappingURL=utils.js.map