@ckeditor/ckeditor5-ui 41.3.1 → 41.4.0

package/src/index.d.ts

@@ -5,6 +5,7 @@
 /**
  * @module ui
  */
+export { default as View, type UIViewRenderEvent } from './view.js';
 export { default as clickOutsideHandler } from './bindings/clickoutsidehandler.js';
 export { default as injectCssTransitionDisabler } from './bindings/injectcsstransitiondisabler.js';
 export { default as CssTransitionDisablerMixin, type ViewWithCssTransitionDisabler } from './bindings/csstransitiondisablermixin.js';
@@ -12,7 +13,7 @@ export { default as submitHandler } from './bindings/submithandler.js';
 export { default as addKeyboardHandlingForGrid } from './bindings/addkeyboardhandlingforgrid.js';
 export { default as AccessibilityHelp } from './editorui/accessibilityhelp/accessibilityhelp.js';
 export { default as BodyCollection } from './editorui/bodycollection.js';
-export { default as Button, type ButtonExecuteEvent } from './button/button.js';
+export type { default as Button, ButtonExecuteEvent } from './button/button.js';
 export type { default as ButtonLabel } from './button/buttonlabel.js';
 export { default as ButtonView } from './button/buttonview.js';
 export { default as ButtonLabelView } from './button/buttonlabelview.js';
@@ -60,7 +61,7 @@ export { default as StickyPanelView } from './panel/sticky/stickypanelview.js';
 export { default as AutocompleteView, type AutocompleteViewConfig, type AutocompleteResultsView } from './autocomplete/autocompleteview.js';
 export { default as SearchTextView, type SearchTextViewSearchEvent, type SearchTextViewConfig } from './search/text/searchtextview.js';
 export { default as SearchInfoView } from './search/searchinfoview.js';
-export { default as FilteredView, type FilteredViewExecuteEvent } from './search/filteredview.js';
+export type { default as FilteredView, FilteredViewExecuteEvent } from './search/filteredview.js';
 export { default as HighlightedTextView } from './highlightedtext/highlightedtextview.js';
 export { default as TooltipManager } from './tooltipmanager.js';
 export { default as Template, type TemplateDefinition } from './template.js';
@@ -71,7 +72,6 @@ export { default as ToolbarSeparatorView } from './toolbar/toolbarseparatorview.
 export { default as normalizeToolbarConfig } from './toolbar/normalizetoolbarconfig.js';
 export { default as BalloonToolbar, type BalloonToolbarShowEvent } from './toolbar/balloon/balloontoolbar.js';
 export { default as BlockToolbar } from './toolbar/block/blocktoolbar.js';
-export { default as View, type UIViewRenderEvent } from './view.js';
 export { default as ViewCollection } from './viewcollection.js';
 export { default as MenuBarView, type MenuBarConfig } from './menubar/menubarview.js';
 export { default as MenuBarMenuView } from './menubar/menubarmenuview.js';
@@ -79,5 +79,5 @@ export { default as MenuBarMenuListView } from './menubar/menubarmenulistview.js
 export { default as MenuBarMenuListItemView } from './menubar/menubarmenulistitemview.js';
 export { default as MenuBarMenuListItemButtonView } from './menubar/menubarmenulistitembuttonview.js';
 export { default as MenuBarMenuListItemFileDialogButtonView } from './menubar/menubarmenulistitemfiledialogbuttonview.js';
-export { normalizeMenuBarConfig, DefaultMenuBarItems } from './menubar/utils.js';
+export { normalizeMenuBarConfig, DefaultMenuBarItems, _initMenuBar } from './menubar/utils.js';
 import './augmentation.js';

package/src/index.js

@@ -5,6 +5,8 @@
 /**
  * @module ui
  */
