@synergy-design-system/tokens 2.48.2 → 3.0.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # Changelog
 
+## 3.0.0
+
+### Major Changes
+
+- [#1160](https://github.com/synergy-design-system/synergy-design-system/pull/1160) [`669cbcb`](https://github.com/synergy-design-system/synergy-design-system/commit/669cbcb9cccce72134beac99ac12a2591f3e3c74) Thanks [@schilchSICKAG](https://github.com/schilchSICKAG)! - Released on: 2026-02-02
+
+  feat: 💥 New default theme SICK 2025
+
+  This release introduces SICK 2025 as the new default theme. The `light.css` and `dark.css` imports now point to SICK 2025 instead of SICK 2018.
+
+  **Key Changes:**
+  - **Breaking:** Default theme changed to SICK 2025 - if you want to continue using SICK 2018, import `sick2018_light.css` or `sick2018_dark.css` instead
+  - **Deprecation Notice:** SICK 2018 theme will be removed in a future major release (expected 2027+)
+  - **Deprecation Notice:** `--syn-page-background` token renamed to `--syn-page-background-color`
+  - **Deprecation Notice:** Token Studio code in `src/figma-tokens` will be removed in a future release
+
+  For detailed migration instructions, please refer to the [breaking changes documentation](https://synergy-design-system.github.io/?path=/docs/packages-tokens-breaking-changes--docs).
+
 ## 2.48.2
 
 ### Patch Changes

package/README.md

@@ -15,6 +15,8 @@ Please make sure to install the tokens package as a dependency:
 npm install --save @synergy-design-system/tokens
 ```
 
+> For best compliance, please make sure to install the same version that is also used in your `@synergy-design-system/components` package!
+
 ---
 
 ## Provided tokens

package/dist/js/index.d.ts

@@ -1,5 +1,5 @@
 /**
- * @synergy-design-system/tokens version 2.48.1
+ * @synergy-design-system/tokens version 2.48.2
  * SICK Global UX Foundation
  */
 
@@ -1508,6 +1508,11 @@ export const SynOverlayBackgroundColor: string;
  */
 export const SynPageBackground: string;
 
+/**
+ * Maps to the css variable `--syn-page-background-color`
+ */
+export const SynPageBackgroundColor: string;
+
 /**
  * Maps to the css variable `--syn-panel-background-color`
  */

package/dist/js/index.js

@@ -1,5 +1,5 @@
 /**
- * @synergy-design-system/tokens version 2.48.1
+ * @synergy-design-system/tokens version 2.48.2
  * SICK Global UX Foundation
  */
 
@@ -1508,6 +1508,11 @@ export const SynOverlayBackgroundColor = 'var(--syn-overlay-background-color)';
  */
 export const SynPageBackground = 'var(--syn-page-background)';
 
+/**
+ * @type {string}
+ */
+export const SynPageBackgroundColor = 'var(--syn-page-background-color)';
+
 /**
  * @type {string}
  */

package/dist/scss/_tokens.scss

@@ -1,5 +1,5 @@
 /**
- * @synergy-design-system/tokens version 2.48.1
+ * @synergy-design-system/tokens version 2.48.2
  * SICK Global UX Foundation
  */
 $SynAlertErrorColorBackground: var(--syn-alert-error-color-background) !default;
@@ -303,6 +303,7 @@ $SynOptionIconColorHover: var(--syn-option-icon-color-hover) !default;
 $SynOverlayBackgroundBlur: var(--syn-overlay-background-blur) !default;
 $SynOverlayBackgroundColor: var(--syn-overlay-background-color) !default;
 $SynPageBackground: var(--syn-page-background) !default;
+$SynPageBackgroundColor: var(--syn-page-background-color) !default;
 $SynPanelBackgroundColor: var(--syn-panel-background-color) !default;
 $SynPanelBorderColor: var(--syn-panel-border-color) !default;
 $SynPanelBorderRadius: var(--syn-panel-border-radius) !default;