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

const teliaSkeletonCss = ":host{display:flex}.telia-skeleton{border-radius:calc(0.2rem * var(--voca-rem-multiplier));background-color:rgba(0, 0, 0, 0.5);align-items:stretch;opacity:0.3;overflow:hidden;position:relative;width:100%}.telia-skeleton::after{background:linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.4) 30%, rgba(0, 0, 0, 0.4) 70%, transparent);content:\"\";display:block;height:100%;position:absolute;transform:translateX(-100%);width:100vw}@media (prefers-reduced-motion: no-preference){.telia-skeleton::after{animation:loading 2s infinite;animation-timing-function:cubic-bezier(0.3, 0.6, 0.7, 0.4)}}.telia-skeleton--round{border-radius:calc(99.9rem * var(--voca-rem-multiplier))}@keyframes loading{100%{transform:translateX(100%)}}";

const TeliaSkeleton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    /** Use fully round corners  */
    this.round = false;
    /** Tracking id is used to identify and count Component usage */
    this.dataTrackingId = 'telia-skeleton';
  }
  render() {
    return (h("div", { class: { 'telia-skeleton': true, 'telia-skeleton--round': this.round } }, h("telia-vst", { dataTrackingId: this.dataTrackingId })));
  }
  static get style() { return teliaSkeletonCss; }
}, [1, "telia-skeleton", {
    "dataTestid": [1, "data-testid"],
    "round": [4]
  }]);
function defineCustomElement$1() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["telia-skeleton", "telia-vst"];
  components.forEach(tagName => { switch (tagName) {
    case "telia-skeleton":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, TeliaSkeleton$1);
      }
      break;
    case "telia-vst":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
  } });
}
defineCustomElement$1();

const TeliaSkeleton = TeliaSkeleton$1;
const defineCustomElement = defineCustomElement$1;

export { TeliaSkeleton, defineCustomElement };
