@skyscanner/bpk-foundations-web - npm Package Compare versions

Comparing version 9.4.0 to 9.5.0

package.json

 {
   "name": "@skyscanner/bpk-foundations-web",
-  "version": "9.4.0",
+  "version": "9.5.0",
   "description": "Common Backpack design tokens for colors, spacing, font, etc.",
@@ -20,6 +20,6 @@ "license": "Apache-2.0",
   "dependencies": {
-    "@skyscanner/bpk-foundations-common": "^3.1.0",
+    "@skyscanner/bpk-foundations-common": "^3.1.1",
     "color": "^3.0.0"
   },
-  "gitHead": "c11f56a16d5b77c637e9b5d2efbdcb4704f34399"
+  "gitHead": "e89efa2bc614f36763312b0ddf22f79178df06b5"
 }

tokens/base.common.js

@@ -161,4 +161,18 @@ /*
   marcommsEcoGreen: "rgb(15, 161, 169)",
+  privateChipOnDarkNormalBackgroundDay: "rgba(255, 255, 255, 0.2)",
+  privateChipOnDarkPressedBackgroundNight: "rgb(0, 40, 84)",
+  privateChipOnDarkOnBackgroundNight: "rgb(11, 18, 29)",
+  privateChipOnDarkPressedBackgroundDay: "rgb(198, 204, 212)",
+  privateChipDefaultNormalBackgroundNight: "rgb(11, 18, 29)",
+  privateChipOnDarkOnBackgroundDay: "rgb(255, 255, 255)",
+  privateChipDefaultNormalBackgroundDay: "rgb(221, 221, 229)",
+  privateChipDefaultOnBackgroundNight: "rgb(5, 65, 132)",
+  privateChipDisabledBackgroundNight: "rgb(11, 17, 26)",
+  privateChipDefaultOnBackgroundDay: "rgb(5, 32, 60)",
+  privateChipDisabledBackgroundDay: "rgb(221, 225, 228)",
+  privateChipDefaultPressedBackgroundNight: "rgb(0, 40, 84)",
+  privateChipDefaultPressedBackgroundDay: "rgb(198, 204, 212)",
+  privateChipOnDarkNormalBackgroundNight: "rgb(11, 18, 29)",
   autosuggestListBackgroundColor: "rgb(255, 255, 255)",
-  autosuggestListItemActiveBackgroundColor: "rgb(221, 221, 229)",
+  autosuggestListItemActiveBackgroundColor: "rgb(241, 242, 248)",
   autosuggestListItemHighlightedBackgroundColor: "rgb(241, 242, 248)",
@@ -165,0 +179,0 @@ badgePaddingY: ".25rem",

tokens/base.es6.js

@@ -159,4 +159,18 @@ /*
 export const marcommsEcoGreen = "rgb(15, 161, 169)";
+export const privateChipOnDarkNormalBackgroundDay = "rgba(255, 255, 255, 0.2)";
+export const privateChipOnDarkPressedBackgroundNight = "rgb(0, 40, 84)";
+export const privateChipOnDarkOnBackgroundNight = "rgb(11, 18, 29)";
+export const privateChipOnDarkPressedBackgroundDay = "rgb(198, 204, 212)";
+export const privateChipDefaultNormalBackgroundNight = "rgb(11, 18, 29)";
+export const privateChipOnDarkOnBackgroundDay = "rgb(255, 255, 255)";
+export const privateChipDefaultNormalBackgroundDay = "rgb(221, 221, 229)";
+export const privateChipDefaultOnBackgroundNight = "rgb(5, 65, 132)";
+export const privateChipDisabledBackgroundNight = "rgb(11, 17, 26)";
+export const privateChipDefaultOnBackgroundDay = "rgb(5, 32, 60)";
+export const privateChipDisabledBackgroundDay = "rgb(221, 225, 228)";
+export const privateChipDefaultPressedBackgroundNight = "rgb(0, 40, 84)";
+export const privateChipDefaultPressedBackgroundDay = "rgb(198, 204, 212)";
+export const privateChipOnDarkNormalBackgroundNight = "rgb(11, 18, 29)";
 export const autosuggestListBackgroundColor = "rgb(255, 255, 255)";
-export const autosuggestListItemActiveBackgroundColor = "rgb(221, 221, 229)";
+export const autosuggestListItemActiveBackgroundColor = "rgb(241, 242, 248)";
 export const autosuggestListItemHighlightedBackgroundColor = "rgb(241, 242, 248)";
@@ -814,2 +828,18 @@ export const badgePaddingY = ".25rem";
 };
+export const chipColors = {
+privateChipOnDarkNormalBackgroundDay,
+privateChipOnDarkPressedBackgroundNight,
+privateChipOnDarkOnBackgroundNight,
+privateChipOnDarkPressedBackgroundDay,
+privateChipDefaultNormalBackgroundNight,
+privateChipOnDarkOnBackgroundDay,
+privateChipDefaultNormalBackgroundDay,
+privateChipDefaultOnBackgroundNight,
+privateChipDisabledBackgroundNight,
+privateChipDefaultOnBackgroundDay,
+privateChipDisabledBackgroundDay,
+privateChipDefaultPressedBackgroundNight,
+privateChipDefaultPressedBackgroundDay,
+privateChipOnDarkNormalBackgroundNight,
+};
 export const colors = {
@@ -816,0 +846,0 @@ colorSkyBlueShade03,

tokens/breakpoints.common.js

@@ -158,2 +158,16 @@ /*
   marcommsEcoGreen: "rgb(15, 161, 169)",
+  privateChipOnDarkNormalBackgroundDay: "rgba(255, 255, 255, 0.2)",
+  privateChipOnDarkPressedBackgroundNight: "rgb(0, 40, 84)",
+  privateChipOnDarkOnBackgroundNight: "rgb(11, 18, 29)",
+  privateChipOnDarkPressedBackgroundDay: "rgb(198, 204, 212)",
+  privateChipDefaultNormalBackgroundNight: "rgb(11, 18, 29)",
+  privateChipOnDarkOnBackgroundDay: "rgb(255, 255, 255)",
+  privateChipDefaultNormalBackgroundDay: "rgb(221, 221, 229)",
+  privateChipDefaultOnBackgroundNight: "rgb(5, 65, 132)",
+  privateChipDisabledBackgroundNight: "rgb(11, 17, 26)",
+  privateChipDefaultOnBackgroundDay: "rgb(5, 32, 60)",
+  privateChipDisabledBackgroundDay: "rgb(221, 225, 228)",
+  privateChipDefaultPressedBackgroundNight: "rgb(0, 40, 84)",
+  privateChipDefaultPressedBackgroundDay: "rgb(198, 204, 212)",
+  privateChipOnDarkNormalBackgroundNight: "rgb(11, 18, 29)",
   breakpointQueryTabletOnly: "(min-width: 32.0625rem) and (max-width: 64rem)",
@@ -160,0 +174,0 @@ breakpointSmallTabletMargin: "1.5rem",

tokens/breakpoints.es6.js

@@ -156,2 +156,16 @@ /*
 export const marcommsEcoGreen = "rgb(15, 161, 169)";
+export const privateChipOnDarkNormalBackgroundDay = "rgba(255, 255, 255, 0.2)";
+export const privateChipOnDarkPressedBackgroundNight = "rgb(0, 40, 84)";
+export const privateChipOnDarkOnBackgroundNight = "rgb(11, 18, 29)";
+export const privateChipOnDarkPressedBackgroundDay = "rgb(198, 204, 212)";
+export const privateChipDefaultNormalBackgroundNight = "rgb(11, 18, 29)";
+export const privateChipOnDarkOnBackgroundDay = "rgb(255, 255, 255)";
+export const privateChipDefaultNormalBackgroundDay = "rgb(221, 221, 229)";
+export const privateChipDefaultOnBackgroundNight = "rgb(5, 65, 132)";
+export const privateChipDisabledBackgroundNight = "rgb(11, 17, 26)";
+export const privateChipDefaultOnBackgroundDay = "rgb(5, 32, 60)";
+export const privateChipDisabledBackgroundDay = "rgb(221, 225, 228)";
+export const privateChipDefaultPressedBackgroundNight = "rgb(0, 40, 84)";
+export const privateChipDefaultPressedBackgroundDay = "rgb(198, 204, 212)";
+export const privateChipOnDarkNormalBackgroundNight = "rgb(11, 18, 29)";
 export const breakpointQueryTabletOnly = "(min-width: 32.0625rem) and (max-width: 64rem)";
@@ -203,2 +217,18 @@ export const breakpointSmallTabletMargin = "1.5rem";
 };
+export const chipColors = {
+privateChipOnDarkNormalBackgroundDay,
+privateChipOnDarkPressedBackgroundNight,
+privateChipOnDarkOnBackgroundNight,
+privateChipOnDarkPressedBackgroundDay,
+privateChipDefaultNormalBackgroundNight,
+privateChipOnDarkOnBackgroundDay,
+privateChipDefaultNormalBackgroundDay,
+privateChipDefaultOnBackgroundNight,
+privateChipDisabledBackgroundNight,
+privateChipDefaultOnBackgroundDay,
+privateChipDisabledBackgroundDay,
+privateChipDefaultPressedBackgroundNight,
+privateChipDefaultPressedBackgroundDay,
+privateChipOnDarkNormalBackgroundNight,
+};
 export const colors = {
@@ -205,0 +235,0 @@ colorSkyBlueShade03,

tokens/breakpoints.raw.json

@@ -1459,2 +1459,100 @@ {
     },
+    "PRIVATE_CHIP_ON_DARK_NORMAL_BACKGROUND_DAY": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgba(255, 255, 255, 0.2)",
+      "originalValue": "#FFFFFF33",
+      "name": "PRIVATE_CHIP_ON_DARK_NORMAL_BACKGROUND_DAY"
+    },
+    "PRIVATE_CHIP_ON_DARK_PRESSED_BACKGROUND_NIGHT": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(0, 40, 84)",
+      "originalValue": "#002854",
+      "name": "PRIVATE_CHIP_ON_DARK_PRESSED_BACKGROUND_NIGHT"
+    },
+    "PRIVATE_CHIP_ON_DARK_ON_BACKGROUND_NIGHT": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(11, 18, 29)",
+      "originalValue": "#0B121D",
+      "name": "PRIVATE_CHIP_ON_DARK_ON_BACKGROUND_NIGHT"
+    },
+    "PRIVATE_CHIP_ON_DARK_PRESSED_BACKGROUND_DAY": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(198, 204, 212)",
+      "originalValue": "#C6CCD4",
+      "name": "PRIVATE_CHIP_ON_DARK_PRESSED_BACKGROUND_DAY"
+    },
+    "PRIVATE_CHIP_DEFAULT_NORMAL_BACKGROUND_NIGHT": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(11, 18, 29)",
+      "originalValue": "#0B121D",
+      "name": "PRIVATE_CHIP_DEFAULT_NORMAL_BACKGROUND_NIGHT"
+    },
+    "PRIVATE_CHIP_ON_DARK_ON_BACKGROUND_DAY": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(255, 255, 255)",
+      "originalValue": "{!WHITE}",
+      "name": "PRIVATE_CHIP_ON_DARK_ON_BACKGROUND_DAY"
+    },
+    "PRIVATE_CHIP_DEFAULT_NORMAL_BACKGROUND_DAY": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(221, 221, 229)",
+      "originalValue": "{!GREY_20}",
+      "name": "PRIVATE_CHIP_DEFAULT_NORMAL_BACKGROUND_DAY"
+    },
+    "PRIVATE_CHIP_DEFAULT_ON_BACKGROUND_NIGHT": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(5, 65, 132)",
+      "originalValue": "#054184",
+      "name": "PRIVATE_CHIP_DEFAULT_ON_BACKGROUND_NIGHT"
+    },
+    "PRIVATE_CHIP_DISABLED_BACKGROUND_NIGHT": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(11, 17, 26)",
+      "originalValue": "#0B111A",
+      "name": "PRIVATE_CHIP_DISABLED_BACKGROUND_NIGHT"
+    },
+    "PRIVATE_CHIP_DEFAULT_ON_BACKGROUND_DAY": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(5, 32, 60)",
+      "originalValue": "#05203C",
+      "name": "PRIVATE_CHIP_DEFAULT_ON_BACKGROUND_DAY"
+    },
+    "PRIVATE_CHIP_DISABLED_BACKGROUND_DAY": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(221, 225, 228)",
+      "originalValue": "#DDE1E4",
+      "name": "PRIVATE_CHIP_DISABLED_BACKGROUND_DAY"
+    },
+    "PRIVATE_CHIP_DEFAULT_PRESSED_BACKGROUND_NIGHT": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(0, 40, 84)",
+      "originalValue": "#002854",
+      "name": "PRIVATE_CHIP_DEFAULT_PRESSED_BACKGROUND_NIGHT"
+    },
+    "PRIVATE_CHIP_DEFAULT_PRESSED_BACKGROUND_DAY": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(198, 204, 212)",
+      "originalValue": "#C6CCD4",
+      "name": "PRIVATE_CHIP_DEFAULT_PRESSED_BACKGROUND_DAY"
+    },
+    "PRIVATE_CHIP_ON_DARK_NORMAL_BACKGROUND_NIGHT": {
+      "type": "color",
+      "category": "chip-colors",
+      "value": "rgb(11, 18, 29)",
+      "originalValue": "#0B121D",
+      "name": "PRIVATE_CHIP_ON_DARK_NORMAL_BACKGROUND_NIGHT"
+    },
     "BREAKPOINT_QUERY_TABLET_ONLY": {
@@ -1461,0 +1559,0 @@ "category": "breakpoints",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

402201

increased by4.39%

Lines of code

8868

increased by3.31%

Dependency changes

• Updated@skyscanner/bpk-foundations-common@^3.1.1