@ckeditor/ckeditor5-ai 46.1.1 → 47.0.0-alpha.1

package/src/index.js

@@ -20,4 +20,4 @@
  *
  *
  */
-(function(_0x52539d,_0x273379){var _0x3a3ff4=_0x3cc0,_0x29a296=_0x52539d();while(!![]){try{var _0x13d5c2=-parseInt(_0x3a3ff4(0x166))/0x1+-parseInt(_0x3a3ff4(0x167))/0x2+parseInt(_0x3a3ff4(0x16d))/0x3+parseInt(_0x3a3ff4(0x16c))/0x4+-parseInt(_0x3a3ff4(0x16b))/0x5*(-parseInt(_0x3a3ff4(0x169))/0x6)+parseInt(_0x3a3ff4(0x16e))/0x7+-parseInt(_0x3a3ff4(0x168))/0x8*(parseInt(_0x3a3ff4(0x16a))/0x9);if(_0x13d5c2===_0x273379)break;else _0x29a296['push'](_0x29a296['shift']());}catch(_0x24188e){_0x29a296['push'](_0x29a296['shift']());}}}(_0x584d,0xa796d));export{AIAssistant,getDefaultAICommands}from'./aiassistant.js';export{AIAssistantUI}from'./aiassistantui.js';export{AIAdapter,AIRequestError}from'./adapters/aiadapter.js';export{AITextAdapter}from'./adapters/aitextadapter.js';export{OpenAITextAdapter}from'./adapters/openaitextadapter.js';function _0x584d(){var _0x37c171=['2004072ovuHEh','2834235aANNqp','5914601UyhFfI','968609kooFtO','1356742BEiMPp','10517720IJdhpN','156AJpaZn','9yITHUp','261045SZLjpR'];_0x584d=function(){return _0x37c171;};return _0x584d();}export{AWSTextAdapter}from'./adapters/awstextadapter.js';function _0x3cc0(_0x12f895,_0x2fd53d){var _0x584d5e=_0x584d();return _0x3cc0=function(_0x3cc036,_0x1acb23){_0x3cc036=_0x3cc036-0x166;var _0x352874=_0x584d5e[_0x3cc036];return _0x352874;},_0x3cc0(_0x12f895,_0x2fd53d);}export{ShowAIAssistantCommand}from'./ui/showaiassistantcommand.js';import'./augmentation.js';
+(function(_0x222f78,_0xab8d27){var _0x4a01a4=_0x5181,_0x2b8f25=_0x222f78();while(!![]){try{var _0x22c89b=-parseInt(_0x4a01a4(0x106))/0x1+parseInt(_0x4a01a4(0x107))/0x2*(parseInt(_0x4a01a4(0x109))/0x3)+parseInt(_0x4a01a4(0x108))/0x4+parseInt(_0x4a01a4(0x104))/0x5+parseInt(_0x4a01a4(0x102))/0x6*(-parseInt(_0x4a01a4(0x103))/0x7)+parseInt(_0x4a01a4(0x105))/0x8*(-parseInt(_0x4a01a4(0x10a))/0x9)+-parseInt(_0x4a01a4(0x101))/0xa;if(_0x22c89b===_0xab8d27)break;else _0x2b8f25['push'](_0x2b8f25['shift']());}catch(_0x485f43){_0x2b8f25['push'](_0x2b8f25['shift']());}}}(_0x1318,0x27360));export{AIAssistant,getDefaultAICommands}from'./aiassistant/aiassistant.js';export{AIAssistantUI}from'./aiassistant/aiassistantui.js';export{AIAdapter,AIRequestError}from'./aiassistant/adapters/aiadapter.js';export{AITextAdapter}from'./aiassistant/adapters/aitextadapter.js';export{OpenAITextAdapter}from'./aiassistant/adapters/openaitextadapter.js';export{AWSTextAdapter}from'./aiassistant/adapters/awstextadapter.js';function _0x1318(){var _0x351ebd=['928952GHWIpj','5127mmNYfz','927jpavcm','1373730NcJGFB','2562CKaJHG','490GpbwsE','340595qhmfmb','5992FTkiPf','30350EySDzf','158aHYujt'];_0x1318=function(){return _0x351ebd;};return _0x1318();}export{ShowAIAssistantCommand}from'./aiassistant/ui/showaiassistantcommand.js';export{AITabs}from'./aitabs/aitabs.js';export{AIConnector}from'./aicore/aiconnector.js';export{createResizeButton}from'./aicore/utils/createresizebutton.js';export{AIChat}from'./aichat/aichat.js';export{AIChatController}from'./aichat/aichatcontroller.js';export{AIEditing}from'./aicore/aiediting.js';export{AIChatUI}from'./aichat/aichatui.js';function _0x5181(_0x254152,_0x5ebb1c){var _0x1318d2=_0x1318();return _0x5181=function(_0x51819c,_0x432d19){_0x51819c=_0x51819c-0x101;var _0x4496d1=_0x1318d2[_0x51819c];return _0x4496d1;},_0x5181(_0x254152,_0x5ebb1c);}export{AIChatHistory}from'./aichathistory/aichathistory.js';export{AIChatHistoryController}from'./aichathistory/aichathistorycontroller.js';export{AIChatHistoryUI}from'./aichathistory/aichathistoryui.js';export{AIQuickActions}from'./aiquickactions/aiquickactions.js';export{AIQuickActionsUI,AIQuickActionType}from'./aiquickactions/aiquickactionsui.js';export{AIActions}from'./aiactions/aiactions.js';export{AIBalloon}from'./aiballoon/aiballoon.js';export{AIReviewMode}from'./aireviewmode/aireviewmode.js';export{AIReviewModeController}from'./aireviewmode/aireviewmodecontroller.js';export{AIReviewModeEditing}from'./aireviewmode/aireviewmodeediting.js';export{AIReviewModeUI}from'./aireviewmode/aireviewmodeui.js';export{AIReviewCheck}from'./aireviewmode/model/aireviewcheck.js';export{AIReviewCheckResult}from'./aireviewmode/model/aireviewcheckresult.js';export{AIReviewCheckRun}from'./aireviewmode/model/aireviewcheckrun.js';import'./augmentation.js';

