@meowdown/react 0.48.0 → 0.49.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +34 -0
- package/dist/index.d.ts +34 -5
- package/dist/index.js +188 -7
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -56,6 +56,40 @@ See the full API reference [here](https://npmx.dev/package-docs/@meowdown%2Freac
|
|
|
56
56
|
|
|
57
57
|
Slash menu host items can include `keywords` to match hidden terms without changing the displayed label.
|
|
58
58
|
|
|
59
|
+
### Wiki embeds
|
|
60
|
+
|
|
61
|
+
Obsidian-style wiki embeds (`![[path]]`, with optional `|width` or
|
|
62
|
+
`|widthxheight`) stay literal and editable unless the host classifies them.
|
|
63
|
+
`resolveWikiEmbed` is a pure, creation-time resolver: return an image, file, or
|
|
64
|
+
note result to reuse the corresponding Meowdown atom and its existing click
|
|
65
|
+
hook; return `undefined` for missing or ambiguous targets.
|
|
66
|
+
|
|
67
|
+
```tsx
|
|
68
|
+
<MeowdownEditor
|
|
69
|
+
initialMarkdown="![[assets/photo.png|320]]"
|
|
70
|
+
resolveWikiEmbed={({ target }) => (target.endsWith('.png') ? { kind: 'image' } : undefined)}
|
|
71
|
+
resolveImageUrl={resolveLocalImageUrl}
|
|
72
|
+
onImageClick={openLightbox}
|
|
73
|
+
/>
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
Use `EditorHandle.revealHeading('#Section%20name')` to move the selection to a
|
|
77
|
+
matching heading and scroll it into view after following a heading link.
|
|
78
|
+
|
|
79
|
+
Both `MeowdownEditor` and the read-only `MarkdownView` accept
|
|
80
|
+
`resolveFileLink`. Return `true` to render a standard `[label](path)` Markdown
|
|
81
|
+
link with the same file pill, metadata resolver, and click hook used by wiki
|
|
82
|
+
file embeds; return `false` to keep it as a normal link.
|
|
83
|
+
|
|
84
|
+
```tsx
|
|
85
|
+
<MarkdownView
|
|
86
|
+
markdown="[Quarterly report](docs/report.pdf)"
|
|
87
|
+
resolveFileLink={({ href }) => href.startsWith('docs/')}
|
|
88
|
+
resolveFileInfo={resolveLocalFileInfo}
|
|
89
|
+
onFileClick={openLocalFile}
|
|
90
|
+
/>
|
|
91
|
+
```
|
|
92
|
+
|
|
59
93
|
### Wiki-link hover cards
|
|
60
94
|
|
|
61
95
|
Mount `WikilinkHoverCard` inside `MeowdownEditor` and render host-owned preview
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ReactElement, ReactNode, Ref } from "react";
|
|
2
|
-
import { AcceptPendingReplacementOptions, ExitBoundaryHandler, FileClickHandler, FileLinkResolver, FilePasteOptions, FileViewOptions, ImageClickHandler, ImageOptions, LinkClickHandler, LinkCopyHandler, ListMarker, MarkMode, PendingReplacement, PendingReplacementOutcome, PlaceholderOptions, StartPendingReplacementOptions, TagClickHandler, TypedEditor, WikilinkClickHandler, WikilinkHoverHit } from "@meowdown/core";
|
|
2
|
+
import { AcceptPendingReplacementOptions, ExitBoundaryHandler, FileClickHandler, FileInfoResolver, FileLinkResolver, FilePasteOptions, FileViewOptions, ImageClickHandler, ImageOptions, LinkClickHandler, LinkCopyHandler, ListMarker, MarkMode, PendingReplacement, PendingReplacementOutcome, PlaceholderOptions, StartPendingReplacementOptions, TagClickHandler, TypedEditor, WikiEmbedResolver, WikilinkClickHandler, WikilinkHoverHit } from "@meowdown/core";
|
|
3
3
|
import { SelectionJSON, SelectionJSON as SelectionJSON$1 } from "@prosekit/core";
|
|
4
4
|
import { useEditor, useExtension, useKeymap } from "@prosekit/react";
|
|
5
5
|
//#region src/utils/date-format.d.ts
|
|
@@ -45,6 +45,12 @@ interface EditorHandle {
|
|
|
45
45
|
* is mapped through the change.
|
|
46
46
|
*/
|
|
47
47
|
setState: (markdown?: string, selection?: SelectionHint) => void;
|
|
48
|
+
/**
|
|
49
|
+
* Reparse the current Markdown with the editor's creation-time resolvers,
|
|
50
|
+
* preserving the selection without adding an undo-history entry. Hosts use
|
|
51
|
+
* this when data consulted by a stable resolver changes out of band.
|
|
52
|
+
*/
|
|
53
|
+
refreshMarkdownRendering: () => void;
|
|
48
54
|
/** Returns the current selection. */
|
|
49
55
|
getSelection: () => SelectionJSON$1;
|
|
50
56
|
/** Restores a selection with the same hint semantics as `setState`. */
|
|
@@ -53,6 +59,12 @@ interface EditorHandle {
|
|
|
53
59
|
focus: () => void;
|
|
54
60
|
/** Scrolls the selection into view. */
|
|
55
61
|
scrollIntoView: () => void;
|
|
62
|
+
/**
|
|
63
|
+
* Moves the selection to the first heading matching a decoded `#fragment`
|
|
64
|
+
* (case-insensitive, with whitespace collapsed) and scrolls it into view.
|
|
65
|
+
* Returns `false` when no heading matches.
|
|
66
|
+
*/
|
|
67
|
+
revealHeading: (fragment: string) => boolean;
|
|
56
68
|
/**
|
|
57
69
|
* The current selection as Markdown: block structure (list markers,
|
|
58
70
|
* headings) is serialized, and inline syntax is already literal text. A
|
|
@@ -288,6 +300,12 @@ interface EditorProps {
|
|
|
288
300
|
* changes are ignored, like `initialMarkdown`.
|
|
289
301
|
*/
|
|
290
302
|
resolveFileLink?: FileLinkResolver;
|
|
303
|
+
/**
|
|
304
|
+
* Classifies `![[target]]` as an image, file, or note atom. Return
|
|
305
|
+
* `undefined` for missing or ambiguous targets to leave the source literal
|
|
306
|
+
* and editable. Must be pure and is read once when the editor is created.
|
|
307
|
+
*/
|
|
308
|
+
resolveWikiEmbed?: WikiEmbedResolver;
|
|
291
309
|
/**
|
|
292
310
|
* Resolves the metadata (file size in bytes) shown on a file pill, directly
|
|
293
311
|
* or as a promise; the pill renders immediately and fills the size in when
|
|
@@ -374,7 +392,7 @@ interface EditorProps {
|
|
|
374
392
|
/** Nodes rendered inside the editor's ProseKit context. */
|
|
375
393
|
children?: ReactNode;
|
|
376
394
|
}
|
|
377
|
-
declare function MeowdownEditor({ mode, initialMarkdown, onDocChange, onSlashMenuSearch, onTagSearch, onWikilinkSearch, onSelectionMenuSearch, selectionMenuAffordance, pendingReplacementActions, onPendingReplacementResolve, onWikilinkClick, onLinkClick, onLinkCopy, onTagClick, onExitBoundary, resolveImageUrl, resolveFileLink, resolveFileInfo, onFileClick, onFilePaste, onFileSaveError, onImageClick, embedPaste, linkPaste, bulletAfterHeading, substitution, frontmatter, blockHandle, placeholder, readOnly, spellCheck, timeFormat, editorClassName, wrapperClassName, handleRef, children }: EditorProps): import("react").JSX.Element;
|
|
395
|
+
declare function MeowdownEditor({ mode, initialMarkdown, onDocChange, onSlashMenuSearch, onTagSearch, onWikilinkSearch, onSelectionMenuSearch, selectionMenuAffordance, pendingReplacementActions, onPendingReplacementResolve, onWikilinkClick, onLinkClick, onLinkCopy, onTagClick, onExitBoundary, resolveImageUrl, resolveFileLink, resolveWikiEmbed, resolveFileInfo, onFileClick, onFilePaste, onFileSaveError, onImageClick, embedPaste, linkPaste, bulletAfterHeading, substitution, frontmatter, blockHandle, placeholder, readOnly, spellCheck, timeFormat, editorClassName, wrapperClassName, handleRef, children }: EditorProps): import("react").JSX.Element;
|
|
378
396
|
//#endregion
|
|
379
397
|
//#region src/components/markdown-view.d.ts
|
|
380
398
|
/** Payload for {@link TaskClickHandler}. */
|
|
@@ -414,7 +432,7 @@ interface MarkdownViewProps {
|
|
|
414
432
|
/** Peel a leading YAML frontmatter block before rendering. Off by default. */
|
|
415
433
|
frontmatter?: boolean;
|
|
416
434
|
/**
|
|
417
|
-
* Whether rendered links, images, and task checkboxes can be activated.
|
|
435
|
+
* Whether rendered links, images, file pills, and task checkboxes can be activated.
|
|
418
436
|
* Defaults to `true`. When `false`, callbacks are ignored, the rendered tree
|
|
419
437
|
* contains no anchors or focusable task controls, and recognized tweet and
|
|
420
438
|
* YouTube embeds are omitted before any image resolver runs.
|
|
@@ -422,12 +440,23 @@ interface MarkdownViewProps {
|
|
|
422
440
|
interactive?: boolean;
|
|
423
441
|
/** Map an image `src` to a displayable URL, or `undefined` to skip it. */
|
|
424
442
|
resolveImageUrl?: (src: string) => string | undefined;
|
|
443
|
+
/**
|
|
444
|
+
* Claim a `[label](url)` link as a file pill instead of a regular link.
|
|
445
|
+
* Must be pure; return `false` for links that should render normally.
|
|
446
|
+
*/
|
|
447
|
+
resolveFileLink?: FileLinkResolver;
|
|
448
|
+
/** Classify `![[target]]` as an image, file, or note; unresolved source stays literal. */
|
|
449
|
+
resolveWikiEmbed?: WikiEmbedResolver;
|
|
450
|
+
/** Resolve metadata shown on a file pill. */
|
|
451
|
+
resolveFileInfo?: FileInfoResolver;
|
|
425
452
|
/** Called when a rendered wikilink is clicked. Pass a stable function. */
|
|
426
453
|
onWikilinkClick?: WikilinkClickHandler;
|
|
427
454
|
/** Called when a rendered Markdown link is clicked. Pass a stable function. */
|
|
428
455
|
onLinkClick?: LinkClickHandler;
|
|
429
456
|
/** Called when a rendered image is clicked. Pass a stable function. */
|
|
430
457
|
onImageClick?: ImageClickHandler;
|
|
458
|
+
/** Called when a rendered file pill is clicked. Pass a stable function. */
|
|
459
|
+
onFileClick?: FileClickHandler;
|
|
431
460
|
/** Called when a rendered task checkbox is clicked. Pass a stable function. */
|
|
432
461
|
onTaskClick?: TaskClickHandler;
|
|
433
462
|
/** Extra class on the content root (alongside `ProseMirror meowdown-content`). */
|
|
@@ -441,10 +470,10 @@ interface MarkdownViewProps {
|
|
|
441
470
|
* and CSS (the root carries `ProseMirror` + `data-mark-mode` so the existing
|
|
442
471
|
* stylesheet applies). Requires a DOM environment.
|
|
443
472
|
*
|
|
444
|
-
* Callbacks (`onWikilinkClick`, etc.) should be stable; pass them via
|
|
473
|
+
* Callbacks (`onWikilinkClick`, etc.) and resolvers should be stable; pass them via
|
|
445
474
|
* `useCallback` to avoid re-rendering the whole tree.
|
|
446
475
|
*/
|
|
447
|
-
declare function MarkdownView({ markdown, markMode, frontmatter, interactive, resolveImageUrl, onWikilinkClick, onLinkClick, onImageClick, onTaskClick, className }: MarkdownViewProps): ReactElement;
|
|
476
|
+
declare function MarkdownView({ markdown, markMode, frontmatter, interactive, resolveImageUrl, resolveFileLink, resolveWikiEmbed, resolveFileInfo, onWikilinkClick, onLinkClick, onImageClick, onFileClick, onTaskClick, className }: MarkdownViewProps): ReactElement;
|
|
448
477
|
//#endregion
|
|
449
478
|
//#region src/components/wikilink-hover-card.d.ts
|
|
450
479
|
/** Props for {@link WikilinkHoverCard}. */
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { clsx } from "clsx/lite";
|
|
2
2
|
import { Fragment, cloneElement, createElement, useCallback, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
3
|
-
import { buildFileMarkdown, codeBlockLanguages, defaultResolveImageUrl, defineBulletAfterHeading, defineCodeBlockPreviewPlugin, defineEditorExtension, defineEmbedPaste, defineExitBoundaryHandler, defineFileClickHandler, defineFilePaste, defineFileView, defineFollowLinkHandler, defineImage, defineImageClickHandler, defineLinkClickHandler, defineLinkEditKeymap, defineLinkHoverHandler, defineLinkPaste, definePendingReplacementHandler, definePlaceholder, defineReadonly, defineSpellCheckPlugin, defineSubstitution, defineTagClickHandler, defineWikilinkClickHandler, defineWikilinkHoverHandler, defineWikilinkTrigger, docToMarkdown, getCodeTokens, getMarkBuilders, getPendingReplacement, getSelectedText, getTableColumnAlign, getVirtualElementFromRange, inlineTextToMarkChunks, isCodeBlockPreviewHiddenDecoration, isSelectionInTableCell, listenForTweetHeight, loadKaTeX, markdownToDoc, matchEmbed, renderMathInto } from "@meowdown/core";
|
|
3
|
+
import { buildFileMarkdown, codeBlockLanguages, defaultResolveImageUrl, defineBulletAfterHeading, defineCodeBlockPreviewPlugin, defineEditorExtension, defineEmbedPaste, defineExitBoundaryHandler, defineFileClickHandler, defineFilePaste, defineFileView, defineFollowLinkHandler, defineImage, defineImageClickHandler, defineLinkClickHandler, defineLinkEditKeymap, defineLinkHoverHandler, defineLinkPaste, definePendingReplacementHandler, definePlaceholder, defineReadonly, defineSpellCheckPlugin, defineSubstitution, defineTagClickHandler, defineWikilinkClickHandler, defineWikilinkHoverHandler, defineWikilinkTrigger, docToMarkdown, formatFileSize, getCodeTokens, getFileKind, getMarkBuilders, getPendingReplacement, getSelectedText, getTableColumnAlign, getVirtualElementFromRange, inlineTextToMarkChunks, isCodeBlockPreviewHiddenDecoration, isSelectionInTableCell, listenForTweetHeight, loadKaTeX, markdownToDoc, matchEmbed, renderMathInto } from "@meowdown/core";
|
|
4
4
|
import { clamp } from "@ocavue/utils";
|
|
5
5
|
import { canUseRegexLookbehind, createEditor, defineDocChangeHandler, defineUpdateHandler, isTextSelection, union } from "@prosekit/core";
|
|
6
6
|
import { Selection, TextSelection } from "@prosekit/pm/state";
|
|
@@ -1545,10 +1545,77 @@ function resolveSelection(doc, selection) {
|
|
|
1545
1545
|
return TextSelection.between(doc.resolve(anchor), doc.resolve(head));
|
|
1546
1546
|
}
|
|
1547
1547
|
}
|
|
1548
|
-
function
|
|
1548
|
+
function decodeHeadingFragment(fragment) {
|
|
1549
|
+
const source = fragment.startsWith("#") ? fragment.slice(1) : fragment;
|
|
1550
|
+
try {
|
|
1551
|
+
return decodeURIComponent(source);
|
|
1552
|
+
} catch {
|
|
1553
|
+
return source;
|
|
1554
|
+
}
|
|
1555
|
+
}
|
|
1556
|
+
function headingLookupKey(value) {
|
|
1557
|
+
return value.normalize("NFKC").trim().replaceAll(/\s+/g, " ").toLowerCase();
|
|
1558
|
+
}
|
|
1559
|
+
const HEADING_HIDDEN_MARKS = /* @__PURE__ */ new Set([
|
|
1560
|
+
"mdMark",
|
|
1561
|
+
"mdLinkUri",
|
|
1562
|
+
"mdLinkTitle"
|
|
1563
|
+
]);
|
|
1564
|
+
const HEADING_ATOM_MARKS = /* @__PURE__ */ new Set([
|
|
1565
|
+
"mdWikilink",
|
|
1566
|
+
"mdImage",
|
|
1567
|
+
"mdFile",
|
|
1568
|
+
"mdMath"
|
|
1569
|
+
]);
|
|
1570
|
+
function headingAtomText(mark) {
|
|
1571
|
+
const attrs = mark.attrs;
|
|
1572
|
+
const stringAttr = (name) => {
|
|
1573
|
+
const value = attrs[name];
|
|
1574
|
+
return typeof value === "string" ? value : "";
|
|
1575
|
+
};
|
|
1576
|
+
if (mark.type.name === "mdWikilink") return stringAttr("display") || stringAttr("target");
|
|
1577
|
+
if (mark.type.name === "mdImage") return stringAttr("alt");
|
|
1578
|
+
if (mark.type.name === "mdFile") return stringAttr("name");
|
|
1579
|
+
if (mark.type.name === "mdMath") return stringAttr("formula");
|
|
1580
|
+
return "";
|
|
1581
|
+
}
|
|
1582
|
+
/** The heading as its live-preview marks display it, with syntax runs omitted. */
|
|
1583
|
+
function headingDisplayText(heading) {
|
|
1584
|
+
let output = "";
|
|
1585
|
+
let previousAtom;
|
|
1586
|
+
heading.forEach((child) => {
|
|
1587
|
+
if (!child.isText || !child.text) return;
|
|
1588
|
+
const atom = child.marks.find((mark) => HEADING_ATOM_MARKS.has(mark.type.name));
|
|
1589
|
+
if (atom) {
|
|
1590
|
+
if (!previousAtom?.eq(atom)) output += headingAtomText(atom);
|
|
1591
|
+
previousAtom = atom;
|
|
1592
|
+
return;
|
|
1593
|
+
}
|
|
1594
|
+
previousAtom = void 0;
|
|
1595
|
+
if (child.marks.some((mark) => HEADING_HIDDEN_MARKS.has(mark.type.name))) return;
|
|
1596
|
+
output += child.text;
|
|
1597
|
+
});
|
|
1598
|
+
return output;
|
|
1599
|
+
}
|
|
1600
|
+
function findHeadingPosition(doc, fragment) {
|
|
1601
|
+
const target = headingLookupKey(decodeHeadingFragment(fragment));
|
|
1602
|
+
if (!target) return;
|
|
1603
|
+
let match;
|
|
1604
|
+
doc.descendants((node, pos) => {
|
|
1605
|
+
if (match != null) return false;
|
|
1606
|
+
if (node.type.name === "heading" && (headingLookupKey(node.textContent) === target || headingLookupKey(headingDisplayText(node)) === target)) {
|
|
1607
|
+
match = pos + 1;
|
|
1608
|
+
return false;
|
|
1609
|
+
}
|
|
1610
|
+
return true;
|
|
1611
|
+
});
|
|
1612
|
+
return match;
|
|
1613
|
+
}
|
|
1614
|
+
function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onSlashMenuSearch, onTagSearch, onWikilinkSearch, onSelectionMenuSearch, selectionMenuAffordance = true, pendingReplacementActions, onPendingReplacementResolve, onWikilinkClick, onLinkClick, onLinkCopy, onTagClick, onExitBoundary, resolveImageUrl, resolveFileLink, resolveWikiEmbed, resolveFileInfo, onFileClick, onFilePaste, onFileSaveError, onImageClick, embedPaste, linkPaste, bulletAfterHeading, substitution = true, frontmatter = false, blockHandle = true, placeholder, readOnly, spellCheck, timeFormat, editorClassName, ref, children }) {
|
|
1549
1615
|
const [editor] = useState(() => {
|
|
1550
1616
|
const editor = createEditor({ extension: union(defineEditorExtension({
|
|
1551
1617
|
resolveFileLink,
|
|
1618
|
+
resolveWikiEmbed,
|
|
1552
1619
|
markMode
|
|
1553
1620
|
}), defineCodeBlockView()) });
|
|
1554
1621
|
if (initialMarkdown) editor.setContent(markdownToDoc(initialMarkdown, {
|
|
@@ -1584,7 +1651,7 @@ function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onSl
|
|
|
1584
1651
|
function getState() {
|
|
1585
1652
|
return [getMarkdown(), getSelection()];
|
|
1586
1653
|
}
|
|
1587
|
-
function
|
|
1654
|
+
function replaceState(markdown, selection, addToHistory = true) {
|
|
1588
1655
|
if (markdown == null && !selection) return;
|
|
1589
1656
|
const transaction = editor.state.tr;
|
|
1590
1657
|
if (markdown != null) {
|
|
@@ -1595,6 +1662,7 @@ function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onSl
|
|
|
1595
1662
|
transaction.replaceWith(0, transaction.doc.content.size, doc.content);
|
|
1596
1663
|
}
|
|
1597
1664
|
if (selection) transaction.setSelection(resolveSelection(transaction.doc, selection)).scrollIntoView();
|
|
1665
|
+
if (!addToHistory) transaction.setMeta("addToHistory", false);
|
|
1598
1666
|
suppressDocChangeRef.current = true;
|
|
1599
1667
|
try {
|
|
1600
1668
|
editor.view.dispatch(transaction);
|
|
@@ -1602,9 +1670,16 @@ function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onSl
|
|
|
1602
1670
|
suppressDocChangeRef.current = false;
|
|
1603
1671
|
}
|
|
1604
1672
|
}
|
|
1673
|
+
function setState(markdown, selection) {
|
|
1674
|
+
replaceState(markdown, selection);
|
|
1675
|
+
}
|
|
1605
1676
|
function setMarkdown(markdown) {
|
|
1606
1677
|
setState(markdown);
|
|
1607
1678
|
}
|
|
1679
|
+
function refreshMarkdownRendering() {
|
|
1680
|
+
const [markdown, selection] = getState();
|
|
1681
|
+
replaceState(markdown, selection, false);
|
|
1682
|
+
}
|
|
1608
1683
|
function insertMarkdown(markdown) {
|
|
1609
1684
|
editor.commands.insertMarkdown(markdown);
|
|
1610
1685
|
}
|
|
@@ -1617,6 +1692,13 @@ function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onSl
|
|
|
1617
1692
|
function scrollIntoView() {
|
|
1618
1693
|
editor.commands.scrollIntoView();
|
|
1619
1694
|
}
|
|
1695
|
+
function revealHeading(fragment) {
|
|
1696
|
+
const position = findHeadingPosition(editor.state.doc, fragment);
|
|
1697
|
+
if (position == null) return false;
|
|
1698
|
+
const selection = TextSelection.near(editor.state.doc.resolve(position));
|
|
1699
|
+
editor.view.dispatch(editor.state.tr.setSelection(selection).scrollIntoView());
|
|
1700
|
+
return true;
|
|
1701
|
+
}
|
|
1620
1702
|
function getSelectedTextFromState() {
|
|
1621
1703
|
return getSelectedText(editor.state);
|
|
1622
1704
|
}
|
|
@@ -1642,10 +1724,12 @@ function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onSl
|
|
|
1642
1724
|
insertMarkdown,
|
|
1643
1725
|
getState,
|
|
1644
1726
|
setState,
|
|
1727
|
+
refreshMarkdownRendering,
|
|
1645
1728
|
getSelection,
|
|
1646
1729
|
setSelection,
|
|
1647
1730
|
focus,
|
|
1648
1731
|
scrollIntoView,
|
|
1732
|
+
revealHeading,
|
|
1649
1733
|
getSelectedText: getSelectedTextFromState,
|
|
1650
1734
|
openSelectionMenu: openSelectionMenuFromHandle,
|
|
1651
1735
|
startPendingReplacement,
|
|
@@ -1729,7 +1813,7 @@ function ProseKitEditor({ markMode = "focus", initialMarkdown, onDocChange, onSl
|
|
|
1729
1813
|
|
|
1730
1814
|
//#endregion
|
|
1731
1815
|
//#region src/components/editor.tsx
|
|
1732
|
-
function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onSlashMenuSearch, onTagSearch, onWikilinkSearch, onSelectionMenuSearch, selectionMenuAffordance = true, pendingReplacementActions, onPendingReplacementResolve, onWikilinkClick, onLinkClick, onLinkCopy, onTagClick, onExitBoundary, resolveImageUrl, resolveFileLink, resolveFileInfo, onFileClick, onFilePaste, onFileSaveError, onImageClick, embedPaste = true, linkPaste = true, bulletAfterHeading = false, substitution = true, frontmatter = false, blockHandle = true, placeholder, readOnly, spellCheck, timeFormat, editorClassName, wrapperClassName, handleRef, children }) {
|
|
1816
|
+
function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onSlashMenuSearch, onTagSearch, onWikilinkSearch, onSelectionMenuSearch, selectionMenuAffordance = true, pendingReplacementActions, onPendingReplacementResolve, onWikilinkClick, onLinkClick, onLinkCopy, onTagClick, onExitBoundary, resolveImageUrl, resolveFileLink, resolveWikiEmbed, resolveFileInfo, onFileClick, onFilePaste, onFileSaveError, onImageClick, embedPaste = true, linkPaste = true, bulletAfterHeading = false, substitution = true, frontmatter = false, blockHandle = true, placeholder, readOnly, spellCheck, timeFormat, editorClassName, wrapperClassName, handleRef, children }) {
|
|
1733
1817
|
const childRef = useRef(null);
|
|
1734
1818
|
useImperativeHandle(handleRef, () => {
|
|
1735
1819
|
function getMarkdown() {
|
|
@@ -1751,6 +1835,9 @@ function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onSlashM
|
|
|
1751
1835
|
function setState(markdown, selection) {
|
|
1752
1836
|
childRef.current?.setState(markdown, selection);
|
|
1753
1837
|
}
|
|
1838
|
+
function refreshMarkdownRendering() {
|
|
1839
|
+
childRef.current?.refreshMarkdownRendering();
|
|
1840
|
+
}
|
|
1754
1841
|
function getSelection() {
|
|
1755
1842
|
return childRef.current?.getSelection() ?? {
|
|
1756
1843
|
type: "text",
|
|
@@ -1767,6 +1854,9 @@ function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onSlashM
|
|
|
1767
1854
|
function scrollIntoView() {
|
|
1768
1855
|
childRef.current?.scrollIntoView();
|
|
1769
1856
|
}
|
|
1857
|
+
function revealHeading(fragment) {
|
|
1858
|
+
return childRef.current?.revealHeading(fragment) ?? false;
|
|
1859
|
+
}
|
|
1770
1860
|
function getSelectedText() {
|
|
1771
1861
|
return childRef.current?.getSelectedText() ?? "";
|
|
1772
1862
|
}
|
|
@@ -1791,10 +1881,12 @@ function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onSlashM
|
|
|
1791
1881
|
insertMarkdown,
|
|
1792
1882
|
getState,
|
|
1793
1883
|
setState,
|
|
1884
|
+
refreshMarkdownRendering,
|
|
1794
1885
|
getSelection,
|
|
1795
1886
|
setSelection,
|
|
1796
1887
|
focus,
|
|
1797
1888
|
scrollIntoView,
|
|
1889
|
+
revealHeading,
|
|
1798
1890
|
getSelectedText,
|
|
1799
1891
|
openSelectionMenu,
|
|
1800
1892
|
startPendingReplacement,
|
|
@@ -1827,6 +1919,7 @@ function MeowdownEditor({ mode = "focus", initialMarkdown, onDocChange, onSlashM
|
|
|
1827
1919
|
onExitBoundary,
|
|
1828
1920
|
resolveImageUrl,
|
|
1829
1921
|
resolveFileLink,
|
|
1922
|
+
resolveWikiEmbed,
|
|
1830
1923
|
resolveFileInfo,
|
|
1831
1924
|
onFileClick,
|
|
1832
1925
|
onFilePaste,
|
|
@@ -2039,6 +2132,74 @@ function ImageView(props) {
|
|
|
2039
2132
|
})]
|
|
2040
2133
|
});
|
|
2041
2134
|
}
|
|
2135
|
+
function FileView(props) {
|
|
2136
|
+
const { href, name, context, children } = props;
|
|
2137
|
+
const resolveFileInfo = context.resolveFileInfo;
|
|
2138
|
+
const [resolvedSize, setResolvedSize] = useState();
|
|
2139
|
+
useEffect(() => {
|
|
2140
|
+
if (!resolveFileInfo) return;
|
|
2141
|
+
let active = true;
|
|
2142
|
+
const load = async () => {
|
|
2143
|
+
try {
|
|
2144
|
+
const info = await resolveFileInfo(href);
|
|
2145
|
+
if (!active || info?.size == null || !Number.isFinite(info.size) || info.size < 0) return;
|
|
2146
|
+
setResolvedSize({
|
|
2147
|
+
href,
|
|
2148
|
+
resolver: resolveFileInfo,
|
|
2149
|
+
text: formatFileSize(info.size)
|
|
2150
|
+
});
|
|
2151
|
+
} catch (error) {
|
|
2152
|
+
console.error("[meowdown] resolveFileInfo failed:", error);
|
|
2153
|
+
}
|
|
2154
|
+
};
|
|
2155
|
+
load();
|
|
2156
|
+
return () => {
|
|
2157
|
+
active = false;
|
|
2158
|
+
};
|
|
2159
|
+
}, [resolveFileInfo, href]);
|
|
2160
|
+
const size = resolvedSize?.href === href && resolvedSize.resolver === resolveFileInfo ? resolvedSize.text : "";
|
|
2161
|
+
const handleClick = context.onFileClick ? (event) => context.onFileClick?.({
|
|
2162
|
+
href,
|
|
2163
|
+
name,
|
|
2164
|
+
event: event.nativeEvent
|
|
2165
|
+
}) : void 0;
|
|
2166
|
+
return /* @__PURE__ */ jsxs("span", {
|
|
2167
|
+
className: "md-file-view md-atom-view",
|
|
2168
|
+
children: [/* @__PURE__ */ jsxs("span", {
|
|
2169
|
+
className: "md-file-view-preview md-atom-view-preview",
|
|
2170
|
+
"data-testid": "file-pill",
|
|
2171
|
+
"data-file-kind": getFileKind(href),
|
|
2172
|
+
contentEditable: false,
|
|
2173
|
+
title: name,
|
|
2174
|
+
onClick: handleClick,
|
|
2175
|
+
children: [
|
|
2176
|
+
/* @__PURE__ */ jsxs("svg", {
|
|
2177
|
+
className: "md-file-view-icon",
|
|
2178
|
+
viewBox: "0 0 24 24",
|
|
2179
|
+
"aria-hidden": "true",
|
|
2180
|
+
fill: "none",
|
|
2181
|
+
stroke: "currentColor",
|
|
2182
|
+
strokeWidth: "2",
|
|
2183
|
+
strokeLinecap: "round",
|
|
2184
|
+
strokeLinejoin: "round",
|
|
2185
|
+
children: [/* @__PURE__ */ jsx("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }), /* @__PURE__ */ jsx("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" })]
|
|
2186
|
+
}),
|
|
2187
|
+
/* @__PURE__ */ jsx("span", {
|
|
2188
|
+
className: "md-file-view-name",
|
|
2189
|
+
children: name
|
|
2190
|
+
}),
|
|
2191
|
+
/* @__PURE__ */ jsx("span", {
|
|
2192
|
+
className: "md-file-view-size",
|
|
2193
|
+
"data-testid": "file-pill-size",
|
|
2194
|
+
children: size
|
|
2195
|
+
})
|
|
2196
|
+
]
|
|
2197
|
+
}), /* @__PURE__ */ jsx("span", {
|
|
2198
|
+
className: "md-file-view-content md-atom-view-content",
|
|
2199
|
+
children
|
|
2200
|
+
})]
|
|
2201
|
+
});
|
|
2202
|
+
}
|
|
2042
2203
|
function renderTokens(code, tokens) {
|
|
2043
2204
|
const out = [];
|
|
2044
2205
|
let pos = 0;
|
|
@@ -2140,6 +2301,15 @@ function wrapMark(mark, children, context) {
|
|
|
2140
2301
|
children
|
|
2141
2302
|
});
|
|
2142
2303
|
}
|
|
2304
|
+
case "mdFile": {
|
|
2305
|
+
const attrs = mark.attrs;
|
|
2306
|
+
return /* @__PURE__ */ jsx(FileView, {
|
|
2307
|
+
href: attrs.href,
|
|
2308
|
+
name: attrs.name,
|
|
2309
|
+
context,
|
|
2310
|
+
children
|
|
2311
|
+
});
|
|
2312
|
+
}
|
|
2143
2313
|
case "mdMath": {
|
|
2144
2314
|
const attrs = mark.attrs;
|
|
2145
2315
|
return /* @__PURE__ */ jsx(MathView, {
|
|
@@ -2200,7 +2370,10 @@ function renderRuns(runs, depth, context) {
|
|
|
2200
2370
|
function renderInline(node, context) {
|
|
2201
2371
|
const text = node.textContent;
|
|
2202
2372
|
if (!text) return null;
|
|
2203
|
-
return renderRuns(inlineTextToMarkChunks(getMarkBuilders(), text
|
|
2373
|
+
return renderRuns(inlineTextToMarkChunks(getMarkBuilders(), text, {
|
|
2374
|
+
resolveFileLink: context.resolveFileLink,
|
|
2375
|
+
resolveWikiEmbed: context.resolveWikiEmbed
|
|
2376
|
+
}).map(([from, to, marks]) => ({
|
|
2204
2377
|
text: text.slice(from, to),
|
|
2205
2378
|
marks: Mark.setFrom(marks)
|
|
2206
2379
|
})), 0, context);
|
|
@@ -2256,18 +2429,22 @@ function renderBlock(node, context) {
|
|
|
2256
2429
|
* and CSS (the root carries `ProseMirror` + `data-mark-mode` so the existing
|
|
2257
2430
|
* stylesheet applies). Requires a DOM environment.
|
|
2258
2431
|
*
|
|
2259
|
-
* Callbacks (`onWikilinkClick`, etc.) should be stable; pass them via
|
|
2432
|
+
* Callbacks (`onWikilinkClick`, etc.) and resolvers should be stable; pass them via
|
|
2260
2433
|
* `useCallback` to avoid re-rendering the whole tree.
|
|
2261
2434
|
*/
|
|
2262
|
-
function MarkdownView({ markdown, markMode = "hide", frontmatter = false, interactive = true, resolveImageUrl, onWikilinkClick, onLinkClick, onImageClick, onTaskClick, className }) {
|
|
2435
|
+
function MarkdownView({ markdown, markMode = "hide", frontmatter = false, interactive = true, resolveImageUrl, resolveFileLink, resolveWikiEmbed, resolveFileInfo, onWikilinkClick, onLinkClick, onImageClick, onFileClick, onTaskClick, className }) {
|
|
2263
2436
|
const content = useMemo(() => {
|
|
2264
2437
|
const doc = markdownToDoc(markdown, { frontmatter });
|
|
2265
2438
|
const context = {
|
|
2266
2439
|
interactive,
|
|
2267
2440
|
resolveImageUrl,
|
|
2441
|
+
resolveFileLink,
|
|
2442
|
+
resolveWikiEmbed,
|
|
2443
|
+
resolveFileInfo,
|
|
2268
2444
|
onWikilinkClick: interactive ? onWikilinkClick : void 0,
|
|
2269
2445
|
onLinkClick: interactive ? onLinkClick : void 0,
|
|
2270
2446
|
onImageClick: interactive ? onImageClick : void 0,
|
|
2447
|
+
onFileClick: interactive ? onFileClick : void 0,
|
|
2271
2448
|
onTaskClick: interactive ? onTaskClick : void 0,
|
|
2272
2449
|
taskCounter: { value: 0 },
|
|
2273
2450
|
keyCounter: { value: 0 }
|
|
@@ -2278,9 +2455,13 @@ function MarkdownView({ markdown, markMode = "hide", frontmatter = false, intera
|
|
|
2278
2455
|
frontmatter,
|
|
2279
2456
|
interactive,
|
|
2280
2457
|
resolveImageUrl,
|
|
2458
|
+
resolveFileLink,
|
|
2459
|
+
resolveWikiEmbed,
|
|
2460
|
+
resolveFileInfo,
|
|
2281
2461
|
onWikilinkClick,
|
|
2282
2462
|
onLinkClick,
|
|
2283
2463
|
onImageClick,
|
|
2464
|
+
onFileClick,
|
|
2284
2465
|
onTaskClick
|
|
2285
2466
|
]);
|
|
2286
2467
|
return /* @__PURE__ */ jsx("div", {
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@meowdown/react",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.49.0",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"clsx": "^2.1.1",
|
|
27
27
|
"lucide-react": "^1.24.0",
|
|
28
28
|
"react-property": "^2.0.2",
|
|
29
|
-
"@meowdown/core": "0.
|
|
29
|
+
"@meowdown/core": "0.49.0"
|
|
30
30
|
},
|
|
31
31
|
"peerDependencies": {
|
|
32
32
|
"react": "^19.0.0",
|