# SSR Literal > A server-rendered proof that scoped component classes need the parent hash before hydration. **Source:** [https://scoped.svelte.page/examples/ssr-literal](https://scoped.svelte.page/examples/ssr-literal) **Markdown mirror:** [https://scoped.svelte.page/examples/ssr-literal.md](https://scoped.svelte.page/examples/ssr-literal.md) --- This mirror preserves the prose, implementation notes, and runnable Svelte source behind the live example page. ## FIG-001: server literal. The no-blink proof: the server-rendered child root already contains the parent hash for `scoped:class`, so the visual state is correct before client hydration runs. **Metadata:** tag: `SSR` | syntax: `scoped:class` | phase: `SSR` | status: `passing` ### Source #### SsrLiteral.svelte Source file: [src/lib/examples/scoped-props/demos/SsrLiteral.svelte](https://github.com/humanspeak/svelte-scoped-props/blob/main/docs/src/lib/examples/scoped-props/demos/SsrLiteral.svelte) ```svelte

Server-rendered output

Call-site intent

<div class="demo-card parent-owned"> Native markup establishes the parent-owned style the children are compared against.

<ChildCard scoped:class="parent-owned" /> The child root should match that parent-owned style before hydration.

<ChildCard class="dimmed" /> The plain class prop should stay child-owned with no parent style.

{#if ssrState.status === 'loading'}

Loading server-rendered HTML...

{:else if ssrState.status === 'error'}

{ssrState.message}

{:else}

Server check

Svelte generated {ssrState.parentHash ?? 'missing'} for the parent style block. The SSR HTML should include that class only where the call site opted in.

{card.label} {card.className} {getResultText(card)}

Raw server-rendered HTML

{formatServerHtml(ssrState.body)}

{/if}

``` #### SsrProbe.svelte Source file: [src/lib/examples/scoped-props/demos/SsrProbe.svelte](https://github.com/humanspeak/svelte-scoped-props/blob/main/docs/src/lib/examples/scoped-props/demos/SsrProbe.svelte) ```svelte

SSR native element

``` #### ChildCard.svelte Source file: [src/lib/examples/scoped-props/demos/components/ChildCard.svelte](https://github.com/humanspeak/svelte-scoped-props/blob/main/docs/src/lib/examples/scoped-props/demos/components/ChildCard.svelte) ```svelte

Child receives class="{classText}".

```