@ckeditor/ckeditor5-template/src/template.d.ts

Template feature for CKEditor 5.

/**
 * @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
 */
/**
 * @module template/template
 * @publicApi
 */
import { Plugin } from 'ckeditor5/src/core.js';
import TemplateEditing from './templateediting.js';
import TemplateUI from './templateui.js';
/**
 * The template feature.
 *
 * For a detailed overview, check the {@glink features/template Content templates} feature guide.
 */
export default class Template extends Plugin {
    /**
     * @inheritDoc
     */
    static get requires(): readonly [typeof TemplateEditing, typeof TemplateUI];
    /**
     * @inheritDoc
     */
    static get pluginName(): "Template";
    /**
     * @inheritDoc
     */
    static get isOfficialPlugin(): true;
    /**
     * @inheritDoc
     */
    static get isPremiumPlugin(): true;
}
/**
 * The configuration of the template feature.
 *
 * ```ts
 * ClassicEditor
 *	.create( {
 * 		template: ... // Template feature configuration.
 *	} )
 *	.then( ... )
 *	.catch( ... );
 *```
 * See {@link module:core/editor/editorconfig~EditorConfig all editor options}.
 */
export interface TemplateConfig {
    /**
     * A list of all template definitions to be displayed in the `'insertTemplate'` UI dropdown.
     *
     * An example configuration:
     *
     * ```json
     * {
     * 	template: {
     * 		definitions: [
     * 			{
     * 				title: 'Issue acknowledgement (plain text)',
     * 				data: 'Dear customer, thank you for your report! The issue is currently being worked on by our development team.'
     * 			},
     * 			{
     * 				title: 'Signature (multi-line)',
     * 				data: '<p><b>Jane Doe</b></p><p>Marketing Specialist at <a href="https://example.com>Example.com</a></p>',
     * 				description: 'Author signature with the link to the website.'
     * 			},
     * 			{
     * 				title: 'Example table',
     * 				data: '<table><tr><td>Cell #1</td><td></td></tr><tr><td></td><td>Cell #2</td></tr></table>',
     * 				icon: '<svg viewBox="0 0 45 45" xmlns="http://www.w3.org/2000/svg">...</svg>',
     * 				description: 'This template inserts a table.'
     * 			},
     * 			{
     * 				title: 'Insert userAgent data',
     * 				data: navigator.userAgent
     * 			},
     * 			{
     * 				title: 'Insert translate to English link (function)',
     * 				data: () => '<a href="' + location.href + '/en" title="Translate to English">Translate to English</a>'
     * 			},
     * 			// ...
     * 		]
     * 	}
     * }
     * ```
     */
    definitions?: Array<TemplateDefinition>;
}
/**
 * An object describing a single template definition.
 *
 * ```json
 * {
 * // Mandatory fields:
 * 	title: 'Example template',
 * 	data: '<table><tr><td>Cell #1</td><td></td></tr><tr><td></td><td>Cell #2</td></tr></table>',
 *
 * 	// Optional configuration:
 * 	icon: '<svg viewBox="0 0 45 45" xmlns="http://www.w3.org/2000/svg">...</svg>',
 * 	description: 'This template inserts a table.'
 * }
 * ```
 */
export type TemplateDefinition = {
    /**
     * The title of the template.
     */
    title: string;
    /**
     * An HTML string to be inserted into the document or a callback function that returns an HTML string
     * to be inserted into the document when the template is selected.
     */
    data: (() => string) | string;
    /**
     * An optional SVG string representing the icon of the template. The default size of the icon is 45x45 pixels.
     * Be sure to set the correct `viewBox` attribute in the icon source. If not provided, a generic icon will be used instead.
     */
    icon?: string;
    /**
     * An optional long description of the template presented to the users.
     */
    description?: string;
};