@dou-ui/editor 0.0.0-stage → 0.1.0-alpha.1

package/dist/extensions/attachment/index.js

@@ -0,0 +1,132 @@
+import { escapeHTML, escapeMarkdown } from "../../core/output.js";
+import { defineBlock } from "../../define-block.js";
+import { fileDropPlugin } from "../../core/file-drop.js";
+import { createUploads, readAsDataUrl } from "../image/uploads.js";
+import { formatFileSize, isSafeFileSrc } from "./files.js";
+import attachment_block_default from "./attachment-block.js";
+import { defineComponent, h } from "vue";
+import { PaperclipIcon } from "@dou-ui/icons";
+// src/extensions/attachment/index.ts
+var propsOf = (file) => ({
+	name: file.name,
+	size: file.size,
+	mime: file.type
+});
+function attrsOf(dom) {
+	const src = dom.getAttribute("href") ?? "";
+	if (!src || !isSafeFileSrc(src)) return false;
+	const size = Number(dom.dataset.size);
+	return {
+		src,
+		name: dom.getAttribute("download") || dom.textContent?.trim() || "",
+		size: Number.isFinite(size) && dom.dataset.size ? size : null,
+		mime: dom.dataset.mime ?? ""
+	};
+}
+/**
+* Attachment blocks: a file with its name and size and a download button.
+* Files dropped or pasted into the editor become attachments (images stay
+* images when the image block is there).
+*/
+function attachment(options = {}) {
+	const uploads = createUploads(options.upload ?? readAsDataUrl, {
+		type: "attachment",
+		isSafe: isSafeFileSrc,
+		propsOf,
+		allowed: "http, https, blob, relative addresses or data: URLs"
+	});
+	const View = defineComponent({
+		name: "DouEditorAttachmentView",
+		inheritAttrs: false,
+		setup(_props, { attrs }) {
+			return () => h(attachment_block_default, {
+				...attrs,
+				uploads,
+				accept: options.accept
+			});
+		}
+	});
+	return {
+		...defineBlock({
+			type: "attachment",
+			props: {
+				src: "",
+				name: "",
+				size: null,
+				mime: ""
+			},
+			content: "none",
+			component: View,
+			menu: {
+				label: (m) => m.types.attachment,
+				hint: (m) => m.hints.attachment,
+				icon: PaperclipIcon,
+				keywords: [
+					"file",
+					"attachment",
+					"upload",
+					"fj",
+					"fujian",
+					"wenjian"
+				]
+			},
+			spec: {
+				parseDOM: [{
+					tag: "a[data-attachment]",
+					priority: 60,
+					getAttrs: (dom) => attrsOf(dom)
+				}],
+				toDOM: (node) => [
+					"div",
+					{
+						class: "dou-editor__content dou-editor__content--attachment",
+						"data-content-type": "attachment"
+					},
+					[
+						"a",
+						{
+							href: isSafeFileSrc(String(node.attrs.src)) ? node.attrs.src : null,
+							download: node.attrs.name || "",
+							"data-attachment": "",
+							"data-size": node.attrs.size ?? null,
+							"data-mime": node.attrs.mime || null
+						},
+						node.attrs.name || node.attrs.src
+					]
+				]
+			}
+		}),
+		output: { blocks: { attachment: {
+			html: (node, { children }) => {
+				const { src, name, size, mime } = node.props;
+				if (!src || !isSafeFileSrc(String(src))) return children;
+				const label = escapeHTML(String(name || src));
+				const extra = [size != null && size !== "" ? ` data-size="${Number(size)}"` : "", mime ? ` data-mime="${escapeHTML(String(mime))}"` : ""].join("");
+				const shown = size != null && size !== "" ? ` (${formatFileSize(size)})` : "";
+				return `<p><a href="${escapeHTML(String(src))}" download="${escapeHTML(String(name ?? ""))}" data-attachment${extra}>${label}</a>${escapeHTML(shown)}</p>${children}`;
+			},
+			markdown: (node, { children }) => {
+				const { src, name } = node.props;
+				if (!src || !isSafeFileSrc(String(src))) return children;
+				const address = /[\s()<>]/.test(String(src)) ? `<${String(src)}>` : String(src);
+				const written = `[${escapeMarkdown(String(name || src))}](${address})`;
+				return children ? `${written}\n\n${children}` : written;
+			}
+		} } },
+		prepareHTML: (root) => {
+			for (const link of Array.from(root.querySelectorAll("p > a[data-attachment]"))) {
+				const paragraph = link.parentElement;
+				if (paragraph.children.length > 1) continue;
+				paragraph.replaceWith(link);
+			}
+		},
+		plugins: () => [fileDropPlugin({
+			accepts: () => true,
+			fallback: true,
+			insert: uploads.insert
+		})]
+	};
+}
+export { attachment, formatFileSize, isSafeFileSrc };
+
+//# sourceMappingURL=index.js.map

