@skyscanner/backpack-web 0.0.5 → 0.2.0

package/bpk-component-switch/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-switch",
-  "version": "2.1.0",
+  "version": "2.1.7",
   "description": "Backpack switch component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
+    "bpk-mixins": "^29.0.0",
+    "bpk-react-utils": "^4.1.1",
     "prop-types": "^15.5.8"
   },
   "peerDependencies": {

package/bpk-component-switch/src/BpkSwitch.js

@@ -19,6 +19,7 @@
 
 import PropTypes from 'prop-types';
 import React, { type Node } from 'react';
+
 import { cssModules } from '../../bpk-react-utils';
 
 import STYLES from './BpkSwitch.module.scss';

package/bpk-component-table/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-table",
-  "version": "3.1.0",
+  "version": "3.1.6",
   "description": "Backpack table component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
+    "bpk-mixins": "^29.0.0",
+    "bpk-react-utils": "^4.1.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {

package/bpk-component-table/src/BpkTable.js

@@ -20,6 +20,7 @@
 
 import PropTypes from 'prop-types';
 import React, { type Node } from 'react';
+
 import { cssModules } from '../../bpk-react-utils';
 
 import STYLES from './BpkTable.module.scss';

package/bpk-component-table/src/BpkTableCell.js

@@ -20,6 +20,7 @@
 
 import PropTypes from 'prop-types';
 import React, { type Node } from 'react';
+
 import { cssModules } from '../../bpk-react-utils';
 
 import STYLES from './BpkTable.module.scss';

package/bpk-component-table/src/BpkTableHeadCell.js

@@ -20,6 +20,7 @@
 
 import PropTypes from 'prop-types';
 import React, { type Node } from 'react';
+
 import { cssModules } from '../../bpk-react-utils';
 
 import STYLES from './BpkTable.module.scss';

package/bpk-component-text/README.md

@@ -69,7 +69,7 @@ export default () => (
 | Property  | PropType                                 | Required | Default Value |
 | --------- | ---------------------------------------- | -------- | ------------- |
 | children  | -                                        | true     | -             |
-| textStyle | oneOf(TEXT_STYLES.xs, TEXT_STYLES.sm, TEXT_STYLES.base, TEXT_STYLES.lg, TEXT_STYLES.xl, TEXT_STYLES.xxl, TEXT_STYLES.xxxl, TEXT_STYLES.xxxxl, TEXT_STYLES.xxxxxl, TEXT_STYLES.caption, TEXT_STYLES.footnote, TEXT_STYLES.label1, TEXT_STYLES.label2, TEXT_STYLES.bodyDefault, TEXT_STYLES.bodyLongform, TEXT_STYLES.subheading, TEXT_STYLES.heading1, TEXT_STYLES.heading2, TEXT_STYLES.heading3, TEXT_STYLES.heading4, TEXT_STYLES.heading5, TEXT_STYLES.hero1, TEXT_STYLES.hero2, TEXT_STYLES.hero3, TEXT_STYLES.hero4, TEXT_STYLES.hero5)    | false    | TEXT_STYLES.base  |
+| textStyle | oneOf(TEXT_STYLES.caption, TEXT_STYLES.footnote, TEXT_STYLES.label1, TEXT_STYLES.label2, TEXT_STYLES.label3, TEXT_STYLES.bodyDefault, TEXT_STYLES.bodyLongform, TEXT_STYLES.subheading, TEXT_STYLES.heading1, TEXT_STYLES.heading2, TEXT_STYLES.heading3, TEXT_STYLES.heading4, TEXT_STYLES.heading5, TEXT_STYLES.hero1, TEXT_STYLES.hero2, TEXT_STYLES.hero3, TEXT_STYLES.hero4, TEXT_STYLES.hero5, TEXT_STYLES.xs, TEXT_STYLES.sm, TEXT_STYLES.base, TEXT_STYLES.lg, TEXT_STYLES.xl, TEXT_STYLES.xxl, TEXT_STYLES.xxxl, TEXT_STYLES.xxxxl, TEXT_STYLES.xxxxxl)    | false    | TEXT_STYLES.base  |
 | tagName   | 'span', 'p', 'text', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' | false    | 'span'        |
 | className | string                                   | false    | null          |
 | bold (deprecated, use a different `textStyle` to achieve the desired weight)     | bool                                     | false    | null         |

package/bpk-component-text/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-text",
-  "version": "6.1.1",
+  "version": "7.0.0",
   "description": "Backpack text component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,8 +14,8 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-mixins": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
+    "bpk-mixins": "^29.0.0",
+    "bpk-react-utils": "^4.1.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {

package/bpk-component-text/src/BpkText.js

@@ -20,6 +20,7 @@
 
 import PropTypes from 'prop-types';
 import React, { type Node } from 'react';
+
 import { cssModules, deprecated } from '../../bpk-react-utils';
 
 import STYLES from './BpkText.module.scss';
@@ -40,6 +41,7 @@ export const TEXT_STYLES = {
   footnote: 'footnote',
   label1: 'label-1',
   label2: 'label-2',
+  label3: 'label-3',
   bodyDefault: 'body-default',
   bodyLongform: 'body-longform',
   subheading: 'subheading',

package/bpk-component-text/src/BpkText.module.scss

@@ -73,6 +73,10 @@
     @include bpk-label-2;
   }
 
+  &--label-3 {
+    @include bpk-label-3;
+  }
+
   &--body-default {
     @include bpk-body-default;
   }

package/bpk-component-textarea/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-textarea",
-  "version": "4.2.0",
+  "version": "4.2.6",
   "description": "Backpack textarea component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,13 +14,13 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "bpk-mixins": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
+    "bpk-mixins": "^29.0.0",
+    "bpk-react-utils": "^4.1.1",
     "prop-types": "^15.7.2"
   },
   "devDependencies": {
-    "bpk-component-label": "^5.1.0",
-    "bpk-storybook-utils": "^1.1.0"
+    "bpk-component-label": "^5.1.6",
+    "bpk-storybook-utils": "^1.1.5"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"

package/bpk-component-textarea/src/BpkTextarea.js

@@ -20,6 +20,7 @@
 
 import PropTypes from 'prop-types';
 import React from 'react';
+
 import { cssModules } from '../../bpk-react-utils';
 
 import STYLES from './BpkTextarea.module.scss';

package/bpk-component-theme-toggle/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-theme-toggle",
-  "version": "3.1.0",
+  "version": "3.1.6",
   "description": "Backpack theme toggle component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,11 +14,11 @@
   },
   "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^5.0.0",
-    "bpk-component-label": "^5.1.0",
-    "bpk-component-select": "^5.1.0",
-    "bpk-mixins": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
+    "@skyscanner/bpk-foundations-web": "^6.2.0",
+    "bpk-component-label": "^5.1.6",
+    "bpk-component-select": "^5.1.6",
+    "bpk-mixins": "^29.0.0",
+    "bpk-react-utils": "^4.1.1",
     "konami": "^1.6.2",
     "prop-types": "^15.7.2"
   },

