vue-editify 0.2.25 → 0.2.27
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/examples/App.vue +11 -4
- package/lib/core/tool.d.ts +1 -1
- package/lib/editify/editify.vue.d.ts +0 -2
- package/lib/editify.es.js +51 -109
- package/lib/editify.umd.js +2 -2
- package/lib/index.d.ts +1 -3
- package/package.json +2 -2
- package/src/core/function.ts +3 -3
- package/src/core/tool.ts +1 -1
- package/src/editify/editify.vue +7 -39
- package/src/feature/redo.ts +1 -2
- package/src/feature/undo.ts +1 -3
- package/src/index.ts +1 -1
package/lib/index.d.ts
CHANGED
@@ -764,8 +764,6 @@ declare const Editify: import('./core/tool').SFCWithInstall<import('vue').Define
|
|
764
764
|
menuHeight: import('vue').ComputedRef<number | null>;
|
765
765
|
collapseToEnd: () => void;
|
766
766
|
collapseToStart: () => void;
|
767
|
-
undo: () => void;
|
768
|
-
redo: () => void;
|
769
767
|
}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
770
768
|
change: (...args: any[]) => void;
|
771
769
|
blur: (...args: any[]) => void;
|
@@ -953,5 +951,5 @@ export type * from './editify/menu';
|
|
953
951
|
export type * from './editify/toolbar';
|
954
952
|
export { elementIsMatch, getMatchElementByElement, getMatchElementByRange, elementIsList, getListByElement, hasListInRange, rangeIsInList, elementIsTask, getTaskByElement, hasTaskInRange, rangeIsInTask, elementIsAttachment, hasAttachmentInRange, elementIsMathformula, getMathformulaByElement, hasMathformulaInRange, elementIsInfoBlock, getInfoBlockByElement, hasInfoBlockInRange, rangeIsInInfoBlock, hasPreInRange, hasTableInRange, hasQuoteInRange, rangeIsInQuote, hasLinkInRange, hasImageInRange, hasVideoInRange, queryTextStyle, setTextStyle, removeTextStyle, queryTextMark, setTextMark, removeTextMark, getRangeText, addSpaceTextToBothSides, setHeading, setIndentIncrease, setIndentDecrease, setQuote, setAlign, setList, setTask, setLineHeight, insertLink, insertImage, insertVideo, insertTable, insertCodeBlock, insertSeparator, insertAttachment, insertMathformula, insertInfoBlock } from './core/function';
|
955
953
|
declare const install: (app: App) => void;
|
956
|
-
declare const version = "0.2.
|
954
|
+
declare const version = "0.2.27";
|
957
955
|
export { Editify as default, Editify, install, AlexElement, version };
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "vue-editify",
|
3
|
-
"version": "0.2.
|
3
|
+
"version": "0.2.27",
|
4
4
|
"private": false,
|
5
5
|
"sideEffects": [
|
6
6
|
"*.css"
|
@@ -17,7 +17,7 @@
|
|
17
17
|
"lib": "vue-tsc && vite build"
|
18
18
|
},
|
19
19
|
"dependencies": {
|
20
|
-
"alex-editor": "^1.
|
20
|
+
"alex-editor": "^1.5.0",
|
21
21
|
"dap-util": "^1.5.8",
|
22
22
|
"highlight.js": "^11.8.0",
|
23
23
|
"katex": "^0.16.10",
|
package/src/core/function.ts
CHANGED
@@ -1867,7 +1867,7 @@ export const insertLink = (editor: AlexEditor, text: string, url: string, newOpe
|
|
1867
1867
|
children: [
|
1868
1868
|
{
|
1869
1869
|
type: 'text',
|
1870
|
-
|
1870
|
+
textContent: text
|
1871
1871
|
}
|
1872
1872
|
]
|
1873
1873
|
})
|
@@ -2004,7 +2004,7 @@ export const insertCodeBlock = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
2004
2004
|
children: [
|
2005
2005
|
{
|
2006
2006
|
type: 'text',
|
2007
|
-
|
2007
|
+
textContent: item
|
2008
2008
|
}
|
2009
2009
|
]
|
2010
2010
|
})
|
@@ -2052,7 +2052,7 @@ export const insertCodeBlock = (editor: AlexEditor, dataRangeCaches: AlexElement
|
|
2052
2052
|
if (index > 0) {
|
2053
2053
|
const text = AlexElement.create({
|
2054
2054
|
type: 'text',
|
2055
|
-
|
2055
|
+
textContent: '\n'
|
2056
2056
|
})
|
2057
2057
|
if (pre.hasChildren()) {
|
2058
2058
|
editor.addElementTo(text, pre, pre.children!.length)
|
package/src/core/tool.ts
CHANGED
@@ -1271,7 +1271,7 @@ export const withInstall = <T extends Component>(component: T) => {
|
|
1271
1271
|
;(component as SFCWithInstall<T>).install = (app: App) => {
|
1272
1272
|
app.component(component.name!, component)
|
1273
1273
|
}
|
1274
|
-
return component as SFCWithInstall<
|
1274
|
+
return component as SFCWithInstall<T>
|
1275
1275
|
}
|
1276
1276
|
|
1277
1277
|
/**
|
package/src/editify/editify.vue
CHANGED
@@ -5,7 +5,7 @@
|
|
5
5
|
<!-- 编辑层,与编辑区域宽高相同必须适配 -->
|
6
6
|
<div ref="bodyRef" class="editify-body" :class="{ 'editify-border': showBorder, 'editify-menu_inner': menuConfig.use && menuConfig.mode == 'inner' }" :data-editify-uid="instance.uid">
|
7
7
|
<!-- 编辑器 -->
|
8
|
-
<div ref="contentRef" class="editify-content" :class="{ 'editify-placeholder': showPlaceholder, 'editify-disabled': isDisabled }" @click="handleEditorClick" @compositionstart="isInputChinese = true" @compositionend="isInputChinese = false" :data-editify-placeholder="placeholder"></div>
|
8
|
+
<div ref="contentRef" class="editify-content" :class="{ 'editify-placeholder': showPlaceholder, 'editify-disabled': isDisabled }" @click="handleEditorClick" @compositionstart="isInputChinese = true" @compositionend="isInputChinese = false" :data-editify-placeholder="placeholder" tabindex="-1"></div>
|
9
9
|
<!-- 代码视图 -->
|
10
10
|
<textarea v-if="isSourceView" :value="value" readonly class="editify-sourceview" />
|
11
11
|
<!-- 工具条 -->
|
@@ -738,7 +738,10 @@ const handleCustomParseNode = (ele: AlexElement) => {
|
|
738
738
|
}
|
739
739
|
//编辑区域键盘按下
|
740
740
|
const handleEditorKeydown = (val: string, e: KeyboardEvent) => {
|
741
|
+
//如果禁用不执行后面的逻辑
|
741
742
|
if (isDisabled.value) {
|
743
|
+
//自定义键盘按下操作
|
744
|
+
emits('keydown', val, e)
|
742
745
|
return
|
743
746
|
}
|
744
747
|
//遍历菜单栏配置,设置快捷键
|
@@ -851,9 +854,6 @@ const handleEditorKeydown = (val: string, e: KeyboardEvent) => {
|
|
851
854
|
}
|
852
855
|
//编辑区域键盘松开
|
853
856
|
const handleEditorKeyup = (val: string, e: Event) => {
|
854
|
-
if (isDisabled.value) {
|
855
|
-
return
|
856
|
-
}
|
857
857
|
//自定义键盘松开操作
|
858
858
|
emits('keyup', val, e)
|
859
859
|
}
|
@@ -879,9 +879,6 @@ const handleEditorClick = (e: Event) => {
|
|
879
879
|
}
|
880
880
|
//编辑器的值更新
|
881
881
|
const handleEditorChange = (newVal: string, oldVal: string) => {
|
882
|
-
if (isDisabled.value) {
|
883
|
-
return
|
884
|
-
}
|
885
882
|
//内部修改
|
886
883
|
internalModify(newVal)
|
887
884
|
//触发change事件
|
@@ -959,23 +956,18 @@ const handleInsertParagraph = (element: AlexElement, previousElement: AlexElemen
|
|
959
956
|
}
|
960
957
|
//编辑器焦点更新
|
961
958
|
const handleRangeUpdate = () => {
|
962
|
-
if (isDisabled.value) {
|
963
|
-
return
|
964
|
-
}
|
965
959
|
//更新rangeKey
|
966
960
|
if (rangeKey.value) {
|
967
961
|
rangeKey.value++
|
968
962
|
} else {
|
969
963
|
rangeKey.value = 1
|
970
964
|
}
|
971
|
-
|
972
965
|
//没有range直接返回
|
973
966
|
if (!editor.value!.range) {
|
974
967
|
return
|
975
968
|
}
|
976
969
|
//获取光标选取范围内的元素数据,并且进行缓存
|
977
970
|
dataRangeCaches.value = editor.value!.getElementsByRange()
|
978
|
-
|
979
971
|
//节流写法
|
980
972
|
if (rangeUpdateTimer.value) {
|
981
973
|
clearTimeout(rangeUpdateTimer.value)
|
@@ -1034,46 +1026,26 @@ const handleAfterRender = () => {
|
|
1034
1026
|
}
|
1035
1027
|
//api:光标设置到文档底部
|
1036
1028
|
const collapseToEnd = () => {
|
1037
|
-
if (isDisabled.value) {
|
1038
|
-
return
|
1039
|
-
}
|
1040
1029
|
editor.value!.collapseToEnd()
|
1041
1030
|
editor.value!.rangeRender()
|
1042
1031
|
DapElement.setScrollTop({
|
1043
1032
|
el: contentRef.value!,
|
1044
1033
|
number: DapElement.getScrollHeight(contentRef.value!),
|
1045
|
-
time:
|
1034
|
+
time: 300
|
1046
1035
|
})
|
1047
1036
|
}
|
1048
1037
|
//api:光标设置到文档头部
|
1049
1038
|
const collapseToStart = () => {
|
1050
|
-
if (isDisabled.value) {
|
1051
|
-
return
|
1052
|
-
}
|
1053
1039
|
editor.value!.collapseToStart()
|
1054
1040
|
editor.value!.rangeRender()
|
1055
1041
|
nextTick(() => {
|
1056
1042
|
DapElement.setScrollTop({
|
1057
1043
|
el: contentRef.value!,
|
1058
1044
|
number: 0,
|
1059
|
-
time:
|
1045
|
+
time: 300
|
1060
1046
|
})
|
1061
1047
|
})
|
1062
1048
|
}
|
1063
|
-
//api:撤销
|
1064
|
-
const undo = () => {
|
1065
|
-
if (isDisabled.value) {
|
1066
|
-
return
|
1067
|
-
}
|
1068
|
-
editor.value!.undo()
|
1069
|
-
}
|
1070
|
-
//api:重做
|
1071
|
-
const redo = () => {
|
1072
|
-
if (isDisabled.value) {
|
1073
|
-
return
|
1074
|
-
}
|
1075
|
-
editor.value!.redo()
|
1076
|
-
}
|
1077
1049
|
|
1078
1050
|
//监听编辑的值变更
|
1079
1051
|
watch(
|
@@ -1159,8 +1131,6 @@ provide('isSourceView', isSourceView)
|
|
1159
1131
|
provide('isFullScreen', isFullScreen)
|
1160
1132
|
provide('rangeKey', rangeKey)
|
1161
1133
|
provide('dataRangeCaches', dataRangeCaches)
|
1162
|
-
provide('undo', undo)
|
1163
|
-
provide('redo', redo)
|
1164
1134
|
provide('$editTrans', $editTrans)
|
1165
1135
|
provide('showBorder', showBorder)
|
1166
1136
|
provide('isDark', isDark)
|
@@ -1176,9 +1146,7 @@ defineExpose({
|
|
1176
1146
|
textValue,
|
1177
1147
|
menuHeight,
|
1178
1148
|
collapseToEnd,
|
1179
|
-
collapseToStart
|
1180
|
-
undo,
|
1181
|
-
redo
|
1149
|
+
collapseToStart
|
1182
1150
|
})
|
1183
1151
|
</script>
|
1184
1152
|
<style scoped src="./editify.less"></style>
|
package/src/feature/redo.ts
CHANGED
@@ -18,7 +18,6 @@ export const RedoMenuButton = defineComponent(
|
|
18
18
|
const $editTrans = inject<(key: string) => any>('$editTrans')!
|
19
19
|
const isSourceView = inject<Ref<boolean>>('isSourceView')!
|
20
20
|
const rangeKey = inject<Ref<number | null>>('rangeKey')!
|
21
|
-
const redo = inject<() => void>('redo')!
|
22
21
|
|
23
22
|
const btnRef = ref<InstanceType<typeof Button> | null>(null)
|
24
23
|
|
@@ -41,7 +40,7 @@ export const RedoMenuButton = defineComponent(
|
|
41
40
|
rightBorder: props.config.rightBorder,
|
42
41
|
active: false,
|
43
42
|
disabled: props.disabled || isSourceView.value || (rangeKey.value && editor.value.history && editor.value.history.redoRecords.length == 0) || props.config.disabled,
|
44
|
-
onOperate: () => redo()
|
43
|
+
onOperate: () => editor.value.redo()
|
45
44
|
},
|
46
45
|
{
|
47
46
|
default: () => h(Icon, { value: 'redo' })
|
package/src/feature/undo.ts
CHANGED
@@ -18,8 +18,6 @@ export const UndoMenuButton = defineComponent(
|
|
18
18
|
const $editTrans = inject<(key: string) => any>('$editTrans')!
|
19
19
|
const isSourceView = inject<Ref<boolean>>('isSourceView')!
|
20
20
|
const rangeKey = inject<Ref<number | null>>('rangeKey')!
|
21
|
-
const undo = inject<() => void>('undo')!
|
22
|
-
|
23
21
|
const btnRef = ref<InstanceType<typeof Button> | null>(null)
|
24
22
|
|
25
23
|
expose({
|
@@ -41,7 +39,7 @@ export const UndoMenuButton = defineComponent(
|
|
41
39
|
rightBorder: props.config.rightBorder,
|
42
40
|
active: false,
|
43
41
|
disabled: props.disabled || isSourceView.value || (rangeKey.value && editor.value.history && editor.value.history.records.length <= 1) || props.config.disabled,
|
44
|
-
onOperate: () => undo()
|
42
|
+
onOperate: () => editor.value.undo()
|
45
43
|
},
|
46
44
|
{
|
47
45
|
default: () => h(Icon, { value: 'undo' })
|
package/src/index.ts
CHANGED