cedricdelpoux / react-responsive-masonry

React responsive masonry component built with css flexbox
https://cedricdelpoux.github.io/react-responsive-masonry/
MIT License
362 stars 37 forks source link

Create .d.ts files for TypeScript #28

Open metalmatze opened 3 years ago

metalmatze commented 3 years ago

Hey,

thanks for the project! :100: Sadly my CI currently fails as it expects the types declared.

Try `npm i --save-dev @types/react-responsive-masonry` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-responsive-masonry';`

Now, I have never done this and would try to do it, however, if it an easy task for you I'd appreciate the help. Let me know!

abumalick commented 3 years ago

As a quick fix, you can create a declarations.d.ts file at the root of the project and write declare module 'react-responsive-masonry'; inside this file

It should silence the error.

popzelife commented 3 years ago

Here is a minimalist declaration.d.ts file

declare module 'react-responsive-masonry' {
  import * as React from 'react';

  const Masonry: React.FC<{
    columnsCount?: number
    gutter?: string
  }>

  export const ResponsiveMasonry: React.FC<{
    columnsCountBreakPoints?: Record<number, number>
  }>

  export default Masonry
}
CodeAunt commented 2 years ago

Put it inside the 'src' folder if you're using React

bruxr commented 1 year ago

In addition to @popzelife's declaration file, you can add additional props to support styling:

import React, { CSSProperties } from 'react'

const Masonry: React.FC<{
  columnsCount?: number
  gutter?: string
  className?: string
  style?: CSSProperties
}>

export const ResponsiveMasonry: React.FC<{
  columnsCountBreakPoints?: Record<number, number>
  className?: string
  style?: CSSProperties
}>
stevemeisner commented 8 months ago

We can leverage @types/react-responsive-masonry, now.

Using yarn: yarn add -D @types/react-responsive-masonry