Skip to content

[Swift][Breaking]: Make the checkout appearance own its native colors - #970

Open
kieran-osgood-shopify wants to merge 1 commit into
mainfrom
kieran-osgood/swift-appearance-colors
Open

kieran-osgood-shopify wants to merge 1 commit into
mainfrom
kieran-osgood/swift-appearance-colors

Conversation

@kieran-osgood-shopify

Copy link
Copy Markdown
Contributor

What changes are you making?

Part of https://github.com/shop/issues-checkout-kit/issues/1260

Checkout colors in the Swift SDK now belong to the appearance, matching the Android SDK's CheckoutAppearance / ColorScheme / Colors model. Before, colors were separate global settings (tintColor, backgroundColor, closeButtonTintColor). Changing the appearance kept whatever colors were set before it, so a checkout could show the background of an earlier scheme.

  • CheckoutAppearance (.app(ColorScheme) / .storefront(colors:)) replaces Configuration.Appearance.
  • ColorScheme (.light(colors:) / .dark(colors:) / .automatic(lightColors:darkColors:)) replaces Configuration.ColorScheme.
  • Colors holds webViewBackground, headerBackground, headerFont, progressIndicator, closeIcon, closeIconTint and headerBorderColor, the same fields Android has (Android also has dragHandleColor).
  • Assigning an appearance replaces its colors, so .app(.automatic()) after .app(.dark(...)) uses the automatic defaults.
  • On automatic, the header, title, close button, progress bar and WebView background update when the system appearance changes while checkout is open. storefront keeps the checkout light.
  • The ShopifyCheckout SwiftUI .appearance(...) modifier stays instance-scoped, and a reused preloaded WebView takes the colors of the checkout presenting it.

Breaking: Configuration.tintColor, backgroundColor and closeButtonTintColor, plus the SwiftUI .tintColor, .backgroundColor and .closeButtonTintColor modifiers, are removed. platforms/swift/README.md has the migration notes.

The React Native bridge that uses this API is #597.

How to test

Run the Swift sample app (CheckoutKitSwiftDemo) on a simulator, add an item to the cart, and use Settings → Theme to pick the appearance. Toggle the system appearance with ⌘⇧A.

GIVEN the appearance is set to App dark

AND the system appearance is light

WHEN the reviewer opens checkout from the cart

THEN the header, title, close button and WebView background should all be dark


GIVEN the appearance was App dark and is then changed to App automatic

AND the system appearance is light

WHEN the reviewer opens checkout from the cart

THEN checkout should be fully light, with no dark background left over from App dark


GIVEN the appearance is set to App automatic

AND checkout is open with the system appearance light

WHEN the reviewer switches the system appearance to dark

THEN the header, title, close button and WebView background should switch to dark without reopening checkout


GIVEN the appearance is set to Storefront

AND the system appearance is dark

WHEN the reviewer opens checkout from the cart

THEN checkout should stay light and show the storefront's branding


Before you merge

Important

  • I've added tests to support my implementation
  • I have read and agree with the Contribution Guidelines
  • I have read and agree with the Code of Conduct
  • I've updated the relevant platform README (platforms/swift/README.md and/or platforms/android/README.md)

Assisted-By: devx/6076b771-cb74-4665-935f-816eba5058f0
@kieran-osgood-shopify
kieran-osgood-shopify requested a review from a team as a code owner October 9, 2026 16:43
@github-actions github-actions Bot added the #gsd:50662 Rebase Checkout Kit on UCP label Oct 9, 2026
@github-actions

github-actions Bot commented Oct 9, 2026

Copy link
Copy Markdown

Bundle Size Budgets

Budget Size Limits Result
— — — ➖ No configured budgets affected

Bundle and package size

Web bundle sizes cover shipped runtime JavaScript. Package sizes cover the full published archive, including any source maps, declarations, and documentation it contains.

Platform Measurement Compression Base Head Delta
- - - - - -
How sizes are measured

Measured from the PR base SHA and PR head SHA. Web bundle rows sum shipped .js, .mjs, and .cjs files under dist/, excluding source maps and declarations. The gzip bundle size sums files compressed individually with gzip -n -9. npm package sizes are gzip-compressed .tgz archives; Android AAR sizes are ZIP archives. Package sizes are not final app binary sizes.

@bitrise

bitrise Bot commented Oct 9, 2026

Copy link
Copy Markdown

Bitrise builds

E2E · iOS CI

Install this build

Open Tophat, select your target device, then click Install. Links open on the Mac running Tophat.

SDK Install
Swift Install with Tophat

Checkout Kit E2E results

Status Tags Target Platform OS version tag Device
✅ launch, checkout-presentation, checkout-completion, buyer-identity, preload swift ios latest iPhone 15
iOS 27 Beta

@kieran-osgood-shopify
kieran-osgood-shopify added this pull request to stack #971 October 9, 2026 20:42

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

#gsd:50662 Rebase Checkout Kit on UCP

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant