aboutsummaryrefslogtreecommitdiff
path: root/source/library/components/ResultViewer.svelte
diff options
context:
space:
mode:
authornetop://ウィビ <paul@webb.page>2026-04-24 14:17:38 -0700
committernetop://ウィビ <paul@webb.page>2026-04-24 14:17:38 -0700
commit261f3bdb77799009344aab4a60686b7186ebd3b0 (patch)
tree8e87c6610a307f15f0c4b32f68b19424273fc6ad /source/library/components/ResultViewer.svelte
parent8a59f92d031963e23ecc84b75feecf43eb4dd146 (diff)
downloadgraphiql-261f3bdb77799009344aab4a60686b7186ebd3b0.tar.gz
graphiql-261f3bdb77799009344aab4a60686b7186ebd3b0.zip
Implement v0.4 subscriptions + v0.5 theming and plugin slots
- SSE and WebSocket fetchers via graphql-sse and graphql-ws, returning AsyncIterable results - SessionStore.run consumes AsyncIterable streams with subscriptionMode "append" (timestamped) or "replace" and honors an AbortSignal for cancellation - Chrome CSS variables documented in styles/theme.scss with prefers-color-scheme light/dark gating and .graphiql-light override - Svelte 5 snippet slots on GraphiQL: toolbarExtras, tabExtras, resultFooter
Diffstat (limited to 'source/library/components/ResultViewer.svelte')
-rw-r--r--source/library/components/ResultViewer.svelte16
1 files changed, 14 insertions, 2 deletions
diff --git a/source/library/components/ResultViewer.svelte b/source/library/components/ResultViewer.svelte
index e2c74fe..083828d 100644
--- a/source/library/components/ResultViewer.svelte
+++ b/source/library/components/ResultViewer.svelte
@@ -1,13 +1,15 @@
<script lang="ts">
import Editor from "./Editor.svelte";
import type { Extension } from "@codemirror/state";
+ import type { Snippet } from "svelte";
type Props = {
+ footer?: Snippet<[{ result: string }]>;
theme?: Extension;
value: string;
};
- let { theme, value }: Props = $props();
+ let { footer, theme, value }: Props = $props();
function noop(_v: string) {}
</script>
@@ -15,7 +17,7 @@
<style lang="scss">
.result {
display: grid;
- grid-template-rows: auto 1fr;
+ grid-template-rows: auto 1fr auto;
height: 100%;
min-height: 0;
}
@@ -27,9 +29,19 @@
padding: 0.25rem 0.75rem;
text-transform: uppercase;
}
+
+ .footer {
+ background: var(--graphiql-panel, #252526);
+ border-top: 1px solid var(--graphiql-border, #333);
+ font-size: 0.75rem;
+ padding: 0.25rem 0.75rem;
+ }
</style>
<div class="result">
<div class="label">Response</div>
<Editor language="json" onChange={noop} readOnly {theme} {value}/>
+ {#if footer}
+ <div class="footer">{@render footer({ result: value })}</div>
+ {/if}
</div>