@juspay/svelte-ui-components 2.2.1 → 2.2.3

package/dist/Img/Img.svelte

@@ -12,9 +12,7 @@
   }
 </script>
 
-{#if currentSrc && alt}
-  <img src={currentSrc} {alt} onerror={handleFallback} />
-{/if}
+<img src={currentSrc} {alt} onerror={handleFallback} />
 
 <style>
   img {

package/dist/Toast/Toast.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
   import { fly } from 'svelte/transition';
-  import type { Snippet } from 'svelte';
-  import type { ToastDirection } from './properties';
+  import type { ToastDirection, ToastProperties } from './properties';
   import type { FlyAnimationConfig } from '../types';
+  import { onMount } from 'svelte';
 
   let {
     duration = 2000,
@@ -23,28 +23,9 @@
     closeIconTestId,
     onToastHide,
     bottomContent
-  }: {
-    duration?: number | null;
-    leftIcon?: string | null;
-    message?: string | null;
-    subtext?: string | null;
-    rightIcon?: string | null;
-    type?: 'success' | 'error' | 'info' | 'warn' | null;
-    direction: ToastDirection;
-    overlapPage?: boolean;
-    inAnimationOffset?: number | null;
-    inAnimationDuration?: number | null;
-    outAnimationOffset?: number | null;
-    outAnimationDuration?: number | null;
-    testId?: string | null;
-    messageTestId?: string | null;
-    subTextTestId?: string | null;
-    closeIconTestId?: string | null;
-    onToastHide?: () => void;
-    bottomContent?: Snippet;
-  } = $props();
+  }: ToastProperties = $props();
 
-  const animationConfig: FlyAnimationConfig = getAnimationConfig(direction, overlapPage);
+  const animationConfig: FlyAnimationConfig = $derived(getAnimationConfig(overlapPage, direction));
 
   let showToast = $state(false);
   let timeoutId = $state<ReturnType<typeof setTimeout> | null>(null);
@@ -64,8 +45,8 @@
    * @returns {FlyAnimationConfig} Animation configuration object.
    */
   function getAnimationConfig(
-    toastDirection: ToastDirection | undefined = undefined,
-    overlapPage: boolean
+    overlapPage: boolean,
+    toastDirection?: ToastDirection,
   ): FlyAnimationConfig {
     // Initializing variables to store animation offsets
     let inX: number = 0;
@@ -113,9 +94,9 @@
     };
   }
 
-  $effect(() => {
+  onMount(() => {
     showToast = true;
-    timeoutId = setTimeout(hideToast, 200);
+    timeoutId = setTimeout(hideToast, duration);
 
     return () => {
       if (timeoutId !== null) {

package/dist/Toast/Toast.svelte.d.ts

@@ -1,25 +1,4 @@
-import type { Snippet } from 'svelte';
-import type { ToastDirection } from './properties';
-type $$ComponentProps = {
-    duration?: number | null;
-    leftIcon?: string | null;
-    message?: string | null;
-    subtext?: string | null;
-    rightIcon?: string | null;
-    type?: 'success' | 'error' | 'info' | 'warn' | null;
-    direction: ToastDirection;
-    overlapPage?: boolean;
-    inAnimationOffset?: number | null;
-    inAnimationDuration?: number | null;
-    outAnimationOffset?: number | null;
-    outAnimationDuration?: number | null;
-    testId?: string | null;
-    messageTestId?: string | null;
-    subTextTestId?: string | null;
-    closeIconTestId?: string | null;
-    onToastHide?: () => void;
-    bottomContent?: Snippet;
-};
-declare const Toast: import("svelte").Component<$$ComponentProps, {}, "">;
+import type { ToastProperties } from './properties';
+declare const Toast: import("svelte").Component<ToastProperties, {}, "">;
 type Toast = ReturnType<typeof Toast>;
 export default Toast;

package/dist/Toast/properties.d.ts

@@ -1,13 +1,14 @@
+import type { Snippet } from "svelte";
 export type ToastType = 'success' | 'error' | 'info' | 'warn';
 export type ToastDirection = 'left-to-right' | 'right-to-left' | 'top-to-bottom' | 'bottom-to-top';
 export type ToastProperties = {
-    duration: number;
+    duration?: number;
     leftIcon?: string | null;
     message: string;
     subtext?: string | null;
     rightIcon?: string | null;
     type?: ToastType | null;
-    direction?: ToastDirection | null;
+    direction?: ToastDirection;
     overlapPage?: boolean;
     inAnimationOffset?: number | null;
     inAnimationDuration?: number | null;
@@ -17,4 +18,6 @@ export type ToastProperties = {
     messageTestId?: string;
     subTextTestId?: string;
     closeIconTestId?: string;
+    bottomContent?: Snippet;
+    onToastHide?: () => void;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@juspay/svelte-ui-components",
-  "version": "2.2.1",
+  "version": "2.2.3",
   "scripts": {
     "dev": "vite dev --host",
     "build": "vite build && npm run package",