전체 카탈로그
Table & ListMetadataList7 props

Metadata List

MetadataList displays key-value pairs for object attributes like quality, condition, and status, in a structured layout. Use it for detail panels, settings summaries, and record...

공식 문서 열기
live previewTable & List

Preview

Import

import {MetadataList} from '@astryxdesign/core/MetadataList';

Astryx 문서 권장 방식대로 root barrel이 아니라 컴포넌트 subpath에서 가져옵니다.

When to use

MetadataList displays key-value pairs for object attributes like quality, condition, and status, in a structured layout. Use it for detail panels, settings summaries, and record...

metadatadescriptiondefinitionkeyvaluepropertiesdetailsattributessummary

Important props

columnsmulti | single | numberoptional
label{ position?: start | top, width?: number | string }optional
orientationvertical | horizontaloptional

Theming targets

astryx-metadata-listastryx-metadata-list-item

Best practices

  • DoChoose label position based on content: "start" for short values, "top" for long or complex values.
  • DoCollapse long lists with `maxNumOfItems` to keep the page scannable.
  • Do notUse for extensive form input; use a form layout instead.
  • Do notUse for data that doesn't have a clear key-value structure.