[{"data":1,"prerenderedAt":1368},["ShallowReactive",2],{"navigation":3,"\u002Fnuxt-module\u002Fbuilding-your-ui\u002Fcwa-cli":362,"\u002Fnuxt-module\u002Fbuilding-your-ui\u002Fcwa-cli-surround":1363},[4,14,36,69,144,345],{"title":5,"path":6,"stem":7,"children":8},"Introduction","\u002Fgetting-started","1.getting-started\u002F1.index",[9,10],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation",{"title":15,"path":16,"stem":17,"children":18,"page":35},"Guides","\u002Fguides","2.guides",[19,23,27,31],{"title":20,"path":21,"stem":22},"Your First Layout","\u002Fguides\u002Fyour-first-layout","2.guides\u002F1.your-first-layout",{"title":24,"path":25,"stem":26},"Your First Page Template","\u002Fguides\u002Fyour-first-page-template","2.guides\u002F2.your-first-page-template",{"title":28,"path":29,"stem":30},"Your First Component","\u002Fguides\u002Fyour-first-component","2.guides\u002F3.your-first-component",{"title":32,"path":33,"stem":34},"Alternative UI Variants","\u002Fguides\u002Falternative-ui-variants","2.guides\u002F4.alternative-ui-variants",false,{"title":37,"path":38,"stem":39,"children":40,"page":35},"Core Concepts","\u002Fcore-concepts","3.core-concepts",[41,45,49,53,57,61,65],{"title":42,"path":43,"stem":44},"How It All Works","\u002Fcore-concepts\u002Farchitecture","3.core-concepts\u002F1.architecture",{"title":46,"path":47,"stem":48},"The Data Model","\u002Fcore-concepts\u002Fthe-data-model","3.core-concepts\u002F2.the-data-model",{"title":50,"path":51,"stem":52},"Layouts & Pages","\u002Fcore-concepts\u002Flayouts-and-pages","3.core-concepts\u002F3.layouts-and-pages",{"title":54,"path":55,"stem":56},"Dynamic Pages","\u002Fcore-concepts\u002Fdynamic-pages","3.core-concepts\u002F4.dynamic-pages",{"title":58,"path":59,"stem":60},"Components","\u002Fcore-concepts\u002Fcomponents","3.core-concepts\u002F5.components",{"title":62,"path":63,"stem":64},"Draft & Publish Workflow","\u002Fcore-concepts\u002Fdraft-and-publish","3.core-concepts\u002F6.draft-and-publish",{"title":66,"path":67,"stem":68},"The Admin Panel","\u002Fcore-concepts\u002Fadmin-panel","3.core-concepts\u002F7.admin-panel",{"title":70,"path":71,"stem":72,"children":73,"page":35},"Api","\u002Fapi","4.api",[74,78,120,124,128,132,136,140],{"title":75,"path":76,"stem":77},"Bundle Setup","\u002Fapi\u002Fbundle-setup","4.api\u002F1.bundle-setup",{"title":58,"path":79,"stem":80,"children":81,"page":35},"\u002Fapi\u002Fcomponents","4.api\u002F2.components",[82,86,107],{"title":83,"path":84,"stem":85},"Creating Components","\u002Fapi\u002Fcomponents\u002Fcreating-components","4.api\u002F2.components\u002F1.creating-components",{"title":87,"path":88,"stem":89,"children":90,"page":35},"Annotations","\u002Fapi\u002Fcomponents\u002Fannotations","4.api\u002F2.components\u002F2.annotations",[91,95,99,103],{"title":92,"path":93,"stem":94},"Publishable","\u002Fapi\u002Fcomponents\u002Fannotations\u002Fpublishable","4.api\u002F2.components\u002F2.annotations\u002F1.publishable",{"title":96,"path":97,"stem":98},"Uploadable","\u002Fapi\u002Fcomponents\u002Fannotations\u002Fuploadable","4.api\u002F2.components\u002F2.annotations\u002F2.uploadable",{"title":100,"path":101,"stem":102},"Timestamped","\u002Fapi\u002Fcomponents\u002Fannotations\u002Ftimestamped","4.api\u002F2.components\u002F2.annotations\u002F3.timestamped",{"title":104,"path":105,"stem":106},"Explicit Allow Only","\u002Fapi\u002Fcomponents\u002Fannotations\u002Fexplicit-allow-only","4.api\u002F2.components\u002F2.annotations\u002F4.explicit-allow-only",{"title":108,"path":109,"stem":110,"children":111,"page":35},"Built Ins","\u002Fapi\u002Fcomponents\u002Fbuilt-ins","4.api\u002F2.components\u002F3.built-ins",[112,116],{"title":113,"path":114,"stem":115},"Collection Component","\u002Fapi\u002Fcomponents\u002Fbuilt-ins\u002Fcollection-component","4.api\u002F2.components\u002F3.built-ins\u002F1.collection-component",{"title":117,"path":118,"stem":119},"Form Component","\u002Fapi\u002Fcomponents\u002Fbuilt-ins\u002Fform-component","4.api\u002F2.components\u002F3.built-ins\u002F2.form-component",{"title":121,"path":122,"stem":123},"Dynamic & Nested Pages","\u002Fapi\u002Fdynamic-pages","4.api\u002F3.dynamic-pages",{"title":125,"path":126,"stem":127},"Users & Security","\u002Fapi\u002Fusers-and-security","4.api\u002F4.users-and-security",{"title":129,"path":130,"stem":131},"Data Fixtures","\u002Fapi\u002Fdata-fixtures","4.api\u002F5.data-fixtures",{"title":133,"path":134,"stem":135},"Configuration Reference","\u002Fapi\u002Fconfiguration","4.api\u002F6.configuration",{"title":137,"path":138,"stem":139},"Console Commands","\u002Fapi\u002Fconsole-commands","4.api\u002F7.console-commands",{"title":141,"path":142,"stem":143},"Debugging & Profiler","\u002Fapi\u002Fdebugging","4.api\u002F8.debugging",{"title":145,"path":146,"stem":147,"children":148,"page":35},"Nuxt Module","\u002Fnuxt-module","5.nuxt-module",[149,153,166,186,207,211,295,320,324],{"title":150,"path":151,"stem":152},"Module Setup","\u002Fnuxt-module\u002Fmodule-setup","5.nuxt-module\u002F1.module-setup",{"title":154,"path":155,"stem":156,"children":157,"page":35},"Configuration","\u002Fnuxt-module\u002Fconfiguration","5.nuxt-module\u002F2.configuration",[158,162],{"title":159,"path":160,"stem":161},"Nuxt Config","\u002Fnuxt-module\u002Fconfiguration\u002Fnuxt-config","5.nuxt-module\u002F2.configuration\u002F1.nuxt-config",{"title":163,"path":164,"stem":165},"Site Config & SEO","\u002Fnuxt-module\u002Fconfiguration\u002Fsite-config-and-seo","5.nuxt-module\u002F2.configuration\u002F2.site-config-and-seo",{"title":167,"path":168,"stem":169,"children":170,"page":35},"Building Your Ui","\u002Fnuxt-module\u002Fbuilding-your-ui","5.nuxt-module\u002F3.building-your-ui",[171,175,179,182],{"title":172,"path":173,"stem":174},"Layouts","\u002Fnuxt-module\u002Fbuilding-your-ui\u002Fcreating-layouts","5.nuxt-module\u002F3.building-your-ui\u002F1.creating-layouts",{"title":176,"path":177,"stem":178},"Page Templates","\u002Fnuxt-module\u002Fbuilding-your-ui\u002Fcreating-page-templates","5.nuxt-module\u002F3.building-your-ui\u002F2.creating-page-templates",{"title":83,"path":180,"stem":181},"\u002Fnuxt-module\u002Fbuilding-your-ui\u002Fcreating-components","5.nuxt-module\u002F3.building-your-ui\u002F3.creating-components",{"title":183,"path":184,"stem":185},"CLI Generator","\u002Fnuxt-module\u002Fbuilding-your-ui\u002Fcwa-cli","5.nuxt-module\u002F3.building-your-ui\u002F4.cwa-cli",{"title":187,"path":188,"stem":189,"children":190,"page":35},"Cwa Components","\u002Fnuxt-module\u002Fcwa-components","5.nuxt-module\u002F4.cwa-components",[191,195,199,203],{"title":192,"path":193,"stem":194},"\u003CCwaComponentGroup \u002F>","\u002Fnuxt-module\u002Fcwa-components\u002Fcwa-component-group","5.nuxt-module\u002F4.cwa-components\u002F1.cwa-component-group",{"title":196,"path":197,"stem":198},"\u003CCwaPage \u002F>","\u002Fnuxt-module\u002Fcwa-components\u002Fcwa-page","5.nuxt-module\u002F4.cwa-components\u002F2.cwa-page",{"title":200,"path":201,"stem":202},"\u003CCwaLink \u002F>","\u002Fnuxt-module\u002Fcwa-components\u002Fcwa-link","5.nuxt-module\u002F4.cwa-components\u002F3.cwa-link",{"title":204,"path":205,"stem":206},"\u003CCwaDefaultLayout \u002F>","\u002Fnuxt-module\u002Fcwa-components\u002Fcwa-default-layout","5.nuxt-module\u002F4.cwa-components\u002F5.cwa-default-layout",{"title":208,"path":209,"stem":210},"The useCwa() API","\u002Fnuxt-module\u002Fcwa-api","5.nuxt-module\u002F5.cwa-api",{"title":212,"path":213,"stem":214,"children":215,"page":35},"Composables","\u002Fnuxt-module\u002Fcomposables","5.nuxt-module\u002F6.composables",[216,224,261,278],{"title":217,"path":218,"stem":219,"children":220,"page":35},"Layout","\u002Fnuxt-module\u002Fcomposables\u002Flayout","5.nuxt-module\u002F6.composables\u002F0.layout",[221],{"title":217,"path":222,"stem":223},"\u002Fnuxt-module\u002Fcomposables\u002Flayout\u002Fuse-cwa-layout","5.nuxt-module\u002F6.composables\u002F0.layout\u002F1.use-cwa-layout",{"title":225,"path":226,"stem":227,"children":228,"page":35},"Component","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent","5.nuxt-module\u002F6.composables\u002F1.component",[229,233,237,241,245,249,253,257],{"title":230,"path":231,"stem":232},"Component (recommended)","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-component","5.nuxt-module\u002F6.composables\u002F1.component\u002F0.use-cwa-component",{"title":234,"path":235,"stem":236},"Resource","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-resource","5.nuxt-module\u002F6.composables\u002F1.component\u002F1.use-cwa-resource",{"title":238,"path":239,"stem":240},"Collection Resource","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-collection-resource","5.nuxt-module\u002F6.composables\u002F1.component\u002F2.use-cwa-collection-resource",{"title":242,"path":243,"stem":244},"File Field","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-file-field","5.nuxt-module\u002F6.composables\u002F1.component\u002F3.use-cwa-file-field",{"title":246,"path":247,"stem":248},"Form","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-form","5.nuxt-module\u002F6.composables\u002F1.component\u002F4.use-cwa-form",{"title":250,"path":251,"stem":252},"Form Input","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-form-input","5.nuxt-module\u002F6.composables\u002F1.component\u002F5.use-cwa-form-input",{"title":254,"path":255,"stem":256},"Form Repeated","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-form-repeated","5.nuxt-module\u002F6.composables\u002F1.component\u002F6.use-cwa-form-repeated",{"title":258,"path":259,"stem":260},"Form Collection","\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-form-collection","5.nuxt-module\u002F6.composables\u002F1.component\u002F7.use-cwa-form-collection",{"title":262,"path":263,"stem":264,"children":265,"page":35},"Admin Manager","\u002Fnuxt-module\u002Fcomposables\u002Fadmin-manager","5.nuxt-module\u002F6.composables\u002F2.admin-manager",[266,270,274],{"title":267,"path":268,"stem":269},"Manager Tab","\u002Fnuxt-module\u002Fcomposables\u002Fadmin-manager\u002Fuse-cwa-resource-manager-tab","5.nuxt-module\u002F6.composables\u002F2.admin-manager\u002F1.use-cwa-resource-manager-tab",{"title":271,"path":272,"stem":273},"Resource Model","\u002Fnuxt-module\u002Fcomposables\u002Fadmin-manager\u002Fuse-cwa-resource-model","5.nuxt-module\u002F6.composables\u002F2.admin-manager\u002F2.use-cwa-resource-model",{"title":275,"path":276,"stem":277},"Resource Upload","\u002Fnuxt-module\u002Fcomposables\u002Fadmin-manager\u002Fuse-cwa-resource-upload","5.nuxt-module\u002F6.composables\u002F2.admin-manager\u002F3.use-cwa-resource-upload",{"title":279,"path":280,"stem":281,"children":282,"page":35},"Utilities","\u002Fnuxt-module\u002Fcomposables\u002Futilities","5.nuxt-module\u002F6.composables\u002F3.utilities",[283,287,291],{"title":284,"path":285,"stem":286},"Resource Endpoint","\u002Fnuxt-module\u002Fcomposables\u002Futilities\u002Fuse-cwa-resource-endpoint","5.nuxt-module\u002F6.composables\u002F3.utilities\u002F1.use-cwa-resource-endpoint",{"title":288,"path":289,"stem":290},"Query Model","\u002Fnuxt-module\u002Fcomposables\u002Futilities\u002Fuse-query-bound-model","5.nuxt-module\u002F6.composables\u002F3.utilities\u002F2.use-query-bound-model",{"title":292,"path":293,"stem":294},"Resource Route","\u002Fnuxt-module\u002Fcomposables\u002Futilities\u002Fuse-cwa-resource-route","5.nuxt-module\u002F6.composables\u002F3.utilities\u002F3.use-cwa-resource-route",{"title":296,"path":297,"stem":298,"children":299,"page":35},"Component Helpers","\u002Fnuxt-module\u002Fcomponent-helpers","5.nuxt-module\u002F7.component-helpers",[300,304,308,312,316],{"title":301,"path":302,"stem":303},"Images & Media","\u002Fnuxt-module\u002Fcomponent-helpers\u002Fimages-and-uploads","5.nuxt-module\u002F7.component-helpers\u002F1.images-and-uploads",{"title":305,"path":306,"stem":307},"Collections & Pagination","\u002Fnuxt-module\u002Fcomponent-helpers\u002Fcollections-and-pagination","5.nuxt-module\u002F7.component-helpers\u002F2.collections-and-pagination",{"title":309,"path":310,"stem":311},"HTML Content","\u002Fnuxt-module\u002Fcomponent-helpers\u002Fhtml-content","5.nuxt-module\u002F7.component-helpers\u002F3.html-content",{"title":313,"path":314,"stem":315},"Real-Time Updates","\u002Fnuxt-module\u002Fcomponent-helpers\u002Freal-time-updates","5.nuxt-module\u002F7.component-helpers\u002F4.real-time-updates",{"title":317,"path":318,"stem":319},"Forms","\u002Fnuxt-module\u002Fcomponent-helpers\u002Fforms","5.nuxt-module\u002F7.component-helpers\u002F5.forms",{"title":321,"path":322,"stem":323},"Authentication","\u002Fnuxt-module\u002Fauthentication","5.nuxt-module\u002F8.authentication",{"title":325,"path":326,"stem":327,"children":328,"page":35},"Cwa Layer","\u002Fnuxt-module\u002Fcwa-layer","5.nuxt-module\u002F9.cwa-layer",[329,333,337,341],{"title":330,"path":331,"stem":332},"Overview","\u002Fnuxt-module\u002Fcwa-layer\u002Foverview","5.nuxt-module\u002F9.cwa-layer\u002F1.overview",{"title":334,"path":335,"stem":336},"Auth Pages","\u002Fnuxt-module\u002Fcwa-layer\u002Fauth-pages","5.nuxt-module\u002F9.cwa-layer\u002F2.auth-pages",{"title":338,"path":339,"stem":340},"Admin Panel","\u002Fnuxt-module\u002Fcwa-layer\u002Fadmin-panel","5.nuxt-module\u002F9.cwa-layer\u002F3.admin-panel",{"title":342,"path":343,"stem":344},"Styling","\u002Fnuxt-module\u002Fcwa-layer\u002Fstyling","5.nuxt-module\u002F9.cwa-layer\u002F4.styling",{"title":346,"path":347,"stem":348,"children":349,"page":35},"Deployment","\u002Fdeployment","6.deployment",[350,354,358],{"title":351,"path":352,"stem":353},"Docker","\u002Fdeployment\u002Fdocker","6.deployment\u002F1.docker",{"title":355,"path":356,"stem":357},"Kubernetes & Helm","\u002Fdeployment\u002Fkubernetes","6.deployment\u002F2.kubernetes",{"title":359,"path":360,"stem":361},"CI\u002FCD","\u002Fdeployment\u002Fci-cd","6.deployment\u002F3.ci-cd",{"id":363,"title":364,"badge":365,"body":368,"description":1356,"extension":1357,"links":1358,"meta":1359,"navigation":1360,"path":184,"seo":1361,"stem":185,"__hash__":1362},"docs\u002F5.nuxt-module\u002F3.building-your-ui\u002F4.cwa-cli.md","cwa make:component",{"label":366,"color":367},"Draft","amber",{"type":369,"value":370,"toc":1345},"minimark",[371,378,403,410,422,427,432,435,443,449,453,456,526,530,537,608,612,623,1126,1130,1133,1139,1165,1174,1286,1290,1312,1316,1341],[372,373,374,377],"p",{},[375,376,364],"code",{}," is an interactive CLI that scaffolds a CWA component. It creates the Vue display file and prints the PHP command to generate the matching API entity.",[379,380,385],"pre",{"className":381,"code":382,"language":383,"meta":384,"style":384},"language-bash shiki shiki-themes github-light github-dark material-theme-palenight","npx cwa make:component\n","bash","",[375,386,387],{"__ignoreMap":384},[388,389,392,396,400],"span",{"class":390,"line":391},"line",1,[388,393,395],{"class":394},"sRCss","npx",[388,397,399],{"class":398},"sLL54"," cwa",[388,401,402],{"class":398}," make:component\n",[372,404,405,406,409],{},"If ",[375,407,408],{},"@cwa\u002Fnuxt"," is listed as a dependency in your project, you can also run:",[379,411,413],{"className":381,"code":412,"language":383,"meta":384,"style":384},"cwa make:component\n",[375,414,415],{"__ignoreMap":384},[388,416,417,420],{"class":390,"line":391},[388,418,419],{"class":394},"cwa",[388,421,402],{"class":398},[423,424,426],"h2",{"id":425},"prompts","Prompts",[428,429,431],"h3",{"id":430},"component-name","Component name",[372,433,434],{},"A PascalCase identifier. This becomes the file name and directory name.",[379,436,441],{"className":437,"code":439,"language":440},[438],"language-text","Component name (PascalCase, e.g. BlogPost): HeroBlock\n","text",[375,442,439],{"__ignoreMap":384},[372,444,445,446],{},"Output path: ",[375,447,448],{},"app\u002Fcwa\u002Fcomponents\u002FHeroBlock\u002FHeroBlock.vue",[428,450,452],{"id":451},"component-type","Component type",[372,454,455],{},"Selects which built-in plugin to wire up:",[457,458,459,475],"table",{},[460,461,462],"thead",{},[463,464,465,469,472],"tr",{},[466,467,468],"th",{},"Choice",[466,470,471],{},"Plugin",[466,473,474],{},"Use when",[476,477,478,492,511],"tbody",{},[463,479,480,486,489],{},[481,482,483],"td",{},[375,484,485],{},"Basic",[481,487,488],{},"none",[481,490,491],{},"Plain data display",[463,493,494,499,504],{},[481,495,496],{},[375,497,498],{},"File",[481,500,501],{},[375,502,503],{},"withFile()",[481,505,506,507,510],{},"Entity has ",[375,508,509],{},"#[Uploadable]"," (any uploadable file, incl. images)",[463,512,513,518,523],{},[481,514,515],{},[375,516,517],{},"Collection",[481,519,520],{},[375,521,522],{},"withCollection()",[481,524,525],{},"Entity extends or wraps a collection",[428,527,529],{"id":528},"api-behaviours","API behaviours",[372,531,532,533,536],{},"Three yes\u002Fno prompts that control flags passed to ",[375,534,535],{},"make:api-component",":",[457,538,539,552],{},[460,540,541],{},[463,542,543,546,549],{},[466,544,545],{},"Prompt",[466,547,548],{},"Flag",[466,550,551],{},"What it adds",[476,553,554,575,589],{},[463,555,556,561,565],{},[481,557,558],{},[375,559,560],{},"--timestamped",[481,562,563],{},[375,564,560],{},[481,566,567,570,571,574],{},[375,568,569],{},"createdAt"," \u002F ",[375,572,573],{},"updatedAt"," columns",[463,576,577,582,586],{},[481,578,579],{},[375,580,581],{},"--publishable",[481,583,584],{},[375,585,581],{},[481,587,588],{},"Draft \u002F publish lifecycle",[463,590,591,596,600],{},[481,592,593],{},[375,594,595],{},"--uploadable",[481,597,598],{},[375,599,595],{},[481,601,602,603,607],{},"File upload field (defaults to ",[604,605,606],"strong",{},"yes"," for the File type)",[423,609,611],{"id":610},"what-gets-generated","What gets generated",[372,613,614,615,618,619,622],{},"The Vue file is written to ",[375,616,617],{},"app\u002Fcwa\u002Fcomponents\u002F\u003CName>\u002F\u003CName>.vue",". The script block is pre-wired to ",[375,620,621],{},"useCwaComponent"," based on the chosen type:",[624,625,626,810,952],"code-group",{},[379,627,631],{"className":628,"code":629,"filename":485,"language":630,"meta":384,"style":384},"language-vue shiki shiki-themes github-light github-dark material-theme-palenight","\u003Ctemplate>\n  \u003C!-- TODO: add your template -->\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nimport type { IriProp } from '#cwa\u002Fcomposables\u002Fcwa-resource'\n\nconst props = defineProps\u003CIriProp>()\nconst { resource, exposeMeta } = useCwaComponent(props)\ndefineExpose(exposeMeta)\n\u003C\u002Fscript>\n","vue",[375,632,633,646,653,663,670,699,731,736,766,792,801],{"__ignoreMap":384},[388,634,635,639,643],{"class":390,"line":391},[388,636,638],{"class":637},"sOvfz","\u003C",[388,640,642],{"class":641},"s-h7I","template",[388,644,645],{"class":637},">\n",[388,647,649],{"class":390,"line":648},2,[388,650,652],{"class":651},"sTBSN","  \u003C!-- TODO: add your template -->\n",[388,654,656,659,661],{"class":390,"line":655},3,[388,657,658],{"class":637},"\u003C\u002F",[388,660,642],{"class":641},[388,662,645],{"class":637},[388,664,666],{"class":390,"line":665},4,[388,667,669],{"emptyLinePlaceholder":668},true,"\n",[388,671,673,675,678,682,685,688,692,695,697],{"class":390,"line":672},5,[388,674,638],{"class":637},[388,676,677],{"class":641},"script",[388,679,681],{"class":680},"sGtlX"," setup",[388,683,684],{"class":680}," lang",[388,686,687],{"class":637},"=",[388,689,691],{"class":690},"seSrl","\"",[388,693,694],{"class":398},"ts",[388,696,691],{"class":690},[388,698,645],{"class":637},[388,700,702,706,709,712,716,719,722,725,728],{"class":390,"line":701},6,[388,703,705],{"class":704},"sm4w6","import",[388,707,708],{"class":704}," type",[388,710,711],{"class":637}," {",[388,713,715],{"class":714},"sPB8G"," IriProp",[388,717,718],{"class":637}," }",[388,720,721],{"class":704}," from",[388,723,724],{"class":690}," '",[388,726,727],{"class":398},"#cwa\u002Fcomposables\u002Fcwa-resource",[388,729,730],{"class":690},"'\n",[388,732,734],{"class":390,"line":733},7,[388,735,669],{"emptyLinePlaceholder":668},[388,737,739,743,747,751,755,757,760,763],{"class":390,"line":738},8,[388,740,742],{"class":741},"swB56","const",[388,744,746],{"class":745},"sc2zw"," props",[388,748,750],{"class":749},"sVlFx"," =",[388,752,754],{"class":753},"sKpYG"," defineProps",[388,756,638],{"class":637},[388,758,759],{"class":394},"IriProp",[388,761,762],{"class":637},">",[388,764,765],{"class":714},"()\n",[388,767,769,771,773,776,779,782,784,786,789],{"class":390,"line":768},9,[388,770,742],{"class":741},[388,772,711],{"class":637},[388,774,775],{"class":745}," resource",[388,777,778],{"class":637},",",[388,780,781],{"class":745}," exposeMeta",[388,783,718],{"class":637},[388,785,750],{"class":749},[388,787,788],{"class":753}," useCwaComponent",[388,790,791],{"class":714},"(props)\n",[388,793,795,798],{"class":390,"line":794},10,[388,796,797],{"class":753},"defineExpose",[388,799,800],{"class":714},"(exposeMeta)\n",[388,802,804,806,808],{"class":390,"line":803},11,[388,805,658],{"class":637},[388,807,677],{"class":641},[388,809,645],{"class":637},[379,811,813],{"className":628,"code":812,"filename":498,"language":630,"meta":384,"style":384},"\u003Ctemplate>\n  \u003C!-- TODO: add your template -->\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nimport type { IriProp } from '#cwa\u002Fcomposables\u002Fcwa-resource'\n\nconst props = defineProps\u003CIriProp>()\nconst { resource, exposeMeta, files } = useCwaComponent(props, [withFile()])\ndefineExpose(exposeMeta)\n\u003C\u002Fscript>\n",[375,814,815,823,827,835,839,859,879,883,901,938,944],{"__ignoreMap":384},[388,816,817,819,821],{"class":390,"line":391},[388,818,638],{"class":637},[388,820,642],{"class":641},[388,822,645],{"class":637},[388,824,825],{"class":390,"line":648},[388,826,652],{"class":651},[388,828,829,831,833],{"class":390,"line":655},[388,830,658],{"class":637},[388,832,642],{"class":641},[388,834,645],{"class":637},[388,836,837],{"class":390,"line":665},[388,838,669],{"emptyLinePlaceholder":668},[388,840,841,843,845,847,849,851,853,855,857],{"class":390,"line":672},[388,842,638],{"class":637},[388,844,677],{"class":641},[388,846,681],{"class":680},[388,848,684],{"class":680},[388,850,687],{"class":637},[388,852,691],{"class":690},[388,854,694],{"class":398},[388,856,691],{"class":690},[388,858,645],{"class":637},[388,860,861,863,865,867,869,871,873,875,877],{"class":390,"line":701},[388,862,705],{"class":704},[388,864,708],{"class":704},[388,866,711],{"class":637},[388,868,715],{"class":714},[388,870,718],{"class":637},[388,872,721],{"class":704},[388,874,724],{"class":690},[388,876,727],{"class":398},[388,878,730],{"class":690},[388,880,881],{"class":390,"line":733},[388,882,669],{"emptyLinePlaceholder":668},[388,884,885,887,889,891,893,895,897,899],{"class":390,"line":738},[388,886,742],{"class":741},[388,888,746],{"class":745},[388,890,750],{"class":749},[388,892,754],{"class":753},[388,894,638],{"class":637},[388,896,759],{"class":394},[388,898,762],{"class":637},[388,900,765],{"class":714},[388,902,903,905,907,909,911,913,915,918,920,922,924,927,929,932,935],{"class":390,"line":768},[388,904,742],{"class":741},[388,906,711],{"class":637},[388,908,775],{"class":745},[388,910,778],{"class":637},[388,912,781],{"class":745},[388,914,778],{"class":637},[388,916,917],{"class":745}," files",[388,919,718],{"class":637},[388,921,750],{"class":749},[388,923,788],{"class":753},[388,925,926],{"class":714},"(props",[388,928,778],{"class":637},[388,930,931],{"class":714}," [",[388,933,934],{"class":753},"withFile",[388,936,937],{"class":714},"()])\n",[388,939,940,942],{"class":390,"line":794},[388,941,797],{"class":753},[388,943,800],{"class":714},[388,945,946,948,950],{"class":390,"line":803},[388,947,658],{"class":637},[388,949,677],{"class":641},[388,951,645],{"class":637},[379,953,955],{"className":628,"code":954,"filename":517,"language":630,"meta":384,"style":384},"\u003Ctemplate>\n  \u003C!-- TODO: add your template -->\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nimport type { IriProp } from '#cwa\u002Fcomposables\u002Fcwa-resource'\n\nconst props = defineProps\u003CIriProp>()\nconst { resource, exposeMeta, collectionItems, pageModel, totalPages, goToNextPage, goToPreviousPage, changePage, resolveResourceLink } =\n  useCwaComponent(props, [withCollection()])\ndefineExpose(exposeMeta)\n\u003C\u002Fscript>\n",[375,956,957,965,969,977,981,1001,1021,1025,1043,1095,1111,1117],{"__ignoreMap":384},[388,958,959,961,963],{"class":390,"line":391},[388,960,638],{"class":637},[388,962,642],{"class":641},[388,964,645],{"class":637},[388,966,967],{"class":390,"line":648},[388,968,652],{"class":651},[388,970,971,973,975],{"class":390,"line":655},[388,972,658],{"class":637},[388,974,642],{"class":641},[388,976,645],{"class":637},[388,978,979],{"class":390,"line":665},[388,980,669],{"emptyLinePlaceholder":668},[388,982,983,985,987,989,991,993,995,997,999],{"class":390,"line":672},[388,984,638],{"class":637},[388,986,677],{"class":641},[388,988,681],{"class":680},[388,990,684],{"class":680},[388,992,687],{"class":637},[388,994,691],{"class":690},[388,996,694],{"class":398},[388,998,691],{"class":690},[388,1000,645],{"class":637},[388,1002,1003,1005,1007,1009,1011,1013,1015,1017,1019],{"class":390,"line":701},[388,1004,705],{"class":704},[388,1006,708],{"class":704},[388,1008,711],{"class":637},[388,1010,715],{"class":714},[388,1012,718],{"class":637},[388,1014,721],{"class":704},[388,1016,724],{"class":690},[388,1018,727],{"class":398},[388,1020,730],{"class":690},[388,1022,1023],{"class":390,"line":733},[388,1024,669],{"emptyLinePlaceholder":668},[388,1026,1027,1029,1031,1033,1035,1037,1039,1041],{"class":390,"line":738},[388,1028,742],{"class":741},[388,1030,746],{"class":745},[388,1032,750],{"class":749},[388,1034,754],{"class":753},[388,1036,638],{"class":637},[388,1038,759],{"class":394},[388,1040,762],{"class":637},[388,1042,765],{"class":714},[388,1044,1045,1047,1049,1051,1053,1055,1057,1060,1062,1065,1067,1070,1072,1075,1077,1080,1082,1085,1087,1090,1092],{"class":390,"line":768},[388,1046,742],{"class":741},[388,1048,711],{"class":637},[388,1050,775],{"class":745},[388,1052,778],{"class":637},[388,1054,781],{"class":745},[388,1056,778],{"class":637},[388,1058,1059],{"class":745}," collectionItems",[388,1061,778],{"class":637},[388,1063,1064],{"class":745}," pageModel",[388,1066,778],{"class":637},[388,1068,1069],{"class":745}," totalPages",[388,1071,778],{"class":637},[388,1073,1074],{"class":745}," goToNextPage",[388,1076,778],{"class":637},[388,1078,1079],{"class":745}," goToPreviousPage",[388,1081,778],{"class":637},[388,1083,1084],{"class":745}," changePage",[388,1086,778],{"class":637},[388,1088,1089],{"class":745}," resolveResourceLink",[388,1091,718],{"class":637},[388,1093,1094],{"class":749}," =\n",[388,1096,1097,1100,1102,1104,1106,1109],{"class":390,"line":794},[388,1098,1099],{"class":753},"  useCwaComponent",[388,1101,926],{"class":714},[388,1103,778],{"class":637},[388,1105,931],{"class":714},[388,1107,1108],{"class":753},"withCollection",[388,1110,937],{"class":714},[388,1112,1113,1115],{"class":390,"line":803},[388,1114,797],{"class":753},[388,1116,800],{"class":714},[388,1118,1120,1122,1124],{"class":390,"line":1119},12,[388,1121,658],{"class":637},[388,1123,677],{"class":641},[388,1125,645],{"class":637},[423,1127,1129],{"id":1128},"next-steps-printed-after-generation","Next steps printed after generation",[372,1131,1132],{},"After writing the file, the CLI prints two reminders:",[372,1134,1135,1138],{},[604,1136,1137],{},"1. Create the API entity"," — run in your API project:",[379,1140,1142],{"className":381,"code":1141,"language":383,"meta":384,"style":384},"php bin\u002Fconsole make:api-component HeroBlock --timestamped --publishable\n",[375,1143,1144],{"__ignoreMap":384},[388,1145,1146,1149,1152,1155,1158,1162],{"class":390,"line":391},[388,1147,1148],{"class":394},"php",[388,1150,1151],{"class":398}," bin\u002Fconsole",[388,1153,1154],{"class":398}," make:api-component",[388,1156,1157],{"class":398}," HeroBlock",[388,1159,1161],{"class":1160},"szhYu"," --timestamped",[388,1163,1164],{"class":1160}," --publishable\n",[372,1166,1167,1170,1171,536],{},[604,1168,1169],{},"2. Register in nuxt.config.ts"," — add the component type under ",[375,1172,1173],{},"cwa.resources",[379,1175,1178],{"className":1176,"code":1177,"language":694,"meta":384,"style":384},"language-ts shiki shiki-themes github-light github-dark material-theme-palenight","\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n  cwa: {\n    resources: {\n      HeroBlock: {\n        name: 'Hero Block',\n        description: 'Full-width hero with headline and CTA'\n      }\n    }\n  }\n})\n",[375,1179,1180,1185,1202,1213,1222,1231,1249,1263,1268,1273,1278],{"__ignoreMap":384},[388,1181,1182],{"class":390,"line":391},[388,1183,1184],{"class":651},"\u002F\u002F nuxt.config.ts\n",[388,1186,1187,1190,1193,1196,1199],{"class":390,"line":648},[388,1188,1189],{"class":704},"export",[388,1191,1192],{"class":704}," default",[388,1194,1195],{"class":753}," defineNuxtConfig",[388,1197,1198],{"class":714},"(",[388,1200,1201],{"class":637},"{\n",[388,1203,1204,1208,1210],{"class":390,"line":655},[388,1205,1207],{"class":1206},"sDHlG","  cwa",[388,1209,536],{"class":637},[388,1211,1212],{"class":637}," {\n",[388,1214,1215,1218,1220],{"class":390,"line":665},[388,1216,1217],{"class":1206},"    resources",[388,1219,536],{"class":637},[388,1221,1212],{"class":637},[388,1223,1224,1227,1229],{"class":390,"line":672},[388,1225,1226],{"class":1206},"      HeroBlock",[388,1228,536],{"class":637},[388,1230,1212],{"class":637},[388,1232,1233,1236,1238,1240,1243,1246],{"class":390,"line":701},[388,1234,1235],{"class":1206},"        name",[388,1237,536],{"class":637},[388,1239,724],{"class":690},[388,1241,1242],{"class":398},"Hero Block",[388,1244,1245],{"class":690},"'",[388,1247,1248],{"class":637},",\n",[388,1250,1251,1254,1256,1258,1261],{"class":390,"line":733},[388,1252,1253],{"class":1206},"        description",[388,1255,536],{"class":637},[388,1257,724],{"class":690},[388,1259,1260],{"class":398},"Full-width hero with headline and CTA",[388,1262,730],{"class":690},[388,1264,1265],{"class":390,"line":738},[388,1266,1267],{"class":637},"      }\n",[388,1269,1270],{"class":390,"line":768},[388,1271,1272],{"class":637},"    }\n",[388,1274,1275],{"class":390,"line":794},[388,1276,1277],{"class":637},"  }\n",[388,1279,1280,1283],{"class":390,"line":803},[388,1281,1282],{"class":637},"}",[388,1284,1285],{"class":714},")\n",[423,1287,1289],{"id":1288},"what-the-cli-does-not-generate","What the CLI does not generate",[1291,1292,1293,1305],"ul",{},[1294,1295,1296,1297,1300,1301,1304],"li",{},"The admin editing tab (",[375,1298,1299],{},"admin\u002F\u003CName>.vue",") — write this manually following the ",[1302,1303,28],"a",{"href":29}," guide",[1294,1306,1307,1308,1311],{},"The ",[375,1309,1310],{},"nuxt.config"," entry — printed as a reminder but not written automatically",[423,1313,1315],{"id":1314},"related","Related",[1291,1317,1318,1323,1328,1335],{},[1294,1319,1320,1322],{},[1302,1321,28],{"href":29}," — full walkthrough including the admin tab",[1294,1324,1325,1327],{},[1302,1326,621],{"href":231}," — composable reference",[1294,1329,1330,1332,1333,1304],{},[1302,1331,301],{"href":302}," — ",[375,1334,503],{},[1294,1336,1337,1332,1339,1304],{},[1302,1338,305],{"href":306},[375,1340,522],{},[1342,1343,1344],"style",{},"html pre.shiki code .sRCss, html code.shiki .sRCss{--shiki-light:#6F42C1;--shiki-default:#B392F0;--shiki-dark:#FFCB6B}html pre.shiki code .sLL54, html code.shiki .sLL54{--shiki-light:#032F62;--shiki-default:#9ECBFF;--shiki-dark:#C3E88D}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 .sOvfz, html code.shiki .sOvfz{--shiki-light:#24292E;--shiki-default:#E1E4E8;--shiki-dark:#89DDFF}html pre.shiki code .s-h7I, html code.shiki .s-h7I{--shiki-light:#22863A;--shiki-default:#85E89D;--shiki-dark:#F07178}html pre.shiki code .sTBSN, html code.shiki .sTBSN{--shiki-light:#6A737D;--shiki-light-font-style:inherit;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sGtlX, html code.shiki .sGtlX{--shiki-light:#6F42C1;--shiki-default:#B392F0;--shiki-dark:#C792EA}html pre.shiki code .seSrl, html code.shiki .seSrl{--shiki-light:#032F62;--shiki-default:#9ECBFF;--shiki-dark:#89DDFF}html pre.shiki code .sm4w6, html code.shiki .sm4w6{--shiki-light:#D73A49;--shiki-light-font-style:inherit;--shiki-default:#F97583;--shiki-default-font-style:inherit;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sPB8G, html code.shiki .sPB8G{--shiki-light:#24292E;--shiki-default:#E1E4E8;--shiki-dark:#BABED8}html pre.shiki code .swB56, html code.shiki .swB56{--shiki-light:#D73A49;--shiki-default:#F97583;--shiki-dark:#C792EA}html pre.shiki code .sc2zw, html code.shiki .sc2zw{--shiki-light:#005CC5;--shiki-default:#79B8FF;--shiki-dark:#BABED8}html pre.shiki code .sVlFx, html code.shiki .sVlFx{--shiki-light:#D73A49;--shiki-default:#F97583;--shiki-dark:#89DDFF}html pre.shiki code .sKpYG, html code.shiki .sKpYG{--shiki-light:#6F42C1;--shiki-default:#B392F0;--shiki-dark:#82AAFF}html pre.shiki code .szhYu, html code.shiki .szhYu{--shiki-light:#005CC5;--shiki-default:#79B8FF;--shiki-dark:#C3E88D}html pre.shiki code .sDHlG, html code.shiki .sDHlG{--shiki-light:#24292E;--shiki-default:#E1E4E8;--shiki-dark:#F07178}",{"title":384,"searchDepth":648,"depth":648,"links":1346},[1347,1352,1353,1354,1355],{"id":425,"depth":648,"text":426,"children":1348},[1349,1350,1351],{"id":430,"depth":655,"text":431},{"id":451,"depth":655,"text":452},{"id":528,"depth":655,"text":529},{"id":610,"depth":648,"text":611},{"id":1128,"depth":648,"text":1129},{"id":1288,"depth":648,"text":1289},{"id":1314,"depth":648,"text":1315},"Scaffold a new CWA display component from the command line — generates the Vue file with the correct useCwaComponent boilerplate and prints the matching API command.","md",null,{},{"title":183},{"title":364,"description":1356},"cf973Ux1kYZHzifTPHRduXf_DfGr_PK2xjaU4J10JMA",[1364,1366],{"title":83,"path":180,"stem":181,"description":1365,"children":-1},"The complete guide to building a CWA component — display template, admin manager tabs, and UI class name variants.",{"title":192,"path":193,"stem":194,"description":1367,"children":-1},"Render an ordered list of CMS-managed components within a named region of your layout, page, or component.",1783701658583]