This commit is contained in:
@@ -14,7 +14,7 @@ type ChipProps<T extends ElementType> = {
|
||||
|
||||
const variantClassMap: Record<ChipVariant, string> = {
|
||||
solid: 'chip-solid',
|
||||
outlined: 'chip-outlined'
|
||||
outlined: 'chip-outlined',
|
||||
};
|
||||
|
||||
type TailwindPalette = Record<string, string>;
|
||||
@@ -50,16 +50,21 @@ export function Chip<T extends ElementType = 'span'>({
|
||||
tone,
|
||||
as,
|
||||
className = '',
|
||||
children
|
||||
children,
|
||||
}: Readonly<ChipProps<T>>) {
|
||||
const Component = as ?? 'span' as ElementType;
|
||||
const Component = as ?? ('span' as ElementType);
|
||||
const toneColor = resolveTailwindToneColor(tone);
|
||||
const toneStyle: CSSProperties | undefined = toneColor == null
|
||||
? undefined
|
||||
: variant === 'solid'
|
||||
? { borderColor: toneColor, backgroundColor: toneColor, color: '#ffffff' }
|
||||
: { borderColor: toneColor, color: toneColor };
|
||||
const toneStyle: CSSProperties | undefined =
|
||||
toneColor == null
|
||||
? undefined
|
||||
: variant === 'solid'
|
||||
? { borderColor: toneColor, backgroundColor: toneColor, color: '#ffffff' }
|
||||
: { borderColor: toneColor, color: toneColor };
|
||||
const classes = `chip-root ${variantClassMap[variant]} ${className}`.trim();
|
||||
|
||||
return <Component className={classes} style={toneStyle}>{children}</Component>;
|
||||
return (
|
||||
<Component className={classes} style={toneStyle}>
|
||||
{children}
|
||||
</Component>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user