Question: Inserting a New Line. #3366

Activity

1. nrikiji

   added

   enhancementImprovement over existing featureImprovement over existing feature

   on Nov 16, 2022
2. zignis commented on Nov 21, 2022

   

   zignis

   on Nov 21, 2022

   Contributor

   More actions

   Is it possible to insert a line that preserves the status of the previous line when a new line is inserted with the enter key? If you have a sample code, could you please let me know?

   That is not the behavior in Lexical's Playground. Also, the Draft.js demo has that behavior.

   You can try line break node or $createTextNode with $createParagraphNode (kind of hack):

   import {
     $createTextNode,
     $createParagraphNode,
     $insertNodes,
   } from 'lexical';
   
   ...
   
   const textNode = $createTextNode('\n');
   const paragraphNode = $createParagraphNode();
   paragraphNode.append(textNode);
   
   $insertNodes([paragraphNode]);
3. acywatson commented on Nov 23, 2022

   

   acywatson

   on Nov 23, 2022

   Contributor

   More actions

   Is it possible to insert a line that preserves the status of the previous line when a new line is inserted with the enter key? If you have a sample code, could you please let me know?

   That is not the behavior in Lexical's Playground. Also, the Draft.js demo has that behavior.

   When you say "preserves the status" what do you mean, exactly?
4. nrikiji

   closed this as completedon Nov 23, 2022
5. nrikiji commented on Nov 23, 2022

   

   nrikiji

   on Nov 23, 2022

   Last edited by nrikiji

   Author

   More actions

   @zignis
   Thanks for the reply. Is it like adding a node by handling the enter key around the following?

   editor.registerUpdateListener(({ editorState }) => {
       ・・・
   });
   ・・・
   editor.update(() => {
       ・・・
   });
6. nrikiji commented on Nov 23, 2022

   

   nrikiji

   on Nov 23, 2022

   Author

   More actions

   @acywatson
   Thanks for the reply. For example, we want to continue the selected font size and color in the next line.
7. zignis commented on Nov 23, 2022

   

   zignis

   on Nov 23, 2022

   Contributor

   More actions

   @zignis Thanks for the reply. Is it like adding a node by handling the enter key around the following?

   editor.registerUpdateListener(({ editorState }) => {
       ・・・
   });
   ・・・
   editor.update(() => {
       ・・・
   });

   Yes, you may want to take a look at how the @lexical/code package does it: https://github.com/facebook/lexical/blob/main/packages/lexical-code/src/CodeHighlighter.ts#L515
8. meta

   locked and limited conversation to collaborators on Nov 25, 2022
9. thegreatercurve

   converted this issue into a discussion #3423 on Nov 25, 2022