Questions tagged [slatejs]

Slate is a customizable JavaScript framework for creating rich text editors.

96 questions
4
votes
1 answer

SlateJS apply bold to regex match

I am trying to apply bold to **text** in slatejs editor and so far my attempts have been unsuccessful. I came across this answer which seems to be a possible solution to the problem. However, after modifying that answer it still refused to apply…
Feelsbadman
  • 1,163
  • 4
  • 17
  • 37
4
votes
1 answer

How to get cursor position or selection in slatejs?

I am creating a basic editor using slate.js and React.js. I want to insert text inside the editor at current selected position when i click on a card outside the editor i.e. when i click on a card containing a text, the card on text should get…
Sawan Patodia
  • 773
  • 5
  • 13
4
votes
2 answers

How to move the cursor to the end of the current line with Slate.js?

I want to mimic the end of line shortcut behavior in macOS. I have this: onKeyDown (event, change, next) { if (event.key === 'ArrowRight') { if (event.metaKey) { event.preventDefault(); change.moveTo(5); …
Pier
  • 10,298
  • 17
  • 67
  • 113
3
votes
0 answers

How to externally edit SlateJS editor values

I'm recreating Discord chat. I'm using SlateJS to achieve this. I have many editors displayed on the page, and I have an Emoji Button. I'd like to be able to externally edit the value of the editors, so when a click on an emoji, the name of it is…
3
votes
1 answer

Can I create nested list in SlateJs?

I need to create nested list objects like : 1. Abc 2. def a. abc i. lmn ii. opq b. def 3. ghi I am using Slate Js as my editor where when a user presses tab I have added the code where the node is updated with its level : if…
Sonu Kumar
  • 31
  • 4
3
votes
0 answers

How can I add third party plugin into my Slate editor?

Hello guys I'm currently building my personal blog with SlateJs. I want to adopt some useful third-party plugins for the editor but I can't get it working. The code below is from the official Slate(v0.66.1) document and I built my editor with this…
Simon Jo
  • 65
  • 1
  • 5
3
votes
1 answer

Unable to delete a link clearly in Slate.js editor using the official example

CodeSandbox Example: https://codesandbox.io/s/slate-2-images-and-links-forked-s09wi This is basically the withLink() example from the official document. When you press backspace or cut out to remove the link, the JSON output still contains the link…
RedGiant
  • 4,444
  • 11
  • 59
  • 146
3
votes
1 answer

Creating a slate.js editor component that keeps its state in markdown

I want to create a slate.js-based editor component that keeps it's state in markdown. Slate.js docs keep repeating how simple serializing and deserializing state into md should be, but they don't provide an actual way to do it. I tried achieving…
Michal Kurz
  • 1,592
  • 13
  • 41
3
votes
2 answers

Slatejs how to make one specific node non-editable?

I want to set one specific node non-editable by Transforms.setNodes(editor,{at:[1]},{voids:true}) But it seems not working. Does anyone know how to do it? Thanks!
Yuqin Xu
  • 187
  • 1
  • 7
3
votes
1 answer

React Rich Text Editor that actually works in mobile?

I need to implement a rich text editor into a React app. The general choices are Draft, Slate, etc.. I tried probably all of the "top 15" editors. most fail miserably on Android. Draft is just unusable. Many have very strange behavior when selecting…
Mike D
  • 101
  • 7
3
votes
2 answers

Incorrect positioning of getBoundingClientRect after newline character

I'm trying to make a dropdown menu follow the cursor in a Rich Text Editor for the web. Using the following I'm able to get the cursor's coordinates no problem: const sel = window.getSelection(); if (!sel || sel.rangeCount === 0) return; const…
GomiNoSensei
  • 403
  • 5
  • 11
3
votes
1 answer

How to apply MathJax/KaTex to render a React component

I am making a web editor using React & SlateJS. There are LaTex code in the editor content and I want the user to see the rendered LaTex equations. MathJax and KaTex have auto-rendering feature by loading them as CDNs. Once they are loaded, the…
Xiaohui Liu
  • 51
  • 2
  • 6
2
votes
2 answers

How to clear all text in Slate.JS editor

For the life of me, I can't figure out how to clear all of the text in an Editor component from slate.js. I have tried: Transforms.delete(editor, {}); -> doesn't do anything editor.deleteBackward("line"); -> only deletes one line, not all I have…
2
votes
0 answers

SlateJS internal copy feature not working

Have been trying to build an open-source notion using #slatejs, not been able to find why the internal copy is not working on my editor. Multiple selections also just shows the last element in selection rather than showing all the elements…
2
votes
0 answers

SlateJS - Mention unable to continue typing after focus and cannot copy mention when focused by mouse click

I'm new to Slate JS and trying to implement a rich text editor with mention-functionality like Slack, Discord etc. The current mention example (here: mentions) has some limitations that I haven't managed to solve yet, for example: When the mention…
Antonio
  • 73
  • 1
  • 6