Could not find a declaration file for module 'react-split-grid'.

[gavinr]

I'm using create-react-app with the typescript template, and after installing npm install --save react-split-grid, and using the render style import, I am getting an error:

Could not find a declaration file for module 'react-split-grid'. 'C:/.../app/node_modules/react-split-grid/dist/react-split-grid.js' implicitly has an 'any' type.
  Try `npm install @types/react-split-grid` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-split-grid';`  TS7016

    3 | import "./App.css";
    4 |
  > 5 | import Split from "react-split-grid";
      |                   ^

Any ideas? I do see https://github.com/nathancahill/split/blob/master/packages/splitjs/index.d.ts - any way to install that in parallel?

[nathancahill]

react-split-grid does not have a definition file yet. This is a priority for sure.

[willium]

I started one

declare module "react-split-grid" {
	import React from "react"

	export interface TrackSize {
		[track: number]: number
	}

	export interface GridStyles {
		gridTemplateColumns?: string
		gridTemplateRows?: string
	}

	export interface RenderProps {
		getGridProps: () => {
			styles: GridStyles
		}
		getGutterProps: (
			direction: "row" | "column",
			track: number,
		) => {
			onMouseDown: (e: unknown) => void
			onTouchStart: (e: unknown) => void
		}
	}

	export type Render = (props: RenderProps) => React.Element | null

	export interface SplitGridProps extends GridStyles {
		minSize?: number
		columnMinSize?: number
		rowMinSize?: number
		columnMinSizes?: TrackSize
		rowMinSizes?: TrackSize
		snapOffset?: number
		columnSnapOffset?: number
		rowSnapOffset?: number
		dragInterval?: number
		columnDragInterval?: number
		rowDragInterval?: number
		cursor?: string
		columnCursor?: string
		rowCursor?: string
		onDrag?: (
			direction: "row" | "column",
			track: number,
			gridTemplateStyle: string,
		) => void
		onDragStart?: (direction: "row" | "column", track: number) => void
		onDragEnd?: (direction: "row" | "column", track: number) => void
		gridTemplateColumns?: string
		gridTemplateRows?: string
	}

	export interface ChildrenPattern {
		children: Render
	}

	export interface RenderPattern {
		render: Render
	}

	export interface ComponentPattern {
		component: React.Node
	}

	declare const Split: React.FunctionComponent<SplitGridProps &
		(ChildrenPattern | RenderPattern | ComponentPattern)>

	export default Split
}