@dxpos/markdown 0.0.1

package/dist/editor/toolbar/items.d.ts

@@ -0,0 +1,10 @@
+export declare const DEFAULT_TOOLBAR: readonly ["paragraph", "h1", "h2", "h3", "h4", "h5", "h6", "divider", "bold", "italic", "strike", "highlight", "color", "textStyle", "divider", "list:bullet", "list:ordered", "quote", "code", "divider", "align:left", "align:center", "align:right", "align:justify", "divider", "link", "table", "image", "video", "spacer", "undo", "redo"];
+export type ToolbarItem = (typeof DEFAULT_TOOLBAR)[number] | "theme";
+export type UploadFileType = "image" | "video" | "file";
+export type UploadFileResult = {
+    id: number | string;
+    url: string;
+    extra: Record<string, any>;
+};
+export type UploadFile = (file: File, type: UploadFileType) => Promise<UploadFileResult>;
+//# sourceMappingURL=items.d.ts.map

package/dist/editor/toolbar/items.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"items.d.ts","sourceRoot":"","sources":["../../../src/editor/toolbar/items.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,kVAiClB,CAAC;AAEX,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,GAAG,OAAO,CAAC;AAErE,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAExD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,KAAK,OAAO,CAAC,gBAAgB,CAAC,CAAC"}

package/dist/editor/toolbar/items.js

@@ -0,0 +1,34 @@
+export const DEFAULT_TOOLBAR = [
+    "paragraph",
+    "h1",
+    "h2",
+    "h3",
+    "h4",
+    "h5",
+    "h6",
+    "divider",
+    "bold",
+    "italic",
+    "strike",
+    "highlight",
+    "color",
+    "textStyle",
+    "divider",
+    "list:bullet",
+    "list:ordered",
+    "quote",
+    "code",
+    "divider",
+    "align:left",
+    "align:center",
+    "align:right",
+    "align:justify",
+    "divider",
+    "link",
+    "table",
+    "image",
+    "video",
+    "spacer",
+    "undo",
+    "redo",
+];

package/dist/editor/toolbar/theme.d.ts

@@ -0,0 +1,8 @@
+export declare const THEME_STORAGE_KEY = "kb-theme";
+export type ColorTheme = "light" | "dark";
+export type ThemePreference = ColorTheme | "system";
+export declare const isColorTheme: (value: string | null) => value is ColorTheme;
+/** 未手动选择时不写 data-theme，交给系统 prefers-color-scheme */
+export declare const applyThemePreference: (preference: ThemePreference) => void;
+export declare const resolveColorTheme: (preference: ThemePreference) => ColorTheme;
+//# sourceMappingURL=theme.d.ts.map

package/dist/editor/toolbar/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/editor/toolbar/theme.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iBAAiB,aAAa,CAAC;AAE5C,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;AAC1C,MAAM,MAAM,eAAe,GAAG,UAAU,GAAG,QAAQ,CAAC;AAEpD,eAAO,MAAM,YAAY,GAAI,OAAO,MAAM,GAAG,IAAI,KAAG,KAAK,IAAI,UAE5D,CAAC;AAEF,oDAAoD;AACpD,eAAO,MAAM,oBAAoB,GAAI,YAAY,eAAe,SAM/D,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,YAAY,eAAe,KAAG,UAK/D,CAAC"}

package/dist/editor/toolbar/theme.js

@@ -0,0 +1,18 @@
+export const THEME_STORAGE_KEY = "kb-theme";
+export const isColorTheme = (value) => {
+    return value === "light" || value === "dark";
+};
+/** 未手动选择时不写 data-theme，交给系统 prefers-color-scheme */
+export const applyThemePreference = (preference) => {
+    if (preference === "system") {
+        document.documentElement.removeAttribute("data-theme");
+        return;
+    }
+    document.documentElement.dataset.theme = preference;
+};
+export const resolveColorTheme = (preference) => {
+    if (preference !== "system") {
+        return preference;
+    }
+    return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+};

package/dist/editor/toolbar-items.d.ts

