Merge branch 'develop' into patterns/logo

plugin/assets/css/src/customize-controls.css

@@ -50,7 +50,7 @@
 		content: "\f460" !important;
 	}
 
-	& .customize-section-description-container {
+	& .customize-section-description-container .customize-section-title {
 		display: none;
 	}
 }

plugin/assets/src/block-editor/blocks/card/index.js

@@ -27,7 +27,8 @@ import edit from './edit';
 import save from './save';
 import metadata from './block.json';
 import { example } from './example';
-
+import { isDefaultCardStyleOutlined } from '../../utils';
+metadata.attributes.outlined.default = isDefaultCardStyleOutlined();
 const { name } = metadata;
 
 export { metadata, name };

plugin/assets/src/block-editor/blocks/cards-collection/index.js

@@ -27,9 +27,11 @@ import edit from './edit';
 import save from './save';
 import { example } from './example';
 import metadata from './block.json';
+import { isDefaultCardStyleOutlined } from '../../utils';
 
 const { name } = metadata;
 
+metadata.attributes.outlined.default = isDefaultCardStyleOutlined();
 export { metadata, name };
 
 /**

plugin/assets/src/block-editor/blocks/contact-form/index.js

@@ -25,6 +25,9 @@ import { __ } from '@wordpress/i18n';
 import edit from './edit';
 import save from './save';
 import metadata from './block.json';
+import { isDefaultTextFieldStyleOutlined } from '../../utils';
+
+metadata.attributes.outlined.default = isDefaultTextFieldStyleOutlined();
 
 const { name } = metadata;
 

plugin/assets/src/block-editor/blocks/hand-picked-posts/index.js

@@ -27,6 +27,8 @@ import metadata from './block.json';
 
 const { name } = metadata;
 
+import { isDefaultCardStyleOutlined } from '../../utils';
+metadata.attributes.outlined.default = isDefaultCardStyleOutlined();
 export { metadata, name };
 
 /**

plugin/assets/src/block-editor/blocks/recent-posts/index.js

@@ -25,9 +25,10 @@ import { __ } from '@wordpress/i18n';
 import edit from './edit';
 import metadata from './block.json';
 import { example } from './example';
+import { isDefaultCardStyleOutlined } from '../../utils';
 
 const { name } = metadata;
-
+metadata.attributes.outlined.default = isDefaultCardStyleOutlined();
 export { metadata, name };
 
 /**

plugin/assets/src/block-editor/utils/index.js

@@ -17,3 +17,5 @@
 export { default as findIcon } from './find-icon';
 export { default as getConfig } from './get-config';
 export { default as getIconName } from './get-icon-name';
+export { default as isDefaultCardStyleOutlined } from './is-default-card-style-outlined';
+export { default as isDefaultTextFieldStyleOutlined } from './is-default-text-field-outlined';

plugin/assets/src/block-editor/utils/is-default-card-style-outlined.js

@@ -0,0 +1,26 @@
+/**
+ * Copyright 2020 Google LLC
+ *
+ * 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 { getConfig } from './index';
+
+/**
+ * Whether global card style outlined.
+ *
+ * @return {boolean} Is outlined.
+ */
+export default () =>
+	// eslint-disable-next-line camelcase
+	getConfig( 'defaults' )?.globalStyle?.card_style === 'outlined';

plugin/assets/src/block-editor/utils/is-default-text-field-outlined.js

@@ -0,0 +1,26 @@
+/**
+ * Copyright 2020 Google LLC
+ *
+ * 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 { getConfig } from './index';
+
+/**
+ * Whether global text input style outlined.
+ *
+ * @return {boolean} Is outlined.
+ */
+export default () =>
+	// eslint-disable-next-line camelcase
+	getConfig( 'defaults' )?.globalStyle?.text_field_style === 'outlined';

plugin/php/class-block-types.php

