0.0.3 • Published 4 months ago
@tuv-indo/badges v0.0.3
tuv badges
tuv badges is a strict and customizable badges component for web development projects, designed for simplicity and adherence to strict design guidelines.
Screenshots
Package instalation
Instal package using pnpm
pnpm add @tuv/badges
Instal package using yarn
yarn add @tuv/badges
Instal package using npm
npm i @tuv/badges
Usage/Examples
import React from "react";
import ReactDOM from "react-dom/client";
import {Badges} from "@tuv/badges";
const App = () => (
<div>
<Badges variant="success" text="hello" size="md" />
<Badges variant="danger" text="hello" size="md" />
<Badges variant="info" text="hello" size="md" />
<Badges variant="warning" text="hello" size="md" />
<Badges variant="dark" text="hello" size="md" />
</div>
);
ReactDOM.createRoot(document.getElementById("app")!).render(<App />);
Props @tuv/badges
Props that you can pass to <Badges {...props} />
Prop Name | Value | required |
---|---|---|
size | "sm" / "md" / "lg" / "xl ' | false |
variant | "success" / "danger" / "info" / "warning" / "dark" | false |
text | string | true |
LeftIcon | React.ComponentType<SVGProps> | false |
RightIcon | React.ComponentType<SVGProps> | false |
border | boolean | false |