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

package/bpk-component-image/src/BpkImage.js

@@ -1,53 +1,40 @@
-"use strict";
+/*
+ * 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.
+ */
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _CSSTransition = _interopRequireDefault(require("react-transition-group/CSSTransition"));
-var _base = require("@skyscanner/bpk-foundations-web/tokens/base.es6");
-var _bpkReactUtils = require("../../bpk-react-utils");
-var _bpkComponentSpinner = require("../../bpk-component-spinner");
-var _BpkImageModule = _interopRequireDefault(require("./BpkImage.module.css"));
-var _BpkImageBorderRadiusStyles = _interopRequireDefault(require("./BpkImageBorderRadiusStyles"));
-var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["altText", "hidden", "onImageLoad"],
-  _excluded2 = ["altText", "aspectRatio", "borderRadiusStyle", "className", "inView", "loading", "onLoad", "style"];
-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.
-                                                                                                                                                                                                                                                                                                                                                                                           */ // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
+import { Component } from 'react';
 // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
+import CSSTransition from 'react-transition-group/CSSTransition';
 // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
-const getClassName = (0, _bpkReactUtils.cssModules)(_BpkImageModule.default);
-class Image extends _react.Component {
+import { animations } from '@skyscanner/bpk-foundations-web/tokens/base.es6';
+import { cssModules } from "../../bpk-react-utils";
+// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
+import { BpkSpinner } from "../../bpk-component-spinner";
+import STYLES from "./BpkImage.module.css";
+import BORDER_RADIUS_STYLES from "./BpkImageBorderRadiusStyles";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const getClassName = cssModules(STYLES);
+class Image extends Component {
+  static defaultProps = {
+    hidden: false
+  };
   constructor(props) {
     super(props);
-    _defineProperty(this, "img", void 0);
-    _defineProperty(this, "setImgRef", el => {
-      this.img = el;
-    });
     this.img = null;
   }
   componentDidMount() {
@@ -57,74 +44,77 @@ class Image extends _react.Component {
       }
     }
   }
+  setImgRef = el => {
+    this.img = el;
+  };
   render() {
-    const _this$props = this.props,
-      {
-        altText,
-        hidden,
-        onImageLoad
-      } = _this$props,
-      rest = _objectWithoutProperties(_this$props, _excluded);
+    const {
+      altText,
+      hidden,
+      onImageLoad,
+      ...rest
+    } = this.props;
     const imgClassNames = [getClassName('bpk-image__img')];
     if (hidden) {
       imgClassNames.push(getClassName('bpk-image__img--hidden'));
     }
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", _objectSpread({
+    return /*#__PURE__*/_jsx("img", {
       className: imgClassNames.join(' '),
       alt: altText,
       onLoad: onImageLoad,
-      ref: this.setImgRef
-    }, rest));
-  }
-}
-_defineProperty(Image, "defaultProps", {
-  hidden: false
-});
-class BpkImage extends _react.Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "placeholder", void 0);
-    _defineProperty(this, "onImageLoad", () => {
-      if (this.props.onLoad) {
-        this.props.onLoad();
-      }
-    });
-    _defineProperty(this, "getAspectRatio", () => {
-      if (this.props.aspectRatio) {
-        return this.props.aspectRatio;
-      }
-      return 1;
+      ref: this.setImgRef,
+      ...rest
     });
   }
