const{Fragment:l,jsx:n,jsxs:e}=arguments[0];function _createMdxContent(F){const s={code:"code",figure:"figure",h2:"h2",h3:"h3",p:"p",pre:"pre",span:"span",...F.components},{ComponentDemo:r}=s;return r||function(l,n){throw new Error("Expected "+(n?"component":"object")+" `"+l+"` to be defined: you likely forgot to import, pass, or provide it.")}("ComponentDemo",!0),e(l,{children:[e(r,{name:"demos/ui/demo-gallery-featured",children:[n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-featured.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:'"use client"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" Gallery"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" GalleryBottomImage"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" GalleryFeaturedImage"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" GalleryFooter"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" GalleryItem"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "@/components/ui/gallery"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" useState "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "react"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGalleryFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"featured"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"]"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" useState"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"[0]."}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Gallery"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryItem"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryFeaturedImage src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"featured"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryFooter"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"map"}),n(s.span,{style:{color:"#FFF8"},children:"(({"}),n(s.span,{style:{color:"#FFF"},children:" imgelink "}),n(s.span,{style:{color:"#FFF8"},children:"},"}),n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryItem key"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"}>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryBottomImage"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" setFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:")}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onKeyUp"}),n(s.span,{style:{color:"#FFF8"},children:"={("}),n(s.span,{style:{color:"#FFF"},children:"e"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" e"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"key "}),n(s.span,{style:{color:"#FFF8"},children:"==="}),n(s.span,{style:{color:"#FFF8"},children:' "Enter"'}),n(s.span,{style:{color:"#FFF8"},children:" &&"}),n(s.span,{style:{color:"#FFF"},children:" setFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:")}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:"={("}),n(s.span,{style:{color:"#FFF"},children:"e"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" e"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"key "}),n(s.span,{style:{color:"#FFF8"},children:"==="}),n(s.span,{style:{color:"#FFF8"},children:' " "'}),n(s.span,{style:{color:"#FFF8"},children:" &&"}),n(s.span,{style:{color:"#FFF"},children:" setFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:")}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"gallery-image"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tabIndex"}),n(s.span,{style:{color:"#FFF8"},children:"={0}"}),n(s.span,{style:{color:"#FFF8"},children:" //"}),n(s.span,{style:{color:"#FFF4"},children:" Makes the image focusable"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" ))}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:"´:°•.°+.*•´.*:˚.°*.˚•´.°:°•.°•.*•´.*:˚.°*.˚•´.°:°•.°+.*•´.*:"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" CONSTANTS "}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:".•°:°.´+˚.*°.˚:*.´•*.+°.•°:´*.´•*.•°.•°:°.´:•˚°.*°.˚:*.´+°.•"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"const"}),n(s.span,{style:{color:"#FFF"},children:" IMAGES "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" ["})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1499696010180-025ef6e1a8f9?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1432462770865-65b70566d673?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1493246507139-91e8fad9978e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2940&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1518623489648-a173ef7824f3?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2762&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1682407186023-12c70a4a35e0?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2832&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"];"})})]})})}),n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-featured.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:'"use client"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" Gallery"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" GalleryBottomImage"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" GalleryFeaturedImage"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" GalleryFooter"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" GalleryItem"}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "@/components/ui/gallery"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" useState "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "react"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGalleryFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"featured"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"]"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" useState"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"[0]."}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Gallery"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryItem"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryFeaturedImage src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"featured"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryFooter"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"map"}),n(s.span,{style:{color:"#FFF8"},children:"(({"}),n(s.span,{style:{color:"#FFF"},children:" imgelink "}),n(s.span,{style:{color:"#FFF8"},children:"},"}),n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryItem key"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"}>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"GalleryBottomImage"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" setFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:")}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onKeyUp"}),n(s.span,{style:{color:"#FFF8"},children:"={("}),n(s.span,{style:{color:"#FFF"},children:"e"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" e"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"key "}),n(s.span,{style:{color:"#FFF8"},children:"==="}),n(s.span,{style:{color:"#FFF8"},children:' "Enter"'}),n(s.span,{style:{color:"#FFF8"},children:" &&"}),n(s.span,{style:{color:"#FFF"},children:" setFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:")}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:"={("}),n(s.span,{style:{color:"#FFF"},children:"e"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" e"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"key "}),n(s.span,{style:{color:"#FFF8"},children:"==="}),n(s.span,{style:{color:"#FFF8"},children:' " "'}),n(s.span,{style:{color:"#FFF8"},children:" &&"}),n(s.span,{style:{color:"#FFF"},children:" setFeatured"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:")}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"imgelink"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"gallery-image"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tabIndex"}),n(s.span,{style:{color:"#FFF8"},children:"={0}"}),n(s.span,{style:{color:"#FFF8"},children:" //"}),n(s.span,{style:{color:"#FFF4"},children:" Makes the image focusable"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" ))}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:"´:°•.°+.*•´.*:˚.°*.˚•´.°:°•.°•.*•´.*:˚.°*.˚•´.°:°•.°+.*•´.*:"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" CONSTANTS "}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:".•°:°.´+˚.*°.˚:*.´•*.+°.•°:´*.´•*.•°.•°:°.´:•˚°.*°.˚:*.´+°.•"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"const"}),n(s.span,{style:{color:"#FFF"},children:" IMAGES "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" ["})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1499696010180-025ef6e1a8f9?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1432462770865-65b70566d673?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1493246507139-91e8fad9978e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2940&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1518623489648-a173ef7824f3?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2762&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgelink"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1682407186023-12c70a4a35e0?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2832&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"];"})})]})})})]}),"\n",n(s.h2,{id:"demos",children:"Demos"}),"\n",n(s.h3,{id:"1-mansonry",children:"1. Mansonry"}),"\n",e(r,{name:"demos/ui/demo-gallery-mansonry",children:[n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-mansonry.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"//"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"//"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGalleryMansonry"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" IMAGE_STYLES "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:' "h-auto max-w-full rounded-lg object-cover object-center"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" ALT "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:' "gallery-photo"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid grid-cols-2 gap-4 md:grid-cols-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img1"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img2"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img3"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img4"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img5"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"imgTw"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img6"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"imgTw"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img4"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img4"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img2"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"const"}),n(s.span,{style:{color:"#FFF"},children:" IMAGES "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img1"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1432462770865-65b70566d673?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img2"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1629367494173-c78a56567877?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=927&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img3"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1493246507139-91e8fad9978e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2940&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img4"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1552960562-daf630e9278b?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=687&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img5"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1540553016722-983e48a2cd10?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=800&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img6"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1493246507139-91e8fad9978e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2940&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgTw"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://docs.material-tailwind.com/img/team-3.jpg"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"};"})})]})})}),n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-mansonry.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"//"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"//"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGalleryMansonry"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" IMAGE_STYLES "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:' "h-auto max-w-full rounded-lg object-cover object-center"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" ALT "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:' "gallery-photo"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid grid-cols-2 gap-4 md:grid-cols-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img1"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img2"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img3"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img4"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img5"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"imgTw"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img6"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"imgTw"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img4"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img4"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGE_STYLES"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"IMAGES"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"img2"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ALT"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"const"}),n(s.span,{style:{color:"#FFF"},children:" IMAGES "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img1"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1432462770865-65b70566d673?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img2"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1629367494173-c78a56567877?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=927&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img3"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1493246507139-91e8fad9978e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2940&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img4"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1552960562-daf630e9278b?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=687&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img5"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1540553016722-983e48a2cd10?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=800&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" img6"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1493246507139-91e8fad9978e?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2940&q=80"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" imgTw"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://docs.material-tailwind.com/img/team-3.jpg"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"};"})})]})})})]}),"\n",n(s.h3,{id:"2-unsplash-style",children:"2. Unsplash Style"}),"\n",e(r,{name:"demos/ui/demo-gallery-unsplash-style",children:[n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-unsplash-style.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:'"use client"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" AnimatePresence"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" motion"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" useInView "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "framer-motion"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF"},children:" Image "}),n(s.span,{style:{color:"#FFF8"},children:"from"}),n(s.span,{style:{color:"#FFF8"},children:' "next/image"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" useEffect"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" useRef"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" useState "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "react"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF"},children:" FileQuestion "}),n(s.span,{style:{color:"#FFF8"},children:"from"}),n(s.span,{style:{color:"#FFF8"},children:' "@/components/icons/file-question"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF"},children:" X "}),n(s.span,{style:{color:"#FFF8"},children:"from"}),n(s.span,{style:{color:"#FFF8"},children:' "@/components/icons/x"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGalleryUnsplashStyle"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"]"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" useState"}),n(s.span,{style:{color:"#FFF8"},children:"(null);"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" <>"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"container mx-auto sm:p-4 px-0 "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"columns-2 md:columns-3 2xl:columns-4 gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" <>"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"map"}),n(s.span,{style:{color:"#FFF8"},children:"(("}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"ImageItem"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" key"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" item"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" ))}"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" "})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Modal selected"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" "})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"interface"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Item"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" number"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"interface"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ImageItemProps"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" item"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Item"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" number "}),n(s.span,{style:{color:"#FFF8"},children:"|"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" any"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ImageItem"}),n(s.span,{style:{color:"#FFF8"},children:"({"}),n(s.span,{style:{color:"#FFF"},children:" item"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setSelected "}),n(s.span,{style:{color:"#FFF8"},children:"}:"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ImageItemProps"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" ref "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF"},children:" useRef"}),n(s.span,{style:{color:"#FFF8"},children:"(null);"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" isInView "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF"},children:" useInView"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"ref"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" once"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" true"}),n(s.span,{style:{color:"#FFF8"},children:" });"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.figure"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"hidden"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"isInView "}),n(s.span,{style:{color:"#FFF8"},children:"&&"}),n(s.span,{style:{color:"#FFF8"},children:' "visible"'}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" ref"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ref"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:"\"inline-block group w-full rounded-md relative dark:bg-black bg-white before:absolute before:top-0 before:content-[''] before:h-full before:w-full hover:before:bg-gradient-to-t dark:before:from-gray-900 before:from-gray-200/90 before:from-5% before:to-transparent before:to-90% cursor-pointer\""})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:")}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" layoutId"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF8"},children:"`card-${"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}`"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" whileHover"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scale"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1.025"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"url"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full bg-base-100 shadow-xl image-full cursor-pointer"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"flex flex-wrap mt-2 absolute bottom-0 left-0 p-2 group-hover:opacity-100 opacity-0 font-semibold "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"h1"}),n(s.span,{style:{color:"#FFF8"},children:">{"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"title"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"interface"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ItemType"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" number"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" any"}),n(s.span,{style:{color:"#FFF8"},children:"[];"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"interface"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ModalProps"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" selected"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ItemType"}),n(s.span,{style:{color:"#FFF8"},children:" |"}),n(s.span,{style:{color:"#FFF"},children:" null"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" any"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Modal"}),n(s.span,{style:{color:"#FFF8"},children:"({"}),n(s.span,{style:{color:"#FFF"},children:" selected"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setSelected "}),n(s.span,{style:{color:"#FFF8"},children:"}:"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ModalProps"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" itemVariants "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 10,"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" transition"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" duration"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.3,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" staggerChildren"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2,"}),n(s.span,{style:{color:"#FFF8"},children:" //"}),n(s.span,{style:{color:"#FFF4"},children:" Adjust the stagger delay as needed"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 20,"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" useEffect"}),n(s.span,{style:{color:"#FFF8"},children:"(()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" if"}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"body"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"classList"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"add"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"overflow-hidden"'}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" }"}),n(s.span,{style:{color:"#FFF8"},children:" else"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"body"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"classList"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"remove"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"overflow-hidden"'}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"event"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" KeyboardEvent"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" if"}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"event"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"key "}),n(s.span,{style:{color:"#FFF8"},children:"==="}),n(s.span,{style:{color:"#FFF8"},children:' "Escape"'}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"(false);"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"addEventListener"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"keydown"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"removeEventListener"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"keydown"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" },"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"]);"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"AnimatePresence"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"selected "}),n(s.span,{style:{color:"#FFF8"},children:"&&"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"(null)}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"fixed inset-0 bg-black/50 backdrop-blur-sm z-50 cursor-pointer overflow-y-scroll"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={("}),n(s.span,{style:{color:"#FFF"},children:"e"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" e"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"stopPropagation"}),n(s.span,{style:{color:"#FFF8"},children:"()}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" layoutId"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF8"},children:"`card-${"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}`"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full max-w-[1000px] relative overflow-x-hidden mx-auto my-8 cursor-default dark:bg-[#202020] bg-[#ebebeb] "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"button"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"absolute top-2 right-2 p-2 mix-blend-multiply"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"(null)}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"X "}),n(s.span,{style:{color:"#FFF8"},children:"/>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'" p-2 h-[70vh] rounded-md"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Image"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" width"}),n(s.span,{style:{color:"#FFF8"},children:"={400}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" height"}),n(s.span,{style:{color:"#FFF8"},children:"={400}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"img"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"url"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full h-full object-contain rounded-md dark:bg-black bg-white"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"initial"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"animate"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"exit"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"bg-white dark:bg-black dark:text-white text-black p-4 rounded-md px-8"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.h3 variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-2xl font-bold mb-2"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"title"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"flex gap-2"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"tags"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"map"}),n(s.span,{style:{color:"#FFF8"},children:"(("}),n(s.span,{style:{color:"#FFF"},children:"tag"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"bg-base-300 border dark:bg-gray-100 bg-gray-50 text-zinc-600 px-2 py-1 rounded-md"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" key"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"tag"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"tag"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" })}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.p variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"my-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"description"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.a"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"flex w-fit gap-2 cursor-pointer px-4 py-2 dark:hover:bg-black bg-black hover:bg-white hover:text-black text-white border-black dark:hover:text-white transition-colors border-2 dark:border-white dark:bg-white dark:text-black rounded-full font-semibold"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" href"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"#"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF"},children:" Download"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"FileQuestion "}),n(s.span,{style:{color:"#FFF8"},children:"/>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" )}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:"´:°•.°+.*•´.*:˚.°*.˚•´.°:°•.°•.*•´.*:˚.°*.˚•´.°:°•.°+.*•´.*:"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" ✨ CONSTANTS ✨ "}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:".•°:°.´+˚.*°.˚:*.´•*.+°.•°:´*.´•*.•°.•°:°.´:•˚°.*°.˚:*.´+°.•"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"const"}),n(s.span,{style:{color:"#FFF"},children:" items "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" ["})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1490682143684-14369e18dce8?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Sunrise Splendor"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The first light of day illuminates the rugged peaks, casting a golden glow over the scenic landscape."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Sunrise"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mountains"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Golden"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Scenic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Inspiring"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 2,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1501785888041-af3ef285b470?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Misty Mountain Pass"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A mysterious, fog-covered path winds through the serene and rugged mountain terrain."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Misty"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Path"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mysterious"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serene"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Rugged"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 3,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1501889088093-90b27410d97e?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Pathway to Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A rugged path leads adventurers toward distant mountain peaks, promising breathtaking views and challenging terrain."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Pathway"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Adventure"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Challenging"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Breathtaking"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 4,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1541623089466-8e777dd05d70?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Mountain Majesty"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The grandeur of towering peaks envelopes the landscape, presenting a dramatic scene of nature’s raw beauty."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Grandeur"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Nature"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Raw Beauty"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 5,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1519031465998-192aba33f8ad?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Snow-Capped Serenity"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Snow blankets the high mountain peaks, offering a serene and pristine white canvas against the crisp blue sky."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Snow-Capped"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serenity"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Pristine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Blue Sky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "High Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 7,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1469212044023-0e55b4b9745a?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Verdant Valley Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A lush green valley nestled between mountains, bathed in the warm light of a setting sun, offering a tranquil retreat."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Verdant"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Valley"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Tranquil"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Sunset"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 8,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1615729947596-a598e5de0ab3?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Rocky Ridges"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The rugged ridges of the mountain form a stark contrast against the soft clouds above, embodying the spirit of adventure."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Rocky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Ridges"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Contrast"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Adventure"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Clouds"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 6,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1589223050279-18d1f14059cf?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Floral Highlands"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Amidst the rugged mountainous terrain, bursts of wildflowers add a splash of color, showcasing nature’s resilience."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Floral"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Highlands"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wildflowers"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Colorful"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Resilience"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 9,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?q=80&w=2070&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Twilight Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "As twilight descends, the peaks of the mountains are silhouetted against a gradient evening sky, creating a peaceful end to the day."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Silhouette"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Evening Sky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaceful"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 10,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1510437097452-74ac66e27feb?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Eagle’s View"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "An aerial perspective showcases the breathtaking expanse of the mountain range, revealing nature’s grand design."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Aerial"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mountains"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Expanse"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Breathtaking"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Nature"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 11,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1526991757821-1307bf7800f6?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Alpine Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The last light of the day fades behind the alpine skyline, creating a striking silhouette against the twilight sky."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Alpine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Silhouette"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Skyline"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 12,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1516655855035-d5215bcb5604?q=80&w=800&auto=format&fit=cropD"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Winter’s Mantle"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Snow blankets the mountain peaks, transforming the landscape into a pristine winter wonderland."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Snow"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Winter"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Pristine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wonderland"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Cold"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 13,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1506104489822-562ca25152fe?q=80&w=2069&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Textured Terrain"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Close-up of the intricate textures and colors of a mountain’s surface, revealing the beauty of geological diversity."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Close-Up"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Textures"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Geology"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Colors"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Detailed"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 14,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1455156218388-5e61b526818b?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Fiery Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The setting sun casts fiery hues over the mountain peaks, enveloping the landscape in a warm, dramatic light."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Sunset"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Fiery"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Warm"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 15,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1575946240168-30dce77b926c?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Mirror Lake"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A serene mountain lake reflects the surrounding peaks perfectly, creating a symmetrical natural masterpiece."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Lake"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Reflection"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serene"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Symmetry"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Natural"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 16,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1469212044023-0e55b4b9745a?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Valley Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A panoramic view of a lush mountain valley, dotted with wildflowers and crisscrossed by meandering streams."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Panorama"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Valley"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Lush"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wildflowers"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Streams"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"];"})})]})})}),n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-unsplash-style.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:'"use client"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" AnimatePresence"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" motion"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" useInView "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "framer-motion"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF"},children:" Image "}),n(s.span,{style:{color:"#FFF8"},children:"from"}),n(s.span,{style:{color:"#FFF8"},children:' "next/image"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" useEffect"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" useRef"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" useState "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "react"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF"},children:" FileQuestion "}),n(s.span,{style:{color:"#FFF8"},children:"from"}),n(s.span,{style:{color:"#FFF8"},children:' "@/components/icons/file-question"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF"},children:" X "}),n(s.span,{style:{color:"#FFF8"},children:"from"}),n(s.span,{style:{color:"#FFF8"},children:' "@/components/icons/x"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGalleryUnsplashStyle"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"]"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" useState"}),n(s.span,{style:{color:"#FFF8"},children:"(null);"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" <>"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"container mx-auto sm:p-4 px-0 "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"columns-2 md:columns-3 2xl:columns-4 gap-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" <>"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"map"}),n(s.span,{style:{color:"#FFF8"},children:"(("}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"ImageItem"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" key"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" item"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" ))}"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" "})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Modal selected"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" "})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"interface"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Item"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" number"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"interface"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ImageItemProps"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" item"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Item"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" number "}),n(s.span,{style:{color:"#FFF8"},children:"|"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" any"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ImageItem"}),n(s.span,{style:{color:"#FFF8"},children:"({"}),n(s.span,{style:{color:"#FFF"},children:" item"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setSelected "}),n(s.span,{style:{color:"#FFF8"},children:"}:"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ImageItemProps"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" ref "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF"},children:" useRef"}),n(s.span,{style:{color:"#FFF8"},children:"(null);"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" isInView "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF"},children:" useInView"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"ref"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" once"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" true"}),n(s.span,{style:{color:"#FFF8"},children:" });"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.figure"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"hidden"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"isInView "}),n(s.span,{style:{color:"#FFF8"},children:"&&"}),n(s.span,{style:{color:"#FFF8"},children:' "visible"'}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" ref"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"ref"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:"\"inline-block group w-full rounded-md relative dark:bg-black bg-white before:absolute before:top-0 before:content-[''] before:h-full before:w-full hover:before:bg-gradient-to-t dark:before:from-gray-900 before:from-gray-200/90 before:from-5% before:to-transparent before:to-90% cursor-pointer\""})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:")}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" layoutId"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF8"},children:"`card-${"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}`"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" whileHover"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scale"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1.025"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"url"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full bg-base-100 shadow-xl image-full cursor-pointer"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"flex flex-wrap mt-2 absolute bottom-0 left-0 p-2 group-hover:opacity-100 opacity-0 font-semibold "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"h1"}),n(s.span,{style:{color:"#FFF8"},children:">{"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"title"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"interface"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ItemType"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" number"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" any"}),n(s.span,{style:{color:"#FFF8"},children:"[];"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" string"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"interface"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ModalProps"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" selected"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ItemType"}),n(s.span,{style:{color:"#FFF8"},children:" |"}),n(s.span,{style:{color:"#FFF"},children:" null"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" any"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Modal"}),n(s.span,{style:{color:"#FFF8"},children:"({"}),n(s.span,{style:{color:"#FFF"},children:" selected"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setSelected "}),n(s.span,{style:{color:"#FFF8"},children:"}:"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" ModalProps"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF"},children:" itemVariants "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 10,"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" transition"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" duration"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.3,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" staggerChildren"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2,"}),n(s.span,{style:{color:"#FFF8"},children:" //"}),n(s.span,{style:{color:"#FFF4"},children:" Adjust the stagger delay as needed"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 20,"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" useEffect"}),n(s.span,{style:{color:"#FFF8"},children:"(()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" if"}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"body"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"classList"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"add"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"overflow-hidden"'}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" }"}),n(s.span,{style:{color:"#FFF8"},children:" else"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"body"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"classList"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"remove"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"overflow-hidden"'}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"event"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" KeyboardEvent"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" if"}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"event"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"key "}),n(s.span,{style:{color:"#FFF8"},children:"==="}),n(s.span,{style:{color:"#FFF8"},children:' "Escape"'}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"(false);"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"addEventListener"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"keydown"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"removeEventListener"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"keydown"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" },"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"]);"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"AnimatePresence"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"selected "}),n(s.span,{style:{color:"#FFF8"},children:"&&"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"(null)}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"fixed inset-0 bg-black/50 backdrop-blur-sm z-50 cursor-pointer overflow-y-scroll"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={("}),n(s.span,{style:{color:"#FFF"},children:"e"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" e"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"stopPropagation"}),n(s.span,{style:{color:"#FFF8"},children:"()}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" layoutId"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF8"},children:"`card-${"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}`"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full max-w-[1000px] relative overflow-x-hidden mx-auto my-8 cursor-default dark:bg-[#202020] bg-[#ebebeb] "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"button"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"absolute top-2 right-2 p-2 mix-blend-multiply"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" setSelected"}),n(s.span,{style:{color:"#FFF8"},children:"(null)}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"X "}),n(s.span,{style:{color:"#FFF8"},children:"/>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'" p-2 h-[70vh] rounded-md"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Image"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" width"}),n(s.span,{style:{color:"#FFF8"},children:"={400}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" height"}),n(s.span,{style:{color:"#FFF8"},children:"={400}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"img"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"url"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full h-full object-contain rounded-md dark:bg-black bg-white"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"initial"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"animate"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"exit"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"bg-white dark:bg-black dark:text-white text-black p-4 rounded-md px-8"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.h3 variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-2xl font-bold mb-2"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"title"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"flex gap-2"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"tags"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"map"}),n(s.span,{style:{color:"#FFF8"},children:"(("}),n(s.span,{style:{color:"#FFF"},children:"tag"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"bg-base-300 border dark:bg-gray-100 bg-gray-50 text-zinc-600 px-2 py-1 rounded-md"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" key"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"tag"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"tag"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" })}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.p variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"my-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"selected"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"description"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.a"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" variants"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"itemVariants"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"flex w-fit gap-2 cursor-pointer px-4 py-2 dark:hover:bg-black bg-black hover:bg-white hover:text-black text-white border-black dark:hover:text-white transition-colors border-2 dark:border-white dark:bg-white dark:text-black rounded-full font-semibold"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" href"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"#"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF"},children:" Download"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"FileQuestion "}),n(s.span,{style:{color:"#FFF8"},children:"/>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" )}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:"´:°•.°+.*•´.*:˚.°*.˚•´.°:°•.°•.*•´.*:˚.°*.˚•´.°:°•.°+.*•´.*:"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" ✨ CONSTANTS ✨ "}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:".•°:°.´+˚.*°.˚:*.´•*.+°.•°:´*.´•*.•°.•°:°.´:•˚°.*°.˚:*.´+°.•"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"const"}),n(s.span,{style:{color:"#FFF"},children:" items "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" ["})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1490682143684-14369e18dce8?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Sunrise Splendor"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The first light of day illuminates the rugged peaks, casting a golden glow over the scenic landscape."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Sunrise"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mountains"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Golden"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Scenic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Inspiring"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 2,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1501785888041-af3ef285b470?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Misty Mountain Pass"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A mysterious, fog-covered path winds through the serene and rugged mountain terrain."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Misty"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Path"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mysterious"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serene"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Rugged"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 3,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1501889088093-90b27410d97e?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Pathway to Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A rugged path leads adventurers toward distant mountain peaks, promising breathtaking views and challenging terrain."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Pathway"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Adventure"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Challenging"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Breathtaking"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 4,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1541623089466-8e777dd05d70?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Mountain Majesty"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The grandeur of towering peaks envelopes the landscape, presenting a dramatic scene of nature’s raw beauty."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Grandeur"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Nature"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Raw Beauty"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 5,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1519031465998-192aba33f8ad?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Snow-Capped Serenity"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Snow blankets the high mountain peaks, offering a serene and pristine white canvas against the crisp blue sky."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Snow-Capped"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serenity"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Pristine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Blue Sky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "High Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 7,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1469212044023-0e55b4b9745a?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Verdant Valley Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A lush green valley nestled between mountains, bathed in the warm light of a setting sun, offering a tranquil retreat."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Verdant"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Valley"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Tranquil"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Sunset"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 8,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1615729947596-a598e5de0ab3?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Rocky Ridges"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The rugged ridges of the mountain form a stark contrast against the soft clouds above, embodying the spirit of adventure."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Rocky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Ridges"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Contrast"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Adventure"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Clouds"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 6,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1589223050279-18d1f14059cf?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Floral Highlands"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Amidst the rugged mountainous terrain, bursts of wildflowers add a splash of color, showcasing nature’s resilience."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Floral"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Highlands"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wildflowers"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Colorful"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Resilience"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 9,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?q=80&w=2070&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Twilight Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "As twilight descends, the peaks of the mountains are silhouetted against a gradient evening sky, creating a peaceful end to the day."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Silhouette"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Evening Sky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaceful"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 10,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1510437097452-74ac66e27feb?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Eagle’s View"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "An aerial perspective showcases the breathtaking expanse of the mountain range, revealing nature’s grand design."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Aerial"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mountains"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Expanse"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Breathtaking"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Nature"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 11,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1526991757821-1307bf7800f6?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Alpine Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The last light of the day fades behind the alpine skyline, creating a striking silhouette against the twilight sky."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Alpine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Silhouette"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Skyline"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 12,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1516655855035-d5215bcb5604?q=80&w=800&auto=format&fit=cropD"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Winter’s Mantle"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Snow blankets the mountain peaks, transforming the landscape into a pristine winter wonderland."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Snow"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Winter"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Pristine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wonderland"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Cold"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 13,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1506104489822-562ca25152fe?q=80&w=2069&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Textured Terrain"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Close-up of the intricate textures and colors of a mountain’s surface, revealing the beauty of geological diversity."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Close-Up"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Textures"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Geology"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Colors"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Detailed"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 14,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1455156218388-5e61b526818b?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Fiery Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The setting sun casts fiery hues over the mountain peaks, enveloping the landscape in a warm, dramatic light."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Sunset"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Fiery"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Warm"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 15,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1575946240168-30dce77b926c?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Mirror Lake"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A serene mountain lake reflects the surrounding peaks perfectly, creating a symmetrical natural masterpiece."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Lake"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Reflection"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serene"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Symmetry"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Natural"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 16,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1469212044023-0e55b4b9745a?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Valley Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A panoramic view of a lush mountain valley, dotted with wildflowers and crisscrossed by meandering streams."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Panorama"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Valley"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Lush"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wildflowers"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Streams"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"];"})})]})})})]}),"\n",n(s.h3,{id:"3-accordion",children:"3. Accordion"}),"\n",e(r,{name:"demos/ui/demo-gallery-accordion",children:[n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-accordion.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:'"use client"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" AnimatePresence"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" motion "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "framer-motion"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF"},children:" Image "}),n(s.span,{style:{color:"#FFF8"},children:"from"}),n(s.span,{style:{color:"#FFF8"},children:' "next/image"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" useEffect"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" useState "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "react"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"type"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" TODO"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" any"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGalleryAccordion"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"]"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" useState"}),n(s.span,{style:{color:"#FFF8"},children:"(5);"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"open"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"]"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" useState"}),n(s.span,{style:{color:"#FFF8"},children:"(false);"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" useEffect"}),n(s.span,{style:{color:"#FFF8"},children:"(()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" if"}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"open"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"body"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"classList"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"add"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"overflow-hidden"'}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" }"}),n(s.span,{style:{color:"#FFF8"},children:" else"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"body"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"classList"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"remove"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"overflow-hidden"'}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"event"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" KeyboardEvent"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" if"}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"event"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"key "}),n(s.span,{style:{color:"#FFF8"},children:"==="}),n(s.span,{style:{color:"#FFF8"},children:' "Escape"'}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"(false);"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"addEventListener"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"keydown"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"removeEventListener"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"keydown"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" },"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"open"}),n(s.span,{style:{color:"#FFF8"},children:"]);"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"relative w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Gallery items"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"AnimatePresence"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"open "}),n(s.span,{style:{color:"#FFF8"},children:"!=="}),n(s.span,{style:{color:"#FFF8"},children:" false"}),n(s.span,{style:{color:"#FFF8"},children:" &&"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" key"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"overlay"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"dark:bg-black/40 bg-white/40 backdrop-blur-sm fixed inset-0 z-50 top-0 left-0 bottom-0 right-0 w-full h-full grid place-content-center"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"(false);"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }}"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={("}),n(s.span,{style:{color:"#FFF"},children:"e"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" e"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"stopPropagation"}),n(s.span,{style:{color:"#FFF8"},children:"()}>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" //"}),n(s.span,{style:{color:"#FFF4"},children:" @ts-expect-error: Fix type later"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" layoutId"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"]."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-[400px] h-[400px] rounded-2xl cursor-default"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Image"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"]."}),n(s.span,{style:{color:"#FFF"},children:"url"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" width"}),n(s.span,{style:{color:"#FFF8"},children:"={400}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" height"}),n(s.span,{style:{color:"#FFF8"},children:"={400}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"single-image"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"rounded-2xl h-full w-full object-cover"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"article className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"dark:bg-base-dark bg-white rounded-md p-2 mt-2 border "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.h1"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scaleY"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scaleY"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scaleY"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" transition"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" duration"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2,"}),n(s.span,{style:{color:"#FFF"},children:" delay"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-xl font-semibold"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"]."}),n(s.span,{style:{color:"#FFF"},children:"title"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.p"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" -10,"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0,"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scaleY"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" -10,"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" transition"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" duration"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2,"}),n(s.span,{style:{color:"#FFF"},children:" delay"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-sm leading-[100%] py-2"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"]."}),n(s.span,{style:{color:"#FFF"},children:"description"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" )}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:"´:°•.°+.*•´.*:˚.°*.˚•´.°:°•.°•.*•´.*:˚.°*.˚•´.°:°•.°+.*•´.*:"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" ✨ FUNCTIONS ✨ "}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:".•°:°.´+˚.*°.˚:*.´•*.+°.•°:´*.´•*.•°.•°:°.´:•˚°.*°.˚:*.´+°.•"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Gallery"}),n(s.span,{style:{color:"#FFF8"},children:"({"}),n(s.span,{style:{color:"#FFF"},children:" items"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" index "}),n(s.span,{style:{color:"#FFF8"},children:"}:"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" TODO"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"rounded-md w-fit mx-auto md:gap-2 gap-1 flex pb-20 pt-10 "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"slice"}),n(s.span,{style:{color:"#FFF8"},children:"(0,"}),n(s.span,{style:{color:"#FFF8"},children:" 11)."}),n(s.span,{style:{color:"#FFF"},children:"map"}),n(s.span,{style:{color:"#FFF8"},children:"(("}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" TODO"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" i"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" number"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" whileTap"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scale"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.95"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF8"},children:"`rounded-2xl ${"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:" === "}),n(s.span,{style:{color:"#FFF"},children:"i"}),n(s.span,{style:{color:"#FFF8"},children:" ? "}),n(s.span,{style:{color:"#FFF8"},children:'"w-[250px] "'}),n(s.span,{style:{color:"#FFF8"},children:" : "}),n(s.span,{style:{color:"#FFF8"},children:'"xl:w-[50px] md:w-[30px] sm:w-[20px] w-[14px]"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" } h-[200px] flex-shrink-0 object-cover transition-[width] ease-in-out duration-300`"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" key"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onMouseEnter"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"i"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onMouseLeave"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"i"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"i"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"(true);"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"?."}),n(s.span,{style:{color:"#FFF"},children:"url"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" layoutId"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" })}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:"´:°•.°+.*•´.*:˚.°*.˚•´.°:°•.°•.*•´.*:˚.°*.˚•´.°:°•.°+.*•´.*:"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" ✨ CONSTANTS ✨ "}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:".•°:°.´+˚.*°.˚:*.´•*.+°.•°:´*.´•*.•°.•°:°.´:•˚°.*°.˚:*.´+°.•"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"const"}),n(s.span,{style:{color:"#FFF"},children:" items "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" ["})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1490682143684-14369e18dce8?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Sunrise Splendor"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The first light of day illuminates the rugged peaks, casting a golden glow over the scenic landscape."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Sunrise"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mountains"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Golden"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Scenic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Inspiring"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 2,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1501785888041-af3ef285b470?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Misty Mountain Pass"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A mysterious, fog-covered path winds through the serene and rugged mountain terrain."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Misty"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Path"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mysterious"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serene"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Rugged"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 3,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1501889088093-90b27410d97e?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Pathway to Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A rugged path leads adventurers toward distant mountain peaks, promising breathtaking views and challenging terrain."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Pathway"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Adventure"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Challenging"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Breathtaking"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 4,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1541623089466-8e777dd05d70?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Mountain Majesty"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The grandeur of towering peaks envelopes the landscape, presenting a dramatic scene of nature’s raw beauty."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Grandeur"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Nature"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Raw Beauty"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 5,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1519031465998-192aba33f8ad?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Snow-Capped Serenity"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Snow blankets the high mountain peaks, offering a serene and pristine white canvas against the crisp blue sky."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Snow-Capped"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serenity"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Pristine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Blue Sky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "High Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 7,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1469212044023-0e55b4b9745a?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Verdant Valley Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A lush green valley nestled between mountains, bathed in the warm light of a setting sun, offering a tranquil retreat."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Verdant"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Valley"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Tranquil"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Sunset"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 8,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1615729947596-a598e5de0ab3?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Rocky Ridges"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The rugged ridges of the mountain form a stark contrast against the soft clouds above, embodying the spirit of adventure."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Rocky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Ridges"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Contrast"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Adventure"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Clouds"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 6,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1589223050279-18d1f14059cf?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Floral Highlands"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Amidst the rugged mountainous terrain, bursts of wildflowers add a splash of color, showcasing nature’s resilience."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Floral"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Highlands"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wildflowers"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Colorful"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Resilience"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 9,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?q=80&w=2070&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Twilight Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "As twilight descends, the peaks of the mountains are silhouetted against a gradient evening sky, creating a peaceful end to the day."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Silhouette"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Evening Sky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaceful"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 10,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1510437097452-74ac66e27feb?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Eagle’s View"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "An aerial perspective showcases the breathtaking expanse of the mountain range, revealing nature’s grand design."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Aerial"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mountains"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Expanse"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Breathtaking"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Nature"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 11,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1526991757821-1307bf7800f6?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Alpine Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The last light of the day fades behind the alpine skyline, creating a striking silhouette against the twilight sky."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Alpine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Silhouette"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Skyline"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 12,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1516655855035-d5215bcb5604?q=80&w=800&auto=format&fit=cropD"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Winter’s Mantle"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Snow blankets the mountain peaks, transforming the landscape into a pristine winter wonderland."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Snow"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Winter"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Pristine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wonderland"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Cold"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 13,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1506104489822-562ca25152fe?q=80&w=2069&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Textured Terrain"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Close-up of the intricate textures and colors of a mountain’s surface, revealing the beauty of geological diversity."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Close-Up"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Textures"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Geology"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Colors"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Detailed"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 14,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1455156218388-5e61b526818b?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Fiery Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The setting sun casts fiery hues over the mountain peaks, enveloping the landscape in a warm, dramatic light."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Sunset"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Fiery"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Warm"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 15,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1575946240168-30dce77b926c?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Mirror Lake"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A serene mountain lake reflects the surrounding peaks perfectly, creating a symmetrical natural masterpiece."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Lake"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Reflection"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serene"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Symmetry"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Natural"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 16,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1469212044023-0e55b4b9745a?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Valley Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A panoramic view of a lush mountain valley, dotted with wildflowers and crisscrossed by meandering streams."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Panorama"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Valley"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Lush"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wildflowers"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Streams"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"];"})})]})})}),n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-accordion.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:'"use client"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" AnimatePresence"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" motion "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "framer-motion"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF"},children:" Image "}),n(s.span,{style:{color:"#FFF8"},children:"from"}),n(s.span,{style:{color:"#FFF8"},children:' "next/image"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" useEffect"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" useState "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "react"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"type"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" TODO"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" any"}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGalleryAccordion"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"]"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" useState"}),n(s.span,{style:{color:"#FFF8"},children:"(5);"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"open"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"]"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF"},children:" useState"}),n(s.span,{style:{color:"#FFF8"},children:"(false);"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" useEffect"}),n(s.span,{style:{color:"#FFF8"},children:"(()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" if"}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"open"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"body"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"classList"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"add"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"overflow-hidden"'}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" }"}),n(s.span,{style:{color:"#FFF8"},children:" else"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"body"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"classList"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"remove"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"overflow-hidden"'}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" const"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:" ="}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"event"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" KeyboardEvent"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" if"}),n(s.span,{style:{color:"#FFF8"},children:" ("}),n(s.span,{style:{color:"#FFF"},children:"event"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"key "}),n(s.span,{style:{color:"#FFF8"},children:"==="}),n(s.span,{style:{color:"#FFF8"},children:' "Escape"'}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"(false);"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"addEventListener"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"keydown"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" document"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"removeEventListener"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF8"},children:'"keydown"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" handleKeyDown"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" };"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" },"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF"},children:"open"}),n(s.span,{style:{color:"#FFF8"},children:"]);"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"relative w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Gallery items"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"AnimatePresence"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"open "}),n(s.span,{style:{color:"#FFF8"},children:"!=="}),n(s.span,{style:{color:"#FFF8"},children:" false"}),n(s.span,{style:{color:"#FFF8"},children:" &&"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" key"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"overlay"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"dark:bg-black/40 bg-white/40 backdrop-blur-sm fixed inset-0 z-50 top-0 left-0 bottom-0 right-0 w-full h-full grid place-content-center"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"(false);"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }}"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={("}),n(s.span,{style:{color:"#FFF"},children:"e"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF"},children:" e"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"stopPropagation"}),n(s.span,{style:{color:"#FFF8"},children:"()}>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.div"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" //"}),n(s.span,{style:{color:"#FFF4"},children:" @ts-expect-error: Fix type later"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" layoutId"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"]."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-[400px] h-[400px] rounded-2xl cursor-default"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"Image"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"]."}),n(s.span,{style:{color:"#FFF"},children:"url"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" width"}),n(s.span,{style:{color:"#FFF8"},children:"={400}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" height"}),n(s.span,{style:{color:"#FFF8"},children:"={400}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"single-image"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"rounded-2xl h-full w-full object-cover"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"article className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"dark:bg-base-dark bg-white rounded-md p-2 mt-2 border "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.h1"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scaleY"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scaleY"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scaleY"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" transition"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" duration"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2,"}),n(s.span,{style:{color:"#FFF"},children:" delay"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-xl font-semibold"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"]."}),n(s.span,{style:{color:"#FFF"},children:"title"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.p"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" initial"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" -10,"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" animate"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" y"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0,"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" exit"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scaleY"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" -10,"}),n(s.span,{style:{color:"#FFF"},children:" opacity"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" transition"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" duration"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2,"}),n(s.span,{style:{color:"#FFF"},children:" delay"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.2"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-sm leading-[100%] py-2"'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" >"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"["}),n(s.span,{style:{color:"#FFF"},children:"index"}),n(s.span,{style:{color:"#FFF8"},children:"]."}),n(s.span,{style:{color:"#FFF"},children:"description"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" )}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:"´:°•.°+.*•´.*:˚.°*.˚•´.°:°•.°•.*•´.*:˚.°*.˚•´.°:°•.°+.*•´.*:"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" ✨ FUNCTIONS ✨ "}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:".•°:°.´+˚.*°.˚:*.´•*.+°.•°:´*.´•*.•°.•°:°.´:•˚°.*°.˚:*.´+°.•"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" Gallery"}),n(s.span,{style:{color:"#FFF8"},children:"({"}),n(s.span,{style:{color:"#FFF"},children:" items"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" index "}),n(s.span,{style:{color:"#FFF8"},children:"}:"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" TODO"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"rounded-md w-fit mx-auto md:gap-2 gap-1 flex pb-20 pt-10 "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:"items"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"slice"}),n(s.span,{style:{color:"#FFF8"},children:"(0,"}),n(s.span,{style:{color:"#FFF8"},children:" 11)."}),n(s.span,{style:{color:"#FFF"},children:"map"}),n(s.span,{style:{color:"#FFF8"},children:"(("}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" TODO"}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF"},children:" i"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF"},children:" number"}),n(s.span,{style:{color:"#FFF8"},children:")"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"motion.img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" whileTap"}),n(s.span,{style:{color:"#FFF8"},children:"={{"}),n(s.span,{style:{color:"#FFF"},children:" scale"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 0.95"}),n(s.span,{style:{color:"#FFF8"},children:" }}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF8"},children:"`rounded-2xl ${"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" index"}),n(s.span,{style:{color:"#FFF8"},children:" === "}),n(s.span,{style:{color:"#FFF"},children:"i"}),n(s.span,{style:{color:"#FFF8"},children:" ? "}),n(s.span,{style:{color:"#FFF8"},children:'"w-[250px] "'}),n(s.span,{style:{color:"#FFF8"},children:" : "}),n(s.span,{style:{color:"#FFF8"},children:'"xl:w-[50px] md:w-[30px] sm:w-[20px] w-[14px]"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" } h-[200px] flex-shrink-0 object-cover transition-[width] ease-in-out duration-300`"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" key"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onMouseEnter"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"i"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onMouseLeave"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"i"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" onClick"}),n(s.span,{style:{color:"#FFF8"},children:"={()"}),n(s.span,{style:{color:"#FFF8"},children:" =>"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setIndex"}),n(s.span,{style:{color:"#FFF8"},children:"("}),n(s.span,{style:{color:"#FFF"},children:"i"}),n(s.span,{style:{color:"#FFF8"},children:");"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" setOpen"}),n(s.span,{style:{color:"#FFF8"},children:"(true);"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" }}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"?."}),n(s.span,{style:{color:"#FFF"},children:"url"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" layoutId"}),n(s.span,{style:{color:"#FFF8"},children:"={"}),n(s.span,{style:{color:"#FFF"},children:"item"}),n(s.span,{style:{color:"#FFF8"},children:"."}),n(s.span,{style:{color:"#FFF"},children:"id"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" })}"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:"´:°•.°+.*•´.*:˚.°*.˚•´.°:°•.°•.*•´.*:˚.°*.˚•´.°:°•.°+.*•´.*:"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" ✨ CONSTANTS ✨ "}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:".•°:°.´+˚.*°.˚:*.´•*.+°.•°:´*.´•*.•°.•°:°.´:•˚°.*°.˚:*.´+°.•"}),n(s.span,{style:{color:"#FFF8"},children:"*/"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"const"}),n(s.span,{style:{color:"#FFF"},children:" items "}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:" ["})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 1,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1490682143684-14369e18dce8?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Sunrise Splendor"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The first light of day illuminates the rugged peaks, casting a golden glow over the scenic landscape."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Sunrise"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mountains"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Golden"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Scenic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Inspiring"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 2,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1501785888041-af3ef285b470?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Misty Mountain Pass"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A mysterious, fog-covered path winds through the serene and rugged mountain terrain."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Misty"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Path"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mysterious"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serene"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Rugged"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 3,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1501889088093-90b27410d97e?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Pathway to Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A rugged path leads adventurers toward distant mountain peaks, promising breathtaking views and challenging terrain."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Pathway"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Adventure"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Challenging"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Breathtaking"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 4,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1541623089466-8e777dd05d70?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Mountain Majesty"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The grandeur of towering peaks envelopes the landscape, presenting a dramatic scene of nature’s raw beauty."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Grandeur"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Nature"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Raw Beauty"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 5,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1519031465998-192aba33f8ad?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Snow-Capped Serenity"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Snow blankets the high mountain peaks, offering a serene and pristine white canvas against the crisp blue sky."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Snow-Capped"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serenity"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Pristine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Blue Sky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "High Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 7,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1469212044023-0e55b4b9745a?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Verdant Valley Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A lush green valley nestled between mountains, bathed in the warm light of a setting sun, offering a tranquil retreat."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Verdant"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Valley"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Tranquil"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Sunset"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 8,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1615729947596-a598e5de0ab3?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Rocky Ridges"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The rugged ridges of the mountain form a stark contrast against the soft clouds above, embodying the spirit of adventure."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Rocky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Ridges"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Contrast"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Adventure"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Clouds"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 6,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1589223050279-18d1f14059cf?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Floral Highlands"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Amidst the rugged mountainous terrain, bursts of wildflowers add a splash of color, showcasing nature’s resilience."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Floral"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Highlands"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wildflowers"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Colorful"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Resilience"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 9,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?q=80&w=2070&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Twilight Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "As twilight descends, the peaks of the mountains are silhouetted against a gradient evening sky, creating a peaceful end to the day."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Silhouette"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Evening Sky"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaceful"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 10,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1510437097452-74ac66e27feb?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Eagle’s View"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "An aerial perspective showcases the breathtaking expanse of the mountain range, revealing nature’s grand design."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Aerial"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Mountains"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Expanse"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Breathtaking"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Nature"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 11,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1526991757821-1307bf7800f6?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Alpine Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The last light of the day fades behind the alpine skyline, creating a striking silhouette against the twilight sky."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Twilight"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Alpine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Silhouette"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Skyline"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 12,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1516655855035-d5215bcb5604?q=80&w=800&auto=format&fit=cropD"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Winter’s Mantle"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Snow blankets the mountain peaks, transforming the landscape into a pristine winter wonderland."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Snow"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Winter"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Pristine"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wonderland"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Cold"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 13,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1506104489822-562ca25152fe?q=80&w=2069&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Textured Terrain"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "Close-up of the intricate textures and colors of a mountain’s surface, revealing the beauty of geological diversity."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Close-Up"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Textures"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Geology"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Colors"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Detailed"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 14,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1455156218388-5e61b526818b?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Fiery Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "The setting sun casts fiery hues over the mountain peaks, enveloping the landscape in a warm, dramatic light."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Sunset"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Fiery"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Dramatic"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Warm"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Peaks"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 15,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1575946240168-30dce77b926c?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Mirror Lake"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A serene mountain lake reflects the surrounding peaks perfectly, creating a symmetrical natural masterpiece."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Lake"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Reflection"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Serene"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Symmetry"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Natural"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" {"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" id"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" 16,"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" url"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "https://images.unsplash.com/photo-1469212044023-0e55b4b9745a?q=80&w=800&auto=format&fit=crop"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" title"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:' "Valley Vista"'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" description"}),n(s.span,{style:{color:"#FFF8"},children:":"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:' "A panoramic view of a lush mountain valley, dotted with wildflowers and crisscrossed by meandering streams."'}),n(s.span,{style:{color:"#FFF8"},children:","})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" tags"}),n(s.span,{style:{color:"#FFF8"},children:":"}),n(s.span,{style:{color:"#FFF8"},children:" ["}),n(s.span,{style:{color:"#FFF8"},children:'"Panorama"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Valley"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Lush"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Wildflowers"'}),n(s.span,{style:{color:"#FFF8"},children:","}),n(s.span,{style:{color:"#FFF8"},children:' "Streams"'}),n(s.span,{style:{color:"#FFF8"},children:"],"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" },"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"];"})})]})})})]}),"\n",n(s.h3,{id:"4-sticky",children:"4. Sticky"}),"\n",e(r,{name:"demos/ui/demo-gallery-sticky",children:[n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-sticky.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:'"use client"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" ReactLenis "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "lenis/react"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGallerySticky"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"ReactLenis root"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"main className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"bg-black"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"wrapper"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"section className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-white h-screen w-full bg-slate-950 grid place-content-center sticky top-0"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"absolute bottom-0 left-0 right-0 top-0 bg-[linear-gradient(to_right,#4f4f4f2e_1px,transparent_1px),linear-gradient(to_bottom,#4f4f4f2e_1px,transparent_1px)] bg-[size:54px_54px] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_0%,#000_70%,transparent_100%)]"'}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"h1 className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"2xl:text-7xl text-5xl px-8 font-semibold text-center tracking-tight leading-[120%]"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF"},children:" Create Gallery In a Better Way"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"br "}),n(s.span,{style:{color:"#FFF8"},children:"/>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" Using CSS sticky properties "}),n(s.span,{style:{color:"#FFF8"},children:"<"}),n(s.span,{style:{color:"#FFF"},children:"br "}),n(s.span,{style:{color:"#FFF8"},children:"/>"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF"},children:" Scroll down! 👇"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"section className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-white w-full bg-slate-950 "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid grid-cols-12 gap-2"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" left part "}),n(s.span,{style:{color:"#FFF8"},children:"*/"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-2 col-span-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'" w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1718838541476-d04e71caa347?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'" w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1715432362539-6ab2ab480db2?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'" w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1718601980986-0ce75101d52d?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1685904042960-66242a0ac352?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1719411182379-ffd97c1f7ebf?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" sticky part "}),n(s.span,{style:{color:"#FFF8"},children:"*/"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"sticky top-0 h-screen w-full col-span-4 gap-2 grid grid-rows-3"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full h-full "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1718969604981-de826f44ce15?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 h-full w-full align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full h-full "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1476180814856-a36609db0493?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 h-full w-full align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full h-full "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1595407660626-db35dcd16609?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 h-full w-full align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" right part "}),n(s.span,{style:{color:"#FFF8"},children:"*/"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-2 col-span-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1719547907790-f661a88302c2?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1599054799131-4b09c73a63cf?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1719963532023-01b573d1d584?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1714328101501-3594de6cb80f?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1719554873571-0fd6bf322bb1?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"footer className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"group bg-slate-950 "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"h1 className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-[16vw] translate-y-20 leading-[100%] uppercase font-semibold text-center bg-gradient-to-r from-gray-400 to-gray-800 bg-clip-text text-transparent transition-all ease-linear"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF"},children:" ui-layout"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"bg-black h-40 relative z-10 grid place-content-center text-2xl rounded-tr-full rounded-tl-full"'}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})})]})})}),n(s.figure,{__src__:"registry/default/demos/ui/demo-gallery-sticky.tsx","data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:e(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:[e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:'"use client"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"import"}),n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF"},children:" ReactLenis "}),n(s.span,{style:{color:"#FFF8"},children:"}"}),n(s.span,{style:{color:"#FFF8"},children:" from"}),n(s.span,{style:{color:"#FFF8"},children:' "lenis/react"'}),n(s.span,{style:{color:"#FFF8"},children:";"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:"export"}),n(s.span,{style:{color:"#FFF8"},children:" function"}),n(s.span,{style:{color:"#FFF",fontWeight:"bold"},children:" DemoGallerySticky"}),n(s.span,{style:{color:"#FFF8"},children:"()"}),n(s.span,{style:{color:"#FFF8"},children:" {"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" return"}),n(s.span,{style:{color:"#FFF8"},children:" ("})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"ReactLenis root"}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"main className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"bg-black"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"wrapper"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"section className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-white h-screen w-full bg-slate-950 grid place-content-center sticky top-0"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"absolute bottom-0 left-0 right-0 top-0 bg-[linear-gradient(to_right,#4f4f4f2e_1px,transparent_1px),linear-gradient(to_bottom,#4f4f4f2e_1px,transparent_1px)] bg-[size:54px_54px] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_0%,#000_70%,transparent_100%)]"'}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"h1 className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"2xl:text-7xl text-5xl px-8 font-semibold text-center tracking-tight leading-[120%]"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF"},children:" Create Gallery In a Better Way"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"br "}),n(s.span,{style:{color:"#FFF8"},children:"/>"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" Using CSS sticky properties "}),n(s.span,{style:{color:"#FFF8"},children:"<"}),n(s.span,{style:{color:"#FFF"},children:"br "}),n(s.span,{style:{color:"#FFF8"},children:"/>"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF"},children:" Scroll down! 👇"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"section className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-white w-full bg-slate-950 "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid grid-cols-12 gap-2"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" left part "}),n(s.span,{style:{color:"#FFF8"},children:"*/"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-2 col-span-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'" w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1718838541476-d04e71caa347?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'" w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1715432362539-6ab2ab480db2?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'" w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1718601980986-0ce75101d52d?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1685904042960-66242a0ac352?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1719411182379-ffd97c1f7ebf?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" sticky part "}),n(s.span,{style:{color:"#FFF8"},children:"*/"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"sticky top-0 h-screen w-full col-span-4 gap-2 grid grid-rows-3"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full h-full "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1718969604981-de826f44ce15?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 h-full w-full align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full h-full "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1476180814856-a36609db0493?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 h-full w-full align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full h-full "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1595407660626-db35dcd16609?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 h-full w-full align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" {"}),n(s.span,{style:{color:"#FFF8"},children:"/*"}),n(s.span,{style:{color:"#FFF4"},children:" right part "}),n(s.span,{style:{color:"#FFF8"},children:"*/"}),n(s.span,{style:{color:"#FFF8"},children:"}"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"grid gap-2 col-span-4"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1719547907790-f661a88302c2?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1599054799131-4b09c73a63cf?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1719963532023-01b573d1d584?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1714328101501-3594de6cb80f?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"figure className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"w-full"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"img"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" src"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"https://images.unsplash.com/photo-1719554873571-0fd6bf322bb1?w=500&auto=format&fit=crop"'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" alt"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'""'})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF"},children:" className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"transition-all duration-300 w-full h-96 align-bottom object-cover rounded-md "'})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" />"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:" "}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"footer className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"group bg-slate-950 "'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"h1 className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"text-[16vw] translate-y-20 leading-[100%] uppercase font-semibold text-center bg-gradient-to-r from-gray-400 to-gray-800 bg-clip-text text-transparent transition-all ease-linear"'}),n(s.span,{style:{color:"#FFF8"},children:">"})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF"},children:" ui-layout"})}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" <"}),n(s.span,{style:{color:"#FFF"},children:"div className"}),n(s.span,{style:{color:"#FFF8"},children:"="}),n(s.span,{style:{color:"#FFF8"},children:'"bg-black h-40 relative z-10 grid place-content-center text-2xl rounded-tr-full rounded-tl-full"'}),n(s.span,{style:{color:"#FFF8"},children:" />"})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",e(s.span,{"data-line":"",children:[n(s.span,{style:{color:"#FFF8"},children:" "})]}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:" );"})}),"\n",n(s.span,{"data-line":"",children:n(s.span,{style:{color:"#FFF8"},children:"}"})})]})})})]}),"\n",n(s.h2,{id:"installation",children:"Installation"}),"\n",n(s.p,{children:"Not available yet."}),"\n",n(s.h2,{id:"usage",children:"Usage"}),"\n",n(s.figure,{"data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:n(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:n(s.span,{"data-line":"",children:" "})})})}),"\n",n(s.figure,{"data-rehype-pretty-code-figure":"",children:n(s.pre,{className:"Lambda Studio — Blackout",style:{backgroundColor:"#000",color:"#fff"},tabIndex:"0","data-language":"tsx","data-theme":"Lambda Studio — Blackout",children:n(s.code,{"data-language":"tsx","data-theme":"Lambda Studio — Blackout",style:{display:"grid"},children:n(s.span,{"data-line":"",children:" "})})})})]})}return{default:function(l={}){const{wrapper:e}=l.components||{};return e?n(e,{...l,children:n(_createMdxContent,{...l})}):_createMdxContent(l)}};

Clip Path Video

Demos

1. Clip Path Hexagon

Installation

Usage