@ckeditor/ckeditor5-ui 48.8.1-alpha.4 → 49.0.0-alpha.0

package/dist/colorgrid/colortileview.d.ts

@@ -1,25 +1,25 @@
 /**
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
-import { type Locale } from '@ckeditor/ckeditor5-utils';
-import { ButtonView } from '../button/buttonview.js';
+* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
+* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+*/
+import { type Locale } from "@ckeditor/ckeditor5-utils";
+import { ButtonView } from "../button/buttonview.js";
 /**
- * This class represents a single color tile in the {@link module:ui/colorgrid/colorgridview~ColorGridView}.
- */
+* This class represents a single color tile in the {@link module:ui/colorgrid/colorgridview~ColorGridView}.
+*/
 export declare class ColorTileView extends ButtonView {
-    /**
-     * String representing a color shown as tile's background.
-     */
-    color: string | undefined;
-    /**
-     * A flag that toggles a special CSS class responsible for displaying
-     * a border around the button.
-     */
-    hasBorder: boolean;
-    constructor(locale?: Locale);
-    /**
-     * @inheritDoc
-     */
-    render(): void;
+	/**
+	* String representing a color shown as tile's background.
+	*/
+	color: string | undefined;
+	/**
+	* A flag that toggles a special CSS class responsible for displaying
+	* a border around the button.
+	*/
+	hasBorder: boolean;
+	constructor(locale?: Locale);
+	/**
+	* @inheritDoc
+	*/
+	override render(): void;
 }

package/dist/colorgrid/utils.d.ts

