quantum-uikit

Библиотека UI компонентов.

Установка

npm install quantum-uikit

Использование

import React from "react";
import { Button } from "quantum-uikit";

const ExampleComponent = () => (
  <div>
    <Button
      text="push me"
      onClick={() => {
        console.log("oh ee...");
      }}
    />
  </div>
);

Использование стилей

Для подключения стилей из библиотеки, необходимо импортировать файл index.css из папки dist до первого импорта локальных стилей. Т.е. есил в файле index.tsx идет

import React from "react";
import "./index.css";

то необходимо вставить после импорта React

import React from "react";

import "quantum-uikit/dist/indes.css";

import "./index.css";

Библиотека основана на css фреймворке tailwind, поэтому если в вашем проекте так же используется tailwind, во избежании перетирания стилей, необходимо убрать импорт стилей базового слоя, т.е. вместо

@tailwind base;
@tailwind components;
@tailwind utilities;

оставить

/** @tailwind base; */
@tailwind components;
@tailwind utilities;

Компоненты

Посмотреть примеры компонентов можно в StoryBook

License

MIT © a2soft