@skyscanner/backpack-web 6.1.0 → 8.0.0

package/bpk-component-map/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-map",
-  "version": "6.0.8",
+  "version": "6.0.9",
   "description": "Backpack map component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,18 +15,18 @@
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
     "@react-google-maps/api": "^2.8.1",
-    "bpk-component-spinner": "^5.1.12",
+    "bpk-component-spinner": "^5.1.13",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.5.8"
   },
   "peerDependencies": {
     "react": "^16.8.3 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-icon": "^9.2.13",
-    "bpk-component-text": "^7.0.6",
-    "bpk-storybook-utils": "^1.1.11",
+    "bpk-component-icon": "^9.2.14",
+    "bpk-component-text": "^7.0.7",
+    "bpk-storybook-utils": "^1.1.12",
     "prop-types": "^15.5.8"
   }
 }

package/bpk-component-mobile-scroll-container/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-mobile-scroll-container",
-  "version": "3.1.12",
+  "version": "3.1.13",
   "description": "Backpack mobile scroll container component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,7 +15,7 @@
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "lodash.debounce": "^4.0.8",
     "prop-types": "^15.7.2"
   },

package/bpk-component-modal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-modal",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Backpack modal component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,20 +14,20 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-component-close-button": "^3.1.13",
-    "bpk-component-icon": "^9.2.13",
-    "bpk-component-link": "^3.1.12",
-    "bpk-component-navigation-bar": "^3.1.14",
+    "bpk-component-close-button": "^3.1.14",
+    "bpk-component-icon": "^9.2.14",
+    "bpk-component-link": "^3.1.13",
+    "bpk-component-navigation-bar": "^3.1.15",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
-    "bpk-scrim-utils": "^5.1.11",
+    "bpk-react-utils": "^6.0.1",
+    "bpk-scrim-utils": "^5.1.12",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-button": "^6.2.7",
-    "bpk-component-text": "^7.0.6"
+    "bpk-component-button": "^6.2.8",
+    "bpk-component-text": "^7.0.7"
   }
 }

package/bpk-component-navigation-bar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-navigation-bar",
-  "version": "3.1.14",
+  "version": "3.1.15",
   "description": "Backpack nativation bar component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,11 +14,11 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-component-close-button": "^3.1.13",
-    "bpk-component-link": "^3.1.12",
-    "bpk-component-text": "^7.0.6",
+    "bpk-component-close-button": "^3.1.14",
+    "bpk-component-link": "^3.1.13",
+    "bpk-component-text": "^7.0.7",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
@@ -26,7 +26,7 @@
   },
   "devDependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
-    "bpk-component-icon": "^9.2.13",
-    "bpk-storybook-utils": "^1.1.11"
+    "bpk-component-icon": "^9.2.14",
+    "bpk-storybook-utils": "^1.1.12"
   }
 }

package/bpk-component-navigation-stack/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-navigation-stack",
-  "version": "3.2.0",
+  "version": "3.2.1",
   "description": "Backpack navigation stack component.",
   "license": "Apache-2.0",
   "private": true,
@@ -17,7 +17,7 @@
   "dependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2",
     "react-transition-group": "^2.5.3"
   },
@@ -25,9 +25,9 @@
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-button": "^6.2.7",
-    "bpk-component-icon": "^9.2.13",
-    "bpk-component-navigation-bar": "^3.1.14",
-    "bpk-component-rtl-toggle": "^3.1.12"
+    "bpk-component-button": "^6.2.8",
+    "bpk-component-icon": "^9.2.14",
+    "bpk-component-navigation-bar": "^3.1.15",
+    "bpk-component-rtl-toggle": "^3.1.13"
   }
 }

package/bpk-component-nudger/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-nudger",
-  "version": "7.0.6",
+  "version": "7.0.7",
   "description": "Backpack nudger component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,10 +15,10 @@
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
-    "bpk-component-button": "^6.2.7",
-    "bpk-component-icon": "^9.2.13",
+    "bpk-component-button": "^6.2.8",
+    "bpk-component-icon": "^9.2.14",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "lodash.clamp": "^4.0.3",
     "prop-types": "^15.7.2"
   },
@@ -26,7 +26,7 @@
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-label": "^5.1.12",
-    "bpk-storybook-utils": "^1.1.11"
+    "bpk-component-label": "^5.1.13",
+    "bpk-storybook-utils": "^1.1.12"
   }
 }

package/bpk-component-overlay/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-overlay",
-  "version": "2.1.14",
+  "version": "2.1.15",
   "description": "Backpack overlay component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,15 +14,15 @@
   },
   "dependencies": {
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.5.8"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-image": "^5.1.14",
-    "bpk-component-text": "^7.0.6"
+    "bpk-component-image": "^5.1.15",
+    "bpk-component-text": "^7.0.7"
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8"
 }

