Comments (3)
I got around this issue with normalization:
This removes the added table but inserts the text contained in it.
[tableCell]: {
nodes: [
{
match: [{type: paragraph}],
},
],
normalize(editor, error) {
const {code: violation, node, index, child} = error;
debugger;
if (violation === 'child_type_invalid') {
if (child.type === table) {
return editor.removeNodeByKey(child.key).insertText(child.text);
}
}
},
},
from slate-deep-table.
@jasonphillips your approach sounds good. Btw I found this PR from Slate related.
Currently I am trying to unwrap table during onPaste instead (may take some time as I am very new to Slate). I think the weirdness is due to mainly when you "paste" content, which usually we expect only the shallow content should be pasted. This is not the perfect solution but I may settle for it in the mean time.
Update:
The onPaste function I used:
function onPaste(event, editor, next) {
const transfer = getEventTransfer(event);
if (transfer.type == "fragment") {
const { fragment } = transfer;
const topNode = fragment.nodes.first();
if (topNode.type == "table") {
// if the root node is a table, find the cell node and insert/paste all childs
const cellNode = topNode.findDescendant(n => n.type === "table_cell");
if (cellNode) {
cellNode.nodes.forEach(n => {
editor.insertBlock(n);
});
return;
}
}
}
return next();
}
from slate-deep-table.
This does need to be addressed... I suppose the original situation is that this 'deep' table was built to permit any kind of nesting, even sub-tables (which are part of the demo), so I didn't want to forbid it in the schema--but for most use cases, that allows things like accidentally pasting a table into a table when that wasn't user intent.
Following on @omar-sr88 , I think I may add an option that lets you specify whether to restrict the blocks permitted inside cells, so that if you don't permit the table type, it would do as the code above and extract the contents of the table paste. But I think I'd prefer passing a list of permitted blocks rather than checking for a single 'paragraph' type as above, because even for my own application use cases, the paragraph is default but I also permit list items etc as first-order children in my cells.
Maybe the option could look like this?
const plugin = DeepTable({ allowedContentBlocks: ['paragraph', 'ordered-list', 'unordered-list'] })
And then, have it generate schema code that unwraps anything else. I'm not sure if simply using child.text
as above is ideal, because cells may contain other structured content (again, list items etc) to preserve, so I suspect unwrap is the approach I'd have to take.
from slate-deep-table.
Related Issues (17)
- How to serialise table? HOT 2
- onKeyDown swallows events HOT 2
- Does not work with latest slate version [email protected] HOT 1
- wrong new keyword HOT 1
- How to use setColumnAlign ? HOT 1
- How can merge cells be implemented inside slate-deep-table? HOT 3
- Captions for tables
- Is this package alive? HOT 1
- Toggle headers and deserialization HOT 9
- Undo/Redo on removeNodeByKey HOT 3
- InsertTableByKey/Path HOT 1
- Suggested Enhancement: Copy Paste from external sources
- Colspan and rowspan handling
- Focus on first element when [New row] tab
- support typescript
- Support for v0.5 HOT 10
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from slate-deep-table.