umberto 9.1.2 → 9.1.3

package/CHANGELOG.md

@@ -1,6 +1,17 @@
 Changelog
 =========
 
+## [9.1.3](https://github.com/cksource/umberto/compare/v9.1.2...v9.1.3) (December 19, 2025)
+
+### Bug fixes
+
+* Fixed the conflict where typing the forward slash in the Kapa widget would trigger the Algolia search.
+
+### Other changes
+
+* Added CKBox (`CKBOX_VERSION`) and CKEditor 5 (`CKEDITOR_VERSION`) versions to events sent to Sentry integration.
+
+
 ## [9.1.2](https://github.com/cksource/umberto/compare/v9.1.1...v9.1.2) (December 8, 2025)
 
 ### Bug fixes
@@ -37,21 +48,6 @@ Changelog
 
 * Updated the required version of Node.js to **v24.11**.
 
-
-## [8.4.0](https://github.com/cksource/umberto/compare/v8.3.5...v8.4.0) (October 30, 2025)
-
-### Features
-
-* Minify output HTML to reduce file size and improve load performance.
-
-  The output is automatically minified during production builds to remove unnecessary whitespace and comments.
-
-  Minification is **disabled when using the `--dev` modifier**, ensuring the generated HTML remains readable for easier debugging and inspection.
-
-### Other changes
-
-* Umberto reads a project configuration once and passes it through the pipeline. Thanks to that, hooks can modify it, which affects a project's build.
-
 ---
 
 To see all releases, visit the [release page](https://github.com/cksource/umberto/releases).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "umberto",
-  "version": "9.1.2",
+  "version": "9.1.3",
   "description": "CKSource Documentation builder",
   "main": "src/index.js",
   "files": [

package/scripts/filter/after-post-render/time-end.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { format, styleText } = require( 'util' );
+const { format, styleText } = require( 'node:util' );
 
 hexo.extend.filter.register( 'after_post_render', page => {
 	if ( !hexo.projectGlobals.common || !hexo.projectGlobals.common.verbose ) {

package/scripts/filter/before-post-render/gloria/prerender-xml-pug-components.js

@@ -42,7 +42,7 @@
 
 'use strict';
 
-const path = require( 'path' );
+const path = require( 'node:path' );
 const removeIndentation = require( '../../../utils/remove-indentation' );
 const createPrerenderPugTemplate = require( '../../../utils/pug-renderer/create-prerender-pug-template' );
 const {

package/scripts/utils/execute-and-insert-function-results.js

@@ -6,7 +6,7 @@
 'use strict';
 
 const upath = require( 'upath' );
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 
 const EXEC_REGEXP = /\\?{@exec ([^}]+)\\?}/g;
 const PATH_REGEXP = /[\w.\\/-]+\.c?js$/;

package/scripts/utils/has-own-favicons.js

@@ -6,7 +6,7 @@
 'use strict';
 
 const upath = require( 'upath' );
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 
 /**
  * Checks if the project has its own favicons. If so, they will be used when rendering meta tags (`<link rel="icon">`).

package/scripts/utils/inline-svg.js

@@ -5,8 +5,8 @@
 
 'use strict';
 
-const fs = require( 'fs' );
-const path = require( 'path' );
+const fs = require( 'node:fs' );
+const path = require( 'node:path' );
 const { parseDocument } = require( 'htmlparser2' );
 const { Element, Text } = require( 'domhandler' );
 const { selectAll, selectOne } = require( 'css-select' );

package/scripts/utils/logcrossprojectreference.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { styleText } = require( 'util' );
+const { styleText } = require( 'node:util' );
 
 /**
  * Logs an error message about a cross-project reference found in the parsed expression.

package/scripts/utils/parseicontag.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const crypto = require( 'crypto' );
+const crypto = require( 'node:crypto' );
 const upath = require( 'upath' );
 const logCrossProjectReference = require( './logcrossprojectreference' );
 

package/scripts/utils/parselinks.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { styleText } = require( 'util' );
+const { styleText } = require( 'node:util' );
 const upath = require( 'upath' );
 const splitLongname = require( '../../src/helpers/split-longname' );
 

package/scripts/utils/pug-renderer/render-pug-component.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const path = require( 'path' );
+const path = require( 'node:path' );
 const hexoManager = require( '../../../src/hexo-manager' );
 
 /**

package/scripts/utils/random-id.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const crypto = require( 'crypto' );
+const crypto = require( 'node:crypto' );
 
 /**
  * Generates a random ID with a single segment. If a prefix is provided, it will be prepended to the ID.

package/scripts/utils/spritesheet-svg.js

@@ -5,8 +5,8 @@
 
 'use strict';
 
-const fs = require( 'fs' );
-const path = require( 'path' );
+const fs = require( 'node:fs' );
+const path = require( 'node:path' );
 const { parseDocument } = require( 'htmlparser2' );
 const { Element, cloneNode } = require( 'domhandler' );
 const { selectAll, selectOne } = require( 'css-select' );

package/scripts/utils/toc.js

@@ -43,14 +43,25 @@ module.exports = function toc( data, options = {} ) {
 	for ( const heading of headings ) {
 		const hLevel = Number( heading.name[ 1 ] ); // 'h2' -> 2
 		const text = getHeadingText( heading ).trim();
+		const icons = getHeadingIcons( heading );
 		const li = new Element( 'li', {} );
-		const a = new Element( 'a', {
-			class: 'a11y-focusable',
+		const aAttrs = {
+			class: icons.length > 0 ? 'a11y-focusable c-toc__link--with-icon' : 'a11y-focusable',
 			href: '#' + getAttributeValue( heading, 'id' ),
 			title: text
-		} );
+		};
 
-		appendChild( a, new Text( text ) );
+		const a = new Element( 'a', aAttrs );
+
+		// Append text first, then icons (only if icons exist)
+		if ( text ) {
+			appendChild( a, new Text( text ) );
+		}
+		if ( icons.length > 0 ) {
+			for ( const icon of icons ) {
+				appendChild( a, cloneNode( icon, true ) );
+			}
+		}
 		appendChild( li, a );
 
 		if ( tocLastLevels[ hLevel ] ) {
@@ -107,7 +118,7 @@ function hasAncestorWithClassIn( node, classNames ) {
 }
 
 /**
- * Returns the heading text without content from descendants with class "headerlink".
+ * Returns the heading text without content from descendants with class "headerlink", "editor-icon", or badge components.
  */
 function getHeadingText( root ) {
 	if ( !root ) {
@@ -117,9 +128,38 @@ function getHeadingText( root ) {
 	// Clone so we don't mutate the original AST.
 	const clone = cloneNode( root, true );
 
-	for ( const node of selectAll( '.headerlink', clone ) ) {
+	// Remove headerlinks, editor-icons, and badge components (which contain icons)
+	for ( const node of selectAll( '.headerlink, .editor-icon, .c-badge', clone ) ) {
 		removeElement( node );
 	}
 
 	return textContent( clone );
 }
+
+/**
+ * Returns icon elements from the heading.
+ * Looks for:
+ * - Elements with class "editor-icon" (legacy format)
+ * - Badge components with icons (c-badge with c-icon inside)
+ * - Direct icon elements (c-icon) within the heading
+ */
+function getHeadingIcons( root ) {
+	if ( !root ) {
+		return [];
+	}
+
+	const icons = [];
+
+	const editorIcons = selectAll( '.editor-icon', root );
+	icons.push( ...editorIcons );
+
+	const badgesWithIcons = selectAll( '.c-badge .c-icon', root );
+	icons.push( ...badgesWithIcons );
+
+	const directIcons = selectAll( '.c-icon', root ).filter( icon => {
+		return !hasAncestorWithClassIn( icon, [ 'c-badge' ] );
+	} );
+	icons.push( ...directIcons );
+
+	return icons;
+}

package/src/api-builder/build-page-worker.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 const upath = require( 'upath' );
 const { parseDocument } = require( 'htmlparser2' );
 const { default: render } = require( 'dom-serializer' );

package/src/api-builder/classes/description-parser.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { styleText } = require( 'util' );
+const { styleText } = require( 'node:util' );
 const { parseDocument } = require( 'htmlparser2' );
 const { default: render } = require( 'dom-serializer' );
 const { selectAll, selectOne } = require( 'css-select' );

package/src/helpers/get-docsearch-config.js

@@ -7,7 +7,7 @@
 
 const { cloneDeep } = require( 'lodash' );
 const { stringify } = require( 'javascript-stringify' );
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 const upath = require( 'upath' );
 
 const defaultScriptTemplate = fs.readFileSync( upath.join( __dirname, 'templates', 'scripts', 'default.js' ), 'utf-8' );

package/src/helpers/github-url.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { spawnSync } = require( 'child_process' );
+const { spawnSync } = require( 'node:child_process' );
 const upath = require( 'upath' );
 
 const cachedGitPaths = new Set();

package/src/helpers/import-module.js

@@ -6,7 +6,7 @@
 'use strict';
 
 const upath = require( 'upath' );
-const { pathToFileURL } = require( 'url' );
+const { pathToFileURL } = require( 'node:url' );
 
 /**
  * Loads the specified module using `import()` call.

package/src/helpers/log-with-time.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { styleText } = require( 'util' );
+const { styleText } = require( 'node:util' );
 
 module.exports = function logWithTime( message ) {
 	const lowercase = message.charAt( 0 ).toLowerCase() + message.slice( 1 );

package/src/hexo-manager.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { styleText } = require( 'util' );
+const { styleText } = require( 'node:util' );
 const upath = require( 'upath' );
 const fs = require( 'fs-extra' );
 const { globSync } = require( 'glob' );

package/src/index.js

@@ -5,8 +5,8 @@
 
 'use strict';
 
-const { styleText } = require( 'util' );
-const path = require( 'path' );
+const { styleText } = require( 'node:util' );
+const path = require( 'node:path' );
 const compileSass = require( './tasks/compile-sass' );
 const runWebpack = require( './tasks/run-webpack' );
 const copyAssets = require( './tasks/copy-assets' );

package/src/sdk-builder/get-sdk-sources.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 const upath = require( 'upath' );
 const { globSync } = require( 'glob' );
 const { parseDocument } = require( 'htmlparser2' );

package/src/sdk-builder/sdk-builder.js

@@ -7,7 +7,7 @@
 
 const HtmlFile = require( '../api-builder/classes/html-file' );
 const upath = require( 'upath' );
-const { URL, resolve: urlResolve } = require( 'url' );
+const { URL, resolve: urlResolve } = require( 'node:url' );
 const beautifyHtml = require( 'js-beautify' ).html;
 const macroReplacer = require( '../tasks/macro-replacer' );
 const getDocSearchConfig = require( '../helpers/get-docsearch-config' );

package/src/tasks/create-sitemap-index.js

@@ -4,7 +4,7 @@
  */
 
 const upath = require( 'upath' );
-const fs = require( 'fs/promises' );
+const fs = require( 'node:fs/promises' );
 
 const XMLNS_STRINGS = [
 	'xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"',

package/src/tasks/create-sitemap-step.js

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md.
  */
 
-const { styleText } = require( 'util' );
+const { styleText } = require( 'node:util' );
 const createSitemap = require( './create-sitemap' );
 const createSitemapIndex = require( './create-sitemap-index' );
 

package/src/tasks/create-sitemap.js

@@ -5,10 +5,10 @@
 
 'use strict';
 
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 const { globSync } = require( 'glob' );
 const upath = require( 'upath' );
-const { URL } = require( 'url' );
+const { URL } = require( 'node:url' );
 const { SitemapStream, streamToPromise } = require( 'sitemap' );
 
 /**

package/src/tasks/create-sym-links.js

@@ -5,8 +5,8 @@
 
 'use strict';
 
-const { styleText } = require( 'util' );
-const fs = require( 'fs' );
+const { styleText } = require( 'node:util' );
+const fs = require( 'node:fs' );
 const upath = require( 'upath' );
 const getProjectConfig = require( './get-project-config' );
 

package/src/tasks/get-hexo-config.js

@@ -6,7 +6,7 @@
 'use strict';
 
 const upath = require( 'upath' );
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 
 /**
  * Reads Umberto's hexo config file.

package/src/tasks/get-main-config.js

@@ -6,7 +6,7 @@
 'use strict';
 
 const upath = require( 'upath' );
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 
 module.exports = rootPath => {
 	const configPath = upath.join( rootPath, 'umberto-main.json' );

package/src/tasks/get-project-config.js

@@ -6,7 +6,7 @@
 'use strict';
 
 const upath = require( 'upath' );
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 const { globSync } = require( 'glob' );
 const importModule = require( '../helpers/import-module' );
 

package/src/tasks/minify-html-worker.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { readFileSync, writeFileSync } = require( 'fs' );
+const { readFileSync, writeFileSync } = require( 'node:fs' );
 const minifier = require( '@minify-html/node' );
 
 /**

package/src/tasks/minify-html.js

@@ -5,9 +5,9 @@
 
 'use strict';
 
-const { join } = require( 'path' );
-const { globSync } = require( 'fs' );
-const { styleText } = require( 'util' );
+const { join } = require( 'node:path' );
+const { globSync } = require( 'node:fs' );
+const { styleText } = require( 'node:util' );
 const { default: TinyPool } = require( 'tinypool' );
 const logWithTime = require( '../helpers/log-with-time' );
 

package/src/tasks/read-doc-sources.js

@@ -6,7 +6,7 @@
 'use strict';
 
 const upath = require( 'upath' );
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 const { globSync } = require( 'glob' );
 const DOC_FORMATS = require( '../helpers/doc-formats' );
 

package/src/tasks/run-webpack.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const path = require( 'path' );
+const path = require( 'node:path' );
 const webpack = require( 'webpack' );
 
 module.exports = ( sourceFile, destinationFile, {

package/src/tasks/validate-html-w3c.js

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md.
  */
 
-const { spawn } = require( 'child_process' );
+const { spawn } = require( 'node:child_process' );
 const vnu = require( 'vnu-jar' );
 
 module.exports = ( buildPath, { verbose } = {} ) => new Promise( ( resolve, reject ) => {

package/src/tasks/validate-links.js

@@ -11,7 +11,7 @@
  * especially for API documentation where the number of links can reach thousands.
  */
 
-const { styleText } = require( 'util' );
+const { styleText } = require( 'node:util' );
 const fs = require( 'fs-extra' );
 const upath = require( 'upath' );
 const { globSync } = require( 'glob' );

package/src/tasks/watcher.js

@@ -5,7 +5,7 @@
 
 'use strict';
 
-const { styleText } = require( 'util' );
+const { styleText } = require( 'node:util' );
 const upath = require( 'upath' );
 const chokidar = require( 'chokidar' );
 const { copy } = require( 'fs-extra' );

package/src/template/template-collection.js

@@ -6,7 +6,7 @@
 'use strict';
 
 const pug = require( 'pug' );
-const fs = require( 'fs' );
+const fs = require( 'node:fs' );
 const upath = require( 'upath' );
 const isNonEmptyArray = require( '../helpers/is-non-empty-array' );
 const createFilterAttribs = require( '../helpers/create-filtering-data-attribs' );

package/themes/umberto/layout/gloria/_modules/sentry/index.pug

@@ -17,7 +17,13 @@ mixin load-sentry-script( sentry )
 						'https://ckeditor5.github.io/docs/nightly'
 					],
 					replaysSessionSampleRate: 0,
-					replaysOnErrorSampleRate: 0
+					replaysOnErrorSampleRate: 0,
+					initialScope: scope => {
+						scope.setTags( {
+							CKEDITOR_VERSION: typeof CKEDITOR_VERSION !== 'undefined' ? CKEDITOR_VERSION : '(none)',
+							CKBOX_VERSION: typeof CKBox !== 'undefined' ? CKBox.version : '(none)',
+						} );
+					}
 				} );
 			};
 

package/themes/umberto/layout/gloria/_modules/toc/_style.scss

@@ -183,12 +183,21 @@
 	}
 
 	ol a {
-		display: block;
 		padding: 0 var(--spacing-2);
 		text-decoration: none;
 		font-size: var(--font-size-sm);
 		color: var(--color-secondary-700);
 
+		&:not(.c-toc__link--with-icon) {
+			display: block;
+		}
+
+		&.c-toc__link--with-icon {
+			display: flex;
+			align-items: center;
+			gap: var(--spacing-1);
+		}
+
 		&:hover,
 		&.is-active {
 			color: var(--color-primary);

package/themes/umberto/src/gloria/js/modules/algolia-search.js

@@ -46,6 +46,11 @@ export class AlgoliaSearch extends BaseComponent {
 	 * Initializes the algolia search component.
 	 */
 	async init() {
+		// IMPORTANT: Add the keyboard event interceptor BEFORE loading the DocSearch library
+		// It ensures our listener is registered first and can use `stopImmediatePropagation`
+		// to prevent DocSearch's listener from running when typing in the Kapa widget.
+		this._preventDocSearchShortcutInKapa();
+
 		await injectScript( DOCSEARCH_JS_URL, {
 			attributes: {
 				crossorigin: 'anonymous'
@@ -88,6 +93,46 @@ export class AlgoliaSearch extends BaseComponent {
 			}
 		} );
 	}
+
+	/**
+	 * Prevents the DocSearch "/" keyboard shortcut from triggering when the user is typing in the Kapa widget.
+	 * DocSearch library doesn't provide a configuration option to disable keyboard shortcuts,
+	 * so we need to intercept the event and stop it completely before DocSearch's listener sees it.
+	 *
+	 * This listener is added in the capture phase BEFORE DocSearch is loaded, ensuring it runs first.
+	 * We use stopImmediatePropagation() to prevent ALL other listeners (including DocSearch's) from running.
+	 */
+	_preventDocSearchShortcutInKapa() {
+		document.addEventListener( 'keydown', event => {
+			// Only handle the "/" key
+			if ( event.key !== '/' ) {
+				return;
+			}
+
+			// Use `composedPath()` to check the entire event path, including through shadow DOM boundaries.
+			// This is more reliable than checking `document.activeElement` for shadow DOM content.
+			const path = event.composedPath();
+
+			const isTypingInInput = path.some( element => {
+				if ( !element || !element.tagName ) {
+					return false;
+				}
+
+				// Let's check different types of input fields.
+				// Kapa currently uses a textarea for the search input.
+				// But there's a chance that it will change in the future.
+				const isInputElement = element.tagName === 'TEXTAREA' ||
+					element.tagName === 'INPUT' ||
+					element.isContentEditable;
+
+				return isInputElement;
+			} );
+
+			if ( isTypingInInput ) {
+				event.stopImmediatePropagation();
+			}
+		}, true );
+	}
 }
 
 /**