json row view

packages/web/src/celldata/JsonCellView.svelte

@@ -4,13 +4,22 @@
   import ErrorInfo from '../elements/ErrorInfo.svelte';
 
   export let selection;
+  export let showWholeRow = false;
 
   let json = null;
   let error = null;
 
   $: try {
-    const value = selection[0].value;
-    json = _.isPlainObject(value) || _.isArray(value) ? value : JSON.parse(value);
+    if (showWholeRow) {
+      if (selection?.length == 1) {
+        json = selection[0].rowData;
+      } else {
+        json = selection.map(x => x.rowData);
+      }
+    } else {
+      const value = selection[0].value;
+      json = _.isPlainObject(value) || _.isArray(value) ? value : JSON.parse(value);
+    }
     error = null;
   } catch (err) {
     error = err.message;

packages/web/src/celldata/JsonRowView.svelte

@@ -0,0 +1,6 @@
+<script lang="ts">
+  import JsonCellView from './JsonCellView.svelte';
+  export let selection;
+</script>
+
+<JsonCellView {selection} showWholeRow />

packages/web/src/widgets/CellDataWidget.svelte

@@ -18,6 +18,12 @@
       component: JsonCellView,
       single: true,
     },
+    {
+      type: 'jsonRow',
+      title: 'Json - Row',
+      component: JsonRowView,
+      single: false,
+    },
   ];
 
   function autodetect(selection) {
@@ -41,6 +47,7 @@
   import { onMount } from 'svelte';
 
   import JsonCellView from '../celldata/JsonCellView.svelte';
+  import JsonRowView from '../celldata/JsonRowView.svelte';
   import TextCellViewNoWrap from '../celldata/TextCellViewNoWrap.svelte';
   import TextCellViewWrap from '../celldata/TextCellViewWrap.svelte';
   import ErrorInfo from '../elements/ErrorInfo.svelte';