@ckeditor/ckeditor5-widget 40.0.0 → 40.1.0

package/src/widgetresize/sizeview.js

@@ -1,63 +1,63 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module widget/widgetresize/sizeview
- */
-import { View } from '@ckeditor/ckeditor5-ui';
-/**
- * A view displaying the proposed new element size during the resizing.
- */
-export default class SizeView extends View {
-    constructor() {
-        super();
-        const bind = this.bindTemplate;
-        this.setTemplate({
-            tag: 'div',
-            attributes: {
-                class: [
-                    'ck',
-                    'ck-size-view',
-                    bind.to('_viewPosition', value => value ? `ck-orientation-${value}` : '')
-                ],
-                style: {
-                    display: bind.if('_isVisible', 'none', visible => !visible)
-                }
-            },
-            children: [{
-                    text: bind.to('_label')
-                }]
-        });
-    }
-    /**
-     * A method used for binding the `SizeView` instance properties to the `ResizeState` instance observable properties.
-     *
-     * @internal
-     * @param options An object defining the resizer options, used for setting the proper size label.
-     * @param resizeState The `ResizeState` class instance, used for keeping the `SizeView` state up to date.
-     */
-    _bindToState(options, resizeState) {
-        this.bind('_isVisible').to(resizeState, 'proposedWidth', resizeState, 'proposedHeight', (width, height) => width !== null && height !== null);
-        this.bind('_label').to(resizeState, 'proposedHandleHostWidth', resizeState, 'proposedHandleHostHeight', resizeState, 'proposedWidthPercents', (width, height, widthPercents) => {
-            if (options.unit === 'px') {
-                return `${width}×${height}`;
-            }
-            else {
-                return `${widthPercents}%`;
-            }
-        });
-        this.bind('_viewPosition').to(resizeState, 'activeHandlePosition', resizeState, 'proposedHandleHostWidth', resizeState, 'proposedHandleHostHeight', 
-        // If the widget is too small to contain the size label, display the label above.
-        (position, width, height) => width < 50 || height < 50 ? 'above-center' : position);
-    }
-    /**
-     * A method used for cleaning up. It removes the bindings and hides the view.
-     *
-     * @internal
-     */
-    _dismiss() {
-        this.unbind();
-        this._isVisible = false;
-    }
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module widget/widgetresize/sizeview
+ */
+import { View } from '@ckeditor/ckeditor5-ui';
+/**
+ * A view displaying the proposed new element size during the resizing.
+ */
+export default class SizeView extends View {
+    constructor() {
+        super();
+        const bind = this.bindTemplate;
+        this.setTemplate({
+            tag: 'div',
+            attributes: {
+                class: [
+                    'ck',
+                    'ck-size-view',
+                    bind.to('_viewPosition', value => value ? `ck-orientation-${value}` : '')
+                ],
+                style: {
+                    display: bind.if('_isVisible', 'none', visible => !visible)
+                }
+            },
+            children: [{
+                    text: bind.to('_label')
+                }]
+        });
+    }
+    /**
+     * A method used for binding the `SizeView` instance properties to the `ResizeState` instance observable properties.
+     *
+     * @internal
+     * @param options An object defining the resizer options, used for setting the proper size label.
+     * @param resizeState The `ResizeState` class instance, used for keeping the `SizeView` state up to date.
+     */
+    _bindToState(options, resizeState) {
+        this.bind('_isVisible').to(resizeState, 'proposedWidth', resizeState, 'proposedHeight', (width, height) => width !== null && height !== null);
+        this.bind('_label').to(resizeState, 'proposedHandleHostWidth', resizeState, 'proposedHandleHostHeight', resizeState, 'proposedWidthPercents', (width, height, widthPercents) => {
+            if (options.unit === 'px') {
+                return `${width}×${height}`;
+            }
+            else {
+                return `${widthPercents}%`;
+            }
+        });
+        this.bind('_viewPosition').to(resizeState, 'activeHandlePosition', resizeState, 'proposedHandleHostWidth', resizeState, 'proposedHandleHostHeight', 
+        // If the widget is too small to contain the size label, display the label above.
+        (position, width, height) => width < 50 || height < 50 ? 'above-center' : position);
+    }
+    /**
+     * A method used for cleaning up. It removes the bindings and hides the view.
+     *
+     * @internal
+     */
+    _dismiss() {
+        this.unbind();
+        this._isVisible = false;
+    }
+}

package/src/widgetresize.d.ts

@@ -1,125 +1,125 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module widget/widgetresize
- */
-import Resizer from './widgetresize/resizer';
-import { Plugin, type Editor } from '@ckeditor/ckeditor5-core';
-import { type Element, type ViewContainerElement } from '@ckeditor/ckeditor5-engine';
-import '../theme/widgetresize.css';
-/**
- * The widget resize feature plugin.
- *
- * Use the {@link module:widget/widgetresize~WidgetResize#attachTo} method to create a resizer for the specified widget.
- */
-export default class WidgetResize extends Plugin {
-    /**
-     * The currently selected resizer.
-     *
-     * @observable
-     */
-    selectedResizer: Resizer | null;
-    /**
-     * References an active resizer.
-     *
-     * Active resizer means a resizer which handle is actively used by the end user.
-     *
-     * @internal
-     * @observable
-     */
-    _activeResizer: Resizer | null;
-    /**
-     * A map of resizers created using this plugin instance.
-     */
-    private _resizers;
-    private _observer;
-    private _redrawSelectedResizerThrottled;
-    /**
-     * @inheritDoc
-     */
-    static get pluginName(): "WidgetResize";
-    /**
-     * @inheritDoc
-     */
-    init(): void;
-    /**
-     * Redraws the selected resizer if there is any selected resizer and if it is visible.
-     */
-    redrawSelectedResizer(): void;
-    /**
-     * @inheritDoc
-     */
-    destroy(): void;
-    /**
-     * Marks resizer as selected.
-     */
-    select(resizer: Resizer): void;
-    /**
-     * Deselects currently set resizer.
-     */
-    deselect(): void;
-    /**
-     * @param options Resizer options.
-     */
-    attachTo(options: ResizerOptions): Resizer;
-    /**
-     * Returns a resizer created for a given view element (widget element).
-     *
-     * @param viewElement View element associated with the resizer.
-     */
-    getResizerByViewElement(viewElement: ViewContainerElement): Resizer | undefined;
-    /**
-     * Returns a resizer that contains a given resize handle.
-     */
-    private _getResizerByHandle;
-    /**
-     * @param domEventData Native DOM event.
-     */
-    private _mouseDownListener;
-    /**
-     * @param domEventData Native DOM event.
-     */
-    private _mouseMoveListener;
-    private _mouseUpListener;
-}
-/**
- * Interface describing a resizer. It allows to specify the resizing host, custom logic for calculating aspect ratio, etc.
- */
-export interface ResizerOptions {
-    /**
-     * Editor instance associated with the resizer.
-     */
-    editor: Editor;
-    modelElement: Element;
-    /**
-     * A view of an element to be resized. Typically it's the main widget's view instance.
-     */
-    viewElement: ViewContainerElement;
-    unit?: 'px' | '%';
-    /**
-     * A callback to be executed once the resizing process is done.
-     *
-     * It receives a `Number` (`newValue`) as a parameter.
-     *
-     * For example, {@link module:image/imageresize~ImageResize} uses it to execute the resize image command
-     * which puts the new value into the model.
-     *
-     * ```ts
-     * {
-     *	editor,
-     *	modelElement: data.item,
-     *	viewElement: widget,
-     *
-     *	onCommit( newValue ) {
-     *		editor.execute( 'resizeImage', { width: newValue } );
-     *	}
-     * };
-     * ```
-     */
-    onCommit: (newValue: string) => void;
-    getResizeHost: (widgetWrapper: HTMLElement) => HTMLElement;
-    getHandleHost: (widgetWrapper: HTMLElement) => HTMLElement;
-    isCentered?: (resizer: Resizer) => boolean;
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module widget/widgetresize
+ */
+import Resizer from './widgetresize/resizer';
+import { Plugin, type Editor } from '@ckeditor/ckeditor5-core';
+import { type Element, type ViewContainerElement } from '@ckeditor/ckeditor5-engine';
+import '../theme/widgetresize.css';
+/**
+ * The widget resize feature plugin.
+ *
+ * Use the {@link module:widget/widgetresize~WidgetResize#attachTo} method to create a resizer for the specified widget.
+ */
+export default class WidgetResize extends Plugin {
+    /**
+     * The currently selected resizer.
+     *
+     * @observable
+     */
+    selectedResizer: Resizer | null;
+    /**
+     * References an active resizer.
+     *
+     * Active resizer means a resizer which handle is actively used by the end user.
+     *
+     * @internal
+     * @observable
+     */
+    _activeResizer: Resizer | null;
+    /**
+     * A map of resizers created using this plugin instance.
+     */
+    private _resizers;
+    private _observer;
+    private _redrawSelectedResizerThrottled;
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): "WidgetResize";
+    /**
+     * @inheritDoc
+     */
+    init(): void;
+    /**
+     * Redraws the selected resizer if there is any selected resizer and if it is visible.
+     */
+    redrawSelectedResizer(): void;
+    /**
+     * @inheritDoc
+     */
+    destroy(): void;
+    /**
+     * Marks resizer as selected.
+     */
+    select(resizer: Resizer): void;
+    /**
+     * Deselects currently set resizer.
+     */
+    deselect(): void;
+    /**
+     * @param options Resizer options.
+     */
+    attachTo(options: ResizerOptions): Resizer;
+    /**
+     * Returns a resizer created for a given view element (widget element).
+     *
+     * @param viewElement View element associated with the resizer.
+     */
+    getResizerByViewElement(viewElement: ViewContainerElement): Resizer | undefined;
+    /**
+     * Returns a resizer that contains a given resize handle.
+     */
+    private _getResizerByHandle;
+    /**
+     * @param domEventData Native DOM event.
+     */
+    private _mouseDownListener;
+    /**
+     * @param domEventData Native DOM event.
+     */
+    private _mouseMoveListener;
+    private _mouseUpListener;
+}
+/**
+ * Interface describing a resizer. It allows to specify the resizing host, custom logic for calculating aspect ratio, etc.
+ */
+export interface ResizerOptions {
+    /**
+     * Editor instance associated with the resizer.
+     */
+    editor: Editor;
+    modelElement: Element;
+    /**
+     * A view of an element to be resized. Typically it's the main widget's view instance.
+     */
+    viewElement: ViewContainerElement;
+    unit?: 'px' | '%';
+    /**
+     * A callback to be executed once the resizing process is done.
+     *
+     * It receives a `Number` (`newValue`) as a parameter.
+     *
+     * For example, {@link module:image/imageresize~ImageResize} uses it to execute the resize image command
+     * which puts the new value into the model.
+     *
+     * ```ts
+     * {
+     *	editor,
+     *	modelElement: data.item,
+     *	viewElement: widget,
+     *
+     *	onCommit( newValue ) {
+     *		editor.execute( 'resizeImage', { width: newValue } );
+     *	}
+     * };
+     * ```
+     */
+    onCommit: (newValue: string) => void;
+    getResizeHost: (widgetWrapper: HTMLElement) => HTMLElement;
+    getHandleHost: (widgetWrapper: HTMLElement) => HTMLElement;
+    isCentered?: (resizer: Resizer) => boolean;
+}