'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-305226cb.js');
const index$1 = require('./index-f92a5850.js');
require('./v4-c23234d2.js');

const bsProfileDetailsCss = ".bs-profile-details,bs-profile-details{color:var(--bs-ink-light);font-size:var(--bs-text-sm)}.bs-profile-details>:where(*),bs-profile-details>:where(*){display:block}.bs-profile-details>:where(.bs-profile-name),bs-profile-details>:where(.bs-profile-name){color:var(--profile-name-color, var(--bs-ink-base));text-decoration:var(--profile-name-decoration, none)}.bs-profile-details>:where(button:first-child),bs-profile-details>:where(button:first-child){color:var(--profile-action-color, var(--bs-orange-warning));font-size:inherit}.bs-profile-details>:where([data-icon]),bs-profile-details>:where([data-icon]){align-items:normal;column-gap:0.5rem;cursor:pointer;display:flex;font-size:inherit}";

const BsProfileDetails = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.actionToggled = index.createEvent(this, "action-toggled", 7);
    this.profileName = undefined;
    this.company = undefined;
    this.jobTitle = undefined;
    this.email = undefined;
    this.action = undefined;
    this.actionIcon = undefined;
    this.miscMeta = undefined;
    this.miscMetaIcon = undefined;
  }
  handleActionToggle(e) {
    if (e.target.tagName !== 'BUTTON')
      return;
    e.preventDefault();
    e.stopPropagation();
    this.actionToggled.emit();
  }
  get actionButton() {
    if (!this.action)
      return null;
    const ActionIcon = this.actionIcon ? `bs-icon-${this.actionIcon}` : null;
    return (index.h("button", { "data-icon": true }, ActionIcon && index.h(ActionIcon, { size: "sm" }), this.action));
  }
  get metaText() {
    if (!this.miscMeta)
      return null;
    const MetaIcon = this.miscMetaIcon ? `bs-icon-${this.miscMetaIcon}` : null;
    return (index.h("span", { "data-icon": true }, MetaIcon && index.h(MetaIcon, { size: "sm" }), this.miscMeta));
  }
  render() {
    return (index.h(index.Host, { class: "bs-profile-details" }, this.actionButton, index.h("span", { class: "bs-profile-name", "data-size": "sm", "data-weight": "bold" }, this.profileName), this.company && index.h("span", { "data-weight": "bold" }, this.company), this.jobTitle && index.h("span", null, this.jobTitle), this.email && index.h("span", null, this.email), this.metaText));
  }
};
BsProfileDetails.style = bsProfileDetailsCss;

const bsProfileImgCss = ".bs-profile-img,bs-profile-img,.bs-profile-img:where([data-img-size^=\"sm\"]){--profile-size:2rem;--profile-text:var(--bs-text-sm);aspect-ratio:1/1;border-radius:50%;height:var(--profile-size);overflow:hidden;position:relative;width:var(--profile-size)}.bs-profile-img :where(img),bs-profile-img :where(img){height:100%;object-fit:cover;width:100%}.bs-profile-img:where([data-no-img]) img,bs-profile-img:where([data-no-img]) img{display:none}.bs-profile-img::before,bs-profile-img::before,.bs-profile-img::after,bs-profile-img::after{border-radius:50%;border-collapse:collapse;height:100%;inset:0;position:absolute;width:100%}.bs-profile-img::before,bs-profile-img::before{box-shadow:var(--bs-shadow-profilePhoto);content:\"\"}.bs-profile-img:where([data-no-img])::before,bs-profile-img:where([data-no-img])::before{display:none}.bs-profile-img:where([data-no-img])::after,bs-profile-img:where([data-no-img])::after{border:1px solid currentColor;color:var(--bs-blue-500);content:attr(data-initials);font-size:var(--profile-text);text-transform:uppercase;display:grid;place-items:center}.bs-profile-img:where([data-img-size^=\"xs\"]),bs-profile-img:where([data-img-size^=\"xs\"]){--profile-size:1.5rem;--profile-text:var(--bs-text-xs)}.bs-profile-img:where([data-img-size^=\"md\"]),bs-profile-img:where([data-img-size^=\"md\"]){--profile-size:3rem;--profile-text:var(--bs-text-md)}.bs-profile-img:where([data-img-size^=\"lg\"]),bs-profile-img:where([data-img-size^=\"lg\"]){--profile-size:4rem;--profile-text:var(--bs-text-lg)}.bs-profile-img:where([data-img-size^=\"xl\"]),bs-profile-img:where([data-img-size^=\"xl\"]){--profile-size:5.75rem;--profile-text:var(--bs-text-xl)}";

const BsProfileImg = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.src = undefined;
    this.size = undefined;
    this.initials = undefined;
    this.profileName = undefined;
    this.showImage = !!this.src;
  }
  render() {
    return (index.h(index.Host, { class: "bs-profile-img", "data-img-size": this.size, "data-initials": this.initials, "data-no-img": !this.showImage }, this.showImage && index.h("img", { src: this.src, alt: `${this.profileName} Profile Photo.`, onError: () => this.showImage = false })));
  }
};
BsProfileImg.style = bsProfileImgCss;

const bsProfileLayoutCss = "bs-profile-layout{}bs-profile-layout .bs-profile:where([data-layout]),bs-profile-layout .bs-profile:where([data-layout^=\"vertical\"]){display:grid;row-gap:0.5rem}bs-profile-layout .bs-profile:where([data-layout^=\"horizontal\"]){column-gap:1rem;grid-template-columns:auto 1fr;align-items:center}bs-profile-layout a.bs-profile:where([data-layout]){text-decoration:none}bs-profile-layout a.bs-profile:where([data-layout]){--profile-name-color:var(--bs-ink-blue)}bs-profile-layout a.bs-profile:where([data-layout]):hover{--profile-name-decoration:underline}";

const BsProfileLayout = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    /** Native attributes to pass through to the main element. */
    this.attrs = {};
    this.layout = 'vertical';
    this.href = undefined;
    this.passAttrs = '';
  }
  componentWillLoad() {
    this.attrs = index$1.getHostAttrs(this.hostEl, ['title', 'target', ...this.passAttrs.split(',')]);
  }
  render() {
    const TagName = this.href ? 'a' : 'div';
    return (index.h(index.Host, null, index.h(TagName, Object.assign({ href: this.href, class: "bs-profile", "data-layout": this.layout }, this.attrs), index.h("slot", null))));
  }
  get hostEl() { return index.getElement(this); }
};
BsProfileLayout.style = bsProfileLayoutCss;

exports.bs_profile_details = BsProfileDetails;
exports.bs_profile_img = BsProfileImg;
exports.bs_profile_layout = BsProfileLayout;

//# sourceMappingURL=bs-profile-details_3.cjs.entry.js.map