@uva-glass/component-library 1.53.0 → 1.54.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 (62) hide show
  1. package/dist/{MultiSelect-D1FnMER4.js → MultiSelect-DQaqItEH.js} +13 -11
  2. package/dist/{MultiSelect-D1FnMER4.js.map → MultiSelect-DQaqItEH.js.map} +1 -1
  3. package/dist/Sortable.module-BrgGu8qp.js +24 -0
  4. package/dist/Sortable.module-BrgGu8qp.js.map +1 -0
  5. package/dist/SortableProvider-Z0e0qeQT.js +152 -0
  6. package/dist/SortableProvider-Z0e0qeQT.js.map +1 -0
  7. package/dist/assets/Sortable.css +1 -0
  8. package/dist/components/CheckboxTree/CheckboxTree.js +11 -9
  9. package/dist/components/CheckboxTree/CheckboxTree.js.map +1 -1
  10. package/dist/components/InputField/InputField.stories.js +13 -11
  11. package/dist/components/InputField/InputField.stories.js.map +1 -1
  12. package/dist/components/MultiSelect/MultiSelect.js +1 -1
  13. package/dist/components/MultiSelect/MultiSelect.stories.js +1 -1
  14. package/dist/components/MultiSelect/components/MultiSelectHeader.js +4 -2
  15. package/dist/components/MultiSelect/components/MultiSelectHeader.js.map +1 -1
  16. package/dist/components/MultiSelect/index.js +1 -1
  17. package/dist/components/ProgrammeCard/ProgrammeCard.stories.js +26 -24
  18. package/dist/components/ProgrammeCard/ProgrammeCard.stories.js.map +1 -1
  19. package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js +16 -14
  20. package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js.map +1 -1
  21. package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js +20 -18
  22. package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js.map +1 -1
  23. package/dist/components/RteEditor/RteEditor.js +5 -3
  24. package/dist/components/RteEditor/RteEditor.js.map +1 -1
  25. package/dist/components/RteEditor/hooks/useFlyout.js +9 -7
  26. package/dist/components/RteEditor/hooks/useFlyout.js.map +1 -1
  27. package/dist/components/Sortable/Sortable.d.ts +16 -0
  28. package/dist/components/Sortable/Sortable.js +27 -0
  29. package/dist/components/Sortable/Sortable.js.map +1 -0
  30. package/dist/components/Sortable/Sortable.stories.d.ts +7 -0
  31. package/dist/components/Sortable/Sortable.stories.js +53 -0
  32. package/dist/components/Sortable/Sortable.stories.js.map +1 -0
  33. package/dist/components/Sortable/SortableProvider.d.ts +23 -0
  34. package/dist/components/Sortable/SortableProvider.js +10 -0
  35. package/dist/components/Sortable/SortableProvider.js.map +1 -0
  36. package/dist/components/Sortable/actions.d.ts +49 -0
  37. package/dist/components/Sortable/actions.js +33 -0
  38. package/dist/components/Sortable/actions.js.map +1 -0
  39. package/dist/components/Sortable/components/SortableContainer.d.ts +7 -0
  40. package/dist/components/Sortable/components/SortableContainer.js +9 -0
  41. package/dist/components/Sortable/components/SortableContainer.js.map +1 -0
  42. package/dist/components/Sortable/components/SortableHandle.d.ts +4 -0
  43. package/dist/components/Sortable/components/SortableHandle.js +11 -0
  44. package/dist/components/Sortable/components/SortableHandle.js.map +1 -0
  45. package/dist/components/Sortable/components/SortableItem.d.ts +9 -0
  46. package/dist/components/Sortable/components/SortableItem.js +113 -0
  47. package/dist/components/Sortable/components/SortableItem.js.map +1 -0
  48. package/dist/components/Sortable/constants.d.ts +10 -0
  49. package/dist/components/Sortable/constants.js +14 -0
  50. package/dist/components/Sortable/constants.js.map +1 -0
  51. package/dist/components/Sortable/index.d.ts +1 -0
  52. package/dist/components/Sortable/index.js +5 -0
  53. package/dist/components/Sortable/index.js.map +1 -0
  54. package/dist/components/Sortable/sortableReducer.d.ts +24 -0
  55. package/dist/components/Sortable/sortableReducer.js +92 -0
  56. package/dist/components/Sortable/sortableReducer.js.map +1 -0
  57. package/dist/components/index.d.ts +1 -0
  58. package/dist/components/index.js +14 -12
  59. package/dist/components/index.js.map +1 -1
  60. package/dist/index.js +14 -12
  61. package/dist/index.js.map +1 -1
  62. package/package.json +1 -1
@@ -1,4 +1,4 @@
1
- import { jsxs as r, jsx as e } from "react/jsx-runtime";
1
+ import { jsxs as e, jsx as r } from "react/jsx-runtime";
2
2
  import { fn as a } from "../../index-MQ0yPLdl.js";
3
3
  import { ProgrammeCard as o } from "./ProgrammeCard.js";
4
4
  import { Container as n } from "../../storyComponents/Container/Container.js";
@@ -16,49 +16,51 @@ import "../IconButton/IconButton.js";
16
16
  import "../Input/Input.js";
17
17
  import "../InputField/InputField.js";
18
18
  import "react-router-dom";
19
- import "../../MultiSelect-D1FnMER4.js";
19
+ import "../../MultiSelect-DQaqItEH.js";
20
20
  import { Repeater as i } from "../Repeater/Repeater.js";
21
21
  import "../SelectListbox/SelectListbox.js";
22
22
  import "../SelectListbox/SelectProvider.js";