package/bpk-component-theme-toggle/src/BpkThemeToggle.js

@@ -18,6 +18,7 @@
 
 import React from 'react';
 import Konami from 'konami';
+
 import BpkLabel from '../../bpk-component-label';
 import BpkSelect from '../../bpk-component-select';
 import { cssModules } from '../../bpk-react-utils';

package/bpk-component-theme-toggle/src/updateOnThemeChange.js

@@ -18,6 +18,7 @@
 
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+
 import { wrapDisplayName } from '../../bpk-react-utils';
 
 import { getHtmlElement, THEME_CHANGE_EVENT } from './utils';

package/bpk-component-ticket/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-ticket",
-  "version": "4.1.1",
+  "version": "4.1.7",
   "description": "Backpack ticket component.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,15 +14,15 @@
   },
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
-    "bpk-mixins": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
+    "bpk-mixins": "^29.0.0",
+    "bpk-react-utils": "^4.1.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "bpk-component-button": "^5.1.0",
-    "bpk-component-icon": "^9.2.1"
+    "bpk-component-button": "^6.2.1",
+    "bpk-component-icon": "^9.2.7"
   }
 }

package/bpk-component-ticket/src/BpkTicket.js

@@ -20,6 +20,7 @@
 
 import PropTypes from 'prop-types';
 import React, { type Node } from 'react';
+
 import { cssModules } from '../../bpk-react-utils';
 
 import STYLES from './BpkTicket.module.scss';
