inline code

code block without code type

import { createChakraNextApp, defaultTheme } from '@47ng/chakra-next'

const foo = true || (null && undefined) ? Infinity : NaN

export default createChakraNextApp({
  theme: {
    ...defaultTheme,
    colors: {
      ...defaultTheme.colors
      // your colors here
    }
  }
})

Code block with title

const foo = (p: any) => {
  const isInternal = p.href.startsWith('#') || p.href.startsWith('/')
  const color = useLinkColor()
  if (isInternal) {
    return <RouteLink to={p.href} color={color} {...p} />
  }
  return <StyledLink color={color} {...p} />
}

Code block with line highlighting:

const foo = (p: any) => {
  const isInternal = p.href.startsWith('#') || p.href.startsWith('/')
  const color = useLinkColor()
  if (isInternal) {
    return <RouteLink to={p.href} color={color} {...p} />
  }
  return <StyledLink color={color} {...p} />
}

Code block with title and line highlighting:

const foo = (p: any) => {
  const isInternal = p.href.startsWith('#') || p.href.startsWith('/')
  const color = useLinkColor()
  if (isInternal) {
    return <RouteLink to={p.href} color={color} {...p} />
  }
  return <StyledLink color={color} {...p} />
}

Code in link: 47ng/cloak

Code surrounded by text, in link: foo 47ng/cloak bar