@ckeditor/ckeditor5-ui 44.1.0 → 44.2.0-alpha.1

package/dist/dropdown/menu/dropdownmenunestedmenuview.d.ts

@@ -1,135 +0,0 @@
-/**
- * @license 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
- */
-/**
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
-/**
- * @module ui/dropdown/menu/dropdownmenunestedmenuview
- */
-import { FocusTracker, KeystrokeHandler, type PositioningFunction, type Locale } from '@ckeditor/ckeditor5-utils';
-import type { FocusableView } from '../../focuscycler.js';
-import type BodyCollection from '../../editorui/bodycollection.js';
-import DropdownMenuButtonView from './dropdownmenubuttonview.js';
-import DropdownMenuListView from './dropdownmenulistview.js';
-import View from '../../view.js';
-import DropdownMenuNestedMenuPanelView, { type DropdownMenuNestedMenuPanelPosition } from './dropdownmenunestedmenupanelview.js';
-import '../../../theme/components/dropdown/menu/dropdownmenu.css';
-/**
- * Represents a nested menu view.
- */
-export default class DropdownMenuNestedMenuView extends View implements FocusableView {
-    /**
-     * An array of delegated events for the dropdown menu definition controller.
-     * These events are delegated to the dropdown menu element.
-     */
-    static readonly DELEGATED_EVENTS: readonly ["mouseenter", "execute", "change:isOpen"];
-    readonly id: string;
-    /**
-     * Button of the menu view.
-     */
-    readonly buttonView: DropdownMenuButtonView;
-    /**
-     * Panel of the menu. It hosts children of the menu.
-     */
-    readonly panelView: DropdownMenuNestedMenuPanelView;
-    /**
-     * List of nested menu entries.
-     */
-    readonly listView: DropdownMenuListView;
-    /**
-     * Tracks information about the DOM focus in the menu.
-     */
-    readonly focusTracker: FocusTracker;
-    /**
-     * Instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}. It manages
-     * keystrokes of the menu.
-     */
-    readonly keystrokes: KeystrokeHandler;
-    /**
-     * Controls whether the menu is open, i.e. shows or hides the {@link #panelView panel}.
-     *
-     * @observable
-     */
-    isOpen: boolean;
-    /**
-     * Controls whether the menu is enabled, i.e. its {@link #buttonView} can be clicked.
-     *
-     * @observable
-     */
-    isEnabled: boolean;
-    /**
-     * (Optional) The additional CSS class set on the menu {@link #element}.
-     *
-     * @observable
-     */
-    class: string | undefined;
-    /**
-     * The name of the position of the {@link #panelView}, relative to the menu.
-     *
-     * **Note**: The value is updated each time the panel gets {@link #isOpen open}.
-     *
-     * @observable
-     * @default 'w'
-     */
-    panelPosition: DropdownMenuNestedMenuPanelPosition;
-    /**
-     * The parent menu view of the menu. It is `null` for top-level menus.
-     *
-     * @observable
-     * @default null
-     */
-    readonly parentMenuView: DropdownMenuNestedMenuView | null;
-    private _bodyCollection;
-    /**
-     * Creates a new instance of the DropdownMenuView class.
-     *
-     * @param locale
-     * @param bodyCollection
-     * @param id
-     * @param label The label for the dropdown menu button.
-     * @param parentMenuView The parent dropdown menu view, if any.
-     */
-    constructor(locale: Locale, bodyCollection: BodyCollection, id: string, label: string, parentMenuView: DropdownMenuNestedMenuView | null);
-    /**
-     * An array of positioning functions used to determine the position of the dropdown menu panel.
-     * The order of the functions in the array determines the priority of the positions to be tried.
-     * The first function that returns a valid position will be used.
-     *
-     * @returns {Array<PositioningFunction>} An array of positioning functions.
-     * @internal
-     */
-    get _panelPositions(): Array<PositioningFunction>;
-    /**
-     * @inheritDoc
-     */
-    render(): void;
-    /**
-     * @inheritDoc
-     */
-    destroy(): void;
-    /**
-     * @inheritDoc
-     */
-    focus(): void;
-    private _handleParentMenuView;
-    /**
-     * Attach all keyboard behaviors for the menu view.
-     */
-    private _attachBehaviors;
-    /**
-     * Mounts the portal view in the body when the menu is open and removes it when the menu is closed.
-     * Binds keystrokes to the portal view when the menu is open.
-     */
-    private _mountPanelOnOpen;
-    /**
-     * Removes the panel view from the editor's body and removes it from the focus tracker.
-     */
-    private _removePanelFromBody;
-    /**
-     * Adds the panel view to the editor's body and sets up event listeners.
-     */
-    private _addPanelToBody;
-}

