• Allows react-markdown v8 and chakra-ui v2 (#27, thanks @baartch)
• Updates deprecated d=... property to display=... property.
• Changes type definition of first parameter. heading is not accepted as a property anymore since it isn't used anywhere. Use h1, h2, h3, h4, h5, h6 instead.

🔥💥 Breaking Changes

• react-markdown is updated to ^7. I did everything I can do to not create a breaking change but unfortunately, Components type is coming from react-markdown while it was coming from react-markdown/src/ast-to-react in version 6.

import ChakraUIRenderer from 'chakra-ui-markdown-renderer';

const newTheme = {
  p: props => {
    const { children } = props;
    return (
      <Text mb={2} fontSize={'12px'}>
        {children}
      </Text>
    );
  },
};

<ReactMarkdown components={ChakraUIRenderer(newTheme)} children={markdown} />;

Fixed

• Fixes deepmerge error that occures on nextjs.

Added

• Typescript support.

🔥💥 Breaking Changes

• There is no need to import defaults to extend/change default theme anymore. chakra-ui-markdown-renderer will merge default and your theme together automatically. If you have ...defaults in your theme, you may delete it safely.

import ChakraUIRenderer from 'chakra-ui-markdown-renderer';

const newTheme = {
  p: props => {
    const { children } = props;
    return <Text mb={2} fontSize={'12px'}>{children}</Text>;
  },
}

<ReactMarkdown
  components={ChakraUIRenderer(newTheme)}
  children={markdown}
  escapeHtml={false}
/>;

🔥💥 Breaking Changes

• Theme is revisited for react-markdown v6 big thanks to @davidgit. Please be careful before update your dependencies. This update can break your all markdown settings.

To migrate to new version, change renderers prop with components like react markdown says.

<ReactMarkdown
  components={ChakraUIRenderer()}
  children={markdown}
  escapeHtml={false}
/>;

Major Changes

• Now List type are using UnorderedList and OrderedList components according to providing type.
• Fixes Lists spacing wrong property. Changes 24 to 2.

If you want to use old List's, just extend defaults and change List key with this:

list: props => {
  const { start, ordered, children, depth } = props;
  let styleType = 'disc';
  if (ordered) styleType = 'decimal';
  if (depth === 1) styleType = 'circle';
  return (
    <List
      spacing={24}
      as={ordered ? 'ol' : 'ul'}
      styleType={styleType}
      pl={4}
    >
      {children}
    </List>
);

Added

• Library now uses rollup as a bundler.

🔥💥 Breaking Changes

• No more using @chakra-ui/core like Chakra-UI did. We're using @chakra-ui/react instead of @chakra-ui/core
• @chakra-ui/react and other dependencies that used by @chakra-ui/react now added as peerDependency. You should add @emotion/react @emotion/styled framer-motion packages to your project.

• Ability to extend defaults. Allow users to pass in an object as parameter and extend defaults.