@snowball-tech/fractal/dist/src/components/Tabs/Tabs.js

Fractal's (Snowball's design system) React component library based on RadixUI and TailwindCSS

"use client";import{PREFIX as e}from"../../constants.js";import{cn as t}from"../../styles/helpers.js";import{extendChildren as n,hasChildWithProps as r}from"../../utils.js";import{DEFAULT_ORIENTATION as i,DEFAULT_POSITION as a,DEFAULT_SIZE as o,DEFAULT_VARIANT as s,GROUP_NAME as c}from"./Tabs.constants.js";import l from"./Tab.js";import{forwardRef as u}from"react";import d from"lodash/fp/isFunction.js";import f from"lodash/fp/omit.js";import{jsx as p,jsxs as m}from"react/jsx-runtime";import*as h from"@radix-ui/react-tabs";const g=u(({barClassName:u,children:g,defaultTab:_,disabled:v=!1,fullWidth:y=!0,label:b,large:x=!1,onTabChange:S,orientation:C=i,tab:w,tabs:T,tabsPosition:E=a,tabsSize:D=o,variant:O=s,withIndicator:k=!0,withSeparator:A=!0,...j},M)=>{let N=x||r(T,l,`large`)||r(T,l,[`icon`,`label`],[`iconOnly`]);return m(h.Root,{ref:M,activationMode:`manual`,className:t(`${e}-${c}`,`${e}-${c}--${C}`,`${e}-${c}--${O}`,`flex`,C===`vertical`?``:`flex-col`,v?`${e}-${c}--disabled`:``,j.className),..._===void 0?{}:{defaultValue:_},...w===void 0?{}:{value:w},orientation:C,...d(S)?{onValueChange:S}:{},...f([`className`,`defaultValue`,`value`,`onValueChange`],j),children:[E===`end`&&g,p(h.List,{"aria-label":b,className:t(`${e}-${c}__tabs`,y?`${e}-${c}__tabs--full-width`:``,N?`${e}-${c}__tabs--large`:``,`flex items-center justify-between border-normal [z-index:1]`,O===`plain`?`bg-white`:`bg-transparent`,C===`vertical`?`w-6 min-w-6 flex-col`:`max-h-10`,y?C===`horizontal`?`h-fit w-full`:`h-full w-fit`:`h-fit w-fit`,!N&&C===`horizontal`?`min-h-6`:``,N&&C===`horizontal`?`min-h-10`:``,A?E===`start`?C===`horizontal`?`border-b-1`:`border-r-1`:C===`horizontal`?`border-t-1`:`border-l-1`:``,u),loop:!0,children:n(T,e=>({disabled:v||e.disabled,large:N||e.large,orientation:C,size:e.size||D,tabsPosition:E,withIndicator:k}),`Tab`)}),E===`start`&&g]})});g.displayName=`Tabs`;export{g as default};
//# sourceMappingURL=Tabs.js.map