@skyscanner/backpack-web 42.13.3 → 42.14.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 (11) hide show
  1. package/bpk-component-ai-blurb/src/BpkAiBlurbSummary.js +3 -2
  2. package/bpk-component-ai-blurb/src/common-types.d.ts +5 -5
  3. package/bpk-component-comparison-table/src/BpkComparisonTable/BpkComparisonTableColumnHeaderPlaceholder.js +0 -3
  4. package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTray.module.css +1 -1
  5. package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayItem.d.ts +1 -1
  6. package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayItem.js +18 -20
  7. package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayItemPlaceholder.d.ts +1 -1
  8. package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayItemPlaceholder.js +4 -6
  9. package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayRoot.d.ts +1 -1
  10. package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayRoot.js +4 -4
  11. package/package.json +1 -1
package/bpk-component-ai-blurb/src/BpkAiBlurbSummary.js CHANGED
@@ -41,8 +41,9 @@ const BpkAiBlurbSummary = props => {
41
41
  textStyle: TEXT_STYLES.caption,
42
42
  children: props.errorText
43
43
  }), /*#__PURE__*/_jsx(BpkLink, {
44
- href: props.errorLinkHref,
45
- children: props.errorLinkText
44
+ as: "button",
45
+ onClick: props.onErrorClick,
46
+ children: props.errorActionText
46
47
  })]
47
48
  });
48
49
  }
package/bpk-component-ai-blurb/src/common-types.d.ts CHANGED
@@ -20,12 +20,12 @@ export type BpkAiBlurbSummaryProps = {
20
20
  } | {
21
21
  /** Controls which content is displayed. */
22
22
  state: 'error';
23
- /** Text displayed before the error link. */
23
+ /** Text displayed before the error action. */
24
24
  errorText: string;
25
- /** Text for the inline error link. */
26
- errorLinkText: string;
27
- /** href for the inline error link. */
28
- errorLinkHref: string;
25
+ /** Text for the inline error action. */
26
+ errorActionText: string;
27
+ /** Called when the inline error action is clicked (e.g. to retry). */
28
+ onErrorClick: () => void;
29
29
  };
