1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
|
<?php
namespace Automattic\WooCommerce\Blocks\Domain\Services;
use Automattic\WooCommerce\Blocks\Domain\Package;
use Automattic\WooCommerce\Blocks\Utils\CartCheckoutUtils;
/**
* Service class for adding new-style Notices to WooCommerce core.
*
* @internal
*/
class Notices {
/**
* Holds the Package instance
*
* @var Package
*/
private $package;
/**
* Templates used for notices.
*
* @var array
*/
private $notice_templates = array(
'notices/error.php',
'notices/notice.php',
'notices/success.php',
);
/**
* Constructor
*
* @param Package $package An instance of the package class.
*/
public function __construct( Package $package ) {
$this->package = $package;
}
/**
* Initialize notice hooks.
*/
public function init() {
add_action(
'after_setup_theme',
function () {
/**
* Allow classic theme developers to opt-in to using block notices.
*
* @since 8.8.0
* @param bool $use_block_notices_in_classic_theme Whether to use block notices in classic theme.
* @return bool
*/
if ( wp_is_block_theme() || apply_filters( 'woocommerce_use_block_notices_in_classic_theme', false ) ) {
add_filter( 'wc_get_template', [ $this, 'get_notices_template' ], 10, 5 );
}
}
);
add_filter( 'woocommerce_kses_notice_allowed_tags', [ $this, 'add_kses_notice_allowed_tags' ] );
add_action( 'wp_head', [ $this, 'enqueue_notice_styles' ] );
}
/**
* Allow SVG icon in notices.
*
* @param array $allowed_tags Allowed tags.
* @return array
*/
public function add_kses_notice_allowed_tags( $allowed_tags ) {
$svg_args = array(
'svg' => array(
'aria-hidden' => true,
'xmlns' => true,
'width' => true,
'height' => true,
'viewbox' => true,
'focusable' => true,
),
'path' => array(
'd' => true,
),
);
return array_merge( $allowed_tags, $svg_args );
}
/**
* Replaces core notice templates with those from blocks.
*
* The new notice templates match block components with matching icons and styling. The differences are:
* 1. Core has notices for info, success, and error notices, blocks has notices for info, success, error,
* warning, and a default notice type.
* 2. The block notices use different CSS classes to the core notices. Core uses `woocommerce-message`, `is-info`
* and `is-error` classes, blocks uses `wc-block-components-notice-banner is-error`,
* `wc-block-components-notice-banner is-info`, and `wc-block-components-notice-banner is-success`.
* 3. The markup of the notices is different, with the block notices using SVG icons and a slightly different
* structure to accommodate this.
*
* @param string $template Located template path.
* @param string $template_name Template name.
* @param array $args Template arguments.
* @param string $template_path Template path.
* @param string $default_path Default path.
* @return string
*/
public function get_notices_template( $template, $template_name, $args, $template_path, $default_path ) {
if ( in_array( $template_name, $this->notice_templates, true ) ) {
$directory = get_stylesheet_directory();
$file = $directory . '/woocommerce/' . $template_name;
if ( file_exists( $file ) ) {
return $file;
}
$template = $this->package->get_path( 'templates/block-' . $template_name );
wp_enqueue_style( 'wc-blocks-style' );
}
return $template;
}
/**
* Replaces all notices with the new block-based notices.
*
* @return void
*/
public function enqueue_notice_styles() {
wp_enqueue_style( 'wc-blocks-style' );
}
}
|