package/dist/extensions/attachment/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["AttachmentBlock"],"sources":["../../../src/extensions/attachment/index.ts"],"sourcesContent":["import { PaperclipIcon } from '@dou-ui/icons'\nimport { fileDropPlugin } from '../../core/file-drop'\nimport { defineComponent, h } from 'vue'\nimport type { EditorExtension } from '../../core/extension'\nimport { escapeHTML, escapeMarkdown } from '../../core/output'\nimport { defineBlock } from '../../define-block'\nimport { createUploads, readAsDataUrl, type FileUploader } from '../image/uploads'\nimport AttachmentBlock from './attachment-block.vue'\nimport { formatFileSize, isSafeFileSrc } from './files'\n\nexport interface AttachmentOptions {\n  /**\n   * Store the file and resolve with its address. Without it, files are\n   * kept in the document as data URLs, which suits trying things out but\n   * makes documents large.\n   */\n  upload?: FileUploader\n  /** The file types the picker offers, as the `accept` of a file input. */\n  accept?: string\n}\n\nconst propsOf = (file: File) => ({ name: file.name, size: file.size, mime: file.type })\n\nfunction attrsOf(dom: HTMLElement) {\n  const src = dom.getAttribute('href') ?? ''\n  if (!src || !isSafeFileSrc(src)) return false\n  const size = Number(dom.dataset.size)\n  return {\n    src,\n    name: dom.getAttribute('download') || dom.textContent?.trim() || '',\n    size: Number.isFinite(size) && dom.dataset.size ? size : null,\n    mime: dom.dataset.mime ?? '',\n  }\n}\n\n/**\n * Attachment blocks: a file with its name and size and a download button.\n * Files dropped or pasted into the editor become attachments (images stay\n * images when the image block is there).\n */\nexport function attachment(options: AttachmentOptions = {}): EditorExtension {\n  const uploads = createUploads(options.upload ?? readAsDataUrl, {\n    type: 'attachment',\n    isSafe: isSafeFileSrc,\n    propsOf,\n    allowed: 'http, https, blob, relative addresses or data: URLs',\n  })\n  const View = defineComponent({\n    name: 'DouEditorAttachmentView',\n    inheritAttrs: false,\n    setup(_props, { attrs }) {\n      return () => h(AttachmentBlock, { ...attrs, uploads, accept: options.accept } as never)\n    },\n  })\n  const block = defineBlock({\n    type: 'attachment',\n    props: { src: '', name: '', size: null, mime: '' },\n    content: 'none',\n    component: View,\n    menu: {\n      label: (m) => m.types.attachment,\n      hint: (m) => m.hints.attachment,\n      icon: PaperclipIcon,\n      keywords: ['file', 'attachment', 'upload', 'fj', 'fujian', 'wenjian'],\n    },\n    spec: {\n      parseDOM: [\n        { tag: 'a[data-attachment]', priority: 60, getAttrs: (dom) => attrsOf(dom as HTMLElement) },\n      ],\n      toDOM: (node) => [\n        'div',\n        {\n          class: 'dou-editor__content dou-editor__content--attachment',\n          'data-content-type': 'attachment',\n        },\n        [\n          'a',\n          {\n            href: isSafeFileSrc(String(node.attrs.src)) ? node.attrs.src : null,\n            download: node.attrs.name || '',\n            'data-attachment': '',\n            'data-size': node.attrs.size ?? null,\n            'data-mime': node.attrs.mime || null,\n          },\n          node.attrs.name || node.attrs.src,\n        ],\n      ],\n    },\n  })\n  return {\n    ...block,\n    output: {\n      blocks: {\n        attachment: {\n          html: (node, { children }) => {\n            const { src, name, size, mime } = node.props\n            if (!src || !isSafeFileSrc(String(src))) return children\n            const label = escapeHTML(String(name || src))\n            const extra = [\n              size != null && size !== '' ? ` data-size=\"${Number(size)}\"` : '',\n              mime ? ` data-mime=\"${escapeHTML(String(mime))}\"` : '',\n            ].join('')\n            const shown = size != null && size !== '' ? ` (${formatFileSize(size)})` : ''\n            return `<p><a href=\"${escapeHTML(String(src))}\" download=\"${escapeHTML(String(name ?? ''))}\" data-attachment${extra}>${label}</a>${escapeHTML(shown)}</p>${children}`\n          },\n          markdown: (node, { children }) => {\n            const { src, name } = node.props\n            if (!src || !isSafeFileSrc(String(src))) return children\n            const address = /[\\s()<>]/.test(String(src)) ? `<${String(src)}>` : String(src)\n            const written = `[${escapeMarkdown(String(name || src))}](${address})`\n            return children ? `${written}\\n\\n${children}` : written\n          },\n        },\n      },\n    },\n    // an attachment written as HTML sits in a paragraph of its own\n    prepareHTML: (root) => {\n      for (const link of Array.from(root.querySelectorAll('p > a[data-attachment]'))) {\n        const paragraph = link.parentElement!\n        if (paragraph.children.length > 1) continue\n        paragraph.replaceWith(link)\n      }\n    },\n    plugins: () => [\n      fileDropPlugin({ accepts: () => true, fallback: true, insert: uploads.insert }),\n    ],\n  }\n}\n\nexport { formatFileSize, isSafeFileSrc, type FileUploader }\n"],"mappings":"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"}

package/dist/extensions/blocks.js

