import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
import { d as defineCustomElement$1 } from './telia-vst2.js';

const LinkVariant = {
  TEXT: 'text',
  STANDALONE: 'standalone',
};
Object.values(LinkVariant);

const StyleLinkVariant = Object.assign(Object.assign({}, LinkVariant), { NAVIGATION: 'navigation' });
Object.values(StyleLinkVariant);

const teliaStyleLinkCss = ".telia-style-link a{color:#5e0092;align-items:center;cursor:pointer;text-decoration:underline}.telia-style-link a:focus{outline:solid calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;outline-offset:0}.telia-style-link a:focus:not(:focus-visible){outline:0}.telia-style-link--text a:visited,.telia-style-link--standalone a:visited{color:#30004b;background-color:transparent}.telia-style-link--text a:hover,.telia-style-link--text a:active,.telia-style-link--standalone a:hover,.telia-style-link--standalone a:active{background-color:#fbf0ff}.telia-style-link--text:is(.telia-style-link--disable-visited) a:visited,.telia-style-link--standalone:is(.telia-style-link--disable-visited) a:visited{color:#5e0092}.telia-style-link--silent:is(.telia-style-link--disable-visited) a:visited{color:inherit}.telia-style-link--text:not(.telia-style-link--disable-visited) a:active,.telia-style-link--standalone:not(.telia-style-link--disable-visited) a:active,.telia-style-link--text:is(.telia-style-link--disable-visited) a:active,.telia-style-link--standalone:is(.telia-style-link--disable-visited) a:active{outline:solid calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;outline-offset:0}.telia-style-link--standalone a{font-family:\"TeliaSans\", Helvetica, Arial, \"Lucida Grande\", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;display:inline-block;padding:calc(1rem * var(--voca-rem-multiplier)) 0}.telia-style-link--navigation a{font-family:\"TeliaSans\", Helvetica, Arial, \"Lucida Grande\", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;font-weight:500;align-items:center;display:flex;text-decoration:none}.telia-style-link--navigation a:hover{text-decoration:underline}.telia-style-link--navigation a:hover.telia-style-link--dark-bg{background-color:transparent}.telia-style-link--dark-bg a{color:#de99ff}.telia-style-link--dark-bg a:visited,.telia-style-link--dark-bg a:visited:hover,.telia-style-link--dark-bg a:visited:active{color:#edc8ff}.telia-style-link--dark-bg a:hover{color:#de99ff;background-color:rgba(255, 255, 255, 0.1)}.telia-style-link--dark-bg a:active{color:#edc8ff;background-color:rgba(255, 255, 255, 0.1)}.telia-style-link--dark-bg:is(.telia-style-link--navigation) a{color:#fbf0ff}.telia-style-link--dark-bg:is(.telia-style-link--navigation) a:hover,.telia-style-link--dark-bg:is(.telia-style-link--navigation) a:active{background-color:transparent}.telia-style-link--dark-bg:is(.telia-style-link--navigation) a:hover{color:#edc8ff}.telia-style-link--dark-bg:is(.telia-style-link--navigation) a:active{color:#de99ff}.telia-style-link--dark-bg:is(.telia-style-link--disable-visited) a:visited,.telia-style-link--dark-bg:is(.telia-style-link--disable-visited) a:visited:hover,.telia-style-link--dark-bg:is(.telia-style-link--disable-visited) a:visited:active{color:#de99ff}.telia-style-link--dark-bg:is(.telia-style-link--disable-visited):is(.telia-style-link--navigation) a:visited{color:#fbf0ff}.telia-style-link--dark-bg:is(.telia-style-link--disable-visited):is(.telia-style-link--navigation) a:visited:hover{color:#edc8ff}.telia-style-link--dark-bg:is(.telia-style-link--disable-visited):is(.telia-style-link--navigation) a:visited:active{color:#de99ff}.telia-style-link--silent a{background-color:inherit;color:inherit;height:100%;text-decoration:none}.telia-style-link--silent a:hover,.telia-style-link--silent a:focus,.telia-style-link--silent a:active{background-color:inherit;color:inherit}.telia-style-link--silent a:focus{outline:0}.telia-style-link--silent a:focus ::slotted(*){outline:solid calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;outline-offset:calc(0.2rem * var(--voca-rem-multiplier))}.telia-style-link--ensure-click-area,.telia-style-link--ensure-click-area a{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))}";

const TeliaStyleLink = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    /** A silent link is intended to wrap an element
     * to make it a link but not add any styling
     * except for the pointer cursor and focus style. */
    this.silent = false;
    /**
     * Determines if link is displayed on its own line
     * (standalone) or within the current text content
     * (text).
     */
    this.variant = StyleLinkVariant.TEXT;
    /** Disables visited styling */
    this.disableVisited = false;
    /**
     * When used on a dark background, set this
     * property to true. This will change color of text
     * and hover to something suitable.
     */
    this.darkBackground = false;
    /** Tracking id is used to identify and count Component usage */
    /**
     * 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;
    this.dataTrackingId = 'telia-style-link';
  }
  render() {
    const componentClass = 'telia-style-link';
    const linkClasses = {
      [componentClass]: true,
      [`${componentClass}--${this.variant}`]: true,
      [`${componentClass}--silent`]: this.silent,
      [`${componentClass}--dark-bg`]: this.darkBackground,
      [`${componentClass}--navigation-dark-bg`]: this.darkBackground && this.variant === 'navigation',
      [`${componentClass}--disable-visited`]: this.disableVisited || this.silent,
      [`${componentClass}--ensure-click-area`]: this.ensureClickArea,
    };
    return (h(Host, { class: linkClasses }, h("slot", null), h("telia-vst", { dataTrackingId: this.dataTrackingId })));
  }
  static get style() { return teliaStyleLinkCss; }
}, [4, "telia-style-link", {
    "silent": [4],
    "variant": [1],
    "dataTestid": [1, "data-testid"],
    "disableVisited": [4, "disable-visited"],
    "darkBackground": [4, "dark-background"],
    "ensureClickArea": [4, "ensure-click-area"]
  }]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["telia-style-link", "telia-vst"];
  components.forEach(tagName => { switch (tagName) {
    case "telia-style-link":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, TeliaStyleLink);
      }
      break;
    case "telia-vst":
      if (!customElements.get(tagName)) {
        defineCustomElement$1();
      }
      break;
  } });
}
defineCustomElement();

export { LinkVariant as L, TeliaStyleLink as T, defineCustomElement as d };
