Argument of type 'AnimationController' is not assignable to parameter of type 'SvelteActionReturnType'.ts

[yasserlens]

Hello,

I'm getting this on Svelte using the following versions: "@sveltejs/kit": "^1.0.0-next.476", "svelte": "^3.50.1",

import autoAnimate from '@formkit/auto-animate';

<div use:autoAnimate >
{#each elements as el}
  <div> ... some content </div>
{/each}
</div>

Typescript complains with the following:

Argument of type 'AnimationController' is not assignable to parameter of type 'SvelteActionReturnType'.ts(2345)

The autoAnimate action works, but Typescript isn't happy due to the type issue.

[jhubbardsf]

I just wanted to point out this is occurring because Svelte expects its actions to have the following optional methods types.

update?: (newParams: P) => void;
destroy?: () => void;

They don't need to be implemented since I know there's not a Svelte specific code section for autoAnimate but that's what's throwing this error. Updating the AnimationController interface to the following fixes the error. But I'm not sure if that'll cause issues with other frameworks or if there's a better way to handle it.

export interface AnimationController<P> {
    /**
     * The original animation parent.
     */
    readonly parent: Element;
    /**
     * A function that enables future animations.
     */
    enable: () => void;
    /**
     * A function that disables future animations.
     */
    disable: () => void;
    /**
     * A function that returns true if the animations are currently enabled.
     */
    isEnabled: () => boolean;
    /**
     * (Svelte Specific) A function that runs if the parameters are changed.
     */
    update?: (newParams: P) => void;
   /**
    * (Svelte Specific) A function that runs when the componnet is removed from the DOM.
    */
    destroy?: () => void;
}

[braebo]

I hope this gets fixed!   In the meantime, this dirty hack helped me get Sveltekit to compile:

// src/lib/autoAnimate.ts

import type { Action } from 'svelte/action'
import autoAnimate from '@formkit/auto-animate'

export default autoAnimate as Action

Then you can import it from $lib/autoAnimate instead of from @formkit/autoAnimate.