<script lang="ts">
  import Pos from './Pos.svelte';
  import Edge from './Edge.svelte';
  import type { Atom, Deps } from './Types';
  const { deps, atom }: { deps: Deps; atom: Atom } = $props();
</script>

{#if atom.EdgeMap}
  {@const em = atom.EdgeMap}
  <div class="context">
    {#each em.edges as e, n}
      {#if n > 0},
      {/if}<Edge edge={e} {deps} />
    {/each}
  </div>
{/if}
{#if atom.NewVertex}
  {@const c = atom.NewVertex}
  <div class="context">
    {#if c.up_context.length}
      <div class="change-newvertex-up">
        {#each c.up_context as cc}<Pos {deps} c={cc} />{/each}
      </div>
    {/if}
    {#if c.down_context.length}
      <div class="change-newvertex-down">
        {#each c.down_context as cc}<Pos {deps} c={cc} />{/each}
      </div>
    {/if}
  </div>
{/if}