package/bpk-component-pagination/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-pagination",
-  "version": "4.0.11",
+  "version": "4.0.12",
   "description": "Backpack pagination component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,15 +14,15 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-component-button": "^6.2.7",
+    "bpk-component-button": "^6.2.8",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-icon": "^9.2.13"
+    "bpk-component-icon": "^9.2.14"
   }
 }

package/bpk-component-panel/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-panel",
-  "version": "3.1.12",
+  "version": "3.1.13",
   "description": "Backpack panel component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,7 +15,7 @@
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {

package/bpk-component-phone-input/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-phone-input",
-  "version": "7.1.19",
+  "version": "7.1.22",
   "description": "Backpack phone input component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,19 +15,19 @@
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
-    "bpk-component-input": "^6.1.17",
-    "bpk-component-label": "^5.1.12",
-    "bpk-component-select": "^5.1.12",
-    "bpk-component-text": "^7.0.6",
+    "bpk-component-input": "^6.1.19",
+    "bpk-component-label": "^5.1.13",
+    "bpk-component-select": "^5.1.13",
+    "bpk-component-text": "^7.0.7",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-fieldset": "^4.1.19",
-    "bpk-component-image": "^5.1.14"
+    "bpk-component-fieldset": "^4.1.22",
+    "bpk-component-image": "^5.1.15"
   }
 }

package/bpk-component-popover/README.md

@@ -20,6 +20,7 @@ class App extends Component {
   constructor() {
     super();
 
+    this.ref = React.createRef();
     this.state = {
       isOpen: false,
     };
@@ -38,14 +39,21 @@ class App extends Component {
     });
   }
 
+  const target = (
+    <div ref={this.ref} className={'my-popover-target'}>
+      <BpkButton
+        onClick={this.openPopover}>
+          Open
+      </BpkButton>
+    </div>
+  )
+
   render() {
     return (
       <div id="popover-container">
         <BpkPopover
           id="my-popover"
-          target={
-            <BpkButton onClick={this.openPopover}>Open</BpkButton>
-          }
+          target={target}
           onClose={this.closePopover}
           isOpen={this.state.isOpen}
           label="My popover"
@@ -120,6 +128,10 @@ const onClose = (event, {
 
 Please refer to the [documentation](https://popper.js.org/docs/v2/modifiers/) for the underlying positioning library "Popper.js". You can achieve various behaviours such as allowing the popover to overflow the viewport etc.
 
+#### target
+
+`target` can be a DOM element with a `ref` attached to it or a function that returns a DOM element.
+
 ## Theme Props
 
 * `linkColor`

package/bpk-component-popover/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-popover",
-  "version": "6.0.0",
+  "version": "7.0.0",
   "description": "Backpack popover component.",
   "license": "Apache-2.0",
   "repository": {
@@ -17,19 +17,19 @@
     "@popperjs/core": "^2.11.5",
     "a11y-focus-scope": "^1.1.3",
     "a11y-focus-store": "^1.0.0",
-    "bpk-component-close-button": "^3.1.13",
-    "bpk-component-link": "^3.1.12",
-    "bpk-component-text": "^7.0.6",
+    "bpk-component-close-button": "^3.1.14",
+    "bpk-component-link": "^3.1.13",
+    "bpk-component-text": "^7.0.7",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-button": "^6.2.7",
-    "bpk-component-content-container": "^5.0.6",
-    "bpk-component-input": "^6.1.17"
+    "bpk-component-button": "^6.2.8",
+    "bpk-component-content-container": "^5.0.7",
+    "bpk-component-input": "^6.1.19"
   }
 }

package/bpk-component-popover/src/BpkPopoverPortal.js

@@ -18,7 +18,7 @@
 
 /* @flow strict */
 
-import { createPopper, basePlacements } from '@popperjs/core';
+import { createPopper } from '@popperjs/core';
 import PropTypes from 'prop-types';
 import React, { Component, type Node } from 'react';
 import focusStore from 'a11y-focus-store';
@@ -51,7 +51,7 @@ export const propTypes = {
   target: PropTypes.oneOfType([PropTypes.func, PropTypes.node]).isRequired,
   isOpen: PropTypes.bool.isRequired,
   onClose: PropTypes.func.isRequired,
-  placement: PropTypes.oneOf(basePlacements),
+  placement: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
   portalStyle: PropTypes.object, // eslint-disable-line react/forbid-prop-types
   portalClassName: PropTypes.string,
   renderTarget: PropTypes.func,
@@ -83,7 +83,6 @@ class BpkPopoverPortal extends Component<Props> {
 
     this.popper = null;
     this.previousTargetElement = null;
-    this.ref = React.createRef();
   }
 
   onRender = (popoverElement: HTMLElement, targetElement: ?HTMLElement) => {
@@ -217,16 +216,9 @@ class BpkPopoverPortal extends Component<Props> {
       classNames.push(portalClassName);
     }
 
-    const targetElement =
-      typeof target === 'function' ? (
-        target
-      ) : (
-        <div ref={this.ref}>{target}</div>
-      );
-
     return (
       <>
-        {typeof targetElement !== 'function' && targetElement}
+        {typeof target !== 'function' && target}
         <Portal
           beforeClose={this.beforeClose}
           className={classNames.join(' ')}
@@ -235,7 +227,7 @@ class BpkPopoverPortal extends Component<Props> {
           onRender={this.onRender}
           style={portalStyle}
           renderTarget={renderTarget}
-          target={targetElement}
+          target={target}
         >
           {/* $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'. */}
           <BpkPopover onClose={this.onClose} {...rest} />

package/bpk-component-price/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-price",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "description": "Backpack price component.",
   "license": "Apache-2.0",
   "repository": {
@@ -13,9 +13,9 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "bpk-component-text": "^7.0.6",
+    "bpk-component-text": "^7.0.7",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.5.8"
   },
   "peerDependencies": {

package/bpk-component-progress/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-progress",
-  "version": "3.1.12",
+  "version": "3.1.13",
   "description": "Backpack progress bar component.",
   "license": "Apache-2.0",
   "repository": {
@@ -16,7 +16,7 @@
   "dependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "lodash.clamp": "^4.0.3",
     "prop-types": "^15.7.2"
   },
@@ -24,7 +24,7 @@
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-button": "^6.2.7",
-    "bpk-storybook-utils": "^1.1.11"
+    "bpk-component-button": "^6.2.8",
+    "bpk-storybook-utils": "^1.1.12"
   }
 }

package/bpk-component-radio/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-radio",
-  "version": "3.1.13",
+  "version": "3.1.14",
   "description": "Backpack radio button component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,7 +15,7 @@
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
@@ -23,6 +23,6 @@
   },
   "devDependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
-    "bpk-storybook-utils": "^1.1.11"
+    "bpk-storybook-utils": "^1.1.12"
   }
 }

package/bpk-component-rating/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-rating",
-  "version": "5.0.3",
+  "version": "5.0.4",
   "description": "Backpack rating component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,7 +15,7 @@
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "lodash.clamp": "^4.0.3",
     "prop-types": "^15.5.8"
   },
@@ -24,6 +24,6 @@
   },
   "devDependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
-    "bpk-component-text": "^7.0.6"
+    "bpk-component-text": "^7.0.7"
   }
 }

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

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-rtl-toggle",
-  "version": "3.1.12",
+  "version": "3.1.13",
   "description": "Backpack RTL toggle component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-component-link": "^3.1.12",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-component-link": "^3.1.13",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {

