@scania/tegel/dist/components/tds-spinner.js

Tegel Design System

import{t as s,p as r,H as n,h as e}from"./index.js";const i=r(class extends n{constructor(s){super(),!1!==s&&this.__registerHost(),this.size="lg",this.variant="standard"}render(){return e("div",{key:"6b8e0e3672d59119b4c81a514c2ce3c7aec0bdce","aria-live":"assertive",role:"status","aria-label":"loading"},e("svg",{key:"f311853629ac196027dbc6a7d4ae8df0df19a1ff",class:"tds-spinner-svg tds-spinner-svg-"+this.size,"aria-hidden":"true"},e("circle",{key:"0c78f2bb689a72bb5ae7c1e0329fb943d517d352",class:"tds-spinner-circle tds-spinner-circle-"+this.variant})))}static get style(){return":root{--spinner-background-inverted:var(--tds-white)}:root,.scania,.scania .tds-mode-light{--spinner-background:var(--tds-blue-400)}.scania .tds-mode-dark{--spinner-background:var(--tds-blue-400)}.traton,.traton .tds-mode-light{--spinner-background:rgba(0, 72, 82, 1)}.traton .tds-mode-dark{--spinner-background:rgba(194, 191, 182, 1)}:root{--spinner-speed:1.8s;--spinner-speed-lg:2s;--spinner-radius-xs:8px;--spinner-radius-sm:12px;--spinner-radius-md:26px;--spinner-radius-lg:42px;--spinner-radius:var(--spinner-radius-lg);--spinner-stroke-width-xs:3px;--spinner-stroke-width-sm:4px;--spinner-stroke-width-md:6px;--spinner-stroke-width-lg:8px;--spinner-stroke-width:var(--spinner-stroke-width-lg);--PI:3.14159265358979}:host{box-sizing:border-box;display:block}:host *{box-sizing:border-box}.tds-spinner-svg{display:block;width:calc(var(--spinner-radius) * 2);height:calc(var(--spinner-radius) * 2);transform:scale(-1, 1) rotate(-90deg)}.tds-spinner-svg-xs{--spinner-radius:var(--spinner-radius-xs);--spinner-stroke-width:var(--spinner-stroke-width-xs);--spinner-animation-speed:var(--spinner-speed)}.tds-spinner-svg-sm{--spinner-radius:var(--spinner-radius-sm);--spinner-stroke-width:var(--spinner-stroke-width-sm);--spinner-animation-speed:var(--spinner-speed)}.tds-spinner-svg-md{--spinner-radius:var(--spinner-radius-md);--spinner-stroke-width:var(--spinner-stroke-width-md);--spinner-animation-speed:var(--spinner-speed)}.tds-spinner-svg-lg{--spinner-radius:var(--spinner-radius-lg);--spinner-stroke-width:var(--spinner-stroke-width-lg);--spinner-animation-speed:var(--spinner-speed-lg)}.tds-spinner-circle{cx:var(--spinner-radius);cy:var(--spinner-radius);r:calc(var(--spinner-radius) - var(--spinner-stroke-width) / 2);fill:none;--spinner-stroke-dash:calc((2 * var(--PI)) * var(--spinner-radius));stroke-dasharray:var(--spinner-stroke-dash);stroke-width:var(--spinner-stroke-width);animation:dash var(--spinner-animation-speed) cubic-bezier(0.55, 0.15, 0.45, 0.85) infinite}.tds-spinner-circle-standard{stroke:var(--spinner-background)}.tds-spinner-circle-inverted{stroke:var(--spinner-background-inverted)}@keyframes dash{from{stroke-dashoffset:calc(-1 * var(--spinner-stroke-dash))}to{stroke-dashoffset:var(--spinner-stroke-dash)}}"}},[0,"tds-spinner",{size:[1],variant:[1]}]);function a(){"undefined"!=typeof customElements&&["tds-spinner"].forEach((r=>{"tds-spinner"===r&&(customElements.get(s(r))||customElements.define(s(r),i))}))}a();const t=i,d=a;export{t as TdsSpinner,d as defineCustomElement}