@tet/tet-components 1.3.92-testing → 1.3.93-staging

package/dist/tet-components/p-dd108d5a.entry.js

@@ -1 +0,0 @@
-import{r as t,c as n,f as i,h as a}from"./p-1ec7f341.js";import{p as e,t as o}from"./p-75693c62.js";import"./p-d0d6a340.js";import"./p-fd4d1ca5.js";const r=class{constructor(i){t(this,i),this.slideChange=n(this,"slideChange",7),this.pauseStateChange=n(this,"pauseStateChange",7),this.handlePauseClick=()=>{this.isPaused?this.play():this.pause()},this.slides=4,this.duration=5e3,this.paused=!1,this.isPaused=!1,this.mobileLayout=!1,this.theme="light",this.language="lv",this.currentSlide=0,this.firstLoad=!1}onPausedStateChange(t){t?this.pause():this.play()}async onLanguageChange(t){e("tet-components",t).then((()=>i(this)))}componentWillLoad(){this.isPaused=this.paused,this.firstLoad=!0,e("tet-components",this.language).then((()=>i(this)))}componentDidLoad(){this.isPaused||this.startAutoAdvance()}disconnectedCallback(){this.stopAutoAdvance()}async pause(){this.isPaused=!0,this.stopAutoAdvance(),this.pauseStateChange.emit({paused:!0})}async play(){this.isPaused=!1,this.startAutoAdvance(),this.pauseStateChange.emit({paused:!1})}async goTo(t){const n=this.currentSlide;this.currentSlide=Math.max(0,Math.min(t,this.slides-1)),this.slideChange.emit({index:this.currentSlide,previousIndex:n}),this.isPaused||this.startAutoAdvance()}async next(){this.currentSlide===this.slides-1&&(this.firstLoad=!1);const t=(this.currentSlide+1)%this.slides;await this.goTo(t)}async previous(){const t=0===this.currentSlide?this.slides-1:this.currentSlide-1;await this.goTo(t)}async getCurrentSlide(){return this.currentSlide}startAutoAdvance(){this.stopAutoAdvance(),this.autoTimer=window.setInterval((()=>{this.next()}),this.duration)}stopAutoAdvance(){this.autoTimer&&(clearInterval(this.autoTimer),this.autoTimer=void 0)}render(){return 1===this.slides?null:a("div",{class:{"banner-navigation":!0,[`banner-navigation--${this.theme}`]:!0,"banner-navigation--paused":this.isPaused,"banner-navigation--mobile":this.mobileLayout},style:{"--progress-duration":`${this.duration}ms`}},a("button",{class:"banner-navigation__pause",onClick:this.handlePauseClick,"aria-label":o(this.isPaused?"components-banner-nav-resume-slideshow":"components-banner-nav-pause-slideshow")},a("tet-icon",{style:{"--icon-size":"16px","--icon-container-display":"flex"},name:this.isPaused?"tc-play":"tc-pause"})),Array.from({length:this.slides},((t,n)=>a("div",{class:"banner-navigation__button-container"},a("button",{tabIndex:0,class:{"banner-navigation__button":!0,"banner-navigation__button--active":n===this.currentSlide,"banner-navigation__button--paused":this.isPaused,"banner-navigation__button--done":n<this.currentSlide,"banner-navigation__button--resetting":!this.firstLoad&&0===this.currentSlide,"banner-navigation__button--last":!this.firstLoad&&0===this.currentSlide&&n===this.slides-1,"nav-svg--filled":n<this.currentSlide,"nav-svg--unfilled":n>this.currentSlide},onClick:()=>this.goTo(n),"aria-label":o("components-banner-nav-go-to-slide")+" "+(n+1),"aria-pressed":n===this.currentSlide?"true":"false"},a("div",{class:"svg-wrapper"},a("svg",{class:"nav-svg",width:"23",height:"13",viewBox:"0 0 23 12",fill:"none"},a("defs",null,a("clipPath",{id:`nav-clip-${n}`},a("rect",{class:"clip-rect",x:"0.5",y:"0.5",height:"11"}))),a("rect",{class:"rect outer-rect",x:"0.5",y:"0.5",width:"22",height:"11",rx:"5.5",stroke:"currentColor",fill:"none"}),a("rect",{class:"rect hover-rect",x:"0.5",y:"0.5",height:"11",width:"22",rx:"5.5",fill:"transparent"}),a("g",{"clip-path":`url(#nav-clip-${n})`},a("rect",{class:"rect rect-opacity",x:"0.5",y:"0.5",height:"11",width:"22",rx:"5.5",fill:"var(--fill-color)"})))))))))}static get watchers(){return{paused:["onPausedStateChange"],language:["onLanguageChange"]}}};r.style='.banner-navigation{display:inline-flex;align-items:flex-end}.banner-navigation--light{color:var(--tc-icon-primary);--fill-color:var(--tc-icon-primary);--outline-color:var(--tc-blue-40, rgba(25, 98, 212, 1));--hover-color:rgba(12, 12, 14, 0.10);--done-hover-color:var(--tc-grey-80);--pause-icon-color:var( --tc-icon-primary);--active-color:var(--tc-grey-110);--inactive-color:var(--tc-grey-60)}.banner-navigation--dark{color:var(--tc-icon-primary-dark);--fill-color:var(--tc-icon-primary-dark);--outline-color:var(--tc-blue-40-dark, rgba(52, 129, 247, 1));--hover-color:rgba(187, 189, 191, 0.2);--done-hover-color:var(--tc-grey-80-dark);--pause-icon-color:var(--tc-icon-primary-dark);--active-color:var(--tc-grey-110-dark);--inactive-color:var(--tc-grey-60-dark)}.banner-navigation__pause{display:flex;align-items:center;border:none;background:none;padding:0.125rem;margin-right:0.375rem;cursor:pointer}.banner-navigation__pause:focus-visible{outline:var(--outline-color) auto 1px}.banner-navigation__pause tet-icon{--icon-color:var(--pause-icon-color)}.banner-navigation__pause:hover tet-icon{--icon-color:var(--done-hover-color)}.banner-navigation__button-container{margin:0 0 2px 0}.banner-navigation__button{display:flex;align-items:flex-end;justify-content:center;appearance:none;border:none;background:none;cursor:pointer;padding:0.125rem;color:var(--inactive-color)}.banner-navigation__button:hover .hover-rect{fill:var(--hover-color)}.banner-navigation__button--done:hover .rect-opacity,.banner-navigation__button--active:hover .rect-opacity{fill:var(--done-hover-color)}.banner-navigation__button--done:hover .outer-rect,.banner-navigation__button--active:hover .outer-rect{color:var(--done-hover-color)}.banner-navigation__button .clip-rect{width:22px}.banner-navigation__button--active,.banner-navigation__button--done{color:var(--active-color)}.banner-navigation__button--active .clip-rect{animation:fill-progress var(--progress-duration, 5000ms) linear forwards}.banner-navigation__button--done .clip-rect{width:22px}.banner-navigation__button--active.banner-navigation__button--paused .clip-rect{animation:none;width:0}@keyframes fill-progress{from{width:0}to{width:22px}}.svg-wrapper{position:relative;display:inline-block;width:12px;height:12px;transition:width 0.2s linear;pointer-events:none}.svg-wrapper .nav-svg{position:absolute;top:50%;left:0;transform:translateY(-50%);transform-origin:left center;height:12px;pointer-events:none}.svg-wrapper .rect{transition:width 0.2s linear, rx 0.2s ease-out}.nav-svg--unfilled .rect-opacity{opacity:0;width:22px;transition:width 0.2s linear, rx 0.2s ease-out, opacity 0.2s ease-in}.nav-svg--unfilled .rect{rx:10;width:11px}.nav-svg--filled .rect-opacity{opacity:1}.nav-svg--filled .rect{width:11px;rx:10}.banner-navigation__button--active .svg-wrapper{width:23px}@media (prefers-reduced-motion: reduce){.banner-navigation__button--active .clip-rect,.rect,.rect-opacity{transition:none;width:22px}}.banner-navigation__button:focus-visible{position:relative;width:fit-content;height:fit-content;outline:none}.banner-navigation__button:focus-visible::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;scale:1.2;transform-origin:center center;outline:2px solid;outline-offset:-0.125rem;outline-color:var(--outline-color);border-radius:11px}.banner-navigation--mobile .banner-navigation__button{padding:0.3125rem}.banner-navigation--mobile .banner-navigation__pause{padding:0.3125rem;margin-right:0.4375rem;outline-offset:-0.25rem}.banner-navigation--mobile .banner-navigation__button:focus-visible::after{outline-offset:-0.3125rem}';export{r as tet_banner_nav}