Align imperative Setting.setHeading with schema section layout #312

New issue

Closed

opened 2026-06-05 19:59:34 +00:00 by steve · 0 comments

steve commented

2026-06-05 19:59:34 +00:00

Owner

Problem

Setting.setHeading() styled a .setting-item row inside the plugin tab panel instead of rendering an unframed heading outside a rounded settings body like declarative schema sections.

Goal

Make imperative plugin tabs emit setting-section / heading / body DOM and route subsequent settings rows into the active section body automatically.

Acceptance Criteria

setHeading() creates section heading outside .setting-section-body.
Subsequent new Setting(containerEl) rows mount in the active body.
Headingless plugin tabs still get an implicit section body.
Workspace CSS matches schema heading typography and panel chrome.

Suggested Files or Specs To Inspect

Validation Commands

Follow-up Tasks

Implementation Summary

Rewrote Setting.setHeading() to build setting-section heading/body DOM with container routing for subsequent rows, added setting-section-layout helpers and unit tests, refactored plugin-tab CSS to a form wrapper with shared panel styling on setting-section-body, documented hooks in configuration-and-settings.md, and added Tasks settings e2e coverage. Validated with api check:types, workspace check:all, spec:lint, api setting-heading tests, and workspace test:e2e:smoke.

## Problem `Setting.setHeading()` styled a `.setting-item` row inside the plugin tab panel instead of rendering an unframed heading outside a rounded settings body like declarative schema sections. ## Goal Make imperative plugin tabs emit `setting-section` / heading / body DOM and route subsequent settings rows into the active section body automatically. ## Acceptance Criteria - `setHeading()` creates section heading outside `.setting-section-body`. - Subsequent `new Setting(containerEl)` rows mount in the active body. - Headingless plugin tabs still get an implicit section body. - Workspace CSS matches schema heading typography and panel chrome. ## Suggested Files or Specs To Inspect ## Validation Commands ## Related Issues ## Follow-up Tasks ## Implementation Summary Rewrote Setting.setHeading() to build setting-section heading/body DOM with container routing for subsequent rows, added setting-section-layout helpers and unit tests, refactored plugin-tab CSS to a form wrapper with shared panel styling on setting-section-body, documented hooks in configuration-and-settings.md, and added Tasks settings e2e coverage. Validated with api check:types, workspace check:all, spec:lint, api setting-heading tests, and workspace test:e2e:smoke.

steve

2026-06-05 19:59:34 +00:00