+// This import must be at the top to ensure that `globals.css` is imported first
+export { default as View } from './view.js';
 export { default as clickOutsideHandler } from './bindings/clickoutsidehandler.js';
 export { default as injectCssTransitionDisabler } from './bindings/injectcsstransitiondisabler.js';
 export { default as CssTransitionDisablerMixin } from './bindings/csstransitiondisablermixin.js';
@@ -67,7 +69,6 @@ export { default as ToolbarSeparatorView } from './toolbar/toolbarseparatorview.
 export { default as normalizeToolbarConfig } from './toolbar/normalizetoolbarconfig.js';
 export { default as BalloonToolbar } from './toolbar/balloon/balloontoolbar.js';
 export { default as BlockToolbar } from './toolbar/block/blocktoolbar.js';
-export { default as View } from './view.js';
 export { default as ViewCollection } from './viewcollection.js';
 export { default as MenuBarView } from './menubar/menubarview.js';
 export { default as MenuBarMenuView } from './menubar/menubarmenuview.js';
@@ -75,5 +76,5 @@ export { default as MenuBarMenuListView } from './menubar/menubarmenulistview.js
 export { default as MenuBarMenuListItemView } from './menubar/menubarmenulistitemview.js';
 export { default as MenuBarMenuListItemButtonView } from './menubar/menubarmenulistitembuttonview.js';
 export { default as MenuBarMenuListItemFileDialogButtonView } from './menubar/menubarmenulistitemfiledialogbuttonview.js';
-export { normalizeMenuBarConfig, DefaultMenuBarItems } from './menubar/utils.js';
+export { normalizeMenuBarConfig, DefaultMenuBarItems, _initMenuBar } from './menubar/utils.js';
 import './augmentation.js';

package/src/menubar/utils.d.ts

@@ -4,8 +4,9 @@
  */
 import type MenuBarMenuView from './menubarmenuview.js';
 import type { default as MenuBarView, MenuBarConfig, MenuBarConfigObject, NormalizedMenuBarConfigObject } from './menubarview.js';
-import { type Locale, type PositioningFunction } from '@ckeditor/ckeditor5-utils';
 import type ComponentFactory from '../componentfactory.js';
+import type { Editor } from '@ckeditor/ckeditor5-core';
+import { type Locale, type PositioningFunction } from '@ckeditor/ckeditor5-utils';
 type DeepReadonly<T> = Readonly<{
     [K in keyof T]: T[K] extends string ? Readonly<T[K]> : T[K] extends Array<infer A> ? Readonly<Array<DeepReadonly<A>>> : DeepReadonly<T[K]>;
 }>;
@@ -429,4 +430,10 @@ export declare function processMenuBarConfig({ normalizedConfig, locale, compone
     locale: Locale;
     componentFactory: ComponentFactory;
 }): NormalizedMenuBarConfigObject;
+/**
+ * Initializes menu bar for given editor.
+ *
+ * @internal
+ */
+export declare function _initMenuBar(editor: Editor, menuBarView: MenuBarView): void;
 export {};

package/src/menubar/utils.js

@@ -5,10 +5,10 @@
 /**
  * @module ui/menubar/utils
  */
-import clickOutsideHandler from '../bindings/clickoutsidehandler.js';
 import MenuBarMenuListItemView from './menubarmenulistitemview.js';
-import { cloneDeep } from 'lodash-es';
+import clickOutsideHandler from '../bindings/clickoutsidehandler.js';
 import { logWarning } from '@ckeditor/ckeditor5-utils';
