@tribepad/themis 1.5.6 → 1.5.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +5 -0
- package/dist/elements/Wizard/Wizard.d.ts.map +1 -1
- package/dist/elements/Wizard/Wizard.types.d.ts +30 -0
- package/dist/elements/Wizard/Wizard.types.d.ts.map +1 -1
- package/dist/elements/Wizard/WizardContext.d.ts +3 -1
- package/dist/elements/Wizard/WizardContext.d.ts.map +1 -1
- package/dist/elements/Wizard/WizardStep.d.ts.map +1 -1
- package/dist/elements/Wizard/index.js +1 -1
- package/dist/elements/Wizard/index.js.map +1 -1
- package/dist/elements/Wizard/index.mjs +1 -1
- package/dist/elements/Wizard/index.mjs.map +1 -1
- package/dist/elements/index.js +1 -1
- package/dist/elements/index.js.map +1 -1
- package/dist/elements/index.mjs +1 -1
- package/dist/elements/index.mjs.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2 -2
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import {createContext,forwardRef,memo,useId,Children,useState,useEffect,useRef,useCallback,useMemo,useContext,isValidElement}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {cva}from'class-variance-authority';import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {Loader2,Zap,Check,ArrowLeft,ArrowRight}from'lucide-react';import {Button}from'react-aria-components';import {z as z$1}from'zod';function z(...s){return twMerge(clsx(s))}var et=createContext(null);function W(){let s=useContext(et);if(!s)throw new Error("Wizard compound components must be used within <Wizard>");return s}var H=["motion-reduce:transition-none","motion-reduce:animate-none"],rt=["transition-colors","duration-200"];function G(...s){return s.flatMap(t=>Array.isArray(t)?[...t]:[t])}var it=cva("flex min-h-0 flex-1 flex-col"),ot=cva("flex min-h-0 flex-1 flex-col lg:flex-row"),nt=cva("flex min-w-0 flex-1 justify-center gap-8 overflow-y-auto bg-[var(--page-background)] p-6"),st=cva("hidden w-56 shrink-0 pt-2 lg:block"),dt=cva("flex w-full max-w-2xl flex-col"),pt=cva("mt-3 text-center text-xs text-[var(--menu-muted)]"),lt=cva("hidden w-80 shrink-0 border-l border-[var(--border)] bg-[var(--accent-background)] p-6 xl:block"),ct=cva("flex flex-col gap-2"),ut=cva("text-xs font-semibold uppercase tracking-wide text-[var(--primary)]"),mt=cva("text-sm font-bold text-[var(--content-foreground)]"),ft=cva("mt-6 flex flex-col"),xt=cva("flex items-start"),gt=cva("flex w-11 shrink-0 flex-col items-center"),vt=cva(G("flex h-9 w-9 shrink-0 items-center justify-center rounded-full text-sm font-semibold",rt,H),{variants:{state:{completed:"bg-[var(--primary)] text-[var(--primary-foreground)]",current:"border-2 border-[var(--primary)] bg-[var(--content-background)] text-[var(--primary)]",upcoming:"border border-[var(--border)] bg-[var(--content-background)] text-[var(--menu-muted)]"}},defaultVariants:{state:"upcoming"}}),zt=cva(G("my-0.5 h-5 w-0.5",rt,H),{variants:{completed:{true:"bg-[var(--primary)]",false:"bg-[var(--border)]"}},defaultVariants:{completed:false}}),bt=cva("flex min-h-11 items-center pl-3"),St=cva("flex flex-col justify-center"),ht=cva("text-sm",{variants:{state:{completed:"font-medium text-[var(--content-foreground)]",current:"font-semibold text-[var(--content-foreground)]",upcoming:"text-[var(--menu-muted)]"}},defaultVariants:{state:"upcoming"}}),wt=cva("text-xs text-[var(--primary)]"),Nt=cva("flex flex-col gap-6"),Wt=cva("flex items-start gap-4"),Vt=cva("flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-[var(--accent-background)] text-[var(--primary)]"),yt=cva("text-lg font-bold text-[var(--content-foreground)] focus:outline-none"),Ct=cva("mt-1 text-sm text-[var(--menu-muted)]"),Lt=cva("rounded-lg border border-[var(--border)] bg-[var(--content-background)] p-6 text-[var(--content-foreground)]"),Et=cva("mt-4 flex items-center justify-between border-t border-[var(--border)] pt-4"),Rt=cva(""),Pt=cva("flex items-center gap-3"),Tt=cva("flex flex-col items-center gap-1.5 py-3 lg:hidden"),It=cva("flex items-center justify-center gap-2"),_t=cva(G("h-2 rounded-full transition-all duration-200",H),{variants:{state:{completed:"w-2 bg-[var(--primary)] opacity-60",current:"w-8 bg-[var(--primary)]",upcoming:"w-2 bg-[var(--border)]"}},defaultVariants:{state:"upcoming"}}),At=cva("text-xs font-medium text-[var(--menu-muted)]"),kt=cva("text-[var(--content-foreground)]"),$=cva("sr-only");var U=forwardRef(function({children:t,stepper:m,preview:d,helpText:l,className:x,"data-testid":r="wizard-layout"},i){return jsxs("div",{ref:i,className:z(ot(),x),"data-testid":r,children:[jsxs("div",{className:nt(),children:[m?jsx("nav",{className:st(),"aria-label":"Wizard steps","data-testid":`${r}-stepper-slot`,children:m}):null,jsxs("div",{className:dt(),children:[t,l?jsx("p",{className:pt(),children:l}):null]})]}),d?jsx("aside",{className:lt(),"aria-hidden":"true","data-testid":`${r}-preview`,children:d}):null]})});U.displayName="Wizard.Layout";var qt=cva("inline-flex justify-center min-h-[44px] min-w-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",{variants:{fullWidth:{true:"w-full",false:""},inVerticalGroup:{true:"items-stretch",false:"items-center"}},defaultVariants:{fullWidth:false,inVerticalGroup:false}}),Xt=cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background motion-safe:transition-transform motion-safe:duration-200 motion-safe:[transition-timing-function:cubic-bezier(0.34,1.56,0.64,1)] motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 relative cursor-pointer",{variants:{variant:{default:"bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] hover:-translate-y-1",destructive:"bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background-hover,var(--destructive-background))] motion-safe:hover:btn-warn-shake",outline:"border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)]",secondary:"bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary-hover,var(--secondary))]",ghost:"hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)]",link:"text-[var(--text-link)] underline underline-offset-4 hover:bg-[var(--accent)] hover:text-[var(--text-link-hover)]"},fullWidth:{true:"w-full",false:""},visualSize:{default:"h-10 px-4 py-2",sm:"h-9 rounded-md px-3 text-xs",lg:"h-11 rounded-md px-8",icon:"h-10 w-10",dot:"h-5 w-5 rounded-full p-0 min-h-0 min-w-0"},paywall:{true:"!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent",false:""}},defaultVariants:{variant:"default",visualSize:"default",paywall:false}});var Ot="data-[pressed]:scale-[0.97]";var Bt="data-[hovered]:shadow-md";var F="hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground",Y="hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";var te=createContext(null);te.displayName="ButtonGroupContext";function ee(){return useContext(te)}var ae=createContext(null);ae.displayName="ButtonGroupItemContext";function re(){return useContext(ae)}cva("inline-flex items-center gap-0",{variants:{orientation:{horizontal:"flex-row",vertical:"flex-col w-full"}},defaultVariants:{orientation:"horizontal"}});var ie=cva("",{variants:{orientation:{horizontal:"min-w-[44px]",vertical:"flex min-h-[44px]"},position:{first:"",middle:"",last:"",only:""}},compoundVariants:[{orientation:"horizontal",position:"first",className:"rounded-r-none border-r-0"},{orientation:"horizontal",position:"middle",className:"rounded-none border-r-0"},{orientation:"horizontal",position:"last",className:"rounded-l-none"},{orientation:"vertical",position:"first",className:"rounded-b-none border-b-0"},{orientation:"vertical",position:"middle",className:"rounded-none border-b-0"},{orientation:"vertical",position:"last",className:"rounded-t-none"}],defaultVariants:{orientation:"horizontal",position:"only"}});cva("bg-[var(--border)]",{variants:{orientation:{horizontal:"w-px h-6 mx-1",vertical:"h-px w-full my-1"}},defaultVariants:{orientation:"horizontal"}});var I=memo(forwardRef(({className:s,buttonVisualClassName:t,variant:m,size:d,visualSize:l,fullWidth:x,loading:r=false,loadingText:i="Loading...",shortcut:b,children:n,isDisabled:g,paywall:p=false,paywallRedirect:c,paywallDescription:o,onPress:u,...f},v)=>{let h=useId(),S=ee(),V=re(),R=m??S?.variant??"default",C=d??S?.size,A=g??S?.isDisabled??false,P=S?.orientation==="vertical",T=x||P,k=V?ie({orientation:S?.orientation??"horizontal",position:V.position}):"",L=l??C??"default";return process.env.NODE_ENV!=="production"&&(L==="dot"||L==="icon")&&!f["aria-label"]&&!n&&console.warn('[Button] visualSize="dot" or "icon" requires aria-label when no visible text is provided (WCAG 1.1.1)'),jsx(Button,{ref:v,isDisabled:A||r||void 0,"aria-disabled":p?true:void 0,"aria-describedby":p?h:void 0,onPress:B=>{if(p){c&&window.open(c,"_blank","noopener,noreferrer");return}u?.(B);},className:z(qt({fullWidth:T,inVerticalGroup:P}),s),...f,children:B=>jsxs("span",{className:z(Xt({variant:R,visualSize:L,paywall:p,fullWidth:T}),k,t,Ot,Bt,F,Y),"data-pressed":B.isPressed||void 0,children:[r&&jsxs(Fragment,{children:[jsx(Loader2,{className:"motion-safe:animate-spin","aria-hidden":"true"}),jsx("span",{className:"sr-only","aria-live":"polite",children:i})]}),!r&&n,p&&jsx(Zap,{"data-testid":"zap-icon","aria-hidden":"true",className:"ml-1"}),p&&jsxs("span",{id:h,className:"sr-only",children:["Premium feature: ",o||"Upgrade required to access this feature"]}),B.isFocusVisible&&b&&jsx("kbd",{className:"ml-auto hidden text-xs opacity-60 lg:inline",children:b})]})})}));I.displayName="Button";var j=forwardRef(function({sectionLabel:t,sectionNumber:m,totalSections:d,allowClickOnCompleted:l=true,className:x,"aria-label":r,"data-testid":i="wizard-stepper"},b){let{currentStepIndex:n,steps:g,onStepChange:p,isLoading:c}=W();return jsxs("div",{ref:b,className:z(ct(),x),"aria-label":r,"data-testid":i,children:[t&&m!==void 0&&d!==void 0?jsxs(Fragment,{children:[jsxs("p",{className:ut(),children:["Section ",m," of ",d]}),jsx("h2",{className:mt(),children:t})]}):null,jsx("ol",{className:ft(),children:g.map((o,u)=>{let f=u<n,v=u===n,h=f?"completed":v?"current":"upcoming",S=f&&l&&!c,V=u===g.length-1,R=vt({state:h}),C=jsx("span",{className:R,"aria-hidden":"true",children:f?jsx(Check,{className:"h-4 w-4"}):jsx("span",{children:u+1})});return jsx("li",{"data-testid":`${i}-item-${o.id}`,"aria-current":v?"step":void 0,children:jsxs("div",{className:xt(),children:[jsxs("div",{className:gt(),children:[S?jsx(I,{variant:"ghost",visualSize:"icon",buttonVisualClassName:"rounded-full","aria-label":`Go back to ${o.label}`,onPress:()=>p({index:u,id:o.id,label:o.label,reason:"jump"}),"data-testid":`${i}-button-${o.id}`,children:C}):jsx("span",{className:"flex h-11 w-11 items-center justify-center",children:C}),V?null:jsx("span",{className:zt({completed:f}),"aria-hidden":"true"})]}),jsxs("div",{className:bt(),children:[jsxs("span",{className:St(),children:[jsx("span",{className:ht({state:h}),children:o.label}),v?jsx("span",{className:wt(),children:"Current step"}):null]}),v?null:jsx("span",{className:"sr-only",children:f?"(completed)":"(upcoming)"})]})]})},o.id)})})]})});j.displayName="Wizard.Stepper";function Ee(s){if(!isValidElement(s))return false;let t=s.type;return typeof t=="string"?false:t?.displayName==="Wizard.Step"}var Z=forwardRef(function({children:t,className:m,"data-testid":d="wizard-content"},l){let{currentStepId:x,steps:r}=W(),i=Children.toArray(t).filter(Ee);if(process.env.NODE_ENV!=="production"){let n=i.map(o=>o.props.id),g=r.map(o=>o.id),p=g.filter(o=>!n.includes(o)),c=n.filter(o=>!g.includes(o));(p.length>0||c.length>0)&&console.warn("[Wizard] Wizard.Step children do not match `steps` descriptors. "+(p.length?`Missing steps: ${p.join(", ")}. `:"")+(c.length?`Unknown step ids: ${c.join(", ")}.`:""));}let b=i.find(n=>n.props.id===x)??null;return jsx("div",{ref:l,className:z(Lt(),m),"data-testid":d,children:b})});Z.displayName="Wizard.Content";var X=forwardRef(function({id:t,icon:m,children:d,className:l,"data-testid":x},r){let{steps:i,currentStepIndex:b,registerStepHeading:n}=W(),g=i.find(v=>v.id===t),p=g?.label??t,c=g?.description,o=useId(),u=useId(),f=x??`wizard-step-${t}`;return jsxs("section",{ref:r,className:z(Nt(),l),"aria-labelledby":o,"aria-describedby":c?u:void 0,"data-testid":f,"data-wizard-step-id":t,"data-wizard-step-index":b,children:[jsxs("div",{className:Wt(),children:[m?jsx("span",{className:Vt(),"aria-hidden":"true",children:m}):null,jsxs("div",{children:[jsx("h3",{id:o,ref:n,tabIndex:-1,className:yt(),children:p}),c?jsx("p",{id:u,className:Ct(),children:c}):null]})]}),jsx("div",{children:d})]})});X.displayName="Wizard.Step";var D={back:"Back",skip:"Skip for now",next:"Next",start:"Next",finish:"Finish"};function O(s,t){return typeof s=="function"?s(t):s}var J=forwardRef(function({labels:t,showSkip:m=false,onBack:d,onNext:l,onSkip:x,className:r,"data-testid":i="wizard-navigation"},b){let{currentStepIndex:n,currentStepId:g,totalSteps:p,steps:c,isLoading:o,onStepChange:u}=W(),f={index:n,total:p,id:g},v={back:O(t?.back??D.back,f),skip:O(t?.skip??D.skip,f),next:O(t?.next??D.next,f),start:O(t?.start??t?.next??D.start,f),finish:O(t?.finish??D.finish,f)},h=n===0,S=n===p-1,V=n===p-2,R=!h&&!S,C=!S,A=m&&!h&&!S&&!V,P=h?v.start:V?v.finish:v.next,T=()=>{let w=Math.max(0,n-1);u({index:w,id:c[w]?.id??"",label:c[w]?.label??"",reason:"back"}),d?.();},k=()=>{let w=Math.min(p-1,n+1);u({index:w,id:c[w]?.id??"",label:c[w]?.label??"",reason:"next"}),l?.();},L=()=>{let w=Math.min(p-1,n+1);u({index:w,id:c[w]?.id??"",label:c[w]?.label??"",reason:"skip"}),x?.();};return jsxs("div",{ref:b,className:z(Et(),r),"data-testid":i,children:[jsx("div",{className:Rt(),children:R?jsxs(I,{variant:"secondary",onPress:T,isDisabled:o,"data-testid":`${i}-back`,children:[jsx(ArrowLeft,{className:"mr-1 h-4 w-4 rtl:rotate-180","aria-hidden":"true"}),v.back]}):null}),jsxs("div",{className:Pt(),children:[A?jsx(I,{variant:"ghost",onPress:L,isDisabled:o,"data-testid":`${i}-skip`,children:v.skip}):null,C?jsxs(I,{variant:"default",onPress:k,isDisabled:o,loading:o,"data-testid":`${i}-next`,children:[P,V?null:jsx(ArrowRight,{className:"ml-1 h-4 w-4 rtl:rotate-180","aria-hidden":"true"})]}):null]})]})});J.displayName="Wizard.Navigation";var tt=forwardRef(function({className:t,"data-testid":m="wizard-mobile-progress"},d){let{currentStepIndex:l,steps:x,totalSteps:r}=W(),i=x[l]?.label,b=i?`Step ${l+1} of ${r}: ${i}`:`Step ${l+1} of ${r}`;return jsxs("div",{ref:d,className:z(Tt(),t),role:"progressbar","aria-label":"Wizard progress","aria-valuemin":1,"aria-valuemax":r,"aria-valuenow":l+1,"aria-valuetext":b,"data-testid":m,children:[jsx("div",{className:It(),children:x.map((n,g)=>{let p=g<l?"completed":g===l?"current":"upcoming";return jsx("span",{className:_t({state:p}),"aria-hidden":"true","data-testid":`${m}-dot-${n.id}`},n.id)})}),i?jsxs("p",{className:At(),"aria-hidden":"true","data-testid":`${m}-caption`,children:["Step ",l+1," of ",r," \xB7 ",jsx("span",{className:kt(),children:i})]}):null]})});tt.displayName="Wizard.MobileProgress";var Oe=(s,t)=>`Step ${s} of ${t}`,pe=forwardRef(function({children:t,currentStep:m,steps:d,onStepChange:l,isLoading:x=false,errors:r,announceTemplate:i=Oe,className:b,id:n,"aria-label":g,"aria-labelledby":p,"data-testid":c="wizard"},o){let u=Math.min(Math.max(m,0),Math.max(d.length-1,0)),f=d[u],v=f?.id??"",h=f?.label??"",[S,V]=useState("");useEffect(()=>{d.length!==0&&V(i(u+1,d.length,h));},[u,d.length,h,i]);let[R,C]=useState("");useEffect(()=>{if(!r||r.length===0){C("");return}C(r.join(". "));},[r]);let A=useRef(null),P=useRef(true),T=useCallback(L=>{A.current=L;},[]);useEffect(()=>{if(P.current){P.current=false;return}let L=requestAnimationFrame(()=>{A.current?.focus();});return ()=>cancelAnimationFrame(L)},[u]);let k=useMemo(()=>({currentStepIndex:u,currentStepId:v,steps:d,totalSteps:d.length,isLoading:x,errors:r??[],announceTemplate:i,onStepChange:l,registerStepHeading:T}),[u,v,d,x,r,i,l,T]);return jsx(et.Provider,{value:k,children:jsxs("div",{ref:o,id:n,className:z(it(),b),"aria-label":g,"aria-labelledby":p,"data-testid":c,"data-wizard-step":u,children:[t,jsx("div",{role:"status","aria-live":"polite","aria-atomic":"true",className:$(),"data-testid":`${c}-live-polite`,children:S}),jsx("div",{role:"alert","aria-live":"assertive","aria-atomic":"true",className:$(),"data-testid":`${c}-live-assertive`,children:R})]})})});pe.displayName="Wizard";var Be=Object.assign(pe,{Layout:U,Stepper:j,Content:Z,Step:X,Navigation:J,MobileProgress:tt});var E=z$1.object({className:z$1.string().optional(),children:z$1.any().optional(),id:z$1.string().optional(),"aria-label":z$1.string().optional(),"aria-labelledby":z$1.string().optional(),"aria-describedby":z$1.string().optional(),"aria-live":z$1.enum(["off","polite","assertive"]).optional(),"aria-hidden":z$1.boolean().optional(),"data-testid":z$1.string().optional()});var Ge=z$1.enum(["next","back","skip","jump"]),le=z$1.object({id:z$1.string().min(1),label:z$1.string().min(1),description:z$1.string().optional()}),$e=E.extend({children:z$1.custom(),currentStep:z$1.number().int().min(0),steps:z$1.array(le).min(1),onStepChange:z$1.custom(),isLoading:z$1.boolean().optional().default(false),errors:z$1.array(z$1.string()).optional(),announceTemplate:z$1.custom().optional()}),Ue=E.extend({children:z$1.custom(),preview:z$1.custom().optional(),helpText:z$1.string().optional()}),Fe=E.extend({sectionLabel:z$1.string().optional(),sectionNumber:z$1.number().int().min(1).optional(),totalSections:z$1.number().int().min(1).optional(),allowClickOnCompleted:z$1.boolean().optional().default(true)}),Ye=E.extend({id:z$1.string().min(1),children:z$1.custom(),icon:z$1.custom().optional()}),je=E.extend({children:z$1.custom()}),Ze=E.extend({labels:z$1.custom().optional(),showSkip:z$1.boolean().optional().default(false),onBack:z$1.custom().optional(),onNext:z$1.custom().optional(),onSkip:z$1.custom().optional()}),qe=E.extend({});export{Be as Wizard,Ge as WizardChangeReasonSchema,Z as WizardContent,je as WizardContentPropsSchema,U as WizardLayout,Ue as WizardLayoutPropsSchema,tt as WizardMobileProgress,qe as WizardMobileProgressPropsSchema,J as WizardNavigation,Ze as WizardNavigationPropsSchema,$e as WizardPropsSchema,X as WizardStep,le as WizardStepDescriptorSchema,Ye as WizardStepPropsSchema,j as WizardStepper,Fe as WizardStepperPropsSchema,W as useWizardContext,Lt as wizardContentCardVariants,dt as wizardLayoutContentSlotVariants,pt as wizardLayoutHelpTextVariants,nt as wizardLayoutMainVariants,lt as wizardLayoutPreviewVariants,st as wizardLayoutStepperSlotVariants,ot as wizardLayoutVariants,$ as wizardLiveRegionVariants,kt as wizardMobileProgressCaptionTitleVariants,At as wizardMobileProgressCaptionVariants,Tt as wizardMobileProgressContainerVariants,It as wizardMobileProgressDotRowVariants,_t as wizardMobileProgressDotVariants,Rt as wizardNavigationLeftVariants,Pt as wizardNavigationRightVariants,Et as wizardNavigationVariants,it as wizardRootVariants,Nt as wizardStepContainerVariants,Ct as wizardStepDescriptionVariants,Wt as wizardStepHeaderRowVariants,yt as wizardStepHeadingVariants,Vt as wizardStepIconVariants,vt as wizardStepperCircleVariants,zt as wizardStepperConnectorVariants,ct as wizardStepperContainerVariants,wt as wizardStepperCurrentSubtitleVariants,gt as wizardStepperIndicatorColumnVariants,xt as wizardStepperItemVariants,bt as wizardStepperLabelColumnVariants,ht as wizardStepperLabelTextVariants,St as wizardStepperLabelVariants,ft as wizardStepperListVariants,mt as wizardStepperSectionHeadingVariants,ut as wizardStepperSectionLabelVariants};//# sourceMappingURL=index.mjs.map
|
|
2
|
+
import {createContext,forwardRef,memo,useId,Children,useState,useEffect,useRef,useCallback,useMemo,useContext,isValidElement}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {cva}from'class-variance-authority';import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {Loader2,Zap,Check,ArrowLeft,ArrowRight}from'lucide-react';import {Button}from'react-aria-components';import {z}from'zod';function x(...p){return twMerge(clsx(p))}var et=createContext(null);function W(){let p=useContext(et);if(!p)throw new Error("Wizard compound components must be used within <Wizard>");return p}var B=["motion-reduce:transition-none","motion-reduce:animate-none"],rt=["transition-colors","duration-200"];function G(...p){return p.flatMap(t=>Array.isArray(t)?[...t]:[t])}var it=cva("flex min-h-0 flex-1 flex-col"),ot=cva("flex min-h-0 flex-1 flex-col lg:flex-row"),nt=cva("flex min-w-0 flex-1 justify-center gap-8 overflow-y-auto bg-[var(--page-background)] p-6"),st=cva("hidden w-56 shrink-0 pt-2 lg:block"),dt=cva("flex w-full max-w-2xl flex-col"),pt=cva("mt-3 text-center text-xs text-[var(--menu-muted)]"),lt=cva("hidden w-80 shrink-0 border-l border-[var(--border)] bg-[var(--accent-background)] p-6 xl:block"),ct=cva("flex flex-col gap-2"),ut=cva("text-xs font-semibold uppercase tracking-wide text-[var(--primary)]"),mt=cva("text-sm font-bold text-[var(--content-foreground)]"),ft=cva("mt-6 flex flex-col"),gt=cva("flex items-start"),xt=cva("flex w-11 shrink-0 flex-col items-center"),vt=cva(G("flex h-9 w-9 shrink-0 items-center justify-center rounded-full text-sm font-semibold",rt,B),{variants:{state:{completed:"bg-[var(--primary)] text-[var(--primary-foreground)]",current:"border-2 border-[var(--primary)] bg-[var(--content-background)] text-[var(--primary)]",upcoming:"border border-[var(--border)] bg-[var(--content-background)] text-[var(--menu-muted)]"}},defaultVariants:{state:"upcoming"}}),zt=cva(G("my-0.5 h-5 w-0.5",rt,B),{variants:{completed:{true:"bg-[var(--primary)]",false:"bg-[var(--border)]"}},defaultVariants:{completed:false}}),bt=cva("flex min-h-11 items-center pl-3"),St=cva("flex flex-col justify-center"),ht=cva("text-sm",{variants:{state:{completed:"font-medium text-[var(--content-foreground)]",current:"font-semibold text-[var(--content-foreground)]",upcoming:"text-[var(--menu-muted)]"}},defaultVariants:{state:"upcoming"}}),wt=cva("text-xs text-[var(--primary)]"),Nt=cva("flex flex-col gap-6"),Wt=cva("flex items-start gap-4"),Vt=cva("flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-[var(--accent-background)] text-[var(--primary)]"),yt=cva("text-lg font-bold text-[var(--content-foreground)] focus:outline-none"),Ct=cva("mt-1 text-sm text-[var(--menu-muted)]"),Lt=cva("rounded-lg border border-[var(--border)] bg-[var(--content-background)] p-6 text-[var(--content-foreground)]"),Et=cva("mt-4 flex items-center justify-between border-t border-[var(--border)] pt-4"),Rt=cva(""),Pt=cva("flex items-center gap-3"),Tt=cva("flex flex-col items-center gap-1.5 py-3 lg:hidden"),It=cva("flex items-center justify-center gap-2"),_t=cva(G("h-2 rounded-full transition-all duration-200",B),{variants:{state:{completed:"w-2 bg-[var(--primary)] opacity-60",current:"w-8 bg-[var(--primary)]",upcoming:"w-2 bg-[var(--border)]"}},defaultVariants:{state:"upcoming"}}),At=cva("text-xs font-medium text-[var(--menu-muted)]"),kt=cva("text-[var(--content-foreground)]"),$=cva("sr-only");var U=forwardRef(function({children:t,stepper:u,preview:l,helpText:c,className:f,"data-testid":i="wizard-layout"},o){return jsxs("div",{ref:o,className:x(ot(),f),"data-testid":i,children:[jsxs("div",{className:nt(),children:[u?jsx("nav",{className:st(),"aria-label":"Wizard steps","data-testid":`${i}-stepper-slot`,children:u}):null,jsxs("div",{className:dt(),children:[t,c?jsx("p",{className:pt(),children:c}):null]})]}),l?jsx("aside",{className:lt(),"aria-hidden":"true","data-testid":`${i}-preview`,children:l}):null]})});U.displayName="Wizard.Layout";var qt=cva("inline-flex justify-center min-h-[44px] min-w-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50",{variants:{fullWidth:{true:"w-full",false:""},inVerticalGroup:{true:"items-stretch",false:"items-center"}},defaultVariants:{fullWidth:false,inVerticalGroup:false}}),Xt=cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background motion-safe:transition-transform motion-safe:duration-200 motion-safe:[transition-timing-function:cubic-bezier(0.34,1.56,0.64,1)] motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 relative cursor-pointer",{variants:{variant:{default:"bg-[var(--primary-action)] text-[var(--primary-action-foreground)] shadow-md hover:bg-[var(--primary-action-hover)] hover:-translate-y-1",destructive:"bg-[var(--destructive-background)] text-[var(--destructive-foreground)] shadow-md hover:bg-[var(--destructive-background-hover,var(--destructive-background))] motion-safe:hover:btn-warn-shake",outline:"border border-[var(--input-border)] bg-[var(--page-background)] hover:bg-[var(--input-border)]",secondary:"bg-[var(--secondary)] text-[var(--secondary-foreground)] shadow-md hover:bg-[var(--secondary-hover,var(--secondary))]",ghost:"hover:bg-[var(--accent)] hover:text-[var(--accent-foreground)]",link:"text-[var(--text-link)] underline underline-offset-4 hover:bg-[var(--accent)] hover:text-[var(--text-link-hover)]"},fullWidth:{true:"w-full",false:""},visualSize:{default:"h-10 px-4 py-2",sm:"h-9 rounded-md px-3 text-xs",lg:"h-11 rounded-md px-8",icon:"h-10 w-10",dot:"h-5 w-5 rounded-full p-0 min-h-0 min-w-0"},paywall:{true:"!bg-[var(--paywall)] !text-[var(--paywall-foreground)] !shadow-md hover:!bg-[var(--paywall)]/90 !cursor-not-allowed !border-transparent",false:""}},defaultVariants:{variant:"default",visualSize:"default",paywall:false}});var Ht="data-[pressed]:scale-[0.97]";var Ot="data-[hovered]:shadow-md";var F="hc:data-[hovered]:outline hc:data-[hovered]:outline-2 hc:data-[hovered]:outline-foreground",Y="hc:data-[pressed]:outline hc:data-[pressed]:outline-2 hc:data-[pressed]:outline-offset-1 hc:data-[pressed]:outline-foreground";var te=createContext(null);te.displayName="ButtonGroupContext";function ee(){return useContext(te)}var ae=createContext(null);ae.displayName="ButtonGroupItemContext";function re(){return useContext(ae)}cva("inline-flex items-center gap-0",{variants:{orientation:{horizontal:"flex-row",vertical:"flex-col w-full"}},defaultVariants:{orientation:"horizontal"}});var ie=cva("",{variants:{orientation:{horizontal:"min-w-[44px]",vertical:"flex min-h-[44px]"},position:{first:"",middle:"",last:"",only:""}},compoundVariants:[{orientation:"horizontal",position:"first",className:"rounded-r-none border-r-0"},{orientation:"horizontal",position:"middle",className:"rounded-none border-r-0"},{orientation:"horizontal",position:"last",className:"rounded-l-none"},{orientation:"vertical",position:"first",className:"rounded-b-none border-b-0"},{orientation:"vertical",position:"middle",className:"rounded-none border-b-0"},{orientation:"vertical",position:"last",className:"rounded-t-none"}],defaultVariants:{orientation:"horizontal",position:"only"}});cva("bg-[var(--border)]",{variants:{orientation:{horizontal:"w-px h-6 mx-1",vertical:"h-px w-full my-1"}},defaultVariants:{orientation:"horizontal"}});var I=memo(forwardRef(({className:p,buttonVisualClassName:t,variant:u,size:l,visualSize:c,fullWidth:f,loading:i=false,loadingText:o="Loading...",shortcut:h,children:n,isDisabled:v,paywall:s=false,paywallRedirect:m,paywallDescription:a,onPress:z,...d},g)=>{let w=useId(),b=ee(),V=re(),E=u??b?.variant??"default",C=l??b?.size,A=v??b?.isDisabled??false,R=b?.orientation==="vertical",P=f||R,k=V?ie({orientation:b?.orientation??"horizontal",position:V.position}):"",T=c??C??"default";return process.env.NODE_ENV!=="production"&&(T==="dot"||T==="icon")&&!d["aria-label"]&&!n&&console.warn('[Button] visualSize="dot" or "icon" requires aria-label when no visible text is provided (WCAG 1.1.1)'),jsx(Button,{ref:g,isDisabled:A||i||void 0,"aria-disabled":s?true:void 0,"aria-describedby":s?w:void 0,onPress:O=>{if(s){m&&window.open(m,"_blank","noopener,noreferrer");return}z?.(O);},className:x(qt({fullWidth:P,inVerticalGroup:R}),p),...d,children:O=>jsxs("span",{className:x(Xt({variant:E,visualSize:T,paywall:s,fullWidth:P}),k,t,Ht,Ot,F,Y),"data-pressed":O.isPressed||void 0,children:[i&&jsxs(Fragment,{children:[jsx(Loader2,{className:"motion-safe:animate-spin","aria-hidden":"true"}),jsx("span",{className:"sr-only","aria-live":"polite",children:o})]}),!i&&n,s&&jsx(Zap,{"data-testid":"zap-icon","aria-hidden":"true",className:"ml-1"}),s&&jsxs("span",{id:w,className:"sr-only",children:["Premium feature: ",a||"Upgrade required to access this feature"]}),O.isFocusVisible&&h&&jsx("kbd",{className:"ml-auto hidden text-xs opacity-60 lg:inline",children:h})]})})}));I.displayName="Button";var j=forwardRef(function({sectionLabel:t,sectionNumber:u,totalSections:l,allowClickOnCompleted:c=true,className:f,"aria-label":i,"data-testid":o="wizard-stepper"},h){let{currentStepIndex:n,steps:v,onStepChange:s,isLoading:m}=W();return jsxs("div",{ref:h,className:x(ct(),f),"aria-label":i,"data-testid":o,children:[t&&u!==void 0&&l!==void 0?jsxs(Fragment,{children:[jsxs("p",{className:ut(),children:["Section ",u," of ",l]}),jsx("h2",{className:mt(),children:t})]}):null,jsx("ol",{className:ft(),children:v.map((a,z)=>{let d=z<n,g=z===n,w=d?"completed":g?"current":"upcoming",b=d&&c&&!m,V=z===v.length-1,E=vt({state:w}),C=jsx("span",{className:E,"aria-hidden":"true",children:d?jsx(Check,{className:"h-4 w-4"}):jsx("span",{children:z+1})});return jsx("li",{"data-testid":`${o}-item-${a.id}`,"aria-current":g?"step":void 0,children:jsxs("div",{className:gt(),children:[jsxs("div",{className:xt(),children:[b?jsx(I,{variant:"ghost",visualSize:"icon",buttonVisualClassName:"rounded-full","aria-label":`Go back to ${a.label}`,onPress:()=>s({index:z,id:a.id,label:a.label,reason:"jump"}),"data-testid":`${o}-button-${a.id}`,children:C}):jsx("span",{className:"flex h-11 w-11 items-center justify-center",children:C}),V?null:jsx("span",{className:zt({completed:d}),"aria-hidden":"true"})]}),jsxs("div",{className:bt(),children:[jsxs("span",{className:St(),children:[jsx("span",{className:ht({state:w}),children:a.label}),g?jsx("span",{className:wt(),children:"Current step"}):null]}),g?null:jsx("span",{className:"sr-only",children:d?"(completed)":"(upcoming)"})]})]})},a.id)})})]})});j.displayName="Wizard.Stepper";function Ee(p){if(!isValidElement(p))return false;let t=p.type;return typeof t=="string"?false:t?.displayName==="Wizard.Step"}var Z=forwardRef(function({children:t,className:u,"data-testid":l="wizard-content"},c){let{currentStepId:f,steps:i}=W(),o=Children.toArray(t).filter(Ee);if(process.env.NODE_ENV!=="production"){let n=o.map(a=>a.props.id),v=i.map(a=>a.id),s=v.filter(a=>!n.includes(a)),m=n.filter(a=>!v.includes(a));(s.length>0||m.length>0)&&console.warn("[Wizard] Wizard.Step children do not match `steps` descriptors. "+(s.length?`Missing steps: ${s.join(", ")}. `:"")+(m.length?`Unknown step ids: ${m.join(", ")}.`:""));}let h=o.find(n=>n.props.id===f)??null;return jsx("div",{ref:c,className:x(Lt(),u),"data-testid":l,children:h})});Z.displayName="Wizard.Content";var X=forwardRef(function({id:t,icon:u,children:l,className:c,"data-testid":f},i){let{steps:o,currentStepIndex:h,registerStepHeading:n,stepHeadingLevel:v}=W(),s=o.find(b=>b.id===t),m=s?.label??t,a=s?.description,z=useId(),d=useId(),g=f??`wizard-step-${t}`,w=v;return jsxs("section",{ref:i,className:x(Nt(),c),"aria-labelledby":z,"aria-describedby":a?d:void 0,"data-testid":g,"data-wizard-step-id":t,"data-wizard-step-index":h,children:[jsxs("div",{className:Wt(),children:[u?jsx("span",{className:Vt(),"aria-hidden":"true",children:u}):null,jsxs("div",{children:[jsx(w,{id:z,ref:n,tabIndex:-1,className:yt(),children:m}),a?jsx("p",{id:d,className:Ct(),children:a}):null]})]}),jsx("div",{children:l})]})});X.displayName="Wizard.Step";var D={back:"Back",skip:"Skip for now",next:"Next",start:"Next",finish:"Finish"};function H(p,t){return typeof p=="function"?p(t):p}var J=forwardRef(function({labels:t,showSkip:u=false,onBack:l,onNext:c,onSkip:f,className:i,"data-testid":o="wizard-navigation"},h){let{currentStepIndex:n,currentStepId:v,totalSteps:s,steps:m,isLoading:a,onStepChange:z}=W(),d={index:n,total:s,id:v},g={back:H(t?.back??D.back,d),skip:H(t?.skip??D.skip,d),next:H(t?.next??D.next,d),start:H(t?.start??t?.next??D.start,d),finish:H(t?.finish??D.finish,d)},w=n===0,b=n===s-1,V=n===s-2,E=!w&&!b,C=!b,A=u&&!w&&!b&&!V,R=w?g.start:V?g.finish:g.next,P=()=>{let S=Math.max(0,n-1);z({index:S,id:m[S]?.id??"",label:m[S]?.label??"",reason:"back"}),l?.();},k=()=>{let S=Math.min(s-1,n+1);z({index:S,id:m[S]?.id??"",label:m[S]?.label??"",reason:"next"}),c?.();},T=()=>{let S=Math.min(s-1,n+1);z({index:S,id:m[S]?.id??"",label:m[S]?.label??"",reason:"skip"}),f?.();};return jsxs("div",{ref:h,className:x(Et(),i),"data-testid":o,children:[jsx("div",{className:Rt(),children:E?jsxs(I,{variant:"secondary",onPress:P,isDisabled:a,"data-testid":`${o}-back`,children:[jsx(ArrowLeft,{className:"mr-1 h-4 w-4 rtl:rotate-180","aria-hidden":"true"}),g.back]}):null}),jsxs("div",{className:Pt(),children:[A?jsx(I,{variant:"ghost",onPress:T,isDisabled:a,"data-testid":`${o}-skip`,children:g.skip}):null,C?jsxs(I,{variant:"default",onPress:k,isDisabled:a,loading:a,"data-testid":`${o}-next`,children:[R,V?null:jsx(ArrowRight,{className:"ml-1 h-4 w-4 rtl:rotate-180","aria-hidden":"true"})]}):null]})]})});J.displayName="Wizard.Navigation";var tt=forwardRef(function({className:t,"data-testid":u="wizard-mobile-progress"},l){let{currentStepIndex:c,steps:f,totalSteps:i}=W(),o=f[c]?.label,h=o?`Step ${c+1} of ${i}: ${o}`:`Step ${c+1} of ${i}`;return jsxs("div",{ref:l,className:x(Tt(),t),role:"progressbar","aria-label":"Wizard progress","aria-valuemin":1,"aria-valuemax":i,"aria-valuenow":c+1,"aria-valuetext":h,"data-testid":u,children:[jsx("div",{className:It(),children:f.map((n,v)=>{let s=v<c?"completed":v===c?"current":"upcoming";return jsx("span",{className:_t({state:s}),"aria-hidden":"true","data-testid":`${u}-dot-${n.id}`},n.id)})}),o?jsxs("p",{className:At(),"aria-hidden":"true","data-testid":`${u}-caption`,children:["Step ",c+1," of ",i," \xB7 ",jsx("span",{className:kt(),children:o})]}):null]})});tt.displayName="Wizard.MobileProgress";var He=(p,t)=>`Step ${p} of ${t}`,pe=forwardRef(function({children:t,currentStep:u,steps:l,onStepChange:c,isLoading:f=false,errors:i,announceTemplate:o=He,stepHeadingLevel:h="h3",className:n,id:v,"aria-label":s,"aria-labelledby":m,"data-testid":a="wizard"},z){let d=Math.min(Math.max(u,0),Math.max(l.length-1,0)),g=l[d],w=g?.id??"",b=g?.label??"",[V,E]=useState("");useEffect(()=>{l.length!==0&&E(o(d+1,l.length,b));},[d,l.length,b,o]);let[C,A]=useState("");useEffect(()=>{if(!i||i.length===0){A("");return}A(i.join(". "));},[i]);let R=useRef(null),P=useRef(true),k=useCallback(S=>{R.current=S;},[]);useEffect(()=>{if(P.current){P.current=false;return}let S=requestAnimationFrame(()=>{R.current?.focus();});return ()=>cancelAnimationFrame(S)},[d]);let T=useMemo(()=>({currentStepIndex:d,currentStepId:w,steps:l,totalSteps:l.length,isLoading:f,errors:i??[],announceTemplate:o,stepHeadingLevel:h,onStepChange:c,registerStepHeading:k}),[d,w,l,f,i,o,h,c,k]);return jsx(et.Provider,{value:T,children:jsxs("div",{ref:z,id:v,className:x(it(),n),"aria-label":s,"aria-labelledby":m,"data-testid":a,"data-wizard-step":d,children:[t,jsx("div",{role:"status","aria-live":"polite","aria-atomic":"true",className:$(),"data-testid":`${a}-live-polite`,children:V}),jsx("div",{role:"alert","aria-live":"assertive","aria-atomic":"true",className:$(),"data-testid":`${a}-live-assertive`,children:C})]})})});pe.displayName="Wizard";var Oe=Object.assign(pe,{Layout:U,Stepper:j,Content:Z,Step:X,Navigation:J,MobileProgress:tt});var L=z.object({className:z.string().optional(),children:z.any().optional(),id:z.string().optional(),"aria-label":z.string().optional(),"aria-labelledby":z.string().optional(),"aria-describedby":z.string().optional(),"aria-live":z.enum(["off","polite","assertive"]).optional(),"aria-hidden":z.boolean().optional(),"data-testid":z.string().optional()});var Ge=z.enum(["next","back","skip","jump"]),le=z.object({id:z.string().min(1),label:z.string().min(1),description:z.string().optional()}),$e=z.enum(["h2","h3","h4","h5","h6"]),Ue=L.extend({children:z.custom(),currentStep:z.number().int().min(0),steps:z.array(le).min(1),onStepChange:z.custom(),isLoading:z.boolean().optional().default(false),errors:z.array(z.string()).optional(),announceTemplate:z.custom().optional(),stepHeadingLevel:$e.optional().default("h3")}),Fe=L.extend({children:z.custom(),preview:z.custom().optional(),helpText:z.string().optional()}),Ye=L.extend({sectionLabel:z.string().optional(),sectionNumber:z.number().int().min(1).optional(),totalSections:z.number().int().min(1).optional(),allowClickOnCompleted:z.boolean().optional().default(true)}),je=L.extend({id:z.string().min(1),children:z.custom(),icon:z.custom().optional()}),Ze=L.extend({children:z.custom()}),qe=L.extend({labels:z.custom().optional(),showSkip:z.boolean().optional().default(false),onBack:z.custom().optional(),onNext:z.custom().optional(),onSkip:z.custom().optional()}),Xe=L.extend({});export{Oe as Wizard,Ge as WizardChangeReasonSchema,Z as WizardContent,Ze as WizardContentPropsSchema,U as WizardLayout,Fe as WizardLayoutPropsSchema,tt as WizardMobileProgress,Xe as WizardMobileProgressPropsSchema,J as WizardNavigation,qe as WizardNavigationPropsSchema,Ue as WizardPropsSchema,X as WizardStep,le as WizardStepDescriptorSchema,je as WizardStepPropsSchema,j as WizardStepper,Ye as WizardStepperPropsSchema,W as useWizardContext,Lt as wizardContentCardVariants,dt as wizardLayoutContentSlotVariants,pt as wizardLayoutHelpTextVariants,nt as wizardLayoutMainVariants,lt as wizardLayoutPreviewVariants,st as wizardLayoutStepperSlotVariants,ot as wizardLayoutVariants,$ as wizardLiveRegionVariants,kt as wizardMobileProgressCaptionTitleVariants,At as wizardMobileProgressCaptionVariants,Tt as wizardMobileProgressContainerVariants,It as wizardMobileProgressDotRowVariants,_t as wizardMobileProgressDotVariants,Rt as wizardNavigationLeftVariants,Pt as wizardNavigationRightVariants,Et as wizardNavigationVariants,it as wizardRootVariants,Nt as wizardStepContainerVariants,Ct as wizardStepDescriptionVariants,Wt as wizardStepHeaderRowVariants,yt as wizardStepHeadingVariants,Vt as wizardStepIconVariants,vt as wizardStepperCircleVariants,zt as wizardStepperConnectorVariants,ct as wizardStepperContainerVariants,wt as wizardStepperCurrentSubtitleVariants,xt as wizardStepperIndicatorColumnVariants,gt as wizardStepperItemVariants,bt as wizardStepperLabelColumnVariants,ht as wizardStepperLabelTextVariants,St as wizardStepperLabelVariants,ft as wizardStepperListVariants,mt as wizardStepperSectionHeadingVariants,ut as wizardStepperSectionLabelVariants};//# sourceMappingURL=index.mjs.map
|
|
3
3
|
//# sourceMappingURL=index.mjs.map
|