@uva-glass/component-library 1.62.12 → 1.64.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/dist/LexicalClipboard.prod-C6LsK5E6.js +311 -0
  2. package/dist/LexicalClipboard.prod-C6LsK5E6.js.map +1 -0
  3. package/dist/LexicalTable.prod-DqzrJuYr.js +1221 -0
  4. package/dist/LexicalTable.prod-DqzrJuYr.js.map +1 -0
  5. package/dist/{LexicalUtils.prod-DlLRWqta.js → LexicalUtils.prod-BTFNWAMw.js} +33 -42
  6. package/dist/{LexicalUtils.prod-DlLRWqta.js.map → LexicalUtils.prod-BTFNWAMw.js.map} +1 -1
  7. package/dist/{TablePlugin-B3ZkyOU_.js → TablePlugin-BLzR0g93.js} +58 -55
  8. package/dist/{TablePlugin-B3ZkyOU_.js.map → TablePlugin-BLzR0g93.js.map} +1 -1
  9. package/dist/assets/AccordionCard.css +1 -0
  10. package/dist/components/AccordionCard/AccordionCard.d.ts +10 -0
  11. package/dist/components/AccordionCard/AccordionCard.js +58 -0
  12. package/dist/components/AccordionCard/AccordionCard.js.map +1 -0
  13. package/dist/components/AccordionCard/AccordionCard.stories.d.ts +5 -0
  14. package/dist/components/AccordionCard/AccordionCard.stories.js +33 -0
  15. package/dist/components/AccordionCard/AccordionCard.stories.js.map +1 -0
  16. package/dist/components/AccordionCard/index.d.ts +1 -0
  17. package/dist/components/AccordionCard/index.js +5 -0
  18. package/dist/components/AccordionCard/index.js.map +1 -0
  19. package/dist/components/CheckboxTree/CheckboxTree.js +24 -20
  20. package/dist/components/CheckboxTree/CheckboxTree.js.map +1 -1
  21. package/dist/components/FormInput/FormInput.js +15 -11
  22. package/dist/components/FormInput/FormInput.js.map +1 -1
  23. package/dist/components/InputField/InputField.stories.js +16 -12
  24. package/dist/components/InputField/InputField.stories.js.map +1 -1
  25. package/dist/components/MultiSelect/MultiSelect.js +1 -1
  26. package/dist/components/MultiSelect/MultiSelect.stories.js +1 -1
  27. package/dist/components/MultiSelect/components/MultiSelectHeader.js +6 -2
  28. package/dist/components/MultiSelect/components/MultiSelectHeader.js.map +1 -1
  29. package/dist/components/MultiSelect/index.js +1 -1
  30. package/dist/components/PeriodSelector/PeriodSelector.js +22 -18
  31. package/dist/components/PeriodSelector/PeriodSelector.js.map +1 -1
  32. package/dist/components/ProgrammeCard/ProgrammeCard.stories.js +20 -16
  33. package/dist/components/ProgrammeCard/ProgrammeCard.stories.js.map +1 -1
  34. package/dist/components/RteEditor/EditorHeader/EditorHeader.js +7 -3
  35. package/dist/components/RteEditor/EditorHeader/EditorHeader.js.map +1 -1
  36. package/dist/components/RteEditor/Plugins/BlockFormatPlugin/BlockFormatPlugin.js +16 -16
  37. package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js +19 -16
  38. package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js.map +1 -1
  39. package/dist/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.js +7 -3
  40. package/dist/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.js.map +1 -1
  41. package/dist/components/RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js +1 -1
  42. package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js +100 -98
  43. package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js.map +1 -1
  44. package/dist/components/RteEditor/Plugins/LinkPlugin/helpers.js +1 -1
  45. package/dist/components/RteEditor/Plugins/ListPlugin/ListPlugin.js +36 -36
  46. package/dist/components/RteEditor/Plugins/ListPlugin/ListPlugin.js.map +1 -1
  47. package/dist/components/RteEditor/Plugins/PasteHandlerPlugin/PasteHandlerPlugin.d.ts +1 -0
  48. package/dist/components/RteEditor/Plugins/PasteHandlerPlugin/PasteHandlerPlugin.js +31 -0
  49. package/dist/components/RteEditor/Plugins/PasteHandlerPlugin/PasteHandlerPlugin.js.map +1 -0
  50. package/dist/components/RteEditor/Plugins/PasteHandlerPlugin/index.d.ts +1 -0
  51. package/dist/components/RteEditor/Plugins/PasteHandlerPlugin/index.js +5 -0
  52. package/dist/components/RteEditor/Plugins/PasteHandlerPlugin/index.js.map +1 -0
  53. package/dist/components/RteEditor/Plugins/TablePlugin/AddTableFrom.js +6 -2
  54. package/dist/components/RteEditor/Plugins/TablePlugin/AddTableFrom.js.map +1 -1
  55. package/dist/components/RteEditor/Plugins/TablePlugin/TablePlugin.js +7 -4
  56. package/dist/components/RteEditor/Plugins/TablePlugin/TablePlugin.js.map +1 -1
  57. package/dist/components/RteEditor/Plugins/TablePlugin/helpers.js +12 -12
  58. package/dist/components/RteEditor/Plugins/TablePlugin/index.js +1 -1
  59. package/dist/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.js +36 -36
  60. package/dist/components/RteEditor/Plugins/index.js +1 -1
  61. package/dist/components/RteEditor/RteEditor.js +361 -358
  62. package/dist/components/RteEditor/RteEditor.js.map +1 -1
  63. package/dist/components/RteEditor/helpers.js +27 -27
  64. package/dist/components/index.d.ts +1 -0
  65. package/dist/components/index.js +98 -96
  66. package/dist/components/index.js.map +1 -1
  67. package/dist/helpers-B-pdj8pq.js +168 -0
  68. package/dist/{helpers-CC9_diXm.js.map → helpers-B-pdj8pq.js.map} +1 -1
  69. package/dist/index.js +98 -96
  70. package/dist/index.js.map +1 -1
  71. package/package.json +13 -16
  72. package/dist/Lexical.prod-DOTdxgeo.js +0 -4072
  73. package/dist/Lexical.prod-DOTdxgeo.js.map +0 -1
  74. package/dist/LexicalLink.prod-Cqa5Im8X.js +0 -208
  75. package/dist/LexicalLink.prod-Cqa5Im8X.js.map +0 -1
  76. package/dist/LexicalList.prod-DlqzsJTH.js +0 -564
  77. package/dist/LexicalList.prod-DlqzsJTH.js.map +0 -1
  78. package/dist/LexicalTable.prod-BKz2StgB.js +0 -1525
  79. package/dist/LexicalTable.prod-BKz2StgB.js.map +0 -1
  80. package/dist/helpers-CC9_diXm.js +0 -168
@@ -1,34 +1,37 @@
1
1
  import { jsxs as m, jsx as t, Fragment as Z } from "react/jsx-runtime";
2
2
  import { u as ee } from "./LexicalComposerContext.prod-Dyvim1tK.js";
3
- import { c as $ } from "./clsx-OuTLNxxd.js";
4
- import { g as te, o as oe } from "./LexicalTable.prod-BKz2StgB.js";
5
- import { g as re, O as le, M as U, v as z, w as ne } from "./Lexical.prod-DOTdxgeo.js";
6
- import { forwardRef as A, useState as C, useRef as T, useId as M, useImperativeHandle as B, useEffect as g } from "react";
7
- import { Button as L } from "./components/Buttons/Button.js";
3
+ import { c as P } from "./clsx-OuTLNxxd.js";
4
+ import { g as te, o as oe } from "./LexicalTable.prod-DqzrJuYr.js";
5
+ import { KEY_DOWN_COMMAND as re, COMMAND_PRIORITY_EDITOR as le, $getSelection as U, $isRangeSelection as z, $getRoot as ne } from "lexical";
6
+ import { forwardRef as A, useState as C, useRef as T, useId as O, useImperativeHandle as B, useEffect as g } from "react";
7
+ import { Button as E } from "./components/Buttons/Button.js";
8
8
  import "./components/Buttons/LinkButton.js";
9
9
  import "@react-aria/button";
10
- import { Label as E } from "./components/Label/Label.js";
10
+ import { Label as L } from "./components/Label/Label.js";
11
11
  import "@react-aria/dialog";
12
12
  import "@react-aria/focus";
13
13
  import "@react-aria/overlays";
14
14
  import "./components/OverlayCloseButton/OverlayCloseButton.js";
15
- import { FormField as O } from "./components/FormField/FormField.js";
15
+ import { FormField as M } from "./components/FormField/FormField.js";
16
16
  import "./components/GridRow/GridRow.js";
17
17
  import "./components/IconButton/IconButton.js";
18
18
  import "./components/Input/Input.js";
19
- import { InputField as D } from "./components/InputField/InputField.js";
19
+ import { InputField as q } from "./components/InputField/InputField.js";
20
20
  import "react-router-dom";
21
21
  import { s as R, M as ie } from "./MultiSelectItem-D9PxdX43.js";
22
+ import "@lexical/list";
23
+ import "@lexical/link";
22
24
  import "./components/RteEditor/Providers/LanguageProvider.js";
