QBDS Utilities

1import { type ClassValue, clsx } from 'clsx';
2import { extendTailwindMerge } from 'tailwind-merge';
3 
4// All Text Style classes from globals.css registered as a single conflict group.
5// This ensures cn('label-regular-primary', 'label-small-primary') → 'label-small-primary'
6const twMerge = extendTailwindMerge<'typography'>({
7  extend: {
8    classGroups: {
9      // Custom radius theme key (--radius-reg) so it conflicts with standard
10      // rounded-* utilities and className overrides win.
11      rounded: ['rounded-reg'],
12      typography: [
13        // Display
14        'display-d1-regular',
15        'display-d2-regular',
16        'display-d3-regular',
17        // Headings
18        'headings-h1-regular',
19        'headings-h2-semibold',
20        'headings-h2-regular',
21        'headings-h3-regular',
22        'headings-h3-semibold',
23        'headings-h4-regular',
24        'headings-h4-semibold',
25        // Labels
26        'label-large-primary',
27        'label-regular-primary',
28        'label-small-primary',
29        // Paragraph
30        'paragraph-large-primary',
31        'paragraph-large-primary-link',
32        'paragraph-large-emphasised',
33        'paragraph-regular-primary',
34        'paragraph-regular-primary-link',
35        'paragraph-regular-emphasised-600',
36        'paragraph-small-primary',
37        'paragraph-small-primary-link',
38        'paragraph-small-emphasised',
39        'paragraph-code-text',
40        // CTA Buttons
41        'cta-button-01',
42        'cta-button-link-01',
43        'cta-button-02',
44        'cta-button-link-02',
45        'cta-button-03',
46        'cta-button-link-03',
47      ],
48    },
49  },
50});
51 
52export function cn(...inputs: ClassValue[]) {
53  return twMerge(clsx(inputs));
54}