@vaadin/dialog 25.1.0-alpha2 → 25.1.0-alpha3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/dialog",
-  "version": "25.1.0-alpha2",
+  "version": "25.1.0-alpha3",
   "publishConfig": {
     "access": "public"
   },
@@ -36,24 +36,24 @@
   ],
   "dependencies": {
     "@open-wc/dedupe-mixin": "^1.3.0",
-    "@vaadin/component-base": "25.1.0-alpha2",
-    "@vaadin/lit-renderer": "25.1.0-alpha2",
-    "@vaadin/overlay": "25.1.0-alpha2",
-    "@vaadin/vaadin-themable-mixin": "25.1.0-alpha2",
+    "@vaadin/component-base": "25.1.0-alpha3",
+    "@vaadin/lit-renderer": "25.1.0-alpha3",
+    "@vaadin/overlay": "25.1.0-alpha3",
+    "@vaadin/vaadin-themable-mixin": "25.1.0-alpha3",
     "lit": "^3.0.0"
   },
   "devDependencies": {
-    "@vaadin/a11y-base": "25.1.0-alpha2",
-    "@vaadin/aura": "25.1.0-alpha2",
-    "@vaadin/chai-plugins": "25.1.0-alpha2",
-    "@vaadin/test-runner-commands": "25.1.0-alpha2",
+    "@vaadin/a11y-base": "25.1.0-alpha3",
+    "@vaadin/aura": "25.1.0-alpha3",
+    "@vaadin/chai-plugins": "25.1.0-alpha3",
+    "@vaadin/test-runner-commands": "25.1.0-alpha3",
     "@vaadin/testing-helpers": "^2.0.0",
-    "@vaadin/vaadin-lumo-styles": "25.1.0-alpha2",
+    "@vaadin/vaadin-lumo-styles": "25.1.0-alpha3",
     "sinon": "^21.0.0"
   },
   "web-types": [
     "web-types.json",
     "web-types.lit.json"
   ],
-  "gitHead": "dfeb6e14643ec923e5505ca645f7354c6dc170ec"
+  "gitHead": "b3bb340cfd5e837cda8498aee1608950362e5177"
 }

package/src/vaadin-dialog-draggable-mixin.js

@@ -93,11 +93,15 @@ export const DialogDraggableMixin = (superClass) =>
           window.addEventListener('touchend', this._stopDrag);
           window.addEventListener('mousemove', this._drag);
           window.addEventListener('touchmove', this._drag);
+
+          const { top, left, width, height } = this._originalBounds;
           if (this.$.overlay.$.overlay.style.position !== 'absolute') {
-            const { top, left } = this._originalBounds;
             this.top = top;
             this.left = left;
           }
+          this.dispatchEvent(
+            new CustomEvent('drag-start', { bubbles: true, composed: true, detail: { width, height, top, left } }),
+          );
         }
       }
     }
@@ -124,6 +128,12 @@ export const DialogDraggableMixin = (superClass) =>
       window.removeEventListener('touchmove', this._drag);
     }
 
+    /**
+     * Fired when the dialog drag is started.
+     *
+     * @event drag-start
+     */
+
     /**
      * Fired when the dialog drag is finished.
      *

package/src/vaadin-dialog-resizable-mixin.js

@@ -74,6 +74,9 @@ export const DialogResizableMixin = (superClass) =>
         window.addEventListener('touchend', this._resizeListeners.stop[direction]);
         this.$.overlay.setBounds(this._originalBounds);
         this.$.overlay.setAttribute('has-bounds-set', '');
+
+        const { width, height, top, left } = this._originalBounds;
+        this.dispatchEvent(new CustomEvent('resize-start', { detail: { width, height, top, left } }));
       }
     }
 
@@ -148,6 +151,12 @@ export const DialogResizableMixin = (superClass) =>
       return { width, height, top, left };
     }
 
+    /**
+     * Fired when the dialog resize is started.
+     *
+     * @event resize-start
+     */
+
     /**
      * Fired when the dialog resize is finished.
      *

package/src/vaadin-dialog.d.ts

@@ -34,11 +34,21 @@ export type DialogPosition = {
  */
 export type DialogOpenedChangedEvent = CustomEvent<{ value: boolean }>;
 
