{
  "tag": "ed-list-group",
  "kind": "component",
  "summary": "A labelled group of entries inside an `<ed-list>`, whose head stays in view while the group scrolls.",
  "status": "experimental",
  "level": "atom",
  "since": "1.0",
  "docs": "https://test-apps.eurodata.de/a/eurodata-ui/docs/components/list-group/",
  "usage": "https://test-apps.eurodata.de/a/eurodata-ui/docs/components/list-group/usage/",
  "playwright": "getByTestId('…')",
  "dependencies": [
    "ed-icon"
  ],
  "use": [
    "Entries grouped under a heading such as a month, a client or a status, whose heading stays visible while the user scrolls",
    "A long list the user can fold up by group, such as tasks per department, to reach the group they need",
    "Sorting a mixed list into labeled sections, such as open and completed items, without separate lists"
  ],
  "notFor": [
    {
      "when": "Items that are not read as a list, such as a navigation menu",
      "instead": "a [Side Menu](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/side-menu)"
    },
    {
      "when": "A group heading outside a list, for content in general",
      "instead": "a [Details](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/details) for foldable sections"
    }
  ],
  "rules": [],
  "api": {
    "attributes": [
      {
        "name": "label",
        "property": "label",
        "type": "string",
        "default": "''",
        "description": "The group's name. For markup, use the `label` slot instead."
      },
      {
        "name": "collapsible",
        "property": "collapsible",
        "type": "boolean",
        "default": "false",
        "description": "Turns the head into a button that expands and collapses the group."
      },
      {
        "name": "expanded",
        "property": "expanded",
        "type": "boolean",
        "default": "false",
        "description": "Whether a collapsible group shows its entries. Ignored without `collapsible`, where the entries always show."
      },
      {
        "name": "dir",
        "property": "dir",
        "type": "string"
      },
      {
        "name": "lang",
        "property": "lang",
        "type": "string"
      }
    ],
    "properties": [],
    "methods": [],
    "events": [
      {
        "name": "ed-expand",
        "react": "onEdExpand",
        "description": "Before a collapsible group expands. Cancelable; calling `preventDefault()` keeps it collapsed."
      },
      {
        "name": "ed-after-expand",
        "react": "onEdAfterExpand",
        "description": "After the group expanded."
      },
      {
        "name": "ed-collapse",
        "react": "onEdCollapse",
        "description": "Before a collapsible group collapses. Cancelable; calling `preventDefault()` keeps it expanded."
      },
      {
        "name": "ed-after-collapse",
        "react": "onEdAfterCollapse",
        "description": "After the group collapsed."
      }
    ],
    "slots": [
      {
        "name": "",
        "description": "`<ed-list-item>` elements."
      },
      {
        "name": "label",
        "description": "The group's name. Alternatively, use the `label` attribute."
      }
    ],
    "cssProperties": [],
    "parts": [
      {
        "name": "header",
        "description": "The head."
      },
      {
        "name": "toggle",
        "description": "The button the head becomes when the group is collapsible."
      },
      {
        "name": "toggle-icon",
        "description": "The chevron in the toggle."
      },
      {
        "name": "label",
        "description": "The wrapper of the name."
      },
      {
        "name": "count",
        "description": "The number of entries."
      },
      {
        "name": "items",
        "description": "The element carrying the nested list role."
      }
    ],
    "states": []
  },
  "import": "import '@eurodata/eurodata-ui/dist/components/list-group/list-group.js';",
  "react": {
    "component": "EdListGroup",
    "import": "import EdListGroup from '@eurodata/eurodata-ui/dist/react/list-group/index.js';"
  }
}