iamacup / react-native-markdown-display

React Native 100% compatible CommonMark renderer
MIT License
564 stars 166 forks source link

children not assignable in Markdown component #176

Closed bitboxer closed 8 months ago

bitboxer commented 2 years ago

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.

ipoogleduck commented 2 years ago

I'm getting the same issue

ovezovv commented 1 year ago

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

alihussnain-git commented 1 year ago

any chances if this issue can be fixed?

bitboxer commented 1 year ago

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

alihussnain-git commented 1 year ago

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

Or simply use ts-ignore 😁

flodev commented 1 year ago

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

mguerrero-exe commented 11 months ago

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