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

…7538)
pdanpdan · Jul 31, 2020 · 85e75bd · 85e75bd
1 parent 5a1e4d6
commit 85e75bd
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 6 deletions.
diff --git a/ui/src/utils/morph.js b/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)
 }
diff --git a/ui/types/utils.d.ts b/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;