@skyscanner/backpack-web 41.0.1 → 41.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 (26) hide show
  1. package/bpk-component-bottom-sheet/src/BpkBottomSheet.js +0 -1
  2. package/bpk-component-breadcrumb/src/BpkBreadcrumbItem.js +1 -2
  3. package/bpk-component-datepicker/src/themeAttributes.d.ts +1 -1
  4. package/bpk-component-drawer/src/BpkDrawerContent.js +0 -1
  5. package/bpk-component-drawer/src/themeAttributes.d.ts +1 -1
  6. package/bpk-component-drawer/src/themeAttributes.js +0 -1
  7. package/bpk-component-info-banner/src/BpkInfoBannerInner.js +1 -2
  8. package/bpk-component-link/index.d.ts +6 -0
  9. package/bpk-component-link/index.js +3 -1
  10. package/bpk-component-link/src/BpkButtonLink.d.ts +13 -0
  11. package/bpk-component-link/src/BpkButtonLink.js +11 -21
  12. package/bpk-component-link/src/BpkLink.d.ts +16 -0
  13. package/bpk-component-link/src/BpkLink.js +16 -29
  14. package/bpk-component-link/src/themeAttributes.d.ts +4 -0
  15. package/bpk-component-link/src/themeAttributes.js +3 -1
  16. package/bpk-component-modal/src/BpkModalInner.js +0 -1
  17. package/bpk-component-modal/src/themeAttributes.d.ts +1 -1
  18. package/bpk-component-modal/src/themeAttributes.js +0 -1
  19. package/bpk-component-navigation-bar/src/BpkNavigationBarButtonLink.d.ts +1 -1
  20. package/bpk-component-navigation-bar/src/BpkNavigationBarButtonLink.js +0 -1
  21. package/bpk-component-popover/src/BpkPopover.js +0 -1
  22. package/bpk-component-popover/src/themeAttributes.d.ts +1 -1
  23. package/bpk-component-popover/src/themeAttributes.js +0 -1
  24. package/bpk-component-rtl-toggle/src/BpkRtlToggle.d.ts +2 -1
  25. package/bpk-component-rtl-toggle/src/BpkRtlToggle.js +0 -2
  26. package/package.json +1 -1
@@ -20,7 +20,6 @@ import { useCallback, useState } from 'react';
20
20
  import BpkBreakpoint, { BREAKPOINTS } from "../../bpk-component-breakpoint";
21
21
  // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
22
22
  import BpkCloseButton from "../../bpk-component-close-button";
23
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
24
23
  import { BpkButtonLink } from "../../bpk-component-link";
25
24
  import BpkNavigationBar from "../../bpk-component-navigation-bar";
26
25
  import { TEXT_STYLES } from "../../bpk-component-text/src/BpkText";
@@ -18,7 +18,6 @@
18
18
 
19
19
  import { withRtlSupport } from "../../bpk-component-icon";
20
20
  import ArrowRight from "../../bpk-component-icon/sm/arrow-right";
21
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
22
21
  import BpkLink from "../../bpk-component-link";
23
22
  import BpkText from "../../bpk-component-text";
24
23
  import { cssModules } from "../../bpk-react-utils";
