[{"data":1,"prerenderedAt":1541},["ShallowReactive",2],{"navigation_docs":3,"-misc-utils":81,"-misc-utils-surround":303,"preview-examples/misc/StaggerDemo.vue":306,"preview-examples/misc/SnapDemo.vue":307,"mdc--4bp0z8-key":308,"mdc-wba2cm-key":968},[4,25,63],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Getting Started",false,"/getting-started","1.getting-started",[10,15,20],{"title":11,"path":12,"stem":13,"icon":14},"Introduction","/getting-started/introduction","1.getting-started/1.introduction","i-lucide-info",{"title":16,"path":17,"stem":18,"icon":19},"Installation","/getting-started/installation","1.getting-started/2.installation","i-lucide-download",{"title":21,"path":22,"stem":23,"icon":24},"Configuration","/getting-started/configuration","1.getting-started/3.configuration","i-lucide-settings",{"title":26,"path":27,"stem":28,"children":29},"Composables","/composables","2.composables",[30,33,38,43,48,53,58],{"title":11,"path":27,"stem":31,"icon":32},"2.composables/index","i-lucide-box",{"title":34,"path":35,"stem":36,"icon":37},"useAnimate","/composables/use-animate","2.composables/1.use-animate","i-ph-play-circle",{"title":39,"path":40,"stem":41,"icon":42},"useWaapiAnimate","/composables/use-waapi-animate","2.composables/2.use-waapi-animate","i-ph-lightning",{"title":44,"path":45,"stem":46,"icon":47},"useAnimatable","/composables/use-animatable","2.composables/3.use-animatable","i-ph-cube",{"title":49,"path":50,"stem":51,"icon":52},"useSplitText","/composables/use-split-text","2.composables/4.use-split-text","i-ph-text-t",{"title":54,"path":55,"stem":56,"icon":57},"useLayout","/composables/use-layout","2.composables/5.use-layout","i-ph-layout",{"title":59,"path":60,"stem":61,"icon":62},"useDraggable","/composables/use-draggable","2.composables/6.use-draggable","i-ph-hand-grabbing",{"title":64,"path":65,"stem":66,"children":67},"Misc","/misc","4.misc",[68,71,76],{"title":11,"path":65,"stem":69,"icon":70},"4.misc/index","i-ph-puzzle-piece",{"title":72,"path":73,"stem":74,"icon":75},"Easings","/misc/easings","4.misc/1.easings","i-ph-chart-line",{"title":77,"path":78,"stem":79,"icon":80},"Utils","/misc/utils","4.misc/2.utils","i-ph-wrench",{"id":82,"title":77,"body":83,"description":296,"extension":297,"links":298,"meta":299,"navigation":300,"path":78,"seo":301,"stem":79,"__hash__":302},"docs/4.misc/2.utils.md",{"type":84,"value":85,"toc":290},"minimark",[86,93,109,229,234,242,247,251,254,261,275,278,286],[87,88,89],"blockquote",{},[90,91,92],"p",{},"A collection of utility functions for common animation tasks that can also serve as modifier functions.",[90,94,95,96,103,104,108],{},"You can access all utils provided by ",[97,98,102],"a",{"href":99,"rel":100},"https://animejs.com/documentation/utilities",[101],"nofollow","AnimeJS"," via ",[105,106,107],"code",{},"#nanime/utils",".",[110,111,116],"pre",{"className":112,"code":113,"language":114,"meta":115,"style":115},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { snap, lerp, mapRange } from '#nanime/utils'\n\nsnap(30)\nlerp(0, 100)\nmapRange(0, 100, 0, 200)\n","ts","",[105,117,118,161,168,185,203],{"__ignoreMap":115},[119,120,123,127,131,135,138,141,143,146,149,152,155,158],"span",{"class":121,"line":122},"line",1,[119,124,126],{"class":125},"s7zQu","import",[119,128,130],{"class":129},"sMK4o"," {",[119,132,134],{"class":133},"sTEyZ"," snap",[119,136,137],{"class":129},",",[119,139,140],{"class":133}," lerp",[119,142,137],{"class":129},[119,144,145],{"class":133}," mapRange",[119,147,148],{"class":129}," }",[119,150,151],{"class":125}," from",[119,153,154],{"class":129}," '",[119,156,107],{"class":157},"sfazB",[119,159,160],{"class":129},"'\n",[119,162,164],{"class":121,"line":163},2,[119,165,167],{"emptyLinePlaceholder":166},true,"\n",[119,169,171,175,178,182],{"class":121,"line":170},3,[119,172,174],{"class":173},"s2Zo4","snap",[119,176,177],{"class":133},"(",[119,179,181],{"class":180},"sbssI","30",[119,183,184],{"class":133},")\n",[119,186,188,191,193,196,198,201],{"class":121,"line":187},4,[119,189,190],{"class":173},"lerp",[119,192,177],{"class":133},[119,194,195],{"class":180},"0",[119,197,137],{"class":129},[119,199,200],{"class":180}," 100",[119,202,184],{"class":133},[119,204,206,209,211,213,215,217,219,222,224,227],{"class":121,"line":205},5,[119,207,208],{"class":173},"mapRange",[119,210,177],{"class":133},[119,212,195],{"class":180},[119,214,137],{"class":129},[119,216,200],{"class":180},[119,218,137],{"class":129},[119,220,221],{"class":180}," 0",[119,223,137],{"class":129},[119,225,226],{"class":180}," 200",[119,228,184],{"class":133},[230,231,233],"h2",{"id":232},"stagger","Stagger",[90,235,236,241],{},[97,237,240],{"href":238,"rel":239},"https://animejs.com/documentation/utilities/stagger",[101],"stagger()"," allows you to create staggering effects for your animations.",[243,244,246],"h3",{"id":245},"sample-usage","Sample usage",[248,249],"render-code-block-preview",{"src":250},"examples/misc/StaggerDemo.vue",[230,252,253],{"id":174},"Snap",[90,255,256],{},[97,257,260],{"href":258,"rel":259},"https://animejs.com/documentation/utilities/snap",[101],"snap()",[87,262,263],{},[90,264,265,266,274],{},"Rounds a Number to the nearest specified increment or creates a snapping ",[105,267,270],{"className":268,"language":269,"style":115},"language-ts-type shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","ts-type",[119,271,273],{"class":272},"sBMFI","Function"," with a pre-defined increment parameter.",[248,276],{"src":277},"examples/misc/SnapDemo.vue",[90,279,280,281,285],{},"See ",[97,282,284],{"href":99,"rel":283},[101],"AnimeJS Utilities documentation"," for more.",[287,288,289],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}",{"title":115,"searchDepth":163,"depth":163,"links":291},[292,295],{"id":232,"depth":163,"text":233,"children":293},[294],{"id":245,"depth":170,"text":246},{"id":174,"depth":163,"text":253},"Guide on how to utilize exposed animejs utils","md",null,{},{"icon":80},{"title":77,"description":296},"TslFGVPGCHlGiDpgmbwbRBogbbhIu2uQ8VrJuuosZ-c",[304,298],{"title":72,"path":73,"stem":74,"description":305,"icon":75,"children":-1},"Documentation for available easings.","\n::code-group\n```ts [Script]\nimport { stagger } from '#nanime/utils'\n\nconst items = useTemplateRef('items')\n\nuseAnimate(items, {\n  opacity: [0, 1],\n  scale: [0.5, 1],\n  delay: stagger(100, { grid: [9, 1], from: 'center' }),\n  duration: 800,\n  ease: 'outElastic(1, .5)',\n  loop: true,\n  alternate: true,\n})\n```\n\n```vue [Template]\n\u003Ctemplate>\n  \u003Cdiv class=\"flex gap-2.5\">\n    \u003Cdiv v-for=\"i in 9\" :key=\"i\" ref=\"items\" class=\"simple-box opacity-0 w-8\" />\n  \u003C/div>\n\u003C/template>\n```\n\n\n::\n\n::stagger-demo\n::\n\n::u-button\n---\nto: https://github.com/astraldev/nanime/blob/main/docs/app/components/content/examples/misc/StaggerDemo.vue\ntarget: _blank\nvariant: link\ncolor: neutral\nicon: i-simple-icons-github\nclass: mt-2.5 pl-0.5\n---\nView on GitHub\n::\n","\n::code-group\n```ts [Script]\nimport { snap } from '#nanime/utils'\nimport type { AnimationParams } from '#nanime/types'\n\nconst defaults: AnimationParams = {\n  x: { to: 300 },\n  duration: 3000,\n  loop: true,\n  alternate: true,\n  ease: 'outBack',\n}\n\nuseAnimate('.normal', defaults)\nuseAnimate('.snapped', {\n  ...defaults,\n  modifier: snap(30),\n})\n```\n\n```vue [Template]\n\u003Ctemplate>\n  \u003Cdiv class=\"flex gap-4 flex-col\">\n    \u003Cdiv class=\"simple-box normal w-8\" />\n\n    \u003Cdiv class=\"simple-box snapped w-8\" />\n  \u003C/div>\n\u003C/template>\n```\n\n\n::\n\n::snap-demo\n::\n\n::u-button\n---\nto: https://github.com/astraldev/nanime/blob/main/docs/app/components/content/examples/misc/SnapDemo.vue\ntarget: _blank\nvariant: link\ncolor: neutral\nicon: i-simple-icons-github\nclass: mt-2.5 pl-0.5\n---\nView on GitHub\n::\n",{"data":309,"body":310},{},{"type":311,"children":312},"root",[313,945,949,963],{"type":314,"tag":315,"props":316,"children":317},"element","code-group",{},[318,742],{"type":314,"tag":110,"props":319,"children":322},{"className":112,"code":320,"filename":321,"language":114,"meta":115,"style":115},"import { stagger } from '#nanime/utils'\n\nconst items = useTemplateRef('items')\n\nuseAnimate(items, {\n  opacity: [0, 1],\n  scale: [0.5, 1],\n  delay: stagger(100, { grid: [9, 1], from: 'center' }),\n  duration: 800,\n  ease: 'outElastic(1, .5)',\n  loop: true,\n  alternate: true,\n})\n","Script",[323],{"type":314,"tag":105,"props":324,"children":325},{"__ignoreMap":115},[326,367,374,421,428,449,493,531,633,655,685,708,729],{"type":314,"tag":119,"props":327,"children":328},{"class":121,"line":122},[329,335,340,346,350,354,358,363],{"type":314,"tag":119,"props":330,"children":332},{"style":331},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[333],{"type":334,"value":126},"text",{"type":314,"tag":119,"props":336,"children":338},{"style":337},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[339],{"type":334,"value":130},{"type":314,"tag":119,"props":341,"children":343},{"style":342},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[344],{"type":334,"value":345}," stagger",{"type":314,"tag":119,"props":347,"children":348},{"style":337},[349],{"type":334,"value":148},{"type":314,"tag":119,"props":351,"children":352},{"style":331},[353],{"type":334,"value":151},{"type":314,"tag":119,"props":355,"children":356},{"style":337},[357],{"type":334,"value":154},{"type":314,"tag":119,"props":359,"children":361},{"style":360},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[362],{"type":334,"value":107},{"type":314,"tag":119,"props":364,"children":365},{"style":337},[366],{"type":334,"value":160},{"type":314,"tag":119,"props":368,"children":369},{"class":121,"line":163},[370],{"type":314,"tag":119,"props":371,"children":372},{"emptyLinePlaceholder":166},[373],{"type":334,"value":167},{"type":314,"tag":119,"props":375,"children":376},{"class":121,"line":170},[377,383,388,393,399,403,408,413,417],{"type":314,"tag":119,"props":378,"children":380},{"style":379},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[381],{"type":334,"value":382},"const",{"type":314,"tag":119,"props":384,"children":385},{"style":342},[386],{"type":334,"value":387}," items ",{"type":314,"tag":119,"props":389,"children":390},{"style":337},[391],{"type":334,"value":392},"=",{"type":314,"tag":119,"props":394,"children":396},{"style":395},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[397],{"type":334,"value":398}," useTemplateRef",{"type":314,"tag":119,"props":400,"children":401},{"style":342},[402],{"type":334,"value":177},{"type":314,"tag":119,"props":404,"children":405},{"style":337},[406],{"type":334,"value":407},"'",{"type":314,"tag":119,"props":409,"children":410},{"style":360},[411],{"type":334,"value":412},"items",{"type":314,"tag":119,"props":414,"children":415},{"style":337},[416],{"type":334,"value":407},{"type":314,"tag":119,"props":418,"children":419},{"style":342},[420],{"type":334,"value":184},{"type":314,"tag":119,"props":422,"children":423},{"class":121,"line":187},[424],{"type":314,"tag":119,"props":425,"children":426},{"emptyLinePlaceholder":166},[427],{"type":334,"value":167},{"type":314,"tag":119,"props":429,"children":430},{"class":121,"line":205},[431,435,440,444],{"type":314,"tag":119,"props":432,"children":433},{"style":395},[434],{"type":334,"value":34},{"type":314,"tag":119,"props":436,"children":437},{"style":342},[438],{"type":334,"value":439},"(items",{"type":314,"tag":119,"props":441,"children":442},{"style":337},[443],{"type":334,"value":137},{"type":314,"tag":119,"props":445,"children":446},{"style":337},[447],{"type":334,"value":448}," {\n",{"type":314,"tag":119,"props":450,"children":452},{"class":121,"line":451},6,[453,459,464,469,474,478,483,488],{"type":314,"tag":119,"props":454,"children":456},{"style":455},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[457],{"type":334,"value":458},"  opacity",{"type":314,"tag":119,"props":460,"children":461},{"style":337},[462],{"type":334,"value":463},":",{"type":314,"tag":119,"props":465,"children":466},{"style":342},[467],{"type":334,"value":468}," [",{"type":314,"tag":119,"props":470,"children":472},{"style":471},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[473],{"type":334,"value":195},{"type":314,"tag":119,"props":475,"children":476},{"style":337},[477],{"type":334,"value":137},{"type":314,"tag":119,"props":479,"children":480},{"style":471},[481],{"type":334,"value":482}," 1",{"type":314,"tag":119,"props":484,"children":485},{"style":342},[486],{"type":334,"value":487},"]",{"type":314,"tag":119,"props":489,"children":490},{"style":337},[491],{"type":334,"value":492},",\n",{"type":314,"tag":119,"props":494,"children":496},{"class":121,"line":495},7,[497,502,506,510,515,519,523,527],{"type":314,"tag":119,"props":498,"children":499},{"style":455},[500],{"type":334,"value":501},"  scale",{"type":314,"tag":119,"props":503,"children":504},{"style":337},[505],{"type":334,"value":463},{"type":314,"tag":119,"props":507,"children":508},{"style":342},[509],{"type":334,"value":468},{"type":314,"tag":119,"props":511,"children":512},{"style":471},[513],{"type":334,"value":514},"0.5",{"type":314,"tag":119,"props":516,"children":517},{"style":337},[518],{"type":334,"value":137},{"type":314,"tag":119,"props":520,"children":521},{"style":471},[522],{"type":334,"value":482},{"type":314,"tag":119,"props":524,"children":525},{"style":342},[526],{"type":334,"value":487},{"type":314,"tag":119,"props":528,"children":529},{"style":337},[530],{"type":334,"value":492},{"type":314,"tag":119,"props":532,"children":534},{"class":121,"line":533},8,[535,540,544,548,552,557,561,565,570,574,578,583,587,591,595,599,603,607,611,616,620,624,629],{"type":314,"tag":119,"props":536,"children":537},{"style":455},[538],{"type":334,"value":539},"  delay",{"type":314,"tag":119,"props":541,"children":542},{"style":337},[543],{"type":334,"value":463},{"type":314,"tag":119,"props":545,"children":546},{"style":395},[547],{"type":334,"value":345},{"type":314,"tag":119,"props":549,"children":550},{"style":342},[551],{"type":334,"value":177},{"type":314,"tag":119,"props":553,"children":554},{"style":471},[555],{"type":334,"value":556},"100",{"type":314,"tag":119,"props":558,"children":559},{"style":337},[560],{"type":334,"value":137},{"type":314,"tag":119,"props":562,"children":563},{"style":337},[564],{"type":334,"value":130},{"type":314,"tag":119,"props":566,"children":567},{"style":455},[568],{"type":334,"value":569}," grid",{"type":314,"tag":119,"props":571,"children":572},{"style":337},[573],{"type":334,"value":463},{"type":314,"tag":119,"props":575,"children":576},{"style":342},[577],{"type":334,"value":468},{"type":314,"tag":119,"props":579,"children":580},{"style":471},[581],{"type":334,"value":582},"9",{"type":314,"tag":119,"props":584,"children":585},{"style":337},[586],{"type":334,"value":137},{"type":314,"tag":119,"props":588,"children":589},{"style":471},[590],{"type":334,"value":482},{"type":314,"tag":119,"props":592,"children":593},{"style":342},[594],{"type":334,"value":487},{"type":314,"tag":119,"props":596,"children":597},{"style":337},[598],{"type":334,"value":137},{"type":314,"tag":119,"props":600,"children":601},{"style":455},[602],{"type":334,"value":151},{"type":314,"tag":119,"props":604,"children":605},{"style":337},[606],{"type":334,"value":463},{"type":314,"tag":119,"props":608,"children":609},{"style":337},[610],{"type":334,"value":154},{"type":314,"tag":119,"props":612,"children":613},{"style":360},[614],{"type":334,"value":615},"center",{"type":314,"tag":119,"props":617,"children":618},{"style":337},[619],{"type":334,"value":407},{"type":314,"tag":119,"props":621,"children":622},{"style":337},[623],{"type":334,"value":148},{"type":314,"tag":119,"props":625,"children":626},{"style":342},[627],{"type":334,"value":628},")",{"type":314,"tag":119,"props":630,"children":631},{"style":337},[632],{"type":334,"value":492},{"type":314,"tag":119,"props":634,"children":636},{"class":121,"line":635},9,[637,642,646,651],{"type":314,"tag":119,"props":638,"children":639},{"style":455},[640],{"type":334,"value":641},"  duration",{"type":314,"tag":119,"props":643,"children":644},{"style":337},[645],{"type":334,"value":463},{"type":314,"tag":119,"props":647,"children":648},{"style":471},[649],{"type":334,"value":650}," 800",{"type":314,"tag":119,"props":652,"children":653},{"style":337},[654],{"type":334,"value":492},{"type":314,"tag":119,"props":656,"children":658},{"class":121,"line":657},10,[659,664,668,672,677,681],{"type":314,"tag":119,"props":660,"children":661},{"style":455},[662],{"type":334,"value":663},"  ease",{"type":314,"tag":119,"props":665,"children":666},{"style":337},[667],{"type":334,"value":463},{"type":314,"tag":119,"props":669,"children":670},{"style":337},[671],{"type":334,"value":154},{"type":314,"tag":119,"props":673,"children":674},{"style":360},[675],{"type":334,"value":676},"outElastic(1, .5)",{"type":314,"tag":119,"props":678,"children":679},{"style":337},[680],{"type":334,"value":407},{"type":314,"tag":119,"props":682,"children":683},{"style":337},[684],{"type":334,"value":492},{"type":314,"tag":119,"props":686,"children":688},{"class":121,"line":687},11,[689,694,698,704],{"type":314,"tag":119,"props":690,"children":691},{"style":455},[692],{"type":334,"value":693},"  loop",{"type":314,"tag":119,"props":695,"children":696},{"style":337},[697],{"type":334,"value":463},{"type":314,"tag":119,"props":699,"children":701},{"style":700},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[702],{"type":334,"value":703}," true",{"type":314,"tag":119,"props":705,"children":706},{"style":337},[707],{"type":334,"value":492},{"type":314,"tag":119,"props":709,"children":711},{"class":121,"line":710},12,[712,717,721,725],{"type":314,"tag":119,"props":713,"children":714},{"style":455},[715],{"type":334,"value":716},"  alternate",{"type":314,"tag":119,"props":718,"children":719},{"style":337},[720],{"type":334,"value":463},{"type":314,"tag":119,"props":722,"children":723},{"style":700},[724],{"type":334,"value":703},{"type":314,"tag":119,"props":726,"children":727},{"style":337},[728],{"type":334,"value":492},{"type":314,"tag":119,"props":730,"children":732},{"class":121,"line":731},13,[733,738],{"type":314,"tag":119,"props":734,"children":735},{"style":337},[736],{"type":334,"value":737},"}",{"type":314,"tag":119,"props":739,"children":740},{"style":342},[741],{"type":334,"value":184},{"type":314,"tag":110,"props":743,"children":748},{"className":744,"code":745,"filename":746,"language":747,"meta":115,"style":115},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n  \u003Cdiv class=\"flex gap-2.5\">\n    \u003Cdiv v-for=\"i in 9\" :key=\"i\" ref=\"items\" class=\"simple-box opacity-0 w-8\" />\n  \u003C/div>\n\u003C/template>\n","Template","vue",[749],{"type":314,"tag":105,"props":750,"children":751},{"__ignoreMap":115},[752,770,810,913,929],{"type":314,"tag":119,"props":753,"children":754},{"class":121,"line":122},[755,760,765],{"type":314,"tag":119,"props":756,"children":757},{"style":337},[758],{"type":334,"value":759},"\u003C",{"type":314,"tag":119,"props":761,"children":762},{"style":455},[763],{"type":334,"value":764},"template",{"type":314,"tag":119,"props":766,"children":767},{"style":337},[768],{"type":334,"value":769},">\n",{"type":314,"tag":119,"props":771,"children":772},{"class":121,"line":163},[773,778,783,788,792,797,802,806],{"type":314,"tag":119,"props":774,"children":775},{"style":337},[776],{"type":334,"value":777},"  \u003C",{"type":314,"tag":119,"props":779,"children":780},{"style":455},[781],{"type":334,"value":782},"div",{"type":314,"tag":119,"props":784,"children":785},{"style":379},[786],{"type":334,"value":787}," class",{"type":314,"tag":119,"props":789,"children":790},{"style":337},[791],{"type":334,"value":392},{"type":314,"tag":119,"props":793,"children":794},{"style":337},[795],{"type":334,"value":796},"\"",{"type":314,"tag":119,"props":798,"children":799},{"style":360},[800],{"type":334,"value":801},"flex gap-2.5",{"type":314,"tag":119,"props":803,"children":804},{"style":337},[805],{"type":334,"value":796},{"type":314,"tag":119,"props":807,"children":808},{"style":337},[809],{"type":334,"value":769},{"type":314,"tag":119,"props":811,"children":812},{"class":121,"line":170},[813,818,822,827,831,835,840,844,849,853,857,862,866,871,875,879,883,887,891,895,899,904,908],{"type":314,"tag":119,"props":814,"children":815},{"style":337},[816],{"type":334,"value":817},"    \u003C",{"type":314,"tag":119,"props":819,"children":820},{"style":455},[821],{"type":334,"value":782},{"type":314,"tag":119,"props":823,"children":824},{"style":379},[825],{"type":334,"value":826}," v-for",{"type":314,"tag":119,"props":828,"children":829},{"style":337},[830],{"type":334,"value":392},{"type":314,"tag":119,"props":832,"children":833},{"style":337},[834],{"type":334,"value":796},{"type":314,"tag":119,"props":836,"children":837},{"style":360},[838],{"type":334,"value":839},"i in 9",{"type":314,"tag":119,"props":841,"children":842},{"style":337},[843],{"type":334,"value":796},{"type":314,"tag":119,"props":845,"children":846},{"style":379},[847],{"type":334,"value":848}," :key",{"type":314,"tag":119,"props":850,"children":851},{"style":337},[852],{"type":334,"value":392},{"type":314,"tag":119,"props":854,"children":855},{"style":337},[856],{"type":334,"value":796},{"type":314,"tag":119,"props":858,"children":859},{"style":360},[860],{"type":334,"value":861},"i",{"type":314,"tag":119,"props":863,"children":864},{"style":337},[865],{"type":334,"value":796},{"type":314,"tag":119,"props":867,"children":868},{"style":379},[869],{"type":334,"value":870}," ref",{"type":314,"tag":119,"props":872,"children":873},{"style":337},[874],{"type":334,"value":392},{"type":314,"tag":119,"props":876,"children":877},{"style":337},[878],{"type":334,"value":796},{"type":314,"tag":119,"props":880,"children":881},{"style":360},[882],{"type":334,"value":412},{"type":314,"tag":119,"props":884,"children":885},{"style":337},[886],{"type":334,"value":796},{"type":314,"tag":119,"props":888,"children":889},{"style":379},[890],{"type":334,"value":787},{"type":314,"tag":119,"props":892,"children":893},{"style":337},[894],{"type":334,"value":392},{"type":314,"tag":119,"props":896,"children":897},{"style":337},[898],{"type":334,"value":796},{"type":314,"tag":119,"props":900,"children":901},{"style":360},[902],{"type":334,"value":903},"simple-box opacity-0 w-8",{"type":314,"tag":119,"props":905,"children":906},{"style":337},[907],{"type":334,"value":796},{"type":314,"tag":119,"props":909,"children":910},{"style":337},[911],{"type":334,"value":912}," />\n",{"type":314,"tag":119,"props":914,"children":915},{"class":121,"line":187},[916,921,925],{"type":314,"tag":119,"props":917,"children":918},{"style":337},[919],{"type":334,"value":920},"  \u003C/",{"type":314,"tag":119,"props":922,"children":923},{"style":455},[924],{"type":334,"value":782},{"type":314,"tag":119,"props":926,"children":927},{"style":337},[928],{"type":334,"value":769},{"type":314,"tag":119,"props":930,"children":931},{"class":121,"line":205},[932,937,941],{"type":314,"tag":119,"props":933,"children":934},{"style":337},[935],{"type":334,"value":936},"\u003C/",{"type":314,"tag":119,"props":938,"children":939},{"style":455},[940],{"type":334,"value":764},{"type":314,"tag":119,"props":942,"children":943},{"style":337},[944],{"type":334,"value":769},{"type":314,"tag":946,"props":947,"children":948},"stagger-demo",{},[],{"type":314,"tag":950,"props":951,"children":960},"u-button",{"className":952,"color":955,"icon":956,"target":957,"to":958,"variant":959},[953,954],"mt-2.5","pl-0.5","neutral","i-simple-icons-github","_blank","https://github.com/astraldev/nanime/blob/main/docs/app/components/content/examples/misc/StaggerDemo.vue","link",[961],{"type":334,"value":962},"View on GitHub",{"type":314,"tag":287,"props":964,"children":965},{},[966],{"type":334,"value":967},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"data":969,"body":970},{},{"type":311,"children":971},[972,1527,1531,1537],{"type":314,"tag":315,"props":973,"children":974},{},[975,1360],{"type":314,"tag":110,"props":976,"children":978},{"className":112,"code":977,"filename":321,"language":114,"meta":115,"style":115},"import { snap } from '#nanime/utils'\nimport type { AnimationParams } from '#nanime/types'\n\nconst defaults: AnimationParams = {\n  x: { to: 300 },\n  duration: 3000,\n  loop: true,\n  alternate: true,\n  ease: 'outBack',\n}\n\nuseAnimate('.normal', defaults)\nuseAnimate('.snapped', {\n  ...defaults,\n  modifier: snap(30),\n})\n",[979],{"type":314,"tag":105,"props":980,"children":981},{"__ignoreMap":115},[982,1017,1059,1066,1096,1131,1151,1170,1189,1217,1225,1232,1265,1297,1315,1348],{"type":314,"tag":119,"props":983,"children":984},{"class":121,"line":122},[985,989,993,997,1001,1005,1009,1013],{"type":314,"tag":119,"props":986,"children":987},{"style":331},[988],{"type":334,"value":126},{"type":314,"tag":119,"props":990,"children":991},{"style":337},[992],{"type":334,"value":130},{"type":314,"tag":119,"props":994,"children":995},{"style":342},[996],{"type":334,"value":134},{"type":314,"tag":119,"props":998,"children":999},{"style":337},[1000],{"type":334,"value":148},{"type":314,"tag":119,"props":1002,"children":1003},{"style":331},[1004],{"type":334,"value":151},{"type":314,"tag":119,"props":1006,"children":1007},{"style":337},[1008],{"type":334,"value":154},{"type":314,"tag":119,"props":1010,"children":1011},{"style":360},[1012],{"type":334,"value":107},{"type":314,"tag":119,"props":1014,"children":1015},{"style":337},[1016],{"type":334,"value":160},{"type":314,"tag":119,"props":1018,"children":1019},{"class":121,"line":163},[1020,1024,1029,1033,1038,1042,1046,1050,1055],{"type":314,"tag":119,"props":1021,"children":1022},{"style":331},[1023],{"type":334,"value":126},{"type":314,"tag":119,"props":1025,"children":1026},{"style":331},[1027],{"type":334,"value":1028}," type",{"type":314,"tag":119,"props":1030,"children":1031},{"style":337},[1032],{"type":334,"value":130},{"type":314,"tag":119,"props":1034,"children":1035},{"style":342},[1036],{"type":334,"value":1037}," AnimationParams",{"type":314,"tag":119,"props":1039,"children":1040},{"style":337},[1041],{"type":334,"value":148},{"type":314,"tag":119,"props":1043,"children":1044},{"style":331},[1045],{"type":334,"value":151},{"type":314,"tag":119,"props":1047,"children":1048},{"style":337},[1049],{"type":334,"value":154},{"type":314,"tag":119,"props":1051,"children":1052},{"style":360},[1053],{"type":334,"value":1054},"#nanime/types",{"type":314,"tag":119,"props":1056,"children":1057},{"style":337},[1058],{"type":334,"value":160},{"type":314,"tag":119,"props":1060,"children":1061},{"class":121,"line":170},[1062],{"type":314,"tag":119,"props":1063,"children":1064},{"emptyLinePlaceholder":166},[1065],{"type":334,"value":167},{"type":314,"tag":119,"props":1067,"children":1068},{"class":121,"line":187},[1069,1073,1078,1082,1087,1092],{"type":314,"tag":119,"props":1070,"children":1071},{"style":379},[1072],{"type":334,"value":382},{"type":314,"tag":119,"props":1074,"children":1075},{"style":342},[1076],{"type":334,"value":1077}," defaults",{"type":314,"tag":119,"props":1079,"children":1080},{"style":337},[1081],{"type":334,"value":463},{"type":314,"tag":119,"props":1083,"children":1085},{"style":1084},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[1086],{"type":334,"value":1037},{"type":314,"tag":119,"props":1088,"children":1089},{"style":337},[1090],{"type":334,"value":1091}," =",{"type":314,"tag":119,"props":1093,"children":1094},{"style":337},[1095],{"type":334,"value":448},{"type":314,"tag":119,"props":1097,"children":1098},{"class":121,"line":205},[1099,1104,1108,1112,1117,1121,1126],{"type":314,"tag":119,"props":1100,"children":1101},{"style":455},[1102],{"type":334,"value":1103},"  x",{"type":314,"tag":119,"props":1105,"children":1106},{"style":337},[1107],{"type":334,"value":463},{"type":314,"tag":119,"props":1109,"children":1110},{"style":337},[1111],{"type":334,"value":130},{"type":314,"tag":119,"props":1113,"children":1114},{"style":455},[1115],{"type":334,"value":1116}," to",{"type":314,"tag":119,"props":1118,"children":1119},{"style":337},[1120],{"type":334,"value":463},{"type":314,"tag":119,"props":1122,"children":1123},{"style":471},[1124],{"type":334,"value":1125}," 300",{"type":314,"tag":119,"props":1127,"children":1128},{"style":337},[1129],{"type":334,"value":1130}," },\n",{"type":314,"tag":119,"props":1132,"children":1133},{"class":121,"line":451},[1134,1138,1142,1147],{"type":314,"tag":119,"props":1135,"children":1136},{"style":455},[1137],{"type":334,"value":641},{"type":314,"tag":119,"props":1139,"children":1140},{"style":337},[1141],{"type":334,"value":463},{"type":314,"tag":119,"props":1143,"children":1144},{"style":471},[1145],{"type":334,"value":1146}," 3000",{"type":314,"tag":119,"props":1148,"children":1149},{"style":337},[1150],{"type":334,"value":492},{"type":314,"tag":119,"props":1152,"children":1153},{"class":121,"line":495},[1154,1158,1162,1166],{"type":314,"tag":119,"props":1155,"children":1156},{"style":455},[1157],{"type":334,"value":693},{"type":314,"tag":119,"props":1159,"children":1160},{"style":337},[1161],{"type":334,"value":463},{"type":314,"tag":119,"props":1163,"children":1164},{"style":700},[1165],{"type":334,"value":703},{"type":314,"tag":119,"props":1167,"children":1168},{"style":337},[1169],{"type":334,"value":492},{"type":314,"tag":119,"props":1171,"children":1172},{"class":121,"line":533},[1173,1177,1181,1185],{"type":314,"tag":119,"props":1174,"children":1175},{"style":455},[1176],{"type":334,"value":716},{"type":314,"tag":119,"props":1178,"children":1179},{"style":337},[1180],{"type":334,"value":463},{"type":314,"tag":119,"props":1182,"children":1183},{"style":700},[1184],{"type":334,"value":703},{"type":314,"tag":119,"props":1186,"children":1187},{"style":337},[1188],{"type":334,"value":492},{"type":314,"tag":119,"props":1190,"children":1191},{"class":121,"line":635},[1192,1196,1200,1204,1209,1213],{"type":314,"tag":119,"props":1193,"children":1194},{"style":455},[1195],{"type":334,"value":663},{"type":314,"tag":119,"props":1197,"children":1198},{"style":337},[1199],{"type":334,"value":463},{"type":314,"tag":119,"props":1201,"children":1202},{"style":337},[1203],{"type":334,"value":154},{"type":314,"tag":119,"props":1205,"children":1206},{"style":360},[1207],{"type":334,"value":1208},"outBack",{"type":314,"tag":119,"props":1210,"children":1211},{"style":337},[1212],{"type":334,"value":407},{"type":314,"tag":119,"props":1214,"children":1215},{"style":337},[1216],{"type":334,"value":492},{"type":314,"tag":119,"props":1218,"children":1219},{"class":121,"line":657},[1220],{"type":314,"tag":119,"props":1221,"children":1222},{"style":337},[1223],{"type":334,"value":1224},"}\n",{"type":314,"tag":119,"props":1226,"children":1227},{"class":121,"line":687},[1228],{"type":314,"tag":119,"props":1229,"children":1230},{"emptyLinePlaceholder":166},[1231],{"type":334,"value":167},{"type":314,"tag":119,"props":1233,"children":1234},{"class":121,"line":710},[1235,1239,1243,1247,1252,1256,1260],{"type":314,"tag":119,"props":1236,"children":1237},{"style":395},[1238],{"type":334,"value":34},{"type":314,"tag":119,"props":1240,"children":1241},{"style":342},[1242],{"type":334,"value":177},{"type":314,"tag":119,"props":1244,"children":1245},{"style":337},[1246],{"type":334,"value":407},{"type":314,"tag":119,"props":1248,"children":1249},{"style":360},[1250],{"type":334,"value":1251},".normal",{"type":314,"tag":119,"props":1253,"children":1254},{"style":337},[1255],{"type":334,"value":407},{"type":314,"tag":119,"props":1257,"children":1258},{"style":337},[1259],{"type":334,"value":137},{"type":314,"tag":119,"props":1261,"children":1262},{"style":342},[1263],{"type":334,"value":1264}," defaults)\n",{"type":314,"tag":119,"props":1266,"children":1267},{"class":121,"line":731},[1268,1272,1276,1280,1285,1289,1293],{"type":314,"tag":119,"props":1269,"children":1270},{"style":395},[1271],{"type":334,"value":34},{"type":314,"tag":119,"props":1273,"children":1274},{"style":342},[1275],{"type":334,"value":177},{"type":314,"tag":119,"props":1277,"children":1278},{"style":337},[1279],{"type":334,"value":407},{"type":314,"tag":119,"props":1281,"children":1282},{"style":360},[1283],{"type":334,"value":1284},".snapped",{"type":314,"tag":119,"props":1286,"children":1287},{"style":337},[1288],{"type":334,"value":407},{"type":314,"tag":119,"props":1290,"children":1291},{"style":337},[1292],{"type":334,"value":137},{"type":314,"tag":119,"props":1294,"children":1295},{"style":337},[1296],{"type":334,"value":448},{"type":314,"tag":119,"props":1298,"children":1300},{"class":121,"line":1299},14,[1301,1306,1311],{"type":314,"tag":119,"props":1302,"children":1303},{"style":337},[1304],{"type":334,"value":1305},"  ...",{"type":314,"tag":119,"props":1307,"children":1308},{"style":342},[1309],{"type":334,"value":1310},"defaults",{"type":314,"tag":119,"props":1312,"children":1313},{"style":337},[1314],{"type":334,"value":492},{"type":314,"tag":119,"props":1316,"children":1318},{"class":121,"line":1317},15,[1319,1324,1328,1332,1336,1340,1344],{"type":314,"tag":119,"props":1320,"children":1321},{"style":455},[1322],{"type":334,"value":1323},"  modifier",{"type":314,"tag":119,"props":1325,"children":1326},{"style":337},[1327],{"type":334,"value":463},{"type":314,"tag":119,"props":1329,"children":1330},{"style":395},[1331],{"type":334,"value":134},{"type":314,"tag":119,"props":1333,"children":1334},{"style":342},[1335],{"type":334,"value":177},{"type":314,"tag":119,"props":1337,"children":1338},{"style":471},[1339],{"type":334,"value":181},{"type":314,"tag":119,"props":1341,"children":1342},{"style":342},[1343],{"type":334,"value":628},{"type":314,"tag":119,"props":1345,"children":1346},{"style":337},[1347],{"type":334,"value":492},{"type":314,"tag":119,"props":1349,"children":1351},{"class":121,"line":1350},16,[1352,1356],{"type":314,"tag":119,"props":1353,"children":1354},{"style":337},[1355],{"type":334,"value":737},{"type":314,"tag":119,"props":1357,"children":1358},{"style":342},[1359],{"type":334,"value":184},{"type":314,"tag":110,"props":1361,"children":1363},{"className":744,"code":1362,"filename":746,"language":747,"meta":115,"style":115},"\u003Ctemplate>\n  \u003Cdiv class=\"flex gap-4 flex-col\">\n    \u003Cdiv class=\"simple-box normal w-8\" />\n\n    \u003Cdiv class=\"simple-box snapped w-8\" />\n  \u003C/div>\n\u003C/template>\n",[1364],{"type":314,"tag":105,"props":1365,"children":1366},{"__ignoreMap":115},[1367,1382,1418,1454,1461,1497,1512],{"type":314,"tag":119,"props":1368,"children":1369},{"class":121,"line":122},[1370,1374,1378],{"type":314,"tag":119,"props":1371,"children":1372},{"style":337},[1373],{"type":334,"value":759},{"type":314,"tag":119,"props":1375,"children":1376},{"style":455},[1377],{"type":334,"value":764},{"type":314,"tag":119,"props":1379,"children":1380},{"style":337},[1381],{"type":334,"value":769},{"type":314,"tag":119,"props":1383,"children":1384},{"class":121,"line":163},[1385,1389,1393,1397,1401,1405,1410,1414],{"type":314,"tag":119,"props":1386,"children":1387},{"style":337},[1388],{"type":334,"value":777},{"type":314,"tag":119,"props":1390,"children":1391},{"style":455},[1392],{"type":334,"value":782},{"type":314,"tag":119,"props":1394,"children":1395},{"style":379},[1396],{"type":334,"value":787},{"type":314,"tag":119,"props":1398,"children":1399},{"style":337},[1400],{"type":334,"value":392},{"type":314,"tag":119,"props":1402,"children":1403},{"style":337},[1404],{"type":334,"value":796},{"type":314,"tag":119,"props":1406,"children":1407},{"style":360},[1408],{"type":334,"value":1409},"flex gap-4 flex-col",{"type":314,"tag":119,"props":1411,"children":1412},{"style":337},[1413],{"type":334,"value":796},{"type":314,"tag":119,"props":1415,"children":1416},{"style":337},[1417],{"type":334,"value":769},{"type":314,"tag":119,"props":1419,"children":1420},{"class":121,"line":170},[1421,1425,1429,1433,1437,1441,1446,1450],{"type":314,"tag":119,"props":1422,"children":1423},{"style":337},[1424],{"type":334,"value":817},{"type":314,"tag":119,"props":1426,"children":1427},{"style":455},[1428],{"type":334,"value":782},{"type":314,"tag":119,"props":1430,"children":1431},{"style":379},[1432],{"type":334,"value":787},{"type":314,"tag":119,"props":1434,"children":1435},{"style":337},[1436],{"type":334,"value":392},{"type":314,"tag":119,"props":1438,"children":1439},{"style":337},[1440],{"type":334,"value":796},{"type":314,"tag":119,"props":1442,"children":1443},{"style":360},[1444],{"type":334,"value":1445},"simple-box normal w-8",{"type":314,"tag":119,"props":1447,"children":1448},{"style":337},[1449],{"type":334,"value":796},{"type":314,"tag":119,"props":1451,"children":1452},{"style":337},[1453],{"type":334,"value":912},{"type":314,"tag":119,"props":1455,"children":1456},{"class":121,"line":187},[1457],{"type":314,"tag":119,"props":1458,"children":1459},{"emptyLinePlaceholder":166},[1460],{"type":334,"value":167},{"type":314,"tag":119,"props":1462,"children":1463},{"class":121,"line":205},[1464,1468,1472,1476,1480,1484,1489,1493],{"type":314,"tag":119,"props":1465,"children":1466},{"style":337},[1467],{"type":334,"value":817},{"type":314,"tag":119,"props":1469,"children":1470},{"style":455},[1471],{"type":334,"value":782},{"type":314,"tag":119,"props":1473,"children":1474},{"style":379},[1475],{"type":334,"value":787},{"type":314,"tag":119,"props":1477,"children":1478},{"style":337},[1479],{"type":334,"value":392},{"type":314,"tag":119,"props":1481,"children":1482},{"style":337},[1483],{"type":334,"value":796},{"type":314,"tag":119,"props":1485,"children":1486},{"style":360},[1487],{"type":334,"value":1488},"simple-box snapped w-8",{"type":314,"tag":119,"props":1490,"children":1491},{"style":337},[1492],{"type":334,"value":796},{"type":314,"tag":119,"props":1494,"children":1495},{"style":337},[1496],{"type":334,"value":912},{"type":314,"tag":119,"props":1498,"children":1499},{"class":121,"line":451},[1500,1504,1508],{"type":314,"tag":119,"props":1501,"children":1502},{"style":337},[1503],{"type":334,"value":920},{"type":314,"tag":119,"props":1505,"children":1506},{"style":455},[1507],{"type":334,"value":782},{"type":314,"tag":119,"props":1509,"children":1510},{"style":337},[1511],{"type":334,"value":769},{"type":314,"tag":119,"props":1513,"children":1514},{"class":121,"line":495},[1515,1519,1523],{"type":314,"tag":119,"props":1516,"children":1517},{"style":337},[1518],{"type":334,"value":936},{"type":314,"tag":119,"props":1520,"children":1521},{"style":455},[1522],{"type":334,"value":764},{"type":314,"tag":119,"props":1524,"children":1525},{"style":337},[1526],{"type":334,"value":769},{"type":314,"tag":1528,"props":1529,"children":1530},"snap-demo",{},[],{"type":314,"tag":950,"props":1532,"children":1535},{"className":1533,"color":955,"icon":956,"target":957,"to":1534,"variant":959},[953,954],"https://github.com/astraldev/nanime/blob/main/docs/app/components/content/examples/misc/SnapDemo.vue",[1536],{"type":334,"value":962},{"type":314,"tag":287,"props":1538,"children":1539},{},[1540],{"type":334,"value":967},1775141234246]