chore: update type and function descriptions, rename CSS to EditorSty…

…les, add missing line in setPluginConfig

admin/src/components/EditorLayout.tsx

@@ -3,7 +3,7 @@ import { Box, Flex, IconButton, FocusTrap, Portal } from '@strapi/design-system'
 import { Expand, Collapse } from '@strapi/icons';
 import { css, styled } from 'styled-components';
 
-import type { CSS } from '../config';
+import type { EditorStyles } from '../config';
 import { useEditorContext } from './EditorProvider';
 
 export function EditorLayout({ children }: { children: ReactNode }) {
@@ -85,7 +85,7 @@ export function EditorLayout({ children }: { children: ReactNode }) {
 const EditorWrapper = styled('div')<{
   $isExpanded: boolean;
   $hasError: boolean;
-  $presetStyles?: CSS;
+  $presetStyles?: EditorStyles;
 }>`
   position: relative;
   width: 100%;

admin/src/components/GlobalStyling.tsx

@@ -2,12 +2,12 @@ import React from 'react';
 import { createGlobalStyle, css } from 'styled-components';
 
 import { getProfileTheme } from '../utils';
-import { type Theme, type CSS, getPluginConfig } from '../config';
+import { type Theme, type EditorStyles, getPluginConfig } from '../config';
 
 const GlobalStyle = createGlobalStyle<{
   $editortTheme?: Theme;
   $variant: 'light' | 'dark';
-  $presetStyles?: CSS;
+  $presetStyles?: EditorStyles;
 }>`
   ${({ $editortTheme, $variant }) =>
     $editortTheme &&

admin/src/config/language.ts

@@ -5,6 +5,19 @@ import { getPreferedLanguage } from '../utils/localStorage';
 
 const TRANSLATIONS: Record<string, Translations> = {};
 
+/**
+ * Sets the language property for the provided editor configuration and loads translations.
+ *
+ * @internal
+ *
+ * @remarks
+ *
+ * - UI language: If the language is not set, it defaults to the admin's preferred language, falling
+ * back to 'en'. If the language is other than 'en', the CKEditor translation will be loaded.
+ *
+ * - Content language: Checks whether the field is localized (`isFieldLocalized`) and applies
+ * the determined i18n language accordingly.
+ */
 export async function setUpLanguage(
   config: EditorConfig,
   isFieldLocalized: boolean

admin/src/config/pluginConfig.ts

@@ -17,31 +17,37 @@ const PLUGIN_CONFIG: PluginConfig = {
  * @remarks
  *
  * - The function must be invoked before the admin panel's bootstrap lifecycle function.
+ * The general recommendation is to call it inside the admin panel's register lifecycle function.
  *
- * - Provided objects will overwrite the default configuration values.
+ * - Provided properties will overwrite the default configuration values.
  *
- * - The provided configuration will be frozen after the first invocation, preventing further modifications.
+ * - The configuration becomes immutable after the first invocation, preventing further
+ * modifications.
  *
- * @param userConfig - The configuration object provided by the user.
- *
- * @public
+ * @param userConfig - The plugin configuration object.
  */
-export function setPluginConfig(userConfig: UserPluginConfig): void {
-  const { presets, theme } = userConfig || {};
+export function setPluginConfig(userPluginConfig: UserPluginConfig): void {
+  const { presets: userPresets, theme: userTheme } = userPluginConfig || {};
 
-  if (presets) {
-    presets.forEach(preset => {
+  if (userPresets) {
+    PLUGIN_CONFIG.presets = {};
+    userPresets.forEach(preset => {
       PLUGIN_CONFIG.presets[preset.name] = preset;
     });
   }
 
-  if (theme) {
-    PLUGIN_CONFIG.theme = theme;
+  if (userTheme) {
+    PLUGIN_CONFIG.theme = userTheme;
   }
 
   deepFreeze(PLUGIN_CONFIG);
 }
 
+/**
+ * Retrieves the current plugin configuration, ensuring it is immutable.
+ *
+ * @internal
+ */
 export function getPluginConfig(): PluginConfig {
   if (!Object.isFrozen(PLUGIN_CONFIG)) deepFreeze(PLUGIN_CONFIG);
   return PLUGIN_CONFIG;

admin/src/config/types.ts

@@ -2,6 +2,8 @@ import type { EditorConfig as CKE5EditorConfig } from 'ckeditor5';
 import type { Interpolation } from 'styled-components';
 
 /**
+ * Plugin configuration object.
+ *
  * @internal
  */
 export type PluginConfig = {
@@ -12,9 +14,9 @@ export type PluginConfig = {
 /**
  * Used to register a preset option in the admin panel.
  *
- * @see {@link https://docs.strapi.io/dev-docs/custom-fields#options | Strapi documentation}
- *
  * @internal
+ *
+ * @see {@link https://docs.strapi.io/dev-docs/custom-fields#options | Strapi documentation}
  */
 export type Option = {
   metadatas: Metadatas;
@@ -30,9 +32,9 @@ export type Option = {
 /**
  * Used to register a preset option in the admin panel.
  *
- * @see {@link https://docs.strapi.io/dev-docs/custom-fields#options | Strapi documentation}
- *
  * @internal
+ *
+ * @see {@link https://docs.strapi.io/dev-docs/custom-fields#options | Strapi documentation}
  */
 export type Metadatas = {
   intlLabel: IntlLabel;
@@ -41,9 +43,9 @@ export type Metadatas = {
 /**
  * Used to register a preset option in the admin panel.
  *
- * @see {@link https://docs.strapi.io/dev-docs/custom-fields#options | Strapi documentation}
- *
  * @internal
+ *
+ * @see {@link https://docs.strapi.io/dev-docs/custom-fields#options | Strapi documentation}
  */
 export type IntlLabel = {
   id: string;
@@ -52,9 +54,12 @@ export type IntlLabel = {
 };
 
 /**
- * @public
+ * Plugin configuration object.
  */
 export type UserPluginConfig = {
+  /**
+   * Presets are sets of settings that define the editor's features and appearance.
+   */
   presets?: Preset[];
   /**
    * Styles applied globally to every editor instance.
@@ -63,63 +68,65 @@ export type UserPluginConfig = {
 };
 
 /**
- * @public
+ * Styles applied globally to every editor instance.
+ *
+ * @remarks
+ *
+ * The `common` styles are applied first, followed by `light` or `dark` styles
+ * according to the preferences, and finally `additional` styles.
  */
 export type Theme = {
   /**
    * Core styles.
    */
-  common?: CSS;
+  common?: EditorStyles;
   /**
    * Styles apllied in light mode.
    */
-  light?: CSS;
+  light?: EditorStyles;
   /**
    * Styles apllied in dark mode.
    */
-  dark?: CSS;
+  dark?: EditorStyles;
   /**
    * Additional styles that complement the theme.
    */
-  additional?: CSS;
+  additional?: EditorStyles;
 };
 
 /**
- * CSS, can either be a string or an array of interpolated objects.
- *
- * @public
+ * Represents styles that can be applied to an editor instance.
+ * Can be a plain CSS string or an array of interpolations for dynamic styling.
  */
-export type CSS = string | Interpolation<object>[];
+export type EditorStyles = string | Interpolation<object>[];
 
 /**
- * @public
+ * Preset is a set of settings that define the editor's features and appearance.
  */
 export type Preset = {
   /**
-   * Preset name, will be shown in the schema.
+   * Preset name, displayed in the schema.
    */
   name: string;
   /**
-   * Preset description, will be shown in the content-type builder.
+   * Preset description, displayed in the Content-Type Builder.
    */
   description: string;
   /**
-   * Styles applied to the editor instance in addition to the theme.
+   * Additional styles applied to the editor instance after the theme styles.
    */
-  styles?: CSS;
+  styles?: EditorStyles;
   /**
-   * CKEditor configuration.
+   * CKEditor configuration object.
    *
    * @see {@link https://ckeditor.com/docs/ckeditor5/latest/getting-started/setup/configuration.html | CKEditor documentation}
    */
   editorConfig: EditorConfig;
 };
 
 /**
- * CKEditor configuration.
+ * CKEditor configuration object.
  *
  * @see {@link https://ckeditor.com/docs/ckeditor5/latest/getting-started/setup/configuration.html | CKEditor documentation}
- *
- * @public
  */
 export type EditorConfig = CKE5EditorConfig;

admin/src/exports.ts

@@ -16,7 +16,7 @@ export type {
   EditorConfig,
   Preset,
   Theme,
-  CSS,
+  EditorStyles,
 } from './config/types';
 
 export { setPluginConfig } from './config';