30
30
  export type BpkAiBlurbFeedbackProps = {
31
31
  /** Text displayed before a vote is cast. e.g. "Was this helpful?" — not translated by Backpack. */
package/bpk-component-comparison-table/src/BpkComparisonTable/BpkComparisonTableColumnHeaderPlaceholder.js CHANGED
@@ -19,10 +19,7 @@
19
19
  import BpkButton, { BUTTON_TYPES, SIZE_TYPES } from "../../../bpk-component-button";
20
20
  import { BpkFlex, BpkSpacing } from "../../../bpk-component-layout";
21
21
  import BpkText, { TEXT_COLORS, TEXT_STYLES } from "../../../bpk-component-text";
22
- import { cssModules } from "../../../bpk-react-utils";
23
- import STYLES from "./BpkComparisonTable.module.css";
24
22
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
25
- const getClassName = cssModules(STYLES);
26
23
  const BpkComparisonTableColumnHeaderPlaceholder = ({
27
24
  addMoreDescription,
28
25
  addMoreLinkText,
package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTray.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-comparison-tray{width:22.1875rem;max-width:100%}@media(max-width: 32rem){.bpk-comparison-tray{width:auto;min-width:0;flex:1}}.bpk-comparison-tray__item{position:relative;width:3.875rem;height:1.75rem;flex-shrink:0}.bpk-comparison-tray__item-image-container{width:100%;height:100%;background-color:#eff3f8;overflow:hidden;border-radius:.25rem}.bpk-comparison-tray__item-image-container img{object-fit:cover}.bpk-comparison-tray__item-close{position:relative;position:absolute;top:0;inset-inline-end:calc(-8*0.0625rem);display:flex;width:1rem;height:1rem;justify-content:center;align-items:center;transform:translateY(-50%);border:.125rem solid #fff;border-radius:50%;background-color:#161616;color:#fff;cursor:pointer;box-shadow:0px 4px 14px 0px rgba(37,32,31,.25)}.bpk-comparison-tray__item-close::before{position:absolute;top:calc(-2.75rem/2 + 50%);left:calc(-2.75rem/2 + 50%);content:"";width:2.75rem;height:2.75rem}.bpk-comparison-tray__item-close svg{width:.5rem;height:.5rem;flex-shrink:0;fill:#fff}.bpk-comparison-tray__item-close:focus-visible{outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-comparison-tray__item-placeholder{width:3.875rem;height:1.75rem;flex-shrink:0;border:.0625rem dashed #c1c7cf;border-radius:.25rem}
18
+ .bpk-comparison-tray{width:22.1875rem;max-width:100%}@media(max-width: 32rem){.bpk-comparison-tray{width:auto;min-width:0;flex:1}}.bpk-comparison-tray__item{position:relative;width:3.875rem;min-width:0;flex-shrink:1;aspect-ratio:62/28}.bpk-comparison-tray__item-image-container{width:100%;height:100%;background-color:#eff3f8;overflow:hidden;border-radius:.25rem}.bpk-comparison-tray__item-image-container img{height:100%;object-fit:contain}.bpk-comparison-tray__item-close{position:relative;position:absolute;top:0;inset-inline-end:calc(-8*0.0625rem);display:flex;width:1rem;height:1rem;justify-content:center;align-items:center;transform:translateY(-50%);border:.125rem solid #fff;border-radius:50%;background-color:#161616;color:#fff;cursor:pointer;box-shadow:0px 4px 14px 0px rgba(37,32,31,.25)}.bpk-comparison-tray__item-close::before{position:absolute;top:calc(-2.75rem/2 + 50%);left:calc(-2.75rem/2 + 50%);content:"";width:2.75rem;height:2.75rem}.bpk-comparison-tray__item-close svg{width:.5rem;height:.5rem;flex-shrink:0;fill:#fff}.bpk-comparison-tray__item-close:focus-visible{outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-comparison-tray__item-placeholder{width:3.875rem;min-width:0;flex-shrink:1;border:.0625rem dashed #c1c7cf;aspect-ratio:62/28;border-radius:.25rem}
package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayItem.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import type { BpkComparisonTrayItemProps } from './common-types';
2
- declare function BpkComparisonTrayItem({ item, onRemove, removeLabel }: BpkComparisonTrayItemProps): import("react/jsx-runtime").JSX.Element;
2
+ declare const BpkComparisonTrayItem: ({ item, onRemove, removeLabel }: BpkComparisonTrayItemProps) => import("react/jsx-runtime").JSX.Element;
3
3
  export default BpkComparisonTrayItem;
package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayItem.js CHANGED
@@ -22,27 +22,25 @@ import { cssModules } from "../../../bpk-react-utils";
22
22
  import STYLES from "./BpkComparisonTray.module.css";
23
23
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
24
24
  const getClassName = cssModules(STYLES);
25
- function BpkComparisonTrayItem({
25
+ const BpkComparisonTrayItem = ({
26
26
  item,
27
27
  onRemove,
28
28
  removeLabel
29
- }) {
30
- return /*#__PURE__*/_jsxs("div", {
31
- className: getClassName('bpk-comparison-tray__item'),
32
- children: [/*#__PURE__*/_jsx("div", {
33
- className: getClassName('bpk-comparison-tray__item-image-container'),
34
- children: /*#__PURE__*/_jsx(BpkImage, {
35
- src: item.image,
36
- altText: item.imageAlt ?? item.label,
37
- aspectRatio: 62 / 28
38
- })
39
- }), /*#__PURE__*/_jsx("button", {
40
- type: "button",
41
- className: getClassName('bpk-comparison-tray__item-close'),
42
- "aria-label": removeLabel,
43
- onClick: () => onRemove(item.id),
44
- children: /*#__PURE__*/_jsx(CloseIcon, {})
45
- })]
46
- });
47
- }
29
+ }) => /*#__PURE__*/_jsxs("div", {
30
+ className: getClassName('bpk-comparison-tray__item'),
31
+ children: [/*#__PURE__*/_jsx("div", {
32
+ className: getClassName('bpk-comparison-tray__item-image-container'),
33
+ children: /*#__PURE__*/_jsx(BpkImage, {
34
+ src: item.image,
35
+ altText: item.imageAlt ?? item.label,
36
+ aspectRatio: 62 / 28
37
+ })
38
+ }), /*#__PURE__*/_jsx("button", {
39
+ type: "button",
40
+ className: getClassName('bpk-comparison-tray__item-close'),
41
+ "aria-label": removeLabel,
42
+ onClick: () => onRemove(item.id),
43
+ children: /*#__PURE__*/_jsx(CloseIcon, {})
44
+ })]
45
+ });
48
46
  export default BpkComparisonTrayItem;
package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayItemPlaceholder.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- declare function BpkComparisonTrayItemPlaceholder(): import("react/jsx-runtime").JSX.Element;
1
+ declare const BpkComparisonTrayItemPlaceholder: () => import("react/jsx-runtime").JSX.Element;
2
2
  export default BpkComparisonTrayItemPlaceholder;
package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayItemPlaceholder.js CHANGED
@@ -20,10 +20,8 @@ import { cssModules } from "../../../bpk-react-utils";
20
20
  import STYLES from "./BpkComparisonTray.module.css";
21
21
  import { jsx as _jsx } from "react/jsx-runtime";
22
22
  const getClassName = cssModules(STYLES);
23
- function BpkComparisonTrayItemPlaceholder() {
24
- return /*#__PURE__*/_jsx("div", {
25
- className: getClassName('bpk-comparison-tray__item-placeholder'),
26
- "aria-hidden": "true"
27
- });
28
- }
23
+ const BpkComparisonTrayItemPlaceholder = () => /*#__PURE__*/_jsx("div", {
24
+ className: getClassName('bpk-comparison-tray__item-placeholder'),
25
+ "aria-hidden": "true"
26
+ });
29
27
  export default BpkComparisonTrayItemPlaceholder;
package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayRoot.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import type { BpkComparisonTrayRootProps } from './common-types';
2
- declare function BpkComparisonTrayRoot({ ariaLabel, compareLabel, items, onCompare, onRemove, removeLabel, }: BpkComparisonTrayRootProps): import("react/jsx-runtime").JSX.Element;
2
+ declare const BpkComparisonTrayRoot: ({ ariaLabel, compareLabel, items, onCompare, onRemove, removeLabel, }: BpkComparisonTrayRootProps) => import("react/jsx-runtime").JSX.Element;
3
3
  export default BpkComparisonTrayRoot;
package/bpk-component-comparison-table/src/BpkComparisonTray/BpkComparisonTrayRoot.js CHANGED
@@ -26,14 +26,14 @@ import STYLES from "./BpkComparisonTray.module.css";
26
26
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
27
27
  const getClassName = cssModules(STYLES);
28
28
  const MAX_ITEMS = 3;
29
- function BpkComparisonTrayRoot({
29
+ const BpkComparisonTrayRoot = ({
30
30
  ariaLabel,
31
31
  compareLabel,
32
32
  items,
33
33
  onCompare,
34
34
  onRemove,
35
35
  removeLabel
36
- }) {
36
+ }) => {
37
37
  const displayItems = Array.from({
38
38
  length: MAX_ITEMS
39
39
  }, (_value, index) => items[index] ?? null);
@@ -45,7 +45,7 @@ function BpkComparisonTrayRoot({
45
45
  role: "region",
46
46
  "aria-label": ariaLabel,
47
47
  children: /*#__PURE__*/_jsxs(BpkCardV2.Body, {
48
- templateColumns: "1fr auto",
48
+ templateColumns: "minmax(0, 1fr) auto",
49
49
  align: "center",
50
50
  gap: BpkSpacing.Base,
51
51
  children: [/*#__PURE__*/_jsx(BpkCardV2.Section, {
@@ -71,5 +71,5 @@ function BpkComparisonTrayRoot({
71
71
  })
72
72
  })
73
73
  });
74
- }
74
+ };
75
75
  export default BpkComparisonTrayRoot;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skyscanner/backpack-web",
3
- "version": "42.13.3",
3
+ "version": "42.14.0",
4
4
  "description": "Backpack Design System web library",
5
5
  "repository": {
6
6
  "type": "git",