@_sh/strapi-plugin-ckeditor 3.0.4 → 3.0.6

package/admin/src/Input/components/Editor.js

@@ -20,6 +20,7 @@ export const Editor = ({
   disabled = false,
   presetName,
   maxLength,
+  placeholder
 }) => {
   const [editorInstance, setEditorInstance] = useState(false);
 
@@ -42,7 +43,20 @@ export const Editor = ({
         presetName,
         handleToggleMediaLib
       );
-      setPreset(currentPreset);
+
+      if (placeholder) {
+        const clonedPreset = {
+          ...currentPreset,
+          editorConfig: {
+            ...currentPreset.editorConfig,
+            placeholder: placeholder.defaultMessage,
+          },
+        };
+        
+        setPreset(clonedPreset);
+      } else {
+        setPreset(currentPreset);
+      }
     })();
   }, []);
 

package/admin/src/Input/config/language.js

@@ -17,29 +17,26 @@ const detecti18n = () => {
 
 export const setLanguage = async (config) => {
   const i18nLang = detecti18n();
+
   const preferedLanguage = auth.getUserInfo().preferedLanguage || 'en';
 
   const {
-    ui = preferedLanguage,
-    content,
+    ui = config.language && typeof config.language === 'string' ?
+      config.language
+    : preferedLanguage,
     textPartLanguage,
     ignorei18n,
   } = config.language || {};
 
-  if (i18nLang) {
+  if (i18nLang && !ignorei18n) {
     config.language = {
-      ui: typeof config.language === 'string' ? config.language : ui,
-      content: ignorei18n ? content : i18nLang,
+      ui: ui,
+      content: i18nLang,
       textPartLanguage: textPartLanguage,
     };
   }
 
-  if (!config.language) {
-    config.language = preferedLanguage;
+  if (ui !== 'en') {
+    await importLang(config, ui);
   }
-
-  await importLang(
-    config,
-    typeof config.language === 'string' ? config.language : ui
-  );
 };

package/admin/src/Input/config/styling.js

@@ -14,7 +14,7 @@ const getSystemColorScheme = () =>
     ? 'dark'
     : 'light';
 
-export const GlobalStyling = () => {
+const GlobalStyling = () => {
   const { theme: userTheme, dontMergeTheme } = globalThis.SH_CKE_CONFIG || {};
 
   const profileTheme = localStorage.getItem('STRAPI_THEME');
@@ -28,3 +28,7 @@ export const GlobalStyling = () => {
 
   return <GlobalStyle theme={theme} variant={variant} />;
 };
+
+const MemoizedGlobalStyling = React.memo(GlobalStyling);
+
+export { MemoizedGlobalStyling as GlobalStyling };

package/admin/src/Input/index.js

@@ -11,19 +11,19 @@ import { Stack } from '@strapi/design-system';
 
 import { Editor } from './components/Editor';
 
-const Wysiwyg = React.forwardRef((props, ref) => {
-  const {
-    name,
-    attribute,
-    onChange,
-    value,
-    intlLabel,
-    labelAction,
-    disabled,
-    error,
-    description,
-    required,
-  } = props;
+const Wysiwyg = ({
+  name,
+  attribute,
+  onChange,
+  value,
+  intlLabel,
+  labelAction,
+  disabled,
+  error,
+  description,
+  required,
+  placeholder,
+}) => {
   const { formatMessage } = useIntl();
   const { preset, maxLengthCharacters, ...options } = attribute.options;
 
@@ -44,13 +44,14 @@ const Wysiwyg = React.forwardRef((props, ref) => {
           value={value}
           presetName={preset}
           maxLength={maxLengthCharacters}
+          placeholder={placeholder}
         />
         <FieldHint />
         <FieldError />
       </Stack>
     </Field>
   );
-});
+};
 
 Wysiwyg.propTypes = {
   intlLabel: PropTypes.object.isRequired,
@@ -63,5 +64,9 @@ Wysiwyg.propTypes = {
   labelAction: PropTypes.object,
   required: PropTypes.bool,
   value: PropTypes.string,
+  placeholder: PropTypes.object,
 };
-export default Wysiwyg;
+
+const MemoizedWysiwyg = React.memo(Wysiwyg);
+
+export default MemoizedWysiwyg;

package/admin/src/Input/theme/common.js

@@ -227,4 +227,9 @@ export const common = css`
       }
     }
   }
+
+  .ck.ck-editor__editable > .ck-placeholder::before {
+    color: var(--ck-color-editor-base-text);
+    opacity: 0.65;
+  }
 `;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@_sh/strapi-plugin-ckeditor",
-  "version": "3.0.4",
+  "version": "3.0.6",
   "description": "Integrates CKEditor 5 into your Strapi project as a fully customizable custom field. (Unofficial integration)",
   "private": false,
   "keywords": [

package/server/services/config.js

@@ -1,25 +1,43 @@
-"use strict";
+'use strict';
 
-const fs = require("fs");
+const fs = require('fs');
 
 module.exports = ({ strapi }) => {
+  const readConfigFile = () => {
+    const appDir = process.cwd();
+    const isTSProject = fs.existsSync(`${appDir}/dist`);
+    const envName = process.env.NODE_ENV;
+
+    const cfgDir = isTSProject ? `${appDir}/dist/config` : `${appDir}/config`;
+    const cfgFileName = 'ckeditor.js';
+
+    const envFilePath = `${cfgDir}/env/${envName}/${cfgFileName}`;
+    const baseFilePath = `${cfgDir}/${cfgFileName}`;
+
+    if (fs.existsSync(envFilePath)) {
+      return fs.readFileSync(envFilePath, 'utf8');
+    } else if (fs.existsSync(baseFilePath)) {
+      return fs.readFileSync(baseFilePath, 'utf8');
+    } else {
+      return null;
+    }
+  };
+
+  const trimConfig = (str) => {
+    for (const func of ['const CKEConfig', 'function CKEConfig']) {
+      const idx = str.indexOf(func);
+      if (idx >= 0) {
+        return str.substring(idx) + `\nglobalThis.SH_CKE_CONFIG = CKEConfig()`;
+      }
+    }
+  };
+
   return {
     getConfig() {
-      const appDir = process.cwd();
-
-      const fileName = "ckeditor";
-
-      for (const ext of ["js", "ts"]) {
-        const filePath = `${appDir}/config/${fileName}.${ext}`;
-        if (fs.existsSync(filePath)) {
-          return (
-            fs.readFileSync(filePath, "utf8") +
-            `\nglobalThis.SH_CKE_CONFIG = CKEConfig()`
-          );
-        }
-      }
+      const configFileContent = readConfigFile();
+      const config = configFileContent && trimConfig(configFileContent);
 
-      return `globalThis.SH_CKE_CONFIG = null`;
+      return config || `globalThis.SH_CKE_CONFIG = null`;
     },
   };
 };