@ckeditor/ckeditor5-ckbox 44.3.0-alpha.7 → 45.0.0-alpha.0

package/dist/translations/be.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+ */
+
+import type { Translations } from '@ckeditor/ckeditor5-utils';
+declare const translations: Translations;
+export default translations;

package/dist/translations/be.js

@@ -0,0 +1,5 @@
+/**
+ * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+ */
+export default {"be":{"dictionary":{"Open file manager":"Адкрыць менеджэр файлаў","Cannot determine a category for the uploaded file.":"Немагчыма вызначыць катэгорыю для запампаванага файла.","Cannot access default workspace.":"Немагчыма атрымаць доступ да прадвызначанай працоўнай прасторы.","You have no image editing permissions.":"У вас няма дозволу на рэдагаванне відарыса.","Edit image":"Рэдагаваць відарыс","Processing the edited image.":"Апрацоўка адрэдагаванага відарыса.","Server failed to process the image.":"Сервер не здольны апрацаваць відарыс.","Failed to determine category of edited image.":"Не здольны вызначыць катэгорыю адрэдагаванага відарыса."},getPluralForm(n){return (n % 10 == 1 && n % 100 != 11 ? 0 : n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);}}}

package/dist/translations/be.umd.js

@@ -0,0 +1,11 @@
+/**
+ * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+ */
+
+( e => {
+const { [ 'be' ]: { dictionary, getPluralForm } } = {"be":{"dictionary":{"Open file manager":"Адкрыць менеджэр файлаў","Cannot determine a category for the uploaded file.":"Немагчыма вызначыць катэгорыю для запампаванага файла.","Cannot access default workspace.":"Немагчыма атрымаць доступ да прадвызначанай працоўнай прасторы.","You have no image editing permissions.":"У вас няма дозволу на рэдагаванне відарыса.","Edit image":"Рэдагаваць відарыс","Processing the edited image.":"Апрацоўка адрэдагаванага відарыса.","Server failed to process the image.":"Сервер не здольны апрацаваць відарыс.","Failed to determine category of edited image.":"Не здольны вызначыць катэгорыю адрэдагаванага відарыса."},getPluralForm(n){return (n % 10 == 1 && n % 100 != 11 ? 0 : n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);}}};
+e[ 'be' ] ||= { dictionary: {}, getPluralForm: null };
+e[ 'be' ].dictionary = Object.assign( e[ 'be' ].dictionary, dictionary );
+e[ 'be' ].getPluralForm = getPluralForm;
+} )( window.CKEDITOR_TRANSLATIONS ||= {} );

package/lang/translations/be.po

