umberto 10.0.0 → 10.1.0

package/CHANGELOG.md

@@ -1,6 +1,18 @@
 Changelog
 =========
 
+## [10.1.0](https://github.com/cksource/umberto/compare/v10.0.0...v10.1.0) (March 4, 2026)
+
+### Features
+
+* Add support for experimental features in the callout component and in the badges normalization script.
+
+### Bug fixes
+
+* Fixed the deprecation warning regarding the `Sass if() syntax` thrown during building docs.
+* Disabled inserting a space between the anchor link and heading when converting a document from Markdown to HTML.
+
+
 ## [10.0.0](https://github.com/cksource/umberto/compare/v9.4.0...v10.0.0) (February 16, 2026)
 
 ### BREAKING CHANGES
@@ -51,17 +63,6 @@ Changelog
 * Fix crashes of Table of Contents on some pages where headings are not placed in expected HTML structure.
 * No longer stop building of the document when invalid links are found during link validation if some parts of the documentation are skipped (API, SDK, Guides).
 
-
-## [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.
-
 ---
 
 To see all releases, visit the [release page](https://github.com/cksource/umberto/releases).

package/hexo-config.json

@@ -29,7 +29,8 @@
 					"options": {
 						"toc": false,
 						"anchorClassName": "headerlink",
-						"anchorLinkSymbol": "#"
+						"anchorLinkSymbol": "#",
+						"anchorLinkSpace": false
 					}
 				}
 			},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "umberto",
-  "version": "10.0.0",
+  "version": "10.1.0",
   "description": "CKSource Documentation builder",
   "main": "src/index.js",
   "type": "module",
@@ -33,14 +33,14 @@
     "hexo-generator-category": "^2.0.0",
     "hexo-generator-index": "^4.0.0",
     "hexo-generator-tag": "^2.0.0",
-    "hexo-renderer-markdown-it-plus": "^1.0.5",
+    "hexo-renderer-markdown-it-plus": "^1.0.6",
     "hexo-renderer-pug": "^3.0.0",
     "htmlparser2": "^10.0.0",
     "javascript-stringify": "^2.1.0",
     "jquery": "~3.7.1",
     "js-beautify": "^1.14.4",
     "lodash": "^4.17.21",
-    "markdown-it": "^14.1.0",
+    "markdown-it": "^14.1.1",
     "markdown-it-expand-tabs": "^1.0.13",
     "markdown-it-toc-and-anchor": "^4.2.0",
     "medium-zoom": "^1.0.6",

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

@@ -65,7 +65,8 @@ const PATTERN_ELEMENTS = [
 		attributesMapper: ( { attributes } ) => {
 			const variants = [
 				'info', 'warning', 'error', 'success',
-				'note', 'tip', 'important', 'caution'
+				'note', 'tip', 'important', 'caution',
+				'experimental'
 			];
 
 			// First check if variant is directly specified

package/scripts/utils/normalizebadges.cjs

@@ -9,6 +9,10 @@ const KNOWN_BADGES = {
 	premium: {
 		name: 'premium',
 		label: 'Premium feature'
+	},
+	experimental: {
+		name: 'experiment',
+		label: 'Experimental feature'
 	}
 };
 

package/themes/umberto/layout/gloria/_components/callout/_style.scss

@@ -28,6 +28,10 @@
 		--callout-variant-color: var(--color-success-500);
 	}
 
+	&--cyan {
+		--callout-variant-color: var(--color-cyan-600);
+	}
+
 	&__title {
 		position: absolute;
 		left: calc(var(--font-size-lg) * -0.5 - 1px);

package/themes/umberto/layout/gloria/_components/callout/index.pug

@@ -65,6 +65,12 @@ mixin callout({ variant })
 				icon: 'close-circle',
 				title: 'Caution',
 				role: 'alert'
+			},
+			experimental: {
+				className: 'c-callout--cyan',
+				icon: 'experiment',
+				title: 'Experimental',
+				role: 'note'
 			}
 		};
 

package/themes/umberto/src/gloria/css/a11y/_mixins.scss

@@ -1,7 +1,11 @@
 @use 'sass:list';
 
 @mixin a11y-focus-ring-outline($inset: false) {
-	$inset-value: if($inset, 'inset', '');
+	$inset-value: '';
+
+	@if $inset {
+		$inset-value: 'inset';
+	}
 
 	outline: 0;
 	box-shadow: 0 0 0 .2rem var(--a11y-focus-ring-color, color-mix(in srgb, var(--color-primary-500) 20%, transparent)) #{$inset-value};