feat(morph): add abort parameter to cancel function (quasarframework#7538)

Author: pdanpdan

ui/src/utils/morph.js

@@ -660,12 +660,18 @@ export default function morph (_options) {
         animationTo.addEventListener('finish', cleanup)
         animationTo.addEventListener('cancel', cleanup)
 
-        cancel = () => {
+        cancel = abort => {
           // we are not in a morph that we can cancel
           if (cancelStatus === true || animationTo === void 0) {
             return false
           }
 
+          if (abort === true) {
+            cleanup()
+
+            return true
+          }
+
           endElementTo = endElementTo !== true
 
           animationFromClone !== void 0 && animationFromClone.reverse()
@@ -855,12 +861,18 @@ export default function morph (_options) {
         elTo.addEventListener('animationend', cleanup)
         elTo.addEventListener('animationcancel', cleanup)
 
-        cancel = () => {
+        cancel = abort => {
           // we are not in a morph that we can cancel
           if (cancelStatus === true || !elTo || !elFromClone || !elToClone) {
             return false
           }
 
+          if (abort === true) {
+            cleanup()
+
+            return true
+          }
+
           endElementTo = endElementTo !== true
 
           animationDirection = animationDirection === 'normal' ? 'reverse' : 'normal'
@@ -924,5 +936,5 @@ export default function morph (_options) {
   // returns:
   //   false if the cancel cannot be performed (the morph ended already or has not started)
   //   true else
-  return () => cancel()
+  return abort => cancel(abort)
 }

ui/types/utils.d.ts

@@ -27,8 +27,8 @@ export function throttle<F extends (...args: any[]) => any>(
 export function uid(): string;
 
 interface MorphOptions {
-  from: Element | string | (() => Element | undefined);
-  to?: Element | string | (() => Element | undefined);
+  from: Element | string | (() => Element | null | undefined);
+  to?: Element | string | (() => Element | null | undefined);
   onToggle?: () => void;
   waitFor?: number | 'transitionend' | Promise<any>;
 
@@ -52,4 +52,4 @@ interface MorphOptions {
   onReady?: (end: 'to' | 'from') => void;
 }
 
-export function morph(options: MorphOptions): () => boolean;
+export function morph(options: MorphOptions): (abort?: boolean) => boolean;