feat: forward all transition events

Signed-off-by: Florian-Schoenherr <[email protected]>

Author: Florian-Schoenherr

packages/svelte-materialify/src/components/Alert/Alert.svelte

@@ -37,6 +37,10 @@
     role="alert"
     class="s-alert {klass}"
     transition:transition={transitionOpts}
+    on:introstart
+    on:outrostart
+    on:introend
+    on:outroend
     class:dense
     class:outlined
     class:text

packages/svelte-materialify/src/components/Badge/Badge.svelte

@@ -27,6 +27,10 @@
       <span
         class="s-badge__badge {klass}"
         transition:transition
+        on:introstart
+        on:outrostart
+        on:introend
+        on:outroend
         class:bordered
         class:dot
         class:tile

packages/svelte-materialify/src/components/Dialog/Dialog.svelte

@@ -27,7 +27,11 @@
     <div
       class="s-dialog__content {klass}"
       class:fullscreen
-      transition:transition={{ duration: 300, start: 0.1 }}>
+      transition:transition={{ duration: 300, start: 0.1 }}
+      on:introstart
+      on:outrostart
+      on:introend
+      on:outroend>
       <slot />
     </div>
   </div>

packages/svelte-materialify/src/components/ExpansionPanels/ExpansionPanel.svelte

@@ -62,7 +62,13 @@
     </div>
   </button>
   {#if active}
-    <div class="s-expansion-panel__content" transition:slide={slideOpts}>
+    <div
+      class="s-expansion-panel__content"
+      transition:slide={slideOpts}
+      on:introstart
+      on:outrostart
+      on:introend
+      on:outroend>
       <slot />
     </div>
   {/if}

packages/svelte-materialify/src/components/List/ListGroup.svelte

@@ -48,6 +48,10 @@
   {#if active}
     <div
       transition:transition={transitionOpts}
+      on:introstart
+      on:outrostart
+      on:introend
+      on:outroend
       aria-disabled={disabled}
       class="s-list-group__items"
       class:offset

packages/svelte-materialify/src/components/NavigationDrawer/NavigationDrawer.svelte

@@ -26,6 +26,10 @@
 <aside
   class="s-navigation-drawer {klass}"
   transition:transition={transitionOpts}
+  on:introstart
+  on:outrostart
+  on:introend
+  on:outroend
   class:active
   class:fixed
   class:absolute

packages/svelte-materialify/src/components/Snackbar/Snackbar.svelte

@@ -45,6 +45,10 @@
   {#if active}
     <div
       transition:transition
+      on:introstart
+      on:outrostart
+      on:introend
+      on:outroend
       class="s-snackbar {klass}"
       class:outlined
       class:text