@skyscanner/backpack-web 0.0.1 → 0.0.4

package/bpk-component-heading/README.md

@@ -1,31 +0,0 @@
-# This component has been deprecated, please use bpk-component-text instead to apply heading styles
-# bpk-component-heading
-
-> Backpack heading component.
-
-## Installation
-
-```sh
-npm install bpk-component-heading --save-dev
-```
-
-## Usage
-
-```js
-import React from 'react';
-import BpkHeading from 'bpk-component-heading';
-
-export default () => (
-  <BpkHeading level="h1">My Heading</BpkHeading>
-);
-```
-
-## Props
-
-| Property     | PropType                           | Required | Default Value |
-| ------------ | ---------------------------------- | -------- | ------------- |
-| children     | -                                  | true     | -             |
-| level        | 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' | true     | -             |
-| className    | string                             | false    | null          |
-| id           | string                             | false    | null          |
-| bottomMargin | bool                               | false    | true          |

package/bpk-component-heading/examples.js

@@ -1,36 +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 BpkHeading from './index';
-
-const Examples = () => (
-  <div>
-    <BpkHeading level="h1">Heading 1</BpkHeading>
-    <BpkHeading level="h2">Heading 2</BpkHeading>
-    <BpkHeading level="h3">Heading 3</BpkHeading>
-    <BpkHeading level="h4">Heading 4</BpkHeading>
-    <BpkHeading level="h5">Heading 5</BpkHeading>
-    <BpkHeading level="h6">Heading 6</BpkHeading>
-  </div>
-);
-
-export default Examples;

package/bpk-component-heading/index.js

@@ -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.
- */
-
-/* @flow strict */
-
-import component from './src/BpkHeading';
-
-export default component;

package/bpk-component-heading/package.json

@@ -1,25 +0,0 @@
-{
-  "name": "bpk-component-heading",
-  "version": "5.1.0",
-  "description": "Backpack heading component.",
-  "license": "Apache-2.0",
-  "private": true,
-  "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": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
-    "prop-types": "^15.7.2"
-  },
-  "peerDependencies": {
-    "react": "^16.3.0 || ^17.0.0"
-  }
-}

package/bpk-component-heading/src/BpkHeading.js

@@ -1,70 +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 PropTypes from 'prop-types';
-import React, { type Node } from 'react';
-import { cssModules } from 'bpk-react-utils';
-
-import STYLES from './BpkHeading.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-type Props = {
-  children: Node,
-  level: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6',
-  className: ?string,
-  id: ?string,
-  bottomMargin: boolean,
-};
-
-const BpkHeading = (props: Props) => {
-  const { bottomMargin, children, className, id, level } = props;
-  const classNames = [getClassName(`bpk-heading-${level}`)];
-  const Level = level;
-
-  if (className) {
-    classNames.push(className);
-  }
-  if (!bottomMargin) {
-    classNames.push(getClassName('bpk-heading--no-bottom-margin'));
-  }
-
-  return (
-    <Level className={classNames.join(' ')} id={id}>
-      {children}
-    </Level>
-  );
-};
-
-BpkHeading.propTypes = {
-  children: PropTypes.node.isRequired,
-  level: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']).isRequired,
-  className: PropTypes.string,
-  id: PropTypes.string,
-  bottomMargin: PropTypes.bool,
-};
-
-BpkHeading.defaultProps = {
-  className: null,
-  id: null,
-  bottomMargin: true,
-};
-
-export default BpkHeading;

package/bpk-component-heading/src/BpkHeading.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-heading-h1{font-size:2.5rem;line-height:3rem;font-weight:700}@media (max-width: 32.25rem){.bpk-heading-h1{font-size:2rem;line-height:2.5rem;font-weight:700}}.bpk-heading-h2{font-size:2rem;line-height:2.5rem;font-weight:700}@media (max-width: 32.25rem){.bpk-heading-h2{font-size:1.5rem;line-height:1.75rem;font-weight:700}}.bpk-heading-h3{font-size:1.5rem;line-height:1.75rem;font-weight:700}@media (max-width: 32.25rem){.bpk-heading-h3{font-size:1.25rem;line-height:1.5rem;font-weight:700}}.bpk-heading-h4{font-size:1.25rem;line-height:1.5rem;font-weight:700}@media (max-width: 32.25rem){.bpk-heading-h4{font-size:1rem;line-height:1.25rem;font-weight:700}}.bpk-heading-h5{font-size:1rem;line-height:1.25rem;font-weight:700}.bpk-heading-h6{font-size:1rem;line-height:1.25rem;font-weight:700}.bpk-heading--no-bottom-margin{margin-bottom:0}

