lda.chat/lda-wf
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: establish editorial surfaces for authoring scenes

Browse Source
This commit is contained in:
lda
2026-07-12 01:42:13 +07:00 Verified
parent c22f0f718c
commit 7dba34f249
7 changed files with 49 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/apps/console/src/presentation/authoring/AgentHandoffScene.test.tsx
+4
View File
@@ -26,6 +26,10 @@ describe("AgentHandoffScene", () => {
"data-handoff-phase",
"discover",
);
expect(screen.getByRole("region", { name: "prepared agent handoff" })).toHaveAttribute(
"data-presentation-surface",
"editorial",
);
expect(screen.getByRole("log", { name: "prepared authoring conversation" })).toHaveAttribute(
"data-surface",
"stage",
web/apps/console/src/presentation/authoring/AgentHandoffScene.tsx
+1 -1
View File
@@ -29,7 +29,7 @@ export const AgentHandoffScene = ({ beat, timelineAgent }: AgentHandoffSceneProp
const activeIndex = phases.findIndex(({ id }) => id === phase);
return (
<section className="agent-handoff-scene" aria-label="prepared agent handoff" data-handoff-phase={phase}>
<section className="agent-handoff-scene" aria-label="prepared agent handoff" data-handoff-phase={phase} data-presentation-surface="editorial">
<header className="agent-handoff-scene__header">
<span>Prepared replay</span>
<strong>External agent → workflow substrate</strong>
web/apps/console/src/presentation/authoring/AuthoringPhaseVisual.test.tsx
+15 -1
View File
@@ -6,9 +6,23 @@ import { AuthoringPhaseVisual } from "./AuthoringPhaseVisual.js";
afterEach(cleanup);
describe("AuthoringPhaseVisual", () => {
it.each(["discover", "draft", "validate", "artifact", "deployment"] as const)(
"marks the %s visual as editorial",
(phase) => {
render(<AuthoringPhaseVisual projection={projectPreparedAuthoringPhase(phase)} />);
expect(screen.getByRole("region", { name: /evidence/i })).toHaveAttribute(
"data-presentation-surface",
"editorial",
);
},
);
it("shows source inventory and the inspected contract", () => {
render(<AuthoringPhaseVisual projection={projectPreparedAuthoringPhase("discover")} />);
expect(screen.getByRole("region", { name: /discovery evidence/i })).toBeInTheDocument();
expect(screen.getByRole("region", { name: /discovery evidence/i })).toHaveAttribute(
"data-presentation-surface",
"editorial",
);
expect(screen.getByText("local.lda_docs")).toBeInTheDocument();
expect(screen.getByText("local.lda_report")).toBeInTheDocument();
expect(screen.getByText(/documents.*analysis/i)).toBeInTheDocument();
web/apps/console/src/presentation/authoring/AuthoringPhaseVisual.tsx
+5 -5
View File
@@ -15,7 +15,7 @@ type AuthoringPhaseVisualProps = {
};
const InventoryVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection["visual"], { kind: "inventory" }> }) => (
<section className="authoring-visual authoring-visual--inventory" aria-label="discovery evidence">
<section className="authoring-visual authoring-visual--inventory" aria-label="discovery evidence" data-presentation-surface="editorial">
<div className="authoring-inventory__sources">
{visual.sources.map((source) => (
<div key={source}><Database aria-hidden="true" /><code>{source}</code></div>
@@ -31,7 +31,7 @@ const InventoryVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection[
);
const GraphVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection["visual"], { kind: "graph" }> }) => (
<section className="authoring-visual authoring-visual--graph" aria-label="draft graph evidence">
<section className="authoring-visual authoring-visual--graph" aria-label="draft graph evidence" data-presentation-surface="editorial">
<div className="authoring-graph__node"><Database aria-hidden="true" /><strong>{visual.nodes[0]}</strong></div>
<div className="authoring-graph__edge"><span>{visual.inputBinding}</span><ArrowRight aria-hidden="true" /></div>
<div className="authoring-graph__node"><Workflow aria-hidden="true" /><strong>{visual.nodes[1]}</strong></div>
@@ -41,7 +41,7 @@ const GraphVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection["vis
);
const RepairVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection["visual"], { kind: "repair" }> }) => (
<section className="authoring-visual authoring-visual--repair" aria-label="validation repair evidence">
<section className="authoring-visual authoring-visual--repair" aria-label="validation repair evidence" data-presentation-surface="editorial">
<div className="authoring-repair__diagnostic"><AlertTriangle aria-hidden="true" /><span>Diagnostic</span><strong>{visual.diagnostic}</strong></div>
<ArrowRight aria-hidden="true" />
<div className="authoring-repair__correction"><Link2 aria-hidden="true" /><span>Repair</span><code>{visual.correction}</code></div>
@@ -50,7 +50,7 @@ const RepairVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection["vi
);
const ArtifactVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection["visual"], { kind: "artifact" }> }) => (
<section className="authoring-visual authoring-visual--artifact" aria-label="artifact evidence">
<section className="authoring-visual authoring-visual--artifact" aria-label="artifact evidence" data-presentation-surface="editorial">
<LockKeyhole aria-hidden="true" />
<div><span>Immutable workflow artifact</span><strong>{visual.artifactId}</strong></div>
<dl><div><dt>Version</dt><dd>Version {visual.version}</dd></div><div><dt>Requirements</dt><dd>{visual.requiredSources} local sources</dd></div></dl>
@@ -58,7 +58,7 @@ const ArtifactVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection["
);
const BindingsVisual = ({ visual }: { visual: Extract<AuthoringPhaseProjection["visual"], { kind: "bindings" }> }) => (
<section className="authoring-visual authoring-visual--bindings" aria-label="deployment binding evidence">
<section className="authoring-visual authoring-visual--bindings" aria-label="deployment binding evidence" data-presentation-surface="editorial">
<header><Link2 aria-hidden="true" /><div><span>Deployment</span><strong>{visual.deploymentId}</strong></div><b><CheckCircle2 aria-hidden="true" />{visual.status}</b></header>
<div className="authoring-bindings__rows">
{visual.bindings.map((binding) => (
web/apps/console/src/presentation/authoring/PreparedAuthoringLifecycleScene.test.tsx
+4
View File
@@ -15,6 +15,10 @@ const renderBeat = (beatId: string) => {
describe("PreparedAuthoringLifecycleScene", () => {
it("discover shows sources, capabilities, and schema", () => {
renderBeat("discover");
expect(screen.getByRole("region", { name: "prepared workflow authoring lifecycle" })).toHaveAttribute(
"data-presentation-surface",
"editorial",
);
expect(screen.getByText("Discover")).toBeInTheDocument();
expect(screen.getAllByText(/sources|capabilities|schema/i).length).toBeGreaterThanOrEqual(1);
});
web/apps/console/src/presentation/authoring/PreparedAuthoringLifecycleScene.tsx
+1
View File
@@ -42,6 +42,7 @@ export const PreparedAuthoringLifecycleScene = ({ scene, beat }: PreparedAuthori
data-active-phase={beatId}
data-primary-surface="authoring-phase"
data-support-surface="prepared-chat"
data-presentation-surface="editorial"
>
<ol className="prepared-lifecycle-scene__rail" aria-label="authoring phase rail">
{phases.map((phase) => (
web/apps/console/src/presentation/presentation.css
+19
View File
@@ -36,6 +36,25 @@
background: transparent;
}
.agent-handoff-scene[data-presentation-surface="editorial"],
.prepared-lifecycle-scene[data-presentation-surface="editorial"],
.authoring-visual[data-presentation-surface="editorial"] {
--authoring-paper: var(--color-editorial-paper, oklch(0.975 0.012 82));
--authoring-ink: var(--color-editorial-ink, oklch(0.19 0.015 65));
--authoring-muted: var(--color-editorial-muted, oklch(0.48 0.025 65));
--authoring-rule: color-mix(in oklch, var(--authoring-muted) 32%, transparent);
background: var(--authoring-paper);
color: var(--authoring-ink);
}
.presentation-stage__primary > .agent-handoff-scene,
.presentation-stage__primary > .prepared-lifecycle-scene {
margin: 0;
border: 0;
border-radius: 0;
padding: 0;
}
.presentation-stage {
--presentation-footer-height: 2.5rem;
position: relative;