import { r as registerInstance, h, H as Host } from './index-92f6d7ee.js';

const bsTooltipCss = ".bs-tooltip{display:inline-block;position:relative}.bs-tooltip :where(.bs-tooltip-text){align-items:center;background-color:var(--bs-bg-base-elevated);border-radius:4px;box-shadow:var(--bs-shadow-contentLowCenter);color:var(--bs-violet-base);display:flex;font-size:var(--bs-text-sm);justify-content:center;max-width:16rem;min-width:4rem;opacity:0;padding-bottom:0.25rem;padding-left:0.5rem;padding-right:0.5rem;padding-top:0.25rem;position:absolute;transform:scale(0);transition-duration:75ms;transition-property:opacity, transform;transition-timing-function:ease-in-out;width:max-content;z-index:999}.bs-tooltip:where(:not([data-position])) :where(.bs-tooltip-text),.bs-tooltip:where([data-position=\"top\"]) :where(.bs-tooltip-text){bottom:calc(100% + 0.5rem);left:50%;transform-origin:bottom center;transform:translateX(-50%) scale(0)}:where(.bs-tooltip:not([data-position])):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"top\"]):hover :where(.bs-tooltip-text),:where(.bs-tooltip:not([data-position])):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"top\"]):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip:not([data-position]))[data-shown] :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"top\"])[data-shown] :where(.bs-tooltip-text){opacity:1;transform:translateX(-50%) scale(1)}.bs-tooltip:where([data-position=\"bottom\"]) :where(.bs-tooltip-text){left:50%;top:calc(100% + 0.5rem);transform-origin:top center;transform:translateX(-50%) scale(0)}:where(.bs-tooltip[data-position=\"bottom\"]):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"bottom\"]):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"bottom\"])[data-shown] :where(.bs-tooltip-text){opacity:1;transform:translateX(-50%) scale(1)}.bs-tooltip:where([data-position=\"left\"]) :where(.bs-tooltip-text){right:calc(100% + 0.5rem);top:50%;transform-origin:center right;transform:translateY(-50%) scale(0)}:where(.bs-tooltip[data-position=\"left\"]):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"left\"]):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"left\"])[data-shown] :where(.bs-tooltip-text){opacity:1;transform:translateY(-50%) scale(1)}.bs-tooltip:where([data-position=\"right\"]) :where(.bs-tooltip-text){left:calc(100% + 0.5rem);top:50%;transform-origin:center left;transform:translateY(-50%) scale(0)}:where(.bs-tooltip[data-position=\"right\"]):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"right\"]):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"right\"])[data-shown] :where(.bs-tooltip-text){opacity:1;transform:translateY(-50%) scale(1)}.bs-tooltip:where([data-position=\"top-left\"]) :where(.bs-tooltip-text){bottom:calc(100% + 0.5rem);right:calc(100% + 0.5rem);transform-origin:bottom right}.bs-tooltip:where([data-position=\"top-right\"]) :where(.bs-tooltip-text){bottom:calc(100% + 0.5rem);left:calc(100% + 0.5rem);transform-origin:bottom left}.bs-tooltip:where([data-position=\"bottom-left\"]) :where(.bs-tooltip-text){right:calc(100% + 0.5rem);top:calc(100% + 0.5rem);transform-origin:top right}.bs-tooltip:where([data-position=\"bottom-right\"]) :where(.bs-tooltip-text){left:calc(100% + 0.5rem);top:calc(100% + 0.5rem);transform-origin:top left}:where(.bs-tooltip[data-position=\"top-left\"]):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"top-right\"]):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"bottom-left\"]):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"bottom-right\"]):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"top-left\"]):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"top-right\"]):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"bottom-left\"]):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"bottom-right\"]):focus-within :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"top-left\"])[data-shown] :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"top-right\"])[data-shown] :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"bottom-left\"])[data-shown] :where(.bs-tooltip-text),:where(.bs-tooltip[data-position=\"bottom-right\"])[data-shown] :where(.bs-tooltip-text){opacity:1;transform:scale(1)}:where(.bs-tooltip[data-disabled]:not([data-shown])):hover :where(.bs-tooltip-text),:where(.bs-tooltip[data-disabled]:not([data-shown])):focus-within :where(.bs-tooltip-text){opacity:0;transform:scale(0)}bs-tooltip{display:inline-block}bs-tooltip .escaped{opacity:0;transform:scale(0.5)}bs-tooltip .escaped-x{opacity:0;transform:translateX(-50%) scale(0.5)}bs-tooltip .escaped-y{opacity:0;transform:translateY(-50%) scale(0.5)}";

const BsTooltip = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.tooltipId = undefined;
    this.content = undefined;
    this.position = undefined;
    this.isHoverOrFocused = undefined;
    this.isEscaped = undefined;
  }
  handleEnterOrFocus() {
    this.isHoverOrFocused = true;
  }
  handleLeaveOrFocusOut() {
    this.isHoverOrFocused = false;
    // Also reset escaped so it shows again on hover/focus
    this.isEscaped = false;
  }
  /** Handle escape key closing the tooltip */
  handleEscape(event) {
    // Only "close" the tooltip on "Escape" if it's showing
    // This check is needed otherwise *ALL* tooltips on the page
    // would be marked as "isEscaped" causing undesirable side-effects
    if (this.isHoverOrFocused && event.key === 'Escape') {
      this.isHoverOrFocused = false;
      this.isEscaped = true;
    }
  }
  /** Get tooltip text class based on current state */
  getTooltipTextClass() {
    let cssClass = 'bs-tooltip-text';
    if (this.isEscaped) {
      // Different positions have different translateX/Y style
      if (this.position === undefined ||
        this.position === 'top' ||
        this.position === 'bottom') {
        cssClass += ' escaped-x';
      }
      else if (this.position === 'left' || this.position === 'right') {
        cssClass += ' escaped-y';
      }
      else {
        cssClass += ' escaped';
      }
    }
    return cssClass;
  }
  render() {
    return (h(Host, null, h("div", { class: "bs-tooltip", "data-position": this.position || undefined }, h("div", { "data-slot": true }, h("slot", null)), h("div", { class: this.getTooltipTextClass(), id: this.tooltipId, role: "tooltip" }, this.content))));
  }
};
BsTooltip.style = bsTooltipCss;

export { BsTooltip as bs_tooltip };

//# sourceMappingURL=bs-tooltip.entry.js.map