{
  "tag": "ed-side-menu-item",
  "kind": "component",
  "summary": "A hierarchical navigation item for use inside [ed-side-menu](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/side-menu).\nRenders as a link (WAI-ARIA Disclosure Navigation), with a focusable disclosure button for expandable parents.",
  "description": "Items carry a `value` — defaulting to `href` — matched by the parent menu's `current`. An href-less row\nwith a `value` (including a pinned parent) becomes a focusable `role=\"button\"` row. An identity-less leaf\n(no children, not `pinned`) instead becomes a plain \"fake button\": a focusable `role=\"button\"` row whose\nEnter/Space fire a `click` that bubbles like a native button — e.g. a search trigger placed inside a rail.\nA label too long for two lines is clamped with an ellipsis and revealed in full by a tooltip on hover or focus.",
  "status": "experimental",
  "since": "1.0",
  "docs": "https://test-apps.eurodata.de/a/eurodata-ui/docs/components/side-menu-item/",
  "usage": "https://test-apps.eurodata.de/a/eurodata-ui/docs/components/side-menu-item/usage/",
  "playwright": "getByTestId('…')",
  "dependencies": [
    "ed-icon",
    "ed-tooltip"
  ],
  "use": [
    "One page link in the product navigation, which stays highlighted so users always know which area they are in",
    "A parent entry that expands to reveal its sub-pages, such as \"Reports\" opening to monthly and annual reports",
    "A non-navigating entry in the sidebar that triggers an action on click, such as opening a search dialog",
    "A navigation entry with a short description or end badge, such as the count of open tasks"
  ],
  "notFor": [
    {
      "when": "Switching between sections of one long page",
      "instead": "a [Scrollspy Item](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/scrollspy-item)"
    },
    {
      "when": "A node in a browsable hierarchy of records the user selects",
      "instead": "a [Tree Item](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/tree-item)"
    }
  ],
  "rules": [],
  "api": {
    "attributes": [
      {
        "name": "pinned",
        "property": "pinned",
        "type": "boolean",
        "default": "false",
        "description": "Marks the item as a permanently expanded parent. The disclosure button is not rendered, attempts to collapse are\nignored, and no `aria-expanded` is exposed (no disclosure semantics). Use for top-level navigation groups whose\nchildren should always be visible. Implies `expanded = true` on connect."
      },
      {
        "name": "href",
        "property": "href",
        "type": "string",
        "description": "The URL the item navigates to. When set, the item renders as an `<a>` element with proper link semantics."
      },
      {
        "name": "target",
        "property": "target",
        "type": "string",
        "description": "Tells the browser where to open the link. Only used when `href` is set.\n\nTakes the `_blank`, `_self`, `_parent` and `_top` keywords, or the name of a window: a link\nwhose target names an already open window navigates that window instead of opening another one.\nNote that `rel=\"noopener\"` suppresses the lookup, so a named target then opens a new window\nevery time.\n\nThe implicit opener isolation browsers apply covers `_blank` only. A named target leaves\n`window.opener` set on the opened page, so a link pointing at untrusted content needs\n`rel=\"noopener\"` spelled out."
      },
      {
        "name": "rel",
        "property": "rel",
        "type": "string | undefined",
        "description": "The `rel` attribute to use on the link. Only used when `href` is set.\n\nUnset by default, like a plain `<a>`. Browsers already imply `noopener` for `target=\"_blank\"`,\nso the remaining effect of a `rel` value is suppressing the `Referer` header — a decision about\nthe link's destination that belongs to the application, not to the component."
      },
      {
        "name": "value",
        "property": "value",
        "type": "string",
        "description": "The item's identity for selection. Matched exactly against the parent side-menu's `current`\nand reported in `ed-navigate`. Falls back to `href` when omitted (like a native option's\nvalue falls back to its text), so plain link items don't repeat their URL."
      },
      {
        "name": "active",
        "property": "active",
        "type": "boolean",
        "default": "false",
        "description": "True when this item's effective value matches the parent side-menu's `current`. Set by the parent; do not write directly."
      },
      {
        "name": "slim",
        "property": "slim",
        "type": "boolean",
        "default": "false",
        "description": "Set by the parent `<ed-side-menu>` when its variant is `slim`. Do not\nwrite directly — assign `variant` on the parent instead. When set,\nthe item renders as an 80px-column rail item (icon over centered label,\nno description, no end slot, no chevron)."
      },
      {
        "name": "density",
        "property": "density",
        "type": "'compact' | 'default' | 'spacious'",
        "default": "'default'",
        "description": "Set by the parent `<ed-side-menu>` from its own `density`. Do not write directly — assign\n`density` on the parent instead. Drives the item's row height and icon size."
      },
      {
        "name": "expanded",
        "property": "expanded",
        "type": "boolean",
        "default": "false",
        "description": "Expands the item."
      },
      {
        "name": "disabled",
        "property": "disabled",
        "type": "boolean",
        "default": "false",
        "description": "Disables the item."
      },
      {
        "name": "dir",
        "property": "dir",
        "type": "string"
      },
      {
        "name": "lang",
        "property": "lang",
        "type": "string"
      }
    ],
    "properties": [
      {
        "name": "effectiveValue",
        "type": "string",
        "description": "The identity used for `current` matching and `ed-navigate`: `value`, falling back to `href`."
      }
    ],
    "methods": [
      {
        "name": "isExpandableItem",
        "static": true,
        "parameters": [
          {
            "name": "node",
            "type": "Node"
          }
        ],
        "returns": "node is EdExpandableItem",
        "description": "Determines whether a node is an expandable item — replaces brittle `role=`/tag sniffing."
      },
      {
        "name": "getChildrenItems",
        "parameters": [
          {
            "name": "{ includeDisabled = true }",
            "type": "{ includeDisabled?: boolean }"
          }
        ],
        "returns": "EdExpandableItem[]",
        "description": "Gets all the nested expandable items in this node."
      }
    ],
    "events": [
      {
        "name": "ed-navigate",
        "react": "onEdNavigate",
        "type": "{ item: EdSideMenuItem, value: string, href?: string }",
        "description": "Emitted when an item with an identity (value or href) is activated. Cancelable; calling `preventDefault()` cancels the selection commit and any native navigation — e.g. for SPA routing. Detail: `{ item, value, href? }`. Cancelable; calling `preventDefault()` cancels the navigation."
      },
      {
        "name": "ed-expand",
        "react": "onEdExpand",
        "description": "Emitted before the item expands. Cancelable; calling `preventDefault()` keeps it collapsed."
      },
      {
        "name": "ed-after-expand",
        "react": "onEdAfterExpand",
        "description": "Emitted after the item expands and all animations are complete."
      },
      {
        "name": "ed-collapse",
        "react": "onEdCollapse",
        "description": "Emitted before the item collapses. Cancelable; calling `preventDefault()` keeps it expanded."
      },
      {
        "name": "ed-after-collapse",
        "react": "onEdAfterCollapse",
        "description": "Emitted after the item collapses and all animations are complete."
      }
    ],
    "slots": [
      {
        "name": "",
        "description": "The default slot for the item label."
      },
      {
        "name": "start",
        "description": "Content placed before the label, e.g. an icon."
      },
      {
        "name": "end",
        "description": "Content placed after the label, e.g. a badge or an overflow menu. Treated as an action area: clicks and keystrokes inside it never activate the row, so a control placed here neither navigates nor toggles the item."
      },
      {
        "name": "description",
        "description": "Secondary text rendered below the label."
      }
    ],
    "cssProperties": [],
    "parts": [
      {
        "name": "base",
        "description": "The component's base wrapper."
      },
      {
        "name": "item-wrapper",
        "description": "The wrapper around indentation, row, and the disclosure button."
      },
      {
        "name": "row",
        "description": "The flex row holding the clickable link and the disclosure button."
      },
      {
        "name": "item",
        "description": "The clickable row. Renders as `<a>` when `href` is set. Otherwise a `<div>`: a focusable `role=\"button\"` disclosure control for an href-less parent, or — for an href-less row with a `value` (including a pinned parent, which carries no `aria-expanded`) or an identity-less leaf (no children, not `pinned`) — a focusable `role=\"button\"` row that fires `click` on Enter/Space. A disabled href-less leaf stays a plain, non-focusable `<div>`; a disabled href-less non-pinned parent keeps its disclosure row (`role=\"button\"`, `tabindex=\"0\"`) focusable but inoperative — both handlers bail on `disabled`."
      },
      {
        "name": "indentation",
        "description": "The item's indentation container."
      },
      {
        "name": "expand-button",
        "description": "The focusable disclosure button (sibling of the link — toggling it does not navigate)."
      },
      {
        "name": "start",
        "description": "Container for the start slot."
      },
      {
        "name": "text",
        "description": "Wrapper for label and description."
      },
      {
        "name": "label",
        "description": "The item's label."
      },
      {
        "name": "description",
        "description": "Container for the description slot."
      },
      {
        "name": "end",
        "description": "Container for the end slot."
      },
      {
        "name": "children",
        "description": "Container for nested child items."
      },
      {
        "name": "tooltip",
        "description": "The `<ed-tooltip>` that reveals the full label. Only rendered once a hover or focus finds the label clamped, so it is absent on items whose label fits."
      }
    ],
    "states": [
      {
        "name": "active",
        "description": "Applied when this item's effective value matches the parent side-menu's `current`."
      },
      {
        "name": "expanded",
        "description": "Applied when the item is expanded."
      },
      {
        "name": "disabled",
        "description": "Applied when the item is disabled."
      }
    ]
  },
  "import": "import '@eurodata/eurodata-ui/dist/components/side-menu-item/side-menu-item.js';",
  "react": {
    "component": "EdSideMenuItem",
    "import": "import EdSideMenuItem from '@eurodata/eurodata-ui/dist/react/side-menu-item/index.js';"
  }
}