@adminforth/dashboard 1.2.0 → 1.3.0

package/custom/widgets/pivot-table/PivotTableWidget.vue

@@ -2,7 +2,7 @@
 import { computed, watch } from 'vue'
 import { useWidgetData } from '../../queries/useWidgetData.js'
 import {
-  normalizePivotTableWidgetConfig,
+  getFieldRefField,
 } from '../../model/dashboard.types.js'
 import type { DashboardWidgetConfig, DashboardWidgetData } from '../../model/dashboard.types.js'
 import { formatChartLabel, formatChartValue, toFiniteNumber } from '../chart/chart.utils.js'
@@ -29,16 +29,17 @@ watch(
   { deep: true },
 )
 
-const pivotConfig = computed(() => normalizePivotTableWidgetConfig(props.widget.pivot_table))
+const pivotConfig = computed(() => props.widget.target === 'pivot_table' ? props.widget.pivot : undefined)
 const widgetData = computed(() => data.value?.data as DashboardWidgetData | null)
 const rows = computed(() => widgetData.value?.rows ?? [])
 const columns = computed(() => widgetData.value?.columns ?? [])
 const isAggregateData = computed(() => widgetData.value?.kind === 'aggregate')
-const shouldRenderAggregateMatrix = computed(() => isAggregateData.value && !pivotConfig.value?.columnField)
-const rowField = computed(() => pivotConfig.value?.rowField || (isAggregateData.value ? 'group' : columns.value[0]))
-const columnField = computed(() => pivotConfig.value?.columnField || columns.value[1])
-const valueField = computed(() => pivotConfig.value?.valueField || columns.value[2] || columns.value[1])
-const aggregation = computed(() => pivotConfig.value?.aggregation || (valueField.value ? 'sum' : 'count'))
+const shouldRenderAggregateMatrix = computed(() => isAggregateData.value && !pivotConfig.value?.columns?.length)
+const rowField = computed(() => getFieldRefField(pivotConfig.value?.rows[0]) || columns.value[0])
+const columnField = computed(() => getFieldRefField(pivotConfig.value?.columns?.[0]) || columns.value[1])
+const valueConfig = computed(() => pivotConfig.value?.values[0])
+const valueField = computed(() => valueConfig.value?.field || columns.value[2] || columns.value[1])
+const aggregation = computed(() => valueConfig.value?.aggregation || (valueField.value ? 'sum' : 'count'))
 const pivotColumnLabels = computed(() => {
   if (shouldRenderAggregateMatrix.value) {
     return columns.value.filter((column) => column !== rowField.value)

package/custom/widgets/table/TableWidget.vue

@@ -113,10 +113,11 @@
 <script setup lang="ts">
 import { computed, ref, watch } from 'vue'
 import { useWidgetData } from '../../queries/useWidgetData.js'
-import type { DashboardWidgetConfig, DashboardWidgetTableData } from '../../model/dashboard.types.js'
+import { getFieldRefField } from '../../model/dashboard.types.js'
+import type { DashboardWidgetConfig, DashboardWidgetTableData, FieldRef } from '../../model/dashboard.types.js'
 
 type TableWidgetConfig = {
-  columns?: string[]
+  columns?: FieldRef[]
   pagination?: boolean
   pageSize?: number
 }
@@ -168,7 +169,11 @@ const tableData = computed(() => {
 
 const columns = computed(() => {
   const configuredColumns = tableConfig.value?.columns
-  return configuredColumns ?? tableData.value?.columns ?? []
+  if (configuredColumns) {
+    return configuredColumns.map((column) => getFieldRefField(column)).filter(Boolean) as string[]
+  }
+
+  return tableData.value?.columns ?? []
 })
 
 const pagination = computed(() => tableData.value?.pagination)

package/dist/custom/composables/useElementSize.js

@@ -7,19 +7,31 @@ function useElementSize() {
     const width = (0, vue_1.ref)(0);
     const height = (0, vue_1.ref)(0);
     let observer;
+    let frameId;
     (0, vue_1.onMounted)(() => {
         observer = new ResizeObserver(([entry]) => {
             if (!entry) {
                 return;
             }
-            width.value = Math.floor(entry.contentRect.width);
-            height.value = Math.floor(entry.contentRect.height);
+            const nextWidth = Math.floor(entry.contentRect.width);
+            const nextHeight = Math.floor(entry.contentRect.height);
+            if (frameId !== undefined) {
+                cancelAnimationFrame(frameId);
+            }
+            frameId = requestAnimationFrame(() => {
+                frameId = undefined;
+                width.value = nextWidth;
+                height.value = nextHeight;
+            });
         });
         if (el.value) {
             observer.observe(el.value);
         }
     });
     (0, vue_1.onBeforeUnmount)(() => {
+        if (frameId !== undefined) {
+            cancelAnimationFrame(frameId);
+        }
         observer === null || observer === void 0 ? void 0 : observer.disconnect();
     });
     return {

package/dist/custom/composables/useElementSize.ts

@@ -13,6 +13,7 @@ export function useElementSize<T extends HTMLElement>(): ElementSizeState<T> {
   const height = ref(0)
 
   let observer: ResizeObserver | undefined
+  let frameId: number | undefined
 
   onMounted(() => {
     observer = new ResizeObserver(([entry]) => {
@@ -20,8 +21,18 @@ export function useElementSize<T extends HTMLElement>(): ElementSizeState<T> {
         return
       }
 
-      width.value = Math.floor(entry.contentRect.width)
-      height.value = Math.floor(entry.contentRect.height)
+      const nextWidth = Math.floor(entry.contentRect.width)
+      const nextHeight = Math.floor(entry.contentRect.height)
+
+      if (frameId !== undefined) {
+        cancelAnimationFrame(frameId)
+      }
+
+      frameId = requestAnimationFrame(() => {
+        frameId = undefined
+        width.value = nextWidth
+        height.value = nextHeight
+      })
     })
 
     if (el.value) {
@@ -30,6 +41,10 @@ export function useElementSize<T extends HTMLElement>(): ElementSizeState<T> {
   })
 
   onBeforeUnmount(() => {
+    if (frameId !== undefined) {
+      cancelAnimationFrame(frameId)
+    }
+
     observer?.disconnect()
   })
 

package/dist/custom/model/dashboard.types.d.ts

@@ -1,33 +1,4 @@
 import type { ChartWidgetConfig } from '../widgets/chart/chart.types.js';
-export type AggregationOperation = 'sum' | 'count' | 'avg' | 'min' | 'max' | 'median';
-export type AggregationRule = {
-    operation: AggregationOperation;
-    field?: string;
-};
-export type GroupByRule = {
-    type: 'field';
-    field: string;
-} | {
-    type: 'date_trunc';
-    field: string;
-    truncation: 'day' | 'week' | 'month' | 'year';
-    timezone?: string;
-};
-export type ResourceWidgetDataSource = {
-    type: 'resource';
-    resourceId: string;
-    columns?: string[];
-    sort?: unknown;
-    filters?: unknown;
-};
-export type AggregateWidgetDataSource = {
-    type: 'aggregate';
-    resourceId: string;
-    aggregations: Record<string, AggregationRule>;
-    groupBy?: GroupByRule;
-    filters?: unknown;
-};
-export type WidgetDataSource = ResourceWidgetDataSource | AggregateWidgetDataSource;
 export type DashboardConfig = {
     version: number;
     groups: DashboardGroupConfig[];
@@ -42,6 +13,9 @@ export type DashboardGroupMoveDirection = 'up' | 'down';
 export type DashboardWidgetMoveDirection = 'up' | 'down';
 export type DashboardWidgetTarget = 'empty' | 'table' | 'chart' | 'kpi_card' | 'pivot_table' | 'gauge_card';
 export type DashboardWidgetSize = 'small' | 'medium' | 'large' | 'wide' | 'full';
+export type QueryAggregateOperation = 'sum' | 'count' | 'count_distinct' | 'avg' | 'min' | 'max' | 'median';
+export type TimeGrain = 'hour' | 'day' | 'week' | 'month' | 'quarter' | 'year';
+export type ValueFormat = 'number' | 'compact_number' | 'currency' | 'percent' | 'percent_delta' | 'number_delta' | 'currency_delta';
 export type WidgetLayout = {
     size?: DashboardWidgetSize;
     width?: number;
@@ -49,7 +23,7 @@ export type WidgetLayout = {
     maxWidth?: number | null;
     height?: number;
 };
-export type DashboardWidgetConfig = {
+export type WidgetBaseConfig = {
     id: string;
     group_id: string;
     label?: string;
@@ -59,14 +33,173 @@ export type DashboardWidgetConfig = {
     minWidth?: number;
     maxWidth?: number | null;
     order: number;
-    target: DashboardWidgetTarget;
-    dataSource?: WidgetDataSource;
-    chart?: ChartWidgetConfig;
-    table?: unknown;
-    kpi_card?: unknown;
-    pivot_table?: unknown;
-    gauge_card?: unknown;
 };
+export type FilterExpression = {
+    and: FilterExpression[];
+} | {
+    or: FilterExpression[];
+} | Array<FilterExpression> | {
+    field: string;
+    eq?: unknown;
+    neq?: unknown;
+    gt?: unknown;
+    gte?: unknown;
+    lt?: unknown;
+    lte?: unknown;
+    in?: unknown[];
+    not_in?: unknown[];
+    like?: unknown;
+    ilike?: unknown;
+};
+export type QueryFieldSelectItem = {
+    field: string;
+    as?: string;
+    grain?: TimeGrain;
+};
+export type QueryAggregateSelectItem = {
+    agg: QueryAggregateOperation;
+    field?: string;
+    as: string;
+    filters?: FilterExpression;
+};
+export type QueryCalcSelectItem = {
+    calc: string;
+    as: string;
+};
+export type QuerySelectItem = QueryFieldSelectItem | QueryAggregateSelectItem | QueryCalcSelectItem;
+export type QueryGroupByItem = string | {
+    field: string;
+    as?: string;
+    grain?: TimeGrain;
+    timezone?: string;
+};
+export type QueryOrderByItem = {
+    field: string;
+    direction?: 'asc' | 'desc';
+};
+export type QueryConfig = {
+    resource: string;
+    select?: QuerySelectItem[];
+    filters?: FilterExpression;
+    groupBy?: QueryGroupByItem[];
+    orderBy?: QueryOrderByItem[];
+    limit?: number;
+    offset?: number;
+    timeSeries?: {
+        field: string;
+        grain: TimeGrain;
+        timezone?: string;
+    };
+    period?: {
+        field: string;
+        gte?: unknown;
+        lt?: unknown;
+    };
+    bucket?: {
+        field: string;
+        buckets: Array<{
+            label: string;
+            min?: number;
+            max?: number;
+        }>;
+    };
+    calcs?: QueryCalcSelectItem[];
+    formatting?: Record<string, unknown>;
+};
+export type FunnelQueryConfig = {
+    steps: FunnelQueryStep[];
+};
+export type FunnelQueryStep = {
+    name: string;
+    resource: string;
+    metric: QueryAggregateSelectItem;
+    filters?: FilterExpression;
+};
+export type FieldRef = string | {
+    field: string;
+    label?: string;
+    format?: ValueFormat;
+};
+export type TableViewConfig = {
+    columns?: FieldRef[];
+    pagination?: boolean;
+    pageSize?: number;
+};
+export type KpiCardViewConfig = {
+    title?: string;
+    value: {
+        field: string;
+        format?: ValueFormat;
+        prefix?: string;
+        suffix?: string;
+    };
+    subtitle?: {
+        text?: string;
+        field?: string;
+    };
+    comparison?: unknown;
+    sparkline?: unknown;
+};
+export type GaugeCardViewConfig = {
+    title?: string;
+    value: {
+        field: string;
+        format?: ValueFormat;
+        prefix?: string;
+        suffix?: string;
+    };
+    target?: {
+        value?: number;
+        field?: string;
+        label?: string;
+    };
+    progress?: {
+        valueField: string;
+        targetValue?: number;
+        targetField?: string;
+        format?: ValueFormat;
+    };
+    color?: string;
+};
+export type PivotTableViewConfig = {
+    rows: FieldRef[];
+    columns?: FieldRef[];
+    values: Array<{
+        field: string;
+        label?: string;
+        format?: ValueFormat;
+        aggregation?: 'sum' | 'count' | 'avg' | 'min' | 'max';
+    }>;
+};
+export type EmptyWidgetConfig = WidgetBaseConfig & {
+    target: 'empty';
+};
+export type TableWidgetConfig = WidgetBaseConfig & {
+    target: 'table';
+    table?: TableViewConfig;
+    query: QueryConfig;
+};
+export type ChartDashboardWidgetConfig = WidgetBaseConfig & {
+    target: 'chart';
+    chart: ChartWidgetConfig;
+    query: QueryConfig | FunnelQueryConfig;
+};
+export type KpiCardWidgetConfig = WidgetBaseConfig & {
+    target: 'kpi_card';
+    card: KpiCardViewConfig;
+    query: QueryConfig;
+};
+export type GaugeCardWidgetConfig = WidgetBaseConfig & {
+    target: 'gauge_card';
+    card: GaugeCardViewConfig;
+    query: QueryConfig;
+};
+export type PivotTableWidgetConfig = WidgetBaseConfig & {
+    target: 'pivot_table';
+    pivot: PivotTableViewConfig;
+    query: QueryConfig;
+};
+export type DashboardWidgetConfig = EmptyWidgetConfig | TableWidgetConfig | ChartDashboardWidgetConfig | KpiCardWidgetConfig | GaugeCardWidgetConfig | PivotTableWidgetConfig;
 export type DashboardWidgetTableData = {
     kind?: 'table';
     columns: string[];
@@ -83,32 +216,16 @@ export type DashboardWidgetAggregateData = {
     columns: string[];
     rows: Record<string, unknown>[];
     values?: Record<string, unknown>;
+    pagination?: {
+        page: number;
+        pageSize: number;
+        total: number;
+        totalPages: number;
+    };
 };
 export type DashboardWidgetData = DashboardWidgetTableData | DashboardWidgetAggregateData;
-export type NormalizedKpiCardWidgetConfig = {
-    valueField?: string;
-    labelField?: string;
-    prefix?: string;
-    suffix?: string;
-};
-export type NormalizedGaugeCardWidgetConfig = {
-    valueField?: string;
-    min?: number | string;
-    max?: number | string;
-    minField?: string;
-    maxField?: string;
-    suffix?: string;
-    color?: string;
-};
-export type NormalizedPivotTableWidgetConfig = {
-    rowField?: string;
-    columnField?: string;
-    valueField?: string;
-    aggregation?: 'count' | 'sum';
-};
 export declare function normalizeDashboardConfig(config: unknown): DashboardConfig;
 export declare function normalizeDashboardWidgetConfig(config: unknown): unknown;
 export declare function serializeDashboardWidgetConfigForEditor(widget: DashboardWidgetConfig): Record<string, unknown>;
-export declare function normalizeKpiCardWidgetConfig(value: unknown): NormalizedKpiCardWidgetConfig | undefined;
-export declare function normalizeGaugeCardWidgetConfig(value: unknown): NormalizedGaugeCardWidgetConfig | undefined;
-export declare function normalizePivotTableWidgetConfig(value: unknown): NormalizedPivotTableWidgetConfig | undefined;
+export declare function getFieldRefField(value: FieldRef | undefined): string | undefined;
+export declare function getFieldRefLabel(value: FieldRef | undefined): string | undefined;

package/dist/custom/model/dashboard.types.js

@@ -3,9 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeDashboardConfig = normalizeDashboardConfig;
 exports.normalizeDashboardWidgetConfig = normalizeDashboardWidgetConfig;
 exports.serializeDashboardWidgetConfigForEditor = serializeDashboardWidgetConfigForEditor;
-exports.normalizeKpiCardWidgetConfig = normalizeKpiCardWidgetConfig;
-exports.normalizeGaugeCardWidgetConfig = normalizeGaugeCardWidgetConfig;
-exports.normalizePivotTableWidgetConfig = normalizePivotTableWidgetConfig;
+exports.getFieldRefField = getFieldRefField;
+exports.getFieldRefLabel = getFieldRefLabel;
 function normalizeDashboardConfig(config) {
     const value = isRecord(config) ? config : {};
     return {
@@ -22,11 +21,17 @@ function normalizeDashboardWidgetConfig(config) {
     }
     const normalized = Object.assign({}, config);
     normalizeWidgetLayoutConfig(normalized);
+    if (normalized.query !== undefined) {
+        normalized.query = normalizeQueryConfig(normalized.query);
+    }
     if (normalized.table !== undefined) {
         normalized.table = normalizeTableConfig(normalized.table);
     }
-    if (normalized.data_source !== undefined) {
-        normalized.dataSource = normalizeWidgetDataSource(normalized.data_source);
+    if (normalized.card !== undefined) {
+        normalized.card = normalizeCardConfig(normalized.card);
+    }
+    if (normalized.pivot !== undefined) {
+        normalized.pivot = normalizePivotConfig(normalized.pivot);
     }
     const target = normalizeDashboardWidgetTarget(normalized.target);
     if (target !== undefined) {
@@ -44,50 +49,25 @@ function serializeDashboardWidgetConfigForEditor(widget) {
         serialized.max_width = widget.maxWidth;
         delete serialized.maxWidth;
     }
-    if (widget.table !== undefined) {
+    if ('query' in widget) {
+        serialized.query = serializeQueryConfigForEditor(widget.query);
+    }
+    if ('table' in widget && widget.table !== undefined) {
         serialized.table = serializeTableConfigForEditor(widget.table);
     }
-    if (widget.dataSource !== undefined) {
-        serialized.data_source = serializeWidgetDataSourceForEditor(widget.dataSource);
-        delete serialized.dataSource;
+    if ('card' in widget && widget.card !== undefined) {
+        serialized.card = serializeCardConfigForEditor(widget.card);
+    }
+    if ('pivot' in widget && widget.pivot !== undefined) {
+        serialized.pivot = serializePivotConfigForEditor(widget.pivot);
     }
     return serialized;
 }
-function normalizeKpiCardWidgetConfig(value) {
-    const config = asWidgetConfigRecord(value);
-    if (!config) {
-        return undefined;
-    }
-    const valueField = getStringField(config, 'value_field');
-    const labelField = getStringField(config, 'label_field');
-    const prefix = getStringField(config, 'prefix');
-    const suffix = getStringField(config, 'suffix');
-    return Object.assign(Object.assign(Object.assign(Object.assign({}, (valueField !== undefined ? { valueField } : {})), (labelField !== undefined ? { labelField } : {})), (prefix !== undefined ? { prefix } : {})), (suffix !== undefined ? { suffix } : {}));
-}
-function normalizeGaugeCardWidgetConfig(value) {
-    const config = asWidgetConfigRecord(value);
-    if (!config) {
-        return undefined;
-    }
-    const valueField = getStringField(config, 'value_field');
-    const minField = getStringField(config, 'min_field');
-    const maxField = getStringField(config, 'max_field');
-    const suffix = getStringField(config, 'suffix');
-    const color = getStringField(config, 'color');
-    return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (valueField !== undefined ? { valueField } : {})), (config.min !== undefined ? { min: config.min } : {})), (config.max !== undefined ? { max: config.max } : {})), (minField !== undefined ? { minField } : {})), (maxField !== undefined ? { maxField } : {})), (suffix !== undefined ? { suffix } : {})), (color !== undefined ? { color } : {}));
-}
-function normalizePivotTableWidgetConfig(value) {
-    const config = asWidgetConfigRecord(value);
-    if (!config) {
-        return undefined;
-    }
-    const rowField = getStringField(config, 'row_field');
-    const columnField = getStringField(config, 'column_field');
-    const valueField = getStringField(config, 'value_field');
-    const aggregation = config.aggregation === 'count' || config.aggregation === 'sum'
-        ? config.aggregation
-        : undefined;
-    return Object.assign(Object.assign(Object.assign(Object.assign({}, (rowField !== undefined ? { rowField } : {})), (columnField !== undefined ? { columnField } : {})), (valueField !== undefined ? { valueField } : {})), (aggregation !== undefined ? { aggregation } : {}));
+function getFieldRefField(value) {
+    return typeof value === 'string' ? value : value === null || value === void 0 ? void 0 : value.field;
+}
+function getFieldRefLabel(value) {
+    return typeof value === 'string' ? value : value === null || value === void 0 ? void 0 : value.label;
 }
 function normalizeDashboardWidgetTarget(value) {
     switch (value) {
@@ -110,76 +90,71 @@ function normalizeWidgetLayoutConfig(value) {
         value.maxWidth = value.max_width;
     }
 }
-function normalizeTableConfig(value) {
+function normalizeQueryConfig(value) {
     if (!isRecord(value)) {
         return value;
     }
-    const normalized = Object.assign({}, value);
-    if (normalized.page_size !== undefined) {
-        normalized.pageSize = normalized.page_size;
+    if (Array.isArray(value.steps)) {
+        return {
+            steps: value.steps.map((step) => normalizeFunnelQueryStep(step)),
+        };
     }
-    return normalized;
+    return Object.assign(Object.assign(Object.assign(Object.assign({}, value), (Array.isArray(value.group_by) ? { groupBy: value.group_by } : {})), (Array.isArray(value.order_by) ? { orderBy: value.order_by } : {})), (value.time_series !== undefined ? { timeSeries: value.time_series } : {}));
 }
-function normalizeWidgetDataSource(value) {
-    if (!isRecord(value) || typeof value.type !== 'string') {
+function normalizeFunnelQueryStep(value) {
+    if (!isRecord(value)) {
         return value;
     }
-    const resourceId = typeof value.resource_id === 'string'
-        ? value.resource_id
-        : undefined;
-    if (value.type === 'resource') {
-        return Object.assign(Object.assign(Object.assign(Object.assign({ type: 'resource' }, (resourceId !== undefined ? { resourceId } : {})), (value.columns !== undefined ? { columns: value.columns } : {})), (value.filters !== undefined ? { filters: value.filters } : {})), (value.sort !== undefined ? { sort: value.sort } : {}));
-    }
-    if (value.type === 'aggregate') {
-        const groupBy = normalizeGroupByRule(value.group_by);
-        return Object.assign(Object.assign(Object.assign(Object.assign({ type: 'aggregate' }, (resourceId !== undefined ? { resourceId } : {})), (value.aggregations !== undefined ? { aggregations: value.aggregations } : {})), (groupBy !== undefined ? { groupBy } : {})), (value.filters !== undefined ? { filters: value.filters } : {}));
-    }
-    return value;
+    return Object.assign(Object.assign({}, value), (typeof value.resource_id === 'string' ? { resource: value.resource_id } : {}));
 }
-function normalizeGroupByRule(value) {
-    if (!isRecord(value) || typeof value.type !== 'string') {
+function normalizeTableConfig(value) {
+    if (!isRecord(value)) {
         return value;
     }
-    if (value.type === 'field') {
-        return Object.assign({ type: 'field' }, (value.field !== undefined ? { field: value.field } : {}));
-    }
-    if (value.type === 'date_trunc') {
-        return Object.assign(Object.assign(Object.assign({ type: 'date_trunc' }, (value.field !== undefined ? { field: value.field } : {})), (value.truncation !== undefined ? { truncation: value.truncation } : {})), (value.timezone !== undefined ? { timezone: value.timezone } : {}));
-    }
-    return value;
+    return Object.assign(Object.assign({}, value), (value.page_size !== undefined ? { pageSize: value.page_size } : {}));
 }
-function serializeTableConfigForEditor(value) {
+function normalizeCardConfig(value) {
     if (!isRecord(value)) {
         return value;
     }
-    const serialized = Object.assign({}, value);
-    if (Object.prototype.hasOwnProperty.call(serialized, 'pageSize')) {
-        serialized.page_size = serialized.pageSize;
-        delete serialized.pageSize;
+    const normalized = Object.assign({}, value);
+    if (isRecord(normalized.progress)) {
+        normalized.progress = Object.assign(Object.assign(Object.assign(Object.assign({}, normalized.progress), (normalized.progress.value_field !== undefined ? { valueField: normalized.progress.value_field } : {})), (normalized.progress.target_value !== undefined ? { targetValue: normalized.progress.target_value } : {})), (normalized.progress.target_field !== undefined ? { targetField: normalized.progress.target_field } : {}));
     }
-    return serialized;
-}
-function serializeWidgetDataSourceForEditor(value) {
-    if (value.type === 'resource') {
-        return Object.assign(Object.assign(Object.assign({ type: 'resource', resource_id: value.resourceId }, (value.columns !== undefined ? { columns: value.columns } : {})), (value.filters !== undefined ? { filters: value.filters } : {})), (value.sort !== undefined ? { sort: value.sort } : {}));
+    if (isRecord(normalized.comparison)) {
+        normalized.comparison = Object.assign(Object.assign({}, normalized.comparison), (normalized.comparison.positive_is_good !== undefined ? { positiveIsGood: normalized.comparison.positive_is_good } : {}));
     }
-    return Object.assign(Object.assign({ type: 'aggregate', resource_id: value.resourceId, aggregations: value.aggregations }, (value.groupBy !== undefined ? { group_by: serializeGroupByRuleForEditor(value.groupBy) } : {})), (value.filters !== undefined ? { filters: value.filters } : {}));
+    return normalized;
 }
-function serializeGroupByRuleForEditor(value) {
-    if (value.type === 'field') {
+function normalizePivotConfig(value) {
+    return value;
+}
+function serializeQueryConfigForEditor(value) {
+    if ('steps' in value) {
         return {
-            type: 'field',
-            field: value.field,
+            steps: value.steps.map((step) => (Object.assign(Object.assign({}, step), { resource_id: step.resource, resource: undefined }))).map((step) => removeUndefinedFields(step)),
         };
     }
-    return Object.assign({ type: 'date_trunc', field: value.field, truncation: value.truncation }, (value.timezone !== undefined ? { timezone: value.timezone } : {}));
+    return removeUndefinedFields(Object.assign(Object.assign({}, value), { group_by: value.groupBy, groupBy: undefined, order_by: value.orderBy, orderBy: undefined, time_series: value.timeSeries, timeSeries: undefined }));
+}
+function serializeTableConfigForEditor(value) {
+    return removeUndefinedFields(Object.assign(Object.assign({}, value), { page_size: value.pageSize, pageSize: undefined }));
+}
+function serializeCardConfigForEditor(value) {
+    const serialized = Object.assign({}, value);
+    if (isRecord(serialized.progress)) {
+        serialized.progress = removeUndefinedFields(Object.assign(Object.assign({}, serialized.progress), { value_field: serialized.progress.valueField, valueField: undefined, target_value: serialized.progress.targetValue, targetValue: undefined, target_field: serialized.progress.targetField, targetField: undefined }));
+    }
+    if (isRecord(serialized.comparison)) {
+        serialized.comparison = removeUndefinedFields(Object.assign(Object.assign({}, serialized.comparison), { positive_is_good: serialized.comparison.positiveIsGood, positiveIsGood: undefined }));
+    }
+    return removeUndefinedFields(serialized);
 }
-function asWidgetConfigRecord(value) {
-    return isRecord(value) ? value : undefined;
+function serializePivotConfigForEditor(value) {
+    return value;
 }
-function getStringField(record, key) {
-    const value = record[key];
-    return typeof value === 'string' ? value : undefined;
+function removeUndefinedFields(value) {
+    return Object.fromEntries(Object.entries(value).filter(([, item]) => item !== undefined));
 }
 function isRecord(value) {
     return typeof value === 'object' && value !== null;