UNPKG

collaborative-ui

Version:

React component library for building real-time collaborative editing applications.

46 lines (45 loc) 1.94 kB
"use strict"; 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;