@homecode/ui 5.20.19 → 5.20.21

package/dist/esm/index.js

@@ -24,7 +24,7 @@ export { Flex } from './src/components/Flex/Flex.js';
 export { FoldedLine } from './src/components/FoldedLine/FoldedLine.js';
 export { FoldedLineAction, FoldedLineActionsProvider, useFoldedLineActionsRegister } from './src/components/FoldedLine/FoldedLineActionsContext.js';
 export { Form } from './src/components/Form/Form.js';
-export { FormattedText } from './src/components/FormattedText/FormattedText.js';
+export { FormattedText, findJsonEndExclusive } from './src/components/FormattedText/FormattedText.js';
 export { Gap } from './src/components/Gap/Gap.js';
 export { Gallery, normalizeGalleryItem } from './src/components/Gallery/Gallery.js';
 export { GridLayout } from './src/components/GridLayout/GridLayout.js';

package/dist/esm/src/components/Autocomplete/Autocomplete.js

@@ -80,6 +80,7 @@ import '../Progress/Progress.styl.js';
 import '@tiptap/extensions';
 import '@tiptap/starter-kit';
 import '../PromptComposer/PromptComposer.styl.js';
+import '../../tiptap/prompt-blocks/createPromptBlocksExtension.js';
 import '@tiptap/pm/view';
 import 'linkifyjs';
 import '../../tiptap/link-highlight/nonInclusiveLink.js';

package/dist/esm/src/components/FormattedText/FormattedText.js

@@ -108,7 +108,24 @@ function applyInjectors(text, injectors) {
     });
     return result;
 }
