var Component=(()=>{var c=Object.create;var e=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var A=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var C=(h,i)=>()=>(i||h((i={exports:{}}).exports,i),i.exports),D=(h,i)=>{for(var l in i)e(h,l,{get:i[l],enumerable:!0})},d=(h,i,l,a)=>{if(i&&typeof i=="object"||typeof i=="function")for(let n of g(i))!y.call(h,n)&&n!==l&&e(h,n,{get:()=>i[n],enumerable:!(a=p(i,n))||a.enumerable});return h};var B=(h,i,l)=>(l=h!=null?c(A(h)):{},d(i||!h||!h.__esModule?e(l,"default",{value:h,enumerable:!0}):l,h)),E=h=>d(e({},"__esModule",{value:!0}),h);var r=C((x,t)=>{t.exports=_jsx_runtime});var u={};D(u,{default:()=>f,frontmatter:()=>o});var s=B(r()),o={title:"Day 13 - Mastering Framer Motion"};function F(h){let i=Object.assign({h1:"h1",a:"a",figure:"figure",figcaption:"figcaption",pre:"pre",code:"code",span:"span"},h.components),{Tabs:l,Tab:a,ComponentPreview:n}=i;return n||k("ComponentPreview",!0),a||k("Tab",!0),l||k("Tabs",!0),(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(i.h1,{id:"day-13---mastering-framer-motion",children:(0,s.jsx)(i.a,{className:"subheading-anchor","aria-label":"Link to section",href:"#day-13---mastering-framer-motion",children:"Day 13 - Mastering Framer Motion"})}),` `,(0,s.jsxs)(l,{id:"day-13",children:[(0,s.jsx)(a,{label:"Preview",children:(0,s.jsx)(n,{name:"framer-motion-day-13"})}),(0,s.jsx)(a,{label:"Code",children:(0,s.jsxs)(i.figure,{"data-rehype-pretty-code-figure":"",children:[(0,s.jsx)(i.figcaption,{"data-rehype-pretty-code-title":"","data-language":"tsx","data-theme":"github-light-default github-dark-dimmed",children:"components/day-13.tsx"}),(0,s.jsx)(i.pre,{tabIndex:"0","data-language":"tsx","data-theme":"github-light-default github-dark-dimmed",children:(0,s.jsxs)(i.code,{"data-line-numbers":"","data-language":"tsx","data-theme":"github-light-default github-dark-dimmed",style:{display:"grid"},"data-line-numbers-max-digits":"3",children:[(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"use client"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"import"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" React, { useEffect, useState } "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"from"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "react"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"import"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" AnimatePresence,"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" MotionConfig,"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" type"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" Variants,"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" motion,"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"} "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"from"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "framer-motion"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"import"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" { IoIosArrowBack, IoIosArrowForward } "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"from"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "react-icons/io"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"import"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" { cn } "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"from"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "@/utils"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"import"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" Wrapper "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"from"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "@/components/designs/wrapper"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"interface"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:" initialTypes"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:" id"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:":"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" number"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:" img"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:":"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" string"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:" name"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:":"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" string"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:";"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"}"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" initialValues"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:":"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:" initialTypes"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"[] "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ["})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" id: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" img: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"/my-image.jpg"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" name: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"Ali"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" },"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" id: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"2"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" img: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"https://images.unsplash.com/photo-1600486913747-55e5470d6f40?q=80&w=2940&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" name: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"Ali"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" },"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" id: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"3"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" img: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"https://images.unsplash.com/photo-1567784177951-6fa58317e16b?w=800&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MjJ8fG1hbnxlbnwwfHwwfHx8MA%3D%3D"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" name: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"Ali"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" },"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" id: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"4"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" img: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"https://images.unsplash.com/photo-1481437642641-2f0ae875f836?q=80&w=2940&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" name: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"Ali"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" },"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"];"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" animationVariants"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:":"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:" Variants"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" ="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" hidden"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:": ("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:"direction"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:":"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" |"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" -"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ({"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" x: direction "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"==="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" ?"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" -"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"150"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" :"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 150"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" opacity: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }),"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" visible: {"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" x: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" opacity: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" },"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" exit"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:": ("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:"direction"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:":"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" |"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" -"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ({"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" x: direction "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"==="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" ?"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 150"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" :"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" -"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"150"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" opacity: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" zIndex: direction "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"==="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" ?"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" -"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"100"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" :"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 20"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:","})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }),"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"};"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"export"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" default"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" function"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" Day13"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:"() "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"{"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ["}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"direction"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"setDirection"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"] "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" useState"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"); "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#6E7781","--shiki-dark":"#768390"},children:"// -1 = left / 1 = right"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ["}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"images"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"setImages"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"] "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" useState"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"(initialValues);"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ["}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"disabled"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"setDisabled"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"] "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" useState"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"false"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:");"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" onArrowClickHandler"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" ="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:"action"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:":"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "back"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" |"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "forward"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" setDisabled"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"true"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:");"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" newImages"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" ="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ["}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"..."}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"images];"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" if"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" (action "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"==="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "back"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" firstItemDelete"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" ="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" newImages."}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:"shift"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"();"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" if"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" (firstItemDelete) {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" newImages."}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:"push"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"(firstItemDelete);"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" setDirection"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"-"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:");"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" } "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"else"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" if"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" (action "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"==="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "forward"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" const"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" firstItemDelete"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" ="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" newImages."}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:"pop"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"();"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" if"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" (firstItemDelete) {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" newImages."}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:"unshift"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"(firstItemDelete);"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" setDirection"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"1"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:");"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" setImages"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"(newImages);"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" };"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" useEffect"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"(() "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" if"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" (disabled) {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" setTimeout"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"(() "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" setDisabled"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"false"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:");"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }, "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"500"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:");"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }, [disabled]);"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:" "}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" return"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ("})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"div"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" className"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"flex gap-8"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:">"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"button"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" onClick"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"() "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" onArrowClickHandler"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"back"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:")"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" className"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"z-20 text-2xl disabled:cursor-not-allowed"'})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" disabled"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"disabled"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" >"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"IoIosArrowBack"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" />"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" "})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"div"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" className"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"avatars-z-index isolate flex"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:">"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"MotionConfig"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" transition"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"{ duration: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0.5"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", type: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"spring"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", bounce: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:">"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"AnimatePresence"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" mode"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"popLayout"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" custom"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"direction"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" initial"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"false"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:">"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" {"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"images."}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:"slice"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"3"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:")."}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:"map"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"(("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:"image"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:"index"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ("})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"motion.div"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" key"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"image.id"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" layoutId"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"image.id."}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:"toString"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"()"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" variants"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"animationVariants"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" initial"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"hidden"'})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" animate"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"visible"'})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" exit"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"exit"'})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" drag"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"index "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"==="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" &&"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" !"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"disabled "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"?"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "x"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" :"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" undefined"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" dragConstraints"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"{ left: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", right: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" dragElastic"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"0.2"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" whileHover"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"{ cursor: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"grab"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" whileDrag"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"{ cursor: "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"grabbing"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" onDragEnd"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:"event"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#953800","--shiki-dark":"#F69D50"},children:"info"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" if"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" (info.offset.x "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"<"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" -"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:"50"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" onArrowClickHandler"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"back"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:");"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" } "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"else"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" if"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" (info.offset.x "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:">"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 50"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:") {"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" onArrowClickHandler"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"forward"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:");"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" }"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" custom"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"direction"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" className"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:"cn"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"relative isolate"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:", index "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"!=="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" 0"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:" &&"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:' "ml-[-100px]"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:")"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" >"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"div"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" className"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"absolute -inset-3 -z-10 rounded-full bg-white"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" />"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"img"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" src"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"image.img"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" className"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"pointer-events-none aspect-square w-48 rounded-full object-cover"'})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" />"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" "})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" ))"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" "})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" "})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" "})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"button"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" onClick"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"() "}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"=>"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#8250DF","--shiki-dark":"#DCBDFB"},children:" onArrowClickHandler"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"("}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"forward"'}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:")"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" className"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"="}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#0A3069","--shiki-dark":"#96D0FF"},children:'"z-20 text-2xl disabled:cursor-not-allowed"'})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#0550AE","--shiki-dark":"#6CB6FF"},children:" disabled"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"={"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"disabled"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#CF222E","--shiki-dark":"#F47067"},children:"}"})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" >"})}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" <"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#116329","--shiki-dark":"#8DDB8C"},children:"IoIosArrowForward"}),(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" />"})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" "})]}),` `,(0,s.jsxs)(i.span,{"data-line":"",children:[(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" "})]}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:" );"})}),` `,(0,s.jsx)(i.span,{"data-line":"",children:(0,s.jsx)(i.span,{style:{"--shiki-light":"#1F2328","--shiki-dark":"#ADBAC7"},children:"}"})})]})})]})})]})]})}function m(h={}){let{wrapper:i}=h.components||{};return i?(0,s.jsx)(i,Object.assign({},h,{children:(0,s.jsx)(F,h)})):F(h)}var f=m;function k(h,i){throw new Error("Expected "+(i?"component":"object")+" `"+h+"` to be defined: you likely forgot to import, pass, or provide it.")}return E(u);})(); ;return Component;