@snowball-tech/fractal
Version:
Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS
3 lines • 1.89 kB
JavaScript
'use client';
import{a as r,c as x,e as h,g as y}from"./chunk-JCJLJHAM.js";import{b as u}from"./chunk-HTOKQYVM.js";import{b as a}from"./chunk-CMFNILWJ.js";import{a as T,b}from"./chunk-XYM7TA65.js";import*as N from"@radix-ui/react-tabs";import{forwardRef as F}from"react";import g from"lodash/fp/isEmpty";import P from"lodash/fp/omit";import{jsx as A,jsxs as $}from"react/jsx-runtime";var w=F(({children:s,disabled:E=!1,icon:f,iconOnly:i=!1,label:e,large:_=!1,name:R,orientation:o=x,size:l=y,tabsPosition:n=h,...m},v)=>{let p=!!s;!p&&g(e)&&console.warn("You must provide a `label` or `children` to the `Tab` component");let I=!!f,d=E,L=_||I&&!i&&!g(e),t="after:left-1/2 after:h-quarter after:w-0 after:-translate-x-1/2 after:transition-[width] ";t+=n==="start"?"after:-bottom-px":"after:-top-px";let c="aria-selected:after:w-3/4";return o==="vertical"&&(t="after:top-1/2 after:w-quarter after:h-0 after:-translate-y-1/2 after:transition-[height] ",t+=n==="start"?"after:-right-px":"after:-left-px",c="aria-selected:after:h-3/4"),A(N.Trigger,{ref:v,"aria-label":e,className:b(`${a}-${r}__tab`,"cursor-pointer border-0 bg-[unset] px-0 py-0 text-left","relative h-full flex-1 self-end text-center text-grey-30",L?`${a}-${r}__tab--large min-h-10`:"min-h-6","after:absolute after:block after:bg-primary after:duration-300 after:content-empty",t,"aria-selected:text-secondary",c,d?`${a}-${r}__tab--disabled cursor-not-allowed text-grey-70`:"hover:text-secondary",o==="vertical"?"w-full px-3":"h-full",m.className),disabled:d,title:e,value:R,...P(["className","value"],m),children:$(u,{className:T("flex h-full items-center justify-center gap-1 p-1",o==="horizontal"?"flex-col":""),element:"div",variant:l==="large"?"body-1-median":l==="medium"?"body-2-median":"caption-median",children:[f,!i&&(p?s:e)]})})});w.displayName="Tab";var j=w;export{w as a,j as b};
//# sourceMappingURL=chunk-DKS2EEQE.js.map