mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-05 08:59:14 +08:00
Merge branch 'refs/heads/trunk' into modularity-module-migration
# Conflicts: # composer.lock # modules/ppcp-axo/src/AxoModule.php # modules/ppcp-blocks/src/BlocksModule.php # modules/ppcp-compat/src/CompatModule.php # modules/ppcp-googlepay/src/GooglepayModule.php # modules/ppcp-order-tracking/src/OrderTrackingModule.php # modules/ppcp-wc-subscriptions/src/WcSubscriptionsModule.php
This commit is contained in:
Moritz Meißelbach
commit
4d9f23e315
301 changed files with 33875 additions and 13196 deletions
|
|
@ -7,40 +7,45 @@
|
|||
"description": "PayPal Pay Later messaging will be displayed for eligible customers. Customers automatically see the most relevant Pay Later offering.",
|
||||
"example": {},
|
||||
"attributes": {
|
||||
"id": {
|
||||
"type": "string"
|
||||
},
|
||||
"layout": {
|
||||
"type": "string",
|
||||
"default": "flex"
|
||||
},
|
||||
"logo": {
|
||||
"type": "string",
|
||||
"default": "inline"
|
||||
},
|
||||
"position": {
|
||||
"type": "string",
|
||||
"default": "left"
|
||||
},
|
||||
"color": {
|
||||
"type": "string",
|
||||
"default": "black"
|
||||
},
|
||||
"flexColor": {
|
||||
"type": "string",
|
||||
"default": "white"
|
||||
},
|
||||
"flexRatio": {
|
||||
"type": "string",
|
||||
"default": "8x1"
|
||||
},
|
||||
"placement": {
|
||||
"type": "string",
|
||||
"default": "auto"
|
||||
}
|
||||
"id": {
|
||||
"type": "string"
|
||||
},
|
||||
"layout": {
|
||||
"type": "string",
|
||||
"default": "flex"
|
||||
},
|
||||
"logo": {
|
||||
"type": "string",
|
||||
"default": "inline"
|
||||
},
|
||||
"position": {
|
||||
"type": "string",
|
||||
"default": "left"
|
||||
},
|
||||
"color": {
|
||||
"type": "string",
|
||||
"default": "black"
|
||||
},
|
||||
"size": {
|
||||
"type": "string",
|
||||
"default": "14"
|
||||
},
|
||||
"flexColor": {
|
||||
"type": "string",
|
||||
"default": "white"
|
||||
},
|
||||
"flexRatio": {
|
||||
"type": "string",
|
||||
"default": "8x1"
|
||||
},
|
||||
"placement": {
|
||||
"type": "string",
|
||||
"default": "auto"
|
||||
}
|
||||
},
|
||||
"supports": {
|
||||
"html": false
|
||||
"html": false,
|
||||
"multiple": false
|
||||
},
|
||||
"textdomain": "woocommerce-paypal-payments",
|
||||
"editorScript": "ppcp-paylater-block",
|
||||
|
|
|
|||
156
modules/ppcp-paylater-block/composer.lock
generated
Normal file
156
modules/ppcp-paylater-block/composer.lock
generated
Normal file
|
|
@ -0,0 +1,156 @@
|
|||
{
|
||||
"_readme": [
|
||||
"This file locks the dependencies of your project to a known state",
|
||||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||
"This file is @generated automatically"
|
||||
],
|
||||
"content-hash": "51e234e39d0fd6bbb67fe2186683facd",
|
||||
"packages": [
|
||||
{
|
||||
"name": "container-interop/service-provider",
|
||||
"version": "v0.4.1",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/container-interop/service-provider.git",
|
||||
"reference": "e04441ca21ef03e10dce70b0af29269281eec6dc"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/container-interop/service-provider/zipball/e04441ca21ef03e10dce70b0af29269281eec6dc",
|
||||
"reference": "e04441ca21ef03e10dce70b0af29269281eec6dc",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"psr/container": "^1.0 || ^2.0"
|
||||
},
|
||||
"type": "library",
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"Interop\\Container\\": "src/"
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"MIT"
|
||||
],
|
||||
"description": "Promoting container interoperability through standard service providers",
|
||||
"homepage": "https://github.com/container-interop/service-provider",
|
||||
"support": {
|
||||
"issues": "https://github.com/container-interop/service-provider/issues",
|
||||
"source": "https://github.com/container-interop/service-provider/tree/v0.4.1"
|
||||
},
|
||||
"time": "2023-12-14T14:50:12+00:00"
|
||||
},
|
||||
{
|
||||
"name": "dhii/module-interface",
|
||||
"version": "v0.3.0-alpha2",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/Dhii/module-interface.git",
|
||||
"reference": "0e39f167d7ed8990c82f5d2e6084159d1a502a5b"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/Dhii/module-interface/zipball/0e39f167d7ed8990c82f5d2e6084159d1a502a5b",
|
||||
"reference": "0e39f167d7ed8990c82f5d2e6084159d1a502a5b",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"container-interop/service-provider": "^0.4",
|
||||
"php": "^7.1 | ^8.0",
|
||||
"psr/container": "^1.0"
|
||||
},
|
||||
"require-dev": {
|
||||
"phpunit/phpunit": "^7.0 | ^8.0 | ^9.0",
|
||||
"slevomat/coding-standard": "^6.0",
|
||||
"vimeo/psalm": "^3.11.7 | ^4.0"
|
||||
},
|
||||
"type": "library",
|
||||
"extra": {
|
||||
"branch-alias": {
|
||||
"dev-develop": "0.3.x-dev"
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"Dhii\\Modular\\Module\\": "src"
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"MIT"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "Dhii Team",
|
||||
"email": "development@dhii.co"
|
||||
}
|
||||
],
|
||||
"description": "Interfaces for modules",
|
||||
"support": {
|
||||
"issues": "https://github.com/Dhii/module-interface/issues",
|
||||
"source": "https://github.com/Dhii/module-interface/tree/v0.3.0-alpha2"
|
||||
},
|
||||
"time": "2021-08-23T08:23:01+00:00"
|
||||
},
|
||||
{
|
||||
"name": "psr/container",
|
||||
"version": "1.1.2",
|
||||
"source": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/php-fig/container.git",
|
||||
"reference": "513e0666f7216c7459170d56df27dfcefe1689ea"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://api.github.com/repos/php-fig/container/zipball/513e0666f7216c7459170d56df27dfcefe1689ea",
|
||||
"reference": "513e0666f7216c7459170d56df27dfcefe1689ea",
|
||||
"shasum": ""
|
||||
},
|
||||
"require": {
|
||||
"php": ">=7.4.0"
|
||||
},
|
||||
"type": "library",
|
||||
"autoload": {
|
||||
"psr-4": {
|
||||
"Psr\\Container\\": "src/"
|
||||
}
|
||||
},
|
||||
"notification-url": "https://packagist.org/downloads/",
|
||||
"license": [
|
||||
"MIT"
|
||||
],
|
||||
"authors": [
|
||||
{
|
||||
"name": "PHP-FIG",
|
||||
"homepage": "https://www.php-fig.org/"
|
||||
}
|
||||
],
|
||||
"description": "Common Container Interface (PHP FIG PSR-11)",
|
||||
"homepage": "https://github.com/php-fig/container",
|
||||
"keywords": [
|
||||
"PSR-11",
|
||||
"container",
|
||||
"container-interface",
|
||||
"container-interop",
|
||||
"psr"
|
||||
],
|
||||
"support": {
|
||||
"issues": "https://github.com/php-fig/container/issues",
|
||||
"source": "https://github.com/php-fig/container/tree/1.1.2"
|
||||
},
|
||||
"time": "2021-11-05T16:50:12+00:00"
|
||||
}
|
||||
],
|
||||
"packages-dev": [],
|
||||
"aliases": [],
|
||||
"minimum-stability": "dev",
|
||||
"stability-flags": [],
|
||||
"prefer-stable": true,
|
||||
"prefer-lowest": false,
|
||||
"platform": {
|
||||
"php": "^7.2 | ^8.0"
|
||||
},
|
||||
"platform-dev": [],
|
||||
"plugin-api-version": "2.3.0"
|
||||
}
|
||||
|
|
@ -10,13 +10,16 @@
|
|||
"Edge >= 14"
|
||||
],
|
||||
"dependencies": {
|
||||
"core-js": "^3.25.0"
|
||||
"@paypal/react-paypal-js": "^8.2.0",
|
||||
"core-js": "^3.25.0",
|
||||
"react": "^17.0.0",
|
||||
"react-dom": "^17.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.19",
|
||||
"@babel/preset-env": "^7.19",
|
||||
"@babel/preset-react": "^7.18.6",
|
||||
"@woocommerce/dependency-extraction-webpack-plugin": "^2.2.0",
|
||||
"@woocommerce/dependency-extraction-webpack-plugin": "2.2.0",
|
||||
"babel-loader": "^8.2",
|
||||
"cross-env": "^7.0.3",
|
||||
"file-loader": "^6.2.0",
|
||||
|
|
|
|||
|
|
@ -1,29 +0,0 @@
|
|||
import { useRef, useEffect } from '@wordpress/element';
|
||||
|
||||
export default function PayPalMessages({
|
||||
amount,
|
||||
style,
|
||||
onRender,
|
||||
}) {
|
||||
const containerRef = useRef(null);
|
||||
|
||||
useEffect(() => {
|
||||
const messages = paypal.Messages({
|
||||
amount,
|
||||
style,
|
||||
onRender,
|
||||
});
|
||||
|
||||
messages.render(containerRef.current)
|
||||
.catch(err => {
|
||||
// Ignore when component destroyed.
|
||||
if (!containerRef.current || containerRef.current.children.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
console.error(err);
|
||||
});
|
||||
}, [amount, style, onRender]);
|
||||
|
||||
return <div ref={containerRef}/>
|
||||
}
|
||||
|
|
@ -2,221 +2,505 @@ import { __ } from '@wordpress/i18n';
|
|||
import { useState, useEffect } from '@wordpress/element';
|
||||
import { InspectorControls, useBlockProps } from '@wordpress/block-editor';
|
||||
import { PanelBody, SelectControl, Spinner } from '@wordpress/components';
|
||||
import { useScriptParams } from "./hooks/script-params";
|
||||
import { loadPaypalScript } from '../../../ppcp-button/resources/js/modules/Helper/ScriptLoading'
|
||||
import PayPalMessages from "./components/PayPalMessages";
|
||||
import { PayPalScriptProvider, PayPalMessages } from '@paypal/react-paypal-js';
|
||||
import { useScriptParams } from './hooks/script-params';
|
||||
|
||||
export default function Edit( { attributes, clientId, setAttributes } ) {
|
||||
const { layout, logo, position, color, size, flexColor, flexRatio, placement, id } = attributes;
|
||||
const isFlex = layout === 'flex';
|
||||
const {
|
||||
layout,
|
||||
logo,
|
||||
position,
|
||||
color,
|
||||
size,
|
||||
flexColor,
|
||||
flexRatio,
|
||||
placement,
|
||||
id,
|
||||
} = attributes;
|
||||
const isFlex = layout === 'flex';
|
||||
|
||||
const [paypalScriptState, setPaypalScriptState] = useState(null);
|
||||
const [ loaded, setLoaded ] = useState( false );
|
||||
|
||||
const [rendered, setRendered] = useState(false);
|
||||
let amount;
|
||||
const postContent = String(
|
||||
wp.data.select( 'core/editor' )?.getEditedPostContent()
|
||||
);
|
||||
if (
|
||||
postContent.includes( 'woocommerce/checkout' ) ||
|
||||
postContent.includes( 'woocommerce/cart' )
|
||||
) {
|
||||
amount = 50.0;
|
||||
}
|
||||
|
||||
let amount = undefined;
|
||||
const postContent = String(wp.data.select('core/editor')?.getEditedPostContent());
|
||||
if (postContent.includes('woocommerce/checkout') || postContent.includes('woocommerce/cart')) {
|
||||
amount = 50.0;
|
||||
}
|
||||
const previewStyle = {
|
||||
layout,
|
||||
logo: {
|
||||
position,
|
||||
type: logo,
|
||||
},
|
||||
color: flexColor,
|
||||
ratio: flexRatio,
|
||||
text: {
|
||||
color,
|
||||
size,
|
||||
},
|
||||
};
|
||||
|
||||
const previewStyle = {
|
||||
layout,
|
||||
logo: {
|
||||
position,
|
||||
type: logo,
|
||||
},
|
||||
color: flexColor,
|
||||
ratio: flexRatio,
|
||||
text: {
|
||||
color,
|
||||
size
|
||||
},
|
||||
};
|
||||
const classes = [ 'ppcp-paylater-block-preview', 'ppcp-overlay-parent' ];
|
||||
if (
|
||||
PcpPayLaterBlock.vaultingEnabled ||
|
||||
! PcpPayLaterBlock.placementEnabled
|
||||
) {
|
||||
classes.push( 'ppcp-paylater-unavailable', 'block-editor-warning' );
|
||||
}
|
||||
const props = useBlockProps( { className: classes.join( ' ' ) } );
|
||||
|
||||
let classes = ['ppcp-paylater-block-preview', 'ppcp-overlay-parent'];
|
||||
if (PcpPayLaterBlock.vaultingEnabled || !PcpPayLaterBlock.placementEnabled) {
|
||||
classes = ['ppcp-paylater-block-preview', 'ppcp-paylater-unavailable', 'block-editor-warning'];
|
||||
}
|
||||
const props = useBlockProps({className: classes});
|
||||
useEffect( () => {
|
||||
if ( ! id ) {
|
||||
setAttributes( { id: `ppcp-${ clientId }` } );
|
||||
}
|
||||
}, [ id, clientId ] );
|
||||
|
||||
const loadingElement = <div {...props}><Spinner/></div>;
|
||||
if ( PcpPayLaterBlock.vaultingEnabled ) {
|
||||
return (
|
||||
<div { ...props }>
|
||||
<div className="block-editor-warning__contents">
|
||||
<p className="block-editor-warning__message">
|
||||
{ __(
|
||||
'Pay Later Messaging cannot be used while PayPal Vaulting is active. Disable PayPal Vaulting in the PayPal Payment settings to reactivate this block',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
</p>
|
||||
<div className="block-editor-warning__actions">
|
||||
<span className="block-editor-warning__action">
|
||||
<a href={ PcpPayLaterBlock.payLaterSettingsUrl }>
|
||||
<button
|
||||
type="button"
|
||||
className="components-button is-primary"
|
||||
>
|
||||
{ __(
|
||||
'PayPal Payments Settings',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
<span className="block-editor-warning__action">
|
||||
<button
|
||||
onClick={ () =>
|
||||
wp.data
|
||||
.dispatch( 'core/block-editor' )
|
||||
.removeBlock( clientId )
|
||||
}
|
||||
type="button"
|
||||
className="components-button is-secondary"
|
||||
>
|
||||
{ __(
|
||||
'Remove Block',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (!id) {
|
||||
setAttributes({id: 'ppcp-' + clientId});
|
||||
}
|
||||
}, []);
|
||||
if ( ! PcpPayLaterBlock.placementEnabled ) {
|
||||
return (
|
||||
<div { ...props }>
|
||||
<div className="block-editor-warning__contents">
|
||||
<p className="block-editor-warning__message">
|
||||
{ __(
|
||||
'Pay Later Messaging cannot be used while the “WooCommerce Block” messaging placement is disabled. Enable the placement in the PayPal Payments Pay Later settings to reactivate this block.',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
</p>
|
||||
<div className="block-editor-warning__actions">
|
||||
<span className="block-editor-warning__action">
|
||||
<a href={ PcpPayLaterBlock.payLaterSettingsUrl }>
|
||||
<button
|
||||
type="button"
|
||||
className="components-button is-primary"
|
||||
>
|
||||
{ __(
|
||||
'PayPal Payments Settings',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
</button>
|
||||
</a>
|
||||
</span>
|
||||
<span className="block-editor-warning__action">
|
||||
<button
|
||||
onClick={ () =>
|
||||
wp.data
|
||||
.dispatch( 'core/block-editor' )
|
||||
.removeBlock( clientId )
|
||||
}
|
||||
type="button"
|
||||
className="components-button is-secondary"
|
||||
>
|
||||
{ __(
|
||||
'Remove Block',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (PcpPayLaterBlock.vaultingEnabled) {
|
||||
return <div {...props}>
|
||||
<div className={'block-editor-warning__contents'}>
|
||||
<h3>{__('PayPal Pay Later Messaging', 'woocommerce-paypal-payments')}</h3>
|
||||
<p className={'block-editor-warning__message'}>{__('Pay Later Messaging cannot be used while PayPal Vaulting is active. Disable PayPal Vaulting in the PayPal Payment settings to reactivate this block', 'woocommerce-paypal-payments')}</p>
|
||||
<div className={'class="block-editor-warning__actions"'}>
|
||||
<span className={'block-editor-warning__action'}>
|
||||
<a href={PcpPayLaterBlock.settingsUrl} className={'components-button is-primary'}>
|
||||
{__('PayPal Payments Settings', 'woocommerce-paypal-payments')}
|
||||
</a>
|
||||
</span>
|
||||
<span className={'block-editor-warning__action'}>
|
||||
<button onClick={() => wp.data.dispatch( 'core/block-editor' ).removeBlock(clientId)} type={'button'} className={'components-button is-secondary'}>
|
||||
{__('Remove Block', 'woocommerce-paypal-payments')}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
const scriptParams = useScriptParams(
|
||||
PcpPayLaterBlock.ajax.cart_script_params
|
||||
);
|
||||
|
||||
if (!PcpPayLaterBlock.placementEnabled) {
|
||||
return <div {...props}>
|
||||
<div className={'block-editor-warning__contents'}>
|
||||
<h3>{__('PayPal Pay Later Messaging', 'woocommerce-paypal-payments')}</h3>
|
||||
<p className={'block-editor-warning__message'}>{__('Pay Later Messaging cannot be used while the “WooCommerce Block” messaging placement is disabled. Enable the placement in the PayPal Payments Pay Later settings to reactivate this block.', 'woocommerce-paypal-payments')}</p>
|
||||
<div className={'class="block-editor-warning__actions"'}>
|
||||
<span className={'block-editor-warning__action'}>
|
||||
<a href={PcpPayLaterBlock.payLaterSettingsUrl} className={'components-button is-primary'}>
|
||||
{__('PayPal Payments Settings', 'woocommerce-paypal-payments')}
|
||||
</a>
|
||||
</span>
|
||||
<span className={'block-editor-warning__action'}>
|
||||
<button onClick={() => wp.data.dispatch( 'core/block-editor' ).removeBlock(clientId)} type={'button'} className={'components-button is-secondary'}>
|
||||
{__('Remove Block', 'woocommerce-paypal-payments')}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
if ( scriptParams === null ) {
|
||||
return (
|
||||
<div { ...props }>
|
||||
<Spinner />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
let scriptParams = useScriptParams(PcpPayLaterBlock.ajax.cart_script_params);
|
||||
if (scriptParams === null) {
|
||||
return loadingElement;
|
||||
}
|
||||
if (scriptParams === false) {
|
||||
scriptParams = {
|
||||
url_params: {
|
||||
clientId: 'test',
|
||||
}
|
||||
}
|
||||
}
|
||||
scriptParams.url_params.components = 'messages,buttons,funding-eligibility';
|
||||
|
||||
if (!paypalScriptState) {
|
||||
loadPaypalScript(scriptParams, () => {
|
||||
setPaypalScriptState('loaded')
|
||||
}, () => {
|
||||
setPaypalScriptState('failed')
|
||||
});
|
||||
}
|
||||
if (paypalScriptState !== 'loaded') {
|
||||
return loadingElement;
|
||||
}
|
||||
const urlParams = {
|
||||
...scriptParams.url_params,
|
||||
components: 'messages',
|
||||
dataNamespace: 'ppcp-block-editor-paylater-message',
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<InspectorControls>
|
||||
<PanelBody title={ __( 'Settings', 'woocommerce-paypal-payments' ) }>
|
||||
<SelectControl
|
||||
label={ __( 'Layout', 'woocommerce-paypal-payments' ) }
|
||||
options={ [
|
||||
{ label: __( 'Text', 'woocommerce-paypal-payments' ), value: 'text' },
|
||||
{ label: __( 'Banner', 'woocommerce-paypal-payments' ), value: 'flex' },
|
||||
] }
|
||||
value={ layout }
|
||||
onChange={ ( value ) => setAttributes( { layout: value } ) }
|
||||
/>
|
||||
{ !isFlex && (<SelectControl
|
||||
label={__('Logo', 'woocommerce-paypal-payments')}
|
||||
options={[
|
||||
{ label: __('Full logo', 'woocommerce-paypal-payments'), value: 'primary' },
|
||||
{ label: __('Monogram', 'woocommerce-paypal-payments'), value: 'alternative' },
|
||||
{ label: __('Inline', 'woocommerce-paypal-payments'), value: 'inline' },
|
||||
{ label: __('Message only', 'woocommerce-paypal-payments'), value: 'none' },
|
||||
]}
|
||||
value={logo}
|
||||
onChange={(value) => setAttributes({logo: value})}
|
||||
/>)}
|
||||
{ !isFlex && logo === 'primary' && (<SelectControl
|
||||
label={__('Logo Position', 'woocommerce-paypal-payments')}
|
||||
options={[
|
||||
{ label: __( 'Left', 'woocommerce-paypal-payments' ), value: 'left' },
|
||||
{ label: __( 'Right', 'woocommerce-paypal-payments' ), value: 'right' },
|
||||
{ label: __( 'Top', 'woocommerce-paypal-payments' ), value: 'top' },
|
||||
]}
|
||||
value={position}
|
||||
onChange={(value) => setAttributes({position: value})}
|
||||
/>)}
|
||||
{ !isFlex && (<SelectControl
|
||||
label={__('Text Color', 'woocommerce-paypal-payments')}
|
||||
options={[
|
||||
{ label: __( 'Black / Blue logo', 'woocommerce-paypal-payments' ), value: 'black' },
|
||||
{ label: __( 'White / White logo', 'woocommerce-paypal-payments' ), value: 'white' },
|
||||
{ label: __( 'Monochrome', 'woocommerce-paypal-payments' ), value: 'monochrome' },
|
||||
{ label: __( 'Black / Gray logo', 'woocommerce-paypal-payments' ), value: 'grayscale' },
|
||||
]}
|
||||
value={color}
|
||||
onChange={(value) => setAttributes({color: value})}
|
||||
/>)}
|
||||
{ !isFlex && (<SelectControl
|
||||
label={__('Text Size', 'woocommerce-paypal-payments')}
|
||||
options={[
|
||||
{ label: __( 'Small', 'woocommerce-paypal-payments' ), value: '12' },
|
||||
{ label: __( 'Medium', 'woocommerce-paypal-payments' ), value: '14' },
|
||||
{ label: __( 'Large', 'woocommerce-paypal-payments' ), value: '16' },
|
||||
]}
|
||||
value={size}
|
||||
onChange={(value) => setAttributes({size: value})}
|
||||
/>)}
|
||||
{ isFlex && (<SelectControl
|
||||
label={__('Color', 'woocommerce-paypal-payments')}
|
||||
options={[
|
||||
{ label: __( 'Blue', 'woocommerce-paypal-payments' ), value: 'blue' },
|
||||
{ label: __( 'Black', 'woocommerce-paypal-payments' ), value: 'black' },
|
||||
{ label: __( 'White', 'woocommerce-paypal-payments' ), value: 'white' },
|
||||
{ label: __( 'White (no border)', 'woocommerce-paypal-payments' ), value: 'white-no-border' },
|
||||
]}
|
||||
value={flexColor}
|
||||
onChange={(value) => setAttributes({flexColor: value})}
|
||||
/>)}
|
||||
{ isFlex && (<SelectControl
|
||||
label={__('Ratio', 'woocommerce-paypal-payments')}
|
||||
options={[
|
||||
{ label: __( '8x1', 'woocommerce-paypal-payments' ), value: '8x1' },
|
||||
{ label: __( '20x1', 'woocommerce-paypal-payments' ), value: '20x1' },
|
||||
]}
|
||||
value={flexRatio}
|
||||
onChange={(value) => setAttributes({flexRatio: value})}
|
||||
/>)}
|
||||
<SelectControl
|
||||
label={ __( 'Placement page', 'woocommerce-paypal-payments' ) }
|
||||
help={ __( 'Used for the analytics dashboard in the merchant account.', 'woocommerce-paypal-payments' ) }
|
||||
options={ [
|
||||
{ label: __( 'Detect automatically', 'woocommerce-paypal-payments' ), value: 'auto' },
|
||||
{ label: __( 'Product Page', 'woocommerce-paypal-payments' ), value: 'product' },
|
||||
{ label: __( 'Cart', 'woocommerce-paypal-payments' ), value: 'cart' },
|
||||
{ label: __( 'Checkout', 'woocommerce-paypal-payments' ), value: 'checkout' },
|
||||
{ label: __( 'Home', 'woocommerce-paypal-payments' ), value: 'home' },
|
||||
{ label: __( 'Shop', 'woocommerce-paypal-payments' ), value: 'shop' },
|
||||
] }
|
||||
value={ placement }
|
||||
onChange={ ( value ) => setAttributes( { placement: value } ) }
|
||||
/>
|
||||
<PanelBody
|
||||
title={ __( 'Settings', 'woocommerce-paypal-payments' ) }
|
||||
>
|
||||
<SelectControl
|
||||
label={ __( 'Layout', 'woocommerce-paypal-payments' ) }
|
||||
options={ [
|
||||
{
|
||||
label: __(
|
||||
'Text',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'text',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Banner',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'flex',
|
||||
},
|
||||
] }
|
||||
value={ layout }
|
||||
onChange={ ( value ) =>
|
||||
setAttributes( { layout: value } )
|
||||
}
|
||||
/>
|
||||
{ ! isFlex && (
|
||||
<SelectControl
|
||||
label={ __(
|
||||
'Logo',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
options={ [
|
||||
{
|
||||
label: __(
|
||||
'Full logo',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'primary',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Monogram',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'alternative',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Inline',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'inline',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Message only',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'none',
|
||||
},
|
||||
] }
|
||||
value={ logo }
|
||||
onChange={ ( value ) =>
|
||||
setAttributes( { logo: value } )
|
||||
}
|
||||
/>
|
||||
) }
|
||||
{ ! isFlex && logo === 'primary' && (
|
||||
<SelectControl
|
||||
label={ __(
|
||||
'Logo Position',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
options={ [
|
||||
{
|
||||
label: __(
|
||||
'Left',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'left',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Right',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'right',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Top',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'top',
|
||||
},
|
||||
] }
|
||||
value={ position }
|
||||
onChange={ ( value ) =>
|
||||
setAttributes( { position: value } )
|
||||
}
|
||||
/>
|
||||
) }
|
||||
{ ! isFlex && (
|
||||
<SelectControl
|
||||
label={ __(
|
||||
'Text Color',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
options={ [
|
||||
{
|
||||
label: __(
|
||||
'Black / Blue logo',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'black',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'White / White logo',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'white',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Monochrome',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'monochrome',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Black / Gray logo',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'grayscale',
|
||||
},
|
||||
] }
|
||||
value={ color }
|
||||
onChange={ ( value ) =>
|
||||
setAttributes( { color: value } )
|
||||
}
|
||||
/>
|
||||
) }
|
||||
{ ! isFlex && (
|
||||
<SelectControl
|
||||
label={ __(
|
||||
'Text Size',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
options={ [
|
||||
{
|
||||
label: __(
|
||||
'Small',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: '12',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Medium',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: '14',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Large',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: '16',
|
||||
},
|
||||
] }
|
||||
value={ size }
|
||||
onChange={ ( value ) =>
|
||||
setAttributes( { size: value } )
|
||||
}
|
||||
/>
|
||||
) }
|
||||
{ isFlex && (
|
||||
<SelectControl
|
||||
label={ __(
|
||||
'Color',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
options={ [
|
||||
{
|
||||
label: __(
|
||||
'Blue',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'blue',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Black',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'black',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'White',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'white',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'White (no border)',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'white-no-border',
|
||||
},
|
||||
] }
|
||||
value={ flexColor }
|
||||
onChange={ ( value ) =>
|
||||
setAttributes( { flexColor: value } )
|
||||
}
|
||||
/>
|
||||
) }
|
||||
{ isFlex && (
|
||||
<SelectControl
|
||||
label={ __(
|
||||
'Ratio',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
options={ [
|
||||
{
|
||||
label: __(
|
||||
'8x1',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: '8x1',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'20x1',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: '20x1',
|
||||
},
|
||||
] }
|
||||
value={ flexRatio }
|
||||
onChange={ ( value ) =>
|
||||
setAttributes( { flexRatio: value } )
|
||||
}
|
||||
/>
|
||||
) }
|
||||
<SelectControl
|
||||
label={ __(
|
||||
'Placement page',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
help={ __(
|
||||
'Used for the analytics dashboard in the merchant account.',
|
||||
'woocommerce-paypal-payments'
|
||||
) }
|
||||
options={ [
|
||||
{
|
||||
label: __(
|
||||
'Detect automatically',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'auto',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Product Page',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'product',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Cart',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'cart',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Checkout',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'checkout',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Home',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'home',
|
||||
},
|
||||
{
|
||||
label: __(
|
||||
'Shop',
|
||||
'woocommerce-paypal-payments'
|
||||
),
|
||||
value: 'shop',
|
||||
},
|
||||
] }
|
||||
value={ placement }
|
||||
onChange={ ( value ) =>
|
||||
setAttributes( { placement: value } )
|
||||
}
|
||||
/>
|
||||
</PanelBody>
|
||||
</InspectorControls>
|
||||
<div {...props}>
|
||||
<div className={'ppcp-overlay-child'}>
|
||||
<PayPalMessages
|
||||
style={previewStyle}
|
||||
amount={amount}
|
||||
onRender={() => setRendered(true)}
|
||||
/>
|
||||
</div>
|
||||
<div className={'ppcp-overlay-child ppcp-unclicable-overlay'}> {/* make the message not clickable */}
|
||||
{!rendered && (<Spinner/>)}
|
||||
</div>
|
||||
</div>
|
||||
<div { ...props }>
|
||||
<div className="ppcp-overlay-child">
|
||||
<PayPalScriptProvider options={ urlParams }>
|
||||
<PayPalMessages
|
||||
style={ previewStyle }
|
||||
forceReRender={ [ previewStyle ] }
|
||||
onRender={ () => setLoaded( true ) }
|
||||
amount={ amount }
|
||||
/>
|
||||
</PayPalScriptProvider>
|
||||
</div>
|
||||
<div className="ppcp-overlay-child ppcp-unclicable-overlay">
|
||||
{ ' ' }
|
||||
{ /* make the message not clickable */ }
|
||||
{ ! loaded && <Spinner /> }
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,24 +1,24 @@
|
|||
import { useState, useEffect } from '@wordpress/element';
|
||||
|
||||
export const useScriptParams = (requestConfig) => {
|
||||
const [data, setData] = useState(null);
|
||||
export const useScriptParams = ( requestConfig ) => {
|
||||
const [ data, setData ] = useState( null );
|
||||
|
||||
useEffect(() => {
|
||||
(async () => {
|
||||
try {
|
||||
const response = await fetch(requestConfig.endpoint);
|
||||
const json = await response.json();
|
||||
if (json.success && json?.data?.url_params) {
|
||||
setData(json.data);
|
||||
} else {
|
||||
setData(false);
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
setData(false);
|
||||
}
|
||||
})();
|
||||
}, [requestConfig]);
|
||||
useEffect( () => {
|
||||
( async () => {
|
||||
try {
|
||||
const response = await fetch( requestConfig.endpoint );
|
||||
const json = await response.json();
|
||||
if ( json.success && json?.data?.url_params ) {
|
||||
setData( json.data );
|
||||
} else {
|
||||
setData( false );
|
||||
}
|
||||
} catch ( e ) {
|
||||
console.error( e );
|
||||
setData( false );
|
||||
}
|
||||
} )();
|
||||
}, [ requestConfig ] );
|
||||
|
||||
return data;
|
||||
return data;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,36 +1,47 @@
|
|||
import { registerBlockType } from '@wordpress/blocks';
|
||||
|
||||
import Edit from './edit';
|
||||
import save from './save';
|
||||
|
||||
const paypalIcon = (
|
||||
<svg width="584.798" height="720" viewBox="0 0 154.728 190.5">
|
||||
<g transform="translate(898.192 276.071)">
|
||||
<path clipPath="none" d="M-837.663-237.968a5.49 5.49 0 0 0-5.423 4.633l-9.013 57.15-8.281 52.514-.005.044.01-.044 8.281-52.514c.421-2.669 2.719-4.633 5.42-4.633h26.404c26.573 0 49.127-19.387 53.246-45.658.314-1.996.482-3.973.52-5.924v-.003h-.003c-6.753-3.543-14.683-5.565-23.372-5.565z" fill="#001c64"/>
|
||||
<path clipPath="none" d="M-766.506-232.402c-.037 1.951-.207 3.93-.52 5.926-4.119 26.271-26.673 45.658-53.246 45.658h-26.404c-2.701 0-4.999 1.964-5.42 4.633l-8.281 52.514-5.197 32.947a4.46 4.46 0 0 0 4.405 5.153h28.66a5.49 5.49 0 0 0 5.423-4.633l7.55-47.881c.423-2.669 2.722-4.636 5.423-4.636h16.876c26.573 0 49.124-19.386 53.243-45.655 2.924-18.649-6.46-35.614-22.511-44.026z" fill="#0070e0"/>
|
||||
<path clipPath="none" d="M-870.225-276.071a5.49 5.49 0 0 0-5.423 4.636l-22.489 142.608a4.46 4.46 0 0 0 4.405 5.156h33.351l8.281-52.514 9.013-57.15a5.49 5.49 0 0 1 5.423-4.633h47.782c8.691 0 16.621 2.025 23.375 5.563.46-23.917-19.275-43.666-46.412-43.666z" fill="#003087"/>
|
||||
</g>
|
||||
</svg>
|
||||
)
|
||||
<svg width="584.798" height="720" viewBox="0 0 154.728 190.5">
|
||||
<g transform="translate(898.192 276.071)">
|
||||
<path
|
||||
clipPath="none"
|
||||
d="M-837.663-237.968a5.49 5.49 0 0 0-5.423 4.633l-9.013 57.15-8.281 52.514-.005.044.01-.044 8.281-52.514c.421-2.669 2.719-4.633 5.42-4.633h26.404c26.573 0 49.127-19.387 53.246-45.658.314-1.996.482-3.973.52-5.924v-.003h-.003c-6.753-3.543-14.683-5.565-23.372-5.565z"
|
||||
fill="#001c64"
|
||||
/>
|
||||
<path
|
||||
clipPath="none"
|
||||
d="M-766.506-232.402c-.037 1.951-.207 3.93-.52 5.926-4.119 26.271-26.673 45.658-53.246 45.658h-26.404c-2.701 0-4.999 1.964-5.42 4.633l-8.281 52.514-5.197 32.947a4.46 4.46 0 0 0 4.405 5.153h28.66a5.49 5.49 0 0 0 5.423-4.633l7.55-47.881c.423-2.669 2.722-4.636 5.423-4.636h16.876c26.573 0 49.124-19.386 53.243-45.655 2.924-18.649-6.46-35.614-22.511-44.026z"
|
||||
fill="#0070e0"
|
||||
/>
|
||||
<path
|
||||
clipPath="none"
|
||||
d="M-870.225-276.071a5.49 5.49 0 0 0-5.423 4.636l-22.489 142.608a4.46 4.46 0 0 0 4.405 5.156h33.351l8.281-52.514 9.013-57.15a5.49 5.49 0 0 1 5.423-4.633h47.782c8.691 0 16.621 2.025 23.375 5.563.46-23.917-19.275-43.666-46.412-43.666z"
|
||||
fill="#003087"
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
|
||||
const blockId = 'woocommerce-paypal-payments/paylater-messages';
|
||||
|
||||
registerBlockType( blockId, {
|
||||
icon: paypalIcon,
|
||||
edit: Edit,
|
||||
save,
|
||||
icon: paypalIcon,
|
||||
edit: Edit,
|
||||
save() {
|
||||
return null;
|
||||
},
|
||||
} );
|
||||
|
||||
document.addEventListener( 'DOMContentLoaded', () => {
|
||||
const { registerCheckoutFilters } = window.wc.blocksCheckout;
|
||||
const { registerCheckoutFilters } = window.wc.blocksCheckout;
|
||||
|
||||
// allow to add this block inside WC cart/checkout blocks
|
||||
registerCheckoutFilters( blockId, {
|
||||
additionalCartCheckoutInnerBlockTypes: (
|
||||
defaultValue
|
||||
) => {
|
||||
defaultValue.push( blockId );
|
||||
return defaultValue;
|
||||
},
|
||||
} );
|
||||
// allow to add this block inside WC cart/checkout blocks
|
||||
registerCheckoutFilters( blockId, {
|
||||
additionalCartCheckoutInnerBlockTypes: ( defaultValue ) => {
|
||||
defaultValue.push( blockId );
|
||||
return defaultValue;
|
||||
},
|
||||
} );
|
||||
} );
|
||||
|
|
|
|||
|
|
@ -1,26 +0,0 @@
|
|||
import { useBlockProps } from '@wordpress/block-editor';
|
||||
|
||||
export default function save( { attributes } ) {
|
||||
const { layout, logo, position, color, size, flexColor, flexRatio, placement, id } = attributes;
|
||||
const paypalAttributes = layout === 'flex' ? {
|
||||
'data-pp-style-layout': 'flex',
|
||||
'data-pp-style-color': flexColor,
|
||||
'data-pp-style-ratio': flexRatio,
|
||||
} : {
|
||||
'data-pp-style-layout': 'text',
|
||||
'data-pp-style-logo-type': logo,
|
||||
'data-pp-style-logo-position': position,
|
||||
'data-pp-style-text-color': color,
|
||||
'data-pp-style-text-size': size,
|
||||
};
|
||||
if (placement && placement !== 'auto') {
|
||||
paypalAttributes['data-pp-placement'] = placement;
|
||||
}
|
||||
const props = {
|
||||
className: 'ppcp-paylater-message-block',
|
||||
id,
|
||||
...paypalAttributes,
|
||||
};
|
||||
|
||||
return <div { ...useBlockProps.save(props) }></div>;
|
||||
}
|
||||
|
|
@ -9,10 +9,11 @@ declare(strict_types=1);
|
|||
|
||||
namespace WooCommerce\PayPalCommerce\PayLaterBlock;
|
||||
|
||||
use WooCommerce\PayPalCommerce\PayLaterBlock\PayLaterBlockRenderer;
|
||||
use WooCommerce\PayPalCommerce\Vendor\Psr\Container\ContainerInterface;
|
||||
|
||||
return array(
|
||||
'paylater-block.url' => static function ( ContainerInterface $container ): string {
|
||||
'paylater-block.url' => static function ( ContainerInterface $container ): string {
|
||||
/**
|
||||
* Cannot return false for this path.
|
||||
*
|
||||
|
|
@ -23,4 +24,7 @@ return array(
|
|||
dirname( realpath( __FILE__ ), 3 ) . '/woocommerce-paypal-payments.php'
|
||||
);
|
||||
},
|
||||
'paylater-block.renderer' => static function (): PayLaterBlockRenderer {
|
||||
return new PayLaterBlockRenderer();
|
||||
},
|
||||
);
|
||||
|
|
|
|||
|
|
@ -106,7 +106,23 @@ class PayLaterBlockModule implements ServiceModule, ExtendingModule, ExecutableM
|
|||
*
|
||||
* @psalm-suppress PossiblyFalseArgument
|
||||
*/
|
||||
register_block_type( dirname( realpath( __FILE__ ), 2 ) );
|
||||
register_block_type(
|
||||
dirname( realpath( __FILE__ ), 2 ),
|
||||
array(
|
||||
'render_callback' => function ( array $attributes ) use ( $c ) {
|
||||
$renderer = $c->get( 'paylater-block.renderer' );
|
||||
ob_start();
|
||||
// phpcs:ignore -- No need to escape it, the PayLaterBlockRenderer class is responsible for escaping.
|
||||
echo $renderer->render(
|
||||
// phpcs:ignore
|
||||
$attributes,
|
||||
// phpcs:ignore
|
||||
$c
|
||||
);
|
||||
return ob_get_clean();
|
||||
},
|
||||
)
|
||||
);
|
||||
},
|
||||
20
|
||||
);
|
||||
|
|
|
|||
67
modules/ppcp-paylater-block/src/PayLaterBlockRenderer.php
Normal file
67
modules/ppcp-paylater-block/src/PayLaterBlockRenderer.php
Normal file
|
|
@ -0,0 +1,67 @@
|
|||
<?php
|
||||
/**
|
||||
* Defines the PayLaterBlockRenderer class.
|
||||
*
|
||||
* This file is responsible for rendering the Pay Later Messaging block.
|
||||
*
|
||||
* @package WooCommerce\PayPalCommerce\PayLaterBlock
|
||||
*/
|
||||
|
||||
declare(strict_types=1);
|
||||
|
||||
namespace WooCommerce\PayPalCommerce\PayLaterBlock;
|
||||
|
||||
use WooCommerce\PayPalCommerce\Vendor\Psr\Container\ContainerInterface;
|
||||
|
||||
/**
|
||||
* Class PayLaterBlockRenderer
|
||||
*/
|
||||
class PayLaterBlockRenderer {
|
||||
|
||||
/**
|
||||
* Renders the Pay Later Messaging block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param ContainerInterface $c The container.
|
||||
* @return string The rendered HTML.
|
||||
*/
|
||||
public function render( array $attributes, ContainerInterface $c ): string {
|
||||
if ( PayLaterBlockModule::is_block_enabled( $c->get( 'wcgateway.settings.status' ) ) ) {
|
||||
|
||||
$bn_code = PPCP_PAYPAL_BN_CODE;
|
||||
|
||||
$html = '<div id="' . esc_attr( $attributes['id'] ?? '' ) . '" class="ppcp-messages" data-partner-attribution-id="' . esc_attr( $bn_code ) . '"></div>';
|
||||
|
||||
$processor = new \WP_HTML_Tag_Processor( $html );
|
||||
|
||||
if ( $processor->next_tag( 'div' ) ) {
|
||||
$layout = $attributes['layout'] ?? 'text';
|
||||
|
||||
if ( 'flex' === $layout ) {
|
||||
$processor->set_attribute( 'data-pp-style-layout', 'flex' );
|
||||
$processor->set_attribute( 'data-pp-style-color', esc_attr( $attributes['flexColor'] ?? '' ) );
|
||||
$processor->set_attribute( 'data-pp-style-ratio', esc_attr( $attributes['flexRatio'] ?? '' ) );
|
||||
} else {
|
||||
$processor->set_attribute( 'data-pp-style-layout', 'text' );
|
||||
$processor->set_attribute( 'data-pp-style-logo-type', esc_attr( $attributes['logo'] ?? '' ) );
|
||||
$processor->set_attribute( 'data-pp-style-logo-position', esc_attr( $attributes['position'] ?? '' ) );
|
||||
$processor->set_attribute( 'data-pp-style-text-color', esc_attr( $attributes['color'] ?? '' ) );
|
||||
$processor->set_attribute( 'data-pp-style-text-size', esc_attr( $attributes['size'] ?? '' ) );
|
||||
}
|
||||
|
||||
if ( ( $attributes['placement'] ?? 'auto' ) !== 'auto' ) {
|
||||
$processor->set_attribute( 'data-pp-placement', esc_attr( $attributes['placement'] ) );
|
||||
}
|
||||
}
|
||||
|
||||
$updated_html = $processor->get_updated_html();
|
||||
|
||||
return sprintf(
|
||||
'<div id="ppcp-paylater-message-block" %1$s>%2$s</div>',
|
||||
wp_kses_data( get_block_wrapper_attributes() ),
|
||||
$updated_html
|
||||
);
|
||||
}
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
|
@ -1005,6 +1005,28 @@
|
|||
"@jridgewell/resolve-uri" "3.1.0"
|
||||
"@jridgewell/sourcemap-codec" "1.4.14"
|
||||
|
||||
"@paypal/paypal-js@^8.0.4":
|
||||
version "8.0.4"
|
||||
resolved "https://registry.yarnpkg.com/@paypal/paypal-js/-/paypal-js-8.0.4.tgz#abe9f40f519b1d2c306adddfbe733be03eb26ce5"
|
||||
integrity sha512-91g5fhRBHGEBoikDzQT6uBn3PzlJQ75g0c3MvqVJqN0XRm5kHa9wz+6+Uaq8QQuxRzz5C2x55Zg057CW6EuwpQ==
|
||||
dependencies:
|
||||
promise-polyfill "^8.3.0"
|
||||
|
||||
"@paypal/react-paypal-js@^8.2.0":
|
||||
version "8.2.0"
|
||||
resolved "https://registry.yarnpkg.com/@paypal/react-paypal-js/-/react-paypal-js-8.2.0.tgz#4b1a142bbb68e62dca4a92da4a6b5568f54901f0"
|
||||
integrity sha512-SworUfu0BNNcqoh0O53Ke4MFpx2m3qJRu3hayXvlluEEXJpKqGSV5aaSGFhbsZqi8hnbsx/hZR7BQbmqsggiGQ==
|
||||
dependencies:
|
||||
"@paypal/paypal-js" "^8.0.4"
|
||||
"@paypal/sdk-constants" "^1.0.122"
|
||||
|
||||
"@paypal/sdk-constants@^1.0.122":
|
||||
version "1.0.145"
|
||||
resolved "https://registry.yarnpkg.com/@paypal/sdk-constants/-/sdk-constants-1.0.145.tgz#f373cd3b7cf0409c28e121629b8f1855faf2e77b"
|
||||
integrity sha512-2tclrVX3L44YRJ09H4kkqma/UeAjRJarwH5SyPip10O5S+2ByE1HiyspAJ6hIWSjMngFVqjNyUCnrGcuQA3ldg==
|
||||
dependencies:
|
||||
hi-base32 "^0.5.0"
|
||||
|
||||
"@types/eslint-scope@^3.7.3":
|
||||
version "3.7.4"
|
||||
resolved "https://registry.yarnpkg.com/@types/eslint-scope/-/eslint-scope-3.7.4.tgz#37fc1223f0786c39627068a12e94d6e6fc61de16"
|
||||
|
|
@ -1179,7 +1201,7 @@
|
|||
resolved "https://registry.yarnpkg.com/@webpack-cli/serve/-/serve-1.7.0.tgz#e1993689ac42d2b16e9194376cfb6753f6254db1"
|
||||
integrity sha512-oxnCNGj88fL+xzV+dacXs44HcDwf1ovs3AuEzvP7mqXw7fQntqIhQ1BRmynh4qEKQSSSRSWVyXRjmTbZIX9V2Q==
|
||||
|
||||
"@woocommerce/dependency-extraction-webpack-plugin@^2.2.0":
|
||||
"@woocommerce/dependency-extraction-webpack-plugin@2.2.0":
|
||||
version "2.2.0"
|
||||
resolved "https://registry.yarnpkg.com/@woocommerce/dependency-extraction-webpack-plugin/-/dependency-extraction-webpack-plugin-2.2.0.tgz#230d674a67585bc32e31bc28485bec99b41dbd1f"
|
||||
integrity sha512-0wDY3EIUwWrPm0KrWvt1cf2SZDSX7CzBXvv4TyCqWOPuVPvC/ajyY8kD1HTFI80q6/RHoxWf3BYCmhuBzPbe9A==
|
||||
|
|
@ -1599,6 +1621,11 @@ has@^1.0.3:
|
|||
dependencies:
|
||||
function-bind "^1.1.1"
|
||||
|
||||
hi-base32@^0.5.0:
|
||||
version "0.5.1"
|
||||
resolved "https://registry.yarnpkg.com/hi-base32/-/hi-base32-0.5.1.tgz#1279f2ddae2673219ea5870c2121d2a33132857e"
|
||||
integrity sha512-EmBBpvdYh/4XxsnUybsPag6VikPYnN30td+vQk+GI3qpahVEG9+gTkG0aXVxTjBqQ5T6ijbWIu77O+C5WFWsnA==
|
||||
|
||||
immutable@^4.0.0:
|
||||
version "4.1.0"
|
||||
resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.1.0.tgz#f795787f0db780183307b9eb2091fcac1f6fafef"
|
||||
|
|
@ -1674,7 +1701,7 @@ jest-worker@^27.4.5:
|
|||
merge-stream "^2.0.0"
|
||||
supports-color "^8.0.0"
|
||||
|
||||
js-tokens@^4.0.0:
|
||||
"js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
|
||||
version "4.0.0"
|
||||
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
|
||||
integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
|
||||
|
|
@ -1745,6 +1772,13 @@ lodash.debounce@^4.0.8:
|
|||
resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af"
|
||||
integrity sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==
|
||||
|
||||
loose-envify@^1.1.0:
|
||||
version "1.4.0"
|
||||
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
|
||||
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
|
||||
dependencies:
|
||||
js-tokens "^3.0.0 || ^4.0.0"
|
||||
|
||||
make-dir@^3.0.2, make-dir@^3.1.0:
|
||||
version "3.1.0"
|
||||
resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.1.0.tgz#415e967046b3a7f1d185277d84aa58203726a13f"
|
||||
|
|
@ -1789,6 +1823,11 @@ normalize-path@^3.0.0, normalize-path@~3.0.0:
|
|||
resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65"
|
||||
integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
|
||||
|
||||
object-assign@^4.1.1:
|
||||
version "4.1.1"
|
||||
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
|
||||
integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==
|
||||
|
||||
p-limit@^2.2.0:
|
||||
version "2.3.0"
|
||||
resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.3.0.tgz#3dd33c647a214fdfffd835933eb086da0dc21db1"
|
||||
|
|
@ -1840,6 +1879,11 @@ pkg-dir@^4.1.0, pkg-dir@^4.2.0:
|
|||
dependencies:
|
||||
find-up "^4.0.0"
|
||||
|
||||
promise-polyfill@^8.3.0:
|
||||
version "8.3.0"
|
||||
resolved "https://registry.yarnpkg.com/promise-polyfill/-/promise-polyfill-8.3.0.tgz#9284810268138d103807b11f4e23d5e945a4db63"
|
||||
integrity sha512-H5oELycFml5yto/atYqmjyigJoAo3+OXwolYiH7OfQuYlAqhxNvTfiNMbV9hsC6Yp83yE5r2KTVmtrG6R9i6Pg==
|
||||
|
||||
punycode@^2.1.0:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
|
||||
|
|
@ -1852,6 +1896,23 @@ randombytes@^2.1.0:
|
|||
dependencies:
|
||||
safe-buffer "^5.1.0"
|
||||
|
||||
react-dom@^17.0.0:
|
||||
version "17.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23"
|
||||
integrity sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
scheduler "^0.20.2"
|
||||
|
||||
react@^17.0.0:
|
||||
version "17.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
|
||||
integrity sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
readdirp@~3.6.0:
|
||||
version "3.6.0"
|
||||
resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.6.0.tgz#74a370bd857116e245b29cc97340cd431a02a6c7"
|
||||
|
|
@ -1957,6 +2018,14 @@ sass@^1.42.1:
|
|||
immutable "^4.0.0"
|
||||
source-map-js ">=0.6.2 <2.0.0"
|
||||
|
||||
scheduler@^0.20.2:
|
||||
version "0.20.2"
|
||||
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.20.2.tgz#4baee39436e34aa93b4874bddcbf0fe8b8b50e91"
|
||||
integrity sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
schema-utils@^2.6.5:
|
||||
version "2.7.1"
|
||||
resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-2.7.1.tgz#1ca4f32d1b24c590c203b8e7a50bf0ea4cd394d7"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue
