Skip to content

Rename component -desc classes to -body (#668) - #1140

Draft
stephaniehobson wants to merge 1 commit into
v23/heading-template-varsfrom
v23/desc-to-body
Draft

stephaniehobson wants to merge 1 commit into
v23/heading-template-varsfrom
v23/desc-to-body

Conversation

@stephaniehobson

Copy link
Copy Markdown
Contributor

Description

Finishes goal 2 of #1084 — Picto already used desc/body naming as the reference implementation; this brings Billboard, Callout, Card, and Menu Item in line with it.

mzp-c-callout-descmzp-c-callout-body
mzp-c-card-descmzp-c-card-body
mzp-c-menu-item-descmzp-c-menu-item-body
mzp-c-billboard-descmzp-c-billboard-body

Clean break, no aliases, matching the previous commit's approach.

Found and fixed a second pre-existing bug while at it: three render('@menu-item', ...) calls in navigation/02-menu/menu.html passed a description: key, but menu-item.html's actual parameter has always been desc (now body) — never description. The menu-item demo's body paragraph has been silently blank since this was written. Fixed as part of this rename.

Also added the CHANGELOG.md/migration guide entries covering both this rename and the previous commit's title→heading component classes (neither had one yet).

  • I have documented this change in the design system.
  • I have recorded this change in CHANGELOG.md.

Issue

#668

Testing

npm run lint, npm test (47 specs, Firefox + Chrome), npm run build-docs (523 items, no errors), npm run build-package all pass.

@stephaniehobson
stephaniehobson added this pull request to stack #1151 September 11, 2026 21:44
Finishes goal 2 of #1084 -- Picto already used desc/body naming as
the reference implementation; this brings Billboard, Callout, Card,
and Menu Item in line with it.

  mzp-c-callout-desc    -> mzp-c-callout-body
  mzp-c-card-desc       -> mzp-c-card-body
  mzp-c-menu-item-desc  -> mzp-c-menu-item-body
  mzp-c-billboard-desc  -> mzp-c-billboard-body

Clean break, no aliases, matching C1's approach.

Renamed carefully rather than with a blanket sed: "desc" is a
substring of "description", which appears throughout the surrounding
prose in every one of these config.yml/readme files, so a naive
s/desc/body/g would have corrupted every "description"/"descriptions"
into "bodyription"/"bodyriptions". Used anchored patterns instead --
^\s*desc: for YAML keys, exact {{ desc }}/{% if desc %} substrings for
template vars, and literal class-name strings -- verified after each
file that no "description" text was touched.

Left assets/js/protocol/newsletter.js and tests/unit/newsletter.js
alone -- their "desc" is a Basket API response field, unrelated.

Found and fixed a second pre-existing bug while at it: three
render('@menu-item', ...) calls in navigation/02-menu/menu.html passed
a "description:" key, but menu-item.html's actual parameter has always
been "desc" (now "body") -- never "description". The menu-item demo's
body paragraph has been silently blank since this was written.
Renaming those calls to "body:" (matching the component's real param)
fixes it -- confirmed in the built docs output. Same root cause and
fix shape as the Picto bug found in the previous commit.

Also fixed docs/03-contributing/02-naming.md's worked example, which
still used mzp-c-card-desc, and added CHANGELOG/migration.md entries
covering both this rename and the previous commit's title-to-heading
component classes (neither had one yet -- that PR is already open as
a draft, so rather than rewrite that pushed commit's history I've
consolidated both into one Component Naming section here).

Stacked on v23/heading-template-vars. Part of #1084.

Verified: npm run lint, npm test (47 specs, Firefox + Chrome), a
direct sass --verbose compile (confirmed 4 -body classes present, 0
-desc classes remain in the compiled output), npm run build-docs (523
items, no errors -- confirmed Card/Callout/Billboard/Card-Layout
render body content, and the menu-item bug fix specifically), and npm
run build-package all pass.

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟢 Approval recommended

The renames and call-site updates are consistent across templates/Sass/docs, with only a minor changelog grammar nit noted.

Pull request overview

This PR completes the “desc → body” naming alignment across Protocol components by renaming the remaining *-desc component classes to *-body (matching the Picto convention), updating corresponding template parameters/contexts, and documenting the breaking change for consumers.

Changes:

  • Renamed component classes from mzp-c-*-desc to mzp-c-*-body for Billboard, Callout, Card, and Menu Item across templates and Sass.
  • Updated component template APIs/examples to use body (and fixed Menu demo rendering that previously passed an unused description key).
  • Added migration-guide and changelog entries to document the breaking rename and provide find/replace scripts.
File summaries
File Description
docs/03-contributing/02-naming.md Updates the naming example to use mzp-c-card-body.
docs/02-usage/migration.md Documents the -desc-body rename and adds sed scripts for migration.
components/navigation/03-menu-item/menu-item.html Renames the Menu Item template parameter and class to body / mzp-c-menu-item-body.
components/navigation/03-menu-item/menu-item.config.yml Updates component context key from desc to body.
components/navigation/02-menu/menu.html Fixes demo renders to pass body (and corrects the previously ignored description key).
components/layout/03-card-layout/card-layout.html Updates Card render contexts to use body.
components/layout/03-card-layout/04-card-layout--hero.html Updates Card render contexts to use body.
components/layout/03-card-layout/03-card-layout--quarter.html Updates Card render contexts to use body.
components/layout/03-card-layout/02-card-layout--third.html Updates Card render contexts to use body.
components/card/card.html Renames Card template parameter/class to body / mzp-c-card-body.
components/card/card.config.yml Updates Card example contexts to use body.
components/callout/callout.html Renames Callout template parameter/class to body / mzp-c-callout-body.
components/callout/callout.config.yml Updates Callout example contexts to use body.
components/callout/callout--example.html Updates Callout example markup to mzp-c-callout-body.
components/billboard/billboard.html Renames Billboard template parameter/class to body / mzp-c-billboard-body.
components/billboard/billboard.config.yml Updates Billboard example context key to body.
CHANGELOG.md Adds a “Component Naming” section documenting the breaking renames (title→heading and desc→body).
assets/sass/protocol/components/_menu-item.scss Renames the Menu Item desc selector to .mzp-c-menu-item-body.
assets/sass/protocol/components/_card.scss Renames Card desc selectors to .mzp-c-card-body.
assets/sass/protocol/components/_callout.scss Renames Callout desc selectors to .mzp-c-callout-body and updates related combinators.
Review details
  • Files reviewed: 20/20 changed files
  • Comments generated: 1
  • Review effort level: Lite

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment thread CHANGELOG.md

### Component Naming

* (breaking) Renamed the remaining `-title`/`-subtitle` component classes to `-heading`/`-subheading`, finishing the rename the Typography section above started for mixins/utility classes/CSS vars. Affects Article, Billboard, Callout, Card, Form, Menu, Menu Item, Menu List, Newsletter, Sidebar Menu, and Sticky Promo (#668):
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.

2 participants