iamacup / react-native-markdown-display

React Native 100% compatible CommonMark renderer

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

children not assignable in Markdown component

bitboxer opened this issue · comments

I am getting this error when using typescript:

Type '{ children: string; style: { body: { fontSize: number; lineHeight: number; color: string; fontFamily: string; }; heading1: { fontSize: number; lineHeight: number; fontWeight: "bold"; }; heading2: { fontSize: number; lineHeight: number; fontWeight: "bold"; }; ... 4 more ...; bullet_list_icon: { ...; } | { ...; }; }; ...' is not assignable to type 'IntrinsicAttributes & MarkdownProps'.
  Property 'children' does not exist on type 'IntrinsicAttributes & MarkdownProps'.

Adding

children?: ReactNode

To the

export interface MarkdownProps {

Fixes it for me.

I'm getting the same issue

Same here also as well as @bitboxer defined above adding:

  children?: ReactNode;

to the node_modules/react-native-markdown-display/src/index.d.ts fixed type error, working variant is below:

  export interface MarkdownProps {
    rules?: RenderRules;
    children?: ReactNode;
    style?: StyleSheet.NamedStyles<any>;
    renderer?: AstRenderer;
    markdownit?: MarkdownIt;
    mergeStyle?: boolean;
    debugPrintTree?: boolean;
    onLinkPress?: (url: string) => boolean;
  }

Please, consider this I am using version 7.0.0-alpha.2

any chances if this issue can be fixed?

@alihussnain-git you can use patch-package to fix it temporary for yourself.

@alihussnain-git you can use patch-package to fix it temporary for yourself.

Or simply use ts-ignore 😁

I've extended the types
Somewhere in you code add a Markdown.d.ts

insert

import { ComponentType, ReactNode } from 'react';
import { MarkdownProps } from 'react-native-markdown-display';

declare module 'react-native-markdown-display' {
  export const ExtendedMarkdown: ComponentType<
    {
      children: ReactNode;
    } & MarkdownProps
  >;
  export = ExtendedMarkdown;
}

make sure the type file is in the folders mentioned in "typeRoots": ["./node_modules/@types", "./src/types"] in your tsconfig.json

I've extended the types Somewhere in you code add a Markdown.d.ts

insert

import { ComponentType, ReactNode } from 'react';
import { MarkdownProps } from 'react-native-markdown-display';

declare module 'react-native-markdown-display' {
  export const ExtendedMarkdown: ComponentType<
    {
      children: ReactNode;
    } & MarkdownProps
  >;
  export = ExtendedMarkdown;
}

make sure the type file is in the folders mentioned in "typeRoots": ["./node_modules/@types", "./src/types"] in your tsconfig.json

This worked for me :D