@logora/debate 0.4.48 → 0.4.49
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.
|
@@ -1,252 +1,266 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { $isListNode as
|
|
3
|
-
import { useLexicalComposerContext as
|
|
4
|
-
import { $isHeadingNode as
|
|
5
|
-
import { $setBlocksType as
|
|
6
|
-
import { $getNearestNodeOfType as
|
|
7
|
-
import
|
|
8
|
-
import { $getSelection as
|
|
9
|
-
import { useRef as
|
|
10
|
-
import { useIntl as
|
|
11
|
-
import
|
|
12
|
-
import { Icon as
|
|
13
|
-
import { Button as
|
|
14
|
-
const
|
|
15
|
-
const
|
|
16
|
-
const
|
|
17
|
-
if (
|
|
18
|
-
const c =
|
|
19
|
-
if (l.getElementByKey(
|
|
20
|
-
if (
|
|
21
|
-
const o =
|
|
22
|
-
|
|
1
|
+
import { jsxs as P, jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { $isListNode as O, ListNode as Z, INSERT_ORDERED_LIST_COMMAND as ee, $isListItemNode as R, $createListNode as te } from "@lexical/list";
|
|
3
|
+
import { useLexicalComposerContext as oe } from "@lexical/react/LexicalComposerContext";
|
|
4
|
+
import { $isHeadingNode as ne, $createQuoteNode as B } from "@lexical/rich-text";
|
|
5
|
+
import { $setBlocksType as $ } from "@lexical/selection";
|
|
6
|
+
import { $getNearestNodeOfType as ie, mergeRegister as ae } from "@lexical/utils";
|
|
7
|
+
import i from "classnames";
|
|
8
|
+
import { $getSelection as M, $isRangeSelection as I, SELECTION_CHANGE_COMMAND as le, FORMAT_TEXT_COMMAND as re, $createParagraphNode as q } from "lexical";
|
|
9
|
+
import { useRef as k, useState as N, useCallback as se, useEffect as K } from "react";
|
|
10
|
+
import { useIntl as ce } from "react-intl";
|
|
11
|
+
import t from "./ToolbarPlugin.module.scss.js";
|
|
12
|
+
import { Icon as f } from "../../../icons/icon/Icon.js";
|
|
13
|
+
import { Button as de } from "../../../action/button/Button.js";
|
|
14
|
+
const Ce = (a) => {
|
|
15
|
+
const d = ce(), F = 1, [l] = oe(), U = k(null), [T, x] = N("paragraph"), [ue, j] = N(null), [H, Q] = N(!1), [V, z] = N(!1), [G, X] = N(!1), L = a.hideSubmit && a.hideSourceAction && a.disableRichText, _ = se(() => {
|
|
16
|
+
const e = M();
|
|
17
|
+
if (I(e)) {
|
|
18
|
+
const c = e.anchor.getNode(), r = c.getKey() === "root" ? c : c.getTopLevelElementOrThrow(), u = r.getKey();
|
|
19
|
+
if (l.getElementByKey(u) !== null)
|
|
20
|
+
if (j(u), O(r)) {
|
|
21
|
+
const o = ie(c, Z), p = o ? o.getTag() : r.getTag();
|
|
22
|
+
x(p);
|
|
23
23
|
} else {
|
|
24
|
-
const o =
|
|
25
|
-
|
|
24
|
+
const o = ne(r) ? r.getTag() : r.getType();
|
|
25
|
+
x(o);
|
|
26
26
|
}
|
|
27
|
-
|
|
27
|
+
Q(e.hasFormat("bold")), z(e.hasFormat("italic")), X(e.hasFormat("underline"));
|
|
28
28
|
}
|
|
29
29
|
}, [l]);
|
|
30
|
-
|
|
31
|
-
l.registerUpdateListener(({ editorState:
|
|
32
|
-
|
|
33
|
-
|
|
30
|
+
K(() => ae(
|
|
31
|
+
l.registerUpdateListener(({ editorState: e }) => {
|
|
32
|
+
e.read(() => {
|
|
33
|
+
_();
|
|
34
34
|
});
|
|
35
35
|
}),
|
|
36
36
|
l.registerCommand(
|
|
37
|
-
|
|
38
|
-
() => (
|
|
39
|
-
|
|
37
|
+
le,
|
|
38
|
+
() => (_(), !1),
|
|
39
|
+
F
|
|
40
40
|
)
|
|
41
|
-
), [l,
|
|
42
|
-
const
|
|
43
|
-
|
|
44
|
-
},
|
|
41
|
+
), [l, _]);
|
|
42
|
+
const A = (e) => {
|
|
43
|
+
e.pointerType !== "touch" && e.pointerType !== "pen" && e.preventDefault();
|
|
44
|
+
}, y = k(!1), s = k(null);
|
|
45
|
+
K(() => () => {
|
|
46
|
+
s.current && clearTimeout(s.current);
|
|
47
|
+
}, []);
|
|
48
|
+
const g = (e, c) => {
|
|
49
|
+
A(e), (e.pointerType === "touch" || e.pointerType === "pen") && (y.current = !0, c(), s.current && clearTimeout(s.current), s.current = setTimeout(() => {
|
|
50
|
+
y.current = !1, s.current = null;
|
|
51
|
+
}, 500));
|
|
52
|
+
}, h = (e) => {
|
|
53
|
+
if (y.current) {
|
|
54
|
+
y.current = !1, s.current && (clearTimeout(s.current), s.current = null);
|
|
55
|
+
return;
|
|
56
|
+
}
|
|
57
|
+
e();
|
|
58
|
+
}, w = () => {
|
|
45
59
|
setTimeout(() => {
|
|
46
60
|
l.getEditorState().read(() => {
|
|
47
|
-
|
|
61
|
+
_();
|
|
48
62
|
});
|
|
49
63
|
}, 0);
|
|
50
|
-
},
|
|
51
|
-
l.dispatchCommand(
|
|
52
|
-
},
|
|
64
|
+
}, b = (e) => {
|
|
65
|
+
l.dispatchCommand(re, e), w();
|
|
66
|
+
}, J = () => {
|
|
53
67
|
l.update(() => {
|
|
54
|
-
const
|
|
55
|
-
if (!
|
|
68
|
+
const e = M();
|
|
69
|
+
if (!I(e))
|
|
56
70
|
return;
|
|
57
|
-
const c =
|
|
71
|
+
const c = e.getNodes(), r = /* @__PURE__ */ new Set();
|
|
58
72
|
for (const m of c) {
|
|
59
73
|
let o = m;
|
|
60
|
-
for (; o !== null && !
|
|
74
|
+
for (; o !== null && !R(o); )
|
|
61
75
|
o = o.getParent();
|
|
62
|
-
|
|
76
|
+
R(o) && r.add(o);
|
|
63
77
|
}
|
|
64
|
-
const
|
|
65
|
-
for (const m of
|
|
78
|
+
const u = Array.from(r).reverse();
|
|
79
|
+
for (const m of u) {
|
|
66
80
|
const o = m.getParent();
|
|
67
|
-
if (!
|
|
81
|
+
if (!O(o))
|
|
68
82
|
continue;
|
|
69
|
-
const
|
|
70
|
-
for (const
|
|
71
|
-
|
|
72
|
-
const
|
|
73
|
-
if (o.insertAfter(
|
|
74
|
-
const
|
|
75
|
-
for (const
|
|
76
|
-
|
|
77
|
-
|
|
83
|
+
const p = q(), W = m.getChildren();
|
|
84
|
+
for (const S of W)
|
|
85
|
+
p.append(S);
|
|
86
|
+
const C = m.getNextSiblings();
|
|
87
|
+
if (o.insertAfter(p), C.length > 0) {
|
|
88
|
+
const S = C[0].getValue(), E = te(o.getListType(), S);
|
|
89
|
+
for (const Y of C)
|
|
90
|
+
E.append(Y);
|
|
91
|
+
p.insertAfter(E);
|
|
78
92
|
}
|
|
79
93
|
m.remove(), o.getChildrenSize() === 0 && o.remove();
|
|
80
94
|
}
|
|
81
95
|
});
|
|
82
|
-
},
|
|
83
|
-
|
|
84
|
-
},
|
|
85
|
-
|
|
86
|
-
const
|
|
87
|
-
if (
|
|
88
|
-
if (
|
|
89
|
-
const
|
|
90
|
-
|
|
96
|
+
}, D = () => {
|
|
97
|
+
T !== "ol" ? l.dispatchCommand(ee) : J(), w();
|
|
98
|
+
}, v = () => {
|
|
99
|
+
T !== "quote" ? l.update(() => {
|
|
100
|
+
const e = M();
|
|
101
|
+
if (I(e))
|
|
102
|
+
if (e.isCollapsed()) {
|
|
103
|
+
const r = e.anchor.getNode().getTopLevelElementOrThrow(), u = B();
|
|
104
|
+
r.insertAfter(u), u.selectEnd();
|
|
91
105
|
} else
|
|
92
|
-
|
|
106
|
+
$(e, () => B());
|
|
93
107
|
}) : l.update(() => {
|
|
94
|
-
const
|
|
95
|
-
|
|
96
|
-
}),
|
|
108
|
+
const e = M();
|
|
109
|
+
I(e) && $(e, () => q());
|
|
110
|
+
}), w();
|
|
97
111
|
};
|
|
98
|
-
return
|
|
112
|
+
return L ? null : /* @__PURE__ */ P(
|
|
99
113
|
"div",
|
|
100
114
|
{
|
|
101
|
-
className:
|
|
102
|
-
[
|
|
115
|
+
className: i(t.toolbar, {
|
|
116
|
+
[t.toolbarIsActive]: L ? !1 : a.isActive
|
|
103
117
|
}),
|
|
104
|
-
ref:
|
|
118
|
+
ref: U,
|
|
105
119
|
children: [
|
|
106
|
-
|
|
120
|
+
a.isActive ? !a.disableRichText && /* @__PURE__ */ P(
|
|
107
121
|
"div",
|
|
108
122
|
{
|
|
109
|
-
className:
|
|
110
|
-
[
|
|
123
|
+
className: i(t.iconToolbar, {
|
|
124
|
+
[t.shortBar]: a.shortBar
|
|
111
125
|
}),
|
|
112
126
|
children: [
|
|
113
|
-
/* @__PURE__ */
|
|
127
|
+
/* @__PURE__ */ n(
|
|
114
128
|
"button",
|
|
115
129
|
{
|
|
116
|
-
onPointerDown: b,
|
|
117
|
-
onClick: () =>
|
|
130
|
+
onPointerDown: (e) => g(e, () => b("bold")),
|
|
131
|
+
onClick: () => h(() => b("bold")),
|
|
118
132
|
type: "button",
|
|
119
|
-
className:
|
|
133
|
+
className: i(t.toolbarItem, { [t.active]: H }),
|
|
120
134
|
"data-testid": "format-bold",
|
|
121
|
-
"aria-label":
|
|
135
|
+
"aria-label": d.formatMessage({
|
|
122
136
|
id: "input.text_editor.plugins.toolbar_plugin.bold.aria_label",
|
|
123
137
|
defaultMessage: "Make text bold"
|
|
124
138
|
}),
|
|
125
|
-
children: /* @__PURE__ */
|
|
126
|
-
|
|
139
|
+
children: /* @__PURE__ */ n(
|
|
140
|
+
f,
|
|
127
141
|
{
|
|
128
142
|
name: "bold",
|
|
129
143
|
width: 24,
|
|
130
144
|
height: 24,
|
|
131
|
-
className:
|
|
145
|
+
className: i(t.format, t.bold)
|
|
132
146
|
}
|
|
133
147
|
)
|
|
134
148
|
}
|
|
135
149
|
),
|
|
136
|
-
/* @__PURE__ */
|
|
150
|
+
/* @__PURE__ */ n(
|
|
137
151
|
"button",
|
|
138
152
|
{
|
|
139
|
-
onPointerDown: b,
|
|
140
|
-
onClick: () =>
|
|
153
|
+
onPointerDown: (e) => g(e, () => b("italic")),
|
|
154
|
+
onClick: () => h(() => b("italic")),
|
|
141
155
|
type: "button",
|
|
142
|
-
className:
|
|
143
|
-
[
|
|
156
|
+
className: i(t.toolbarItem, {
|
|
157
|
+
[t.active]: V
|
|
144
158
|
}),
|
|
145
|
-
"aria-label":
|
|
159
|
+
"aria-label": d.formatMessage({
|
|
146
160
|
id: "input.text_editor.plugins.toolbar_plugin.italic.aria_label",
|
|
147
161
|
defaultMessage: "Make text italic"
|
|
148
162
|
}),
|
|
149
|
-
children: /* @__PURE__ */
|
|
150
|
-
|
|
163
|
+
children: /* @__PURE__ */ n(
|
|
164
|
+
f,
|
|
151
165
|
{
|
|
152
166
|
name: "italic",
|
|
153
167
|
width: 24,
|
|
154
168
|
height: 24,
|
|
155
|
-
className:
|
|
169
|
+
className: i(t.format, t.italic)
|
|
156
170
|
}
|
|
157
171
|
)
|
|
158
172
|
}
|
|
159
173
|
),
|
|
160
|
-
/* @__PURE__ */
|
|
174
|
+
/* @__PURE__ */ n(
|
|
161
175
|
"button",
|
|
162
176
|
{
|
|
163
|
-
onPointerDown: b,
|
|
164
|
-
onClick: () =>
|
|
177
|
+
onPointerDown: (e) => g(e, () => b("underline")),
|
|
178
|
+
onClick: () => h(() => b("underline")),
|
|
165
179
|
type: "button",
|
|
166
|
-
className:
|
|
167
|
-
[
|
|
180
|
+
className: i(t.toolbarItem, {
|
|
181
|
+
[t.active]: G
|
|
168
182
|
}),
|
|
169
|
-
"aria-label":
|
|
183
|
+
"aria-label": d.formatMessage({
|
|
170
184
|
id: "input.text_editor.plugins.toolbar_plugin.underline.aria_label",
|
|
171
185
|
defaultMessage: "Underline text"
|
|
172
186
|
}),
|
|
173
|
-
children: /* @__PURE__ */
|
|
174
|
-
|
|
187
|
+
children: /* @__PURE__ */ n(
|
|
188
|
+
f,
|
|
175
189
|
{
|
|
176
190
|
name: "underline",
|
|
177
191
|
width: 24,
|
|
178
192
|
height: 24,
|
|
179
|
-
className:
|
|
193
|
+
className: i(t.format, t.underline)
|
|
180
194
|
}
|
|
181
195
|
)
|
|
182
196
|
}
|
|
183
197
|
),
|
|
184
|
-
/* @__PURE__ */
|
|
198
|
+
/* @__PURE__ */ n(
|
|
185
199
|
"button",
|
|
186
200
|
{
|
|
187
|
-
onPointerDown:
|
|
188
|
-
onClick: () =>
|
|
201
|
+
onPointerDown: (e) => g(e, () => v()),
|
|
202
|
+
onClick: () => h(() => v()),
|
|
189
203
|
type: "button",
|
|
190
|
-
className:
|
|
191
|
-
[
|
|
204
|
+
className: i(t.toolbarItem, {
|
|
205
|
+
[t.active]: T === "quote"
|
|
192
206
|
}),
|
|
193
|
-
"aria-label":
|
|
207
|
+
"aria-label": d.formatMessage({
|
|
194
208
|
id: "input.text_editor.plugins.toolbar_plugin.blockquote.aria_label",
|
|
195
209
|
defaultMessage: "Add a blockquote"
|
|
196
210
|
}),
|
|
197
|
-
children: /* @__PURE__ */
|
|
198
|
-
|
|
211
|
+
children: /* @__PURE__ */ n(
|
|
212
|
+
f,
|
|
199
213
|
{
|
|
200
214
|
name: "blockquote",
|
|
201
215
|
width: 24,
|
|
202
216
|
height: 24,
|
|
203
|
-
className:
|
|
217
|
+
className: i(t.format, t.quote)
|
|
204
218
|
}
|
|
205
219
|
)
|
|
206
220
|
}
|
|
207
221
|
),
|
|
208
|
-
/* @__PURE__ */
|
|
222
|
+
/* @__PURE__ */ n(
|
|
209
223
|
"button",
|
|
210
224
|
{
|
|
211
|
-
onPointerDown:
|
|
212
|
-
onClick: () =>
|
|
225
|
+
onPointerDown: (e) => g(e, () => D()),
|
|
226
|
+
onClick: () => h(() => D()),
|
|
213
227
|
type: "button",
|
|
214
|
-
className:
|
|
215
|
-
[
|
|
228
|
+
className: i(t.toolbarItem, {
|
|
229
|
+
[t.active]: T === "ol"
|
|
216
230
|
}),
|
|
217
|
-
"aria-label":
|
|
231
|
+
"aria-label": d.formatMessage({
|
|
218
232
|
id: "input.text_editor.plugins.toolbar_plugin.numbered_list.aria_label",
|
|
219
233
|
defaultMessage: "Insert a numbered list"
|
|
220
234
|
}),
|
|
221
|
-
children: /* @__PURE__ */
|
|
222
|
-
|
|
235
|
+
children: /* @__PURE__ */ n(
|
|
236
|
+
f,
|
|
223
237
|
{
|
|
224
238
|
name: "orderedList",
|
|
225
239
|
width: 24,
|
|
226
240
|
height: 24,
|
|
227
|
-
className:
|
|
241
|
+
className: i(t.format, t.numberedList)
|
|
228
242
|
}
|
|
229
243
|
)
|
|
230
244
|
}
|
|
231
245
|
),
|
|
232
|
-
!
|
|
246
|
+
!a.hideSourceAction && /* @__PURE__ */ n(
|
|
233
247
|
"button",
|
|
234
248
|
{
|
|
235
|
-
onPointerDown:
|
|
236
|
-
onClick:
|
|
249
|
+
onPointerDown: A,
|
|
250
|
+
onClick: a.onAddSource,
|
|
237
251
|
type: "button",
|
|
238
|
-
className:
|
|
239
|
-
"aria-label":
|
|
252
|
+
className: t.toolbarItem,
|
|
253
|
+
"aria-label": d.formatMessage({
|
|
240
254
|
id: "input.text_editor.plugins.toolbar_plugin.add_link.aria_label",
|
|
241
255
|
defaultMessage: "Add hyperlink"
|
|
242
256
|
}),
|
|
243
|
-
children: /* @__PURE__ */
|
|
244
|
-
|
|
257
|
+
children: /* @__PURE__ */ n(
|
|
258
|
+
f,
|
|
245
259
|
{
|
|
246
260
|
name: "link",
|
|
247
261
|
width: 20,
|
|
248
262
|
height: 20,
|
|
249
|
-
className:
|
|
263
|
+
className: i(t.format, t.link)
|
|
250
264
|
}
|
|
251
265
|
)
|
|
252
266
|
}
|
|
@@ -254,18 +268,18 @@ const ye = (n) => {
|
|
|
254
268
|
]
|
|
255
269
|
}
|
|
256
270
|
) : null,
|
|
257
|
-
/* @__PURE__ */
|
|
258
|
-
|
|
271
|
+
/* @__PURE__ */ n("div", { className: t.actionButton, children: a.hideSubmit ? null : /* @__PURE__ */ n(
|
|
272
|
+
de,
|
|
259
273
|
{
|
|
260
274
|
type: "button",
|
|
261
275
|
"data-testid": "submit-button",
|
|
262
|
-
handleClick:
|
|
263
|
-
className:
|
|
264
|
-
"aria-label":
|
|
276
|
+
handleClick: a.onSubmit,
|
|
277
|
+
className: i(t.inputSubmitActionButton, t.submitAction),
|
|
278
|
+
"aria-label": d.formatMessage({
|
|
265
279
|
id: "input.text_editor.plugins.toolbar_plugin.submit_button.aria_label",
|
|
266
280
|
defaultMessage: "Send message"
|
|
267
281
|
}),
|
|
268
|
-
children: /* @__PURE__ */
|
|
282
|
+
children: /* @__PURE__ */ n(f, { name: "send", width: 20, height: 20 })
|
|
269
283
|
}
|
|
270
284
|
) })
|
|
271
285
|
]
|
|
@@ -273,5 +287,5 @@ const ye = (n) => {
|
|
|
273
287
|
);
|
|
274
288
|
};
|
|
275
289
|
export {
|
|
276
|
-
|
|
290
|
+
Ce as ToolbarPlugin
|
|
277
291
|
};
|