@@ -0,0 +1,10 @@
+export declare const DEFAULT_TOOLBAR: readonly ["paragraph", "h1", "h2", "h3", "h4", "h5", "h6", "divider", "bold", "italic", "strike", "highlight", "color", "textStyle", "divider", "list:bullet", "list:ordered", "quote", "code", "divider", "align:left", "align:center", "align:right", "align:justify", "divider", "link", "table", "image", "video", "spacer", "undo", "redo"];
+export type ToolbarItem = (typeof DEFAULT_TOOLBAR)[number] | "theme";
+export type UploadFileType = "image" | "video" | "file";
+export type UploadFileResult = {
+    id: number | string;
+    url: string;
+    extra: Record<string, any>;
+};
+export type UploadFile = (file: File, type: UploadFileType) => Promise<UploadFileResult>;
+//# sourceMappingURL=toolbar-items.d.ts.map

package/dist/editor/toolbar-items.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar-items.d.ts","sourceRoot":"","sources":["../../src/editor/toolbar-items.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,kVAiClB,CAAC;AAEX,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,GAAG,OAAO,CAAC;AAErE,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAExD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,KAAK,OAAO,CAAC,gBAAgB,CAAC,CAAC"}

package/dist/editor/toolbar-items.js

@@ -0,0 +1,34 @@
+export const DEFAULT_TOOLBAR = [
+    "paragraph",
+    "h1",
+    "h2",
+    "h3",
+    "h4",
+    "h5",
+    "h6",
+    "divider",
+    "bold",
+    "italic",
+    "strike",
+    "highlight",
+    "color",
+    "textStyle",
+    "divider",
+    "list:bullet",
+    "list:ordered",
+    "quote",
+    "code",
+    "divider",
+    "align:left",
+    "align:center",
+    "align:right",
+    "align:justify",
+    "divider",
+    "link",
+    "table",
+    "image",
+    "video",
+    "spacer",
+    "undo",
+    "redo",
+];

package/dist/editor/toolbar.d.ts

