@skyscanner/backpack-web 36.1.1 → 36.1.3

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.
@@ -0,0 +1,5 @@
1
+ import BpkAccordion from './src/BpkAccordion';
2
+ import BpkAccordionItem from './src/BpkAccordionItem';
3
+ import withAccordionItemState from './src/withAccordionItemState';
4
+ import withSingleItemAccordionState from './src/withSingleItemAccordionState';
5
+ export { BpkAccordion, BpkAccordionItem, withSingleItemAccordionState, withAccordionItemState, };
@@ -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 BpkAccordion from "./src/BpkAccordion";
17
+ */
18
+
19
+ import BpkAccordion from "./src/BpkAccordion";
18
20
  import BpkAccordionItem from "./src/BpkAccordionItem";
19
21
  import withAccordionItemState from "./src/withAccordionItemState";
20
22
  import withSingleItemAccordionState from "./src/withSingleItemAccordionState";
@@ -0,0 +1,13 @@
1
+ import type { ReactNode } from 'react';
2
+ export type BpkAccordionProps = {
3
+ children: ReactNode;
4
+ className?: string;
5
+ divider?: boolean;
6
+ onDark?: boolean;
7
+ };
8
+ export declare const BpkAccordionContext: import("react").Context<{
9
+ onDark: boolean;
10
+ divider: boolean;
11
+ }>;
12
+ declare const BpkAccordion: (props: BpkAccordionProps) => import("react/jsx-runtime").JSX.Element;
13
+ export default BpkAccordion;
@@ -14,8 +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 PropTypes from 'prop-types';
18
- import { createContext, Node } from 'react';
17
+ */
18
+
19
+ import { createContext } from 'react';
19
20
  import { cssModules } from "../../bpk-react-utils";
20
21
  import STYLES from "./BpkAccordion.module.css";
21
22
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -28,8 +29,8 @@ const BpkAccordion = props => {
28
29
  const {
29
30
  children,
30
31
  className,
31
- divider,
32
- onDark,
32
+ divider = true,
33
+ onDark = false,
33
34
  ...rest
34
35
  } = props;
35
36
  const classNames = getClassName('bpk-accordion', onDark && 'bpk-accordion--on-dark', className);
@@ -45,15 +46,4 @@ const BpkAccordion = props => {
45
46
  })
46
47
  });
47
48
  };
48
- BpkAccordion.propTypes = {
49
- children: PropTypes.node.isRequired,
50
- className: PropTypes.string,
51
- onDark: PropTypes.bool,
52
- divider: PropTypes.bool
53
- };
54
- BpkAccordion.defaultProps = {
55
- className: null,
56
- onDark: false,
57
- divider: true
58
- };
59
49
  export default BpkAccordion;
@@ -0,0 +1,16 @@
1
+ import type { ReactNode, ReactElement } from 'react';
2
+ import { TEXT_STYLES } from '../../bpk-component-text';
3
+ export type BpkAccordionItemProps = {
4
+ children: ReactNode;
5
+ id: string;
6
+ title: string;
7
+ className?: string;
8
+ expanded?: boolean;
9
+ initiallyExpanded?: boolean;
10
+ icon?: ReactElement;
11
+ onClick?: () => void;
12
+ tagName?: 'span' | 'p' | 'text' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
13
+ textStyle?: (typeof TEXT_STYLES)[keyof typeof TEXT_STYLES];
14
+ };
15
+ declare const BpkAccordionItem: (props: BpkAccordionItemProps) => import("react/jsx-runtime").JSX.Element;
16
+ export default BpkAccordionItem;
@@ -14,8 +14,10 @@
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';
18
- import { Node, Element, useContext, cloneElement } from 'react';
17
+ */
18
+
19
+ import { useContext, cloneElement } from 'react';
20
+ // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
19
21
  import AnimateHeight from "../../bpk-animate-height";
20
22
  import { withButtonAlignment } from "../../bpk-component-icon";
21
23
  import ChevronDownIcon from "../../bpk-component-icon/sm/chevron-down";
