dgz-ui/dist/tabs-DVby9Lfu.cjs

Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript

"use strict";const u=require("./jsx-runtime-DUiatUiq.cjs"),V=require("react"),p=require("./index-Ch6ABCiC.cjs"),G=require("./index-DcWZbXs6.cjs"),m=require("./index-rZOu-iLP.cjs"),x=require("./index-CMmIsz5H.cjs"),L=require("./index-C3BrtnXJ.cjs"),j=require("./index-C1ZpNc2P.cjs"),k=require("./index-DQ3cz9n7.cjs"),T=require("./utils-C1Nf1RtL.cjs");function O(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const n=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,n.get?n:{enumerable:!0,get:()=>e[a]})}}return t.default=e,Object.freeze(t)}const d=O(V);var g="Tabs",[H,Q]=G.createContextScope(g,[m.createRovingFocusGroupScope]),R=m.createRovingFocusGroupScope(),[K,y]=H(g),h=d.forwardRef((e,t)=>{const{__scopeTabs:a,value:n,onValueChange:r,defaultValue:s,orientation:o="horizontal",dir:l,activationMode:v="automatic",...f}=e,c=L.useDirection(l),[i,b]=j.useControllableState({prop:n,onChange:r,defaultProp:s??"",caller:g});return u.jsxRuntimeExports.jsx(K,{scope:a,baseId:j.useId(),value:i,onValueChange:b,orientation:o,dir:c,activationMode:v,children:u.jsxRuntimeExports.jsx(x.Primitive.div,{dir:c,"data-orientation":o,...f,ref:t})})});h.displayName=g;var E="TabsList",N=d.forwardRef((e,t)=>{const{__scopeTabs:a,loop:n=!0,...r}=e,s=y(E,a),o=R(a);return u.jsxRuntimeExports.jsx(m.Root,{asChild:!0,...o,orientation:s.orientation,dir:s.dir,loop:n,children:u.jsxRuntimeExports.jsx(x.Primitive.div,{role:"tablist","aria-orientation":s.orientation,...r,ref:t})})});N.displayName=E;var C="TabsTrigger",w=d.forwardRef((e,t)=>{const{__scopeTabs:a,value:n,disabled:r=!1,...s}=e,o=y(C,a),l=R(a),v=P(o.baseId,n),f=S(o.baseId,n),c=n===o.value;return u.jsxRuntimeExports.jsx(m.Item,{asChild:!0,...l,focusable:!r,active:c,children:u.jsxRuntimeExports.jsx(x.Primitive.button,{type:"button",role:"tab","aria-selected":c,"aria-controls":f,"data-state":c?"active":"inactive","data-disabled":r?"":void 0,disabled:r,id:v,...s,ref:t,onMouseDown:p.composeEventHandlers(e.onMouseDown,i=>{!r&&i.button===0&&i.ctrlKey===!1?o.onValueChange(n):i.preventDefault()}),onKeyDown:p.composeEventHandlers(e.onKeyDown,i=>{[" ","Enter"].includes(i.key)&&o.onValueChange(n)}),onFocus:p.composeEventHandlers(e.onFocus,()=>{const i=o.activationMode!=="manual";!c&&!r&&i&&o.onValueChange(n)})})})});w.displayName=C;var I="TabsContent",_=d.forwardRef((e,t)=>{const{__scopeTabs:a,value:n,forceMount:r,children:s,...o}=e,l=y(I,a),v=P(l.baseId,n),f=S(l.baseId,n),c=n===l.value,i=d.useRef(c);return d.useEffect(()=>{const b=requestAnimationFrame(()=>i.current=!1);return()=>cancelAnimationFrame(b)},[]),u.jsxRuntimeExports.jsx(p.Presence,{present:r||c,children:({present:b})=>u.jsxRuntimeExports.jsx(x.Primitive.div,{"data-state":c?"active":"inactive","data-orientation":l.orientation,role:"tabpanel","aria-labelledby":v,hidden:!b,id:f,tabIndex:0,...o,ref:t,style:{...e.style,animationDuration:i.current?"0s":void 0},children:b&&s})})});_.displayName=I;function P(e,t){return`${e}-trigger-${t}`}function S(e,t){return`${e}-content-${t}`}var z=h,$=N,A=w,q=_;const B=z,J=k.cva("inline-flex items-center justify-center gap-1 p-1 text-secondary",{variants:{type:{default:"",segmented:"bg-item-tertiary [&>button]:data-[state=active]:shadow-sm",line:"[&>button]:data-[state=active]:after:absolute [&>button]:data-[state=active]:after:-bottom-1.5 [&>button]:data-[state=active]:after:content-['']  [&>button]:data-[state=active]:after:w-full [&>button]:data-[state=active]:after:h-0.5 [&>button]:data-[state=active]:after:bg-primary"},variant:{default:"[&>button]:data-[state=active]:bg-background",soft:"[&>button]:data-[state=active]:bg-item-tertiary [&>button]:data-[state=active]:border [&>button]:data-[state=active]:border-alpha-strong"},rounded:{default:"rounded-md [&>button]:rounded-md",pill:"rounded-full [&>button]:rounded-full"}},defaultVariants:{type:"default",variant:"default",rounded:"default"}}),M=d.forwardRef(({className:e,rounded:t,variant:a,type:n,full:r,...s},o)=>u.jsxRuntimeExports.jsx($,{ref:o,className:T.cn(r&&"!flex",J({rounded:t,variant:a,type:n,className:e})),...s}));M.displayName=$.displayName;const F=d.forwardRef(({className:e,...t},a)=>u.jsxRuntimeExports.jsx(A,{ref:a,className:T.cn("inline-flex h-7 flex-1 cursor-pointer box-border relative items-center justify-center whitespace-nowrap px-3 py-1 text-body-xs-medium transition-all outline-none disabled:pointer-events-none disabled:opacity-50","data-[state=inactive]:hover:!bg-item-tertiary-hover data-[state=inactive]:hover:text-primary","data-[state=active]:text-primary"),...t}));F.displayName=A.displayName;const D=d.forwardRef(({className:e,...t},a)=>u.jsxRuntimeExports.jsx(q,{ref:a,className:T.cn("mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",e),...t}));D.displayName=q.displayName;exports.Tabs=B;exports.TabsContent=D;exports.TabsList=M;exports.TabsTrigger=F;