File size: 1,128 Bytes
a18645a
 
dc3ebef
a18645a
bdf2455
a18645a
 
fcd804b
a07e9cb
a18645a
 
 
a07e9cb
321edbc
dc3ebef
 
bdf2455
fcd804b
a18645a
a07e9cb
d994c06
 
 
 
 
a18645a
 
 
 
 
 
 
fcd804b
a18645a
 
dc3ebef
a18645a
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<script lang="ts">
  import { type NodeProps } from '@xyflow/svelte';
  import { Tabulator } from 'tabulator-tables';
  import LynxKiteNode from './LynxKiteNode.svelte';
  import Table from './Table.svelte';
  type $$Props = NodeProps;
  export let data: $$Props['data'];
  const open = {};
  $: single = data.display?.dataframes && Object.keys(data.display.dataframes).length === 1;
</script>

<LynxKiteNode {...$$props}>
  {#if data.display}
    {#each Object.entries(data.display.dataframes || {}) as [name, df]}
      {#if !single}<div class="df-head" on:click={() => open[name] = !open[name]}>{name}</div>{/if}
      {#if single || open[name]}
        <Table columns={df.columns} data={df.data} />
      {/if}
    {/each}
    {#each Object.entries(data.display.others || {}) as [name, o]}
      <div class="df-head" on:click={() => open[name] = !open[name]}>{name}</div>
      {#if open[name]}
      <pre>{o}</pre>
      {/if}
    {/each}
  {/if}
</LynxKiteNode>
<style>
  .df-head {
    font-weight: bold;
    padding: 8px;
    background: #f0f0f0;
    cursor: pointer;
  }
  table {
    table-layout: fixed;
  }
</style>