@@ -1,47 +1,59 @@
 /**
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
+* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
+* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+*/
 /**
- * @module ui/colorgrid/utils
- */
-import type { Locale } from '@ckeditor/ckeditor5-utils';
+* @module ui/colorgrid/utils
+*/
+import type { Locale } from "@ckeditor/ckeditor5-utils";
 export type ColorOption = string | {
-    color: string;
-    label?: string;
-    hasBorder?: boolean;
+	color: string;
+	label?: string;
+	hasBorder?: boolean;
 };
 export interface NormalizedColorOption {
-    model: string;
-    label: string;
-    hasBorder: boolean;
-    view: {
-        name: string;
-        styles: {
-            color: string;
-        };
-    };
+	model: string;
+	label: string;
+	hasBorder: boolean;
+	view: {
+		name: string;
+		styles: {
+			color: string;
+		};
+	};
 }
 /**
- * Returns color configuration options as defined in `editor.config.(fontColor|fontBackgroundColor).colors` or
- * `editor.config.table.(tableProperties|tableCellProperties).(background|border).colors
- * but processed to account for editor localization in the correct language.
- *
- * Note: The reason behind this method is that there is no way to use {@link module:utils/locale~Locale#t}
- * when the user configuration is defined because the editor does not exist yet.
- *
- * @param locale The {@link module:core/editor/editor~Editor#locale} instance.
- */
+* Returns color configuration options as defined in `editor.config.(fontColor|fontBackgroundColor).colors` or
+* `editor.config.table.(tableProperties|tableCellProperties).(background|border).colors
+* but processed to account for editor localization in the correct language.
+*
+* Note: The reason behind this method is that there is no way to use {@link module:utils/locale~Locale#t}
+* when the user configuration is defined because the editor does not exist yet.
+*
+* @param locale The {@link module:core/editor/editor~Editor#locale} instance.
+*/
 export declare function getLocalizedColorOptions(locale: Locale, options: Array<NormalizedColorOption>): Array<NormalizedColorOption>;
 /**
- * Creates a unified color definition object from color configuration options.
- * The object contains the information necessary to both render the UI and initialize the conversion.
- */
+* Returns the localized name of a color, as displayed next to a color tile or in a suggestion description.
+*
+* Labels of shaded palettes follow the `<hue> <shade>` pattern, for instance `Blue grey 700`. Such a label is
+* translated hue by hue, so a palette built of shades does not need a dictionary entry for every shade. A label
+* whose hue is unknown is returned unchanged.
+*
+* @internal
+* @param locale The {@link module:core/editor/editor~Editor#locale} instance.
+* @param label The color label to translate.
+*/
+export declare function getLocalizedColorName(locale: Locale, label: string): string;
+/**
+* Creates a unified color definition object from color configuration options.
+* The object contains the information necessary to both render the UI and initialize the conversion.
+*/
 export declare function normalizeColorOptions(options: Array<ColorOption>): Array<NormalizedColorOption>;
 /**
- * Creates a normalized color definition from the user-defined configuration.
- * The "normalization" means it will create full
- * {@link module:ui/colorgrid/colorgridview~ColorDefinition `ColorDefinition-like`}
- * object for string values, and add a `view` property, for each definition.
- */
+* Creates a normalized color definition from the user-defined configuration.
+* The "normalization" means it will create full
+* {@link module:ui/colorgrid/colorgridview~ColorDefinition `ColorDefinition-like`}
+* object for string values, and add a `view` property, for each definition.
+*/
 export declare function normalizeSingleColorDefinition(color: ColorOption): NormalizedColorOption;

package/dist/colorpicker/colorpickerview.d.ts

@@ -1,173 +1,170 @@
 /**
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
+* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
+* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+*/
 /**
- * @module ui/colorpicker/colorpickerview
- */
-import { type ColorPickerViewConfig } from './utils.js';
-import type { HexColor } from '@ckeditor/ckeditor5-core';
-import { type Locale } from '@ckeditor/ckeditor5-utils';
-import { View } from '../view.js';
-import { type InputTextView } from '../inputtext/inputtextview.js';
-import { type ViewCollection } from '../viewcollection.js';
-import { LabeledFieldView } from '../labeledfield/labeledfieldview.js';
-import { HexBase } from 'vanilla-colorful/lib/entrypoints/hex';
-import '../../theme/components/colorpicker/colorpicker.css';
+* @module ui/colorpicker/colorpickerview
+*/
+import { type ColorPickerViewConfig } from "./utils.js";
+import type { HexColor } from "@ckeditor/ckeditor5-core";
+import { type Locale } from "@ckeditor/ckeditor5-utils";
+import { View } from "../view.js";
+import { type InputTextView } from "../inputtext/inputtextview.js";
+import { type ViewCollection } from "../viewcollection.js";
+import { LabeledFieldView } from "../labeledfield/labeledfieldview.js";
+import { HexBase } from "vanilla-colorful/lib/entrypoints/hex";
 declare global {
-    interface HTMLElementTagNameMap {
-        'hex-color-picker': HexBase;
-    }
+	interface HTMLElementTagNameMap {
+		"hex-color-picker": HexBase;
+	}
 }
 /**
- * A class which represents a color picker with an input field for defining custom colors.
- */
+* A class which represents a color picker with an input field for defining custom colors.
+*/
 export declare class ColorPickerView extends View {
-    /**
-     * Element with saturation and hue sliders.
-     */
-    picker: HexBase;
-    /**
-     * Container for a `#` sign prefix and an input for displaying and defining custom colors
-     * in HEX format.
-     */
-    hexInputRow: ColorPickerInputRowView;
-    /**
-     * Current color selected in the color picker. It can be set by the component itself
-     * (through the palette or input) or from the outside (e.g. to reflect the current selection color).
-     */
-    color: string;
-    /**
-     * List of slider views of the color picker.
-     */
-    slidersView: ViewCollection<SliderView>;
-    /**
-     * An internal representation of a color.
-     *
-     * Since the picker uses a hex format, that's how we store it.
-     *
-     * Since this is unified color format it won't fire a change event if color is changed
-     * from `#f00` to `#ff0000` (same value, different format).
-     *
-     * @observable
-     * @private
-     */
-    _hexColor: string;
-    /**
-     * Debounced function updating the `color` property in the component
-     * and firing the `ColorPickerColorSelectedEvent`. Executed whenever color in component
-     * is changed by the user interaction (through the palette or input).
-     *
-     * @private
-     */
-    private _debounceColorPickerEvent;
-    /**
-     * A reference to the configuration of the color picker specified in the constructor.
-     *
-     * @private
-     */
-    private _config;
-    /**
-     * Creates a view of color picker.
-     *
-     * @param locale
-     * @param config
-     */
-    constructor(locale: Locale | undefined, config?: ColorPickerViewConfig);
-    /**
-     * Renders color picker in the view.
-     */
-    render(): void;
-    /**
-     * Focuses the first pointer in color picker.
-     *
-     */
-    focus(): void;
-    /**
-     * Creates collection of sliders in color picker.
-     *
-     * @private
-     */
-    private _createSlidersView;
-    /**
-     * Creates input row for defining custom colors in color picker.
-     *
-     * @private
-     */
-    private _createInputRow;
-    /**
-     * Creates the input where user can type or paste the color in hex format.
-     *
-     * @private
-     */
-    private _createColorInput;
-    /**
-     * Validates the view and returns `false` when some fields are invalid.
-     */
-    isValid(): boolean;
-    /**
-     * Cleans up the supplementary error and information text of input inside the {@link #hexInputRow}
-     * bringing them back to the state when the form has been displayed for the first time.
-     *
-     * See {@link #isValid}.
-     */
-    resetValidationStatus(): void;
+	/**
+	* Element with saturation and hue sliders.
+	*/
+	picker: HexBase;
+	/**
+	* Container for a `#` sign prefix and an input for displaying and defining custom colors
+	* in HEX format.
+	*/
+	hexInputRow: ColorPickerInputRowView;
+	/**
+	* Current color selected in the color picker. It can be set by the component itself
+	* (through the palette or input) or from the outside (e.g. to reflect the current selection color).
+	*/
+	color: string;
+	/**
+	* List of slider views of the color picker.
+	*/
+	slidersView: ViewCollection<SliderView>;
+	/**
+	* An internal representation of a color.
+	*
+	* Since the picker uses a hex format, that's how we store it.
+	*
+	* Since this is unified color format it won't fire a change event if color is changed
+	* from `#f00` to `#ff0000` (same value, different format).
+	*
+	* @observable
+	* @private
+	*/
+	_hexColor: string;
+	/**
+	* Debounced function updating the `color` property in the component
+	* and firing the `ColorPickerColorSelectedEvent`. Executed whenever color in component
+	* is changed by the user interaction (through the palette or input).
+	*
+	* @private
+	*/
+	private _debounceColorPickerEvent;
+	/**
+	* A reference to the configuration of the color picker specified in the constructor.
+	*
+	* @private
+	*/
+	private _config;
+	/**
+	* Creates a view of color picker.
+	*
+	* @param locale
+	* @param config
+	*/
+	constructor(locale: Locale | undefined, config?: ColorPickerViewConfig);
+	/**
+	* Renders color picker in the view.
+	*/
+	override render(): void;
+	/**
+	* Focuses the first pointer in color picker.
+	*
+	*/
+	focus(): void;
+	/**
+	* Creates collection of sliders in color picker.
+	*
+	* @private
+	*/
+	private _createSlidersView;
+	/**
+	* Creates input row for defining custom colors in color picker.
+	*
+	* @private
+	*/
+	private _createInputRow;
+	/**
+	* Creates the input where user can type or paste the color in hex format.
+	*
+	* @private
+	*/
+	private _createColorInput;
+	/**
+	* Validates the view and returns `false` when some fields are invalid.
+	*/
+	isValid(): boolean;
+	/**
+	* Cleans up the supplementary error and information text of input inside the {@link #hexInputRow}
+	* bringing them back to the state when the form has been displayed for the first time.
+	*
+	* See {@link #isValid}.
+	*/
+	resetValidationStatus(): void;
 }
 export declare class SliderView extends View {
-    /**
-     * @param element HTML element of slider in color picker.
-     */
-    constructor(element: HTMLElement);
-    /**
-     * Focuses element.
-     */
-    focus(): void;
+	/**
+	* @param element HTML element of slider in color picker.
+	*/
+	constructor(element: HTMLElement);
+	/**
+	* Focuses element.
+	*/
+	focus(): void;
 }
 export declare class ColorPickerInputRowView extends View {
-    /**
-     * A collection of row items (buttons, dropdowns, etc.).
-     */
-    readonly children: ViewCollection;
-    /**
-     * Hex input view element.
-     */
-    readonly inputView: LabeledFieldView<InputTextView>;
-    /**
-     * Creates an instance of the form row class.
-     *
-     * @param locale The locale instance.
-     * @param inputView Hex color input element.
-     */
-    constructor(locale: Locale, inputView: LabeledFieldView<InputTextView>);
-    /**
-     * Returns false if color input value is not in hex format.
-     */
-    getParsedColor(): HexColor | null;
+	/**
+	* A collection of row items (buttons, dropdowns, etc.).
+	*/
+	readonly children: ViewCollection;
+	/**
+	* Hex input view element.
+	*/
+	readonly inputView: LabeledFieldView<InputTextView>;
+	/**
+	* Creates an instance of the form row class.
+	*
+	* @param locale The locale instance.
+	* @param inputView Hex color input element.
+	*/
+	constructor(locale: Locale, inputView: LabeledFieldView<InputTextView>);
+	/**
+	* Returns false if color input value is not in hex format.
+	*/
+	getParsedColor(): HexColor | null;
 }
 /**
- * An event fired whenever the color was selected through the color picker palette
- * or the color picker input.
- *
- * This even fires only when the user changes the color. It does not fire when the color
- * is changed programmatically, e.g. via
- * {@link module:ui/colorpicker/colorpickerview~ColorPickerView#color}.
- *
- * @eventName ~ColorPickerView#colorSelected
- */
+* An event fired whenever the color was selected through the color picker palette
+* or the color picker input.
+*
+* This even fires only when the user changes the color. It does not fire when the color
+* is changed programmatically, e.g. via
+* {@link module:ui/colorpicker/colorpickerview~ColorPickerView#color}.
+*
+* @eventName ~ColorPickerView#colorSelected
+*/
 export type ColorPickerColorSelectedEvent = {
-    name: 'colorSelected';
-    args: [
-        {
-            color: string;
-        }
-    ];
+	name: "colorSelected";
+	args: [{
+		color: string;
+	}];
 };
 /**
- * Trim spaces from provided color and check if hex is valid.
- *
- * @param color Unsafe color string.
- * @returns Null if provided color is not hex value.
- * @export
- * @internal
- */
+* Trim spaces from provided color and check if hex is valid.
+*
+* @param color Unsafe color string.
+* @returns Null if provided color is not hex value.
+* @export
+* @internal
+*/
 export declare function tryParseHexColor<S extends string>(color: S | null | undefined): HexColor<S> | null;

package/dist/colorpicker/utils.d.ts

@@ -1,51 +1,51 @@
 /**
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
+* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
+* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+*/
 /**
- * Color formats handled by color converter.
- */
-export type ColorPickerOutputFormat = 'hex' | 'rgb' | 'hsl' | 'hwb' | 'lab' | 'lch';
+* Color formats handled by color converter.
+*/
+export type ColorPickerOutputFormat = "hex" | "rgb" | "hsl" | "hwb" | "lab" | "lch";
 /**
- * Configuration of the color picker feature.
- *
- * It can be forced to apply colors in the editor in a particular format.
- *
- * @default `{
- * 	format: 'hsl'
- * }`
- */
+* Configuration of the color picker feature.
+*
+* It can be forced to apply colors in the editor in a particular format.
+*
+* @default `{
+* 	format: 'hsl'
+* }`
+*/
 export type ColorPickerConfig = {
-    format?: ColorPickerOutputFormat;
+	format?: ColorPickerOutputFormat;
 };
 /**
- * Configuration of the color picker view.
- *
- * It can be used to enforce a particular color format or hide the color input.
- */
+* Configuration of the color picker view.
+*
+* It can be used to enforce a particular color format or hide the color input.
+*/
 export type ColorPickerViewConfig = ColorPickerConfig & {
-    hideInput?: boolean;
+	hideInput?: boolean;
 };
 /**
- * Parses and converts the color string to requested format. Handles variety of color spaces
- * like `hsl`, `hex` or `rgb`.
- *
- * @param color
- * @returns A color string.
- * @internal
- */
+* Parses and converts the color string to requested format. Handles variety of color spaces
+* like `hsl`, `hex` or `rgb`.
+*
+* @param color
+* @returns A color string.
+* @internal
+*/
 export declare function convertColor(color: string, outputFormat: ColorPickerOutputFormat): string;
 /**
- * Converts a color string to hex format.
- *
- * @param color
- * @returns A color string.
- * @internal
- */
+* Converts a color string to hex format.
+*
+* @param color
+* @returns A color string.
+* @internal
+*/
 export declare function convertToHex(color: string): string;
 /**
- * Registers the custom element in the
- * [CustomElementsRegistry](https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry).
- * @internal
- */
+* Registers the custom element in the
+* [CustomElementsRegistry](https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry).
+* @internal
+*/
 export declare function registerCustomElement(elementName: string, constructor: CustomElementConstructor): void;