[{"data":1,"prerenderedAt":6382},["ShallowReactive",2],{"navigation_docs":3,"-essentials-components":70,"-essentials-components-surround":6377},[4,30,60],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Getting Started",false,"\u002Fgetting-started","1.getting-started",[10,15,20,25],{"title":11,"path":12,"stem":13,"icon":14},"Introduction","\u002Fgetting-started\u002Fintroduction","1.getting-started\u002F2.introduction","i-lucide-house",{"title":16,"path":17,"stem":18,"icon":19},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F3.installation","i-lucide-download",{"title":21,"path":22,"stem":23,"icon":24},"Quick Start","\u002Fgetting-started\u002Fquick-start","1.getting-started\u002F4.quick-start","i-lucide-rocket",{"title":26,"path":27,"stem":28,"icon":29},"Configuration","\u002Fgetting-started\u002Fconfiguration","1.getting-started\u002F5.configuration","i-lucide-settings",{"title":31,"path":32,"stem":33,"children":34,"page":6},"Essentials","\u002Fessentials","2.essentials",[35,40,45,50,55],{"title":36,"path":37,"stem":38,"icon":39},"Composables","\u002Fessentials\u002Fcomposables","2.essentials\u002F1.composables","i-lucide-code",{"title":41,"path":42,"stem":43,"icon":44},"Components","\u002Fessentials\u002Fcomponents","2.essentials\u002F2.components","i-lucide-layers",{"title":46,"path":47,"stem":48,"icon":49},"Image Optimization","\u002Fessentials\u002Fimage-optimization","2.essentials\u002F3.image-optimization","i-lucide-image",{"title":51,"path":52,"stem":53,"icon":54},"Personalization","\u002Fessentials\u002Fpersonalization","2.essentials\u002F4.personalization","i-lucide-users",{"title":56,"path":57,"stem":58,"icon":59},"Performance Optimization","\u002Fessentials\u002Fperformance","2.essentials\u002F5.performance","i-lucide-zap",{"title":61,"path":62,"stem":63,"children":64,"page":6},"Features","\u002Ffeatures","3.features",[65],{"title":66,"path":67,"stem":68,"icon":69},"Live Preview","\u002Ffeatures\u002Flive-preview","3.features\u002F1.live-preview","i-lucide-eye",{"id":71,"title":41,"body":72,"description":6370,"extension":6371,"links":6372,"meta":6373,"navigation":6374,"path":42,"seo":6375,"stem":43,"__hash__":6376},"docs\u002F2.essentials\u002F2.components.md",{"type":73,"value":74,"toc":6339},"minimark",[75,80,84,89,92,95,124,127,130,145,167,171,174,248,252,255,260,263,726,730,733,999,1003,1410,1414,1418,1504,1508,1695,1699,1828,1832,1904,1908,1919,1923,1926,2026,2030,2033,2118,2122,2125,2223,2227,2234,2331,2345,2349,2352,2356,2582,2586,2794,2798,2801,2908,2912,2915,3028,3032,3035,3058,3253,3257,3260,3312,3316,3728,3732,3735,3785,3788,3791,3836,3839,3879,3883,3891,3895,3898,3964,3968,3971,3975,4495,4499,5557,5561,5565,5571,5575,5582,5739,5833,5845,5849,5852,6019,6121,6125,6311,6315,6326,6336],[76,77,79],"h2",{"id":78},"contentstackmodularblocks-component","ContentstackModularBlocks Component",[81,82,83],"p",{},"A flexible, generic component for rendering Contentstack modular blocks as Vue components. Perfect for dynamic page layouts, component libraries, and content-driven UIs.",[85,86,88],"h3",{"id":87},"what-are-modular-blocks","What are Modular Blocks?",[81,90,91],{},"Modular Blocks are a powerful content management feature in Contentstack that allows you to create and manage reusable content elements. Think of them as building blocks that can be assembled and rearranged to construct unique page structures.",[81,93,94],{},"With Modular Blocks, content managers can:",[96,97,98,106,112,118],"ul",{},[99,100,101,105],"li",{},[102,103,104],"strong",{},"Dynamically create pages"," by selecting, arranging, and combining different block types",[99,107,108,111],{},[102,109,110],{},"Reuse content elements"," across multiple pages while maintaining consistency",[99,113,114,117],{},[102,115,116],{},"Customize layouts"," without developer intervention by choosing which blocks to include",[99,119,120,123],{},[102,121,122],{},"Manage content centrally"," so updates to a block are automatically reflected everywhere it's used",[81,125,126],{},"Each modular block represents a distinct content element (like a hero section, image gallery, or text block) that can be combined with other blocks to create flexible, dynamic page layouts. Content managers can rearrange, include, or exclude blocks as needed, providing enhanced control over page structure.",[81,128,129],{},"For example, a \"Photo Showcase\" modular block field might offer three available blocks: \"Image,\" \"Carousel,\" and \"Paragraph.\" In any given entry, content managers can choose to use only the \"Paragraph\" and \"Carousel\" blocks, skipping the \"Image\" block entirely.",[131,132,135],"div",{"className":133},[134],"my-8",[136,137],"iframe",{"src":138,"allow":139,"allowFullScreen":140,"frameBorder":141,"height":142,"referrerPolicy":143,"style":144,"width":142},"https:\u002F\u002Fwww.youtube-nocookie.com\u002Fembed\u002Fni3mMmbFSfM","accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share","true","0","100%","strict-origin-when-cross-origin","aspect-ratio: 16\u002F9; width: 100%; border-radius: 0.5rem;",[146,147,149,152,153,160,161,166],"callout",{"icon":148},"i-lucide-book-open",[102,150,151],{},"Learn More",": Want to dive deeper into Modular Blocks? Check out the ",[154,155,159],"a",{"href":156,"rel":157},"https:\u002F\u002Fwww.contentstack.com\u002Facademy\u002Fcourses\u002Fcontent-modeling\u002Fmodular-blocks",[158],"nofollow","Contentstack Academy course on Modular Blocks"," for comprehensive training, or visit the ",[154,162,165],{"href":163,"rel":164},"https:\u002F\u002Fwww.contentstack.com\u002Fdocs\u002Fdevelopers\u002Fcreate-content-types\u002Fmodular-blocks",[158],"Contentstack documentation"," for technical details.",[146,168,170],{"icon":169},"i-lucide-info","The component now supports auto-fetch capability - it can fetch entry data and extract blocks automatically, making it even easier to build dynamic pages.",[85,172,61],{"id":173},"features",[96,175,176,183,189,195,201,212,218,224,230,236,242],{},[99,177,178,179,182],{},"βœ… ",[102,180,181],{},"Auto-component mapping"," - Automatically maps Contentstack block types to Vue components",[99,184,178,185,188],{},[102,186,187],{},"Auto-fetch capability"," - Can fetch entry data and extract blocks automatically",[99,190,178,191,194],{},[102,192,193],{},"SEO metadata support"," - Automatic SEO generation with useSeoMeta integration",[99,196,178,197,200],{},[102,198,199],{},"Flexible data structure"," - Works with various Contentstack modular block formats",[99,202,178,203,206,207,211],{},[102,204,205],{},"Live Preview ready"," - Full support for Contentstack Live Preview with ",[208,209,210],"code",{},"data-cslp"," attributes",[99,213,178,214,217],{},[102,215,216],{},"Visual Builder support"," - Includes empty state classes for visual building",[99,219,178,220,223],{},[102,221,222],{},"TypeScript support"," - Comprehensive type definitions with generics",[99,225,178,226,229],{},[102,227,228],{},"SSR compatible"," - Renders perfectly on server and hydrates seamlessly",[99,231,178,232,235],{},[102,233,234],{},"Customizable styling"," - Configurable CSS classes and container props",[99,237,178,238,241],{},[102,239,240],{},"Error handling"," - Graceful fallbacks for unmapped components",[99,243,178,244,247],{},[102,245,246],{},"Slot support"," - Custom loading, error, and empty state content via slots",[85,249,251],{"id":250},"usage-patterns","Usage Patterns",[81,253,254],{},"The component supports two usage patterns for maximum flexibility:",[256,257,259],"h4",{"id":258},"pattern-1-auto-fetch-entry-render-blocks-new","Pattern 1: Auto-fetch Entry + Render Blocks (NEW)",[81,261,262],{},"Perfect for simple page rendering - just provide entry details and let the component handle everything:",[264,265,271],"pre",{"className":266,"code":267,"filename":268,"language":269,"meta":270,"style":270},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup>\nimport Hero from \"~\u002Fcomponents\u002Fblocks\u002FHero.vue\"\nimport Grid from \"~\u002Fcomponents\u002Fblocks\u002FGrid.vue\"\nimport TextBlock from \"~\u002Fcomponents\u002Fblocks\u002FTextBlock.vue\"\n\n\u002F\u002F Map Contentstack block types to Vue components\nconst componentMapping = {\n hero: Hero,\n grid: Grid,\n text_block: TextBlock,\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003C!-- Component fetches entry and renders blocks automatically -->\n \u003CContentstackModularBlocks\n content-type-uid=\"page\"\n :url=\"$route.path\"\n blocks-field-path=\"components\"\n :reference-field-path=\"['blocks.block.image']\"\n :json-rte-path=\"['rich_text', 'blocks.block.copy']\"\n locale=\"en-us\"\n :component-map=\"componentMapping\"\n >\n \u003C!-- Custom loading state -->\n \u003Ctemplate #loading>\n \u003Cdiv class=\"loading-spinner\">Loading page content...\u003C\u002Fdiv>\n \u003C\u002Ftemplate>\n\n \u003C!-- Custom error state -->\n \u003Ctemplate #error>\n \u003Cdiv class=\"error-message\">Failed to load content\u003C\u002Fdiv>\n \u003C\u002Ftemplate>\n \u003C\u002FContentstackModularBlocks>\n\u003C\u002Ftemplate>\n","pages\u002F[...slug].vue","vue","",[208,272,273,293,317,334,351,358,365,380,395,408,421,427,437,442,452,458,467,483,498,513,528,543,558,573,579,585,601,633,643,648,654,668,697,706,717],{"__ignoreMap":270},[274,275,278,282,286,290],"span",{"class":276,"line":277},"line",1,[274,279,281],{"class":280},"sMK4o","\u003C",[274,283,285],{"class":284},"swJcz","script",[274,287,289],{"class":288},"spNyl"," setup",[274,291,292],{"class":280},">\n",[274,294,296,300,304,307,310,314],{"class":276,"line":295},2,[274,297,299],{"class":298},"s7zQu","import",[274,301,303],{"class":302},"sTEyZ"," Hero ",[274,305,306],{"class":298},"from",[274,308,309],{"class":280}," \"",[274,311,313],{"class":312},"sfazB","~\u002Fcomponents\u002Fblocks\u002FHero.vue",[274,315,316],{"class":280},"\"\n",[274,318,320,322,325,327,329,332],{"class":276,"line":319},3,[274,321,299],{"class":298},[274,323,324],{"class":302}," Grid ",[274,326,306],{"class":298},[274,328,309],{"class":280},[274,330,331],{"class":312},"~\u002Fcomponents\u002Fblocks\u002FGrid.vue",[274,333,316],{"class":280},[274,335,337,339,342,344,346,349],{"class":276,"line":336},4,[274,338,299],{"class":298},[274,340,341],{"class":302}," TextBlock ",[274,343,306],{"class":298},[274,345,309],{"class":280},[274,347,348],{"class":312},"~\u002Fcomponents\u002Fblocks\u002FTextBlock.vue",[274,350,316],{"class":280},[274,352,354],{"class":276,"line":353},5,[274,355,357],{"emptyLinePlaceholder":356},true,"\n",[274,359,361],{"class":276,"line":360},6,[274,362,364],{"class":363},"sHwdD","\u002F\u002F Map Contentstack block types to Vue components\n",[274,366,368,371,374,377],{"class":276,"line":367},7,[274,369,370],{"class":288},"const",[274,372,373],{"class":302}," componentMapping ",[274,375,376],{"class":280},"=",[274,378,379],{"class":280}," {\n",[274,381,383,386,389,392],{"class":276,"line":382},8,[274,384,385],{"class":284}," hero",[274,387,388],{"class":280},":",[274,390,391],{"class":302}," Hero",[274,393,394],{"class":280},",\n",[274,396,398,401,403,406],{"class":276,"line":397},9,[274,399,400],{"class":284}," grid",[274,402,388],{"class":280},[274,404,405],{"class":302}," Grid",[274,407,394],{"class":280},[274,409,411,414,416,419],{"class":276,"line":410},10,[274,412,413],{"class":284}," text_block",[274,415,388],{"class":280},[274,417,418],{"class":302}," TextBlock",[274,420,394],{"class":280},[274,422,424],{"class":276,"line":423},11,[274,425,426],{"class":280},"}\n",[274,428,430,433,435],{"class":276,"line":429},12,[274,431,432],{"class":280},"\u003C\u002F",[274,434,285],{"class":284},[274,436,292],{"class":280},[274,438,440],{"class":276,"line":439},13,[274,441,357],{"emptyLinePlaceholder":356},[274,443,445,447,450],{"class":276,"line":444},14,[274,446,281],{"class":280},[274,448,449],{"class":284},"template",[274,451,292],{"class":280},[274,453,455],{"class":276,"line":454},15,[274,456,457],{"class":363}," \u003C!-- Component fetches entry and renders blocks automatically -->\n",[274,459,461,464],{"class":276,"line":460},16,[274,462,463],{"class":280}," \u003C",[274,465,466],{"class":284},"ContentstackModularBlocks\n",[274,468,470,473,475,478,481],{"class":276,"line":469},17,[274,471,472],{"class":288}," content-type-uid",[274,474,376],{"class":280},[274,476,477],{"class":280},"\"",[274,479,480],{"class":312},"page",[274,482,316],{"class":280},[274,484,486,489,491,493,496],{"class":276,"line":485},18,[274,487,488],{"class":288}," :url",[274,490,376],{"class":280},[274,492,477],{"class":280},[274,494,495],{"class":312},"$route.path",[274,497,316],{"class":280},[274,499,501,504,506,508,511],{"class":276,"line":500},19,[274,502,503],{"class":288}," blocks-field-path",[274,505,376],{"class":280},[274,507,477],{"class":280},[274,509,510],{"class":312},"components",[274,512,316],{"class":280},[274,514,516,519,521,523,526],{"class":276,"line":515},20,[274,517,518],{"class":288}," :reference-field-path",[274,520,376],{"class":280},[274,522,477],{"class":280},[274,524,525],{"class":312},"['blocks.block.image']",[274,527,316],{"class":280},[274,529,531,534,536,538,541],{"class":276,"line":530},21,[274,532,533],{"class":288}," :json-rte-path",[274,535,376],{"class":280},[274,537,477],{"class":280},[274,539,540],{"class":312},"['rich_text', 'blocks.block.copy']",[274,542,316],{"class":280},[274,544,546,549,551,553,556],{"class":276,"line":545},22,[274,547,548],{"class":288}," locale",[274,550,376],{"class":280},[274,552,477],{"class":280},[274,554,555],{"class":312},"en-us",[274,557,316],{"class":280},[274,559,561,564,566,568,571],{"class":276,"line":560},23,[274,562,563],{"class":288}," :component-map",[274,565,376],{"class":280},[274,567,477],{"class":280},[274,569,570],{"class":312},"componentMapping",[274,572,316],{"class":280},[274,574,576],{"class":276,"line":575},24,[274,577,578],{"class":280}," >\n",[274,580,582],{"class":276,"line":581},25,[274,583,584],{"class":363}," \u003C!-- Custom loading state -->\n",[274,586,588,591,593,596,599],{"class":276,"line":587},26,[274,589,590],{"class":280}," \u003C",[274,592,449],{"class":284},[274,594,595],{"class":280}," #",[274,597,598],{"class":288},"loading",[274,600,292],{"class":280},[274,602,604,607,609,612,614,616,619,621,624,627,629,631],{"class":276,"line":603},27,[274,605,606],{"class":280}," \u003C",[274,608,131],{"class":284},[274,610,611],{"class":288}," class",[274,613,376],{"class":280},[274,615,477],{"class":280},[274,617,618],{"class":312},"loading-spinner",[274,620,477],{"class":280},[274,622,623],{"class":280},">",[274,625,626],{"class":302},"Loading page content...",[274,628,432],{"class":280},[274,630,131],{"class":284},[274,632,292],{"class":280},[274,634,636,639,641],{"class":276,"line":635},28,[274,637,638],{"class":280}," \u003C\u002F",[274,640,449],{"class":284},[274,642,292],{"class":280},[274,644,646],{"class":276,"line":645},29,[274,647,357],{"emptyLinePlaceholder":356},[274,649,651],{"class":276,"line":650},30,[274,652,653],{"class":363}," \u003C!-- Custom error state -->\n",[274,655,657,659,661,663,666],{"class":276,"line":656},31,[274,658,590],{"class":280},[274,660,449],{"class":284},[274,662,595],{"class":280},[274,664,665],{"class":288},"error",[274,667,292],{"class":280},[274,669,671,673,675,677,679,681,684,686,688,691,693,695],{"class":276,"line":670},32,[274,672,606],{"class":280},[274,674,131],{"class":284},[274,676,611],{"class":288},[274,678,376],{"class":280},[274,680,477],{"class":280},[274,682,683],{"class":312},"error-message",[274,685,477],{"class":280},[274,687,623],{"class":280},[274,689,690],{"class":302},"Failed to load content",[274,692,432],{"class":280},[274,694,131],{"class":284},[274,696,292],{"class":280},[274,698,700,702,704],{"class":276,"line":699},33,[274,701,638],{"class":280},[274,703,449],{"class":284},[274,705,292],{"class":280},[274,707,709,712,715],{"class":276,"line":708},34,[274,710,711],{"class":280}," \u003C\u002F",[274,713,714],{"class":284},"ContentstackModularBlocks",[274,716,292],{"class":280},[274,718,720,722,724],{"class":276,"line":719},35,[274,721,432],{"class":280},[274,723,449],{"class":284},[274,725,292],{"class":280},[256,727,729],{"id":728},"pattern-2-traditional-with-pre-fetched-blocks","Pattern 2: Traditional with Pre-fetched Blocks",[81,731,732],{},"For when you need more control over data fetching:",[264,734,737],{"className":266,"code":735,"filename":736,"language":269,"meta":270,"style":270},"\u003Cscript setup>\nimport Hero from \"~\u002Fcomponents\u002Fblocks\u002FHero.vue\"\nimport Grid from \"~\u002Fcomponents\u002Fblocks\u002FGrid.vue\"\nimport TextBlock from \"~\u002Fcomponents\u002Fblocks\u002FTextBlock.vue\"\n\n\u002F\u002F Map Contentstack block types to Vue components\nconst componentMapping = {\n hero: Hero,\n grid: Grid,\n text_block: TextBlock,\n}\n\n\u002F\u002F Fetch your page data manually\nconst { data: page } = await useGetEntryByUrl({\n contentTypeUid: \"page\",\n url: useRoute().path,\n})\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003C!-- Pass pre-fetched blocks -->\n \u003CContentstackModularBlocks\n :blocks=\"page.components\"\n :component-map=\"componentMapping\"\n \u002F>\n\u003C\u002Ftemplate>\n","pages\u002Fdynamic-page.vue",[208,738,739,749,763,777,791,795,799,809,819,829,839,843,847,852,886,901,922,929,937,941,949,954,960,974,986,991],{"__ignoreMap":270},[274,740,741,743,745,747],{"class":276,"line":277},[274,742,281],{"class":280},[274,744,285],{"class":284},[274,746,289],{"class":288},[274,748,292],{"class":280},[274,750,751,753,755,757,759,761],{"class":276,"line":295},[274,752,299],{"class":298},[274,754,303],{"class":302},[274,756,306],{"class":298},[274,758,309],{"class":280},[274,760,313],{"class":312},[274,762,316],{"class":280},[274,764,765,767,769,771,773,775],{"class":276,"line":319},[274,766,299],{"class":298},[274,768,324],{"class":302},[274,770,306],{"class":298},[274,772,309],{"class":280},[274,774,331],{"class":312},[274,776,316],{"class":280},[274,778,779,781,783,785,787,789],{"class":276,"line":336},[274,780,299],{"class":298},[274,782,341],{"class":302},[274,784,306],{"class":298},[274,786,309],{"class":280},[274,788,348],{"class":312},[274,790,316],{"class":280},[274,792,793],{"class":276,"line":353},[274,794,357],{"emptyLinePlaceholder":356},[274,796,797],{"class":276,"line":360},[274,798,364],{"class":363},[274,800,801,803,805,807],{"class":276,"line":367},[274,802,370],{"class":288},[274,804,373],{"class":302},[274,806,376],{"class":280},[274,808,379],{"class":280},[274,810,811,813,815,817],{"class":276,"line":382},[274,812,385],{"class":284},[274,814,388],{"class":280},[274,816,391],{"class":302},[274,818,394],{"class":280},[274,820,821,823,825,827],{"class":276,"line":397},[274,822,400],{"class":284},[274,824,388],{"class":280},[274,826,405],{"class":302},[274,828,394],{"class":280},[274,830,831,833,835,837],{"class":276,"line":410},[274,832,413],{"class":284},[274,834,388],{"class":280},[274,836,418],{"class":302},[274,838,394],{"class":280},[274,840,841],{"class":276,"line":423},[274,842,426],{"class":280},[274,844,845],{"class":276,"line":429},[274,846,357],{"emptyLinePlaceholder":356},[274,848,849],{"class":276,"line":439},[274,850,851],{"class":363},"\u002F\u002F Fetch your page data manually\n",[274,853,854,856,859,862,864,867,870,873,876,880,883],{"class":276,"line":444},[274,855,370],{"class":288},[274,857,858],{"class":280}," {",[274,860,861],{"class":284}," data",[274,863,388],{"class":280},[274,865,866],{"class":302}," page ",[274,868,869],{"class":280},"}",[274,871,872],{"class":280}," =",[274,874,875],{"class":298}," await",[274,877,879],{"class":878},"s2Zo4"," useGetEntryByUrl",[274,881,882],{"class":302},"(",[274,884,885],{"class":280},"{\n",[274,887,888,891,893,895,897,899],{"class":276,"line":454},[274,889,890],{"class":284}," contentTypeUid",[274,892,388],{"class":280},[274,894,309],{"class":280},[274,896,480],{"class":312},[274,898,477],{"class":280},[274,900,394],{"class":280},[274,902,903,906,908,911,914,917,920],{"class":276,"line":460},[274,904,905],{"class":284}," url",[274,907,388],{"class":280},[274,909,910],{"class":878}," useRoute",[274,912,913],{"class":302},"()",[274,915,916],{"class":280},".",[274,918,919],{"class":302},"path",[274,921,394],{"class":280},[274,923,924,926],{"class":276,"line":469},[274,925,869],{"class":280},[274,927,928],{"class":302},")\n",[274,930,931,933,935],{"class":276,"line":485},[274,932,432],{"class":280},[274,934,285],{"class":284},[274,936,292],{"class":280},[274,938,939],{"class":276,"line":500},[274,940,357],{"emptyLinePlaceholder":356},[274,942,943,945,947],{"class":276,"line":515},[274,944,281],{"class":280},[274,946,449],{"class":284},[274,948,292],{"class":280},[274,950,951],{"class":276,"line":530},[274,952,953],{"class":363}," \u003C!-- Pass pre-fetched blocks -->\n",[274,955,956,958],{"class":276,"line":545},[274,957,463],{"class":280},[274,959,466],{"class":284},[274,961,962,965,967,969,972],{"class":276,"line":560},[274,963,964],{"class":288}," :blocks",[274,966,376],{"class":280},[274,968,477],{"class":280},[274,970,971],{"class":312},"page.components",[274,973,316],{"class":280},[274,975,976,978,980,982,984],{"class":276,"line":575},[274,977,563],{"class":288},[274,979,376],{"class":280},[274,981,477],{"class":280},[274,983,570],{"class":312},[274,985,316],{"class":280},[274,987,988],{"class":276,"line":581},[274,989,990],{"class":280}," \u002F>\n",[274,992,993,995,997],{"class":276,"line":587},[274,994,432],{"class":280},[274,996,449],{"class":284},[274,998,292],{"class":280},[85,1000,1002],{"id":1001},"advanced-usage","Advanced Usage",[264,1004,1007],{"className":266,"code":1005,"filename":1006,"language":269,"meta":270,"style":270},"\u003Cscript setup>\nimport Hero from \"~\u002Fcomponents\u002Fblocks\u002FHero.vue\"\nimport Grid from \"~\u002Fcomponents\u002Fblocks\u002FGrid.vue\"\nimport DefaultBlock from \"~\u002Fcomponents\u002Fblocks\u002FDefaultBlock.vue\"\n\nconst componentMapping = {\n hero: Hero,\n grid: Grid,\n text_section: TextSection,\n image_gallery: ImageGallery,\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003CContentstackModularBlocks\n :blocks=\"page.modular_blocks\"\n :component-map=\"componentMapping\"\n :fallback-component=\"DefaultBlock\"\n :auto-extract-block-name=\"true\"\n :show-empty-state=\"true\"\n container-class=\"page-blocks\"\n empty-block-class=\"visual-builder__empty-block-parent\"\n empty-state-message=\"No content blocks available\"\n key-field=\"_metadata.uid\"\n block-name-prefix=\"block_\"\n :container-props=\"{ 'data-page-id': page.uid }\"\n >\n \u003C!-- Custom empty state -->\n \u003Ctemplate #empty>\n \u003Cdiv class=\"custom-empty-state\">\n \u003Ch3>No content blocks found\u003C\u002Fh3>\n \u003Cp>Please add some content in Contentstack\u003C\u002Fp>\n \u003C\u002Fdiv>\n \u003C\u002Ftemplate>\n \u003C\u002FContentstackModularBlocks>\n\u003C\u002Ftemplate>\n","pages\u002Fadvanced-example.vue",[208,1008,1009,1019,1033,1047,1063,1067,1077,1087,1097,1109,1121,1125,1133,1137,1145,1151,1164,1176,1190,1203,1216,1230,1244,1258,1272,1286,1300,1304,1309,1322,1341,1359,1376,1385,1393,1401],{"__ignoreMap":270},[274,1010,1011,1013,1015,1017],{"class":276,"line":277},[274,1012,281],{"class":280},[274,1014,285],{"class":284},[274,1016,289],{"class":288},[274,1018,292],{"class":280},[274,1020,1021,1023,1025,1027,1029,1031],{"class":276,"line":295},[274,1022,299],{"class":298},[274,1024,303],{"class":302},[274,1026,306],{"class":298},[274,1028,309],{"class":280},[274,1030,313],{"class":312},[274,1032,316],{"class":280},[274,1034,1035,1037,1039,1041,1043,1045],{"class":276,"line":319},[274,1036,299],{"class":298},[274,1038,324],{"class":302},[274,1040,306],{"class":298},[274,1042,309],{"class":280},[274,1044,331],{"class":312},[274,1046,316],{"class":280},[274,1048,1049,1051,1054,1056,1058,1061],{"class":276,"line":336},[274,1050,299],{"class":298},[274,1052,1053],{"class":302}," DefaultBlock ",[274,1055,306],{"class":298},[274,1057,309],{"class":280},[274,1059,1060],{"class":312},"~\u002Fcomponents\u002Fblocks\u002FDefaultBlock.vue",[274,1062,316],{"class":280},[274,1064,1065],{"class":276,"line":353},[274,1066,357],{"emptyLinePlaceholder":356},[274,1068,1069,1071,1073,1075],{"class":276,"line":360},[274,1070,370],{"class":288},[274,1072,373],{"class":302},[274,1074,376],{"class":280},[274,1076,379],{"class":280},[274,1078,1079,1081,1083,1085],{"class":276,"line":367},[274,1080,385],{"class":284},[274,1082,388],{"class":280},[274,1084,391],{"class":302},[274,1086,394],{"class":280},[274,1088,1089,1091,1093,1095],{"class":276,"line":382},[274,1090,400],{"class":284},[274,1092,388],{"class":280},[274,1094,405],{"class":302},[274,1096,394],{"class":280},[274,1098,1099,1102,1104,1107],{"class":276,"line":397},[274,1100,1101],{"class":284}," text_section",[274,1103,388],{"class":280},[274,1105,1106],{"class":302}," TextSection",[274,1108,394],{"class":280},[274,1110,1111,1114,1116,1119],{"class":276,"line":410},[274,1112,1113],{"class":284}," image_gallery",[274,1115,388],{"class":280},[274,1117,1118],{"class":302}," ImageGallery",[274,1120,394],{"class":280},[274,1122,1123],{"class":276,"line":423},[274,1124,426],{"class":280},[274,1126,1127,1129,1131],{"class":276,"line":429},[274,1128,432],{"class":280},[274,1130,285],{"class":284},[274,1132,292],{"class":280},[274,1134,1135],{"class":276,"line":439},[274,1136,357],{"emptyLinePlaceholder":356},[274,1138,1139,1141,1143],{"class":276,"line":444},[274,1140,281],{"class":280},[274,1142,449],{"class":284},[274,1144,292],{"class":280},[274,1146,1147,1149],{"class":276,"line":454},[274,1148,463],{"class":280},[274,1150,466],{"class":284},[274,1152,1153,1155,1157,1159,1162],{"class":276,"line":460},[274,1154,964],{"class":288},[274,1156,376],{"class":280},[274,1158,477],{"class":280},[274,1160,1161],{"class":312},"page.modular_blocks",[274,1163,316],{"class":280},[274,1165,1166,1168,1170,1172,1174],{"class":276,"line":469},[274,1167,563],{"class":288},[274,1169,376],{"class":280},[274,1171,477],{"class":280},[274,1173,570],{"class":312},[274,1175,316],{"class":280},[274,1177,1178,1181,1183,1185,1188],{"class":276,"line":485},[274,1179,1180],{"class":288}," :fallback-component",[274,1182,376],{"class":280},[274,1184,477],{"class":280},[274,1186,1187],{"class":312},"DefaultBlock",[274,1189,316],{"class":280},[274,1191,1192,1195,1197,1199,1201],{"class":276,"line":500},[274,1193,1194],{"class":288}," :auto-extract-block-name",[274,1196,376],{"class":280},[274,1198,477],{"class":280},[274,1200,140],{"class":312},[274,1202,316],{"class":280},[274,1204,1205,1208,1210,1212,1214],{"class":276,"line":515},[274,1206,1207],{"class":288}," :show-empty-state",[274,1209,376],{"class":280},[274,1211,477],{"class":280},[274,1213,140],{"class":312},[274,1215,316],{"class":280},[274,1217,1218,1221,1223,1225,1228],{"class":276,"line":530},[274,1219,1220],{"class":288}," container-class",[274,1222,376],{"class":280},[274,1224,477],{"class":280},[274,1226,1227],{"class":312},"page-blocks",[274,1229,316],{"class":280},[274,1231,1232,1235,1237,1239,1242],{"class":276,"line":545},[274,1233,1234],{"class":288}," empty-block-class",[274,1236,376],{"class":280},[274,1238,477],{"class":280},[274,1240,1241],{"class":312},"visual-builder__empty-block-parent",[274,1243,316],{"class":280},[274,1245,1246,1249,1251,1253,1256],{"class":276,"line":560},[274,1247,1248],{"class":288}," empty-state-message",[274,1250,376],{"class":280},[274,1252,477],{"class":280},[274,1254,1255],{"class":312},"No content blocks available",[274,1257,316],{"class":280},[274,1259,1260,1263,1265,1267,1270],{"class":276,"line":575},[274,1261,1262],{"class":288}," key-field",[274,1264,376],{"class":280},[274,1266,477],{"class":280},[274,1268,1269],{"class":312},"_metadata.uid",[274,1271,316],{"class":280},[274,1273,1274,1277,1279,1281,1284],{"class":276,"line":581},[274,1275,1276],{"class":288}," block-name-prefix",[274,1278,376],{"class":280},[274,1280,477],{"class":280},[274,1282,1283],{"class":312},"block_",[274,1285,316],{"class":280},[274,1287,1288,1291,1293,1295,1298],{"class":276,"line":587},[274,1289,1290],{"class":288}," :container-props",[274,1292,376],{"class":280},[274,1294,477],{"class":280},[274,1296,1297],{"class":312},"{ 'data-page-id': page.uid }",[274,1299,316],{"class":280},[274,1301,1302],{"class":276,"line":603},[274,1303,578],{"class":280},[274,1305,1306],{"class":276,"line":635},[274,1307,1308],{"class":363}," \u003C!-- Custom empty state -->\n",[274,1310,1311,1313,1315,1317,1320],{"class":276,"line":645},[274,1312,590],{"class":280},[274,1314,449],{"class":284},[274,1316,595],{"class":280},[274,1318,1319],{"class":288},"empty",[274,1321,292],{"class":280},[274,1323,1324,1326,1328,1330,1332,1334,1337,1339],{"class":276,"line":650},[274,1325,606],{"class":280},[274,1327,131],{"class":284},[274,1329,611],{"class":288},[274,1331,376],{"class":280},[274,1333,477],{"class":280},[274,1335,1336],{"class":312},"custom-empty-state",[274,1338,477],{"class":280},[274,1340,292],{"class":280},[274,1342,1343,1346,1348,1350,1353,1355,1357],{"class":276,"line":656},[274,1344,1345],{"class":280}," \u003C",[274,1347,85],{"class":284},[274,1349,623],{"class":280},[274,1351,1352],{"class":302},"No content blocks found",[274,1354,432],{"class":280},[274,1356,85],{"class":284},[274,1358,292],{"class":280},[274,1360,1361,1363,1365,1367,1370,1372,1374],{"class":276,"line":670},[274,1362,1345],{"class":280},[274,1364,81],{"class":284},[274,1366,623],{"class":280},[274,1368,1369],{"class":302},"Please add some content in Contentstack",[274,1371,432],{"class":280},[274,1373,81],{"class":284},[274,1375,292],{"class":280},[274,1377,1378,1381,1383],{"class":276,"line":699},[274,1379,1380],{"class":280}," \u003C\u002F",[274,1382,131],{"class":284},[274,1384,292],{"class":280},[274,1386,1387,1389,1391],{"class":276,"line":708},[274,1388,638],{"class":280},[274,1390,449],{"class":284},[274,1392,292],{"class":280},[274,1394,1395,1397,1399],{"class":276,"line":719},[274,1396,711],{"class":280},[274,1398,714],{"class":284},[274,1400,292],{"class":280},[274,1402,1404,1406,1408],{"class":276,"line":1403},36,[274,1405,432],{"class":280},[274,1407,449],{"class":284},[274,1409,292],{"class":280},[85,1411,1413],{"id":1412},"props-reference","Props Reference",[256,1415,1417],{"id":1416},"core-props","Core Props",[1419,1420,1421,1440],"table",{},[1422,1423,1424],"thead",{},[1425,1426,1427,1431,1434,1437],"tr",{},[1428,1429,1430],"th",{},"Prop",[1428,1432,1433],{},"Type",[1428,1435,1436],{},"Default",[1428,1438,1439],{},"Description",[1441,1442,1443,1464,1484],"tbody",{},[1425,1444,1445,1451,1456,1461],{},[1446,1447,1448],"td",{},[208,1449,1450],{},"blocks",[1446,1452,1453],{},[208,1454,1455],{},"ContentstackBlock[]",[1446,1457,1458],{},[208,1459,1460],{},"[]",[1446,1462,1463],{},"Array of Contentstack modular blocks",[1425,1465,1466,1471,1476,1481],{},[1446,1467,1468],{},[208,1469,1470],{},"componentMap",[1446,1472,1473],{},[208,1474,1475],{},"ComponentMapping",[1446,1477,1478],{},[208,1479,1480],{},"{}",[1446,1482,1483],{},"Object mapping block types to Vue components",[1425,1485,1486,1491,1496,1501],{},[1446,1487,1488],{},[208,1489,1490],{},"fallbackComponent",[1446,1492,1493],{},[208,1494,1495],{},"Component | string",[1446,1497,1498],{},[208,1499,1500],{},"ContentstackFallbackBlock",[1446,1502,1503],{},"Fallback component for unmapped block types",[256,1505,1507],{"id":1506},"auto-fetch-props-new","Auto-fetch Props (NEW)",[1419,1509,1510,1522],{},[1422,1511,1512],{},[1425,1513,1514,1516,1518,1520],{},[1428,1515,1430],{},[1428,1517,1433],{},[1428,1519,1436],{},[1428,1521,1439],{},[1441,1523,1524,1544,1562,1581,1599,1618,1638,1657,1676],{},[1425,1525,1526,1531,1536,1541],{},[1446,1527,1528],{},[208,1529,1530],{},"contentTypeUid",[1446,1532,1533],{},[208,1534,1535],{},"string",[1446,1537,1538],{},[208,1539,1540],{},"undefined",[1446,1542,1543],{},"Content type UID for fetching entry",[1425,1545,1546,1551,1555,1559],{},[1446,1547,1548],{},[208,1549,1550],{},"url",[1446,1552,1553],{},[208,1554,1535],{},[1446,1556,1557],{},[208,1558,1540],{},[1446,1560,1561],{},"URL to fetch entry by",[1425,1563,1564,1569,1574,1578],{},[1446,1565,1566],{},[208,1567,1568],{},"referenceFieldPath",[1446,1570,1571],{},[208,1572,1573],{},"string[]",[1446,1575,1576],{},[208,1577,1460],{},[1446,1579,1580],{},"Reference field paths to include",[1425,1582,1583,1588,1592,1596],{},[1446,1584,1585],{},[208,1586,1587],{},"jsonRtePath",[1446,1589,1590],{},[208,1591,1573],{},[1446,1593,1594],{},[208,1595,1460],{},[1446,1597,1598],{},"JSON RTE field paths",[1425,1600,1601,1606,1610,1615],{},[1446,1602,1603],{},[208,1604,1605],{},"locale",[1446,1607,1608],{},[208,1609,1535],{},[1446,1611,1612],{},[208,1613,1614],{},"'en-us'",[1446,1616,1617],{},"Locale for the entry",[1425,1619,1620,1625,1630,1635],{},[1446,1621,1622],{},[208,1623,1624],{},"replaceHtmlCslp",[1446,1626,1627],{},[208,1628,1629],{},"boolean",[1446,1631,1632],{},[208,1633,1634],{},"false",[1446,1636,1637],{},"Replace HTML CSLP tags",[1425,1639,1640,1645,1649,1654],{},[1446,1641,1642],{},[208,1643,1644],{},"blocksFieldPath",[1446,1646,1647],{},[208,1648,1535],{},[1446,1650,1651],{},[208,1652,1653],{},"'components'",[1446,1655,1656],{},"Field path to extract modular blocks from",[1425,1658,1659,1664,1669,1673],{},[1446,1660,1661],{},[208,1662,1663],{},"seoMeta",[1446,1665,1666],{},[208,1667,1668],{},"SeoMetaInput",[1446,1670,1671],{},[208,1672,1540],{},[1446,1674,1675],{},"SEO metadata object (passed directly to useSeoMeta)",[1425,1677,1678,1683,1688,1692],{},[1446,1679,1680],{},[208,1681,1682],{},"autoSeoMeta",[1446,1684,1685],{},[208,1686,1687],{},"boolean | Record\u003Cstring, string>",[1446,1689,1690],{},[208,1691,1634],{},[1446,1693,1694],{},"Auto-generate SEO from entry data",[256,1696,1698],{"id":1697},"styling-props","Styling Props",[1419,1700,1701,1713],{},[1422,1702,1703],{},[1425,1704,1705,1707,1709,1711],{},[1428,1706,1430],{},[1428,1708,1433],{},[1428,1710,1436],{},[1428,1712,1439],{},[1441,1714,1715,1734,1753,1772,1790,1809],{},[1425,1716,1717,1722,1726,1731],{},[1446,1718,1719],{},[208,1720,1721],{},"containerClass",[1446,1723,1724],{},[208,1725,1535],{},[1446,1727,1728],{},[208,1729,1730],{},"'contentstack-modular-blocks'",[1446,1732,1733],{},"CSS class for the container",[1425,1735,1736,1741,1745,1750],{},[1446,1737,1738],{},[208,1739,1740],{},"emptyBlockClass",[1446,1742,1743],{},[208,1744,1535],{},[1446,1746,1747],{},[208,1748,1749],{},"'visual-builder__empty-block-parent'",[1446,1751,1752],{},"CSS class for empty blocks (Visual Builder)",[1425,1754,1755,1760,1765,1769],{},[1446,1756,1757],{},[208,1758,1759],{},"containerProps",[1446,1761,1762],{},[208,1763,1764],{},"Record\u003Cstring, any>",[1446,1766,1767],{},[208,1768,1480],{},[1446,1770,1771],{},"Additional props to bind to the container",[1425,1773,1774,1779,1783,1787],{},[1446,1775,1776],{},[208,1777,1778],{},"showEmptyState",[1446,1780,1781],{},[208,1782,1629],{},[1446,1784,1785],{},[208,1786,140],{},[1446,1788,1789],{},"Show empty state when no blocks",[1425,1791,1792,1797,1801,1806],{},[1446,1793,1794],{},[208,1795,1796],{},"emptyStateClass",[1446,1798,1799],{},[208,1800,1535],{},[1446,1802,1803],{},[208,1804,1805],{},"'contentstack-empty-state'",[1446,1807,1808],{},"CSS class for empty state",[1425,1810,1811,1816,1820,1825],{},[1446,1812,1813],{},[208,1814,1815],{},"emptyStateMessage",[1446,1817,1818],{},[208,1819,1535],{},[1446,1821,1822],{},[208,1823,1824],{},"'No content blocks available'",[1446,1826,1827],{},"Message to show in empty state",[256,1829,1831],{"id":1830},"advanced-props","Advanced Props",[1419,1833,1834,1846],{},[1422,1835,1836],{},[1425,1837,1838,1840,1842,1844],{},[1428,1839,1430],{},[1428,1841,1433],{},[1428,1843,1436],{},[1428,1845,1439],{},[1441,1847,1848,1867,1885],{},[1425,1849,1850,1855,1859,1864],{},[1446,1851,1852],{},[208,1853,1854],{},"keyField",[1446,1856,1857],{},[208,1858,1535],{},[1446,1860,1861],{},[208,1862,1863],{},"'_metadata.uid'",[1446,1865,1866],{},"Custom key field for blocks",[1425,1868,1869,1874,1878,1882],{},[1446,1870,1871],{},[208,1872,1873],{},"autoExtractBlockName",[1446,1875,1876],{},[208,1877,1629],{},[1446,1879,1880],{},[208,1881,140],{},[1446,1883,1884],{},"Auto-extract block name from object keys",[1425,1886,1887,1892,1896,1901],{},[1446,1888,1889],{},[208,1890,1891],{},"blockNamePrefix",[1446,1893,1894],{},[208,1895,1535],{},[1446,1897,1898],{},[208,1899,1900],{},"''",[1446,1902,1903],{},"Prefix to remove from block names",[85,1905,1907],{"id":1906},"seo-metadata-support","SEO Metadata Support",[81,1909,1910,1911,1918],{},"The component can automatically set SEO metadata using Nuxt's native ",[154,1912,1915],{"href":1913,"rel":1914},"https:\u002F\u002Fnuxt.com\u002Fdocs\u002F4.x\u002Fapi\u002Fcomposables\u002Fuse-seo-meta",[158],[208,1916,1917],{},"useSeoMeta",". You can pass SEO directly, or auto-generate it from entry data.",[256,1920,1922],{"id":1921},"manual-seo","Manual SEO",[81,1924,1925],{},"Pass SEO metadata directly:",[264,1927,1929],{"className":266,"code":1928,"filename":268,"language":269,"meta":270,"style":270},"\u003Ctemplate>\n \u003CContentstackModularBlocks\n content-type-uid=\"page\"\n :url=\"$route.path\"\n :seo-meta=\"{\n title: 'My Page Title',\n description: 'My page description',\n ogImage: 'https:\u002F\u002Fexample.com\u002Fimage.jpg',\n }\"\n :component-map=\"componentMapping\"\n \u002F>\n\u003C\u002Ftemplate>\n",[208,1930,1931,1939,1945,1957,1969,1980,1985,1990,1995,2002,2014,2018],{"__ignoreMap":270},[274,1932,1933,1935,1937],{"class":276,"line":277},[274,1934,281],{"class":280},[274,1936,449],{"class":284},[274,1938,292],{"class":280},[274,1940,1941,1943],{"class":276,"line":295},[274,1942,463],{"class":280},[274,1944,466],{"class":284},[274,1946,1947,1949,1951,1953,1955],{"class":276,"line":319},[274,1948,472],{"class":288},[274,1950,376],{"class":280},[274,1952,477],{"class":280},[274,1954,480],{"class":312},[274,1956,316],{"class":280},[274,1958,1959,1961,1963,1965,1967],{"class":276,"line":336},[274,1960,488],{"class":288},[274,1962,376],{"class":280},[274,1964,477],{"class":280},[274,1966,495],{"class":312},[274,1968,316],{"class":280},[274,1970,1971,1974,1976,1978],{"class":276,"line":353},[274,1972,1973],{"class":288}," :seo-meta",[274,1975,376],{"class":280},[274,1977,477],{"class":280},[274,1979,885],{"class":312},[274,1981,1982],{"class":276,"line":360},[274,1983,1984],{"class":312}," title: 'My Page Title',\n",[274,1986,1987],{"class":276,"line":367},[274,1988,1989],{"class":312}," description: 'My page description',\n",[274,1991,1992],{"class":276,"line":382},[274,1993,1994],{"class":312}," ogImage: 'https:\u002F\u002Fexample.com\u002Fimage.jpg',\n",[274,1996,1997,2000],{"class":276,"line":397},[274,1998,1999],{"class":312}," }",[274,2001,316],{"class":280},[274,2003,2004,2006,2008,2010,2012],{"class":276,"line":410},[274,2005,563],{"class":288},[274,2007,376],{"class":280},[274,2009,477],{"class":280},[274,2011,570],{"class":312},[274,2013,316],{"class":280},[274,2015,2016],{"class":276,"line":423},[274,2017,990],{"class":280},[274,2019,2020,2022,2024],{"class":276,"line":429},[274,2021,432],{"class":280},[274,2023,449],{"class":284},[274,2025,292],{"class":280},[256,2027,2029],{"id":2028},"auto-generate-seo","Auto-Generate SEO",[81,2031,2032],{},"Automatically extract SEO from entry data:",[264,2034,2036],{"className":266,"code":2035,"filename":268,"language":269,"meta":270,"style":270},"\u003Ctemplate>\n \u003C!-- Auto-generate SEO using default field mapping -->\n \u003CContentstackModularBlocks\n content-type-uid=\"page\"\n :url=\"$route.path\"\n :auto-seo-meta=\"true\"\n :component-map=\"componentMapping\"\n \u002F>\n\u003C\u002Ftemplate>\n",[208,2037,2038,2046,2051,2057,2069,2081,2094,2106,2110],{"__ignoreMap":270},[274,2039,2040,2042,2044],{"class":276,"line":277},[274,2041,281],{"class":280},[274,2043,449],{"class":284},[274,2045,292],{"class":280},[274,2047,2048],{"class":276,"line":295},[274,2049,2050],{"class":363}," \u003C!-- Auto-generate SEO using default field mapping -->\n",[274,2052,2053,2055],{"class":276,"line":319},[274,2054,463],{"class":280},[274,2056,466],{"class":284},[274,2058,2059,2061,2063,2065,2067],{"class":276,"line":336},[274,2060,472],{"class":288},[274,2062,376],{"class":280},[274,2064,477],{"class":280},[274,2066,480],{"class":312},[274,2068,316],{"class":280},[274,2070,2071,2073,2075,2077,2079],{"class":276,"line":353},[274,2072,488],{"class":288},[274,2074,376],{"class":280},[274,2076,477],{"class":280},[274,2078,495],{"class":312},[274,2080,316],{"class":280},[274,2082,2083,2086,2088,2090,2092],{"class":276,"line":360},[274,2084,2085],{"class":288}," :auto-seo-meta",[274,2087,376],{"class":280},[274,2089,477],{"class":280},[274,2091,140],{"class":312},[274,2093,316],{"class":280},[274,2095,2096,2098,2100,2102,2104],{"class":276,"line":367},[274,2097,563],{"class":288},[274,2099,376],{"class":280},[274,2101,477],{"class":280},[274,2103,570],{"class":312},[274,2105,316],{"class":280},[274,2107,2108],{"class":276,"line":382},[274,2109,990],{"class":280},[274,2111,2112,2114,2116],{"class":276,"line":397},[274,2113,432],{"class":280},[274,2115,449],{"class":284},[274,2117,292],{"class":280},[256,2119,2121],{"id":2120},"custom-field-mapping","Custom Field Mapping",[81,2123,2124],{},"Use custom field mapping with fallback support:",[264,2126,2128],{"className":266,"code":2127,"filename":268,"language":269,"meta":270,"style":270},"\u003Ctemplate>\n \u003CContentstackModularBlocks\n content-type-uid=\"page\"\n :url=\"$route.path\"\n :auto-seo-meta=\"{\n title: 'page_title|title',\n description: 'meta_description|description',\n ogImage: 'featured_image.url',\n }\"\n :component-map=\"componentMapping\"\n \u002F>\n\u003C\u002Ftemplate>\n",[208,2129,2130,2138,2144,2156,2168,2178,2183,2188,2193,2199,2211,2215],{"__ignoreMap":270},[274,2131,2132,2134,2136],{"class":276,"line":277},[274,2133,281],{"class":280},[274,2135,449],{"class":284},[274,2137,292],{"class":280},[274,2139,2140,2142],{"class":276,"line":295},[274,2141,463],{"class":280},[274,2143,466],{"class":284},[274,2145,2146,2148,2150,2152,2154],{"class":276,"line":319},[274,2147,472],{"class":288},[274,2149,376],{"class":280},[274,2151,477],{"class":280},[274,2153,480],{"class":312},[274,2155,316],{"class":280},[274,2157,2158,2160,2162,2164,2166],{"class":276,"line":336},[274,2159,488],{"class":288},[274,2161,376],{"class":280},[274,2163,477],{"class":280},[274,2165,495],{"class":312},[274,2167,316],{"class":280},[274,2169,2170,2172,2174,2176],{"class":276,"line":353},[274,2171,2085],{"class":288},[274,2173,376],{"class":280},[274,2175,477],{"class":280},[274,2177,885],{"class":312},[274,2179,2180],{"class":276,"line":360},[274,2181,2182],{"class":312}," title: 'page_title|title',\n",[274,2184,2185],{"class":276,"line":367},[274,2186,2187],{"class":312}," description: 'meta_description|description',\n",[274,2189,2190],{"class":276,"line":382},[274,2191,2192],{"class":312}," ogImage: 'featured_image.url',\n",[274,2194,2195,2197],{"class":276,"line":397},[274,2196,1999],{"class":312},[274,2198,316],{"class":280},[274,2200,2201,2203,2205,2207,2209],{"class":276,"line":410},[274,2202,563],{"class":288},[274,2204,376],{"class":280},[274,2206,477],{"class":280},[274,2208,570],{"class":312},[274,2210,316],{"class":280},[274,2212,2213],{"class":276,"line":423},[274,2214,990],{"class":280},[274,2216,2217,2219,2221],{"class":276,"line":429},[274,2218,432],{"class":280},[274,2220,449],{"class":284},[274,2222,292],{"class":280},[256,2224,2226],{"id":2225},"default-field-mapping","Default Field Mapping",[81,2228,2229,2230,2233],{},"When ",[208,2231,2232],{},"autoSeoMeta: true",", these fields are automatically mapped with fallbacks:",[1419,2235,2236,2246],{},[1422,2237,2238],{},[1425,2239,2240,2243],{},[1428,2241,2242],{},"SEO Meta Tag",[1428,2244,2245],{},"Entry Fields (fallback order)",[1441,2247,2248,2266,2283,2298,2313],{},[1425,2249,2250,2255],{},[1446,2251,2252],{},[208,2253,2254],{},"title",[1446,2256,2257,2260,2261,2260,2263],{},[208,2258,2259],{},"seo_title"," β†’ ",[208,2262,2254],{},[208,2264,2265],{},"name",[1425,2267,2268,2273],{},[1446,2269,2270],{},[208,2271,2272],{},"description",[1446,2274,2275,2260,2278,2260,2280],{},[208,2276,2277],{},"seo_description",[208,2279,2272],{},[208,2281,2282],{},"summary",[1425,2284,2285,2290],{},[1446,2286,2287],{},[208,2288,2289],{},"ogTitle",[1446,2291,2292,2260,2294,2260,2296],{},[208,2293,2259],{},[208,2295,2254],{},[208,2297,2265],{},[1425,2299,2300,2305],{},[1446,2301,2302],{},[208,2303,2304],{},"ogDescription",[1446,2306,2307,2260,2309,2260,2311],{},[208,2308,2277],{},[208,2310,2272],{},[208,2312,2282],{},[1425,2314,2315,2320],{},[1446,2316,2317],{},[208,2318,2319],{},"ogImage",[1446,2321,2322,2260,2325,2260,2328],{},[208,2323,2324],{},"featured_image.url",[208,2326,2327],{},"og_image.url",[208,2329,2330],{},"image.url",[81,2332,2333,2334,2336,2337,2341,2342,2344],{},"The ",[208,2335,1663],{}," prop accepts all ",[154,2338,2340],{"href":1913,"rel":2339},[158],"useSeoMeta options",", including Open Graph, Twitter Cards, and canonical URLs. Manual ",[208,2343,1663],{}," values override auto-generated ones.",[85,2346,2348],{"id":2347},"data-structure-support","Data Structure Support",[81,2350,2351],{},"The component supports two common Contentstack modular block structures:",[256,2353,2355],{"id":2354},"auto-extraction-default","Auto-extraction (default)",[264,2357,2361],{"className":2358,"code":2359,"language":2360,"meta":270,"style":270},"language-json shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","{\n \"components\": [\n {\n \"hero\": {\n \"title\": \"Welcome\",\n \"subtitle\": \"To our site\"\n },\n \"_metadata\": { \"uid\": \"hero_123\" }\n },\n {\n \"grid\": {\n \"columns\": 3,\n \"items\": [...]\n },\n \"_metadata\": { \"uid\": \"grid_456\" }\n }\n ]\n}\n","json",[208,2362,2363,2367,2381,2386,2401,2422,2440,2445,2477,2482,2486,2499,2515,2535,2539,2568,2573,2578],{"__ignoreMap":270},[274,2364,2365],{"class":276,"line":277},[274,2366,885],{"class":280},[274,2368,2369,2372,2374,2376,2378],{"class":276,"line":295},[274,2370,2371],{"class":280}," \"",[274,2373,510],{"class":288},[274,2375,477],{"class":280},[274,2377,388],{"class":280},[274,2379,2380],{"class":280}," [\n",[274,2382,2383],{"class":276,"line":319},[274,2384,2385],{"class":280}," {\n",[274,2387,2388,2391,2395,2397,2399],{"class":276,"line":336},[274,2389,2390],{"class":280}," \"",[274,2392,2394],{"class":2393},"sBMFI","hero",[274,2396,477],{"class":280},[274,2398,388],{"class":280},[274,2400,379],{"class":280},[274,2402,2403,2406,2409,2411,2413,2415,2418,2420],{"class":276,"line":353},[274,2404,2405],{"class":280}," \"",[274,2407,2254],{"class":2408},"sbssI",[274,2410,477],{"class":280},[274,2412,388],{"class":280},[274,2414,309],{"class":280},[274,2416,2417],{"class":312},"Welcome",[274,2419,477],{"class":280},[274,2421,394],{"class":280},[274,2423,2424,2426,2429,2431,2433,2435,2438],{"class":276,"line":360},[274,2425,2405],{"class":280},[274,2427,2428],{"class":2408},"subtitle",[274,2430,477],{"class":280},[274,2432,388],{"class":280},[274,2434,309],{"class":280},[274,2436,2437],{"class":312},"To our site",[274,2439,316],{"class":280},[274,2441,2442],{"class":276,"line":367},[274,2443,2444],{"class":280}," },\n",[274,2446,2447,2449,2452,2454,2456,2458,2460,2463,2465,2467,2469,2472,2474],{"class":276,"line":382},[274,2448,2390],{"class":280},[274,2450,2451],{"class":2393},"_metadata",[274,2453,477],{"class":280},[274,2455,388],{"class":280},[274,2457,858],{"class":280},[274,2459,309],{"class":280},[274,2461,2462],{"class":2408},"uid",[274,2464,477],{"class":280},[274,2466,388],{"class":280},[274,2468,309],{"class":280},[274,2470,2471],{"class":312},"hero_123",[274,2473,477],{"class":280},[274,2475,2476],{"class":280}," }\n",[274,2478,2479],{"class":276,"line":397},[274,2480,2481],{"class":280}," },\n",[274,2483,2484],{"class":276,"line":410},[274,2485,2385],{"class":280},[274,2487,2488,2490,2493,2495,2497],{"class":276,"line":423},[274,2489,2390],{"class":280},[274,2491,2492],{"class":2393},"grid",[274,2494,477],{"class":280},[274,2496,388],{"class":280},[274,2498,379],{"class":280},[274,2500,2501,2503,2506,2508,2510,2513],{"class":276,"line":429},[274,2502,2405],{"class":280},[274,2504,2505],{"class":2408},"columns",[274,2507,477],{"class":280},[274,2509,388],{"class":280},[274,2511,2512],{"class":2408}," 3",[274,2514,394],{"class":280},[274,2516,2517,2519,2522,2524,2526,2529,2532],{"class":276,"line":439},[274,2518,2405],{"class":280},[274,2520,2521],{"class":2408},"items",[274,2523,477],{"class":280},[274,2525,388],{"class":280},[274,2527,2528],{"class":280}," [",[274,2530,2531],{"class":302},"...",[274,2533,2534],{"class":280},"]\n",[274,2536,2537],{"class":276,"line":444},[274,2538,2444],{"class":280},[274,2540,2541,2543,2545,2547,2549,2551,2553,2555,2557,2559,2561,2564,2566],{"class":276,"line":454},[274,2542,2390],{"class":280},[274,2544,2451],{"class":2393},[274,2546,477],{"class":280},[274,2548,388],{"class":280},[274,2550,858],{"class":280},[274,2552,309],{"class":280},[274,2554,2462],{"class":2408},[274,2556,477],{"class":280},[274,2558,388],{"class":280},[274,2560,309],{"class":280},[274,2562,2563],{"class":312},"grid_456",[274,2565,477],{"class":280},[274,2567,2476],{"class":280},[274,2569,2570],{"class":276,"line":460},[274,2571,2572],{"class":280}," }\n",[274,2574,2575],{"class":276,"line":469},[274,2576,2577],{"class":280}," ]\n",[274,2579,2580],{"class":276,"line":485},[274,2581,426],{"class":280},[256,2583,2585],{"id":2584},"content-type-based","Content type based",[264,2587,2589],{"className":2358,"code":2588,"language":2360,"meta":270,"style":270},"{\n \"modular_blocks\": [\n {\n \"_content_type_uid\": \"hero_block\",\n \"title\": \"Welcome\",\n \"subtitle\": \"To our site\",\n \"_metadata\": { \"uid\": \"hero_123\" }\n },\n {\n \"_content_type_uid\": \"grid_block\",\n \"columns\": 3,\n \"items\": [...],\n \"_metadata\": { \"uid\": \"grid_456\" }\n }\n ]\n}\n",[208,2590,2591,2595,2608,2612,2632,2650,2668,2696,2700,2704,2723,2737,2754,2782,2786,2790],{"__ignoreMap":270},[274,2592,2593],{"class":276,"line":277},[274,2594,885],{"class":280},[274,2596,2597,2599,2602,2604,2606],{"class":276,"line":295},[274,2598,2371],{"class":280},[274,2600,2601],{"class":288},"modular_blocks",[274,2603,477],{"class":280},[274,2605,388],{"class":280},[274,2607,2380],{"class":280},[274,2609,2610],{"class":276,"line":319},[274,2611,2385],{"class":280},[274,2613,2614,2616,2619,2621,2623,2625,2628,2630],{"class":276,"line":336},[274,2615,2390],{"class":280},[274,2617,2618],{"class":2393},"_content_type_uid",[274,2620,477],{"class":280},[274,2622,388],{"class":280},[274,2624,309],{"class":280},[274,2626,2627],{"class":312},"hero_block",[274,2629,477],{"class":280},[274,2631,394],{"class":280},[274,2633,2634,2636,2638,2640,2642,2644,2646,2648],{"class":276,"line":353},[274,2635,2390],{"class":280},[274,2637,2254],{"class":2393},[274,2639,477],{"class":280},[274,2641,388],{"class":280},[274,2643,309],{"class":280},[274,2645,2417],{"class":312},[274,2647,477],{"class":280},[274,2649,394],{"class":280},[274,2651,2652,2654,2656,2658,2660,2662,2664,2666],{"class":276,"line":360},[274,2653,2390],{"class":280},[274,2655,2428],{"class":2393},[274,2657,477],{"class":280},[274,2659,388],{"class":280},[274,2661,309],{"class":280},[274,2663,2437],{"class":312},[274,2665,477],{"class":280},[274,2667,394],{"class":280},[274,2669,2670,2672,2674,2676,2678,2680,2682,2684,2686,2688,2690,2692,2694],{"class":276,"line":367},[274,2671,2390],{"class":280},[274,2673,2451],{"class":2393},[274,2675,477],{"class":280},[274,2677,388],{"class":280},[274,2679,858],{"class":280},[274,2681,309],{"class":280},[274,2683,2462],{"class":2408},[274,2685,477],{"class":280},[274,2687,388],{"class":280},[274,2689,309],{"class":280},[274,2691,2471],{"class":312},[274,2693,477],{"class":280},[274,2695,2476],{"class":280},[274,2697,2698],{"class":276,"line":382},[274,2699,2481],{"class":280},[274,2701,2702],{"class":276,"line":397},[274,2703,2385],{"class":280},[274,2705,2706,2708,2710,2712,2714,2716,2719,2721],{"class":276,"line":410},[274,2707,2390],{"class":280},[274,2709,2618],{"class":2393},[274,2711,477],{"class":280},[274,2713,388],{"class":280},[274,2715,309],{"class":280},[274,2717,2718],{"class":312},"grid_block",[274,2720,477],{"class":280},[274,2722,394],{"class":280},[274,2724,2725,2727,2729,2731,2733,2735],{"class":276,"line":423},[274,2726,2390],{"class":280},[274,2728,2505],{"class":2393},[274,2730,477],{"class":280},[274,2732,388],{"class":280},[274,2734,2512],{"class":2408},[274,2736,394],{"class":280},[274,2738,2739,2741,2743,2745,2747,2749,2751],{"class":276,"line":429},[274,2740,2390],{"class":280},[274,2742,2521],{"class":2393},[274,2744,477],{"class":280},[274,2746,388],{"class":280},[274,2748,2528],{"class":280},[274,2750,2531],{"class":302},[274,2752,2753],{"class":280},"],\n",[274,2755,2756,2758,2760,2762,2764,2766,2768,2770,2772,2774,2776,2778,2780],{"class":276,"line":439},[274,2757,2390],{"class":280},[274,2759,2451],{"class":2393},[274,2761,477],{"class":280},[274,2763,388],{"class":280},[274,2765,858],{"class":280},[274,2767,309],{"class":280},[274,2769,2462],{"class":2408},[274,2771,477],{"class":280},[274,2773,388],{"class":280},[274,2775,309],{"class":280},[274,2777,2563],{"class":312},[274,2779,477],{"class":280},[274,2781,2476],{"class":280},[274,2783,2784],{"class":276,"line":444},[274,2785,2572],{"class":280},[274,2787,2788],{"class":276,"line":454},[274,2789,2577],{"class":280},[274,2791,2792],{"class":276,"line":460},[274,2793,426],{"class":280},[85,2795,2797],{"id":2796},"component-props","Component Props",[81,2799,2800],{},"Each rendered component receives:",[264,2802,2806],{"className":2803,"code":2804,"language":2805,"meta":270,"style":270},"language-typescript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F Original block props\n{\n title: \"Welcome\",\n subtitle: \"To our site\",\n \u002F\u002F ... other block fields\n\n \u002F\u002F Additional meta props\n blockType: \"hero\",\n blockMetadata: { uid: \"hero_123\", ... }\n}\n","typescript",[208,2807,2808,2813,2817,2832,2847,2852,2856,2861,2876,2904],{"__ignoreMap":270},[274,2809,2810],{"class":276,"line":277},[274,2811,2812],{"class":363},"\u002F\u002F Original block props\n",[274,2814,2815],{"class":276,"line":295},[274,2816,885],{"class":280},[274,2818,2819,2822,2824,2826,2828,2830],{"class":276,"line":319},[274,2820,2821],{"class":2393}," title",[274,2823,388],{"class":280},[274,2825,309],{"class":280},[274,2827,2417],{"class":312},[274,2829,477],{"class":280},[274,2831,394],{"class":280},[274,2833,2834,2837,2839,2841,2843,2845],{"class":276,"line":336},[274,2835,2836],{"class":2393}," subtitle",[274,2838,388],{"class":280},[274,2840,309],{"class":280},[274,2842,2437],{"class":312},[274,2844,477],{"class":280},[274,2846,394],{"class":280},[274,2848,2849],{"class":276,"line":353},[274,2850,2851],{"class":363}," \u002F\u002F ... other block fields\n",[274,2853,2854],{"class":276,"line":360},[274,2855,357],{"emptyLinePlaceholder":356},[274,2857,2858],{"class":276,"line":367},[274,2859,2860],{"class":363}," \u002F\u002F Additional meta props\n",[274,2862,2863,2866,2868,2870,2872,2874],{"class":276,"line":382},[274,2864,2865],{"class":2393}," blockType",[274,2867,388],{"class":280},[274,2869,309],{"class":280},[274,2871,2394],{"class":312},[274,2873,477],{"class":280},[274,2875,394],{"class":280},[274,2877,2878,2881,2883,2885,2888,2890,2892,2894,2896,2899,2902],{"class":276,"line":397},[274,2879,2880],{"class":2393}," blockMetadata",[274,2882,388],{"class":280},[274,2884,858],{"class":280},[274,2886,2887],{"class":2393}," uid",[274,2889,388],{"class":280},[274,2891,309],{"class":280},[274,2893,2471],{"class":312},[274,2895,477],{"class":280},[274,2897,2898],{"class":280},",",[274,2900,2901],{"class":280}," ...",[274,2903,2476],{"class":280},[274,2905,2906],{"class":276,"line":410},[274,2907,426],{"class":280},[85,2909,2911],{"id":2910},"live-preview-integration","Live Preview Integration",[81,2913,2914],{},"The component automatically adds Live Preview attributes:",[264,2916,2920],{"className":2917,"code":2918,"language":2919,"meta":270,"style":270},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Csection class=\"contentstack-modular-blocks\">\n \u003Ccomponent\n :is=\"Hero\"\n :title=\"Welcome\"\n data-block-type=\"hero\"\n data-block-index=\"0\"\n data-cslp=\"hero.title\"\n \u002F>\n\u003C\u002Fsection>\n","html",[208,2921,2922,2942,2949,2963,2976,2989,3002,3016,3020],{"__ignoreMap":270},[274,2923,2924,2926,2929,2931,2933,2935,2938,2940],{"class":276,"line":277},[274,2925,281],{"class":280},[274,2927,2928],{"class":284},"section",[274,2930,611],{"class":288},[274,2932,376],{"class":280},[274,2934,477],{"class":280},[274,2936,2937],{"class":312},"contentstack-modular-blocks",[274,2939,477],{"class":280},[274,2941,292],{"class":280},[274,2943,2944,2946],{"class":276,"line":295},[274,2945,463],{"class":280},[274,2947,2948],{"class":284},"component\n",[274,2950,2951,2954,2956,2958,2961],{"class":276,"line":319},[274,2952,2953],{"class":288}," :is",[274,2955,376],{"class":280},[274,2957,477],{"class":280},[274,2959,2960],{"class":312},"Hero",[274,2962,316],{"class":280},[274,2964,2965,2968,2970,2972,2974],{"class":276,"line":336},[274,2966,2967],{"class":288}," :title",[274,2969,376],{"class":280},[274,2971,477],{"class":280},[274,2973,2417],{"class":312},[274,2975,316],{"class":280},[274,2977,2978,2981,2983,2985,2987],{"class":276,"line":353},[274,2979,2980],{"class":288}," data-block-type",[274,2982,376],{"class":280},[274,2984,477],{"class":280},[274,2986,2394],{"class":312},[274,2988,316],{"class":280},[274,2990,2991,2994,2996,2998,3000],{"class":276,"line":360},[274,2992,2993],{"class":288}," data-block-index",[274,2995,376],{"class":280},[274,2997,477],{"class":280},[274,2999,141],{"class":312},[274,3001,316],{"class":280},[274,3003,3004,3007,3009,3011,3014],{"class":276,"line":367},[274,3005,3006],{"class":288}," data-cslp",[274,3008,376],{"class":280},[274,3010,477],{"class":280},[274,3012,3013],{"class":312},"hero.title",[274,3015,316],{"class":280},[274,3017,3018],{"class":276,"line":382},[274,3019,990],{"class":280},[274,3021,3022,3024,3026],{"class":276,"line":397},[274,3023,432],{"class":280},[274,3025,2928],{"class":284},[274,3027,292],{"class":280},[85,3029,3031],{"id":3030},"exposed-methods","Exposed Methods",[81,3033,3034],{},"The component exposes methods via template refs for programmatic control:",[1419,3036,3037,3046],{},[1422,3038,3039],{},[1425,3040,3041,3044],{},[1428,3042,3043],{},"Method",[1428,3045,1439],{},[1441,3047,3048],{},[1425,3049,3050,3055],{},[1446,3051,3052],{},[208,3053,3054],{},"refreshEntry",[1446,3056,3057],{},"Re-fetch the entry data (only works in auto-fetch mode)",[264,3059,3061],{"className":266,"code":3060,"filename":268,"language":269,"meta":270,"style":270},"\u003Cscript setup>\nconst blocksRef = ref()\n\n\u002F\u002F Programmatically refresh the entry data\nconst handleRefresh = () => {\n blocksRef.value?.refreshEntry()\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003CContentstackModularBlocks\n ref=\"blocksRef\"\n content-type-uid=\"page\"\n :url=\"$route.path\"\n :component-map=\"componentMapping\"\n \u002F>\n \u003Cbutton @click=\"handleRefresh\">Refresh Content\u003C\u002Fbutton>\n\u003C\u002Ftemplate>\n",[208,3062,3063,3073,3088,3092,3097,3114,3131,3135,3143,3147,3155,3161,3175,3187,3199,3211,3215,3245],{"__ignoreMap":270},[274,3064,3065,3067,3069,3071],{"class":276,"line":277},[274,3066,281],{"class":280},[274,3068,285],{"class":284},[274,3070,289],{"class":288},[274,3072,292],{"class":280},[274,3074,3075,3077,3080,3082,3085],{"class":276,"line":295},[274,3076,370],{"class":288},[274,3078,3079],{"class":302}," blocksRef ",[274,3081,376],{"class":280},[274,3083,3084],{"class":878}," ref",[274,3086,3087],{"class":302},"()\n",[274,3089,3090],{"class":276,"line":319},[274,3091,357],{"emptyLinePlaceholder":356},[274,3093,3094],{"class":276,"line":336},[274,3095,3096],{"class":363},"\u002F\u002F Programmatically refresh the entry data\n",[274,3098,3099,3101,3104,3106,3109,3112],{"class":276,"line":353},[274,3100,370],{"class":288},[274,3102,3103],{"class":302}," handleRefresh ",[274,3105,376],{"class":280},[274,3107,3108],{"class":280}," ()",[274,3110,3111],{"class":288}," =>",[274,3113,379],{"class":280},[274,3115,3116,3119,3121,3124,3127,3129],{"class":276,"line":360},[274,3117,3118],{"class":302}," blocksRef",[274,3120,916],{"class":280},[274,3122,3123],{"class":302},"value",[274,3125,3126],{"class":280},"?.",[274,3128,3054],{"class":878},[274,3130,3087],{"class":284},[274,3132,3133],{"class":276,"line":367},[274,3134,426],{"class":280},[274,3136,3137,3139,3141],{"class":276,"line":382},[274,3138,432],{"class":280},[274,3140,285],{"class":284},[274,3142,292],{"class":280},[274,3144,3145],{"class":276,"line":397},[274,3146,357],{"emptyLinePlaceholder":356},[274,3148,3149,3151,3153],{"class":276,"line":410},[274,3150,281],{"class":280},[274,3152,449],{"class":284},[274,3154,292],{"class":280},[274,3156,3157,3159],{"class":276,"line":423},[274,3158,463],{"class":280},[274,3160,466],{"class":284},[274,3162,3163,3166,3168,3170,3173],{"class":276,"line":429},[274,3164,3165],{"class":288}," ref",[274,3167,376],{"class":280},[274,3169,477],{"class":280},[274,3171,3172],{"class":312},"blocksRef",[274,3174,316],{"class":280},[274,3176,3177,3179,3181,3183,3185],{"class":276,"line":439},[274,3178,472],{"class":288},[274,3180,376],{"class":280},[274,3182,477],{"class":280},[274,3184,480],{"class":312},[274,3186,316],{"class":280},[274,3188,3189,3191,3193,3195,3197],{"class":276,"line":444},[274,3190,488],{"class":288},[274,3192,376],{"class":280},[274,3194,477],{"class":280},[274,3196,495],{"class":312},[274,3198,316],{"class":280},[274,3200,3201,3203,3205,3207,3209],{"class":276,"line":454},[274,3202,563],{"class":288},[274,3204,376],{"class":280},[274,3206,477],{"class":280},[274,3208,570],{"class":312},[274,3210,316],{"class":280},[274,3212,3213],{"class":276,"line":460},[274,3214,990],{"class":280},[274,3216,3217,3219,3222,3225,3227,3229,3232,3234,3236,3239,3241,3243],{"class":276,"line":469},[274,3218,463],{"class":280},[274,3220,3221],{"class":284},"button",[274,3223,3224],{"class":288}," @click",[274,3226,376],{"class":280},[274,3228,477],{"class":280},[274,3230,3231],{"class":312},"handleRefresh",[274,3233,477],{"class":280},[274,3235,623],{"class":280},[274,3237,3238],{"class":302},"Refresh Content",[274,3240,432],{"class":280},[274,3242,3221],{"class":284},[274,3244,292],{"class":280},[274,3246,3247,3249,3251],{"class":276,"line":485},[274,3248,432],{"class":280},[274,3250,449],{"class":284},[274,3252,292],{"class":280},[85,3254,3256],{"id":3255},"slots","Slots",[81,3258,3259],{},"The component provides several slots for customizing different states:",[1419,3261,3262,3274],{},[1422,3263,3264],{},[1425,3265,3266,3269,3271],{},[1428,3267,3268],{},"Slot",[1428,3270,1439],{},[1428,3272,3273],{},"Available When",[1441,3275,3276,3288,3300],{},[1425,3277,3278,3282,3285],{},[1446,3279,3280],{},[208,3281,598],{},[1446,3283,3284],{},"Custom loading state content",[1446,3286,3287],{},"Auto-fetch is enabled and data is loading",[1425,3289,3290,3294,3297],{},[1446,3291,3292],{},[208,3293,665],{},[1446,3295,3296],{},"Custom error state content",[1446,3298,3299],{},"Auto-fetch fails or encounters an error",[1425,3301,3302,3306,3309],{},[1446,3303,3304],{},[208,3305,1319],{},[1446,3307,3308],{},"Custom empty state content",[1446,3310,3311],{},"No blocks are available to render",[256,3313,3315],{"id":3314},"custom-slot-examples","Custom Slot Examples",[264,3317,3319],{"className":266,"code":3318,"language":269,"meta":270,"style":270},"\u003Ctemplate>\n \u003CContentstackModularBlocks\n content-type-uid=\"page\"\n :url=\"$route.path\"\n :component-map=\"componentMapping\"\n >\n \u003C!-- Custom loading spinner -->\n \u003Ctemplate #loading>\n \u003Cdiv class=\"flex items-center justify-center py-12\">\n \u003Cdiv\n class=\"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600\"\n >\u003C\u002Fdiv>\n \u003Cspan class=\"ml-3\">Loading page content...\u003C\u002Fspan>\n \u003C\u002Fdiv>\n \u003C\u002Ftemplate>\n\n \u003C!-- Custom error message -->\n \u003Ctemplate #error>\n \u003Cdiv class=\"bg-red-50 border border-red-200 rounded-lg p-6 text-center\">\n \u003Ch3 class=\"text-red-800 font-semibold\">Content Unavailable\u003C\u002Fh3>\n \u003Cp class=\"text-red-600 mt-2\">\n Unable to load page content. Please try again later.\n \u003C\u002Fp>\n \u003C\u002Fdiv>\n \u003C\u002Ftemplate>\n\n \u003C!-- Custom empty state -->\n \u003Ctemplate #empty>\n \u003Cdiv class=\"text-center py-12 text-gray-500\">\n \u003Ch3 class=\"text-lg font-medium\">No Content Available\u003C\u002Fh3>\n \u003Cp class=\"mt-2\">This page doesn't have any content blocks yet.\u003C\u002Fp>\n \u003C\u002Fdiv>\n \u003C\u002Ftemplate>\n \u003C\u002FContentstackModularBlocks>\n\u003C\u002Ftemplate>\n",[208,3320,3321,3329,3335,3347,3359,3371,3375,3380,3392,3411,3418,3432,3441,3468,3476,3484,3488,3493,3505,3524,3552,3571,3576,3585,3593,3601,3605,3609,3621,3640,3668,3696,3704,3712,3720],{"__ignoreMap":270},[274,3322,3323,3325,3327],{"class":276,"line":277},[274,3324,281],{"class":280},[274,3326,449],{"class":284},[274,3328,292],{"class":280},[274,3330,3331,3333],{"class":276,"line":295},[274,3332,463],{"class":280},[274,3334,466],{"class":284},[274,3336,3337,3339,3341,3343,3345],{"class":276,"line":319},[274,3338,472],{"class":288},[274,3340,376],{"class":280},[274,3342,477],{"class":280},[274,3344,480],{"class":312},[274,3346,316],{"class":280},[274,3348,3349,3351,3353,3355,3357],{"class":276,"line":336},[274,3350,488],{"class":288},[274,3352,376],{"class":280},[274,3354,477],{"class":280},[274,3356,495],{"class":312},[274,3358,316],{"class":280},[274,3360,3361,3363,3365,3367,3369],{"class":276,"line":353},[274,3362,563],{"class":288},[274,3364,376],{"class":280},[274,3366,477],{"class":280},[274,3368,570],{"class":312},[274,3370,316],{"class":280},[274,3372,3373],{"class":276,"line":360},[274,3374,578],{"class":280},[274,3376,3377],{"class":276,"line":367},[274,3378,3379],{"class":363}," \u003C!-- Custom loading spinner -->\n",[274,3381,3382,3384,3386,3388,3390],{"class":276,"line":382},[274,3383,590],{"class":280},[274,3385,449],{"class":284},[274,3387,595],{"class":280},[274,3389,598],{"class":288},[274,3391,292],{"class":280},[274,3393,3394,3396,3398,3400,3402,3404,3407,3409],{"class":276,"line":397},[274,3395,606],{"class":280},[274,3397,131],{"class":284},[274,3399,611],{"class":288},[274,3401,376],{"class":280},[274,3403,477],{"class":280},[274,3405,3406],{"class":312},"flex items-center justify-center py-12",[274,3408,477],{"class":280},[274,3410,292],{"class":280},[274,3412,3413,3415],{"class":276,"line":410},[274,3414,1345],{"class":280},[274,3416,3417],{"class":284},"div\n",[274,3419,3420,3423,3425,3427,3430],{"class":276,"line":423},[274,3421,3422],{"class":288}," class",[274,3424,376],{"class":280},[274,3426,477],{"class":280},[274,3428,3429],{"class":312},"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600",[274,3431,316],{"class":280},[274,3433,3434,3437,3439],{"class":276,"line":429},[274,3435,3436],{"class":280}," >\u003C\u002F",[274,3438,131],{"class":284},[274,3440,292],{"class":280},[274,3442,3443,3445,3447,3449,3451,3453,3456,3458,3460,3462,3464,3466],{"class":276,"line":439},[274,3444,1345],{"class":280},[274,3446,274],{"class":284},[274,3448,611],{"class":288},[274,3450,376],{"class":280},[274,3452,477],{"class":280},[274,3454,3455],{"class":312},"ml-3",[274,3457,477],{"class":280},[274,3459,623],{"class":280},[274,3461,626],{"class":302},[274,3463,432],{"class":280},[274,3465,274],{"class":284},[274,3467,292],{"class":280},[274,3469,3470,3472,3474],{"class":276,"line":444},[274,3471,1380],{"class":280},[274,3473,131],{"class":284},[274,3475,292],{"class":280},[274,3477,3478,3480,3482],{"class":276,"line":454},[274,3479,638],{"class":280},[274,3481,449],{"class":284},[274,3483,292],{"class":280},[274,3485,3486],{"class":276,"line":460},[274,3487,357],{"emptyLinePlaceholder":356},[274,3489,3490],{"class":276,"line":469},[274,3491,3492],{"class":363}," \u003C!-- Custom error message -->\n",[274,3494,3495,3497,3499,3501,3503],{"class":276,"line":485},[274,3496,590],{"class":280},[274,3498,449],{"class":284},[274,3500,595],{"class":280},[274,3502,665],{"class":288},[274,3504,292],{"class":280},[274,3506,3507,3509,3511,3513,3515,3517,3520,3522],{"class":276,"line":500},[274,3508,606],{"class":280},[274,3510,131],{"class":284},[274,3512,611],{"class":288},[274,3514,376],{"class":280},[274,3516,477],{"class":280},[274,3518,3519],{"class":312},"bg-red-50 border border-red-200 rounded-lg p-6 text-center",[274,3521,477],{"class":280},[274,3523,292],{"class":280},[274,3525,3526,3528,3530,3532,3534,3536,3539,3541,3543,3546,3548,3550],{"class":276,"line":515},[274,3527,1345],{"class":280},[274,3529,85],{"class":284},[274,3531,611],{"class":288},[274,3533,376],{"class":280},[274,3535,477],{"class":280},[274,3537,3538],{"class":312},"text-red-800 font-semibold",[274,3540,477],{"class":280},[274,3542,623],{"class":280},[274,3544,3545],{"class":302},"Content Unavailable",[274,3547,432],{"class":280},[274,3549,85],{"class":284},[274,3551,292],{"class":280},[274,3553,3554,3556,3558,3560,3562,3564,3567,3569],{"class":276,"line":530},[274,3555,1345],{"class":280},[274,3557,81],{"class":284},[274,3559,611],{"class":288},[274,3561,376],{"class":280},[274,3563,477],{"class":280},[274,3565,3566],{"class":312},"text-red-600 mt-2",[274,3568,477],{"class":280},[274,3570,292],{"class":280},[274,3572,3573],{"class":276,"line":545},[274,3574,3575],{"class":302}," Unable to load page content. Please try again later.\n",[274,3577,3578,3581,3583],{"class":276,"line":560},[274,3579,3580],{"class":280}," \u003C\u002F",[274,3582,81],{"class":284},[274,3584,292],{"class":280},[274,3586,3587,3589,3591],{"class":276,"line":575},[274,3588,1380],{"class":280},[274,3590,131],{"class":284},[274,3592,292],{"class":280},[274,3594,3595,3597,3599],{"class":276,"line":581},[274,3596,638],{"class":280},[274,3598,449],{"class":284},[274,3600,292],{"class":280},[274,3602,3603],{"class":276,"line":587},[274,3604,357],{"emptyLinePlaceholder":356},[274,3606,3607],{"class":276,"line":603},[274,3608,1308],{"class":363},[274,3610,3611,3613,3615,3617,3619],{"class":276,"line":635},[274,3612,590],{"class":280},[274,3614,449],{"class":284},[274,3616,595],{"class":280},[274,3618,1319],{"class":288},[274,3620,292],{"class":280},[274,3622,3623,3625,3627,3629,3631,3633,3636,3638],{"class":276,"line":645},[274,3624,606],{"class":280},[274,3626,131],{"class":284},[274,3628,611],{"class":288},[274,3630,376],{"class":280},[274,3632,477],{"class":280},[274,3634,3635],{"class":312},"text-center py-12 text-gray-500",[274,3637,477],{"class":280},[274,3639,292],{"class":280},[274,3641,3642,3644,3646,3648,3650,3652,3655,3657,3659,3662,3664,3666],{"class":276,"line":650},[274,3643,1345],{"class":280},[274,3645,85],{"class":284},[274,3647,611],{"class":288},[274,3649,376],{"class":280},[274,3651,477],{"class":280},[274,3653,3654],{"class":312},"text-lg font-medium",[274,3656,477],{"class":280},[274,3658,623],{"class":280},[274,3660,3661],{"class":302},"No Content Available",[274,3663,432],{"class":280},[274,3665,85],{"class":284},[274,3667,292],{"class":280},[274,3669,3670,3672,3674,3676,3678,3680,3683,3685,3687,3690,3692,3694],{"class":276,"line":656},[274,3671,1345],{"class":280},[274,3673,81],{"class":284},[274,3675,611],{"class":288},[274,3677,376],{"class":280},[274,3679,477],{"class":280},[274,3681,3682],{"class":312},"mt-2",[274,3684,477],{"class":280},[274,3686,623],{"class":280},[274,3688,3689],{"class":302},"This page doesn't have any content blocks yet.",[274,3691,432],{"class":280},[274,3693,81],{"class":284},[274,3695,292],{"class":280},[274,3697,3698,3700,3702],{"class":276,"line":670},[274,3699,1380],{"class":280},[274,3701,131],{"class":284},[274,3703,292],{"class":280},[274,3705,3706,3708,3710],{"class":276,"line":699},[274,3707,638],{"class":280},[274,3709,449],{"class":284},[274,3711,292],{"class":280},[274,3713,3714,3716,3718],{"class":276,"line":708},[274,3715,711],{"class":280},[274,3717,714],{"class":284},[274,3719,292],{"class":280},[274,3721,3722,3724,3726],{"class":276,"line":719},[274,3723,432],{"class":280},[274,3725,449],{"class":284},[274,3727,292],{"class":280},[85,3729,3731],{"id":3730},"error-handling","Error Handling",[81,3733,3734],{},"The component gracefully handles various error scenarios:",[96,3736,3737,3745,3755,3761,3767,3776],{},[99,3738,3739,3742,3743],{},[102,3740,3741],{},"Missing components",": Falls back to ",[208,3744,1490],{},[99,3746,3747,3750,3751,3754],{},[102,3748,3749],{},"Empty blocks",": Shows configurable empty state (customizable via ",[208,3752,3753],{},"#empty"," slot)",[99,3756,3757,3760],{},[102,3758,3759],{},"Invalid data",": Gracefully handles malformed block data",[99,3762,3763,3766],{},[102,3764,3765],{},"Missing keys",": Uses index-based keys as fallback",[99,3768,3769,3772,3773,3754],{},[102,3770,3771],{},"Auto-fetch errors",": Shows error state (customizable via ",[208,3774,3775],{},"#error",[99,3777,3778,3781,3782,3754],{},[102,3779,3780],{},"Loading states",": Shows loading state during auto-fetch (customizable via ",[208,3783,3784],{},"#loading",[76,3786,1500],{"id":3787},"contentstackfallbackblock",[81,3789,3790],{},"The module includes a built-in fallback component that provides a developer-friendly display for unmapped block types. This component automatically:",[96,3792,3793,3812,3818,3824,3830],{},[99,3794,3795,3798,3799,3801,3802,3801,3804,3807,3808,3811],{},[102,3796,3797],{},"Displays the block title"," (from ",[208,3800,2254],{},", ",[208,3803,2265],{},[208,3805,3806],{},"heading",", or ",[208,3809,3810],{},"blockType"," fields)",[99,3813,3814,3817],{},[102,3815,3816],{},"Shows the block type"," in a styled badge",[99,3819,3820,3823],{},[102,3821,3822],{},"Renders all props as formatted JSON"," in an expandable details section",[99,3825,3826,3829],{},[102,3827,3828],{},"Provides helpful guidance"," on how to map the component properly",[99,3831,3832,3835],{},[102,3833,3834],{},"Supports dark mode"," for better developer experience",[85,3837,61],{"id":3838},"features-1",[96,3840,3841,3848,3855,3865,3872],{},[99,3842,3843,3844,3847],{},"🎨 ",[102,3845,3846],{},"Styled interface"," with clear visual hierarchy",[99,3849,3850,3851,3854],{},"πŸ“± ",[102,3852,3853],{},"Responsive design"," that works on all screen sizes",[99,3856,3857,3858,3861,3862],{},"πŸŒ™ ",[102,3859,3860],{},"Dark mode support"," with ",[208,3863,3864],{},"prefers-color-scheme",[99,3866,3867,3868,3871],{},"πŸ” ",[102,3869,3870],{},"Collapsible JSON"," to avoid cluttering the UI",[99,3873,3874,3875,3878],{},"πŸ› οΈ ",[102,3876,3877],{},"Developer hints"," showing how to fix unmapped components",[85,3880,3882],{"id":3881},"example-output","Example Output",[264,3884,3889],{"className":3885,"code":3887,"language":3888},[3886],"language-text","β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”\nβ”‚ Welcome Hero Type: hero β”‚\nβ”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€\nβ”‚ β–Ά View Props β”‚\nβ”‚ { β”‚\nβ”‚ \"title\": \"Welcome Hero\", β”‚\nβ”‚ \"subtitle\": \"Get started now\", β”‚\nβ”‚ \"cta_text\": \"Learn More\" β”‚\nβ”‚ } β”‚\nβ”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€\nβ”‚ This is a fallback component. β”‚\nβ”‚ Map \"hero\" to a proper Vue componentβ”‚\nβ””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜\n","text",[208,3890,3887],{"__ignoreMap":270},[85,3892,3894],{"id":3893},"custom-fallback-component","Custom Fallback Component",[81,3896,3897],{},"You can override the default fallback by providing your own:",[264,3899,3901],{"className":266,"code":3900,"language":269,"meta":270,"style":270},"\u003CContentstackModularBlocks\n :blocks=\"page.components\"\n :component-map=\"componentMapping\"\n :fallback-component=\"MyCustomFallback\"\n\u002F>\n",[208,3902,3903,3909,3928,3943,3959],{"__ignoreMap":270},[274,3904,3905,3907],{"class":276,"line":277},[274,3906,281],{"class":280},[274,3908,466],{"class":284},[274,3910,3911,3914,3916,3918,3920,3922,3924,3926],{"class":276,"line":295},[274,3912,3913],{"class":280}," :",[274,3915,1450],{"class":288},[274,3917,376],{"class":280},[274,3919,477],{"class":280},[274,3921,480],{"class":302},[274,3923,916],{"class":280},[274,3925,510],{"class":302},[274,3927,316],{"class":280},[274,3929,3930,3932,3935,3937,3939,3941],{"class":276,"line":319},[274,3931,3913],{"class":280},[274,3933,3934],{"class":288},"component-map",[274,3936,376],{"class":280},[274,3938,477],{"class":280},[274,3940,570],{"class":302},[274,3942,316],{"class":280},[274,3944,3945,3947,3950,3952,3954,3957],{"class":276,"line":336},[274,3946,3913],{"class":280},[274,3948,3949],{"class":288},"fallback-component",[274,3951,376],{"class":280},[274,3953,477],{"class":280},[274,3955,3956],{"class":302},"MyCustomFallback",[274,3958,316],{"class":280},[274,3960,3961],{"class":276,"line":353},[274,3962,3963],{"class":302},"\u002F>\n",[76,3965,3967],{"id":3966},"creating-block-components","Creating Block Components",[81,3969,3970],{},"When creating your block components, follow these patterns for the best experience:",[85,3972,3974],{"id":3973},"basic-block-component","Basic Block Component",[264,3976,3979],{"className":266,"code":3977,"filename":3978,"language":269,"meta":270,"style":270},"\u003Cscript setup lang=\"ts\">\ninterface Props {\n title: string\n subtitle?: string\n cta_text?: string\n cta_link?: string\n background_image?: {\n url: string\n title: string\n }\n \u002F\u002F Meta props automatically added by ContentstackModularBlocks\n blockType?: string\n blockMetadata?: any\n}\n\nconst props = defineProps\u003CProps>()\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Csection class=\"hero\" :style=\"{ backgroundImage: `url(${background_image?.url})` }\">\n \u003Cdiv class=\"hero-content\">\n \u003Ch1>{{ title }}\u003C\u002Fh1>\n \u003Cp v-if=\"subtitle\">{{ subtitle }}\u003C\u002Fp>\n \u003CNuxtLink v-if=\"cta_link\" :to=\"cta_link\" class=\"cta-button\">\n {{ cta_text || 'Learn More' }}\n \u003C\u002FNuxtLink>\n \u003C\u002Fdiv>\n \u003C\u002Fsection>\n\u003C\u002Ftemplate>\n\n\u003Cstyle scoped>\n.hero {\n @apply min-h-screen flex items-center justify-center bg-cover bg-center;\n}\n\n.hero-content {\n @apply text-center text-white max-w-4xl mx-auto px-6;\n}\n\n.hero h1 {\n @apply text-5xl font-bold mb-4;\n}\n\n.hero p {\n @apply text-xl mb-8;\n}\n\n.cta-button {\n @apply inline-block bg-blue-600 hover:bg-blue-700 text-white font-semibold py-3 px-8 rounded-lg transition-colors;\n}\n\u003C\u002Fstyle>\n","components\u002Fblocks\u002FHero.vue",[208,3980,3981,4003,4013,4022,4031,4040,4049,4058,4067,4076,4081,4086,4094,4103,4107,4111,4132,4140,4144,4152,4182,4201,4219,4247,4289,4294,4302,4310,4318,4326,4330,4342,4350,4365,4369,4373,4381,4389,4394,4399,4411,4419,4424,4429,4441,4449,4454,4459,4468,4481,4486],{"__ignoreMap":270},[274,3982,3983,3985,3987,3989,3992,3994,3996,3999,4001],{"class":276,"line":277},[274,3984,281],{"class":280},[274,3986,285],{"class":284},[274,3988,289],{"class":288},[274,3990,3991],{"class":288}," lang",[274,3993,376],{"class":280},[274,3995,477],{"class":280},[274,3997,3998],{"class":312},"ts",[274,4000,477],{"class":280},[274,4002,292],{"class":280},[274,4004,4005,4008,4011],{"class":276,"line":295},[274,4006,4007],{"class":288},"interface",[274,4009,4010],{"class":2393}," Props",[274,4012,379],{"class":280},[274,4014,4015,4017,4019],{"class":276,"line":319},[274,4016,2821],{"class":284},[274,4018,388],{"class":280},[274,4020,4021],{"class":2393}," string\n",[274,4023,4024,4026,4029],{"class":276,"line":336},[274,4025,2836],{"class":284},[274,4027,4028],{"class":280},"?:",[274,4030,4021],{"class":2393},[274,4032,4033,4036,4038],{"class":276,"line":353},[274,4034,4035],{"class":284}," cta_text",[274,4037,4028],{"class":280},[274,4039,4021],{"class":2393},[274,4041,4042,4045,4047],{"class":276,"line":360},[274,4043,4044],{"class":284}," cta_link",[274,4046,4028],{"class":280},[274,4048,4021],{"class":2393},[274,4050,4051,4054,4056],{"class":276,"line":367},[274,4052,4053],{"class":284}," background_image",[274,4055,4028],{"class":280},[274,4057,379],{"class":280},[274,4059,4060,4063,4065],{"class":276,"line":382},[274,4061,4062],{"class":284}," url",[274,4064,388],{"class":280},[274,4066,4021],{"class":2393},[274,4068,4069,4072,4074],{"class":276,"line":397},[274,4070,4071],{"class":284}," title",[274,4073,388],{"class":280},[274,4075,4021],{"class":2393},[274,4077,4078],{"class":276,"line":410},[274,4079,4080],{"class":280}," }\n",[274,4082,4083],{"class":276,"line":423},[274,4084,4085],{"class":363}," \u002F\u002F Meta props automatically added by ContentstackModularBlocks\n",[274,4087,4088,4090,4092],{"class":276,"line":429},[274,4089,2865],{"class":284},[274,4091,4028],{"class":280},[274,4093,4021],{"class":2393},[274,4095,4096,4098,4100],{"class":276,"line":439},[274,4097,2880],{"class":284},[274,4099,4028],{"class":280},[274,4101,4102],{"class":2393}," any\n",[274,4104,4105],{"class":276,"line":444},[274,4106,426],{"class":280},[274,4108,4109],{"class":276,"line":454},[274,4110,357],{"emptyLinePlaceholder":356},[274,4112,4113,4115,4118,4120,4123,4125,4128,4130],{"class":276,"line":460},[274,4114,370],{"class":288},[274,4116,4117],{"class":302}," props ",[274,4119,376],{"class":280},[274,4121,4122],{"class":878}," defineProps",[274,4124,281],{"class":280},[274,4126,4127],{"class":2393},"Props",[274,4129,623],{"class":280},[274,4131,3087],{"class":302},[274,4133,4134,4136,4138],{"class":276,"line":469},[274,4135,432],{"class":280},[274,4137,285],{"class":284},[274,4139,292],{"class":280},[274,4141,4142],{"class":276,"line":485},[274,4143,357],{"emptyLinePlaceholder":356},[274,4145,4146,4148,4150],{"class":276,"line":500},[274,4147,281],{"class":280},[274,4149,449],{"class":284},[274,4151,292],{"class":280},[274,4153,4154,4156,4158,4160,4162,4164,4166,4168,4171,4173,4175,4178,4180],{"class":276,"line":515},[274,4155,463],{"class":280},[274,4157,2928],{"class":284},[274,4159,611],{"class":288},[274,4161,376],{"class":280},[274,4163,477],{"class":280},[274,4165,2394],{"class":312},[274,4167,477],{"class":280},[274,4169,4170],{"class":288}," :style",[274,4172,376],{"class":280},[274,4174,477],{"class":280},[274,4176,4177],{"class":312},"{ backgroundImage: `url(${background_image?.url})` }",[274,4179,477],{"class":280},[274,4181,292],{"class":280},[274,4183,4184,4186,4188,4190,4192,4194,4197,4199],{"class":276,"line":530},[274,4185,590],{"class":280},[274,4187,131],{"class":284},[274,4189,611],{"class":288},[274,4191,376],{"class":280},[274,4193,477],{"class":280},[274,4195,4196],{"class":312},"hero-content",[274,4198,477],{"class":280},[274,4200,292],{"class":280},[274,4202,4203,4205,4208,4210,4213,4215,4217],{"class":276,"line":545},[274,4204,606],{"class":280},[274,4206,4207],{"class":284},"h1",[274,4209,623],{"class":280},[274,4211,4212],{"class":302},"{{ title }}",[274,4214,432],{"class":280},[274,4216,4207],{"class":284},[274,4218,292],{"class":280},[274,4220,4221,4223,4225,4228,4230,4232,4234,4236,4238,4241,4243,4245],{"class":276,"line":560},[274,4222,606],{"class":280},[274,4224,81],{"class":284},[274,4226,4227],{"class":288}," v-if",[274,4229,376],{"class":280},[274,4231,477],{"class":280},[274,4233,2428],{"class":312},[274,4235,477],{"class":280},[274,4237,623],{"class":280},[274,4239,4240],{"class":302},"{{ subtitle }}",[274,4242,432],{"class":280},[274,4244,81],{"class":284},[274,4246,292],{"class":280},[274,4248,4249,4251,4254,4256,4258,4260,4263,4265,4268,4270,4272,4274,4276,4278,4280,4282,4285,4287],{"class":276,"line":575},[274,4250,606],{"class":280},[274,4252,4253],{"class":284},"NuxtLink",[274,4255,4227],{"class":288},[274,4257,376],{"class":280},[274,4259,477],{"class":280},[274,4261,4262],{"class":312},"cta_link",[274,4264,477],{"class":280},[274,4266,4267],{"class":288}," :to",[274,4269,376],{"class":280},[274,4271,477],{"class":280},[274,4273,4262],{"class":312},[274,4275,477],{"class":280},[274,4277,611],{"class":288},[274,4279,376],{"class":280},[274,4281,477],{"class":280},[274,4283,4284],{"class":312},"cta-button",[274,4286,477],{"class":280},[274,4288,292],{"class":280},[274,4290,4291],{"class":276,"line":581},[274,4292,4293],{"class":302}," {{ cta_text || 'Learn More' }}\n",[274,4295,4296,4298,4300],{"class":276,"line":587},[274,4297,1380],{"class":280},[274,4299,4253],{"class":284},[274,4301,292],{"class":280},[274,4303,4304,4306,4308],{"class":276,"line":603},[274,4305,638],{"class":280},[274,4307,131],{"class":284},[274,4309,292],{"class":280},[274,4311,4312,4314,4316],{"class":276,"line":635},[274,4313,711],{"class":280},[274,4315,2928],{"class":284},[274,4317,292],{"class":280},[274,4319,4320,4322,4324],{"class":276,"line":645},[274,4321,432],{"class":280},[274,4323,449],{"class":284},[274,4325,292],{"class":280},[274,4327,4328],{"class":276,"line":650},[274,4329,357],{"emptyLinePlaceholder":356},[274,4331,4332,4334,4337,4340],{"class":276,"line":656},[274,4333,281],{"class":280},[274,4335,4336],{"class":284},"style",[274,4338,4339],{"class":288}," scoped",[274,4341,292],{"class":280},[274,4343,4344,4346,4348],{"class":276,"line":670},[274,4345,916],{"class":280},[274,4347,2394],{"class":2393},[274,4349,379],{"class":280},[274,4351,4352,4355,4359,4362],{"class":276,"line":699},[274,4353,4354],{"class":302}," @apply min-h-screen ",[274,4356,4358],{"class":4357},"sqsOY","flex",[274,4360,4361],{"class":302}," items-center justify-center bg-cover bg-center",[274,4363,4364],{"class":280},";\n",[274,4366,4367],{"class":276,"line":708},[274,4368,426],{"class":280},[274,4370,4371],{"class":276,"line":719},[274,4372,357],{"emptyLinePlaceholder":356},[274,4374,4375,4377,4379],{"class":276,"line":1403},[274,4376,916],{"class":280},[274,4378,4196],{"class":2393},[274,4380,379],{"class":280},[274,4382,4384,4387],{"class":276,"line":4383},37,[274,4385,4386],{"class":302}," @apply text-center text-white max-w-4xl mx-auto px-6",[274,4388,4364],{"class":280},[274,4390,4392],{"class":276,"line":4391},38,[274,4393,426],{"class":280},[274,4395,4397],{"class":276,"line":4396},39,[274,4398,357],{"emptyLinePlaceholder":356},[274,4400,4402,4404,4406,4409],{"class":276,"line":4401},40,[274,4403,916],{"class":280},[274,4405,2394],{"class":2393},[274,4407,4408],{"class":2393}," h1",[274,4410,379],{"class":280},[274,4412,4414,4417],{"class":276,"line":4413},41,[274,4415,4416],{"class":302}," @apply text-5xl font-bold mb-4",[274,4418,4364],{"class":280},[274,4420,4422],{"class":276,"line":4421},42,[274,4423,426],{"class":280},[274,4425,4427],{"class":276,"line":4426},43,[274,4428,357],{"emptyLinePlaceholder":356},[274,4430,4432,4434,4436,4439],{"class":276,"line":4431},44,[274,4433,916],{"class":280},[274,4435,2394],{"class":2393},[274,4437,4438],{"class":2393}," p",[274,4440,379],{"class":280},[274,4442,4444,4447],{"class":276,"line":4443},45,[274,4445,4446],{"class":302}," @apply text-xl mb-8",[274,4448,4364],{"class":280},[274,4450,4452],{"class":276,"line":4451},46,[274,4453,426],{"class":280},[274,4455,4457],{"class":276,"line":4456},47,[274,4458,357],{"emptyLinePlaceholder":356},[274,4460,4462,4464,4466],{"class":276,"line":4461},48,[274,4463,916],{"class":280},[274,4465,4284],{"class":2393},[274,4467,379],{"class":280},[274,4469,4471,4474,4476,4479],{"class":276,"line":4470},49,[274,4472,4473],{"class":302}," @apply inline-block bg-blue-600 hover",[274,4475,388],{"class":280},[274,4477,4478],{"class":302},"bg-blue-700 text-white font-semibold py-3 px-8 rounded-lg transition-colors",[274,4480,4364],{"class":280},[274,4482,4484],{"class":276,"line":4483},50,[274,4485,426],{"class":280},[274,4487,4489,4491,4493],{"class":276,"line":4488},51,[274,4490,432],{"class":280},[274,4492,4336],{"class":284},[274,4494,292],{"class":280},[85,4496,4498],{"id":4497},"block-component-with-references","Block Component with References",[264,4500,4503],{"className":266,"code":4501,"filename":4502,"language":269,"meta":270,"style":270},"\u003Cscript setup lang=\"ts\">\ninterface Article {\n uid: string\n title: string\n url: string\n excerpt: string\n featured_image?: {\n url: string\n title: string\n }\n author?: {\n name: string\n avatar?: {\n url: string\n }\n }\n}\n\ninterface Props {\n title: string\n articles: Article[]\n show_author?: boolean\n blockType?: string\n blockMetadata?: any\n}\n\nconst props = defineProps\u003CProps>()\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Csection class=\"article-list\">\n \u003Cdiv class=\"container mx-auto px-6 py-12\">\n \u003Ch2 class=\"text-3xl font-bold mb-8\">{{ title }}\u003C\u002Fh2>\n \n \u003Cdiv class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6\">\n \u003Carticle \n v-for=\"article in articles\" \n :key=\"article.uid\"\n class=\"article-card\"\n >\n \u003CNuxtImg\n v-if=\"article.featured_image\"\n :src=\"article.featured_image.url\"\n :alt=\"article.featured_image.title\"\n class=\"article-image\"\n width=\"400\"\n height=\"250\"\n provider=\"contentstack\"\n \u002F>\n \n \u003Cdiv class=\"article-content\">\n \u003Ch3 class=\"article-title\">\n \u003CNuxtLink :to=\"`\u002Fblog\u002F${article.url}`\">\n {{ article.title }}\n \u003C\u002FNuxtLink>\n \u003C\u002Fh3>\n \n \u003Cp class=\"article-excerpt\">{{ article.excerpt }}\u003C\u002Fp>\n \n \u003Cdiv v-if=\"show_author && article.author\" class=\"article-author\">\n \u003Cimg \n v-if=\"article.author.avatar\"\n :src=\"article.author.avatar.url\" \n :alt=\"article.author.name\"\n class=\"author-avatar\"\n >\n \u003Cspan>{{ article.author.name }}\u003C\u002Fspan>\n \u003C\u002Fdiv>\n \u003C\u002Fdiv>\n \u003C\u002Farticle>\n \u003C\u002Fdiv>\n \u003C\u002Fdiv>\n \u003C\u002Fsection>\n\u003C\u002Ftemplate>\n\n\u003Cstyle scoped>\n.article-card {\n @apply bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow;\n}\n\n.article-image {\n @apply w-full h-48 object-cover;\n}\n\n.article-content {\n @apply p-6;\n}\n\n.article-title a {\n @apply text-xl font-semibold text-gray-900 hover:text-blue-600 transition-colors;\n}\n\n.article-excerpt {\n @apply text-gray-600 mt-2 mb-4;\n}\n\n.article-author {\n @apply flex items-center space-x-2 text-sm text-gray-500;\n}\n\n.author-avatar {\n @apply w-6 h-6 rounded-full;\n}\n\u003C\u002Fstyle>\n","components\u002Fblocks\u002FArticleList.vue",[208,4504,4505,4525,4534,4543,4551,4559,4568,4577,4585,4593,4597,4606,4615,4624,4633,4637,4641,4645,4649,4657,4665,4677,4687,4695,4703,4707,4711,4729,4737,4741,4749,4768,4787,4814,4819,4838,4848,4864,4878,4891,4896,4904,4918,4932,4946,4960,4974,4988,5002,5007,5012,5031,5052,5073,5079,5089,5099,5105,5134,5139,5170,5180,5195,5212,5227,5242,5248,5266,5275,5285,5294,5303,5312,5321,5330,5335,5346,5355,5368,5373,5378,5387,5395,5400,5405,5414,5422,5427,5432,5444,5457,5462,5467,5476,5484,5489,5494,5503,5516,5521,5526,5535,5543,5548],{"__ignoreMap":270},[274,4506,4507,4509,4511,4513,4515,4517,4519,4521,4523],{"class":276,"line":277},[274,4508,281],{"class":280},[274,4510,285],{"class":284},[274,4512,289],{"class":288},[274,4514,3991],{"class":288},[274,4516,376],{"class":280},[274,4518,477],{"class":280},[274,4520,3998],{"class":312},[274,4522,477],{"class":280},[274,4524,292],{"class":280},[274,4526,4527,4529,4532],{"class":276,"line":295},[274,4528,4007],{"class":288},[274,4530,4531],{"class":2393}," Article",[274,4533,379],{"class":280},[274,4535,4536,4539,4541],{"class":276,"line":319},[274,4537,4538],{"class":284}," uid",[274,4540,388],{"class":280},[274,4542,4021],{"class":2393},[274,4544,4545,4547,4549],{"class":276,"line":336},[274,4546,2821],{"class":284},[274,4548,388],{"class":280},[274,4550,4021],{"class":2393},[274,4552,4553,4555,4557],{"class":276,"line":353},[274,4554,905],{"class":284},[274,4556,388],{"class":280},[274,4558,4021],{"class":2393},[274,4560,4561,4564,4566],{"class":276,"line":360},[274,4562,4563],{"class":284}," excerpt",[274,4565,388],{"class":280},[274,4567,4021],{"class":2393},[274,4569,4570,4573,4575],{"class":276,"line":367},[274,4571,4572],{"class":284}," featured_image",[274,4574,4028],{"class":280},[274,4576,379],{"class":280},[274,4578,4579,4581,4583],{"class":276,"line":382},[274,4580,4062],{"class":284},[274,4582,388],{"class":280},[274,4584,4021],{"class":2393},[274,4586,4587,4589,4591],{"class":276,"line":397},[274,4588,4071],{"class":284},[274,4590,388],{"class":280},[274,4592,4021],{"class":2393},[274,4594,4595],{"class":276,"line":410},[274,4596,4080],{"class":280},[274,4598,4599,4602,4604],{"class":276,"line":423},[274,4600,4601],{"class":284}," author",[274,4603,4028],{"class":280},[274,4605,379],{"class":280},[274,4607,4608,4611,4613],{"class":276,"line":429},[274,4609,4610],{"class":284}," name",[274,4612,388],{"class":280},[274,4614,4021],{"class":2393},[274,4616,4617,4620,4622],{"class":276,"line":439},[274,4618,4619],{"class":284}," avatar",[274,4621,4028],{"class":280},[274,4623,379],{"class":280},[274,4625,4626,4629,4631],{"class":276,"line":444},[274,4627,4628],{"class":284}," url",[274,4630,388],{"class":280},[274,4632,4021],{"class":2393},[274,4634,4635],{"class":276,"line":454},[274,4636,2572],{"class":280},[274,4638,4639],{"class":276,"line":460},[274,4640,4080],{"class":280},[274,4642,4643],{"class":276,"line":469},[274,4644,426],{"class":280},[274,4646,4647],{"class":276,"line":485},[274,4648,357],{"emptyLinePlaceholder":356},[274,4650,4651,4653,4655],{"class":276,"line":500},[274,4652,4007],{"class":288},[274,4654,4010],{"class":2393},[274,4656,379],{"class":280},[274,4658,4659,4661,4663],{"class":276,"line":515},[274,4660,2821],{"class":284},[274,4662,388],{"class":280},[274,4664,4021],{"class":2393},[274,4666,4667,4670,4672,4674],{"class":276,"line":530},[274,4668,4669],{"class":284}," articles",[274,4671,388],{"class":280},[274,4673,4531],{"class":2393},[274,4675,4676],{"class":302},"[]\n",[274,4678,4679,4682,4684],{"class":276,"line":545},[274,4680,4681],{"class":284}," show_author",[274,4683,4028],{"class":280},[274,4685,4686],{"class":2393}," boolean\n",[274,4688,4689,4691,4693],{"class":276,"line":560},[274,4690,2865],{"class":284},[274,4692,4028],{"class":280},[274,4694,4021],{"class":2393},[274,4696,4697,4699,4701],{"class":276,"line":575},[274,4698,2880],{"class":284},[274,4700,4028],{"class":280},[274,4702,4102],{"class":2393},[274,4704,4705],{"class":276,"line":581},[274,4706,426],{"class":280},[274,4708,4709],{"class":276,"line":587},[274,4710,357],{"emptyLinePlaceholder":356},[274,4712,4713,4715,4717,4719,4721,4723,4725,4727],{"class":276,"line":603},[274,4714,370],{"class":288},[274,4716,4117],{"class":302},[274,4718,376],{"class":280},[274,4720,4122],{"class":878},[274,4722,281],{"class":280},[274,4724,4127],{"class":2393},[274,4726,623],{"class":280},[274,4728,3087],{"class":302},[274,4730,4731,4733,4735],{"class":276,"line":635},[274,4732,432],{"class":280},[274,4734,285],{"class":284},[274,4736,292],{"class":280},[274,4738,4739],{"class":276,"line":645},[274,4740,357],{"emptyLinePlaceholder":356},[274,4742,4743,4745,4747],{"class":276,"line":650},[274,4744,281],{"class":280},[274,4746,449],{"class":284},[274,4748,292],{"class":280},[274,4750,4751,4753,4755,4757,4759,4761,4764,4766],{"class":276,"line":656},[274,4752,463],{"class":280},[274,4754,2928],{"class":284},[274,4756,611],{"class":288},[274,4758,376],{"class":280},[274,4760,477],{"class":280},[274,4762,4763],{"class":312},"article-list",[274,4765,477],{"class":280},[274,4767,292],{"class":280},[274,4769,4770,4772,4774,4776,4778,4780,4783,4785],{"class":276,"line":670},[274,4771,590],{"class":280},[274,4773,131],{"class":284},[274,4775,611],{"class":288},[274,4777,376],{"class":280},[274,4779,477],{"class":280},[274,4781,4782],{"class":312},"container mx-auto px-6 py-12",[274,4784,477],{"class":280},[274,4786,292],{"class":280},[274,4788,4789,4791,4793,4795,4797,4799,4802,4804,4806,4808,4810,4812],{"class":276,"line":699},[274,4790,606],{"class":280},[274,4792,76],{"class":284},[274,4794,611],{"class":288},[274,4796,376],{"class":280},[274,4798,477],{"class":280},[274,4800,4801],{"class":312},"text-3xl font-bold mb-8",[274,4803,477],{"class":280},[274,4805,623],{"class":280},[274,4807,4212],{"class":302},[274,4809,432],{"class":280},[274,4811,76],{"class":284},[274,4813,292],{"class":280},[274,4815,4816],{"class":276,"line":708},[274,4817,4818],{"class":302}," \n",[274,4820,4821,4823,4825,4827,4829,4831,4834,4836],{"class":276,"line":719},[274,4822,606],{"class":280},[274,4824,131],{"class":284},[274,4826,611],{"class":288},[274,4828,376],{"class":280},[274,4830,477],{"class":280},[274,4832,4833],{"class":312},"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6",[274,4835,477],{"class":280},[274,4837,292],{"class":280},[274,4839,4840,4842,4845],{"class":276,"line":1403},[274,4841,1345],{"class":280},[274,4843,4844],{"class":284},"article",[274,4846,4847],{"class":280}," \n",[274,4849,4850,4853,4855,4857,4860,4862],{"class":276,"line":4383},[274,4851,4852],{"class":288}," v-for",[274,4854,376],{"class":280},[274,4856,477],{"class":280},[274,4858,4859],{"class":312},"article in articles",[274,4861,477],{"class":280},[274,4863,4847],{"class":280},[274,4865,4866,4869,4871,4873,4876],{"class":276,"line":4391},[274,4867,4868],{"class":288}," :key",[274,4870,376],{"class":280},[274,4872,477],{"class":280},[274,4874,4875],{"class":312},"article.uid",[274,4877,316],{"class":280},[274,4879,4880,4882,4884,4886,4889],{"class":276,"line":4396},[274,4881,3422],{"class":288},[274,4883,376],{"class":280},[274,4885,477],{"class":280},[274,4887,4888],{"class":312},"article-card",[274,4890,316],{"class":280},[274,4892,4893],{"class":276,"line":4401},[274,4894,4895],{"class":280}," >\n",[274,4897,4898,4901],{"class":276,"line":4413},[274,4899,4900],{"class":280}," \u003C",[274,4902,4903],{"class":284},"NuxtImg\n",[274,4905,4906,4909,4911,4913,4916],{"class":276,"line":4421},[274,4907,4908],{"class":288}," v-if",[274,4910,376],{"class":280},[274,4912,477],{"class":280},[274,4914,4915],{"class":312},"article.featured_image",[274,4917,316],{"class":280},[274,4919,4920,4923,4925,4927,4930],{"class":276,"line":4426},[274,4921,4922],{"class":288}," :src",[274,4924,376],{"class":280},[274,4926,477],{"class":280},[274,4928,4929],{"class":312},"article.featured_image.url",[274,4931,316],{"class":280},[274,4933,4934,4937,4939,4941,4944],{"class":276,"line":4431},[274,4935,4936],{"class":288}," :alt",[274,4938,376],{"class":280},[274,4940,477],{"class":280},[274,4942,4943],{"class":312},"article.featured_image.title",[274,4945,316],{"class":280},[274,4947,4948,4951,4953,4955,4958],{"class":276,"line":4443},[274,4949,4950],{"class":288}," class",[274,4952,376],{"class":280},[274,4954,477],{"class":280},[274,4956,4957],{"class":312},"article-image",[274,4959,316],{"class":280},[274,4961,4962,4965,4967,4969,4972],{"class":276,"line":4451},[274,4963,4964],{"class":288}," width",[274,4966,376],{"class":280},[274,4968,477],{"class":280},[274,4970,4971],{"class":312},"400",[274,4973,316],{"class":280},[274,4975,4976,4979,4981,4983,4986],{"class":276,"line":4456},[274,4977,4978],{"class":288}," height",[274,4980,376],{"class":280},[274,4982,477],{"class":280},[274,4984,4985],{"class":312},"250",[274,4987,316],{"class":280},[274,4989,4990,4993,4995,4997,5000],{"class":276,"line":4461},[274,4991,4992],{"class":288}," provider",[274,4994,376],{"class":280},[274,4996,477],{"class":280},[274,4998,4999],{"class":312},"contentstack",[274,5001,316],{"class":280},[274,5003,5004],{"class":276,"line":4470},[274,5005,5006],{"class":280}," \u002F>\n",[274,5008,5009],{"class":276,"line":4483},[274,5010,5011],{"class":302}," \n",[274,5013,5014,5016,5018,5020,5022,5024,5027,5029],{"class":276,"line":4488},[274,5015,4900],{"class":280},[274,5017,131],{"class":284},[274,5019,611],{"class":288},[274,5021,376],{"class":280},[274,5023,477],{"class":280},[274,5025,5026],{"class":312},"article-content",[274,5028,477],{"class":280},[274,5030,292],{"class":280},[274,5032,5034,5037,5039,5041,5043,5045,5048,5050],{"class":276,"line":5033},52,[274,5035,5036],{"class":280}," \u003C",[274,5038,85],{"class":284},[274,5040,611],{"class":288},[274,5042,376],{"class":280},[274,5044,477],{"class":280},[274,5046,5047],{"class":312},"article-title",[274,5049,477],{"class":280},[274,5051,292],{"class":280},[274,5053,5055,5058,5060,5062,5064,5066,5069,5071],{"class":276,"line":5054},53,[274,5056,5057],{"class":280}," \u003C",[274,5059,4253],{"class":284},[274,5061,4267],{"class":288},[274,5063,376],{"class":280},[274,5065,477],{"class":280},[274,5067,5068],{"class":312},"`\u002Fblog\u002F${article.url}`",[274,5070,477],{"class":280},[274,5072,292],{"class":280},[274,5074,5076],{"class":276,"line":5075},54,[274,5077,5078],{"class":302}," {{ article.title }}\n",[274,5080,5082,5085,5087],{"class":276,"line":5081},55,[274,5083,5084],{"class":280}," \u003C\u002F",[274,5086,4253],{"class":284},[274,5088,292],{"class":280},[274,5090,5092,5095,5097],{"class":276,"line":5091},56,[274,5093,5094],{"class":280}," \u003C\u002F",[274,5096,85],{"class":284},[274,5098,292],{"class":280},[274,5100,5102],{"class":276,"line":5101},57,[274,5103,5104],{"class":302}," \n",[274,5106,5108,5110,5112,5114,5116,5118,5121,5123,5125,5128,5130,5132],{"class":276,"line":5107},58,[274,5109,5036],{"class":280},[274,5111,81],{"class":284},[274,5113,611],{"class":288},[274,5115,376],{"class":280},[274,5117,477],{"class":280},[274,5119,5120],{"class":312},"article-excerpt",[274,5122,477],{"class":280},[274,5124,623],{"class":280},[274,5126,5127],{"class":302},"{{ article.excerpt }}",[274,5129,432],{"class":280},[274,5131,81],{"class":284},[274,5133,292],{"class":280},[274,5135,5137],{"class":276,"line":5136},59,[274,5138,5104],{"class":302},[274,5140,5142,5144,5146,5148,5150,5152,5155,5157,5159,5161,5163,5166,5168],{"class":276,"line":5141},60,[274,5143,5036],{"class":280},[274,5145,131],{"class":284},[274,5147,4227],{"class":288},[274,5149,376],{"class":280},[274,5151,477],{"class":280},[274,5153,5154],{"class":312},"show_author && article.author",[274,5156,477],{"class":280},[274,5158,611],{"class":288},[274,5160,376],{"class":280},[274,5162,477],{"class":280},[274,5164,5165],{"class":312},"article-author",[274,5167,477],{"class":280},[274,5169,292],{"class":280},[274,5171,5173,5175,5178],{"class":276,"line":5172},61,[274,5174,5057],{"class":280},[274,5176,5177],{"class":284},"img",[274,5179,4847],{"class":280},[274,5181,5183,5186,5188,5190,5193],{"class":276,"line":5182},62,[274,5184,5185],{"class":288}," v-if",[274,5187,376],{"class":280},[274,5189,477],{"class":280},[274,5191,5192],{"class":312},"article.author.avatar",[274,5194,316],{"class":280},[274,5196,5198,5201,5203,5205,5208,5210],{"class":276,"line":5197},63,[274,5199,5200],{"class":288}," :src",[274,5202,376],{"class":280},[274,5204,477],{"class":280},[274,5206,5207],{"class":312},"article.author.avatar.url",[274,5209,477],{"class":280},[274,5211,4847],{"class":280},[274,5213,5215,5218,5220,5222,5225],{"class":276,"line":5214},64,[274,5216,5217],{"class":288}," :alt",[274,5219,376],{"class":280},[274,5221,477],{"class":280},[274,5223,5224],{"class":312},"article.author.name",[274,5226,316],{"class":280},[274,5228,5230,5233,5235,5237,5240],{"class":276,"line":5229},65,[274,5231,5232],{"class":288}," class",[274,5234,376],{"class":280},[274,5236,477],{"class":280},[274,5238,5239],{"class":312},"author-avatar",[274,5241,316],{"class":280},[274,5243,5245],{"class":276,"line":5244},66,[274,5246,5247],{"class":280}," >\n",[274,5249,5251,5253,5255,5257,5260,5262,5264],{"class":276,"line":5250},67,[274,5252,5057],{"class":280},[274,5254,274],{"class":284},[274,5256,623],{"class":280},[274,5258,5259],{"class":302},"{{ article.author.name }}",[274,5261,432],{"class":280},[274,5263,274],{"class":284},[274,5265,292],{"class":280},[274,5267,5269,5271,5273],{"class":276,"line":5268},68,[274,5270,5094],{"class":280},[274,5272,131],{"class":284},[274,5274,292],{"class":280},[274,5276,5278,5281,5283],{"class":276,"line":5277},69,[274,5279,5280],{"class":280}," \u003C\u002F",[274,5282,131],{"class":284},[274,5284,292],{"class":280},[274,5286,5288,5290,5292],{"class":276,"line":5287},70,[274,5289,3580],{"class":280},[274,5291,4844],{"class":284},[274,5293,292],{"class":280},[274,5295,5297,5299,5301],{"class":276,"line":5296},71,[274,5298,1380],{"class":280},[274,5300,131],{"class":284},[274,5302,292],{"class":280},[274,5304,5306,5308,5310],{"class":276,"line":5305},72,[274,5307,638],{"class":280},[274,5309,131],{"class":284},[274,5311,292],{"class":280},[274,5313,5315,5317,5319],{"class":276,"line":5314},73,[274,5316,711],{"class":280},[274,5318,2928],{"class":284},[274,5320,292],{"class":280},[274,5322,5324,5326,5328],{"class":276,"line":5323},74,[274,5325,432],{"class":280},[274,5327,449],{"class":284},[274,5329,292],{"class":280},[274,5331,5333],{"class":276,"line":5332},75,[274,5334,357],{"emptyLinePlaceholder":356},[274,5336,5338,5340,5342,5344],{"class":276,"line":5337},76,[274,5339,281],{"class":280},[274,5341,4336],{"class":284},[274,5343,4339],{"class":288},[274,5345,292],{"class":280},[274,5347,5349,5351,5353],{"class":276,"line":5348},77,[274,5350,916],{"class":280},[274,5352,4888],{"class":2393},[274,5354,379],{"class":280},[274,5356,5358,5361,5363,5366],{"class":276,"line":5357},78,[274,5359,5360],{"class":302}," @apply bg-white rounded-lg shadow-md overflow-hidden hover",[274,5362,388],{"class":280},[274,5364,5365],{"class":302},"shadow-lg transition-shadow",[274,5367,4364],{"class":280},[274,5369,5371],{"class":276,"line":5370},79,[274,5372,426],{"class":280},[274,5374,5376],{"class":276,"line":5375},80,[274,5377,357],{"emptyLinePlaceholder":356},[274,5379,5381,5383,5385],{"class":276,"line":5380},81,[274,5382,916],{"class":280},[274,5384,4957],{"class":2393},[274,5386,379],{"class":280},[274,5388,5390,5393],{"class":276,"line":5389},82,[274,5391,5392],{"class":302}," @apply w-full h-48 object-cover",[274,5394,4364],{"class":280},[274,5396,5398],{"class":276,"line":5397},83,[274,5399,426],{"class":280},[274,5401,5403],{"class":276,"line":5402},84,[274,5404,357],{"emptyLinePlaceholder":356},[274,5406,5408,5410,5412],{"class":276,"line":5407},85,[274,5409,916],{"class":280},[274,5411,5026],{"class":2393},[274,5413,379],{"class":280},[274,5415,5417,5420],{"class":276,"line":5416},86,[274,5418,5419],{"class":302}," @apply p-6",[274,5421,4364],{"class":280},[274,5423,5425],{"class":276,"line":5424},87,[274,5426,426],{"class":280},[274,5428,5430],{"class":276,"line":5429},88,[274,5431,357],{"emptyLinePlaceholder":356},[274,5433,5435,5437,5439,5442],{"class":276,"line":5434},89,[274,5436,916],{"class":280},[274,5438,5047],{"class":2393},[274,5440,5441],{"class":2393}," a",[274,5443,379],{"class":280},[274,5445,5447,5450,5452,5455],{"class":276,"line":5446},90,[274,5448,5449],{"class":302}," @apply text-xl font-semibold text-gray-900 hover",[274,5451,388],{"class":280},[274,5453,5454],{"class":302},"text-blue-600 transition-colors",[274,5456,4364],{"class":280},[274,5458,5460],{"class":276,"line":5459},91,[274,5461,426],{"class":280},[274,5463,5465],{"class":276,"line":5464},92,[274,5466,357],{"emptyLinePlaceholder":356},[274,5468,5470,5472,5474],{"class":276,"line":5469},93,[274,5471,916],{"class":280},[274,5473,5120],{"class":2393},[274,5475,379],{"class":280},[274,5477,5479,5482],{"class":276,"line":5478},94,[274,5480,5481],{"class":302}," @apply text-gray-600 mt-2 mb-4",[274,5483,4364],{"class":280},[274,5485,5487],{"class":276,"line":5486},95,[274,5488,426],{"class":280},[274,5490,5492],{"class":276,"line":5491},96,[274,5493,357],{"emptyLinePlaceholder":356},[274,5495,5497,5499,5501],{"class":276,"line":5496},97,[274,5498,916],{"class":280},[274,5500,5165],{"class":2393},[274,5502,379],{"class":280},[274,5504,5506,5509,5511,5514],{"class":276,"line":5505},98,[274,5507,5508],{"class":302}," @apply ",[274,5510,4358],{"class":4357},[274,5512,5513],{"class":302}," items-center space-x-2 text-sm text-gray-500",[274,5515,4364],{"class":280},[274,5517,5519],{"class":276,"line":5518},99,[274,5520,426],{"class":280},[274,5522,5524],{"class":276,"line":5523},100,[274,5525,357],{"emptyLinePlaceholder":356},[274,5527,5529,5531,5533],{"class":276,"line":5528},101,[274,5530,916],{"class":280},[274,5532,5239],{"class":2393},[274,5534,379],{"class":280},[274,5536,5538,5541],{"class":276,"line":5537},102,[274,5539,5540],{"class":302}," @apply w-6 h-6 rounded-full",[274,5542,4364],{"class":280},[274,5544,5546],{"class":276,"line":5545},103,[274,5547,426],{"class":280},[274,5549,5551,5553,5555],{"class":276,"line":5550},104,[274,5552,432],{"class":280},[274,5554,4336],{"class":284},[274,5556,292],{"class":280},[76,5558,5560],{"id":5559},"best-practices","Best Practices",[85,5562,5564],{"id":5563},"component-organization","Component Organization",[264,5566,5569],{"className":5567,"code":5568,"language":3888},[3886],"components\u002F\nβ”œβ”€β”€ blocks\u002F\nβ”‚ β”œβ”€β”€ Hero.vue\nβ”‚ β”œβ”€β”€ Grid.vue\nβ”‚ β”œβ”€β”€ TextBlock.vue\nβ”‚ β”œβ”€β”€ ImageGallery.vue\nβ”‚ └── ArticleList.vue\n└── ui\u002F\n β”œβ”€β”€ Button.vue\n └── Card.vue\n",[208,5570,5568],{"__ignoreMap":270},[85,5572,5574],{"id":5573},"component-mapping","Component Mapping",[81,5576,5577,5578,5581],{},"Nuxt 4 automatically imports exports from ",[208,5579,5580],{},"\u002Futils"," files, making component mapping simple:",[264,5583,5586],{"className":2803,"code":5584,"filename":5585,"language":2805,"meta":270,"style":270},"import Hero from '~\u002Fcomponents\u002Fblocks\u002FHero.vue'\nimport Grid from '~\u002Fcomponents\u002Fblocks\u002FGrid.vue'\nimport TextBlock from '~\u002Fcomponents\u002Fblocks\u002FTextBlock.vue'\nimport ImageGallery from '~\u002Fcomponents\u002Fblocks\u002FImageGallery.vue'\nimport ArticleList from '~\u002Fcomponents\u002Fblocks\u002FArticleList.vue'\n\nexport const componentMap = {\n hero: Hero,\n grid: Grid,\n text_block: TextBlock,\n image_gallery: ImageGallery,\n article_list: ArticleList,\n}\n","utils\u002Findex.ts",[208,5587,5588,5604,5618,5632,5648,5664,5668,5683,5693,5703,5713,5723,5735],{"__ignoreMap":270},[274,5589,5590,5592,5594,5596,5599,5601],{"class":276,"line":277},[274,5591,299],{"class":298},[274,5593,303],{"class":302},[274,5595,306],{"class":298},[274,5597,5598],{"class":280}," '",[274,5600,313],{"class":312},[274,5602,5603],{"class":280},"'\n",[274,5605,5606,5608,5610,5612,5614,5616],{"class":276,"line":295},[274,5607,299],{"class":298},[274,5609,324],{"class":302},[274,5611,306],{"class":298},[274,5613,5598],{"class":280},[274,5615,331],{"class":312},[274,5617,5603],{"class":280},[274,5619,5620,5622,5624,5626,5628,5630],{"class":276,"line":319},[274,5621,299],{"class":298},[274,5623,341],{"class":302},[274,5625,306],{"class":298},[274,5627,5598],{"class":280},[274,5629,348],{"class":312},[274,5631,5603],{"class":280},[274,5633,5634,5636,5639,5641,5643,5646],{"class":276,"line":336},[274,5635,299],{"class":298},[274,5637,5638],{"class":302}," ImageGallery ",[274,5640,306],{"class":298},[274,5642,5598],{"class":280},[274,5644,5645],{"class":312},"~\u002Fcomponents\u002Fblocks\u002FImageGallery.vue",[274,5647,5603],{"class":280},[274,5649,5650,5652,5655,5657,5659,5662],{"class":276,"line":353},[274,5651,299],{"class":298},[274,5653,5654],{"class":302}," ArticleList ",[274,5656,306],{"class":298},[274,5658,5598],{"class":280},[274,5660,5661],{"class":312},"~\u002Fcomponents\u002Fblocks\u002FArticleList.vue",[274,5663,5603],{"class":280},[274,5665,5666],{"class":276,"line":360},[274,5667,357],{"emptyLinePlaceholder":356},[274,5669,5670,5673,5676,5679,5681],{"class":276,"line":367},[274,5671,5672],{"class":298},"export",[274,5674,5675],{"class":288}," const",[274,5677,5678],{"class":302}," componentMap ",[274,5680,376],{"class":280},[274,5682,379],{"class":280},[274,5684,5685,5687,5689,5691],{"class":276,"line":382},[274,5686,385],{"class":284},[274,5688,388],{"class":280},[274,5690,391],{"class":302},[274,5692,394],{"class":280},[274,5694,5695,5697,5699,5701],{"class":276,"line":397},[274,5696,400],{"class":284},[274,5698,388],{"class":280},[274,5700,405],{"class":302},[274,5702,394],{"class":280},[274,5704,5705,5707,5709,5711],{"class":276,"line":410},[274,5706,413],{"class":284},[274,5708,388],{"class":280},[274,5710,418],{"class":302},[274,5712,394],{"class":280},[274,5714,5715,5717,5719,5721],{"class":276,"line":423},[274,5716,1113],{"class":284},[274,5718,388],{"class":280},[274,5720,1118],{"class":302},[274,5722,394],{"class":280},[274,5724,5725,5728,5730,5733],{"class":276,"line":429},[274,5726,5727],{"class":284}," article_list",[274,5729,388],{"class":280},[274,5731,5732],{"class":302}," ArticleList",[274,5734,394],{"class":280},[274,5736,5737],{"class":276,"line":439},[274,5738,426],{"class":280},[264,5740,5742],{"className":266,"code":5741,"filename":268,"language":269,"meta":270,"style":270},"\u003Cscript setup>\n\u002F\u002F componentMap is auto-imported from utils\u002Findex.ts\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003CContentstackModularBlocks\n content-type-uid=\"page\"\n :url=\"$route.path\"\n :component-map=\"componentMap\"\n \u002F>\n\u003C\u002Ftemplate>\n",[208,5743,5744,5754,5759,5767,5771,5779,5785,5797,5809,5821,5825],{"__ignoreMap":270},[274,5745,5746,5748,5750,5752],{"class":276,"line":277},[274,5747,281],{"class":280},[274,5749,285],{"class":284},[274,5751,289],{"class":288},[274,5753,292],{"class":280},[274,5755,5756],{"class":276,"line":295},[274,5757,5758],{"class":363},"\u002F\u002F componentMap is auto-imported from utils\u002Findex.ts\n",[274,5760,5761,5763,5765],{"class":276,"line":319},[274,5762,432],{"class":280},[274,5764,285],{"class":284},[274,5766,292],{"class":280},[274,5768,5769],{"class":276,"line":336},[274,5770,357],{"emptyLinePlaceholder":356},[274,5772,5773,5775,5777],{"class":276,"line":353},[274,5774,281],{"class":280},[274,5776,449],{"class":284},[274,5778,292],{"class":280},[274,5780,5781,5783],{"class":276,"line":360},[274,5782,463],{"class":280},[274,5784,466],{"class":284},[274,5786,5787,5789,5791,5793,5795],{"class":276,"line":367},[274,5788,472],{"class":288},[274,5790,376],{"class":280},[274,5792,477],{"class":280},[274,5794,480],{"class":312},[274,5796,316],{"class":280},[274,5798,5799,5801,5803,5805,5807],{"class":276,"line":382},[274,5800,488],{"class":288},[274,5802,376],{"class":280},[274,5804,477],{"class":280},[274,5806,495],{"class":312},[274,5808,316],{"class":280},[274,5810,5811,5813,5815,5817,5819],{"class":276,"line":397},[274,5812,563],{"class":288},[274,5814,376],{"class":280},[274,5816,477],{"class":280},[274,5818,1470],{"class":312},[274,5820,316],{"class":280},[274,5822,5823],{"class":276,"line":410},[274,5824,990],{"class":280},[274,5826,5827,5829,5831],{"class":276,"line":423},[274,5828,432],{"class":280},[274,5830,449],{"class":284},[274,5832,292],{"class":280},[146,5834,5835,5838,5839,5841,5842,5844],{"icon":169},[102,5836,5837],{},"Auto-imports",": Nuxt 4 automatically imports exports from ",[208,5840,5580],{}," files. Simply export your ",[208,5843,1470],{}," and use it directly - no imports needed!",[256,5846,5848],{"id":5847},"alternative-using-a-composable","Alternative: Using a Composable",[81,5850,5851],{},"If you prefer a composable pattern:",[264,5853,5856],{"className":2803,"code":5854,"filename":5855,"language":2805,"meta":270,"style":270},"import Hero from '~\u002Fcomponents\u002Fblocks\u002FHero.vue'\nimport Grid from '~\u002Fcomponents\u002Fblocks\u002FGrid.vue'\nimport TextBlock from '~\u002Fcomponents\u002Fblocks\u002FTextBlock.vue'\nimport ImageGallery from '~\u002Fcomponents\u002Fblocks\u002FImageGallery.vue'\nimport ArticleList from '~\u002Fcomponents\u002Fblocks\u002FArticleList.vue'\n\nexport const useComponentMapping = () => {\n return {\n hero: Hero,\n grid: Grid,\n text_block: TextBlock,\n image_gallery: ImageGallery,\n article_list: ArticleList,\n }\n}\n","composables\u002FuseComponentMapping.ts",[208,5857,5858,5872,5886,5900,5914,5928,5932,5949,5956,5967,5978,5989,6000,6011,6015],{"__ignoreMap":270},[274,5859,5860,5862,5864,5866,5868,5870],{"class":276,"line":277},[274,5861,299],{"class":298},[274,5863,303],{"class":302},[274,5865,306],{"class":298},[274,5867,5598],{"class":280},[274,5869,313],{"class":312},[274,5871,5603],{"class":280},[274,5873,5874,5876,5878,5880,5882,5884],{"class":276,"line":295},[274,5875,299],{"class":298},[274,5877,324],{"class":302},[274,5879,306],{"class":298},[274,5881,5598],{"class":280},[274,5883,331],{"class":312},[274,5885,5603],{"class":280},[274,5887,5888,5890,5892,5894,5896,5898],{"class":276,"line":319},[274,5889,299],{"class":298},[274,5891,341],{"class":302},[274,5893,306],{"class":298},[274,5895,5598],{"class":280},[274,5897,348],{"class":312},[274,5899,5603],{"class":280},[274,5901,5902,5904,5906,5908,5910,5912],{"class":276,"line":336},[274,5903,299],{"class":298},[274,5905,5638],{"class":302},[274,5907,306],{"class":298},[274,5909,5598],{"class":280},[274,5911,5645],{"class":312},[274,5913,5603],{"class":280},[274,5915,5916,5918,5920,5922,5924,5926],{"class":276,"line":353},[274,5917,299],{"class":298},[274,5919,5654],{"class":302},[274,5921,306],{"class":298},[274,5923,5598],{"class":280},[274,5925,5661],{"class":312},[274,5927,5603],{"class":280},[274,5929,5930],{"class":276,"line":360},[274,5931,357],{"emptyLinePlaceholder":356},[274,5933,5934,5936,5938,5941,5943,5945,5947],{"class":276,"line":367},[274,5935,5672],{"class":298},[274,5937,5675],{"class":288},[274,5939,5940],{"class":302}," useComponentMapping ",[274,5942,376],{"class":280},[274,5944,3108],{"class":280},[274,5946,3111],{"class":288},[274,5948,379],{"class":280},[274,5950,5951,5954],{"class":276,"line":382},[274,5952,5953],{"class":298}," return",[274,5955,379],{"class":280},[274,5957,5958,5961,5963,5965],{"class":276,"line":397},[274,5959,5960],{"class":284}," hero",[274,5962,388],{"class":280},[274,5964,391],{"class":302},[274,5966,394],{"class":280},[274,5968,5969,5972,5974,5976],{"class":276,"line":410},[274,5970,5971],{"class":284}," grid",[274,5973,388],{"class":280},[274,5975,405],{"class":302},[274,5977,394],{"class":280},[274,5979,5980,5983,5985,5987],{"class":276,"line":423},[274,5981,5982],{"class":284}," text_block",[274,5984,388],{"class":280},[274,5986,418],{"class":302},[274,5988,394],{"class":280},[274,5990,5991,5994,5996,5998],{"class":276,"line":429},[274,5992,5993],{"class":284}," image_gallery",[274,5995,388],{"class":280},[274,5997,1118],{"class":302},[274,5999,394],{"class":280},[274,6001,6002,6005,6007,6009],{"class":276,"line":439},[274,6003,6004],{"class":284}," article_list",[274,6006,388],{"class":280},[274,6008,5732],{"class":302},[274,6010,394],{"class":280},[274,6012,6013],{"class":276,"line":444},[274,6014,4080],{"class":280},[274,6016,6017],{"class":276,"line":454},[274,6018,426],{"class":280},[264,6020,6022],{"className":266,"code":6021,"filename":268,"language":269,"meta":270,"style":270},"\u003Cscript setup>\nconst componentMapping = useComponentMapping()\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003CContentstackModularBlocks\n content-type-uid=\"page\"\n :url=\"$route.path\"\n :component-map=\"componentMapping\"\n \u002F>\n\u003C\u002Ftemplate>\n",[208,6023,6024,6034,6047,6055,6059,6067,6073,6085,6097,6109,6113],{"__ignoreMap":270},[274,6025,6026,6028,6030,6032],{"class":276,"line":277},[274,6027,281],{"class":280},[274,6029,285],{"class":284},[274,6031,289],{"class":288},[274,6033,292],{"class":280},[274,6035,6036,6038,6040,6042,6045],{"class":276,"line":295},[274,6037,370],{"class":288},[274,6039,373],{"class":302},[274,6041,376],{"class":280},[274,6043,6044],{"class":878}," useComponentMapping",[274,6046,3087],{"class":302},[274,6048,6049,6051,6053],{"class":276,"line":319},[274,6050,432],{"class":280},[274,6052,285],{"class":284},[274,6054,292],{"class":280},[274,6056,6057],{"class":276,"line":336},[274,6058,357],{"emptyLinePlaceholder":356},[274,6060,6061,6063,6065],{"class":276,"line":353},[274,6062,281],{"class":280},[274,6064,449],{"class":284},[274,6066,292],{"class":280},[274,6068,6069,6071],{"class":276,"line":360},[274,6070,463],{"class":280},[274,6072,466],{"class":284},[274,6074,6075,6077,6079,6081,6083],{"class":276,"line":367},[274,6076,472],{"class":288},[274,6078,376],{"class":280},[274,6080,477],{"class":280},[274,6082,480],{"class":312},[274,6084,316],{"class":280},[274,6086,6087,6089,6091,6093,6095],{"class":276,"line":382},[274,6088,488],{"class":288},[274,6090,376],{"class":280},[274,6092,477],{"class":280},[274,6094,495],{"class":312},[274,6096,316],{"class":280},[274,6098,6099,6101,6103,6105,6107],{"class":276,"line":397},[274,6100,563],{"class":288},[274,6102,376],{"class":280},[274,6104,477],{"class":280},[274,6106,570],{"class":312},[274,6108,316],{"class":280},[274,6110,6111],{"class":276,"line":410},[274,6112,990],{"class":280},[274,6114,6115,6117,6119],{"class":276,"line":423},[274,6116,432],{"class":280},[274,6118,449],{"class":284},[274,6120,292],{"class":280},[85,6122,6124],{"id":6123},"typescript-integration","TypeScript Integration",[264,6126,6129],{"className":2803,"code":6127,"filename":6128,"language":2805,"meta":270,"style":270},"\u002F\u002F Define interfaces for your block types\nexport interface HeroBlock {\n title: string\n subtitle?: string\n cta_text?: string\n cta_link?: string\n background_image?: ContentstackAsset\n}\n\nexport interface GridBlock {\n columns: number\n items: GridItem[]\n}\n\nexport interface GridItem {\n title: string\n description: string\n image?: ContentstackAsset\n}\n\n\u002F\u002F Union type for all blocks\nexport type ContentBlock = HeroBlock | GridBlock | TextBlock\n","types\u002Fblocks.ts",[208,6130,6131,6136,6148,6156,6164,6172,6180,6189,6193,6197,6208,6218,6230,6234,6238,6248,6256,6265,6274,6278,6282,6287],{"__ignoreMap":270},[274,6132,6133],{"class":276,"line":277},[274,6134,6135],{"class":363},"\u002F\u002F Define interfaces for your block types\n",[274,6137,6138,6140,6143,6146],{"class":276,"line":295},[274,6139,5672],{"class":298},[274,6141,6142],{"class":288}," interface",[274,6144,6145],{"class":2393}," HeroBlock",[274,6147,379],{"class":280},[274,6149,6150,6152,6154],{"class":276,"line":319},[274,6151,2821],{"class":284},[274,6153,388],{"class":280},[274,6155,4021],{"class":2393},[274,6157,6158,6160,6162],{"class":276,"line":336},[274,6159,2836],{"class":284},[274,6161,4028],{"class":280},[274,6163,4021],{"class":2393},[274,6165,6166,6168,6170],{"class":276,"line":353},[274,6167,4035],{"class":284},[274,6169,4028],{"class":280},[274,6171,4021],{"class":2393},[274,6173,6174,6176,6178],{"class":276,"line":360},[274,6175,4044],{"class":284},[274,6177,4028],{"class":280},[274,6179,4021],{"class":2393},[274,6181,6182,6184,6186],{"class":276,"line":367},[274,6183,4053],{"class":284},[274,6185,4028],{"class":280},[274,6187,6188],{"class":2393}," ContentstackAsset\n",[274,6190,6191],{"class":276,"line":382},[274,6192,426],{"class":280},[274,6194,6195],{"class":276,"line":397},[274,6196,357],{"emptyLinePlaceholder":356},[274,6198,6199,6201,6203,6206],{"class":276,"line":410},[274,6200,5672],{"class":298},[274,6202,6142],{"class":288},[274,6204,6205],{"class":2393}," GridBlock",[274,6207,379],{"class":280},[274,6209,6210,6213,6215],{"class":276,"line":423},[274,6211,6212],{"class":284}," columns",[274,6214,388],{"class":280},[274,6216,6217],{"class":2393}," number\n",[274,6219,6220,6223,6225,6228],{"class":276,"line":429},[274,6221,6222],{"class":284}," items",[274,6224,388],{"class":280},[274,6226,6227],{"class":2393}," GridItem",[274,6229,4676],{"class":302},[274,6231,6232],{"class":276,"line":439},[274,6233,426],{"class":280},[274,6235,6236],{"class":276,"line":444},[274,6237,357],{"emptyLinePlaceholder":356},[274,6239,6240,6242,6244,6246],{"class":276,"line":454},[274,6241,5672],{"class":298},[274,6243,6142],{"class":288},[274,6245,6227],{"class":2393},[274,6247,379],{"class":280},[274,6249,6250,6252,6254],{"class":276,"line":460},[274,6251,2821],{"class":284},[274,6253,388],{"class":280},[274,6255,4021],{"class":2393},[274,6257,6258,6261,6263],{"class":276,"line":469},[274,6259,6260],{"class":284}," description",[274,6262,388],{"class":280},[274,6264,4021],{"class":2393},[274,6266,6267,6270,6272],{"class":276,"line":485},[274,6268,6269],{"class":284}," image",[274,6271,4028],{"class":280},[274,6273,6188],{"class":2393},[274,6275,6276],{"class":276,"line":500},[274,6277,426],{"class":280},[274,6279,6280],{"class":276,"line":515},[274,6281,357],{"emptyLinePlaceholder":356},[274,6283,6284],{"class":276,"line":530},[274,6285,6286],{"class":363},"\u002F\u002F Union type for all blocks\n",[274,6288,6289,6291,6294,6297,6299,6301,6304,6306,6308],{"class":276,"line":545},[274,6290,5672],{"class":298},[274,6292,6293],{"class":288}," type",[274,6295,6296],{"class":2393}," ContentBlock",[274,6298,872],{"class":280},[274,6300,6145],{"class":2393},[274,6302,6303],{"class":280}," |",[274,6305,6205],{"class":2393},[274,6307,6303],{"class":280},[274,6309,6310],{"class":2393}," TextBlock\n",[76,6312,6314],{"id":6313},"next-steps","Next Steps",[131,6316,6322],{"className":6317},[2492,6318,6319,6320,6321],"grid-cols-1","md:grid-cols-2","gap-4","mt-6",[6323,6324,6325],"card",{"icon":69,"title":66,"to":67},"Enable real-time editing for your modular blocks with Live Preview integration.",[131,6327,6330,6333],{"className":6328},[2492,6318,6319,6320,6329],"mt-4",[6323,6331,6332],{"icon":49,"title":46,"to":47},"Optimize images in your block components with @nuxt\u002Fimage integration.",[6323,6334,6335],{"icon":39,"title":36,"to":37},"Learn about the composables that power the auto-fetch functionality.",[4336,6337,6338],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}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 .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 .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 .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 .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}",{"title":270,"searchDepth":295,"depth":295,"links":6340},[6341,6355,6360,6364,6369],{"id":78,"depth":295,"text":79,"children":6342},[6343,6344,6345,6346,6347,6348,6349,6350,6351,6352,6353,6354],{"id":87,"depth":319,"text":88},{"id":173,"depth":319,"text":61},{"id":250,"depth":319,"text":251},{"id":1001,"depth":319,"text":1002},{"id":1412,"depth":319,"text":1413},{"id":1906,"depth":319,"text":1907},{"id":2347,"depth":319,"text":2348},{"id":2796,"depth":319,"text":2797},{"id":2910,"depth":319,"text":2911},{"id":3030,"depth":319,"text":3031},{"id":3255,"depth":319,"text":3256},{"id":3730,"depth":319,"text":3731},{"id":3787,"depth":295,"text":1500,"children":6356},[6357,6358,6359],{"id":3838,"depth":319,"text":61},{"id":3881,"depth":319,"text":3882},{"id":3893,"depth":319,"text":3894},{"id":3966,"depth":295,"text":3967,"children":6361},[6362,6363],{"id":3973,"depth":319,"text":3974},{"id":4497,"depth":319,"text":4498},{"id":5559,"depth":295,"text":5560,"children":6365},[6366,6367,6368],{"id":5563,"depth":319,"text":5564},{"id":5573,"depth":319,"text":5574},{"id":6123,"depth":319,"text":6124},{"id":6313,"depth":295,"text":6314},"Learn about the Vue components provided by Nuxt Contentstack, including the powerful ContentstackModularBlocks component for dynamic content rendering.","md",null,{},{"icon":44},{"title":41,"description":6370},"tajNna-2rh-W4M9cAXS6KBAgcNJrdoT0Ii6-pWD0fjc",[6378,6380],{"title":36,"path":37,"stem":38,"description":6379,"icon":39,"children":-1},"Learn how to use Nuxt Contentstack composables to fetch entries, assets, and content with type safety, caching, and live preview support.",{"title":46,"path":47,"stem":48,"description":6381,"icon":49,"children":-1},"Optimize images with Contentstack's Image Delivery API and @nuxt\u002Fimage integration for responsive, fast-loading images with advanced transformations.",1775639653934]