@@ -0,0 +1,170 @@
+import { alignable } from "../core/align.js";
+import { textBlock } from "../core/schema.js";
+import { defineEditorExtension } from "../core/extension.js";
+import { setBlockType } from "../core/commands.js";
+import { atomInputRule, blockInputRule } from "../core/input-rules.js";
+import { blockElement, splitContainer } from "../core/prepare.js";
+import { indentLines } from "../core/output.js";
+import { Heading1Icon, Heading2Icon, Heading3Icon, MinusIcon, PilcrowIcon, QuoteIcon } from "@dou-ui/icons";
+// src/extensions/blocks.ts
+/** The paragraph itself is part of the frame; this adds its menu entry and shortcut. */
+var paragraph = defineEditorExtension({
+	name: "paragraph",
+	blockOptions: [{
+		key: "paragraph",
+		type: "paragraph",
+		label: (m) => m.types.paragraph,
+		hint: (m) => m.hints.paragraph,
+		icon: PilcrowIcon,
+		keywords: [
+			"text",
+			"p",
+			"zw",
+			"zhengwen",
+			"wenben"
+		]
+	}]
+});
+var LEVELS = [
+	1,
+	2,
+	3
+];
+var levelOf = (level) => Math.min(3, Math.max(1, Number(level) || 1));
+var headingIcons = {
+	1: Heading1Icon,
+	2: Heading2Icon,
+	3: Heading3Icon
+};
+/** Headings, levels 1 to 3. `# ` to `### ` turn a paragraph into one. */
+var heading = defineEditorExtension({
+	name: "heading",
+	blocks: { heading: alignable(textBlock("heading", {
+		attrs: { level: { default: 1 } },
+		normalizeProps: (attrs) => attrs.level === void 0 ? attrs : {
+			...attrs,
+			level: Math.min(3, Math.max(1, attrs.level))
+		},
+		parseDOM: [
+			1,
+			2,
+			3,
+			4,
+			5,
+			6
+		].map((level) => ({
+			tag: `h${level}`,
+			attrs: { level: Math.min(level, 3) }
+		})),
+		toDOM: (node) => [
+			`h${node.attrs.level}`,
+			{
+				class: "dou-editor__content dou-editor__content--heading",
+				"data-content-type": "heading"
+			},
+			0
+		]
+	})) },
+	output: { blocks: { heading: {
+		html: (block, { content, children }) => `<h${levelOf(block.props.level)}>${content}</h${levelOf(block.props.level)}>${children}`,
+		markdown: (block, { content, children }) => [`${"#".repeat(levelOf(block.props.level))} ${content}`.trimEnd(), children].filter(Boolean).join("\n\n")
+	} } },
+	inputRules: () => [blockInputRule(/^(#{1,3})\s$/, "heading", (match) => ({ level: match[1].length }))],
+	keymap: () => Object.fromEntries(LEVELS.map((level) => [`mod+alt+${level}`, setBlockType("heading", { level })])),
+	blockOptions: LEVELS.map((level) => ({
+		key: `heading${level}`,
+		type: "heading",
+		props: { level },
+		label: (m) => m.types[`heading${level}`],
+		hint: (m) => m.hints[`heading${level}`],
+		icon: headingIcons[level],
+		keywords: [
+			`h${level}`,
+			"heading",
+			"title",
+			"bt",
+			"biaoti"
+		],
+		shortcut: "#".repeat(level)
+	}))
+});
+/** A quotation. `> ` turns a paragraph into one. */
+var quote = defineEditorExtension({
+	name: "quote",
+	blocks: { quote: alignable(textBlock("quote", {
+		parseDOM: [{ tag: "div[data-content-type=\"quote\"]" }, { tag: "blockquote" }],
+		toDOM: () => [
+			"blockquote",
+			{
+				class: "dou-editor__content dou-editor__content--quote",
+				"data-content-type": "quote"
+			},
+			0
+		]
+	})) },
+	output: { blocks: { quote: {
+		html: (_block, { content, children }) => `<blockquote><p>${content}</p>${children}</blockquote>`,
+		markdown: (_block, { content, children }) => indentLines([content, children].filter(Boolean).join("\n\n"), "> ", "> ")
+	} } },
+	prepareHTML: (root) => {
+		for (const element of Array.from(root.querySelectorAll("blockquote"))) {
+			const { content, children } = splitContainer(element);
+			element.replaceWith(blockElement(element.ownerDocument, "quote", content, children));
+		}
+	},
+	inputRules: () => [blockInputRule(/^>\s$/, "quote")],
+	blockOptions: [{
+		key: "quote",
+		type: "quote",
+		label: (m) => m.types.quote,
+		hint: (m) => m.hints.quote,
+		icon: QuoteIcon,
+		keywords: [
+			"quote",
+			"blockquote",
+			"yy",
+			"yinyong"
+		],
+		shortcut: ">"
+	}]
+});
+/** A horizontal line. `---` in an empty paragraph. */
+var divider = defineEditorExtension({
+	name: "divider",
+	blocks: { divider: {
+		atom: true,
+		selectable: true,
+		parseDOM: [{ tag: "hr" }],
+		toDOM: () => [
+			"div",
+			{
+				class: "dou-editor__content dou-editor__content--divider",
+				"data-content-type": "divider"
+			},
+			["hr"]
+		]
+	} },
+	output: { blocks: { divider: {
+		html: () => "<hr>",
+		markdown: () => "---"
+	} } },
+	inputRules: () => [atomInputRule(/^(?:---|___|\*\*\*)$/, "divider")],
+	blockOptions: [{
+		key: "divider",
+		type: "divider",
+		label: (m) => m.types.divider,
+		hint: (m) => m.hints.divider,
+		icon: MinusIcon,
+		keywords: [
+			"hr",
+			"divider",
+			"line",
+			"fgx",
+			"fengexian"
+		],
+		shortcut: "---"
+	}]
+});
+export { divider, heading, paragraph, quote };
+
+//# sourceMappingURL=blocks.js.map

package/dist/extensions/blocks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"blocks.js","names":[],"sources":["../../src/extensions/blocks.ts"],"sourcesContent":["import {\n  Heading1Icon,\n  Heading2Icon,\n  Heading3Icon,\n  MinusIcon,\n  PilcrowIcon,\n  QuoteIcon,\n} from '@dou-ui/icons'\nimport { setBlockType } from '../core/commands'\nimport { defineEditorExtension } from '../core/extension'\nimport { atomInputRule, blockInputRule } from '../core/input-rules'\nimport { indentLines } from '../core/output'\nimport { blockElement, splitContainer } from '../core/prepare'\nimport { alignable } from '../core/align'\nimport { textBlock } from '../core/schema'\n\n/** The paragraph itself is part of the frame; this adds its menu entry and shortcut. */\nexport const paragraph = defineEditorExtension({\n  name: 'paragraph',\n  blockOptions: [\n    {\n      key: 'paragraph',\n      type: 'paragraph',\n      label: (m) => m.types.paragraph,\n      hint: (m) => m.hints.paragraph,\n      icon: PilcrowIcon,\n      keywords: ['text', 'p', 'zw', 'zhengwen', 'wenben'],\n    },\n  ],\n})\n\nconst LEVELS = [1, 2, 3] as const\nconst levelOf = (level: unknown) => Math.min(3, Math.max(1, Number(level) || 1))\nconst headingIcons = { 1: Heading1Icon, 2: Heading2Icon, 3: Heading3Icon }\n\n/** Headings, levels 1 to 3. `# ` to `### ` turn a paragraph into one. */\nexport const heading = defineEditorExtension({\n  name: 'heading',\n  blocks: {\n    heading: alignable(\n      textBlock('heading', {\n        attrs: { level: { default: 1 } },\n        normalizeProps: (attrs: { level?: number }) =>\n          attrs.level === undefined\n            ? attrs\n            : { ...attrs, level: Math.min(3, Math.max(1, attrs.level)) },\n        parseDOM: [1, 2, 3, 4, 5, 6].map((level) => ({\n          tag: `h${level}`,\n          attrs: { level: Math.min(level, 3) },\n        })),\n        toDOM: (node) => [\n          `h${node.attrs.level}`,\n          {\n            class: 'dou-editor__content dou-editor__content--heading',\n            'data-content-type': 'heading',\n          },\n          0,\n        ],\n      }),\n    ),\n  },\n  output: {\n    blocks: {\n      heading: {\n        html: (block, { content, children }) =>\n          `<h${levelOf(block.props.level)}>${content}</h${levelOf(block.props.level)}>${children}`,\n        markdown: (block, { content, children }) =>\n          [`${'#'.repeat(levelOf(block.props.level))} ${content}`.trimEnd(), children]\n            .filter(Boolean)\n            .join('\\n\\n'),\n      },\n    },\n  },\n  inputRules: () => [\n    blockInputRule(/^(#{1,3})\\s$/, 'heading', (match) => ({ level: match[1]!.length })),\n  ],\n  keymap: () =>\n    Object.fromEntries(\n      LEVELS.map((level) => [`mod+alt+${level}`, setBlockType('heading', { level })]),\n    ),\n  blockOptions: LEVELS.map((level) => ({\n    key: `heading${level}`,\n    type: 'heading',\n    props: { level },\n    label: (m) => m.types[`heading${level}`],\n    hint: (m) => m.hints[`heading${level}`],\n    icon: headingIcons[level],\n    keywords: [`h${level}`, 'heading', 'title', 'bt', 'biaoti'],\n    shortcut: '#'.repeat(level),\n  })),\n})\n\n/** A quotation. `> ` turns a paragraph into one. */\nexport const quote = defineEditorExtension({\n  name: 'quote',\n  blocks: {\n    quote: alignable(\n      textBlock('quote', {\n        parseDOM: [{ tag: 'div[data-content-type=\"quote\"]' }, { tag: 'blockquote' }],\n        toDOM: () => [\n          'blockquote',\n          { class: 'dou-editor__content dou-editor__content--quote', 'data-content-type': 'quote' },\n          0,\n        ],\n      }),\n    ),\n  },\n  output: {\n    blocks: {\n      quote: {\n        html: (_block, { content, children }) =>\n          `<blockquote><p>${content}</p>${children}</blockquote>`,\n        markdown: (_block, { content, children }) =>\n          indentLines([content, children].filter(Boolean).join('\\n\\n'), '> ', '> '),\n      },\n    },\n  },\n  // a quote holds its first paragraph; what follows becomes its children\n  prepareHTML: (root) => {\n    for (const element of Array.from(root.querySelectorAll('blockquote'))) {\n      const { content, children } = splitContainer(element)\n      element.replaceWith(blockElement(element.ownerDocument, 'quote', content, children))\n    }\n  },\n  inputRules: () => [blockInputRule(/^>\\s$/, 'quote')],\n  blockOptions: [\n    {\n      key: 'quote',\n      type: 'quote',\n      label: (m) => m.types.quote,\n      hint: (m) => m.hints.quote,\n      icon: QuoteIcon,\n      keywords: ['quote', 'blockquote', 'yy', 'yinyong'],\n      shortcut: '>',\n    },\n  ],\n})\n\n/** A horizontal line. `---` in an empty paragraph. */\nexport const divider = defineEditorExtension({\n  name: 'divider',\n  blocks: {\n    divider: {\n      atom: true,\n      selectable: true,\n      parseDOM: [{ tag: 'hr' }],\n      toDOM: () => [\n        'div',\n        {\n          class: 'dou-editor__content dou-editor__content--divider',\n          'data-content-type': 'divider',\n        },\n        ['hr'],\n      ],\n    },\n  },\n  output: {\n    blocks: {\n      divider: { html: () => '<hr>', markdown: () => '---' },\n    },\n  },\n  inputRules: () => [atomInputRule(/^(?:---|___|\\*\\*\\*)$/, 'divider')],\n  blockOptions: [\n    {\n      key: 'divider',\n      type: 'divider',\n      label: (m) => m.types.divider,\n      hint: (m) => m.hints.divider,\n      icon: MinusIcon,\n      keywords: ['hr', 'divider', 'line', 'fgx', 'fengexian'],\n      shortcut: '---',\n    },\n  ],\n})\n"],"mappings":"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"}

package/dist/extensions/callout/callout-block.js

@@ -0,0 +1,6 @@
+import callout_block_vue_vue_type_script_setup_true_lang_default from "./callout-block.vue_vue_type_script_setup_true_lang.js";
+// src/extensions/callout/callout-block.vue
+var callout_block_default = callout_block_vue_vue_type_script_setup_true_lang_default;
+export { callout_block_default as default };
+
+//# sourceMappingURL=callout-block.js.map

package/dist/extensions/callout/callout-block.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"callout-block.js","names":["_sfc_main"],"sources":["../../../src/extensions/callout/callout-block.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DouDropdown, DouDropdownItem, DouDropdownRadioGroup } from 'dou-ui'\nimport { computed } from 'vue'\nimport type { BlockProps } from '../../core/model'\nimport { EditorContent } from '../../define-block'\nimport { useEditor } from '../../editor'\nimport { calloutTones, type CalloutTone } from './tones'\n\nconst props = defineProps<{\n  block: { id: string; type: string; props: BlockProps }\n  updateProps: (props: BlockProps) => void\n  selected: boolean\n  editable: boolean\n}>()\n\nconst { messages, view } = useEditor()\n\nconst tone = computed<CalloutTone>(() => {\n  const value = props.block.props.tone as CalloutTone\n  return value in calloutTones ? value : 'info'\n})\nconst icon = computed(() => calloutTones[tone.value])\n\nfunction choose(value: unknown) {\n  props.updateProps({ tone: String(value) })\n  view.value?.focus()\n}\n</script>\n\n<template>\n  <div class=\"dou-editor-callout\" :class=\"`is-${tone}`\">\n    <span class=\"dou-editor-callout__control\" contenteditable=\"false\">\n      <DouDropdown v-if=\"editable\" placement=\"bottom-start\">\n        <button\n          type=\"button\"\n          class=\"dou-editor-callout__icon\"\n          :aria-label=\"`${messages.callout.tones[tone]}，${messages.callout.change}`\"\n        >\n          <component :is=\"icon\" />\n        </button>\n        <template #menu>\n          <DouDropdownRadioGroup :model-value=\"tone\" @update:model-value=\"choose\">\n            <DouDropdownItem v-for=\"(item, name) in calloutTones\" :key=\"name\" :value=\"name\">\n              <template #prefix><component :is=\"item\" /></template>\n              {{ messages.callout.tones[name] }}\n            </DouDropdownItem>\n          </DouDropdownRadioGroup>\n        </template>\n      </DouDropdown>\n      <span\n        v-else\n        class=\"dou-editor-callout__icon\"\n        role=\"img\"\n        :aria-label=\"messages.callout.tones[tone]\"\n      >\n        <component :is=\"icon\" />\n      </span>\n    </span>\n    <EditorContent />\n  </div>\n</template>\n"],"mappings":""}

package/dist/extensions/callout/callout-block.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,71 @@
+import { useEditor } from "../../editor.js";
+import { EditorContent } from "../../define-block.js";
+import { calloutTones } from "./tones.js";
+import { DouDropdown, DouDropdownItem, DouDropdownRadioGroup } from "dou-ui";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, renderList, resolveDynamicComponent, toDisplayString, unref, withCtx } from "vue";
+// src/extensions/callout/callout-block.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	class: "dou-editor-callout__control",
+	contenteditable: "false"
+};
+var _hoisted_2 = ["aria-label"];
+var _hoisted_3 = ["aria-label"];
+var callout_block_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "callout-block",
+	props: {
+		block: {},
+		updateProps: { type: Function },
+		selected: { type: Boolean },
+		editable: { type: Boolean }
+	},
+	setup(__props) {
+		const props = __props;
+		const { messages, view } = useEditor();
+		const tone = computed(() => {
+			const value = props.block.props.tone;
+			return value in calloutTones ? value : "info";
+		});
+		const icon = computed(() => calloutTones[tone.value]);
+		function choose(value) {
+			props.updateProps({ tone: String(value) });
+			view.value?.focus();
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(["dou-editor-callout", `is-${tone.value}`]) }, [createElementVNode("span", _hoisted_1, [__props.editable ? (openBlock(), createBlock(unref(DouDropdown), {
+				key: 0,
+				placement: "bottom-start"
+			}, {
+				menu: withCtx(() => [createVNode(unref(DouDropdownRadioGroup), {
+					"model-value": tone.value,
+					"onUpdate:modelValue": choose
+				}, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(calloutTones), (item, name) => {
+						return openBlock(), createBlock(unref(DouDropdownItem), {
+							key: name,
+							value: name
+						}, {
+							prefix: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(item)))]),
+							default: withCtx(() => [createTextVNode(" " + toDisplayString(unref(messages).callout.tones[name]), 1)]),
+							_: 2
+						}, 1032, ["value"]);
+					}), 128))]),
+					_: 1
+				}, 8, ["model-value"])]),
+				default: withCtx(() => [createElementVNode("button", {
+					type: "button",
+					class: "dou-editor-callout__icon",
+					"aria-label": `${unref(messages).callout.tones[tone.value]}，${unref(messages).callout.change}`
+				}, [(openBlock(), createBlock(resolveDynamicComponent(icon.value)))], 8, _hoisted_2)]),
+				_: 1
+			})) : (openBlock(), createElementBlock("span", {
+				key: 1,
+				class: "dou-editor-callout__icon",
+				role: "img",
+				"aria-label": unref(messages).callout.tones[tone.value]
+			}, [(openBlock(), createBlock(resolveDynamicComponent(icon.value)))], 8, _hoisted_3))]), createVNode(unref(EditorContent))], 2);
+		};
+	}
+});
+export { callout_block_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=callout-block.vue_vue_type_script_setup_true_lang.js.map

package/dist/extensions/callout/callout-block.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"callout-block.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_createBlock","_unref","_withCtx","_createVNode","_Fragment","_renderList","_resolveDynamicComponent","_createTextVNode","_toDisplayString"],"sources":["../../../src/extensions/callout/callout-block.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DouDropdown, DouDropdownItem, DouDropdownRadioGroup } from 'dou-ui'\nimport { computed } from 'vue'\nimport type { BlockProps } from '../../core/model'\nimport { EditorContent } from '../../define-block'\nimport { useEditor } from '../../editor'\nimport { calloutTones, type CalloutTone } from './tones'\n\nconst props = defineProps<{\n  block: { id: string; type: string; props: BlockProps }\n  updateProps: (props: BlockProps) => void\n  selected: boolean\n  editable: boolean\n}>()\n\nconst { messages, view } = useEditor()\n\nconst tone = computed<CalloutTone>(() => {\n  const value = props.block.props.tone as CalloutTone\n  return value in calloutTones ? value : 'info'\n})\nconst icon = computed(() => calloutTones[tone.value])\n\nfunction choose(value: unknown) {\n  props.updateProps({ tone: String(value) })\n  view.value?.focus()\n}\n</script>\n\n<template>\n  <div class=\"dou-editor-callout\" :class=\"`is-${tone}`\">\n    <span class=\"dou-editor-callout__control\" contenteditable=\"false\">\n      <DouDropdown v-if=\"editable\" placement=\"bottom-start\">\n        <button\n          type=\"button\"\n          class=\"dou-editor-callout__icon\"\n          :aria-label=\"`${messages.callout.tones[tone]}，${messages.callout.change}`\"\n        >\n          <component :is=\"icon\" />\n        </button>\n        <template #menu>\n          <DouDropdownRadioGroup :model-value=\"tone\" @update:model-value=\"choose\">\n            <DouDropdownItem v-for=\"(item, name) in calloutTones\" :key=\"name\" :value=\"name\">\n              <template #prefix><component :is=\"item\" /></template>\n              {{ messages.callout.tones[name] }}\n            </DouDropdownItem>\n          </DouDropdownRadioGroup>\n        </template>\n      </DouDropdown>\n      <span\n        v-else\n        class=\"dou-editor-callout__icon\"\n        role=\"img\"\n        :aria-label=\"messages.callout.tones[tone]\"\n      >\n        <component :is=\"icon\" />\n      </span>\n    </span>\n    <EditorContent />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAQA,MAAM,QAAQ;EAOd,MAAM,EAAE,UAAU,SAAS,UAAU;EAErC,MAAM,OAAO,eAA4B;GACvC,MAAM,QAAQ,MAAM,MAAM,MAAM;GAChC,OAAO,SAAS,eAAe,QAAQ;EACzC,CAAC;EACD,MAAM,OAAO,eAAe,aAAa,KAAK,MAAM;EAEpD,SAAS,OAAO,OAAgB;GAC9B,MAAM,YAAY,EAAE,MAAM,OAAO,KAAK,EAAE,CAAC;GACzC,KAAK,OAAO,MAAM;EACpB;;GAIE,OAAAA,UAAA,GAAAC,mBA6BM,OAAA,EA7BD,OAAKC,eAAA,CAAC,sBAAoB,MAAe,KAAA,OAAI,CAAA,E,IAChDC,mBA0BO,QA1BP,YA0BO,CAzBc,QAAA,YAAnBH,UAAA,GAAAI,YAgBcC,MAAA,WAAA,GAAA;;IAhBe,WAAU;;IAQ1B,MAAIC,cAMW,CALxBC,YAKwBF,MAAA,qBAAA,GAAA;KALA,eAAa,KAAA;KAAO,uBAAoB;;KAC7C,SAAAC,cAAoC,EAArDN,UAAA,IAAA,GAAAC,mBAGkBO,UAAA,MAAAC,WAHsBJ,MAAA,YAAA,IAAf,MAAM,SAAI;MAAnC,OAAAL,UAAA,GAAAI,YAGkBC,MAAA,eAAA,GAAA;OAHqC,KAAK;OAAO,OAAO;;OAC7D,QAAMC,cAAyB,EAAxBN,UAAA,GAAAI,YAAwBM,wBAAR,IAAI,CAAA,E;OAAe,SAAAJ,cACrD,CADqDK,gBAAA,MACrDC,gBAAGP,MAAA,QAAA,CAAQ,CAAC,QAAQ,MAAM,KAAI,GAAA,CAAA,C;;;;;;IAXpC,SAAAC,cAMS,CANTH,mBAMS,UAAA;KALP,MAAK;KACL,OAAM;KACL,cAAU,GAAKE,MAAA,QAAA,CAAQ,CAAC,QAAQ,MAAM,KAAA,OAAI,GAAKA,MAAA,QAAA,CAAQ,CAAC,QAAQ;I,KAEjEL,UAAA,GAAAI,YAAwBM,wBAAR,KAAA,KAAI,CAAA,E;;G,OAWxBV,UAAA,GAAAC,mBAOO,QAAA;;IALL,OAAM;IACN,MAAK;IACJ,cAAYI,MAAA,QAAA,CAAQ,CAAC,QAAQ,MAAM,KAAA;G,KAEpCL,UAAA,GAAAI,YAAwBM,wBAAR,KAAA,KAAI,CAAA,E,sBAGxBH,YAAiBF,MAAA,aAAA,CAAA,C"}

