[{"data":1,"prerenderedAt":945},["ShallowReactive",2],{"navigation_docs":3,"-composables-use-animatable":81,"-composables-use-animatable-surround":411,"preview-examples/composables/AnimatableDemo.vue":416,"mdc-yxtbhh-key":417},[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":44,"body":83,"description":405,"extension":95,"links":406,"meta":407,"navigation":408,"path":45,"seo":409,"stem":46,"__hash__":410},"docs/2.composables/3.use-animatable.md",{"type":84,"value":85,"toc":395},"minimark",[86,97,109,124,129,192,197,218,222,226,230,237,248,346,350,354,384,391],[87,88,90],"nuxt-link",{"to":89},"/composables#instant-play",[91,92],"badge",{"icon":93,"label":94,"size":95,"variant":96},"mage:zap-fill","Instant play","md","soft",[98,99,100,101,108],"p",{},"Wrapper for the ",[102,103,107],"a",{"href":104,"rel":105},"https://animejs.com/documentation/animatable",[106],"nofollow","createAnimatable"," function from AnimeJS.",[110,111,112],"blockquote",{},[98,113,114,115,119,120,123],{},"Efficiently animates target properties, making it an ideal replacement for ",[116,117,118],"code",{},"animate()","\nand ",[116,121,122],{},"utils.set()"," in situations where values change frequently,\nsuch as cursor events or animation loops.",[125,126,128],"h2",{"id":127},"type-definition","Type Definition",[130,131,136],"pre",{"className":132,"code":133,"language":134,"meta":135,"style":135},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","function useAnimatable(\n  target: AnimeTargets,\n  parameters: AnimatableParams\n): AnimatableObject\n","ts","",[116,137,138,155,172,183],{"__ignoreMap":135},[139,140,143,147,151],"span",{"class":141,"line":142},"line",1,[139,144,146],{"class":145},"spNyl","function",[139,148,150],{"class":149},"s2Zo4"," useAnimatable",[139,152,154],{"class":153},"sMK4o","(\n",[139,156,158,162,165,169],{"class":141,"line":157},2,[139,159,161],{"class":160},"sHdIc","  target",[139,163,164],{"class":153},":",[139,166,168],{"class":167},"sBMFI"," AnimeTargets",[139,170,171],{"class":153},",\n",[139,173,175,178,180],{"class":141,"line":174},3,[139,176,177],{"class":160},"  parameters",[139,179,164],{"class":153},[139,181,182],{"class":167}," AnimatableParams\n",[139,184,186,189],{"class":141,"line":185},4,[139,187,188],{"class":153},"):",[139,190,191],{"class":167}," AnimatableObject\n",[193,194,196],"h3",{"id":195},"arguments","Arguments",[198,199,200,207],"field-group",{},[201,202,206],"field",{"name":203,"type":204,":required":205},"target","AnimeTargets","true","The reactive object or array of objects to animate.",[201,208,211,212,217],{"name":209,"type":210},"parameters","AnimatableParams","See ",[102,213,216],{"href":214,"rel":215},"https://animejs.com/documentation/animatable/animatable-settings",[106],"AnimeJS Animatable Properties",".",[125,219,221],{"id":220},"usage","Usage",[223,224],"render-code-block-preview",{"src":225},"examples/composables/AnimatableDemo.vue",[125,227,229],{"id":228},"return-value","Return Value",[98,231,232,233,236],{},"Returns a ",[116,234,235],{},"shallowReactive"," object wrapping the AnimeJS animatable instance.",[238,239,240,244,245,247],"warning",{},[241,242,243],"strong",{},"Do not destructure"," the return value. The instance is wrapped in ",[116,246,235],{}," to maintain reactivity. Destructuring will break the connection to the underlying AnimeJS instance updates.",[130,249,251],{"className":132,"code":250,"language":134,"meta":135,"style":135},"// ❌ Avoid destructuring\nconst { revert } = useAnimatable(obj, { ... })\n\n// ✅ Access methods directly\nconst animation = useAnimatable(obj, { ... })\nanimation.revert()\n",[116,252,253,259,296,302,307,332],{"__ignoreMap":135},[139,254,255],{"class":141,"line":142},[139,256,258],{"class":257},"sHwdD","// ❌ Avoid destructuring\n",[139,260,261,264,267,271,274,277,279,282,285,287,290,293],{"class":141,"line":157},[139,262,263],{"class":145},"const",[139,265,266],{"class":153}," {",[139,268,270],{"class":269},"sTEyZ"," revert ",[139,272,273],{"class":153},"}",[139,275,276],{"class":153}," =",[139,278,150],{"class":149},[139,280,281],{"class":269},"(obj",[139,283,284],{"class":153},",",[139,286,266],{"class":153},[139,288,289],{"class":153}," ...",[139,291,292],{"class":153}," }",[139,294,295],{"class":269},")\n",[139,297,298],{"class":141,"line":174},[139,299,301],{"emptyLinePlaceholder":300},true,"\n",[139,303,304],{"class":141,"line":185},[139,305,306],{"class":257},"// ✅ Access methods directly\n",[139,308,310,312,315,318,320,322,324,326,328,330],{"class":141,"line":309},5,[139,311,263],{"class":145},[139,313,314],{"class":269}," animation ",[139,316,317],{"class":153},"=",[139,319,150],{"class":149},[139,321,281],{"class":269},[139,323,284],{"class":153},[139,325,266],{"class":153},[139,327,289],{"class":153},[139,329,292],{"class":153},[139,331,295],{"class":269},[139,333,335,338,340,343],{"class":141,"line":334},6,[139,336,337],{"class":269},"animation",[139,339,217],{"class":153},[139,341,342],{"class":149},"revert",[139,344,345],{"class":269},"()\n",[125,347,349],{"id":348},"api","API",[193,351,353],{"id":352},"types","Types",[130,355,357],{"className":132,"code":356,"language":134,"meta":135,"style":135},"type AnimeTargets = TargetsParam | MaybeElementRef | MaybeElementRef[]\n",[116,358,359],{"__ignoreMap":135},[139,360,361,364,366,368,371,374,377,379,381],{"class":141,"line":142},[139,362,363],{"class":145},"type",[139,365,168],{"class":167},[139,367,276],{"class":153},[139,369,370],{"class":167}," TargetsParam",[139,372,373],{"class":153}," |",[139,375,376],{"class":167}," MaybeElementRef",[139,378,373],{"class":153},[139,380,376],{"class":167},[139,382,383],{"class":269},"[]\n",[98,385,211,386,390],{},[102,387,389],{"href":104,"rel":388},[106],"AnimeJS Animatable documentation"," for more details.",[392,393,394],"style",{},"html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}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 .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}",{"title":135,"searchDepth":157,"depth":157,"links":396},[397,400,401,402],{"id":127,"depth":157,"text":128,"children":398},[399],{"id":195,"depth":174,"text":196},{"id":220,"depth":157,"text":221},{"id":228,"depth":157,"text":229},{"id":348,"depth":157,"text":349,"children":403},[404],{"id":352,"depth":174,"text":353},"Documentation for useAnimatable composable.",null,{},{"icon":47},{"title":44,"description":405},"wv2yA0NXmSxNn3uWmhRoT9qDj2kEhd5pfN7pCH6cVG4",[412,414],{"title":39,"path":40,"stem":41,"description":413,"icon":42,"children":-1},"Documentation for useWaapiAnimate composable.",{"title":49,"path":50,"stem":51,"description":415,"icon":52,"children":-1},"Documentation for useSplitText composable.","\n::code-group\n```ts [Script]\nimport { useIntervalFn } from '@vueuse/core'\nimport { round } from '#nanime/utils'\n\nconst counter = reactive({ x: 0 })\nconst animator = useAnimatable(counter, {\n  x: 100,\n  duration: 10000,\n  modifier: round(0),\n  ease: 'outElastic',\n})\n\nuseIntervalFn(() => {\n  animator.x?.(counter.x + 1)\n}, 1000)\n```\n\n```vue [Template]\n\u003Ctemplate>\n  \u003Cp>Counter: {{ JSON.stringify(counter) }}\u003C/p>\n\u003C/template>\n```\n\n\n::\n\n::animatable-demo\n::\n\n::u-button\n---\nto: https://github.com/astraldev/nanime/blob/main/docs/app/components/content/examples/composables/AnimatableDemo.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":418,"body":419},{},{"type":420,"children":421},"root",[422,922,926,940],{"type":423,"tag":424,"props":425,"children":426},"element","code-group",{},[427,844],{"type":423,"tag":130,"props":428,"children":431},{"className":132,"code":429,"filename":430,"language":134,"meta":135,"style":135},"import { useIntervalFn } from '@vueuse/core'\nimport { round } from '#nanime/utils'\n\nconst counter = reactive({ x: 0 })\nconst animator = useAnimatable(counter, {\n  x: 100,\n  duration: 10000,\n  modifier: round(0),\n  ease: 'outElastic',\n})\n\nuseIntervalFn(() => {\n  animator.x?.(counter.x + 1)\n}, 1000)\n","Script",[432],{"type":423,"tag":116,"props":433,"children":434},{"__ignoreMap":135},[435,481,518,525,582,616,637,659,694,725,737,745,772,826],{"type":423,"tag":139,"props":436,"children":437},{"class":141,"line":142},[438,445,450,456,460,465,470,476],{"type":423,"tag":139,"props":439,"children":441},{"style":440},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[442],{"type":443,"value":444},"text","import",{"type":423,"tag":139,"props":446,"children":448},{"style":447},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[449],{"type":443,"value":266},{"type":423,"tag":139,"props":451,"children":453},{"style":452},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[454],{"type":443,"value":455}," useIntervalFn",{"type":423,"tag":139,"props":457,"children":458},{"style":447},[459],{"type":443,"value":292},{"type":423,"tag":139,"props":461,"children":462},{"style":440},[463],{"type":443,"value":464}," from",{"type":423,"tag":139,"props":466,"children":467},{"style":447},[468],{"type":443,"value":469}," '",{"type":423,"tag":139,"props":471,"children":473},{"style":472},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[474],{"type":443,"value":475},"@vueuse/core",{"type":423,"tag":139,"props":477,"children":478},{"style":447},[479],{"type":443,"value":480},"'\n",{"type":423,"tag":139,"props":482,"children":483},{"class":141,"line":157},[484,488,492,497,501,505,509,514],{"type":423,"tag":139,"props":485,"children":486},{"style":440},[487],{"type":443,"value":444},{"type":423,"tag":139,"props":489,"children":490},{"style":447},[491],{"type":443,"value":266},{"type":423,"tag":139,"props":493,"children":494},{"style":452},[495],{"type":443,"value":496}," round",{"type":423,"tag":139,"props":498,"children":499},{"style":447},[500],{"type":443,"value":292},{"type":423,"tag":139,"props":502,"children":503},{"style":440},[504],{"type":443,"value":464},{"type":423,"tag":139,"props":506,"children":507},{"style":447},[508],{"type":443,"value":469},{"type":423,"tag":139,"props":510,"children":511},{"style":472},[512],{"type":443,"value":513},"#nanime/utils",{"type":423,"tag":139,"props":515,"children":516},{"style":447},[517],{"type":443,"value":480},{"type":423,"tag":139,"props":519,"children":520},{"class":141,"line":174},[521],{"type":423,"tag":139,"props":522,"children":523},{"emptyLinePlaceholder":300},[524],{"type":443,"value":301},{"type":423,"tag":139,"props":526,"children":527},{"class":141,"line":185},[528,533,538,542,548,553,558,564,568,574,578],{"type":423,"tag":139,"props":529,"children":531},{"style":530},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[532],{"type":443,"value":263},{"type":423,"tag":139,"props":534,"children":535},{"style":452},[536],{"type":443,"value":537}," counter ",{"type":423,"tag":139,"props":539,"children":540},{"style":447},[541],{"type":443,"value":317},{"type":423,"tag":139,"props":543,"children":545},{"style":544},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[546],{"type":443,"value":547}," reactive",{"type":423,"tag":139,"props":549,"children":550},{"style":452},[551],{"type":443,"value":552},"(",{"type":423,"tag":139,"props":554,"children":555},{"style":447},[556],{"type":443,"value":557},"{",{"type":423,"tag":139,"props":559,"children":561},{"style":560},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[562],{"type":443,"value":563}," x",{"type":423,"tag":139,"props":565,"children":566},{"style":447},[567],{"type":443,"value":164},{"type":423,"tag":139,"props":569,"children":571},{"style":570},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[572],{"type":443,"value":573}," 0",{"type":423,"tag":139,"props":575,"children":576},{"style":447},[577],{"type":443,"value":292},{"type":423,"tag":139,"props":579,"children":580},{"style":452},[581],{"type":443,"value":295},{"type":423,"tag":139,"props":583,"children":584},{"class":141,"line":309},[585,589,594,598,602,607,611],{"type":423,"tag":139,"props":586,"children":587},{"style":530},[588],{"type":443,"value":263},{"type":423,"tag":139,"props":590,"children":591},{"style":452},[592],{"type":443,"value":593}," animator ",{"type":423,"tag":139,"props":595,"children":596},{"style":447},[597],{"type":443,"value":317},{"type":423,"tag":139,"props":599,"children":600},{"style":544},[601],{"type":443,"value":150},{"type":423,"tag":139,"props":603,"children":604},{"style":452},[605],{"type":443,"value":606},"(counter",{"type":423,"tag":139,"props":608,"children":609},{"style":447},[610],{"type":443,"value":284},{"type":423,"tag":139,"props":612,"children":613},{"style":447},[614],{"type":443,"value":615}," {\n",{"type":423,"tag":139,"props":617,"children":618},{"class":141,"line":334},[619,624,628,633],{"type":423,"tag":139,"props":620,"children":621},{"style":560},[622],{"type":443,"value":623},"  x",{"type":423,"tag":139,"props":625,"children":626},{"style":447},[627],{"type":443,"value":164},{"type":423,"tag":139,"props":629,"children":630},{"style":570},[631],{"type":443,"value":632}," 100",{"type":423,"tag":139,"props":634,"children":635},{"style":447},[636],{"type":443,"value":171},{"type":423,"tag":139,"props":638,"children":640},{"class":141,"line":639},7,[641,646,650,655],{"type":423,"tag":139,"props":642,"children":643},{"style":560},[644],{"type":443,"value":645},"  duration",{"type":423,"tag":139,"props":647,"children":648},{"style":447},[649],{"type":443,"value":164},{"type":423,"tag":139,"props":651,"children":652},{"style":570},[653],{"type":443,"value":654}," 10000",{"type":423,"tag":139,"props":656,"children":657},{"style":447},[658],{"type":443,"value":171},{"type":423,"tag":139,"props":660,"children":662},{"class":141,"line":661},8,[663,668,672,676,680,685,690],{"type":423,"tag":139,"props":664,"children":665},{"style":560},[666],{"type":443,"value":667},"  modifier",{"type":423,"tag":139,"props":669,"children":670},{"style":447},[671],{"type":443,"value":164},{"type":423,"tag":139,"props":673,"children":674},{"style":544},[675],{"type":443,"value":496},{"type":423,"tag":139,"props":677,"children":678},{"style":452},[679],{"type":443,"value":552},{"type":423,"tag":139,"props":681,"children":682},{"style":570},[683],{"type":443,"value":684},"0",{"type":423,"tag":139,"props":686,"children":687},{"style":452},[688],{"type":443,"value":689},")",{"type":423,"tag":139,"props":691,"children":692},{"style":447},[693],{"type":443,"value":171},{"type":423,"tag":139,"props":695,"children":697},{"class":141,"line":696},9,[698,703,707,711,716,721],{"type":423,"tag":139,"props":699,"children":700},{"style":560},[701],{"type":443,"value":702},"  ease",{"type":423,"tag":139,"props":704,"children":705},{"style":447},[706],{"type":443,"value":164},{"type":423,"tag":139,"props":708,"children":709},{"style":447},[710],{"type":443,"value":469},{"type":423,"tag":139,"props":712,"children":713},{"style":472},[714],{"type":443,"value":715},"outElastic",{"type":423,"tag":139,"props":717,"children":718},{"style":447},[719],{"type":443,"value":720},"'",{"type":423,"tag":139,"props":722,"children":723},{"style":447},[724],{"type":443,"value":171},{"type":423,"tag":139,"props":726,"children":728},{"class":141,"line":727},10,[729,733],{"type":423,"tag":139,"props":730,"children":731},{"style":447},[732],{"type":443,"value":273},{"type":423,"tag":139,"props":734,"children":735},{"style":452},[736],{"type":443,"value":295},{"type":423,"tag":139,"props":738,"children":740},{"class":141,"line":739},11,[741],{"type":423,"tag":139,"props":742,"children":743},{"emptyLinePlaceholder":300},[744],{"type":443,"value":301},{"type":423,"tag":139,"props":746,"children":748},{"class":141,"line":747},12,[749,754,758,763,768],{"type":423,"tag":139,"props":750,"children":751},{"style":544},[752],{"type":443,"value":753},"useIntervalFn",{"type":423,"tag":139,"props":755,"children":756},{"style":452},[757],{"type":443,"value":552},{"type":423,"tag":139,"props":759,"children":760},{"style":447},[761],{"type":443,"value":762},"()",{"type":423,"tag":139,"props":764,"children":765},{"style":530},[766],{"type":443,"value":767}," =>",{"type":423,"tag":139,"props":769,"children":770},{"style":447},[771],{"type":443,"value":615},{"type":423,"tag":139,"props":773,"children":775},{"class":141,"line":774},13,[776,781,785,790,795,799,804,808,812,817,822],{"type":423,"tag":139,"props":777,"children":778},{"style":452},[779],{"type":443,"value":780},"  animator",{"type":423,"tag":139,"props":782,"children":783},{"style":447},[784],{"type":443,"value":217},{"type":423,"tag":139,"props":786,"children":787},{"style":544},[788],{"type":443,"value":789},"x",{"type":423,"tag":139,"props":791,"children":792},{"style":447},[793],{"type":443,"value":794},"?.",{"type":423,"tag":139,"props":796,"children":797},{"style":560},[798],{"type":443,"value":552},{"type":423,"tag":139,"props":800,"children":801},{"style":452},[802],{"type":443,"value":803},"counter",{"type":423,"tag":139,"props":805,"children":806},{"style":447},[807],{"type":443,"value":217},{"type":423,"tag":139,"props":809,"children":810},{"style":452},[811],{"type":443,"value":789},{"type":423,"tag":139,"props":813,"children":814},{"style":447},[815],{"type":443,"value":816}," +",{"type":423,"tag":139,"props":818,"children":819},{"style":570},[820],{"type":443,"value":821}," 1",{"type":423,"tag":139,"props":823,"children":824},{"style":560},[825],{"type":443,"value":295},{"type":423,"tag":139,"props":827,"children":829},{"class":141,"line":828},14,[830,835,840],{"type":423,"tag":139,"props":831,"children":832},{"style":447},[833],{"type":443,"value":834},"},",{"type":423,"tag":139,"props":836,"children":837},{"style":570},[838],{"type":443,"value":839}," 1000",{"type":423,"tag":139,"props":841,"children":842},{"style":452},[843],{"type":443,"value":295},{"type":423,"tag":130,"props":845,"children":850},{"className":846,"code":847,"filename":848,"language":849,"meta":135,"style":135},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n  \u003Cp>Counter: {{ JSON.stringify(counter) }}\u003C/p>\n\u003C/template>\n","Template","vue",[851],{"type":423,"tag":116,"props":852,"children":853},{"__ignoreMap":135},[854,872,907],{"type":423,"tag":139,"props":855,"children":856},{"class":141,"line":142},[857,862,867],{"type":423,"tag":139,"props":858,"children":859},{"style":447},[860],{"type":443,"value":861},"\u003C",{"type":423,"tag":139,"props":863,"children":864},{"style":560},[865],{"type":443,"value":866},"template",{"type":423,"tag":139,"props":868,"children":869},{"style":447},[870],{"type":443,"value":871},">\n",{"type":423,"tag":139,"props":873,"children":874},{"class":141,"line":157},[875,880,884,889,894,899,903],{"type":423,"tag":139,"props":876,"children":877},{"style":447},[878],{"type":443,"value":879},"  \u003C",{"type":423,"tag":139,"props":881,"children":882},{"style":560},[883],{"type":443,"value":98},{"type":423,"tag":139,"props":885,"children":886},{"style":447},[887],{"type":443,"value":888},">",{"type":423,"tag":139,"props":890,"children":891},{"style":452},[892],{"type":443,"value":893},"Counter: {{ JSON.stringify(counter) }}",{"type":423,"tag":139,"props":895,"children":896},{"style":447},[897],{"type":443,"value":898},"\u003C/",{"type":423,"tag":139,"props":900,"children":901},{"style":560},[902],{"type":443,"value":98},{"type":423,"tag":139,"props":904,"children":905},{"style":447},[906],{"type":443,"value":871},{"type":423,"tag":139,"props":908,"children":909},{"class":141,"line":174},[910,914,918],{"type":423,"tag":139,"props":911,"children":912},{"style":447},[913],{"type":443,"value":898},{"type":423,"tag":139,"props":915,"children":916},{"style":560},[917],{"type":443,"value":866},{"type":423,"tag":139,"props":919,"children":920},{"style":447},[921],{"type":443,"value":871},{"type":423,"tag":923,"props":924,"children":925},"animatable-demo",{},[],{"type":423,"tag":927,"props":928,"children":937},"u-button",{"className":929,"color":932,"icon":933,"target":934,"to":935,"variant":936},[930,931],"mt-2.5","pl-0.5","neutral","i-simple-icons-github","_blank","https://github.com/astraldev/nanime/blob/main/docs/app/components/content/examples/composables/AnimatableDemo.vue","link",[938],{"type":443,"value":939},"View on GitHub",{"type":423,"tag":392,"props":941,"children":942},{},[943],{"type":443,"value":944},"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);}",1774818375738]