"use strict";
const vue = require("vue");
const floatingUi = require("./floatingUi-DunCtfmV.js");
const index = require("./index-C_bsiScj.js");
const useDefaults = require("./useDefaults-YXpmugKp.js");
const useId = require("./useId-Dl8Hi5_U.js");
const BButton_vue_vue_type_script_setup_true_lang = require("./BButton.vue_vue_type_script_setup_true_lang-CXQy0Rf_.js");
const ConditionalWrapper_vue_vue_type_script_lang = require("./ConditionalWrapper.vue_vue_type_script_lang-CFfEbslT.js");
const ConditionalTeleport_vue_vue_type_script_lang = require("./ConditionalTeleport.vue_vue_type_script_lang-BL9AAILt.js");
const getElement = require("./getElement-CodzX3WA.js");
const keys = require("./keys-D70E9HED.js");
const useShowHide = require("./useShowHide-b1MKf6Ye.js");
const index$1 = require("./index-JJEBhaXq.js");
const _hoisted_1 = { class: "visually-hidden" };
const _hoisted_2 = ["id", "aria-labelledby", "role"];
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "BDropdown",
  props: /* @__PURE__ */ vue.mergeModels({
    ariaLabel: { default: void 0 },
    autoClose: { type: [Boolean, String], default: true },
    boundary: { default: "clippingAncestors" },
    boundaryPadding: { default: void 0 },
    disabled: { type: Boolean, default: false },
    floatingMiddleware: { default: void 0 },
    icon: { type: Boolean, default: false },
    id: { default: void 0 },
    isNav: { type: Boolean, default: false },
    menuClass: { default: void 0 },
    noCaret: { type: Boolean, default: false },
    noFlip: { type: Boolean, default: false },
    noShift: { type: Boolean, default: false },
    noSize: { type: Boolean, default: false },
    offset: { default: 0 },
    role: { default: "menu" },
    size: { default: "md" },
    noWrapper: { type: Boolean, default: false },
    split: { type: Boolean, default: false },
    splitButtonType: { default: "button" },
    splitClass: { default: void 0 },
    splitDisabled: { type: Boolean, default: void 0 },
    splitHref: { default: void 0 },
    splitTo: { default: void 0 },
    splitVariant: { default: void 0 },
    strategy: { default: "absolute" },
    text: { default: void 0 },
    toggleClass: { default: void 0 },
    toggleText: { default: "Toggle dropdown" },
    variant: { default: "secondary" },
    wrapperClass: { default: void 0 },
    placement: { default: "bottom-start" },
    teleportDisabled: { type: Boolean, default: false },
    teleportTo: { default: void 0 },
    initialAnimation: { type: Boolean, default: false },
    noAnimation: { type: Boolean },
    noFade: { type: Boolean, default: false },
    lazy: { type: Boolean, default: false },
    unmountLazy: { type: Boolean, default: false },
    show: { type: Boolean, default: false },
    transProps: { default: void 0 },
    visible: { type: Boolean, default: false }
  }, {
    "modelValue": { type: Boolean, ...{ default: false } },
    "modelModifiers": {}
  }),
  emits: /* @__PURE__ */ vue.mergeModels(["split-click", "hide", "hide-prevented", "hidden", "show", "show-prevented", "shown", "toggle", "toggle-prevented"], ["update:modelValue"]),
  setup(__props, { expose: __expose, emit: __emit }) {
    const _props = __props;
    const props = useDefaults.useDefaults(_props, "BDropdown");
    const emit = __emit;
    const computedId = useId.useId(() => props.id, "dropdown");
    const modelValue = vue.useModel(__props, "modelValue");
    const inInputGroup = vue.inject(keys.inputGroupKey, false);
    const inButtonGroup = vue.inject(keys.buttonGroupKey, false);
    const computedOffset = vue.computed(
      () => typeof props.offset === "string" || typeof props.offset === "number" ? props.offset : Number.NaN
    );
    const offsetToNumber = index$1.useToNumber(computedOffset);
    const floatingElement = vue.useTemplateRef("_floating");
    const button = vue.useTemplateRef("_button");
    const splitButton = vue.useTemplateRef("_splitButton");
    const boundary = vue.computed(
      () => floatingUi.isBoundary(props.boundary) ? props.boundary : void 0
    );
    const rootBoundary = vue.computed(
      () => floatingUi.isRootBoundary(props.boundary) ? props.boundary : void 0
    );
    const referenceElement = vue.computed(() => !props.split ? splitButton.value : button.value);
    let cleanup;
    const {
      showRef,
      renderRef,
      hide,
      show,
      toggle,
      computedNoAnimation,
      transitionProps,
      contentShowing,
      isVisible
    } = useShowHide.useShowHide(modelValue, props, emit, referenceElement, computedId, {
      showFn: () => {
        update();
        vue.nextTick(() => {
          cleanup = floatingUi.autoUpdate(
            referenceElement.value,
            floatingElement.value,
            update,
            {
              animationFrame: false
            }
          );
        });
      },
      hideFn: () => {
        if (cleanup) {
          cleanup();
          cleanup = void 0;
        }
      }
    });
    const computedMenuClasses = vue.computed(() => [
      {
        show: isVisible.value,
        fade: !computedNoAnimation.value
      }
    ]);
    index.onKeyStroke(
      "Escape",
      () => {
        hide();
        getElement.getElement(referenceElement.value)?.focus();
      },
      { target: referenceElement }
    );
    index.onKeyStroke(
      "Escape",
      () => {
        hide();
        getElement.getElement(referenceElement.value)?.focus();
      },
      { target: floatingElement }
    );
    const keynav = (e, v) => {
      if (floatingElement.value?.contains(e.target?.closest("form"))) return;
      if (/input|select|option|textarea|form/i.test(e.target?.tagName)) return;
      e.preventDefault();
      if (!showRef.value) {
        show();
        const loop = setInterval(() => {
          if (isVisible.value) {
            clearInterval(loop);
            vue.nextTick(() => keynav(e, v));
          }
        }, 16);
        return;
      }
      const list = floatingElement.value?.querySelectorAll(
        ".dropdown-item:not(.disabled):not(:disabled)"
      );
      if (!list) return;
      if (floatingElement.value?.contains(document.activeElement)) {
        const active = floatingElement.value.querySelector(".dropdown-item:focus");
        const index2 = Array.prototype.indexOf.call(list, active) + v;
        if (index2 >= 0 && index2 < list?.length) list[index2]?.focus();
      } else {
        list[v === -1 ? list.length - 1 : 0]?.focus();
      }
    };
    index.onKeyStroke("ArrowUp", (e) => keynav(e, -1), { target: referenceElement });
    index.onKeyStroke("ArrowDown", (e) => keynav(e, 1), { target: referenceElement });
    index.onKeyStroke("ArrowUp", (e) => keynav(e, -1), { target: floatingElement });
    index.onKeyStroke("ArrowDown", (e) => keynav(e, 1), { target: floatingElement });
    const sizeStyles = vue.ref({});
    const floatingMiddleware = vue.computed(() => {
      if (props.floatingMiddleware !== void 0) {
        return props.floatingMiddleware;
      }
      const localOffset = typeof props.offset === "string" || typeof props.offset === "number" ? offsetToNumber.value : props.offset;
      const arr = [floatingUi.offset(localOffset)];
      if (props.noFlip === false) {
        arr.push(
          floatingUi.flip({
            boundary: boundary.value,
            rootBoundary: rootBoundary.value,
            padding: props.boundaryPadding
          })
        );
      }
      if (props.noShift === false) {
        arr.push(
          floatingUi.shift({
            boundary: boundary.value,
            rootBoundary: rootBoundary.value,
            padding: props.boundaryPadding
          })
        );
      }
      if (props.noSize === false) {
        arr.push(
          floatingUi.size({
            boundary: boundary.value,
            rootBoundary: rootBoundary.value,
            padding: props.boundaryPadding,
            apply({ availableWidth, availableHeight }) {
              sizeStyles.value = {
                "--bv-floating-max-height": availableHeight >= (floatingElement.value?.scrollHeight ?? 0) ? void 0 : availableHeight ? `${Math.max(0, availableHeight)}px` : void 0,
                "--bv-floating-max-width": availableWidth >= (floatingElement.value?.scrollWidth ?? 0) ? void 0 : availableWidth ? `${Math.max(0, availableWidth)}px` : void 0
              };
            }
          })
        );
      }
      return arr;
    });
    const { update, floatingStyles } = floatingUi.useFloating(referenceElement, floatingElement, {
      placement: () => props.placement,
      middleware: floatingMiddleware,
      strategy: vue.toRef(() => props.strategy)
    });
    const inButtonGroupAttributes = inButtonGroup ? {
      class: "btn-group",
      role: "group"
    } : void 0;
    const computedClasses = vue.computed(() => [
      inButtonGroupAttributes?.class,
      props.wrapperClass,
      {
        "btn-group": !props.wrapperClass && props.split,
        [`drop${floatingUi.resolveBootstrapCaret(props.placement)}`]: !props.wrapperClass,
        "position-static": props.boundary !== "clippingAncestors" && !props.isNav
      }
    ]);
    const buttonClasses = vue.computed(() => [
      props.split ? props.splitClass : props.toggleClass,
      {
        "nav-link": props.isNav,
        "dropdown-toggle": !props.split,
        "dropdown-toggle-no-caret": props.noCaret && !props.split,
        "show": props.split ? void 0 : showRef.value
      }
    ]);
    const onButtonClick = () => {
      toggle();
    };
    const onSplitClick = (event) => {
      if (props.split) {
        emit("split-click", event);
        return;
      }
      onButtonClick();
    };
    index.onClickOutside(
      floatingElement,
      () => {
        if (showRef.value && (props.autoClose === true || props.autoClose === "outside")) {
          hide();
        }
      },
      { ignore: [button, splitButton] }
    );
    const onClickInside = () => {
      if (showRef.value && (props.autoClose === true || props.autoClose === "inside")) {
        hide();
      }
    };
    vue.watch(isVisible, () => {
      update();
    });
    __expose({
      hide,
      show,
      toggle
    });
    vue.provide(keys.dropdownInjectionKey, {
      id: computedId,
      show,
      hide,
      toggle,
      visible: vue.readonly(showRef),
      isNav: vue.toRef(() => props.isNav)
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createBlock(ConditionalWrapper_vue_vue_type_script_lang._sfc_main, {
        skip: vue.unref(inInputGroup) || vue.unref(props).noWrapper,
        class: vue.normalizeClass(computedClasses.value),
        role: vue.unref(inButtonGroupAttributes)?.role
      }, {
        default: vue.withCtx(() => [
          vue.createVNode(BButton_vue_vue_type_script_setup_true_lang._sfc_main, {
            id: vue.unref(computedId),
            ref: "_splitButton",
            variant: vue.unref(props).splitVariant || vue.unref(props).variant,
            size: vue.unref(props).size,
            class: vue.normalizeClass(buttonClasses.value),
            disabled: vue.unref(props).splitDisabled || vue.unref(props).disabled,
            type: vue.unref(props).splitButtonType,
            "aria-label": vue.unref(props).ariaLabel,
            "aria-expanded": vue.unref(props).split ? void 0 : vue.unref(showRef),
            "aria-haspopup": vue.unref(props).split ? void 0 : "menu",
            href: vue.unref(props).split ? vue.unref(props).splitHref : void 0,
            icon: vue.unref(props).icon,
            to: vue.unref(props).split && vue.unref(props).splitTo ? vue.unref(props).splitTo : void 0,
            onClick: onSplitClick
          }, {
            default: vue.withCtx(() => [
              vue.renderSlot(_ctx.$slots, "button-content", {}, () => [
                vue.createTextVNode(vue.toDisplayString(vue.unref(props).text), 1)
              ])
            ]),
            _: 3
          }, 8, ["id", "variant", "size", "class", "disabled", "type", "aria-label", "aria-expanded", "aria-haspopup", "href", "icon", "to"]),
          vue.unref(props).split ? (vue.openBlock(), vue.createBlock(BButton_vue_vue_type_script_setup_true_lang._sfc_main, {
            key: 0,
            id: vue.unref(computedId) + "-split",
            ref: "_button",
            variant: vue.unref(props).variant,
            size: vue.unref(props).size,
            disabled: vue.unref(props).disabled,
            class: vue.normalizeClass([[vue.unref(props).toggleClass, { show: vue.unref(showRef) }], "dropdown-toggle-split dropdown-toggle"]),
            "aria-expanded": vue.unref(showRef),
            "aria-haspopup": "menu",
            onClick: onButtonClick
          }, {
            default: vue.withCtx(() => [
              vue.createElementVNode("span", _hoisted_1, [
                vue.renderSlot(_ctx.$slots, "toggle-text", {}, () => [
                  vue.createTextVNode(vue.toDisplayString(vue.unref(props).toggleText), 1)
                ])
              ])
            ]),
            _: 3
          }, 8, ["id", "variant", "size", "disabled", "class", "aria-expanded"])) : vue.createCommentVNode("", true),
          vue.createVNode(ConditionalTeleport_vue_vue_type_script_lang._sfc_main, {
            to: vue.unref(props).teleportTo,
            disabled: !vue.unref(props).teleportTo || vue.unref(props).teleportDisabled
          }, {
            default: vue.withCtx(() => [
              vue.unref(renderRef) || vue.unref(contentShowing) ? (vue.openBlock(), vue.createBlock(vue.Transition, vue.mergeProps({ key: 0 }, vue.unref(transitionProps), {
                appear: modelValue.value || vue.unref(props).visible
              }), {
                default: vue.withCtx(() => [
                  vue.withDirectives(vue.createElementVNode("ul", {
                    id: vue.unref(computedId) + "-menu",
                    ref: "_floating",
                    style: vue.normalizeStyle([vue.unref(floatingStyles), sizeStyles.value, { display: vue.unref(showRef) ? "block" : "none" }]),
                    class: vue.normalizeClass(["dropdown-menu overflow-auto b-floating-size", [vue.unref(props).menuClass, computedMenuClasses.value]]),
                    "aria-labelledby": vue.unref(computedId),
                    role: vue.unref(props).role,
                    onClick: onClickInside
                  }, [
                    vue.unref(contentShowing) ? vue.renderSlot(_ctx.$slots, "default", {
                      key: 0,
                      id: vue.unref(computedId),
                      hide: vue.unref(hide),
                      show: vue.unref(show),
                      visible: vue.unref(showRef),
                      click: onClickInside,
                      toggle: onButtonClick,
                      active: vue.unref(showRef)
                    }) : vue.createCommentVNode("", true)
                  ], 14, _hoisted_2), [
                    [vue.vShow, vue.unref(showRef)]
                  ])
                ]),
                _: 3
              }, 16, ["appear"])) : vue.createCommentVNode("", true)
            ]),
            _: 3
          }, 8, ["to", "disabled"])
        ]),
        _: 3
      }, 8, ["skip", "class", "role"]);
    };
  }
});
exports._sfc_main = _sfc_main;
//# sourceMappingURL=BDropdown.vue_vue_type_script_setup_true_lang-BOOGQ1ig.js.map
