[feat]: Use `cn` instead of `ny` for class name helper

bryaneaton13 commented 1 month ago

Feature description

I'm suggesting switching back to the standard cn class name helper that shadcn and magicui use for the tailwind merge utility helper. The ny function is a custom thing that's not as clear what it means.

This will help when getting AI to auto-generate code (like GitHub copilot or Cursor) using the components already in the code base. And it'll help when using tools like v0.dev to create the UI elements.

Affected component/components

All Components with styling

Additional Context

Right now, the manual installation shows using this class name helper in lib/utils.ts:

import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"

export function ny(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}

I'm suggesting using this instead:

import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}

Before submitting

[X] I've made research efforts and searched the documentation
[X] I've searched for existing issues and PRs

github-actions[bot] commented 1 month ago

Hello there 👋 Thanks for opening your first issue. We welcome you to the ui community! 😊

lacymorrow commented 1 month ago

Yep, as few things "custom" as possible.

EdMaxi commented 3 weeks ago

+1 for it. IA's will work better with standards, if possible, when possible to sticky with standards of things already done previously.

lacymorrow commented 3 weeks ago

Plus, lots of folks use shadcn/ui. If you keep things standard we can use the same CLI to install components (like v0, magicui, personal registries, etc)

RayRizzling commented 1 week ago

Am I the only one who likes the ny ? ^^ it's helpful as I can clearly see the origin of the component when combining multiple frameworks/code snippets, like aceternity + nyxb. I run a snippet on the codebase to change the imports from import { ny } to import { cn as ny } when adding the whole lib or manually when just adding some snippets.

nyxb-ui / ui