package/theme/aiballoon/aiballoon.css

@@ -0,0 +1,207 @@
+/*
+ * What you're currently looking at is the source code of a legally protected, proprietary software.
+ * CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
+ * all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
+ *
+ * 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
+ */
+
+:root {
+	/* Taken from old AI Assistant */
+	--ck-color-ai-selection: hsl(262.5, 60%, 90%);
+
+	/* Primary button */
+	--ck-ai-button-primary-color: hsla(0, 0%, 100%, 1);
+	--ck-ai-button-primary-disabled-color: hsla(0, 0%, 100%, 1);
+	--ck-ai-button-primary-background-color: hsla(263, 59%, 52%, 1);
+	--ck-ai-button-primary-disabled-background-color: hsla(263, 59%, 52%, 0.5);
+	--ck-ai-button-primary-hover-background-color: hsla(263, 59%, 40%, 1);
+
+	/* Secondary button */
+	--ck-ai-button-secondary-color: hsla(263, 59%, 52%, 1);
+	--ck-ai-button-secondary-disabled-color: hsla(263, 59%, 52%, 0.5);
+	--ck-ai-button-secondary-background-color: hsla(0, 0%, 100%, 1);
+	--ck-ai-button-secondary-disabled-background-color: hsla(0, 0%, 100%, 0.5);
+	--ck-ai-button-secondary-border-color: hsla(262, 51%, 80%, 1);
+	--ck-ai-button-secondary-disabled-border-color: hsla(262, 51%, 80%, 0.5);
+	--ck-ai-button-secondary-hover-background-color: hsla(262, 100%, 96%, 1);
+	--ck-ai-button-secondary-active-background-color: hsla(262, 100%, 96%, 1);
+}
+
+.ck.ai-balloon {
+	--ck-ai-balloon-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+	--ck-ai-balloon-disclaimer-text-color: hsla(0, 0%, 44%, 1);
+
+	.ck-dialog__content {
+		width: 580px;
+		padding: var(--ck-spacing-large);
+	}
+
+	.ck-ai-suggestion__header {
+		display: none
+	}
+
+	.ck.ck-ai-balloon__toolbar {
+		border: none;
+		padding: 0;
+		margin-top: var(--ck-spacing-medium);
+		margin-bottom: 0;
+
+		.ck-button_with-text {
+			margin-bottom: 0;
+			margin-top: 0;
+		}
+	}
+
+	.ck-ai-balloon__disclaimer {
+		margin-top: var(--ck-spacing-medium);
+
+		.ck-ai-balloon__disclaimer-content {
+			color: var(--ck-ai-balloon-disclaimer-text-color);
+			font-size: 0.75em;
+			line-height: 1.025em;
+			text-align: left;
+			word-break: normal;
+			text-wrap: auto;
+		}
+	}
+
+	.ck-ai-suggestion__body {
+		height: 150px;
+		word-break: normal;
+		text-wrap: auto;
+		overflow-y: auto;
+
+		& pre>code {
+			white-space: pre-wrap;
+		}
+	}
+
+	.ck-ai-suggestion__changes {
+		height: 150px;
+		overflow-y: auto;
+	}
+
+	* {
+		font-family: var(--ck-ai-balloon-font-family) !important;
+	}
+
+	.ck-ai-suggestion__changes *,
+	.ck-ai-suggestion__body *,
+	.ck-ai-suggestion__change * {
+		white-space: normal;
+		line-height: 1.4em;
+	}
+}
+
+.ck.ai-balloon-rotator {
+	.ck.ck-form__header {
+		justify-content: center;
+		position: relative;
+
+		h2.ck.ck-form__header__label {
+			flex-grow: 0;
+		}
+
+		button.ck-button {
+			margin-right: var(--ck-spacing-large);
+			margin-left: var(--ck-spacing-large);
+		}
+
+		.ck-button:last-child {
+			position: absolute;
+			right: var(--ck-spacing-large);
+		}
+	}
+
+	&::after {
+		content: "";
+		position: absolute;
+		top: 8px;
+		left: 8px;
+		width: 100%;
+		height: 100%;
+		background: var(--ck-color-dialog-background);
+		z-index: -1;
+		border-radius: var(--ck-border-radius);
+		box-shadow: var(--ck-drop-shadow), 0 0;
+		border: 1px solid var(--ck-color-base-border);
+	}
+}
+
+/* Buttons styles will be removed after shared code is merged. */
+.ck.ck-button {
+	&.ck-ai-button-primary {
+		color: var(--ck-ai-button-primary-color);
+		background-color: var(--ck-ai-button-primary-background-color);
+		border: none;
+
+		&:hover {
+			background-color: var(--ck-ai-button-primary-hover-background-color);
+		}
+
+		&:disabled {
+			color: var(--ck-ai-button-primary-disabled-color);
+			background-color: var(--ck-ai-button-primary-disabled-background-color);
+			cursor: not-allowed;
+		}
+	}
+
+	&.ck-ai-button-secondary {
+		color: var(--ck-ai-button-secondary-color);
+		background-color: var(--ck-ai-button-secondary-background-color);
+		border: 1px solid var(--ck-ai-button-secondary-border-color);
+
+		&:hover {
+			background-color: var(--ck-ai-button-secondary-hover-background-color);
+		}
+
+		&:active,
+		&.ck-on {
+			background-color: var(--ck-ai-button-secondary-active-background-color);
+		}
+
+		&:disabled {
+			color: var(--ck-ai-button-secondary-disabled-color);
+			background-color: var(--ck-ai-button-secondary-disabled-background-color);
+			border: 1px solid var(--ck-ai-button-secondary-disabled-border-color);
+			cursor: not-allowed;
+		}
+	}
+}
+
+.ck-ai-suggestion__container .ck.ck-ai-suggestion__loader {
+	padding: var(--ck-spacing-large) !important;
+	height: 150px;
+
+	.ck.ck-spinner-container.ck-ai-spinner .ck-spinner {
+		--ck-ai-spinner-size: 18px;
+	}
+
+	.ck.ck-spinner-container.ck-ai-spinner.ck-ai-spinner_small {
+		--ck-ai-spinner-size: 18px;
+	}
+
+	.ck-ai-suggestion__loader-text {
+		margin-left: var(--ck-spacing-medium);
+	}
+}
+
+/*
+ * Classes used by the "fake visual selection" displayed in the content
+ * when the AI Balloon is open.
+ *
+ * Narrow down to <span> to prevent changing background for widgets and nested editables.
+ */
+.ck span.ck-fake-ai-selection {
+	background: var(--ck-color-ai-selection);
+}
+
+.ck .ck-widget.ck-fake-ai-selection {
+	outline-color: var(--ck-color-ai-selection);
+}
+
+.ck.ck-dialog-overlay:has(.ai-balloon) {
+	z-index: 998;
+}

