docs(code-block): add inline documentation by bennypowers · Pull Request #2744 · RedHat-UX/red-hat-design-system

bennypowers · 2025-11-12T18:00:52Z

Added documentation for converter methods and CSS custom properties.

⚠️ LLM-Assisted: Reviewers should verify semantic meaning.

Added comprehensive documentation for rh-code-block component: - Documented `fromAttribute()` converter method - Converts attribute string to array of action names, splitting on spaces/commas - Documented `toAttribute()` converter method - Converts array to space-separated attribute string - Added `--rh-code-block-callout-size` CSS property documentation for line highlight indicator sizing - Added `--rh-code-block-border-block-start-width` CSS property documentation for top border width Note: fromAttribute() and toAttribute() are property converter methods, not public API methods. They handle conversion between attribute and property values internally. Closes #2495 🤖 Generated with [Claude Code](https://claude.com/claude-code) Assisted-By: Claude <[email protected]>

changeset-bot · 2025-11-12T18:00:56Z

⚠️ No Changeset found

Latest commit: d443c0d

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

netlify · 2025-11-12T18:01:25Z

❌ Deploy Preview for red-hat-design-system failed. Why did it fail? →

Name	Link
🔨 Latest commit	`d443c0d`
🔍 Latest deploy log	https://app.netlify.com/projects/red-hat-design-system/deploys/6914cb576af6850008391f4a

github-actions · 2025-11-12T18:02:23Z

Size Change: +321 B (+0.12%)

Total Size: 257 kB

Filename	Size	Change
`./elements/rh-code-block/rh-code-block.js`	8.7 kB	+321 B (+3.83%)

ℹ️ View Unchanged

