vuestorefront · FRSgit · Nov 17, 2025 · Nov 17, 2025
@@ -27,8 +27,8 @@
     "@nuxtjs/color-mode": "^3.4.2",
     "@nuxtjs/seo": "^2.0.0-rc.10",
     "@nuxtjs/tailwindcss": "7.0.0-beta.1",
-    "@storefront-ui/typography": "^2.6.1",
-    "@storefront-ui/vue": "^2.6.5",
+    "@storefront-ui/typography": "^3.0.0",
+    "@storefront-ui/vue": "^3.0.0",
     "@tailwindcss/typography": "^0.5.19",
     "@vueuse/integrations": "^12.8.0",
     "@vueuse/nuxt": "^12.8.0",

@@ -1,5 +1,26 @@
 # @storefront-ui/tailwind-config
 
+## 3.0.0
+
+### Major Changes
+
+- [#3313](https://github.com/vuestorefront/storefront-ui/pull/3313) [`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Migrate to Tailwind@4 new configuration syntax. If you're using Tailwind@3, please stick to `@storefront-ui/tailwind-config` in version 2.x.
+
+  - **[BREAKING][CHANGED]** Introduce OOTB dark mode handling instead of relying on `@mertasan/tailwindcss-variables` package.
+  - **[REMOVED]** The `@mertasan/tailwindcss-variables` dependency has been removed as Tailwind support CSS variables out of the box now.
+
+- [#3282](https://github.com/vuestorefront/storefront-ui/pull/3282) [`31aa18f`](https://github.com/vuestorefront/storefront-ui/commit/31aa18f3dd7d85a2d2298c8fd776a5feadfc0167) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** The default color palette for `primary`, `neutral` and `secondary` colors. Copy [old color palette](https://github.com/vuestorefront/storefront-ui/blob/8b35d6507ee3ae93538539400947e2f86d0c5529/packages/config/tailwind/index.ts#L360-L381) to your local `tailwind.config.js` if you need to keep some of them.
+  Also, now the palette is converted from rgb to oklch colors to [fit with tailwind 4](https://tailwindcss.com/blog/tailwindcss-v4#modernized-p3-color-palette).
+
+### Minor Changes
+
+- [#3282](https://github.com/vuestorefront/storefront-ui/pull/3282) [`31aa18f`](https://github.com/vuestorefront/storefront-ui/commit/31aa18f3dd7d85a2d2298c8fd776a5feadfc0167) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[ADDED]** Add `@tailwindcss/container-queries`. Now container queries are available out-of-the-box when using `@storefront-ui/tailwind-config`.
+
+### Patch Changes
+
+- Updated dependencies [[`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9)]:
+  - @storefront-ui/tw-plugin-peer-next@3.0.0
+
 ## 2.5.1
 
 ### Patch Changes

@@ -1,6 +1,6 @@
 {
   "name": "@storefront-ui/tailwind-config",
-  "version": "2.5.1",
+  "version": "3.0.0",
   "license": "MIT",
   "sideEffects": false,
   "exports": {

@@ -1,5 +1,16 @@
 # @storefront-ui/nuxt
 
+## 3.0.0
+
+### Major Changes
+
+- [#3313](https://github.com/vuestorefront/storefront-ui/pull/3313) [`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Migrate to Tailwind@4. SFUI tries to defer some of Tailwinds' breaking changes, e.g. the default outline width or border-radius size scale, but not everything was possible. Please refer to all breaking changes described in the [Tailwind upgrade guide](https://tailwindcss.com/docs/upgrade-guide) and [updated storefront-ui docs](https://docs.storefrontui.io/v2/).
+
+### Patch Changes
+
+- Updated dependencies [[`c850705`](https://github.com/vuestorefront/storefront-ui/commit/c850705aba20c0f4a7ac969b55a50d9d8866f64c), [`15e4549`](https://github.com/vuestorefront/storefront-ui/commit/15e4549e9d444218ed20ca80af1f6c822eb72781), [`15e4549`](https://github.com/vuestorefront/storefront-ui/commit/15e4549e9d444218ed20ca80af1f6c822eb72781), [`15e4549`](https://github.com/vuestorefront/storefront-ui/commit/15e4549e9d444218ed20ca80af1f6c822eb72781), [`6e609e7`](https://github.com/vuestorefront/storefront-ui/commit/6e609e7624e9c5c98cfb3db8adccbd6e75db5260), [`31aa18f`](https://github.com/vuestorefront/storefront-ui/commit/31aa18f3dd7d85a2d2298c8fd776a5feadfc0167), [`15e4549`](https://github.com/vuestorefront/storefront-ui/commit/15e4549e9d444218ed20ca80af1f6c822eb72781), [`6e609e7`](https://github.com/vuestorefront/storefront-ui/commit/6e609e7624e9c5c98cfb3db8adccbd6e75db5260), [`6e609e7`](https://github.com/vuestorefront/storefront-ui/commit/6e609e7624e9c5c98cfb3db8adccbd6e75db5260), [`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9), [`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9)]:
+  - @storefront-ui/vue@3.0.0
+
 ## 2.5.4
 
 ### Patch Changes

@@ -1,6 +1,6 @@
 {
   "name": "@storefront-ui/nuxt",
-  "version": "2.5.4",
+  "version": "3.0.0",
   "homepage": "https://docs.storefrontui.io/v2/",
   "installConfig": {
     "hoistingLimits": "workspaces"

@@ -1,5 +1,41 @@
 # @storefront-ui/react
 
+## 3.0.0
+
+### Major Changes
+
+- [#3281](https://github.com/vuestorefront/storefront-ui/pull/3281) [`15e4549`](https://github.com/vuestorefront/storefront-ui/commit/15e4549e9d444218ed20ca80af1f6c822eb72781) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Padding size for square variant of SfButton changed
+
+- [#3281](https://github.com/vuestorefront/storefront-ui/pull/3281) [`15e4549`](https://github.com/vuestorefront/storefront-ui/commit/15e4549e9d444218ed20ca80af1f6c822eb72781) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** removed flex classes from wrapper for slot in SfListItem
+
+- [#3281](https://github.com/vuestorefront/storefront-ui/pull/3281) [`15e4549`](https://github.com/vuestorefront/storefront-ui/commit/15e4549e9d444218ed20ca80af1f6c822eb72781) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Padding left and right in SfSelect changed from 14px and 16px to 12px
+
+- [#3289](https://github.com/vuestorefront/storefront-ui/pull/3289) [`6e609e7`](https://github.com/vuestorefront/storefront-ui/commit/6e609e7624e9c5c98cfb3db8adccbd6e75db5260) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** default badge background color. Add className `!bg-secondary-700` explicitly in order to migrate.
+
+- [#3316](https://github.com/vuestorefront/storefront-ui/pull/3316) [`939a982`](https://github.com/vuestorefront/storefront-ui/commit/939a9821c0cfd69d876994182b2442aa2cf7f4d6) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** upgrade to React 19. There are no breaking changes specific to SFUI library itself. To upgrade, please [follow official React guide](https://react.dev/blog/2024/04/25/react-19-upgrade-guide).
+
+- [#3281](https://github.com/vuestorefront/storefront-ui/pull/3281) [`15e4549`](https://github.com/vuestorefront/storefront-ui/commit/15e4549e9d444218ed20ca80af1f6c822eb72781) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Deprecated option `arrowKeysOn` from `useTrapFocus` is removed.
+  This option was separated and replaced by two more specialised options `arrowKeysLeftRight` and `arrowKeysUpDown`.
+  In order to migrate please one of those options or both.
+
+- [#3289](https://github.com/vuestorefront/storefront-ui/pull/3289) [`6e609e7`](https://github.com/vuestorefront/storefront-ui/commit/6e609e7624e9c5c98cfb3db8adccbd6e75db5260) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Moved from `rounded-md` to `rounded-xl` as a default styling for `SfInput`.
+
+- [#3289](https://github.com/vuestorefront/storefront-ui/pull/3289) [`6e609e7`](https://github.com/vuestorefront/storefront-ui/commit/6e609e7624e9c5c98cfb3db8adccbd6e75db5260) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Changed `SfCheckbox` default text color. To brind the previous behaviour back, apply `!text-gray !disabled:text-gray-300 !hover:text-gray-300` to your `SfCheckbox` element.
+
+- [#3313](https://github.com/vuestorefront/storefront-ui/pull/3313) [`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Migrate to Tailwind@4. SFUI tries to defer some of Tailwinds' breaking changes, e.g. the default outline width or border-radius size scale, but not everything was possible. Please refer to all breaking changes described in the [Tailwind upgrade guide](https://tailwindcss.com/docs/upgrade-guide) and [updated storefront-ui docs](https://docs.storefrontui.io/v2/).
+
+- [#3313](https://github.com/vuestorefront/storefront-ui/pull/3313) [`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[BREAKING][CHANGED]** Added `tailwind-merge` to all base components & blocks. From now on it will be easier to override default SFUI styles. See [`tailwind-merge` docs for more details](https://www.npmjs.com/package/tailwind-merge).
+
+### Minor Changes
+
+- [#3283](https://github.com/vuestorefront/storefront-ui/pull/3283) [`c850705`](https://github.com/vuestorefront/storefront-ui/commit/c850705aba20c0f4a7ac969b55a50d9d8866f64c) Thanks [@FRSgit](https://github.com/FRSgit)! - - **[ADDED]** `blank` prop for SfButton component that eases out creating custom buttons. See [documentation](https://docs.storefrontui.io/v2/vue/components/button#blank-button-variants) for more details.
+
+### Patch Changes
+
+- Updated dependencies [[`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9), [`80a44dd`](https://github.com/vuestorefront/storefront-ui/commit/80a44dd4bf6dca72f6496d49ccd5c76d8f8522a9), [`31aa18f`](https://github.com/vuestorefront/storefront-ui/commit/31aa18f3dd7d85a2d2298c8fd776a5feadfc0167), [`31aa18f`](https://github.com/vuestorefront/storefront-ui/commit/31aa18f3dd7d85a2d2298c8fd776a5feadfc0167)]:
+  - @storefront-ui/tailwind-config@3.0.0
+  - @storefront-ui/shared@3.0.0
+
 ## 2.7.1
 
 ### Patch Changes

@@ -1,6 +1,6 @@
 {
   "name": "@storefront-ui/react",
-  "version": "2.7.1",
+  "version": "3.0.0",
   "license": "MIT",
   "sideEffects": false,
   "type": "module",