nice-ui
Version:
React design system, components, and utilities
40 lines (39 loc) • 1.55 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.Breadcrumb = void 0;
const React = require("react");
const nano_theme_1 = require("nano-theme");
const Link_1 = require("../../1-inline/Link");
const blockClass = (0, nano_theme_1.drule)({
fz: '15.6px',
bdrad: '0.4em',
lh: '1.4em',
out: 0,
bd: 0,
pd: 0,
mr: 0,
});
const Breadcrumb = ({ noHover, compact, selected, children, ...rest }) => {
const noClick = !rest.to && !rest.onClick;
const style = {
fontSize: compact ? '11px' : '13px',
padding: compact ? '2px 4px' : '4px 8px',
};
const className = blockClass(compact
? {
cur: rest.to ? 'pointer' : 'default',
...(compact ? nano_theme_1.theme.font.ui2.mid : nano_theme_1.theme.font.ui2.bold),
col: selected ? nano_theme_1.theme.blue(0.9) : nano_theme_1.theme.g(0.5),
bg: selected ? nano_theme_1.theme.blue(0.12) : 'transparent',
'&:hover': {
col: noClick ? nano_theme_1.theme.g(0.5) : nano_theme_1.theme.color.sem.positive[1],
bg: noClick ? 'transparent' : nano_theme_1.theme.green(0.12),
},
}
: {});
if (noClick) {
return (React.createElement("span", { className: (rest.className ?? '') + className, style: style }, children));
}
return (React.createElement(Link_1.Link, { ...rest, a: !!rest.to, className: (rest.className ?? '') + className, style: style }, children));
};
exports.Breadcrumb = Breadcrumb;