{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "utils",
  "title": "cn util and state recipes",
  "description": "clsx + tailwind-merge class combiner used by every kit component, and the class recipes the kit's controls share so a state looks the same everywhere: `focusRing` (a 2px --text outline 2px off the edge), `invalidRing` (aria-invalid draws a 2px --danger edge, the border plus a solid 1px ring), and `inputGroupFocusRing`/`inputGroupInvalidRing`, the same two for a group that wraps an input. Tailwind must scan this file, so keep it inside the app's sources.",
  "dependencies": [
    "clsx@2.1.1",
    "tailwind-merge@3.6.0"
  ],
  "files": [
    {
      "path": "src/lib/utils.ts",
      "content": "import { type ClassValue, clsx } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({\n  extend: {\n    classGroups: {\n      \"font-size\": [{ \"text-brand\": [\"title\", \"h2\", \"h3\", \"lede\", \"body\", \"small\", \"eyebrow\"] }],\n    },\n  },\n});\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n\nexport const focusRing =\n  \"outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring focus-visible:outline-solid\";\n\nexport const inputGroupFocusRing =\n  \"has-[:is(input,textarea):focus-visible]:outline-2 has-[:is(input,textarea):focus-visible]:outline-offset-2 has-[:is(input,textarea):focus-visible]:outline-ring has-[:is(input,textarea):focus-visible]:outline-solid\";\n\nexport const invalidRing =\n  \"aria-invalid:border-destructive aria-invalid:ring-1 aria-invalid:ring-destructive\";\n\nexport const inputGroupInvalidRing =\n  \"has-aria-invalid:border-destructive has-aria-invalid:ring-1 has-aria-invalid:ring-destructive\";\n",
      "type": "registry:lib",
      "target": "lib/utils.ts"
    }
  ],
  "type": "registry:lib"
}