@naersen/tts-rich-text 0.1.0 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +100 -4
- package/dist/base.css +1 -0
- package/dist/components/index.d.ts +3 -0
- package/dist/components/tts-editor-content/index.d.ts +1 -0
- package/dist/components/tts-editor-content/index.vue.d.ts +2 -0
- package/dist/components/tts-editor-root/index.d.ts +2 -0
- package/dist/components/tts-editor-root/index.vue.d.ts +44 -0
- package/dist/components/tts-editor-root/type/index.d.ts +10 -0
- package/dist/components/tts-rich-text/components/selection-menu.vue.d.ts +1 -1
- package/dist/components/tts-rich-text/editor/useRichTextEditor.d.ts +55 -1
- package/dist/components/tts-rich-text-editor/index.vue.d.ts +222 -22
- package/dist/index.js +28618 -28533
- package/dist/style.css +2 -1
- package/dist/theme-default.css +1 -0
- package/dist/theme.js +1 -0
- package/dist/type/index.d.ts +2 -0
- package/package.json +4 -2
package/README.md
CHANGED
|
@@ -34,6 +34,29 @@ pnpm add @naersen/tts-rich-text
|
|
|
34
34
|
|
|
35
35
|
Vue、Tiptap 和 Element Plus 是 peer dependencies。业务项目没有安装时，需要同时添加 peer packages，并在应用入口加载 Element Plus 样式。
|
|
36
36
|
|
|
37
|
+
## 引入全局样式
|
|
38
|
+
|
|
39
|
+
使用默认的 `TtsRichTextEditor` 时，在业务项目的 `src/main.ts` 中全局引入 Element Plus 和组件库样式：
|
|
40
|
+
|
|
41
|
+
```ts
|
|
42
|
+
import { createApp } from 'vue'
|
|
43
|
+
import 'element-plus/dist/index.css'
|
|
44
|
+
import '@naersen/tts-rich-text/styles.css'
|
|
45
|
+
|
|
46
|
+
import App from './App.vue'
|
|
47
|
+
|
|
48
|
+
createApp(App).mount('#app')
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
如果项目已有 `main.ts` 初始化逻辑，只需要把下面两行加入现有入口，不需要重复创建 Vue 应用：
|
|
52
|
+
|
|
53
|
+
```ts
|
|
54
|
+
import 'element-plus/dist/index.css'
|
|
55
|
+
import '@naersen/tts-rich-text/styles.css'
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
必须先引入 Element Plus，再引入组件库样式，因为 `styles.css` 包含组件基础样式、配套图标和对 Element Plus 的主题覆盖。请保持全局引入，不要放在某个页面组件的 `scoped` 样式中，否则弹窗、下拉菜单等挂载到页面其他位置的内容可能无法获得完整样式。
|
|
59
|
+
|
|
37
60
|
## 基础使用
|
|
38
61
|
|
|
39
62
|
```vue
|
|
@@ -59,7 +82,6 @@ import {
|
|
|
59
82
|
TtsRichTextEditor,
|
|
60
83
|
getInitContent
|
|
61
84
|
} from '@naersen/tts-rich-text'
|
|
62
|
-
import '@naersen/tts-rich-text/styles.css'
|
|
63
85
|
|
|
64
86
|
const documentValue = ref<JSONContent>(getInitContent())
|
|
65
87
|
const voiceVersion = ref(2)
|
|
@@ -89,7 +111,7 @@ const getPreviewParams = () => ({
|
|
|
89
111
|
</script>
|
|
90
112
|
```
|
|
91
113
|
|
|
92
|
-
`
|
|
114
|
+
上例只负责使用编辑器组件，样式应按前面的说明在 `main.ts` 中统一引入，不需要在每个业务组件中重复加载。
|
|
93
115
|
|
|
94
116
|
上例中的 `api`、`messageService` 和 `selectedVoice` 由业务项目提供，组件包不会读取业务项目的环境变量、请求实例或状态管理。
|
|
95
117
|
|
|
@@ -121,13 +143,87 @@ const getPreviewParams = () => ({
|
|
|
121
143
|
- `footer-before`，参数为 `{ editor, textLength }`
|
|
122
144
|
- `footer-after`，参数为 `{ editor, textLength }`
|
|
123
145
|
|
|
124
|
-
|
|
146
|
+
项目专属工具可以通过 slots 放在默认布局中；页面结构差异较大时，使用下方组合式布局。
|
|
147
|
+
|
|
148
|
+
### 组合式布局
|
|
149
|
+
|
|
150
|
+
`TtsEditorRoot` 维护编辑器实例、`v-model`、服务和上下文，不输出固定布局，并默认挂载选区试听菜单。它的后代可以按项目需要组合 `TtsEditorContent`、工具栏和底部栏：
|
|
151
|
+
|
|
152
|
+
```vue
|
|
153
|
+
<template>
|
|
154
|
+
<tts-editor-root
|
|
155
|
+
ref="editorRef"
|
|
156
|
+
v-model="documentValue"
|
|
157
|
+
:services="services"
|
|
158
|
+
v-slot="{ context, editor, textLength }"
|
|
159
|
+
>
|
|
160
|
+
<section class="project-editor">
|
|
161
|
+
<header class="project-editor-header">
|
|
162
|
+
<project-title />
|
|
163
|
+
<tts-editor-toolbar />
|
|
164
|
+
<button type="button" @click="context.clearContent()">
|
|
165
|
+
清空
|
|
166
|
+
</button>
|
|
167
|
+
</header>
|
|
168
|
+
|
|
169
|
+
<main class="project-editor-content">
|
|
170
|
+
<tts-editor-content />
|
|
171
|
+
<project-side-panel :editor="editor" />
|
|
172
|
+
</main>
|
|
173
|
+
|
|
174
|
+
<footer class="project-editor-footer">
|
|
175
|
+
<span>{{ textLength }} 字</span>
|
|
176
|
+
<tts-editor-footer />
|
|
177
|
+
</footer>
|
|
178
|
+
</section>
|
|
179
|
+
</tts-editor-root>
|
|
180
|
+
</template>
|
|
181
|
+
|
|
182
|
+
<script setup lang="ts">
|
|
183
|
+
import { ref } from 'vue'
|
|
184
|
+
|
|
185
|
+
import type { TtsRichTextServices } from '@naersen/tts-rich-text'
|
|
186
|
+
import {
|
|
187
|
+
TtsEditorContent,
|
|
188
|
+
TtsEditorFooter,
|
|
189
|
+
TtsEditorRoot,
|
|
190
|
+
TtsEditorToolbar,
|
|
191
|
+
getInitContent
|
|
192
|
+
} from '@naersen/tts-rich-text'
|
|
193
|
+
import '@naersen/tts-rich-text/base.css'
|
|
194
|
+
|
|
195
|
+
const documentValue = ref(getInitContent())
|
|
196
|
+
const services: TtsRichTextServices = {}
|
|
197
|
+
</script>
|
|
198
|
+
```
|
|
199
|
+
|
|
200
|
+
Root 默认插槽提供：
|
|
201
|
+
|
|
202
|
+
- `editor`：当前 Tiptap 编辑器实例。
|
|
203
|
+
- `textLength`：当前文本长度。
|
|
204
|
+
- `context`：工具命令、选区状态、services 和 features 上下文。
|
|
205
|
+
- `api`：与组件 ref 一致的公开方法。
|
|
206
|
+
- `disabled`：当前禁用状态。
|
|
207
|
+
|
|
208
|
+
Root 会自动挂载 `TtsSelectionMenu`，不用在默认插槽中重复引入。项目需要关闭选区试听或替换为自定义菜单时，传入 `:show-selection-menu="false"`；`TtsSelectionMenu` 仍保留独立导出，供高级组合场景使用。
|
|
209
|
+
|
|
210
|
+
组合模式只需要引入 `base.css`。需要复用原项目的 Element Plus 全局主题时，再在它后面引入：
|
|
211
|
+
|
|
212
|
+
```ts
|
|
213
|
+
import 'element-plus/dist/index.css'
|
|
214
|
+
import '@naersen/tts-rich-text/base.css'
|
|
215
|
+
import '@naersen/tts-rich-text/theme-default.css'
|
|
216
|
+
```
|
|
217
|
+
|
|
218
|
+
`styles.css` 等价于依次引入 `base.css` 和 `theme-default.css`，继续用于默认成品组件。
|
|
125
219
|
|
|
126
220
|
### 原子组件
|
|
127
221
|
|
|
128
222
|
对编辑器外壳差异较大的项目，可以直接组合包内原始组件：
|
|
129
223
|
|
|
130
224
|
- `TtsEditorToolbar`
|
|
225
|
+
- `TtsEditorRoot`
|
|
226
|
+
- `TtsEditorContent`
|
|
131
227
|
- `TtsEditorFooter`
|
|
132
228
|
- `TtsSelectionMenu`
|
|
133
229
|
- `TtsMarkPinyinModal`
|
|
@@ -137,7 +233,7 @@ const getPreviewParams = () => ({
|
|
|
137
233
|
- `TtsReplaceTextModal`
|
|
138
234
|
- `TtsUploadModal`
|
|
139
235
|
|
|
140
|
-
|
|
236
|
+
这些组件共享 `TtsEditorRoot` 提供的编辑器上下文，不能脱离 Root 单独使用。布局接近原项目时使用完整的 `TtsRichTextEditor`；页面结构差异较大时再组合原子组件，业务接口仍统一通过 `services` 注入。
|
|
141
237
|
|
|
142
238
|
## 对外方法
|
|
143
239
|
|
package/dist/base.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.svg-icon[data-v-65f4bcb9]{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;font-size:inherit;width:var(--v6cd858ea);height:var(--v4f17a402);color:var(--v6f0655b0);line-height:1}.svg-icon[data-v-65f4bcb9] svg{display:block;width:100%;height:100%}.cx-button-loading[data-v-5ca09421]{animation:loading-5ca09421 1s linear infinite}@keyframes loading-5ca09421{to{transform:rotate(1turn)}}.el-button.is-plain.cx-button-link[data-v-5ca09421]{height:30px;padding:4px 8px;border-radius:6px;border:none}.el-button.is-plain.cx-button-link.is-disabled[data-v-5ca09421]{border:none;background-color:transparent}.cx-empty[data-v-56b17ee0]{display:flex;flex-direction:column;align-items:center;justify-content:center}.cx-empty .cx-empty-icon[data-v-56b17ee0]{display:flex;justify-content:center;align-items:center}.cx-empty .cx-empty-icon img[data-v-56b17ee0]{height:100%;width:100%;object-fit:contain}.cx-empty .cx-empty-desc[data-v-56b17ee0]{color:#797b80;font-size:14px;line-height:22px}.cx-radio-group[data-v-f56b6fd8]{position:relative;height:36px;padding:3px;border-radius:6px;border:1px solid #d9d9d9;display:flex;align-items:center;gap:3px}.cx-radio-group .cx-radio-slider[data-v-f56b6fd8]{position:absolute;left:0;height:calc(100% - 6px);border-radius:6px;transition:transform .2s cubic-bezier(.34,.69,.1,1)}.cx-radio-group .cx-radio[data-v-f56b6fd8]{-webkit-user-select:none;user-select:none;cursor:pointer;position:relative;z-index:1;flex:1;flex-shrink:0;height:100%;font-size:14px;line-height:22px;border-radius:6px;display:flex;justify-content:center;align-items:center;gap:4px}.cx-radio-group .cx-radio .cx-radio-icon[data-v-f56b6fd8]{display:flex;justify-content:center;align-items:center}.cx-radio-group .cx-radio.cx-radio-selected[data-v-f56b6fd8]{font-weight:600}.cx-radio-group[data-v-f56b6fd8]{background:var(--v74036a63)}.cx-radio-group .cx-radio-slider[data-v-f56b6fd8]{background:var(--v41a8ae01)}.cx-radio-group .cx-radio[data-v-f56b6fd8]{color:var(--c15225e4)}.cx-radio-group .cx-radio[data-v-f56b6fd8]:not(.cx-radio-selected):hover{background-color:var(--v9294f916);color:var(--v5c0c1e88)}.cx-radio-group .cx-radio.cx-radio-selected[data-v-f56b6fd8]{color:var(--v69c0c568)}.cx-spin[data-v-c91521a4]{position:relative;height:100%;width:100%}.cx-spin .cx-spin-mask[data-v-c91521a4]{z-index:9999;position:absolute;left:0;top:0;height:100%;width:100%;background-color:#fffc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center}.cx-spin .cx-spin-mask .cx-spin-icon[data-v-c91521a4]{display:flex;flex-direction:column;align-items:center;gap:16px}.cx-spin .cx-spin-mask .cx-spin-icon .cx-spin-tip[data-v-c91521a4]{color:#101114;font-size:16px;font-weight:600;line-height:24px}.cx-upload-wrapper[data-v-a9f6b4ff]{height:212px;background-color:#fff;border-radius:16px;border:1px dashed #d9d9d9;transition:border-color .2s}.cx-upload-wrapper[data-v-a9f6b4ff]:hover,.cx-upload-wrapper.cx-upload-dragging[data-v-a9f6b4ff],.cx-upload-wrapper.cx-upload-has-value[data-v-a9f6b4ff]{border:2px dashed #0d1839}.cx-upload-wrapper:hover.cx-upload-has-value[data-v-a9f6b4ff],.cx-upload-wrapper.cx-upload-dragging.cx-upload-has-value[data-v-a9f6b4ff],.cx-upload-wrapper.cx-upload-has-value.cx-upload-has-value[data-v-a9f6b4ff]{border-style:solid}.cx-upload-wrapper .cx-upload[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result[data-v-a9f6b4ff]{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.cx-upload-wrapper .cx-upload .cx-upload-title[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-title[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload .cx-upload-file-name[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-file-name[data-v-a9f6b4ff]{margin-top:10px;color:#101114;font-size:14px;font-weight:600;line-height:24px}.cx-upload-wrapper .cx-upload .cx-upload-title.cx-upload-file-name[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-title.cx-upload-file-name[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload .cx-upload-file-name.cx-upload-file-name[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-file-name.cx-upload-file-name[data-v-a9f6b4ff]{max-width:100%;padding:0 12px}.cx-upload-wrapper .cx-upload .cx-upload-icon[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-icon[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload .cx-upload-result-icon[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-result-icon[data-v-a9f6b4ff]{position:relative;width:56px;height:56px;display:flex;justify-content:center;align-items:center}.cx-upload-wrapper .cx-upload .cx-upload-icon .cx-upload-clear-icon[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-icon .cx-upload-clear-icon[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload .cx-upload-result-icon .cx-upload-clear-icon[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-result-icon .cx-upload-clear-icon[data-v-a9f6b4ff]{cursor:pointer;position:absolute;right:-8px;top:-8px}.cx-upload-wrapper .cx-upload .cx-upload-icon[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-icon[data-v-a9f6b4ff]{background-color:#f1f2f5;border-radius:50%}.cx-upload-wrapper .cx-upload .cx-upload-icon[data-v-a9f6b4ff]:hover,.cx-upload-wrapper .cx-upload-result .cx-upload-icon[data-v-a9f6b4ff]:hover{background-color:#d9d9d9}.cx-upload-wrapper .cx-upload .cx-upload-tip[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-tip[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload .cx-upload-file-operate[data-v-a9f6b4ff],.cx-upload-wrapper .cx-upload-result .cx-upload-file-operate[data-v-a9f6b4ff]{margin-top:4px;color:#797b80;line-height:22px}.cx-upload-wrapper .cx-upload[data-v-a9f6b4ff] .cx-upload-file-operate,.cx-upload-wrapper .cx-upload-result[data-v-a9f6b4ff] .cx-upload-file-operate{color:#0057ff;display:flex;justify-content:center;align-items:center}.cx-upload-wrapper .cx-upload[data-v-a9f6b4ff] .cx-upload-file-operate>span,.cx-upload-wrapper .cx-upload-result[data-v-a9f6b4ff] .cx-upload-file-operate>span{cursor:pointer;text-decoration-line:underline}.cx-upload-wrapper .cx-upload[data-v-a9f6b4ff]{cursor:pointer}.cx-upload-wrapper.cx-upload-disabled[data-v-a9f6b4ff]{cursor:not-allowed;background-color:#f7f8fa;opacity:.7}.tag-node[data-v-d4205ec0]{display:inline;box-sizing:border-box;margin:0 3px;padding:2px 8px;font-size:12px;line-height:20px;min-height:22px;font-weight:400;background:#e5eeff;color:#3d4766;border-radius:4px;-webkit-user-select:none;user-select:none;box-decoration-break:clone;-webkit-box-decoration-break:clone}.icon-wrapper[data-v-d4205ec0]{display:inline-flex;align-items:center;height:20px}.icon-wrapper.tag-icon[data-v-d4205ec0]{margin-right:4px;vertical-align:-.2em}.icon-wrapper.delete-icon[data-v-d4205ec0]{margin-left:4px}.delete-btn[data-v-d4205ec0]{cursor:pointer;-webkit-user-select:none;user-select:none;font-size:10px;color:#7d8ab2}.delete-btn[data-v-d4205ec0]:hover{color:#ea5b41}[data-v-d764ae22] .tiptap-editor{font-size:14px;line-height:28px;word-break:break-word;outline:none}[data-v-d764ae22] .tiptap-editor p{counter-reset:sentence;margin:0}[data-v-d764ae22] .tiptap-editor p.is-editor-empty:first-child:before{content:attr(data-placeholder);float:left;height:0;color:#797b80;pointer-events:none}.lsh-menu-box[data-v-3171f4b7]{z-index:1;width:120px;padding:4px;border-radius:10px;border:1px solid #d9d9d9;background:#fff;box-shadow:0 6px 24px #1f23291a}.lsh-menu-box .lsh-menu-item[data-v-3171f4b7]{display:flex;align-items:center;justify-content:flex-start;width:100%;height:32px;padding:0 10px;border:0;border-radius:6px;background:transparent;color:#101114;font-size:14px;line-height:22px;cursor:pointer}.lsh-menu-box .lsh-menu-item[data-v-3171f4b7]:hover{background:#f1f2f5}.red-text[data-v-259be8b7]{color:#ea5b41}.lsh-text-btn[data-v-259be8b7]{display:flex;justify-content:center;align-items:center;gap:4px;padding:1px 6px!important;cursor:pointer;color:#101114;line-height:22px;background:transparent!important;height:22px}.lsh-text-btn.is-disabled[data-v-259be8b7]{opacity:.4}.lsh-text-btn.blue[data-v-259be8b7]{color:#0057ff}.lsh-text-btn.red[data-v-259be8b7]{color:#ea5b41}.lsh-textarea[data-v-259be8b7]{resize:none;border:none;outline:none;width:100%;background:transparent}.lsh-content-box[data-v-259be8b7]{display:flex;gap:16px;height:444px}.lsh-content-box .lsh-form-box[data-v-259be8b7]{flex:1;display:flex;flex-direction:column;gap:8px}.lsh-content-box .lsh-form-box .lsh-form-top[data-v-259be8b7]{display:flex;align-items:center;justify-content:space-between}.lsh-content-box .lsh-form-box .lsh-form-top .lsh-title[data-v-259be8b7]{color:#101114;font-weight:600;line-height:22px}.lsh-content-box .lsh-form-box .lsh-form-bottom[data-v-259be8b7]{flex:1;border-radius:10px;border:1px solid #d9d9d9;padding:12px 16px;color:#101114;line-height:22px;background:#fff;display:flex;flex-direction:column;overflow:hidden}.lsh-content-box .lsh-form-box .lsh-form-bottom.gray[data-v-259be8b7]{background:#f1f2f5}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-tip[data-v-259be8b7]{color:#797b80;font-size:12px;line-height:20px;font-weight:400;display:flex;align-items:center;justify-content:space-between}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-result-box[data-v-259be8b7]{flex:1;overflow:auto}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-result-box[data-v-259be8b7] .cx-spin-mask{background:transparent;opacity:.4}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-result-box[data-v-259be8b7] .cx-spin-mask .cx-spin-tip{font-size:14px;font-weight:400}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-form-item[data-v-259be8b7]{display:flex;flex-direction:column;gap:4px}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-form-item[data-v-259be8b7]:nth-child(n+2){border-top:1px solid #eaecf2;padding-top:8px;margin-top:8px}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-form-item .lsh-form-item-top[data-v-259be8b7]{color:#101114;font-weight:600;line-height:22px;display:flex;align-items:center;justify-content:space-between}.lsh-footer-box[data-v-8bafee79]{height:46px;padding:8px;display:flex;align-items:center;justify-content:flex-end}.lsh-footer-box .lsh-option-item[data-v-8bafee79]{height:100%;padding:4px 8px;display:flex;align-items:center;gap:4px;color:#101114;font-size:14px;font-weight:400;line-height:22px}.lsh-footer-box .lsh-option-item[data-v-8bafee79] .svg-icon{font-size:18px}.lsh-footer-box .lsh-option-item.btn[data-v-8bafee79]{cursor:pointer;-webkit-user-select:none;user-select:none}.lsh-footer-box .lsh-option-item.btn.disabled[data-v-8bafee79]{opacity:.4}.lsh-footer-box .lsh-option-item.btn[data-v-8bafee79]:not(.disabled):hover{border-radius:6px;background:#f1f2f5}.lsh-footer-box .lsh-option-item.gray[data-v-8bafee79]{color:#797b80}.lsh-footer-box .lsh-divider[data-v-8bafee79]{width:1px;height:20px;background:#eaecf2;margin:0 8px}.red-text[data-v-e743e5e3]{color:#ea5b41}.lsh-text-btn[data-v-e743e5e3]{display:flex;justify-content:center;align-items:center;gap:4px;padding:4px 8px;cursor:pointer;color:#101114;line-height:22px;height:22px}.lsh-text-btn.stop[data-v-e743e5e3]{color:#ea5b41}.lsh-textarea[data-v-e743e5e3]{resize:none;border:none;outline:none;width:100%;background:transparent}.lsh-content-box[data-v-e743e5e3]{display:flex;gap:16px;height:444px}.lsh-content-box .lsh-form-box[data-v-e743e5e3]{flex:1;display:flex;flex-direction:column;gap:8px}.lsh-content-box .lsh-form-box .lsh-form-top[data-v-e743e5e3]{display:flex;align-items:center;justify-content:space-between}.lsh-content-box .lsh-form-box .lsh-form-top .lsh-title[data-v-e743e5e3]{color:#101114;font-weight:600;line-height:22px}.lsh-content-box .lsh-form-box .lsh-form-bottom[data-v-e743e5e3]{flex:1;border-radius:10px;border:1px solid #d9d9d9;padding:12px;color:#101114;line-height:22px;background:#fff;display:flex;flex-direction:column;overflow:hidden}.lsh-content-box .lsh-form-box .lsh-form-bottom.gray[data-v-e743e5e3]{background:#f1f2f5}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-tip[data-v-e743e5e3]{color:#797b80;font-size:12px;line-height:20px;display:flex;align-items:center;justify-content:space-between}.lsh-content-box .lsh-form-box .lsh-form-bottom .lsh-result-box[data-v-e743e5e3]{flex:1;overflow:auto}.lsh-ai-modal{position:relative;overflow:hidden}.lsh-ai-modal:before{position:absolute;top:0;left:0;width:100%;height:120px;content:"";z-index:0;pointer-events:none;background:radial-gradient(53.22% 165.47% at 52.17% -65.47%,#0038ff14,#0038ff00),radial-gradient(51.16% 163.6% at 85.6% -63.59%,#ff642214,#ff642200),radial-gradient(102.93% 140.61% at 7.43% -30.94%,#00d09e14,#00d09e00),linear-gradient(180deg,#fafbfc 47.89%,#fafbfccc,#fafbfc00)}.lsh-ai-modal .el-dialog__header,.lsh-ai-modal .el-dialog__body,.lsh-ai-modal .el-dialog__footer{position:relative;z-index:1}.lsh-ai-modal .el-dialog__header .el-dialog__headerbtn{right:-2px!important}.rect-btn[data-v-44be22ad]{display:flex;width:40px;height:36px;padding:0 12px;justify-content:center;align-items:center;flex-shrink:0;border-radius:10px;background:#f1f2f5;border:1px solid #f1f2f5;cursor:pointer;-webkit-user-select:none;user-select:none}.rect-btn.active[data-v-44be22ad],.rect-btn[data-v-44be22ad]:hover{border-color:#0d1839}.lsh-header-content[data-v-44be22ad]{position:relative}.lsh-header-content .lsh-title[data-v-44be22ad]{color:#101114;font-size:16px;font-weight:600;line-height:24px}.lsh-header-content .lsh-radio-group[data-v-44be22ad]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:185px}.lsh-content-box[data-v-44be22ad]{height:444px;display:flex;flex-direction:column}.lsh-content-box .lsh-label[data-v-44be22ad]{color:#101114;font-size:14px;font-weight:600;line-height:22px;margin-bottom:8px}.lsh-content-box .lsh-text-box[data-v-44be22ad]{height:44px;padding:5px 12px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:16px;border:1px solid #d9d9d9;background:#f1f2f5;color:#101114;font-size:18px;font-weight:600;line-height:26px;width:100%;text-align:center}.lsh-content-box .lsh-polyphonic-box[data-v-44be22ad]{margin-top:16px;flex:1}.lsh-content-box .lsh-polyphonic-box .lsh-polyphonic-list[data-v-44be22ad]{display:flex;flex-direction:column;gap:8px;max-height:220px;overflow:auto}.lsh-content-box .lsh-polyphonic-box .lsh-polyphonic-item[data-v-44be22ad]{display:flex;align-items:flex-start;gap:8px}.lsh-content-box .lsh-polyphonic-box .lsh-polyphonic-char[data-v-44be22ad]{display:flex;align-items:center;justify-content:center;width:36px;height:32px;flex-shrink:0;border-radius:10px;background:#f1f2f5;color:#101114;font-size:16px;font-weight:600;line-height:24px}.lsh-content-box .lsh-polyphonic-box .lsh-polyphonic-options[data-v-44be22ad]{display:flex;flex-wrap:wrap;gap:8px}.lsh-content-box .lsh-polyphonic-box .lsh-polyphonic-option[data-v-44be22ad]{height:32px;padding:4px 12px;border-radius:10px;border:1px solid #d9d9d9;background:#fff;color:#101114;font-size:14px;line-height:22px;cursor:pointer;-webkit-user-select:none;user-select:none}.lsh-content-box .lsh-polyphonic-box .lsh-polyphonic-option.active[data-v-44be22ad],.lsh-content-box .lsh-polyphonic-box .lsh-polyphonic-option[data-v-44be22ad]:hover{border-color:#0d1839}.lsh-content-box .lsh-options-box[data-v-44be22ad]{margin-top:16px;display:flex;gap:16px}.lsh-content-box .lsh-options-box .lsh-options[data-v-44be22ad]{display:flex;flex-direction:column;gap:8px;padding:16px;border-radius:16px;border:1px solid #d9d9d9;background:#fff}.lsh-content-box .lsh-options-box .lsh-initials[data-v-44be22ad]{display:flex;flex-wrap:wrap;gap:4px}.lsh-content-box .lsh-options-box .lsh-initials .lsh-initial-btn[data-v-44be22ad]{display:flex;width:40px;height:36px;padding:0 12px;justify-content:center;align-items:center;flex-shrink:0;border-radius:10px;background:#f1f2f5;border:1px solid #f1f2f5;cursor:pointer;-webkit-user-select:none;user-select:none}.lsh-content-box .lsh-options-box .lsh-initials .lsh-initial-btn.active[data-v-44be22ad],.lsh-content-box .lsh-options-box .lsh-initials .lsh-initial-btn[data-v-44be22ad]:hover{border-color:#0d1839}.lsh-content-box .lsh-options-box .lsh-radio-group-white[data-v-44be22ad]{border-radius:14px;padding:4px;gap:4px;height:44px}.lsh-content-box .lsh-options-box .lsh-radio-group-white[data-v-44be22ad] .cx-radio{border-radius:10px}.lsh-content-box .lsh-options-box .lsh-radio-group-white[data-v-44be22ad] .cx-radio.cx-radio-selected{font-weight:400}.lsh-content-box .lsh-options-box .lsh-final-box[data-v-44be22ad]{display:flex;flex-direction:column;gap:8px;padding:8px;border-radius:14px;background:#f1f2f5}.lsh-content-box .lsh-options-box .lsh-final-box .lsh-final-list[data-v-44be22ad]{display:flex;flex-wrap:wrap;gap:4px}.lsh-content-box .lsh-options-box .lsh-final-box .lsh-final-list .lsh-final-item[data-v-44be22ad]{display:flex;width:40px;height:36px;padding:0 12px;justify-content:center;align-items:center;flex-shrink:0;border-radius:10px;background:#f1f2f5;border:1px solid #f1f2f5;cursor:pointer;-webkit-user-select:none;user-select:none;background:#fff;box-shadow:0 1px 4px #0000001a}.lsh-content-box .lsh-options-box .lsh-final-box .lsh-final-list .lsh-final-item.active[data-v-44be22ad],.lsh-content-box .lsh-options-box .lsh-final-box .lsh-final-list .lsh-final-item[data-v-44be22ad]:hover{border-color:#0d1839}.lsh-content-box .lsh-manual-text-box[data-v-44be22ad]{margin-top:16px}.lsh-content-box .lsh-manual-text-box .lsh-manual-text-list[data-v-44be22ad]{display:flex;gap:8px}.lsh-content-box .lsh-manual-text-box .lsh-manual-text-item[data-v-44be22ad]{display:flex;min-width:64px;height:52px;padding:4px 12px;flex-direction:column;align-items:center;justify-content:center;border-radius:10px;border:1px solid #d9d9d9;background:#fff;font-size:16px;cursor:pointer}.lsh-content-box .lsh-manual-text-box .lsh-manual-text-item.active[data-v-44be22ad],.lsh-content-box .lsh-manual-text-box .lsh-manual-text-item[data-v-44be22ad]:hover{border-color:#0d1839}.lsh-content-box .lsh-manual-text-box .lsh-manual-pinyin[data-v-44be22ad]{color:#666;font-size:12px;line-height:18px}.lsh-header-content[data-v-7c709cca]{width:calc(100% - 52px);display:flex;flex-direction:column;gap:4px}.lsh-header-content .lsh-title[data-v-7c709cca]{color:#101114;font-size:16px;font-weight:600;line-height:24px}.lsh-header-content .lsh-tip[data-v-7c709cca]{color:#797b80;font-size:14px;font-weight:400;line-height:22px}.lsh-content-box[data-v-7c709cca]{display:flex;flex-direction:column;gap:24px;padding-bottom:44px}.lsh-content-box .lsh-form-item-label[data-v-7c709cca]{color:#101114;font-size:14px;font-weight:600;line-height:22px;margin-bottom:8px}.lsh-modal-header{height:fit-content!important}.lsh-language-list[data-v-931bb88d]{display:flex;align-items:center;gap:8px;padding:12px;width:264px;flex-wrap:wrap}.lsh-language-list .el-button[data-v-931bb88d]{width:116px}.lsh-number-list[data-v-9fa42093]{display:flex;gap:8px;padding:12px;width:272px;flex-direction:column;align-items:start;overflow:hidden}.lsh-number-list .el-button[data-v-9fa42093]{width:100%;justify-content:flex-start}.lsh-number-label[data-v-9fa42093]{flex-shrink:0}.lsh-stop-list[data-v-0d7c92b5]{display:flex;align-items:center;gap:8px;padding:12px}.lsh-stop-input[data-v-0d7c92b5]{outline:none;border:none;color:#101114;line-height:22px;border-bottom:1px solid #101114;background:transparent;width:42px;height:22px;margin:0 4px}.lsh-stop-input[data-v-0d7c92b5]::placeholder{color:#797b80}.lsh-stop-input[data-v-0d7c92b5]:focus{border-color:#0057ff}.lsh-stop-input[data-v-0d7c92b5] .el-input .el-input__wrapper{box-shadow:none;padding:0;background:transparent}.lsh-content-box[data-v-cdac4822]{display:flex;flex-direction:column;gap:24px;padding-bottom:44px}.lsh-content-box .lsh-title[data-v-cdac4822]{color:#101114;font-size:14px;font-weight:600;line-height:22px;margin-bottom:4px}.lsh-content-box .lsh-tip-text[data-v-cdac4822]{color:#797b80;font-size:14px;font-weight:400;line-height:175%}.word-upload-modal .el-overlay-dialog .el-dialog{overflow:hidden;height:600px;display:flex;flex-direction:column}.word-upload-modal .el-overlay-dialog .el-dialog .el-dialog__body{flex:1}.lsh-toolbar-box[data-v-ef10ee9b]{position:relative;flex:1;min-width:0;display:flex;align-items:center;gap:8px;overflow:hidden}.lsh-toolbar-box .lsh-tool-btn[data-v-ef10ee9b]{height:30px;flex-shrink:0;display:flex;align-items:center;padding:4px 8px;border-radius:6px;border:none;white-space:nowrap}.lsh-toolbar-measure[data-v-ef10ee9b]{position:absolute;top:0;left:0;z-index:-1;display:flex;gap:8px;height:0;overflow:hidden;visibility:hidden;pointer-events:none}.lsh-more-list[data-v-ef10ee9b]{display:flex;min-width:140px;padding:4px;flex-direction:column;gap:2px}.lsh-more-list .lsh-more-item[data-v-ef10ee9b]{width:100%;justify-content:flex-start;padding:8px 10px;border:none;border-radius:6px}.el-popper.lsh-popper{width:fit-content!important;padding:0}.tts-rich-text-editor[data-v-6f838a8e]{box-sizing:border-box;display:flex;width:100%;max-width:100%;min-width:0;height:266px;min-height:220px;padding:0 8px 8px;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;color:#101114;font-family:PingFang SC,Microsoft YaHei,Arial,sans-serif}.tts-rich-text-editor.is-fullscreen[data-v-6f838a8e]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;height:100vh;padding:16px;background:#f5f6f8}.tts-rich-text-editor.is-disabled .lsh-editor-box[data-v-6f838a8e]{background:#f7f8fa}.tts-rich-text-editor.is-disabled .lsh-top[data-v-6f838a8e],.tts-rich-text-editor.is-disabled .lsh-middle[data-v-6f838a8e],.tts-rich-text-editor.is-disabled .lsh-bottom[data-v-6f838a8e]{opacity:.7}.tts-rich-text-editor .lsh-editor-box[data-v-6f838a8e]{position:relative;display:flex;width:100%;min-width:0;height:100%;flex-direction:column;overflow:hidden;border:1px solid #d9d9d9;border-radius:24px;background:#fff;transition:box-shadow .3s}.tts-rich-text-editor .lsh-editor-box[data-v-6f838a8e]:hover,.tts-rich-text-editor .lsh-editor-box[data-v-6f838a8e]:focus-within{border-color:#0057ff}.tts-rich-text-editor .lsh-editor-box[data-v-6f838a8e]:focus-within{box-shadow:0 8px 16px #0057ff33}.tts-rich-text-editor .lsh-top[data-v-6f838a8e]{display:flex;height:46px;padding:8px 16px;align-items:center;gap:8px;flex-shrink:0;border-bottom:1px solid #eaecf2}.tts-rich-text-editor .lsh-fullscreen-btn[data-v-6f838a8e]{display:flex;width:30px;height:30px;padding:0;align-items:center;justify-content:center;flex-shrink:0;border:0;border-radius:6px;background:transparent;color:#101114;cursor:pointer}.tts-rich-text-editor .lsh-fullscreen-btn[data-v-6f838a8e]:hover{background:#f1f2f5}.tts-rich-text-editor .lsh-middle[data-v-6f838a8e]{flex:1;min-height:0;padding:12px 16px 0;overflow:hidden}.tts-rich-text-editor .lsh-middle .editor-shell[data-v-6f838a8e]{height:100%;overflow:auto}.tts-rich-text-editor .lsh-bottom[data-v-6f838a8e]{display:flex;min-height:46px;min-width:0;align-items:center;justify-content:flex-end;flex-shrink:0}@media (max-width: 640px){.tts-rich-text-editor[data-v-6f838a8e]{padding:0}.tts-rich-text-editor .lsh-editor-box[data-v-6f838a8e]{border-radius:12px}.tts-rich-text-editor .lsh-top[data-v-6f838a8e]{padding:8px}}
|
|
@@ -4,5 +4,8 @@ export { default as CxRadioGroup } from './cx-radio-group';
|
|
|
4
4
|
export { default as CxSpin } from './cx-spin';
|
|
5
5
|
export { default as CxUpload } from './cx-upload';
|
|
6
6
|
export { default as SvgIcon } from './svg-icon';
|
|
7
|
+
export { default as TtsEditorContent } from './tts-editor-content';
|
|
8
|
+
export { default as TtsEditorRoot } from './tts-editor-root';
|
|
9
|
+
export * from './tts-editor-root';
|
|
7
10
|
export * from './tts-rich-text';
|
|
8
11
|
export { default as TtsRichTextEditor } from './tts-rich-text-editor';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './index.vue';
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
export default _default;
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { TtsEditorRootSlotProps } from './type';
|
|
2
|
+
import { TtsEditorFeatures, TtsEditorRootProps, TtsRichTextServices } from '../../type';
|
|
3
|
+
declare function __VLS_template(): {
|
|
4
|
+
attrs: Partial<{}>;
|
|
5
|
+
slots: Readonly<{
|
|
6
|
+
default(props: TtsEditorRootSlotProps): unknown;
|
|
7
|
+
}> & {
|
|
8
|
+
default(props: TtsEditorRootSlotProps): unknown;
|
|
9
|
+
};
|
|
10
|
+
refs: {};
|
|
11
|
+
rootEl: any;
|
|
12
|
+
};
|
|
13
|
+
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
14
|
+
declare const __VLS_component: import('vue').DefineComponent<TtsEditorRootProps, {
|
|
15
|
+
clear: () => void;
|
|
16
|
+
focus: () => void;
|
|
17
|
+
getJson: () => import('@tiptap/core').JSONContent;
|
|
18
|
+
getTtsData: () => import('../../type').TtsInputData;
|
|
19
|
+
replaceText: (text: string) => void;
|
|
20
|
+
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
21
|
+
"update:modelValue": (value: import('@tiptap/core').JSONContent) => any;
|
|
22
|
+
change: (value: import('@tiptap/core').JSONContent) => any;
|
|
23
|
+
ready: (editor: import('@tiptap/core').Editor) => any;
|
|
24
|
+
}, string, import('vue').PublicProps, Readonly<TtsEditorRootProps> & Readonly<{
|
|
25
|
+
"onUpdate:modelValue"?: ((value: import('@tiptap/core').JSONContent) => any) | undefined;
|
|
26
|
+
onChange?: ((value: import('@tiptap/core').JSONContent) => any) | undefined;
|
|
27
|
+
onReady?: ((editor: import('@tiptap/core').Editor) => any) | undefined;
|
|
28
|
+
}>, {
|
|
29
|
+
disabled: boolean;
|
|
30
|
+
placeholder: string;
|
|
31
|
+
modelValue: import('@tiptap/core').JSONContent;
|
|
32
|
+
textLimit: number;
|
|
33
|
+
voiceVersion: number;
|
|
34
|
+
features: TtsEditorFeatures;
|
|
35
|
+
services: TtsRichTextServices;
|
|
36
|
+
showSelectionMenu: boolean;
|
|
37
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
38
|
+
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
39
|
+
export default _default;
|
|
40
|
+
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
41
|
+
new (): {
|
|
42
|
+
$slots: S;
|
|
43
|
+
};
|
|
44
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Editor } from '@tiptap/core';
|
|
2
|
+
import { RichTextEditor } from '../../tts-rich-text/editor/useRichTextEditor';
|
|
3
|
+
import { TtsRichTextEditorExpose } from '../../../type';
|
|
4
|
+
export interface TtsEditorRootSlotProps {
|
|
5
|
+
api: TtsRichTextEditorExpose;
|
|
6
|
+
context: RichTextEditor;
|
|
7
|
+
disabled: boolean;
|
|
8
|
+
editor: Editor | undefined;
|
|
9
|
+
textLength: number;
|
|
10
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
|
|
2
2
|
audioRef: HTMLAudioElement;
|
|
3
|
-
},
|
|
3
|
+
}, any>;
|
|
4
4
|
export default _default;
|
|
@@ -88,4 +88,58 @@ export declare function useRichTextEditor(options?: UseRichTextEditorOptions): {
|
|
|
88
88
|
};
|
|
89
89
|
export type RichTextEditor = ReturnType<typeof useRichTextEditor>;
|
|
90
90
|
export declare const useEditorProvider: (context: RichTextEditor) => void;
|
|
91
|
-
export declare const useEditorContext: () =>
|
|
91
|
+
export declare const useEditorContext: () => {
|
|
92
|
+
editor: import('vue').ShallowRef<import('@tiptap/vue-3').Editor | undefined, import('@tiptap/vue-3').Editor | undefined>;
|
|
93
|
+
driveMode: Ref<DriveModeEnum, DriveModeEnum>;
|
|
94
|
+
insertToken: (data: {
|
|
95
|
+
categ: CustomTagType;
|
|
96
|
+
payload: Record<string, any>;
|
|
97
|
+
}) => void;
|
|
98
|
+
insertWrappedToken: (data: {
|
|
99
|
+
categ: CustomTagType;
|
|
100
|
+
payload: Record<string, any>;
|
|
101
|
+
}) => void;
|
|
102
|
+
clearContent: () => void;
|
|
103
|
+
getSelectedText: () => string;
|
|
104
|
+
getSelectedJson: () => JSONContent | null;
|
|
105
|
+
selectedText: Ref<string, string>;
|
|
106
|
+
hasSelectedText: import('vue').ComputedRef<boolean>;
|
|
107
|
+
isSelectedPureNumber: import('vue').ComputedRef<boolean>;
|
|
108
|
+
textLimitLength: number;
|
|
109
|
+
getGenerateAudioParams: () => {
|
|
110
|
+
/**
|
|
111
|
+
* 音调，范围 0-100，默认 50。
|
|
112
|
+
*/
|
|
113
|
+
pitch?: number;
|
|
114
|
+
/**
|
|
115
|
+
* 语速，范围 0-100，默认 50。
|
|
116
|
+
*/
|
|
117
|
+
speed?: number;
|
|
118
|
+
/**
|
|
119
|
+
* 选中的音色 ID（对应 t_voice_timbre.id）
|
|
120
|
+
*/
|
|
121
|
+
timberId?: string;
|
|
122
|
+
/**
|
|
123
|
+
* 音量，范围 0-100，默认 50。
|
|
124
|
+
*/
|
|
125
|
+
volume?: number;
|
|
126
|
+
};
|
|
127
|
+
services: Ref<TtsRichTextServices, TtsRichTextServices>;
|
|
128
|
+
features: Ref<TtsEditorFeatures, TtsEditorFeatures>;
|
|
129
|
+
notify: (type: NotificationType, message: string) => void;
|
|
130
|
+
getReferencedVirtualElement: () => {
|
|
131
|
+
getBoundingClientRect(): {
|
|
132
|
+
x: number;
|
|
133
|
+
y: number;
|
|
134
|
+
left: number;
|
|
135
|
+
top: number;
|
|
136
|
+
right: number;
|
|
137
|
+
bottom: number;
|
|
138
|
+
width: number;
|
|
139
|
+
height: number;
|
|
140
|
+
};
|
|
141
|
+
} | null;
|
|
142
|
+
replaceContentWithText: (text: string) => void;
|
|
143
|
+
textLength: import('vue').ComputedRef<number>;
|
|
144
|
+
voiceVersion: Ref<number, number>;
|
|
145
|
+
};
|
|
@@ -1,53 +1,253 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Editor, JSONContent } from '@tiptap/core';
|
|
2
|
+
import { TtsInputData, TtsRichTextEditorProps } from '../../type';
|
|
2
3
|
declare function __VLS_template(): {
|
|
3
4
|
attrs: Partial<{}>;
|
|
4
5
|
slots: {
|
|
5
6
|
'toolbar-before'?(_: {
|
|
6
|
-
editor:
|
|
7
|
+
editor: Editor | undefined;
|
|
7
8
|
}): any;
|
|
8
9
|
'toolbar-after'?(_: {
|
|
9
|
-
editor:
|
|
10
|
+
editor: Editor | undefined;
|
|
10
11
|
}): any;
|
|
11
12
|
'editor-after'?(_: {
|
|
12
|
-
editor:
|
|
13
|
+
editor: Editor | undefined;
|
|
13
14
|
}): any;
|
|
14
15
|
'footer-before'?(_: {
|
|
15
|
-
editor:
|
|
16
|
+
editor: Editor | undefined;
|
|
16
17
|
textLength: number;
|
|
17
18
|
}): any;
|
|
18
19
|
'footer-after'?(_: {
|
|
19
|
-
editor:
|
|
20
|
+
editor: Editor | undefined;
|
|
20
21
|
textLength: number;
|
|
21
22
|
}): any;
|
|
22
23
|
};
|
|
23
|
-
refs: {
|
|
24
|
-
|
|
24
|
+
refs: {
|
|
25
|
+
rootRef: ({
|
|
26
|
+
$: import('vue').ComponentInternalInstance;
|
|
27
|
+
$data: {};
|
|
28
|
+
$props: {
|
|
29
|
+
readonly disabled?: boolean | undefined;
|
|
30
|
+
readonly placeholder?: string | undefined;
|
|
31
|
+
readonly modelValue?: JSONContent | undefined;
|
|
32
|
+
readonly textLimit?: number | undefined;
|
|
33
|
+
readonly voiceVersion?: number | undefined;
|
|
34
|
+
readonly features?: import('../../type').TtsEditorFeatures | undefined;
|
|
35
|
+
readonly services?: import('../../type').TtsRichTextServices | undefined;
|
|
36
|
+
readonly getPreviewParams?: (() => Record<string, unknown>) | undefined;
|
|
37
|
+
readonly showSelectionMenu?: boolean | undefined;
|
|
38
|
+
readonly "onUpdate:modelValue"?: ((value: JSONContent) => any) | undefined;
|
|
39
|
+
readonly onChange?: ((value: JSONContent) => any) | undefined;
|
|
40
|
+
readonly onReady?: ((editor: Editor) => any) | undefined;
|
|
41
|
+
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
|
|
42
|
+
$attrs: import('vue').Attrs;
|
|
43
|
+
$refs: {
|
|
44
|
+
[x: string]: unknown;
|
|
45
|
+
};
|
|
46
|
+
$slots: Readonly<{
|
|
47
|
+
[name: string]: import('vue').Slot<any> | undefined;
|
|
48
|
+
}>;
|
|
49
|
+
$root: import('vue').ComponentPublicInstance | null;
|
|
50
|
+
$parent: import('vue').ComponentPublicInstance | null;
|
|
51
|
+
$host: Element | null;
|
|
52
|
+
$emit: ((event: "update:modelValue", value: JSONContent) => void) & ((event: "change", value: JSONContent) => void) & ((event: "ready", editor: Editor) => void);
|
|
53
|
+
$el: any;
|
|
54
|
+
$options: import('vue').ComponentOptionsBase<Readonly<import('../../type').TtsEditorRootProps> & Readonly<{
|
|
55
|
+
"onUpdate:modelValue"?: ((value: JSONContent) => any) | undefined;
|
|
56
|
+
onChange?: ((value: JSONContent) => any) | undefined;
|
|
57
|
+
onReady?: ((editor: Editor) => any) | undefined;
|
|
58
|
+
}>, {
|
|
59
|
+
clear: () => void;
|
|
60
|
+
focus: () => void;
|
|
61
|
+
getJson: () => JSONContent;
|
|
62
|
+
getTtsData: () => TtsInputData;
|
|
63
|
+
replaceText: (text: string) => void;
|
|
64
|
+
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
65
|
+
"update:modelValue": (value: JSONContent) => any;
|
|
66
|
+
change: (value: JSONContent) => any;
|
|
67
|
+
ready: (editor: Editor) => any;
|
|
68
|
+
}, string, {
|
|
69
|
+
disabled: boolean;
|
|
70
|
+
placeholder: string;
|
|
71
|
+
modelValue: JSONContent;
|
|
72
|
+
textLimit: number;
|
|
73
|
+
voiceVersion: number;
|
|
74
|
+
features: import('../../type').TtsEditorFeatures;
|
|
75
|
+
services: import('../../type').TtsRichTextServices;
|
|
76
|
+
showSelectionMenu: boolean;
|
|
77
|
+
}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
|
|
78
|
+
beforeCreate?: (() => void) | (() => void)[];
|
|
79
|
+
created?: (() => void) | (() => void)[];
|
|
80
|
+
beforeMount?: (() => void) | (() => void)[];
|
|
81
|
+
mounted?: (() => void) | (() => void)[];
|
|
82
|
+
beforeUpdate?: (() => void) | (() => void)[];
|
|
83
|
+
updated?: (() => void) | (() => void)[];
|
|
84
|
+
activated?: (() => void) | (() => void)[];
|
|
85
|
+
deactivated?: (() => void) | (() => void)[];
|
|
86
|
+
beforeDestroy?: (() => void) | (() => void)[];
|
|
87
|
+
beforeUnmount?: (() => void) | (() => void)[];
|
|
88
|
+
destroyed?: (() => void) | (() => void)[];
|
|
89
|
+
unmounted?: (() => void) | (() => void)[];
|
|
90
|
+
renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
91
|
+
renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
92
|
+
errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
|
|
93
|
+
};
|
|
94
|
+
$forceUpdate: () => void;
|
|
95
|
+
$nextTick: typeof import('vue').nextTick;
|
|
96
|
+
$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
|
|
97
|
+
} & Readonly<{
|
|
98
|
+
disabled: boolean;
|
|
99
|
+
placeholder: string;
|
|
100
|
+
modelValue: JSONContent;
|
|
101
|
+
textLimit: number;
|
|
102
|
+
voiceVersion: number;
|
|
103
|
+
features: import('../../type').TtsEditorFeatures;
|
|
104
|
+
services: import('../../type').TtsRichTextServices;
|
|
105
|
+
showSelectionMenu: boolean;
|
|
106
|
+
}> & Omit<Readonly<import('../../type').TtsEditorRootProps> & Readonly<{
|
|
107
|
+
"onUpdate:modelValue"?: ((value: JSONContent) => any) | undefined;
|
|
108
|
+
onChange?: ((value: JSONContent) => any) | undefined;
|
|
109
|
+
onReady?: ((editor: Editor) => any) | undefined;
|
|
110
|
+
}>, "clear" | "focus" | ("disabled" | "placeholder" | "modelValue" | "textLimit" | "voiceVersion" | "features" | "services" | "showSelectionMenu") | "getJson" | "getTtsData" | "replaceText"> & {
|
|
111
|
+
clear: () => void;
|
|
112
|
+
focus: () => void;
|
|
113
|
+
getJson: () => JSONContent;
|
|
114
|
+
getTtsData: () => TtsInputData;
|
|
115
|
+
replaceText: (text: string) => void;
|
|
116
|
+
} & {} & import('vue').ComponentCustomProperties & {} & {
|
|
117
|
+
$slots: Readonly<{
|
|
118
|
+
default(props: import('../tts-editor-root').TtsEditorRootSlotProps): unknown;
|
|
119
|
+
}> & {
|
|
120
|
+
default(props: import('../tts-editor-root').TtsEditorRootSlotProps): unknown;
|
|
121
|
+
};
|
|
122
|
+
}) | null;
|
|
123
|
+
};
|
|
124
|
+
rootEl: any;
|
|
25
125
|
};
|
|
26
126
|
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
27
127
|
declare const __VLS_component: import('vue').DefineComponent<TtsRichTextEditorProps, {
|
|
28
128
|
clear: () => void;
|
|
29
129
|
focus: () => void;
|
|
30
|
-
getJson: () =>
|
|
31
|
-
getTtsData: () =>
|
|
130
|
+
getJson: () => JSONContent;
|
|
131
|
+
getTtsData: () => TtsInputData;
|
|
32
132
|
replaceText: (text: string) => void;
|
|
33
133
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
34
|
-
"update:modelValue": (value:
|
|
35
|
-
change: (value:
|
|
36
|
-
ready: (editor:
|
|
134
|
+
"update:modelValue": (value: JSONContent) => any;
|
|
135
|
+
change: (value: JSONContent) => any;
|
|
136
|
+
ready: (editor: Editor) => any;
|
|
37
137
|
}, string, import('vue').PublicProps, Readonly<TtsRichTextEditorProps> & Readonly<{
|
|
38
|
-
"onUpdate:modelValue"?: ((value:
|
|
39
|
-
onChange?: ((value:
|
|
40
|
-
onReady?: ((editor:
|
|
138
|
+
"onUpdate:modelValue"?: ((value: JSONContent) => any) | undefined;
|
|
139
|
+
onChange?: ((value: JSONContent) => any) | undefined;
|
|
140
|
+
onReady?: ((editor: Editor) => any) | undefined;
|
|
41
141
|
}>, {
|
|
42
142
|
disabled: boolean;
|
|
43
143
|
placeholder: string;
|
|
44
|
-
modelValue:
|
|
45
|
-
voiceVersion: number;
|
|
46
|
-
services: TtsRichTextServices;
|
|
47
|
-
features: TtsEditorFeatures;
|
|
48
|
-
textLimit: number;
|
|
144
|
+
modelValue: JSONContent;
|
|
49
145
|
showFullscreen: boolean;
|
|
50
|
-
|
|
146
|
+
textLimit: number;
|
|
147
|
+
voiceVersion: number;
|
|
148
|
+
features: import('../../type').TtsEditorFeatures;
|
|
149
|
+
services: import('../../type').TtsRichTextServices;
|
|
150
|
+
showSelectionMenu: boolean;
|
|
151
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
152
|
+
rootRef: ({
|
|
153
|
+
$: import('vue').ComponentInternalInstance;
|
|
154
|
+
$data: {};
|
|
155
|
+
$props: {
|
|
156
|
+
readonly disabled?: boolean | undefined;
|
|
157
|
+
readonly placeholder?: string | undefined;
|
|
158
|
+
readonly modelValue?: JSONContent | undefined;
|
|
159
|
+
readonly textLimit?: number | undefined;
|
|
160
|
+
readonly voiceVersion?: number | undefined;
|
|
161
|
+
readonly features?: import('../../type').TtsEditorFeatures | undefined;
|
|
162
|
+
readonly services?: import('../../type').TtsRichTextServices | undefined;
|
|
163
|
+
readonly getPreviewParams?: (() => Record<string, unknown>) | undefined;
|
|
164
|
+
readonly showSelectionMenu?: boolean | undefined;
|
|
165
|
+
readonly "onUpdate:modelValue"?: ((value: JSONContent) => any) | undefined;
|
|
166
|
+
readonly onChange?: ((value: JSONContent) => any) | undefined;
|
|
167
|
+
readonly onReady?: ((editor: Editor) => any) | undefined;
|
|
168
|
+
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
|
|
169
|
+
$attrs: import('vue').Attrs;
|
|
170
|
+
$refs: {
|
|
171
|
+
[x: string]: unknown;
|
|
172
|
+
};
|
|
173
|
+
$slots: Readonly<{
|
|
174
|
+
[name: string]: import('vue').Slot<any> | undefined;
|
|
175
|
+
}>;
|
|
176
|
+
$root: import('vue').ComponentPublicInstance | null;
|
|
177
|
+
$parent: import('vue').ComponentPublicInstance | null;
|
|
178
|
+
$host: Element | null;
|
|
179
|
+
$emit: ((event: "update:modelValue", value: JSONContent) => void) & ((event: "change", value: JSONContent) => void) & ((event: "ready", editor: Editor) => void);
|
|
180
|
+
$el: any;
|
|
181
|
+
$options: import('vue').ComponentOptionsBase<Readonly<import('../../type').TtsEditorRootProps> & Readonly<{
|
|
182
|
+
"onUpdate:modelValue"?: ((value: JSONContent) => any) | undefined;
|
|
183
|
+
onChange?: ((value: JSONContent) => any) | undefined;
|
|
184
|
+
onReady?: ((editor: Editor) => any) | undefined;
|
|
185
|
+
}>, {
|
|
186
|
+
clear: () => void;
|
|
187
|
+
focus: () => void;
|
|
188
|
+
getJson: () => JSONContent;
|
|
189
|
+
getTtsData: () => TtsInputData;
|
|
190
|
+
replaceText: (text: string) => void;
|
|
191
|
+
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
192
|
+
"update:modelValue": (value: JSONContent) => any;
|
|
193
|
+
change: (value: JSONContent) => any;
|
|
194
|
+
ready: (editor: Editor) => any;
|
|
195
|
+
}, string, {
|
|
196
|
+
disabled: boolean;
|
|
197
|
+
placeholder: string;
|
|
198
|
+
modelValue: JSONContent;
|
|
199
|
+
textLimit: number;
|
|
200
|
+
voiceVersion: number;
|
|
201
|
+
features: import('../../type').TtsEditorFeatures;
|
|
202
|
+
services: import('../../type').TtsRichTextServices;
|
|
203
|
+
showSelectionMenu: boolean;
|
|
204
|
+
}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
|
|
205
|
+
beforeCreate?: (() => void) | (() => void)[];
|
|
206
|
+
created?: (() => void) | (() => void)[];
|
|
207
|
+
beforeMount?: (() => void) | (() => void)[];
|
|
208
|
+
mounted?: (() => void) | (() => void)[];
|
|
209
|
+
beforeUpdate?: (() => void) | (() => void)[];
|
|
210
|
+
updated?: (() => void) | (() => void)[];
|
|
211
|
+
activated?: (() => void) | (() => void)[];
|
|
212
|
+
deactivated?: (() => void) | (() => void)[];
|
|
213
|
+
beforeDestroy?: (() => void) | (() => void)[];
|
|
214
|
+
beforeUnmount?: (() => void) | (() => void)[];
|
|
215
|
+
destroyed?: (() => void) | (() => void)[];
|
|
216
|
+
unmounted?: (() => void) | (() => void)[];
|
|
217
|
+
renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
218
|
+
renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
219
|
+
errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
|
|
220
|
+
};
|
|
221
|
+
$forceUpdate: () => void;
|
|
222
|
+
$nextTick: typeof import('vue').nextTick;
|
|
223
|
+
$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
|
|
224
|
+
} & Readonly<{
|
|
225
|
+
disabled: boolean;
|
|
226
|
+
placeholder: string;
|
|
227
|
+
modelValue: JSONContent;
|
|
228
|
+
textLimit: number;
|
|
229
|
+
voiceVersion: number;
|
|
230
|
+
features: import('../../type').TtsEditorFeatures;
|
|
231
|
+
services: import('../../type').TtsRichTextServices;
|
|
232
|
+
showSelectionMenu: boolean;
|
|
233
|
+
}> & Omit<Readonly<import('../../type').TtsEditorRootProps> & Readonly<{
|
|
234
|
+
"onUpdate:modelValue"?: ((value: JSONContent) => any) | undefined;
|
|
235
|
+
onChange?: ((value: JSONContent) => any) | undefined;
|
|
236
|
+
onReady?: ((editor: Editor) => any) | undefined;
|
|
237
|
+
}>, "clear" | "focus" | ("disabled" | "placeholder" | "modelValue" | "textLimit" | "voiceVersion" | "features" | "services" | "showSelectionMenu") | "getJson" | "getTtsData" | "replaceText"> & {
|
|
238
|
+
clear: () => void;
|
|
239
|
+
focus: () => void;
|
|
240
|
+
getJson: () => JSONContent;
|
|
241
|
+
getTtsData: () => TtsInputData;
|
|
242
|
+
replaceText: (text: string) => void;
|
|
243
|
+
} & {} & import('vue').ComponentCustomProperties & {} & {
|
|
244
|
+
$slots: Readonly<{
|
|
245
|
+
default(props: import('../tts-editor-root').TtsEditorRootSlotProps): unknown;
|
|
246
|
+
}> & {
|
|
247
|
+
default(props: import('../tts-editor-root').TtsEditorRootSlotProps): unknown;
|
|
248
|
+
};
|
|
249
|
+
}) | null;
|
|
250
|
+
}, any>;
|
|
51
251
|
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
52
252
|
export default _default;
|
|
53
253
|
type __VLS_WithTemplateSlots<T, S> = T & {
|