@while-and-for/tremor-react
Version:
The React library to build dashboards faster.
3 lines (2 loc) • 1.22 kB
JavaScript
'use client';
import{__rest as e}from"tslib";import r from"react";import{spacing as t}from"../../../lib/spacing.js";import{colorPalette as o}from"../../../lib/theme.js";import{mergeRefs as l,getColorClassNames as a,makeClassName as s}from"../../../lib/utils.js";import{tremorTwMerge as c}from"../../../lib/tremorTwMerge.js";import i,{useTooltip as m}from"../../util-elements/Tooltip/Tooltip.js";const n=s("Tracker"),p=r.forwardRef(((t,s)=>{const{color:p,tooltip:f}=t,d=e(t,["color","tooltip"]),{tooltipProps:u,getReferenceProps:b}=m();return r.createElement("div",Object.assign({ref:l([s,u.refs.setReference]),className:c(n("trackingBlock"),"w-full h-full rounded-tremor-small",a(null!=p?p:"gray",o.background).bgColor)},d,b),r.createElement(i,Object.assign({text:f},u)))}));p.displayName="TrackerBlock";const f=r.forwardRef(((o,l)=>{const{data:a=[],className:s}=o,i=e(o,["data","className"]);return r.createElement("div",Object.assign({ref:l,className:c(n("root"),"w-full flex items-center h-10",t.threeXs.spaceX,s)},i),a.map(((e,t)=>{var o;return r.createElement(p,{key:null!==(o=e.key)&&void 0!==o?o:t,color:e.color,tooltip:e.tooltip})})))}));f.displayName="Tracker";export{f as default,n as makeTrackerClassName};