lianshu-editor 1.0.142

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 lianshu
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,128 @@
+# Lianshu Editor
+
+一个基于 Tiptap 的 Notion 风格富文本编辑器，专为 Vue 3 设计。
+
+## 特性
+
+- 🎨 **Notion 风格**：行首加号菜单、斜杠命令、悬浮工具栏
+- 🖼️ **图片上传**：支持拖拽、粘贴、点击上传
+- 🌓 **主题切换**：内置浅色/深色主题支持
+- 💻 **代码高亮**：支持 20+ 种编程语言
+- ✅ **任务列表**：可勾选的待办事项
+- 📝 **Markdown 快捷键**：支持常用 Markdown 语法
+- 🎯 **TypeScript**：完整的类型定义
+
+## 安装
+
+```bash
+npm install lianshu-editor
+```
+
+## 使用
+
+### 基础用法
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue'
+import { LianshuEditor } from 'lianshu-editor'
+import 'lianshu-editor/style.css'
+
+const content = ref('<p>Hello World</p>')
+</script>
+
+<template>
+  <LianshuEditor v-model="content" />
+</template>
+```
+
+### 主题配置
+
+```vue
+<template>
+  <LianshuEditor
+    v-model="content"
+    :theme="isDark ? 'dark' : 'light'"
+  />
+</template>
+```
+
+### 图片上传配置
+
+```vue
+<script setup lang="ts">
+import { LianshuEditor, type ImageConfig } from 'lianshu-editor'
+
+const imageUploader = async (file: File) => {
+  // 上传到你的服务器
+  const formData = new FormData()
+  formData.append('file', file)
+  const response = await fetch('/upload', {
+    method: 'POST',
+    body: formData
+  })
+  const data = await response.json()
+
+  return {
+    errorCode: 0,
+    data: {
+      src: data.url,
+      alt: file.name
+    }
+  }
+}
+
+const imageConfig: ImageConfig = {
+  uploader: imageUploader,
+  maxSize: 5, // 最大 5MB
+  acceptTypes: ['jpeg', 'jpg', 'png', 'gif', 'webp']
+}
+</script>
+
+<template>
+  <LianshuEditor
+    v-model="content"
+    :image="imageConfig"
+  />
+</template>
+```
+
+## Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| `modelValue` | `string` | `'<p></p>'` | 编辑器内容（HTML） |
+| `placeholder` | `string` | `"输入 '/' 唤起菜单..."` | 占位符文本 |
+| `editable` | `boolean` | `true` | 是否可编辑 |
+| `theme` | `'light' \| 'dark'` | `'light'` | 主题 |
+| `image` | `ImageConfig \| boolean` | `false` | 图片配置 |
+
+## 类型定义
+
+```typescript
+interface ImageUploader {
+  (file: File): Promise<{
+    errorCode: number
+    data: {
+      src: string
+      alt?: string
+      title?: string
+    }
+  }>
+}
+
+interface ImageConfig {
+  uploader?: ImageUploader
+  maxSize?: number // MB
+  acceptTypes?: string[]
+}
+```
+
+## 开发构建
+
+- 构建完整库：`npm run build`
+- 仅构建 MobileEditor：`npm run build:mobile`
+
+## License
+
+MIT