`;
-exports[`Storyshots Icons/CardSchemes Base 1`] = `
-.circuit-115 {
- display: block;
- line-height: 0;
- text-align: center;
-}
-
-.circuit-3 {
- box-sizing: content-box;
- display: inline-block;
- padding: 8px;
-}
-
-.circuit-1 {
- height: 32px;
- width: auto;
- max-width: 56px;
-}
-
-.circuit-0 {
- width: auto;
- max-width: 100%;
- height: 100%;
- display: inline-block;
- line-height: 0;
-}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/Calendar/arrow-right.svg b/src/components/Calendar/arrow-right.svg
deleted file mode 100644
index 4b036f3609..0000000000
--- a/src/components/Calendar/arrow-right.svg
+++ /dev/null
@@ -1,8 +0,0 @@
-
diff --git a/src/components/Calendar/close.svg b/src/components/Calendar/close.svg
deleted file mode 100644
index e7b67ccd69..0000000000
--- a/src/components/Calendar/close.svg
+++ /dev/null
@@ -1,16 +0,0 @@
-
diff --git a/src/components/CardSchemes/CardSchemes.docs.mdx b/src/components/CardSchemes/CardSchemes.docs.mdx
deleted file mode 100644
index b565865ee9..0000000000
--- a/src/components/CardSchemes/CardSchemes.docs.mdx
+++ /dev/null
@@ -1,26 +0,0 @@
-import { Status, Props, Story } from '../../../.storybook/components';
-import CardSchemes from './CardSchemes';
-
-# Card Schemes
-
-
Will be moved to the icon library.
-
-Card Schemes provides a quick way to pull all accepted card schemes icons from SumUp.
-
-
-
-
-
-## When to use it
-
-Card scheme icons are used to indicate the accepted card schemes, such as in a credit card input form or in the marketing
-website to promote accepted schemes.
-
-## Usage guidelines
-
-- **Do** always check which schemes are accepted in each market, they usually vary from country to country
-- **Do** use to provide context beforehand when our user is completing a credit card payment
-
-## Usage in code
-
-It can be used in forms with the `CardNumberInput` component. Different sizes are also supported.
diff --git a/src/components/CardSchemes/CardSchemes.js b/src/components/CardSchemes/CardSchemes.js
deleted file mode 100644
index 648094aa39..0000000000
--- a/src/components/CardSchemes/CardSchemes.js
+++ /dev/null
@@ -1,84 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 React from 'react';
-import PropTypes from 'prop-types';
-import styled from '@emotion/styled';
-import { css } from '@emotion/core';
-import { isEmpty } from 'lodash/fp';
-
-import PaymentMethodIcon from './components/PaymentMethodIcon';
-import { sizes } from '../../styles/constants';
-
-const { BYTE, KILO, MEGA, GIGA } = sizes;
-
-const CardSchemeBaseStyles = ({ theme }) => css`
- box-sizing: content-box;
- display: inline-block;
- padding: ${theme.spacings.byte};
-`;
-
-const listWrapperBaseStyles = () => css`
- display: block;
- line-height: 0;
- text-align: center;
-`;
-
-const CardSchemeWrapper = styled('ul')(listWrapperBaseStyles);
-const PaymentMethodIconWrap = styled('li')(CardSchemeBaseStyles);
-
-/**
- * Displays a row of available or active card scheme icons
- */
-const CardSchemes = ({ iconIds, size, ...props }) => {
- if (isEmpty(iconIds)) {
- return null;
- }
-
- return (
-
- {iconIds.map(iconId => (
-
-
-
- ))}
-
- );
-};
-
-CardSchemes.BYTE = BYTE;
-CardSchemes.KILO = KILO;
-CardSchemes.MEGA = MEGA;
-CardSchemes.GIGA = GIGA;
-
-CardSchemes.propTypes = {
- /**
- * An array of scheme ids corresponding to the names of the scheme icons.
- */
- iconIds: PropTypes.arrayOf(PropTypes.string).isRequired,
- /**
- * The optional sizes of the icons of the card scheme
- */
- size: PropTypes.oneOf([BYTE, KILO, MEGA, GIGA])
-};
-
-CardSchemes.defaultProps = {
- size: GIGA
-};
-
-/**
- * @component
- */
-export default CardSchemes;
diff --git a/src/components/CardSchemes/CardSchemes.spec.js b/src/components/CardSchemes/CardSchemes.spec.js
deleted file mode 100644
index 9b1316249b..0000000000
--- a/src/components/CardSchemes/CardSchemes.spec.js
+++ /dev/null
@@ -1,57 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 React from 'react';
-import { keys } from 'lodash/fp';
-
-import CardSchemes from './CardSchemes';
-// eslint-disable-next-line max-len
-import schemeMap from './card-scheme-icons';
-
-describe('CardSchemes', () => {
- /**
- * Style tests.
- */
- it('should render with default styles', () => {
- const actual = create(
-
- );
- expect(actual).toMatchSnapshot();
- });
-
- it('should render each icon specified in the "iconsIds" prop', () => {
- const iconIds = ['visa', 'mastercard'];
- const { container } = render(
);
-
- const iconEls = container.querySelectorAll('li');
- expect(iconEls).toHaveLength(2);
- iconIds.forEach((iconId, index) => {
- expect(iconEls[index].firstChild.firstChild).toHaveTextContent(
- `${iconId}.svg`
- );
- });
- });
-
- /**
- * Accessibility tests.
- */
- it('should meet accessibility guidelines', async () => {
- const wrapper = renderToHtml(
-
- );
- const actual = await axe(wrapper);
- expect(actual).toHaveNoViolations();
- });
-});
diff --git a/src/components/CardSchemes/CardSchemes.story.js b/src/components/CardSchemes/CardSchemes.story.js
deleted file mode 100644
index b3dd2f41d7..0000000000
--- a/src/components/CardSchemes/CardSchemes.story.js
+++ /dev/null
@@ -1,48 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 React from 'react';
-import { keys } from 'lodash/fp';
-import { array, select } from '@storybook/addon-knobs';
-
-// eslint-disable-next-line max-len
-import schemeMap from './card-scheme-icons';
-
-import docs from './CardSchemes.docs.mdx';
-import CardSchemes from './CardSchemes';
-
-const iconIds = keys(schemeMap);
-const iconSizes = [
- CardSchemes.BYTE,
- CardSchemes.KILO,
- CardSchemes.MEGA,
- CardSchemes.GIGA
-];
-
-export default {
- title: 'Icons/CardSchemes',
- component: CardSchemes,
- parameters: {
- docs: { page: docs },
- jest: ['CardSchemes']
- }
-};
-
-export const base = () => (
-
-);
diff --git a/src/components/CardSchemes/__snapshots__/CardSchemes.spec.js.snap b/src/components/CardSchemes/__snapshots__/CardSchemes.spec.js.snap
deleted file mode 100644
index e827f25144..0000000000
--- a/src/components/CardSchemes/__snapshots__/CardSchemes.spec.js.snap
+++ /dev/null
@@ -1,379 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`CardSchemes should render with default styles 1`] = `
-.circuit-115 {
- display: block;
- line-height: 0;
- text-align: center;
-}
-
-.circuit-3 {
- box-sizing: content-box;
- display: inline-block;
- padding: 8px;
-}
-
-.circuit-1 {
- height: 32px;
- width: auto;
- max-width: 56px;
-}
-
-.circuit-0 {
- width: auto;
- max-width: 100%;
- height: 100%;
- display: inline-block;
- line-height: 0;
-}
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- visa-electron.svg
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
- -
-
-
-
-`;
diff --git a/src/components/CardSchemes/card-scheme-icons.js b/src/components/CardSchemes/card-scheme-icons.js
deleted file mode 100644
index c6f704ba32..0000000000
--- a/src/components/CardSchemes/card-scheme-icons.js
+++ /dev/null
@@ -1,84 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 React from 'react';
-
-import { flow, toPairs, reduce } from '../../util/fp';
-import { ReactComponent as Amex } from './icons/amex.svg';
-import { ReactComponent as Unknown } from './icons/unknown.svg';
-import { ReactComponent as Diners } from './icons/diners.svg';
-import { ReactComponent as Discover } from './icons/discover.svg';
-import { ReactComponent as Ec } from './icons/ec.svg';
-import { ReactComponent as Elo } from './icons/elo.svg';
-import { ReactComponent as Elv } from './icons/elv.svg';
-import { ReactComponent as Hiper } from './icons/hiper.svg';
-import { ReactComponent as Hipercard } from './icons/hipercard.svg';
-import { ReactComponent as Jcb } from './icons/jcb.svg';
-import { ReactComponent as Maestro } from './icons/maestro.svg';
-import { ReactComponent as Mastercard } from './icons/mastercard.svg';
-import { ReactComponent as VisaElectron } from './icons/visa-electron.svg';
-import { ReactComponent as Visa } from './icons/visa.svg';
-import { ReactComponent as Vpay } from './icons/vpay.svg';
-import { ReactComponent as Cash } from './icons/cash.svg';
-import { ReactComponent as GooglePay } from './icons/google-pay.svg';
-import { ReactComponent as ApplePay } from './icons/apple-pay.svg';
-import { ReactComponent as BancoEstado } from './icons/banco-estado.svg';
-import { ReactComponent as Dankort } from './icons/dankort.svg';
-import { ReactComponent as Nfc } from './icons/nfc.svg';
-import { ReactComponent as UnionPay } from './icons/union-pay.svg';
-import { ReactComponent as RedCompra } from './icons/red-compra.svg';
-
-export const iconComponents = {
- amex: Amex,
- diners: Diners,
- discover: Discover,
- ec: Ec,
- elo: Elo,
- elv: Elv,
- hiper: Hiper,
- hipercard: Hipercard,
- jcb: Jcb,
- maestro: Maestro,
- mastercard: Mastercard,
- visaElectron: VisaElectron,
- visa: Visa,
- vpay: Vpay,
- cash: Cash,
- googlePay: GooglePay,
- applePay: ApplePay,
- bancoEstado: BancoEstado,
- dankort: Dankort,
- nfc: Nfc,
- unionPay: UnionPay,
- redCompra: RedCompra,
- default: Unknown
-};
-
-const accessibleIconComponents = flow(
- toPairs,
- reduce(
- (acc, [name, IconComponent]) => ({
- ...acc,
- [name]: function Component(props) {
- return (
-
- );
- }
- }),
- {}
- )
-)(iconComponents);
-
-export default accessibleIconComponents;
diff --git a/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.js b/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.js
deleted file mode 100644
index ebca326e58..0000000000
--- a/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.js
+++ /dev/null
@@ -1,89 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 React from 'react';
-import PropTypes from 'prop-types';
-import styled from '@emotion/styled';
-import { css } from '@emotion/core';
-import { keys } from 'lodash/fp';
-
-import { sizes } from '../../../../styles/constants';
-import schemeMap from '../../card-scheme-icons';
-
-const { BYTE, KILO, MEGA, GIGA } = sizes;
-
-const wrapperStyles = ({ theme, size }) => css`
- height: ${theme.iconSizes[size]};
- width: auto;
- max-width: ${theme.spacings.zetta};
-`;
-
-const IconWrapper = styled('div')(wrapperStyles);
-
-/**
- * A single card scheme icon
- */
-const PaymentMethodIcon = ({ iconId, size, ...rest }) => {
- const IconSvg = schemeMap[iconId];
-
- if (!IconSvg) {
- return null;
- }
-
- return (
-
-
-
- );
-};
-
-PaymentMethodIcon.BYTE = BYTE;
-PaymentMethodIcon.KILO = KILO;
-PaymentMethodIcon.MEGA = MEGA;
-PaymentMethodIcon.GIGA = GIGA;
-
-PaymentMethodIcon.propTypes = {
- /**
- * The id of the card scheme icon.
- */
- iconId: PropTypes.oneOf(keys(schemeMap)),
- /**
- * The optional sizes of the scheme icon
- */
- size: PropTypes.oneOf([
- PaymentMethodIcon.BYTE,
- PaymentMethodIcon.KILO,
- PaymentMethodIcon.MEGA,
- PaymentMethodIcon.GIGA
- ])
-};
-
-PaymentMethodIcon.defaultProps = {
- iconId: '',
- size: PaymentMethodIcon.GIGA
-};
-
-/**
- * @component
- */
-export default PaymentMethodIcon;
diff --git a/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.spec.js b/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.spec.js
deleted file mode 100644
index 1ed4142c58..0000000000
--- a/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.spec.js
+++ /dev/null
@@ -1,58 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 React from 'react';
-import PaymentMethodIcon from './PaymentMethodIcon';
-
-describe('PaymentMethodIcon', () => {
- const iconId = 'visa';
- /**
- * Style tests.
- */
- it('should render with default styles', () => {
- const actual = create(
-
- );
- expect(actual).toMatchSnapshot();
- });
-
- /**
- * Logic tests
- */
- it('should render the specified icon', () => {
- const { getByTestId } = render(
-
- );
-
- const iconEl = getByTestId('payment-method-icon');
- expect(iconEl).toBeVisible();
- expect(iconEl.firstChild).toHaveTextContent(`${iconId}.svg`);
- });
-
- /**
- * Accessibility tests.
- */
- it('should meet accessibility guidelines', async () => {
- const wrapper = renderToHtml(
-
- );
- const actual = await axe(wrapper);
- expect(actual).toHaveNoViolations();
- });
-});
diff --git a/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.story.js b/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.story.js
deleted file mode 100644
index 9a45086902..0000000000
--- a/src/components/CardSchemes/components/PaymentMethodIcon/PaymentMethodIcon.story.js
+++ /dev/null
@@ -1,44 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 React from 'react';
-import { keys } from 'lodash/fp';
-import { select } from '@storybook/addon-knobs';
-
-// eslint-disable-next-line max-len
-import schemeMap from '../../card-scheme-icons';
-import PaymentMethodIcon from './PaymentMethodIcon';
-
-const iconSizes = [
- PaymentMethodIcon.BYTE,
- PaymentMethodIcon.KILO,
- PaymentMethodIcon.MEGA,
- PaymentMethodIcon.GIGA
-];
-
-export default {
- title: 'Icons/PaymentMethodIcon',
- component: PaymentMethodIcon,
- parameters: {
- jest: ['PaymentMethodIcon']
- }
-};
-
-export const base = () => (
-
-);
diff --git a/src/components/CardSchemes/components/PaymentMethodIcon/__snapshots__/PaymentMethodIcon.spec.js.snap b/src/components/CardSchemes/components/PaymentMethodIcon/__snapshots__/PaymentMethodIcon.spec.js.snap
deleted file mode 100644
index 5f32e05317..0000000000
--- a/src/components/CardSchemes/components/PaymentMethodIcon/__snapshots__/PaymentMethodIcon.spec.js.snap
+++ /dev/null
@@ -1,29 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`PaymentMethodIcon should render with default styles 1`] = `
-.circuit-1 {
- height: 16px;
- width: auto;
- max-width: 56px;
-}
-
-.circuit-0 {
- width: auto;
- max-width: 100%;
- height: 100%;
- display: inline-block;
- line-height: 0;
-}
-
-
-`;
diff --git a/src/components/CardSchemes/components/PaymentMethodIcon/index.js b/src/components/CardSchemes/components/PaymentMethodIcon/index.js
deleted file mode 100644
index e1a7b72cd9..0000000000
--- a/src/components/CardSchemes/components/PaymentMethodIcon/index.js
+++ /dev/null
@@ -1,18 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 PaymentMethodIcon from './PaymentMethodIcon';
-
-export default PaymentMethodIcon;
diff --git a/src/components/CardSchemes/icons/amex.svg b/src/components/CardSchemes/icons/amex.svg
deleted file mode 100755
index ee89e9a9c6..0000000000
--- a/src/components/CardSchemes/icons/amex.svg
+++ /dev/null
@@ -1,10 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/apple-pay.svg b/src/components/CardSchemes/icons/apple-pay.svg
deleted file mode 100644
index e578514060..0000000000
--- a/src/components/CardSchemes/icons/apple-pay.svg
+++ /dev/null
@@ -1,23 +0,0 @@
-
-
\ No newline at end of file
diff --git a/src/components/CardSchemes/icons/balance.svg b/src/components/CardSchemes/icons/balance.svg
deleted file mode 100755
index fe2de19df4..0000000000
--- a/src/components/CardSchemes/icons/balance.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/banco-estado.svg b/src/components/CardSchemes/icons/banco-estado.svg
deleted file mode 100644
index 059c7159b5..0000000000
--- a/src/components/CardSchemes/icons/banco-estado.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/card.svg b/src/components/CardSchemes/icons/card.svg
deleted file mode 100755
index 61b2caca4d..0000000000
--- a/src/components/CardSchemes/icons/card.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/cash.svg b/src/components/CardSchemes/icons/cash.svg
deleted file mode 100755
index 15b2f26738..0000000000
--- a/src/components/CardSchemes/icons/cash.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/dankort.svg b/src/components/CardSchemes/icons/dankort.svg
deleted file mode 100644
index 7a0f42d3b9..0000000000
--- a/src/components/CardSchemes/icons/dankort.svg
+++ /dev/null
@@ -1,13 +0,0 @@
-
-
\ No newline at end of file
diff --git a/src/components/CardSchemes/icons/diners.svg b/src/components/CardSchemes/icons/diners.svg
deleted file mode 100755
index 57ed301e0d..0000000000
--- a/src/components/CardSchemes/icons/diners.svg
+++ /dev/null
@@ -1,23 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/discover.svg b/src/components/CardSchemes/icons/discover.svg
deleted file mode 100755
index 59880730c5..0000000000
--- a/src/components/CardSchemes/icons/discover.svg
+++ /dev/null
@@ -1,12 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/ec.svg b/src/components/CardSchemes/icons/ec.svg
deleted file mode 100755
index c5c6d2b30c..0000000000
--- a/src/components/CardSchemes/icons/ec.svg
+++ /dev/null
@@ -1,18 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/elo.svg b/src/components/CardSchemes/icons/elo.svg
deleted file mode 100755
index 34e9056ff5..0000000000
--- a/src/components/CardSchemes/icons/elo.svg
+++ /dev/null
@@ -1,13 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/elv.svg b/src/components/CardSchemes/icons/elv.svg
deleted file mode 100755
index 509a9e3802..0000000000
--- a/src/components/CardSchemes/icons/elv.svg
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
diff --git a/src/components/CardSchemes/icons/google-pay.svg b/src/components/CardSchemes/icons/google-pay.svg
deleted file mode 100644
index fe0e1e7d7e..0000000000
--- a/src/components/CardSchemes/icons/google-pay.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/src/components/CardSchemes/icons/hiper.svg b/src/components/CardSchemes/icons/hiper.svg
deleted file mode 100644
index 5de50a7cb6..0000000000
--- a/src/components/CardSchemes/icons/hiper.svg
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
\ No newline at end of file
diff --git a/src/components/CardSchemes/icons/hipercard.svg b/src/components/CardSchemes/icons/hipercard.svg
deleted file mode 100755
index 86ef576b39..0000000000
--- a/src/components/CardSchemes/icons/hipercard.svg
+++ /dev/null
@@ -1,8 +0,0 @@
-
-
diff --git a/src/components/CardSchemes/icons/jcb.svg b/src/components/CardSchemes/icons/jcb.svg
deleted file mode 100644
index 38433cbf4d..0000000000
--- a/src/components/CardSchemes/icons/jcb.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-
-
diff --git a/src/components/CardSchemes/icons/maestro.svg b/src/components/CardSchemes/icons/maestro.svg
deleted file mode 100755
index f51aa499c0..0000000000
--- a/src/components/CardSchemes/icons/maestro.svg
+++ /dev/null
@@ -1,11 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/mastercard.svg b/src/components/CardSchemes/icons/mastercard.svg
deleted file mode 100755
index 2250fe2ebb..0000000000
--- a/src/components/CardSchemes/icons/mastercard.svg
+++ /dev/null
@@ -1,11 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/nfc.svg b/src/components/CardSchemes/icons/nfc.svg
deleted file mode 100644
index 14ea45b60d..0000000000
--- a/src/components/CardSchemes/icons/nfc.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/red-compra.svg b/src/components/CardSchemes/icons/red-compra.svg
deleted file mode 100644
index bbb968ec61..0000000000
--- a/src/components/CardSchemes/icons/red-compra.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/src/components/CardSchemes/icons/union-pay.svg b/src/components/CardSchemes/icons/union-pay.svg
deleted file mode 100644
index 0d1c8f3df1..0000000000
--- a/src/components/CardSchemes/icons/union-pay.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/unknown.svg b/src/components/CardSchemes/icons/unknown.svg
deleted file mode 100755
index 9b497be480..0000000000
--- a/src/components/CardSchemes/icons/unknown.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/visa-electron.svg b/src/components/CardSchemes/icons/visa-electron.svg
deleted file mode 100755
index 0f00f89f30..0000000000
--- a/src/components/CardSchemes/icons/visa-electron.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/visa.svg b/src/components/CardSchemes/icons/visa.svg
deleted file mode 100755
index 84f8fab0b5..0000000000
--- a/src/components/CardSchemes/icons/visa.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-
diff --git a/src/components/CardSchemes/icons/vpay.svg b/src/components/CardSchemes/icons/vpay.svg
deleted file mode 100755
index 0f55787342..0000000000
--- a/src/components/CardSchemes/icons/vpay.svg
+++ /dev/null
@@ -1,10 +0,0 @@
-
diff --git a/src/components/CardSchemes/index.js b/src/components/CardSchemes/index.js
deleted file mode 100644
index 68f1ad1428..0000000000
--- a/src/components/CardSchemes/index.js
+++ /dev/null
@@ -1,18 +0,0 @@
-/**
- * Copyright 2019, SumUp 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 CardSchemes from './CardSchemes';
-
-export default CardSchemes;
diff --git a/src/components/Carousel/__snapshots__/Carousel.spec.js.snap b/src/components/Carousel/__snapshots__/Carousel.spec.js.snap
index ee39a5bd1f..63e20fee3a 100644
--- a/src/components/Carousel/__snapshots__/Carousel.spec.js.snap
+++ b/src/components/Carousel/__snapshots__/Carousel.spec.js.snap
@@ -49,7 +49,7 @@ exports[`Carousel styles should render with children as a function 1`] = `
}
}
-.circuit-64 {
+.circuit-63 {
width: 100%;
height: auto;
position: relative;
@@ -180,7 +180,7 @@ exports[`Carousel styles should render with children as a function 1`] = `
z-index: -2;
}
-.circuit-62 {
+.circuit-61 {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
@@ -258,7 +258,7 @@ exports[`Carousel styles should render with children as a function 1`] = `
height: 100%;
}
-.circuit-60 {
+.circuit-59 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@@ -275,7 +275,7 @@ exports[`Carousel styles should render with children as a function 1`] = `
}
@media (max-width:479px) {
- .circuit-60 {
+ .circuit-59 {
margin-left: 12px;
}
}
@@ -382,99 +382,9 @@ exports[`Carousel styles should render with children as a function 1`] = `
align-items: center;
}
-.circuit-53 {
- background-color: #FAFBFC;
- border-color: #D8DDE1;
- border-radius: 4px;
- border-style: solid;
- border-width: 1px;
- box-shadow: inset 0 1px 0 1px rgba(255,255,255,0.06);
- display: block;
- color: #5C656F;
- cursor: pointer;
- font-weight: 700;
- width: auto;
- height: auto;
- text-align: center;
- -webkit-text-decoration: none;
- text-decoration: none;
- font-size: 16px;
- line-height: 24px;
- padding: calc(8px - 0px) calc(24px - 0px);
- background-color: #D8DDE1;
- width: 32px;
- height: 32px;
- padding: 0;
- overflow: hidden;
- border-radius: 50%;
- margin-left: 8px;
- -webkit-transform: rotate(180deg);
- -ms-transform: rotate(180deg);
- transform: rotate(180deg);
-}
-
-.circuit-53:active {
- background-color: #D8DDE1;
- border-color: #9DA7B1;
- box-shadow: inset 0 4px 8px 0 rgba(12,15,20,0.3);
-}
-
-.circuit-53:focus {
- border-color: #9DA7B1;
- border-width: 2px;
- outline: 0;
- padding: calc(8px - 1px) calc(24px - 1px);
-}
-
-.circuit-53:hover {
- background-color: #D8DDE1;
-}
-
-.circuit-53:hover,
-.circuit-53:active {
- border-color: #9DA7B1;
- border-width: 1px;
- padding: calc(8px - 0px) calc(24px - 0px);
-}
-
-.circuit-53[href] {
- display: inline-block;
-}
-
-.circuit-53:disabled,
-.circuit-53[disabled] {
- opacity: 0.4;
- pointer-events: none;
- -webkit-user-selectable: none;
- -moz-user-selectable: none;
- -ms-user-selectable: none;
- user-selectable: none;
-}
-
-.circuit-53:first-of-type {
- margin-left: 0;
-}
-
-.circuit-53:active,
-.circuit-53:focus,
-.circuit-53:hover {
- padding: 0;
-}
-
-@media (max-width:479px) {
- .circuit-53 {
- width: 24px;
- height: 24px;
- }
-
- .circuit-53 svg {
- width: 25%;
- }
-}
-
@@ -657,7 +602,7 @@ exports[`Carousel styles should render with children as a node 1`] = `
}
}
-.circuit-64 {
+.circuit-63 {
width: 100%;
height: auto;
position: relative;
@@ -788,7 +733,7 @@ exports[`Carousel styles should render with children as a node 1`] = `
z-index: -2;
}
-.circuit-62 {
+.circuit-61 {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
@@ -866,7 +811,7 @@ exports[`Carousel styles should render with children as a node 1`] = `
height: 100%;
}
-.circuit-60 {
+.circuit-59 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@@ -883,7 +828,7 @@ exports[`Carousel styles should render with children as a node 1`] = `
}
@media (max-width:479px) {
- .circuit-60 {
+ .circuit-59 {
margin-left: 12px;
}
}
@@ -990,99 +935,9 @@ exports[`Carousel styles should render with children as a node 1`] = `
align-items: center;
}
-.circuit-53 {
- background-color: #FAFBFC;
- border-color: #D8DDE1;
- border-radius: 4px;
- border-style: solid;
- border-width: 1px;
- box-shadow: inset 0 1px 0 1px rgba(255,255,255,0.06);
- display: block;
- color: #5C656F;
- cursor: pointer;
- font-weight: 700;
- width: auto;
- height: auto;
- text-align: center;
- -webkit-text-decoration: none;
- text-decoration: none;
- font-size: 16px;
- line-height: 24px;
- padding: calc(8px - 0px) calc(24px - 0px);
- background-color: #D8DDE1;
- width: 32px;
- height: 32px;
- padding: 0;
- overflow: hidden;
- border-radius: 50%;
- margin-left: 8px;
- -webkit-transform: rotate(180deg);
- -ms-transform: rotate(180deg);
- transform: rotate(180deg);
-}
-
-.circuit-53:active {
- background-color: #D8DDE1;
- border-color: #9DA7B1;
- box-shadow: inset 0 4px 8px 0 rgba(12,15,20,0.3);
-}
-
-.circuit-53:focus {
- border-color: #9DA7B1;
- border-width: 2px;
- outline: 0;
- padding: calc(8px - 1px) calc(24px - 1px);
-}
-
-.circuit-53:hover {
- background-color: #D8DDE1;
-}
-
-.circuit-53:hover,
-.circuit-53:active {
- border-color: #9DA7B1;
- border-width: 1px;
- padding: calc(8px - 0px) calc(24px - 0px);
-}
-
-.circuit-53[href] {
- display: inline-block;
-}
-
-.circuit-53:disabled,
-.circuit-53[disabled] {
- opacity: 0.4;
- pointer-events: none;
- -webkit-user-selectable: none;
- -moz-user-selectable: none;
- -ms-user-selectable: none;
- user-selectable: none;
-}
-
-.circuit-53:first-of-type {
- margin-left: 0;
-}
-
-.circuit-53:active,
-.circuit-53:focus,
-.circuit-53:hover {
- padding: 0;
-}
-
-@media (max-width:479px) {
- .circuit-53 {
- width: 24px;
- height: 24px;
- }
-
- .circuit-53 svg {
- width: 25%;
- }
-}
-
@@ -1264,7 +1154,7 @@ exports[`Carousel styles should render with default paused styles 1`] = `
}
}
-.circuit-64 {
+.circuit-63 {
width: 100%;
height: auto;
position: relative;
@@ -1395,7 +1285,7 @@ exports[`Carousel styles should render with default paused styles 1`] = `
z-index: -2;
}
-.circuit-62 {
+.circuit-61 {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
@@ -1445,7 +1335,7 @@ exports[`Carousel styles should render with default paused styles 1`] = `
}
}
-.circuit-60 {
+.circuit-59 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@@ -1462,7 +1352,7 @@ exports[`Carousel styles should render with default paused styles 1`] = `
}
@media (max-width:479px) {
- .circuit-60 {
+ .circuit-59 {
margin-left: 12px;
}
}
@@ -1569,96 +1459,6 @@ exports[`Carousel styles should render with default paused styles 1`] = `
align-items: center;
}
-.circuit-53 {
- background-color: #FAFBFC;
- border-color: #D8DDE1;
- border-radius: 4px;
- border-style: solid;
- border-width: 1px;
- box-shadow: inset 0 1px 0 1px rgba(255,255,255,0.06);
- display: block;
- color: #5C656F;
- cursor: pointer;
- font-weight: 700;
- width: auto;
- height: auto;
- text-align: center;
- -webkit-text-decoration: none;
- text-decoration: none;
- font-size: 16px;
- line-height: 24px;
- padding: calc(8px - 0px) calc(24px - 0px);
- background-color: #D8DDE1;
- width: 32px;
- height: 32px;
- padding: 0;
- overflow: hidden;
- border-radius: 50%;
- margin-left: 8px;
- -webkit-transform: rotate(180deg);
- -ms-transform: rotate(180deg);
- transform: rotate(180deg);
-}
-
-.circuit-53:active {
- background-color: #D8DDE1;
- border-color: #9DA7B1;
- box-shadow: inset 0 4px 8px 0 rgba(12,15,20,0.3);
-}
-
-.circuit-53:focus {
- border-color: #9DA7B1;
- border-width: 2px;
- outline: 0;
- padding: calc(8px - 1px) calc(24px - 1px);
-}
-
-.circuit-53:hover {
- background-color: #D8DDE1;
-}
-
-.circuit-53:hover,
-.circuit-53:active {
- border-color: #9DA7B1;
- border-width: 1px;
- padding: calc(8px - 0px) calc(24px - 0px);
-}
-
-.circuit-53[href] {
- display: inline-block;
-}
-
-.circuit-53:disabled,
-.circuit-53[disabled] {
- opacity: 0.4;
- pointer-events: none;
- -webkit-user-selectable: none;
- -moz-user-selectable: none;
- -ms-user-selectable: none;
- user-selectable: none;
-}
-
-.circuit-53:first-of-type {
- margin-left: 0;
-}
-
-.circuit-53:active,
-.circuit-53:focus,
-.circuit-53:hover {
- padding: 0;
-}
-
-@media (max-width:479px) {
- .circuit-53 {
- width: 24px;
- height: 24px;
- }
-
- .circuit-53 svg {
- width: 25%;
- }
-}
-
.circuit-42 {
width: 100%;
height: 2px;
@@ -1689,7 +1489,7 @@ exports[`Carousel styles should render with default paused styles 1`] = `
@@ -1845,7 +1681,7 @@ exports[`Carousel styles should render with default styles 1`] = `
}
}
-.circuit-64 {
+.circuit-63 {
width: 100%;
height: auto;
position: relative;
@@ -1976,7 +1812,7 @@ exports[`Carousel styles should render with default styles 1`] = `
z-index: -2;
}
-.circuit-62 {
+.circuit-61 {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
@@ -2054,7 +1890,7 @@ exports[`Carousel styles should render with default styles 1`] = `
height: 100%;
}
-.circuit-60 {
+.circuit-59 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@@ -2071,7 +1907,7 @@ exports[`Carousel styles should render with default styles 1`] = `
}
@media (max-width:479px) {
- .circuit-60 {
+ .circuit-59 {
margin-left: 12px;
}
}
@@ -2178,99 +2014,9 @@ exports[`Carousel styles should render with default styles 1`] = `
align-items: center;
}
-.circuit-53 {
- background-color: #FAFBFC;
- border-color: #D8DDE1;
- border-radius: 4px;
- border-style: solid;
- border-width: 1px;
- box-shadow: inset 0 1px 0 1px rgba(255,255,255,0.06);
- display: block;
- color: #5C656F;
- cursor: pointer;
- font-weight: 700;
- width: auto;
- height: auto;
- text-align: center;
- -webkit-text-decoration: none;
- text-decoration: none;
- font-size: 16px;
- line-height: 24px;
- padding: calc(8px - 0px) calc(24px - 0px);
- background-color: #D8DDE1;
- width: 32px;
- height: 32px;
- padding: 0;
- overflow: hidden;
- border-radius: 50%;
- margin-left: 8px;
- -webkit-transform: rotate(180deg);
- -ms-transform: rotate(180deg);
- transform: rotate(180deg);
-}
-
-.circuit-53:active {
- background-color: #D8DDE1;
- border-color: #9DA7B1;
- box-shadow: inset 0 4px 8px 0 rgba(12,15,20,0.3);
-}
-
-.circuit-53:focus {
- border-color: #9DA7B1;
- border-width: 2px;
- outline: 0;
- padding: calc(8px - 1px) calc(24px - 1px);
-}
-
-.circuit-53:hover {
- background-color: #D8DDE1;
-}
-
-.circuit-53:hover,
-.circuit-53:active {
- border-color: #9DA7B1;
- border-width: 1px;
- padding: calc(8px - 0px) calc(24px - 0px);
-}
-
-.circuit-53[href] {
- display: inline-block;
-}
-
-.circuit-53:disabled,
-.circuit-53[disabled] {
- opacity: 0.4;
- pointer-events: none;
- -webkit-user-selectable: none;
- -moz-user-selectable: none;
- -ms-user-selectable: none;
- user-selectable: none;
-}
-
-.circuit-53:first-of-type {
- margin-left: 0;
-}
-
-.circuit-53:active,
-.circuit-53:focus,
-.circuit-53:hover {
- padding: 0;
-}
-
-@media (max-width:479px) {
- .circuit-53 {
- width: 24px;
- height: 24px;
- }
-
- .circuit-53 svg {
- width: 25%;
- }
-}
-
diff --git a/src/components/Carousel/components/Buttons/Buttons.js b/src/components/Carousel/components/Buttons/Buttons.js
index 6821c8c130..040d0787f4 100644
--- a/src/components/Carousel/components/Buttons/Buttons.js
+++ b/src/components/Carousel/components/Buttons/Buttons.js
@@ -17,13 +17,10 @@ import React from 'react';
import PropTypes from 'prop-types';
import styled from '@emotion/styled';
import { css } from '@emotion/core';
+import { ChevronLeft, ChevronRight, Pause, Play } from '@sumup/icons';
import CircuitUIButton from '../../../Button';
-import { ReactComponent as PlayIcon } from './icons/play.svg';
-import { ReactComponent as ArrowIcon } from './icons/arrow.svg';
-import { ReactComponent as PauseIcon } from './icons/pause.svg';
-
const buttonListStyles = css`
label: carousel__buttonlist;
display: flex;
@@ -74,21 +71,24 @@ const innerWrapperStyles = css`
const InnerWrapper = styled('div')(innerWrapperStyles);
export const NextButton = props => (
-