@sandlada/vue-mdc/build/components/navigation-drawer/navigation-drawer-controller.js


/**
 * @license
 * Copyright 2025 Sandlada & Kai Orion
 * SPDX-License-Identifier: MIT
 */
import { ENavigationDrawerState } from "./navigation-state.js";
import css from "./styles/navigation-drawer.module.scss.js";
const SNavigationDrawerController = Symbol("navigationDrawerController");
class NavigationDrawerController {
  _host;
  show;
  close;
  constructor(_host, show, close) {
    this._host = _host;
    this.show = show;
    this.close = close;
    _host[SNavigationDrawerController] = this;
  }
  get host() {
    return this._host;
  }
  get state() {
    const attrValue = this.host.getAttribute("state");
    const key = attrValue.at(0)?.toUpperCase() + attrValue.slice(1);
    return ENavigationDrawerState[key];
  }
  get dialogElement() {
    return this.host.querySelector(`.${css.dialog}`);
  }
  get containerElement() {
    return this.host.querySelector(`.${css.container}`);
  }
  get scrollerElement() {
    return this.host.querySelector(`.${css.scroller}`);
  }
  get contentWrapperElement() {
    return this.host.querySelector(`.${css["content-wrapper"]}`);
  }
  get contentElement() {
    return this.host.querySelector(`.${css.content}`);
  }
  get indicatorElements() {
    if (!this.contentElement) {
      return [];
    }
    return Array.from(this.contentElement.querySelectorAll(`.${css["navigation-drawer-indicator-component-styles"]}[data-component="navigation-drawer-indicator"]`));
  }
  get activeIndicatorElement() {
    const indicators = this.indicatorElements;
    const targetIndex = indicators.findIndex((element) => element.classList.contains(`${css.active}`));
    return indicators.at(targetIndex);
  }
  setActiveIndicatorByLabel(label) {
    const target = this.indicatorElements.filter((e) => label === e.getAttribute("data-label"));
    if (target.length > 1) {
      console.warn(`The target parameter label [${label}] is found, but there are multiple NavigationDrawerIndicators with the same label value in the NavigationDrawer component. Please make sure to assign unique (different label values) labels when using the NavigationDrawerIndicator component.`);
    } else if (target.length === 0) {
      console.warn(`Unable to find a NavigationDrawerIndicator with the specified label value [${label}]. Please make sure that the label value can match a NavigationDrawerIndicator.`);
    } else {
      this.indicatorElements.forEach((element) => element.classList.remove(`${css.active}`));
      target[0].classList.add(`${css.active}`);
    }
  }
  setActiveIndicatorByOrder(order) {
    const indicators = this.indicatorElements;
    if (order >= indicators.length) {
      console.error(`The value range of order [${order}] exceeds the number of indicator elements [${indicators.length}].`);
    }
    indicators.forEach((element) => element.classList.remove(`${css.active}`));
    this.indicatorElements.at(order)?.classList.add(`${css.active}`);
  }
  setActiveIndicatorByElement(element) {
    if (!element.classList.contains(`${css["navigation-drawer-indicator-component-styles"]}`) && element.getAttribute("data-component") !== "navigation-drawer-indicator") {
      console.error(`The parameter element [${element}] is not a valid NavigationDrawerIndicator component HTMLElement.`);
    } else {
      this.indicatorElements.forEach((element2) => element2.classList.remove(`${css.active}`));
      element.classList.add(`${css.active}`);
    }
  }
}
export {
  NavigationDrawerController,
  SNavigationDrawerController
};
//# sourceMappingURL=navigation-drawer-controller.js.map