@ckeditor/ckeditor5-template
Version:
Template feature for CKEditor 5.
102 lines (101 loc) • 3.5 kB
TypeScript
/**
* @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
*/
import { ButtonView, HighlightedTextView, View } from 'ckeditor5/src/ui.js';
import type { Locale } from 'ckeditor5/src/utils.js';
import type { TemplateDefinition } from '../template.js';
/**
* A class representing an individual button (template) in the list. Renders a rich preview of the template option.
*
* @protected
*/
export default class TemplateListButtonView extends ButtonView {
/**
* The definition of the template that the button will apply when executed.
*
* @readonly
*/
templateDefinition: TemplateDefinition;
/**
* The view rendering the text part of the template definition.
*
* @protected
* @readonly
*/
textPartView: TextPartView | null;
/**
* Creates an instance of the {@link module:template/ui/templatelistbuttonview~TemplateListButtonView} class.
*
* @param locale The localization services instance.
* @param templateDefinition The definition of the template.
*/
constructor(locale: Locale, templateDefinition: TemplateDefinition);
/**
* @inheritDoc
*/
render(): void;
destroy(): void;
/**
* Tells whether the `title` or `description` of the {@link #templateDefinition} match against the provided regular expression.
*
* @param regExp A regular expression to match the definition against.
* @returns When the match is positive, an object with the `title` and `description` keys is returned that describes
* the match. Otherwise, this method returns `null`.
*/
isMatching(regExp: RegExp): object | null;
/**
* Highlights a subset of the {@link #textPartView} text according to a specified regular expression. When `null` is passed,
* the highlighting is turned off.
*
* @param regExp A regular expression used to highlight the matching text in the {@link #textPartView}.
*/
highlightText(regExp: RegExp | null): void;
}
/**
* A view representing the title and the description of the template.
*
* @protected
*/
export declare class TextPartView extends View {
/**
* The title text of the template.
*
* @readonly
*/
title: string;
/**
* The description text of the template.
*
* @readonly
*/
description: string | undefined;
/**
* Renders the title text of a template.
*
* **Note**: It acts as a label of the entire button in the context of accessibility.
*
* @readonly
*/
titleView: HighlightedTextView;
/**
* Renders the description text of a template.
*
* @readonly
*/
descriptionView: HighlightedTextView;
/**
* Creates an instance of the text part view.
*
* @param locale The {@link module:core/editor/editor~Editor#locale} instance.
* @param templateDefinition The definition of the template.
* @param labelId A unique ID that connects the entire button with the {@link #titleView} in the context of accessibility.
*/
constructor(locale: Locale, templateDefinition: TemplateDefinition, labelId: string);
/**
* Highlights a subset of the {@link #titleView} and {@link #descriptionView} text according to a specified regular expression.
*
* @param regExp
*/
highlightText(regExp: RegExp | null): void;
}