Data List

A component for displaying data in a structured list format with label-value pairs. Provides a consistent way to present detailed information in a readable and organized manner.

Consistent layout for label-value pairs

Architecture

so-data-list
Slot: default
so-data-list-item
Slot: default
so-data-list-label
Slot: default
so-data-list-value
Slot: default

Reference

  • Data List

    The root container that manages the layout and spacing of data list items. Coordinates the alignment between labels and values for consistent presentation.

    • Attributes

      • label-min-width
        string
        /
        default: -

        Sets the minimum width for all labels within the data list. Accepts any valid CSS width value to ensure consistent label alignment.

  • Item

    The container for an individual label-value pair within the data list. Manages the horizontal layout and spacing between the label and value components.

  • Label

    The container for the label text that describes the associated value. Maintains consistent width and alignment within the data list structure.

  • Value

    The container for the value content associated with a label. Maintains proper alignment with its corresponding label.

made for toddle