SHAD0005Keep component classes statically analyzable

Why it happens

Unreadable class values on recognized components prevent other design-system Rules from checking those classes. Complete static strings and conditional choices between them remain analyzable.

Fix

Choose between complete class strings instead of assembling class names from dynamic fragments. Keep component-owned variant calls inside the component implementation.

Example

Choose between complete class names

Before

import { Button } from "@/components/ui/button"

export function SaveButton({ width }: { width: string }) {
  return <Button className={`w-${width}`}>Save</Button>
}

After

import { Button } from "@/components/ui/button"

export function SaveButton({ wide }: { wide: boolean }) {
  return <Button className={wide ? "w-full" : "w-auto"}>Save</Button>
}

Verify the fix

Run only this rule after editing so the report stays focused on the diagnostic you are closing:

pnpm vite-doctor . --extends shadcn/strict --rules shadcn/require-static-classes

Useful links

• Upstream docs

Related rule

• shadcn/require-static-classes