package/dist/dropdown/menu/dropdownmenurootlistview.d.ts

@@ -1,144 +0,0 @@
-/**
- * @license 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
- */
-/**
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
-/**
- * @module ui/dropdown/menu/dropdownmenurootlistview
- */
-import DropdownMenuListItemButtonView from './dropdownmenulistitembuttonview.js';
-import DropdownMenuNestedMenuView from './dropdownmenunestedmenuview.js';
-import DropdownMenuListView from './dropdownmenulistview.js';
-import type BodyCollection from '../../editorui/bodycollection.js';
-import type { DropdownMenuDefinition } from './utils.js';
-import type { Locale, BaseEvent } from '@ckeditor/ckeditor5-utils';
-/**
- * Creates and manages a multi-level menu UI structure, suitable to be used inside dropdown components.
- *
- * This class creates a menu structure based on {@link module:ui/dropdown/menu/utils~DropdownMenuDefinition declarative definition}
- * passed in the constructor.
- *
- * Below is an example of a simple definition, that describes a menu with two sub-menus (Menu 1, Menu 2) and four buttons in total (Item A,
- * Item B, Item C, Item D):
- *
- * ```js
- * [
- * 	{
- * 		id: 'menu_1',
- * 		menu: 'Menu 1',
- * 		children: [
- * 			{ id: 'menu_1_a', label: 'Item A' },
- * 			{ id: 'menu_1_b', label: 'Item B' }
- * 		]
- * 	},
- * 	{
- * 		id: 'menu_2',
- * 		menu: 'Menu 2',
- * 		children: [
- * 			{ id: 'menu_2_c', label: 'Item C' },
- * 		]
- * 	},
- * 	{ id: 'item_d', label: 'Item D' }
- * ]
- * ```
- *
- * The menu is build using multiple view classes. The most important are:
- *
- * * {@link module:ui/dropdown/menu/dropdownmenunestedmenuview~DropdownMenuNestedMenuView `DropdownMenuNestedMenuView`} - "menu" - provides
- * a panel with a nested menu, and a button which opens the panel,
- * * {@link module:ui/dropdown/menu/dropdownmenulistitembuttonview~DropdownMenuListItemButtonView `DropdownMenuListItemButtonView`} -
- * "button" or "leaf button" (as opposed to buttons provided by `DropdownMenuNestedMenuView`) - should trigger some action when pressed.
- *
- * Instances of these two classes are created based on the data provided in definitions. They are assigned proper IDs and labels.
- * Other view classes build a proper DOM structure around menus and buttons.
- *
- * The `DropdownMenuNestedMenuView` instances provides panels, which may include further menus or buttons. These panels are added to
- * a `BodyCollection` view, which means they are appended outside the DOM editor and UI structure.
- *
- * When "leaf button" is pressed, it fires `execute` event which is delegated to `DropdownMenuRootListView` as `menu:execute` event. You
- * can listen to this event to perform an action:
- *
- * ```js
- * rootListView.on( 'menu:execute', evt => {
- * 	console.log( evt.source.id ); // E.g. will print 'menu_1_a' when 'Item A' is pressed.
- * } );
- * ```
- *
- * All menus and "leaf" buttons created from the definition can be easily accessed through {@link ~DropdownMenuRootListView#menus `menus`}
- * and {@link ~DropdownMenuRootListView#buttons `buttons`} properties.
- *
- * For performance reasons, the whole menu structure is created only when `DropdownMenuRootListView` is rendered for the first time.
- *
- * It is recommended to use this class together with {@link module:ui/dropdown/utils~addMenuToDropdown `addMenuToDropdown()` helper}.
- */
-export default class DropdownMenuRootListView extends DropdownMenuListView {
-    /**
-     * The CSS class to be applied to nested menu panels in this dropdown menu.
-     *
-     * It is necessary, as the panels are created in body collection, outside editor and UI structure.
-     */
-    menuPanelClass: string | undefined;
-    /**
-     * The definitions object used to create the whole menu structure.
-     */
-    private readonly _definition;
-    /**
-     * Cached array of all menus in the dropdown menu (including nested menus).
-     */
-    private _cachedMenus;
-    /**
-     * Cached array of all buttons in the dropdown menu (including buttons in nested menus).
-     */
-    private _cachedButtons;
-    /**
-     * Editor body collection into which nested menus panels will be appended.
-     */
-    private _bodyCollection;
-    /**
-     * Creates an instance of the DropdownMenuRootListView class.
-     *
-     * @param locale
-     * @param bodyCollection
-     * @param definition The definition object used to create the menu structure.
-     */
-    constructor(locale: Locale, bodyCollection: BodyCollection, definition: DropdownMenuDefinition);
-    /**
-     * Returns the array of all menus in the dropdown menu (including nested menus).
-     */
-    get menus(): Array<DropdownMenuNestedMenuView>;
-    /**
-     * Returns the array of all buttons in the dropdown menu (including buttons in nested menus).
-     *
-     * Note, that this includes only "leaf" buttons, as specified in the definition passed in constructor. Buttons created as a part of
-     * the nested menus, that open nested menus when hovered or pressed, are not included.
-     */
-    get buttons(): Array<DropdownMenuListItemButtonView>;
-    /**
-     * @inheritDoc
-     */
-    render(): void;
-    /**
-     * Closes all nested menus.
-     */
-    closeMenus(): void;
-    /**
-     * Recursively creates the whole view tree structure for the dropdown menu, according to the passed `definitions`.
-     *
-     * @private
-     */
-    private _createStructure;
-}
-/**
- * Fired when one of the menu buttons is executed (through mouse click or keyboard).
- *
- * This event is a delegated `execute` event fired by the pressed button. The `event.source` is the button which was executed.
- *
- * @eventName ~DropdownMenuRootListView#menu:execute
- */
-export interface DropdownMenuRootListViewExecuteEvent extends BaseEvent {
-    name: 'menu:execute';
-    args: [];
-}

