"use strict";
const vue = require("vue");
const keys = require("./keys-D70E9HED.js");
const BLink_vue_vue_type_script_setup_true_lang = require("./BLink.vue_vue_type_script_setup_true_lang-B4Fy2Ncx.js");
const BBadge_vue_vue_type_script_setup_true_lang = require("./BBadge.vue_vue_type_script_setup_true_lang-BFKdaqz3.js");
const dom = require("./dom-BgEUZpKg.js");
const useNumberishToStyle = require("./useNumberishToStyle-ipmFoR-c.js");
const useRadiusElementClasses = require("./useRadiusElementClasses-Dg5jsuJw.js");
const useColorVariantClasses = require("./useColorVariantClasses-BjkZZDqD.js");
const useDefaults = require("./useDefaults-YXpmugKp.js");
const index = require("./index-JJEBhaXq.js");
const _hoisted_1 = {
  key: 0,
  class: "b-avatar-custom"
};
const _hoisted_2 = {
  key: 1,
  class: "b-avatar-img"
};
const _hoisted_3 = ["src", "alt"];
const _hoisted_4 = {
  key: 3,
  class: "b-avatar-img"
};
const FONT_SIZE_SCALE = 0.4;
const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
  __name: "BAvatar",
  props: {
    alt: { default: "avatar" },
    badge: { type: [Boolean, String], default: false },
    badgeBgVariant: { default: null },
    badgePlacement: { default: "bottom-end" },
    badgeTextVariant: { default: null },
    badgeVariant: { default: "primary" },
    badgePill: { type: Boolean, default: false },
    badgeDotIndicator: { type: Boolean, default: false },
    button: { type: Boolean, default: false },
    buttonType: { default: "button" },
    size: { default: void 0 },
    square: { type: Boolean, default: false },
    src: { default: void 0 },
    text: { default: void 0 },
    active: { type: Boolean, default: void 0 },
    activeClass: { default: void 0 },
    disabled: { type: Boolean, default: void 0 },
    exactActiveClass: { default: void 0 },
    href: { default: void 0 },
    noRel: { type: Boolean },
    opacity: { default: void 0 },
    opacityHover: { default: void 0 },
    prefetch: { type: Boolean },
    prefetchOn: {},
    noPrefetch: { type: Boolean },
    prefetchedClass: {},
    rel: { default: void 0 },
    replace: { type: Boolean, default: void 0 },
    routerComponentName: { default: void 0 },
    stretched: { type: Boolean, default: false },
    target: { default: void 0 },
    to: {},
    underlineOffset: { default: void 0 },
    underlineOffsetHover: { default: void 0 },
    underlineOpacity: { default: void 0 },
    underlineOpacityHover: { default: void 0 },
    underlineVariant: { default: void 0 },
    variant: { default: "secondary" },
    bgVariant: { default: null },
    textVariant: { default: null },
    rounded: { type: [Boolean, String, Number], default: "circle" },
    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", "img-error"],
  setup(__props, { emit: __emit }) {
    const _props = __props;
    const props = useDefaults.useDefaults(_props, "BAvatar");
    const emit = __emit;
    const slots = vue.useSlots();
    const localSrc = vue.ref(props.src);
    vue.watch(
      () => props.src,
      (value) => {
        localSrc.value = value;
      }
    );
    const { computedLink, computedLinkProps } = BLink_vue_vue_type_script_setup_true_lang.useBLinkHelper(props);
    const parentData = vue.inject(keys.avatarGroupInjectionKey, null);
    const SIZES = Object.freeze([
      null,
      ...Object.keys({
        lg: null,
        md: null,
        sm: null
      })
    ]);
    const BADGE_FONT_SIZE_SCALE = FONT_SIZE_SCALE * 0.7;
    const hasDefaultSlot = vue.computed(() => !dom.isEmptySlot(slots.default));
    const hasBadgeSlot = vue.computed(() => !dom.isEmptySlot(slots.badge));
    const showBadge = vue.computed(() => !!props.badge || props.badge === "" || hasBadgeSlot.value);
    const computedSquare = vue.computed(() => parentData?.square.value || props.square);
    const computedSize = useNumberishToStyle.useNumberishToStyle(() => parentData?.size.value ?? props.size);
    const computedSizeIsLiteralSize = vue.computed(
      () => !!computedSize.value && SIZES.includes(computedSize.value)
    );
    const computedVariant = vue.computed(() => parentData?.variant.value ?? props.variant);
    const computedRounded = vue.computed(() => parentData?.rounded.value ?? props.rounded);
    const computedRoundedTop = vue.computed(() => parentData?.roundedTop.value ?? props.roundedTop);
    const computedRoundedBottom = vue.computed(() => parentData?.roundedBottom.value ?? props.roundedBottom);
    const computedRoundedStart = vue.computed(() => parentData?.roundedStart.value ?? props.roundedStart);
    const computedRoundedEnd = vue.computed(() => parentData?.roundedEnd.value ?? props.roundedEnd);
    const radiusElementClasses = useRadiusElementClasses.useRadiusElementClasses(() => ({
      rounded: computedRounded.value,
      roundedTop: computedRoundedTop.value,
      roundedBottom: computedRoundedBottom.value,
      roundedStart: computedRoundedStart.value,
      roundedEnd: computedRoundedEnd.value
    }));
    const badgeText = vue.computed(() => props.badge === true ? "" : props.badge);
    const badgeImplicitlyDot = vue.computed(() => !badgeText.value && !hasBadgeSlot.value);
    const colorClasses = useColorVariantClasses.useColorVariantClasses(() => ({
      bgVariant: parentData?.bgVariant.value ?? props.bgVariant,
      textVariant: parentData?.textVariant.value ?? props.textVariant,
      variant: computedVariant.value
    }));
    const computedClasses = vue.computed(() => [
      colorClasses.value,
      // Square overwrites all else
      computedSquare.value === true ? void 0 : radiusElementClasses.value,
      {
        [`b-avatar-${computedSize.value}`]: computedSizeIsLiteralSize.value && computedSize.value !== "md",
        [`btn-${computedVariant.value}`]: props.button ? computedVariant.value !== null : false,
        "badge": !props.button && computedVariant.value !== null && hasDefaultSlot.value,
        "btn": props.button,
        // Square is the same as rounded-0 class
        "rounded-0": computedSquare.value === true
      }
    ]);
    const badgeStyle = vue.computed(() => ({
      fontSize: (!computedSizeIsLiteralSize.value ? `calc(${computedSize.value} * ${BADGE_FONT_SIZE_SCALE})` : "") || ""
    }));
    const textFontStyle = vue.computed(() => {
      const fontSize = !computedSizeIsLiteralSize.value ? `calc(${computedSize.value} * ${FONT_SIZE_SCALE})` : null;
      return fontSize ? { fontSize } : {};
    });
    const marginStyle = vue.computed(() => {
      const overlapScale = parentData?.overlapScale?.value || 0;
      const value = computedSize.value && overlapScale ? `calc(${computedSize.value} * -${overlapScale})` : null;
      return value ? { marginLeft: value, marginRight: value } : {};
    });
    const computedTag = vue.computed(() => computedLink.value ? BLink_vue_vue_type_script_setup_true_lang._sfc_main : props.button ? "button" : "span");
    const computedStyle = vue.computed(() => ({
      ...marginStyle.value,
      ...!computedSizeIsLiteralSize.value ? {
        width: computedSize.value,
        height: computedSize.value
      } : void 0
    }));
    const clicked = (e) => {
      if (!props.disabled && (computedLink.value || props.button)) emit("click", e);
    };
    const onImgError = (e) => {
      localSrc.value = void 0;
      emit("img-error", e);
    };
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(computedTag.value), vue.mergeProps({
        class: ["b-avatar", computedClasses.value],
        style: computedStyle.value
      }, vue.unref(computedLinkProps), {
        type: vue.unref(props).button && !vue.unref(computedLink) ? vue.unref(props).buttonType : void 0,
        disabled: vue.unref(props).disabled || null,
        variant: null,
        onClick: clicked
      }), {
        default: vue.withCtx(() => [
          hasDefaultSlot.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1, [
            vue.renderSlot(_ctx.$slots, "default")
          ])) : !!localSrc.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2, [
            vue.createElementVNode("img", {
              src: localSrc.value,
              alt: vue.unref(props).alt,
              onError: onImgError
            }, null, 40, _hoisted_3)
          ])) : !!vue.unref(props).text ? (vue.openBlock(), vue.createElementBlock("span", {
            key: 2,
            class: "b-avatar-text",
            style: vue.normalizeStyle(textFontStyle.value)
          }, vue.toDisplayString(vue.unref(props).text), 5)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, [..._cache[0] || (_cache[0] = [
            vue.createElementVNode("svg", {
              xmlns: "http://www.w3.org/2000/svg",
              width: "80%",
              height: "80%",
              fill: "currentColor",
              class: "bi bi-person-fill",
              viewBox: "0 0 16 16"
            }, [
              vue.createElementVNode("path", { d: "M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6" })
            ], -1)
          ])])),
          showBadge.value ? (vue.openBlock(), vue.createBlock(BBadge_vue_vue_type_script_setup_true_lang._sfc_main, {
            key: 4,
            pill: vue.unref(props).badgePill,
            "dot-indicator": vue.unref(props).badgeDotIndicator || badgeImplicitlyDot.value,
            variant: vue.unref(props).badgeVariant,
            "bg-variant": vue.unref(props).badgeBgVariant,
            "text-variant": vue.unref(props).badgeTextVariant,
            style: vue.normalizeStyle(badgeStyle.value),
            placement: vue.unref(props).badgePlacement
          }, {
            default: vue.withCtx(() => [
              vue.renderSlot(_ctx.$slots, "badge", {}, () => [
                vue.createTextVNode(vue.toDisplayString(badgeText.value), 1)
              ])
            ]),
            _: 3
          }, 8, ["pill", "dot-indicator", "variant", "bg-variant", "text-variant", "style", "placement"])) : vue.createCommentVNode("", true)
        ]),
        _: 3
      }, 16, ["class", "style", "type", "disabled"]);
    };
  }
});
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "BAvatarGroup",
  props: {
    overlap: { default: 0.3 },
    size: { default: void 0 },
    square: { type: Boolean, default: false },
    tag: { default: "div" },
    variant: { default: null },
    bgVariant: { default: null },
    textVariant: { default: null },
    rounded: { type: [Boolean, String, Number], default: "circle" },
    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 }
  },
  setup(__props) {
    const _props = __props;
    const props = useDefaults.useDefaults(_props, "BAvatarGroup");
    const overlapNumber = index.useToNumber(() => props.overlap);
    const computedSize = useNumberishToStyle.useNumberishToStyle(() => props.size);
    const overlapScale = vue.computed(() => Math.min(Math.max(overlapNumber.value, 0), 1) / 2);
    const paddingStyle = vue.computed(() => {
      const value = computedSize.value ? `calc(${computedSize.value} * ${overlapScale.value})` : null;
      return value ? { paddingLeft: value, paddingRight: value } : {};
    });
    vue.provide(keys.avatarGroupInjectionKey, {
      overlapScale,
      size: vue.toRef(() => props.size),
      square: vue.toRef(() => props.square),
      rounded: vue.toRef(() => props.rounded),
      roundedTop: vue.toRef(() => props.roundedTop),
      roundedBottom: vue.toRef(() => props.roundedBottom),
      roundedStart: vue.toRef(() => props.roundedStart),
      roundedEnd: vue.toRef(() => props.roundedEnd),
      variant: vue.toRef(() => props.variant),
      bgVariant: vue.toRef(() => props.bgVariant),
      textVariant: vue.toRef(() => props.textVariant)
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(props).tag), {
        class: "b-avatar-group",
        role: "group"
      }, {
        default: vue.withCtx(() => [
          vue.createElementVNode("div", {
            class: "b-avatar-group-inner",
            style: vue.normalizeStyle(paddingStyle.value)
          }, [
            vue.renderSlot(_ctx.$slots, "default")
          ], 4)
        ]),
        _: 3
      });
    };
  }
});
exports._sfc_main = _sfc_main$1;
exports._sfc_main$1 = _sfc_main;
//# sourceMappingURL=BAvatarGroup.vue_vue_type_script_setup_true_lang-DOL88bZ2.js.map