package/dist/extensions/callout/html.js

@@ -0,0 +1,61 @@
+import { blockElement, splitContainer } from "../../core/prepare.js";
+import { indentLines } from "../../core/output.js";
+import { calloutTones } from "./tones.js";
+// src/extensions/callout/html.ts
+/** The alert labels of GitHub's Markdown, and the tone each one reads as. */
+var ALERTS = {
+	NOTE: "info",
+	IMPORTANT: "info",
+	TIP: "tip",
+	WARNING: "warning",
+	CAUTION: "danger"
+};
+var LABELS = {
+	info: "NOTE",
+	tip: "TIP",
+	warning: "WARNING",
+	danger: "CAUTION"
+};
+var MARKER = /^\s*\[!(NOTE|IMPORTANT|TIP|WARNING|CAUTION)\][ \t]*\n?/i;
+var toneOf = (tone) => String(tone) in calloutTones ? String(tone) : "info";
+var calloutOutput = {
+	html: (block, { content, children }) => `<aside data-callout="${toneOf(block.props.tone)}"><p>${content}</p>${children}</aside>`,
+	markdown: (block, { content, children }) => {
+		const head = [`[!${LABELS[toneOf(block.props.tone)]}]`, content].filter(Boolean).join("\n");
+		return indentLines(children ? `${head}\n\n${children}` : head, "> ", "> ");
+	}
+};
+/** Take the `[!TIP]` off the start of a quote's text; returns the tone, or null without one. */
+function takeMarker(content) {
+	const first = content.find((node) => node.textContent?.trim());
+	if (!(first instanceof Text)) return null;
+	const match = MARKER.exec(first.data);
+	if (!match) return null;
+	first.data = first.data.slice(match[0].length);
+	const next = content[content.indexOf(first) + 1];
+	if (!first.data.trim() && next instanceof Element && next.tagName === "BR") next.remove();
+	return ALERTS[match[1].toUpperCase()];
+}
+/** `<aside data-callout>` from `blocksToHTML`, and quotes that start with `[!TIP]` as Markdown writes them. */
+function prepareCallouts(root) {
+	for (const element of Array.from(root.querySelectorAll("aside[data-callout]"))) {
+		const { content, children } = splitContainer(element);
+		const tone = toneOf(element.dataset.callout);
+		element.replaceWith(blockElement(element.ownerDocument, "callout", content, children, { tone }));
+	}
+	for (const element of Array.from(root.querySelectorAll("blockquote"))) {
+		const { content, children } = splitContainer(element);
+		const tone = takeMarker(content);
+		if (tone) element.replaceWith(blockElement(element.ownerDocument, "callout", content, children, { tone }));
+	}
+	for (const element of Array.from(root.querySelectorAll("div[data-content-type=\"quote\"]"))) {
+		const tone = takeMarker(Array.from(element.childNodes));
+		if (tone) {
+			element.dataset.contentType = "callout";
+			element.dataset.tone = tone;
+		}
+	}
+}
+export { calloutOutput, prepareCallouts };
+
+//# sourceMappingURL=html.js.map

