@skyscanner/backpack-web 37.0.0 → 37.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/bpk-component-icon/all.d.ts +2 -1
  2. package/bpk-component-icon/all.js +2 -1
  3. package/bpk-component-icon/lg/award.js +1 -1
  4. package/bpk-component-icon/lg/baggage-personal-item.js +14 -0
  5. package/bpk-component-icon/lg/bus.js +8 -5
  6. package/bpk-component-icon/sm/award.js +1 -1
  7. package/bpk-component-icon/sm/baggage-personal-item.js +14 -0
  8. package/bpk-component-icon/sm/bus.js +3 -2
  9. package/bpk-component-icon/sm/check.js +18 -0
  10. package/bpk-component-icon/xl/star-half.js +14 -0
  11. package/bpk-component-icon/xl/star-outline.js +14 -0
  12. package/bpk-component-icon/xl/star.js +14 -0
  13. package/bpk-component-inset-banner/src/BpkInsetBanner.d.ts +3 -0
  14. package/bpk-component-inset-banner/src/BpkInsetBanner.js +8 -0
  15. package/bpk-component-inset-banner/src/BpkInsetBanner.module.css +1 -1
  16. package/bpk-component-price/src/BpkPrice.js +6 -2
  17. package/package.json +3 -3
package/bpk-component-icon/all.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  declare const sm: any;
2
2
  declare const lg: any;
3
+ declare const xl: any;
3
4
  export default sm;
4
- export { sm, lg };
5
+ export { sm, lg, xl };
package/bpk-component-icon/all.js CHANGED
@@ -28,5 +28,6 @@ function requireAll(requireContext) {
28
28
  }
29
29
  const sm = requireAll(require.context('./sm', false, /\.jsx$/));
30
30
  const lg = requireAll(require.context('./lg', false, /\.jsx$/));
31
+ const xl = requireAll(require.context('./xl', false, /\.jsx$/));
31
32
  export default sm;
32
- export { sm, lg };
33
+ export { sm, lg, xl };
package/bpk-component-icon/lg/award.js CHANGED
@@ -8,7 +8,7 @@ const AwardIcon = props => /*#__PURE__*/_jsx("svg", {
8
8
  height: "1.5rem",
9
9
  ...props,
10
10
  children: /*#__PURE__*/_jsx("path", {
11
- d: "m15.431 9.576-.034.033a6.75 6.75 0 0 1 3.353 5.823 6.757 6.757 0 0 1-6.75 6.75 6.757 6.757 0 0 1-6.75-6.75A6.75 6.75 0 0 1 8.603 9.61a27 27 0 0 1-.793-.76c-2.44-2.43-3.983-4.828-4.685-6.04l1.298-.753c.665 1.15 2.128 3.421 4.447 5.731.296.296.59.582.885.848q.11.1.22.192l.148.126A6.7 6.7 0 0 1 12 8.683c.3 0 .594.026.884.064a25 25 0 0 1-1.381-1.106 24 24 0 0 1-1.288-1.22 28 28 0 0 1-3-3.557L8.44 2a26.8 26.8 0 0 0 3.547 4.053l.166-.151c.186-.17.372-.339.558-.529A27 27 0 0 0 15.56 2l1.227.864a28 28 0 0 1-3.005 3.562c-.153.156-.306.296-.46.436l-.196.18c.584.477 1.116.874 1.553 1.179l.128-.122q.16-.149.323-.31c2.32-2.312 3.783-4.584 4.448-5.733l1.298.752c-.702 1.213-2.245 3.61-4.686 6.042-.254.254-.508.492-.758.726m-1.484 6.52.86-.318a.297.297 0 0 0 0-.556l-.86-.318a2.29 2.29 0 0 1-1.351-1.351l-.318-.86a.296.296 0 0 0-.556 0l-.318.86a2.29 2.29 0 0 1-1.351 1.351l-.86.318a.297.297 0 0 0 0 .556l.86.318c.626.232 1.12.725 1.35 1.351l.319.86c.095.258.46.258.556 0l.318-.86a2.29 2.29 0 0 1 1.351-1.351"
11
+ d: "m15.431 9.576-.034.033a6.75 6.75 0 0 1 3.353 5.823 6.757 6.757 0 0 1-6.75 6.75 6.757 6.757 0 0 1-6.75-6.75A6.75 6.75 0 0 1 8.603 9.61a27 27 0 0 1-.793-.76C5.37 6.42 3.827 4.022 3.125 2.81l1.298-.753c.665 1.15 2.128 3.421 4.447 5.731.296.296.59.582.885.848q.11.1.22.192l.148.126A6.7 6.7 0 0 1 12 8.683c.3 0 .594.026.884.064a25 25 0 0 1-1.381-1.106 24 24 0 0 1-1.288-1.22 28 28 0 0 1-3-3.557L8.44 2a26.8 26.8 0 0 0 3.547 4.053l.166-.151c.186-.17.372-.339.558-.529A27 27 0 0 0 15.56 2l1.227.864a28 28 0 0 1-3.005 3.562c-.153.156-.306.296-.46.436l-.196.18c.584.477 1.116.874 1.553 1.179l.128-.122q.16-.149.323-.31c2.32-2.312 3.783-4.584 4.448-5.733l1.298.752c-.702 1.213-2.245 3.61-4.686 6.042-.254.254-.508.492-.758.726m-1.484 6.52.86-.318a.297.297 0 0 0 0-.556l-.86-.318a2.3 2.3 0 0 1-1.351-1.351l-.318-.86a.296.296 0 0 0-.556 0l-.318.86a2.3 2.3 0 0 1-1.351 1.351l-.86.318a.297.297 0 0 0 0 .556l.86.318c.626.232 1.12.725 1.35 1.351l.319.86c.095.258.46.258.556 0l.318-.86a2.3 2.3 0 0 1 1.351-1.351"
12
12
  })
13
13
  });
