qms-angular 1.0.27 → 1.0.31

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/src/specialcharacterslatin.js

@@ -0,0 +1,170 @@
+/**
+ * @license Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module special-characters/specialcharacterslatin
+ */
+
+import { Plugin } from '@ckeditor/ckeditor5-core';
+
+/**
+ * A plugin that provides special characters for the "Latin" category.
+ *
+ *		ClassicEditor
+ *			.create( {
+ *				plugins: [ ..., SpecialCharacters, SpecialCharactersLatin ],
+ *			} )
+ *			.then( ... )
+ *			.catch( ... );
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class SpecialCharactersLatin extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'SpecialCharactersLatin';
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+		const t = editor.t;
+
+		editor.plugins.get( 'SpecialCharacters' ).addItems( 'Latin', [
+			{ character: 'Ā', title: t( 'Latin capital letter a with macron' ) },
+			{ character: 'ā', title: t( 'Latin small letter a with macron' ) },
+			{ character: 'Ă', title: t( 'Latin capital letter a with breve' ) },
+			{ character: 'ă', title: t( 'Latin small letter a with breve' ) },
+			{ character: 'Ą', title: t( 'Latin capital letter a with ogonek' ) },
+			{ character: 'ą', title: t( 'Latin small letter a with ogonek' ) },
+			{ character: 'Ć', title: t( 'Latin capital letter c with acute' ) },
+			{ character: 'ć', title: t( 'Latin small letter c with acute' ) },
+			{ character: 'Ĉ', title: t( 'Latin capital letter c with circumflex' ) },
+			{ character: 'ĉ', title: t( 'Latin small letter c with circumflex' ) },
+			{ character: 'Ċ', title: t( 'Latin capital letter c with dot above' ) },
+			{ character: 'ċ', title: t( 'Latin small letter c with dot above' ) },
+			{ character: 'Č', title: t( 'Latin capital letter c with caron' ) },
+			{ character: 'č', title: t( 'Latin small letter c with caron' ) },
+			{ character: 'Ď', title: t( 'Latin capital letter d with caron' ) },
+			{ character: 'ď', title: t( 'Latin small letter d with caron' ) },
+			{ character: 'Đ', title: t( 'Latin capital letter d with stroke' ) },
+			{ character: 'đ', title: t( 'Latin small letter d with stroke' ) },
+			{ character: 'Ē', title: t( 'Latin capital letter e with macron' ) },
+			{ character: 'ē', title: t( 'Latin small letter e with macron' ) },
+			{ character: 'Ĕ', title: t( 'Latin capital letter e with breve' ) },
+			{ character: 'ĕ', title: t( 'Latin small letter e with breve' ) },
+			{ character: 'Ė', title: t( 'Latin capital letter e with dot above' ) },
+			{ character: 'ė', title: t( 'Latin small letter e with dot above' ) },
+			{ character: 'Ę', title: t( 'Latin capital letter e with ogonek' ) },
+			{ character: 'ę', title: t( 'Latin small letter e with ogonek' ) },
+			{ character: 'Ě', title: t( 'Latin capital letter e with caron' ) },
+			{ character: 'ě', title: t( 'Latin small letter e with caron' ) },
+			{ character: 'Ĝ', title: t( 'Latin capital letter g with circumflex' ) },
+			{ character: 'ĝ', title: t( 'Latin small letter g with circumflex' ) },
+			{ character: 'Ğ', title: t( 'Latin capital letter g with breve' ) },
+			{ character: 'ğ', title: t( 'Latin small letter g with breve' ) },
+			{ character: 'Ġ', title: t( 'Latin capital letter g with dot above' ) },
+			{ character: 'ġ', title: t( 'Latin small letter g with dot above' ) },
+			{ character: 'Ģ', title: t( 'Latin capital letter g with cedilla' ) },
+			{ character: 'ģ', title: t( 'Latin small letter g with cedilla' ) },
+			{ character: 'Ĥ', title: t( 'Latin capital letter h with circumflex' ) },
+			{ character: 'ĥ', title: t( 'Latin small letter h with circumflex' ) },
+			{ character: 'Ħ', title: t( 'Latin capital letter h with stroke' ) },
+			{ character: 'ħ', title: t( 'Latin small letter h with stroke' ) },
+			{ character: 'Ĩ', title: t( 'Latin capital letter i with tilde' ) },
+			{ character: 'ĩ', title: t( 'Latin small letter i with tilde' ) },
+			{ character: 'Ī', title: t( 'Latin capital letter i with macron' ) },
+			{ character: 'ī', title: t( 'Latin small letter i with macron' ) },
+			{ character: 'Ĭ', title: t( 'Latin capital letter i with breve' ) },
+			{ character: 'ĭ', title: t( 'Latin small letter i with breve' ) },
+			{ character: 'Į', title: t( 'Latin capital letter i with ogonek' ) },
+			{ character: 'į', title: t( 'Latin small letter i with ogonek' ) },
+			{ character: 'İ', title: t( 'Latin capital letter i with dot above' ) },
+			{ character: 'ı', title: t( 'Latin small letter dotless i' ) },
+			{ character: 'IJ', title: t( 'Latin capital ligature ij' ) },
+			{ character: 'ij', title: t( 'Latin small ligature ij' ) },
+			{ character: 'Ĵ', title: t( 'Latin capital letter j with circumflex' ) },
+			{ character: 'ĵ', title: t( 'Latin small letter j with circumflex' ) },
+			{ character: 'Ķ', title: t( 'Latin capital letter k with cedilla' ) },
+			{ character: 'ķ', title: t( 'Latin small letter k with cedilla' ) },
+			{ character: 'ĸ', title: t( 'Latin small letter kra' ) },
+			{ character: 'Ĺ', title: t( 'Latin capital letter l with acute' ) },
+			{ character: 'ĺ', title: t( 'Latin small letter l with acute' ) },
+			{ character: 'Ļ', title: t( 'Latin capital letter l with cedilla' ) },
+			{ character: 'ļ', title: t( 'Latin small letter l with cedilla' ) },
+			{ character: 'Ľ', title: t( 'Latin capital letter l with caron' ) },
+			{ character: 'ľ', title: t( 'Latin small letter l with caron' ) },
+			{ character: 'Ŀ', title: t( 'Latin capital letter l with middle dot' ) },
+			{ character: 'ŀ', title: t( 'Latin small letter l with middle dot' ) },
+			{ character: 'Ł', title: t( 'Latin capital letter l with stroke' ) },
+			{ character: 'ł', title: t( 'Latin small letter l with stroke' ) },
+			{ character: 'Ń', title: t( 'Latin capital letter n with acute' ) },
+			{ character: 'ń', title: t( 'Latin small letter n with acute' ) },
+			{ character: 'Ņ', title: t( 'Latin capital letter n with cedilla' ) },
+			{ character: 'ņ', title: t( 'Latin small letter n with cedilla' ) },
+			{ character: 'Ň', title: t( 'Latin capital letter n with caron' ) },
+			{ character: 'ň', title: t( 'Latin small letter n with caron' ) },
+			{ character: 'ʼn', title: t( 'Latin small letter n preceded by apostrophe' ) },
+			{ character: 'Ŋ', title: t( 'Latin capital letter eng' ) },
+			{ character: 'ŋ', title: t( 'Latin small letter eng' ) },
+			{ character: 'Ō', title: t( 'Latin capital letter o with macron' ) },
+			{ character: 'ō', title: t( 'Latin small letter o with macron' ) },
+			{ character: 'Ŏ', title: t( 'Latin capital letter o with breve' ) },
+			{ character: 'ŏ', title: t( 'Latin small letter o with breve' ) },
+			{ character: 'Ő', title: t( 'Latin capital letter o with double acute' ) },
+			{ character: 'ő', title: t( 'Latin small letter o with double acute' ) },
+			{ character: 'Œ', title: t( 'Latin capital ligature oe' ) },
+			{ character: 'œ', title: t( 'Latin small ligature oe' ) },
+			{ character: 'Ŕ', title: t( 'Latin capital letter r with acute' ) },
+			{ character: 'ŕ', title: t( 'Latin small letter r with acute' ) },
+			{ character: 'Ŗ', title: t( 'Latin capital letter r with cedilla' ) },
+			{ character: 'ŗ', title: t( 'Latin small letter r with cedilla' ) },
+			{ character: 'Ř', title: t( 'Latin capital letter r with caron' ) },
+			{ character: 'ř', title: t( 'Latin small letter r with caron' ) },
+			{ character: 'Ś', title: t( 'Latin capital letter s with acute' ) },
+			{ character: 'ś', title: t( 'Latin small letter s with acute' ) },
+			{ character: 'Ŝ', title: t( 'Latin capital letter s with circumflex' ) },
+			{ character: 'ŝ', title: t( 'Latin small letter s with circumflex' ) },
+			{ character: 'Ş', title: t( 'Latin capital letter s with cedilla' ) },
+			{ character: 'ş', title: t( 'Latin small letter s with cedilla' ) },
+			{ character: 'Š', title: t( 'Latin capital letter s with caron' ) },
+			{ character: 'š', title: t( 'Latin small letter s with caron' ) },
+			{ character: 'Ţ', title: t( 'Latin capital letter t with cedilla' ) },
+			{ character: 'ţ', title: t( 'Latin small letter t with cedilla' ) },
+			{ character: 'Ť', title: t( 'Latin capital letter t with caron' ) },
+			{ character: 'ť', title: t( 'Latin small letter t with caron' ) },
+			{ character: 'Ŧ', title: t( 'Latin capital letter t with stroke' ) },
+			{ character: 'ŧ', title: t( 'Latin small letter t with stroke' ) },
+			{ character: 'Ũ', title: t( 'Latin capital letter u with tilde' ) },
+			{ character: 'ũ', title: t( 'Latin small letter u with tilde' ) },
+			{ character: 'Ū', title: t( 'Latin capital letter u with macron' ) },
+			{ character: 'ū', title: t( 'Latin small letter u with macron' ) },
+			{ character: 'Ŭ', title: t( 'Latin capital letter u with breve' ) },
+			{ character: 'ŭ', title: t( 'Latin small letter u with breve' ) },
+			{ character: 'Ů', title: t( 'Latin capital letter u with ring above' ) },
+			{ character: 'ů', title: t( 'Latin small letter u with ring above' ) },
+			{ character: 'Ű', title: t( 'Latin capital letter u with double acute' ) },
+			{ character: 'ű', title: t( 'Latin small letter u with double acute' ) },
+			{ character: 'Ų', title: t( 'Latin capital letter u with ogonek' ) },
+			{ character: 'ų', title: t( 'Latin small letter u with ogonek' ) },
+			{ character: 'Ŵ', title: t( 'Latin capital letter w with circumflex' ) },
+			{ character: 'ŵ', title: t( 'Latin small letter w with circumflex' ) },
+			{ character: 'Ŷ', title: t( 'Latin capital letter y with circumflex' ) },
+			{ character: 'ŷ', title: t( 'Latin small letter y with circumflex' ) },
+			{ character: 'Ÿ', title: t( 'Latin capital letter y with diaeresis' ) },
+			{ character: 'Ź', title: t( 'Latin capital letter z with acute' ) },
+			{ character: 'ź', title: t( 'Latin small letter z with acute' ) },
+			{ character: 'Ż', title: t( 'Latin capital letter z with dot above' ) },
+			{ character: 'ż', title: t( 'Latin small letter z with dot above' ) },
+			{ character: 'Ž', title: t( 'Latin capital letter z with caron' ) },
+			{ character: 'ž', title: t( 'Latin small letter z with caron' ) },
+			{ character: 'ſ', title: t( 'Latin small letter long s' ) }
+		] );
+	}
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/src/specialcharactersmathematical.js

@@ -0,0 +1,86 @@
+/**
+ * @license Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module special-characters/specialcharactersmathematical
+ */
+
+import { Plugin } from '@ckeditor/ckeditor5-core';
+
+/**
+ * A plugin that provides special characters for the "Mathematical" category.
+ *
+ *		ClassicEditor
+ *			.create( {
+ *				plugins: [ ..., SpecialCharacters, SpecialCharactersMathematical ],
+ *			} )
+ *			.then( ... )
+ *			.catch( ... );
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class SpecialCharactersMathematical extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'SpecialCharactersMathematical';
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+		const t = editor.t;
+
+		editor.plugins.get( 'SpecialCharacters' ).addItems( 'Mathematical', [
+			{ character: '<', title: t( 'Less-than sign' ) },
+			{ character: '>', title: t( 'Greater-than sign' ) },
+			{ character: '≤', title: t( 'Less-than or equal to' ) },
+			{ character: '≥', title: t( 'Greater-than or equal to' ) },
+			{ character: '–', title: t( 'En dash' ) },
+			{ character: '—', title: t( 'Em dash' ) },
+			{ character: '¯', title: t( 'Macron' ) },
+			{ character: '‾', title: t( 'Overline' ) },
+			{ character: '°', title: t( 'Degree sign' ) },
+			{ character: '−', title: t( 'Minus sign' ) },
+			{ character: '±', title: t( 'Plus-minus sign' ) },
+			{ character: '÷', title: t( 'Division sign' ) },
+			{ character: '⁄', title: t( 'Fraction slash' ) },
+			{ character: '×', title: t( 'Multiplication sign' ) },
+			{ character: 'ƒ', title: t( 'Latin small letter f with hook' ) },
+			{ character: '∫', title: t( 'Integral' ) },
+			{ character: '∑', title: t( 'N-ary summation' ) },
+			{ character: '∞', title: t( 'Infinity' ) },
+			{ character: '√', title: t( 'Square root' ) },
+			{ character: '∼', title: t( 'Tilde operator' ) },
+			{ character: '≅', title: t( 'Approximately equal to' ) },
+			{ character: '≈', title: t( 'Almost equal to' ) },
+			{ character: '≠', title: t( 'Not equal to' ) },
+			{ character: '≡', title: t( 'Identical to' ) },
+			{ character: '∈', title: t( 'Element of' ) },
+			{ character: '∉', title: t( 'Not an element of' ) },
+			{ character: '∋', title: t( 'Contains as member' ) },
+			{ character: '∏', title: t( 'N-ary product' ) },
+			{ character: '∧', title: t( 'Logical and' ) },
+			{ character: '∨', title: t( 'Logical or' ) },
+			{ character: '¬', title: t( 'Not sign' ) },
+			{ character: '∩', title: t( 'Intersection' ) },
+			{ character: '∪', title: t( 'Union' ) },
+			{ character: '∂', title: t( 'Partial differential' ) },
+			{ character: '∀', title: t( 'For all' ) },
+			{ character: '∃', title: t( 'There exists' ) },
+			{ character: '∅', title: t( 'Empty set' ) },
+			{ character: '∇', title: t( 'Nabla' ) },
+			{ character: '∗', title: t( 'Asterisk operator' ) },
+			{ character: '∝', title: t( 'Proportional to' ) },
+			{ character: '∠', title: t( 'Angle' ) },
+			{ character: '¼', title: t( 'Vulgar fraction one quarter' ) },
+			{ character: '½', title: t( 'Vulgar fraction one half' ) },
+			{ character: '¾', title: t( 'Vulgar fraction three quarters' ) }
+		] );
+	}
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/src/specialcharacterstext.js

@@ -0,0 +1,69 @@
+/**
+ * @license Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module special-characters/specialcharacterstext
+ */
+
+import { Plugin } from '@ckeditor/ckeditor5-core';
+
+/**
+ * A plugin that provides special characters for the "Text" category.
+ *
+ *		ClassicEditor
+ *			.create( {
+ *				plugins: [ ..., SpecialCharacters, SpecialCharactersText ],
+ *			} )
+ *			.then( ... )
+ *			.catch( ... );
+ *
+ * @extends module:core/plugin~Plugin
+ */
+export default class SpecialCharactersText extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'SpecialCharactersText';
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const editor = this.editor;
+		const t = editor.t;
+
+		editor.plugins.get( 'SpecialCharacters' ).addItems( 'Text', [
+			{ character: '‹', title: t( 'Single left-pointing angle quotation mark' ) },
+			{ character: '›', title: t( 'Single right-pointing angle quotation mark' ) },
+			{ character: '«', title: t( 'Left-pointing double angle quotation mark' ) },
+			{ character: '»', title: t( 'Right-pointing double angle quotation mark' ) },
+			{ character: '‘', title: t( 'Left single quotation mark' ) },
+			{ character: '’', title: t( 'Right single quotation mark' ) },
+			{ character: '“', title: t( 'Left double quotation mark' ) },
+			{ character: '”', title: t( 'Right double quotation mark' ) },
+			{ character: '‚', title: t( 'Single low-9 quotation mark' ) },
+			{ character: '„', title: t( 'Double low-9 quotation mark' ) },
+			{ character: '¡', title: t( 'Inverted exclamation mark' ) },
+			{ character: '¿', title: t( 'Inverted question mark' ) },
+			{ character: '‥', title: t( 'Two dot leader' ) },
+			{ character: '…', title: t( 'Horizontal ellipsis' ) },
+			{ character: '‡', title: t( 'Double dagger' ) },
+			{ character: '‰', title: t( 'Per mille sign' ) },
+			{ character: '‱', title: t( 'Per ten thousand sign' ) },
+			{ character: '‼', title: t( 'Double exclamation mark' ) },
+			{ character: '⁈', title: t( 'Question exclamation mark' ) },
+			{ character: '⁉', title: t( 'Exclamation question mark' ) },
+			{ character: '⁇', title: t( 'Double question mark' ) },
+			{ character: '©', title: t( 'Copyright sign' ) },
+			{ character: '®', title: t( 'Registered sign' ) },
+			{ character: '™', title: t( 'Trade mark sign' ) },
+			{ character: '§', title: t( 'Section sign' ) },
+			{ character: '¶', title: t( 'Paragraph sign' ) },
+			{ character: '⁋', title: t( 'Reversed paragraph sign' ) }
+		] );
+	}
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/src/ui/charactergridview.js

