@while-and-for/tremor-react/dist/components/vis-elements/DeltaBar/DeltaBar.cjs

The React library to build dashboards faster.

'use client';
"use strict";var e=require("tslib"),r=require("react"),t=require("../../../lib/constants.cjs"),a=require("../../../lib/sizing.cjs"),s=require("../../../lib/utils.cjs"),l=require("../../../lib/tremorTwMerge.cjs"),i=require("./styles.cjs"),o=require("../../util-elements/Tooltip/Tooltip.cjs");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=n(r);const d=s.makeClassName("DeltaBar"),c=u.default.forwardRef(((r,n)=>{const{value:c,isIncreasePositive:m=!0,showAnimation:f=!0,className:g,tooltip:b}=r,p=e.__rest(r,["value","isIncreasePositive","showAnimation","className","tooltip"]),v=s.mapInputsToDeltaType((e=>e>=0?t.DeltaTypes.Increase:t.DeltaTypes.Decrease)(c),m),{tooltipProps:w,getReferenceProps:h}=o.useTooltip();return u.default.createElement(u.default.Fragment,null,u.default.createElement(o.default,Object.assign({text:b},w)),u.default.createElement("div",Object.assign({ref:n,className:l.tremorTwMerge(d("root"),"relative flex items-center w-full rounded-tremor-full","bg-tremor-background-subtle","dark:bg-dark-tremor-background-subtle",a.sizing.xs.height,g)},p),u.default.createElement("div",{className:"flex justify-end h-full w-1/2"},c<0?u.default.createElement("div",Object.assign({ref:w.refs.setReference,className:l.tremorTwMerge(d("negativeDeltaBar"),"rounded-l-tremor-full",i.colors[v].bgColor),style:{width:`${Math.abs(c)}%`,transition:f?"all 1s":""}},h)):null),u.default.createElement("div",{className:l.tremorTwMerge(d("separator"),"ring-2 z-10 rounded-tremor-full","ring-tremor-brand-inverted bg-tremor-background-emphasis","dark:ring-dark-tremor-brand-inverted dark:bg-dark-tremor-background-emphasis",a.sizing.md.height,a.sizing.twoXs.width)}),u.default.createElement("div",{className:l.tremorTwMerge(d("positiveDeltaBarWrapper"),"flex justify-start h-full w-1/2")},c>=0?u.default.createElement("div",Object.assign({ref:w.refs.setReference,className:l.tremorTwMerge(d("positiveDeltaBar"),"rounded-r-tremor-full",i.colors[v].bgColor),style:{width:`${Math.abs(c)}%`,transition:f?"all 1s":""}},h)):null)))}));c.displayName="DeltaBar",module.exports=c;