anime icon indicating copy to clipboard operation
anime copied to clipboard

[BUG]: animejs 4 doesn't expose all types.

Open ElPrudi opened this issue 9 months ago • 1 comments

Describe the bug

I was trying to build an anime4js handler to shorten code further and workout around intended behavior and came across some type issues. For example the types WAAPIAnimationParams and TimePosition give typescript errors with TimePosition being declared only locally and WAAPIAnimationParams missing completely.

Provide a minimal reproduction demo of the bug

You can fork this CodePen template or use a similar service to provide a minimal reproduction demo so I can quickly follow the steps to reproduce your problem.

Detail the steps to reproduce the behavior in the minimal reproduction demo

Here is my handler:

import { createTimeline, type Timeline, type AnimationParams, type DefaultsParams, waapi, type DOMTargetsParam, type WAAPIAnimationParams, type TimePosition } from 'animejs'

export default class ChainedAnim {
  #anim: Timeline
  #waapi: boolean

  constructor(params: DefaultsParams, waapi = false) {
    this.#anim = createTimeline({ defaults: params })
    this.#waapi = waapi
  }

  add(el: DOMTargetsParam, params: AnimationParams | WAAPIAnimationParams, offset?: TimePosition): this {
    if (this.#waapi) {
      this.#anim.sync(waapi.animate(el, params))
    }
    this.#anim.add(el, params, offset)
    return this
  }
  animate(): void {
    const anim = this.#anim
    if (anim.began) anim.reverse()
    else if (anim.paused) anim.play()
  }
}

Error log:

 ERROR(TypeScript)  '"animejs"' has no exported member named 'WAAPIAnimationParams'. Did you mean 'AnimationParams'?
 FILE  <project>/utils/classes/ChainedAnim.ts:1:118

  > 1 | import { createTimeline, type Timeline, type AnimationParams, type DefaultsParams, waapi, type DOMTargetsParam, type WAAPIAnimationParams, type TimePosition } from 'animejs'
      |                                                                                                                      ^^^^^^^^^^^^^^^^^^^^
    2 |
    3 | export default class ChainedAnim {
    4 |   #anim: Timeline

 ERROR(TypeScript)  Module '"animejs"' declares 'TimePosition' locally, but it is not exported.
 FILE  <project>/utils/classes/ChainedAnim.ts:1:145

  > 1 | import { createTimeline, type Timeline, type AnimationParams, type DefaultsParams, waapi, type DOMTargetsParam, type WAAPIAnimationParams, type TimePosition } from 'animejs'
      |                                                                                                                                                 ^^^^^^^^^^^^
    2 |
    3 | export default class ChainedAnim {
    4 |   #anim: Timeline

[TypeScript] Found 2 errors. Watching for file changes.

Describe the expected behavior

It should not throw any type errors on types described in the type declaration file

Environment details

❯ npx envinfo --system --npmPackages animejs --binaries --browsers

  System:
    OS: macOS 15.4.1
    CPU: (12) arm64 Apple M4 Pro
    Memory: 143.13 MB / 24.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.14.0 - ~/.nvm/versions/node/v22.14.0/bin/node
    npm: 10.9.2 - ~/.nvm/versions/node/v22.14.0/bin/npm
    pnpm: 10.11.0 - ~/.nvm/versions/node/v22.14.0/bin/pnpm
  Browsers:
    Chrome: 136.0.7103.114
    Safari: 18.4
  npmPackages:
    animejs: ^4.0.2 => 4.0.2

ElPrudi avatar May 16 '25 13:05 ElPrudi

StaggerParameters and StaggerFunction as well. Would it be possible to rename it into StaggerParams because it goes against naming conventions?

ElPrudi avatar May 20 '25 13:05 ElPrudi

i’d like to look into this, can i carry on with that?

AdeboyeDN avatar Jul 12 '25 10:07 AdeboyeDN

@juliangarnier what do you think about exporting StaggerParameter as StaggerParams as mentioned above.

It's been a while :)

AdeboyeDN avatar Jul 14 '25 14:07 AdeboyeDN

StaggerParams is apparently already fixed on the beta branch.

Ideally I would like to find a way to automatically export all the JSDoc types, even the ones declared in their modules, without having to declare them separately in types.js if that makes sense?

I'm not really sure why only the types declared in types.js end up being exported in the index.d.ts file, would love some help on this.

juliangarnier avatar Jul 14 '25 14:07 juliangarnier

StaggerParams is apparently already fixed on the beta branch.

Ideally I would like to find a way to automatically export all the JSDoc types, even the ones declared in their modules, without having to declare them separately in types.js if that makes sense?

I'm not really sure why only the types declared in types.js end up being exported in the index.d.ts file, would love some help on this.

(Missed this)

Okay, that makes sense. The types.js file is currently being used because it is referenced in rollup.config.js.

I'll look into working on how to use other files instead of just the types.js , possibly in a separate PR.

AdeboyeDN avatar Jul 15 '25 18:07 AdeboyeDN

Hi, @juliangarnier , sorry it took a while, i just exposed TimePostion and WAAPI types, already looking into how to go around using just the src/types.js as the only types file.

AdeboyeDN avatar Jul 21 '25 16:07 AdeboyeDN

Coming up in v4.1.3

  • [x] Added missing WAAPIAnimation type to the Revertible type
  • [x] The stagger() function return type is now inferred from the input value type
  • [x] Fix the error "A rest parameter must be of an array type." of the linear easing type (#972)
  • [x] Export the following missing types:
  • SpringParams
  • TimelinePosition
  • TimelineAnimationPosition
  • WAAPITweenValue
  • WAAPIFunctionValue
  • WAAPIKeyframeValue
  • WAAPICallback
  • WAAPITweenOptions
  • WAAPIAnimationOptions
  • WAAPIAnimationParams
  • ScrollThresholdValue
  • ScrollThresholdParam
  • ScrollObserverAxisCallback
  • ScrollThresholdCallback
  • ScrollObserverParams

juliangarnier avatar Aug 11 '25 21:08 juliangarnier