@@ -0,0 +1,16 @@
+import type { Editor } from "@tiptap/react";
+import { type ToolbarItem } from "./toolbar-items";
+type ToolbarProps = {
+    editor: Editor;
+    items: readonly ToolbarItem[];
+    uploading: boolean;
+    videoOpen: boolean;
+    videoError: string | null;
+    onInsertImage: () => void;
+    onVideoOpenChange: (open: boolean) => void;
+    onUploadVideo: () => void;
+    onInsertVideoUrl: (url: string) => void;
+};
+export declare function Toolbar({ editor, items, uploading, videoOpen, videoError, onInsertImage, onVideoOpenChange, onUploadVideo, onInsertVideoUrl, }: ToolbarProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=Toolbar.d.ts.map

package/dist/editor/toolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../src/editor/Toolbar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAiD5C,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAcpE,KAAK,YAAY,GAAG;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,SAAS,WAAW,EAAE,CAAC;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,iBAAiB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,gBAAgB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC,CAAC;AAuEF,wBAAgB,OAAO,CAAC,EACtB,MAAM,EACN,KAAuB,EACvB,SAAS,EACT,SAAS,EACT,UAAU,EACV,aAAa,EACb,iBAAiB,EACjB,aAAa,EACb,gBAAgB,GACjB,EAAE,YAAY,+BAmXd"}

package/dist/editor/toolbar.js

@@ -0,0 +1,206 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEditorState } from "@tiptap/react";
+import { AlignCenter, AlignJustify, AlignLeft, AlignRight, Baseline, Bold, Code, Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, Highlighter, ImageIcon, Italic, Link as LinkIcon, List, ListOrdered, Loader2, Moon, Pilcrow, Quote, Redo2, Strikethrough, Sun, Table, Undo2, } from "lucide-react";
+import { useEffect, useState } from "react";
+import { ColorMenu, PRESET_HIGHLIGHT_COLORS, PRESET_TEXT_COLORS } from "./ColorMenu";
+import { TextStyleMenu } from "./TextStyleMenu";
+import { readCustomTextColors, rememberCustomTextColor, removeCustomTextColor, writeCustomTextColors, } from "./text-color-presets";
+import { applyThemePreference, isColorTheme, resolveColorTheme, THEME_STORAGE_KEY, } from "./theme";
+import { DEFAULT_TOOLBAR } from "./toolbar-items";
+import { VideoMenu } from "./VideoMenu";
+const HEADING_ICONS = {
+    1: Heading1,
+    2: Heading2,
+    3: Heading3,
+    4: Heading4,
+    5: Heading5,
+    6: Heading6,
+};
+function ToolbarButton({ title, active, disabled, onClick, children }) {
+    return (_jsx("button", { className: `icon-btn icon-btn--ghost toolbar__btn${active ? " toolbar__btn--active" : ""}`, type: "button", title: title, "aria-label": title, "aria-pressed": active, disabled: disabled, onClick: onClick, children: children }));
+}
+function useToolbarTheme() {
+    const [preference, setPreference] = useState("system");
+    const [resolved, setResolved] = useState("light");
+    useEffect(() => {
+        const stored = localStorage.getItem(THEME_STORAGE_KEY);
+        const next = isColorTheme(stored) ? stored : "system";
+        setPreference(next);
+        setResolved(resolveColorTheme(next));
+        applyThemePreference(next);
+    }, []);
+    useEffect(() => {
+        const media = window.matchMedia("(prefers-color-scheme: dark)");
+        const sync = () => setResolved(resolveColorTheme(preference));
+        media.addEventListener("change", sync);
+        return () => media.removeEventListener("change", sync);
+    }, [preference]);
+    const toggle = () => {
+        const next = resolved === "dark" ? "light" : "dark";
+        localStorage.setItem(THEME_STORAGE_KEY, next);
+        setPreference(next);
+        setResolved(next);
+        applyThemePreference(next);
+    };
+    return { resolved, toggle };
+}
+function textStyleValue(value) {
+    return typeof value === "string" && value ? value : null;
+}
+function headingLevel(item) {
+    if (!item.startsWith("h")) {
+        return null;
+    }
+    const level = Number(item.slice(1));
+    if (level < 1 || level > 6) {
+        return null;
+    }
+    return level;
+}
+export function Toolbar({ editor, items = DEFAULT_TOOLBAR, uploading, videoOpen, videoError, onInsertImage, onVideoOpenChange, onUploadVideo, onInsertVideoUrl, }) {
+    const { resolved, toggle } = useToolbarTheme();
+    const [customTextColors, setCustomTextColors] = useState([]);
+    const state = useEditorState({
+        editor,
+        selector: (ctx) => ({
+            canUndo: ctx.editor.can().undo(),
+            canRedo: ctx.editor.can().redo(),
+            isParagraph: ctx.editor.isActive("paragraph"),
+            headingLevels: [1, 2, 3, 4, 5, 6].map((level) => ctx.editor.isActive("heading", { level })),
+            isBold: ctx.editor.isActive("bold"),
+            isItalic: ctx.editor.isActive("italic"),
+            isStrike: ctx.editor.isActive("strike"),
+            isHighlight: ctx.editor.isActive("highlight"),
+            highlightColor: ctx.editor.getAttributes("highlight").color ?? null,
+            textColor: textStyleValue(ctx.editor.getAttributes("textStyle").color),
+            fontFamily: textStyleValue(ctx.editor.getAttributes("textStyle").fontFamily),
+            fontSize: textStyleValue(ctx.editor.getAttributes("textStyle").fontSize),
+            letterSpacing: textStyleValue(ctx.editor.getAttributes("textStyle").letterSpacing),
+            lineHeight: textStyleValue(ctx.editor.getAttributes("textStyle").lineHeight),
+            isBulletList: ctx.editor.isActive("bulletList"),
+            isOrderedList: ctx.editor.isActive("orderedList"),
+            isBlockquote: ctx.editor.isActive("blockquote"),
+            isCodeBlock: ctx.editor.isActive("codeBlock"),
+            isAlignLeft: ctx.editor.isActive({ textAlign: "left" }),
+            isAlignCenter: ctx.editor.isActive({ textAlign: "center" }),
+            isAlignRight: ctx.editor.isActive({ textAlign: "right" }),
+            isAlignJustify: ctx.editor.isActive({ textAlign: "justify" }),
+            isLink: ctx.editor.isActive("link"),
+        }),
+    });
+    useEffect(() => {
+        setCustomTextColors(readCustomTextColors());
+    }, []);
+    const setLink = () => {
+        const url = window.prompt("链接地址", editor.getAttributes("link").href ?? "");
+        if (url === null) {
+            return;
+        }
+        if (url === "") {
+            editor.chain().focus().unsetLink().run();
+            return;
+        }
+        editor.chain().focus().extendMarkRange("link").setLink({ href: url }).run();
+    };
+    const renderItem = (item, index) => {
+        const level = headingLevel(item);
+        if (level) {
+            const Icon = HEADING_ICONS[level];
+            return (_jsx(ToolbarButton, { title: `标题 ${level}`, active: state.headingLevels[level - 1], onClick: () => editor.chain().focus().toggleHeading({ level }).run(), children: _jsx(Icon, { "aria-hidden": true }) }, `${item}-${index}`));
+        }
+        switch (item) {
+            case "divider":
+                return _jsx("span", { className: "toolbar__divider" }, `${item}-${index}`);
+            case "spacer":
+                return _jsx("span", { className: "toolbar__spacer" }, `${item}-${index}`);
+            case "paragraph":
+                return (_jsx(ToolbarButton, { title: "\u6BB5\u843D", active: state.isParagraph, onClick: () => editor.chain().focus().setParagraph().run(), children: _jsx(Pilcrow, { "aria-hidden": true }) }, item));
+            case "bold":
+                return (_jsx(ToolbarButton, { title: "\u7C97\u4F53", active: state.isBold, onClick: () => editor.chain().focus().toggleBold().run(), children: _jsx(Bold, { "aria-hidden": true }) }, item));
+            case "italic":
+                return (_jsx(ToolbarButton, { title: "\u659C\u4F53", active: state.isItalic, onClick: () => editor.chain().focus().toggleItalic().run(), children: _jsx(Italic, { "aria-hidden": true }) }, item));
+            case "strike":
+                return (_jsx(ToolbarButton, { title: "\u5220\u9664\u7EBF", active: state.isStrike, onClick: () => editor.chain().focus().toggleStrike().run(), children: _jsx(Strikethrough, { "aria-hidden": true }) }, item));
+            case "highlight":
+                return (_jsx(ColorMenu, { label: "\u9AD8\u4EAE", active: state.isHighlight, currentColor: state.highlightColor, presets: PRESET_HIGHLIGHT_COLORS, onPick: (color) => editor.chain().focus().setHighlight({ color }).run(), onClear: () => editor.chain().focus().unsetHighlight().run(), children: _jsx(Highlighter, { "aria-hidden": true }) }, item));
+            case "color":
+                return (_jsx(ColorMenu, { label: "\u6587\u5B57\u989C\u8272", active: Boolean(state.textColor), currentColor: state.textColor, presets: PRESET_TEXT_COLORS, customPresets: customTextColors, onPick: (color) => editor.chain().focus().setColor(color).run(), onRemember: (color) => {
+                        setCustomTextColors((current) => {
+                            const next = rememberCustomTextColor(current, color, PRESET_TEXT_COLORS);
+                            writeCustomTextColors(next);
+                            return next;
+                        });
+                    }, onRemoveCustom: (color) => {
+                        setCustomTextColors((current) => {
+                            const next = removeCustomTextColor(current, color);
+                            writeCustomTextColors(next);
+                            return next;
+                        });
+                    }, onClear: () => editor.chain().focus().unsetColor().run(), children: _jsx(Baseline, { "aria-hidden": true }) }, item));
+            case "textStyle":
+                return (_jsx(TextStyleMenu, { fontFamily: state.fontFamily, fontSize: state.fontSize, letterSpacing: state.letterSpacing, lineHeight: state.lineHeight, onFontFamily: (value) => {
+                        const chain = editor.chain().focus();
+                        if (value) {
+                            chain.setFontFamily(value).run();
+                            return;
+                        }
+                        chain.unsetFontFamily().run();
+                    }, onFontSize: (value) => {
+                        const chain = editor.chain().focus();
+                        if (value) {
+                            chain.setFontSize(value).run();
+                            return;
+                        }
+                        chain.unsetFontSize().run();
+                    }, onLetterSpacing: (value) => {
+                        const chain = editor.chain().focus();
+                        if (value) {
+                            chain.setLetterSpacing(value).run();
+                            return;
+                        }
+                        chain.unsetLetterSpacing().run();
+                    }, onLineHeight: (value) => {
+                        const chain = editor.chain().focus();
+                        if (value) {
+                            chain.setLineHeight(value).run();
+                            return;
+                        }
+                        chain.unsetLineHeight().run();
+                    } }, item));
+            case "list:bullet":
+                return (_jsx(ToolbarButton, { title: "\u65E0\u5E8F\u5217\u8868", active: state.isBulletList, onClick: () => editor.chain().focus().toggleBulletList().run(), children: _jsx(List, { "aria-hidden": true }) }, item));
+            case "list:ordered":
+                return (_jsx(ToolbarButton, { title: "\u6709\u5E8F\u5217\u8868", active: state.isOrderedList, onClick: () => editor.chain().focus().toggleOrderedList().run(), children: _jsx(ListOrdered, { "aria-hidden": true }) }, item));
+            case "quote":
+                return (_jsx(ToolbarButton, { title: "\u5F15\u7528", active: state.isBlockquote, onClick: () => editor.chain().focus().toggleBlockquote().run(), children: _jsx(Quote, { "aria-hidden": true }) }, item));
+            case "code":
+                return (_jsx(ToolbarButton, { title: "\u4EE3\u7801\u5757", active: state.isCodeBlock, onClick: () => editor.chain().focus().toggleCodeBlock().run(), children: _jsx(Code, { "aria-hidden": true }) }, item));
+            case "align:left":
+                return (_jsx(ToolbarButton, { title: "\u5DE6\u5BF9\u9F50", active: state.isAlignLeft, onClick: () => editor.chain().focus().setTextAlign("left").run(), children: _jsx(AlignLeft, { "aria-hidden": true }) }, item));
+            case "align:center":
+                return (_jsx(ToolbarButton, { title: "\u5C45\u4E2D", active: state.isAlignCenter, onClick: () => editor.chain().focus().setTextAlign("center").run(), children: _jsx(AlignCenter, { "aria-hidden": true }) }, item));
+            case "align:right":
+                return (_jsx(ToolbarButton, { title: "\u53F3\u5BF9\u9F50", active: state.isAlignRight, onClick: () => editor.chain().focus().setTextAlign("right").run(), children: _jsx(AlignRight, { "aria-hidden": true }) }, item));
+            case "align:justify":
+                return (_jsx(ToolbarButton, { title: "\u4E24\u7AEF\u5BF9\u9F50", active: state.isAlignJustify, onClick: () => editor.chain().focus().setTextAlign("justify").run(), children: _jsx(AlignJustify, { "aria-hidden": true }) }, item));
+            case "link":
+                return (_jsx(ToolbarButton, { title: "\u94FE\u63A5", active: state.isLink, onClick: setLink, children: _jsx(LinkIcon, { "aria-hidden": true }) }, item));
+            case "table":
+                return (_jsx(ToolbarButton, { title: "\u8868\u683C", onClick: () => editor.chain().focus().insertTable({ rows: 3, cols: 3, withHeaderRow: true }).run(), children: _jsx(Table, { "aria-hidden": true }) }, item));
+            case "image":
+                return (_jsx(ToolbarButton, { title: uploading ? "上传中" : "图片", disabled: uploading, onClick: onInsertImage, children: uploading ? _jsx(Loader2, { className: "icon-btn__spin", "aria-hidden": true }) : _jsx(ImageIcon, { "aria-hidden": true }) }, item));
+            case "video":
+                return (_jsx(VideoMenu, { open: videoOpen, uploading: uploading, error: videoError, onOpenChange: onVideoOpenChange, onUpload: onUploadVideo, onSubmitUrl: onInsertVideoUrl }, item));
+            case "undo":
+                return (_jsx(ToolbarButton, { title: "\u64A4\u9500", disabled: !state.canUndo, onClick: () => editor.chain().focus().undo().run(), children: _jsx(Undo2, { "aria-hidden": true }) }, item));
+            case "redo":
+                return (_jsx(ToolbarButton, { title: "\u6062\u590D", disabled: !state.canRedo, onClick: () => editor.chain().focus().redo().run(), children: _jsx(Redo2, { "aria-hidden": true }) }, item));
+            case "theme":
+                return (_jsx(ToolbarButton, { title: resolved === "dark" ? "切换浅色" : "切换深色", onClick: toggle, children: resolved === "dark" ? _jsx(Sun, { "aria-hidden": true }) : _jsx(Moon, { "aria-hidden": true }) }, item));
+            default:
+                return null;
+        }
+    };
+    return (_jsx("div", { className: "toolbar", role: "toolbar", "aria-label": "\u683C\u5F0F", children: items.map((item, index) => renderItem(item, index)) }));
+}

