@skyscanner/backpack-web 18.2.1 → 20.0.0

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

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

package/bpk-theming/src/BpkThemeProvider.js

@@ -16,7 +16,7 @@
  * limitations under the License.
  */
 
-import React, { Component } from 'react';
+import { Component } from 'react';
 import PropTypes from 'prop-types';
 
 const uniq = (arr = []) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyscanner/backpack-web",
-  "version": "18.2.1",
+  "version": "20.0.0",
   "description": "Backpack Design System web library",
   "repository": {
     "type": "git",
@@ -28,7 +28,7 @@
     "@skyscanner/bpk-svgs": "^16.2.0",
     "a11y-focus-scope": "^1.1.3",
     "a11y-focus-store": "^1.0.0",
-    "bpk-mixins": "^39.1.0",
+    "bpk-mixins": "^39.1.1",
     "d3-path": "^2.0.0",
     "d3-scale": "^4.0.2",
     "date-fns": "^2.21.1",

package/bpk-component-button/BpkButtonOutline.js

@@ -1,21 +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 */
-
-export { default } from './src/BpkButtonOutline';

package/bpk-component-button/src/BpkButtonOutline.js

@@ -1,48 +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 React from 'react';
-
-import { type Props, defaultProps, propTypes } from './common-types';
-import BpkButtonBase, { cssModules } from './BpkButtonBase';
-import STYLES from './BpkButtonOutline.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-const BpkButtonOutline = (props: Props) => {
-  const { className, ...rest } = props;
-
-  const classNames = [getClassName('bpk-button--outline')];
-
-  if (className) {
-    classNames.push(className);
-  }
-  const classNamesFinal = classNames.join(' ');
-
-  return (
-    // $FlowFixMe[cannot-spread-inexact] - inexact rest. See 'decisions/flowfixme.md'.
-    <BpkButtonBase className={classNamesFinal} {...rest} />
-  );
-};
-
-BpkButtonOutline.propTypes = { ...propTypes };
-BpkButtonOutline.defaultProps = { ...defaultProps };
-
-export default BpkButtonOutline;

package/bpk-component-button/src/BpkButtonOutline.module.css

