nextuiq
Version:
NextUIQ is a modern, lightweight, and developer-friendly UI component library for React and Next.js. Built with TypeScript and Tailwind CSS, it offers customizable, accessible, and performance-optimized components with built-in dark mode, theme customizat
2 lines (1 loc) • 1.72 kB
JavaScript
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index46.js");exports.Badge=({variant:r="light",color:t="primary",size:a="md",startIcon:h,endIcon:o,children:i,id:n=`badge-${Math.random().toString(36).substr(2,9)}`,role:s="status",ariaLabel:l})=>e.jsxRuntimeExports.jsxs("span",{className:`inline-flex items-center justify-center gap-1.5 rounded-full font-medium whitespace-nowrap ${{sm:"px-2 py-0.5 text-xs",md:"px-2.5 py-1 text-sm"}[a]} ${{light:{primary:"bg-[oklch(var(--theme-primary)/0.1)] text-[oklch(var(--theme-primary))]",success:"bg-[oklch(var(--theme-success)/0.1)] text-[oklch(var(--theme-success))]",error:"bg-[oklch(var(--theme-error)/0.1)] text-[oklch(var(--theme-error))]",warning:"bg-[oklch(var(--theme-warning)/0.1)] text-[oklch(var(--theme-warning))]",info:"bg-[oklch(var(--theme-info)/0.1)] text-[oklch(var(--theme-info))]",light:"bg-[oklch(var(--theme-muted))] text-[oklch(var(--theme-muted-foreground))]",dark:"bg-[oklch(var(--theme-muted-foreground))] text-[oklch(var(--theme-foreground))]"},solid:{primary:"bg-[oklch(var(--theme-primary))] text-white",success:"bg-[oklch(var(--theme-success))] text-white",error:"bg-[oklch(var(--theme-error))] text-white",warning:"bg-[oklch(var(--theme-warning))] text-white",info:"bg-[oklch(var(--theme-info))] text-white",light:"bg-[oklch(var(--theme-muted))] text-[oklch(var(--theme-foreground))]",dark:"bg-[oklch(var(--theme-foreground))] text-white"}}[r][t]}`,id:n,role:s,"aria-label":l,children:[h&&e.jsxRuntimeExports.jsx("span",{className:"inline-flex shrink-0","aria-hidden":"true",children:h}),i,o&&e.jsxRuntimeExports.jsx("span",{className:"inline-flex shrink-0","aria-hidden":"true",children:o})]});