package/bpk-component-heading/src/BpkHeading.module.scss

@@ -1,49 +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-heading {
-  &-h1 {
-    @include bpk-heading-1;
-  }
-
-  &-h2 {
-    @include bpk-heading-2;
-  }
-
-  &-h3 {
-    @include bpk-heading-3;
-  }
-
-  &-h4 {
-    @include bpk-heading-4;
-  }
-
-  &-h5 {
-    @include bpk-heading-5;
-  }
-
-  &-h6 {
-    @include bpk-heading-6;
-  }
-
-  &--no-bottom-margin {
-    @include bpk-heading--no-bottom-margin;
-  }
-}

package/bpk-component-paragraph/README.md

@@ -1,28 +0,0 @@
-# This component has been deprecated, please use bpk-component-text instead to apply paragraph styles
-# bpk-component-paragraph
-
-> Backpack paragraph component.
-
-## Installation
-
-```sh
-npm install bpk-component-paragraph --save-dev
-```
-
-## Usage
-
-```js
-import React from 'react';
-import BpkParagraph from 'bpk-component-paragraph';
-
-export default () => (
-  <BpkParagraph>My paragraph content.</BpkParagraph>
-)
-```
-
-## Props
-
-| Property  | PropType | Required | Default Value |
-| --------- | -------- | -------- | ------------- |
-| children  | node     | true     | -             |
-| className | string   | false    | null          |

package/bpk-component-paragraph/examples.js

@@ -1,46 +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 BpkParagraph from './index';
-
-const DefaultExample = () => (
-  <div>
-    <BpkParagraph>
-      Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo
-      ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis
-      dis parturient montes, nascetur ridiculus mus.
-    </BpkParagraph>
-    <BpkParagraph>
-      Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla
-      consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec,
-      vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis
-      vitae, justo.
-    </BpkParagraph>
-    <BpkParagraph>
-      Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras
-      dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.
-      Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.
-    </BpkParagraph>
-  </div>
-);
-
-export default DefaultExample;

package/bpk-component-paragraph/index.js

@@ -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.
- */
-
-/* @flow strict */
-
-import component from './src/BpkParagraph';
-
-export default component;

package/bpk-component-paragraph/package.json

@@ -1,25 +0,0 @@
-{
-  "name": "bpk-component-paragraph",
-  "version": "3.1.0",
-  "description": "Backpack paragraph component.",
-  "license": "Apache-2.0",
-  "private": true,
-  "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": "^26.1.0",
-    "bpk-react-utils": "^4.1.0",
-    "prop-types": "^15.7.2"
-  },
-  "peerDependencies": {
-    "react": "^16.3.0 || ^17.0.0"
-  }
-}

package/bpk-component-paragraph/src/BpkParagraph.js

@@ -1,55 +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 PropTypes from 'prop-types';
-import React, { type Node } from 'react';
-import { cssModules } from 'bpk-react-utils';
-
-import STYLES from './BpkParagraph.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-type Props = {
-  children: Node,
-  className: ?string,
-};
-
-const BpkParagraph = (props: Props) => {
-  const classNames = [getClassName('bpk-paragraph')];
-  const { className, ...rest } = props;
-
-  if (className) {
-    classNames.push(className);
-  }
-
-  // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
-  return <p className={classNames.join(' ')} {...rest} />;
-};
-
-BpkParagraph.propTypes = {
-  children: PropTypes.node.isRequired,
-  className: PropTypes.string,
-};
-
-BpkParagraph.defaultProps = {
-  className: null,
-};
-
-export default BpkParagraph;

