@logora/debate 0.4.75 → 0.4.76
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.
- package/dist/components/input/argument_input/ArgumentInput.js +91 -91
- package/dist/components/input/text_editor/TextEditor.js +115 -114
- package/dist/components/input/text_editor/plugins/FocusPlugin.js +7 -7
- package/dist/components/input/text_editor/plugins/ResetPlugin.js +19 -18
- package/package.json +1 -1
|
@@ -1,37 +1,37 @@
|
|
|
1
1
|
import { jsxs as C, jsx as s } from "react/jsx-runtime";
|
|
2
|
-
import
|
|
3
|
-
import { useRef as
|
|
4
|
-
import { useIntl as
|
|
5
|
-
import { useLocation as
|
|
2
|
+
import Ye from "@rooks/use-sessionstorage-state";
|
|
3
|
+
import { useRef as je, useState as u, useEffect as p, Suspense as ze, lazy as Oe } from "react";
|
|
4
|
+
import { useIntl as Je, FormattedMessage as he } from "react-intl";
|
|
5
|
+
import { useLocation as Ke } from "react-router";
|
|
6
6
|
import x from "classnames";
|
|
7
7
|
import n from "./ArgumentInput.module.scss.js";
|
|
8
|
-
import { useDataProvider as
|
|
9
|
-
import { useList as
|
|
10
|
-
import { useConfig as
|
|
11
|
-
import { useInput as
|
|
12
|
-
import { useAuth as
|
|
13
|
-
import { useFormValidation as
|
|
14
|
-
import { useResponsive as
|
|
15
|
-
import { useAuthRequired as
|
|
16
|
-
import { useModal as
|
|
17
|
-
import { useToast as
|
|
18
|
-
import { TogglePosition as
|
|
19
|
-
import { Avatar as
|
|
20
|
-
import { AuthorBox as
|
|
21
|
-
import { TextEditor as
|
|
22
|
-
import { Icon as
|
|
23
|
-
const
|
|
8
|
+
import { useDataProvider as Re } from "../../data/data_provider/useDataProvider.js";
|
|
9
|
+
import { useList as Ge } from "../../list/list_provider/useList.js";
|
|
10
|
+
import { useConfig as He } from "../../data/config_provider/useConfig.js";
|
|
11
|
+
import { useInput as Qe } from "../input_provider/useInput.js";
|
|
12
|
+
import { useAuth as Xe } from "../../auth/use_auth/useAuth.js";
|
|
13
|
+
import { useFormValidation as Ze } from "../../forms/use_form_validation/useFormValidation.js";
|
|
14
|
+
import { useResponsive as et } from "../../hooks/use_responsive/useResponsive.js";
|
|
15
|
+
import { useAuthRequired as tt } from "../../hooks/use_auth_required/useAuthRequired.js";
|
|
16
|
+
import { useModal as nt } from "../../dialog/modal/useModal.js";
|
|
17
|
+
import { useToast as at } from "../../dialog/toast_provider/useToast.js";
|
|
18
|
+
import { TogglePosition as st } from "../toggle_position/TogglePosition.js";
|
|
19
|
+
import { Avatar as it } from "../../user/avatar/Avatar.js";
|
|
20
|
+
import { AuthorBox as ot } from "../../user/author_box/AuthorBox.js";
|
|
21
|
+
import { TextEditor as rt } from "../text_editor/TextEditor.js";
|
|
22
|
+
import { Icon as ut } from "../../icons/icon/Icon.js";
|
|
23
|
+
const dt = Oe(() => import("../../modal/side_modal/index.js").then((N) => ({ default: N.SideModal }))), Pt = ({
|
|
24
24
|
argumentListId: N,
|
|
25
25
|
avatarSize: pe = 48,
|
|
26
|
-
disabled:
|
|
26
|
+
disabled: J = !1,
|
|
27
27
|
positions: a = [],
|
|
28
28
|
disabledPositions: T = [],
|
|
29
29
|
groupId: _,
|
|
30
30
|
groupName: _e,
|
|
31
|
-
groupType:
|
|
31
|
+
groupType: K,
|
|
32
32
|
hideSourceAction: Me = !1,
|
|
33
33
|
isReply: i = !1,
|
|
34
|
-
onSubmit:
|
|
34
|
+
onSubmit: R,
|
|
35
35
|
onUpdate: G,
|
|
36
36
|
parentId: M,
|
|
37
37
|
placeholder: ve,
|
|
@@ -44,62 +44,61 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
44
44
|
disableAutoActivate: we = !1,
|
|
45
45
|
autoFocus: Q = !1
|
|
46
46
|
}) => {
|
|
47
|
-
const r =
|
|
47
|
+
const r = Je(), X = Re(), L = Ge(), v = He(), {
|
|
48
48
|
focus: Z,
|
|
49
49
|
setFocus: ee,
|
|
50
|
-
setReset: Se,
|
|
51
50
|
inputContent: B,
|
|
52
51
|
setInputContent: te,
|
|
53
|
-
setInputRichContent:
|
|
54
|
-
} =
|
|
52
|
+
setInputRichContent: Se
|
|
53
|
+
} = Qe(), { isLoggedIn: S, currentUser: d } = Xe(), { errors: E, validate: $ } = Ze(), { isMobile: m } = et(), Ie = Ke(), ne = je(null), [V, k] = u([]), [q, D] = u(""), [ae, U] = u(null), [l, b] = u(null), [se, ie] = u(null), [oe, re] = u(!1), [I, ue] = u(!1), [A, de] = u({}), [xe, W] = u(!1), [Ne, Te] = u(0), [f, Le] = Ye(
|
|
55
54
|
"userSide",
|
|
56
55
|
{}
|
|
57
|
-
), [g, ye] =
|
|
56
|
+
), [g, ye] = u(
|
|
58
57
|
!S && v?.actions?.disableInputForVisitor
|
|
59
|
-
), Y =
|
|
60
|
-
typeof window < "u" ? window.location.search :
|
|
58
|
+
), Y = tt(), { showModal: Fe } = nt(), { toast: j } = at() || {}, le = new URLSearchParams(
|
|
59
|
+
typeof window < "u" ? window.location.search : Ie.search
|
|
61
60
|
);
|
|
62
61
|
p(() => {
|
|
63
62
|
ye(
|
|
64
63
|
!S && v?.actions?.disableInputForVisitor
|
|
65
64
|
);
|
|
66
65
|
}, [S, v]);
|
|
67
|
-
const z =
|
|
66
|
+
const z = d?.role === "editor" || d?.role === "moderator", ce = d?.moderation_status === "banned";
|
|
68
67
|
p(() => {
|
|
69
68
|
let e = null;
|
|
70
69
|
typeof window < "u" && (e = le.get("positionId")), w && w != a[2]?.id && a?.find((t) => t.id === w) ? b(w) : e && e != a[2]?.id ? b(e) : f && f.groupId == _ && f.positionId != a[2]?.id && b(f.positionId);
|
|
71
70
|
}, [w]), p(() => {
|
|
72
71
|
Q && W(!0);
|
|
73
72
|
}, [Q]), p(() => {
|
|
74
|
-
P && (O(), W(!0),
|
|
73
|
+
P && (O(), W(!0), y());
|
|
75
74
|
}, [P]), p(() => {
|
|
76
75
|
if (typeof window < "u") {
|
|
77
76
|
const e = be || le.get("initArgument");
|
|
78
|
-
(e === !0 || e === "true") && (W(!0),
|
|
77
|
+
(e === !0 || e === "true") && (W(!0), y(), De());
|
|
79
78
|
}
|
|
80
79
|
}, []), p(() => {
|
|
81
|
-
Z && (
|
|
80
|
+
Z && !i && (y(), ee(!1));
|
|
82
81
|
}, [Z]), p(() => {
|
|
83
|
-
B?.id && !i && (
|
|
82
|
+
B?.id && !i && (Pe(B), ee(!0));
|
|
84
83
|
}, [B]);
|
|
85
|
-
const
|
|
86
|
-
de(e), ue(!0), k(e.sources), D(e.content), U(e.rich_content), ie(e.id),
|
|
87
|
-
},
|
|
84
|
+
const Pe = (e) => {
|
|
85
|
+
de(e), ue(!0), k(e.sources), D(e.content), U(e.rich_content), ie(e.id), y(), b(e.position?.id), JSON.parse(e.rich_content).hasOwnProperty("root") ? Se(e.rich_content) : te(e.content);
|
|
86
|
+
}, y = () => {
|
|
88
87
|
ne.current.scrollIntoView({ behavior: "smooth", block: "center" });
|
|
89
88
|
}, me = () => {
|
|
90
|
-
D(""), U(null), de({}), ie(null), k([]),
|
|
91
|
-
},
|
|
89
|
+
D(""), U(null), de({}), ie(null), k([]), Te((e) => e + 1), te(null);
|
|
90
|
+
}, Be = (e) => {
|
|
92
91
|
b(e), ge(e);
|
|
93
|
-
},
|
|
94
|
-
|
|
95
|
-
/* @__PURE__ */ s(
|
|
96
|
-
|
|
92
|
+
}, Ee = () => {
|
|
93
|
+
Fe(
|
|
94
|
+
/* @__PURE__ */ s(ze, { fallback: null, children: /* @__PURE__ */ s(
|
|
95
|
+
dt,
|
|
97
96
|
{
|
|
98
97
|
modalTitle: r.formatMessage({
|
|
99
98
|
id: "modal.side_modal.modal_title",
|
|
100
99
|
defaultMessage: "Choose your side"
|
|
101
100
|
}),
|
|
102
|
-
onChooseSide:
|
|
101
|
+
onChooseSide: Be,
|
|
103
102
|
positions: a,
|
|
104
103
|
title: _e,
|
|
105
104
|
disabledPositions: !i && T,
|
|
@@ -107,11 +106,11 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
107
106
|
}
|
|
108
107
|
) })
|
|
109
108
|
);
|
|
110
|
-
},
|
|
111
|
-
S ? se ?
|
|
112
|
-
},
|
|
109
|
+
}, $e = () => {
|
|
110
|
+
S ? se ? qe() : !a || a?.length === 0 || !T?.find((e) => e?.id === l) && l || z && i ? ge(i && z && a[0]?.id) : Ee() : Y({ loginAction: "argument" });
|
|
111
|
+
}, Ve = (e, t) => {
|
|
113
112
|
g ? Y({ loginAction: "argument" }) : (D(e), U(t), $({ content: e }, [{ content: ["url", null] }]));
|
|
114
|
-
},
|
|
113
|
+
}, ke = (e) => {
|
|
115
114
|
k(e);
|
|
116
115
|
}, fe = [
|
|
117
116
|
{ content: ["length", 3] },
|
|
@@ -119,23 +118,23 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
119
118
|
{ content: ["url", null] },
|
|
120
119
|
...!a || a?.length === 0 ? [] : [{ position_id: ["required", null] }]
|
|
121
120
|
], ge = (e) => {
|
|
122
|
-
const t = e ||
|
|
121
|
+
const t = e || l, c = {
|
|
123
122
|
content: q,
|
|
124
123
|
rich_content: ae,
|
|
125
124
|
group_id: _,
|
|
126
|
-
...
|
|
125
|
+
...K && { group_type: K },
|
|
127
126
|
...t && { position_id: t },
|
|
128
127
|
is_reply: !!M,
|
|
129
128
|
message_id: M || null,
|
|
130
129
|
source_ids: V?.map((o) => o.id)
|
|
131
130
|
};
|
|
132
|
-
$(
|
|
131
|
+
$(c, fe) && (t && a && a.map((o) => o.id).includes(t) && Le({
|
|
133
132
|
groupId: _,
|
|
134
133
|
positionId: t
|
|
135
|
-
}), me(), X.create("messages",
|
|
134
|
+
}), me(), X.create("messages", c).then((o) => {
|
|
136
135
|
if (o.data.success) {
|
|
137
136
|
if (M)
|
|
138
|
-
|
|
137
|
+
R(o.data.data.resource), j(
|
|
139
138
|
r.formatMessage({
|
|
140
139
|
id: "alert.argument_create",
|
|
141
140
|
defaultMessage: "Your contribution has been sent !"
|
|
@@ -151,10 +150,10 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
151
150
|
else {
|
|
152
151
|
const h = o.data.data.resource;
|
|
153
152
|
let F = N;
|
|
154
|
-
t && !m && (F = `argumentList${h.position.id}`),
|
|
153
|
+
t && !m && (F = `argumentList${h.position.id}`), R?.(
|
|
155
154
|
q,
|
|
156
|
-
a.find((
|
|
157
|
-
),
|
|
155
|
+
a.find((We) => We.id === t) || null
|
|
156
|
+
), L.add(F, [h]), j(
|
|
158
157
|
r.formatMessage({
|
|
159
158
|
id: "alert.argument_create",
|
|
160
159
|
defaultMessage: "Your contribution has been sent !"
|
|
@@ -166,7 +165,7 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
166
165
|
defaultMessage: "Up to 10 eloquence points"
|
|
167
166
|
}),
|
|
168
167
|
category: "ARGUMENT",
|
|
169
|
-
contentKey:
|
|
168
|
+
contentKey: d.messages_count === 2 ? "alert.third_argument" : "alert.first_argument"
|
|
170
169
|
}
|
|
171
170
|
);
|
|
172
171
|
}
|
|
@@ -179,32 +178,32 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
179
178
|
);
|
|
180
179
|
}
|
|
181
180
|
}));
|
|
182
|
-
},
|
|
181
|
+
}, qe = () => {
|
|
183
182
|
const e = {
|
|
184
183
|
content: q,
|
|
185
184
|
rich_content: ae,
|
|
186
185
|
source_ids: V?.map((t) => t.id),
|
|
187
|
-
...
|
|
186
|
+
...l && { position_id: l }
|
|
188
187
|
};
|
|
189
188
|
$(e, fe) && X.update("messages", se, e).then((t) => {
|
|
190
189
|
if (t.data.success) {
|
|
191
|
-
const
|
|
190
|
+
const c = t.data.data.resource;
|
|
192
191
|
let o = N;
|
|
193
192
|
if (A?.is_reply || i) {
|
|
194
193
|
const h = A?.message_id || A?.reply_to_id || M;
|
|
195
194
|
h && (o = `argument_${h}_reply_list`);
|
|
196
|
-
} else
|
|
197
|
-
if (!A?.is_reply && A?.position?.id !=
|
|
198
|
-
const h = `argumentList${A.position.id}`, F = `argumentList${
|
|
199
|
-
|
|
195
|
+
} else l && !m && (o = `argumentList${c.position?.id}`);
|
|
196
|
+
if (!A?.is_reply && A?.position?.id != c.position?.id && !m) {
|
|
197
|
+
const h = `argumentList${A.position.id}`, F = `argumentList${c.position.id}`;
|
|
198
|
+
L.remove(h, [c]), L.add(F, [c]);
|
|
200
199
|
} else
|
|
201
|
-
|
|
202
|
-
G && G(
|
|
200
|
+
L.update(o, [c]);
|
|
201
|
+
G && G(c), j(r.formatMessage({ id: "alert.argument_modify" }), {
|
|
203
202
|
type: "success"
|
|
204
203
|
}), me();
|
|
205
204
|
}
|
|
206
205
|
});
|
|
207
|
-
},
|
|
206
|
+
}, De = () => {
|
|
208
207
|
if (!oe) {
|
|
209
208
|
re(!0);
|
|
210
209
|
const e = setTimeout(() => {
|
|
@@ -214,9 +213,9 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
214
213
|
}
|
|
215
214
|
}, O = () => {
|
|
216
215
|
g ? Y({ loginAction: "argument" }) : ue(!0);
|
|
217
|
-
},
|
|
216
|
+
}, Ue = () => {
|
|
218
217
|
const e = T.find(
|
|
219
|
-
(t) => t.id ===
|
|
218
|
+
(t) => t.id === l
|
|
220
219
|
);
|
|
221
220
|
if (e)
|
|
222
221
|
return r.formatMessage(
|
|
@@ -228,7 +227,7 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
228
227
|
);
|
|
229
228
|
};
|
|
230
229
|
return /* @__PURE__ */ C("div", { className: n.inputContainer, children: [
|
|
231
|
-
|
|
230
|
+
J && /* @__PURE__ */ s("div", { className: n.disabledInputMask, children: ce ? r.formatMessage({
|
|
232
231
|
id: "input.argument_input.user_banned",
|
|
233
232
|
defaultMessage: "You are banned from the debate space."
|
|
234
233
|
}) : r.formatMessage({
|
|
@@ -249,9 +248,9 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
249
248
|
defaultMessage: "Your position"
|
|
250
249
|
}) }),
|
|
251
250
|
/* @__PURE__ */ s(
|
|
252
|
-
|
|
251
|
+
st,
|
|
253
252
|
{
|
|
254
|
-
activeLabel:
|
|
253
|
+
activeLabel: l === a[0].id ? 0 : l === a[1].id ? 1 : null,
|
|
255
254
|
firstLabel: a[0],
|
|
256
255
|
secondLabel: a[1],
|
|
257
256
|
onChange: (e) => b(a[e].id)
|
|
@@ -274,19 +273,19 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
274
273
|
[n.argumentAuthorContainerActivated]: !m && I || i
|
|
275
274
|
}),
|
|
276
275
|
children: !m && I || i ? /* @__PURE__ */ s(
|
|
277
|
-
|
|
276
|
+
it,
|
|
278
277
|
{
|
|
279
|
-
avatarUrl:
|
|
280
|
-
userName:
|
|
278
|
+
avatarUrl: d.image_url,
|
|
279
|
+
userName: d.full_name,
|
|
281
280
|
size: pe
|
|
282
281
|
}
|
|
283
282
|
) : /* @__PURE__ */ s(
|
|
284
|
-
|
|
283
|
+
ot,
|
|
285
284
|
{
|
|
286
|
-
fullName:
|
|
287
|
-
avatarUrl:
|
|
288
|
-
points:
|
|
289
|
-
slug:
|
|
285
|
+
fullName: d?.full_name || r.formatMessage({ id: "default_author.full_name" }),
|
|
286
|
+
avatarUrl: d?.image_url,
|
|
287
|
+
points: d?.points || 0,
|
|
288
|
+
slug: d?.hash_id
|
|
290
289
|
}
|
|
291
290
|
)
|
|
292
291
|
}
|
|
@@ -301,41 +300,42 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
301
300
|
}),
|
|
302
301
|
children: [
|
|
303
302
|
/* @__PURE__ */ s(
|
|
304
|
-
|
|
303
|
+
rt,
|
|
305
304
|
{
|
|
306
305
|
handleChange: (e, t) => {
|
|
307
|
-
|
|
306
|
+
Ve(e, t);
|
|
308
307
|
},
|
|
309
308
|
handleSourcesChange: (e) => {
|
|
310
|
-
|
|
309
|
+
ke(e);
|
|
311
310
|
},
|
|
312
311
|
placeholder: ve,
|
|
313
312
|
"aria-label": r.formatMessage({
|
|
314
313
|
id: "input.argument_input.aria_label",
|
|
315
314
|
defaultMessage: "Message input field"
|
|
316
315
|
}),
|
|
317
|
-
onSubmit:
|
|
316
|
+
onSubmit: $e,
|
|
318
317
|
sources: V,
|
|
319
318
|
hideSourceAction: Me || g,
|
|
320
319
|
uid: M ? `Reply${_}_${M}` : `Argument${_}`,
|
|
321
320
|
onActivation: O,
|
|
322
321
|
showStylesControls: I,
|
|
323
|
-
disabled:
|
|
322
|
+
disabled: J || g || ce,
|
|
324
323
|
maxLength: g ? !1 : v?.actions?.argumentMaxLength,
|
|
325
324
|
disableRichText: v?.actions?.disableRichText || g,
|
|
326
325
|
shortBar: i,
|
|
327
326
|
isReply: i,
|
|
327
|
+
resetSignal: Ne,
|
|
328
328
|
hideSubmit: g,
|
|
329
329
|
allowedDomains: v?.allowed_sources,
|
|
330
330
|
active: P,
|
|
331
|
-
autoFocus:
|
|
331
|
+
autoFocus: xe,
|
|
332
332
|
hideCharCount: Ce,
|
|
333
333
|
disableAutoActivate: we
|
|
334
334
|
}
|
|
335
335
|
),
|
|
336
336
|
E?.content && /* @__PURE__ */ s("div", { className: n.argumentInputWarning, children: E && Object.values(E).map((e, t) => /* @__PURE__ */ s("div", { children: e }, t)) }),
|
|
337
337
|
I && T?.find(
|
|
338
|
-
(e) => e.id ===
|
|
338
|
+
(e) => e.id === l
|
|
339
339
|
) && /* @__PURE__ */ C(
|
|
340
340
|
"div",
|
|
341
341
|
{
|
|
@@ -345,7 +345,7 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
345
345
|
),
|
|
346
346
|
children: [
|
|
347
347
|
/* @__PURE__ */ s(
|
|
348
|
-
|
|
348
|
+
ut,
|
|
349
349
|
{
|
|
350
350
|
name: "announcement",
|
|
351
351
|
className: n.warningIcon,
|
|
@@ -353,7 +353,7 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
353
353
|
width: 20
|
|
354
354
|
}
|
|
355
355
|
),
|
|
356
|
-
/* @__PURE__ */ s("div", { className: n.argumentInputWarningText, children:
|
|
356
|
+
/* @__PURE__ */ s("div", { className: n.argumentInputWarningText, children: Ue() })
|
|
357
357
|
]
|
|
358
358
|
}
|
|
359
359
|
),
|
|
@@ -394,5 +394,5 @@ const ut = ze(() => import("../../modal/side_modal/index.js").then((N) => ({ def
|
|
|
394
394
|
] });
|
|
395
395
|
};
|
|
396
396
|
export {
|
|
397
|
-
|
|
397
|
+
Pt as ArgumentInput
|
|
398
398
|
};
|
|
@@ -1,188 +1,189 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { ListNode as
|
|
3
|
-
import { OverflowNode as
|
|
4
|
-
import { CharacterLimitPlugin as
|
|
5
|
-
import { LexicalComposer as
|
|
6
|
-
import { ContentEditable as
|
|
7
|
-
import { EditorRefPlugin as
|
|
8
|
-
import { LexicalErrorBoundary as
|
|
9
|
-
import { HistoryPlugin as
|
|
10
|
-
import { ListPlugin as
|
|
11
|
-
import { OnChangePlugin as
|
|
12
|
-
import { RichTextPlugin as
|
|
13
|
-
import { QuoteNode as
|
|
14
|
-
import
|
|
15
|
-
import { $getRoot as
|
|
16
|
-
import { useState as
|
|
17
|
-
import { useIntl as
|
|
18
|
-
import
|
|
1
|
+
import { jsxs as x, Fragment as it, jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import { ListNode as nt, ListItemNode as st } from "@lexical/list";
|
|
3
|
+
import { OverflowNode as ct } from "@lexical/overflow";
|
|
4
|
+
import { CharacterLimitPlugin as lt } from "@lexical/react/LexicalCharacterLimitPlugin";
|
|
5
|
+
import { LexicalComposer as mt } from "@lexical/react/LexicalComposer";
|
|
6
|
+
import { ContentEditable as at } from "@lexical/react/LexicalContentEditable";
|
|
7
|
+
import { EditorRefPlugin as dt } from "@lexical/react/LexicalEditorRefPlugin";
|
|
8
|
+
import { LexicalErrorBoundary as ut } from "@lexical/react/LexicalErrorBoundary";
|
|
9
|
+
import { HistoryPlugin as ft } from "@lexical/react/LexicalHistoryPlugin";
|
|
10
|
+
import { ListPlugin as pt } from "@lexical/react/LexicalListPlugin";
|
|
11
|
+
import { OnChangePlugin as ht } from "@lexical/react/LexicalOnChangePlugin";
|
|
12
|
+
import { RichTextPlugin as gt } from "@lexical/react/LexicalRichTextPlugin";
|
|
13
|
+
import { QuoteNode as St } from "@lexical/rich-text";
|
|
14
|
+
import R from "classnames";
|
|
15
|
+
import { $getRoot as xt } from "lexical";
|
|
16
|
+
import { useState as p, useId as Pt, useRef as Ct, useEffect as w } from "react";
|
|
17
|
+
import { useIntl as Tt } from "react-intl";
|
|
18
|
+
import It from "./EditorTheme.js";
|
|
19
19
|
import i from "./TextEditor.module.scss.js";
|
|
20
|
-
import { AutoSavePlugin as
|
|
21
|
-
import { FocusPlugin as
|
|
22
|
-
import { IOSInsertParagraphFallbackPlugin as
|
|
23
|
-
import { MaxLengthPlugin as
|
|
24
|
-
import { ResetPlugin as
|
|
25
|
-
import { SetContentPlugin as
|
|
26
|
-
import { SetRichContentPlugin as
|
|
27
|
-
import { ToolbarPlugin as
|
|
28
|
-
import { useModal as
|
|
29
|
-
import { SourceModal as
|
|
30
|
-
import { SourceListItem as
|
|
31
|
-
const
|
|
20
|
+
import { AutoSavePlugin as Nt } from "./plugins/AutoSavePlugin.js";
|
|
21
|
+
import { FocusPlugin as vt } from "./plugins/FocusPlugin.js";
|
|
22
|
+
import { IOSInsertParagraphFallbackPlugin as Et } from "./plugins/IOSInsertParagraphFallbackPlugin.js";
|
|
23
|
+
import { MaxLengthPlugin as bt } from "./plugins/MaxLengthPlugin.js";
|
|
24
|
+
import { ResetPlugin as Mt } from "./plugins/ResetPlugin.js";
|
|
25
|
+
import { SetContentPlugin as Rt } from "./plugins/SetContentPlugin.js";
|
|
26
|
+
import { SetRichContentPlugin as wt } from "./plugins/SetRichContentPlugin.js";
|
|
27
|
+
import { ToolbarPlugin as Lt } from "./plugins/ToolbarPlugin.js";
|
|
28
|
+
import { useModal as _t } from "../../dialog/modal/useModal.js";
|
|
29
|
+
import { SourceModal as yt } from "../../source/source_modal/SourceModal.js";
|
|
30
|
+
import { SourceListItem as At } from "../../source/source_list_item/SourceListItem.js";
|
|
31
|
+
const L = (l) => l?.replace(/ /g, " "), ae = ({
|
|
32
32
|
placeholder: l,
|
|
33
|
-
initialContent:
|
|
34
|
-
initialRichContent:
|
|
35
|
-
onSubmit:
|
|
36
|
-
sources:
|
|
33
|
+
initialContent: _,
|
|
34
|
+
initialRichContent: y,
|
|
35
|
+
onSubmit: P,
|
|
36
|
+
sources: h,
|
|
37
37
|
hideSubmit: A = !1,
|
|
38
38
|
hideSourceAction: O = !1,
|
|
39
39
|
onActivation: n,
|
|
40
40
|
disabled: k = !1,
|
|
41
|
-
handleChange:
|
|
42
|
-
handleSourcesChange:
|
|
41
|
+
handleChange: C,
|
|
42
|
+
handleSourcesChange: g,
|
|
43
43
|
shortBar: B = !1,
|
|
44
|
-
active:
|
|
44
|
+
active: S = !1,
|
|
45
45
|
maxLength: m,
|
|
46
46
|
disableRichText: U = !1,
|
|
47
47
|
editorRef: j,
|
|
48
|
-
uid:
|
|
49
|
-
allowedDomains:
|
|
48
|
+
uid: T,
|
|
49
|
+
allowedDomains: I = [],
|
|
50
50
|
hideCharCount: z = !1,
|
|
51
51
|
disableAutoActivate: F = !1,
|
|
52
52
|
autoFocus: a = !1,
|
|
53
|
-
isReply:
|
|
54
|
-
|
|
53
|
+
isReply: d = !1,
|
|
54
|
+
resetSignal: H,
|
|
55
|
+
...J
|
|
55
56
|
}) => {
|
|
56
|
-
const [s,
|
|
57
|
+
const [s, Q] = p(a || S), [W, $] = p(""), [q, D] = p(""), [u, f] = p([]), { showModal: G } = _t(), N = Tt(), v = Pt(), E = Ct(!1);
|
|
57
58
|
w(() => {
|
|
58
59
|
a && !E.current && n && (E.current = !0, n());
|
|
59
60
|
}, [a, n]), w(() => {
|
|
60
|
-
|
|
61
|
-
}, [
|
|
61
|
+
h && f(h);
|
|
62
|
+
}, [h]);
|
|
62
63
|
const b = () => {
|
|
63
|
-
s || (
|
|
64
|
-
},
|
|
64
|
+
s || (Q(!0), n && n());
|
|
65
|
+
}, K = {
|
|
65
66
|
editable: !k,
|
|
66
|
-
theme:
|
|
67
|
-
onError(
|
|
68
|
-
console.error("TextEditor error:",
|
|
67
|
+
theme: It,
|
|
68
|
+
onError(e) {
|
|
69
|
+
console.error("TextEditor error:", e);
|
|
69
70
|
},
|
|
70
|
-
nodes: [
|
|
71
|
-
},
|
|
71
|
+
nodes: [nt, st, St, ct]
|
|
72
|
+
}, V = () => {
|
|
72
73
|
b();
|
|
73
|
-
},
|
|
74
|
-
|
|
75
|
-
const o =
|
|
76
|
-
|
|
74
|
+
}, X = (e) => {
|
|
75
|
+
e.read(() => {
|
|
76
|
+
const o = xt().getTextContent(), r = L(o), c = JSON.stringify(e), M = L(c);
|
|
77
|
+
$(r), D(M), C && C(r, M);
|
|
77
78
|
});
|
|
78
|
-
},
|
|
79
|
-
const o =
|
|
80
|
-
|
|
81
|
-
},
|
|
82
|
-
|
|
83
|
-
/* @__PURE__ */
|
|
84
|
-
|
|
79
|
+
}, Y = (e) => {
|
|
80
|
+
const o = W, r = q, c = u;
|
|
81
|
+
P && (e.preventDefault(), P(o, r, c)), f([]), g?.([]);
|
|
82
|
+
}, Z = () => {
|
|
83
|
+
G(
|
|
84
|
+
/* @__PURE__ */ t(
|
|
85
|
+
yt,
|
|
85
86
|
{
|
|
86
|
-
onAddSource:
|
|
87
|
-
allowedSources:
|
|
87
|
+
onAddSource: tt,
|
|
88
|
+
allowedSources: I
|
|
88
89
|
}
|
|
89
90
|
)
|
|
90
91
|
);
|
|
91
|
-
},
|
|
92
|
-
|
|
93
|
-
const r = [...o,
|
|
94
|
-
return
|
|
92
|
+
}, tt = (e) => {
|
|
93
|
+
f((o) => {
|
|
94
|
+
const r = [...o, e];
|
|
95
|
+
return g?.(r), r;
|
|
95
96
|
});
|
|
96
|
-
},
|
|
97
|
-
|
|
97
|
+
}, et = (e) => {
|
|
98
|
+
f((o) => {
|
|
98
99
|
const r = o.filter(
|
|
99
|
-
(c) => c.source_url !==
|
|
100
|
+
(c) => c.source_url !== e.source_url
|
|
100
101
|
);
|
|
101
|
-
return
|
|
102
|
+
return g?.(r), r;
|
|
102
103
|
});
|
|
103
|
-
},
|
|
104
|
-
|
|
104
|
+
}, ot = (e, o) => /* @__PURE__ */ t(
|
|
105
|
+
At,
|
|
105
106
|
{
|
|
106
|
-
publisher:
|
|
107
|
-
url:
|
|
108
|
-
title:
|
|
107
|
+
publisher: e.publisher,
|
|
108
|
+
url: e.source_url,
|
|
109
|
+
title: e.title,
|
|
109
110
|
index: o,
|
|
110
|
-
onRemove: () =>
|
|
111
|
+
onRemove: () => et(e)
|
|
111
112
|
},
|
|
112
113
|
o
|
|
113
|
-
),
|
|
114
|
-
return /* @__PURE__ */
|
|
115
|
-
/* @__PURE__ */
|
|
114
|
+
), rt = () => /* @__PURE__ */ t("div", { className: i.editorPlaceholder, children: l });
|
|
115
|
+
return /* @__PURE__ */ x(it, { children: [
|
|
116
|
+
/* @__PURE__ */ t(mt, { initialConfig: K, children: /* @__PURE__ */ t("div", { className: i.editorContainer, onClick: V, children: /* @__PURE__ */ x(
|
|
116
117
|
"div",
|
|
117
118
|
{
|
|
118
|
-
className:
|
|
119
|
-
[i.editorInnerInactive]: !s && !
|
|
119
|
+
className: R(i.editorInner, {
|
|
120
|
+
[i.editorInnerInactive]: !s && !S
|
|
120
121
|
}),
|
|
121
122
|
children: [
|
|
122
|
-
/* @__PURE__ */
|
|
123
|
-
|
|
123
|
+
/* @__PURE__ */ t(
|
|
124
|
+
gt,
|
|
124
125
|
{
|
|
125
|
-
contentEditable: /* @__PURE__ */
|
|
126
|
-
|
|
126
|
+
contentEditable: /* @__PURE__ */ t(
|
|
127
|
+
at,
|
|
127
128
|
{
|
|
128
|
-
className:
|
|
129
|
+
className: R(i.editorInput, {
|
|
129
130
|
[i.editorInputInactive]: !s
|
|
130
131
|
}),
|
|
131
|
-
...
|
|
132
|
+
...J
|
|
132
133
|
}
|
|
133
134
|
),
|
|
134
|
-
placeholder: l && /* @__PURE__ */
|
|
135
|
-
ErrorBoundary:
|
|
135
|
+
placeholder: l && /* @__PURE__ */ t(rt, {}),
|
|
136
|
+
ErrorBoundary: ut
|
|
136
137
|
}
|
|
137
138
|
),
|
|
138
|
-
/* @__PURE__ */
|
|
139
|
-
|
|
139
|
+
/* @__PURE__ */ t(
|
|
140
|
+
Lt,
|
|
140
141
|
{
|
|
141
142
|
hideSourceAction: O,
|
|
142
143
|
hideSubmit: A,
|
|
143
144
|
disableRichText: U,
|
|
144
145
|
shortBar: B,
|
|
145
|
-
onSubmit:
|
|
146
|
-
onAddSource:
|
|
147
|
-
isActive: s ||
|
|
148
|
-
sourceTooltip:
|
|
146
|
+
onSubmit: Y,
|
|
147
|
+
onAddSource: Z,
|
|
148
|
+
isActive: s || S,
|
|
149
|
+
sourceTooltip: I?.length > 0 && N.formatMessage({
|
|
149
150
|
id: "input.allowed_domains_tooltip",
|
|
150
151
|
defaultMessage: "With the new source function, you can add links to your article."
|
|
151
152
|
})
|
|
152
153
|
}
|
|
153
154
|
),
|
|
154
|
-
s && m && !z && /* @__PURE__ */
|
|
155
|
-
/* @__PURE__ */
|
|
155
|
+
s && m && !z && /* @__PURE__ */ x("div", { className: i.charactersCount, children: [
|
|
156
|
+
/* @__PURE__ */ t(lt, { maxLength: m }),
|
|
156
157
|
" ",
|
|
157
158
|
N.formatMessage({
|
|
158
159
|
id: "input.remaining_chars",
|
|
159
160
|
defaultMessage: "remaining characters"
|
|
160
161
|
})
|
|
161
162
|
] }),
|
|
162
|
-
/* @__PURE__ */
|
|
163
|
-
/* @__PURE__ */
|
|
164
|
-
/* @__PURE__ */
|
|
165
|
-
/* @__PURE__ */
|
|
166
|
-
|
|
163
|
+
/* @__PURE__ */ t(pt, {}),
|
|
164
|
+
/* @__PURE__ */ t(ft, {}),
|
|
165
|
+
/* @__PURE__ */ t(ht, { onChange: X, ignoreSelectionChange: !0 }),
|
|
166
|
+
/* @__PURE__ */ t(
|
|
167
|
+
Nt,
|
|
167
168
|
{
|
|
168
169
|
onSetContent: F ? () => {
|
|
169
170
|
} : b,
|
|
170
|
-
storageUid:
|
|
171
|
+
storageUid: T || v
|
|
171
172
|
}
|
|
172
173
|
),
|
|
173
|
-
/* @__PURE__ */
|
|
174
|
-
/* @__PURE__ */
|
|
175
|
-
/* @__PURE__ */
|
|
176
|
-
/* @__PURE__ */
|
|
177
|
-
m && /* @__PURE__ */
|
|
178
|
-
/* @__PURE__ */
|
|
179
|
-
/* @__PURE__ */
|
|
174
|
+
/* @__PURE__ */ t(Rt, { content: _, isReply: d }),
|
|
175
|
+
/* @__PURE__ */ t(wt, { richContent: y, isReply: d }),
|
|
176
|
+
/* @__PURE__ */ t(vt, { autoFocus: a, isReply: d }),
|
|
177
|
+
/* @__PURE__ */ t(Et, {}),
|
|
178
|
+
m && /* @__PURE__ */ t(bt, { maxLength: m }),
|
|
179
|
+
/* @__PURE__ */ t(Mt, { storageUid: T || v, resetSignal: H, isReply: d }),
|
|
180
|
+
/* @__PURE__ */ t(dt, { editorRef: j })
|
|
180
181
|
]
|
|
181
182
|
}
|
|
182
183
|
) }) }),
|
|
183
|
-
|
|
184
|
+
u && u.length !== 0 ? /* @__PURE__ */ t("div", { className: i.sourcesBox, children: /* @__PURE__ */ t("div", { className: i.sourceList, children: u.map(ot) }) }) : null
|
|
184
185
|
] });
|
|
185
186
|
};
|
|
186
187
|
export {
|
|
187
|
-
|
|
188
|
+
ae as TextEditor
|
|
188
189
|
};
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { useLexicalComposerContext as
|
|
2
|
-
import { useRef as
|
|
3
|
-
import { useInput as
|
|
4
|
-
const
|
|
5
|
-
const [e] =
|
|
1
|
+
import { useLexicalComposerContext as c } from "@lexical/react/LexicalComposerContext";
|
|
2
|
+
import { useRef as l, useEffect as n } from "react";
|
|
3
|
+
import { useInput as f } from "../../input_provider/useInput.js";
|
|
4
|
+
const E = ({ autoFocus: o = !1, isReply: s = !1 }) => {
|
|
5
|
+
const [e] = c(), { focus: t } = f(), r = l(!1);
|
|
6
6
|
return n(() => {
|
|
7
|
-
t && e.focus(() => {
|
|
7
|
+
t && !s && e.focus(() => {
|
|
8
8
|
e.getRootElement().focus({ preventScroll: !0 });
|
|
9
9
|
});
|
|
10
10
|
}, [t, e]), n(() => {
|
|
@@ -14,5 +14,5 @@ const p = ({ autoFocus: o = !1 }) => {
|
|
|
14
14
|
}, [o, e]), null;
|
|
15
15
|
};
|
|
16
16
|
export {
|
|
17
|
-
|
|
17
|
+
E as FocusPlugin
|
|
18
18
|
};
|
|
@@ -1,23 +1,24 @@
|
|
|
1
|
-
import { useLexicalComposerContext as
|
|
2
|
-
import
|
|
3
|
-
import { $addUpdateTag as
|
|
4
|
-
import { useEffect as
|
|
5
|
-
import { useInput as
|
|
6
|
-
const
|
|
7
|
-
const [
|
|
8
|
-
`TextEditor:content_${
|
|
1
|
+
import { useLexicalComposerContext as u } from "@lexical/react/LexicalComposerContext";
|
|
2
|
+
import l from "@rooks/use-localstorage-state";
|
|
3
|
+
import { $addUpdateTag as d, $getRoot as R, $createParagraphNode as g } from "lexical";
|
|
4
|
+
import { useRef as x, useEffect as C } from "react";
|
|
5
|
+
import { useInput as $ } from "../../input_provider/useInput.js";
|
|
6
|
+
const y = ({ storageUid: c, resetSignal: t, isReply: a = !1 }) => {
|
|
7
|
+
const [p] = u(), { reset: e, setReset: i } = $(), [h, v, m] = l(
|
|
8
|
+
`TextEditor:content_${c}`,
|
|
9
9
|
{}
|
|
10
|
-
);
|
|
11
|
-
return
|
|
12
|
-
t &&
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
10
|
+
), o = x(t);
|
|
11
|
+
return C(() => {
|
|
12
|
+
const f = t !== void 0 && t !== o.current;
|
|
13
|
+
o.current = t, (f || e && !a) && p.update(() => {
|
|
14
|
+
d("skip-dom-selection");
|
|
15
|
+
const r = R(), s = g();
|
|
16
|
+
r.clear(), r.append(s);
|
|
17
|
+
const n = s.selectStart();
|
|
18
|
+
n.format = 0, n.style = "", m(), e && i(!1);
|
|
18
19
|
});
|
|
19
|
-
}, [t]), null;
|
|
20
|
+
}, [t, e]), null;
|
|
20
21
|
};
|
|
21
22
|
export {
|
|
22
|
-
|
|
23
|
+
y as ResetPlugin
|
|
23
24
|
};
|