https://www.diy.org/_next/static/chunks/664.fa2dd43ad11476c4.js

1!function(){try{var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:{},n=(new e.Error).stack;n&&(e._posthogChunkIds=e._posthogChunkIds||{},e._posthogChunkIds[n]="01a09f3b-a311-7761-a73f-73bc80966c43")}catch(e){}}();"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[664],{12419:(e,t,l)=>{l.d(t,{A:()=>x});var r=l(95155),i=l(28805),a=l(12115),s=l(84101),o=l(57360),n=l(98809),d=l(81967),c=l(24211);let x=e=>{let{value:t,onChange:l,onSubmit:x,placeholder:p="Continue the conversation...",styledPlaceholder:m,disabled:u=!1,submitting:g=!1,error:h=null,height:f="100%",width:b,sendButtonLabel:v}=e,{startListening:y,stopListening:j,isListening:k}=(0,c.A)(l,t),[w,S]=(0,a.useState)(!1),[N,A]=(0,a.useState)(!1),C=(0,a.useRef)(null),E=(0,a.useRef)(!1),T=!g&&!u&&t.length>0,I=!!v;(0,a.useEffect)(()=>{!t&&N&&E.current&&C.current&&(C.current.blur(),A(!1),E.current=!1)},[t,N]);let _=e=>{u||g||(k&&j(),E.current=!0,x(e))};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)("div",{style:{display:"flex",alignItems:"flex-start",background:"white",borderRadius:"16px",minHeight:f,padding:"8px",paddingLeft:"16px",opacity:g?.7:1,transition:"all 0.2s ease",boxShadow:"0px 0px 20px 0px rgba(0, 0, 0, 0.05)",border:`2px solid ${N?i.A.primary.purple:w?"#c0b5ff":"var(--color-primary-light)"}`,width:b},onMouseEnter:()=>S(!0),onMouseLeave:()=>S(!1),onTouchStart:()=>S(!0),onTouchEnd:()=>S(!1),onClick:e=>{let t=e.target,l=t.closest("button")||t.closest('[role="button"]');u||g||!C.current||l||C.current.focus()},children:[(0,r.jsxs)("div",{style:{position:"relative",flex:1},children:[(0,r.jsx)("textarea",{placeholder:g?"Sending message...":m?"":p,style:{border:"none",outline:"none",background:"transparent",width:"100%",fontSize:16,padding:4,color:g?"#999":"var(--color-primary-black)",cursor:g?"not-allowed":"text",resize:"none",minHeight:"48px",maxHeight:"120px",lineHeight:"20px",fontFamily:"inherit"},value:t,onChange:e=>l(e.target.value),onKeyDown:e=>{"Enter"!==e.key||g||u||(e.preventDefault(),_(e))},onFocus:()=>A(!0),onBlur:()=>A(!1),disabled:u||g,ref:C,rows:3}),m&&!t&&!g&&(0,r.jsx)("div",{style:{position:"absolute",top:4,left:4,pointerEvents:"none",fontSize:14,lineHeight:"20px",fontFamily:"inherit",color:"#999"},children:m})]}),(0,r.jsxs)("div",{className:"flex items-center justify-end gap-[6px]",style:{marginTop:"auto"},children:[(0,r.jsx)("div",{style:{background:"none",border:"none",cursor:g||u?"not-allowed":"pointer",color:g||u?"#999":"var(--color-secondary-grey-1)",display:"flex",alignItems:"center",justifyContent:"center",width:36,height:36,borderRadius:"50%",transition:"all 0.2s ease",opacity:g||u?.5:1},onClick:()=>k?j():y(),onMouseEnter:e=>{g||u||(e.currentTarget.style.opacity="0.7")},onMouseLeave:e=>{g||u||(e.currentTarget.style.opacity="1")},children:k?(0,r.jsx)(o.A,{}):(0,r.jsx)(s.A,{width:"36px",height:"36px"})}),(0,r.jsx)(d.z,{onClick:_,disabled:!T,loading:g,height:"32px",width:100,fontSize:14,borderRadius:10,padding:I?"0 16px":void 0,className:"hover:opacity-80 transition-all duration-200",icon:n.A,"aria-label":I?v:"Send message",children:I&&v})]})]}),h&&(0,r.jsx)("div",{style:{color:"#ff4444",textAlign:"center",marginTop:8},children:h})]})}},20480:(e,t,l)=>{l.d(t,{A:()=>c});var r=l(95155),i=l(2821),a=l(12115),s=l(15279),o=l(24856),n=l(56280);let d=(e,t)=>{var l;if(e)return null==(l=({"":{1:"grid-cols-1",2:"grid-cols-2",3:"grid-cols-3",4:"grid-cols-4"},sm:{1:"sm:grid-cols-1",2:"sm:grid-cols-2",3:"sm:grid-cols-3",4:"sm:grid-cols-4"},md:{1:"md:grid-cols-1",2:"md:grid-cols-2",3:"md:grid-cols-3",4:"md:grid-cols-4"},lg:{1:"lg:grid-cols-1",2:"lg:grid-cols-2",3:"lg:grid-cols-3",4:"lg:grid-cols-4"},xl:{1:"xl:grid-cols-1",2:"xl:grid-cols-2",3:"xl:grid-cols-3",4:"xl:grid-cols-4"}})[t??""])?void 0:l[e]},c=e=>{let{tags:t,variant:l="pill",onTagClick:c,className:x,gap:p,columns:m,useCarouselOnMobile:u,mobileRows:g=5,scrollAmount:h=300}=e,f=(0,s.Ub)("(max-width: 792px)"),b=p??("card"===l?20:12),v=u??"pill"===l,y=(0,a.useRef)(null),[j,k]=(0,a.useState)(!0),[w,S]=(0,a.useState)(!1),[N,A]=(0,a.useState)(!1),C=Math.max(1,g),E=(0,a.useMemo)(()=>v&&f?Array.from({length:C},(e,l)=>t.filter((e,t)=>

