- 1.5.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.

Maturity: Stable

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>
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.
Attribute Type Documentation Default Value
class :any

Any additional classes to be added.

 Read more Read less
[]

Variations of the component should be expressed via modifier attributes, and it is preferable to use styles on the parent container to arrange components on the page, but if you have to, you can use this attribute to pass additional utility classes to the component.

The value can be a string or a list of strings.
rest :global

Any additional HTML attributes.
Required prop * :slot

A property to be rendered.
Show slot attributes Hide slot attributes
Required label * :string
class :any

Additional classes for the row that holds the term and value.

 
<: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>