Doggo Storybook 0.9.0

Property List

Renders a list of properties as key/value pairs.

Read more Read less

This component is useful for displaying data in a structured format, such as a list of attributes for an entity. Each property is rendered as a <dt> element for the label and a <dd> element for the value.

Usage

Each property is specified using the :prop slot with a label attribute and an inner block.

<.property_list>
  <:prop label={gettext("Name")}>George</:prop>
  <:prop label={gettext("Age")}>42</:prop>
</.property_list>
Default Open in playground
Name
Apollo
Age
5
Breed
Golden Retriever
Favorite Toy
Frisbee
Owner
Katrin Dinkelschrot
Health Conditions and Dietary Requirements
Apollo has a sensitive stomach and requires a special diet, including grain-free food and regular vet check-ups.
<.property_list>
  <:prop label="Name">Apollo</:prop>
  <:prop label="Age">5</:prop>
  <:prop label="Breed">Golden Retriever</:prop>
  <:prop label="Favorite Toy">Frisbee</:prop>
  <:prop label="Owner">Katrin Dinkelschrot</:prop>
  <:prop label="Health Conditions and Dietary Requirements">Apollo has a sensitive stomach and requires a special diet, including grain-free food and regular vet check-ups.</:prop>
</.property_list>