@@ -0,0 +1,44 @@
+# Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
+#
+# Want to contribute to this file? Submit your changes via a GitHub Pull Request.
+#
+# Check out the official contributor's guide:
+# https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
+msgid ""
+msgstr ""
+"Language: be\n"
+"Plural-Forms: nplurals=3; plural=(n % 10 == 1 && n % 100 != 11 ? 0 : n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+
+msgctxt "A toolbar button tooltip for opening the file browser that allows inserting an image or a file to the editor."
+msgid "Open file manager"
+msgstr "Адкрыць менеджэр файлаў"
+
+msgctxt "A message is displayed when CKEditor 5 cannot associate an image with any of the categories defined in CKBox while uploading an asset."
+msgid "Cannot determine a category for the uploaded file."
+msgstr "Немагчыма вызначыць катэгорыю для запампаванага файла."
+
+msgctxt "A message is displayed when the user is not authorised to access the CKBox workspace configured as default one."
+msgid "Cannot access default workspace."
+msgstr "Немагчыма атрымаць доступ да прадвызначанай працоўнай прасторы."
+
+msgctxt "The title of the notification displayed when there is no permission to edit assets."
+msgid "You have no image editing permissions."
+msgstr "У вас няма дозволу на рэдагаванне відарыса."
+
+msgctxt "Image toolbar button tooltip for opening a dialog to manipulate the image."
+msgid "Edit image"
+msgstr "Рэдагаваць відарыс"
+
+msgctxt "A message stating that image editing is in progress."
+msgid "Processing the edited image."
+msgstr "Апрацоўка адрэдагаванага відарыса."
+
+msgctxt "A message is displayed when the server fails to process an image or doesn't respond."
+msgid "Server failed to process the image."
+msgstr "Сервер не здольны апрацаваць відарыс."
+
+msgctxt "A message is displayed when category of the image user wants to edit can't be determined."
+msgid "Failed to determine category of edited image."
+msgstr "Не здольны вызначыць катэгорыю адрэдагаванага відарыса."

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-ckbox",
-  "version": "44.3.0-alpha.7",
+  "version": "45.0.0-alpha.0",
   "description": "CKBox integration for CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -13,16 +13,17 @@
   "type": "module",
   "main": "src/index.js",
   "dependencies": {
-    "@ckeditor/ckeditor5-cloud-services": "44.3.0-alpha.7",
-    "@ckeditor/ckeditor5-core": "44.3.0-alpha.7",
-    "@ckeditor/ckeditor5-engine": "44.3.0-alpha.7",
-    "@ckeditor/ckeditor5-image": "44.3.0-alpha.7",
-    "@ckeditor/ckeditor5-ui": "44.3.0-alpha.7",
-    "@ckeditor/ckeditor5-upload": "44.3.0-alpha.7",
-    "@ckeditor/ckeditor5-utils": "44.3.0-alpha.7",
-    "ckeditor5": "44.3.0-alpha.7",
+    "@ckeditor/ckeditor5-cloud-services": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-core": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-engine": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-icons": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-image": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-ui": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-upload": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-utils": "45.0.0-alpha.0",
+    "ckeditor5": "45.0.0-alpha.0",
     "blurhash": "2.0.5",
-    "lodash-es": "4.17.21"
+    "es-toolkit": "1.32.0"
   },
   "author": "CKSource (http://cksource.com/)",
   "license": "SEE LICENSE IN LICENSE.md",

package/src/ckboxcommand.js

