Move Blockbase Google Fonts to Locally Hosted ( DO NOT MERGE )

.gitignore

@@ -4,6 +4,8 @@ twentynineteen/
 theme-dev-utils/
 theme-dev-utils
 vendor/
+# Don't ignore blockbase/vendor, which has package code needed by the theme
+!blockbase/vendor
 *.DS_Store
 *.zip
 *.rej

blockbase/composer.json

@@ -0,0 +1,9 @@
+{
+    "name": "automattic/blockbase",
+    "description": "A universal WordPress theme that bridges classic and block-based themes",
+    "type": "project",
+    "require": {
+        "automattic/jetpack-google-fonts-provider": "^0.3.0"
+    },
+    "license": "GPL-2.0-or-later"
+}

blockbase/functions.php

@@ -1,4 +1,9 @@
 <?php
+
+// Load Jetpack packages included with theme (Jetpack plugin is not required).
+// Run `composer update --no-dev` to update packages and commit the changes.
+require_once 'vendor/autoload.php';
+
 if ( ! function_exists( 'blockbase_support' ) ) :
 	function blockbase_support() {
 		// Alignwide and alignfull classes in the block editor.
@@ -63,13 +68,6 @@ function( $settings ) {
  * Enqueue scripts and styles.
  */
 function blockbase_editor_styles() {
-	// Enqueue editor styles.
-	add_editor_style(
-		array(
-			blockbase_fonts_url(),
-		)
-	);
-
 	// Add the child theme CSS if it exists.
 	if ( file_exists( get_stylesheet_directory() . '/assets/theme.css' ) ) {
 		add_editor_style(
@@ -84,78 +82,32 @@ function blockbase_editor_styles() {
  * Enqueue scripts and styles.
  */
 function blockbase_scripts() {
-	// Enqueue Google fonts
-	wp_enqueue_style( 'blockbase-fonts', blockbase_fonts_url(), array(), null );
 	wp_enqueue_style( 'blockbase-ponyfill', get_template_directory_uri() . '/assets/ponyfill.css', array(), wp_get_theme()->get( 'Version' ) );
 
 	// Add the child theme CSS if it exists.
 	if ( file_exists( get_stylesheet_directory() . '/assets/theme.css' ) ) {
 		wp_enqueue_style( 'blockbase-child-styles', get_stylesheet_directory_uri() . '/assets/theme.css', array('blockbase-ponyfill'), wp_get_theme()->get( 'Version' ) );
 	}
-}
-add_action( 'wp_enqueue_scripts', 'blockbase_scripts' );
-
-/**
- * Add Google webfonts
- *
- * @return $fonts_url
- */
-
-function blockbase_fonts_url() {
-	if ( ! class_exists( 'WP_Theme_JSON_Resolver_Gutenberg' ) ) {
-		return '';
-	}
 
-	$theme_data = WP_Theme_JSON_Resolver_Gutenberg::get_merged_data()->get_settings();
-	if ( empty( $theme_data ) || empty( $theme_data['typography'] ) || empty( $theme_data['typography']['fontFamilies'] ) ) {
-		return '';
+	if ( function_exists( 'blockbase_enqueue_default_fonts' ) ) {
+		blockbase_enqueue_default_fonts();
 	}
-
-	$font_families = [];
-	if ( ! empty( $theme_data['typography']['fontFamilies']['custom'] ) ) {
-		foreach( $theme_data['typography']['fontFamilies']['custom'] as $font ) {
-			if ( ! empty( $font['google'] ) ) {
-				$font_families[] = $font['google'];
-			}
-		}
-
-	// NOTE: This should be removed once Gutenberg 12.1 lands stably in all environments
-	} else if ( ! empty( $theme_data['typography']['fontFamilies']['user'] ) ) {
-		foreach( $theme_data['typography']['fontFamilies']['user'] as $font ) {
-			if ( ! empty( $font['google'] ) ) {
-				$font_families[] = $font['google'];
-			}
-		}
-	// End Gutenberg < 12.1 compatibility patch
-
-	} else {
-		if ( ! empty( $theme_data['typography']['fontFamilies']['theme'] ) ) {
-			foreach( $theme_data['typography']['fontFamilies']['theme'] as $font ) {
-				if ( ! empty( $font['google'] ) ) {
-					$font_families[] = $font['google'];
-				}
-			}
-		}
-	}
-
-	if ( empty( $font_families ) ) {
-		return '';
-	}
-
-	// Make a single request for the theme or user fonts.
-	return esc_url_raw( 'https://fonts.googleapis.com/css2?' . implode( '&', array_unique( $font_families ) ) . '&display=swap' );
 }
+add_action( 'wp_enqueue_scripts', 'blockbase_scripts' );
 
 /**
  * Customize Global Styles
  */
 if ( class_exists( 'WP_Theme_JSON_Resolver_Gutenberg' ) ) {
 	require get_template_directory() . '/inc/customizer/wp-customize-colors.php';
 	require get_template_directory() . '/inc/customizer/wp-customize-color-palettes.php';
-	require get_template_directory() . '/inc/customizer/wp-customize-fonts.php';
 	require get_template_directory() . '/inc/social-navigation.php';
+	require get_template_directory() . '/inc/custom-google-fonts.php';
 }
 
+// Font settings migration and deprecation message. Fonts now set in Global Styles.
+require get_template_directory() . '/inc/customizer/wp-customize-fonts.php';
+
 // Force menus to reload
 add_action(
 	'customize_controls_enqueue_scripts',

blockbase/inc/custom-google-fonts.php

@@ -0,0 +1,130 @@
+<?php
+
+// ---------- Custom Fonts ---------- //
+// This code is adapted directly from Jetpack's Google Fonts module, which depends on the Webfonts API from Gutenberg (and eventually Core)
+// https://github.com/Automattic/jetpack/blob/master/projects/plugins/jetpack/modules/google-fonts.php
+const BLOCKBASE_GOOGLE_FONTS_LIST = array(
+	'arvo' => array( 'font_family' => 'Arvo'),
+	'bodoni-moda' => array( 'font_family' => 'Bodoni Moda'),
+	'cabin' => array( 'font_family' => 'Cabin'),
+	'chivo' => array( 'font_family' => 'Chivo'),
+	'courier-prime' => array( 'font_family' => 'Courier Prime'),
+	'dm-sans' => array( 'font_family' => 'DM Sans' ),
+	'domine' => array( 'font_family' => 'Domine'),
+	'eb-garamond' => array( 'font_family' => 'EB Garamond'),
+	'fira-sans' => array( 'font_family' => 'Fira Sans'),
+	'ibm-plex-sans' => array( 'font_family' => 'IBM Plex Sans'),
+	'ibm-plex-mono' => array( 'font_family' => 'IBM Plex Mono'),
+	'inter' => array( 'font_family' => 'Inter'),
+	'josefin-sans' => array( 'font_family' => 'Josefin Sans'),
+	'jost' => array( 'font_family' => 'Jost'),
+	'libre-baskerville' => array( 'font_family' => 'Libre Baskerville'),
+	'libre-franklin' => array( 'font_family' => 'Libre Franklin'),
+	'literata' => array( 'font_family' => 'Literata'),
+	'lora' => array( 'font_family' => 'Lora'),
+	'merriweather' => array( 'font_family' => 'Merriweather'),
+	'montserrat' => array( 'font_family' => 'Montserrat'),
+	'newsreader' => array( 'font_family' => 'Newsreader'),
+	'nunito' => array( 'font_family' => 'Nunito'),
+	'open-sans' => array( 'font_family' => 'Open Sans'),
+	'overpass' => array( 'font_family' => 'Overpass'),
+	'playfair-display' => array( 'font_family' => 'Playfair Display'),
+	'poppins' => array( 'font_family' => 'Poppins'),
+	'raleway' => array( 'font_family' => 'Raleway'),
+	'red-hat-display' => array( 'font_family' => 'Red Hat Display'),
+	'roboto' => array( 'font_family' => 'Roboto'),
+	'roboto-slab' => array( 'font_family' => 'Roboto Slab'),
+	'rubik' => array( 'font_family' => 'Rubik'),
+	'source-sans-pro' => array( 'font_family' => 'Source Sans Pro'),
+	'source-serif-pro' => array( 'font_family' => 'Source Serif Pro'),
+	'space-mono' => array( 'font_family' => 'Space Mono'),
+	'texturina' => array( 'font_family' => 'Texturina'),
+	'work-sans' => array( 'font_family' => 'Work Sans'),
+);
+
+/**
+ * Register a curated selection of Google Fonts.
+ *
+ * @return void
+ */
+function blockbase_register_google_fonts() {
+	// Use jetpack's implementation of custom google fonts if it is already active
+	if ( method_exists( 'Jetpack', 'is_module_active' ) && Jetpack::is_module_active( 'google-fonts' ) ) {
+		return;
+	}
+
+	if ( ! function_exists( 'wp_register_webfont_provider' ) || ! function_exists( 'wp_register_webfonts' ) ) {
+		return;
+	}
+
+	wp_register_webfont_provider( 'blockbase-google-fonts', '\Automattic\Jetpack\Fonts\Google_Fonts_Provider' );
+
+	/**
+	 * Curated list of Google Fonts.
+	 *
+	 * @module google-fonts
+	 *
+	 * @since 10.8
+	 *
+	 * @param array $fonts_to_register Array of Google Font names to register.
+	 */
+	$fonts_to_register = apply_filters( 'blockbase_google_fonts_list', BLOCKBASE_GOOGLE_FONTS_LIST );
+
+	foreach ( $fonts_to_register as $font_settings ) {
+		$font_family = $font_settings['font_family'];
+
+		wp_register_webfonts(
+			array(
+				array(
+					'font-family'  => $font_family,
+					'font-weight'  => '100 900',
+					'font-style'   => 'normal',
+					'font-display' => 'swap',
+					'provider'     => 'blockbase-google-fonts',
+				),
+				array(
+					'font-family'  => $font_family,
+					'font-weight'  => '100 900',
+					'font-style'   => 'italic',
+					'font-display' => 'swap',
+					'provider'     => 'blockbase-google-fonts',
+				),
+			)
+		);
+	}
+
+	add_filter( 'wp_resource_hints', '\Automattic\Jetpack\Fonts\Utils::font_source_resource_hint', 10, 2 );
+	add_filter( 'pre_render_block', '\Automattic\Jetpack\Fonts\Introspectors\Blocks::enqueue_block_fonts', 10, 2 );
+	add_action( 'init', '\Automattic\Jetpack\Fonts\Introspectors\Global_Styles::enqueue_global_styles_fonts' );
+}
+add_action( 'after_setup_theme', 'blockbase_register_google_fonts' );
+
+/**
+ * Automatically enqueues default blockbase theme google fonts
+ *
+ * @return void
+ */
+function blockbase_enqueue_default_fonts() {
+	if ( ! function_exists( 'wp_enqueue_webfont' ) ) {
+		return;
+	}
+
+	$font_settings = wp_get_global_settings( array( 'typography', 'fontFamilies' ), 'base' );
+
+	if ( ! isset( $font_settings['theme'] ) ) {
+		return;
+	}
+
+	foreach( $font_settings['theme'] as $font_setting ) {
+		if ( ! isset( $font_setting['fontSlug'] ) ) {
+			continue;
+		}
+
+		$font_slug = $font_setting['fontSlug'];
+
+		if ( $font_slug && isset( BLOCKBASE_GOOGLE_FONTS_LIST[$font_slug] ) ) {
+			$font_family = BLOCKBASE_GOOGLE_FONTS_LIST[$font_slug]['font_family'];
+			wp_enqueue_webfont( $font_family );
+		}
+	}
+}