1t%C===l)):[],[v,f,C,t]),T=()=>{let e=y.current;if(!e)return;let{scrollLeft:t,scrollWidth:l,clientWidth:r}=e;A(l>r),k(t<=0),S(Math.ceil(t+r)>=l)};(0,a.useEffect)(()=>{let e=y.current;if(!e||!v||!f)return;T(),e.addEventListener("scroll",T);let t=new ResizeObserver(T);return t.observe(e),()=>{e.removeEventListener("scroll",T),t.disconnect()}},[v,f]);let I=e=>{let t=y.current;t&&("left"!==e||!j)&&("right"===e&&w||t.scrollBy({left:"left"===e?-h:h,behavior:"smooth"}))};return"card"===l?(0,r.jsx)("div",{className:(0,i.A)((e=>(0,i.A)("grid",d((null==e?void 0:e.base)??1),d(null==e?void 0:e.sm,"sm"),d(null==e?void 0:e.md,"md"),d(null==e?void 0:e.lg,"lg"),d(null==e?void 0:e.xl,"xl")))(m),x),style:{gap:`${b}px`},children:t.map(e=>(0,r.jsx)(n.A,{tag:e,variant:"card",onClick:c},e.id))}):v&&f?(0,r.jsxs)("div",{className:(0,i.A)("relative",x),children:[(0,r.jsx)("div",{ref:y,className:"overflow-x-auto scrollbar-hide",style:{WebkitOverflowScrolling:"touch",scrollSnapType:"x mandatory"},children:(0,r.jsx)("div",{className:"flex flex-col",style:{gap:`${b}px`},children:E.map((e,t)=>(0,r.jsx)("div",{className:"flex flex-row",style:{gap:`${b}px`},children:e.map(e=>(0,r.jsx)(n.A,{tag:e,onClick:c},e.id))},`row-${t}`))})}),N&&(0,r.jsx)("div",{className:"absolute bottom-[-48px] right-4 flex gap-2",children:(0,r.jsx)(o.A,{prevDisabled:j,nextDisabled:w,onPrev:()=>I("left"),onNext:()=>I("right"),arrowSize:22,arrowGap:6})})]}):(0,r.jsx)("div",{className:(0,i.A)("flex flex-wrap items-start",x),style:{gap:`${b}px`},children:t.map(e=>(0,r.jsx)(n.A,{tag:e,onClick:c},e.id))})}},24211:(e,t,l)=>{l.d(t,{A:()=>r.A});var r=l(26650)},24856:(e,t,l)=>{l.d(t,{A:()=>s});var r=l(95155),i=l(66368),a=l(82597);let s=e=>{let{onPrev:t,onNext:l,prevDisabled:s=!1,nextDisabled:o=!1,arrowSize:n=32,arrowGap:d=8,noPadding:c=!1}=e;return(0,r.jsxs)("div",{className:`flex flex-row justify-end items-center ${c?"p-0":"p-[2px]"}`,style:{gap:`${d}px`},children:[(0,r.jsx)("button",{type:"button",className:`
2          flex justify-center items-center
3          rounded-full
4          transition-opacity duration-200
5          ${s?"opacity-40 cursor-not-allowed":"cursor-pointer hover:opacity-60"}
6        `,onClick:s?void 0:t,disabled:s,"aria-label":"Previous","aria-disabled":s,children:(0,r.jsx)(i.A,{width:n,height:n})}),(0,r.jsx)("button",{type:"button",className:`
7          flex justify-center items-center
8          rounded-full
9          transition-opacity duration-200 text-primary-xx-dark
10          ${o?"opacity-40 cursor-not-allowed":"cursor-pointer hover:opacity-60"}
11        `,onClick:o?void 0:l,disabled:o,"aria-label":"Next","aria-disabled":o,children:(0,r.jsx)(a.A,{width:n,height:n})})]})}},56280:(e,t,l)=>{l.d(t,{A:()=>x});var r=l(95155),i=l(2821),a=l(15239),s=l(52619),o=l.n(s),n=l(12115);let d=e=>{let{tag:t,onClick:l,className:a}=e;return(0,r.jsxs)("button",{type:"button",onClick:()=>null==l?void 0:l(t),className:(0,i.A)("min-h-[46px] border-box bg-white rounded-[12px] text-primary-xx-dark font-medium transition-colors duration-200 cursor-pointer border-[2px] border-solid border-primary-xx-light hover:border-primary-purple hover:rounded-[12px] px-[12px] py-[8px] flex items-center gap-1 whitespace-nowrap flex-shrink-0",a),children:[t.emoji&&(0,r.jsx)("span",{className:"text-medium",children:t.emoji}),(0,r.jsx)("span",{className:"text-left w-full",children:t.label})]})},c=e=>{let{tag:t,onClick:l,className:s}=e,[d,c]=(0,n.useState)(!1),x=(0,r.jsxs)(r.Fragment,{children:[t.imageUrl&&(0,r.jsx)("div",{className:"h-[240px] w-full relative overflow-hidden",children:(0,r.jsx)(a.default,{src:d&&t.imageFallbackUrl?t.imageFallbackUrl:t.imageUrl,alt:t.imageAlt||t.label,fill:!0,style:{objectFit:"cover"},sizes:"(max-width: 768px) 50vw, (max-width: 1024px) 33vw, (max-width: 1280px) 25vw, 16vw",onError:()=>{t.imageFallbackUrl&&!d&&c(!0)}})}),(0,r.jsxs)("div",{className:"p-3 flex-grow flex flex-col items-start justify-start",children:[(0,r.jsx)("p",{className:"text-sub font-bold text-primary-xx-dark text-left line-clamp-2",children:t.label}),t.description&&(0,r.jsx)("p",{className:"text-sm text-primary-x-dark text-left line-clamp-2 mt-2",children:t.description})]})]}),p=(0,i.A)("bg-white border-[2px] border-primary-x-light rounded-[20px] overflow-hidden transition-all duration-200 ease-in-out hover:shadow-lg hover:scale-105 cursor-pointer flex flex-col",s);return t.href?(0,r.jsx)(o(),{href:t.href,className:p,onClick:()=>null==l?void 0:l(t),children:x}):(0,r.jsx)("button",{type:"button",onClick:()=>null==l?void 0:l(t),className:p,children:x})},x=e=>{let{variant:t="pill",...l}=e;return"card"===t?(0,r.jsx)(c,{...l}):(0,r.jsx)(d,{...l})}},60664:(e,t,l)=>{l.r(t),l.d(t,{StickerSettingsPanel:()=>g,default:()=>h});var r=l(95155),i=l(12115),a=l(52619),s=l.n(a),o=l(94106),n=l(74e3),d=l(73188),c=l(12419),x=l(78726),p=l(51499),m=l(74396);let u=[{id:"croissant",label:"\uD83E\uDD50 Croissant"},{id:"donut",label:"\uD83C\uDF69 Donut"},{id:"matcha",label:"\uD83C\uDF75 Matcha"},{id:"bun",label:"\uD83E\uDD5F Bun"},{id:"blueberries",label:"\uD83E\uDED0 Blueberries"},{id:"lollipop",label:"\uD83C\uDF6D Lollipop"},{id:"coffee",label:"☕ Add a coffee cup"},{id:"flames",label:"\uD83D\uDD25 Add flames"},{id:"glitter",label:"✨ Add glitter"},{id:"elegance",label:"\uD83E\uDDA9 Increase elegance"}],g=e=>{let{onSubmit:t,isProcessingPrompt:l,isActionDisabled:a=!1,promptError:g=null,isMobile:h=!1,onClose:f}=e,{user:b}=(0,o.A)(),v=(null==b?void 0:b.create_ai_images_allowed)!==!1,[y,j]=(0,i.useState)(""),[k,w]=(0,i.useState)(d.DEFAULT_STICKER_STYLE_ID),S=(0,i.useRef)(!1);(0,i.useEffect)(()=>{{let e=window.sessionStorage.getItem(d.STICKER_STYLE_STORAGE_KEY);e&&(0,d.isStickerStyleId)(e)&&w(e)}},[]),(0,i.useEffect)(()=>

11{if(S.current)return;let e=window.sessionStorage.getItem(d.STICKER_PROMPT_STORAGE_KEY);if(console.log("[StickerSettingsPanel] Checking for stored prompt:",e),!(null==e?void 0:e.trim()))return;S.current=!0,window.sessionStorage.removeItem(d.STICKER_PROMPT_STORAGE_KEY);let l=e.trim();console.log("[StickerSettingsPanel] Auto-submitting prompt:",l,"with style:",k),j(l),setTimeout(()=>{t({prompt:l,styleId:k})},0)},[t,k]);let N=(0,i.useMemo)(()=>d.STICKER_STYLE_DEFINITIONS.map(e=>({id:e.id,imageUrl:e.asset.src,label:e.label})),[]);return v?(0,r.jsx)(n.m,{imageUrl:"https://cdn.diy.org/iconYeti/iconYetiSticker.png",imageAlt:"yeti sticker",headerText:(0,r.jsxs)("span",{children:["Let's"," ",(0,r.jsx)("span",{style:{background:"linear-gradient(-13deg, #0ae799, #1d62f6)",WebkitTextFillColor:"transparent",backgroundClip:"text",WebkitBackgroundClip:"text"},children:"make a sticker!"})," ","Tell me what you want to make."]}),onClose:f,width:h?340:400,noBottomPadding:!0,children:(0,r.jsxs)("div",{className:"flex flex-col gap-3 pb-3",children:[(0,r.jsxs)("div",{className:"flex flex-col gap-2",children:[(0,r.jsx)("div",{className:"text-small text-primary-x-dark font-bold px-4",children:"Choose a style"}),(0,r.jsx)(p.a,{images:N,selectedImageId:k,onSelectImage:e=>{w(e)},emptyMessage:"No styles available."})]}),(0,r.jsx)("div",{className:"px-4",children:(0,r.jsx)(c.A,{value:y,onChange:j,onSubmit:()=>{t({prompt:y,styleId:k})},styledPlaceholder:(0,r.jsxs)("span",{className:"font-bold text-medium",children:[(0,r.jsx)("span",{className:"text-primary-xx-dark",children:"Like"}),(0,r.jsxs)("span",{className:"text-primary-dark",children:[" ","- Make a cute platypus."]})]}),height:"100px",width:"100%",sendButtonLabel:"Create",submitting:l,disabled:a,error:g})}),(0,r.jsx)("div",{className:"flex h-[12px] items-center px-4",children:(0,r.jsx)("div",{className:"w-full h-[1px]",style:{background:"var(--color-primary-light)",transform:"translateY(1px)"}})}),(0,r.jsxs)("div",{className:"flex flex-col gap-3 pb-4 px-4",children:[(0,r.jsx)("div",{className:"text-sub text-primary-xx-dark font-bold",children:"\uD83D\uDCA1 Suggestions"}),(0,r.jsx)(x.R,{tags:u,onTagClick:e=>j(e.label.replace(/^[^\s]+\s/,"")),gap:8})]}),(0,r.jsx)("div",{className:"flex items-center pb-3 px-4",children:(0,r.jsxs)("span",{className:"text-secondary-grey-1 text-small font-bold",children:["Powered by"," ",(0,r.jsx)(s(),{href:(0,m.qC)(),target:"_blank",children:(0,r.jsx)("span",{className:"text-primary-purple font-bold hover:opacity-80 transition-opacity duration-200",children:"ChatDino ↗️"})})]})})]})}):(0,r.jsx)(n.m,{imageUrl:"https://cdn.diy.org/iconYeti/iconYetiSticker.png",imageAlt:"yeti sticker",headerText:(0,r.jsx)("span",{className:"text-primary-xx-dark font-bold text-h6",children:"AI image creation is blocked"}),onClose:f,width:h?340:400,children:(0,r.jsx)("div",{className:"flex flex-col items-center gap-3 p-4 text-center",children:(0,r.jsx)("p",{className:"text-medium text-primary-x-dark",children:"AI image creation is currently blocked. A parent can unlock it in the Parent Portal."})})})},h=g},78726:(e,t,l)=>{l.d(t,{R:()=>r.A}),l(56280);var r=l(20480)}}]);
12//# chunkId=01a09f3b-a311-7761-a73f-73bc80966c43