@skyscanner/backpack-web 8.0.0 → 9.1.0-alpha.1

package/bpk-component-input/src/BpkInput.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-input{display:inline-block;width:100%;height:2.25rem;padding:.5rem .5rem;border:solid 0.0625rem #B2B2BF;border-radius:.25rem;background:#fff;color:#111236;appearance:none}.bpk-input::placeholder{color:#68697f}.bpk-input:disabled{border-color:#f1f2f8;background:#fff;color:#b2b2bf;cursor:not-allowed}.bpk-input[type='number']{-moz-appearance:textfield}.bpk-input[type='number']::-webkit-inner-spin-button,.bpk-input[type='number']::-webkit-outer-spin-button{appearance:none}html[dir='rtl'] .bpk-input[type='number'],html[dir='rtl'] .bpk-input[type='tel'],html[dir='rtl'] .bpk-input[type='email']{text-align:right;direction:ltr}.bpk-input::-ms-clear{display:none}.bpk-input__container{position:relative;display:inline-block;width:100%}.bpk-input__clear-button{display:none;position:absolute;right:0.5rem;height:2.25rem}html[dir='rtl'] .bpk-input__clear-button{right:inherit;left:0.5rem}.bpk-input__clear-button--large{right:1rem;height:3rem}html[dir='rtl'] .bpk-input__clear-button--large{left:1rem}.bpk-input__clear-button--persistent{display:inherit}.bpk-input--valid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMDBhNjk4ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDIyLjVDNi4yMDEgMjIuNSAxLjUgMTcuNzk5IDEuNSAxMlM2LjIwMSAxLjUgMTIgMS41IDIyLjUgNi4yMDEgMjIuNSAxMiAxNy43OTkgMjIuNSAxMiAyMi41em01LjU2LTEyLjQ0YTEuNSAxLjUgMCAwIDAtMi4xMi0yLjEybC00Ljk0IDQuOTM5LTEuOTQtMS45NGExLjUgMS41IDAgMCAwLTIuMTIgMi4xMjJsMyAzYTEuNSAxLjUgMCAwIDAgMi4xMiAwbDYtNnoiLz48L3N2Zz4=") no-repeat right 0.5rem center;background-size:1.125rem 1.125rem}html[dir='rtl'] .bpk-input--valid{padding-right:.5rem;padding-left:2rem;background-position:left 0.5rem center}.bpk-input--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE4IiBoZWlnaHQ9IjE4Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjZDE0MzViICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDEuNUExMC41IDEwLjUgMCAxIDAgMjIuNSAxMiAxMC41IDEwLjUgMCAwIDAgMTIgMS41ek0xMiAxOGExLjUgMS41IDAgMSAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSAxMiAxOHptMS41LTZhMS41IDEuNSAwIDAgMS0zIDBWNy41YTEuNSAxLjUgMCAwIDEgMyAweiIvPjwvc3ZnPg==") no-repeat right 0.5rem center;background-size:1.125rem 1.125rem;border-color:#d1435b;border-color:var(--bpk-input-invalid-border-color, #d1435b)}html[dir='rtl'] .bpk-input--invalid{padding-right:.5rem;padding-left:2rem;background-position:left 0.5rem center}.bpk-input--clearable{padding-right:2rem}html[dir='rtl'] .bpk-input--clearable{padding-right:.5rem;padding-left:2rem}.bpk-input--clearable:focus{background:#fff}.bpk-input--clearable:focus+.bpk-input__clear-button{display:inherit}.bpk-input--large{height:3rem;padding-right:1rem;padding-left:1rem}.bpk-input--large.bpk-input--valid,.bpk-input--large.bpk-input--invalid,.bpk-input--large.bpk-input--clearable{padding-right:2.5rem;background-position:right 1rem center}html[dir='rtl'] .bpk-input--large.bpk-input--valid,html[dir='rtl'] .bpk-input--large.bpk-input--invalid,html[dir='rtl'] .bpk-input--large.bpk-input--clearable{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}.bpk-input--persistent-clearable{background:#fff}.bpk-input--docked:first-child{border-right-width:0;border-radius:.25rem 0 0 .25rem}html[dir='rtl'] .bpk-input--docked:first-child{border-right-width:.0625rem;border-left-width:0;border-radius:0 .25rem .25rem 0}.bpk-input--docked:first-child:focus{position:relative}.bpk-input--docked:last-child{border-radius:0 .25rem .25rem 0}html[dir='rtl'] .bpk-input--docked:last-child{border-radius:.25rem 0 0 .25rem}.bpk-input--docked:last-child:focus{position:relative}.bpk-input--docked:not(:first-child):not(:last-child){border-right-width:0;border-radius:0}html[dir='rtl'] .bpk-input--docked:not(:first-child):not(:last-child){border-right-width:.0625rem;border-left-width:0}.bpk-input--docked:not(:first-child):not(:last-child):focus{position:relative}.bpk-input--docked-first{border-right-width:0;border-radius:.25rem 0 0 .25rem}html[dir='rtl'] .bpk-input--docked-first{border-right-width:.0625rem;border-left-width:0;border-radius:0 .25rem .25rem 0}.bpk-input--docked-first:focus{position:relative}.bpk-input--docked-middle{border-right-width:0;border-radius:0}html[dir='rtl'] .bpk-input--docked-middle{border-right-width:.0625rem;border-left-width:0}.bpk-input--docked-middle:focus{position:relative}.bpk-input--docked-last{border-radius:0 .25rem .25rem 0}html[dir='rtl'] .bpk-input--docked-last{border-radius:.25rem 0 0 .25rem}.bpk-input--docked-last:focus{position:relative}.bpk-input--with-open-events{cursor:pointer}

package/bpk-component-input/src/BpkInput.module.scss

@@ -1,86 +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';
-
-$bpk-spacing-v2: true;
-
-.bpk-input {
-  @include bpk-input;
-
-  &__container {
-    @include bpk-input__container;
-  }
-
-  &__clear-button {
-    display: none;
-
-    @include bpk-input__clear-button;
-
-    &--persistent {
-      display: inherit;
-    }
-  }
-
-  &--valid {
-    @include bpk-input--valid;
-  }
-
-  &--invalid {
-    @include bpk-input--invalid;
-  }
-
-  &--clearable {
-    @include bpk-input--clearable;
-
-    // Display the clear button when a clearable input is focused.
-    &:focus + .bpk-input__clear-button {
-      display: inherit;
-    }
-  }
-
-  &--large {
-    @include bpk-input--large;
-  }
-
-  // When persistent, set background to override any validity icons
-  // appearing and make the clear button always display.
-  &--persistent-clearable {
-    background: $bpk-input-background;
-  }
-
-  &--docked {
-    @include bpk-input--docked;
-
-    &-first {
-      @include bpk-input--docked-first-child;
-    }
-
-    &-middle {
-      @include bpk-input--docked-middle-child;
-    }
-
-    &-last {
-      @include bpk-input--docked-last-child;
-    }
-  }
-
-  &--with-open-events {
-    cursor: pointer;
-  }
-}

package/bpk-component-label/README.md

@@ -1,30 +0,0 @@
-# bpk-component-label
-
-> Backpack label component.
-
-## Installation
-
-```sh
-npm install bpk-component-label --save-dev
-```
-
-## Usage
-
-```js
-import React from 'react';
-import BpkLabel from 'bpk-component-label';
-
-export default () => (
-  <BpkLabel htmlFor="origin">Origin</BpkLabel>
-)
-```
-
-## Props
-
-| Property  | PropType | Required | Default Value |
-| --------- | -------- | -------- | ------------- |
-| children  | node     | true     | -             |
-| disabled  | bool     | false    | false         |
-| invalid   | bool     | false    | false         |
-| required  | bool     | false    | false         |
-| white     | bool     | false    | false         |

package/bpk-component-label/package.json

@@ -1,24 +0,0 @@
-{
-  "name": "bpk-component-label",
-  "version": "5.1.13",
-  "description": "Backpack label component.",
-  "license": "Apache-2.0",
-  "repository": {
-    "type": "git",
-    "url": "git@github.com:Skyscanner/backpack.git"
-  },
-  "author": "Backpack Design System <backpack@skyscanner.net>",
-  "main": "index.js",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  },
-  "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
-  "dependencies": {
-    "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.1",
-    "prop-types": "^15.7.2"
-  },
-  "peerDependencies": {
-    "react": "^16.3.0 || ^17.0.0"
-  }
-}

