@ckeditor/ckeditor5-emoji 49.1.0-alpha.1 → 49.1.0-alpha.2

package/dist/emojiconfig.d.ts

@@ -5,6 +5,7 @@
 /**
 * @module emoji/emojiconfig
 */
+import type { EmojiDefinition } from "./emojirepository.js";
 /**
 * The configuration of the Emoji feature.
 *
@@ -72,9 +73,38 @@ export interface EmojiConfig {
 	*		.then( ... )
 	*		.catch( ... );
 	* ```
+	*
+	* If the {@link module:emoji/emojiconfig~EmojiConfig#definitions `emoji.definitions`}
+	* option is provided, `definitionsUrl` is ignored as the passed definitions take precedence over the URL.
 	*/
 	definitionsUrl?: string;
 	/**
+	* The emoji definitions to use instead of downloading them from URL.
+	*
+	* Use this option to bundle the emoji database with your application, for example, when the
+	* {@glink getting-started/setup/csp Content Security Policy} of the page does not allow
+	* downloading it. The definitions must have the same structure as the database hosted on the CKEditor 5 CDN.
+	*
+	* ```ts
+	*	import definitions from './emoji/en.json';
+	*
+	*	ClassicEditor
+	*		.create( {
+	*			plugins: [ Emoji, ... ],
+	*			emoji: {
+	*				definitions
+	*			}
+	*		} )
+	*		.then( ... )
+	*		.catch( ... );
+	* ```
+	*
+	* If this option is provided, it takes precedence over the
+	* {@link module:emoji/emojiconfig~EmojiConfig#definitionsUrl `emoji.definitionsUrl`} and
+	* {@link module:emoji/emojiconfig~EmojiConfig#version `emoji.version`} options, which are ignored.
+	*/
+	definitions?: Array<EmojiDefinition>;
+	/**
 	* The emoji database version.
 	*
 	* ```ts
@@ -91,6 +121,7 @@ export interface EmojiConfig {
 	*
 	* If the {@link module:emoji/emojiconfig~EmojiConfig#definitionsUrl `emoji.definitionsUrl`}
 	* option is provided, `version` is ignored as the defined URL takes precedence over the `version`.
+	* The same applies to the {@link module:emoji/emojiconfig~EmojiConfig#definitions `emoji.definitions`} option.
 	*/
 	version?: EmojiVersion;
 	/**

package/dist/emojirepository.d.ts

@@ -8,7 +8,9 @@ import type { EmojiSkinToneId } from "./emojiconfig.js";
 /**
 * The emoji repository plugin.
 *
-* Loads the emoji repository from URL during plugin initialization and provides utility methods to search it.
+* Loads the emoji repository during plugin initialization and provides utility methods to search it.
+* The repository comes from the {@link module:emoji/emojiconfig~EmojiConfig#definitions `emoji.definitions`}
+* configuration option, if provided. Otherwise, it is downloaded from URL.
 */
 export declare class EmojiRepository extends Plugin {
 	/**
@@ -21,9 +23,24 @@ export declare class EmojiRepository extends Plugin {
 	isRepositoryReady: boolean | null;
 	/**
 	* The resolved URL from which the emoji repository is downloaded.
+	*
+	* It is `null` when the emoji definitions are passed in the configuration.
 	*/
 	private readonly _url;
 	/**
+	* The emoji definitions passed in the configuration.
+	*
+	* It is `null` when the emoji definitions are downloaded from URL.
+	*/
+	private readonly _definitions;
+	/**
+	* The normalized emoji definitions passed in the configuration.
+	*
+	* They are stored per editor instance instead of the process-global cache, because each editor
+	* can be configured with its own set of definitions.
+	*/
+	private _definitionsItems;
+	/**
 	* @inheritDoc
 	*/
 	static get requires(): PluginDependenciesOf<[EmojiUtils]>;
@@ -94,6 +111,14 @@ export declare class EmojiRepository extends Plugin {
 	*/
 	private _getItems;
 	/**
+	* Updates the {@link #isRepositoryReady} flag once the repository finishes loading.
+	*/
+	private _onRepositoryLoaded;
+	/**
+	* Warns about the options that are ignored because the emoji definitions are passed in the configuration.
+	*/
+	private _warnAboutRedundantOptions;
+	/**
 	* Normalizes the raw data fetched from CDN. By normalization, we meant:
 	*
 	*  * Filter out unsupported emoji (these that will not render correctly),
@@ -131,9 +156,11 @@ export type EmojiCategory = {
 	items: Array<EmojiEntry>;
 };
 /**
-* Represents a single item fetched from the CDN.
+* Represents a single emoji definition, as stored in the emoji database. The database is either downloaded
+* from {@link module:emoji/emojiconfig~EmojiConfig#definitionsUrl `emoji.definitionsUrl`} or passed directly
+* in {@link module:emoji/emojiconfig~EmojiConfig#definitions `emoji.definitions`}.
 */
-export type EmojiCdnResource = {
+export type EmojiDefinition = {
 	annotation: string;
 	emoji: string;
 	group: number;
@@ -149,9 +176,15 @@ export type EmojiCdnResource = {
 	tags?: Array<string>;
 };
 /**
+* Represents a single item fetched from the CDN.
+*
+* @deprecated Use {@link module:emoji/emojirepository~EmojiDefinition `EmojiDefinition`} instead.
+*/
+export type EmojiCdnResource = EmojiDefinition;
+/**
 * Represents a single emoji item used by the Emoji feature.
 */
-export type EmojiEntry = Omit<EmojiCdnResource, "skins"> & {
+export type EmojiEntry = Omit<EmojiDefinition, "skins"> & {
 	skins: EmojiMap;
 };
 /**

package/dist/emojiutils.d.ts

@@ -6,7 +6,7 @@
 * @module emoji/emojiutils
 */
 import { Plugin } from "@ckeditor/ckeditor5-core";
-import type { EmojiCdnResource, EmojiEntry } from "./emojirepository.js";
+import type { EmojiDefinition, EmojiEntry } from "./emojirepository.js";
 /**
 * The Emoji utilities plugin.
 */
@@ -31,7 +31,7 @@ export declare class EmojiUtils extends Plugin {
 	* Checks if the emoji is supported by verifying the emoji version supported by the system first.
 	* Then checks if emoji contains a zero width joiner (ZWJ), and if yes, then checks if it is supported by the system.
 	*/
-	isEmojiSupported(item: EmojiCdnResource, emojiSupportedVersionByOs: number, container: HTMLDivElement): boolean;
+	isEmojiSupported(item: EmojiDefinition, emojiSupportedVersionByOs: number, container: HTMLDivElement): boolean;
 	/**
 	* Checks the supported emoji version by the OS, by sampling some representatives from different emoji releases.
 	*/
@@ -43,7 +43,7 @@ export declare class EmojiUtils extends Plugin {
 	/**
 	* Checks whether the emoji is supported in the operating system.
 	*/
-	isEmojiZwjSupported(item: EmojiCdnResource, container: HTMLDivElement): boolean;
+	isEmojiZwjSupported(item: EmojiDefinition, container: HTMLDivElement): boolean;
 	/**
 	* Returns the width of the provided node.
 	*/
@@ -61,11 +61,11 @@ export declare class EmojiUtils extends Plugin {
 	/**
 	* Adds default skin tone property to each emoji. If emoji defines other skin tones, they are added as well.
 	*/
-	normalizeEmojiSkinTone(item: EmojiCdnResource): EmojiEntry;
+	normalizeEmojiSkinTone(item: EmojiDefinition): EmojiEntry;
 	/**
 	* Checks whether the emoji belongs to a group that is allowed.
 	*/
-	isEmojiCategoryAllowed(item: EmojiCdnResource): boolean;
+	isEmojiCategoryAllowed(item: EmojiDefinition): boolean;
 	/**
 	* A function used to determine if emoji is supported by detecting pixels.
 	*

package/dist/index.d.ts

@@ -8,7 +8,7 @@
 export { Emoji } from "./emoji.js";
 export { EmojiMention } from "./emojimention.js";
 export { EmojiPicker } from "./emojipicker.js";
-export { EmojiRepository, type EmojiCategory, type EmojiCdnResource, type EmojiEntry, type EmojiMap, type EmojiSkinTone } from "./emojirepository.js";
+export { EmojiRepository, type EmojiCategory, type EmojiCdnResource, type EmojiDefinition, type EmojiEntry, type EmojiMap, type EmojiSkinTone } from "./emojirepository.js";
 export { EmojiUtils } from "./emojiutils.js";
 export { EmojiCommand } from "./emojicommand.js";
 export type { EmojiConfig, EmojiSkinToneId, EmojiVersion } from "./emojiconfig.js";

package/dist/index.js

@@ -308,14 +308,31 @@ const DEFAULT_EMOJI_VERSION = 16;
 /**
 * The emoji repository plugin.
 *
-* Loads the emoji repository from URL during plugin initialization and provides utility methods to search it.
+* Loads the emoji repository during plugin initialization and provides utility methods to search it.
+* The repository comes from the {@link module:emoji/emojiconfig~EmojiConfig#definitions `emoji.definitions`}
+* configuration option, if provided. Otherwise, it is downloaded from URL.
 */
 var EmojiRepository = class EmojiRepository extends Plugin {
 	/**
 	* The resolved URL from which the emoji repository is downloaded.
+	*
+	* It is `null` when the emoji definitions are passed in the configuration.
 	*/
 	_url;
 	/**
+	* The emoji definitions passed in the configuration.
+	*
+	* It is `null` when the emoji definitions are downloaded from URL.
+	*/
+	_definitions;
+	/**
+	* The normalized emoji definitions passed in the configuration.
+	*
+	* They are stored per editor instance instead of the process-global cache, because each editor
+	* can be configured with its own set of definitions.
+	*/
+	_definitionsItems = null;
+	/**
 	* @inheritDoc
 	*/
 	static get requires() {
@@ -342,35 +359,38 @@ var EmojiRepository = class EmojiRepository extends Plugin {
 			version: void 0,
 			skinTone: "default",
 			definitionsUrl: void 0,
+			definitions: void 0,
 			useCustomFont: false
 		});
 		this.set("isRepositoryReady", null);
-		this._url = this._getUrl();
+		const definitions = editor.config.get("emoji.definitions");
+		if (definitions) {
+			this._definitions = definitions;
+			this._url = null;
+			this._warnAboutRedundantOptions();
+		} else {
+			this._definitions = null;
+			this._url = this._getUrl();
+		}
 	}
 	/**
 	* @inheritDoc
 	*/
 	init() {
+		if (this._definitions) {
+			const definitions = this._definitions;
+			Promise.resolve().then(() => this._normalizeEmoji(definitions)).catch(() => []).then((items) => {
+				this._definitionsItems = items;
+				this._onRepositoryLoaded();
+			});
+			return;
+		}
 		this._warnAboutCdnUse();
 		EmojiRepository._cache.fetch({
 			url: this._url.toString(),
 			cacheKeys: this._cacheKeys,
 			transform: (raw) => this._normalizeEmoji(raw)
-		}).then(() => {
-			if (this.editor.state === "destroyed") return;
-			const ready = !!this._getItems();
-			if (!ready)
- /**
-			* Unable to identify the available emoji to display.
-			*
-			* See the {@glink features/emoji#troubleshooting troubleshooting} section in
-			* the {@glink features/emoji Emoji feature} guide for more details.
-			*
-			* @error emoji-repository-empty
-			*/
-			logWarning("emoji-repository-empty");
-			this.isRepositoryReady = ready;
-		});
+		}).then(() => this._onRepositoryLoaded());
 	}
 	/**
 	* Calls `callback` once the repository finishes loading, passing the result as the argument.
@@ -474,7 +494,7 @@ var EmojiRepository = class EmojiRepository extends Plugin {
 		return categories.map((category) => {
 			return {
 				...category,
-				items: groups[category.groupId]
+				items: groups[category.groupId] || []
 			};
 		});
 	}
@@ -588,13 +608,50 @@ var EmojiRepository = class EmojiRepository extends Plugin {
 	* a non-empty array, or `null` otherwise.
 	*/
 	_getItems() {
-		const repository = EmojiRepository._cache.getSync({
+		const repository = this._definitions ? this._definitionsItems : EmojiRepository._cache.getSync({
 			url: this._url.toString(),
 			cacheKeys: this._cacheKeys
 		});
 		return repository && repository.length ? repository : null;
 	}
 	/**
+	* Updates the {@link #isRepositoryReady} flag once the repository finishes loading.
+	*/
+	_onRepositoryLoaded() {
+		if (this.editor.state === "destroyed") return;
+		const ready = !!this._getItems();
+		if (!ready)
+ /**
+		* Unable to identify the available emoji to display.
+		*
+		* See the {@glink features/emoji#troubleshooting troubleshooting} section in
+		* the {@glink features/emoji Emoji feature} guide for more details.
+		*
+		* @error emoji-repository-empty
+		*/
+		logWarning("emoji-repository-empty");
+		this.isRepositoryReady = ready;
+	}
+	/**
+	* Warns about the options that are ignored because the emoji definitions are passed in the configuration.
+	*/
+	_warnAboutRedundantOptions() {
+		const definitionsUrl = this.editor.config.get("emoji.definitionsUrl");
+		const version = this.editor.config.get("emoji.version");
+		if (definitionsUrl && definitionsUrl !== "cdn" || version)
+ /**
+		* The {@link module:emoji/emojiconfig~EmojiConfig#definitions `emoji.definitions`} configuration option is set
+		* together with other options that point to the emoji database: {@link module:emoji/emojiconfig~EmojiConfig#definitionsUrl
+		* `emoji.definitionsUrl`} or {@link module:emoji/emojiconfig~EmojiConfig#version `emoji.version`}.
+		* Only the `emoji.definitions` option will be used.
+		*
+		* The other options will be ignored and should be removed from the configuration.
+		*
+		* @error emoji-repository-redundant-options
+		*/
+		logWarning("emoji-repository-redundant-options");
+	}
+	/**
 	* Normalizes the raw data fetched from CDN. By normalization, we meant:
 	*
 	*  * Filter out unsupported emoji (these that will not render correctly),
@@ -1533,6 +1590,11 @@ var EmojiPickerView = class extends View {
 				secondaryText: t("The query must contain at least two characters."),
 				isVisible: true
 			});
+			else if (!data.query && !data.resultsCount) this.infoView.set({
+				primaryText: t("There are no emojis in this category."),
+				secondaryText: "",
+				isVisible: true
+			});
 			else if (!data.resultsCount) this.infoView.set({
 				primaryText: t("No emojis were found matching \"%0\".", data.query),
 				secondaryText: t("Please try a different phrase or check the spelling."),