@clayui/breadcrumb 3.48.0 → 3.55.0

package/README.md

@@ -0,0 +1,19 @@
+# `@clayui/breadcrumb`
+
+Breadcrumb is a secondary navigation pattern that identifies the page position inside a hierarchy.
+
+-   [Documentation](https://clayui.com/docs/components/breadcrumb.html)
+-   [Changelog](./CHANGELOG.md)
+-   [Breaking change schedule](./BREAKING.md)
+
+## Install
+
+Run `yarn`
+
+```shell
+yarn add @clayui/breadcrumb
+```
+
+## Contribute
+
+We'd love to get contributions from you! Please, check our [Contributing Guidelines](https://github.com/liferay/clay/blob/master/CONTRIBUTING.md) to see how you can help us improve.

package/lib/Ellipsis.js

@@ -19,18 +19,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -40,18 +28,9 @@ var Ellipsis = function Ellipsis(_ref) {
       spritemap = _ref.spritemap,
       otherProps = _objectWithoutProperties(_ref, _excluded);
 
-  var _React$useState = _react.default.useState(false),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      active = _React$useState2[0],
-      setActive = _React$useState2[1];
-
   return /*#__PURE__*/_react.default.createElement(_dropDown.default, _extends({
-    active: active,
     className: "breadcrumb-item",
     containerElement: "li",
-    onActiveChange: function onActiveChange(newVal) {
-      return setActive(newVal);
-    },
     trigger: /*#__PURE__*/_react.default.createElement(_button.default, {
       className: "breadcrumb-link",
       displayType: "unstyled"

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@clayui/breadcrumb",
-	"version": "3.48.0",
+	"version": "3.55.0",
 	"description": "ClayBreadcrumb component",
 	"license": "BSD-3-Clause",
 	"repository": "https://github.com/liferay/clay",
@@ -27,10 +27,10 @@
 	],
 	"dependencies": {
 		"@clayui/button": "^3.40.0",
-		"@clayui/drop-down": "^3.48.0",
+		"@clayui/drop-down": "^3.55.0",
 		"@clayui/icon": "^3.40.0",
 		"@clayui/link": "^3.45.0",
-		"@clayui/shared": "^3.47.0",
+		"@clayui/shared": "^3.55.0",
 		"classnames": "^2.2.6",
 		"warning": "^4.0.3"
 	},
@@ -42,5 +42,5 @@
 	"browserslist": [
 		"extends browserslist-config-clay"
 	],
-	"gitHead": "332f9f7bb061208704f2ab107a6f4347c97b0292"
+	"gitHead": "5310f4650d453a3659b0bc73a5f098732168c9c1"
 }

package/src/Ellipsis.tsx

@@ -26,41 +26,35 @@ const Ellipsis: React.FunctionComponent<IEllipsisProps> = ({
 	items,
 	spritemap,
 	...otherProps
-}) => {
-	const [active, setActive] = React.useState(false);
-
-	return (
-		<ClayDropDown
-			active={active}
-			className="breadcrumb-item"
-			containerElement="li"
-			onActiveChange={(newVal) => setActive(newVal)}
-			trigger={
-				<ClayButton
-					className="breadcrumb-link"
-					data-testid="breadcrumbDropdownTrigger"
-					displayType="unstyled"
+}) => (
+	<ClayDropDown
+		className="breadcrumb-item"
+		containerElement="li"
+		trigger={
+			<ClayButton
+				className="breadcrumb-link"
+				data-testid="breadcrumbDropdownTrigger"
+				displayType="unstyled"
+			>
+				<ClayIcon spritemap={spritemap} symbol="ellipsis-h" />
+				<ClayIcon spritemap={spritemap} symbol="caret-bottom" />
+			</ClayButton>
+		}
+		{...otherProps}
+	>
+		<ClayDropDown.ItemList>
+			{items.map(({href, label, onClick}, i) => (
+				<ClayDropDown.Item
+					href={href}
+					key={`breadcrumbEllipsisItem${i}`}
+					onClick={onClick}
+					title={label}
 				>
-					<ClayIcon spritemap={spritemap} symbol="ellipsis-h" />
-					<ClayIcon spritemap={spritemap} symbol="caret-bottom" />
-				</ClayButton>
-			}
-			{...otherProps}
-		>
-			<ClayDropDown.ItemList>
-				{items.map(({href, label, onClick}, i) => (
-					<ClayDropDown.Item
-						href={href}
-						key={`breadcrumbEllipsisItem${i}`}
-						onClick={onClick}
-						title={label}
-					>
-						{label}
-					</ClayDropDown.Item>
-				))}
-			</ClayDropDown.ItemList>
-		</ClayDropDown>
-	);
-};
+					{label}
+				</ClayDropDown.Item>
+			))}
+		</ClayDropDown.ItemList>
+	</ClayDropDown>
+);
 
 export default Ellipsis;

package/src/__tests__/__snapshots__/index.tsx.snap

@@ -38,6 +38,7 @@ exports[`ClayBreadcrumb calls callback when an item is clicked 1`] = `
       <button
         class="dropdown-toggle breadcrumb-link btn btn-unstyled"
         data-testid="breadcrumbDropdownTrigger"
+        style=""
         type="button"
       >
         <svg
@@ -116,6 +117,7 @@ exports[`ClayBreadcrumb renders 1`] = `
       <button
         class="dropdown-toggle breadcrumb-link btn btn-unstyled"
         data-testid="breadcrumbDropdownTrigger"
+        style=""
         type="button"
       >
         <svg
@@ -195,6 +197,7 @@ exports[`ClayBreadcrumb renders with properties passed by \`ellipsisProps\` 1`]
       <button
         class="dropdown-toggle breadcrumb-link btn btn-unstyled"
         data-testid="breadcrumbDropdownTrigger"
+        style=""
         type="button"
       >
         <svg

package/README.mdx

@@ -1,12 +0,0 @@
----
-title: 'Breadcrumb'
-description: 'Breadcrumb is a secondary navigation pattern that identifies the page position inside a hierarchy.'
-lexiconDefinition: 'https://liferay.design/lexicon/core-components/navigation/breadcrumb/'
-packageNpm: '@clayui/breadcrumb'
----
-
-import {Breadcrumb} from '$packages/clay-breadcrumb/docs/index';
-
-Breadcrumbs are a navigation aid for your site, use them when you need to provide a quick way to jump back to previously viewed pages or sections.
-
-<Breadcrumb />