-function FormattedText({ text, className, onButtonClick, }) {
+function FormattedText({ text, className, onButtonClick, quotes, injectors, breaks = true, }) {
+    // Without `<br>`s the text keeps its own newlines (pre-wrap), so a block, such
+    // as a table, swallows the blank lines after it instead of showing them.
+    const blankLinesAfter = (content, from) => breaks ? 0 : content.slice(from).match(/^\s*/)[0].length;
+    /** A run of `> ` lines, grayed with a bar down its left side. */
+    const injectQuote = (content) => {
+        const matches = content.match(/(?:^|\n)(>[^\n]*(?:\n>[^\n]*)*)(?:\n|$)/);
+        if (!matches)
+            return null;
+        const lines = matches[1]
+            .split('\n')
+            .map(line => line.replace(/^>[ \t]?/, ''));
+        return {
+            elem: (jsx("div", { className: S.quote, "data-quote": true, children: lines.join('\n') })),
+            index: matches.index,
+            length: matches[0].length,
+        };
+    };
     const injectLines = (content) => {
         const matches = content.match(/(^|\n)---[ \t]*(?:\n|$)/);
         if (!matches)
@@ -266,6 +283,7 @@ function FormattedText({ text, className, onButtonClick, }) {
     const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
     const processCellContent = (value, depth = 0) => applyInjectors(value, [
         injectCodeBlock,
+        ...(injectors ?? []),
         injectPrettyJson,
         ...(depth === 0
             ? [
@@ -291,7 +309,10 @@ function FormattedText({ text, className, onButtonClick, }) {
         injectButtons,
     ]);
     const injectHeading = (content) => {
-        const matches = content.match(/(^|\n)(#{1,6})\s+([^\n]+)/);
+        // Without `<br>`s the text keeps its own newlines (pre-wrap), so a heading,
+        // which is a block, swallows the blank lines around it instead of leaving
+        // an extra empty line.
+        const matches = content.match(breaks ? /(^|\n)(#{1,6})\s+([^\n]+)/ : /(^|\n+)(#{1,6})[ \t]+([^\n]+)\n*/);
         if (!matches)
             return null;
         const Tag = headingTags[Math.min(matches[2].length, 6) - 1];
@@ -350,13 +371,18 @@ function FormattedText({ text, className, onButtonClick, }) {
         return {
             elem: (jsx(Table, { size: "s", variant: "plain", columns: columns, data: tableData, className: S.table })),
             index: matches.index + (matches[1]?.length || 0),
-            length: matches[0].length - (matches[1]?.length || 0),
+            length: matches[0].length -
+                (matches[1]?.length || 0) +
+                blankLinesAfter(content, matches.index + matches[0].length),
         };
     };
     return (jsx("div", { className: className, children: applyInjectors(text, [
             injectTables,
             injectCodeBlock,
+            ...(injectors ?? []),
             injectPrettyJson,
+            // After code, so a `> ` line inside a code block stays code.
+            ...(quotes ? [injectQuote] : []),
             injectHeading,
             injectLines,
             injectLinks,
@@ -365,8 +391,8 @@ function FormattedText({ text, className, onButtonClick, }) {
             injectBullet,
             injectNumbered,
             injectButtons,
-            injectBreaks,
+            ...(breaks ? [injectBreaks] : []),
         ]) }));
 }
 
-export { FormattedText, hrefForFormattedLink };
+export { FormattedText, findJsonEndExclusive, hrefForFormattedLink };

package/dist/esm/src/components/FormattedText/FormattedText.styl.js

@@ -1,5 +1,5 @@
-var css_248z = ".FormattedText_bullet__vbqlq{display:inline-block;margin-bottom:2px;margin-left:var(--p-2);margin-right:2px}.FormattedText_bullet__vbqlq:before{background-color:var(--accent-color);border-radius:50%;content:\"\";display:block;height:6px;margin:0 4px;width:6px}.FormattedText_numberedIndex__rZ6Kt{font-feature-settings:\"tnum\";color:var(--accent-color);display:inline-block;font-variant-numeric:tabular-nums;margin-left:var(--p-2);margin-right:6px;min-width:1.25em}.FormattedText_line__c2bmE{background-color:var(--accent-color-alpha-200);border-radius:2px;height:2px;margin:var(--p-2) 0;width:100%}.FormattedText_codeBlock__Xrbvn,.FormattedText_codeInline__jCbNL{background-color:var(--decent-color-alpha-400);border-radius:var(--p-2);box-shadow:0 1px 1px var(--accent-color-alpha-50),inset 0 1px 1px var(--decent-color-alpha-500);font-family:monospace;-webkit-user-select:text;-moz-user-select:text;user-select:text}.FormattedText_codeInline__jCbNL{border-radius:3px;display:inline;font-size:90%;padding:0 4px}.FormattedText_codeBlock__Xrbvn,.FormattedText_jsonPre__qOGmo{display:block;font-size:90%;margin:var(--p-2) 0;overflow-x:auto;padding:var(--p-2);white-space:pre-wrap}.FormattedText_jsonPre__qOGmo{background-color:var(--decent-color-alpha-300);border-radius:var(--p-2);box-shadow:0 1px 1px var(--accent-color-alpha-50),inset 0 1px 1px var(--accent-color-alpha-50);font-family:monospace;max-width:100%;-webkit-user-select:text;-moz-user-select:text;user-select:text}.FormattedText_table__ipMMS{margin-bottom:10px}";
-var S = {"bullet":"FormattedText_bullet__vbqlq","numberedIndex":"FormattedText_numberedIndex__rZ6Kt","line":"FormattedText_line__c2bmE","codeInline":"FormattedText_codeInline__jCbNL","codeBlock":"FormattedText_codeBlock__Xrbvn","jsonPre":"FormattedText_jsonPre__qOGmo","table":"FormattedText_table__ipMMS"};
+var css_248z = ".FormattedText_bullet__vbqlq{display:inline-block;margin-bottom:2px;margin-left:var(--p-2);margin-right:2px}.FormattedText_bullet__vbqlq:before{background-color:var(--accent-color);border-radius:50%;content:\"\";display:block;height:6px;margin:0 4px;width:6px}.FormattedText_numberedIndex__rZ6Kt{font-feature-settings:\"tnum\";color:var(--accent-color);display:inline-block;font-variant-numeric:tabular-nums;margin-left:var(--p-2);margin-right:6px;min-width:1.25em}.FormattedText_quote__BBm-M{color:var(--accent-color-alpha-600);font-size:85%;margin:0 0 var(--p-1);padding:2px 0 2px calc(4px + var(--p-2));position:relative;white-space:pre-wrap}.FormattedText_quote__BBm-M:before{background-color:var(--accent-color);border-radius:2px;bottom:2px;content:\"\";left:2px;opacity:.3;position:absolute;top:2px;width:4px}.FormattedText_line__c2bmE{background-color:var(--accent-color-alpha-200);border-radius:2px;height:2px;margin:var(--p-2) 0;width:100%}.FormattedText_codeBlock__Xrbvn,.FormattedText_codeInline__jCbNL{background-color:var(--decent-color-alpha-400);border-radius:var(--p-2);box-shadow:0 1px 1px var(--accent-color-alpha-50),inset 0 1px 1px var(--decent-color-alpha-500);font-family:monospace;-webkit-user-select:text;-moz-user-select:text;user-select:text}.FormattedText_codeInline__jCbNL{border-radius:3px;display:inline;font-size:90%;padding:0 4px}.FormattedText_codeBlock__Xrbvn,.FormattedText_jsonPre__qOGmo{display:block;font-size:90%;margin:var(--p-2) 0;overflow-x:auto;padding:var(--p-2);white-space:pre-wrap}.FormattedText_jsonPre__qOGmo{background-color:var(--decent-color-alpha-300);border-radius:var(--p-2);box-shadow:0 1px 1px var(--accent-color-alpha-50),inset 0 1px 1px var(--accent-color-alpha-50);font-family:monospace;max-width:100%;-webkit-user-select:text;-moz-user-select:text;user-select:text}.FormattedText_table__ipMMS{margin-bottom:10px}";
+var S = {"bullet":"FormattedText_bullet__vbqlq","numberedIndex":"FormattedText_numberedIndex__rZ6Kt","quote":"FormattedText_quote__BBm-M","line":"FormattedText_line__c2bmE","codeInline":"FormattedText_codeInline__jCbNL","codeBlock":"FormattedText_codeBlock__Xrbvn","jsonPre":"FormattedText_jsonPre__qOGmo","table":"FormattedText_table__ipMMS"};
             if (typeof document !== 'undefined') {
               var __uilibHead = document.head || document.getElementsByTagName('head')[0];
               if (__uilibHead) {

package/dist/esm/src/components/InputFile/InputFile.js

@@ -76,6 +76,7 @@ import '@tiptap/extensions';
 import '@tiptap/react';
 import '@tiptap/starter-kit';
 import '../PromptComposer/PromptComposer.styl.js';
+import '../../tiptap/prompt-blocks/createPromptBlocksExtension.js';
 import '@tiptap/core';
 import '@tiptap/pm/state';
 import '@tiptap/pm/view';

package/dist/esm/src/components/PromptComposer/PromptComposer.styl.js

@@ -1,5 +1,5 @@
-var css_248z = ".PromptComposer_root__gfdXN{width:100%}.PromptComposer_scroller__Sueif{flex:1;max-height:200px;min-height:40px;width:100%}.PromptComposer_editorMount__B9G-o{background:transparent;border:none;border-radius:0!important;box-shadow:none!important;display:flex;flex:1;flex-direction:column;min-height:40px;min-width:0;padding:0!important}.PromptComposer_editorMount__B9G-o:focus-within{box-shadow:none!important}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEditor__yQIpq{border:none!important;box-shadow:none!important;flex:1;margin:0;min-height:40px!important;outline:none!important;overflow:hidden!important;padding:var(--p-2) 0 0!important;resize:none!important;transition:opacity .1s ease-out;white-space:pre-wrap;word-break:break-word}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEditor__yQIpq .PromptComposer_promptComposerLink__rKhhp,.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEditor__yQIpq a{color:var(--link-color)}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEditor__yQIpq a:hover{cursor:pointer;opacity:.8}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEmptyNode__62Ylm:before{color:var(--muted-foreground);content:attr(data-placeholder);float:left;height:0;opacity:.3;pointer-events:none}";
-var S = {"root":"PromptComposer_root__gfdXN","scroller":"PromptComposer_scroller__Sueif","editorMount":"PromptComposer_editorMount__B9G-o","promptComposerEditor":"PromptComposer_promptComposerEditor__yQIpq","promptComposerLink":"PromptComposer_promptComposerLink__rKhhp","promptComposerEmptyNode":"PromptComposer_promptComposerEmptyNode__62Ylm"};
+var css_248z = ".PromptComposer_root__gfdXN{width:100%}.PromptComposer_scroller__Sueif{flex:1;max-height:200px;min-height:40px;width:100%}.PromptComposer_editorMount__B9G-o{background:transparent;border:none;border-radius:0!important;box-shadow:none!important;display:flex;flex:1;flex-direction:column;min-height:40px;min-width:0;padding:0!important}.PromptComposer_editorMount__B9G-o:focus-within{box-shadow:none!important}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEditor__yQIpq{border:none!important;box-shadow:none!important;flex:1;margin:0;min-height:40px!important;outline:none!important;overflow:hidden!important;padding:var(--p-2) 0 0!important;resize:none!important;transition:opacity .1s ease-out;white-space:pre-wrap;word-break:break-word}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEditor__yQIpq .PromptComposer_promptComposerLink__rKhhp,.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEditor__yQIpq a{color:var(--link-color)}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEditor__yQIpq a:hover{cursor:pointer;opacity:.8}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerEmptyNode__62Ylm:before{color:var(--muted-foreground);content:attr(data-placeholder);float:left;height:0;opacity:.3;pointer-events:none}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerList__PqkM-{list-style:disc;margin:0;padding-left:1.4em}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerList__PqkM- li,.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerList__PqkM- p{margin:0}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerQuote__AGoIb{color:var(--accent-color-alpha-600);font-size:85%;margin:0 0 var(--p-1);padding:2px 0 2px calc(4px + var(--p-2));position:relative;white-space:pre-wrap}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerQuote__AGoIb:before{background:var(--accent-color);border-radius:2px;bottom:2px;content:\"\";left:2px;opacity:.3;pointer-events:none;position:absolute;top:2px;width:4px}.PromptComposer_editorMount__B9G-o .PromptComposer_promptComposerQuote__AGoIb p{margin:0}.PromptComposer_editorMount__B9G-o div.PromptComposer_promptComposerQuote__AGoIb{cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:pre-wrap}.PromptComposer_editorMount__B9G-o div.PromptComposer_promptComposerQuote__AGoIb.ProseMirror-selectednode{background:var(--accent-color-alpha-100);border-radius:4px}.PromptComposer_editorMount__B9G-o div.PromptComposer_promptComposerQuote__AGoIb.ProseMirror-selectednode:before{opacity:.7}";
+var S = {"root":"PromptComposer_root__gfdXN","scroller":"PromptComposer_scroller__Sueif","editorMount":"PromptComposer_editorMount__B9G-o","promptComposerEditor":"PromptComposer_promptComposerEditor__yQIpq","promptComposerLink":"PromptComposer_promptComposerLink__rKhhp","promptComposerEmptyNode":"PromptComposer_promptComposerEmptyNode__62Ylm","promptComposerList":"PromptComposer_promptComposerList__PqkM-","promptComposerQuote":"PromptComposer_promptComposerQuote__AGoIb"};
             if (typeof document !== 'undefined') {
               var __uilibHead = document.head || document.getElementsByTagName('head')[0];
               if (__uilibHead) {

package/dist/esm/src/components/PromptComposer/promptComposerDoc.js

@@ -1,17 +1,6 @@
 const PROMPT_COMPOSER_EMPTY_DOC = {
     type: 'doc',
     content: [{ type: 'paragraph' }],
-};
-function promptComposerParagraphDoc(text) {
-    return {
-        type: 'doc',
-        content: [
-            {
-                type: 'paragraph',
-                content: text ? [{ type: 'text', text }] : [],
-            },
-        ],
-    };
-}
+};
 
-export { PROMPT_COMPOSER_EMPTY_DOC, promptComposerParagraphDoc };
+export { PROMPT_COMPOSER_EMPTY_DOC };

package/dist/esm/src/components/PromptComposer/promptComposerInsert.js

@@ -1,4 +1,5 @@
-import { promptComposerParagraphDoc } from './promptComposerDoc.js';
+import '../../tiptap/prompt-blocks/createPromptBlocksExtension.js';
+import { promptBlocksDoc } from '../../tiptap/prompt-blocks/promptBlocksText.js';
 
 const PROMPT_COMPOSER_COMMAND_CHIP_CLASS = 'prompt-composer-command-chip';
 function getPromptComposerTokenRangeBeforePos(editor, pos) {
@@ -70,7 +71,7 @@ function insertPromptComposerContentAtCaret(editor, content, options) {
 function setPromptComposerEditorText(editor, text, options) {
     if (editor.isDestroyed)
         return;
-    editor.commands.setContent(promptComposerParagraphDoc(text));
+    editor.commands.setContent(promptBlocksDoc(text));
     if (options?.focus) {
         editor.commands.focus(options.atEnd === false ? 'start' : 'end');
     }

package/dist/esm/src/components/PromptComposer/promptComposerPlaceholder.js

@@ -0,0 +1,10 @@
+/**
+ * Placeholder text for the composer's empty paragraphs. Only a wholly empty
+ * composer shows it: a quote or list with an empty line after it already is
+ * content, so it keeps no hint.
+ */
+function promptComposerPlaceholder(text) {
+    return ({ editor }) => (editor.isEmpty ? text : '');
+}
+
+export { promptComposerPlaceholder };

package/dist/esm/src/components/PromptComposer/usePromptComposerEditor.js

@@ -3,12 +3,15 @@ import { Placeholder } from '@tiptap/extensions';
 import { useEditor } from '@tiptap/react';
 import StarterKit from '@tiptap/starter-kit';
 import S from './PromptComposer.styl.js';
+import { promptComposerPlaceholder } from './promptComposerPlaceholder.js';
+import { createPromptBlocksExtension, isInPromptBlock } from '../../tiptap/prompt-blocks/createPromptBlocksExtension.js';
+import { promptBlocksDoc } from '../../tiptap/prompt-blocks/promptBlocksText.js';
 import { createLinkHighlightExtension } from '../../tiptap/link-highlight/createLinkHighlightExtension.js';
 import { NonInclusiveLink } from '../../tiptap/link-highlight/nonInclusiveLink.js';
 import { DEFAULT_CHAT_SLASH_ITEMS } from '../../tiptap/slash-mention/defaultChatSlashItems.js';
 import { createSlashMentionExtension } from '../../tiptap/slash-mention/createSlashMentionExtension.js';
 import { safePromptComposerEditorText, promptComposerSafeEditorDom, syncPromptComposerHeight } from './PromptComposer.helpers.js';
-import { PROMPT_COMPOSER_EMPTY_DOC, promptComposerParagraphDoc } from './promptComposerDoc.js';
+import { PROMPT_COMPOSER_EMPTY_DOC } from './promptComposerDoc.js';
 
 function buildMentionConfigs({ slashCommandItems, onSlashItemCommand, mentionConfigs, atMentionItems, atMentionGetItems, onAtItemCommand, }) {
     const configs = [];
@@ -101,18 +104,22 @@ function usePromptComposerEditor({ disabled, placeholder, slashCommandItems, sla
                 heading: false,
                 bulletList: false,
                 orderedList: false,
-                blockquote: false,
+                blockquote: { HTMLAttributes: { class: S.promptComposerQuote } },
                 codeBlock: false,
                 horizontalRule: false,
                 link: false,
             }),
             NonInclusiveLink,
             Placeholder.configure({
-                placeholder: placeholderText,
+                placeholder: promptComposerPlaceholder(placeholderText),
                 showOnlyWhenEditable: true,
                 emptyNodeClass: S.promptComposerEmptyNode,
             }),
             createLinkHighlightExtension(S.promptComposerLink),
+            ...createPromptBlocksExtension({
+                quoteClassName: S.promptComposerQuote,
+                listClassName: S.promptComposerList,
+            }),
         ];
         for (const cfg of resolvedMentionConfigs) {
             const slashChar = cfg.slashChar;
@@ -180,7 +187,8 @@ function usePromptComposerEditor({ disabled, placeholder, slashCommandItems, sla
         if (!activeEditor)
             return false;
         const currentText = activeEditor.getText();
-        const hasNewlines = currentText.includes('\n');
+        // In a list or a quote being typed, Enter adds the next line.
+        const hasNewlines = currentText.includes('\n') || isInPromptBlock(activeEditor.state);
         const isModEnter = event.metaKey || event.ctrlKey;
         // Single line: Enter submits. Multiline: Enter inserts a line; Cmd/Ctrl+Enter submits.
         if (hasNewlines ? !isModEnter : isModEnter)
@@ -249,13 +257,13 @@ function usePromptComposerEditor({ disabled, placeholder, slashCommandItems, sla
         const next = prefillMessage;
         if (current === next)
             return;
+        // The app trims the prompt on blur, and a list or quote at the end always
+        // has an empty line after it. Resetting for that would refocus the editor
+        // and turn an empty last item into text.
+        if (next !== '' && next === current.trim())
+            return;
         try {
-            if (next === '') {
-                editor.commands.setContent(PROMPT_COMPOSER_EMPTY_DOC);
-            }
-            else {
-                editor.commands.setContent(promptComposerParagraphDoc(next));
-            }
+            editor.commands.setContent(promptBlocksDoc(next));
         }
         catch {
             return;

package/dist/esm/src/tiptap/prompt-blocks/createPromptBlocksExtension.js

@@ -0,0 +1,260 @@
+import { wrappingInputRule, Extension, Node, getTextBetween, getTextSerializersFromSchema } from '@tiptap/core';
+import { BulletList } from '@tiptap/extension-list';
+import { PluginKey, Plugin } from '@tiptap/pm/state';
+import { promptQuoteMarkdown, PROMPT_QUOTE_NODE } from './promptBlocksText.js';
+
+const serializersBySchema = new WeakMap();
+function textSerializers(schema) {
+    let serializers = serializersBySchema.get(schema);
+    if (!serializers) {
+        serializers = getTextSerializersFromSchema(schema);
+        serializersBySchema.set(schema, serializers);
+    }
+    return serializers;
+}
+/** Text of a textblock, with mention chips and hard breaks as text. */
+function inlineText(node, schema) {
+    return getTextBetween(node, { from: 0, to: node.content.size }, { blockSeparator: '\n', textSerializers: textSerializers(schema) });
+}
+/**
+ * Lines of a (draft) blockquote: one per paragraph, a pasted quote's own
+ * lines, and list items as `- ` lines.
+ */
+function blockquoteLines(node, schema) {
+    const lines = [];
+    node.forEach(child => {
+        if (child.type.name === PROMPT_QUOTE_NODE) {
+            lines.push(String(child.attrs.text ?? ''));
+        }
+        else if (child.type.name === 'bulletList') {
+            lines.push(bulletListMarkdown(child, schema));
+        }
+        else if (child.isTextblock) {
+            lines.push(inlineText(child, schema));
+        }
+        else {
+            lines.push(blockquoteLines(child, schema));
+        }
+    });
+    return lines.join('\n');
+}
+/** Text of one block: textblocks inline, others by their own serializer. */
+function blockText(node, schema) {
+    if (node.isTextblock)
+        return inlineText(node, schema);
+    const toText = textSerializers(schema)[node.type.name];
+    return toText ? toText({ node }) : node.textContent;
+}
+function bulletListMarkdown(list, schema, indent = '') {
+    const lines = [];
+    list.forEach(item => {
+        const itemLines = [];
+        let hasText = false;
+        item.forEach(child => {
+            if (child.type.name === 'bulletList') {
+                const nested = bulletListMarkdown(child, schema, `${indent}  `);
+                if (nested)
+                    itemLines.push(nested);
+                hasText ||= Boolean(nested);
+                return;
+            }
+            const text = blockText(child, schema);
+            hasText ||= Boolean(text.trim());
+            const prefix = itemLines.length ? `${indent}  ` : `${indent}- `;
+            itemLines.push(text
+                .split('\n')
+                .map((line, i) => (i === 0 ? prefix + line : `${indent}  ${line}`))
+                .join('\n'));
+        });
+        // An empty item is not text yet: `- ` alone must not count as a prompt.
+        if (hasText)
+            lines.push(...itemLines);
+    });
+    return lines.join('\n');
+}
+/** Only `- ` starts a list: `* ` and `+ ` stay text, as getText() writes `- `. */
+const DashBulletList = BulletList.extend({
+    addInputRules() {
+        return [wrappingInputRule({ find: /^\s*-\s$/, type: this.type })];
+    },
+});
+/** The innermost of `names` the position is in, if any. */
+function promptBlockAt($pos, names = ['listItem', 'blockquote']) {
+    for (let d = $pos.depth; d > 0; d -= 1) {
+        const name = $pos.node(d).type.name;
+        if (names.includes(name))
+            return name;
+    }
+    return null;
+}
+const inQuote = ($pos) => !!promptBlockAt($pos, ['blockquote']);
+/**
+ * Locked quote: a read-only block holding the quoted text. It can be
+ * selected and deleted, not edited.
+ */
+function createPromptQuoteNode(className) {
+    return Node.create({
+        name: PROMPT_QUOTE_NODE,
+        group: 'block',
+        atom: true,
+        selectable: true,
+        draggable: false,
+        addAttributes() {
+            return {
+                text: {
+                    default: '',
+                    parseHTML: el => el.textContent ?? '',
+                    rendered: false,
+                },
+            };
+        },
+        parseHTML() {
+            return [{ tag: 'div[data-prompt-quote]' }];
+        },
+        renderHTML({ node }) {
+            return [
+                'div',
+                {
+                    'data-prompt-quote': '',
+                    contenteditable: 'false',
+                    ...(className ? { class: className } : {}),
+                },
+                String(node.attrs.text ?? ''),
+            ];
+        },
+        renderText({ node }) {
+            return promptQuoteMarkdown(String(node.attrs.text ?? ''));
+        },
+    });
+}
+const lockQuotesKey = new PluginKey('promptLockQuotes');
+/**
+ * Markdown-style lines in the prompt composer:
+ * - `- ` at the start of a line starts a bullet list (StarterKit's list);
+ * - `> ` starts a quote that stays editable while the caret is in it and
+ *   turns into a read-only quote block once the caret leaves.
+ *
+ * `getText()` gives both back as markdown (`- item`, `> line`).
+ * Brings its own bullet list: use StarterKit with `bulletList: false` and
+ * `listItem` and `blockquote` enabled.
+ */
+function createPromptBlocksExtension({ quoteClassName, listClassName, } = {}) {
+    const PromptBlocks = Extension.create({
+        name: 'promptBlocks',
+        extendNodeSchema(extension) {
+            if (extension.name === 'bulletList') {
+                return {
+                    toText: ({ node }) => bulletListMarkdown(node, node.type.schema),
+                };
+            }
+            if (extension.name === 'blockquote') {
+                return {
+                    toText: ({ node }) => promptQuoteMarkdown(blockquoteLines(node, node.type.schema)),
+                };
+            }
+            return {};
+        },
+        addProseMirrorPlugins() {
+            const { editor } = this;
+            return [
+                new Plugin({
+                    key: lockQuotesKey,
+                    appendTransaction: (transactions, oldState, state) => {
+                        const docChanged = transactions.some(tr => tr.docChanged);
+                        if (!docChanged && !transactions.some(tr => tr.selectionSet)) {
+                            return null;
+                        }
+                        // A caret move can only leave a quote it was in.
+                        if (!docChanged &&
+                            !inQuote(oldState.selection.$from) &&
+                            !inQuote(oldState.selection.$to)) {
+                            return null;
+                        }
+                        const quoteType = state.schema.nodes[PROMPT_QUOTE_NODE];
+                        const paragraphType = state.schema.nodes.paragraph;
+                        if (!quoteType || !paragraphType)
+                            return null;
+                        const { from, to } = state.selection;
+                        const drafts = [];
+                        state.doc.descendants((node, pos) => {
+                            // Quotes sit at the top level or in list items, never inline.
+                            if (node.type.name !== 'blockquote')
+                                return !node.isTextblock;
+                            const end = pos + node.nodeSize;
+                            // Only once the selection is fully outside: a range reaching
+                            // into the quote (Shift+Arrow, drag, select all) keeps it.
+                            if (to < pos || from > end)
+                                drafts.push({ pos, node });
+                            return false;
+                        });
+                        if (drafts.length === 0)
+                            return null;
+                        const tr = state.tr;
+                        // Right to left, so earlier positions stay valid.
+                        for (const { pos, node } of drafts.reverse()) {
+                            const text = blockquoteLines(node, state.schema);
+                            const replacement = text.trim()
+                                ? quoteType.create({ text })
+                                : paragraphType.create();
+                            tr.replaceWith(pos, pos + node.nodeSize, replacement);
+                        }
+                        // In undo history with the edit that left the quote, so undo
+                        // takes back the typing and the lock together.
+                        return tr;
+                    },
+                    props: {
+                        // StarterKit's `- ` / `> ` rules need the start of a paragraph;
+                        // this also takes a line started with Shift+Enter (a hard break).
+                        handleTextInput: (view, from, to, text) => {
+                            if (text !== ' ' || from !== to || view.composing)
+                                return false;
+                            const { doc } = view.state;
+                            if (from < 2)
+                                return false;
+                            const marker = doc.textBetween(from - 1, from);
+                            if (marker !== '>' && marker !== '-')
+                                return false;
+                            const $marker = doc.resolve(from - 1);
+                            if ($marker.parent.type.name !== 'paragraph')
+                                return false;
+                            if ($marker.nodeBefore?.type.name !== 'hardBreak')
+                                return false;
+                            const inBlock = promptBlockAt($marker);
+                            // `> ` in a quote or list stays text; `- ` in a list is the next
+                            // item, in a quote it starts a list there.
+                            if (inBlock && marker === '>')
+                                return false;
+                            const start = (chain) => {
+                                const run = chain.deleteRange({ from: from - 2, to: from });
+                                if (inBlock === 'listItem')
+                                    return run.splitListItem('listItem');
+                                run.splitBlock();
+                                return marker === '>'
+                                    ? run.wrapIn('blockquote')
+                                    : run.toggleBulletList();
+                            };
+                            // Handled once the doc changed, even if a later step failed:
+                            // the marker is gone, so the default insert would land wrong.
+                            const before = view.state.doc;
+                            start(editor.chain()).run();
+                            return view.state.doc !== before;
+                        },
+                    },
+                }),
+            ];
+        },
+    });
+    return [
+        createPromptQuoteNode(quoteClassName),
+        DashBulletList.configure({
+            HTMLAttributes: listClassName ? { class: listClassName } : {},
+        }),
+        PromptBlocks,
+    ];
+}
+/** True when the caret is in a bullet list or a quote being typed. */
+function isInPromptBlock(state) {
+    return promptBlockAt(state.selection.$from) !== null;
+}
+
+export { createPromptBlocksExtension, isInPromptBlock };

package/dist/esm/src/tiptap/prompt-blocks/promptBlocksText.js

@@ -0,0 +1,143 @@
+/** Node name of a locked (read-only) quote block. */
+const PROMPT_QUOTE_NODE = 'promptQuote';
+const QUOTE_LINE = /^>(?: (.*)|)$/;
+const TOP_BULLET_LINE = /^- (.*)$/;
+const BULLET_LINE = /^( *)- (.*)$/;
+/** Indented line under a list item: a nested item or a continued line. */
+const LIST_CHILD_LINE = /^ {2,}\S/;
+/**
+ * Markdown quote of `text`: `> ` per line, `>` for a blank line, nothing for
+ * an empty quote (so `> ` alone does not count as a prompt).
+ */
+function promptQuoteMarkdown(text) {
+    if (!text.trim())
+        return '';
+    return text
+        .split('\n')
+        .map(line => (line.trim() ? `> ${line}` : '>'))
+        .join('\n');
+}
+const textContent = (text) => text ? [{ type: 'text', text }] : [];
+const paragraph = (text) => ({
+    type: 'paragraph',
+    content: textContent(text),
+});
+/** Bullet groups keep their raw lines (indents included) for buildList. */
+function groupLines(lines) {
+    const groups = [];
+    for (const line of lines) {
+        const last = groups[groups.length - 1];
+        const quote = line.match(QUOTE_LINE);
+        const inList = last?.kind === 'bullet';
+        const bullet = !quote &&
+            (TOP_BULLET_LINE.test(line) || (inList && LIST_CHILD_LINE.test(line)));
+        const kind = quote ? 'quote' : bullet ? 'bullet' : 'plain';
+        const value = quote ? (quote[1] ?? '') : line;
+        if (last && last.kind === kind)
+            last.lines.push(value);
+        else
+            groups.push({ kind, lines: [value] });
+    }
+    return groups;
+}
+/**
+ * Bullet list from `- item` lines at `indent` spaces. A `- ` line two
+ * spaces deeper starts a nested list; other deeper lines continue the
+ * item's text (what getText() writes for a multi-line item).
+ */
+function buildList(lines, indent = 0) {
+    const items = [];
+    for (const line of lines) {
+        const bullet = line.match(BULLET_LINE);
+        const item = items[items.length - 1];
+        if ((bullet && bullet[1].length === indent) || !item) {
+            items.push({ text: bullet ? bullet[2] : line.trim(), parts: [] });
+            continue;
+        }
+        const lineIndent = line.match(/^ */)[0].length;
+        const last = item.parts[item.parts.length - 1];
+        const startsNested = bullet && lineIndent === indent + 2;
+        if (startsNested || (last && 'nested' in last && lineIndent > indent + 2)) {
+            if (last && 'nested' in last)
+                last.nested.push(line);
+            else
+                item.parts.push({ nested: [line] });
+            continue;
+        }
+        const value = line.slice(Math.min(lineIndent, indent + 2));
+        // Text at the item's own indent continues it, after a nested list too.
+        if (!last)
+            item.text += `\n${value}`;
+        else if ('text' in last)
+            last.text += `\n${value}`;
+        else
+            item.parts.push({ text: value });
+    }
+    return {
+        type: 'bulletList',
+        content: items.map(item => ({
+            type: 'listItem',
+            content: [
+                paragraph(item.text),
+                ...item.parts.map(part => 'nested' in part
+                    ? buildList(part.nested, indent + 2)
+                    : paragraph(part.text)),
+            ],
+        })),
+    };
+}
+/**
+ * Blocks for plain `text` with `> ` lines as locked quotes and `- ` lines as
+ * a bullet list. `getText()` of the result gives `text` back (blocks are
+ * joined by a blank line, list items by a newline).
+ *
+ * Other lines stay in one paragraph with newlines, as the composer prefill
+ * always worked. A doc never ends on a quote or list: an empty line follows,
+ * so the caret can go there instead of selecting the read-only quote.
+ */
+function promptBlocksFromText(text) {
+    const groups = groupLines(text.replace(/\r\n?/g, '\n').split('\n'));
+    const blocks = [];
+    groups.forEach((group, i) => {
+        if (group.kind === 'quote') {
+            // A bare `>` quotes nothing: keep it as an empty line.
+            if (!group.lines.join('').trim()) {
+                blocks.push(paragraph(''));
+                return;
+            }
+            blocks.push({
+                type: PROMPT_QUOTE_NODE,
+                attrs: { text: group.lines.join('\n') },
+            });
+            return;
+        }
+        if (group.kind === 'bullet') {
+            const list = buildList(group.lines);
+            // `- a`, blank line, `- b` is one list, as in markdown.
+            const prev = blocks[blocks.length - 1];
+            if (prev?.type === 'bulletList') {
+                prev.content = [...(prev.content ?? []), ...(list.content ?? [])];
+            }
+            else
+                blocks.push(list);
+            return;
+        }
+        // The blank line next to a quote or list is the block separator.
+        const lines = [...group.lines];
+        if (i > 0 && lines[0] === '')
+            lines.shift();
+        if (i < groups.length - 1 && lines[lines.length - 1] === '')
+            lines.pop();
+        if (lines.length === 0)
+            return;
+        blocks.push(paragraph(lines.join('\n')));
+    });
+    if (blocks[blocks.length - 1]?.type !== 'paragraph')
+        blocks.push(paragraph(''));
+    return blocks;
+}
+function promptBlocksDoc(text) {
+    return { type: 'doc', content: promptBlocksFromText(text) };
+}
+
+export { PROMPT_QUOTE_NODE, promptBlocksDoc, promptBlocksFromText, promptQuoteMarkdown };

package/dist/esm/types/src/components/FormattedText/FormattedText.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
 import type { FormattedTextProps } from './FormattedText.types';
 export declare function hrefForFormattedLink(url: string): string;
-export declare function FormattedText({ text, className, onButtonClick, }: FormattedTextProps): React.JSX.Element;
+export declare function findJsonEndExclusive(content: string, start: number): number;
+export declare function FormattedText({ text, className, onButtonClick, quotes, injectors, breaks, }: FormattedTextProps): React.JSX.Element;

package/dist/esm/types/src/components/FormattedText/FormattedText.types.d.ts

@@ -1,3 +1,10 @@
+import type React from 'react';
+export type InjectionResult = {
+    elem: React.ReactNode;
+    index: number;
+    length: number;
+} | null;
+export type Injector = (content: string) => InjectionResult;
 export type FormattedTextProps = {
     text: string;
     className?: string;
@@ -5,4 +12,7 @@ export type FormattedTextProps = {
         text: string;
         [name: string]: string;
     }) => void;
+    quotes?: boolean;
+    injectors?: Injector[];
+    breaks?: boolean;
 };

package/dist/esm/types/src/components/FormattedText/index.d.ts

@@ -1,2 +1,2 @@
-export { FormattedText } from './FormattedText';
-export type { FormattedTextProps } from './FormattedText.types';
+export { FormattedText, findJsonEndExclusive } from './FormattedText';
+export type { FormattedTextProps, InjectionResult, Injector, } from './FormattedText.types';

package/dist/esm/types/src/components/PromptComposer/promptComposerDoc.d.ts

@@ -1,3 +1,2 @@
 import type { JSONContent } from '@tiptap/core';
 export declare const PROMPT_COMPOSER_EMPTY_DOC: JSONContent;
-export declare function promptComposerParagraphDoc(text: string): JSONContent;

package/dist/esm/types/src/components/PromptComposer/promptComposerPlaceholder.d.ts

@@ -0,0 +1,9 @@
+import type { Editor } from '@tiptap/core';
+/**
+ * Placeholder text for the composer's empty paragraphs. Only a wholly empty
+ * composer shows it: a quote or list with an empty line after it already is
+ * content, so it keeps no hint.
+ */
+export declare function promptComposerPlaceholder(text: string): ({ editor }: {
+    editor: Editor;
+}) => string;

package/dist/esm/types/src/components/PromptComposer/promptComposerPlaceholder.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/src/tiptap/prompt-blocks/createPromptBlocksExtension.d.ts

@@ -0,0 +1,25 @@
+import { Extension, Node } from '@tiptap/core';
+import type { ResolvedPos } from '@tiptap/pm/model';
+export type CreatePromptBlocksExtensionOptions = {
+    /** Class of a locked quote and of a quote being typed. */
+    quoteClassName?: string;
+    /** Class of a bullet list. */
+    listClassName?: string;
+};
+/**
+ * Markdown-style lines in the prompt composer:
+ * - `- ` at the start of a line starts a bullet list (StarterKit's list);
+ * - `> ` starts a quote that stays editable while the caret is in it and
+ *   turns into a read-only quote block once the caret leaves.
+ *
+ * `getText()` gives both back as markdown (`- item`, `> line`).
+ * Brings its own bullet list: use StarterKit with `bulletList: false` and
+ * `listItem` and `blockquote` enabled.
+ */
+export declare function createPromptBlocksExtension({ quoteClassName, listClassName, }?: CreatePromptBlocksExtensionOptions): (Node<any, any> | Extension<any, any>)[];
+/** True when the caret is in a bullet list or a quote being typed. */
+export declare function isInPromptBlock(state: {
+    selection: {
+        $from: ResolvedPos;
+    };
+}): boolean;

package/dist/esm/types/src/tiptap/prompt-blocks/index.d.ts

@@ -0,0 +1,3 @@
+export { createPromptBlocksExtension, isInPromptBlock, } from './createPromptBlocksExtension';
+export type { CreatePromptBlocksExtensionOptions } from './createPromptBlocksExtension';
+export { PROMPT_QUOTE_NODE, promptBlocksDoc, promptBlocksFromText, promptQuoteMarkdown, } from './promptBlocksText';

package/dist/esm/types/src/tiptap/prompt-blocks/promptBlocks.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/src/tiptap/prompt-blocks/promptBlocksText.d.ts

@@ -0,0 +1,19 @@
+import type { JSONContent } from '@tiptap/core';
+/** Node name of a locked (read-only) quote block. */
+export declare const PROMPT_QUOTE_NODE = "promptQuote";
+/**
+ * Markdown quote of `text`: `> ` per line, `>` for a blank line, nothing for
+ * an empty quote (so `> ` alone does not count as a prompt).
+ */
+export declare function promptQuoteMarkdown(text: string): string;
+/**
+ * Blocks for plain `text` with `> ` lines as locked quotes and `- ` lines as
+ * a bullet list. `getText()` of the result gives `text` back (blocks are
+ * joined by a blank line, list items by a newline).
+ *
+ * Other lines stay in one paragraph with newlines, as the composer prefill
+ * always worked. A doc never ends on a quote or list: an empty line follows,
+ * so the caret can go there instead of selecting the read-only quote.
+ */
+export declare function promptBlocksFromText(text: string): JSONContent[];
+export declare function promptBlocksDoc(text: string): JSONContent;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homecode/ui",
-  "version": "5.20.19",
+  "version": "5.20.21",
   "description": "React UI components library",
   "scripts": {
     "tests": "jest",
@@ -61,6 +61,7 @@
   "dependencies": {
     "@tiptap/core": "^3.30.5",
     "@tiptap/extension-link": "^3.30.5",
+    "@tiptap/extension-list": "^3.30.5",
     "@tiptap/extension-mention": "^3.30.5",
     "@tiptap/extensions": "^3.30.5",
     "@tiptap/pm": "^3.30.5",