@@ -24,33 +24,33 @@ const ASSET_INSERTION_WAIT_TIMEOUT = 1000;
  * {@link module:link/link~Link Link feature}.
  */
 export default class CKBoxCommand extends Command {
+    /**
+     * A set of all chosen assets. They are stored temporarily and they are automatically removed 1 second after being chosen.
+     * Chosen assets have to be "remembered" for a while to be able to map the given asset with the element inserted into the model.
+     * This association map is then used to set the ID on the model element.
+     *
+     * All chosen assets are automatically removed after the timeout, because (theoretically) it may happen that they will never be
+     * inserted into the model, even if the {@link module:link/linkcommand~LinkCommand `'link'`} command or the
+     * {@link module:image/image/insertimagecommand~InsertImageCommand `'insertImage'`} command is enabled. Such a case may arise when
+     * another plugin blocks the command execution. Then, in order not to keep the chosen (but not inserted) assets forever, we delete
+     * them automatically to prevent memory leakage. The 1 second timeout is enough to insert the asset into the model and extract the
+     * ID from the chosen asset.
+     *
+     * The assets are stored only if
+     * the {@link module:ckbox/ckboxconfig~CKBoxConfig#ignoreDataId `config.ckbox.ignoreDataId`} option is set to `false` (by default).
+     *
+     * @internal
+     */
+    _chosenAssets = new Set();
+    /**
+     * The DOM element that acts as a mounting point for the CKBox dialog.
+     */
+    _wrapper = null;
     /**
      * @inheritDoc
      */
     constructor(editor) {
         super(editor);
-        /**
-         * A set of all chosen assets. They are stored temporarily and they are automatically removed 1 second after being chosen.
-         * Chosen assets have to be "remembered" for a while to be able to map the given asset with the element inserted into the model.
-         * This association map is then used to set the ID on the model element.
-         *
-         * All chosen assets are automatically removed after the timeout, because (theoretically) it may happen that they will never be
-         * inserted into the model, even if the {@link module:link/linkcommand~LinkCommand `'link'`} command or the
-         * {@link module:image/image/insertimagecommand~InsertImageCommand `'insertImage'`} command is enabled. Such a case may arise when
-         * another plugin blocks the command execution. Then, in order not to keep the chosen (but not inserted) assets forever, we delete
-         * them automatically to prevent memory leakage. The 1 second timeout is enough to insert the asset into the model and extract the
-         * ID from the chosen asset.
-         *
-         * The assets are stored only if
-         * the {@link module:ckbox/ckboxconfig~CKBoxConfig#ignoreDataId `config.ckbox.ignoreDataId`} option is set to `false` (by default).
-         *
-         * @internal
-         */
-        this._chosenAssets = new Set();
-        /**
-         * The DOM element that acts as a mounting point for the CKBox dialog.
-         */
-        this._wrapper = null;
         this._initListeners();
     }
     /**

package/src/ckboximageedit/ckboximageeditcommand.js

@@ -9,7 +9,7 @@
 import { Command, PendingActions } from 'ckeditor5/src/core.js';
 import { CKEditorError, abortableDebounce, createElement, retry, delay } from 'ckeditor5/src/utils.js';
 import { Notification } from 'ckeditor5/src/ui.js';
-import { isEqual } from 'lodash-es';
+import { isEqual } from 'es-toolkit/compat';
 import { sendHttpRequest } from '../utils.js';
 import { prepareImageAssetAttributes } from '../ckboxcommand.js';
 import { createEditabilityChecker } from './utils.js';
@@ -20,27 +20,35 @@ import CKBoxUtils from '../ckboxutils.js';
  * Opens the CKBox dialog for editing the image.
  */
 export default class CKBoxImageEditCommand extends Command {
+    /**
+     * The DOM element that acts as a mounting point for the CKBox Edit Image dialog.
+     */
+    _wrapper = null;
+    /**
+     * The states of image processing in progress.
+     */
+    _processInProgress = new Set();
+    /**
+     * Determines if the element can be edited.
+     */
+    _canEdit;
+    /**
+     * A wrapper function to prepare mount options. Ensures that at most one preparation is in-flight.
+     */
+    _prepareOptions;
+    /**
+    * CKBox's onClose function runs before the final cleanup, potentially causing
+    * page layout changes after it finishes. To address this, we use a setTimeout hack
+    * to ensure that floating elements on the page maintain their correct position.
+    *
+    * See: https://github.com/ckeditor/ckeditor5/issues/16153.
+    */
+    _updateUiDelayed = delay(() => this.editor.ui.update(), 0);
     /**
      * @inheritDoc
      */
     constructor(editor) {
         super(editor);
-        /**
-         * The DOM element that acts as a mounting point for the CKBox Edit Image dialog.
-         */
-        this._wrapper = null;
-        /**
-         * The states of image processing in progress.
-         */
-        this._processInProgress = new Set();
-        /**
-        * CKBox's onClose function runs before the final cleanup, potentially causing
-        * page layout changes after it finishes. To address this, we use a setTimeout hack
-        * to ensure that floating elements on the page maintain their correct position.
-        *
-        * See: https://github.com/ckeditor/ckeditor5/issues/16153.
-        */
-        this._updateUiDelayed = delay(() => this.editor.ui.update(), 0);
         this.value = false;
         this._canEdit = createEditabilityChecker(editor.config.get('ckbox.allowExternalImagesEditing'));
         this._prepareOptions = abortableDebounce((signal, state) => this._prepareOptionsAbortable(signal, state));

package/src/ckboximageedit/ckboximageeditui.js

@@ -7,7 +7,7 @@
  */
 import { Plugin } from 'ckeditor5/src/core.js';
 import { ButtonView } from 'ckeditor5/src/ui.js';
-import ckboxImageEditIcon from '../../theme/icons/ckbox-image-edit.svg';
+import { IconCkboxImageEdit } from 'ckeditor5/src/icons.js';
 /**
  * The UI plugin of the CKBox image edit feature.
  *
@@ -38,7 +38,7 @@ export default class CKBoxImageEditUI extends Plugin {
             const view = new ButtonView(locale);
             const t = locale.t;
             view.set({
-                icon: ckboxImageEditIcon,
+                icon: IconCkboxImageEdit,
                 tooltip: true
             });
             view.bind('label').to(uploadImageCommand, 'isAccessAllowed', isAccessAllowed => isAccessAllowed ?

package/src/ckboxui.js

@@ -5,8 +5,9 @@
 /**
  * @module ckbox/ckboxui
  */
-import { icons, Plugin } from 'ckeditor5/src/core.js';
+import { Plugin } from 'ckeditor5/src/core.js';
 import { ButtonView, MenuBarMenuListItemButtonView } from 'ckeditor5/src/ui.js';
+import { IconBrowseFiles, IconImageAssetManager } from 'ckeditor5/src/icons.js';
 /**
  * Introduces UI components for the `CKBox` plugin.
  *
@@ -72,7 +73,7 @@ export default class CKBoxUI extends Plugin {
     _createFileToolbarButton() {
         const t = this.editor.locale.t;
         const button = this._createButton(ButtonView);
-        button.icon = icons.browseFiles;
+        button.icon = IconBrowseFiles;
         button.label = t('Open file manager');
         button.tooltip = true;
         return button;
@@ -84,7 +85,7 @@ export default class CKBoxUI extends Plugin {
         const t = this.editor.locale.t;
         const imageInsertUI = this.editor.plugins.get('ImageInsertUI');
         const button = this._createButton(ButtonView);
-        button.icon = icons.imageAssetManager;
+        button.icon = IconImageAssetManager;
         button.bind('label').to(imageInsertUI, 'isImageSelected', isImageSelected => isImageSelected ? t('Replace image with file manager') : t('Insert image with file manager'));
         button.tooltip = true;
         return button;
@@ -96,7 +97,7 @@ export default class CKBoxUI extends Plugin {
         const t = this.editor.locale.t;
         const imageInsertUI = this.editor.plugins.get('ImageInsertUI');
         const button = this._createButton(ButtonView);
-        button.icon = icons.imageAssetManager;
+        button.icon = IconImageAssetManager;
         button.withText = true;
         button.bind('label').to(imageInsertUI, 'isImageSelected', isImageSelected => isImageSelected ? t('Replace with file manager') : t('Insert with file manager'));
         button.on('execute', () => {
@@ -110,7 +111,7 @@ export default class CKBoxUI extends Plugin {
     _createFileMenuBarButton() {
         const t = this.editor.locale.t;
         const button = this._createButton(MenuBarMenuListItemButtonView);
-        button.icon = icons.browseFiles;
+        button.icon = IconBrowseFiles;
         button.withText = true;
         button.label = t('File');
         return button;
@@ -123,7 +124,7 @@ export default class CKBoxUI extends Plugin {
         const translateVariableKey = this.editor.locale.t;
         const t = this.editor.locale.t;
         const button = this._createButton(MenuBarMenuListItemButtonView);
-        button.icon = icons.imageAssetManager;
+        button.icon = IconImageAssetManager;
         button.withText = true;
         switch (type) {
             case 'insertOnly':

package/src/ckboxuploadadapter.js

@@ -71,6 +71,30 @@ export default class CKBoxUploadAdapter extends Plugin {
  * Upload adapter for CKBox.
  */
 class Adapter {
+    /**
+     * FileLoader instance to use during the upload.
+     */
+    loader;
+    /**
+     * CKEditor Cloud Services access token.
+     */
+    token;
+    /**
+     * The editor instance.
+     */
+    editor;
+    /**
+     * The abort controller for aborting asynchronous processes.
+     */
+    controller;
+    /**
+     * The base URL where all requests should be sent.
+     */
+    serviceOrigin;
+    /**
+     * The reference to CKBoxUtils plugin.
+     */
+    ckboxUtils;
     /**
      * Creates a new adapter instance.
      */

package/src/ckboxutils.d.ts

@@ -51,4 +51,9 @@ export default class CKBoxUtils extends Plugin {
      * If the API returns limited results, the method will collect all items.
      */
     private _getAvailableCategories;
+    /**
+     * Authorize private categories access to the CKBox service. Request sets cookie for the current domain,
+     * that allows user to preview images from private categories.
+     */
+    private _authorizePrivateCategoriesAccess;
 }

package/src/ckboxutils.js

@@ -10,6 +10,10 @@ const DEFAULT_CKBOX_THEME_NAME = 'lark';
  * The CKBox utilities plugin.
  */
 export default class CKBoxUtils extends Plugin {
+    /**
+     * CKEditor Cloud Services access token.
+     */
+    _token;
     /**
      * @inheritDoc
      */
@@ -77,6 +81,13 @@ export default class CKBoxUtils extends Plugin {
         else {
             this._token = cloudServices.registerTokenUrl(ckboxTokenUrl);
         }
+        // Grant access to private categories after token is fetched. This is done within the same promise chain
+        // to ensure all services using the token have access to private categories.
+        // This step is critical as previewing images from private categories requires proper cookies.
+        this._token = this._token.then(async (token) => {
+            await this._authorizePrivateCategoriesAccess(token.value);
+            return token;
+        });
     }
     /**
      * Returns a token used by the CKBox plugin for communication with the CKBox service.
@@ -186,4 +197,19 @@ export default class CKBoxUtils extends Plugin {
             });
         }
     }
+    /**
+     * Authorize private categories access to the CKBox service. Request sets cookie for the current domain,
+     * that allows user to preview images from private categories.
+     */
+    async _authorizePrivateCategoriesAccess(token) {
+        const serviceUrl = this.editor.config.get('ckbox.serviceOrigin');
+        const formData = new FormData();
+        formData.set('token', token);
+        await fetch(`${serviceUrl}/categories/authorizePrivateAccess`, {
+            method: 'POST',
+            credentials: 'include',
+            mode: 'no-cors',
+            body: formData
+        });
+    }
 }

package/src/utils.js

@@ -38,12 +38,11 @@ export function getImageUrls(imageUrls) {
 export function getWorkspaceId(token, defaultWorkspaceId) {
     const [, binaryTokenPayload] = token.value.split('.');
     const payload = JSON.parse(atob(binaryTokenPayload));
-    const workspaces = (payload.auth && payload.auth.ckbox && payload.auth.ckbox.workspaces) || [payload.aud];
+    const workspaces = payload.auth?.ckbox?.workspaces || [payload.aud];
     if (!defaultWorkspaceId) {
         return workspaces[0];
     }
-    const role = payload.auth && payload.auth.ckbox && payload.auth.ckbox.role;
-    if (role == 'superadmin' || workspaces.includes(defaultWorkspaceId)) {
+    if (payload.auth?.ckbox?.role == 'superadmin' || workspaces.includes(defaultWorkspaceId)) {
         return defaultWorkspaceId;
     }
     return null;

package/theme/icons/ckbox-image-edit.svg

@@ -1 +0,0 @@
-<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M1.201 1C.538 1 0 1.47 0 2.1v14.363c0 .64.534 1.037 1.186 1.037H5.06l5.058-5.078L6.617 9.15a.696.696 0 0 0-.957-.033L1.5 13.6V2.5h15v4.354a3.478 3.478 0 0 1 1.5.049V2.1c0-.63-.547-1.1-1.2-1.1H1.202Zm11.713 2.803a2.147 2.147 0 0 0-2.049 1.992 2.14 2.14 0 0 0 1.28 2.096 2.13 2.13 0 0 0 2.642-3.11 2.129 2.129 0 0 0-1.873-.978ZM8.089 17.635v2.388h2.389l7.046-7.046-2.39-2.39-7.045 7.048Zm11.282-6.507a.637.637 0 0 0 .139-.692.603.603 0 0 0-.139-.205l-1.49-1.488a.63.63 0 0 0-.899 0l-1.166 1.163 2.39 2.39 1.165-1.168Z"/></svg>