package/dist/extensions/callout/html.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"html.js","names":[],"sources":["../../../src/extensions/callout/html.ts"],"sourcesContent":["import { indentLines, type BlockOutput } from '../../core/output'\nimport { blockElement, splitContainer } from '../../core/prepare'\nimport { calloutTones } from './tones'\n\n/** The alert labels of GitHub's Markdown, and the tone each one reads as. */\nconst ALERTS: Record<string, string> = {\n  NOTE: 'info',\n  IMPORTANT: 'info',\n  TIP: 'tip',\n  WARNING: 'warning',\n  CAUTION: 'danger',\n}\nconst LABELS: Record<string, string> = {\n  info: 'NOTE',\n  tip: 'TIP',\n  warning: 'WARNING',\n  danger: 'CAUTION',\n}\nconst MARKER = /^\\s*\\[!(NOTE|IMPORTANT|TIP|WARNING|CAUTION)\\][ \\t]*\\n?/i\n\nconst toneOf = (tone: unknown) => (String(tone) in calloutTones ? String(tone) : 'info')\n\nexport const calloutOutput: BlockOutput = {\n  html: (block, { content, children }) =>\n    `<aside data-callout=\"${toneOf(block.props.tone)}\"><p>${content}</p>${children}</aside>`,\n  // GitHub's alert syntax: a quote that starts with `[!TIP]`\n  markdown: (block, { content, children }) => {\n    const head = [`[!${LABELS[toneOf(block.props.tone)]}]`, content].filter(Boolean).join('\\n')\n    return indentLines(children ? `${head}\\n\\n${children}` : head, '> ', '> ')\n  },\n}\n\n/** Take the `[!TIP]` off the start of a quote's text; returns the tone, or null without one. */\nfunction takeMarker(content: Node[]): string | null {\n  const first = content.find((node) => node.textContent?.trim())\n  if (!(first instanceof Text)) return null\n  const match = MARKER.exec(first.data)\n  if (!match) return null\n  first.data = first.data.slice(match[0].length)\n  // the text after the marker starts on the next line\n  const index = content.indexOf(first)\n  const next = content[index + 1]\n  if (!first.data.trim() && next instanceof Element && next.tagName === 'BR') next.remove()\n  return ALERTS[match[1]!.toUpperCase()]!\n}\n\n/** `<aside data-callout>` from `blocksToHTML`, and quotes that start with `[!TIP]` as Markdown writes them. */\nexport function prepareCallouts(root: HTMLElement) {\n  for (const element of Array.from(root.querySelectorAll('aside[data-callout]'))) {\n    const { content, children } = splitContainer(element)\n    const tone = toneOf((element as HTMLElement).dataset.callout)\n    element.replaceWith(blockElement(element.ownerDocument, 'callout', content, children, { tone }))\n  }\n  for (const element of Array.from(root.querySelectorAll('blockquote'))) {\n    const { content, children } = splitContainer(element)\n    const tone = takeMarker(content)\n    if (tone)\n      element.replaceWith(\n        blockElement(element.ownerDocument, 'callout', content, children, { tone }),\n      )\n  }\n  // a quote another extension already turned into a block\n  for (const element of Array.from(\n    root.querySelectorAll<HTMLElement>('div[data-content-type=\"quote\"]'),\n  )) {\n    const tone = takeMarker(Array.from(element.childNodes))\n    if (tone) {\n      element.dataset.contentType = 'callout'\n      element.dataset.tone = tone\n    }\n  }\n}\n"],"mappings":";;;;;AAKA,IAAM,SAAiC;CACrC,MAAM;CACN,WAAW;CACX,KAAK;CACL,SAAS;CACT,SAAS;AACX;AACA,IAAM,SAAiC;CACrC,MAAM;CACN,KAAK;CACL,SAAS;CACT,QAAQ;AACV;AACA,IAAM,SAAS;AAEf,IAAM,UAAU,SAAmB,OAAO,IAAI,KAAK,eAAe,OAAO,IAAI,IAAI;AAEjF,IAAa,gBAA6B;CACxC,OAAO,OAAO,EAAE,SAAS,eACvB,wBAAwB,OAAO,MAAM,MAAM,IAAI,EAAE,OAAO,QAAQ,MAAM,SAAS;CAEjF,WAAW,OAAO,EAAE,SAAS,eAAe;EAC1C,MAAM,OAAO,CAAC,KAAK,OAAO,OAAO,MAAM,MAAM,IAAI,GAAG,IAAI,OAAO,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,IAAI;EAC1F,OAAO,YAAY,WAAW,GAAG,KAAK,MAAM,aAAa,MAAM,MAAM,IAAI;CAC3E;AACF;;AAGA,SAAS,WAAW,SAAgC;CAClD,MAAM,QAAQ,QAAQ,MAAM,SAAS,KAAK,aAAa,KAAK,CAAC;CAC7D,IAAI,EAAE,iBAAiB,OAAO,OAAO;CACrC,MAAM,QAAQ,OAAO,KAAK,MAAM,IAAI;CACpC,IAAI,CAAC,OAAO,OAAO;CACnB,MAAM,OAAO,MAAM,KAAK,MAAM,MAAM,EAAE,CAAC,MAAM;CAG7C,MAAM,OAAO,QADC,QAAQ,QAAQ,KACT,IAAQ;CAC7B,IAAI,CAAC,MAAM,KAAK,KAAK,KAAK,gBAAgB,WAAW,KAAK,YAAY,MAAM,KAAK,OAAO;CACxF,OAAO,OAAO,MAAM,EAAE,CAAE,YAAY;AACtC;;AAGA,SAAgB,gBAAgB,MAAmB;CACjD,KAAK,MAAM,WAAW,MAAM,KAAK,KAAK,iBAAiB,qBAAqB,CAAC,GAAG;EAC9E,MAAM,EAAE,SAAS,aAAa,eAAe,OAAO;EACpD,MAAM,OAAO,OAAQ,QAAwB,QAAQ,OAAO;EAC5D,QAAQ,YAAY,aAAa,QAAQ,eAAe,WAAW,SAAS,UAAU,EAAE,KAAK,CAAC,CAAC;CACjG;CACA,KAAK,MAAM,WAAW,MAAM,KAAK,KAAK,iBAAiB,YAAY,CAAC,GAAG;EACrE,MAAM,EAAE,SAAS,aAAa,eAAe,OAAO;EACpD,MAAM,OAAO,WAAW,OAAO;EAC/B,IAAI,MACF,QAAQ,YACN,aAAa,QAAQ,eAAe,WAAW,SAAS,UAAU,EAAE,KAAK,CAAC,CAC5E;CACJ;CAEA,KAAK,MAAM,WAAW,MAAM,KAC1B,KAAK,iBAA8B,kCAAgC,CACrE,GAAG;EACD,MAAM,OAAO,WAAW,MAAM,KAAK,QAAQ,UAAU,CAAC;EACtD,IAAI,MAAM;GACR,QAAQ,QAAQ,cAAc;GAC9B,QAAQ,QAAQ,OAAO;EACzB;CACF;AACF"}