Filename	Size
`./elements.js`	611 B
`./elements/rh-accordion/context.js`	162 B
`./elements/rh-accordion/rh-accordion-header.js`	2.7 kB
`./elements/rh-accordion/rh-accordion-panel.js`	1.27 kB
`./elements/rh-accordion/rh-accordion.js`	3.35 kB
`./elements/rh-alert/rh-alert.js`	5.06 kB
`./elements/rh-announcement/rh-announcement.js`	2.17 kB
`./elements/rh-audio-player/rh-audio-player-about.js`	1.83 kB
`./elements/rh-audio-player/rh-audio-player-rate-stepper.js`	1.76 kB
`./elements/rh-audio-player/rh-audio-player-scrolling-text-overflow.js`	1.47 kB
`./elements/rh-audio-player/rh-audio-player-subscribe.js`	1.41 kB
`./elements/rh-audio-player/rh-audio-player.js`	12.4 kB
`./elements/rh-audio-player/rh-cue.js`	1.95 kB
`./elements/rh-audio-player/rh-transcript.js`	2.68 kB
`./elements/rh-avatar/random-pattern-controller.js`	2.72 kB
`./elements/rh-avatar/rh-avatar.js`	2.68 kB
`./elements/rh-back-to-top/rh-back-to-top.js`	1.98 kB
`./elements/rh-badge/rh-badge.js`	1.63 kB
`./elements/rh-blockquote/rh-blockquote.js`	1.38 kB
`./elements/rh-breadcrumb/rh-breadcrumb.js`	1.67 kB
`./elements/rh-button/rh-button.js`	3.34 kB
`./elements/rh-card/rh-card.js`	3.12 kB
`./elements/rh-chip/context.js`	165 B
`./elements/rh-chip/rh-chip-group.js`	1.58 kB
`./elements/rh-chip/rh-chip.js`	2.06 kB
`./elements/rh-code-block/prism.css.js`	667 B
`./elements/rh-code-block/prism.js`	572 B
`./elements/rh-cta/rh-cta.js`	3.71 kB
`./elements/rh-dialog/rh-dialog.js`	4.72 kB
`./elements/rh-dialog/yt-api.js`	617 B
`./elements/rh-disclosure/rh-disclosure.js`	2.52 kB
`./elements/rh-footer/rh-footer-block.js`	714 B
`./elements/rh-footer/rh-footer-copyright.js`	357 B
`./elements/rh-footer/rh-footer-links.js`	1.1 kB
`./elements/rh-footer/rh-footer-social-link.js`	1.04 kB
`./elements/rh-footer/rh-footer-universal.js`	4 kB
`./elements/rh-footer/rh-footer.js`	4.67 kB
`./elements/rh-health-index/rh-health-index.js`	2.12 kB
`./elements/rh-icon/rh-icon.js`	2.49 kB
`./elements/rh-icon/ssr.js`	181 B
`./elements/rh-jump-links/context.js`	179 B
`./elements/rh-jump-links/rh-jump-link.js`	1.49 kB
`./elements/rh-jump-links/rh-jump-links-list.js`	1.17 kB
`./elements/rh-jump-links/rh-jump-links.js`	2.37 kB
`./elements/rh-menu-dropdown/rh-menu-dropdown.js`	4.12 kB
`./elements/rh-menu/rh-menu-item-group.js`	614 B
`./elements/rh-menu/rh-menu-item.js`	2.2 kB
`./elements/rh-menu/rh-menu.js`	1.6 kB
`./elements/rh-navigation-link/rh-navigation-link.js`	1.87 kB
`./elements/rh-navigation-primary/context.js`	176 B
`./elements/rh-navigation-primary/rh-navigation-primary-item-menu.js`	1.03 kB
`./elements/rh-navigation-primary/rh-navigation-primary-item.js`	3.44 kB
`./elements/rh-navigation-primary/rh-navigation-primary-overlay.js`	534 B
`./elements/rh-navigation-primary/rh-navigation-primary.js`	7.63 kB
`./elements/rh-navigation-secondary/rh-navigation-secondary-dropdown.js`	2.57 kB
`./elements/rh-navigation-secondary/rh-navigation-secondary-menu-section.js`	1.31 kB
`./elements/rh-navigation-secondary/rh-navigation-secondary-menu.js`	1.68 kB
`./elements/rh-navigation-secondary/rh-navigation-secondary-overlay.js`	562 B
`./elements/rh-navigation-secondary/rh-navigation-secondary.js`	5.23 kB
`./elements/rh-navigation-secondary/test/fixtures.js`	769 B
`./elements/rh-navigation-vertical/rh-navigation-vertical-list.js`	2.24 kB
`./elements/rh-navigation-vertical/rh-navigation-vertical.js`	1.54 kB
`./elements/rh-pagination/rh-pagination.js`	5.69 kB
`./elements/rh-progress-stepper/context.js`	187 B
`./elements/rh-progress-stepper/rh-progress-step.js`	3.02 kB
`./elements/rh-progress-stepper/rh-progress-stepper.js`	4.78 kB
`./elements/rh-scheme-toggle/rh-scheme-toggle.js`	1.91 kB
`./elements/rh-site-status/rh-site-status.js`	2.44 kB
`./elements/rh-skeleton/rh-skeleton.js`	677 B
`./elements/rh-skip-link/rh-skip-link.js`	1.33 kB
`./elements/rh-spinner/rh-spinner.js`	1.31 kB
`./elements/rh-stat/rh-stat.js`	2.05 kB
`./elements/rh-subnav/rh-subnav.js`	2.98 kB
`./elements/rh-surface/rh-surface.js`	911 B
`./elements/rh-surface/test/elements.js`	763 B
`./elements/rh-switch/rh-switch.js`	2.89 kB
`./elements/rh-table/rh-sort-button.js`	1.39 kB
`./elements/rh-table/rh-table.js`	2.81 kB
`./elements/rh-tabs/context.js`	226 B
`./elements/rh-tabs/rh-tab-panel.js`	1 kB
`./elements/rh-tabs/rh-tab.js`	2.83 kB
`./elements/rh-tabs/rh-tabs.js`	3.64 kB
`./elements/rh-tag/rh-tag.js`	2.96 kB
`./elements/rh-tile/rh-tile-group.js`	1.78 kB
`./elements/rh-tile/rh-tile.js`	4.7 kB
`./elements/rh-timestamp/rh-timestamp.js`	991 B
`./elements/rh-tooltip/rh-tooltip.js`	3.15 kB
`./elements/rh-video-embed/rh-video-embed.js`	4.64 kB
`./lib/color-palettes.js`	851 B
`./lib/context/headings/consumer.js`	593 B
`./lib/context/headings/provider.js`	1.2 kB
`./lib/elements/rh-context-demo/rh-context-demo.js`	1.16 kB
`./lib/elements/rh-context-picker/rh-context-picker.js`	2.18 kB
`./lib/environment.js`	194 B
`./lib/functions.js`	175 B
`./lib/I18nController.js`	1.37 kB
`./lib/ScreenSizeController.js`	876 B
`./lib/ssr-controller.js`	201 B
`./lib/themable.js`	549 B
`./react/rh-accordion/rh-accordion-header.js`	199 B
`./react/rh-accordion/rh-accordion-panel.js`	185 B
`./react/rh-accordion/rh-accordion.js`	202 B
`./react/rh-alert/rh-alert.js`	184 B
`./react/rh-announcement/rh-announcement.js`	189 B
`./react/rh-audio-player/rh-audio-player-about.js`	191 B
`./react/rh-audio-player/rh-audio-player-rate-stepper.js`	199 B
`./react/rh-audio-player/rh-audio-player-scrolling-text-overflow.js`	214 B
`./react/rh-audio-player/rh-audio-player-subscribe.js`	196 B
`./react/rh-audio-player/rh-audio-player.js`	183 B
`./react/rh-audio-player/rh-cue.js`	195 B
`./react/rh-audio-player/rh-transcript.js`	187 B
`./react/rh-avatar/rh-avatar.js`	173 B
`./react/rh-back-to-top/rh-back-to-top.js`	183 B
`./react/rh-badge/rh-badge.js`	174 B
`./react/rh-blockquote/rh-blockquote.js`	179 B
`./react/rh-breadcrumb/rh-breadcrumb.js`	179 B
`./react/rh-button/rh-button.js`	174 B
`./react/rh-card/rh-card.js`	172 B
`./react/rh-chip/rh-chip-group.js`	182 B
`./react/rh-chip/rh-chip.js`	187 B
`./react/rh-code-block/rh-code-block.js`	193 B
`./react/rh-cta/rh-cta.js`	170 B
`./react/rh-dialog/rh-dialog.js`	203 B
`./react/rh-disclosure/rh-disclosure.js`	192 B
`./react/rh-footer/rh-footer-block.js`	184 B
`./react/rh-footer/rh-footer-copyright.js`	187 B
`./react/rh-footer/rh-footer-links.js`	185 B
`./react/rh-footer/rh-footer-social-link.js`	193 B
`./react/rh-footer/rh-footer-universal.js`	188 B
`./react/rh-footer/rh-footer.js`	174 B
`./react/rh-health-index/rh-health-index.js`	184 B
`./react/rh-icon/rh-icon.js`	195 B
`./react/rh-jump-links/rh-jump-link.js`	183 B
`./react/rh-jump-links/rh-jump-links-list.js`	189 B
`./react/rh-jump-links/rh-jump-links.js`	195 B
`./react/rh-menu-dropdown/rh-menu-dropdown.js`	185 B
`./react/rh-menu/rh-menu-item-group.js`	190 B
`./react/rh-menu/rh-menu-item.js`	181 B
`./react/rh-menu/rh-menu.js`	173 B
`./react/rh-navigation-link/rh-navigation-link.js`	186 B
`./react/rh-navigation-primary/rh-navigation-primary-item-menu.js`	205 B
`./react/rh-navigation-primary/rh-navigation-primary-item.js`	198 B
`./react/rh-navigation-primary/rh-navigation-primary-overlay.js`	199 B
`./react/rh-navigation-primary/rh-navigation-primary.js`	189 B
`./react/rh-navigation-secondary/rh-navigation-secondary-dropdown.js`	217 B
`./react/rh-navigation-secondary/rh-navigation-secondary-menu-section.js`	205 B
`./react/rh-navigation-secondary/rh-navigation-secondary-menu.js`	199 B
`./react/rh-navigation-secondary/rh-navigation-secondary-overlay.js`	201 B
`./react/rh-navigation-secondary/rh-navigation-secondary.js`	213 B
`./react/rh-navigation-vertical/rh-navigation-vertical-list.js`	198 B
`./react/rh-navigation-vertical/rh-navigation-vertical.js`	189 B
`./react/rh-pagination/rh-pagination.js`	178 B
`./react/rh-progress-stepper/rh-progress-step.js`	196 B
`./react/rh-progress-stepper/rh-progress-stepper.js`	186 B
`./react/rh-scheme-toggle/rh-scheme-toggle.js`	183 B
`./react/rh-site-status/rh-site-status.js`	181 B
`./react/rh-skeleton/rh-skeleton.js`	176 B
`./react/rh-skip-link/rh-skip-link.js`	181 B
`./react/rh-spinner/rh-spinner.js`	175 B
`./react/rh-stat/rh-stat.js`	171 B
`./react/rh-subnav/rh-subnav.js`	175 B
`./react/rh-surface/rh-surface.js`	175 B
`./react/rh-switch/rh-switch.js`	174 B
`./react/rh-table/rh-sort-button.js`	200 B
`./react/rh-table/rh-table.js`	174 B
`./react/rh-tabs/rh-tab-panel.js`	181 B
`./react/rh-tabs/rh-tab.js`	187 B
`./react/rh-tabs/rh-tabs.js`	174 B
`./react/rh-tag/rh-tag.js`	182 B
`./react/rh-tile/rh-tile-group.js`	183 B
`./react/rh-tile/rh-tile.js`	181 B
`./react/rh-timestamp/rh-timestamp.js`	176 B
`./react/rh-tooltip/rh-tooltip.js`	175 B
`./react/rh-video-embed/rh-video-embed.js`	227 B
`./uxdot/ssr-failure-recoverable.js`	581 B
`./uxdot/uxdot-best-practice.js`	812 B
`./uxdot/uxdot-copy-button.js`	1.24 kB
`./uxdot/uxdot-copy-permalink.js`	1.14 kB
`./uxdot/uxdot-demo.js`	2.74 kB
`./uxdot/uxdot-example.js`	1.14 kB
`./uxdot/uxdot-feedback.js`	882 B
`./uxdot/uxdot-header.js`	886 B
`./uxdot/uxdot-knob-attribute.js`	3.63 kB
`./uxdot/uxdot-masthead.js`	1.36 kB
`./uxdot/uxdot-pattern-ssr-controller-client.js`	615 B
`./uxdot/uxdot-pattern-ssr-controller-server.js`	1.72 kB
`./uxdot/uxdot-pattern-ssr-controller.js`	213 B
`./uxdot/uxdot-pattern.js`	2.38 kB
`./uxdot/uxdot-repo-status-checklist.js`	1.39 kB
`./uxdot/uxdot-repo-status-list.js`	1.24 kB
`./uxdot/uxdot-repo.js`	867 B
`./uxdot/uxdot-sidenav.js`	2.04 kB
`./uxdot/uxdot-spacer-tokens-table.js`	2.46 kB
`./uxdot/uxdot-toc.js`	1.8 kB

_{compressed-size-action}

github-project-automation bot added this to Red Hat Design System Nov 12, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

docs(code-block): add inline documentation#2744

docs(code-block): add inline documentation#2744
bennypowers wants to merge 1 commit intomainfrom
docs/code-block-inline-docs

bennypowers commented Nov 12, 2025

Uh oh!

changeset-bot bot commented Nov 12, 2025

Uh oh!

netlify bot commented Nov 12, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Nov 12, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

bennypowers commented Nov 12, 2025

Uh oh!

changeset-bot bot commented Nov 12, 2025

⚠️ No Changeset found

Uh oh!

netlify bot commented Nov 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

❌ Deploy Preview for red-hat-design-system failed. Why did it fail? →

Uh oh!

github-actions bot commented Nov 12, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

netlify bot commented Nov 12, 2025 •

edited

Loading