package/bpk-component-label/src/BpkLabel.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-label{display:block;color:#111236;font-size:.75rem;font-weight:700;line-height:1rem}.bpk-label--white{color:#fff}.bpk-label--invalid{color:#d1435b;color:var(--bpk-form-validation-text-color, #d1435b)}.bpk-label--disabled{color:#b2b2bf;cursor:not-allowed}.bpk-label__asterisk{color:#d1435b;color:var(--bpk-form-validation-text-color, #d1435b)}

package/bpk-component-label/src/BpkLabel.module.scss

@@ -1,43 +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';
-
-.bpk-label {
-  @include bpk-label;
-
-  &--white {
-    @include bpk-label--white;
-  }
-
-  &--invalid {
-    @include bpk-label--invalid;
-  }
-
-  &--disabled {
-    @include bpk-label--disabled;
-  }
-
-  &__asterisk {
-    @include bpk-themeable-property(
-      color,
-      --bpk-form-validation-text-color,
-      $bpk-form-validation-color
-    );
-  }
-}

package/bpk-component-link/README.md

@@ -1,68 +0,0 @@
-# bpk-component-link
-
-> Backpack link component.
-
-## Installation
-
-```sh
-npm install bpk-component-link --save-dev
-```
-
-## Usage
-
-```js
-import React from 'react';
-import BpkLink, { BpkButtonLink } from 'bpk-component-link';
-
-export default () => (
-  <div>
-    Links can be both <BpkLink href="http://www.skyscanner.net/">anchor tags</BpkLink> as well
-    as <BpkButtonLink onClick={() => console.log('link button click!')}>button tags</BpkButtonLink>.
-  </div>
-)
-```
-
-## Single Page App (SPA) Frameworks
-
-If you're using a SPA framework like `react-router-dom` or `Next.js` to navigate between pages without refreshing, then you can wrap `BpkLink` in the component provided by the framework.
-
-[`react-router-dom` `Link` using the `component` prop](https://reactrouter.com/web/api/Link/component-reactcomponent)
-
-[`Next.js` `Link` using a custom component as the child element](https://nextjs.org/docs/api-reference/next/link#if-the-child-is-a-custom-component-that-wraps-an-a-tag)
-
-## Props
-
-### BpkLink
-
-| Property  | PropType | Required | Default Value |
-| --------  | -------- | -------- | ------------- |
-| children  | -        | true     | -             |
-| href      | string   | true     | -             |
-| onClick   | func     | false    | null          |
-| blank     | bool     | false    | false         |
-| rel       | string   | false    | null          |
-| alternate | bool     | false    | false         |
-
-### BpkButtonLink
-
-| Property  | PropType | Required | Default Value |
-| --------  | -------- | -------- | ------------- |
-| children  | -        | true     | -             |
-| onClick   | func     | true     | -             |
-| alternate | bool     | false    | false         |
-
-## Theme props
-
-For both BpkLink and BpkButtonLink the following theme attributes are required.
-
-* `linkColor`
-* `linkHoverColor`
-* `linkActiveColor`
-* `linkVisitedColor`
-
-Alternate:
-
-* `linkAlternateColor`
-* `linkAlternateHoverColor`
-* `linkAlternateActiveColor`
-* `linkAlternateVisitedColor`

package/bpk-component-link/package.json

@@ -1,28 +0,0 @@
-{
-  "name": "bpk-component-link",
-  "version": "3.1.13",
-  "description": "Backpack link component.",
-  "license": "Apache-2.0",
-  "repository": {
-    "type": "git",
-    "url": "git@github.com:Skyscanner/backpack.git"
-  },
-  "author": "Backpack Design System <backpack@skyscanner.net>",
-  "main": "index.js",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  },
-  "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
-  "dependencies": {
-    "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.1",
-    "prop-types": "^15.7.2"
-  },
-  "peerDependencies": {
-    "react": "^16.3.0 || ^17.0.0"
-  },
-  "devDependencies": {
-    "@skyscanner/bpk-foundations-web": "^8.0.0",
-    "bpk-storybook-utils": "^1.1.12"
-  }
-}

package/bpk-component-link/src/BpkLink.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-link{padding:0;border:0;background-color:transparent;text-decoration:none;cursor:pointer;appearance:none;color:#0770e3;color:var(--bpk-link-color, #0770e3)}.bpk-no-touch-support .bpk-link:hover:not(:active):not(:disabled){text-decoration:underline;color:#084eb2;color:var(--bpk-link-hover-color, #084eb2)}:global(.bpk-no-touch-support) .bpk-link:hover:not(:active):not(:disabled){text-decoration:underline;color:#084eb2;color:var(--bpk-link-hover-color, #084eb2)}.bpk-link:visited{color:#0770e3;color:var(--bpk-link-visited-color, #0770e3)}.bpk-link:active{text-decoration:underline;color:#042759;color:var(--bpk-link-active-color, #042759)}.bpk-link--active{color:#042759}.bpk-link--active:visited{color:#042759}.bpk-link--active:active{color:#042759}.bpk-link--alternate{color:#fff;color:var(--bpk-link-alternate-color, #fff)}.bpk-no-touch-support .bpk-link--alternate:hover:not(:active):not(:disabled){color:#fff;color:var(--bpk-link-alternate-hover-color, #fff)}:global(.bpk-no-touch-support) .bpk-link--alternate:hover:not(:active):not(:disabled){color:#fff;color:var(--bpk-link-alternate-hover-color, #fff)}.bpk-link--alternate:visited{color:#fff;color:var(--bpk-link-alternate-visited-color, #fff)}.bpk-link--alternate:active{color:#dddde5;color:var(--bpk-link-alternate-active-color, #dddde5)}

package/bpk-component-link/src/BpkLink.module.scss

@@ -1,31 +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';
-
-.bpk-link {
-  @include bpk-link;
-
-  &--active {
-    @include bpk-link--active;
-  }
-
-  &--alternate {
-    @include bpk-link--alternate;
-  }
-}

package/bpk-component-list/README.md

@@ -1,48 +0,0 @@
-# bpk-component-list
-
-> Backpack list component.
-
-## Installation
-
-```sh
-npm install bpk-component-list --save-dev
-```
-
-## Usage
-
-```js
-import React from 'react';
-import { BpkList, BpkListItem } from 'bpk-component-list';
-
-export default () => (
-  <BpkList>
-    <BpkListItem>Apples</BpkListItem>
-    <BpkListItem>
-      Oranges
-      <BpkList ordered>
-        <BpkListItem>Tangerines</BpkListItem>
-        <BpkListItem>Nectarines</BpkListItem>
-        <BpkListItem>Satsuma</BpkListItem>
-      </BpkList>
-    </BpkListItem>
-    <BpkListItem>Pears</BpkListItem>
-  </BpkList>
-);
-```
-
-## Props
-
-### BpkList
-
-| Property  | PropType | Required | Default Value |
-| --------- | -------- | -------- | ------------- |
-| children  | -        | true     | -             |
-| ordered   | bool     | false    | false         |
-| className | string   | false    | null          |
-
-### BpkListItem
-
-| Property  | PropType | Required | Default Value |
-| --------- | -------- | -------- | ------------- |
-| children  | -        | true     | -             |
-| className | string   | false    | null          |

package/bpk-component-list/package.json

@@ -1,24 +0,0 @@
-{
-  "name": "bpk-component-list",
-  "version": "4.0.6",
-  "description": "Backpack list component.",
-  "license": "Apache-2.0",
-  "repository": {
-    "type": "git",
-    "url": "git@github.com:Skyscanner/backpack.git"
-  },
-  "author": "Backpack Design System <backpack@skyscanner.net>",
-  "main": "index.js",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  },
-  "gitHead": "5c156b97cb0ba5e75851d3c763334578714c895e",
-  "dependencies": {
-    "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.1",
-    "prop-types": "^15.7.2"
-  },
-  "peerDependencies": {
-    "react": "^16.3.0 || ^17.0.0"
-  }
-}

package/bpk-component-list/src/BpkList.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-list{margin-top:0;margin-bottom:.75rem;padding-left:1.5rem}.bpk-list__item{margin-top:0;margin-bottom:0}.bpk-list .bpk-list{margin-top:0;margin-bottom:0}

package/bpk-component-list/src/BpkList.module.scss

@@ -1,37 +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';
-
-.bpk-list {
-  @include bpk-list;
-
-  &__item {
-    @include bpk-list-item;
-  }
-
-  & & {
-    @include bpk-list--nested;
-
-    /* stylelint-disable selector-max-compound-selectors */
-
-    > li {
-      margin-bottom: 0;
-    }
-  }
-}

package/bpk-component-loading-button/README.md

@@ -1,48 +0,0 @@
-# bpk-component-loading-button
-
-> Backpack loading button component.
-
-## Installation
-
-```sh
-npm install bpk-component-loading-button --save-dev
-```
-
-## Usage
-
-```js
-import React from 'react';
-import BpkLoadingButton from 'bpk-component-loading-button';
-import BaggageIcon from 'bpk-component-icon/sm/baggage';
-import { withButtonAlignment, withRtlSupport } from 'bpk-component-icon';
-
-const AlignedBaggageIcon = withButtonAlignment(withRtlSupport(BaggageIcon));
-const icon = <AlignedBaggageIcon />;
-
-export default () => (
-  <div>
-    <BpkLoadingButton>Primary</BpkLoadingButton>
-    <BpkLoadingButton large>Large primary</BpkLoadingButton>
-    <BpkLoadingButton secondary>Secondary</BpkLoadingButton>
-    <BpkLoadingButton iconOnly>
-      <span className="visually-hidden">Search</span>
-    </BpkLoadingButton>
-    <BpkLoadingButton icon={icon} iconDisabled={icon}>Custom Icon</BpkLoadingButton>
-  </div>
-);
-```
-
-## Props
-
-| Property     | PropType             | Required | Default Value          |
-| ------------ | -------------------- | -------- | ---------------------- |
-| children     | node                 | true     | -                      |
-| className    | string               | false    | null                   |
-| disabled     | bool                 | false    | false                  |
-| secondary    | bool                 | false    | false                  |
-| destructive  | bool                 | false    | false                  |
-| loading      | bool                 | false    | false                  |
-| iconOnly     | bool                 | false    | false                  |
-| icon         | element              | false    | null                   |
-| iconDisabled | element              | false    | null                   |
-| iconPosition | oneOf(ICON_POSITION) | false    | ICON_POSITION.TRAILING |

package/bpk-component-loading-button/package.json

@@ -1,30 +0,0 @@
-{
-  "name": "bpk-component-loading-button",
-  "version": "6.1.8",
-  "description": "Backpack loading button component.",
-  "license": "Apache-2.0",
-  "repository": {
-    "type": "git",
-    "url": "git@github.com:Skyscanner/backpack.git"
-  },
-  "author": "Backpack Design System <backpack@skyscanner.net>",
-  "main": "index.js",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  },
-  "gitHead": "f9f94f86d7cfc75e43bc6ad5eb01b23e62a89cc8",
-  "dependencies": {
-    "bpk-component-button": "^6.2.8",
-    "bpk-component-icon": "^9.2.14",
-    "bpk-component-spinner": "^5.1.13",
-    "bpk-mixins": "^31.1.1",
-    "bpk-react-utils": "^6.0.1",
-    "prop-types": "^15.7.2"
-  },
-  "devDependencies": {
-    "bpk-storybook-utils": "^1.1.12"
-  },
-  "peerDependencies": {
-    "react": "^16.3.0 || ^17.0.0"
-  }
-}

package/bpk-component-loading-button/src/BpkLoadingButton.module.scss

@@ -1,65 +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';
-
-$bpk-spacing-v2: true;
-
-.bpk-loading-button {
-  $button-padding-x: bpk-spacing-base() * 2;
-  $button-padding-y: bpk-spacing-lg() / 2;
-  $button-icon-only-padding-x: $bpk-one-pixel-rem * 9 * 2;
-  $button-large-icon-only-padding-x: $bpk-one-pixel-rem * 12 * 2;
-  $button-large-padding-y: bpk-spacing-lg();
-
-  position: relative;
-  overflow: hidden;
-
-  &--link {
-    visibility: hidden;
-  }
-
-  &__icon {
-    position: absolute;
-    display: inline-flex;
-    visibility: visible;
-    z-index: 1;
-    width: calc(100% - #{$button-padding-x});
-    height: calc(100% - #{$button-padding-y});
-    justify-content: center;
-    align-items: center;
-    background-color: inherit;
-
-    &--large {
-      height: calc(100% - #{$button-large-padding-y});
-    }
-
-    &--icon-only {
-      width: calc(100% - #{$button-icon-only-padding-x});
-    }
-
-    &--large-icon-only {
-      width: calc(100% - #{$button-large-icon-only-padding-x});
-    }
-
-    &--link {
-      width: 100%;
-      background: unset;
-    }
-  }
-}