🦺Class names type safety

It's like clsx but you can only pass it classes that are from the dsfr.

You can't apply your custom classes using fr.cx(), you'll get type error, but you can combine a regular cx() or clsx() function and fr.cx(). Example:

import { useStyles }Β from "tss-react/dsfr";
import { fr } from "@codegouvfr/react-dsfr";  

type Params = {
    className?: string;

export function MyComponent(params: Params){

   const { className }Β = params;  
   const { cx } = useStyles();
   return (
       <div className={cx(fr.cx("fr-p-10v"), className)}>


Last updated


2022-2023 PΓ΄le logiciel libre d'Etalab - MIT license