+import { cloneDeep } from 'lodash-es';
 const NESTED_PANEL_HORIZONTAL_OFFSET = 5;
 /**
  * Behaviors of the {@link module:ui/menubar/menubarview~MenuBarView} component.
@@ -1318,3 +1318,27 @@ function getIdFromGroupItem(item) {
 function isMenuDefinition(definition) {
     return typeof definition === 'object' && 'menuId' in definition;
 }
+/**
+ * Initializes menu bar for given editor.
+ *
+ * @internal
+ */
+export function _initMenuBar(editor, menuBarView) {
+    const menuBarViewElement = menuBarView.element;
+    editor.ui.focusTracker.add(menuBarViewElement);
+    editor.keystrokes.listenTo(menuBarViewElement);
+    const normalizedMenuBarConfig = normalizeMenuBarConfig(editor.config.get('menuBar') || {});
+    menuBarView.fillFromConfig(normalizedMenuBarConfig, editor.ui.componentFactory);
+    editor.keystrokes.set('Esc', (data, cancel) => {
+        if (menuBarViewElement.contains(editor.ui.focusTracker.focusedElement)) {
+            editor.editing.view.focus();
+            cancel();
+        }
+    });
+    editor.keystrokes.set('Alt+F9', (data, cancel) => {
+        if (!menuBarViewElement.contains(editor.ui.focusTracker.focusedElement)) {
+            menuBarView.focus();
+            cancel();
+        }
+    });
+}

package/src/toolbar/toolbarview.js

@@ -16,7 +16,6 @@ import { FocusTracker, KeystrokeHandler, Rect, ResizeObserver, global, isVisible
 import { icons } from '@ckeditor/ckeditor5-core';
 import { isObject } from 'lodash-es';
 import '../../theme/components/toolbar/toolbar.css';
-const { threeVerticalDots } = icons;
 export const NESTED_TOOLBAR_ICONS = {
     alignLeft: icons.alignLeft,
     bold: icons.bold,
@@ -336,7 +335,7 @@ export default class ToolbarView extends View {
         // Allow disabling icon by passing false.
         if (icon !== false) {
             // A pre-defined icon picked by name, SVG string, a fallback (default) icon.
-            dropdownView.buttonView.icon = NESTED_TOOLBAR_ICONS[icon] || icon || threeVerticalDots;
+            dropdownView.buttonView.icon = NESTED_TOOLBAR_ICONS[icon] || icon || icons.threeVerticalDots;
         }
         // If the icon is disabled, display the label automatically.
         else {
@@ -694,7 +693,7 @@ class DynamicGrouping {
             label: t('Show more items'),
             tooltip: true,
             tooltipPosition: locale.uiLanguageDirection === 'rtl' ? 'se' : 'sw',
-            icon: threeVerticalDots
+            icon: icons.threeVerticalDots
         });
         return dropdown;
     }

package/theme/components/arialiveannouncer/arialiveannouncer.css

@@ -8,3 +8,7 @@
 	left: -10000px;
 	top: -10000px;
 }
+
+.ck.ck-aria-live-region-list {
+	list-style-type: none;
+}

package/theme/components/tooltip/tooltip.css

@@ -3,6 +3,10 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
+@import "../../mixins/_unselectable.css";
+
 .ck.ck-balloon-panel.ck-tooltip {
+	@mixin ck-unselectable;
+
 	z-index: calc( var(--ck-z-dialog) + 100 );
 }

package/theme/globals/globals.css

@@ -4,7 +4,6 @@
  */
 
 @import "./_hidden.css";
-@import "./_reset.css";
 @import "./_zindex.css";
 @import "./_transition.css";
 @import "./_poweredby.css";

package/theme/mixins/_mediacolors.css

@@ -0,0 +1,20 @@
+/*
+ * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+@define-mixin ck-media-forced-colors {
+	@media (forced-colors: active) {
+		& {
+			@mixin-content;
+		}
+	}
+}
+
+@define-mixin ck-media-default-colors {
+	@media (forced-colors: none) {
+		& {
+			@mixin-content;
+		}
+	}
+}

package/theme/globals/_reset.css

@@ -1,13 +0,0 @@
-/*
- * Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-
-.ck.ck-reset,
-.ck.ck-reset_all,
-.ck-reset_all *:not(.ck-reset_all-excluded *) {
-	box-sizing: border-box;
-	width: auto;
-	height: auto;
-	position: static;
-}