[{"data":1,"prerenderedAt":699},["ShallowReactive",2],{"navigation":3,"page-\u002Fit\u002Fadvanced-usage":140},[4,74],{"title":5,"path":6,"stem":7,"children":8,"page":73},"En","\u002Fen","en",[9,13,17,21,25,29,33,37,41,45,49,53,57,61,65,69],{"title":10,"path":11,"stem":12},"Getting Started","\u002Fen\u002Fgetting-started","en\u002F1.getting-started",{"title":14,"path":15,"stem":16},"Nuxt Integration","\u002Fen\u002Fnuxt-integration","en\u002F10.nuxt-integration",{"title":18,"path":19,"stem":20},"Theming","\u002Fen\u002Ftheming","en\u002F11.theming",{"title":22,"path":23,"stem":24},"SSR","\u002Fen\u002Fssr","en\u002F12.ssr",{"title":26,"path":27,"stem":28},"Performance","\u002Fen\u002Fperformance","en\u002F13.performance",{"title":30,"path":31,"stem":32},"DevTools","\u002Fen\u002Fdevtools","en\u002F14.devtools",{"title":34,"path":35,"stem":36},"FAQ","\u002Fen\u002Ffaq","en\u002F15.faq",{"title":38,"path":39,"stem":40},"Troubleshooting","\u002Fen\u002Ftroubleshooting","en\u002F16.troubleshooting",{"title":42,"path":43,"stem":44},"Installation","\u002Fen\u002Finstallation","en\u002F2.installation",{"title":46,"path":47,"stem":48},"Configuration","\u002Fen\u002Fconfiguration","en\u002F3.configuration",{"title":50,"path":51,"stem":52},"Basic Usage","\u002Fen\u002Fbasic-usage","en\u002F4.basic-usage",{"title":54,"path":55,"stem":56},"Advanced Usage","\u002Fen\u002Fadvanced-usage","en\u002F5.advanced-usage",{"title":58,"path":59,"stem":60},"Automatic Skeletonization","\u002Fen\u002Fautomatic-skeletonization","en\u002F6.automatic-skeletonization",{"title":62,"path":63,"stem":64},"Components","\u002Fen\u002Fcomponents","en\u002F7.components",{"title":66,"path":67,"stem":68},"Directives","\u002Fen\u002Fdirectives","en\u002F8.directives",{"title":70,"path":71,"stem":72},"Composables","\u002Fen\u002Fcomposables","en\u002F9.composables",false,{"title":75,"path":76,"stem":77,"children":78,"page":73},"It","\u002Fit","it",[79,83,87,91,94,98,101,104,108,112,116,120,124,128,132,136],{"title":80,"path":81,"stem":82},"Per iniziare","\u002Fit\u002Fgetting-started","it\u002F1.getting-started",{"title":84,"path":85,"stem":86},"Integrazione Nuxt","\u002Fit\u002Fnuxt-integration","it\u002F10.nuxt-integration",{"title":88,"path":89,"stem":90},"Temi","\u002Fit\u002Ftheming","it\u002F11.theming",{"title":22,"path":92,"stem":93},"\u002Fit\u002Fssr","it\u002F12.ssr",{"title":95,"path":96,"stem":97},"Prestazioni","\u002Fit\u002Fperformance","it\u002F13.performance",{"title":30,"path":99,"stem":100},"\u002Fit\u002Fdevtools","it\u002F14.devtools",{"title":34,"path":102,"stem":103},"\u002Fit\u002Ffaq","it\u002F15.faq",{"title":105,"path":106,"stem":107},"Risoluzione dei problemi","\u002Fit\u002Ftroubleshooting","it\u002F16.troubleshooting",{"title":109,"path":110,"stem":111},"Installazione","\u002Fit\u002Finstallation","it\u002F2.installation",{"title":113,"path":114,"stem":115},"Configurazione","\u002Fit\u002Fconfiguration","it\u002F3.configuration",{"title":117,"path":118,"stem":119},"Uso di base","\u002Fit\u002Fbasic-usage","it\u002F4.basic-usage",{"title":121,"path":122,"stem":123},"Uso avanzato","\u002Fit\u002Fadvanced-usage","it\u002F5.advanced-usage",{"title":125,"path":126,"stem":127},"Skeletonizzazione automatica","\u002Fit\u002Fautomatic-skeletonization","it\u002F6.automatic-skeletonization",{"title":129,"path":130,"stem":131},"Componenti","\u002Fit\u002Fcomponents","it\u002F7.components",{"title":133,"path":134,"stem":135},"Direttive","\u002Fit\u002Fdirectives","it\u002F8.directives",{"title":137,"path":138,"stem":139},"Composable","\u002Fit\u002Fcomposables","it\u002F9.composables",{"id":141,"title":121,"body":142,"description":694,"extension":695,"meta":696,"navigation":218,"path":122,"seo":697,"stem":123,"__hash__":698},"content\u002Fit\u002F5.advanced-usage.md",{"type":143,"value":144,"toc":687},"minimark",[145,149,154,162,260,266,270,273,397,404,408,411,497,501,504,617,624,628,635,683],[146,147,121],"h1",{"id":148},"uso-avanzato",[150,151,153],"h2",{"id":152},"scope","Scope",[155,156,157,161],"p",{},[158,159,160],"code",{},"\u003CSkeletonizer>"," può essere annidato liberamente. Ogni istanza può sovrascrivere lo stato globale e\nl'animazione solo per il proprio sottoalbero:",[163,164,169],"pre",{"className":165,"code":166,"language":167,"meta":168,"style":168},"language-vue shiki shiki-themes material-theme-lighter github-light github-dark","\u003CSkeletonizer :enabled=\"globalLoading\">\n  \u003CHeader \u002F>\n\n  \u003C!-- Questa scheda usa il proprio flag di caricamento e un'animazione diversa -->\n  \u003CSkeletonizer :enabled=\"cardLoading\" animation=\"pulse\">\n    \u003CPromoCard \u002F>\n  \u003C\u002FSkeletonizer>\n\u003C\u002FSkeletonizer>\n","vue","",[158,170,171,207,213,220,226,232,238,248],{"__ignoreMap":168},[172,173,176,180,184,187,191,194,198,202,204],"span",{"class":174,"line":175},"line",1,[172,177,179],{"class":178},"sP7_E","\u003C",[172,181,183],{"class":182},"sQzsp","Skeletonizer",[172,185,186],{"class":178}," :",[172,188,190],{"class":189},"s9AJx","enabled",[172,192,193],{"class":178},"=",[172,195,197],{"class":196},"sjJ54","\"",[172,199,201],{"class":200},"su5hD","globalLoading",[172,203,197],{"class":196},[172,205,206],{"class":178},">\n",[172,208,210],{"class":174,"line":209},2,[172,211,212],{"class":200},"  \u003CHeader \u002F>\n",[172,214,216],{"class":174,"line":215},3,[172,217,219],{"emptyLinePlaceholder":218},true,"\n",[172,221,223],{"class":174,"line":222},4,[172,224,225],{"class":200},"  \u003C!-- Questa scheda usa il proprio flag di caricamento e un'animazione diversa -->\n",[172,227,229],{"class":174,"line":228},5,[172,230,231],{"class":200},"  \u003CSkeletonizer :enabled=\"cardLoading\" animation=\"pulse\">\n",[172,233,235],{"class":174,"line":234},6,[172,236,237],{"class":200},"    \u003CPromoCard \u002F>\n",[172,239,241,244,246],{"class":174,"line":240},7,[172,242,243],{"class":178},"  \u003C\u002F",[172,245,183],{"class":182},[172,247,206],{"class":178},[172,249,251,253,256,258],{"class":174,"line":250},8,[172,252,179],{"class":178},[172,254,255],{"class":200},"\u002F",[172,257,183],{"class":182},[172,259,206],{"class":178},[155,261,262,263,265],{},"La prop ",[158,264,190],{}," di uno scope ha sempre la precedenza sul flag globale. Ometterla per seguire lo\nstato globale.",[150,267,269],{"id":268},"controllo-per-contenitore-tramite-il-composable","Controllo per-contenitore tramite il composable",[155,271,272],{},"Poiché il controllo è centralizzato in uno store reattivo, puoi pilotare gli skeleton da qualsiasi\npunto — una toolbar, un route guard, un'azione Pinia:",[163,274,278],{"className":275,"code":276,"language":277,"meta":168,"style":168},"language-ts shiki shiki-themes material-theme-lighter github-light github-dark","const { enable, disable, refresh } = useSkeletonizer()\n\nwatch(() => route.params.id, async () => {\n  enable()\n  await loadData()\n  disable()\n})\n","ts",[158,279,280,318,322,363,371,382,389],{"__ignoreMap":168},[172,281,282,286,289,293,296,299,301,304,307,311,315],{"class":174,"line":175},[172,283,285],{"class":284},"sbsja","const",[172,287,288],{"class":178}," {",[172,290,292],{"class":291},"s_hVV"," enable",[172,294,295],{"class":178},",",[172,297,298],{"class":291}," disable",[172,300,295],{"class":178},[172,302,303],{"class":291}," refresh",[172,305,306],{"class":178}," }",[172,308,310],{"class":309},"smGrS"," =",[172,312,314],{"class":313},"sGLFI"," useSkeletonizer",[172,316,317],{"class":200},"()\n",[172,319,320],{"class":174,"line":209},[172,321,219],{"emptyLinePlaceholder":218},[172,323,324,327,330,333,336,339,342,345,347,350,352,355,358,360],{"class":174,"line":215},[172,325,326],{"class":313},"watch",[172,328,329],{"class":200},"(",[172,331,332],{"class":178},"()",[172,334,335],{"class":284}," =>",[172,337,338],{"class":200}," route",[172,340,341],{"class":178},".",[172,343,344],{"class":200},"params",[172,346,341],{"class":178},[172,348,349],{"class":200},"id",[172,351,295],{"class":178},[172,353,354],{"class":284}," async",[172,356,357],{"class":178}," ()",[172,359,335],{"class":284},[172,361,362],{"class":178}," {\n",[172,364,365,368],{"class":174,"line":222},[172,366,367],{"class":313},"  enable",[172,369,317],{"class":370},"skxfh",[172,372,373,377,380],{"class":174,"line":228},[172,374,376],{"class":375},"sVHd0","  await",[172,378,379],{"class":313}," loadData",[172,381,317],{"class":370},[172,383,384,387],{"class":174,"line":234},[172,385,386],{"class":313},"  disable",[172,388,317],{"class":370},[172,390,391,394],{"class":174,"line":240},[172,392,393],{"class":178},"}",[172,395,396],{"class":200},")\n",[155,398,399,400,403],{},"Chiama ",[158,401,402],{},"refresh()"," dopo che il DOM cambia al di fuori della reattività di Nuxt (ad es. un widget di\nterze parti che ha montato nuovi nodi) per riscansionare tutti gli host.",[150,405,407],{"id":406},"temi-scoped","Temi scoped",[155,409,410],{},"Applica un tema a un singolo sottoalbero senza toccare il resto della pagina:",[163,412,414],{"className":165,"code":413,"language":167,"meta":168,"style":168},"\u003CSkeletonizer :enabled=\"pending\" :theme=\"{ baseColor: '#fde68a', highlightColor: '#fffbeb' }\">\n  \u003CPromoBanner \u002F>\n\u003C\u002FSkeletonizer>\n",[158,415,416,483,488],{"__ignoreMap":168},[172,417,418,420,422,424,426,428,430,433,435,437,440,442,444,447,450,453,456,460,463,465,468,470,472,475,477,479,481],{"class":174,"line":175},[172,419,179],{"class":178},[172,421,183],{"class":182},[172,423,186],{"class":178},[172,425,190],{"class":189},[172,427,193],{"class":178},[172,429,197],{"class":196},[172,431,432],{"class":200},"pending",[172,434,197],{"class":196},[172,436,186],{"class":178},[172,438,439],{"class":189},"theme",[172,441,193],{"class":178},[172,443,197],{"class":196},[172,445,446],{"class":178},"{",[172,448,449],{"class":370}," baseColor",[172,451,452],{"class":178},":",[172,454,455],{"class":196}," '",[172,457,459],{"class":458},"s_sjI","#fde68a",[172,461,462],{"class":196},"'",[172,464,295],{"class":178},[172,466,467],{"class":370}," highlightColor",[172,469,452],{"class":178},[172,471,455],{"class":196},[172,473,474],{"class":458},"#fffbeb",[172,476,462],{"class":196},[172,478,306],{"class":178},[172,480,197],{"class":196},[172,482,206],{"class":178},[172,484,485],{"class":174,"line":209},[172,486,487],{"class":200},"  \u003CPromoBanner \u002F>\n",[172,489,490,493,495],{"class":174,"line":215},[172,491,492],{"class":178},"\u003C\u002F",[172,494,183],{"class":182},[172,496,206],{"class":178},[150,498,500],{"id":499},"animazioni-personalizzate","Animazioni personalizzate",[155,502,503],{},"Registra la tua animazione a runtime e attivala:",[163,505,507],{"className":275,"code":506,"language":277,"meta":168,"style":168},"const { registerAnimation, setAnimation } = useSkeletonizer()\n\nregisterAnimation({\n  name: 'blink',\n  css: `\n    @keyframes sk-blink { 0%,100% { opacity: 1 } 50% { opacity: .3 } }\n    .sk-anim-blink .sk-bone { animation: sk-blink var(--sk-duration) infinite }\n  `,\n})\n\nsetAnimation('blink')\n",[158,508,509,531,535,545,562,572,577,582,589,596,601],{"__ignoreMap":168},[172,510,511,513,515,518,520,523,525,527,529],{"class":174,"line":175},[172,512,285],{"class":284},[172,514,288],{"class":178},[172,516,517],{"class":291}," registerAnimation",[172,519,295],{"class":178},[172,521,522],{"class":291}," setAnimation",[172,524,306],{"class":178},[172,526,310],{"class":309},[172,528,314],{"class":313},[172,530,317],{"class":200},[172,532,533],{"class":174,"line":209},[172,534,219],{"emptyLinePlaceholder":218},[172,536,537,540,542],{"class":174,"line":215},[172,538,539],{"class":313},"registerAnimation",[172,541,329],{"class":200},[172,543,544],{"class":178},"{\n",[172,546,547,550,552,554,557,559],{"class":174,"line":222},[172,548,549],{"class":370},"  name",[172,551,452],{"class":178},[172,553,455],{"class":196},[172,555,556],{"class":458},"blink",[172,558,462],{"class":196},[172,560,561],{"class":178},",\n",[172,563,564,567,569],{"class":174,"line":228},[172,565,566],{"class":370},"  css",[172,568,452],{"class":178},[172,570,571],{"class":196}," `\n",[172,573,574],{"class":174,"line":234},[172,575,576],{"class":458},"    @keyframes sk-blink { 0%,100% { opacity: 1 } 50% { opacity: .3 } }\n",[172,578,579],{"class":174,"line":240},[172,580,581],{"class":458},"    .sk-anim-blink .sk-bone { animation: sk-blink var(--sk-duration) infinite }\n",[172,583,584,587],{"class":174,"line":250},[172,585,586],{"class":196},"  `",[172,588,561],{"class":178},[172,590,592,594],{"class":174,"line":591},9,[172,593,393],{"class":178},[172,595,396],{"class":200},[172,597,599],{"class":174,"line":598},10,[172,600,219],{"emptyLinePlaceholder":218},[172,602,604,607,609,611,613,615],{"class":174,"line":603},11,[172,605,606],{"class":313},"setAnimation",[172,608,329],{"class":200},[172,610,462],{"class":196},[172,612,556],{"class":458},[172,614,462],{"class":196},[172,616,396],{"class":200},[155,618,619,620,623],{},"Vedi ",[621,622,88],"a",{"href":89}," per il riferimento completo sulle animazioni.",[150,625,627],{"id":626},"pilotare-il-motore","Pilotare il motore",[155,629,630,631,634],{},"Usa le ",[621,632,633],{"href":134},"direttive"," per regolare con precisione cosa viene skeletonizzato:",[163,636,638],{"className":165,"code":637,"language":167,"meta":168,"style":168},"\u003CSkeletonizer :enabled=\"pending\">\n  \u003CLogo v-skeleton-keep \u002F>                 \u003C!-- sempre reale -->\n  \u003Cspan v-skeleton-replace=\"'badge'\">{{ status }}\u003C\u002Fspan>\n  \u003Cli v-for=\"i in items\" v-skeleton-union>{{ i.label }}\u003C\u002Fli>\n\u003C\u002FSkeletonizer>\n",[158,639,640,660,665,670,675],{"__ignoreMap":168},[172,641,642,644,646,648,650,652,654,656,658],{"class":174,"line":175},[172,643,179],{"class":178},[172,645,183],{"class":182},[172,647,186],{"class":178},[172,649,190],{"class":189},[172,651,193],{"class":178},[172,653,197],{"class":196},[172,655,432],{"class":200},[172,657,197],{"class":196},[172,659,206],{"class":178},[172,661,662],{"class":174,"line":209},[172,663,664],{"class":200},"  \u003CLogo v-skeleton-keep \u002F>                 \u003C!-- sempre reale -->\n",[172,666,667],{"class":174,"line":215},[172,668,669],{"class":200},"  \u003Cspan v-skeleton-replace=\"'badge'\">{{ status }}\u003C\u002Fspan>\n",[172,671,672],{"class":174,"line":222},[172,673,674],{"class":200},"  \u003Cli v-for=\"i in items\" v-skeleton-union>{{ i.label }}\u003C\u002Fli>\n",[172,676,677,679,681],{"class":174,"line":228},[172,678,492],{"class":178},[172,680,183],{"class":182},[172,682,206],{"class":178},[684,685,686],"style",{},"html pre.shiki code .sP7_E, html code.shiki .sP7_E{--shiki-light:#39ADB5;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sQzsp, html code.shiki .sQzsp{--shiki-light:#E53935;--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .s9AJx, html code.shiki .s9AJx{--shiki-light:#9C3EDA;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sjJ54, html code.shiki .sjJ54{--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .su5hD, html code.shiki .su5hD{--shiki-light:#90A4AE;--shiki-default:#24292E;--shiki-dark:#E1E4E8}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 .sbsja, html code.shiki .sbsja{--shiki-light:#9C3EDA;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .s_hVV, html code.shiki .s_hVV{--shiki-light:#90A4AE;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .smGrS, html code.shiki .smGrS{--shiki-light:#39ADB5;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sGLFI, html code.shiki .sGLFI{--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .skxfh, html code.shiki .skxfh{--shiki-light:#E53935;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sVHd0, html code.shiki .sVHd0{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit}html pre.shiki code .s_sjI, html code.shiki .s_sjI{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF}",{"title":168,"searchDepth":215,"depth":215,"links":688},[689,690,691,692,693],{"id":152,"depth":209,"text":153},{"id":268,"depth":209,"text":269},{"id":406,"depth":209,"text":407},{"id":499,"depth":209,"text":500},{"id":626,"depth":209,"text":627},"Scope, controllo per-contenitore, temi scoped e animazioni personalizzate.","md",{},{"title":121,"description":694},"NXfdh5MImHixtVuF91LOfq6DeG9vJ80BEGaHvwG0q0c",1783713299220]