@skyscanner/backpack-web 25.7.0-beta.2 → 25.8.0

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

@@ -1,3 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.TEXT_ALIGN = void 0;
+var _bpkReactUtils = require("../../bpk-react-utils");
+var _bpkComponentText = _interopRequireDefault(require("../../bpk-component-text"));
+var _bpkComponentButton = _interopRequireDefault(require("../../bpk-component-button"));
+var _BpkGraphicPromoModule = _interopRequireDefault(require("./BpkGraphicPromo.module.css"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /*
  * Backpack - Skyscanner's Design System
  *
@@ -16,26 +28,21 @@
  * limitations under the License.
  */
 
-import { cssModules } from "../../bpk-react-utils";
-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.css";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const getClassName = cssModules(STYLES);
+
+const getClassName = (0, _bpkReactUtils.cssModules)(_BpkGraphicPromoModule.default);
 const ACCESSIBILITY_KEYS = {
   Enter: 13 /* Enter */,
   Space: 32 /* Space */
 };
 
 const isAccessibilityClick = event => Object.keys(ACCESSIBILITY_KEYS).includes(event.key) || Object.values(ACCESSIBILITY_KEYS).includes(event.keyCode || event.which);
-export const TEXT_ALIGN = {
+const TEXT_ALIGN = {
   start: 'start',
   center: 'center',
   end: 'end'
 };
+exports.TEXT_ALIGN = TEXT_ALIGN;
 const constructAriaLabel = ({
   buttonText,
   headline,
@@ -83,7 +90,7 @@ const BpkGraphicPromo = ({
     // The card appears as a single component for the screen reader; its children are hidden. The card handles mouse
     // clicks and key presses (Enter/Space) for the whole component, as described here:
     // https://developer.mozilla.org/en-US/docs/Web/Accessibility/Keyboard-navigable_JavaScript_widgets
-    _jsx("div", {
+    (0, _jsxRuntime.jsx)("div", {
       id: contentId || '',
       className: cardClasses,
       style: style,
@@ -98,38 +105,38 @@ const BpkGraphicPromo = ({
       tabIndex: 0,
       onClick: onClickWrapper,
       onKeyDown: onKeyWrapper,
-      children: /*#__PURE__*/_jsxs("div", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         id: contentId && `${contentId}__content` || '',
         className: containerClasses,
         "aria-hidden": true,
-        children: [/*#__PURE__*/_jsx("div", {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           className: getTextClasses('bpk-graphic-promo__sponsor-content'),
-          children: sponsor && /*#__PURE__*/_jsxs(_Fragment, {
-            children: [/*#__PURE__*/_jsx(BpkText, {
+          children: sponsor && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentText.default, {
               tagName: "span",
               className: getClassName('bpk-graphic-promo__sponsor-label'),
               children: sponsor.label
-            }), /*#__PURE__*/_jsx("img", {
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
               className: getClassName('bpk-graphic-promo__sponsor-logo'),
               alt: sponsor.altText,
               src: sponsor.logo
             })]
           })
-        }), /*#__PURE__*/_jsxs("div", {
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
           className: getTextClasses('bpk-graphic-promo__promo-content'),
-          children: [!sponsor && tagline && /*#__PURE__*/_jsx(BpkText, {
+          children: [!sponsor && tagline && /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentText.default, {
             tagName: "span",
             className: getClassName('bpk-graphic-promo__tagline'),
             children: tagline
-          }), /*#__PURE__*/_jsx(BpkText, {
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentText.default, {
             tagName: "h2",
             className: getClassName('bpk-graphic-promo__headline'),
             children: headline
-          }), subheading && /*#__PURE__*/_jsx(BpkText, {
+          }), subheading && /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentText.default, {
             tagName: "p",
             className: getClassName('bpk-graphic-promo__subheading'),
             children: subheading
-          }), /*#__PURE__*/_jsx(BpkButton, {
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentButton.default, {
             primaryOnDark: true,
             className: getClassName('bpk-graphic-promo__cta'),
             onClick: onClickWrapper,
@@ -141,4 +148,5 @@ const BpkGraphicPromo = ({
     })
   );
 };
-export default BpkGraphicPromo;
+var _default = BpkGraphicPromo;
+exports.default = _default;

package/bpk-component-grid-toggle/index.js

@@ -1,3 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _BpkGridToggle = _interopRequireDefault(require("./src/BpkGridToggle"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /*
  * Backpack - Skyscanner's Design System
  *
@@ -15,6 +23,5 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
-import component from "./src/BpkGridToggle";
-export default component;
+var _default = _BpkGridToggle.default;
+exports.default = _default;

package/bpk-component-grid-toggle/src/BpkGridToggle.js

@@ -1,32 +1,52 @@
-/*
- * Backpack - Skyscanner's Design System
- *
- * Copyright 2016 Skyscanner Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+"use strict";
 
-import PropTypes from 'prop-types';
-import { Component } from 'react';
-import { cssModules } from "../../bpk-react-utils";
-import { BpkButtonLink } from "../../bpk-component-link";
-import STYLES from "./BpkGridToggle.module.css";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const getClassName = cssModules(STYLES);
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = require("react");
+var _bpkReactUtils = require("../../bpk-react-utils");
+var _bpkComponentLink = require("../../bpk-component-link");
+var _BpkGridToggleModule = _interopRequireDefault(require("./BpkGridToggle.module.css"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /*
+                                                                                                                                                                                                                                                                                                                                                                                           * Backpack - Skyscanner's Design System
+                                                                                                                                                                                                                                                                                                                                                                                           *
+                                                                                                                                                                                                                                                                                                                                                                                           * Copyright 2016 Skyscanner Ltd
+                                                                                                                                                                                                                                                                                                                                                                                           *
+                                                                                                                                                                                                                                                                                                                                                                                           * Licensed under the Apache License, Version 2.0 (the "License");
+                                                                                                                                                                                                                                                                                                                                                                                           * you may not use this file except in compliance with the License.
+                                                                                                                                                                                                                                                                                                                                                                                           * You may obtain a copy of the License at
+                                                                                                                                                                                                                                                                                                                                                                                           *
+                                                                                                                                                                                                                                                                                                                                                                                           *   http://www.apache.org/licenses/LICENSE-2.0
+                                                                                                                                                                                                                                                                                                                                                                                           *
+                                                                                                                                                                                                                                                                                                                                                                                           * Unless required by applicable law or agreed to in writing, software
+                                                                                                                                                                                                                                                                                                                                                                                           * distributed under the License is distributed on an "AS IS" BASIS,
+                                                                                                                                                                                                                                                                                                                                                                                           * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+                                                                                                                                                                                                                                                                                                                                                                                           * See the License for the specific language governing permissions and
+                                                                                                                                                                                                                                                                                                                                                                                           * limitations under the License.
+                                                                                                                                                                                                                                                                                                                                                                                           */
+const getClassName = (0, _bpkReactUtils.cssModules)(_BpkGridToggleModule.default);
 const GRID_CLASS_NAME = getClassName('bpk-vertical-grid--on');
-class BpkGridToggle extends Component {
+class BpkGridToggle extends _react.Component {
   constructor(props) {
     super(props);
+    _defineProperty(this, "handleKeyDown", e => {
+      if (e.ctrlKey && e.metaKey && e.key.toLowerCase() === 'g') {
+        this.toggleGrid(e);
+      }
+    });
+    _defineProperty(this, "toggleGrid", e => {
+      e.preventDefault();
+      document.querySelector(this.props.targetContainer).classList.toggle(GRID_CLASS_NAME);
+      this.setState(state => ({
+        gridEnabled: !state.gridEnabled
+      }));
+    });
     this.state = {
       gridEnabled: false
     };
@@ -38,18 +58,6 @@ class BpkGridToggle extends Component {
     document.querySelector(this.props.targetContainer).classList.remove(GRID_CLASS_NAME);
     document.removeEventListener('keydown', this.handleKeyDown);
   }
-  handleKeyDown = e => {
-    if (e.ctrlKey && e.metaKey && e.key.toLowerCase() === 'g') {
-      this.toggleGrid(e);
-    }
-  };
-  toggleGrid = e => {
-    e.preventDefault();
-    document.querySelector(this.props.targetContainer).classList.toggle(GRID_CLASS_NAME);
-    this.setState(state => ({
-      gridEnabled: !state.gridEnabled
-    }));
-  };
   render() {
     const {
       className
@@ -58,7 +66,7 @@ class BpkGridToggle extends Component {
       gridEnabled
     } = this.state;
     const onOrOff = gridEnabled ? 'off' : 'on';
-    return /*#__PURE__*/_jsxs(BpkButtonLink, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_bpkComponentLink.BpkButtonLink, {
       title: "Keyboard Shortcut: ctrl + cmd + g",
       onClick: this.toggleGrid,
       className: className,
@@ -67,11 +75,12 @@ class BpkGridToggle extends Component {
   }
 }
 BpkGridToggle.propTypes = {
-  targetContainer: PropTypes.string,
-  className: PropTypes.string
+  targetContainer: _propTypes.default.string,
+  className: _propTypes.default.string
 };
 BpkGridToggle.defaultProps = {
   targetContainer: 'body',
   className: null
 };
-export default BpkGridToggle;
+var _default = BpkGridToggle;
+exports.default = _default;

package/bpk-component-horizontal-nav/index.js

@@ -1,3 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "BpkHorizontalNavItem", {
+  enumerable: true,
+  get: function () {
+    return _BpkHorizontalNavItem.default;
+  }
+});
+Object.defineProperty(exports, "HORIZONTAL_NAV_TYPES", {
+  enumerable: true,
+  get: function () {
+    return _BpkHorizontalNav.HORIZONTAL_NAV_TYPES;
+  }
+});
+exports.default = void 0;
+Object.defineProperty(exports, "themeAttributes", {
+  enumerable: true,
+  get: function () {
+    return _BpkHorizontalNavItem.themeAttributes;
+  }
+});
+var _BpkHorizontalNav = _interopRequireWildcard(require("./src/BpkHorizontalNav"));
+var _BpkHorizontalNavItem = _interopRequireWildcard(require("./src/BpkHorizontalNavItem"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 /*
  * Backpack - Skyscanner's Design System
  *
@@ -14,7 +42,6 @@
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- */import BpkHorizontalNav, { HORIZONTAL_NAV_TYPES } from "./src/BpkHorizontalNav";
-import BpkHorizontalNavItem, { themeAttributes } from "./src/BpkHorizontalNavItem";
-export { HORIZONTAL_NAV_TYPES, BpkHorizontalNavItem, themeAttributes };
-export default BpkHorizontalNav;
+ */
+var _default = _BpkHorizontalNav.default;
+exports.default = _default;

package/bpk-component-horizontal-nav/src/BpkHorizontalNav.js

@@ -1,30 +1,46 @@
-/*
- * Backpack - Skyscanner's Design System
- *
- * Copyright 2016 Skyscanner Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */import PropTypes from 'prop-types';
-import { Component, Children, cloneElement } from 'react';
-import { cssModules } from "../../bpk-react-utils";
-import BpkMobileScrollContainer from "../../bpk-component-mobile-scroll-container";
-import STYLES from "./BpkHorizontalNav.module.css";
-import { jsx as _jsx } from "react/jsx-runtime";
-const getClassName = cssModules(STYLES);
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.HORIZONTAL_NAV_TYPES = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = require("react");
+var _bpkReactUtils = require("../../bpk-react-utils");
+var _bpkComponentMobileScrollContainer = _interopRequireDefault(require("../../bpk-component-mobile-scroll-container"));
+var _BpkHorizontalNavModule = _interopRequireDefault(require("./BpkHorizontalNav.module.css"));
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["autoScrollToSelected", "children", "className", "leadingScrollIndicatorClassName", "showUnderline", "trailingScrollIndicatorClassName", "type"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /*
+                                                                                                                                                                                                                                                                                                                                                                                           * Backpack - Skyscanner's Design System
+                                                                                                                                                                                                                                                                                                                                                                                           *
+                                                                                                                                                                                                                                                                                                                                                                                           * Copyright 2016 Skyscanner Ltd
+                                                                                                                                                                                                                                                                                                                                                                                           *
+                                                                                                                                                                                                                                                                                                                                                                                           * Licensed under the Apache License, Version 2.0 (the "License");
+                                                                                                                                                                                                                                                                                                                                                                                           * you may not use this file except in compliance with the License.
+                                                                                                                                                                                                                                                                                                                                                                                           * You may obtain a copy of the License at
+                                                                                                                                                                                                                                                                                                                                                                                           *
+                                                                                                                                                                                                                                                                                                                                                                                           *   http://www.apache.org/licenses/LICENSE-2.0
+                                                                                                                                                                                                                                                                                                                                                                                           *
+                                                                                                                                                                                                                                                                                                                                                                                           * Unless required by applicable law or agreed to in writing, software
+                                                                                                                                                                                                                                                                                                                                                                                           * distributed under the License is distributed on an "AS IS" BASIS,
+                                                                                                                                                                                                                                                                                                                                                                                           * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+                                                                                                                                                                                                                                                                                                                                                                                           * See the License for the specific language governing permissions and
+                                                                                                                                                                                                                                                                                                                                                                                           * limitations under the License.
+                                                                                                                                                                                                                                                                                                                                                                                           */
+const getClassName = (0, _bpkReactUtils.cssModules)(_BpkHorizontalNavModule.default);
 const HORIZONTAL_NAV_TYPES = {
   default: 'default',
   light: 'light'
 };
+exports.HORIZONTAL_NAV_TYPES = HORIZONTAL_NAV_TYPES;
 const getPos = ref => {
   if (!ref) {
     return null;
@@ -32,82 +48,68 @@ const getPos = ref => {
   const pos = ref.getBoundingClientRect();
   return pos;
 };
-class BpkHorizontalNav extends Component {
-  static propTypes = {
-    children: PropTypes.node.isRequired,
-    autoScrollToSelected: PropTypes.bool,
-    className: PropTypes.string,
-    leadingScrollIndicatorClassName: PropTypes.string,
-    showUnderline: PropTypes.bool,
-    trailingScrollIndicatorClassName: PropTypes.string,
-    type: PropTypes.oneOf(Object.keys(HORIZONTAL_NAV_TYPES))
-  };
-  static defaultProps = {
-    autoScrollToSelected: false,
-    className: null,
-    leadingScrollIndicatorClassName: null,
-    showUnderline: true,
-    trailingScrollIndicatorClassName: null,
-    type: HORIZONTAL_NAV_TYPES.default
-  };
+class BpkHorizontalNav extends _react.Component {
   constructor(props) {
     super(props);
+    _defineProperty(this, "selectedItemRef", void 0);
+    _defineProperty(this, "scrollRef", void 0);
+    _defineProperty(this, "componentDidMount", () => {
+      this.scrollSelectedIntoView(false);
+    });
+    _defineProperty(this, "scrollSelectedIntoView", useSmoothScroll => {
+      if (!this.props.autoScrollToSelected || !this.scrollRef || !this.selectedItemRef) {
+        return;
+      }
+      if (!this.scrollRef) {
+        return;
+      }
+      const selectedItemPos = getPos(this.selectedItemRef);
+      if (!selectedItemPos) {
+        return;
+      }
+      const scrollPos = getPos(this.scrollRef);
+      if (!scrollPos) {
+        return;
+      }
+
+      // We only need to carry out a scroll if the element is not already fully within the scroll view
+      const needsScroll = selectedItemPos.left < scrollPos.left || selectedItemPos.right > scrollPos.right;
+      if (!needsScroll) {
+        return;
+      }
+      const scrollAdjustment = selectedItemPos.left - scrollPos.left;
+      // Some browsers don't support smooth scrolling, so in those cases we must fall back to simply setting `scrollLeft`
+      if (this.scrollRef && this.scrollRef.scroll && typeof this.scrollRef.scroll === 'function' && useSmoothScroll) {
+        this.scrollRef.scroll({
+          left: scrollAdjustment,
+          behavior: 'smooth'
+        });
+      } else if (this.scrollRef) {
+        this.scrollRef.scrollLeft = scrollAdjustment;
+      }
+    });
     this.scrollRef = null;
     this.selectedItemRef = null;
   }
-  componentDidMount = () => {
-    this.scrollSelectedIntoView(false);
-  };
   componentDidUpdate() {
     this.scrollSelectedIntoView(true);
   }
-  scrollSelectedIntoView = useSmoothScroll => {
-    if (!this.props.autoScrollToSelected || !this.scrollRef || !this.selectedItemRef) {
-      return;
-    }
-    if (!this.scrollRef) {
-      return;
-    }
-    const selectedItemPos = getPos(this.selectedItemRef);
-    if (!selectedItemPos) {
-      return;
-    }
-    const scrollPos = getPos(this.scrollRef);
-    if (!scrollPos) {
-      return;
-    }
-
-    // We only need to carry out a scroll if the element is not already fully within the scroll view
-    const needsScroll = selectedItemPos.left < scrollPos.left || selectedItemPos.right > scrollPos.right;
-    if (!needsScroll) {
-      return;
-    }
-    const scrollAdjustment = selectedItemPos.left - scrollPos.left;
-    // Some browsers don't support smooth scrolling, so in those cases we must fall back to simply setting `scrollLeft`
-    if (this.scrollRef && this.scrollRef.scroll && typeof this.scrollRef.scroll === 'function' && useSmoothScroll) {
-      this.scrollRef.scroll({
-        left: scrollAdjustment,
-        behavior: 'smooth'
-      });
-    } else if (this.scrollRef) {
-      this.scrollRef.scrollLeft = scrollAdjustment;
-    }
-  };
   render() {
-    const {
-      autoScrollToSelected,
-      children: rawChildren,
-      className,
-      leadingScrollIndicatorClassName,
-      showUnderline,
-      trailingScrollIndicatorClassName,
-      type,
-      ...rest
-    } = this.props;
+    const _this$props = this.props,
+      {
+        autoScrollToSelected,
+        children: rawChildren,
+        className,
+        leadingScrollIndicatorClassName,
+        showUnderline,
+        trailingScrollIndicatorClassName,
+        type
+      } = _this$props,
+      rest = _objectWithoutProperties(_this$props, _excluded);
     const classNames = getClassName('bpk-horizontal-nav', showUnderline && `bpk-horizontal-nav--show-${type}-underline`, className);
     let children = rawChildren;
     if (autoScrollToSelected || type === HORIZONTAL_NAV_TYPES.light) {
-      children = Children.map(rawChildren, child => {
+      children = _react.Children.map(rawChildren, child => {
         const childProps = {};
         let childRef;
         if (autoScrollToSelected) {
@@ -120,32 +122,49 @@ class BpkHorizontalNav extends Component {
         if (type === HORIZONTAL_NAV_TYPES.light) {
           childProps.type = HORIZONTAL_NAV_TYPES.light;
         }
-        return child ? /*#__PURE__*/_jsx("div", {
+        return child ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           ref: childRef,
-          children: /*#__PURE__*/cloneElement(child, childProps)
+          children: /*#__PURE__*/(0, _react.cloneElement)(child, childProps)
         }) : null;
       });
     }
     return (
       /*#__PURE__*/
       // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
-      _jsx(BpkMobileScrollContainer, {
+      (0, _jsxRuntime.jsx)(_bpkComponentMobileScrollContainer.default, _objectSpread(_objectSpread({
         innerContainerTagName: "nav",
         className: classNames,
         leadingIndicatorClassName: leadingScrollIndicatorClassName,
         trailingIndicatorClassName: trailingScrollIndicatorClassName,
         scrollerRef: ref => {
           this.scrollRef = ref;
-        },
-        ...rest,
-        children: /*#__PURE__*/_jsx("div", {
+        }
+      }, rest), {}, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           className: getClassName('bpk-horizontal-nav__list'),
           role: "tablist",
           children: children
         })
-      })
+      }))
     );
   }
 }
-export default BpkHorizontalNav;
-export { HORIZONTAL_NAV_TYPES };
+_defineProperty(BpkHorizontalNav, "propTypes", {
+  children: _propTypes.default.node.isRequired,
+  autoScrollToSelected: _propTypes.default.bool,
+  className: _propTypes.default.string,
+  leadingScrollIndicatorClassName: _propTypes.default.string,
+  showUnderline: _propTypes.default.bool,
+  trailingScrollIndicatorClassName: _propTypes.default.string,
+  type: _propTypes.default.oneOf(Object.keys(HORIZONTAL_NAV_TYPES))
+});
+_defineProperty(BpkHorizontalNav, "defaultProps", {
+  autoScrollToSelected: false,
+  className: null,
+  leadingScrollIndicatorClassName: null,
+  showUnderline: true,
+  trailingScrollIndicatorClassName: null,
+  type: HORIZONTAL_NAV_TYPES.default
+});
+var _default = BpkHorizontalNav;
+exports.default = _default;