@graphenedata/cli 0.0.15 → 0.0.16

package/dist/ui/components/Table.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
   import type {Snippet} from 'svelte'
+  import type {QueryResult} from '../component-utilities/types.ts'
   import QueryLoad from './QueryLoad.svelte'
   import TableInner from './_Table.svelte'
 
   interface Props {
-    data: string
+    data: string | QueryResult
     children?: Snippet
     [key: string]: unknown
   }
@@ -14,7 +15,7 @@
   let spreadProps = $derived(Object.fromEntries(Object.entries(restProps).filter(([, value]) => value !== undefined)))
 </script>
 
-{#snippet tableContent(loaded: any[])}
+{#snippet tableContent(loaded: QueryResult)}
   {#if children}
     <TableInner {...spreadProps} data={loaded} {children} />
   {:else}

package/dist/ui/components/TableGroupRow.svelte

@@ -2,15 +2,14 @@
   import TableCell from './TableCell.svelte'
   import TableGroupToggle from './TableGroupToggle.svelte'
   import InlineDelta from './InlineDelta.svelte'
-  import {aggregateColumn, safeExtractColumn} from '../component-utilities/tableUtils'
-  import {formatValue, getFormatObjectFromString} from '../component-utilities/formatting.js'
-  import {toBoolean} from '../component-utilities/convert'
+  import {summarizeColumn, type SummaryMetric} from '../component-utilities/dataSummary.ts'
+  import {formatFromField} from '../component-utilities/format.ts'
+  import {toBoolean} from '../component-utilities/inputUtils'
 
   interface Props {
     groupName: string
     currentGroupData?: any[]
     toggled?: boolean
-    columnSummary?: any[]
     rowNumbers?: boolean | string
     rowColor?: string
     subtotals?: boolean | string
@@ -20,7 +19,7 @@
   }
 
   let {
-    groupName, currentGroupData = [], toggled = true, columnSummary = [],
+    groupName, currentGroupData = [], toggled = true,
     rowNumbers: rowNumbersProp = undefined, rowColor = undefined, subtotals: subtotalsProp = true,
     orderedColumns = [], compact: compactProp = undefined, onToggle,
   }: Props = $props()
@@ -29,6 +28,16 @@
   let subtotals = $derived(toBoolean(subtotalsProp) ?? true)
   let compact = $derived(toBoolean(compactProp))
 
+  const SUPPORTED_METRICS: SummaryMetric[] = ['sum', 'mean', 'median', 'min', 'max', 'count', 'countDistinct']
+
+  const getAggregateValue = (rows: Record<string, unknown>[], column: any) => {
+    let metric = column?.totalAgg as SummaryMetric | undefined
+    if (!metric && String(column?.type || '').toLowerCase() === 'number') metric = 'sum'
+    if (!metric || !SUPPORTED_METRICS.includes(metric)) return '-'
+    let summary = summarizeColumn(rows, column.field ?? {name: column.id, type: column.type}, [metric])
+    return summary[metric] ?? null
+  }
+
   const toggleGroup = () => onToggle?.({groupName})
 
   const handleKeydown = (event: KeyboardEvent) => {
@@ -38,12 +47,6 @@
     }
   }
 
-  const resolveFormat = (column: any, summary: any) => {
-    if (column.subtotalFmt) return getFormatObjectFromString(column.subtotalFmt)
-    if (column.totalFmt) return getFormatObjectFromString(column.totalFmt)
-    if (column.fmt) return getFormatObjectFromString(column.fmt, summary.format?.valueType)
-    return summary.format
-  }
 </script>
 
 <tr
@@ -63,8 +66,6 @@
   {/if}
 
   {#each orderedColumns as column, index (index)}
-    {@const summary = safeExtractColumn(column, columnSummary)}
-    {@const format = resolveFormat(column, summary)}
     {#if index === 0}
       {#if rowNumbers}
         <!-- Covered by the row-number label cell -->
@@ -77,30 +78,21 @@
       </TableCell>
       {/if}
     {:else if subtotals}
-      <TableCell class={summary.type} {compact} align={column.align}>
-        {#if ['sum', 'mean', 'median', 'min', 'max', 'weightedMean', 'count', 'countDistinct', undefined].includes(column.totalAgg) || column.subtotalFmt}
-          {#if column.contentType === 'delta'}
-            <InlineDelta
-              value={aggregateColumn(currentGroupData, column.id, column.totalAgg, summary.type, column.weightCol)}
-              downIsGood={column.downIsGood}
-              formatObject={format}
-              columnUnitSummary={summary.columnUnitSummary}
-              showValue={column.showValue}
-              showSymbol={column.deltaSymbol}
-              align={column.align}
-              neutralMin={column.neutralMin ?? 0}
-              neutralMax={column.neutralMax ?? 0}
-              chip={column.chip}
-            />
-          {:else}
-            {formatValue(
-              aggregateColumn(currentGroupData, column.id, column.totalAgg, summary.type, column.weightCol),
-              format,
-              summary.columnUnitSummary,
-            )}
-          {/if}
+      <TableCell class={column.type} {compact} align={column.align}>
+        {#if column.contentType === 'delta'}
+          <InlineDelta
+            value={getAggregateValue(currentGroupData, column)}
+            downIsGood={column.downIsGood}
+            field={column.field}
+            showValue={column.showValue}
+            showSymbol={column.deltaSymbol}
+            align={column.align}
+            neutralMin={column.neutralMin ?? 0}
+            neutralMax={column.neutralMax ?? 0}
+            chip={column.chip}
+          />
         {:else}
-          {column.totalAgg}
+          {formatFromField(column.field, getAggregateValue(currentGroupData, column))}
         {/if}
       </TableCell>
     {:else}

package/dist/ui/components/TableHarness.svelte

@@ -0,0 +1,32 @@
+<script lang="ts">
+  import Column from './Column.svelte'
+  import Table from './Table.svelte'
+
+  interface Props {
+    data: any
+    tableProps?: Record<string, unknown>
+    columns?: Record<string, unknown>[]
+    width?: number | string
+  }
+
+  let {data, tableProps = {}, columns = [], width = 880}: Props = $props()
+  let wrapperWidth = $derived(typeof width === 'number' ? `${width}px` : width)
+</script>
+
+<div class="table-harness" style:width={wrapperWidth}>
+  {#if columns.length > 0}
+    <Table data={data} {...tableProps}>
+      {#each columns as column, index (index)}
+        <Column {...column} />
+      {/each}
+    </Table>
+  {:else}
+    <Table data={data} {...tableProps} />
+  {/if}
+</div>
+
+<style>
+  .table-harness {
+    max-width: 100%;
+  }
+</style>

package/dist/ui/components/TableHeader.svelte

@@ -1,14 +1,12 @@
 <script lang="ts">
   import SortIcon from './SortIcon.svelte'
-  import {safeExtractColumn} from '../component-utilities/tableUtils'
-  import {toBoolean} from '../component-utilities/convert'
+  import {toBoolean} from '../component-utilities/inputUtils'
 
   interface Props {
     rowNumbers?: boolean | string
     headerColor?: string
     headerFontColor?: string
     orderedColumns?: any[]
-    columnSummary?: any[]
     sortable?: boolean | string
     sortClick?: (columnId: string) => () => void
     formatColumnTitles?: boolean | string
@@ -20,7 +18,7 @@
 
   let {
     rowNumbers: rowNumbersProp = false, headerColor = undefined, headerFontColor = undefined,
-    orderedColumns = [], columnSummary = [], sortable: sortableProp = true, sortClick = () => () => {},
+    orderedColumns = [], sortable: sortableProp = true, sortClick = () => () => {},
     formatColumnTitles: formatColumnTitlesProp = true, sortObj = {col: null, ascending: null},
     wrapTitles: wrapTitlesProp = false, compact: compactProp = false, link = undefined,
   }: Props = $props()
@@ -31,12 +29,11 @@
   let wrapTitles = $derived(toBoolean(wrapTitlesProp) ?? false)
   let compact = $derived(toBoolean(compactProp) ?? false)
 
-  const getWrapTitleAlignment = (column: any) => {
-    if (column.align === 'right') return 'header-title--align-end'
-    if (column.align === 'center') return 'header-title--align-center'
-    let extracted = safeExtractColumn(column, columnSummary)
-    if (extracted.type === 'number') return 'header-title--align-end'
-    return 'header-title--align-start'
+  const getHeaderAlignment = (column: any) => {
+    if (column.align) return column.align
+    if (['sparkline', 'sparkbar', 'sparkarea', 'bar'].includes(column.contentType)) return 'center'
+    if (column.type === 'number') return 'right'
+    return 'left'
   }
 
   const computeGroupSpans = (columns: any[]) => {
@@ -55,10 +52,10 @@
     return sortObj.ascending ? 'ascending' : 'descending'
   }
 
-  const resolveHeaderTitle = (column: any, summary: any) => {
+  const resolveHeaderTitle = (column: any) => {
     if (column.title) return column.title
-    if (formatColumnTitles) return summary.title
-    return summary.id
+    if (formatColumnTitles) return column.defaultTitle ?? column.id
+    return column.id
   }
 
   let columnsWithGroupSpan = $derived(computeGroupSpans(orderedColumns))
@@ -71,7 +68,7 @@
       {#if rowNumbers}
         <th class={`header-index ${compact ? 'header-index--compact' : ''}`} style:background-color={headerColor}></th>
       {/if}
-      {#each columnsWithGroupSpan as column (column.id)}
+      {#each columnsWithGroupSpan as column (column.identifier ?? column.id)}
         {#if column.colGroup && column.isNewGroup}
           <th class="header-group" colspan={column.span}>
             <div class="header-group__label">{column.colGroup}</div>
@@ -95,33 +92,28 @@
         style:color={headerFontColor}
       ></th>
     {/if}
-    {#each orderedColumns as column (column.id)}
-      {@const summary = safeExtractColumn(column, columnSummary)}
+    {#each orderedColumns as column (column.identifier ?? column.id)}
       <th
         role="columnheader"
-        class={`header-cell ${summary.type ?? ''} ${compact ? 'header-cell--compact' : ''}`}
+        class={`header-cell ${column.type ?? ''} ${compact ? 'header-cell--compact' : ''}`}
         style:color={headerFontColor}
         style:background={headerColor}
-        style:text-align={column.align ?? (['sparkline', 'sparkbar', 'sparkarea', 'bar'].includes(column.contentType) ? 'center' : undefined)}
+        style:text-align={getHeaderAlignment(column)}
         style:cursor={sortable ? 'pointer' : 'auto'}
         onclick={sortable ? sortClick(column.id) : undefined}
         aria-sort={getAriaSortValue(column.id)}
       >
-        <div class={`header-title ${wrapTitles || column.wrapTitle ? 'header-title--wrap' : ''} ${wrapTitles || column.wrapTitle ? getWrapTitleAlignment(column) : ''}`.trim()}>
-          <span class={`header-title__text ${wrapTitles || column.wrapTitle ? 'header-title__text--wrap' : ''}`}>
-            {resolveHeaderTitle(column, summary)}
-            {#if column.description}
-              <span class="header-title__info" title={column.description}>ⓘ</span>
-            {/if}
-          </span>
+        <span class={`header-title__text ${wrapTitles || column.wrapTitle ? 'header-title__text--wrap' : ''}`}>
+          {resolveHeaderTitle(column)}
+          {#if column.description}
+            <span class="header-title__info" title={column.description}>ⓘ</span>
+          {/if}
+        </span>
+        {#if sortObj.col === column.id}
           <span class="header-sort-indicator">
-            {#if sortObj.col === column.id}
-              <SortIcon ascending={sortObj.ascending ?? undefined} />
-            {:else}
-              <span class="header-sort-placeholder"><SortIcon ascending /></span>
-            {/if}
+            <SortIcon ascending={sortObj.ascending ?? undefined} />
           </span>
-        </div>
+        {/if}
       </th>
     {/each}
     {#if link}
@@ -178,40 +170,24 @@
   }
 
   .header-cell {
+    position: relative;
     padding: 2px 13px 2px 6px;
     vertical-align: bottom;
   }
 
-  .header-cell--compact {
-    padding: 1px 6px 1px 1px;
-    font-size: 12px;
+  .header-cell:first-child {
+    padding-left: 3px;
   }
 
-  .header-title {
-    display: flex;
-    align-items: flex-end;
-    justify-content: space-between;
-    gap: 4px;
-  }
-
-  .header-title--wrap {
-    align-items: stretch;
-  }
-
-  .header-title--align-end {
-    justify-content: flex-end;
-  }
-
-  .header-title--align-center {
-    justify-content: center;
-  }
-
-  .header-title--align-start {
-    justify-content: flex-start;
+  .header-cell--compact {
+    padding: 1px 16.5px 1px 1px;
+    font-size: 12px;
   }
 
   .header-title__text {
     display: inline-block;
+    max-width: 100%;
+    text-align: inherit;
     letter-spacing: -0.015em;
   }
 
@@ -227,14 +203,13 @@
   }
 
   .header-sort-indicator {
+    position: absolute;
+    right: 1px;
+    bottom: 4px;
     display: inline-flex;
     align-items: center;
   }
 
-  .header-sort-placeholder {
-    visibility: hidden;
-  }
-
   .header-link-cell {
     width: 24px;
   }

package/dist/ui/components/TableRow.svelte

@@ -2,8 +2,7 @@
   import chroma from 'chroma-js'
   import InlineDelta from './InlineDelta.svelte'
   import TableCell from './TableCell.svelte'
-  import {safeExtractColumn} from '../component-utilities/tableUtils'
-  import {formatValue, getFormatObjectFromString} from '../component-utilities/formatting.js'
+  import {formatFromField} from '../component-utilities/format.ts'
   import {getThemeStores} from '../component-utilities/themeStores'
 
   interface Props {
@@ -13,7 +12,7 @@
     rowNumbers?: boolean | string
     rowLines?: boolean | string
     index?: number
-    columnSummary?: any[]
+    columnLookup?: Record<string, any>
     grouped?: boolean
     groupType?: 'accordion' | 'section'
     groupColumn?: string
@@ -26,7 +25,7 @@
   let {
     displayedData = [], rowShading: rowShadingProp = undefined, link = undefined,
     rowNumbers: rowNumbersProp = undefined, rowLines: rowLinesProp = undefined, index = 0,
-    columnSummary = [], grouped = false, groupType = undefined, groupColumn = undefined,
+    columnLookup = {}, grouped = false, groupType = undefined, groupColumn = undefined,
     rowSpan = 1, groupNamePosition = 'middle', orderedColumns = [], compact: compactProp = undefined,
   }: Props = $props()
 
@@ -124,10 +123,9 @@
     {/if}
 
     {#each orderedColumns as column, k (k)}
-      {@const summary = safeExtractColumn(column, columnSummary)}
-      {@const scaleSummary = column.scaleColumn ? columnSummary.find((d) => d.id === column.scaleColumn) : summary}
-      {@const columnMin = column.colorMin ?? scaleSummary?.columnUnitSummary?.min}
-      {@const columnMax = column.colorMax ?? scaleSummary?.columnUnitSummary?.max}
+      {@const scaleSummary = column.scaleColumn ? columnLookup[column.scaleColumn] : column}
+      {@const columnMin = column.colorMin ?? scaleSummary?.stats?.min}
+      {@const columnMax = column.colorMax ?? scaleSummary?.stats?.max}
       {@const colorScale = column.contentType === 'colorscale'
         ? computeColorScale(column, columnMin, columnMax)
         : undefined}
@@ -145,21 +143,15 @@
         if (contentContrast < backgroundContrast) return $theme.colors['base-100']
         return $theme.colors['base-content']
       })()}
-      {@const columnFormat = (() => {
-        if (column.fmt) return getFormatObjectFromString(column.fmt, summary.format?.valueType)
-        if (column.fmtColumn && row[column.fmtColumn]) {
-          return getFormatObjectFromString(row[column.fmtColumn], summary.format?.valueType)
-        }
-        return summary.format
-      })()}
       {@const paddingLeft = k === 0 && grouped && groupType === 'accordion' && !rowNumbers ? '28px' : undefined}
-      {@const shouldShow = !(groupType === 'section' && groupColumn === summary.id && i !== 0)}
+      {@const shouldShow = !(groupType === 'section' && groupColumn === column.id && i !== 0)}
       <TableCell
-        class={summary?.type}
+        class={column?.type}
         {compact}
         verticalAlign={groupType === 'section' ? groupNamePosition : undefined}
-        rowSpan={groupType === 'section' && groupColumn === summary.id && i === 0 ? rowSpan : 1}
+        rowSpan={groupType === 'section' && groupColumn === column.id && i === 0 ? rowSpan : 1}
         {paddingLeft}
+        align={column.align}
         wrap={column.wrap}
         cellColor={formattedColor}
         fontColor={fontColor}
@@ -185,21 +177,12 @@
             >
               {#if column.linkLabel != undefined}
                 {#if row[column.linkLabel] != undefined}
-                  {@const labelSummary = safeExtractColumn({id: column.linkLabel}, columnSummary)}
-                  {formatValue(
-                    row[column.linkLabel],
-                    column.fmt ? getFormatObjectFromString(column.fmt, labelSummary.format?.valueType) : labelSummary.format,
-                    labelSummary.columnUnitSummary,
-                  )}
+                  {formatFromField(columnLookup[column.linkLabel]?.field, row[column.linkLabel])}
                 {:else}
                   {column.linkLabel}
                 {/if}
               {:else}
-                {formatValue(
-                  row[column.id],
-                  column.fmt ? getFormatObjectFromString(column.fmt, summary.format?.valueType) : summary.format,
-                  summary.columnUnitSummary,
-                )}
+                {formatFromField(column.field, row[column.id])}
               {/if}
             </a>
           {/if}
@@ -207,8 +190,7 @@
           <InlineDelta
             value={row[column.id]}
             downIsGood={column.downIsGood}
-            formatObject={columnFormat}
-            columnUnitSummary={summary.columnUnitSummary}
+            field={column.field}
             showValue={column.showValue}
             showSymbol={column.deltaSymbol}
             align={column.align}
@@ -217,13 +199,7 @@
             chip={column.chip}
           />
         {:else}
-          {#if row[column.id] === null || row[column.id] === undefined}
-            –
-          {:else if summary.type === 'number'}
-            {formatValue(row[column.id], columnFormat, summary.columnUnitSummary)}
-          {:else}
-            {formatValue(row[column.id], columnFormat, summary.columnUnitSummary)}
-          {/if}
+          {formatFromField(column.field, row[column.id])}
         {/if}
       </TableCell>
     {/each}

package/dist/ui/components/TableSubtotalRow.svelte

@@ -1,14 +1,13 @@
 <script lang="ts">
   import InlineDelta from './InlineDelta.svelte'
-  import {aggregateColumn, safeExtractColumn} from '../component-utilities/tableUtils'
-  import {formatValue, getFormatObjectFromString} from '../component-utilities/formatting.js'
+  import {summarizeColumn, type SummaryMetric} from '../component-utilities/dataSummary.ts'
+  import {formatFromField} from '../component-utilities/format.ts'
   import TableCell from './TableCell.svelte'
-  import {toBoolean} from '../component-utilities/convert'
+  import {toBoolean} from '../component-utilities/inputUtils'
 
   interface Props {
     groupName?: string
     currentGroupData?: any[]
-    columnSummary?: any[]
     rowColor?: string
     groupBy?: string
     groupType?: 'accordion' | 'section'
@@ -19,12 +18,22 @@
   }
 
   let {
-    groupName = undefined, currentGroupData = [], columnSummary = [], rowColor = undefined,
+    groupName = undefined, currentGroupData = [], rowColor = undefined,
     groupBy = undefined, groupType = undefined, rowNumbers: rowNumbersProp = undefined,
     fontColor = undefined, orderedColumns = [], compact = undefined,
   }: Props = $props()
 
   let rowNumbers = $derived(toBoolean(rowNumbersProp) ?? false)
+
+  const SUPPORTED_METRICS: SummaryMetric[] = ['sum', 'mean', 'median', 'min', 'max', 'count', 'countDistinct']
+
+  const getAggregateValue = (rows: Record<string, unknown>[], column: any) => {
+    let metric = column?.totalAgg as SummaryMetric | undefined
+    if (!metric && String(column?.type || '').toLowerCase() === 'number') metric = 'sum'
+    if (!metric || !SUPPORTED_METRICS.includes(metric)) return '-'
+    let summary = summarizeColumn(rows, column.field ?? {name: column.id, type: column.type}, [metric])
+    return summary[metric] ?? null
+  }
 </script>
 
 <tr class="subtotal-row" style:background-color={rowColor} style:color={fontColor}>
@@ -32,21 +41,13 @@
     <TableCell class="index" {compact}></TableCell>
   {/if}
   {#each orderedColumns as column (column.id)}
-    {@const summary = safeExtractColumn(column, columnSummary)}
-    {@const baseFormat = column.fmt ? getFormatObjectFromString(column.fmt, summary.format?.valueType) : summary.format}
-    {@const format = (() => {
-      if (column.subtotalFmt) return getFormatObjectFromString(column.subtotalFmt)
-      if (column.totalFmt) return getFormatObjectFromString(column.totalFmt)
-      return baseFormat
-    })()}
-    <TableCell class={summary.type} {compact} align={column.align}>
+    <TableCell class={column.type} {compact} align={column.align}>
       {#if column.id !== groupBy}
         {#if column.contentType === 'delta'}
           <InlineDelta
-            value={aggregateColumn(currentGroupData, column.id, column.totalAgg, summary.type, column.weightCol)}
+            value={getAggregateValue(currentGroupData, column)}
             downIsGood={column.downIsGood}
-            formatObject={baseFormat}
-            columnUnitSummary={summary.columnUnitSummary}
+            field={column.field}
             showValue={column.showValue}
             showSymbol={column.deltaSymbol}
             align={column.align}
@@ -55,11 +56,7 @@
             chip={column.chip}
           />
         {:else}
-          {formatValue(
-            aggregateColumn(currentGroupData, column.id, column.totalAgg, summary.type, column.weightCol),
-            format,
-            summary.columnUnitSummary,
-          )}
+          {formatFromField(column.field, getAggregateValue(currentGroupData, column))}
         {/if}
       {:else if groupType === 'section'}
         {groupName}

package/dist/ui/components/TableTotalRow.svelte

@@ -1,13 +1,12 @@
 <script lang="ts">
   import InlineDelta from './InlineDelta.svelte'
   import TableCell from './TableCell.svelte'
-  import {safeExtractColumn, weightedMean} from '../component-utilities/tableUtils'
-  import {formatValue, getFormatObjectFromString} from '../component-utilities/formatting.js'
+  import {summarizeColumn, type SummaryMetric} from '../component-utilities/dataSummary.ts'
+  import {formatFromField} from '../component-utilities/format.ts'
 
   interface Props {
     data?: any[]
     rowNumbers?: boolean | string
-    columnSummary?: any[]
     rowColor?: string
     fontColor?: string
     groupType?: 'accordion' | 'section'
@@ -16,7 +15,7 @@
   }
 
   let {
-    data = [], rowNumbers: rowNumbersProp = undefined, columnSummary = [], rowColor = undefined,
+    data = [], rowNumbers: rowNumbersProp = undefined, rowColor = undefined,
     fontColor = undefined, groupType = undefined, orderedColumns = [], compact: compactProp = undefined,
   }: Props = $props()
 
@@ -32,6 +31,16 @@
 
   let rowNumbers = $derived(toBool(rowNumbersProp))
   let compact = $derived(toBool(compactProp))
+
+  const SUPPORTED_METRICS: SummaryMetric[] = ['sum', 'mean', 'median', 'min', 'max', 'count', 'countDistinct']
+
+  const getAggregateValue = (rows: Record<string, unknown>[], column: any, aggType: string | undefined) => {
+    let metric = aggType as SummaryMetric | undefined
+    if (!metric && String(column?.type || '').toLowerCase() === 'number') metric = 'sum'
+    if (!metric || !SUPPORTED_METRICS.includes(metric)) return '-'
+    let summary = summarizeColumn(rows, column.field ?? {name: column.id, type: column.type}, [metric])
+    return summary[metric] ?? null
+  }
 </script>
 
 <tr class="total-row" style:background-color={rowColor} style:color={fontColor}>
@@ -40,49 +49,30 @@
   {/if}
 
   {#each orderedColumns as column (column.id)}
-    {@const summary = safeExtractColumn(column, columnSummary)}
-    {@const format = (() => {
-      if (column.totalFmt) return getFormatObjectFromString(column.totalFmt)
-      if (column.fmt) return getFormatObjectFromString(column.fmt, summary.format?.valueType)
-      return summary.format
-    })()}
     {@const totalAgg = column.totalAgg ?? 'sum'}
     <TableCell
       {compact}
-      dataType={summary.type}
+      dataType={column.type}
       align={column.align}
       height={column.height}
       width={column.width}
       wrap={column.wrap}
       topBorder="1px solid rgba(107, 114, 128, 0.5)"
     >
-      {#if ['sum', 'mean', 'weightedMean', 'median', 'min', 'max', 'count', 'countDistinct'].includes(totalAgg)}
-        {#if column.contentType === 'delta'}
-          <InlineDelta
-            value={totalAgg === 'weightedMean' ? weightedMean(data, column.id, column.weightCol) : summary.columnUnitSummary?.[totalAgg]}
-            downIsGood={column.downIsGood}
-            formatObject={format}
-            columnUnitSummary={summary.columnUnitSummary}
-            showValue={column.showValue}
-            showSymbol={column.deltaSymbol}
-            align={column.align}
-            neutralMin={column.neutralMin ?? 0}
-            neutralMax={column.neutralMax ?? 0}
-            chip={column.chip}
-          />
-        {:else}
-          {formatValue(
-            totalAgg === 'weightedMean' ? weightedMean(data, column.id, column.weightCol) : summary.columnUnitSummary?.[totalAgg],
-            format,
-            summary.columnUnitSummary,
-          )}
-        {/if}
+      {#if column.contentType === 'delta'}
+        <InlineDelta
+          value={getAggregateValue(data, column, totalAgg)}
+          downIsGood={column.downIsGood}
+          field={column.field}
+          showValue={column.showValue}
+          showSymbol={column.deltaSymbol}
+          align={column.align}
+          neutralMin={column.neutralMin ?? 0}
+          neutralMax={column.neutralMax ?? 0}
+          chip={column.chip}
+        />
       {:else}
-        {#if column.totalFmt}
-          {formatValue(totalAgg, format, summary.columnUnitSummary)}
-        {:else}
-          {totalAgg}
-        {/if}
+        {formatFromField(column.field, getAggregateValue(data, column, totalAgg))}
       {/if}
     </TableCell>
   {/each}