@webiny/lexical-editor 0.0.0-unstable.d65ec29d44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (188) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +17 -0
  3. package/components/AddRichTextEditorNodeType.d.ts +6 -0
  4. package/components/AddRichTextEditorNodeType.js +28 -0
  5. package/components/AddRichTextEditorNodeType.js.map +1 -0
  6. package/components/AddRichTextEditorPlugin.d.ts +10 -0
  7. package/components/AddRichTextEditorPlugin.js +31 -0
  8. package/components/AddRichTextEditorPlugin.js.map +1 -0
  9. package/components/AddToolbarAction.d.ts +7 -0
  10. package/components/AddToolbarAction.js +33 -0
  11. package/components/AddToolbarAction.js.map +1 -0
  12. package/components/Editor/HeadingEditor.d.ts +7 -0
  13. package/components/Editor/HeadingEditor.js +28 -0
  14. package/components/Editor/HeadingEditor.js.map +1 -0
  15. package/components/Editor/ParagraphEditor.d.ts +7 -0
  16. package/components/Editor/ParagraphEditor.js +30 -0
  17. package/components/Editor/ParagraphEditor.js.map +1 -0
  18. package/components/Editor/RichTextEditor.d.ts +23 -0
  19. package/components/Editor/RichTextEditor.js +107 -0
  20. package/components/Editor/RichTextEditor.js.map +1 -0
  21. package/components/LexicalHtmlRenderer.d.ts +9 -0
  22. package/components/LexicalHtmlRenderer.js +44 -0
  23. package/components/LexicalHtmlRenderer.js.map +1 -0
  24. package/components/Toolbar/HeadingToolbar.d.ts +12 -0
  25. package/components/Toolbar/HeadingToolbar.js +23 -0
  26. package/components/Toolbar/HeadingToolbar.js.map +1 -0
  27. package/components/Toolbar/ParagraphToolbar.d.ts +12 -0
  28. package/components/Toolbar/ParagraphToolbar.js +23 -0
  29. package/components/Toolbar/ParagraphToolbar.js.map +1 -0
  30. package/components/Toolbar/Toolbar.css +414 -0
  31. package/components/Toolbar/Toolbar.d.ts +13 -0
  32. package/components/Toolbar/Toolbar.js +161 -0
  33. package/components/Toolbar/Toolbar.js.map +1 -0
  34. package/components/ToolbarActions/BoldAction.d.ts +5 -0
  35. package/components/ToolbarActions/BoldAction.js +38 -0
  36. package/components/ToolbarActions/BoldAction.js.map +1 -0
  37. package/components/ToolbarActions/BulletListAction.d.ts +5 -0
  38. package/components/ToolbarActions/BulletListAction.js +89 -0
  39. package/components/ToolbarActions/BulletListAction.js.map +1 -0
  40. package/components/ToolbarActions/CodeHighlightAction.d.ts +6 -0
  41. package/components/ToolbarActions/CodeHighlightAction.js +39 -0
  42. package/components/ToolbarActions/CodeHighlightAction.js.map +1 -0
  43. package/components/ToolbarActions/FontSizeAction.d.ts +2 -0
  44. package/components/ToolbarActions/FontSizeAction.js +104 -0
  45. package/components/ToolbarActions/FontSizeAction.js.map +1 -0
  46. package/components/ToolbarActions/ItalicAction.d.ts +5 -0
  47. package/components/ToolbarActions/ItalicAction.js +38 -0
  48. package/components/ToolbarActions/ItalicAction.js.map +1 -0
  49. package/components/ToolbarActions/LinkAction.d.ts +7 -0
  50. package/components/ToolbarActions/LinkAction.js +69 -0
  51. package/components/ToolbarActions/LinkAction.js.map +1 -0
  52. package/components/ToolbarActions/NumberedListAction.d.ts +5 -0
  53. package/components/ToolbarActions/NumberedListAction.js +89 -0
  54. package/components/ToolbarActions/NumberedListAction.js.map +1 -0
  55. package/components/ToolbarActions/QuoteAction.d.ts +4 -0
  56. package/components/ToolbarActions/QuoteAction.js +66 -0
  57. package/components/ToolbarActions/QuoteAction.js.map +1 -0
  58. package/components/ToolbarActions/UnderlineAction.d.ts +5 -0
  59. package/components/ToolbarActions/UnderlineAction.js +38 -0
  60. package/components/ToolbarActions/UnderlineAction.js.map +1 -0
  61. package/components/ToolbarPresets/HeadingToolbarPreset.d.ts +2 -0
  62. package/components/ToolbarPresets/HeadingToolbarPreset.js +44 -0
  63. package/components/ToolbarPresets/HeadingToolbarPreset.js.map +1 -0
  64. package/components/ToolbarPresets/ParagraphToolbarPreset.d.ts +2 -0
  65. package/components/ToolbarPresets/ParagraphToolbarPreset.js +59 -0
  66. package/components/ToolbarPresets/ParagraphToolbarPreset.js.map +1 -0
  67. package/context/RichTextEditorContext.d.ts +11 -0
  68. package/context/RichTextEditorContext.js +29 -0
  69. package/context/RichTextEditorContext.js.map +1 -0
  70. package/hooks/useRichTextEditor.d.ts +2 -0
  71. package/hooks/useRichTextEditor.js +15 -0
  72. package/hooks/useRichTextEditor.js.map +1 -0
  73. package/images/icons/LICENSE.md +5 -0
  74. package/images/icons/chat-square-quote.svg +1 -0
  75. package/images/icons/chevron-down.svg +1 -0
  76. package/images/icons/code.svg +1 -0
  77. package/images/icons/link.svg +1 -0
  78. package/images/icons/list-ol.svg +1 -0
  79. package/images/icons/list-ul.svg +1 -0
  80. package/images/icons/pencil-fill.svg +1 -0
  81. package/images/icons/text-center.svg +1 -0
  82. package/images/icons/text-left.svg +1 -0
  83. package/images/icons/text-paragraph.svg +1 -0
  84. package/images/icons/text-right.svg +1 -0
  85. package/images/icons/type-bold.svg +1 -0
  86. package/images/icons/type-h1.svg +1 -0
  87. package/images/icons/type-h2.svg +1 -0
  88. package/images/icons/type-h3.svg +1 -0
  89. package/images/icons/type-h4.svg +1 -0
  90. package/images/icons/type-h5.svg +1 -0
  91. package/images/icons/type-h6.svg +1 -0
  92. package/images/icons/type-italic.svg +1 -0
  93. package/images/icons/type-strikethrough.svg +1 -0
  94. package/images/icons/type-underline.svg +1 -0
  95. package/images/icons/unlink_icon.svg +1 -0
  96. package/index.d.ts +34 -0
  97. package/index.js +239 -0
  98. package/index.js.map +1 -0
  99. package/nodes/webinyNodes.d.ts +2 -0
  100. package/nodes/webinyNodes.js +15 -0
  101. package/nodes/webinyNodes.js.map +1 -0
  102. package/package.json +38 -0
  103. package/plugins/AutoLinkPlugin/AutoLinkPlugin.d.ts +11 -0
  104. package/plugins/AutoLinkPlugin/AutoLinkPlugin.js +46 -0
  105. package/plugins/AutoLinkPlugin/AutoLinkPlugin.js.map +1 -0
  106. package/plugins/AutoLinkPlugin/index.d.ts +1 -0
  107. package/plugins/AutoLinkPlugin/index.js +16 -0
  108. package/plugins/AutoLinkPlugin/index.js.map +1 -0
  109. package/plugins/BlurEventPlugin/BlurEventPlugin.d.ts +7 -0
  110. package/plugins/BlurEventPlugin/BlurEventPlugin.js +28 -0
  111. package/plugins/BlurEventPlugin/BlurEventPlugin.js.map +1 -0
  112. package/plugins/ClickableLinkPlugin/ClickableLinkPlugin.d.ts +17 -0
  113. package/plugins/ClickableLinkPlugin/ClickableLinkPlugin.js +88 -0
  114. package/plugins/ClickableLinkPlugin/ClickableLinkPlugin.js.map +1 -0
  115. package/plugins/ClickableLinkPlugin/index.d.ts +1 -0
  116. package/plugins/ClickableLinkPlugin/index.js +16 -0
  117. package/plugins/ClickableLinkPlugin/index.js.map +1 -0
  118. package/plugins/CodeHighlightPlugin/CodeHighlightPlugin.d.ts +1 -0
  119. package/plugins/CodeHighlightPlugin/CodeHighlightPlugin.js +20 -0
  120. package/plugins/CodeHighlightPlugin/CodeHighlightPlugin.js.map +1 -0
  121. package/plugins/CodeHighlightPlugin/index.d.ts +1 -0
  122. package/plugins/CodeHighlightPlugin/index.js +16 -0
  123. package/plugins/CodeHighlightPlugin/index.js.map +1 -0
  124. package/plugins/FloatingLinkEditorPlugin/FloatingLinkEditorPlugin.css +118 -0
  125. package/plugins/FloatingLinkEditorPlugin/FloatingLinkEditorPlugin.d.ts +7 -0
  126. package/plugins/FloatingLinkEditorPlugin/FloatingLinkEditorPlugin.js +222 -0
  127. package/plugins/FloatingLinkEditorPlugin/FloatingLinkEditorPlugin.js.map +1 -0
  128. package/plugins/FloatingLinkEditorPlugin/index.d.ts +1 -0
  129. package/plugins/FloatingLinkEditorPlugin/index.js +16 -0
  130. package/plugins/FloatingLinkEditorPlugin/index.js.map +1 -0
  131. package/plugins/LexicalUpdateStatePlugin/LexicalUpdateStatePlugin.d.ts +8 -0
  132. package/plugins/LexicalUpdateStatePlugin/LexicalUpdateStatePlugin.js +34 -0
  133. package/plugins/LexicalUpdateStatePlugin/LexicalUpdateStatePlugin.js.map +1 -0
  134. package/plugins/LexicalUpdateStatePlugin/index.d.ts +1 -0
  135. package/plugins/LexicalUpdateStatePlugin/index.js +16 -0
  136. package/plugins/LexicalUpdateStatePlugin/index.js.map +1 -0
  137. package/themes/webinyLexicalTheme.css +422 -0
  138. package/themes/webinyLexicalTheme.d.ts +10 -0
  139. package/themes/webinyLexicalTheme.js +107 -0
  140. package/themes/webinyLexicalTheme.js.map +1 -0
  141. package/types.d.ts +2 -0
  142. package/types.js +5 -0
  143. package/types.js.map +1 -0
  144. package/ui/Divider.d.ts +2 -0
  145. package/ui/Divider.js +13 -0
  146. package/ui/Divider.js.map +1 -0
  147. package/ui/DropDown.d.ts +25 -0
  148. package/ui/DropDown.js +168 -0
  149. package/ui/DropDown.js.map +1 -0
  150. package/ui/Input.css +32 -0
  151. package/ui/LinkPreview.css +69 -0
  152. package/ui/LinkPreview.d.ts +12 -0
  153. package/ui/LinkPreview.js +101 -0
  154. package/ui/LinkPreview.js.map +1 -0
  155. package/ui/Placeholder.css +23 -0
  156. package/ui/Placeholder.d.ts +13 -0
  157. package/ui/Placeholder.js +24 -0
  158. package/ui/Placeholder.js.map +1 -0
  159. package/ui/TextInput.d.ts +18 -0
  160. package/ui/TextInput.js +39 -0
  161. package/ui/TextInput.js.map +1 -0
  162. package/utils/generateInitialLexicalValue.d.ts +5 -0
  163. package/utils/generateInitialLexicalValue.js +29 -0
  164. package/utils/generateInitialLexicalValue.js.map +1 -0
  165. package/utils/getDOMRangeRect.d.ts +10 -0
  166. package/utils/getDOMRangeRect.js +27 -0
  167. package/utils/getDOMRangeRect.js.map +1 -0
  168. package/utils/getSelectedNode.d.ts +2 -0
  169. package/utils/getSelectedNode.js +30 -0
  170. package/utils/getSelectedNode.js.map +1 -0
  171. package/utils/isValidJSON.d.ts +1 -0
  172. package/utils/isValidJSON.js +18 -0
  173. package/utils/isValidJSON.js.map +1 -0
  174. package/utils/isValidLexicalData.d.ts +2 -0
  175. package/utils/isValidLexicalData.js +24 -0
  176. package/utils/isValidLexicalData.js.map +1 -0
  177. package/utils/point.d.ts +21 -0
  178. package/utils/point.js +77 -0
  179. package/utils/point.js.map +1 -0
  180. package/utils/rect.d.ts +47 -0
  181. package/utils/rect.js +169 -0
  182. package/utils/rect.js.map +1 -0
  183. package/utils/sanitizeUrl.d.ts +8 -0
  184. package/utils/sanitizeUrl.js +27 -0
  185. package/utils/sanitizeUrl.js.map +1 -0
  186. package/utils/setFloatingElemPosition.d.ts +3 -0
  187. package/utils/setFloatingElemPosition.js +40 -0
  188. package/utils/setFloatingElemPosition.js.map +1 -0
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_CodeHighlightPlugin","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./CodeHighlightPlugin\";\n"],"mappings":";;;;;AAAA,IAAAA,oBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,oBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,oBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,oBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
@@ -0,0 +1,118 @@
1
+ .link-editor {
2
+ position: absolute;
3
+ top: 0;
4
+ left: 0;
5
+ z-index: 10;
6
+ max-width: 400px;
7
+ width: 100%;
8
+ height: 48px;
9
+ opacity: 0;
10
+ background-color: #fff;
11
+ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
12
+ border-radius: 8px;
13
+ transition: opacity 0.5s;
14
+ will-change: transform;
15
+ }
16
+
17
+ .link-editor .button {
18
+ width: 20px;
19
+ height: 20px;
20
+ display: inline-block;
21
+ padding: 6px;
22
+ border-radius: 8px;
23
+ cursor: pointer;
24
+ margin: 0 2px;
25
+ }
26
+
27
+ .link-editor .button.hovered {
28
+ width: 20px;
29
+ height: 20px;
30
+ display: inline-block;
31
+ background-color: #eee;
32
+ }
33
+
34
+ .link-editor .button.active,
35
+ .toolbar .button.active {
36
+ background-color: rgb(223, 232, 250);
37
+ }
38
+
39
+ .link-editor .link-input {
40
+ display: block;
41
+ width: calc(100% - 24px);
42
+ height: 32px;
43
+ box-sizing: border-box;
44
+ margin: 8px 12px;
45
+ padding: 8px 12px;
46
+ border-radius: 15px;
47
+ background-color: #eee;
48
+ font-size: 15px;
49
+ color: rgb(5, 5, 5);
50
+ border: 0;
51
+ outline: 0;
52
+ position: relative;
53
+ font-family: inherit;
54
+ }
55
+
56
+ .link-editor .link-input .link-unlink {
57
+ background-image: url(../../images/icons/unlink_icon.svg);
58
+ background-size: 18px;
59
+ background-position: center;
60
+ background-repeat: no-repeat;
61
+ width: 35px;
62
+ vertical-align: -0.25em;
63
+ position: absolute;
64
+ right: 5px;
65
+ top: 0;
66
+ bottom: 0;
67
+ cursor: pointer;
68
+ }
69
+
70
+ .link-editor .link-input .link-edit {
71
+ background-image: url(../../images/icons/pencil-fill.svg);
72
+ background-size: 16px;
73
+ background-position: center;
74
+ background-repeat: no-repeat;
75
+ width: 35px;
76
+ vertical-align: -0.25em;
77
+ position: absolute;
78
+ right: 35px;
79
+ top: 0;
80
+ bottom: 0;
81
+ cursor: pointer;
82
+ }
83
+
84
+ .link-editor .link-input a {
85
+ color: rgb(33, 111, 219);
86
+ text-decoration: none;
87
+ display: block;
88
+ white-space: nowrap;
89
+ overflow: hidden;
90
+ margin-right: 30px;
91
+ text-overflow: ellipsis;
92
+ }
93
+
94
+ .link-editor .link-input a:hover {
95
+ text-decoration: underline;
96
+ }
97
+
98
+ .link-editor .font-size-wrapper,
99
+ .link-editor .font-family-wrapper {
100
+ display: flex;
101
+ margin: 0 4px;
102
+ }
103
+
104
+ .link-editor select {
105
+ padding: 6px;
106
+ border: none;
107
+ background-color: rgba(0, 0, 0, 0.075);
108
+ border-radius: 4px;
109
+ }
110
+
111
+ .link-editor .button i,
112
+ .actions i {
113
+ background-size: contain;
114
+ display: inline-block;
115
+ height: 20px;
116
+ width: 20px;
117
+ vertical-align: -0.25em;
118
+ }
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ /// <reference types="web" />
3
+ /// <reference types="react" />
4
+ import "./FloatingLinkEditorPlugin.css";
5
+ export declare function FloatingLinkEditorPlugin({ anchorElem }: {
6
+ anchorElem?: HTMLElement;
7
+ }): JSX.Element | null;
@@ -0,0 +1,222 @@
1
+ "use strict";
2
+
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.FloatingLinkEditorPlugin = FloatingLinkEditorPlugin;
9
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
10
+ var _react = _interopRequireWildcard(require("react"));
11
+ require("./FloatingLinkEditorPlugin.css");
12
+ var _link = require("@lexical/link");
13
+ var _LexicalComposerContext = require("@lexical/react/LexicalComposerContext");
14
+ var _utils = require("@lexical/utils");
15
+ var _lexical = require("lexical");
16
+ var _reactDom = require("react-dom");
17
+ var _LinkPreview = require("../../ui/LinkPreview");
18
+ var _getSelectedNode = require("../../utils/getSelectedNode");
19
+ var _sanitizeUrl = require("../../utils/sanitizeUrl");
20
+ var _setFloatingElemPosition = require("../../utils/setFloatingElemPosition");
21
+ function FloatingLinkEditor(_ref) {
22
+ var editor = _ref.editor,
23
+ anchorElem = _ref.anchorElem;
24
+ var editorRef = (0, _react.useRef)(null);
25
+ var inputRef = (0, _react.useRef)(null);
26
+ var _useState = (0, _react.useState)(""),
27
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
28
+ linkUrl = _useState2[0],
29
+ setLinkUrl = _useState2[1];
30
+ var _useState3 = (0, _react.useState)(false),
31
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
32
+ isEditMode = _useState4[0],
33
+ setEditMode = _useState4[1];
34
+ var _useState5 = (0, _react.useState)(null),
35
+ _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
36
+ lastSelection = _useState6[0],
37
+ setLastSelection = _useState6[1];
38
+ var updateLinkEditor = (0, _react.useCallback)(function () {
39
+ var selection = (0, _lexical.$getSelection)();
40
+ if ((0, _lexical.$isRangeSelection)(selection)) {
41
+ var node = (0, _getSelectedNode.getSelectedNode)(selection);
42
+ var parent = node.getParent();
43
+ if ((0, _link.$isLinkNode)(parent)) {
44
+ setLinkUrl(parent.getURL());
45
+ } else if ((0, _link.$isLinkNode)(node)) {
46
+ setLinkUrl(node.getURL());
47
+ } else {
48
+ setLinkUrl("");
49
+ }
50
+ }
51
+ var editorElem = editorRef.current;
52
+ var nativeSelection = window.getSelection();
53
+ var activeElement = document.activeElement;
54
+ if (editorElem === null) {
55
+ return;
56
+ }
57
+ var rootElement = editor.getRootElement();
58
+ if (selection !== null && nativeSelection !== null && rootElement !== null && rootElement.contains(nativeSelection.anchorNode)) {
59
+ var domRange = nativeSelection.getRangeAt(0);
60
+ var rect;
61
+ if (nativeSelection.anchorNode === rootElement) {
62
+ var inner = rootElement;
63
+ while (inner.firstElementChild != null) {
64
+ inner = inner.firstElementChild;
65
+ }
66
+ rect = inner.getBoundingClientRect();
67
+ } else {
68
+ rect = domRange.getBoundingClientRect();
69
+ }
70
+ (0, _setFloatingElemPosition.setFloatingElemPosition)(rect, editorElem, anchorElem);
71
+ setLastSelection(selection);
72
+ } else if (!activeElement || activeElement.className !== "link-input") {
73
+ if (rootElement !== null) {
74
+ (0, _setFloatingElemPosition.setFloatingElemPosition)(null, editorElem, anchorElem);
75
+ }
76
+ setLastSelection(null);
77
+ setEditMode(false);
78
+ setLinkUrl("");
79
+ }
80
+ return true;
81
+ }, [anchorElem, editor]);
82
+ var removeLink = function removeLink() {
83
+ editor.dispatchCommand(_link.TOGGLE_LINK_COMMAND, null);
84
+ setEditMode(false);
85
+ };
86
+ (0, _react.useEffect)(function () {
87
+ var scrollerElem = anchorElem.parentElement;
88
+ var update = function update() {
89
+ editor.getEditorState().read(function () {
90
+ updateLinkEditor();
91
+ });
92
+ };
93
+ window.addEventListener("resize", update);
94
+ if (scrollerElem) {
95
+ scrollerElem.addEventListener("scroll", update);
96
+ }
97
+ return function () {
98
+ window.removeEventListener("resize", update);
99
+ if (scrollerElem) {
100
+ scrollerElem.removeEventListener("scroll", update);
101
+ }
102
+ };
103
+ }, [anchorElem.parentElement, editor, updateLinkEditor]);
104
+ (0, _react.useEffect)(function () {
105
+ return (0, _utils.mergeRegister)(editor.registerUpdateListener(function (_ref2) {
106
+ var editorState = _ref2.editorState;
107
+ editorState.read(function () {
108
+ updateLinkEditor();
109
+ });
110
+ }), editor.registerCommand(_lexical.SELECTION_CHANGE_COMMAND, function () {
111
+ updateLinkEditor();
112
+ return true;
113
+ }, _lexical.COMMAND_PRIORITY_LOW));
114
+ }, [editor, updateLinkEditor]);
115
+ (0, _react.useEffect)(function () {
116
+ editor.getEditorState().read(function () {
117
+ updateLinkEditor();
118
+ });
119
+ }, [editor, updateLinkEditor]);
120
+ (0, _react.useEffect)(function () {
121
+ if (isEditMode && inputRef.current) {
122
+ inputRef.current.focus();
123
+ }
124
+ }, [isEditMode]);
125
+ return /*#__PURE__*/_react.default.createElement("div", {
126
+ ref: editorRef,
127
+ className: "link-editor"
128
+ }, isEditMode ? /*#__PURE__*/_react.default.createElement("input", {
129
+ ref: inputRef,
130
+ className: "link-input",
131
+ value: linkUrl,
132
+ onChange: function onChange(event) {
133
+ setLinkUrl(event.target.value);
134
+ },
135
+ onKeyDown: function onKeyDown(event) {
136
+ if (event.key === "Enter") {
137
+ event.preventDefault();
138
+ if (lastSelection !== null) {
139
+ if (linkUrl !== "") {
140
+ editor.dispatchCommand(_link.TOGGLE_LINK_COMMAND, (0, _sanitizeUrl.sanitizeUrl)(linkUrl));
141
+ }
142
+ setEditMode(false);
143
+ }
144
+ } else if (event.key === "Escape") {
145
+ event.preventDefault();
146
+ setEditMode(false);
147
+ }
148
+ }
149
+ }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
150
+ className: "link-input"
151
+ }, /*#__PURE__*/_react.default.createElement("a", {
152
+ href: linkUrl,
153
+ target: "_blank",
154
+ rel: "noopener noreferrer"
155
+ }, linkUrl), /*#__PURE__*/_react.default.createElement("div", {
156
+ className: "link-edit",
157
+ role: "button",
158
+ tabIndex: 0,
159
+ onMouseDown: function onMouseDown(event) {
160
+ return event.preventDefault();
161
+ },
162
+ onClick: function onClick() {
163
+ setEditMode(true);
164
+ }
165
+ }), /*#__PURE__*/_react.default.createElement("div", {
166
+ className: "link-unlink",
167
+ role: "button",
168
+ tabIndex: 0,
169
+ onMouseDown: function onMouseDown(event) {
170
+ return event.preventDefault();
171
+ },
172
+ onClick: function onClick() {
173
+ removeLink();
174
+ }
175
+ })), /*#__PURE__*/_react.default.createElement(_LinkPreview.LinkPreview, {
176
+ url: linkUrl
177
+ })));
178
+ }
179
+ function useFloatingLinkEditorToolbar(editor, anchorElem) {
180
+ var _useState7 = (0, _react.useState)(editor),
181
+ _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
182
+ activeEditor = _useState8[0],
183
+ setActiveEditor = _useState8[1];
184
+ var _useState9 = (0, _react.useState)(false),
185
+ _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
186
+ isLink = _useState10[0],
187
+ setIsLink = _useState10[1];
188
+ var updateToolbar = (0, _react.useCallback)(function () {
189
+ var selection = (0, _lexical.$getSelection)();
190
+ if ((0, _lexical.$isRangeSelection)(selection)) {
191
+ var node = (0, _getSelectedNode.getSelectedNode)(selection);
192
+ var linkParent = (0, _utils.$findMatchingParent)(node, _link.$isLinkNode);
193
+ var autoLinkParent = (0, _utils.$findMatchingParent)(node, _link.$isAutoLinkNode);
194
+
195
+ // We don't want this menu to open for auto links.
196
+ if (linkParent != null && autoLinkParent == null) {
197
+ setIsLink(true);
198
+ } else {
199
+ setIsLink(false);
200
+ }
201
+ }
202
+ }, []);
203
+ (0, _react.useEffect)(function () {
204
+ return editor.registerCommand(_lexical.SELECTION_CHANGE_COMMAND, function (_payload, newEditor) {
205
+ updateToolbar();
206
+ setActiveEditor(newEditor);
207
+ return false;
208
+ }, _lexical.COMMAND_PRIORITY_CRITICAL);
209
+ }, [editor, updateToolbar]);
210
+ return isLink ? /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/_react.default.createElement(FloatingLinkEditor, {
211
+ editor: activeEditor,
212
+ anchorElem: anchorElem
213
+ }), anchorElem) : null;
214
+ }
215
+ function FloatingLinkEditorPlugin(_ref3) {
216
+ var _ref3$anchorElem = _ref3.anchorElem,
217
+ anchorElem = _ref3$anchorElem === void 0 ? document.body : _ref3$anchorElem;
218
+ var _useLexicalComposerCo = (0, _LexicalComposerContext.useLexicalComposerContext)(),
219
+ _useLexicalComposerCo2 = (0, _slicedToArray2.default)(_useLexicalComposerCo, 1),
220
+ editor = _useLexicalComposerCo2[0];
221
+ return useFloatingLinkEditorToolbar(editor, anchorElem);
222
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","_interopRequireWildcard","require","_link","_LexicalComposerContext","_utils","_lexical","_reactDom","_LinkPreview","_getSelectedNode","_sanitizeUrl","_setFloatingElemPosition","FloatingLinkEditor","_ref","editor","anchorElem","editorRef","useRef","inputRef","_useState","useState","_useState2","_slicedToArray2","default","linkUrl","setLinkUrl","_useState3","_useState4","isEditMode","setEditMode","_useState5","_useState6","lastSelection","setLastSelection","updateLinkEditor","useCallback","selection","$getSelection","$isRangeSelection","node","getSelectedNode","parent","getParent","$isLinkNode","getURL","editorElem","current","nativeSelection","window","getSelection","activeElement","document","rootElement","getRootElement","contains","anchorNode","domRange","getRangeAt","rect","inner","firstElementChild","getBoundingClientRect","setFloatingElemPosition","className","removeLink","dispatchCommand","TOGGLE_LINK_COMMAND","useEffect","scrollerElem","parentElement","update","getEditorState","read","addEventListener","removeEventListener","mergeRegister","registerUpdateListener","_ref2","editorState","registerCommand","SELECTION_CHANGE_COMMAND","COMMAND_PRIORITY_LOW","focus","createElement","ref","value","onChange","event","target","onKeyDown","key","preventDefault","sanitizeUrl","Fragment","href","rel","role","tabIndex","onMouseDown","onClick","LinkPreview","url","useFloatingLinkEditorToolbar","_useState7","_useState8","activeEditor","setActiveEditor","_useState9","_useState10","isLink","setIsLink","updateToolbar","linkParent","$findMatchingParent","autoLinkParent","$isAutoLinkNode","_payload","newEditor","COMMAND_PRIORITY_CRITICAL","createPortal","FloatingLinkEditorPlugin","_ref3","_ref3$anchorElem","body","_useLexicalComposerCo","useLexicalComposerContext","_useLexicalComposerCo2"],"sources":["FloatingLinkEditorPlugin.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport \"./FloatingLinkEditorPlugin.css\";\nimport { $isAutoLinkNode, $isLinkNode, TOGGLE_LINK_COMMAND } from \"@lexical/link\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { $findMatchingParent, mergeRegister } from \"@lexical/utils\";\nimport {\n $getSelection,\n $isRangeSelection,\n COMMAND_PRIORITY_CRITICAL,\n COMMAND_PRIORITY_LOW,\n GridSelection,\n LexicalEditor,\n NodeSelection,\n RangeSelection,\n SELECTION_CHANGE_COMMAND\n} from \"lexical\";\n\nimport { createPortal } from \"react-dom\";\nimport { LinkPreview } from \"../../ui/LinkPreview\";\nimport { getSelectedNode } from \"../../utils/getSelectedNode\";\nimport { sanitizeUrl } from \"../../utils/sanitizeUrl\";\nimport { setFloatingElemPosition } from \"../../utils/setFloatingElemPosition\";\n\nfunction FloatingLinkEditor({\n editor,\n anchorElem\n}: {\n editor: LexicalEditor;\n anchorElem: HTMLElement;\n}): JSX.Element {\n const editorRef = useRef<HTMLDivElement | null>(null);\n const inputRef = useRef<HTMLInputElement>(null);\n const [linkUrl, setLinkUrl] = useState(\"\");\n const [isEditMode, setEditMode] = useState(false);\n const [lastSelection, setLastSelection] = useState<\n RangeSelection | GridSelection | NodeSelection | null\n >(null);\n\n const updateLinkEditor = useCallback(() => {\n const selection = $getSelection();\n if ($isRangeSelection(selection)) {\n const node = getSelectedNode(selection);\n const parent = node.getParent();\n if ($isLinkNode(parent)) {\n setLinkUrl(parent.getURL());\n } else if ($isLinkNode(node)) {\n setLinkUrl(node.getURL());\n } else {\n setLinkUrl(\"\");\n }\n }\n const editorElem = editorRef.current;\n const nativeSelection = window.getSelection();\n const activeElement = document.activeElement;\n\n if (editorElem === null) {\n return;\n }\n\n const rootElement = editor.getRootElement();\n\n if (\n selection !== null &&\n nativeSelection !== null &&\n rootElement !== null &&\n rootElement.contains(nativeSelection.anchorNode)\n ) {\n const domRange = nativeSelection.getRangeAt(0);\n let rect;\n if (nativeSelection.anchorNode === rootElement) {\n let inner = rootElement;\n while (inner.firstElementChild != null) {\n inner = inner.firstElementChild as HTMLElement;\n }\n rect = inner.getBoundingClientRect();\n } else {\n rect = domRange.getBoundingClientRect();\n }\n\n setFloatingElemPosition(rect, editorElem, anchorElem);\n setLastSelection(selection);\n } else if (!activeElement || activeElement.className !== \"link-input\") {\n if (rootElement !== null) {\n setFloatingElemPosition(null, editorElem, anchorElem);\n }\n setLastSelection(null);\n setEditMode(false);\n setLinkUrl(\"\");\n }\n\n return true;\n }, [anchorElem, editor]);\n\n const removeLink = () => {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);\n setEditMode(false);\n };\n\n useEffect(() => {\n const scrollerElem = anchorElem.parentElement;\n\n const update = () => {\n editor.getEditorState().read(() => {\n updateLinkEditor();\n });\n };\n\n window.addEventListener(\"resize\", update);\n\n if (scrollerElem) {\n scrollerElem.addEventListener(\"scroll\", update);\n }\n\n return () => {\n window.removeEventListener(\"resize\", update);\n\n if (scrollerElem) {\n scrollerElem.removeEventListener(\"scroll\", update);\n }\n };\n }, [anchorElem.parentElement, editor, updateLinkEditor]);\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n updateLinkEditor();\n });\n }),\n\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n () => {\n updateLinkEditor();\n return true;\n },\n COMMAND_PRIORITY_LOW\n )\n );\n }, [editor, updateLinkEditor]);\n\n useEffect(() => {\n editor.getEditorState().read(() => {\n updateLinkEditor();\n });\n }, [editor, updateLinkEditor]);\n\n useEffect(() => {\n if (isEditMode && inputRef.current) {\n inputRef.current.focus();\n }\n }, [isEditMode]);\n\n return (\n <div ref={editorRef} className=\"link-editor\">\n {isEditMode ? (\n <input\n ref={inputRef}\n className=\"link-input\"\n value={linkUrl}\n onChange={event => {\n setLinkUrl(event.target.value);\n }}\n onKeyDown={event => {\n if (event.key === \"Enter\") {\n event.preventDefault();\n if (lastSelection !== null) {\n if (linkUrl !== \"\") {\n editor.dispatchCommand(\n TOGGLE_LINK_COMMAND,\n sanitizeUrl(linkUrl)\n );\n }\n setEditMode(false);\n }\n } else if (event.key === \"Escape\") {\n event.preventDefault();\n setEditMode(false);\n }\n }}\n />\n ) : (\n <>\n <div className=\"link-input\">\n <a href={linkUrl} target=\"_blank\" rel=\"noopener noreferrer\">\n {linkUrl}\n </a>\n <div\n className=\"link-edit\"\n role=\"button\"\n tabIndex={0}\n onMouseDown={event => event.preventDefault()}\n onClick={() => {\n setEditMode(true);\n }}\n />\n <div\n className=\"link-unlink\"\n role=\"button\"\n tabIndex={0}\n onMouseDown={event => event.preventDefault()}\n onClick={() => {\n removeLink();\n }}\n />\n </div>\n <LinkPreview url={linkUrl} />\n </>\n )}\n </div>\n );\n}\n\nfunction useFloatingLinkEditorToolbar(\n editor: LexicalEditor,\n anchorElem: HTMLElement\n): JSX.Element | null {\n const [activeEditor, setActiveEditor] = useState(editor);\n const [isLink, setIsLink] = useState(false);\n\n const updateToolbar = useCallback(() => {\n const selection = $getSelection();\n if ($isRangeSelection(selection)) {\n const node = getSelectedNode(selection);\n const linkParent = $findMatchingParent(node, $isLinkNode);\n const autoLinkParent = $findMatchingParent(node, $isAutoLinkNode);\n\n // We don't want this menu to open for auto links.\n if (linkParent != null && autoLinkParent == null) {\n setIsLink(true);\n } else {\n setIsLink(false);\n }\n }\n }, []);\n\n useEffect(() => {\n return editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n (_payload, newEditor) => {\n updateToolbar();\n setActiveEditor(newEditor);\n return false;\n },\n COMMAND_PRIORITY_CRITICAL\n );\n }, [editor, updateToolbar]);\n\n return isLink\n ? createPortal(\n <FloatingLinkEditor editor={activeEditor} anchorElem={anchorElem} />,\n anchorElem\n )\n : null;\n}\n\nexport function FloatingLinkEditorPlugin({\n anchorElem = document.body\n}: {\n anchorElem?: HTMLElement;\n}): JSX.Element | null {\n const [editor] = useLexicalComposerContext();\n return useFloatingLinkEditorToolbar(editor, anchorElem);\n}\n"],"mappings":"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"}
@@ -0,0 +1 @@
1
+ export * from "./FloatingLinkEditorPlugin";
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ var _FloatingLinkEditorPlugin = require("./FloatingLinkEditorPlugin");
7
+ Object.keys(_FloatingLinkEditorPlugin).forEach(function (key) {
8
+ if (key === "default" || key === "__esModule") return;
9
+ if (key in exports && exports[key] === _FloatingLinkEditorPlugin[key]) return;
10
+ Object.defineProperty(exports, key, {
11
+ enumerable: true,
12
+ get: function get() {
13
+ return _FloatingLinkEditorPlugin[key];
14
+ }
15
+ });
16
+ });
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_FloatingLinkEditorPlugin","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./FloatingLinkEditorPlugin\";\n"],"mappings":";;;;;AAAA,IAAAA,yBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,yBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,yBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,yBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
@@ -0,0 +1,8 @@
1
+ import { FC } from "react";
2
+ import { LexicalValue } from "../../types";
3
+ interface LexicalUpdateStatePlugin {
4
+ value: LexicalValue | null;
5
+ readOnly?: boolean;
6
+ }
7
+ export declare const LexicalUpdateStatePlugin: FC<LexicalUpdateStatePlugin>;
8
+ export {};
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.LexicalUpdateStatePlugin = void 0;
9
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
10
+ var _LexicalComposerContext = require("@lexical/react/LexicalComposerContext");
11
+ var _react = _interopRequireWildcard(require("react"));
12
+ var _isValidLexicalData = require("../../utils/isValidLexicalData");
13
+ var _generateInitialLexicalValue = require("../../utils/generateInitialLexicalValue");
14
+ /*
15
+ * Updates the lexical state if new value is provided to the lexical editor trough props
16
+ */
17
+ var LexicalUpdateStatePlugin = function LexicalUpdateStatePlugin(_ref) {
18
+ var value = _ref.value;
19
+ var _useLexicalComposerCo = (0, _LexicalComposerContext.useLexicalComposerContext)(),
20
+ _useLexicalComposerCo2 = (0, _slicedToArray2.default)(_useLexicalComposerCo, 1),
21
+ editor = _useLexicalComposerCo2[0];
22
+ (0, _react.useEffect)(function () {
23
+ if (value && editor) {
24
+ var editorState = editor.getEditorState();
25
+ if (JSON.stringify(editorState.toJSON()) === value) {
26
+ return;
27
+ }
28
+ var initialEditorState = editor.parseEditorState((0, _isValidLexicalData.isValidLexicalData)(value) ? value : (0, _generateInitialLexicalValue.generateInitialLexicalValue)());
29
+ editor.setEditorState(initialEditorState);
30
+ }
31
+ }, [value, editor]);
32
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
33
+ };
34
+ exports.LexicalUpdateStatePlugin = LexicalUpdateStatePlugin;
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_LexicalComposerContext","require","_react","_interopRequireWildcard","_isValidLexicalData","_generateInitialLexicalValue","LexicalUpdateStatePlugin","_ref","value","_useLexicalComposerCo","useLexicalComposerContext","_useLexicalComposerCo2","_slicedToArray2","default","editor","useEffect","editorState","getEditorState","JSON","stringify","toJSON","initialEditorState","parseEditorState","isValidLexicalData","generateInitialLexicalValue","setEditorState","createElement","Fragment","exports"],"sources":["LexicalUpdateStatePlugin.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport React, { FC, useEffect } from \"react\";\nimport { isValidLexicalData } from \"~/utils/isValidLexicalData\";\nimport { generateInitialLexicalValue } from \"~/utils/generateInitialLexicalValue\";\nimport { LexicalValue } from \"~/types\";\n\ninterface LexicalUpdateStatePlugin {\n value: LexicalValue | null;\n readOnly?: boolean;\n}\n\n/*\n * Updates the lexical state if new value is provided to the lexical editor trough props\n */\nexport const LexicalUpdateStatePlugin: FC<LexicalUpdateStatePlugin> = ({\n value\n}): React.ReactElement => {\n const [editor] = useLexicalComposerContext();\n useEffect(() => {\n if (value && editor) {\n const editorState = editor.getEditorState();\n if (JSON.stringify(editorState.toJSON()) === value) {\n return;\n }\n\n const initialEditorState = editor.parseEditorState(\n isValidLexicalData(value)\n ? (value as string)\n : (generateInitialLexicalValue() as string)\n );\n editor.setEditorState(initialEditorState);\n }\n }, [value, editor]);\n\n return <></>;\n};\n"],"mappings":";;;;;;;;;AAAA,IAAAA,uBAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,mBAAA,GAAAH,OAAA;AACA,IAAAI,4BAAA,GAAAJ,OAAA;AAQA;AACA;AACA;AACO,IAAMK,wBAAsD,GAAG,SAAzDA,wBAAsDA,CAAAC,IAAA,EAEzC;EAAA,IADtBC,KAAK,GAAAD,IAAA,CAALC,KAAK;EAEL,IAAAC,qBAAA,GAAiB,IAAAC,iDAAyB,GAAE;IAAAC,sBAAA,OAAAC,eAAA,CAAAC,OAAA,EAAAJ,qBAAA;IAArCK,MAAM,GAAAH,sBAAA;EACb,IAAAI,gBAAS,EAAC,YAAM;IACZ,IAAIP,KAAK,IAAIM,MAAM,EAAE;MACjB,IAAME,WAAW,GAAGF,MAAM,CAACG,cAAc,EAAE;MAC3C,IAAIC,IAAI,CAACC,SAAS,CAACH,WAAW,CAACI,MAAM,EAAE,CAAC,KAAKZ,KAAK,EAAE;QAChD;MACJ;MAEA,IAAMa,kBAAkB,GAAGP,MAAM,CAACQ,gBAAgB,CAC9C,IAAAC,sCAAkB,EAACf,KAAK,CAAC,GAClBA,KAAK,GACL,IAAAgB,wDAA2B,GAAa,CAClD;MACDV,MAAM,CAACW,cAAc,CAACJ,kBAAkB,CAAC;IAC7C;EACJ,CAAC,EAAE,CAACb,KAAK,EAAEM,MAAM,CAAC,CAAC;EAEnB,oBAAOZ,MAAA,CAAAW,OAAA,CAAAa,aAAA,CAAAxB,MAAA,CAAAW,OAAA,CAAAc,QAAA,OAAK;AAChB,CAAC;AAACC,OAAA,CAAAtB,wBAAA,GAAAA,wBAAA"}
@@ -0,0 +1 @@
1
+ export * from "./LexicalUpdateStatePlugin";
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ var _LexicalUpdateStatePlugin = require("./LexicalUpdateStatePlugin");
7
+ Object.keys(_LexicalUpdateStatePlugin).forEach(function (key) {
8
+ if (key === "default" || key === "__esModule") return;
9
+ if (key in exports && exports[key] === _LexicalUpdateStatePlugin[key]) return;
10
+ Object.defineProperty(exports, key, {
11
+ enumerable: true,
12
+ get: function get() {
13
+ return _LexicalUpdateStatePlugin[key];
14
+ }
15
+ });
16
+ });
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_LexicalUpdateStatePlugin","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./LexicalUpdateStatePlugin\";\n"],"mappings":";;;;;AAAA,IAAAA,yBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,yBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,yBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,yBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}