"use strict";
const vue = require("vue");
const keys = require("./keys-D70E9HED.js");
const useId = require("./useId-Dl8Hi5_U.js");
const useDefaults = require("./useDefaults-YXpmugKp.js");
const flattenFragments = require("./flattenFragments-C5j6tfjr.js");
const BCollapse_vue_vue_type_script_setup_true_lang = require("./BCollapse.vue_vue_type_script_setup_true_lang-Cq0pRoa5.js");
const object = require("./object-DlOVrM-t.js");
const dom = require("./dom-BgEUZpKg.js");
const _hoisted_1$1 = ["aria-expanded", "aria-controls", "onClick"];
const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
  ...{
    inheritAttrs: false
  },
  __name: "BAccordionItem",
  props: /* @__PURE__ */ vue.mergeModels({
    bodyAttrs: { default: void 0 },
    bodyClass: { default: void 0 },
    buttonAttrs: { default: void 0 },
    buttonClass: { default: void 0 },
    collapseClass: { default: void 0 },
    headerAttrs: { default: void 0 },
    headerClass: { default: void 0 },
    headerTag: { default: "h2" },
    horizontal: { type: Boolean, default: void 0 },
    id: { default: void 0 },
    isNav: { type: Boolean, default: void 0 },
    lazy: { type: Boolean, default: false },
    unmountLazy: { type: Boolean, default: false },
    tag: { default: void 0 },
    title: { default: void 0 },
    show: { type: Boolean, default: void 0 },
    visible: { type: Boolean, default: false },
    wrapperAttrs: { default: void 0 }
  }, {
    "modelValue": { type: Boolean, ...{
      default: false
    } },
    "modelModifiers": {}
  }),
  emits: /* @__PURE__ */ vue.mergeModels(["hide", "hide-prevented", "hidden", "show", "show-prevented", "shown", "toggle", "toggle-prevented"], ["update:modelValue"]),
  setup(__props, { emit: __emit }) {
    const _props = __props;
    const props = useDefaults.useDefaults(_props, "BAccordionItem");
    const emit = __emit;
    const attrs = vue.useAttrs();
    const processedAttrs = vue.computed(() => {
      const { class: wrapperClass, ...collapseAttrs } = attrs;
      return { wrapperClass, collapseAttrs };
    });
    const parentData = vue.inject(keys.accordionInjectionKey, null);
    const computedId = useId.useId(() => props.id, "accordion_item");
    const modelValue = vue.useModel(__props, "modelValue");
    if (modelValue.value) {
      parentData?.setOpenItem(computedId.value);
    } else {
      modelValue.value = (object.isReadOnlyArray(parentData?.openItem.value) ? parentData?.openItem.value.includes(computedId.value) : parentData?.openItem.value === computedId.value) && !parentData?.initialAnimation.value;
    }
    const el = vue.useTemplateRef("_el");
    parentData?.registerAccordionItem(computedId.value, el);
    vue.onUnmounted(() => {
      parentData?.unregisterAccordionItem(computedId.value);
    });
    vue.onMounted(() => {
      if (!modelValue.value && parentData?.openItem.value === computedId.value) {
        vue.nextTick(() => {
          modelValue.value = true;
        });
      }
    });
    const openInParent = vue.computed(
      () => object.isReadOnlyArray(parentData?.openItem.value) ? parentData?.openItem.value.includes(computedId.value) : parentData?.openItem.value === computedId.value
    );
    vue.watch(
      () => parentData?.openItem.value,
      () => modelValue.value = openInParent.value
    );
    vue.watch(modelValue, () => {
      if (modelValue.value && !openInParent.value) {
        parentData?.setOpenItem(computedId.value);
      } else if (!modelValue.value && openInParent.value) {
        parentData?.setCloseItem(computedId.value);
      }
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
        ref: "_el",
        class: "accordion-item"
      }, vue.unref(props).wrapperAttrs, {
        class: processedAttrs.value.wrapperClass
      }), [
        vue.createVNode(BCollapse_vue_vue_type_script_setup_true_lang._sfc_main, vue.mergeProps({
          id: vue.unref(computedId),
          modelValue: modelValue.value,
          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
          class: ["accordion-collapse", vue.unref(props).collapseClass],
          "aria-labelledby": `${vue.unref(computedId)}-heading`
        }, processedAttrs.value.collapseAttrs, {
          tag: vue.unref(props).tag,
          show: vue.unref(props).show,
          horizontal: vue.unref(props).horizontal,
          visible: vue.unref(props).visible,
          "is-nav": vue.unref(props).isNav,
          lazy: vue.unref(props).lazy || vue.unref(parentData)?.lazy.value,
          "unmount-lazy": vue.unref(props).unmountLazy || vue.unref(parentData)?.unmountLazy.value,
          onShow: _cache[1] || (_cache[1] = ($event) => emit("show", $event)),
          onShown: _cache[2] || (_cache[2] = ($event) => emit("shown", $event)),
          onHide: _cache[3] || (_cache[3] = ($event) => emit("hide", $event)),
          onHidden: _cache[4] || (_cache[4] = ($event) => emit("hidden", $event)),
          onHidePrevented: _cache[5] || (_cache[5] = ($event) => emit("hide-prevented", $event)),
          onShowPrevented: _cache[6] || (_cache[6] = ($event) => emit("show-prevented", $event)),
          onTogglePrevented: _cache[7] || (_cache[7] = ($event) => emit("toggle-prevented", $event)),
          onToggle: _cache[8] || (_cache[8] = ($event) => emit("toggle", $event))
        }), {
          header: vue.withCtx(({ visible: toggleVisible, toggle: slotToggle }) => [
            (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(props).headerTag), vue.mergeProps({
              id: `${vue.unref(computedId)}-heading`,
              class: ["accordion-header", vue.unref(props).headerClass]
            }, vue.unref(props).headerAttrs), {
              default: vue.withCtx(() => [
                vue.createElementVNode("button", vue.mergeProps({ class: "accordion-button" }, vue.unref(props).buttonAttrs, {
                  class: [{ collapsed: !toggleVisible }, vue.unref(props).buttonClass],
                  type: "button",
                  "aria-expanded": toggleVisible ? "true" : "false",
                  "aria-controls": vue.unref(computedId),
                  onClick: slotToggle
                }), [
                  vue.renderSlot(_ctx.$slots, "title", {}, () => [
                    vue.createTextVNode(vue.toDisplayString(vue.unref(props).title), 1)
                  ])
                ], 16, _hoisted_1$1)
              ]),
              _: 2
            }, 1040, ["id", "class"]))
          ]),
          default: vue.withCtx(() => [
            vue.createElementVNode("div", vue.mergeProps({ class: "accordion-body" }, vue.unref(props).bodyAttrs, {
              class: vue.unref(props).bodyClass
            }), [
              vue.renderSlot(_ctx.$slots, "default")
            ], 16)
          ]),
          _: 3
        }, 16, ["id", "modelValue", "class", "aria-labelledby", "tag", "show", "horizontal", "visible", "is-nav", "lazy", "unmount-lazy"])
      ], 16);
    };
  }
});
const _hoisted_1 = ["id"];
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "BAccordion",
  props: /* @__PURE__ */ vue.mergeModels({
    flush: { type: Boolean, default: false },
    free: { type: Boolean, default: false },
    id: { default: void 0 },
    initialAnimation: { type: Boolean, default: false },
    lazy: { type: Boolean, default: false },
    unmountLazy: { type: Boolean, default: false }
  }, {
    "modelValue": {
      default: void 0
    },
    "modelModifiers": {},
    "index": {
      default: void 0
    },
    "indexModifiers": {}
  }),
  emits: ["update:modelValue", "update:index"],
  setup(__props) {
    const _props = __props;
    const props = useDefaults.useDefaults(_props, "BAccordion");
    const slots = vue.useSlots();
    const modelValue = vue.useModel(__props, "modelValue");
    const index = vue.useModel(__props, "index");
    const itemElementsArray = vue.ref([]);
    const updateItemElementsArray = () => {
      const itemElements = flattenFragments.flattenFragments(slots.default?.({}) ?? []);
      itemElementsArray.value = (Array.isArray(itemElements) ? itemElements : [itemElements]).filter(
        (item) => item.type === _sfc_main$1
      );
    };
    updateItemElementsArray();
    vue.watch(
      () => slots.default?.({}),
      () => {
        updateItemElementsArray();
        vue.nextTick(() => {
          sortAccordionItems();
        });
      }
    );
    const accordionItems = vue.shallowRef([]);
    const sortAccordionItems = () => {
      accordionItems.value = accordionItems.value.sort(
        (a, b) => dom.sortSlotElementsByPosition(vue.unref(a.el), vue.unref(b.el))
      );
      if (modelValue.value) {
        if (object.isReadOnlyArray(modelValue.value)) {
          const next = modelValue.value.map((id) => accordionItems.value.findIndex((item) => item.id === id)).filter((i) => i !== -1);
          if (next.length !== modelValue.value.length) {
            if (process.env.NODE_ENV === "development") {
              console.warn("[BAccordion] Unknown item id in v-model:", modelValue.value);
            }
          }
          index.value = next;
        } else {
          const idx = accordionItems.value.findIndex((item) => item.id === modelValue.value);
          if (idx !== -1) index.value = idx;
        }
      } else if (index.value !== void 0) {
        modelValue.value = object.isReadOnlyArray(index.value) ? index.value.map((idx) => accordionItems.value[idx]?.id) : accordionItems.value[index.value]?.id;
      }
    };
    const computedId = useId.useId(() => props.id, "accordion");
    const computedClasses = vue.computed(() => ({
      "accordion-flush": props.flush
    }));
    const areEqual = (a, b) => {
      if (Array.isArray(a) && Array.isArray(b)) {
        return a.length === b.length && a.every((item, index2) => item === b[index2]);
      }
      return a === b;
    };
    vue.watch(index, (newValue, oldValue) => {
      if (areEqual(newValue, oldValue)) return;
      if (index.value === void 0) {
        modelValue.value = void 0;
        return;
      }
      if (!props.free) {
        const idx = !object.isReadOnlyArray(index.value) ? index.value : index.value?.[0];
        if (accordionItems.value[idx]?.id) {
          if (modelValue.value !== accordionItems.value[idx]?.id) {
            modelValue.value = accordionItems.value[idx]?.id;
          }
        } else {
          vue.nextTick(() => {
            index.value = void 0;
          });
        }
      } else {
        if (object.isReadOnlyArray(index.value)) {
          const newValue2 = index.value.map((item) => accordionItems.value[item]?.id);
          if (!areEqual(newValue2, modelValue.value)) {
            modelValue.value = newValue2;
          }
        } else {
          const newValue2 = accordionItems.value[index.value]?.id;
          if (newValue2 === void 0) {
            vue.nextTick(() => {
              index.value = void 0;
            });
            return;
          }
          if (!areEqual(newValue2, modelValue.value)) {
            modelValue.value = newValue2;
          }
        }
      }
    });
    vue.watch(
      modelValue,
      (newValue, oldValue) => {
        if (areEqual(newValue, oldValue)) return;
        if (modelValue.value === void 0) {
          index.value = void 0;
          return;
        }
        if (!props.free) {
          const idx = accordionItems.value.findIndex(
            (item) => item.id === (!object.isReadOnlyArray(modelValue.value) ? modelValue.value : modelValue.value?.[0])
          );
          if (idx !== -1) {
            if (index.value !== idx) {
              index.value = idx;
            }
          } else {
            vue.nextTick(() => {
              modelValue.value = void 0;
            });
          }
        } else if (props.free) {
          if (object.isReadOnlyArray(modelValue.value)) {
            const idxes = modelValue.value.map((value) => accordionItems.value.findIndex((item) => item.id === value)).filter((index2) => index2 !== -1);
            if (idxes.length > 0) {
              if (!areEqual(idxes, index.value)) {
                index.value = idxes;
              }
            } else {
              vue.nextTick(() => {
                modelValue.value = void 0;
              });
            }
          } else {
            const newValue2 = accordionItems.value.findIndex((item) => item.id === modelValue.value);
            if (!areEqual(newValue2, index.value)) {
              index.value = newValue2;
            }
          }
        }
      },
      { deep: true }
    );
    vue.watch(
      () => props.free,
      (free) => {
        if (modelValue.value) {
          if (!free && object.isReadOnlyArray(modelValue.value)) {
            modelValue.value = modelValue.value[0];
          } else if (free && !object.isReadOnlyArray(modelValue.value)) {
            modelValue.value = [modelValue.value];
          }
        }
      }
    );
    vue.provide(keys.accordionInjectionKey, {
      openItem: vue.readonly(modelValue),
      free: vue.toRef(() => props.free),
      initialAnimation: vue.toRef(() => props.initialAnimation),
      lazy: vue.toRef(() => props.lazy),
      unmountLazy: vue.toRef(() => props.unmountLazy),
      setOpenItem: (id) => {
        if (props.free && !object.isReadOnlyArray(modelValue.value)) {
          if (modelValue.value !== void 0) {
            modelValue.value = [modelValue.value, id];
          } else {
            modelValue.value = [id];
          }
          return;
        }
        if (!props.free && object.isReadOnlyArray(modelValue.value)) {
          modelValue.value = id;
          return;
        }
        if (object.isReadOnlyArray(modelValue.value)) {
          if (!modelValue.value.includes(id)) {
            modelValue.value = [...modelValue.value, id];
          }
        } else {
          modelValue.value = id;
        }
      },
      setCloseItem: (id) => {
        if (!props.free && object.isReadOnlyArray(modelValue.value)) {
          modelValue.value = void 0;
          return;
        }
        if (object.isReadOnlyArray(modelValue.value)) {
          const next = modelValue.value.filter((item) => item !== id);
          modelValue.value = next.length ? next : void 0;
        } else {
          if (modelValue.value === id) {
            modelValue.value = void 0;
          }
        }
      },
      registerAccordionItem: (id, el) => {
        accordionItems.value = [...accordionItems.value, { id, el }];
        if (accordionItems.value.length === itemElementsArray.value.length) {
          sortAccordionItems();
        }
      },
      unregisterAccordionItem: (id) => {
        accordionItems.value = accordionItems.value.filter((item) => item.id !== id);
      }
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock("div", {
        id: vue.unref(computedId),
        class: vue.normalizeClass(["accordion", computedClasses.value])
      }, [
        vue.renderSlot(_ctx.$slots, "default")
      ], 10, _hoisted_1);
    };
  }
});
exports._sfc_main = _sfc_main;
exports._sfc_main$1 = _sfc_main$1;
//# sourceMappingURL=BAccordion.vue_vue_type_script_setup_true_lang-3H4-t81Q.js.map
