aidenybai / aidenybai/cnfast

Expose config extension (custom classGroups) for projects with custom Tailwind theme

Aberta
#8 1 comentário 6 reações 0 responsáveis Ver no GitHub
Linguagem predominante
TypeScript
Estrelas
1.2k
Forks
13
Merge médio
14h 53min
PRs com merge (30d)
7

Descrição

### Problem

`cnfast` ships with the default tailwind-merge config baked in and exposes no way to extend it. Projects that add **custom Tailwind theme utilities** (e.g. custom font sizes via `theme.extend.fontSize`) can't tell cnfast which class group those utilities belong to, so cnfast misclassifies them and produces a different result than configured `tailwind-merge`.

Concrete example — a project with custom font sizes `text-vs` / `text-xxs`:

```js
// configured tailwind-merge (extendTailwindMerge with these in the 'font-size' group):
cn('text-vs text-color-foo') // => 'text-vs text-color-foo' (size + color kept)

// cnfast 0.0.8 — treats text-vs as an arbitrary text-COLOR:
cn('text-vs text-color-foo') // => 'text-color-foo' (font size silently dropped!)
```

So any `cn()` call that combines a custom-named font size with a `text-*` color collapses them as if they conflict, dropping the size. Standard sizes (`text-sm`, etc.) are fine — only custom theme utilities are affected. This blocks adopting cnfast as a drop-in replacement in any codebase with a customized Tailwind theme.

### Why this looks easy to support

The machinery is already there internally — `src/lib/create-tailwind-merge.ts` exports a factory and the merge is built as:

```js
const createTailwindMerge = (createConfig) => { ... }
const twMerge = createTailwindMerge(getDefaultConfig)
```

with `getDefaultConfig` and (presumably) `mergeConfigs` already present. The README even notes the config is intentionally non-configurable. The ask is just to **re-expose** the existing pieces, mirroring tailwind-merge's public API, without touching the default fast-path.

### Proposed API

```ts
import { extendTailwindMerge, createTailwindMerge, getDefaultConfig } from 'cnfast'

// mirror tailwind-merge:
const twMerge = extendTailwindMerge({
extend: { classGroups: { 'font-size': ['text-vs', 'text-xxs'] } },
})
```

Optionally a `createCn(config)` factory so the optimized `cn` can be produced with a custom config too. Default `cn` / `twMerge` exports stay exactly as-is, so there's zero impact on the baked-in fast path for everyone else.

### Offer

Happy to send a PR if the direction is welcome — wanted to check appetite first given the deliberate "single, non-configurable config" design note.

Guia de contribuição

Abrir o guia de contribuição

Avaliação

Esta issue ainda não foi avaliada.

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.