json-joy
Version:
Collection of libraries for building collaborative editing apps.
22 lines • 1.35 kB
JavaScript
import * as React from 'react';
import { ContextPane, ContextItem, ContextSep } from 'nice-ui/lib/4-card/ContextMenu';
import { SYMBOL } from 'nano-theme';
import { FormattingIcon } from '../views/icon/FormattingIcon';
export const FormattingList = ({ formattings, onSelect }) => {
if (!formattings.length)
return;
return (React.createElement(ContextPane, { style: { minWidth: 'calc(max(220px, min(360px, 80vw)))' } },
React.createElement(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)}${SYMBOL.ELLIPSIS}`;
return (React.createElement(ContextItem, { inset: true, key: formatting.key(), icon: menu?.icon?.(), right: React.createElement(FormattingIcon, { formatting: formatting }), onClick: () => onSelect(formatting) },
menu?.name ?? behavior.name,
!!previewTextFormatted && React.createElement("span", { style: { opacity: 0.5 } }, previewTextFormatted)));
}),
React.createElement(ContextSep, null)));
};
//# sourceMappingURL=FormattingList.js.map