@szum-tech/design-system
Version:
Szum-Tech design system with tailwindcss support
1 lines • 8.94 kB
JavaScript
import {a,b as b$1}from'./chunk-4HJVF7MU.js';import {a as a$1}from'./chunk-JUNHRB4B.js';import*as v from'react';import {useDirection}from'@radix-ui/react-direction';import {Slot}from'@radix-ui/react-slot';import {cva}from'class-variance-authority';import {jsx}from'react/jsx-runtime';import {useComposedRefs}from'@radix-ui/react-compose-refs';var E="Timeline",b="TimelineItem",_="TimelineContent",z="TimelineConnector",D="TimelineDot";var P=v.createContext(null);function N(e){let t=v.useContext(P);if(!t)throw new Error(`\`useTimelineStore\` must be used within \`${E}\``);let i=v.useCallback(()=>e(t),[t,e]);return v.useSyncExternalStore(t.subscribe,i,i)}function B(e){let t=v.useContext(P);if(!t)throw new Error(`\`${e}\` must be used within \`${E}\``);return t}function y(e,t){return t===void 0?"pending":e<t?"completed":e===t?"active":"pending"}function k(e){return e.sort((t,i)=>{let n=t[1].current,a=i[1].current;if(!n||!a)return 0;let l=n.compareDocumentPosition(a);return l&Node.DOCUMENT_POSITION_FOLLOWING?-1:l&Node.DOCUMENT_POSITION_PRECEDING?1:0})}var L=v.createContext(null);function x(e){let t=v.useContext(L);if(!t)throw new Error(`\`${e}\` must be used within \`${E}\``);return t}var F=cva("relative flex [--timeline-connector-thickness:0.125rem] [--timeline-dot-size:0.875rem]",{variants:{orientation:{vertical:"flex-col",horizontal:"flex-row items-start"},variant:{default:"",alternate:""}},compoundVariants:[{orientation:"vertical",variant:"default",class:"gap-6"},{orientation:"horizontal",variant:"default",class:"gap-8"},{orientation:"vertical",variant:"alternate",class:"relative w-full gap-3"},{orientation:"horizontal",variant:"alternate",class:"items-center gap-4"}],defaultVariants:{orientation:"vertical",variant:"default"}}),W=cva("relative flex",{variants:{orientation:{vertical:"",horizontal:""},variant:{default:"",alternate:""},isAlternateRight:{true:"",false:""}},compoundVariants:[{orientation:"vertical",variant:"default",class:"gap-3 pb-8 last:pb-0"},{orientation:"horizontal",variant:"default",class:"flex-col gap-3"},{orientation:"vertical",variant:"alternate",isAlternateRight:false,class:"w-1/2 gap-3 pr-6 pb-12 last:pb-0"},{orientation:"vertical",variant:"alternate",isAlternateRight:true,class:"ml-auto w-1/2 flex-row-reverse gap-3 pb-12 pl-6 last:pb-0"},{orientation:"horizontal",variant:"alternate",class:"grid min-w-0 grid-rows-[1fr_auto_1fr] gap-3"}],defaultVariants:{orientation:"vertical",variant:"default",isAlternateRight:false}}),q=cva("flex-1",{variants:{orientation:{vertical:"",horizontal:""},variant:{default:"",alternate:""},isAlternateRight:{true:"",false:""}},compoundVariants:[{variant:"alternate",orientation:"vertical",isAlternateRight:false,class:"text-right"},{variant:"alternate",orientation:"horizontal",isAlternateRight:false,class:"row-start-3 pt-2"},{variant:"alternate",orientation:"horizontal",isAlternateRight:true,class:"row-start-1 pb-2"}],defaultVariants:{orientation:"vertical",variant:"default",isAlternateRight:false}}),J=cva("relative z-10 flex size-(--timeline-dot-size) shrink-0 items-center justify-center rounded-full border-2 bg-background",{variants:{status:{completed:"border-primary",active:"border-primary",pending:"border-border"},orientation:{vertical:"",horizontal:""},variant:{default:"",alternate:""},isAlternateRight:{true:"",false:""}},compoundVariants:[{variant:"alternate",orientation:"vertical",isAlternateRight:false,class:"absolute -right-[calc(var(--timeline-dot-size)/2-var(--timeline-connector-thickness)/2)] bg-background"},{variant:"alternate",orientation:"vertical",isAlternateRight:true,class:"absolute -left-[calc(var(--timeline-dot-size)/2-var(--timeline-connector-thickness)/2)] bg-background"},{variant:"alternate",orientation:"horizontal",class:"row-start-2 bg-background"},{variant:"alternate",status:"completed",class:"bg-background"},{variant:"alternate",status:"active",class:"bg-background"}],defaultVariants:{status:"pending",orientation:"vertical",variant:"default",isAlternateRight:false}}),K=cva("absolute z-0",{variants:{isCompleted:{true:"bg-primary",false:"bg-border"},orientation:{vertical:"",horizontal:""},variant:{default:"",alternate:""},isAlternateRight:{true:"",false:""}},compoundVariants:[{orientation:"vertical",variant:"default",class:"start-[calc(var(--timeline-dot-size)/2-var(--timeline-connector-thickness)/2)] top-3 h-[calc(100%+0.5rem)] w-(--timeline-connector-thickness)"},{orientation:"horizontal",variant:"default",class:"start-3 top-[calc(var(--timeline-dot-size)/2-var(--timeline-connector-thickness)/2)] h-(--timeline-connector-thickness) w-[calc(100%+0.5rem)]"},{orientation:"vertical",variant:"alternate",isAlternateRight:false,class:"top-2 -right-[calc(var(--timeline-connector-thickness)/2)] h-full w-(--timeline-connector-thickness)"},{orientation:"vertical",variant:"alternate",isAlternateRight:true,class:"top-2 -left-[calc(var(--timeline-connector-thickness)/2)] h-full w-(--timeline-connector-thickness)"},{orientation:"horizontal",variant:"alternate",class:"top-[calc(var(--timeline-dot-size)/2-var(--timeline-connector-thickness)/2)] left-3 row-start-2 h-(--timeline-connector-thickness) w-[calc(100%+0.5rem)]"}],defaultVariants:{isCompleted:false,orientation:"vertical",variant:"default",isAlternateRight:false}});function At({orientation:e="vertical",variant:t="default",dir:i,activeIndex:n,asChild:a$2=false,className:l,...c}){let p=useDirection(i),u=a(()=>new Set),s=a(()=>({items:new Map})),f=v.useMemo(()=>({subscribe:o=>(u.current.add(o),()=>u.current.delete(o)),getState:()=>s.current,notify:()=>{for(let o of u.current)o();},onItemRegister:(o,m)=>{s.current.items.set(o,m),f.notify();},onItemUnregister:o=>{s.current.items.delete(o),f.notify();},getNextItemStatus:(o,m)=>{let I=Array.from(s.current.items.entries()),T=k(I),h=T.findIndex(([O])=>O===o);if(h===-1||h===T.length-1)return;let V=h+1;return y(V,m)},getItemIndex:o=>{let m=Array.from(s.current.items.entries());return k(m).findIndex(([T])=>T===o)}}),[u,s]),d=v.useMemo(()=>({dir:p,orientation:e,variant:t,activeIndex:n}),[p,e,t,n]),g=a$2?Slot:"div";return jsx(P.Provider,{value:f,children:jsx(L.Provider,{value:d,children:jsx(g,{role:"list","data-slot":"timeline","data-orientation":e,"data-variant":t,dir:p,...c,className:a$1(F({orientation:e,variant:t,className:l}))})})})}var U=v.createContext(null);function R(e){let t=v.useContext(U);if(!t)throw new Error(`\`${e}\` must be used within \`${b}\``);return t}function Wt({asChild:e=false,className:t,id:i,ref:n,...a}){let{dir:l,orientation:c,variant:p,activeIndex:u}=x(b),s=B(b),f=v.useId(),d=i??f,g=v.useRef(null),o=useComposedRefs(n,g),m=N(O=>O.getItemIndex(d)),I=v.useMemo(function(){return m<0?"pending":y(m,u)},[u,m]);b$1(()=>(s.onItemRegister(d,g),()=>{s.onItemUnregister(d);}),[i,s]);let T=p==="alternate"&&m%2===1,h=v.useMemo(()=>({id:d,status:I,isAlternateRight:T}),[d,I,T]),V=e?Slot:"div";return jsx(U.Provider,{value:h,children:jsx(V,{role:"listitem","aria-current":I==="active"?"step":void 0,"data-slot":"timeline-item","data-status":I,"data-orientation":c,"data-alternate-right":T?"":void 0,id:d,dir:l,...a,ref:o,className:a$1(W({orientation:c,variant:p,isAlternateRight:T,className:t}))})})}function te({asChild:e=false,className:t,...i}){let{variant:n,orientation:a}=x(_),{status:l,isAlternateRight:c}=R(_);return jsx(e?Slot:"div",{"data-slot":"timeline-content","data-status":l,...i,className:a$1(q({orientation:a,variant:n,isAlternateRight:c,className:t}))})}function me({asChild:e=false,className:t,...i}){let{orientation:n,variant:a}=x(D),{status:l,isAlternateRight:c}=R(D);return jsx(e?Slot:"div",{"data-slot":"timeline-dot","data-status":l,"data-orientation":n,...i,className:a$1(J({status:l,orientation:n,variant:a,isAlternateRight:c,className:t}))})}function Ie({asChild:e=false,forceMount:t,className:i,...n}){let{orientation:a,variant:l,activeIndex:c}=x(z),{id:p,status:u,isAlternateRight:s}=R(z),f=N(m=>m.getNextItemStatus(p,c));if(!t&&f===void 0)return null;let g=f==="completed"||f==="active";return jsx(e?Slot:"div",{"aria-hidden":"true","data-slot":"timeline-connector","data-completed":g?"":void 0,"data-status":u,"data-orientation":a,...n,className:a$1(K({isCompleted:g,orientation:a,variant:l,isAlternateRight:s,className:i}))})}function be({asChild:e,className:t,...i}){return jsx(e?Slot:"div",{"data-slot":"timeline-header",className:a$1("flex flex-col gap-1",t),...i})}function Me({asChild:e=false,className:t,...i}){return jsx(e?Slot:"div",{"data-slot":"timeline-title",className:a$1("leading-none font-semibold",t),...i})}function _e({asChild:e=false,className:t,...i}){return jsx(e?Slot:"div",{"data-slot":"timeline-description",...i,className:a$1("text-muted-foreground text-sm",t)})}function $e({asChild:e=false,className:t,...i}){return jsx(e?Slot:"time",{"data-slot":"timeline-time",className:a$1("text-muted-foreground text-xs",t),...i})}export{At as a,Wt as b,te as c,me as d,Ie as e,be as f,Me as g,_e as h,$e as i};