"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),c=require("swiper/react");;/* empty css                                                                               */const y=require("../../../../utils/cn/cn.cjs.js"),b=require("../../../../utils/useSwiper/useSwiper.cjs.js"),j=require("./utils.cjs.js"),a=require("../../../../src/modules/TrackProgress/components/TimelineContent/timelineContent.module.css"),n=require("../../../../components/Typography/Typography.cjs.js"),v=[{key:"optimal",label:"Optimal"},{key:"inRange",label:"In Range"},{key:"outOfRange",label:"Out of Range"}],S=({tabs:s})=>{const{activeIndex:o,onSwiperInit:d,handleSlideTo:u,handleSlideChange:p,handleSwiperResize:h}=b.useSwiper(),m=g.useMemo(()=>s.map(i=>j.distributePoints(i.optimal,i.inRange,i.outOfRange)),[s]);return e.jsx("div",{className:a.root,children:e.jsxs("div",{className:a.container,children:[e.jsx(c.Swiper,{onSwiper:d,onResize:h,onSlideChange:p,slidesPerView:1,allowTouchMove:s.length>1,spaceBetween:0,initialSlide:0,className:a.swiper,children:s.map((i,r)=>e.jsx(c.SwiperSlide,{children:e.jsxs("div",{className:a.content,children:[e.jsx("div",{className:a.metricsContainer,children:v.map((l,t)=>e.jsxs("div",{className:a.metric,children:[e.jsx(n.Typography,{defaultVariant:"displayLg",mobileVariant:"displaySm",weight:"regular",children:i[l.key]}),e.jsxs("div",{className:a.metricTitle,children:[e.jsx(n.Typography,{as:"div",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:"("}),e.jsx(n.Typography,{as:"div",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:l.label}),e.jsx("div",{className:a.circle,"data-value":l.key}),e.jsx(n.Typography,{as:"div",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:")"})]})]},`${l.key}_${t}`))}),e.jsx("div",{className:a.canvas,children:m[r].map((l,t)=>e.jsx("div",{className:a.circle,"data-value":l},t))})]})},i.label))}),e.jsx("div",{className:a.tabsContainer,children:s.map((i,r)=>e.jsx("button",{className:y.cn(a.tab,o===r&&a.tabActive),onClick:()=>u(r),children:e.jsx(n.Typography,{defaultVariant:"labelMd",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:i.label})},i.label))})]})})};exports.TimelineContent=S;
