@_sh/strapi-plugin-ckeditor 6.0.1 → 6.0.3

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.
@@ -30,7 +30,7 @@ const admin = require("@strapi/strapi/admin");
30
30
  const ckeditor5 = require("ckeditor5");
31
31
  const ckeditor5React = require("@ckeditor/ckeditor5-react");
32
32
  require("ckeditor5/ckeditor5.css");
33
- const index = require("./index-DUYTlr_2.js");
33
+ const index = require("./index-D48ig74s.js");
34
34
  require("sanitize-html");
35
35
  const icons = require("@strapi/icons");
36
36
  const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
@@ -309,7 +309,7 @@ function MediaLib({ isOpen = false, toggle, handleChangeAssets }) {
309
309
  return /* @__PURE__ */ jsxRuntime.jsx(MediaLibraryDialog, { onClose: toggle, onSelectAssets: handleSelectAssets });
310
310
  }
311
311
  const MemoizedMediaLib = React__default.default.memo(MediaLib);
312
- function CKEReact() {
312
+ const CKEReact = React__default.default.forwardRef((_, forwardedRef) => {
313
313
  const [mediaLibVisible, setMediaLibVisible] = React.useState(false);
314
314
  const [editorInstance, setEditorInstance] = React.useState(null);
315
315
  const [isWordsMax, setIsWordsMax] = React.useState(false);
@@ -317,13 +317,20 @@ function CKEReact() {
317
317
  const { name, disabled, preset, wordsLimit, charsLimit } = useEditorContext();
318
318
  const { onChange: fieldOnChange, value: fieldValue } = admin.useField(name);
319
319
  const wordCounterRef = React.useRef(null);
320
+ const debounceTimeout = React.useRef(null);
320
321
  const onEditorReady = (editor) => {
321
322
  setUpPlugins(editor);
322
323
  setEditorInstance(editor);
323
324
  };
324
325
  const onEditorChange = (_e, editor) => {
326
+ if (debounceTimeout.current) {
327
+ clearTimeout(debounceTimeout.current);
328
+ }
325
329
  const data = editor.getData();
326
- fieldOnChange(name, data);
330
+ debounceTimeout.current = setTimeout(() => {
331
+ fieldOnChange(name, data);
332
+ debounceTimeout.current = null;
333
+ }, 300);
327
334
  };
328
335
  const toggleMediaLib = React.useCallback(() => setMediaLibVisible((prev) => !prev), [setMediaLibVisible]);
329
336
  const handleChangeAssets = React.useCallback(
@@ -338,6 +345,22 @@ function CKEReact() {
338
345
  },
339
346
  [toggleMediaLib, editorInstance]
340
347
  );
348
+ React.useEffect(() => {
349
+ const ckWrapper = document.querySelector(".ck-body-wrapper");
350
+ const listener = ckWrapper?.addEventListener("pointerdown", (e) => e.stopPropagation(), true);
351
+ return () => {
352
+ listener && ckWrapper?.removeEventListener("pointerdown", listener);
353
+ };
354
+ }, [editorInstance]);
355
+ React.useImperativeHandle(
356
+ forwardedRef,
357
+ () => ({
358
+ focus() {
359
+ editorInstance?.focus();
360
+ }
361
+ }),
362
+ [editorInstance]
363
+ );
341
364
  if (!preset) {
342
365
  return null;
343
366
  }
@@ -421,7 +444,7 @@ function CKEReact() {
421
444
  setIsCharsMax(stats.characters > charsLimit);
422
445
  }
423
446
  }
424
- }
447
+ });
425
448
  const WordCounter = styledComponents.styled(designSystem.Flex)`
426
449
  ${({ theme, $isWordsMax, $isCharsMax }) => styledComponents.css`
