'use client';
import{__rest as t}from"tslib";import e,{useContext as o}from"react";import{twMerge as r}from"tailwind-merge";import l from"../../../contexts/BaseColorContext.js";import"../../../contexts/HoveredValueContext.js";import"../../../contexts/RootStylesContext.js";import i from"../../../contexts/SelectedValueContext.js";import{boxShadow as s,borderRadius as a}from"../../../lib/shape.js";import{sizing as n}from"../../../lib/sizing.js";import{spacing as m}from"../../../lib/spacing.js";import{fontSize as c}from"../../../lib/font.js";import{colorPalette as p,DEFAULT_COLOR as g}from"../../../lib/theme.js";import{getColorClassNames as x,makeClassName as d}from"../../../lib/utils.js";const f=d("ToggleItem"),u=e.forwardRef(((d,u)=>{const{value:C,text:h,icon:b,className:j,onClick:w}=d,N=t(d,["value","text","icon","className","onClick"]),{selectedValue:k,handleValueChange:v}=o(i),y=o(l),T=k===C,V=r(x("white").bgColor,x(y,p.text).textColor,x(g,p.lightBorder).ringColor,s.sm),E=r(x("transparent").bgColor,x(g,p.darkText).hoverTextColor,x(g,p.text).textColor,x("transparent").ringColor),R=b;return e.createElement("button",Object.assign({ref:u,type:"button",className:r(f("root"),"flex items-center ring-1",m.lg.paddingX,m.xs.paddingY,c.sm,a.md.all,T?V:E,j),onClick:t=>{null==v||v(C),null==w||w(t)}},N),R?e.createElement(R,{className:r(f("icon"),"opacity-70",h?m.xs.marginRight:"",n.lg.height,n.lg.width),"aria-hidden":"true"}):null,h?e.createElement("span",{className:r(f(h),"text-sm whitespace-nowrap")},h):null)}));u.displayName="ToggleItem";export{u as default};
