@while-and-for/tremor-react
Version:
The React library to build dashboards faster.
3 lines (2 loc) • 2.24 kB
JavaScript
'use client';
import{__rest as e}from"tslib";import r,{useContext as t}from"react";import{Tab as o}from"@headlessui/react";import{sizing as n}from"../../../lib/sizing.js";import{spacing as a}from"../../../lib/spacing.js";import{colorPalette as s}from"../../../lib/theme.js";import{getColorClassNames as d,makeClassName as i}from"../../../lib/utils.js";import{tremorTwMerge as m}from"../../../lib/tremorTwMerge.js";import{TabVariantContext as c}from"./TabList.js";import l from"../../../contexts/BaseColorContext.js";import"../../../contexts/IndexContext.js";import"../../../contexts/RootStylesContext.js";import"../../../contexts/SelectedValueContext.js";const b=i("Tab");function p(e,r){switch(e){case"line":return m("ui-selected:border-b-2 hover:border-b-2 border-transparent transition duration-100","hover:border-tremor-content hover:text-tremor-content-emphasis text-tremor-content","dark:hover:border-dark-tremor-content-emphasis dark:hover:text-dark-tremor-content-emphasis dark:text-dark-tremor-content",r?d(r,s.border).selectBorderColor:"ui-selected:border-tremor-brand dark:ui-selected:border-dark-tremor-brand",a.px.negativeMarginBottom,a.sm.paddingX,a.sm.paddingY);case"solid":return m("border-transparent border rounded-tremor-small","ui-selected:border-tremor-border ui-selected:bg-tremor-background ui-selected:shadow-tremor-input hover:text-tremor-content-emphasis text-tremor-content","dark:ui-selected:border-dark-tremor-border dark:ui-selected:bg-dark-tremor-background dark:ui-selected:shadow-dark-tremor-input dark:hover:text-dark-tremor-content-emphasis dark:text-dark-tremor-content",a.md.paddingX,a.twoXs.paddingY)}}const u=r.forwardRef(((i,u)=>{const{icon:x,className:h,children:k}=i,g=e(i,["icon","className","children"]),f=t(c),j=t(l),w=x;return r.createElement(o,Object.assign({ref:u,className:m(b("root"),"flex whitespace-nowrap truncate max-w-xs outline-none focus:ring-0 text-tremor-default transition duration-100",j?d(j,s.text).selectTextColor:"ui-selected:text-tremor-brand dark:ui-selected:text-dark-tremor-brand",p(f,j),h)},g),w?r.createElement(w,{className:m(b("icon"),"flex-none",n.lg.height,n.lg.width,a.sm.marginRight)}):null,r.createElement("span",null,k))}));u.displayName="Tab";export{u as default};