json-joy
Version:
Collection of libraries for building collaborative editing apps.
602 lines (601 loc) • 26.7 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.inlineText = exports.secondBrain = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const Sidetip_1 = require("nice-ui/lib/1-inline/Sidetip");
const Code_1 = require("nice-ui/lib/1-inline/Code");
const Iconista_1 = require("nice-ui/lib/icons/Iconista");
const FontStyleButton_1 = require("nice-ui/lib/2-inline-block/FontStyleButton");
const secondBrain = () => {
return {
sepBefore: true,
name: 'Second brain',
display: () => (React.createElement(React.Fragment, null,
React.createElement("span", { style: { color: 'purple' } }, "Second brain"))),
right: () => React.createElement(Sidetip_1.Sidetip, { small: true }, 'AI'),
icon: () => React.createElement(Iconista_1.Iconista, { style: { color: 'purple' }, width: 16, height: 16, set: "tabler", icon: "brain" }),
children: [
{
name: 'Ask question',
},
{
name: 'Action',
children: [
{
name: 'Make shorter',
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "viewport-short" }),
onSelect: () => { },
},
{
name: 'Make longer',
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "viewport-tall" }),
onSelect: () => { },
},
{ name: 'Add humor' },
{ name: 'Make more professional' },
{ name: 'Make it: ...' },
],
},
{
name: 'Translate',
children: [
{
name: 'Afrikaans',
onSelect: () => { },
},
{
name: 'Arabic',
onSelect: () => { },
},
{
name: 'Bengali',
onSelect: () => { },
},
{
name: 'Bulgarian',
onSelect: () => { },
},
{
name: 'Catalan',
onSelect: () => { },
},
{
name: 'Cantonese',
onSelect: () => { },
},
{
name: 'Croatian',
onSelect: () => { },
},
{
name: 'Czech',
onSelect: () => { },
},
{
name: 'Danish',
onSelect: () => { },
},
{
name: 'Dutch',
onSelect: () => { },
},
{
name: 'Lithuanian',
onSelect: () => { },
},
{
name: 'Malay',
onSelect: () => { },
},
{
name: 'Malayalam',
onSelect: () => { },
},
{
name: 'Panjabi',
onSelect: () => { },
},
{
name: 'Tamil',
onSelect: () => { },
},
{
name: 'English',
onSelect: () => { },
},
{
name: 'Finnish',
onSelect: () => { },
},
{
name: 'French',
onSelect: () => { },
},
{
name: 'German',
onSelect: () => { },
},
{
name: 'Greek',
onSelect: () => { },
},
{
name: 'Hebrew',
onSelect: () => { },
},
{
name: 'Hindi',
onSelect: () => { },
},
{
name: 'Hungarian',
onSelect: () => { },
},
{
name: 'Indonesian',
onSelect: () => { },
},
{
name: 'Italian',
onSelect: () => { },
},
{
name: 'Japanese',
onSelect: () => { },
},
{
name: 'Javanese',
onSelect: () => { },
},
{
name: 'Korean',
onSelect: () => { },
},
{
name: 'Norwegian',
onSelect: () => { },
},
{
name: 'Polish',
onSelect: () => { },
},
{
name: 'Portuguese',
onSelect: () => { },
},
{
name: 'Romanian',
onSelect: () => { },
},
{
name: 'Russian',
onSelect: () => { },
},
{
name: 'Serbian',
onSelect: () => { },
},
{
name: 'Slovak',
onSelect: () => { },
},
{
name: 'Slovene',
onSelect: () => { },
},
{
name: 'Spanish',
onSelect: () => { },
},
{
name: 'Swedish',
onSelect: () => { },
},
{
name: 'Thai',
onSelect: () => { },
},
{
name: 'Turkish',
onSelect: () => { },
},
{
name: 'Ukrainian',
onSelect: () => { },
},
{
name: 'Vietnamese',
onSelect: () => { },
},
],
},
],
};
};
exports.secondBrain = secondBrain;
exports.inlineText = {
name: 'Inline text',
maxToolbarItems: 4,
children: [
(0, exports.secondBrain)(),
{
name: 'Annotations separator',
sep: true,
},
// annotations(),
{
name: 'Style separator',
sep: true,
},
{
name: 'Typesetting',
expand: 4,
openOnTitleHov: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "typography" }),
onSelect: () => { },
children: [
{
name: 'Sans-serif',
iconBig: () => React.createElement(FontStyleButton_1.FontStyleButton, { kind: 'sans' }),
onSelect: () => { },
},
{
name: 'Serif',
iconBig: () => React.createElement(FontStyleButton_1.FontStyleButton, { kind: 'serif' }),
onSelect: () => { },
},
{
name: 'Slab',
icon: () => React.createElement(FontStyleButton_1.FontStyleButton, { kind: 'slab', size: 16 }),
iconBig: () => React.createElement(FontStyleButton_1.FontStyleButton, { kind: 'slab' }),
onSelect: () => { },
},
{
name: 'Monospace',
iconBig: () => React.createElement(FontStyleButton_1.FontStyleButton, { kind: 'mono' }),
onSelect: () => { },
},
// {
// name: 'Custom typeface separator',
// sep: true,
// },
{
name: 'Custom typeface',
expand: 10,
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "font-style" }),
children: [
{
name: 'Typeface',
// icon: () => <Iconista width={15} height={15} set="radix" icon="font-style" />,
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "font-family" }),
onSelect: () => { },
},
{
name: 'Text size',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "font-size" }),
onSelect: () => { },
},
{
name: 'Letter spacing',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "letter-spacing" }),
onSelect: () => { },
},
{
name: 'Word spacing',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "letter-spacing" }),
onSelect: () => { },
},
{
name: 'Caps separator',
sep: true,
},
{
name: 'Large caps',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "letter-case-uppercase" }),
onSelect: () => { },
},
{
name: 'Small caps',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "letter-case-lowercase" }),
onSelect: () => { },
},
],
},
],
},
{
name: 'Modify separator',
sep: true,
},
{
name: 'Modify',
expand: 3,
onSelect: () => { },
children: [
{
name: 'Pick layer',
right: () => (React.createElement(Code_1.Code, { size: -1, gray: true }, "9+")),
more: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "layers" }),
onSelect: () => { },
},
{
name: 'Erase formatting',
danger: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "eraser" }),
onSelect: () => { },
},
{
name: 'Delete all in range',
danger: true,
more: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "trash" }),
onSelect: () => { },
},
],
},
{
name: 'Clipboard separator',
sep: true,
},
{
name: 'Copy, cut, and paste',
// icon: () => <Iconista width={15} height={15} set="radix" icon="copy" />,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "lucide", icon: "copy" }),
expand: 0,
children: [
{
id: 'copy-menu',
name: 'Copy',
// icon: () => <Iconista width={15} height={15} set="radix" icon="copy" />,
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard-copy" }),
expand: 5,
children: [
{
name: 'Copy',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard-copy" }),
onSelect: () => { },
},
{
name: 'Copy text only',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard-copy" }),
onSelect: () => { },
},
{
name: 'Copy as Markdown',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard-copy" }),
right: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "simple", icon: "markdown", style: { opacity: 0.5 } }),
onSelect: () => { },
},
{
name: 'Copy as HTML',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard-copy" }),
right: () => React.createElement(Iconista_1.Iconista, { width: 14, height: 14, set: "simple", icon: "html5", style: { opacity: 0.5 } }),
onSelect: () => { },
},
],
},
{
name: 'Cut separator',
sep: true,
},
{
id: 'cut-menu',
name: 'Cut',
// icon: () => <Iconista width={15} height={15} set="radix" icon="copy" />,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "scissors" }),
expand: 5,
children: [
{
name: 'Cut',
danger: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "scissors" }),
onSelect: () => { },
},
{
name: 'Cut text only',
danger: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "scissors" }),
onSelect: () => { },
},
{
name: 'Cut as Markdown',
danger: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "scissors" }),
right: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "simple", icon: "markdown", style: { opacity: 0.5 } }),
onSelect: () => { },
},
{
name: 'Cut as HTML',
danger: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "scissors" }),
right: () => React.createElement(Iconista_1.Iconista, { width: 14, height: 14, set: "simple", icon: "html5", style: { opacity: 0.5 } }),
onSelect: () => { },
},
],
},
{
name: 'Paste separator',
sep: true,
},
{
id: 'paste-menu',
name: 'Paste',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard" }),
expand: 5,
children: [
{
name: 'Paste',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard" }),
onSelect: () => { },
},
{
name: 'Paste text only',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard" }),
onSelect: () => { },
},
{
name: 'Paste formatting',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "clipboard" }),
onSelect: () => { },
},
],
},
],
},
{
name: 'Insert',
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "lucide", icon: "between-vertical-end" }),
children: [
{
name: 'Smart chip',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "button" }),
children: [
{
name: 'Date',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "calendar" }),
onSelect: () => { },
},
{
name: 'AI chip',
icon: () => React.createElement(Iconista_1.Iconista, { style: { color: 'purple' }, width: 16, height: 16, set: "tabler", icon: "brain" }),
onSelect: () => { },
},
{
name: 'Solana wallet',
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "wallet" }),
onSelect: () => { },
},
{
name: 'Dropdown',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "dropdown-menu" }),
children: [
{
name: 'Create new',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "plus" }),
onSelect: () => { },
},
{
name: 'Document dropdowns separator',
sep: true,
},
{
name: 'Document dropdowns',
expand: 8,
onSelect: () => { },
children: [
{
name: 'Configuration 1',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "dropdown-menu" }),
onSelect: () => { },
},
{
name: 'Configuration 2',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "dropdown-menu" }),
onSelect: () => { },
},
],
},
{
name: 'Presets dropdowns separator',
sep: true,
},
{
name: 'Presets dropdowns',
expand: 8,
onSelect: () => { },
children: [
{
name: 'Project status',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "dropdown-menu" }),
onSelect: () => { },
},
{
name: 'Review status',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "dropdown-menu" }),
onSelect: () => { },
},
],
},
],
},
],
},
{
name: 'Link',
// icon: () => <Iconista width={15} height={15} set="lucide" icon="link" />,
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "link-2" }),
onSelect: () => { },
},
{
name: 'Reference',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "sewing-pin" }),
onSelect: () => { },
},
{
name: 'File',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "file" }),
onSelect: () => { },
},
{
name: 'Template',
text: 'building blocks',
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "tabler", icon: "template" }),
children: [
{
name: 'Meeting notes',
onSelect: () => { },
},
{
name: 'Email draft (created by AI)',
onSelect: () => { },
},
{
name: 'Product roadmap',
onSelect: () => { },
},
{
name: 'Review tracker',
onSelect: () => { },
},
{
name: 'Project assets',
onSelect: () => { },
},
{
name: 'Content launch tracker',
onSelect: () => { },
},
],
},
{
name: 'On-screen keyboard',
icon: () => React.createElement(Iconista_1.Iconista, { width: 15, height: 15, set: "radix", icon: "keyboard" }),
onSelect: () => { },
},
{
name: 'Emoji',
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "lucide", icon: "smile-plus" }),
onSelect: () => { },
},
{
name: 'Special characters',
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "lucide", icon: "omega" }),
onSelect: () => { },
},
{
name: 'Variable',
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "lucide", icon: "variable" }),
onSelect: () => { },
},
],
},
{
name: 'Developer tools',
danger: true,
icon: () => React.createElement(Iconista_1.Iconista, { width: 16, height: 16, set: "lucide", icon: "square-chevron-right" }),
onSelect: () => { },
},
],
};