Skip to content

Files

Latest commit

RaduADumitruRaduADumitru
[SITES-18842][SITES-18843] Improve list (#2664)
Feb 6, 2024
fb5c399 · Feb 6, 2024

History

History

list

README.md

List (v2)

List component written in HTL that renders a configurable collection of items or content.

Features

  • Multiple sources:
    • List page children
    • List tagged items
    • List query result
    • List static items
  • Ordering and limit
  • Styles

Use Object

The List component uses the com.adobe.cq.wcm.core.components.models.List Sling model as its Use-object.

Component Policy Configuration Properties

The following configuration properties are used:

  1. ./dateFormat - defines the formatting string for when the list items are set to render their last modification date;
  2. ./disableChildren - allows to disable the ability to build a list from the child pages of a root page
  3. ./disableStatic - allows to disable the ability to build a list with static elements
  4. ./disableSearch - allows to disable the ability to build a list using search results
  5. ./disableTags - allows to disable the ability to build a list using the tagged child pages of a root page

Edit Dialog Properties

The following properties are written to JCR for this List component and are expected to be available as Resource properties:

  1. ./listFrom - defines the source of this List; possible values:
  • children - the list is built from the child pages of a root page
  • static - the list is built from a statically defined collection of pages
  • search - the list is built from the search results of a query
  • tags - the list is built from the tagged children pages of a root page
  1. ./parentPage - defines the root page when the ./listFrom property is set to children
  2. ./childDepth - defines the max depth for children pages, when the ./listFrom property is set to children
  3. ./pages - defines the pages to be rendered, when the ./listFrom property is set to static
  4. ./query - defines the search query, when the ./listFrom property is set to search
  5. ./searchIn - defines where to start the search, when the ./listFrom property is set to search
  6. ./tagsSearchRoot - defines the root path of the tag search, when the ./listFrom property is set to tags
  7. ./tags - defines the tags list to search for, when the ./listFrom property is set to tags
  8. ./tagsMatch - defines if the results of the tag search have to match all tags or just some of them, when the ./listFrom property is set to tags; possible values: any and all
  9. ./orderBy - defines what criterion is used for ordering the list items: the item's title or the last modification date of the item; possible values: title, modified
  10. ./sortOrder - defines the sorting order; possible values: asc, desc
  11. ./maxItems - defines the maximum number of items rendered by the list
  12. ./linkItems - if set to true the list will link all items to the corresponding pages
  13. ./showDescription - if set to true each item's description will be rendered
  14. ./showModificationDate - if set to true each item's last modification date will be rendered
  15. ./id - defines the component HTML ID attribute.

Client Libraries

The component provides a core.wcm.components.list.v2.editor editor client library category that includes JavaScript handling for dialog interaction. It is already included by its edit dialog.

BEM Description

BLOCK cmp-list
    ELEMENT cmp-list__item
    ELEMENT cmp-list__item-link
    ELEMENT cmp-list__item-title
    ELEMENT cmp-list__item-date

Information