@skyscanner/backpack-web 9.2.0-beta.1 → 9.2.0

package/bpk-component-drawer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-drawer",
-  "version": "7.0.1",
+  "version": "7.0.2",
   "description": "Backpack drawer component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,13 +14,13 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-close-button": "^4.0.1",
-    "bpk-component-icon": "^10.0.1",
-    "bpk-component-link": "^4.0.1",
-    "bpk-mixins": "^31.4.0",
+    "@skyscanner/bpk-foundations-web": "^9.0.0",
+    "bpk-component-close-button": "^4.0.2",
+    "bpk-component-icon": "^10.0.2",
+    "bpk-component-link": "^4.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
-    "bpk-scrim-utils": "^6.0.1",
+    "bpk-scrim-utils": "^6.0.2",
     "prop-types": "^15.7.2",
     "react-transition-group": "^2.5.3"
   },
@@ -28,7 +28,7 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-text": "^8.0.1"
+    "bpk-component-button": "^7.0.2",
+    "bpk-component-text": "^8.0.2"
   }
 }

package/bpk-component-fieldset/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-fieldset",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "description": "Backpack fieldset component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,9 +14,9 @@
   },
   "gitHead": "4e4ec9add28e1db54d6a38a10c331bbd163f2926",
   "dependencies": {
-    "bpk-component-form-validation": "^5.0.1",
-    "bpk-component-label": "^6.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-form-validation": "^5.0.2",
+    "bpk-component-label": "^6.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
@@ -24,13 +24,13 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-autosuggest": "^7.0.1",
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-calendar": "^12.0.1",
-    "bpk-component-checkbox": "^5.0.1",
-    "bpk-component-datepicker": "^18.0.1",
-    "bpk-component-input": "^7.0.1",
-    "bpk-component-select": "^6.0.1",
-    "bpk-component-textarea": "^5.0.1"
+    "bpk-component-autosuggest": "^7.0.2",
+    "bpk-component-button": "^7.0.2",
+    "bpk-component-calendar": "^12.0.2",
+    "bpk-component-checkbox": "^5.0.2",
+    "bpk-component-datepicker": "^18.0.2",
+    "bpk-component-input": "^7.0.2",
+    "bpk-component-select": "^6.0.2",
+    "bpk-component-textarea": "^5.0.2"
   }
 }

package/bpk-component-flare/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-flare",
-  "version": "3.0.1",
+  "version": "3.0.2",
   "description": "Backpack FlareBar and ContentBubble component.",
   "license": "Apache-2.0",
   "repository": {
@@ -17,9 +17,9 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-component-label": "^6.0.1",
-    "bpk-component-text": "^8.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-label": "^6.0.2",
+    "bpk-component-text": "^8.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },

package/bpk-component-floating-notification/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-floating-notification",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "Backpack floating-notification component.",
   "license": "Apache-2.0",
   "repository": {
@@ -13,10 +13,10 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "bpk-component-aria-live": "^3.0.1",
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-text": "^8.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-aria-live": "^3.0.2",
+    "bpk-component-button": "^7.0.2",
+    "bpk-component-text": "^8.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.5.8"
   },

package/bpk-component-form-validation/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-form-validation",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "description": "Backpack form-validation component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-animate-height": "^5.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-animate-height": "^5.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
@@ -23,12 +23,12 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-checkbox": "^5.0.1",
-    "bpk-component-icon": "^10.0.1",
-    "bpk-component-input": "^7.0.1",
-    "bpk-component-select": "^6.0.1",
-    "bpk-component-textarea": "^5.0.1"
+    "@skyscanner/bpk-foundations-web": "^9.0.0",
+    "bpk-component-button": "^7.0.2",
+    "bpk-component-checkbox": "^5.0.2",
+    "bpk-component-icon": "^10.0.2",
+    "bpk-component-input": "^7.0.2",
+    "bpk-component-select": "^6.0.2",
+    "bpk-component-textarea": "^5.0.2"
   }
 }

