@razorpay/blade
Version:
The Design System that powers Razorpay
65 lines (62 loc) • 3.08 kB
JavaScript
import _defineProperty from '@babel/runtime/helpers/defineProperty';
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import React__default from 'react';
import { BreadcrumbContext } from './BreadcrumbContext.js';
import '../Link/BaseLink/index.js';
import '../Typography/index.js';
import '../Box/BaseBox/index.js';
import '../../tokens/global/index.js';
import '../../utils/makeAnalyticsAttribute/index.js';
import { jsxs, jsx } from 'react/jsx-runtime';
import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
import { Text } from '../Typography/Text/Text.js';
import BaseLink from '../Link/BaseLink/BaseLink.js';
import { opacity } from '../../tokens/global/opacity.js';
import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
var _excluded = ["children", "href", "icon", "isCurrentPage", "onClick", "accessibilityLabel"];
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var BreadcrumbItem = function BreadcrumbItem(_ref) {
var children = _ref.children,
href = _ref.href,
Icon = _ref.icon,
isCurrentPage = _ref.isCurrentPage,
onClick = _ref.onClick,
accessibilityLabel = _ref.accessibilityLabel,
rest = _objectWithoutProperties(_ref, _excluded);
var _React$useContext = React__default.useContext(BreadcrumbContext),
color = _React$useContext.color,
size = _React$useContext.size;
if (isCurrentPage) {
var isWhite = color === 'white';
return /*#__PURE__*/jsxs(BaseBox, {
display: "flex",
gap: "spacing.2",
alignItems: "center",
children: [Icon && /*#__PURE__*/jsx(Icon, {
size: size,
color: isWhite ? 'surface.icon.staticWhite.normal' : 'surface.icon.gray.normal'
}), /*#__PURE__*/jsx(Text, {
weight: "medium",
size: size,
color: isWhite ? 'surface.text.staticWhite.normal' : 'surface.text.gray.normal',
children: children
})]
});
}
return /*#__PURE__*/jsx(BaseLink, _objectSpread(_objectSpread({
size: size,
color: color,
opacity: color !== 'primary' ? opacity[700] : 1,
icon: Icon,
href: href,
onClick: onClick,
accessibilityProps: {
label: accessibilityLabel
}
}, makeAnalyticsAttribute(rest)), {}, {
children: children !== null && children !== void 0 ? children : ''
}));
};
export { BreadcrumbItem };
//# sourceMappingURL=BreadcrumbItem.web.js.map