json-joy
Version:
Collection of libraries for building collaborative editing apps.
28 lines (27 loc) • 1.63 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.FormattingList = void 0;
const tslib_1 = require("tslib");
// biome-ignore lint: lint/style/useImportType
const React = tslib_1.__importStar(require("react"));
const ContextMenu_1 = require("nice-ui/lib/4-card/ContextMenu");
const nano_theme_1 = require("nano-theme");
const FormattingIcon_1 = require("../views/icon/FormattingIcon");
const FormattingList = ({ formattings, onSelect }) => {
if (!formattings.length)
return;
return (React.createElement(ContextMenu_1.ContextPane, { style: { minWidth: 'calc(max(220px, min(360px, 80vw)))' } },
React.createElement(ContextMenu_1.ContextSep, null),
formattings.map((formatting) => {
const { behavior } = formatting;
const data = behavior.data();
const menu = data.menu;
const previewText = data.previewText?.(formatting) || '';
const previewTextFormatted = previewText.length < 20 ? previewText : `${previewText.slice(0, 20)}${nano_theme_1.SYMBOL.ELLIPSIS}`;
return (React.createElement(ContextMenu_1.ContextItem, { inset: true, key: formatting.key(), icon: menu?.icon?.(), right: React.createElement(FormattingIcon_1.FormattingIcon, { formatting: formatting }), onClick: () => onSelect(formatting) },
menu?.name ?? behavior.name,
!!previewTextFormatted && React.createElement("span", { style: { opacity: 0.5 } }, previewTextFormatted)));
}),
React.createElement(ContextMenu_1.ContextSep, null)));
};
exports.FormattingList = FormattingList;