mirror of https://github.com/halo-dev/halo
pref: block-level content actively sets fakeSelection (#6162)
#### What type of PR is this? /kind improvement /area editor /milestone 2.17.x #### What this PR does / why we need it: 由于 RangeSelection 可能将一些并不想展示为模拟选中效果的节点进行了转换,因此将 RangeSelection 中模拟选中的效果,由默认的自动设置为 true,变为 false。 之后需要由节点自行设置 `fakeSelection: true` 后才会展示为模拟选中的效果,否则保持原本的选择样式。 #### How to test it? 测试使用 Mod-a 全选后,listItem 等节点是否会展示为模拟选中的效果。 #### Does this PR introduce a user-facing change? ```release-note None ```pull/6140/head^2
parent
28e4ef0756
commit
cc36ddaec5
|
@ -35,6 +35,7 @@ declare module "@/tiptap" {
|
||||||
|
|
||||||
const Audio = Node.create<ExtensionOptions>({
|
const Audio = Node.create<ExtensionOptions>({
|
||||||
name: "audio",
|
name: "audio",
|
||||||
|
fakeSelection: true,
|
||||||
|
|
||||||
inline() {
|
inline() {
|
||||||
return true;
|
return true;
|
||||||
|
|
|
@ -104,6 +104,7 @@ export default CodeBlockLowlight.extend<
|
||||||
// It needs to have a higher priority than range-selection,
|
// It needs to have a higher priority than range-selection,
|
||||||
// otherwise the Mod-a shortcut key will be overridden.
|
// otherwise the Mod-a shortcut key will be overridden.
|
||||||
priority: 110,
|
priority: 110,
|
||||||
|
fakeSelection: true,
|
||||||
addCommands() {
|
addCommands() {
|
||||||
return {
|
return {
|
||||||
...this.parent?.(),
|
...this.parent?.(),
|
||||||
|
|
|
@ -4,6 +4,7 @@ const Column = Node.create({
|
||||||
name: "column",
|
name: "column",
|
||||||
content: "block+",
|
content: "block+",
|
||||||
isolating: true,
|
isolating: true,
|
||||||
|
fakeSelection: true,
|
||||||
|
|
||||||
addOptions() {
|
addOptions() {
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -44,6 +44,7 @@ declare module "@/tiptap" {
|
||||||
|
|
||||||
const Iframe = Node.create<ExtensionOptions>({
|
const Iframe = Node.create<ExtensionOptions>({
|
||||||
name: "iframe",
|
name: "iframe",
|
||||||
|
fakeSelection: true,
|
||||||
|
|
||||||
inline() {
|
inline() {
|
||||||
return true;
|
return true;
|
||||||
|
|
|
@ -30,6 +30,8 @@ import BubbleItemImageSize from "./BubbleItemImageSize.vue";
|
||||||
import ImageView from "./ImageView.vue";
|
import ImageView from "./ImageView.vue";
|
||||||
|
|
||||||
const Image = TiptapImage.extend<ExtensionOptions & ImageOptions>({
|
const Image = TiptapImage.extend<ExtensionOptions & ImageOptions>({
|
||||||
|
fakeSelection: true,
|
||||||
|
|
||||||
inline() {
|
inline() {
|
||||||
return true;
|
return true;
|
||||||
},
|
},
|
||||||
|
|
|
@ -61,16 +61,13 @@ const ExtensionRangeSelection = Extension.create({
|
||||||
if (node.isText || node.type.name === "paragraph") {
|
if (node.isText || node.type.name === "paragraph") {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let className = "no-selection";
|
|
||||||
if (node.type.spec.fakeSelection) {
|
if (node.type.spec.fakeSelection) {
|
||||||
className = className + " range-fake-selection";
|
decorations.push(
|
||||||
|
Decoration.node(pos, pos + node.nodeSize, {
|
||||||
|
class: "no-selection range-fake-selection",
|
||||||
|
})
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
decorations.push(
|
|
||||||
Decoration.node(pos, pos + node.nodeSize, {
|
|
||||||
class: className,
|
|
||||||
})
|
|
||||||
);
|
|
||||||
});
|
});
|
||||||
return DecorationSet.create(doc, decorations);
|
return DecorationSet.create(doc, decorations);
|
||||||
},
|
},
|
||||||
|
@ -155,7 +152,7 @@ const ExtensionRangeSelection = Extension.create({
|
||||||
return {
|
return {
|
||||||
fakeSelection:
|
fakeSelection:
|
||||||
callOrReturn(getExtensionField(extension, "fakeSelection", context)) ??
|
callOrReturn(getExtensionField(extension, "fakeSelection", context)) ??
|
||||||
true,
|
false,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
|
@ -209,7 +209,6 @@ class TableView implements NodeView {
|
||||||
|
|
||||||
const Table = TiptapTable.extend<ExtensionOptions & TableOptions>({
|
const Table = TiptapTable.extend<ExtensionOptions & TableOptions>({
|
||||||
allowGapCursor: true,
|
allowGapCursor: true,
|
||||||
fakeSelection: false,
|
|
||||||
|
|
||||||
addExtensions() {
|
addExtensions() {
|
||||||
return [TableCell, TableRow, TableHeader];
|
return [TableCell, TableRow, TableHeader];
|
||||||
|
|
|
@ -27,6 +27,7 @@ const TableCell = Node.create<TableCellOptions>({
|
||||||
content: "block+",
|
content: "block+",
|
||||||
tableRole: "cell",
|
tableRole: "cell",
|
||||||
isolating: true,
|
isolating: true,
|
||||||
|
fakeSelection: true,
|
||||||
|
|
||||||
addOptions() {
|
addOptions() {
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -21,6 +21,7 @@ const TableHeader = Node.create<TableCellOptions>({
|
||||||
content: "block+",
|
content: "block+",
|
||||||
tableRole: "header_cell",
|
tableRole: "header_cell",
|
||||||
isolating: true,
|
isolating: true,
|
||||||
|
fakeSelection: true,
|
||||||
|
|
||||||
addOptions() {
|
addOptions() {
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -2,7 +2,6 @@ import { TableRow as BuiltInTableRow } from "@tiptap/extension-table-row";
|
||||||
|
|
||||||
const TableRow = BuiltInTableRow.extend({
|
const TableRow = BuiltInTableRow.extend({
|
||||||
allowGapCursor: false,
|
allowGapCursor: false,
|
||||||
fakeSelection: false,
|
|
||||||
|
|
||||||
addAttributes() {
|
addAttributes() {
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -44,6 +44,7 @@ declare module "@/tiptap" {
|
||||||
|
|
||||||
const Video = Node.create<ExtensionOptions>({
|
const Video = Node.create<ExtensionOptions>({
|
||||||
name: "video",
|
name: "video",
|
||||||
|
fakeSelection: true,
|
||||||
|
|
||||||
inline() {
|
inline() {
|
||||||
return true;
|
return true;
|
||||||
|
|
Loading…
Reference in New Issue