package/bpk-component-paragraph/src/BpkParagraph.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-paragraph{margin-top:0;margin-bottom:1rem}

package/bpk-component-paragraph/src/BpkParagraph.module.scss

@@ -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 '~bpk-mixins/index';
-
-$bpk-spacing-v2: true;
-
-.bpk-paragraph {
-  @include bpk-paragraph;
-}

package/bpk-tether/.eslintrc

@@ -1,6 +0,0 @@
-{
-  "rules": {
-    "import/no-unresolved": "off",
-    "import/extensions": "off"
-  }
-}

package/bpk-tether/README.md

@@ -1,52 +0,0 @@
-# bpk-tether
-
-> Wrapper around the Tether library, along with related utilities
-
-## Installation
-
-```sh
-npm install bpk-tether --save-dev
-```
-
-## Tether Wrapper
-
-A wrapper around the [Tether](http://tether.io/) library which extends the `Tether` object to emit a `position` event.
-
-### Usage
-
-```js
-import { Tether } from 'bpk-tether';
-
-this.tether = new Tether({
-  classPrefix: 'bpk-popover-tether',
-  element: popoverElement,
-  target: targetElement,
-  tetherOptions: tetherOptions,
-});
-
-this.tether.on('position', position => console.log('Tether was repositioned', position));
-```
-
-## getArrowPositionCallback
-
-When using Tether to create a popover or tooltip with an arrow pointing towards the target element, we want to have
-this arrow point to the target element at all times. To achieve this, the `getArrowPositionCallback` function returns
-a callback to be used on the `position` event. When invoked, it repositions the arrow element to stick to the target
-element.
-
-### Usage
-
-```js
-import { Tether } from 'bpk-tether';
-
-const classPrefix = 'bpk-popover-tether';
-
-this.tether = new Tether({
-  classPrefix,
-  element: tetherElement,
-  target: targetElement,
-  tetherOptions: tetherOptions,
-});
-
-this.tether.on('position', getArrowPositionCallback(tetherElement, 'arrow-id', classPrefix));
-```

package/bpk-tether/index.js

@@ -1,24 +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 TetherWrapper from './src/TetherWrapper';
-import getArrowPositionCallback from './src/getArrowPositionCallback';
-import applyRTLTransforms from './src/applyRTLTransforms';
-
-export default TetherWrapper;
-export { getArrowPositionCallback, applyRTLTransforms };

package/bpk-tether/package.json

@@ -1,19 +0,0 @@
-{
-  "name": "bpk-tether",
-  "version": "1.1.2",
-  "description": "Wrapper and utils for Tether.",
-  "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": "09fc99e4e67a5b71dc15f41a5409ad412bc139d4",
-  "dependencies": {
-    "tether": "^2.0.0"
-  }
-}

package/bpk-tether/src/TetherWrapper.js

@@ -1,30 +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 Tether from 'tether';
-
-// We extend tether to hook into the position function in order to expose
-// a `position` event on the tether object. Useful for repositioning arrows
-// etc. See http://tether.io/advanced/extending_tether/.
-Tether.modules.push({
-  position(props) {
-    this.trigger('position', props);
-  },
-});
-
-export default Tether;

package/bpk-tether/src/applyRTLTransforms.js

@@ -1,49 +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 { isRTL } from 'bpk-react-utils';
-
-const tryFlipAttachmentString = (value) => {
-  if (value.indexOf('right') !== -1) {
-    return value.replace('right', 'left');
-  }
-
-  return value.replace('left', 'right');
-};
-
-const transform = (tetherOptions) => {
-  const { attachment, targetAttachment, ...rest } = tetherOptions;
-
-  const options = {};
-
-  if (attachment) {
-    options.attachment = isRTL()
-      ? tryFlipAttachmentString(attachment)
-      : attachment;
-  }
-
-  if (targetAttachment) {
-    options.targetAttachment = isRTL()
-      ? tryFlipAttachmentString(targetAttachment)
-      : targetAttachment;
-  }
-
-  return { ...options, ...rest };
-};
-
-export default transform;