CWA 2 is a prerelease (2.0.0-alpha), heading for a beta. It runs production sites; configuration can still change between releases, always with upgrade notes. View versions and support
Cwa Api

cwa.resources

The read-only store view — page, pageData, layout, arbitrary resource lookup, and loading state.

The read-only store view. Most values are ComputedRef — they react to resource fetches automatically.

One exception worth knowing before you write .value anywhere: currentIds, currentResources, getComponentGroupByReference(), isIriPublishableEquivalent() and findAllPublishableIris() return plain values, not refs — no .value.

cwa.resources exposes two complementary families of page/pageData getters. Understanding the difference is important for using them correctly:

FamilyGettersWhat they returnRequires manifest?Use for
Flat leafpageIri, pageDataIri, page, pageDataThe page/pageData at the leaf of the current URL — i.e. the innermost, deepest target of the routeNoSEO meta, admin identity, reading article data
Depth-awarepageIriAtDepth(n), pageDataIriAtDepth(n), pageAtDepth(n), pageDataAtDepth(n)The page/pageData at a specific rendering depth from the manifestDepths > 0 require a manifest<CwaPage /> rendering, layout-level access

The flat leaf getters follow the fetch path to the deepest resource — for a URL like /events/2024/conference, pageIri resolves to the innermost page. The depth-aware methods read the manifest's irisByDepth array — pageIriAtDepth(0) is the outermost page, pageIriAtDepth(2) is two levels deep. These families are complementary, not interchangeable.

Layout

cwa.resources.layout        // ComputedRef<CwaCurrentResourceInterface | undefined>
cwa.resources.layoutIri     // ComputedRef<string | undefined>

Layout always comes from the depth-0 page regardless of nesting depth.

Flat Leaf Getters

Use these when you need to know what the current URL is about — the page or article the visitor navigated to. They work without a manifest (no pagesDepth requirement) and are what the SEO plugin uses to populate <title> and <meta> tags.

cwa.resources.page          // ComputedRef<CwaCurrentResourceInterface | undefined>
cwa.resources.pageIri       // ComputedRef<string | undefined>

cwa.resources.pageData      // ComputedRef<CwaCurrentResourceInterface | undefined> — value is set on data pages only
cwa.resources.pageDataIri   // ComputedRef<string | undefined>

cwa.resources.displayPage   // ComputedRef — the "identity" page shown in the admin (pageData for data pages, page otherwise)
cwa.resources.displayPageIri

page, pageData and displayPage always return a ComputedRef, like layout — read .value directly. The value is undefined until the corresponding IRI resolves, so guard the data you read from it, not the getter.

Typical use — reading article data in a page template:

const cwa = useCwa()
const headline = computed(() => cwa.resources.pageData.value?.data?.headline)
const title = computed(() => cwa.resources.pageData.value?.data?.title ?? cwa.resources.page.value?.data?.title)

Page Type Flags

cwa.resources.usesPageTemplate   // ComputedRef<boolean> — true when the page is marked isTemplate
cwa.resources.isDataPage         // ComputedRef<boolean> — usesPageTemplate && a pageData record is active
cwa.resources.isDynamicPage      // ComputedRef<boolean> — usesPageTemplate && NO pageData record

isDataPage and isDynamicPage are mutually exclusive: a page marked isTemplate either has an active PageData record (isDataPage) or is being rendered without one (isDynamicPage).

Depth-Aware Methods

Use these when you need to know what renders at a specific nesting level. They read manifest.irisByDepth[n]. At depth 0, all four methods fall back to the page and page data loaded by the primary fetch, so they still resolve when the manifest is missing. At depth 1 and beyond a manifest is required.

These are used internally by <CwaPage /> to pass the correct IRI to each nesting level — you rarely call them with an explicit depth outside of <CwaPage /> itself.

cwa.resources.depthCount                    // ComputedRef<number> — number of depth levels in the manifest (minimum 1)
cwa.resources.pageAtDepth(0)                // ComputedRef — outermost page resource
cwa.resources.pageAtDepth(1)                // ComputedRef — first nested page resource
cwa.resources.pageIriAtDepth(0)             // ComputedRef<string | undefined>
cwa.resources.pageDataAtDepth(0)            // ComputedRef — pageData at a given depth
cwa.resources.pageDataIriAtDepth(0)         // ComputedRef<string | undefined>

Calling without an argument — inside a component rendered by <CwaPage />, omit the depth. The component injects cwa-page-own-depth and the method resolves to the correct level automatically:

// Inside a page template component rendered by <CwaPage /> — no depth arg needed
const pageIri = cwa.resources.pageIriAtDepth()         // resolves to own depth
const pageDataIri = cwa.resources.pageDataIriAtDepth() // resolves to own depth
const page = cwa.resources.pageAtDepth()
const pageData = cwa.resources.pageDataAtDepth()

<CwaPage /> provides three inject keys to the template it renders: cwa-page-own-depth, cwa-page-depth and cwa-page-data-iri. What <CwaPage /> Provides lists their types and values.

cwa-page-data-iri is the most convenient way to access PageData in a template component — no depth arithmetic needed:

import { inject } from 'vue'
import type { ComputedRef } from 'vue'

const pageDataIri = inject<ComputedRef<string | undefined>>('cwa-page-data-iri')
const eventData = computed(() => {
    if (!pageDataIri?.value) return null
    return cwa.resources.getResource(pageDataIri.value).value
})

Arbitrary Resource Lookup

// Fetch any resource by IRI (returns a ComputedRef tracking that IRI)
const resource = cwa.resources.getResource('/component/titles/018e-...')
resource.value?.data?.title

// All resources currently loaded for this page
cwa.resources.currentResources    // { [iri: string]: CwaCurrentResourceInterface }
cwa.resources.currentIds          // string[] — IRI list for current page

// Find a component group by its reference name
cwa.resources.getComponentGroupByReference('navigation')

Loading State

cwa.resources.isLoading         // ComputedRef<boolean> — true while any fetch is resolving or resources are still loading
cwa.resources.pageLoadProgress  // ComputedRef<{ total, complete, percent, resources[] }>

Publishable Helpers

cwa.resources.findPublishedComponentIri(iri)      // → published IRI for this draft
cwa.resources.findDraftComponentIri(iri)          // → draft IRI for this published resource
cwa.resources.isIriPublishableEquivalent(a, b)    // → true when a and b are draft/publish twins
cwa.resources.findAllPublishableIris(iri)         // → both IRIs for a publishable resource