@nysds/nys-dropdownmenu 1.19.2 → 1.19.3

package/dist/nys-dropdownmenu.js

@@ -5,7 +5,7 @@ import { property as d } from "lit/decorators.js";
    * █ █ █  █▄▄▄█  ▀▀▀▄▄  █   █ ▀▀▀▄▄
    * █  ▀█    █    █▄▄▄█  █▄▄▀  █▄▄▄█
    *
-   * Dropdownmenu Component v1.19.2
+   * Dropdownmenu Component v1.19.3
    * Part of the New York State Design System
    * Repository: https://github.com/its-hcd/nysds
    * License: MIT

package/dist/nys-dropdownmenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"nys-dropdownmenu.js","sources":["../src/nys-dropdownmenuitem.ts","../src/nys-dropdownmenu.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-dropdownmenu.scss?inline\";\n\nlet dropdownMenuItemIdCounter = 0;\n\n/**\n * **Slotted component.** Displays an individual dropdown item within `nys-dropdown` with label.\n *\n * The `nys-dropdownitem` is used as customizable item within the dropdown so users don't have to raw code <ul>, <li>, <a href>\n * and have the benefit of default customization.\n *\n * @summary Dropdown item to display label and provide href link.\n * @element nys-dropdownmenuitem\n *\n * @example Basic item\n * ```html\n * <nys-dropdownmenuitem label=\"Edit\" link=\"/edit\"></nys-dropdownmenuitem>\n * ```\n *\n * @example Disabled item\n * ```html\n * <nys-dropdownmenuitem label=\"Delete\" link=\"/delete\" disabled></nys-dropdownmenuitem>\n * ```\n */\nexport class NysDropdownMenuItem extends LitElement {\n  static styles = unsafeCSS(styles);\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  @property({ type: String }) label = \"\";\n  @property({ type: String }) href = \"\";\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  @property({ type: String }) target = \"_self\";\n  @property({ type: String }) prefixIcon = \"\";\n  @property({ type: String }) divider = \"\";\n\n  // Generate a unique ID if one is not provided\n  connectedCallback() {\n    super.connectedCallback();\n    if (!this.id) {\n      this.id = `nys-dropdownmenuitem-${Date.now()}-${dropdownMenuItemIdCounter++}`;\n    }\n  }\n\n  private _handleClick(e: Event) {\n    if (this.disabled) {\n      e.preventDefault();\n      return;\n    }\n\n    this.dispatchEvent(\n      new CustomEvent(\"nys-click\", {\n        bubbles: true,\n        composed: true,\n        detail: {\n          id: this.id,\n          label: this.label,\n          ...(this.href && { href: this.href }),\n        },\n      }),\n    );\n  }\n\n  render() {\n    const isLink = !!this.href;\n\n    return html`<li class=\"nys-dropdownmenuitem\" role=\"presentation\">\n      ${isLink\n        ? html` <a\n            class=${this.disabled ? \"disabled\" : \"\"}\n            href=${this.disabled ? \"\" : this.href}\n            role=\"menuitem\"\n            aria-disabled=\"${this.disabled ? \"true\" : \"false\"}\"\n            aria-label=${this.label}\n            tabindex=${this.disabled ? \"-1\" : \"0\"}\n            @click=\"${this._handleClick}\"\n            target=\"${this.target}\"\n          >\n            ${this.prefixIcon\n              ? html`<nys-icon size=\"16\" name=${this.prefixIcon}></nys-icon>`\n              : \"\"}\n            ${this.label}</a\n          >`\n        : html`\n            <button\n              class=${this.disabled ? \"disabled\" : \"\"}\n              type=\"button\"\n              role=\"menuitem\"\n              aria-disabled=\"${this.disabled ? \"true\" : \"false\"}\"\n              aria-label=${this.label}\n              tabindex=${this.disabled ? \"-1\" : \"0\"}\n              ?disabled=${this.disabled}\n              @click=\"${this._handleClick}\"\n            >\n              ${this.prefixIcon\n                ? html`<nys-icon size=\"16\" name=${this.prefixIcon}></nys-icon>`\n                : \"\"}\n              ${this.label}\n            </button>\n          `}\n    </li>`;\n  }\n}\n\nif (!customElements.get(\"nys-dropdownmenuitem\")) {\n  customElements.define(\"nys-dropdownmenuitem\", NysDropdownMenuItem);\n}\n","import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport \"./nys-dropdownmenuitem\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-dropdownmenu.scss?inline\";\n\nlet dropdownMenuIdCounter = 0;\n\n/**\n * Dropdown menus enable users to select an action from a list of options.\n * They’re commonly used to save space by grouping related actions, or to provide actions in a confined space.\n *\n * @summary Action menu with auto-positioning, keyboard support, and screen reader integration.\n * @element nys-dropdownmenu\n *\n * @example Basic dropdown\n * ```html\n * <button id=\"my-trigger\">Actions</button>\n * <nys-dropdownmenu for=\"my-trigger\">\n *   <nys-dropdownmenuitem label=\"Edit\" link=\"/edit\"></nys-dropdownmenuitem>\n *   <nys-dropdownmenuitem label=\"Delete\" link=\"/delete\"></nys-dropdownmenuitem>\n * </nys-dropdownmenu>\n * ```\n *\n * @example Positioned dropdown\n * ```html\n * <button id=\"settings-btn\">Settings</button>\n * <nys-dropdownmenu for=\"settings-btn\" position=\"top-start\">\n *   <nys-dropdownmenuitem label=\"Profile\" link=\"/profile\"></nys-dropdownmenuitem>\n *   <nys-dropdownmenuitem label=\"Logout\" link=\"/logout\"></nys-dropdownmenuitem>\n * </nys-dropdownmenu>\n * ```\n */\n\ntype Position = \"bottom-start\" | \"bottom-end\" | \"top-start\" | \"top-end\";\n\ninterface PositionCoordinates {\n  top: number;\n  left: number;\n}\n\ninterface SpaceAvailable {\n  top: number;\n  bottom: number;\n  start: number;\n  end: number;\n}\n\nexport class NysDropdownMenu extends LitElement {\n  static styles = unsafeCSS(styles);\n\n  @property({ type: String, reflect: true }) for = \"\";\n  @property({ type: Boolean }) showDropdown = false;\n\n  /**\n   * Accessible label for the menu. Used as `aria-label` on the `<ul role=\"menu\">` element.\n   * @default \"\"\n   */\n  @property({ type: String }) label = \"\";\n\n  /**\n   * Preferred position relative to trigger.\n   * @default \"bottom-end\"\n   */\n  @property({ type: String, reflect: true }) position: Position | null = null;\n\n  private _trigger: HTMLElement | null = null;\n  private _menuElement: HTMLElement | null = null;\n  private _ariaTarget: HTMLElement | null = null;\n  private _lastFocusedIndex: number = 0;\n  private readonly GAP = 4;\n  private _resizeObserver: ResizeObserver | null = null;\n\n  /**\n   * Lifecycle Methods\n   * --------------------------------------------------------------------------\n   */\n\n  constructor() {\n    super();\n  }\n\n  // Generate a unique ID if one is not provided\n  connectedCallback() {\n    super.connectedCallback();\n\n    if (!this.id) {\n      this.id = `nys-dropdownmenu-${Date.now()}-${dropdownMenuIdCounter++}`;\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n  }\n\n  async firstUpdated() {\n    await this.updateComplete;\n    this.applyInverseTransform();\n    this._connectTrigger();\n    this._handleMenuClick();\n  }\n  /**\n   * Functions\n   * --------------------------------------------------------------------------\n   */\n\n  private _findTrigger() {\n    const targetId = this.for;\n    if (!targetId) return null;\n\n    // lightDOM search\n    let htmlElement = document.getElementById(targetId);\n    if (htmlElement) return htmlElement;\n\n    // Search recursively through shadow DOMs (e.g. for nys-label within other component's shadowDOM)\n    const findInShadows = (root: ParentNode): HTMLElement | null => {\n      for (const el of Array.from(root.querySelectorAll(\"*\"))) {\n        const shadowElement = el.shadowRoot;\n        if (shadowElement) {\n          const found = shadowElement.getElementById(targetId);\n          if (found) return found;\n\n          const deeper = findInShadows(shadowElement);\n          if (deeper) return deeper;\n        }\n      }\n      return null;\n    };\n\n    return findInShadows(document);\n  }\n\n  private _connectTrigger() {\n    const trigger = this._findTrigger();\n    if (!trigger) return;\n\n    this._trigger = trigger;\n\n    const ariaTarget =\n      trigger.tagName.toLowerCase() === \"nys-button\"\n        ? (trigger.shadowRoot?.querySelector(\"button\") ?? trigger)\n        : trigger;\n\n    ariaTarget.setAttribute(\"aria-haspopup\", \"menu\");\n    ariaTarget.setAttribute(\"aria-expanded\", \"false\");\n\n    this._ariaTarget = ariaTarget;\n\n    this._trigger.addEventListener(\"click\", this._toggleDropdown);\n    this._trigger.addEventListener(\"keydown\", this._handleTriggerKeydown);\n  }\n\n  private _toggleDropdown = async () => {\n    this.showDropdown = !this.showDropdown;\n\n    this._ariaTarget?.setAttribute(\"aria-expanded\", String(this.showDropdown));\n\n    if (this.showDropdown) {\n      window.addEventListener(\"scroll\", this._handleWindowScroll, true);\n      this._resizeObserver = new ResizeObserver(() => {\n        if (this.showDropdown) {\n          this._positionMenu();\n        }\n      });\n      this._resizeObserver.observe(document.documentElement);\n\n      document.addEventListener(\"click\", this._handleDocumentClick);\n\n      this._menuElement = this.shadowRoot?.querySelector(\n        \".nys-dropdownmenu\",\n      ) as HTMLElement | null;\n      this._menuElement!.addEventListener(\"keydown\", this._handleMenuKeydown);\n\n      await this.updateComplete;\n      this._positionMenu();\n      this._focusOnItem(this._lastFocusedIndex);\n    } else {\n      window.removeEventListener(\"scroll\", this._handleWindowScroll, true);\n      document.removeEventListener(\"click\", this._handleDocumentClick);\n      this._menuElement!.removeEventListener(\n        \"keydown\",\n        this._handleMenuKeydown,\n      );\n\n      this._resizeObserver?.disconnect();\n      this._resizeObserver = null;\n    }\n  };\n\n  private _closeDropdown() {\n    this.showDropdown = false;\n    this._ariaTarget?.setAttribute(\"aria-expanded\", \"false\");\n    this._trigger?.focus();\n  }\n\n  private _getMenuItems(): HTMLElement[] {\n    const slot = this.shadowRoot?.querySelector(\"slot\");\n    const assigned = slot?.assignedElements({ flatten: true }) || [];\n\n    return assigned.filter(\n      (el) => el && !el.hasAttribute(\"disabled\"),\n    ) as HTMLElement[];\n  }\n\n  private _handleDocumentClick = (event: MouseEvent) => {\n    if (!this.showDropdown) return;\n\n    const path = event?.composedPath();\n\n    const clickedInsideMenu = path.includes(this);\n    const clickedTrigger = this._trigger && path.includes(this._trigger);\n\n    if (!clickedInsideMenu && !clickedTrigger) {\n      this._closeDropdown();\n    }\n  };\n\n  private async _focusOnItem(index: number = 0) {\n    await new Promise((resolve) => requestAnimationFrame(resolve));\n    const items = this._getMenuItems();\n    const target = items[Math.min(index, items.length - 1)];\n    if (!target) return;\n\n    target.focus();\n  }\n\n  // In some iframes (like Storybook's) or embedded containers , parent elements may have CSS transforms applied, creating a new coordinate context.\n  // This function removes such transforms to prevent them from affecting tooltip positioning calculations.\n  private applyInverseTransform() {\n    document.querySelectorAll('div[scale=\"1\"]').forEach((el) => {\n      (el as HTMLElement).style.transform = \"none\";\n    });\n  }\n\n  /**\n   * Position Logic\n   * --------------------------------------------------------------------------\n   */\n\n  /**\n   * The controller function for positioning the dropdown menu.\n   * The logic diverts to if user sets position or we auto position the dropdown menu\n   */\n  private _positionMenu() {\n    if (!this._trigger) return;\n\n    this._menuElement = this.shadowRoot?.querySelector(\n      \".nys-dropdownmenu\",\n    ) as HTMLElement | null;\n    if (!this._menuElement) return;\n\n    // Decide position based on user preference OR auto position if no position chosen\n    const finalPosition = this.position\n      ? this._setUserPosition(this.position)\n      : this._autoPosition();\n\n    // Apply the calculated position\n    const coords = this._calculateCoordinates(finalPosition);\n    this._applyPosition(coords);\n  }\n\n  private _setUserPosition(userPosition: Position): Position {\n    const space = this._checkSpaceAvailable();\n    const menuRect = this._menuElement!.getBoundingClientRect();\n\n    const userPositionFits = this._checkPositionFits(\n      userPosition,\n      space,\n      menuRect,\n    );\n\n    if (userPositionFits) {\n      return userPosition;\n    }\n\n    // User position doesn't fit, find best alternative\n    return this._findBestAlternative(userPosition, space, menuRect);\n  }\n\n  /**\n   * Auto Positioning of the dropdown menu relies on the best surrounding space available\n   * to select the desirable position.\n   */\n  private _autoPosition(): Position {\n    const space = this._checkSpaceAvailable();\n    const menuRect = this._menuElement!.getBoundingClientRect();\n\n    const defaultPosition: Position = \"bottom-end\";\n\n    if (this._checkPositionFits(defaultPosition, space, menuRect)) {\n      return defaultPosition;\n    }\n\n    return this._findBestAlternative(defaultPosition, space, menuRect);\n  }\n\n  /**\n   * Checks if the dropdown menu fits inside the viewport on the given side of the trigger.\n   * Overrides user set position for auto-positioning if user's desire space is not available\n   */\n  private _checkSpaceAvailable(): SpaceAvailable {\n    if (!this._trigger) {\n      return { top: 0, bottom: 0, start: 0, end: 0 };\n    }\n\n    const triggerRect = this._trigger.getBoundingClientRect();\n    const viewportWidth = window.innerWidth;\n    const viewportHeight = window.innerHeight;\n\n    return {\n      top: triggerRect.top,\n      bottom: viewportHeight - triggerRect.bottom,\n      start: triggerRect.left,\n      end: viewportWidth - triggerRect.right,\n    };\n  }\n\n  private _checkPositionFits(\n    position: Position,\n    space: SpaceAvailable,\n    menuRect: DOMRect,\n  ): boolean {\n    const menuWidth = menuRect.width;\n    const menuHeight = menuRect.height;\n\n    const [vertical, horizontal] = position.split(\"-\") as [\n      \"top\" | \"bottom\",\n      \"start\" | \"end\",\n    ];\n\n    const verticalFits =\n      vertical === \"bottom\"\n        ? space.bottom >= menuHeight + this.GAP\n        : space.top >= menuHeight + this.GAP;\n\n    const horizontalFits =\n      horizontal === \"start\"\n        ? space.end >= menuWidth\n        : space.start >= menuWidth;\n    return verticalFits && horizontalFits;\n  }\n\n  /**\n   * This position is called for when user's set position didn't fit OR auto positioning when default position doesn't fit\n   * We look for the best alternative positions in order of preference base on the set position (e.g. bottom-start => bottom-end).\n   * @param userPosition\n   * @param space\n   * @param menuRect\n   */\n  private _findBestAlternative(\n    userPosition: Position,\n    space: SpaceAvailable,\n    menuRect: DOMRect,\n  ): Position {\n    const [vertical, horizontal] = userPosition.split(\"-\") as [\n      \"top\" | \"bottom\",\n      \"start\" | \"end\",\n    ];\n\n    const alternatives: Position[] = [\n      `${vertical === \"bottom\" ? \"top\" : \"bottom\"}-${horizontal}`, // Flip vertical\n      `${vertical}-${horizontal === \"start\" ? \"end\" : \"start\"}`, // Flip horizontal\n      `${vertical === \"bottom\" ? \"top\" : \"bottom\"}-${horizontal === \"start\" ? \"end\" : \"start\"}`, // Flip both\n    ];\n\n    for (const altPosition of alternatives) {\n      if (this._checkPositionFits(altPosition, space, menuRect)) {\n        return altPosition;\n      }\n    }\n\n    // Fallback: nothing fits, return position with most space\n    return this._findMostAvailableSpace(space) as Position;\n  }\n\n  private _findMostAvailableSpace(space: SpaceAvailable): Position {\n    const vertical = space.bottom >= space.top ? \"bottom\" : \"top\";\n    const horizontal = space.start >= space.end ? \"start\" : \"end\";\n\n    return `${vertical}-${horizontal}`;\n  }\n\n  /**\n   * A valid ideal position has been chosen.\n   * This function calculates the coordinate of the trigger to properly position the dropdown menu.\n   * @param position\n   * @returns\n   */\n  private _calculateCoordinates(position: Position): PositionCoordinates {\n    if (!this._trigger || !this._menuElement) {\n      return { top: 0, left: 0 };\n    }\n\n    const triggerRect = this._trigger.getBoundingClientRect();\n    const menuRect = this._menuElement.getBoundingClientRect();\n\n    const [vertical, horizontal] = position.split(\"-\") as [\n      \"top\" | \"bottom\",\n      \"start\" | \"end\",\n    ];\n\n    let top = 0;\n    let left = 0;\n\n    // Vertical position\n    if (vertical === \"bottom\") {\n      top = triggerRect.bottom + this.GAP;\n    } else {\n      top = triggerRect.top - menuRect.height - this.GAP;\n    }\n\n    // Horizontal position\n    if (horizontal === \"start\") {\n      left = triggerRect.left;\n    } else {\n      left = triggerRect.right - menuRect.width;\n    }\n\n    return { top, left };\n  }\n\n  private _applyPosition(coords: PositionCoordinates) {\n    if (!this._menuElement) return;\n\n    this._menuElement.style.top = `${coords.top}px`;\n    this._menuElement.style.left = `${coords.left}px`;\n  }\n\n  /**\n   * Event Handlers\n   * --------------------------------------------------------------------------\n   */\n\n  private _handleMenuClick() {\n    this.addEventListener(\"nys-click\", (e: Event) => {\n      const items = this._getMenuItems();\n      const targetCrumb = (e as CustomEvent).detail?.id;\n      const index = items.findIndex((item) => item.id === targetCrumb);\n      if (index !== -1) this._lastFocusedIndex = index;\n      this._closeDropdown();\n    });\n  }\n\n  private _handleTriggerKeydown = (event: KeyboardEvent) => {\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      this._toggleDropdown();\n    }\n\n    if (event.key === \"Escape\" && this.showDropdown) {\n      event.preventDefault();\n      this._closeDropdown();\n    }\n  };\n\n  private _handleMenuKeydown = (event: KeyboardEvent) => {\n    const items = this._getMenuItems();\n    const currentIndex = items.indexOf(document.activeElement as HTMLElement);\n\n    switch (event.key) {\n      case \"Escape\":\n        event.preventDefault();\n        this._closeDropdown();\n        break;\n      case \"ArrowDown\":\n      case \"ArrowRight\":\n        event.preventDefault();\n        const nextIndex =\n          currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n        this._lastFocusedIndex = nextIndex;\n        items[nextIndex].focus();\n        break;\n      case \"ArrowUp\":\n      case \"ArrowLeft\":\n        event.preventDefault();\n        const prevIndex =\n          currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n        this._lastFocusedIndex = prevIndex;\n        items[prevIndex].focus();\n        break;\n      case \"Tab\":\n        if (currentIndex >= items.length - 1 && !event.shiftKey) {\n          this._closeDropdown();\n        }\n        break;\n      default:\n        break;\n    }\n  };\n\n  private _handleWindowScroll = () => {\n    if (this.showDropdown) {\n      this._positionMenu();\n    }\n  };\n\n  render() {\n    return html`<div\n      class=\"nys-dropdownmenu ${this.showDropdown ? \"active\" : \"\"}\"\n      for=${this.for}\n      ?hidden=${!this.showDropdown}\n    >\n      <ul role=\"menu\" aria-label=${this.label || \"Menu\"}>\n        <slot></slot>\n      </ul>\n    </div>`;\n  }\n}\n\nif (!customElements.get(\"nys-dropdownmenu\")) {\n  customElements.define(\"nys-dropdownmenu\", NysDropdownMenu);\n}\n"],"names":["dropdownMenuItemIdCounter","_NysDropdownMenuItem","LitElement","isLink","html","unsafeCSS","styles","NysDropdownMenuItem","__decorateClass","property","dropdownMenuIdCounter","_NysDropdownMenu","event","path","clickedInsideMenu","clickedTrigger","items","currentIndex","nextIndex","prevIndex","targetId","htmlElement","findInShadows","root","el","shadowElement","found","deeper","trigger","ariaTarget","index","resolve","target","finalPosition","coords","userPosition","space","menuRect","defaultPosition","triggerRect","viewportWidth","viewportHeight","position","menuWidth","menuHeight","vertical","horizontal","verticalFits","horizontalFits","alternatives","altPosition","top","left","targetCrumb","item","NysDropdownMenu"],"mappings":"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"}
+{"version":3,"file":"nys-dropdownmenu.js","sources":["../src/nys-dropdownmenuitem.ts","../src/nys-dropdownmenu.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-dropdownmenu.scss?inline\";\n\nlet dropdownMenuItemIdCounter = 0;\n\n/**\n * **Slotted component.** Displays an individual dropdown item within `nys-dropdown` with label.\n *\n * The `nys-dropdownitem` is used as customizable item within the dropdown so users don't have to raw code <ul>, <li>, <a href>\n * and have the benefit of default customization.\n *\n * @summary Dropdown item to display label and provide href link.\n * @element nys-dropdownmenuitem\n */\n\nexport class NysDropdownMenuItem extends LitElement {\n  static styles = unsafeCSS(styles);\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  @property({ type: String }) label = \"\";\n  @property({ type: String }) href = \"\";\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  @property({ type: String }) target = \"_self\";\n  @property({ type: String }) prefixIcon = \"\";\n  @property({ type: String }) divider = \"\";\n\n  // Generate a unique ID if one is not provided\n  connectedCallback() {\n    super.connectedCallback();\n    if (!this.id) {\n      this.id = `nys-dropdownmenuitem-${Date.now()}-${dropdownMenuItemIdCounter++}`;\n    }\n  }\n\n  private _handleClick(e: Event) {\n    if (this.disabled) {\n      e.preventDefault();\n      return;\n    }\n\n    this.dispatchEvent(\n      new CustomEvent(\"nys-click\", {\n        bubbles: true,\n        composed: true,\n        detail: {\n          id: this.id,\n          label: this.label,\n          ...(this.href && { href: this.href }),\n        },\n      }),\n    );\n  }\n\n  render() {\n    const isLink = !!this.href;\n\n    return html`<li class=\"nys-dropdownmenuitem\" role=\"presentation\">\n      ${isLink\n        ? html` <a\n            class=${this.disabled ? \"disabled\" : \"\"}\n            href=${this.disabled ? \"\" : this.href}\n            role=\"menuitem\"\n            aria-disabled=\"${this.disabled ? \"true\" : \"false\"}\"\n            aria-label=${this.label}\n            tabindex=${this.disabled ? \"-1\" : \"0\"}\n            @click=\"${this._handleClick}\"\n            target=\"${this.target}\"\n          >\n            ${this.prefixIcon\n              ? html`<nys-icon size=\"16\" name=${this.prefixIcon}></nys-icon>`\n              : \"\"}\n            ${this.label}</a\n          >`\n        : html`\n            <button\n              class=${this.disabled ? \"disabled\" : \"\"}\n              type=\"button\"\n              role=\"menuitem\"\n              aria-disabled=\"${this.disabled ? \"true\" : \"false\"}\"\n              aria-label=${this.label}\n              tabindex=${this.disabled ? \"-1\" : \"0\"}\n              ?disabled=${this.disabled}\n              @click=\"${this._handleClick}\"\n            >\n              ${this.prefixIcon\n                ? html`<nys-icon size=\"16\" name=${this.prefixIcon}></nys-icon>`\n                : \"\"}\n              ${this.label}\n            </button>\n          `}\n    </li>`;\n  }\n}\n\nif (!customElements.get(\"nys-dropdownmenuitem\")) {\n  customElements.define(\"nys-dropdownmenuitem\", NysDropdownMenuItem);\n}\n","import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport \"./nys-dropdownmenuitem\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-dropdownmenu.scss?inline\";\n\nlet dropdownMenuIdCounter = 0;\n\ntype Position = \"bottom-start\" | \"bottom-end\" | \"top-start\" | \"top-end\";\n\ninterface PositionCoordinates {\n  top: number;\n  left: number;\n}\n\ninterface SpaceAvailable {\n  top: number;\n  bottom: number;\n  start: number;\n  end: number;\n}\n\n/**\n * Dropdown menus enable users to select an action from a list of options.\n * They’re commonly used to save space by grouping related actions, or to provide actions in a confined space.\n *\n * @summary Action menu with auto-positioning, keyboard support, and screen reader integration.\n * @element nys-dropdownmenu\n *\n * @example Basic\n * ```html\n * <nys-button id=\"my-trigger-id\" label=\"Open Menu\"></nys-button>\n * <nys-dropdownmenu id=\"my-dropdownmenu\" for=\"my-trigger-id\">\n *   <nys-dropdownmenuitem label=\"Profile\" href=\"/profile\"></nys-dropdownmenuitem>\n *   <nys-dropdownmenuitem label=\"Repositories & Github Pages\" href=\"/repos\"></nys-dropdownmenuitem>\n *   <nys-dropdownmenuitem label=\"Organizations\" href=\"/organizations\"></nys-dropdownmenuitem>\n *   <nys-dropdownmenuitem label=\"Sign out\" href=\"/logout\"></nys-dropdownmenuitem>\n * </nys-dropdownmenu>\n * </div>\n * ```\n *\n * @render Basic\n * ```html\n * <div style=\"margin: 200px; display: flex; justify-content: center; align-items: center;\">\n *   <nys-button id=\"my-trigger-id\" label=\"Open Menu\"></nys-button>\n *   <nys-dropdownmenu id=\"my-dropdownmenu\" for=\"my-trigger-id\">\n *     <nys-dropdownmenuitem label=\"Profile\" href=\"/profile\"></nys-dropdownmenuitem>\n *     <nys-dropdownmenuitem label=\"Repositories & Github Pages\" href=\"/repos\"></nys-dropdownmenuitem>\n *     <nys-dropdownmenuitem label=\"Organizations\" href=\"/organizations\"></nys-dropdownmenuitem>\n *     <nys-dropdownmenuitem label=\"Sign out\" href=\"/logout\"></nys-dropdownmenuitem>\n *   </nys-dropdownmenu>\n * </div>\n * ```\n */\n\nexport class NysDropdownMenu extends LitElement {\n  static styles = unsafeCSS(styles);\n\n  @property({ type: String, reflect: true }) for = \"\";\n  @property({ type: Boolean }) showDropdown = false;\n\n  /**\n   * Accessible label for the menu. Used as `aria-label` on the `<ul role=\"menu\">` element.\n   * @default \"\"\n   */\n  @property({ type: String }) label = \"\";\n\n  /**\n   * Preferred position relative to trigger.\n   * @default \"bottom-end\"\n   */\n  @property({ type: String, reflect: true }) position: Position | null = null;\n\n  private _trigger: HTMLElement | null = null;\n  private _menuElement: HTMLElement | null = null;\n  private _ariaTarget: HTMLElement | null = null;\n  private _lastFocusedIndex: number = 0;\n  private readonly GAP = 4;\n  private _resizeObserver: ResizeObserver | null = null;\n\n  /**\n   * Lifecycle Methods\n   * --------------------------------------------------------------------------\n   */\n\n  constructor() {\n    super();\n  }\n\n  // Generate a unique ID if one is not provided\n  connectedCallback() {\n    super.connectedCallback();\n\n    if (!this.id) {\n      this.id = `nys-dropdownmenu-${Date.now()}-${dropdownMenuIdCounter++}`;\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n  }\n\n  async firstUpdated() {\n    await this.updateComplete;\n    this.applyInverseTransform();\n    this._connectTrigger();\n    this._handleMenuClick();\n  }\n  /**\n   * Functions\n   * --------------------------------------------------------------------------\n   */\n\n  private _findTrigger() {\n    const targetId = this.for;\n    if (!targetId) return null;\n\n    // lightDOM search\n    let htmlElement = document.getElementById(targetId);\n    if (htmlElement) return htmlElement;\n\n    // Search recursively through shadow DOMs (e.g. for nys-label within other component's shadowDOM)\n    const findInShadows = (root: ParentNode): HTMLElement | null => {\n      for (const el of Array.from(root.querySelectorAll(\"*\"))) {\n        const shadowElement = el.shadowRoot;\n        if (shadowElement) {\n          const found = shadowElement.getElementById(targetId);\n          if (found) return found;\n\n          const deeper = findInShadows(shadowElement);\n          if (deeper) return deeper;\n        }\n      }\n      return null;\n    };\n\n    return findInShadows(document);\n  }\n\n  private _connectTrigger() {\n    const trigger = this._findTrigger();\n    if (!trigger) return;\n\n    this._trigger = trigger;\n\n    const ariaTarget =\n      trigger.tagName.toLowerCase() === \"nys-button\"\n        ? (trigger.shadowRoot?.querySelector(\"button\") ?? trigger)\n        : trigger;\n\n    ariaTarget.setAttribute(\"aria-haspopup\", \"menu\");\n    ariaTarget.setAttribute(\"aria-expanded\", \"false\");\n\n    this._ariaTarget = ariaTarget;\n\n    this._trigger.addEventListener(\"click\", this._toggleDropdown);\n    this._trigger.addEventListener(\"keydown\", this._handleTriggerKeydown);\n  }\n\n  private _toggleDropdown = async () => {\n    this.showDropdown = !this.showDropdown;\n\n    this._ariaTarget?.setAttribute(\"aria-expanded\", String(this.showDropdown));\n\n    if (this.showDropdown) {\n      window.addEventListener(\"scroll\", this._handleWindowScroll, true);\n      this._resizeObserver = new ResizeObserver(() => {\n        if (this.showDropdown) {\n          this._positionMenu();\n        }\n      });\n      this._resizeObserver.observe(document.documentElement);\n\n      document.addEventListener(\"click\", this._handleDocumentClick);\n\n      this._menuElement = this.shadowRoot?.querySelector(\n        \".nys-dropdownmenu\",\n      ) as HTMLElement | null;\n      this._menuElement!.addEventListener(\"keydown\", this._handleMenuKeydown);\n\n      await this.updateComplete;\n      this._positionMenu();\n      this._focusOnItem(this._lastFocusedIndex);\n    } else {\n      window.removeEventListener(\"scroll\", this._handleWindowScroll, true);\n      document.removeEventListener(\"click\", this._handleDocumentClick);\n      this._menuElement!.removeEventListener(\n        \"keydown\",\n        this._handleMenuKeydown,\n      );\n\n      this._resizeObserver?.disconnect();\n      this._resizeObserver = null;\n    }\n  };\n\n  private _closeDropdown() {\n    this.showDropdown = false;\n    this._ariaTarget?.setAttribute(\"aria-expanded\", \"false\");\n    this._trigger?.focus();\n  }\n\n  private _getMenuItems(): HTMLElement[] {\n    const slot = this.shadowRoot?.querySelector(\"slot\");\n    const assigned = slot?.assignedElements({ flatten: true }) || [];\n\n    return assigned.filter(\n      (el) => el && !el.hasAttribute(\"disabled\"),\n    ) as HTMLElement[];\n  }\n\n  private _handleDocumentClick = (event: MouseEvent) => {\n    if (!this.showDropdown) return;\n\n    const path = event?.composedPath();\n\n    const clickedInsideMenu = path.includes(this);\n    const clickedTrigger = this._trigger && path.includes(this._trigger);\n\n    if (!clickedInsideMenu && !clickedTrigger) {\n      this._closeDropdown();\n    }\n  };\n\n  private async _focusOnItem(index: number = 0) {\n    await new Promise((resolve) => requestAnimationFrame(resolve));\n    const items = this._getMenuItems();\n    const target = items[Math.min(index, items.length - 1)];\n    if (!target) return;\n\n    target.focus();\n  }\n\n  // In some iframes (like Storybook's) or embedded containers , parent elements may have CSS transforms applied, creating a new coordinate context.\n  // This function removes such transforms to prevent them from affecting tooltip positioning calculations.\n  private applyInverseTransform() {\n    document.querySelectorAll('div[scale=\"1\"]').forEach((el) => {\n      (el as HTMLElement).style.transform = \"none\";\n    });\n  }\n\n  /**\n   * Position Logic\n   * --------------------------------------------------------------------------\n   */\n\n  /**\n   * The controller function for positioning the dropdown menu.\n   * The logic diverts to if user sets position or we auto position the dropdown menu\n   */\n  private _positionMenu() {\n    if (!this._trigger) return;\n\n    this._menuElement = this.shadowRoot?.querySelector(\n      \".nys-dropdownmenu\",\n    ) as HTMLElement | null;\n    if (!this._menuElement) return;\n\n    // Decide position based on user preference OR auto position if no position chosen\n    const finalPosition = this.position\n      ? this._setUserPosition(this.position)\n      : this._autoPosition();\n\n    // Apply the calculated position\n    const coords = this._calculateCoordinates(finalPosition);\n    this._applyPosition(coords);\n  }\n\n  private _setUserPosition(userPosition: Position): Position {\n    const space = this._checkSpaceAvailable();\n    const menuRect = this._menuElement!.getBoundingClientRect();\n\n    const userPositionFits = this._checkPositionFits(\n      userPosition,\n      space,\n      menuRect,\n    );\n\n    if (userPositionFits) {\n      return userPosition;\n    }\n\n    // User position doesn't fit, find best alternative\n    return this._findBestAlternative(userPosition, space, menuRect);\n  }\n\n  /**\n   * Auto Positioning of the dropdown menu relies on the best surrounding space available\n   * to select the desirable position.\n   */\n  private _autoPosition(): Position {\n    const space = this._checkSpaceAvailable();\n    const menuRect = this._menuElement!.getBoundingClientRect();\n\n    const defaultPosition: Position = \"bottom-end\";\n\n    if (this._checkPositionFits(defaultPosition, space, menuRect)) {\n      return defaultPosition;\n    }\n\n    return this._findBestAlternative(defaultPosition, space, menuRect);\n  }\n\n  /**\n   * Checks if the dropdown menu fits inside the viewport on the given side of the trigger.\n   * Overrides user set position for auto-positioning if user's desire space is not available\n   */\n  private _checkSpaceAvailable(): SpaceAvailable {\n    if (!this._trigger) {\n      return { top: 0, bottom: 0, start: 0, end: 0 };\n    }\n\n    const triggerRect = this._trigger.getBoundingClientRect();\n    const viewportWidth = window.innerWidth;\n    const viewportHeight = window.innerHeight;\n\n    return {\n      top: triggerRect.top,\n      bottom: viewportHeight - triggerRect.bottom,\n      start: triggerRect.left,\n      end: viewportWidth - triggerRect.right,\n    };\n  }\n\n  private _checkPositionFits(\n    position: Position,\n    space: SpaceAvailable,\n    menuRect: DOMRect,\n  ): boolean {\n    const menuWidth = menuRect.width;\n    const menuHeight = menuRect.height;\n\n    const [vertical, horizontal] = position.split(\"-\") as [\n      \"top\" | \"bottom\",\n      \"start\" | \"end\",\n    ];\n\n    const verticalFits =\n      vertical === \"bottom\"\n        ? space.bottom >= menuHeight + this.GAP\n        : space.top >= menuHeight + this.GAP;\n\n    const horizontalFits =\n      horizontal === \"start\"\n        ? space.end >= menuWidth\n        : space.start >= menuWidth;\n    return verticalFits && horizontalFits;\n  }\n\n  /**\n   * This position is called for when user's set position didn't fit OR auto positioning when default position doesn't fit\n   * We look for the best alternative positions in order of preference base on the set position (e.g. bottom-start => bottom-end).\n   * @param userPosition\n   * @param space\n   * @param menuRect\n   */\n  private _findBestAlternative(\n    userPosition: Position,\n    space: SpaceAvailable,\n    menuRect: DOMRect,\n  ): Position {\n    const [vertical, horizontal] = userPosition.split(\"-\") as [\n      \"top\" | \"bottom\",\n      \"start\" | \"end\",\n    ];\n\n    const alternatives: Position[] = [\n      `${vertical === \"bottom\" ? \"top\" : \"bottom\"}-${horizontal}`, // Flip vertical\n      `${vertical}-${horizontal === \"start\" ? \"end\" : \"start\"}`, // Flip horizontal\n      `${vertical === \"bottom\" ? \"top\" : \"bottom\"}-${horizontal === \"start\" ? \"end\" : \"start\"}`, // Flip both\n    ];\n\n    for (const altPosition of alternatives) {\n      if (this._checkPositionFits(altPosition, space, menuRect)) {\n        return altPosition;\n      }\n    }\n\n    // Fallback: nothing fits, return position with most space\n    return this._findMostAvailableSpace(space) as Position;\n  }\n\n  private _findMostAvailableSpace(space: SpaceAvailable): Position {\n    const vertical = space.bottom >= space.top ? \"bottom\" : \"top\";\n    const horizontal = space.start >= space.end ? \"start\" : \"end\";\n\n    return `${vertical}-${horizontal}`;\n  }\n\n  /**\n   * A valid ideal position has been chosen.\n   * This function calculates the coordinate of the trigger to properly position the dropdown menu.\n   * @param position\n   * @returns\n   */\n  private _calculateCoordinates(position: Position): PositionCoordinates {\n    if (!this._trigger || !this._menuElement) {\n      return { top: 0, left: 0 };\n    }\n\n    const triggerRect = this._trigger.getBoundingClientRect();\n    const menuRect = this._menuElement.getBoundingClientRect();\n\n    const [vertical, horizontal] = position.split(\"-\") as [\n      \"top\" | \"bottom\",\n      \"start\" | \"end\",\n    ];\n\n    let top = 0;\n    let left = 0;\n\n    // Vertical position\n    if (vertical === \"bottom\") {\n      top = triggerRect.bottom + this.GAP;\n    } else {\n      top = triggerRect.top - menuRect.height - this.GAP;\n    }\n\n    // Horizontal position\n    if (horizontal === \"start\") {\n      left = triggerRect.left;\n    } else {\n      left = triggerRect.right - menuRect.width;\n    }\n\n    return { top, left };\n  }\n\n  private _applyPosition(coords: PositionCoordinates) {\n    if (!this._menuElement) return;\n\n    this._menuElement.style.top = `${coords.top}px`;\n    this._menuElement.style.left = `${coords.left}px`;\n  }\n\n  /**\n   * Event Handlers\n   * --------------------------------------------------------------------------\n   */\n\n  private _handleMenuClick() {\n    this.addEventListener(\"nys-click\", (e: Event) => {\n      const items = this._getMenuItems();\n      const targetCrumb = (e as CustomEvent).detail?.id;\n      const index = items.findIndex((item) => item.id === targetCrumb);\n      if (index !== -1) this._lastFocusedIndex = index;\n      this._closeDropdown();\n    });\n  }\n\n  private _handleTriggerKeydown = (event: KeyboardEvent) => {\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      this._toggleDropdown();\n    }\n\n    if (event.key === \"Escape\" && this.showDropdown) {\n      event.preventDefault();\n      this._closeDropdown();\n    }\n  };\n\n  private _handleMenuKeydown = (event: KeyboardEvent) => {\n    const items = this._getMenuItems();\n    const currentIndex = items.indexOf(document.activeElement as HTMLElement);\n\n    switch (event.key) {\n      case \"Escape\":\n        event.preventDefault();\n        this._closeDropdown();\n        break;\n      case \"ArrowDown\":\n      case \"ArrowRight\":\n        event.preventDefault();\n        const nextIndex =\n          currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n        this._lastFocusedIndex = nextIndex;\n        items[nextIndex].focus();\n        break;\n      case \"ArrowUp\":\n      case \"ArrowLeft\":\n        event.preventDefault();\n        const prevIndex =\n          currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n        this._lastFocusedIndex = prevIndex;\n        items[prevIndex].focus();\n        break;\n      case \"Tab\":\n        if (currentIndex >= items.length - 1 && !event.shiftKey) {\n          this._closeDropdown();\n        }\n        break;\n      default:\n        break;\n    }\n  };\n\n  private _handleWindowScroll = () => {\n    if (this.showDropdown) {\n      this._positionMenu();\n    }\n  };\n\n  render() {\n    return html`<div\n      class=\"nys-dropdownmenu ${this.showDropdown ? \"active\" : \"\"}\"\n      for=${this.for}\n      ?hidden=${!this.showDropdown}\n    >\n      <ul role=\"menu\" aria-label=${this.label || \"Menu\"}>\n        <slot></slot>\n      </ul>\n    </div>`;\n  }\n}\n\nif (!customElements.get(\"nys-dropdownmenu\")) {\n  customElements.define(\"nys-dropdownmenu\", NysDropdownMenu);\n}\n"],"names":["dropdownMenuItemIdCounter","_NysDropdownMenuItem","LitElement","isLink","html","unsafeCSS","styles","NysDropdownMenuItem","__decorateClass","property","dropdownMenuIdCounter","_NysDropdownMenu","event","path","clickedInsideMenu","clickedTrigger","items","currentIndex","nextIndex","prevIndex","targetId","htmlElement","findInShadows","root","el","shadowElement","found","deeper","trigger","ariaTarget","index","resolve","target","finalPosition","coords","userPosition","space","menuRect","defaultPosition","triggerRect","viewportWidth","viewportHeight","position","menuWidth","menuHeight","vertical","horizontal","verticalFits","horizontalFits","alternatives","altPosition","top","left","targetCrumb","item","NysDropdownMenu"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nysds/nys-dropdownmenu",
-  "version": "1.19.2",
+  "version": "1.19.3",
   "description": "The Dropdownmenu component from the NYS Design System.",
   "module": "dist/nys-dropdownmenu.js",
   "types": "dist/index.d.ts",
@@ -23,7 +23,7 @@
     "lit-analyze": "lit-analyzer 'src/**/*.ts'"
   },
   "dependencies": {
-    "@nysds/nys-icon": "^1.19.2"
+    "@nysds/nys-icon": "^1.19.3"
   },
   "devDependencies": {
     "lit": "^3.3.1",
@@ -42,5 +42,8 @@
   ],
   "author": "New York State Design System Team",
   "license": "MIT",
-  "sideEffects": true
+  "sideEffects": true,
+  "peerDependencies": {
+    "lit": "^3.3.1"
+  }
 }