@@ -39,12 +41,12 @@ const BpkAccordionItem = props => {
39
41
  const contentInnerClassNames = [getClassName('bpk-accordion__content-inner-container')];
40
42
  const {
41
43
  children,
42
- expanded,
43
- icon,
44
+ expanded = false,
45
+ icon = null,
44
46
  id,
45
- onClick,
46
- tagName,
47
- textStyle,
47
+ onClick = () => null,
48
+ tagName = 'h3',
49
+ textStyle = TEXT_STYLES.bodyDefault,
48
50
  title,
49
51
  ...rest
50
52
  } = props;
@@ -52,7 +54,6 @@ const BpkAccordionItem = props => {
52
54
  // if this component is passed initiallyExpanded, this makes sure it doesn't
53
55
  // end up on the node. Not ideal as our container component shouldn't be passing
54
56
  // it, but the benefit of a better container api versus this was worth it
55
- // $FlowFixMe[prop-missing] - see above
56
57
  delete rest.initiallyExpanded;
57
58
  if (divider) {
58
59
  contentInnerClassNames.push(getClassName('bpk-accordion__content-inner-container--with-divider'));
@@ -126,21 +127,4 @@ const BpkAccordionItem = props => {
126
127
  })
127
128
  );
128
129
  };
129
- BpkAccordionItem.propTypes = {
130
- children: PropTypes.node.isRequired,
131
- id: PropTypes.string.isRequired,
132
- title: PropTypes.string.isRequired,
133
- expanded: PropTypes.bool,
134
- icon: PropTypes.node,
135
- onClick: PropTypes.func,
136
- tagName: PropTypes.string,
137
- textStyle: PropTypes.string
138
- };
139
- BpkAccordionItem.defaultProps = {
140
- expanded: false,
141
- icon: null,
142
- onClick: () => null,
143
- tagName: 'h3',
144
- textStyle: TEXT_STYLES.bodyDefault
145
- };
146
130
  export default BpkAccordionItem;
@@ -0,0 +1,44 @@
1
+ import type { ComponentType } from 'react';
2
+ import type { BpkAccordionItemProps } from './BpkAccordionItem';
3
+ type Props = {
4
+ initiallyExpanded: boolean;
5
+ expanded: boolean;
6
+ onClick?: () => void;
7
+ };
8
+ type State = {
9
+ expanded: boolean;
10
+ };
11
+ declare const withAccordionItemState: <P extends BpkAccordionItemProps>(ComposedComponent: ComponentType<P>) => {
12
+ new (props: P & Props): {
13
+ onClick: () => void;
14
+ render(): import("react/jsx-runtime").JSX.Element;
15
+ context: unknown;
16
+ setState<K extends "expanded">(state: State | ((prevState: Readonly<State>, props: Readonly<P & Props>) => State | Pick<State, K> | null) | Pick<State, K> | null, callback?: (() => void) | undefined): void;
17
+ forceUpdate(callback?: (() => void) | undefined): void;
18
+ readonly props: Readonly<P & Props>;
19
+ state: Readonly<State>;
20
+ refs: {
21
+ [key: string]: import("react").ReactInstance;
22
+ };
23
+ componentDidMount?(): void;
24
+ shouldComponentUpdate?(nextProps: Readonly<P & Props>, nextState: Readonly<State>, nextContext: any): boolean;
25
+ componentWillUnmount?(): void;
26
+ componentDidCatch?(error: Error, errorInfo: import("react").ErrorInfo): void;
27
+ getSnapshotBeforeUpdate?(prevProps: Readonly<P & Props>, prevState: Readonly<State>): any;
28
+ componentDidUpdate?(prevProps: Readonly<P & Props>, prevState: Readonly<State>, snapshot?: any): void;
29
+ componentWillMount?(): void;
30
+ UNSAFE_componentWillMount?(): void;
31
+ componentWillReceiveProps?(nextProps: Readonly<P & Props>, nextContext: any): void;
32
+ UNSAFE_componentWillReceiveProps?(nextProps: Readonly<P & Props>, nextContext: any): void;
33
+ componentWillUpdate?(nextProps: Readonly<P & Props>, nextState: Readonly<State>, nextContext: any): void;
34
+ UNSAFE_componentWillUpdate?(nextProps: Readonly<P & Props>, nextState: Readonly<State>, nextContext: any): void;
35
+ };
36
+ displayName: string;
37
+ defaultProps: {
38
+ initiallyExpanded: boolean;
39
+ expanded: boolean;
40
+ onClick: null;
41
+ };
42
+ contextType?: import("react").Context<any> | undefined;
43
+ };
44
+ export default withAccordionItemState;
@@ -14,17 +14,14 @@
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 { Component } from 'react';
19
20
  import { wrapDisplayName } from "../../bpk-react-utils";
