From 63f89f8195c4f6598cb78981ddd68e419da3a5e4 Mon Sep 17 00:00:00 2001 From: Aaron Reisman Date: Tue, 16 Jun 2026 21:07:25 +0700 Subject: [PATCH 1/3] docs: state the browser-support baseline + browserslist MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit propel never declared which browsers it targets, yet its color tokens use `oklch()` and `color-mix()` and it's built on Tailwind v4 — all of which set a hard floor. Per MDN's compat data the binding constraints are Tailwind v4 (Safari 16.4, Firefox 128) and `color-mix()` (Safari 16.2), so the effective baseline is Chrome/Edge 111+, Firefox 128+, Safari/iOS 16.4+, no IE. Add a "Browser support" table to the README so consumers know what they get (older Safari/Firefox render the tokens incorrectly), and a matching `browserslist` so propel's own build tooling targets the same set. The tokens use the plain, well-supported forms (literal `oklch()`, two-color `color-mix(in oklch, ...)`), not the relative/variadic syntaxes that have partial support, so nothing in the CSS needed changing. --- packages/propel/README.md | 15 +++++++++++++++ packages/propel/package.json | 7 +++++++ 2 files changed, 22 insertions(+) diff --git a/packages/propel/README.md b/packages/propel/README.md index 50f0ab61..93218ac0 100644 --- a/packages/propel/README.md +++ b/packages/propel/README.md @@ -60,6 +60,21 @@ The tokens use the Tailwind v4 multi-theme pattern (light/dark/high-contrast via `[data-theme]`), so theming is driven by a `data-theme` attribute on a host element. +## Browser support + +propel targets modern evergreen browsers. The baseline is set by Tailwind v4 and +by the color tokens, which use `oklch()` and `color-mix()`: + +| Browser | Minimum | +| ----------- | ------- | +| Chrome/Edge | 111 | +| Firefox | 128 | +| Safari/iOS | 16.4 | + +Internet Explorer is not supported. Older Safari (16.0–16.3) and Firefox (< 128) +render the color tokens incorrectly, since `color-mix()` and the Tailwind v4 +cascade-layer/`@property` features aren't fully available there. + ## Development This package is built with [`vp pack`](https://viteplus.dev/guide/pack) (tsdown). diff --git a/packages/propel/package.json b/packages/propel/package.json index 6ef9b157..29bcac8d 100644 --- a/packages/propel/package.json +++ b/packages/propel/package.json @@ -91,6 +91,13 @@ "react-dom": "^18.0.0 || ^19.0.0", "tailwindcss": "^4.0.0" }, + "browserslist": [ + "Chrome >= 111", + "Edge >= 111", + "Firefox >= 128", + "Safari >= 16.4", + "iOS >= 16.4" + ], "engines": { "node": "^20.19.0 || >=22.12.0" } From 52bb465c1ce62d949c24ea26011abbd6ce1390f2 Mon Sep 17 00:00:00 2001 From: Aaron Reisman Date: Wed, 17 Jun 2026 00:49:48 +0700 Subject: [PATCH 2/3] docs: attribute the browser floors to Tailwind v4; use canonical browserslist names --- packages/propel/README.md | 7 ++++--- packages/propel/package.json | 10 +++++----- 2 files changed, 9 insertions(+), 8 deletions(-) diff --git a/packages/propel/README.md b/packages/propel/README.md index 93218ac0..63a99431 100644 --- a/packages/propel/README.md +++ b/packages/propel/README.md @@ -71,9 +71,10 @@ by the color tokens, which use `oklch()` and `color-mix()`: | Firefox | 128 | | Safari/iOS | 16.4 | -Internet Explorer is not supported. Older Safari (16.0–16.3) and Firefox (< 128) -render the color tokens incorrectly, since `color-mix()` and the Tailwind v4 -cascade-layer/`@property` features aren't fully available there. +Internet Explorer is not supported. The Firefox 128 and Safari/iOS 16.4 floors are +set by Tailwind v4's own baseline (cascade layers and `@property`), not by the color +tokens: `oklch()` and `color-mix()` are actually supported earlier (Firefox 113, +Safari 16.2). Below those floors the Tailwind-generated CSS doesn't apply correctly. ## Development diff --git a/packages/propel/package.json b/packages/propel/package.json index 29bcac8d..7efc4f08 100644 --- a/packages/propel/package.json +++ b/packages/propel/package.json @@ -92,11 +92,11 @@ "tailwindcss": "^4.0.0" }, "browserslist": [ - "Chrome >= 111", - "Edge >= 111", - "Firefox >= 128", - "Safari >= 16.4", - "iOS >= 16.4" + "chrome >= 111", + "edge >= 111", + "firefox >= 128", + "safari >= 16.4", + "ios_saf >= 16.4" ], "engines": { "node": "^20.19.0 || >=22.12.0" From 2d804d6cb4285227939f614d92536ca00361c1f2 Mon Sep 17 00:00:00 2001 From: Aaron Date: Wed, 17 Jun 2026 13:36:11 +0700 Subject: [PATCH 3/3] Potential fix for pull request finding Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com> --- packages/propel/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/propel/README.md b/packages/propel/README.md index 63a99431..481f2a5e 100644 --- a/packages/propel/README.md +++ b/packages/propel/README.md @@ -62,7 +62,7 @@ element. ## Browser support -propel targets modern evergreen browsers. The baseline is set by Tailwind v4 and +Propel targets modern evergreen browsers. The baseline is set by Tailwind v4 and by the color tokens, which use `oklch()` and `color-mix()`: | Browser | Minimum |