https://woofz.academy/js/Introduction.Bw5zexNq.js

1import{x as e,r as t,u as r,j as a}from"./vendor.mIPXQGLM.js";import{b as o,b2 as n,b3 as i,F as s,c as p,b4 as l,b6 as u}from"./index.bundle.js";import{C as d}from"./ContinueButton.CRG4gt8j.js";import{a as m}from"./pageShowTransition.Bxzxszzt.js";import{l as c}from"./@constants.BRV_txzJ.js";import"./@amplitude.yMGOHWCQ.js";import"./@xstate.CEsnlirg.js";import"./@firebase.Bkc6--w4.js";import"./@lottie.KPmlgv_O.js";import"./@react-router.hFdD-ZA2.js";import"./@i18n.Cv0A4uHT.js";import"./@lodash.D8yALn-Z.js";import"./@rudderstack.DVYreKjc.js";import"./continue-arrow-white.D2wdKjJw.js";const g="'Work Sans', sans-serif",x={Wrapper:e.div`
2    ${n};
3    ${i};
4    ${m};
5    padding-top: 80px;
6  `,Content:e.div`
7    ${o};
8    position: relative;
9  `,Title:e.h2`
10    font-size: 32px;
11    letter-spacing: -3%;
12    font-weight: 700;
13    color: #241f1d;
14    line-height: normal;
15    text-align: center;
16    margin-bottom: 8px;
17    font-family: ${g};
18  `,Subtitle:e.p`
19    font-size: 16px;
20    font-weight: 500;
21    color: #1e1e1e;
22    line-height: 150%;
23    letter-spacing: -1.1%;
24    text-align: center;
25    font-family: ${g};
26    margin-bottom: 51px;
27  `,InputWrapper:e.div`
28    width: 100%;
29    position: relative;
30    padding-bottom: 0;
31    margin-bottom: ${({hasMarginBottom:e})=>e?"60px":"0"};
32  `,Label:e.label`
33    font-size: 20px;
34    font-weight: 500;
35    color: #2f2825;
36    line-height: 19px;
37    letter-spacing: -2%;
38    font-family: ${g};
39    position: absolute;
40    top: -16px;
41    left: 0;
42    transform: translateY(-50%);
43  `,Input:e.input`
44    font-size: 17px;
45    font-weight: 500;
46    color: #241f1d;
47    line-height: 18px;
48    font-family: ${g};
49    margin-bottom: 51px;
50    width: 100%;
51    border-radius: 30px;
52    height: 64px;
53    outline: none;
54    border: 1px solid #e3e4e8;
55    padding: 0 24px;
56
57    &::placeholder {
58      color: #241f1d;
59      opacity: 0.3;
60    }
61  `,StickyButtonContainer:e.div`
62    position: fixed;
63    bottom: 0;
64    width: 100%;
65    padding: 9px 16px 32px;
66    background: ${c.WHITE};
67  `},h=e=>e.trim()&&e[0].toUpperCase()+e.slice(1),j=()=>{const{onNextStep:e}=t.useContext(s),[o,n]=t.useState(""),[i,m]=t.useState(""),[c,g]=t.useState(""),{currentPageId:j,currentPageNumber:b}=p(r(e=>({currentPageId:e.currentPageId,currentPageNumber:e.currentPageNumber}))),f=t.useCallback(()=>{j&&b&&(l({question:"",answers:[o,i,c],pageName:j,pageNumber:b,quiz:{userName:h(o),partnerName:h(i),dogName:h(c)}}),e())},[j,b,e,o,i,c]);return u(),a.jsx(x.Wrapper,{children:a.jsxs(x.Content,{children:[a.jsx(x.Title,{children:"First, the parties involved"}),a.jsx(x.Subtitle,{children:"Quiz answers are processed locally in your browser, not sent to our servers. Standard analytics may apply as per our Privacy Policy."}),a.jsxs(x.InputWrapper,{children:[a.jsx(x.Label,{children:"Your name"}),a.jsx(x.Input,{id:"user-name",placeholder:"Jack",value:o,onChange:e=>n(e.target.value)})]}),a.jsxs(x.InputWrapper,{children:[a.jsx(x.Label,{children:"Your partner's name"}),a.jsx(x.Input,{id:"partner-name",placeholder:"Ewa",value:i,onChange:e=>m(e.target.value)})]}),a.jsxs(x.InputWrapper,{hasMarginBottom:!0,children:[a.jsx(x.Label,{children:"Your dog's name"}),a.jsx(x.Input,{id:"dog-name",placeholder:"Ollie",value:c,onChange:e=>g(e.target.value)})]}),a.jsx(x.StickyButtonContainer,{children:a.jsx(d,{onClick:f})})]})})};export{j as IntroductionPage};