What is a return type of a `use` directive?-CodePudding

After reading svelte tutorial I noticed that clickOutside function returns an object with a destroy method.

What would be the correct return type of a custom use directive?

export function clickOutside(node: HTMLElement): ??? { 
    // setup work goes here...

    return {
        destroy() {
            // ...cleanup goes here
        }
    };
}

CodePudding user response：

It's an ActionReturn

export interface ActionReturn<Parameter = any> {
  update?: (parameter: Parameter) => void;
  destroy?: () => void;
}

Available from import type { ActionReturn } from "svelte/types/runtime/action";

But instead of the ActionReturn i'll suggest using the Action type:

import type { Action } from "svelte/types/runtime/action";

const clickOutside: Action<HTMLElement, undefined> = (node) => {
  // setup work goes here...
  return {
    destroy() {
      // ...cleanup goes here
    }
  };
};

Because that allows Typescript to verify that the type of the options parameter for the action and the update method are of the same type.