package/dist/nys-dropdownmenu.d.ts

@@ -1,117 +0,0 @@
-import { LitElement } from "lit";
-import "./nys-dropdownmenuitem";
-/**
- * Dropdown menus enable users to select an action from a list of options.
- * They’re commonly used to save space by grouping related actions, or to provide actions in a confined space.
- *
- * @summary Action menu with auto-positioning, keyboard support, and screen reader integration.
- * @element nys-dropdownmenu
- *
- * @example Basic dropdown
- * ```html
- * <button id="my-trigger">Actions</button>
- * <nys-dropdownmenu for="my-trigger">
- *   <nys-dropdownmenuitem label="Edit" link="/edit"></nys-dropdownmenuitem>
- *   <nys-dropdownmenuitem label="Delete" link="/delete"></nys-dropdownmenuitem>
- * </nys-dropdownmenu>
- * ```
- *
- * @example Positioned dropdown
- * ```html
- * <button id="settings-btn">Settings</button>
- * <nys-dropdownmenu for="settings-btn" position="top-start">
- *   <nys-dropdownmenuitem label="Profile" link="/profile"></nys-dropdownmenuitem>
- *   <nys-dropdownmenuitem label="Logout" link="/logout"></nys-dropdownmenuitem>
- * </nys-dropdownmenu>
- * ```
- */
-type Position = "bottom-start" | "bottom-end" | "top-start" | "top-end";
-export declare class NysDropdownMenu extends LitElement {
-    static styles: import("lit").CSSResult;
-    for: string;
-    showDropdown: boolean;
-    /**
-     * Accessible label for the menu. Used as `aria-label` on the `<ul role="menu">` element.
-     * @default ""
-     */
-    label: string;
-    /**
-     * Preferred position relative to trigger.
-     * @default "bottom-end"
-     */
-    position: Position | null;
-    private _trigger;
-    private _menuElement;
-    private _ariaTarget;
-    private _lastFocusedIndex;
-    private readonly GAP;
-    private _resizeObserver;
-    /**
-     * Lifecycle Methods
-     * --------------------------------------------------------------------------
-     */
-    constructor();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    firstUpdated(): Promise<void>;
-    /**
-     * Functions
-     * --------------------------------------------------------------------------
-     */
-    private _findTrigger;
-    private _connectTrigger;
-    private _toggleDropdown;
-    private _closeDropdown;
-    private _getMenuItems;
-    private _handleDocumentClick;
-    private _focusOnItem;
-    private applyInverseTransform;
-    /**
-     * Position Logic
-     * --------------------------------------------------------------------------
-     */
-    /**
-     * The controller function for positioning the dropdown menu.
-     * The logic diverts to if user sets position or we auto position the dropdown menu
-     */
-    private _positionMenu;
-    private _setUserPosition;
-    /**
-     * Auto Positioning of the dropdown menu relies on the best surrounding space available
-     * to select the desirable position.
-     */
-    private _autoPosition;
-    /**
-     * Checks if the dropdown menu fits inside the viewport on the given side of the trigger.
-     * Overrides user set position for auto-positioning if user's desire space is not available
-     */
-    private _checkSpaceAvailable;
-    private _checkPositionFits;
-    /**
-     * This position is called for when user's set position didn't fit OR auto positioning when default position doesn't fit
-     * We look for the best alternative positions in order of preference base on the set position (e.g. bottom-start => bottom-end).
-     * @param userPosition
-     * @param space
-     * @param menuRect
-     */
-    private _findBestAlternative;
-    private _findMostAvailableSpace;
-    /**
-     * A valid ideal position has been chosen.
-     * This function calculates the coordinate of the trigger to properly position the dropdown menu.
-     * @param position
-     * @returns
-     */
-    private _calculateCoordinates;
-    private _applyPosition;
-    /**
-     * Event Handlers
-     * --------------------------------------------------------------------------
-     */
-    private _handleMenuClick;
-    private _handleTriggerKeydown;
-    private _handleMenuKeydown;
-    private _handleWindowScroll;
-    render(): import("lit-html").TemplateResult<1>;
-}
-export {};