package/dist/extensions/callout/index.js

@@ -0,0 +1,52 @@
+import { defineEditorExtension } from "../../core/extension.js";
+import { calloutTones } from "./tones.js";
+import callout_block_default from "./callout-block.js";
+import { calloutOutput, prepareCallouts } from "./html.js";
+import { StickyNoteIcon } from "@dou-ui/icons";
+// src/extensions/callout/index.ts
+/** A callout: text in a tinted box with an icon; the icon picks the tone. */
+var callout = defineEditorExtension({
+	name: "callout",
+	blocks: { callout: {
+		content: "inline*",
+		defining: true,
+		component: callout_block_default,
+		attrs: { tone: { default: "info" } },
+		parseDOM: [{
+			tag: "div[data-content-type=\"callout\"]",
+			getAttrs: (dom) => {
+				const tone = dom.dataset.tone ?? "";
+				return { tone: tone in calloutTones ? tone : "info" };
+			}
+		}],
+		toDOM: (node) => [
+			"div",
+			{
+				class: "dou-editor__content dou-editor__content--callout",
+				"data-content-type": "callout",
+				"data-tone": node.attrs.tone
+			},
+			0
+		]
+	} },
+	output: { blocks: { callout: calloutOutput } },
+	prepareHTML: prepareCallouts,
+	blockOptions: [{
+		key: "callout",
+		type: "callout",
+		label: (m) => m.types.callout,
+		hint: (m) => m.hints.callout,
+		icon: StickyNoteIcon,
+		keywords: [
+			"callout",
+			"note",
+			"tip",
+			"warning",
+			"ts",
+			"tishi"
+		]
+	}]
+});
+export { callout };
+
+//# sourceMappingURL=index.js.map

