https://app.gosherloq.com/static/frontend/assets/howItWorks-EbwpqXuI.js

1import{r as e}from"./rolldown-runtime-hePW80VL.js";import{B as t}from"./utils-BlvXUAK9.js";import{t as n}from"./jsx-runtime-CbkpsQZ0.js";import{r,t as i}from"./Text-DjqRmEnZ.js";import{o as a}from"./layout-H8WXqA-o.js";import{h as o}from"./Modal-BvWjsY2l.js";import{et as s}from"./hooks-B_vsyOCm.js";import{t as c}from"./Title-BP2UPT5s.js";import{t as l}from"./Button-BlPb0QvD.js";import{v as u}from"./inputs-DNB4wUAw.js";import{t as d}from"./Group-C9hsIZXt.js";import{a as f,o as p}from"./events-D-RIpHhU.js";import{t as m}from"./CloseButton-Y8GDFeHl.js";import{t as h}from"./Stack-Coq64YNZ.js";import{i as g,r as _}from"./IconTrash-CHlNmt51.js";import{t as v}from"./createReactComponent-DjXh-NdD.js";import{t as y}from"./IconChevronRight-BAiRN3mH.js";var b=v(`outline`,`chevron-left`,`ChevronLeft`,[[`path`,{d:`M15 6l-6 6l6 6`,key:`svg-0`}]]),x=v(`outline`,`thumb-up`,`ThumbUp`,[[`path`,{d:`M7 11v8a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-7a1 1 0 0 1 1 -1h3a4 4 0 0 0 4 -4v-1a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1 -2 2h-7a3 3 0 0 1 -3 -3`,key:`svg-0`}]]),S=n();function C({opened:e,onClose:t,topSection:n,children:r}){return(0,S.jsx)(f,{opened:e,onClose:t,position:`right`,size:460,padding:0,withCloseButton:!1,styles:{content:{borderTopLeftRadius:24,borderBottomLeftRadius:24,overflow:`hidden`},body:{height:`100%`,display:`flex`,flexDirection:`column`}},children:(0,S.jsxs)(p,{direction:`column`,h:`100%`,children:[(0,S.jsxs)(d,{justify:`space-between`,wrap:`nowrap`,px:`lg`,py:`md`,children:[(0,S.jsx)(c,{order:3,children:`How it works`}),(0,S.jsxs)(d,{gap:`xs`,wrap:`nowrap`,children:[(0,S.jsx)(a,{size:`xs`}),(0,S.jsx)(m,{onClick:t,size:`lg`})]})]}),n,r]})})}function w({step:e,total:t,onBack:n,onNext:i,isLast:a,lastStepAction:o}){return(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(g,{}),(0,S.jsxs)(d,{justify:`space-between`,align:`center`,px:`lg`,py:`md`,wrap:`nowrap`,children:[(0,S.jsx)(l,{variant:`subtle`,color:`gray`,leftSection:(0,S.jsx)(b,{size:16}),onClick:n,disabled:e===0,children:`Back`}),(0,S.jsx)(d,{gap:6,children:Array.from({length:t},(t,n)=>(0,S.jsx)(r,{h:8,w:n===e?22:8,bg:n===e?`sherloq.9`:`gray.3`,style:{borderRadius:999,transition:`width 0.2s ease`}},n))}),a?o:(0,S.jsx)(l,{rightSection:(0,S.jsx)(y,{size:16}),onClick:i,children:`Next`})]})]})}var T={proTip:`_proTip_3d68d_1`,sparkle:`_sparkle_3d68d_12`,sparkleTwinkle:`_sparkleTwinkle_3d68d_1`};function E({title:e,body:t}){return(0,S.jsxs)(r,{className:T.proTip,p:`lg`,style:{borderRadius:`var(--mantine-radius-lg)`},children:[(0,S.jsx)(s,{className:T.sparkle,size:16,style:{top:14,right:18}}),(0,S.jsx)(s,{className:T.sparkle,size:13,style:{top:`52%`,right:24,animationDelay:`0.6s`}}),(0,S.jsx)(s,{className:T.sparkle,size:12,style:{bottom:18,right:`38%`,animationDelay:`1.1s`}}),(0,S.jsxs)(d,{gap:`sm`,wrap:`nowrap`,mb:`xs`,align:`center`,children:[(0,S.jsx)(_,{radius:`xl`,size:`lg`,variant:`filled`,color:`yellow.4`,children:(0,S.jsx)(s,{size:18,color:`var(--mantine-color-dark-9)`})}),(0,S.jsx)(i,{fw:700,size:`lg`,c:`yellow.4`,children:e})]}),(0,S.jsx)(i,{size:`sm`,c:`gray.2`,style:{position:`relative`},children:t})]})}function D({step:e,total:t,title:n,body:r}){return(0,S.jsxs)(h,{gap:6,children:[(0,S.jsxs)(i,{size:`xs`,fw:700,c:`sherloq.9`,tt:`uppercase`,style:{letterSpacing:.6},children:[`Step `,e+1,` of `,t]}),(0,S.jsx)(c,{order:3,children:n}),(0,S.jsx)(i,{c:`dimmed`,children:r})]})}var O=e(t(),1);function k({groups:e,opened:t,onClose:n,initialGroup:i}){let[a,s]=(0,O.useState)(i??e[0].value),[c,d]=(0,O.useState)(0);(0,O.useEffect)(()=>{t&&(s(i??e[0].value),d(0))},[t,i,e]);let f=Math.max(0,e.findIndex(e=>e.value===a)),p=e[f],m=p.steps.length,g=p.steps[c],_=c===m-1,v=e[f+1],b=e=>{e&&(s(e),d(0))},x=v?(0,S.jsxs)(l,{rightSection:(0,S.jsx)(y,{size:16}),onClick:()=>b(v.value),children:[`Next: `,v.label]}):(0,S.jsx)(l,{onClick:n,children:`Done`});return(0,S.jsxs)(C,{opened:t,onClose:n,topSection:e.length>1?(0,S.jsx)(u,{value:a,onChange:b,children:(0,S.jsx)(u.List,{px:`lg`,children:e.map(e=>(0,S.jsx)(u.Tab,{value:e.value,fw:600,children:e.label},e.value))})}):void 0,children:[(0,S.jsx)(o,{style:{flex:1},type:`scroll`,scrollbarSize:8,children:(0,S.jsxs)(h,{gap:`lg`,px:`lg`,py:`lg`,children:[g.demo&&(0,S.jsx)(r,{inert:!0,style:{pointerEvents:`none`},children:g.demo}),(0,S.jsx)(D,{step:c,total:m,title:g.title,body:g.body}),_&&p.proTip&&(0,S.jsx)(E,{...p.proTip})]})}),(0,S.jsx)(w,{step:c,total:m,onBack:()=>d(e=>Math.max(0,e-1)),onNext:()=>d(e=>Math.min(m-1,e+1)),isLast:_,lastStepAction:x})]})}export{x as n,b as r,k as t};