package/dist/nys-dropdownmenuitem.d.ts

@@ -1,40 +0,0 @@
-import { LitElement } from "lit";
-/**
- * **Slotted component.** Displays an individual dropdown item within `nys-dropdown` with label.
- *
- * The `nys-dropdownitem` is used as customizable item within the dropdown so users don't have to raw code <ul>, <li>, <a href>
- * and have the benefit of default customization.
- *
- * @summary Dropdown item to display label and provide href link.
- * @element nys-dropdownmenuitem
- *
- * @example Basic item
- * ```html
- * <nys-dropdownmenuitem label="Edit" link="/edit"></nys-dropdownmenuitem>
- * ```
- *
- * @example Disabled item
- * ```html
- * <nys-dropdownmenuitem label="Delete" link="/delete" disabled></nys-dropdownmenuitem>
- * ```
- */
-export declare class NysDropdownMenuItem extends LitElement {
-    static styles: import("lit").CSSResult;
-    static shadowRootOptions: {
-        delegatesFocus: boolean;
-        clonable?: boolean;
-        customElementRegistry?: CustomElementRegistry;
-        mode: ShadowRootMode;
-        serializable?: boolean;
-        slotAssignment?: SlotAssignmentMode;
-    };
-    label: string;
-    href: string;
-    disabled: boolean;
-    target: string;
-    prefixIcon: string;
-    divider: string;
-    connectedCallback(): void;
-    private _handleClick;
-    render(): import("lit-html").TemplateResult<1>;
-}