23
- const l = "<ProgrammeCard key={key} header={header} details={details} onClick={onClickFunction} />", R = {
23
+ import "../Sortable/components/SortableItem.js";
24
+ import "../../SortableProvider-Z0e0qeQT.js";
25
+ const l = "<ProgrammeCard key={key} header={header} details={details} onClick={onClickFunction} />", _ = {
24
26
  title: "Atoms/ProgrammeCard",
25
27
  component: o,
26
28
  parameters: {
27
29
  inspectComponent: o,
28
30
  codeString: l
29
31
  }
30
- }, s = (t) => /* @__PURE__ */ e(n, { size: "large", children: /* @__PURE__ */ e(o, { ...t }) }), d = s.bind({});
31
- d.args = {
32
+ }, s = (t) => /* @__PURE__ */ r(n, { size: "large", children: /* @__PURE__ */ r(o, { ...t }) }), p = s.bind({});
33
+ p.args = {
32
34
  header: "This is my header",
33
35
  details: "This is my details",
34
36
  onClick: a()
35
37
  };
36
- const p = s.bind({});
37
- p.args = {
38
- header: /* @__PURE__ */ r(i, { flexDirection: "row", gap: "150", children: [
39
- /* @__PURE__ */ e(m, { name: "Envelope", size: 32 }),
40
- /* @__PURE__ */ e("h2", { style: { margin: 0 }, children: "This is my header" })
38
+ const d = s.bind({});
39
+ d.args = {
40
+ header: /* @__PURE__ */ e(i, { flexDirection: "row", gap: "150", children: [
41
+ /* @__PURE__ */ r(m, { name: "Envelope", size: 32 }),
42
+ /* @__PURE__ */ r("h2", { style: { margin: 0 }, children: "This is my header" })
41
43
  ] }),
42
- details: /* @__PURE__ */ r(i, { flexDirection: "row", gap: "150", children: [
43
- /* @__PURE__ */ r(i, { flexDirection: "row", children: [
44
- /* @__PURE__ */ e(m, { name: "FaceFrown" }),
44
+ details: /* @__PURE__ */ e(i, { flexDirection: "row", gap: "150", children: [
45
+ /* @__PURE__ */ e(i, { flexDirection: "row", children: [
46
+ /* @__PURE__ */ r(m, { name: "FaceFrown" }),
45
47
  "Details 1"
46
48
  ] }),
47
- /* @__PURE__ */ r(i, { flexDirection: "row", children: [
48
- /* @__PURE__ */ e(m, { name: "Heart" }),
49
+ /* @__PURE__ */ e(i, { flexDirection: "row", children: [
50
+ /* @__PURE__ */ r(m, { name: "Heart" }),
49
51
  "Details 2"
50
52
  ] }),
51
- /* @__PURE__ */ r(i, { flexDirection: "row", children: [
52
- /* @__PURE__ */ e(m, { name: "Sparkles" }),
53
+ /* @__PURE__ */ e(i, { flexDirection: "row", children: [
54
+ /* @__PURE__ */ r(m, { name: "Sparkles" }),
53
55
  "Details 3"
54
56
  ] })
55
57
  ] }),
56
58
  onClick: a()
57
59
  };
58
- const c = (t) => /* @__PURE__ */ e(n, { size: "large", children: /* @__PURE__ */ r(i, { children: [
59
- /* @__PURE__ */ e(o, { ...t }),
60
- /* @__PURE__ */ e(o, { ...t }),
61
- /* @__PURE__ */ e(o, { ...t })
60
+ const c = (t) => /* @__PURE__ */ r(n, { size: "large", children: /* @__PURE__ */ e(i, { children: [
61
+ /* @__PURE__ */ r(o, { ...t }),
62
+ /* @__PURE__ */ r(o, { ...t }),
63
+ /* @__PURE__ */ r(o, { ...t })
62
64
  ] }) }), h = c.bind({});
63
65
  h.args = {
64
66
  header: "This is my header",
@@ -67,8 +69,8 @@ h.args = {
67
69
  };
68
70
  export {
69
71
  h as MultiProgrammeCards,
70
- d as ProgrammeCardExample,
71
- p as WithComplexContent,
72
- R as default
72
+ p as ProgrammeCardExample,
73
+ d as WithComplexContent,
74
+ _ as default
73
75
  };
74
76
  //# sourceMappingURL=ProgrammeCard.stories.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ProgrammeCard.stories.js","sources":["../../../src/components/ProgrammeCard/ProgrammeCard.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { ProgrammeCardProps } from './ProgrammeCard';\n\nimport { ProgrammeCard } from './ProgrammeCard';\n\nimport { Container } from 'storyComponents/Container';\nimport { Icon, Repeater } from 'components';\n\nconst codeString = '<ProgrammeCard key={key} header={header} details={details} onClick={onClickFunction} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/ProgrammeCard',\n component: ProgrammeCard,\n parameters: {\n inspectComponent: ProgrammeCard,\n codeString: codeString,\n },\n} as Meta<ProgrammeCardProps>;\n\nconst Template: StoryFn<ProgrammeCardProps> = (args) => (\n <Container size=\"large\">\n <ProgrammeCard {...args} />\n </Container>\n);\n\nexport const ProgrammeCardExample = Template.bind({});\nProgrammeCardExample.args = {\n header: 'This is my header',\n details: 'This is my details',\n onClick: fn(),\n};\n\nexport const WithComplexContent = Template.bind({});\nWithComplexContent.args = {\n header: (\n <Repeater flexDirection=\"row\" gap=\"150\">\n <Icon name=\"Envelope\" size={32} />\n <h2 style={{ margin: 0 }}>This is my header</h2>\n </Repeater>\n ),\n details: (\n <Repeater flexDirection=\"row\" gap=\"150\">\n <Repeater flexDirection=\"row\">\n <Icon name=\"FaceFrown\" />\n Details 1\n </Repeater>\n <Repeater flexDirection=\"row\">\n <Icon name=\"Heart\" />\n Details 2\n </Repeater>\n <Repeater flexDirection=\"row\">\n <Icon name=\"Sparkles\" />\n Details 3\n </Repeater>\n </Repeater>\n ),\n onClick: fn(),\n};\n\nconst MultiProgrammeCardsTemplate: StoryFn<ProgrammeCardProps> = (args) => (\n <Container size=\"large\">\n <Repeater>\n <ProgrammeCard {...args} />\n <ProgrammeCard {...args} />\n <ProgrammeCard {...args} />\n </Repeater>\n </Container>\n);\n\nexport const MultiProgrammeCards = MultiProgrammeCardsTemplate.bind({});\nMultiProgrammeCards.args = {\n header: 'This is my header',\n details: 'This is my details',\n onClick: fn(),\n};\n"],"names":["codeString","ProgrammeCard_stories","ProgrammeCard","Template","args","jsx","Container","ProgrammeCardExample","fn","WithComplexContent","jsxs","Repeater","Icon","MultiProgrammeCardsTemplate","MultiProgrammeCards"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAUA,MAAMA,IAAa,2FAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,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,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAASC,EAAG;AACd;AAEO,MAAMC,IAAqBN,EAAS,KAAK,EAAE;AAClDM,EAAmB,OAAO;AAAA,EACxB,QACG,gBAAAC,EAAAC,GAAA,EAAS,eAAc,OAAM,KAAI,OAChC,UAAA;AAAA,IAAA,gBAAAN,EAACO,GAAK,EAAA,MAAK,YAAW,MAAM,IAAI;AAAA,sBAC/B,MAAG,EAAA,OAAO,EAAE,QAAQ,KAAK,UAAiB,qBAAA;AAAA,EAAA,GAC7C;AAAA,EAEF,SACG,gBAAAF,EAAAC,GAAA,EAAS,eAAc,OAAM,KAAI,OAChC,UAAA;AAAA,IAAC,gBAAAD,EAAAC,GAAA,EAAS,eAAc,OACtB,UAAA;AAAA,MAAC,gBAAAN,EAAAO,GAAA,EAAK,MAAK,YAAY,CAAA;AAAA,MAAE;AAAA,IAAA,GAE3B;AAAA,IACA,gBAAAF,EAACC,GAAS,EAAA,eAAc,OACtB,UAAA;AAAA,MAAC,gBAAAN,EAAAO,GAAA,EAAK,MAAK,QAAQ,CAAA;AAAA,MAAE;AAAA,IAAA,GAEvB;AAAA,IACA,gBAAAF,EAACC,GAAS,EAAA,eAAc,OACtB,UAAA;AAAA,MAAC,gBAAAN,EAAAO,GAAA,EAAK,MAAK,WAAW,CAAA;AAAA,MAAE;AAAA,IAAA,GAE1B;AAAA,EAAA,GACF;AAAA,EAEF,SAASJ,EAAG;AACd;AAEA,MAAMK,IAA2D,CAACT,MAChE,gBAAAC,EAACC,KAAU,MAAK,SACd,4BAACK,GACC,EAAA,UAAA;AAAA,EAAC,gBAAAN,EAAAH,GAAA,EAAe,GAAGE,GAAM;AAAA,EACzB,gBAAAC,EAACH,GAAe,EAAA,GAAGE,GAAM;AAAA,EACzB,gBAAAC,EAACH,GAAe,EAAA,GAAGE,GAAM;AAAA,EAC3B,CAAA,EACF,CAAA,GAGWU,IAAsBD,EAA4B,KAAK,EAAE;AACtEC,EAAoB,OAAO;AAAA,EACzB,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAASN,EAAG;AACd;"}
1
+ {"version":3,"file":"ProgrammeCard.stories.js","sources":["../../../src/components/ProgrammeCard/ProgrammeCard.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { ProgrammeCardProps } from './ProgrammeCard';\n\nimport { ProgrammeCard } from './ProgrammeCard';\n\nimport { Container } from 'storyComponents/Container';\nimport { Icon, Repeater } from 'components';\n\nconst codeString = '<ProgrammeCard key={key} header={header} details={details} onClick={onClickFunction} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/ProgrammeCard',\n component: ProgrammeCard,\n parameters: {\n inspectComponent: ProgrammeCard,\n codeString: codeString,\n },\n} as Meta<ProgrammeCardProps>;\n\nconst Template: StoryFn<ProgrammeCardProps> = (args) => (\n <Container size=\"large\">\n <ProgrammeCard {...args} />\n </Container>\n);\n\nexport const ProgrammeCardExample = Template.bind({});\nProgrammeCardExample.args = {\n header: 'This is my header',\n details: 'This is my details',\n onClick: fn(),\n};\n\nexport const WithComplexContent = Template.bind({});\nWithComplexContent.args = {\n header: (\n <Repeater flexDirection=\"row\" gap=\"150\">\n <Icon name=\"Envelope\" size={32} />\n <h2 style={{ margin: 0 }}>This is my header</h2>\n </Repeater>\n ),\n details: (\n <Repeater flexDirection=\"row\" gap=\"150\">\n <Repeater flexDirection=\"row\">\n <Icon name=\"FaceFrown\" />\n Details 1\n </Repeater>\n <Repeater flexDirection=\"row\">\n <Icon name=\"Heart\" />\n Details 2\n </Repeater>\n <Repeater flexDirection=\"row\">\n <Icon name=\"Sparkles\" />\n Details 3\n </Repeater>\n </Repeater>\n ),\n onClick: fn(),\n};\n\nconst MultiProgrammeCardsTemplate: StoryFn<ProgrammeCardProps> = (args) => (\n <Container size=\"large\">\n <Repeater>\n <ProgrammeCard {...args} />\n <ProgrammeCard {...args} />\n <ProgrammeCard {...args} />\n </Repeater>\n </Container>\n);\n\nexport const MultiProgrammeCards = MultiProgrammeCardsTemplate.bind({});\nMultiProgrammeCards.args = {\n header: 'This is my header',\n details: 'This is my details',\n onClick: fn(),\n};\n"],"names":["codeString","ProgrammeCard_stories","ProgrammeCard","Template","args","jsx","Container","ProgrammeCardExample","fn","WithComplexContent","jsxs","Repeater","Icon","MultiProgrammeCardsTemplate","MultiProgrammeCards"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAMA,IAAa,2FAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,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,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAASC,EAAG;AACd;AAEO,MAAMC,IAAqBN,EAAS,KAAK,EAAE;AAClDM,EAAmB,OAAO;AAAA,EACxB,QACG,gBAAAC,EAAAC,GAAA,EAAS,eAAc,OAAM,KAAI,OAChC,UAAA;AAAA,IAAA,gBAAAN,EAACO,GAAK,EAAA,MAAK,YAAW,MAAM,IAAI;AAAA,sBAC/B,MAAG,EAAA,OAAO,EAAE,QAAQ,KAAK,UAAiB,qBAAA;AAAA,EAAA,GAC7C;AAAA,EAEF,SACG,gBAAAF,EAAAC,GAAA,EAAS,eAAc,OAAM,KAAI,OAChC,UAAA;AAAA,IAAC,gBAAAD,EAAAC,GAAA,EAAS,eAAc,OACtB,UAAA;AAAA,MAAC,gBAAAN,EAAAO,GAAA,EAAK,MAAK,YAAY,CAAA;AAAA,MAAE;AAAA,IAAA,GAE3B;AAAA,IACA,gBAAAF,EAACC,GAAS,EAAA,eAAc,OACtB,UAAA;AAAA,MAAC,gBAAAN,EAAAO,GAAA,EAAK,MAAK,QAAQ,CAAA;AAAA,MAAE;AAAA,IAAA,GAEvB;AAAA,IACA,gBAAAF,EAACC,GAAS,EAAA,eAAc,OACtB,UAAA;AAAA,MAAC,gBAAAN,EAAAO,GAAA,EAAK,MAAK,WAAW,CAAA;AAAA,MAAE;AAAA,IAAA,GAE1B;AAAA,EAAA,GACF;AAAA,EAEF,SAASJ,EAAG;AACd;AAEA,MAAMK,IAA2D,CAACT,MAChE,gBAAAC,EAACC,KAAU,MAAK,SACd,4BAACK,GACC,EAAA,UAAA;AAAA,EAAC,gBAAAN,EAAAH,GAAA,EAAe,GAAGE,GAAM;AAAA,EACzB,gBAAAC,EAACH,GAAe,EAAA,GAAGE,GAAM;AAAA,EACzB,gBAAAC,EAACH,GAAe,EAAA,GAAGE,GAAM;AAAA,EAC3B,CAAA,EACF,CAAA,GAGWU,IAAsBD,EAA4B,KAAK,EAAE;AACtEC,EAAoB,OAAO;AAAA,EACzB,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAASN,EAAG;AACd;"}
@@ -1,8 +1,8 @@
1
1
  import { jsxs as b, jsx as r } from "react/jsx-runtime";
2
- import { c as i } from "../../../../clsx-OuTLNxxd.js";
2
+ import { c as e } from "../../../../clsx-OuTLNxxd.js";
3
3
  import { u as f, $ as _, K as h, h as C, g as U } from "../../../../Lexical.prod-DNRTKPfN.js";
4
- import { useState as n, useEffect as a } from "react";
5
- import { Icon as m } from "../../../Icon/Icon.js";
4
+ import { useState as n, useEffect as m } from "react";
5
+ import { Icon as a } from "../../../Icon/Icon.js";
6
6
  import "../../../Buttons/Button.js";
7
7
  import "../../../Buttons/LinkButton.js";
8
8
  import "@react-aria/button";
@@ -15,48 +15,50 @@ import "../../../IconButton/IconButton.js";
15
15
  import "../../../Input/Input.js";
16
16
  import "../../../InputField/InputField.js";
17
17
  import "react-router-dom";
18
- import "../../../../MultiSelect-D1FnMER4.js";
18
+ import "../../../../MultiSelect-DQaqItEH.js";
19
19
  import { s as t } from "../../../../RteEditor.module-BjGyWKhW.js";
20
20
  import "../../../SelectListbox/SelectListbox.js";
21
21
  import "../../../SelectListbox/SelectProvider.js";
22
- const F = () => {
22
+ import "../../../Sortable/components/SortableItem.js";
23
+ import "../../../../SortableProvider-Z0e0qeQT.js";
24
+ const J = () => {
23
25
  const [o] = f(), [s, d] = n(!1), [l, p] = n(!1), c = () => {
24
26
  o.dispatchCommand(C, void 0);
25
27
  }, u = () => {
26
28
  o.dispatchCommand(U, void 0);
27
29
  };
28
- return a(() => o.registerCommand(
30
+ return m(() => o.registerCommand(
29
31
  _,
30
- (e) => (d(e), !1),
32
+ (i) => (d(i), !1),
31
33
  1
32
- ), [o]), a(() => o.registerCommand(
34
+ ), [o]), m(() => o.registerCommand(
33
35
  h,
34
- (e) => (p(e), !1),
36
+ (i) => (p(i), !1),
35
37
  1
36
38
  ), [o]), /* @__PURE__ */ b("div", { className: t["editor__toolbar-button-group"], children: [
37
39
  /* @__PURE__ */ r(
38
40
  "button",
39
41
  {
40
42
  onClick: c,
41
- className: i(t["editor__toolbar-button"], t["editor__toolbar-button--undo"]),
43
+ className: e(t["editor__toolbar-button"], t["editor__toolbar-button--undo"]),
42
44
  "aria-label": "Undo",
43
45
  disabled: !s,
44
- children: /* @__PURE__ */ r(m, { name: "Undo", size: 20 })
46
+ children: /* @__PURE__ */ r(a, { name: "Undo", size: 20 })
45
47
  }
46
48
  ),
47
49
  /* @__PURE__ */ r(
48
50
  "button",
49
51
  {
50
52
  onClick: u,
51
- className: i(t["editor__toolbar-button"], t["editor__toolbar-button--redo"]),
53
+ className: e(t["editor__toolbar-button"], t["editor__toolbar-button--redo"]),
52
54
  "aria-label": "Undo",
53
55
  disabled: !l,
54
- children: /* @__PURE__ */ r(m, { name: "Redo", size: 20 })
56
+ children: /* @__PURE__ */ r(a, { name: "Redo", size: 20 })
55
57
  }
56
58
  )
57
59
  ] });
58
60
  };
59
61
  export {
60
- F as HistoryPlugin
62
+ J as HistoryPlugin
61
63
  };
62
64
  //# sourceMappingURL=HistoryPlugin.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"HistoryPlugin.js","sources":["../../../../../src/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport { CAN_UNDO_COMMAND, CAN_REDO_COMMAND, UNDO_COMMAND, REDO_COMMAND } from 'lexical';\nimport { useEffect, useState } from 'react';\n\nimport { Icon } from 'components';\nimport styles from 'components/RteEditor/RteEditor.module.css';\n\nexport const HistoryPlugin = () => {\n const [editor] = useLexicalComposerContext();\n const [canUndo, setCanUndo] = useState(false);\n const [canRedo, setCanRedo] = useState(false);\n\n const handleUndo = () => {\n editor.dispatchCommand(UNDO_COMMAND, undefined);\n };\n\n const handleRedo = () => {\n editor.dispatchCommand(REDO_COMMAND, undefined);\n };\n\n useEffect(() => {\n return editor.registerCommand<boolean>(\n CAN_UNDO_COMMAND,\n (payload) => {\n setCanUndo(payload);\n return false;\n },\n 1\n );\n }, [editor]);\n\n useEffect(() => {\n return editor.registerCommand<boolean>(\n CAN_REDO_COMMAND,\n (payload) => {\n setCanRedo(payload);\n return false;\n },\n 1\n );\n }, [editor]);\n\n return (\n <div className={styles['editor__toolbar-button-group']}>\n <button\n onClick={handleUndo}\n className={clsx(styles['editor__toolbar-button'], styles[`editor__toolbar-button--undo`])}\n aria-label={`Undo`}\n disabled={!canUndo}\n >\n <Icon name=\"Undo\" size={20} />\n </button>\n <button\n onClick={handleRedo}\n className={clsx(styles['editor__toolbar-button'], styles[`editor__toolbar-button--redo`])}\n aria-label={`Undo`}\n disabled={!canRedo}\n >\n <Icon name=\"Redo\" size={20} />\n </button>\n </div>\n );\n};\n"],"names":["HistoryPlugin","editor","useLexicalComposerContext","canUndo","setCanUndo","useState","canRedo","setCanRedo","handleUndo","UNDO_COMMAND","handleRedo","REDO_COMMAND","useEffect","CAN_UNDO_COMMAND","payload","CAN_REDO_COMMAND","jsxs","styles","jsx","clsx","Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAQO,MAAMA,IAAgB,MAAM;AAC3B,QAAA,CAACC,CAAM,IAAIC,KACX,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtC,CAACC,GAASC,CAAU,IAAIF,EAAS,EAAK,GAEtCG,IAAa,MAAM;AAChB,IAAAP,EAAA,gBAAgBQ,GAAc,MAAS;AAAA,EAAA,GAG1CC,IAAa,MAAM;AAChB,IAAAT,EAAA,gBAAgBU,GAAc,MAAS;AAAA,EAAA;AAGhD,SAAAC,EAAU,MACDX,EAAO;AAAA,IACZY;AAAAA,IACA,CAACC,OACCV,EAAWU,CAAO,GACX;AAAA,IAET;AAAA,EAAA,GAED,CAACb,CAAM,CAAC,GAEXW,EAAU,MACDX,EAAO;AAAA,IACZc;AAAAA,IACA,CAACD,OACCP,EAAWO,CAAO,GACX;AAAA,IAET;AAAA,EAAA,GAED,CAACb,CAAM,CAAC,GAGR,gBAAAe,EAAA,OAAA,EAAI,WAAWC,EAAO,8BAA8B,GACnD,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASV;AAAA,QACT,WAAWW,EAAKF,EAAO,wBAAwB,GAAGA,EAAO,8BAA8B,CAAC;AAAA,QACxF,cAAY;AAAA,QACZ,UAAU,CAACd;AAAA,QAEX,UAAC,gBAAAe,EAAAE,GAAA,EAAK,MAAK,QAAO,MAAM,IAAI;AAAA,MAAA;AAAA,IAC9B;AAAA,IACA,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASR;AAAA,QACT,WAAWS,EAAKF,EAAO,wBAAwB,GAAGA,EAAO,8BAA8B,CAAC;AAAA,QACxF,cAAY;AAAA,QACZ,UAAU,CAACX;AAAA,QAEX,UAAC,gBAAAY,EAAAE,GAAA,EAAK,MAAK,QAAO,MAAM,IAAI;AAAA,MAAA;AAAA,IAC9B;AAAA,EACF,EAAA,CAAA;AAEJ;"}
1
+ {"version":3,"file":"HistoryPlugin.js","sources":["../../../../../src/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport { CAN_UNDO_COMMAND, CAN_REDO_COMMAND, UNDO_COMMAND, REDO_COMMAND } from 'lexical';\nimport { useEffect, useState } from 'react';\n\nimport { Icon } from 'components';\nimport styles from 'components/RteEditor/RteEditor.module.css';\n\nexport const HistoryPlugin = () => {\n const [editor] = useLexicalComposerContext();\n const [canUndo, setCanUndo] = useState(false);\n const [canRedo, setCanRedo] = useState(false);\n\n const handleUndo = () => {\n editor.dispatchCommand(UNDO_COMMAND, undefined);\n };\n\n const handleRedo = () => {\n editor.dispatchCommand(REDO_COMMAND, undefined);\n };\n\n useEffect(() => {\n return editor.registerCommand<boolean>(\n CAN_UNDO_COMMAND,\n (payload) => {\n setCanUndo(payload);\n return false;\n },\n 1\n );\n }, [editor]);\n\n useEffect(() => {\n return editor.registerCommand<boolean>(\n CAN_REDO_COMMAND,\n (payload) => {\n setCanRedo(payload);\n return false;\n },\n 1\n );\n }, [editor]);\n\n return (\n <div className={styles['editor__toolbar-button-group']}>\n <button\n onClick={handleUndo}\n className={clsx(styles['editor__toolbar-button'], styles[`editor__toolbar-button--undo`])}\n aria-label={`Undo`}\n disabled={!canUndo}\n >\n <Icon name=\"Undo\" size={20} />\n </button>\n <button\n onClick={handleRedo}\n className={clsx(styles['editor__toolbar-button'], styles[`editor__toolbar-button--redo`])}\n aria-label={`Undo`}\n disabled={!canRedo}\n >\n <Icon name=\"Redo\" size={20} />\n </button>\n </div>\n );\n};\n"],"names":["HistoryPlugin","editor","useLexicalComposerContext","canUndo","setCanUndo","useState","canRedo","setCanRedo","handleUndo","UNDO_COMMAND","handleRedo","REDO_COMMAND","useEffect","CAN_UNDO_COMMAND","payload","CAN_REDO_COMMAND","jsxs","styles","jsx","clsx","Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAQO,MAAMA,IAAgB,MAAM;AAC3B,QAAA,CAACC,CAAM,IAAIC,KACX,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAK,GACtC,CAACC,GAASC,CAAU,IAAIF,EAAS,EAAK,GAEtCG,IAAa,MAAM;AAChB,IAAAP,EAAA,gBAAgBQ,GAAc,MAAS;AAAA,EAAA,GAG1CC,IAAa,MAAM;AAChB,IAAAT,EAAA,gBAAgBU,GAAc,MAAS;AAAA,EAAA;AAGhD,SAAAC,EAAU,MACDX,EAAO;AAAA,IACZY;AAAAA,IACA,CAACC,OACCV,EAAWU,CAAO,GACX;AAAA,IAET;AAAA,EAAA,GAED,CAACb,CAAM,CAAC,GAEXW,EAAU,MACDX,EAAO;AAAA,IACZc;AAAAA,IACA,CAACD,OACCP,EAAWO,CAAO,GACX;AAAA,IAET;AAAA,EAAA,GAED,CAACb,CAAM,CAAC,GAGR,gBAAAe,EAAA,OAAA,EAAI,WAAWC,EAAO,8BAA8B,GACnD,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASV;AAAA,QACT,WAAWW,EAAKF,EAAO,wBAAwB,GAAGA,EAAO,8BAA8B,CAAC;AAAA,QACxF,cAAY;AAAA,QACZ,UAAU,CAACd;AAAA,QAEX,UAAC,gBAAAe,EAAAE,GAAA,EAAK,MAAK,QAAO,MAAM,IAAI;AAAA,MAAA;AAAA,IAC9B;AAAA,IACA,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASR;AAAA,QACT,WAAWS,EAAKF,EAAO,wBAAwB,GAAGA,EAAO,8BAA8B,CAAC;AAAA,QACxF,cAAY;AAAA,QACZ,UAAU,CAACX;AAAA,QAEX,UAAC,gBAAAY,EAAAE,GAAA,EAAK,MAAK,QAAO,MAAM,IAAI;AAAA,MAAA;AAAA,IAC9B;AAAA,EACF,EAAA,CAAA;AAEJ;"}
@@ -2,7 +2,7 @@ import { jsxs as i, jsx as r } from "react/jsx-runtime";
2
2
  import { u as S } from "../../../../Lexical.prod-DNRTKPfN.js";
3
3
  import { c as _ } from "../../../../clsx-OuTLNxxd.js";
4
4
  import { U as k, v as E } from "../../../../helpers-TSjo3aAv.js";
5
- import { useState as g, useRef as R, useEffect as f } from "react";
5
+ import { useState as g, useRef as R, useEffect as p } from "react";
6
6
  import { useFlyout as T } from "../../hooks/useFlyout.js";
7
7
  import { Icon as v } from "../../../Icon/Icon.js";
8
8
  import { Button as F } from "../../../Buttons/Button.js";
@@ -21,35 +21,37 @@ import "../../../IconButton/IconButton.js";
21
21
  import "../../../Input/Input.js";
22
22
  import { InputField as z } from "../../../InputField/InputField.js";
23
23
  import "react-router-dom";
24
- import "../../../../MultiSelect-D1FnMER4.js";
24
+ import "../../../../MultiSelect-DQaqItEH.js";
25
25
  import { s as t } from "../../../../RteEditor.module-BjGyWKhW.js";
26
26
  import "../../../SelectListbox/SelectListbox.js";
27
27
  import "../../../SelectListbox/SelectProvider.js";
28
- const cr = ({ isLink: o = { active: !1, url: "", target: "_self" } }) => {
29
- const [c, m] = g(o.target === "_blank"), e = R(null), [p] = S(), { flyout: N, showFlyout: s, closeFlyout: u, isVisible: n } = T(), [a, h] = g(null), x = () => {
30
- m((l) => !l);
28
+ import "../../../Sortable/components/SortableItem.js";
29
+ import "../../../../SortableProvider-Z0e0qeQT.js";
30
+ const sr = ({ isLink: e = { active: !1, url: "", target: "_self" } }) => {
31
+ const [m, c] = g(e.target === "_blank"), o = R(null), [f] = S(), { flyout: N, showFlyout: s, closeFlyout: u, isVisible: n } = T(), [a, h] = g(null), x = () => {
32
+ c((l) => !l);
31
33
  }, w = () => {
32
34
  var b;
33
- const l = (b = e.current) == null ? void 0 : b.value;
35
+ const l = (b = o.current) == null ? void 0 : b.value;
34
36
  if (!l && l.trim() === "" || E(l) === !1) {
35
37
  h("Geen of geen geldige url ingevoerd");
36
38
  return;
37
39
  }
38
- p.dispatchCommand(k, {
40
+ f.dispatchCommand(k, {
39
41
  url: l,
40
- target: c ? "_blank" : "_self"
42
+ target: m ? "_blank" : "_self"
41
43
  }), u();
42
44
  }, U = () => {
43
- p.dispatchCommand(k, null);
45
+ f.dispatchCommand(k, null);
44
46
  }, d = {
45
47
  children: /* @__PURE__ */ i("div", { className: t.editor__linkform, children: [
46
48
  /* @__PURE__ */ i(C, { className: t["editor__linkform-input-field"], children: [
47
49
  /* @__PURE__ */ r(y, { htmlFor: "lnikUrl", children: "Link" }),
48
- /* @__PURE__ */ r(z, { id: "lnikUrl", ref: e, placeholder: "http(s)://" }),
50
+ /* @__PURE__ */ r(z, { id: "lnikUrl", ref: o, placeholder: "http(s)://" }),
49
51
  a && /* @__PURE__ */ r(j, { level: "error", feedback: a })
50
52
  ] }),
51
53
  /* @__PURE__ */ i(C, { inline: !0, children: [
52
- /* @__PURE__ */ r(V, { id: "linkTarget", onChange: x, checked: c }),
54
+ /* @__PURE__ */ r(V, { id: "linkTarget", onChange: x, checked: m }),
53
55
  /* @__PURE__ */ r(y, { htmlFor: "linkTarget", children: "Open in nieuwe window" })
54
56
  ] }),
55
57
  /* @__PURE__ */ i("div", { className: t["editor__linkform-footer"], children: [
@@ -58,13 +60,13 @@ const cr = ({ isLink: o = { active: !1, url: "", target: "_self" } }) => {
58
60
  ] })
59
61
  ] })
60
62
  };
61
- return f(() => {
63
+ return p(() => {
62
64
  a && s(d);
63
- }, [a]), f(() => {
65
+ }, [a]), p(() => {
64
66
  n && s(d);
65
- }, [c]), f(() => {
66
- !n && e.current ? (h(null), e.current.value = "", m(!1)) : e.current && o.url && (e.current.value = o.url || "", m(o.target === "_blank"), console.log("focus", e.current), e.current.focus());
67
- }, [n, o.url, o.target]), /* @__PURE__ */ i("div", { className: t["editor__toolbar-button-group"], children: [
67
+ }, [m]), p(() => {
68
+ !n && o.current ? (h(null), o.current.value = "", c(!1)) : o.current && e.url && (o.current.value = e.url || "", c(e.target === "_blank"), console.log("focus", o.current), o.current.focus());
69
+ }, [n, e.url, e.target]), /* @__PURE__ */ i("div", { className: t["editor__toolbar-button-group"], children: [
68
70
  /* @__PURE__ */ i("div", { className: t["editor__toolbar-button-flyoutwrapper"], children: [
69
71
  /* @__PURE__ */ r(
70
72
  "button",
@@ -73,7 +75,7 @@ const cr = ({ isLink: o = { active: !1, url: "", target: "_self" } }) => {
73
75
  className: _(
74
76
  t["editor__toolbar-button"],
75
77
  t["editor__toolbar-button--link"],
76
- o.active && t["editor__toolbar-button--active"]
78
+ e.active && t["editor__toolbar-button--active"]
77
79
  ),
78
80
  "aria-label": "Format link",
79
81
  children: /* @__PURE__ */ r(v, { name: "Link", size: 20 })
@@ -93,6 +95,6 @@ const cr = ({ isLink: o = { active: !1, url: "", target: "_self" } }) => {
93
95
  ] });
94
96
  };
95
97
  export {
96
- cr as LinkPlugin
98
+ sr as LinkPlugin
97
99
  };
98
100
  //# sourceMappingURL=LinkPlugin.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"LinkPlugin.js","sources":["../../../../../src/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.tsx"],"sourcesContent":["import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport clsx from 'clsx';\nimport { TOGGLE_LINK_COMMAND } from '@lexical/link';\nimport { useEffect, useRef, useState } from 'react';\n\nimport type { LinkType } from 'components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin';\n\nimport { validateUrlWithProtocol } from './helpers';\n\nimport { useFlyout } from 'components/RteEditor/hooks';\nimport { Button, InputField, Icon, Label, FormField, Checkbox, FeedbackBox } from 'components';\nimport styles from 'components/RteEditor/RteEditor.module.css';\ninterface LinkPluginProps {\n isLink: LinkType;\n}\n\nexport const LinkPlugin = ({ isLink = { active: false, url: '', target: '_self' } }: LinkPluginProps) => {\n const [targetSelectedValue, setTargetSelectedValue] = useState<boolean>(isLink.target === '_blank');\n const urlRef = useRef<HTMLInputElement>(null);\n const [editor] = useLexicalComposerContext();\n const { flyout, showFlyout, closeFlyout, isVisible } = useFlyout();\n const [urlError, setUrlError] = useState<string | null>(null);\n\n const handleChange = () => {\n setTargetSelectedValue((prev) => !prev);\n };\n\n const insertLink = () => {\n const url = urlRef.current?.value as string;\n if ((!url && url.trim() === '') || validateUrlWithProtocol(url) === false) {\n setUrlError('Geen of geen geldige url ingevoerd');\n return;\n }\n\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, {\n url,\n target: targetSelectedValue ? '_blank' : '_self',\n });\n\n closeFlyout();\n };\n\n const removeLink = (): void => {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);\n };\n\n const flyoutOptions = {\n children: (\n <div className={styles['editor__linkform']}>\n <FormField className={styles['editor__linkform-input-field']}>\n <Label htmlFor=\"lnikUrl\">Link</Label>\n <InputField id=\"lnikUrl\" ref={urlRef} placeholder=\"http(s)://\" />\n {urlError && <FeedbackBox level=\"error\" feedback={urlError} />}\n </FormField>\n <FormField inline>\n <Checkbox id=\"linkTarget\" onChange={handleChange} checked={targetSelectedValue} />\n <Label htmlFor=\"linkTarget\">Open in nieuwe window</Label>\n </FormField>\n <div className={styles['editor__linkform-footer']}>\n <Button variant={'secondary'} onClick={closeFlyout}>\n Annuleer\n </Button>\n <Button variant={'primary'} onClick={insertLink}>\n Link\n </Button>\n </div>\n </div>\n ),\n };\n\n useEffect(() => {\n if (urlError) {\n showFlyout(flyoutOptions);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [urlError]);\n\n useEffect(() => {\n if (isVisible) {\n showFlyout(flyoutOptions);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [targetSelectedValue]);\n\n useEffect(() => {\n if (!isVisible && urlRef.current) {\n setUrlError(null);\n urlRef.current.value = '';\n setTargetSelectedValue(false);\n } else if (urlRef.current && isLink.url) {\n urlRef.current.value = isLink.url || '';\n setTargetSelectedValue(isLink.target === '_blank');\n console.log('focus', urlRef.current);\n urlRef.current.focus();\n }\n }, [isVisible, isLink.url, isLink.target]);\n\n return (\n <div className={styles['editor__toolbar-button-group']}>\n <div className={styles['editor__toolbar-button-flyoutwrapper']}>\n <button\n onClick={() => (isVisible ? closeFlyout() : showFlyout(flyoutOptions))}\n className={clsx(\n styles['editor__toolbar-button'],\n styles[`editor__toolbar-button--link`],\n isLink.active && styles['editor__toolbar-button--active']\n )}\n aria-label={`Format link`}\n >\n <Icon name=\"Link\" size={20} />\n </button>\n {flyout}\n </div>\n <button\n onClick={removeLink}\n className={clsx(styles['editor__toolbar-button'], styles[`editor__toolbar-button--link`])}\n aria-label={`Remove link`}\n >\n <Icon name=\"LinkSlash\" size={20} />\n </button>\n </div>\n );\n};\n"],"names":["LinkPlugin","isLink","targetSelectedValue","setTargetSelectedValue","useState","urlRef","useRef","editor","useLexicalComposerContext","flyout","showFlyout","closeFlyout","isVisible","useFlyout","urlError","setUrlError","handleChange","prev","insertLink","url","_a","validateUrlWithProtocol","TOGGLE_LINK_COMMAND","removeLink","flyoutOptions","jsxs","styles","FormField","jsx","Label","InputField","FeedbackBox","Checkbox","Button","useEffect","clsx","Icon"],"mappings":"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"}
1
+ {"version":3,"file":"LinkPlugin.js","sources":["../../../../../src/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.tsx"],"sourcesContent":["import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport clsx from 'clsx';\nimport { TOGGLE_LINK_COMMAND } from '@lexical/link';\nimport { useEffect, useRef, useState } from 'react';\n\nimport type { LinkType } from 'components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin';\n\nimport { validateUrlWithProtocol } from './helpers';\n\nimport { useFlyout } from 'components/RteEditor/hooks';\nimport { Button, InputField, Icon, Label, FormField, Checkbox, FeedbackBox } from 'components';\nimport styles from 'components/RteEditor/RteEditor.module.css';\ninterface LinkPluginProps {\n isLink: LinkType;\n}\n\nexport const LinkPlugin = ({ isLink = { active: false, url: '', target: '_self' } }: LinkPluginProps) => {\n const [targetSelectedValue, setTargetSelectedValue] = useState<boolean>(isLink.target === '_blank');\n const urlRef = useRef<HTMLInputElement>(null);\n const [editor] = useLexicalComposerContext();\n const { flyout, showFlyout, closeFlyout, isVisible } = useFlyout();\n const [urlError, setUrlError] = useState<string | null>(null);\n\n const handleChange = () => {\n setTargetSelectedValue((prev) => !prev);\n };\n\n const insertLink = () => {\n const url = urlRef.current?.value as string;\n if ((!url && url.trim() === '') || validateUrlWithProtocol(url) === false) {\n setUrlError('Geen of geen geldige url ingevoerd');\n return;\n }\n\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, {\n url,\n target: targetSelectedValue ? '_blank' : '_self',\n });\n\n closeFlyout();\n };\n\n const removeLink = (): void => {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);\n };\n\n const flyoutOptions = {\n children: (\n <div className={styles['editor__linkform']}>\n <FormField className={styles['editor__linkform-input-field']}>\n <Label htmlFor=\"lnikUrl\">Link</Label>\n <InputField id=\"lnikUrl\" ref={urlRef} placeholder=\"http(s)://\" />\n {urlError && <FeedbackBox level=\"error\" feedback={urlError} />}\n </FormField>\n <FormField inline>\n <Checkbox id=\"linkTarget\" onChange={handleChange} checked={targetSelectedValue} />\n <Label htmlFor=\"linkTarget\">Open in nieuwe window</Label>\n </FormField>\n <div className={styles['editor__linkform-footer']}>\n <Button variant={'secondary'} onClick={closeFlyout}>\n Annuleer\n </Button>\n <Button variant={'primary'} onClick={insertLink}>\n Link\n </Button>\n </div>\n </div>\n ),\n };\n\n useEffect(() => {\n if (urlError) {\n showFlyout(flyoutOptions);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [urlError]);\n\n useEffect(() => {\n if (isVisible) {\n showFlyout(flyoutOptions);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [targetSelectedValue]);\n\n useEffect(() => {\n if (!isVisible && urlRef.current) {\n setUrlError(null);\n urlRef.current.value = '';\n setTargetSelectedValue(false);\n } else if (urlRef.current && isLink.url) {\n urlRef.current.value = isLink.url || '';\n setTargetSelectedValue(isLink.target === '_blank');\n console.log('focus', urlRef.current);\n urlRef.current.focus();\n }\n }, [isVisible, isLink.url, isLink.target]);\n\n return (\n <div className={styles['editor__toolbar-button-group']}>\n <div className={styles['editor__toolbar-button-flyoutwrapper']}>\n <button\n onClick={() => (isVisible ? closeFlyout() : showFlyout(flyoutOptions))}\n className={clsx(\n styles['editor__toolbar-button'],\n styles[`editor__toolbar-button--link`],\n isLink.active && styles['editor__toolbar-button--active']\n )}\n aria-label={`Format link`}\n >\n <Icon name=\"Link\" size={20} />\n </button>\n {flyout}\n </div>\n <button\n onClick={removeLink}\n className={clsx(styles['editor__toolbar-button'], styles[`editor__toolbar-button--link`])}\n aria-label={`Remove link`}\n >\n <Icon name=\"LinkSlash\" size={20} />\n </button>\n </div>\n );\n};\n"],"names":["LinkPlugin","isLink","targetSelectedValue","setTargetSelectedValue","useState","urlRef","useRef","editor","useLexicalComposerContext","flyout","showFlyout","closeFlyout","isVisible","useFlyout","urlError","setUrlError","handleChange","prev","insertLink","url","_a","validateUrlWithProtocol","TOGGLE_LINK_COMMAND","removeLink","flyoutOptions","jsxs","styles","FormField","jsx","Label","InputField","FeedbackBox","Checkbox","Button","useEffect","clsx","Icon"],"mappings":"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"}
@@ -20,9 +20,11 @@ import "../IconButton/IconButton.js";
20
20
  import "../Input/Input.js";
21
21
  import "../InputField/InputField.js";
22
22
  import "react-router-dom";
23
- import "../../MultiSelect-D1FnMER4.js";
23
+ import "../../MultiSelect-DQaqItEH.js";
24
24
  import "../SelectListbox/SelectListbox.js";
25
25
  import "../SelectListbox/SelectProvider.js";
26
+ import "../Sortable/components/SortableItem.js";
27
+ import "../../SortableProvider-Z0e0qeQT.js";
26
28
  import { UvaTheme as dn } from "./UvaTheme/UvaTheme.js";
27
29
  const Xe = typeof window < "u" && window.document !== void 0 && window.document.createElement !== void 0, fn = Xe ? z : k, X = { tag: "history-merge" };
28
30
  function mn({ initialConfig: t, children: e }) {
@@ -953,7 +955,7 @@ function fr({ delay: t, externalHistoryState: e }) {
953
955
  k(() => ur(r, o, i), [i, r, o]);
954
956
  }(n, e, t), null;
955
957
  }
956
- const Ir = ({
958
+ const zr = ({
957
959
  namespace: t = "UvaEditor",
958
960
  initialValue: e = "",
959
961
  placeholder: n = "",
@@ -1008,6 +1010,6 @@ const Ir = ({
1008
1010
  ] }) });
1009
1011
  };
1010
1012
  export {
1011
- Ir as RteEditor
1013
+ zr as RteEditor
1012
1014
  };
1013
1015
  //# sourceMappingURL=RteEditor.js.map