UNPKG

@lanaco/lnc-react-ui

Version:

React component library

18 lines (16 loc) 1.6 kB
"use strict";const h=require("react/jsx-runtime"),p=require("react"),r=require("./index-BPVoEhTF.cjs"),f=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),s=require("./utils-NZLCh-J5.cjs"),z=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),t=e=>e=="large"?"2rem":e=="medium"?"1.75rem":"1.5rem",R=f.newStyled.div` ${e=>s.getComponentTypographyCss(e.theme,"Badge",e.size,"enabled")}; background-color: ${e=>s.getColorRgbaValue(e.theme,"Badge",e.color,"enabled","background","backgroundOpacity")}; color: ${e=>s.getColorRgbaValue(e.theme,"Badge",e.color,"enabled","text")}; border-radius: ${e=>s.getBorderRadiusValueWithUnits(e.theme,e.borderRadius)}; display: inline-flex; min-width: ${e=>t(e.size)}; min-height: ${e=>t(e.size)}; max-height: ${e=>t(e.size)}; justify-content: center; align-items: center; padding: 0.313rem; & i { font-size: ${e=>e.size=="small"?"0.75rem":e.size=="medium"?"0.875rem":"1rem"}; } `,o=p.forwardRef((e,n)=>{const{borderRadius:i="curved",onClick:a=()=>{},className:d="",style:l={},color:c="primary",size:m="small",children:u,...g}=e,y=z.useTheme(),b={borderRadius:i,theme:y,size:m,color:c,className:"lnc-ui-badge "+d,style:l};return h.jsx(R,{ref:n,...b,onClick:a,...g,children:u})});o.propTypes={onClick:r.PropTypes.func,borderRadius:r.PropTypes.oneOf(["slight","regular","edged","curved","none"]),className:r.PropTypes.string,style:r.PropTypes.object,color:r.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral","gray"]),size:r.PropTypes.oneOf(["small","medium","large"])};module.exports=o;