"use strict";
const vue = require("vue");
const useDefaults = require("./useDefaults-YXpmugKp.js");
const BSpinner_vue_vue_type_script_setup_true_lang = require("./BSpinner.vue_vue_type_script_setup_true_lang-CKRhsbDa.js");
const ConditionalWrapper_vue_vue_type_script_lang = require("./ConditionalWrapper.vue_vue_type_script_lang-CFfEbslT.js");
const useRadiusElementClasses = require("./useRadiusElementClasses-Dg5jsuJw.js");
const useColorVariantClasses = require("./useColorVariantClasses-BjkZZDqD.js");
const useTransitions = require("./useTransitions-C9Xv-y_E.js");
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "BOverlay",
  props: {
    bgColor: { default: void 0 },
    blur: { default: "2px" },
    fixed: { type: Boolean, default: false },
    noCenter: { type: Boolean, default: false },
    noFade: { type: Boolean, default: false },
    noSpinner: { type: Boolean, default: false },
    noWrap: { type: Boolean, default: false },
    opacity: { default: 0.85 },
    overlayTag: { default: "div" },
    show: { type: Boolean, default: false },
    spinnerSmall: { type: Boolean, default: false },
    spinnerType: { default: "border" },
    spinnerVariant: { default: void 0 },
    variant: { default: "light" },
    wrapTag: { default: "div" },
    zIndex: { default: 10 },
    rounded: { type: [Boolean, String, Number], default: false },
    roundedTop: { type: [Boolean, String, Number], default: void 0 },
    roundedBottom: { type: [Boolean, String, Number], default: void 0 },
    roundedStart: { type: [Boolean, String, Number], default: void 0 },
    roundedEnd: { type: [Boolean, String, Number], default: void 0 }
  },
  emits: ["click", "hidden", "shown"],
  setup(__props, { emit: __emit }) {
    const _props = __props;
    const props = useDefaults.useDefaults(_props, "BOverlay");
    const emit = __emit;
    const positionStyles = { top: 0, left: 0, bottom: 0, right: 0 };
    const fadeTransitions = useTransitions.useFadeTransition(() => !props.noFade);
    const radiusElementClasses = useRadiusElementClasses.useRadiusElementClasses(() => ({
      rounded: props.rounded,
      roundedTop: props.roundedTop,
      roundedBottom: props.roundedBottom,
      roundedStart: props.roundedStart,
      roundedEnd: props.roundedEnd
    }));
    const computedAriaBusy = vue.computed(() => props.show ? true : null);
    const spinnerAttrs = vue.computed(() => ({
      type: props.spinnerType,
      variant: props.spinnerVariant,
      small: props.spinnerSmall
    }));
    const overlayStyles = vue.computed(() => ({
      ...positionStyles,
      zIndex: props.zIndex || 10
    }));
    const overlayClasses = vue.computed(() => ({
      "position-absolute": !props.noWrap || !props.fixed,
      "position-fixed": props.noWrap && props.fixed
    }));
    const colorClasses = useColorVariantClasses.useColorVariantClasses(
      vue.computed(() => ({
        bgVariant: props.variant !== null && !props.bgColor ? props.variant : null
      }))
    );
    const blurClasses = vue.computed(() => [colorClasses.value, radiusElementClasses.value]);
    const blurStyles = vue.computed(() => ({
      ...positionStyles,
      opacity: props.opacity,
      backgroundColor: props.bgColor || void 0,
      backdropFilter: props.blur && !props.bgColor && (props.variant === "white" || props.variant === "transparent") ? `blur(${props.blur})` : void 0
    }));
    const spinWrapperStyles = vue.computed(
      () => props.noCenter ? positionStyles : {
        top: "50%",
        left: "50%",
        transform: "translateX(-50%) translateY(-50%)"
      }
    );
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createBlock(ConditionalWrapper_vue_vue_type_script_lang._sfc_main, {
        tag: vue.unref(props).wrapTag,
        class: "b-overlay-wrap position-relative",
        "aria-busy": computedAriaBusy.value,
        skip: vue.unref(props).noWrap
      }, {
        default: vue.withCtx(() => [
          vue.renderSlot(_ctx.$slots, "default"),
          vue.createVNode(vue.Transition, vue.mergeProps(vue.unref(fadeTransitions), {
            "enter-to-class": "show",
            name: "fade",
            onAfterEnter: _cache[1] || (_cache[1] = ($event) => emit("shown")),
            onAfterLeave: _cache[2] || (_cache[2] = ($event) => emit("hidden"))
          }), {
            default: vue.withCtx(() => [
              vue.unref(props).show ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(props).overlayTag), {
                key: 0,
                class: vue.normalizeClass(["b-overlay", overlayClasses.value]),
                style: vue.normalizeStyle(overlayStyles.value),
                onClick: _cache[0] || (_cache[0] = ($event) => emit("click", $event))
              }, {
                default: vue.withCtx(() => [
                  vue.createElementVNode("div", {
                    class: vue.normalizeClass(["position-absolute", blurClasses.value]),
                    style: vue.normalizeStyle(blurStyles.value)
                  }, null, 6),
                  vue.createElementVNode("div", {
                    class: "position-absolute",
                    style: vue.normalizeStyle(spinWrapperStyles.value)
                  }, [
                    vue.renderSlot(_ctx.$slots, "overlay", vue.normalizeProps(vue.guardReactiveProps(spinnerAttrs.value)), () => [
                      !vue.unref(props).noSpinner ? (vue.openBlock(), vue.createBlock(BSpinner_vue_vue_type_script_setup_true_lang._sfc_main, vue.normalizeProps(vue.mergeProps({ key: 0 }, spinnerAttrs.value)), null, 16)) : vue.createCommentVNode("", true)
                    ])
                  ], 4)
                ]),
                _: 3
              }, 8, ["class", "style"])) : vue.createCommentVNode("", true)
            ]),
            _: 3
          }, 16)
        ]),
        _: 3
      }, 8, ["tag", "aria-busy", "skip"]);
    };
  }
});
exports._sfc_main = _sfc_main;
//# sourceMappingURL=BOverlay.vue_vue_type_script_setup_true_lang-5_q-mgod.js.map
