Skip to content

Commit 116798c

Browse files
committed
🚀 feat: Add asset manager and enqueuer classes for admin and frontend
- Introduce AssetManager to collect scripts, styles, localizations, inline assets - Create AssetEnqueuer abstract class and concrete AdminAssetEnqueuer, FrontendAssetEnqueuer, AdminAppsAssetEnqueuer - Update View to use new managers and enqueuers, preserving legacy arrays - Bump WPBONES_COMMAND_LINE_VERSION to 1.11.0
1 parent 4fb4dc8 commit 116798c

7 files changed

Lines changed: 1015 additions & 120 deletions

File tree

‎src/Console/bin/bones‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -708,7 +708,7 @@ namespace Bones {
708708
define('WPBONES_MINIMAL_PHP_VERSION', '7.4');
709709

710710
/* MARK: The WP Bones command line version. */
711-
define('WPBONES_COMMAND_LINE_VERSION', '1.10.0');
711+
define('WPBONES_COMMAND_LINE_VERSION', '1.11.0');
712712

713713
use Bones\SemVer\Exceptions\InvalidVersionException;
714714
use Bones\SemVer\Version;
Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
<?php
2+
3+
namespace WPKirk\WPBones\View\Assets;
4+
5+
/**
6+
* AdminAppsAssetEnqueuer class
7+
*
8+
* Specialized asset enqueuer for React/WordPress apps bundles in the admin area.
9+
* This class handles the specific requirements for enqueueing modern JavaScript
10+
* applications built with tools like @wordpress/scripts, including:
11+
* - Loading asset dependency files (.asset.php)
12+
* - Setting up script translations
13+
* - Managing module CSS files
14+
*
15+
* @package WPKirk\WPBones\View\Assets
16+
*/
17+
class AdminAppsAssetEnqueuer extends AssetEnqueuer
18+
{
19+
/**
20+
* Get the base path for apps scripts.
21+
*
22+
* Returns the URL path to the apps directory where React bundles are located.
23+
*
24+
* @return string The base URL path for apps scripts.
25+
*/
26+
protected function getScriptBasePath(): string
27+
{
28+
return $this->container->apps;
29+
}
30+
31+
/**
32+
* Get the base path for apps styles.
33+
*
34+
* Returns the URL path to the apps directory where module CSS files are located.
35+
*
36+
* @return string The base URL path for apps styles.
37+
*/
38+
protected function getStyleBasePath(): string
39+
{
40+
return $this->container->apps;
41+
}
42+
43+
/**
44+
* Enqueue a single script with React bundle specific handling.
45+
*
46+
* This method overrides the parent to handle React bundles which require:
47+
* - Loading dependencies from .asset.php files
48+
* - Setting up WordPress script translations
49+
* - Default 'wp-element' dependency for React support
50+
*
51+
* @param array $script The script data array.
52+
*
53+
* @return void
54+
*/
55+
protected function enqueueScript(array $script): void
56+
{
57+
// Load dependencies and version from the .asset.php file generated by @wordpress/scripts
58+
$assetFile = $this->container->basePath . '/public/apps/' . $script['name'] . '.asset.php';
59+
$assetData = file_exists($assetFile) ? include $assetFile : ['dependencies' => [], 'version' => ''];
60+
61+
$dependencies = $assetData['dependencies'] ?? ['wp-element'];
62+
$version = $assetData['version'] ?? $script['ver'] ?? '';
63+
64+
$src = $this->getScriptBasePath() . '/' . $script['name'] . '.js';
65+
66+
wp_enqueue_script(
67+
$script['name'],
68+
$src,
69+
$dependencies,
70+
$version,
71+
true // Always load in footer for React apps
72+
);
73+
74+
// Set up script translations for internationalization
75+
wp_set_script_translations(
76+
$script['name'],
77+
$this->container->TextDomain,
78+
$this->container->basePath . '/' . $this->container->DomainPath
79+
);
80+
}
81+
82+
/**
83+
* Enqueue a single style for React apps.
84+
*
85+
* This method handles the module CSS files that are generated alongside
86+
* the JavaScript bundles by @wordpress/scripts.
87+
*
88+
* @param array $style The style data array.
89+
*
90+
* @return void
91+
*/
92+
protected function enqueueStyle(array $style): void
93+
{
94+
$src = $this->getStyleBasePath() . '/' . $style['name'] . '.css';
95+
96+
wp_enqueue_style(
97+
$style['name'],
98+
$src,
99+
$style['deps'] ?? [],
100+
$style['ver'] ?? '',
101+
$style['media'] ?? 'all'
102+
);
103+
}
104+
}
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<?php
2+
3+
namespace WPKirk\WPBones\View\Assets;
4+
5+
/**
6+
* AdminAssetEnqueuer class
7+
*
8+
* Concrete implementation of AssetEnqueuer for the WordPress admin area.
9+
* Handles enqueueing of scripts and styles specifically for the admin dashboard.
10+
*
11+
* @package WPKirk\WPBones\View\Assets
12+
*/
13+
class AdminAssetEnqueuer extends AssetEnqueuer
14+
{
15+
/**
16+
* Get the base path for admin scripts.
17+
*
18+
* Returns the URL path to the JavaScript files directory for admin area.
19+
*
20+
* @return string The base URL path for admin scripts.
21+
*/
22+
protected function getScriptBasePath(): string
23+
{
24+
return $this->container->js;
25+
}
26+
27+
/**
28+
* Get the base path for admin styles.
29+
*
30+
* Returns the URL path to the CSS files directory for admin area.
31+
*
32+
* @return string The base URL path for admin styles.
33+
*/
34+
protected function getStyleBasePath(): string
35+
{
36+
return $this->container->css;
37+
}
38+
}
Lines changed: 202 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,202 @@
1+
<?php
2+
3+
namespace WPKirk\WPBones\View\Assets;
4+
5+
/**
6+
* AssetEnqueuer abstract class
7+
*
8+
* Abstract base class responsible for enqueueing assets (scripts and styles) in WordPress.
9+
* This class handles the actual WordPress enqueue operations using the data from AssetManager.
10+
* Concrete implementations should define the specific paths for scripts and styles.
11+
*
12+
* @package WPKirk\WPBones\View\Assets
13+
*/
14+
abstract class AssetEnqueuer
15+
{
16+
/**
17+
* Plugin container instance.
18+
*
19+
* @var mixed
20+
*/
21+
protected $container;
22+
23+
/**
24+
* Asset manager instance.
25+
*
26+
* @var AssetManager
27+
*/
28+
protected AssetManager $assetManager;
29+
30+
/**
31+
* AssetEnqueuer constructor.
32+
*
33+
* @param mixed $container The plugin container instance.
34+
* @param AssetManager $assetManager The asset manager instance.
35+
*/
36+
public function __construct($container, AssetManager $assetManager)
37+
{
38+
$this->container = $container;
39+
$this->assetManager = $assetManager;
40+
}
41+
42+
/**
43+
* Get the base path for scripts.
44+
*
45+
* @return string The base URL path for scripts.
46+
*/
47+
abstract protected function getScriptBasePath(): string;
48+
49+
/**
50+
* Get the base path for styles.
51+
*
52+
* @return string The base URL path for styles.
53+
*/
54+
abstract protected function getStyleBasePath(): string;
55+
56+
/**
57+
* Enqueue all scripts from the asset manager.
58+
*
59+
* @return void
60+
*/
61+
public function enqueueScripts(): void
62+
{
63+
if (!$this->assetManager->hasScripts()) {
64+
return;
65+
}
66+
67+
foreach ($this->assetManager->getScripts() as $script) {
68+
$this->enqueueScript($script);
69+
}
70+
71+
$this->enqueueLocalizeScripts();
72+
$this->enqueueInlineScripts();
73+
}
74+
75+
/**
76+
* Enqueue all styles from the asset manager.
77+
*
78+
* @return void
79+
*/
80+
public function enqueueStyles(): void
81+
{
82+
if (!$this->assetManager->hasStyles()) {
83+
return;
84+
}
85+
86+
foreach ($this->assetManager->getStyles() as $style) {
87+
$this->enqueueStyle($style);
88+
}
89+
90+
$this->enqueueInlineStyles();
91+
}
92+
93+
/**
94+
* Enqueue a single script.
95+
*
96+
* @param array $script The script data array.
97+
*
98+
* @return void
99+
*/
100+
protected function enqueueScript(array $script): void
101+
{
102+
$src = $this->getScriptBasePath() . '/' . $script['name'] . '.js';
103+
104+
wp_enqueue_script(
105+
$script['name'],
106+
$src,
107+
$script['deps'] ?? [],
108+
$script['ver'] ?? false,
109+
$script['args'] ?? true
110+
);
111+
}
112+
113+
/**
114+
* Enqueue a single style.
115+
*
116+
* @param array $style The style data array.
117+
*
118+
* @return void
119+
*/
120+
protected function enqueueStyle(array $style): void
121+
{
122+
$src = $this->getStyleBasePath() . '/' . $style['name'] . '.css';
123+
124+
wp_enqueue_style(
125+
$style['name'],
126+
$src,
127+
$style['deps'] ?? [],
128+
$style['ver'] ?? false,
129+
$style['media'] ?? 'all'
130+
);
131+
}
132+
133+
/**
134+
* Enqueue all localize scripts.
135+
*
136+
* @return void
137+
*/
138+
protected function enqueueLocalizeScripts(): void
139+
{
140+
if (!$this->assetManager->hasLocalizeScripts()) {
141+
return;
142+
}
143+
144+
foreach ($this->assetManager->getLocalizeScripts() as $script) {
145+
wp_localize_script(
146+
$script['handle'],
147+
$script['name'],
148+
$script['data']
149+
);
150+
}
151+
}
152+
153+
/**
154+
* Enqueue all inline scripts.
155+
*
156+
* @return void
157+
*/
158+
protected function enqueueInlineScripts(): void
159+
{
160+
if (!$this->assetManager->hasInlineScripts()) {
161+
return;
162+
}
163+
164+
foreach ($this->assetManager->getInlineScripts() as $script) {
165+
wp_add_inline_script(
166+
$script['name'],
167+
$script['data'],
168+
$script['position'] ?? 'after'
169+
);
170+
}
171+
}
172+
173+
/**
174+
* Enqueue all inline styles.
175+
*
176+
* @return void
177+
*/
178+
protected function enqueueInlineStyles(): void
179+
{
180+
if (!$this->assetManager->hasInlineStyles()) {
181+
return;
182+
}
183+
184+
foreach ($this->assetManager->getInlineStyles() as $style) {
185+
wp_add_inline_style(
186+
$style['name'],
187+
$style['data']
188+
);
189+
}
190+
}
191+
192+
/**
193+
* Enqueue all assets (scripts and styles).
194+
*
195+
* @return void
196+
*/
197+
public function enqueue(): void
198+
{
199+
$this->enqueueScripts();
200+
$this->enqueueStyles();
201+
}
202+
}

0 commit comments

Comments
 (0)