@paypal/checkout-components 5.0.256-alpha.1 → 5.0.257

package/src/funding/bancontact/config.jsx

@@ -1,40 +1,52 @@
 /* @flow */
 /** @jsx node */
 
-import { BancontactLogo } from '@paypal/sdk-logos/src';
-import { Fragment, node } from '@krakenjs/jsx-pragmatic/src';
-
-import { BUTTON_LAYOUT } from '../../constants';
-import { DEFAULT_APM_FUNDING_CONFIG, type FundingSourceConfig, BasicLabel } from '../common';
-import { Text, Space } from '../../ui/text';
-
-export function getBancontactConfig() : FundingSourceConfig {
-    return {
-        ...DEFAULT_APM_FUNDING_CONFIG,
-        
-        shippingChange: false,
-    
-        layouts: [
-            BUTTON_LAYOUT.VERTICAL
-        ],
-
-        Logo: ({ logoColor, optional }) => BancontactLogo({ logoColor, optional, loadFromCDN: __WEB__ }),
-
-        Label: ({ logo, ...opts }) => {
-            if (__WEB__) {
-                return logo;
-            }
-
-            const apmLogo = (
-                <Fragment>
-                    { logo }<Space /><Text animate optional>Bancontact</Text>
-                </Fragment>
-            );
-
-            return (<BasicLabel
-                { ...opts }
-                logo={ apmLogo }
-            />);
-        }
-    };
+import {
+  BancontactLogoInlineSVG,
+  BancontactLogoExternalImage,
+} from "@paypal/sdk-logos/src";
+import { Fragment, node } from "@krakenjs/jsx-pragmatic/src";
+
+import { BUTTON_LAYOUT } from "../../constants";
+import {
+  DEFAULT_APM_FUNDING_CONFIG,
+  type FundingSourceConfig,
+  BasicLabel,
+} from "../common";
+import { Text, Space } from "../../ui/text";
+
+export function getBancontactConfig(): FundingSourceConfig {
+  return {
+    ...DEFAULT_APM_FUNDING_CONFIG,
+
+    shippingChange: false,
+
+    layouts: [BUTTON_LAYOUT.VERTICAL],
+
+    Logo: ({ logoColor, optional }) => {
+      if (__WEB__) {
+        return BancontactLogoExternalImage({ logoColor, optional });
+      }
+
+      return BancontactLogoInlineSVG({ logoColor, optional });
+    },
+
+    Label: ({ logo, ...opts }) => {
+      if (__WEB__) {
+        return logo;
+      }
+
+      const apmLogo = (
+        <Fragment>
+          {logo}
+          <Space />
+          <Text animate optional>
+            Bancontact
+          </Text>
+        </Fragment>
+      );
+
+      return <BasicLabel {...opts} logo={apmLogo} />;
+    },
+  };
 }

package/src/funding/bancontact/index.js

@@ -1,4 +1,3 @@
 /* @flow */
 
-export * from './config';
-
+export * from "./config";

package/src/funding/blik/config.jsx

@@ -1,40 +1,52 @@
 /* @flow */
 /** @jsx node */
 
-import { BlikLogo } from '@paypal/sdk-logos/src';
-import { Fragment, node } from '@krakenjs/jsx-pragmatic/src';
-
-import { BUTTON_LAYOUT } from '../../constants';
-import { DEFAULT_APM_FUNDING_CONFIG, type FundingSourceConfig, BasicLabel } from '../common';
-import { Text, Space } from '../../ui/text';
-
-export function getBlikConfig() : FundingSourceConfig {
-    return {
-        ...DEFAULT_APM_FUNDING_CONFIG,
-        
-        shippingChange: false,
-    
-        layouts: [
-            BUTTON_LAYOUT.VERTICAL
-        ],
-
-        Logo: ({ logoColor, optional }) => BlikLogo({ logoColor, optional, loadFromCDN: __WEB__ }),
-
-        Label: ({ logo, ...opts }) => {
-            if (__WEB__) {
-                return logo;
-            }
-
-            const apmLogo = (
-                <Fragment>
-                    { logo }<Space /><Text animate optional>BLIK</Text>
-                </Fragment>
-            );
-
-            return (<BasicLabel
-                { ...opts }
-                logo={ apmLogo }
-            />);
-        }
-    };
+import {
+  BlikLogoInlineSVG,
+  BlikLogoExternalImage,
+} from "@paypal/sdk-logos/src";
+import { Fragment, node } from "@krakenjs/jsx-pragmatic/src";
+
+import { BUTTON_LAYOUT } from "../../constants";
+import {
+  DEFAULT_APM_FUNDING_CONFIG,
+  type FundingSourceConfig,
+  BasicLabel,
+} from "../common";
+import { Text, Space } from "../../ui/text";
+
+export function getBlikConfig(): FundingSourceConfig {
+  return {
+    ...DEFAULT_APM_FUNDING_CONFIG,
+
+    shippingChange: false,
+
+    layouts: [BUTTON_LAYOUT.VERTICAL],
+
+    Logo: ({ logoColor, optional }) => {
+      if (__WEB__) {
+        return BlikLogoExternalImage({ logoColor, optional });
+      }
+
+      return BlikLogoInlineSVG({ logoColor, optional });
+    },
+
+    Label: ({ logo, ...opts }) => {
+      if (__WEB__) {
+        return logo;
+      }
+
+      const apmLogo = (
+        <Fragment>
+          {logo}
+          <Space />
+          <Text animate optional>
+            BLIK
+          </Text>
+        </Fragment>
+      );
+
+      return <BasicLabel {...opts} logo={apmLogo} />;
+    },
+  };
 }

package/src/funding/blik/index.js

@@ -1,4 +1,3 @@
 /* @flow */
 
-export * from './config';
-
+export * from "./config";

package/src/funding/boleto/config.jsx

@@ -1,42 +1,54 @@
 /* @flow */
 /** @jsx node */
 
-import { BoletoLogo } from '@paypal/sdk-logos/src';
-import { Fragment, node } from '@krakenjs/jsx-pragmatic/src';
-
-import { BUTTON_LAYOUT } from '../../constants';
-import { DEFAULT_APM_FUNDING_CONFIG, type FundingSourceConfig, BasicLabel } from '../common';
-import { Text, Space } from '../../ui/text';
-
-export function getBoletoConfig() : FundingSourceConfig {
-    return {
-        ...DEFAULT_APM_FUNDING_CONFIG,
-
-        automatic: false,
-
-        shippingChange: false,
-
-        layouts: [
-            BUTTON_LAYOUT.VERTICAL
-        ],
-
-        Logo: ({ logoColor, optional }) => BoletoLogo({ logoColor, optional, loadFromCDN: __WEB__ }),
-
-        Label: ({ logo, ...opts }) => {
-            if (__WEB__) {
-                return logo;
-            }
-
-            const apmLogo = (
-                <Fragment>
-                    { logo }<Space /><Text animate optional>Boleto Bancário</Text>
-                </Fragment>
-            );
-
-            return (<BasicLabel
-                { ...opts }
-                logo={ apmLogo }
-            />);
-        }
-    };
+import {
+  BoletoLogoInlineSVG,
+  BoletoLogoExternalImage,
+} from "@paypal/sdk-logos/src";
+import { Fragment, node } from "@krakenjs/jsx-pragmatic/src";
+
+import { BUTTON_LAYOUT } from "../../constants";
+import {
+  DEFAULT_APM_FUNDING_CONFIG,
+  type FundingSourceConfig,
+  BasicLabel,
+} from "../common";
+import { Text, Space } from "../../ui/text";
+
+export function getBoletoConfig(): FundingSourceConfig {
+  return {
+    ...DEFAULT_APM_FUNDING_CONFIG,
+
+    automatic: false,
+
+    shippingChange: false,
+
+    layouts: [BUTTON_LAYOUT.VERTICAL],
+
+    Logo: ({ logoColor, optional }) => {
+      if (__WEB__) {
+        return BoletoLogoExternalImage({ logoColor, optional });
+      }
+
+      return BoletoLogoInlineSVG({ logoColor, optional });
+    },
+
+    Label: ({ logo, ...opts }) => {
+      if (__WEB__) {
+        return logo;
+      }
+
+      const apmLogo = (
+        <Fragment>
+          {logo}
+          <Space />
+          <Text animate optional>
+            Boleto Bancário
+          </Text>
+        </Fragment>
+      );
+
+      return <BasicLabel {...opts} logo={apmLogo} />;
+    },
+  };
 }

package/src/funding/boleto/index.js

@@ -1,4 +1,3 @@
 /* @flow */
 
-export * from './config';
-
+export * from "./config";

package/src/funding/card/amex/config.js

@@ -1,12 +1,14 @@
 /* @flow */
 
-import { AmexLogo } from '@paypal/sdk-logos/src';
+import {
+  AmexLogoInlineSVG,
+  AmexLogoExternalImage,
+} from "@paypal/sdk-logos/src";
 
-import type { CardConfig } from '../../common';
+import type { CardConfig } from "../../common";
 
-export function getAmexConfig() : CardConfig {
-    return {
-        Label: AmexLogo
-    };
+export function getAmexConfig(): CardConfig {
+  return {
+    Label: __WEB__ ? AmexLogoExternalImage : AmexLogoInlineSVG,
+  };
 }
-

package/src/funding/card/amex/index.js

@@ -1,4 +1,3 @@
 /* @flow */
 
-export * from './config';
-
+export * from "./config";