import "./DKem_M_z.js";
import "./DwLkIEu4.js";
import { p as push, o as onMount, j as onDestroy, l as legacy_pre_effect, n as legacy_pre_effect_reset, y as event, h as first_child, t as template_effect, a as append, b as pop, k as get, A as tick, m as deep_read_state, aU as $window, z as sibling, f as from_html, q as mutable_source, c as child, r as reset, aV as mutate, w as set, U as effect } from "./B-Kw_l3V.js";
import { i as if_block } from "./DWHK2A9K.js";
import { s as slot } from "./zXynQJya.js";
import { t as transition } from "./CDUneY82.js";
import { a as action } from "./CHLP_p7V.js";
import { s as set_attribute, a as set_class, c as clsx } from "./B9yCN616.js";
import { b as bind_prop } from "./CoY6LkZW.js";
import { b as bind_this } from "./BSYzg88z.js";
import { i as init } from "./CUpGYt-B.js";
import { p as prop } from "./COqmMDwI.js";
import { f as flyAndScale } from "./GVdwQ4e6.js";
var root = from_html(`<div role="menu"><!></div>`);
var root_1 = from_html(`<span style="display: contents; cursor: pointer;" role="button" aria-haspopup="true"><!></span> <!>`, 1);
function Dropdown($$anchor, $$props) {
  push($$props, false);
  let show = prop($$props, "show", 12, false);
  let side = prop($$props, "side", 8, "bottom");
  let align = prop($$props, "align", 8, "start");
  let closeOnOutsideClick = prop($$props, "closeOnOutsideClick", 8, true);
  let onOpenChange = prop($$props, "onOpenChange", 8, () => {
  });
  let contentClass = prop($$props, "contentClass", 8, "");
  let sideOffset = prop($$props, "sideOffset", 8, 4);
  let triggerEl;
  let contentEl = mutable_source();
  function portal(node) {
    document.body.appendChild(node);
    return {
      destroy() {
        if (node.parentNode) {
          node.parentNode.removeChild(node);
        }
      }
    };
  }
  function trigger(node) {
    triggerEl = node.firstElementChild || node;
    function handleClick(e) {
      e.preventDefault();
      toggleOpen();
    }
    function handleKeydown2(e) {
      if (e.key === "Enter" || e.key === " ") {
        e.preventDefault();
        toggleOpen();
      }
    }
    node.addEventListener("click", handleClick);
    node.addEventListener("keydown", handleKeydown2);
    return {
      destroy() {
        node.removeEventListener("click", handleClick);
        node.removeEventListener("keydown", handleKeydown2);
      }
    };
  }
  function positionContent() {
    if (!triggerEl || !get(contentEl)) return;
    const rect = triggerEl.getBoundingClientRect();
    mutate(contentEl, get(contentEl).style.position = "fixed");
    mutate(contentEl, get(contentEl).style.zIndex = "9999");
    const contentHeight = get(contentEl).offsetHeight || 0;
    const spaceBelow = window.innerHeight - rect.bottom - sideOffset();
    const spaceAbove = rect.top - sideOffset();
    let openAbove = side() === "top";
    if (side() === "bottom" && spaceBelow < contentHeight && spaceAbove > spaceBelow) {
      openAbove = true;
    } else if (side() === "top" && spaceAbove < contentHeight && spaceBelow > spaceAbove) {
      openAbove = false;
    }
    if (openAbove) {
      mutate(contentEl, get(contentEl).style.bottom = `${window.innerHeight - rect.top + sideOffset()}px`);
      mutate(contentEl, get(contentEl).style.top = "auto");
    } else {
      mutate(contentEl, get(contentEl).style.top = `${rect.bottom + sideOffset()}px`);
      mutate(contentEl, get(contentEl).style.bottom = "auto");
    }
    if (align() === "end") {
      let right = window.innerWidth - rect.right;
      const contentWidth = get(contentEl).offsetWidth || 0;
      if (right + contentWidth > window.innerWidth) {
        right = window.innerWidth - contentWidth - 16;
      }
      mutate(contentEl, get(contentEl).style.right = `${Math.max(16, right)}px`);
      mutate(contentEl, get(contentEl).style.left = "auto");
    } else {
      let left = rect.left;
      const contentWidth = get(contentEl).offsetWidth || 0;
      if (left + contentWidth + 16 > window.innerWidth) {
        left = window.innerWidth - contentWidth - 16;
      }
      mutate(contentEl, get(contentEl).style.left = `${Math.max(16, left)}px`);
      mutate(contentEl, get(contentEl).style.right = "auto");
    }
  }
  async function toggleOpen() {
    show(!show());
    onOpenChange()(show());
    if (show()) {
      await tick();
      positionContent();
      setTimeout(positionContent, 50);
    }
  }
  function handleWindowPointerDown(event2) {
    var _a;
    if (!show() || !closeOnOutsideClick()) return;
    if (triggerEl == null ? void 0 : triggerEl.contains(event2.target)) return;
    if ((_a = get(contentEl)) == null ? void 0 : _a.contains(event2.target)) return;
    show(false);
    onOpenChange()(false);
  }
  function handleKeydown(event2) {
    if (event2.key === "Escape" && show()) {
      show(false);
      onOpenChange()(false);
    }
  }
  function close() {
    show(false);
    onOpenChange()(false);
  }
  let onPointerDown;
  onMount(() => {
    onPointerDown = (e) => handleWindowPointerDown(e);
    document.addEventListener("pointerdown", onPointerDown, true);
  });
  onDestroy(() => {
    if (onPointerDown) {
      document.removeEventListener("pointerdown", onPointerDown, true);
    }
  });
  legacy_pre_effect(() => (deep_read_state(show()), tick), () => {
    if (show()) {
      tick().then(() => {
        positionContent();
        setTimeout(positionContent, 50);
      });
    }
  });
  legacy_pre_effect_reset();
  var $$exports = { close };
  init();
  var fragment = root_1();
  event(
    "keydown",
    $window,
    /** Close the dropdown programmatically */
    handleKeydown
  );
  event("scroll", $window, positionContent, true);
  event("resize", $window, positionContent);
  var span = first_child(fragment);
  var node_1 = child(span);
  slot(node_1, $$props, "default", {}, null);
  reset(span);
  action(span, ($$node) => trigger == null ? void 0 : trigger($$node));
  var node_2 = sibling(span, 2);
  {
    var consequent = ($$anchor2) => {
      var div = root();
      var node_3 = child(div);
      slot(node_3, $$props, "content", {}, null);
      reset(div);
      action(div, ($$node) => portal == null ? void 0 : portal($$node));
      bind_this(div, ($$value) => set(contentEl, $$value), () => get(contentEl));
      effect(() => event("click", div, (e) => e.stopPropagation()));
      effect(() => event("pointerdown", div, (e) => e.stopPropagation()));
      template_effect(() => set_class(div, 1, clsx(contentClass())));
      transition(3, div, () => flyAndScale);
      append($$anchor2, div);
    };
    if_block(node_2, ($$render) => {
      if (show()) $$render(consequent);
    });
  }
  template_effect(() => set_attribute(span, "aria-expanded", show()));
  append($$anchor, fragment);
  bind_prop($$props, "close", close);
  return pop($$exports);
}
export {
  Dropdown as D
};