├── .gitignore ├── .npmignore ├── LICENSE ├── README.md ├── docs ├── .vitepress │ ├── cache │ │ └── deps │ │ │ ├── _metadata.json │ │ │ ├── chunk-4SPASM64.js │ │ │ ├── chunk-4SPASM64.js.map │ │ │ ├── chunk-L2JNJ22P.js │ │ │ ├── chunk-L2JNJ22P.js.map │ │ │ ├── package.json │ │ │ ├── vitepress___@vue_devtools-api.js │ │ │ ├── vitepress___@vue_devtools-api.js.map │ │ │ ├── vitepress___@vueuse_core.js │ │ │ ├── vitepress___@vueuse_core.js.map │ │ │ ├── vitepress___@vueuse_integrations_useFocusTrap.js │ │ │ ├── vitepress___@vueuse_integrations_useFocusTrap.js.map │ │ │ ├── vitepress___mark__js_src_vanilla__js.js │ │ │ ├── vitepress___mark__js_src_vanilla__js.js.map │ │ │ ├── vitepress___minisearch.js │ │ │ ├── vitepress___minisearch.js.map │ │ │ ├── vue.js │ │ │ └── vue.js.map │ ├── config.ts │ └── theme │ │ ├── index.ts │ │ └── style.less ├── changelog.md ├── guide │ ├── bubble.md │ ├── checkbox.md │ ├── divider.md │ ├── icon.md │ ├── install.md │ ├── introduction.md │ ├── locale.md │ ├── menu.md │ ├── quick-start.md │ ├── shortcut.md │ ├── tabs.md │ └── wrapper.md ├── index.md └── menus │ ├── built-in │ ├── align-center.md │ ├── align-justify.md │ ├── align-left.md │ ├── align-right.md │ ├── attachment.md │ ├── back-color.md │ ├── blockquote.md │ ├── bold.md │ ├── clear-format.md │ ├── code-block-languages.md │ ├── code-block.md │ ├── code.md │ ├── color.md │ ├── decrease-indent.md │ ├── font-family.md │ ├── font-size.md │ ├── full-screen.md │ ├── heading.md │ ├── horizontal.md │ ├── image.md │ ├── increase-indent.md │ ├── italic.md │ ├── line-height.md │ ├── link-unset.md │ ├── link.md │ ├── math.md │ ├── ordered-list.md │ ├── redo.md │ ├── strikethrough.md │ ├── subscript.md │ ├── superscript.md │ ├── table-add-column.md │ ├── table-add-row.md │ ├── table-delete-column.md │ ├── table-delete-row.md │ ├── table-merge-cell.md │ ├── table-unset.md │ ├── table.md │ ├── task.md │ ├── underline.md │ ├── undo.md │ ├── unordered-list.md │ ├── video-controls.md │ ├── video-loop.md │ ├── video-muted.md │ ├── video.md │ ├── wrap-down.md │ └── wrap-up.md │ └── introduction.md ├── examples ├── App.vue └── main.ts ├── index.html ├── lib ├── core │ ├── button │ │ ├── button.vue.d.ts │ │ ├── index.d.ts │ │ └── props.d.ts │ ├── checkbox │ │ ├── checkbox.vue.d.ts │ │ ├── index.d.ts │ │ └── props.d.ts │ ├── divider │ │ ├── divider.vue.d.ts │ │ └── index.d.ts │ ├── icon │ │ ├── icon.vue.d.ts │ │ ├── index.d.ts │ │ └── props.d.ts │ ├── popover │ │ ├── index.d.ts │ │ ├── popover.vue.d.ts │ │ └── props.d.ts │ └── tabs │ │ ├── index.d.ts │ │ ├── props.d.ts │ │ └── tabs.vue.d.ts ├── editor │ ├── bubble │ │ ├── bubble.vue.d.ts │ │ ├── index.d.ts │ │ └── props.d.ts │ ├── menu │ │ ├── built-in │ │ │ ├── align-center │ │ │ │ ├── align-center.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── align-justify │ │ │ │ ├── align-justify.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── align-left │ │ │ │ ├── align-left.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── align-right │ │ │ │ ├── align-right.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── attachment │ │ │ │ ├── attachment.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── back-color │ │ │ │ ├── back-color.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── blockquote │ │ │ │ ├── blockquote.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── bold │ │ │ │ ├── bold.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── clear-format │ │ │ │ ├── clear-format.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── code-block │ │ │ │ ├── code-block-languages.vue.d.ts │ │ │ │ ├── code-block.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── code │ │ │ │ ├── code.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── color │ │ │ │ ├── color.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── decrease-indent │ │ │ │ ├── decrease-indent.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── font-family │ │ │ │ ├── font-family.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── font-size │ │ │ │ ├── font-size.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── full-screen │ │ │ │ ├── full-screen.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── heading │ │ │ │ ├── heading.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── horizontal │ │ │ │ ├── horizontal.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── image │ │ │ │ ├── image.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── increase-indent │ │ │ │ ├── increase-indent.vue.d.ts │ │ │ │ ├── index.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── index.d.ts │ │ │ ├── italic │ │ │ │ ├── index.d.ts │ │ │ │ ├── italic.vue.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── line-height │ │ │ │ ├── index.d.ts │ │ │ │ ├── line-height.vue.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── link │ │ │ │ ├── index.d.ts │ │ │ │ ├── link-unset.vue.d.ts │ │ │ │ ├── link.vue.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── math │ │ │ │ ├── index.d.ts │ │ │ │ ├── math.vue.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── ordered-list │ │ │ │ ├── index.d.ts │ │ │ │ ├── ordered-list.vue.d.ts │ │ │ │ └── props.d.ts │ │ │ ├── redo │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── redo.vue.d.ts │ │ │ ├── strikethrough │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── strikethrough.vue.d.ts │ │ │ ├── subscript │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── subscript.vue.d.ts │ │ │ ├── superscript │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── superscript.vue.d.ts │ │ │ ├── table │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ ├── table-add-column.vue.d.ts │ │ │ │ ├── table-add-row.vue.d.ts │ │ │ │ ├── table-delete-column.vue.d.ts │ │ │ │ ├── table-delete-row.vue.d.ts │ │ │ │ ├── table-merge-cell.vue.d.ts │ │ │ │ ├── table-unset.vue.d.ts │ │ │ │ └── table.vue.d.ts │ │ │ ├── task │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── task.vue.d.ts │ │ │ ├── underline │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── underline.vue.d.ts │ │ │ ├── undo │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── undo.vue.d.ts │ │ │ ├── unordered-list │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── unordered-list.vue.d.ts │ │ │ ├── video │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ ├── video-controls.vue.d.ts │ │ │ │ ├── video-loop.vue.d.ts │ │ │ │ ├── video-muted.vue.d.ts │ │ │ │ └── video.vue.d.ts │ │ │ ├── wrap-down │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── wrap-down.vue.d.ts │ │ │ └── wrap-up │ │ │ │ ├── index.d.ts │ │ │ │ ├── props.d.ts │ │ │ │ └── wrap-up.vue.d.ts │ │ ├── index.d.ts │ │ ├── menu.vue.d.ts │ │ └── props.d.ts │ └── wrapper │ │ ├── index.d.ts │ │ ├── props.d.ts │ │ ├── render.d.ts │ │ └── wrapper.vue.d.ts ├── index.d.ts ├── kaitify-vue.es.js ├── kaitify-vue.umd.js └── locale │ ├── en-us.d.ts │ └── index.d.ts ├── package.json ├── src ├── Editor │ ├── bubble │ │ ├── bubble.vue │ │ ├── index.ts │ │ ├── props.ts │ │ └── style.less │ ├── menu │ │ ├── built-in │ │ │ ├── align-center │ │ │ │ ├── align-center.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── align-justify │ │ │ │ ├── align-justify.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── align-left │ │ │ │ ├── align-left.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── align-right │ │ │ │ ├── align-right.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── attachment │ │ │ │ ├── attachment.vue │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── style.less │ │ │ ├── back-color │ │ │ │ ├── back-color.vue │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── style.less │ │ │ ├── blockquote │ │ │ │ ├── blockquote.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── bold │ │ │ │ ├── bold.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── clear-format │ │ │ │ ├── clear-format.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── code-block │ │ │ │ ├── code-block-languages.vue │ │ │ │ ├── code-block.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── code │ │ │ │ ├── code.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── color │ │ │ │ ├── color.vue │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── style.less │ │ │ ├── decrease-indent │ │ │ │ ├── decrease-indent.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── font-family │ │ │ │ ├── font-family.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── font-size │ │ │ │ ├── font-size.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── full-screen │ │ │ │ ├── full-screen.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── heading │ │ │ │ ├── heading.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── horizontal │ │ │ │ ├── horizontal.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── image │ │ │ │ ├── image.vue │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── style.less │ │ │ ├── increase-indent │ │ │ │ ├── increase-indent.vue │ │ │ │ ├── index.ts │ │ │ │ └── props.ts │ │ │ ├── index.ts │ │ │ ├── italic │ │ │ │ ├── index.ts │ │ │ │ ├── italic.vue │ │ │ │ └── props.ts │ │ │ ├── line-height │ │ │ │ ├── index.ts │ │ │ │ ├── line-height.vue │ │ │ │ └── props.ts │ │ │ ├── link │ │ │ │ ├── index.ts │ │ │ │ ├── link-unset.vue │ │ │ │ ├── link.vue │ │ │ │ ├── props.ts │ │ │ │ └── style.less │ │ │ ├── math │ │ │ │ ├── index.ts │ │ │ │ ├── math.vue │ │ │ │ ├── props.ts │ │ │ │ └── style.less │ │ │ ├── ordered-list │ │ │ │ ├── index.ts │ │ │ │ ├── ordered-list.vue │ │ │ │ ├── props.ts │ │ │ │ └── style.less │ │ │ ├── redo │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── redo.vue │ │ │ ├── strikethrough │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── strikethrough.vue │ │ │ ├── subscript │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── subscript.vue │ │ │ ├── superscript │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── superscript.vue │ │ │ ├── table │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ ├── style.less │ │ │ │ ├── table-add-column.vue │ │ │ │ ├── table-add-row.vue │ │ │ │ ├── table-delete-column.vue │ │ │ │ ├── table-delete-row.vue │ │ │ │ ├── table-merge-cell.vue │ │ │ │ ├── table-unset.vue │ │ │ │ └── table.vue │ │ │ ├── task │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── task.vue │ │ │ ├── underline │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── underline.vue │ │ │ ├── undo │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── undo.vue │ │ │ ├── unordered-list │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ ├── style.less │ │ │ │ └── unordered-list.vue │ │ │ ├── video │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ ├── style.less │ │ │ │ ├── video-controls.vue │ │ │ │ ├── video-loop.vue │ │ │ │ ├── video-muted.vue │ │ │ │ └── video.vue │ │ │ ├── wrap-down │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── wrap-down.vue │ │ │ └── wrap-up │ │ │ │ ├── index.ts │ │ │ │ ├── props.ts │ │ │ │ └── wrap-up.vue │ │ ├── index.ts │ │ ├── menu.vue │ │ ├── props.ts │ │ └── style.less │ └── wrapper │ │ ├── index.ts │ │ ├── props.ts │ │ ├── render.ts │ │ ├── style.less │ │ └── wrapper.vue ├── core │ ├── button │ │ ├── button.vue │ │ ├── index.ts │ │ ├── props.ts │ │ └── style.less │ ├── checkbox │ │ ├── checkbox.vue │ │ ├── index.ts │ │ ├── props.ts │ │ └── style.less │ ├── divider │ │ ├── divider.vue │ │ ├── index.ts │ │ └── style.less │ ├── icon │ │ ├── icon.vue │ │ ├── index.ts │ │ ├── props.ts │ │ └── style.less │ ├── popover │ │ ├── index.ts │ │ ├── popover.vue │ │ ├── props.ts │ │ └── style.less │ └── tabs │ │ ├── index.ts │ │ ├── props.ts │ │ ├── style.less │ │ └── tabs.vue ├── iconfont │ ├── iconfont.css │ ├── iconfont.ttf │ └── iconfont.woff ├── index.ts └── locale │ ├── en-us.ts │ └── index.ts ├── tsconfig.json ├── tsconfig.node.json ├── vite-env.d.ts └── vite.config.ts /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | dist 4 | docs/kaitify-vue 5 | 6 | # local env files 7 | .env.local 8 | .env.*.local 9 | 10 | # Log files 11 | npm-debug.log* 12 | yarn-debug.log* 13 | yarn-error.log* 14 | 15 | # Editor directories and files 16 | .idea 17 | .vscode 18 | *.suo 19 | *.ntvs* 20 | *.njsproj 21 | *.sln 22 | *.sw? 23 | 24 | /package-lock.json -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | # 忽略目录 2 | examples/ 3 | public/ 4 | docs/ 5 | src/ 6 | 7 | 8 | # 忽略指定文件 9 | LICENSE 10 | index.html 11 | vite.config.ts 12 | tsconfig.json 13 | tsconfig.node.json 14 | package-lock.json 15 | vite-env.d.ts 16 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 so-better 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | #### 基于@kaitify/core 开发的 vue 富文本编辑器核心库 2 | 3 | > [@kaitify/vue 官方文档](https://www.so-better.cn/docs/kaitify-vue/) 4 | -------------------------------------------------------------------------------- /docs/.vitepress/cache/deps/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "type": "module" 3 | } 4 | -------------------------------------------------------------------------------- /docs/.vitepress/cache/deps/vitepress___@vueuse_core.js.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "sources": [], 4 | "sourcesContent": [], 5 | "mappings": "", 6 | "names": [] 7 | } 8 | -------------------------------------------------------------------------------- /docs/.vitepress/cache/deps/vue.js.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "sources": [], 4 | "sourcesContent": [], 5 | "mappings": "", 6 | "names": [] 7 | } 8 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/index.ts: -------------------------------------------------------------------------------- 1 | import DefaultTheme from 'vitepress/theme' 2 | import './style.less' 3 | 4 | export default { 5 | extends: DefaultTheme 6 | } 7 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/style.less: -------------------------------------------------------------------------------- 1 | :root { 2 | --vp-home-hero-name-background: linear-gradient(120deg, #8b1bbf 20%, #308af3); 3 | --vp-home-hero-name-color: transparent; 4 | --vp-c-indigo-1: #1269cd; 5 | --vp-c-indigo-2: #1e79e1; 6 | --vp-c-indigo-3: #308af3; 7 | 8 | --vp-code-block-bg: #f7f8fa; 9 | 10 | h5 > .VPBadge.danger { 11 | font-family: var(--vp-font-family-mono); 12 | } 13 | 14 | &.dark { 15 | --vp-code-block-bg: #1f1f22; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /docs/guide/checkbox.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Checkbox 复选框 3 | --- 4 | 5 | # Checkbox 复选框 6 | 7 | `Checkbox` 组件是 `kaitify-vue` 的一个 `UI` 组件，该组件与编辑器具体的功能无关，它一般用于带浮层的菜单中，用来进行勾选 8 | 9 | ## 基本使用 10 | 11 | ```vue 12 | 15 | 20 | ``` 21 | 22 | 示例： 23 | 24 |
25 | 26 | 27 |
28 | 29 | 34 | 35 | ## Props 参数 36 | 37 | ##### v-model 38 | 39 | 复选框的值 40 | 41 | ##### disabled 42 | 43 | 复选框是否禁用 44 | 45 | ##### label 46 | 47 | 复选框右侧显示的文字内容 48 | -------------------------------------------------------------------------------- /docs/guide/divider.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Divider 菜单分隔线 3 | --- 4 | 5 | # Divider 菜单分隔线 6 | 7 | `Divider` 组件是 `kaitify-vue` 的一个 `UI` 组件，该组件与编辑器具体的功能无关，它仅仅是为了排列多个 `Menu` 组件时，能够更好的为 `Menu` 组件划区 8 | 9 | 因此，`Divider` 组件是放置在 `Menu` 组件之间的 10 | 11 | ## 基本使用 12 | 13 | ```vue 14 | 30 | 35 | ``` 36 | -------------------------------------------------------------------------------- /docs/guide/icon.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Icon 图标 3 | --- 4 | 5 | # Icon 图标 6 | 7 | `Icon` 组件是 `kaitify-vue` 的一个 `UI` 组件，通过该组件你可以在你想要的地方展示不同的图标 8 | 9 | ## 基本使用 10 | 11 | ```vue 12 | 15 | 18 | ``` 19 | 20 | 示例： 21 | 22 | 23 | 24 | 25 | 26 | 29 | 30 | ## Props 参数 31 | 32 | ##### name 33 | 34 | 图标的值，目前仅支持 `kaitify` 内置图标（暂不对外提供具体的使用）和 `@iconify/vue` 图标，可在[https://icon-sets.iconify.design/](https://icon-sets.iconify.design/)上查找你想用的图标并复制其 `name` 使用 35 | 36 | ##### size 37 | 38 | 图标的大小，如果是数字默认单位为 `px`，默认图标大小为父元素的字体大小 39 | -------------------------------------------------------------------------------- /docs/guide/introduction.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 简介 3 | --- 4 | 5 | # 简介 6 | 7 | ## 前言 8 | 9 | `kaitify-vue` 是一套基于 `kaitify` 富文本编辑器核心库进行开发和设计的富文本编辑器，使用 `Vue3` 框架作视图渲染，并提供相关的组件供开发者使用 10 | 11 | 本文档不再对 `kaitify` 进赘述，关于编辑器底层的核心理念，在 `kaitify` 文档中都有讲述，如果你对 `kaitify` 有兴趣，可以访问 [@kaitify/core 文档](https://www.so-better.cn/docs/kaitify-core/)，获取进一步的了解 12 | 13 | ## 结合 Vue3 14 | 15 | `kaitify` 是一个基于原生 `js` 的富文本编辑器核心库，在 `Vue3` 项目中进行使用的话，可能需要进行一些组件的封装，并且需要为更好地与 `Vue3` 结合而进行开发与设计 16 | 17 | `kaitify-vue` 的目的就是为了帮助开发者解决这一问题，减少一些基本工作，同时提供了可以直接拿来使用的必要组件，并且设计了一套基本的 `UI` 样式 18 | 19 | ## 视图渲染 20 | 21 | `kaitify` 的视图渲染采用完全原生 `js` 的写法，我们称之为 `js-render`，而在 `kaitify-vue` 中，我们自定义了视图渲染的逻辑，采用 `Vue3` 的 `VNode` 来作视图渲染 22 | 23 | 因此编辑器本身不关心视图如何进行渲染，只需要专注于内部逻辑的处理，视图渲染的部分我们完全交给 `Vue3` 去处理 24 | 25 | > [!TIP] 怎么样？ 26 | > 接下来去更详细地了解 `kaitify-vue` 是怎么使用的吧~ 27 | -------------------------------------------------------------------------------- /docs/guide/locale.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 国际化支持 3 | --- 4 | 5 | # 国际化支持 6 | 7 | `kaitify-vue` 默认为中文环境，即显示的相关文字都是中文 8 | 9 | 同时支持英文环境，即显示的相关文字都是英文，目前暂不支持除中文和英文以外的第三方语言 10 | 11 | ## 中文环境 12 | 13 | `Wrapper` 组件的 `locale` 属性设置为 `zh-cn` 或者不设置 14 | 15 | ```vue 16 | 19 | 24 | ``` 25 | 26 | ## 英文环境 27 | 28 | `Wrapper` 组件的 `locale` 属性设置为 `en-us` 29 | 30 | ```vue 31 | 34 | 39 | ``` 40 | 41 | 编辑器自身可能体现不出来中英文环境的差别，`kaitify-vue` 提供了内置的 `Menu`，当设置 `locale` 为 `en-us` 后，这些内置 `Menu` 中的汉字都会转为英文 42 | -------------------------------------------------------------------------------- /docs/guide/tabs.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Tabs 选项卡 3 | --- 4 | 5 | # Tabs 选项卡 6 | 7 | `Tabs` 组件是 `kaitify-vue` 的一个 `UI` 组件，该组件与编辑器具体的功能无关，它一般用于带浮层的菜单中，用来分区域展示不同的内容 8 | 9 | ## 基本使用 10 | 11 | ```vue 12 | 23 | 27 | ``` 28 | 29 | 示例： 30 | 31 | 32 | 33 | 34 | 35 | 43 | 44 | ## Props 参数 45 | 46 | ##### data 47 | 48 | 选项卡数据配置，是一个数组，数组项的 `label` 表示选项卡显示的名称，`value` 表示选项卡对应的值 49 | 50 | ##### defaultValue 51 | 52 | 默认展示的选项卡，这里只需要设置其 `value` 对应的值即可 53 | 54 | ## Slots 插槽 55 | 56 | ##### default 57 | 58 | 默认插槽，提供一个参数 `current`，表示当前选项卡的值，需要根据 `current` 的值来动态显示不同的内容 59 | -------------------------------------------------------------------------------- /docs/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | lastUpdated: false 3 | aside: false 4 | layout: home 5 | title: 主页 6 | 7 | hero: 8 | name: kaitify for vue 9 | text: 一个简单的vue富文本编辑器核心库 10 | tagline: 轻松构建一个L1级别的vue富文本编辑器... 11 | image: 12 | src: https://www.so-better.cn/docs/kaitify-core/logo.png 13 | width: 288 14 | actions: 15 | - theme: brand 16 | text: Get Started 17 | link: /guide/introduction 18 | - theme: alt 19 | text: View on GitHub 20 | link: https://github.com/so-better/kaitify-vue 21 | 22 | features: 23 | - title: '@kaitify/core' 24 | details: 基于原生JS的富文本编辑器核心库 25 | link: https://www.so-better.cn/docs/kaitify-core/ 26 | - title: dap-util 27 | details: 一个轻量的前端JavaScript工具库，专注于JavaScript，不关心UI 28 | link: https://www.so-better.cn/docs/dap-util/ 29 | - title: animator-clip 30 | details: 一个基于 JavaScript 的 requestAnimationFrame API 封装的轻量级 JS 动画插件 31 | link: https://www.so-better.cn/docs/animator-clip/ 32 | - title: rem-fit 33 | details: 一款使用rem适配web页面的轻量级插件 34 | link: https://www.so-better.cn/docs/rem-fit/ 35 | - title: ruax 36 | details: 一个轻量级的Javascript异步数据请求库 37 | link: https://www.so-better.cn/docs/ruax/ 38 | --- 39 | -------------------------------------------------------------------------------- /docs/menus/built-in/align-center.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: align-center 居中对齐 3 | --- 4 | 5 | # align-center 居中对齐 6 | 7 | 设置/取消块节点的居中对齐效果 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { AlignCenterMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/align-justify.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: align-justify 两端对齐 3 | --- 4 | 5 | # align-justify 两端对齐 6 | 7 | 设置/取消块节点的两端对齐效果 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { AlignJustifyMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/align-left.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: align-left 左对齐 3 | --- 4 | 5 | # align-left 左对齐 6 | 7 | 设置/取消块节点的左对齐效果 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { AlignLeftMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/align-right.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: align-right 右对齐 3 | --- 4 | 5 | # align-right 右对齐 6 | 7 | 设置/取消块节点的右对齐效果 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { AlignRightMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/back-color.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: back-color 文本背景色 3 | --- 4 | 5 | # back-color 文本背景色 6 | 7 | 设置/取消文本的背景色 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { BackColorMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### colors 34 | 35 | 自定义背景色的可选择颜色数组 36 | 37 | ##### popoverProps 38 | 39 | 浮层属性配置，同 `Menu` 的 `popoverProps` 属性 40 | 41 | ## 代码示例 42 | 43 | 44 | 49 | 50 | 51 | 58 | -------------------------------------------------------------------------------- /docs/menus/built-in/blockquote.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: blockquote 引用 3 | --- 4 | 5 | # blockquote 引用 6 | 7 | 设置/取消引用 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { BlockquoteMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/bold.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: bold 加粗 3 | --- 4 | 5 | # bold 加粗 6 | 7 | 设置/取消文本加粗效果 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { BoldMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/clear-format.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: clear-format 清除格式 3 | --- 4 | 5 | # clear-format 清除格式 6 | 7 | 清除文本的所有样式和标记 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { ClearFormatMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/code-block.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: code-block 代码块 3 | --- 4 | 5 | # code-block 代码块 6 | 7 | 设置/取消代码块 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { CodeBlockMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/code.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: code 行内代码 3 | --- 4 | 5 | # code 行内代码 6 | 7 | 设置/取消行内代码 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { CodeMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/color.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: color 文本字体颜色 3 | --- 4 | 5 | # color 文本字体颜色 6 | 7 | 设置/取消文本的字体颜色 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { ColorMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### colors 34 | 35 | 自定义字体颜色的可选择颜色数组 36 | 37 | ##### popoverProps 38 | 39 | 浮层属性配置，同 `Menu` 的 `popoverProps` 属性 40 | 41 | ## 代码示例 42 | 43 | 44 | 49 | 50 | 51 | 58 | -------------------------------------------------------------------------------- /docs/menus/built-in/decrease-indent.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: decrease-indent 减少缩进 3 | --- 4 | 5 | # decrease-indent 减少缩进 6 | 7 | 减少块节点的缩进 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { DecreaseIndentMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/horizontal.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: horizontal 水平线 3 | --- 4 | 5 | # horizontal 水平线 6 | 7 | 插入水平线 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { HorizontalMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/increase-indent.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: increase-indent 增加缩进 3 | --- 4 | 5 | # increase-indent 增加缩进 6 | 7 | 增加块节点的缩进 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { IncreaseIndentMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/italic.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: italic 斜体 3 | --- 4 | 5 | # italic 斜体 6 | 7 | 设置/取消文本斜体效果 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { ItalicMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/link-unset.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: link-unset 取消链接 3 | --- 4 | 5 | # link-unset 取消链接 6 | 7 | 取消链接 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { LinkUnsetMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/link.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: link 链接 3 | --- 4 | 5 | # link 链接 6 | 7 | 插入链接 / 更新链接 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { LinkMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### popoverProps 34 | 35 | 浮层属性配置，同 `Menu` 的 `popoverProps` 属性 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/math.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: math 数学公式 3 | --- 4 | 5 | # math 数学公式 6 | 7 | 插入数学公式 / 更新数学公式 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { MathMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### popoverProps 34 | 35 | 浮层属性配置，同 `Menu` 的 `popoverProps` 属性 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/ordered-list.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: ordered-list 有序列表 3 | --- 4 | 5 | # ordered-list 有序列表 6 | 7 | 插入有序列表 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { OrderedListMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### popoverProps 34 | 35 | 浮层属性配置，同 `Menu` 的 `popoverProps` 属性 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/redo.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: redo 重做 3 | --- 4 | 5 | # redo 重做 6 | 7 | 执行重做操作 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { RedoMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ## 代码示例 34 | 35 | 36 | 41 | 42 | 43 | 50 | -------------------------------------------------------------------------------- /docs/menus/built-in/strikethrough.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: strikethrough 删除线 3 | --- 4 | 5 | # strikethrough 删除线 6 | 7 | 设置/取消文本删除线 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { StrikethroughMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/subscript.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: subscript 下标 3 | --- 4 | 5 | # subscript 下标 6 | 7 | 设置/取消文本下标 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { SubscriptMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/superscript.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: superscript 上标 3 | --- 4 | 5 | # superscript 上标 6 | 7 | 设置/取消文本上标 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { SuperscriptMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/table-delete-column.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: table-delete-column 表格删除列 3 | --- 4 | 5 | # table-delete-column 表格删除列 6 | 7 | 删除表格列 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { TableDeleteColumnMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/table-delete-row.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: table-delete-row 表格删除行 3 | --- 4 | 5 | # table-delete-row 表格删除行 6 | 7 | 删除表格行 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { TableDeleteRowMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/table-unset.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: table-unset 删除表格 3 | --- 4 | 5 | # table-unset 删除表格 6 | 7 | 删除表格行 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { TableUnsetMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/table.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: table 表格 3 | --- 4 | 5 | # table 表格 6 | 7 | 插入表格 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { TableMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### popoverProps 34 | 35 | 浮层属性配置，同 `Menu` 的 `popoverProps` 属性 36 | 37 | ##### maxRows 38 | 39 | 创建表格时的最大行数 40 | 41 | ##### maxColumns 42 | 43 | 创建表格时的最大列数 44 | 45 | ## 代码示例 46 | 47 | 48 | 53 | 54 | 55 | 62 | -------------------------------------------------------------------------------- /docs/menus/built-in/task.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: task 待办 3 | --- 4 | 5 | # task 待办 6 | 7 | 设置/取消待办 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { TaskMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/underline.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: underline 下划线 3 | --- 4 | 5 | # underline 下划线 6 | 7 | 设置/取消文本下划线 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { UnderlineMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/undo.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: undo 撤销 3 | --- 4 | 5 | # undo 撤销 6 | 7 | 执行撤销操作 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { UndoMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ## 代码示例 34 | 35 | 36 | 41 | 42 | 43 | 50 | -------------------------------------------------------------------------------- /docs/menus/built-in/unordered-list.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: unordered-list 无序列表 3 | --- 4 | 5 | # unordered-list 无序列表 6 | 7 | 插入无序列表 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { UnorderedListMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### popoverProps 34 | 35 | 浮层属性配置，同 `Menu` 的 `popoverProps` 属性 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/video-controls.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: video-controls 视频显示器控制 3 | --- 4 | 5 | # video-controls 视频显示器控制 6 | 7 | 设置/取消视频的显示器 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { VideoControlsMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/video-loop.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: video-loop 视频循环控制 3 | --- 4 | 5 | # video-loop 视频循环控制 6 | 7 | 设置/取消视频的循环 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { VideoLoopMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/video-muted.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: video-muted 视频静音控制 3 | --- 4 | 5 | # video-muted 视频静音控制 6 | 7 | 设置/取消视频的静音 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { VideoMutedMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### shortcut 34 | 35 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 36 | 37 | ## 代码示例 38 | 39 | 40 | 45 | 46 | 47 | 54 | -------------------------------------------------------------------------------- /docs/menus/built-in/wrap-down.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: wrap-down 向下换行 3 | --- 4 | 5 | # wrap-down 向下换行 6 | 7 | 在匹配的节点位置向下换行 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { WrapDownMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### match 34 | 35 | 匹配相关的节点，如果匹配上了，则会在点击菜单时向下换行，关于该属性的释义，同 [kaitify 中的 Editor 的 getMatchNodeBySelection 方法中的入参](https://www.so-better.cn/docs/kaitify-core/apis/editor-function#getmatchnodebyselection) 36 | 37 | ##### shortcut 38 | 39 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 40 | 41 | ## 代码示例 42 | 43 | 44 | 49 | 50 | 51 | 58 | -------------------------------------------------------------------------------- /docs/menus/built-in/wrap-up.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: wrap-up 向上换行 3 | --- 4 | 5 | # wrap-up 向上换行 6 | 7 | 在匹配的节点位置向上换行 8 | 9 | ## 使用方法 10 | 11 | - 引入组件 12 | 13 | ```ts 14 | import { WrapUpMenu } from '@kaitify/vue' 15 | ``` 16 | 17 | - 在 `Wrapper` 包裹器插槽中使用 18 | 19 | ```html 20 | 21 | 24 | 25 | ``` 26 | 27 | ## Props 参数 28 | 29 | ##### disabled 30 | 31 | 是否禁用该菜单，默认为 `false` 32 | 33 | ##### match 34 | 35 | 匹配相关的节点，如果匹配上了，则会在点击菜单时向上换行，关于该属性的释义，同 [kaitify 中的 Editor 的 getMatchNodeBySelection 方法中的入参](https://www.so-better.cn/docs/kaitify-core/apis/editor-function#getmatchnodebyselection) 36 | 37 | ##### shortcut 38 | 39 | 菜单快捷键实现，继承自 `Menu` 组件的同名属性，具体使用可参考 [Menu 组件的 shortcut](/guide/menu#shortcut) 40 | 41 | ## 代码示例 42 | 43 | 44 | 49 | 50 | 51 | 58 | -------------------------------------------------------------------------------- /docs/menus/introduction.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 简介 3 | --- 4 | 5 | # 简介 6 | 7 | ## 基本介绍 8 | 9 | 内置菜单是 `kaitify-vue` 内部使用 `Menu` 组件封装的一系列具有实际操作功能的菜单组件，每一个内置菜单的操作都是已经实现完成的了 10 | 11 | 内置菜单已经定义好了菜单各种情况下的状态，无需我们去关心什么时候该禁用、什么时候该激活，你可以直接拿来使用 12 | 13 | 除此之外，这些菜单也会提供一些参数让你可以进行灵活配置 14 | 15 | ## 使用示例 16 | 17 | 以加粗菜单为例： 18 | 19 | ```vue 20 | 27 | 32 | ``` 33 | 34 | 示例： 35 | 36 | 37 | 42 | 43 | 44 | 51 | -------------------------------------------------------------------------------- /examples/main.ts: -------------------------------------------------------------------------------- 1 | import { createApp } from 'vue' 2 | import App from './App.vue' 3 | 4 | createApp(App).mount('#app') 5 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 基于@kaitify/core开发的vue富文本编辑器核心库 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lib/core/button/button.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { ButtonPropsType } from './props'; 2 | declare function __VLS_template(): { 3 | slots: { 4 | default?(_: {}): any; 5 | }; 6 | refs: {}; 7 | attrs: Partial<{}>; 8 | }; 9 | type __VLS_TemplateResult = ReturnType; 10 | declare const __VLS_component: import('vue').DefineComponent & Readonly<{}>, { 11 | disabled: boolean; 12 | large: boolean; 13 | block: boolean; 14 | active: boolean; 15 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 16 | declare const _default: __VLS_WithTemplateSlots; 17 | export default _default; 18 | type __VLS_WithTemplateSlots = T & { 19 | new (): { 20 | $slots: S; 21 | }; 22 | }; 23 | -------------------------------------------------------------------------------- /lib/core/button/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Button } from './button.vue'; 2 | export * from './props'; 3 | export { Button }; 4 | -------------------------------------------------------------------------------- /lib/core/button/props.d.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 按钮组件的属性类型 3 | */ 4 | export type ButtonPropsType = { 5 | /** 6 | * 是否禁用 7 | */ 8 | disabled?: boolean; 9 | /** 10 | * 是否激活 11 | */ 12 | active?: boolean; 13 | /** 14 | * 是否块级展示 15 | */ 16 | block?: boolean; 17 | /** 18 | * 是否更大的按钮 19 | */ 20 | large?: boolean; 21 | }; 22 | -------------------------------------------------------------------------------- /lib/core/checkbox/checkbox.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { CheckboxPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent any; 4 | }, string, import('vue').PublicProps, Readonly & Readonly<{ 5 | "onUpdate:modelValue"?: ((value: boolean) => any) | undefined; 6 | }>, { 7 | disabled: boolean; 8 | modelValue: boolean; 9 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 10 | export default _default; 11 | -------------------------------------------------------------------------------- /lib/core/checkbox/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Checkbox } from './checkbox.vue'; 2 | export type * from './props'; 3 | export { Checkbox }; 4 | -------------------------------------------------------------------------------- /lib/core/checkbox/props.d.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 复选框组件属性类型 3 | */ 4 | export type CheckboxPropsType = { 5 | /** 6 | * 是否禁用 7 | */ 8 | disabled?: boolean; 9 | /** 10 | * 是否选中 11 | */ 12 | modelValue?: boolean; 13 | /** 14 | * label文字 15 | */ 16 | label?: string; 17 | }; 18 | /** 19 | * 复选框组件事件类型 20 | */ 21 | export type CheckboxEmitsType = { 22 | /** 23 | * 受控值改变触发的事件 24 | */ 25 | (e: 'update:modelValue', value: boolean): void; 26 | }; 27 | -------------------------------------------------------------------------------- /lib/core/divider/divider.vue.d.ts: -------------------------------------------------------------------------------- 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; 3 | -------------------------------------------------------------------------------- /lib/core/divider/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Divider } from './divider.vue'; 2 | export { Divider }; 3 | -------------------------------------------------------------------------------- /lib/core/icon/icon.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { IconPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | name: string; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/core/icon/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Icon } from './icon.vue'; 2 | export * from './props'; 3 | export { Icon }; 4 | -------------------------------------------------------------------------------- /lib/core/icon/props.d.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 图标组件的属性类型 3 | */ 4 | export type IconPropsType = { 5 | /** 6 | * iconify的图标name 7 | */ 8 | name: string; 9 | /** 10 | * 图标大小，如果是数值默认单位为px 11 | */ 12 | size?: string | number; 13 | }; 14 | -------------------------------------------------------------------------------- /lib/core/popover/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Popover } from './popover.vue'; 2 | export * from './props'; 3 | export { Popover }; 4 | -------------------------------------------------------------------------------- /lib/core/tabs/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Tabs } from './tabs.vue'; 2 | export * from './props'; 3 | export { Tabs }; 4 | -------------------------------------------------------------------------------- /lib/core/tabs/props.d.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 选项卡组件属性类型 3 | */ 4 | export type TabsPropsType = { 5 | /** 6 | * 选项卡分栏数据 7 | */ 8 | data: { 9 | label: string; 10 | value: string | number; 11 | }[]; 12 | /** 13 | * 选项卡默认选项 14 | */ 15 | defaultValue: string | number; 16 | }; 17 | -------------------------------------------------------------------------------- /lib/core/tabs/tabs.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TabsPropsType } from './props'; 2 | declare function __VLS_template(): { 3 | slots: { 4 | default?(_: { 5 | current: string | number; 6 | }): any; 7 | }; 8 | refs: {}; 9 | attrs: Partial<{}>; 10 | }; 11 | type __VLS_TemplateResult = ReturnType; 12 | declare const __VLS_component: import('vue').DefineComponent & Readonly<{}>, { 13 | data: { 14 | label: string; 15 | value: string | number; 16 | }[]; 17 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 18 | declare const _default: __VLS_WithTemplateSlots; 19 | export default _default; 20 | type __VLS_WithTemplateSlots = T & { 21 | new (): { 22 | $slots: S; 23 | }; 24 | }; 25 | -------------------------------------------------------------------------------- /lib/editor/bubble/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Bubble } from './bubble.vue'; 2 | export * from './props'; 3 | export { Bubble }; 4 | -------------------------------------------------------------------------------- /lib/editor/bubble/props.d.ts: -------------------------------------------------------------------------------- 1 | import { KNodeMatchOptionType } from '../../index'; 2 | /** 3 | * 气泡组件的属性类型 4 | */ 5 | export type BubblePropsType = { 6 | /** 7 | * 是否显示 8 | */ 9 | visible: boolean; 10 | /** 11 | * 层级 12 | */ 13 | zIndex?: number; 14 | /** 15 | * 指定条件，每次更新气泡位置时会光标是否在符合条件的节点下，如果符合则根据该节点的真实dom进行定位 16 | */ 17 | match?: KNodeMatchOptionType; 18 | }; 19 | /** 20 | * 气泡组件的事件类型 21 | */ 22 | export type BubbleEmitsType = { 23 | /** 24 | * 气泡显示前触发的事件 25 | */ 26 | (e: 'show', value: Element): void; 27 | /** 28 | * 气泡显示时触发的事件 29 | */ 30 | (e: 'showing', value: Element): void; 31 | /** 32 | * 气泡显示后触发的事件 33 | */ 34 | (e: 'shown', value: Element): void; 35 | /** 36 | * 气泡隐藏前触发的事件 37 | */ 38 | (e: 'hide', value: Element): void; 39 | /** 40 | * 气泡隐藏时触发的事件 41 | */ 42 | (e: 'hiding', value: Element): void; 43 | /** 44 | * 气泡隐藏后触发的事件 45 | */ 46 | (e: 'hidden', value: Element): void; 47 | }; 48 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-center/align-center.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { AlignCenterMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-center/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as AlignCenterMenu } from './align-center.vue'; 2 | export * from './props'; 3 | export { AlignCenterMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-center/props.d.ts: -------------------------------------------------------------------------------- 1 | export type AlignCenterMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-justify/align-justify.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { AlignJustifyMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-justify/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as AlignJustifyMenu } from './align-justify.vue'; 2 | export * from './props'; 3 | export { AlignJustifyMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-justify/props.d.ts: -------------------------------------------------------------------------------- 1 | export type AlignJustifyMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-left/align-left.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { AlignLeftMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-left/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as AlignLeftMenu } from './align-left.vue'; 2 | export * from './props'; 3 | export { AlignLeftMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-left/props.d.ts: -------------------------------------------------------------------------------- 1 | export type AlignLeftMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-right/align-right.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { AlignRightMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-right/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as AlignRightMenu } from './align-right.vue'; 2 | export * from './props'; 3 | export { AlignRightMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/align-right/props.d.ts: -------------------------------------------------------------------------------- 1 | export type AlignRightMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/attachment/attachment.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { AttachmentMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | tabs: { 5 | data: ("remote" | "upload")[]; 6 | default: "remote" | "upload"; 7 | }; 8 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 9 | export default _default; 10 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/attachment/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as AttachmentMenu } from './attachment.vue'; 2 | export * from './props'; 3 | export { AttachmentMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/attachment/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type AttachmentMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * tabs配置 9 | */ 10 | tabs?: { 11 | data: ('remote' | 'upload')[]; 12 | default: 'remote' | 'upload'; 13 | }; 14 | /** 15 | * 浮层属性 16 | */ 17 | popoverProps?: MenuPropsType['popoverProps']; 18 | /** 19 | * 附件logo图片地址 20 | */ 21 | iconUrl?: string; 22 | /** 23 | * 自定义上传方法 24 | */ 25 | customUpload?: (file: File) => string | Promise; 26 | }; 27 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/back-color/back-color.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { BackColorMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | colors: string[]; 5 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 6 | export default _default; 7 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/back-color/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as BackColorMenu } from './back-color.vue'; 2 | export * from './props'; 3 | export { BackColorMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/back-color/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type BackColorMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 颜色数组 9 | */ 10 | colors?: string[]; 11 | /** 12 | * 浮层属性 13 | */ 14 | popoverProps?: MenuPropsType['popoverProps']; 15 | }; 16 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/blockquote/blockquote.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { BlockquoteMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/blockquote/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as BlockquoteMenu } from './blockquote.vue'; 2 | export * from './props'; 3 | export { BlockquoteMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/blockquote/props.d.ts: -------------------------------------------------------------------------------- 1 | export type BlockquoteMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/bold/bold.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { BoldMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/bold/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as BoldMenu } from './bold.vue'; 2 | export * from './props'; 3 | export { BoldMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/bold/props.d.ts: -------------------------------------------------------------------------------- 1 | export type BoldMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/clear-format/clear-format.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { ClearFormatMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/clear-format/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as ClearFormatMenu } from './clear-format.vue'; 2 | export * from './props'; 3 | export { ClearFormatMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/clear-format/props.d.ts: -------------------------------------------------------------------------------- 1 | export type ClearFormatMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/code-block/code-block-languages.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { HljsLanguageType } from '@kaitify/core'; 2 | import { CodeBlockLanguagesMenuPropsType } from './props'; 3 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 4 | disabled: boolean; 5 | languages: HljsLanguageType[]; 6 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 7 | export default _default; 8 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/code-block/code-block.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { CodeBlockMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/code-block/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as CodeBlockMenu } from './code-block.vue'; 2 | import { default as CodeBlockLanguagesMenu } from './code-block-languages.vue'; 3 | export * from './props'; 4 | export { CodeBlockMenu, CodeBlockLanguagesMenu }; 5 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/code-block/props.d.ts: -------------------------------------------------------------------------------- 1 | import { HljsLanguageType } from '@kaitify/core'; 2 | import { MenuDataType, MenuPropsType } from '../../props'; 3 | export type CodeBlockMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean; 8 | /** 9 | * 快捷键设置 10 | */ 11 | shortcut?: (e: KeyboardEvent) => boolean; 12 | }; 13 | export type CodeBlockLanguagesMenuPropsType = { 14 | /** 15 | * 是否禁用 16 | */ 17 | disabled?: boolean; 18 | /** 19 | * 语言列表 20 | */ 21 | languages?: HljsLanguageType[]; 22 | /** 23 | * 浮层属性 24 | */ 25 | popoverProps?: MenuPropsType['popoverProps']; 26 | /** 27 | * 快捷键设置 28 | */ 29 | shortcut?: { 30 | [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean; 31 | }; 32 | }; 33 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/code/code.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { CodeMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/code/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as CodeMenu } from './code.vue'; 2 | export * from './props'; 3 | export { CodeMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/code/props.d.ts: -------------------------------------------------------------------------------- 1 | export type CodeMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/color/color.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { ColorMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | colors: string[]; 5 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 6 | export default _default; 7 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/color/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as ColorMenu } from './color.vue'; 2 | export * from './props'; 3 | export { ColorMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/color/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type ColorMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 颜色数组 9 | */ 10 | colors?: string[]; 11 | /** 12 | * 浮层属性 13 | */ 14 | popoverProps?: MenuPropsType['popoverProps']; 15 | }; 16 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/decrease-indent/decrease-indent.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { DecreaseIndentMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/decrease-indent/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as DecreaseIndentMenu } from './decrease-indent.vue'; 2 | export * from './props'; 3 | export { DecreaseIndentMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/decrease-indent/props.d.ts: -------------------------------------------------------------------------------- 1 | export type DecreaseIndentMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/font-family/font-family.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { FontFamilyMenuPropsType } from './props'; 2 | import { MenuDataType } from '../../props'; 3 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 4 | data: MenuDataType[]; 5 | disabled: boolean; 6 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 7 | export default _default; 8 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/font-family/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as FontFamilyMenu } from './font-family.vue'; 2 | export * from './props'; 3 | export { FontFamilyMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/font-family/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuDataType, MenuPropsType } from '../../props'; 2 | export type FontFamilyMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 选项数组 9 | */ 10 | data?: MenuDataType[]; 11 | /** 12 | * 浮层属性 13 | */ 14 | popoverProps?: MenuPropsType['popoverProps']; 15 | /** 16 | * 快捷键设置 17 | */ 18 | shortcut?: { 19 | [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean; 20 | }; 21 | }; 22 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/font-size/font-size.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { FontSizeMenuPropsType } from './props'; 2 | import { MenuDataType } from '../../props'; 3 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 4 | data: MenuDataType[]; 5 | disabled: boolean; 6 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 7 | export default _default; 8 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/font-size/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as FontSizeMenu } from './font-size.vue'; 2 | export * from './props'; 3 | export { FontSizeMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/font-size/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuDataType, MenuPropsType } from '../../props'; 2 | export type FontSizeMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 选项数组 9 | */ 10 | data?: MenuDataType[]; 11 | /** 12 | * 浮层属性 13 | */ 14 | popoverProps?: MenuPropsType['popoverProps']; 15 | /** 16 | * 快捷键设置 17 | */ 18 | shortcut?: { 19 | [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean; 20 | }; 21 | }; 22 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/full-screen/full-screen.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { FullScreenMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | zIndex: number; 5 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 6 | export default _default; 7 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/full-screen/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as FullScreenMenu } from './full-screen.vue'; 2 | export * from './props'; 3 | export { FullScreenMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/full-screen/props.d.ts: -------------------------------------------------------------------------------- 1 | export type FullScreenMenuPropsType = { 2 | /** 3 | * 指定需要设置全屏的dom的选择器 4 | */ 5 | target: string; 6 | /** 7 | * 全屏层级 8 | */ 9 | zIndex?: number; 10 | /** 11 | * 是否禁用 12 | */ 13 | disabled?: boolean; 14 | /** 15 | * 快捷键设置 16 | */ 17 | shortcut?: (e: KeyboardEvent) => boolean; 18 | }; 19 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/heading/heading.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { HeadingMenuPropsType } from './props'; 2 | import { MenuDataType } from '../../props'; 3 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 4 | data: MenuDataType[]; 5 | disabled: boolean; 6 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 7 | export default _default; 8 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/heading/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as HeadingMenu } from './heading.vue'; 2 | export * from './props'; 3 | export { HeadingMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/heading/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuDataType, MenuPropsType } from '../../props'; 2 | export type HeadingMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 选项数组 9 | */ 10 | data?: MenuDataType[]; 11 | /** 12 | * 浮层属性 13 | */ 14 | popoverProps?: MenuPropsType['popoverProps']; 15 | /** 16 | * 快捷键设置 17 | */ 18 | shortcut?: { 19 | [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean; 20 | }; 21 | }; 22 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/horizontal/horizontal.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { HorizontalMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/horizontal/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as HorizontalMenu } from './horizontal.vue'; 2 | export * from './props'; 3 | export { HorizontalMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/horizontal/props.d.ts: -------------------------------------------------------------------------------- 1 | export type HorizontalMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/image/image.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { ImageMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | tabs: { 5 | data: ("remote" | "upload")[]; 6 | default: "remote" | "upload"; 7 | }; 8 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 9 | export default _default; 10 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/image/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as ImageMenu } from './image.vue'; 2 | export * from './props'; 3 | export { ImageMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/image/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type ImageMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 初始图片宽度 9 | */ 10 | width?: string | number; 11 | /** 12 | * tabs配置 13 | */ 14 | tabs?: { 15 | data: ('remote' | 'upload')[]; 16 | default: 'remote' | 'upload'; 17 | }; 18 | /** 19 | * 自定义上传方法 20 | */ 21 | customUpload?: (file: File) => string | Promise; 22 | /** 23 | * 浮层属性 24 | */ 25 | popoverProps?: MenuPropsType['popoverProps']; 26 | }; 27 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/increase-indent/increase-indent.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { IncreaseIndentMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/increase-indent/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as IncreaseIndentMenu } from './increase-indent.vue'; 2 | export * from './props'; 3 | export { IncreaseIndentMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/increase-indent/props.d.ts: -------------------------------------------------------------------------------- 1 | export type IncreaseIndentMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/index.d.ts: -------------------------------------------------------------------------------- 1 | export * from './align-left'; 2 | export * from './align-center'; 3 | export * from './align-right'; 4 | export * from './align-justify'; 5 | export * from './attachment'; 6 | export * from './back-color'; 7 | export * from './bold'; 8 | export * from './blockquote'; 9 | export * from './code'; 10 | export * from './code-block'; 11 | export * from './color'; 12 | export * from './font-family'; 13 | export * from './font-size'; 14 | export * from './heading'; 15 | export * from './undo'; 16 | export * from './redo'; 17 | export * from './horizontal'; 18 | export * from './image'; 19 | export * from './increase-indent'; 20 | export * from './decrease-indent'; 21 | export * from './italic'; 22 | export * from './line-height'; 23 | export * from './link'; 24 | export * from './ordered-list'; 25 | export * from './unordered-list'; 26 | export * from './math'; 27 | export * from './strikethrough'; 28 | export * from './subscript'; 29 | export * from './superscript'; 30 | export * from './table'; 31 | export * from './underline'; 32 | export * from './video'; 33 | export * from './task'; 34 | export * from './wrap-up'; 35 | export * from './wrap-down'; 36 | export * from './clear-format'; 37 | export * from './full-screen'; 38 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/italic/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as ItalicMenu } from './italic.vue'; 2 | export * from './props'; 3 | export { ItalicMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/italic/italic.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { ItalicMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/italic/props.d.ts: -------------------------------------------------------------------------------- 1 | export type ItalicMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/line-height/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as LineHeightMenu } from './line-height.vue'; 2 | export * from './props'; 3 | export { LineHeightMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/line-height/line-height.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { LineHeightMenuPropsType } from './props'; 2 | import { MenuDataType } from '../../props'; 3 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 4 | data: MenuDataType[]; 5 | defaultValue: string | number; 6 | disabled: boolean; 7 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 8 | export default _default; 9 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/line-height/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuDataType, MenuPropsType } from '../../props'; 2 | export type LineHeightMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 选项数组 9 | */ 10 | data?: MenuDataType[]; 11 | /** 12 | * 默认行高数值 13 | */ 14 | defaultValue?: string | number; 15 | /** 16 | * 浮层属性 17 | */ 18 | popoverProps?: MenuPropsType['popoverProps']; 19 | /** 20 | * 快捷键设置 21 | */ 22 | shortcut?: { 23 | [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean; 24 | }; 25 | }; 26 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/link/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as LinkMenu } from './link.vue'; 2 | import { default as LinkUnsetMenu } from './link-unset.vue'; 3 | export * from './props'; 4 | export { LinkMenu, LinkUnsetMenu }; 5 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/link/link-unset.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { LinkUnsetMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/link/link.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { LinkMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/link/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type LinkMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 浮层属性 9 | */ 10 | popoverProps?: MenuPropsType['popoverProps']; 11 | }; 12 | export type LinkUnsetMenuPropsType = { 13 | /** 14 | * 是否禁用 15 | */ 16 | disabled?: boolean; 17 | /** 18 | * 快捷键设置 19 | */ 20 | shortcut?: (e: KeyboardEvent) => boolean; 21 | }; 22 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/math/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as MathMenu } from './math.vue'; 2 | export * from './props'; 3 | export { MathMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/math/math.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { MathMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/math/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type MathMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 浮层属性 9 | */ 10 | popoverProps?: MenuPropsType['popoverProps']; 11 | }; 12 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/ordered-list/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as OrderedListMenu } from './ordered-list.vue'; 2 | export * from './props'; 3 | export { OrderedListMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/ordered-list/ordered-list.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { OrderedListMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/ordered-list/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type OrderedListMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 浮层属性 9 | */ 10 | popoverProps?: MenuPropsType['popoverProps']; 11 | }; 12 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/redo/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as RedoMenu } from './redo.vue'; 2 | export * from './props'; 3 | export { RedoMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/redo/props.d.ts: -------------------------------------------------------------------------------- 1 | export type RedoMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | }; 7 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/redo/redo.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { RedoMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/strikethrough/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as StrikethroughMenu } from './strikethrough.vue'; 2 | export * from './props'; 3 | export { StrikethroughMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/strikethrough/props.d.ts: -------------------------------------------------------------------------------- 1 | export type StrikethroughMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/strikethrough/strikethrough.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { StrikethroughMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/subscript/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as SubscriptMenu } from './subscript.vue'; 2 | export * from './props'; 3 | export { SubscriptMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/subscript/props.d.ts: -------------------------------------------------------------------------------- 1 | export type SubscriptMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/subscript/subscript.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { SubscriptMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/superscript/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as SuperscriptMenu } from './superscript.vue'; 2 | export * from './props'; 3 | export { SuperscriptMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/superscript/props.d.ts: -------------------------------------------------------------------------------- 1 | export type SuperscriptMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/superscript/superscript.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { SuperscriptMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/table/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as TableMenu } from './table.vue'; 2 | import { default as TableUnsetMenu } from './table-unset.vue'; 3 | import { default as TableDeleteRowMenu } from './table-delete-row.vue'; 4 | import { default as TableDeleteColumnMenu } from './table-delete-column.vue'; 5 | import { default as TableAddRowMenu } from './table-add-row.vue'; 6 | import { default as TableAddColumnMenu } from './table-add-column.vue'; 7 | import { default as TableMergeCellMenu } from './table-merge-cell.vue'; 8 | export * from './props'; 9 | export { TableMenu, TableUnsetMenu, TableDeleteRowMenu, TableDeleteColumnMenu, TableAddRowMenu, TableAddColumnMenu, TableMergeCellMenu }; 10 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/table/table-add-column.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TableAddColumnMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/table/table-add-row.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TableAddRowMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/table/table-delete-column.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TableDeleteColumnMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/table/table-delete-row.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TableDeleteRowMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/table/table-merge-cell.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TableMergeCellMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/table/table-unset.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TableUnsetMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/table/table.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TableMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | maxRows: number; 5 | maxColumns: number; 6 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 7 | export default _default; 8 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/task/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as TaskMenu } from './task.vue'; 2 | export * from './props'; 3 | export { TaskMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/task/props.d.ts: -------------------------------------------------------------------------------- 1 | export type TaskMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/task/task.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { TaskMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/underline/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as UnderlineMenu } from './underline.vue'; 2 | export * from './props'; 3 | export { UnderlineMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/underline/props.d.ts: -------------------------------------------------------------------------------- 1 | export type UnderlineMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean; 10 | }; 11 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/underline/underline.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { UnderlineMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/undo/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as UndoMenu } from './undo.vue'; 2 | export * from './props'; 3 | export { UndoMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/undo/props.d.ts: -------------------------------------------------------------------------------- 1 | export type UndoMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean; 6 | }; 7 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/undo/undo.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { UndoMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/unordered-list/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as UnorderedListMenu } from './unordered-list.vue'; 2 | export * from './props'; 3 | export { UnorderedListMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/unordered-list/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type UnorderedListMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 浮层属性 9 | */ 10 | popoverProps?: MenuPropsType['popoverProps']; 11 | }; 12 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/unordered-list/unordered-list.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { UnorderedListMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/video/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as VideoMenu } from './video.vue'; 2 | import { default as VideoControlsMenu } from './video-controls.vue'; 3 | import { default as VideoMutedMenu } from './video-muted.vue'; 4 | import { default as VideoLoopMenu } from './video-loop.vue'; 5 | export * from './props'; 6 | export { VideoMenu, VideoControlsMenu, VideoMutedMenu, VideoLoopMenu }; 7 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/video/props.d.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '../../props'; 2 | export type VideoMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 初始视频宽度 9 | */ 10 | width?: string | number; 11 | /** 12 | * tabs配置 13 | */ 14 | tabs?: { 15 | data: ('remote' | 'upload')[]; 16 | default: 'remote' | 'upload'; 17 | }; 18 | /** 19 | * 自定义上传方法 20 | */ 21 | customUpload?: (file: File) => string | Promise; 22 | /** 23 | * 浮层属性 24 | */ 25 | popoverProps?: MenuPropsType['popoverProps']; 26 | }; 27 | export type VideoControlsMenuPropsType = { 28 | /** 29 | * 是否禁用 30 | */ 31 | disabled?: boolean; 32 | /** 33 | * 快捷键设置 34 | */ 35 | shortcut?: (e: KeyboardEvent) => boolean; 36 | }; 37 | export type VideoMutedMenuPropsType = { 38 | /** 39 | * 是否禁用 40 | */ 41 | disabled?: boolean; 42 | /** 43 | * 快捷键设置 44 | */ 45 | shortcut?: (e: KeyboardEvent) => boolean; 46 | }; 47 | export type VideoLoopMenuPropsType = { 48 | /** 49 | * 是否禁用 50 | */ 51 | disabled?: boolean; 52 | /** 53 | * 快捷键设置 54 | */ 55 | shortcut?: (e: KeyboardEvent) => boolean; 56 | }; 57 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/video/video-controls.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { VideoControlsMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/video/video-loop.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { VideoLoopMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/video/video-muted.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { VideoMutedMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/video/video.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { VideoMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | tabs: { 5 | data: ("remote" | "upload")[]; 6 | default: "remote" | "upload"; 7 | }; 8 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 9 | export default _default; 10 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/wrap-down/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as WrapDownMenu } from './wrap-down.vue'; 2 | export * from './props'; 3 | export { WrapDownMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/wrap-down/props.d.ts: -------------------------------------------------------------------------------- 1 | import { KNodeMatchOptionType } from '../../../../index'; 2 | export type WrapDownMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 指定换行的块节点条件 9 | */ 10 | match: KNodeMatchOptionType; 11 | /** 12 | * 快捷键设置 13 | */ 14 | shortcut?: (e: KeyboardEvent) => boolean; 15 | }; 16 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/wrap-down/wrap-down.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { WrapDownMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/wrap-up/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as WrapUpMenu } from './wrap-up.vue'; 2 | export * from './props'; 3 | export { WrapUpMenu }; 4 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/wrap-up/props.d.ts: -------------------------------------------------------------------------------- 1 | import { KNodeMatchOptionType } from '../../../../index'; 2 | export type WrapUpMenuPropsType = { 3 | /** 4 | * 是否禁用 5 | */ 6 | disabled?: boolean; 7 | /** 8 | * 指定换行的块节点条件 9 | */ 10 | match: KNodeMatchOptionType; 11 | /** 12 | * 快捷键设置 13 | */ 14 | shortcut?: (e: KeyboardEvent) => boolean; 15 | }; 16 | -------------------------------------------------------------------------------- /lib/editor/menu/built-in/wrap-up/wrap-up.vue.d.ts: -------------------------------------------------------------------------------- 1 | import { WrapUpMenuPropsType } from './props'; 2 | declare const _default: import('vue').DefineComponent & Readonly<{}>, { 3 | disabled: boolean; 4 | }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; 5 | export default _default; 6 | -------------------------------------------------------------------------------- /lib/editor/menu/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Menu } from './menu.vue'; 2 | export * from './props'; 3 | export * from './built-in'; 4 | export { Menu }; 5 | -------------------------------------------------------------------------------- /lib/editor/wrapper/index.d.ts: -------------------------------------------------------------------------------- 1 | import { default as Wrapper } from './wrapper.vue'; 2 | export * from './props'; 3 | export { Wrapper }; 4 | -------------------------------------------------------------------------------- /lib/editor/wrapper/render.d.ts: -------------------------------------------------------------------------------- 1 | import { Editor, KNodeRenderOptionType } from '@kaitify/core'; 2 | /** 3 | * 生成VNode 4 | */ 5 | export declare const createVNode: (options: KNodeRenderOptionType) => import('vue').VNode; 8 | /** 9 | * 创建VNode数组 10 | */ 11 | export declare const createVNodes: (editor: Editor) => import('vue').VNode[]; 14 | -------------------------------------------------------------------------------- /lib/index.d.ts: -------------------------------------------------------------------------------- 1 | export * from '@kaitify/core'; 2 | export * from './core/divider'; 3 | export * from './core/tabs'; 4 | export * from './core/checkbox'; 5 | export * from './core/icon'; 6 | export * from './editor/wrapper'; 7 | export * from './editor/menu'; 8 | -------------------------------------------------------------------------------- /lib/locale/en-us.d.ts: -------------------------------------------------------------------------------- 1 | declare const _default: { 2 | 本地上传: string; 3 | 远程地址: string; 4 | 附件名称: string; 5 | 附件地址: string; 6 | 附件: string; 7 | 插入: string; 8 | 更新: string; 9 | 默认颜色: string; 10 | 默认字体: string; 11 | 默认字号: string; 12 | 默认行高: string; 13 | 正文: string; 14 | 图片名称: string; 15 | 图片地址: string; 16 | 图片: string; 17 | 链接地址: string; 18 | 新窗口打开: string; 19 | 链接文字: string; 20 | 是否自动播放: string; 21 | 视频地址: string; 22 | 输入Latex数学公式: string; 23 | }; 24 | export default _default; 25 | -------------------------------------------------------------------------------- /lib/locale/index.d.ts: -------------------------------------------------------------------------------- 1 | export type LocaleType = 'zh-cn' | 'en-us'; 2 | export declare const translate: (locale: LocaleType, key: string) => string; 3 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@kaitify/vue", 3 | "version": "0.0.1-beta.30", 4 | "private": false, 5 | "type": "module", 6 | "author": "so-better", 7 | "main": "lib/kaitify-vue.umd.js", 8 | "module": "lib/kaitify-vue.es.js", 9 | "types": "lib/index.d.ts", 10 | "license": "MIT", 11 | "description": "基于@kaitify/core开发的vue富文本编辑器核心库", 12 | "scripts": { 13 | "dev": "vite", 14 | "lib": "vue-tsc && vite build", 15 | "docs:dev": "vitepress dev docs", 16 | "docs:build": "vitepress build docs" 17 | }, 18 | "dependencies": { 19 | "@iconify/vue": "^4.3.0", 20 | "@kaitify/core": "^0.0.1-beta.32", 21 | "@popperjs/core": "^2.11.8", 22 | "dap-util": "^1.6.0", 23 | "vue": "^3.3.13" 24 | }, 25 | "devDependencies": { 26 | "@types/node": "^20.11.24", 27 | "@vitejs/plugin-vue": "^5.0.4", 28 | "less": "^3.0.4", 29 | "less-loader": "^5.0.0", 30 | "terser": "^5.16.9", 31 | "typescript": "^5.6.3", 32 | "vite": "^5.4.10", 33 | "vite-plugin-css-injected-by-js": "^3.5.1", 34 | "vite-plugin-dts": "^4.3.0", 35 | "vitepress": "^1.5.0", 36 | "vue-tsc": "^2.1.10" 37 | }, 38 | "browserslist": [ 39 | "> 1%", 40 | "last 2 versions", 41 | "not dead" 42 | ], 43 | "repository": { 44 | "type": "git", 45 | "url": "https://github.com/so-better/kaitify-vue" 46 | }, 47 | "publishConfig": { 48 | "access": "public", 49 | "registry": "https://registry.npmjs.org" 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /src/Editor/bubble/index.ts: -------------------------------------------------------------------------------- 1 | import Bubble from './bubble.vue' 2 | export * from './props' 3 | export { Bubble } 4 | -------------------------------------------------------------------------------- /src/Editor/bubble/props.ts: -------------------------------------------------------------------------------- 1 | import { KNodeMatchOptionType } from '@/index' 2 | 3 | /** 4 | * 气泡组件的属性类型 5 | */ 6 | export type BubblePropsType = { 7 | /** 8 | * 是否显示 9 | */ 10 | visible: boolean 11 | /** 12 | * 层级 13 | */ 14 | zIndex?: number 15 | /** 16 | * 指定条件，每次更新气泡位置时会光标是否在符合条件的节点下，如果符合则根据该节点的真实dom进行定位 17 | */ 18 | match?: KNodeMatchOptionType 19 | } 20 | 21 | /** 22 | * 气泡组件的事件类型 23 | */ 24 | export type BubbleEmitsType = { 25 | /** 26 | * 气泡显示前触发的事件 27 | */ 28 | (e: 'show', value: Element): void 29 | /** 30 | * 气泡显示时触发的事件 31 | */ 32 | (e: 'showing', value: Element): void 33 | /** 34 | * 气泡显示后触发的事件 35 | */ 36 | (e: 'shown', value: Element): void 37 | /** 38 | * 气泡隐藏前触发的事件 39 | */ 40 | (e: 'hide', value: Element): void 41 | /** 42 | * 气泡隐藏时触发的事件 43 | */ 44 | (e: 'hiding', value: Element): void 45 | /** 46 | * 气泡隐藏后触发的事件 47 | */ 48 | (e: 'hidden', value: Element): void 49 | } 50 | -------------------------------------------------------------------------------- /src/Editor/bubble/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-bubble { 2 | display: block; 3 | background: var(--kaitify-background-color); 4 | border: 1px solid var(--kaitify-border-color); 5 | color: var(--kaitify-font-color); 6 | font-size: var(--kaitify-font-size); 7 | font-family: var(--kaitify-font-family); 8 | line-height: var(--kaitify-line-height); 9 | border-radius: var(--kaitify-border-radius); 10 | box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.06); 11 | } 12 | 13 | .kaitify-bubble-enter-from, 14 | .kaitify-bubble-leave-to { 15 | opacity: 0; 16 | } 17 | .kaitify-bubble-enter-active, 18 | .kaitify-bubble-leave-active { 19 | transition: opacity 50ms linear; 20 | } 21 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-center/align-center.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-center/index.ts: -------------------------------------------------------------------------------- 1 | import AlignCenterMenu from './align-center.vue' 2 | export * from './props' 3 | export { AlignCenterMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-center/props.ts: -------------------------------------------------------------------------------- 1 | export type AlignCenterMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-justify/align-justify.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-justify/index.ts: -------------------------------------------------------------------------------- 1 | import AlignJustifyMenu from './align-justify.vue' 2 | export * from './props' 3 | export { AlignJustifyMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-justify/props.ts: -------------------------------------------------------------------------------- 1 | export type AlignJustifyMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-left/align-left.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-left/index.ts: -------------------------------------------------------------------------------- 1 | import AlignLeftMenu from './align-left.vue' 2 | export * from './props' 3 | export { AlignLeftMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-left/props.ts: -------------------------------------------------------------------------------- 1 | export type AlignLeftMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-right/align-right.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-right/index.ts: -------------------------------------------------------------------------------- 1 | import AlignRightMenu from './align-right.vue' 2 | export * from './props' 3 | export { AlignRightMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/align-right/props.ts: -------------------------------------------------------------------------------- 1 | export type AlignRightMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/attachment/index.ts: -------------------------------------------------------------------------------- 1 | import AttachmentMenu from './attachment.vue' 2 | export * from './props' 3 | export { AttachmentMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/attachment/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type AttachmentMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * tabs配置 10 | */ 11 | tabs?: { 12 | data: ('remote' | 'upload')[] 13 | default: 'remote' | 'upload' 14 | } 15 | /** 16 | * 浮层属性 17 | */ 18 | popoverProps?: MenuPropsType['popoverProps'] 19 | /** 20 | * 附件logo图片地址 21 | */ 22 | iconUrl?: string 23 | /** 24 | * 自定义上传方法 25 | */ 26 | customUpload?: (file: File) => string | Promise 27 | } 28 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/back-color/index.ts: -------------------------------------------------------------------------------- 1 | import BackColorMenu from './back-color.vue' 2 | export * from './props' 3 | export { BackColorMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/back-color/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type BackColorMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 颜色数组 10 | */ 11 | colors?: string[] 12 | /** 13 | * 浮层属性 14 | */ 15 | popoverProps?: MenuPropsType['popoverProps'] 16 | } 17 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/back-color/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-colors-panel { 2 | display: block; 3 | width: 100%; 4 | padding: var(--kaitify-small-padding); 5 | 6 | .kaitify-colors-header { 7 | display: block; 8 | width: 100%; 9 | padding-bottom: var(--kaitify-small-padding); 10 | margin-bottom: var(--kaitify-margin); 11 | border-bottom: 1px solid var(--kaitify-border-color); 12 | 13 | .kaitify-colors-header-text { 14 | margin-left: 10px; 15 | } 16 | } 17 | 18 | .kaitify-colors-content { 19 | display: grid; 20 | width: 100%; 21 | grid-template-columns: repeat(8, 1fr); 22 | gap: 2px; 23 | 24 | .kaitify-colors-el { 25 | padding: 2px; 26 | border: 1px solid transparent; 27 | border-radius: 1px; 28 | 29 | &.kaitify-color-el-active { 30 | border-color: var(--kaitify-theme); 31 | } 32 | 33 | & > div { 34 | display: block; 35 | width: 16px; 36 | height: 16px; 37 | border: 1px solid var(--kaitify-border-color); 38 | border-radius: 1px; 39 | transition: all 300ms; 40 | 41 | &:hover { 42 | cursor: pointer; 43 | transform: scale(1.2); 44 | } 45 | } 46 | } 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/blockquote/blockquote.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/blockquote/index.ts: -------------------------------------------------------------------------------- 1 | import BlockquoteMenu from './blockquote.vue' 2 | export * from './props' 3 | export { BlockquoteMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/blockquote/props.ts: -------------------------------------------------------------------------------- 1 | export type BlockquoteMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/bold/index.ts: -------------------------------------------------------------------------------- 1 | import BoldMenu from './bold.vue' 2 | export * from './props' 3 | export { BoldMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/bold/props.ts: -------------------------------------------------------------------------------- 1 | export type BoldMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/clear-format/clear-format.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/clear-format/index.ts: -------------------------------------------------------------------------------- 1 | import ClearFormatMenu from './clear-format.vue' 2 | export * from './props' 3 | export { ClearFormatMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/clear-format/props.ts: -------------------------------------------------------------------------------- 1 | export type ClearFormatMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/code-block/code-block.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/code-block/index.ts: -------------------------------------------------------------------------------- 1 | import CodeBlockMenu from './code-block.vue' 2 | import CodeBlockLanguagesMenu from './code-block-languages.vue' 3 | export * from './props' 4 | export { CodeBlockMenu, CodeBlockLanguagesMenu } 5 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/code-block/props.ts: -------------------------------------------------------------------------------- 1 | import { HljsLanguageType } from '@kaitify/core' 2 | import { MenuDataType, MenuPropsType } from '@/editor/menu/props' 3 | 4 | export type CodeBlockMenuPropsType = { 5 | /** 6 | * 是否禁用 7 | */ 8 | disabled?: boolean 9 | /** 10 | * 快捷键设置 11 | */ 12 | shortcut?: (e: KeyboardEvent) => boolean 13 | } 14 | 15 | export type CodeBlockLanguagesMenuPropsType = { 16 | /** 17 | * 是否禁用 18 | */ 19 | disabled?: boolean 20 | /** 21 | * 语言列表 22 | */ 23 | languages?: HljsLanguageType[] 24 | /** 25 | * 浮层属性 26 | */ 27 | popoverProps?: MenuPropsType['popoverProps'] 28 | /** 29 | * 快捷键设置 30 | */ 31 | shortcut?: { [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean } 32 | } 33 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/code/index.ts: -------------------------------------------------------------------------------- 1 | import CodeMenu from './code.vue' 2 | export * from './props' 3 | export { CodeMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/code/props.ts: -------------------------------------------------------------------------------- 1 | export type CodeMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/color/index.ts: -------------------------------------------------------------------------------- 1 | import ColorMenu from './color.vue' 2 | export * from './props' 3 | export { ColorMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/color/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type ColorMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 颜色数组 10 | */ 11 | colors?: string[] 12 | /** 13 | * 浮层属性 14 | */ 15 | popoverProps?: MenuPropsType['popoverProps'] 16 | } 17 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/color/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-colors-panel { 2 | display: block; 3 | width: 100%; 4 | padding: var(--kaitify-small-padding); 5 | 6 | .kaitify-colors-header { 7 | display: block; 8 | width: 100%; 9 | padding-bottom: var(--kaitify-small-padding); 10 | margin-bottom: var(--kaitify-margin); 11 | border-bottom: 1px solid var(--kaitify-border-color); 12 | 13 | .kaitify-colors-header-text { 14 | margin-left: 10px; 15 | } 16 | } 17 | 18 | .kaitify-colors-content { 19 | display: grid; 20 | width: 100%; 21 | grid-template-columns: repeat(8, 1fr); 22 | gap: 2px; 23 | 24 | .kaitify-colors-el { 25 | padding: 2px; 26 | border: 1px solid transparent; 27 | border-radius: 1px; 28 | 29 | &.kaitify-color-el-active { 30 | border-color: var(--kaitify-theme); 31 | } 32 | 33 | & > div { 34 | display: block; 35 | width: 16px; 36 | height: 16px; 37 | border: 1px solid var(--kaitify-border-color); 38 | border-radius: 1px; 39 | transition: all 300ms; 40 | 41 | &:hover { 42 | cursor: pointer; 43 | transform: scale(1.2); 44 | } 45 | } 46 | } 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/decrease-indent/decrease-indent.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/decrease-indent/index.ts: -------------------------------------------------------------------------------- 1 | import DecreaseIndentMenu from './decrease-indent.vue' 2 | export * from './props' 3 | export { DecreaseIndentMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/decrease-indent/props.ts: -------------------------------------------------------------------------------- 1 | export type DecreaseIndentMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/font-family/index.ts: -------------------------------------------------------------------------------- 1 | import FontFamilyMenu from './font-family.vue' 2 | export * from './props' 3 | export { FontFamilyMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/font-family/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuDataType, MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type FontFamilyMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 选项数组 10 | */ 11 | data?: MenuDataType[] 12 | /** 13 | * 浮层属性 14 | */ 15 | popoverProps?: MenuPropsType['popoverProps'] 16 | /** 17 | * 快捷键设置 18 | */ 19 | shortcut?: { [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean } 20 | } 21 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/font-size/index.ts: -------------------------------------------------------------------------------- 1 | import FontSizeMenu from './font-size.vue' 2 | export * from './props' 3 | export { FontSizeMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/font-size/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuDataType, MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type FontSizeMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 选项数组 10 | */ 11 | data?: MenuDataType[] 12 | /** 13 | * 浮层属性 14 | */ 15 | popoverProps?: MenuPropsType['popoverProps'] 16 | /** 17 | * 快捷键设置 18 | */ 19 | shortcut?: { [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean } 20 | } 21 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/full-screen/index.ts: -------------------------------------------------------------------------------- 1 | import FullScreenMenu from './full-screen.vue' 2 | export * from './props' 3 | export { FullScreenMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/full-screen/props.ts: -------------------------------------------------------------------------------- 1 | export type FullScreenMenuPropsType = { 2 | /** 3 | * 指定需要设置全屏的dom的选择器 4 | */ 5 | target: string 6 | /** 7 | * 全屏层级 8 | */ 9 | zIndex?: number 10 | /** 11 | * 是否禁用 12 | */ 13 | disabled?: boolean 14 | /** 15 | * 快捷键设置 16 | */ 17 | shortcut?: (e: KeyboardEvent) => boolean 18 | } 19 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/heading/index.ts: -------------------------------------------------------------------------------- 1 | import HeadingMenu from './heading.vue' 2 | export * from './props' 3 | export { HeadingMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/heading/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuDataType, MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type HeadingMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 选项数组 10 | */ 11 | data?: MenuDataType[] 12 | /** 13 | * 浮层属性 14 | */ 15 | popoverProps?: MenuPropsType['popoverProps'] 16 | /** 17 | * 快捷键设置 18 | */ 19 | shortcut?: { [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean } 20 | } 21 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/horizontal/horizontal.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/horizontal/index.ts: -------------------------------------------------------------------------------- 1 | import HorizontalMenu from './horizontal.vue' 2 | export * from './props' 3 | export { HorizontalMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/horizontal/props.ts: -------------------------------------------------------------------------------- 1 | export type HorizontalMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/image/index.ts: -------------------------------------------------------------------------------- 1 | import ImageMenu from './image.vue' 2 | export * from './props' 3 | export { ImageMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/image/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type ImageMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 初始图片宽度 10 | */ 11 | width?: string | number 12 | /** 13 | * tabs配置 14 | */ 15 | tabs?: { 16 | data: ('remote' | 'upload')[] 17 | default: 'remote' | 'upload' 18 | } 19 | /** 20 | * 自定义上传方法 21 | */ 22 | customUpload?: (file: File) => string | Promise 23 | /** 24 | * 浮层属性 25 | */ 26 | popoverProps?: MenuPropsType['popoverProps'] 27 | } 28 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/increase-indent/increase-indent.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/increase-indent/index.ts: -------------------------------------------------------------------------------- 1 | import IncreaseIndentMenu from './increase-indent.vue' 2 | export * from './props' 3 | export { IncreaseIndentMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/increase-indent/props.ts: -------------------------------------------------------------------------------- 1 | export type IncreaseIndentMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/index.ts: -------------------------------------------------------------------------------- 1 | export * from './align-left' 2 | export * from './align-center' 3 | export * from './align-right' 4 | export * from './align-justify' 5 | export * from './attachment' 6 | export * from './back-color' 7 | export * from './bold' 8 | export * from './blockquote' 9 | export * from './code' 10 | export * from './code-block' 11 | export * from './color' 12 | export * from './font-family' 13 | export * from './font-size' 14 | export * from './heading' 15 | export * from './undo' 16 | export * from './redo' 17 | export * from './horizontal' 18 | export * from './image' 19 | export * from './increase-indent' 20 | export * from './decrease-indent' 21 | export * from './italic' 22 | export * from './line-height' 23 | export * from './link' 24 | export * from './ordered-list' 25 | export * from './unordered-list' 26 | export * from './math' 27 | export * from './strikethrough' 28 | export * from './subscript' 29 | export * from './superscript' 30 | export * from './table' 31 | export * from './underline' 32 | export * from './video' 33 | export * from './task' 34 | export * from './wrap-up' 35 | export * from './wrap-down' 36 | export * from './clear-format' 37 | export * from './full-screen' 38 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/italic/index.ts: -------------------------------------------------------------------------------- 1 | import ItalicMenu from './italic.vue' 2 | export * from './props' 3 | export { ItalicMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/italic/props.ts: -------------------------------------------------------------------------------- 1 | export type ItalicMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/line-height/index.ts: -------------------------------------------------------------------------------- 1 | import LineHeightMenu from './line-height.vue' 2 | export * from './props' 3 | export { LineHeightMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/line-height/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuDataType, MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type LineHeightMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 选项数组 10 | */ 11 | data?: MenuDataType[] 12 | /** 13 | * 默认行高数值 14 | */ 15 | defaultValue?: string | number 16 | /** 17 | * 浮层属性 18 | */ 19 | popoverProps?: MenuPropsType['popoverProps'] 20 | /** 21 | * 快捷键设置 22 | */ 23 | shortcut?: { [key: MenuDataType['value']]: (e: KeyboardEvent) => boolean } 24 | } 25 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/link/index.ts: -------------------------------------------------------------------------------- 1 | import LinkMenu from './link.vue' 2 | import LinkUnsetMenu from './link-unset.vue' 3 | export * from './props' 4 | export { LinkMenu, LinkUnsetMenu } 5 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/link/link-unset.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/link/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type LinkMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 浮层属性 10 | */ 11 | popoverProps?: MenuPropsType['popoverProps'] 12 | } 13 | 14 | export type LinkUnsetMenuPropsType = { 15 | /** 16 | * 是否禁用 17 | */ 18 | disabled?: boolean 19 | /** 20 | * 快捷键设置 21 | */ 22 | shortcut?: (e: KeyboardEvent) => boolean 23 | } 24 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/link/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-link { 2 | display: block; 3 | width: 100%; 4 | padding: var(--kaitify-padding); 5 | 6 | input[type='text'], 7 | input[type='url'] { 8 | display: block; 9 | width: 100%; 10 | border: none; 11 | border-bottom: 1px solid var(--kaitify-border-color); 12 | font-size: var(--kaitify-font-size); 13 | font-family: var(--kaitify-font-family); 14 | line-height: var(--kaitify-line-height); 15 | color: var(--kaitify-font-color); 16 | background: transparent; 17 | padding: var(--kaitify-small-padding) 0; 18 | margin-bottom: 10px; 19 | transition: all 300ms; 20 | 21 | &:focus { 22 | border-bottom-color: var(--kaitify-theme); 23 | } 24 | 25 | &::placeholder, 26 | &::-webkit-input-placeholder { 27 | opacity: 0.5; 28 | font-family: var(--kaitify-font-family); 29 | color: inherit; 30 | } 31 | } 32 | 33 | .kaitify-link-footer { 34 | display: flex; 35 | justify-content: space-between; 36 | align-items: center; 37 | width: 100%; 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/math/index.ts: -------------------------------------------------------------------------------- 1 | import MathMenu from './math.vue' 2 | export * from './props' 3 | export { MathMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/math/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type MathMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 浮层属性 10 | */ 11 | popoverProps?: MenuPropsType['popoverProps'] 12 | } 13 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/math/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-math { 2 | display: block; 3 | width: 100%; 4 | padding: var(--kaitify-padding); 5 | 6 | .kaitify-math-textarea { 7 | display: block; 8 | width: 100%; 9 | height: 100px; 10 | overflow-y: auto; 11 | overflow-x: hidden; 12 | font-family: Consolas, monospace, Monaco, Andale Mono, Ubuntu Mono; 13 | border: 1px solid var(--kaitify-border-color); 14 | appearance: none; 15 | border-radius: var(--kaitify-border-radius); 16 | padding: var(--kaitify-padding); 17 | font-size: var(--kaitify-font-size); 18 | line-height: var(--kaitify-line-height); 19 | color: var(--kaitify-font-color); 20 | margin-bottom: 10px; 21 | transition: all 300ms; 22 | resize: none; 23 | background: transparent; 24 | 25 | &:focus { 26 | border-color: var(--kaitify-theme); 27 | } 28 | 29 | &::placeholder, 30 | &::-webkit-input-placeholder { 31 | opacity: 0.5; 32 | font-family: var(--kaitify-font-family); 33 | color: inherit; 34 | } 35 | } 36 | 37 | .kaitify-math-footer { 38 | display: flex; 39 | justify-content: flex-end; 40 | align-items: center; 41 | width: 100%; 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/ordered-list/index.ts: -------------------------------------------------------------------------------- 1 | import OrderedListMenu from './ordered-list.vue' 2 | export * from './props' 3 | export { OrderedListMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/ordered-list/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type OrderedListMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 浮层属性 10 | */ 11 | popoverProps?: MenuPropsType['popoverProps'] 12 | } 13 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/ordered-list/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-ordered-list { 2 | display: flex; 3 | justify-content: flex-start; 4 | flex-wrap: wrap; 5 | width: 100%; 6 | padding: var(--kaitify-small-padding); 7 | 8 | .kaitify-ordered-list-item { 9 | padding: var(--kaitify-small-padding); 10 | 11 | :deep(.kaitify-button) { 12 | width: 40px; 13 | padding: 0; 14 | } 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/redo/index.ts: -------------------------------------------------------------------------------- 1 | import RedoMenu from './redo.vue' 2 | export * from './props' 3 | export { RedoMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/redo/props.ts: -------------------------------------------------------------------------------- 1 | export type RedoMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | } 7 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/redo/redo.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/strikethrough/index.ts: -------------------------------------------------------------------------------- 1 | import StrikethroughMenu from './strikethrough.vue' 2 | export * from './props' 3 | export { StrikethroughMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/strikethrough/props.ts: -------------------------------------------------------------------------------- 1 | export type StrikethroughMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/subscript/index.ts: -------------------------------------------------------------------------------- 1 | import SubscriptMenu from './subscript.vue' 2 | export * from './props' 3 | export { SubscriptMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/subscript/props.ts: -------------------------------------------------------------------------------- 1 | export type SubscriptMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/superscript/index.ts: -------------------------------------------------------------------------------- 1 | import SuperscriptMenu from './superscript.vue' 2 | export * from './props' 3 | export { SuperscriptMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/superscript/props.ts: -------------------------------------------------------------------------------- 1 | export type SuperscriptMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/table/index.ts: -------------------------------------------------------------------------------- 1 | import TableMenu from './table.vue' 2 | import TableUnsetMenu from './table-unset.vue' 3 | import TableDeleteRowMenu from './table-delete-row.vue' 4 | import TableDeleteColumnMenu from './table-delete-column.vue' 5 | import TableAddRowMenu from './table-add-row.vue' 6 | import TableAddColumnMenu from './table-add-column.vue' 7 | import TableMergeCellMenu from './table-merge-cell.vue' 8 | export * from './props' 9 | export { TableMenu, TableUnsetMenu, TableDeleteRowMenu, TableDeleteColumnMenu, TableAddRowMenu, TableAddColumnMenu, TableMergeCellMenu } 10 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/table/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-table { 2 | display: block; 3 | position: relative; 4 | padding: var(--kaitify-padding); 5 | 6 | table { 7 | border: 1px solid var(--kaitify-border-color); 8 | margin: 0; 9 | padding: 0; 10 | border-collapse: collapse; 11 | 12 | tr { 13 | margin: 0; 14 | padding: 0; 15 | 16 | td { 17 | margin: 0; 18 | padding: 0; 19 | border: 1px solid var(--kaitify-border-color); 20 | 21 | span { 22 | display: block; 23 | width: 15px; 24 | height: 15px; 25 | } 26 | 27 | &:hover { 28 | cursor: pointer; 29 | } 30 | 31 | &.kaitify-table-inside { 32 | background-color: #f1f2f3; 33 | } 34 | } 35 | } 36 | } 37 | 38 | .kaitify-table-footer { 39 | display: block; 40 | width: 100%; 41 | text-align: center; 42 | color: var(--kaitify-font-color); 43 | line-height: 1; 44 | margin-top: var(--kaitify-margin); 45 | opacity: 0.8; 46 | } 47 | } 48 | 49 | :root[kaitify-dark] .kaitify-table { 50 | table tr td { 51 | &.kaitify-table-inside { 52 | background-color: #2a2a2a; 53 | } 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/table/table-add-column.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/table/table-add-row.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/table/table-delete-column.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/table/table-delete-row.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/table/table-merge-cell.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/table/table-unset.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/task/index.ts: -------------------------------------------------------------------------------- 1 | import TaskMenu from './task.vue' 2 | export * from './props' 3 | export { TaskMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/task/props.ts: -------------------------------------------------------------------------------- 1 | export type TaskMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/task/task.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/underline/index.ts: -------------------------------------------------------------------------------- 1 | import UnderlineMenu from './underline.vue' 2 | export * from './props' 3 | export { UnderlineMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/underline/props.ts: -------------------------------------------------------------------------------- 1 | export type UnderlineMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | /** 7 | * 快捷键设置 8 | */ 9 | shortcut?: (e: KeyboardEvent) => boolean 10 | } 11 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/undo/index.ts: -------------------------------------------------------------------------------- 1 | import UndoMenu from './undo.vue' 2 | export * from './props' 3 | export { UndoMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/undo/props.ts: -------------------------------------------------------------------------------- 1 | export type UndoMenuPropsType = { 2 | /** 3 | * 是否禁用 4 | */ 5 | disabled?: boolean 6 | } 7 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/undo/undo.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/unordered-list/index.ts: -------------------------------------------------------------------------------- 1 | import UnorderedListMenu from './unordered-list.vue' 2 | export * from './props' 3 | export { UnorderedListMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/unordered-list/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type UnorderedListMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 浮层属性 10 | */ 11 | popoverProps?: MenuPropsType['popoverProps'] 12 | } 13 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/unordered-list/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-unordered-list { 2 | display: flex; 3 | justify-content: flex-start; 4 | flex-wrap: wrap; 5 | width: 100%; 6 | padding: var(--kaitify-small-padding); 7 | 8 | .kaitify-unordered-list-item { 9 | padding: var(--kaitify-small-padding); 10 | 11 | :deep(.kaitify-button) { 12 | width: 40px; 13 | padding: 0; 14 | } 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/video/index.ts: -------------------------------------------------------------------------------- 1 | import VideoMenu from './video.vue' 2 | import VideoControlsMenu from "./video-controls.vue" 3 | import VideoMutedMenu from "./video-muted.vue" 4 | import VideoLoopMenu from "./video-loop.vue" 5 | export * from './props' 6 | export { VideoMenu, VideoControlsMenu, VideoMutedMenu, VideoLoopMenu } 7 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/video/props.ts: -------------------------------------------------------------------------------- 1 | import { MenuPropsType } from '@/editor/menu/props' 2 | 3 | export type VideoMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 初始视频宽度 10 | */ 11 | width?: string | number 12 | /** 13 | * tabs配置 14 | */ 15 | tabs?: { 16 | data: ('remote' | 'upload')[] 17 | default: 'remote' | 'upload' 18 | } 19 | /** 20 | * 自定义上传方法 21 | */ 22 | customUpload?: (file: File) => string | Promise 23 | /** 24 | * 浮层属性 25 | */ 26 | popoverProps?: MenuPropsType['popoverProps'] 27 | } 28 | 29 | export type VideoControlsMenuPropsType = { 30 | /** 31 | * 是否禁用 32 | */ 33 | disabled?: boolean 34 | /** 35 | * 快捷键设置 36 | */ 37 | shortcut?: (e: KeyboardEvent) => boolean 38 | } 39 | 40 | export type VideoMutedMenuPropsType = { 41 | /** 42 | * 是否禁用 43 | */ 44 | disabled?: boolean 45 | /** 46 | * 快捷键设置 47 | */ 48 | shortcut?: (e: KeyboardEvent) => boolean 49 | } 50 | 51 | export type VideoLoopMenuPropsType = { 52 | /** 53 | * 是否禁用 54 | */ 55 | disabled?: boolean 56 | /** 57 | * 快捷键设置 58 | */ 59 | shortcut?: (e: KeyboardEvent) => boolean 60 | } 61 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/wrap-down/index.ts: -------------------------------------------------------------------------------- 1 | import WrapDownMenu from './wrap-down.vue' 2 | export * from './props' 3 | export { WrapDownMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/wrap-down/props.ts: -------------------------------------------------------------------------------- 1 | import { KNodeMatchOptionType } from '@/index' 2 | 3 | export type WrapDownMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 指定换行的块节点条件 10 | */ 11 | match: KNodeMatchOptionType 12 | /** 13 | * 快捷键设置 14 | */ 15 | shortcut?: (e: KeyboardEvent) => boolean 16 | } 17 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/wrap-up/index.ts: -------------------------------------------------------------------------------- 1 | import WrapUpMenu from './wrap-up.vue' 2 | export * from './props' 3 | export { WrapUpMenu } 4 | -------------------------------------------------------------------------------- /src/Editor/menu/built-in/wrap-up/props.ts: -------------------------------------------------------------------------------- 1 | import { KNodeMatchOptionType } from '@/index' 2 | 3 | export type WrapUpMenuPropsType = { 4 | /** 5 | * 是否禁用 6 | */ 7 | disabled?: boolean 8 | /** 9 | * 指定换行的块节点条件 10 | */ 11 | match: KNodeMatchOptionType 12 | /** 13 | * 快捷键设置 14 | */ 15 | shortcut?: (e: KeyboardEvent) => boolean 16 | } 17 | -------------------------------------------------------------------------------- /src/Editor/menu/index.ts: -------------------------------------------------------------------------------- 1 | import Menu from './menu.vue' 2 | export * from './props' 3 | export * from './built-in' 4 | export { Menu } 5 | -------------------------------------------------------------------------------- /src/Editor/wrapper/index.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 基于@kaitify/core包装的Vue编辑器组件，使用vue做自定义视图渲染，支持编辑器值的双向绑定 3 | */ 4 | 5 | import Wrapper from './wrapper.vue' 6 | export * from './props' 7 | export { Wrapper } 8 | -------------------------------------------------------------------------------- /src/Editor/wrapper/render.ts: -------------------------------------------------------------------------------- 1 | import { Editor, getNodeRenderOptions, KNodeRenderOptionType } from '@kaitify/core' 2 | import { h } from 'vue' 3 | 4 | /** 5 | * 生成VNode 6 | */ 7 | export const createVNode = (options: KNodeRenderOptionType) => { 8 | return h( 9 | options.tag, 10 | { 11 | key: options.key, 12 | ...options.attrs, 13 | style: options.styles 14 | }, 15 | { 16 | default: () => { 17 | if (options.children && options.children.length) { 18 | return options.children.map(item => createVNode(item)) 19 | } 20 | return options.textContent ?? '' 21 | } 22 | } 23 | ) 24 | } 25 | 26 | /** 27 | * 创建VNode数组 28 | */ 29 | export const createVNodes = (editor: Editor) => { 30 | return editor.stackNodes.map(item => createVNode(getNodeRenderOptions(editor, item))) 31 | } 32 | -------------------------------------------------------------------------------- /src/Editor/wrapper/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-border { 2 | border: 1px solid var(--kaitify-border-color); 3 | border-radius: var(--kaitify-border-radius); 4 | transition: border-color 500ms, box-shadow 500ms; 5 | 6 | &:focus { 7 | border-color: var(--kaitify-theme); 8 | box-shadow: 0 0 0 4px var(--kaitify-lightest-theme); 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /src/core/button/button.vue: -------------------------------------------------------------------------------- 1 | 8 | 20 | -------------------------------------------------------------------------------- /src/core/button/index.ts: -------------------------------------------------------------------------------- 1 | import Button from './button.vue' 2 | export * from './props' 3 | export { Button } 4 | -------------------------------------------------------------------------------- /src/core/button/props.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 按钮组件的属性类型 3 | */ 4 | export type ButtonPropsType = { 5 | /** 6 | * 是否禁用 7 | */ 8 | disabled?: boolean 9 | /** 10 | * 是否激活 11 | */ 12 | active?: boolean 13 | /** 14 | * 是否块级展示 15 | */ 16 | block?: boolean 17 | /** 18 | * 是否更大的按钮 19 | */ 20 | large?: boolean 21 | } 22 | -------------------------------------------------------------------------------- /src/core/button/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-button { 2 | display: inline-flex; 3 | justify-content: center; 4 | align-items: center; 5 | padding: 0 var(--kaitify-padding); 6 | height: 28px; 7 | background: var(--kaitify-background-color); 8 | color: var(--kaitify-font-color); 9 | font-size: var(--kaitify-font-size); 10 | font-family: var(--kaitify-font-family); 11 | border: none; 12 | border-radius: var(--kaitify-border-radius); 13 | transition: background 300ms, color 300ms; 14 | 15 | &, 16 | *, 17 | *::before, 18 | *::after { 19 | box-sizing: border-box; 20 | outline: none; 21 | } 22 | 23 | &:not([disabled]):hover { 24 | cursor: pointer; 25 | background: var(--kaitify-lightest-theme); 26 | color: var(--kaitify-theme); 27 | } 28 | 29 | &:not([disabled]):active { 30 | background: var(--kaitify-lighter-theme); 31 | color: var(--kaitify-theme); 32 | } 33 | 34 | &:not([disabled]).kaitify-button-active { 35 | background: var(--kaitify-lighter-theme); 36 | color: var(--kaitify-theme); 37 | } 38 | 39 | &[disabled] { 40 | opacity: 0.6; 41 | cursor: not-allowed; 42 | } 43 | 44 | &.kaitify-button-block { 45 | display: flex; 46 | width: 100%; 47 | } 48 | 49 | &.kaitify-button-large { 50 | height: 32px; 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /src/core/checkbox/checkbox.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /src/core/checkbox/index.ts: -------------------------------------------------------------------------------- 1 | import Checkbox from './checkbox.vue' 2 | 3 | export type * from './props' 4 | 5 | export { Checkbox } 6 | -------------------------------------------------------------------------------- /src/core/checkbox/props.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 复选框组件属性类型 3 | */ 4 | export type CheckboxPropsType = { 5 | /** 6 | * 是否禁用 7 | */ 8 | disabled?: boolean 9 | /** 10 | * 是否选中 11 | */ 12 | modelValue?: boolean 13 | /** 14 | * label文字 15 | */ 16 | label?: string 17 | } 18 | 19 | /** 20 | * 复选框组件事件类型 21 | */ 22 | export type CheckboxEmitsType = { 23 | /** 24 | * 受控值改变触发的事件 25 | */ 26 | (e: 'update:modelValue', value: boolean): void 27 | } 28 | -------------------------------------------------------------------------------- /src/core/divider/divider.vue: -------------------------------------------------------------------------------- 1 | 4 | 11 | -------------------------------------------------------------------------------- /src/core/divider/index.ts: -------------------------------------------------------------------------------- 1 | import Divider from './divider.vue' 2 | 3 | export { Divider } 4 | -------------------------------------------------------------------------------- /src/core/divider/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-divider { 2 | display: inline-block; 3 | width: 1px; 4 | height: 18px; 5 | background: var(--kaitify-border-color); 6 | vertical-align: middle; 7 | margin: 0 var(--kaitify-small-margin); 8 | } 9 | -------------------------------------------------------------------------------- /src/core/icon/icon.vue: -------------------------------------------------------------------------------- 1 | 6 | 16 | -------------------------------------------------------------------------------- /src/core/icon/index.ts: -------------------------------------------------------------------------------- 1 | import Icon from './icon.vue' 2 | export * from './props' 3 | export { Icon } 4 | -------------------------------------------------------------------------------- /src/core/icon/props.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 图标组件的属性类型 3 | */ 4 | export type IconPropsType = { 5 | /** 6 | * iconify的图标name 7 | */ 8 | name: string 9 | /** 10 | * 图标大小，如果是数值默认单位为px 11 | */ 12 | size?: string | number 13 | } 14 | -------------------------------------------------------------------------------- /src/core/icon/style.less: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'kaitify-icon'; 3 | src: url('../../iconfont/iconfont.woff') format('woff'), url('../../iconfont/iconfont.ttf?t=2024051301') format('truetype'); 4 | } 5 | 6 | .kaitify-icon { 7 | display: inline-flex; 8 | justify-content: center; 9 | align-items: center; 10 | color: inherit; 11 | font-family: 'kaitify-icon' !important; 12 | font-size: inherit; 13 | font-style: normal; 14 | -webkit-font-smoothing: antialiased; 15 | -moz-osx-font-smoothing: grayscale; 16 | line-height: 1; 17 | vertical-align: middle; 18 | box-sizing: border-box; 19 | } 20 | -------------------------------------------------------------------------------- /src/core/popover/index.ts: -------------------------------------------------------------------------------- 1 | import Popover from './popover.vue' 2 | export * from './props' 3 | export { Popover } 4 | -------------------------------------------------------------------------------- /src/core/tabs/index.ts: -------------------------------------------------------------------------------- 1 | import Tabs from './tabs.vue' 2 | export * from './props' 3 | export { Tabs } 4 | -------------------------------------------------------------------------------- /src/core/tabs/props.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * 选项卡组件属性类型 3 | */ 4 | export type TabsPropsType = { 5 | /** 6 | * 选项卡分栏数据 7 | */ 8 | data: { label: string; value: string | number }[] 9 | /** 10 | * 选项卡默认选项 11 | */ 12 | defaultValue: string | number 13 | } 14 | -------------------------------------------------------------------------------- /src/core/tabs/style.less: -------------------------------------------------------------------------------- 1 | .kaitify-tabs { 2 | display: block; 3 | width: 100%; 4 | position: relative; 5 | font-size: var(--kaitify-font-size); 6 | color: var(--kaitify-font-color); 7 | line-height: var(--kaitify-line-height); 8 | font-family: var(--kaitify-font-family); 9 | 10 | &, 11 | *, 12 | *::before, 13 | *::after { 14 | box-sizing: border-box; 15 | outline: none; 16 | } 17 | 18 | .kaitify-tabs-header { 19 | display: flex; 20 | justify-content: flex-start; 21 | align-items: center; 22 | width: 100%; 23 | padding: var(--kaitify-small-padding) 0; 24 | 25 | .kaitify-tabs-header-item { 26 | padding: var(--kaitify-small-padding) var(--kaitify-padding); 27 | position: relative; 28 | transition: color 300ms; 29 | 30 | &:hover { 31 | cursor: pointer; 32 | color: var(--kaitify-theme); 33 | } 34 | 35 | &.kaitify-tabs-header-item-active { 36 | color: var(--kaitify-theme); 37 | 38 | &::before { 39 | position: absolute; 40 | width: calc((100% - var(--kaitify-small-padding) * 2) * 2 / 3); 41 | height: 2px; 42 | left: 50%; 43 | bottom: 0; 44 | transform: translateX(-50%); 45 | content: ''; 46 | background: var(--kaitify-theme); 47 | border-radius: 2px; 48 | } 49 | } 50 | } 51 | } 52 | 53 | .kaitify-tabs-content { 54 | position: relative; 55 | display: block; 56 | width: 100%; 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /src/core/tabs/tabs.vue: -------------------------------------------------------------------------------- 1 | 15 | 35 | -------------------------------------------------------------------------------- /src/iconfont/iconfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/so-better/kaitify-vue/484c2b3f77470c7722973d6afb1d77935ca74ab7/src/iconfont/iconfont.ttf -------------------------------------------------------------------------------- /src/iconfont/iconfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/so-better/kaitify-vue/484c2b3f77470c7722973d6afb1d77935ca74ab7/src/iconfont/iconfont.woff -------------------------------------------------------------------------------- /src/index.ts: -------------------------------------------------------------------------------- 1 | //字体图标 2 | import './iconfont/iconfont.css' 3 | //编辑器核心库 4 | export * from '@kaitify/core' 5 | //分隔线 6 | export * from './core/divider' 7 | //选项卡 8 | export * from './core/tabs' 9 | //复选框 10 | export * from './core/checkbox' 11 | //图标 12 | export * from './core/icon' 13 | //编辑器 14 | export * from './editor/wrapper' 15 | //菜单 16 | export * from './editor/menu' 17 | -------------------------------------------------------------------------------- /src/locale/en-us.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | 本地上传: 'Local Upload', 3 | 远程地址: 'Remote Address', 4 | 附件名称: 'Attachment Name', 5 | 附件地址: 'Attachment Address', 6 | 附件: 'Attachment', 7 | 插入: 'Insert', 8 | 更新: 'Update', 9 | 默认颜色: 'Default Color', 10 | 默认字体: 'Default Font', 11 | 默认字号: 'Default Font Size', 12 | 默认行高: 'Default Line Height', 13 | 正文: 'Paragraph', 14 | 图片名称: 'Image Name', 15 | 图片地址: 'Image Address', 16 | 图片: 'Image', 17 | 链接地址: 'Link Address', 18 | 新窗口打开: 'New Window', 19 | 链接文字: 'Link Text', 20 | 是否自动播放: 'AutoPlay', 21 | 视频地址: 'Video Address', 22 | 输入Latex数学公式: 'Enter Latex Mathematical Formulas' 23 | } 24 | -------------------------------------------------------------------------------- /src/locale/index.ts: -------------------------------------------------------------------------------- 1 | import enUs from './en-us' 2 | 3 | export type LocaleType = 'zh-cn' | 'en-us' 4 | 5 | const localeMap = { 6 | 'en-us': enUs as typeof enUs & { [key: string]: string } 7 | } 8 | 9 | export const translate = (locale: LocaleType, key: string) => { 10 | if (locale == 'zh-cn') { 11 | return key 12 | } 13 | return localeMap[locale][key] ?? key 14 | } 15 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES2020", 4 | "useDefineForClassFields": true, 5 | "module": "ESNext", 6 | "lib": ["ES2020", "DOM", "DOM.Iterable"], 7 | "skipLibCheck": true, 8 | "allowSyntheticDefaultImports": true, 9 | "esModuleInterop":true, 10 | "types": ["node"], 11 | "baseUrl": "./", 12 | "paths": { 13 | "@/*": ["src/*"] 14 | }, 15 | 16 | /* Bundler mode */ 17 | "moduleResolution": "bundler", 18 | "allowImportingTsExtensions": true, 19 | "resolveJsonModule": true, 20 | "isolatedModules": true, 21 | "noEmit": true, 22 | "jsx": "preserve", 23 | 24 | /* Linting */ 25 | "strict": true, 26 | "noUnusedLocals": true, 27 | "noUnusedParameters": true, 28 | "noFallthroughCasesInSwitch": true 29 | }, 30 | "include": ["src/**/*.ts", "src/**/*.vue", "vite-env.d.ts"], 31 | "references": [{ "path": "./tsconfig.node.json" }] 32 | } 33 | -------------------------------------------------------------------------------- /tsconfig.node.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "composite": true, 4 | "skipLibCheck": true, 5 | "module": "ESNext", 6 | "moduleResolution": "bundler", 7 | "allowSyntheticDefaultImports": true, 8 | "strict": true 9 | }, 10 | "include": ["vite.config.ts"] 11 | } 12 | -------------------------------------------------------------------------------- /vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | declare module '*.vue' { 3 | import { DefineComponent } from 'vue' 4 | const component: DefineComponent<{}, {}, any> 5 | export default component 6 | } 7 | -------------------------------------------------------------------------------- /vite.config.ts: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import vue from '@vitejs/plugin-vue' 3 | import dts from 'vite-plugin-dts' 4 | import path from 'path' 5 | import cssInjectedByJsPlugin from 'vite-plugin-css-injected-by-js' 6 | 7 | export default defineConfig({ 8 | plugins: [vue(), dts(), cssInjectedByJsPlugin({ topExecutionPriority: false })], 9 | resolve: { 10 | alias: { 11 | '@': path.resolve(__dirname, './src') 12 | } 13 | }, 14 | build: { 15 | //打包后的目录名称 16 | outDir: 'lib', 17 | minify: 'terser', 18 | lib: { 19 | entry: path.resolve(__dirname, 'src/index.ts'), 20 | name: 'kaitify-vue', 21 | fileName: format => `kaitify-vue.${format}.js` 22 | }, 23 | rollupOptions: { 24 | // 确保外部化处理那些你不想打包进库的依赖 25 | external: ['vue'], 26 | output: { 27 | // 在 UMD 构建模式下为这些外部化的依赖提供一个全局变量 28 | globals: { 29 | vue: 'Vue' 30 | }, 31 | exports: 'named' 32 | } 33 | }, 34 | sourcemap: false //是否构建source map 文件 35 | }, 36 | css: { 37 | preprocessorOptions: { 38 | less: { 39 | // 使用 less 编写样式的 UI 库（如 antd）时建议加入这个设置 40 | javascriptEnabled: true 41 | } 42 | } 43 | }, 44 | server: { 45 | host: '0.0.0.0' 46 | } 47 | }) 48 | --------------------------------------------------------------------------------