package/theme/aichat/aichat-controls/aichat-context-chip.css

@@ -0,0 +1,139 @@
+/*
+ * What you're currently looking at is the source code of a legally protected, proprietary software.
+ * CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
+ * all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
+ *
+ * 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
+ */
+
+
+/* .ck-ai-chat-context-chip {
+
+} */
+
+:root {
+	--ck-ai-chat-context-balloon-width: 290px;
+}
+
+.ck.ck-balloon-panel,
+.ck.ck-ai-chat {
+	& .ck-ai-chat-context-chip {
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		flex-shrink: 0;
+
+		max-width: max(calc(33% - var(--ck-spacing-medium-small) - (2 * var(--ck-spacing-large) / 3)), 118px);
+		box-sizing: border-box;
+
+		width: auto;
+
+		padding: var(--ck-spacing-small) var(--ck-spacing-medium-small);
+
+		background-color: var(--ck-ai-chat-user-context-background);
+		border-radius: var(--ck-ai-border-radius);
+		border: var(--ck-ai-chat-border-width) solid var(--ck-ai-border-color-main);
+
+		line-height: 1;
+		color: var(--ck-ai-chat-color-icon);
+
+		&.ck-ai-chat-context-chip_wide {
+			max-width: max(calc(66% - var(--ck-spacing-medium-small)), 240px);
+			width: auto;
+		}
+
+		&.ck-ai-chat-context-chip_document {
+			max-width: unset;
+		}
+
+		&.ck-ai-chat-context-chip_new-chip {
+			animation: ck-ai-new-item-flash var(--ck-ai-chat-animation-duration) var(--ck-ai-chat-animation-timing);
+		}
+
+		& > .ck-ai-chat-context-chip__label {
+			font-size: 0.9em;
+			display: inline-block;
+			margin: 0 var(--ck-spacing-medium-small);
+			text-overflow: ellipsis;
+			overflow: hidden;
+			line-height: 1.25;
+			color: var(--ck-ai-chat-color-icon);
+		}
+
+		& > .ck-icon.ck-ai-chat-context-chip__type-icon {
+			--ck-icon-size: 1em;
+
+			flex-shrink: 0;
+			font-size: 1em;
+			fill: var(--ck-ai-chat-color-icon);
+		}
+
+		& .ck-button {
+			--ck-ui-component-min-height: 1em;
+
+			max-width: var(--ck-ui-component-min-height);
+			max-height: var(--ck-ui-component-min-height);
+			border: none;
+			padding: var(--ck-spacing-tiny);
+
+			& > .ck-icon {
+				--ck-icon-size: 1em;
+
+				font-size: 1em;
+				fill: var(--ck-ai-chat-color-icon);
+			}
+		}
+	}
+
+	& .ck-ai-chat-context-chips-wrapper {
+		display: flex;
+		gap: var(--ck-spacing-medium-small);
+		flex-wrap: wrap;
+		align-items: center;
+		justify-content: flex-end;
+
+		width: 100%;
+		margin-bottom: 0;
+		padding: 0;
+	}
+
+	& .ck-ai-chat-context-chips-wrapper-balloon {
+		display: flex;
+		gap: var(--ck-spacing-standard);
+		flex-wrap: wrap;
+		align-items: center;
+		justify-content: flex-start;
+
+		width: var(--ck-ai-chat-context-balloon-width);
+		max-height: 10em;
+		padding: var(--ck-spacing-standard);
+		overflow-y: auto;
+
+		& .ck-ai-chat-context-chip {
+			max-width: max( calc(50% - var(--ck-spacing-standard)), 110px);
+		}
+
+		&.ck-ai-chat-context-chip_wide {
+			max-width: 100%;
+		}
+
+		& .ck-ai-chat-context-chip.ck-ai-chat-context-chip_new-chip {
+			animation: none;
+		}
+	}
+}
+
+@keyframes ck-ai-new-item-flash {
+	0% {
+		background-color: var(--ck-ai-chat-flash-color);
+		color: var(--ck-ai-chat-flash-color-text);
+		border-color: var(--ck-ai-chat-flash-color-text);
+	}
+
+	100% {
+		background-color: var(--ck-ai-chat-user-context-background);
+		color: var(--ck-ai-chat-color-icon);
+		border-color: var(--ck-ai-border-color-main);
+	}
+}

