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

const teliaVisuallyHiddenCss = ".telia-visually-hidden:not(:focus):not(:focus-within):not(:active){border:0;clip:rect(calc(0.1rem * var(--voca-rem-multiplier)) calc(0.1rem * var(--voca-rem-multiplier)) calc(0.1rem * var(--voca-rem-multiplier)) calc(0.1rem * var(--voca-rem-multiplier)));height:calc(0.1rem * var(--voca-rem-multiplier));margin:0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:calc(0.1rem * var(--voca-rem-multiplier))}";

const TeliaVisuallyHidden = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    /** Tracking id is used to identify and count Component usage */
    this.dataTrackingId = 'telia-visually-hidden';
  }
  render() {
    return (h(Host, null, h("div", { class: "telia-visually-hidden" }, h("slot", null), h("telia-vst", { dataTrackingId: this.dataTrackingId }))));
  }
  static get style() { return teliaVisuallyHiddenCss; }
}, [1, "telia-visually-hidden", {
    "dataTestid": [1, "data-testid"]
  }]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["telia-visually-hidden", "telia-vst"];
  components.forEach(tagName => { switch (tagName) {
    case "telia-visually-hidden":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, TeliaVisuallyHidden);
      }
      break;
    case "telia-vst":
      if (!customElements.get(tagName)) {
        defineCustomElement$1();
      }
      break;
  } });
}
defineCustomElement();

export { TeliaVisuallyHidden as T, defineCustomElement as d };
