@skyscanner/bpk-foundations-web 19.4.1 → 19.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyscanner/bpk-foundations-web",
-  "version": "19.4.1",
+  "version": "19.5.0",
   "description": "Common Backpack design tokens for colors, spacing, font, etc.",
   "license": "Apache-2.0",
   "repository": {
@@ -17,8 +17,8 @@
     "tokens": "gulp"
   },
   "dependencies": {
-    "@skyscanner/bpk-foundations-common": "^19.4.1",
+    "@skyscanner/bpk-foundations-common": "^19.5.0",
     "color": "^5.0.0"
   },
-  "gitHead": "fce6283d9a98b0480a45aaab5480729bb66fbc15"
+  "gitHead": "c8e6bfdec3c44f7ecc387aaab19d68949b6a032c"
 }

package/tokens/base.common.js

@@ -345,6 +345,8 @@ module.exports = {
   iconSizeSm: "1rem",
   iconSizeLg: "1.5rem",
   iconSizeXl: "2rem",
+  iconSizeXxl: "2.5rem",
+  iconSizeXxxl: "3rem",
   modalBackgroundColor: "rgb(255, 255, 255)",
   modalInitialOpacity: "0",
   modalOpacity: "1",

package/tokens/base.default.scss

@@ -669,6 +669,10 @@ $bpk-icon-size-sm: 1rem !default;
 $bpk-icon-size-lg: 1.5rem !default;
 /// @group icons
 $bpk-icon-size-xl: 2rem !default;
+/// @group icons
+$bpk-icon-size-xxl: 2.5rem !default;
+/// @group icons
+$bpk-icon-size-xxxl: 3rem !default;
 /// @group modals
 $bpk-modal-background-color: rgb(255, 255, 255) !default;
 /// @group modals

package/tokens/base.es6.d.ts

@@ -343,6 +343,8 @@ export declare const horizontalNavBarSelectedColor = "rgb(0, 98, 227)" as const;
 export declare const iconSizeSm = "1rem" as const;
 export declare const iconSizeLg = "1.5rem" as const;
 export declare const iconSizeXl = "2rem" as const;
+export declare const iconSizeXxl = "2.5rem" as const;
+export declare const iconSizeXxxl = "3rem" as const;
 export declare const modalBackgroundColor = "rgb(255, 255, 255)" as const;
 export declare const modalInitialOpacity = "0" as const;
 export declare const modalOpacity = "1" as const;
@@ -640,6 +642,8 @@ export declare const icons = {
 iconSizeSm,
 iconSizeLg,
 iconSizeXl,
+iconSizeXxl,
+iconSizeXxxl,
 } as const;
 export declare const infoBannerColors = {
 privateInfoBannerDefaultDay,

package/tokens/base.es6.js

@@ -343,6 +343,8 @@ export const horizontalNavBarSelectedColor = "rgb(0, 98, 227)";
 export const iconSizeSm = "1rem";
 export const iconSizeLg = "1.5rem";
 export const iconSizeXl = "2rem";
+export const iconSizeXxl = "2.5rem";
+export const iconSizeXxxl = "3rem";
 export const modalBackgroundColor = "rgb(255, 255, 255)";
 export const modalInitialOpacity = "0";
 export const modalOpacity = "1";
@@ -640,6 +642,8 @@ export const icons = {
 iconSizeSm,
 iconSizeLg,
 iconSizeXl,
+iconSizeXxl,
+iconSizeXxxl,
 };
 export const infoBannerColors = {
 privateInfoBannerDefaultDay,

package/tokens/base.raw.json

@@ -2815,6 +2815,20 @@
       "originalValue": "2rem",
       "name": "ICON_SIZE_XL"
     },
+    "ICON_SIZE_XXL": {
+      "type": "size",
+      "category": "icons",
+      "value": "2.5rem",
+      "originalValue": "2.5rem",
+      "name": "ICON_SIZE_XXL"
+    },
+    "ICON_SIZE_XXXL": {
+      "type": "size",
+      "category": "icons",
+      "value": "3rem",
+      "originalValue": "3rem",
+      "name": "ICON_SIZE_XXXL"
+    },
     "MODAL_BACKGROUND_COLOR": {
       "category": "modals",
       "value": "rgb(255, 255, 255)",

package/tokens/base.scss

@@ -669,6 +669,10 @@ $bpk-icon-size-sm: 1rem;
 $bpk-icon-size-lg: 1.5rem;
 /// @group icons
 $bpk-icon-size-xl: 2rem;
+/// @group icons
+$bpk-icon-size-xxl: 2.5rem;
+/// @group icons
+$bpk-icon-size-xxxl: 3rem;
 /// @group modals
 $bpk-modal-background-color: rgb(255, 255, 255);
 /// @group modals