package/dist/extensions/callout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["CalloutBlock"],"sources":["../../../src/extensions/callout/index.ts"],"sourcesContent":["import { StickyNoteIcon } from '@dou-ui/icons'\nimport { defineEditorExtension } from '../../core/extension'\nimport CalloutBlock from './callout-block.vue'\nimport { calloutOutput, prepareCallouts } from './html'\nimport { calloutTones } from './tones'\n\n/** A callout: text in a tinted box with an icon; the icon picks the tone. */\nexport const callout = defineEditorExtension({\n  name: 'callout',\n  blocks: {\n    callout: {\n      content: 'inline*',\n      defining: true,\n      component: CalloutBlock,\n      attrs: { tone: { default: 'info' } },\n      parseDOM: [\n        {\n          tag: 'div[data-content-type=\"callout\"]',\n          getAttrs: (dom) => {\n            const tone = (dom as HTMLElement).dataset.tone ?? ''\n            return { tone: tone in calloutTones ? tone : 'info' }\n          },\n        },\n      ],\n      toDOM: (node) => [\n        'div',\n        {\n          class: 'dou-editor__content dou-editor__content--callout',\n          'data-content-type': 'callout',\n          'data-tone': node.attrs.tone,\n        },\n        0,\n      ],\n    },\n  },\n  output: { blocks: { callout: calloutOutput } },\n  prepareHTML: prepareCallouts,\n  blockOptions: [\n    {\n      key: 'callout',\n      type: 'callout',\n      label: (m) => m.types.callout,\n      hint: (m) => m.hints.callout,\n      icon: StickyNoteIcon,\n      keywords: ['callout', 'note', 'tip', 'warning', 'ts', 'tishi'],\n    },\n  ],\n})\n\nexport type { CalloutTone } from './tones'\n"],"mappings":";;;;;;;AAOA,IAAa,UAAU,sBAAsB;CAC3C,MAAM;CACN,QAAQ,EACN,SAAS;EACP,SAAS;EACT,UAAU;EACV,WAAWA;EACX,OAAO,EAAE,MAAM,EAAE,SAAS,OAAO,EAAE;EACnC,UAAU,CACR;GACE,KAAK;GACL,WAAW,QAAQ;IACjB,MAAM,OAAQ,IAAoB,QAAQ,QAAQ;IAClD,OAAO,EAAE,MAAM,QAAQ,eAAe,OAAO,OAAO;GACtD;EACF,CACF;EACA,QAAQ,SAAS;GACf;GACA;IACE,OAAO;IACP,qBAAqB;IACrB,aAAa,KAAK,MAAM;GAC1B;GACA;EACF;CACF,EACF;CACA,QAAQ,EAAE,QAAQ,EAAE,SAAS,cAAc,EAAE;CAC7C,aAAa;CACb,cAAc,CACZ;EACE,KAAK;EACL,MAAM;EACN,QAAQ,MAAM,EAAE,MAAM;EACtB,OAAO,MAAM,EAAE,MAAM;EACrB,MAAM;EACN,UAAU;GAAC;GAAW;GAAQ;GAAO;GAAW;GAAM;EAAO;CAC/D,CACF;AACF,CAAC"}

