@types/filestack-react

[vb2228]

Hi, I was trying to use filestack-react in typescript, but it didn't suppose @typescript. Can anyone resolve this issue?

[deltek-rossjackson]

Any update on this one?

[mpoisot]

I see typescript has been added to Filestack-react, but for some reason types aren't working for me in VS Code. I'm able to use Filestack-react components just fine, it's only the typing that isn't working right.

I don't know much about how VS Code finds d.ts files, but perhaps it's because the d.ts file isn't located in the dist folder (it's only in the src folder)?

[BrentFarese]

So it seems that the distribution in the filestack-react package does not export types, which means that a TS project will not be able to resolve the types correctly, despite the types being present in src/index.d.ts. Can the project maintainers please expose the types in the distribution so that TS projects can consume those types?

It would be great if you can publish types to Definitely Typed or bundle the types correctly so they are exposed in the project. Thank you!

[deltek-rossjackson]

What we did in our codebase is that we recreated filestack-react and created our own button which is not hard to do. We use filestack-js which has the typings you need.

[mpoisot]

What I ended up doing was create a file filestack-react.d at the top level of my project. I initially copied /src/index.d.ts, but I modified it a bit to eliminate warnings.

declare module "filestack-react" {
  import React from "react"
  import { PickerFileMetadata, ClientOptions } from "filestack-js"

  type FilestackAction =
    | "transform"
    | "retrieve"
    | "metadata"
    | "storeUrl"
    | "upload"
    | "multiupload"
    | "remove"
    | "pick"
    | "removeMetadata"
    | "preview"
    | "logout"

  type ComponentDisplayModeType = "button" | "link" | "immediate"

  interface Props {
    apikey: string | undefined
    action?: FilestackAction
    componentDisplayMode?: {
      type?: ComponentDisplayModeType
      customText?: string
      customClass?: string
    }
    onSuccess?: (data: PickerResponse) => void
    onError?: (error: PickerFileMetadata[]) => void
    clientOptions?: ClientOptions
    file?: File
    source?: string
    customRender?: React.ComponentType<{ onPick: (arg: unknown) => void }>
    actionOptions: OptionsObject
  }

  declare class ReactFilestack extends React.Component<Props> {}
  export default ReactFilestack
}

[BrentFarese]

These are valid workarounds but really the maintainer should publish types on DefinitelyTyped or generate and expose proper types in the dist directory. We are just consuming filestack-js as well but considered using the React component and ran across this common TS issue, which sort of prevented our use of the component.

[mpoisot]

I figured out what was missing to get the existing types recognized and created a pull request.

[namoscato]

FYI v4.x also does not have any types.

[fishactual]

I realise everyone is busy but the fact that this package still does not have types is kind of a pain in the ass.

[zack-frontend]

This makes it incredibly difficult to use with React

[peterjhart]

Behold. https://www.npmjs.com/package/@types/filestack-react