import { r as registerInstance, h, H as Host } from './index-c269755a.js';
import { c as createSvg, g as getSvgContent } from './getSvgContent-db128b44.js';

function getGlobal() {
    return typeof window !== 'undefined'
        ? window
        : typeof global !== 'undefined'
            ? global
            : typeof self !== 'undefined'
                ? self
                : { vocadsIcons: undefined, vocadsIconsRegistered: false };
}

function getIconsBundle() {
    if (typeof getGlobal().vocadsIcons !== undefined) {
        return getGlobal().vocadsIcons;
    }
    return;
}
function hasIconsBundleBeenRegistered() {
    return getGlobal().vocadsIconsRegistered;
}

const teliaIconCss = ".telia-icon{display:inline-block}.telia-icon__container{display:block;height:inherit}.telia-icon svg{display:block}.telia-icon--sm{height:calc(1.6rem * var(--voca-rem-multiplier));min-width:calc(1.6rem * var(--voca-rem-multiplier));width:calc(1.6rem * var(--voca-rem-multiplier))}.telia-icon--md{height:calc(2.4rem * var(--voca-rem-multiplier));min-width:calc(2.4rem * var(--voca-rem-multiplier));width:calc(2.4rem * var(--voca-rem-multiplier))}.telia-icon--lg{height:calc(3.2rem * var(--voca-rem-multiplier));min-width:calc(3.2rem * var(--voca-rem-multiplier));width:calc(3.2rem * var(--voca-rem-multiplier))}";

const TeliaIcon = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    /** Icon size */
    this.size = 'md';
    /** Describe unclear icon context for better accessibility support. */
    this.allyTitle = null;
    /** Tracking id is used to identify and count Component usage */
    this.dataTrackingId = 'telia-icon';
  }
  /**
   * Returns svg string from svg property or svg string from icons bundle if icons bundle is registered
   * @private
   * @returns string
   */
  getSvgString() {
    if (this.svg) {
      return this.svg;
    }
    if (hasIconsBundleBeenRegistered() && this.name) {
      const icons = getIconsBundle();
      return icons[this.name] ? icons[this.name].svg : '';
    }
    if (this.name) {
      console.warn(this.name, 'Icons bundle is not registered and will not be rendered. Check if you have registered icons bundle or use svg property');
    }
    return '';
  }
  render() {
    let svgIconString = this.getSvgString();
    let svgAttributes = [{ name: 'viewBox', value: '0 0 64 64' }];
    // If title is defined, title is linked to svg. Otherwise svg is hidden from screen readers.
    if (this.allyTitle) {
      svgAttributes = [...svgAttributes, { name: 'role', value: 'img' }];
    }
    else {
      svgAttributes = [
        ...svgAttributes,
        { name: 'aria-hidden', value: 'true' },
      ];
    }
    const svgString = createSvg({
      content: getSvgContent(svgIconString),
      attributes: svgAttributes,
      title: this.allyTitle,
    });
    return (h(Host, { class: `telia-icon telia-icon--${this.size}` }, h("span", { "aria-label": this.allyTitle, class: "telia-icon__container", innerHTML: svgString }), h("telia-vst", { dataTrackingId: this.dataTrackingId })));
  }
};
TeliaIcon.style = teliaIconCss;

export { TeliaIcon as telia_icon };
