CKEditor Ecosystem Documentation
Search
Home/CKEditor 5/API
Interface

AIAssistantConfig (ai)

@ckeditor/ckeditor5-ai/src/aiassistant

interface

The configuration of the AI Assistant feature.

The properties defined in this config are set in the config.ai.aiAssistant namespace.

ClassicEditor
	.create( editorElement, {
		ai: {
		    aiAssistant: {
		        // AI Assistant configuration.
		    }
		}
	} )
	.then( ... )
	.catch( ... );

See the full AI configuration.

See all editor options.

Filtering

Properties

  • commands : Array<GroupDefinition> | undefined

    A list of all AI commands groups definitions to be displayed in the 'aiCommands' UI dropdown.

    Setting this property will overwrite the default list of predefined commands.

    The default configuration is as follows. It can be obtained through getDefaultCommands:

    [ {
	groupId: 'editOrReview',
	groupLabel: 'Edit or review',
	commands: [
		{
			id: 'improveWriting',
			label: 'Improve writing',
			prompt: 'Fix spelling mistakes, use proper grammar and apply good writing practices. Do not lose the original meaning.'
		},
		{
			id: 'makeShorter',
			label: 'Make shorter',
			prompt: 'Remove any repetitive, redundant, or non-essential writing in this content ' +
				'without changing the meaning or losing any key information.'
		},
		{
			id: 'makeLonger',
			label: 'Make longer',
			prompt: 'Improve this content by using descriptive language and inserting more information and more detailed explanations.'
		},
		{
			id: 'simplifyLanguage',
			label: 'Simplify language',
			prompt: 'Simplify the writing style of this content ' +
				'and reduce the complexity, so that the content is easy to understand.'
		}
	]
},
{
	groupId: 'generate',
	groupLabel: 'Generate from selection',
	commands: [
		{
			id: 'summarize',
			label: 'Summarize',
			prompt: 'Summarize this content into one paragraph of text. Include only the key ideas and conclusions. Keep it short. '
		},
		{
			id: 'continue',
			label: 'Continue',
			prompt: 'Start with the provided content and write at the end of it continuing this topic. Keep the added part short.'
		}
	]
},
{
	groupId: 'changeTone',
	groupLabel: 'Change tone',
	commands: [
		{
			id: 'professional',
			label: 'Professional',
			prompt: 'Improve using polished, formal, and respectful language ' +
				'to convey professional expertise and competence.'
		},
		{
			id: 'casual',
			label: 'Casual',
			prompt: 'Improve using casual, informal language to convey a casual conversation with a real person.'
		},
		{
			id: 'direct',
			label: 'Direct',
			prompt: 'Improve using direct language using only the essential information.'
		},
		{
			id: 'confident',
			label: 'Confident',
			prompt: 'Improve using compelling, optimistic language to convey confidence in the writing.'
		},
		{
			id: 'friendly',
			label: 'Friendly',
			prompt: 'Improve using friendly, comforting language, to convey understanding and empathy.'
		}
	]
},
{
	groupId: 'changeStyle',
	groupLabel: 'Change style',
	commands: [
		{
			id: 'business',
			label: 'Business',
			prompt: 'Rewrite this content as a business professional with formal language.'
		},
		{
			id: 'legal',
			label: 'Legal',
			prompt: 'Rewrite this content as a legal professional using valid legal terminology.'
		},
		{
			id: 'journalism',
			label: 'Journalism',
			prompt: 'Rewrite this content as a journalist using engaging language to convey the importance of the information.'
		},
		{
			id: 'poetic',
			label: 'Poetic',
			prompt: 'Rewrite this content as a poem using poetic techniques without losing the original meaning.'
		}
	]
},
{
	groupId: 'translate',
	groupLabel: 'Translate',
	commands: [
		{
			id: 'translateEnglish',
			label: 'Translate to English',
			prompt: 'Translate the content to English language.'
		},
		{
			id: 'translateSpanish',
			label: 'Translate to Spanish',
			prompt: 'Translate the content to Spanish language.'
		},
		{
			id: 'translatePortuguese',
			label: 'Translate to Portuguese',
			prompt: 'Translate the content to Portuguese language.'
		},
		{
			id: 'translateGerman',
			label: 'Translate to German',
			prompt: 'Translate the content to German language.'
		},
		{
			id: 'translateFrench',
			label: 'Translate to French',
			prompt: 'Translate the content to French language.'
		},
		{
			id: 'translateChinese',
			label: 'Translate to Simplified Chinese',
			prompt: 'Translate the content to Simplified Chinese language.'
		},
		{
			id: 'translateHindi',
			label: 'Translate to Hindi',
			prompt: 'Translate the content to Hindi language.'
		},
		{
			id: 'translateArabic',
			label: 'Translate to Arabic',
			prompt: 'Translate the content to Arabic language.'
		}
	]
} ]

  • contentAreaCssClass : string | undefined

    An additional CSS class name (or names) added to the AI assistant content area (model response area).

    Because the content area is usually detached from the flow of the document, this configuration allows for better integration with application's stylesheets and improves the consistency of content styles.

  • disabledElements : Array<string> | undefined

    The AI assistant feature will be disabled if the document selection includes any of these elements.

    Use this property if AI assistant does not work properly with your custom features.

    Currently, by default, AI assistant is disabled for following model elements:

    • Media embed ('media') -- does not display in response area,
    • HTML embed ('rawHtml') -- sometimes does not display in response area, security uncertainty,
    • Table of contents ('tableOfContents') -- does not display properly in response area, long processing time.

    You can set this list to include more model elements or clear it to enable the above features.

    Note, that all or some of these features may become enabled in the future.

    Defaults to [ 'media', 'rawHtml', 'tableOfContents' ]

  • extraCommandGroups : Array<GroupDefinition> | undefined

    A list of additional AI commands groups definitions that will extend default commands.

    You can define new AI commands groups or add new AI commands to existing groups. If you add AI commands to an existing group, you do not need to specify groupLabel property. Use the (optional) order property to control the position of new groups and commands.

    An example configuration:

    {
	aiAssistant: {
		extraCommandGroups: [
			// Add an AI command to an existing group:
			{
				groupId: 'changeTone',
				commands: [
					{
						id: 'sad',
						label: 'Sad',
						prompt: 'Rewrite this text to make it sound sad and depressing.',
						// You can specify the position of this command among existing ones. Commands use zero-based numbering.
						order: 2
					}
				]
			},
			// Create a new AI commands group:
			{
				groupId: 'transformations',
				groupLabel: 'Transformations',
				// You can specify the position of this group among existing ones. Groups use zero-based numbering.
				order: 3,
				commands: [
					{
						id: 'addEmojis',
						label: 'Add emojis',
						prompt: 'Analyze each sentence of this text. After each sentence add an emoji that summarizes the sentence.'
					},
					// ...
				]
			},
		],
		// ...
	}
}

  • removeCommands : Array<string> | undefined

    A list of ids of AI commands to be removed.

    Learn more about command definition and its id.

    An example configuration:

    {
	aiAssistant: {
		removeCommands: [
			'improveWriting',
			// ...
		],
		// ...
	}
}