@@ -1,18 +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.
-*/
-@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-button--outline{background-color:rgba(0,0,0,0);background-image:none;color:#fff;box-shadow:0 0 0 2px #fff inset}.bpk-no-touch-support .bpk-button--outline:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);box-shadow:0 0 0 2px rgba(255,255,255,0.5) inset}:global(.bpk-no-touch-support) .bpk-button--outline:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);box-shadow:0 0 0 2px rgba(255,255,255,0.5) inset}.bpk-button--outline:active{background-color:rgba(0,0,0,0);box-shadow:0 0 0 3px #fff inset}.bpk-button--outline:disabled{background-color:#dddde5;background-image:none;color:#b2b2bf;box-shadow:none}

package/bpk-component-button/src/BpkButtonOutline.module.scss

@@ -1,23 +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.
- */
-
-@import '~bpk-mixins/index.scss';
-
-.bpk-button--outline {
-  @include bpk-button--outline;
-}

package/bpk-component-grid/README.md

@@ -1,90 +0,0 @@
-# bpk-component-grid
-
-> Backpack grid components.
-
-This component is deprecated and will be removed in a future release.
-
-## Installation
-
-Check the main [Readme](https://github.com/skyscanner/backpack#usage) for a complete installation guide.
-
-## Usage
-
-```js
-import React from 'react';
-import { BpkGridContainer, BpkGridRow, BpkGridColumn } from '@skyscanner/backpack-web/bpk-component-grid';
-
-export default () => (
-  <BpkGridContainer>
-    <BpkGridRow>
-      <BpkGridColumn width={8} tabletWidth={12}>
-        Search controls
-      </BpkGridColumn>
-      <BpkGridColumn width={4} tabletWidth={0}>
-        MPU
-      </BpkGridColumn>
-    </BpkGridRow>
-    <BpkGridRow>
-      <BpkGridColumn width={12}>
-        Provider logos
-      </BpkGridColumn>
-    </BpkGridRow>
-    <BpkGridRow>
-      <BpkGridColumn width={4} mobileWidth={12}>
-        Content panel
-      </BpkGridColumn>
-      <BpkGridColumn width={4} mobileWidth={12}>
-        Content panel
-      </BpkGridColumn>
-      <BpkGridColumn width={4} mobileWidth={12}>
-        Content panel
-      </BpkGridColumn>
-    </BpkGridRow>
-    <BpkGridRow>
-      <BpkGridColumn width={3} tabletWidth={6} mobileWidth={12}>
-        Confidence statement
-      </BpkGridColumn>
-      <BpkGridColumn width={3} tabletWidth={6} mobileWidth={12}>
-        Confidence statement
-      </BpkGridColumn>
-      <BpkGridColumn width={3} tabletWidth={6} mobileWidth={12}>
-        Confidence statement
-      </BpkGridColumn>
-      <BpkGridColumn width={3} tabletWidth={6} mobileWidth={12}>
-        Confidence statement
-      </BpkGridColumn>
-    </BpkGridRow>
-  </BpkGridContainer>
-);
-```
-
-## Props
-
-### BpkGridContainer
-
-| Property  | PropType | Required | Default Value |
-| --------- | -------- | -------- | ------------- |
-| children  | node     | true     | -             |
-| debug     | bool     | false    | false         |
-| fullWidth | bool     | false    | false         |
-
-### BpkGridRow
-
-| Property  | PropType | Required | Default Value |
-| --------- | -------- | -------- | ------------- |
-| children  | node     | true     | -             |
-| padded    | bool     | false    | true          |
-
-### BpkGridColumn
-
-| Property     | PropType | Required | Default Value |
-| ------------ | -------- | -------- | ------------- |
-| children     | node     | true     | -             |
-| width        | number   | true     | -             |
-| mobileWidth  | number   | false    | null          |
-| tabletWidth  | number   | false    | null          |
-| offset       | number   | false    | null          |
-| mobileOffset | number   | false    | null          |
-| tabletOffset | number   | false    | null          |
-| padded       | bool     | false    | true          |
-| debug        | bool     | false    | false         |

package/bpk-component-grid/index.js

@@ -1,25 +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.
- */
-
-import Container from './src/BpkGridContainer';
-import Row from './src/BpkGridRow';
-import Column from './src/BpkGridColumn';
-
-export const BpkGridContainer = Container;
-export const BpkGridRow = Row;
-export const BpkGridColumn = Column;

package/bpk-component-grid/src/BpkGridColumn.js

@@ -1,118 +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.
- */
-
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import { cssModules } from '../../bpk-react-utils';
-
-import STYLES from './BpkGridColumn.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-// IE11 doesn't support `Number.isNaN` so we must use the global.
-// When IE11 support drops we can migrate.
-// eslint-disable-next-line no-restricted-globals
-const isNumeric = (n) => !isNaN(parseFloat(n)) && isFinite(n);
-
-const BpkGridColumn = (props) => {
-  const {
-    children,
-    className,
-    debug,
-    mobileOffset,
-    mobileWidth,
-    offset,
-    padded,
-    tabletOffset,
-    tabletWidth,
-    width,
-    ...rest
-  } = props;
-
-  const classNames = ['bpk-grid__column', `bpk-grid__column--${width}`].map(
-    getClassName,
-  );
-
-  if (isNumeric(mobileWidth)) {
-    classNames.push(getClassName(`bpk-grid__column--mobile-${mobileWidth}`));
-  }
-  if (isNumeric(tabletWidth)) {
-    classNames.push(getClassName(`bpk-grid__column--tablet-${tabletWidth}`));
-  }
-  if (isNumeric(offset)) {
-    classNames.push(getClassName(`bpk-grid__column--offset-${offset}`));
-  }
-  if (isNumeric(mobileOffset)) {
-    classNames.push(
-      getClassName(`bpk-grid__column--offset-mobile-${mobileOffset}`),
-    );
-  }
-  if (isNumeric(tabletOffset)) {
-    classNames.push(
-      getClassName(`bpk-grid__column--offset-tablet-${tabletOffset}`),
-    );
-  }
-  if (padded) {
-    classNames.push(getClassName('bpk-grid__column--padded'));
-  }
-  if (debug) {
-    classNames.push(getClassName('bpk-grid__column--debug'));
-  }
-  if (className) {
-    classNames.push(className);
-  }
-
-  return (
-    <div className={classNames.join(' ')} {...rest}>
-      {debug ? (
-        <div className={getClassName('bpk-grid__column-debugger')}>
-          {children}
-        </div>
-      ) : (
-        children
-      )}
-    </div>
-  );
-};
-
-BpkGridColumn.propTypes = {
-  children: PropTypes.node.isRequired,
-  width: PropTypes.number.isRequired,
-  mobileWidth: PropTypes.number,
-  tabletWidth: PropTypes.number,
-  offset: PropTypes.number,
-  mobileOffset: PropTypes.number,
-  tabletOffset: PropTypes.number,
-  padded: PropTypes.bool,
-  debug: PropTypes.bool,
-  className: PropTypes.string,
-};
-
-BpkGridColumn.defaultProps = {
-  mobileWidth: null,
-  tabletWidth: null,
-  offset: null,
-  mobileOffset: null,
-  tabletOffset: null,
-  padded: true,
-  debug: false,
-  className: null,
-};
-
-export default BpkGridColumn;

package/bpk-component-grid/src/BpkGridColumn.module.css

@@ -1,18 +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.
-*/
-@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-grid__column{float:left;padding-right:.75rem;padding-left:.75rem}html[dir='rtl'] .bpk-grid__column{float:right}.bpk-grid__column--padded{padding-top:.75rem;padding-bottom:.75rem}.bpk-grid__column--debug{padding:.75rem}.bpk-grid__column-debugger{background-color:#fff}.bpk-grid__column--0{display:none}.bpk-grid__column--1{display:block;width:8.33333%}.bpk-grid__column--2{display:block;width:16.66667%}.bpk-grid__column--3{display:block;width:25%}.bpk-grid__column--4{display:block;width:33.33333%}.bpk-grid__column--5{display:block;width:41.66667%}.bpk-grid__column--6{display:block;width:50%}.bpk-grid__column--7{display:block;width:58.33333%}.bpk-grid__column--8{display:block;width:66.66667%}.bpk-grid__column--9{display:block;width:75%}.bpk-grid__column--10{display:block;width:83.33333%}.bpk-grid__column--11{display:block;width:91.66667%}.bpk-grid__column--12{display:block;width:100%}.bpk-grid__column--offset-0{margin-left:0}html[dir='rtl'] .bpk-grid__column--offset-0{margin-right:0}.bpk-grid__column--offset-1{margin-left:8.33333%}html[dir='rtl'] .bpk-grid__column--offset-1{margin-right:8.33333%;margin-left:0}.bpk-grid__column--offset-2{margin-left:16.66667%}html[dir='rtl'] .bpk-grid__column--offset-2{margin-right:16.66667%;margin-left:0}.bpk-grid__column--offset-3{margin-left:25%}html[dir='rtl'] .bpk-grid__column--offset-3{margin-right:25%;margin-left:0}.bpk-grid__column--offset-4{margin-left:33.33333%}html[dir='rtl'] .bpk-grid__column--offset-4{margin-right:33.33333%;margin-left:0}.bpk-grid__column--offset-5{margin-left:41.66667%}html[dir='rtl'] .bpk-grid__column--offset-5{margin-right:41.66667%;margin-left:0}.bpk-grid__column--offset-6{margin-left:50%}html[dir='rtl'] .bpk-grid__column--offset-6{margin-right:50%;margin-left:0}.bpk-grid__column--offset-7{margin-left:58.33333%}html[dir='rtl'] .bpk-grid__column--offset-7{margin-right:58.33333%;margin-left:0}.bpk-grid__column--offset-8{margin-left:66.66667%}html[dir='rtl'] .bpk-grid__column--offset-8{margin-right:66.66667%;margin-left:0}.bpk-grid__column--offset-9{margin-left:75%}html[dir='rtl'] .bpk-grid__column--offset-9{margin-right:75%;margin-left:0}.bpk-grid__column--offset-10{margin-left:83.33333%}html[dir='rtl'] .bpk-grid__column--offset-10{margin-right:83.33333%;margin-left:0}.bpk-grid__column--offset-11{margin-left:91.66667%}html[dir='rtl'] .bpk-grid__column--offset-11{margin-right:91.66667%;margin-left:0}.bpk-grid__column--offset-12{margin-left:100%}html[dir='rtl'] .bpk-grid__column--offset-12{margin-right:100%;margin-left:0}@media (max-width: 50.25rem){.bpk-grid__column--tablet-0{display:none}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-1{display:block;width:8.33333%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-2{display:block;width:16.66667%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-3{display:block;width:25%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-4{display:block;width:33.33333%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-5{display:block;width:41.66667%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-6{display:block;width:50%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-7{display:block;width:58.33333%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-8{display:block;width:66.66667%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-9{display:block;width:75%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-10{display:block;width:83.33333%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-11{display:block;width:91.66667%}}@media (max-width: 50.25rem){.bpk-grid__column--tablet-12{display:block;width:100%}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-0{margin-left:0}html[dir='rtl'] .bpk-grid__column--offset-tablet-0{margin-right:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-1{margin-left:8.33333%}html[dir='rtl'] .bpk-grid__column--offset-tablet-1{margin-right:8.33333%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-2{margin-left:16.66667%}html[dir='rtl'] .bpk-grid__column--offset-tablet-2{margin-right:16.66667%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-3{margin-left:25%}html[dir='rtl'] .bpk-grid__column--offset-tablet-3{margin-right:25%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-4{margin-left:33.33333%}html[dir='rtl'] .bpk-grid__column--offset-tablet-4{margin-right:33.33333%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-5{margin-left:41.66667%}html[dir='rtl'] .bpk-grid__column--offset-tablet-5{margin-right:41.66667%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-6{margin-left:50%}html[dir='rtl'] .bpk-grid__column--offset-tablet-6{margin-right:50%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-7{margin-left:58.33333%}html[dir='rtl'] .bpk-grid__column--offset-tablet-7{margin-right:58.33333%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-8{margin-left:66.66667%}html[dir='rtl'] .bpk-grid__column--offset-tablet-8{margin-right:66.66667%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-9{margin-left:75%}html[dir='rtl'] .bpk-grid__column--offset-tablet-9{margin-right:75%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-10{margin-left:83.33333%}html[dir='rtl'] .bpk-grid__column--offset-tablet-10{margin-right:83.33333%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-11{margin-left:91.66667%}html[dir='rtl'] .bpk-grid__column--offset-tablet-11{margin-right:91.66667%;margin-left:0}}@media (max-width: 50.25rem){.bpk-grid__column--offset-tablet-12{margin-left:100%}html[dir='rtl'] .bpk-grid__column--offset-tablet-12{margin-right:100%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-0{display:none}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-1{display:block;width:8.33333%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-2{display:block;width:16.66667%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-3{display:block;width:25%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-4{display:block;width:33.33333%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-5{display:block;width:41.66667%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-6{display:block;width:50%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-7{display:block;width:58.33333%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-8{display:block;width:66.66667%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-9{display:block;width:75%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-10{display:block;width:83.33333%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-11{display:block;width:91.66667%}}@media (max-width: 32.25rem){.bpk-grid__column--mobile-12{display:block;width:100%}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-0{margin-left:0}html[dir='rtl'] .bpk-grid__column--offset-mobile-0{margin-right:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-1{margin-left:8.33333%}html[dir='rtl'] .bpk-grid__column--offset-mobile-1{margin-right:8.33333%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-2{margin-left:16.66667%}html[dir='rtl'] .bpk-grid__column--offset-mobile-2{margin-right:16.66667%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-3{margin-left:25%}html[dir='rtl'] .bpk-grid__column--offset-mobile-3{margin-right:25%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-4{margin-left:33.33333%}html[dir='rtl'] .bpk-grid__column--offset-mobile-4{margin-right:33.33333%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-5{margin-left:41.66667%}html[dir='rtl'] .bpk-grid__column--offset-mobile-5{margin-right:41.66667%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-6{margin-left:50%}html[dir='rtl'] .bpk-grid__column--offset-mobile-6{margin-right:50%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-7{margin-left:58.33333%}html[dir='rtl'] .bpk-grid__column--offset-mobile-7{margin-right:58.33333%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-8{margin-left:66.66667%}html[dir='rtl'] .bpk-grid__column--offset-mobile-8{margin-right:66.66667%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-9{margin-left:75%}html[dir='rtl'] .bpk-grid__column--offset-mobile-9{margin-right:75%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-10{margin-left:83.33333%}html[dir='rtl'] .bpk-grid__column--offset-mobile-10{margin-right:83.33333%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-11{margin-left:91.66667%}html[dir='rtl'] .bpk-grid__column--offset-mobile-11{margin-right:91.66667%;margin-left:0}}@media (max-width: 32.25rem){.bpk-grid__column--offset-mobile-12{margin-left:100%}html[dir='rtl'] .bpk-grid__column--offset-mobile-12{margin-right:100%;margin-left:0}}

package/bpk-component-grid/src/BpkGridColumn.module.scss

@@ -1,73 +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.
- */
-
-@import '~bpk-mixins/index.scss';
-
-.bpk-grid {
-  &__column {
-    @include bpk-grid__column;
-
-    &--padded {
-      @include bpk-grid__column--padded;
-    }
-
-    &--debug {
-      @include bpk-grid__column--debug;
-    }
-
-    &-debugger {
-      @include bpk-grid__column-debugger;
-    }
-
-    @for $i from 0 through $bpk-grid-columns {
-      &--#{$i} {
-        @include bpk-grid__column--($i);
-      }
-    }
-
-    @for $i from 0 through $bpk-grid-columns {
-      &--offset-#{$i} {
-        @include bpk-grid__column--offset-($i);
-      }
-    }
-
-    @for $i from 0 through $bpk-grid-columns {
-      &--tablet-#{$i} {
-        @include bpk-grid__column--tablet-($i);
-      }
-    }
-
-    @for $i from 0 through $bpk-grid-columns {
-      &--offset-tablet-#{$i} {
-        @include bpk-grid__column--offset-tablet-($i);
-      }
-    }
-
-    @for $i from 0 through $bpk-grid-columns {
-      &--mobile-#{$i} {
-        @include bpk-grid__column--mobile-($i);
-      }
-    }
-
-    @for $i from 0 through $bpk-grid-columns {
-      &--offset-mobile-#{$i} {
-        @include bpk-grid__column--offset-mobile-($i);
-      }
-    }
-  }
-}

