Cannot import Asset type from package

[bravokiloecho]

I'm trying to create a reusable component that accepts a video src from the videos/** directory.

If I define the props like this:

type VideoProps = {
  src: string
}

const Video = ({
  src,
}: VideoProps) => {
  ...
}

and then use the component like this:

import videoSrc from 'videos/video-example.mp4'
import Video from './Video'

...

<Video src={videoSrc} />

I get the following typescript warning:

Type 'Asset' is not assignable to type 'string'.ts(2322)
VideoBackground.tsx(11, 3): The expected type comes from property 'src' which is declared here on type 'IntrinsicAttributes & VideoBackgroundProps'
(property) src: string

Is there any way to import the Asset type to use as a prop type in a custom component?

[luwes]

import videoSrc from 'videos/video-example.mp4' should be import videoSrc from '/videos/video-example.mp4' I believe. does that work?

[bravokiloecho]

The issue is not with import the video. The video itself loads fine. It's a TypeScript issue.

You can see in the image below that when I import a video, it's interpreted as an Asset type. But I'm not able to find the definition of this Asset type.

I was hoping to be able to be able to import the type from the next-video package.

Does this make sense?