package/dist/editor/use-dom-id.d.ts

@@ -0,0 +1,3 @@
+/** 生成组件实例内稳定的 DOM id */
+export declare function useDomId(): string;
+//# sourceMappingURL=use-dom-id.d.ts.map

package/dist/editor/use-dom-id.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-dom-id.d.ts","sourceRoot":"","sources":["../../src/editor/use-dom-id.ts"],"names":[],"mappings":"AAIA,wBAAwB;AACxB,wBAAgB,QAAQ,WAOvB"}

package/dist/editor/use-dom-id.js

@@ -0,0 +1,11 @@
+import { useRef } from "react";
+let seed = 0;
+/** 生成组件实例内稳定的 DOM id */
+export function useDomId() {
+    const idRef = useRef(null);
+    if (idRef.current === null) {
+        seed += 1;
+        idRef.current = `wsmd-${seed}`;
+    }
+    return idRef.current;
+}

package/dist/editor/video-embed/index.d.ts

@@ -0,0 +1,15 @@
+import { Node } from "@tiptap/core";
+import type { VideoProvider } from "./video-url";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        videoEmbed: {
+            setVideoEmbed: (attrs: {
+                src: string;
+                provider: VideoProvider;
+            }) => ReturnType;
+        };
+    }
+}
+/** 块级视频：本地文件用 video，外站用官方播放器 iframe */
+export declare const VideoEmbed: Node<any, any>;
+//# sourceMappingURL=index.d.ts.map