package/dist/extensions/callout/tones.js

@@ -0,0 +1,12 @@
+import { AlertOctagonIcon, AlertTriangleIcon, InfoIcon, LightbulbIcon } from "@dou-ui/icons";
+// src/extensions/callout/tones.ts
+/** The callout's tones and their icons. */
+var calloutTones = {
+	info: InfoIcon,
+	tip: LightbulbIcon,
+	warning: AlertTriangleIcon,
+	danger: AlertOctagonIcon
+};
+export { calloutTones };
+
+//# sourceMappingURL=tones.js.map

package/dist/extensions/callout/tones.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tones.js","names":[],"sources":["../../../src/extensions/callout/tones.ts"],"sourcesContent":["import { AlertOctagonIcon, AlertTriangleIcon, InfoIcon, LightbulbIcon } from '@dou-ui/icons'\n\n/** The callout's tones and their icons. */\nexport const calloutTones = {\n  info: InfoIcon,\n  tip: LightbulbIcon,\n  warning: AlertTriangleIcon,\n  danger: AlertOctagonIcon,\n}\n\nexport type CalloutTone = keyof typeof calloutTones\n"],"mappings":";;;AAGA,IAAa,eAAe;CAC1B,MAAM;CACN,KAAK;CACL,SAAS;CACT,QAAQ;AACV"}

package/dist/extensions/code-block/code-block-view.js

@@ -0,0 +1,6 @@
+import code_block_view_vue_vue_type_script_setup_true_lang_default from "./code-block-view.vue_vue_type_script_setup_true_lang.js";
+// src/extensions/code-block/code-block-view.vue
+var code_block_view_default = code_block_view_vue_vue_type_script_setup_true_lang_default;
+export { code_block_view_default as default };
+
+//# sourceMappingURL=code-block-view.js.map

package/dist/extensions/code-block/code-block-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-block-view.js","names":["_sfc_main"],"sources":["../../../src/extensions/code-block/code-block-view.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ChevronDownIcon } from '@dou-ui/icons'\nimport { DouCopyButton, DouDropdown, DouDropdownItem, DouDropdownRadioGroup } from 'dou-ui'\nimport { computed } from 'vue'\nimport { findBlockById } from '../../core/blocks'\nimport type { BlockProps } from '../../core/model'\nimport { EditorContent } from '../../define-block'\nimport { useEditor } from '../../editor'\nimport type { CodeLanguage } from './languages'\n\nconst props = defineProps<{\n  block: { id: string; type: string; props: BlockProps }\n  updateProps: (props: BlockProps) => void\n  selected: boolean\n  editable: boolean\n  languages: CodeLanguage[]\n}>()\n\nconst { messages, view } = useEditor()\n\nconst language = computed(() => String(props.block.props.language ?? ''))\n// a language from elsewhere (pasted, or set in code) still shows by its name\nconst choices = computed(() => {\n  const list = [{ value: '', label: messages.value.codeBlock.plainText }, ...props.languages]\n  if (language.value && !list.some((item) => item.value === language.value))\n    list.push({ value: language.value, label: language.value })\n  return list\n})\nconst label = computed(\n  () => choices.value.find((item) => item.value === language.value)?.label ?? language.value,\n)\n\nfunction choose(value: unknown) {\n  props.updateProps({ language: String(value ?? '') })\n  view.value?.focus()\n}\n\n// read when the button is pressed: the text changes while the block is edited\nfunction code() {\n  const current = view.value\n  if (!current) return ''\n  return findBlockById(current.state.doc, props.block.id)?.content.textContent ?? ''\n}\n</script>\n\n<template>\n  <div class=\"dou-editor-code__bar\" contenteditable=\"false\">\n    <DouDropdown v-if=\"editable\" placement=\"bottom-end\">\n      <button type=\"button\" class=\"dou-editor-code__language\" :title=\"messages.codeBlock.language\">\n        {{ label }}\n        <ChevronDownIcon />\n      </button>\n      <template #menu>\n        <DouDropdownRadioGroup :model-value=\"language\" @update:model-value=\"choose\">\n          <DouDropdownItem v-for=\"item in choices\" :key=\"item.value\" :value=\"item.value\">\n            {{ item.label }}\n          </DouDropdownItem>\n        </DouDropdownRadioGroup>\n      </template>\n    </DouDropdown>\n    <span v-else-if=\"language\" class=\"dou-editor-code__language is-static\">{{ label }}</span>\n    <DouCopyButton :text=\"code\" size=\"sm\" />\n  </div>\n  <pre class=\"dou-editor-code__pre\"><EditorContent as=\"code\" /></pre>\n</template>\n"],"mappings":""}