search

kentcdodds / mdx-bundler

🦤 Give me MDX/TSX strings and I'll give you back a component you can render. Supports imports!
MIT License
1.77k stars 75 forks source link

MDX Components styling inlineCode option not working #89

Open danptr opened 3 years ago

danptr commented 3 years ago

Hi there!

This might very well be my mistake, but since switching from mdx-remote to mdx-bundler I can no longer embed custom styling for inline code.

const mdxComponents = {
  h1: (props) => <CustomHeading as="h1" size="xl" {...props} />,
  inlineCode: (props) => <InlineCode fontSize="0.8em" {...props} />,
  // more components...
}

And then infuse those components to my MDX like so:

export const MDXLayoutRenderer = ({ layout, mdxSource, ...rest }) => {
  const MDXLayout = useMemo(() => getMDXComponent(mdxSource), [mdxSource]);

  return <MDXLayout layout={layout} components={mdxComponents} {...rest} />;
};

Everything works as expected and all components are styled the way they should be - except inlineCode. When I change inlineCode to code it works, but that also styles multiline code blocks. So to me it looks like the option for inlineCode has been removed.

nshen commented 3 years ago

it seems xdm removed inlineCode https://github.com/wooorm/xdm/issues/3