@ckeditor/ckeditor5-ckbox 0.0.0-nightly-20240624.0 → 0.0.0-nightly-20240626.0

package/dist/types/ckboxcommand.d.ts

@@ -78,8 +78,20 @@ export default class CKBoxCommand extends Command {
      * - tokenUrl The token endpoint URL.
      * - serviceOrigin The base URL of the API service.
      * - forceDemoLabel Whether to force "Powered by CKBox" link.
-     * - dialog.onClose The callback function invoked after closing the CKBox dialog.
      * - assets.onChoose The callback function invoked after choosing the assets.
+     * - dialog.onClose The callback function invoked after closing the CKBox dialog.
+     * - dialog.width The dialog width in pixels.
+     * - dialog.height The dialog height in pixels.
+     * - categories.icons Allows setting custom icons for categories.
+     * - view.openLastView Sets if the last view visited by the user will be reopened
+     * on the next startup.
+     * - view.startupFolderId Sets the ID of the folder that will be opened on startup.
+     * - view.startupCategoryId Sets the ID of the category that will be opened on startup.
+     * - view.hideMaximizeButton Sets whether to hide the ‘Maximize’ button.
+     * - view.componentsHideTimeout Sets timeout after which upload components are hidden
+     * after completed upload.
+     * - view.dialogMinimizeTimeout Sets timeout after which upload dialog is minimized
+     * after completed upload.
      */
     private _prepareOptions;
     /**

package/dist/types/ckboxconfig.d.ts

@@ -129,6 +129,111 @@ export interface CKBoxConfig {
      * Defaults to {@link module:utils/locale~Locale#uiLanguage `Locale#uiLanguage`}
      */
     language?: string;
+    /**
+     * This option allows opening CKBox in dialog mode. It takes a configuration object with
+     * the width and height attributes.
+     */
+    dialog?: CKBoxDialogConfig;
+    /**
+     * Allows setting custom icons for categories.
+     */
+    categories?: CKBoxCategoriesConfig;
+    /**
+     * Configures the view of CKBox.
+     */
+    view?: CKBoxViewConfig;
+    /**
+     * Configures when dialog should be minimized and hidden.
+     */
+    upload?: CKBoxUploadConfig;
+    /**
+     * Specifies the file extensions considered valid for user interaction. Whith this
+     * option developers can restrict user interaction to only those assets whose file
+     * extensions match those listed in the array. Assets whose file
+     * extensions are not listed in the `choosableFileExtensions` array are
+     * automatically disabled within the CKBox interface.
+     *
+     * ```ts
+     * const ckboxConfig = {
+     *		choosableFileExtensions: ['jpg', 'png']
+     * };
+     * ```
+     */
+    choosableFileExtensions?: Array<string>;
+}
+export interface CKBoxDialogConfig {
+    /**
+     * The dialog width in pixels.
+     */
+    width: number;
+    /**
+     * The dialog height in pixels.
+     */
+    height: number;
+}
+export interface CKBoxCategoriesConfig {
+    /**
+     * This option takes an object with categories and icons that should be used instead
+     * of the default ones. Categories can be defined using either their name or id.
+     * Icons should be defined as strings containing the SVG images, or as React components.
+     *
+     * ```ts
+     * const ckboxConfig = {
+     * 		categories: {
+     * 				icons: {
+     * 					Images: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path ... /></svg>',
+     * 					// Category can be referenced by ID
+     * 					// 'fdf2a647-b67f-4a6c-b692-5ba1dc1ed87b': '<svg...'
+     * 				}
+     * 		}
+     * }
+     * ```
+     */
+    icons?: {
+        [key: string]: string;
+    };
+}
+export interface CKBoxViewConfig {
+    /**
+     * If it is set to `false` the last view visited by the user will not be reopened on
+     * the next startup.
+     */
+    openLastView?: boolean;
+    /**
+     * Sets the ID of the folder that will be opened on startup. This option can be paired
+     * with setting `view.openLastView` to `false` to enforce CKBox to always open in a given
+     * folder at startup.
+     */
+    startupFolderId?: string;
+    /**
+     * Sets the ID of the category that will be opened on startup. This option can be paired
+     * with setting `view.openLastView` to `false` to enforce CKBox to always open in a given
+     * category at startup. If `view.startupCategoryId` is passed along with the
+     * `view.startupFolderId` option, CKBox will prioritize opening category view on the startup.
+     */
+    startupCategoryId?: string;
+    /**
+     * Sets whether to hide the ‘Maximize’ button. By default, the button is shown and enabling
+     * this option will hide it.
+     */
+    hideMaximizeButton?: boolean;
+}
+export interface CKBoxUploadConfig {
+    /**
+     * Sets timeout (in milliseconds) after which upload components (dialog and indicator) are
+     * hidden. By default, these components hide automatically after 10 seconds.
+     *
+     * Read more: https://ckeditor.com/docs/ckbox/latest/guides/configuration/configuration-options.html#uploadcomponentshidetimeout
+     */
+    componentsHideTimeout?: number;
+    /**
+     * Sets timeout (in milliseconds) after which upload dialog is minimized once upload is
+     * finished and all uploads were successful. By default, upload dialog is never minimized
+     * automatically.
+     *
+     * Read more: https://ckeditor.com/docs/ckbox/latest/guides/configuration/configuration-options.html#uploaddialogminimizetimeout
+     */
+    dialogMinimizeTimeout?: number;
 }
 /**
  * Asset definition.

package/dist/types/ckboxediting.d.ts

@@ -14,10 +14,6 @@ import CKBoxUtils from './ckboxutils.js';
  * {@link module:ckbox/ckboxuploadadapter~CKBoxUploadAdapter CKBox upload adapter}.
  */
 export default class CKBoxEditing extends Plugin {
-    /**
-     * CKEditor Cloud Services access token.
-     */
-    private _token;
     /**
      * @inheritDoc
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-ckbox",
-  "version": "0.0.0-nightly-20240624.0",
+  "version": "0.0.0-nightly-20240626.0",
   "description": "CKBox integration for CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -13,7 +13,7 @@
   "type": "module",
   "main": "src/index.js",
   "dependencies": {
-    "ckeditor5": "0.0.0-nightly-20240624.0",
+    "ckeditor5": "0.0.0-nightly-20240626.0",
     "blurhash": "2.0.5",
     "lodash-es": "4.17.21"
   },

package/src/ckboxcommand.d.ts

@@ -74,8 +74,20 @@ export default class CKBoxCommand extends Command {
      * - tokenUrl The token endpoint URL.
      * - serviceOrigin The base URL of the API service.
      * - forceDemoLabel Whether to force "Powered by CKBox" link.
-     * - dialog.onClose The callback function invoked after closing the CKBox dialog.
      * - assets.onChoose The callback function invoked after choosing the assets.
+     * - dialog.onClose The callback function invoked after closing the CKBox dialog.
+     * - dialog.width The dialog width in pixels.
+     * - dialog.height The dialog height in pixels.
+     * - categories.icons Allows setting custom icons for categories.
+     * - view.openLastView Sets if the last view visited by the user will be reopened
+     * on the next startup.
+     * - view.startupFolderId Sets the ID of the folder that will be opened on startup.
+     * - view.startupCategoryId Sets the ID of the category that will be opened on startup.
+     * - view.hideMaximizeButton Sets whether to hide the ‘Maximize’ button.
+     * - view.componentsHideTimeout Sets timeout after which upload components are hidden
+     * after completed upload.
+     * - view.dialogMinimizeTimeout Sets timeout after which upload dialog is minimized
+     * after completed upload.
      */
     private _prepareOptions;
     /**

package/src/ckboxcommand.js

@@ -95,23 +95,55 @@ export default class CKBoxCommand extends Command {
      * - tokenUrl The token endpoint URL.
      * - serviceOrigin The base URL of the API service.
      * - forceDemoLabel Whether to force "Powered by CKBox" link.
-     * - dialog.onClose The callback function invoked after closing the CKBox dialog.
      * - assets.onChoose The callback function invoked after choosing the assets.
+     * - dialog.onClose The callback function invoked after closing the CKBox dialog.
+     * - dialog.width The dialog width in pixels.
+     * - dialog.height The dialog height in pixels.
+     * - categories.icons Allows setting custom icons for categories.
+     * - view.openLastView Sets if the last view visited by the user will be reopened
+     * on the next startup.
+     * - view.startupFolderId Sets the ID of the folder that will be opened on startup.
+     * - view.startupCategoryId Sets the ID of the category that will be opened on startup.
+     * - view.hideMaximizeButton Sets whether to hide the ‘Maximize’ button.
+     * - view.componentsHideTimeout Sets timeout after which upload components are hidden
+     * after completed upload.
+     * - view.dialogMinimizeTimeout Sets timeout after which upload dialog is minimized
+     * after completed upload.
      */
     _prepareOptions() {
         const editor = this.editor;
         const ckboxConfig = editor.config.get('ckbox');
+        const dialog = ckboxConfig.dialog;
+        const categories = ckboxConfig.categories;
+        const view = ckboxConfig.view;
+        const upload = ckboxConfig.upload;
         return {
             theme: ckboxConfig.theme,
             language: ckboxConfig.language,
             tokenUrl: ckboxConfig.tokenUrl,
             serviceOrigin: ckboxConfig.serviceOrigin,
             forceDemoLabel: ckboxConfig.forceDemoLabel,
-            dialog: {
-                onClose: () => this.fire('ckbox:close')
-            },
+            choosableFileExtensions: ckboxConfig.choosableFileExtensions,
             assets: {
                 onChoose: (assets) => this.fire('ckbox:choose', assets)
+            },
+            dialog: {
+                onClose: () => this.fire('ckbox:close'),
+                width: dialog && dialog.width,
+                height: dialog && dialog.height
+            },
+            categories: categories && {
+                icons: categories.icons
+            },
+            view: view && {
+                openLastView: view.openLastView,
+                startupFolderId: view.startupFolderId,
+                startupCategoryId: view.startupCategoryId,
+                hideMaximizeButton: view.hideMaximizeButton
+            },
+            upload: upload && {
+                componentsHideTimeout: upload.componentsHideTimeout,
+                dialogMinimizeTimeout: upload.dialogMinimizeTimeout
             }
         };
     }

package/src/ckboxconfig.d.ts

@@ -125,6 +125,111 @@ export interface CKBoxConfig {
      * Defaults to {@link module:utils/locale~Locale#uiLanguage `Locale#uiLanguage`}
      */
     language?: string;
+    /**
+     * This option allows opening CKBox in dialog mode. It takes a configuration object with
+     * the width and height attributes.
+     */
+    dialog?: CKBoxDialogConfig;
+    /**
+     * Allows setting custom icons for categories.
+     */
+    categories?: CKBoxCategoriesConfig;
+    /**
+     * Configures the view of CKBox.
+     */
+    view?: CKBoxViewConfig;
+    /**
+     * Configures when dialog should be minimized and hidden.
+     */
+    upload?: CKBoxUploadConfig;
+    /**
+     * Specifies the file extensions considered valid for user interaction. Whith this
+     * option developers can restrict user interaction to only those assets whose file
+     * extensions match those listed in the array. Assets whose file
+     * extensions are not listed in the `choosableFileExtensions` array are
+     * automatically disabled within the CKBox interface.
+     *
+     * ```ts
+     * const ckboxConfig = {
+     *		choosableFileExtensions: ['jpg', 'png']
+     * };
+     * ```
+     */
+    choosableFileExtensions?: Array<string>;
+}
+export interface CKBoxDialogConfig {
+    /**
+     * The dialog width in pixels.
+     */
+    width: number;
+    /**
+     * The dialog height in pixels.
+     */
+    height: number;
+}
+export interface CKBoxCategoriesConfig {
+    /**
+     * This option takes an object with categories and icons that should be used instead
+     * of the default ones. Categories can be defined using either their name or id.
+     * Icons should be defined as strings containing the SVG images, or as React components.
+     *
+     * ```ts
+     * const ckboxConfig = {
+     * 		categories: {
+     * 				icons: {
+     * 					Images: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path ... /></svg>',
+     * 					// Category can be referenced by ID
+     * 					// 'fdf2a647-b67f-4a6c-b692-5ba1dc1ed87b': '<svg...'
+     * 				}
+     * 		}
+     * }
+     * ```
+     */
+    icons?: {
+        [key: string]: string;
+    };
+}
+export interface CKBoxViewConfig {
+    /**
+     * If it is set to `false` the last view visited by the user will not be reopened on
+     * the next startup.
+     */
+    openLastView?: boolean;
+    /**
+     * Sets the ID of the folder that will be opened on startup. This option can be paired
+     * with setting `view.openLastView` to `false` to enforce CKBox to always open in a given
+     * folder at startup.
+     */
+    startupFolderId?: string;
+    /**
+     * Sets the ID of the category that will be opened on startup. This option can be paired
+     * with setting `view.openLastView` to `false` to enforce CKBox to always open in a given
+     * category at startup. If `view.startupCategoryId` is passed along with the
+     * `view.startupFolderId` option, CKBox will prioritize opening category view on the startup.
+     */
+    startupCategoryId?: string;
+    /**
+     * Sets whether to hide the ‘Maximize’ button. By default, the button is shown and enabling
+     * this option will hide it.
+     */
+    hideMaximizeButton?: boolean;
+}
+export interface CKBoxUploadConfig {
+    /**
+     * Sets timeout (in milliseconds) after which upload components (dialog and indicator) are
+     * hidden. By default, these components hide automatically after 10 seconds.
+     *
+     * Read more: https://ckeditor.com/docs/ckbox/latest/guides/configuration/configuration-options.html#uploadcomponentshidetimeout
+     */
+    componentsHideTimeout?: number;
+    /**
+     * Sets timeout (in milliseconds) after which upload dialog is minimized once upload is
+     * finished and all uploads were successful. By default, upload dialog is never minimized
+     * automatically.
+     *
+     * Read more: https://ckeditor.com/docs/ckbox/latest/guides/configuration/configuration-options.html#uploaddialogminimizetimeout
+     */
+    dialogMinimizeTimeout?: number;
 }
 /**
  * Asset definition.

package/src/ckboxediting.d.ts

@@ -10,10 +10,6 @@ import CKBoxUtils from './ckboxutils.js';
  * {@link module:ckbox/ckboxuploadadapter~CKBoxUploadAdapter CKBox upload adapter}.
  */
 export default class CKBoxEditing extends Plugin {
-    /**
-     * CKEditor Cloud Services access token.
-     */
-    private _token;
     /**
      * @inheritDoc
      */