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