@clayui/breadcrumb 3.157.0 → 3.158.0

package/package.json

@@ -3,10 +3,10 @@
 		"extends browserslist-config-clay"
 	],
 	"dependencies": {
-		"@clayui/button": "^3.157.0",
-		"@clayui/icon": "^3.157.0",
-		"@clayui/link": "^3.157.0",
-		"@clayui/shared": "^3.157.0",
+		"@clayui/button": "^3.158.0",
+		"@clayui/icon": "^3.158.0",
+		"@clayui/link": "^3.158.0",
+		"@clayui/shared": "^3.158.0",
 		"classnames": "2.3.1",
 		"warning": "^4.0.3"
 	},
@@ -19,10 +19,10 @@
 		"react"
 	],
 	"license": "BSD-3-Clause",
-	"main": "src/index.tsx",
+	"main": "lib/cjs/index.js",
 	"name": "@clayui/breadcrumb",
 	"peerDependencies": {
-		"@clayui/css": "^3.157.0",
+		"@clayui/css": "^3.158.0",
 		"react": "^16.0.0 || ^17.0.0 || ^18.0.0",
 		"react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0"
 	},
@@ -34,5 +34,15 @@
 		"buildTypes": "cross-env NODE_ENV=production tsc --project ./tsconfig.declarations.json",
 		"test": "jest --config ../../jest.config.js"
 	},
-	"version": "3.157.0"
+	"version": "3.158.0",
+	"module": "lib/esm/index.js",
+	"exports": {
+		".": {
+			"types": "./lib/index.d.ts",
+			"import": "./lib/esm/index.js",
+			"require": "./lib/cjs/index.js"
+		}
+	},
+	"types": "lib/index.d.ts",
+	"ts:main": "src/index.tsx"
 }

package/src/index.tsx

@@ -1,138 +0,0 @@
-/**
- * SPDX-FileCopyrightText: (c) 2026 Liferay, Inc. https://liferay.com
- * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
- */
-
-import {ClayButtonWithIcon} from '@clayui/button';
-import classNames from 'classnames';
-import React, {useState} from 'react';
-import warning from 'warning';
-
-import Item from './Item';
-
-type TItem = React.ComponentProps<typeof Item>;
-type TItems = Array<TItem>;
-
-interface IProps extends React.HTMLAttributes<HTMLOListElement> {
-
-	/**
-	 * Defines the aria label of component elements.
-	 */
-	ariaLabels?: {
-		breadcrumb: string;
-		close: string;
-		open: string;
-	};
-
-	/**
-	 * The number of Breadcrumb Items to show on each side of the active Breadcrumb Item before
-	 * using an ellipsis dropdown.
-	 * @deprecated since v3.91.0 - It is no longer necessary.
-	 */
-	ellipsisBuffer?: number;
-
-	/**
-	 * Use this property for defining `otherProps` that will be passed to ellipsis dropdown trigger.
-	 * @deprecated since v3.91.0 - It is no longer necessary.
-	 */
-	ellipsisProps?: Object;
-
-	/**
-	 * Property to define Breadcrumb's items.
-	 */
-	items: Array<React.ComponentProps<typeof Item>>;
-
-	/**
-	 * Path to the location of the spritemap resource.
-	 */
-	spritemap?: string;
-}
-
-function findActiveItems(items: TItems) {
-	return items.filter((item) => {
-		return item.active;
-	});
-}
-
-function Breadcrumb({
-	ariaLabels = {
-		breadcrumb: 'Breadcrumb',
-		close: 'Partially nest breadcrumbs',
-		open: 'See full nested',
-	},
-
-	// eslint-disable-next-line @typescript-eslint/no-unused-vars
-	ellipsisBuffer = 1,
-
-	// eslint-disable-next-line @typescript-eslint/no-unused-vars
-	ellipsisProps = {},
-	className,
-	items,
-	spritemap,
-	...otherProps
-}: IProps) {
-	warning(
-		findActiveItems(items).length === 1,
-		'ClayBreadcrumb expects at least one `active` item on `items`.'
-	);
-	const [collapsed, setCollapsed] = useState(false);
-
-	return (
-		<nav aria-label={ariaLabels.breadcrumb} className="breadcrumb-bar">
-			{items.length > 3 && (
-				<ClayButtonWithIcon
-					aria-expanded={collapsed}
-					aria-label={collapsed ? ariaLabels.close : ariaLabels.open}
-					className="breadcrumb-toggle"
-					displayType={null}
-					onClick={() => setCollapsed(!collapsed)}
-					size="xs"
-					spritemap={spritemap}
-					symbol={
-						collapsed ? 'angle-double-left' : 'angle-double-right'
-					}
-					title={collapsed ? ariaLabels.close : ariaLabels.open}
-				/>
-			)}
-
-			<ol {...otherProps} className={classNames('breadcrumb', className)}>
-				{items.length > 3 && !collapsed ? (
-					<Items
-						items={[
-							items[items.length - 2]!,
-							items[items.length - 1]!,
-						]}
-					/>
-				) : (
-					<Items items={items} />
-				)}
-			</ol>
-		</nav>
-	);
-}
-
-type ItemsProps = {
-	items: TItems;
-};
-
-function Items({items}: ItemsProps) {
-	return (
-		<>
-			{items.map((item: TItem | React.ReactNode, i: number) =>
-				React.isValidElement(item) ? (
-					React.cloneElement(item, {key: `ellipsis${i}`})
-				) : (
-					<Item
-						active={(item as TItem).active}
-						href={(item as TItem).href}
-						key={`breadcrumbItem${i}`}
-						label={(item as TItem).label}
-						onClick={(item as TItem).onClick}
-					/>
-				)
-			)}
-		</>
-	);
-}
-
-export default Breadcrumb;