carbon-custom-elements/es/components/list/list-item.d.ts.map

A Carbon Design System variant that's as easy to use as native HTML elements, with no framework tax, no framework silo.

{"version":3,"sources":["components/list/list-item.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAiC,UAAU,EAAE,MAAM,aAAa,CAAC;AAMxE;;;;GAIG;AACH,cACM,UAAW,SAAQ,UAAU;IACjC;;OAEG;IACH,OAAO,CAAC,eAAe,CAAS;IAEhC;;;OAGG;IACH,OAAO,CAAC,uBAAuB;IAK/B;;;OAGG;IAEH,MAAM,UAAS;IAEf,iBAAiB;IASjB,MAAM;IAUN;;OAEG;IACH,MAAM,KAAK,kBAAkB,WAE5B;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,UAAU,CAAC","file":"list-item.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2020\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, customElement, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport styles from './list.scss';\n\nconst { prefix } = settings;\n\n/**\n * List item.\n * @element bx-list-item\n * @slot nested - The nested child list.\n */\n@customElement(`${prefix}-list-item`)\nclass BXListItem extends LitElement {\n  /**\n   * `true` if there is slotted nested child list.\n   */\n  private _hasNestedChild = false;\n\n  /**\n   * Handles `slotchange` event for the `<slot>` for the nested child list.\n   * @param event The event.\n   */\n  private _handleSlotChangeNested({ target }: Event) {\n    this._hasNestedChild = (target as HTMLSlotElement).assignedNodes().length > 0;\n    this.requestUpdate();\n  }\n\n  /**\n   * `true` if this list item is a child of a nested list.\n   * `<bx-ordered-list>` or `<bx-unordered-list>` automatically sets this property.\n   */\n  @property({ type: Boolean, reflect: true })\n  nested = false;\n\n  connectedCallback() {\n    // Uses attribute for lookup from child\n    this.toggleAttribute('nested', Boolean(this.closest((this.constructor as typeof BXListItem).selectorNestedList)));\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'listitem');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    const { _hasNestedChild: hasNestedChild, _handleSlotChangeNested: handleSlotChangeNested } = this;\n    return html`\n      <slot></slot>\n      <div ?hidden=\"${!hasNestedChild}\" class=\"${prefix}-ce--list__item__nested-child\">\n        <slot name=\"nested\" @slotchange=\"${handleSlotChangeNested}\"></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * A selector that will return nested list.\n   */\n  static get selectorNestedList() {\n    return `${prefix}-ordered-list[slot=\"nested\"],${prefix}-unordered-list[slot=\"nested\"]`;\n  }\n\n  static styles = styles;\n}\n\nexport default BXListItem;\n"]}