# Card — WordPress Mapping Audit (v3.5.3 Phase 1) > **Status**: Phase 1 WordPress mapping body authored. Implementation not started. > **Component**: Card #9 > **Companion docs**: `CARD-SPEC-AUDIT.md`, `CARD-MEASUREMENT-AUDIT.md` --- ## §1 — Critical Framing Card is the first Wave 1 component with an existing WordPress block bridge before module implementation. Current public bridge: ```txt blocks.css §8: .wp-block-group.is-style-card-filled .wp-block-group.is-style-card-elevated .wp-block-group.is-style-card-outlined ``` Framework classification: ```txt CURRENT partial bridge. ``` Reason: ```txt PUBLIC-SURFACE-CHARTER §3.4 and PROMOTION-CRITERIA §4 classify register_block_style() / block style variations as theme-can territory. ``` This mapping audit does not propose the bridge; it audits what already exists. --- ## §2 — Core / Block Context Inventory | Surface | Card relevance | Phase 1 mapping | |---|---|---| | `core/group` | Primary existing bridge. Group can act as visual card container. | CURRENT partial via `.is-style-card-*`. | | `core/columns` | Layout wrapper around multiple cards. | Layout context, not Card primitive. | | `core/row` | Horizontal layout wrapper around cards/actions. | Layout context, not Card primitive. | | `core/media-text` | Related media/content pattern. | Adjacent pattern, not Card primitive. | | `core/query` / post template | Common card-like post listings. | Pattern/composition layer; may consume Card styles. | | `core/buttons` / `core/button` | Nested actions in `.card__actions`. | Use Button audit contract. | | Editor custom block | Dynamic cards / data-bound cards. | Plugin/custom-block territory. | --- ## §3 — Current Bridge Inventory Existing selectors: ```txt .wp-block-group.is-style-card-filled .wp-block-group.is-style-card-elevated .wp-block-group.is-style-card-outlined ``` What the bridge covers: ```txt visual chrome: filled elevated outlined theme-side style variation: core/group can be rendered as a Card-like container. ``` What the bridge does not cover: ```txt interactive semantics media/title/subtitle/actions slots disabled split dynamic behavior custom editor UI registration documentation ``` Known comment drift: ```txt blocks.css says `.ax-card` and components.css §3. Actual Card baseline is `.card` in components.css §5. ``` Disposition: ```txt Record only in Phase 1. Do not edit blocks.css. ``` --- ## §4 — Card Semantics Decision Tree ```txt Is the card just content? Use
,
, or
depending the document context. Does the whole card trigger an action? Use ``` Use when the whole card is an action and should be disabled by platform behavior. ### §7.3 — Plugin-Managed aria-disabled Action Card ```html ``` Required caveat: ```txt aria-disabled does not block activation. Plugin/app code must guard click, keyboard, and submit behavior. ``` --- ## §8 — Ripple And State-Layer Mapping Base Card: ```txt ripple/ = NONE ``` Interactive/action Card: ```txt ripple/ = CANDIDATE ``` Mapping implication: ```txt Do not wire current lab ripple to WordPress Card surfaces. If Ripple v2 later adopts Card action surfaces, it should handle Button, Icon button, Card, and other consumers together. ``` State-layer: ```txt Interactive Card may use `.has-state-layer` from components.css §0. This is static CSS state-layer foundation, not animated ripple. ``` --- ## §9 — Anti-Pattern Inventory | Anti-pattern | Why it is wrong | |---|---| | `
` for whole-card action | Recreates native button behavior badly. | | Clickable `
` | Not keyboard/native accessible as a control. | | `` for non-navigation action | Links navigate; actions need buttons. | | `