[{"data":1,"prerenderedAt":710},["ShallowReactive",2],{"navigation":3,"page-\u002Fit\u002Fbasic-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":117,"body":142,"description":705,"extension":706,"meta":707,"navigation":280,"path":118,"seo":708,"stem":119,"__hash__":709},"content\u002Fit\u002F4.basic-usage.md",{"type":143,"value":144,"toc":700},"minimark",[145,149,154,163,480,490,494,497,553,568,572,575,689,696],[146,147,117],"h1",{"id":148},"uso-di-base",[150,151,153],"h2",{"id":152},"avvolgi-e-attiva","Avvolgi e attiva",[155,156,157,158,162],"p",{},"Il pattern fondamentale è un singolo wrapper ",[159,160,161],"code",{},"\u003CSkeletonizer>"," collegato al tuo stato di caricamento:",[164,165,170],"pre",{"className":166,"code":167,"language":168,"meta":169,"style":169},"language-vue shiki shiki-themes material-theme-lighter github-light github-dark","\u003Cscript setup lang=\"ts\">\nconst { data: user, pending } = await useLazyFetch('\u002Fapi\u002Fuser')\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CSkeletonizer :enabled=\"pending\">\n    \u003Carticle class=\"profile\">\n      \u003Cimg :src=\"user?.avatar\" width=\"64\" height=\"64\" class=\"avatar\">\n      \u003Ch1>{{ user?.name }}\u003C\u002Fh1>\n      \u003Cp>{{ user?.bio }}\u003C\u002Fp>\n      \u003Cbutton>Segui\u003C\u002Fbutton>\n    \u003C\u002Farticle>\n  \u003C\u002FSkeletonizer>\n\u003C\u002Ftemplate>\n","vue","",[159,171,172,208,265,275,282,292,315,338,395,414,432,451,461,471],{"__ignoreMap":169},[173,174,177,181,185,189,192,195,199,203,205],"span",{"class":175,"line":176},"line",1,[173,178,180],{"class":179},"sP7_E","\u003C",[173,182,184],{"class":183},"sQzsp","script",[173,186,188],{"class":187},"s9AJx"," setup",[173,190,191],{"class":187}," lang",[173,193,194],{"class":179},"=",[173,196,198],{"class":197},"sjJ54","\"",[173,200,202],{"class":201},"s_sjI","ts",[173,204,198],{"class":197},[173,206,207],{"class":179},">\n",[173,209,211,215,218,222,225,229,232,235,238,242,246,250,254,257,260,262],{"class":175,"line":210},2,[173,212,214],{"class":213},"sbsja","const",[173,216,217],{"class":179}," {",[173,219,221],{"class":220},"sucvu"," data",[173,223,224],{"class":179},":",[173,226,228],{"class":227},"s_hVV"," user",[173,230,231],{"class":179},",",[173,233,234],{"class":227}," pending",[173,236,237],{"class":179}," }",[173,239,241],{"class":240},"smGrS"," =",[173,243,245],{"class":244},"sVHd0"," await",[173,247,249],{"class":248},"sGLFI"," useLazyFetch",[173,251,253],{"class":252},"su5hD","(",[173,255,256],{"class":197},"'",[173,258,259],{"class":201},"\u002Fapi\u002Fuser",[173,261,256],{"class":197},[173,263,264],{"class":252},")\n",[173,266,268,271,273],{"class":175,"line":267},3,[173,269,270],{"class":179},"\u003C\u002F",[173,272,184],{"class":183},[173,274,207],{"class":179},[173,276,278],{"class":175,"line":277},4,[173,279,281],{"emptyLinePlaceholder":280},true,"\n",[173,283,285,287,290],{"class":175,"line":284},5,[173,286,180],{"class":179},[173,288,289],{"class":183},"template",[173,291,207],{"class":179},[173,293,295,298,301,304,306,308,311,313],{"class":175,"line":294},6,[173,296,297],{"class":179},"  \u003C",[173,299,300],{"class":183},"Skeletonizer",[173,302,303],{"class":187}," :enabled",[173,305,194],{"class":179},[173,307,198],{"class":197},[173,309,310],{"class":201},"pending",[173,312,198],{"class":197},[173,314,207],{"class":179},[173,316,318,321,324,327,329,331,334,336],{"class":175,"line":317},7,[173,319,320],{"class":179},"    \u003C",[173,322,323],{"class":183},"article",[173,325,326],{"class":187}," class",[173,328,194],{"class":179},[173,330,198],{"class":197},[173,332,333],{"class":201},"profile",[173,335,198],{"class":197},[173,337,207],{"class":179},[173,339,341,344,347,350,352,354,357,359,362,364,366,369,371,374,376,378,380,382,384,386,388,391,393],{"class":175,"line":340},8,[173,342,343],{"class":179},"      \u003C",[173,345,346],{"class":183},"img",[173,348,349],{"class":187}," :src",[173,351,194],{"class":179},[173,353,198],{"class":197},[173,355,356],{"class":201},"user?.avatar",[173,358,198],{"class":197},[173,360,361],{"class":187}," width",[173,363,194],{"class":179},[173,365,198],{"class":197},[173,367,368],{"class":201},"64",[173,370,198],{"class":197},[173,372,373],{"class":187}," height",[173,375,194],{"class":179},[173,377,198],{"class":197},[173,379,368],{"class":201},[173,381,198],{"class":197},[173,383,326],{"class":187},[173,385,194],{"class":179},[173,387,198],{"class":197},[173,389,390],{"class":201},"avatar",[173,392,198],{"class":197},[173,394,207],{"class":179},[173,396,398,400,402,405,408,410,412],{"class":175,"line":397},9,[173,399,343],{"class":179},[173,401,146],{"class":183},[173,403,404],{"class":179},">",[173,406,407],{"class":252},"{{ user?.name }}",[173,409,270],{"class":179},[173,411,146],{"class":183},[173,413,207],{"class":179},[173,415,417,419,421,423,426,428,430],{"class":175,"line":416},10,[173,418,343],{"class":179},[173,420,155],{"class":183},[173,422,404],{"class":179},[173,424,425],{"class":252},"{{ user?.bio }}",[173,427,270],{"class":179},[173,429,155],{"class":183},[173,431,207],{"class":179},[173,433,435,437,440,442,445,447,449],{"class":175,"line":434},11,[173,436,343],{"class":179},[173,438,439],{"class":183},"button",[173,441,404],{"class":179},[173,443,444],{"class":252},"Segui",[173,446,270],{"class":179},[173,448,439],{"class":183},[173,450,207],{"class":179},[173,452,454,457,459],{"class":175,"line":453},12,[173,455,456],{"class":179},"    \u003C\u002F",[173,458,323],{"class":183},[173,460,207],{"class":179},[173,462,464,467,469],{"class":175,"line":463},13,[173,465,466],{"class":179},"  \u003C\u002F",[173,468,300],{"class":183},[173,470,207],{"class":179},[173,472,474,476,478],{"class":175,"line":473},14,[173,475,270],{"class":179},[173,477,289],{"class":183},[173,479,207],{"class":179},[155,481,482,483,485,486,489],{},"Mentre ",[159,484,310],{}," è ",[159,487,488],{},"true",", l'avatar, il titolo, il paragrafo e il pulsante vengono renderizzati come\nossa animate. Quando la fetch si risolve, gli originali vengono ripristinati all'istante — nello\nstesso punto, senza alcuno spostamento del layout.",[150,491,493],{"id":492},"controllo-globale","Controllo globale",[155,495,496],{},"Da qualsiasi punto della tua app puoi pilotare lo stato globale dello skeleton:",[164,498,501],{"className":499,"code":500,"language":202,"meta":169,"style":169},"language-ts shiki shiki-themes material-theme-lighter github-light github-dark","const skeletonizer = useSkeletonizer()\nskeletonizer.enable()\nskeletonizer.disable()\nskeletonizer.toggle()\n",[159,502,503,518,531,542],{"__ignoreMap":169},[173,504,505,507,510,512,515],{"class":175,"line":176},[173,506,214],{"class":213},[173,508,509],{"class":227}," skeletonizer",[173,511,241],{"class":240},[173,513,514],{"class":248}," useSkeletonizer",[173,516,517],{"class":252},"()\n",[173,519,520,523,526,529],{"class":175,"line":210},[173,521,522],{"class":252},"skeletonizer",[173,524,525],{"class":179},".",[173,527,528],{"class":248},"enable",[173,530,517],{"class":252},[173,532,533,535,537,540],{"class":175,"line":267},[173,534,522],{"class":252},[173,536,525],{"class":179},[173,538,539],{"class":248},"disable",[173,541,517],{"class":252},[173,543,544,546,548,551],{"class":175,"line":277},[173,545,522],{"class":252},[173,547,525],{"class":179},[173,549,550],{"class":248},"toggle",[173,552,517],{"class":252},[155,554,555,556,558,559,563,564,567],{},"Qualsiasi ",[159,557,161],{}," ",[560,561,562],"strong",{},"senza"," una prop ",[159,565,566],{},":enabled"," esplicita segue questo flag globale.",[150,569,571],{"id":570},"primitive-manuali","Primitive manuali",[155,573,574],{},"Preferisci comporre uno skeleton a mano (ad es. per contenuti non ancora renderizzati)? Usa i\nmattoncini di base:",[164,576,578],{"className":166,"code":577,"language":168,"meta":169,"style":169},"\u003Ctemplate>\n  \u003CSkeletonList :items=\"6\" :lines=\"2\" \u002F>\n  \u003CSkeletonTable :rows=\"10\" :columns=\"5\" \u002F>\n  \u003CSkeletonCard media avatar :lines=\"3\" \u002F>\n\u003C\u002Ftemplate>\n",[159,579,580,588,622,655,681],{"__ignoreMap":169},[173,581,582,584,586],{"class":175,"line":176},[173,583,180],{"class":179},[173,585,289],{"class":183},[173,587,207],{"class":179},[173,589,590,592,595,598,600,602,605,607,610,612,614,617,619],{"class":175,"line":210},[173,591,297],{"class":179},[173,593,594],{"class":183},"SkeletonList",[173,596,597],{"class":187}," :items",[173,599,194],{"class":179},[173,601,198],{"class":197},[173,603,604],{"class":201},"6",[173,606,198],{"class":197},[173,608,609],{"class":187}," :lines",[173,611,194],{"class":179},[173,613,198],{"class":197},[173,615,616],{"class":201},"2",[173,618,198],{"class":197},[173,620,621],{"class":179}," \u002F>\n",[173,623,624,626,629,632,634,636,639,641,644,646,648,651,653],{"class":175,"line":267},[173,625,297],{"class":179},[173,627,628],{"class":183},"SkeletonTable",[173,630,631],{"class":187}," :rows",[173,633,194],{"class":179},[173,635,198],{"class":197},[173,637,638],{"class":201},"10",[173,640,198],{"class":197},[173,642,643],{"class":187}," :columns",[173,645,194],{"class":179},[173,647,198],{"class":197},[173,649,650],{"class":201},"5",[173,652,198],{"class":197},[173,654,621],{"class":179},[173,656,657,659,662,665,668,670,672,674,677,679],{"class":175,"line":277},[173,658,297],{"class":179},[173,660,661],{"class":183},"SkeletonCard",[173,663,664],{"class":187}," media",[173,666,667],{"class":187}," avatar",[173,669,609],{"class":187},[173,671,194],{"class":179},[173,673,198],{"class":197},[173,675,676],{"class":201},"3",[173,678,198],{"class":197},[173,680,621],{"class":179},[173,682,683,685,687],{"class":175,"line":284},[173,684,270],{"class":179},[173,686,289],{"class":183},[173,688,207],{"class":179},[155,690,691,692,695],{},"Vedi ",[693,694,129],"a",{"href":130}," per l'elenco completo.",[697,698,699],"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 .s_sjI, html code.shiki .s_sjI{--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sbsja, html code.shiki .sbsja{--shiki-light:#9C3EDA;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sucvu, html code.shiki .sucvu{--shiki-light:#E53935;--shiki-default:#E36209;--shiki-dark:#FFAB70}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 .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 .sGLFI, html code.shiki .sGLFI{--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0}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);}",{"title":169,"searchDepth":267,"depth":267,"links":701},[702,703,704],{"id":152,"depth":210,"text":153},{"id":492,"depth":210,"text":493},{"id":570,"depth":210,"text":571},"Avvolgi un componente, collega un flag di caricamento, fatto.","md",{},{"title":117,"description":705},"xhBqrNFImnlGY7wPQj4uRSgGtxJkFnzldhlv2Otgnqc",1783713299219]