Slate is a customizable JavaScript framework for creating rich text editors.
Questions tagged [slatejs]
96 questions
1
vote
0 answers
How to connect highlight and comment functionality in React JS to backend (or local storage)
I am given the task to do the following:
Select text (i am using selection API for that)
Either add highlight or Comment to that text
Send this highlighted or commented state to backend so that user can get his highlights on loading
I have…
Asad Zubair Bhatti
- 71
- 4
1
vote
1 answer
Replace all PlateJS editor contents with another one
I've got pre-saved Nodes[] ([{ children: [{ text: 'bla' }] },{ children: [{ text: 'bla2' }] }]) and I want to replace current editor content with my pre-saved one, but programmatically (not using initialValue). I've tried using transforms, but got…
Oleg Vdovenko
- 360
- 2
- 13
1
vote
1 answer
How do I make a specific word uneditable in Slate.js?
I'm creating a rich text editor for my application. The content, is generated automatically from a template which may contain variables. What I am trying to achieve here is, I want to be able to make a specific word uneditable in the editor. To be…
omarqe
- 59
- 12
1
vote
1 answer
Slatejs: How at query and update an existing node?
I am trying to do something like this in order to updated and already existed node, but the docs are not clear about it.
const paht = [0,1,1,2]
const data: any = {
type: 'ref',
id: uniqid(),
data:…
Ali Husham
- 816
- 10
- 31
1
vote
0 answers
Slate js path is null error when pasting html
I have upgraded my slate version to 0.66.5 and slate-react to 0.68.0 but now I am ruuning into the following issue:
This issue occurs when I paste html content from third party sources.
Snippets of the code are as follows:
const withHtml = (editor)…
Ayan
- 2,738
- 3
- 35
- 76
1
vote
0 answers
Slate.js - curly braces not working as mention
Trying to rework the Mentions example to use two curly braces ({{) instead of an @ symbol for triggering the popup. Would eventually like selected text to render as:
{{R2-D2}} instead of @R2-D2.
The issue seems to be that beforeText is not getting…
user2521295
- 823
- 2
- 12
- 23
1
vote
1 answer
SlateJS: show floating toolbar above active block only
I am creating a SlateJS editor using @udecode/slate-plugins. I got most of the editor working but, are trying to create a toolbar for table blocks that should be visible above the table when it is selected/active.
The toolbar are currently showing…
Rajohan
- 1,411
- 2
- 10
- 27
1
vote
2 answers
How to create Read_More and Read_less button in Slatejs
In this link you can find the read_more/read_less functionality, but in slatejs we don't have direct access to the text. So, how to create that functionality in saltejs in the slatejs way.
I tried to create use ref
const dots =…
Ali Husham
- 816
- 10
- 31
1
vote
0 answers
mdast-util-to-markdown: prevent linebreaks occurring between list items?
For some context I am trying to build a Slate.js based editor that can convert the editor contents to markdown. To do this I am using remark-slate-transformer, which itself uses mdast-util-to-markdown, which has a tendency to insert line breaks…
James Harrison
- 323
- 4
- 12
1
vote
0 answers
Slatejs and React-select: setNodes causes an infinite recursion while rendering?
Within a custom element in my Slate.js editor, I have this logic for updating the properties of the element:
const changeProps = ({name, opts, defaultValue}: TemplateBlockProps) => {
let path = ReactEditor.findPath(editor, element)
…
James Harrison
- 323
- 4
- 12
1
vote
2 answers
SlateJS Typscript node.children url and type property does not exist
TLDR:
Error message for SlateJS serializing to HTML
Property 'children' does not exist on type 'Node[]'.
Going off on SlateJS Serializing Docs but in tsx.
import React, { useCallback, useMemo, useState } from "react";
import escapeHtml from…
Asolace
- 1,006
- 8
- 9
1
vote
3 answers
How to add paragraph after image within a Slate text editor?
I am currently working on rich text editor based on Slate. I need to implement possibility to insert a paragraph right after an image, when image is focused. Now when the image has focus and I press the Enter button but nothing happened. It should…
Max Vorozhcov
- 593
- 1
- 6
- 22
1
vote
1 answer
SlateJS - Hovering toolbar example problem - selection & toolbar disappear randomly
I'm trying to set up Slate Hovering Toolbar example in my React application. Here are example and…
user11765835
1
vote
1 answer
How to set slate value based on the plain string value(serialized)
I am building a rich text editor with slate js on React and I need to parse URL from the content(for example: www.website.me should be transformed to www.website.me).
I have already implemented the function to parse URL from plain text and then wrap…
Pety Ialimijoro Rakotoniaina
- 304
- 2
- 11
1
vote
0 answers
React onKeyPress fire default event
I have a control where I would like to execute some logic before and after a key press.
onKeyPress={event => {
...
}}
I can do event.preventDefault();, to cancel a default event, or not use it to not cancel it. However, I would like to execute…
Gru
- 400
- 2
- 8