package/bpk-component-scrollable-calendar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-scrollable-calendar",
-  "version": "6.1.20",
+  "version": "6.2.2",
   "description": "Backpack scrollable calendar component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,16 +15,16 @@
   "gitHead": "4e4ec9add28e1db54d6a38a10c331bbd163f2926",
   "dependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
-    "bpk-component-calendar": "^11.1.19",
-    "bpk-component-text": "^7.0.6",
+    "bpk-component-calendar": "^11.2.2",
+    "bpk-component-text": "^7.0.7",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "date-fns": "^2.21.1",
     "prop-types": "^15.5.8",
     "react-virtualized": "^9.22.3"
   },
   "devDependencies": {
-    "bpk-storybook-utils": "^1.1.11"
+    "bpk-storybook-utils": "^1.1.12"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"

package/bpk-component-section-list/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-section-list",
-  "version": "3.2.13",
+  "version": "3.2.14",
   "description": "Backpack section list component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,14 +15,14 @@
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
     "@skyscanner/bpk-foundations-web": "^8.0.0",
-    "bpk-component-icon": "^9.2.13",
-    "bpk-component-text": "^7.0.6",
+    "bpk-component-icon": "^9.2.14",
+    "bpk-component-text": "^7.0.7",
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "devDependencies": {
-    "bpk-storybook-utils": "^1.1.11"
+    "bpk-storybook-utils": "^1.1.12"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"

package/bpk-component-select/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-select",
-  "version": "5.1.12",
+  "version": "5.1.13",
   "description": "Backpack select component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,11 +15,11 @@
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.7.2"
   },
   "devDependencies": {
-    "bpk-storybook-utils": "^1.1.11"
+    "bpk-storybook-utils": "^1.1.12"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"

package/bpk-component-skip-link/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-skip-link",
-  "version": "2.1.12",
+  "version": "2.1.13",
   "description": "Backpack skip-link component.",
   "main": "index.js",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.0",
+    "bpk-react-utils": "^6.0.1",
     "prop-types": "^15.5.8"
   },
   "publishConfig": {