@@ -86,19 +86,27 @@ public function register_blocks() {
 
 		$blocks_dir    = $this->plugin->dir_path . '/assets/js/blocks/';
 		$block_folders = [
-			'button',
-			'card',
-			'cards-collection',
-			'contact-form',
-			'data-table',
-			'hand-picked-posts',
-			'image-list',
-			'list',
-			'recent-posts',
-			'tab-bar',
+			'button'            => [],
+			'card'              => [
+				'outlined' => [ $this, 'is_default_card_style_outlined' ],
+			],
+			'cards-collection'  => [
+				'outlined' => [ $this, 'is_default_card_style_outlined' ],
+			],
+			'contact-form'      => [
+				'outlined' => [ $this, 'is_default_text_field_style_outlined' ],
+			],
+			'data-table'        => [],
+			'hand-picked-posts' => [],
+			'image-list'        => [],
+			'list'              => [],
+			'recent-posts'      => [
+				'outlined' => [ $this, 'is_default_card_style_outlined' ],
+			],
+			'tab-bar'           => [],
 		];
 
-		foreach ( $block_folders as $block_name ) {
+		foreach ( $block_folders as $block_name => $override_attributes ) {
 			$block_json_file = $blocks_dir . $block_name . '/block.json';
 			if ( ! file_exists( $block_json_file ) ) {
 				continue;
@@ -109,6 +117,10 @@ public function register_blocks() {
 				continue;
 			}
 
+			foreach ( $override_attributes as $attr_key => $attr ) {
+				$metadata['attributes'][ $attr_key ]['default'] = call_user_func( $attr );
+			}
+
 			$metadata['editor_script'] = 'material-block-editor-js';
 			$metadata['editor_style']  = 'material-block-editor-css';
 
@@ -213,8 +225,9 @@ public function enqueue_block_editor_assets() {
 			'tab_bar_preview'          => $this->plugin->asset_url( 'assets/images/preview/tab-bar.jpg' ),
 			'contact_form_preview'     => $this->plugin->asset_url( 'assets/images/preview/contact-form.jpg' ),
 			'defaults'                 => [
-				'blocks' => $this->get_block_defaults(),
-				'colors' => $this->get_color_defaults(),
+				'blocks'      => $this->get_block_defaults(),
+				'colors'      => $this->get_color_defaults(),
+				'globalStyle' => $this->get_global_styles(),
 			],
 			'customizerUrls'           => [
 				'colors' => add_query_arg( 'autofocus[section]', $slug . '_colors', $customizer_url ),
@@ -308,6 +321,51 @@ public function get_color_defaults() {
 		return $defaults;
 	}
 
+	/**
+	 * Get global style configs.
+	 *
+	 * @param string $key get single value.
+	 *
+	 * @return array|string
+	 */
+	public function get_global_styles( $key = null ) {
+		$defaults = [];
+		$controls = $this->plugin->customizer_controls;
+
+		foreach ( $controls->get_global_style_controls() as $control ) {
+			$value = $controls->get_option( $control['id'] );
+			if ( ! empty( $value ) ) {
+				$defaults[ $control['id'] ] = $value;
+			}
+		}
+
+		return ( $key ? ( isset( $defaults[ $key ] ) ? $defaults[ $key ] : '' ) : $defaults );
+	}
+
+	/**
+	 * Whether default card style is outlined.
+	 *
+	 * @return bool
+	 */
+	public function is_default_card_style_outlined() {
+		$style = $this->get_global_styles();
+		$style = isset( $style['card_style'] ) ? $style['card_style'] : '';
+
+		return 'outlined' === $style;
+	}
+
+	/**
+	 * Whether default text field style is outlined.
+	 *
+	 * @return bool
+	 */
+	public function is_default_text_field_style_outlined() {
+		$style = $this->get_global_styles();
+		$style = isset( $style['text_field_style'] ) ? $style['text_field_style'] : '';
+
+		return 'outlined' === $style;
+	}
+
 	/**
 	 * Gets the REST API controller for a post type.
 	 *

plugin/php/customizer/class-controls.php

@@ -99,6 +99,9 @@ public function register( $wp_customize ) {
 
 		// Add all controls in the "Icon Styles" section.
 		$this->add_icon_collection_controls();
+
+		// Add global style control.
+		$this->add_global_style_control();
 	}
 
 	/**
@@ -128,31 +131,38 @@ public function add_panel() {
 	 */
 	public function add_sections() {
 		$sections = [
-			'style'         => __( 'Starter Styles', 'material-design' ),
-			'colors'        => __( 'Color Palette ', 'material-design' ),
-			'typography'    => __( 'Typography (Font Styles)', 'material-design' ),
-			'corner_styles' => __( 'Shape Size', 'material-design' ),
-			'icons'         => __( 'Icon Styles', 'material-design' ),
+			'style'          => __( 'Starter Styles', 'material-design' ),
+			'colors'         => __( 'Color Palette ', 'material-design' ),
+			'typography'     => __( 'Typography (Font Styles)', 'material-design' ),
+			'corner_styles'  => __( 'Shape Size', 'material-design' ),
+			'icons'          => __( 'Icon Styles', 'material-design' ),
+			'global-setting' => [
+				'label'       => __( 'Global Styles', 'material-design' ),
+				'priority'    => 300,
+				'description' => esc_html__( 'Global styles will be applied to any new and existing static block using the default style. This will not affect any local style overrides for supported blocks.', 'material-design' ),
+			],
 		];
 
-		foreach ( $sections as $id => $label ) {
+		foreach ( $sections as $id => $maybe_label ) {
 			$id = $this->prepend_slug( $id );
 
-			$args = [
+			$label = is_array( $maybe_label ) ? $maybe_label['label'] : $maybe_label;
+			$args  = [
 				'priority'   => 10,
 				'capability' => 'edit_theme_options',
 				'title'      => esc_html( $label ),
 				'panel'      => $this->slug,
 				'type'       => 'collapse',
 			];
+			$args  = is_array( $maybe_label ) ? array_merge( $args, $maybe_label ) : $args;
 
 			/**
 			 * Filters the customizer section args.
 			 *
 			 * This allows other plugins/themes to change the customizer section args.
 			 *
-			 * @param array $args Array of section args.
-			 * @param string $id ID of the section.
+			 * @param array  $args Array of section args.
+			 * @param string $id   ID of the section.
 			 */
 			$section = apply_filters( $this->slug . '_customizer_section_args', $args, $id );
 
@@ -504,6 +514,89 @@ function ( $child ) {
 		}
 	}
 
+	/**
+	 * Select sanitization callback.
+	 *
+	 * - Sanitization: select
+	 * - Control: select, radio
+	 *
+	 * Sanitization callback for 'select' and 'radio' type controls. This callback sanitizes `$input`
+	 * as a slug, and then validates `$input` against the choices defined for the control.
+	 *
+	 * @see sanitize_key()               https://developer.wordpress.org/reference/functions/sanitize_key/
+	 * @see $wp_customize->get_control() https://developer.wordpress.org/reference/classes/wp_customize_manager/get_control/
+	 *
+	 * @param string               $input   Slug to sanitize.
+	 * @param WP_Customize_Setting $setting Setting instance.
+	 * @return string Sanitized slug if it is a valid choice; otherwise, the setting default.
+	 */
+	public function sanitize_select( $input, $setting ) {
+		// Ensure input is a slug.
+		$input = sanitize_key( $input );
+
+		// Get list of choices from the control associated with the setting.
+		$choices = $setting->manager->get_control( $setting->id )->choices;
+
+		// If the input is a valid key, return it; otherwise, return the default.
+		return ( array_key_exists( $input, $choices ) ? $input : $setting->default );
+	}
+
+	/**
+	 * Get global style controls.
+	 *
+	 * @return array[]
+	 */
+	public function get_global_style_controls() {
+		return [
+			[
+				'id'      => 'card_style',
+				'label'   => esc_html__( 'Cards', 'material-design' ),
+				'type'    => 'radio',
+				'default' => 'elevated',
+				'choices' => [
+					'elevated' => esc_html__( 'Elevated', 'material-design' ),
+					'outlined' => esc_html__( 'Outlined', 'material-design' ),
+				],
+			],
+			[
+				'id'      => 'text_field_style',
+				'label'   => esc_html__( 'Text field', 'material-design' ),
+				'type'    => 'radio',
+				'default' => 'elevated',
+				'choices' => [
+					'elevated' => esc_html__( 'Elevated', 'material-design' ),
+					'outlined' => esc_html__( 'Outlined', 'material-design' ),
+				],
+			],
+		];
+	}
+
+	/**
+	 * Add global style control.
+	 */
+	public function add_global_style_control() {
+		$settings = [];
+		$controls = [];
+
+		foreach ( $this->get_global_style_controls() as $control ) {
+			$settings[ $control['id'] ] = [
+				'transport'         => 'refresh',
+				'sanitize_callback' => [ $this, 'sanitize_select' ],
+				'default'           => $control['default'],
+			];
+
+			$controls[ $control['id'] ] = array_merge(
+				[
+					'section' => 'global-setting',
+				],
+				$control
+			);
+		}
+
+		$this->add_settings( $settings );
+		$this->add_controls( $controls );
+	}
+
 	/**
 	 * Enqueue Customizer scripts.
 	 */

plugin/php/templates/partials/single-post.php

@@ -30,7 +30,7 @@
 $attributes     = isset( $attributes ) ? $attributes : [];
 $style          = isset( $attributes['style'] ) ? $attributes['style'] : 'masonry';
 $columns        = absint( isset( $attributes['columns'] ) ? $attributes['columns'] : 3 );
-$outlined       = isset( $attributes['outlined'] ) ? $attributes['outlined'] : false;
+$outlined       = ! empty( $attributes['outlined'] ) ? $attributes['outlined'] : \MaterialDesign\Plugin\get_plugin_instance()->block_types->get_global_styles( 'card_style' ) === 'outlined';
 $layout         = isset( $attributes['contentLayout'] ) ? $attributes['contentLayout'] : 'text-above-media';
 $featured_image = isset( $attributes['displayFeaturedImage'] ) ? $attributes['displayFeaturedImage'] : true;