@tiptap/core 2.0.0-beta.156 → 2.0.0-beta.157
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/dist/tiptap-core.cjs.js +193 -138
- package/dist/tiptap-core.cjs.js.map +1 -1
- package/dist/tiptap-core.esm.js +193 -138
- package/dist/tiptap-core.esm.js.map +1 -1
- package/dist/tiptap-core.umd.js +193 -138
- package/dist/tiptap-core.umd.js.map +1 -1
- package/package.json +2 -2
- package/src/extensions/keymap.ts +70 -0
package/dist/tiptap-core.esm.js
CHANGED
|
@@ -1869,144 +1869,6 @@ const FocusEvents = Extension.create({
|
|
|
1869
1869
|
},
|
|
1870
1870
|
});
|
|
1871
1871
|
|
|
1872
|
-
const Keymap = Extension.create({
|
|
1873
|
-
name: 'keymap',
|
|
1874
|
-
addKeyboardShortcuts() {
|
|
1875
|
-
const handleBackspace = () => this.editor.commands.first(({ commands }) => [
|
|
1876
|
-
() => commands.undoInputRule(),
|
|
1877
|
-
() => commands.deleteSelection(),
|
|
1878
|
-
() => commands.joinBackward(),
|
|
1879
|
-
() => commands.selectNodeBackward(),
|
|
1880
|
-
]);
|
|
1881
|
-
const handleDelete = () => this.editor.commands.first(({ commands }) => [
|
|
1882
|
-
() => commands.deleteSelection(),
|
|
1883
|
-
() => commands.joinForward(),
|
|
1884
|
-
() => commands.selectNodeForward(),
|
|
1885
|
-
]);
|
|
1886
|
-
return {
|
|
1887
|
-
Enter: () => this.editor.commands.first(({ commands }) => [
|
|
1888
|
-
() => commands.newlineInCode(),
|
|
1889
|
-
() => commands.createParagraphNear(),
|
|
1890
|
-
() => commands.liftEmptyBlock(),
|
|
1891
|
-
() => commands.splitBlock(),
|
|
1892
|
-
]),
|
|
1893
|
-
'Mod-Enter': () => this.editor.commands.exitCode(),
|
|
1894
|
-
Backspace: handleBackspace,
|
|
1895
|
-
'Mod-Backspace': handleBackspace,
|
|
1896
|
-
'Shift-Backspace': handleBackspace,
|
|
1897
|
-
Delete: handleDelete,
|
|
1898
|
-
'Mod-Delete': handleDelete,
|
|
1899
|
-
'Mod-a': () => this.editor.commands.selectAll(),
|
|
1900
|
-
};
|
|
1901
|
-
},
|
|
1902
|
-
});
|
|
1903
|
-
|
|
1904
|
-
const Tabindex = Extension.create({
|
|
1905
|
-
name: 'tabindex',
|
|
1906
|
-
addProseMirrorPlugins() {
|
|
1907
|
-
return [
|
|
1908
|
-
new Plugin({
|
|
1909
|
-
key: new PluginKey('tabindex'),
|
|
1910
|
-
props: {
|
|
1911
|
-
attributes: {
|
|
1912
|
-
tabindex: '0',
|
|
1913
|
-
},
|
|
1914
|
-
},
|
|
1915
|
-
}),
|
|
1916
|
-
];
|
|
1917
|
-
},
|
|
1918
|
-
});
|
|
1919
|
-
|
|
1920
|
-
var extensions = /*#__PURE__*/Object.freeze({
|
|
1921
|
-
__proto__: null,
|
|
1922
|
-
ClipboardTextSerializer: ClipboardTextSerializer,
|
|
1923
|
-
Commands: Commands,
|
|
1924
|
-
Editable: Editable,
|
|
1925
|
-
FocusEvents: FocusEvents,
|
|
1926
|
-
Keymap: Keymap,
|
|
1927
|
-
Tabindex: Tabindex
|
|
1928
|
-
});
|
|
1929
|
-
|
|
1930
|
-
function getNodeAttributes(state, typeOrName) {
|
|
1931
|
-
const type = getNodeType(typeOrName, state.schema);
|
|
1932
|
-
const { from, to } = state.selection;
|
|
1933
|
-
const nodes = [];
|
|
1934
|
-
state.doc.nodesBetween(from, to, node => {
|
|
1935
|
-
nodes.push(node);
|
|
1936
|
-
});
|
|
1937
|
-
const node = nodes
|
|
1938
|
-
.reverse()
|
|
1939
|
-
.find(nodeItem => nodeItem.type.name === type.name);
|
|
1940
|
-
if (!node) {
|
|
1941
|
-
return {};
|
|
1942
|
-
}
|
|
1943
|
-
return { ...node.attrs };
|
|
1944
|
-
}
|
|
1945
|
-
|
|
1946
|
-
function getAttributes(state, typeOrName) {
|
|
1947
|
-
const schemaType = getSchemaTypeNameByName(typeof typeOrName === 'string'
|
|
1948
|
-
? typeOrName
|
|
1949
|
-
: typeOrName.name, state.schema);
|
|
1950
|
-
if (schemaType === 'node') {
|
|
1951
|
-
return getNodeAttributes(state, typeOrName);
|
|
1952
|
-
}
|
|
1953
|
-
if (schemaType === 'mark') {
|
|
1954
|
-
return getMarkAttributes(state, typeOrName);
|
|
1955
|
-
}
|
|
1956
|
-
return {};
|
|
1957
|
-
}
|
|
1958
|
-
|
|
1959
|
-
function isActive(state, name, attributes = {}) {
|
|
1960
|
-
if (!name) {
|
|
1961
|
-
return isNodeActive(state, null, attributes) || isMarkActive(state, null, attributes);
|
|
1962
|
-
}
|
|
1963
|
-
const schemaType = getSchemaTypeNameByName(name, state.schema);
|
|
1964
|
-
if (schemaType === 'node') {
|
|
1965
|
-
return isNodeActive(state, name, attributes);
|
|
1966
|
-
}
|
|
1967
|
-
if (schemaType === 'mark') {
|
|
1968
|
-
return isMarkActive(state, name, attributes);
|
|
1969
|
-
}
|
|
1970
|
-
return false;
|
|
1971
|
-
}
|
|
1972
|
-
|
|
1973
|
-
function getHTMLFromFragment(fragment, schema) {
|
|
1974
|
-
const documentFragment = DOMSerializer
|
|
1975
|
-
.fromSchema(schema)
|
|
1976
|
-
.serializeFragment(fragment);
|
|
1977
|
-
const temporaryDocument = document.implementation.createHTMLDocument();
|
|
1978
|
-
const container = temporaryDocument.createElement('div');
|
|
1979
|
-
container.appendChild(documentFragment);
|
|
1980
|
-
return container.innerHTML;
|
|
1981
|
-
}
|
|
1982
|
-
|
|
1983
|
-
function getText(node, options) {
|
|
1984
|
-
const range = {
|
|
1985
|
-
from: 0,
|
|
1986
|
-
to: node.content.size,
|
|
1987
|
-
};
|
|
1988
|
-
return getTextBetween(node, range, options);
|
|
1989
|
-
}
|
|
1990
|
-
|
|
1991
|
-
function isNodeEmpty(node) {
|
|
1992
|
-
var _a;
|
|
1993
|
-
const defaultContent = (_a = node.type.createAndFill()) === null || _a === void 0 ? void 0 : _a.toJSON();
|
|
1994
|
-
const content = node.toJSON();
|
|
1995
|
-
return JSON.stringify(defaultContent) === JSON.stringify(content);
|
|
1996
|
-
}
|
|
1997
|
-
|
|
1998
|
-
function createStyleTag(style) {
|
|
1999
|
-
const tipTapStyleTag = document.querySelector('style[data-tiptap-style]');
|
|
2000
|
-
if (tipTapStyleTag !== null) {
|
|
2001
|
-
return tipTapStyleTag;
|
|
2002
|
-
}
|
|
2003
|
-
const styleNode = document.createElement('style');
|
|
2004
|
-
styleNode.setAttribute('data-tiptap-style', '');
|
|
2005
|
-
styleNode.innerHTML = style;
|
|
2006
|
-
document.getElementsByTagName('head')[0].appendChild(styleNode);
|
|
2007
|
-
return styleNode;
|
|
2008
|
-
}
|
|
2009
|
-
|
|
2010
1872
|
function createChainableState(config) {
|
|
2011
1873
|
const { state, transaction } = config;
|
|
2012
1874
|
let { selection } = transaction;
|
|
@@ -2149,6 +2011,199 @@ class CommandManager {
|
|
|
2149
2011
|
}
|
|
2150
2012
|
}
|
|
2151
2013
|
|
|
2014
|
+
const Keymap = Extension.create({
|
|
2015
|
+
name: 'keymap',
|
|
2016
|
+
addKeyboardShortcuts() {
|
|
2017
|
+
const handleBackspace = () => this.editor.commands.first(({ commands }) => [
|
|
2018
|
+
() => commands.undoInputRule(),
|
|
2019
|
+
// maybe convert first text block node to default node
|
|
2020
|
+
() => commands.command(({ tr }) => {
|
|
2021
|
+
const { selection, doc } = tr;
|
|
2022
|
+
const { empty, $anchor } = selection;
|
|
2023
|
+
const { pos, parent } = $anchor;
|
|
2024
|
+
const isAtStart = Selection.atStart(doc).from === pos;
|
|
2025
|
+
if (!empty
|
|
2026
|
+
|| !isAtStart
|
|
2027
|
+
|| !parent.type.isTextblock
|
|
2028
|
+
|| parent.textContent.length) {
|
|
2029
|
+
return false;
|
|
2030
|
+
}
|
|
2031
|
+
return commands.clearNodes();
|
|
2032
|
+
}),
|
|
2033
|
+
() => commands.deleteSelection(),
|
|
2034
|
+
() => commands.joinBackward(),
|
|
2035
|
+
() => commands.selectNodeBackward(),
|
|
2036
|
+
]);
|
|
2037
|
+
const handleDelete = () => this.editor.commands.first(({ commands }) => [
|
|
2038
|
+
() => commands.deleteSelection(),
|
|
2039
|
+
() => commands.joinForward(),
|
|
2040
|
+
() => commands.selectNodeForward(),
|
|
2041
|
+
]);
|
|
2042
|
+
return {
|
|
2043
|
+
Enter: () => this.editor.commands.first(({ commands }) => [
|
|
2044
|
+
() => commands.newlineInCode(),
|
|
2045
|
+
() => commands.createParagraphNear(),
|
|
2046
|
+
() => commands.liftEmptyBlock(),
|
|
2047
|
+
() => commands.splitBlock(),
|
|
2048
|
+
]),
|
|
2049
|
+
'Mod-Enter': () => this.editor.commands.exitCode(),
|
|
2050
|
+
Backspace: handleBackspace,
|
|
2051
|
+
'Mod-Backspace': handleBackspace,
|
|
2052
|
+
'Shift-Backspace': handleBackspace,
|
|
2053
|
+
Delete: handleDelete,
|
|
2054
|
+
'Mod-Delete': handleDelete,
|
|
2055
|
+
'Mod-a': () => this.editor.commands.selectAll(),
|
|
2056
|
+
};
|
|
2057
|
+
},
|
|
2058
|
+
addProseMirrorPlugins() {
|
|
2059
|
+
return [
|
|
2060
|
+
// With this plugin we check if the whole document was selected and deleted.
|
|
2061
|
+
// In this case we will additionally call `clearNodes()` to convert e.g. a heading
|
|
2062
|
+
// to a paragraph if necessary.
|
|
2063
|
+
// This is an alternative to ProseMirror's `AllSelection`, which doesn’t work well
|
|
2064
|
+
// with many other commands.
|
|
2065
|
+
new Plugin({
|
|
2066
|
+
key: new PluginKey('clearDocument'),
|
|
2067
|
+
appendTransaction: (transactions, oldState, newState) => {
|
|
2068
|
+
const docChanges = transactions.some(transaction => transaction.docChanged)
|
|
2069
|
+
&& !oldState.doc.eq(newState.doc);
|
|
2070
|
+
if (!docChanges) {
|
|
2071
|
+
return;
|
|
2072
|
+
}
|
|
2073
|
+
const { empty, from, to } = oldState.selection;
|
|
2074
|
+
const allFrom = Selection.atStart(oldState.doc).from;
|
|
2075
|
+
const allEnd = Selection.atEnd(oldState.doc).to;
|
|
2076
|
+
const allWasSelected = from === allFrom && to === allEnd;
|
|
2077
|
+
const isEmpty = newState.doc.textBetween(0, newState.doc.content.size, ' ', ' ').length === 0;
|
|
2078
|
+
if (empty || !allWasSelected || !isEmpty) {
|
|
2079
|
+
return;
|
|
2080
|
+
}
|
|
2081
|
+
const tr = newState.tr;
|
|
2082
|
+
const state = createChainableState({
|
|
2083
|
+
state: newState,
|
|
2084
|
+
transaction: tr,
|
|
2085
|
+
});
|
|
2086
|
+
const { commands } = new CommandManager({
|
|
2087
|
+
editor: this.editor,
|
|
2088
|
+
state,
|
|
2089
|
+
});
|
|
2090
|
+
commands.clearNodes();
|
|
2091
|
+
if (!tr.steps.length) {
|
|
2092
|
+
return;
|
|
2093
|
+
}
|
|
2094
|
+
return tr;
|
|
2095
|
+
},
|
|
2096
|
+
}),
|
|
2097
|
+
];
|
|
2098
|
+
},
|
|
2099
|
+
});
|
|
2100
|
+
|
|
2101
|
+
const Tabindex = Extension.create({
|
|
2102
|
+
name: 'tabindex',
|
|
2103
|
+
addProseMirrorPlugins() {
|
|
2104
|
+
return [
|
|
2105
|
+
new Plugin({
|
|
2106
|
+
key: new PluginKey('tabindex'),
|
|
2107
|
+
props: {
|
|
2108
|
+
attributes: {
|
|
2109
|
+
tabindex: '0',
|
|
2110
|
+
},
|
|
2111
|
+
},
|
|
2112
|
+
}),
|
|
2113
|
+
];
|
|
2114
|
+
},
|
|
2115
|
+
});
|
|
2116
|
+
|
|
2117
|
+
var extensions = /*#__PURE__*/Object.freeze({
|
|
2118
|
+
__proto__: null,
|
|
2119
|
+
ClipboardTextSerializer: ClipboardTextSerializer,
|
|
2120
|
+
Commands: Commands,
|
|
2121
|
+
Editable: Editable,
|
|
2122
|
+
FocusEvents: FocusEvents,
|
|
2123
|
+
Keymap: Keymap,
|
|
2124
|
+
Tabindex: Tabindex
|
|
2125
|
+
});
|
|
2126
|
+
|
|
2127
|
+
function getNodeAttributes(state, typeOrName) {
|
|
2128
|
+
const type = getNodeType(typeOrName, state.schema);
|
|
2129
|
+
const { from, to } = state.selection;
|
|
2130
|
+
const nodes = [];
|
|
2131
|
+
state.doc.nodesBetween(from, to, node => {
|
|
2132
|
+
nodes.push(node);
|
|
2133
|
+
});
|
|
2134
|
+
const node = nodes
|
|
2135
|
+
.reverse()
|
|
2136
|
+
.find(nodeItem => nodeItem.type.name === type.name);
|
|
2137
|
+
if (!node) {
|
|
2138
|
+
return {};
|
|
2139
|
+
}
|
|
2140
|
+
return { ...node.attrs };
|
|
2141
|
+
}
|
|
2142
|
+
|
|
2143
|
+
function getAttributes(state, typeOrName) {
|
|
2144
|
+
const schemaType = getSchemaTypeNameByName(typeof typeOrName === 'string'
|
|
2145
|
+
? typeOrName
|
|
2146
|
+
: typeOrName.name, state.schema);
|
|
2147
|
+
if (schemaType === 'node') {
|
|
2148
|
+
return getNodeAttributes(state, typeOrName);
|
|
2149
|
+
}
|
|
2150
|
+
if (schemaType === 'mark') {
|
|
2151
|
+
return getMarkAttributes(state, typeOrName);
|
|
2152
|
+
}
|
|
2153
|
+
return {};
|
|
2154
|
+
}
|
|
2155
|
+
|
|
2156
|
+
function isActive(state, name, attributes = {}) {
|
|
2157
|
+
if (!name) {
|
|
2158
|
+
return isNodeActive(state, null, attributes) || isMarkActive(state, null, attributes);
|
|
2159
|
+
}
|
|
2160
|
+
const schemaType = getSchemaTypeNameByName(name, state.schema);
|
|
2161
|
+
if (schemaType === 'node') {
|
|
2162
|
+
return isNodeActive(state, name, attributes);
|
|
2163
|
+
}
|
|
2164
|
+
if (schemaType === 'mark') {
|
|
2165
|
+
return isMarkActive(state, name, attributes);
|
|
2166
|
+
}
|
|
2167
|
+
return false;
|
|
2168
|
+
}
|
|
2169
|
+
|
|
2170
|
+
function getHTMLFromFragment(fragment, schema) {
|
|
2171
|
+
const documentFragment = DOMSerializer
|
|
2172
|
+
.fromSchema(schema)
|
|
2173
|
+
.serializeFragment(fragment);
|
|
2174
|
+
const temporaryDocument = document.implementation.createHTMLDocument();
|
|
2175
|
+
const container = temporaryDocument.createElement('div');
|
|
2176
|
+
container.appendChild(documentFragment);
|
|
2177
|
+
return container.innerHTML;
|
|
2178
|
+
}
|
|
2179
|
+
|
|
2180
|
+
function getText(node, options) {
|
|
2181
|
+
const range = {
|
|
2182
|
+
from: 0,
|
|
2183
|
+
to: node.content.size,
|
|
2184
|
+
};
|
|
2185
|
+
return getTextBetween(node, range, options);
|
|
2186
|
+
}
|
|
2187
|
+
|
|
2188
|
+
function isNodeEmpty(node) {
|
|
2189
|
+
var _a;
|
|
2190
|
+
const defaultContent = (_a = node.type.createAndFill()) === null || _a === void 0 ? void 0 : _a.toJSON();
|
|
2191
|
+
const content = node.toJSON();
|
|
2192
|
+
return JSON.stringify(defaultContent) === JSON.stringify(content);
|
|
2193
|
+
}
|
|
2194
|
+
|
|
2195
|
+
function createStyleTag(style) {
|
|
2196
|
+
const tipTapStyleTag = document.querySelector('style[data-tiptap-style]');
|
|
2197
|
+
if (tipTapStyleTag !== null) {
|
|
2198
|
+
return tipTapStyleTag;
|
|
2199
|
+
}
|
|
2200
|
+
const styleNode = document.createElement('style');
|
|
2201
|
+
styleNode.setAttribute('data-tiptap-style', '');
|
|
2202
|
+
styleNode.innerHTML = style;
|
|
2203
|
+
document.getElementsByTagName('head')[0].appendChild(styleNode);
|
|
2204
|
+
return styleNode;
|
|
2205
|
+
}
|
|
2206
|
+
|
|
2152
2207
|
class InputRule {
|
|
2153
2208
|
constructor(config) {
|
|
2154
2209
|
this.find = config.find;
|