Skip to content

feat(react-card): add layout prop to CardPreview and and expose Card orientation/size#36310

Draft
GianoglioEnrico wants to merge 1 commit into
microsoft:masterfrom
GianoglioEnrico:feat/cap-visual-refresh-card
Draft

feat(react-card): add layout prop to CardPreview and and expose Card orientation/size#36310
GianoglioEnrico wants to merge 1 commit into
microsoft:masterfrom
GianoglioEnrico:feat/cap-visual-refresh-card

Conversation

@GianoglioEnrico

Copy link
Copy Markdown
Contributor

Overview

This PR introduces a new layout?: 'full' | 'contained' prop on CardPreview and exposes the parent Card's orientation and size through CardContextValue, so descendants and external theme libraries (e.g. fluentui-contrib/react-cap-theme) can adapt styling without re-implementing the component hooks.

@github-actions

Copy link
Copy Markdown

Pull request demo site: URL

@@ -27,20 +27,20 @@ export type CardBaseState = Omit<CardState, 'appearance' | 'orientation' | 'size
export const cardClassNames: SlotClassNames<CardSlots>;

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

🕵🏾‍♀️ visual changes to review in the Visual Change Report

vr-tests-react-components/Menu Converged - submenuIndicator slotted content 1 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/Menu Converged - submenuIndicator slotted content.default.submenus open.chromium.png 413 Changed
vr-tests-react-components/Positioning 2 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/Positioning.Positioning end.chromium.png 957 Changed
vr-tests-react-components/Positioning.Positioning end.updated 2 times.chromium.png 509 Changed
vr-tests-react-components/ProgressBar converged 2 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/ProgressBar converged.Indeterminate + thickness.default.chromium.png 27 Changed
vr-tests-react-components/ProgressBar converged.Indeterminate + thickness - High Contrast.default.chromium.png 47 Changed
vr-tests-react-components/TagPicker 1 screenshots
Image Name Diff(in Pixels) Image Type
vr-tests-react-components/TagPicker.disabled.disabled input hover.chromium.png 677 Changed

There were 1 duplicate changes discarded. Check the build logs for more information.

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

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant