@snowball-tech/fractal/dist/src/components/Tag/Tag.js

Fractal's (Snowball's design system) React component library based on RadixUI and TailwindCSS

import{LIGHT_BG_COLORS_CLASSNAMES as e,PREFIX as t}from"../../constants.js";import{cj as n,cn as r}from"../../styles/helpers.js";import i from"../Typography/Typography.js";import{onlyText as a}from"../../utils.js";import{DEFAULT_COLOR as o,sizeToTypographyVariant as s}from"./Tag.constants.js";import c from"lodash/fp/isEmpty.js";import l from"lodash/fp/isString.js";import u from"lodash/fp/omit.js";import{jsx as d,jsxs as f}from"react/jsx-runtime";const p=({children:p,color:m=o,disabled:h=!1,fullWidth:g=!1,icon:_,iconPosition:v=`left`,label:y,size:b=`s`,...x})=>{let S=!!p;!S&&!y&&console.warn("You must provide a `label` or `children` to the `DropdownItem` component");let C={m:`h-[20px] w-[20px] [&>svg]:h-[20px] [&>svg]:w-[20px]`,s:`h-2 w-2 [&>svg]:h-2 [&>svg]:w-2`},w=!!_,T=w&&d(`div`,{className:n(`fractal-tag__icon`,`fractal-tag__icon--${v}`,`flex shrink-0 items-center`,C[b]),children:_}),E=l(y)?y:c(y)?a(p):a(y);return f(i,{"aria-label":E,className:r(`${t}-tag`,`${t}-tag--${m}`,`${t}-tag--${b}`,`inline-flex w-fit items-center justify-center gap-half rounded-full border-1`,{m:`px-2 py-1 leading-[20px] max-h-[38px]`,s:`px-1 py-half max-h-[28px] leading-[18px]`}[b],m===`white`?`border-grey-70`:`border-transparent`,g?`${t}-tag--full-width w-full`:``,h?`${t}-tag--disabled cursor-not-allowed bg-disabled-light text-disabled`:`${e[m]} cursor-default`,x.className),element:`div`,title:E,variant:s[b],...u([`className`],x),children:[w&&v===`left`&&T,S?p:y,w&&v===`right`&&T]})};p.displayName=`Tag`;export{p as default};
//# sourceMappingURL=Tag.js.map