Track browser lowerer command boundaries
This commit is contained in:
Meta Vens
parent
44db1a2190
commit
7da165b300
12 changed files with 5857 additions and 2 deletions
3
.gitignore
vendored
3
.gitignore
vendored
|
|
@ -1,6 +1,9 @@
|
|||
.theos/
|
||||
packages/*
|
||||
!packages/.gitkeep
|
||||
!packages/eve-browser-lowering/
|
||||
!packages/eve-browser-lowering/**
|
||||
packages/eve-browser-lowering/node_modules/
|
||||
!packages/org.gamecult.eve.surface/
|
||||
!packages/org.gamecult.eve.surface/**
|
||||
!packages/org.gamecult.eve.unity-uitoolkit/
|
||||
|
|
|
|||
|
|
@ -310,6 +310,11 @@ Recently cut:
|
|||
and Unity UI Toolkit are `covered` because they advertise
|
||||
`gamecult.eve.command.v1`; Unity scene and TUI stay visible as
|
||||
`missing-runtime-claim` until their generic lowerers exist.
|
||||
- The browser reference lowerer now carries the active provider surface's
|
||||
advertised `worldInteraction.commandBoundary` and
|
||||
`worldInteraction.receiptSchema` into each `gamecult.eve.command.v1` intent.
|
||||
It can use component action metadata as a fallback, but the provider
|
||||
advertisement is the authority when present.
|
||||
- The conformance export carries `splitHandoffMoveCoverage[]`, joining runtime
|
||||
split handoff move sets to source path status. EveElectron now exposes the
|
||||
existing Aetheria `Aetheria.Rts.Web/Electron` and command transport paths as
|
||||
|
|
|
|||
|
|
@ -135,6 +135,12 @@ otherwise it reports `missing-runtime`, `missing-runtime-claim`,
|
|||
`missing-provider-boundary`, or `missing-command-transport`. Consumer smokes can
|
||||
assert it with
|
||||
`--expect-command-boundary-coverage <providerId:surfaceId:targetId:status:ownerRepo:runtimeId>`.
|
||||
The browser reference lowerer also copies the active surface's advertised
|
||||
`worldInteraction.commandBoundary` and `worldInteraction.receiptSchema` into
|
||||
`gamecult.eve.command.v1` intents, falling back to component action metadata
|
||||
only when the advertisement lacks those fields. That keeps command routing on
|
||||
the provider/plugin advertisement contract instead of letting the browser
|
||||
reference probe provider source layout.
|
||||
Declared runtime/plugin projection gaps are exported as
|
||||
`runtimePluginProjectionGaps[]`. These records carry runtime id, runtime owner,
|
||||
split target, plugin id, reason, severity, and fixture lists so EveUnity,
|
||||
|
|
|
|||
14
packages/eve-browser-lowering/README.md
Normal file
14
packages/eve-browser-lowering/README.md
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
# @gamecult/eve-browser-lowering
|
||||
|
||||
Browser DOM/CSS lowering for `gamecult.eve.surface.v1` documents.
|
||||
|
||||
This package owns the shared browser renderer contract:
|
||||
|
||||
- `renderEveSurface(surface, host, options)` lowers an Eve surface document into a DOM host.
|
||||
- `renderEveComponent(component, options)` lowers a single component tree.
|
||||
- `applyEveSurfaceStyles(styles, body)` maps portable Eve style tokens to CSS custom properties.
|
||||
- `createEveCommandIntent(commandId, props, options)` creates the browser command envelope for host daemons and carries the provider-advertised `commandBoundary` / `receiptSchema` when the active surface exposes `worldInteraction`.
|
||||
|
||||
Host applications own transport and command delivery. Providers own command acceptance and receipts through their advertisements. For example, Eir resolves surfaces through Odin/CultMesh and posts commands to `/eir/command`; Aetheria resolves surfaces through Electron IPC. Neither host should duplicate DOM lowering or import provider internals to find a command route.
|
||||
|
||||
Asset references are left as-is unless the host provides `assetUrlResolver`. Eir uses that hook only for CultMesh/CultCache asset URIs such as `cultmesh://schema/record` or `cultcache://schema/record`; ordinary HTTPS assets and web fonts remain ordinary browser URLs.
|
||||
90
packages/eve-browser-lowering/dist/index.d.ts
vendored
Normal file
90
packages/eve-browser-lowering/dist/index.d.ts
vendored
Normal file
|
|
@ -0,0 +1,90 @@
|
|||
export interface EveSurfaceComponent {
|
||||
id?: string;
|
||||
kind?: string;
|
||||
text?: string;
|
||||
commandId?: string;
|
||||
props?: Record<string, unknown>;
|
||||
layout?: Record<string, unknown>;
|
||||
style?: Record<string, unknown>;
|
||||
children?: EveSurfaceComponent[];
|
||||
embeddedDocuments?: Array<Record<string, unknown>>;
|
||||
}
|
||||
export interface EveSurfaceDocument {
|
||||
providerId?: string;
|
||||
title?: string;
|
||||
version?: number;
|
||||
surface?: {
|
||||
id?: string;
|
||||
title?: string;
|
||||
root?: EveSurfaceComponent;
|
||||
styles?: EveSurfaceStyles;
|
||||
};
|
||||
mesh?: unknown;
|
||||
}
|
||||
export type EveSurfaceStyles = {
|
||||
tokens?: Record<string, unknown>;
|
||||
assets?: {
|
||||
fontCss?: string;
|
||||
};
|
||||
controlSkins?: Record<string, {
|
||||
children?: EveSurfaceComponent[];
|
||||
}>;
|
||||
} | Array<{
|
||||
name?: string;
|
||||
value?: unknown;
|
||||
}>;
|
||||
export interface EveCommandIntent {
|
||||
type: "surface-command";
|
||||
schema: "gamecult.eve.command.v1";
|
||||
providerId: string;
|
||||
surfaceId: string;
|
||||
command: string;
|
||||
commandBoundary?: string;
|
||||
receiptSchema?: string;
|
||||
payload: Record<string, unknown>;
|
||||
issuedAt: string;
|
||||
clientId: string;
|
||||
}
|
||||
export interface EveSurfaceWorldInteraction {
|
||||
commandBoundary?: string;
|
||||
receiptSchema?: string;
|
||||
}
|
||||
export interface EveProviderSurfaceAdvertisement {
|
||||
surfaceId?: string;
|
||||
worldInteraction?: EveSurfaceWorldInteraction;
|
||||
}
|
||||
export interface EveProviderAdvertisement {
|
||||
providerId?: string;
|
||||
surfaces?: EveProviderSurfaceAdvertisement[];
|
||||
localAdvertisement?: {
|
||||
surfaces?: EveProviderSurfaceAdvertisement[];
|
||||
};
|
||||
}
|
||||
export interface EveBrowserLoweringOptions {
|
||||
assetBaseUrl?: string;
|
||||
assetUrlResolver?: (uri: string, surface: EveSurfaceDocument | undefined) => string;
|
||||
body?: HTMLElement;
|
||||
clientId?: string;
|
||||
commandSink?: (intent: EveCommandIntent, component: EveSurfaceComponent) => void | Promise<void>;
|
||||
documentResolver?: (request: EveEmbeddedDocumentRequest, component: EveSurfaceComponent) => Promise<EveResolvedDocument | EveSurfaceDocument | EveSurfaceDocument["surface"] | undefined>;
|
||||
provider?: EveProviderAdvertisement;
|
||||
source?: string;
|
||||
statusElement?: HTMLElement;
|
||||
}
|
||||
export interface EveEmbeddedDocumentRequest {
|
||||
documentId: string;
|
||||
presentationKind?: string;
|
||||
schemaId?: string;
|
||||
slotId?: string;
|
||||
}
|
||||
export interface EveResolvedDocument {
|
||||
document?: unknown;
|
||||
documentId?: string;
|
||||
schemaId?: string;
|
||||
surface?: EveSurfaceDocument["surface"];
|
||||
}
|
||||
export declare function renderEveSurface(surface: EveSurfaceDocument, host: HTMLElement, options?: EveBrowserLoweringOptions): HTMLElement;
|
||||
export declare function renderEveComponent(node: EveSurfaceComponent, options?: EveBrowserLoweringOptions): HTMLElement;
|
||||
export declare function applyEveSurfaceStyles(styles: EveSurfaceStyles | undefined, body?: HTMLElement): void;
|
||||
export declare function createEveCommandIntent(commandId: string, props?: Record<string, unknown>, options?: EveBrowserLoweringOptions): EveCommandIntent;
|
||||
export declare function emptyState(message: string): HTMLElement;
|
||||
2174
packages/eve-browser-lowering/dist/index.js
vendored
Normal file
2174
packages/eve-browser-lowering/dist/index.js
vendored
Normal file
File diff suppressed because it is too large
Load diff
29
packages/eve-browser-lowering/package-lock.json
generated
Normal file
29
packages/eve-browser-lowering/package-lock.json
generated
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
{
|
||||
"name": "@gamecult/eve-browser-lowering",
|
||||
"version": "0.1.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "@gamecult/eve-browser-lowering",
|
||||
"version": "0.1.0",
|
||||
"devDependencies": {
|
||||
"typescript": "^5.6.3"
|
||||
}
|
||||
},
|
||||
"node_modules/typescript": {
|
||||
"version": "5.9.3",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
|
||||
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"bin": {
|
||||
"tsc": "bin/tsc",
|
||||
"tsserver": "bin/tsserver"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.17"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
17
packages/eve-browser-lowering/package.json
Normal file
17
packages/eve-browser-lowering/package.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"name": "@gamecult/eve-browser-lowering",
|
||||
"version": "0.1.0",
|
||||
"type": "module",
|
||||
"main": "dist/index.js",
|
||||
"types": "dist/index.d.ts",
|
||||
"files": [
|
||||
"dist",
|
||||
"styles.css"
|
||||
],
|
||||
"scripts": {
|
||||
"build": "C:\\Progra~1\\nodejs\\node.exe ./node_modules/typescript/bin/tsc -p tsconfig.json"
|
||||
},
|
||||
"devDependencies": {
|
||||
"typescript": "^5.6.3"
|
||||
}
|
||||
}
|
||||
2513
packages/eve-browser-lowering/src/index.ts
Normal file
2513
packages/eve-browser-lowering/src/index.ts
Normal file
File diff suppressed because it is too large
Load diff
989
packages/eve-browser-lowering/styles.css
Normal file
989
packages/eve-browser-lowering/styles.css
Normal file
|
|
@ -0,0 +1,989 @@
|
|||
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+1:wght@100;300;400;500;700&family=Montserrat:wght@100;300;400;500;700&family=Ubuntu+Sans:wght@300;400;500;700&family=Zen+Kaku+Gothic+New:wght@300;400;500;700&display=swap");
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
--bg: #020909;
|
||||
--bg-top: var(--bg);
|
||||
--bg-mid: var(--bg);
|
||||
--bg-bottom: var(--bg);
|
||||
--shell-top: #010707;
|
||||
--shell-bottom: #010707;
|
||||
--panel: #071918;
|
||||
--panel-2: #0a2423;
|
||||
--line: rgba(103, 240, 228, 0.28);
|
||||
--line-deep: rgba(103, 240, 228, 0.18);
|
||||
--line-hot: rgba(142, 252, 255, 0.72);
|
||||
--text: #e7f1f1;
|
||||
--text-bright: var(--text);
|
||||
--quiet: #8ba5a3;
|
||||
--accent: #ffb84f;
|
||||
--accent-strong: var(--accent);
|
||||
--corner-accent: var(--accent);
|
||||
--cyan: #8efcff;
|
||||
--shadow: rgba(0, 0, 0, 0.35);
|
||||
--pixel-grid: rgba(142, 252, 255, 0.04);
|
||||
--border-width: 1px;
|
||||
--border-bottom-width: var(--border-width);
|
||||
--corner-accent-size: 0;
|
||||
--font-body: "M PLUS 1", "Ubuntu Sans", Ubuntu, "Noto Sans JP", system-ui, sans-serif;
|
||||
--font-title: "Montserrat", "Zen Kaku Gothic New", "M PLUS 1", "Ubuntu Sans", system-ui, sans-serif;
|
||||
--font-mono: "Ubuntu Sans Mono", "M PLUS 1 Code", "Cascadia Mono", Consolas, monospace;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(180deg, var(--bg-top), var(--bg-mid), var(--bg-bottom));
|
||||
color: var(--text);
|
||||
font-family: var(--font-body);
|
||||
}
|
||||
|
||||
.topbar {
|
||||
height: 84px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 10px 16px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: linear-gradient(180deg, var(--shell-top), var(--shell-bottom));
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 4px 0 0;
|
||||
color: var(--quiet);
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.hud {
|
||||
min-width: 168px;
|
||||
padding: 8px;
|
||||
border: 1px solid var(--line-hot);
|
||||
border-radius: 6px;
|
||||
background: rgba(7, 25, 24, 0.88);
|
||||
color: var(--accent);
|
||||
font-family: "Cascadia Mono", Consolas, monospace;
|
||||
font-size: 11px;
|
||||
display: grid;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.provider-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 10px 16px;
|
||||
border-bottom: 1px solid var(--line-deep);
|
||||
background: color-mix(in srgb, var(--panel) 70%, transparent);
|
||||
}
|
||||
|
||||
.provider-bar label {
|
||||
color: var(--quiet);
|
||||
font: 700 11px var(--font-mono);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.provider-bar select {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: var(--panel);
|
||||
color: var(--text);
|
||||
padding: 8px 12px;
|
||||
font: 700 13px var(--font-mono);
|
||||
min-width: min(28rem, 52vw);
|
||||
}
|
||||
|
||||
.provider-meta {
|
||||
color: var(--quiet);
|
||||
font: 600 11px var(--font-mono);
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.surface {
|
||||
padding: 10px 16px 16px;
|
||||
}
|
||||
|
||||
.cockpit {
|
||||
display: grid;
|
||||
grid-template-columns: 0.78fr 1.08fr 1.34fr;
|
||||
gap: 10px;
|
||||
min-height: calc(100vh - 138px);
|
||||
}
|
||||
|
||||
.ctb {
|
||||
grid-column: 1 / -1;
|
||||
min-height: 88px;
|
||||
overflow-x: auto;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
|
||||
.pane {
|
||||
min-height: 0;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: rgba(7, 25, 24, 0.92);
|
||||
padding: 12px;
|
||||
box-shadow: 0 12px 26px var(--shadow);
|
||||
}
|
||||
|
||||
.pane h2 {
|
||||
margin: 0 0 10px;
|
||||
color: var(--quiet);
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.card {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: rgba(10, 36, 35, 0.96);
|
||||
padding: 10px;
|
||||
box-shadow: 0 8px 20px var(--shadow);
|
||||
}
|
||||
|
||||
.cultui-card[data-command-id] {
|
||||
cursor: pointer;
|
||||
border-bottom-width: var(--border-bottom-width);
|
||||
}
|
||||
|
||||
.cultui-card-button {
|
||||
display: block;
|
||||
width: 100%;
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.ctb .card {
|
||||
flex: 0 0 96px;
|
||||
min-height: 76px;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--line-hot);
|
||||
object-fit: cover;
|
||||
background: #123;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
white-space: pre-line;
|
||||
margin-top: 4px;
|
||||
font: 700 11px var(--font-mono);
|
||||
}
|
||||
|
||||
.health {
|
||||
color: var(--accent);
|
||||
font: 700 10px var(--font-mono);
|
||||
}
|
||||
|
||||
.detail {
|
||||
white-space: pre-wrap;
|
||||
font: 600 12px var(--font-mono);
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.list {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.metrics {
|
||||
display: grid;
|
||||
gap: 9px;
|
||||
margin: 12px 0;
|
||||
}
|
||||
|
||||
.metric label {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: var(--quiet);
|
||||
font: 700 10px var(--font-mono);
|
||||
}
|
||||
|
||||
.bar {
|
||||
height: 7px;
|
||||
border-radius: 7px;
|
||||
background: #010707;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bar span {
|
||||
display: block;
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, #bca8ff, #8efcff);
|
||||
}
|
||||
|
||||
.graph {
|
||||
position: relative;
|
||||
min-height: calc(100vh - 166px);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background:
|
||||
linear-gradient(var(--pixel-grid) 1px, transparent 1px),
|
||||
linear-gradient(90deg, var(--pixel-grid) 1px, transparent 1px),
|
||||
rgba(3, 15, 17, 0.94);
|
||||
background-size: 44px 44px;
|
||||
}
|
||||
|
||||
.node {
|
||||
position: absolute;
|
||||
transform: translate(-50%, -50%);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 7px;
|
||||
background: rgba(10, 36, 35, 0.95);
|
||||
padding: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.node.selected {
|
||||
border-color: var(--line-hot);
|
||||
box-shadow: 0 0 0 1px rgba(142, 252, 255, 0.38);
|
||||
}
|
||||
|
||||
.node .detail {
|
||||
margin-top: 6px;
|
||||
color: var(--quiet);
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.cockpit {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
.cultui-vn-stage {
|
||||
position: relative;
|
||||
min-height: calc(100vh - 138px);
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: var(--bg);
|
||||
}
|
||||
|
||||
.cultui-grid {
|
||||
min-height: calc(100vh - 138px);
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
|
||||
gap: 10px;
|
||||
align-content: start;
|
||||
}
|
||||
|
||||
.cultui-surface-root {
|
||||
min-height: calc(100vh - 150px);
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
|
||||
gap: 12px;
|
||||
align-content: start;
|
||||
}
|
||||
|
||||
.cultui-surface-root[data-direction="vertical"] {
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
}
|
||||
|
||||
.cultui-surface-root[data-direction="horizontal"] {
|
||||
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
|
||||
}
|
||||
|
||||
.cultui-embedded-slot .cultui-surface-root {
|
||||
min-height: 0;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.cultui-pane[data-span="wide"] {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
}
|
||||
|
||||
.cultui-pane {
|
||||
border-width: var(--border-width);
|
||||
border-bottom-width: var(--border-bottom-width);
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.cultui-pane[data-span="wide"] {
|
||||
grid-column: span 2;
|
||||
}
|
||||
|
||||
.cultui-pane .cultui-pane {
|
||||
box-shadow: none;
|
||||
background: rgba(3, 15, 17, 0.38);
|
||||
}
|
||||
|
||||
.cultui-pane[data-density="compact"] {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.cultui-pane[data-density="compact"] h2 {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.cultui-partition {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.cultui-partition[data-direction="horizontal"] {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cultui-partition[data-direction="vertical"] {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cultui-partition[data-overflow="x"] {
|
||||
overflow-x: auto;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
|
||||
.cultui-partition.split-x {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cultui-partition.split-y,
|
||||
.cultui-partition.split-none {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cultui-partition.split-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
||||
}
|
||||
|
||||
.cultui-partition[data-role="inspector.row"] {
|
||||
min-height: 34px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.06);
|
||||
border-radius: 4px;
|
||||
background: linear-gradient(180deg, rgba(32, 31, 43, 0.96), rgba(19, 20, 29, 0.96));
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 2px 8px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.cultui-partition[data-role="inspector.label"] {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cultui-label {
|
||||
color: var(--accent);
|
||||
font: 700 13px var(--font-mono);
|
||||
line-height: 1.15;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.cultui-slider {
|
||||
--cultui-slider-value: 0%;
|
||||
--part-bleed: 0px;
|
||||
position: relative;
|
||||
display: grid;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
min-height: 18px;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.cultui-slider-visual {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
overflow: visible;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cultui-slider-input {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.cultui-slider-part {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
display: block;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.cultui-slider-part.track {
|
||||
right: 0;
|
||||
left: 0;
|
||||
height: 6px;
|
||||
border-radius: 2px;
|
||||
background: rgba(0, 0, 0, 0.34);
|
||||
}
|
||||
|
||||
.cultui-slider-part.fill {
|
||||
left: 0;
|
||||
width: var(--cultui-slider-value);
|
||||
height: 6px;
|
||||
border-radius: 2px;
|
||||
background: var(--accent);
|
||||
}
|
||||
|
||||
.cultui-slider-part.thumb {
|
||||
left: var(--cultui-slider-value);
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border-radius: 999px;
|
||||
background: var(--accent);
|
||||
transform: translate(-50%, -50%);
|
||||
box-shadow: 0 0 7px color-mix(in srgb, var(--accent) 45%, transparent);
|
||||
}
|
||||
|
||||
.cultui-slider-part[data-anchor-value="true"] {
|
||||
left: var(--cultui-slider-value);
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
@media (max-width: 520px) {
|
||||
.cultui-partition[data-role="inspector.row"] {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.cultui-partition[data-role="inspector.label"] {
|
||||
flex: 0 0 auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
body[data-provider="repixelizer"] .surface {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
body[data-provider="repixelizer"] .surface::after {
|
||||
content: "";
|
||||
pointer-events: none;
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 4px);
|
||||
opacity: 0.28;
|
||||
mix-blend-mode: screen;
|
||||
}
|
||||
|
||||
body[data-pixel-art="true"] img,
|
||||
body[data-pixel-art="true"] .cultui-background {
|
||||
image-rendering: pixelated;
|
||||
}
|
||||
|
||||
.cultui-title {
|
||||
color: var(--accent);
|
||||
font: 100 18px var(--font-title);
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.mono {
|
||||
color: var(--accent);
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
.cultui-reactive-metric {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.cultui-reactive-list {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.cultui-list {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.cultui-list-title {
|
||||
margin: 0;
|
||||
color: var(--quiet);
|
||||
font: 700 10px var(--font-mono);
|
||||
letter-spacing: 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.cultui-avatar-card {
|
||||
flex: 0 0 104px;
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
align-content: start;
|
||||
min-height: 92px;
|
||||
margin: 0;
|
||||
padding: 8px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: rgba(10, 36, 35, 0.94);
|
||||
box-shadow: 0 8px 20px var(--shadow);
|
||||
}
|
||||
|
||||
.cultui-avatar-card img,
|
||||
.cultui-avatar-fallback {
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border: 1px solid var(--line-hot);
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
background: rgba(1, 7, 7, 0.86);
|
||||
}
|
||||
|
||||
.cultui-avatar-fallback {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
color: var(--accent);
|
||||
font: 700 12px var(--font-mono);
|
||||
}
|
||||
|
||||
.cultui-avatar-name {
|
||||
color: var(--text-bright);
|
||||
font: 700 11px var(--font-mono);
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
.cultui-avatar-status,
|
||||
.cultui-avatar-detail {
|
||||
color: var(--quiet);
|
||||
font: 700 10px var(--font-mono);
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.cultui-avatar-status {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.cultui-meter {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.cultui-meter-head {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
color: var(--quiet);
|
||||
font: 700 10px var(--font-mono);
|
||||
}
|
||||
|
||||
.cultui-meter-track {
|
||||
height: 7px;
|
||||
overflow: hidden;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
border-radius: 7px;
|
||||
background: rgba(1, 7, 7, 0.88);
|
||||
}
|
||||
|
||||
.cultui-meter-fill {
|
||||
display: block;
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, #ffb84f, #8efcff);
|
||||
}
|
||||
|
||||
.cultui-stream-item {
|
||||
border-left: 2px solid var(--line-hot);
|
||||
padding-left: 8px;
|
||||
}
|
||||
|
||||
.cultui-background {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
image-rendering: pixelated;
|
||||
opacity: 0.72;
|
||||
}
|
||||
|
||||
.cultui-graph {
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
left: 18px;
|
||||
width: min(48rem, 46vw);
|
||||
height: min(29rem, 52vh);
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
.cultui-placed {
|
||||
position: absolute;
|
||||
transform-origin: center;
|
||||
}
|
||||
|
||||
.cultui-placed[data-placement-mode="keystone"],
|
||||
.cultui-placed[data-placement-mode="skew"],
|
||||
.cultui-placed[data-placement-mode="sprite-chromakey"] {
|
||||
box-shadow: 0 12px 26px rgba(0, 0, 0, 0.28);
|
||||
}
|
||||
|
||||
.cultui-placed[data-chroma-key] {
|
||||
outline: 1px dashed rgba(0, 255, 120, 0.45);
|
||||
}
|
||||
|
||||
.cultui-node {
|
||||
position: absolute;
|
||||
transform: translate(-50%, -50%);
|
||||
border: 2px solid var(--cyan);
|
||||
border-radius: 999px;
|
||||
background: rgba(7, 17, 26, 0.76);
|
||||
color: var(--text);
|
||||
min-width: 68px;
|
||||
min-height: 44px;
|
||||
padding: 8px 10px;
|
||||
font: 700 12px "Cascadia Mono", Consolas, monospace;
|
||||
}
|
||||
|
||||
.cultui-node.selected {
|
||||
border-color: var(--accent);
|
||||
box-shadow: 0 0 0 2px rgba(255, 184, 79, 0.28);
|
||||
}
|
||||
|
||||
.cultui-graph svg {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.cultui-graph line {
|
||||
stroke: rgba(142, 252, 255, 0.36);
|
||||
stroke-width: 0.006;
|
||||
stroke-linecap: round;
|
||||
}
|
||||
|
||||
.cultui-layer-embedded-surfaces {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cultui-layer-embedded-surfaces > * {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.cultui-tex {
|
||||
min-width: 12rem;
|
||||
min-height: 3.2rem;
|
||||
border: 1px solid rgba(142, 252, 255, 0.34);
|
||||
border-radius: 6px;
|
||||
background: rgba(7, 17, 26, 0.78);
|
||||
color: var(--text);
|
||||
padding: 10px 12px;
|
||||
}
|
||||
|
||||
.cultui-tex-label {
|
||||
color: var(--accent);
|
||||
font: 700 10px "Cascadia Mono", Consolas, monospace;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.cultui-tex-source {
|
||||
margin-top: 4px;
|
||||
font: 700 15px "Cambria Math", "STIX Two Math", Georgia, serif;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.cultui-layer-cards {
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
right: 18px;
|
||||
left: calc(min(48rem, 46vw) + 36px);
|
||||
z-index: 3;
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.cultui-dialogue {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 5;
|
||||
min-height: 128px;
|
||||
border-right: 0;
|
||||
border-bottom: 0;
|
||||
border-left: 0;
|
||||
border-radius: 0;
|
||||
background: rgba(5, 8, 13, 0.92);
|
||||
}
|
||||
|
||||
.cultui-rail-actions {
|
||||
position: absolute;
|
||||
right: 18px;
|
||||
bottom: 18px;
|
||||
z-index: 6;
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
width: min(28rem, 42vw);
|
||||
}
|
||||
|
||||
.cultui-button {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: rgba(10, 36, 35, 0.94);
|
||||
color: var(--text);
|
||||
padding: 9px 10px;
|
||||
text-align: left;
|
||||
font: 700 12px "Cascadia Mono", Consolas, monospace;
|
||||
}
|
||||
|
||||
.cultui-button:hover,
|
||||
.cultui-button:focus-visible {
|
||||
border-color: var(--line-hot);
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.cultui-image-preview {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cultui-image-frame,
|
||||
.cultui-canvas-grid {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
min-height: 160px;
|
||||
border: 2px solid var(--panel-border);
|
||||
background:
|
||||
repeating-linear-gradient(45deg, rgba(247, 239, 216, 0.06) 0 8px, rgba(0, 0, 0, 0.18) 8px 16px),
|
||||
linear-gradient(180deg, #07172c, #0a2039);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.cultui-image-frame {
|
||||
aspect-ratio: 1 / 1;
|
||||
}
|
||||
|
||||
.cultui-image-frame img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.cultui-image-preview figcaption,
|
||||
.cultui-canvas-grid {
|
||||
color: var(--muted);
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.cultui-canvas-placeholder {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.cultui-canvas-placeholder.editor .cultui-canvas-grid {
|
||||
min-height: 280px;
|
||||
background:
|
||||
linear-gradient(45deg, rgba(255,255,255,0.08) 25%, transparent 25% 75%, rgba(255,255,255,0.08) 75%),
|
||||
linear-gradient(45deg, rgba(255,255,255,0.08) 25%, transparent 25% 75%, rgba(255,255,255,0.08) 75%),
|
||||
#142033;
|
||||
background-position: 0 0, 8px 8px;
|
||||
background-size: 16px 16px;
|
||||
}
|
||||
|
||||
.cultui-status-stage {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
padding: 12px;
|
||||
border: 2px solid var(--panel-border);
|
||||
background: rgba(6, 22, 39, 0.92);
|
||||
}
|
||||
|
||||
.cultui-field {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.cultui-field-value {
|
||||
display: block;
|
||||
border: 2px solid var(--panel-border);
|
||||
background: rgba(1, 4, 11, 0.58);
|
||||
padding: 6px 8px;
|
||||
}
|
||||
|
||||
.cultui-swatch {
|
||||
width: 36px;
|
||||
min-height: 36px;
|
||||
border: 2px solid var(--accent);
|
||||
box-shadow: inset 0 0 0 2px rgba(0,0,0,0.45);
|
||||
}
|
||||
|
||||
.cultui-binding-map {
|
||||
position: relative;
|
||||
min-height: 510px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background:
|
||||
linear-gradient(var(--pixel-grid) 1px, transparent 1px),
|
||||
linear-gradient(90deg, var(--pixel-grid) 1px, transparent 1px),
|
||||
rgba(3, 15, 17, 0.92);
|
||||
background-size: 28px 28px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.cultui-xbox-controller {
|
||||
position: absolute;
|
||||
inset: 18px;
|
||||
width: calc(100% - 36px);
|
||||
height: calc(100% - 36px);
|
||||
}
|
||||
|
||||
.cultui-xbox-controller .shell,
|
||||
.cultui-xbox-controller .stick,
|
||||
.cultui-xbox-controller .dpad,
|
||||
.cultui-xbox-controller .face,
|
||||
.cultui-xbox-controller .menu,
|
||||
.cultui-xbox-controller .guide,
|
||||
.cultui-xbox-controller .bumper,
|
||||
.cultui-xbox-controller .trigger {
|
||||
fill: rgba(10, 36, 35, 0.94);
|
||||
stroke: var(--line);
|
||||
stroke-width: 3;
|
||||
}
|
||||
|
||||
.cultui-xbox-controller .stick-dot,
|
||||
.cultui-xbox-controller .guide {
|
||||
fill: rgba(142, 252, 255, 0.12);
|
||||
}
|
||||
|
||||
.cultui-xbox-controller .face {
|
||||
fill: rgba(255, 184, 79, 0.16);
|
||||
}
|
||||
|
||||
.cultui-xbox-controller text {
|
||||
fill: var(--text);
|
||||
font: 700 16px var(--font-mono);
|
||||
text-anchor: middle;
|
||||
}
|
||||
|
||||
.cultui-binding-line {
|
||||
stroke: var(--accent);
|
||||
stroke-width: 2;
|
||||
stroke-dasharray: 5 6;
|
||||
opacity: 0.78;
|
||||
}
|
||||
|
||||
.cultui-binding-overlay {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
}
|
||||
|
||||
.cultui-binding-box {
|
||||
position: absolute;
|
||||
width: clamp(112px, 12vw, 138px);
|
||||
min-height: 50px;
|
||||
transform: translate(-50%, -50%);
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
border: 1px solid var(--line-hot);
|
||||
border-radius: 6px;
|
||||
background: rgba(7, 25, 24, 0.96);
|
||||
color: var(--text);
|
||||
padding: 8px;
|
||||
text-align: left;
|
||||
box-shadow: 0 10px 20px var(--shadow);
|
||||
}
|
||||
|
||||
.cultui-binding-box:hover,
|
||||
.cultui-binding-box:focus-visible {
|
||||
border-color: var(--accent);
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.cultui-binding-target {
|
||||
font: 700 11px var(--font-mono);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.cultui-binding-source {
|
||||
color: var(--quiet);
|
||||
font: 600 11px var(--font-mono);
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
.cultui-modal-backdrop {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 1000;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: rgba(0, 0, 0, 0.58);
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.cultui-modal {
|
||||
width: min(680px, 96vw);
|
||||
max-height: min(780px, 92vh);
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
border: 1px solid var(--line-hot);
|
||||
border-radius: 6px;
|
||||
background: var(--panel);
|
||||
box-shadow: 0 18px 42px rgba(0, 0, 0, 0.52);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.cultui-modal-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
padding: 12px 14px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: var(--shell-top);
|
||||
}
|
||||
|
||||
.cultui-modal-header h2 {
|
||||
margin: 0;
|
||||
color: var(--accent);
|
||||
font: 700 13px var(--font-mono);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.cultui-modal-close {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 6px;
|
||||
background: var(--panel-2);
|
||||
color: var(--text);
|
||||
padding: 7px 10px;
|
||||
font: 700 11px var(--font-mono);
|
||||
}
|
||||
|
||||
.cultui-modal-body {
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
padding: 14px;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.cultui-graph {
|
||||
right: 12px;
|
||||
left: 12px;
|
||||
width: auto;
|
||||
height: min(18rem, 34vh);
|
||||
}
|
||||
|
||||
.cultui-layer-cards {
|
||||
top: calc(30px + min(18rem, 34vh));
|
||||
right: 12px;
|
||||
left: 12px;
|
||||
}
|
||||
|
||||
.cultui-rail-actions {
|
||||
left: 12px;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
15
packages/eve-browser-lowering/tsconfig.json
Normal file
15
packages/eve-browser-lowering/tsconfig.json
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"declaration": true,
|
||||
"module": "ES2022",
|
||||
"moduleResolution": "Bundler",
|
||||
"noEmitOnError": true,
|
||||
"outDir": "dist",
|
||||
"rootDir": "src",
|
||||
"strict": true,
|
||||
"target": "ES2022"
|
||||
},
|
||||
"include": [
|
||||
"src/**/*.ts"
|
||||
]
|
||||
}
|
||||
|
|
@ -809,7 +809,7 @@
|
|||
},
|
||||
{
|
||||
"path": "packages/eve-browser-lowering/src/index.ts",
|
||||
"contains": ["surface.slot", "embeddedDocuments", "cultui-embedded-slot", "createEveCommandIntent", "resolveComponentCommandId"]
|
||||
"contains": ["surface.slot", "embeddedDocuments", "cultui-embedded-slot", "createEveCommandIntent", "resolveComponentCommandId", "localAdvertisement"]
|
||||
}
|
||||
],
|
||||
"commandTransportSmoke": {
|
||||
|
|
@ -818,7 +818,7 @@
|
|||
"expectedSourceSymbols": [
|
||||
{
|
||||
"path": "packages/eve-browser-lowering/src/index.ts",
|
||||
"contains": ["EveCommandIntent", "createEveCommandIntent", "schema: \"gamecult.eve.command.v1\"", "clientId"]
|
||||
"contains": ["EveCommandIntent", "createEveCommandIntent", "schema: \"gamecult.eve.command.v1\"", "clientId", "commandBoundary", "receiptSchema"]
|
||||
},
|
||||
{
|
||||
"path": "web/surface.js",
|
||||
|
|
|
|||
Loading…
Reference in a new issue