@@ -0,0 +1,116 @@
+/**
+ * @license Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module special-characters/ui/charactergridview
+ */
+
+import { View, ButtonView } from '@ckeditor/ckeditor5-ui';
+
+import '../../theme/charactergrid.css';
+
+/**
+ * A grid of character tiles. It allows browsing special characters and selecting the character to
+ * be inserted into the content.
+ *
+ * @extends module:ui/view~View
+ */
+export default class CharacterGridView extends View {
+	/**
+	 * Creates an instance of a character grid containing tiles representing special characters.
+	 *
+	 * @param {module:utils/locale~Locale} locale The localization services instance.
+	 */
+	constructor( locale ) {
+		super( locale );
+
+		/**
+		 * A collection of the child tile views. Each tile represents a particular character.
+		 *
+		 * @readonly
+		 * @member {module:ui/viewcollection~ViewCollection}
+		 */
+		this.tiles = this.createCollection();
+
+		this.setTemplate( {
+			tag: 'div',
+			children: [
+				{
+					tag: 'div',
+					attributes: {
+						class: [
+							'ck',
+							'ck-character-grid__tiles'
+						]
+					},
+					children: this.tiles
+				}
+			],
+			attributes: {
+				class: [
+					'ck',
+					'ck-character-grid'
+				]
+			}
+		} );
+
+		/**
+		 * Fired when any of {@link #tiles grid tiles} is clicked.
+		 *
+		 * @event execute
+		 * @param {Object} data Additional information about the event.
+		 * @param {String} data.name The name of the tile that caused the event (e.g. "greek small letter epsilon").
+		 * @param {String} data.character A human-readable character displayed as the label (e.g. "ε").
+		 */
+
+		/**
+		 * Fired when a mouse or another pointing device caused the cursor to move onto any {@link #tiles grid tile}
+		 * (similar to the native `mouseover` DOM event).
+		 *
+		 * @event tileHover
+		 * @param {Object} data Additional information about the event.
+		 * @param {String} data.name The name of the tile that caused the event (e.g. "greek small letter epsilon").
+		 * @param {String} data.character A human-readable character displayed as the label (e.g. "ε").
+		 */
+	}
+
+	/**
+	 * Creates a new tile for the grid.
+	 *
+	 * @param {String} character A human-readable character displayed as the label (e.g. "ε").
+	 * @param {String} name The name of the character (e.g. "greek small letter epsilon").
+	 * @returns {module:ui/button/buttonview~ButtonView}
+	 */
+	createTile( character, name ) {
+		const tile = new ButtonView( this.locale );
+
+		tile.set( {
+			label: character,
+			withText: true,
+			class: 'ck-character-grid__tile'
+		} );
+
+		// Labels are vital for the users to understand what character they're looking at.
+		// For now we're using native title attribute for that, see #5817.
+		tile.extendTemplate( {
+			attributes: {
+				title: name
+			},
+			on: {
+				mouseover: tile.bindTemplate.to( 'mouseover' )
+			}
+		} );
+
+		tile.on( 'mouseover', () => {
+			this.fire( 'tileHover', { name, character } );
+		} );
+
+		tile.on( 'execute', () => {
+			this.fire( 'execute', { name, character } );
+		} );
+
+		return tile;
+	}
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/src/ui/characterinfoview.js

@@ -0,0 +1,111 @@
+/**
+ * @license Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module special-characters/ui/characterinfoview
+ */
+
+import { View } from '@ckeditor/ckeditor5-ui';
+
+import '../../theme/characterinfo.css';
+
+/**
+ * The view displaying detailed information about a special character glyph, e.g. upon
+ * hovering it with a mouse.
+ *
+ * @extends module:ui/view~View
+ */
+export default class CharacterInfoView extends View {
+	constructor( locale ) {
+		super( locale );
+
+		const bind = this.bindTemplate;
+
+		/**
+		 * The character whose information is displayed by the view. For instance,
+		 * "∑" or "¿".
+		 *
+		 * @observable
+		 * @member {String|null} #character
+		 */
+		this.set( 'character', null );
+
+		/**
+		 * The name of the {@link #character}. For instance,
+		 * "N-ary summation" or "Inverted question mark".
+		 *
+		 * @observable
+		 * @member {String|null} #name
+		 */
+		this.set( 'name', null );
+
+		/**
+		 * The "Unicode string" of the {@link #character}. For instance,
+		 * "U+0061".
+		 *
+		 * @observable
+		 * @readonly
+		 * @member {String} #code
+		 */
+		this.bind( 'code' ).to( this, 'character', characterToUnicodeString );
+
+		this.setTemplate( {
+			tag: 'div',
+			children: [
+				{
+					tag: 'span',
+					attributes: {
+						class: [
+							'ck-character-info__name'
+						]
+					},
+					children: [
+						{
+							// Note: ZWSP to prevent vertical collapsing.
+							text: bind.to( 'name', name => name ? name : '\u200B' )
+						}
+					]
+				},
+				{
+					tag: 'span',
+					attributes: {
+						class: [
+							'ck-character-info__code'
+						]
+					},
+					children: [
+						{
+							text: bind.to( 'code' )
+						}
+					]
+				}
+			],
+			attributes: {
+				class: [
+					'ck',
+					'ck-character-info'
+				]
+			}
+		} );
+	}
+}
+
+// Converts a character into a "Unicode string", for instance:
+//
+//	"$" -> "U+0024"
+//
+// Returns an empty string when the character is `null`.
+//
+// @param {String} character
+// @returns {String}
+function characterToUnicodeString( character ) {
+	if ( character === null ) {
+		return '';
+	}
+
+	const hexCode = character.codePointAt( 0 ).toString( 16 );
+
+	return 'U+' + ( '0000' + hexCode ).slice( -4 );
+}

package/src/assets/qms-ckeditor-plugin/src/plugins/ckeditor5-special-characters/src/ui/specialcharactersnavigationview.js

@@ -0,0 +1,127 @@
+/**
+ * @license Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module special-characters/ui/specialcharactersnavigationview
+ */
+
+import { Collection } from '@ckeditor/ckeditor5-utils';
+import { Model, FormHeaderView, createDropdown, addListToDropdown } from '@ckeditor/ckeditor5-ui';
+
+/**
+ * A class representing the navigation part of the special characters UI. It is responsible
+ * for describing the feature and allowing the user to select a particular character group.
+ *
+ * @extends module:ui/formheader/formheaderview~FormHeaderView
+ */
+export default class SpecialCharactersNavigationView extends FormHeaderView {
+	/**
+	 * Creates an instance of the {@link module:special-characters/ui/specialcharactersnavigationview~SpecialCharactersNavigationView}
+	 * class.
+	 *
+	 * @param {module:utils/locale~Locale} locale The localization services instance.
+	 * @param {Iterable.<String>} groupNames The names of the character groups.
+	 */
+	constructor( locale, groupNames ) {
+		super( locale );
+
+		const t = locale.t;
+
+		this.set( 'class', 'ck-special-characters-navigation' );
+
+		/**
+		 * A dropdown that allows selecting a group of special characters to be displayed.
+		 *
+		 * @member {module:ui/dropdown/dropdownview~DropdownView}
+		 */
+		this.groupDropdownView = this._createGroupDropdown( groupNames );
+		this.groupDropdownView.panelPosition = locale.uiLanguageDirection === 'rtl' ? 'se' : 'sw';
+
+		/**
+		 * @inheritDoc
+		 */
+		this.label = t( 'Special characters' );
+
+		/**
+		 * @inheritDoc
+		 */
+		this.children.add( this.groupDropdownView );
+	}
+
+	/**
+	 * Returns the name of the character group currently selected in the {@link #groupDropdownView}.
+	 *
+	 * @type {String}
+	 */
+	get currentGroupName() {
+		return this.groupDropdownView.value;
+	}
+
+	/**
+	 * Returns a dropdown that allows selecting character groups.
+	 *
+	 * @private
+	 * @param {Iterable.<String>} groupNames The names of the character groups.
+	 * @returns {module:ui/dropdown/dropdownview~DropdownView}
+	 */
+	_createGroupDropdown( groupNames ) {
+		const locale = this.locale;
+		const t = locale.t;
+		const dropdown = createDropdown( locale );
+		const groupDefinitions = this._getCharacterGroupListItemDefinitions( dropdown, groupNames );
+
+		dropdown.set( 'value', groupDefinitions.first.model.label );
+
+		dropdown.buttonView.bind( 'label' ).to( dropdown, 'value' );
+
+		dropdown.buttonView.set( {
+			isOn: false,
+			withText: true,
+			tooltip: t( 'Character categories' ),
+			class: [ 'ck-dropdown__button_label-width_auto' ]
+		} );
+
+		dropdown.on( 'execute', evt => {
+			dropdown.value = evt.source.label;
+		} );
+
+		dropdown.delegate( 'execute' ).to( this );
+
+		addListToDropdown( dropdown, groupDefinitions );
+
+		return dropdown;
+	}
+
+	/**
+	 * Returns list item definitions to be used in the character group dropdown
+	 * representing specific character groups.
+	 *
+	 * @private
+	 * @param {module:ui/dropdown/dropdownview~DropdownView} dropdown
+	 * @param {Iterable.<String>} groupNames The names of the character groups.
+	 * @returns {Iterable.<module:ui/dropdown/utils~ListDropdownItemDefinition>}
+	 */
+	_getCharacterGroupListItemDefinitions( dropdown, groupNames ) {
+		const groupDefs = new Collection();
+
+		for ( const name of groupNames ) {
+			const definition = {
+				type: 'button',
+				model: new Model( {
+					label: name,
+					withText: true
+				} )
+			};
+
+			definition.model.bind( 'isOn' ).to( dropdown, 'value', value => {
+				return value === definition.model.label;
+			} );
+
+			groupDefs.add( definition );
+		}
+
+		return groupDefs;
+	}
+}