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