@automattic/newspack-blocks 1.68.2 → 1.69.0-alpha.2

package/src/blocks/video-playlist/editor.scss

@@ -6,10 +6,7 @@
  */
 .wpbnbvp__overlay {
 	position: absolute;
-	top: 0;
-	bottom: 0;
-	left: 0;
-	right: 0;
+	inset: 0;
 }
 
 .wpbnbvp-preview {

package/src/modal-checkout/modal.js

@@ -25,7 +25,8 @@ function domReady( callback ) {
 	document.addEventListener( 'DOMContentLoaded', callback );
 }
 
-const triggers = '.wpbnbd.wpbnbd--platform-wc,.wp-block-newspack-blocks-checkout-button';
+const triggers =
+	'.wpbnbd.wpbnbd--platform-wc,.wp-block-newspack-blocks-checkout-button,.newspack-blocks-variation-modal';
 
 let iframeResizeObserver;
 
@@ -40,6 +41,9 @@ function closeCheckout( element ) {
 }
 
 domReady( () => {
+	/**
+	 * Initialize modal checkout.
+	 */
 	const modalCheckout = document.querySelector( '.newspack-blocks-checkout-modal' );
 	if ( ! modalCheckout ) {
 		return;
@@ -54,13 +58,64 @@ domReady( () => {
 	const iframe = document.createElement( 'iframe' );
 	iframe.name = iframeName;
 	modalContent.appendChild( iframe );
+	modalCheckout.addEventListener( 'click', ev => {
+		if ( ev.target === modalCheckout ) {
+			closeCheckout( modalCheckout );
+		}
+	} );
+	const closeButtons = modalCheckout.querySelectorAll( '.newspack-blocks-checkout-modal__close' );
+	closeButtons.forEach( button => {
+		button.addEventListener( 'click', ev => {
+			ev.preventDefault();
+			closeCheckout( modalCheckout );
+		} );
+	} );
+
+	/**
+	 * Variation modals.
+	 */
+	const variationModals = document.querySelectorAll( '.newspack-blocks-variation-modal' );
+	variationModals.forEach( variationModal => {
+		variationModal.addEventListener( 'click', ev => {
+			if ( ev.target === variationModal ) {
+				variationModal.style.display = 'none';
+			}
+		} );
+		variationModal
+			.querySelectorAll( '.newspack-blocks-variation-modal__close' )
+			.forEach( button => {
+				button.addEventListener( 'click', ev => {
+					ev.preventDefault();
+					variationModal.style.display = 'none';
+				} );
+			} );
+	} );
+
+	/**
+	 * Handle triggers.
+	 */
 	const elements = document.querySelectorAll( triggers );
 	elements.forEach( element => {
 		const forms = element.querySelectorAll( 'form' );
 		forms.forEach( form => {
 			form.appendChild( modalCheckoutInput.cloneNode() );
 			form.target = iframeName;
-			form.addEventListener( 'submit', () => {
+			form.addEventListener( 'submit', ev => {
+				const formData = new FormData( form );
+				// Clear any open variation modal.
+				variationModals.forEach( variationModal => ( variationModal.style.display = 'none' ) );
+				// Trigger variation modal if variation is not selected.
+				if ( formData.get( 'is_variable' ) && ! formData.get( 'variation_id' ) ) {
+					const variationModal = [ ...variationModals ].find(
+						modal => modal.dataset.productId === formData.get( 'product_id' )
+					);
+					if ( variationModal ) {
+						ev.preventDefault();
+						variationModal.style.display = 'block';
+						return;
+					}
+				}
+				// Continue with checkout modal.
 				spinner.style.display = 'flex';
 				modalCheckout.style.display = 'block';
 				document.body.classList.add( 'newspack-modal-checkout-open' );
@@ -95,16 +150,4 @@ domReady( () => {
 			} );
 		} );
 	} );
-	modalCheckout.addEventListener( 'click', ev => {
-		if ( ev.target === modalCheckout ) {
-			closeCheckout( modalCheckout );
-		}
-	} );
-	const closeButtons = modalCheckout.querySelectorAll( '.newspack-blocks-checkout-modal__close' );
-	closeButtons.forEach( button => {
-		button.addEventListener( 'click', ev => {
-			ev.preventDefault();
-			closeCheckout( modalCheckout );
-		} );
-	} );
 } );

package/src/modal-checkout/modal.scss

@@ -13,7 +13,8 @@
 	}
 }
 
-.newspack-blocks-checkout-modal {
+.newspack-blocks-checkout-modal,
+.newspack-blocks-variation-modal {
 	position: fixed;
 	top: 0;
 	left: 0;
@@ -32,7 +33,7 @@
 		max-height: calc( 100vh - 32px );
 		background: colors.$color__background-body;
 		border-radius: 5px;
-		> *:not( .newspack-blocks-checkout-modal__close ) {
+		> *:not( .newspack-blocks-checkout-modal__close, .newspack-blocks-variation-modal__close ) {
 			width: 100%;
 			height: 100%;
 			border: 0;
@@ -79,8 +80,60 @@
 	}
 }
 
+.newspack-blocks-variation-modal {
+	&__content {
+		padding: 32px;
+		h3 {
+			margin: 0 0 1em;
+		}
+		p {
+			font-size: 0.8em;
+		}
+		form {
+			margin: 0 0 0.5em;
+			&:last-child {
+				margin: 0;
+			}
+			button {
+				display: block;
+				width: 100%;
+				padding: 16px;
+				margin: 0;
+				border: 1px solid colors.$color__border;
+				background: transparent;
+				color: colors.$color__text-main;
+				text-align: inherit;
+				font-weight: inherit;
+				> span {
+					display: block;
+				}
+				.summary {
+					width: 100%;
+					display: flex;
+					justify-content: space-between;
+					align-items: baseline;
+				}
+				.variation_name {
+					font-weight: 600;
+				}
+				.description {
+					padding-top: 1em;
+					margin-top: 1em;
+					font-size: 0.9em;
+					border-top: 1px solid colors.$color__border;
+				}
+				bdi {
+					font-weight: 600;
+					font-size: 1.8em;
+				}
+			}
+		}
+	}
+}
+
 @media ( max-width: 600px ) {
-	.newspack-blocks-checkout-modal {
+	.newspack-blocks-checkout-modal,
+	.newspack-blocks-variation-modal {
 		&__content {
 			max-width: 100%;
 			width: 100%;
@@ -89,7 +142,7 @@
 			bottom: 0;
 			left: 0;
 			transform: none;
-			> *:not( .newspack-blocks-checkout-modal__close ) {
+			> *:not( .newspack-blocks-variation-modal__close, .newspack-blocks-checkout-modal__close ) {
 				border-radius: 0;
 			}
 		}

package/src/templates/author-profile-card.php

@@ -53,25 +53,33 @@ call_user_func(
 			<?php if ( $attributes['showAvatar'] && isset( $author['avatar'] ) ) : ?>
 				<div class="wp-block-newspack-blocks-author-profile__avatar">
 					<figure style="border-radius: <?php echo esc_attr( $attributes['avatarBorderRadius'] ); ?>; height: <?php echo esc_attr( $attributes['avatarSize'] ); ?>px; width: <?php echo esc_attr( $attributes['avatarSize'] ); ?>px;">
+					<?php if ( $show_archive_link ) : ?>
+						<a href="<?php echo esc_url( $author['url'] ); ?>">
 						<?php
-						echo wp_kses(
-							$author['avatar'],
-							[
-								'img' => [
-									'alt'      => true,
-									'class'    => true,
-									'data-*'   => true,
-									'decoding' => true,
-									'height'   => true,
-									'loading'  => true,
-									'sizes'    => true,
-									'src'      => true,
-									'srcset'   => true,
-									'width'    => true,
-								],
-							]
-						);
-						?>
+					endif;
+
+					echo wp_kses(
+						$author['avatar'],
+						[
+							'img' => [
+								'alt'      => true,
+								'class'    => true,
+								'data-*'   => true,
+								'decoding' => true,
+								'height'   => true,
+								'loading'  => true,
+								'sizes'    => true,
+								'src'      => true,
+								'srcset'   => true,
+								'width'    => true,
+							],
+						]
+					);
+
+				if ( $show_archive_link ) :
+					?>
+						</a>
+					<?php endif; ?>
 					</figure>
 				</div>
 			<?php endif; ?>

package/vendor/autoload.php

@@ -22,4 +22,4 @@ if (PHP_VERSION_ID < 50600) {
 
 require_once __DIR__ . '/composer/autoload_real.php';
 
-return ComposerAutoloaderInit067c69477f130fb41bc11474ba74f7ca::getLoader();
+return ComposerAutoloaderInitdd12b31d9a939bc935225798a66afbb8::getLoader();

package/vendor/composer/autoload_real.php

@@ -2,7 +2,7 @@
 
 // autoload_real.php @generated by Composer
 
-class ComposerAutoloaderInit067c69477f130fb41bc11474ba74f7ca
+class ComposerAutoloaderInitdd12b31d9a939bc935225798a66afbb8
 {
     private static $loader;
 
@@ -22,12 +22,12 @@ class ComposerAutoloaderInit067c69477f130fb41bc11474ba74f7ca
             return self::$loader;
         }
 
-        spl_autoload_register(array('ComposerAutoloaderInit067c69477f130fb41bc11474ba74f7ca', 'loadClassLoader'), true, true);
+        spl_autoload_register(array('ComposerAutoloaderInitdd12b31d9a939bc935225798a66afbb8', 'loadClassLoader'), true, true);
         self::$loader = $loader = new \Composer\Autoload\ClassLoader(\dirname(__DIR__));
-        spl_autoload_unregister(array('ComposerAutoloaderInit067c69477f130fb41bc11474ba74f7ca', 'loadClassLoader'));
+        spl_autoload_unregister(array('ComposerAutoloaderInitdd12b31d9a939bc935225798a66afbb8', 'loadClassLoader'));
 
         require __DIR__ . '/autoload_static.php';
-        call_user_func(\Composer\Autoload\ComposerStaticInit067c69477f130fb41bc11474ba74f7ca::getInitializer($loader));
+        call_user_func(\Composer\Autoload\ComposerStaticInitdd12b31d9a939bc935225798a66afbb8::getInitializer($loader));
 
         $loader->register(true);
 

package/vendor/composer/autoload_static.php

@@ -4,7 +4,7 @@
 
 namespace Composer\Autoload;
 
-class ComposerStaticInit067c69477f130fb41bc11474ba74f7ca
+class ComposerStaticInitdd12b31d9a939bc935225798a66afbb8
 {
     public static $classMap = array (
         'Composer\\InstalledVersions' => __DIR__ . '/..' . '/composer/InstalledVersions.php',
@@ -13,7 +13,7 @@ class ComposerStaticInit067c69477f130fb41bc11474ba74f7ca
     public static function getInitializer(ClassLoader $loader)
     {
         return \Closure::bind(function () use ($loader) {
-            $loader->classMap = ComposerStaticInit067c69477f130fb41bc11474ba74f7ca::$classMap;
+            $loader->classMap = ComposerStaticInitdd12b31d9a939bc935225798a66afbb8::$classMap;
 
         }, null, ClassLoader::class);
     }

package/vendor/composer/installed.php

@@ -3,7 +3,7 @@
         'name' => 'automattic/newspack-blocks',
         'pretty_version' => 'dev-master',
         'version' => 'dev-master',
-        'reference' => '56c1446fb8f3c36f7af247e00d585ec4ade82037',
+        'reference' => 'd492a9ade4ef5030fbda6e2b156e3d823813383d',
         'type' => 'wordpress-plugin',
         'install_path' => __DIR__ . '/../../',
         'aliases' => array(),
@@ -13,7 +13,7 @@
         'automattic/newspack-blocks' => array(
             'pretty_version' => 'dev-master',
             'version' => 'dev-master',
-            'reference' => '56c1446fb8f3c36f7af247e00d585ec4ade82037',
+            'reference' => 'd492a9ade4ef5030fbda6e2b156e3d823813383d',
             'type' => 'wordpress-plugin',
             'install_path' => __DIR__ . '/../../',
             'aliases' => array(),