troncell-vue-component 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +144 -0
- package/dist/index.cjs +742 -0
- package/dist/index.mjs +10142 -0
- package/dist/troncell-vue-component.css +1 -0
- package/dist/types/components/3DCardComp/component/CardBody.vue.d.ts +21 -0
- package/dist/types/components/3DCardComp/component/CardContainer.vue.d.ts +27 -0
- package/dist/types/components/3DCardComp/component/Cardltem.vue.d.ts +89 -0
- package/dist/types/components/3DCardComp/component/card-3d.d.ts +4 -0
- package/dist/types/components/3DCardComp/component/useMouseState.d.ts +4 -0
- package/dist/types/components/3DCardComp/index.vue.d.ts +50 -0
- package/dist/types/components/AnimatedTestimonialsComp/component/AnimatedTestimonials.vue.d.ts +39 -0
- package/dist/types/components/AnimatedTestimonialsComp/index.vue.d.ts +53 -0
- package/dist/types/components/AuroraComp/component/Aurora.vue.d.ts +23 -0
- package/dist/types/components/AuroraComp/index.vue.d.ts +35 -0
- package/dist/types/components/BendingGalleryComp/component/BendingGallery.vue.d.ts +19 -0
- package/dist/types/components/BendingGalleryComp/index.vue.d.ts +35 -0
- package/dist/types/components/BentoGridComp/component/BentoGrid.vue.d.ts +21 -0
- package/dist/types/components/BentoGridComp/component/BentoGridltem.vue.d.ts +24 -0
- package/dist/types/components/BentoGridComp/index.vue.d.ts +33 -0
- package/dist/types/components/Carousel3DComp/component/Carousel3D.vue.d.ts +18 -0
- package/dist/types/components/Carousel3DComp/index.vue.d.ts +27 -0
- package/dist/types/components/ContainerScrollComp/component/ContainerScroll.vue.d.ts +22 -0
- package/dist/types/components/ContainerScrollComp/component/ContainerScrollCard.vue.d.ts +23 -0
- package/dist/types/components/ContainerScrollComp/component/ContainerScrollTitle.vue.d.ts +21 -0
- package/dist/types/components/ContainerScrollComp/index.vue.d.ts +37 -0
- package/dist/types/components/DirectionAwareHoverComp/component/DirectionAwareHover.vue.d.ts +31 -0
- package/dist/types/components/DirectionAwareHoverComp/index.vue.d.ts +42 -0
- package/dist/types/components/DockComp/component/Dock.vue.d.ts +35 -0
- package/dist/types/components/DockComp/component/DockSeparator.vue.d.ts +2 -0
- package/dist/types/components/DockComp/component/Docklcon.vue.d.ts +21 -0
- package/dist/types/components/DockComp/component/index.d.ts +3 -0
- package/dist/types/components/DockComp/component/injectionKeys.d.ts +7 -0
- package/dist/types/components/DockComp/component/types.d.ts +2 -0
- package/dist/types/components/DockComp/index.vue.d.ts +27 -0
- package/dist/types/components/DomeGalleryComp/component/DomeGallery.vue.d.ts +49 -0
- package/dist/types/components/DomeGalleryComp/index.vue.d.ts +53 -0
- package/dist/types/components/ExpandableGalleryComp/component/ExpandableGallery.vue.d.ts +7 -0
- package/dist/types/components/ExpandableGalleryComp/index.vue.d.ts +17 -0
- package/dist/types/components/FluidCursorComp/component/FluidCursor.vue.d.ts +42 -0
- package/dist/types/components/FluidCursorComp/index.vue.d.ts +23 -0
- package/dist/types/components/IButtonComp/index.vue.d.ts +55 -0
- package/dist/types/components/IInputComp/index.vue.d.ts +28 -0
- package/dist/types/components/IconCloudComp/component/IconCloud.vue.d.ts +5 -0
- package/dist/types/components/IconCloudComp/component/index.d.ts +14 -0
- package/dist/types/components/IconCloudComp/index.vue.d.ts +29 -0
- package/dist/types/components/InfiniteGridComp/component/DisposalManager.d.ts +121 -0
- package/dist/types/components/InfiniteGridComp/component/EventHandler.d.ts +126 -0
- package/dist/types/components/InfiniteGridComp/component/GridManager.d.ts +191 -0
- package/dist/types/components/InfiniteGridComp/component/InfiniteGrid.vue.d.ts +16 -0
- package/dist/types/components/InfiniteGridComp/component/InfiniteGridClass.d.ts +382 -0
- package/dist/types/components/InfiniteGridComp/component/PostProcessShader.d.ts +116 -0
- package/dist/types/components/InfiniteGridComp/component/createTexture.d.ts +99 -0
- package/dist/types/components/InfiniteGridComp/component/shaders.d.ts +4 -0
- package/dist/types/components/InfiniteGridComp/component/types.d.ts +122 -0
- package/dist/types/components/InfiniteGridComp/index.vue.d.ts +47 -0
- package/dist/types/components/InfiniteMenuComp/component/InfiniteMenu.vue.d.ts +13 -0
- package/dist/types/components/InfiniteMenuComp/index.vue.d.ts +33 -0
- package/dist/types/components/InspiraImageParticlesComp/component/inspiraImageParticles.d.ts +107 -0
- package/dist/types/components/InspiraImageParticlesComp/index.vue.d.ts +24 -0
- package/dist/types/components/InteractiveGridPatternComp/component/InteractiveGridPattern.vue.d.ts +14 -0
- package/dist/types/components/InteractiveGridPatternComp/index.vue.d.ts +29 -0
- package/dist/types/components/LightningComp/component/Lightning.vue.d.ts +17 -0
- package/dist/types/components/LightningComp/index.vue.d.ts +35 -0
- package/dist/types/components/LinkPreviewComp/component/LinkPreview.vue.d.ts +19 -0
- package/dist/types/components/LinkPreviewComp/index.vue.d.ts +11 -0
- package/dist/types/components/MagnifyingGlassComp/component/Beams.vue.d.ts +2 -0
- package/dist/types/components/MagnifyingGlassComp/component/Lens.vue.d.ts +45 -0
- package/dist/types/components/MagnifyingGlassComp/component/Rays.vue.d.ts +5 -0
- package/dist/types/components/MagnifyingGlassComp/index.vue.d.ts +41 -0
- package/dist/types/components/MarqueeComp/component/Marquee.vue.d.ts +28 -0
- package/dist/types/components/MarqueeComp/component/ReviewCard.vue.d.ts +8 -0
- package/dist/types/components/MarqueeComp/index.vue.d.ts +42 -0
- package/dist/types/components/MeteorsComp/component/Meteors.vue.d.ts +16 -0
- package/dist/types/components/MeteorsComp/index.vue.d.ts +45 -0
- package/dist/types/components/Navigation.vue.d.ts +2 -0
- package/dist/types/components/PhotoGalleryComp/component/PhotoGallery.vue.d.ts +9 -0
- package/dist/types/components/PhotoGalleryComp/index.vue.d.ts +38 -0
- package/dist/types/components/RegistrationFormComp/index.vue.d.ts +15 -0
- package/dist/types/components/RippleButtonComp/component/RippleButton.vue.d.ts +35 -0
- package/dist/types/components/RippleButtonComp/index.vue.d.ts +35 -0
- package/dist/types/components/RollingGalleryComp/component/RollingGallery.vue.d.ts +29 -0
- package/dist/types/components/RollingGalleryComp/index.vue.d.ts +45 -0
- package/dist/types/components/ScratchToRevealComp/component/ScratchToReveal.vue.d.ts +37 -0
- package/dist/types/components/ScratchToRevealComp/index.vue.d.ts +37 -0
- package/dist/types/components/ScrollIslandComp/component/AnimatedCircularProgressBar.vue.d.ts +22 -0
- package/dist/types/components/ScrollIslandComp/component/ScrollIsland.vue.d.ts +19 -0
- package/dist/types/components/ScrollIslandComp/index.vue.d.ts +41 -0
- package/dist/types/components/SparkElementComp/component/Sparkles.vue.d.ts +20 -0
- package/dist/types/components/SparkElementComp/index.vue.d.ts +13 -0
- package/dist/types/components/SparklesTextComp/component/SparklesText.vue.d.ts +17 -0
- package/dist/types/components/SparklesTextComp/index.vue.d.ts +13 -0
- package/dist/types/components/SplineComp/component/ParentSize.vue.d.ts +55 -0
- package/dist/types/components/SplineComp/component/Spline.vue.d.ts +67 -0
- package/dist/types/components/SplineComp/index.vue.d.ts +41 -0
- package/dist/types/components/StackComp/component/Stack.vue.d.ts +36 -0
- package/dist/types/components/StackComp/index.vue.d.ts +49 -0
- package/dist/types/components/TargetCursorComp/component/TargetCursor.vue.d.ts +15 -0
- package/dist/types/components/TargetCursorComp/index.vue.d.ts +50 -0
- package/dist/types/components/TestimonialSliderComp/component/TestimonialSlider.vue.d.ts +19 -0
- package/dist/types/components/TestimonialSliderComp/index.vue.d.ts +35 -0
- package/dist/types/components/Text3dComp/component/Text3d.vue.d.ts +40 -0
- package/dist/types/components/Text3dComp/index.vue.d.ts +33 -0
- package/dist/types/components/TextGenerateEffectComp/component/TextGenerateEffect.vue.d.ts +16 -0
- package/dist/types/components/TextGenerateEffectComp/index.vue.d.ts +29 -0
- package/dist/types/components/TimelineComp/component/Timeline.vue.d.ts +37 -0
- package/dist/types/components/TimelineComp/index.vue.d.ts +41 -0
- package/dist/types/components/TracingBeamComp/component/TracingBeam.vue.d.ts +27 -0
- package/dist/types/components/TracingBeamComp/index.vue.d.ts +47 -0
- package/dist/types/index.d.ts +42 -0
- package/dist/types/utils/lib/utils.d.ts +3 -0
- package/dist/types/utils/sensing-sample-sdk-quorra-1.0.d.ts +67 -0
- package/dist/types/utils/sensing-sample-sdk-webview-1.0.d.ts +45 -0
- package/dist/types/utils/useDynamicComponents.d.ts +42 -0
- package/package.json +83 -0
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,742 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),as=require("clsx"),rs=require("tailwind-merge"),de=require("motion-v"),at=require("lucide-vue-next"),ee=require("ogl"),$e=require("three"),Ce=require("@vueuse/core"),ls=require("@iconify/vue"),Vt=require("vue-router"),he=require("gsap"),F=require("gl-matrix"),cs=require("@number-flow/vue");require("@vueuse/motion");const us=require("@splinetool/runtime");function ds(n){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const i in n)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(n,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>n[i]})}}return t.default=n,Object.freeze(t)}const nt=ds($e);function hs(){const n=e.ref(!1);function t(i){n.value=i}return{isMouseEntered:e.readonly(n),setMouseEntered:t}}const ms=e.defineComponent({__name:"CardContainer",props:{class:String,containerClass:String},setup(n){const t=e.ref(null),i=hs();e.provide("use3DCardMouseState",i);function s(l){if(!t.value)return;const{left:a,top:c,width:u,height:d}=t.value.getBoundingClientRect(),m=(l.clientX-a-u/2)/25,h=(l.clientY-c-d/2)/25;t.value.style.transform=`rotateY(${m}deg) rotateX(${h}deg)`}function o(){i.setMouseEntered(!0)}function r(){t.value&&(i.setMouseEntered(!1),t.value.style.transform="rotateY(0deg) rotateX(0deg)")}return(l,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["flex items-center justify-center p-2",n.containerClass]),style:{perspective:"1000px"}},[e.createElementVNode("div",{ref_key:"containerRef",ref:t,class:e.normalizeClass(["relative flex items-center justify-center transition-all duration-200 ease-linear",l.$props.class]),style:{"transform-style":"preserve-3d"},onMouseenter:o,onMousemove:s,onMouseleave:r},[e.renderSlot(l.$slots,"default")],34)],2))}});function K(...n){return rs.twMerge(as.clsx(n))}const fs=e.defineComponent({__name:"CardBody",props:{class:String},setup(n){return(t,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("h-96 w-96",t.$props.class)),style:{"transform-style":"preserve-3d"}},[e.renderSlot(t.$slots,"default")],2))}}),Ze=e.defineComponent({__name:"Cardltem",props:{as:{type:String,default:"div"},class:String,translateX:{type:[Number,String],default:0},translateY:{type:[Number,String],default:0},translateZ:{type:[Number,String],default:0},rotateX:{type:[Number,String],default:0},rotateY:{type:[Number,String],default:0},rotateZ:{type:[Number,String],default:0}},setup(n){const t=n,i=e.ref(null),s=e.inject("use3DCardMouseState");function o(r){i.value&&(r?i.value.style.transform=`translateX(${t.translateX}px) translateY(${t.translateY}px) translateZ(${t.translateZ}px) rotateX(${t.rotateX}deg) rotateY(${t.rotateY}deg) rotateZ(${t.rotateZ}deg)`:i.value.style.transform="translateX(0px) translateY(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg)")}return e.watch(s.isMouseEntered,o,{immediate:!0}),(r,l)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.as),{ref_key:"refElement",ref:i,class:e.normalizeClass(e.unref(K)("w-fit transition duration-500 ease-in-out",r.$props.class))},{default:e.withCtx(()=>[e.renderSlot(r.$slots,"default")]),_:3},8,["class"]))}}),ps=["src"],gs=e.defineComponent({__name:"index",props:{title:{type:String,default:void 0},content:{type:String,default:void 0},imageSrc:{type:String,default:void 0},buttons:{type:Array,default:()=>[]},classList:{type:Object,default:()=>({})}},setup(n){const t=n,i=e.ref(),s=e.ref(),o=()=>{console.log(s.value.event)};e.onMounted(()=>{i.value=t.buttons.find(l=>l.buttonType=="a"),s.value=t.buttons.find(l=>l.buttonType=="button")});const r=e.computed(()=>{const l=t.classList?.Location||{};return[l.position,l.width,l.height,l.left,l.top].filter(Boolean)});return(l,a)=>(e.openBlock(),e.createBlock(e.unref(ms),null,{default:e.withCtx(()=>[e.createVNode(e.unref(fs),{class:e.normalizeClass([n.classList.overallClass,r.value])},{default:e.withCtx(()=>[e.createVNode(e.unref(Ze),{"translate-z":50,class:"text-xl font-bold text-neutral-600 dark:text-white"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(n.title),1)]),_:1}),e.createVNode(e.unref(Ze),{as:"p","translate-z":"60",class:"mt-2 max-w-sm text-sm text-neutral-500 dark:text-neutral-300"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(n.content),1)]),_:1}),e.createVNode(e.unref(Ze),{"translate-z":100,class:e.normalizeClass(n.classList.imgBoxClass)},{default:e.withCtx(()=>[e.createElementVNode("img",{src:n.imageSrc,height:"1000",width:"1000",class:e.normalizeClass(n.classList.imgClass),alt:"thumbnail"},null,10,ps)]),_:1},8,["class"]),e.createElementVNode("div",{class:e.normalizeClass(n.classList.buttonBoxClass)},[e.createVNode(e.unref(Ze),{"translate-z":20,as:i.value?.buttonType,href:i.value?.url,target:"__blank",class:"rounded-xl px-4 py-2 text-xs font-normal dark:text-white"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(i.value?.title)+" โ ",1)]),_:1},8,["as","href"]),e.createVNode(e.unref(Ze),{"translate-z":20,as:s.value?.buttonType,onClick:o,class:"rounded-xl bg-black px-4 py-2 text-xs font-bold text-white dark:bg-white dark:text-black"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(s.value?.title),1)]),_:1},8,["as"])],2)]),_:1},8,["class"])]),_:1}))}}),vs=["src","alt"],xs=e.defineComponent({__name:"AnimatedTestimonials",props:{testimonials:{default:()=>[]},autoplay:{type:Boolean,default:()=>!1},duration:{default:5e3},classList:{default:()=>({})}},setup(n){const t=n,i=e.ref(0),s=e.ref(),o=e.computed(()=>t.testimonials[i.value].quote.split(" "));e.onMounted(()=>{t.autoplay&&(s.value=setInterval(r,t.duration))}),e.onUnmounted(()=>{s.value||clearInterval(s.value)});function r(){i.value=(i.value+1)%t.testimonials.length}function l(){i.value=(i.value-1+t.testimonials.length)%t.testimonials.length}function a(u){return i.value===u}function c(){return Math.floor(Math.random()*21)-10}return(u,d)=>{const m=e.resolveComponent("AnimatePresence");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(n.classList?.overallClass||"mx-auto max-w-sm px-4 py-20 font-sans antialiased lg:px-12 md:max-w-4xl md:px-8")},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.gridClass||"relative grid grid-cols-1 gap-20 md:grid-cols-2")},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.containerClass)},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.imageContainerClass||"relative h-80 w-full")},[e.createVNode(m,null,{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.testimonials,(h,f)=>(e.openBlock(),e.createBlock(e.unref(de.Motion),{key:h.image,as:"div",initial:{opacity:0,scale:.9,z:-100,rotate:c()},animate:{opacity:a(f)?1:.7,scale:a(f)?1:.95,z:a(f)?0:-100,rotate:a(f)?0:c(),zIndex:a(f)?40:n.testimonials.length+2-f,y:a(f)?[0,-80,0]:0},exit:{opacity:0,scale:.9,z:100,rotate:c()},transition:{duration:.4,ease:"easeInOut"},class:"absolute inset-0 origin-bottom"},{default:e.withCtx(()=>[e.createElementVNode("img",{src:h.image,alt:h.name,width:"500",height:"500",draggable:!1,class:e.normalizeClass(n.classList?.imageClass||"size-full rounded-3xl object-cover object-center")},null,10,vs)]),_:2},1032,["initial","animate","exit"]))),128))]),_:1})],2)],2),e.createElementVNode("div",{class:e.normalizeClass(n.classList?.contentClass||"flex flex-col justify-between py-4")},[(e.openBlock(),e.createBlock(e.unref(de.Motion),{key:i.value,as:"div",initial:{y:20,opacity:0},animate:{y:0,opacity:1},exit:{y:-20,opacity:0},transition:{duration:.2,ease:"easeInOut"}},{default:e.withCtx(()=>[e.createElementVNode("h3",{class:e.normalizeClass(n.classList?.nameClass||"text-2xl font-bold text-black dark:text-white")},e.toDisplayString(t.testimonials[i.value].name),3),e.createElementVNode("p",{class:e.normalizeClass(n.classList?.designationClass||"text-sm text-gray-500 dark:text-neutral-500")},e.toDisplayString(t.testimonials[i.value].designation),3),e.createVNode(e.unref(de.Motion),{as:"p",class:e.normalizeClass(n.classList?.quoteClass||"mt-8 text-lg text-gray-500 dark:text-neutral-300")},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.value,(h,f)=>(e.openBlock(),e.createBlock(e.unref(de.Motion),{key:f,as:"span",initial:{filter:"blur(10px)",opacity:0,y:5},animate:{filter:"blur(0px)",opacity:1,y:0},transition:{duration:.2,ease:"easeInOut",delay:.02*f},class:"inline-block"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(h)+"ย ",1)]),_:2},1032,["transition"]))),128))]),_:1},8,["class"])]),_:1})),e.createElementVNode("div",{class:e.normalizeClass(n.classList?.buttonContainerClass||"flex gap-4 pt-12 md:pt-0")},[e.createElementVNode("button",{class:e.normalizeClass(n.classList?.buttonClass||"group/button flex size-7 items-center justify-center rounded-full bg-gray-100 dark:bg-neutral-800"),onClick:l},[e.createVNode(e.unref(at.ArrowLeft),{class:"size-5 text-black transition-transform duration-300 group-hover/button:rotate-12 dark:text-neutral-400"})],2),e.createElementVNode("button",{class:e.normalizeClass(n.classList?.buttonClass||"group/button flex size-7 items-center justify-center rounded-full bg-gray-100 dark:bg-neutral-800"),onClick:r},[e.createVNode(e.unref(at.ArrowRight),{class:"size-5 text-black transition-transform duration-300 group-hover/button:-rotate-12 dark:text-neutral-400"})],2)],2)],2)],2)],2)}}}),ys=e.defineComponent({__name:"index",props:{testimonials:{default:()=>[{quote:"The attention to detail and innovative features have completely transformed our workflow. This is exactly what we've been looking for.",name:"Sarah Chen",designation:"Product Manager at TechFlow",image:"https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?q=80&w=3560&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"},{quote:"Implementation was seamless and the results exceeded our expectations. The platform's flexibility is remarkable.",name:"Michael Rodriguez",designation:"CTO at InnovateSphere",image:"https://images.unsplash.com/photo-1438761681033-6461ffad8d80?q=80&w=3540&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"},{quote:"This solution has significantly improved our team's productivity. The intuitive interface makes complex tasks simple.",name:"Emily Watson",designation:"Operations Director at CloudScale",image:"https://images.unsplash.com/photo-1623582854588-d60de57fa33f?q=80&w=3540&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"},{quote:"Outstanding support and robust features. It's rare to find a product that delivers on all its promises.",name:"James Kim",designation:"Engineering Lead at DataPro",image:"https://images.unsplash.com/photo-1636041293178-808a6762ab39?q=80&w=3464&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"},{quote:"The scalability and performance have been game-changing for our organization. Highly recommend to any growing business.",name:"Lisa Thompson",designation:"VP of Technology at FutureNet",image:"https://images.unsplash.com/photo-1624561172888-ac93c696e10c?q=80&w=2592&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"}]},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>{const r=e.resolveComponent("ClientOnly");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(i.value)},[e.createVNode(r,null,{default:e.withCtx(()=>[e.createVNode(xs,{testimonials:n.testimonials,"class-list":n.classList},null,8,["testimonials","class-list"])]),_:1})],2)}}}),ws=`#version 300 es
|
|
2
|
+
in vec2 position;
|
|
3
|
+
void main() {
|
|
4
|
+
gl_Position = vec4(position, 0.0, 1.0);
|
|
5
|
+
}
|
|
6
|
+
`,bs=`#version 300 es
|
|
7
|
+
precision highp float;
|
|
8
|
+
|
|
9
|
+
uniform float uTime;
|
|
10
|
+
uniform float uAmplitude;
|
|
11
|
+
uniform vec3 uColorStops[3];
|
|
12
|
+
uniform vec2 uResolution;
|
|
13
|
+
uniform float uBlend;
|
|
14
|
+
uniform float uIntensity;
|
|
15
|
+
|
|
16
|
+
out vec4 fragColor;
|
|
17
|
+
|
|
18
|
+
vec3 permute(vec3 x) {
|
|
19
|
+
return mod(((x * 34.0) + 1.0) * x, 289.0);
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
float snoise(vec2 v){
|
|
23
|
+
const vec4 C = vec4(
|
|
24
|
+
0.211324865405187, 0.366025403784439,
|
|
25
|
+
-0.577350269189626, 0.024390243902439
|
|
26
|
+
);
|
|
27
|
+
vec2 i = floor(v + dot(v, C.yy));
|
|
28
|
+
vec2 x0 = v - i + dot(i, C.xx);
|
|
29
|
+
vec2 i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0);
|
|
30
|
+
vec4 x12 = x0.xyxy + C.xxzz;
|
|
31
|
+
x12.xy -= i1;
|
|
32
|
+
i = mod(i, 289.0);
|
|
33
|
+
|
|
34
|
+
vec3 p = permute(
|
|
35
|
+
permute(i.y + vec3(0.0, i1.y, 1.0))
|
|
36
|
+
+ i.x + vec3(0.0, i1.x, 1.0)
|
|
37
|
+
);
|
|
38
|
+
|
|
39
|
+
vec3 m = max(
|
|
40
|
+
0.5 - vec3(
|
|
41
|
+
dot(x0, x0),
|
|
42
|
+
dot(x12.xy, x12.xy),
|
|
43
|
+
dot(x12.zw, x12.zw)
|
|
44
|
+
),
|
|
45
|
+
0.0
|
|
46
|
+
);
|
|
47
|
+
m = m * m;
|
|
48
|
+
m = m * m;
|
|
49
|
+
|
|
50
|
+
vec3 x = 2.0 * fract(p * C.www) - 1.0;
|
|
51
|
+
vec3 h = abs(x) - 0.5;
|
|
52
|
+
vec3 ox = floor(x + 0.5);
|
|
53
|
+
vec3 a0 = x - ox;
|
|
54
|
+
m *= 1.79284291400159 - 0.85373472095314 * (a0*a0 + h*h);
|
|
55
|
+
|
|
56
|
+
vec3 g;
|
|
57
|
+
g.x = a0.x * x0.x + h.x * x0.y;
|
|
58
|
+
g.yz = a0.yz * x12.xz + h.yz * x12.yw;
|
|
59
|
+
return 130.0 * dot(m, g);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
struct ColorStop {
|
|
63
|
+
vec3 color;
|
|
64
|
+
float position;
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
#define COLOR_RAMP(colors, factor, finalColor) { int index = 0; for (int i = 0; i < 2; i++) { ColorStop currentColor = colors[i]; bool isInBetween = currentColor.position <= factor; index = int(mix(float(index), float(i), float(isInBetween))); } ColorStop currentColor = colors[index]; ColorStop nextColor = colors[index + 1]; float range = nextColor.position - currentColor.position; float lerpFactor = (factor - currentColor.position) / range; finalColor = mix(currentColor.color, nextColor.color, lerpFactor); }
|
|
68
|
+
|
|
69
|
+
void main() {
|
|
70
|
+
vec2 uv = gl_FragCoord.xy / uResolution;
|
|
71
|
+
|
|
72
|
+
ColorStop colors[3];
|
|
73
|
+
colors[0] = ColorStop(uColorStops[0], 0.0);
|
|
74
|
+
colors[1] = ColorStop(uColorStops[1], 0.5);
|
|
75
|
+
colors[2] = ColorStop(uColorStops[2], 1.0);
|
|
76
|
+
|
|
77
|
+
vec3 rampColor;
|
|
78
|
+
COLOR_RAMP(colors, uv.x, rampColor);
|
|
79
|
+
|
|
80
|
+
float height = snoise(vec2(uv.x * 2.0 + uTime * 0.1, uTime * 0.25)) * 0.5 * uAmplitude;
|
|
81
|
+
height = exp(height);
|
|
82
|
+
height = (uv.y * 2.0 - height + 0.2);
|
|
83
|
+
float intensity = 0.6 * height;
|
|
84
|
+
|
|
85
|
+
float midPoint = 0.20;
|
|
86
|
+
float auroraAlpha = smoothstep(midPoint - uBlend * 0.5, midPoint + uBlend * 0.5, intensity);
|
|
87
|
+
|
|
88
|
+
vec3 auroraColor = rampColor;
|
|
89
|
+
|
|
90
|
+
float finalAlpha = auroraAlpha * smoothstep(0.0, 0.5, intensity) * uIntensity;
|
|
91
|
+
|
|
92
|
+
fragColor = vec4(auroraColor * finalAlpha, finalAlpha);
|
|
93
|
+
}
|
|
94
|
+
`,Cs=e.defineComponent({__name:"Aurora",props:{colorStops:{default:()=>["#7cff67","#171D22","#7cff67"]},amplitude:{default:1},blend:{default:.5},time:{},speed:{default:1},intensity:{default:1},className:{default:""},style:{default:()=>({})}},setup(n){const t=n,i=e.useTemplateRef("containerRef");let s=null,o=0;const r=()=>{const a=i.value;if(!a)return;s=new ee.Renderer({alpha:!0,premultipliedAlpha:!0,antialias:!0});const c=s.gl;c.clearColor(0,0,0,0),c.enable(c.BLEND),c.blendFunc(c.ONE,c.ONE_MINUS_SRC_ALPHA),c.canvas.style.backgroundColor="transparent";let u;const d=()=>{if(!a)return;const v=a.parentElement?.offsetWidth||a.offsetWidth||window.innerWidth,w=a.parentElement?.offsetHeight||a.offsetHeight||window.innerHeight,p=Math.max(v,300),_=Math.max(w,300);s.setSize(p,_),u&&(u.uniforms.uResolution.value=[p,_])};window.addEventListener("resize",d);const m=new ee.Triangle(c);m.attributes.uv&&delete m.attributes.uv;const h=t.colorStops.map(v=>{const w=new ee.Color(v);return[w.r,w.g,w.b]});u=new ee.Program(c,{vertex:ws,fragment:bs,uniforms:{uTime:{value:0},uAmplitude:{value:t.amplitude},uColorStops:{value:h},uResolution:{value:[Math.max(a.parentElement?.offsetWidth||a.offsetWidth||window.innerWidth,300),Math.max(a.parentElement?.offsetHeight||a.offsetHeight||window.innerHeight,300)]},uBlend:{value:t.blend},uIntensity:{value:t.intensity}}});const f=new ee.Mesh(c,{geometry:m,program:u});a.appendChild(c.canvas),c.canvas.style.width="100%",c.canvas.style.height="100%",c.canvas.style.display="block",c.canvas.style.position="absolute",c.canvas.style.top="0",c.canvas.style.left="0";const x=v=>{o=requestAnimationFrame(x);const w=t.time??v*.01,p=t.speed??1;if(u){u.uniforms.uTime.value=w*p*.1,u.uniforms.uAmplitude.value=t.amplitude??1,u.uniforms.uBlend.value=t.blend??.5,u.uniforms.uIntensity.value=t.intensity??1;const _=t.colorStops??["#27FF64","#7cff67","#27FF64"];u.uniforms.uColorStops.value=_.map(k=>{const b=new ee.Color(k);return[b.r,b.g,b.b]}),s.render({scene:f})}};return o=requestAnimationFrame(x),d(),()=>{cancelAnimationFrame(o),window.removeEventListener("resize",d),a&&c.canvas.parentNode===a&&a.removeChild(c.canvas),c.getExtension("WEBGL_lose_context")?.loseContext()}},l=()=>{if(o&&cancelAnimationFrame(o),s){const a=s.gl,c=i.value;c&&a.canvas.parentNode===c&&c.removeChild(a.canvas),a.getExtension("WEBGL_lose_context")?.loseContext()}s=null};return e.onMounted(()=>{r()}),e.onUnmounted(()=>{l()}),e.watch(()=>[t.amplitude,t.intensity],()=>{l(),r()}),(a,c)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerRef",ref:i,class:e.normalizeClass([n.className,"relative"]),style:e.normalizeStyle(n.style)},null,6))}}),xe=(n,t)=>{const i=n.__vccOpts||n;for(const[s,o]of t)i[s]=o;return i},Es=xe(Cs,[["__scopeId","data-v-46144515"]]),ks=e.defineComponent({__name:"index",props:{colorStops:{default:()=>["#7cff67","#171D22","#7cff67"]},amplitude:{default:1},blend:{default:.5},speed:{default:1},intensity:{default:1},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const o=t.classList?.Location,r=["aurora-container"];return o?.width&&r.push(o.width),o?.height&&r.push(o.height),o?.position&&r.push(o.position),o?.left&&r.push(o.left),o?.top&&r.push(o.top),r.join(" ")}),s=e.computed(()=>{const o=t.classList?.Location,r={};return o?.position&&o.position==="absolute"?r.position="absolute":o?.position||(r.position="relative"),r});return(o,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(i.value),style:e.normalizeStyle(s.value)},[e.createVNode(Es,{"color-stops":n.colorStops,amplitude:n.amplitude,blend:n.blend,speed:n.speed,intensity:n.intensity,class:e.normalizeClass(n.classList?.overallClass||"w-full h-full")},null,8,["color-stops","amplitude","blend","speed","intensity","class"])],6))}}),Ss=xe(ks,[["__scopeId","data-v-f9a0f228"]]),_s=e.defineComponent({__name:"BendingGallery",props:{items:{},bend:{default:3},textColor:{default:"#ffffff"},borderRadius:{default:.05},font:{default:"bold 30px DM Sans"}},setup(n){const t=n,i=e.ref(null);let s=null;function o(h,f){let x;return function(...v){window.clearTimeout(x),x=window.setTimeout(()=>h.apply(this,v),f)}}function r(h,f,x){return h+(f-h)*x}function l(h){const f=Object.getPrototypeOf(h);Object.getOwnPropertyNames(f).forEach(x=>{x!=="constructor"&&typeof h[x]=="function"&&(h[x]=h[x].bind(h))})}function a(h){const f=h.match(/(\d+)px/);return f?Number.parseInt(f[1],10):30}function c(h,f,x="bold 30px monospace",v="black"){const w=document.createElement("canvas"),p=w.getContext("2d");if(!p)throw new Error("Could not get 2d context");p.font=x;const _=p.measureText(f),k=Math.ceil(_.width),b=a(x),I=Math.ceil(b*1.2);w.width=k+20,w.height=I+20,p.font=x,p.fillStyle=v,p.textBaseline="middle",p.textAlign="center",p.clearRect(0,0,w.width,w.height),p.fillText(f,w.width/2,w.height/2);const U=new ee.Texture(h,{generateMipmaps:!1});return U.image=w,{texture:U,width:w.width,height:w.height}}class u{gl;plane;renderer;text;textColor;font;mesh;constructor({gl:f,plane:x,renderer:v,text:w,textColor:p="#545050",font:_="30px sans-serif"}){l(this),this.gl=f,this.plane=x,this.renderer=v,this.text=w,this.textColor=p,this.font=_,this.createMesh()}createMesh(){const{texture:f,width:x,height:v}=c(this.gl,this.text,this.font,this.textColor),w=new ee.Plane(this.gl),p=new ee.Program(this.gl,{vertex:`
|
|
95
|
+
attribute vec3 position;
|
|
96
|
+
attribute vec2 uv;
|
|
97
|
+
uniform mat4 modelViewMatrix;
|
|
98
|
+
uniform mat4 projectionMatrix;
|
|
99
|
+
varying vec2 vUv;
|
|
100
|
+
void main() {
|
|
101
|
+
vUv = uv;
|
|
102
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
|
|
103
|
+
}
|
|
104
|
+
`,fragment:`
|
|
105
|
+
precision highp float;
|
|
106
|
+
uniform sampler2D tMap;
|
|
107
|
+
varying vec2 vUv;
|
|
108
|
+
void main() {
|
|
109
|
+
vec4 color = texture2D(tMap, vUv);
|
|
110
|
+
if (color.a < 0.1) discard;
|
|
111
|
+
gl_FragColor = color;
|
|
112
|
+
}
|
|
113
|
+
`,uniforms:{tMap:{value:f}},transparent:!0});this.mesh=new ee.Mesh(this.gl,{geometry:w,program:p});const _=x/v,k=this.plane.scale.y*.15,b=k*_;this.mesh.scale.set(b,k,1),this.mesh.position.y=-this.plane.scale.y*.5-k*.5-.05,this.mesh.setParent(this.plane)}}class d{extra=0;geometry;gl;image;index;length;renderer;scene;screen;text;viewport;bend;textColor;borderRadius;font;program;plane;title;scale;padding;width;widthTotal;x;speed=0;isBefore=!1;isAfter=!1;constructor({geometry:f,gl:x,image:v,index:w,length:p,renderer:_,scene:k,screen:b,text:I,viewport:U,bend:H,textColor:E,borderRadius:C=0,font:S}){this.geometry=f,this.gl=x,this.image=v,this.index=w,this.length=p,this.renderer=_,this.scene=k,this.screen=b,this.text=I,this.viewport=U,this.bend=H,this.textColor=E,this.borderRadius=C,this.font=S,this.createShader(),this.createMesh(),this.createTitle(),this.onResize()}createShader(){const f=new ee.Texture(this.gl,{generateMipmaps:!1});this.program=new ee.Program(this.gl,{depthTest:!1,depthWrite:!1,vertex:`
|
|
114
|
+
precision highp float;
|
|
115
|
+
attribute vec3 position;
|
|
116
|
+
attribute vec2 uv;
|
|
117
|
+
uniform mat4 modelViewMatrix;
|
|
118
|
+
uniform mat4 projectionMatrix;
|
|
119
|
+
uniform float uTime;
|
|
120
|
+
uniform float uSpeed;
|
|
121
|
+
varying vec2 vUv;
|
|
122
|
+
void main() {
|
|
123
|
+
vUv = uv;
|
|
124
|
+
vec3 p = position;
|
|
125
|
+
p.z = (sin(p.x * 4.0 + uTime) * 1.5 + cos(p.y * 2.0 + uTime) * 1.5) * (0.1 + uSpeed * 0.5);
|
|
126
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4(p, 1.0);
|
|
127
|
+
}
|
|
128
|
+
`,fragment:`
|
|
129
|
+
precision highp float;
|
|
130
|
+
uniform vec2 uImageSizes;
|
|
131
|
+
uniform vec2 uPlaneSizes;
|
|
132
|
+
uniform sampler2D tMap;
|
|
133
|
+
uniform float uBorderRadius;
|
|
134
|
+
varying vec2 vUv;
|
|
135
|
+
|
|
136
|
+
// Rounded box SDF for UV space
|
|
137
|
+
float roundedBoxSDF(vec2 p, vec2 b, float r) {
|
|
138
|
+
vec2 d = abs(p) - b;
|
|
139
|
+
return length(max(d, vec2(0.0))) + min(max(d.x, d.y), 0.0) - r;
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
void main() {
|
|
143
|
+
vec2 ratio = vec2(
|
|
144
|
+
min((uPlaneSizes.x / uPlaneSizes.y) / (uImageSizes.x / uImageSizes.y), 1.0),
|
|
145
|
+
min((uPlaneSizes.y / uPlaneSizes.x) / (uImageSizes.y / uImageSizes.x), 1.0)
|
|
146
|
+
);
|
|
147
|
+
vec2 uv = vec2(
|
|
148
|
+
vUv.x * ratio.x + (1.0 - ratio.x) * 0.5,
|
|
149
|
+
vUv.y * ratio.y + (1.0 - ratio.y) * 0.5
|
|
150
|
+
);
|
|
151
|
+
vec4 color = texture2D(tMap, uv);
|
|
152
|
+
|
|
153
|
+
// Apply rounded corners (assumes vUv in [0,1])
|
|
154
|
+
float d = roundedBoxSDF(vUv - 0.5, vec2(0.5 - uBorderRadius), uBorderRadius);
|
|
155
|
+
if(d > 0.0) {
|
|
156
|
+
discard;
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
gl_FragColor = vec4(color.rgb, 1.0);
|
|
160
|
+
}
|
|
161
|
+
`,uniforms:{tMap:{value:f},uPlaneSizes:{value:[0,0]},uImageSizes:{value:[0,0]},uSpeed:{value:0},uTime:{value:100*Math.random()},uBorderRadius:{value:this.borderRadius}},transparent:!0});const x=new Image;x.crossOrigin="anonymous",x.src=this.image,x.onload=()=>{f.image=x,this.program.uniforms.uImageSizes.value=[x.naturalWidth,x.naturalHeight]}}createMesh(){this.plane=new ee.Mesh(this.gl,{geometry:this.geometry,program:this.program}),this.plane.setParent(this.scene)}createTitle(){this.title=new u({gl:this.gl,plane:this.plane,renderer:this.renderer,text:this.text,textColor:this.textColor,font:this.font})}update(f,x){this.plane.position.x=this.x-f.current-this.extra;const v=this.plane.position.x,w=this.viewport.width/2;if(this.bend===0)this.plane.position.y=0,this.plane.rotation.z=0;else{const k=Math.abs(this.bend),b=(w*w+k*k)/(2*k),I=Math.min(Math.abs(v),w),U=b-Math.sqrt(b*b-I*I);this.bend>0?(this.plane.position.y=-U,this.plane.rotation.z=-Math.sign(v)*Math.asin(I/b)):(this.plane.position.y=U,this.plane.rotation.z=Math.sign(v)*Math.asin(I/b))}this.speed=f.current-f.last,this.program.uniforms.uTime.value+=.04,this.program.uniforms.uSpeed.value=this.speed;const p=this.plane.scale.x/2,_=this.viewport.width/2;this.isBefore=this.plane.position.x+p<-_,this.isAfter=this.plane.position.x-p>_,x==="right"&&this.isBefore&&(this.extra-=this.widthTotal,this.isBefore=this.isAfter=!1),x==="left"&&this.isAfter&&(this.extra+=this.widthTotal,this.isBefore=this.isAfter=!1)}onResize({screen:f,viewport:x}={}){f&&(this.screen=f),x&&(this.viewport=x,this.plane.program.uniforms.uViewportSizes&&(this.plane.program.uniforms.uViewportSizes.value=[this.viewport.width,this.viewport.height])),this.scale=this.screen.height/1500,this.plane.scale.y=this.viewport.height*(900*this.scale)/this.screen.height,this.plane.scale.x=this.viewport.width*(700*this.scale)/this.screen.width,this.plane.program.uniforms.uPlaneSizes.value=[this.plane.scale.x,this.plane.scale.y],this.padding=2,this.width=this.plane.scale.x+this.padding,this.widthTotal=this.width*this.length,this.x=this.width*this.index}}class m{container;scroll;onCheckDebounce;renderer;gl;camera;scene;planeGeometry;medias=[];mediasImages=[];screen;viewport;raf=0;boundOnResize;boundOnWheel;boundOnTouchDown;boundOnTouchMove;boundOnTouchUp;isDown=!1;start=0;constructor(f,{items:x,bend:v=1,textColor:w="#ffffff",borderRadius:p=0,font:_="bold 30px DM Sans"}){this.container=f,this.scroll={ease:.05,current:0,target:0,last:0},this.onCheckDebounce=o(this.onCheck.bind(this),200),this.createRenderer(),this.createCamera(),this.createScene(),this.onResize(),this.createGeometry(),this.createMedias(x,v,w,p,_),this.update(),this.addEventListeners()}createRenderer(){this.renderer=new ee.Renderer({alpha:!0}),this.gl=this.renderer.gl,this.gl.clearColor(0,0,0,0),this.container.appendChild(this.renderer.gl.canvas)}createCamera(){this.camera=new ee.Camera(this.gl),this.camera.fov=45,this.camera.position.z=20}createScene(){this.scene=new ee.Transform}createGeometry(){this.planeGeometry=new ee.Plane(this.gl,{heightSegments:50,widthSegments:100})}createMedias(f,x=1,v,w,p){const _=[{image:"https://picsum.photos/seed/1/800/600?grayscale",text:"Bridge"},{image:"https://picsum.photos/seed/2/800/600?grayscale",text:"Desk Setup"},{image:"https://picsum.photos/seed/3/800/600?grayscale",text:"Waterfall"},{image:"https://picsum.photos/seed/4/800/600?grayscale",text:"Strawberries"},{image:"https://picsum.photos/seed/5/800/600?grayscale",text:"Deep Diving"},{image:"https://picsum.photos/seed/16/800/600?grayscale",text:"Train Track"},{image:"https://picsum.photos/seed/17/800/600?grayscale",text:"Santorini"},{image:"https://picsum.photos/seed/8/800/600?grayscale",text:"Blurry Lights"},{image:"https://picsum.photos/seed/9/800/600?grayscale",text:"New York"},{image:"https://picsum.photos/seed/10/800/600?grayscale",text:"Good Boy"},{image:"https://picsum.photos/seed/21/800/600?grayscale",text:"Coastline"},{image:"https://picsum.photos/seed/12/800/600?grayscale",text:"Palm Trees"}],k=f&&f.length?f:_;this.mediasImages=k.concat(k),this.medias=this.mediasImages.map((b,I)=>new d({geometry:this.planeGeometry,gl:this.gl,image:b.image,index:I,length:this.mediasImages.length,renderer:this.renderer,scene:this.scene,screen:this.screen,text:b.text,viewport:this.viewport,bend:x,textColor:v,borderRadius:w,font:p}))}onTouchDown(f){this.isDown=!0,this.scroll.position=this.scroll.current,this.start="touches"in f?f.touches[0].clientX:f.clientX}onTouchMove(f){if(!this.isDown)return;const x="touches"in f?f.touches[0].clientX:f.clientX,v=(this.start-x)*.05;this.scroll.target=(this.scroll.position??0)+v}onTouchUp(){this.isDown=!1,this.onCheck()}onWheel(){this.scroll.target+=2,this.onCheckDebounce()}onCheck(){if(!this.medias||!this.medias[0])return;const f=this.medias[0].width,x=Math.round(Math.abs(this.scroll.target)/f),v=f*x;this.scroll.target=this.scroll.target<0?-v:v}onResize(){this.screen={width:this.container.clientWidth,height:this.container.clientHeight},this.renderer.setSize(this.screen.width,this.screen.height),this.camera.perspective({aspect:this.screen.width/this.screen.height});const f=this.camera.fov*Math.PI/180,x=2*Math.tan(f/2)*this.camera.position.z,v=x*this.camera.aspect;this.viewport={width:v,height:x},this.medias&&this.medias.forEach(w=>w.onResize({screen:this.screen,viewport:this.viewport}))}update(){this.scroll.current=r(this.scroll.current,this.scroll.target,this.scroll.ease);const f=this.scroll.current>this.scroll.last?"right":"left";this.medias&&this.medias.forEach(x=>x.update(this.scroll,f)),this.renderer.render({scene:this.scene,camera:this.camera}),this.scroll.last=this.scroll.current,this.raf=window.requestAnimationFrame(this.update.bind(this))}addEventListeners(){this.boundOnResize=this.onResize.bind(this),this.boundOnWheel=this.onWheel.bind(this),this.boundOnTouchDown=this.onTouchDown.bind(this),this.boundOnTouchMove=this.onTouchMove.bind(this),this.boundOnTouchUp=this.onTouchUp.bind(this),window.addEventListener("resize",this.boundOnResize),window.addEventListener("mousewheel",this.boundOnWheel),window.addEventListener("wheel",this.boundOnWheel),window.addEventListener("mousedown",this.boundOnTouchDown),window.addEventListener("mousemove",this.boundOnTouchMove),window.addEventListener("mouseup",this.boundOnTouchUp),window.addEventListener("touchstart",this.boundOnTouchDown),window.addEventListener("touchmove",this.boundOnTouchMove),window.addEventListener("touchend",this.boundOnTouchUp)}destroy(){window.cancelAnimationFrame(this.raf),window.removeEventListener("resize",this.boundOnResize),window.removeEventListener("mousewheel",this.boundOnWheel),window.removeEventListener("wheel",this.boundOnWheel),window.removeEventListener("mousedown",this.boundOnTouchDown),window.removeEventListener("mousemove",this.boundOnTouchMove),window.removeEventListener("mouseup",this.boundOnTouchUp),window.removeEventListener("touchstart",this.boundOnTouchDown),window.removeEventListener("touchmove",this.boundOnTouchMove),window.removeEventListener("touchend",this.boundOnTouchUp),this.renderer&&this.renderer.gl&&this.renderer.gl.canvas.parentNode&&this.renderer.gl.canvas.parentNode.removeChild(this.renderer.gl.canvas)}}return e.onMounted(()=>{i.value&&(s=new m(i.value,{items:t.items,bend:t.bend,textColor:t.textColor,borderRadius:t.borderRadius,font:t.font}))}),e.watch([()=>t.bend,()=>t.textColor,()=>t.borderRadius,()=>t.font],()=>{s&&(s.destroy(),s=null),i.value&&(s=new m(i.value,{items:t.items,bend:t.bend,textColor:t.textColor,borderRadius:t.borderRadius,font:t.font}))}),e.watch(()=>t.items,()=>{s&&(s.destroy(),s=null),i.value&&(s=new m(i.value,{items:t.items,bend:t.bend,textColor:t.textColor,borderRadius:t.borderRadius,font:t.font}))},{deep:!0}),e.onBeforeUnmount(()=>{s&&(s.destroy(),s=null)}),(h,f)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerRef",ref:i,class:"w-full h-full overflow-hidden cursor-grab active:cursor-grabbing"},null,512))}}),Ts=e.defineComponent({__name:"index",props:{items:{default:()=>[{image:"https://images.pexels.com/photos/799443/pexels-photo-799443.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",text:""},{image:"https://images.pexels.com/photos/16245254/pexels-photo-16245254/free-photo-of-chatgpt-a-chatbot-for-your-website.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",text:""},{image:"https://images.pexels.com/photos/1910236/pexels-photo-1910236.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",text:""},{image:"https://images.pexels.com/photos/2832382/pexels-photo-2832382.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",text:""},{image:"https://images.pexels.com/photos/2333293/pexels-photo-2333293.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",text:""}]},bend:{default:2},borderRadius:{default:.1},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass||"h-96 w-full border border-zinc-800 rounded-xl overflow-clip flex flex-col items-center justify-center gap-24",i.value])},[e.createVNode(_s,{items:n.items,bend:n.bend,"border-radius":n.borderRadius},null,8,["items","bend","border-radius"])],2))}}),Ms=e.defineComponent({__name:"BentoGrid",props:{class:{}},setup(n){const t=n;return(i,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("grid md:auto-rows-[18rem] grid-cols-1 md:grid-cols-3 gap-4 max-w-7xl mx-auto ",t.class))},[e.renderSlot(i.$slots,"default")],2))}}),Bs={class:"transition duration-200 group-hover/bento:translate-x-2"},Ds={class:"my-2 font-sans font-bold text-neutral-600 dark:text-neutral-200"},Rs={class:"font-sans text-xs font-normal text-neutral-600 dark:text-neutral-300"},Is=e.defineComponent({__name:"BentoGridltem",props:{class:{}},setup(n){const t=n;return(i,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("row-span-1 rounded-xl group/bento hover:shadow-xl transition duration-200 shadow-input dark:shadow-none p-4 dark:bg-black dark:border-white/[0.2] bg-white border border-transparent justify-between flex flex-col space-y-4",t.class))},[e.renderSlot(i.$slots,"header"),e.createElementVNode("div",Bs,[e.renderSlot(i.$slots,"icon"),e.createElementVNode("div",Ds,[e.renderSlot(i.$slots,"title")]),e.createElementVNode("div",Rs,[e.renderSlot(i.$slots,"description")])])],2))}}),Ls={class:"flex size-full animate-pulse space-x-4"},zs={class:"flex size-full flex-1 rounded-md bg-zinc-800 relative overflow-hidden"},As=["src","alt"],Ps=e.defineComponent({__name:"index",props:{items:{default:()=>[{title:"The Dawn of Innovation",description:"Explore the birth of groundbreaking ideas and inventions."},{title:"The Digital Revolution",description:"Dive into the transformative power of technology."},{title:"The Art of Design",description:"Discover the beauty of thoughtful and experience design."},{title:"The Power of Communication",description:"Understand the impact of effective communication in our lives."},{title:"The Pursuit of Knowledge",description:"Join the quest for understanding and enlightenment."},{title:"The Joy of Creation",description:"Experience the thrill of bringing ideas to life."},{title:"The Spirit of Adventure",description:"Embark on exciting journeys and thrilling discoveries."}]},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location,o=[];return t.classList?.overallClass&&o.push(t.classList.overallClass),s?.width&&o.push(s.width),s?.height&&o.push(s.height),s?.position&&o.push(s.position),s?.left&&o.push(s.left),s?.top&&o.push(s.top),o.join(" ")||"mx-auto max-w-4xl"});return(s,o)=>(e.openBlock(),e.createBlock(Ms,{class:e.normalizeClass(i.value)},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.items,(r,l)=>(e.openBlock(),e.createBlock(Is,{key:l,class:e.normalizeClass(r.colSpan||"")},{header:e.withCtx(()=>[e.createElementVNode("div",Ls,[e.createElementVNode("div",zs,[r.image?(e.openBlock(),e.createElementBlock("img",{key:0,src:r.image,alt:r.title,class:"absolute inset-0 size-full object-cover rounded-md"},null,8,As)):e.createCommentVNode("",!0)])])]),title:e.withCtx(()=>[e.createElementVNode("strong",null,e.toDisplayString(r.title),1)]),icon:e.withCtx(()=>[...o[0]||(o[0]=[])]),description:e.withCtx(()=>[e.createElementVNode("p",null,e.toDisplayString(r.description),1)]),_:2},1032,["class"]))),128))]),_:1},8,["class"]))}}),_t=new $e.Vector3,Ns=new $e.Quaternion,Tt=new $e.Vector3;class Vs extends $e.Object3D{constructor(t=document.createElement("div")){super(),this.isCSS3DObject=!0,this.element=t,this.element.style.position="absolute",this.element.style.pointerEvents="auto",this.element.style.userSelect="none",this.element.setAttribute("draggable",!1),this.addEventListener("removed",function(){this.traverse(function(i){i.element instanceof i.element.ownerDocument.defaultView.Element&&i.element.parentNode!==null&&i.element.remove()})})}copy(t,i){return super.copy(t,i),this.element=t.element.cloneNode(!0),this}}const Me=new $e.Matrix4,Fs=new $e.Matrix4;class Os{constructor(t={}){const i=this;let s,o,r,l;const a={camera:{style:""},objects:new WeakMap},c=t.element!==void 0?t.element:document.createElement("div");c.style.overflow="hidden",this.domElement=c;const u=document.createElement("div");u.style.transformOrigin="0 0",u.style.pointerEvents="none",c.appendChild(u);const d=document.createElement("div");d.style.transformStyle="preserve-3d",u.appendChild(d),this.getSize=function(){return{width:s,height:o}},this.render=function(w,p){const _=p.projectionMatrix.elements[5]*l;p.view&&p.view.enabled?(u.style.transform=`translate( ${-p.view.offsetX*(s/p.view.width)}px, ${-p.view.offsetY*(o/p.view.height)}px )`,u.style.transform+=`scale( ${p.view.fullWidth/p.view.width}, ${p.view.fullHeight/p.view.height} )`):u.style.transform="",w.matrixWorldAutoUpdate===!0&&w.updateMatrixWorld(),p.parent===null&&p.matrixWorldAutoUpdate===!0&&p.updateMatrixWorld();let k,b;p.isOrthographicCamera&&(k=-(p.right+p.left)/2,b=(p.top+p.bottom)/2);const I=p.view&&p.view.enabled?p.view.height/p.view.fullHeight:1,U=p.isOrthographicCamera?`scale( ${I} )scale(`+_+")translate("+m(k)+"px,"+m(b)+"px)"+h(p.matrixWorldInverse):`scale( ${I} )translateZ(`+_+"px)"+h(p.matrixWorldInverse),E=(p.isPerspectiveCamera?"perspective("+_+"px) ":"")+U+"translate("+r+"px,"+l+"px)";a.camera.style!==E&&(d.style.transform=E,a.camera.style=E),v(w,w,p)},this.setSize=function(w,p){s=w,o=p,r=s/2,l=o/2,c.style.width=w+"px",c.style.height=p+"px",u.style.width=w+"px",u.style.height=p+"px",d.style.width=w+"px",d.style.height=p+"px"};function m(w){return Math.abs(w)<1e-10?0:w}function h(w){const p=w.elements;return"matrix3d("+m(p[0])+","+m(-p[1])+","+m(p[2])+","+m(p[3])+","+m(p[4])+","+m(-p[5])+","+m(p[6])+","+m(p[7])+","+m(p[8])+","+m(-p[9])+","+m(p[10])+","+m(p[11])+","+m(p[12])+","+m(-p[13])+","+m(p[14])+","+m(p[15])+")"}function f(w){const p=w.elements;return"translate(-50%,-50%)"+("matrix3d("+m(p[0])+","+m(p[1])+","+m(p[2])+","+m(p[3])+","+m(-p[4])+","+m(-p[5])+","+m(-p[6])+","+m(-p[7])+","+m(p[8])+","+m(p[9])+","+m(p[10])+","+m(p[11])+","+m(p[12])+","+m(p[13])+","+m(p[14])+","+m(p[15])+")")}function x(w){w.isCSS3DObject&&(w.element.style.display="none");for(let p=0,_=w.children.length;p<_;p++)x(w.children[p])}function v(w,p,_,k){if(w.visible===!1){x(w);return}if(w.isCSS3DObject){const b=w.layers.test(_.layers)===!0,I=w.element;if(I.style.display=b===!0?"":"none",b===!0){w.onBeforeRender(i,p,_);let U;w.isCSS3DSprite?(Me.copy(_.matrixWorldInverse),Me.transpose(),w.rotation2D!==0&&Me.multiply(Fs.makeRotationZ(w.rotation2D)),w.matrixWorld.decompose(_t,Ns,Tt),Me.setPosition(_t),Me.scale(Tt),Me.elements[3]=0,Me.elements[7]=0,Me.elements[11]=0,Me.elements[15]=1,U=f(Me)):U=f(w.matrixWorld);const H=a.objects.get(w);if(H===void 0||H.style!==U){I.style.transform=U;const E={style:U};a.objects.set(w,E)}I.parentNode!==d&&d.appendChild(I),w.onAfterRender(i,p,_)}}for(let b=0,I=w.children.length;b<I;b++)v(w.children[b],p,_)}}}const Us=.0025,$s=e.defineComponent({__name:"Carousel3D",props:{items:{default:()=>[]},class:{default:""},containerClass:{default:""},width:{default:450},height:{default:600}},setup(n){const t=n,i=e.ref(),s=e.ref(!1),o=e.ref(0),r=e.ref(0),l=new nt.Scene,a=new nt.PerspectiveCamera(50,1,1,5e3);let c;const u=e.ref(750);let d,m=e.ref(null);e.onMounted(()=>{if(!i.value)return;c=new Os;const b=i.value.clientWidth,I=i.value.clientHeight;c.setSize(b,I),i.value.appendChild(c.domElement),a.position.z=550,a.position.y=70,d=new nt.Object3D,l.add(d),t.items.forEach((U,H)=>{const E=document.createElement("div");E.style.width=`${t.width}px`,E.style.height=`${t.height}px`,E.classList.add("rounded-lg"),E.style.backgroundImage=`url(${U})`,E.style.backgroundSize="cover";const C=new Vs(E),S=H/t.items.length*Math.PI*2;C.position.setFromSphericalCoords(u.value,Math.PI/2,S),C.lookAt(d.position),d.add(C)}),d.rotation.x=nt.MathUtils.degToRad(20),h(),window.addEventListener("resize",k)});function h(){m.value&&m.value.stop();const b=d.rotation.y,I=b+Math.PI*2;m.value=de.animate(b,I,{duration:20,ease:"linear",repeat:1/0,repeatType:"loop",onUpdate:U=>{d.rotation.y=U,c.render(l,a)}})}function f(b){s.value=!0,o.value="touches"in b?b.touches[0].clientX:b.clientX,r.value=o.value,m.value&&(m.value.stop(),m.value=null)}function x(){s.value&&(s.value=!1,h())}function v(b){s.value&&_(b.clientX)}function w(b){f(b)}function p(b){s.value&&(b.preventDefault(),_(b.touches[0].clientX))}function _(b){const I=b-r.value;r.value=b,d.rotation.y+=-I*Us,c.render(l,a)}function k(){if(!i.value)return;const b=i.value.clientWidth,I=i.value.clientHeight;u.value=b/3,a.aspect=b/I,a.updateProjectionMatrix(),c.setSize(b,I)}return e.onBeforeUnmount(()=>{i.value&&c&&i.value.removeChild(c.domElement),window.removeEventListener("resize",k),m.value&&m.value.stop()}),(b,I)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"carouselContainer",ref:i,class:e.normalizeClass(e.unref(K)("w-full h-[60vh] relative",t.containerClass))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(K)("absolute top-[40%] translate-y-[-50%] left-0 w-full h-[80%] z-[100]",t.class)),onMousedown:f,onMouseup:x,onMouseleave:x,onMousemove:v,onTouchstart:w,onTouchend:x,onTouchmove:p},null,34)],2))}}),Hs=e.defineComponent({__name:"index",props:{items:{default:()=>["https://images.pexels.com/photos/799443/pexels-photo-799443.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2","https://images.pexels.com/photos/16245254/pexels-photo-16245254/free-photo-of-chatgpt-a-chatbot-for-your-website.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2","https://images.pexels.com/photos/1910236/pexels-photo-1910236.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2","https://images.pexels.com/photos/2832382/pexels-photo-2832382.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2","https://images.pexels.com/photos/2333293/pexels-photo-2333293.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2","https://images.pexels.com/photos/604684/pexels-photo-604684.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2","https://images.pexels.com/photos/3308588/pexels-photo-3308588.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2","https://images.pexels.com/photos/2860807/pexels-photo-2860807.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2"]},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass||"w-full h-auto",i.value])},[e.createVNode($s,{items:n.items},null,8,["items"])],2))}}),Gs={class:"size-full overflow-hidden rounded-2xl bg-gray-100 md:rounded-2xl md:p-4 dark:bg-zinc-900"},Ys=e.defineComponent({__name:"ContainerScrollCard",props:{rotate:Number,scale:Number},setup(n){return(t,i)=>(e.openBlock(),e.createElementBlock("div",{style:e.normalizeStyle({transform:`rotateX(${n.rotate}deg) scale(${n.scale})`,boxShadow:"0 0 #0000004d, 0 9px 20px #0000004a, 0 37px 37px #00000042, 0 84px 50px #00000026, 0 149px 60px #0000000a, 0 233px 65px #00000003"}),class:"mx-auto -mt-12 h-[30rem] w-full max-w-5xl rounded-[30px] border-4 border-[#6C6C6C] bg-[#222222] p-2 shadow-2xl md:h-[40rem] md:p-6"},[e.createElementVNode("div",Gs,[e.renderSlot(t.$slots,"default")])],4))}}),js=e.defineComponent({__name:"ContainerScrollTitle",props:{translate:Number},setup(n){return(t,i)=>(e.openBlock(),e.createElementBlock("div",{style:e.normalizeStyle({transform:`translateY(${n.translate}px)`}),class:"mx-auto max-w-5xl text-center"},[e.renderSlot(t.$slots,"default")],4))}}),Ws={class:"relative w-full py-10 md:py-40",style:{perspective:"1000px"}},Xs=e.defineComponent({__name:"ContainerScroll",setup(n){const t=e.ref(null),i=e.ref(!1);function s(){i.value=window.innerWidth<=768}e.onMounted(()=>{s(),window.addEventListener("resize",s)}),e.onUnmounted(()=>{window.removeEventListener("resize",s)});const{height:o}=Ce.useWindowSize(),{y:r}=Ce.useScroll(window),{bottom:l}=Ce.useElementBounding(t),a=e.computed(()=>l.value?1-Math.max(0,l.value-r.value)/o.value:0),c=e.computed(()=>i.value?[.7,.9]:[1.05,1]),u=e.computed(()=>20*(1-a.value)),d=e.computed(()=>{const[h,f]=c.value;return h+(f-h)*a.value}),m=e.computed(()=>-100*a.value);return(h,f)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerRef",ref:t,class:"relative flex h-[60rem] items-center justify-center p-2 md:h-[80rem] md:p-20"},[e.createElementVNode("div",Ws,[e.createVNode(js,{translate:m.value},{default:e.withCtx(()=>[e.renderSlot(h.$slots,"title")]),_:3},8,["translate"]),e.createVNode(Ys,{rotate:u.value,scale:d.value},{default:e.withCtx(()=>[e.renderSlot(h.$slots,"card")]),_:3},8,["rotate","scale"])])],512))}}),qs=["src"],Zs=e.defineComponent({__name:"index",props:{imageSrc:{default:""},title1:{default:""},title2:{default:""},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=[];t.classList?.overallClass?s.push(t.classList.overallClass):s.push("flex flex-col overflow-hidden");const o=t.classList?.Location;return o?.position&&s.push(o.position),o?.width&&s.push(o.width),o?.height&&s.push(o.height),o?.left&&s.push(o.left),o?.top&&s.push(o.top),s.join(" ")});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(i.value)},[e.createVNode(Xs,null,{title:e.withCtx(()=>[e.createElementVNode("h1",{class:e.normalizeClass(n.classList?.h1Class||"text-4xl font-semibold text-black dark:text-white")},[e.createTextVNode(e.toDisplayString(n.title1)+" ",1),o[0]||(o[0]=e.createElementVNode("br",null,null,-1)),e.createElementVNode("span",{class:e.normalizeClass(n.classList?.spanClass||"mt-1 text-4xl font-bold leading-none md:text-[6rem]")},e.toDisplayString(n.title2),3)],2)]),card:e.withCtx(()=>[e.createElementVNode("img",{src:n.imageSrc,class:e.normalizeClass(n.classList?.imageClass||"mx-auto h-full rounded-2xl object-cover object-left-top"),alt:"hero",height:"720",width:"1400"},null,10,qs)]),_:1})],2))}}),Ks={class:"relative size-full overflow-hidden"},Js=["src"],Qs=e.defineComponent({__name:"DirectionAwareHover",props:{imageUrl:{},childrenClass:{default:void 0},imageClass:{default:void 0},class:{default:void 0}},setup(n){const t=n,i=e.ref(null),s=e.ref(null),o=e.ref(!1),r=e.ref(!1);let l=null;function a(){r.value=window.matchMedia("(max-width: 768px)").matches||"ontouchstart"in window}function c(_){if(r.value||!i.value)return;switch(h(_,i.value)){case 0:s.value="top";break;case 1:s.value="right";break;case 2:s.value="bottom";break;case 3:s.value="left";break;default:s.value="left";break}}function u(){r.value||(s.value=null)}function d(_){if(!r.value||(o.value=!0,!i.value))return;const k=_.touches[0],b=new MouseEvent("mouseenter",{clientX:k.clientX,clientY:k.clientY});switch(h(b,i.value)){case 0:s.value="top";break;case 1:s.value="right";break;case 2:s.value="bottom";break;case 3:s.value="left";break;default:s.value="left";break}l&&clearTimeout(l),l=setTimeout(()=>{m()},3e3)}function m(){l&&(clearTimeout(l),l=null),setTimeout(()=>{s.value=null,o.value=!1},300)}function h(_,k){const{width:b,height:I,left:U,top:H}=k.getBoundingClientRect(),E=_.clientX-U-b/2*(b>I?I/b:1),C=_.clientY-H-I/2*(I>b?b/I:1);return Math.round(Math.atan2(C,E)/1.57079633+5)%4}const f=e.computed(()=>K("group/card relative overflow-hidden rounded-lg bg-transparent transition-all duration-300","h-48 w-48","xs:h-56 xs:w-56","sm:h-64 sm:w-64","md:h-80 md:w-80","lg:h-96 lg:w-96","xl:h-[28rem] xl:w-[28rem]","touch-manipulation","active:scale-[0.98]","md:active:scale-100",t.class)),x=e.computed(()=>K("h-full w-full object-cover transition-transform duration-300","scale-125","sm:scale-135","md:scale-150",t.imageClass)),v=e.computed(()=>K("absolute z-40 text-white transition-opacity duration-300","bottom-2 left-2 text-sm","sm:bottom-3 sm:left-3 sm:text-base","md:bottom-4 md:left-4 md:text-lg",t.childrenClass)),w=e.computed(()=>{const _="absolute inset-0 z-10 transition-all duration-300",k="bg-black/40 dark:bg-black/60";let b="";switch(s.value){case"top":b="-translate-y-full";break;case"bottom":b="translate-y-full";break;case"left":b="-translate-x-full";break;case"right":b="translate-x-full";break;default:b=""}return K(_,k,b)}),p=e.computed(()=>({"translate-y-2 md:translate-y-5":s.value==="top","-translate-y-2 md:-translate-y-5":s.value==="bottom","translate-x-2 md:translate-x-5":s.value==="left","-translate-x-2 md:-translate-x-5":s.value==="right"}));return e.onMounted(()=>{a(),window.addEventListener("resize",a)}),e.onUnmounted(()=>{window.removeEventListener("resize",a),l&&clearTimeout(l)}),(_,k)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"divRef",ref:i,class:e.normalizeClass(f.value),onMouseenter:c,onMouseleave:u,onTouchstart:d,onTouchend:m},[e.createElementVNode("div",Ks,[e.createVNode(e.Transition,{name:"fade"},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{class:e.normalizeClass(w.value)},null,2),[[e.vShow,s.value!==null]])]),_:1}),e.createElementVNode("div",{class:e.normalizeClass(["relative size-full bg-gray-50 transition-transform duration-300 dark:bg-black",p.value])},[e.createElementVNode("img",{src:n.imageUrl,alt:"image",class:e.normalizeClass(x.value),width:"1000",height:"1000"},null,10,Js)],2),e.createVNode(e.Transition,{name:"fade"},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{class:e.normalizeClass(v.value)},[e.renderSlot(_.$slots,"default",{},void 0,!0)],2),[[e.vShow,s.value!==null||o.value]])]),_:3})])],34))}}),ei=xe(Qs,[["__scopeId","data-v-17828482"]]),ti=e.defineComponent({__name:"index",props:{items:{default:()=>[{imageUrl:"https://images.unsplash.com/photo-1728755833852-2c138c84cfb1?q=80&w=2672&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",title:"Beautiful Landscape",description:"Discover nature's wonders"},{imageUrl:"https://images.unsplash.com/photo-1522075469751-3a6694fb2f61?ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80",title:"Urban Adventure",description:"Explore the city lights",class:"border-2 border-blue-500 shadow-xl ring-2 ring-blue-200 dark:border-blue-400 dark:ring-blue-800",imageClass:"scale-110 hover:scale-125 transition-transform duration-500",childrenClass:"bg-gradient-to-t from-black/80 to-transparent p-3 sm:p-4 rounded-b-lg backdrop-blur-sm"},{imageUrl:"https://images.unsplash.com/photo-1664710476481-1213c456c56c?q=80&w=2672&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",title:"Culinary Delights",description:"Savor exquisite flavors",buttonText:"View Recipe",containerClass:"md:col-span-2 lg:col-span-1",class:"overflow-hidden rounded-xl shadow-2xl ring-1 ring-gray-300 dark:ring-gray-700",childrenClass:"bg-gradient-to-t from-black/90 via-black/40 to-transparent p-3 sm:p-4 rounded-b-xl"}]},classList:{default:()=>({})}},setup(n){return(t,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(n.classList?.overallClass||"container mx-auto p-4 sm:p-6 lg:p-8")},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.gridClass||"grid grid-cols-2 gap-6 sm:gap-8 xl:gap-10")},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.items,(s,o)=>(e.openBlock(),e.createElementBlock("div",{key:o,class:e.normalizeClass(["flex justify-center",s.containerClass])},[e.createVNode(ei,{"image-url":s.imageUrl,class:e.normalizeClass(s.class||"shadow-lg ring-1 ring-gray-200 dark:ring-gray-800"),"image-class":s.imageClass,"children-class":s.childrenClass},{default:e.withCtx(()=>[s.title?(e.openBlock(),e.createElementBlock("h2",{key:0,class:e.normalizeClass(["text-lg font-semibold sm:text-xl",s.titleClass])},e.toDisplayString(s.title),3)):e.createCommentVNode("",!0),s.description?(e.openBlock(),e.createElementBlock("p",{key:1,class:e.normalizeClass(["mt-1 text-sm opacity-90 sm:mt-2 sm:text-base",s.descriptionClass])},e.toDisplayString(s.description),3)):e.createCommentVNode("",!0),s.buttonText?(e.openBlock(),e.createElementBlock("button",{key:2,class:e.normalizeClass(["mt-3 rounded-lg bg-white px-3 py-1.5 text-sm font-medium text-black transition-all hover:bg-gray-100 hover:scale-105 active:scale-95 sm:mt-4 sm:px-4 sm:py-2 sm:text-base",s.buttonClass])},e.toDisplayString(s.buttonText),3)):e.createCommentVNode("",!0)]),_:2},1032,["image-url","class","image-class","children-class"])],2))),128))],2)],2))}}),Ft=Symbol("mouse-x"),Ot=Symbol("mouse-y"),Ut=Symbol("magnification"),$t=Symbol("distance"),bt=Symbol("orientation"),si=e.defineComponent({__name:"Dock",props:{class:{},magnification:{default:60},distance:{default:140},direction:{default:"middle"},orientation:{default:"horizontal"}},setup(n){const t=n,i=e.ref(null),s=e.ref(1/0),o=e.ref(1/0),r=e.computed(()=>t.magnification),l=e.computed(()=>t.distance),a=e.computed(()=>({"items-start":t.direction==="top","items-center":t.direction==="middle","items-end":t.direction==="bottom"}));function c(d){requestAnimationFrame(()=>{s.value=d.pageX,o.value=d.pageY})}function u(){requestAnimationFrame(()=>{s.value=1/0,o.value=1/0})}return e.provide(Ft,s),e.provide(Ot,o),e.provide(bt,t.orientation),e.provide(Ut,r),e.provide($t,l),(d,m)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"dockRef",ref:i,class:e.normalizeClass(e.unref(K)("supports-backdrop-blur:bg-white/10 supports-backdrop-blur:dark:bg-black/10 mx-auto mt-8 flex h-[58px] w-max rounded-2xl border p-2 backdrop-blur-md transition-all gap-4",n.orientation==="vertical"&&"flex-col w-[58px] h-max",t.class,a.value)),onMousemove:c,onMouseleave:u},[e.renderSlot(d.$slots,"default")],34))}}),ii=["hovered"],oi=e.defineComponent({__name:"Docklcon",setup(n){const t=e.ref(null),i=e.inject(Ft,e.ref(1/0)),s=e.inject(Ot,e.ref(1/0)),o=e.inject($t),r=e.inject(bt,"vertical"),l=e.inject(Ut),a=e.computed(()=>r==="vertical"),c=e.ref(0);function u(m){if(a.value){const f=t.value?.getBoundingClientRect()||{y:0,height:0};return m-f.y-f.height/2}const h=t.value?.getBoundingClientRect()||{x:0,width:0};return m-h.x-h.width/2}const d=e.computed(()=>{const m=a.value?u(s.value):u(i.value);return!o?.value||!l?.value?40:Math.abs(m)<o?.value?(1-Math.abs(m)/o?.value)*l?.value+40:40});return(m,h)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"iconRef",ref:t,class:"flex aspect-square cursor-pointer items-center justify-center rounded-full transition-all duration-200 ease-out",style:e.normalizeStyle({width:`${d.value}px`,height:`${d.value}px`}),hovered:{marginLeft:c.value,marginRight:c.value}},[e.renderSlot(m.$slots,"default")],12,ii))}}),ni=e.defineComponent({__name:"DockSeparator",setup(n){const t=e.inject(bt,"vertical");return(i,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("relative block bg-secondary",e.unref(t)==="vertical"?"w-4/5 h-0.5":"h-4/5 w-0.5"))},null,2))}}),ai=e.defineComponent({__name:"index",props:{icons:{default:()=>["mdi:github","logos:google-drive","logos:notion","logos:whatsapp"]},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location,o=[];return s?.width&&o.push(s.width),s?.height&&o.push(s.height),s?.position&&o.push(s.position),s?.left&&o.push(s.left),s?.top&&o.push(s.top),o.join(" ")||""});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(i.value)},[e.createVNode(e.unref(si),{class:e.normalizeClass(n.classList?.overallClass||"mb-6")},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.icons,(r,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:l},[e.createVNode(e.unref(oi),null,{default:e.withCtx(()=>[e.createVNode(e.unref(ls.Icon),{icon:r},null,8,["icon"])]),_:2},1024),l<n.icons.length-1?(e.openBlock(),e.createBlock(e.unref(ni),{key:0})):e.createCommentVNode("",!0)],64))),128))]),_:1},8,["class"])],2))}}),ri={class:"w-full h-full grid place-items-center contain-layout contain-paint contain-size",style:{perspective:"calc(var(--radius) * 2)",perspectiveOrigin:"50% 50%"}},li=["data-src","data-offset-x","data-offset-y","data-size-x","data-size-y"],ci=["aria-label"],ui=["src","alt"],di=.008,hi=e.defineComponent({__name:"DomeGallery",props:{images:{},fit:{default:.5},fitBasis:{default:"auto"},minRadius:{default:600},maxRadius:{default:1/0},padFactor:{default:.25},overlayBlurColor:{default:"#060010"},maxVerticalRotationDeg:{default:5},dragSensitivity:{default:20},enlargeTransitionMs:{default:300},segments:{default:35},dragDampening:{default:2},openedImageWidth:{default:"400px"},openedImageHeight:{default:"400px"},imageBorderRadius:{default:"30px"},openedImageBorderRadius:{default:"30px"},grayscale:{type:Boolean,default:!0}},setup(n){const t=[{src:"https://images.unsplash.com/photo-1755331039789-7e5680e26e8f?q=80&w=774&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",alt:"Abstract art"},{src:"https://images.unsplash.com/photo-1755569309049-98410b94f66d?q=80&w=772&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",alt:"Modern sculpture"},{src:"https://images.unsplash.com/photo-1755497595318-7e5e3523854f?q=80&w=774&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",alt:"Digital artwork"},{src:"https://images.unsplash.com/photo-1755353985163-c2a0fe5ac3d8?q=80&w=774&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",alt:"Contemporary art"},{src:"https://images.unsplash.com/photo-1745965976680-d00be7dc0377?q=80&w=774&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",alt:"Geometric pattern"},{src:"https://images.unsplash.com/photo-1752588975228-21f44630bb3c?q=80&w=774&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",alt:"Textured surface"},{src:"https://pbs.twimg.com/media/Gyla7NnXMAAXSo_?format=jpg&name=large",alt:"Social media image"}],i=n,s=e.computed(()=>i.images||t),o=e.useTemplateRef("rootRef"),r=e.useTemplateRef("mainRef"),l=e.useTemplateRef("sphereRef"),a=e.useTemplateRef("viewerRef"),c=e.useTemplateRef("scrimRef"),u=e.useTemplateRef("frameRef"),d=e.ref({x:0,y:0}),m=e.ref({x:0,y:0}),h=e.ref(null),f=e.ref(!1),x=e.ref(!1),v=e.ref(!1),w=e.ref(null),p=e.ref(null),_=e.ref(!1),k=e.ref(0),b=e.ref(0);let I=null,U=null,H=null,E=null,C=0;const S=(z,$,j)=>Math.min(Math.max(z,$),j),D=z=>(z%360+360)%360,B=z=>((z+180)%360+360)%360-180,L=(z,$,j)=>{const te=z.dataset[$]??z.getAttribute(`data-${$}`),W=te==null?NaN:parseFloat(te);return Number.isFinite(W)?W:j};function N(z,$){const j=Array.from({length:$},(Z,re)=>-37+re*2),te=[-4,-2,0,2,4],W=[-3,-1,1,3,5],ae=j.flatMap((Z,re)=>(re%2===0?te:W).map(ve=>({x:Z,y:ve,sizeX:2,sizeY:2}))),oe=ae.length;if(z.length===0)return ae.map(Z=>({...Z,src:"",alt:""}));z.length>oe&&console.warn(`[DomeGallery] Provided image count (${z.length}) exceeds available tiles (${oe}). Some images will not be shown.`);const me=z.map(Z=>typeof Z=="string"?{src:Z,alt:""}:{src:Z.src||"",alt:Z.alt||""}),ue=Array.from({length:oe},(Z,re)=>me[re%me.length]);for(let Z=1;Z<ue.length;Z++)if(ue[Z].src===ue[Z-1].src){for(let re=Z+1;re<ue.length;re++)if(ue[re].src!==ue[Z].src){const pe=ue[Z];ue[Z]=ue[re],ue[re]=pe;break}}return ae.map((Z,re)=>({...Z,src:ue[re].src,alt:ue[re].alt}))}const V=e.computed(()=>N(s.value,i.segments));function A(z,$,j,te,W){const ae=360/W/2,oe=ae*(z+(j-1)/2);return{rotateX:ae*($-(te-1)/2),rotateY:oe}}const J=(z,$)=>{const j=l.value;j&&(j.style.transform=`translateZ(calc(var(--radius) * -1)) rotateX(${z}deg) rotateY(${$}deg)`)},y=()=>{_.value||(_.value=!0,document.body.classList.add("overflow-hidden"))},R=()=>{_.value&&o.value?.getAttribute("data-enlarging")!=="true"&&(_.value=!1,document.body.classList.remove("overflow-hidden"))},G=()=>{I&&(cancelAnimationFrame(I),I=null)},le=(z,$)=>{let te=S(z,-1.4,1.4)*80,W=S($,-1.4,1.4)*80,ae=0;const oe=S(i.dragDampening??.6,0,1),me=.94+.055*oe,ue=.015-.01*oe,Z=Math.round(90+270*oe),re=()=>{if(te*=me,W*=me,Math.abs(te)<ue&&Math.abs(W)<ue){I=null;return}if(++ae>Z){I=null;return}const pe=S(d.value.x-W/200,-i.maxVerticalRotationDeg,i.maxVerticalRotationDeg),ve=B(d.value.y+te/200);d.value={x:pe,y:ve},J(pe,ve),I=requestAnimationFrame(re)};G(),I=requestAnimationFrame(re)},q=()=>{E&&(cancelAnimationFrame(E),E=null),C=0},Y=z=>{C||(C=z);const $=z-C;if(C=z,!f.value&&!v.value&&!w.value&&I===null&&$>0){const te=B(d.value.y+$*di);te!==d.value.y&&(d.value={x:d.value.x,y:te})}E=requestAnimationFrame(Y)},se=()=>{E===null&&(C=0,E=requestAnimationFrame(Y))},ie=z=>{if(w.value)return;G(),f.value=!0,x.value=!1,m.value={...d.value};const $="touches"in z?z.touches[0].clientX:z.clientX,j="touches"in z?z.touches[0].clientY:z.clientY;h.value={x:$,y:j}},ce=z=>{if(w.value||!f.value||!h.value)return;const $="touches"in z?z.touches[0].clientX:z.clientX,j="touches"in z?z.touches[0].clientY:z.clientY,te=$-h.value.x,W=j-h.value.y;x.value||te*te+W*W>16&&(x.value=!0);const ae=S(m.value.x-W/i.dragSensitivity,-i.maxVerticalRotationDeg,i.maxVerticalRotationDeg),oe=B(m.value.y+te/i.dragSensitivity);(d.value.x!==ae||d.value.y!==oe)&&(d.value={x:ae,y:oe},J(ae,oe))},fe=z=>{if(f.value){if(f.value=!1,x.value&&h.value){const $="touches"in z?z.changedTouches?.[0]?.clientX??0:z.clientX,j="touches"in z?z.changedTouches?.[0]?.clientY??0:z.clientY,te=$-h.value.x,W=j-h.value.y,ae=S(te/i.dragSensitivity*.02,-1.2,1.2),oe=S(W/i.dragSensitivity*.02,-1.2,1.2);(Math.abs(ae)>.005||Math.abs(oe)>.005)&&le(ae,oe),b.value=performance.now()}x.value=!1}},we=z=>{if(v.value)return;v.value=!0,k.value=performance.now(),y();const $=z.parentElement;if(!$)return;w.value=z,z.setAttribute("data-focused","true");const j=L($,"offsetX",0),te=L($,"offsetY",0),W=L($,"sizeX",2),ae=L($,"sizeY",2),oe=A(j,te,W,ae,i.segments),me=D(oe.rotateY),ue=D(d.value.y);let Z=-(me+ue)%360;Z<-180&&(Z+=360);const re=-oe.rotateX-d.value.x;$.style.setProperty("--rot-y-delta",`${Z}deg`),$.style.setProperty("--rot-x-delta",`${re}deg`);const pe=document.createElement("div");pe.className="item__image item__image--reference",pe.style.opacity="0",pe.style.transform=`rotateX(${-oe.rotateX}deg) rotateY(${-oe.rotateY}deg)`,$.appendChild(pe);const ve=pe.getBoundingClientRect(),Re=r.value?.getBoundingClientRect(),ge=u.value?.getBoundingClientRect();if(!Re||!ge)return;p.value={left:ve.left,top:ve.top,width:ve.width,height:ve.height},z.style.visibility="hidden",z.style.zIndex="0";const X=document.createElement("div");X.className="enlarge",X.style.position="absolute",X.style.left=`${ge.left-Re.left}px`,X.style.top=`${ge.top-Re.top}px`,X.style.width=`${ge.width}px`,X.style.height=`${ge.height}px`,X.style.opacity="0",X.style.zIndex="30",X.style.willChange="transform, opacity",X.style.transformOrigin="top left",X.style.transition=`transform ${i.enlargeTransitionMs}ms ease, opacity ${i.enlargeTransitionMs}ms ease`;const _e=$.dataset.src||z.querySelector("img")?.src||"",Te=document.createElement("img");Te.src=_e,X.appendChild(Te),a.value?.appendChild(X);const Pe=ve.left-ge.left,Ne=ve.top-ge.top,Oe=ve.width/ge.width,We=ve.height/ge.height;if(X.style.transform=`translate(${Pe}px, ${Ne}px) scale(${Oe}, ${We})`,requestAnimationFrame(()=>{X.style.opacity="1",X.style.transform="translate(0px, 0px) scale(1,1)",o.value?.setAttribute("data-enlarging","true"),c.value?.classList.add("opacity-100","pointer-events-auto"),c.value?.classList.remove("opacity-0","pointer-events-none")}),i.openedImageWidth||i.openedImageHeight){const it=He=>{if(He.propertyName!=="transform")return;X.removeEventListener("transitionend",it);const ut=X.style.transition;X.style.transition="none";const ot=i.openedImageWidth||`${ge.width}px`,Xe=i.openedImageHeight||`${ge.height}px`;X.style.width=ot,X.style.height=Xe;const qe=X.getBoundingClientRect();X.style.width=`${ge.width}px`,X.style.height=`${ge.height}px`,X.offsetWidth,X.style.transition=`left ${i.enlargeTransitionMs}ms ease, top ${i.enlargeTransitionMs}ms ease, width ${i.enlargeTransitionMs}ms ease, height ${i.enlargeTransitionMs}ms ease`;const g=ge.left-Re.left+(ge.width-qe.width)/2,M=ge.top-Re.top+(ge.height-qe.height)/2;requestAnimationFrame(()=>{X.style.left=`${g}px`,X.style.top=`${M}px`,X.style.width=ot,X.style.height=Xe});const T=()=>{X.removeEventListener("transitionend",T),X.style.transition=ut};X.addEventListener("transitionend",T,{once:!0})};X.addEventListener("transitionend",it)}},be=()=>{if(performance.now()-k.value<250)return;const z=w.value;if(!z)return;const $=z.parentElement,j=a.value?.querySelector(".enlarge");if(!j||!$)return;const te=$.querySelector(".item__image--reference"),W=p.value;if(!W){j.remove(),te&&te.remove(),$.style.setProperty("--rot-y-delta","0deg"),$.style.setProperty("--rot-x-delta","0deg"),z.style.visibility="",z.style.zIndex="0",w.value=null,o.value?.removeAttribute("data-enlarging"),c.value?.classList.add("opacity-0","pointer-events-none"),c.value?.classList.remove("opacity-100","pointer-events-auto"),v.value=!1,R();return}const ae=j.getBoundingClientRect(),oe=o.value?.getBoundingClientRect();if(!oe)return;const me={left:W.left-oe.left,top:W.top-oe.top,width:W.width,height:W.height},ue={left:ae.left-oe.left,top:ae.top-oe.top,width:ae.width,height:ae.height},Z=document.createElement("div");Z.className="enlarge-closing",Z.style.cssText=`position:absolute;left:${ue.left}px;top:${ue.top}px;width:${ue.width}px;height:${ue.height}px;z-index:9999;border-radius: var(--enlarge-radius, 32px);overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:all ${i.enlargeTransitionMs}ms ease-out;pointer-events:none;margin:0;transform:none;`;const re=j.querySelector("img");if(re){const ve=re.cloneNode();ve.style.cssText="width:100%;height:100%;object-fit:cover;",Z.appendChild(ve)}j.remove(),o.value?.appendChild(Z),Z.getBoundingClientRect(),requestAnimationFrame(()=>{Z.style.left=`${me.left}px`,Z.style.top=`${me.top}px`,Z.style.width=`${me.width}px`,Z.style.height=`${me.height}px`,Z.style.opacity="0"});const pe=()=>{Z.remove(),p.value=null,te&&te.remove(),$.style.transition="none",z.style.transition="none",$.style.setProperty("--rot-y-delta","0deg"),$.style.setProperty("--rot-x-delta","0deg"),requestAnimationFrame(()=>{z.style.visibility="",z.style.opacity="0",z.style.zIndex="0",w.value=null,o.value?.removeAttribute("data-enlarging"),c.value?.classList.add("opacity-0","pointer-events-none"),c.value?.classList.remove("opacity-100","pointer-events-auto"),requestAnimationFrame(()=>{$.style.transition="",z.style.transition="opacity 300ms ease-out",requestAnimationFrame(()=>{z.style.opacity="1",setTimeout(()=>{z.style.transition="",z.style.opacity="",v.value=!1,R()},300)})})})};Z.addEventListener("transitionend",pe,{once:!0})},Ee=z=>{f.value||performance.now()-b.value<80||v.value||we(z.currentTarget)},De=z=>{z.pointerType==="touch"&&(f.value||performance.now()-b.value<80||v.value||we(z.currentTarget))},Fe=z=>{f.value||performance.now()-b.value<80||v.value||we(z.currentTarget)};return e.onMounted(()=>{J(d.value.x,d.value.y),se();const z=o.value,$=r.value;if(!z||!$)return;U=new ResizeObserver(te=>{const W=te[0].contentRect,ae=Math.max(1,W.width),oe=Math.max(1,W.height),me=Math.min(ae,oe),ue=Math.max(ae,oe),Z=ae/oe;let re;switch(i.fitBasis){case"min":re=me;break;case"max":re=ue;break;case"width":re=ae;break;case"height":re=oe;break;default:re=Z>=1.3?ae:me}let pe=re*i.fit;const ve=oe*1.35;pe=Math.min(pe,ve),pe=S(pe,i.minRadius,i.maxRadius);const Re=Math.max(8,Math.round(me*i.padFactor)),ge=Math.round(pe);z.style.setProperty("--radius",`${ge}px`),z.style.setProperty("--viewer-pad",`${Re}px`);const X=a.value?.querySelector(".enlarge");if(X&&u.value&&r.value){const _e=u.value.getBoundingClientRect(),Te=r.value.getBoundingClientRect();if(i.openedImageWidth&&i.openedImageHeight){const Pe=document.createElement("div");Pe.style.cssText=`position:absolute;visibility:hidden;width:${i.openedImageWidth};height:${i.openedImageHeight};pointer-events:none;`,document.body.appendChild(Pe);const Ne=Pe.getBoundingClientRect();document.body.removeChild(Pe);const Oe=_e.left-Te.left+(_e.width-Ne.width)/2,We=_e.top-Te.top+(_e.height-Ne.height)/2;X.style.left=`${Oe}px`,X.style.top=`${We}px`,X.style.width=i.openedImageWidth,X.style.height=i.openedImageHeight}else X.style.left=`${_e.left-Te.left}px`,X.style.top=`${_e.top-Te.top}px`,X.style.width=`${_e.width}px`,X.style.height=`${_e.height}px`}}),U.observe(z),$.addEventListener("mousedown",ie,{passive:!0}),$.addEventListener("touchstart",ie,{passive:!0}),window.addEventListener("mousemove",ce,{passive:!0}),window.addEventListener("touchmove",ce,{passive:!0}),window.addEventListener("mouseup",fe),window.addEventListener("touchend",fe);const j=c.value;j&&j.addEventListener("click",be),H=te=>{te.key==="Escape"&&be()},window.addEventListener("keydown",H)}),e.onUnmounted(()=>{G(),q(),U&&U.disconnect();const z=r.value,$=c.value;z&&(z.removeEventListener("mousedown",ie),z.removeEventListener("touchstart",ie)),$&&$.removeEventListener("click",be),window.removeEventListener("mousemove",ce),window.removeEventListener("touchmove",ce),window.removeEventListener("mouseup",fe),window.removeEventListener("touchend",fe),H&&window.removeEventListener("keydown",H),document.body.classList.remove("overflow-hidden")}),e.watch(d,z=>{J(z.x,z.y)}),(z,$)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootRef",ref:o,class:"relative w-full h-[1000px] box-border",style:e.normalizeStyle({"--segments-x":n.segments,"--segments-y":n.segments,"--overlay-blur-color":n.overlayBlurColor,"--tile-radius":n.imageBorderRadius,"--enlarge-radius":n.openedImageBorderRadius,"--image-filter":n.grayscale?"grayscale(1)":"none","--radius":"520px","--viewer-pad":"72px","--circ":"calc(var(--radius) * 3.14)","--rot-y":"calc((360deg / var(--segments-x)) / 2)","--rot-x":"calc((360deg / var(--segments-y)) / 2)","--item-width":"calc(var(--circ) / var(--segments-x))","--item-height":"calc(var(--circ) / var(--segments-y))"})},[e.createElementVNode("main",{ref_key:"mainRef",ref:r,class:"absolute inset-0 grid place-items-center overflow-hidden touch-none select-none bg-transparent"},[e.createElementVNode("div",ri,[e.createElementVNode("div",{ref_key:"sphereRef",ref:l,class:"will-change-transform",style:{"transform-style":"preserve-3d",transform:"translateZ(calc(var(--radius) * -1))"}},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(V.value,(j,te)=>(e.openBlock(),e.createElementBlock("div",{key:`${j.x},${j.y},${te}`,class:"absolute -top-[999px] -bottom-[999px] -left-[999px] -right-[999px] m-auto transition-transform duration-300","data-src":j.src,"data-offset-x":j.x,"data-offset-y":j.y,"data-size-x":j.sizeX,"data-size-y":j.sizeY,style:e.normalizeStyle({"--offset-x":j.x,"--offset-y":j.y,"--item-size-x":j.sizeX,"--item-size-y":j.sizeY,width:"calc(var(--item-width) * var(--item-size-x))",height:"calc(var(--item-height) * var(--item-size-y))",transformStyle:"preserve-3d",transformOrigin:"50% 50%",backfaceVisibility:"hidden",transform:"rotateY(calc(var(--rot-y) * (var(--offset-x) + ((var(--item-size-x) - 1) / 2)) + var(--rot-y-delta, 0deg))) rotateX(calc(var(--rot-x) * (var(--offset-y) - ((var(--item-size-y) - 1) / 2)) + var(--rot-x-delta, 0deg))) translateZ(var(--radius))"})},[e.createElementVNode("div",{class:"absolute block inset-[10px] bg-transparent overflow-hidden transition-transform duration-300 cursor-pointer pointer-events-auto transform translate-z-0 focus:outline-none",role:"button",tabindex:"0","aria-label":j.alt||"Open image",onClick:Ee,onPointerup:De,onTouchend:Fe,style:{borderRadius:"var(--tile-radius, 12px)",transformStyle:"preserve-3d",backfaceVisibility:"hidden",touchAction:"manipulation",WebkitTapHighlightColor:"transparent",WebkitTransform:"translateZ(0)"}},[e.createElementVNode("img",{src:j.src,draggable:"false",alt:j.alt,class:"w-full h-full object-cover pointer-events-none",style:{backfaceVisibility:"hidden",filter:"var(--image-filter, none)"}},null,8,ui)],40,ci)],12,li))),128))],512)]),$[0]||($[0]=e.createElementVNode("div",{class:"absolute inset-0 m-auto z-[3] pointer-events-none",style:{backgroundImage:"radial-gradient(rgba(235, 235, 235, 0) 65%, var(--overlay-blur-color, #060010) 100%)"}},null,-1)),$[1]||($[1]=e.createElementVNode("div",{class:"absolute inset-0 m-auto z-[3] pointer-events-none",style:{WebkitMaskImage:"radial-gradient(rgba(235, 235, 235, 0) 70%, var(--overlay-blur-color, #060010) 90%)",maskImage:"radial-gradient(rgba(235, 235, 235, 0) 70%, var(--overlay-blur-color, #060010) 90%)",backdropFilter:"blur(3px)"}},null,-1)),$[2]||($[2]=e.createElementVNode("div",{class:"absolute left-0 right-0 h-[120px] z-[5] pointer-events-none top-0 rotate-180",style:{background:"linear-gradient(to bottom, transparent, var(--overlay-blur-color, #060010))"}},null,-1)),$[3]||($[3]=e.createElementVNode("div",{class:"absolute left-0 right-0 h-[120px] z-[5] pointer-events-none bottom-0",style:{background:"linear-gradient(to bottom, transparent, var(--overlay-blur-color, #060010))"}},null,-1)),e.createElementVNode("div",{ref_key:"viewerRef",ref:a,class:"absolute inset-0 z-20 pointer-events-none flex items-center justify-center",style:{padding:"var(--viewer-pad)"}},[e.createElementVNode("div",{ref_key:"scrimRef",ref:c,class:"absolute inset-0 z-10 bg-black/40 pointer-events-none opacity-0 transition-opacity duration-500 ease-linear",style:{backdropFilter:"blur(3px)"}},null,512),e.createElementVNode("div",{ref_key:"frameRef",ref:u,class:"h-full aspect-square flex max-[1/1]:h-auto max-[1/1]:w-full",style:{borderRadius:"var(--enlarge-radius, 32px)"}},null,512)],512)],512)],4))}}),mi=e.defineComponent({__name:"index",props:{images:{default:()=>["https://images.unsplash.com/photo-1755331039789-7e5680e26e8f?q=80&w=774&auto=format&fit=crop","https://images.unsplash.com/photo-1755569309049-98410b94f66d?q=80&w=772&auto=format&fit=crop","https://images.unsplash.com/photo-1755497595318-7e5e3523854f?q=80&w=774&auto=format&fit=crop"]},fit:{default:.8},fitBasis:{default:"auto"},minRadius:{default:600},segments:{default:34},dragSensitivity:{default:20},enlargeTransitionMs:{default:300},grayscale:{type:Boolean,default:!0},overlayBlurColor:{default:"#060010"},imageBorderRadius:{default:"30px"},openedImageWidth:{default:"250px"},openedImageHeight:{default:"350px"},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location,o=[];return t.classList?.overallClass&&o.push(t.classList.overallClass),s?.width&&o.push(s.width),s?.height&&o.push(s.height),s?.position&&o.push(s.position),s?.left&&o.push(s.left),s?.top&&o.push(s.top),o.join(" ")||"w-full h-[1000px]"});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(i.value)},[e.createVNode(hi,{images:n.images,fit:n.fit,"fit-basis":n.fitBasis,"min-radius":n.minRadius,segments:n.segments,"drag-sensitivity":n.dragSensitivity,"enlarge-transition-ms":n.enlargeTransitionMs,grayscale:n.grayscale,"overlay-blur-color":n.overlayBlurColor,"image-border-radius":n.imageBorderRadius,"opened-image-width":n.openedImageWidth,"opened-image-height":n.openedImageHeight},null,8,["images","fit","fit-basis","min-radius","segments","drag-sensitivity","enlarge-transition-ms","grayscale","overlay-blur-color","image-border-radius","opened-image-width","opened-image-height"])],2))}}),fi=["src","alt"],pi=e.defineComponent({__name:"ExpandableGallery",props:{images:{},class:{}},setup(n){const t=n;return(i,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)(t.class))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.images,o=>(e.openBlock(),e.createElementBlock("div",{key:o,class:"relative flex h-full flex-1 cursor-pointer overflow-hidden rounded-xl transition-all duration-500 ease-in-out hover:flex-[3]"},[e.createElementVNode("img",{class:"relative h-full object-cover",src:o,alt:o},null,8,fi)]))),128))],2))}}),gi=e.defineComponent({__name:"index",props:{images:{},classList:{}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createBlock(pi,{images:n.images,class:e.normalizeClass([n.classList?.overallClass,i.value])},null,8,["images","class"]))}}),vi=e.defineComponent({__name:"FluidCursor",props:{simResolution:{default:128},dyeResolution:{default:1440},captureResolution:{default:512},densityDissipation:{default:3.5},velocityDissipation:{default:2},pressure:{default:.1},pressureIterations:{default:20},curl:{default:3},splatRadius:{default:.2},splatForce:{default:6e3},shading:{type:Boolean,default:!0},colorUpdateSpeed:{default:10},backColor:{default:()=>({r:.5,g:0,b:0})},transparent:{type:Boolean,default:!0},class:{}},setup(n){const t=n;function i(){return{id:-1,texcoordX:0,texcoordY:0,prevTexcoordX:0,prevTexcoordY:0,deltaX:0,deltaY:0,down:!1,moved:!1,color:{r:0,g:0,b:0}}}const s=e.ref(null);return e.onMounted(()=>{const o=s.value;if(!o)return;const r=[i()],l={SIM_RESOLUTION:t.simResolution,DYE_RESOLUTION:t.dyeResolution,CAPTURE_RESOLUTION:t.captureResolution,DENSITY_DISSIPATION:t.densityDissipation,VELOCITY_DISSIPATION:t.velocityDissipation,PRESSURE:t.pressure,PRESSURE_ITERATIONS:t.pressureIterations,CURL:t.curl,SPLAT_RADIUS:t.splatRadius,SPLAT_FORCE:t.splatForce,SHADING:t.shading,COLOR_UPDATE_SPEED:t.colorUpdateSpeed,BACK_COLOR:t.backColor,TRANSPARENT:t.transparent},{gl:a,ext:c}=u(o);if(!a||!c)return;c.supportLinearFiltering||(l.DYE_RESOLUTION=256,l.SHADING=!1);function u(g){const M={alpha:!0,depth:!1,stencil:!1,antialias:!1,preserveDrawingBuffer:!1};let T=g.getContext("webgl2",M);if(T||(T=g.getContext("webgl",M)||g.getContext("experimental-webgl",M)),!T)throw new Error("Unable to initialize WebGL.");const P="drawBuffers"in T;let O=!1,Q=null;P?(T.getExtension("EXT_color_buffer_float"),O=!!T.getExtension("OES_texture_float_linear")):(Q=T.getExtension("OES_texture_half_float"),O=!!T.getExtension("OES_texture_half_float_linear")),T.clearColor(0,0,0,1);const ne=P?T.HALF_FLOAT:Q&&Q.HALF_FLOAT_OES||0;let ke,Se,Ie;return P?(ke=d(T,T.RGBA16F,T.RGBA,ne),Se=d(T,T.RG16F,T.RG,ne),Ie=d(T,T.R16F,T.RED,ne)):(ke=d(T,T.RGBA,T.RGBA,ne),Se=d(T,T.RGBA,T.RGBA,ne),Ie=d(T,T.RGBA,T.RGBA,ne)),{gl:T,ext:{formatRGBA:ke,formatRG:Se,formatR:Ie,halfFloatTexType:ne,supportLinearFiltering:O}}}function d(g,M,T,P){if(!m(g,M,T,P)){if("drawBuffers"in g){const O=g;switch(M){case O.R16F:return d(O,O.RG16F,O.RG,P);case O.RG16F:return d(O,O.RGBA16F,O.RGBA,P);default:return null}}return null}return{internalFormat:M,format:T}}function m(g,M,T,P){const O=g.createTexture();if(!O)return!1;g.bindTexture(g.TEXTURE_2D,O),g.texParameteri(g.TEXTURE_2D,g.TEXTURE_MIN_FILTER,g.NEAREST),g.texParameteri(g.TEXTURE_2D,g.TEXTURE_MAG_FILTER,g.NEAREST),g.texParameteri(g.TEXTURE_2D,g.TEXTURE_WRAP_S,g.CLAMP_TO_EDGE),g.texParameteri(g.TEXTURE_2D,g.TEXTURE_WRAP_T,g.CLAMP_TO_EDGE),g.texImage2D(g.TEXTURE_2D,0,M,4,4,0,T,P,null);const Q=g.createFramebuffer();return Q?(g.bindFramebuffer(g.FRAMEBUFFER,Q),g.framebufferTexture2D(g.FRAMEBUFFER,g.COLOR_ATTACHMENT0,g.TEXTURE_2D,O,0),g.checkFramebufferStatus(g.FRAMEBUFFER)===g.FRAMEBUFFER_COMPLETE):!1}function h(g){if(!g.length)return 0;let M=0;for(let T=0;T<g.length;T++)M=(M<<5)-M+g.charCodeAt(T),M|=0;return M}function f(g,M){if(!M)return g;let T="";for(const P of M)T+=`#define ${P}
|
|
162
|
+
`;return T+g}function x(g,M,T=null){const P=f(M,T),O=a.createShader(g);return O?(a.shaderSource(O,P),a.compileShader(O),O):null}function v(g,M){if(!g||!M)return null;const T=a.createProgram();return T?(a.attachShader(T,g),a.attachShader(T,M),a.linkProgram(T),T):null}function w(g){const M={},T=a.getProgramParameter(g,a.ACTIVE_UNIFORMS);for(let P=0;P<T;P++){const O=a.getActiveUniform(g,P);O&&(M[O.name]=a.getUniformLocation(g,O.name))}return M}class p{program;uniforms;constructor(M,T){this.program=v(M,T),this.uniforms=this.program?w(this.program):{}}bind(){this.program&&a.useProgram(this.program)}}class _{vertexShader;fragmentShaderSource;programs;activeProgram;uniforms;constructor(M,T){this.vertexShader=M,this.fragmentShaderSource=T,this.programs={},this.activeProgram=null,this.uniforms={}}setKeywords(M){let T=0;for(const O of M)T+=h(O);let P=this.programs[T];if(P==null){const O=x(a.FRAGMENT_SHADER,this.fragmentShaderSource,M);P=v(this.vertexShader,O),this.programs[T]=P}P!==this.activeProgram&&(P&&(this.uniforms=w(P)),this.activeProgram=P)}bind(){this.activeProgram&&a.useProgram(this.activeProgram)}}const k=x(a.VERTEX_SHADER,`
|
|
163
|
+
precision highp float;
|
|
164
|
+
attribute vec2 aPosition;
|
|
165
|
+
varying vec2 vUv;
|
|
166
|
+
varying vec2 vL;
|
|
167
|
+
varying vec2 vR;
|
|
168
|
+
varying vec2 vT;
|
|
169
|
+
varying vec2 vB;
|
|
170
|
+
uniform vec2 texelSize;
|
|
171
|
+
|
|
172
|
+
void main () {
|
|
173
|
+
vUv = aPosition * 0.5 + 0.5;
|
|
174
|
+
vL = vUv - vec2(texelSize.x, 0.0);
|
|
175
|
+
vR = vUv + vec2(texelSize.x, 0.0);
|
|
176
|
+
vT = vUv + vec2(0.0, texelSize.y);
|
|
177
|
+
vB = vUv - vec2(0.0, texelSize.y);
|
|
178
|
+
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
179
|
+
}
|
|
180
|
+
`),b=x(a.FRAGMENT_SHADER,`
|
|
181
|
+
precision mediump float;
|
|
182
|
+
precision mediump sampler2D;
|
|
183
|
+
varying highp vec2 vUv;
|
|
184
|
+
uniform sampler2D uTexture;
|
|
185
|
+
|
|
186
|
+
void main () {
|
|
187
|
+
gl_FragColor = texture2D(uTexture, vUv);
|
|
188
|
+
}
|
|
189
|
+
`),I=x(a.FRAGMENT_SHADER,`
|
|
190
|
+
precision mediump float;
|
|
191
|
+
precision mediump sampler2D;
|
|
192
|
+
varying highp vec2 vUv;
|
|
193
|
+
uniform sampler2D uTexture;
|
|
194
|
+
uniform float value;
|
|
195
|
+
|
|
196
|
+
void main () {
|
|
197
|
+
gl_FragColor = value * texture2D(uTexture, vUv);
|
|
198
|
+
}
|
|
199
|
+
`),U=`
|
|
200
|
+
precision highp float;
|
|
201
|
+
precision highp sampler2D;
|
|
202
|
+
varying vec2 vUv;
|
|
203
|
+
varying vec2 vL;
|
|
204
|
+
varying vec2 vR;
|
|
205
|
+
varying vec2 vT;
|
|
206
|
+
varying vec2 vB;
|
|
207
|
+
uniform sampler2D uTexture;
|
|
208
|
+
uniform sampler2D uDithering;
|
|
209
|
+
uniform vec2 ditherScale;
|
|
210
|
+
uniform vec2 texelSize;
|
|
211
|
+
|
|
212
|
+
vec3 linearToGamma (vec3 color) {
|
|
213
|
+
color = max(color, vec3(0));
|
|
214
|
+
return max(1.055 * pow(color, vec3(0.416666667)) - 0.055, vec3(0));
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
void main () {
|
|
218
|
+
vec3 c = texture2D(uTexture, vUv).rgb;
|
|
219
|
+
#ifdef SHADING
|
|
220
|
+
vec3 lc = texture2D(uTexture, vL).rgb;
|
|
221
|
+
vec3 rc = texture2D(uTexture, vR).rgb;
|
|
222
|
+
vec3 tc = texture2D(uTexture, vT).rgb;
|
|
223
|
+
vec3 bc = texture2D(uTexture, vB).rgb;
|
|
224
|
+
|
|
225
|
+
float dx = length(rc) - length(lc);
|
|
226
|
+
float dy = length(tc) - length(bc);
|
|
227
|
+
|
|
228
|
+
vec3 n = normalize(vec3(dx, dy, length(texelSize)));
|
|
229
|
+
vec3 l = vec3(0.0, 0.0, 1.0);
|
|
230
|
+
|
|
231
|
+
float diffuse = clamp(dot(n, l) + 0.7, 0.7, 1.0);
|
|
232
|
+
c *= diffuse;
|
|
233
|
+
#endif
|
|
234
|
+
|
|
235
|
+
float a = max(c.r, max(c.g, c.b));
|
|
236
|
+
gl_FragColor = vec4(c, a);
|
|
237
|
+
}
|
|
238
|
+
`,H=x(a.FRAGMENT_SHADER,`
|
|
239
|
+
precision highp float;
|
|
240
|
+
precision highp sampler2D;
|
|
241
|
+
varying vec2 vUv;
|
|
242
|
+
uniform sampler2D uTarget;
|
|
243
|
+
uniform float aspectRatio;
|
|
244
|
+
uniform vec3 color;
|
|
245
|
+
uniform vec2 point;
|
|
246
|
+
uniform float radius;
|
|
247
|
+
|
|
248
|
+
void main () {
|
|
249
|
+
vec2 p = vUv - point.xy;
|
|
250
|
+
p.x *= aspectRatio;
|
|
251
|
+
vec3 splat = exp(-dot(p, p) / radius) * color;
|
|
252
|
+
vec3 base = texture2D(uTarget, vUv).xyz;
|
|
253
|
+
gl_FragColor = vec4(base + splat, 1.0);
|
|
254
|
+
}
|
|
255
|
+
`),E=x(a.FRAGMENT_SHADER,`
|
|
256
|
+
precision highp float;
|
|
257
|
+
precision highp sampler2D;
|
|
258
|
+
varying vec2 vUv;
|
|
259
|
+
uniform sampler2D uVelocity;
|
|
260
|
+
uniform sampler2D uSource;
|
|
261
|
+
uniform vec2 texelSize;
|
|
262
|
+
uniform vec2 dyeTexelSize;
|
|
263
|
+
uniform float dt;
|
|
264
|
+
uniform float dissipation;
|
|
265
|
+
|
|
266
|
+
vec4 bilerp (sampler2D sam, vec2 uv, vec2 tsize) {
|
|
267
|
+
vec2 st = uv / tsize - 0.5;
|
|
268
|
+
vec2 iuv = floor(st);
|
|
269
|
+
vec2 fuv = fract(st);
|
|
270
|
+
|
|
271
|
+
vec4 a = texture2D(sam, (iuv + vec2(0.5, 0.5)) * tsize);
|
|
272
|
+
vec4 b = texture2D(sam, (iuv + vec2(1.5, 0.5)) * tsize);
|
|
273
|
+
vec4 c = texture2D(sam, (iuv + vec2(0.5, 1.5)) * tsize);
|
|
274
|
+
vec4 d = texture2D(sam, (iuv + vec2(1.5, 1.5)) * tsize);
|
|
275
|
+
|
|
276
|
+
return mix(mix(a, b, fuv.x), mix(c, d, fuv.x), fuv.y);
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
void main () {
|
|
280
|
+
#ifdef MANUAL_FILTERING
|
|
281
|
+
vec2 coord = vUv - dt * bilerp(uVelocity, vUv, texelSize).xy * texelSize;
|
|
282
|
+
vec4 result = bilerp(uSource, coord, dyeTexelSize);
|
|
283
|
+
#else
|
|
284
|
+
vec2 coord = vUv - dt * texture2D(uVelocity, vUv).xy * texelSize;
|
|
285
|
+
vec4 result = texture2D(uSource, coord);
|
|
286
|
+
#endif
|
|
287
|
+
float decay = 1.0 + dissipation * dt;
|
|
288
|
+
gl_FragColor = result / decay;
|
|
289
|
+
}
|
|
290
|
+
`,c.supportLinearFiltering?null:["MANUAL_FILTERING"]),C=x(a.FRAGMENT_SHADER,`
|
|
291
|
+
precision mediump float;
|
|
292
|
+
precision mediump sampler2D;
|
|
293
|
+
varying highp vec2 vUv;
|
|
294
|
+
varying highp vec2 vL;
|
|
295
|
+
varying highp vec2 vR;
|
|
296
|
+
varying highp vec2 vT;
|
|
297
|
+
varying highp vec2 vB;
|
|
298
|
+
uniform sampler2D uVelocity;
|
|
299
|
+
|
|
300
|
+
void main () {
|
|
301
|
+
float L = texture2D(uVelocity, vL).x;
|
|
302
|
+
float R = texture2D(uVelocity, vR).x;
|
|
303
|
+
float T = texture2D(uVelocity, vT).y;
|
|
304
|
+
float B = texture2D(uVelocity, vB).y;
|
|
305
|
+
|
|
306
|
+
vec2 C = texture2D(uVelocity, vUv).xy;
|
|
307
|
+
if (vL.x < 0.0) { L = -C.x; }
|
|
308
|
+
if (vR.x > 1.0) { R = -C.x; }
|
|
309
|
+
if (vT.y > 1.0) { T = -C.y; }
|
|
310
|
+
if (vB.y < 0.0) { B = -C.y; }
|
|
311
|
+
|
|
312
|
+
float div = 0.5 * (R - L + T - B);
|
|
313
|
+
gl_FragColor = vec4(div, 0.0, 0.0, 1.0);
|
|
314
|
+
}
|
|
315
|
+
`),S=x(a.FRAGMENT_SHADER,`
|
|
316
|
+
precision mediump float;
|
|
317
|
+
precision mediump sampler2D;
|
|
318
|
+
varying highp vec2 vUv;
|
|
319
|
+
varying highp vec2 vL;
|
|
320
|
+
varying highp vec2 vR;
|
|
321
|
+
varying highp vec2 vT;
|
|
322
|
+
varying highp vec2 vB;
|
|
323
|
+
uniform sampler2D uVelocity;
|
|
324
|
+
|
|
325
|
+
void main () {
|
|
326
|
+
float L = texture2D(uVelocity, vL).y;
|
|
327
|
+
float R = texture2D(uVelocity, vR).y;
|
|
328
|
+
float T = texture2D(uVelocity, vT).x;
|
|
329
|
+
float B = texture2D(uVelocity, vB).x;
|
|
330
|
+
float vorticity = R - L - T + B;
|
|
331
|
+
gl_FragColor = vec4(0.5 * vorticity, 0.0, 0.0, 1.0);
|
|
332
|
+
}
|
|
333
|
+
`),D=x(a.FRAGMENT_SHADER,`
|
|
334
|
+
precision highp float;
|
|
335
|
+
precision highp sampler2D;
|
|
336
|
+
varying vec2 vUv;
|
|
337
|
+
varying vec2 vL;
|
|
338
|
+
varying vec2 vR;
|
|
339
|
+
varying vec2 vT;
|
|
340
|
+
varying vec2 vB;
|
|
341
|
+
uniform sampler2D uVelocity;
|
|
342
|
+
uniform sampler2D uCurl;
|
|
343
|
+
uniform float curl;
|
|
344
|
+
uniform float dt;
|
|
345
|
+
|
|
346
|
+
void main () {
|
|
347
|
+
float L = texture2D(uCurl, vL).x;
|
|
348
|
+
float R = texture2D(uCurl, vR).x;
|
|
349
|
+
float T = texture2D(uCurl, vT).x;
|
|
350
|
+
float B = texture2D(uCurl, vB).x;
|
|
351
|
+
float C = texture2D(uCurl, vUv).x;
|
|
352
|
+
|
|
353
|
+
vec2 force = 0.5 * vec2(abs(T) - abs(B), abs(R) - abs(L));
|
|
354
|
+
force /= length(force) + 0.0001;
|
|
355
|
+
force *= curl * C;
|
|
356
|
+
force.y *= -1.0;
|
|
357
|
+
|
|
358
|
+
vec2 velocity = texture2D(uVelocity, vUv).xy;
|
|
359
|
+
velocity += force * dt;
|
|
360
|
+
velocity = min(max(velocity, -1000.0), 1000.0);
|
|
361
|
+
gl_FragColor = vec4(velocity, 0.0, 1.0);
|
|
362
|
+
}
|
|
363
|
+
`),B=x(a.FRAGMENT_SHADER,`
|
|
364
|
+
precision mediump float;
|
|
365
|
+
precision mediump sampler2D;
|
|
366
|
+
varying highp vec2 vUv;
|
|
367
|
+
varying highp vec2 vL;
|
|
368
|
+
varying highp vec2 vR;
|
|
369
|
+
varying highp vec2 vT;
|
|
370
|
+
varying highp vec2 vB;
|
|
371
|
+
uniform sampler2D uPressure;
|
|
372
|
+
uniform sampler2D uDivergence;
|
|
373
|
+
|
|
374
|
+
void main () {
|
|
375
|
+
float L = texture2D(uPressure, vL).x;
|
|
376
|
+
float R = texture2D(uPressure, vR).x;
|
|
377
|
+
float T = texture2D(uPressure, vT).x;
|
|
378
|
+
float B = texture2D(uPressure, vB).x;
|
|
379
|
+
float C = texture2D(uPressure, vUv).x;
|
|
380
|
+
float divergence = texture2D(uDivergence, vUv).x;
|
|
381
|
+
float pressure = (L + R + B + T - divergence) * 0.25;
|
|
382
|
+
gl_FragColor = vec4(pressure, 0.0, 0.0, 1.0);
|
|
383
|
+
}
|
|
384
|
+
`),L=x(a.FRAGMENT_SHADER,`
|
|
385
|
+
precision mediump float;
|
|
386
|
+
precision mediump sampler2D;
|
|
387
|
+
varying highp vec2 vUv;
|
|
388
|
+
varying highp vec2 vL;
|
|
389
|
+
varying highp vec2 vR;
|
|
390
|
+
varying highp vec2 vT;
|
|
391
|
+
varying highp vec2 vB;
|
|
392
|
+
uniform sampler2D uPressure;
|
|
393
|
+
uniform sampler2D uVelocity;
|
|
394
|
+
|
|
395
|
+
void main () {
|
|
396
|
+
float L = texture2D(uPressure, vL).x;
|
|
397
|
+
float R = texture2D(uPressure, vR).x;
|
|
398
|
+
float T = texture2D(uPressure, vT).x;
|
|
399
|
+
float B = texture2D(uPressure, vB).x;
|
|
400
|
+
vec2 velocity = texture2D(uVelocity, vUv).xy;
|
|
401
|
+
velocity.xy -= vec2(R - L, T - B);
|
|
402
|
+
gl_FragColor = vec4(velocity, 0.0, 1.0);
|
|
403
|
+
}
|
|
404
|
+
`),N=(()=>{const g=a.createBuffer();a.bindBuffer(a.ARRAY_BUFFER,g),a.bufferData(a.ARRAY_BUFFER,new Float32Array([-1,-1,-1,1,1,1,1,-1]),a.STATIC_DRAW);const M=a.createBuffer();return a.bindBuffer(a.ELEMENT_ARRAY_BUFFER,M),a.bufferData(a.ELEMENT_ARRAY_BUFFER,new Uint16Array([0,1,2,0,2,3]),a.STATIC_DRAW),a.vertexAttribPointer(0,2,a.FLOAT,!1,0,0),a.enableVertexAttribArray(0),(T,P=!1)=>{a&&(T?(a.viewport(0,0,T.width,T.height),a.bindFramebuffer(a.FRAMEBUFFER,T.fbo)):(a.viewport(0,0,a.drawingBufferWidth,a.drawingBufferHeight),a.bindFramebuffer(a.FRAMEBUFFER,null)),P&&(a.clearColor(0,0,0,1),a.clear(a.COLOR_BUFFER_BIT)),a.drawElements(a.TRIANGLES,6,a.UNSIGNED_SHORT,0))}})();let V,A,J,y,R;const G=new p(k,b),le=new p(k,I),q=new p(k,H),Y=new p(k,E),se=new p(k,C),ie=new p(k,S),ce=new p(k,D),fe=new p(k,B),we=new p(k,L),be=new _(k,U);function Ee(g,M,T,P,O,Q){a.activeTexture(a.TEXTURE0);const ne=a.createTexture();a.bindTexture(a.TEXTURE_2D,ne),a.texParameteri(a.TEXTURE_2D,a.TEXTURE_MIN_FILTER,Q),a.texParameteri(a.TEXTURE_2D,a.TEXTURE_MAG_FILTER,Q),a.texParameteri(a.TEXTURE_2D,a.TEXTURE_WRAP_S,a.CLAMP_TO_EDGE),a.texParameteri(a.TEXTURE_2D,a.TEXTURE_WRAP_T,a.CLAMP_TO_EDGE),a.texImage2D(a.TEXTURE_2D,0,T,g,M,0,P,O,null);const ke=a.createFramebuffer();a.bindFramebuffer(a.FRAMEBUFFER,ke),a.framebufferTexture2D(a.FRAMEBUFFER,a.COLOR_ATTACHMENT0,a.TEXTURE_2D,ne,0),a.viewport(0,0,g,M),a.clear(a.COLOR_BUFFER_BIT);const Se=1/g,Ie=1/M;return{texture:ne,fbo:ke,width:g,height:M,texelSizeX:Se,texelSizeY:Ie,attach(Ge){return a.activeTexture(a.TEXTURE0+Ge),a.bindTexture(a.TEXTURE_2D,ne),Ge}}}function De(g,M,T,P,O,Q){const ne=Ee(g,M,T,P,O,Q),ke=Ee(g,M,T,P,O,Q);return{width:g,height:M,texelSizeX:ne.texelSizeX,texelSizeY:ne.texelSizeY,read:ne,write:ke,swap(){const Se=this.read;this.read=this.write,this.write=Se}}}function Fe(g,M,T,P,O,Q,ne){const ke=Ee(M,T,P,O,Q,ne);return G.bind(),G.uniforms.uTexture&&a.uniform1i(G.uniforms.uTexture,g.attach(0)),N(ke,!1),ke}function z(g,M,T,P,O,Q,ne){return g.width===M&&g.height===T||(g.read=Fe(g.read,M,T,P,O,Q,ne),g.write=Ee(M,T,P,O,Q,ne),g.width=M,g.height=T,g.texelSizeX=1/M,g.texelSizeY=1/T),g}function $(){const g=te(l.SIM_RESOLUTION),M=te(l.DYE_RESOLUTION),T=c.halfFloatTexType,P=c.formatRGBA,O=c.formatRG,Q=c.formatR,ne=c.supportLinearFiltering?a.LINEAR:a.NEAREST;a.disable(a.BLEND),V?V=z(V,M.width,M.height,P.internalFormat,P.format,T,ne):V=De(M.width,M.height,P.internalFormat,P.format,T,ne),A?A=z(A,g.width,g.height,O.internalFormat,O.format,T,ne):A=De(g.width,g.height,O.internalFormat,O.format,T,ne),J=Ee(g.width,g.height,Q.internalFormat,Q.format,T,a.NEAREST),y=Ee(g.width,g.height,Q.internalFormat,Q.format,T,a.NEAREST),R=De(g.width,g.height,Q.internalFormat,Q.format,T,a.NEAREST)}function j(){const g=[];l.SHADING&&g.push("SHADING"),be.setKeywords(g)}function te(g){const M=a.drawingBufferWidth,T=a.drawingBufferHeight,P=M/T,O=P<1?1/P:P,Q=Math.round(g),ne=Math.round(g*O);return M>T?{width:ne,height:Q}:{width:Q,height:ne}}function W(g){const M=window.devicePixelRatio||1;return Math.floor(g*M)}j(),$();let ae=Date.now(),oe=0;function me(){const g=ue();Z()&&$(),re(g),pe(),ve(g),Re(null),requestAnimationFrame(me)}function ue(){const g=Date.now();let M=(g-ae)/1e3;return M=Math.min(M,.016666),ae=g,M}function Z(){const g=W(o.clientWidth),M=W(o.clientHeight);return o.width!==g||o.height!==M?(o.width=g,o.height=M,!0):!1}function re(g){oe+=g*l.COLOR_UPDATE_SPEED,oe>=1&&(oe=ot(oe,0,1),r.forEach(M=>{M.color=He()}))}function pe(){for(const g of r)g.moved&&(g.moved=!1,X(g))}function ve(g){a.disable(a.BLEND),ie.bind(),ie.uniforms.texelSize&&a.uniform2f(ie.uniforms.texelSize,A.texelSizeX,A.texelSizeY),ie.uniforms.uVelocity&&a.uniform1i(ie.uniforms.uVelocity,A.read.attach(0)),N(y),ce.bind(),ce.uniforms.texelSize&&a.uniform2f(ce.uniforms.texelSize,A.texelSizeX,A.texelSizeY),ce.uniforms.uVelocity&&a.uniform1i(ce.uniforms.uVelocity,A.read.attach(0)),ce.uniforms.uCurl&&a.uniform1i(ce.uniforms.uCurl,y.attach(1)),ce.uniforms.curl&&a.uniform1f(ce.uniforms.curl,l.CURL),ce.uniforms.dt&&a.uniform1f(ce.uniforms.dt,g),N(A.write),A.swap(),se.bind(),se.uniforms.texelSize&&a.uniform2f(se.uniforms.texelSize,A.texelSizeX,A.texelSizeY),se.uniforms.uVelocity&&a.uniform1i(se.uniforms.uVelocity,A.read.attach(0)),N(J),le.bind(),le.uniforms.uTexture&&a.uniform1i(le.uniforms.uTexture,R.read.attach(0)),le.uniforms.value&&a.uniform1f(le.uniforms.value,l.PRESSURE),N(R.write),R.swap(),fe.bind(),fe.uniforms.texelSize&&a.uniform2f(fe.uniforms.texelSize,A.texelSizeX,A.texelSizeY),fe.uniforms.uDivergence&&a.uniform1i(fe.uniforms.uDivergence,J.attach(0));for(let T=0;T<l.PRESSURE_ITERATIONS;T++)fe.uniforms.uPressure&&a.uniform1i(fe.uniforms.uPressure,R.read.attach(1)),N(R.write),R.swap();we.bind(),we.uniforms.texelSize&&a.uniform2f(we.uniforms.texelSize,A.texelSizeX,A.texelSizeY),we.uniforms.uPressure&&a.uniform1i(we.uniforms.uPressure,R.read.attach(0)),we.uniforms.uVelocity&&a.uniform1i(we.uniforms.uVelocity,A.read.attach(1)),N(A.write),A.swap(),Y.bind(),Y.uniforms.texelSize&&a.uniform2f(Y.uniforms.texelSize,A.texelSizeX,A.texelSizeY),!c.supportLinearFiltering&&Y.uniforms.dyeTexelSize&&a.uniform2f(Y.uniforms.dyeTexelSize,A.texelSizeX,A.texelSizeY);const M=A.read.attach(0);Y.uniforms.uVelocity&&a.uniform1i(Y.uniforms.uVelocity,M),Y.uniforms.uSource&&a.uniform1i(Y.uniforms.uSource,M),Y.uniforms.dt&&a.uniform1f(Y.uniforms.dt,g),Y.uniforms.dissipation&&a.uniform1f(Y.uniforms.dissipation,l.VELOCITY_DISSIPATION),N(A.write),A.swap(),!c.supportLinearFiltering&&Y.uniforms.dyeTexelSize&&a.uniform2f(Y.uniforms.dyeTexelSize,V.texelSizeX,V.texelSizeY),Y.uniforms.uVelocity&&a.uniform1i(Y.uniforms.uVelocity,A.read.attach(0)),Y.uniforms.uSource&&a.uniform1i(Y.uniforms.uSource,V.read.attach(1)),Y.uniforms.dissipation&&a.uniform1f(Y.uniforms.dissipation,l.DENSITY_DISSIPATION),N(V.write),V.swap()}function Re(g){a.blendFunc(a.ONE,a.ONE_MINUS_SRC_ALPHA),a.enable(a.BLEND),ge(g)}function ge(g){const M=a.drawingBufferWidth,T=a.drawingBufferHeight;be.bind(),l.SHADING&&be.uniforms.texelSize&&a.uniform2f(be.uniforms.texelSize,1/M,1/T),be.uniforms.uTexture&&a.uniform1i(be.uniforms.uTexture,V.read.attach(0)),N(g,!1)}function X(g){const M=g.deltaX*l.SPLAT_FORCE,T=g.deltaY*l.SPLAT_FORCE;Te(g.texcoordX,g.texcoordY,M,T,g.color)}function _e(g){const M=He();M.r*=10,M.g*=10,M.b*=10;const T=10*(Math.random()-.5),P=30*(Math.random()-.5);Te(g.texcoordX,g.texcoordY,T,P,M)}function Te(g,M,T,P,O){q.bind(),q.uniforms.uTarget&&a.uniform1i(q.uniforms.uTarget,A.read.attach(0)),q.uniforms.aspectRatio&&a.uniform1f(q.uniforms.aspectRatio,o.width/o.height),q.uniforms.point&&a.uniform2f(q.uniforms.point,g,M),q.uniforms.color&&a.uniform3f(q.uniforms.color,T,P,0),q.uniforms.radius&&a.uniform1f(q.uniforms.radius,Pe(l.SPLAT_RADIUS/100)),N(A.write),A.swap(),q.uniforms.uTarget&&a.uniform1i(q.uniforms.uTarget,V.read.attach(0)),q.uniforms.color&&a.uniform3f(q.uniforms.color,O.r,O.g,O.b),N(V.write),V.swap()}function Pe(g){const M=o.width/o.height;return M>1&&(g*=M),g}function Ne(g,M,T,P){g.id=M,g.down=!0,g.moved=!1,g.texcoordX=T/o.width,g.texcoordY=1-P/o.height,g.prevTexcoordX=g.texcoordX,g.prevTexcoordY=g.texcoordY,g.deltaX=0,g.deltaY=0,g.color=He()}function Oe(g,M,T,P){g.prevTexcoordX=g.texcoordX,g.prevTexcoordY=g.texcoordY,g.texcoordX=M/o.width,g.texcoordY=1-T/o.height,g.deltaX=St(g.texcoordX-g.prevTexcoordX),g.deltaY=it(g.texcoordY-g.prevTexcoordY),g.moved=Math.abs(g.deltaX)>0||Math.abs(g.deltaY)>0,g.color=P}function We(g){g.down=!1}function St(g){const M=o.width/o.height;return M<1&&(g*=M),g}function it(g){const M=o.width/o.height;return M>1&&(g/=M),g}function He(){const g=ut(Math.random(),1,1);return g.r*=.15,g.g*=.15,g.b*=.15,g}function ut(g,M,T){let P=0,O=0,Q=0;const ne=Math.floor(g*6),ke=g*6-ne,Se=T*(1-M),Ie=T*(1-ke*M),Ge=T*(1-(1-ke)*M);switch(ne%6){case 0:P=T,O=Ge,Q=Se;break;case 1:P=Ie,O=T,Q=Se;break;case 2:P=Se,O=T,Q=Ge;break;case 3:P=Se,O=Ie,Q=T;break;case 4:P=Ge,O=Se,Q=T;break;case 5:P=T,O=Se,Q=Ie;break}return{r:P,g:O,b:Q}}function ot(g,M,T){const P=T-M;return(g-M)%P+M}window.addEventListener("mousedown",g=>{const M=r[0],T=W(g.clientX),P=W(g.clientY);Ne(M,-1,T,P),_e(M)});function Xe(g){const M=r[0],T=W(g.clientX),P=W(g.clientY),O=He();me(),Oe(M,T,P,O),document.body.removeEventListener("mousemove",Xe)}document.body.addEventListener("mousemove",Xe),window.addEventListener("mousemove",g=>{const M=r[0],T=W(g.clientX),P=W(g.clientY),O=M.color;Oe(M,T,P,O)});function qe(g){const M=g.targetTouches,T=r[0];for(let P=0;P<M.length;P++){const O=W(M[P].clientX),Q=W(M[P].clientY);me(),Ne(T,M[P].identifier,O,Q)}document.body.removeEventListener("touchstart",qe)}document.body.addEventListener("touchstart",qe),window.addEventListener("touchstart",g=>{const M=g.targetTouches,T=r[0];for(let P=0;P<M.length;P++){const O=W(M[P].clientX),Q=W(M[P].clientY);Ne(T,M[P].identifier,O,Q)}},!1),window.addEventListener("touchmove",g=>{const M=g.targetTouches,T=r[0];for(let P=0;P<M.length;P++){const O=W(M[P].clientX),Q=W(M[P].clientY);Oe(T,O,Q,T.color)}},!1),window.addEventListener("touchend",g=>{const M=g.changedTouches,T=r[0];for(let P=0;P<M.length;P++)We(T)}),e.watch(()=>t.simResolution,g=>{l.SIM_RESOLUTION=g,$()}),e.watch(()=>t.dyeResolution,g=>{l.DYE_RESOLUTION=g,$()}),e.watch(()=>t.shading,g=>{l.SHADING=g,j()}),me()}),(o,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("pointer-events-none fixed left-0 top-0 z-50 size-full",t.class))},[e.createElementVNode("canvas",{id:"fluid",ref_key:"canvasRef",ref:s,class:"block h-screen w-screen"},null,512)],2))}}),xi={class:"relative h-60 w-full flex flex-col items-center justify-center gap-4"},yi={class:"flex flex-row items-center justify-center gap-4"},wi={key:0,class:"opacity-50 text-4xl font-semibold"},bi=e.defineComponent({__name:"index",props:{title:{type:String,default:void 0},classList:{type:Object,default:()=>({})}},setup(n){const t=e.ref(!1);return(i,s)=>{const o=e.resolveComponent("el-switch");return e.openBlock(),e.createElementBlock("div",xi,[e.createElementVNode("div",yi,[e.createElementVNode("span",null,e.toDisplayString(n.title),1),e.createVNode(o,{modelValue:t.value,"onUpdate:modelValue":s[0]||(s[0]=r=>t.value=r)},null,8,["modelValue"])]),t.value?(e.openBlock(),e.createElementBlock("span",wi," Hover anywhere ")):e.createCommentVNode("",!0),t.value?(e.openBlock(),e.createBlock(vi,{key:1})):e.createCommentVNode("",!0)])}}});class Ct{static instance=null;constructor(){}static getInstance(){return this.instance===null&&(this.instance=new Ct),this.instance}canPost(){return typeof window<"u"&&!!window.chrome&&!!window.chrome.webview&&typeof window.chrome.webview.postMessage=="function"}post(t){if(this.canPost())return window.chrome.webview.postMessage(t),!0}send(t,i){return this.post({type:t,payload:i})}sendRaw(t){if(this.canPost())return window.chrome.webview.postMessage(t),!0}addBehaviorRecord(t,i,s,o,r,l,a,c,u,d,m,h,f,x,v){return this.send("addBehaviorRecord",{thingId:t,thingName:i,thingCategory:s,action:o,increment:r,collectionTime:l,collectEndTime:a,softwareName:c,pageName:u,pageArea:d,previousPageName:m,previousPageArea:h,position:f,pSource:x,comments:v})}addBehaviorRecordObject(t){return this.send("addBehaviorRecord",t)}doDropCargo(t){return this.send("doDropCargo",{cargoRoad:t})}printPayData(t){return this.send("printPayData",{printJsonData:t})}sendSerialCommand(t,i){return this.send("sendSerialCommand",{command:t,isHex:i})}log(t){return this.send("log",{content:t})}CloseFaceRecognition(){return this.send("CloseFaceRecognition")}sendAction(t,i){return this.send("sendAction",{v1:t,v2:i})}facedetect(){return this.send("facedetect")}}const Ci=e.defineComponent({__name:"index",props:{title:{type:String,default:void 0},class:{type:String,default:void 0},classList:{type:Object,default:()=>({})},events:{type:Object,default:()=>({emitEventName:void 0,emitPayload:void 0,postToWebview:!1})}},emits:["click"],setup(n,{emit:t}){const i=n,s=e.computed(()=>{const d=i.classList&&i.classList.Location||{};return[d.position,d.width,d.height,d.left,d.top].filter(Boolean)}),o=e.computed(()=>i.title??"Button"),r=e.ref(null),l=Vt.useRouter(),a=t,c=d=>{if(!Array.isArray(d)||d.length===0)return null;const m=d[0];if(typeof m!="string")return null;const h=m.match(/^s:navigate\?page=([^&\s]+)/);return h?{type:"navigate",page:h[1]}:{type:"custom",command:m}},u=d=>{a("click",d);const m=i.events.emitPayload,h=m?.Data;if(i.events.postToWebview===!0){try{const f=Ct.getInstance(),x=m||{PageName:"unknown",ControlName:"IButtonComp",Data:h||[]};console.log("Posting to WebView via bridge:",x),f.sendRaw(x)||console.warn("WebView bridge not available; message not sent")}catch(f){console.warn("Failed to postMessage to webview",f)}return}if(h&&Array.isArray(h)){const f=c(h);if(f?.type==="navigate"&&f.page){console.log("Navigating to page:",f.page),l.push(`/${f.page}`);return}}if(i.events.emitEventName){const f={payload:m,originalEvent:d};console.log("Dispatching custom event:",i.events.emitEventName,f),window.dispatchEvent(new CustomEvent(i.events.emitEventName,{detail:f}))}};return(d,m)=>(e.openBlock(),e.createElementBlock("button",e.mergeProps({ref_key:"buttonRef",ref:r},d.$attrs,{onClick:u,class:e.unref(K)(n.classList?.buttonClass,i.class,s.value)}),[e.createElementVNode("div",{class:e.normalizeClass(e.unref(K)(n.classList?.containerClass))},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(K)(n.classList?.dotClass))},null,2),e.createElementVNode("span",{class:e.normalizeClass(e.unref(K)(n.classList?.textClass))},e.toDisplayString(o.value),3)],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(K)(n.classList?.hoverContainerClass))},[e.createElementVNode("span",{class:e.normalizeClass(e.unref(K)(n.classList?.hoverTextClass))},e.toDisplayString(o.value),3),(e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",class:e.normalizeClass(e.unref(K)(n.classList?.iconClass))},[...m[0]||(m[0]=[e.createElementVNode("path",{d:"M5 12h14"},null,-1),e.createElementVNode("path",{d:"m12 5 7 7-7 7"},null,-1)])],2))],2)],16))}}),Ei=e.defineComponent({__name:"IconCloud",props:{class:{},images:{}},setup(n){const t=n,{images:i}=t,s=e.ref(null),o=e.ref(0),r=e.ref([]),l=e.ref([]),a=e.ref([]),c=e.reactive({x:0,y:0}),u=e.ref(!1),d=e.reactive({x:0,y:0}),m=e.reactive({x:0,y:0}),h=e.ref(null);function f(p){return 1-(1-p)**3}e.watchEffect(()=>{if(!i)return;l.value=new Array(i.length).fill(!1);const p=i.map((_,k)=>{const b=document.createElement("canvas");b.width=40,b.height=40;const I=b.getContext("2d");if(!I)return b;const U=new Image;return U.crossOrigin="anonymous",U.src=_,U.onload=()=>{I.clearRect(0,0,b.width,b.height),I.beginPath(),I.arc(20,20,20,0,Math.PI*2),I.closePath(),I.clip(),I.drawImage(U,0,0,40,40),l.value[k]=!0},b});r.value=p}),e.watchEffect(()=>{const p=i?.length||0;if(p===0){a.value=[];return}const _=[],k=2/p,b=Math.PI*(3-Math.sqrt(5));for(let I=0;I<p;I++){const U=I*k-1+k/2,H=Math.sqrt(1-U*U),E=I*b,C=Math.cos(E)*H,S=Math.sin(E)*H;_.push({x:C*100,y:U*100,z:S*100,scale:1,opacity:1,id:I})}a.value=_});function x(p){const _=s.value;if(!_)return;const k=_.getBoundingClientRect(),b=p.clientX-k.left,I=p.clientY-k.top;_.getContext("2d")&&(a.value.forEach(H=>{const E=Math.cos(c.x),C=Math.sin(c.x),S=Math.cos(c.y),D=Math.sin(c.y),B=H.x*S-H.z*D,L=H.x*D+H.z*S,N=H.y*E+L*C,V=_.width/2+B,A=_.height/2+N,y=20*((L+200)/300),R=b-V,G=I-A;if(R*R+G*G<y*y){const le=-Math.atan2(H.y,Math.sqrt(H.x*H.x+H.z*H.z)),q=Math.atan2(H.x,H.z),Y=c.x,se=c.y,ie=Math.sqrt((le-Y)**2+(q-se)**2),ce=Math.min(2e3,Math.max(800,ie*1e3));h.value={x:le,y:q,startX:Y,startY:se,distance:ie,startTime:performance.now(),duration:ce};return}}),u.value=!0,d.x=p.clientX,d.y=p.clientY)}function v(p){const _=s.value;if(!_)return;const k=_.getBoundingClientRect();if(m.x=p.clientX-k.left,m.y=p.clientY-k.top,u.value){const b=p.clientX-d.x,I=p.clientY-d.y;c.x+=I*.002,c.y+=b*.002,d.x=p.clientX,d.y=p.clientY}}function w(){u.value=!1}return e.onMounted(()=>{const p=s.value;if(!p)return;const _=p.getContext("2d");if(!_)return;function k(){if(!_||!p)return;_.clearRect(0,0,p.width,p.height);const b=p.width/2,I=p.height/2,U=m.x-b,H=m.y-I,E=Math.sqrt(b*b+I*I),S=.003+Math.sqrt(U*U+H*H)/E*.01;if(h.value){const{startX:D,startY:B,x:L,y:N,startTime:V,duration:A}=h.value,J=performance.now()-V,y=Math.min(1,J/A),R=f(y);c.x=D+(L-D)*R,c.y=B+(N-B)*R,y>=1&&(h.value=null)}else u.value||(c.x+=H/p.height*S,c.y+=U/p.width*S);a.value.forEach((D,B)=>{const L=Math.cos(c.x),N=Math.sin(c.x),V=Math.cos(c.y),A=Math.sin(c.y),J=D.x*V-D.z*A,y=D.x*A+D.z*V,R=D.y*L+y*N,G=(y+200)/300,le=Math.max(.2,Math.min(1,(y+150)/200));_.save(),_.translate(b+J,I+R),_.scale(G,G),_.globalAlpha=le,r.value[B]&&l.value[B]&&_.drawImage(r.value[B],-20,-20,40,40),_.restore()}),o.value=requestAnimationFrame(k)}o.value=requestAnimationFrame(k)}),e.onBeforeUnmount(()=>{o.value&&cancelAnimationFrame(o.value)}),(p,_)=>(e.openBlock(),e.createElementBlock("canvas",{ref_key:"canvasRef",ref:s,width:"300",height:"300",class:e.normalizeClass(e.unref(K)("rounded-lg",p.$props.class)),role:"img","aria-label":"Interactive 3D Image Cloud",onMousedown:x,onMousemove:v,onMouseup:w,onMouseleave:w},null,34))}}),ki=e.defineComponent({__name:"index",props:{slugs:{default:()=>["typescript","javascript","dart","java","react","flutter","android","html5","css3","nodedotjs","express","nextdotjs","prisma","amazonaws","postgresql","firebase","nginx","vercel","testinglibrary","jest","cypress","docker","git","jira","github","gitlab","visualstudiocode","androidstudio","sonarqube","figma"]},useColorSlugAsColor:{type:Boolean,default:!0},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>t.slugs.map(o=>o)),s=e.computed(()=>{const o=t.classList?.Location,r=[];return t.classList?.overallClass?r.push(t.classList.overallClass):r.push("grid place-content-center p-6"),o?.width&&r.push(o.width),o?.height&&r.push(o.height),o?.position&&r.push(o.position),o?.left&&r.push(o.left),o?.top&&r.push(o.top),r.join(" ")});return(o,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(s.value)},[e.createVNode(Ei,{images:i.value},null,8,["images"])],2))}}),Si=["placeholder"],_i=100,Ti=e.defineComponent({inheritAttrs:!1,__name:"index",props:{defaultValue:{},modelValue:{},placeholder:{},class:{},containerClass:{},classList:{}},emits:["update:modelValue"],setup(n,{emit:t}){const i=n,s=t,o=Ce.useVModel(i,"modelValue",s,{passive:!0,defaultValue:i.defaultValue}),r=e.ref(null),l=e.ref({x:0,y:0}),a=e.ref(!1),c=e.computed(()=>`
|
|
405
|
+
radial-gradient(
|
|
406
|
+
${a.value?_i+"px":"0px"} circle at ${l.value.x}px ${l.value.y}px,
|
|
407
|
+
rgba(59,130,246,0.45),
|
|
408
|
+
transparent 80%
|
|
409
|
+
)
|
|
410
|
+
`);function u({clientX:m,clientY:h}){if(!r.value)return;const{left:f,top:x}=r.value.getBoundingClientRect();l.value={x:m-f,y:h-x}}const d=e.computed(()=>{const m=i.classList?.Location||{};return[m.position,m.width,m.height,m.left,m.top].filter(Boolean)});return(m,h)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"inputContainerRef",ref:r,class:e.normalizeClass(e.unref(K)("group/input rounded-lg p-[2px] transition duration-300",i.containerClass||i.classList?.containerClass,d.value)),style:e.normalizeStyle({background:c.value}),onMouseenter:h[1]||(h[1]=()=>a.value=!0),onMouseleave:h[2]||(h[2]=()=>a.value=!1),onMousemove:u},[e.withDirectives(e.createElementVNode("input",e.mergeProps(m.$attrs,{"onUpdate:modelValue":h[0]||(h[0]=f=>e.isRef(o)?o.value=f:null),placeholder:n.placeholder,class:e.unref(K)(`flex h-10 w-full border-none bg-gray-50 dark:bg-zinc-800 text-black dark:text-white shadow-input rounded-md px-3 py-2 text-sm file:border-0 file:bg-transparent
|
|
411
|
+
file:text-sm file:font-medium placeholder:text-neutral-400 dark:placeholder-text-neutral-600
|
|
412
|
+
focus-visible:outline-none focus-visible:ring-[2px] focus-visible:ring-neutral-400 dark:focus-visible:ring-neutral-600
|
|
413
|
+
disabled:cursor-not-allowed disabled:opacity-50
|
|
414
|
+
dark:shadow-[0px_0px_1px_1px_var(--neutral-700)]
|
|
415
|
+
group-hover/input:shadow-none transition duration-400`,i.class||i.classList?.inputClass)}),null,16,Si),[[e.vModelDynamic,e.unref(o)]])],38))}}),mt=xe(Ti,[["__scopeId","data-v-d4c55b97"]]);/*!
|
|
416
|
+
* VelocityTracker: 3.13.0
|
|
417
|
+
* https://gsap.com
|
|
418
|
+
*
|
|
419
|
+
* Copyright 2008-2025, GreenSock. All rights reserved.
|
|
420
|
+
* Subject to the terms at https://gsap.com/standard-license
|
|
421
|
+
* @author: Jack Doyle, jack@greensock.com
|
|
422
|
+
*/var Be,ft,Je,Ht,Ye,je,pt,Gt,Yt=function(){return Be||typeof window<"u"&&(Be=window.gsap)},gt={},Mi=function(t){return Math.round(t*1e4)/1e4},vt=function(t){return Gt(t).id},Ke=function(t){return gt[vt(typeof t=="string"?Je(t)[0]:t)]},Mt=function(t){var i=Ye,s;if(t-pt>=.05)for(pt=t;i;)s=i.g(i.t,i.p),(s!==i.v1||t-i.t1>.2)&&(i.v2=i.v1,i.v1=s,i.t2=i.t1,i.t1=t),i=i._next},Bi={deg:360,rad:Math.PI*2},dt=function(){Be=Yt(),Be&&(Je=Be.utils.toArray,Ht=Be.utils.getUnit,Gt=Be.core.getCache,je=Be.ticker,ft=1)},Di=function(t,i,s,o){this.t=t,this.p=i,this.g=t._gsap.get,this.rCap=Bi[s||Ht(this.g(t,i))],this.v1=this.v2=0,this.t1=this.t2=je.time,o&&(this._next=o,o._prev=this)},st=(function(){function n(i,s){ft||dt(),this.target=Je(i)[0],gt[vt(this.target)]=this,this._props={},s&&this.add(s)}n.register=function(s){Be=s,dt()};var t=n.prototype;return t.get=function(s,o){var r=this._props[s]||console.warn("Not tracking "+s+" velocity."),l,a,c;return l=parseFloat(o?r.v1:r.g(r.t,r.p)),a=l-parseFloat(r.v2),c=r.rCap,c&&(a=a%c,a!==a%(c/2)&&(a=a<0?a+c:a-c)),Mi(a/((o?r.t1:je.time)-r.t2))},t.getAll=function(){var s={},o=this._props,r;for(r in o)s[r]=this.get(r);return s},t.isTracking=function(s){return s in this._props},t.add=function(s,o){s in this._props||(Ye||(je.add(Mt),pt=je.time),Ye=this._props[s]=new Di(this.target,s,o,Ye))},t.remove=function(s){var o=this._props[s],r,l;o&&(r=o._prev,l=o._next,r&&(r._next=l),l?l._prev=r:Ye===o&&(je.remove(Mt),Ye=0),delete this._props[s])},t.kill=function(s){for(var o in this._props)this.remove(o);s||delete gt[vt(this.target)]},n.track=function(s,o,r){ft||dt();for(var l=[],a=Je(s),c=o.split(","),u=(r||"").split(","),d=a.length,m,h;d--;){for(m=Ke(a[d])||new n(a[d]),h=c.length;h--;)m.add(c[h],u[h]||u[0]);l.push(m)}return l},n.untrack=function(s,o){var r=(o||"").split(",");Je(s).forEach(function(l){var a=Ke(l);a&&(r.length?r.forEach(function(c){return a.remove(c)}):a.kill(1))})},n.isTracking=function(s,o){var r=Ke(s);return r&&r.isTracking(o)},n.getVelocity=function(s,o){var r=Ke(s);return!r||!r.isTracking(o)?console.warn("Not tracking velocity of "+o):r.get(o)},n})();st.getByTarget=Ke;Yt()&&Be.registerPlugin(st);/*!
|
|
423
|
+
* InertiaPlugin 3.13.0
|
|
424
|
+
* https://gsap.com
|
|
425
|
+
*
|
|
426
|
+
* @license Copyright 2008-2025, GreenSock. All rights reserved.
|
|
427
|
+
* Subject to the terms at https://gsap.com/standard-license
|
|
428
|
+
* @author: Jack Doyle, jack@greensock.com
|
|
429
|
+
*/var ye,jt,Bt,Wt,xt,Qe,Xt,qt,Zt,Et,Kt,et,yt,Jt,rt=st.getByTarget,Qt=function(){return ye||typeof window<"u"&&(ye=window.gsap)&&ye.registerPlugin&&ye},Ri=function(t){return typeof t=="string"},tt=function(t){return typeof t=="number"},Ve=function(t){return typeof t=="object"},wt=function(t){return typeof t=="function"},Ii=1,es=Array.isArray,Li=function(t){return t},Ue=1e10,Dt=1/Ue,ts=.05,zi=function(t){return Math.round(t*1e4)/1e4},Ai=function(t,i,s){for(var o in i)!(o in t)&&o!==s&&(t[o]=i[o]);return t},Pi=function n(t){var i={},s,o;for(s in t)i[s]=Ve(o=t[s])&&!es(o)?n(o):o;return i},Rt=function(t,i,s,o,r){var l=i.length,a=0,c=Ue,u,d,m,h;if(Ve(t)){for(;l--;){u=i[l],d=0;for(m in t)h=u[m]-t[m],d+=h*h;d<c&&(a=l,c=d)}if((r||Ue)<Ue&&r<Math.sqrt(c))return t}else for(;l--;)u=i[l],d=u-t,d<0&&(d=-d),d<c&&u>=o&&u<=s&&(a=l,c=d);return i[a]},ss=function(t,i,s,o,r,l,a){if(t.end==="auto")return t;var c=t.end,u,d;if(s=isNaN(s)?Ue:s,o=isNaN(o)?-Ue:o,Ve(i)){if(u=i.calculated?i:(wt(c)?c(i,a):Rt(i,c,s,o,l))||i,!i.calculated){for(d in u)i[d]=u[d];i.calculated=!0}u=u[r]}else u=wt(c)?c(i,a):es(c)?Rt(i,c,s,o,l):parseFloat(c);return u>s?u=s:u<o&&(u=o),{max:u,min:u,unitFactor:t.unitFactor}},lt=function(t,i,s){return isNaN(t[i])?s:+t[i]},kt=function(t,i){return i*ts*t/Et},It=function(t,i,s){return Math.abs((i-t)*Et/s/ts)},is={resistance:1,checkpoint:1,preventOvershoot:1,linkedProps:1,radius:1,duration:1},os=function(t,i,s,o){if(i.linkedProps){var r=i.linkedProps.split(","),l={},a,c,u,d,m,h;for(a=0;a<r.length;a++)c=r[a],u=i[c],u&&(tt(u.velocity)?d=u.velocity:(m=m||rt(t),d=m&&m.isTracking(c)?m.get(c):0),h=Math.abs(d/lt(u,"resistance",o)),l[c]=parseFloat(s(t,c))+kt(d,h));return l}},Ni=function(t,i,s,o,r,l){if(s===void 0&&(s=10),o===void 0&&(o=.2),r===void 0&&(r=1),Ri(t)&&(t=Wt(t)[0]),!t)return 0;var a=0,c=Ue,u=i.inertia||i,d=Zt(t).get,m=lt(u,"resistance",Qe.resistance),h,f,x,v,w,p,_,k,b,I;I=os(t,u,d,m);for(h in u)is[h]||(f=u[h],Ve(f)||(k=k||rt(t),k&&k.isTracking(h)?f=tt(f)?{velocity:f}:{velocity:k.get(h)}:(v=+f||0,x=Math.abs(v/m))),Ve(f)&&(tt(f.velocity)?v=f.velocity:(k=k||rt(t),v=k&&k.isTracking(h)?k.get(h):0),x=Kt(o,s,Math.abs(v/lt(f,"resistance",m))),w=parseFloat(d(t,h))||0,p=w+kt(v,x),"end"in f&&(f=ss(f,I&&h in I?I:p,f.max,f.min,h,u.radius,v),et===i&&(et=u=Pi(i)),u[h]=Ai(f,u[h],"end")),"max"in f&&p>+f.max+Dt?(b=f.unitFactor||Qe.unitFactors[h]||1,_=w>f.max&&f.min!==f.max||v*b>-15&&v*b<45?o+(s-o)*.1:It(w,f.max,v),_+r<c&&(c=_+r)):"min"in f&&p<+f.min-Dt&&(b=f.unitFactor||Qe.unitFactors[h]||1,_=w<f.min&&f.min!==f.max||v*b>-45&&v*b<15?o+(s-o)*.1:It(w,f.min,v),_+r<c&&(c=_+r)),_>a&&(a=_)),x>a&&(a=x));return a>c&&(a=c),a>s?s:a<o?o:a},Lt=function(){ye=Qt(),ye&&(Bt=ye.parseEase,Wt=ye.utils.toArray,Xt=ye.utils.getUnit,Zt=ye.core.getCache,Kt=ye.utils.clamp,yt=ye.core.getStyleSaver,Jt=ye.core.reverting||function(){},xt=Bt("power3"),Et=xt(.05),qt=ye.core.PropTween,ye.config({resistance:100,unitFactors:{time:1e3,totalTime:1e3,progress:1e3,totalProgress:1e3}}),Qe=ye.config(),ye.registerPlugin(st),jt=1)},ct={version:"3.13.0",name:"inertia",register:function(t){ye=t,Lt()},init:function(t,i,s,o,r){jt||Lt();var l=rt(t);if(i==="auto"){if(!l){console.warn("No inertia tracking on "+t+". InertiaPlugin.track(target) first.");return}i=l.getAll()}this.styles=yt&&typeof t.style=="object"&&yt(t),this.target=t,this.tween=s,et=i;var a=t._gsap,c=a.get,u=i.duration,d=Ve(u),m=i.preventOvershoot||d&&u.overshoot===0,h=lt(i,"resistance",Qe.resistance),f=tt(u)?u:Ni(t,i,d&&u.max||10,d&&u.min||.2,d&&"overshoot"in u?+u.overshoot:m?0:1),x,v,w,p,_,k,b,I,U;i=et,et=0,U=os(t,i,c,h);for(x in i)is[x]||(v=i[x],wt(v)&&(v=v(o,t,r)),tt(v)?_=v:Ve(v)&&!isNaN(v.velocity)?_=+v.velocity:l&&l.isTracking(x)?_=l.get(x):console.warn("ERROR: No velocity was defined for "+t+" property: "+x),k=kt(_,f),I=0,w=c(t,x),p=Xt(w),w=parseFloat(w),Ve(v)&&(b=w+k,"end"in v&&(v=ss(v,U&&x in U?U:b,v.max,v.min,x,i.radius,_)),"max"in v&&+v.max<b?m||v.preventOvershoot?k=v.max-w:I=v.max-w-k:"min"in v&&+v.min>b&&(m||v.preventOvershoot?k=v.min-w:I=v.min-w-k)),this._props.push(x),this.styles&&this.styles.save(x),this._pt=new qt(this._pt,t,x,w,0,Li,0,a.set(t,x,this)),this._pt.u=p||0,this._pt.c1=k,this._pt.c2=I);return s.duration(f),Ii},render:function(t,i){var s=i._pt;if(t=xt(i.tween._time/i.tween._dur),t||!Jt())for(;s;)s.set(s.t,s.p,zi(s.s+s.c1*t+s.c2*t*t)+s.u,s.d,t),s=s._next;else i.styles.revert()}};"track,untrack,isTracking,getVelocity,getByTarget".split(",").forEach(function(n){return ct[n]=st[n]});Qt()&&ye.registerPlugin(ct);const Vi=`precision highp float;
|
|
430
|
+
|
|
431
|
+
uniform sampler2D map;
|
|
432
|
+
// uniform float blurAmount; // Removed: Blur amount is now fixed
|
|
433
|
+
uniform vec2 resolution;
|
|
434
|
+
uniform float uOpacity; // New uniform for controlling opacity from JS
|
|
435
|
+
|
|
436
|
+
varying vec2 vUv;
|
|
437
|
+
|
|
438
|
+
void main() {
|
|
439
|
+
vec2 onePixel = vec2(1.0, 1.0) / resolution;
|
|
440
|
+
|
|
441
|
+
// Fixed blur amount directly in the shader
|
|
442
|
+
float fixedBlurAmount = 10.0; // Changed to a fixed value as requested
|
|
443
|
+
|
|
444
|
+
vec4 sum = vec4(0.0);
|
|
445
|
+
|
|
446
|
+
sum += texture2D(map, vUv + onePixel * vec2(-1.0, -1.0) * fixedBlurAmount) * 0.0625;
|
|
447
|
+
sum += texture2D(map, vUv + onePixel * vec2( 0.0, -1.0) * fixedBlurAmount) * 0.125;
|
|
448
|
+
sum += texture2D(map, vUv + onePixel * vec2( 1.0, -1.0) * fixedBlurAmount) * 0.0625;
|
|
449
|
+
sum += texture2D(map, vUv + onePixel * vec2(-1.0, 0.0) * fixedBlurAmount) * 0.125;
|
|
450
|
+
sum += texture2D(map, vUv + onePixel * vec2( 0.0, 0.0) * fixedBlurAmount) * 0.25;
|
|
451
|
+
sum += texture2D(map, vUv + onePixel * vec2( 1.0, 0.0) * fixedBlurAmount) * 0.125;
|
|
452
|
+
sum += texture2D(map, vUv + onePixel * vec2(-1.0, 1.0) * fixedBlurAmount) * 0.0625;
|
|
453
|
+
sum += texture2D(map, vUv + onePixel * vec2( 0.0, 1.0) * fixedBlurAmount) * 0.125;
|
|
454
|
+
sum += texture2D(map, vUv + onePixel * vec2( 1.0, 1.0) * fixedBlurAmount) * 0.0625;
|
|
455
|
+
|
|
456
|
+
// Apply the opacity uniform to the alpha channel of the final color
|
|
457
|
+
gl_FragColor = vec4(sum.rgb, sum.a * uOpacity); // sum.a is usually 1.0 from texture, so multiply by uOpacity
|
|
458
|
+
}`,Fi=`
|
|
459
|
+
attribute vec2 uv;
|
|
460
|
+
attribute vec3 position;
|
|
461
|
+
|
|
462
|
+
uniform mat4 modelViewMatrix;
|
|
463
|
+
uniform mat4 projectionMatrix;
|
|
464
|
+
|
|
465
|
+
varying vec2 vUv;
|
|
466
|
+
|
|
467
|
+
void main() {
|
|
468
|
+
// Flip UV coordinates 180 degrees (both X and Y)
|
|
469
|
+
vUv = vec2(uv.x, 1.0 - uv.y);
|
|
470
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
|
|
471
|
+
}
|
|
472
|
+
`,Oi=`precision highp float;
|
|
473
|
+
|
|
474
|
+
uniform sampler2D tDiffuse;
|
|
475
|
+
uniform vec2 distortion;
|
|
476
|
+
uniform float vignetteOffset;
|
|
477
|
+
uniform float vignetteDarkness;
|
|
478
|
+
|
|
479
|
+
varying vec2 vUv;
|
|
480
|
+
|
|
481
|
+
void main() {
|
|
482
|
+
vec2 shiftedUv = 2.0 * (vUv - 0.5);
|
|
483
|
+
float distanceToCenter = length(shiftedUv);
|
|
484
|
+
|
|
485
|
+
// Lens distortion effect
|
|
486
|
+
// NOTE: The original shader had 'distortion * dot(shiftedUv)'.
|
|
487
|
+
// If distortion is a vec2, dot product will result in a scalar.
|
|
488
|
+
// If you intend distortion to scale both X and Y independently based on distance,
|
|
489
|
+
// you might need something like: shiftedUv *= (0.88 + distortion.x * abs(shiftedUv.x) + distortion.y * abs(shiftedUv.y));
|
|
490
|
+
// For now, I'll keep the dot product as it was in your provided shader,
|
|
491
|
+
// which applies uniform distortion based on radial distance.
|
|
492
|
+
shiftedUv *= (0.88 + distortion.x * dot(shiftedUv, shiftedUv)); // Assuming distortion.x controls the scalar distortion factor
|
|
493
|
+
vec2 transformedUv = shiftedUv * 0.5 + 0.5;
|
|
494
|
+
|
|
495
|
+
// Vignette effect
|
|
496
|
+
// Corrected 'vignetteOffset * 0.799' and '(vignetteDarkness + vignetteOffset)' if that was the intent.
|
|
497
|
+
// The second parameter to smoothstep is the "edge" where it starts.
|
|
498
|
+
// I'll interpret your intent as scaling the effect based on a combined factor.
|
|
499
|
+
float vignetteIntensity = smoothstep(vignetteOffset, vignetteDarkness, distanceToCenter); // Simplified as common vignette
|
|
500
|
+
// If your original intention for vignette was 'smoothstep(0.8, vignetteOffset * 0.799, (vignetteDarkness + vignetteOffset) * distanceToCenter);'
|
|
501
|
+
// this would be a more complex interaction. Let's start with a standard vignette.
|
|
502
|
+
|
|
503
|
+
// Sample render texture and output fragment
|
|
504
|
+
vec3 color = texture2D(tDiffuse, transformedUv).rgb * (1.0 - vignetteIntensity); // Apply darkening based on intensity
|
|
505
|
+
// The original '* vignetteIntensity' would brighten. Vignettes usually darken.
|
|
506
|
+
// If you want a more subtle darkening, adjust the '(1.0 - vignetteIntensity)''.
|
|
507
|
+
gl_FragColor = vec4(color, 1.);
|
|
508
|
+
}`,Ui=`
|
|
509
|
+
attribute vec2 uv;
|
|
510
|
+
attribute vec3 position;
|
|
511
|
+
|
|
512
|
+
uniform mat4 modelViewMatrix;
|
|
513
|
+
uniform mat4 projectionMatrix;
|
|
514
|
+
|
|
515
|
+
varying vec2 vUv;
|
|
516
|
+
|
|
517
|
+
void main() {
|
|
518
|
+
vUv = uv;
|
|
519
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
|
|
520
|
+
}`;class $i{gl;program;renderTarget;mesh;geometry;scene;camera;_distortionIntensity=0;_vignetteOffset=.8;_vignetteDarkness=1;constructor(t,i={}){this.gl=t,this._distortionIntensity=i.distortionIntensity??0,this._vignetteOffset=i.vignetteOffset??1.2,this._vignetteDarkness=i.vignetteDarkness??1.5,this.renderTarget=new ee.RenderTarget(t,{width:t.canvas.width,height:t.canvas.height}),this.geometry=new ee.Plane(t,{width:2,height:2}),this.program=new ee.Program(t,{vertex:Ui,fragment:Oi,uniforms:{tDiffuse:{value:null},distortion:{value:new ee.Vec2(0,0)},vignetteOffset:{value:this._vignetteOffset},vignetteDarkness:{value:this._vignetteDarkness}},transparent:!1,cullFace:!1}),this.mesh=new ee.Mesh(t,{geometry:this.geometry,program:this.program}),this.scene=new ee.Transform,this.mesh.setParent(this.scene),this.camera=new ee.Camera(t,{left:-1,right:1,bottom:-1,top:1,near:0,far:2}),this.camera.position.set(0,0,1),this.updateUniforms()}get distortionIntensity(){return this._distortionIntensity}set distortionIntensity(t){this._distortionIntensity=t,this.updateUniforms()}get vignetteOffset(){return this._vignetteOffset}set vignetteOffset(t){this._vignetteOffset=t,this.updateUniforms()}get vignetteDarkness(){return this._vignetteDarkness}set vignetteDarkness(t){this._vignetteDarkness=t,this.updateUniforms()}updateUniforms(){if(!this.program)return;const t=window.innerWidth/window.innerHeight;this.program.uniforms.distortion.value.set(this._distortionIntensity*t,this._distortionIntensity),this.program.uniforms.vignetteOffset.value=this._vignetteOffset,this.program.uniforms.vignetteDarkness.value=this._vignetteDarkness}animate(t,i,s,o=1,r=0,l="power2.out"){he.gsap.to(this,{distortionIntensity:t,vignetteOffset:i,vignetteDarkness:s,duration:o,delay:r,ease:l,onUpdate:()=>this.updateUniforms()})}setInputTexture(t){this.program&&(this.program.uniforms.tDiffuse.value=t)}render(t=null){if(!this.scene||!this.camera)return;const i=this.gl.renderer;t?i.render({scene:this.scene,camera:this.camera,target:t}):i.render({scene:this.scene,camera:this.camera})}resize(t,i){this.renderTarget&&(this.renderTarget.setSize(t,i),this.updateUniforms())}dispose(){this.renderTarget=null,this.geometry=null,this.program=null,this.mesh=null,this.scene=null,this.camera=null}}class Hi{host;isInitialized=!1;constructor(t){this.host=t,this.onPointerDown=this.onPointerDown.bind(this),this.onPointerMove=this.onPointerMove.bind(this),this.onPointerUp=this.onPointerUp.bind(this),this.onPointerOut=this.onPointerOut.bind(this),this.onWindowResize=this.onWindowResize.bind(this),this.handleMouseClick=this.handleMouseClick.bind(this),this.handleTouchEnd=this.handleTouchEnd.bind(this)}initialize(){if(this.isInitialized){console.warn("EventHandler already initialized");return}this.addEventListeners(),this.isInitialized=!0}onPointerDown(t){t.preventDefault(),this.host.currentHoveredTileKey="",this.host.isDown=!0,this.host.hasMovedSignificantly=!1,this.host.scrollPosition.x=this.host.scroll.current.x,this.host.scrollPosition.y=this.host.scroll.current.y;const i="touches"in t?t.touches[0].clientX:t.clientX,s="touches"in t?t.touches[0].clientY:t.clientY;this.host.startPosition.x=i,this.host.startPosition.y=s,this.host.updatePointerCoordinates(i,s),this.host.camera&&he.gsap.to(this.host.camera.position,{z:this.host.options.baseCameraZ*1.3,duration:.3,ease:"power2.out",overwrite:!0})}onPointerMove(t){if(!this.host.isDown){this.handleHover(t);return}const i="touches"in t?t.touches[0].clientX:t.clientX,s="touches"in t?t.touches[0].clientY:t.clientY;Math.sqrt(Math.pow(i-this.host.startPosition.x,2)+Math.pow(s-this.host.startPosition.y,2))>this.host.maxClickMovement&&(this.host.hasMovedSignificantly=!0);const r=(this.host.startPosition.x-i)*this.host.scroll.scale,l=(this.host.startPosition.y-s)*this.host.scroll.scale;he.gsap.to(this.host.scroll.current,{x:this.host.scrollPosition.x-r,y:this.host.scrollPosition.y+l,duration:.1,ease:"power1.out",overwrite:!0,onUpdate:()=>this.host.updatePositions()}),this.host.scroll.last.x=this.host.scroll.current.x,this.host.scroll.last.y=this.host.scroll.current.y}onPointerUp(t){if(this.host.isDown=!1,this.host.currentHoveredTileKey){const o=this.host.backgroundMeshMap.get(this.host.currentHoveredTileKey);o&&this.host.fadeOutBackground(o),this.host.currentHoveredTileKey=""}this.host.camera&&he.gsap.to(this.host.camera.position,{z:this.host.options.baseCameraZ,duration:.3,ease:"power2.out",overwrite:!0});const i=this.host.scrollTracker.get("x"),s=this.host.scrollTracker.get("y");this.host.animateInertiaScroll(i,s)}onPointerOut(t){if(this.host.isHoveringCanvas=!1,this.host.currentHoveredTileKey){const i=this.host.backgroundMeshMap.get(this.host.currentHoveredTileKey);i&&this.host.fadeOutBackground(i),this.host.currentHoveredTileKey=""}}onWindowResize(){const t=this.host.container.clientWidth,i=this.host.container.clientHeight;this.host.camera&&(this.host.camera.aspect=t/i,this.host.camera.perspective({aspect:t/i})),this.host.renderer&&this.host.renderer.setSize(t,i),this.host.sceneRenderTarget&&this.host.sceneRenderTarget.setSize(t,i),this.host.postProcessShader&&this.host.postProcessShader.resize(t,i)}handleHover(t){const i="touches"in t?t.touches[0].clientX:t.clientX,s="touches"in t?t.touches[0].clientY:t.clientY;this.host.updatePointerCoordinates(i,s);const o=this.host.performRaycast(),r=o.length>0?this.host.getTileKeyFromMesh(o[0]):"";if(r!==this.host.currentHoveredTileKey){if(this.host.currentHoveredTileKey){const l=this.host.backgroundMeshMap.get(this.host.currentHoveredTileKey);l&&this.host.fadeOutBackground(l)}if(r){const l=this.host.backgroundMeshMap.get(r);l&&this.host.fadeInBackground(l)}this.host.currentHoveredTileKey=r}}handleMouseClick(t){this.host.hasMovedSignificantly||(this.host.updatePointerCoordinates(t.clientX,t.clientY),this.performTileClick())}handleTouchEnd(t){if(this.onPointerUp(t),!this.host.hasMovedSignificantly&&t.changedTouches&&t.changedTouches.length>0){const i=t.changedTouches[0];this.host.updatePointerCoordinates(i.clientX,i.clientY),this.performTileClick()}}performTileClick(){const t=this.host.performRaycast();if(t.length>0){const s=t[0].userData;if(s){const o=this.host.getCardDataForTile(s.groupIndex,s.tileIndex),r={groupIndex:s.groupIndex,tileIndex:s.tileIndex,cardData:o},l=new CustomEvent("tileClicked",{detail:r,bubbles:!0,cancelable:!0});this.host.container.dispatchEvent(l),window.alert("Tile clicked: "+JSON.stringify({title:o.title,groupIndex:s.groupIndex,tileIndex:s.tileIndex}))}}}addEventListeners(){this.host.container.addEventListener("mousedown",this.onPointerDown),this.host.container.addEventListener("mousemove",this.onPointerMove),this.host.container.addEventListener("mouseup",this.onPointerUp),this.host.container.addEventListener("mouseleave",this.onPointerOut),this.host.container.addEventListener("touchstart",this.onPointerDown,{passive:!1}),this.host.container.addEventListener("touchmove",this.onPointerMove,{passive:!1}),this.host.container.addEventListener("touchend",this.handleTouchEnd,{passive:!0}),this.host.container.addEventListener("click",this.handleMouseClick),window.addEventListener("resize",this.onWindowResize)}removeEventListeners(){this.isInitialized&&(this.host.container.removeEventListener("mousedown",this.onPointerDown),this.host.container.removeEventListener("mousemove",this.onPointerMove),this.host.container.removeEventListener("mouseup",this.onPointerUp),this.host.container.removeEventListener("mouseleave",this.onPointerOut),this.host.container.removeEventListener("touchstart",this.onPointerDown),this.host.container.removeEventListener("touchmove",this.onPointerMove),this.host.container.removeEventListener("touchend",this.handleTouchEnd),this.host.container.removeEventListener("click",this.handleMouseClick),window.removeEventListener("resize",this.onWindowResize),this.isInitialized=!1)}get initialized(){return this.isInitialized}}class Gi{host;constructor(t){this.host=t}dispose(){this.stopAnimationLoop(),this.cleanupEventListeners(),this.cleanupGridManager(),this.disposeSceneObjects(),this.disposePostProcessing(),this.disposeRenderer(),this.clearDataStructures(),this.cleanupAnimationSystems()}stopAnimationLoop(){this.host.animationFrameId&&(cancelAnimationFrame(this.host.animationFrameId),this.host.animationFrameId=null)}cleanupEventListeners(){this.host.eventHandler&&this.host.eventHandler.removeEventListeners()}cleanupGridManager(){this.host.gridManager&&this.host.gridManager.clear()}disposeSceneObjects(){this.host.groupObjects.forEach(t=>{this.disposeTransformAndChildren(t)}),this.disposeTransformAndChildren(this.host.scene),this.host.foregroundMeshMap.forEach(t=>{this.disposeMesh(t)}),this.host.backgroundMeshMap.forEach(t=>{this.disposeMesh(t)})}disposeTransformAndChildren(t){t&&(t.traverse(i=>{i instanceof ee.Mesh&&this.disposeMesh(i)}),t.parent=null,t.children=[])}disposeMesh(t){t&&(t.geometry=null,t.program&&(t.program=null),t.userData=null,t.parent=null)}disposePostProcessing(){this.host.postProcessShader&&(this.host.postProcessShader.dispose(),this.host.postProcessShader=null),this.host.sceneRenderTarget&&(this.host.sceneRenderTarget=null)}disposeRenderer(){if(this.host.renderer){const t=this.host.renderer.gl.canvas;t.parentNode===this.host.container&&this.host.container.removeChild(t),this.host.renderer=null}this.host.camera=null}clearDataStructures(){this.host.cardTextures.forEach(t=>{t.foreground=null,t.background=null}),this.host.groupObjects=[],this.host.foregroundMeshMap.clear(),this.host.backgroundMeshMap.clear(),this.host.staticUniforms.clear(),this.host.cardTextures=[],this.host.tileGroupsData=[],this.host.raycast=null,this.host.pointer=null}cleanupAnimationSystems(){this.host.scrollTracker&&(this.host.scrollTracker.kill(),this.host.scrollTracker=null)}partialCleanup(){this.stopAnimationLoop(),this.host.cardTextures.forEach(t=>{t.foreground=null,t.background=null}),this.host.cardTextures=[],this.host.foregroundMeshMap.clear(),this.host.backgroundMeshMap.clear(),this.host.staticUniforms.clear()}validateDisposal(){const t=[];return this.host.animationFrameId!==null&&t.push("Animation frame still active"),this.host.renderer!==null&&t.push("Renderer not disposed"),this.host.camera!==null&&t.push("Camera not disposed"),this.host.postProcessShader!==null&&t.push("Post-process shader not disposed"),this.host.groupObjects.length>0&&t.push("Group objects not cleared"),this.host.foregroundMeshMap.size>0&&t.push("Foreground mesh map not cleared"),this.host.backgroundMeshMap.size>0&&t.push("Background mesh map not cleared"),this.host.cardTextures.length>0&&t.push("Card textures not cleared"),this.host.scrollTracker!==null&&t.push("Scroll tracker not disposed"),t.length>0?(console.warn("Disposal validation failed:",t),!1):!0}}const ze=512,Ae=512,Le=30;function ns(){const n=document.createElement("canvas");n.width=ze,n.height=Ae;const t=n.getContext("2d");if(!t)throw new Error("Failed to get 2D context for canvas");return{canvas:n,ctx:t}}const ht=new Map;async function Yi(n,t){const i=`${n.title}-${n.tags?.join("-")}`;if(ht.has(i))return ht.get(i);const{canvas:s,ctx:o}=ns();o.fillStyle="white",o.strokeStyle="rgba(60, 60, 60, 1)",o.lineWidth=1,o.beginPath(),o.rect(0,0,ze,Ae),o.stroke();let r=Le;o.font="24px Arial, sans-serif",o.fillStyle="white",o.textBaseline="top";const l=n.title,a=ze-Le*2;let c=l,u=o.measureText(c);for(;u.width>a&&c.length>3;)c=c.substring(0,c.length-4)+"...",u=o.measureText(c);o.fillText(c,Le,r),r+=24+30;const m=r,f=Ae-m-100,x=ze-Le*2,v=new Image;v.crossOrigin="anonymous",v.src=n.image||"/photo.png",await new Promise(E=>{v.onload=()=>{let C=v.naturalWidth,S=v.naturalHeight;const D=C/S;(C>x||S>f)&&(x/D<=f?(C=x,S=x/D):(S=f,C=f*D));const B=Le+(x-C)/2,L=m+(f-S)/2;o.drawImage(v,B,L,C,S),E()},v.onerror=()=>{console.error("Failed to load foreground image:",v.src),o.fillStyle="gray",o.font="30px Arial",o.textAlign="center",o.textBaseline="middle",o.fillText("Image Error",ze/2,Ae/2-50),E()}});let p=Le;const _=16,k=15,b=8,I=10,U=Ae-Le-_-b;n.tags.forEach(E=>{o.font=`${_}px Helvetica, Arial, sans-serif`,o.textBaseline="middle";const C=`#${E.toUpperCase()}`,B=o.measureText(C).width+k,L=_+b;o.fillStyle="rgba(248,250, 252, 0.15)",Wi(o,p,U,B,L,L/2),o.fill(),o.fillStyle="white",o.textAlign="center",o.fillText(C,p+B/2,U+L/2),p+=B+I}),o.font="20px Arial, sans-serif",o.fillStyle="rgba(255, 255, 255, 1)",o.textAlign="right",o.textBaseline="bottom",o.fillText(n.date,ze-Le,Ae-Le);const H=new ee.Texture(t.gl,{image:s,generateMipmaps:!1,flipY:!1});return ht.set(i,H),H}async function ji(n,t){const{canvas:i,ctx:s}=ns(),o=new Image;return o.crossOrigin="Anonymous",o.src=n.image||"/photo.png",await new Promise(a=>{o.onload=()=>{const u=o.naturalWidth*2,d=o.naturalHeight*2;s.drawImage(o,(ze-u)/2,(Ae-d)/2,u,d),s.filter="blur(10px)",s.drawImage(i,0,0),s.filter="none",s.fillStyle="rgba(0,0,0,0.4)",s.fillRect(0,0,ze,Ae),a()},o.onerror=()=>{console.warn("Failed to load background image:",o.src),s.fillStyle="rgba(0,0,0,0.5)",s.fillRect(0,0,ze,Ae),a()}}),new ee.Texture(t.gl,{image:i,generateMipmaps:!1,flipY:!1})}function Wi(n,t,i,s,o,r){n.beginPath(),n.moveTo(t+r,i),n.lineTo(t+s-r,i),n.quadraticCurveTo(t+s,i,t+s,i+r),n.lineTo(t+s,i+o-r),n.quadraticCurveTo(t+s,i+o,t+s-r,i+o),n.lineTo(t+r,i+o),n.quadraticCurveTo(t,i+o,t,i+o-r),n.lineTo(t,i+r),n.quadraticCurveTo(t,i,t+r,i),n.closePath()}class Xi{host;isInitialized=!1;constructor(t){this.host=t}async initialize(){if(this.isInitialized){console.warn("GridManager already initialized");return}this.initializeTileGroups(),await this.generateTexturesForCardData(),this.createTiles(),this.isInitialized=!0}initializeTileGroups(){this.host.tileGroupsData=[];for(let t=-1;t<=1;t++)for(let i=-1;i<=1;i++)this.host.tileGroupsData.push({basePos:new ee.Vec3(this.host.GRID_WIDTH*i,this.host.GRID_HEIGHT*t,0),offset:{x:0,y:0}})}createTiles(){if(!this.host.renderer)throw new Error("Renderer not available for tile creation");const t=this.host.renderer.gl;this.host.tileGroupsData.forEach((i,s)=>{const o=new ee.Transform;o.position.set(i.basePos.x,i.basePos.y,i.basePos.z),o.setParent(this.host.scene),this.host.groupObjects[s]=o;const r=-((this.host.GRID_COLS-1)/2)*this.host.TILE_SPACE,l=(this.host.GRID_ROWS-1)/2*this.host.TILE_SPACE;for(let a=0;a<this.host.GRID_ROWS;a++)for(let c=0;c<this.host.GRID_COLS;c++){const u=r+c*this.host.TILE_SPACE,d=l-a*this.host.TILE_SPACE,m=a*this.host.GRID_COLS+c,h=this.getTileKey(s,m);this.createBackgroundMesh(t,o,s,m,h,u,d),this.createForegroundMesh(t,o,s,m,h,u,d)}})}createBackgroundMesh(t,i,s,o,r,l,a){const c=this.createBackgroundProgram(s,o),u=new ee.Plane(t,{width:this.host.TILE_SIZE,height:this.host.TILE_SIZE}),d=new ee.Mesh(t,{geometry:u,program:c});d.position.set(l,a,-.01),d.setParent(i),this.host.backgroundMeshMap.set(r,d)}createForegroundMesh(t,i,s,o,r,l,a){const c=this.createForegroundProgram(s,o),u=new ee.Plane(t,{width:this.host.TILE_SIZE,height:this.host.TILE_SIZE}),d=new ee.Mesh(t,{geometry:u,program:c});d.position.set(l,a,0),d.setParent(i),d.userData={groupIndex:s,tileIndex:o,tileKey:r},this.host.foregroundMeshMap.set(r,d)}getTileKey(t,i){return`${t}-${i}`}getCardTextureIndex(t,i){const s=this.host.GRID_COLS*this.host.GRID_ROWS;return(t*s+i)%this.host.cardData.length}getCardForegroundTexture(t,i){if(this.host.cardTextures.length===0)return null;const s=this.getCardTextureIndex(t,i);return this.host.cardTextures[s]?.foreground||null}getCardBackgroundTexture(t,i){if(this.host.cardTextures.length===0)return null;const s=this.getCardTextureIndex(t,i);return this.host.cardTextures[s]?.background||null}createBackgroundProgram(t,i){if(!this.host.renderer)throw new Error("Renderer not initialized");const s=this.host.renderer.gl,a={map:{value:this.getCardBackgroundTexture(t,i)},resolution:{value:[512,512]},uOpacity:{value:this.host.initialBackgroundOpacity}};return this.host.staticUniforms.set(this.getTileKey(t,i),a),new ee.Program(s,{vertex:Fi,fragment:Vi,uniforms:a,transparent:!0,cullFace:!1})}createForegroundProgram(t,i){if(!this.host.renderer)throw new Error("Renderer not initialized");const s=this.host.renderer.gl,o=this.getCardForegroundTexture(t,i);return new ee.Program(s,{vertex:`
|
|
521
|
+
attribute vec2 uv;
|
|
522
|
+
attribute vec3 position;
|
|
523
|
+
|
|
524
|
+
uniform mat4 modelViewMatrix;
|
|
525
|
+
uniform mat4 projectionMatrix;
|
|
526
|
+
|
|
527
|
+
varying vec2 vUv;
|
|
528
|
+
|
|
529
|
+
void main() {
|
|
530
|
+
// Flip UV coordinates 180 degrees (both X and Y)
|
|
531
|
+
vUv = vec2(uv.x, 1.0 - uv.y);
|
|
532
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
|
|
533
|
+
}
|
|
534
|
+
`,fragment:`
|
|
535
|
+
precision highp float;
|
|
536
|
+
|
|
537
|
+
uniform sampler2D map;
|
|
538
|
+
|
|
539
|
+
varying vec2 vUv;
|
|
540
|
+
|
|
541
|
+
void main() {
|
|
542
|
+
gl_FragColor = texture2D(map, vUv);
|
|
543
|
+
}
|
|
544
|
+
`,uniforms:{map:{value:o}},transparent:!0,cullFace:!1})}async generateTexturesForCardData(){if(!this.host.renderer)throw new Error("Renderer not initialized");if(this.host.cardData.length===0){this.host.cardTextures=[];return}const t=this.host.cardData.map(async i=>{const s=await Yi(i,this.host.renderer),o=await ji(i,this.host.renderer);return{foreground:s,background:o}});this.host.cardTextures=await Promise.all(t)}getTileKeyFromMesh(t){return t.userData?.tileKey||""}getCardDataForTile(t,i){const s=this.getCardTextureIndex(t,i);return this.host.cardData[s]||{title:"Default Card",badge:"",description:"No data available",tags:[],date:new Date().getFullYear().toString()}}async updateCardData(t){this.host.cardData=t,await this.generateTexturesForCardData(),this.updateTileTextures()}updateTileTextures(){this.host.tileGroupsData.forEach((t,i)=>{for(let s=0;s<this.host.GRID_ROWS;s++)for(let o=0;o<this.host.GRID_COLS;o++){const r=s*this.host.GRID_COLS+o,l=this.getTileKey(i,r),a=this.host.foregroundMeshMap.get(l);if(a&&a.program){const u=this.getCardForegroundTexture(i,r);u&&(a.program.uniforms.map.value=u)}const c=this.host.backgroundMeshMap.get(l);if(c&&c.program){const u=this.getCardBackgroundTexture(i,r);u&&(c.program.uniforms.map.value=u)}}})}getInteractiveMeshes(){return Array.from(this.host.foregroundMeshMap.values())}clear(){this.host.tileGroupsData=[],this.host.groupObjects.forEach(t=>{t&&t.parent&&t.parent.removeChild(t)}),this.host.groupObjects=[],this.host.foregroundMeshMap.clear(),this.host.backgroundMeshMap.clear(),this.host.staticUniforms.clear(),this.host.cardTextures=[],this.isInitialized=!1}get initialized(){return this.isInitialized}getGridStats(){const t=this.host.GRID_COLS*this.host.GRID_ROWS,i=this.host.tileGroupsData.length*t,s=this.host.cardTextures.length*2,o=512*512*4,l=(s*o/(1024*1024)).toFixed(2);return{totalGroups:this.host.tileGroupsData.length,tilesPerGroup:t,totalTiles:i,totalTextures:s,memoryEstimate:`${l} MB`}}}he.gsap.registerPlugin(ct);class zt{container;cardData;options;GRID_GAP;TILE_SIZE;TILE_SPACE;GRID_COLS;GRID_ROWS;GRID_WIDTH;GRID_HEIGHT;TOTAL_GRID_WIDTH;TOTAL_GRID_HEIGHT;scene;camera;renderer;pointer;raycast;postProcessShader;sceneRenderTarget;groupObjects;foregroundMeshMap;backgroundMeshMap;cardTextures;staticUniforms;currentHoveredTileKey;isDown;isHoveringCanvas;hasMovedSignificantly;startPosition;scrollPosition;scroll;direction;scrollTracker;hoverTransitionDuration;hoverEase;initialBackgroundOpacity;hoveredBackgroundOpacity;maxClickMovement;animationFrameId;tileGroupsData;eventHandler;gridManager;disposalManager;constructor(t,i=[],s={}){if(!t)throw console.error("InfiniteGridClass: Container element is required."),new Error("Container element is required");this.container=t,this.cardData=i,this.options={gridCols:3,gridRows:3,gridGap:0,tileSize:3,baseCameraZ:10,enablePostProcessing:!0,postProcessParams:{distortionIntensity:0,vignetteOffset:1.2,vignetteDarkness:1.5,...s.postProcessParams},...s},this.GRID_GAP=this.options.gridGap,this.TILE_SIZE=this.options.tileSize,this.TILE_SPACE=this.TILE_SIZE+this.GRID_GAP,this.GRID_COLS=this.options.gridCols,this.GRID_ROWS=this.options.gridRows,this.GRID_WIDTH=this.TILE_SPACE*this.GRID_COLS,this.GRID_HEIGHT=this.TILE_SPACE*this.GRID_ROWS,this.TOTAL_GRID_WIDTH=this.GRID_WIDTH*3,this.TOTAL_GRID_HEIGHT=this.GRID_HEIGHT*3,this.scene=new ee.Transform,this.camera=null,this.renderer=null,this.pointer=new ee.Vec2,this.raycast=new ee.Raycast,this.postProcessShader=null,this.sceneRenderTarget=null,this.groupObjects=[],this.foregroundMeshMap=new Map,this.backgroundMeshMap=new Map,this.cardTextures=[],this.staticUniforms=new Map,this.currentHoveredTileKey="",this.isDown=!1,this.isHoveringCanvas=!1,this.hasMovedSignificantly=!1,this.startPosition={x:0,y:0},this.scrollPosition={x:0,y:0},this.scroll={scale:.012,current:{x:0,y:0},last:{x:0,y:0}},this.direction={x:0,y:0},this.scrollTracker=ct.track(this.scroll.current,"x,y")[0],this.hoverTransitionDuration=.6,this.hoverEase="power2.out",this.initialBackgroundOpacity=0,this.hoveredBackgroundOpacity=1,this.maxClickMovement=5,this.animationFrameId=null,this.tileGroupsData=[],this.eventHandler=new Hi(this),this.gridManager=new Xi(this),this.disposalManager=new Gi(this),this.render=this.render.bind(this)}async init(){this.setupRenderer(),this.setupCamera(),this.setupPostProcessing(),await this.gridManager.initialize(),this.eventHandler&&this.eventHandler.initialize(),this.animateInertiaScroll(),this.animatePostProcessing(-.1,.3,1.25,1.5,1.5,"power3.out"),this.updatePositions(),this.render()}setupRenderer(){const t=this.container.ownerDocument.createElement("canvas").getContext("webgl2")||this.container.ownerDocument.createElement("canvas").getContext("webgl");if(!t)throw new Error("WebGL not supported");this.renderer=new ee.Renderer({canvas:t.canvas,width:this.container.clientWidth,height:this.container.clientHeight,dpr:window.devicePixelRatio,alpha:!0,antialias:!0}),this.renderer.gl.canvas.style.width="100%",this.renderer.gl.canvas.style.height="100%",this.container.appendChild(this.renderer.gl.canvas)}setupCamera(){const t=this.container.clientWidth/this.container.clientHeight;this.camera=new ee.Camera(this.renderer.gl,{fov:45,aspect:t,near:1,far:1e3}),this.camera.position.set(0,0,this.options.baseCameraZ)}setupPostProcessing(){!this.options.enablePostProcessing||!this.renderer||(this.sceneRenderTarget=new ee.RenderTarget(this.renderer.gl,{width:this.container.clientWidth,height:this.container.clientHeight}),this.postProcessShader=new $i(this.renderer.gl,this.options.postProcessParams))}get viewport(){if(!this.camera)return{width:0,height:0};const t=this.camera.fov*(Math.PI/180),i=2*Math.tan(t/2)*this.camera.position.z;return{width:i*this.camera.aspect,height:i}}updatePositions(){const t=this.scroll.current.x,i=this.scroll.current.y;this.scroll.current.y>this.scroll.last.y?this.direction.y=-1:this.scroll.current.y<this.scroll.last.y?this.direction.y=1:this.direction.y=0,this.scroll.current.x>this.scroll.last.x?this.direction.x=-1:this.scroll.current.x<this.scroll.last.x?this.direction.x=1:this.direction.x=0,this.tileGroupsData.forEach((s,o)=>{const r=this.groupObjects[o];if(r){const l=s.basePos.x+t+s.offset.x,a=s.basePos.y+i+s.offset.y,c=this.GRID_WIDTH/2,u=this.GRID_HEIGHT/2,d={x:this.viewport.width/2,y:this.viewport.height/2};this.direction.x<0&&l-c>d.x?s.offset.x-=this.TOTAL_GRID_WIDTH:this.direction.x>0&&l+c<-d.x&&(s.offset.x+=this.TOTAL_GRID_WIDTH),this.direction.y<0&&a-u>d.y?s.offset.y-=this.TOTAL_GRID_HEIGHT:this.direction.y>0&&a+u<-d.y&&(s.offset.y+=this.TOTAL_GRID_HEIGHT),r.position.x=s.basePos.x+t+s.offset.x,r.position.y=s.basePos.y+i+s.offset.y,r.position.z=s.basePos.z}})}animateInertiaScroll(t="auto",i="auto"){he.gsap.to(this.scroll.current,{inertia:{x:t,y:i,min:60,resistance:100},ease:"power2.out",onUpdate:()=>this.updatePositions(),onComplete:()=>{this.direction.x=0,this.direction.y=0}})}getInteractiveMeshes(){return this.gridManager.getInteractiveMeshes()}updatePointerCoordinates(t,i){if(!this.renderer)return;const s=this.renderer.gl.canvas.getBoundingClientRect(),o=(t-s.left)/s.width*2-1,r=-((i-s.top)/s.height*2-1);this.pointer.set(o,r)}performRaycast(){if(!this.camera||!this.renderer)return[];this.raycast.castMouse(this.camera,this.pointer);const t=this.getInteractiveMeshes();return this.raycast.intersectBounds(t)}getTileKeyFromMesh(t){return this.gridManager.getTileKeyFromMesh(t)}fadeInBackground(t){t.program&&t.program.uniforms.uOpacity&&he.gsap.to(t.program.uniforms.uOpacity,{value:this.hoveredBackgroundOpacity,duration:this.hoverTransitionDuration,ease:this.hoverEase,overwrite:!0})}fadeOutBackground(t){t.program&&t.program.uniforms.uOpacity&&he.gsap.to(t.program.uniforms.uOpacity,{value:this.initialBackgroundOpacity,duration:this.hoverTransitionDuration,ease:this.hoverEase,overwrite:!0})}getCardDataForTile(t,i){return this.gridManager.getCardDataForTile(t,i)}render(){this.scroll.last.x=this.scroll.current.x,this.scroll.last.y=this.scroll.current.y,this.updatePositions(),this.renderer&&this.camera&&(this.options.enablePostProcessing&&this.postProcessShader&&this.sceneRenderTarget?(this.renderer.render({scene:this.scene,camera:this.camera,target:this.sceneRenderTarget}),this.sceneRenderTarget.texture||console.error("PostProcessing: Render target has no texture"),this.postProcessShader.setInputTexture(this.sceneRenderTarget.texture),this.postProcessShader.render(null)):this.renderer.render({scene:this.scene,camera:this.camera})),this.animationFrameId=requestAnimationFrame(this.render)}animatePostProcessing(t,i,s,o=1,r=0,l="power2.out"){this.postProcessShader&&this.postProcessShader.animate(t,i,s,o,r,l)}setPostProcessingEnabled(t){this.options.enablePostProcessing=t}get distortionIntensity(){return this.postProcessShader?.distortionIntensity??0}set distortionIntensity(t){this.postProcessShader&&(this.postProcessShader.distortionIntensity=t)}get vignetteOffset(){return this.postProcessShader?.vignetteOffset??.8}set vignetteOffset(t){this.postProcessShader&&(this.postProcessShader.vignetteOffset=t)}get vignetteDarkness(){return this.postProcessShader?.vignetteDarkness??1}set vignetteDarkness(t){this.postProcessShader&&(this.postProcessShader.vignetteDarkness=t)}dispose(){this.disposalManager.dispose()}getEventHandler(){return this.eventHandler}getGridManager(){return this.gridManager}getDisposalManager(){return this.disposalManager}async updateCardData(t){this.cardData=t,await this.gridManager.updateCardData(t)}getGridStats(){return this.gridManager.getGridStats()}validateDisposal(){return this.disposalManager.validateDisposal()}partialCleanup(){this.disposalManager.partialCleanup()}}const qi=e.defineComponent({__name:"InfiniteGrid",props:{cardData:{},options:{default:()=>({})},onTilesLoaded:{}},emits:["tileClicked"],setup(n,{emit:t}){const i=n,s=t,o={gridCols:4,gridRows:4,gridGap:0,tileSize:3,baseCameraZ:10,enablePostProcessing:!0,postProcessParams:{distortionIntensity:-.2,vignetteOffset:0,vignetteDarkness:0}},r=e.computed(()=>({...o,...i.options,postProcessParams:{...o.postProcessParams,...i.options?.postProcessParams}})),l=e.ref(null);let a=null;function c(u){s("tileClicked",u.detail)}return e.onMounted(async()=>{l.value&&(a=new zt(l.value,i.cardData,r.value),await a.init(),i.onTilesLoaded?.(),l.value.addEventListener("tileClicked",c))}),e.onBeforeUnmount(()=>{a&&(l.value&&l.value.removeEventListener("tileClicked",c),a.dispose(),a=null)}),e.watch(()=>[i.cardData,r.value],async([u,d])=>{a&&(a.dispose(),a=null),l.value&&(a=new zt(l.value,u,d),await a.init(),l.value.addEventListener("tileClicked",c))},{deep:!0}),(u,d)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"infiniteGridContainer",ref:l,class:"infinite-grid-container"},null,512))}}),Zi=xe(qi,[["__scopeId","data-v-c30aeea7"]]),Ki=e.defineComponent({__name:"index",props:{cardData:{default:()=>[{title:"Visionary Insights",badge:"New",image:"https://picsum.photos/1366/768",description:"Next-gen AI system delivering business intelligence in real-time",tags:["AI","Big Data","BI"],date:"2025"},{title:"UI Framework",badge:"Updated",image:"https://picsum.photos/1366/768",description:"Robust design framework featuring sleek and responsive components",tags:["UI","React","Toolkit"],date:"2025"},{title:"NextGen App",badge:"Beta",image:"https://picsum.photos/1366/768",description:"Progressive mobile-first app optimized for speed and usability",tags:["Mobile","Flutter","UX"],date:"2025"}]},loadingText:{default:"Loading Tiles"},buttonText:{default:"View Fullscreen"},classList:{default:()=>({})}},setup(n){const t=e.useTemplateRef("el"),{toggle:i}=Ce.useFullscreen(t),s=e.ref(!1);function o(){s.value=!0}return(r,l)=>{const a=e.resolveComponent("InteractiveHoverButton"),c=e.resolveComponent("ClientOnly");return e.openBlock(),e.createBlock(c,null,{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.overallClass||"flex flex-col h-[28rem] w-full items-center justify-center relative")},[e.createElementVNode("div",{ref_key:"el",ref:t,class:e.normalizeClass(n.classList?.gridClass||"absolute inset-0 z-50 flex flex-col justify-center items-center")},[e.createVNode(Zi,{"card-data":n.cardData,onTilesLoaded:o},null,8,["card-data"])],2),s.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(n.classList?.loadingClass||"text-lg font-semibold z-[51]")},e.toDisplayString(n.loadingText||"Loading Tiles"),3)),s.value?(e.openBlock(),e.createBlock(a,{key:1,text:n.buttonText||"View Fullscreen",class:e.normalizeClass(n.classList?.buttonClass||"absolute bottom-0 z-[52]"),onClick:e.unref(i)},null,8,["text","class","onClick"])):e.createCommentVNode("",!0)],2)]),_:1})}}}),Ji={class:"relative w-full h-full"},Qi=`#version 300 es
|
|
545
|
+
|
|
546
|
+
uniform mat4 uWorldMatrix;
|
|
547
|
+
uniform mat4 uViewMatrix;
|
|
548
|
+
uniform mat4 uProjectionMatrix;
|
|
549
|
+
uniform vec3 uCameraPosition;
|
|
550
|
+
uniform vec4 uRotationAxisVelocity;
|
|
551
|
+
|
|
552
|
+
in vec3 aModelPosition;
|
|
553
|
+
in vec3 aModelNormal;
|
|
554
|
+
in vec2 aModelUvs;
|
|
555
|
+
in mat4 aInstanceMatrix;
|
|
556
|
+
|
|
557
|
+
out vec2 vUvs;
|
|
558
|
+
out float vAlpha;
|
|
559
|
+
flat out int vInstanceId;
|
|
560
|
+
|
|
561
|
+
#define PI 3.141593
|
|
562
|
+
|
|
563
|
+
void main() {
|
|
564
|
+
vec4 worldPosition = uWorldMatrix * aInstanceMatrix * vec4(aModelPosition, 1.);
|
|
565
|
+
|
|
566
|
+
vec3 centerPos = (uWorldMatrix * aInstanceMatrix * vec4(0., 0., 0., 1.)).xyz;
|
|
567
|
+
float radius = length(centerPos.xyz);
|
|
568
|
+
|
|
569
|
+
if (gl_VertexID > 0) {
|
|
570
|
+
vec3 rotationAxis = uRotationAxisVelocity.xyz;
|
|
571
|
+
float rotationVelocity = min(.15, uRotationAxisVelocity.w * 15.);
|
|
572
|
+
vec3 stretchDir = normalize(cross(centerPos, rotationAxis));
|
|
573
|
+
vec3 relativeVertexPos = normalize(worldPosition.xyz - centerPos);
|
|
574
|
+
float strength = dot(stretchDir, relativeVertexPos);
|
|
575
|
+
float invAbsStrength = min(0., abs(strength) - 1.);
|
|
576
|
+
strength = rotationVelocity * sign(strength) * abs(invAbsStrength * invAbsStrength * invAbsStrength + 1.);
|
|
577
|
+
worldPosition.xyz += stretchDir * strength;
|
|
578
|
+
}
|
|
579
|
+
|
|
580
|
+
worldPosition.xyz = radius * normalize(worldPosition.xyz);
|
|
581
|
+
|
|
582
|
+
gl_Position = uProjectionMatrix * uViewMatrix * worldPosition;
|
|
583
|
+
|
|
584
|
+
vAlpha = smoothstep(0.5, 1., normalize(worldPosition.xyz).z) * .9 + .1;
|
|
585
|
+
vUvs = aModelUvs;
|
|
586
|
+
vInstanceId = gl_InstanceID;
|
|
587
|
+
}
|
|
588
|
+
`,eo=`#version 300 es
|
|
589
|
+
precision highp float;
|
|
590
|
+
|
|
591
|
+
uniform sampler2D uTex;
|
|
592
|
+
uniform int uItemCount;
|
|
593
|
+
uniform int uAtlasSize;
|
|
594
|
+
|
|
595
|
+
out vec4 outColor;
|
|
596
|
+
|
|
597
|
+
in vec2 vUvs;
|
|
598
|
+
in float vAlpha;
|
|
599
|
+
flat in int vInstanceId;
|
|
600
|
+
|
|
601
|
+
void main() {
|
|
602
|
+
int itemIndex = vInstanceId % uItemCount;
|
|
603
|
+
int cellsPerRow = uAtlasSize;
|
|
604
|
+
int cellX = itemIndex % cellsPerRow;
|
|
605
|
+
int cellY = itemIndex / cellsPerRow;
|
|
606
|
+
vec2 cellSize = vec2(1.0) / vec2(float(cellsPerRow));
|
|
607
|
+
vec2 cellOffset = vec2(float(cellX), float(cellY)) * cellSize;
|
|
608
|
+
|
|
609
|
+
ivec2 texSize = textureSize(uTex, 0);
|
|
610
|
+
float imageAspect = float(texSize.x) / float(texSize.y);
|
|
611
|
+
float containerAspect = 1.0;
|
|
612
|
+
|
|
613
|
+
float scale = max(imageAspect / containerAspect,
|
|
614
|
+
containerAspect / imageAspect);
|
|
615
|
+
|
|
616
|
+
vec2 st = vec2(vUvs.x, 1.0 - vUvs.y);
|
|
617
|
+
st = (st - 0.5) * scale + 0.5;
|
|
618
|
+
|
|
619
|
+
st = clamp(st, 0.0, 1.0);
|
|
620
|
+
|
|
621
|
+
st = st * cellSize + cellOffset;
|
|
622
|
+
|
|
623
|
+
outColor = texture(uTex, st);
|
|
624
|
+
outColor.a *= vAlpha;
|
|
625
|
+
}
|
|
626
|
+
`,to=e.defineComponent({__name:"InfiniteMenu",props:{items:{}},setup(n){const t=[{image:"https://picsum.photos/900/900?grayscale",link:"https://google.com/",title:"",description:""}],i=n,s=e.ref(),o=e.ref(null),r=e.ref(!1),l=e.computed(()=>i.items?.length?i.items:t);let a=null,c=null;class u{constructor(C,S,D){this.a=C,this.b=S,this.c=D}}class d{position;normal;uv;constructor(C,S,D){this.position=F.vec3.fromValues(C,S,D),this.normal=F.vec3.create(),this.uv=F.vec2.create()}}class m{vertices=[];faces=[];addVertex(...C){for(let S=0;S<C.length;S+=3)this.vertices.push(new d(C[S],C[S+1],C[S+2]));return this}addFace(...C){for(let S=0;S<C.length;S+=3)this.faces.push(new u(C[S],C[S+1],C[S+2]));return this}get lastVertex(){return this.vertices[this.vertices.length-1]}subdivide(C=1){const S={};let D=this.faces;for(let B=0;B<C;++B){const L=new Array(D.length*4);D.forEach((N,V)=>{const A=this.getMidPoint(N.a,N.b,S),J=this.getMidPoint(N.b,N.c,S),y=this.getMidPoint(N.c,N.a,S),R=V*4;L[R+0]=new u(N.a,A,y),L[R+1]=new u(N.b,J,A),L[R+2]=new u(N.c,y,J),L[R+3]=new u(A,J,y)}),D=L}return this.faces=D,this}spherize(C=1){return this.vertices.forEach(S=>{F.vec3.normalize(S.normal,S.position),F.vec3.scale(S.position,S.normal,C)}),this}get data(){return{vertices:this.vertexData,indices:this.indexData,normals:this.normalData,uvs:this.uvData}}get vertexData(){return new Float32Array(this.vertices.flatMap(C=>Array.from(C.position)))}get normalData(){return new Float32Array(this.vertices.flatMap(C=>Array.from(C.normal)))}get uvData(){return new Float32Array(this.vertices.flatMap(C=>Array.from(C.uv)))}get indexData(){return new Uint16Array(this.faces.flatMap(C=>[C.a,C.b,C.c]))}getMidPoint(C,S,D){const B=C<S?`k_${S}_${C}`:`k_${C}_${S}`;if(Object.prototype.hasOwnProperty.call(D,B))return D[B];const L=this.vertices[C].position,N=this.vertices[S].position,V=this.vertices.length;return D[B]=V,this.addVertex((L[0]+N[0])*.5,(L[1]+N[1])*.5,(L[2]+N[2])*.5),V}}class h extends m{constructor(){super();const C=Math.sqrt(5)*.5+.5;this.addVertex(-1,C,0,1,C,0,-1,-C,0,1,-C,0,0,-1,C,0,1,C,0,-1,-C,0,1,-C,C,0,-1,C,0,1,-C,0,-1,-C,0,1).addFace(0,11,5,0,5,1,0,1,7,0,7,10,0,10,11,1,5,9,5,11,4,11,10,2,10,7,6,7,1,8,3,9,4,3,4,2,3,2,6,3,6,8,3,8,9,4,9,5,2,4,11,6,2,10,8,6,7,9,8,1)}}class f extends m{constructor(C=4,S=1){super(),C=Math.max(4,C);const D=2*Math.PI/C;this.addVertex(0,0,0),this.lastVertex.uv[0]=.5,this.lastVertex.uv[1]=.5;for(let B=0;B<C;++B){const L=Math.cos(D*B),N=Math.sin(D*B);this.addVertex(S*L,S*N,0),this.lastVertex.uv[0]=L*.5+.5,this.lastVertex.uv[1]=N*.5+.5,B>0&&this.addFace(0,B,B+1)}this.addFace(0,C,1)}}function x(E,C,S){const D=E.createShader(C);return D?(E.shaderSource(D,S),E.compileShader(D),E.getShaderParameter(D,E.COMPILE_STATUS)?D:(console.error(E.getShaderInfoLog(D)),E.deleteShader(D),null)):null}function v(E,C,S,D){const B=E.createProgram();if(!B)return null;if([E.VERTEX_SHADER,E.FRAGMENT_SHADER].forEach((N,V)=>{const A=x(E,N,C[V]);A&&E.attachShader(B,A)}),D)for(const N in D)E.bindAttribLocation(B,D[N],N);return E.linkProgram(B),E.getProgramParameter(B,E.LINK_STATUS)?B:(console.error(E.getProgramInfoLog(B)),E.deleteProgram(B),null)}function w(E,C,S){const D=E.createVertexArray();if(!D)return null;E.bindVertexArray(D);for(const[B,L,N]of C)L!==-1&&(E.bindBuffer(E.ARRAY_BUFFER,B),E.enableVertexAttribArray(L),E.vertexAttribPointer(L,N,E.FLOAT,!1,0,0));if(S){const B=E.createBuffer();B&&(E.bindBuffer(E.ELEMENT_ARRAY_BUFFER,B),E.bufferData(E.ELEMENT_ARRAY_BUFFER,S,E.STATIC_DRAW))}return E.bindVertexArray(null),D}function p(E){const C=Math.min(2,window.devicePixelRatio||1),S=Math.round(E.clientWidth*C),D=Math.round(E.clientHeight*C),B=E.width!==S||E.height!==D;return B&&(E.width=S,E.height=D),B}function _(E,C,S){const D=E.createBuffer();return D?(E.bindBuffer(E.ARRAY_BUFFER,D),E.bufferData(E.ARRAY_BUFFER,C,S),E.bindBuffer(E.ARRAY_BUFFER,null),D):null}function k(E,C,S,D,B){const L=E.createTexture();return L?(E.bindTexture(E.TEXTURE_2D,L),E.texParameteri(E.TEXTURE_2D,E.TEXTURE_WRAP_S,D),E.texParameteri(E.TEXTURE_2D,E.TEXTURE_WRAP_T,B),E.texParameteri(E.TEXTURE_2D,E.TEXTURE_MIN_FILTER,C),E.texParameteri(E.TEXTURE_2D,E.TEXTURE_MAG_FILTER,S),L):null}class b{constructor(C,S){this.canvas=C,this.updateCallback=S,this.setupEventListeners()}isPointerDown=!1;orientation=F.quat.create();pointerRotation=F.quat.create();rotationVelocity=0;rotationAxis=F.vec3.fromValues(1,0,0);snapDirection=F.vec3.fromValues(0,0,-1);snapTargetDirection;EPSILON=.1;IDENTITY_QUAT=F.quat.create();pointerPos=F.vec2.create();previousPointerPos=F.vec2.create();_rotationVelocity=0;_combinedQuat=F.quat.create();setupEventListeners(){this.canvas.addEventListener("pointerdown",C=>{F.vec2.set(this.pointerPos,C.clientX,C.clientY),F.vec2.copy(this.previousPointerPos,this.pointerPos),this.isPointerDown=!0}),this.canvas.addEventListener("pointerup",()=>{this.isPointerDown=!1}),this.canvas.addEventListener("pointerleave",()=>{this.isPointerDown=!1}),this.canvas.addEventListener("pointermove",C=>{this.isPointerDown&&F.vec2.set(this.pointerPos,C.clientX,C.clientY)}),this.canvas.style.touchAction="none"}update(C,S=16){const D=C/S+1e-5;let B=D;const L=F.quat.create();if(this.isPointerDown){const G=.3*D,le=5/D,q=F.vec2.sub(F.vec2.create(),this.pointerPos,this.previousPointerPos);if(F.vec2.scale(q,q,G),F.vec2.sqrLen(q)>this.EPSILON){F.vec2.add(q,this.previousPointerPos,q);const Y=this.project(q),se=this.project(this.previousPointerPos),ie=F.vec3.normalize(F.vec3.create(),Y),ce=F.vec3.normalize(F.vec3.create(),se);F.vec2.copy(this.previousPointerPos,q),B*=le,this.quatFromVectors(ie,ce,this.pointerRotation,B)}else F.quat.slerp(this.pointerRotation,this.pointerRotation,this.IDENTITY_QUAT,G)}else{const G=.1*D;if(F.quat.slerp(this.pointerRotation,this.pointerRotation,this.IDENTITY_QUAT,G),this.snapTargetDirection){const q=this.snapTargetDirection,Y=this.snapDirection,se=F.vec3.squaredDistance(q,Y),ie=Math.max(.1,1-se*10);B*=.2*ie,this.quatFromVectors(q,Y,L,B)}}const N=F.quat.multiply(F.quat.create(),L,this.pointerRotation);this.orientation=F.quat.multiply(F.quat.create(),N,this.orientation),F.quat.normalize(this.orientation,this.orientation);const V=.8*D;F.quat.slerp(this._combinedQuat,this._combinedQuat,N,V),F.quat.normalize(this._combinedQuat,this._combinedQuat);const A=Math.acos(this._combinedQuat[3])*2,J=Math.sin(A/2);let y=0;J>1e-6&&(y=A/(2*Math.PI),this.rotationAxis[0]=this._combinedQuat[0]/J,this.rotationAxis[1]=this._combinedQuat[1]/J,this.rotationAxis[2]=this._combinedQuat[2]/J);const R=.5*D;this._rotationVelocity+=(y-this._rotationVelocity)*R,this.rotationVelocity=this._rotationVelocity/D,this.updateCallback?.(C)}quatFromVectors(C,S,D,B=1){const L=F.vec3.cross(F.vec3.create(),C,S);F.vec3.normalize(L,L);const N=Math.max(-1,Math.min(1,F.vec3.dot(C,S))),V=Math.acos(N)*B;return F.quat.setAxisAngle(D,L,V),{q:D,axis:L,angle:V}}project(C){const D=this.canvas.clientWidth,B=this.canvas.clientHeight,L=Math.max(D,B)-1,N=(2*C[0]-D-1)/L,V=(2*C[1]-B-1)/L;let A=0;const J=N*N+V*V,y=4;return J<=y/2?A=Math.sqrt(y-J):A=y/Math.sqrt(J),F.vec3.fromValues(-N,V,A)}}class I{constructor(C,S,D,B,L){this.canvas=C,this.items=S,this.onActiveItemChange=D,this.onMovementChange=B,this.onInit=L,this.init()}TARGET_FRAME_DURATION=1e3/60;SPHERE_RADIUS=2;time=0;deltaTime=0;deltaFrames=0;frames=0;camera={matrix:F.mat4.create(),near:.1,far:40,fov:Math.PI/4,aspect:1,position:F.vec3.fromValues(0,0,3),up:F.vec3.fromValues(0,1,0),matrices:{view:F.mat4.create(),projection:F.mat4.create(),inversProjection:F.mat4.create()}};nearestVertexIndex=null;smoothRotationVelocity=0;scaleFactor=1;movementActive=!1;discProgram=null;discLocations={};discGeo;discBuffers={};discVAO=null;icoGeo;instancePositions=[];DISC_INSTANCE_COUNT=0;discInstances={matricesArray:new Float32Array(0),matrices:[],buffer:null};worldMatrix=F.mat4.create();tex=null;atlasSize=0;control;viewportSize;init(){if(this.gl=this.canvas.getContext("webgl2",{antialias:!0,alpha:!1}),!this.gl)throw new Error("No WebGL 2 context!");if(this.viewportSize=F.vec2.fromValues(this.canvas.clientWidth,this.canvas.clientHeight),this.discProgram=v(this.gl,[Qi,eo],void 0,{aModelPosition:0,aModelNormal:1,aModelUvs:2,aInstanceMatrix:3}),!this.discProgram)throw new Error("Failed to create shader program");this.discLocations={aModelPosition:this.gl.getAttribLocation(this.discProgram,"aModelPosition"),aModelUvs:this.gl.getAttribLocation(this.discProgram,"aModelUvs"),aInstanceMatrix:this.gl.getAttribLocation(this.discProgram,"aInstanceMatrix"),uWorldMatrix:this.gl.getUniformLocation(this.discProgram,"uWorldMatrix"),uViewMatrix:this.gl.getUniformLocation(this.discProgram,"uViewMatrix"),uProjectionMatrix:this.gl.getUniformLocation(this.discProgram,"uProjectionMatrix"),uCameraPosition:this.gl.getUniformLocation(this.discProgram,"uCameraPosition"),uRotationAxisVelocity:this.gl.getUniformLocation(this.discProgram,"uRotationAxisVelocity"),uTex:this.gl.getUniformLocation(this.discProgram,"uTex"),uItemCount:this.gl.getUniformLocation(this.discProgram,"uItemCount"),uAtlasSize:this.gl.getUniformLocation(this.discProgram,"uAtlasSize"),uFrames:this.gl.getUniformLocation(this.discProgram,"uFrames"),uScaleFactor:this.gl.getUniformLocation(this.discProgram,"uScaleFactor")},this.discGeo=new f(56,1),this.discBuffers=this.discGeo.data,this.discVAO=w(this.gl,[[_(this.gl,this.discBuffers.vertices,this.gl.STATIC_DRAW),this.discLocations.aModelPosition,3],[_(this.gl,this.discBuffers.uvs,this.gl.STATIC_DRAW),this.discLocations.aModelUvs,2]],this.discBuffers.indices),this.icoGeo=new h,this.icoGeo.subdivide(1).spherize(this.SPHERE_RADIUS),this.instancePositions=this.icoGeo.vertices.map(C=>C.position),this.DISC_INSTANCE_COUNT=this.icoGeo.vertices.length,this.initDiscInstances(this.DISC_INSTANCE_COUNT),this.initTexture(),this.control=new b(this.canvas,C=>this.onControlUpdate(C)),this.updateCameraMatrix(),this.updateProjectionMatrix(),this.resize(),this.onInit?.(this)}initTexture(){if(!this.gl||(this.tex=k(this.gl,this.gl.LINEAR,this.gl.LINEAR,this.gl.CLAMP_TO_EDGE,this.gl.CLAMP_TO_EDGE),!this.tex))return;const C=Math.max(1,this.items.length);this.atlasSize=Math.ceil(Math.sqrt(C));const S=document.createElement("canvas"),D=S.getContext("2d");if(!D)return;const B=512;S.width=this.atlasSize*B,S.height=this.atlasSize*B,Promise.all(this.items.map(L=>new Promise(N=>{const V=new Image;V.crossOrigin="anonymous",V.onload=()=>N(V),V.onerror=()=>N(V),V.src=L.image}))).then(L=>{L.forEach((N,V)=>{const A=V%this.atlasSize*B,J=Math.floor(V/this.atlasSize)*B;try{D.drawImage(N,A,J,B,B)}catch{}}),this.gl&&this.tex&&(this.gl.bindTexture(this.gl.TEXTURE_2D,this.tex),this.gl.texImage2D(this.gl.TEXTURE_2D,0,this.gl.RGBA,this.gl.RGBA,this.gl.UNSIGNED_BYTE,S),this.gl.generateMipmap(this.gl.TEXTURE_2D))})}initDiscInstances(C){if(!this.gl)return;this.discInstances={matricesArray:new Float32Array(C*16),matrices:[],buffer:this.gl.createBuffer()};for(let B=0;B<C;++B){const L=new Float32Array(this.discInstances.matricesArray.buffer,B*16*4,16);L.set(F.mat4.create()),this.discInstances.matrices.push(L)}this.gl.bindVertexArray(this.discVAO),this.gl.bindBuffer(this.gl.ARRAY_BUFFER,this.discInstances.buffer),this.gl.bufferData(this.gl.ARRAY_BUFFER,this.discInstances.matricesArray.byteLength,this.gl.DYNAMIC_DRAW);const S=4,D=64;for(let B=0;B<S;++B){const L=this.discLocations.aInstanceMatrix+B;this.gl.enableVertexAttribArray(L),this.gl.vertexAttribPointer(L,4,this.gl.FLOAT,!1,D,B*4*4),this.gl.vertexAttribDivisor(L,1)}this.gl.bindBuffer(this.gl.ARRAY_BUFFER,null),this.gl.bindVertexArray(null)}run(C=0){this.deltaTime=Math.min(32,C-this.time),this.time=C,this.deltaFrames=this.deltaTime/this.TARGET_FRAME_DURATION,this.frames+=this.deltaFrames,this.animate(),this.render(),a=requestAnimationFrame(S=>this.run(S))}resize(){if(this.viewportSize=F.vec2.set(this.viewportSize||F.vec2.create(),this.canvas.clientWidth,this.canvas.clientHeight),!this.gl)return;p(this.canvas)&&this.gl.viewport(0,0,this.gl.drawingBufferWidth,this.gl.drawingBufferHeight),this.updateProjectionMatrix()}animate(){if(!this.gl)return;this.control.update(this.deltaTime,this.TARGET_FRAME_DURATION);const C=this.instancePositions.map(B=>F.vec3.transformQuat(F.vec3.create(),B,this.control.orientation)),S=.25,D=.6;C.forEach((B,L)=>{const V=(Math.abs(B[2])/this.SPHERE_RADIUS*D+(1-D))*S,A=F.mat4.create();F.mat4.multiply(A,A,F.mat4.fromTranslation(F.mat4.create(),F.vec3.negate(F.vec3.create(),B))),F.mat4.multiply(A,A,F.mat4.targetTo(F.mat4.create(),[0,0,0],B,[0,1,0])),F.mat4.multiply(A,A,F.mat4.fromScaling(F.mat4.create(),[V,V,V])),F.mat4.multiply(A,A,F.mat4.fromTranslation(F.mat4.create(),[0,0,-this.SPHERE_RADIUS])),F.mat4.copy(this.discInstances.matrices[L],A)}),this.gl.bindBuffer(this.gl.ARRAY_BUFFER,this.discInstances.buffer),this.gl.bufferSubData(this.gl.ARRAY_BUFFER,0,this.discInstances.matricesArray),this.gl.bindBuffer(this.gl.ARRAY_BUFFER,null),this.smoothRotationVelocity=this.control.rotationVelocity}render(){if(!this.gl)return;this.gl.useProgram(this.discProgram),this.gl.enable(this.gl.CULL_FACE),this.gl.enable(this.gl.DEPTH_TEST),this.gl.enable(this.gl.BLEND),this.gl.blendFunc(this.gl.SRC_ALPHA,this.gl.ONE_MINUS_SRC_ALPHA),this.gl.clearColor(0,0,0,0),this.gl.clear(this.gl.COLOR_BUFFER_BIT|this.gl.DEPTH_BUFFER_BIT),this.gl.uniformMatrix4fv(this.discLocations.uWorldMatrix,!1,this.worldMatrix),this.gl.uniformMatrix4fv(this.discLocations.uViewMatrix,!1,this.camera.matrices.view),this.gl.uniformMatrix4fv(this.discLocations.uProjectionMatrix,!1,this.camera.matrices.projection),this.gl.uniform3f(this.discLocations.uCameraPosition,this.camera.position[0],this.camera.position[1],this.camera.position[2]),this.gl.uniform4f(this.discLocations.uRotationAxisVelocity,this.control.rotationAxis[0],this.control.rotationAxis[1],this.control.rotationAxis[2],this.smoothRotationVelocity*1.1);const C=this.discLocations.uItemCount;C!==null&&this.gl.uniform1i(C,this.items.length);const S=this.discLocations.uAtlasSize;S!==null&&this.gl.uniform1i(S,this.atlasSize);const D=this.discLocations.uFrames;D!==null&&this.gl.uniform1f(D,this.frames);const B=this.discLocations.uScaleFactor;B!==null&&this.gl.uniform1f(B,this.scaleFactor);const L=this.discLocations.uTex;L!==null&&this.gl.uniform1i(L,0),this.gl.activeTexture(this.gl.TEXTURE0),this.gl.bindTexture(this.gl.TEXTURE_2D,this.tex),this.gl.bindVertexArray(this.discVAO),this.gl.drawElementsInstanced(this.gl.TRIANGLES,this.discBuffers.indices.length,this.gl.UNSIGNED_SHORT,0,this.DISC_INSTANCE_COUNT)}updateCameraMatrix(){F.mat4.targetTo(this.camera.matrix,this.camera.position,[0,0,0],this.camera.up),F.mat4.invert(this.camera.matrices.view,this.camera.matrix)}updateProjectionMatrix(){if(!this.gl)return;this.camera.aspect=this.gl.canvas.width/this.gl.canvas.height;const C=this.SPHERE_RADIUS*.35,S=this.camera.position[2];this.camera.aspect>1?this.camera.fov=2*Math.atan(C/S):this.camera.fov=2*Math.atan(C/this.camera.aspect/S),F.mat4.perspective(this.camera.matrices.projection,this.camera.fov,this.camera.aspect,this.camera.near,this.camera.far),F.mat4.invert(this.camera.matrices.inversProjection,this.camera.matrices.projection)}onControlUpdate(C){const S=C/this.TARGET_FRAME_DURATION+1e-4;let D=5/S,B=3;const L=this.control.isPointerDown||Math.abs(this.smoothRotationVelocity)>.01;if(L!==this.movementActive&&(this.movementActive=L,this.onMovementChange(L)),this.control.isPointerDown)B+=this.control.rotationVelocity*80+2.5,D=7/S;else{const N=this.findNearestVertexIndex(),V=N%Math.max(1,this.items.length);this.onActiveItemChange(V);const A=F.vec3.normalize(F.vec3.create(),this.getVertexWorldPosition(N));this.control.snapTargetDirection=A}this.camera.position[2]+=(B-this.camera.position[2])/D,this.updateCameraMatrix()}findNearestVertexIndex(){const C=this.control.snapDirection,S=F.quat.conjugate(F.quat.create(),this.control.orientation),D=F.vec3.transformQuat(F.vec3.create(),C,S);let B=-1,L=0;for(let N=0;N<this.instancePositions.length;++N){const V=F.vec3.dot(D,this.instancePositions[N]);V>B&&(B=V,L=N)}return L}getVertexWorldPosition(C){const S=this.instancePositions[C];return F.vec3.transformQuat(F.vec3.create(),S,this.control.orientation)}destroy(){a&&(cancelAnimationFrame(a),a=null)}gl=null}const U=E=>{const C=l.value;if(!C.length)return;const S=E%C.length;o.value=C[S]},H=()=>{o.value?.link&&(o.value.link.startsWith("http")?window.open(o.value.link,"_blank"):console.log("Internal route:",o.value.link))};return e.onMounted(()=>{if(s.value)try{c=new I(s.value,l.value,U,C=>{r.value=C},C=>C.run());const E=()=>{c?.resize()};window.addEventListener("resize",E),E(),e.onBeforeUnmount(()=>{window.removeEventListener("resize",E),c?.destroy()})}catch(E){console.error("Failed to initialize InfiniteMenu:",E)}}),e.watch(()=>i.items,()=>{c&&s.value&&(c.destroy(),c=new I(s.value,l.value,U,E=>{r.value=E},E=>E.run()))},{deep:!0}),(E,C)=>(e.openBlock(),e.createElementBlock("div",Ji,[e.createElementVNode("canvas",{ref_key:"canvasRef",ref:s,class:"w-full h-full cursor-grab active:cursor-grabbing outline-none overflow-hidden"},null,512),o.value?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("h2",{class:e.normalizeClass(["select-none absolute font-black text-6xl top-1/2 text-white transition-all duration-500 ease-in-out hidden xl:block",r.value?"pointer-events-none opacity-0 transition-all duration-100 ease-in-out":"opacity-100 pointer-events-auto"]),style:{left:"1.6em",transform:"translate(20%, -50%)"}},e.toDisplayString(o.value.title),3),e.createElementVNode("p",{class:e.normalizeClass(["select-none absolute top-1/2 text-2xl text-white/80 transition-all ease-in-out hidden xl:block",r.value?"pointer-events-none opacity-0 duration-100":"opacity-100 pointer-events-auto duration-500"]),style:e.normalizeStyle({right:"1%",maxWidth:"10ch",transform:r.value?"translate(-60%, -50%)":"translate(-90%, -50%)"})},e.toDisplayString(o.value.description),7),e.createElementVNode("div",{onClick:H,class:e.normalizeClass(["absolute left-1/2 z-10 grid place-items-center bg-purple-600 rounded-full cursor-pointer border-4 border-black transition-all ease-in-out",r.value?"pointer-events-none opacity-0 duration-100":"opacity-100 pointer-events-auto duration-500"]),style:e.normalizeStyle({width:"60px",height:"60px",bottom:r.value?"-80px":"61px",transform:r.value?"translateX(-50%) scale(0)":"translateX(-50%) scale(1)"})},[...C[0]||(C[0]=[e.createElementVNode("p",{class:"select-none relative text-white text-2xl",style:{top:"2px"}},"โ",-1)])],6)],64)):e.createCommentVNode("",!0)]))}}),so=e.defineComponent({__name:"index",props:{items:{default:()=>[{image:"https://images.unsplash.com/photo-1517180102446-f3ece451e9d8?w=800&h=800&fit=crop",title:"Sarah Chen",description:"UI/UX Designer",link:"https://dribbble.com/"},{image:"https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=800&h=800&fit=crop",title:"Mike Johnson",description:"Frontend Developer",link:"https://github.com/"},{image:"https://images.unsplash.com/photo-1494790108755-2616b612b793?w=800&h=800&fit=crop",title:"Emma Wilson",description:"Product Designer",link:"https://behance.net/"}]},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass,i.value])},[e.createVNode(to,{items:n.items},null,8,["items"])],2))}}),io=()=>{const n=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(J){setTimeout(J,10)};let t,i,s,o,r,l,a,c,u,d,m,h,f,x,v,w,p,_,k,b,I,U,H,E,C,S,D,B,L,N=0,V=0;class A{constructor(y){let R={};y&&(y.nodeName?(R=JSON.parse(JSON.stringify(y.dataset)),y.nodeName==="IMG"?R.image=y:R.wrapperElement=y):R=y),this.state="stopped",this.touches=[],this.on("imageLoaded",this._onImageLoaded),this._initImage(R)}on(y,R){this.events=this.events||{},this.events[y]=this.events[y]||[],this.events[y].push(R)}emit(y,R){const G=this.events[y];if(G&&G.length)for(let le=0;le<G.length;le++)G[le].call(this,R)}get renderer(){return this._renderer}set renderer(y){this._renderer=y,this._draw=this["_"+y+"Renderer"];try{this["_"+y+"InitContext"]()}catch(R){console.log(R),y!=="default"&&(this.renderer="default")}}set color(y){this.colorArr=this._parseColor(y),this.colorArr&&(isNaN(this.colorArr[3])&&(this.colorArr[3]=255),0<this.colorArr[3]&&this.colorArr[3]<=1&&(this.colorArr[3]*=255))}start(y){const R=y||{};this.initPosition=R.initPosition||this.initPosition,this.initDirection=R.initDirection||this.initDirection,this.canvas&&(this.canvas.width=this.width,this.canvas.height=this.height,this.canvas.style.display=""),this._initOrigins(),this._initParticles(),this._webglSetAttributes(),this.state!=="running"&&(this.state="running",this.disableInteraction||("ontouchstart"in window||window.navigator.msPointerEnabled?(document.body.addEventListener("touchstart",this._touchHandler),document.body.addEventListener("touchmove",this._touchHandler),document.body.addEventListener("touchend",this._clearTouches),document.body.addEventListener("touchcancel",this._clearTouches)):(this.canvas.addEventListener("mousemove",this._mouseHandler),this.canvas.addEventListener("mouseout",this._clearTouches),this.canvas.addEventListener("click",this._clickHandler))),this._animate())}stop(y){const R=y||{};this.fadePosition=R.fadePosition||this.fadePosition,this.fadeDirection=R.fadeDirection||this.fadeDirection,this._fade(),document.body.removeEventListener("touchstart",this._touchHandler),document.body.removeEventListener("touchmove",this._touchHandler),document.body.removeEventListener("touchend",this._clearTouches),document.body.removeEventListener("touchcancel",this._clearTouches),this.canvas&&(this.canvas.removeEventListener("mousemove",this._mouseHandler),this.canvas.removeEventListener("mouseout",this._clearTouches),this.canvas.removeEventListener("click",this._clickHandler))}_animate(){this.state!=="stopped"?(this._calculate(),this._draw(),n(()=>this._animate())):this.emit("stopped")}get _mouseHandler(){return y=>{this.touches=[{x:y.offsetX,y:y.offsetY,z:49+(this.layerCount-1)*this.layerDistance,force:1}]}}get _clickHandler(){return y=>{const R=this.clickStrength;this.origins.map(G=>G.z-=R),setTimeout(()=>{this.origins.map(G=>G.z+=R)},100)}}get _touchHandler(){return y=>{for(this.touches=[],d=this.canvas.getBoundingClientRect(),u=0;u<y.changedTouches.length;u++)c=y.changedTouches[u],c.target===this.canvas&&(this.touches.push({x:c.pageX-d.left,y:c.pageY-d.top,z:49+(this.layerCount-1)*this.layerDistance,force:c.force||1}),y.preventDefault())}}get _clearTouches(){return y=>{this.touches=[]}}_onImageLoaded(y){this.imageWidth=this.image.naturalWidth||this.image.width,this.imageHeight=this.image.naturalHeight||this.image.height,this.imageRatio=this.imageWidth/this.imageHeight,this.width=this.width||this.imageWidth,this.height=this.height||this.imageHeight,this.renderSize=(this.width+this.height)/4,this.srcImage&&(this.srcImage.style.display="none"),this._initSettings(y),this._initContext(y),this._initResponsive(y),this.start()}_initImage(y){this.srcImage=y.image,!this.srcImage&&y.imageId&&(this.srcImage=document.getElementById(y.imageId)),this.imageUrl=y.imageUrl||this.srcImage.src,this.image=document.createElement("img"),this.wrapperElement=y.wrapperElement||this.srcImage.parentElement,this.image.onload=()=>this.emit("imageLoaded",y),this.image.crossOrigin="Anonymous",y.addTimestamp&&(/\?/.test(this.imageUrl)?this.imageUrl+="&d="+Date.now():this.imageUrl+="?d="+Date.now()),this.image.src=this.imageUrl}_initContext(y){this.canvas=y.canvas,!this.canvas&&!this.context&&this.wrapperElement&&(this.canvas=document.createElement("canvas"),this.wrapperElement.appendChild(this.canvas)),this.convas&&(this.convas.style.display="none"),this.context=y.context,this.renderer=y.renderer||"default"}_defaultInitContext(y){this.context=this.context||this.canvas.getContext("2d")}_webglInitContext(){this.context=this.context||this.canvas.getContext("webgl2")||this.canvas.getContext("experimental-webgl"),this.fragmentShaderScript=`#version 300 es
|
|
627
|
+
|
|
628
|
+
precision highp float;
|
|
629
|
+
|
|
630
|
+
in vec4 vColor;
|
|
631
|
+
out vec4 fragColor;
|
|
632
|
+
|
|
633
|
+
void main(void) {
|
|
634
|
+
// fragColor = vec4(1, 1, 1, 0.1);
|
|
635
|
+
fragColor = vColor;
|
|
636
|
+
}
|
|
637
|
+
`,this.vertexShaderScript=`#version 300 es
|
|
638
|
+
|
|
639
|
+
precision highp float;
|
|
640
|
+
|
|
641
|
+
in vec3 vertexPosition;
|
|
642
|
+
in vec4 vertexColor;
|
|
643
|
+
uniform vec3 vertexOffset;
|
|
644
|
+
uniform float pointSize;
|
|
645
|
+
uniform float depth;
|
|
646
|
+
vec3 mirror = vec3(1, -1, 1);
|
|
647
|
+
|
|
648
|
+
uniform mat4 modelViewMatrix;
|
|
649
|
+
uniform mat4 perspectiveMatrix;
|
|
650
|
+
uniform mat4 rotationMatrix;
|
|
651
|
+
|
|
652
|
+
out vec4 vColor;
|
|
653
|
+
|
|
654
|
+
void main(void) {
|
|
655
|
+
gl_Position = rotationMatrix * perspectiveMatrix * modelViewMatrix * vec4(mirror * vertexPosition + vertexOffset, vertexPosition);
|
|
656
|
+
gl_PointSize = pointSize + max((log(vertexPosition.z) - 3.91) * depth, -pointSize + 1.0);
|
|
657
|
+
vColor = vertexColor;
|
|
658
|
+
}
|
|
659
|
+
`,this.context.viewport(0,0,this.width,this.height);const y=this.context.createShader(this.context.VERTEX_SHADER);this.context.shaderSource(y,this.vertexShaderScript),this.context.compileShader(y),this.context.getShaderParameter(y,this.context.COMPILE_STATUS)||console.log(this.context.getShaderInfoLog(y));const R=this.context.createShader(this.context.FRAGMENT_SHADER);this.context.shaderSource(R,this.fragmentShaderScript),this.context.compileShader(R),this.context.getShaderParameter(R,this.context.COMPILE_STATUS)||console.log(this.context.getShaderInfoLog(R)),this.program=this.context.createProgram(),this.context.attachShader(this.program,y),this.context.attachShader(this.program,R),this.context.linkProgram(this.program),this.context.useProgram(this.program),this.vertexPosition=this.context.getAttribLocation(this.program,"vertexPosition"),this.context.enableVertexAttribArray(this.vertexPosition),this.vertexColor=this.context.getAttribLocation(this.program,"vertexColor"),this.context.enableVertexAttribArray(this.vertexColor),this.context.clearColor(0,0,0,0),this.context.enable(this.context.BLEND),this.context.disable(this.context.DEPTH_TEST),this.context.blendFunc(this.context.SRC_ALPHA,this.context.ONE),this.vertexBuffer=this.context.createBuffer(),this.context.bindBuffer(this.context.ARRAY_BUFFER,this.vertexBuffer),this.context.clear(this.context.COLOR_BUFFER_BIT|this.context.DEPTH_BUFFER_BIT),this.vertexOffset=this.context.getUniformLocation(this.program,"vertexOffset"),this.context.uniform3f(this.vertexOffset,0,0,1e3),this.context.vertexAttribPointer(this.vertexPosition,3,this.context.FLOAT,!1,28,0),this.context.vertexAttribPointer(this.vertexColor,4,this.context.FLOAT,!1,28,12),this.uModelViewMatrix=this.context.getUniformLocation(this.program,"modelViewMatrix"),this.uPerspectiveMatrix=this.context.getUniformLocation(this.program,"perspectiveMatrix"),this.uRotationMatrix=this.context.getUniformLocation(this.program,"rotationMatrix"),this.uPointSize=this.context.getUniformLocation(this.program,"pointSize"),this.uDepth=this.context.getUniformLocation(this.program,"depth"),this._webglSetAttributes()}_webglSetAttributes(){if(this.renderer==="webgl"){var y=1,R=this.canvas.width/this.canvas.height,G=10,le=100,q=G*Math.tan(y*Math.PI/360),Y=-q,se=q*R,ie=-se,ce=(se+ie)/(se-ie),fe=(q+Y)/(q-Y),we=(le+G)/(le-G),be=2*le*G/(le-G),Ee=2*G/(se-ie),De=2*G/(q-Y),Fe=[Ee,0,ce,0,0,De,fe,0,0,0,we,be,0,0,-1,0],z=[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1];this.context.viewport(0,0,this.width,this.height),this.context.uniformMatrix4fv(this.uModelViewMatrix,!1,new Float32Array(Fe)),this.context.uniformMatrix4fv(this.uPerspectiveMatrix,!1,new Float32Array(z)),this.context.uniform1f(this.uPointSize,this.particleSize),this.context.uniform1f(this.uDepth,this.depth),this._updateRotation()}}_updateRotation(){const y=Math.cos(N),R=Math.sin(N),G=Math.cos(V),le=Math.sin(V);var q=[G,0,le,0,0,y,-R,0,-G,R,y,0,0,0,0,1];this.context.uniformMatrix4fv(this.uRotationMatrix,!1,new Float32Array(q))}_webglRenderer(){I=new Float32Array(this.vertices),this.context.bufferData(this.context.ARRAY_BUFFER,I,this.context.STATIC_DRAW),this.context.clear(this.context.COLOR_BUFFER_BIT|this.context.DEPTH_BUFFER_BIT),this.context.drawArrays(this.context.POINTS,0,this.particles.length),this.context.flush()}_initSettings(y){this.width=y.width*1||this.width,this.height=y.height*1||this.height,this.maxWidth=y.maxWidth,this.maxHeight=y.maxHeight,this.minWidth=y.minWidth,this.minHeight=y.minHeight,this.maxWidth&&(/%$/.test(this.maxWidth)?this.maxWidth=this.width*this.maxWidth.replace("%","")/100:this.maxWidth*=1),this.maxHeight&&(/%$/.test(this.maxHeight)?this.maxHeight=this.height*this.maxHeight.replace("%","")/100:this.maxHeight*=1),this.minWidth&&(/%$/.test(this.minWidth)?this.minWidth=this.width*this.minWidth.replace("%","")/100:this.minWidth*=1),this.minHeight&&(/%$/.test(this.minHeight)?this.minHeight=this.height*this.minHeight.replace("%","")/100:this.minHeight*=1),this.alphaFade=.4,this.gravity=y.gravity*1||.08,this.particleGap=y.particleGap*1||3,this.particleSize=y.particleSize*1||1,this.layerCount=y.layerCount*1||1,this.depth=y.depth*1||1,this.rotationDuration=y.rotationDuration*1||0,this.growDuration=y.growDuration*1||200,this.waitDuration=y.waitDuration*1||200,this.shrinkDuration=y.shrinkDuration*1||200,this.shrinkDistance=y.shrinkDistance*1||50,this.threeDimensional=y.threeDimensional!==void 0&&y.threeDimensional!=="false"?!!y.threeDimensional:!1,this.lifeCycle=y.lifeCycle!==void 0&&y.lifeCycle!=="false"?!!y.lifeCycle:!1,this.layerDistance=y.layerDistance||this.particleGap,this.initPosition=y.initPosition||"random",this.initDirection=y.initDirection||"random",this.fadePosition=y.fadePosition||"none",this.fadeDirection=y.fadeDirection||"none",this.noise=isNaN(y.noise*1)?10:y.noise*1,this.disableInteraction=y.disableInteraction,this.mouseForce=y.mouseForce*1||30,this.clickStrength=y.clickStrength*1||0,this.color=y.color,this.colorArr=y.colorArr||this.colorArr}_initResponsive(y){this.responsiveWidth=this.wrapperElement&&y.responsiveWidth,this.responsiveWidth&&(this.on("stopped",()=>{this.width=this.wrapperElement.clientWidth,this.start()}),this.wrapperElement.addEventListener("resize",()=>{this.width!==this.wrapperElement.clientWidth&&this.stop()}),this.width=this.wrapperElement.clientWidth)}_calculate(){for(this.vertices=this.renderer==="webgl"?[]:!1,i=0,s=0;s<this.particles.length;s++){for(l=this.origins[s],a=this.particles[s],x=l.x-a.x+(Math.random()-.5)*this.noise,v=l.y-a.y+(Math.random()-.5)*this.noise,w=l.z-a.z+(Math.random()-.5)*this.noise/1e3,p=Math.sqrt(x*x+v*v+w*w),_=p*.01,a.vx+=_*(x/p)*this.speed,a.vy+=_*(v/p)*this.speed,a.vz+=_*(w/p)*this.speed,u=0;u<this.touches.length;u++)c=this.touches[u],x=a.x-c.x,v=a.y-c.y,w=a.z-c.z,p=Math.sqrt(x*x+v*v+w*w),_=this.mouseForce*c.force/p,a.vx+=_*(x/p)*this.speed,a.vy+=_*(v/p)*this.speed,a.vz+=_*(w/p)*this.speed;a.vx*=this.gravityFactor,a.vy*=this.gravityFactor,a.vz*=this.gravityFactor,a.x+=a.vx,a.y+=a.vy,a.z+=a.vz,0>a.x||a.x>=this.width||0>a.y||a.y>=this.height?(a.isHidden=!0,this.state==="stopping"&&(a.isDead=!0)):(this.state==="stopping"&&!a.isDead&&i++,a.isHidden=!1),this.vertices&&(m=a.x-this.width/2,h=a.y-this.height/2,f=a.z,B=l.vertexColors[3],this.lifeCycle&&(l.tick+=1,l.tick>=0?l.tick<this.growDuration?B=B*(l.tick/this.growDuration):(L=l.tick-this.growDuration-this.waitDuration,L>=0&&L<=this.shrinkDuration&&(c=this.touches[u],p=Math.sqrt(m*m+h*h+(f-50)*(f-50)),_=L/this.shrinkDuration,m+=this.shrinkDistance*(m/p)*_,h+=this.shrinkDistance*(h/p)*_,f+=this.shrinkDistance*((f-50)/p)*_,B*=1-_,L===this.shrinkDuration&&(l.tick=0))):B=0),this.vertices.push(m,h,f,l.vertexColors[0],l.vertexColors[1],l.vertexColors[2],B))}this.state==="stopping"&&i===0&&(this.state="stopped")}_defaultRenderer(){for(this.depth=Math.max(this.layerDistance*this.layerCount/2,this.mouseForce),this.minZ=-this.depth,this.maxZ=this.depth,t=this.context.createImageData(this.width,this.height),s=0;s<this.origins.length;s++)l=this.origins[s],a=this.particles[s],!a.isDead&&!a.isHidden&&(m=~~a.x,h=~~a.y,B=l.color[3],this.alphaFade>0&&this.layerCount>1&&(f=Math.max(Math.min(a.z,this.maxZ),this.minZ)-this.minZ,B=B*(1-this.alphaFade)+B*this.alphaFade*(f/(this.maxZ-this.minZ)),B=Math.max(Math.min(~~B,255),0)),o=(m+h*this.width)*4,t.data[o+0]=l.color[0],t.data[o+1]=l.color[1],t.data[o+2]=l.color[2],t.data[o+3]=B);this.context.putImageData(t,0,0)}_initParticles(){for(this.particles=void 0,this.particles=[],s=0;s<this.origins.length;s++)l=this.origins[s],a={},this._initParticlePosition(l,a),this._initParticleDirection(a),this.particles.push(a)}_initParticlePosition(y,R){switch(R.z=0,this.initPosition){case"random":{R.x=Math.random()*this.width,R.y=Math.random()*this.height;break}case"top":{R.x=Math.random()*this.width*3-this.width,R.y=-Math.random()*this.height;break}case"left":{R.x=-Math.random()*this.width,R.y=Math.random()*this.height*3-this.height;break}case"bottom":{R.x=Math.random()*this.width*3-this.width,R.y=this.height+Math.random()*this.height;break}case"right":{R.x=this.width+Math.random()*this.width,R.y=Math.random()*this.height*3-this.height;break}case"misplaced":{R.x=y.x+Math.random()*this.width*.3-this.width*.1,R.y=y.y+Math.random()*this.height*.3-this.height*.1;break}default:R.x=y.x,R.y=y.y}}_fade(){if(this.fadePosition==="explode"||this.fadePosition==="top"||this.fadePosition==="left"||this.fadePosition==="bottom"||this.fadePosition==="right"?this.state="stopping":this.state="stopped",this.origins)for(s=0;s<this.origins.length;s++)this._fadeOriginPosition(this.origins[s]),this._fadeOriginDirection(this.particles[s])}_fadeOriginPosition(y){switch(this.fadePosition){case"random":{y.x=Math.random()*this.width*2-this.width,y.y=Math.random()*this.height*2-this.height,y.x>0&&(y.x+=this.width),y.y>0&&(y.y+=this.height);break}case"top":{y.x=Math.random()*this.width*3-this.width,y.y=-Math.random()*this.height;break}case"left":{y.x=-Math.random()*this.width,y.y=Math.random()*this.height*3-this.height;break}case"bottom":{y.x=Math.random()*this.width*3-this.width,y.y=this.height+Math.random()*this.height;break}case"right":{y.x=this.width+Math.random()*this.width,y.y=Math.random()*this.height*3-this.height;break}}}_initParticleDirection(y){switch(y.vz=0,this.initDirection){case"random":{k=Math.random()*Math.PI*2,b=Math.random(),y.vx=this.width*b*Math.sin(k)*.1,y.vy=this.height*b*Math.cos(k)*.1;break}case"top":{k=Math.random()*Math.PI-Math.PI/2,b=Math.random(),y.vx=this.width*b*Math.sin(k)*.1,y.vy=this.height*b*Math.cos(k)*.1;break}case"left":{k=Math.random()*Math.PI+Math.PI,b=Math.random(),y.vx=this.width*b*Math.sin(k)*.1,y.vy=this.height*b*Math.cos(k)*.1;break}case"bottom":{k=Math.random()*Math.PI+Math.PI/2,b=Math.random(),y.vx=this.width*b*Math.sin(k)*.1,y.vy=this.height*b*Math.cos(k)*.1;break}case"right":{k=Math.random()*Math.PI,b=Math.random(),y.vx=this.width*b*Math.sin(k)*.1,y.vy=this.height*b*Math.cos(k)*.1;break}default:y.vx=0,y.vy=0}}_fadeOriginDirection(y){switch(this.fadeDirection){case"random":{k=Math.random()*Math.PI*2,b=Math.random(),y.vx+=this.width*b*Math.sin(k)*.1,y.vy+=this.height*b*Math.cos(k)*.1;break}case"top":{k=Math.random()*Math.PI-Math.PI/2,b=Math.random(),y.vx+=this.width*b*Math.sin(k)*.1,y.vy+=this.height*b*Math.cos(k)*.1;break}case"left":{k=Math.random()*Math.PI+Math.PI,b=Math.random(),y.vx+=this.width*b*Math.sin(k)*.1,y.vy+=this.height*b*Math.cos(k)*.1;break}case"bottom":{k=Math.random()*Math.PI+Math.PI/2,b=Math.random(),y.vx+=this.width*b*Math.sin(k)*.1,y.vy+=this.height*b*Math.cos(k)*.1;break}case"right":{k=Math.random()*Math.PI,b=Math.random(),y.vx+=this.width*b*Math.sin(k)*.1,y.vy+=this.height*b*Math.cos(k)*.1;break}default:y.vx=0,y.vy=0}}_initOrigins(){U=document.createElement("canvas"),this.responsiveWidth&&(this.width=this.wrapperElement.clientWidth),this.ratio=Math.min(this.width,this.maxWidth||Number.POSITIVE_INFINITY)/Math.min(this.height,this.maxHeight||Number.POSITIVE_INFINITY),this.ratio<this.imageRatio?(this.renderWidth=~~Math.min(this.width||Number.POSITIVE_INFINITY,this.minWidth||this.imageWidth||Number.POSITIVE_INFINITY,this.maxWidth||Number.POSITIVE_INFINITY),this.renderHeight=~~(this.renderWidth/this.imageRatio)):(this.renderHeight=~~Math.min(this.height||Number.POSITIVE_INFINITY,this.minHeight||this.imageHeight||Number.POSITIVE_INFINITY,this.maxHeight||Number.POSITIVE_INFINITY),this.renderWidth=~~(this.renderHeight*this.imageRatio)),this.offsetX=~~((this.width-this.renderWidth)/2),this.offsetY=~~((this.height-this.renderHeight)/2),U.width=this.renderWidth,U.height=this.renderHeight,H=U.getContext("2d"),H.drawImage(this.image,0,0,this.renderWidth,this.renderHeight),E=H.getImageData(0,0,this.renderWidth,this.renderHeight).data,this.origins=void 0,this.origins=[];const y=this.growDuration+this.waitDuration+this.shrinkDuration;for(m=0;m<this.renderWidth;m+=this.particleGap)for(h=0;h<this.renderHeight;h+=this.particleGap)if(s=(m+h*this.renderWidth)*4,B=E[s+3],B>0){const R=Math.random();if(L=-Math.floor(R*y),this.colorArr)for(r=0;r<this.layerCount;r++)this.origins.push({x:this.offsetX+m,y:this.offsetY+h,z:r*this.layerDistance+50,color:this.colorArr,tick:L,seed:R,vertexColors:this.colorArr.map(G=>G/255)});else for(C=E[s],S=E[s+1],D=E[s+2],r=0;r<this.layerCount;r++)this.origins.push({x:this.offsetX+m,y:this.offsetY+h,z:r*this.layerDistance+50,color:[C,S,D,B],tick:L,seed:R,vertexColors:[C/255,S/255,D/255,B/255]})}this.speed=Math.log(this.origins.length)/10,this.gravityFactor=1-this.gravity*this.speed}_parseColor(y){let R;if(typeof y!="string")return;const G=y.replace(" ","");if(R=/^#([\da-fA-F]{2})([\da-fA-F]{2})([\da-fA-F]{2})/.exec(G))R=[parseInt(R[1],16),parseInt(R[2],16),parseInt(R[3],16)];else if(R=/^#([\da-fA-F])([\da-fA-F])([\da-fA-F])/.exec(G))R=[parseInt(R[1],16)*17,parseInt(R[2],16)*17,parseInt(R[3],16)*17];else if(R=/^rgba\(([\d]+),([\d]+),([\d]+),([\d]+|[\d]*.[\d]+)\)/.exec(G))R=[+R[1],+R[2],+R[3],+R[4]];else if(R=/^rgb\(([\d]+),([\d]+),([\d]+)\)/.exec(G))R=[+R[1],+R[2],+R[3]];else return;return R}}return{InspiraImageParticle:A}},oo=["src","data-particle-gap","data-width","data-height","data-gravity","data-particle-size","data-mouse-force","data-renderer","data-color","data-color-arr","data-init-position","data-init-direction","data-fade-position","data-fade-direction","data-noise","data-responsive-width"],no=e.defineComponent({__name:"index",props:{imageSrc:{},class:{},classList:{},canvasWidth:{},canvasHeight:{},gravity:{},particleSize:{},particleGap:{},mouseForce:{},renderer:{},color:{},colorArr:{},initPosition:{},initDirection:{},fadePosition:{},fadeDirection:{},noise:{},responsiveWidth:{type:Boolean}},setup(n){const t=n,i=e.computed(()=>{const o=t.classList&&t.classList.Location||{};return[o.position,o.width,o.height,o.left,o.top].filter(Boolean)}),s=e.ref();return e.onMounted(()=>{const{InspiraImageParticle:o}=io();new o(s.value)}),(o,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass,i.value])},[e.createElementVNode("img",{ref_key:"imageParticleRef",ref:s,src:n.imageSrc,class:e.normalizeClass(e.unref(K)(n.classList?.imageClass||"hidden w-32 h-32",o.$props.class)),"data-particle-gap":n.particleGap,"data-width":n.canvasWidth,"data-height":n.canvasHeight,"data-gravity":n.gravity,"data-particle-size":n.particleSize,"data-mouse-force":n.mouseForce,"data-renderer":n.renderer,"data-color":n.color,"data-color-arr":n.colorArr,"data-init-position":n.initPosition,"data-init-direction":n.initDirection,"data-fade-position":n.fadePosition,"data-fade-direction":n.fadeDirection,"data-noise":n.noise,"data-responsive-width":n.responsiveWidth},null,10,oo)],2))}}),ao=["width","height"],ro=["x","y","width","height","onMouseenter"],lo=e.defineComponent({__name:"InteractiveGridPattern",props:{className:{},squaresClassName:{},width:{default:40},height:{default:40},squares:{default:()=>[24,24]}},setup(n){const t=n,i=e.computed(()=>t.squares[0]),s=e.computed(()=>t.squares[1]),o=e.computed(()=>i.value*s.value),r=e.ref(null),l=e.computed(()=>t.width*i.value),a=e.computed(()=>t.height*s.value);function c(x){return x%i.value*t.width}function u(x){return Math.floor(x/i.value)*t.height}const d=e.computed(()=>K("absolute inset-0 h-full w-full border border-gray-400/30",t.className));function m(x){return K("stroke-gray-400/30 transition-all duration-100 ease-in-out [&:not(:hover)]:duration-1000",r.value===x?"fill-gray-300/30":"fill-transparent",t.squaresClassName)}function h(x){r.value=x}function f(){r.value=null}return(x,v)=>(e.openBlock(),e.createElementBlock("svg",{width:l.value,height:a.value,class:e.normalizeClass(d.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.value,(w,p)=>(e.openBlock(),e.createElementBlock("rect",{key:p,x:c(p),y:u(p),width:n.width,height:n.height,class:e.normalizeClass(m(p)),onMouseenter:_=>h(p),onMouseleave:f},null,42,ro))),128))],10,ao))}}),co=e.defineComponent({__name:"index",props:{classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const r=t.classList?.Location,l=["relative grid place-content-center overflow-hidden"];return t.classList?.overallClass?l.push(t.classList.overallClass):r?.height?l.push(r.height):l.push("h-[500px]"),r?.width&&l.push(r.width),r?.position&&l.push(r.position),r?.left&&l.push(r.left),r?.top&&l.push(r.top),l.join(" ")}),s=e.computed(()=>t.classList?.textClass||"z-10 whitespace-pre-wrap text-center text-5xl font-medium tracking-tighter text-black dark:text-white"),o=e.computed(()=>t.classList?.patternClass||"[mask-image:radial-gradient(350px_circle_at_center,white,transparent)] inset-0 h-[200%] skew-y-12");return(r,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(i.value)},[e.createElementVNode("p",{class:e.normalizeClass(s.value)}," Interactive Grid Pattern ",2),e.createVNode(lo,{class:e.normalizeClass(o.value)},null,8,["class"])],2))}}),uo=`
|
|
660
|
+
attribute vec2 aPosition;
|
|
661
|
+
void main() {
|
|
662
|
+
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
663
|
+
}
|
|
664
|
+
`,ho=`
|
|
665
|
+
precision mediump float;
|
|
666
|
+
uniform vec2 iResolution;
|
|
667
|
+
uniform float iTime;
|
|
668
|
+
uniform float uHue;
|
|
669
|
+
uniform float uXOffset;
|
|
670
|
+
uniform float uSpeed;
|
|
671
|
+
uniform float uIntensity;
|
|
672
|
+
uniform float uSize;
|
|
673
|
+
|
|
674
|
+
#define OCTAVE_COUNT 10
|
|
675
|
+
|
|
676
|
+
vec3 hsv2rgb(vec3 c) {
|
|
677
|
+
vec3 rgb = clamp(abs(mod(c.x * 6.0 + vec3(0.0,4.0,2.0), 6.0) - 3.0) - 1.0, 0.0, 1.0);
|
|
678
|
+
return c.z * mix(vec3(1.0), rgb, c.y);
|
|
679
|
+
}
|
|
680
|
+
|
|
681
|
+
float hash11(float p) {
|
|
682
|
+
p = fract(p * .1031);
|
|
683
|
+
p *= p + 33.33;
|
|
684
|
+
p *= p + p;
|
|
685
|
+
return fract(p);
|
|
686
|
+
}
|
|
687
|
+
|
|
688
|
+
float hash12(vec2 p) {
|
|
689
|
+
vec3 p3 = fract(vec3(p.xyx) * .1031);
|
|
690
|
+
p3 += dot(p3, p3.yzx + 33.33);
|
|
691
|
+
return fract((p3.x + p3.y) * p3.z);
|
|
692
|
+
}
|
|
693
|
+
|
|
694
|
+
mat2 rotate2d(float theta) {
|
|
695
|
+
float c = cos(theta);
|
|
696
|
+
float s = sin(theta);
|
|
697
|
+
return mat2(c, -s, s, c);
|
|
698
|
+
}
|
|
699
|
+
|
|
700
|
+
float noise(vec2 p) {
|
|
701
|
+
vec2 ip = floor(p);
|
|
702
|
+
vec2 fp = fract(p);
|
|
703
|
+
float a = hash12(ip);
|
|
704
|
+
float b = hash12(ip + vec2(1.0, 0.0));
|
|
705
|
+
float c = hash12(ip + vec2(0.0, 1.0));
|
|
706
|
+
float d = hash12(ip + vec2(1.0, 1.0));
|
|
707
|
+
|
|
708
|
+
vec2 t = smoothstep(0.0, 1.0, fp);
|
|
709
|
+
return mix(mix(a, b, t.x), mix(c, d, t.x), t.y);
|
|
710
|
+
}
|
|
711
|
+
|
|
712
|
+
float fbm(vec2 p) {
|
|
713
|
+
float value = 0.0;
|
|
714
|
+
float amplitude = 0.5;
|
|
715
|
+
for (int i = 0; i < OCTAVE_COUNT; ++i) {
|
|
716
|
+
value += amplitude * noise(p);
|
|
717
|
+
p *= rotate2d(0.45);
|
|
718
|
+
p *= 2.0;
|
|
719
|
+
amplitude *= 0.5;
|
|
720
|
+
}
|
|
721
|
+
return value;
|
|
722
|
+
}
|
|
723
|
+
|
|
724
|
+
void mainImage( out vec4 fragColor, in vec2 fragCoord ) {
|
|
725
|
+
vec2 uv = fragCoord / iResolution.xy;
|
|
726
|
+
uv = 2.0 * uv - 1.0;
|
|
727
|
+
uv.x *= iResolution.x / iResolution.y;
|
|
728
|
+
uv.x += uXOffset;
|
|
729
|
+
|
|
730
|
+
uv += 2.0 * fbm(uv * uSize + 0.8 * iTime * uSpeed) - 1.0;
|
|
731
|
+
|
|
732
|
+
float dist = abs(uv.x);
|
|
733
|
+
vec3 baseColor = hsv2rgb(vec3(uHue / 360.0, 0.7, 0.8));
|
|
734
|
+
vec3 col = baseColor * pow(mix(0.0, 0.07, hash11(iTime * uSpeed)) / dist, 1.0) * uIntensity;
|
|
735
|
+
col = pow(col, vec3(1.0));
|
|
736
|
+
fragColor = vec4(col, 1.0);
|
|
737
|
+
}
|
|
738
|
+
|
|
739
|
+
void main() {
|
|
740
|
+
mainImage(gl_FragColor, gl_FragCoord.xy);
|
|
741
|
+
}
|
|
742
|
+
`,mo=e.defineComponent({__name:"Lightning",props:{hue:{default:230},xOffset:{default:0},speed:{default:1},intensity:{default:1},size:{default:1}},setup(n){const t=n,i=e.useTemplateRef("canvasRef");let s=0,o=null,r=null,l=0;const a=(d,m)=>{if(!o)return null;const h=o.createShader(m);return h?(o.shaderSource(h,d),o.compileShader(h),o.getShaderParameter(h,o.COMPILE_STATUS)?h:(console.error("Shader compile error:",o.getShaderInfoLog(h)),o.deleteShader(h),null)):null},c=()=>{const d=i.value;if(!d)return;const m=()=>{const p=d.getBoundingClientRect(),_=window.devicePixelRatio||1;let k=p.width,b=p.height,I=d.parentElement;for(;I&&(!k||!b);){if(I.offsetWidth&&I.offsetHeight){k=I.offsetWidth,b=I.offsetHeight;break}I=I.parentElement}(!k||!b)&&(k=window.innerWidth,b=window.innerHeight),k=Math.max(k,300),b=Math.max(b,300),d.width=k*_,d.height=b*_,d.style.width="100%",d.style.height="100%",d.style.display="block",d.style.position="absolute",d.style.top="0",d.style.left="0"};if(m(),window.addEventListener("resize",m),o=d.getContext("webgl"),!o){console.error("WebGL not supported");return}const h=a(uo,o.VERTEX_SHADER),f=a(ho,o.FRAGMENT_SHADER);if(!h||!f||(r=o.createProgram(),!r))return;if(o.attachShader(r,h),o.attachShader(r,f),o.linkProgram(r),!o.getProgramParameter(r,o.LINK_STATUS)){console.error("Program linking error:",o.getProgramInfoLog(r));return}o.useProgram(r);const x=new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),v=o.createBuffer();o.bindBuffer(o.ARRAY_BUFFER,v),o.bufferData(o.ARRAY_BUFFER,x,o.STATIC_DRAW);const w=o.getAttribLocation(r,"aPosition");return o.enableVertexAttribArray(w),o.vertexAttribPointer(w,2,o.FLOAT,!1,0,0),l=performance.now(),u(),()=>{window.removeEventListener("resize",m)}},u=()=>{if(!o||!r||!i.value)return;const d=i.value,m=d.getBoundingClientRect();(d.width!==m.width||d.height!==m.height)&&(d.width=m.width,d.height=m.height,d.style.width=m.width+"px",d.style.height=m.height+"px"),o.viewport(0,0,d.width,d.height);const h=o.getUniformLocation(r,"iResolution"),f=o.getUniformLocation(r,"iTime"),x=o.getUniformLocation(r,"uHue"),v=o.getUniformLocation(r,"uXOffset"),w=o.getUniformLocation(r,"uSpeed"),p=o.getUniformLocation(r,"uIntensity"),_=o.getUniformLocation(r,"uSize");o.uniform2f(h,d.width,d.height);const k=performance.now();o.uniform1f(f,(k-l)/1e3),o.uniform1f(x,t.hue),o.uniform1f(v,t.xOffset),o.uniform1f(w,t.speed),o.uniform1f(p,t.intensity),o.uniform1f(_,t.size),o.drawArrays(o.TRIANGLES,0,6),s=requestAnimationFrame(u)};return e.onMounted(()=>{c()}),e.onUnmounted(()=>{s&&cancelAnimationFrame(s)}),e.watch(()=>[t.hue,t.xOffset,t.speed,t.intensity,t.size],()=>{}),(d,m)=>(e.openBlock(),e.createElementBlock("canvas",{ref_key:"canvasRef",ref:i,class:"w-full h-full block mix-blend-screen relative"},null,512))}}),fo=xe(mo,[["__scopeId","data-v-89624a01"]]),po=e.defineComponent({__name:"index",props:{hue:{default:230},xOffset:{default:0},speed:{default:1},intensity:{default:1},size:{default:1},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const o=t.classList?.Location,r=["lightning-container"];return o?.width&&r.push(o.width),o?.height&&r.push(o.height),o?.position&&r.push(o.position),o?.left&&r.push(o.left),o?.top&&r.push(o.top),r.join(" ")}),s=e.computed(()=>{const o=t.classList?.Location,r={};return o?.position&&o.position==="absolute"?r.position="absolute":o?.position||(r.position="relative"),r});return(o,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(i.value),style:e.normalizeStyle(s.value)},[e.createVNode(fo,{hue:n.hue,"x-offset":n.xOffset,speed:n.speed,intensity:n.intensity,size:n.size,class:e.normalizeClass(n.classList?.overallClass||"w-full h-full")},null,8,["hue","x-offset","speed","intensity","size","class"])],6))}}),go=xe(po,[["__scopeId","data-v-c645d292"]]),vo=["href"],xo={class:"block rounded-xl border-2 border-transparent bg-white p-1 shadow-lg dark:bg-gray-900"},yo=["src","width","height"],wo=e.defineComponent({__name:"LinkPreview",props:{isStatic:{type:Boolean,default:!1},imageSrc:{default:""},url:{default:""},class:{},linkClass:{},width:{default:200},height:{default:125}},setup(n){const t=n,i=e.ref(!1),s=e.ref(!0),o=e.ref(null),r=e.ref(!1),l=e.computed(()=>t.isStatic?t.imageSrc:`https://api.microlink.io/?${new URLSearchParams({url:t.url,screenshot:"true",meta:"false",embed:"screenshot.url",colorScheme:"light","viewport.isMobile":"true","viewport.deviceScaleFactor":"1","viewport.width":String(t.width*3),"viewport.height":String(t.height*3)}).toString()}`),a=e.reactive({x:0,y:0}),c=e.computed(()=>{if(!o.value)return{};const v=20,w=t.width,p=t.height,_=window.innerWidth;let k=a.x-w/2;k=Math.min(Math.max(0,k),_-w);const b=o.value.parentElement?.getBoundingClientRect(),I=b?b.top-p-v:0;return{position:"fixed",left:`${k}px`,top:`${I}px`,width:`${w}px`,height:`${p}px`}}),u=e.computed(()=>({width:`${t.width}px`,height:`${t.height}px`})),d=e.computed(()=>r.value?"animate-pop":"");function m(v){a.x=v.clientX,a.y=v.clientY}function h(){i.value=!0,setTimeout(()=>{r.value=!0},50)}function f(){i.value=!1,r.value=!1}function x(){s.value=!1}return(v,w)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("relative inline-block",t.class))},[e.createElementVNode("a",{href:n.url,target:"_blank",rel:"noopener noreferrer",class:e.normalizeClass(e.unref(K)("text-black dark:text-white",t.linkClass)),onMousemove:m,onMouseenter:h,onMouseleave:f},[e.renderSlot(v.$slots,"default",{},void 0,!0)],42,vo),i.value?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"preview",ref:o,class:"pointer-events-none absolute z-50",style:e.normalizeStyle(c.value)},[e.createElementVNode("div",{class:e.normalizeClass(["overflow-hidden rounded-xl shadow-xl",[d.value,{"transform-gpu":!t.isStatic}]])},[e.createElementVNode("div",xo,[e.createElementVNode("img",{src:l.value,width:n.width,height:n.height,class:"size-full rounded-lg object-cover",style:e.normalizeStyle(u.value),alt:"preview",onLoad:x},null,44,yo)])],2)],4)):e.createCommentVNode("",!0)],2))}}),At=xe(wo,[["__scopeId","data-v-e01fc5b1"]]),bo={key:0},Co={__name:"index",props:{firstParagraph:{type:Object,default:()=>({links:[{text:"Tailwind CSS",url:"https://tailwindcss.com",class:"font-bold",suffix:"and"},{text:"motion-v",url:"https://motion.unovue.com/",class:"font-bold",suffix:"are a great way to build modern websites."}]})},secondParagraph:{type:Object,default:()=>({prefix:"Visit",links:[{text:"Inspira UI",url:"https://inspira-ui.com",width:400,height:200,gradient:"bg-gradient-to-br from-purple-500 to-pink-500 bg-clip-text font-bold text-transparent"}],suffix:"for more cool components"})},classList:{type:Object,default:()=>({})}},setup(n){const t=n;console.log("LinkPreviewComp props:",t);const i=e.computed(()=>t.firstParagraph.links),s=e.computed(()=>t.secondParagraph.links),o=e.computed(()=>t.secondParagraph.prefix),r=e.computed(()=>t.secondParagraph.suffix),l=e.computed(()=>{const a=[];t.classList?.overallClass?a.push(t.classList.overallClass):a.push("flex h-[40rem] flex-col items-center justify-center px-4");const c=t.classList?.Location;return c?.position&&a.push(c.position),c?.width&&a.push(c.width),c?.height&&a.push(c.height),c?.left&&a.push(c.left),c?.top&&a.push(c.top),a.join(" ")});return(a,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(l.value)},[e.createElementVNode("p",{class:e.normalizeClass(n.classList?.firstParagraphClass||"mx-auto mb-10 max-w-3xl text-xl text-neutral-500 md:text-3xl dark:text-neutral-400")},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.value,(u,d)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:d},[e.createVNode(At,{url:u.url,class:e.normalizeClass(u.class),width:u.width,height:u.height},{default:e.withCtx(()=>[u.gradient?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(u.gradient)},e.toDisplayString(u.text),3)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(u.text),1)],64))]),_:2},1032,["url","class","width","height"]),u.suffix?(e.openBlock(),e.createElementBlock("span",bo,e.toDisplayString(u.suffix),1)):e.createCommentVNode("",!0)],64))),128))],2),e.createElementVNode("p",{class:e.normalizeClass(n.classList?.secondParagraphClass||"mx-auto max-w-3xl text-xl text-neutral-500 md:text-3xl dark:text-neutral-400")},[e.createTextVNode(e.toDisplayString(o.value)+" ",1),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,(u,d)=>(e.openBlock(),e.createBlock(At,{key:d,url:u.url,class:e.normalizeClass(u.class),width:u.width,height:u.height},{default:e.withCtx(()=>[u.gradient?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(u.gradient)},e.toDisplayString(u.text),3)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(u.text),1)],64))]),_:2},1032,["url","class","width","height"]))),128)),e.createTextVNode(" "+e.toDisplayString(r.value),1)],2)],2))}},Eo=e.defineComponent({__name:"Rays",props:{class:{}},setup(n){const t=n;return(i,s)=>(e.openBlock(),e.createElementBlock("svg",{width:"380",height:"397",viewBox:"0 0 380 397",fill:"none",xmlns:"http://www.w3.org/2000/svg",class:e.normalizeClass(e.unref(K)("absolute left-0 top-0 pointer-events-none z-[1]",t.class))},[...s[0]||(s[0]=[e.createStaticVNode('<g filter="url(#filter0_f_120_7480)"><path d="M-37.4202 -76.0163L-18.6447 -90.7295L242.792 162.228L207.51 182.074L-37.4202 -76.0163Z" fill="url(#paint0_linear_120_7480)"></path></g><g style="mix-blend-mode:plus-lighter;" opacity="0.3" filter="url(#filter1_f_120_7480)"><path d="M-109.54 -36.9027L-84.2903 -58.0902L178.786 193.228L132.846 223.731L-109.54 -36.9027Z" fill="url(#paint1_linear_120_7480)"></path></g><g style="mix-blend-mode:plus-lighter;" opacity="0.86" filter="url(#filter2_f_120_7480)"><path d="M-100.647 -65.795L-69.7261 -92.654L194.786 157.229L139.51 197.068L-100.647 -65.795Z" fill="url(#paint2_linear_120_7480)"></path></g><g style="mix-blend-mode:plus-lighter;" opacity="0.31" filter="url(#filter3_f_120_7480)"><path d="M163.917 -89.0982C173.189 -72.1354 80.9618 2.11525 34.7334 30.1553C-11.495 58.1954 -106.505 97.514 -115.777 80.5512C-125.048 63.5885 -45.0708 -3.23233 1.15763 -31.2724C47.386 -59.3124 154.645 -106.061 163.917 -89.0982Z" fill="#8A50FF"></path></g><g style="mix-blend-mode:plus-lighter;" filter="url(#filter4_f_120_7480)"><path d="M34.2031 13.2222L291.721 269.534" stroke="url(#paint3_linear_120_7480)"></path></g><g style="mix-blend-mode:plus-lighter;" filter="url(#filter5_f_120_7480)"><path d="M41 -40.9331L298.518 215.378" stroke="url(#paint4_linear_120_7480)"></path></g><g style="mix-blend-mode:plus-lighter;" filter="url(#filter6_f_120_7480)"><path d="M61.3691 3.8999L317.266 261.83" stroke="url(#paint5_linear_120_7480)"></path></g><g style="mix-blend-mode:plus-lighter;" filter="url(#filter7_f_120_7480)"><path d="M-1.46191 9.06348L129.458 145.868" stroke="url(#paint6_linear_120_7480)" stroke-width="2"></path></g>',8),e.createElementVNode("defs",null,[e.createElementVNode("filter",{id:"filter0_f_120_7480",x:"-49.4199",y:"-102.729",width:"304.212",height:"296.803",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},[e.createElementVNode("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),e.createElementVNode("feBlend",{mode:"normal",in:"SourceGraphic",in2:"BackgroundImageFix",result:"shape"}),e.createElementVNode("feGaussianBlur",{stdDeviation:"6",result:"effect1_foregroundBlur_120_7480"})]),e.createElementVNode("filter",{id:"filter1_f_120_7480",x:"-115.54",y:"-64.0903",width:"300.326",height:"293.822",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},[e.createElementVNode("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),e.createElementVNode("feBlend",{mode:"normal",in:"SourceGraphic",in2:"BackgroundImageFix",result:"shape"}),e.createElementVNode("feGaussianBlur",{stdDeviation:"3",result:"effect1_foregroundBlur_120_7480"})]),e.createElementVNode("filter",{id:"filter2_f_120_7480",x:"-111.647",y:"-103.654",width:"317.434",height:"311.722",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},[e.createElementVNode("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),e.createElementVNode("feBlend",{mode:"normal",in:"SourceGraphic",in2:"BackgroundImageFix",result:"shape"}),e.createElementVNode("feGaussianBlur",{stdDeviation:"5.5",result:"effect1_foregroundBlur_120_7480"})]),e.createElementVNode("filter",{id:"filter3_f_120_7480",x:"-212.518",y:"-188.71",width:"473.085",height:"369.366",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},[e.createElementVNode("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),e.createElementVNode("feBlend",{mode:"normal",in:"SourceGraphic",in2:"BackgroundImageFix",result:"shape"}),e.createElementVNode("feGaussianBlur",{stdDeviation:"48",result:"effect1_foregroundBlur_120_7480"})]),e.createElementVNode("filter",{id:"filter4_f_120_7480",x:"25.8447",y:"4.84521",width:"274.234",height:"273.065",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},[e.createElementVNode("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),e.createElementVNode("feBlend",{mode:"normal",in:"SourceGraphic",in2:"BackgroundImageFix",result:"shape"}),e.createElementVNode("feGaussianBlur",{stdDeviation:"4",result:"effect1_foregroundBlur_120_7480"})]),e.createElementVNode("filter",{id:"filter5_f_120_7480",x:"32.6416",y:"-49.3101",width:"274.234",height:"273.065",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},[e.createElementVNode("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),e.createElementVNode("feBlend",{mode:"normal",in:"SourceGraphic",in2:"BackgroundImageFix",result:"shape"}),e.createElementVNode("feGaussianBlur",{stdDeviation:"4",result:"effect1_foregroundBlur_120_7480"})]),e.createElementVNode("filter",{id:"filter6_f_120_7480",x:"54.0078",y:"-3.47461",width:"270.619",height:"272.68",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},[e.createElementVNode("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),e.createElementVNode("feBlend",{mode:"normal",in:"SourceGraphic",in2:"BackgroundImageFix",result:"shape"}),e.createElementVNode("feGaussianBlur",{stdDeviation:"3.5",result:"effect1_foregroundBlur_120_7480"})]),e.createElementVNode("filter",{id:"filter7_f_120_7480",x:"-9.2002",y:"1.32812",width:"146.396",height:"152.275",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB"},[e.createElementVNode("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),e.createElementVNode("feBlend",{mode:"normal",in:"SourceGraphic",in2:"BackgroundImageFix",result:"shape"}),e.createElementVNode("feGaussianBlur",{stdDeviation:"3.5",result:"effect1_foregroundBlur_120_7480"})]),e.createElementVNode("linearGradient",{id:"paint0_linear_120_7480",x1:"-57.5042",y1:"-134.741",x2:"403.147",y2:"351.523",gradientUnits:"userSpaceOnUse"},[e.createElementVNode("stop",{offset:"0.214779",stopColor:"#AF53FF"}),e.createElementVNode("stop",{offset:"0.781583",stopColor:"#B253FF",stopOpacity:"0"})]),e.createElementVNode("linearGradient",{id:"paint1_linear_120_7480",x1:"-122.154",y1:"-103.098",x2:"342.232",y2:"379.765",gradientUnits:"userSpaceOnUse"},[e.createElementVNode("stop",{offset:"0.214779",stopColor:"#AF53FF"}),e.createElementVNode("stop",{offset:"0.781583",stopColor:"#9E53FF",stopOpacity:"0"})]),e.createElementVNode("linearGradient",{id:"paint2_linear_120_7480",x1:"-106.717",y1:"-138.534",x2:"359.545",y2:"342.58",gradientUnits:"userSpaceOnUse"},[e.createElementVNode("stop",{offset:"0.214779",stopColor:"#9D53FF"}),e.createElementVNode("stop",{offset:"0.781583",stopColor:"#A953FF",stopOpacity:"0"})]),e.createElementVNode("linearGradient",{id:"paint3_linear_120_7480",x1:"72.701",y1:"54.347",x2:"217.209",y2:"187.221",gradientUnits:"userSpaceOnUse"},[e.createElementVNode("stop",{stopColor:"#AF81FF"}),e.createElementVNode("stop",{offset:"1",stopColor:"#C081FF",stopOpacity:"0"})]),e.createElementVNode("linearGradient",{id:"paint4_linear_120_7480",x1:"79.4978",y1:"0.191681",x2:"224.006",y2:"133.065",gradientUnits:"userSpaceOnUse"},[e.createElementVNode("stop",{stopColor:"#AF81FF"}),e.createElementVNode("stop",{offset:"1",stopColor:"#C081FF",stopOpacity:"0"})]),e.createElementVNode("linearGradient",{id:"paint5_linear_120_7480",x1:"79.6568",y1:"21.8377",x2:"234.515",y2:"174.189",gradientUnits:"userSpaceOnUse"},[e.createElementVNode("stop",{stopColor:"#B981FF"}),e.createElementVNode("stop",{offset:"1",stopColor:"#CF81FF",stopOpacity:"0"})]),e.createElementVNode("linearGradient",{id:"paint6_linear_120_7480",x1:"16.119",y1:"27.6966",x2:"165.979",y2:"184.983",gradientUnits:"userSpaceOnUse"},[e.createElementVNode("stop",{stopColor:"#A981FF"}),e.createElementVNode("stop",{offset:"1",stopColor:"#CB81FF",stopOpacity:"0"})])],-1)])],2))}}),ko={},So={width:"380",height:"315",viewBox:"0 0 380 315",fill:"none",xmlns:"http://www.w3.org/2000/svg",class:"pointer-events-none absolute left-1/2 top-0 w-full -translate-x-1/2"};function _o(n,t){return e.openBlock(),e.createElementBlock("svg",So,[...t[0]||(t[0]=[e.createStaticVNode('<g filter="url(#filter0_f_120_7473)"><circle cx="34" cy="52" r="114" fill="#6925E7"></circle></g><g filter="url(#filter1_f_120_7473)"><circle cx="332" cy="24" r="102" fill="#8A4BFF"></circle></g><g filter="url(#filter2_f_120_7473)"><circle cx="191" cy="53" r="102" fill="#802FE3"></circle></g><defs><filter id="filter0_f_120_7473" x="-192" y="-174" width="452" height="452" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="56" result="effect1_foregroundBlur_120_7473"></feGaussianBlur></filter><filter id="filter1_f_120_7473" x="70" y="-238" width="524" height="524" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="80" result="effect1_foregroundBlur_120_7473"></feGaussianBlur></filter><filter id="filter2_f_120_7473" x="-71" y="-209" width="524" height="524" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"></feBlend><feGaussianBlur stdDeviation="80" result="effect1_foregroundBlur_120_7473"></feGaussianBlur></filter></defs>',4)])])}const To=xe(ko,[["render",_o]]),Mo={key:0},Bo=e.defineComponent({__name:"Lens",props:{zoomFactor:{default:1.5},lensSize:{default:170},position:{default:()=>({x:200,y:150})},isStatic:{type:Boolean,default:!1},hovering:{type:Boolean,default:void 0}},emits:["hover-update"],setup(n,{emit:t}){const i=n,s=t,o=e.ref(null),r=e.ref(!1),l=e.ref({x:100,y:100}),a=e.computed(()=>i.hovering??r.value);function c(h){r.value=h,s("hover-update",h)}function u(h){const f=h.currentTarget.getBoundingClientRect();l.value={x:h.clientX-f.left,y:h.clientY-f.top}}const d=e.computed(()=>{const h=i.isStatic?i.position:l.value;return`circle ${i.lensSize/2}px at ${h.x}px ${h.y}px`}),m=e.computed(()=>{const h=i.isStatic?i.position:l.value;return`${h.x}px ${h.y}px`});return e.watchEffect(()=>{c(!1)}),(h,f)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerRef",ref:o,class:"relative z-20 overflow-hidden rounded-lg",onMouseenter:f[0]||(f[0]=x=>c(!0)),onMouseleave:f[1]||(f[1]=x=>c(!1)),onMousemove:u},[e.renderSlot(h.$slots,"default"),i.isStatic||a.value?(e.openBlock(),e.createElementBlock("div",Mo,[e.createVNode(e.unref(de.Motion),{initial:{opacity:0,scale:.58},animate:{opacity:1,scale:1},transition:{duration:.3,ease:"easeOut"},leave:{opacity:0,scale:.8},class:"absolute inset-0 overflow-hidden",style:e.normalizeStyle({maskImage:`radial-gradient(${d.value}, black 100%, transparent 100%)`,WebkitMaskImage:`radial-gradient(${d.value}, black 100%, transparent 100%)`,transformOrigin:m.value})},{default:e.withCtx(()=>[e.createElementVNode("div",{class:"absolute inset-0",style:e.normalizeStyle({transform:`scale(${i.zoomFactor})`,transformOrigin:m.value})},[e.renderSlot(h.$slots,"default")],4)]),_:3},8,["style"])])):e.createCommentVNode("",!0)],544))}}),Do=["src"],Ro=e.defineComponent({__name:"index",props:{imageSrc:{default:""},title1:{default:""},title2:{default:""},classList:{default:()=>({})}},setup(n){const t=n,i=e.ref(!1);function s(r){i.value=r}const o=e.computed(()=>{const r=[];t.classList?.overallClass?r.push(t.classList.overallClass):r.push("relative mx-auto my-10 w-full max-w-md overflow-hidden rounded-3xl bg-gradient-to-r from-[#1D2235] to-[#121318] p-8");const l=t.classList?.Location;return l?.position&&r.push(l.position),l?.width&&r.push(l.width),l?.height&&r.push(l.height),l?.left&&r.push(l.left),l?.top&&r.push(l.top),r.join(" ")});return(r,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(o.value)},[e.createVNode(Eo),e.createVNode(To),e.createElementVNode("div",{class:e.normalizeClass(n.classList?.innerContainerClass||"relative z-10")},[e.createVNode(Bo,{hovering:i.value,onHoverUpdate:s},{default:e.withCtx(()=>[e.createElementVNode("img",{src:n.imageSrc,alt:"image",width:"500",height:"500",class:e.normalizeClass(n.classList?.imageClass||"rounded-2xl")},null,10,Do)]),_:1},8,["hovering"]),e.createElementVNode("div",{style:e.normalizeStyle({filter:i.value?"blur(2px)":"blur(0px)"}),class:e.normalizeClass(n.classList?.textContainerClass||"relative z-20 py-4")},[e.createElementVNode("h2",{class:e.normalizeClass(n.classList?.title1Class||"text-left text-2xl font-bold text-white")},e.toDisplayString(n.title1),3),e.createElementVNode("p",{class:e.normalizeClass(n.classList?.title2Class||"mt-4 text-left text-neutral-200")},e.toDisplayString(n.title2),3)],6)],2)],2))}}),Io=e.defineComponent({__name:"Marquee",props:{class:{},reverse:{type:Boolean},pauseOnHover:{type:Boolean,default:!1},vertical:{type:Boolean,default:!1},repeat:{default:4}},setup(n){return(t,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("group flex overflow-hidden p-2 [--duration:40s] [--gap:1rem] [gap:var(--gap)]",n.vertical?"flex-col":"flex-row",t.$props.class))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.repeat,s=>(e.openBlock(),e.createElementBlock("div",{key:s,class:e.normalizeClass(e.unref(K)("flex shrink-0 justify-around [gap:var(--gap)]",n.vertical?"animate-marquee-vertical flex-col":"animate-marquee flex-row",n.pauseOnHover?"group-hover:[animation-play-state:paused]":"")),style:e.normalizeStyle({animationDirection:n.reverse?"reverse":"normal"})},[e.renderSlot(t.$slots,"default",{},void 0,!0)],6))),128))],2))}}),Pt=xe(Io,[["__scopeId","data-v-22c162eb"]]),Lo={class:"relative w-64 cursor-pointer overflow-hidden rounded-xl border border-gray-950/[.1] bg-gray-950/[.01] p-4 hover:bg-gray-950/[.05] dark:border-gray-50/[.1] dark:bg-gray-50/[.10] dark:hover:bg-gray-50/[.15]"},zo={class:"flex flex-row items-center gap-2"},Ao=["src"],Po={class:"flex flex-col"},No={class:"text-sm font-medium dark:text-white"},Vo={class:"text-xs font-medium dark:text-white/40"},Fo={class:"mt-2 text-sm"},Nt=e.defineComponent({__name:"ReviewCard",props:{img:{},name:{},username:{},body:{}},setup(n){return(t,i)=>(e.openBlock(),e.createElementBlock("figure",Lo,[e.createElementVNode("div",zo,[e.createElementVNode("img",{src:n.img,class:"rounded-full",width:"32",height:"32",alt:""},null,8,Ao),e.createElementVNode("div",Po,[e.createElementVNode("span",No,e.toDisplayString(n.name),1),e.createElementVNode("p",Vo,e.toDisplayString(n.username),1)])]),e.createElementVNode("blockquote",Fo,e.toDisplayString(n.body),1)]))}}),Oo=e.defineComponent({__name:"index",props:{reviews:{type:Array,default:()=>[]},classList:{type:Object,default:()=>({})}},setup(n){const t=n,i=[{name:"Jack",username:"@jack",body:"I've never seen anything like this before. It's amazing. I love it.",img:"https://avatar.vercel.sh/jack"},{name:"Jill",username:"@jill",body:"I don't know what to say. I'm speechless. This is amazing.",img:"https://avatar.vercel.sh/jill"},{name:"John",username:"@john",body:"I'm at a loss for words. This is amazing. I love it.",img:"https://avatar.vercel.sh/john"},{name:"Jane",username:"@jane",body:"I'm at a loss for words. This is amazing. I love it.",img:"https://avatar.vercel.sh/jane"},{name:"Jenny",username:"@jenny",body:"I'm at a loss for words. This is amazing. I love it.",img:"https://avatar.vercel.sh/jenny"},{name:"James",username:"@james",body:"I'm at a loss for words. This is amazing. I love it.",img:"https://avatar.vercel.sh/james"}],s=e.computed(()=>t.reviews||i),o=e.computed(()=>s.value.slice(0,s.value.length/2)),r=e.computed(()=>s.value.slice(s.value.length/2)),l=e.computed(()=>{const a=t.classList?.Location||{};return[a.position,a.width,a.height,a.left,a.top].filter(Boolean)});return(a,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList.overallClass||"relative flex h-[500px] w-full flex-col items-center justify-center overflow-hidden rounded-lg border bg-background md:shadow-xl",l.value])},[e.createVNode(Pt,{"pause-on-hover":"",class:e.normalizeClass(n.classList.marqueeClass||"[--duration:20s]")},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.value,u=>(e.openBlock(),e.createBlock(Nt,{key:u.username,img:u.img,name:u.name,username:u.username,body:u.body},null,8,["img","name","username","body"]))),128))]),_:1},8,["class"]),e.createVNode(Pt,{reverse:"","pause-on-hover":"",class:e.normalizeClass(n.classList.marqueeClass||"[--duration:20s]")},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.value,u=>(e.openBlock(),e.createBlock(Nt,{key:u.username,img:u.img,name:u.name,username:u.username,body:u.body},null,8,["img","name","username","body"]))),128))]),_:1},8,["class"]),e.createElementVNode("div",{class:e.normalizeClass(n.classList.gradientLeftClass||"pointer-events-none absolute inset-y-0 left-0 w-1/3 bg-gradient-to-r from-white dark:from-background")},null,2),e.createElementVNode("div",{class:e.normalizeClass(n.classList.gradientRightClass||"pointer-events-none absolute inset-y-0 right-0 w-1/3 bg-gradient-to-l from-white dark:from-background")},null,2)],2))}}),Uo=e.defineComponent({__name:"Meteors",props:{count:{type:Number,default:20},class:String},setup(n){return(t,i)=>(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.count,s=>(e.openBlock(),e.createElementBlock("span",{key:"meteor "+s,class:e.normalizeClass(e.unref(K)("animate-meteor-effect absolute h-0.5 w-0.5 rotate-[45deg] rounded-[9999px] bg-slate-500 shadow-[0_0_0_1px_#ffffff10]","before:absolute before:top-1/2 before:h-[1px] before:w-[50px] before:-translate-y-[50%] before:transform before:bg-gradient-to-r before:from-[#64748b] before:to-transparent before:content-['']",t.$props.class)),style:e.normalizeStyle({top:0,left:Math.floor(Math.random()*800+-400)+"px",animationDelay:Math.random()*(.8-.2)+.2+"s",animationDuration:Math.floor(Math.random()*8+2)+"s"})},null,6))),128))}}),$o=xe(Uo,[["__scopeId","data-v-6c573ccf"]]),Ho=e.defineComponent({__name:"index",props:{title:{default:"Meteors because they're cool"},description:{default:"I don't know what to write so I'll just paste something cool here. One more sentence because lorem ipsum is just unacceptable. Won't ChatGPT the shit out of this."},buttonText:{default:"Explore"},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>{const r=e.resolveComponent("ClientOnly");return e.openBlock(),e.createBlock(r,null,{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass([n.classList?.overallClass||"flex w-full flex-col items-center justify-center py-24",i.value])},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.containerClass||"relative w-full max-w-xs")},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.gradientClass||"absolute inset-0 size-full scale-[0.80] rounded-full bg-red-500 bg-gradient-to-r from-blue-500 to-teal-500 blur-3xl")},null,2),e.createElementVNode("div",{class:e.normalizeClass(n.classList?.cardClass||"relative flex h-full flex-col items-start justify-end overflow-hidden rounded-2xl border border-gray-800 bg-gray-900 px-4 py-8 shadow-xl")},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.iconClass||"mb-4 flex size-5 items-center justify-center rounded-full border border-gray-500")},[...o[0]||(o[0]=[e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:"1.5",stroke:"currentColor",class:"size-2 text-gray-300"},[e.createElementVNode("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M4.5 4.5l15 15m0 0V8.25m0 11.25H8.25"})],-1)])],2),e.createElementVNode("h1",{class:e.normalizeClass(n.classList?.titleClass||"relative z-50 mb-4 text-xl font-bold text-white")},e.toDisplayString(n.title||"Meteors because they're cool"),3),e.createElementVNode("p",{class:e.normalizeClass(n.classList?.descriptionClass||"relative z-50 mb-4 text-base font-normal text-slate-500")},e.toDisplayString(n.description||"I don't know what to write so I'll just paste something cool here. One more sentence because lorem ipsum is just unacceptable. Won't ChatGPT the shit out of this."),3),e.createElementVNode("button",{class:e.normalizeClass(n.classList?.buttonClass||"rounded-lg border border-gray-500 px-4 py-1 text-gray-300")},e.toDisplayString(n.buttonText||"Explore"),3),e.createVNode($o)],2)],2)],2)]),_:1})}}}),Go=["src","alt"],Yo=e.defineComponent({__name:"PhotoGallery",props:{containerClass:{},class:{},items:{}},setup(n){const t=n;return(i,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["gallery",e.unref(K)("mb-[var(--size)] grid grid-cols-6 gap-1",t.containerClass)])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,(o,r)=>(e.openBlock(),e.createElementBlock("img",{key:r,src:o.src,alt:`image+${r}`,class:e.normalizeClass(["gallery-img",e.unref(K)("size-[calc(var(--size)*2)] rounded object-cover transition-[clip-path,filter] duration-75",t.class)])},null,10,Go))),128))],2))}}),jo=xe(Yo,[["__scopeId","data-v-aad0b94e"]]),Wo=e.defineComponent({__name:"index",props:{items:{type:Array,default:()=>[]},classList:{type:Object,default:()=>({})}},setup(n){const t=n,i=[{src:"https://images.pexels.com/photos/16834200/pexels-photo-16834200/free-photo-of-young-brunette-in-a-white-dress-sitting-on-a-bench-and-holding-flowers.jpeg?auto=compress&cs=tinysrgb&w=600&lazy=load"},{src:"https://images.pexels.com/photos/16834202/pexels-photo-16834202/free-photo-of-young-woman-in-a-white-dress-posing-outdoors.jpeg?auto=compress&cs=tinysrgb&w=600&lazy=load"},{src:"https://images.pexels.com/photos/16834194/pexels-photo-16834194/free-photo-of-woman-in-white-dress-posing-with-red-flowers-on-lap.jpeg?auto=compress&cs=tinysrgb&w=600&lazy=load"},{src:"https://images.pexels.com/photos/17362900/pexels-photo-17362900/free-photo-of-pretty-young-model-in-chinese-retro-dress.jpeg?auto=compress&cs=tinysrgb&w=600&lazy=load"},{src:"https://images.pexels.com/photos/19447919/pexels-photo-19447919/free-photo-of-model-in-a-pink-ao-dai-dress-with-a-bouquet-of-tulips-by-the-river.jpeg?auto=compress&cs=tinysrgb&w=600&lazy=load"},{src:"https://images.pexels.com/photos/20332975/pexels-photo-20332975/free-photo-of-young-woman-posing-in-a-silk-slip-dress.jpeg?auto=compress&cs=tinysrgb&w=600&lazy=load"},{src:"https://images.pexels.com/photos/19732643/pexels-photo-19732643/free-photo-of-woman-in-white-dress-sitting-and-reading-book.jpeg?auto=compress&cs=tinysrgb&w=600&lazy=load"},{src:"https://images.pexels.com/photos/17347482/pexels-photo-17347482/free-photo-of-woman-in-dress-posing-with-bag.jpeg?auto=compress&cs=tinysrgb&w=600&lazy=load"}],s=e.computed(()=>t.items||i),o=e.computed(()=>{const r=t.classList?.Location||{};return[r.position,r.width,r.height,r.left,r.top].filter(Boolean)});return(r,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList.overallClass||"flex items-center justify-center",o.value])},[e.createVNode(jo,{items:s.value,class:e.normalizeClass(n.classList.galleryClass)},null,8,["items","class"])],2))}}),Xo=["for"],qo=["for"],Zo=["disabled"],Ko={__name:"index",props:{classList:Object,formConfig:Object,title:String,submitText:String,layout:Object},setup(n){const t=n,i=e.reactive({}),s=e.reactive({});(()=>{t.formConfig&&Array.isArray(t.formConfig)&&t.formConfig.forEach((u,d)=>{const m=u.key||`field_${d}`;i[m]=u.defaultValue||"",s[m]=""}),console.log(i)})();const r=(u,d)=>{const m=t.formConfig?.find(f=>(f.key||`field_${t.formConfig.indexOf(f)}`)===u),h=m?.validation||{};return h.required&&(!d||d.trim().length===0)?h.requiredMessage||"ๆญคๅญๆฎตไธบๅฟ
ๅกซ้กน":h.minLength&&d&&d.length<h.minLength?h.minLengthMessage||`่ณๅฐ้่ฆ${h.minLength}ไธชๅญ็ฌฆ`:h.email&&m?.type==="email"&&!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(d)?h.emailMessage||"่ฏท่พๅ
ฅๆๆ็้ฎ็ฎฑๅฐๅ":""},l=()=>{let u=!0;return Object.keys(i).forEach(d=>{const m=r(d,i[d]);s[d]=m,m&&(u=!1)}),u},a=e.computed(()=>Object.values(s).every(u=>!u)),c=()=>{l()?(console.log("Form submitted:",i),t.formConfig?.onSubmit?t.formConfig.onSubmit(i):alert("่กจๅๆไบคๆๅ๏ผ")):(console.log("Form validation failed:",s),alert("่ฏทๆฃๆฅ่กจๅไธญ็้่ฏฏ"))};return(u,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList.overallClass])},[n.title?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(n.classList.titleClass)},e.toDisplayString(n.title),3)):e.createCommentVNode("",!0),e.createElementVNode("form",{onSubmit:e.withModifiers(c,["prevent"]),class:e.normalizeClass(n.classList.formClass)},[n.layout?.rows?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(n.layout.rows,(m,h)=>(e.openBlock(),e.createElementBlock("div",{key:h,class:e.normalizeClass(m.class)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(m.fields,f=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:f},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.formConfig,(x,v)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:v},[x?.key===f&&x?.show!==!1?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(n.classList.fieldClass)},[e.createElementVNode("label",{for:x?.id||`field_${v}`,class:e.normalizeClass(n.classList.labelClass)},e.toDisplayString(x?.label||"ๆ "),11,Xo),e.createVNode(mt,{id:x?.id||`field_${v}`,modelValue:i[x.key||`field_${v}`],"onUpdate:modelValue":w=>i[x.key||`field_${v}`]=w,onBlur:w=>s[x.key||`field_${v}`]=r(x.key||`field_${v}`,i[x.key||`field_${v}`]),type:x?.type||"text",class:e.normalizeClass([n.classList.inputClass,s[x.key||`field_${v}`]?n.classList.errorInputClass:""]),"container-class":[n.classList.inputContainerClass,s[x.key||`field_${v}`]?n.classList.errorContainerClass:""],placeholder:x?.placeholder||"่ฏท่พๅ
ฅ"},null,8,["id","modelValue","onUpdate:modelValue","onBlur","type","class","container-class","placeholder"]),s[x.key||`field_${v}`]?(e.openBlock(),e.createElementBlock("p",{key:0,class:e.normalizeClass(n.classList.errorTextClass)},e.toDisplayString(s[x.key||`field_${v}`]),3)):e.createCommentVNode("",!0)],2)):e.createCommentVNode("",!0)],64))),128))],64))),128))],2))),128)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(n.formConfig,(m,h)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:h},[m?.show!==!1?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(n.classList.fieldClass)},[e.createElementVNode("label",{for:m?.id||`field_${h}`,class:e.normalizeClass(n.classList.labelClass)},e.toDisplayString(m?.label||"ๆ "),11,qo),e.createVNode(mt,{id:m?.id||`field_${h}`,modelValue:i[m.key||`field_${h}`],"onUpdate:modelValue":f=>i[m.key||`field_${h}`]=f,onBlur:f=>s[m.key||`field_${h}`]=r(m.key||`field_${h}`,i[m.key||`field_${h}`]),type:m?.type||"text",class:e.normalizeClass([n.classList.inputClass,s[m.key||`field_${h}`]?n.classList.errorInputClass:""]),"container-class":[n.classList.inputContainerClass,s[m.key||`field_${h}`]?n.classList.errorContainerClass:""],placeholder:m?.placeholder||"่ฏท่พๅ
ฅ"},null,8,["id","modelValue","onUpdate:modelValue","onBlur","type","class","container-class","placeholder"]),s[m.key||`field_${h}`]?(e.openBlock(),e.createElementBlock("p",{key:0,class:e.normalizeClass(n.classList.errorTextClass)},e.toDisplayString(s[m.key||`field_${h}`]),3)):e.createCommentVNode("",!0)],2)):e.createCommentVNode("",!0)],64))),128)),e.createElementVNode("button",{type:"submit",disabled:!a.value,class:e.normalizeClass([n.classList.buttonClass,a.value?n.classList.buttonEnabledClass:n.classList.buttonDisabledClass])},[e.createElementVNode("span",null,e.toDisplayString(n.submitText||"Sign up"),1),(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(n.classList.buttonIconClass),fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},[...d[0]||(d[0]=[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 5l7 7-7 7"},null,-1)])],2))],10,Zo)],34)],2))}},Jo=xe(Ko,[["__scopeId","data-v-48b871c2"]]),Qo={class:"relative z-10"},en={class:"pointer-events-none absolute inset-0"},tn=e.defineComponent({__name:"RippleButton",props:{class:{},rippleColor:{default:"#ADD8E6"},duration:{default:600},backgroundImage:{}},emits:["click"],setup(n,{emit:t}){const i=n,s=t,o=e.ref(null),r=e.ref([]),l=e.computed(()=>{const u={"--duration":String(i.duration)+"ms"};return i.backgroundImage&&(u.backgroundImage=`url(${i.backgroundImage})`,u.backgroundSize="cover",u.backgroundPosition="center",u.backgroundRepeat="no-repeat"),u});function a(u){c(u),s("click",u)}function c(u){const d=o.value;if(!d)return;const m=d.getBoundingClientRect(),h=Math.max(m.width,m.height),f=u.clientX-m.left-h/2,x=u.clientY-m.top-h/2,v={x:f,y:x,size:h,key:Date.now()};r.value.push(v)}return e.watchEffect(()=>{if(r.value.length>0){const u=r.value[r.value.length-1];setTimeout(()=>{r.value=r.value.filter(d=>d.key!==u.key)},i.duration)}}),(u,d)=>(e.openBlock(),e.createElementBlock("button",{ref_key:"rippleButtonRef",ref:o,class:e.normalizeClass(e.unref(K)("relative flex cursor-pointer items-center justify-center overflow-hidden","rounded-lg border-2 bg-background px-4 py-2 text-center text-primary",u.$props.class)),style:e.normalizeStyle(l.value),onClick:a},[e.createElementVNode("div",Qo,[e.renderSlot(u.$slots,"default",{},void 0,!0)]),e.createElementVNode("span",en,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.value,m=>(e.openBlock(),e.createElementBlock("span",{key:m.key,class:"ripple-animation absolute rounded-full bg-background opacity-30",style:e.normalizeStyle({width:m.size+"px",height:m.size+"px",top:m.y+"px",left:m.x+"px",backgroundColor:u.$props.rippleColor,transform:"scale(0)",animationDuration:u.$props.duration+"ms"})},null,4))),128))])],6))}}),sn=xe(tn,[["__scopeId","data-v-c6dbfb1d"]]),on=e.defineComponent({__name:"index",props:{backgroundImage:{default:"/assets/image2.png"},rippleColor:{default:"#0ea5e9"},duration:{default:800},buttonText:{default:"Click me!"},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass||"grid place-content-center p-8",i.value])},[e.createVNode(sn,{backgroundImage:n.backgroundImage,"ripple-color":n.rippleColor||"#0ea5e9",duration:n.duration||800,class:e.normalizeClass(n.classList?.buttonClass)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(n.buttonText||"Click me!"),1)]),_:1},8,["backgroundImage","ripple-color","duration","class"])],2))}}),nn=["src"],an=e.defineComponent({__name:"RollingGallery",props:{autoplay:{type:Boolean,default:!1},pauseOnHover:{type:Boolean,default:!1},images:{default:()=>[]},classList:{default:()=>({})}},setup(n){const t=n,i=e.shallowRef(["https://images.unsplash.com/photo-1528181304800-259b08848526?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1506665531195-3566af2b4dfa?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?q=80&w=3456&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1495103033382-fe343886b671?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1506781961370-37a89d6b3095?q=80&w=3264&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1599576838688-8a6c11263108?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1494094892896-7f14a4433b7a?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://plus.unsplash.com/premium_photo-1664910706524-e783eed89e71?q=80&w=3869&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1503788311183-fa3bf9c4bc32?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1585970480901-90d6bb2a48b5?q=80&w=3774&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"]),s=e.ref(!1),o=e.ref(0),r=e.ref(null),l=e.ref(null),a=e.ref(!1),c=e.ref(!1),u=e.ref(0),d=e.ref(0),m=e.computed(()=>{const Y=t.images.length>0?t.images:i.value,se=I;if(Y.length>=se)return Y;const ie=[],ce=Math.ceil(se/Y.length);for(let fe=0;fe<ce;fe++)ie.push(...Y);return ie.slice(0,se)}),h=e.computed(()=>s.value?1100:1800),f=e.computed(()=>h.value/U*1.5),x=e.computed(()=>h.value/(2*Math.PI)),v=Object.freeze(.15),w=Object.freeze(.05),p=Object.freeze(2e3),_=Object.freeze(1500),k=Object.freeze(100),b=Object.freeze(50),I=Object.freeze(10),U=Object.freeze(10),H=e.computed(()=>({width:`${h.value}px`,transformStyle:"preserve-3d"})),E=e.computed(()=>({rotateY:o.value})),C=e.computed(()=>a.value?{duration:0}:{duration:.8,ease:"easeOut"}),S=new Map,D=Y=>{const se=`${Y}-${f.value}-${x.value}`;if(S.has(se))return S.get(se);const ie={width:`${f.value}px`,transform:`rotateY(${Y*(360/I)}deg) translateZ(${x.value}px)`};return S.size>50&&S.clear(),S.set(se,ie),ie};let B=null,L=null;function N(){s.value=window.innerWidth<=640}function V(){B||(B=setTimeout(()=>{N(),B=null},100))}function A(Y){a.value=!0,u.value=Y.clientX,d.value=o.value,G(),document.addEventListener("mousemove",J,{passive:!0}),document.addEventListener("mouseup",y,{passive:!0}),Y.preventDefault()}function J(Y){if(!a.value)return;const ie=(Y.clientX-u.value)*v;o.value=d.value+ie}function y(Y){if(!a.value)return;a.value=!1;const ie=(Y.clientX-u.value)*w;if(o.value+=ie,document.removeEventListener("mousemove",J),document.removeEventListener("mouseup",y),G(),t.autoplay){if(t.pauseOnHover&&c.value)return;l.value=setTimeout(()=>{!a.value&&(!t.pauseOnHover||!c.value)&&R()},_)}}function R(){!t.autoplay||a.value||t.pauseOnHover&&c.value||(G(),r.value=setInterval(()=>{!a.value&&(!t.pauseOnHover||!c.value)&&(o.value-=360/I)},p))}function G(){r.value&&(clearInterval(r.value),r.value=null),l.value&&(clearTimeout(l.value),l.value=null)}function le(){L&&(clearTimeout(L),L=null),L=setTimeout(()=>{c.value=!0,t.autoplay&&t.pauseOnHover&&!a.value&&G()},b)}function q(){L&&(clearTimeout(L),L=null),L=setTimeout(()=>{c.value=!1,t.autoplay&&t.pauseOnHover&&!a.value&&(G(),l.value=setTimeout(()=>{t.autoplay&&!a.value&&!c.value&&R()},k))},b)}return e.onMounted(()=>{N(),window.addEventListener("resize",V,{passive:!0}),t.autoplay&&R()}),e.onUnmounted(()=>{window.removeEventListener("resize",V),document.removeEventListener("mousemove",J),document.removeEventListener("mouseup",y),G(),B&&clearTimeout(B),L&&(clearTimeout(L),L=null)}),e.watch(()=>t.autoplay,Y=>{G(),Y&&!a.value&&(!t.pauseOnHover||!c.value)&&(l.value=setTimeout(()=>{!a.value&&(!t.pauseOnHover||!c.value)&&R()},k))}),e.watch(()=>t.pauseOnHover,()=>{t.autoplay&&(G(),!a.value&&(!t.pauseOnHover||!c.value)&&R())}),(Y,se)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(n.classList?.containerClass||"relative h-[500px] w-full overflow-hidden")},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.leftGradientClass||"absolute top-0 left-0 h-full w-12 z-10 bg-gradient-to-l from-transparent to-[#0b0b0b]")},null,2),e.createElementVNode("div",{class:e.normalizeClass(n.classList?.rightGradientClass||"absolute top-0 right-0 h-full w-12 z-10 bg-gradient-to-r from-transparent to-[#0b0b0b]")},null,2),e.createElementVNode("div",{class:e.normalizeClass(n.classList?.perspectiveContainerClass||"flex h-full items-center justify-center [perspective:1000px] [transform-style:preserve-3d]")},[e.createVNode(e.unref(de.Motion),{tag:"div",class:e.normalizeClass(n.classList?.motionContainerClass||"flex min-h-[200px] items-center justify-center w-full cursor-grab select-none will-change-transform [transform-style:preserve-3d] active:cursor-grabbing"),style:e.normalizeStyle(H.value),animate:E.value,transition:C.value,onMouseenter:le,onMouseleave:q,onMousedown:A},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(m.value,(ie,ce)=>(e.openBlock(),e.createElementBlock("div",{key:`gallery-${ce}`,style:e.normalizeStyle(D(ce)),class:e.normalizeClass(n.classList?.itemContainerClass||"absolute flex items-center justify-center px-[8%] [backface-visibility:hidden] will-change-transform pointer-events-none")},[e.createElementVNode("img",{src:ie,alt:"gallery",loading:"lazy",decoding:"async",class:e.normalizeClass(n.classList?.imageClass||"pointer-events-auto h-[120px] w-[300px] rounded-[15px] border-[3px] border-white object-cover transition-transform duration-300 ease-in-out will-change-transform hover:scale-105")},null,10,nn)],6))),128))]),_:1},8,["class","style","animate","transition"])],2)],2))}}),rn=e.defineComponent({__name:"index",props:{images:{default:()=>["https://images.unsplash.com/photo-1528181304800-259b08848526?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1506665531195-3566af2b4dfa?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?q=80&w=3456&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D","https://images.unsplash.com/photo-1495103033382-fe343886b671?q=80&w=3870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"]},autoplay:{type:Boolean,default:!0},pauseOnHover:{type:Boolean,default:!0},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([i.value])},[e.createVNode(an,{autoplay:n.autoplay,"pause-on-hover":n.pauseOnHover,images:n.images,"class-list":n.classList},null,8,["autoplay","pause-on-hover","images","class-list"])],2))}}),ln=["width","height"],cn="url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIj4KICA8Y2lyY2xlIGN4PSIxNiIgY3k9IjE2IiByPSIxNSIgc3R5bGU9ImZpbGw6I2ZmZjtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MXB4OyIgLz4KPC9zdmc+'), auto",un=e.defineComponent({__name:"ScratchToReveal",props:{class:{},width:{},height:{},minScratchPercentage:{default:50},gradientColors:{default:()=>["#A97CF8","#F38CB8","#FDCC92"]}},emits:["complete"],setup(n,{emit:t}){const i=e.ref(),s=n,o=e.computed(()=>s.width+"px"),r=e.computed(()=>s.height+"px"),l=e.ref(),a=t,c=e.ref(!1),u=e.ref(!1);function d(){c.value=!0}function m(){c.value=!0}const h=e.computed(()=>i.value?.width||s.width),f=e.computed(()=>i.value?.height||s.height);function x(S){l.value=S.value.getContext("2d"),l.value.fillStyle="#ccc",l.value.fillRect(0,0,h.value,f.value);const D=l.value.createLinearGradient(0,0,h.value,f.value);D.addColorStop(0,s.gradientColors[0]),D.addColorStop(.5,s.gradientColors[1]),D.addColorStop(1,s.gradientColors[2]),l.value.fillStyle=D,l.value.fillRect(0,0,h.value,f.value)}function v(S,D){if(i.value&&l.value){const B=i.value.getBoundingClientRect(),L=S-B.left+16,N=D-B.top+16;l.value.globalCompositeOperation="destination-out",l.value.beginPath(),l.value.arc(L,N,30,0,Math.PI*2),l.value.fill()}}function w(S){c.value&&v(S.clientX,S.clientY)}function p(S){if(!c.value)return;const D=S.touches[0];v(D.clientX,D.clientY)}function _(){c.value=!1,I()}function k(){c.value=!1,I()}function b(){document.addEventListener("mousedown",w),document.addEventListener("mousemove",w),document.addEventListener("touchstart",p),document.addEventListener("touchmove",p),document.addEventListener("mouseup",_),document.addEventListener("touchend",k),document.addEventListener("touchcancel",k)}function I(){if(!u.value&&i.value&&l.value){const D=l.value.getImageData(0,0,h.value,f.value).data,B=D.length/4;let L=0;for(let V=3;V<D.length;V+=4)D[V]===0&&L++;L/B*100>=s.minScratchPercentage?(u.value=!0,l.value.clearRect(0,0,h.value,f.value),E()):c.value=!1}}const[U,H]=de.useAnimate();async function E(){U.value&&(H(U.value,{scale:1,rotate:[0,10,-10,10,-10,0]}),a("complete"))}e.onMounted(()=>{i.value&&(x(i),b())});function C(){document.removeEventListener("mousedown",w),document.removeEventListener("mousemove",w),document.removeEventListener("touchstart",p),document.removeEventListener("touchmove",p),document.removeEventListener("mouseup",_),document.removeEventListener("touchend",k),document.removeEventListener("touchcancel",k)}return e.onUnmounted(()=>{C()}),(S,D)=>(e.openBlock(),e.createBlock(e.unref(de.Motion),{ref_key:"containerRef",ref:U,class:e.normalizeClass(e.unref(K)("relative select-none",s.class)),style:e.normalizeStyle({width:o.value,height:r.value,cursor:cn}),initial:{scale:1,rotate:[0,10,-10,10,-10,0]},transition:{duration:.5}},{default:e.withCtx(()=>[e.createElementVNode("canvas",{ref_key:"canvasRef",ref:i,width:n.width,height:n.height,class:"absolute left-0 top-0",onMousedown:d,onTouchstart:m},null,40,ln),e.renderSlot(S.$slots,"default")]),_:3},8,["class","style"]))}}),dn=e.defineComponent({__name:"index",props:{width:{default:250},height:{default:250},minScratchPercentage:{default:50},gradientColors:{default:()=>["#A97CF8","#F38CB8","#FDCC92"]},revealContent:{default:"๐ฅณ"},classList:{default:()=>({})}},setup(n){function t(){}return(i,s)=>(e.openBlock(),e.createBlock(un,{width:n.width,height:n.height,"min-scratch-percentage":n.minScratchPercentage,class:e.normalizeClass(n.classList?.overallClass||"mx-auto flex items-center justify-center overflow-hidden rounded-2xl border-2 bg-gray-100"),"gradient-colors":n.gradientColors,onComplete:t},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.contentClass||"text-8xl")},e.toDisplayString(n.revealContent),3)]),_:1},8,["width","height","min-scratch-percentage","class","gradient-colors"]))}}),hn={fill:"none",class:"size-full","stroke-width":"2",viewBox:"0 0 100 100"},mn=["stroke-width"],fn=["stroke-width"],pn=["data-current-value"],gn=e.defineComponent({__name:"AnimatedCircularProgressBar",props:{max:{default:100},value:{default:0},min:{default:0},gaugePrimaryColor:{default:"rgb(79 70 229)"},gaugeSecondaryColor:{default:"rgba(0, 0, 0, 0.1)"},class:{},circleStrokeWidth:{default:10},showPercentage:{type:Boolean,default:!0},duration:{default:1}},setup(n){e.useCssVars(a=>({v1f048564:i,v16000b30:r.value,v17effbd9:a.gaugePrimaryColor,cf3a39a6:o.value,v11eaec25:l.value,v97340cb2:a.gaugeSecondaryColor}));const t=n,i=2*Math.PI*45,s=i/100,o=e.computed(()=>(t.value-t.min)/(t.max-t.min)*100),r=e.computed(()=>`${s}px`),l=e.computed(()=>`${t.duration}s`);return(a,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["progress-circle-base",e.unref(K)("relative size-40 text-2xl font-semibold",t.class)])},[(e.openBlock(),e.createElementBlock("svg",hn,[o.value<=90&&o.value>=0?(e.openBlock(),e.createElementBlock("circle",{key:0,cx:"50",cy:"50",r:"45","stroke-width":n.circleStrokeWidth,"stroke-dashoffset":"0","stroke-linecap":"round","stroke-linejoin":"round",class:"gauge-secondary-stroke opacity-100"},null,8,mn)):e.createCommentVNode("",!0),e.createElementVNode("circle",{cx:"50",cy:"50",r:"45","stroke-width":n.circleStrokeWidth,"stroke-dashoffset":"0","stroke-linecap":"round","stroke-linejoin":"round",class:"gauge-primary-stroke opacity-100"},null,8,fn)])),n.showPercentage?(e.openBlock(),e.createElementBlock("span",{key:0,"data-current-value":o.value,class:"absolute inset-0 m-auto size-fit delay-0 duration-1000 ease-linear animate-in fade-in"},e.toDisplayString(o.value),9,pn)):e.createCommentVNode("",!0)],2))}}),vn=xe(gn,[["__scopeId","data-v-ea809044"]]),xn={class:"gray- flex h-11 cursor-pointer items-center gap-2 px-4"},yn={class:"grow text-center font-bold"},wn=e.defineComponent({__name:"ScrollIsland",props:{class:{default:""},title:{default:"Progress"},height:{default:44}},setup(n){e.useCssVars(u=>({v0566c004:a.value}));const t=n,i=e.ref(!1),s=e.useSlots(),o=e.ref(0),r=e.computed(()=>Ce.useColorMode().value=="dark"),l=e.computed(()=>!!s.default),a=e.computed(()=>`${t.height/2}px`);e.onMounted(()=>{window!==void 0&&(window.addEventListener("scroll",c),c())});function c(){o.value=window.scrollY/(document.body.scrollHeight-window.innerHeight)}return e.onUnmounted(()=>{window.removeEventListener("scroll",c)}),(u,d)=>(e.openBlock(),e.createBlock(e.unref(de.MotionConfig),{transition:{duration:.7,type:"spring",bounce:.5}},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(K)("z-[999] -translate-x-1/2 bg-primary/90 backdrop-blur-lg border-radius",u.$props.class)),onClick:d[0]||(d[0]=()=>i.value=!i.value)},[e.createVNode(e.unref(de.motion).div,{id:"motion-id",layout:"",initial:{height:t.height,width:0},animate:{height:i.value&&l.value?"auto":t.height,width:i.value&&l.value?320:260},class:"bg-natural-900 relative cursor-pointer overflow-hidden text-secondary"},{default:e.withCtx(()=>[e.createElementVNode("header",xn,[e.createVNode(vn,{value:o.value*100,min:0,max:100,"circle-stroke-width":10,class:"w-6","show-percentage":!1,duration:.3,"gauge-secondary-color":r.value?"#6b728055":"#6b728099","gauge-primary-color":r.value?"black":"white"},null,8,["value","gauge-secondary-color","gauge-primary-color"]),e.createElementVNode("h5",yn,e.toDisplayString(n.title),1),e.createVNode(e.unref(cs),{value:o.value,format:{style:"percent"},locales:"en-US"},null,8,["value"])]),l.value?(e.openBlock(),e.createBlock(e.unref(de.motion).div,{key:0,class:"mb-2 flex h-full max-h-60 flex-col gap-1 overflow-y-auto px-4 text-sm"},{default:e.withCtx(()=>[e.renderSlot(u.$slots,"default",{},void 0,!0)]),_:3})):e.createCommentVNode("",!0)]),_:3},8,["initial","animate"])],2)]),_:3}))}}),bn=xe(wn,[["__scopeId","data-v-c0fd1974"]]),Cn=["href"],En=e.defineComponent({__name:"index",props:{title:{default:"Scroll Island"},description:{default:"See the scroll island in action on the top of this page"},links:{default:()=>[{text:"# Install using CLI",href:"#install-using-cli"},{text:"# Install Manually",href:"#install-manually"},{text:"# API",href:"#api"},{text:"# Features",href:"#features"},{text:"# Credits",href:"#credits"}]},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=[],o=t.classList?.Location;return o?.position&&s.push(o.position),o?.width&&s.push(o.width),o?.height&&s.push(o.height),o?.left&&s.push(o.left),o?.top&&s.push(o.top),s.join(" ")});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(n.classList?.overallClass||"flex items-center justify-center p-8")},[e.createElementVNode("span",{class:e.normalizeClass(n.classList?.descriptionClass||"text-lg text-primary")},e.toDisplayString(n.description||"See the scroll island in action on the top of this page"),3),e.createVNode(bn,{title:n.title||"Scroll Island",class:e.normalizeClass(i.value)},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.islandClass||"my-3 flex flex-col gap-2")},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.links,(r,l)=>(e.openBlock(),e.createElementBlock("a",{key:l,href:r.href,class:e.normalizeClass(n.classList?.linkClass||"block")},e.toDisplayString(r.text),11,Cn))),128))],2)]),_:1},8,["title","class"])],2))}}),kn=e.defineComponent({__name:"Sparkles",props:{background:{default:"#0d47a1"},particleColor:{default:"#ffffff"},minSize:{default:1},maxSize:{default:3},speed:{default:4},particleDensity:{default:120}},setup(n){const t=n,i=Ce.templateRef("containerRef"),s=Ce.templateRef("canvasRef"),o=e.ref([]),r=e.ref(null);function l(){if(!s.value||!i.value)return;const h=window.devicePixelRatio||1,f=i.value.getBoundingClientRect();s.value.width=f.width*h,s.value.height=f.height*h,r.value&&r.value.scale(h,h)}function a(){const h=[],f=t.particleDensity;for(let x=0;x<f;x++){const w=Math.random()*.3+.7;h.push({x:Math.random()*100,y:Math.random()*100,size:Math.random()*(t.maxSize-t.minSize)+t.minSize,opacity:Math.random()*.5+.3,vx:(Math.random()-.5)*.05*w*t.speed,vy:((Math.random()-.5)*.05-.05*.3)*w*t.speed,phase:Math.random()*Math.PI*2,phaseSpeed:.015})}o.value=h}function c(){if(!r.value||!s.value)return;const h=s.value;r.value.clearRect(0,0,h.width,h.height),o.value=o.value.map(f=>{let x=f.x+f.vx,v=f.y+f.vy;x<-2&&(x=102),x>102&&(x=-2),v<-2&&(v=102),v>102&&(v=-2);const w=(f.phase+f.phaseSpeed)%(Math.PI*2),p=.3+(Math.sin(w)*.3+.3);return r.value.beginPath(),r.value.arc(x*h.width/100,v*h.height/100,f.size,0,Math.PI*2),r.value.fillStyle=`${t.particleColor}${Math.floor(p*255).toString(16).padStart(2,"0")}`,r.value.fill(),{...f,x,y:v,phase:w,opacity:p}})}const{pause:u,resume:d}=Ce.useRafFn(c,{immediate:!1});let m;return e.onMounted(()=>{s.value&&(r.value=s.value.getContext("2d"),l(),a(),m=new ResizeObserver(l),i.value&&m.observe(i.value),d())}),e.onBeforeUnmount(()=>{u(),m&&i.value&&m.unobserve(i.value)}),(h,f)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerRef",ref:i,class:"relative size-full overflow-hidden will-change-transform",style:e.normalizeStyle({background:n.background})},[e.createElementVNode("canvas",{ref_key:"canvasRef",ref:s,class:"absolute inset-0 size-full"},null,512)],4))}}),Sn={class:"relative h-40 w-[40rem]"},_n={__name:"index",props:{title:String,lightParticleColor:String,darkParticleColor:String,classList:Object},setup(n){const t=n;e.ref(0);const i=e.computed(()=>Ce.useColorMode().value==="dark"?t.darkParticleColor:t.lightParticleColor),s=e.computed(()=>{const o=t.classList.Location||{};return[o.position,o.width,o.height,o.left,o.top].filter(Boolean)});return(o,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList.overallClass,s.value])},[e.createElementVNode("h1",{class:e.normalizeClass(n.classList.h1Class)},e.toDisplayString(n.title),3),e.createElementVNode("div",Sn,[r[0]||(r[0]=e.createElementVNode("div",{class:"absolute inset-x-20 top-0 h-[2px] w-3/4 bg-gradient-to-r from-transparent via-indigo-500 to-transparent blur-sm"},null,-1)),r[1]||(r[1]=e.createElementVNode("div",{class:"absolute inset-x-20 top-0 h-px w-3/4 bg-gradient-to-r from-transparent via-indigo-500 to-transparent"},null,-1)),r[2]||(r[2]=e.createElementVNode("div",{class:"absolute inset-x-60 top-0 h-[5px] w-1/4 bg-gradient-to-r from-transparent via-sky-500 to-transparent blur-sm"},null,-1)),r[3]||(r[3]=e.createElementVNode("div",{class:"absolute inset-x-60 top-0 h-px w-1/4 bg-gradient-to-r from-transparent via-sky-500 to-transparent"},null,-1)),e.createVNode(kn,{background:"transparent","min-size":.4,"max-size":1.4,"particle-density":1200,class:"size-full","particle-color":i.value},null,8,["particle-color"]),e.createElementVNode("div",{class:e.normalizeClass(n.classList.SparklesClass)},null,2)])],2))}},Tn=xe(_n,[["__scopeId","data-v-f5700567"]]),Mn={class:"relative inline-block"},Bn=["fill"],Dn=e.defineComponent({__name:"SparklesText",props:{text:{},sparklesCount:{default:10},colors:{default:()=>({first:"#9E7AFF",second:"#FE8BBB"})},class:{}},setup(n){const t=n,i=e.ref([]);function s(){const a=`${Math.random()*100}%`,c=`${Math.random()*100}%`,u=Math.random()>.5?t.colors.first:t.colors.second,d=Math.random()*2,m=Math.random()*1+.3,h=Math.random()*10+5;return{id:`${a}-${c}-${Date.now()}`,x:a,y:c,color:u,delay:d,scale:m,lifespan:h}}function o(){i.value=Array.from({length:t.sparklesCount},s)}function r(){i.value=i.value.map(a=>a.lifespan<=0?s():{...a,lifespan:a.lifespan-.1})}let l;return e.onMounted(()=>{o(),l=window.setInterval(r,100)}),e.onUnmounted(()=>{l&&clearInterval(l)}),(a,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(t.class)},[e.createElementVNode("span",Mn,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.value,u=>(e.openBlock(),e.createBlock(e.unref(de.Motion),{key:u.id,initial:{opacity:0,scale:0,rotate:75},animate:{opacity:[0,1,0],scale:[0,u.scale,0],rotate:[75,120,150]},transition:{duration:.8,repeat:1/0,delay:u.delay},as:"svg",class:"pointer-events-none absolute z-20",style:e.normalizeStyle({left:u.x,top:u.y,opacity:0}),width:"21",height:"21",viewBox:"0 0 21 21"},{default:e.withCtx(()=>[e.createElementVNode("path",{d:"M9.82531 0.843845C10.0553 0.215178 10.9446 0.215178 11.1746 0.843845L11.8618 2.72026C12.4006 4.19229 12.3916 6.39157 13.5 7.5C14.6084 8.60843 16.8077 8.59935 18.2797 9.13822L20.1561 9.82534C20.7858 10.0553 20.7858 10.9447 20.1561 11.1747L18.2797 11.8618C16.8077 12.4007 14.6084 12.3916 13.5 13.5C12.3916 14.6084 12.4006 16.8077 11.8618 18.2798L11.1746 20.1562C10.9446 20.7858 10.0553 20.7858 9.82531 20.1562L9.13819 18.2798C8.59932 16.8077 8.60843 14.6084 7.5 13.5C6.39157 12.3916 4.19225 12.4007 2.72023 11.8618L0.843814 11.1747C0.215148 10.9447 0.215148 10.0553 0.843814 9.82534L2.72023 9.13822C4.19225 8.59935 6.39157 8.60843 7.5 7.5C8.60843 6.39157 8.59932 4.19229 9.13819 2.72026L9.82531 0.843845Z",fill:u.color},null,8,Bn)]),_:2},1032,["animate","transition","style"]))),128)),e.createTextVNode(" "+e.toDisplayString(n.text),1)])],2))}}),Rn={__name:"index",props:{classList:Object,title:String,colors:{type:Object,default:()=>({first:"#9E7AFF",second:"#FE8BBB"})},sparklesCount:Number},setup(n){const t=n,i=e.computed(()=>{const s=t.classList.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList.overallClass,i.value])},[e.createVNode(Dn,{text:n.title,colors:{first:`${n.colors.first}`,second:`${n.colors.second}`},"sparkles-count":n.sparklesCount,class:e.normalizeClass(n.classList.textClass)},null,8,["text","colors","sparkles-count","class"])],2))}},In=xe(Rn,[["__scopeId","data-v-f74320d4"]]),Ln=e.defineComponent({__name:"ParentSize",props:{class:String,debounceTime:{type:Number,default:300},ignoreDimensions:{type:[Array,String],default:()=>[]},parentSizeStyles:Object,enableDebounceLeadingCall:{type:Boolean,default:!0}},setup(n){const t=n,i=e.useAttrs(),s=e.ref(null),o=e.reactive({width:0,height:0,top:0,left:0}),r=e.computed(()=>({...t.parentSizeStyles,...i.style}));e.computed(()=>["w-full h-full",t.class]);const l=e.computed(()=>{const{class:d,style:m,...h}=i;return h}),a=e.computed(()=>Array.isArray(t.ignoreDimensions)?t.ignoreDimensions:[t.ignoreDimensions]);function c(d){const{width:m,height:h,top:f,left:x}=d,v={width:m,height:h,top:f,left:x};if(!Object.keys(v).some(_=>o[_]!==v[_]))return;!Object.keys(v).every(_=>a.value.includes(_))&&Object.assign(o,v)}const u=Ce.useDebounceFn(c,t.debounceTime);return Ce.useResizeObserver(s,d=>{const m=d[0];m&&u(m.contentRect)}),(d,m)=>(e.openBlock(),e.createElementBlock("div",e.mergeProps({ref_key:"target",ref:s,style:r.value,class:e.unref(K)("w-full h-full",t.class)},l.value),[e.renderSlot(d.$slots,"default")],16))}}),zn=e.defineComponent({__name:"Spline",props:{scene:{type:String,required:!0},onLoad:Function,renderOnDemand:{type:Boolean,default:!0},style:Object},emits:["error","spline-mouse-down","spline-mouse-up","spline-mouse-hover","spline-key-down","spline-key-up","spline-start","spline-look-at","spline-follow","spline-scroll"],setup(n,{emit:t}){const i=n,s=t,o=e.ref(null),r=e.ref(!1),l=e.ref(null),a=e.ref(!0);let c=()=>{};const u=e.computed(()=>({overflow:"hidden",...i.style})),d=e.computed(()=>({display:"block",width:"100%",height:"100%"})),{stop:m}=Ce.useIntersectionObserver(o,([{isIntersecting:v}])=>{a.value=v,v&&l.value&&e.nextTick(()=>{o.value&&l.value&&(l.value.requestRender(),l.value.setSize(o.value.clientWidth,o.value.clientHeight))})},{threshold:.1});function h(v,w){if(!w||!l.value)return;const p=Ce.useDebounceFn(w,50,{maxWait:100});return l.value.addEventListener(v,p),()=>l.value?.removeEventListener(v,p)}async function f(){if(o.value){r.value=!0;try{l.value&&(l.value.dispose(),l.value=null),l.value=new us.Application(o.value,{renderOnDemand:i.renderOnDemand}),await l.value.load(i.scene);const v=[h("mouseDown",w=>s("spline-mouse-down",w)),h("mouseUp",w=>s("spline-mouse-up",w)),h("mouseHover",w=>s("spline-mouse-hover",w)),h("keyDown",w=>s("spline-key-down",w)),h("keyUp",w=>s("spline-key-up",w)),h("start",w=>s("spline-start",w)),h("lookAt",w=>s("spline-look-at",w)),h("follow",w=>s("spline-follow",w)),h("scroll",w=>s("spline-scroll",w))].filter(Boolean);return r.value=!1,i.onLoad?.(l.value),()=>{v.forEach(w=>w?.())}}catch(v){return console.error("Spline initialization error:",v),s("error",v),r.value=!1,()=>{}}}}async function x(){c(),c=await f()??(()=>{})}return e.onMounted(async()=>{await x(),e.watch(a,v=>{v&&x()})}),e.onUnmounted(()=>{m(),l.value&&(l.value.dispose(),l.value=null)}),(v,w)=>(e.openBlock(),e.createBlock(Ln,e.mergeProps({"parent-size-styles":u.value,"debounce-time":50},v.$attrs),{default:e.withCtx(()=>[e.createElementVNode("canvas",{ref_key:"canvasRef",ref:o,style:e.normalizeStyle(d.value)},null,4),r.value?e.renderSlot(v.$slots,"default",{key:0}):e.createCommentVNode("",!0)]),_:3},16,["parent-size-styles"]))}}),An={class:"flex"},Pn=e.defineComponent({__name:"index",props:{sceneUrl:{default:"https://prod.spline.design/kZDDjO5HuC9GJUM2/scene.splinecode"},title:{default:"Inspira UI"},subtitle:{default:"Build spline animations with style."},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top,s.zIndex].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass||"relative w-full overflow-hidden rounded-lg bg-black/[0.96]",i.value])},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.textContainerClass||"absolute flex w-full flex-col items-center justify-center gap-2 p-8 text-center font-heading text-white")},[e.createElementVNode("span",{class:e.normalizeClass(n.classList?.titleClass||"text-4xl font-semibold")},e.toDisplayString(n.title),3),e.createElementVNode("span",{class:e.normalizeClass(n.classList?.subtitleClass||"font-sans font-light")},e.toDisplayString(n.subtitle),3)],2),e.createElementVNode("div",An,[e.createVNode(zn,{scene:n.sceneUrl,class:e.normalizeClass(n.classList?.splineClass||"mt-24 size-full")},null,8,["scene","class"])])],2))}}),Nn=["src","alt"],Vn=e.defineComponent({__name:"Stack",props:{className:{},randomRotation:{type:Boolean,default:!1},sensitivity:{default:200},cardDimensions:{default:()=>({width:208,height:208})},cardsData:{default:()=>[]},animationConfig:{default:()=>({stiffness:260,damping:20})},sendToBackOnClick:{type:Boolean,default:!1}},setup(n){const t=n,i=e.ref(t.cardsData.length?t.cardsData:[{id:1,img:"https://images.unsplash.com/photo-1480074568708-e7b720bb3f09?q=80&w=500&auto=format"},{id:2,img:"https://images.unsplash.com/photo-1449844908441-8829872d2607?q=80&w=500&auto=format"},{id:3,img:"https://images.unsplash.com/photo-1452626212852-811d58933cae?q=80&w=500&auto=format"},{id:4,img:"https://images.unsplash.com/photo-1572120360610-d971b9d7767c?q=80&w=500&auto=format"}]),s=new Map;function o(){const c=de.useMotionValue(0),u=de.useMotionValue(0),d=de.useTransform(u,[-100,100],[60,-60]),m=de.useTransform(c,[-100,100],[-60,60]);return{x:c,y:u,rotateX:d,rotateY:m,reset(){c.set(0),u.set(0)}}}e.onBeforeMount(()=>{i.value.forEach(c=>{s.has(c.id)||s.set(c.id,o())})});function r(c){let u=s.get(c);return u||(u=o(),s.set(c,u)),u}function l(c,u,d){Math.abs(u.offset.x)>t.sensitivity||Math.abs(u.offset.y)>t.sensitivity?a(d):r(d).reset()}const a=c=>{const u=[...i.value],d=u.findIndex(h=>h.id===c),[m]=u.splice(d,1);u.unshift(m),i.value=u};return(c,u)=>(e.openBlock(),e.createElementBlock("div",{class:"relative",style:e.normalizeStyle({width:n.cardDimensions.width+"px",height:n.cardDimensions.height+"px",perspective:600})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.value,(d,m)=>(e.openBlock(),e.createBlock(e.unref(de.Motion),{key:d.id,as:"div",class:"absolute cursor-grab",style:e.normalizeStyle({x:e.unref(s).get(d.id)?.x,y:e.unref(s).get(d.id)?.y,rotateX:e.unref(s).get(d.id)?.rotateX,rotateY:e.unref(s).get(d.id)?.rotateY}),drag:"","drag-constraints":{top:0,right:0,bottom:0,left:0},dragElastic:.6,whileTap:{cursor:"grabbing",scale:1.02},onDragEnd:(h,f)=>l(h,f,d.id)},{default:e.withCtx(()=>[e.createVNode(e.unref(de.Motion),{as:"div",class:"rounded-2xl overflow-hidden border-4 border-white",onClick:h=>n.sendToBackOnClick&&a(d.id),animate:{rotateZ:(i.value.length-m-1)*4+(n.randomRotation?Math.random()*10-5:0),scale:1+m*.06-i.value.length*.06,transformOrigin:"90% 90%"},initial:!1,transition:{type:"spring",stiffness:n.animationConfig.stiffness,damping:n.animationConfig.damping},style:e.normalizeStyle({width:n.cardDimensions.width+"px",height:n.cardDimensions.height+"px"})},{default:e.withCtx(()=>[e.createElementVNode("img",{src:d.img,alt:`card-${d.id}`,className:"w-full h-full object-cover pointer-events-none"},null,8,Nn)]),_:2},1032,["onClick","animate","transition","style"])]),_:2},1032,["style","onDragEnd"]))),128))],4))}}),Fn=e.defineComponent({__name:"index",props:{cardsData:{default:()=>[{id:1,img:"https://images.unsplash.com/photo-1480074568708-e7b720bb3f09?q=80&w=500&auto=format"},{id:2,img:"https://images.unsplash.com/photo-1449844908441-8829872d2607?q=80&w=500&auto=format"},{id:3,img:"https://images.unsplash.com/photo-1452626212852-811d58933cae?q=80&w=500&auto=format"},{id:4,img:"https://images.unsplash.com/photo-1572120360610-d971b9d7767c?q=80&w=500&auto=format"}]},cardDimensions:{default:()=>({width:200,height:200})},randomRotation:{type:Boolean,default:!0},sensitivity:{default:180},animationConfig:{default:()=>({stiffness:260,damping:20})},sendToBackOnClick:{type:Boolean,default:!1},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location,o=[];return t.classList?.overallClass&&o.push(t.classList.overallClass),s?.width&&o.push(s.width),s?.height&&o.push(s.height),s?.position&&o.push(s.position),s?.left&&o.push(s.left),s?.top&&o.push(s.top),o.join(" ")||"w-full h-[500px]"});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(i.value)},[e.createVNode(Vn,{randomRotation:n.randomRotation,sensitivity:n.sensitivity,sendToBackOnClick:n.sendToBackOnClick,cardDimensions:n.cardDimensions,cardsData:n.cardsData,animationConfig:n.animationConfig},null,8,["randomRotation","sensitivity","sendToBackOnClick","cardDimensions","cardsData","animationConfig"])],2))}}),On=e.defineComponent({__name:"TargetCursor",props:{targetSelector:{default:".cursor-target"},spinDuration:{default:2},hideDefaultCursor:{type:Boolean,default:!0},cursorClass:{default:""}},setup(n){const t=n,i=e.useTemplateRef("cursorRef"),s=e.ref(null),o=e.ref(null),r={borderWidth:3,cornerSize:12,parallaxStrength:5e-5},l=(u,d)=>{i.value&&he.gsap.to(i.value,{x:u,y:d,duration:.1,ease:"power3.out"})};let a=()=>{};const c=()=>{if(!i.value)return;const u=document.body.style.cursor;t.hideDefaultCursor&&(document.body.style.cursor="none");const d=i.value;s.value=d.querySelectorAll(".target-cursor-corner");let m=null,h=null,f=null,x=!1,v=null;const w=b=>{h&&b.removeEventListener("mousemove",h),f&&b.removeEventListener("mouseleave",f),h=null,f=null};he.gsap.set(d,{xPercent:-50,yPercent:-50,x:window.innerWidth/2,y:window.innerHeight/2,opacity:1,display:"block"}),(()=>{o.value&&o.value.kill(),o.value=he.gsap.timeline({repeat:-1}).to(d,{rotation:"+=360",duration:t.spinDuration,ease:"none"})})();const _=b=>l(b.clientX,b.clientY);window.addEventListener("mousemove",_);const k=b=>{const I=b.target,U=[];let H=I;for(;H&&H!==document.body;)H.matches(t.targetSelector)&&U.push(H),H=H.parentElement;const E=U[0]||null;if(!E||!i.value||!s.value||m===E)return;m&&w(m),v&&(clearTimeout(v),v=null),m=E,Array.from(s.value).forEach(N=>{he.gsap.killTweensOf(N)}),he.gsap.killTweensOf(i.value,"rotation"),o.value?.pause(),he.gsap.set(i.value,{rotation:0});const S=(N,V)=>{const A=E.getBoundingClientRect(),J=i.value.getBoundingClientRect(),y=J.left+J.width/2,R=J.top+J.height/2,[G,le,q,Y]=Array.from(s.value),{borderWidth:se,cornerSize:ie,parallaxStrength:ce}=r,fe={x:A.left-y-se,y:A.top-R-se},we={x:A.right-y+se-ie,y:A.top-R-se},be={x:A.right-y+se-ie,y:A.bottom-R+se-ie},Ee={x:A.left-y-se,y:A.bottom-R+se-ie};if(N!==void 0&&V!==void 0){const $=A.left+A.width/2,j=A.top+A.height/2,te=(N-$)*ce,W=(V-j)*ce;fe.x+=te,fe.y+=W,we.x+=te,we.y+=W,be.x+=te,be.y+=W,Ee.x+=te,Ee.y+=W}const De=he.gsap.timeline(),Fe=[G,le,q,Y],z=[fe,we,be,Ee];Fe.forEach(($,j)=>{De.to($,{x:z[j].x,y:z[j].y,duration:.2,ease:"power2.out"},0)})};x=!0,S(),setTimeout(()=>{x=!1},1);let D=null;const B=N=>{D||x||(D=requestAnimationFrame(()=>{const V=N;S(V.clientX,V.clientY),D=null}))},L=()=>{if(m=null,x=!1,s.value){const N=Array.from(s.value);he.gsap.killTweensOf(N);const{cornerSize:V}=r,A=[{x:-V*1.5,y:-V*1.5},{x:V*.5,y:-V*1.5},{x:V*.5,y:V*.5},{x:-V*1.5,y:V*.5}],J=he.gsap.timeline();N.forEach((y,R)=>{J.to(y,{x:A[R].x,y:A[R].y,duration:.3,ease:"power3.out"},0)})}v=setTimeout(()=>{if(!m&&i.value&&o.value){const V=he.gsap.getProperty(i.value,"rotation")%360;o.value.kill(),o.value=he.gsap.timeline({repeat:-1}).to(i.value,{rotation:"+=360",duration:t.spinDuration,ease:"none"}),he.gsap.to(i.value,{rotation:V+360,duration:t.spinDuration*(1-V/360),ease:"none",onComplete:()=>{o.value?.restart()}})}v=null},50),w(E)};h=B,f=L,E.addEventListener("mousemove",B),E.addEventListener("mouseleave",L)};window.addEventListener("mouseover",k,{passive:!0}),a=()=>{window.removeEventListener("mousemove",_),window.removeEventListener("mouseover",k),m&&w(m),v&&(clearTimeout(v),v=null),o.value?.kill(),o.value=null,i.value&&he.gsap.killTweensOf(i.value),s.value&&he.gsap.killTweensOf(Array.from(s.value)),i.value&&he.gsap.set(i.value,{x:0,y:0,rotation:0,opacity:0,display:"none"}),document.body.style.cursor=u,m=null}};return e.onMounted(()=>{c()}),e.onBeforeUnmount(()=>{a()}),e.watch(()=>[t.targetSelector,t.spinDuration,t.hideDefaultCursor],()=>{a(),c()}),e.watch(()=>t.spinDuration,()=>{!i.value||!o.value||o.value.isActive()&&(o.value.kill(),o.value=he.gsap.timeline({repeat:-1}).to(i.value,{rotation:"+=360",duration:t.spinDuration,ease:"none"}))},{immediate:!0}),(u,d)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"cursorRef",ref:i,class:e.normalizeClass(["top-0 left-0 z-[9999] fixed w-0 h-0 -translate-x-1/2 -translate-y-1/2 pointer-events-none mix-blend-difference transform opacity-0",t.cursorClass]),style:{willChange:"transform"}},[...d[0]||(d[0]=[e.createStaticVNode('<div class="top-1/2 left-1/2 absolute bg-white rounded-full w-1 h-1 -translate-x-1/2 -translate-y-1/2 transform" style="will-change:transform;"></div><div class="top-1/2 left-1/2 absolute border-[3px] border-white border-r-0 border-b-0 w-3 h-3 -translate-x-[150%] -translate-y-[150%] target-cursor-corner transform" style="will-change:transform;"></div><div class="top-1/2 left-1/2 absolute border-[3px] border-white border-b-0 border-l-0 w-3 h-3 -translate-y-[150%] translate-x-1/2 target-cursor-corner transform" style="will-change:transform;"></div><div class="top-1/2 left-1/2 absolute border-[3px] border-white border-t-0 border-l-0 w-3 h-3 translate-x-1/2 translate-y-1/2 target-cursor-corner transform" style="will-change:transform;"></div><div class="top-1/2 left-1/2 absolute border-[3px] border-white border-t-0 border-r-0 w-3 h-3 -translate-x-[150%] translate-y-1/2 target-cursor-corner transform" style="will-change:transform;"></div>',5)])],2))}}),Un=e.defineComponent({__name:"index",props:{targetSelector:{default:".cursor-target"},spinDuration:{default:2},hideDefaultCursor:{type:Boolean,default:!0},showDemoContent:{type:Boolean,default:!1},demoItems:{default:void 0},classList:{default:()=>({})}},setup(n){const t=n,i=[{text:"THIS"},{text:"FEELS"},{text:"QUITE"},{text:"SNAPPY!",containerClass:"col-span-3"}],s=e.computed(()=>t.demoItems&&Array.isArray(t.demoItems)&&t.demoItems.length>0?t.demoItems:i),o=e.computed(()=>{const a=t.classList?.Location||{};return[a.position,a.width,a.height,a.left,a.top,a.zIndex].filter(Boolean)}),r=a=>[t.classList?.defaultItemContainerClass||"",a.containerClass].filter(Boolean).join(" "),l=a=>[t.classList?.defaultItemTextClass||"px-6 py-2 border border-[#aeffc5] border-dashed rounded-[15px] font-black text-[#aeffc5] text-[2rem] text-center cursor-target",a.textClass].filter(Boolean).join(" ");return(a,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass,o.value])},[e.createVNode(On,{"target-selector":n.targetSelector||".cursor-target","spin-duration":n.spinDuration||2,"hide-default-cursor":n.hideDefaultCursor!==void 0?n.hideDefaultCursor:!0,"cursor-class":n.classList?.cursorClass},null,8,["target-selector","spin-duration","hide-default-cursor","cursor-class"]),n.showDemoContent&&s.value.length>0?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(n.classList?.demoContainerClass||"gap-4 grid grid-cols-3 mb-2")},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,(u,d)=>(e.openBlock(),e.createElementBlock("div",{key:d,class:e.normalizeClass(r(u))},[e.createElementVNode("p",{class:e.normalizeClass(l(u))},e.toDisplayString(u.text),3)],2))),128))],2)):e.createCommentVNode("",!0)],2))}}),$n={class:"mx-auto w-full max-w-3xl text-center"},Hn={class:"relative h-32"},Gn={class:"pointer-events-none absolute left-1/2 top-0 size-[480px] -translate-x-1/2 before:absolute before:inset-0 before:-z-10 before:rounded-full before:bg-gradient-to-b before:from-zinc-500/25 before:via-zinc-500/5 before:via-25% before:to-zinc-500/0 before:to-75%"},Yn={class:"h-32 [mask-image:_linear-gradient(0deg,transparent,theme(colors.white)_20%,theme(colors.white))]"},jn=["src","alt"],Wn={class:"mb-8 transition-all delay-300 duration-150 ease-in-out"},Xn={class:"text-2xl font-bold text-zinc-900 before:content-['\\201C'] after:content-['\\201D'] dark:text-zinc-100"},qn={class:"mt-4 flex w-full items-center justify-between gap-4 pt-12 md:pt-0"},Zn={class:"flex flex-col items-center gap-1"},Kn={class:"text-base italic"},Jn={class:"text-sm italic"},Qn=e.defineComponent({__name:"TestimonialSlider",props:{testimonials:{default:()=>[]},autoRotate:{type:Boolean,default:!0},duration:{default:5}},setup(n){const t=n,i=e.ref(0),s=e.ref(t.autoRotate),o=e.ref(null);let r=null;function l(){o.value&&o.value.parentElement&&(o.value.parentElement.style.height=`${o.value.clientHeight}px`)}function a(h){i.value=h,s.value=!1,u()}function c(){r=window.setInterval(()=>{i.value=i.value+1===t.testimonials.length?0:i.value+1,l()},t.duration*1e3)}function u(){r&&clearInterval(r),s.value&&c()}function d(){a((i.value+1)%t.testimonials.length)}function m(){a((i.value-1+t.testimonials.length)%t.testimonials.length)}return e.onMounted(()=>{l(),s.value&&c()}),e.onUnmounted(()=>{r&&clearInterval(r)}),(h,f)=>(e.openBlock(),e.createElementBlock("div",$n,[e.createElementVNode("div",Hn,[e.createElementVNode("div",Gn,[e.createElementVNode("div",Yn,[e.createVNode(e.TransitionGroup,{name:"testimonial-image"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.testimonials,(x,v)=>e.withDirectives((e.openBlock(),e.createElementBlock("div",{key:`image-${v}`,class:"absolute inset-0 -z-10 flex h-full flex-col"},[e.createElementVNode("img",{class:"relative left-1/2 top-11 -translate-x-1/2 rounded-full",src:x.img,width:"60",height:"60",alt:x.name},null,8,jn)])),[[e.vShow,i.value===v]])),128))]),_:1})])])]),e.createElementVNode("div",Wn,[e.createElementVNode("div",{ref_key:"testimonialsRef",ref:o,class:"relative flex flex-col"},[e.createVNode(e.TransitionGroup,{name:"testimonial-text"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.testimonials,(x,v)=>e.withDirectives((e.openBlock(),e.createElementBlock("div",{key:`text-${v}`,class:"w-full"},[e.createElementVNode("div",Xn,e.toDisplayString(x.quote),1)])),[[e.vShow,i.value===v]])),128))]),_:1})],512)]),e.createElementVNode("div",qn,[e.createElementVNode("button",{class:"group/button flex size-7 items-center justify-center rounded-full bg-gray-100 dark:bg-neutral-800",onClick:m},[e.createVNode(e.unref(at.ArrowLeft),{name:"lucide:arrow-left",class:"size-5 text-black transition-transform duration-300 group-hover/button:rotate-12 dark:text-neutral-400"})]),e.createElementVNode("div",Zn,[e.createElementVNode("span",Kn,e.toDisplayString(n.testimonials.at(i.value)?.name),1),e.createElementVNode("span",Jn,e.toDisplayString(n.testimonials.at(i.value)?.role),1)]),e.createElementVNode("button",{class:"group/button flex size-7 items-center justify-center rounded-full bg-gray-100 dark:bg-neutral-800",onClick:d},[e.createVNode(e.unref(at.ArrowRight),{name:"lucide:arrow-right",class:"size-5 text-black transition-transform duration-300 group-hover/button:-rotate-12 dark:text-neutral-400"})])])]))}}),ea=e.defineComponent({__name:"index",props:{testimonials:{default:()=>[{img:"https://randomuser.me/api/portraits/men/1.jpg",quote:"Inspira UI is sleeker than my star cruiser. Launch-ready in seconds. Zero crashes, zero gravity.",name:"Buzz Lightyear",role:"Intergalactic Interface Command"},{img:"https://randomuser.me/api/portraits/women/2.jpg",quote:"Clickin' around this thing feels like ridin' a horse with turbo boosters. Inspira's got giddyup!",name:"Jessie",role:"Yeehaw Engagement & Barnyard UX"},{img:"https://randomuser.me/api/portraits/men/3.jpg",quote:"I've seen some clunky UIs in my day... but this one? Smoother than a tumbleweed on Tuesday.",name:"Woody",role:"Sheriff"},{img:"https://randomuser.me/api/portraits/men/4.jpg",quote:"I was terrified. Then I clicked. Nothing exploded. Inspira UI is a safe space. I'm thriving.",name:"Rex",role:"Senior Panic Tester, Dinosaur Usability Lab"}]},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass||"relative h-[500px] w-full overflow-hidden rounded-lg border bg-background",i.value])},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.sliderClass||"mt-[64px] flex justify-center px-12")},[e.createVNode(Qn,{testimonials:n.testimonials},null,8,["testimonials"])],2)],2))}}),ta=e.defineComponent({__name:"Text3d",props:{textColor:{default:"white"},letterSpacing:{default:-.1},strokeColor:{default:"black"},shadowColor:{default:"yellow"},strokeSize:{default:20},shadow1Size:{default:7},shadow2Size:{default:10},class:{},animate:{type:Boolean,default:!0},animationDuration:{default:1500}},setup(n){e.useCssVars(a=>({v737795be:i.value,a152ef28:s.value,v50ecc536:a.strokeColor,v03dc9f8e:o.value,db53c18c:r.value,v07302b7d:a.shadowColor,v7e1d6e10:a.textColor,v3afa6846:l.value}));const t=n,i=e.computed(()=>`${t.letterSpacing}ch`),s=e.computed(()=>`${t.strokeSize}px`),o=e.computed(()=>`${t.shadow1Size}px`),r=e.computed(()=>`${t.shadow2Size}px`),l=e.computed(()=>`${t.animationDuration}ms`);return(a,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("text-3d flex items-center justify-center",n.animate?"animate-text-3d":"",t.class))},[e.renderSlot(a.$slots,"default",{},void 0,!0)],2))}}),sa=xe(ta,[["__scopeId","data-v-8d20718d"]]),ia=e.defineComponent({__name:"index",props:{texts:{default:()=>[{text:"3D",shadowColor:"red",animate:!0,class:"text-8xl font-bold max-md:text-7xl"},{text:"IS",shadowColor:"skyblue",animate:!1,class:"text-8xl font-black max-md:text-7xl"},{text:"AWESOME",shadowColor:"",animate:!0,class:"text-8xl font-bold max-md:text-7xl"}]},classList:{default:()=>({})}},setup(n){return(t,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(n.classList?.overallClass||"flex flex-col items-center justify-center overflow-hidden bg-black px-4 py-16 font-heading")},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.texts,(s,o)=>(e.openBlock(),e.createBlock(sa,{key:o,class:e.normalizeClass(s.class||"text-8xl font-bold max-md:text-7xl"),"shadow-color":s.shadowColor,animate:s.animate},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(s.text),1)]),_:2},1032,["class","shadow-color","animate"]))),128))],2))}}),oa=e.defineComponent({__name:"TextGenerateEffect",props:{words:{},filter:{type:Boolean,default:!0},duration:{default:.7},delay:{default:0},class:{}},setup(n){const t=n,i=e.ref(null),s=e.computed(()=>t.words.split(" ")),o=e.computed(()=>({opacity:0,filter:t.filter?"blur(10px)":"none",transition:`opacity ${t.duration}s, filter ${t.duration}s`}));return e.onMounted(()=>{if(i.value){const r=i.value.querySelectorAll("span");setTimeout(()=>{r.forEach((l,a)=>{setTimeout(()=>{l.style.opacity="1",l.style.filter=t.filter?"blur(0px)":"none"},a*200)})},t.delay)}}),(r,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(K)("leading-snug tracking-wide",t.class))},[e.createElementVNode("div",{ref_key:"scope",ref:i},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,(a,c)=>(e.openBlock(),e.createElementBlock("span",{key:a+c,class:"inline-block",style:e.normalizeStyle(o.value)},e.toDisplayString(a)+"ย ",5))),128))],512)],2))}}),na=e.defineComponent({__name:"index",props:{words:{default:"Nuxt is an open source framework that makes web development intuitive and powerful.Create performant and production-grade full-stack web apps and websites with confidence."},classList:{default:()=>({})}},setup(n){return(t,i)=>{const s=e.resolveComponent("ClientOnly");return e.openBlock(),e.createBlock(s,null,{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.overallClass||"flex h-64 items-center justify-center max-lg:w-full min-md:flex-1")},[e.createVNode(oa,{words:n.words,class:e.normalizeClass(n.classList?.textClass||"text-2xl font-bold")},null,8,["words","class"])],2)]),_:1})}}}),aa={class:"mx-auto max-w-7xl px-4 py-20 lg:px-10 md:px-8"},ra={class:"mb-4 max-w-4xl text-lg text-black md:text-4xl dark:text-white"},la={class:"max-w-sm text-sm text-neutral-700 md:text-base dark:text-neutral-300"},ca={class:"sticky top-40 z-40 flex max-w-xs flex-col items-center self-start lg:max-w-sm md:w-full md:flex-row"},ua={class:"hidden text-xl font-bold text-neutral-500 md:block md:pl-20 md:text-5xl dark:text-neutral-500"},da=e.defineComponent({__name:"Timeline",props:{containerClass:{},class:{},items:{default:()=>[]},title:{},description:{}},setup(n){const t=n,i=e.ref(null),s=e.ref(null),o=e.ref(0);e.onMounted(async()=>{if(await e.nextTick(),s.value){const c=s.value.getBoundingClientRect();o.value=c.height}});const{scrollYProgress:r}=de.useScroll({target:s,offset:["start 10%","end 50%"]}),l=de.useTransform(r,[0,.1],[0,1]);let a=de.useTransform(r,[0,1],[0,o.value]);return e.watch(o,c=>{a=de.useTransform(r,[0,1],[0,c])}),(c,u)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"timelineContainerRef",ref:i,class:"w-full bg-white font-sans md:px-10 dark:bg-neutral-950"},[e.createElementVNode("div",aa,[e.createElementVNode("h2",ra,e.toDisplayString(n.title),1),e.createElementVNode("p",la,e.toDisplayString(n.description),1)]),e.createElementVNode("div",{ref_key:"timelineRef",ref:s,class:"relative z-0 mx-auto max-w-7xl pb-20"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,(d,m)=>(e.openBlock(),e.createElementBlock("div",{key:d.id+m,class:"flex justify-start pt-10 md:gap-10 md:pt-40"},[e.createElementVNode("div",ca,[u[0]||(u[0]=e.createElementVNode("div",{class:"absolute left-3 flex size-10 items-center justify-center rounded-full bg-white md:left-3 dark:bg-black"},[e.createElementVNode("div",{class:"size-4 rounded-full border border-neutral-300 bg-neutral-200 p-2 dark:border-neutral-700 dark:bg-neutral-800"})],-1)),e.createElementVNode("h3",ua,e.toDisplayString(d.label),1)]),e.renderSlot(c.$slots,d.id)]))),128)),e.createElementVNode("div",{style:e.normalizeStyle({height:o.value+"px"}),class:"absolute left-8 top-0 w-[2px] overflow-hidden bg-[linear-gradient(to_bottom,var(--tw-gradient-stops))] from-transparent from-0% via-neutral-200 to-transparent to-[99%] [mask-image:linear-gradient(to_bottom,transparent_0%,black_10%,black_90%,transparent_100%)] md:left-8 dark:via-neutral-700"},[e.createVNode(e.unref(de.Motion),{as:"div",style:e.normalizeStyle({height:e.unref(a),opacity:e.unref(l)}),class:"absolute inset-x-0 top-0 w-[2px] rounded-full bg-gradient-to-t from-purple-500 from-0% via-blue-500 via-10% to-transparent"},null,8,["style"])],4)],512)],512))}}),ha=e.defineComponent({__name:"index",props:{data:{default:()=>[{id:"version1.0",label:"Version 1.0"},{id:"version2.0",label:"Version 2.0"},{id:"version3.0",label:"Version 3.0"},{id:"version4.0",label:"Version 4.0"},{id:"version5.0",label:"Version 5.0"},{id:"version6.0",label:"Version 6.0"}]},title:{default:"Beam me up"},description:{default:"Show the timeline in style"},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([i.value])},[e.createVNode(da,{items:n.data,title:n.title,description:n.description},e.createSlots({_:2},[e.renderList(n.data,(r,l)=>({name:r.id,fn:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.sectionClass||"relative w-full pl-20 pr-4 md:pl-4")},[e.createElementVNode("h3",{class:e.normalizeClass(n.classList?.titleClass||"mb-4 block text-left text-2xl font-bold text-neutral-500 dark:text-neutral-500")},e.toDisplayString(`Section ${l+1}`),3)],2),e.createElementVNode("p",{class:e.normalizeClass(n.classList?.descriptionClass||"mb-8 text-xs font-normal text-neutral-800 md:text-sm dark:text-neutral-200")},e.toDisplayString(n.description||"Inspira UI gives you the freedom to design awesome website, in less time."),3)])}))]),1032,["items","title","description"])],2))}}),ma={class:"absolute -left-4 top-3 md:-left-12"},fa=["viewBox","height"],pa=["d"],ga=["d"],va=["y1","y2"],xa=e.defineComponent({__name:"TracingBeam",props:{class:String},setup(n){const t=e.ref(),i=e.ref(),s=e.ref(0),o=e.ref(0),r=e.ref(0),l=e.computed(()=>m(s.value,0,.8,s.value,o.value)*(1.4-r.value)),a=e.computed(()=>m(s.value,0,1,s.value,o.value-500)*(1.4-r.value)),c=e.ref({y1:l.value,y2:a.value});e.watch(l,h=>{c.value.y1=h}),e.watch(a,h=>{c.value.y2=h});function u(){if(t.value){const h=t.value.getBoundingClientRect(),f=window.innerHeight,x=h.height;r.value=(f-h.top)/(f+x),s.value=h.y/f*-1}}e.onMounted(()=>{window.addEventListener("scroll",u),window.addEventListener("resize",u),u(),new ResizeObserver(function(){d()}).observe(i.value),d()}),e.onUnmounted(()=>{t.value?.removeEventListener("scroll",u),window.removeEventListener("resize",u)});function d(){i.value&&(o.value=i.value.offsetHeight)}function m(h,f,x,v,w){return(h-f)*(w-v)/(x-f)+v}return(h,f)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"tracingBeamRef",ref:t,class:e.normalizeClass(e.unref(K)("relative w-full max-w-4xl mx-auto h-full",h.$props.class))},[e.createElementVNode("div",ma,[e.createElementVNode("div",{style:e.normalizeStyle({boxShadow:s.value>0?"none":"rgba(0, 0, 0, 0.24) 0px 3px 8px"}),class:"border-netural-200 ml-[27px] flex size-4 items-center justify-center rounded-full border shadow-sm"},[e.createVNode(e.unref(de.Motion),{animate:{backgroundColor:s.value>0?"white":"var(--emerald-500)",borderColor:s.value>0?"white":"var(--emerald-600)"},class:"size-2 rounded-full border border-neutral-300 bg-white"},null,8,["animate"])],4),(e.openBlock(),e.createElementBlock("svg",{viewBox:`0 0 20 ${o.value}`,width:"20",height:o.value,class:"ml-4 block","aria-hidden":"true"},[e.createElementVNode("path",{d:`M 1 0V -36 l 18 24 V ${o.value*.8} l -18 24V ${o.value}`,fill:"none",stroke:"#9091A0","stroke-opacity":"0.16"},null,8,pa),e.createElementVNode("path",{d:`M 1 0V -36 l 18 24 V ${o.value*.8} l -18 24V ${o.value}`,fill:"none",stroke:"url(#gradient)","stroke-width":"1.25",class:"motion-reduce:hidden"},null,8,ga),e.createElementVNode("defs",null,[e.createElementVNode("linearGradient",{id:"gradient",gradientUnits:"userSpaceOnUse",x1:"0",x2:"0",y1:c.value.y1,y2:c.value.y2},[...f[0]||(f[0]=[e.createElementVNode("stop",{"stop-color":"#18CCFC","stop-opacity":"0"},null,-1),e.createElementVNode("stop",{"stop-color":"#18CCFC"},null,-1),e.createElementVNode("stop",{offset:"0.325","stop-color":"#6344F5"},null,-1),e.createElementVNode("stop",{offset:"1","stop-color":"#AE48FF","stop-opacity":"0"},null,-1)])],8,va)])],8,fa))]),e.createElementVNode("div",{ref_key:"tracingBeamContentRef",ref:i},[e.renderSlot(h.$slots,"default")],512)],2))}}),ya=["src"],wa=e.defineComponent({__name:"index",props:{content:{default:()=>[{title:"Lorem Ipsum Dolor Sit Amet",description:["Sit duis est minim proident non nisi velit non consectetur. Esse adipisicing laboris consectetur enim ipsum reprehenderit eu deserunt Lorem ut aliqua anim do. Duis cupidatat qui irure cupidatat incididunt incididunt enim magna id est qui sunt fugiat. Laboris do duis pariatur fugiat Lorem aute sit ullamco. Qui deserunt non reprehenderit dolore nisi velit exercitation Lorem qui do enim culpa. Aliqua eiusmod in occaecat reprehenderit laborum nostrud fugiat voluptate do Lorem culpa officia sint labore. Tempor consectetur excepteur ut fugiat veniam commodo et labore dolore commodo pariatur.","Dolor minim irure ut Lorem proident. Ipsum do pariatur est ad ad veniam in commodo id reprehenderit adipisicing. Proident duis exercitation ad quis ex cupidatat cupidatat occaecat adipisicing.","Tempor quis dolor veniam quis dolor. Sit reprehenderit eiusmod reprehenderit deserunt amet laborum consequat adipisicing officia qui irure id sint adipisicing. Adipisicing fugiat aliqua nulla nostrud. Amet culpa officia aliquip deserunt veniam deserunt officia adipisicing aliquip proident officia sunt."],badge:"Vue",image:"https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?auto=format&fit=crop&q=80&w=3540&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"},{title:"Lorem Ipsum Dolor Sit Amet",description:["Ex irure dolore veniam ex velit non aute nisi labore ipsum occaecat deserunt cupidatat aute. Enim cillum dolor et nulla sunt exercitation non voluptate qui aliquip esse tempor. Ullamco ut sunt consectetur sint qui qui do do qui do. Labore laborum culpa magna reprehenderit ea velit id esse adipisicing deserunt amet dolore. Ipsum occaecat veniam commodo proident aliqua id ad deserunt dolor aliquip duis veniam sunt.","In dolore veniam excepteur eu est et sunt velit. Ipsum sint esse veniam fugiat esse qui sint ad sunt reprehenderit do qui proident reprehenderit. Laborum exercitation aliqua reprehenderit ea sint cillum ut mollit."],badge:"Nuxt",image:"https://images.unsplash.com/photo-1519681393784-d120267933ba?auto=format&fit=crop&q=80&w=3540&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"},{title:"Lorem Ipsum Dolor Sit Amet",description:["Ex irure dolore veniam ex velit non aute nisi labore ipsum occaecat deserunt cupidatat aute. Enim cillum dolor et nulla sunt exercitation non voluptate qui aliquip esse tempor. Ullamco ut sunt consectetur sint qui qui do do qui do. Labore laborum culpa magna reprehenderit ea velit id esse adipisicing deserunt amet dolore. Ipsum occaecat veniam commodo proident aliqua id ad deserunt dolor aliquip duis veniam sunt."],badge:"Inspira UI",image:"https://images.unsplash.com/photo-1469474968028-56623f02e42e?auto=format&fit=crop&q=80&w=3506&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"}]},classList:{default:()=>({})}},setup(n){const t=n,i=e.computed(()=>{const s=t.classList?.Location||{};return[s.position,s.width,s.height,s.left,s.top].filter(Boolean)});return(s,o)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([n.classList?.overallClass||"w-full items-center justify-center px-8",i.value])},[e.createVNode(xa,{class:e.normalizeClass(n.classList?.beamClass||"px-6")},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.contentClass||"relative mx-auto max-w-2xl pt-4 antialiased")},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.content,(r,l)=>(e.openBlock(),e.createElementBlock("div",{key:`content-${l}`,class:e.normalizeClass(n.classList?.itemClass||"mb-10")},[e.createElementVNode("div",{class:e.normalizeClass(n.classList?.badgeClass||"mb-4 w-fit rounded-full bg-black px-2 text-sm text-white dark:bg-white dark:text-black")},e.toDisplayString(r.badge),3),e.createElementVNode("p",{class:e.normalizeClass(n.classList?.titleClass||"mb-4 text-xl")},e.toDisplayString(r.title),3),e.createElementVNode("div",{class:e.normalizeClass(n.classList?.descriptionClass||"prose prose-sm dark:prose-invert text-sm")},[r.image?(e.openBlock(),e.createElementBlock("img",{key:0,src:r.image,alt:"blog thumbnail",class:e.normalizeClass(n.classList?.imageClass||"mb-10 rounded-lg object-cover")},null,10,ya)):e.createCommentVNode("",!0),e.createElementVNode("div",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.description,(a,c)=>(e.openBlock(),e.createElementBlock("p",{key:`desc-${c}`},e.toDisplayString(a),1))),128))])],2)],2))),128))],2)]),_:1},8,["class"])],2))}}),ba={class:"navigation"},Ca={class:"nav-container"},Ea={class:"nav-brand"},ka={class:"nav-icon"},Sa={class:"nav-text"},_a=["title"],Ta={class:"nav-icon"},Ma={class:"nav-text"},Ba={__name:"Navigation",setup(n){Vt.useRoute();const t=e.ref(!1),i=Ce.useColorMode(),s=()=>{i.value=i.value==="dark"?"light":"dark"},o=[{path:"/",name:"้ฆ้กต",icon:"๐ "},{path:"/page-1",name:"Demo 1",icon:"๐จ"},{path:"/page-2",name:"Demo 2",icon:"โจ"},{path:"/page-3",name:"Demo 3",icon:"๐ฒ"},{path:"/page-4",name:"Demo 4",icon:"๐"},{path:"/page-5",name:"Demo 5",icon:"๐ฏ"},{path:"/page-6",name:"Demo 6",icon:"๐ฑ"},{path:"/page-7",name:"Demo 7",icon:"๐"},{path:"/page-8",name:"Demo 8",icon:"๐"}],r=()=>{t.value=!t.value},l=()=>{t.value=!1};return(a,c)=>{const u=e.resolveComponent("router-link");return e.openBlock(),e.createElementBlock("nav",ba,[e.createElementVNode("div",Ca,[e.createElementVNode("div",Ea,[e.createVNode(u,{to:"/",class:"brand-link"},{default:e.withCtx(()=>[...c[0]||(c[0]=[e.createElementVNode("span",{class:"brand-icon"},"๐จ",-1),e.createElementVNode("span",{class:"brand-text"},"SensingPlatform Web UI",-1)])]),_:1})]),e.createElementVNode("div",{class:e.normalizeClass(["nav-menu",{"nav-menu-open":t.value}])},[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(o,d=>e.createVNode(u,{key:d.path,to:d.path,class:e.normalizeClass(["nav-link",{"nav-link-active":a.$route.path===d.path}]),onClick:l},{default:e.withCtx(()=>[e.createElementVNode("span",ka,e.toDisplayString(d.icon),1),e.createElementVNode("span",Sa,e.toDisplayString(d.name),1)]),_:2},1032,["to","class"])),64)),e.createElementVNode("button",{onClick:s,class:"nav-link dark-mode-toggle",title:e.unref(i)==="dark"?"ๅๆขๅฐๆต
่ฒๆจกๅผ":"ๅๆขๅฐๆ่ฒๆจกๅผ"},[e.createElementVNode("span",Ta,e.toDisplayString(e.unref(i)==="dark"?"โ๏ธ":"๐"),1),e.createElementVNode("span",Ma,e.toDisplayString(e.unref(i)==="dark"?"ๆต
่ฒ":"ๆ่ฒ"),1)],8,_a)],2),e.createElementVNode("div",{class:"nav-toggle",onClick:r},[e.createElementVNode("span",{class:e.normalizeClass(["hamburger",{"hamburger-open":t.value}])},[...c[1]||(c[1]=[e.createElementVNode("span",null,null,-1),e.createElementVNode("span",null,null,-1),e.createElementVNode("span",null,null,-1)])],2)])])])}}},Da=xe(Ba,[["__scopeId","data-v-d47bcaa4"]]);exports.AnimatedTestimonials=ys;exports.Aurora=Ss;exports.BendingGallery=Ts;exports.BentoGrid=Ps;exports.Card3D=gs;exports.Carousel3D=Hs;exports.ContainerScroll=Zs;exports.DirectionAwareHover=ti;exports.Dock=ai;exports.DomeGallery=mi;exports.ExpandableGallery=gi;exports.FluidCursor=bi;exports.IButton=Ci;exports.IInput=mt;exports.IconCloud=ki;exports.InfiniteGrid=Ki;exports.InfiniteMenu=so;exports.InspiraImageParticles=no;exports.InteractiveGridPattern=co;exports.Lightning=go;exports.LinkPreview=Co;exports.MagnifyingGlass=Ro;exports.Marquee=Oo;exports.Meteors=Ho;exports.Navigation=Da;exports.PhotoGallery=Wo;exports.RegistrationForm=Jo;exports.RippleButton=on;exports.RollingGallery=rn;exports.ScratchToReveal=dn;exports.ScrollIsland=En;exports.SparkElement=Tn;exports.SparklesText=In;exports.Spline=Pn;exports.Stack=Fn;exports.TargetCursor=Un;exports.TestimonialSlider=ea;exports.Text3d=ia;exports.TextGenerateEffect=na;exports.Timeline=ha;exports.TracingBeam=wa;
|