@ckeditor/ckeditor5-font 36.0.1 → 37.0.0-alpha.0

package/src/fontsize/utils.js

@@ -2,194 +2,165 @@
  * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
-
 /**
  * @module font/fontsize/utils
  */
-
 import { CKEditorError } from 'ckeditor5/src/utils';
-
 /**
- * Normalizes and translates the {@link module:font/fontsize~FontSizeConfig#options configuration options}
- * to the {@link module:font/fontsize~FontSizeOption} format.
+ * Normalizes and translates the {@link module:font/fontconfig~FontSizeConfig#options configuration options}
+ * to the {@link module:font/fontconfig~FontSizeOption} format.
  *
- * @param {Array.<String|Number|Object>} configuredOptions An array of options taken from the configuration.
- * @returns {Array.<module:font/fontsize~FontSizeOption>}
+ * @param configuredOptions An array of options taken from the configuration.
  */
-export function normalizeOptions( configuredOptions ) {
-	// Convert options to objects.
-	return configuredOptions
-		.map( item => getOptionDefinition( item ) )
-		// Filter out undefined values that `getOptionDefinition` might return.
-		.filter( option => !!option );
+export function normalizeOptions(configuredOptions) {
+    // Convert options to objects.
+    return configuredOptions
+        .map(item => getOptionDefinition(item))
+        // Filter out undefined values that `getOptionDefinition` might return.
+        .filter((option) => option !== undefined);
 }
-
 // Default named presets map. Always create a new instance of the preset object in order to avoid modifying references.
 const namedPresets = {
-	get tiny() {
-		return {
-			title: 'Tiny',
-			model: 'tiny',
-			view: {
-				name: 'span',
-				classes: 'text-tiny',
-				priority: 7
-			}
-		};
-	},
-	get small() {
-		return {
-			title: 'Small',
-			model: 'small',
-			view: {
-				name: 'span',
-				classes: 'text-small',
-				priority: 7
-			}
-		};
-	},
-	get big() {
-		return {
-			title: 'Big',
-			model: 'big',
-			view: {
-				name: 'span',
-				classes: 'text-big',
-				priority: 7
-			}
-		};
-	},
-	get huge() {
-		return {
-			title: 'Huge',
-			model: 'huge',
-			view: {
-				name: 'span',
-				classes: 'text-huge',
-				priority: 7
-			}
-		};
-	}
+    get tiny() {
+        return {
+            title: 'Tiny',
+            model: 'tiny',
+            view: {
+                name: 'span',
+                classes: 'text-tiny',
+                priority: 7
+            }
+        };
+    },
+    get small() {
+        return {
+            title: 'Small',
+            model: 'small',
+            view: {
+                name: 'span',
+                classes: 'text-small',
+                priority: 7
+            }
+        };
+    },
+    get big() {
+        return {
+            title: 'Big',
+            model: 'big',
+            view: {
+                name: 'span',
+                classes: 'text-big',
+                priority: 7
+            }
+        };
+    },
+    get huge() {
+        return {
+            title: 'Huge',
+            model: 'huge',
+            view: {
+                name: 'span',
+                classes: 'text-huge',
+                priority: 7
+            }
+        };
+    }
 };
-
-// Returns an option definition either from preset or creates one from number shortcut.
-// If object is passed then this method will return it without alternating it. Returns undefined for item than cannot be parsed.
-//
-// @param {String|Number|Object} item
-// @returns {undefined|module:font/fontsize~FontSizeOption}
-function getOptionDefinition( option ) {
-	// Check whether passed option is a full item definition provided by user in configuration.
-	if ( isFullItemDefinition( option ) ) {
-		return attachPriority( option );
-	}
-
-	const preset = findPreset( option );
-
-	// Item is a named preset.
-	if ( preset ) {
-		return attachPriority( preset );
-	}
-
-	// 'Default' font size. It will be used to remove the fontSize attribute.
-	if ( option === 'default' ) {
-		return {
-			model: undefined,
-			title: 'Default'
-		};
-	}
-
-	// At this stage we probably have numerical value to generate a preset so parse it's value.
-	// Discard any faulty values.
-	if ( isNumericalDefinition( option ) ) {
-		return;
-	}
-
-	// Return font size definition from size value.
-	return generatePixelPreset( option );
+/**
+ * Returns an option definition either from preset or creates one from number shortcut.
+ * If object is passed then this method will return it without alternating it. Returns undefined for item than cannot be parsed.
+ */
+function getOptionDefinition(option) {
+    if (typeof option === 'number') {
+        option = String(option);
+    }
+    // Check whether passed option is a full item definition provided by user in configuration.
+    if (typeof option === 'object' && isFullItemDefinition(option)) {
+        return attachPriority(option);
+    }
+    const preset = findPreset(option);
+    // Item is a named preset.
+    if (preset) {
+        return attachPriority(preset);
+    }
+    // 'Default' font size. It will be used to remove the fontSize attribute.
+    if (option === 'default') {
+        return {
+            model: undefined,
+            title: 'Default'
+        };
+    }
+    // At this stage we probably have numerical value to generate a preset so parse it's value.
+    // Discard any faulty values.
+    if (isNumericalDefinition(option)) {
+        return undefined;
+    }
+    // Return font size definition from size value.
+    return generatePixelPreset(option);
 }
-
-// Creates a predefined preset for pixel size.
-//
-// @param {Number} definition Font size in pixels.
-// @returns {module:font/fontsize~FontSizeOption}
-function generatePixelPreset( definition ) {
-	// Extend a short (numeric value) definition.
-	if ( typeof definition === 'number' || typeof definition === 'string' ) {
-		definition = {
-			title: String( definition ),
-			model: `${ parseFloat( definition ) }px`
-		};
-	}
-
-	definition.view = {
-		name: 'span',
-		styles: {
-			'font-size': definition.model
-		}
-	};
-
-	return attachPriority( definition );
+/**
+ * Creates a predefined preset for pixel size.
+ * @param definition Font size in pixels.
+ * @returns
+ */
+function generatePixelPreset(definition) {
+    // Extend a short (numeric value) definition.
+    if (typeof definition === 'string') {
+        definition = {
+            title: definition,
+            model: `${parseFloat(definition)}px`
+        };
+    }
+    definition.view = {
+        name: 'span',
+        styles: {
+            'font-size': definition.model
+        }
+    };
+    return attachPriority(definition);
 }
-
-// Adds the priority to the view element definition if missing. It's required due to ckeditor/ckeditor5#2291
-//
-// @param {Object} definition
-// @param {Object} definition.title
-// @param {Object} definition.model
-// @param {Object} definition.view
-// @returns {Object}
-function attachPriority( definition ) {
-	if ( !definition.view.priority ) {
-		definition.view.priority = 7;
-	}
-
-	return definition;
+/**
+ * Adds the priority to the view element definition if missing. It's required due to ckeditor/ckeditor5#2291
+ */
+function attachPriority(definition) {
+    if (definition.view && typeof definition.view !== 'string' && !definition.view.priority) {
+        definition.view.priority = 7;
+    }
+    return definition;
 }
-
-// Returns a prepared preset definition. If passed an object, a name of preset should be defined as `model` value.
-//
-// @param {String|Object} definition
-// @param {String} definition.model A preset name.
-// @returns {Object|undefined}
-function findPreset( definition ) {
-	return namedPresets[ definition ] || namedPresets[ definition.model ];
+/**
+ * Returns a prepared preset definition. If passed an object, a name of preset should be defined as `model` value.
+ *
+ * @param definition.model A preset name.
+ */
+function findPreset(definition) {
+    return typeof definition === 'string' ? namedPresets[definition] : namedPresets[definition.model];
 }
-
-// We treat `definition` as completed if it is an object that contains `title`, `model` and `view` values.
-//
-// @param {Object} definition
-// @param {String} definition.title
-// @param {String} definition.model
-// @param {Object} definition.view
-// @returns {Boolean}
-function isFullItemDefinition( definition ) {
-	return typeof definition === 'object' && definition.title && definition.model && definition.view;
+/**
+ * We treat `definition` as completed if it is an object that contains `title`, `model` and `view` values.
+ */
+function isFullItemDefinition(definition) {
+    return definition.title && definition.model && definition.view;
 }
-
-// We treat `definition` as numerical if it is a number, number-like (string) or an object with the `title` key.
-//
-// @param {Object|Number|String} definition
-// @param {Object} definition.title
-// @returns {Boolean}
-function isNumericalDefinition( definition ) {
-	let numberValue;
-
-	if ( typeof definition === 'object' ) {
-		if ( !definition.model ) {
-			/**
-			 * Provided value as an option for {@link module:font/fontsize~FontSize} seems to invalid.
-			 *
-			 * See valid examples described in the {@link module:font/fontsize~FontSizeConfig#options plugin configuration}.
-			 *
-			 * @error font-size-invalid-definition
-			 */
-			throw new CKEditorError( 'font-size-invalid-definition', null, definition );
-		} else {
-			numberValue = parseFloat( definition.model );
-		}
-	} else {
-		numberValue = parseFloat( definition );
-	}
-
-	return isNaN( numberValue );
+function isNumericalDefinition(definition) {
+    let numberValue;
+    if (typeof definition === 'object') {
+        if (!definition.model) {
+            /**
+             * Provided value as an option for {@link module:font/fontsize~FontSize} seems to invalid.
+             *
+             * See valid examples described in the {@link module:font/fontconfig~FontSizeConfig#options plugin configuration}.
+             *
+             * @error font-size-invalid-definition
+             */
+            throw new CKEditorError('font-size-invalid-definition', null, definition);
+        }
+        else {
+            numberValue = parseFloat(definition.model);
+        }
+    }
+    else {
+        numberValue = parseFloat(definition);
+    }
+    return isNaN(numberValue);
 }

package/src/fontsize.d.ts

@@ -0,0 +1,40 @@
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module font/fontsize
+ */
+import { Plugin, type PluginDependencies } from 'ckeditor5/src/core';
+import type { FontSizeOption } from './fontconfig';
+/**
+ * The font size plugin.
+ *
+ * For a detailed overview, check the {@glink features/font font feature} documentation
+ * and the {@glink api/font package page}.
+ *
+ * This is a "glue" plugin which loads the {@link module:font/fontsize/fontsizeediting~FontSizeEditing} and
+ * {@link module:font/fontsize/fontsizeui~FontSizeUI} features in the editor.
+ */
+export default class FontSize extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    static get requires(): PluginDependencies;
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): 'FontSize';
+    /**
+     * Normalizes and translates the {@link module:font/fontconfig~FontSizeConfig#options configuration options}
+     * to the {@link module:font/fontconfig~FontSizeOption} format.
+     *
+     * @param configuredOptions An array of options taken from the configuration.
+     */
+    normalizeSizeOptions(options: Array<string | number | FontSizeOption>): Array<FontSizeOption>;
+}
+declare module '@ckeditor/ckeditor5-core' {
+    interface PluginsMap {
+        [FontSize.pluginName]: FontSize;
+    }
+}

package/src/fontsize.js

@@ -2,16 +2,13 @@
  * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
-
 /**
  * @module font/fontsize
  */
-
 import { Plugin } from 'ckeditor5/src/core';
 import FontSizeEditing from './fontsize/fontsizeediting';
 import FontSizeUI from './fontsize/fontsizeui';
 import { normalizeOptions } from './fontsize/utils';
-
 /**
  * The font size plugin.
  *
@@ -20,144 +17,27 @@ import { normalizeOptions } from './fontsize/utils';
  *
  * This is a "glue" plugin which loads the {@link module:font/fontsize/fontsizeediting~FontSizeEditing} and
  * {@link module:font/fontsize/fontsizeui~FontSizeUI} features in the editor.
- *
- * @extends module:core/plugin~Plugin
  */
 export default class FontSize extends Plugin {
-	/**
-	 * @inheritDoc
-	 */
-	static get requires() {
-		return [ FontSizeEditing, FontSizeUI ];
-	}
-
-	/**
-	 * @inheritDoc
-	 */
-	static get pluginName() {
-		return 'FontSize';
-	}
-
-	/**
-	 * Normalizes and translates the {@link module:font/fontsize~FontSizeConfig#options configuration options}
-	 * to the {@link module:font/fontsize~FontSizeOption} format.
-	 *
-	 * @param {Array.<String|Number|Object>} configuredOptions An array of options taken from the configuration.
-	 * @returns {Array.<module:font/fontsize~FontSizeOption>}
-	 */
-	normalizeSizeOptions( options ) {
-		return normalizeOptions( options );
-	}
+    /**
+     * @inheritDoc
+     */
+    static get requires() {
+        return [FontSizeEditing, FontSizeUI];
+    }
+    /**
+     * @inheritDoc
+     */
+    static get pluginName() {
+        return 'FontSize';
+    }
+    /**
+     * Normalizes and translates the {@link module:font/fontconfig~FontSizeConfig#options configuration options}
+     * to the {@link module:font/fontconfig~FontSizeOption} format.
+     *
+     * @param configuredOptions An array of options taken from the configuration.
+     */
+    normalizeSizeOptions(options) {
+        return normalizeOptions(options);
+    }
 }
-
-/**
- * The font size option descriptor.
- *
- * @typedef {Object} module:font/fontsize~FontSizeOption
- *
- * @property {String} title The user-readable title of the option.
- * @property {String} model The attribute's unique value in the model.
- * @property {module:engine/view/elementdefinition~ElementDefinition} view View element configuration.
- * @property {Array.<module:engine/view/elementdefinition~ElementDefinition>} [upcastAlso] An array with all matched elements that
- * the view-to-model conversion should also accept.
- */
-
-/**
- * The configuration of the font size feature.
- * It is introduced by the {@link module:font/fontsize/fontsizeediting~FontSizeEditing} feature.
- *
- * Read more in {@link module:font/fontsize~FontSizeConfig}.
- *
- * @member {module:font/fontsize~FontSizeConfig} module:core/editor/editorconfig~EditorConfig#fontSize
- */
-
-/**
- * The configuration of the font size feature.
- * This option is used by the {@link module:font/fontsize/fontsizeediting~FontSizeEditing} feature.
- *
- * 		ClassicEditor
- * 			.create( {
- * 				fontSize: ... // Font size feature configuration.
- *			} )
- * 			.then( ... )
- * 			.catch( ... );
- *
- * See {@link module:core/editor/editorconfig~EditorConfig all editor options}.
- *
- * @interface module:font/fontsize~FontSizeConfig
- */
-
-/**
- * Available font size options. Expressed as predefined presets, numerical "pixel" values
- * or the {@link module:font/fontsize~FontSizeOption}.
- *
- * The default value is:
- *
- *		const fontSizeConfig = {
- *			options: [
- *				'tiny',
- * 				'small',
- * 				'default',
- * 				'big',
- * 				'huge'
- *			]
- *		};
- *
- * It defines 4 sizes: **tiny**, **small**, **big**, and **huge**. These values will be rendered as `<span>` elements in the view.
- * The **default** defines a text without the `fontSize` attribute.
- *
- * Each `<span>` has the the `class` attribute set to the corresponding size name. For instance, this is what the **small** size looks
- * like in the view:
- *
- * 		<span class="text-small">...</span>
- *
- * As an alternative, the font size might be defined using numerical values (either as a `Number` or as a `String`):
- *
- * 		const fontSizeConfig = {
- * 			options: [ 9, 10, 11, 12, 13, 14, 15 ]
- * 		};
- *
- * Also, you can define a label in the dropdown for numerical values:
- *
- *		const fontSizeConfig = {
- *			options: [
- *				{
- * 				 	title: 'Small',
- * 				 	model: '8px'
- * 				},
- * 				'default',
- * 				{
- * 				 	title: 'Big',
- * 				 	model: '14px'
- * 				}
- *			]
- *		};
- *
- * Font size can be applied using the command API. To do that, use the `'fontSize'` command and pass the desired font size as a `value`.
- * For example, the following code will apply the `fontSize` attribute with the **tiny** value to the current selection:
- *
- *		editor.execute( 'fontSize', { value: 'tiny' } );
- *
- * Executing the `fontSize` command without value will remove the `fontSize` attribute from the current selection.
- *
- * @member {Array.<String|Number|module:font/fontsize~FontSizeOption>} module:font/fontsize~FontSizeConfig#options
- */
-
-/**
- * By default the plugin removes any `font-size` value that does not match the plugin's configuration. It means that if you paste content
- * with font sizes that the editor does not understand, the `font-size` attribute will be removed and the content will be displayed
- * with the default size.
- *
- * You can preserve pasted font size values by switching the `supportAllValues` option to `true`:
- *
- *		const fontSizeConfig = {
- *			options: [ 9, 10, 11, 12, 'default', 14, 15 ],
- *			supportAllValues: true
- *		};
- *
- * **Note:** This option can only be used with numerical values as font size options.
- *
- * With this configuration font sizes not specified in the editor configuration will not be removed when pasting the content.
- *
- * @member {Boolean} module:font/fontsize~FontSizeConfig#supportAllValues
- */

package/src/index.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module font
+ */
+export { default as Font } from './font';
+export { default as FontBackgroundColor } from './fontbackgroundcolor';
+export { default as FontColor } from './fontcolor';
+export { default as FontFamily } from './fontfamily';
+export { default as FontSize } from './fontsize';
+export { default as FontBackgroundColorEditing } from './fontbackgroundcolor/fontbackgroundcolorediting';
+export { default as FontBackgroundColorUI } from './fontbackgroundcolor/fontbackgroundcolorui';
+export { default as FontColorEditing } from './fontcolor/fontcolorediting';
+export { default as FontColorUI } from './fontcolor/fontcolorui';
+export { default as FontFamilyEditing } from './fontfamily/fontfamilyediting';
+export { default as FontFamilyUI } from './fontfamily/fontfamilyui';
+export { default as FontSizeEditing } from './fontsize/fontsizeediting';
+export { default as FontSizeUI } from './fontsize/fontsizeui';

package/src/index.js

@@ -2,11 +2,9 @@
  * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
-
 /**
  * @module font
  */
-
 export { default as Font } from './font';
 export { default as FontBackgroundColor } from './fontbackgroundcolor';
 export { default as FontColor } from './fontcolor';