npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.839 → 3.0.841 - Mend

@cloudscape-design/components-themeable 3.0.839 → 3.0.841

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 (243) hide show

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/styles.scoped.css CHANGED Viewed

@@ -146,7 +146,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_universal-toolbar_1kzri_q9i4f_149:not(#\9) {
+.awsui_universal-toolbar_1kzri_1ewgi_149:not(#\9) {
   background-color: var(--color-background-layout-panel-content-70ws8g, #ffffff);
   box-sizing: border-box;
   padding-block: 0;
@@ -158,22 +158,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   transition-property: inset-block-start, opacity;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_universal-toolbar_1kzri_q9i4f_149:not(#\9) {
+  .awsui_universal-toolbar_1kzri_1ewgi_149:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_universal-toolbar_1kzri_q9i4f_149:not(#\9), .awsui-mode-entering .awsui_universal-toolbar_1kzri_q9i4f_149:not(#\9) {
+.awsui-motion-disabled .awsui_universal-toolbar_1kzri_1ewgi_149:not(#\9), .awsui-mode-entering .awsui_universal-toolbar_1kzri_1ewgi_149:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_universal-toolbar_1kzri_q9i4f_149.awsui_disable-body-scroll_1kzri_q9i4f_170:not(#\9) {
+.awsui_universal-toolbar_1kzri_1ewgi_149.awsui_disable-body-scroll_1kzri_1ewgi_170:not(#\9) {
   inset-block-start: 0px;
 }
-.awsui_universal-toolbar_1kzri_q9i4f_149.awsui_toolbar-hidden_1kzri_q9i4f_173:not(#\9) {
+.awsui_universal-toolbar_1kzri_1ewgi_149.awsui_toolbar-hidden_1kzri_1ewgi_173:not(#\9) {
   opacity: 0;
 }
-.awsui_universal-toolbar_1kzri_q9i4f_149 > .awsui_toolbar-container_1kzri_q9i4f_176:not(#\9) {
+.awsui_universal-toolbar_1kzri_1ewgi_149 > .awsui_toolbar-container_1kzri_1ewgi_176:not(#\9) {
   block-size: 100%;
   align-items: center;
   display: grid;
@@ -182,16 +182,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   grid-template-columns: min-content minmax(0, 3fr) minmax(auto, 1fr);
   grid-template-rows: 1fr;
 }
-.awsui_universal-toolbar_1kzri_q9i4f_149 > .awsui_toolbar-container_1kzri_q9i4f_176 > .awsui_universal-toolbar-nav_1kzri_q9i4f_185:not(#\9) {
+.awsui_universal-toolbar_1kzri_1ewgi_149 > .awsui_toolbar-container_1kzri_1ewgi_176 > .awsui_universal-toolbar-nav_1kzri_1ewgi_185:not(#\9) {
   grid-column: 1;
   padding-inline-end: var(--space-static-xxs-9qxzo2, 4px);
 }
-.awsui_universal-toolbar_1kzri_q9i4f_149 > .awsui_toolbar-container_1kzri_q9i4f_176 > .awsui_universal-toolbar-breadcrumbs_1kzri_q9i4f_189:not(#\9) {
+.awsui_universal-toolbar_1kzri_1ewgi_149 > .awsui_toolbar-container_1kzri_1ewgi_176 > .awsui_universal-toolbar-breadcrumbs_1kzri_1ewgi_189:not(#\9) {
   grid-column: 2;
   background-color: transparent;
   flex: 1 0;
 }
-.awsui_universal-toolbar_1kzri_q9i4f_149 > .awsui_toolbar-container_1kzri_q9i4f_176 > .awsui_universal-toolbar-drawers_1kzri_q9i4f_194:not(#\9) {
+.awsui_universal-toolbar_1kzri_1ewgi_149 > .awsui_toolbar-container_1kzri_1ewgi_176 > .awsui_universal-toolbar-drawers_1kzri_1ewgi_194:not(#\9) {
   grid-column: 3;
   column-gap: var(--space-static-xs-fwcjew, 8px);
   display: flex;
@@ -199,8 +199,8 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   block-size: 100%;
 }
-.awsui_drawers-desktop-triggers-container_1kzri_q9i4f_202:not(#\9),
-.awsui_drawers-mobile-triggers-container_1kzri_q9i4f_203:not(#\9) {
+.awsui_drawers-desktop-triggers-container_1kzri_1ewgi_202:not(#\9),
+.awsui_drawers-mobile-triggers-container_1kzri_1ewgi_203:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -247,7 +247,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inline-size: 100%;
 }
-.awsui_drawers-trigger-content_1kzri_q9i4f_249:not(#\9) {
+.awsui_drawers-trigger-content_1kzri_1ewgi_249:not(#\9) {
   block-size: 100%;
   align-items: center;
   display: flex;
@@ -257,23 +257,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-inline-start: var(--space-xs-6dgkww, 8px);
 }
-.awsui_group-divider_1kzri_q9i4f_259:not(#\9) {
+.awsui_group-divider_1kzri_1ewgi_259:not(#\9) {
   border-inline-end: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-divider-default-u5ytia, #eaeded);
   block-size: 60%;
 }
 @media (max-width: 688px) {
-  .awsui_drawers-trigger_1kzri_q9i4f_249:not(#\9) {
+  .awsui_drawers-trigger_1kzri_1ewgi_249:not(#\9) {
     display: flex;
     justify-content: center;
     align-items: center;
   }
 }
-.awsui_breadcrumbs-own_1kzri_q9i4f_272:not(#\9):not(:empty) + .awsui_breadcrumbs-discovered_1kzri_q9i4f_272 {
-  display: none;
-}
-.awsui_block-body-scroll_1kzri_q9i4f_276:not(#\9) {
+.awsui_block-body-scroll_1kzri_1ewgi_272:not(#\9) {
   overflow: hidden;
 }

package/lib/internal/template/app-layout/visual-refresh-toolbar/toolbar/styles.selectors.js CHANGED Viewed

@@ -2,20 +2,18 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "universal-toolbar": "awsui_universal-toolbar_1kzri_q9i4f_149",
-  "disable-body-scroll": "awsui_disable-body-scroll_1kzri_q9i4f_170",
-  "toolbar-hidden": "awsui_toolbar-hidden_1kzri_q9i4f_173",
-  "toolbar-container": "awsui_toolbar-container_1kzri_q9i4f_176",
-  "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_q9i4f_185",
-  "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_q9i4f_189",
-  "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_q9i4f_194",
-  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_q9i4f_202",
-  "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_q9i4f_203",
-  "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_q9i4f_249",
-  "group-divider": "awsui_group-divider_1kzri_q9i4f_259",
-  "drawers-trigger": "awsui_drawers-trigger_1kzri_q9i4f_249",
-  "breadcrumbs-own": "awsui_breadcrumbs-own_1kzri_q9i4f_272",
-  "breadcrumbs-discovered": "awsui_breadcrumbs-discovered_1kzri_q9i4f_272",
-  "block-body-scroll": "awsui_block-body-scroll_1kzri_q9i4f_276"
+  "universal-toolbar": "awsui_universal-toolbar_1kzri_1ewgi_149",
+  "disable-body-scroll": "awsui_disable-body-scroll_1kzri_1ewgi_170",
+  "toolbar-hidden": "awsui_toolbar-hidden_1kzri_1ewgi_173",
+  "toolbar-container": "awsui_toolbar-container_1kzri_1ewgi_176",
+  "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_1ewgi_185",
+  "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_1ewgi_189",
+  "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_1ewgi_194",
+  "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_1ewgi_202",
+  "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_1ewgi_203",
+  "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_1ewgi_249",
+  "group-divider": "awsui_group-divider_1kzri_1ewgi_259",
+  "drawers-trigger": "awsui_drawers-trigger_1kzri_1ewgi_249",
+  "block-body-scroll": "awsui_block-body-scroll_1kzri_1ewgi_272"
 };

package/lib/internal/template/breadcrumb-group/implementation.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/breadcrumb-group/implementation.tsx"],"names":[],"mappings":";AAuBA,OAAO,EAAE,oBAAoB,EAAyB,4BAA4B,EAAE,MAAM,cAAc,CAAC;~~AA4FzG~~,wBAAgB,6BAA6B,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,EAAE,EAC7G,KAAU,EACV,SAAS,EACT,eAAe,EACf,OAAO,EACP,QAAQ,EACR,iBAAiB,EACjB,kCAAkC,EAClC,GAAG,KAAK,EACT,EAAE,4BAA4B,CAAC,CAAC,CAAC,~~eA2IjC~~;AAED,eAAO,MAAM,+BAA+B,~~qGAA2D~~,CAAC"}
1	+ {"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/breadcrumb-group/implementation.tsx"],"names":[],"mappings":";AAuBA,OAAO,EAAE,oBAAoB,EAAyB,4BAA4B,EAAE,MAAM,cAAc,CAAC;AA6FzG,wBAAgB,6BAA6B,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,EAAE,EAC7G,KAAU,EACV,SAAS,EACT,eAAe,EACf,OAAO,EACP,QAAQ,EACR,iBAAiB,EACjB,kCAAkC,EAClC,GAAG,KAAK,EACT,EAAE,4BAA4B,CAAC,CAAC,CAAC,eAyIjC;AAED,eAAO,MAAM,+BAA+B,qGAG3C,CAAC"}

package/lib/internal/template/breadcrumb-group/implementation.js CHANGED Viewed

@@ -16,6 +16,7 @@ import { useMergeRefs } from '../internal/hooks/use-merge-refs';
 import { checkSafeUrl } from '../internal/utils/check-safe-url';
 import { createWidgetizedComponent } from '../internal/widgets';
 import { BreadcrumbItem } from './item/item';
+import { BreadcrumbGroupSkeleton } from './skeleton';
 import { getEventDetail, getItemsDisplayProperties } from './utils';
 import analyticsSelectors from './analytics-metadata/styles.css.js';
 import styles from './styles.css.js';
@@ -105,13 +106,10 @@ export function BreadcrumbGroupImplementation(_a) {
             },
         };
         return (React.createElement("li", Object.assign({ className: clsx(styles.item, !isDisplayed && styles.hide), key: index }, (isLast ? {} : getAnalyticsMetadataAttribute(clickAnalyticsMetadata)), { style: { flexShrink: shrinkFactors[index], minWidth: `${minWidths[index]}px` }, ref: node => setBreadcrumb('real', `${index}`, node) }),
-            React.createElement(BreadcrumbItem, { item: item, onClick: onClick, onFollow: onFollow, isLast: isLast, isTruncated: itemsWidths.ghost[index] - itemsWidths.real[index] > 0 })));
-    });
-    const hiddenBreadcrumbItems = items.map((item, index) => {
-        const isLast = index === items.length - 1;
-        return (React.createElement("li", { className: styles['ghost-item'], key: index, ref: node => setBreadcrumb('ghost', `${index}`, node) },
-            React.createElement(BreadcrumbItem, { item: item, isLast: isLast, isGhost: true })));
+            React.createElement(BreadcrumbItem, { item: item, onClick: onClick, onFollow: onFollow, itemIndex: index, totalCount: items.length, isTruncated: itemsWidths.ghost[index] - itemsWidths.real[index] > 0 })));
     });
+    const hiddenBreadcrumbItems = items.map((item, index) => (React.createElement("li", { className: styles['ghost-item'], key: index, ref: node => setBreadcrumb('ghost', `${index}`, node) },
+        React.createElement(BreadcrumbItem, { item: item, itemIndex: index, totalCount: items.length, isGhost: true }))));
     const getEventItem = (e) => {
         const { id } = e.detail;
         return items[parseInt(id)];
@@ -142,5 +140,5 @@ export function BreadcrumbGroupImplementation(_a) {
         React.createElement("ol", { className: styles['breadcrumb-group-list'] }, breadcrumbItems),
         React.createElement("ol", { className: clsx(styles['breadcrumb-group-list'], styles.ghost), "aria-hidden": true, tabIndex: -1 }, hiddenBreadcrumbItems)));
 }
-export const createWidgetizedBreadcrumbGroup = createWidgetizedComponent(BreadcrumbGroupImplementation);
+export const createWidgetizedBreadcrumbGroup = createWidgetizedComponent(BreadcrumbGroupImplementation, BreadcrumbGroupSkeleton);
 //# sourceMappingURL=implementation.js.map

package/lib/internal/template/breadcrumb-group/implementation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/implementation.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { getLogicalBoundingClientRect } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { InternalButton } from '../button/internal';\nimport { CustomTriggerProps, LinkItem } from '../button-dropdown/interfaces';\nimport InternalButtonDropdown from '../button-dropdown/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport InternalIcon from '../icon/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireCancelableEvent } from '../internal/events';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport {\n GeneratedAnalyticsMetadataBreadcrumbGroupClick,\n GeneratedAnalyticsMetadataBreadcrumbGroupComponent,\n} from './analytics-metadata/interfaces';\nimport { BreadcrumbGroupProps, EllipsisDropdownProps, InternalBreadcrumbGroupProps } from './interfaces';\nimport { BreadcrumbItem } from './item/item';\nimport { getEventDetail, getItemsDisplayProperties } from './utils';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\n/*\n Provided for backwards compatibility\n */\nconst DEFAULT_EXPAND_ARIA_LABEL = 'Show path';\n\nconst getDropdownTrigger = ({\n ariaLabel,\n triggerRef,\n disabled,\n testUtilsClass,\n isOpen,\n onClick,\n}: CustomTriggerProps) => {\n return (\n <InternalButton\n ref={triggerRef}\n className={testUtilsClass}\n disabled={disabled}\n onClick={event => {\n event.preventDefault();\n onClick();\n }}\n ariaExpanded={isOpen}\n aria-haspopup={true}\n ariaLabel={ariaLabel}\n variant=\"breadcrumb-group\"\n formAction=\"none\"\n >\n ...\n </InternalButton>\n );\n};\n\nconst EllipsisDropdown = ({\n ariaLabel,\n dropdownItems,\n onDropdownItemClick,\n onDropdownItemFollow,\n visible,\n}: EllipsisDropdownProps) => {\n const i18n = useInternalI18n('breadcrumb-group');\n\n return (\n <li className={clsx(styles.ellipsis, visible && styles.visible)}>\n <InternalButtonDropdown\n ariaLabel={i18n('expandAriaLabel', ariaLabel) ?? DEFAULT_EXPAND_ARIA_LABEL}\n items={dropdownItems}\n onItemClick={onDropdownItemClick}\n onItemFollow={onDropdownItemFollow}\n customTriggerBuilder={getDropdownTrigger}\n linkStyle={true}\n analyticsMetadataTransformer={metadata => {\n if (metadata.detail?.id) {\n delete metadata.detail.id;\n }\n if (metadata.detail?.position) {\n metadata.detail.position = `${parseInt(metadata.detail.position as string, 10) + 1}`;\n }\n return metadata;\n }}\n />\n <span className={styles.icon}>\n <InternalIcon name=\"angle-right\" />\n </span>\n </li>\n );\n};\n\ninterface ItemsRefsType {\n ghost: Record<string, HTMLLIElement>;\n real: Record<string, HTMLLIElement>;\n}\n\ninterface ItemsWidthsType {\n ghost: Array<number>;\n real: Array<number>;\n}\n\nconst areArrayEqual = (first: Array<number>, second: Array<number>) => {\n if (first.length !== second.length) {\n return false;\n }\n return first.every((item, index) => item === second[index]);\n};\n\nexport function BreadcrumbGroupImplementation<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>({\n items = [],\n ariaLabel,\n expandAriaLabel,\n onClick,\n onFollow,\n __internalRootRef,\n __injectAnalyticsComponentMetadata,\n ...props\n}: InternalBreadcrumbGroupProps<T>) {\n for (const item of items) {\n checkSafeUrl('BreadcrumbGroup', item.href);\n }\n const baseProps = getBaseProps(props);\n const [navWidth, navRef] = useContainerQuery<number>(rect => rect.borderBoxWidth);\n const mergedRef = useMergeRefs(navRef, __internalRootRef);\n\n const itemsRefs = useRef<ItemsRefsType>({ ghost: {}, real: {} });\n const setBreadcrumb = (type: keyof ItemsRefsType, index: string, node: null \| HTMLLIElement) => {\n if (node) {\n itemsRefs.current[type][index] = node;\n } else {\n delete itemsRefs.current[type][index];\n }\n };\n\n const [itemsWidths, setItemsWidths] = useState<ItemsWidthsType>({ ghost: [], real: [] });\n\n useEffect(() => {\n if (itemsRefs.current) {\n const newItemsWidths: ItemsWidthsType = { ghost: [], real: [] };\n for (const node of Object.values(itemsRefs.current.ghost)) {\n const width = getLogicalBoundingClientRect(node).inlineSize;\n newItemsWidths.ghost.push(width);\n }\n for (const node of Object.values(itemsRefs.current.real)) {\n const width = getLogicalBoundingClientRect(node).inlineSize;\n newItemsWidths.real.push(width);\n }\n setItemsWidths(oldWidths => {\n if (\n !areArrayEqual(newItemsWidths.ghost, oldWidths.ghost) \|\|\n !areArrayEqual(newItemsWidths.real, oldWidths.real)\n ) {\n return newItemsWidths;\n } else {\n return oldWidths;\n }\n });\n }\n }, [items, navWidth]);\n\n const { shrinkFactors, minWidths, collapsed } = getItemsDisplayProperties(itemsWidths.ghost, navWidth);\n\n let breadcrumbItems = items.map((item, index) => {\n const isLast = index === items.length - 1;\n const isDisplayed = index === 0 \|\| index > collapsed;\n\n const clickAnalyticsMetadata: GeneratedAnalyticsMetadataBreadcrumbGroupClick = {\n action: 'click',\n detail: {\n position: `${index + 1}`,\n label: `.${analyticsSelectors['breadcrumb-item']}`,\n href: item.href \|\| '',\n },\n };\n return (\n <li\n className={clsx(styles.item, !isDisplayed && styles.hide)}\n key={index}\n {...(isLast ? {} : getAnalyticsMetadataAttribute(clickAnalyticsMetadata))}\n style={{ flexShrink: shrinkFactors[index], minWidth: `${minWidths[index]}px` }}\n ref={node => setBreadcrumb('real', `${index}`, node)}\n >\n <BreadcrumbItem\n item={item}\n onClick={onClick}\n onFollow={onFollow}\n isLast={isLast}\n isTruncated={itemsWidths.ghost[index] - itemsWidths.real[index] > 0}\n />\n </li>\n );\n });\n\n const hiddenBreadcrumbItems = items.map((item, index) => {\n const isLast = index === items.length - 1;\n return (\n <li className={styles['ghost-item']} key={index} ref={node => setBreadcrumb('ghost', `${index}`, node)}>\n <BreadcrumbItem item={item} isLast={isLast} isGhost={true} />\n </li>\n );\n });\n\n const getEventItem = (e: CustomEvent<{ id: string }>) => {\n const { id } = e.detail;\n return items[parseInt(id)];\n };\n\n // Add ellipsis\n if (breadcrumbItems.length >= 2) {\n const dropdownItems: Array<LinkItem> = items\n .slice(1, 1 + collapsed)\n .map((item: BreadcrumbGroupProps.Item, index: number) => ({\n id: (index + 1).toString(), // the first item doesn't get inside dropdown\n text: item.text,\n href: item.href \|\| '#',\n }));\n\n breadcrumbItems = [\n breadcrumbItems[0],\n <EllipsisDropdown\n key={'ellipsis'}\n visible={collapsed > 0}\n ariaLabel={expandAriaLabel}\n dropdownItems={dropdownItems}\n onDropdownItemClick={e => fireCancelableEvent(onClick, getEventDetail(getEventItem(e)), e)}\n onDropdownItemFollow={e => fireCancelableEvent(onFollow, getEventDetail(getEventItem(e)), e)}\n />,\n ...breadcrumbItems.slice(1),\n ];\n }\n\n const componentAnalyticsMetadata: GeneratedAnalyticsMetadataBreadcrumbGroupComponent = {\n name: 'awsui.BreadcrumbGroup',\n label: { root: 'self' },\n };\n\n return (\n <nav\n {...baseProps}\n className={clsx(styles['breadcrumb-group'], baseProps.className)}\n aria-label={ariaLabel \|\| undefined}\n ref={mergedRef}\n {...(__injectAnalyticsComponentMetadata\n ? {\n ...getAnalyticsMetadataAttribute({\n component: componentAnalyticsMetadata,\n }),\n }\n : {})}\n >\n <ol className={styles['breadcrumb-group-list']}>{breadcrumbItems}</ol>\n <ol className={clsx(styles['breadcrumb-group-list'], styles.ghost)} aria-hidden={true} tabIndex={-1}>\n {hiddenBreadcrumbItems}\n </ol>\n </nav>\n );\n}\n\nexport const createWidgetizedBreadcrumbGroup = createWidgetizedComponent(BreadcrumbGroupImplementation);\n"]}
1	+ {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/implementation.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { getLogicalBoundingClientRect } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { InternalButton } from '../button/internal';\nimport { CustomTriggerProps, LinkItem } from '../button-dropdown/interfaces';\nimport InternalButtonDropdown from '../button-dropdown/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport InternalIcon from '../icon/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireCancelableEvent } from '../internal/events';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { createWidgetizedComponent } from '../internal/widgets';\nimport {\n GeneratedAnalyticsMetadataBreadcrumbGroupClick,\n GeneratedAnalyticsMetadataBreadcrumbGroupComponent,\n} from './analytics-metadata/interfaces';\nimport { BreadcrumbGroupProps, EllipsisDropdownProps, InternalBreadcrumbGroupProps } from './interfaces';\nimport { BreadcrumbItem } from './item/item';\nimport { BreadcrumbGroupSkeleton } from './skeleton';\nimport { getEventDetail, getItemsDisplayProperties } from './utils';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\n/*\n Provided for backwards compatibility\n */\nconst DEFAULT_EXPAND_ARIA_LABEL = 'Show path';\n\nconst getDropdownTrigger = ({\n ariaLabel,\n triggerRef,\n disabled,\n testUtilsClass,\n isOpen,\n onClick,\n}: CustomTriggerProps) => {\n return (\n <InternalButton\n ref={triggerRef}\n className={testUtilsClass}\n disabled={disabled}\n onClick={event => {\n event.preventDefault();\n onClick();\n }}\n ariaExpanded={isOpen}\n aria-haspopup={true}\n ariaLabel={ariaLabel}\n variant=\"breadcrumb-group\"\n formAction=\"none\"\n >\n ...\n </InternalButton>\n );\n};\n\nconst EllipsisDropdown = ({\n ariaLabel,\n dropdownItems,\n onDropdownItemClick,\n onDropdownItemFollow,\n visible,\n}: EllipsisDropdownProps) => {\n const i18n = useInternalI18n('breadcrumb-group');\n\n return (\n <li className={clsx(styles.ellipsis, visible && styles.visible)}>\n <InternalButtonDropdown\n ariaLabel={i18n('expandAriaLabel', ariaLabel) ?? DEFAULT_EXPAND_ARIA_LABEL}\n items={dropdownItems}\n onItemClick={onDropdownItemClick}\n onItemFollow={onDropdownItemFollow}\n customTriggerBuilder={getDropdownTrigger}\n linkStyle={true}\n analyticsMetadataTransformer={metadata => {\n if (metadata.detail?.id) {\n delete metadata.detail.id;\n }\n if (metadata.detail?.position) {\n metadata.detail.position = `${parseInt(metadata.detail.position as string, 10) + 1}`;\n }\n return metadata;\n }}\n />\n <span className={styles.icon}>\n <InternalIcon name=\"angle-right\" />\n </span>\n </li>\n );\n};\n\ninterface ItemsRefsType {\n ghost: Record<string, HTMLLIElement>;\n real: Record<string, HTMLLIElement>;\n}\n\ninterface ItemsWidthsType {\n ghost: Array<number>;\n real: Array<number>;\n}\n\nconst areArrayEqual = (first: Array<number>, second: Array<number>) => {\n if (first.length !== second.length) {\n return false;\n }\n return first.every((item, index) => item === second[index]);\n};\n\nexport function BreadcrumbGroupImplementation<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>({\n items = [],\n ariaLabel,\n expandAriaLabel,\n onClick,\n onFollow,\n __internalRootRef,\n __injectAnalyticsComponentMetadata,\n ...props\n}: InternalBreadcrumbGroupProps<T>) {\n for (const item of items) {\n checkSafeUrl('BreadcrumbGroup', item.href);\n }\n const baseProps = getBaseProps(props);\n const [navWidth, navRef] = useContainerQuery<number>(rect => rect.borderBoxWidth);\n const mergedRef = useMergeRefs(navRef, __internalRootRef);\n\n const itemsRefs = useRef<ItemsRefsType>({ ghost: {}, real: {} });\n const setBreadcrumb = (type: keyof ItemsRefsType, index: string, node: null \| HTMLLIElement) => {\n if (node) {\n itemsRefs.current[type][index] = node;\n } else {\n delete itemsRefs.current[type][index];\n }\n };\n\n const [itemsWidths, setItemsWidths] = useState<ItemsWidthsType>({ ghost: [], real: [] });\n\n useEffect(() => {\n if (itemsRefs.current) {\n const newItemsWidths: ItemsWidthsType = { ghost: [], real: [] };\n for (const node of Object.values(itemsRefs.current.ghost)) {\n const width = getLogicalBoundingClientRect(node).inlineSize;\n newItemsWidths.ghost.push(width);\n }\n for (const node of Object.values(itemsRefs.current.real)) {\n const width = getLogicalBoundingClientRect(node).inlineSize;\n newItemsWidths.real.push(width);\n }\n setItemsWidths(oldWidths => {\n if (\n !areArrayEqual(newItemsWidths.ghost, oldWidths.ghost) \|\|\n !areArrayEqual(newItemsWidths.real, oldWidths.real)\n ) {\n return newItemsWidths;\n } else {\n return oldWidths;\n }\n });\n }\n }, [items, navWidth]);\n\n const { shrinkFactors, minWidths, collapsed } = getItemsDisplayProperties(itemsWidths.ghost, navWidth);\n\n let breadcrumbItems = items.map((item, index) => {\n const isLast = index === items.length - 1;\n const isDisplayed = index === 0 \|\| index > collapsed;\n\n const clickAnalyticsMetadata: GeneratedAnalyticsMetadataBreadcrumbGroupClick = {\n action: 'click',\n detail: {\n position: `${index + 1}`,\n label: `.${analyticsSelectors['breadcrumb-item']}`,\n href: item.href \|\| '',\n },\n };\n return (\n <li\n className={clsx(styles.item, !isDisplayed && styles.hide)}\n key={index}\n {...(isLast ? {} : getAnalyticsMetadataAttribute(clickAnalyticsMetadata))}\n style={{ flexShrink: shrinkFactors[index], minWidth: `${minWidths[index]}px` }}\n ref={node => setBreadcrumb('real', `${index}`, node)}\n >\n <BreadcrumbItem\n item={item}\n onClick={onClick}\n onFollow={onFollow}\n itemIndex={index}\n totalCount={items.length}\n isTruncated={itemsWidths.ghost[index] - itemsWidths.real[index] > 0}\n />\n </li>\n );\n });\n\n const hiddenBreadcrumbItems = items.map((item, index) => (\n <li className={styles['ghost-item']} key={index} ref={node => setBreadcrumb('ghost', `${index}`, node)}>\n <BreadcrumbItem item={item} itemIndex={index} totalCount={items.length} isGhost={true} />\n </li>\n ));\n\n const getEventItem = (e: CustomEvent<{ id: string }>) => {\n const { id } = e.detail;\n return items[parseInt(id)];\n };\n\n // Add ellipsis\n if (breadcrumbItems.length >= 2) {\n const dropdownItems: Array<LinkItem> = items\n .slice(1, 1 + collapsed)\n .map((item: BreadcrumbGroupProps.Item, index: number) => ({\n id: (index + 1).toString(), // the first item doesn't get inside dropdown\n text: item.text,\n href: item.href \|\| '#',\n }));\n\n breadcrumbItems = [\n breadcrumbItems[0],\n <EllipsisDropdown\n key={'ellipsis'}\n visible={collapsed > 0}\n ariaLabel={expandAriaLabel}\n dropdownItems={dropdownItems}\n onDropdownItemClick={e => fireCancelableEvent(onClick, getEventDetail(getEventItem(e)), e)}\n onDropdownItemFollow={e => fireCancelableEvent(onFollow, getEventDetail(getEventItem(e)), e)}\n />,\n ...breadcrumbItems.slice(1),\n ];\n }\n\n const componentAnalyticsMetadata: GeneratedAnalyticsMetadataBreadcrumbGroupComponent = {\n name: 'awsui.BreadcrumbGroup',\n label: { root: 'self' },\n };\n\n return (\n <nav\n {...baseProps}\n className={clsx(styles['breadcrumb-group'], baseProps.className)}\n aria-label={ariaLabel \|\| undefined}\n ref={mergedRef}\n {...(__injectAnalyticsComponentMetadata\n ? {\n ...getAnalyticsMetadataAttribute({\n component: componentAnalyticsMetadata,\n }),\n }\n : {})}\n >\n <ol className={styles['breadcrumb-group-list']}>{breadcrumbItems}</ol>\n <ol className={clsx(styles['breadcrumb-group-list'], styles.ghost)} aria-hidden={true} tabIndex={-1}>\n {hiddenBreadcrumbItems}\n </ol>\n </nav>\n );\n}\n\nexport const createWidgetizedBreadcrumbGroup = createWidgetizedComponent(\n BreadcrumbGroupImplementation,\n BreadcrumbGroupSkeleton\n);\n"]}

package/lib/internal/template/breadcrumb-group/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/breadcrumb-group/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;~~AAGpD~~,OAAO,EAAE,oBAAoB,EAAE,CAAC;AAEhC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,EAAE,EACvG,KAAU,EACV,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,CAAC,eAgBzB"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/breadcrumb-group/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAIpD,OAAO,EAAE,oBAAoB,EAAE,CAAC;AAEhC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,EAAE,EACvG,KAAU,EACV,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,CAAC,eAgBzB"}

package/lib/internal/template/breadcrumb-group/index.js CHANGED Viewed

@@ -6,12 +6,13 @@ import useBaseComponent from '../internal/hooks/use-base-component';
 import { useSetGlobalBreadcrumbs } from '../internal/plugins/helpers/use-global-breadcrumbs';
 import { applyDisplayName } from '../internal/utils/apply-display-name.js';
 import { InternalBreadcrumbGroup } from './internal';
+import { BreadcrumbGroupSkeleton } from './skeleton';
 export default function BreadcrumbGroup(_a) {
     var { items = [] } = _a, props = __rest(_a, ["items"]);
     const registeredGlobally = useSetGlobalBreadcrumbs(Object.assign({ items }, props));
     const baseComponentProps = useBaseComponent('BreadcrumbGroup');
     if (registeredGlobally) {
-        return React.createElement(React.Fragment, null);
+        return React.createElement(BreadcrumbGroupSkeleton, { items: items });
     }
     return (React.createElement(InternalBreadcrumbGroup, Object.assign({ items: items }, props, baseComponentProps, { __injectAnalyticsComponentMetadata: true })));
 }

package/lib/internal/template/breadcrumb-group/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,uBAAuB,EAAE,MAAM,oDAAoD,CAAC;AAC7F,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAE3E,OAAO,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAIrD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAkE,EAG/E;QAH+E,EACvG,KAAK,GAAG,EAAE,OAEc,EADrB,KAAK,cAF+F,SAGxG,CADS;IAER,MAAM,kBAAkB,GAAG,uBAAuB,iBAAG,KAAK,IAAK,KAAK,EAAG,CAAC;IACxE,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,iBAAiB,CAAC,CAAC;IAE/D,IAAI,kBAAkB,EAAE;QACtB,OAAO,~~yCAAK~~,CAAC;~~KACd~~;IAED,OAAO,CACL,oBAAC,uBAAuB,kBACtB,KAAK,EAAE,KAAK,IACR,KAAK,EACL,kBAAkB,IACtB,kCAAkC,EAAE,IAAI,IACxC,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,eAAe,EAAE,iBAAiB,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useSetGlobalBreadcrumbs } from '../internal/plugins/helpers/use-global-breadcrumbs';\nimport { applyDisplayName } from '../internal/utils/apply-display-name.js';\nimport { BreadcrumbGroupProps } from './interfaces';\nimport { InternalBreadcrumbGroup } from './internal';\n\nexport { BreadcrumbGroupProps };\n\nexport default function BreadcrumbGroup<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>({\n items = [],\n ...props\n}: BreadcrumbGroupProps<T>) {\n const registeredGlobally = useSetGlobalBreadcrumbs({ items, ...props });\n const baseComponentProps = useBaseComponent('BreadcrumbGroup');\n\n if (registeredGlobally) {\n return ~~<></>;\~~n }\n\n return (\n <InternalBreadcrumbGroup\n items={items}\n {...props}\n {...baseComponentProps}\n __injectAnalyticsComponentMetadata={true}\n />\n );\n}\n\napplyDisplayName(BreadcrumbGroup, 'BreadcrumbGroup');\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,uBAAuB,EAAE,MAAM,oDAAoD,CAAC;AAC7F,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAE3E,OAAO,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAIrD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAkE,EAG/E;QAH+E,EACvG,KAAK,GAAG,EAAE,OAEc,EADrB,KAAK,cAF+F,SAGxG,CADS;IAER,MAAM,kBAAkB,GAAG,uBAAuB,iBAAG,KAAK,IAAK,KAAK,EAAG,CAAC;IACxE,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,iBAAiB,CAAC,CAAC;IAE/D,IAAI,kBAAkB,EAAE;QACtB,OAAO,oBAAC,uBAAuB,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC;KAClD;IAED,OAAO,CACL,oBAAC,uBAAuB,kBACtB,KAAK,EAAE,KAAK,IACR,KAAK,EACL,kBAAkB,IACtB,kCAAkC,EAAE,IAAI,IACxC,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,eAAe,EAAE,iBAAiB,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useSetGlobalBreadcrumbs } from '../internal/plugins/helpers/use-global-breadcrumbs';\nimport { applyDisplayName } from '../internal/utils/apply-display-name.js';\nimport { BreadcrumbGroupProps } from './interfaces';\nimport { InternalBreadcrumbGroup } from './internal';\nimport { BreadcrumbGroupSkeleton } from './skeleton';\n\nexport { BreadcrumbGroupProps };\n\nexport default function BreadcrumbGroup<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>({\n items = [],\n ...props\n}: BreadcrumbGroupProps<T>) {\n const registeredGlobally = useSetGlobalBreadcrumbs({ items, ...props });\n const baseComponentProps = useBaseComponent('BreadcrumbGroup');\n\n if (registeredGlobally) {\n return <BreadcrumbGroupSkeleton items={items} />;\n }\n\n return (\n <InternalBreadcrumbGroup\n items={items}\n {...props}\n {...baseComponentProps}\n __injectAnalyticsComponentMetadata={true}\n />\n );\n}\n\napplyDisplayName(BreadcrumbGroup, 'BreadcrumbGroup');\n"]}

package/lib/internal/template/breadcrumb-group/interfaces.d.ts CHANGED Viewed

@@ -51,8 +51,9 @@ export type InternalBreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = B
 };
 export interface BreadcrumbItemProps<T extends BreadcrumbGroupProps.Item> {
     item: T;
+    itemIndex: number;
+    totalCount: number;
     isTruncated?: boolean;
-    isLast?: boolean;
     isGhost?: boolean;
     onClick?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;
     onFollow?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;

package/lib/internal/template/breadcrumb-group/interfaces.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/breadcrumb-group/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAClF,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,CACnG,SAAQ,kBAAkB;IAC1B;;;;;;;;;;;OAWG;IACH,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,sBAAsB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IACtE;;;OAGG;IACH,QAAQ,CAAC,EAAE,sBAAsB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;CACxE;AAED,yBAAiB,oBAAoB,CAAC;IACpC,UAAiB,IAAI;QACnB,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACd;IAED,UAAiB,WAAW,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,CAC1F,SAAQ,oBAAoB;QAC5B,IAAI,EAAE,CAAC,CAAC;QACR,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACd;CACF;AAED,MAAM,MAAM,4BAA4B,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,IACtG,oBAAoB,CAAC,CAAC,CAAC,GACrB,0BAA0B,GAAG;IAC3B,kCAAkC,CAAC,EAAE,OAAO,CAAC;CAC9C,CAAC;AAEN,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI;IACtE,IAAI,EAAE,CAAC,CAAC;IACR,~~WAAW~~,CAAC,EAAE,~~OAAO~~,CAAC;~~IACtB~~,~~MAAM~~,CAAC,EAAE,OAAO,CAAC;~~IACjB~~,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,sBAAsB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IACtE,QAAQ,CAAC,EAAE,sBAAsB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;CACxE;AAED,MAAM,WAAW,qBAAqB;IACpC,SAAS,CAAC,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IACpD,aAAa,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACvC,mBAAmB,EAAE,sBAAsB,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5D,oBAAoB,EAAE,sBAAsB,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB"}
1	+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/breadcrumb-group/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAClF,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,CACnG,SAAQ,kBAAkB;IAC1B;;;;;;;;;;;OAWG;IACH,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,sBAAsB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IACtE;;;OAGG;IACH,QAAQ,CAAC,EAAE,sBAAsB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;CACxE;AAED,yBAAiB,oBAAoB,CAAC;IACpC,UAAiB,IAAI;QACnB,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACd;IAED,UAAiB,WAAW,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,CAC1F,SAAQ,oBAAoB;QAC5B,IAAI,EAAE,CAAC,CAAC;QACR,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACd;CACF;AAED,MAAM,MAAM,4BAA4B,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,GAAG,oBAAoB,CAAC,IAAI,IACtG,oBAAoB,CAAC,CAAC,CAAC,GACrB,0BAA0B,GAAG;IAC3B,kCAAkC,CAAC,EAAE,OAAO,CAAC;CAC9C,CAAC;AAEN,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI;IACtE,IAAI,EAAE,CAAC,CAAC;IACR,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,sBAAsB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IACtE,QAAQ,CAAC,EAAE,sBAAsB,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;CACxE;AAED,MAAM,WAAW,qBAAqB;IACpC,SAAS,CAAC,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IACpD,aAAa,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACvC,mBAAmB,EAAE,sBAAsB,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5D,oBAAoB,EAAE,sBAAsB,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7D,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB"}

package/lib/internal/template/breadcrumb-group/interfaces.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { LinkItem } from '../button-dropdown/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { BaseNavigationDetail, CancelableEventHandler } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\nexport interface BreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>\n extends BaseComponentProps {\n /*\n An array of breadcrumb items that describes the link hierarchy for this navigation.\n * Each option has the following properties:\n\n * * `text` (string) - Specifies the title text of the breadcrumb item.\n * * `href` (string) - Specifies the URL for the link in the breadcrumb item.\n * You should specify the link even if you have a click handler for a breadcrumb item\n * to ensure that valid markup is generated.\n\n * Note: The last breadcrumb item is automatically considered the current item, and it's\n * not a link.\n /\n items: ReadonlyArray<T>;\n /\n Provides an `aria-label` to the breadcrumb group that screen readers can read (for accessibility).\n /\n ariaLabel?: string;\n\n /\n Provides an `aria-label` to the ellipsis button that screen readers can read (for accessibility).\n * @i18n\n /\n expandAriaLabel?: string;\n /\n Called when the user clicks on a breadcrumb item.\n /\n onClick?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;\n /\n Called when the user clicks on a breadcrumb item with the left mouse button\n * without pressing modifier keys (that is, CTRL, ALT, SHIFT, META).\n */\n onFollow?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;\n}\n\nexport namespace BreadcrumbGroupProps {\n export interface Item {\n text: string;\n href: string;\n }\n\n export interface ClickDetail<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>\n extends BaseNavigationDetail {\n item: T;\n text: string;\n href: string;\n }\n}\n\nexport type InternalBreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item> =\n BreadcrumbGroupProps<T> &\n InternalBaseComponentProps & {\n __injectAnalyticsComponentMetadata?: boolean;\n };\n\nexport interface BreadcrumbItemProps<T extends BreadcrumbGroupProps.Item> {\n item: T;\n ~~isTruncated?:~~ ~~boolean~~;\n ~~isLast~~?: boolean;\n isGhost?: boolean;\n onClick?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;\n onFollow?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;\n}\n\nexport interface EllipsisDropdownProps {\n ariaLabel?: BreadcrumbGroupProps['expandAriaLabel'];\n dropdownItems: ReadonlyArray<LinkItem>;\n onDropdownItemClick: CancelableEventHandler<{ id: string }>;\n onDropdownItemFollow: CancelableEventHandler<{ id: string }>;\n visible?: boolean;\n}\n"]}
1	+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/breadcrumb-group/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { LinkItem } from '../button-dropdown/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { BaseNavigationDetail, CancelableEventHandler } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\nexport interface BreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>\n extends BaseComponentProps {\n /*\n An array of breadcrumb items that describes the link hierarchy for this navigation.\n * Each option has the following properties:\n\n * * `text` (string) - Specifies the title text of the breadcrumb item.\n * * `href` (string) - Specifies the URL for the link in the breadcrumb item.\n * You should specify the link even if you have a click handler for a breadcrumb item\n * to ensure that valid markup is generated.\n\n * Note: The last breadcrumb item is automatically considered the current item, and it's\n * not a link.\n /\n items: ReadonlyArray<T>;\n /\n Provides an `aria-label` to the breadcrumb group that screen readers can read (for accessibility).\n /\n ariaLabel?: string;\n\n /\n Provides an `aria-label` to the ellipsis button that screen readers can read (for accessibility).\n * @i18n\n /\n expandAriaLabel?: string;\n /\n Called when the user clicks on a breadcrumb item.\n /\n onClick?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;\n /\n Called when the user clicks on a breadcrumb item with the left mouse button\n * without pressing modifier keys (that is, CTRL, ALT, SHIFT, META).\n */\n onFollow?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;\n}\n\nexport namespace BreadcrumbGroupProps {\n export interface Item {\n text: string;\n href: string;\n }\n\n export interface ClickDetail<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item>\n extends BaseNavigationDetail {\n item: T;\n text: string;\n href: string;\n }\n}\n\nexport type InternalBreadcrumbGroupProps<T extends BreadcrumbGroupProps.Item = BreadcrumbGroupProps.Item> =\n BreadcrumbGroupProps<T> &\n InternalBaseComponentProps & {\n __injectAnalyticsComponentMetadata?: boolean;\n };\n\nexport interface BreadcrumbItemProps<T extends BreadcrumbGroupProps.Item> {\n item: T;\n itemIndex: number;\n totalCount: number;\n isTruncated?: boolean;\n isGhost?: boolean;\n onClick?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;\n onFollow?: CancelableEventHandler<BreadcrumbGroupProps.ClickDetail<T>>;\n}\n\nexport interface EllipsisDropdownProps {\n ariaLabel?: BreadcrumbGroupProps['expandAriaLabel'];\n dropdownItems: ReadonlyArray<LinkItem>;\n onDropdownItemClick: CancelableEventHandler<{ id: string }>;\n onDropdownItemFollow: CancelableEventHandler<{ id: string }>;\n visible?: boolean;\n}\n"]}

package/lib/internal/template/breadcrumb-group/item/funnel.d.ts CHANGED Viewed

@@ -1,9 +1,10 @@
 import React from 'react';
 interface FunnelBreadcrumbItemProps {
+    className?: string;
     text: string;
-    last: boolean;
-    hidden?: boolean;
-    ghost?: boolean;
+    itemIndex: number;
+    totalCount: number;
+    disableAnalytics?: boolean;
 }
 export declare const FunnelBreadcrumbItem: React.ForwardRefExoticComponent<FunnelBreadcrumbItemProps & React.RefAttributes<HTMLSpanElement>>;
 export {};

package/lib/internal/template/breadcrumb-group/item/funnel.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"funnel.d.ts","sourceRoot":"","sources":["../../../../src/breadcrumb-group/item/funnel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;~~AAQ1B~~,UAAU,yBAAyB;IACjC,~~IAAI~~,EAAE,MAAM,CAAC;~~IACb~~,IAAI,EAAE,~~OAAO~~,CAAC;~~IACd~~,MAAM,CAAC,EAAE,~~OAAO~~,CAAC;~~IACjB~~,~~KAAK~~,CAAC,EAAE,OAAO,CAAC;~~CACjB~~;AAED,eAAO,MAAM,oBAAoB,~~mGAiBhC~~,CAAC"}
1	+ {"version":3,"file":"funnel.d.ts","sourceRoot":"","sources":["../../../../src/breadcrumb-group/item/funnel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,UAAU,yBAAyB;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,oBAAoB,mGAsBhC,CAAC"}

package/lib/internal/template/breadcrumb-group/item/funnel.js CHANGED Viewed

@@ -2,14 +2,18 @@
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
 import clsx from 'clsx';
-import { DATA_ATTR_FUNNEL_KEY, FUNNEL_KEY_FUNNEL_NAME } from '../../internal/analytics/selectors';
+import { DATA_ATTR_FUNNEL_KEY, DATA_ATTR_RESOURCE_TYPE, FUNNEL_KEY_FUNNEL_NAME, } from '../../internal/analytics/selectors';
 import analyticsSelectors from '../analytics-metadata/styles.css.js';
-import styles from './styles.css.js';
-export const FunnelBreadcrumbItem = React.forwardRef(({ text, hidden, last, ghost }, ref) => {
+export const FunnelBreadcrumbItem = React.forwardRef(({ className, text, itemIndex, totalCount, disableAnalytics }, ref) => {
     const funnelAttributes = {};
-    if (last && !ghost) {
-        funnelAttributes[DATA_ATTR_FUNNEL_KEY] = FUNNEL_KEY_FUNNEL_NAME;
+    if (!disableAnalytics) {
+        if (itemIndex === totalCount - 1) {
+            funnelAttributes[DATA_ATTR_FUNNEL_KEY] = FUNNEL_KEY_FUNNEL_NAME;
+        }
+        if (itemIndex === 1) {
+            funnelAttributes[DATA_ATTR_RESOURCE_TYPE] = 'true';
+        }
     }
-    return (React.createElement("span", Object.assign({}, funnelAttributes, { className: clsx(styles.text, hidden && styles['text-hidden'], !ghost && analyticsSelectors['breadcrumb-item']), ref: ref }), text));
+    return (React.createElement("span", Object.assign({}, funnelAttributes, { className: clsx(className, !disableAnalytics && analyticsSelectors['breadcrumb-item']), ref: ref }), text));
 });
 //# sourceMappingURL=funnel.js.map

package/lib/internal/template/breadcrumb-group/item/funnel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"funnel.js","sourceRoot":"","sources":["../../../../src/breadcrumb-group/item/funnel.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,~~EAAE~~,oBAAoB,~~EAAE~~,sBAAsB,~~EAAE~~,MAAM,oCAAoC,CAAC;~~AAElG~~,OAAO,kBAAkB,MAAM,qCAAqC,CAAC;~~AACrE~~,~~OAAO,~~MAAM,~~MAAM,iBAAiB,~~CAAC~~;AASrC~~,MAAM,~~CAAC,MAAM,~~oBAAoB,GAAG,KAAK,CAAC,UAAU,CAClD,CAAC,EAAE,IAAI,EAAE,~~MAAM~~,EAAE,~~IAAI~~,EAAE,~~KAAK~~,EAAE,EAAE,GAAG,EAAE,EAAE;~~IACrC~~,MAAM,gBAAgB,GAA2B,EAAE,CAAC;IACpD,IAAI,~~IAAI~~,IAAI,~~CAAC~~,KAAK,EAAE;~~QAClB~~,gBAAgB,CAAC,oBAAoB,CAAC,GAAG,sBAAsB,CAAC;~~KACjE~~;~~IAED~~,~~OAAO~~,~~CACL~~,~~8CACM~~,~~gBAAgB~~,~~IACpB~~,~~SAAS~~,~~EAAE~~,~~IAAI~~,CAAC,MAAM,CAAC,~~IAAI~~,~~EAAE~~,~~MAAM~~,~~IAAI~~,~~MAAM~~,~~CAAC~~,~~aAAa~~,CAAC,EAAE,CAAC,~~KAAK~~,IAAI,kBAAkB,CAAC,iBAAiB,CAAC,CAAC,~~EAC9G~~,GAAG,EAAE,GAAG,KAEP,IAAI,CACA,CACR,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { DATA_ATTR_FUNNEL_KEY, FUNNEL_KEY_FUNNEL_NAME } from '../../internal/analytics/selectors';\n\nimport analyticsSelectors from '../analytics-metadata/styles.css.js';\~~nimport styles from './styles.css.js';\~~n\ninterface FunnelBreadcrumbItemProps {\n text: string;\n ~~last~~: ~~boolean~~;\n ~~hidden?:~~ ~~boolean~~;\n ~~ghost~~?: boolean;\n}\n\nexport const FunnelBreadcrumbItem = React.forwardRef<HTMLSpanElement, FunnelBreadcrumbItemProps>(\n ({ text, ~~hidden~~, ~~last~~, ~~ghost~~ }, ref) => {\n const funnelAttributes: Record<string, string> = {};\n if (~~last~~ && ~~!ghost~~) {\n funnelAttributes[DATA_ATTR_FUNNEL_KEY] = FUNNEL_KEY_FUNNEL_NAME;\n }\n\n return (\n <span\n {...funnelAttributes}\n className={clsx(~~styles.text~~, ~~hidden && styles['text-hidden'],~~ !~~ghost~~ && analyticsSelectors['breadcrumb-item'])}\n ref={ref}\n >\n {text}\n </span>\n );\n }\n);\n"]}
1	+ {"version":3,"file":"funnel.js","sourceRoot":"","sources":["../../../../src/breadcrumb-group/item/funnel.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EACL,oBAAoB,EACpB,uBAAuB,EACvB,sBAAsB,GACvB,MAAM,oCAAoC,CAAC;AAE5C,OAAO,kBAAkB,MAAM,qCAAqC,CAAC;AAUrE,MAAM,CAAC,MAAM,oBAAoB,GAAG,KAAK,CAAC,UAAU,CAClD,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,UAAU,EAAE,gBAAgB,EAAE,EAAE,GAAG,EAAE,EAAE;IACpE,MAAM,gBAAgB,GAA2B,EAAE,CAAC;IACpD,IAAI,CAAC,gBAAgB,EAAE;QACrB,IAAI,SAAS,KAAK,UAAU,GAAG,CAAC,EAAE;YAChC,gBAAgB,CAAC,oBAAoB,CAAC,GAAG,sBAAsB,CAAC;SACjE;QACD,IAAI,SAAS,KAAK,CAAC,EAAE;YACnB,gBAAgB,CAAC,uBAAuB,CAAC,GAAG,MAAM,CAAC;SACpD;KACF;IAED,OAAO,CACL,8CACM,gBAAgB,IACpB,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC,gBAAgB,IAAI,kBAAkB,CAAC,iBAAiB,CAAC,CAAC,EACtF,GAAG,EAAE,GAAG,KAEP,IAAI,CACA,CACR,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport {\n DATA_ATTR_FUNNEL_KEY,\n DATA_ATTR_RESOURCE_TYPE,\n FUNNEL_KEY_FUNNEL_NAME,\n} from '../../internal/analytics/selectors';\n\nimport analyticsSelectors from '../analytics-metadata/styles.css.js';\n\ninterface FunnelBreadcrumbItemProps {\n className?: string;\n text: string;\n itemIndex: number;\n totalCount: number;\n disableAnalytics?: boolean;\n}\n\nexport const FunnelBreadcrumbItem = React.forwardRef<HTMLSpanElement, FunnelBreadcrumbItemProps>(\n ({ className, text, itemIndex, totalCount, disableAnalytics }, ref) => {\n const funnelAttributes: Record<string, string> = {};\n if (!disableAnalytics) {\n if (itemIndex === totalCount - 1) {\n funnelAttributes[DATA_ATTR_FUNNEL_KEY] = FUNNEL_KEY_FUNNEL_NAME;\n }\n if (itemIndex === 1) {\n funnelAttributes[DATA_ATTR_RESOURCE_TYPE] = 'true';\n }\n }\n\n return (\n <span\n {...funnelAttributes}\n className={clsx(className, !disableAnalytics && analyticsSelectors['breadcrumb-item'])}\n ref={ref}\n >\n {text}\n </span>\n );\n }\n);\n"]}

package/lib/internal/template/breadcrumb-group/item/item.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { BreadcrumbGroupProps, BreadcrumbItemProps } from '../interfaces';
-export declare function BreadcrumbItem<T extends BreadcrumbGroupProps.Item>({ item, onClick, onFollow, isLast, isGhost, isTruncated, }: BreadcrumbItemProps<T>): JSX.Element;
+export declare function BreadcrumbItem<T extends BreadcrumbGroupProps.Item>({ item, itemIndex, totalCount, onClick, onFollow, isGhost, isTruncated, }: BreadcrumbItemProps<T>): JSX.Element;
 //# sourceMappingURL=item.d.ts.map

package/lib/internal/template/breadcrumb-group/item/item.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../../src/breadcrumb-group/item/item.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;~~AAkE1E~~,wBAAgB,cAAc,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,EAAE,EAClE,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,~~MAAc,EACd,~~OAAe,EACf,WAAmB,GACpB,EAAE,mBAAmB,CAAC,CAAC,CAAC,~~eAiCxB~~"}
1	+ {"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../../src/breadcrumb-group/item/item.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAuE1E,wBAAgB,cAAc,CAAC,CAAC,SAAS,oBAAoB,CAAC,IAAI,EAAE,EAClE,IAAI,EACJ,SAAS,EACT,UAAU,EACV,OAAO,EACP,QAAQ,EACR,OAAe,EACf,WAAmB,GACpB,EAAE,mBAAmB,CAAC,CAAC,CAAC,eA8CxB"}

package/lib/internal/template/breadcrumb-group/item/item.js CHANGED Viewed

@@ -10,7 +10,7 @@ import { fireCancelableEvent, isPlainLeftClick } from '../../internal/events';
 import { getEventDetail } from '../utils';
 import { FunnelBreadcrumbItem } from './funnel';
 import styles from './styles.css.js';
-const BreadcrumbItemWithPopover = ({ item, isLast, anchorAttributes, }) => {
+const BreadcrumbItemWithPopover = ({ item, isLast, anchorAttributes, children, }) => {
     const [showPopover, setShowPopover] = useState(false);
     const textRef = useRef(null);
     const popoverContent = React.createElement(Tooltip, { trackRef: textRef, value: item.text, size: "medium" });
@@ -22,19 +22,19 @@ const BreadcrumbItemWithPopover = ({ item, isLast, anchorAttributes, }) => {
         }
     }, [showPopover]);
     return (React.createElement(React.Fragment, null,
-        React.createElement(Item, Object.assign({ isLast: isLast, onFocus: () => {
+        React.createElement(Item, Object.assign({ ref: textRef, isLast: isLast, onFocus: () => {
                 setShowPopover(true);
             }, onBlur: () => setShowPopover(false), onMouseEnter: () => {
                 setShowPopover(true);
-            }, onMouseLeave: () => setShowPopover(false), anchorAttributes: anchorAttributes }, (isLast ? { tabIndex: 0 } : {})),
-            React.createElement(FunnelBreadcrumbItem, { ref: textRef, text: item.text, last: isLast })),
+            }, onMouseLeave: () => setShowPopover(false), anchorAttributes: anchorAttributes }, (isLast ? { tabIndex: 0 } : {})), children),
         showPopover && popoverContent));
 };
-const Item = (_a) => {
+const Item = React.forwardRef((_a, ref) => {
     var { anchorAttributes, children, isLast } = _a, itemAttributes = __rest(_a, ["anchorAttributes", "children", "isLast"]);
-    return isLast ? (React.createElement("span", Object.assign({ className: styles.anchor }, itemAttributes), children)) : (React.createElement("a", Object.assign({ className: styles.anchor }, itemAttributes, anchorAttributes), children));
-};
-export function BreadcrumbItem({ item, onClick, onFollow, isLast = false, isGhost = false, isTruncated = false, }) {
+    return isLast ? (React.createElement("span", Object.assign({ ref: ref, className: styles.anchor }, itemAttributes), children)) : (React.createElement("a", Object.assign({ ref: ref, className: styles.anchor }, itemAttributes, anchorAttributes), children));
+});
+export function BreadcrumbItem({ item, itemIndex, totalCount, onClick, onFollow, isGhost = false, isTruncated = false, }) {
+    const isLast = itemIndex === totalCount - 1;
     const preventDefault = (event) => event.preventDefault();
     const onClickHandler = (event) => {
         if (isPlainLeftClick(event)) {
@@ -49,9 +49,9 @@ export function BreadcrumbItem({ item, onClick, onFollow, isLast = false, isGhos
     if (isGhost) {
         anchorAttributes.tabIndex = -1;
     }
+    const breadcrumbItem = (React.createElement(FunnelBreadcrumbItem, { className: styles.text, itemIndex: itemIndex, totalCount: totalCount, text: item.text, disableAnalytics: isGhost }));
     return (React.createElement("div", { className: clsx(!isGhost && styles.breadcrumb, isGhost && styles['ghost-breadcrumb'], isLast && styles.last) },
-        isTruncated && !isGhost ? (React.createElement(BreadcrumbItemWithPopover, { item: item, isLast: isLast, anchorAttributes: anchorAttributes })) : (React.createElement(Item, { isLast: isLast, anchorAttributes: anchorAttributes },
-            React.createElement(FunnelBreadcrumbItem, { text: item.text, last: isLast, ghost: isGhost }))),
+        isTruncated && !isGhost ? (React.createElement(BreadcrumbItemWithPopover, { item: item, isLast: isLast, anchorAttributes: anchorAttributes }, breadcrumbItem)) : (React.createElement(Item, { isLast: isLast, anchorAttributes: anchorAttributes }, breadcrumbItem)),
         !isLast ? (React.createElement("span", { className: styles.icon },
             React.createElement(InternalIcon, { name: "angle-right" }))) : null));
 }

package/lib/internal/template/breadcrumb-group/item/item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"item.js","sourceRoot":"","sources":["../../../../src/breadcrumb-group/item/item.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,YAAY,MAAM,qBAAqB,CAAC;AAC/C,OAAO,OAAO,MAAM,mCAAmC,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,4CAA4C,CAAC;AAC7E,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAE9E,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAEhD,OAAO,MAAM,MAAM,iBAAiB,CAAC;~~AAQrC~~,MAAM,yBAAyB,GAAG,CAAsC,EACtE,IAAI,EACJ,MAAM,EACN,gBAAgB,~~GACkB~~,EAAE,EAAE;IACtC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,OAAO,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAC1C,MAAM,cAAc,GAAG,oBAAC,OAAO,IAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,QAAQ,GAAG,CAAC;IAEtF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,WAAW,EAAE;YACf,OAAO,eAAe,CAAC,GAAG,EAAE;gBAC1B,cAAc,CAAC,KAAK,CAAC,CAAC;YACxB,CAAC,CAAC,CAAC;SACJ;IACH,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,OAAO,CACL;QACE,oBAAC,IAAI,kBACH,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE;gBACZ,cAAc,CAAC,IAAI,CAAC,CAAC;YACvB,CAAC,EACD,MAAM,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,EACnC,YAAY,EAAE,GAAG,EAAE;gBACjB,cAAc,CAAC,IAAI,CAAC,CAAC;YACvB,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,EACzC,gBAAgB,EAAE,gBAAgB,IAC9B,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC~~;YAEnC~~,~~oBAAC~~,~~oBAAoB~~,~~IAAC,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,GAAI,CAChE~~;QACN,WAAW,IAAI,cAAc,CAC7B,CACJ,CAAC;AACJ,CAAC,CAAC;AAMF,MAAM,IAAI,GAAG,CAAC,~~EAAoE~~,EAAE,EAAE;~~QAAxE~~,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,~~OAAgC~~,~~EAA3B~~,cAAc,cAAvD,0CAAyD,CAAF;~~IACnE~~,OAAA,MAAM,CAAC,CAAC,CAAC,CACP,4CAAM,SAAS,EAAE,MAAM,CAAC,MAAM,IAAM,cAAc,~~GAC/C~~,QAAQ,CACJ,CACR,CAAC,CAAC,CAAC,CACF,yCAAG,SAAS,EAAE,MAAM,CAAC,MAAM,IAAM,cAAc,EAAM,gBAAgB,~~GAClE~~,QAAQ,CACP,CACL,CAAA;CAAA,CAAC;~~AAEJ~~,MAAM,UAAU,cAAc,CAAsC,EAClE,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,~~MAAM~~,GAAG,KAAK,~~EACd~~,~~OAAO~~,GAAG,KAAK,~~EACf~~,~~WAAW~~,GAAG,KAAK,~~GACI~~;~~IACvB~~,MAAM,cAAc,GAAG,CAAC,KAAuB,EAAE,EAAE,CAAC,KAAK,CAAC,cAAc,EAAE,CAAC;IAC3E,MAAM,cAAc,GAAG,CAAC,KAAuB,EAAE,EAAE;QACjD,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE;YAC3B,mBAAmB,CAAC,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,CAAC;SAC5D;QACD,mBAAmB,CAAC,OAAO,EAAE,cAAc,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,CAAC;IAC5D,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAkD;QACtE,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,GAAG;QACtB,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc;KAClD,CAAC;IACF,IAAI,OAAO,EAAE;QACX,gBAAgB,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;KAChC;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,IAAI,CAAC,CAAC,OAAO,IAAI,MAAM,CAAC,UAAU,EAAE,OAAO,IAAI,MAAM,CAAC,kBAAkB,CAAC,EAAE,MAAM,IAAI,MAAM,CAAC,IAAI,CAAC;QAC9G,WAAW,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACzB,oBAAC,yBAAyB,IAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,gBAAgB,~~GAAI~~,~~CAC9F~~,CAAC,CAAC,CAAC,CACF,oBAAC,IAAI,IAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,gBAAgB~~;YACtD~~,~~oBAAC~~,~~oBAAoB~~,~~IAAC~~,~~IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,GAAI,CAClE,~~CACR;QACA,CAAC,MAAM,CAAC,CAAC,CAAC,CACT,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI;YAC1B,oBAAC,YAAY,IAAC,IAAI,EAAC,aAAa,GAAG,CAC9B,CACR,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport InternalIcon from '../../icon/internal';\nimport Tooltip from '../../internal/components/tooltip';\nimport { registerTooltip } from '../../internal/components/tooltip/registry';\nimport { fireCancelableEvent, isPlainLeftClick } from '../../internal/events';\nimport { BreadcrumbGroupProps, BreadcrumbItemProps } from '../interfaces';\nimport { getEventDetail } from '../utils';\nimport { FunnelBreadcrumbItem } from './funnel';\n\nimport styles from './styles.css.js';\n\ninterface BreadcrumbItemWithPopoverProps<T extends BreadcrumbGroupProps.Item> {\n item: T;\n isLast: boolean;\n anchorAttributes: React.AnchorHTMLAttributes<HTMLAnchorElement>;\n}\n\nconst BreadcrumbItemWithPopover = <T extends BreadcrumbGroupProps.Item>({\n item,\n isLast,\n anchorAttributes,\n}: BreadcrumbItemWithPopoverProps<T>) => {\n const [showPopover, setShowPopover] = useState(false);\n const textRef = useRef<HTMLElement>(null);\n const popoverContent = <Tooltip trackRef={textRef} value={item.text} size=\"medium\" />;\n\n useEffect(() => {\n if (showPopover) {\n return registerTooltip(() => {\n setShowPopover(false);\n });\n }\n }, [showPopover]);\n\n return (\n <>\n <Item\n isLast={isLast}\n onFocus={() => {\n setShowPopover(true);\n }}\n onBlur={() => setShowPopover(false)}\n onMouseEnter={() => {\n setShowPopover(true);\n }}\n onMouseLeave={() => setShowPopover(false)}\n anchorAttributes={anchorAttributes}\n {...(isLast ? { tabIndex: 0 } : {})}\n >\n ~~<FunnelBreadcrumbItem ref=~~{~~textRef~~} ~~text={item.text} last={isLast} />\~~n </Item>\n {showPopover && popoverContent}\n </>\n );\n};\n\ntype ItemProps = React.HTMLAttributes<HTMLElement> & {\n anchorAttributes: React.AnchorHTMLAttributes<HTMLAnchorElement>;\n isLast: boolean;\n};\nconst Item = ({ anchorAttributes, children, isLast, ...itemAttributes }: ~~ItemProps~~) =>\n isLast ? (\n <span className={styles.anchor} {...itemAttributes}>\n {children}\n </span>\n ) : (\n <a className={styles.anchor} {...itemAttributes} {...anchorAttributes}>\n {children}\n </a>\n );\n\nexport function BreadcrumbItem<T extends BreadcrumbGroupProps.Item>({\n item,\n ~~onClick~~,\n ~~onFollow~~,\n ~~isLast = false~~,\n isGhost = false,\n isTruncated = false,\n}: BreadcrumbItemProps<T>) {\n const preventDefault = (event: React.MouseEvent) => event.preventDefault();\n const onClickHandler = (event: React.MouseEvent) => {\n if (isPlainLeftClick(event)) {\n fireCancelableEvent(onFollow, getEventDetail(item), event);\n }\n fireCancelableEvent(onClick, getEventDetail(item), event);\n };\n\n const anchorAttributes: React.AnchorHTMLAttributes<HTMLAnchorElement> = {\n href: item.href \|\| '#',\n onClick: isLast ? preventDefault : onClickHandler,\n };\n if (isGhost) {\n anchorAttributes.tabIndex = -1;\n }\n\n return (\n <div className={clsx(!isGhost && styles.breadcrumb, isGhost && styles['ghost-breadcrumb'], isLast && styles.last)}>\n {isTruncated && !isGhost ? (\n <BreadcrumbItemWithPopover item={item} isLast={isLast} anchorAttributes={anchorAttributes} ~~/>\~~n ) : (\n <Item isLast={isLast} anchorAttributes={anchorAttributes}>\n ~~<FunnelBreadcrumbItem text=~~{~~item.text~~} ~~last={isLast} ghost={isGhost} />\~~n </Item>\n )}\n {!isLast ? (\n <span className={styles.icon}>\n <InternalIcon name=\"angle-right\" />\n </span>\n ) : null}\n </div>\n );\n}\n"]}
1	+ {"version":3,"file":"item.js","sourceRoot":"","sources":["../../../../src/breadcrumb-group/item/item.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport InternalIcon from '../../icon/internal';\nimport Tooltip from '../../internal/components/tooltip';\nimport { registerTooltip } from '../../internal/components/tooltip/registry';\nimport { fireCancelableEvent, isPlainLeftClick } from '../../internal/events';\nimport { BreadcrumbGroupProps, BreadcrumbItemProps } from '../interfaces';\nimport { getEventDetail } from '../utils';\nimport { FunnelBreadcrumbItem } from './funnel';\n\nimport styles from './styles.css.js';\n\ninterface BreadcrumbItemWithPopoverProps<T extends BreadcrumbGroupProps.Item> {\n item: T;\n isLast: boolean;\n anchorAttributes: React.AnchorHTMLAttributes<HTMLAnchorElement>;\n children: React.ReactNode;\n}\n\nconst BreadcrumbItemWithPopover = <T extends BreadcrumbGroupProps.Item>({\n item,\n isLast,\n anchorAttributes,\n children,\n}: BreadcrumbItemWithPopoverProps<T>) => {\n const [showPopover, setShowPopover] = useState(false);\n const textRef = useRef<HTMLElement>(null);\n const popoverContent = <Tooltip trackRef={textRef} value={item.text} size=\"medium\" />;\n\n useEffect(() => {\n if (showPopover) {\n return registerTooltip(() => {\n setShowPopover(false);\n });\n }\n }, [showPopover]);\n\n return (\n <>\n <Item\n ref={textRef}\n isLast={isLast}\n onFocus={() => {\n setShowPopover(true);\n }}\n onBlur={() => setShowPopover(false)}\n onMouseEnter={() => {\n setShowPopover(true);\n }}\n onMouseLeave={() => setShowPopover(false)}\n anchorAttributes={anchorAttributes}\n {...(isLast ? { tabIndex: 0 } : {})}\n >\n {children}\n </Item>\n {showPopover && popoverContent}\n </>\n );\n};\n\ntype ItemProps = React.HTMLAttributes<HTMLElement> & {\n anchorAttributes: React.AnchorHTMLAttributes<HTMLAnchorElement>;\n isLast: boolean;\n};\nconst Item = React.forwardRef<HTMLElement, ItemProps>(\n ({ anchorAttributes, children, isLast, ...itemAttributes }, ref) =>\n isLast ? (\n <span ref={ref} className={styles.anchor} {...itemAttributes}>\n {children}\n </span>\n ) : (\n <a ref={ref as React.Ref<HTMLAnchorElement>} className={styles.anchor} {...itemAttributes} {...anchorAttributes}>\n {children}\n </a>\n )\n);\n\nexport function BreadcrumbItem<T extends BreadcrumbGroupProps.Item>({\n item,\n itemIndex,\n totalCount,\n onClick,\n onFollow,\n isGhost = false,\n isTruncated = false,\n}: BreadcrumbItemProps<T>) {\n const isLast = itemIndex === totalCount - 1;\n const preventDefault = (event: React.MouseEvent) => event.preventDefault();\n const onClickHandler = (event: React.MouseEvent) => {\n if (isPlainLeftClick(event)) {\n fireCancelableEvent(onFollow, getEventDetail(item), event);\n }\n fireCancelableEvent(onClick, getEventDetail(item), event);\n };\n\n const anchorAttributes: React.AnchorHTMLAttributes<HTMLAnchorElement> = {\n href: item.href \|\| '#',\n onClick: isLast ? preventDefault : onClickHandler,\n };\n if (isGhost) {\n anchorAttributes.tabIndex = -1;\n }\n\n const breadcrumbItem = (\n <FunnelBreadcrumbItem\n className={styles.text}\n itemIndex={itemIndex}\n totalCount={totalCount}\n text={item.text}\n disableAnalytics={isGhost}\n />\n );\n\n return (\n <div className={clsx(!isGhost && styles.breadcrumb, isGhost && styles['ghost-breadcrumb'], isLast && styles.last)}>\n {isTruncated && !isGhost ? (\n <BreadcrumbItemWithPopover item={item} isLast={isLast} anchorAttributes={anchorAttributes}>\n {breadcrumbItem}\n </BreadcrumbItemWithPopover>\n ) : (\n <Item isLast={isLast} anchorAttributes={anchorAttributes}>\n {breadcrumbItem}\n </Item>\n )}\n {!isLast ? (\n <span className={styles.icon}>\n <InternalIcon name=\"angle-right\" />\n </span>\n ) : null}\n </div>\n );\n}\n"]}

package/lib/internal/template/breadcrumb-group/item/styles.css.js CHANGED Viewed

@@ -1,13 +1,12 @@
     import './styles.scoped.css';
     export default {
-  "link": "awsui_link_1kosq_co5oc_141",
-  "breadcrumb": "awsui_breadcrumb_1kosq_co5oc_145",
-  "ghost-breadcrumb": "awsui_ghost-breadcrumb_1kosq_co5oc_146",
-  "icon": "awsui_icon_1kosq_co5oc_149",
-  "anchor": "awsui_anchor_1kosq_co5oc_155",
-  "text": "awsui_text_1kosq_co5oc_202",
-  "last": "awsui_last_1kosq_co5oc_221",
-  "text-hidden": "awsui_text-hidden_1kosq_co5oc_233"
+  "link": "awsui_link_1kosq_idgry_141",
+  "breadcrumb": "awsui_breadcrumb_1kosq_idgry_145",
+  "ghost-breadcrumb": "awsui_ghost-breadcrumb_1kosq_idgry_146",
+  "icon": "awsui_icon_1kosq_idgry_149",
+  "anchor": "awsui_anchor_1kosq_idgry_155",
+  "text": "awsui_text_1kosq_idgry_202",
+  "last": "awsui_last_1kosq_idgry_221"
 };