clsx_-_biblioteka_standartizuje_robotu_z_css [wiki.hostingcloud.com.ua]

Эта страница только для чтения. Вы можете посмотреть её исходный текст, но не можете его изменить. Сообщите администратору, если считаете, что это неправильно.

====== CLSX ======
  * Використовуєтся коли повинно за якимись умовами длодавати або ні різні класи (з різним оформленням) на теги
  * [[https://www.npmjs.com/package/clsx|CLSX]]
<code>
npm install clsx
</code>
<code>
import clsx from "clsx";

const className = clsx(
  "first",
  10,
  undefined && "second",
  true && "third",
  false ? "fourth" : "fifth"
);
console.log(className); // "first 10 third fifth"

</code>
<code>
// src/components/Alert.jsx

import clsx from "clsx";
import "./Alert.css";

const Alert = ({ variant, outlined, elevated, children }) => {
  return (
    <p
      className={clsx(
        "alert",
        variant,
        outlined && "is-outlined",
        elevated && "is-elevated"
      )}
    >
      {children}
    </p>
  );
};

</code>