Skip to content

[feat]: Create <pf-list> element #2936

@zeroedin

Description

@zeroedin

Create <pf-list> element

Reference: List

Notes to developer:

Possible API:

Default (Unordered)

<pf-list>
  <pf-list-item icon="down-arrow" icon-set="patternfly">First Item</pf-list-item>
  <pf-list-item>Second Item</pf-list-item>
  <pf-list-item>Third Item</pf-list-item>
</pf-list>

Ordered

<pf-list ordered>
  <pf-list-item icon="user" icon-set="patternfly">First Item</pf-list-item>
  <pf-list-item>Second Item</pf-list-item>
  <pf-list-item>Third Item</pf-list-item>
</pf-list>

Plain or Ruled

<pf-list variant="plain | horizontal-rule">
  <pf-list-item icon="user" icon-set="patternfly">First Item</pf-list-item>
  <pf-list-item>Second Item</pf-list-item>
  <pf-list-item>Third Item</pf-list-item>
</pf-list>

Horizontal

<pf-list orientation="horizontal">
  <pf-list-item icon="user" icon-set="patternfly">First Item</pf-list-item>
  <pf-list-item>Second Item</pf-list-item>
  <pf-list-item>Third Item</pf-list-item>
</pf-list>

Icon size (using slotted icons)

<pf-list>
  <pf-list-item>
     <pf-icon slot="icon" icon="user" set="patternfly" size="lg"></pf-icon>
     First Item
  </pf-list-item>
  <pf-list-item>Second Item</pf-list-item>
  <pf-list-item>Third Item</pf-list-item>
</pf-list>

Metadata

Metadata

Assignees

No one assigned

    Labels

    1:1Aligning components with PatternFly v4good 1st issueGood for newcomers to the project; requires at least an introductory knowledge of the languagepriority: lowSeverity level: 3

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions