@aurigma/design-atoms
Version:
Design Atoms is a part of Customer's Canvas SDK which allows for manipulating individual design elements through your code.
97 lines (96 loc) • 3.56 kB
TypeScript
import { CanvasElementHandler } from "../../CanvasElementHandler";
import { EventManager } from "../EventManager";
import { Viewer } from "../../Viewer";
import { Canvas } from "../../Canvas";
import { SelectionHandler } from "../Selection/SelectionHandler";
export declare class FloatingToolbarManager {
private _canvasElementHandler;
private _viewer;
private _canvas;
private _selectionHandler;
private _config;
private _floatingToolbarElementHandler;
private _descriptors;
private _eventManager;
private _currentHandlerItem;
private _dndIsInProgress;
private _selectedHandler;
private _isInEditMode;
private readonly _handleId;
private readonly _selectId;
private readonly _editId;
private readonly _deleteId;
constructor(_canvasElementHandler: CanvasElementHandler, _viewer: Viewer, _canvas: Canvas, _selectionHandler: SelectionHandler, config?: IFloatingItemToolbarConfig);
set configuration(conf: IFloatingItemToolbarConfig);
set eventManager(eventManager: EventManager);
private _onItemHandlerHover;
private _onSelectButtonClick;
private _onHandleButtonClick;
private _onEditButtonClick;
private _onDeleteButtonClick;
private _setCurrentItemHandler;
private _currentItemHandlerExitedEditMode;
private _currentItemHandlerEnteredEditMode;
private _updateButtonsVisibility;
private _getCurrentPermissions;
private _onItemPropertyChanged;
private _fullUpdate;
private _onSelectedItemChanged;
private _updateView;
private _updatePosition;
private _getPositionMode;
private get _defaultConfig();
get enabled(): boolean;
set enabled(v: boolean);
private get _isShowFloatingItemToolbar();
private _onDndStarted;
private _onDndFinished;
dispose(): void;
}
/**
* Floating Toolbar modes.
* @public
*/
export declare enum FloatingToolbarMode {
/** Displays the toolbar on the canvas regardless of user hover. */
Classic = "Classic",
/** Displays the toolbar on top of images and image placeholders when the user hovers over the item. */
Inside = "Inside"
}
/**
* A structure defining appearance of the Floating Item Toolbar.
* @example
* ```js
* configuration = {
* canvas: {
* floatingToolbar: {
* enabled: true,
* mode: "Inside",
* buttons: [ "Handle", "Select", "Edit" ]
* }
* }
* };
* ```
* @public
*/
export interface IFloatingItemToolbarConfig {
/** If `true`, displays the floating item toolbar. The default value is `true`. */
enabled?: boolean;
/** Specifies the mode of the Floating Item Toolbar. The default value is `FloatingToolbarMode.Classic`. */
mode?: FloatingToolbarMode;
/** CSS class to apply to the Floating Item toolbar. */
cssClass?: string;
/** Array of buttons for the toolbar. The default buttons are `["Select", "Edit", "Delete"]`. */
buttons?: FloatingToolbarButton[];
/** CSS class for the **Handle** button. */
handleButtonClass?: string;
/** CSS class for the **Select** button. */
selectButtonClass?: string;
/** CSS class for the **Edit** button. */
editButtonClass?: string;
/** CSS class for the **Delete** button. */
deleteButtonClass?: string;
/** CSS class for big buttons in the toolbar. */
bigButtonCssClass?: string;
}
export declare type FloatingToolbarButton = "Handle" | "Select" | "Edit" | "Delete";