@marioschmidt/design-system-tokens 1.0.79 → 1.2.0

package/dist/js/brands/sportbild/components/Footer.js

@@ -1,12 +1,12 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * BILD Design System Tokens v1.0.79
+ * BILD Design System Tokens v1.2.0
  * Generated by Style Dictionary v4.2.0
  *
  * Context: JavaScript Token Module
  *
- * Copyright (c) 2025 Axel Springer Deutschland GmbH
+ * Copyright (c) 2026 Axel Springer Deutschland GmbH
  * Proprietary and confidential. All rights reserved.
  *
  * Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/js.md
@@ -20,135 +20,55 @@ export const Footer = {
     "lg": {
       "footerFontSize": "11px",
       "footerLineHeight": "14px",
-      "footerFontFamily": "Inter",
-      "footerFontSizeUserOfferPages": "18px",
-      "footerLineHeightUserOfferPages": "26px"
+      "footerFontFamily": "Inter"
     },
     "md": {
       "footerFontSize": "11px",
       "footerLineHeight": "14px",
-      "footerFontFamily": "Inter",
-      "footerFontSizeUserOfferPages": "18px",
-      "footerLineHeightUserOfferPages": "26px"
+      "footerFontFamily": "Inter"
     },
     "sm": {
       "footerFontSize": "11px",
       "footerLineHeight": "14px",
-      "footerFontFamily": "Inter",
-      "footerFontSizeUserOfferPages": "18px",
-      "footerLineHeightUserOfferPages": "26px"
+      "footerFontFamily": "Inter"
     },
     "xs": {
       "footerFontSize": "11px",
       "footerLineHeight": "14px",
-      "footerFontFamily": "Inter",
-      "footerFontSizeUserOfferPages": "18px",
-      "footerLineHeightUserOfferPages": "26px"
+      "footerFontFamily": "Inter"
     }
   },
   "typography": {
     "lg": {
-      "footerCardLink": {
-        "fontFamily": "Gotham XNarrow",
-        "fontWeight": 400,
-        "fontSize": "15px",
-        "lineHeight": "null"
-      },
-      "footerLinkSeparator": {
-        "fontFamily": "Gotham XNarrow",
-        "fontWeight": 400,
-        "fontSize": null,
-        "lineHeight": "null"
-      },
-      "footerLinks": {
+      "footerLink": {
         "fontFamily": "Inter",
         "fontWeight": 700,
         "fontSize": "11px",
         "lineHeight": "14px"
-      },
-      "footerLinkUserOfferPages": {
-        "fontFamily": "Inter",
-        "fontWeight": 400,
-        "fontSize": "18px",
-        "lineHeight": "26px"
       }
     },
     "md": {
-      "footerCardLink": {
-        "fontFamily": "Gotham XNarrow",
-        "fontWeight": 400,
-        "fontSize": "15px",
-        "lineHeight": "null"
-      },
-      "footerLinkSeparator": {
-        "fontFamily": "Gotham XNarrow",
-        "fontWeight": 400,
-        "fontSize": null,
-        "lineHeight": "null"
-      },
-      "footerLinks": {
+      "footerLink": {
         "fontFamily": "Inter",
         "fontWeight": 700,
         "fontSize": "11px",
         "lineHeight": "14px"
-      },
-      "footerLinkUserOfferPages": {
-        "fontFamily": "Inter",
-        "fontWeight": 400,
-        "fontSize": "18px",
-        "lineHeight": "26px"
       }
     },
     "sm": {
-      "footerCardLink": {
-        "fontFamily": "Gotham XNarrow",
-        "fontWeight": 400,
-        "fontSize": "15px",
-        "lineHeight": "null"
-      },
-      "footerLinkSeparator": {
-        "fontFamily": "Gotham XNarrow",
-        "fontWeight": 400,
-        "fontSize": null,
-        "lineHeight": "null"
-      },
-      "footerLinks": {
+      "footerLink": {
         "fontFamily": "Inter",
         "fontWeight": 700,
         "fontSize": "11px",
         "lineHeight": "14px"
-      },
-      "footerLinkUserOfferPages": {
-        "fontFamily": "Inter",
-        "fontWeight": 400,
-        "fontSize": "18px",
-        "lineHeight": "26px"
       }
     },
     "xs": {
-      "footerCardLink": {
-        "fontFamily": "Gotham XNarrow",
-        "fontWeight": 400,
-        "fontSize": "15px",
-        "lineHeight": "null"
-      },
-      "footerLinkSeparator": {
-        "fontFamily": "Gotham XNarrow",
-        "fontWeight": 400,
-        "fontSize": null,
-        "lineHeight": "null"
-      },
-      "footerLinks": {
+      "footerLink": {
         "fontFamily": "Inter",
         "fontWeight": 700,
         "fontSize": "11px",
         "lineHeight": "14px"
-      },
-      "footerLinkUserOfferPages": {
-        "fontFamily": "Inter",
-        "fontWeight": 400,
-        "fontSize": "18px",
-        "lineHeight": "26px"
       }
     }
   }
@@ -166,7 +86,5 @@ export const getFooterTokens = (colorMode = 'light', breakpoint = 'md', density
 export const footerFontSize = "11px";
 export const footerLineHeight = "14px";
 export const footerFontFamily = "Inter";
-export const footerFontSizeUserOfferPages = "18px";
-export const footerLineHeightUserOfferPages = "26px";
 
 export default Footer;

package/dist/js/brands/sportbild/components/Gallery.js

@@ -1,12 +1,12 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * BILD Design System Tokens v1.0.79
+ * BILD Design System Tokens v1.2.0
  * Generated by Style Dictionary v4.2.0
  *
  * Context: JavaScript Token Module
  *
- * Copyright (c) 2025 Axel Springer Deutschland GmbH
+ * Copyright (c) 2026 Axel Springer Deutschland GmbH
  * Proprietary and confidential. All rights reserved.
  *
  * Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/js.md

package/dist/js/brands/sportbild/components/Icon.js

@@ -1,12 +1,12 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * BILD Design System Tokens v1.0.79
+ * BILD Design System Tokens v1.2.0
  * Generated by Style Dictionary v4.2.0
  *
  * Context: JavaScript Token Module
  *
- * Copyright (c) 2025 Axel Springer Deutschland GmbH
+ * Copyright (c) 2026 Axel Springer Deutschland GmbH
  * Proprietary and confidential. All rights reserved.
  *
  * Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/js.md

package/dist/js/brands/{bild/components/Foldout.d.ts → sportbild/components/IconButton.d.ts}

@@ -5,7 +5,7 @@
 
 import type { ColorValue, SpacingValue, TypographyStyle, ShadowLayer } from '../../../types';
 
-export interface FoldoutTokens {
+export interface IconButtonTokens {
   colors?: { light?: Record<string, ColorValue>; dark?: Record<string, ColorValue>; };
   sizing?: { xs?: Record<string, SpacingValue>; sm?: Record<string, SpacingValue>; md?: Record<string, SpacingValue>; lg?: Record<string, SpacingValue>; };
   density?: { default?: Record<string, SpacingValue>; dense?: Record<string, SpacingValue>; spacious?: Record<string, SpacingValue>; };
@@ -13,11 +13,12 @@ export interface FoldoutTokens {
   effects?: { light?: Record<string, ShadowLayer[]>; dark?: Record<string, ShadowLayer[]>; };
 }
 
-export declare const Foldout: FoldoutTokens;
-export declare function getFoldoutTokens(colorMode?: 'light' | 'dark', breakpoint?: 'xs' | 'sm' | 'md' | 'lg', density?: 'default' | 'dense' | 'spacious'): Record<string, any>;
+export declare const IconButton: IconButtonTokens;
+export declare function getIconButtonTokens(colorMode?: 'light' | 'dark', breakpoint?: 'xs' | 'sm' | 'md' | 'lg', density?: 'default' | 'dense' | 'spacious'): Record<string, any>;
 
 // Flat exports
-export declare const foldoutLabelColorActive: string | number;
-export declare const foldoutLabelColorIdle: string | number;
+export declare const iconButtonSize: string | number;
+export declare const iconButtonBorderRadius: string | number;
+export declare const densityIconButtonSize: string | number;
 
-export default Foldout;
+export default IconButton;

package/dist/js/brands/sportbild/components/IconButton.js

@@ -0,0 +1,63 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ *
+ * BILD Design System Tokens v1.2.0
+ * Generated by Style Dictionary v4.2.0
+ *
+ * Context: JavaScript Token Module
+ *
+ * Copyright (c) 2026 Axel Springer Deutschland GmbH
+ * Proprietary and confidential. All rights reserved.
+ *
+ * Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/js.md
+ */
+
+// Component: IconButton
+// Brand: sportbild
+
+export const IconButton = {
+  "sizing": {
+    "lg": {
+      "iconButtonSize": "40px",
+      "iconButtonBorderRadius": "8px"
+    },
+    "md": {
+      "iconButtonSize": "40px",
+      "iconButtonBorderRadius": "8px"
+    },
+    "sm": {
+      "iconButtonSize": "40px",
+      "iconButtonBorderRadius": "8px"
+    },
+    "xs": {
+      "iconButtonSize": "40px",
+      "iconButtonBorderRadius": "8px"
+    }
+  },
+  "density": {
+    "default": {
+      "densityIconButtonSize": "48px"
+    },
+    "dense": {
+      "densityIconButtonSize": "40px"
+    },
+    "spacious": {
+      "densityIconButtonSize": "56px"
+    }
+  }
+};
+
+export const getIconButtonTokens = (colorMode = 'light', breakpoint = 'md', density = 'default') => ({
+  ...IconButton.colors?.[colorMode],
+  ...IconButton.sizing?.[breakpoint],
+  ...IconButton.density?.[density],
+  ...IconButton.typography?.[breakpoint],
+  ...IconButton.effects?.[colorMode]
+});
+
+// Flat exports for tree-shaking
+export const iconButtonSize = "40px";
+export const iconButtonBorderRadius = "8px";
+export const densityIconButtonSize = "48px";
+
+export default IconButton;

package/dist/js/brands/sportbild/components/InfoElement.js

@@ -1,12 +1,12 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * BILD Design System Tokens v1.0.79
+ * BILD Design System Tokens v1.2.0
  * Generated by Style Dictionary v4.2.0
  *
  * Context: JavaScript Token Module
  *
- * Copyright (c) 2025 Axel Springer Deutschland GmbH
+ * Copyright (c) 2026 Axel Springer Deutschland GmbH
  * Proprietary and confidential. All rights reserved.
  *
  * Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/js.md

package/dist/js/brands/sportbild/components/InputField.d.ts

@@ -20,22 +20,20 @@ export declare function getInputFieldTokens(colorMode?: 'light' | 'dark', breakp
 export declare const inputFieldStackSpace: string | number;
 export declare const inputFieldInlineSpace: string | number;
 export declare const inputFieldMiniLabelInlineSpace: string | number;
-export declare const inputFieldFontSize: string | number;
+export declare const inputFieldLabelFontSize: string | number;
 export declare const inputFieldImessageInlineSpace: string | number;
 export declare const inputFieldHeightSize: string | number;
 export declare const heyInputContainerInlineSpace: string | number;
 export declare const inputFieldMessageGapSpace: string | number;
-export declare const inputFieldFontFamily: string | number;
+export declare const inputFieldLabelFontFamily: string | number;
+export declare const inputFieldLabelLineHeight: string | number;
 export declare const inputFieldBorderColorIdle: string | number;
 export declare const inputFieldBorderColorActive: string | number;
-export declare const inputFieldBorderColorDark: string | number;
-export declare const inputFieldBorderColorDarkActive: string | number;
-export declare const inputFieldBgColorDarkLowContrast: string | number;
-export declare const inputFieldBgColorDarkMediumContrast: string | number;
-export declare const inputFieldBgColorDarkHighContrast: string | number;
+export declare const inputFieldBorderColorDisabled: string | number;
 export declare const densityInputFieldInlineSpace: string | number;
 export declare const densityInputFieldStackSpace: string | number;
 export declare const densityInputFieldHeightSize: string | number;
 export declare const densityInputFieldLabelFontSize: string | number;
+export declare const densityInputFieldLabelLineHeight: string | number;
 
 export default InputField;

package/dist/js/brands/sportbild/components/InputField.js

@@ -1,12 +1,12 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * BILD Design System Tokens v1.0.79
+ * BILD Design System Tokens v1.2.0
  * Generated by Style Dictionary v4.2.0
  *
  * Context: JavaScript Token Module
  *
- * Copyright (c) 2025 Axel Springer Deutschland GmbH
+ * Copyright (c) 2026 Axel Springer Deutschland GmbH
  * Proprietary and confidential. All rights reserved.
  *
  * Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/js.md
@@ -18,22 +18,14 @@
 export const InputField = {
   "colors": {
     "dark": {
-      "inputFieldBorderColorIdle": "#8C9196",
-      "inputFieldBorderColorActive": "#E9ECEF",
-      "inputFieldBorderColorDark": "#CED4DA",
-      "inputFieldBorderColorDarkActive": "#FFFFFF",
-      "inputFieldBgColorDarkLowContrast": "#343C41",
-      "inputFieldBgColorDarkMediumContrast": "#4B525A",
-      "inputFieldBgColorDarkHighContrast": "#E9ECEF"
+      "inputFieldBorderColorIdle": "#4676C3",
+      "inputFieldBorderColorActive": "#8FACDB",
+      "inputFieldBorderColorDisabled": "#113B72"
     },
     "light": {
-      "inputFieldBorderColorIdle": "#CED4DA",
-      "inputFieldBorderColorActive": "#4B525A",
-      "inputFieldBorderColorDark": "#8C9196",
-      "inputFieldBorderColorDarkActive": "#232629",
-      "inputFieldBgColorDarkLowContrast": "#343C41",
-      "inputFieldBgColorDarkMediumContrast": "#4B525A",
-      "inputFieldBgColorDarkHighContrast": "#E9ECEF"
+      "inputFieldBorderColorIdle": "#6A91CF",
+      "inputFieldBorderColorActive": "#174482",
+      "inputFieldBorderColorDisabled": "#D6E1F2"
     }
   },
   "sizing": {
@@ -41,45 +33,49 @@ export const InputField = {
       "inputFieldStackSpace": "6px",
       "inputFieldInlineSpace": "16px",
       "inputFieldMiniLabelInlineSpace": "4px",
-      "inputFieldFontSize": "16px",
+      "inputFieldLabelFontSize": "16px",
       "inputFieldImessageInlineSpace": "16px",
       "inputFieldHeightSize": "36px",
       "heyInputContainerInlineSpace": "16px",
       "inputFieldMessageGapSpace": "4px",
-      "inputFieldFontFamily": "Inter"
+      "inputFieldLabelFontFamily": "Inter",
+      "inputFieldLabelLineHeight": "16px"
     },
     "md": {
       "inputFieldStackSpace": "6px",
       "inputFieldInlineSpace": "16px",
       "inputFieldMiniLabelInlineSpace": "4px",
-      "inputFieldFontSize": "16px",
+      "inputFieldLabelFontSize": "16px",
       "inputFieldImessageInlineSpace": "16px",
       "inputFieldHeightSize": "36px",
       "heyInputContainerInlineSpace": "8px",
       "inputFieldMessageGapSpace": "4px",
-      "inputFieldFontFamily": "Inter"
+      "inputFieldLabelFontFamily": "Inter",
+      "inputFieldLabelLineHeight": "16px"
     },
     "sm": {
       "inputFieldStackSpace": "6px",
       "inputFieldInlineSpace": "16px",
       "inputFieldMiniLabelInlineSpace": "4px",
-      "inputFieldFontSize": "16px",
+      "inputFieldLabelFontSize": "16px",
       "inputFieldImessageInlineSpace": "16px",
       "inputFieldHeightSize": "36px",
       "heyInputContainerInlineSpace": "8px",
       "inputFieldMessageGapSpace": "4px",
-      "inputFieldFontFamily": "Inter"
+      "inputFieldLabelFontFamily": "Inter",
+      "inputFieldLabelLineHeight": "16px"
     },
     "xs": {
       "inputFieldStackSpace": "6px",
       "inputFieldInlineSpace": "16px",
       "inputFieldMiniLabelInlineSpace": "4px",
-      "inputFieldFontSize": "16px",
+      "inputFieldLabelFontSize": "16px",
       "inputFieldImessageInlineSpace": "16px",
       "inputFieldHeightSize": "36px",
       "heyInputContainerInlineSpace": "8px",
       "inputFieldMessageGapSpace": "4px",
-      "inputFieldFontFamily": "Inter"
+      "inputFieldLabelFontFamily": "Inter",
+      "inputFieldLabelLineHeight": "16px"
     }
   },
   "density": {
@@ -87,24 +83,27 @@ export const InputField = {
       "densityInputFieldInlineSpace": "16px",
       "densityInputFieldStackSpace": "8px",
       "densityInputFieldHeightSize": "40px",
-      "densityInputFieldLabelFontSize": "17px"
+      "densityInputFieldLabelFontSize": "17px",
+      "densityInputFieldLabelLineHeight": "17px"
     },
     "dense": {
       "densityInputFieldInlineSpace": "16px",
       "densityInputFieldStackSpace": "6px",
       "densityInputFieldHeightSize": "36px",
-      "densityInputFieldLabelFontSize": "16px"
+      "densityInputFieldLabelFontSize": "16px",
+      "densityInputFieldLabelLineHeight": "16px"
     },
     "spacious": {
       "densityInputFieldInlineSpace": "16px",
       "densityInputFieldStackSpace": "12px",
       "densityInputFieldHeightSize": "48px",
-      "densityInputFieldLabelFontSize": "19px"
+      "densityInputFieldLabelFontSize": "19px",
+      "densityInputFieldLabelLineHeight": "19px"
     }
   },
   "typography": {
     "lg": {
-      "textInputFieldLabel": {
+      "inputFieldLabel": {
         "fontFamily": "Inter",
         "fontWeight": 400,
         "fontSize": "16px",
@@ -112,7 +111,7 @@ export const InputField = {
       }
     },
     "md": {
-      "textInputFieldLabel": {
+      "inputFieldLabel": {
         "fontFamily": "Inter",
         "fontWeight": 400,
         "fontSize": "16px",
@@ -120,7 +119,7 @@ export const InputField = {
       }
     },
     "sm": {
-      "textInputFieldLabel": {
+      "inputFieldLabel": {
         "fontFamily": "Inter",
         "fontWeight": 400,
         "fontSize": "16px",
@@ -128,7 +127,7 @@ export const InputField = {
       }
     },
     "xs": {
-      "textInputFieldLabel": {
+      "inputFieldLabel": {
         "fontFamily": "Inter",
         "fontWeight": 400,
         "fontSize": "16px",
@@ -147,25 +146,23 @@ export const getInputFieldTokens = (colorMode = 'light', breakpoint = 'md', dens
 });
 
 // Flat exports for tree-shaking
-export const inputFieldBorderColorIdle = "#CED4DA";
-export const inputFieldBorderColorActive = "#4B525A";
-export const inputFieldBorderColorDark = "#8C9196";
-export const inputFieldBorderColorDarkActive = "#232629";
-export const inputFieldBgColorDarkLowContrast = "#343C41";
-export const inputFieldBgColorDarkMediumContrast = "#4B525A";
-export const inputFieldBgColorDarkHighContrast = "#E9ECEF";
+export const inputFieldBorderColorIdle = "#6A91CF";
+export const inputFieldBorderColorActive = "#174482";
+export const inputFieldBorderColorDisabled = "#D6E1F2";
 export const inputFieldStackSpace = "6px";
 export const inputFieldInlineSpace = "16px";
 export const inputFieldMiniLabelInlineSpace = "4px";
-export const inputFieldFontSize = "16px";
+export const inputFieldLabelFontSize = "16px";
 export const inputFieldImessageInlineSpace = "16px";
 export const inputFieldHeightSize = "36px";
 export const heyInputContainerInlineSpace = "8px";
 export const inputFieldMessageGapSpace = "4px";
-export const inputFieldFontFamily = "Inter";
+export const inputFieldLabelFontFamily = "Inter";
+export const inputFieldLabelLineHeight = "16px";
 export const densityInputFieldInlineSpace = "16px";
 export const densityInputFieldStackSpace = "8px";
 export const densityInputFieldHeightSize = "40px";
 export const densityInputFieldLabelFontSize = "17px";
+export const densityInputFieldLabelLineHeight = "17px";
 
 export default InputField;

package/dist/js/brands/sportbild/components/Kicker.js

@@ -1,12 +1,12 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * BILD Design System Tokens v1.0.79
+ * BILD Design System Tokens v1.2.0
  * Generated by Style Dictionary v4.2.0
  *
  * Context: JavaScript Token Module
  *
- * Copyright (c) 2025 Axel Springer Deutschland GmbH
+ * Copyright (c) 2026 Axel Springer Deutschland GmbH
  * Proprietary and confidential. All rights reserved.
  *
  * Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/js.md
@@ -18,7 +18,7 @@
 export const Kicker = {
   "colors": {
     "dark": {
-      "kickerBgColorOnSurface": "#8C9196",
+      "kickerBgColorOnSurface": "#C3C9DB",
       "kickerFitbookBgColor": "#FF97B7",
       "kickerPetbookBgColor": "#B9DB91",
       "kickerMyhomebookBgColor": "#66CCCC",

package/dist/js/brands/sportbild/components/LiveTicker.js

@@ -1,12 +1,12 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * BILD Design System Tokens v1.0.79
+ * BILD Design System Tokens v1.2.0
  * Generated by Style Dictionary v4.2.0
  *
  * Context: JavaScript Token Module
  *
- * Copyright (c) 2025 Axel Springer Deutschland GmbH
+ * Copyright (c) 2026 Axel Springer Deutschland GmbH
  * Proprietary and confidential. All rights reserved.
  *
  * Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/js.md

package/dist/js/brands/sportbild/components/MediaPlayer.d.ts

@@ -37,5 +37,6 @@ export declare const vidPlayerControlButtonsBgColorPressed: string | number;
 export declare const vidPlayerProgressBarPreloadBgColor: string | number;
 export declare const vidPlayerUnmuteButtonBgColor: string | number;
 export declare const vidPlayerUnmuteButtonBgColorHover: string | number;
+export declare const vidPlayerProgressBarAdBgColor: string | number;
 
 export default MediaPlayer;