20
21
  import { jsx as _jsx } from "react/jsx-runtime";
21
22
  const withAccordionItemState = ComposedComponent => {
22
23
  class WithAccordionItemState extends Component {
23
- static propTypes = {
24
- initiallyExpanded: PropTypes.bool,
25
- expanded: PropTypes.bool,
26
- onClick: PropTypes.func
27
- };
24
+ static displayName = wrapDisplayName(ComposedComponent, 'withAccordionItemState');
28
25
  static defaultProps = {
29
26
  initiallyExpanded: false,
30
27
  expanded: false,
@@ -48,18 +45,13 @@ const withAccordionItemState = ComposedComponent => {
48
45
  onClick,
49
46
  ...rest
50
47
  } = this.props;
51
- return (
52
- /*#__PURE__*/
53
- // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
54
- _jsx(ComposedComponent, {
55
- expanded: this.state.expanded,
56
- onClick: this.onClick,
57
- ...rest
58
- })
59
- );
48
+ return /*#__PURE__*/_jsx(ComposedComponent, {
49
+ expanded: this.state.expanded,
50
+ onClick: this.onClick,
51
+ ...rest
52
+ });
60
53
  }
61
54
  }
62
- WithAccordionItemState.displayName = wrapDisplayName(ComposedComponent, 'withAccordionItemState');
63
55
  return WithAccordionItemState;
64
56
  };
65
57
  export default withAccordionItemState;
@@ -0,0 +1,38 @@
1
+ import type { ReactNode, ReactElement, ComponentType } from 'react';
2
+ import type { BpkAccordionProps } from './BpkAccordion';
3
+ type Props = {
4
+ children: ReactNode;
5
+ };
6
+ type State = {
7
+ expanded?: string | number | null;
8
+ };
9
+ declare const withSingleItemAccordionState: <P extends BpkAccordionProps>(ComposedComponent: ComponentType<P>) => {
10
+ new (props: P & Props): {
11
+ openAccordionItem: (key?: string | number | null) => void;
12
+ renderAccordionItem: (accordionItem: ReactElement) => ReactElement<any, string | import("react").JSXElementConstructor<any>>;
13
+ render(): import("react/jsx-runtime").JSX.Element;
14
+ context: unknown;
15
+ setState<K extends "expanded">(state: State | ((prevState: Readonly<State>, props: Readonly<P & Props>) => State | Pick<State, K> | null) | Pick<State, K> | null, callback?: (() => void) | undefined): void;
16
+ forceUpdate(callback?: (() => void) | undefined): void;
17
+ readonly props: Readonly<P & Props>;
18
+ state: Readonly<State>;
19
+ refs: {
20
+ [key: string]: import("react").ReactInstance;
21
+ };
22
+ componentDidMount?(): void;
23
+ shouldComponentUpdate?(nextProps: Readonly<P & Props>, nextState: Readonly<State>, nextContext: any): boolean;
24
+ componentWillUnmount?(): void;
25
+ componentDidCatch?(error: Error, errorInfo: import("react").ErrorInfo): void;
26
+ getSnapshotBeforeUpdate?(prevProps: Readonly<P & Props>, prevState: Readonly<State>): any;
27
+ componentDidUpdate?(prevProps: Readonly<P & Props>, prevState: Readonly<State>, snapshot?: any): void;
28
+ componentWillMount?(): void;
29
+ UNSAFE_componentWillMount?(): void;
30
+ componentWillReceiveProps?(nextProps: Readonly<P & Props>, nextContext: any): void;
31
+ UNSAFE_componentWillReceiveProps?(nextProps: Readonly<P & Props>, nextContext: any): void;
32
+ componentWillUpdate?(nextProps: Readonly<P & Props>, nextState: Readonly<State>, nextContext: any): void;
33
+ UNSAFE_componentWillUpdate?(nextProps: Readonly<P & Props>, nextState: Readonly<State>, nextContext: any): void;
34
+ };
35
+ displayName: string;
36
+ contextType?: import("react").Context<any> | undefined;
37
+ };
38
+ export default withSingleItemAccordionState;
@@ -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 { Component, Children, cloneElement } from 'react';
19
20
  import { wrapDisplayName } from "../../bpk-react-utils";
