@_sh/strapi-plugin-ckeditor 6.0.3 → 7.0.0

package/README.md

@@ -28,7 +28,7 @@
 - **Self-Hosted**
 
 <p align="right">
-    <a href="https://www.buymeacoffee.com/nshenderov" target="_blank">
+    <a href="https://boosty.to/nkshenderov/donate" target="_blank">
         <img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 60px; width: 217px;" >
     </a>
 </p>
@@ -469,7 +469,7 @@ export default {
   <summary>Setting a new set of presets [TS]</summary>
 
 ```ts
-// src/admin/app.tsx
+// src/admin/app.ts
 
 import {
   Bold,
@@ -553,7 +553,7 @@ export default {
   <summary>Default presets modification using setPluginConfig [TS]</summary>
 
 ```ts
-// src/admin/app.tsx
+// src/admin/app.ts
 
 import { css } from 'styled-components';
 
@@ -627,7 +627,7 @@ export default {
   <summary>Default presets modification using getPluginPresets [TS]</summary>
 
 ```ts
-// src/admin/app.tsx
+// src/admin/app.ts
 
 import { css } from 'styled-components';
 import { getPluginPresets } from '@_sh/strapi-plugin-ckeditor';
@@ -687,7 +687,7 @@ export default {
   <summary>Modifying theme using setPluginConfig [TS]</summary>
 
 ```ts
-// src/admin/app.tsx
+// src/admin/app.ts
 
 import { css } from 'styled-components';
 
@@ -723,7 +723,7 @@ export default {
   <summary>Modifying theme using getPluginTheme [TS]</summary>
 
 ```ts
-// src/admin/app.tsx
+// src/admin/app.ts
 
 import { css } from 'styled-components';
 import { getPluginTheme } from '@_sh/strapi-plugin-ckeditor';
@@ -849,7 +849,7 @@ for detailed instructions.
 
 Strapi **>= 5.0.0**
 
-Node **>= 18.0.0 <= 22.x.x**
+Node **>= 20.0.0 <= 24.x.x**
 
 ---
 

package/dist/_chunks/{Field-Bjfn0oud.js → Field-D_sK_Mfq.js}

@@ -30,7 +30,7 @@ const admin = require("@strapi/strapi/admin");
 const ckeditor5 = require("ckeditor5");
 const ckeditor5React = require("@ckeditor/ckeditor5-react");
 require("ckeditor5/ckeditor5.css");
-const index = require("./index-D48ig74s.js");
+const index = require("./index-V5z1nLLU.js");
 require("sanitize-html");
 const icons = require("@strapi/icons");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
@@ -349,7 +349,9 @@ const CKEReact = React__default.default.forwardRef((_, forwardedRef) => {
     const ckWrapper = document.querySelector(".ck-body-wrapper");
     const listener = ckWrapper?.addEventListener("pointerdown", (e) => e.stopPropagation(), true);
     return () => {
-      listener && ckWrapper?.removeEventListener("pointerdown", listener);
+      if (listener) {
+        ckWrapper?.removeEventListener("pointerdown", listener);
+      }
     };
   }, [editorInstance]);
   React.useImperativeHandle(
@@ -457,24 +459,44 @@ const WordCounter = styledComponents.styled(designSystem.Flex)`
 `;
 function EditorLayout({ children }) {
   const { error, preset } = useEditorContext();
-  const [isExpandedMode, handleToggleExpand] = React.useReducer((prev) => !prev, false);
-  React.useEffect(() => {
-    if (isExpandedMode) {
-      document.body.classList.add("lock-body-scroll");
+  const [isExpandedMode, setIsExpandedMode] = React.useState(false);
+  const handleToggleExpand = (open) => {
+    if (open) {
       setTimeout(() => {
+        const ckPopupsWrapper = document.querySelector(".ck-body-wrapper");
+        const ckEditorModal = document.getElementById("ck-editor-modal");
+        if (ckPopupsWrapper && ckEditorModal) {
+          ckEditorModal.appendChild(ckPopupsWrapper);
+        }
         document.querySelector(".ck-editor__expanded .ck-editor__editable")?.focus();
       }, 0);
+    } else {
+      const ckPopupsWrapper = document.querySelector(".ck-body-wrapper");
+      if (ckPopupsWrapper) {
+        document.body.appendChild(ckPopupsWrapper);
+      }
+    }
+    setIsExpandedMode(open);
+  };
+  React.useEffect(() => {
+    if (isExpandedMode) {
+      document.body.classList.add("lock-body-scroll");
     }
     return () => {
       document.body.classList.remove("lock-body-scroll");
     };
   }, [isExpandedMode]);
   if (isExpandedMode) {
-    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Root, { open: isExpandedMode, onOpenChange: handleToggleExpand, children: /* @__PURE__ */ jsxRuntime.jsx(
-      designSystem.Modal.Content,
+    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Root, { open: isExpandedMode, onOpenChange: handleToggleExpand, children: /* @__PURE__ */ jsxRuntime.jsx(Content, { id: "ck-editor-modal", children: /* @__PURE__ */ jsxRuntime.jsx(
+      designSystem.Flex,
       {
-        style: { maxWidth: "var(--ck-editor-full-screen-box-max-width)", width: "unset" },
-        children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { height: "90dvh", width: "90dvw", alignItems: "flex-start", direction: "column", children: /* @__PURE__ */ jsxRuntime.jsxs(
+        height: "90dvh",
+        width: "90dvw",
+        maxWidth: "100%",
+        direction: "column",
+        alignItems: "flex-start",
+        background: "neutral100",
+        children: /* @__PURE__ */ jsxRuntime.jsxs(
           EditorWrapper,
           {
             $presetStyles: preset?.styles,
@@ -483,12 +505,20 @@ function EditorLayout({ children }) {
             className: "ck-editor__expanded",
             children: [
               children,
-              /* @__PURE__ */ jsxRuntime.jsx(CollapseButton, { tabindex: "-1", label: "Collapse", onClick: handleToggleExpand, children: /* @__PURE__ */ jsxRuntime.jsx(icons.Collapse, {}) })
+              /* @__PURE__ */ jsxRuntime.jsx(
+                CollapseButton,
+                {
+                  tabIndex: "-1",
+                  label: "Collapse",
+                  onClick: () => handleToggleExpand(false),
+                  children: /* @__PURE__ */ jsxRuntime.jsx(icons.Collapse, {})
+                }
+              )
             ]
           }
-        ) })
+        )
       }
-    ) });
+    ) }) });
   }
   return /* @__PURE__ */ jsxRuntime.jsxs(
     EditorWrapper,
@@ -498,7 +528,7 @@ function EditorLayout({ children }) {
       $hasError: Boolean(error),
       children: [
         children,
-        /* @__PURE__ */ jsxRuntime.jsx(ExpandButton, { label: "Expand", onClick: handleToggleExpand, children: /* @__PURE__ */ jsxRuntime.jsx(icons.Expand, {}) })
+        /* @__PURE__ */ jsxRuntime.jsx(ExpandButton, { label: "Expand", onClick: () => handleToggleExpand(true), children: /* @__PURE__ */ jsxRuntime.jsx(icons.Expand, {}) })
       ]
     }
   );
@@ -540,6 +570,11 @@ const CollapseButton = styledComponents.styled(designSystem.IconButton)`
   z-index: 2;
   box-shadow: ${({ theme }) => theme.shadows.filterShadow};
 `;
+const Content = styledComponents.styled(designSystem.Modal.Content)`
+  max-width: var(--ck-editor-full-screen-box-max-width);
+  width: unset;
+  overflow: visible;
+`;
 const GlobalStyle = styledComponents.createGlobalStyle`
   ${({ $editortTheme, $variant }) => $editortTheme && styledComponents.css`
       ${$editortTheme.common}

package/dist/_chunks/{Field-C5uO1-1c.mjs → Field-SB2kmV75.mjs}

@@ -1,12 +1,12 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import React, { createContext, useContext, useState, useEffect, useMemo, useRef, useCallback, useImperativeHandle, useReducer } from "react";
+import React, { createContext, useContext, useState, useEffect, useMemo, useRef, useCallback, useImperativeHandle } from "react";
 import { Flex, IconButton, Modal, Field as Field$1, Loader, Box } from "@strapi/design-system";
 import { styled, css, createGlobalStyle } from "styled-components";
 import { useStrapiApp, useField } from "@strapi/strapi/admin";
 import { ClassicEditor } from "ckeditor5";
 import { CKEditor } from "@ckeditor/ckeditor5-react";
 import "ckeditor5/ckeditor5.css";
-import { g as getPluginConfig, p as prefixFileUrlWithBackendUrl, i as isImageResponsive } from "./index-CwLpvdFD.mjs";
+import { g as getPluginConfig, p as prefixFileUrlWithBackendUrl, i as isImageResponsive } from "./index-D6brYb_3.mjs";
 import "sanitize-html";
 import { Collapse, Expand } from "@strapi/icons";
 const STORAGE_KEYS = {
@@ -323,7 +323,9 @@ const CKEReact = React.forwardRef((_, forwardedRef) => {
     const ckWrapper = document.querySelector(".ck-body-wrapper");
     const listener = ckWrapper?.addEventListener("pointerdown", (e) => e.stopPropagation(), true);
     return () => {
-      listener && ckWrapper?.removeEventListener("pointerdown", listener);
+      if (listener) {
+        ckWrapper?.removeEventListener("pointerdown", listener);
+      }
     };
   }, [editorInstance]);
   useImperativeHandle(
@@ -431,24 +433,44 @@ const WordCounter = styled(Flex)`
 `;
 function EditorLayout({ children }) {
   const { error, preset } = useEditorContext();
-  const [isExpandedMode, handleToggleExpand] = useReducer((prev) => !prev, false);
-  useEffect(() => {
-    if (isExpandedMode) {
-      document.body.classList.add("lock-body-scroll");
+  const [isExpandedMode, setIsExpandedMode] = useState(false);
+  const handleToggleExpand = (open) => {
+    if (open) {
       setTimeout(() => {
+        const ckPopupsWrapper = document.querySelector(".ck-body-wrapper");
+        const ckEditorModal = document.getElementById("ck-editor-modal");
+        if (ckPopupsWrapper && ckEditorModal) {
+          ckEditorModal.appendChild(ckPopupsWrapper);
+        }
         document.querySelector(".ck-editor__expanded .ck-editor__editable")?.focus();
       }, 0);
+    } else {
+      const ckPopupsWrapper = document.querySelector(".ck-body-wrapper");
+      if (ckPopupsWrapper) {
+        document.body.appendChild(ckPopupsWrapper);
+      }
+    }
+    setIsExpandedMode(open);
+  };
+  useEffect(() => {
+    if (isExpandedMode) {
+      document.body.classList.add("lock-body-scroll");
     }
     return () => {
       document.body.classList.remove("lock-body-scroll");
     };
   }, [isExpandedMode]);
   if (isExpandedMode) {
-    return /* @__PURE__ */ jsx(Modal.Root, { open: isExpandedMode, onOpenChange: handleToggleExpand, children: /* @__PURE__ */ jsx(
-      Modal.Content,
+    return /* @__PURE__ */ jsx(Modal.Root, { open: isExpandedMode, onOpenChange: handleToggleExpand, children: /* @__PURE__ */ jsx(Content, { id: "ck-editor-modal", children: /* @__PURE__ */ jsx(
+      Flex,
       {
-        style: { maxWidth: "var(--ck-editor-full-screen-box-max-width)", width: "unset" },
-        children: /* @__PURE__ */ jsx(Flex, { height: "90dvh", width: "90dvw", alignItems: "flex-start", direction: "column", children: /* @__PURE__ */ jsxs(
+        height: "90dvh",
+        width: "90dvw",
+        maxWidth: "100%",
+        direction: "column",
+        alignItems: "flex-start",
+        background: "neutral100",
+        children: /* @__PURE__ */ jsxs(
           EditorWrapper,
           {
             $presetStyles: preset?.styles,
@@ -457,12 +479,20 @@ function EditorLayout({ children }) {
             className: "ck-editor__expanded",
             children: [
               children,
-              /* @__PURE__ */ jsx(CollapseButton, { tabindex: "-1", label: "Collapse", onClick: handleToggleExpand, children: /* @__PURE__ */ jsx(Collapse, {}) })
+              /* @__PURE__ */ jsx(
+                CollapseButton,
+                {
+                  tabIndex: "-1",
+                  label: "Collapse",
+                  onClick: () => handleToggleExpand(false),
+                  children: /* @__PURE__ */ jsx(Collapse, {})
+                }
+              )
             ]
           }
-        ) })
+        )
       }
-    ) });
+    ) }) });
   }
   return /* @__PURE__ */ jsxs(
     EditorWrapper,
@@ -472,7 +502,7 @@ function EditorLayout({ children }) {
       $hasError: Boolean(error),
       children: [
         children,
-        /* @__PURE__ */ jsx(ExpandButton, { label: "Expand", onClick: handleToggleExpand, children: /* @__PURE__ */ jsx(Expand, {}) })
+        /* @__PURE__ */ jsx(ExpandButton, { label: "Expand", onClick: () => handleToggleExpand(true), children: /* @__PURE__ */ jsx(Expand, {}) })
       ]
     }
   );
@@ -514,6 +544,11 @@ const CollapseButton = styled(IconButton)`
   z-index: 2;
   box-shadow: ${({ theme }) => theme.shadows.filterShadow};
 `;
+const Content = styled(Modal.Content)`
+  max-width: var(--ck-editor-full-screen-box-max-width);
+  width: unset;
+  overflow: visible;
+`;
 const GlobalStyle = createGlobalStyle`
   ${({ $editortTheme, $variant }) => $editortTheme && css`
       ${$editortTheme.common}

package/dist/_chunks/{index-CwLpvdFD.mjs → index-D6brYb_3.mjs}

@@ -6,7 +6,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Flex, lightTheme } from "@strapi/design-system";
 import cloneDeep from "lodash/cloneDeep";
 const name = "@_sh/strapi-plugin-ckeditor";
-const version = "6.0.3";
+const version = "7.0.0";
 const description = "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)";
 const keywords = [
   "strapi",
@@ -67,43 +67,45 @@ const scripts = {
   "test:ts:front": "run -T tsc -p admin/tsconfig.json",
   "test:ts:back": "run -T tsc -p server/tsconfig.json",
   release: "release-it",
-  "release:info": "release-it --changelog"
+  "release:info": "release-it --changelog",
+  "lint:ts": "eslint . --ext ts,tsx --report-unused-disable-directives",
+  "lint:ts:fix": "eslint . --ext ts,tsx --report-unused-disable-directives --fix"
 };
 const dependencies = {
-  "@ckeditor/ckeditor5-react": "~9.5.0",
-  "@strapi/design-system": "2.0.0-rc.18",
-  "@strapi/icons": "2.0.0-rc.18",
-  ckeditor5: "~45.2.0",
+  "@ckeditor/ckeditor5-react": "~11.0.1",
+  "@strapi/design-system": "2.1.2",
+  "@strapi/icons": "2.1.2",
+  ckeditor5: "~47.4.0",
   lodash: "4.17.21",
   "sanitize-html": "2.13.0",
   yup: "0.32.9"
 };
 const devDependencies = {
   "@release-it/conventional-changelog": "10.0.0",
-  "@strapi/sdk-plugin": "5.3.2",
-  "@strapi/strapi": "5.11.0",
-  "@strapi/typescript-utils": "5.11.0",
-  "@types/react": "^18.3.12",
-  "@types/react-dom": "^18.3.1",
-  "@types/sanitize-html": "2.13.0",
-  "@typescript-eslint/eslint-plugin": "7.0.0",
-  "@typescript-eslint/parser": "7.0.0",
-  eslint: "8.2.0",
-  "eslint-config-airbnb": "19.0.4",
-  "eslint-config-airbnb-typescript": "18.0.0",
-  "eslint-config-prettier": "9.1.0",
-  "eslint-plugin-import": "2.25.3",
-  "eslint-plugin-jsx-a11y": "6.10.2",
-  "eslint-plugin-prettier": "5.2.1",
-  "eslint-plugin-react": "7.28.0",
-  "eslint-plugin-react-hooks": "4.3.0",
-  prettier: "3.4.0",
-  react: "18.3.1",
-  "react-dom": "18.3.1",
-  "react-router-dom": "6.30.0",
-  "release-it": "18.1.2",
-  "styled-components": "6.1.15",
-  typescript: "5.6.3"
+  "@strapi/sdk-plugin": "5.4.0",
+  "@strapi/strapi": "5.33.4",
+  "@strapi/typescript-utils": "5.33.4",
+  "@types/react": "^18.0.0",
+  "@types/react-dom": "^18.0.0",
+  "@types/sanitize-html": "^2.13.0",
+  "@typescript-eslint/eslint-plugin": "^7.0.0",
+  "@typescript-eslint/parser": "^7.0.0",
+  eslint: "^8.2.0",
+  "eslint-config-airbnb": "^19.0.4",
+  "eslint-config-airbnb-typescript": "^18.0.0",
+  "eslint-config-prettier": "^9.1.0",
+  "eslint-plugin-import": "^2.25.3",
+  "eslint-plugin-jsx-a11y": "^6.10.2",
+  "eslint-plugin-prettier": "^5.2.1",
+  "eslint-plugin-react": "^7.28.0",
+  "eslint-plugin-react-hooks": "^4.3.0",
+  prettier: "^3.4.0",
+  "release-it": "^18.1.2",
+  typescript: "5.6.3",
+  react: "^18.0.0",
+  "react-dom": "^18.0.0",
+  "react-router-dom": "^6.0.0",
+  "styled-components": "^6.0.0"
 };
 const peerDependencies = {
   "@strapi/strapi": "^5.0.0",
@@ -113,7 +115,7 @@ const peerDependencies = {
   "styled-components": "^6.0.0"
 };
 const engines = {
-  node: ">=18.0.0 <=22.x.x",
+  node: ">=20.0.0 <=24.x.x",
   npm: ">=6.0.0"
 };
 const license = "MIT";
@@ -162,7 +164,7 @@ const colors = css`
       --ck-color-base-focus: ${theme.colors.primary200};
       --ck-color-base-active: ${theme.colors.primary500}8F;
       --ck-color-base-active-focus: ${theme.colors.primary600};
-      --ck-color-editor-base-text: ${theme.colors.neutral800};
+      --ck-content-font-color: ${theme.colors.neutral800};
       --ck-color-base-border: ${theme.colors.neutral200};
       --ck-color-base-background: ${theme.colors.neutral0};
       --ck-custom-foreground: ${theme.colors.neutral200};
@@ -248,8 +250,13 @@ const colors = css`
 
       /* -- Image ------------------------------------------------------------------------------- */
 
-      --ck-color-image-caption-background: ${theme.colors.neutral100};
-      --ck-color-image-caption-text: ${theme.colors.neutral800};
+      --ck-content-color-image-caption-background: ${theme.colors.neutral100};
+      --ck-content-color-image-caption-text: ${theme.colors.neutral800};
+
+      /* -- Table ------------------------------------------------------------------------------- */
+
+      --ck-content-color-table-caption-background: ${theme.colors.neutral100};
+      --ck-content-color-table-caption-text: ${theme.colors.neutral800};
 
       /* -- Widget ------------------------------------------------------------------------------ */
 
@@ -288,18 +295,18 @@ const dark = css`
 const reset = css`
   ${({ theme }) => css`
     .ck {
-      --ck-color-image-caption-background: hsl(0, 0%, 97%);
-      --ck-color-image-caption-text: hsl(0, 0%, 20%);
-      --ck-color-mention-background: hsla(341, 100%, 30%, 0.1);
-      --ck-color-mention-text: hsl(341, 100%, 30%);
+      --ck-content-color-image-caption-background: hsl(0, 0%, 97%);
+      --ck-content-color-image-caption-text: hsl(0, 0%, 20%);
+      --ck-content-color-mention-background: hsla(341, 100%, 30%, 0.1);
+      --ck-content-color-mention-text: hsl(341, 100%, 30%);
       --ck-color-table-caption-background: hsl(0, 0%, 97%);
       --ck-color-table-caption-text: hsl(0, 0%, 20%);
-      --ck-highlight-marker-blue: hsl(201, 97%, 72%);
-      --ck-highlight-marker-green: hsl(120, 93%, 68%);
-      --ck-highlight-marker-pink: hsl(345, 96%, 73%);
-      --ck-highlight-marker-yellow: hsl(60, 97%, 73%);
-      --ck-highlight-pen-green: hsl(112, 100%, 27%);
-      --ck-highlight-pen-red: hsl(0, 85%, 49%);
+      --ck-content-highlight-marker-blue: hsl(201, 97%, 72%);
+      --ck-content-highlight-marker-green: hsl(120, 93%, 68%);
+      --ck-content-highlight-marker-pink: hsl(345, 96%, 73%);
+      --ck-content-highlight-marker-yellow: hsl(60, 97%, 73%);
+      --ck-content-highlight-pen-green: hsl(112, 100%, 27%);
+      --ck-content-highlight-pen-red: hsl(0, 85%, 49%);
       --ck-image-style-spacing: 1.5em;
       --ck-inline-image-style-spacing: calc(var(--ck-image-style-spacing) / 2);
       --ck-todo-list-checkmark-size: 16px;
@@ -316,7 +323,6 @@ const reset = css`
       --ck-font-face: 'Source Sans Pro', system-ui, Roboto, 'Helvetica Neue', 'Helvetica', Arial,
         sans-serif;
 
-      color: var(--ck-color-editor-base-text);
       font-family: var(--ck-font-face);
 
       * {
@@ -324,41 +330,6 @@ const reset = css`
         margin: revert;
       }
 
-      h1 {
-        font-size: 2.3em;
-      }
-
-      h2 {
-        font-size: 1.84em;
-      }
-
-      h3 {
-        font-size: 1.48em;
-      }
-
-      h4 {
-        font-size: 1.22em;
-      }
-
-      h5 {
-        font-size: 1.06em;
-      }
-
-      h6 {
-        font-size: 1em;
-      }
-
-      h1,
-      h2,
-      h3,
-      h4,
-      h5,
-      h6 {
-        line-height: 1.2em;
-        padding-top: 0.8em;
-        margin-bottom: 0.4em;
-      }
-
       blockquote,
       ol,
       p,
@@ -370,9 +341,9 @@ const reset = css`
       }
 
       figcaption {
-        background-color: var(--ck-color-image-caption-background);
+        background-color: var(--ck-content-color-image-caption-background);
         caption-side: bottom;
-        color: var(--ck-color-image-caption-text);
+        color: var(--ck-content-color-image-caption-text);
         display: table-caption;
         font-size: 0.75em;
         outline-offset: -1px;
@@ -418,6 +389,11 @@ const reset = css`
       sup {
         vertical-align: super;
       }
+
+      .ck-input-text.raw-html-embed__source,
+      .ck-button.raw-html-embed__edit-button {
+        color: var(--ck-color-text);
+      }
     }
   `}
 `;
@@ -515,7 +491,7 @@ const plugin = css`
     }
 
     .ck.ck-editor__editable > .ck-placeholder::before {
-      color: var(--ck-color-editor-base-text);
+      color: var(--ck-content-font-color);
       opacity: 0.65;
     }
 
@@ -1249,7 +1225,7 @@ const index = {
         defaultMessage: "The advanced rich text editor. (Community Edition)"
       },
       components: {
-        Input: async () => import("./Field-C5uO1-1c.mjs").then((module) => ({
+        Input: async () => import("./Field-SB2kmV75.mjs").then((module) => ({
           default: module.Field
         }))
       },

package/dist/_chunks/{index-D48ig74s.js → index-V5z1nLLU.js}

@@ -28,7 +28,7 @@ const yup__namespace = /* @__PURE__ */ _interopNamespace(yup);
 const sanitizeHtml__namespace = /* @__PURE__ */ _interopNamespace(sanitizeHtml);
 const cloneDeep__default = /* @__PURE__ */ _interopDefault(cloneDeep);
 const name = "@_sh/strapi-plugin-ckeditor";
-const version = "6.0.3";
+const version = "7.0.0";
 const description = "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)";
 const keywords = [
   "strapi",
@@ -89,43 +89,45 @@ const scripts = {
   "test:ts:front": "run -T tsc -p admin/tsconfig.json",
   "test:ts:back": "run -T tsc -p server/tsconfig.json",
   release: "release-it",
-  "release:info": "release-it --changelog"
+  "release:info": "release-it --changelog",
+  "lint:ts": "eslint . --ext ts,tsx --report-unused-disable-directives",
+  "lint:ts:fix": "eslint . --ext ts,tsx --report-unused-disable-directives --fix"
 };
 const dependencies = {
-  "@ckeditor/ckeditor5-react": "~9.5.0",
-  "@strapi/design-system": "2.0.0-rc.18",
-  "@strapi/icons": "2.0.0-rc.18",
-  ckeditor5: "~45.2.0",
+  "@ckeditor/ckeditor5-react": "~11.0.1",
+  "@strapi/design-system": "2.1.2",
+  "@strapi/icons": "2.1.2",
+  ckeditor5: "~47.4.0",
   lodash: "4.17.21",
   "sanitize-html": "2.13.0",
   yup: "0.32.9"
 };
 const devDependencies = {
   "@release-it/conventional-changelog": "10.0.0",
-  "@strapi/sdk-plugin": "5.3.2",
-  "@strapi/strapi": "5.11.0",
-  "@strapi/typescript-utils": "5.11.0",
-  "@types/react": "^18.3.12",
-  "@types/react-dom": "^18.3.1",
-  "@types/sanitize-html": "2.13.0",
-  "@typescript-eslint/eslint-plugin": "7.0.0",
-  "@typescript-eslint/parser": "7.0.0",
-  eslint: "8.2.0",
-  "eslint-config-airbnb": "19.0.4",
-  "eslint-config-airbnb-typescript": "18.0.0",
-  "eslint-config-prettier": "9.1.0",
-  "eslint-plugin-import": "2.25.3",
-  "eslint-plugin-jsx-a11y": "6.10.2",
-  "eslint-plugin-prettier": "5.2.1",
-  "eslint-plugin-react": "7.28.0",
-  "eslint-plugin-react-hooks": "4.3.0",
-  prettier: "3.4.0",
-  react: "18.3.1",
-  "react-dom": "18.3.1",
-  "react-router-dom": "6.30.0",
-  "release-it": "18.1.2",
-  "styled-components": "6.1.15",
-  typescript: "5.6.3"
+  "@strapi/sdk-plugin": "5.4.0",
+  "@strapi/strapi": "5.33.4",
+  "@strapi/typescript-utils": "5.33.4",
+  "@types/react": "^18.0.0",
+  "@types/react-dom": "^18.0.0",
+  "@types/sanitize-html": "^2.13.0",
+  "@typescript-eslint/eslint-plugin": "^7.0.0",
+  "@typescript-eslint/parser": "^7.0.0",
+  eslint: "^8.2.0",
+  "eslint-config-airbnb": "^19.0.4",
+  "eslint-config-airbnb-typescript": "^18.0.0",
+  "eslint-config-prettier": "^9.1.0",
+  "eslint-plugin-import": "^2.25.3",
+  "eslint-plugin-jsx-a11y": "^6.10.2",
+  "eslint-plugin-prettier": "^5.2.1",
+  "eslint-plugin-react": "^7.28.0",
+  "eslint-plugin-react-hooks": "^4.3.0",
+  prettier: "^3.4.0",
+  "release-it": "^18.1.2",
+  typescript: "5.6.3",
+  react: "^18.0.0",
+  "react-dom": "^18.0.0",
+  "react-router-dom": "^6.0.0",
+  "styled-components": "^6.0.0"
 };
 const peerDependencies = {
   "@strapi/strapi": "^5.0.0",
@@ -135,7 +137,7 @@ const peerDependencies = {
   "styled-components": "^6.0.0"
 };
 const engines = {
-  node: ">=18.0.0 <=22.x.x",
+  node: ">=20.0.0 <=24.x.x",
   npm: ">=6.0.0"
 };
 const license = "MIT";
@@ -184,7 +186,7 @@ const colors = styledComponents.css`
       --ck-color-base-focus: ${theme.colors.primary200};
       --ck-color-base-active: ${theme.colors.primary500}8F;
       --ck-color-base-active-focus: ${theme.colors.primary600};
-      --ck-color-editor-base-text: ${theme.colors.neutral800};
+      --ck-content-font-color: ${theme.colors.neutral800};
       --ck-color-base-border: ${theme.colors.neutral200};
       --ck-color-base-background: ${theme.colors.neutral0};
       --ck-custom-foreground: ${theme.colors.neutral200};
@@ -270,8 +272,13 @@ const colors = styledComponents.css`
 
       /* -- Image ------------------------------------------------------------------------------- */
 
-      --ck-color-image-caption-background: ${theme.colors.neutral100};
-      --ck-color-image-caption-text: ${theme.colors.neutral800};
+      --ck-content-color-image-caption-background: ${theme.colors.neutral100};
+      --ck-content-color-image-caption-text: ${theme.colors.neutral800};
+
+      /* -- Table ------------------------------------------------------------------------------- */
+
+      --ck-content-color-table-caption-background: ${theme.colors.neutral100};
+      --ck-content-color-table-caption-text: ${theme.colors.neutral800};
 
       /* -- Widget ------------------------------------------------------------------------------ */
 
@@ -310,18 +317,18 @@ const dark = styledComponents.css`
 const reset = styledComponents.css`
   ${({ theme }) => styledComponents.css`
     .ck {
-      --ck-color-image-caption-background: hsl(0, 0%, 97%);
-      --ck-color-image-caption-text: hsl(0, 0%, 20%);
-      --ck-color-mention-background: hsla(341, 100%, 30%, 0.1);
-      --ck-color-mention-text: hsl(341, 100%, 30%);
+      --ck-content-color-image-caption-background: hsl(0, 0%, 97%);
+      --ck-content-color-image-caption-text: hsl(0, 0%, 20%);
+      --ck-content-color-mention-background: hsla(341, 100%, 30%, 0.1);
+      --ck-content-color-mention-text: hsl(341, 100%, 30%);
       --ck-color-table-caption-background: hsl(0, 0%, 97%);
       --ck-color-table-caption-text: hsl(0, 0%, 20%);
-      --ck-highlight-marker-blue: hsl(201, 97%, 72%);
-      --ck-highlight-marker-green: hsl(120, 93%, 68%);
-      --ck-highlight-marker-pink: hsl(345, 96%, 73%);
-      --ck-highlight-marker-yellow: hsl(60, 97%, 73%);
-      --ck-highlight-pen-green: hsl(112, 100%, 27%);
-      --ck-highlight-pen-red: hsl(0, 85%, 49%);
+      --ck-content-highlight-marker-blue: hsl(201, 97%, 72%);
+      --ck-content-highlight-marker-green: hsl(120, 93%, 68%);
+      --ck-content-highlight-marker-pink: hsl(345, 96%, 73%);
+      --ck-content-highlight-marker-yellow: hsl(60, 97%, 73%);
+      --ck-content-highlight-pen-green: hsl(112, 100%, 27%);
+      --ck-content-highlight-pen-red: hsl(0, 85%, 49%);
       --ck-image-style-spacing: 1.5em;
       --ck-inline-image-style-spacing: calc(var(--ck-image-style-spacing) / 2);
       --ck-todo-list-checkmark-size: 16px;
@@ -338,7 +345,6 @@ const reset = styledComponents.css`
       --ck-font-face: 'Source Sans Pro', system-ui, Roboto, 'Helvetica Neue', 'Helvetica', Arial,
         sans-serif;
 
-      color: var(--ck-color-editor-base-text);
       font-family: var(--ck-font-face);
 
       * {
@@ -346,41 +352,6 @@ const reset = styledComponents.css`
         margin: revert;
       }
 
-      h1 {
-        font-size: 2.3em;
-      }
-
-      h2 {
-        font-size: 1.84em;
-      }
-
-      h3 {
-        font-size: 1.48em;
-      }
-
-      h4 {
-        font-size: 1.22em;
-      }
-
-      h5 {
-        font-size: 1.06em;
-      }
-
-      h6 {
-        font-size: 1em;
-      }
-
-      h1,
-      h2,
-      h3,
-      h4,
-      h5,
-      h6 {
-        line-height: 1.2em;
-        padding-top: 0.8em;
-        margin-bottom: 0.4em;
-      }
-
       blockquote,
       ol,
       p,
@@ -392,9 +363,9 @@ const reset = styledComponents.css`
       }
 
       figcaption {
-        background-color: var(--ck-color-image-caption-background);
+        background-color: var(--ck-content-color-image-caption-background);
         caption-side: bottom;
-        color: var(--ck-color-image-caption-text);
+        color: var(--ck-content-color-image-caption-text);
         display: table-caption;
         font-size: 0.75em;
         outline-offset: -1px;
@@ -440,6 +411,11 @@ const reset = styledComponents.css`
       sup {
         vertical-align: super;
       }
+
+      .ck-input-text.raw-html-embed__source,
+      .ck-button.raw-html-embed__edit-button {
+        color: var(--ck-color-text);
+      }
     }
   `}
 `;
@@ -537,7 +513,7 @@ const plugin = styledComponents.css`
     }
 
     .ck.ck-editor__editable > .ck-placeholder::before {
-      color: var(--ck-color-editor-base-text);
+      color: var(--ck-content-font-color);
       opacity: 0.65;
     }
 
@@ -1271,7 +1247,7 @@ const index = {
         defaultMessage: "The advanced rich text editor. (Community Edition)"
       },
       components: {
-        Input: async () => Promise.resolve().then(() => require("./Field-Bjfn0oud.js")).then((module2) => ({
+        Input: async () => Promise.resolve().then(() => require("./Field-D_sK_Mfq.js")).then((module2) => ({
           default: module2.Field
         }))
       },

package/dist/admin/index.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 require("yup");
-const index = require("../_chunks/index-D48ig74s.js");
+const index = require("../_chunks/index-V5z1nLLU.js");
 require("ckeditor5");
 require("sanitize-html");
 exports.StrapiMediaLib = index.StrapiMediaLib;

package/dist/admin/index.mjs

@@ -1,5 +1,5 @@
 import "yup";
-import { S, h, a, b, d, c, e, f, s } from "../_chunks/index-CwLpvdFD.mjs";
+import { S, h, a, b, d, c, e, f, s } from "../_chunks/index-D6brYb_3.mjs";
 import "ckeditor5";
 import "sanitize-html";
 export {

package/dist/server/index.js

@@ -1,6 +1,6 @@
 "use strict";
 const name = "@_sh/strapi-plugin-ckeditor";
-const version = "6.0.3";
+const version = "7.0.0";
 const description = "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)";
 const keywords = [
   "strapi",
@@ -61,43 +61,45 @@ const scripts = {
   "test:ts:front": "run -T tsc -p admin/tsconfig.json",
   "test:ts:back": "run -T tsc -p server/tsconfig.json",
   release: "release-it",
-  "release:info": "release-it --changelog"
+  "release:info": "release-it --changelog",
+  "lint:ts": "eslint . --ext ts,tsx --report-unused-disable-directives",
+  "lint:ts:fix": "eslint . --ext ts,tsx --report-unused-disable-directives --fix"
 };
 const dependencies = {
-  "@ckeditor/ckeditor5-react": "~9.5.0",
-  "@strapi/design-system": "2.0.0-rc.18",
-  "@strapi/icons": "2.0.0-rc.18",
-  ckeditor5: "~45.2.0",
+  "@ckeditor/ckeditor5-react": "~11.0.1",
+  "@strapi/design-system": "2.1.2",
+  "@strapi/icons": "2.1.2",
+  ckeditor5: "~47.4.0",
   lodash: "4.17.21",
   "sanitize-html": "2.13.0",
   yup: "0.32.9"
 };
 const devDependencies = {
   "@release-it/conventional-changelog": "10.0.0",
-  "@strapi/sdk-plugin": "5.3.2",
-  "@strapi/strapi": "5.11.0",
-  "@strapi/typescript-utils": "5.11.0",
-  "@types/react": "^18.3.12",
-  "@types/react-dom": "^18.3.1",
-  "@types/sanitize-html": "2.13.0",
-  "@typescript-eslint/eslint-plugin": "7.0.0",
-  "@typescript-eslint/parser": "7.0.0",
-  eslint: "8.2.0",
-  "eslint-config-airbnb": "19.0.4",
-  "eslint-config-airbnb-typescript": "18.0.0",
-  "eslint-config-prettier": "9.1.0",
-  "eslint-plugin-import": "2.25.3",
-  "eslint-plugin-jsx-a11y": "6.10.2",
-  "eslint-plugin-prettier": "5.2.1",
-  "eslint-plugin-react": "7.28.0",
-  "eslint-plugin-react-hooks": "4.3.0",
-  prettier: "3.4.0",
-  react: "18.3.1",
-  "react-dom": "18.3.1",
-  "react-router-dom": "6.30.0",
-  "release-it": "18.1.2",
-  "styled-components": "6.1.15",
-  typescript: "5.6.3"
+  "@strapi/sdk-plugin": "5.4.0",
+  "@strapi/strapi": "5.33.4",
+  "@strapi/typescript-utils": "5.33.4",
+  "@types/react": "^18.0.0",
+  "@types/react-dom": "^18.0.0",
+  "@types/sanitize-html": "^2.13.0",
+  "@typescript-eslint/eslint-plugin": "^7.0.0",
+  "@typescript-eslint/parser": "^7.0.0",
+  eslint: "^8.2.0",
+  "eslint-config-airbnb": "^19.0.4",
+  "eslint-config-airbnb-typescript": "^18.0.0",
+  "eslint-config-prettier": "^9.1.0",
+  "eslint-plugin-import": "^2.25.3",
+  "eslint-plugin-jsx-a11y": "^6.10.2",
+  "eslint-plugin-prettier": "^5.2.1",
+  "eslint-plugin-react": "^7.28.0",
+  "eslint-plugin-react-hooks": "^4.3.0",
+  prettier: "^3.4.0",
+  "release-it": "^18.1.2",
+  typescript: "5.6.3",
+  react: "^18.0.0",
+  "react-dom": "^18.0.0",
+  "react-router-dom": "^6.0.0",
+  "styled-components": "^6.0.0"
 };
 const peerDependencies = {
   "@strapi/strapi": "^5.0.0",
@@ -107,7 +109,7 @@ const peerDependencies = {
   "styled-components": "^6.0.0"
 };
 const engines = {
-  node: ">=18.0.0 <=22.x.x",
+  node: ">=20.0.0 <=24.x.x",
   npm: ">=6.0.0"
 };
 const license = "MIT";

package/dist/server/index.mjs

@@ -1,5 +1,5 @@
 const name = "@_sh/strapi-plugin-ckeditor";
-const version = "6.0.3";
+const version = "7.0.0";
 const description = "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)";
 const keywords = [
   "strapi",
@@ -60,43 +60,45 @@ const scripts = {
   "test:ts:front": "run -T tsc -p admin/tsconfig.json",
   "test:ts:back": "run -T tsc -p server/tsconfig.json",
   release: "release-it",
-  "release:info": "release-it --changelog"
+  "release:info": "release-it --changelog",
+  "lint:ts": "eslint . --ext ts,tsx --report-unused-disable-directives",
+  "lint:ts:fix": "eslint . --ext ts,tsx --report-unused-disable-directives --fix"
 };
 const dependencies = {
-  "@ckeditor/ckeditor5-react": "~9.5.0",
-  "@strapi/design-system": "2.0.0-rc.18",
-  "@strapi/icons": "2.0.0-rc.18",
-  ckeditor5: "~45.2.0",
+  "@ckeditor/ckeditor5-react": "~11.0.1",
+  "@strapi/design-system": "2.1.2",
+  "@strapi/icons": "2.1.2",
+  ckeditor5: "~47.4.0",
   lodash: "4.17.21",
   "sanitize-html": "2.13.0",
   yup: "0.32.9"
 };
 const devDependencies = {
   "@release-it/conventional-changelog": "10.0.0",
-  "@strapi/sdk-plugin": "5.3.2",
-  "@strapi/strapi": "5.11.0",
-  "@strapi/typescript-utils": "5.11.0",
-  "@types/react": "^18.3.12",
-  "@types/react-dom": "^18.3.1",
-  "@types/sanitize-html": "2.13.0",
-  "@typescript-eslint/eslint-plugin": "7.0.0",
-  "@typescript-eslint/parser": "7.0.0",
-  eslint: "8.2.0",
-  "eslint-config-airbnb": "19.0.4",
-  "eslint-config-airbnb-typescript": "18.0.0",
-  "eslint-config-prettier": "9.1.0",
-  "eslint-plugin-import": "2.25.3",
-  "eslint-plugin-jsx-a11y": "6.10.2",
-  "eslint-plugin-prettier": "5.2.1",
-  "eslint-plugin-react": "7.28.0",
-  "eslint-plugin-react-hooks": "4.3.0",
-  prettier: "3.4.0",
-  react: "18.3.1",
-  "react-dom": "18.3.1",
-  "react-router-dom": "6.30.0",
-  "release-it": "18.1.2",
-  "styled-components": "6.1.15",
-  typescript: "5.6.3"
+  "@strapi/sdk-plugin": "5.4.0",
+  "@strapi/strapi": "5.33.4",
+  "@strapi/typescript-utils": "5.33.4",
+  "@types/react": "^18.0.0",
+  "@types/react-dom": "^18.0.0",
+  "@types/sanitize-html": "^2.13.0",
+  "@typescript-eslint/eslint-plugin": "^7.0.0",
+  "@typescript-eslint/parser": "^7.0.0",
+  eslint: "^8.2.0",
+  "eslint-config-airbnb": "^19.0.4",
+  "eslint-config-airbnb-typescript": "^18.0.0",
+  "eslint-config-prettier": "^9.1.0",
+  "eslint-plugin-import": "^2.25.3",
+  "eslint-plugin-jsx-a11y": "^6.10.2",
+  "eslint-plugin-prettier": "^5.2.1",
+  "eslint-plugin-react": "^7.28.0",
+  "eslint-plugin-react-hooks": "^4.3.0",
+  prettier: "^3.4.0",
+  "release-it": "^18.1.2",
+  typescript: "5.6.3",
+  react: "^18.0.0",
+  "react-dom": "^18.0.0",
+  "react-router-dom": "^6.0.0",
+  "styled-components": "^6.0.0"
 };
 const peerDependencies = {
   "@strapi/strapi": "^5.0.0",
@@ -106,7 +108,7 @@ const peerDependencies = {
   "styled-components": "^6.0.0"
 };
 const engines = {
-  node: ">=18.0.0 <=22.x.x",
+  node: ">=20.0.0 <=24.x.x",
   npm: ">=6.0.0"
 };
 const license = "MIT";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@_sh/strapi-plugin-ckeditor",
-  "version": "6.0.3",
+  "version": "7.0.0",
   "description": "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Community Edition)",
   "keywords": [
     "strapi",
@@ -61,43 +61,45 @@
     "test:ts:front": "run -T tsc -p admin/tsconfig.json",
     "test:ts:back": "run -T tsc -p server/tsconfig.json",
     "release": "release-it",
-    "release:info": "release-it --changelog"
+    "release:info": "release-it --changelog",
+    "lint:ts": "eslint . --ext ts,tsx --report-unused-disable-directives",
+    "lint:ts:fix": "eslint . --ext ts,tsx --report-unused-disable-directives --fix"
   },
   "dependencies": {
-    "@ckeditor/ckeditor5-react": "~9.5.0",
-    "@strapi/design-system": "2.0.0-rc.18",
-    "@strapi/icons": "2.0.0-rc.18",
-    "ckeditor5": "~45.2.0",
+    "@ckeditor/ckeditor5-react": "~11.0.1",
+    "@strapi/design-system": "2.1.2",
+    "@strapi/icons": "2.1.2",
+    "ckeditor5": "~47.4.0",
     "lodash": "4.17.21",
     "sanitize-html": "2.13.0",
     "yup": "0.32.9"
   },
   "devDependencies": {
     "@release-it/conventional-changelog": "10.0.0",
-    "@strapi/sdk-plugin": "5.3.2",
-    "@strapi/strapi": "5.11.0",
-    "@strapi/typescript-utils": "5.11.0",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
-    "@types/sanitize-html": "2.13.0",
-    "@typescript-eslint/eslint-plugin": "7.0.0",
-    "@typescript-eslint/parser": "7.0.0",
-    "eslint": "8.2.0",
-    "eslint-config-airbnb": "19.0.4",
-    "eslint-config-airbnb-typescript": "18.0.0",
-    "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-import": "2.25.3",
-    "eslint-plugin-jsx-a11y": "6.10.2",
-    "eslint-plugin-prettier": "5.2.1",
-    "eslint-plugin-react": "7.28.0",
-    "eslint-plugin-react-hooks": "4.3.0",
-    "prettier": "3.4.0",
-    "react": "18.3.1",
-    "react-dom": "18.3.1",
-    "react-router-dom": "6.30.0",
-    "release-it": "18.1.2",
-    "styled-components": "6.1.15",
-    "typescript": "5.6.3"
+    "@strapi/sdk-plugin": "5.4.0",
+    "@strapi/strapi": "5.33.4",
+    "@strapi/typescript-utils": "5.33.4",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
+    "@types/sanitize-html": "^2.13.0",
+    "@typescript-eslint/eslint-plugin": "^7.0.0",
+    "@typescript-eslint/parser": "^7.0.0",
+    "eslint": "^8.2.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-airbnb-typescript": "^18.0.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-import": "^2.25.3",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-prettier": "^5.2.1",
+    "eslint-plugin-react": "^7.28.0",
+    "eslint-plugin-react-hooks": "^4.3.0",
+    "prettier": "^3.4.0",
+    "release-it": "^18.1.2",
+    "typescript": "5.6.3",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "react-router-dom": "^6.0.0",
+    "styled-components": "^6.0.0"
   },
   "peerDependencies": {
     "@strapi/strapi": "^5.0.0",
@@ -107,7 +109,7 @@
     "styled-components": "^6.0.0"
   },
   "engines": {
-    "node": ">=18.0.0 <=22.x.x",
+    "node": ">=20.0.0 <=24.x.x",
     "npm": ">=6.0.0"
   },
   "license": "MIT"