package/bpk-component-graphic-promotion/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-graphic-promotion",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "description": "Backpack graphic-promotion component.",
   "license": "Apache-2.0",
   "repository": {
@@ -13,9 +13,9 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-text": "^8.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-button": "^7.0.2",
+    "bpk-component-text": "^8.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0"
   },
   "peerDependencies": {

package/bpk-component-graphic-promotion/src/BpkGraphicPromo-test.tsx

@@ -18,7 +18,9 @@
 
 import React from 'react';
 import { fireEvent, render } from '@testing-library/react';
-import { cssModules } from 'bpk-react-utils';
+
+// @ts-expect-error Untyped import. Not added as a stub declaration so consumers still have the suppression in their node_modules when shipped untranspiled.
+import { cssModules } from '../../bpk-react-utils';
 
 import BpkGraphicPromo, { TEXT_ALIGN } from './BpkGraphicPromo';
 import type { Props } from './BpkGraphicPromo';
@@ -40,6 +42,7 @@ const props: Props = {
     'Portugal and 6 more countries have just been added to the UK travel green list',
   tagline: 'Tagline',
   textAlign: TEXT_ALIGN.start,
+  contentId: 'mock-content-id',
 };
 
 describe('BpkGraphicPromo', () => {
@@ -121,9 +124,9 @@ describe('BpkGraphicPromo', () => {
     expect(props.onClick).toHaveBeenCalledTimes(1);
   });
 
-  it('should render correctly with a content ID', () => {
+  it('should render as expected without a content ID', () => {
     const { asFragment } = render(
-      <BpkGraphicPromo contentId="content-id" {...props} />,
+      <BpkGraphicPromo {...props} contentId={null} />,
     );
 
     expect(asFragment()).toMatchSnapshot();

package/bpk-component-graphic-promotion/src/BpkGraphicPromo.tsx

@@ -17,9 +17,13 @@
  */
 
 import React from 'react';
-import { cssModules } from 'bpk-react-utils';
-import BpkText from 'bpk-component-text';
-import BpkButton from 'bpk-component-button';
+
+// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
+import { cssModules } from '../../bpk-react-utils';
+// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
+import BpkText from '../../bpk-component-text';
+// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
+import BpkButton from '../../bpk-component-button';
 
 import STYLES from './BpkGraphicPromo.module.scss';
 
@@ -41,45 +45,45 @@ export const TEXT_ALIGN = {
 } as const;
 
 export type Props = {
-  buttonText: string;
   className?: string | null;
   contentId?: string | null;
+  tagline?: string | null;
   headline: string;
-  invertVertically?: boolean;
-  onClick: () => void;
+  subheading?: string | null;
   sponsor?: {
     label: string;
     logo: string;
     altText: string;
   } | null;
-  style?: {};
-  subheading?: string | null;
-  tagline?: string | null;
+  buttonText: string;
+  onClick: () => void;
+  invertVertically?: boolean;
   textAlign: typeof TEXT_ALIGN[keyof typeof TEXT_ALIGN];
+  style?: {};
 };
 
-const constructAriaLabel = (
-  buttonText: Props['buttonText'],
-  headline: Props['headline'],
-  sponsor: Props['sponsor'],
-  subheading: Props['subheading'],
-  tagline: Props['tagline'],
-) => {
+const constructAriaLabel = ({
+  buttonText,
+  headline,
+  sponsor,
+  subheading,
+  tagline,
+}: Pick<
+  Props,
+  'buttonText' | 'headline' | 'sponsor' | 'subheading' | 'tagline'
+>) => {
   const text: string[] = [];
-  const addText = (value: string) => value && text.push(value);
+  const addText = (value?: string | null) => value && text.push(value);
 
   if (sponsor) {
     addText(sponsor.label);
     addText(sponsor.altText);
-  } else if (tagline) {
+  } else {
     addText(tagline);
   }
 
-  if (subheading) {
-    addText(subheading);
-  }
-
   addText(headline);
+  addText(subheading);
   addText(buttonText);
 
   return text.join('. ');
@@ -125,13 +129,13 @@ const BpkGraphicPromo = ({
       className={cardClasses}
       style={style}
       role="link"
-      aria-label={constructAriaLabel(
+      aria-label={constructAriaLabel({
         buttonText,
         headline,
         sponsor,
         subheading,
         tagline,
-      )}
+      })}
       tabIndex={0}
       onClick={onClickWrapper}
       onKeyDown={onKeyWrapper}

package/bpk-component-grid/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-grid",
-  "version": "4.0.1",
+  "version": "4.0.2",
   "description": "Backpack grid components.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },

package/bpk-component-grid-toggle/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-grid-toggle",
-  "version": "4.0.1",
+  "version": "4.0.2",
   "description": "Backpack vertical grid toggle component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-component-link": "^4.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-link": "^4.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },

package/bpk-component-horizontal-nav/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-horizontal-nav",
-  "version": "6.0.1",
+  "version": "6.0.2",
   "description": "Backpack horizontal nav component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-component-mobile-scroll-container": "^4.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-mobile-scroll-container": "^4.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
@@ -23,8 +23,8 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-text": "^8.0.1",
-    "bpk-storybook-utils": "^2.0.1"
+    "@skyscanner/bpk-foundations-web": "^9.0.0",
+    "bpk-component-text": "^8.0.2",
+    "bpk-storybook-utils": "^2.0.2"
   }
 }

package/bpk-component-icon/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-icon",
-  "version": "10.0.1",
+  "version": "10.0.2",
   "description": "Backpack icon components.",
   "license": "Apache-2.0",
   "repository": {
@@ -17,16 +17,16 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "@skyscanner/bpk-svgs": "^14.3.6",
-    "bpk-mixins": "^31.4.0",
+    "@skyscanner/bpk-foundations-web": "^9.0.0",
+    "@skyscanner/bpk-svgs": "^14.3.8",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
   "devDependencies": {
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-list": "^5.0.1",
-    "bpk-component-text": "^8.0.1"
+    "bpk-component-button": "^7.0.2",
+    "bpk-component-list": "^5.0.2",
+    "bpk-component-text": "^8.0.2"
   },
   "peerDependencies": {
     "react": "^17.0.2"

package/bpk-component-image/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-image",
-  "version": "6.0.1",
+  "version": "6.0.2",
   "description": "Backpack image component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,9 +14,9 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-component-spinner": "^6.0.1",
-    "bpk-mixins": "^31.4.0",
+    "@skyscanner/bpk-foundations-web": "^9.0.0",
+    "bpk-component-spinner": "^6.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2",
     "react-transition-group": "^2.5.3"
@@ -25,7 +25,7 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-mobile-scroll-container": "^4.0.1",
-    "bpk-component-text": "^8.0.1"
+    "bpk-component-mobile-scroll-container": "^4.0.2",
+    "bpk-component-text": "^8.0.2"
   }
 }

package/bpk-component-infinite-scroll/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-infinite-scroll",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "description": "Backpack infinite scroll component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "intersection-observer": "^0.7.0",
     "prop-types": "^15.7.2"
@@ -23,9 +23,9 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-list": "^5.0.1",
-    "bpk-component-spinner": "^6.0.1",
-    "bpk-storybook-utils": "^2.0.1"
+    "bpk-component-button": "^7.0.2",
+    "bpk-component-list": "^5.0.2",
+    "bpk-component-spinner": "^6.0.2",
+    "bpk-storybook-utils": "^2.0.2"
   }
 }

package/bpk-component-input/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-input",
-  "version": "7.0.1",
+  "version": "7.0.2",
   "description": "Backpack input component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "4e4ec9add28e1db54d6a38a10c331bbd163f2926",
   "dependencies": {
-    "bpk-component-icon": "^10.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-icon": "^10.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
@@ -23,8 +23,8 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-banner-alert": "^7.0.1",
-    "bpk-component-label": "^6.0.1",
-    "bpk-storybook-utils": "^2.0.1"
+    "bpk-component-banner-alert": "^7.0.2",
+    "bpk-component-label": "^6.0.2",
+    "bpk-storybook-utils": "^2.0.2"
   }
 }

package/bpk-component-label/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-label",
-  "version": "6.0.1",
+  "version": "6.0.2",
   "description": "Backpack label component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },

package/bpk-component-link/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-link",
-  "version": "4.0.1",
+  "version": "4.0.2",
   "description": "Backpack link component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
@@ -22,7 +22,7 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.5.0",
-    "bpk-storybook-utils": "^2.0.1"
+    "@skyscanner/bpk-foundations-web": "^9.0.0",
+    "bpk-storybook-utils": "^2.0.2"
   }
 }

package/bpk-component-list/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-list",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "description": "Backpack list component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^31.4.0",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },

package/bpk-component-loading-button/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-loading-button",
-  "version": "7.0.1",
+  "version": "7.0.2",
   "description": "Backpack loading button component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,15 +14,15 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-component-button": "^7.0.1",
-    "bpk-component-icon": "^10.0.1",
-    "bpk-component-spinner": "^6.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-button": "^7.0.2",
+    "bpk-component-icon": "^10.0.2",
+    "bpk-component-spinner": "^6.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.7.2"
   },
   "devDependencies": {
-    "bpk-storybook-utils": "^2.0.1"
+    "bpk-storybook-utils": "^2.0.2"
   },
   "peerDependencies": {
     "react": "^17.0.2"

package/bpk-component-map/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-map",
-  "version": "7.0.1",
+  "version": "7.1.0",
   "description": "Backpack map component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,8 +15,8 @@
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
     "@react-google-maps/api": "^2.8.1",
-    "bpk-component-spinner": "^6.0.1",
-    "bpk-mixins": "^31.4.0",
+    "bpk-component-spinner": "^6.0.2",
+    "bpk-mixins": "^31.5.0",
     "bpk-react-utils": "^7.0.0",
     "prop-types": "^15.5.8"
   },
@@ -24,9 +24,9 @@
     "react": "^17.0.2"
   },
   "devDependencies": {
-    "bpk-component-icon": "^10.0.1",
-    "bpk-component-text": "^8.0.1",
-    "bpk-storybook-utils": "^2.0.1",
+    "bpk-component-icon": "^10.0.2",
+    "bpk-component-text": "^8.0.2",
+    "bpk-storybook-utils": "^2.0.2",
     "prop-types": "^15.5.8"
   }
 }

package/bpk-component-map/src/BpkIconMarker.module.scss

@@ -40,7 +40,7 @@ $bpk-spacing-v2: true;
     // centre of the marker.
     top: 0.3rem;
     left: bpk-spacing-sm();
-    color: $bpk-color-white;
+    color: $bpk-surface-default-day;
 
     > svg {
       fill: currentColor;
@@ -54,7 +54,7 @@ $bpk-spacing-v2: true;
       @include bpk-themeable-property(
         color,
         --bpk-icon-marker-default-disabled-color,
-        $bpk-color-monteverde
+        $bpk-status-success-spot-day
       );
     }
 
@@ -67,7 +67,7 @@ $bpk-spacing-v2: true;
       @include bpk-themeable-property(
         color,
         --bpk-icon-marker-default-selected-color,
-        $bpk-color-monteverde
+        $bpk-status-success-spot-day
       );
     }
   }