"use strict";
const vue = require("vue");
const useDefaults = require("./useDefaults-YXpmugKp.js");
const keys = require("./keys-D70E9HED.js");
const constants = require("./constants-DxId_i-P.js");
const event = require("./event-BbcvB460.js");
const dom = require("./dom-BgEUZpKg.js");
const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
  __name: "BButtonGroup",
  props: {
    ariaLabel: { default: "Group" },
    size: { default: "md" },
    tag: { default: "div" },
    vertical: { type: Boolean, default: false }
  },
  setup(__props) {
    vue.provide(keys.buttonGroupKey, true);
    const _props = __props;
    const props = useDefaults.useDefaults(_props, "BButtonGroup");
    const computedClasses = vue.computed(() => ({
      "btn-group": !props.vertical,
      [`btn-group-${props.size}`]: props.size !== "md",
      "btn-group-vertical": props.vertical
    }));
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(props).tag), {
        class: vue.normalizeClass(computedClasses.value),
        role: "group",
        "aria-label": vue.unref(props).ariaLabel
      }, {
        default: vue.withCtx(() => [
          vue.renderSlot(_ctx.$slots, "default")
        ]),
        _: 3
      }, 8, ["class", "aria-label"]);
    };
  }
});
const _hoisted_1 = ["role", "aria-label"];
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "BButtonToolbar",
  props: {
    ariaLabel: { default: "Group" },
    keyNav: { type: Boolean, default: false },
    justify: { type: Boolean, default: false },
    role: { default: "toolbar" }
  },
  setup(__props) {
    const _props = __props;
    const props = useDefaults.useDefaults(_props, "BButtonToolbar");
    const toolbarRef = vue.useTemplateRef("toolbarRef");
    const computedClasses = vue.computed(() => ({
      "justify-content-between": props.justify
    }));
    const getFocusableElements = () => {
      if (!toolbarRef.value) return [];
      const selector = 'button:not(:disabled), [href]:not(:disabled), input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex="-1"]):not(:disabled)';
      const elements = Array.from(toolbarRef.value.querySelectorAll(selector));
      return elements.filter((el) => {
        const style = window.getComputedStyle(el);
        return style.display !== "none" && style.visibility !== "hidden";
      });
    };
    const isDisabled = (element) => element.hasAttribute("disabled") || element.getAttribute("aria-disabled") === "true";
    const focusFirst = () => {
      vue.nextTick(() => {
        const elements = getFocusableElements();
        const firstEnabled = elements.find((el) => !isDisabled(el));
        firstEnabled?.focus();
      });
    };
    const focusLast = () => {
      vue.nextTick(() => {
        const elements = getFocusableElements();
        const lastEnabled = elements.reverse().find((el) => !isDisabled(el));
        lastEnabled?.focus();
      });
    };
    const focusPrev = () => {
      vue.nextTick(() => {
        const elements = getFocusableElements();
        const activeElement = dom.getActiveElement();
        const currentIndex = elements.indexOf(activeElement);
        if (currentIndex > 0) {
          for (let i = currentIndex - 1; i >= 0; i--) {
            if (!isDisabled(elements[i])) {
              elements[i]?.focus();
              break;
            }
          }
        }
      });
    };
    const focusNext = () => {
      vue.nextTick(() => {
        const elements = getFocusableElements();
        const activeElement = dom.getActiveElement();
        const currentIndex = elements.indexOf(activeElement);
        if (currentIndex < elements.length - 1) {
          for (let i = currentIndex + 1; i < elements.length; i++) {
            if (!isDisabled(elements[i])) {
              elements[i]?.focus();
              break;
            }
          }
        }
      });
    };
    const handleKeyNav = (event$1) => {
      if (!props.keyNav) return;
      const { code, shiftKey } = event$1;
      if (code === constants.CODE_LEFT || code === constants.CODE_UP) {
        event.stopEvent(event$1);
        if (shiftKey) {
          focusFirst();
        } else {
          focusPrev();
        }
      } else if (code === constants.CODE_RIGHT || code === constants.CODE_DOWN) {
        event.stopEvent(event$1);
        if (shiftKey) {
          focusLast();
        } else {
          focusNext();
        }
      } else if (code === constants.CODE_HOME) {
        event.stopEvent(event$1);
        focusFirst();
      } else if (code === constants.CODE_END) {
        event.stopEvent(event$1);
        focusLast();
      }
    };
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock("div", {
        ref_key: "toolbarRef",
        ref: toolbarRef,
        class: vue.normalizeClass([computedClasses.value, "btn-toolbar"]),
        role: vue.unref(props).role,
        "aria-label": vue.unref(props).ariaLabel,
        onKeydown: handleKeyNav
      }, [
        vue.renderSlot(_ctx.$slots, "default")
      ], 42, _hoisted_1);
    };
  }
});
exports._sfc_main = _sfc_main$1;
exports._sfc_main$1 = _sfc_main;
//# sourceMappingURL=BButtonToolbar.vue_vue_type_script_setup_true_lang-B-7kf2oU.js.map
