Jump to content
Search Community

Export `gsap/types` for usage in helper functions

monolith test
Moderator Tag

Recommended Posts

Hi, I'm currently building some React hooks to make using GSAP easier in React.


const [tween, { ref }] = useTween(({ node }) =>
  gsap.to(node, { opacity: 0.5 })

// tween.play()
// tween.pause()

Now the tween value should have the type Tween | Timeline, but I don't have access to these types; so it is set to any.


Maybe there's already a way to do this and I'm missing something?

Link to comment
Share on other sites

Hi, @monolith I work with the typescript definitions in the downloaded zip-package all the time, and they work perfectly for me. But I have a very lean setup and I guess that you have a very different setup that might need the type-definitions to be exported? 



Link to comment
Share on other sites

Hey, yes I see the type definitions in the node_module, although I haven't been able to import them.

I tried
import { GSAPTween } from "gsap/types" and that doesn't work. (I don't know if it's possible with some environment config, maybe someone can shed some light on this).

I can probable copy the definitions and host them in my project, but it seems counter productive.

To me the import snippet above, would be an elegant way to provide the types to the community.
I believe, we would just need an index in the package to reexport them.

Link to comment
Share on other sites

Never mind, I realized that those types are accessible with import gsap from 'gsap/gsap-core'

Then gsap.core.Tween | gsap.core.Timeline 


It would be nice to document this usage and add references to each types in the docs.

Link to comment
Share on other sites

Those are intentionally not documented, and those aren't TypeScript definitions; those are actual classes. There's really no reason why anyone should be directly accessing those rather than going through the proper channels to generate instances like gsap.timeline(), gsap.to(), etc. I don't want to commit to having those available in the API in future versions, so use at your own risk. It's highly unlikely they'll go away in any v3 release, but possibly in v4.  


All the TypeScript definitions are indeed available through the /types directory. It sounds like you're actually trying to access the JavaScript class references themselves rather than the TypeScript information - is that right? If so, why? 

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...