Make it easy to pass className props down

Instead of writing:

export const MyComponent = (props: { className: string }) => {
  return (
    <div className={props.className}>
      <div className="pt-10 pb-14 px-8" />
    </div>
  );
};

I could write:

export const MyComponent = classy.div(() => {
  return <div className="pt-10 pb-14 px-8">;
});

Or:

const MyDiv = classy.div();

export const MyComponent = MyDiv.extend(() => {
    return <div className="pt-10 pb-14 px-8">;
});

This would introduce two API changes:

1. If the argument type is a function, classy creates a wrapped component.
2. Classy components can be extended by calling an extend method. If a classnames object is the argument, it is merged with the original classnames object. If a function is the argument, the original component is wrapped, as per 1.

Start by reading the existing classy component API and how classnames are currently supplied. Define the behavior for function arguments and the extend method, including merging classnames objects and wrapping components. Done means both proposed usage forms pass the project's available checks and preserve className behavior.