UNPKG

@lobehub/ui

Version:

Lobe UI is an open-source UI component library for building AIGC web apps

1 lines 3.32 kB
{"version":3,"file":"Tag.mjs","names":["Tag: FC<TagProps>","AntTag","Tag"],"sources":["../../src/Tag/Tag.tsx"],"sourcesContent":["'use client';\n\nimport { Tag as AntTag } from 'antd';\nimport { cssVar, cx } from 'antd-style';\nimport { type FC, useMemo } from 'react';\n\nimport { colorsPreset, colorsPresetSystem, presetColors, presetSystemColors } from '@/Tag/utils';\n\nimport { variants } from './styles';\nimport type { TagProps } from './type';\n\nconst Tag: FC<TagProps> = ({\n className,\n ref,\n size = 'middle',\n color,\n variant = 'filled',\n children,\n onClick,\n style,\n ...rest\n}) => {\n const colors = useMemo(() => {\n let textColor = cssVar.colorTextSecondary;\n let backgroundColor;\n let borderColor;\n const isBorderless = variant === 'borderless';\n const isFilled = variant === 'filled';\n const isPresetColor = color && presetColors.includes(color);\n const isPresetSystemColors = color && presetSystemColors.has(color);\n const isHexColor = color && color.startsWith('#');\n\n if (isPresetColor) {\n textColor = colorsPreset(color);\n backgroundColor = isBorderless ? 'transparent' : colorsPreset(color, 'fillTertiary');\n borderColor = colorsPreset(color, isFilled ? 'fillQuaternary' : 'fillTertiary');\n }\n if (isPresetSystemColors) {\n textColor = colorsPresetSystem(color);\n backgroundColor = isBorderless ? 'transparent' : colorsPresetSystem(color, 'fillTertiary');\n borderColor = colorsPresetSystem(color, isFilled ? 'fillQuaternary' : 'fillTertiary');\n }\n if (isHexColor) {\n textColor = cssVar.colorBgLayout;\n backgroundColor = isBorderless ? 'transparent' : color;\n }\n\n return {\n backgroundColor,\n borderColor,\n textColor,\n };\n }, [color, variant]);\n\n return (\n <AntTag\n className={cx(variants({ size, variant: variant as any }), className)}\n color={color}\n onClick={onClick}\n ref={ref}\n style={{\n background: colors?.backgroundColor,\n borderColor: colors?.borderColor,\n color: colors?.textColor,\n cursor: onClick ? 'pointer' : undefined,\n ...style,\n }}\n variant={variant === 'borderless' ? 'outlined' : variant}\n {...rest}\n >\n {children}\n </AntTag>\n );\n};\n\nTag.displayName = 'Tag';\n\nexport default Tag;\n"],"mappings":";;;;;;;;;;AAWA,MAAMA,SAAqB,EACzB,WACA,KACA,OAAO,UACP,OACA,UAAU,UACV,UACA,SACA,OACA,GAAG,WACC;CACJ,MAAM,SAAS,cAAc;EAC3B,IAAI,YAAY,OAAO;EACvB,IAAI;EACJ,IAAI;EACJ,MAAM,eAAe,YAAY;EACjC,MAAM,WAAW,YAAY;EAC7B,MAAM,gBAAgB,SAAS,aAAa,SAAS,MAAM;EAC3D,MAAM,uBAAuB,SAAS,mBAAmB,IAAI,MAAM;EACnE,MAAM,aAAa,SAAS,MAAM,WAAW,IAAI;AAEjD,MAAI,eAAe;AACjB,eAAY,aAAa,MAAM;AAC/B,qBAAkB,eAAe,gBAAgB,aAAa,OAAO,eAAe;AACpF,iBAAc,aAAa,OAAO,WAAW,mBAAmB,eAAe;;AAEjF,MAAI,sBAAsB;AACxB,eAAY,mBAAmB,MAAM;AACrC,qBAAkB,eAAe,gBAAgB,mBAAmB,OAAO,eAAe;AAC1F,iBAAc,mBAAmB,OAAO,WAAW,mBAAmB,eAAe;;AAEvF,MAAI,YAAY;AACd,eAAY,OAAO;AACnB,qBAAkB,eAAe,gBAAgB;;AAGnD,SAAO;GACL;GACA;GACA;GACD;IACA,CAAC,OAAO,QAAQ,CAAC;AAEpB,QACE,oBAACC;EACC,WAAW,GAAG,SAAS;GAAE;GAAe;GAAgB,CAAC,EAAE,UAAU;EAC9D;EACE;EACJ;EACL,OAAO;GACL,YAAY,QAAQ;GACpB,aAAa,QAAQ;GACrB,OAAO,QAAQ;GACf,QAAQ,UAAU,YAAY;GAC9B,GAAG;GACJ;EACD,SAAS,YAAY,eAAe,aAAa;EACjD,GAAI;EAEH;GACM;;AAIb,MAAI,cAAc;AAElB,kBAAeC"}