Skip to content

Convert AZ Cards to be a SDC#5409

Draft
djcelaya wants to merge 6 commits intomainfrom
card-sdc
Draft

Convert AZ Cards to be a SDC#5409
djcelaya wants to merge 6 commits intomainfrom
card-sdc

Conversation

@djcelaya
Copy link
Copy Markdown
Contributor

@djcelaya djcelaya commented Mar 12, 2026

See #5405.

Summary

This PR introduces Single Directory Components for both layers of card rendering:

  • az_card is now the item-level SDC for an individual card
  • az_cards is now a paragraph-level SDC that composes the az_card SDC for each item in the deck

The az_card theme hook remains as a presenter layer, so existing formatter and widget preview paths continue to work without a broader PHP refactor. The new az_cards paragraph template now acts as the paragraph-level presenter, making deck title rendering and title color explicit while composing the existing rendered card collection.

This PR also adopts a hybrid asset-packaging approach for card assets:

  • front-end card CSS is colocated with the az_card component
  • the no-follow JavaScript is colocated with the az_card component
  • widget/admin CSS remains outside the component because it styles the field widget, not rendered card output
  • assets still load through existing library definitions and formatter attachment logic, so conditional loading is preserved

What changed

  • Added an az_card SDC for individual card markup and metadata
  • Updated the existing az_card Twig template to act as a presenter that includes the component
  • Added an az_cards paragraph-level SDC for deck/title composition
  • Added a bundle-specific az_cards paragraph presenter template that includes the new paragraph component
  • Kept the existing az_card_default formatter as the item renderer in this first phase
  • Made paragraph title rendering and deck title color explicit in the paragraph-level component path
  • Moved front-end card CSS into the az_card component directory
  • Moved the no-follow JavaScript into the az_card component directory
  • Updated library paths to point at the colocated component assets
  • Left widget styling and existing conditional library attachment behavior unchanged

Why

This is a staged SDC migration for cards.

The first step was to make the shared az_card rendering layer a component without rewriting the formatter. The next step, included here, was to give the az_cards paragraph bundle its own component boundary so the paragraph can explicitly own deck-level composition concerns such as wrapper/title rendering while continuing to compose the existing card item renderer.

The asset-packaging decision was also intentional: assets are now closer to the component they belong to, but loading behavior is still controlled by the existing library and formatter flow instead of switching to always-on component metadata assets.

Scope notes

This PR makes az_cards a paragraph-level SDC composition layer, but it does not fully move all deck/grid responsibility out of AZCardDefaultFormatter yet. In this first phase, the formatter still provides the rendered card collection, and the new az_cards component wraps and composes that output.

Testing

  • lando drush cr
  • lando phpstan
  • lando eslint .
  • Rendered az_card directly via drush php:eval to verify component-backed output
  • Verified Drupal library discovery resolves the moved CSS and JS asset paths from the component directory
  • Rendered a real az_cards paragraph and confirmed both component markers are present:
    • az_paragraphs_cards:az-cards
    • az_card:az-card
  • Verified preview mode still hides the deck title

@djcelaya djcelaya self-assigned this Mar 12, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant