Update ui deps sync (major) #685
Conversation
WalkthroughThis PR upgrades dependencies in the UI package. The OpenAI dependency is bumped from 5.23.2 to 6.5.0 in both the import map and package.json. Additional devDependencies are also updated: svelte-check, svelte-preprocess, and tailwindcss to newer minor and patch versions. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Possibly related PRs
Suggested reviewers
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Comment |
renovate
bot
force-pushed
the
renovate/major-ui-deps-sync
branch
5 times, most recently
from
e49ac46 to
394311c
Compare
|
Caution Review the following alerts detected in dependencies. According to your organization's Security Policy, you must resolve all "Block" alerts before proceeding. Learn more about Socket for GitHub.
|
renovate
bot
force-pushed
the
renovate/major-ui-deps-sync
branch
7 times, most recently
from
ab19736 to
e5f0fb6
Compare
renovate
bot
force-pushed
the
renovate/major-ui-deps-sync
branch
3 times, most recently
from
2f3fb12 to
9c27729
Compare
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
packages/ui/package.json (1)
15-45: Critical: Tailwind v4 migration incomplete—build will fail due to missing configuration updates.The upgrade to Tailwind v4 requires configuration and CSS syntax changes that are not present in this PR:
Missing required dependency:
@tailwindcss/postcssnot inpackage.json. Tailwind v4 moved the PostCSS plugin to a separate package; yourpostcss.config.jsrequires'tailwindcss'which no longer exists as a plugin.Outdated CSS directives:
packages/ui/src/common/styles/global.css: Change@tailwind utilities;to@import "tailwindcss";packages/ui/src/common/styles/standalone.css: Likely needs same updateIncompatible preprocessor config:
packages/ui/svelte.config.jshaspostcss: truewhich will fail when PostCSS can't load the tailwindcss plugin.Required changes before merge:
- Add
"@tailwindcss/postcss": "next"todevDependencies(or use CSS-first approach by removing postcss config entirely)- Update all CSS files from
@tailwinddirectives to@import "tailwindcss"- Run
npm run buildandnpm run validateto verify the build succeeds- Confirm
svelte-checkpasses with Svelte v3.55.0 + svelte-check v4.3.3The OpenAI SDK upgrade (v5.23.2→6.5.0) appears compatible with your usage patterns.
🧹 Nitpick comments (1)
packages/ui/package.json (1)
29-29: Consider using a caret range for OpenAI to allow patch/minor updates.The version is pinned to an exact semver (6.5.0) rather than using a caret range (^6.5.0). While pinning prevents accidental upgrades, it also blocks security patches and minor updates. Most projects use caret ranges for npm dependencies to balance safety and flexibility. If exact pinning is intentional, please document the rationale.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (2)
packages/ui/import_map.json(1 hunks)packages/ui/package.json(2 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)
- GitHub Check: boostsecurity - boostsecurityio/semgrep-pro
- GitHub Check: check
- GitHub Check: build (cairo, default)
- GitHub Check: build (solidity, default)
- GitHub Check: build (stellar, default)
- GitHub Check: build (stellar, compile)
- GitHub Check: build (stylus, default)
- GitHub Check: format-lint
- GitHub Check: mcp
- GitHub Check: semgrep-cloud-platform/scan
🔇 Additional comments (2)
packages/ui/import_map.json (1)
4-4: Verify OpenAI SDK v6 compatibility—significant API migration required.The OpenAI SDK v6 migrated from node-fetch to builtin fetch, which represents a breaking change. Before merging, you must verify that:
- All application code consuming the OpenAI SDK has been updated to work with v6's API (e.g., method signatures, response shapes)
- The application builds successfully with the new version
- Existing tests pass with v6
Since the PR context shows no code changes related to OpenAI usage, there's a risk that dependent code is incompatible with v6.
packages/ui/package.json (1)
39-40: Verify Svelte ecosystem upgrade—ensure build tools meet minimum requirements.Svelte 4 is mainly a maintenance release that increases the minimum version requirements, with Node.js 16 now the minimum version and TypeScript 5+ recommended. The package.json shows TypeScript ^5.9.3 (line 44), which satisfies requirements.
However, verify that:
- The application builds successfully with svelte-check ^4.3.3
- If using SvelteKit, it's version 1.20.4 or newer (check if applicable)
- The
validatescript at line 12 (svelte-check) runs without errors
packages/ui/package.json
Outdated
| "tailwindcss": "^3.4.18", | ||
| "svelte-check": "^4.3.3", | ||
| "svelte-preprocess": "^6.0.3", | ||
| "tailwindcss": "^4.1.14", |
There was a problem hiding this comment.
🧩 Analysis chain
Tailwind CSS v4.0 is a major version with necessary updates required from v3 to v4. This update introduces breaking changes that are NOT evident in this PR:
- CSS imports: In v4 you import Tailwind using a regular CSS @import statement, not using the @tailwind directives
- Preprocessor incompatibility: Tailwind CSS v4.0 is not designed to be used with CSS preprocessors like Sass, Less, or Stylus, and it is not possible to use Sass for <style> blocks in Svelte
- Browser support: Tailwind CSS v4.0 is designed for Safari 16.4+, Chrome 111+, and Firefox 128+. If you need to support older browsers, stick with v3.4
- Configuration: CSS-first config replaces JavaScript-based tailwind.config.js
The PR shows no corresponding updates to CSS files, Tailwind config, or SCSS/Sass removal. The upgrade tool will handle most of these changes automatically, but there's no evidence it was used. Without these changes, the build will likely fail or styles will break.
Verify the following before merging:
- All CSS files have been updated to use
@import "tailwindcss"instead of@tailwinddirectives - tailwind.config.js has been updated to CSS-first format (or removed if no custom config needed)
- Any SCSS/Sass files have been converted to plain CSS or removed
- The build completes successfully and styles render correctly
Run the following verification script:
🏁 Script executed:
#!/bin/bash
# Find and list Tailwind-related config and CSS files
echo "=== Tailwind Config Files ==="
find . -name "tailwind.config.*" -o -name "tailwind.css" -o -name "global.css" | grep -v node_modules
echo ""
echo "=== SCSS/Sass Files (may be incompatible with Tailwind v4) ==="
find . -name "*.scss" -o -name "*.sass" | grep -v node_modules | head -20
echo ""
echo "=== CSS Files Mentioning @tailwind ==="
rg -t css "@tailwind" --no-heading
echo ""
echo "=== SVG/Vue/Svelte Files with Style Blocks Using @tailwind ==="
rg -t svelte -A2 "<style" | grep -A2 "@tailwind"Length of output: 418
CSS files must be updated to use Tailwind v4 syntax—@tailwind directives are no longer supported.
In v4 you import Tailwind using a regular CSS @import statement, not using the @tailwind directives you used in v3. The PR updates tailwindcss to v4.1.14 but contains two CSS files that still use the deprecated v3 syntax:
packages/ui/src/standalone.css:@tailwind utilities;packages/ui/src/common/styles/global.css:@tailwind utilities;
These files must be updated before this PR can be merged. Change @tailwind utilities; to @import "tailwindcss"; in both files.
Additional items to verify:
- If
tailwind.config.jscontains custom configuration, it must be explicitly loaded with@config "../../tailwind.config.js";at the top of your CSS file (or migrated to CSS-first format using@theme) - Ensure
tailwind.config.jsis no longer auto-detected in v4 and add the@configdirective if needed - If any
.svelte,.vue, or other component files use<style>blocks with Tailwind, verify they reference the updated CSS or use the new v4 syntax
renovate
bot
force-pushed
the
renovate/major-ui-deps-sync
branch
6 times, most recently
from
e3ed09e to
65753f3
Compare
renovate
bot
force-pushed
the
renovate/major-ui-deps-sync
branch
4 times, most recently
from
9ef7c97 to
574305a
Compare
renovate
bot
force-pushed
the
renovate/major-ui-deps-sync
branch
from
574305a to
84def4e
Compare
This PR contains the following updates:
^5.1.1->^6.0.0^28.0.8->^29.0.05.23.2->6.7.05.23.2->6.7.0^3.8.6->^4.3.3^5.1.4->^6.0.3^3.4.18->^4.1.16Release Notes
rollup/plugins (@rollup/plugin-alias)
v6.0.02025-10-28
Breaking Changes
rollup/plugins (@rollup/plugin-commonjs)
v29.0.02025-10-30
Breaking Changes
requireNodeBuiltinsoption (#1937)v28.0.92025-10-24
Bugfixes
node:builtins withstrictRequires: auto(#1930)openai/openai-node (openai)
v6.7.0Compare Source
Full Changelog: v6.6.0...v6.7.0
Features
Bug Fixes
v6.6.0Compare Source
Full Changelog: v6.6.0...v6.7.0
Features
Bug Fixes
v6.5.0Compare Source
Full Changelog: v6.5.0...v6.6.0
Features
Bug Fixes
v6.4.0Compare Source
Full Changelog: v6.4.0...v6.5.0
Features
v6.3.0Compare Source
Full Changelog: v6.3.0...v6.4.0
Features
v6.2.0Compare Source
Full Changelog: v6.2.0...v6.3.0
Features
Chores
v6.1.0Compare Source
Full Changelog: v6.1.0...v6.2.0
Features
Chores
v6.0.1Compare Source
Full Changelog: v6.0.1...v6.1.0
Features
v6.0.0Compare Source
Full Changelog: v6.0.0...v6.0.1
Bug Fixes
sveltejs/language-tools (svelte-check)
v4.3.3Compare Source
Patch Changes
fix: prevent file watcher issue (#2859)
fix: allow
undefinedandnullvalues for#eachin Svelte 5 (#2863)perf: check if file content changed in tsconfig file watch (#2859)
v4.3.2Compare Source
Patch Changes
perf: tweak some snapshot hot paths (#2852)
perf: more precise module cache invalidation (#2853)
fix: properly handle
runes={false}in<svelte:options>(#2847)See https://github.com/sveltejs/language-tools/releases
v4.3.1Compare Source
fix: handle object literal in MustacheTag (#2805)
v4.3.0Compare Source
awaitsupport (#2799)v4.2.2Compare Source
v4.2.1Compare Source
v4.2.0Compare Source
v4.1.7Compare Source
v4.1.6Compare Source
v4.1.5Compare Source
v4.1.4Compare Source
v4.1.3Compare Source
v4.1.2Compare Source
v4.1.1Compare Source
v4.1.0Compare Source
v4.0.9Compare Source
v4.0.8Compare Source
v4.0.7Compare Source
$props: infer types for$bindable, infer function type from arrow functionv4.0.6Compare Source
const load = ...declarations (#2540)v4.0.5Compare Source
v4.0.4Compare Source
v4.0.3Compare Source
Componentin type positions. Instead you need to prepend it withtypeof. Here's how you do it:let x: Component. After:let x: ReturnType<typeof Component>let x: typeof Component. Afterlet x: typeof Component(no change)v4.0.2Compare Source
Componentinterface get proper intellisensev4.0.1Compare Source
processaugmentation from internald.tsfilev4.0.0Compare Source
Breaking changes
processaugmentation (declaring aprocess.browserfield) was removed.sveltefiles now take precedence over.svelte.js/tsfiles (if both exist) (#2481)skipLibCheckis no longer forced totrue, which may result ind.tsfiles now being checked in your project, which they were not before, revealing type errors. Either fix those or add"skipLibCheck": trueto yourtsconfig.json(#1976, #2463)sveltejs/svelte-preprocess (svelte-preprocess)
v6.0.3Compare Source
Bug Fixes
v6.0.2Compare Source
Bug Fixes
v6.0.1Compare Source
Bug Fixes
v6.0.0Compare Source
BREAKING CHANGES
preserveoption as it's unnecessaryBug Fixes
5.1.4 (2024-04-16)
Bug Fixes
5.1.3 (2023-12-18)
Bug Fixes
5.1.2 (2023-12-12)
5.1.1 (2023-11-21)
Bug Fixes
tailwindlabs/tailwindcss (tailwindcss)
v4.1.16Compare Source
Fixed
&(#19184)& > :pseudoand& :pseudoarbitrary variants (#19178)v4.1.15Compare Source
Fixed
color-mixfallback (#19069):deep,:slotted, and:global(#19094)not-*,has-*, andin-*(#19100)theme(…)function (#19111)\tis used in at-rules (#19130)0values (#19095)break-wordstowrap-break-word(#19157)Changed
postinstallscript from oxide ([#19149])(#19149)v4.1.14Compare Source
Fixed
'syntax in ClojureScript when extracting classes (#18888)@variantinside@custom-variant(#18885)@utility(#18900)grid-columnutilities when configuringgrid-column-startorgrid-column-end(#18907)grid-rowutilities when configuringgrid-row-startorgrid-row-end(#18907)defaultexport condition for@tailwindcss/vite(#18948)@themeproduce no output when built (#18979)variant = 'outline'during upgrades (#18922)classNameis migrated (#19031)*ClassNameand*Classattributes (#19031)v4.1.13Compare Source
Changed
Fixed
visibilitywhen usingtransition(#18795)matchVariantvalues (#18798)clipwithclip-pathinsr-only(#18769)matchUtilities(#18820).vercelfolders by default (can be overridden by@source …rules) (#18855)@-to be invalid (e.g.@-2xl:flex) (#18869)-or_(#18867, #18872)ariatheme keys to@custom-variant(#18815)datatheme keys to@custom-variant(#18816)supportstheme keys to@custom-variant(#18817)v4.1.12Compare Source
Fixed
@apply(#18404)flex-<number>utilities (#18642))from interfering with extraction in Clojure keywords (#18345)@pluginand@config(#18345)process.env.DEBUGin@tailwindcss/node(#18485)falseorundefinedproperties (#18571)@tailwindcss/postcssviatransformAssetUrls: false(#18321)addEventListenerand JavaScript variable names (#18718)--border-color-*theme keys individe-*utilities for backwards compatibility (#18704).hdrand.exrfiles for classes by default (#18734)v4.1.11Compare Source
Fixed
emit(…)(#18330)--watch=alwaysin the CLI's usage (#18337)@tailwindcss/vite(#18384)v4.1.10Compare Source
Fixed
w-[calc(100%-var(--offset))]) (#18289)v4.1.9Compare Source
Fixed
/[0.16]→/16) (#18184)mb-[-32rem]→-mb-128) (#18212)blurinwire:model.blur(#18216)v4.1.8Compare Source
Added
@applyfails (#18059)Fixed
<style>blocks (#18057, 18068)tailwindcssin pnpm monorepos (#18065)order-nonetoorder-0(#18126)class:attributes when extracting classes (#18093)-mt-[0px]tomt-[0px]instead of the other way around (#18154)\nat the end of the file (#18155).pnpm-storefolders by default (can be overridden by@source …rules) (#18163)toJSON()(#18083)v4.1.7Compare Source
Added
Fixed
_before numbers during candidate extraction (#17961)@themeand@utilitytogether (#17675)::beforeand::afterpseudo selectors create valid CSS rules in production builds (#17979)-rotate-*utilities properly negate arbitrary values (#18014):merge(…)selectors in legacy JS plugins (#18020).are properly extracted from Clojure files (#18038)@import … source(…)(#17963)class(#18025)v4.1.6Compare Source
Added
h-[1lh]toh-lh) (#17831, #17854)@sourcedirectives, discovered files and scanned files when usingDEBUG=*(#17906, #17952)Fixed
scalevalues generate negative values (#17831)@reference(#17836)_withbg-red-500/(--my_opacity)(#17889).logfiles for classes by default (#17906)@applyrules (#17925)optionalDependenciesare skipped (#17929)v4.1.5Compare Source
Added
@tailwindcss/upgradeto upgrade between versions of v4.* (#17717)h-lh/min-h-lh/max-h-lhutilities (#17790)display,visibility,content-visibility,overlay, andpointer-eventswhen usingtransitionto simplify@starting-styleusage (#17812)Fixed
.geojsonor.dbfiles for classes by default (#17700, #17711)_with.in theme suggestions for@utilityif surrounded by digits (#17733)color-mix(…)when opacity is100%(#17815)-to variants starting with@(#17814)Changed
.hg,.svn,.venv,venv,.yarn,.next,.turbo,.parcel-cache,__pycache__, and.svelte-kitfolders by default (can be overridden by@source …rules) (#17892)@sourcerules that point inside.hg,.svn,.venv,venv,.yarn,.next,.turbo,.parcel-cache,__pycache__, and.svelte-kitfolders no longer consider your.gitignorerules (#17892)v4.1.4Compare Source
Added
@tailwindcss/oxide-wasm32-wasitarget for running Tailwind in browser environments like StackBlitz (#17558)Fixed
color-mix(…)polyfills do not cause used CSS variables to be removed (#17555)color-mix(…)polyfills create fallbacks for theme variables that reference other theme variables (#17562){10..0..5}and{0..10..-5}(#17591)skew-*utilities (#17627)shadow-inherit,inset-shadow-inherit,drop-shadow-inherit, andtext-shadow-inheritinherit the shadow color (#17647)fontSizeJS theme keys (#17630)fontSizearray tuple syntax to CSS theme variables (#17630)v4.1.3Compare Source
Fixed
--value(…)(#17464)%wsyntax in Slim templates (#17557)v4.1.2Compare Source
Fixed
@layer baseto polyfill@property(#17506)Configuration
📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).
🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.
♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.
👻 Immortal: This PR will be recreated if closed unmerged. Get config help if that's undesired.
This PR was generated by Mend Renovate. View the repository job log.