'use strict';

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

const index = require('./index-b499856a.js');

const teliaLinkImageCss = ".telia-link-image:hover{color:#5e0092}.telia-link-image:active{color:#30004b}.telia-link-image__slotwrapper{display:inline-block}.telia-link-image__slotwrapper--ensure-click-area{align-items:center;display:flex;justify-content:center;min-height:calc(4.8rem * var(--voca-rem-multiplier));min-width:calc(4.8rem * var(--voca-rem-multiplier))}.telia-link-image--dark-bg:hover{color:#edc8ff}.telia-link-image--dark-bg:active{color:#de99ff}";

const TeliaLinkImage = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    /**
     * Set to true when used on a dark background.
     * This will affect color of the svg when interacting with it.
     */
    this.darkBackground = false;
    /**
     * Disables visited styling, defaults to true. Only some image types
     * support styling with color, which is the technique used here.
     * */
    this.disableVisited = true;
    /**
     * This sets a minimum size on the clickable area of the link. Please note
     * it also changes display value to flex, meaning its container will behave
     * like a block element. You can wrap this component in a flex container
     * for additional layout control.
     */
    this.ensureClickArea = false;
    /** Tracking id is used to identify and count Component usage */
    this.dataTrackingId = 'telia-link-image';
  }
  render() {
    const componentClass = 'telia-link-image';
    const linkClass = {
      [componentClass]: true,
      [`${componentClass}--dark-bg`]: this.darkBackground,
    };
    const slotWrapperClass = {
      [`${componentClass}__slotwrapper`]: true,
      [`${componentClass}__slotwrapper--ensure-click-area`]: this.ensureClickArea,
    };
    return (index.h(index.Host, null, index.h("telia-link", { silent: true, href: this.htmlHref, "data-testid": this.dataTestid, "link-title": this.linkText, class: linkClass, "disable-visited": this.disableVisited, "dark-background": this.darkBackground }, index.h("div", { class: slotWrapperClass }, index.h("slot", null), index.h("telia-visually-hidden", null, this.linkText))), index.h("telia-vst", { dataTrackingId: this.dataTrackingId })));
  }
};
TeliaLinkImage.style = teliaLinkImageCss;

exports.telia_link_image = TeliaLinkImage;