20
21
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -25,6 +26,7 @@ const getInitiallyExpanded = children => {
25
26
  };
26
27
  const withSingleItemAccordionState = ComposedComponent => {
27
28
  class WithSingleItemAccordionState extends Component {
29
+ static displayName = wrapDisplayName(ComposedComponent, 'withSingleItemAccordionState');
28
30
  constructor(props) {
29
31
  super(props);
30
32
  this.state = {
@@ -38,7 +40,7 @@ const withSingleItemAccordionState = ComposedComponent => {
38
40
  };
39
41
  renderAccordionItem = accordionItem => {
40
42
  const expanded = this.state.expanded === accordionItem.key;
41
- const onClick = () => this.openAccordionItem(accordionItem.key);
43
+ const onClick = () => this.openAccordionItem(accordionItem?.key);
42
44
  return /*#__PURE__*/cloneElement(accordionItem, {
43
45
  expanded,
44
46
  onClick
@@ -51,14 +53,10 @@ const withSingleItemAccordionState = ComposedComponent => {
51
53
  } = this.props;
52
54
  return /*#__PURE__*/_jsx(ComposedComponent, {
53
55
  ...rest,
54
- children: Children.toArray(children).map(this.renderAccordionItem)
56
+ children: Children.toArray(children).map(el => this.renderAccordionItem(el))
55
57
  });
56
58
  }
57
59
  }
58
- WithSingleItemAccordionState.propTypes = {
59
- children: PropTypes.node.isRequired
60
- };
61
- WithSingleItemAccordionState.displayName = wrapDisplayName(ComposedComponent, 'withSingleItemAccordionState');
62
60
  return WithSingleItemAccordionState;
63
61
  };
64
62
  export default withSingleItemAccordionState;
@@ -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-price{display:flex;flex-direction:column;color:#626971}.bpk-price--right{text-align:right}html[dir=rtl] .bpk-price--right{text-align:left}.bpk-price__leading{display:flex;flex-direction:row}.bpk-price__leading--right{display:flex;flex-direction:row-reverse}.bpk-price__previous-price{display:flex;color:#e70866;text-decoration-line:line-through}.bpk-price__separator{display:flex;margin:0 .25rem}.bpk-price__column-container{display:flex;flex-direction:column}.bpk-price__price{display:contents;color:#161616;word-break:break-all}.bpk-price__spacing::after{content:"";margin-right:.25rem}html[dir=rtl] .bpk-price__spacing::after{margin-right:unset;margin-left:.25rem}.bpk-price__trailing{display:contents;white-space:nowrap}
18
+ .bpk-price{display:flex;flex-direction:column;color:#626971}.bpk-price--right{text-align:right}html[dir=rtl] .bpk-price--right{text-align:left}.bpk-price__leading{display:flex;flex-direction:row}.bpk-price__leading--right{display:flex;justify-content:flex-end}.bpk-price__previous-price{display:flex;color:#e70866;text-decoration-line:line-through}.bpk-price__separator{display:flex;margin:0 .25rem}.bpk-price__column-container{display:flex;flex-direction:column}.bpk-price__price{display:contents;color:#161616;word-break:break-all}.bpk-price__spacing::after{content:"";margin-right:.25rem}html[dir=rtl] .bpk-price__spacing::after{margin-right:unset;margin-left:.25rem}.bpk-price__trailing{display:contents;white-space:nowrap}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skyscanner/backpack-web",
3
- "version": "36.1.1",
3
+ "version": "36.1.3",
4
4
  "description": "Backpack Design System web library",
5
5
  "repository": {
6
6
  "type": "git",