'use client';
import{__rest as e}from"tslib";import t from"react";import{twMerge as r}from"tailwind-merge";import{BaseColors as l}from"../../../lib/constants.js";import{borderRadius as o}from"../../../lib/shape.js";import{sizing as s}from"../../../lib/sizing.js";import{spacing as a}from"../../../lib/spacing.js";import{fontSize as i,fontWeight as m}from"../../../lib/font.js";import{colorPalette as n,DEFAULT_COLOR as c}from"../../../lib/theme.js";import{getColorClassNames as p,makeClassName as f}from"../../../lib/utils.js";import g,{useTooltip as b}from"../../util-elements/Tooltip/Tooltip.js";const u=f("ProgressBar"),d=t.forwardRef(((f,d)=>{const{percentageValue:h,label:j,color:w=l.Blue,tooltip:x,showAnimation:N=!0,className:E}=f,B=e(f,["percentageValue","label","color","tooltip","showAnimation","className"]),v=p(w,n.background).bgColor,k=p(w,n.lightBackground).bgColor,{tooltipProps:P,getReferenceProps:C}=b();return t.createElement(t.Fragment,null,t.createElement(g,Object.assign({text:x},P)),t.createElement("div",Object.assign({ref:d,className:r(u("root"),"flex items-center w-full",E)},B),t.createElement("div",Object.assign({ref:P.refs.setReference,className:r(u("progressBarWrapper"),"relative flex items-center w-full",k,s.xs.height,o.lg.all)},C),t.createElement("div",{className:r(u("progressBar"),v,"flex-col h-full",o.lg.all),style:{width:`${h}%`,transition:N?"all 2s":""}})),j?t.createElement("div",{className:r(u("labelWrapper"),"w-16 truncate text-right",p(c,n.darkText).textColor,a.sm.marginLeft)},t.createElement("p",{className:r(u("label"),"shrink-0 whitespace-nowrap truncate",i.sm,m.sm)},j)):null))}));d.displayName="ProgressBar";export{d as default};
