feat(header): add 叠加组件 with after_html per background item

「顶部多功能组件 → 背景内容」的每个背景项目新增「叠加组件」手风琴，
其中提供「组件下方额外内容」(after_html) 输入框，支持 HTML。

- 后台 schema：slider_item_fields 增加 overlay accordion（sanitize_type html），
  默认值与 PageConfigMetaBox / DisplayPageGroups 的默认项目同步带上空 overlay
- 保存：页面独立配置（page_config 元数据）按项目写入 overlay.after_html，
  沿用 wp_kses_post() 过滤
- 前端：after_html 作为 .slide-overlay-after 覆盖层输出在所属幻灯片内
  （幻灯片是 overflow:hidden 的定位层，放到幻灯片外会被裁掉），
  默认贴底居中、仅其中的链接与表单接收点击
- main.min.css 由 tools/build-public-assets.mjs 重新生成

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

tests/widget-system/header-multifunction-render-harness.php

@@ -48,6 +48,7 @@ namespace {
 	function get_bloginfo($show = ''): string { return 'Jio'; }
 	function home_url($path = ''): string { return 'https://example.test/' . ltrim((string) $path, '/'); }
 	function wp_kses($value, $allowed = []): string { return (string) $value; }
+	function wp_kses_post($value): string { return (string) $value; }
 	function jio_is_lazy(string $key): bool { return !empty($GLOBALS['jio_lazy']); }
 	function jio_get_lazy_thumb(string $size = ''): string { return 'https://example.test/placeholder.svg'; }
 	function jio_get_lazy_attr(string $key, string $src, string $class = '', string $lazy_src = ''): string {
@@ -64,7 +65,7 @@ namespace {
 	require_once dirname(__DIR__, 2) . '/inc/helpers/homepage/header-components.php';
 
 	$slides = [
-		['background' => 'https://example.test/slide.jpg', 'link' => ['url' => 'https://example.test/one', 'target' => '_blank', 'text' => 'One'], 'text' => ['title' => 'Title', 'desc' => 'Description'], 'image_layer' => [['image' => 'https://example.test/layer.png', 'free_size' => true, 'align' => 'right', 'parallax' => 40, 'parallax_opacity' => 80, 'parallax_scale' => 110]]],
+		['background' => 'https://example.test/slide.jpg', 'link' => ['url' => 'https://example.test/one', 'target' => '_blank', 'text' => 'One'], 'text' => ['title' => 'Title', 'desc' => 'Description'], 'overlay' => ['after_html' => '<div class="overlay-cta"><a href="https://example.test/cta">立即查看</a></div>'], 'image_layer' => [['image' => 'https://example.test/layer.png', 'free_size' => true, 'align' => 'right', 'parallax' => 40, 'parallax_opacity' => 80, 'parallax_scale' => 110]]],
 		['background_video' => 'https://example.test/background.mp4', 'background' => 'https://example.test/poster.jpg'],
 		['video' => 'https://example.test/content.mp4', 'background' => 'https://example.test/content-poster.jpg'],
 		['background' => 'https://example.test/pc-only.jpg', 'hide' => 'm'],

tests/widget-system/header-multifunction-render.test.cjs

@@ -29,6 +29,8 @@ test('header multifunction renders reference slide, search, and card contracts o
   assert.match(desktop, /header-slider-search-more text-center before/);
   assert.match(desktop, /<div class="search-input">search-box<\/div>/);
   assert.match(desktop, /<div class="icon-cover-card flex ac jio-panel">Card one<\/div>/);
+  // 叠加组件（每项 after_html）跟随所属幻灯片输出，不能落到幻灯片之外。
+  assert.match(desktop, /<div class="slide-overlay-after"><div class="overlay-cta"><a href="https:\/\/example\.test\/cta">立即查看<\/a><\/div><\/div><\/div>/);
 
   assert.doesNotMatch(mobile, /background\.mp4/);
   assert.match(mobile, /data-src="https:\/\/example\.test\/mobile-only\.jpg"/);
@@ -56,8 +58,38 @@ test('header multifunction renders reference slide, search, and card contracts o
   assert.doesNotMatch(single, /swiper-pagination|swiper-button-prev/);
 });
 
-test('header card background setting is editable, saved, and defaults off', () => {
+test('each background item exposes an overlay group with after_html', () => {
   const schema = fs.readFileSync(path.join(root, 'src/Admin/Schema/SchemaPageDisplay.php'), 'utf8');
+  const metaBox = fs.readFileSync(path.join(root, 'src/Admin/PageConfigMetaBox.php'), 'utf8');
+  const helper = fs.readFileSync(path.join(root, 'inc/helpers/homepage/header-components.php'), 'utf8');
+  const css = fs.readFileSync(path.join(root, 'assets/css/main.css'), 'utf8');
+
+  // 后台：「背景内容」每个项目里都有「叠加组件」手风琴，含 HTML 输入框。
+  const itemFields = schema.slice(
+    schema.indexOf('private static function slider_item_fields'),
+    schema.indexOf('private static function slider_option_fields'),
+  );
+  assert.match(itemFields, /field\('overlay', '叠加组件', 'accordion'/);
+  assert.match(itemFields, /field\('after_html', '组件下方额外内容', 'textarea', '', \['sanitize_type' => 'html'/);
+  // 默认值里带上空 overlay，新加的项目不必手动展开即可保存。
+  assert.match(schema, /'overlay' => \['after_html' => ''\]/);
+
+  // 页面独立配置（page_config 元数据）同样落盘 after_html。
+  assert.match(metaBox, /\$overlay = is_array\(\$slide\['overlay'\] \?\? null\) \? \$slide\['overlay'\] : \[\]/);
+  assert.match(metaBox, /'after_html' => wp_kses_post\(\(string\) \(\$overlay\['after_html'\] \?\? ''\)\)/);
+  assert.match(metaBox, /'overlay' => \['after_html' => ''\]/);
+
+  // 前端：内容挂在所属幻灯片内，并作为覆盖层渲染。
+  assert.match(helper, /\$overlay_html = '<div class="slide-overlay-after">'/);
+  assert.match(helper, /\$slides_html \.= \$overlay_html;/);
+  assert.match(css, /\.slide-overlay-after \{[^}]*position: absolute/);
+  assert.match(css, /\.slide-overlay-after \{[^}]*z-index: 3/);
+  // 覆盖层不能挡住背景上的其它交互，只有其中的可交互元素接收点击。
+  assert.match(css, /\.slide-overlay-after \{[^}]*pointer-events: none/);
+  assert.match(css, /\.slide-overlay-after a,[\s\S]*?pointer-events: auto/);
+});
+
+test('header card background setting is editable, saved, and defaults off', () => {  const schema = fs.readFileSync(path.join(root, 'src/Admin/Schema/SchemaPageDisplay.php'), 'utf8');
   const settings = fs.readFileSync(path.join(root, 'src/Settings/DisplayPageGroups.php'), 'utf8');
   const metaBox = fs.readFileSync(path.join(root, 'src/Admin/PageConfigMetaBox.php'), 'utf8');
 

tests/widget-system/page-display-contract.test.cjs

@@ -469,6 +469,9 @@ test('save contract rejects invalid input and round-trips canonical nested value
   assert.deepEqual(slide.link, { url: 'https://example.test/slide', target: '_blank', text: 'Go' })
   assert.equal(slide.text.title, '<strong>Safe</strong>')
   assert.equal(Object.hasOwn(slide.text, 'unknown'), false)
+  // 叠加组件按项目保存，未知键丢弃，脚本被过滤。
+  assert.equal(slide.overlay.after_html, '<div class="cta">Below</div>')
+  assert.equal(Object.hasOwn(slide.overlay, 'unknown'), false)
 
   assert.equal(data.footer_clean.fcode_t1_code, '<strong>Allowed</strong>')
   assert.equal(data.footer_clean.footer_contact_weibo, '')

tests/widget-system/page-display-save-harness.php

@@ -183,6 +183,7 @@ namespace {
 			'unknown' => 'drop-me',
 			'link' => ['url' => 'https://example.test/slide', 'target' => '_blank', 'text' => '<b>Go</b>', 'unknown' => 'drop-me'],
 			'text' => ['title' => '<strong>Safe</strong><script>bad()</script>', 'desc' => '<em>Copy</em>', 'unknown' => 'drop-me'],
+			'overlay' => ['after_html' => '<div class="cta">Below</div><script>bad()</script>', 'unknown' => 'drop-me'],
 		]],
 		'header_slider_card_option' => ['show_widget_bg' => true, 'cards' => []],
 	];