@@ -48,7 +47,7 @@ const BpkBreadcrumbItem = props => {
48
47
  }) : /*#__PURE__*/_jsx("div", {
49
48
  className: getClassName('bpk-breadcrumb-item__link'),
50
49
  children: /*#__PURE__*/_jsx(BpkLink, {
51
- href: href,
50
+ href: href || '#',
52
51
  ...linkProps,
53
52
  children: children
54
53
  })
@@ -1,2 +1,2 @@
1
- declare const _default: any[];
1
+ declare const _default: string[];
2
2
  export default _default;
@@ -21,7 +21,6 @@ import { animations } from '@skyscanner/bpk-foundations-web/tokens/base.es6';
21
21
 
22
22
  // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
23
23
  import BpkCloseButton from "../../bpk-component-close-button";
24
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
25
24
  import { BpkButtonLink } from "../../bpk-component-link";
26
25
  import { cssModules } from "../../bpk-react-utils";
27
26
  import STYLES from "./BpkDrawerContent.module.css";
@@ -1,2 +1,2 @@
1
- declare const _default: any[];
1
+ declare const _default: string[];
2
2
  export default _default;
@@ -16,6 +16,5 @@
16
16
  * limitations under the License.
17
17
  */
18
18
 
19
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
20
19
  import { themeAttributes as linkAttributes } from "../../bpk-component-link";
21
20
  export default [...linkAttributes];
@@ -31,7 +31,6 @@ import ChevronDownIcon from "../../bpk-component-icon/sm/chevron-down";
31
31
  import ChevronUpIcon from "../../bpk-component-icon/sm/chevron-up";
32
32
  import InfoCircleIcon from "../../bpk-component-icon/sm/information-circle";
33
33
  import TickCircleIcon from "../../bpk-component-icon/sm/tick-circle";
34
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
35
34
  import BpkLink from "../../bpk-component-link";
36
35
  import { cssModules } from "../../bpk-react-utils";
37
36
  import AnimateAndFade from "./AnimateAndFade";
@@ -153,7 +152,7 @@ const BpkInfoBannerInner = ({
153
152
  children: children
154
153
  }), isExpandable && action && /*#__PURE__*/_jsx(BpkLink, {
155
154
  onClick: action.callback,
156
- href: null,
155
+ href: "#",
157
156
  children: action.title
158
157
  })]
159
158
  })]
@@ -0,0 +1,6 @@
1
+ import BpkButtonLink, { type Props as BpkButtonLinkProps } from './src/BpkButtonLink';
2
+ import BpkLink, { type Props as BpkLinkProps } from './src/BpkLink';
3
+ import themeAttributes, { linkAlternateThemeAttributes } from './src/themeAttributes';
4
+ export type { BpkButtonLinkProps, BpkLinkProps };
5
+ export default BpkLink;
6
+ export { BpkButtonLink, themeAttributes, linkAlternateThemeAttributes };
@@ -14,7 +14,9 @@
14
14
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
15
  * See the License for the specific language governing permissions and
16
16
  * limitations under the License.
17
- */import BpkButtonLink from "./src/BpkButtonLink";
17
+ */
18
+
19
+ import BpkButtonLink from "./src/BpkButtonLink";
18
20
  import BpkLink from "./src/BpkLink";
19
21
  import themeAttributes, { linkAlternateThemeAttributes } from "./src/themeAttributes";
20
22
  export default BpkLink;
