import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';

const bsProfileDetailsCss = "bs-profile-details .bs-profile-details{color:var(--bs-ink-light);font-size:var(--bs-text-sm)}bs-profile-details .bs-profile-details>:where(*){display:block}bs-profile-details .bs-profile-details>:where(*:first-child){--profile-name-color:var(--bs-ink-base);color:var(--profile-name-color)}";

const BsProfileDetails = /*@__PURE__*/ proxyCustomElement(class BsProfileDetails extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.profileName = undefined;
    this.company = undefined;
    this.jobTitle = undefined;
    this.email = undefined;
  }
  render() {
    return (h(Host, null, h("div", { class: "bs-profile-details" }, h("span", { "data-size": "sm", "data-weight": "bold" }, this.profileName), this.company && h("span", { "data-weight": "bold" }, this.company), this.jobTitle && h("span", null, this.jobTitle), this.email && h("span", null, this.email))));
  }
  static get style() { return bsProfileDetailsCss; }
}, [0, "bs-profile-details", {
    "profileName": [1, "profile-name"],
    "company": [1],
    "jobTitle": [1, "job-title"],
    "email": [1]
  }]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["bs-profile-details"];
  components.forEach(tagName => { switch (tagName) {
    case "bs-profile-details":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, BsProfileDetails);
      }
      break;
  } });
}

export { BsProfileDetails as B, defineCustomElement as d };

//# sourceMappingURL=bs-profile-details2.js.map