427
450
  .ck-word-count__words {
@@ -438,25 +461,34 @@ function EditorLayout({ children }) {
438
461
  React.useEffect(() => {
439
462
  if (isExpandedMode) {
440
463
  document.body.classList.add("lock-body-scroll");
464
+ setTimeout(() => {
465
+ document.querySelector(".ck-editor__expanded .ck-editor__editable")?.focus();
466
+ }, 0);
441
467
  }
442
468
  return () => {
443
469
  document.body.classList.remove("lock-body-scroll");
444
470
  };
445
471
  }, [isExpandedMode]);
446
472
  if (isExpandedMode) {
447
- return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Root, { open: isExpandedMode, onOpenChange: handleToggleExpand, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Content, { style: { maxWidth: "unset", width: "unset" }, children: /* @__PURE__ */ jsxRuntime.jsx(FullScreenBox, { height: "90vh", width: "90vw", background: "neutral100", children: /* @__PURE__ */ jsxRuntime.jsxs(
448
- EditorWrapper,
473
+ return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Root, { open: isExpandedMode, onOpenChange: handleToggleExpand, children: /* @__PURE__ */ jsxRuntime.jsx(
474
+ designSystem.Modal.Content,
449
475
  {
450
- $presetStyles: preset?.styles,
451
- $isExpanded: isExpandedMode,
452
- $hasError: Boolean(error),
453
- className: "ck-editor__expanded",
454
- children: [
455
- children,
456
- /* @__PURE__ */ jsxRuntime.jsx(CollapseButton, { label: "Collapse", onClick: handleToggleExpand, children: /* @__PURE__ */ jsxRuntime.jsx(icons.Collapse, {}) })
457
- ]
476
+ style: { maxWidth: "var(--ck-editor-full-screen-box-max-width)", width: "unset" },
477
+ children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { height: "90dvh", width: "90dvw", alignItems: "flex-start", direction: "column", children: /* @__PURE__ */ jsxRuntime.jsxs(
478
+ EditorWrapper,
479
+ {
480
+ $presetStyles: preset?.styles,
481
+ $isExpanded: isExpandedMode,
482
+ $hasError: Boolean(error),
483
+ className: "ck-editor__expanded",
484
+ children: [
485
+ children,
486
+ /* @__PURE__ */ jsxRuntime.jsx(CollapseButton, { tabindex: "-1", label: "Collapse", onClick: handleToggleExpand, children: /* @__PURE__ */ jsxRuntime.jsx(icons.Collapse, {}) })
487
+ ]
488
+ }
489
+ ) })
458
490
  }
459
- ) }) }) });
491
+ ) });
460
492
  }
461
493
  return /* @__PURE__ */ jsxRuntime.jsxs(
462
494
  EditorWrapper,
@@ -508,9 +540,6 @@ const CollapseButton = styledComponents.styled(designSystem.IconButton)`
508
540
  z-index: 2;
509
541
  box-shadow: ${({ theme }) => theme.shadows.filterShadow};
510
542
  `;
511
- const FullScreenBox = styledComponents.styled(designSystem.Flex)`
512
- max-width: var(--ck-editor-full-screen-box-max-width);
513
- `;
514
543
  const GlobalStyle = styledComponents.createGlobalStyle`
515
544
  ${({ $editortTheme, $variant }) => $editortTheme && styledComponents.css`
516
545
  ${$editortTheme.common}
@@ -526,18 +555,18 @@ function GlobalStyling() {
526
555
  return /* @__PURE__ */ jsxRuntime.jsx(GlobalStyle, { $editortTheme: theme, $variant: variant });
527
556
  }
528
557
  const MemoizedGlobalStyling = React__default.default.memo(GlobalStyling);
529
- function Editor() {
558
+ const Editor = React__default.default.forwardRef((_, forwardedRef) => {
530
559
  const { name, hint, required, labelAction, label, error, preset } = useEditorContext();
531
560
  return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Root, { id: name, name, error, hint, required, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
532
561
  /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { action: labelAction, children: label }),
533
562
  preset ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
534
563
  /* @__PURE__ */ jsxRuntime.jsx(MemoizedGlobalStyling, {}),
535
- /* @__PURE__ */ jsxRuntime.jsx(EditorLayout, { children: /* @__PURE__ */ jsxRuntime.jsx(CKEReact, {}) })
564
+ /* @__PURE__ */ jsxRuntime.jsx(EditorLayout, { children: /* @__PURE__ */ jsxRuntime.jsx(CKEReact, { ref: forwardedRef }) })
536
565
  ] }) : /* @__PURE__ */ jsxRuntime.jsx(LoaderBox, { hasRadius: true, background: "neutral100", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Loader, { children: "Loading..." }) }),
