[{"data":1,"prerenderedAt":2625},["ShallowReactive",2],{"navigation":3,"\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-component":362,"\u002Fnuxt-module\u002Fcomposables\u002Fcomponent\u002Fuse-cwa-component-surround":2620},[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":2613,"extension":2614,"links":2615,"meta":2616,"navigation":2617,"path":231,"seo":2618,"stem":232,"__hash__":2619},"docs\u002F5.nuxt-module\u002F6.composables\u002F1.component\u002F0.use-cwa-component.md","useCwaComponent",{"label":366,"color":367},"Draft","amber",{"type":369,"value":370,"toc":2598},"minimark",[371,380,462,467,628,645,653,664,668,711,849,861,865,1078,1084,1103,1106,1109,1115,1122,1129,1284,1291,1297,1340,1439,1446,1513,1555,1582,1587,1607,1712,1716,1725,1793,1795,1799,2026,2041,2045,2056,2164,2183,2187,2193,2261,2326,2328,2332,2339,2594],[372,373,374,375,379],"p",{},"The recommended composable for all CWA display components. Wraps ",[376,377,378],"code",{},"useCwaResource"," and adds a typed plugin system so collection, image, and custom behaviours can be composed together without nesting.",[381,382,387],"pre",{"className":383,"code":384,"language":385,"meta":386,"style":386},"language-ts shiki shiki-themes github-light github-dark material-theme-palenight","const props = defineProps\u003CIriProp>()\nconst { resource, exposeMeta } = useCwaComponent(props)\ndefineExpose(exposeMeta)\n","ts","",[376,388,389,425,453],{"__ignoreMap":386},[390,391,394,398,402,406,410,414,418,421],"span",{"class":392,"line":393},"line",1,[390,395,397],{"class":396},"swB56","const",[390,399,401],{"class":400},"sc2zw"," props",[390,403,405],{"class":404},"sVlFx"," =",[390,407,409],{"class":408},"sKpYG"," defineProps",[390,411,413],{"class":412},"sOvfz","\u003C",[390,415,417],{"class":416},"sRCss","IriProp",[390,419,420],{"class":412},">",[390,422,424],{"class":423},"sPB8G","()\n",[390,426,428,430,433,436,439,442,445,447,450],{"class":392,"line":427},2,[390,429,397],{"class":396},[390,431,432],{"class":412}," {",[390,434,435],{"class":400}," resource",[390,437,438],{"class":412},",",[390,440,441],{"class":400}," exposeMeta",[390,443,444],{"class":412}," }",[390,446,405],{"class":404},[390,448,449],{"class":408}," useCwaComponent",[390,451,452],{"class":423},"(props)\n",[390,454,456,459],{"class":392,"line":455},3,[390,457,458],{"class":408},"defineExpose",[390,460,461],{"class":423},"(exposeMeta)\n",[463,464,466],"h2",{"id":465},"signature","Signature",[381,468,470],{"className":383,"code":469,"language":385,"meta":386,"style":386},"useCwaComponent(\n  props: IriProp,\n  plugins?: CwaResourcePlugin[],\n  ops?: {\n    name?: string\n    styles?: {\n      multiple?: boolean\n      \u002F\u002F each style's value is a class string (string[] accepted but deprecated)\n      classes: Record\u003Cstring, string | string[]>\n    }\n    manager?: {\n      disabled?: boolean\n    }\n    autoClass?: boolean   \u002F\u002F default true — auto-applies uiClassNames to the root element\n  }\n)\n",[376,471,472,479,487,500,511,523,533,544,551,571,577,587,597,602,616,622],{"__ignoreMap":386},[390,473,474,476],{"class":392,"line":393},[390,475,364],{"class":408},[390,477,478],{"class":423},"(\n",[390,480,481,484],{"class":392,"line":427},[390,482,483],{"class":423},"  props: IriProp",[390,485,486],{"class":412},",\n",[390,488,489,492,495,498],{"class":392,"line":455},[390,490,491],{"class":423},"  plugins",[390,493,494],{"class":404},"?:",[390,496,497],{"class":423}," CwaResourcePlugin[]",[390,499,486],{"class":412},[390,501,503,506,508],{"class":392,"line":502},4,[390,504,505],{"class":423},"  ops",[390,507,494],{"class":404},[390,509,510],{"class":412}," {\n",[390,512,514,517,520],{"class":392,"line":513},5,[390,515,516],{"class":423},"    name?",[390,518,519],{"class":412},":",[390,521,522],{"class":423}," string\n",[390,524,526,529,531],{"class":392,"line":525},6,[390,527,528],{"class":423},"    styles",[390,530,494],{"class":404},[390,532,510],{"class":412},[390,534,536,539,541],{"class":392,"line":535},7,[390,537,538],{"class":423},"      multiple?",[390,540,519],{"class":412},[390,542,543],{"class":423}," boolean\n",[390,545,547],{"class":392,"line":546},8,[390,548,550],{"class":549},"sTBSN","      \u002F\u002F each style's value is a class string (string[] accepted but deprecated)\n",[390,552,554,557,559,562,564,567],{"class":392,"line":553},9,[390,555,556],{"class":423},"      classes: Record",[390,558,413],{"class":404},[390,560,561],{"class":423},"string",[390,563,438],{"class":412},[390,565,566],{"class":423}," string | string",[390,568,570],{"class":569},"sDHlG","[]>\n",[390,572,574],{"class":392,"line":573},10,[390,575,576],{"class":569},"    }\n",[390,578,580,583,585],{"class":392,"line":579},11,[390,581,582],{"class":569},"    manager?",[390,584,519],{"class":412},[390,586,510],{"class":412},[390,588,590,593,595],{"class":392,"line":589},12,[390,591,592],{"class":423},"      disabled?",[390,594,519],{"class":412},[390,596,543],{"class":423},[390,598,600],{"class":392,"line":599},13,[390,601,576],{"class":412},[390,603,605,608,610,613],{"class":392,"line":604},14,[390,606,607],{"class":423},"    autoClass",[390,609,494],{"class":404},[390,611,612],{"class":423}," boolean   ",[390,614,615],{"class":549},"\u002F\u002F default true — auto-applies uiClassNames to the root element\n",[390,617,619],{"class":392,"line":618},15,[390,620,621],{"class":412},"  }\n",[390,623,625],{"class":392,"line":624},16,[390,626,627],{"class":423},")\n",[372,629,630,636,637,640,641,644],{},[631,632,633],"strong",{},[376,634,635],{},"props"," — pass the raw ",[376,638,639],{},"defineProps\u003CIriProp>()"," result directly (no ",[376,642,643],{},"toRef"," needed).",[372,646,647,652],{},[631,648,649],{},[376,650,651],{},"plugins"," — optional array of plugin factory results (see below).",[372,654,655,660,661,663],{},[631,656,657],{},[376,658,659],{},"ops"," — same options as ",[376,662,378],{},": style variants, UI variant name, manager opt-out.",[463,665,667],{"id":666},"return-values","Return values",[381,669,671],{"className":383,"code":670,"language":385,"meta":386,"style":386},"const { resource, exposeMeta, $cwa, getCurrentStyleName, ...pluginReturns } = useCwaComponent(props)\n",[376,672,673],{"__ignoreMap":386},[390,674,675,677,679,681,683,685,687,690,692,695,697,700,703,705,707,709],{"class":392,"line":393},[390,676,397],{"class":396},[390,678,432],{"class":412},[390,680,435],{"class":400},[390,682,438],{"class":412},[390,684,441],{"class":400},[390,686,438],{"class":412},[390,688,689],{"class":400}," $cwa",[390,691,438],{"class":412},[390,693,694],{"class":400}," getCurrentStyleName",[390,696,438],{"class":412},[390,698,699],{"class":404}," ...",[390,701,702],{"class":400},"pluginReturns",[390,704,444],{"class":412},[390,706,405],{"class":404},[390,708,449],{"class":408},[390,710,452],{"class":423},[712,713,714,730],"table",{},[715,716,717],"thead",{},[718,719,720,724,727],"tr",{},[721,722,723],"th",{},"Return",[721,725,726],{},"Type",[721,728,729],{},"Purpose",[731,732,733,752,767,780,795,810,836],"tbody",{},[718,734,735,741,746],{},[736,737,738],"td",{},[376,739,740],{},"resource",[736,742,743],{},[376,744,745],{},"ComputedRef\u003CResource | null | undefined>",[736,747,748,749],{},"Reactive resource ref — access data on ",[376,750,751],{},".value?.data",[718,753,754,759,762],{},[736,755,756],{},[376,757,758],{},"exposeMeta",[736,760,761],{},"object",[736,763,764,765],{},"Pass directly to ",[376,766,458],{},[718,768,769,774,777],{},[736,770,771],{},[376,772,773],{},"$cwa",[736,775,776],{},"CwaComposable",[736,778,779],{},"Auth, resources, UI state",[718,781,782,787,792],{},[736,783,784],{},[376,785,786],{},"getCurrentStyleName",[736,788,789],{},[376,790,791],{},"(data) => string | undefined",[736,793,794],{},"Read the currently selected style name",[718,796,797,802,807],{},[736,798,799],{},[376,800,801],{},"uiClassNames",[736,803,804],{},[376,805,806],{},"ComputedRef\u003Cstring[] | undefined>",[736,808,809],{},"The active style classes — auto-applied to the root element by default",[718,811,812,817,822],{},[736,813,814],{},[376,815,816],{},"publishedIri",[736,818,819],{},[376,820,821],{},"ComputedRef\u003Cstring | undefined>",[736,823,824,825,828,829,835],{},"The published\u002Flive IRI of this component — resolves to the published equivalent when the current resource is a draft. Use as the ",[376,826,827],{},"location"," for a nested ",[830,831,832],"a",{"href":193},[376,833,834],{},"\u003CCwaComponentGroup>"," owned by this component",[718,837,838,843,846],{},[736,839,840],{},[376,841,842],{},"...pluginReturns",[736,844,845],{},"merged object",[736,847,848],{},"All return values from provided plugins",[372,850,851,856,857,860],{},[631,852,853],{},[376,854,855],{},"defineExpose(exposeMeta)"," is ",[631,858,859],{},"required"," — without it the admin manager cannot select this component.",[463,862,864],{"id":863},"basic-component","Basic component",[381,866,870],{"className":867,"code":868,"language":869,"meta":386,"style":386},"language-vue shiki shiki-themes github-light github-dark material-theme-palenight","\u003Ctemplate>\n  \u003Cdiv v-if=\"resource?.data\">\n    \u003Ch2>{{ resource.data.title }}\u003C\u002Fh2>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nimport type { IriProp } from '#cwa\u002Fcomposables\u002Fcwa-resource'\nimport { useCwaComponent } from '#imports'\n\nconst props = defineProps\u003CIriProp>()\nconst { resource, exposeMeta } = useCwaComponent(props)\ndefineExpose(exposeMeta)\n\u003C\u002Fscript>\n","vue",[376,871,872,883,910,929,938,946,952,975,1003,1022,1026,1044,1064,1070],{"__ignoreMap":386},[390,873,874,876,880],{"class":392,"line":393},[390,875,413],{"class":412},[390,877,879],{"class":878},"s-h7I","template",[390,881,882],{"class":412},">\n",[390,884,885,888,891,895,898,902,906,908],{"class":392,"line":427},[390,886,887],{"class":412},"  \u003C",[390,889,890],{"class":878},"div",[390,892,894],{"class":893},"sGtlX"," v-if",[390,896,897],{"class":412},"=",[390,899,901],{"class":900},"seSrl","\"",[390,903,905],{"class":904},"sLL54","resource?.data",[390,907,901],{"class":900},[390,909,882],{"class":412},[390,911,912,915,917,919,922,925,927],{"class":392,"line":455},[390,913,914],{"class":412},"    \u003C",[390,916,463],{"class":878},[390,918,420],{"class":412},[390,920,921],{"class":423},"{{ resource.data.title }}",[390,923,924],{"class":412},"\u003C\u002F",[390,926,463],{"class":878},[390,928,882],{"class":412},[390,930,931,934,936],{"class":392,"line":502},[390,932,933],{"class":412},"  \u003C\u002F",[390,935,890],{"class":878},[390,937,882],{"class":412},[390,939,940,942,944],{"class":392,"line":513},[390,941,924],{"class":412},[390,943,879],{"class":878},[390,945,882],{"class":412},[390,947,948],{"class":392,"line":525},[390,949,951],{"emptyLinePlaceholder":950},true,"\n",[390,953,954,956,959,962,965,967,969,971,973],{"class":392,"line":535},[390,955,413],{"class":412},[390,957,958],{"class":878},"script",[390,960,961],{"class":893}," setup",[390,963,964],{"class":893}," lang",[390,966,897],{"class":412},[390,968,901],{"class":900},[390,970,385],{"class":904},[390,972,901],{"class":900},[390,974,882],{"class":412},[390,976,977,981,984,986,989,991,994,997,1000],{"class":392,"line":546},[390,978,980],{"class":979},"sm4w6","import",[390,982,983],{"class":979}," type",[390,985,432],{"class":412},[390,987,988],{"class":423}," IriProp",[390,990,444],{"class":412},[390,992,993],{"class":979}," from",[390,995,996],{"class":900}," '",[390,998,999],{"class":904},"#cwa\u002Fcomposables\u002Fcwa-resource",[390,1001,1002],{"class":900},"'\n",[390,1004,1005,1007,1009,1011,1013,1015,1017,1020],{"class":392,"line":553},[390,1006,980],{"class":979},[390,1008,432],{"class":412},[390,1010,449],{"class":423},[390,1012,444],{"class":412},[390,1014,993],{"class":979},[390,1016,996],{"class":900},[390,1018,1019],{"class":904},"#imports",[390,1021,1002],{"class":900},[390,1023,1024],{"class":392,"line":573},[390,1025,951],{"emptyLinePlaceholder":950},[390,1027,1028,1030,1032,1034,1036,1038,1040,1042],{"class":392,"line":579},[390,1029,397],{"class":396},[390,1031,401],{"class":400},[390,1033,405],{"class":404},[390,1035,409],{"class":408},[390,1037,413],{"class":412},[390,1039,417],{"class":416},[390,1041,420],{"class":412},[390,1043,424],{"class":423},[390,1045,1046,1048,1050,1052,1054,1056,1058,1060,1062],{"class":392,"line":589},[390,1047,397],{"class":396},[390,1049,432],{"class":412},[390,1051,435],{"class":400},[390,1053,438],{"class":412},[390,1055,441],{"class":400},[390,1057,444],{"class":412},[390,1059,405],{"class":404},[390,1061,449],{"class":408},[390,1063,452],{"class":423},[390,1065,1066,1068],{"class":392,"line":599},[390,1067,458],{"class":408},[390,1069,461],{"class":423},[390,1071,1072,1074,1076],{"class":392,"line":604},[390,1073,924],{"class":412},[390,1075,958],{"class":878},[390,1077,882],{"class":412},[372,1079,1080,1083],{},[376,1081,1082],{},"resource.value"," states:",[1085,1086,1087,1094,1100],"ul",{},[1088,1089,1090,1093],"li",{},[376,1091,1092],{},"undefined"," — loading",[1088,1095,1096,1099],{},[376,1097,1098],{},"null"," — not found",[1088,1101,1102],{},"object — data available",[1104,1105],"hr",{},[463,1107,1108],{"id":651},"Plugins",[372,1110,1111,1112,1114],{},"Plugins extend ",[376,1113,364],{}," with additional state and methods. Pass an array of plugin factory results as the second argument. Return values from all plugins are merged and destructured alongside the base returns.",[1116,1117,1119],"h3",{"id":1118},"withcollection",[376,1120,1121],{},"withCollection()",[372,1123,1124,1125,1128],{},"For components backed by the built-in ",[376,1126,1127],{},"Collection"," API resource. Returns pagination state and navigation helpers.",[381,1130,1132],{"className":383,"code":1131,"language":385,"meta":386,"style":386},"import { useCwaComponent, withCollection } from '#imports'\n\nconst props = defineProps\u003CIriProp>()\nconst {\n  resource,\n  exposeMeta,\n  collectionItems,\n  isLoadingCollection,\n  totalPages,\n  pageModel,\n  goToNextPage,\n  goToPreviousPage,\n  changePage,\n  resolveResourceLink,\n} = useCwaComponent(props, [withCollection()])\ndefineExpose(exposeMeta)\n",[376,1133,1134,1157,1161,1179,1185,1192,1199,1206,1213,1220,1227,1234,1241,1248,1255,1278],{"__ignoreMap":386},[390,1135,1136,1138,1140,1142,1144,1147,1149,1151,1153,1155],{"class":392,"line":393},[390,1137,980],{"class":979},[390,1139,432],{"class":412},[390,1141,449],{"class":423},[390,1143,438],{"class":412},[390,1145,1146],{"class":423}," withCollection",[390,1148,444],{"class":412},[390,1150,993],{"class":979},[390,1152,996],{"class":900},[390,1154,1019],{"class":904},[390,1156,1002],{"class":900},[390,1158,1159],{"class":392,"line":427},[390,1160,951],{"emptyLinePlaceholder":950},[390,1162,1163,1165,1167,1169,1171,1173,1175,1177],{"class":392,"line":455},[390,1164,397],{"class":396},[390,1166,401],{"class":400},[390,1168,405],{"class":404},[390,1170,409],{"class":408},[390,1172,413],{"class":412},[390,1174,417],{"class":416},[390,1176,420],{"class":412},[390,1178,424],{"class":423},[390,1180,1181,1183],{"class":392,"line":502},[390,1182,397],{"class":396},[390,1184,510],{"class":412},[390,1186,1187,1190],{"class":392,"line":513},[390,1188,1189],{"class":400},"  resource",[390,1191,486],{"class":412},[390,1193,1194,1197],{"class":392,"line":525},[390,1195,1196],{"class":400},"  exposeMeta",[390,1198,486],{"class":412},[390,1200,1201,1204],{"class":392,"line":535},[390,1202,1203],{"class":400},"  collectionItems",[390,1205,486],{"class":412},[390,1207,1208,1211],{"class":392,"line":546},[390,1209,1210],{"class":400},"  isLoadingCollection",[390,1212,486],{"class":412},[390,1214,1215,1218],{"class":392,"line":553},[390,1216,1217],{"class":400},"  totalPages",[390,1219,486],{"class":412},[390,1221,1222,1225],{"class":392,"line":573},[390,1223,1224],{"class":400},"  pageModel",[390,1226,486],{"class":412},[390,1228,1229,1232],{"class":392,"line":579},[390,1230,1231],{"class":400},"  goToNextPage",[390,1233,486],{"class":412},[390,1235,1236,1239],{"class":392,"line":589},[390,1237,1238],{"class":400},"  goToPreviousPage",[390,1240,486],{"class":412},[390,1242,1243,1246],{"class":392,"line":599},[390,1244,1245],{"class":400},"  changePage",[390,1247,486],{"class":412},[390,1249,1250,1253],{"class":392,"line":604},[390,1251,1252],{"class":400},"  resolveResourceLink",[390,1254,486],{"class":412},[390,1256,1257,1260,1262,1264,1267,1269,1272,1275],{"class":392,"line":618},[390,1258,1259],{"class":412},"}",[390,1261,405],{"class":404},[390,1263,449],{"class":408},[390,1265,1266],{"class":423},"(props",[390,1268,438],{"class":412},[390,1270,1271],{"class":423}," [",[390,1273,1274],{"class":408},"withCollection",[390,1276,1277],{"class":423},"()])\n",[390,1279,1280,1282],{"class":392,"line":624},[390,1281,458],{"class":408},[390,1283,461],{"class":423},[372,1285,1286,1287,1290],{},"Replaces the deprecated ",[376,1288,1289],{},"useCwaCollectionResource",".",[1116,1292,1294],{"id":1293},"withfilefileops",[376,1295,1296],{},"withFile(fileOps?)",[372,1298,1299,1300,1303,1304,1307,1308,1317,1318,1321,1322,1325,1326,1329,1330,1333,1334,1290],{},"For components backed by a PHP entity with ",[376,1301,1302],{},"#[Silverback\\Uploadable]",". Handles ",[631,1305,1306],{},"any"," uploadable file, not just images. Rather than flat return values, it exposes the field under a ",[631,1309,1310,1313,1314],{},[376,1311,1312],{},"files"," map keyed by its ",[376,1315,1316],{},"fileProp"," (default ",[376,1319,1320],{},"'file'",") — so ",[376,1323,1324],{},"files.file.contentUrl",", ",[376,1327,1328],{},"files.file.displayMedia",", etc. Map entries are ",[376,1331,1332],{},"reactive",", so in templates you access them ",[631,1335,1336,1337],{},"without ",[376,1338,1339],{},".value",[381,1341,1343],{"className":383,"code":1342,"language":385,"meta":386,"style":386},"import { useCwaComponent, withFile } from '#imports'\n\nconst props = defineProps\u003CIriProp>()\nconst { resource, exposeMeta, files } = useCwaComponent(props, [withFile()])\ndefineExpose(exposeMeta)\n\n\u002F\u002F files.file.contentUrl · files.file.displayMedia · files.file.handleLoad · files.file.loaded\n",[376,1344,1345,1368,1372,1390,1424,1430,1434],{"__ignoreMap":386},[390,1346,1347,1349,1351,1353,1355,1358,1360,1362,1364,1366],{"class":392,"line":393},[390,1348,980],{"class":979},[390,1350,432],{"class":412},[390,1352,449],{"class":423},[390,1354,438],{"class":412},[390,1356,1357],{"class":423}," withFile",[390,1359,444],{"class":412},[390,1361,993],{"class":979},[390,1363,996],{"class":900},[390,1365,1019],{"class":904},[390,1367,1002],{"class":900},[390,1369,1370],{"class":392,"line":427},[390,1371,951],{"emptyLinePlaceholder":950},[390,1373,1374,1376,1378,1380,1382,1384,1386,1388],{"class":392,"line":455},[390,1375,397],{"class":396},[390,1377,401],{"class":400},[390,1379,405],{"class":404},[390,1381,409],{"class":408},[390,1383,413],{"class":412},[390,1385,417],{"class":416},[390,1387,420],{"class":412},[390,1389,424],{"class":423},[390,1391,1392,1394,1396,1398,1400,1402,1404,1407,1409,1411,1413,1415,1417,1419,1422],{"class":392,"line":502},[390,1393,397],{"class":396},[390,1395,432],{"class":412},[390,1397,435],{"class":400},[390,1399,438],{"class":412},[390,1401,441],{"class":400},[390,1403,438],{"class":412},[390,1405,1406],{"class":400}," files",[390,1408,444],{"class":412},[390,1410,405],{"class":404},[390,1412,449],{"class":408},[390,1414,1266],{"class":423},[390,1416,438],{"class":412},[390,1418,1271],{"class":423},[390,1420,1421],{"class":408},"withFile",[390,1423,1277],{"class":423},[390,1425,1426,1428],{"class":392,"line":513},[390,1427,458],{"class":408},[390,1429,461],{"class":423},[390,1431,1432],{"class":392,"line":525},[390,1433,951],{"emptyLinePlaceholder":950},[390,1435,1436],{"class":392,"line":535},[390,1437,1438],{"class":549},"\u002F\u002F files.file.contentUrl · files.file.displayMedia · files.file.handleLoad · files.file.loaded\n",[372,1440,1441,1442,1445],{},"Options (",[376,1443,1444],{},"fileOps","):",[712,1447,1448,1458],{},[715,1449,1450],{},[718,1451,1452,1455],{},[721,1453,1454],{},"Option",[721,1456,1457],{},"Description",[731,1459,1460,1477,1495],{},[718,1461,1462,1466],{},[736,1463,1464],{},[376,1465,1316],{},[736,1467,1468,1469,1472,1473,1476],{},"Name of the PHP ",[376,1470,1471],{},"#[UploadableField]"," property holding the file (default: ",[376,1474,1475],{},"file","). Also the default template-ref name for load detection",[718,1478,1479,1484],{},[736,1480,1481],{},[376,1482,1483],{},"imagineFilterName",[736,1485,1486,1487,1490,1491,1494],{},"Imagine filter variant to surface as ",[376,1488,1489],{},"displayMedia","\u002F",[376,1492,1493],{},"contentUrl"," (image-specific)",[718,1496,1497,1502],{},[736,1498,1499],{},[376,1500,1501],{},"imageRef",[736,1503,1504,1505,1508,1509,1512],{},"Template ref for the ",[376,1506,1507],{},"\u003Cimg>"," element (defaults to ",[376,1510,1511],{},"useTemplateRef(fileProp)",")",[372,1514,1515,1516,1518,1519,1325,1521,1523,1524,1527,1528,1490,1531,1490,1534,1537,1538,1541,1542,1545,1546,1548,1549,1554],{},"Each entry in ",[376,1517,1312],{}," exposes ",[376,1520,1493],{},[376,1522,1489],{}," (a ",[376,1525,1526],{},"MediaFile"," with ",[376,1529,1530],{},"width",[376,1532,1533],{},"height",[376,1535,1536],{},"mimeType","), ",[376,1539,1540],{},"handleLoad",", and ",[376,1543,1544],{},"loaded",". See ",[830,1547,301],{"href":302}," for the full display pattern, and ",[830,1550,1551],{"href":243},[376,1552,1553],{},"useCwaFileField"," for the standalone per-field variant.",[1556,1557,1559],"callout",{"icon":1558},"i-heroicons-arrow-path",[372,1560,1561,1562,1565,1566,1490,1569,1490,1572,1575,1576,1578,1579,1581],{},"Renamed from ",[376,1563,1564],{},"withImage()"," (removed, along with ",[376,1567,1568],{},"useCwaImage",[376,1570,1571],{},"useCwaImageResource",[376,1573,1574],{},"ImageOpsType","). The old plugin returned flat keys; ",[376,1577,1421],{}," returns the ",[376,1580,1312],{}," map instead.",[1583,1584,1586],"h4",{"id":1585},"multiple-file-fields","Multiple file fields",[372,1588,1589,1590,1593,1594,1596,1597,1599,1600,1603,1604,1606],{},"Use ",[376,1591,1592],{},"withFile()"," once per field, each with its own ",[376,1595,1316],{},". ",[376,1598,364],{},"'s plugin merge ",[631,1601,1602],{},"accumulates"," the ",[376,1605,1312],{}," key rather than overwriting it, so the fields never collide:",[381,1608,1610],{"className":383,"code":1609,"language":385,"meta":386,"style":386},"const { files } = useCwaComponent(props, [\n  withFile({ fileProp: 'heroImage' }),\n  withFile({ fileProp: 'thumbnail', imagineFilterName: 'small' }),\n])\n\u002F\u002F files.heroImage.contentUrl · files.thumbnail.contentUrl\n",[376,1611,1612,1633,1663,1702,1707],{"__ignoreMap":386},[390,1613,1614,1616,1618,1620,1622,1624,1626,1628,1630],{"class":392,"line":393},[390,1615,397],{"class":396},[390,1617,432],{"class":412},[390,1619,1406],{"class":400},[390,1621,444],{"class":412},[390,1623,405],{"class":404},[390,1625,449],{"class":408},[390,1627,1266],{"class":423},[390,1629,438],{"class":412},[390,1631,1632],{"class":423}," [\n",[390,1634,1635,1638,1641,1644,1647,1649,1651,1654,1657,1659,1661],{"class":392,"line":427},[390,1636,1637],{"class":408},"  withFile",[390,1639,1640],{"class":423},"(",[390,1642,1643],{"class":412},"{",[390,1645,1646],{"class":569}," fileProp",[390,1648,519],{"class":412},[390,1650,996],{"class":900},[390,1652,1653],{"class":904},"heroImage",[390,1655,1656],{"class":900},"'",[390,1658,444],{"class":412},[390,1660,1512],{"class":423},[390,1662,486],{"class":412},[390,1664,1665,1667,1669,1671,1673,1675,1677,1680,1682,1684,1687,1689,1691,1694,1696,1698,1700],{"class":392,"line":455},[390,1666,1637],{"class":408},[390,1668,1640],{"class":423},[390,1670,1643],{"class":412},[390,1672,1646],{"class":569},[390,1674,519],{"class":412},[390,1676,996],{"class":900},[390,1678,1679],{"class":904},"thumbnail",[390,1681,1656],{"class":900},[390,1683,438],{"class":412},[390,1685,1686],{"class":569}," imagineFilterName",[390,1688,519],{"class":412},[390,1690,996],{"class":900},[390,1692,1693],{"class":904},"small",[390,1695,1656],{"class":900},[390,1697,444],{"class":412},[390,1699,1512],{"class":423},[390,1701,486],{"class":412},[390,1703,1704],{"class":392,"line":502},[390,1705,1706],{"class":423},"])\n",[390,1708,1709],{"class":392,"line":513},[390,1710,1711],{"class":549},"\u002F\u002F files.heroImage.contentUrl · files.thumbnail.contentUrl\n",[1116,1713,1715],{"id":1714},"combining-plugins","Combining plugins",[372,1717,1718,1719,1721,1722,1724],{},"Multiple plugins can be composed in a single call — something the old ",[376,1720,1289],{}," \u002F ",[376,1723,1571],{}," pattern could not do:",[381,1726,1728],{"className":383,"code":1727,"language":385,"meta":386,"style":386},"const { resource, exposeMeta, collectionItems, files } = useCwaComponent(\n  props,\n  [withCollection(), withFile()]\n)\ndefineExpose(exposeMeta)\n",[376,1729,1730,1759,1766,1783,1787],{"__ignoreMap":386},[390,1731,1732,1734,1736,1738,1740,1742,1744,1747,1749,1751,1753,1755,1757],{"class":392,"line":393},[390,1733,397],{"class":396},[390,1735,432],{"class":412},[390,1737,435],{"class":400},[390,1739,438],{"class":412},[390,1741,441],{"class":400},[390,1743,438],{"class":412},[390,1745,1746],{"class":400}," collectionItems",[390,1748,438],{"class":412},[390,1750,1406],{"class":400},[390,1752,444],{"class":412},[390,1754,405],{"class":404},[390,1756,449],{"class":408},[390,1758,478],{"class":423},[390,1760,1761,1764],{"class":392,"line":427},[390,1762,1763],{"class":423},"  props",[390,1765,486],{"class":412},[390,1767,1768,1771,1773,1776,1778,1780],{"class":392,"line":455},[390,1769,1770],{"class":423},"  [",[390,1772,1274],{"class":408},[390,1774,1775],{"class":423},"()",[390,1777,438],{"class":412},[390,1779,1357],{"class":408},[390,1781,1782],{"class":423},"()]\n",[390,1784,1785],{"class":392,"line":502},[390,1786,627],{"class":423},[390,1788,1789,1791],{"class":392,"line":513},[390,1790,458],{"class":408},[390,1792,461],{"class":423},[1104,1794],{},[463,1796,1798],{"id":1797},"style-variants","Style variants",[381,1800,1802],{"className":383,"code":1801,"language":385,"meta":386,"style":386},"const { resource, exposeMeta, getCurrentStyleName } = useCwaComponent(props, [], {\n  styles: {\n    multiple: false,\n    classes: {\n      'Default': '',\n      'Filled': 'bg-blue-600 text-white px-6 py-2 rounded-md',\n      'Outlined': 'border border-blue-600 text-blue-600 px-6 py-2',\n    }\n  }\n})\n\nconst currentStyleName = computed(() => {\n  if (!resource.value?.data) return undefined\n  return getCurrentStyleName(resource.value.data)\n})\n",[376,1803,1804,1837,1846,1859,1868,1886,1906,1926,1930,1934,1940,1944,1965,1999,2020],{"__ignoreMap":386},[390,1805,1806,1808,1810,1812,1814,1816,1818,1820,1822,1824,1826,1828,1830,1833,1835],{"class":392,"line":393},[390,1807,397],{"class":396},[390,1809,432],{"class":412},[390,1811,435],{"class":400},[390,1813,438],{"class":412},[390,1815,441],{"class":400},[390,1817,438],{"class":412},[390,1819,694],{"class":400},[390,1821,444],{"class":412},[390,1823,405],{"class":404},[390,1825,449],{"class":408},[390,1827,1266],{"class":423},[390,1829,438],{"class":412},[390,1831,1832],{"class":423}," []",[390,1834,438],{"class":412},[390,1836,510],{"class":412},[390,1838,1839,1842,1844],{"class":392,"line":427},[390,1840,1841],{"class":569},"  styles",[390,1843,519],{"class":412},[390,1845,510],{"class":412},[390,1847,1848,1851,1853,1857],{"class":392,"line":455},[390,1849,1850],{"class":569},"    multiple",[390,1852,519],{"class":412},[390,1854,1856],{"class":1855},"swWMF"," false",[390,1858,486],{"class":412},[390,1860,1861,1864,1866],{"class":392,"line":502},[390,1862,1863],{"class":569},"    classes",[390,1865,519],{"class":412},[390,1867,510],{"class":412},[390,1869,1870,1873,1877,1879,1881,1884],{"class":392,"line":513},[390,1871,1872],{"class":900},"      '",[390,1874,1876],{"class":1875},"syBAL","Default",[390,1878,1656],{"class":900},[390,1880,519],{"class":412},[390,1882,1883],{"class":900}," ''",[390,1885,486],{"class":412},[390,1887,1888,1890,1893,1895,1897,1899,1902,1904],{"class":392,"line":525},[390,1889,1872],{"class":900},[390,1891,1892],{"class":1875},"Filled",[390,1894,1656],{"class":900},[390,1896,519],{"class":412},[390,1898,996],{"class":900},[390,1900,1901],{"class":904},"bg-blue-600 text-white px-6 py-2 rounded-md",[390,1903,1656],{"class":900},[390,1905,486],{"class":412},[390,1907,1908,1910,1913,1915,1917,1919,1922,1924],{"class":392,"line":535},[390,1909,1872],{"class":900},[390,1911,1912],{"class":1875},"Outlined",[390,1914,1656],{"class":900},[390,1916,519],{"class":412},[390,1918,996],{"class":900},[390,1920,1921],{"class":904},"border border-blue-600 text-blue-600 px-6 py-2",[390,1923,1656],{"class":900},[390,1925,486],{"class":412},[390,1927,1928],{"class":392,"line":546},[390,1929,576],{"class":412},[390,1931,1932],{"class":392,"line":553},[390,1933,621],{"class":412},[390,1935,1936,1938],{"class":392,"line":573},[390,1937,1259],{"class":412},[390,1939,627],{"class":423},[390,1941,1942],{"class":392,"line":579},[390,1943,951],{"emptyLinePlaceholder":950},[390,1945,1946,1948,1951,1953,1956,1958,1960,1963],{"class":392,"line":589},[390,1947,397],{"class":396},[390,1949,1950],{"class":400}," currentStyleName",[390,1952,405],{"class":404},[390,1954,1955],{"class":408}," computed",[390,1957,1640],{"class":423},[390,1959,1775],{"class":412},[390,1961,1962],{"class":396}," =>",[390,1964,510],{"class":412},[390,1966,1967,1970,1973,1976,1978,1980,1983,1986,1989,1992,1995],{"class":392,"line":599},[390,1968,1969],{"class":979},"  if",[390,1971,1972],{"class":569}," (",[390,1974,1975],{"class":404},"!",[390,1977,740],{"class":423},[390,1979,1290],{"class":412},[390,1981,1982],{"class":423},"value",[390,1984,1985],{"class":412},"?.",[390,1987,1988],{"class":423},"data",[390,1990,1991],{"class":569},") ",[390,1993,1994],{"class":979},"return",[390,1996,1998],{"class":1997},"sBtbT"," undefined\n",[390,2000,2001,2004,2006,2008,2010,2012,2014,2016,2018],{"class":392,"line":604},[390,2002,2003],{"class":979},"  return",[390,2005,694],{"class":408},[390,2007,1640],{"class":569},[390,2009,740],{"class":423},[390,2011,1290],{"class":412},[390,2013,1982],{"class":423},[390,2015,1290],{"class":412},[390,2017,1988],{"class":423},[390,2019,627],{"class":569},[390,2021,2022,2024],{"class":392,"line":618},[390,2023,1259],{"class":412},[390,2025,627],{"class":423},[372,2027,2028,2029,2032,2033,2036,2037,2040],{},"Each style's value is a ",[631,2030,2031],{},"class string",". (A ",[376,2034,2035],{},"string[]"," is still accepted and joined, but is deprecated — prefer a plain string.) The style names appear in the admin \"Style\" selector. The selected classes are automatically applied to the component's root element — no ",[376,2038,2039],{},":class"," binding needed.",[1116,2042,2044],{"id":2043},"allowing-several-styles-at-once","Allowing several styles at once",[372,2046,2047,2048,2051,2052,2055],{},"Set ",[376,2049,2050],{},"multiple: true"," to let the author tick more than one style in the admin ",[631,2053,2054],{},"Style"," dropdown (it becomes a multi-select; single mode stays a normal dropdown). The chosen classes are combined onto the element:",[381,2057,2059],{"className":383,"code":2058,"language":385,"meta":386,"style":386},"const { resource, exposeMeta } = useCwaComponent(props, [], {\n  styles: {\n    multiple: true,\n    classes: {\n      Bordered: 'border border-gray-200',\n      Rounded: 'rounded',\n    },\n  },\n})\n",[376,2060,2061,2089,2097,2108,2116,2132,2148,2153,2158],{"__ignoreMap":386},[390,2062,2063,2065,2067,2069,2071,2073,2075,2077,2079,2081,2083,2085,2087],{"class":392,"line":393},[390,2064,397],{"class":396},[390,2066,432],{"class":412},[390,2068,435],{"class":400},[390,2070,438],{"class":412},[390,2072,441],{"class":400},[390,2074,444],{"class":412},[390,2076,405],{"class":404},[390,2078,449],{"class":408},[390,2080,1266],{"class":423},[390,2082,438],{"class":412},[390,2084,1832],{"class":423},[390,2086,438],{"class":412},[390,2088,510],{"class":412},[390,2090,2091,2093,2095],{"class":392,"line":427},[390,2092,1841],{"class":569},[390,2094,519],{"class":412},[390,2096,510],{"class":412},[390,2098,2099,2101,2103,2106],{"class":392,"line":455},[390,2100,1850],{"class":569},[390,2102,519],{"class":412},[390,2104,2105],{"class":1855}," true",[390,2107,486],{"class":412},[390,2109,2110,2112,2114],{"class":392,"line":502},[390,2111,1863],{"class":569},[390,2113,519],{"class":412},[390,2115,510],{"class":412},[390,2117,2118,2121,2123,2125,2128,2130],{"class":392,"line":513},[390,2119,2120],{"class":569},"      Bordered",[390,2122,519],{"class":412},[390,2124,996],{"class":900},[390,2126,2127],{"class":904},"border border-gray-200",[390,2129,1656],{"class":900},[390,2131,486],{"class":412},[390,2133,2134,2137,2139,2141,2144,2146],{"class":392,"line":525},[390,2135,2136],{"class":569},"      Rounded",[390,2138,519],{"class":412},[390,2140,996],{"class":900},[390,2142,2143],{"class":904},"rounded",[390,2145,1656],{"class":900},[390,2147,486],{"class":412},[390,2149,2150],{"class":392,"line":535},[390,2151,2152],{"class":412},"    },\n",[390,2154,2155],{"class":392,"line":546},[390,2156,2157],{"class":412},"  },\n",[390,2159,2160,2162],{"class":392,"line":553},[390,2161,1259],{"class":412},[390,2163,627],{"class":423},[372,2165,2166,2167,2170,2171,2174,2175,2178,2179,2182],{},"The resource's flat ",[376,2168,2169],{},"uiClassNames: string[]"," stores ",[631,2172,2173],{},"one entry per selected style"," — that style's class string — for both single and multiple select. A single selection is a one-element array (e.g. ",[376,2176,2177],{},"['border border-gray-200']","); a multiple selection is an array of N (picking both above saves ",[376,2180,2181],{},"['border border-gray-200', 'rounded']",").",[1116,2184,2186],{"id":2185},"applying-classes-to-an-inner-element","Applying classes to an inner element",[372,2188,2189,2190,2192],{},"If you want the style classes on an inner element rather than the root, opt out of auto-apply and bind ",[376,2191,801],{}," manually:",[381,2194,2196],{"className":383,"code":2195,"language":385,"meta":386,"style":386},"const { resource, exposeMeta, uiClassNames } = useCwaComponent(props, [], {\n  autoClass: false,\n  styles: { ... }\n})\n",[376,2197,2198,2231,2242,2255],{"__ignoreMap":386},[390,2199,2200,2202,2204,2206,2208,2210,2212,2215,2217,2219,2221,2223,2225,2227,2229],{"class":392,"line":393},[390,2201,397],{"class":396},[390,2203,432],{"class":412},[390,2205,435],{"class":400},[390,2207,438],{"class":412},[390,2209,441],{"class":400},[390,2211,438],{"class":412},[390,2213,2214],{"class":400}," uiClassNames",[390,2216,444],{"class":412},[390,2218,405],{"class":404},[390,2220,449],{"class":408},[390,2222,1266],{"class":423},[390,2224,438],{"class":412},[390,2226,1832],{"class":423},[390,2228,438],{"class":412},[390,2230,510],{"class":412},[390,2232,2233,2236,2238,2240],{"class":392,"line":427},[390,2234,2235],{"class":569},"  autoClass",[390,2237,519],{"class":412},[390,2239,1856],{"class":1855},[390,2241,486],{"class":412},[390,2243,2244,2246,2248,2250,2252],{"class":392,"line":455},[390,2245,1841],{"class":569},[390,2247,519],{"class":412},[390,2249,432],{"class":412},[390,2251,699],{"class":404},[390,2253,2254],{"class":412}," }\n",[390,2256,2257,2259],{"class":392,"line":502},[390,2258,1259],{"class":412},[390,2260,627],{"class":423},[381,2262,2264],{"className":867,"code":2263,"language":869,"meta":386,"style":386},"\u003Ctemplate>\n  \u003Cdiv>\n    \u003Ca :class=\"uiClassNames\">{{ resource?.data?.label }}\u003C\u002Fa>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n",[376,2265,2266,2274,2282,2310,2318],{"__ignoreMap":386},[390,2267,2268,2270,2272],{"class":392,"line":393},[390,2269,413],{"class":412},[390,2271,879],{"class":878},[390,2273,882],{"class":412},[390,2275,2276,2278,2280],{"class":392,"line":427},[390,2277,887],{"class":412},[390,2279,890],{"class":878},[390,2281,882],{"class":412},[390,2283,2284,2286,2288,2291,2293,2295,2297,2299,2301,2304,2306,2308],{"class":392,"line":455},[390,2285,914],{"class":412},[390,2287,830],{"class":878},[390,2289,2290],{"class":893}," :class",[390,2292,897],{"class":412},[390,2294,901],{"class":900},[390,2296,801],{"class":904},[390,2298,901],{"class":900},[390,2300,420],{"class":412},[390,2302,2303],{"class":423},"{{ resource?.data?.label }}",[390,2305,924],{"class":412},[390,2307,830],{"class":878},[390,2309,882],{"class":412},[390,2311,2312,2314,2316],{"class":392,"line":502},[390,2313,933],{"class":412},[390,2315,890],{"class":878},[390,2317,882],{"class":412},[390,2319,2320,2322,2324],{"class":392,"line":513},[390,2321,924],{"class":412},[390,2323,879],{"class":878},[390,2325,882],{"class":412},[1104,2327],{},[463,2329,2331],{"id":2330},"writing-a-custom-plugin","Writing a custom plugin",[372,2333,2334,2335,2338],{},"A plugin is a function that receives ",[376,2336,2337],{},"{ iri, resource, $cwa }"," and returns any object:",[381,2340,2342],{"className":383,"code":2341,"language":385,"meta":386,"style":386},"import type { CwaResourcePlugin } from '#cwa\u002Fcomposables\u002Fcwa-component'\n\nconst withWordCount = (): CwaResourcePlugin\u003C{ wordCount: ComputedRef\u003Cnumber> }> => {\n  return ({ resource }) => {\n    const wordCount = computed(() => {\n      const body = resource.value?.data?.body ?? ''\n      return body.split(\u002F\\s+\u002F).filter(Boolean).length\n    })\n    return { wordCount }\n  }\n}\n\n\u002F\u002F Usage\nconst { resource, exposeMeta, wordCount } = useCwaComponent(props, [withWordCount()])\n",[376,2343,2344,2366,2370,2414,2431,2450,2481,2525,2532,2543,2547,2552,2556,2561],{"__ignoreMap":386},[390,2345,2346,2348,2350,2352,2355,2357,2359,2361,2364],{"class":392,"line":393},[390,2347,980],{"class":979},[390,2349,983],{"class":979},[390,2351,432],{"class":412},[390,2353,2354],{"class":423}," CwaResourcePlugin",[390,2356,444],{"class":412},[390,2358,993],{"class":979},[390,2360,996],{"class":900},[390,2362,2363],{"class":904},"#cwa\u002Fcomposables\u002Fcwa-component",[390,2365,1002],{"class":900},[390,2367,2368],{"class":392,"line":427},[390,2369,951],{"emptyLinePlaceholder":950},[390,2371,2372,2374,2378,2380,2383,2385,2387,2390,2394,2396,2399,2401,2405,2407,2410,2412],{"class":392,"line":455},[390,2373,397],{"class":396},[390,2375,2377],{"class":2376},"scpWJ"," withWordCount",[390,2379,405],{"class":404},[390,2381,2382],{"class":412}," ()",[390,2384,519],{"class":404},[390,2386,2354],{"class":416},[390,2388,2389],{"class":412},"\u003C{",[390,2391,2393],{"class":2392},"ssFBz"," wordCount",[390,2395,519],{"class":404},[390,2397,2398],{"class":416}," ComputedRef",[390,2400,413],{"class":412},[390,2402,2404],{"class":2403},"sbW4m","number",[390,2406,420],{"class":412},[390,2408,2409],{"class":412}," }>",[390,2411,1962],{"class":396},[390,2413,510],{"class":412},[390,2415,2416,2418,2421,2424,2427,2429],{"class":392,"line":502},[390,2417,2003],{"class":979},[390,2419,2420],{"class":412}," ({",[390,2422,435],{"class":2423},"sNTR6",[390,2425,2426],{"class":412}," })",[390,2428,1962],{"class":396},[390,2430,510],{"class":412},[390,2432,2433,2436,2438,2440,2442,2444,2446,2448],{"class":392,"line":513},[390,2434,2435],{"class":396},"    const",[390,2437,2393],{"class":400},[390,2439,405],{"class":404},[390,2441,1955],{"class":408},[390,2443,1640],{"class":569},[390,2445,1775],{"class":412},[390,2447,1962],{"class":396},[390,2449,510],{"class":412},[390,2451,2452,2455,2458,2460,2462,2464,2466,2468,2470,2472,2475,2478],{"class":392,"line":525},[390,2453,2454],{"class":396},"      const",[390,2456,2457],{"class":400}," body",[390,2459,405],{"class":404},[390,2461,435],{"class":423},[390,2463,1290],{"class":412},[390,2465,1982],{"class":423},[390,2467,1985],{"class":412},[390,2469,1988],{"class":423},[390,2471,1985],{"class":412},[390,2473,2474],{"class":423},"body",[390,2476,2477],{"class":404}," ??",[390,2479,2480],{"class":900}," ''\n",[390,2482,2483,2486,2488,2490,2493,2495,2497,2501,2504,2506,2508,2510,2513,2515,2518,2520,2522],{"class":392,"line":535},[390,2484,2485],{"class":979},"      return",[390,2487,2457],{"class":423},[390,2489,1290],{"class":412},[390,2491,2492],{"class":408},"split",[390,2494,1640],{"class":569},[390,2496,1490],{"class":900},[390,2498,2500],{"class":2499},"szhYu","\\s",[390,2502,2503],{"class":404},"+",[390,2505,1490],{"class":900},[390,2507,1512],{"class":569},[390,2509,1290],{"class":412},[390,2511,2512],{"class":408},"filter",[390,2514,1640],{"class":569},[390,2516,2517],{"class":423},"Boolean",[390,2519,1512],{"class":569},[390,2521,1290],{"class":412},[390,2523,2524],{"class":400},"length\n",[390,2526,2527,2530],{"class":392,"line":546},[390,2528,2529],{"class":412},"    }",[390,2531,627],{"class":569},[390,2533,2534,2537,2539,2541],{"class":392,"line":553},[390,2535,2536],{"class":979},"    return",[390,2538,432],{"class":412},[390,2540,2393],{"class":423},[390,2542,2254],{"class":412},[390,2544,2545],{"class":392,"line":573},[390,2546,621],{"class":412},[390,2548,2549],{"class":392,"line":579},[390,2550,2551],{"class":412},"}\n",[390,2553,2554],{"class":392,"line":589},[390,2555,951],{"emptyLinePlaceholder":950},[390,2557,2558],{"class":392,"line":599},[390,2559,2560],{"class":549},"\u002F\u002F Usage\n",[390,2562,2563,2565,2567,2569,2571,2573,2575,2577,2579,2581,2583,2585,2587,2589,2592],{"class":392,"line":604},[390,2564,397],{"class":396},[390,2566,432],{"class":412},[390,2568,435],{"class":400},[390,2570,438],{"class":412},[390,2572,441],{"class":400},[390,2574,438],{"class":412},[390,2576,2393],{"class":400},[390,2578,444],{"class":412},[390,2580,405],{"class":404},[390,2582,449],{"class":408},[390,2584,1266],{"class":423},[390,2586,438],{"class":412},[390,2588,1271],{"class":423},[390,2590,2591],{"class":408},"withWordCount",[390,2593,1277],{"class":423},[2595,2596,2597],"style",{},"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 .sOvfz, html code.shiki .sOvfz{--shiki-light:#24292E;--shiki-default:#E1E4E8;--shiki-dark:#89DDFF}html pre.shiki code .sRCss, html code.shiki .sRCss{--shiki-light:#6F42C1;--shiki-default:#B392F0;--shiki-dark:#FFCB6B}html pre.shiki code .sPB8G, html code.shiki .sPB8G{--shiki-light:#24292E;--shiki-default:#E1E4E8;--shiki-dark:#BABED8}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 .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 .sDHlG, html code.shiki .sDHlG{--shiki-light:#24292E;--shiki-default:#E1E4E8;--shiki-dark:#F07178}html pre.shiki code .s-h7I, html code.shiki .s-h7I{--shiki-light:#22863A;--shiki-default:#85E89D;--shiki-dark:#F07178}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 .sLL54, html code.shiki .sLL54{--shiki-light:#032F62;--shiki-default:#9ECBFF;--shiki-dark:#C3E88D}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 .swWMF, html code.shiki .swWMF{--shiki-light:#005CC5;--shiki-default:#79B8FF;--shiki-dark:#FF9CAC}html pre.shiki code .syBAL, html code.shiki .syBAL{--shiki-light:#032F62;--shiki-default:#9ECBFF;--shiki-dark:#F07178}html pre.shiki code .sBtbT, html code.shiki .sBtbT{--shiki-light:#005CC5;--shiki-default:#79B8FF;--shiki-dark:#89DDFF}html pre.shiki code .scpWJ, html code.shiki .scpWJ{--shiki-light:#6F42C1;--shiki-default:#B392F0;--shiki-dark:#BABED8}html pre.shiki code .ssFBz, html code.shiki .ssFBz{--shiki-light:#E36209;--shiki-default:#FFAB70;--shiki-dark:#F07178}html pre.shiki code .sbW4m, html code.shiki .sbW4m{--shiki-light:#005CC5;--shiki-default:#79B8FF;--shiki-dark:#FFCB6B}html pre.shiki code .sNTR6, html code.shiki .sNTR6{--shiki-light:#E36209;--shiki-light-font-style:inherit;--shiki-default:#FFAB70;--shiki-default-font-style:inherit;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .szhYu, html code.shiki .szhYu{--shiki-light:#005CC5;--shiki-default:#79B8FF;--shiki-dark:#C3E88D}",{"title":386,"searchDepth":427,"depth":427,"links":2599},[2600,2601,2602,2603,2608,2612],{"id":465,"depth":427,"text":466},{"id":666,"depth":427,"text":667},{"id":863,"depth":427,"text":864},{"id":651,"depth":427,"text":1108,"children":2604},[2605,2606,2607],{"id":1118,"depth":455,"text":1121},{"id":1293,"depth":455,"text":1296},{"id":1714,"depth":455,"text":1715},{"id":1797,"depth":427,"text":1798,"children":2609},[2610,2611],{"id":2043,"depth":455,"text":2044},{"id":2185,"depth":455,"text":2186},{"id":2330,"depth":427,"text":2331},"The recommended entry point for all CWA display components — fetch resource data, expose to the admin manager, and compose plugins for collections, images, or custom behaviour.","md",null,{},{"title":230},{"title":364,"description":2613},"g5CJOD7WvePavxrPvmkeZlFZetNdBe5kgugpR77Jrhs",[2621,2623],{"title":217,"path":222,"stem":223,"description":2622,"children":-1},"Access the current layout resource and auto-apply style classes to the layout's root element.",{"title":234,"path":235,"stem":236,"description":2624,"children":-1},"Bind a display component to its API resource by IRI — fetch, subscribe, and expose to the admin manager.",1783701658880]