package/dist/dropdown/menu/utils.d.ts

@@ -1,128 +0,0 @@
-/**
- * @license 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
- */
-/**
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
- */
-/**
- * @module ui/dropdown/menu/utils
- */
-import type { PositioningFunction } from '@ckeditor/ckeditor5-utils';
-/**
- * Contains every positioning function used by {@link module:ui/dropdown/menu/dropdownmenunestedmenuview~DropdownMenuNestedMenuView} that
- * decides where the {@link module:ui/dropdown/menu/dropdownmenunestedmenuview~DropdownMenuNestedMenuView#panelView} should be placed.
- *
- * Positioning functions:
- *
- *	┌──────┬───────────────┐
- *	│      │               │
- *	└──────┤               │
- *	       │               │
- *	       │            ES │
- *	       └───────────────┘
- *
- *	┌───────────────┬──────┐
- *	│               │      │
- *	│               ├──────┘
- *	│               │
- *	│ WS            │
- *	└───────────────┘
- *
- *	       ┌───────────────┐
- *	       │            EN │
- *	       │               │
- *	┌──────┤               │
- *	│      │               │
- *	└──────┴───────────────┘
- *
- *	┌───────────────┐
- *	│ WN            │
- *	│               │
- *	│               ├──────┐
- *	│               │      │
- *	└───────────────┴──────┘
- */
-export declare const DropdownMenuPanelPositioningFunctions: Record<string, PositioningFunction>;
-/**
- * Represents the definition of a dropdown menu.
- */
-export type DropdownNestedMenuDefinition = {
-    /**
-     * Unique ID for the menu.
-     */
-    id: string;
-    /**
-     * The menu name. It is used as a label for the button which opens the menu list.
-     */
-    menu: string;
-    /**
-     * The children of the dropdown menu.
-     */
-    children: DropdownMenuDefinition;
-};
-/**
- * Represents the definition of a dropdown menu item.
- */
-export type DropdownMenuButtonDefinition = {
-    /**
-     * Unique ID for the button.
-     */
-    id: string;
-    /**
-     * The label for the button.
-     */
-    label: string;
-};
-/**
- * A definition for a nestable menu component.
- *
- * The menu can be flat and include only top-level items, or it can include multiple levels of nested sub-menus.
- *
- * Example:
- *
- * ```ts
- * [
- * 	{
- * 		id: 'menu_1',
- * 		menu: 'Menu 1',
- * 		children: [
- * 			{
- * 				id: 'menu_1_1',
- * 				menu: 'Nested menu 1',
- * 				children: [
- * 					{
- * 						id: 'item_x',
- * 						label: 'Item X'
- * 					}
- * 				]
- * 			},
- * 			{
- * 				id: 'menu_1_2',
- * 				menu: 'Nested menu 2',
- * 				children: [
- * 					{
- * 						id: 'item_y',
- * 						label: 'Item Y'
- * 					},
- * 					{
- * 						id: 'item_z',
- * 						label: 'Item Z'
- * 					}
- * 				]
- * 			}
- * 		]
- * 	},
- * 	{
- * 		id: 'top_a',
- * 		label: 'Top Item A'
- * 	},
- * 	{
- * 		id: 'top_b',
- * 		label: 'Top Item B'
- * 	}
- * ];
- * ```
- */
-export type DropdownMenuDefinition = Array<DropdownNestedMenuDefinition | DropdownMenuButtonDefinition>;