0.1.30

Skeleton.Chip

Chip의 로딩 자리표시로 Skeleton.Chip.Root와 Skeleton.Chip.Group을 추가합니다. Skeleton.Chip.Root는 실제 Chip.Root처럼 size(sm / md / lg)를 받아 pill 형태를 그리며, width는 콘텐츠 기반이라 $css로 지정합니다. Skeleton.Chip.Group은 Chip.Group과 같은 레이아웃으로 자식에 size와 animation을 전파해, 필터칩 행에서 항목마다 반복 지정하지 않아도 됩니다.

<Skeleton.Chip.Group size="md">
  <Skeleton.Chip.Root $css={{ width: '3.5rem' }} />
  <Skeleton.Chip.Root $css={{ width: '5rem' }} />
  <Skeleton.Chip.Root $css={{ width: '4rem' }} />
</Skeleton.Chip.Group>

프리미티브로 커버되는 컴포넌트 안내

전용 Skeleton이 없는 컴포넌트를 어떤 프리미티브로 자리표시하는지 문서에 정리했습니다. Select와 Popover 트리거는 Skeleton.Dropdown.Trigger로, Menu의 트리거는 Skeleton.Button.Root / Skeleton.IconButton으로, Link는 Skeleton.Typo로 커버됩니다.