Badge

Exports

@mbsw/ui에서 가져올 수 있는 항목입니다.

Badge

Props

컴포넌트별 주요 속성입니다. 조건부 속성의 조합과 공통 HTML, Radix 속성은 아래 전체 타입에서 확인하세요.

Badge

Badge 속성
PropType필수 여부
shape'round' | 'square'선택
size'md' | 'sm'선택
asChildboolean조건부
childrenReactNode | ReactElement<unknown, string | JSXElementConstructor<any>>필수

Type reference

전체 타입 보기

속성 조합과 상속 속성을 포함한 TypeScript 선언입니다.

import { type HTMLAttributes, type ReactElement, type ReactNode, type RefAttributes } from 'react';

export type BadgeShape = 'round' | 'square';

export type BadgeSize = 'md' | 'sm';

type DataAttributes = {
    [key: `data-${string}`]: boolean | number | string | undefined;
};

type BadgeBaseProps = Omit<HTMLAttributes<HTMLSpanElement>, 'children' | 'color'> & DataAttributes & {
    shape?: BadgeShape;
    size?: BadgeSize;
};

type NativeBadgeProps = BadgeBaseProps & {
    asChild?: false;
    children: ReactNode;
};

type SlottedBadgeProps = BadgeBaseProps & {
    asChild: true;
    children: ReactElement;
};

export type BadgeProps = (NativeBadgeProps & RefAttributes<HTMLSpanElement>) | (SlottedBadgeProps & RefAttributes<HTMLElement>);

type BadgeComponent = {
    (props: BadgeProps): ReactElement | null;
    displayName?: string;
};

export declare const Badge: BadgeComponent;