package/dist/editor/video-embed/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/editor/video-embed/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAmB,MAAM,cAAc,CAAC;AAErD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,OAAO,QAAQ,cAAc,CAAC;IAC5B,UAAU,QAAQ,CAAC,UAAU;QAC3B,UAAU,EAAE;YACV,aAAa,EAAE,CAAC,KAAK,EAAE;gBAAE,GAAG,EAAE,MAAM,CAAC;gBAAC,QAAQ,EAAE,aAAa,CAAA;aAAE,KAAK,UAAU,CAAC;SAChF,CAAC;KACH;CACF;AAMD,uCAAuC;AACvC,eAAO,MAAM,UAAU,gBA8FrB,CAAC"}

package/dist/editor/video-embed/index.js

@@ -0,0 +1,95 @@
+import { Node, mergeAttributes } from "@tiptap/core";
+import { TextSelection } from "@tiptap/pm/state";
+const attrString = (value) => {
+    return typeof value === "string" ? value : null;
+};
+/** 块级视频：本地文件用 video，外站用官方播放器 iframe */
+export const VideoEmbed = Node.create({
+    name: "videoEmbed",
+    group: "block",
+    atom: true,
+    draggable: true,
+    selectable: true,
+    addAttributes() {
+        return {
+            src: { default: null },
+            provider: { default: "file" },
+        };
+    },
+    parseHTML() {
+        return [
+            {
+                tag: "video[src]",
+                getAttrs: (element) => {
+                    if (!(element instanceof HTMLElement)) {
+                        return false;
+                    }
+                    const src = element.getAttribute("src");
+                    if (!src) {
+                        return false;
+                    }
+                    return { src, provider: "file" };
+                },
+            },
+            {
+                tag: "iframe[data-video-provider]",
+                getAttrs: (element) => {
+                    if (!(element instanceof HTMLElement)) {
+                        return false;
+                    }
+                    const provider = element.getAttribute("data-video-provider");
+                    const src = element.getAttribute("src");
+                    if ((provider !== "youtube" && provider !== "bilibili") || !src) {
+                        return false;
+                    }
+                    return { src, provider };
+                },
+            },
+        ];
+    },
+    renderHTML({ node }) {
+        const src = attrString(node.attrs.src);
+        const provider = node.attrs.provider;
+        if (!src) {
+            return ["video", { controls: "true", preload: "metadata" }];
+        }
+        if (provider === "youtube" || provider === "bilibili") {
+            return [
+                "iframe",
+                mergeAttributes({
+                    src,
+                    "data-video-provider": provider,
+                    allowfullscreen: "true",
+                    frameborder: "0",
+                }),
+            ];
+        }
+        return [
+            "video",
+            mergeAttributes({
+                src,
+                controls: "true",
+                preload: "metadata",
+            }),
+        ];
+    },
+    addCommands() {
+        return {
+            setVideoEmbed: (attrs) => ({ state, dispatch }) => {
+                const type = state.schema.nodes.videoEmbed;
+                if (!type) {
+                    return false;
+                }
+                const node = type.create(attrs);
+                const $from = state.doc.resolve(state.selection.from);
+                const insertAt = $from.parent.inlineContent ? $from.after() : state.selection.to;
+                if (dispatch) {
+                    const tr = state.tr.insert(insertAt, node);
+                    const $after = tr.doc.resolve(Math.min(insertAt + node.nodeSize, tr.doc.content.size));
+                    dispatch(tr.setSelection(TextSelection.near($after)).scrollIntoView());
+                }
+                return true;
+            },
+        };
+    },
+});

