Drill 20: Make it smaller — Props and composition

import type { ComponentProps, ReactNode } from 'react'

type BadgeProps = {
  tone?: 'neutral' | 'success' | 'danger'
  children: ReactNode
}

function Badge({ tone = 'neutral', children }: BadgeProps) {
  return <span className={'badge badge-' + tone}>{children}</span>
}

type ButtonProps = ComponentProps<'button'>

function Button(props: ButtonProps) {
  return <button {...props} />
}