@@ -93,13 +94,13 @@ const BpkTicket = (props: Props) => {
   const punchlineClassNames = getClassName(
     'bpk-ticket__punchline',
     vertical &&
-    (withNotches
-      ? 'bpk-ticket__punchline--horizontal-with-notches'
-      : 'bpk-ticket__punchline--horizontal'),
+      (withNotches
+        ? 'bpk-ticket__punchline--horizontal-with-notches'
+        : 'bpk-ticket__punchline--horizontal'),
     !vertical &&
-    (withNotches
-      ? 'bpk-ticket__punchline--vertical-with-notches'
-      : 'bpk-ticket__punchline--vertical'),
+      (withNotches
+        ? 'bpk-ticket__punchline--vertical-with-notches'
+        : 'bpk-ticket__punchline--vertical'),
   );
 
   const startNotchClassNames = getClassName(

package/bpk-component-tooltip/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-component-tooltip",
-  "version": "6.1.1",
+  "version": "6.1.7",
   "description": "Backpack tooltip component.",
   "license": "Apache-2.0",
   "repository": {
@@ -15,15 +15,15 @@
   "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
   "dependencies": {
     "@skyscanner/popper.js": "^1.12.9-beta.1",
-    "bpk-mixins": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
+    "bpk-mixins": "^29.0.0",
+    "bpk-react-utils": "^4.1.1",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"
   },
   "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^5.0.0",
-    "bpk-component-text": "^6.1.1"
+    "@skyscanner/bpk-foundations-web": "^6.2.0",
+    "bpk-component-text": "^7.0.0"
   }
 }

package/bpk-component-tooltip/src/BpkTooltip.js

@@ -26,6 +26,7 @@ The actual component that developers create (i.e. the default export from this p
 
 import PropTypes from 'prop-types';
 import React, { type Node } from 'react';
+
 import { TransitionInitialMount, cssModules } from '../../bpk-react-utils';
 
 import STYLES from './BpkTooltip.module.scss';

package/bpk-component-tooltip/src/BpkTooltipPortal.js

@@ -21,6 +21,7 @@
 import Popper from '@skyscanner/popper.js';
 import PropTypes from 'prop-types';
 import React, { Component, type Node, type Element } from 'react';
+
 import { Portal, cssModules } from '../../bpk-react-utils';
 
 import BpkTooltip, {

package/bpk-react-utils/index.js

@@ -18,8 +18,7 @@
 
 /* @flow strict */
 
-import wrapDisplayName from 'recompose/wrapDisplayName';
-
+import wrapDisplayName from './src/wrapDisplayName';
 import Portal from './src/Portal';
 import TransitionInitialMount from './src/TransitionInitialMount';
 import cssModules from './src/cssModules';

package/bpk-react-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-react-utils",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "description": "Utilities for Backpack's React components.",
   "license": "Apache-2.0",
   "repository": {
@@ -16,8 +16,7 @@
   "dependencies": {
     "object-assign": "^4.1.1",
     "prop-types": "^15.7.2",
-    "react-transition-group": "^2.5.3",
-    "recompose": "^0.30.0"
+    "react-transition-group": "^2.5.3"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0",

package/bpk-react-utils/src/withDefaultProps.js

@@ -20,7 +20,8 @@
 
 import PropTypes from 'prop-types';
 import React, { type Node, type AbstractComponent } from 'react';
-import wrapDisplayName from 'recompose/wrapDisplayName';
+
+import wrapDisplayName from './wrapDisplayName';
 
 type Props = {
   children: ?Node,

package/{bpk-component-chip/examples.module.scss → bpk-react-utils/src/wrapDisplayName.js}

@@ -1,7 +1,7 @@
 /*
  * Backpack - Skyscanner's Design System
  *
- * Copyright 2016 Skyscanner Ltd
+ * Copyright 2022 Skyscanner Ltd
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -16,18 +16,16 @@
  * limitations under the License.
  */
 
-@import '~bpk-mixins';
-
-$custom-color: $bpk-color-sagano;
-
-.bpk-chip-examples {
-  &__wrapper {
-    display: flex;
-    flex-wrap: wrap;
+const wrapDisplayName = (Component, hoc) => {
+  if (!Component) {
+    return `${hoc}()`;
   }
 
-  &__chip {
-    margin-right: $bpk-spacing-xs;
-    margin-bottom: $bpk-spacing-sm;
+  if (typeof Component === 'string') {
+    return `${hoc}(${Component})`;
   }
-}
+
+  return `${hoc}(${Component.displayName || Component.name || 'Component'})`;
+};
+
+export default wrapDisplayName;

package/bpk-scrim-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-scrim-utils",
-  "version": "5.1.0",
+  "version": "5.1.5",
   "description": "Higher order component that adds an overlay behind components and manages scroll states.",
   "license": "Apache-2.0",
   "repository": {
@@ -16,8 +16,8 @@
   "dependencies": {
     "a11y-focus-scope": "^1.1.3",
     "a11y-focus-store": "^1.0.0",
-    "bpk-mixins": "^26.1.0",
-    "bpk-react-utils": "^4.1.0"
+    "bpk-mixins": "^29.0.0",
+    "bpk-react-utils": "^4.1.1"
   },
   "peerDependencies": {
     "react": "^16.3.0 || ^17.0.0"

package/bpk-scrim-utils/src/BpkScrim.js

@@ -18,6 +18,7 @@
 
 import React from 'react';
 import PropTypes from 'prop-types';
+
 import { TransitionInitialMount, cssModules } from '../../bpk-react-utils';
 
 import STYLES from './bpk-scrim.module.scss';

package/bpk-scrim-utils/src/withScrim.js

@@ -20,6 +20,7 @@ import focusScope from 'a11y-focus-scope';
 import focusStore from 'a11y-focus-store';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
+
 import {
   cssModules,
   isDeviceIpad,

package/bpk-theming/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bpk-theming",
-  "version": "2.1.0",
+  "version": "2.1.3",
   "description": "Backpack theming utlities.",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,7 @@
   },
   "gitHead": "c2217d61875a1f3aa2bb9ed9583c50e3f1523501",
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^5.0.0",
+    "@skyscanner/bpk-foundations-web": "^6.2.0",
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyscanner/backpack-web",
-  "version": "0.0.5",
+  "version": "0.2.0",
   "description": "Backpack Design System web library",
   "repository": {
     "type": "git",
@@ -22,11 +22,11 @@
     "access": "public"
   },
   "dependencies": {
-    "@skyscanner/bpk-foundations-web": "^5.0.0",
+    "@skyscanner/bpk-foundations-web": "^6.2.0",
     "@skyscanner/popper.js": "^1.12.9-beta.1",
     "a11y-focus-scope": "^1.1.3",
     "a11y-focus-store": "^1.0.0",
-    "bpk-mixins": "^26.1.0",
+    "bpk-mixins": "^29.0.0",
     "date-fns": "^2.21.1",
     "d3-path": "^2.0.0",
     "d3-scale": "^4.0.2",
@@ -37,14 +37,12 @@
     "object-assign": "^4.1.1",
     "prop-types": "^15.7.2",
     "react-autosuggest": "^9.4.3",
-    "react-google-maps": "^9.4.5",
     "react-responsive": "^6.1.2",
     "react-slider": "^1.3.1",
     "react-transition-group": "^2.5.3",
-    "react-virtualized": "^9.22.3",
-    "recompose": "^0.30.0"
+    "react-virtualized": "^9.22.3"
   },
   "peerDependencies": {
-    "react": "^16.3.0 || ^17.0.0"
+    "react": "^16.8.3 || ^17.0.0"
   }
 }

package/bpk-animate-height/examples.js

@@ -1,67 +0,0 @@
-/*
- * 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.
- */
-
-/* @flow strict */
-
-import BpkButton from '../bpk-component-button';
-import React, { Component, type Node } from 'react';
-
-import AnimateHeight from './index';
-
-type Props = {
-  fromHeight: string | number,
-  toHeight: string | number,
-  buttonText: Node,
-};
-type State = {
-  height: string | number,
-};
-
-class AnimateHeightExample extends Component<Props, State> {
-  constructor(props: Props) {
-    super(props);
-
-    this.state = {
-      height: this.props.fromHeight,
-    };
-  }
-
-  onClick = () => {
-    this.setState((prevState) => {
-      const height =
-        prevState.height !== this.props.fromHeight
-          ? this.props.fromHeight
-          : this.props.toHeight;
-
-      return { height };
-    });
-  };
-
-  render() {
-    const { buttonText, fromHeight, toHeight, ...rest } = this.props;
-    return (
-      <div>
-        <AnimateHeight {...rest} height={this.state.height} />
-        <br />
-        <BpkButton onClick={this.onClick}>{buttonText}</BpkButton>
-      </div>
-    );
-  }
-}
-
-export default AnimateHeightExample;