collaborative-ui
Version:
React component library for building real-time collaborative editing applications.
46 lines (45 loc) • 1.94 kB
JavaScript
Object.defineProperty(exports, "__esModule", { value: true });
exports.Blogpost = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const Paper_1 = require("nice-ui/lib/4-card/Paper");
const MiniTitle_1 = require("nice-ui/lib/3-list-item/MiniTitle");
const Separator_1 = require("nice-ui/lib/3-list-item/Separator");
const useSelectNode_1 = require("../../hooks/useSelectNode");
const nano_theme_1 = require("nano-theme");
const Title_1 = require("./Title");
const Content_1 = require("./Content");
const PublicToggle_1 = require("./PublicToggle");
const hooks_1 = require("./hooks");
const Tags_1 = require("./Tags");
const css = {
block: (0, nano_theme_1.rule)({
bxz: 'border-box',
w: '100%',
maxW: '400px',
pd: '0 0 16px',
}),
title: (0, nano_theme_1.rule)({
pd: '16px',
bxz: 'border-box',
w: '100%',
}),
};
const Blogpost = ({ model }) => {
const obj = (0, useSelectNode_1.useSelectNode)(model, (s) => s.toApi().asObj());
const arr = (0, hooks_1.useTags)(model);
const title = (0, useSelectNode_1.useSelectNode)(model, (s) => s.title.toApi());
const content = (0, useSelectNode_1.useSelectNode)(model, (s) => s.content.toApi());
if (!obj)
return null;
return (React.createElement(Paper_1.Paper, { className: css.block, fill: 1, round: true },
React.createElement("div", { className: css.title },
React.createElement(MiniTitle_1.MiniTitle, null, "Blog post")),
React.createElement(Separator_1.Separator, null),
!!title && React.createElement(Title_1.Title, { str: title }),
!!content && React.createElement(Content_1.Content, { str: content }),
!!arr && React.createElement(Tags_1.Tags, { arr: arr }),
!!obj && React.createElement(PublicToggle_1.PublicToggle, { obj: obj })));
};
exports.Blogpost = Blogpost;
;