+/**
+ * Fired when the dialog resize is started.
+ */
+export type DialogResizeStartEvent = CustomEvent<DialogResizeDimensions>;
+
 /**
  * Fired when the dialog resize is finished.
  */
 export type DialogResizeEvent = CustomEvent<DialogResizeDimensions>;
 
+/**
+ * Fired when the dialog drag is started.
+ */
+export type DialogDragStartEvent = CustomEvent<DialogResizeDimensions>;
+
 /**
  * Fired when the dialog drag is finished.
  */
@@ -54,8 +64,12 @@ export interface DialogCustomEventMap {
 
   closed: DialogClosedEvent;
 
+  'resize-start': DialogResizeStartEvent;
+
   resize: DialogResizeEvent;
 
+  'drag-start': DialogDragStartEvent;
+
   dragged: DialogDraggedEvent;
 }
 
@@ -131,7 +145,9 @@ export type DialogEventMap = DialogCustomEventMap & HTMLElementEventMap;
  *
  * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.
  *
+ * @fires {CustomEvent} resize-start - Fired when the dialog resize is started.
  * @fires {CustomEvent} resize - Fired when the dialog resize is finished.
+ * @fires {CustomEvent} drag-start - Fired when the dialog drag is started.
  * @fires {CustomEvent} dragged - Fired when the dialog drag is finished.
  * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes.
  * @fires {CustomEvent} closed - Fired when the dialog is closed.

package/src/vaadin-dialog.js

@@ -88,7 +88,9 @@ export { DialogOverlay } from './vaadin-dialog-overlay.js';
  *
  * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.
  *
+ * @fires {CustomEvent} resize-start - Fired when the dialog resize is started.
  * @fires {CustomEvent} resize - Fired when the dialog resize is finished.
+ * @fires {CustomEvent} drag-start - Fired when the dialog drag is started.
  * @fires {CustomEvent} dragged - Fired when the dialog drag is finished.
  * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes.
  * @fires {CustomEvent} closed - Fired when the dialog is closed.

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/dialog",
-  "version": "25.1.0-alpha2",
+  "version": "25.1.0-alpha3",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -300,6 +300,10 @@
                 "name": "closed",
                 "description": "Fired when the dialog is closed."
               },
+              {
+                "name": "drag-start",
+                "description": "Fired when the dialog drag is started."
+              },
               {
                 "name": "dragged",
                 "description": "Fired when the dialog drag is finished."
@@ -308,6 +312,10 @@
                 "name": "resize",
                 "description": "Fired when the dialog resize is finished."
               },
+              {
+                "name": "resize-start",
+                "description": "Fired when the dialog resize is started."
+              },
               {
                 "name": "opened-changed",
                 "description": "Fired when the `opened` property changes."

package/web-types.lit.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/dialog",
-  "version": "25.1.0-alpha2",
+  "version": "25.1.0-alpha3",
   "description-markup": "markdown",
   "framework": "lit",
   "framework-config": {
@@ -131,6 +131,13 @@
                 "kind": "expression"
               }
             },
+            {
+              "name": "@drag-start",
+              "description": "Fired when the dialog drag is started.",
+              "value": {
+                "kind": "expression"
+              }
+            },
             {
               "name": "@dragged",
               "description": "Fired when the dialog drag is finished.",
@@ -145,6 +152,13 @@
                 "kind": "expression"
               }
             },
+            {
+              "name": "@resize-start",
+              "description": "Fired when the dialog resize is started.",
+              "value": {
+                "kind": "expression"
+              }
+            },
             {
               "name": "@opened-changed",
               "description": "Fired when the `opened` property changes.",