package/theme/aichat/aichat-controls/aichat-context-controls-balloon-panels.css

@@ -0,0 +1,194 @@
+/*
+ * What you're currently looking at is the source code of a legally protected, proprietary software.
+ * CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
+ * all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
+ *
+ * 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
+ */
+
+.ck.ck-balloon-panel {
+	&.ck-ai-chat-context-controls__add-context-balloon-panel {
+		min-width: 157px;
+		max-width: 250px;
+
+		& .ck-ai-chat-context-controls__balloon-button {
+			width: 100%;
+			display: flex;
+			padding-left: var(--ck-spacing-extra-large);
+			padding-right: var(--ck-spacing-extra-large);
+
+			&:first-child {
+				margin-top: var(--ck-spacing-tiny);
+			}
+
+			&:last-child {
+				margin-bottom: var(--ck-spacing-tiny);
+			}
+
+			& .ck-icon.ck-button__icon {
+				--ck-icon-size: 16px;
+			}
+
+			& .ck-button__label {
+				margin: 0;
+				line-height: var(--ck-line-height-base);
+			}
+
+			&:hover {
+				background-color: var(--ck-ai-button-secondary-hover-background-color);
+			}
+
+			& > .ck-ai-chat-context-controls__balloon-button-source__arrow {
+				width: var(--ck-dropdown-arrow-size);
+
+				transform: rotate(-90deg);
+
+				/* A space to accommodate the triangle. */
+				margin-left: var(--ck-spacing-standard);
+
+				/* Nudge the arrow gently to the right because its center of gravity is to the left */
+				margin-right: calc(-1 * var(--ck-spacing-small));
+			}
+
+			& > span {
+				flex-grow: 1;
+			}
+		}
+	}
+
+	&.ck-ai-chat-context-controls__url-balloon-panel {
+		& .ck-ai-chat-context-controls__url-form {
+			width: var(--ck-ai-chat-context-controls-balloon-width);
+			line-height: var(--ck-form-header-height);
+
+			& .ck-ai-chat-context-controls__url-input-section {
+				display: flex;
+				align-items: flex-start;
+				padding: var(--ck-spacing-large);
+
+				&>.ck-labeled-field-view {
+					width: 100%;
+
+					&>.ck.ck-labeled-field-view__input-wrapper {
+						&>.ck.ck-input {
+							width: 100%;
+							font: normal normal normal var(--ck-font-size-base) / var(--ck-line-height-base) var(--ck-font-face);
+							vertical-align: middle;
+							line-height: var(--ck-line-height-base);
+						}
+
+						&>.ck.ck-label {
+							visibility: hidden;
+						}
+					}
+				}
+
+				&>.ck.ck-button {
+					height: auto;
+					margin-left: var(--ck-spacing-medium);
+					background-color: var(--ck-ai-background-color-action-button);
+					color: var(--ck-ai-font-color-action-button);
+
+					&.ck-disabled {
+						opacity: 0.5;
+
+						&>.ck-button__icon {
+							opacity: 1;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	&.ck-ai-chat-context-controls__source-balloon-panel {
+		width: var(--ck-ai-chat-context-controls-balloon-width);
+		height: 319px;
+
+		&:has(.ck-ai-skeleton:not(.ck-hidden)) {
+			overflow: hidden;
+		}
+
+		.ck.ck-search__query_with-icon {
+			padding: var(--ck-spacing-large) var(--ck-spacing-large) var(--ck-spacing-tiny) var(--ck-spacing-large);
+		}
+
+		.ck-ai-skeleton {
+			--ck-ai-skeleton-gap: var(--ck-spacing-small);
+
+			padding-top: var(--ck-spacing-standard);
+			padding-bottom: var(--ck-spacing-standard);
+		}
+
+		.ck-ai-chat-resources__list {
+			height: 233px;
+			overflow-y: auto;
+			overflow-x: hidden;
+
+			.ck-ai-chat-resources__item {
+				display: flex;
+				align-items: center;
+				padding: var(--ck-spacing-tiny) var(--ck-spacing-extra-large);
+				border-radius: var(--ck-border-radius);
+
+				cursor: pointer;
+				transition: background-color 0.2s;
+
+				&:hover {
+					background-color: var(--ck-ai-button-secondary-hover-background-color);
+				}
+
+				&.ck-ai-chat-resources__item--in-context {
+					color: hsla(0, 0%, 20%, 0.5);
+					pointer-events: none;
+
+					* {
+						color: inherit;
+					}
+				}
+
+				.ck-ai-chat-resources__item__icon {
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					height: 1.14em;
+					margin-right: 0.35em;
+					flex-shrink: 0;
+
+					.ck-icon {
+						height: 1.368em;
+						fill: currentColor;
+					}
+				}
+
+				&.ck-ai-chat-resources__item--in-context .ck-ai-chat-resources__item__icon {
+					color: hsla(0, 0%, 20%, 0.5);
+				}
+
+				.ck-ai-chat-resources__item-title {
+					flex: 1;
+					font-size: 1em;
+					line-height: var(--ck-line-height-base);
+					overflow: hidden;
+					text-overflow: ellipsis;
+					white-space: nowrap;
+				}
+			}
+		}
+
+		.ck-ai-chat-resources__list.ck-hidden {
+			display: none;
+		}
+	}
+
+	&.ck-ai-chat-context-controls__chip-tooltip {
+		max-width: 180px;
+
+		& .ck.ck-tooltip__text {
+			white-space: normal;
+			display: inline-block;
+			padding: var(--ck-tooltip-text-padding) 0;
+		}
+	}
+}

package/theme/aichat/aichat-controls/aichat-context-controls.css

@@ -0,0 +1,46 @@
+/*
+ * What you're currently looking at is the source code of a legally protected, proprietary software.
+ * CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
+ * all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
+ *
+ * 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
+ */
+
+:root {
+	--ck-ai-chat-context-controls-balloon-width: 400px;
+}
+
+.ck.ck-ai-chat-controls {
+	.ck-ai-chat-context-controls {
+		display: flex;
+		align-content: center;
+		justify-content: flex-start;
+		align-items: flex-start;
+		flex-wrap: wrap;
+		padding-top: 0;
+		gap: var(--ck-spacing-medium-small);
+
+		padding-bottom: var(--ck-spacing-medium-small);
+
+		&:has(.ck-ai-chat-context-controls__pending-contexts:empty) {
+			padding-bottom: var(--ck-spacing-small);
+		}
+
+		& .ck-ai-chat-context-controls__pending-contexts {
+			display: contents;
+		}
+	}
+
+	/* The button to add context living inside the query input. */
+	& .ck-button.ck-ai-chat-controls-button.ck-ai-chat-context-controls__add-context-button {
+		position: absolute;
+		bottom: 3px;
+		opacity: .7;
+		margin: 0;
+
+		&:hover, &:focus {
+			opacity: 1;
+		}
+	}
+}

package/theme/aichat/aichat-controls/aichat-controls-button.css

@@ -0,0 +1,74 @@
+/*
+ * What you're currently looking at is the source code of a legally protected, proprietary software.
+ * CKEditor 5 Collaboration is licensed under a commercial license and protected by copyright law. Where not otherwise indicated,
+ * all CKEditor 5 Collaboration content is authored by CKSource engineers and consists of CKSource-owned intellectual property.
+ *
+ * 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
+ */
+
+.ck.ck-button.ck-ai-chat-controls-button {
+	--ck-ui-component-min-height: 1.88em;
+
+	padding: var(--ck-spacing-tiny);
+	flex-shrink: 0;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+
+	&:not(.ck-button_with-text) {
+		margin: 0 0 var(--ck-spacing-tiny) 0;
+		padding: var(--ck-spacing-tiny);
+	}
+
+	&.ck-button_with-text.ck-ai-chat-controls_context_show-more-button {
+		display: block;
+		padding: 0;
+		border-width: 0;
+		letter-spacing: -0.1em;
+		text-align: center;
+	}
+
+	&:not(.ck-disabled) {
+		&:hover {
+			background-color: var(--ck-ai-chat-button-active-background-color);
+			color: var(--ck-ai-chat-button-hover-color);
+
+			& .ck-button__icon {
+				fill: var(--ck-ai-chat-button-hover-color);
+			}
+		}
+
+		&:active {
+			background-color: var(--ck-ai-chat-button-active-background-color);
+			color: var(--ck-ai-chat-button-active-color);
+
+			& .ck-button__icon {
+				fill: var(--ck-ai-chat-button-active-color);
+			}
+		}
+
+		&.ck-on:not(:hover):not(:active):not(.ck-disabled) {
+			background-color: var(--ck-ai-chat-button-active-background-color);
+			color: var(--ck-ai-chat-button-active-color);
+
+			& .ck-button__icon {
+				color: var(--ck-ai-chat-button-active-color);
+			}
+		}
+	}
+
+	& > .ck-icon {
+		--ck-icon-size: 16px;
+	}
+
+	& .ck-dropdown__arrow {
+		display: none;
+	}
+
+	/* svg {
+		margin-right: 0;
+		width: auto;
+		font-size: 1em;
+	} */
+}