Adopt shared WebUI structural primitives
This commit is contained in:
@@ -0,0 +1,25 @@
|
||||
# Docs Interface Pattern Migration
|
||||
|
||||
The Docs route composes the platform interface language without owning a
|
||||
parallel shell. Core owns its navigation/content pane geometry and page frame;
|
||||
Docs owns audience filtering, version selection, topic navigation, configured
|
||||
documentation projection, and evidence presentation.
|
||||
|
||||
## Surface contract
|
||||
|
||||
- `WorkspaceLayout` owns the outline/content regions, pane width, scrolling,
|
||||
accessible labels, and narrow-layout navigation behavior.
|
||||
- `PageLayout` owns the content inset, sticky heading, audience-aware page
|
||||
identity, reload action placement, error and loading regions, and responsive
|
||||
action flow.
|
||||
- `ExplorerTree`, `SegmentedControl`, `DataGrid`, `DescriptionList`, dialogs,
|
||||
alerts, and status badges retain their Core interaction and accessibility
|
||||
contracts.
|
||||
- Docs-specific CSS remains limited to the documentation tree, reading column,
|
||||
topic typography, page outline, and reference content. It no longer defines
|
||||
the outer workspace grid or page skeleton.
|
||||
|
||||
The module keeps user/admin audience boundaries, installed-version selection,
|
||||
topic URLs, configured-state projection, and evidence visibility unchanged.
|
||||
The platform layout checker rejects restoring a raw Docs page or workspace
|
||||
frame.
|
||||
@@ -47,6 +47,11 @@ ARCHITECTURE = ModuleArchitectureDeclaration(
|
||||
reference="docs/DOCUMENTATION_LAYER_CONCEPT.md",
|
||||
summary="Defines the manifest-driven documentation boundary.",
|
||||
),
|
||||
ModuleMaturityEvidence(
|
||||
kind="documentation",
|
||||
reference="docs/INTERFACE_PATTERN_MIGRATION.md",
|
||||
summary="Records the Core-owned Docs workspace and page-layout boundary.",
|
||||
),
|
||||
),
|
||||
known_limits=(
|
||||
"Architecture declarations are in staged adoption, so undeclared modules remain visible as pending.",
|
||||
|
||||
@@ -8,10 +8,10 @@ import {
|
||||
Dialog,
|
||||
DismissibleAlert,
|
||||
ExplorerTree,
|
||||
LoadingFrame,
|
||||
PageTitle,
|
||||
PageLayout,
|
||||
SegmentedControl,
|
||||
StatusBadge,
|
||||
WorkspaceLayout,
|
||||
adminErrorMessage,
|
||||
useGuardedNavigate,
|
||||
usePlatformLanguage,
|
||||
@@ -133,7 +133,14 @@ export default function DocsPage({ settings }: { settings: ApiSettings }) {
|
||||
}, [treeNodes, selectedPage?.id]);
|
||||
|
||||
return (
|
||||
<div className="workspace module-workspace docs-workspace">
|
||||
<WorkspaceLayout
|
||||
className="module-workspace docs-workspace"
|
||||
primarySize="wide"
|
||||
primaryLabel="i18n:govoplan-docs.documentation_outline.6f836b99"
|
||||
contentLabel="i18n:govoplan-docs.help_center.f3f3a34b"
|
||||
documentationType={documentationType}
|
||||
contentClassName="docs-workspace-content"
|
||||
primary={(
|
||||
<aside className="section-sidebar docs-outline" aria-label="i18n:govoplan-docs.documentation_outline.6f836b99">
|
||||
<div className="docs-sidebar-header">
|
||||
<div className="section-title">i18n:govoplan-docs.help_center.f3f3a34b</div>
|
||||
@@ -181,21 +188,19 @@ export default function DocsPage({ settings }: { settings: ApiSettings }) {
|
||||
/>
|
||||
</nav>
|
||||
</aside>
|
||||
<section className="workspace-content docs-workspace-content">
|
||||
<div className="content-pad workspace-data-page docs-page">
|
||||
<div className="page-heading split workspace-heading">
|
||||
<div>
|
||||
<PageTitle loading={loading}>i18n:govoplan-docs.help_center.f3f3a34b</PageTitle>
|
||||
<p>{adminDocs ? "i18n:govoplan-docs.technical_documentation_for_the_modules_and_conf.267e739e" : "i18n:govoplan-docs.guidance_for_the_functions_available_in_this_ins.723b7cad"}</p>
|
||||
</div>
|
||||
<div className="button-row compact-actions">
|
||||
<Button onClick={() => void load()} disabled={loading}><RefreshCw size={16} /> i18n:govoplan-docs.reload.cce71553</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{error && <DismissibleAlert tone="danger" resetKey={error} floating>{error}</DismissibleAlert>}
|
||||
|
||||
<LoadingFrame loading={loading} label="i18n:govoplan-docs.loading_documentation_context.1c091645">
|
||||
)}
|
||||
>
|
||||
<PageLayout
|
||||
title="i18n:govoplan-docs.help_center.f3f3a34b"
|
||||
description={adminDocs ? "i18n:govoplan-docs.technical_documentation_for_the_modules_and_conf.267e739e" : "i18n:govoplan-docs.guidance_for_the_functions_available_in_this_ins.723b7cad"}
|
||||
actions={<Button onClick={() => void load()} disabled={loading}><RefreshCw size={16} /> i18n:govoplan-docs.reload.cce71553</Button>}
|
||||
loading={loading}
|
||||
loadingLabel="i18n:govoplan-docs.loading_documentation_context.1c091645"
|
||||
error={error}
|
||||
mode="workspace"
|
||||
documentationType={documentationType}
|
||||
className="docs-page"
|
||||
>
|
||||
<div className="docs-content">
|
||||
<main className="docs-page-main">
|
||||
<SelectedPageContent
|
||||
@@ -215,10 +220,8 @@ export default function DocsPage({ settings }: { settings: ApiSettings }) {
|
||||
</main>
|
||||
<PageOutline items={outlineItems} />
|
||||
</div>
|
||||
</LoadingFrame>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</PageLayout>
|
||||
</WorkspaceLayout>
|
||||
);
|
||||
|
||||
function selectDocumentationType(type: DocumentationType) {
|
||||
|
||||
Reference in New Issue
Block a user