537
566
  /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Hint, {}),
538
567
  /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Error, {})
539
568
  ] }) });
540
- }
569
+ });
541
570
  const LoaderBox = styledComponents.styled(designSystem.Box)`
542
571
  display: flex;
543
572
  justify-content: center;
@@ -545,38 +574,40 @@ const LoaderBox = styledComponents.styled(designSystem.Box)`
545
574
  height: 200px;
546
575
  width: 100%;
547
576
  `;
548
- function Field({
549
- name,
550
- hint,
551
- error,
552
- placeholder,
553
- label,
554
- attribute,
555
- labelAction = null,
556
- disabled = false,
557
- required = false
558
- }) {
559
- const { preset, maxLengthWords, maxLengthCharacters } = attribute.options;
560
- const isFieldLocalized = attribute?.pluginOptions?.i18n?.localized ?? false;
561
- return /* @__PURE__ */ jsxRuntime.jsx(
562
- EditorProvider,
563
- {
564
- name,
565
- error,
566
- disabled,
567
- required,
568
- placeholder,
569
- hint,
570
- label,
571
- labelAction,
572
- presetName: preset,
573
- wordsLimit: maxLengthWords,
574
- charsLimit: maxLengthCharacters,
575
- isFieldLocalized,
576
- children: /* @__PURE__ */ jsxRuntime.jsx(Editor, {})
577
- }
578
- );
579
- }
577
+ const Field = React__default.default.forwardRef(
578
+ ({
579
+ name,
580
+ hint,
581
+ error,
582
+ placeholder,
583
+ label,
584
+ attribute,
585
+ labelAction = null,
586
+ disabled = false,
587
+ required = false
588
+ }, forwardedRef) => {
589
+ const { preset, maxLengthWords, maxLengthCharacters } = attribute.options;
590
+ const isFieldLocalized = attribute?.pluginOptions?.i18n?.localized ?? false;
591
+ return /* @__PURE__ */ jsxRuntime.jsx(
592
+ EditorProvider,
593
+ {
594
+ name,
595
+ error,
596
+ disabled,
597
+ required,
598
+ placeholder,
599
+ hint,
600
+ label,
601
+ labelAction,
602
+ presetName: preset,
603
+ wordsLimit: maxLengthWords,
604
+ charsLimit: maxLengthCharacters,
605
+ isFieldLocalized,
606
+ children: /* @__PURE__ */ jsxRuntime.jsx(Editor, { ref: forwardedRef })
607
+ }
608
+ );
609
+ }
610
+ );
580
611
  function compare(oldProps, newProps) {
581
612
  return oldProps.error === newProps.error && oldProps.labelAction === newProps.labelAction;
582
613
  }
@@ -1,12 +1,12 @@
1
1
  import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
- import React, { createContext, useState, useEffect, useMemo, useContext, useRef, useCallback, useReducer } from "react";
3
- import { Flex, IconButton, Modal, Box, Field as Field$1, Loader } from "@strapi/design-system";
2
+ import React, { createContext, useContext, useState, useEffect, useMemo, useRef, useCallback, useImperativeHandle, useReducer } from "react";
3
+ import { Flex, IconButton, Modal, Field as Field$1, Loader, Box } from "@strapi/design-system";
4
4
  import { styled, css, createGlobalStyle } from "styled-components";
5
5
  import { useStrapiApp, useField } from "@strapi/strapi/admin";
6
6
  import { ClassicEditor } from "ckeditor5";
7
7
  import { CKEditor } from "@ckeditor/ckeditor5-react";
8
8
  import "ckeditor5/ckeditor5.css";
9
- import { g as getPluginConfig, p as prefixFileUrlWithBackendUrl, i as isImageResponsive } from "./index-Q6to6uwX.mjs";
9
+ import { g as getPluginConfig, p as prefixFileUrlWithBackendUrl, i as isImageResponsive } from "./index-CwLpvdFD.mjs";
10
10
  import "sanitize-html";
11
11
  import { Collapse, Expand } from "@strapi/icons";
12
12
  const STORAGE_KEYS = {
@@ -283,7 +283,7 @@ function MediaLib({ isOpen = false, toggle, handleChangeAssets }) {
283
283
  return /* @__PURE__ */ jsx(MediaLibraryDialog, { onClose: toggle, onSelectAssets: handleSelectAssets });
284
284
  }
285
285
  const MemoizedMediaLib = React.memo(MediaLib);
286
- function CKEReact() {
286
+ const CKEReact = React.forwardRef((_, forwardedRef) => {
287
287
  const [mediaLibVisible, setMediaLibVisible] = useState(false);
288
288
  const [editorInstance, setEditorInstance] = useState(null);
289
289
  const [isWordsMax, setIsWordsMax] = useState(false);
@@ -291,13 +291,20 @@ function CKEReact() {
291
291
  const { name, disabled, preset, wordsLimit, charsLimit } = useEditorContext();
292
292
  const { onChange: fieldOnChange, value: fieldValue } = useField(name);
293
293
  const wordCounterRef = useRef(null);
294
+ const debounceTimeout = useRef(null);
294
295
  const onEditorReady = (editor) => {
295
296
  setUpPlugins(editor);
296
297
  setEditorInstance(editor);
297
298
  };
298
299
  const onEditorChange = (_e, editor) => {
300
+ if (debounceTimeout.current) {
301
+ clearTimeout(debounceTimeout.current);
302
+ }
299
303
  const data = editor.getData();
300
- fieldOnChange(name, data);
304
+ debounceTimeout.current = setTimeout(() => {
305
+ fieldOnChange(name, data);
306
+ debounceTimeout.current = null;
307
+ }, 300);
301
308
  };
302
309
  const toggleMediaLib = useCallback(() => setMediaLibVisible((prev) => !prev), [setMediaLibVisible]);
303
310
  const handleChangeAssets = useCallback(
@@ -312,6 +319,22 @@ function CKEReact() {
312
319
  },
313
320
  [toggleMediaLib, editorInstance]
314
321
  );
322
+ useEffect(() => {
323
+ const ckWrapper = document.querySelector(".ck-body-wrapper");
324
+ const listener = ckWrapper?.addEventListener("pointerdown", (e) => e.stopPropagation(), true);
325
+ return () => {
326
+ listener && ckWrapper?.removeEventListener("pointerdown", listener);
327
+ };
328
+ }, [editorInstance]);
329
+ useImperativeHandle(
330
+ forwardedRef,
331
+ () => ({
332
+ focus() {
333
+ editorInstance?.focus();
334
+ }
335
+ }),
336
+ [editorInstance]
337
+ );
315
338
  if (!preset) {
316
339
  return null;
317
340
  }
@@ -395,7 +418,7 @@ function CKEReact() {
395
418
  setIsCharsMax(stats.characters > charsLimit);
396
419
  }
397
420
  }
398
- }
421
+ });
399
422
  const WordCounter = styled(Flex)`
