Skip to content

Conversation

xiaogliu
Copy link
Contributor

If using BpkBreakpoint in an SSR page may cause re-flow, this PR highlights this impact in the readme so that users can use it more correctly.

Remember to include the following changes:

  • Ensure the PR title includes the name of the component you are changing so it's clear in the release notes for consumers of the changes in the version e.g [Clover-123][BpkButton] Updating the colour
  • README.md (If you have created a new component)
  • Component README.md
  • Tests
  • Accessibility tests
    • The following checks were performed:
      • Ability to navigate using a keyboard only
      • Zoom functionality (Deque University explanation):
        • The page SHOULD be functional AND readable when only the text is magnified to 200% of its initial size
        • Pages must reflow as zoom increases up to 400% so that content continues to be presented in only one column i.e. Content MUST NOT require scrolling in two directions (both vertically and horizontally)
      • Ability to navigate using a screen reader only
  • Storybook examples created/updated
  • For breaking changes or deprecating components/properties, migration guides added to the description of the PR. If the guide has large changes, consider creating a new Markdown page inside the component's docs folder and link it here

@Copilot Copilot AI review requested due to automatic review settings August 14, 2025 09:22
@xiaogliu xiaogliu added the patch Patch production bug label Aug 14, 2025
Copy link
Contributor

@Copilot Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull Request Overview

This PR updates the BpkBreakpoint component's README to highlight potential reflow issues when using the component in server-side rendering (SSR) environments. The change aims to warn developers about user experience impacts that can occur during client-side hydration.

  • Expanded the warning about SSR mismatch to include reflow consequences
  • Added guidance about careful consideration for critical UI areas

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

@skyscanner-backpack-bot
Copy link

Visit https://backpack.github.io/storybook-prs/3910 to see this build running in a browser.

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
@skyscanner-backpack-bot
Copy link

Visit https://backpack.github.io/storybook-prs/3910 to see this build running in a browser.

@xiaogliu xiaogliu merged commit 7ca85fc into main Aug 15, 2025
10 checks passed
@xiaogliu xiaogliu deleted the CLOV-381-update-bpk-breakpoint-readme branch August 15, 2025 10:02
gert-janvercauteren added a commit that referenced this pull request Aug 26, 2025
* main:
  Bump actions/download-artifact in the artifacts-actions group (#3907)
  Bump actions/checkout from 4 to 5 (#3913)
  Fix closeText style of BpkModal in dark mode (#3919)
  Bump the babel group across 1 directory with 5 updates (#3917)
  Bump @babel/runtime in the npm_and_yarn group across 1 directory (#3884)
  Bump actions/cache from 4.2.3 to 4.2.4 (#3905)
  Bump webpack from 5.99.8 to 5.101.2 (#3916)
  QUAR-1046 Fix CTA Button Alignment, Logo Sizing, and Logo Vertical Alignment in Inset Banner (#3912)
  chore: removed duplicate aria-label (#3911)
  [CAPY-1594][BpkNavigationTabGroup/BpkBubble] Create and integrate 'new' bubble tooltip in navigation tab bar (#3909)
  [CLOV-381][BpkBreakpoint] update bpk breakpoint readme (#3910)
  [CYB-3904][BpkGraphicPromo] Render wrapper as semantic anchor tag to improve SEO (#3904)
  [CLOVER-532][BpkText] Add BpkText color prop with leverage css classname (#3900)
  fix: A11y and icon issue for inset banner sponsored (#3901)

# Conflicts:
#	packages/bpk-component-text/README.md
#	packages/bpk-component-text/src/BpkText-test.tsx
#	packages/bpk-component-text/src/BpkText.tsx
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
patch Patch production bug
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants