@sanmokeji/smo-editor 0.0.4 → 0.0.6
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 +174 -15
- package/dist/favicon.ico +0 -0
- package/dist/smo-editor.css +2 -0
- package/dist/smo-editor.d.ts +40 -0
- package/dist/{index.js → smo-editor.js} +118 -111
- package/dist/smo-editor.umd.cjs +11 -0
- package/package.json +19 -18
- package/dist/index.css +0 -2
- package/dist/index.d.ts +0 -27
package/README.md
CHANGED
|
@@ -6,32 +6,191 @@
|
|
|
6
6
|
|
|
7
7
|
## ✨ 特性
|
|
8
8
|
|
|
9
|
-
-
|
|
10
|
-
-
|
|
11
|
-
-
|
|
12
|
-
- 🎨
|
|
13
|
-
|
|
14
|
-
|
|
9
|
+
- 🎯 **开箱即用** — 内置完整工具栏,引入即可使用
|
|
10
|
+
- 🪶 **轻量高效** — 基于 Tiptap 3 ProseMirror,按需扩展
|
|
11
|
+
- 💪 **TypeScript 优先** — 完善的类型推导,IDE 智能提示丝滑
|
|
12
|
+
- 🎨 **图片增强** — 支持上传、拖拽、粘贴图片,浮动菜单调整对齐与宽度
|
|
13
|
+
- 🔗 **链接编辑** — 行内链接设置弹窗,自动识别 URL
|
|
14
|
+
- 📐 **文字对齐** — 左对齐 / 居中 / 右对齐
|
|
15
|
+
- 📋 **丰富格式** — 加粗、斜体、删除线、行内代码、代码块、引用、分割线
|
|
16
|
+
- 🔤 **标题层级** — H1 ~ H6 完整支持
|
|
17
|
+
- 📝 **列表** — 有序列表、无序列表
|
|
18
|
+
- ↩️ **撤销重做** — 内置历史记录操作
|
|
19
|
+
- 🔌 **可扩展** — 基于 Tiptap 扩展机制,轻松添加自定义节点和标记
|
|
15
20
|
|
|
16
21
|
## 📦 安装
|
|
17
22
|
|
|
18
|
-
使用你喜欢的包管理器进行安装:
|
|
19
|
-
|
|
20
23
|
```bash
|
|
21
|
-
#
|
|
24
|
+
# pnpm
|
|
22
25
|
pnpm add @sanmokeji/smo-editor
|
|
23
26
|
|
|
24
|
-
#
|
|
25
|
-
npm
|
|
27
|
+
# npm
|
|
28
|
+
npm install @sanmokeji/smo-editor
|
|
26
29
|
|
|
27
|
-
#
|
|
30
|
+
# yarn
|
|
28
31
|
yarn add @sanmokeji/smo-editor
|
|
29
32
|
```
|
|
30
33
|
|
|
31
|
-
|
|
34
|
+
### 前置依赖
|
|
35
|
+
|
|
36
|
+
确保项目中已安装以下 peer 依赖:
|
|
37
|
+
|
|
38
|
+
```bash
|
|
39
|
+
pnpm add vue @tiptap/vue-3
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
## 🚀 快速开始
|
|
43
|
+
|
|
44
|
+
```vue
|
|
45
|
+
<script setup lang="ts">
|
|
46
|
+
import { ref } from 'vue'
|
|
47
|
+
import { SmoEditor, type SmoEditorOptions } from '@sanmokeji/smo-editor'
|
|
48
|
+
import '@sanmokeji/smo-editor/css'
|
|
49
|
+
|
|
50
|
+
const content = ref('<p>Hello SmoEditor!</p>')
|
|
51
|
+
</script>
|
|
52
|
+
|
|
53
|
+
<template>
|
|
54
|
+
<SmoEditor v-model="content" />
|
|
55
|
+
</template>
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
## 📖 使用指南
|
|
59
|
+
|
|
60
|
+
### v-model 双向绑定
|
|
61
|
+
|
|
62
|
+
`SmoEditor` 使用 `v-model` 进行 HTML 内容的双向绑定:
|
|
63
|
+
|
|
64
|
+
```vue
|
|
65
|
+
<template>
|
|
66
|
+
<SmoEditor v-model="html" />
|
|
67
|
+
</template>
|
|
68
|
+
|
|
69
|
+
<script setup lang="ts">
|
|
70
|
+
import { ref } from 'vue'
|
|
71
|
+
const html = ref('<p>初始内容</p>')
|
|
72
|
+
</script>
|
|
73
|
+
```
|
|
74
|
+
|
|
75
|
+
### Props
|
|
76
|
+
|
|
77
|
+
| 属性 | 类型 | 默认值 | 说明 |
|
|
78
|
+
| --------------- | --------------------------------- | ------ | --------------------------- | --- |
|
|
79
|
+
| `modelValue` | `string` | `''` | 编辑器 HTML 内容(v-model) | |
|
|
80
|
+
| `placeholder` | `string` | `''` | 占位符文本 | |
|
|
81
|
+
| `height` | `string` | `''` | 编辑器容器高度 | |
|
|
82
|
+
| `onImageUpload` | `(file: File) => Promise<string>` | — | 图片上传回调,返回图片 URL |
|
|
83
|
+
|
|
84
|
+
### 图片上传
|
|
85
|
+
|
|
86
|
+
传入 `onImageUpload` 回调函数,返回图片 URL 即可。支持工具栏上传、拖拽、粘贴三种方式:
|
|
87
|
+
|
|
88
|
+
```vue
|
|
89
|
+
<template>
|
|
90
|
+
<SmoEditor v-model="content" :on-image-upload="uploadImage" />
|
|
91
|
+
</template>
|
|
92
|
+
|
|
93
|
+
<script setup lang="ts">
|
|
94
|
+
const uploadImage = async (file: File): Promise<string> => {
|
|
95
|
+
const formData = new FormData()
|
|
96
|
+
formData.append('file', file)
|
|
97
|
+
|
|
98
|
+
const res = await fetch('/api/upload', {
|
|
99
|
+
method: 'POST',
|
|
100
|
+
body: formData,
|
|
101
|
+
})
|
|
102
|
+
const { url } = await res.json()
|
|
103
|
+
return url
|
|
104
|
+
}
|
|
105
|
+
</script>
|
|
106
|
+
```
|
|
107
|
+
|
|
108
|
+
图片上传到编辑器后,选中图片会出现 **浮动菜单(Bubble Menu)**,支持调整:
|
|
109
|
+
|
|
110
|
+
- **对齐**:左对齐 / 居中 / 右对齐
|
|
111
|
+
- **宽度**:自动 / 25% / 50% / 75% / 100%
|
|
112
|
+
- **Alt 文本**:编辑图片替代文字
|
|
113
|
+
|
|
114
|
+
### 只读模式
|
|
115
|
+
|
|
116
|
+
```vue
|
|
117
|
+
<template>
|
|
118
|
+
<SmoEditor v-model="content" :editable="false" />
|
|
119
|
+
</template>
|
|
120
|
+
```
|
|
121
|
+
|
|
122
|
+
### 占位符
|
|
123
|
+
|
|
124
|
+
```vue
|
|
125
|
+
<template>
|
|
126
|
+
<SmoEditor v-model="content" placeholder="请输入文章内容..." />
|
|
127
|
+
</template>
|
|
128
|
+
```
|
|
129
|
+
|
|
130
|
+
## 🧩 TypeScript 类型
|
|
131
|
+
|
|
132
|
+
库提供完整的 TypeScript 类型声明:
|
|
32
133
|
|
|
33
134
|
```ts
|
|
34
135
|
import { SmoEditor, type SmoEditorOptions } from '@sanmokeji/smo-editor'
|
|
35
|
-
// 2. 引入组件配套样式
|
|
36
|
-
import '@sanmokeji/smo-editor/dist/index.css'
|
|
37
136
|
```
|
|
137
|
+
|
|
138
|
+
`SmoEditorOptions` 接口定义:
|
|
139
|
+
|
|
140
|
+
```ts
|
|
141
|
+
export interface SmoEditorOptions {
|
|
142
|
+
content?: string | object
|
|
143
|
+
placeholder?: string
|
|
144
|
+
onImageUpload?: (file: File) => Promise<string>
|
|
145
|
+
}
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
## 🎨 样式导入
|
|
149
|
+
|
|
150
|
+
编辑器和工具栏的样式已内置,需要手动导入 CSS 文件:
|
|
151
|
+
|
|
152
|
+
```ts
|
|
153
|
+
// 在你的入口文件或组件中
|
|
154
|
+
import '@sanmokeji/smo-editor/css'
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
CSS 文件中包含 `.smot-editor-` 前缀的类名,不会污染全局样式。
|
|
158
|
+
|
|
159
|
+
## ⌨️ 工具栏功能
|
|
160
|
+
|
|
161
|
+
内置工具栏提供以下功能:
|
|
162
|
+
|
|
163
|
+
| 分组 | 功能 |
|
|
164
|
+
| ---- | ---------------------------------- |
|
|
165
|
+
| 标题 | H1 / H2 / H3 / H4 / H5 / H6 / 正文 |
|
|
166
|
+
| 内联 | 加粗 / 斜体 / 删除线 / 行内代码 |
|
|
167
|
+
| 块级 | 引用 / 代码块 / 分割线 |
|
|
168
|
+
| 列表 | 有序列表 / 无序列表 |
|
|
169
|
+
| 对齐 | 左对齐 / 居中 / 右对齐 |
|
|
170
|
+
| 媒体 | 图片上传(含浮动编辑菜单) |
|
|
171
|
+
| 链接 | 设置 / 编辑超链接 |
|
|
172
|
+
| 历史 | 撤销 / 重做 |
|
|
173
|
+
|
|
174
|
+
## 🔧 开发
|
|
175
|
+
|
|
176
|
+
```bash
|
|
177
|
+
# 安装依赖
|
|
178
|
+
pnpm install
|
|
179
|
+
|
|
180
|
+
# 启动开发服务器
|
|
181
|
+
pnpm dev
|
|
182
|
+
|
|
183
|
+
# 构建生产版本
|
|
184
|
+
pnpm build
|
|
185
|
+
|
|
186
|
+
# 类型检查
|
|
187
|
+
pnpm type-check
|
|
188
|
+
```
|
|
189
|
+
|
|
190
|
+
## 📄 License
|
|
191
|
+
|
|
192
|
+
MIT
|
|
193
|
+
|
|
194
|
+
---
|
|
195
|
+
|
|
196
|
+
Made with ❤️ by SanMoKeJi
|
package/dist/favicon.ico
ADDED
|
Binary file
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
[data-v-8407b2ea] .ProseMirror-selectednode{border-radius:4px;outline:2px solid #38bdf8}[data-v-8407b2ea] .tiptap:focus,[data-v-8407b2ea] .ProseMirror{outline:none}[data-v-8407b2ea] .ProseMirror ul{margin:8px 0;padding-left:24px;list-style-type:disc}[data-v-8407b2ea] .ProseMirror ol{margin:8px 0;padding-left:24px;list-style-type:decimal}[data-v-8407b2ea] .ProseMirror li p{margin:4px 0}[data-v-8407b2ea] .ProseMirror blockquote{color:#475569;background-color:#f8fafc;border-left:4px solid #cbd5e1;border-radius:2px;margin:12px 0;padding:8px 16px}[data-v-8407b2ea] .ProseMirror blockquote p{margin:4px 0}[data-v-8407b2ea] .ProseMirror pre{color:#38bdf8;background-color:#0f172a;border-radius:6px;margin:16px 0;padding:12px 16px;font-family:Fira Code,Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;overflow-x:auto}[data-v-8407b2ea] .ProseMirror pre code{color:inherit;background:0 0;padding:0;font-size:13px}[data-v-8407b2ea] .ProseMirror hr{cursor:pointer;border:none;border-top:2px solid #e2e8f0;margin:24px 0}[data-v-8407b2ea] .ProseMirror hr.ProseMirror-selectednode{outline:2px solid #38bdf8}[data-v-8407b2ea] .ProseMirror code{color:#e11d48;background-color:#f1f5f9;border-radius:4px;padding:2px 6px;font-family:monospace;font-size:.85em;font-weight:500}[data-v-8407b2ea] .ProseMirror .smo-editor-link{color:#2563eb;text-underline-offset:3px;cursor:pointer;font-weight:500;text-decoration:underline}[data-v-8407b2ea] .ProseMirror .smo-editor-link:hover{color:#1d4ed8}[data-v-8407b2ea] .tiptap .is-editor-empty:first-child:before{color:#adb5bd;content:attr(data-placeholder);float:left;pointer-events:none;height:0}[data-v-8407b2ea] .tiptap :first-child{margin-top:0}[data-v-8407b2ea] .tiptap [data-resize-handle]{z-index:10;background:#00000080;border:1px solid #fffc;border-radius:2px;position:absolute}[data-v-8407b2ea] .tiptap [data-resize-handle]:hover{background:#000c}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=top-left],[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=top-right],[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=bottom-left],[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=bottom-right]{width:8px;height:8px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=top-left]{cursor:nwse-resize;top:-4px;left:-4px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=top-right]{cursor:nesw-resize;top:-4px;right:-4px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=bottom-left]{cursor:nesw-resize;bottom:-4px;left:-4px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=bottom-right]{cursor:nwse-resize;bottom:-4px;right:-4px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=top],[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=bottom]{height:6px;left:8px;right:8px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=top]{cursor:ns-resize;top:-3px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=bottom]{cursor:ns-resize;bottom:-3px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=left],[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=right]{width:6px;top:8px;bottom:8px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=left]{cursor:ew-resize;left:-3px}[data-v-8407b2ea] .tiptap [data-resize-handle][data-resize-handle=right]{cursor:ew-resize;right:-3px}[data-v-8407b2ea] .tiptap [data-resize-state=true] [data-resize-wrapper]{border-radius:.125rem;outline:1px solid #00000040}.smo-toolbar-group[data-v-0762240b]{align-items:center;gap:2px;padding:0 4px;display:inline-flex;position:relative}.smo-toolbar-group+.smo-toolbar-group[data-v-0762240b]:before{content:"";background-color:#e2e8f0;width:1px;position:absolute;top:6px;bottom:6px;left:-2px}.smo-toolbar-button[data-v-10d293e2]{color:#475569;cursor:pointer;background:0 0;border:none;border-radius:4px;outline:none;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:inline-flex}.smo-toolbar-button[data-v-10d293e2]:hover:not(:disabled){color:#0f172a;background-color:#f1f5f9}.smo-toolbar-button.is-active[data-v-10d293e2]{color:#2563eb;background-color:#e2e8f0;font-weight:700}.smo-toolbar-button[data-v-10d293e2]:disabled{color:#cbd5e1;cursor:not-allowed}.smo-icon[data-v-4de271c4]{vertical-align:middle;flex-shrink:0;display:inline-block}.smo-custom-select[data-v-0b16f052]{-webkit-user-select:none;user-select:none;display:inline-block;position:relative}.smo-select-trigger[data-v-0b16f052]{color:#475569;cursor:pointer;background-color:#0000;border-radius:4px;justify-content:space-between;align-items:center;min-width:50px;height:28px;padding:0 10px;font-size:13px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.smo-select-trigger[data-v-0b16f052]:hover,.smo-select-trigger.is-active[data-v-0b16f052]{color:#0f172a;background-color:#f1f5f9}.smo-select-value[data-v-0b16f052]{font-weight:500}.smo-select-arrow[data-v-0b16f052]{color:#94a3b8;margin-left:8px;font-size:8px;transition:transform .2s;transform:scale(.8)}.smo-select-arrow.is-rotated[data-v-0b16f052]{transform:scale(.8)rotate(180deg)}.smo-select-dropdown[data-v-0b16f052]{z-index:50;background-color:#fff;border:1px solid #e2e8f0;border-radius:6px;min-width:160px;padding:4px;position:absolute;top:calc(100% + 4px);left:0;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.smo-select-option[data-v-0b16f052]{color:#334155;cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;margin-bottom:2px;padding:6px 10px;font-size:13px;transition:background-color .15s;display:flex}.smo-select-option[data-v-0b16f052]:last-child{margin-bottom:0}.smo-select-option[data-v-0b16f052]:hover{color:#0f172a;background-color:#f8fafc}.smo-select-option.is-selected[data-v-0b16f052]{color:#2563eb;background-color:#eff6ff;font-weight:500}.smo-option-check[data-v-0b16f052]{font-size:11px;font-weight:700}.smo-select-option.opt-h1[data-v-0b16f052]{font-size:18px;font-weight:700}.smo-select-option.opt-h2[data-v-0b16f052]{font-size:16px;font-weight:600}.smo-select-option.opt-h3[data-v-0b16f052]{font-size:14px;font-weight:600}.smo-select-option.opt-h4[data-v-0b16f052]{font-size:13px;font-weight:600}.smo-select-option.opt-h5[data-v-0b16f052]{font-size:12px;font-weight:600}.smo-select-option.opt-h6[data-v-0b16f052]{font-size:11px;font-weight:600}.smo-fade-enter-active[data-v-0b16f052],.smo-fade-leave-active[data-v-0b16f052]{transition:opacity .15s,transform .15s}.smo-fade-enter-from[data-v-0b16f052],.smo-fade-leave-to[data-v-0b16f052]{opacity:0;transform:translateY(-4px)}.smo-link-setter[data-v-77dc2707]{display:inline-block}.smo-link-popover-fixed[data-v-77dc2707]{z-index:9999;background:#fff;border:1px solid #e2e8f0;border-radius:8px;flex-direction:column;gap:10px;width:280px;padding:12px;display:flex;position:fixed;transform:translate(-50%,-100%);box-shadow:0 10px 25px -5px #0f172a26}.smo-popover-field[data-v-77dc2707]{align-items:center;gap:8px;display:flex}.smo-field-label[data-v-77dc2707]{color:#64748b;min-width:36px;font-size:12px}.smo-link-input[data-v-77dc2707]{border:1px solid #cbd5e1;border-radius:4px;outline:none;flex:1;padding:5px 8px;font-size:12px}.smo-link-input[data-v-77dc2707]:focus{border-color:#2563eb}.smo-link-actions[data-v-77dc2707]{justify-content:flex-end;gap:6px;margin-top:4px;display:flex}.smo-popover-btn[data-v-77dc2707]{cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:4px;padding:4px 10px;font-size:12px}.smo-popover-btn.primary[data-v-77dc2707]{color:#fff;background:#2563eb;border-color:#2563eb}.smo-popover-btn.danger[data-v-77dc2707]{color:#fff;background:#ef4444;border-color:#ef4444}.bubble-menu[data-v-3b921f1f]{background-color:#fff;border:1px solid #3d25140d;border-radius:10px;min-width:300px;padding:15px;box-shadow:0 12px 33px #0000000f,0 3.618px 9.949px #0000000a}.bubble-menu .form-item[data-v-3b921f1f]:last-child{margin-bottom:0}.bubble-menu .form-item[data-v-3b921f1f]{color:#475569;align-items:center;margin-bottom:16px;font-size:.8rem;display:flex}.bubble-menu .form-item label[data-v-3b921f1f]{flex-shrink:0;width:4rem}.bubble-menu .form-item input[data-v-3b921f1f]{color:#334155;box-sizing:border-box;border:1px solid #cbd5e1;border-radius:4px;outline:none;flex:1;padding:8px;font-size:12px;transition:border-color .2s}.smo-editor-container{border:1px solid #e2e8f0;border-radius:6px}.smo-toolbar{border-bottom:1px solid #e2e8f0;padding:.25rem}.smo-editor-content{outline:none;min-height:5rem;padding:16px}.smo-editor-content img{max-width:100%;transition:width .2s cubic-bezier(.4,0,.2,1);display:block}.smo-editor-content img[data-align=left]{margin-right:auto}.smo-editor-content img[data-align=center]{margin:0 auto}.smo-editor-content img[data-align=right]{margin-left:auto}
|
|
2
|
+
/*$vite$:1*/
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { ComponentOptionsMixin } from 'vue';
|
|
2
|
+
import { ComponentProvideOptions } from 'vue';
|
|
3
|
+
import { DefineComponent } from 'vue';
|
|
4
|
+
import { PublicProps } from 'vue';
|
|
5
|
+
|
|
6
|
+
declare const __VLS_export: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
|
|
7
|
+
"update:modelValue": (value: string) => any;
|
|
8
|
+
}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
9
|
+
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
10
|
+
}>, {
|
|
11
|
+
placeholder: string;
|
|
12
|
+
editable: boolean;
|
|
13
|
+
modelValue: string;
|
|
14
|
+
}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
|
|
15
|
+
|
|
16
|
+
declare type __VLS_Props = {
|
|
17
|
+
modelValue?: string;
|
|
18
|
+
editable?: boolean;
|
|
19
|
+
placeholder?: string;
|
|
20
|
+
/** 编辑器容器高度 */
|
|
21
|
+
height?: string | number;
|
|
22
|
+
onImageUpload?: (file: File) => Promise<string>;
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export declare const SmoEditor: typeof __VLS_export;
|
|
26
|
+
|
|
27
|
+
export declare interface SmoEditorOptions {
|
|
28
|
+
/** 编辑器初始内容,可以是 HTML 或 JSON */
|
|
29
|
+
content?: string | object;
|
|
30
|
+
/** 编辑器容器高度 */
|
|
31
|
+
height?: string | number;
|
|
32
|
+
/** 是否只读 */
|
|
33
|
+
editable?: boolean;
|
|
34
|
+
/** 占位符文字 */
|
|
35
|
+
placeholder?: string;
|
|
36
|
+
/** 图片上传处理函数 */
|
|
37
|
+
onImageUpload?: (file: File) => Promise<string>;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
export { }
|
|
@@ -3,15 +3,15 @@ import { Editor as O, EditorContent as k, mergeAttributes as A } from "@tiptap/v
|
|
|
3
3
|
import j from "@tiptap/starter-kit";
|
|
4
4
|
import { Placeholder as M } from "@tiptap/extension-placeholder";
|
|
5
5
|
import N from "@tiptap/extension-image";
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import { BubbleMenu as
|
|
6
|
+
import P from "@tiptap/extension-text-align";
|
|
7
|
+
import te from "@tiptap/extension-file-handler";
|
|
8
|
+
import { BubbleMenu as ne } from "@tiptap/vue-3/menus";
|
|
9
9
|
//#region src/core/editorConfig.ts
|
|
10
|
-
var
|
|
10
|
+
var re = {
|
|
11
11
|
content: "<p>欢迎使用 SmoEditor !</p>",
|
|
12
12
|
editable: !0,
|
|
13
13
|
placeholder: "请输入内容..."
|
|
14
|
-
},
|
|
14
|
+
}, ie = N.extend({
|
|
15
15
|
addOptions() {
|
|
16
16
|
return {
|
|
17
17
|
...this.parent(),
|
|
@@ -38,18 +38,18 @@ var ie = {
|
|
|
38
38
|
renderHTML({ HTMLAttributes: e, node: t }) {
|
|
39
39
|
return ["img", A(this.options.HTMLAttributes, e, { style: `width: ${t.attrs.width};` })];
|
|
40
40
|
}
|
|
41
|
-
}),
|
|
41
|
+
}), F = (e, t) => e ? t === e.getAttributes("image").align : !1, I = (e, t) => e ? t === e.getAttributes("image").width : !1, L = (e, t) => {
|
|
42
42
|
e && e.commands.updateAttributes("image", { width: t });
|
|
43
|
-
}, L = (e, t) => {
|
|
44
|
-
e && e.commands.updateAttributes("image", t);
|
|
45
43
|
}, R = (e, t) => {
|
|
44
|
+
e && e.commands.updateAttributes("image", t);
|
|
45
|
+
}, z = (e, t) => {
|
|
46
46
|
e && e.commands.updateAttributes("image", { align: t });
|
|
47
47
|
};
|
|
48
|
-
async function
|
|
48
|
+
async function B(e, t, n) {
|
|
49
49
|
let r = e.extensionManager.extensions.find((e) => e.name === "image")?.options?.onImageUpload;
|
|
50
50
|
try {
|
|
51
51
|
let i = "";
|
|
52
|
-
if (r ? i = await r(t) : (console.log("SmoEditor: 未检测到 onImageUpload,启用 Base64 模式"), i = await
|
|
52
|
+
if (r ? i = await r(t) : (console.log("SmoEditor: 未检测到 onImageUpload,启用 Base64 模式"), i = await H(t)), i) {
|
|
53
53
|
let t = e.chain().focus();
|
|
54
54
|
n === void 0 ? t.setImage({ src: i }).run() : t.insertContentAt(n, {
|
|
55
55
|
type: "image",
|
|
@@ -60,14 +60,14 @@ async function z(e, t, n) {
|
|
|
60
60
|
console.error("上传失败", e);
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
|
-
async function
|
|
63
|
+
async function V(e, t, n) {
|
|
64
64
|
let r = n;
|
|
65
|
-
for (let n of t) await
|
|
65
|
+
for (let n of t) await B(e, n, r), r !== void 0 && (r += 1);
|
|
66
66
|
}
|
|
67
|
-
var
|
|
67
|
+
var H = (e) => new Promise((t, n) => {
|
|
68
68
|
let r = new FileReader();
|
|
69
69
|
r.readAsDataURL(e), r.onload = () => t(r.result), r.onerror = (e) => n(e);
|
|
70
|
-
}),
|
|
70
|
+
}), U = (e) => [
|
|
71
71
|
j.configure({
|
|
72
72
|
heading: { levels: [
|
|
73
73
|
1,
|
|
@@ -90,14 +90,14 @@ var V = (e) => new Promise((t, n) => {
|
|
|
90
90
|
}
|
|
91
91
|
}
|
|
92
92
|
}),
|
|
93
|
-
|
|
93
|
+
P.configure({ types: ["heading", "paragraph"] }),
|
|
94
94
|
M.configure({ placeholder: "请输入内容..." }),
|
|
95
|
-
|
|
95
|
+
ie.configure({
|
|
96
96
|
onImageUpload: e.onImageUpload,
|
|
97
97
|
allowBase64: !0,
|
|
98
98
|
HTMLAttributes: { class: "smo-editor-image" }
|
|
99
99
|
}),
|
|
100
|
-
|
|
100
|
+
te.configure({
|
|
101
101
|
allowedMimeTypes: [
|
|
102
102
|
"image/png",
|
|
103
103
|
"image/jpeg",
|
|
@@ -105,42 +105,42 @@ var V = (e) => new Promise((t, n) => {
|
|
|
105
105
|
"image/webp"
|
|
106
106
|
],
|
|
107
107
|
onDrop: async (e, t, n) => {
|
|
108
|
-
await
|
|
108
|
+
await V(e, t.filter((e) => e.type.startsWith("image/")), n);
|
|
109
109
|
},
|
|
110
110
|
onPaste: async (e, t) => {
|
|
111
|
-
await
|
|
111
|
+
await V(e, t.filter((e) => e.type.startsWith("image/")));
|
|
112
112
|
}
|
|
113
113
|
})
|
|
114
|
-
],
|
|
114
|
+
], W = (e = {}) => {
|
|
115
115
|
let t = {
|
|
116
|
-
...
|
|
116
|
+
...re,
|
|
117
117
|
...e
|
|
118
118
|
};
|
|
119
119
|
return new O({
|
|
120
120
|
content: t.content,
|
|
121
121
|
editable: t.editable,
|
|
122
|
-
extensions:
|
|
122
|
+
extensions: U({ onImageUpload: e.onImageUpload }),
|
|
123
123
|
editorProps: { attributes: { class: "smo-editor-content" } }
|
|
124
124
|
});
|
|
125
|
-
},
|
|
125
|
+
}, G = /* @__PURE__ */ u({
|
|
126
126
|
__name: "EditorContent",
|
|
127
127
|
props: { editor: {} },
|
|
128
128
|
setup(e) {
|
|
129
|
-
return (t, n) =>
|
|
129
|
+
return (t, n) => e.editor ? (g(), i(S(k), {
|
|
130
130
|
key: 0,
|
|
131
131
|
editor: e.editor
|
|
132
|
-
}, null, 8, ["editor"])) : a("", !0)
|
|
132
|
+
}, null, 8, ["editor"])) : a("", !0);
|
|
133
133
|
}
|
|
134
134
|
}), K = (e, t) => {
|
|
135
135
|
let n = e.__vccOpts || e;
|
|
136
136
|
for (let [e, r] of t) n[e] = r;
|
|
137
137
|
return n;
|
|
138
|
-
}, q = /* @__PURE__ */ K(G, [["__scopeId", "data-v-
|
|
138
|
+
}, q = /* @__PURE__ */ K(G, [["__scopeId", "data-v-8407b2ea"]]), J = { class: "smo-toolbar-group" }, Y = /* @__PURE__ */ K(/* @__PURE__ */ u({
|
|
139
139
|
__name: "ToolbarGroup",
|
|
140
140
|
setup(e) {
|
|
141
141
|
return (e, t) => (g(), o("div", J, [y(e.$slots, "default", {}, void 0, !0)]));
|
|
142
142
|
}
|
|
143
|
-
}), [["__scopeId", "data-v-0762240b"]]),
|
|
143
|
+
}), [["__scopeId", "data-v-0762240b"]]), ae = ["disabled", "title"], X = /* @__PURE__ */ K(/* @__PURE__ */ u({
|
|
144
144
|
__name: "ToolbarButton",
|
|
145
145
|
props: {
|
|
146
146
|
active: {
|
|
@@ -164,9 +164,9 @@ var V = (e) => new Promise((t, n) => {
|
|
|
164
164
|
disabled: e.disabled,
|
|
165
165
|
title: e.title,
|
|
166
166
|
onClick: r
|
|
167
|
-
}, [y(t.$slots, "default", {}, void 0, !0)], 10,
|
|
167
|
+
}, [y(t.$slots, "default", {}, void 0, !0)], 10, ae));
|
|
168
168
|
}
|
|
169
|
-
}), [["__scopeId", "data-v-10d293e2"]]),
|
|
169
|
+
}), [["__scopeId", "data-v-10d293e2"]]), oe = {
|
|
170
170
|
bold: "<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M6 2.5C5.17157 2.5 4.5 3.17157 4.5 4V20C4.5 20.8284 5.17157 21.5 6 21.5H15C16.4587 21.5 17.8576 20.9205 18.8891 19.8891C19.9205 18.8576 20.5 17.4587 20.5 16C20.5 14.5413 19.9205 13.1424 18.8891 12.1109C18.6781 11.9 18.4518 11.7079 18.2128 11.5359C19.041 10.5492 19.5 9.29829 19.5 8C19.5 6.54131 18.9205 5.14236 17.8891 4.11091C16.8576 3.07946 15.4587 2.5 14 2.5H6ZM14 10.5C14.663 10.5 15.2989 10.2366 15.7678 9.76777C16.2366 9.29893 16.5 8.66304 16.5 8C16.5 7.33696 16.2366 6.70107 15.7678 6.23223C15.2989 5.76339 14.663 5.5 14 5.5H7.5V10.5H14ZM7.5 18.5V13.5H15C15.663 13.5 16.2989 13.7634 16.7678 14.2322C17.2366 14.7011 17.5 15.337 17.5 16C17.5 16.663 17.2366 17.2989 16.7678 17.7678C16.2989 18.2366 15.663 18.5 15 18.5H7.5Z\" fill=\"currentColor\"></path>",
|
|
171
171
|
italic: "<path d=\"M15.0222 3H19C19.5523 3 20 3.44772 20 4C20 4.55228 19.5523 5 19 5H15.693L10.443 19H14C14.5523 19 15 19.4477 15 20C15 20.5523 14.5523 21 14 21H9.02418C9.00802 21.0004 8.99181 21.0004 8.97557 21H5C4.44772 21 4 20.5523 4 20C4 19.4477 4.44772 19 5 19H8.30704L13.557 5H10C9.44772 5 9 4.55228 9 4C9 3.44772 9.44772 3 10 3H14.9782C14.9928 2.99968 15.0075 2.99967 15.0222 3Z\" fill=\"currentColor\"></path>",
|
|
172
172
|
heading1: "<path d=\"M4 5v14h2v-6h6v6h2V5h-2v5H6V5H4zm14 2.5V19h-2v-8.3l-1.8 1-.6-1.6 3.6-2h.8z\" />",
|
|
@@ -188,7 +188,7 @@ var V = (e) => new Promise((t, n) => {
|
|
|
188
188
|
alignCenter: "<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z\" fill=\"currentColor\"></path><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M6 12C6 11.4477 6.44772 11 7 11H17C17.5523 11 18 11.4477 18 12C18 12.5523 17.5523 13 17 13H7C6.44772 13 6 12.5523 6 12Z\" fill=\"currentColor\"></path><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 18C4 17.4477 4.44772 17 5 17H19C19.5523 17 20 17.4477 20 18C20 18.5523 19.5523 19 19 19H5C4.44772 19 4 18.5523 4 18Z\" fill=\"currentColor\"></path>",
|
|
189
189
|
alignRight: "<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z\" fill=\"currentColor\"></path><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8 12C8 11.4477 8.44772 11 9 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H9C8.44772 13 8 12.5523 8 12Z\" fill=\"currentColor\"></path><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M6 18C6 17.4477 6.44772 17 7 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H7C6.44772 19 6 18.5523 6 18Z\" fill=\"currentColor\"></path>",
|
|
190
190
|
alignJustify: "<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z\" fill=\"currentColor\"></path><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 12C2 11.4477 2.44772 11 3 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H3C2.44772 13 2 12.5523 2 12Z\" fill=\"currentColor\"></path><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M2 18C2 17.4477 2.44772 17 3 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H3C2.44772 19 2 18.5523 2 18Z\" fill=\"currentColor\"></path>"
|
|
191
|
-
},
|
|
191
|
+
}, se = [
|
|
192
192
|
"width",
|
|
193
193
|
"height",
|
|
194
194
|
"fill",
|
|
@@ -197,11 +197,11 @@ var V = (e) => new Promise((t, n) => {
|
|
|
197
197
|
__name: "SmoIcon",
|
|
198
198
|
props: {
|
|
199
199
|
name: {},
|
|
200
|
-
size: { default:
|
|
200
|
+
size: { default: 16 },
|
|
201
201
|
color: { default: "currentColor" }
|
|
202
202
|
},
|
|
203
203
|
setup(e) {
|
|
204
|
-
let t = e, n = r(() =>
|
|
204
|
+
let t = e, n = r(() => oe[t.name] || (console.warn(`[SmoIcon]: 图标 "${t.name}" 未在注册表中注册。`), ""));
|
|
205
205
|
return (t, r) => (g(), o("svg", {
|
|
206
206
|
xmlns: "http://www.w3.org/2000/svg",
|
|
207
207
|
viewBox: "0 0 24 24",
|
|
@@ -210,9 +210,9 @@ var V = (e) => new Promise((t, n) => {
|
|
|
210
210
|
fill: e.color,
|
|
211
211
|
class: "smo-icon",
|
|
212
212
|
innerHTML: n.value
|
|
213
|
-
}, null, 8,
|
|
213
|
+
}, null, 8, se));
|
|
214
214
|
}
|
|
215
|
-
}), [["__scopeId", "data-v-
|
|
215
|
+
}), [["__scopeId", "data-v-4de271c4"]]), ce = /* @__PURE__ */ u({
|
|
216
216
|
__name: "TextAlignButton",
|
|
217
217
|
props: { editor: {} },
|
|
218
218
|
setup(e) {
|
|
@@ -254,13 +254,13 @@ var V = (e) => new Promise((t, n) => {
|
|
|
254
254
|
_: 1
|
|
255
255
|
}));
|
|
256
256
|
}
|
|
257
|
-
}),
|
|
257
|
+
}), le = ["title"], ue = { class: "smo-select-value" }, de = {
|
|
258
258
|
key: 0,
|
|
259
259
|
class: "smo-select-dropdown"
|
|
260
|
-
},
|
|
260
|
+
}, fe = ["onClick"], pe = {
|
|
261
261
|
key: 0,
|
|
262
262
|
class: "smo-option-check"
|
|
263
|
-
},
|
|
263
|
+
}, me = /* @__PURE__ */ K(/* @__PURE__ */ u({
|
|
264
264
|
__name: "ToolbarSelect",
|
|
265
265
|
props: {
|
|
266
266
|
modelValue: {},
|
|
@@ -291,8 +291,8 @@ var V = (e) => new Promise((t, n) => {
|
|
|
291
291
|
}, [s("div", {
|
|
292
292
|
class: f(["smo-select-trigger", { "is-active": p.value }]),
|
|
293
293
|
onClick: S
|
|
294
|
-
}, [s("span",
|
|
295
|
-
default: T(() => [p.value ? (g(), o("div",
|
|
294
|
+
}, [s("span", ue, x(b.value), 1), s("span", { class: f(["smo-select-arrow", { "is-rotated": p.value }]) }, "▼", 2)], 2), l(n, { name: "smo-fade" }, {
|
|
295
|
+
default: T(() => [p.value ? (g(), o("div", de, [(g(!0), o(e, null, v(t.options, (e) => (g(), o("div", {
|
|
296
296
|
key: e.value,
|
|
297
297
|
class: f(["smo-select-option", {
|
|
298
298
|
"is-selected": e.value === t.modelValue,
|
|
@@ -302,15 +302,15 @@ var V = (e) => new Promise((t, n) => {
|
|
|
302
302
|
"opt-h4": e.value === 4
|
|
303
303
|
}]),
|
|
304
304
|
onClick: (t) => C(e.value)
|
|
305
|
-
}, [c(x(e.label) + " ", 1), e.value === t.modelValue ? (g(), o("span",
|
|
305
|
+
}, [c(x(e.label) + " ", 1), e.value === t.modelValue ? (g(), o("span", pe, "✓")) : a("", !0)], 10, fe))), 128))])) : a("", !0)]),
|
|
306
306
|
_: 1
|
|
307
|
-
})], 8,
|
|
307
|
+
})], 8, le));
|
|
308
308
|
}
|
|
309
|
-
}), [["__scopeId", "data-v-0b16f052"]]),
|
|
309
|
+
}), [["__scopeId", "data-v-0b16f052"]]), he = (e) => e ? e.chain().focus().toggleBold().run() : !1, ge = (e) => e ? e.isActive("bold") : !1, _e = (e, t) => e ? e.chain().focus().toggleHeading({ level: t }).run() : !1, ve = (e) => {
|
|
310
310
|
if (!e) return 0;
|
|
311
311
|
for (let t = 1; t <= 6; t++) if (e.isActive("heading", { level: t })) return t;
|
|
312
312
|
return 0;
|
|
313
|
-
},
|
|
313
|
+
}, ye = (e) => e ? e.chain().focus().toggleItalic().run() : !1, be = (e) => e ? e.isActive("italic") : !1, xe = (e) => e ? e.chain().focus().toggleBulletList().run() : !1, Se = (e) => e ? e.isActive("bulletList") : !1, Ce = (e) => e ? e.chain().focus().toggleOrderedList().run() : !1, we = (e) => e ? e.isActive("orderedList") : !1, Te = (e) => e ? e.chain().focus().toggleBlockquote().run() : !1, Ee = (e) => e ? e.isActive("blockquote") : !1, De = (e) => e ? e.chain().focus().toggleCodeBlock().run() : !1, Oe = (e) => e ? e.isActive("codeBlock") : !1, ke = (e) => e ? e.chain().focus().setHorizontalRule().run() : !1, Ae = (e) => e ? e.chain().focus().toggleStrike().run() : !1, je = (e) => e ? e.isActive("strike") : !1, Me = (e) => e ? e.chain().focus().toggleCode().run() : !1, Ne = (e) => e ? e.isActive("code") : !1, Pe = (e) => e ? e.chain().focus().undo().run() : !1, Fe = (e) => e ? e.can().undo() : !1, Ie = (e) => e ? e.chain().focus().redo().run() : !1, Le = (e) => e ? e.can().redo() : !1, Q = (e) => e ? e.isActive("link") : !1, Re = (e) => e && e.getAttributes("link").href || "", ze = (e) => e ? e.chain().focus().extendMarkRange("link").unsetLink().run() : !1, Be = { class: "smo-link-setter" }, Ve = { class: "smo-popover-field" }, He = { class: "smo-popover-field" }, Ue = { class: "smo-link-actions" }, We = /* @__PURE__ */ K(/* @__PURE__ */ u({
|
|
314
314
|
__name: "LinkSetter",
|
|
315
315
|
props: { editor: {} },
|
|
316
316
|
setup(e) {
|
|
@@ -337,7 +337,7 @@ var V = (e) => new Promise((t, n) => {
|
|
|
337
337
|
h = {
|
|
338
338
|
from: e,
|
|
339
339
|
to: t
|
|
340
|
-
}, c.value = Q(n.editor) ?
|
|
340
|
+
}, c.value = Q(n.editor) ? Re(n.editor) : "", e === t ? u.value = Q(n.editor) ? "链接文本" : "" : u.value = n.editor.state.doc.textBetween(e, t, " ");
|
|
341
341
|
};
|
|
342
342
|
w(() => n.editor?.state.selection, () => {
|
|
343
343
|
n.editor && (Q(n.editor) ? (y(), r.value = !0, d(v)) : r.value && !Q(n.editor) && h.from === h.to && k());
|
|
@@ -368,13 +368,13 @@ var V = (e) => new Promise((t, n) => {
|
|
|
368
368
|
let i = n.editor.state.selection.to;
|
|
369
369
|
n.editor.chain().setTextSelection(i).unsetMark("link").run(), k();
|
|
370
370
|
}, O = () => {
|
|
371
|
-
n.editor.chain().focus().setTextSelection(h).run(),
|
|
371
|
+
n.editor.chain().focus().setTextSelection(h).run(), ze(n.editor), k();
|
|
372
372
|
}, k = () => {
|
|
373
373
|
r.value = !1, c.value = "", u.value = "";
|
|
374
374
|
};
|
|
375
375
|
return typeof window < "u" && (window.addEventListener("scroll", v, !0), window.addEventListener("resize", v)), m(() => {
|
|
376
376
|
typeof window < "u" && (window.removeEventListener("scroll", v, !0), window.removeEventListener("resize", v));
|
|
377
|
-
}), (n, d) => (g(), o("div",
|
|
377
|
+
}), (n, d) => (g(), o("div", Be, [l(X, {
|
|
378
378
|
active: S(Q)(e.editor) || r.value,
|
|
379
379
|
title: "超链接",
|
|
380
380
|
onClick: b
|
|
@@ -390,20 +390,20 @@ var V = (e) => new Promise((t, n) => {
|
|
|
390
390
|
style: p(f.value),
|
|
391
391
|
onMousedown: d[2] ||= D(() => {}, ["stop"])
|
|
392
392
|
}, [
|
|
393
|
-
s("div",
|
|
393
|
+
s("div", Ve, [d[3] ||= s("span", { class: "smo-field-label" }, "文本:", -1), E(s("input", {
|
|
394
394
|
"onUpdate:modelValue": d[0] ||= (e) => u.value = e,
|
|
395
395
|
type: "text",
|
|
396
396
|
class: "smo-link-input",
|
|
397
397
|
placeholder: "显示的文字"
|
|
398
398
|
}, null, 512), [[C, u.value]])]),
|
|
399
|
-
s("div",
|
|
399
|
+
s("div", He, [d[4] ||= s("span", { class: "smo-field-label" }, "链接:", -1), E(s("input", {
|
|
400
400
|
"onUpdate:modelValue": d[1] ||= (e) => c.value = e,
|
|
401
401
|
type: "text",
|
|
402
402
|
class: "smo-link-input",
|
|
403
403
|
placeholder: "https://...",
|
|
404
404
|
onKeyup: ee(x, ["enter"])
|
|
405
405
|
}, null, 544), [[C, c.value]])]),
|
|
406
|
-
s("div",
|
|
406
|
+
s("div", Ue, [
|
|
407
407
|
s("button", {
|
|
408
408
|
class: "smo-popover-btn primary",
|
|
409
409
|
onClick: x
|
|
@@ -420,7 +420,7 @@ var V = (e) => new Promise((t, n) => {
|
|
|
420
420
|
])
|
|
421
421
|
], 36)) : a("", !0)]))]));
|
|
422
422
|
}
|
|
423
|
-
}), [["__scopeId", "data-v-77dc2707"]]), Ge = { class: "smo-image-setter" },
|
|
423
|
+
}), [["__scopeId", "data-v-77dc2707"]]), Ge = { class: "smo-image-setter" }, $ = { class: "bubble-menu" }, Ke = { class: "form-item" }, qe = { class: "form-item" }, Je = { class: "form-item" }, Ye = /* @__PURE__ */ K(/* @__PURE__ */ u({
|
|
424
424
|
__name: "ImageButton",
|
|
425
425
|
props: { editor: {} },
|
|
426
426
|
setup(t) {
|
|
@@ -436,11 +436,11 @@ var V = (e) => new Promise((t, n) => {
|
|
|
436
436
|
let t = e.target;
|
|
437
437
|
if (t.files?.length) {
|
|
438
438
|
let e = Array.from(t.files);
|
|
439
|
-
|
|
439
|
+
V(n.editor, e), t.value = "";
|
|
440
440
|
}
|
|
441
441
|
}, f = () => n.editor.isActive("image"), p = _(""), v = _(null), y = () => {
|
|
442
442
|
v.value && clearTimeout(v.value), v.value = setTimeout(() => {
|
|
443
|
-
|
|
443
|
+
R(n.editor, { alt: p.value });
|
|
444
444
|
}, 500);
|
|
445
445
|
};
|
|
446
446
|
return (n, u) => (g(), o(e, null, [s("div", Ge, [s("input", {
|
|
@@ -460,7 +460,7 @@ var V = (e) => new Promise((t, n) => {
|
|
|
460
460
|
size: "16"
|
|
461
461
|
})]),
|
|
462
462
|
_: 1
|
|
463
|
-
})]), t.editor ? (g(), i(S(
|
|
463
|
+
})]), t.editor ? (g(), i(S(ne), {
|
|
464
464
|
key: 0,
|
|
465
465
|
class: "smo-image-bubble-menu",
|
|
466
466
|
editor: t.editor,
|
|
@@ -470,13 +470,13 @@ var V = (e) => new Promise((t, n) => {
|
|
|
470
470
|
interactive: !0
|
|
471
471
|
}
|
|
472
472
|
}, {
|
|
473
|
-
default: T(() => [s("div",
|
|
474
|
-
s("div",
|
|
473
|
+
default: T(() => [s("div", $, [
|
|
474
|
+
s("div", Ke, [u[9] ||= s("label", null, "对齐方式", -1), l(Y, { class: "align-group" }, {
|
|
475
475
|
default: T(() => [
|
|
476
476
|
l(X, {
|
|
477
|
-
active: S(
|
|
477
|
+
active: S(F)(t.editor, "left"),
|
|
478
478
|
title: "居左对齐",
|
|
479
|
-
onClick: u[1] ||= (e) => S(
|
|
479
|
+
onClick: u[1] ||= (e) => S(z)(t.editor, "left")
|
|
480
480
|
}, {
|
|
481
481
|
default: T(() => [l(Z, {
|
|
482
482
|
name: "alignLeft",
|
|
@@ -485,9 +485,9 @@ var V = (e) => new Promise((t, n) => {
|
|
|
485
485
|
_: 1
|
|
486
486
|
}, 8, ["active"]),
|
|
487
487
|
l(X, {
|
|
488
|
-
active: S(
|
|
488
|
+
active: S(F)(t.editor, "center"),
|
|
489
489
|
title: "居中对齐",
|
|
490
|
-
onClick: u[2] ||= (e) => S(
|
|
490
|
+
onClick: u[2] ||= (e) => S(z)(t.editor, "center")
|
|
491
491
|
}, {
|
|
492
492
|
default: T(() => [l(Z, {
|
|
493
493
|
name: "alignCenter",
|
|
@@ -496,9 +496,9 @@ var V = (e) => new Promise((t, n) => {
|
|
|
496
496
|
_: 1
|
|
497
497
|
}, 8, ["active"]),
|
|
498
498
|
l(X, {
|
|
499
|
-
active: S(
|
|
499
|
+
active: S(F)(t.editor, "right"),
|
|
500
500
|
title: "居右对齐",
|
|
501
|
-
onClick: u[3] ||= (e) => S(
|
|
501
|
+
onClick: u[3] ||= (e) => S(z)(t.editor, "right")
|
|
502
502
|
}, {
|
|
503
503
|
default: T(() => [l(Z, {
|
|
504
504
|
name: "alignRight",
|
|
@@ -509,36 +509,36 @@ var V = (e) => new Promise((t, n) => {
|
|
|
509
509
|
]),
|
|
510
510
|
_: 1
|
|
511
511
|
})]),
|
|
512
|
-
s("div",
|
|
512
|
+
s("div", qe, [u[14] ||= s("label", null, "图片宽度", -1), l(Y, { class: "align-group" }, {
|
|
513
513
|
default: T(() => [
|
|
514
514
|
l(X, {
|
|
515
|
-
active: S(
|
|
515
|
+
active: S(I)(t.editor, "100%"),
|
|
516
516
|
title: "宽度100%",
|
|
517
|
-
onClick: u[4] ||= (e) => S(
|
|
517
|
+
onClick: u[4] ||= (e) => S(L)(t.editor, "100%")
|
|
518
518
|
}, {
|
|
519
519
|
default: T(() => [...u[10] ||= [c("100%", -1)]]),
|
|
520
520
|
_: 1
|
|
521
521
|
}, 8, ["active"]),
|
|
522
522
|
l(X, {
|
|
523
|
-
active: S(
|
|
523
|
+
active: S(I)(t.editor, "75%"),
|
|
524
524
|
title: "宽度75%",
|
|
525
|
-
onClick: u[5] ||= (e) => S(
|
|
525
|
+
onClick: u[5] ||= (e) => S(L)(t.editor, "75%")
|
|
526
526
|
}, {
|
|
527
527
|
default: T(() => [...u[11] ||= [c("75%", -1)]]),
|
|
528
528
|
_: 1
|
|
529
529
|
}, 8, ["active"]),
|
|
530
530
|
l(X, {
|
|
531
|
-
active: S(
|
|
531
|
+
active: S(I)(t.editor, "50%"),
|
|
532
532
|
title: "宽度50%",
|
|
533
|
-
onClick: u[6] ||= (e) => S(
|
|
533
|
+
onClick: u[6] ||= (e) => S(L)(t.editor, "50%")
|
|
534
534
|
}, {
|
|
535
535
|
default: T(() => [...u[12] ||= [c("50%", -1)]]),
|
|
536
536
|
_: 1
|
|
537
537
|
}, 8, ["active"]),
|
|
538
538
|
l(X, {
|
|
539
|
-
active: S(
|
|
539
|
+
active: S(I)(t.editor, "25%"),
|
|
540
540
|
title: "宽度25%",
|
|
541
|
-
onClick: u[7] ||= (e) => S(
|
|
541
|
+
onClick: u[7] ||= (e) => S(L)(t.editor, "25%")
|
|
542
542
|
}, {
|
|
543
543
|
default: T(() => [...u[13] ||= [c("25%", -1)]]),
|
|
544
544
|
_: 1
|
|
@@ -546,7 +546,7 @@ var V = (e) => new Promise((t, n) => {
|
|
|
546
546
|
]),
|
|
547
547
|
_: 1
|
|
548
548
|
})]),
|
|
549
|
-
s("div",
|
|
549
|
+
s("div", Je, [u[15] ||= s("label", null, "图片描述", -1), E(s("input", {
|
|
550
550
|
"onUpdate:modelValue": u[8] ||= (e) => p.value = e,
|
|
551
551
|
onInput: y,
|
|
552
552
|
type: "text",
|
|
@@ -556,10 +556,10 @@ var V = (e) => new Promise((t, n) => {
|
|
|
556
556
|
_: 1
|
|
557
557
|
}, 8, ["editor"])) : a("", !0)], 64));
|
|
558
558
|
}
|
|
559
|
-
}), [["__scopeId", "data-v-3b921f1f"]]),
|
|
559
|
+
}), [["__scopeId", "data-v-3b921f1f"]]), Xe = {
|
|
560
560
|
key: 0,
|
|
561
561
|
class: "smo-toolbar"
|
|
562
|
-
},
|
|
562
|
+
}, Ze = /* @__PURE__ */ u({
|
|
563
563
|
__name: "Toolbar",
|
|
564
564
|
props: { editor: {} },
|
|
565
565
|
setup(e) {
|
|
@@ -592,22 +592,22 @@ var V = (e) => new Promise((t, n) => {
|
|
|
592
592
|
label: "H6",
|
|
593
593
|
value: 6
|
|
594
594
|
}
|
|
595
|
-
], i = r(() =>
|
|
596
|
-
t.editor && (e === 0 ? t.editor.chain().focus().setParagraph().run() :
|
|
595
|
+
], i = r(() => ve(t.editor)), s = (e) => {
|
|
596
|
+
t.editor && (e === 0 ? t.editor.chain().focus().setParagraph().run() : _e(t.editor, e));
|
|
597
597
|
};
|
|
598
|
-
return (t, r) => e.editor ? (g(), o("div",
|
|
598
|
+
return (t, r) => e.editor ? (g(), o("div", Xe, [
|
|
599
599
|
l(Y, null, {
|
|
600
600
|
default: T(() => [l(X, {
|
|
601
|
-
disabled: !S(
|
|
601
|
+
disabled: !S(Fe)(e.editor),
|
|
602
602
|
title: "撤销",
|
|
603
|
-
onClick: r[0] ||= (t) => S(
|
|
603
|
+
onClick: r[0] ||= (t) => S(Pe)(e.editor)
|
|
604
604
|
}, {
|
|
605
605
|
default: T(() => [l(Z, { name: "undo" })]),
|
|
606
606
|
_: 1
|
|
607
607
|
}, 8, ["disabled"]), l(X, {
|
|
608
|
-
disabled: !S(
|
|
608
|
+
disabled: !S(Le)(e.editor),
|
|
609
609
|
title: "重做",
|
|
610
|
-
onClick: r[1] ||= (t) => S(
|
|
610
|
+
onClick: r[1] ||= (t) => S(Ie)(e.editor)
|
|
611
611
|
}, {
|
|
612
612
|
default: T(() => [l(Z, { name: "redo" })]),
|
|
613
613
|
_: 1
|
|
@@ -615,7 +615,7 @@ var V = (e) => new Promise((t, n) => {
|
|
|
615
615
|
_: 1
|
|
616
616
|
}),
|
|
617
617
|
l(Y, null, {
|
|
618
|
-
default: T(() => [l(
|
|
618
|
+
default: T(() => [l(me, {
|
|
619
619
|
"model-value": i.value,
|
|
620
620
|
options: n,
|
|
621
621
|
title: "文本层级",
|
|
@@ -623,57 +623,57 @@ var V = (e) => new Promise((t, n) => {
|
|
|
623
623
|
}, null, 8, ["model-value"])]),
|
|
624
624
|
_: 1
|
|
625
625
|
}),
|
|
626
|
-
l(
|
|
626
|
+
l(ce, { editor: e.editor }, null, 8, ["editor"]),
|
|
627
627
|
l(Y, null, {
|
|
628
628
|
default: T(() => [
|
|
629
629
|
l(X, {
|
|
630
|
-
active: S(
|
|
630
|
+
active: S(ge)(e.editor),
|
|
631
631
|
title: "加粗",
|
|
632
|
-
onClick: r[2] ||= (t) => S(
|
|
632
|
+
onClick: r[2] ||= (t) => S(he)(e.editor)
|
|
633
633
|
}, {
|
|
634
634
|
default: T(() => [l(Z, { name: "bold" })]),
|
|
635
635
|
_: 1
|
|
636
636
|
}, 8, ["active"]),
|
|
637
637
|
l(X, {
|
|
638
|
-
active: S(
|
|
638
|
+
active: S(be)(e.editor),
|
|
639
639
|
title: "斜体",
|
|
640
|
-
onClick: r[3] ||= (t) => S(
|
|
640
|
+
onClick: r[3] ||= (t) => S(ye)(e.editor)
|
|
641
641
|
}, {
|
|
642
642
|
default: T(() => [l(Z, { name: "italic" })]),
|
|
643
643
|
_: 1
|
|
644
644
|
}, 8, ["active"]),
|
|
645
645
|
l(X, {
|
|
646
|
-
active: S(
|
|
646
|
+
active: S(je)(e.editor),
|
|
647
647
|
title: "删除线",
|
|
648
|
-
onClick: r[4] ||= (t) => S(
|
|
648
|
+
onClick: r[4] ||= (t) => S(Ae)(e.editor)
|
|
649
649
|
}, {
|
|
650
650
|
default: T(() => [l(Z, { name: "strike" })]),
|
|
651
651
|
_: 1
|
|
652
652
|
}, 8, ["active"]),
|
|
653
653
|
l(X, {
|
|
654
|
-
active: S(
|
|
654
|
+
active: S(Ne)(e.editor),
|
|
655
655
|
title: "行内代码",
|
|
656
|
-
onClick: r[5] ||= (t) => S(
|
|
656
|
+
onClick: r[5] ||= (t) => S(Me)(e.editor)
|
|
657
657
|
}, {
|
|
658
658
|
default: T(() => [l(Z, { name: "code" })]),
|
|
659
659
|
_: 1
|
|
660
660
|
}, 8, ["active"]),
|
|
661
|
-
l(
|
|
661
|
+
l(We, { editor: e.editor }, null, 8, ["editor"])
|
|
662
662
|
]),
|
|
663
663
|
_: 1
|
|
664
664
|
}),
|
|
665
665
|
l(Y, null, {
|
|
666
666
|
default: T(() => [l(X, {
|
|
667
|
-
active: S(
|
|
667
|
+
active: S(Se)(e.editor),
|
|
668
668
|
title: "无序列表",
|
|
669
|
-
onClick: r[6] ||= (t) => S(
|
|
669
|
+
onClick: r[6] ||= (t) => S(xe)(e.editor)
|
|
670
670
|
}, {
|
|
671
671
|
default: T(() => [l(Z, { name: "bulletList" })]),
|
|
672
672
|
_: 1
|
|
673
673
|
}, 8, ["active"]), l(X, {
|
|
674
|
-
active: S(
|
|
674
|
+
active: S(we)(e.editor),
|
|
675
675
|
title: "有序列表",
|
|
676
|
-
onClick: r[7] ||= (t) => S(
|
|
676
|
+
onClick: r[7] ||= (t) => S(Ce)(e.editor)
|
|
677
677
|
}, {
|
|
678
678
|
default: T(() => [l(Z, { name: "orderedList" })]),
|
|
679
679
|
_: 1
|
|
@@ -683,35 +683,35 @@ var V = (e) => new Promise((t, n) => {
|
|
|
683
683
|
l(Y, null, {
|
|
684
684
|
default: T(() => [
|
|
685
685
|
l(X, {
|
|
686
|
-
active: S(
|
|
686
|
+
active: S(Ee)(e.editor),
|
|
687
687
|
title: "引用区块",
|
|
688
|
-
onClick: r[8] ||= (t) => S(
|
|
688
|
+
onClick: r[8] ||= (t) => S(Te)(e.editor)
|
|
689
689
|
}, {
|
|
690
690
|
default: T(() => [l(Z, { name: "blockquote" })]),
|
|
691
691
|
_: 1
|
|
692
692
|
}, 8, ["active"]),
|
|
693
693
|
l(X, {
|
|
694
|
-
active: S(
|
|
694
|
+
active: S(Oe)(e.editor),
|
|
695
695
|
title: "代码块",
|
|
696
|
-
onClick: r[9] ||= (t) => S(
|
|
696
|
+
onClick: r[9] ||= (t) => S(De)(e.editor)
|
|
697
697
|
}, {
|
|
698
698
|
default: T(() => [l(Z, { name: "codeBlockAlt" })]),
|
|
699
699
|
_: 1
|
|
700
700
|
}, 8, ["active"]),
|
|
701
701
|
l(X, {
|
|
702
702
|
title: "分割线",
|
|
703
|
-
onClick: r[10] ||= (t) => S(
|
|
703
|
+
onClick: r[10] ||= (t) => S(ke)(e.editor)
|
|
704
704
|
}, {
|
|
705
705
|
default: T(() => [l(Z, { name: "horizontalRule" })]),
|
|
706
706
|
_: 1
|
|
707
707
|
}),
|
|
708
|
-
l(
|
|
708
|
+
l(Ye, { editor: e.editor }, null, 8, ["editor"])
|
|
709
709
|
]),
|
|
710
710
|
_: 1
|
|
711
711
|
})
|
|
712
712
|
])) : a("", !0);
|
|
713
713
|
}
|
|
714
|
-
}),
|
|
714
|
+
}), Qe = { class: "smo-editor-container" }, $e = /* @__PURE__ */ u({
|
|
715
715
|
__name: "SmoEditor",
|
|
716
716
|
props: {
|
|
717
717
|
modelValue: { default: "" },
|
|
@@ -720,26 +720,33 @@ var V = (e) => new Promise((t, n) => {
|
|
|
720
720
|
default: !0
|
|
721
721
|
},
|
|
722
722
|
placeholder: { default: "" },
|
|
723
|
+
height: {},
|
|
723
724
|
onImageUpload: {}
|
|
724
725
|
},
|
|
725
726
|
emits: ["update:modelValue"],
|
|
726
727
|
setup(e, { emit: t }) {
|
|
727
|
-
let n = e,
|
|
728
|
-
|
|
729
|
-
|
|
728
|
+
let n = e, i = t, a = b(null);
|
|
729
|
+
h(() => {
|
|
730
|
+
a.value = W({
|
|
730
731
|
content: n.modelValue,
|
|
731
732
|
editable: n.editable,
|
|
732
733
|
placeholder: n.placeholder,
|
|
734
|
+
height: n.height,
|
|
733
735
|
onImageUpload: n.onImageUpload
|
|
734
|
-
}),
|
|
735
|
-
|
|
736
|
+
}), a.value.on("update", () => {
|
|
737
|
+
a.value && i("update:modelValue", a.value.getHTML());
|
|
736
738
|
});
|
|
737
739
|
}), w(() => n.modelValue, (e) => {
|
|
738
|
-
|
|
740
|
+
a.value && a.value.getHTML() !== e && a.value.commands.setContent(e, { emitUpdate: !1 });
|
|
739
741
|
}), m(() => {
|
|
740
|
-
|
|
741
|
-
})
|
|
742
|
+
a.value &&= (a.value.destroy(), null);
|
|
743
|
+
});
|
|
744
|
+
let s = r(() => n.height === void 0 || n.height === null ? "auto" : /^\d+$/.test(String(n.height)) ? `${n.height}px` : String(n.height));
|
|
745
|
+
return (e, t) => (g(), o("div", Qe, [l(Ze, { editor: a.value }, null, 8, ["editor"]), l(q, {
|
|
746
|
+
editor: a.value,
|
|
747
|
+
style: p({ minHeight: s.value })
|
|
748
|
+
}, null, 8, ["editor", "style"])]));
|
|
742
749
|
}
|
|
743
750
|
});
|
|
744
751
|
//#endregion
|
|
745
|
-
export {
|
|
752
|
+
export { $e as SmoEditor };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("vue"),require("@tiptap/vue-3"),require("@tiptap/starter-kit"),require("@tiptap/extension-placeholder"),require("@tiptap/extension-image"),require("@tiptap/extension-text-align"),require("@tiptap/extension-file-handler"),require("@tiptap/vue-3/menus")):typeof define==`function`&&define.amd?define([`exports`,`vue`,`@tiptap/vue-3`,`@tiptap/starter-kit`,`@tiptap/extension-placeholder`,`@tiptap/extension-image`,`@tiptap/extension-text-align`,`@tiptap/extension-file-handler`,`@tiptap/vue-3/menus`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.SmoEditor={},e.vue,e._tiptap_vue_3,e._tiptap_starter_kit,e._tiptap_extension_placeholder,e._tiptap_extension_image,e._tiptap_extension_text_align,e._tiptap_extension_file_handler,e._tiptap_vue_3_menus))})(this,function(e,t,n,r,i,a,o,s,c){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var l=Object.create,u=Object.defineProperty,d=Object.getOwnPropertyDescriptor,f=Object.getOwnPropertyNames,p=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty,ee=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=f(t),a=0,o=i.length,s;a<o;a++)s=i[a],!m.call(e,s)&&s!==n&&u(e,s,{get:(e=>t[e]).bind(null,s),enumerable:!(r=d(t,s))||r.enumerable});return e},h=(e,t,n)=>(n=e==null?{}:l(p(e)),ee(t||!e||!e.__esModule?u(n,`default`,{value:e,enumerable:!0}):n,e));r=h(r,1),a=h(a,1),o=h(o,1),s=h(s,1);var g={content:`<p>欢迎使用 SmoEditor !</p>`,editable:!0,placeholder:`请输入内容...`},_=a.default.extend({addOptions(){return{...this.parent(),onImageUpload:null}},addAttributes(){return{...this.parent?.(),uploading:{default:!1},progress:{default:0},align:{default:`center`,parseHTML:e=>e.getAttribute(`data-align`)||`center`,renderHTML:e=>e.align?{"data-align":e.align}:{}},width:{default:`auto`,parseHTML:e=>e.getAttribute(`data-width`)||`auto`,renderHTML:e=>e.width?{"data-width":e.width}:{}}}},renderHTML({HTMLAttributes:e,node:t}){return[`img`,(0,n.mergeAttributes)(this.options.HTMLAttributes,e,{style:`width: ${t.attrs.width};`})]}}),v=(e,t)=>e?t===e.getAttributes(`image`).align:!1,y=(e,t)=>e?t===e.getAttributes(`image`).width:!1,b=(e,t)=>{e&&e.commands.updateAttributes(`image`,{width:t})},x=(e,t)=>{e&&e.commands.updateAttributes(`image`,t)},S=(e,t)=>{e&&e.commands.updateAttributes(`image`,{align:t})};async function te(e,t,n){let r=e.extensionManager.extensions.find(e=>e.name===`image`)?.options?.onImageUpload;try{let i=``;if(r?i=await r(t):(console.log(`SmoEditor: 未检测到 onImageUpload,启用 Base64 模式`),i=await w(t)),i){let t=e.chain().focus();n===void 0?t.setImage({src:i}).run():t.insertContentAt(n,{type:`image`,attrs:{src:i}}).run()}}catch(e){console.error(`上传失败`,e)}}async function C(e,t,n){let r=n;for(let n of t)await te(e,n,r),r!==void 0&&(r+=1)}var w=e=>new Promise((t,n)=>{let r=new FileReader;r.readAsDataURL(e),r.onload=()=>t(r.result),r.onerror=e=>n(e)}),T=e=>[r.default.configure({heading:{levels:[1,2,3,4,5,6]},bulletList:{},orderedList:{},blockquote:{},link:{openOnClick:!1,autolink:!0,HTMLAttributes:{rel:`noopener noreferrer`,target:`_blank`,class:`smo-editor-link`}}}),o.default.configure({types:[`heading`,`paragraph`]}),i.Placeholder.configure({placeholder:`请输入内容...`}),_.configure({onImageUpload:e.onImageUpload,allowBase64:!0,HTMLAttributes:{class:`smo-editor-image`}}),s.default.configure({allowedMimeTypes:[`image/png`,`image/jpeg`,`image/gif`,`image/webp`],onDrop:async(e,t,n)=>{await C(e,t.filter(e=>e.type.startsWith(`image/`)),n)},onPaste:async(e,t)=>{await C(e,t.filter(e=>e.type.startsWith(`image/`)))}})],E=(e={})=>{let t={...g,...e};return new n.Editor({content:t.content,editable:t.editable,extensions:T({onImageUpload:e.onImageUpload}),editorProps:{attributes:{class:`smo-editor-content`}}})},D=(0,t.defineComponent)({__name:`EditorContent`,props:{editor:{}},setup(e){return(r,i)=>e.editor?((0,t.openBlock)(),(0,t.createBlock)((0,t.unref)(n.EditorContent),{key:0,editor:e.editor},null,8,[`editor`])):(0,t.createCommentVNode)(``,!0)}}),O=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},k=O(D,[[`__scopeId`,`data-v-8407b2ea`]]),A={class:`smo-toolbar-group`},j=O((0,t.defineComponent)({__name:`ToolbarGroup`,setup(e){return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,A,[(0,t.renderSlot)(e.$slots,`default`,{},void 0,!0)]))}}),[[`__scopeId`,`data-v-0762240b`]]),M=[`disabled`,`title`],N=O((0,t.defineComponent)({__name:`ToolbarButton`,props:{active:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},title:{default:``}},emits:[`click`],setup(e,{emit:n}){let r=n,i=e=>{r(`click`,e)};return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{type:`button`,class:(0,t.normalizeClass)([`smo-toolbar-button`,{"is-active":e.active}]),disabled:e.disabled,title:e.title,onClick:i},[(0,t.renderSlot)(n.$slots,`default`,{},void 0,!0)],10,M))}}),[[`__scopeId`,`data-v-10d293e2`]]),P={bold:`<path fill-rule="evenodd" clip-rule="evenodd" d="M6 2.5C5.17157 2.5 4.5 3.17157 4.5 4V20C4.5 20.8284 5.17157 21.5 6 21.5H15C16.4587 21.5 17.8576 20.9205 18.8891 19.8891C19.9205 18.8576 20.5 17.4587 20.5 16C20.5 14.5413 19.9205 13.1424 18.8891 12.1109C18.6781 11.9 18.4518 11.7079 18.2128 11.5359C19.041 10.5492 19.5 9.29829 19.5 8C19.5 6.54131 18.9205 5.14236 17.8891 4.11091C16.8576 3.07946 15.4587 2.5 14 2.5H6ZM14 10.5C14.663 10.5 15.2989 10.2366 15.7678 9.76777C16.2366 9.29893 16.5 8.66304 16.5 8C16.5 7.33696 16.2366 6.70107 15.7678 6.23223C15.2989 5.76339 14.663 5.5 14 5.5H7.5V10.5H14ZM7.5 18.5V13.5H15C15.663 13.5 16.2989 13.7634 16.7678 14.2322C17.2366 14.7011 17.5 15.337 17.5 16C17.5 16.663 17.2366 17.2989 16.7678 17.7678C16.2989 18.2366 15.663 18.5 15 18.5H7.5Z" fill="currentColor"></path>`,italic:`<path d="M15.0222 3H19C19.5523 3 20 3.44772 20 4C20 4.55228 19.5523 5 19 5H15.693L10.443 19H14C14.5523 19 15 19.4477 15 20C15 20.5523 14.5523 21 14 21H9.02418C9.00802 21.0004 8.99181 21.0004 8.97557 21H5C4.44772 21 4 20.5523 4 20C4 19.4477 4.44772 19 5 19H8.30704L13.557 5H10C9.44772 5 9 4.55228 9 4C9 3.44772 9.44772 3 10 3H14.9782C14.9928 2.99968 15.0075 2.99967 15.0222 3Z" fill="currentColor"></path>`,heading1:`<path d="M4 5v14h2v-6h6v6h2V5h-2v5H6V5H4zm14 2.5V19h-2v-8.3l-1.8 1-.6-1.6 3.6-2h.8z" />`,heading2:`<path d="M4 5v14h2v-6h6v6h2V5h-2v5H6V5H4zm13.3 9c.7-.7 1.4-1.4 2-2.1.8-.9 1.4-1.9 1.4-3 0-1.9-1.5-3.4-3.4-3.4-1.6 0-2.9 1.1-3.3 2.6l1.9.5c.2-.7.8-1.2 1.4-1.2.8 0 1.5.7 1.5 1.5 0 .6-.3 1.1-.8 1.6-.7.7-1.4 1.4-2.1 2.1L14 15.1V19h7v-2h-3.7l1-1z" />`,heading3:`<path d="M4 5v14h2v-6h6v6h2V5h-2v5H6V5H4zm13.3 9c.7-.7 1.4-1.4 2-2.1.8-.9 1.4-1.9 1.4-3 0-1.9-1.5-3.4-3.4-3.4-1.6 0-2.9 1.1-3.3 2.6l1.9.5c.2-.7.8-1.2 1.4-1.2.8 0 1.5.7 1.5 1.5 0 .6-.3 1.1-.8 1.6-.7.7-1.4 1.4-2.1 2.1L14 15.1V19h7v-2h-3.7l1-1z" />`,bulletList:`
|
|
2
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M7 6C7 5.44772 7.44772 5 8 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H8C7.44772 7 7 6.55228 7 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M7 12C7 11.4477 7.44772 11 8 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H8C7.44772 13 7 12.5523 7 12Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M7 18C7 17.4477 7.44772 17 8 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H8C7.44772 19 7 18.5523 7 18Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M2 6C2 5.44772 2.44772 5 3 5H3.01C3.56228 5 4.01 5.44772 4.01 6C4.01 6.55228 3.56228 7 3.01 7H3C2.44772 7 2 6.55228 2 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M2 12C2 11.4477 2.44772 11 3 11H3.01C3.56228 11 4.01 11.4477 4.01 12C4.01 12.5523 3.56228 13 3.01 13H3C2.44772 13 2 12.5523 2 12Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M2 18C2 17.4477 2.44772 17 3 17H3.01C3.56228 17 4.01 17.4477 4.01 18C4.01 18.5523 3.56228 19 3.01 19H3C2.44772 19 2 18.5523 2 18Z" fill="currentColor"></path>
|
|
3
|
+
`,orderedList:`<path fill-rule="evenodd" clip-rule="evenodd" d="M9 6C9 5.44772 9.44772 5 10 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H10C9.44772 7 9 6.55228 9 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M9 12C9 11.4477 9.44772 11 10 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H10C9.44772 13 9 12.5523 9 12Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M9 18C9 17.4477 9.44772 17 10 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H10C9.44772 19 9 18.5523 9 18Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M3 6C3 5.44772 3.44772 5 4 5H5C5.55228 5 6 5.44772 6 6V10C6 10.5523 5.55228 11 5 11C4.44772 11 4 10.5523 4 10V7C3.44772 7 3 6.55228 3 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M3 10C3 9.44772 3.44772 9 4 9H6C6.55228 9 7 9.44772 7 10C7 10.5523 6.55228 11 6 11H4C3.44772 11 3 10.5523 3 10Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M5.82219 13.0431C6.54543 13.4047 6.99997 14.1319 6.99997 15C6.99997 15.5763 6.71806 16.0426 6.48747 16.35C6.31395 16.5814 6.1052 16.8044 5.91309 17H5.99997C6.55226 17 6.99997 17.4477 6.99997 18C6.99997 18.5523 6.55226 19 5.99997 19H3.99997C3.44769 19 2.99997 18.5523 2.99997 18C2.99997 17.4237 3.28189 16.9575 3.51247 16.65C3.74323 16.3424 4.03626 16.0494 4.26965 15.8161C4.27745 15.8083 4.2852 15.8006 4.29287 15.7929C4.55594 15.5298 4.75095 15.3321 4.88748 15.15C4.96287 15.0495 4.99021 14.9922 4.99911 14.9714C4.99535 14.9112 4.9803 14.882 4.9739 14.8715C4.96613 14.8588 4.95382 14.845 4.92776 14.8319C4.87723 14.8067 4.71156 14.7623 4.44719 14.8944C3.95321 15.1414 3.35254 14.9412 3.10555 14.4472C2.85856 13.9533 3.05878 13.3526 3.55276 13.1056C4.28839 12.7378 5.12272 12.6934 5.82219 13.0431Z" fill="currentColor"></path>`,blockquote:`<path fill-rule="evenodd" clip-rule="evenodd" d="M8 6C8 5.44772 8.44772 5 9 5H16C16.5523 5 17 5.44772 17 6C17 6.55228 16.5523 7 16 7H9C8.44772 7 8 6.55228 8 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M4 3C4.55228 3 5 3.44772 5 4L5 20C5 20.5523 4.55229 21 4 21C3.44772 21 3 20.5523 3 20L3 4C3 3.44772 3.44772 3 4 3Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M8 12C8 11.4477 8.44772 11 9 11H20C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H9C8.44772 13 8 12.5523 8 12Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M8 18C8 17.4477 8.44772 17 9 17H16C16.5523 17 17 17.4477 17 18C17 18.5523 16.5523 19 16 19H9C8.44772 19 8 18.5523 8 18Z" fill="currentColor"></path>`,codeBlock:`<path d="M8 5v14l11-7zM4 19h2V5H4v14z" />`,codeBlockAlt:`<path fill-rule="evenodd" clip-rule="evenodd" d="M6.70711 2.29289C7.09763 2.68342 7.09763 3.31658 6.70711 3.70711L4.41421 6L6.70711 8.29289C7.09763 8.68342 7.09763 9.31658 6.70711 9.70711C6.31658 10.0976 5.68342 10.0976 5.29289 9.70711L2.29289 6.70711C1.90237 6.31658 1.90237 5.68342 2.29289 5.29289L5.29289 2.29289C5.68342 1.90237 6.31658 1.90237 6.70711 2.29289Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M10.2929 2.29289C10.6834 1.90237 11.3166 1.90237 11.7071 2.29289L14.7071 5.29289C15.0976 5.68342 15.0976 6.31658 14.7071 6.70711L11.7071 9.70711C11.3166 10.0976 10.6834 10.0976 10.2929 9.70711C9.90237 9.31658 9.90237 8.68342 10.2929 8.29289L12.5858 6L10.2929 3.70711C9.90237 3.31658 9.90237 2.68342 10.2929 2.29289Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M17 4C17 3.44772 17.4477 3 18 3H19C20.6569 3 22 4.34315 22 6V18C22 19.6569 20.6569 21 19 21H5C3.34315 21 2 19.6569 2 18V12C2 11.4477 2.44772 11 3 11C3.55228 11 4 11.4477 4 12V18C4 18.5523 4.44772 19 5 19H19C19.5523 19 20 18.5523 20 18V6C20 5.44772 19.5523 5 19 5H18C17.4477 5 17 4.55228 17 4Z" fill="currentColor"></path>`,horizontalRule:`
|
|
4
|
+
<rect x="8" y="4" width="8" height="1.5" rx="0.75" fill="currentColor" opacity="0.7" />
|
|
5
|
+
|
|
6
|
+
<rect x="3" y="11.25" width="18" height="1.5" rx="0.75" fill="currentColor" />
|
|
7
|
+
|
|
8
|
+
<rect x="8" y="18.5" width="8" height="1.5" rx="0.75" fill="currentColor" opacity="0.7" />
|
|
9
|
+
`,strike:`<path d="M9.00039 3H16.0001C16.5524 3 17.0001 3.44772 17.0001 4C17.0001 4.55229 16.5524 5 16.0001 5H9.00011C8.68006 4.99983 8.36412 5.07648 8.07983 5.22349C7.79555 5.37051 7.55069 5.5836 7.36585 5.84487C7.181 6.10614 7.06155 6.40796 7.01754 6.72497C6.97352 7.04198 7.00623 7.36492 7.11292 7.66667C7.29701 8.18737 7.02414 8.75872 6.50344 8.94281C5.98274 9.1269 5.4114 8.85403 5.2273 8.33333C5.01393 7.72984 4.94851 7.08396 5.03654 6.44994C5.12456 5.81592 5.36346 5.21229 5.73316 4.68974C6.10285 4.1672 6.59256 3.74101 7.16113 3.44698C7.72955 3.15303 8.36047 2.99975 9.00039 3Z" fill="currentColor"></path><path d="M18 13H20C20.5523 13 21 12.5523 21 12C21 11.4477 20.5523 11 20 11H4C3.44772 11 3 11.4477 3 12C3 12.5523 3.44772 13 4 13H14C14.7956 13 15.5587 13.3161 16.1213 13.8787C16.6839 14.4413 17 15.2044 17 16C17 16.7956 16.6839 17.5587 16.1213 18.1213C15.5587 18.6839 14.7956 19 14 19H6C5.44772 19 5 19.4477 5 20C5 20.5523 5.44772 21 6 21H14C15.3261 21 16.5979 20.4732 17.5355 19.5355C18.4732 18.5979 19 17.3261 19 16C19 14.9119 18.6453 13.8604 18 13Z" fill="currentColor"></path>`,code:`<path d="M15.4545 4.2983C15.6192 3.77115 15.3254 3.21028 14.7983 3.04554C14.2712 2.88081 13.7103 3.1746 13.5455 3.70175L8.54554 19.7017C8.38081 20.2289 8.6746 20.7898 9.20175 20.9545C9.72889 21.1192 10.2898 20.8254 10.4545 20.2983L15.4545 4.2983Z" fill="currentColor"></path><path d="M6.70711 7.29289C7.09763 7.68342 7.09763 8.31658 6.70711 8.70711L3.41421 12L6.70711 15.2929C7.09763 15.6834 7.09763 16.3166 6.70711 16.7071C6.31658 17.0976 5.68342 17.0976 5.29289 16.7071L1.29289 12.7071C0.902369 12.3166 0.902369 11.6834 1.29289 11.2929L5.29289 7.29289C5.68342 6.90237 6.31658 6.90237 6.70711 7.29289Z" fill="currentColor"></path><path d="M17.2929 7.29289C17.6834 6.90237 18.3166 6.90237 18.7071 7.29289L22.7071 11.2929C23.0976 11.6834 23.0976 12.3166 22.7071 12.7071L18.7071 16.7071C18.3166 17.0976 17.6834 17.0976 17.2929 16.7071C16.9024 16.3166 16.9024 15.6834 17.2929 15.2929L20.5858 12L17.2929 8.70711C16.9024 8.31658 16.9024 7.68342 17.2929 7.29289Z" fill="currentColor"></path>`,undo:`<path d="M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z" />`,redo:`<path d="M18.4 10.6C16.55 8.99 14.15 8 11.5 8c-4.65 0-8.58 3.03-9.96 7.22l2.37.78c1.05-3.19 4.06-5.5 7.59-5.5 1.96 0 3.73.72 5.12 1.88L13 16h9V7l-3.6 3.6z" />`,link:`<path d="M16.9958 1.06669C15.4226 1.05302 13.907 1.65779 12.7753 2.75074L12.765 2.76086L11.045 4.47086C10.6534 4.86024 10.6515 5.49341 11.0409 5.88507C11.4303 6.27673 12.0634 6.27858 12.4551 5.88919L14.1697 4.18456C14.9236 3.45893 15.9319 3.05752 16.9784 3.06662C18.0272 3.07573 19.0304 3.49641 19.772 4.23804C20.5137 4.97967 20.9344 5.98292 20.9435 7.03171C20.9526 8.07776 20.5515 9.08563 19.8265 9.83941L16.833 12.8329C16.4274 13.2386 15.9393 13.5524 15.4019 13.7529C14.8645 13.9533 14.2903 14.0359 13.7181 13.9949C13.146 13.9539 12.5894 13.7904 12.0861 13.5154C11.5827 13.2404 11.1444 12.8604 10.8008 12.401C10.47 11.9588 9.84333 11.8685 9.40108 12.1993C8.95883 12.5301 8.86849 13.1568 9.1993 13.599C9.71464 14.288 10.3721 14.858 11.1272 15.2705C11.8822 15.683 12.7171 15.9283 13.5753 15.9898C14.4334 16.0513 15.2948 15.9274 16.1009 15.6267C16.907 15.326 17.639 14.8555 18.2473 14.247L21.2472 11.2471L21.2593 11.2347C22.3523 10.1031 22.9571 8.58751 22.9434 7.01433C22.9297 5.44115 22.2987 3.93628 21.1863 2.82383C20.0738 1.71138 18.5689 1.08036 16.9958 1.06669ZM10.4247 8.0102C9.56657 7.94874 8.70522 8.07256 7.89911 8.37326C7.09305 8.67395 6.36096 9.14458 5.75272 9.753L2.75285 12.7529L2.74067 12.7653C1.64772 13.8969 1.04295 15.4125 1.05662 16.9857C1.07029 18.5589 1.70131 20.0637 2.81376 21.1762C3.9262 22.2886 5.43108 22.9196 7.00426 22.9333C8.57744 22.947 10.0931 22.3422 11.2247 21.2493L11.2371 21.2371L12.9471 19.5271C13.3376 19.1366 13.3376 18.5034 12.9471 18.1129C12.5565 17.7223 11.9234 17.7223 11.5328 18.1129L9.82932 19.8164C9.07555 20.5414 8.06768 20.9425 7.02164 20.9334C5.97285 20.9243 4.9696 20.5036 4.22797 19.762C3.48634 19.0203 3.06566 18.0171 3.05655 16.9683C3.04746 15.9222 3.44851 14.9144 4.17355 14.1606L7.16719 11.167C7.5727 10.7613 8.06071 10.4476 8.59811 10.2471C9.13552 10.0467 9.70976 9.96412 10.2819 10.0051C10.854 10.0461 11.4106 10.2096 11.9139 10.4846C12.4173 10.7596 12.8556 11.1397 13.1992 11.599C13.53 12.0412 14.1567 12.1316 14.5989 11.8007C15.0412 11.4699 15.1315 10.8433 14.8007 10.401C14.2854 9.71205 13.6279 9.14198 12.8729 8.72948C12.1178 8.31697 11.2829 8.07166 10.4247 8.0102Z" />`,image:`
|
|
10
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M20 2C20 1.44772 19.5523 1 19 1C18.4477 1 18 1.44772 18 2V4H16C15.4477 4 15 4.44772 15 5C15 5.55228 15.4477 6 16 6H18V8C18 8.55228 18.4477 9 19 9C19.5523 9 20 8.55228 20 8V6H22C22.5523 6 23 5.55228 23 5C23 4.44772 22.5523 4 22 4H20V2ZM5 4C4.73478 4 4.48043 4.10536 4.29289 4.29289C4.10536 4.48043 4 4.73478 4 5V19C4 19.2652 4.10536 19.5196 4.29289 19.7071C4.48043 19.8946 4.73478 20 5 20H5.58579L14.379 11.2068C14.9416 10.6444 15.7045 10.3284 16.5 10.3284C17.2955 10.3284 18.0584 10.6444 18.621 11.2068L20 12.5858V12C20 11.4477 20.4477 11 21 11C21.5523 11 22 11.4477 22 12V14.998C22 14.9994 22 15.0007 22 15.002V19C22 19.7957 21.6839 20.5587 21.1213 21.1213C20.5587 21.6839 19.7957 22 19 22H6.00219C6.00073 22 5.99927 22 5.99781 22H5C4.20435 22 3.44129 21.6839 2.87868 21.1213C2.31607 20.5587 2 19.7957 2 19V5C2 4.20435 2.31607 3.44129 2.87868 2.87868C3.44129 2.31607 4.20435 2 5 2H12C12.5523 2 13 2.44772 13 3C13 3.55228 12.5523 4 12 4H5ZM8.41422 20H19C19.2652 20 19.5196 19.8946 19.7071 19.7071C19.8946 19.5196 20 19.2652 20 19V15.4142L17.207 12.6212C17.0195 12.4338 16.7651 12.3284 16.5 12.3284C16.2349 12.3284 15.9806 12.4337 15.7931 12.6211L8.41422 20ZM6.87868 6.87868C7.44129 6.31607 8.20435 6 9 6C9.79565 6 10.5587 6.31607 11.1213 6.87868C11.6839 7.44129 12 8.20435 12 9C12 9.79565 11.6839 10.5587 11.1213 11.1213C10.5587 11.6839 9.79565 12 9 12C8.20435 12 7.44129 11.6839 6.87868 11.1213C6.31607 10.5587 6 9.79565 6 9C6 8.20435 6.31607 7.44129 6.87868 6.87868ZM9 8C8.73478 8 8.48043 8.10536 8.29289 8.29289C8.10536 8.48043 8 8.73478 8 9C8 9.26522 8.10536 9.51957 8.29289 9.70711C8.48043 9.89464 8.73478 10 9 10C9.26522 10 9.51957 9.89464 9.70711 9.70711C9.89464 9.51957 10 9.26522 10 9C10 8.73478 9.89464 8.48043 9.70711 8.29289C9.51957 8.10536 9.26522 8 9 8Z" fill="currentColor"></path>
|
|
11
|
+
`,alignLeft:`<path fill-rule="evenodd" clip-rule="evenodd" d="M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M2 12C2 11.4477 2.44772 11 3 11H15C15.5523 11 16 11.4477 16 12C16 12.5523 15.5523 13 15 13H3C2.44772 13 2 12.5523 2 12Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M2 18C2 17.4477 2.44772 17 3 17H17C17.5523 17 18 17.4477 18 18C18 18.5523 17.5523 19 17 19H3C2.44772 19 2 18.5523 2 18Z" fill="currentColor"></path>`,alignCenter:`<path fill-rule="evenodd" clip-rule="evenodd" d="M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M6 12C6 11.4477 6.44772 11 7 11H17C17.5523 11 18 11.4477 18 12C18 12.5523 17.5523 13 17 13H7C6.44772 13 6 12.5523 6 12Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M4 18C4 17.4477 4.44772 17 5 17H19C19.5523 17 20 17.4477 20 18C20 18.5523 19.5523 19 19 19H5C4.44772 19 4 18.5523 4 18Z" fill="currentColor"></path>`,alignRight:`<path fill-rule="evenodd" clip-rule="evenodd" d="M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M8 12C8 11.4477 8.44772 11 9 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H9C8.44772 13 8 12.5523 8 12Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M6 18C6 17.4477 6.44772 17 7 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H7C6.44772 19 6 18.5523 6 18Z" fill="currentColor"></path>`,alignJustify:`<path fill-rule="evenodd" clip-rule="evenodd" d="M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M2 12C2 11.4477 2.44772 11 3 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H3C2.44772 13 2 12.5523 2 12Z" fill="currentColor"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M2 18C2 17.4477 2.44772 17 3 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H3C2.44772 19 2 18.5523 2 18Z" fill="currentColor"></path>`},F=[`width`,`height`,`fill`,`innerHTML`],I=O((0,t.defineComponent)({__name:`SmoIcon`,props:{name:{},size:{default:16},color:{default:`currentColor`}},setup(e){let n=e,r=(0,t.computed)(()=>P[n.name]||(console.warn(`[SmoIcon]: 图标 "${n.name}" 未在注册表中注册。`),``));return(n,i)=>((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,width:e.size,height:e.size,fill:e.color,class:`smo-icon`,innerHTML:r.value},null,8,F))}}),[[`__scopeId`,`data-v-4de271c4`]]),L=(0,t.defineComponent)({__name:`TextAlignButton`,props:{editor:{}},setup(e){return(n,r)=>((0,t.openBlock)(),(0,t.createBlock)(j,null,{default:(0,t.withCtx)(()=>[(0,t.createVNode)(N,{title:`左对齐`,active:e.editor.isActive({textAlign:`left`}),onClick:r[0]||=t=>e.editor.chain().focus().setTextAlign(`left`).run()},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`alignLeft`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{title:`居中对齐`,active:e.editor.isActive({textAlign:`center`}),onClick:r[1]||=t=>e.editor.chain().focus().setTextAlign(`center`).run()},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`alignCenter`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{title:`右对齐`,active:e.editor.isActive({textAlign:`right`}),onClick:r[2]||=t=>e.editor.chain().focus().setTextAlign(`right`).run()},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`alignRight`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{title:`两端对齐`,active:e.editor.isActive({textAlign:`justify`}),onClick:r[3]||=t=>e.editor.chain().focus().setTextAlign(`justify`).run()},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`alignJustify`})]),_:1},8,[`active`])]),_:1}))}}),R=[`title`],z={class:`smo-select-value`},B={key:0,class:`smo-select-dropdown`},V=[`onClick`],H={key:0,class:`smo-option-check`},U=O((0,t.defineComponent)({__name:`ToolbarSelect`,props:{modelValue:{},options:{},title:{}},emits:[`change`],setup(e,{emit:n}){let r=e,i=n,a=(0,t.ref)(!1),o=(0,t.ref)(null),s=(0,t.computed)(()=>{let e=r.options.find(e=>e.value===r.modelValue);return e?e.label:``}),c=()=>{a.value=!a.value},l=e=>{i(`change`,e),a.value=!1},u=e=>{o.value&&!o.value.contains(e.target)&&(a.value=!1)};return(0,t.onMounted)(()=>{document.addEventListener(`click`,u)}),(0,t.onBeforeUnmount)(()=>{document.removeEventListener(`click`,u)}),(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref_key:`selectRef`,ref:o,class:`smo-custom-select`,title:e.title},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`smo-select-trigger`,{"is-active":a.value}]),onClick:c},[(0,t.createElementVNode)(`span`,z,(0,t.toDisplayString)(s.value),1),(0,t.createElementVNode)(`span`,{class:(0,t.normalizeClass)([`smo-select-arrow`,{"is-rotated":a.value}])},`▼`,2)],2),(0,t.createVNode)(t.Transition,{name:`smo-fade`},{default:(0,t.withCtx)(()=>[a.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,B,[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(e.options,n=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:n.value,class:(0,t.normalizeClass)([`smo-select-option`,{"is-selected":n.value===e.modelValue,"opt-h1":n.value===1,"opt-h2":n.value===2,"opt-h3":n.value===3,"opt-h4":n.value===4}]),onClick:e=>l(n.value)},[(0,t.createTextVNode)((0,t.toDisplayString)(n.label)+` `,1),n.value===e.modelValue?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,H,`✓`)):(0,t.createCommentVNode)(``,!0)],10,V))),128))])):(0,t.createCommentVNode)(``,!0)]),_:1})],8,R))}}),[[`__scopeId`,`data-v-0b16f052`]]),W=e=>e?e.chain().focus().toggleBold().run():!1,G=e=>e?e.isActive(`bold`):!1,K=(e,t)=>e?e.chain().focus().toggleHeading({level:t}).run():!1,q=e=>{if(!e)return 0;for(let t=1;t<=6;t++)if(e.isActive(`heading`,{level:t}))return t;return 0},J=e=>e?e.chain().focus().toggleItalic().run():!1,Y=e=>e?e.isActive(`italic`):!1,X=e=>e?e.chain().focus().toggleBulletList().run():!1,Z=e=>e?e.isActive(`bulletList`):!1,ne=e=>e?e.chain().focus().toggleOrderedList().run():!1,re=e=>e?e.isActive(`orderedList`):!1,ie=e=>e?e.chain().focus().toggleBlockquote().run():!1,ae=e=>e?e.isActive(`blockquote`):!1,oe=e=>e?e.chain().focus().toggleCodeBlock().run():!1,se=e=>e?e.isActive(`codeBlock`):!1,ce=e=>e?e.chain().focus().setHorizontalRule().run():!1,le=e=>e?e.chain().focus().toggleStrike().run():!1,ue=e=>e?e.isActive(`strike`):!1,de=e=>e?e.chain().focus().toggleCode().run():!1,fe=e=>e?e.isActive(`code`):!1,pe=e=>e?e.chain().focus().undo().run():!1,me=e=>e?e.can().undo():!1,he=e=>e?e.chain().focus().redo().run():!1,ge=e=>e?e.can().redo():!1,Q=e=>e?e.isActive(`link`):!1,_e=e=>e&&e.getAttributes(`link`).href||``,ve=e=>e?e.chain().focus().extendMarkRange(`link`).unsetLink().run():!1,ye={class:`smo-link-setter`},be={class:`smo-popover-field`},$={class:`smo-popover-field`},xe={class:`smo-link-actions`},Se=O((0,t.defineComponent)({__name:`LinkSetter`,props:{editor:{}},setup(e){let n=e,r=(0,t.ref)(!1),i=(0,t.ref)(``),a=(0,t.ref)(``),o=(0,t.ref)({top:`0px`,left:`0px`}),s={from:0,to:0},c=()=>{if(!n.editor||!r.value)return;let{view:e}=n.editor,{from:t,to:i}=e.state.selection;try{let n=e.coordsAtPos(t),r=e.coordsAtPos(i),a=(n.left+r.left)/2;o.value={top:`${n.top-10+window.scrollY}px`,left:`${a+window.scrollX}px`}}catch(e){console.log(e)}},l=()=>{let{from:e,to:t}=n.editor.state.selection;s={from:e,to:t},i.value=Q(n.editor)?_e(n.editor):``,e===t?a.value=Q(n.editor)?`链接文本`:``:a.value=n.editor.state.doc.textBetween(e,t,` `)};(0,t.watch)(()=>n.editor?.state.selection,()=>{n.editor&&(Q(n.editor)?(l(),r.value=!0,(0,t.nextTick)(c)):r.value&&!Q(n.editor)&&s.from===s.to&&p())},{deep:!0});let u=async()=>{if(r.value){p();return}l(),a.value||=`新链接`,r.value=!0,await(0,t.nextTick)(),c()},d=()=>{if(!n.editor)return;let{from:e,to:t}=s,r=a.value||i.value;n.editor.chain().focus().insertContentAt({from:e,to:t},{type:`text`,text:r,marks:[{type:`link`,attrs:{href:i.value,target:`_blank`}}]}).run();let o=n.editor.state.selection.to;n.editor.chain().setTextSelection(o).unsetMark(`link`).run(),p()},f=()=>{n.editor.chain().focus().setTextSelection(s).run(),ve(n.editor),p()},p=()=>{r.value=!1,i.value=``,a.value=``};return typeof window<`u`&&(window.addEventListener(`scroll`,c,!0),window.addEventListener(`resize`,c)),(0,t.onBeforeUnmount)(()=>{typeof window<`u`&&(window.removeEventListener(`scroll`,c,!0),window.removeEventListener(`resize`,c))}),(n,s)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,ye,[(0,t.createVNode)(N,{active:(0,t.unref)(Q)(e.editor)||r.value,title:`超链接`,onClick:u},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`link`,size:`16`})]),_:1},8,[`active`]),((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:`body`},[r.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:`smo-link-popover-fixed`,style:(0,t.normalizeStyle)(o.value),onMousedown:s[2]||=(0,t.withModifiers)(()=>{},[`stop`])},[(0,t.createElementVNode)(`div`,be,[s[3]||=(0,t.createElementVNode)(`span`,{class:`smo-field-label`},`文本:`,-1),(0,t.withDirectives)((0,t.createElementVNode)(`input`,{"onUpdate:modelValue":s[0]||=e=>a.value=e,type:`text`,class:`smo-link-input`,placeholder:`显示的文字`},null,512),[[t.vModelText,a.value]])]),(0,t.createElementVNode)(`div`,$,[s[4]||=(0,t.createElementVNode)(`span`,{class:`smo-field-label`},`链接:`,-1),(0,t.withDirectives)((0,t.createElementVNode)(`input`,{"onUpdate:modelValue":s[1]||=e=>i.value=e,type:`text`,class:`smo-link-input`,placeholder:`https://...`,onKeyup:(0,t.withKeys)(d,[`enter`])},null,544),[[t.vModelText,i.value]])]),(0,t.createElementVNode)(`div`,xe,[(0,t.createElementVNode)(`button`,{class:`smo-popover-btn primary`,onClick:d},`确定`),(0,t.unref)(Q)(e.editor)?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`smo-popover-btn danger`,onClick:f},` 删除 `)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`button`,{class:`smo-popover-btn`,onClick:p},`取消`)])],36)):(0,t.createCommentVNode)(``,!0)]))]))}}),[[`__scopeId`,`data-v-77dc2707`]]),Ce={class:`smo-image-setter`},we={class:`bubble-menu`},Te={class:`form-item`},Ee={class:`form-item`},De={class:`form-item`},Oe=O((0,t.defineComponent)({__name:`ImageButton`,props:{editor:{}},setup(e){let n=e,r=(0,t.ref)(null);(0,t.onMounted)(()=>{n.editor?.on(`selectionUpdate`,i)}),(0,t.onBeforeUnmount)(()=>{n.editor?.off(`selectionUpdate`,i)});let i=()=>{n.editor?.isActive(`image`)&&(s.value=n.editor.getAttributes(`image`).alt||``)},a=e=>{let t=e.target;if(t.files?.length){let e=Array.from(t.files);C(n.editor,e),t.value=``}},o=()=>n.editor.isActive(`image`),s=(0,t.ref)(``),l=(0,t.ref)(null),u=()=>{l.value&&clearTimeout(l.value),l.value=setTimeout(()=>{x(n.editor,{alt:s.value})},500)};return(n,i)=>((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,[(0,t.createElementVNode)(`div`,Ce,[(0,t.createElementVNode)(`input`,{ref_key:`fileInput`,ref:r,type:`file`,accept:`image/*`,multiple:``,hidden:``,onChange:a},null,544),(0,t.createVNode)(N,{title:`图片`,onClick:i[0]||=e=>r.value?.click()},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`image`,size:`16`})]),_:1})]),e.editor?((0,t.openBlock)(),(0,t.createBlock)((0,t.unref)(c.BubbleMenu),{key:0,class:`smo-image-bubble-menu`,editor:e.editor,"should-show":o,"tippy-options":{duration:100,interactive:!0}},{default:(0,t.withCtx)(()=>[(0,t.createElementVNode)(`div`,we,[(0,t.createElementVNode)(`div`,Te,[i[9]||=(0,t.createElementVNode)(`label`,null,`对齐方式`,-1),(0,t.createVNode)(j,{class:`align-group`},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(N,{active:(0,t.unref)(v)(e.editor,`left`),title:`居左对齐`,onClick:i[1]||=n=>(0,t.unref)(S)(e.editor,`left`)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`alignLeft`,size:`16`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(v)(e.editor,`center`),title:`居中对齐`,onClick:i[2]||=n=>(0,t.unref)(S)(e.editor,`center`)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`alignCenter`,size:`16`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(v)(e.editor,`right`),title:`居右对齐`,onClick:i[3]||=n=>(0,t.unref)(S)(e.editor,`right`)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`alignRight`,size:`16`})]),_:1},8,[`active`])]),_:1})]),(0,t.createElementVNode)(`div`,Ee,[i[14]||=(0,t.createElementVNode)(`label`,null,`图片宽度`,-1),(0,t.createVNode)(j,{class:`align-group`},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(N,{active:(0,t.unref)(y)(e.editor,`100%`),title:`宽度100%`,onClick:i[4]||=n=>(0,t.unref)(b)(e.editor,`100%`)},{default:(0,t.withCtx)(()=>[...i[10]||=[(0,t.createTextVNode)(`100%`,-1)]]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(y)(e.editor,`75%`),title:`宽度75%`,onClick:i[5]||=n=>(0,t.unref)(b)(e.editor,`75%`)},{default:(0,t.withCtx)(()=>[...i[11]||=[(0,t.createTextVNode)(`75%`,-1)]]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(y)(e.editor,`50%`),title:`宽度50%`,onClick:i[6]||=n=>(0,t.unref)(b)(e.editor,`50%`)},{default:(0,t.withCtx)(()=>[...i[12]||=[(0,t.createTextVNode)(`50%`,-1)]]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(y)(e.editor,`25%`),title:`宽度25%`,onClick:i[7]||=n=>(0,t.unref)(b)(e.editor,`25%`)},{default:(0,t.withCtx)(()=>[...i[13]||=[(0,t.createTextVNode)(`25%`,-1)]]),_:1},8,[`active`])]),_:1})]),(0,t.createElementVNode)(`div`,De,[i[15]||=(0,t.createElementVNode)(`label`,null,`图片描述`,-1),(0,t.withDirectives)((0,t.createElementVNode)(`input`,{"onUpdate:modelValue":i[8]||=e=>s.value=e,onInput:u,type:`text`,placeholder:`请输入图片alt描述`},null,544),[[t.vModelText,s.value]])])])]),_:1},8,[`editor`])):(0,t.createCommentVNode)(``,!0)],64))}}),[[`__scopeId`,`data-v-3b921f1f`]]),ke={key:0,class:`smo-toolbar`},Ae=(0,t.defineComponent)({__name:`Toolbar`,props:{editor:{}},setup(e){let n=e,r=[{label:`正文`,value:0},{label:`H1`,value:1},{label:`H2`,value:2},{label:`H3`,value:3},{label:`H4`,value:4},{label:`H5`,value:5},{label:`H6`,value:6}],i=(0,t.computed)(()=>q(n.editor)),a=e=>{n.editor&&(e===0?n.editor.chain().focus().setParagraph().run():K(n.editor,e))};return(n,o)=>e.editor?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,ke,[(0,t.createVNode)(j,null,{default:(0,t.withCtx)(()=>[(0,t.createVNode)(N,{disabled:!(0,t.unref)(me)(e.editor),title:`撤销`,onClick:o[0]||=n=>(0,t.unref)(pe)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`undo`})]),_:1},8,[`disabled`]),(0,t.createVNode)(N,{disabled:!(0,t.unref)(ge)(e.editor),title:`重做`,onClick:o[1]||=n=>(0,t.unref)(he)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`redo`})]),_:1},8,[`disabled`])]),_:1}),(0,t.createVNode)(j,null,{default:(0,t.withCtx)(()=>[(0,t.createVNode)(U,{"model-value":i.value,options:r,title:`文本层级`,onChange:a},null,8,[`model-value`])]),_:1}),(0,t.createVNode)(L,{editor:e.editor},null,8,[`editor`]),(0,t.createVNode)(j,null,{default:(0,t.withCtx)(()=>[(0,t.createVNode)(N,{active:(0,t.unref)(G)(e.editor),title:`加粗`,onClick:o[2]||=n=>(0,t.unref)(W)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`bold`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(Y)(e.editor),title:`斜体`,onClick:o[3]||=n=>(0,t.unref)(J)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`italic`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(ue)(e.editor),title:`删除线`,onClick:o[4]||=n=>(0,t.unref)(le)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`strike`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(fe)(e.editor),title:`行内代码`,onClick:o[5]||=n=>(0,t.unref)(de)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`code`})]),_:1},8,[`active`]),(0,t.createVNode)(Se,{editor:e.editor},null,8,[`editor`])]),_:1}),(0,t.createVNode)(j,null,{default:(0,t.withCtx)(()=>[(0,t.createVNode)(N,{active:(0,t.unref)(Z)(e.editor),title:`无序列表`,onClick:o[6]||=n=>(0,t.unref)(X)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`bulletList`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(re)(e.editor),title:`有序列表`,onClick:o[7]||=n=>(0,t.unref)(ne)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`orderedList`})]),_:1},8,[`active`])]),_:1}),(0,t.createVNode)(j,null,{default:(0,t.withCtx)(()=>[(0,t.createVNode)(N,{active:(0,t.unref)(ae)(e.editor),title:`引用区块`,onClick:o[8]||=n=>(0,t.unref)(ie)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`blockquote`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{active:(0,t.unref)(se)(e.editor),title:`代码块`,onClick:o[9]||=n=>(0,t.unref)(oe)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`codeBlockAlt`})]),_:1},8,[`active`]),(0,t.createVNode)(N,{title:`分割线`,onClick:o[10]||=n=>(0,t.unref)(ce)(e.editor)},{default:(0,t.withCtx)(()=>[(0,t.createVNode)(I,{name:`horizontalRule`})]),_:1}),(0,t.createVNode)(Oe,{editor:e.editor},null,8,[`editor`])]),_:1})])):(0,t.createCommentVNode)(``,!0)}}),je={class:`smo-editor-container`};e.SmoEditor=(0,t.defineComponent)({__name:`SmoEditor`,props:{modelValue:{default:``},editable:{type:Boolean,default:!0},placeholder:{default:``},height:{},onImageUpload:{}},emits:[`update:modelValue`],setup(e,{emit:n}){let r=e,i=n,a=(0,t.shallowRef)(null);(0,t.onMounted)(()=>{a.value=E({content:r.modelValue,editable:r.editable,placeholder:r.placeholder,height:r.height,onImageUpload:r.onImageUpload}),a.value.on(`update`,()=>{a.value&&i(`update:modelValue`,a.value.getHTML())})}),(0,t.watch)(()=>r.modelValue,e=>{a.value&&a.value.getHTML()!==e&&a.value.commands.setContent(e,{emitUpdate:!1})}),(0,t.onBeforeUnmount)(()=>{a.value&&=(a.value.destroy(),null)});let o=(0,t.computed)(()=>r.height===void 0||r.height===null?`auto`:/^\d+$/.test(String(r.height))?`${r.height}px`:String(r.height));return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,je,[(0,t.createVNode)(Ae,{editor:a.value},null,8,[`editor`]),(0,t.createVNode)(k,{editor:a.value,style:(0,t.normalizeStyle)({minHeight:o.value})},null,8,[`editor`,`style`])]))}})});
|
package/package.json
CHANGED
|
@@ -1,18 +1,26 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sanmokeji/smo-editor",
|
|
3
|
-
"version": "0.0.
|
|
4
|
-
"main": "./dist/
|
|
5
|
-
"module": "./dist/
|
|
6
|
-
"types": "./dist/
|
|
3
|
+
"version": "0.0.6",
|
|
4
|
+
"main": "./dist/smo-editor.umd.cjs",
|
|
5
|
+
"module": "./dist/smo-editor.js",
|
|
6
|
+
"types": "./dist/smo-editor.d.ts",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"exports": {
|
|
9
9
|
".": {
|
|
10
|
-
"types": "./dist/
|
|
11
|
-
"import": "./dist/
|
|
12
|
-
"
|
|
10
|
+
"types": "./dist/smo-editor.d.ts",
|
|
11
|
+
"import": "./dist/smo-editor.js",
|
|
12
|
+
"require": "./dist/smo-editor.umd.cjs"
|
|
13
13
|
},
|
|
14
|
-
"./
|
|
14
|
+
"./css": "./dist/smo-editor.css",
|
|
15
|
+
"./dist/smo-editor.css": "./dist/smo-editor.css"
|
|
15
16
|
},
|
|
17
|
+
"files": [
|
|
18
|
+
"dist"
|
|
19
|
+
],
|
|
20
|
+
"sideEffects": [
|
|
21
|
+
"*.css",
|
|
22
|
+
"*.scss"
|
|
23
|
+
],
|
|
16
24
|
"description": "基于 Tiptap + Vue 3 的富文本编辑器组件。",
|
|
17
25
|
"keywords": [
|
|
18
26
|
"vue3",
|
|
@@ -23,19 +31,11 @@
|
|
|
23
31
|
"富文本编辑器",
|
|
24
32
|
"markdown"
|
|
25
33
|
],
|
|
26
|
-
"files": [
|
|
27
|
-
"dist"
|
|
28
|
-
],
|
|
29
|
-
"sideEffects": [
|
|
30
|
-
"*.css"
|
|
31
|
-
],
|
|
32
|
-
"license": "MIT",
|
|
33
34
|
"peerDependencies": {
|
|
34
35
|
"@tiptap/vue-3": "^3.0.0",
|
|
35
36
|
"vue": "^3.0.0"
|
|
36
37
|
},
|
|
37
38
|
"dependencies": {
|
|
38
|
-
"@sanmokeji/smo-editor": "^0.0.3",
|
|
39
39
|
"@tiptap/extension-file-handler": "^3.23.6",
|
|
40
40
|
"@tiptap/extension-image": "^3.23.6",
|
|
41
41
|
"@tiptap/extension-placeholder": "^3.23.6",
|
|
@@ -47,6 +47,7 @@
|
|
|
47
47
|
"vue-router": "^5.0.4"
|
|
48
48
|
},
|
|
49
49
|
"devDependencies": {
|
|
50
|
+
"@microsoft/api-extractor": "^7.58.7",
|
|
50
51
|
"@tsconfig/node24": "^24.0.4",
|
|
51
52
|
"@types/node": "^24.12.2",
|
|
52
53
|
"@vitejs/plugin-vue": "^6.0.6",
|
|
@@ -62,8 +63,8 @@
|
|
|
62
63
|
"prettier": "3.8.3",
|
|
63
64
|
"sass-embedded": "^1.100.0",
|
|
64
65
|
"typescript": "~6.0.0",
|
|
66
|
+
"unplugin-dts": "^1.0.1",
|
|
65
67
|
"vite": "^8.0.8",
|
|
66
|
-
"vite-plugin-dts": "^4.5.4",
|
|
67
68
|
"vite-plugin-vue-devtools": "^8.1.1",
|
|
68
69
|
"vue-tsc": "^3.2.6"
|
|
69
70
|
},
|
|
@@ -74,7 +75,7 @@
|
|
|
74
75
|
"dev": "vite",
|
|
75
76
|
"build": "run-p type-check \"build-only {@}\" --",
|
|
76
77
|
"preview": "vite preview",
|
|
77
|
-
"build-only": "vite build
|
|
78
|
+
"build-only": "vite build",
|
|
78
79
|
"type-check": "vue-tsc --build",
|
|
79
80
|
"lint": "run-s lint:*",
|
|
80
81
|
"lint:oxlint": "oxlint . --fix",
|
package/dist/index.css
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
.smo-editor-content img{max-width:100%;transition:width .2s cubic-bezier(.4,0,.2,1);display:block}.smo-editor-content img[data-align=left]{margin-right:auto}.smo-editor-content img[data-align=center]{margin:0 auto}.smo-editor-content img[data-align=right]{margin-left:auto}.smo-editor-content-wrapper[data-v-1570b1c8]{border:1px solid #e2e8f0;border-radius:6px;outline:none;min-height:150px;padding:16px}[data-v-1570b1c8] .ProseMirror-selectednode{border-radius:4px;outline:2px solid #38bdf8}[data-v-1570b1c8] .tiptap:focus,[data-v-1570b1c8] .ProseMirror{outline:none}[data-v-1570b1c8] .ProseMirror ul{margin:8px 0;padding-left:24px;list-style-type:disc}[data-v-1570b1c8] .ProseMirror ol{margin:8px 0;padding-left:24px;list-style-type:decimal}[data-v-1570b1c8] .ProseMirror li p{margin:4px 0}[data-v-1570b1c8] .ProseMirror blockquote{color:#475569;background-color:#f8fafc;border-left:4px solid #cbd5e1;border-radius:2px;margin:12px 0;padding:8px 16px}[data-v-1570b1c8] .ProseMirror blockquote p{margin:4px 0}[data-v-1570b1c8] .ProseMirror pre{color:#38bdf8;background-color:#0f172a;border-radius:6px;margin:16px 0;padding:12px 16px;font-family:Fira Code,Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;overflow-x:auto}[data-v-1570b1c8] .ProseMirror pre code{color:inherit;background:0 0;padding:0;font-size:13px}[data-v-1570b1c8] .ProseMirror hr{cursor:pointer;border:none;border-top:2px solid #e2e8f0;margin:24px 0}[data-v-1570b1c8] .ProseMirror hr.ProseMirror-selectednode{outline:2px solid #38bdf8}[data-v-1570b1c8] .ProseMirror code{color:#e11d48;background-color:#f1f5f9;border-radius:4px;padding:2px 6px;font-family:monospace;font-size:.85em;font-weight:500}[data-v-1570b1c8] .ProseMirror .smo-editor-link{color:#2563eb;text-underline-offset:3px;cursor:pointer;font-weight:500;text-decoration:underline}[data-v-1570b1c8] .ProseMirror .smo-editor-link:hover{color:#1d4ed8}[data-v-1570b1c8] .tiptap .is-editor-empty:first-child:before{color:#adb5bd;content:attr(data-placeholder);float:left;pointer-events:none;height:0}[data-v-1570b1c8] .tiptap :first-child{margin-top:0}[data-v-1570b1c8] .tiptap [data-resize-handle]{z-index:10;background:#00000080;border:1px solid #fffc;border-radius:2px;position:absolute}[data-v-1570b1c8] .tiptap [data-resize-handle]:hover{background:#000c}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=top-left],[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=top-right],[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=bottom-left],[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=bottom-right]{width:8px;height:8px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=top-left]{cursor:nwse-resize;top:-4px;left:-4px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=top-right]{cursor:nesw-resize;top:-4px;right:-4px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=bottom-left]{cursor:nesw-resize;bottom:-4px;left:-4px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=bottom-right]{cursor:nwse-resize;bottom:-4px;right:-4px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=top],[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=bottom]{height:6px;left:8px;right:8px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=top]{cursor:ns-resize;top:-3px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=bottom]{cursor:ns-resize;bottom:-3px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=left],[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=right]{width:6px;top:8px;bottom:8px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=left]{cursor:ew-resize;left:-3px}[data-v-1570b1c8] .tiptap [data-resize-handle][data-resize-handle=right]{cursor:ew-resize;right:-3px}[data-v-1570b1c8] .tiptap [data-resize-state=true] [data-resize-wrapper]{border-radius:.125rem;outline:1px solid #00000040}.smo-toolbar-group[data-v-0762240b]{align-items:center;gap:2px;padding:0 4px;display:inline-flex;position:relative}.smo-toolbar-group+.smo-toolbar-group[data-v-0762240b]:before{content:"";background-color:#e2e8f0;width:1px;position:absolute;top:6px;bottom:6px;left:-2px}.smo-toolbar-button[data-v-10d293e2]{color:#475569;cursor:pointer;background:0 0;border:none;border-radius:4px;outline:none;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:inline-flex}.smo-toolbar-button[data-v-10d293e2]:hover:not(:disabled){color:#0f172a;background-color:#f1f5f9}.smo-toolbar-button.is-active[data-v-10d293e2]{color:#2563eb;background-color:#e2e8f0;font-weight:700}.smo-toolbar-button[data-v-10d293e2]:disabled{color:#cbd5e1;cursor:not-allowed}.smo-icon[data-v-8230f5dd]{vertical-align:middle;flex-shrink:0;display:inline-block}.smo-custom-select[data-v-0b16f052]{-webkit-user-select:none;user-select:none;display:inline-block;position:relative}.smo-select-trigger[data-v-0b16f052]{color:#475569;cursor:pointer;background-color:#0000;border-radius:4px;justify-content:space-between;align-items:center;min-width:50px;height:28px;padding:0 10px;font-size:13px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.smo-select-trigger[data-v-0b16f052]:hover,.smo-select-trigger.is-active[data-v-0b16f052]{color:#0f172a;background-color:#f1f5f9}.smo-select-value[data-v-0b16f052]{font-weight:500}.smo-select-arrow[data-v-0b16f052]{color:#94a3b8;margin-left:8px;font-size:8px;transition:transform .2s;transform:scale(.8)}.smo-select-arrow.is-rotated[data-v-0b16f052]{transform:scale(.8)rotate(180deg)}.smo-select-dropdown[data-v-0b16f052]{z-index:50;background-color:#fff;border:1px solid #e2e8f0;border-radius:6px;min-width:160px;padding:4px;position:absolute;top:calc(100% + 4px);left:0;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.smo-select-option[data-v-0b16f052]{color:#334155;cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;margin-bottom:2px;padding:6px 10px;font-size:13px;transition:background-color .15s;display:flex}.smo-select-option[data-v-0b16f052]:last-child{margin-bottom:0}.smo-select-option[data-v-0b16f052]:hover{color:#0f172a;background-color:#f8fafc}.smo-select-option.is-selected[data-v-0b16f052]{color:#2563eb;background-color:#eff6ff;font-weight:500}.smo-option-check[data-v-0b16f052]{font-size:11px;font-weight:700}.smo-select-option.opt-h1[data-v-0b16f052]{font-size:18px;font-weight:700}.smo-select-option.opt-h2[data-v-0b16f052]{font-size:16px;font-weight:600}.smo-select-option.opt-h3[data-v-0b16f052]{font-size:14px;font-weight:600}.smo-select-option.opt-h4[data-v-0b16f052]{font-size:13px;font-weight:600}.smo-select-option.opt-h5[data-v-0b16f052]{font-size:12px;font-weight:600}.smo-select-option.opt-h6[data-v-0b16f052]{font-size:11px;font-weight:600}.smo-fade-enter-active[data-v-0b16f052],.smo-fade-leave-active[data-v-0b16f052]{transition:opacity .15s,transform .15s}.smo-fade-enter-from[data-v-0b16f052],.smo-fade-leave-to[data-v-0b16f052]{opacity:0;transform:translateY(-4px)}.smo-link-setter[data-v-77dc2707]{display:inline-block}.smo-link-popover-fixed[data-v-77dc2707]{z-index:9999;background:#fff;border:1px solid #e2e8f0;border-radius:8px;flex-direction:column;gap:10px;width:280px;padding:12px;display:flex;position:fixed;transform:translate(-50%,-100%);box-shadow:0 10px 25px -5px #0f172a26}.smo-popover-field[data-v-77dc2707]{align-items:center;gap:8px;display:flex}.smo-field-label[data-v-77dc2707]{color:#64748b;min-width:36px;font-size:12px}.smo-link-input[data-v-77dc2707]{border:1px solid #cbd5e1;border-radius:4px;outline:none;flex:1;padding:5px 8px;font-size:12px}.smo-link-input[data-v-77dc2707]:focus{border-color:#2563eb}.smo-link-actions[data-v-77dc2707]{justify-content:flex-end;gap:6px;margin-top:4px;display:flex}.smo-popover-btn[data-v-77dc2707]{cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:4px;padding:4px 10px;font-size:12px}.smo-popover-btn.primary[data-v-77dc2707]{color:#fff;background:#2563eb;border-color:#2563eb}.smo-popover-btn.danger[data-v-77dc2707]{color:#fff;background:#ef4444;border-color:#ef4444}.bubble-menu[data-v-3b921f1f]{background-color:#fff;border:1px solid #3d25140d;border-radius:10px;min-width:300px;padding:15px;box-shadow:0 12px 33px #0000000f,0 3.618px 9.949px #0000000a}.bubble-menu .form-item[data-v-3b921f1f]:last-child{margin-bottom:0}.bubble-menu .form-item[data-v-3b921f1f]{color:#475569;align-items:center;margin-bottom:16px;font-size:.8rem;display:flex}.bubble-menu .form-item label[data-v-3b921f1f]{flex-shrink:0;width:4rem}.bubble-menu .form-item input[data-v-3b921f1f]{color:#334155;box-sizing:border-box;border:1px solid #cbd5e1;border-radius:4px;outline:none;flex:1;padding:8px;font-size:12px;transition:border-color .2s}.smo-editor-container{flex-direction:column;width:100%;display:flex}:deep(.smo-editor-content-wrapper){border-top-left-radius:0!important;border-top-right-radius:0!important}
|
|
2
|
-
/*$vite$:1*/
|
package/dist/index.d.ts
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
type __VLS_Props = {
|
|
2
|
-
modelValue?: string;
|
|
3
|
-
editable?: boolean;
|
|
4
|
-
placeholder?: string;
|
|
5
|
-
onImageUpload?: (file: File) => Promise<string>;
|
|
6
|
-
};
|
|
7
|
-
export declare const SmoEditor: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
8
|
-
"update:modelValue": (value: string) => any;
|
|
9
|
-
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
10
|
-
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
11
|
-
}>, {
|
|
12
|
-
placeholder: string;
|
|
13
|
-
editable: boolean;
|
|
14
|
-
modelValue: string;
|
|
15
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
16
|
-
|
|
17
|
-
export interface SmoEditorOptions {
|
|
18
|
-
/** 编辑器初始内容,可以是 HTML 或 JSON */
|
|
19
|
-
content?: string | object;
|
|
20
|
-
/** 是否只读 */
|
|
21
|
-
editable?: boolean;
|
|
22
|
-
/** 占位符文字 */
|
|
23
|
-
placeholder?: string;
|
|
24
|
-
/** 图片上传处理函数 */
|
|
25
|
-
onImageUpload?: (file: File) => Promise<string>;
|
|
26
|
-
}
|
|
27
|
-
|