400
423
  ${({ theme, $isWordsMax, $isCharsMax }) => css`
401
424
  .ck-word-count__words {
@@ -412,25 +435,34 @@ function EditorLayout({ children }) {
412
435
  useEffect(() => {
413
436
  if (isExpandedMode) {
414
437
  document.body.classList.add("lock-body-scroll");
438
+ setTimeout(() => {
439
+ document.querySelector(".ck-editor__expanded .ck-editor__editable")?.focus();
440
+ }, 0);
415
441
  }
416
442
  return () => {
417
443
  document.body.classList.remove("lock-body-scroll");
418
444
  };
419
445
  }, [isExpandedMode]);
420
446
  if (isExpandedMode) {
421
- return /* @__PURE__ */ jsx(Modal.Root, { open: isExpandedMode, onOpenChange: handleToggleExpand, children: /* @__PURE__ */ jsx(Modal.Content, { style: { maxWidth: "unset", width: "unset" }, children: /* @__PURE__ */ jsx(FullScreenBox, { height: "90vh", width: "90vw", background: "neutral100", children: /* @__PURE__ */ jsxs(
422
- EditorWrapper,
447
+ return /* @__PURE__ */ jsx(Modal.Root, { open: isExpandedMode, onOpenChange: handleToggleExpand, children: /* @__PURE__ */ jsx(
448
+ Modal.Content,
423
449
  {
424
- $presetStyles: preset?.styles,
425
- $isExpanded: isExpandedMode,
426
- $hasError: Boolean(error),
427
- className: "ck-editor__expanded",
428
- children: [
429
- children,
430
- /* @__PURE__ */ jsx(CollapseButton, { label: "Collapse", onClick: handleToggleExpand, children: /* @__PURE__ */ jsx(Collapse, {}) })
431
- ]
450
+ style: { maxWidth: "var(--ck-editor-full-screen-box-max-width)", width: "unset" },
451
+ children: /* @__PURE__ */ jsx(Flex, { height: "90dvh", width: "90dvw", alignItems: "flex-start", direction: "column", children: /* @__PURE__ */ jsxs(
452
+ EditorWrapper,
453
+ {
454
+ $presetStyles: preset?.styles,
455
+ $isExpanded: isExpandedMode,
456
+ $hasError: Boolean(error),
457
+ className: "ck-editor__expanded",
458
+ children: [
459
+ children,
460
+ /* @__PURE__ */ jsx(CollapseButton, { tabindex: "-1", label: "Collapse", onClick: handleToggleExpand, children: /* @__PURE__ */ jsx(Collapse, {}) })
461
+ ]
462
+ }
463
+ ) })
432
464
  }
433
- ) }) }) });
465
+ ) });
434
466
  }
435
467
  return /* @__PURE__ */ jsxs(
436
468
  EditorWrapper,
@@ -482,9 +514,6 @@ const CollapseButton = styled(IconButton)`
482
514
  z-index: 2;
483
515
  box-shadow: ${({ theme }) => theme.shadows.filterShadow};
484
516
  `;
485
- const FullScreenBox = styled(Flex)`
486
- max-width: var(--ck-editor-full-screen-box-max-width);
487
- `;
488
517
  const GlobalStyle = createGlobalStyle`
489
518
  ${({ $editortTheme, $variant }) => $editortTheme && css`
490
519
  ${$editortTheme.common}
@@ -500,18 +529,18 @@ function GlobalStyling() {
500
529
  return /* @__PURE__ */ jsx(GlobalStyle, { $editortTheme: theme, $variant: variant });
501
530
  }
502
531
  const MemoizedGlobalStyling = React.memo(GlobalStyling);
503
- function Editor() {
532
+ const Editor = React.forwardRef((_, forwardedRef) => {
504
533
  const { name, hint, required, labelAction, label, error, preset } = useEditorContext();
505
534
  return /* @__PURE__ */ jsx(Field$1.Root, { id: name, name, error, hint, required, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
506
535
  /* @__PURE__ */ jsx(Field$1.Label, { action: labelAction, children: label }),
507
536
  preset ? /* @__PURE__ */ jsxs(Fragment, { children: [
508
537
  /* @__PURE__ */ jsx(MemoizedGlobalStyling, {}),
509
- /* @__PURE__ */ jsx(EditorLayout, { children: /* @__PURE__ */ jsx(CKEReact, {}) })
538
+ /* @__PURE__ */ jsx(EditorLayout, { children: /* @__PURE__ */ jsx(CKEReact, { ref: forwardedRef }) })
510
539
  ] }) : /* @__PURE__ */ jsx(LoaderBox, { hasRadius: true, background: "neutral100", children: /* @__PURE__ */ jsx(Loader, { children: "Loading..." }) }),
511
540
  /* @__PURE__ */ jsx(Field$1.Hint, {}),
512
541
  /* @__PURE__ */ jsx(Field$1.Error, {})
513
542
  ] }) });
514
- }
543
+ });
515
544
  const LoaderBox = styled(Box)`
516
545
  display: flex;
517
546
  justify-content: center;
@@ -519,38 +548,40 @@ const LoaderBox = styled(Box)`
519
548
  height: 200px;
520
549
  width: 100%;
521
550
  `;
522
- function Field({
523
- name,
524
- hint,
525
- error,
526
- placeholder,
527
- label,
528
- attribute,
529
- labelAction = null,
530
- disabled = false,
531
- required = false
532
- }) {
533
- const { preset, maxLengthWords, maxLengthCharacters } = attribute.options;
534
- const isFieldLocalized = attribute?.pluginOptions?.i18n?.localized ?? false;
535
- return /* @__PURE__ */ jsx(
536
- EditorProvider,
537
- {
538
- name,
539
- error,
540
- disabled,
541
- required,
542
- placeholder,
543
- hint,
544
- label,
545
- labelAction,
546
- presetName: preset,
547
- wordsLimit: maxLengthWords,
548
- charsLimit: maxLengthCharacters,
549
- isFieldLocalized,
550
- children: /* @__PURE__ */ jsx(Editor, {})
551
- }
552
- );
553
- }
551
+ const Field = React.forwardRef(
552
+ ({
553
+ name,
554
+ hint,
555
+ error,
556
+ placeholder,
557
+ label,
558
+ attribute,
559
+ labelAction = null,
560
+ disabled = false,
561
+ required = false
562
+ }, forwardedRef) => {
563
+ const { preset, maxLengthWords, maxLengthCharacters } = attribute.options;
564
+ const isFieldLocalized = attribute?.pluginOptions?.i18n?.localized ?? false;
565
+ return /* @__PURE__ */ jsx(
566
+ EditorProvider,
567
+ {
568
+ name,
569
+ error,
570
+ disabled,
571
+ required,
572
+ placeholder,
573
+ hint,
574
+ label,
575
+ labelAction,
576
+ presetName: preset,
577
+ wordsLimit: maxLengthWords,
578
+ charsLimit: maxLengthCharacters,
579
+ isFieldLocalized,
580
+ children: /* @__PURE__ */ jsx(Editor, { ref: forwardedRef })
581
+ }
582
+ );
583
+ }
584
+ );
554
585
  function compare(oldProps, newProps) {
555
586
  return oldProps.error === newProps.error && oldProps.labelAction === newProps.labelAction;
556
587
  }
@@ -6,7 +6,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
6
6
  import { Flex, lightTheme } from "@strapi/design-system";
7
7
  import cloneDeep from "lodash/cloneDeep";
8
8
  const name = "@_sh/strapi-plugin-ckeditor";
9
- const version = "6.0.1";
9
+ const version = "6.0.3";
10
10
  const description = "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)";
11
11
  const keywords = [
12
12
  "strapi",
@@ -73,7 +73,7 @@ const dependencies = {
73
73
  "@ckeditor/ckeditor5-react": "~9.5.0",
74
74
  "@strapi/design-system": "2.0.0-rc.18",
75
75
  "@strapi/icons": "2.0.0-rc.18",
76
- ckeditor5: "~45.0.0",
76
+ ckeditor5: "~45.2.0",
77
77
  lodash: "4.17.21",
78
78
  "sanitize-html": "2.13.0",
79
79
  yup: "0.32.9"
@@ -526,6 +526,8 @@ const plugin = css`
526
526
  `;
527
527
  const expanded = css`
528
528
  .ck-editor__expanded {
529
+ max-width: var(--ck-editor-full-screen-box-max-width);
530
+
529
531
  .ck.ck-content.ck-editor__editable,
530
532
  .ck-source-editing-area {
531
533
  min-height: 100% !important;
@@ -565,6 +567,10 @@ const expanded = css`
565
567
  right: 1.2rem;
566
568
  }
567
569
  }
570
+
571
+ .ck-body-wrapper {
572
+ pointer-events: all;
573
+ }
568
574
  `;
569
575
  const common = css`
570
576
  ${reset}
@@ -1243,7 +1249,7 @@ const index = {
1243
1249
  defaultMessage: "The advanced rich text editor. (Community Edition)"
1244
1250
  },
1245
1251
  components: {
1246
- Input: async () => import("./Field-Dh4Ympog.mjs").then((module) => ({
1252
+ Input: async () => import("./Field-C5uO1-1c.mjs").then((module) => ({
1247
1253
  default: module.Field
1248
1254
  }))
1249
1255
  },
@@ -28,7 +28,7 @@ const yup__namespace = /* @__PURE__ */ _interopNamespace(yup);
28
28
  const sanitizeHtml__namespace = /* @__PURE__ */ _interopNamespace(sanitizeHtml);
29
29
  const cloneDeep__default = /* @__PURE__ */ _interopDefault(cloneDeep);
30
30
  const name = "@_sh/strapi-plugin-ckeditor";
31
- const version = "6.0.1";
31
+ const version = "6.0.3";
32
32
  const description = "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)";
33
33
  const keywords = [
34
34
  "strapi",
@@ -95,7 +95,7 @@ const dependencies = {
95
95
  "@ckeditor/ckeditor5-react": "~9.5.0",
96
96
  "@strapi/design-system": "2.0.0-rc.18",
97
97
  "@strapi/icons": "2.0.0-rc.18",
98
- ckeditor5: "~45.0.0",
98
+ ckeditor5: "~45.2.0",
99
99
  lodash: "4.17.21",
100
100
  "sanitize-html": "2.13.0",
101
101
  yup: "0.32.9"
@@ -548,6 +548,8 @@ const plugin = styledComponents.css`
548
548
  `;
549
549
  const expanded = styledComponents.css`
550
550
  .ck-editor__expanded {
551
+ max-width: var(--ck-editor-full-screen-box-max-width);
552
+
551
553
  .ck.ck-content.ck-editor__editable,
552
554
  .ck-source-editing-area {
553
555
  min-height: 100% !important;
@@ -587,6 +589,10 @@ const expanded = styledComponents.css`
587
589
  right: 1.2rem;
588
590
  }
589
591
  }
592
+
593
+ .ck-body-wrapper {
594
+ pointer-events: all;
595
+ }
590
596
  `;
591
597
  const common = styledComponents.css`
592
598
  ${reset}
@@ -1265,7 +1271,7 @@ const index = {
1265
1271
  defaultMessage: "The advanced rich text editor. (Community Edition)"
1266
1272
  },
1267
1273
  components: {
1268
- Input: async () => Promise.resolve().then(() => require("./Field-CJHYTedG.js")).then((module2) => ({
1274
+ Input: async () => Promise.resolve().then(() => require("./Field-Bjfn0oud.js")).then((module2) => ({
1269
1275
  default: module2.Field
1270
1276
  }))
1271
1277
  },
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
3
3
  require("yup");
4
- const index = require("../_chunks/index-DUYTlr_2.js");
4
+ const index = require("../_chunks/index-D48ig74s.js");
5
5
  require("ckeditor5");
6
6
  require("sanitize-html");
7
7
  exports.StrapiMediaLib = index.StrapiMediaLib;
@@ -1,5 +1,5 @@
1
1
  import "yup";
2
- import { S, h, a, b, d, c, e, f, s } from "../_chunks/index-Q6to6uwX.mjs";
2
+ import { S, h, a, b, d, c, e, f, s } from "../_chunks/index-CwLpvdFD.mjs";
3
3
  import "ckeditor5";
4
4
  import "sanitize-html";
5
5
  export {
@@ -1,6 +1,9 @@
1
+ import React from 'react';
1
2
  import 'ckeditor5/ckeditor5.css';
2
3
  export type WordCountPluginStats = {
3
4
  words: number;
4
5
  characters: number;
5
6
  };
6
- export declare function CKEReact(): import("react/jsx-runtime").JSX.Element | null;
7
+ export declare const CKEReact: React.ForwardRefExoticComponent<React.RefAttributes<{
8
+ focus: () => void;
9
+ }>>;
@@ -1 +1,4 @@
1
- export declare function Editor(): import("react/jsx-runtime").JSX.Element;
1
+ import React from 'react';
2
+ export declare const Editor: React.ForwardRefExoticComponent<React.RefAttributes<{
3
+ focus: () => void;
4
+ }>>;
@@ -15,6 +15,7 @@ type CKEditorFieldProps = Readonly<InputProps & FieldValue & {
15
15
  };
16
16
  };
17
17
  }>;
18
- declare function Field({ name, hint, error, placeholder, label, attribute, labelAction, disabled, required, }: CKEditorFieldProps): import("react/jsx-runtime").JSX.Element;
19
- declare const MemoizedField: React.MemoExoticComponent<typeof Field>;
18
+ declare const MemoizedField: React.MemoExoticComponent<React.ForwardRefExoticComponent<CKEditorFieldProps & React.RefAttributes<{
19
+ focus: () => void;
20
+ }>>>;
20
21
  export { MemoizedField as Field };
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  const name = "@_sh/strapi-plugin-ckeditor";
3
- const version = "6.0.1";
3
+ const version = "6.0.3";
4
4
  const description = "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)";
5
5
  const keywords = [
6
6
  "strapi",
@@ -67,7 +67,7 @@ const dependencies = {
67
67
  "@ckeditor/ckeditor5-react": "~9.5.0",
68
68
  "@strapi/design-system": "2.0.0-rc.18",
69
69
  "@strapi/icons": "2.0.0-rc.18",
70
- ckeditor5: "~45.0.0",
70
+ ckeditor5: "~45.2.0",
71
71
  lodash: "4.17.21",
72
72
  "sanitize-html": "2.13.0",
73
73
  yup: "0.32.9"
@@ -1,5 +1,5 @@
1
1
  const name = "@_sh/strapi-plugin-ckeditor";
2
- const version = "6.0.1";
2
+ const version = "6.0.3";
3
3
  const description = "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)";
4
4
  const keywords = [
5
5
  "strapi",
@@ -66,7 +66,7 @@ const dependencies = {
66
66
  "@ckeditor/ckeditor5-react": "~9.5.0",
67
67
  "@strapi/design-system": "2.0.0-rc.18",
68
68
  "@strapi/icons": "2.0.0-rc.18",
69
- ckeditor5: "~45.0.0",
69
+ ckeditor5: "~45.2.0",
70
70
  lodash: "4.17.21",
71
71
  "sanitize-html": "2.13.0",
72
72
  yup: "0.32.9"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@_sh/strapi-plugin-ckeditor",
3
- "version": "6.0.1",
3
+ "version": "6.0.3",
4
4
  "description": "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)",
5
5
  "keywords": [
6
6
  "strapi",
@@ -67,7 +67,7 @@
67
67
  "@ckeditor/ckeditor5-react": "~9.5.0",
68
68
  "@strapi/design-system": "2.0.0-rc.18",
69
69
  "@strapi/icons": "2.0.0-rc.18",
70
- "ckeditor5": "~45.0.0",
70
+ "ckeditor5": "~45.2.0",
71
71
  "lodash": "4.17.21",
72
72
  "sanitize-html": "2.13.0",
73
73
  "yup": "0.32.9"