14
14
  export default AwardIcon;
package/bpk-component-icon/lg/baggage-personal-item.js ADDED
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ const BaggagePersonalItemIcon = props => /*#__PURE__*/_jsx("svg", {
4
+ xmlns: "http://www.w3.org/2000/svg",
5
+ viewBox: "0 0 24 24",
6
+ "aria-hidden": "true",
7
+ width: "1.5rem",
8
+ height: "1.5rem",
9
+ ...props,
10
+ children: /*#__PURE__*/_jsx("path", {
11
+ d: "M12 2a3 3 0 0 1 3 3v.803A6 6 0 0 1 18 11v2h1a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1h-1.17A3 3 0 0 1 15 21H9a3 3 0 0 1-2.83-2H5a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h1v-2c0-2.22 1.207-4.16 3-5.197V5a3 3 0 0 1 3-3m0 3c.699 0 1.37.12 1.994.34a2 2 0 0 0-3.988 0A6 6 0 0 1 12 5M8 15.5a.5.5 0 0 0 .5.5h1l.75 1.299a.5.5 0 1 0 .866-.5L10.655 16H15.5a.5.5 0 0 0 0-1h-7a.5.5 0 0 0-.5.5"
12
+ })
13
+ });
14
+ export default BaggagePersonalItemIcon;
package/bpk-component-icon/lg/bus.js CHANGED
@@ -1,14 +1,17 @@
1
1
  import React from 'react';
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- const BusIcon = props => /*#__PURE__*/_jsx("svg", {
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ const BusIcon = props => /*#__PURE__*/_jsxs("svg", {
4
4
  xmlns: "http://www.w3.org/2000/svg",
5
5
  viewBox: "0 0 24 24",
6
6
  "aria-hidden": "true",
7
7
  width: "1.5rem",
8
8
  height: "1.5rem",
9
9
  ...props,
10
- children: /*#__PURE__*/_jsx("path", {
11
- d: "M2 4a1 1 0 0 0-1 1v10a3 3 0 0 0 3 3h9.518a.55.55 0 0 0 .526-.48A2.797 2.797 0 0 1 17 15a3.01 3.01 0 0 1 2.924 2.565.54.54 0 0 0 .518.435h1.826C23 18 23 16.5 23 15.5a6.72 6.72 0 0 0-1-4 6.36 6.36 0 0 0-3.525-2.442 1.34 1.34 0 0 1-.775-.432l-2.311-2.88A3.77 3.77 0 0 0 12.015 4h-1.553a.973.973 0 0 0-.888 1 .973.973 0 0 0 .888 1h1.56c1.11 0 1.622 0 2.072.603l.767 1.01A1.455 1.455 0 0 1 14.35 10h-3.4a2 2 0 0 1-1.868-1.286L7.92 5.671A1.95 1.95 0 0 0 6.023 4zm15 16a2 2 0 1 0-2.001-2A2 2 0 0 0 17 20"
12
- })
10
+ children: [/*#__PURE__*/_jsx("path", {
11
+ d: "M19.386 5c.448 0 .878.13 1.246.375 1.071.711 2.868 2.617 2.868 7.375v2.5c0 1.24-1.01 2.25-2.25 2.25H20a2.5 2.5 0 0 0-5 0H8a2.5 2.5 0 0 0-5 0h-.75C1.01 17.5 0 16.49 0 15.25v-8C0 6.01 1.01 5 2.25 5zm2.593 6.94c-.183-3.592-1.561-4.907-2.178-5.317a.73.73 0 0 0-.415-.123H16.5v3.521c2.611.152 4.385 1.082 5.479 1.918M15 6.5H2.25a.75.75 0 0 0-.75.75V10H15z",
12
+ clipRule: "evenodd"
13
+ }), /*#__PURE__*/_jsx("path", {
14
+ d: "M19 17.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-12 0a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0"
15
+ })]
13
16
  });
14
17
  export default BusIcon;
package/bpk-component-icon/sm/award.js CHANGED
@@ -8,7 +8,7 @@ const AwardIcon = props => /*#__PURE__*/_jsx("svg", {
8
8
  height: "1rem",
9
9
  ...props,
10
10
  children: /*#__PURE__*/_jsx("path", {
11
- d: "m15.431 9.828-.034.032a6.75 6.75 0 0 1 3.353 5.824 6.757 6.757 0 0 1-6.75 6.75 6.757 6.757 0 0 1-6.75-6.75 6.75 6.75 0 0 1 3.353-5.823 27 27 0 0 1-.793-.76C5.212 6.593 3.35 3.465 2.648 2.25l1.298-.751.014.024C4.634 2.687 6.2 5.393 8.87 8.04c.296.295.59.582.885.848q.11.1.22.192l.148.126A6.7 6.7 0 0 1 12 8.935c.3 0 .594.026.884.064a25 25 0 0 1-1.381-1.106 24 24 0 0 1-1.288-1.22c-1.283-1.233-2.687-3.078-3.549-4.3l1.227-.864c.801 1.137 2.14 2.894 3.39 4.112.238.242.472.467.705.684l.166-.151c.186-.17.372-.339.558-.529 1.228-1.188 2.592-2.983 3.393-4.12l1.227.864c-.861 1.222-2.285 3.1-3.551 4.309-.153.156-.306.296-.46.436l-.196.18c.584.477 1.116.874 1.553 1.179l.128-.122c.107-.101.214-.202.323-.311 2.682-2.665 4.12-5.156 4.823-6.374l.093-.161 1.298.752-.03.052c-.718 1.24-2.333 4.031-5.124 6.793-.254.254-.508.492-.758.726m-.625 6.134a.297.297 0 0 0 0-.556l-.859-.318a2.29 2.29 0 0 1-1.351-1.351l-.318-.86a.296.296 0 0 0-.556 0l-.318.86a2.29 2.29 0 0 1-1.351 1.351l-.86.318a.297.297 0 0 0 0 .556l.86.318c.626.232 1.12.725 1.35 1.351l.319.86c.095.258.46.258.556 0l.318-.86a2.29 2.29 0 0 1 1.351-1.35z"
11
+ d: "m15.431 9.828-.034.032a6.75 6.75 0 0 1 3.353 5.824 6.757 6.757 0 0 1-6.75 6.75 6.757 6.757 0 0 1-6.75-6.75 6.75 6.75 0 0 1 3.353-5.823 27 27 0 0 1-.793-.76C5.212 6.593 3.35 3.465 2.648 2.25l1.298-.751.014.024c.674 1.164 2.24 3.87 4.91 6.517.296.295.59.582.885.848q.11.1.22.192l.148.126A6.7 6.7 0 0 1 12 8.935c.3 0 .594.026.884.064a25 25 0 0 1-1.381-1.106 24 24 0 0 1-1.288-1.22c-1.283-1.233-2.687-3.078-3.549-4.3l1.227-.864c.801 1.137 2.14 2.894 3.39 4.112.238.242.472.467.705.684l.166-.151c.186-.17.372-.339.558-.529 1.228-1.188 2.592-2.983 3.393-4.12l1.227.864c-.861 1.222-2.285 3.1-3.551 4.309-.153.156-.306.296-.46.436l-.196.18c.584.477 1.116.874 1.553 1.179l.128-.122c.107-.101.214-.202.323-.311 2.682-2.665 4.12-5.156 4.823-6.374l.093-.161 1.298.752-.03.052c-.718 1.24-2.333 4.031-5.124 6.793-.254.254-.508.492-.758.726m-.625 6.134a.297.297 0 0 0 0-.556l-.859-.318a2.3 2.3 0 0 1-1.351-1.351l-.318-.86a.296.296 0 0 0-.556 0l-.318.86a2.3 2.3 0 0 1-1.351 1.351l-.86.318a.297.297 0 0 0 0 .556l.86.318c.626.232 1.12.725 1.35 1.351l.319.86c.095.258.46.258.556 0l.318-.86a2.3 2.3 0 0 1 1.351-1.35z"
12
12
  })
13
13
  });
14
14
  export default AwardIcon;
package/bpk-component-icon/sm/baggage-personal-item.js ADDED
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ const BaggagePersonalItemIcon = props => /*#__PURE__*/_jsx("svg", {
4
+ xmlns: "http://www.w3.org/2000/svg",
5
+ viewBox: "0 0 24 24",
6
+ "aria-hidden": "true",
7
+ width: "1rem",
8
+ height: "1rem",
9
+ ...props,
10
+ children: /*#__PURE__*/_jsx("path", {
11
+ d: "M12.25 3q.772.002 1.5.15V3a1.5 1.5 0 0 0-3 0v.15q.728-.149 1.5-.15m-7.5 7.5a7.5 7.5 0 0 1 4.5-6.876V3a3 3 0 1 1 6 0v.624a7.5 7.5 0 0 1 4.5 6.876v3h1.5a1.5 1.5 0 0 1 1.5 1.5v4.5a1.5 1.5 0 0 1-1.5 1.5h-1.901a3 3 0 0 1-2.599 1.5h-9A3 3 0 0 1 5.151 21H3.25a1.5 1.5 0 0 1-1.5-1.5V15a1.5 1.5 0 0 1 1.5-1.5h1.5zm3 5.25c0 .414.336.75.75.75H10l1.125 1.949a.75.75 0 0 0 1.299-.75l-.692-1.199H16a.75.75 0 0 0 0-1.5H8.5a.75.75 0 0 0-.75.75"
12
+ })
13
+ });
14
+ export default BaggagePersonalItemIcon;
package/bpk-component-icon/sm/bus.js CHANGED
@@ -8,9 +8,10 @@ const BusIcon = props => /*#__PURE__*/_jsxs("svg", {
8
8
  height: "1rem",
9
9
  ...props,
10
10
  children: [/*#__PURE__*/_jsx("path", {
11
- d: "M3.419 5.25a1.96 1.96 0 0 0-1.922 2v9a1 1 0 0 0 1 1h10.25a.925.925 0 0 0 .843-.742 3.001 3.001 0 0 1 5.82.026.86.86 0 0 0 .748.702c.338.014.64.014.839.014h.739a.76.76 0 0 0 .758-.75q.022-.882-.008-1.765c.04-.985-.491-2.985-1.491-3.485a7.2 7.2 0 0 0-2.865-.965 1.04 1.04 0 0 1-.68-.345l-2.566-2.944A3.77 3.77 0 0 0 11.51 5.25H9.958a1.007 1.007 0 0 0 0 2h1.559c1.11 0 1.622 0 2.073.603l.766 1.01a1.455 1.455 0 0 1-.51 2.387h-3.4a2 2 0 0 1-1.868-1.286L7.415 6.921A1.946 1.946 0 0 0 5.519 5.25z"
11
+ d: "M19.799 4.5c.456 0 .896.132 1.272.382C22.165 5.61 24 7.556 24 12.415v4.787a2.3 2.3 0 0 1-2.298 2.298H21a3 3 0 1 0-6 0H9a3 3 0 1 0-6 0h-.702A2.3 2.3 0 0 1 0 17.202V6.798A2.3 2.3 0 0 1 2.298 4.5zm2.7 7.5c0-3.75-1.67-5.439-2.277-5.842a.75.75 0 0 0-.423-.126H16.85V10.5c2.667.155 4.532.646 5.649 1.5m-7.18-5.968H2.298a.767.767 0 0 0-.766.766v3.68h13.787z",
12
+ clipRule: "evenodd"
12
13
  }), /*#__PURE__*/_jsx("path", {
13
- d: "M16.497 18.75a1.5 1.5 0 1 0-1.5-1.5 1.5 1.5 0 0 0 1.5 1.5"
14
+ d: "M7.5 19.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0M18 21a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3"
14
15
  })]
15
16
  });
16
17
  export default BusIcon;
package/bpk-component-icon/sm/check.js ADDED
@@ -0,0 +1,18 @@
1
+ import React from 'react';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ const CheckIcon = props => /*#__PURE__*/_jsx("svg", {
4
+ xmlns: "http://www.w3.org/2000/svg",
5
+ viewBox: "0 0 24 24",
6
+ "aria-hidden": "true",
7
+ width: "1rem",
8
+ height: "1rem",
9
+ ...props,
10
+ children: /*#__PURE__*/_jsx("path", {
11
+ stroke: "#fff",
12
+ strokeLinecap: "round",
13
+ strokeLinejoin: "round",
14
+ strokeWidth: 3,
15
+ d: "M2.354 3.646 5.5 7.5l6-6"
16
+ })
17
+ });
18
+ export default CheckIcon;
package/bpk-component-icon/xl/star-half.js ADDED
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ const StarHalfIcon = props => /*#__PURE__*/_jsx("svg", {
4
+ xmlns: "http://www.w3.org/2000/svg",
5
+ viewBox: "0 0 24 24",
6
+ "aria-hidden": "true",
7
+ width: "2rem",
8
+ height: "2rem",
9
+ ...props,
10
+ children: /*#__PURE__*/_jsx("path", {
11
+ d: "M21.773 10.386a.795.795 0 0 0-.416-1.338l-5.476-.83a1 1 0 0 1-.755-.563l-2.454-5.217a.734.734 0 0 0-1.344 0L8.875 7.655a1 1 0 0 1-.755.563l-5.477.829a.795.795 0 0 0-.416 1.339l3.993 4.07a1 1 0 0 1 .273.863l-.948 5.761a.757.757 0 0 0 1.087.828l4.885-2.695a1 1 0 0 1 .966 0l4.885 2.695a.757.757 0 0 0 1.087-.827l-.943-5.763a1 1 0 0 1 .272-.862zm-5.417 2.671a3 3 0 0 0-.818 2.584l.535 3.268-2.623-1.447a3 3 0 0 0-1.45-.374V5.71l1.316 2.796a3 3 0 0 0 2.266 1.69l3.115.471z"
12
+ })
13
+ });
14
+ export default StarHalfIcon;
package/bpk-component-icon/xl/star-outline.js ADDED
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ const StarOutlineIcon = props => /*#__PURE__*/_jsx("svg", {
4
+ xmlns: "http://www.w3.org/2000/svg",
5
+ viewBox: "0 0 24 24",
6
+ "aria-hidden": "true",
7
+ width: "2rem",
8
+ height: "2rem",
9
+ ...props,
10
+ children: /*#__PURE__*/_jsx("path", {
11
+ d: "M21.773 10.386a.795.795 0 0 0-.416-1.34l-5.476-.828a1 1 0 0 1-.755-.563l-2.454-5.217a.735.735 0 0 0-1.344 0L8.875 7.655a1 1 0 0 1-.756.563l-5.476.83a.795.795 0 0 0-.416 1.338l3.993 4.07a1 1 0 0 1 .273.863l-.948 5.76a.757.757 0 0 0 1.087.829l4.885-2.695a1 1 0 0 1 .966 0l4.885 2.695a.757.757 0 0 0 1.087-.827l-.943-5.763a1 1 0 0 1 .272-.862zm-5.417 2.672a3 3 0 0 0-.818 2.584l.535 3.268-2.624-1.447a3 3 0 0 0-2.898 0l-2.622 1.446.537-3.265a3 3 0 0 0-.818-2.588l-2.343-2.388 3.114-.471a3 3 0 0 0 2.265-1.69L12 5.71l1.316 2.797a3 3 0 0 0 2.266 1.69l3.115.47z"
12
+ })
13
+ });
14
+ export default StarOutlineIcon;
package/bpk-component-icon/xl/star.js ADDED
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ const StarIcon = props => /*#__PURE__*/_jsx("svg", {
4
+ xmlns: "http://www.w3.org/2000/svg",
5
+ viewBox: "0 0 24 24",
6
+ "aria-hidden": "true",
7
+ width: "2rem",
8
+ height: "2rem",
9
+ ...props,
10
+ children: /*#__PURE__*/_jsx("path", {
11
+ d: "M8.12 8.218a1 1 0 0 0 .755-.563l2.453-5.217a.735.735 0 0 1 1.344 0l2.454 5.217a1 1 0 0 0 .755.563l5.476.83a.795.795 0 0 1 .416 1.338l-3.989 4.07a1 1 0 0 0-.272.862l.943 5.763a.757.757 0 0 1-1.087.827l-4.885-2.695a1 1 0 0 0-.966 0l-4.885 2.695a.757.757 0 0 1-1.087-.828l.948-5.761a1 1 0 0 0-.273-.863l-3.993-4.07a.795.795 0 0 1 .416-1.34z"
12
+ })
13
+ });
14
+ export default StarIcon;
package/bpk-component-inset-banner/src/BpkInsetBanner.d.ts CHANGED
@@ -19,6 +19,9 @@ export type Props = {
19
19
  buttonA11yLabel?: string;
20
20
  popverLabel?: string;
21
21
  popoverId?: string;
22
+ popoverWidth?: string;
23
+ popoverMarginStart?: string;
24
+ popoverMarginEnd?: string;
22
25
  labelTitle?: boolean;
23
26
  closeBtnIcon?: boolean;
24
27
  zIndexCustom?: number;
package/bpk-component-inset-banner/src/BpkInsetBanner.js CHANGED
@@ -38,6 +38,9 @@ const BpkInsetBanner = ({
38
38
  variant = VARIANT.onLight
39
39
  }) => {
40
40
  const classNames = getClassName('bpk-inset-banner', `bpk-inset-banner--${variant}`, body && 'bpk-inset-banner--with-body');
41
+ const popoverWidth = callToAction?.popoverWidth || 'auto';
42
+ const popoverMarginStart = callToAction?.popoverMarginStart || 'auto';
43
+ const popoverMarginEnd = callToAction?.popoverMarginEnd || 'auto';
41
44
  return /*#__PURE__*/_jsxs("div", {
42
45
  children: [/*#__PURE__*/_jsxs("div", {
43
46
  "aria-label": accessibilityLabel,
@@ -71,6 +74,11 @@ const BpkInsetBanner = ({
71
74
  e.preventDefault();
72
75
  },
73
76
  children: /*#__PURE__*/_jsx(BpkPopover, {
77
+ style: {
78
+ width: popoverWidth,
79
+ marginInlineEnd: popoverMarginEnd,
80
+ marginInlineStart: popoverMarginStart
81
+ },
74
82
  id: callToAction?.popoverId || '',
75
83
  label: callToAction?.popverLabel || '',
76
84
  placement: callToAction?.popoverPlacement || 'bottom',
package/bpk-component-inset-banner/src/BpkInsetBanner.module.css CHANGED
@@ -15,4 +15,4 @@
15
15
  * See the License for the specific language governing permissions and
16
16
  * limitations under the License.
17
17
  */
18
- .bpk-inset-banner{display:flex;padding:.5rem 1rem;justify-content:space-between;border-radius:.5rem}.bpk-inset-banner--with-body{border-radius:.5rem .5rem 0 0}.bpk-inset-banner--on-light{color:#161616;fill:#161616}.bpk-inset-banner--on-dark{color:#fff;fill:#fff}.bpk-inset-banner--content-container{display:flex;align-items:center}.bpk-inset-banner--image{max-height:2rem;object-fit:contain;padding-inline-end:1rem}@media(max-width: 32rem){.bpk-inset-banner--image{max-height:1.5rem}}.bpk-inset-banner--text-container{display:flex;flex-direction:column}.bpk-inset-banner--cta-text{display:flex;align-items:center}.bpk-inset-banner--cta-button{all:unset}.bpk-inset-banner--cta-button:focus-visible{outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-inset-banner--cta-container{display:flex;align-items:center;cursor:pointer}.bpk-inset-banner--cta-content{display:flex;align-items:center}.bpk-inset-banner--cta-info-icon{display:flex;align-items:center;margin-inline-start:.5rem}.bpk-inset-banner-body-container{display:flex;padding:1rem;flex-direction:column;border-radius:0 0 .5rem .5rem;background-color:#eff3f8;color:#161616}.bpk-inset-banner-body-container--link-text{color:#0062e3;text-decoration:none}.bpk-no-touch-support .bpk-inset-banner-body-container--link-text:hover:not(:active):not(:disabled){color:#024daf}:global(.bpk-no-touch-support) .bpk-inset-banner-body-container--link-text:hover:not(:active):not(:disabled){color:#024daf}
18
+ .bpk-inset-banner{display:flex;padding:.5rem 1rem;justify-content:space-between;border-radius:.5rem}.bpk-inset-banner--with-body{border-radius:.5rem .5rem 0 0}.bpk-inset-banner--on-light{color:#161616;fill:#161616}.bpk-inset-banner--on-dark{color:#fff;fill:#fff}.bpk-inset-banner--content-container{display:flex;align-items:center}.bpk-inset-banner--image{max-height:2rem;object-fit:contain;padding-inline-end:1rem}@media(max-width: 32rem){.bpk-inset-banner--image{max-width:7.5rem;max-height:1.5rem}}.bpk-inset-banner--text-container{display:flex;flex-direction:column}.bpk-inset-banner--cta-text{display:flex;align-items:center}.bpk-inset-banner--cta-button{all:unset}.bpk-inset-banner--cta-button:focus-visible{outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-inset-banner--cta-container{display:flex;align-items:center;cursor:pointer}.bpk-inset-banner--cta-content{display:flex;align-items:center}.bpk-inset-banner--cta-info-icon{display:flex;align-items:center;margin-inline-start:.5rem}.bpk-inset-banner-body-container{display:flex;padding:1rem;flex-direction:column;border-radius:0 0 .5rem .5rem;background-color:#eff3f8;color:#161616}.bpk-inset-banner-body-container--link-text{color:#0062e3;text-decoration:none}.bpk-no-touch-support .bpk-inset-banner-body-container--link-text:hover:not(:active):not(:disabled){color:#024daf}:global(.bpk-no-touch-support) .bpk-inset-banner-body-container--link-text:hover:not(:active):not(:disabled){color:#024daf}
package/bpk-component-price/src/BpkPrice.js CHANGED
@@ -40,6 +40,7 @@ const BpkPrice = props => {
40
40
  const {
41
41
  align,
42
42
  className,
43
+ dataAttributes,
43
44
  icon,
44
45
  leadingClassName,
45
46
  leadingText,
@@ -107,6 +108,7 @@ const BpkPrice = props => {
107
108
  children: /*#__PURE__*/_jsx(BpkText, {
108
109
  textStyle: priceTextStyle,
109
110
  tagName: "span",
111
+ ...dataAttributes,
110
112
  children: price
111
113
  })
112
114
  }), icon && /*#__PURE__*/_jsx("span", {
@@ -124,7 +126,8 @@ BpkPrice.propTypes = {
124
126
  leadingText: PropTypes.string,
125
127
  trailingText: PropTypes.string,
126
128
  previousPrice: PropTypes.string,
127
- leadingClassName: PropTypes.string
129
+ leadingClassName: PropTypes.string,
130
+ dataAttributes: PropTypes.objectOf(PropTypes.string)
128
131
  };
129
132
  BpkPrice.defaultProps = {
130
133
  size: SIZES.small,
@@ -133,6 +136,7 @@ BpkPrice.defaultProps = {
133
136
  leadingText: null,
134
137
  trailingText: null,
135
138
  previousPrice: null,
136
- leadingClassName: null
139
+ leadingClassName: null,
140
+ dataAttributes: {}
137
141
  };
138
142
  export default BpkPrice;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skyscanner/backpack-web",
3
- "version": "37.0.0",
3
+ "version": "37.1.0",
4
4
  "description": "Backpack Design System web library",
5
5
  "repository": {
6
6
  "type": "git",
@@ -27,8 +27,8 @@
27
27
  "@radix-ui/react-compose-refs": "^1.1.1",
28
28
  "@radix-ui/react-slider": "1.1.2",
29
29
  "@react-google-maps/api": "^2.19.3",
30
- "@skyscanner/bpk-foundations-web": "^19.1.0",
31
- "@skyscanner/bpk-svgs": "^20.1.1",
30
+ "@skyscanner/bpk-foundations-web": "^19.4.1",
31
+ "@skyscanner/bpk-svgs": "^20.4.1",
32
32
  "a11y-focus-scope": "^1.1.3",
33
33
  "a11y-focus-store": "^1.0.0",
34
34
  "d3-path": "^2.0.0",