23
- import { e as ae, v as se } from "./helpers-CC9_diXm.js";
24
- import { Icon as K } from "./components/Icon/Icon.js";
25
- import { FeedbackBox as V } from "./components/FeedbackBox/FeedbackBox.js";
25
+ import { e as ae, v as se } from "./helpers-B-pdj8pq.js";
26
+ import { Icon as V } from "./components/Icon/Icon.js";
27
+ import { FeedbackBox as K } from "./components/FeedbackBox/FeedbackBox.js";
26
28
  import { useTranslation as H } from "./components/RteEditor/hooks/useTranslation.js";
27
29
  import "./components/RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
28
30
  import "./components/RteEditor/hooks/components/Flyout.js";
29
31
  import { deleteTable as ce, deleteColumn as me, insertColumn as ue, deleteRow as de, insertRow as fe, createTable as pe } from "./components/RteEditor/Plugins/TablePlugin/helpers.js";
30
32
  import { useFlyout as _e } from "./components/RteEditor/hooks/useFlyout.js";
31
33
  import { s as I } from "./RteEditor.module-DcvGRx3a.js";
34
+ import "@staartwind.nl/lexical-paste-from-word";
32
35
  import "./components/SelectListbox/SelectListbox.js";
33
36
  import "./components/SelectListbox/SelectProvider.js";
34
37
  import "./components/Sortable/components/SortableItem.js";
@@ -36,22 +39,22 @@ import "./SortableProvider-BUsvniX7.js";
36
39
  import { setScrollableContainers as be, removeScrollableContainers as he } from "./components/RteEditor/helpers.js";
37
40
  import './assets/TablePlugin.css';function ke({ label: _, clearTrigger: d, onClear: a }) {
38
41
  return /* @__PURE__ */ m("header", { className: R["multi-select__header"], children: [
39
- /* @__PURE__ */ t(E, { htmlFor: "multi-select-list", children: _ }),
40
- d && /* @__PURE__ */ t(L, { variant: "blank", onClick: a, children: d })
42
+ /* @__PURE__ */ t(L, { htmlFor: "multi-select-list", children: _ }),
43
+ d && /* @__PURE__ */ t(E, { variant: "blank", onClick: a, children: d })
41
44
  ] });
42
45
  }
