vue-editify 0.1.12 → 0.1.15
Sign up to get free protection for your applications and to get access to all the features.
- package/examples/App.vue +7 -11
- package/lib/editify.es.js +111 -3
- package/lib/editify.umd.js +1 -1
- package/lib/index.d.ts +1 -1
- package/lib/style.css +1 -1
- package/package.json +1 -1
- package/src/core/function.ts +189 -90
- package/src/core/rule.ts +9 -0
- package/src/css/base.less +1 -1
- package/src/editify/editify.less +0 -1
- package/src/editify/editify.vue +1 -1
- package/src/index.ts +1 -1
package/examples/App.vue
CHANGED
@@ -1,13 +1,12 @@
|
|
1
1
|
<template>
|
2
|
-
<div style="padding: 10px; height: 100%; box-sizing: border-box">
|
3
|
-
<
|
4
|
-
<Editify ref="editify" border v-model="val" :menu="menuConfig" autoheight></Editify>
|
2
|
+
<div style="padding: 80px 10px 10px 10px; height: 100%; box-sizing: border-box">
|
3
|
+
<Editify ref="editify" border v-model="val" :menu="menuConfig" style="height: 100%" placeholder="Please Enter Text..." locale="zh_CN"></Editify>
|
5
4
|
</div>
|
6
5
|
</template>
|
7
6
|
<script setup lang="ts">
|
8
7
|
import { ref } from 'vue'
|
9
|
-
import {
|
10
|
-
import { MenuConfigType } from '../src/
|
8
|
+
import { Editify } from '../src/index'
|
9
|
+
import { MenuConfigType } from '../src/index'
|
11
10
|
const val = ref<string>('<p><br></p>')
|
12
11
|
const editify = ref<InstanceType<typeof Editify> | null>(null)
|
13
12
|
const menuConfig = ref<MenuConfigType>({
|
@@ -18,14 +17,11 @@ const menuConfig = ref<MenuConfigType>({
|
|
18
17
|
handleError: (error, file) => {
|
19
18
|
console.log(error, file)
|
20
19
|
}
|
20
|
+
},
|
21
|
+
fullScreen: {
|
22
|
+
show: true
|
21
23
|
}
|
22
24
|
})
|
23
|
-
const handleClick = () => {
|
24
|
-
setIndentIncrease(editify.value!.editor!, editify.value!.dataRangeCaches)
|
25
|
-
editify.value!.editor!.formatElementStack()
|
26
|
-
editify.value!.editor!.domRender()
|
27
|
-
editify.value!.editor!.rangeRender()
|
28
|
-
}
|
29
25
|
</script>
|
30
26
|
<style lang="less">
|
31
27
|
html,
|
package/lib/editify.es.js
CHANGED
@@ -18620,6 +18620,9 @@ const getParsedomElementByElement = (element2, parsedom) => {
|
|
18620
18620
|
return getParsedomElementByElement(element2.parent, parsedom);
|
18621
18621
|
};
|
18622
18622
|
const getCurrentParsedomElement = (editor, dataRangeCaches, parsedom) => {
|
18623
|
+
if (!editor.range) {
|
18624
|
+
return null;
|
18625
|
+
}
|
18623
18626
|
if (editor.range.anchor.element.isEqual(editor.range.focus.element)) {
|
18624
18627
|
return getParsedomElementByElement(editor.range.anchor.element, parsedom);
|
18625
18628
|
}
|
@@ -18672,6 +18675,9 @@ const isTask = function(element2) {
|
|
18672
18675
|
return element2.parsedom == "div" && element2.hasMarks() && element2.marks.hasOwnProperty("data-editify-task");
|
18673
18676
|
};
|
18674
18677
|
const hasPreInRange = (editor, dataRangeCaches) => {
|
18678
|
+
if (!editor.range) {
|
18679
|
+
return false;
|
18680
|
+
}
|
18675
18681
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18676
18682
|
return !!getParsedomElementByElement(editor.range.anchor.element, "pre");
|
18677
18683
|
}
|
@@ -18680,6 +18686,9 @@ const hasPreInRange = (editor, dataRangeCaches) => {
|
|
18680
18686
|
});
|
18681
18687
|
};
|
18682
18688
|
const isRangeInPre = (editor, dataRangeCaches) => {
|
18689
|
+
if (!editor.range) {
|
18690
|
+
return false;
|
18691
|
+
}
|
18683
18692
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18684
18693
|
return !!getParsedomElementByElement(editor.range.anchor.element, "pre");
|
18685
18694
|
}
|
@@ -18688,6 +18697,9 @@ const isRangeInPre = (editor, dataRangeCaches) => {
|
|
18688
18697
|
});
|
18689
18698
|
};
|
18690
18699
|
const hasQuoteInRange = (editor, dataRangeCaches) => {
|
18700
|
+
if (!editor.range) {
|
18701
|
+
return false;
|
18702
|
+
}
|
18691
18703
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18692
18704
|
return !!getParsedomElementByElement(editor.range.anchor.element, "blockquote");
|
18693
18705
|
}
|
@@ -18696,6 +18708,9 @@ const hasQuoteInRange = (editor, dataRangeCaches) => {
|
|
18696
18708
|
});
|
18697
18709
|
};
|
18698
18710
|
const isRangeInQuote = (editor, dataRangeCaches) => {
|
18711
|
+
if (!editor.range) {
|
18712
|
+
return false;
|
18713
|
+
}
|
18699
18714
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18700
18715
|
return !!getParsedomElementByElement(editor.range.anchor.element, "blockquote");
|
18701
18716
|
}
|
@@ -18704,6 +18719,9 @@ const isRangeInQuote = (editor, dataRangeCaches) => {
|
|
18704
18719
|
});
|
18705
18720
|
};
|
18706
18721
|
const hasListInRange = (editor, dataRangeCaches, ordered = false) => {
|
18722
|
+
if (!editor.range) {
|
18723
|
+
return false;
|
18724
|
+
}
|
18707
18725
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18708
18726
|
return elementIsInList(editor.range.anchor.element, ordered);
|
18709
18727
|
}
|
@@ -18712,6 +18730,9 @@ const hasListInRange = (editor, dataRangeCaches, ordered = false) => {
|
|
18712
18730
|
});
|
18713
18731
|
};
|
18714
18732
|
const isRangeInList = (editor, dataRangeCaches, ordered = false) => {
|
18733
|
+
if (!editor.range) {
|
18734
|
+
return false;
|
18735
|
+
}
|
18715
18736
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18716
18737
|
return elementIsInList(editor.range.anchor.element, ordered);
|
18717
18738
|
}
|
@@ -18720,6 +18741,9 @@ const isRangeInList = (editor, dataRangeCaches, ordered = false) => {
|
|
18720
18741
|
});
|
18721
18742
|
};
|
18722
18743
|
const hasTaskInRange = (editor, dataRangeCaches) => {
|
18744
|
+
if (!editor.range) {
|
18745
|
+
return false;
|
18746
|
+
}
|
18723
18747
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18724
18748
|
return elementIsInTask(editor.range.anchor.element);
|
18725
18749
|
}
|
@@ -18728,6 +18752,9 @@ const hasTaskInRange = (editor, dataRangeCaches) => {
|
|
18728
18752
|
});
|
18729
18753
|
};
|
18730
18754
|
const isRangeInTask = (editor, dataRangeCaches) => {
|
18755
|
+
if (!editor.range) {
|
18756
|
+
return false;
|
18757
|
+
}
|
18731
18758
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18732
18759
|
return elementIsInTask(editor.range.anchor.element);
|
18733
18760
|
}
|
@@ -18736,6 +18763,9 @@ const isRangeInTask = (editor, dataRangeCaches) => {
|
|
18736
18763
|
});
|
18737
18764
|
};
|
18738
18765
|
const hasLinkInRange = (editor, dataRangeCaches) => {
|
18766
|
+
if (!editor.range) {
|
18767
|
+
return false;
|
18768
|
+
}
|
18739
18769
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18740
18770
|
return !!getParsedomElementByElement(editor.range.anchor.element, "a");
|
18741
18771
|
}
|
@@ -18744,6 +18774,9 @@ const hasLinkInRange = (editor, dataRangeCaches) => {
|
|
18744
18774
|
});
|
18745
18775
|
};
|
18746
18776
|
const hasTableInRange = (editor, dataRangeCaches) => {
|
18777
|
+
if (!editor.range) {
|
18778
|
+
return false;
|
18779
|
+
}
|
18747
18780
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18748
18781
|
return !!getParsedomElementByElement(editor.range.anchor.element, "table");
|
18749
18782
|
}
|
@@ -18752,6 +18785,9 @@ const hasTableInRange = (editor, dataRangeCaches) => {
|
|
18752
18785
|
});
|
18753
18786
|
};
|
18754
18787
|
const hasImageInRange = (editor, dataRangeCaches) => {
|
18788
|
+
if (!editor.range) {
|
18789
|
+
return false;
|
18790
|
+
}
|
18755
18791
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18756
18792
|
return !!getParsedomElementByElement(editor.range.anchor.element, "img");
|
18757
18793
|
}
|
@@ -18760,6 +18796,9 @@ const hasImageInRange = (editor, dataRangeCaches) => {
|
|
18760
18796
|
});
|
18761
18797
|
};
|
18762
18798
|
const hasVideoInRange = (editor, dataRangeCaches) => {
|
18799
|
+
if (!editor.range) {
|
18800
|
+
return false;
|
18801
|
+
}
|
18763
18802
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18764
18803
|
return !!getParsedomElementByElement(editor.range.anchor.element, "video");
|
18765
18804
|
}
|
@@ -18768,6 +18807,9 @@ const hasVideoInRange = (editor, dataRangeCaches) => {
|
|
18768
18807
|
});
|
18769
18808
|
};
|
18770
18809
|
const queryTextStyle = (editor, dataRangeCaches, name, value) => {
|
18810
|
+
if (!editor.range) {
|
18811
|
+
return false;
|
18812
|
+
}
|
18771
18813
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18772
18814
|
if (editor.range.anchor.element.isText() && editor.range.anchor.element.hasStyles()) {
|
18773
18815
|
return queryHasValue(editor.range.anchor.element.styles, name, value);
|
@@ -18789,6 +18831,9 @@ const queryTextStyle = (editor, dataRangeCaches, name, value) => {
|
|
18789
18831
|
return flag;
|
18790
18832
|
};
|
18791
18833
|
const queryTextMark = (editor, dataRangeCaches, name, value) => {
|
18834
|
+
if (!editor.range) {
|
18835
|
+
return false;
|
18836
|
+
}
|
18792
18837
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18793
18838
|
if (editor.range.anchor.element.isText() && editor.range.anchor.element.hasMarks()) {
|
18794
18839
|
return queryHasValue(editor.range.anchor.element.marks, name, value);
|
@@ -18823,6 +18868,9 @@ const getRangeText = (dataRangeCaches) => {
|
|
18823
18868
|
return text;
|
18824
18869
|
};
|
18825
18870
|
const getFlatElementsByRange = (editor, dataRangeCaches) => {
|
18871
|
+
if (!editor.range) {
|
18872
|
+
return [];
|
18873
|
+
}
|
18826
18874
|
let length = dataRangeCaches.flatList.length;
|
18827
18875
|
let elements = [];
|
18828
18876
|
for (let i = 0; i < length; i++) {
|
@@ -18894,6 +18942,9 @@ const elementToTask = function(element2) {
|
|
18894
18942
|
element2.marks["data-editify-task"] = "uncheck";
|
18895
18943
|
};
|
18896
18944
|
const setHeading = (editor, dataRangeCaches, editTrans, parsedom) => {
|
18945
|
+
if (!editor.range) {
|
18946
|
+
return;
|
18947
|
+
}
|
18897
18948
|
const values = getButtonOptionsConfig(editTrans).heading.map((item) => {
|
18898
18949
|
return item.value;
|
18899
18950
|
});
|
@@ -18918,6 +18969,9 @@ const setHeading = (editor, dataRangeCaches, editTrans, parsedom) => {
|
|
18918
18969
|
}
|
18919
18970
|
};
|
18920
18971
|
const setIndentIncrease = (editor, dataRangeCaches) => {
|
18972
|
+
if (!editor.range) {
|
18973
|
+
return;
|
18974
|
+
}
|
18921
18975
|
const fn = (element2) => {
|
18922
18976
|
if (element2.hasStyles()) {
|
18923
18977
|
if (element2.styles.hasOwnProperty("text-indent")) {
|
@@ -18958,6 +19012,9 @@ const setIndentIncrease = (editor, dataRangeCaches) => {
|
|
18958
19012
|
}
|
18959
19013
|
};
|
18960
19014
|
const setIndentDecrease = (editor, dataRangeCaches) => {
|
19015
|
+
if (!editor.range) {
|
19016
|
+
return;
|
19017
|
+
}
|
18961
19018
|
const fn = (element2) => {
|
18962
19019
|
if (element2.hasStyles() && element2.styles.hasOwnProperty("text-indent")) {
|
18963
19020
|
let val = element2.styles["text-indent"];
|
@@ -18990,6 +19047,9 @@ const setIndentDecrease = (editor, dataRangeCaches) => {
|
|
18990
19047
|
}
|
18991
19048
|
};
|
18992
19049
|
const setQuote = (editor, dataRangeCaches) => {
|
19050
|
+
if (!editor.range) {
|
19051
|
+
return;
|
19052
|
+
}
|
18993
19053
|
const flag = isRangeInQuote(editor, dataRangeCaches);
|
18994
19054
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
18995
19055
|
const block = editor.range.anchor.element.getBlock();
|
@@ -19015,6 +19075,9 @@ const setQuote = (editor, dataRangeCaches) => {
|
|
19015
19075
|
}
|
19016
19076
|
};
|
19017
19077
|
const setAlign = (editor, dataRangeCaches, value) => {
|
19078
|
+
if (!editor.range) {
|
19079
|
+
return;
|
19080
|
+
}
|
19018
19081
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
19019
19082
|
const block = editor.range.anchor.element.getBlock();
|
19020
19083
|
const inblock = editor.range.anchor.element.getInblock();
|
@@ -19070,6 +19133,9 @@ const setAlign = (editor, dataRangeCaches, value) => {
|
|
19070
19133
|
}
|
19071
19134
|
};
|
19072
19135
|
const setList = (editor, dataRangeCaches, ordered) => {
|
19136
|
+
if (!editor.range) {
|
19137
|
+
return;
|
19138
|
+
}
|
19073
19139
|
const flag = isRangeInList(editor, dataRangeCaches, ordered);
|
19074
19140
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
19075
19141
|
const block = editor.range.anchor.element.getBlock();
|
@@ -19097,6 +19163,9 @@ const setList = (editor, dataRangeCaches, ordered) => {
|
|
19097
19163
|
}
|
19098
19164
|
};
|
19099
19165
|
const setTask = (editor, dataRangeCaches) => {
|
19166
|
+
if (!editor.range) {
|
19167
|
+
return;
|
19168
|
+
}
|
19100
19169
|
const flag = isRangeInTask(editor, dataRangeCaches);
|
19101
19170
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
19102
19171
|
const block = editor.range.anchor.element.getBlock();
|
@@ -19124,6 +19193,9 @@ const setTask = (editor, dataRangeCaches) => {
|
|
19124
19193
|
}
|
19125
19194
|
};
|
19126
19195
|
const setTextStyle = (editor, dataRangeCaches, styles) => {
|
19196
|
+
if (!editor.range) {
|
19197
|
+
return;
|
19198
|
+
}
|
19127
19199
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
19128
19200
|
if (editor.range.anchor.element.isSpaceText()) {
|
19129
19201
|
if (editor.range.anchor.element.hasStyles()) {
|
@@ -19160,6 +19232,9 @@ const setTextStyle = (editor, dataRangeCaches, styles) => {
|
|
19160
19232
|
}
|
19161
19233
|
};
|
19162
19234
|
const setTextMark = (editor, dataRangeCaches, marks) => {
|
19235
|
+
if (!editor.range) {
|
19236
|
+
return;
|
19237
|
+
}
|
19163
19238
|
if (!common.isObject(marks)) {
|
19164
19239
|
throw new Error("The argument must be an object");
|
19165
19240
|
}
|
@@ -19199,6 +19274,9 @@ const setTextMark = (editor, dataRangeCaches, marks) => {
|
|
19199
19274
|
}
|
19200
19275
|
};
|
19201
19276
|
const removeTextStyle = (editor, dataRangeCaches, styleNames) => {
|
19277
|
+
if (!editor.range) {
|
19278
|
+
return;
|
19279
|
+
}
|
19202
19280
|
const removeFn = (el) => {
|
19203
19281
|
if (Array.isArray(styleNames)) {
|
19204
19282
|
if (el.hasStyles()) {
|
@@ -19234,6 +19312,9 @@ const removeTextStyle = (editor, dataRangeCaches, styleNames) => {
|
|
19234
19312
|
}
|
19235
19313
|
};
|
19236
19314
|
const removeTextMark = (editor, dataRangeCaches, markNames) => {
|
19315
|
+
if (!editor.range) {
|
19316
|
+
return;
|
19317
|
+
}
|
19237
19318
|
const removeFn = (el) => {
|
19238
19319
|
if (Array.isArray(markNames)) {
|
19239
19320
|
if (el.hasMarks()) {
|
@@ -19269,6 +19350,9 @@ const removeTextMark = (editor, dataRangeCaches, markNames) => {
|
|
19269
19350
|
}
|
19270
19351
|
};
|
19271
19352
|
const setLineHeight = (editor, dataRangeCaches, value) => {
|
19353
|
+
if (!editor.range) {
|
19354
|
+
return;
|
19355
|
+
}
|
19272
19356
|
if (editor.range.anchor.isEqual(editor.range.focus)) {
|
19273
19357
|
const block = editor.range.anchor.element.getBlock();
|
19274
19358
|
const inblock = editor.range.anchor.element.getInblock();
|
@@ -19324,6 +19408,9 @@ const setLineHeight = (editor, dataRangeCaches, value) => {
|
|
19324
19408
|
}
|
19325
19409
|
};
|
19326
19410
|
const insertLink = (editor, text, url, newOpen) => {
|
19411
|
+
if (!editor.range) {
|
19412
|
+
return;
|
19413
|
+
}
|
19327
19414
|
if (!text) {
|
19328
19415
|
text = url;
|
19329
19416
|
}
|
@@ -19339,6 +19426,9 @@ const insertLink = (editor, text, url, newOpen) => {
|
|
19339
19426
|
editor.insertElement(linkEle);
|
19340
19427
|
};
|
19341
19428
|
const insertImage = (editor, value) => {
|
19429
|
+
if (!editor.range) {
|
19430
|
+
return;
|
19431
|
+
}
|
19342
19432
|
const image = new AlexElement(
|
19343
19433
|
"closed",
|
19344
19434
|
"img",
|
@@ -19351,6 +19441,9 @@ const insertImage = (editor, value) => {
|
|
19351
19441
|
editor.insertElement(image);
|
19352
19442
|
};
|
19353
19443
|
const insertVideo = (editor, value) => {
|
19444
|
+
if (!editor.range) {
|
19445
|
+
return;
|
19446
|
+
}
|
19354
19447
|
const video = new AlexElement(
|
19355
19448
|
"closed",
|
19356
19449
|
"video",
|
@@ -19369,6 +19462,9 @@ const insertVideo = (editor, value) => {
|
|
19369
19462
|
editor.range.focus.moveToEnd(rightSpace);
|
19370
19463
|
};
|
19371
19464
|
const insertTable = (editor, rowLength, colLength) => {
|
19465
|
+
if (!editor.range) {
|
19466
|
+
return;
|
19467
|
+
}
|
19372
19468
|
const table = new AlexElement("block", "table", null, null, null);
|
19373
19469
|
const tbody = new AlexElement("inblock", "tbody", null, null, null);
|
19374
19470
|
editor.addElementTo(tbody, table);
|
@@ -19391,6 +19487,9 @@ const insertTable = (editor, rowLength, colLength) => {
|
|
19391
19487
|
editor.range.focus.moveToStart(tbody);
|
19392
19488
|
};
|
19393
19489
|
const insertCodeBlock = (editor, dataRangeCaches) => {
|
19490
|
+
if (!editor.range) {
|
19491
|
+
return;
|
19492
|
+
}
|
19394
19493
|
const pre = getCurrentParsedomElement(editor, dataRangeCaches, "pre");
|
19395
19494
|
if (pre) {
|
19396
19495
|
let content = "";
|
@@ -19556,6 +19655,15 @@ const tableHandle = function(editor, element2) {
|
|
19556
19655
|
} else {
|
19557
19656
|
element2.marks = marks;
|
19558
19657
|
}
|
19658
|
+
const styles = {
|
19659
|
+
"white-space": "pre-wrap",
|
19660
|
+
"word-break": "break-word"
|
19661
|
+
};
|
19662
|
+
if (element2.hasStyles()) {
|
19663
|
+
Object.assign(element2.styles, styles);
|
19664
|
+
} else {
|
19665
|
+
element2.styles = styles;
|
19666
|
+
}
|
19559
19667
|
const elements = AlexElement.flatElements(element2.children);
|
19560
19668
|
const rows = elements.filter((el) => {
|
19561
19669
|
return el.parsedom == "tr";
|
@@ -24872,7 +24980,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
24872
24980
|
removeScroll(contentRef.value);
|
24873
24981
|
};
|
24874
24982
|
const handleToolbar = () => {
|
24875
|
-
if (props || isSourceView.value) {
|
24983
|
+
if (props.disabled || isSourceView.value) {
|
24876
24984
|
return;
|
24877
24985
|
}
|
24878
24986
|
hideToolbar();
|
@@ -25470,8 +25578,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
25470
25578
|
};
|
25471
25579
|
}
|
25472
25580
|
});
|
25473
|
-
const Editify = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
25474
|
-
const version = "0.1.
|
25581
|
+
const Editify = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-99f85ef5"]]);
|
25582
|
+
const version = "0.1.15";
|
25475
25583
|
const install = (app) => {
|
25476
25584
|
app.component(Editify.name, Editify);
|
25477
25585
|
};
|