import { r as s, h as e } from "./reactcomponent-44b70bf6.mjs";
import "react";
import "react-dom";
const l = "html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}:host{display:block;height:100%;width:100%}.container{height:100%;display:flex}.container .scroll-container{width:100%;overflow-y:auto}", n = class {
  constructor(t) {
    s(this, t), this.scrollButtonsEnabled = !1, this.scrollLength = 100;
  }
  componentDidLoad() {
    this.addIntersectionObserver(), this.scrollButtonsEnabled && this.setScrollContainerElementRef();
  }
  /**
   * @description Update state of scroll buttons when a "listItemDidRender" event is fired.
   * @private
   */
  updateScrollButtonsState() {
    this.scrollButtonsEnabled && this.miScrollButtonsElement.scrollContainerElementRef && this.miScrollButtonsElement.updateScrollButtonsState();
  }
  /**
   * @description Set scrollContainerElementRef attribute on miScrollButtonsElement.
   * @private
   */
  setScrollContainerElementRef() {
    this.miScrollButtonsElement.scrollContainerElementRef = this.scrollContainerElement;
  }
  /**
   * @description Add intersection observer and update scroll buttons state on intersection – workaround to avoid the element not having any dimensions before it's shown.
   * @private
   */
  addIntersectionObserver() {
    this.intersectionObserver = new IntersectionObserver((t) => {
      t[0].intersectionRatio <= 0 || (this.scrollContainerElement.scrollHeight - this.scrollContainerElement.scrollTop === this.scrollContainerElement.clientHeight && this.updateScrollButtonsState(), this.intersectionObserver.disconnect());
    }), this.intersectionObserver.observe(this.scrollContainerElement);
  }
  render() {
    return e("div", { class: "container" }, e("div", { role: "list", class: "scroll-container", ref: (t) => this.scrollContainerElement = t }, e("slot", null)), this.scrollButtonsEnabled ? e("mi-scroll-buttons", { scrollLength: this.scrollLength, ref: (t) => this.miScrollButtonsElement = t }) : null);
  }
};
n.style = l;
export {
  n as mi_list
};
//# sourceMappingURL=mi-list.entry-f360ade9.mjs.map
