Expose config extension (custom classGroups) for projects with custom Tailwind theme
- 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
Avaliação
Esta issue ainda não foi avaliada.