@infinityfx/fluid/dist/components/display/badge.js

React UI library, using zero-runtime CSS-in-JS.

import{jsxs as r,jsx as o}from"react/jsx-runtime";import{combineClasses as e,classes as l}from"../../core/utils.js";import{createStyles as s}from"../../core/style.js";import{Icon as a}from"../../core/icons.js";const c=s("badge",{".badge":{fontWeight:700,borderRadius:"var(--f-radius-sml)",padding:".3em .6em",transition:"background-color .15s",display:"flex",alignItems:"center",gap:"var(--f-spacing-xxs)",lineHeight:1.2},".v__default":{backgroundColor:"var(--color, var(--f-clr-primary-300))",color:"var(--f-clr-text-100)"},".v__light":{backgroundColor:"var(--f-clr-fg-100)",color:"var(--color, var(--f-clr-primary-100))"},".v__neutral":{backgroundColor:"var(--f-clr-fg-100)",border:"solid 1px var(--f-clr-fg-200)",color:"var(--f-clr-text-100)"},".s__xsm":{fontSize:".6rem"},".s__sml":{fontSize:"var(--f-font-size-xxs)"},".s__med":{fontSize:"var(--f-font-size-xsm)"},".s__lrg":{fontSize:"var(--f-font-size-sml)"},".badge.round":{borderRadius:"999px"},".close":{display:"flex",alignItems:"center",cursor:"pointer"}});function t({children:s,cc:t={},variant:i="default",round:n=!1,size:f="sml",color:d,onClose:m,...v}){const g=e(c,t);return r("div",{...v,className:l(g.badge,g[`v__${i}`],g[`s__${f}`],n&&g.round,v.className),style:{"--color":d,...v.style},children:[s,m?o("div",{className:g.close,onClick:m,children:o(a,{type:"close"})}):null]})}export{t as default};
//# sourceMappingURL=badge.js.map