package/dist/editor/video-embed/video-url.d.ts

@@ -0,0 +1,8 @@
+export type VideoProvider = "file" | "youtube" | "bilibili";
+export type VideoEmbedAttrs = {
+    provider: VideoProvider;
+    src: string;
+};
+/** 把用户粘贴的地址解析成可嵌入的视频节点属性 */
+export declare const parseVideoUrl: (input: string) => VideoEmbedAttrs | null;
+//# sourceMappingURL=video-url.d.ts.map

package/dist/editor/video-embed/video-url.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"video-url.d.ts","sourceRoot":"","sources":["../../../src/editor/video-embed/video-url.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,CAAC;AAE5D,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,EAAE,aAAa,CAAC;IACxB,GAAG,EAAE,MAAM,CAAC;CACb,CAAC;AA0FF,4BAA4B;AAC5B,eAAO,MAAM,aAAa,GAAI,OAAO,MAAM,KAAG,eAAe,GAAG,IAkB/D,CAAC"}

package/dist/editor/video-embed/video-url.js

@@ -0,0 +1,102 @@
+const YOUTUBE_ID = /^[\w-]{11}$/;
+const BVID = /^BV[\w]+$/i;
+const httpUrl = (input) => {
+    const trimmed = input.trim();
+    if (!trimmed) {
+        return null;
+    }
+    let url;
+    try {
+        url = new URL(trimmed);
+    }
+    catch {
+        return null;
+    }
+    if (url.protocol !== "http:" && url.protocol !== "https:") {
+        return null;
+    }
+    return url;
+};
+const bareHost = (url) => {
+    return url.hostname.replace(/^www\./, "").toLowerCase();
+};
+const youtubeId = (url) => {
+    const host = bareHost(url);
+    if (host === "youtu.be") {
+        const id = url.pathname.split("/").filter(Boolean)[0];
+        return id && YOUTUBE_ID.test(id) ? id : null;
+    }
+    if (host !== "youtube.com" &&
+        host !== "m.youtube.com" &&
+        host !== "music.youtube.com" &&
+        host !== "youtube-nocookie.com") {
+        return null;
+    }
+    if (url.pathname === "/watch") {
+        const id = url.searchParams.get("v");
+        return id && YOUTUBE_ID.test(id) ? id : null;
+    }
+    const parts = url.pathname.split("/").filter(Boolean);
+    if ((parts[0] === "embed" || parts[0] === "shorts") && parts[1] && YOUTUBE_ID.test(parts[1])) {
+        return parts[1];
+    }
+    return null;
+};
+const bilibiliEmbed = (url) => {
+    const host = bareHost(url);
+    if (host === "bilibili.com" || host === "m.bilibili.com") {
+        const bv = url.pathname.match(/\/video\/(BV[\w]+)/i);
+        if (bv?.[1] && BVID.test(bv[1])) {
+            return {
+                provider: "bilibili",
+                src: `https://player.bilibili.com/player.html?bvid=${bv[1]}&autoplay=0`,
+            };
+        }
+        const av = url.pathname.match(/\/video\/av(\d+)/i);
+        if (av?.[1]) {
+            return {
+                provider: "bilibili",
+                src: `https://player.bilibili.com/player.html?aid=${av[1]}&autoplay=0`,
+            };
+        }
+        return null;
+    }
+    if (host !== "player.bilibili.com") {
+        return null;
+    }
+    const bvid = url.searchParams.get("bvid");
+    if (bvid && BVID.test(bvid)) {
+        return {
+            provider: "bilibili",
+            src: `https://player.bilibili.com/player.html?bvid=${bvid}&autoplay=0`,
+        };
+    }
+    const aid = url.searchParams.get("aid");
+    if (aid && /^\d+$/.test(aid)) {
+        return {
+            provider: "bilibili",
+            src: `https://player.bilibili.com/player.html?aid=${aid}&autoplay=0`,
+        };
+    }
+    return null;
+};
+/** 把用户粘贴的地址解析成可嵌入的视频节点属性 */
+export const parseVideoUrl = (input) => {
+    const url = httpUrl(input);
+    if (!url) {
+        return null;
+    }
+    const youtube = youtubeId(url);
+    if (youtube) {
+        return { provider: "youtube", src: `https://www.youtube.com/embed/${youtube}` };
+    }
+    const bilibili = bilibiliEmbed(url);
+    if (bilibili) {
+        return bilibili;
+    }
+    const path = decodeURIComponent(url.pathname).toLowerCase();
+    if (path.endsWith(".mp4") || path.endsWith(".webm")) {
+        return { provider: "file", src: url.toString() };
+    }
+    return null;
+};

package/dist/editor/video-menu/index.d.ts

@@ -0,0 +1,13 @@
+import { type FC } from "react";
+interface VideoMenuProps {
+    open: boolean;
+    uploading: boolean;
+    error: string | null;
+    onOpenChange: (open: boolean) => void;
+    onUpload: () => void;
+    onSubmitUrl: (url: string) => void;
+}
+/** 工具栏视频菜单：上传文件或粘贴链接 */
+export declare const VideoMenu: FC<VideoMenuProps>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/editor/video-menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/editor/video-menu/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAsC,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAEpE,UAAU,cAAc;IACtB,IAAI,EAAE,OAAO,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,wBAAwB;AACxB,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAyExC,CAAC"}