nice-ui
Version:
React design system, components, and utilities
32 lines (31 loc) • 1.25 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const nano_theme_1 = require("nano-theme");
const React = require("react");
const slugify_1 = require("slugify");
const getText_1 = require("../../../../../markdown/util/getText");
const MdastFlat_1 = require("../../../../../markdown/MdastFlat");
const blockClass = (0, nano_theme_1.rule)({
pad: '8px 0',
fz: '0.93em',
d: 'block',
'& a': {
cursor: 's-resize',
bdb: `1px solid ${nano_theme_1.theme.g(0.9)}`,
'&:hover': {
bdb: `1px solid ${nano_theme_1.theme.g(0.9)}`,
},
},
});
const ContentItem = ({ node, ast, renderers }) => {
const [slug] = React.useState(() => {
const text = (0, getText_1.default)(ast, node.idx, 1024);
const slug = (0, slugify_1.default)(text);
return slug;
});
const paddingLeft = Math.max(0, (node.depth ?? 0) - 2) * 16;
return (React.createElement("div", { className: blockClass, style: { paddingLeft } },
React.createElement("a", { href: '#' + slug },
React.createElement(MdastFlat_1.MdastFlat, { inline: true, inlineChildren: true, ast: ast, renderers: renderers, nodeId: node.idx }))));
};
exports.default = ContentItem;