Add utility that merges cn and composeRenderProps

[jvliwanag]

Currently, most components call composeRenderProps with cn to form the className. Wondering if we can introduce acn which merges the functionality of the two.

// current
<Calendar
  className={composeRenderProps(className, (className) =>
     cn("w-fit", className)
    )}
/>

// with `acn`
<Calendar
  className={acn("w-fit", className)}
/>

We can define acn as follows:

type AClassValue<T> = ClassValue | ((t: T) => ClassValue);

export function acn<T>(...acvs: AClassValue<T>[]): (t: T) => string {
  return (t: T) => {
    const cvs = acvs.map((acv) => (acv instanceof Function ? acv(t) : acv));
    return cn(...cvs);
  };
}

Alternatively, if we do not wish to introduce a separate utility function, we can just make modify cn instead so that it ends up with the following signature:

export function cn(...acvs: ClassValue[]): string;
export function cn<T>(...acvs: AClassValue<T>[]): string | ((t: T) => string);

This alternative cn will need to do more work at runtime though -- and so personally prefer keeping them separate.

I can open a pull req implementing any of the two approaches.

[jolbol1]

I did have setup once. My issue with it is it adds an install step to those coming over from shadcn based setup/install, but maybe thats easier enough to understand if I document it. Plus it would become apparent quickly that something is missing.

I think If I had set-up my own CLI that followed or used shadcn's and then applied some migration code, this would work really well as well.