const htmlSample1 = '''

AppFlowyEditor

đź‘‹ Welcome to AppFlowy Editor

AppFlowy Editor is a highly customizable rich-text editor

Here is an example your you can give a try

Span element

Span element two

Span element three

This is an anchor tag!

Features!

This is a quote!

Code block

Italic one

Italic two

Bold tag

You can also use AppFlowy Editor as a component to build your own app.

Awesome features

If you have questions or feedback, please submit an issue on Github or join the community along with 1000+ builders!

'''; const documentSample1 = { 'document': { 'type': 'page', 'children': [ { 'type': 'heading', 'data': { 'level': 1, 'delta': [ {'insert': 'AppFlowyEditor'}, ], }, }, { 'type': 'heading', 'data': { 'level': 2, 'delta': [ {'insert': 'đź‘‹ '}, { 'insert': 'Welcome to', 'attributes': {'bold': true}, }, {'insert': ' '}, { 'insert': 'AppFlowy Editor', 'attributes': {'bold': true, 'italic': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': 'AppFlowy Editor is a '}, { 'insert': 'highly customizable', 'attributes': {'bold': true}, }, {'insert': ' '}, { 'insert': 'rich-text editor', 'attributes': {'italic': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': ' '}, { 'insert': 'Here', 'attributes': {'underline': true}, }, {'insert': ' is an example '}, { 'insert': 'your', 'attributes': {'strikethrough': true}, }, {'insert': ' you can give a try'}, ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': ' '}, { 'insert': 'Span element', 'attributes': {'bold': true, 'italic': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': ' '}, { 'insert': 'Span element two', 'attributes': {'underline': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': ' '}, { 'insert': 'Span element three', 'attributes': {'bold': true, 'strikethrough': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': ' '}, { 'insert': 'This is an anchor tag!', 'attributes': {'href': 'https://appflowy.io'}, } ], }, }, { 'type': 'heading', 'data': { 'level': 3, 'delta': [ {'insert': 'Features!'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': '[x] Customizable'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': '[x] Test-covered'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': '[ ] more to come!'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': 'First item'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': 'Second item'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': 'List element'}, ], }, }, { 'type': 'quote', 'data': { 'delta': [ {'insert': 'This is a quote!'}, ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ { 'insert': ' Code block', 'attributes': {'code': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': ' '}, { 'insert': 'Italic one', 'attributes': {'italic': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': ' '}, { 'insert': 'Italic two', 'attributes': {'italic': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': ' '}, { 'insert': 'Bold tag', 'attributes': {'bold': true}, } ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ {'insert': 'You can also use '}, { 'insert': 'AppFlowy Editor', 'attributes': {'bold': true, 'italic': true}, }, {'insert': ' as a component to build your own app. '}, ], }, }, { 'type': 'heading', 'data': { 'level': 3, 'delta': [ {'insert': 'Awesome features'}, ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ { 'insert': 'If you have questions or feedback, please submit an issue on Github or join the community along with 1000+ builders!', } ], }, }, { 'type': 'paragraph', 'data': {'delta': []}, }, { 'type': 'paragraph', 'data': {'delta': []}, } ], }, }; const htmlSample2 = '''

a

c

b

d

'''; const documentSample2 = { "document": { "type": "page", "children": [ { "type": "table", "children": [ { "type": "table/cell", "children": [ { "type": "heading", "data": { "delta": [ {"insert": "a"}, ], "level": 2, }, } ], "data": { "colPosition": 0, "rowPosition": 0, "height": 40.0, "width": 160.0, }, }, { "type": "table/cell", "children": [ { "type": "paragraph", "data": { "delta": [ { "insert": "c", "attributes": {"italic": true}, } ], }, } ], "data": { "colPosition": 1, "rowPosition": 0, "height": 40.0, "width": 160.0, }, }, { "type": "table/cell", "children": [ { "type": "paragraph", "data": { "delta": [ { "insert": "b", "attributes": {"bold": true}, } ], }, } ], "data": { "colPosition": 0, "rowPosition": 1, "height": 40.0, "width": 160.0, }, }, { "type": "table/cell", "children": [ { "type": "paragraph", "data": { "delta": [ {"insert": "d"}, ], }, } ], "data": { "colPosition": 1, "rowPosition": 1, "height": 40.0, "width": 160.0, }, } ], "data": { "rowsLen": 2, "colsLen": 2, "colDefaultWidth": 160, "rowDefaultHeight": 40, "colMinimumWidth": 40, }, } ], }, }; const htmlSample3 = '''

Welcome to the playground

In case you were wondering what the black box at the bottom is – it's the debug view, showing the current state of the editor. You can disable it by pressing on the settings control in the bottom-left of your screen and toggling the debug view setting. The playground is a demo environment built with @lexical/react. Try typing in some text with different formats.

Make sure to check out the various plugins in the toolbar. You can also use #hashtags or @-mentions too!

If you'd like to find out more about Lexical, you can:

Lastly, we're constantly adding cool new features to this playground. So make sure you check back here when you next get a chance 🙂.

'''; const documentSample3 = { 'document': { 'type': 'page', 'children': [ { 'type': 'heading', 'data': { 'level': 1, 'delta': [ {'insert': 'Welcome to the playground'}, ], }, }, { 'type': 'quote', 'data': { 'delta': [ { 'insert': 'In case you were wondering what the black box at the bottom is – it\'s the debug view, showing the current state of the editor. You can disable it by pressing on the settings control in the bottom-left of your screen and toggling the debug view setting. The playground is a demo environment built with ', }, { 'insert': '@lexical/react', 'attributes': {'code': true}, }, {'insert': '. Try typing in '}, { 'insert': 'some text', 'attributes': { 'bold': true, "italic": true, 'href': 'https://appflowy.io', }, }, {'insert': ' with '}, { 'insert': 'different', 'attributes': {'italic': true}, }, {'insert': ' formats.'}, ], }, }, { 'type': 'image', 'data': { 'url': 'https://richtexteditor.com/images/editor-image.png', 'align': 'center', }, }, { 'type': 'paragraph', 'data': { 'delta': [ { 'insert': 'Make sure to check out the various plugins in the toolbar. You can also use #hashtags or @-mentions too!', } ], }, }, { 'type': 'paragraph', 'data': {'delta': []}, }, { 'type': 'paragraph', 'data': { 'delta': [ { 'insert': 'If you\'d like to find out more about Lexical, you can:', } ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': 'Visit the '}, { 'insert': 'Lexical website', 'attributes': {'href': 'https://lexical.dev/'}, }, {'insert': ' for documentation and more information.'}, ], }, }, { 'type': 'bulleted_list', 'children': [ { 'type': 'image', 'data': { 'url': 'https://richtexteditor.com/images/editor-image.png', 'align': 'center', }, } ], 'data': {'delta': []}, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': 'Check out the code on our '}, { 'insert': 'GitHub repository', 'attributes': {'href': 'https://github.com/facebook/lexical'}, }, {'insert': '.'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': 'Playground code can be found '}, { 'insert': 'here', 'attributes': { 'href': 'https://github.com/facebook/lexical/tree/main/packages/lexical-playground', }, }, {'insert': '.'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': 'Join our '}, { 'insert': 'Discord Server', 'attributes': {'href': 'https://discord.com/invite/KmG4wQnnD9'}, }, {'insert': ' and chat with the team.'}, ], }, }, { 'type': 'bulleted_list', 'data': { 'delta': [ {'insert': 'Playground code can be found '}, { 'insert': 'here', 'attributes': { 'href': 'https://github.com/facebook/lexical/tree/main/packages/lexical-playground', }, }, {'insert': '.'}, ], }, }, { 'type': 'paragraph', 'data': { 'delta': [ { 'insert': 'Lastly, we\'re constantly adding cool new features to this playground. So make sure you check back here when you next get a chance 🙂.', } ], }, }, { 'type': 'paragraph', 'data': {'delta': []}, } ], }, }; const htmlSample4 = '''

Problem

  1. Checkout conversion is too low: only 18% of users who click on “Book” checkout. Comparable funnels for hotel booking sites achieve ~30%(source).We are missing out!
  2. No clear dropout reason: prior support tickets and survey results show a long tail of possible issues (questions on amenities, fees, checkout time), no clear categories.
  3. Adding help content didn’t do much: last quarter we A/B tested content and UI to better point to help content and booking info. This nudged conversion by 1.5% points.
  4. I highly recommend bullets for readability. Use bold words to quickly convey the gist of each point, and limit bullets to 2-3 lines. I prefer numbered lists so one can refer to a point verbally.

'''; const documentSample4 = { "document": { "type": "page", "children": [ { "type": "heading", "data": { "delta": [ {"insert": "Problem"}, ], "level": 1, }, }, { "type": "numbered_list", "data": { "delta": [ { "insert": "Checkout conversion is too low: only 18% of users who click on “Book” checkout. Comparable funnels for hotel booking sites achieve ~30%(", }, { "insert": "source", "attributes": { "href": "https://skift.com/2014/03/18/online-booking-abandonment-is-huge-in-travel-as-consumers-comparison-shop/", }, }, {"insert": ").We are missing out!"}, ], }, }, { "type": "numbered_list", "data": { "delta": [ { "insert": "No clear dropout reason: prior support tickets and survey results show a long tail of possible issues (questions on amenities, fees, checkout time), no clear categories.", } ], }, }, { "type": "numbered_list", "data": { "delta": [ { "insert": "Adding help content didn’t do much: last quarter we A/B tested content and UI to better point to help content and booking info. This nudged conversion by 1.5% points.", } ], }, }, { "type": "numbered_list", "data": { "delta": [ { "insert": "I highly recommend bullets for readability. Use bold words to quickly convey the gist of each point, and limit bullets to 2-3 lines. I prefer numbered lists so one can refer to a point verbally.", } ], }, } ], }, };