react-highlight
react-highlight copied to clipboard
TypeScript declaration module file [WIP]
Hello.
Thanks for your work. I just started to use your lib today, and because I'm using TypeScript, I made this:
// highlightable.d.ts
declare module 'highlightable' {
import { CSSProperties } from 'react';
export class Range {
start: number;
end: number;
text: string;
data: HighlightableProps;
constructor(start: number, end: number, text: string, data: Partial<HighlightableProps>);
}
export interface HighlightableProps {
ranges: Range[];
text: string;
enabled: boolean;
onMouseOverHighlightedWord?: (range: Range) => void;
onTextHighlighted: (range: Range) => void;
highlightStyle?: CSSProperties;
rangeRenderer?: (
currentRenderedNodes: string,
currentRenderedRange: Range,
currentRenderedIndex: number,
onMouseOverHighlightedWord: (range: Range) => void,
) => React.ReactNode;
}
export default function Highlightable(props: HighlightableProps): JSX.Element;
}
I'm not an expert in TypeScript, particularly making those declaration types file (it's new to me), but maybe it could help others to use your lib with TypeScript.
If anyone notice an error, or an amelioration, please let me know. I will try to update this comment to keep it up-to-date :)
[EDIT]
(12/09/2021): Replace Range interface with a class to match implementation