package/bpk-component-grid/src/BpkGridContainer.js

@@ -1,62 +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.
- */
-
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import { cssModules } from '../../bpk-react-utils';
-
-import STYLES from './BpkGridContainer.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-const BpkGridContainer = (props) => {
-  const { children, className, debug, fullWidth, ...rest } = props;
-  const classNames = [getClassName('bpk-grid__container')];
-
-  if (debug) {
-    classNames.push(getClassName('bpk-grid__container--debug'));
-  }
-  if (fullWidth) {
-    classNames.push(getClassName('bpk-grid__container--full-width'));
-  }
-  if (className) {
-    classNames.push(className);
-  }
-
-  return (
-    <div className={classNames.join(' ')} {...rest}>
-      {children}
-    </div>
-  );
-};
-
-BpkGridContainer.propTypes = {
-  children: PropTypes.node.isRequired,
-  debug: PropTypes.bool,
-  fullWidth: PropTypes.bool,
-  className: PropTypes.string,
-};
-
-BpkGridContainer.defaultProps = {
-  debug: false,
-  fullWidth: false,
-  className: null,
-};
-
-export default BpkGridContainer;

package/bpk-component-grid/src/BpkGridContainer.module.css

@@ -1,18 +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.
-*/
-@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-grid__container{max-width:71.25rem;margin:0 auto;padding-right:.75rem;padding-left:.75rem}@media (min-width: 50.3125rem){.bpk-grid__container{padding-right:1.5rem;padding-left:1.5rem}}.bpk-grid__container--debug{background-color:#f1f2f8}.bpk-grid__container--full-width{max-width:100%}

package/bpk-component-grid/src/BpkGridContainer.module.scss

@@ -1,33 +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.
- */
-
-@import '~bpk-mixins/index.scss';
-
-.bpk-grid {
-  &__container {
-    @include bpk-grid__container;
-
-    &--debug {
-      @include bpk-grid__container--debug;
-    }
-
-    &--full-width {
-      @include bpk-grid__container--full-width;
-    }
-  }
-}

package/bpk-component-grid/src/BpkGridRow.js

@@ -1,57 +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.
- */
-
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import { cssModules } from '../../bpk-react-utils';
-
-import STYLES from './BpkGridRow.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-const BpkGridRow = (props) => {
-  const classNames = [getClassName('bpk-grid__row')];
-  const { children, className, padded, ...rest } = props;
-
-  if (padded) {
-    classNames.push(getClassName('bpk-grid__row--padded'));
-  }
-  if (className) {
-    classNames.push(className);
-  }
-
-  return (
-    <div className={classNames.join(' ')} {...rest}>
-      {children}
-    </div>
-  );
-};
-
-BpkGridRow.propTypes = {
-  children: PropTypes.node.isRequired,
-  padded: PropTypes.bool,
-  className: PropTypes.string,
-};
-
-BpkGridRow.defaultProps = {
-  padded: true,
-  className: null,
-};
-
-export default BpkGridRow;