@@ -0,0 +1,13 @@
1
+ import type { ReactNode, MouseEvent, ButtonHTMLAttributes } from 'react';
2
+ import themeAttributes from './themeAttributes';
3
+ export interface Props extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'className' | 'onClick'> {
4
+ /** The content of the link. */
5
+ children: ReactNode;
6
+ onClick: (event: MouseEvent<HTMLButtonElement>) => void;
7
+ className?: string | null;
8
+ alternate?: boolean;
9
+ implicit?: boolean;
10
+ }
11
+ declare const BpkButtonLink: ({ alternate, children, className, implicit, onClick, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
12
+ export { themeAttributes };
13
+ export default BpkButtonLink;
@@ -14,7 +14,8 @@
14
14
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
15
  * See the License for the specific language governing permissions and
16
16
  * limitations under the License.
17
- */import PropTypes from 'prop-types';
17
+ */
18
+
18
19
  import { cssModules } from "../../bpk-react-utils";
19
20
  import themeAttributes from "./themeAttributes";
20
21
  import STYLES from "./BpkLink.module.css";
@@ -46,27 +47,16 @@ const BpkButtonLink = ({
46
47
  } else if (implicit && alternate) {
47
48
  underlinedClassNames.push(getClassName('bpk-link-underlined-implicit--alternate'));
48
49
  }
49
- return (
50
- /*#__PURE__*/
51
- // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
52
- _jsx("button", {
53
- type: "button",
54
- className: classNames.join(' '),
55
- onClick: onClick,
56
- ...rest,
57
- children: /*#__PURE__*/_jsx("span", {
58
- className: underlinedClassNames.join(' '),
59
- children: children
60
- })
50
+ return /*#__PURE__*/_jsx("button", {
51
+ type: "button",
52
+ className: classNames.join(' '),
53
+ onClick: onClick,
54
+ ...rest,
55
+ children: /*#__PURE__*/_jsx("span", {
56
+ className: underlinedClassNames.join(' '),
57
+ children: children
61
58
  })
62
- );
63
- };
64
- BpkButtonLink.propTypes = {
65
- onClick: PropTypes.func.isRequired,
66
- children: PropTypes.node.isRequired,
67
- className: PropTypes.string,
68
- alternate: PropTypes.bool,
69
- implicit: PropTypes.bool
59
+ });
70
60
  };
71
61
  export { themeAttributes };
72
62
  export default BpkButtonLink;
@@ -0,0 +1,16 @@
1
+ import type { ReactNode, MouseEvent, AnchorHTMLAttributes } from 'react';
2
+ import themeAttributes, { linkAlternateThemeAttributes } from './themeAttributes';
3
+ export interface Props extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'className' | 'rel'> {
4
+ /** The content of the link. */
5
+ children: ReactNode;
6
+ href: string | null;
7
+ className?: string | null;
8
+ onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
9
+ blank?: boolean;
10
+ rel?: string | null;
11
+ alternate?: boolean;
12
+ implicit?: boolean;
13
+ }
14
+ declare const BpkLink: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<HTMLAnchorElement>>;
15
+ export default BpkLink;
16
+ export { themeAttributes, linkAlternateThemeAttributes };
@@ -14,7 +14,8 @@
14
14
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
15
  * See the License for the specific language governing permissions and
16
16
  * limitations under the License.
17
- */import PropTypes from 'prop-types';
17
+ */
18
+
18
19
  import { forwardRef } from 'react';
19
20
  import { cssModules } from "../../bpk-react-utils";
20
21
  import themeAttributes, { linkAlternateThemeAttributes } from "./themeAttributes";
@@ -28,13 +29,13 @@ const BpkLink = /*#__PURE__*/forwardRef(({
28
29
  className = null,
29
30
  href,
30
31
  implicit = false,
31
- onClick = null,
32
+ onClick = () => {},
32
33
  rel: propRel = null,
33
34
  ...rest
34
35
  }, ref) => {
35
36
  const classNames = [getClassName('bpk-link')];
36
37
  const underlinedClassNames = [getClassName('bpk-link-underlined')];
37
- const target = blank ? '_blank' : null;
38
+ const target = blank ? '_blank' : undefined;
38
39
  const rel = blank ? propRel || 'noopener noreferrer' : propRel;
39
40
  if (className) {
40
41
  classNames.push(className);
@@ -52,33 +53,19 @@ const BpkLink = /*#__PURE__*/forwardRef(({
52
53
  } else if (implicit && alternate) {
53
54
  underlinedClassNames.push(getClassName('bpk-link-underlined-implicit--alternate'));
54
55
  }
55
- return (
56
- /*#__PURE__*/
57
- // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
58
- _jsx("a", {
59
- className: classNames.join(' '),
60
- href: href,
61
- onClick: onClick,
62
- target: target,
63
- rel: rel,
64
- ref: ref,
65
- ...rest,
66
- children: /*#__PURE__*/_jsx("span", {
67
- className: underlinedClassNames.join(' '),
68
- children: children
69
- })
56
+ return /*#__PURE__*/_jsx("a", {
57
+ className: classNames.join(' '),
58
+ href: href ?? undefined,
59
+ onClick: onClick,
60
+ target: target,
61
+ rel: rel ?? undefined,
62
+ ref: ref,
63
+ ...rest,
64
+ children: /*#__PURE__*/_jsx("span", {
65
+ className: underlinedClassNames.join(' '),
66
+ children: children
70
67
  })
71
- );
68
+ });
72
69
  });
73
- BpkLink.propTypes = {
74
- children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,
75
- href: PropTypes.string.isRequired,
76
- className: PropTypes.string,
77
- onClick: PropTypes.func,
78
- blank: PropTypes.bool,
79
- rel: PropTypes.string,
80
- alternate: PropTypes.bool,
81
- implicit: PropTypes.bool
82
- };
83
70
  export default BpkLink;
84
71
  export { themeAttributes, linkAlternateThemeAttributes };
@@ -0,0 +1,4 @@
1
+ declare const _default: string[];
2
+ export default _default;
3
+ declare const linkAlternateThemeAttributes: string[];
4
+ export { linkAlternateThemeAttributes };
@@ -14,6 +14,8 @@
14
14
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15
15
  * See the License for the specific language governing permissions and
16
16
  * limitations under the License.
17
- */export default ['linkColor', 'linkHoverColor', 'linkActiveColor', 'linkVisitedColor'];
17
+ */
18
+
19
+ export default ['linkColor', 'linkHoverColor', 'linkActiveColor', 'linkVisitedColor'];
18
20
  const linkAlternateThemeAttributes = ['linkAlternateColor', 'linkAlternateHoverColor', 'linkAlternateActiveColor', 'linkAlternateVisitedColor'];
19
21
  export { linkAlternateThemeAttributes };
@@ -18,7 +18,6 @@
18
18
 
19
19
  // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
20
20
  import BpkCloseButton from "../../bpk-component-close-button";
21
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
22
21
  import { BpkButtonLink } from "../../bpk-component-link";
23
22
  import BpkNavigationBar, { BAR_STYLES } from "../../bpk-component-navigation-bar";
24
23
  import { TransitionInitialMount, cssModules } from "../../bpk-react-utils";
@@ -1,2 +1,2 @@
1
- declare const _default: any[];
1
+ declare const _default: string[];
2
2
  export default _default;
@@ -16,6 +16,5 @@
16
16
  * limitations under the License.
17
17
  */
18
18
 
19
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
20
19
  import { themeAttributes as linkAttributes } from "../../bpk-component-link";
21
20
  export default [...linkAttributes];
@@ -1,7 +1,7 @@
1
1
  import type { ComponentProps, MouseEvent, ReactNode } from 'react';
2
2
  import { BpkButtonLink } from '../../bpk-component-link';
3
3
  import { type BarStyle } from './BpkNavigationBar';
4
- export interface Props extends ComponentProps<BpkButtonLink> {
4
+ export interface Props extends ComponentProps<typeof BpkButtonLink> {
5
5
  children: ReactNode;
6
6
  onClick: (event: MouseEvent<HTMLElement>) => void;
7
7
  className?: string;
@@ -16,7 +16,6 @@
16
16
  * limitations under the License.
17
17
  */
18
18
 
19
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
20
19
  import { BpkButtonLink } from "../../bpk-component-link";
21
20
  import { BAR_STYLES } from "./BpkNavigationBar";
22
21
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -22,7 +22,6 @@ import { surfaceHighlightDay } from '@skyscanner/bpk-foundations-web/tokens/base
22
22
 
23
23
  // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
24
24
  import BpkCloseButton from "../../bpk-component-close-button";
25
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
26
25
  import { BpkButtonLink } from "../../bpk-component-link";
27
26
  import BpkText, { TEXT_STYLES } from "../../bpk-component-text";
28
27
  import { TransitionInitialMount, cssModules } from "../../bpk-react-utils";
@@ -1,2 +1,2 @@
1
- declare const _default: any[];
1
+ declare const _default: string[];
2
2
  export default _default;
@@ -16,6 +16,5 @@
16
16
  * limitations under the License.
17
17
  */
18
18
 
19
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
20
19
  import { themeAttributes as linkAttributes } from "../../bpk-component-link";
21
20
  export default [...linkAttributes];
@@ -1,9 +1,10 @@
1
+ import type { MouseEvent } from 'react';
1
2
  import { Component } from 'react';
2
3
  type State = {
3
4
  direction: string;
4
5
  };
5
6
  type Props = {};
6
- type InteractionEvents = KeyboardEvent | MouseEvent | TouchEvent;
7
+ type InteractionEvents = KeyboardEvent | MouseEvent<HTMLButtonElement> | TouchEvent;
7
8
  declare class BpkRtlToggle extends Component<Props, State> {
8
9
  constructor(props: Props);
9
10
  componentDidMount(): void;
@@ -17,8 +17,6 @@
17
17
  */
18
18
 
19
19
  import { Component } from 'react';
20
-
21
- // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
22
20
  import { BpkButtonLink } from "../../bpk-component-link";
23
21
  import { getHtmlElement, DIRECTIONS, DIRECTION_CHANGE_EVENT } from "./utils";
24
22
  import { jsxs as _jsxs } from "react/jsx-runtime";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skyscanner/backpack-web",
3
- "version": "41.0.1",
3
+ "version": "41.1.0",
4
4
  "description": "Backpack Design System web library",
5
5
  "repository": {
6
6
  "type": "git",