43
- const j = ({ scrollable: _ = !0, noBorder: d, header: a, children: l }) => /* @__PURE__ */ m(Z, { children: [
46
+ const Y = ({ scrollable: _ = !0, noBorder: d, header: a, children: l }) => /* @__PURE__ */ m(Z, { children: [
44
47
  a,
45
48
  /* @__PURE__ */ t(
46
49
  "div",
47
50
  {
48
- className: $(R["multi-select"], {
51
+ className: P(R["multi-select"], {
49
52
  [R["multi-select--no-border"]]: d
50
53
  }),
51
54
  children: /* @__PURE__ */ t(
52
55
  "ul",
53
56
  {
54
- className: $(R["multi-select__list"], {
57
+ className: P(R["multi-select__list"], {
55
58
  [R["multi-select__list--scrollable"]]: _
56
59
  }),
57
60
  id: "multi-select-list",
@@ -61,8 +64,8 @@ const j = ({ scrollable: _ = !0, noBorder: d, header: a, children: l }) => /* @_
61
64
  }
62
65
  )
63
66
  ] });
64
- j.MultiSelectHeader = ke;
65
- j.MultiSelectItem = ie;
67
+ Y.MultiSelectHeader = ke;
68
+ Y.MultiSelectItem = ie;
66
69
  const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
67
70
  linkform: ve,
68
71
  "linkform__input-field": "_linkform__input-field_x5q7m_5",
@@ -70,19 +73,19 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
70
73
  "linkform__input-url-wrapper": "_linkform__input-url-wrapper_x5q7m_19",
71
74
  "linkform__open-url-button": "_linkform__open-url-button_x5q7m_31",
72
75
  "editor__toolbar-button": "_editor__toolbar-button_x5q7m_55"
73
- }, at = A(
76
+ }, mt = A(
74
77
  ({ onCloseHandler: _, onSaveHandler: d, isLink: a = { active: !1, url: "", linktext: "" } }, l) => {
75
- const n = H(), [f, u] = C(a.url || ""), [s, b] = C(a.linktext || ""), [w, h] = C(!1), [F, k] = C(null), [v, p] = C(null), r = T(null), y = `link_${M()}`, e = `text_${M()}`, o = () => {
78
+ const n = H(), [f, u] = C(a.url || ""), [s, b] = C(a.linktext || ""), [w, h] = C(!1), [F, k] = C(null), [v, p] = C(null), r = T(null), y = `link_${O()}`, e = `text_${O()}`, o = () => {
76
79
  window.open(ae(f), "_blank");
77
80
  }, x = (i) => {
78
81
  u(i.target.value);
79
82
  }, c = (i) => {
80
83
  b(i.target.value);
81
- }, S = (i) => se(i) === !1 || i.trim() === "" ? (k(n.errortext.urlNotValid), !1) : (k(null), !0), W = (i) => i.trim() === "" ? (p(n.errortext.linkTextNotValid), !1) : (p(null), !0), Y = () => {
82
- !S(f) || w && !W(s) || (d(f, s), P());
84
+ }, S = (i) => se(i) === !1 || i.trim() === "" ? (k(n.errortext.urlNotValid), !1) : (k(null), !0), j = (i) => i.trim() === "" ? (p(n.errortext.linkTextNotValid), !1) : (p(null), !0), W = () => {
85
+ !S(f) || w && !j(s) || (d(f, s), $());
83
86
  }, G = () => {
84
- _(), P();
85
- }, P = () => {
87
+ _(), $();
88
+ }, $ = () => {
86
89
  u(""), h(!1), k(null), p(null);
87
90
  }, J = (i, X) => {
88
91
  u(i), !X && !i && h(!0);
@@ -90,15 +93,15 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
90
93
  r.current && r.current.focus();
91
94
  };
92
95
  return B(l, () => ({
93
- clearForm: P,
96
+ clearForm: $,
94
97
  focusFirstField: Q,
95
98
  setDefaults: J
96
99
  })), /* @__PURE__ */ m("div", { className: N.linkform, children: [
97
- /* @__PURE__ */ m(O, { className: N["linkform__input-field"], children: [
98
- /* @__PURE__ */ t(E, { htmlFor: y, children: n.links.linkLabel }),
100
+ /* @__PURE__ */ m(M, { className: N["linkform__input-field"], children: [
101
+ /* @__PURE__ */ t(L, { htmlFor: y, children: n.links.linkLabel }),
99
102
  /* @__PURE__ */ m("div", { className: N["linkform__input-url-wrapper"], children: [
100
103
  /* @__PURE__ */ t(
101
- D,
104
+ q,
102
105
  {
103
106
  id: y,
104
107
  placeholder: n.links.linkPlaceholder,
@@ -109,14 +112,14 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
109
112
  "aria-label": n.aria.labels.linkField
110
113
  }
111
114
  ),
112
- f && /* @__PURE__ */ t("button", { type: "button", onClick: o, className: N["linkform__open-url-button"], children: /* @__PURE__ */ t(K, { name: "ArrowTopRightOnSquare", size: 20 }) })
115
+ f && /* @__PURE__ */ t("button", { type: "button", onClick: o, className: N["linkform__open-url-button"], children: /* @__PURE__ */ t(V, { name: "ArrowTopRightOnSquare", size: 20 }) })
113
116
  ] }),
114
- F && /* @__PURE__ */ t(V, { level: "error", feedback: F })
117
+ F && /* @__PURE__ */ t(K, { level: "error", feedback: F })
115
118
  ] }),
116
- w && /* @__PURE__ */ m(O, { className: N["linkform__input-field"], children: [
117
- /* @__PURE__ */ t(E, { htmlFor: e, children: n.links.linkText }),
119
+ w && /* @__PURE__ */ m(M, { className: N["linkform__input-field"], children: [
120
+ /* @__PURE__ */ t(L, { htmlFor: e, children: n.links.linkText }),
118
121
  /* @__PURE__ */ t(
119
- D,
122
+ q,
120
123
  {
121
124
  id: e,
122
125
  value: s,
@@ -125,20 +128,20 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
125
128
  "aria-label": n.aria.labels.linkTextfield
126
129
  }
127
130
  ),
128
- v && /* @__PURE__ */ t(V, { level: "error", feedback: v })
131
+ v && /* @__PURE__ */ t(K, { level: "error", feedback: v })
129
132
  ] }),
130
133
  /* @__PURE__ */ m("div", { className: N.linkform__footer, children: [
131
- /* @__PURE__ */ t(L, { variant: "secondary", onClick: G, "aria-label": n.common.cancel, type: "button", children: n.common.cancel }),
132
- /* @__PURE__ */ t(L, { variant: "primary", onClick: Y, "aria-label": n.aria.labels.linkOkButton, type: "button", children: n.links.addLink })
134
+ /* @__PURE__ */ t(E, { variant: "secondary", onClick: G, "aria-label": n.common.cancel, type: "button", children: n.common.cancel }),
135
+ /* @__PURE__ */ t(E, { variant: "primary", onClick: W, "aria-label": n.aria.labels.linkOkButton, type: "button", children: n.links.addLink })
133
136
  ] })
134
137
  ] });
135
138
  }
136
- ), Fe = "_tableform_t5fpq_1", Ce = "_tableform__footer_t5fpq_12", q = {
139
+ ), Fe = "_tableform_t5fpq_1", Ce = "_tableform__footer_t5fpq_12", D = {
137
140
  tableform: Fe,
138
141
  "tableform__input-field": "_tableform__input-field_t5fpq_5",
139
142
  tableform__footer: Ce
140
143
  }, ye = A(({ onCloseHandler: _, onSaveHandler: d }, a) => {
141
- const l = H(), [n, f] = C(), [u, s] = C(), b = T(null), w = `row_${M()}`, h = `column_${M()}`, F = (r, y) => {
144
+ const l = H(), [n, f] = C(), [u, s] = C(), b = T(null), w = `row_${O()}`, h = `column_${O()}`, F = (r, y) => {
142
145
  const e = r.target.value;
143
146
  y === "row" ? f(parseInt(e)) : s(parseInt(e));
144
147
  }, k = () => {
@@ -161,11 +164,11 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
161
164
  return be(r), window.addEventListener("scroll", r), window.addEventListener("resize", r), () => {
162
165
  window.removeEventListener("scroll", r), window.removeEventListener("resize", r), he(r);
163
166
  };
164
- }, []), /* @__PURE__ */ m("div", { className: q.tableform, children: [
165
- /* @__PURE__ */ m(O, { className: q["tableform__input-field"], children: [
166
- /* @__PURE__ */ t(E, { htmlFor: w, children: l.table.nrofRows }),
167
+ }, []), /* @__PURE__ */ m("div", { className: D.tableform, children: [
168
+ /* @__PURE__ */ m(M, { className: D["tableform__input-field"], children: [
169
+ /* @__PURE__ */ t(L, { htmlFor: w, children: l.table.nrofRows }),
167
170
  /* @__PURE__ */ t(
168
- D,
171
+ q,
169
172
  {
170
173
  id: w,
171
174
  placeholder: l.table.nrofRowsPlaceholder,
@@ -176,10 +179,10 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
176
179
  }
177
180
  )
178
181
  ] }),
179
- /* @__PURE__ */ m(O, { className: q["tableform__input-field"], children: [
180
- /* @__PURE__ */ t(E, { htmlFor: h, children: l.table.nrofColumns }),
182
+ /* @__PURE__ */ m(M, { className: D["tableform__input-field"], children: [
183
+ /* @__PURE__ */ t(L, { htmlFor: h, children: l.table.nrofColumns }),
181
184
  /* @__PURE__ */ t(
182
- D,
185
+ q,
183
186
  {
184
187
  id: h,
185
188
  placeholder: l.table.nrofColumnsPlaceholder,
@@ -189,10 +192,10 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
189
192
  }
190
193
  )
191
194
  ] }),
192
- /* @__PURE__ */ m("div", { className: q.tableform__footer, children: [
193
- /* @__PURE__ */ t(L, { variant: "secondary", onClick: v, "aria-label": l.common.cancel, children: l.common.cancel }),
195
+ /* @__PURE__ */ m("div", { className: D.tableform__footer, children: [
196
+ /* @__PURE__ */ t(E, { variant: "secondary", onClick: v, "aria-label": l.common.cancel, children: l.common.cancel }),
194
197
  /* @__PURE__ */ t(
195
- L,
198
+ E,
196
199
  {
197
200
  variant: "primary",
198
201
  onClick: k,
@@ -203,7 +206,7 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
203
206
  )
204
207
  ] })
205
208
  ] });
206
- }), xe = 200, st = A(({ isActive: _ }, d) => {
209
+ }), xe = 200, ut = A(({ isActive: _ }, d) => {
207
210
  const a = H(), [l] = ee(), { flyout: n, showFlyout: f, hideFlyout: u, isVisible: s } = _e(), b = T(), w = T(null), h = T(!1), F = T(s), k = () => {
208
211
  var o;
209
212
  const e = (o = w.current) == null ? void 0 : o.getBoundingClientRect();
@@ -283,22 +286,22 @@ const ve = "_linkform_x5q7m_1", we = "_linkform__footer_x5q7m_12", N = {
283
286
  {
284
287
  onClick: k,
285
288
  title: a.table.tableTooltip,
286
- className: $(I["editor__toolbar-button"], _ && I["editor__toolbar-button--active"]),
289
+ className: P(I["editor__toolbar-button"], _ && I["editor__toolbar-button--active"]),
287
290
  "aria-label": a.aria.labels.table,
288
291
  "aria-keyshortcuts": a.aria.keyshortcuts.table,
289
292
  ref: w,
290
293
  type: "button",
291
- children: /* @__PURE__ */ t(K, { name: "Table", size: 24 })
294
+ children: /* @__PURE__ */ t(V, { name: "Table", size: 24 })
292
295
  }
293
296
  ),
294
297
  n
295
298
  ] }) });
296
299
  });
297
300
  export {
298
- at as A,
299
- j as M,
300
- st as T,
301
+ mt as A,
302
+ Y as M,
303
+ ut as T,
301
304
  ke as a,
302
305
  ye as b
303
306
  };
304
- //# sourceMappingURL=TablePlugin-B3ZkyOU_.js.map
307
+ //# sourceMappingURL=TablePlugin-BLzR0g93.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TablePlugin-B3ZkyOU_.js","sources":["../src/components/MultiSelect/components/MultiSelectHeader.tsx","../src/components/MultiSelect/MultiSelect.tsx","../src/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.tsx","../src/components/RteEditor/Plugins/TablePlugin/AddTableFrom.tsx","../src/components/RteEditor/Plugins/TablePlugin/TablePlugin.tsx"],"sourcesContent":["import styles from 'components/MultiSelect/MultiSelect.module.css';\nimport { Label } from 'components/Label';\nimport { Button } from 'components';\n\nexport interface MultiSelectHeaderProps {\n label: string;\n clearTrigger?: string;\n onClear?: () => void;\n}\n\nexport function MultiSelectHeader({ label, clearTrigger, onClear }: MultiSelectHeaderProps) {\n return (\n <header className={styles['multi-select__header']}>\n <Label htmlFor=\"multi-select-list\">{label}</Label>\n {clearTrigger && (\n <Button variant={'blank'} onClick={onClear}>\n {clearTrigger}\n </Button>\n )}\n </header>\n );\n}\n","import clsx from 'clsx';\n\nimport type { PropsWithChildren, ReactNode } from 'react';\n\nimport styles from './MultiSelect.module.css';\n\nimport { MultiSelectItem } from 'components/MultiSelect/components/MultiSelectItem';\nimport { MultiSelectHeader } from 'components/MultiSelect/components/MultiSelectHeader';\n\nexport interface MultiSelectProps {\n /** `true` if the container should scroll on overflow; otherwise, `false` to resize the container to its contents. The default is `true`. */\n scrollable?: boolean;\n /** `true` to disable the border around the container; otherwise, `false`. The default is `false`. */\n noBorder?: boolean;\n /** The header contents. */\n header?: ReactNode;\n}\n\n/** Represents a component to list a number of checkboxes. */\nexport const MultiSelect = ({ scrollable = true, noBorder, header, children }: PropsWithChildren<MultiSelectProps>) => (\n <>\n {header}\n <div\n className={clsx(styles['multi-select'], {\n [styles['multi-select--no-border']]: noBorder,\n })}\n >\n <ul\n className={clsx(styles['multi-select__list'], {\n [styles['multi-select__list--scrollable']]: scrollable,\n })}\n id=\"multi-select-list\"\n >\n {children}\n </ul>\n </div>\n </>\n);\n\nMultiSelect.MultiSelectHeader = MultiSelectHeader;\nMultiSelect.MultiSelectItem = MultiSelectItem;\n","import { useState, forwardRef, useImperativeHandle, useRef, useId } from 'react';\n\nimport type { ChangeEvent } from 'react';\nimport type { LinkType } from 'components/RteEditor/Plugins/LinkPlugin';\n\nimport styles from './AddLinkForm.module.css';\n\nimport { ensureHttps, validateUrlWithProtocol } from 'components/RteEditor/Plugins/LinkPlugin/helpers';\nimport { Button, FeedbackBox, FormField, Icon, InputField, Label } from 'components';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\ninterface AddLinkFormProps {\n onCloseHandler: () => void;\n onSaveHandler: (url: string, linktext: string) => void;\n isLink: LinkType;\n}\n\nexport interface addLinkFormMethods {\n clearForm: () => void;\n focusFirstField: () => void;\n setDefaults: (url: string, linktext: string) => void;\n}\n\nexport const AddLinkForm = forwardRef(\n (\n { onCloseHandler, onSaveHandler, isLink = { active: false, url: '', linktext: '' } }: AddLinkFormProps,\n ref\n ): JSX.Element => {\n const t = useTranslation();\n const [url, setUrl] = useState<string>(isLink.url || '');\n const [linkText, setLinkText] = useState<string>(isLink.linktext || '');\n const [showLinktextField, setShowLinktextField] = useState<boolean>(false);\n const [urlError, setUrlError] = useState<string | null>(null);\n const [linkTextError, setLinkTextError] = useState<string | null>(null);\n const firstField = useRef<HTMLInputElement>(null);\n const linkId = `link_${useId()}`;\n const textId = `text_${useId()}`;\n\n const handleOpenUrl = () => {\n window.open(ensureHttps(url), '_blank');\n };\n\n const handleUrl = (event: ChangeEvent<HTMLInputElement>) => {\n setUrl(event.target.value);\n };\n\n const handleLinkText = (event: ChangeEvent<HTMLInputElement>) => {\n setLinkText(event.target.value);\n };\n\n const validateUrl = (url: string): boolean => {\n if (validateUrlWithProtocol(url) === false || url.trim() === '') {\n setUrlError(t.errortext.urlNotValid);\n return false;\n }\n setUrlError(null);\n return true;\n };\n\n const validateLinkText = (linkText: string): boolean => {\n if (linkText.trim() === '') {\n setLinkTextError(t.errortext.linkTextNotValid);\n return false;\n }\n setLinkTextError(null);\n return true;\n };\n\n const handleSave = () => {\n if (!validateUrl(url) || (showLinktextField && !validateLinkText(linkText))) {\n return;\n }\n\n onSaveHandler(url, linkText);\n resetForm();\n };\n\n const handleClose = () => {\n onCloseHandler();\n resetForm();\n };\n\n const resetForm = () => {\n setUrl('');\n setShowLinktextField(false);\n setUrlError(null);\n setLinkTextError(null);\n };\n\n const setDefaults = (url: string, linktext: string) => {\n setUrl(url);\n if (!linktext && !url) {\n setShowLinktextField(true);\n }\n };\n\n const focusFirstField = () => {\n if (firstField.current) {\n firstField.current.focus();\n }\n };\n\n useImperativeHandle(ref, () => ({\n clearForm: resetForm,\n focusFirstField,\n setDefaults,\n }));\n\n return (\n <div className={styles['linkform']}>\n <FormField className={styles['linkform__input-field']}>\n <Label htmlFor={linkId}>{t.links.linkLabel}</Label>\n <div className={styles['linkform__input-url-wrapper']}>\n <InputField\n id={linkId}\n placeholder={t.links.linkPlaceholder}\n value={url}\n onChange={(event) => handleUrl(event)}\n onFocus={() => setUrlError(null)}\n ref={firstField}\n aria-label={t.aria.labels.linkField}\n />\n {url && (\n <button type=\"button\" onClick={handleOpenUrl} className={styles['linkform__open-url-button']}>\n <Icon name=\"ArrowTopRightOnSquare\" size={20} />\n </button>\n )}\n </div>\n {urlError && <FeedbackBox level=\"error\" feedback={urlError} />}\n </FormField>\n {showLinktextField && (\n <FormField className={styles['linkform__input-field']}>\n <Label htmlFor={textId}>{t.links.linkText}</Label>\n <InputField\n id={textId}\n value={linkText}\n onChange={(event) => handleLinkText(event)}\n onFocus={() => setLinkTextError(null)}\n aria-label={t.aria.labels.linkTextfield}\n />\n {linkTextError && <FeedbackBox level=\"error\" feedback={linkTextError} />}\n </FormField>\n )}\n <div className={styles['linkform__footer']}>\n <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel} type=\"button\">\n {t.common.cancel}\n </Button>\n <Button variant={'primary'} onClick={handleSave} aria-label={t.aria.labels.linkOkButton} type=\"button\">\n {t.links.addLink}\n </Button>\n </div>\n </div>\n );\n }\n);\n","import { useState, forwardRef, useImperativeHandle, useRef, useId, useEffect } from 'react';\n\nimport type { ChangeEvent } from 'react';\n\nimport styles from './AddTableFrom.module.css';\n\nimport { Button, FormField, InputField, Label } from 'components';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\nimport { removeScrollableContainers, setScrollableContainers } from 'components/RteEditor/helpers';\n\ninterface AddTableFormProps {\n onCloseHandler: () => void;\n onSaveHandler: (nrfOfRows: number, nrOfColumns: number) => void;\n}\n\nexport interface addTableForm {\n clearForm: () => void;\n focusFirstField: () => void;\n}\n\nexport const AddTableForm = forwardRef(({ onCloseHandler, onSaveHandler }: AddTableFormProps, ref) => {\n const t = useTranslation();\n const [rowCount, setRowCount] = useState<number>();\n const [columnCount, setColumnCount] = useState<number>();\n const firstField = useRef<HTMLInputElement>(null);\n const rowId = `row_${useId()}`;\n const columnId = `column_${useId()}`;\n\n const handleDimentionChange = (event: ChangeEvent<HTMLInputElement>, type: string) => {\n const value = event.target.value;\n type === 'row' ? setRowCount(parseInt(value)) : setColumnCount(parseInt(value));\n };\n\n const handleSave = () => {\n if (rowCount !== undefined && columnCount !== undefined) {\n onSaveHandler(rowCount, columnCount);\n resetForm();\n }\n };\n\n const handleClose = () => {\n onCloseHandler();\n resetForm();\n };\n\n const resetForm = () => {\n setRowCount(undefined);\n setColumnCount(undefined);\n };\n\n useImperativeHandle(ref, () => ({\n clearForm: resetForm,\n focusFirstField: () => firstField.current?.focus(),\n }));\n\n useEffect(() => {\n const handleResizeScroll = () => {\n handleClose();\n };\n\n setScrollableContainers(handleResizeScroll);\n\n window.addEventListener('scroll', handleResizeScroll);\n window.addEventListener('resize', handleResizeScroll);\n\n return () => {\n window.removeEventListener('scroll', handleResizeScroll);\n window.removeEventListener('resize', handleResizeScroll);\n removeScrollableContainers(handleResizeScroll);\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return (\n <div className={styles['tableform']}>\n <FormField className={styles['tableform__input-field']}>\n <Label htmlFor={rowId}>{t.table.nrofRows}</Label>\n <InputField\n id={rowId}\n placeholder={t.table.nrofRowsPlaceholder}\n value={rowCount ? rowCount : ''}\n onChange={(event) => handleDimentionChange(event, 'row')}\n aria-label={t.aria.labels.tableRowfield}\n ref={firstField}\n />\n </FormField>\n <FormField className={styles['tableform__input-field']}>\n <Label htmlFor={columnId}>{t.table.nrofColumns}</Label>\n <InputField\n id={columnId}\n placeholder={t.table.nrofColumnsPlaceholder}\n value={columnCount ? columnCount : ''}\n onChange={(event) => handleDimentionChange(event, 'column')}\n aria-label={t.aria.labels.tableColumnfield}\n />\n </FormField>\n <div className={styles['tableform__footer']}>\n <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel}>\n {t.common.cancel}\n </Button>\n <Button\n variant={'primary'}\n onClick={handleSave}\n disabled={!rowCount || !columnCount}\n aria-label={t.aria.labels.tableOkButton}\n >\n {t.common.add}\n </Button>\n </div>\n </div>\n );\n});\n","import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport clsx from 'clsx';\nimport { $getTableCellNodeFromLexicalNode, $isTableCellNode } from '@lexical/table';\nimport { $getSelection, $isRangeSelection, $getRoot, KEY_DOWN_COMMAND, COMMAND_PRIORITY_EDITOR } from 'lexical';\nimport { useRef, useEffect, useImperativeHandle, forwardRef } from 'react';\n\nimport type { TextNode } from 'lexical';\nimport type { addTableForm } from './AddTableFrom';\nimport type { Actions } from './TableCellContextMenu';\n\nimport { AddTableForm } from './AddTableFrom';\nimport { createTable, deleteColumn, deleteRow, deleteTable, insertColumn, insertRow } from './helpers';\n\nimport { useFlyout } from 'components/RteEditor/hooks/useFlyout';\nimport { Icon } from 'components';\nimport styles from 'components/RteEditor/RteEditor.module.css';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\nconst PREVENT_OPEN_DELAY = 200;\n\ninterface TablePluginProps {\n isActive: boolean;\n}\n\nexport interface TableMutation {\n mutateTable: (type: Actions) => void;\n}\n\nexport const TablePlugin = forwardRef(({ isActive }: TablePluginProps, ref): JSX.Element => {\n const t = useTranslation();\n const [editor] = useLexicalComposerContext();\n const { flyout, showFlyout, hideFlyout, isVisible } = useFlyout();\n const addTableForm = useRef<addTableForm>();\n const buttonRef = useRef<HTMLButtonElement>(null);\n const preventOpen = useRef(false);\n const isVisibleRef = useRef(isVisible);\n\n const openFlyout = () => {\n const rect = buttonRef.current?.getBoundingClientRect();\n if (!preventOpen.current && rect) {\n showFlyout({ position: { top: rect.bottom, left: rect.left }, ...flyoutOptions });\n }\n };\n\n const closeFlyout = () => {\n hideFlyout();\n };\n\n const insertTable = (nrOfRows: number, nrOfColumns: number) => {\n editor.update(() => {\n const selection = $getSelection();\n const tableNode = createTable(nrOfRows, nrOfColumns);\n if ($isRangeSelection(selection)) {\n selection.insertNodes([tableNode]);\n } else {\n $getRoot().append(tableNode);\n }\n const firstDescendant = tableNode.getFirstDescendant();\n if (firstDescendant) {\n (firstDescendant as TextNode).select();\n }\n });\n\n closeFlyout();\n };\n\n const mutateTable = (action: Actions) => {\n editor.update(() => {\n const selection = $getSelection();\n if ($isRangeSelection(selection)) {\n const anchorNode = selection.anchor.getNode();\n const currentNode = $getTableCellNodeFromLexicalNode(anchorNode);\n\n if ($isTableCellNode(currentNode)) {\n switch (action) {\n case 'insertRowAbove':\n case 'insertRowBelow':\n insertRow(currentNode, action);\n break;\n case 'deleteRow':\n deleteRow(currentNode);\n break;\n case 'insertColumnLeft':\n case 'insertColumnRight':\n insertColumn(currentNode, action);\n break;\n case 'deleteColumn':\n deleteColumn(currentNode);\n break;\n case 'deleteTable':\n deleteTable(currentNode);\n break;\n }\n }\n }\n });\n };\n\n const flyoutOptions = {\n children: (\n <AddTableForm\n onCloseHandler={closeFlyout}\n onSaveHandler={(rows, columns) => insertTable(rows, columns)}\n ref={addTableForm}\n />\n ),\n };\n\n useEffect(() => {\n if (!isVisible) {\n addTableForm.current?.clearForm();\n setTimeout(() => (preventOpen.current = false), PREVENT_OPEN_DELAY);\n } else {\n preventOpen.current = true;\n addTableForm.current?.focusFirstField();\n }\n }, [addTableForm, isVisible]);\n\n useEffect(() => {\n const removeKeyboardShortcut = editor.registerCommand(\n KEY_DOWN_COMMAND,\n (event: KeyboardEvent) => {\n if (event.ctrlKey && event.shiftKey && event.code === 'Digit9') {\n event.preventDefault();\n openFlyout();\n return true;\n }\n return false;\n },\n COMMAND_PRIORITY_EDITOR\n );\n\n return () => {\n removeKeyboardShortcut();\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [editor]);\n\n useEffect(() => {\n isVisibleRef.current = isVisible;\n }, [isVisible]);\n\n useEffect(() => {\n const removeKeydown = (event: KeyboardEvent) => {\n if (event.key === 'Escape' && isVisibleRef.current) {\n event.preventDefault();\n event.stopPropagation();\n closeFlyout();\n }\n };\n\n document.addEventListener('keydown', removeKeydown, { capture: true });\n\n return () => {\n document.removeEventListener('keydown', removeKeydown);\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useImperativeHandle(ref, () => ({\n mutateTable,\n }));\n\n return (\n <div className={styles['editor__toolbar-button-group']}>\n <div className={styles['editor__toolbar-button-flyoutwrapper']}>\n <button\n onClick={openFlyout}\n title={t.table.tableTooltip}\n className={clsx(styles['editor__toolbar-button'], isActive && styles[`editor__toolbar-button--active`])}\n aria-label={t.aria.labels.table}\n aria-keyshortcuts={t.aria.keyshortcuts.table}\n ref={buttonRef}\n type=\"button\"\n >\n <Icon name=\"Table\" size={24} />\n </button>\n {flyout}\n </div>\n </div>\n );\n});\n"],"names":["MultiSelectHeader","label","clearTrigger","onClear","jsxs","styles","jsx","Label","Button","MultiSelect","scrollable","noBorder","header","children","Fragment","clsx","MultiSelectItem","AddLinkForm","forwardRef","onCloseHandler","onSaveHandler","isLink","ref","t","useTranslation","url","setUrl","useState","linkText","setLinkText","showLinktextField","setShowLinktextField","urlError","setUrlError","linkTextError","setLinkTextError","firstField","useRef","linkId","useId","textId","handleOpenUrl","ensureHttps","handleUrl","event","handleLinkText","validateUrl","validateUrlWithProtocol","validateLinkText","handleSave","resetForm","handleClose","setDefaults","linktext","focusFirstField","useImperativeHandle","FormField","InputField","Icon","FeedbackBox","AddTableForm","rowCount","setRowCount","columnCount","setColumnCount","rowId","columnId","handleDimentionChange","type","value","_a","useEffect","handleResizeScroll","setScrollableContainers","removeScrollableContainers","PREVENT_OPEN_DELAY","TablePlugin","isActive","editor","useLexicalComposerContext","flyout","showFlyout","hideFlyout","isVisible","useFlyout","addTableForm","buttonRef","preventOpen","isVisibleRef","openFlyout","rect","flyoutOptions","closeFlyout","insertTable","nrOfRows","nrOfColumns","selection","$getSelection","tableNode","createTable","$isRangeSelection","$getRoot","firstDescendant","mutateTable","action","anchorNode","currentNode","$getTableCellNodeFromLexicalNode","$isTableCellNode","insertRow","deleteRow","insertColumn","deleteColumn","deleteTable","rows","columns","_b","removeKeyboardShortcut","KEY_DOWN_COMMAND","COMMAND_PRIORITY_EDITOR","removeKeydown"],"mappings":"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"}
1
+ {"version":3,"file":"TablePlugin-BLzR0g93.js","sources":["../src/components/MultiSelect/components/MultiSelectHeader.tsx","../src/components/MultiSelect/MultiSelect.tsx","../src/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.tsx","../src/components/RteEditor/Plugins/TablePlugin/AddTableFrom.tsx","../src/components/RteEditor/Plugins/TablePlugin/TablePlugin.tsx"],"sourcesContent":["import styles from 'components/MultiSelect/MultiSelect.module.css';\nimport { Label } from 'components/Label';\nimport { Button } from 'components';\n\nexport interface MultiSelectHeaderProps {\n label: string;\n clearTrigger?: string;\n onClear?: () => void;\n}\n\nexport function MultiSelectHeader({ label, clearTrigger, onClear }: MultiSelectHeaderProps) {\n return (\n <header className={styles['multi-select__header']}>\n <Label htmlFor=\"multi-select-list\">{label}</Label>\n {clearTrigger && (\n <Button variant={'blank'} onClick={onClear}>\n {clearTrigger}\n </Button>\n )}\n </header>\n );\n}\n","import clsx from 'clsx';\n\nimport type { PropsWithChildren, ReactNode } from 'react';\n\nimport styles from './MultiSelect.module.css';\n\nimport { MultiSelectItem } from 'components/MultiSelect/components/MultiSelectItem';\nimport { MultiSelectHeader } from 'components/MultiSelect/components/MultiSelectHeader';\n\nexport interface MultiSelectProps {\n /** `true` if the container should scroll on overflow; otherwise, `false` to resize the container to its contents. The default is `true`. */\n scrollable?: boolean;\n /** `true` to disable the border around the container; otherwise, `false`. The default is `false`. */\n noBorder?: boolean;\n /** The header contents. */\n header?: ReactNode;\n}\n\n/** Represents a component to list a number of checkboxes. */\nexport const MultiSelect = ({ scrollable = true, noBorder, header, children }: PropsWithChildren<MultiSelectProps>) => (\n <>\n {header}\n <div\n className={clsx(styles['multi-select'], {\n [styles['multi-select--no-border']]: noBorder,\n })}\n >\n <ul\n className={clsx(styles['multi-select__list'], {\n [styles['multi-select__list--scrollable']]: scrollable,\n })}\n id=\"multi-select-list\"\n >\n {children}\n </ul>\n </div>\n </>\n);\n\nMultiSelect.MultiSelectHeader = MultiSelectHeader;\nMultiSelect.MultiSelectItem = MultiSelectItem;\n","import { useState, forwardRef, useImperativeHandle, useRef, useId } from 'react';\n\nimport type { ChangeEvent } from 'react';\nimport type { LinkType } from 'components/RteEditor/Plugins/LinkPlugin';\n\nimport styles from './AddLinkForm.module.css';\n\nimport { ensureHttps, validateUrlWithProtocol } from 'components/RteEditor/Plugins/LinkPlugin/helpers';\nimport { Button, FeedbackBox, FormField, Icon, InputField, Label } from 'components';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\ninterface AddLinkFormProps {\n onCloseHandler: () => void;\n onSaveHandler: (url: string, linktext: string) => void;\n isLink: LinkType;\n}\n\nexport interface addLinkFormMethods {\n clearForm: () => void;\n focusFirstField: () => void;\n setDefaults: (url: string, linktext: string) => void;\n}\n\nexport const AddLinkForm = forwardRef(\n (\n { onCloseHandler, onSaveHandler, isLink = { active: false, url: '', linktext: '' } }: AddLinkFormProps,\n ref\n ): JSX.Element => {\n const t = useTranslation();\n const [url, setUrl] = useState<string>(isLink.url || '');\n const [linkText, setLinkText] = useState<string>(isLink.linktext || '');\n const [showLinktextField, setShowLinktextField] = useState<boolean>(false);\n const [urlError, setUrlError] = useState<string | null>(null);\n const [linkTextError, setLinkTextError] = useState<string | null>(null);\n const firstField = useRef<HTMLInputElement>(null);\n const linkId = `link_${useId()}`;\n const textId = `text_${useId()}`;\n\n const handleOpenUrl = () => {\n window.open(ensureHttps(url), '_blank');\n };\n\n const handleUrl = (event: ChangeEvent<HTMLInputElement>) => {\n setUrl(event.target.value);\n };\n\n const handleLinkText = (event: ChangeEvent<HTMLInputElement>) => {\n setLinkText(event.target.value);\n };\n\n const validateUrl = (url: string): boolean => {\n if (validateUrlWithProtocol(url) === false || url.trim() === '') {\n setUrlError(t.errortext.urlNotValid);\n return false;\n }\n setUrlError(null);\n return true;\n };\n\n const validateLinkText = (linkText: string): boolean => {\n if (linkText.trim() === '') {\n setLinkTextError(t.errortext.linkTextNotValid);\n return false;\n }\n setLinkTextError(null);\n return true;\n };\n\n const handleSave = () => {\n if (!validateUrl(url) || (showLinktextField && !validateLinkText(linkText))) {\n return;\n }\n\n onSaveHandler(url, linkText);\n resetForm();\n };\n\n const handleClose = () => {\n onCloseHandler();\n resetForm();\n };\n\n const resetForm = () => {\n setUrl('');\n setShowLinktextField(false);\n setUrlError(null);\n setLinkTextError(null);\n };\n\n const setDefaults = (url: string, linktext: string) => {\n setUrl(url);\n if (!linktext && !url) {\n setShowLinktextField(true);\n }\n };\n\n const focusFirstField = () => {\n if (firstField.current) {\n firstField.current.focus();\n }\n };\n\n useImperativeHandle(ref, () => ({\n clearForm: resetForm,\n focusFirstField,\n setDefaults,\n }));\n\n return (\n <div className={styles['linkform']}>\n <FormField className={styles['linkform__input-field']}>\n <Label htmlFor={linkId}>{t.links.linkLabel}</Label>\n <div className={styles['linkform__input-url-wrapper']}>\n <InputField\n id={linkId}\n placeholder={t.links.linkPlaceholder}\n value={url}\n onChange={(event) => handleUrl(event)}\n onFocus={() => setUrlError(null)}\n ref={firstField}\n aria-label={t.aria.labels.linkField}\n />\n {url && (\n <button type=\"button\" onClick={handleOpenUrl} className={styles['linkform__open-url-button']}>\n <Icon name=\"ArrowTopRightOnSquare\" size={20} />\n </button>\n )}\n </div>\n {urlError && <FeedbackBox level=\"error\" feedback={urlError} />}\n </FormField>\n {showLinktextField && (\n <FormField className={styles['linkform__input-field']}>\n <Label htmlFor={textId}>{t.links.linkText}</Label>\n <InputField\n id={textId}\n value={linkText}\n onChange={(event) => handleLinkText(event)}\n onFocus={() => setLinkTextError(null)}\n aria-label={t.aria.labels.linkTextfield}\n />\n {linkTextError && <FeedbackBox level=\"error\" feedback={linkTextError} />}\n </FormField>\n )}\n <div className={styles['linkform__footer']}>\n <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel} type=\"button\">\n {t.common.cancel}\n </Button>\n <Button variant={'primary'} onClick={handleSave} aria-label={t.aria.labels.linkOkButton} type=\"button\">\n {t.links.addLink}\n </Button>\n </div>\n </div>\n );\n }\n);\n","import { useState, forwardRef, useImperativeHandle, useRef, useId, useEffect } from 'react';\n\nimport type { ChangeEvent } from 'react';\n\nimport styles from './AddTableFrom.module.css';\n\nimport { Button, FormField, InputField, Label } from 'components';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\nimport { removeScrollableContainers, setScrollableContainers } from 'components/RteEditor/helpers';\n\ninterface AddTableFormProps {\n onCloseHandler: () => void;\n onSaveHandler: (nrfOfRows: number, nrOfColumns: number) => void;\n}\n\nexport interface addTableForm {\n clearForm: () => void;\n focusFirstField: () => void;\n}\n\nexport const AddTableForm = forwardRef(({ onCloseHandler, onSaveHandler }: AddTableFormProps, ref) => {\n const t = useTranslation();\n const [rowCount, setRowCount] = useState<number>();\n const [columnCount, setColumnCount] = useState<number>();\n const firstField = useRef<HTMLInputElement>(null);\n const rowId = `row_${useId()}`;\n const columnId = `column_${useId()}`;\n\n const handleDimentionChange = (event: ChangeEvent<HTMLInputElement>, type: string) => {\n const value = event.target.value;\n type === 'row' ? setRowCount(parseInt(value)) : setColumnCount(parseInt(value));\n };\n\n const handleSave = () => {\n if (rowCount !== undefined && columnCount !== undefined) {\n onSaveHandler(rowCount, columnCount);\n resetForm();\n }\n };\n\n const handleClose = () => {\n onCloseHandler();\n resetForm();\n };\n\n const resetForm = () => {\n setRowCount(undefined);\n setColumnCount(undefined);\n };\n\n useImperativeHandle(ref, () => ({\n clearForm: resetForm,\n focusFirstField: () => firstField.current?.focus(),\n }));\n\n useEffect(() => {\n const handleResizeScroll = () => {\n handleClose();\n };\n\n setScrollableContainers(handleResizeScroll);\n\n window.addEventListener('scroll', handleResizeScroll);\n window.addEventListener('resize', handleResizeScroll);\n\n return () => {\n window.removeEventListener('scroll', handleResizeScroll);\n window.removeEventListener('resize', handleResizeScroll);\n removeScrollableContainers(handleResizeScroll);\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return (\n <div className={styles['tableform']}>\n <FormField className={styles['tableform__input-field']}>\n <Label htmlFor={rowId}>{t.table.nrofRows}</Label>\n <InputField\n id={rowId}\n placeholder={t.table.nrofRowsPlaceholder}\n value={rowCount ? rowCount : ''}\n onChange={(event) => handleDimentionChange(event, 'row')}\n aria-label={t.aria.labels.tableRowfield}\n ref={firstField}\n />\n </FormField>\n <FormField className={styles['tableform__input-field']}>\n <Label htmlFor={columnId}>{t.table.nrofColumns}</Label>\n <InputField\n id={columnId}\n placeholder={t.table.nrofColumnsPlaceholder}\n value={columnCount ? columnCount : ''}\n onChange={(event) => handleDimentionChange(event, 'column')}\n aria-label={t.aria.labels.tableColumnfield}\n />\n </FormField>\n <div className={styles['tableform__footer']}>\n <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel}>\n {t.common.cancel}\n </Button>\n <Button\n variant={'primary'}\n onClick={handleSave}\n disabled={!rowCount || !columnCount}\n aria-label={t.aria.labels.tableOkButton}\n >\n {t.common.add}\n </Button>\n </div>\n </div>\n );\n});\n","import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport clsx from 'clsx';\nimport { $getTableCellNodeFromLexicalNode, $isTableCellNode } from '@lexical/table';\nimport { $getSelection, $isRangeSelection, $getRoot, KEY_DOWN_COMMAND, COMMAND_PRIORITY_EDITOR } from 'lexical';\nimport { useRef, useEffect, useImperativeHandle, forwardRef } from 'react';\n\nimport type { TextNode } from 'lexical';\nimport type { addTableForm } from './AddTableFrom';\nimport type { Actions } from './TableCellContextMenu';\n\nimport { AddTableForm } from './AddTableFrom';\nimport { createTable, deleteColumn, deleteRow, deleteTable, insertColumn, insertRow } from './helpers';\n\nimport { useFlyout } from 'components/RteEditor/hooks/useFlyout';\nimport { Icon } from 'components';\nimport styles from 'components/RteEditor/RteEditor.module.css';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\nconst PREVENT_OPEN_DELAY = 200;\n\ninterface TablePluginProps {\n isActive: boolean;\n}\n\nexport interface TableMutation {\n mutateTable: (type: Actions) => void;\n}\n\nexport const TablePlugin = forwardRef(({ isActive }: TablePluginProps, ref): JSX.Element => {\n const t = useTranslation();\n const [editor] = useLexicalComposerContext();\n const { flyout, showFlyout, hideFlyout, isVisible } = useFlyout();\n const addTableForm = useRef<addTableForm>();\n const buttonRef = useRef<HTMLButtonElement>(null);\n const preventOpen = useRef(false);\n const isVisibleRef = useRef(isVisible);\n\n const openFlyout = () => {\n const rect = buttonRef.current?.getBoundingClientRect();\n if (!preventOpen.current && rect) {\n showFlyout({ position: { top: rect.bottom, left: rect.left }, ...flyoutOptions });\n }\n };\n\n const closeFlyout = () => {\n hideFlyout();\n };\n\n const insertTable = (nrOfRows: number, nrOfColumns: number) => {\n editor.update(() => {\n const selection = $getSelection();\n const tableNode = createTable(nrOfRows, nrOfColumns);\n if ($isRangeSelection(selection)) {\n selection.insertNodes([tableNode]);\n } else {\n $getRoot().append(tableNode);\n }\n const firstDescendant = tableNode.getFirstDescendant();\n if (firstDescendant) {\n (firstDescendant as TextNode).select();\n }\n });\n\n closeFlyout();\n };\n\n const mutateTable = (action: Actions) => {\n editor.update(() => {\n const selection = $getSelection();\n if ($isRangeSelection(selection)) {\n const anchorNode = selection.anchor.getNode();\n const currentNode = $getTableCellNodeFromLexicalNode(anchorNode);\n\n if ($isTableCellNode(currentNode)) {\n switch (action) {\n case 'insertRowAbove':\n case 'insertRowBelow':\n insertRow(currentNode, action);\n break;\n case 'deleteRow':\n deleteRow(currentNode);\n break;\n case 'insertColumnLeft':\n case 'insertColumnRight':\n insertColumn(currentNode, action);\n break;\n case 'deleteColumn':\n deleteColumn(currentNode);\n break;\n case 'deleteTable':\n deleteTable(currentNode);\n break;\n }\n }\n }\n });\n };\n\n const flyoutOptions = {\n children: (\n <AddTableForm\n onCloseHandler={closeFlyout}\n onSaveHandler={(rows, columns) => insertTable(rows, columns)}\n ref={addTableForm}\n />\n ),\n };\n\n useEffect(() => {\n if (!isVisible) {\n addTableForm.current?.clearForm();\n setTimeout(() => (preventOpen.current = false), PREVENT_OPEN_DELAY);\n } else {\n preventOpen.current = true;\n addTableForm.current?.focusFirstField();\n }\n }, [addTableForm, isVisible]);\n\n useEffect(() => {\n const removeKeyboardShortcut = editor.registerCommand(\n KEY_DOWN_COMMAND,\n (event: KeyboardEvent) => {\n if (event.ctrlKey && event.shiftKey && event.code === 'Digit9') {\n event.preventDefault();\n openFlyout();\n return true;\n }\n return false;\n },\n COMMAND_PRIORITY_EDITOR\n );\n\n return () => {\n removeKeyboardShortcut();\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [editor]);\n\n useEffect(() => {\n isVisibleRef.current = isVisible;\n }, [isVisible]);\n\n useEffect(() => {\n const removeKeydown = (event: KeyboardEvent) => {\n if (event.key === 'Escape' && isVisibleRef.current) {\n event.preventDefault();\n event.stopPropagation();\n closeFlyout();\n }\n };\n\n document.addEventListener('keydown', removeKeydown, { capture: true });\n\n return () => {\n document.removeEventListener('keydown', removeKeydown);\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useImperativeHandle(ref, () => ({\n mutateTable,\n }));\n\n return (\n <div className={styles['editor__toolbar-button-group']}>\n <div className={styles['editor__toolbar-button-flyoutwrapper']}>\n <button\n onClick={openFlyout}\n title={t.table.tableTooltip}\n className={clsx(styles['editor__toolbar-button'], isActive && styles[`editor__toolbar-button--active`])}\n aria-label={t.aria.labels.table}\n aria-keyshortcuts={t.aria.keyshortcuts.table}\n ref={buttonRef}\n type=\"button\"\n >\n <Icon name=\"Table\" size={24} />\n </button>\n {flyout}\n </div>\n </div>\n );\n});\n"],"names":["MultiSelectHeader","label","clearTrigger","onClear","jsxs","styles","jsx","Label","Button","MultiSelect","scrollable","noBorder","header","children","Fragment","clsx","MultiSelectItem","AddLinkForm","forwardRef","onCloseHandler","onSaveHandler","isLink","ref","t","useTranslation","url","setUrl","useState","linkText","setLinkText","showLinktextField","setShowLinktextField","urlError","setUrlError","linkTextError","setLinkTextError","firstField","useRef","linkId","useId","textId","handleOpenUrl","ensureHttps","handleUrl","event","handleLinkText","validateUrl","validateUrlWithProtocol","validateLinkText","handleSave","resetForm","handleClose","setDefaults","linktext","focusFirstField","useImperativeHandle","FormField","InputField","Icon","FeedbackBox","AddTableForm","rowCount","setRowCount","columnCount","setColumnCount","rowId","columnId","handleDimentionChange","type","value","_a","useEffect","handleResizeScroll","setScrollableContainers","removeScrollableContainers","PREVENT_OPEN_DELAY","TablePlugin","isActive","editor","useLexicalComposerContext","flyout","showFlyout","hideFlyout","isVisible","useFlyout","addTableForm","buttonRef","preventOpen","isVisibleRef","openFlyout","rect","flyoutOptions","closeFlyout","insertTable","nrOfRows","nrOfColumns","selection","$getSelection","tableNode","createTable","$isRangeSelection","$getRoot","firstDescendant","mutateTable","action","anchorNode","currentNode","$getTableCellNodeFromLexicalNode","$isTableCellNode","insertRow","deleteRow","insertColumn","deleteColumn","deleteTable","rows","columns","_b","removeKeyboardShortcut","KEY_DOWN_COMMAND","COMMAND_PRIORITY_EDITOR","removeKeydown"],"mappings":"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"}
@@ -0,0 +1 @@
1
+ ._accordion-card_12lqd_1{background-color:var(--color-grey-50);overflow:hidden;position:relative}._accordion-card__title_12lqd_7{align-items:center;cursor:pointer;display:flex;gap:.5rem;justify-content:flex-start;padding:1.5rem 1rem;-webkit-user-select:none;user-select:none}._accordion-card__title_12lqd_7 h3{margin:0}._accordion-card__title_12lqd_7:focus-visible{text-decoration:underline}._accordion-card__title-icon_12lqd_25{transform:rotate(-90deg);transition:transform .3s ease-in}._accordion-card__title-icon--expanded_12lqd_30{transform:rotate(90deg);transition:transform .3s ease-out}._accordion-card__content_12lqd_35{display:none}._accordion-card__content--expanded_12lqd_39{display:block}
@@ -0,0 +1,10 @@
1
+ import { ReactNode } from 'react';
2
+ export interface AccordionCardProps {
3
+ /** Clickable title (always visible). */
4
+ title: ReactNode;
5
+ /** Main content (hidden when expanded is false). */
6
+ content: ReactNode;
7
+ /** Indicator if Accordion should be expanded by default.*/
8
+ expanded?: boolean;
9
+ }
10
+ export declare const AccordionCard: ({ title, content, expanded }: AccordionCardProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,58 @@
1
+ import { jsxs as r, jsx as o } from "react/jsx-runtime";
2
+ import { c as i } from "../../clsx-OuTLNxxd.js";
3
+ import { useState as x, useId as m } from "react";
4
+ import { Icon as f } from "../Icon/Icon.js";
5
+ import '../../assets/AccordionCard.css';const c = {
6
+ "accordion-card": "_accordion-card_12lqd_1",
7
+ "accordion-card__title": "_accordion-card__title_12lqd_7",
8
+ "accordion-card__title-icon": "_accordion-card__title-icon_12lqd_25",
9
+ "accordion-card__title-icon--expanded": "_accordion-card__title-icon--expanded_12lqd_30",
10
+ "accordion-card__content": "_accordion-card__content_12lqd_35",
11
+ "accordion-card__content--expanded": "_accordion-card__content--expanded_12lqd_39"
12
+ }, u = ({ title: t, content: _, expanded: l = !1 }) => {
13
+ const [d, a] = x(l), n = m(), s = (p) => {
14
+ const { code: e } = p;
15
+ (e === "Enter" || e === "Space") && a(!d);
16
+ };
17
+ return /* @__PURE__ */ r("div", { className: c["accordion-card"], children: [
18
+ /* @__PURE__ */ r(
19
+ "div",
20
+ {
21
+ className: c["accordion-card__title"],
22
+ id: n,
23
+ role: "button",
24
+ tabIndex: 0,
25
+ onClick: () => a(!d),
26
+ onKeyUp: s,
27
+ "aria-expanded": d,
28
+ children: [
29
+ /* @__PURE__ */ o(
30
+ f,
31
+ {
32
+ className: i(c["accordion-card__title-icon"], {
33
+ [c["accordion-card__title-icon--expanded"]]: d
34
+ }),
35
+ name: "CheveronLeft",
36
+ size: 16
37
+ }
38
+ ),
39
+ /* @__PURE__ */ o("h3", { children: t })
40
+ ]
41
+ }
42
+ ),
43
+ /* @__PURE__ */ o(
44
+ "div",
45
+ {
46
+ "aria-labelledby": n,
47
+ className: i(c["accordion-card__content"], {
48
+ [c["accordion-card__content--expanded"]]: d
49
+ }),
50
+ children: _
51
+ }
52
+ )
53
+ ] });
54
+ };
55
+ export {
56
+ u as AccordionCard
57
+ };
58
+ //# sourceMappingURL=AccordionCard.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AccordionCard.js","sources":["../../../src/components/AccordionCard/AccordionCard.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { useId, useState } from 'react';\n\nimport type { KeyboardEvent, ReactNode } from 'react';\n\nimport styles from './AccordionCard.module.css';\n\nimport { Icon } from 'components/Icon';\n\nexport interface AccordionCardProps {\n /** Clickable title (always visible). */\n title: ReactNode;\n /** Main content (hidden when expanded is false). */\n content: ReactNode;\n /** Indicator if Accordion should be expanded by default.*/\n expanded?: boolean;\n}\n\nexport const AccordionCard = ({ title, content, expanded = false }: AccordionCardProps) => {\n const [isExpanded, setIsExpanded] = useState(expanded);\n const accordionId = useId();\n\n const onKeyUp = (event: KeyboardEvent<HTMLDivElement>) => {\n const { code } = event;\n\n if (code === 'Enter' || code === 'Space') {\n setIsExpanded(!isExpanded);\n }\n };\n\n return (\n <div className={styles['accordion-card']}>\n <div\n className={styles['accordion-card__title']}\n id={accordionId}\n role=\"button\"\n tabIndex={0}\n onClick={() => setIsExpanded(!isExpanded)}\n onKeyUp={onKeyUp}\n aria-expanded={isExpanded}\n >\n <Icon\n className={clsx(styles['accordion-card__title-icon'], {\n [styles['accordion-card__title-icon--expanded']]: isExpanded,\n })}\n name=\"CheveronLeft\"\n size={16}\n />\n <h3>{title}</h3>\n </div>\n <div\n aria-labelledby={accordionId}\n className={clsx(styles['accordion-card__content'], {\n [styles['accordion-card__content--expanded']]: isExpanded,\n })}\n >\n {content}\n </div>\n </div>\n );\n};\n"],"names":["AccordionCard","title","content","expanded","isExpanded","setIsExpanded","useState","accordionId","useId","onKeyUp","event","code","jsxs","styles","jsx","Icon","clsx"],"mappings":";;;;;;;;;;;GAkBaA,IAAgB,CAAC,EAAE,OAAAC,GAAO,SAAAC,GAAS,UAAAC,IAAW,SAAgC;AACzF,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASH,CAAQ,GAC/CI,IAAcC,KAEdC,IAAU,CAACC,MAAyC;AAClD,UAAA,EAAE,MAAAC,EAAS,IAAAD;AAEb,KAAAC,MAAS,WAAWA,MAAS,YAC/BN,EAAc,CAACD,CAAU;AAAA,EAC3B;AAGF,SACG,gBAAAQ,EAAA,OAAA,EAAI,WAAWC,EAAO,gBAAgB,GACrC,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWC,EAAO,uBAAuB;AAAA,QACzC,IAAIN;AAAA,QACJ,MAAK;AAAA,QACL,UAAU;AAAA,QACV,SAAS,MAAMF,EAAc,CAACD,CAAU;AAAA,QACxC,SAAAK;AAAA,QACA,iBAAeL;AAAA,QAEf,UAAA;AAAA,UAAA,gBAAAU;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,WAAWC,EAAKH,EAAO,4BAA4B,GAAG;AAAA,gBACpD,CAACA,EAAO,sCAAsC,CAAC,GAAGT;AAAA,cAAA,CACnD;AAAA,cACD,MAAK;AAAA,cACL,MAAM;AAAA,YAAA;AAAA,UACR;AAAA,UACA,gBAAAU,EAAC,QAAI,UAAMb,EAAA,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACb;AAAA,IACA,gBAAAa;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,mBAAiBP;AAAA,QACjB,WAAWS,EAAKH,EAAO,yBAAyB,GAAG;AAAA,UACjD,CAACA,EAAO,mCAAmC,CAAC,GAAGT;AAAA,QAAA,CAChD;AAAA,QAEA,UAAAF;AAAA,MAAA;AAAA,IACH;AAAA,EACF,EAAA,CAAA;AAEJ;"}
@@ -0,0 +1,5 @@
1
+ import { Meta } from '@storybook/react';
2
+ import { AccordionCardProps } from './AccordionCard';
3
+ declare const _default: Meta<AccordionCardProps>;
4
+ export default _default;
5
+ export declare const AccordionCardExample: import('@storybook/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, AccordionCardProps>;
@@ -0,0 +1,33 @@
1
+ import { jsxs as i, jsx as e } from "react/jsx-runtime";
2
+ import { AccordionCard as n } from "./AccordionCard.js";
3
+ import { Container as t } from "../../storyComponents/Container/Container.js";
4
+ const r = "<AccordionCard title={title} content={content}/>", m = {
5
+ title: "Atoms/AccordionCard",
6
+ component: n,
7
+ argTypes: {
8
+ expanded: {
9
+ // Hide the expanded prop. Changing the value in Storybook doesn't update the state of the component.
10
+ table: {
11
+ disable: !0
12
+ }
13
+ }
14
+ },
15
+ parameters: {
16
+ inspectComponent: n,
17
+ codeString: r
18
+ }
19
+ }, o = (a) => /* @__PURE__ */ e(t, { size: "large", children: /* @__PURE__ */ e(n, { ...a }) }), s = o.bind({});
20
+ s.args = {
21
+ title: "Vakaanbieding 1",
22
+ content: /* @__PURE__ */ i("div", { style: { margin: "0 2.125rem 2rem 3.125rem" }, children: [
23
+ /* @__PURE__ */ e("h3", { children: "Vakaanmelding: Het Belang van een Goede Start van Je Studiejaar" }),
24
+ /* @__PURE__ */ e("p", { children: "Vakaanmelding is een cruciale stap in het studieproces, waarbij studenten zich inschrijven voor de vakken die zij tijdens een semester of studiejaar willen volgen. Deze procedure is belangrijk om een gestructureerd en succesvol academisch traject te waarborgen. Hieronder bespreken we wat vakaanmelding inhoudt, waarom het essentieel is en hoe je je optimaal kunt voorbereiden." }),
25
+ /* @__PURE__ */ e("h3", { children: "Wat is vakaanmelding?" }),
26
+ /* @__PURE__ */ e("p", { children: "Vakaanmelding is het proces waarbij studenten via een digitaal systeem (zoals Blackboard, Canvas of een specifieke universiteitsportal) aangeven welke vakken zij willen volgen. Dit kan variëren van verplichte kernvakken tot keuzevakken die aansluiten bij persoonlijke interesses of specialisaties." })
27
+ ] })
28
+ };
29
+ export {
30
+ s as AccordionCardExample,
31
+ m as default
32
+ };
33
+ //# sourceMappingURL=AccordionCard.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AccordionCard.stories.js","sources":["../../../src/components/AccordionCard/AccordionCard.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { AccordionCardProps } from './AccordionCard';\n\nimport { AccordionCard } from './AccordionCard';\n\nimport { Container } from 'storyComponents/Container';\n\nconst codeString = '<AccordionCard title={title} content={content}/>';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/AccordionCard',\n component: AccordionCard,\n argTypes: {\n expanded: {\n // Hide the expanded prop. Changing the value in Storybook doesn't update the state of the component.\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: AccordionCard,\n codeString: codeString,\n },\n} as Meta<AccordionCardProps>;\n\nconst Template: StoryFn<AccordionCardProps> = (args) => (\n <Container size=\"large\">\n <AccordionCard {...args} />\n </Container>\n);\n\nexport const AccordionCardExample = Template.bind({});\nAccordionCardExample.args = {\n title: 'Vakaanbieding 1',\n content: (\n <div style={{ margin: '0 2.125rem 2rem 3.125rem' }}>\n <h3>Vakaanmelding: Het Belang van een Goede Start van Je Studiejaar</h3>\n <p>\n Vakaanmelding is een cruciale stap in het studieproces, waarbij studenten zich inschrijven voor de vakken die\n zij tijdens een semester of studiejaar willen volgen. Deze procedure is belangrijk om een gestructureerd en\n succesvol academisch traject te waarborgen. Hieronder bespreken we wat vakaanmelding inhoudt, waarom het\n essentieel is en hoe je je optimaal kunt voorbereiden.\n </p>\n <h3>Wat is vakaanmelding?</h3>\n <p>\n Vakaanmelding is het proces waarbij studenten via een digitaal systeem (zoals Blackboard, Canvas of een\n specifieke universiteitsportal) aangeven welke vakken zij willen volgen. Dit kan variëren van verplichte\n kernvakken tot keuzevakken die aansluiten bij persoonlijke interesses of specialisaties.\n </p>\n </div>\n ),\n};\n"],"names":["codeString","AccordionCard_stories","AccordionCard","Template","args","jsx","Container","AccordionCardExample","jsxs"],"mappings":";;;AAOA,MAAMA,IAAa,oDAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,UAAU;AAAA;AAAA,MAER,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EACF;AACF,GAEMG,IAAwC,CAACC,MAC5C,gBAAAC,EAAAC,GAAA,EAAU,MAAK,SACd,UAAC,gBAAAD,EAAAH,GAAA,EAAe,GAAGE,EAAM,CAAA,EAC3B,CAAA,GAGWG,IAAuBJ,EAAS,KAAK,EAAE;AACpDI,EAAqB,OAAO;AAAA,EAC1B,OAAO;AAAA,EACP,SACG,gBAAAC,EAAA,OAAA,EAAI,OAAO,EAAE,QAAQ,2BACpB,GAAA,UAAA;AAAA,IAAA,gBAAAH,EAAC,QAAG,UAA+D,kEAAA,CAAA;AAAA,IACnE,gBAAAA,EAAC,OAAE,UAKH,4XAAA,CAAA;AAAA,IACA,gBAAAA,EAAC,QAAG,UAAqB,wBAAA,CAAA;AAAA,IACzB,gBAAAA,EAAC,OAAE,UAIH,4SAAA,CAAA;AAAA,EAAA,GACF;AAEJ;"}
@@ -0,0 +1 @@
1
+ export * from './AccordionCard';
@@ -0,0 +1,5 @@
1
+ import { AccordionCard as c } from "./AccordionCard.js";
2
+ export {
3
+ c as AccordionCard
4
+ };
5
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}