{
  "tag": "ed-option",
  "kind": "component",
  "summary": "One selectable entry of an ed-select or ed-combobox, with a value, a label and optional start and end\ncontent.",
  "status": "experimental",
  "level": "atom",
  "since": "1.0",
  "docs": "https://test-apps.eurodata.de/a/eurodata-ui/docs/components/option/",
  "usage": "https://test-apps.eurodata.de/a/eurodata-ui/docs/components/option/usage/",
  "playwright": "getByTestId('…')",
  "dependencies": [
    "ed-checkbox",
    "ed-icon"
  ],
  "use": [
    "An item inside a [Select](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/select) or a [Combobox](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/combobox)"
  ],
  "notFor": [
    {
      "when": "A command in a menu",
      "instead": "a [Dropdown Item](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/dropdown-item)"
    }
  ],
  "rules": [],
  "api": {
    "attributes": [
      {
        "name": "expanded",
        "property": "expanded",
        "type": "boolean",
        "default": "false",
        "description": "Whether nested options are shown. Only meaningful on a branch in tree mode."
      },
      {
        "name": "value",
        "property": "value",
        "type": "string",
        "default": "''",
        "description": "The option's value. When selected, the containing form control will receive this value. The value must be unique\nfrom other options in the same group; spaces are allowed, since a multi-select submits one entry per option\nrather than a single delimited string."
      },
      {
        "name": "disabled",
        "property": "disabled",
        "type": "boolean",
        "default": "false",
        "description": "Draws the option in a disabled state, preventing selection."
      },
      {
        "name": "selected",
        "property": "defaultSelected",
        "type": "boolean",
        "default": "false",
        "description": "Selects an option initially."
      },
      {
        "name": "label",
        "property": "label",
        "type": "string",
        "description": "The option’s plain text label.\nUsually automatically generated, but can be useful to provide manually for cases involving complex content."
      },
      {
        "name": "dir",
        "property": "dir",
        "type": "string"
      },
      {
        "name": "lang",
        "property": "lang",
        "type": "string"
      }
    ],
    "properties": [
      {
        "name": "isLeaf",
        "type": "boolean",
        "description": "Whether this option has nested options. Derived from the children slot, so it only settles after\nthe first render — which is why leaf-vs-branch is expressed through `aria-expanded` (a state)\nrather than a different role."
      },
      {
        "name": "defaultLabel",
        "type": "string",
        "description": "The default label, generated from the element contents. Will be equal to `label` in most cases."
      }
    ],
    "methods": [
      {
        "name": "getChildOptions",
        "returns": "EdOption[]",
        "description": "Returns the nested options one level down."
      }
    ],
    "events": [],
    "slots": [
      {
        "name": "",
        "description": "The option's label."
      },
      {
        "name": "children",
        "description": "Nested options, projected automatically. Only rendered inside a combobox with `tree`; do not assign this slot yourself."
      },
      {
        "name": "start",
        "description": "An element, such as `<ed-icon>`, placed before the label."
      },
      {
        "name": "end",
        "description": "An element, such as `<ed-icon>`, placed after the label."
      }
    ],
    "cssProperties": [],
    "parts": [
      {
        "name": "checkbox",
        "description": "The checkbox that shows the selection in a multi-select control, an `<ed-checkbox>` element."
      },
      {
        "name": "checkbox__base",
        "description": "The checkbox's exported `base` part."
      },
      {
        "name": "checkbox__control",
        "description": "The checkbox's exported `control` part."
      },
      {
        "name": "checkbox__checked-icon",
        "description": "The checkbox's exported `checked-icon` part."
      },
      {
        "name": "checkbox__label",
        "description": "The checkbox's exported `label` part."
      },
      {
        "name": "checked-icon",
        "description": "The checked icon, a `<ed-icon>` element. Single-select controls only."
      },
      {
        "name": "row",
        "description": "The row itself, in tree mode. Carries the padding, background and selection styling."
      },
      {
        "name": "indentation",
        "description": "The spacer that indents the row by its depth, in tree mode."
      },
      {
        "name": "expand-button",
        "description": "The chevron that expands and collapses a branch, in tree mode."
      },
      {
        "name": "children",
        "description": "The container holding nested options, in tree mode."
      },
      {
        "name": "label",
        "description": "The option's label."
      },
      {
        "name": "start",
        "description": "The container that wraps the `start` slot."
      },
      {
        "name": "end",
        "description": "The container that wraps the `end` slot."
      }
    ],
    "states": [
      {
        "name": "current",
        "description": "The user has keyed into the option, but hasn't selected it yet (shows a highlight)"
      },
      {
        "name": "selected",
        "description": "The option is selected and has aria-selected=\"true\""
      },
      {
        "name": "disabled",
        "description": "Applied when the option is disabled"
      },
      {
        "name": "expanded",
        "description": "Applied while a branch's nested options are shown"
      },
      {
        "name": "hover",
        "description": "Like `:hover` but works while dragging in Safari"
      }
    ]
  },
  "import": "import '@eurodata/eurodata-ui/dist/components/option/option.js';",
  "react": {
    "component": "EdOption",
    "import": "import EdOption from '@eurodata/eurodata-ui/dist/react/option/index.js';"
  }
}