+}
+class BpkImage extends Component {
+  static defaultProps = {
+    borderRadiusStyle: BORDER_RADIUS_STYLES.none,
+    inView: true,
+    loading: false,
+    onLoad: null,
+    style: {},
+    suppressHydrationWarning: false
+  };
+  onImageLoad = () => {
+    if (this.props.onLoad) {
+      this.props.onLoad();
+    }
+  };
+  getAspectRatio = () => {
+    if (this.props.aspectRatio) {
+      return this.props.aspectRatio;
+    }
+    return 1;
+  };
   render() {
-    const _this$props2 = this.props,
-      {
-        altText,
-        aspectRatio,
-        borderRadiusStyle,
-        className,
-        inView,
-        loading,
-        onLoad,
-        style
-      } = _this$props2,
-      rest = _objectWithoutProperties(_this$props2, _excluded2);
+    const {
+      altText,
+      aspectRatio,
+      borderRadiusStyle,
+      className,
+      inView,
+      loading,
+      onLoad,
+      style,
+      ...rest
+    } = this.props;
     const classNames = [getClassName('bpk-image')];
     const aspectRatioPercentage = `${100 / this.getAspectRatio()}%`;
     if (!loading) {
       classNames.push(getClassName('bpk-image--no-background'));
     }
-    if (borderRadiusStyle !== _BpkImageBorderRadiusStyles.default.none) {
-      classNames.push(getClassName(`bpk-image--border-radius-${_BpkImageBorderRadiusStyles.default[borderRadiusStyle]}`));
+    if (borderRadiusStyle !== BORDER_RADIUS_STYLES.none) {
+      classNames.push(getClassName(`bpk-image--border-radius-${BORDER_RADIUS_STYLES[borderRadiusStyle]}`));
     }
 
     // wraps a div with maxWidth and maxHeight set iff full-width is no required.
     // This ensures that the css / html do not reserve too much spacing
     // when width 100% is not being used
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    return /*#__PURE__*/_jsx("div", {
       style: style,
       className: className,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      children: /*#__PURE__*/_jsxs("div", {
         ref: div => {
           this.placeholder = div;
         },
@@ -134,37 +124,30 @@ class BpkImage extends _react.Component {
         },
         className: classNames.join(' '),
         suppressHydrationWarning: this.props.suppressHydrationWarning,
-        children: [inView && /*#__PURE__*/(0, _jsxRuntime.jsx)(Image, _objectSpread({
+        children: [inView && /*#__PURE__*/_jsx(Image, {
           hidden: loading,
           altText: altText,
-          onImageLoad: this.onImageLoad
-        }, rest)), loading && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CSSTransition.default, {
+          onImageLoad: this.onImageLoad,
+          ...rest
+        }), loading && /*#__PURE__*/_jsx(CSSTransition, {
           classNames: {
             exit: getClassName('bpk-image__spinner--shown'),
             exitActive: getClassName('bpk-image__spinner--hidden')
           },
-          timeout: parseInt(_base.animations.durationBase, 10),
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          timeout: parseInt(animations.durationBase, 10),
+          children: /*#__PURE__*/_jsx("div", {
             className: getClassName('bpk-image__spinner'),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentSpinner.BpkSpinner, {})
+            children: /*#__PURE__*/_jsx(BpkSpinner, {})
           })
-        }), typeof window === 'undefined' && (!inView || loading) && /*#__PURE__*/(0, _jsxRuntime.jsx)("noscript", {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Image, _objectSpread({
+        }), typeof window === 'undefined' && (!inView || loading) && /*#__PURE__*/_jsx("noscript", {
+          children: /*#__PURE__*/_jsx(Image, {
             altText: altText,
-            onImageLoad: this.onImageLoad
-          }, rest))
+            onImageLoad: this.onImageLoad,
+            ...rest
+          })
         })]
       })
     });
   }
 }
-_defineProperty(BpkImage, "defaultProps", {
-  borderRadiusStyle: _BpkImageBorderRadiusStyles.default.none,
-  inView: true,
-  loading: false,
-  onLoad: null,
-  style: {},
-  suppressHydrationWarning: false
-});
-var _default = BpkImage;
-exports.default = _default;
+export default BpkImage;

package/bpk-component-image/src/BpkImageBorderRadiusStyles.js

@@ -1,9 +1,3 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
 /*
  * Backpack - Skyscanner's Design System
  *
@@ -26,5 +20,4 @@ const BORDER_RADIUS_STYLES = {
   none: 'none',
   sm: 'sm'
 };
-var _default = BORDER_RADIUS_STYLES;
-exports.default = _default;
+export default BORDER_RADIUS_STYLES;

package/bpk-component-image/src/withLazyLoading.js

@@ -1,93 +1,41 @@
-"use strict";
+/*
+ * 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.
+ */
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = withLazyLoading;
-var _react = require("react");
-var _throttle = _interopRequireDefault(require("lodash/throttle"));
-var _bpkReactUtils = require("../../bpk-react-utils");
-var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["className", "style"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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 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 _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.
-                                                                                                                                                                                                                                                                                                                                                                                           */
-function withLazyLoading(WrappedComponent, documentRef) {
-  class WithLazyLoading extends _react.Component {
+import { Component } from 'react';
+import throttle from 'lodash/throttle';
+import { wrapDisplayName } from "../../bpk-react-utils";
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function withLazyLoading(WrappedComponent, documentRef) {
+  class WithLazyLoading extends Component {
+    static defaultProps = {
+      style: {},
+      className: ''
+    };
     constructor(props) {
       super(props);
-      _defineProperty(this, "element", void 0);
-      _defineProperty(this, "placeholderReference", void 0);
-      _defineProperty(this, "setInView", () => {
-        this.setState(() => ({
-          inView: true
-        }));
-        this.removeEventListeners();
-      });
-      _defineProperty(this, "removeEventListeners", () => {
-        documentRef?.removeEventListener('scroll', this.checkInView, _objectSpread({}, this.getPassiveArgs()));
-        documentRef?.removeEventListener('resize', this.checkInView);
-        documentRef?.removeEventListener('orientationchange', this.checkInView);
-        documentRef?.removeEventListener('fullscreenchange', this.checkInView);
-      });
-      _defineProperty(this, "checkInView", (0, _throttle.default)(() => {
-        if (this.isInViewPort()) {
-          this.setInView();
-        }
-      }, 250));
-      // This function is taken from modernizr
-      // See https://github.com/modernizr/modernizr
-      _defineProperty(this, "supportsPassiveEvents", () => {
-        let supportsPassiveOption = false;
-        try {
-          const opts = Object.defineProperty({}, 'passive', {
-            get() {
-              supportsPassiveOption = true;
-              return supportsPassiveOption;
-            }
-          });
-          const noop = function () {};
-          window.addEventListener('test', noop, opts);
-          window.removeEventListener('test', noop, opts);
-        } catch (e) {
-          return false;
-        }
-        return supportsPassiveOption;
-      });
-      _defineProperty(this, "isInViewPort", () => {
-        if (!this.element) return false;
-        const rect = this.element.getBoundingClientRect();
-        const viewPortHeight = documentRef ? Math.max(window.innerHeight, documentRef.documentElement.clientHeight) : -1;
-        const viewPortWidth = documentRef ? Math.max(window.innerWidth, documentRef.documentElement.clientWidth) : -1;
-        return rect.bottom >= 0 && rect.right >= 0 && rect.top < viewPortHeight && rect.left < viewPortWidth;
-      });
       this.state = {
         inView: false
       };
     }
     componentDidMount() {
-      documentRef?.addEventListener('scroll', this.checkInView, _objectSpread({}, this.getPassiveArgs()));
+      documentRef?.addEventListener('scroll', this.checkInView, {
+        ...this.getPassiveArgs()
+      });
       documentRef?.addEventListener('resize', this.checkInView);
       documentRef?.addEventListener('orientationchange', this.checkInView);
       documentRef?.addEventListener('fullscreenchange', this.checkInView);
@@ -98,6 +46,12 @@ function withLazyLoading(WrappedComponent, documentRef) {
     componentWillUnmount() {
       this.removeEventListeners();
     }
+    setInView = () => {
+      this.setState(() => ({
+        inView: true
+      }));
+      this.removeEventListeners();
+    };
     getPassiveArgs() {
       return this.supportsPassiveEvents() ? {
         capture: true,
@@ -106,31 +60,66 @@ function withLazyLoading(WrappedComponent, documentRef) {
         capture: true
       };
     }
+    removeEventListeners = () => {
+      documentRef?.removeEventListener('scroll', this.checkInView, {
+        ...this.getPassiveArgs()
+      });
+      documentRef?.removeEventListener('resize', this.checkInView);
+      documentRef?.removeEventListener('orientationchange', this.checkInView);
+      documentRef?.removeEventListener('fullscreenchange', this.checkInView);
+    };
+    checkInView = throttle(() => {
+      if (this.isInViewPort()) {
+        this.setInView();
+      }
+    }, 250);
+
+    // This function is taken from modernizr
+    // See https://github.com/modernizr/modernizr
+    supportsPassiveEvents = () => {
+      let supportsPassiveOption = false;
+      try {
+        const opts = Object.defineProperty({}, 'passive', {
+          get() {
+            supportsPassiveOption = true;
+            return supportsPassiveOption;
+          }
+        });
+        const noop = function () {};
+        window.addEventListener('test', noop, opts);
+        window.removeEventListener('test', noop, opts);
+      } catch (e) {
+        return false;
+      }
+      return supportsPassiveOption;
+    };
+    isInViewPort = () => {
+      if (!this.element) return false;
+      const rect = this.element.getBoundingClientRect();
+      const viewPortHeight = documentRef ? Math.max(window.innerHeight, documentRef.documentElement.clientHeight) : -1;
+      const viewPortWidth = documentRef ? Math.max(window.innerWidth, documentRef.documentElement.clientWidth) : -1;
+      return rect.bottom >= 0 && rect.right >= 0 && rect.top < viewPortHeight && rect.left < viewPortWidth;
+    };
     render() {
-      const _this$props = this.props,
-        {
-          className,
-          style
-        } = _this$props,
-        rest = _objectWithoutProperties(_this$props, _excluded);
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      const {
+        className,
+        style,
+        ...rest
+      } = this.props;
+      return /*#__PURE__*/_jsx("div", {
         id: this.placeholderReference,
         ref: element => {
           this.element = element;
         },
         style: style,
         className: className,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedComponent, _objectSpread({
-          inView: this.state.inView
-        }, rest))
+        children: /*#__PURE__*/_jsx(WrappedComponent, {
+          inView: this.state.inView,
+          ...rest
+        })
       });
     }
   }
-  _defineProperty(WithLazyLoading, "displayName", void 0);
-  _defineProperty(WithLazyLoading, "defaultProps", {
-    style: {},
-    className: ''
-  });
-  WithLazyLoading.displayName = (0, _bpkReactUtils.wrapDisplayName)(WrappedComponent, 'withLazyLoading');
+  WithLazyLoading.displayName = wrapDisplayName(WrappedComponent, 'withLazyLoading');
   return WithLazyLoading;
 }

package/bpk-component-image/src/withLoadingBehavior.js

@@ -1,54 +1,45 @@
-"use strict";
+/*
+ * 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.
+ */
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = withLoadingBehavior;
-var _react = require("react");
-var _bpkReactUtils = require("../../bpk-react-utils");
-var _jsxRuntime = require("react/jsx-runtime");
-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 _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.
-                                                                                                                                                                                                                                                                                                                                                                                           */
-function withLoadingBehavior(WrappedComponent) {
-  class WithLoadingBehavior extends _react.Component {
+import { Component } from 'react';
+import { wrapDisplayName } from "../../bpk-react-utils";
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function withLoadingBehavior(WrappedComponent) {
+  class WithLoadingBehavior extends Component {
     constructor(props) {
       super(props);
-      _defineProperty(this, "onLoad", () => {
-        this.setState(() => ({
-          loading: false
-        }));
-      });
       this.state = {
         loading: true
       };
     }
+    onLoad = () => {
+      this.setState(() => ({
+        loading: false
+      }));
+    };
     render() {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedComponent, _objectSpread({
+      return /*#__PURE__*/_jsx(WrappedComponent, {
         onLoad: this.onLoad,
-        loading: this.state.loading
-      }, this.props));
+        loading: this.state.loading,
+        ...this.props
+      });
     }
   }
-  _defineProperty(WithLoadingBehavior, "displayName", void 0);
-  WithLoadingBehavior.displayName = (0, _bpkReactUtils.wrapDisplayName)(WrappedComponent, 'withLoadingBehavior');
+  WithLoadingBehavior.displayName = wrapDisplayName(WrappedComponent, 'withLoadingBehavior');
   return WithLoadingBehavior;
 }