@sqlrooms/mosaic 0.29.0-rc.6 → 0.29.0-rc.8

package/dist/data-table-explorer/DataTableExplorer.js

@@ -0,0 +1,67 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, } from 'react';
+import { cn, Table } from '@sqlrooms/ui';
+import { getDataTableExplorerTableWidth } from './layout';
+import { DataTableExplorerHeader, } from './DataTableExplorerHeader';
+import { DataTableExplorerRows, } from './DataTableExplorerRows';
+import { DataTableExplorerStatusBar, } from './DataTableExplorerStatusBar';
+import { useDataTableExplorer } from './useDataTableExplorer';
+import { ResetFiltersButton } from '../dashboard/components/ResetFiltersButton';
+const explorerContext = createContext(null);
+function useDataTableExplorerCompoundContext() {
+    const explorer = useContext(explorerContext);
+    if (!explorer) {
+        throw new Error('DataTableExplorer compound components must be rendered inside <DataTableExplorer> or <DataTableExplorer.Root>.');
+    }
+    return explorer;
+}
+/**
+ * Provides an existing explorer instance to compound explorer subcomponents.
+ */
+export function DataTableExplorerRoot({ children, explorer, }) {
+    return (_jsx(explorerContext.Provider, { value: explorer, children: children }));
+}
+/**
+ * Creates an explorer instance and exposes it to compound explorer
+ * subcomponents through context.
+ */
+function DataTableExplorerComponent({ children, ...options }) {
+    const explorer = useDataTableExplorer(options);
+    return (_jsx(DataTableExplorerRoot, { explorer: explorer, children: children }));
+}
+function DataTableExplorerCompoundHeader(props) {
+    const explorer = useDataTableExplorerCompoundContext();
+    return _jsx(DataTableExplorerHeader, { ...props, explorer: explorer });
+}
+function DataTableExplorerCompoundRows(props) {
+    const explorer = useDataTableExplorerCompoundContext();
+    return _jsx(DataTableExplorerRows, { ...props, explorer: explorer });
+}
+function DataTableExplorerCompoundStatusBar(props) {
+    const explorer = useDataTableExplorerCompoundContext();
+    return _jsx(DataTableExplorerStatusBar, { ...props, explorer: explorer });
+}
+function DataTableExplorerCompoundTable({ className, disableWrapper = true, style, ...props }) {
+    const explorer = useDataTableExplorerCompoundContext();
+    const tableWidth = getDataTableExplorerTableWidth(explorer.columns);
+    return (_jsx(Table, { disableWrapper: disableWrapper, className: ['min-w-full table-fixed', className]
+            .filter(Boolean)
+            .join(' '), style: { width: `${tableWidth}px`, ...style }, ...props }));
+}
+function DataTableExplorerCompoundResetButton({ className, disabled: disabledProp, onClick, ...props }) {
+    const explorer = useDataTableExplorerCompoundContext();
+    const disabled = disabledProp ?? !explorer.hasFilters;
+    return (_jsx(ResetFiltersButton, { className: cn('h-7 w-7', className), iconClassName: "h-3.5 w-3.5", disabled: disabled, onClick: () => {
+            explorer.reset();
+            onClick?.();
+        }, tooltip: "Reset filters", ...props }));
+}
+export const DataTableExplorer = Object.assign(DataTableExplorerComponent, {
+    Header: DataTableExplorerCompoundHeader,
+    ResetButton: DataTableExplorerCompoundResetButton,
+    Root: DataTableExplorerRoot,
+    Rows: DataTableExplorerCompoundRows,
+    StatusBar: DataTableExplorerCompoundStatusBar,
+    Table: DataTableExplorerCompoundTable,
+});
+//# sourceMappingURL=DataTableExplorer.js.map

package/dist/data-table-explorer/DataTableExplorer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableExplorer.js","sourceRoot":"","sources":["../../src/data-table-explorer/DataTableExplorer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  createContext,\n  useContext,\n  type ComponentProps,\n  type PropsWithChildren,\n  type ReactElement,\n} from 'react';\nimport {cn, Table} from '@sqlrooms/ui';\nimport {getDataTableExplorerTableWidth} from './layout';\nimport {\n  DataTableExplorerHeader,\n  type DataTableExplorerHeaderProps,\n} from './DataTableExplorerHeader';\nimport {\n  DataTableExplorerRows,\n  type DataTableExplorerRowsProps,\n} from './DataTableExplorerRows';\nimport {\n  DataTableExplorerStatusBar,\n  type DataTableExplorerStatusBarProps,\n} from './DataTableExplorerStatusBar';\nimport type {\n  DataTableExplorerOptions,\n  UseDataTableExplorerReturn,\n} from './types';\nimport {useDataTableExplorer} from './useDataTableExplorer';\nimport {ResetFiltersButton} from '../dashboard/components/ResetFiltersButton';\n\nconst explorerContext = createContext<UseDataTableExplorerReturn | null>(null);\n\nfunction useDataTableExplorerCompoundContext() {\n  const explorer = useContext(explorerContext);\n\n  if (!explorer) {\n    throw new Error(\n      'DataTableExplorer compound components must be rendered inside <DataTableExplorer> or <DataTableExplorer.Root>.',\n    );\n  }\n\n  return explorer;\n}\n\nexport type DataTableExplorerRootProps = PropsWithChildren<{\n  explorer: UseDataTableExplorerReturn;\n}>;\n\n/**\n * Provides an existing explorer instance to compound explorer subcomponents.\n */\nexport function DataTableExplorerRoot({\n  children,\n  explorer,\n}: DataTableExplorerRootProps) {\n  return (\n    <explorerContext.Provider value={explorer}>\n      {children}\n    </explorerContext.Provider>\n  );\n}\n\nexport type DataTableExplorerProps =\n  PropsWithChildren<DataTableExplorerOptions>;\n\n/**\n * Creates an explorer instance and exposes it to compound explorer\n * subcomponents through context.\n */\nfunction DataTableExplorerComponent({\n  children,\n  ...options\n}: DataTableExplorerProps): ReactElement {\n  const explorer = useDataTableExplorer(options);\n  return (\n    <DataTableExplorerRoot explorer={explorer}>\n      {children}\n    </DataTableExplorerRoot>\n  );\n}\n\nexport type DataTableExplorerCompoundHeaderProps = Omit<\n  DataTableExplorerHeaderProps,\n  'explorer'\n>;\n\nfunction DataTableExplorerCompoundHeader(\n  props: DataTableExplorerCompoundHeaderProps,\n) {\n  const explorer = useDataTableExplorerCompoundContext();\n  return <DataTableExplorerHeader {...props} explorer={explorer} />;\n}\n\nexport type DataTableExplorerCompoundRowsProps = Omit<\n  DataTableExplorerRowsProps,\n  'explorer'\n>;\n\nfunction DataTableExplorerCompoundRows(\n  props: DataTableExplorerCompoundRowsProps,\n) {\n  const explorer = useDataTableExplorerCompoundContext();\n  return <DataTableExplorerRows {...props} explorer={explorer} />;\n}\n\nexport type DataTableExplorerCompoundStatusBarProps = Omit<\n  DataTableExplorerStatusBarProps,\n  'explorer'\n>;\n\nfunction DataTableExplorerCompoundStatusBar(\n  props: DataTableExplorerCompoundStatusBarProps,\n) {\n  const explorer = useDataTableExplorerCompoundContext();\n  return <DataTableExplorerStatusBar {...props} explorer={explorer} />;\n}\n\nexport type DataTableExplorerCompoundTableProps = ComponentProps<typeof Table>;\n\nfunction DataTableExplorerCompoundTable({\n  className,\n  disableWrapper = true,\n  style,\n  ...props\n}: DataTableExplorerCompoundTableProps) {\n  const explorer = useDataTableExplorerCompoundContext();\n  const tableWidth = getDataTableExplorerTableWidth(explorer.columns);\n\n  return (\n    <Table\n      disableWrapper={disableWrapper}\n      className={['min-w-full table-fixed', className]\n        .filter(Boolean)\n        .join(' ')}\n      style={{width: `${tableWidth}px`, ...style}}\n      {...props}\n    />\n  );\n}\n\nexport type DataTableExplorerCompoundResetButtonProps = Omit<\n  ComponentProps<typeof ResetFiltersButton>,\n  'disabled' | 'onClick'\n> & {\n  disabled?: boolean;\n  onClick?: () => void;\n};\n\nfunction DataTableExplorerCompoundResetButton({\n  className,\n  disabled: disabledProp,\n  onClick,\n  ...props\n}: DataTableExplorerCompoundResetButtonProps) {\n  const explorer = useDataTableExplorerCompoundContext();\n  const disabled = disabledProp ?? !explorer.hasFilters;\n\n  return (\n    <ResetFiltersButton\n      className={cn('h-7 w-7', className)}\n      iconClassName=\"h-3.5 w-3.5\"\n      disabled={disabled}\n      onClick={() => {\n        explorer.reset();\n        onClick?.();\n      }}\n      tooltip=\"Reset filters\"\n      {...props}\n    />\n  );\n}\n\ntype DataTableExplorerCompoundComponent = ((\n  props: DataTableExplorerProps,\n) => ReactElement) & {\n  Header: typeof DataTableExplorerCompoundHeader;\n  ResetButton: typeof DataTableExplorerCompoundResetButton;\n  Root: typeof DataTableExplorerRoot;\n  Rows: typeof DataTableExplorerCompoundRows;\n  StatusBar: typeof DataTableExplorerCompoundStatusBar;\n  Table: typeof DataTableExplorerCompoundTable;\n};\n\nexport const DataTableExplorer: DataTableExplorerCompoundComponent =\n  Object.assign(DataTableExplorerComponent, {\n    Header: DataTableExplorerCompoundHeader,\n    ResetButton: DataTableExplorerCompoundResetButton,\n    Root: DataTableExplorerRoot,\n    Rows: DataTableExplorerCompoundRows,\n    StatusBar: DataTableExplorerCompoundStatusBar,\n    Table: DataTableExplorerCompoundTable,\n  });\n"]}

package/dist/data-table-explorer/DataTableExplorerCategoryClient.d.ts

@@ -0,0 +1,50 @@
+import { MosaicClient, type Selection } from '@uwdata/mosaic-core';
+import { type ExprNode, Query } from '@uwdata/mosaic-sql';
+import type * as arrow from 'apache-arrow';
+import type { DataTableExplorerCategorySummary } from './types';
+import { type CategoryCountRow } from './utils';
+type CategoryClientOptions = {
+    categoryLimit: number;
+    field: arrow.Field;
+    onStateChange: (summary: DataTableExplorerCategorySummary) => void;
+    selection: Selection;
+    tableName: string;
+};
+export declare class DataTableExplorerCategoryClient extends MosaicClient {
+    private readonly categoryLimit;
+    private filteredError?;
+    private filteredLoading;
+    private readonly field;
+    private readonly onStateChange;
+    private selectedKey?;
+    private filteredRows?;
+    private readonly tableName;
+    private totalError?;
+    private totalLoading;
+    private totalRows?;
+    constructor(options: CategoryClientOptions);
+    get filterStable(): boolean;
+    private emitSummary;
+    setTotalError(error?: Error): void;
+    setTotalLoading(isLoading: boolean): void;
+    setTotalRows(rows: CategoryCountRow[]): void;
+    queryPending(): this;
+    query(filter?: Array<ExprNode>): Query;
+    queryResult(data: unknown): this;
+    queryError(error: Error): this;
+    reset(): void;
+    toggleValue(key: string): void;
+}
+type DataTableExplorerCategoryTotalClientOptions = {
+    summaryClient: DataTableExplorerCategoryClient;
+};
+export declare class DataTableExplorerCategoryTotalClient extends MosaicClient {
+    private readonly summaryClient;
+    constructor(options: DataTableExplorerCategoryTotalClientOptions);
+    queryPending(): this;
+    query(filter?: Array<ExprNode>): Query;
+    queryResult(data: unknown): this;
+    queryError(error: Error): this;
+}
+export {};
+//# sourceMappingURL=DataTableExplorerCategoryClient.d.ts.map

package/dist/data-table-explorer/DataTableExplorerCategoryClient.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableExplorerCategoryClient.d.ts","sourceRoot":"","sources":["../../src/data-table-explorer/DataTableExplorerCategoryClient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAe,KAAK,SAAS,EAAC,MAAM,qBAAqB,CAAC;AAC9E,OAAO,EAAC,KAAK,QAAQ,EAAE,KAAK,EAAC,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,KAAK,KAAK,MAAM,cAAc,CAAC;AAC3C,OAAO,KAAK,EAAC,gCAAgC,EAAC,MAAM,SAAS,CAAC;AAC9D,OAAO,EAIL,KAAK,gBAAgB,EAGtB,MAAM,SAAS,CAAC;AAEjB,KAAK,qBAAqB,GAAG;IAC3B,aAAa,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC;IACnB,aAAa,EAAE,CAAC,OAAO,EAAE,gCAAgC,KAAK,IAAI,CAAC;IACnE,SAAS,EAAE,SAAS,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,qBAAa,+BAAgC,SAAQ,YAAY;IAC/D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAS;IACvC,OAAO,CAAC,aAAa,CAAC,CAAQ;IAC9B,OAAO,CAAC,eAAe,CAAQ;IAC/B,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAc;IACpC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAEpB;IACV,OAAO,CAAC,WAAW,CAAC,CAAS;IAC7B,OAAO,CAAC,YAAY,CAAC,CAAqB;IAC1C,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAS;IACnC,OAAO,CAAC,UAAU,CAAC,CAAQ;IAC3B,OAAO,CAAC,YAAY,CAAQ;IAC5B,OAAO,CAAC,SAAS,CAAC,CAAqB;gBAE3B,OAAO,EAAE,qBAAqB;IAQ1C,IAAa,YAAY,IAAI,OAAO,CAEnC;IAED,OAAO,CAAC,WAAW;IAwBnB,aAAa,CAAC,KAAK,CAAC,EAAE,KAAK;IAM3B,eAAe,CAAC,SAAS,EAAE,OAAO;IAQlC,YAAY,CAAC,IAAI,EAAE,gBAAgB,EAAE;IAY5B,YAAY,IAAI,IAAI;IAOpB,KAAK,CAAC,MAAM,GAAE,KAAK,CAAC,QAAQ,CAAM,GAAG,KAAK;IAI1C,WAAW,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI;IAchC,UAAU,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IAOvC,KAAK;IAKL,WAAW,CAAC,GAAG,EAAE,MAAM;CAiBxB;AAED,KAAK,2CAA2C,GAAG;IACjD,aAAa,EAAE,+BAA+B,CAAC;CAChD,CAAC;AAEF,qBAAa,oCAAqC,SAAQ,YAAY;IACpE,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAkC;gBAEpD,OAAO,EAAE,2CAA2C;IAKvD,YAAY,IAAI,IAAI;IAKpB,KAAK,CAAC,MAAM,GAAE,KAAK,CAAC,QAAQ,CAAM,GAAG,KAAK;IAI1C,WAAW,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI;IAOhC,UAAU,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;CAIxC"}

package/dist/data-table-explorer/DataTableExplorerCategoryClient.js

@@ -0,0 +1,122 @@
+import { MosaicClient, clausePoint } from '@uwdata/mosaic-core';
+import { buildCategoryBuckets, buildCategorySummaryQuery, categoryKeyToSelectionValue, isSelectableCategoryKey, rowsFromQueryResult, } from './utils';
+export class DataTableExplorerCategoryClient extends MosaicClient {
+    categoryLimit;
+    filteredError;
+    filteredLoading = true;
+    field;
+    onStateChange;
+    selectedKey;
+    filteredRows;
+    tableName;
+    totalError;
+    totalLoading = true;
+    totalRows;
+    constructor(options) {
+        super(options.selection);
+        this.categoryLimit = options.categoryLimit;
+        this.field = options.field;
+        this.onStateChange = options.onStateChange;
+        this.tableName = options.tableName;
+    }
+    get filterStable() {
+        return false;
+    }
+    emitSummary() {
+        const filteredRows = this.filteredRows ?? (this.filteredLoading ? (this.totalRows ?? []) : []);
+        const totalRows = this.totalRows ?? (this.totalLoading ? (this.filteredRows ?? []) : []);
+        const { bucketCount, buckets } = buildCategoryBuckets(filteredRows, totalRows, this.categoryLimit, this.selectedKey);
+        this.onStateChange({
+            bucketCount,
+            buckets,
+            client: this,
+            error: this.filteredError ?? this.totalError,
+            isLoading: this.filteredLoading || this.totalLoading,
+            kind: 'category',
+            selectedKey: this.selectedKey,
+            toggleValue: (key) => this.toggleValue(key),
+        });
+    }
+    setTotalError(error) {
+        this.totalError = error;
+        this.totalLoading = false;
+        this.emitSummary();
+    }
+    setTotalLoading(isLoading) {
+        this.totalLoading = isLoading;
+        if (isLoading) {
+            this.totalError = undefined;
+        }
+        this.emitSummary();
+    }
+    setTotalRows(rows) {
+        this.totalRows = rows
+            .slice()
+            .sort((left, right) => right.total - left.total);
+        this.totalError = undefined;
+        this.totalLoading = false;
+        this.emitSummary();
+    }
+    queryPending() {
+        this.filteredLoading = true;
+        this.filteredError = undefined;
+        this.emitSummary();
+        return this;
+    }
+    query(filter = []) {
+        return buildCategorySummaryQuery(this.tableName, this.field.name, filter);
+    }
+    queryResult(data) {
+        const rows = rowsFromQueryResult(data)
+            .slice()
+            .sort((left, right) => right.total - left.total);
+        this.filteredRows = rows;
+        this.filteredError = undefined;
+        this.filteredLoading = false;
+        this.emitSummary();
+        return this;
+    }
+    queryError(error) {
+        this.filteredError = error;
+        this.filteredLoading = false;
+        this.emitSummary();
+        return this;
+    }
+    reset() {
+        this.selectedKey = undefined;
+        this.emitSummary();
+    }
+    toggleValue(key) {
+        if (!isSelectableCategoryKey(key)) {
+            return;
+        }
+        this.selectedKey = this.selectedKey === key ? undefined : key;
+        this.filterBy?.update(clausePoint(this.field.name, categoryKeyToSelectionValue(this.selectedKey), {
+            source: this,
+        }));
+        this.emitSummary();
+    }
+}
+export class DataTableExplorerCategoryTotalClient extends MosaicClient {
+    summaryClient;
+    constructor(options) {
+        super();
+        this.summaryClient = options.summaryClient;
+    }
+    queryPending() {
+        this.summaryClient.setTotalLoading(true);
+        return this;
+    }
+    query(filter = []) {
+        return this.summaryClient.query(filter);
+    }
+    queryResult(data) {
+        this.summaryClient.setTotalRows(rowsFromQueryResult(data));
+        return this;
+    }
+    queryError(error) {
+        this.summaryClient.setTotalError(error);
+        return this;
+    }
+}
+//# sourceMappingURL=DataTableExplorerCategoryClient.js.map

package/dist/data-table-explorer/DataTableExplorerCategoryClient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableExplorerCategoryClient.js","sourceRoot":"","sources":["../../src/data-table-explorer/DataTableExplorerCategoryClient.ts"],"names":[],"mappings":"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","sourcesContent":["import {MosaicClient, clausePoint, type Selection} from '@uwdata/mosaic-core';\nimport {type ExprNode, Query} from '@uwdata/mosaic-sql';\nimport type * as arrow from 'apache-arrow';\nimport type {DataTableExplorerCategorySummary} from './types';\nimport {\n  buildCategoryBuckets,\n  buildCategorySummaryQuery,\n  categoryKeyToSelectionValue,\n  type CategoryCountRow,\n  isSelectableCategoryKey,\n  rowsFromQueryResult,\n} from './utils';\n\ntype CategoryClientOptions = {\n  categoryLimit: number;\n  field: arrow.Field;\n  onStateChange: (summary: DataTableExplorerCategorySummary) => void;\n  selection: Selection;\n  tableName: string;\n};\n\nexport class DataTableExplorerCategoryClient extends MosaicClient {\n  private readonly categoryLimit: number;\n  private filteredError?: Error;\n  private filteredLoading = true;\n  private readonly field: arrow.Field;\n  private readonly onStateChange: (\n    summary: DataTableExplorerCategorySummary,\n  ) => void;\n  private selectedKey?: string;\n  private filteredRows?: CategoryCountRow[];\n  private readonly tableName: string;\n  private totalError?: Error;\n  private totalLoading = true;\n  private totalRows?: CategoryCountRow[];\n\n  constructor(options: CategoryClientOptions) {\n    super(options.selection);\n    this.categoryLimit = options.categoryLimit;\n    this.field = options.field;\n    this.onStateChange = options.onStateChange;\n    this.tableName = options.tableName;\n  }\n\n  override get filterStable(): boolean {\n    return false;\n  }\n\n  private emitSummary() {\n    const filteredRows =\n      this.filteredRows ?? (this.filteredLoading ? (this.totalRows ?? []) : []);\n    const totalRows =\n      this.totalRows ?? (this.totalLoading ? (this.filteredRows ?? []) : []);\n    const {bucketCount, buckets} = buildCategoryBuckets(\n      filteredRows,\n      totalRows,\n      this.categoryLimit,\n      this.selectedKey,\n    );\n\n    this.onStateChange({\n      bucketCount,\n      buckets,\n      client: this,\n      error: this.filteredError ?? this.totalError,\n      isLoading: this.filteredLoading || this.totalLoading,\n      kind: 'category',\n      selectedKey: this.selectedKey,\n      toggleValue: (key) => this.toggleValue(key),\n    });\n  }\n\n  setTotalError(error?: Error) {\n    this.totalError = error;\n    this.totalLoading = false;\n    this.emitSummary();\n  }\n\n  setTotalLoading(isLoading: boolean) {\n    this.totalLoading = isLoading;\n    if (isLoading) {\n      this.totalError = undefined;\n    }\n    this.emitSummary();\n  }\n\n  setTotalRows(rows: CategoryCountRow[]) {\n    this.totalRows = rows\n      .slice()\n      .sort(\n        (left: CategoryCountRow, right: CategoryCountRow) =>\n          right.total - left.total,\n      );\n    this.totalError = undefined;\n    this.totalLoading = false;\n    this.emitSummary();\n  }\n\n  override queryPending(): this {\n    this.filteredLoading = true;\n    this.filteredError = undefined;\n    this.emitSummary();\n    return this;\n  }\n\n  override query(filter: Array<ExprNode> = []): Query {\n    return buildCategorySummaryQuery(this.tableName, this.field.name, filter);\n  }\n\n  override queryResult(data: unknown): this {\n    const rows = rowsFromQueryResult<CategoryCountRow>(data)\n      .slice()\n      .sort(\n        (left: CategoryCountRow, right: CategoryCountRow) =>\n          right.total - left.total,\n      );\n    this.filteredRows = rows;\n    this.filteredError = undefined;\n    this.filteredLoading = false;\n    this.emitSummary();\n    return this;\n  }\n\n  override queryError(error: Error): this {\n    this.filteredError = error;\n    this.filteredLoading = false;\n    this.emitSummary();\n    return this;\n  }\n\n  reset() {\n    this.selectedKey = undefined;\n    this.emitSummary();\n  }\n\n  toggleValue(key: string) {\n    if (!isSelectableCategoryKey(key)) {\n      return;\n    }\n\n    this.selectedKey = this.selectedKey === key ? undefined : key;\n    this.filterBy?.update(\n      clausePoint(\n        this.field.name,\n        categoryKeyToSelectionValue(this.selectedKey),\n        {\n          source: this,\n        },\n      ),\n    );\n    this.emitSummary();\n  }\n}\n\ntype DataTableExplorerCategoryTotalClientOptions = {\n  summaryClient: DataTableExplorerCategoryClient;\n};\n\nexport class DataTableExplorerCategoryTotalClient extends MosaicClient {\n  private readonly summaryClient: DataTableExplorerCategoryClient;\n\n  constructor(options: DataTableExplorerCategoryTotalClientOptions) {\n    super();\n    this.summaryClient = options.summaryClient;\n  }\n\n  override queryPending(): this {\n    this.summaryClient.setTotalLoading(true);\n    return this;\n  }\n\n  override query(filter: Array<ExprNode> = []): Query {\n    return this.summaryClient.query(filter);\n  }\n\n  override queryResult(data: unknown): this {\n    this.summaryClient.setTotalRows(\n      rowsFromQueryResult<CategoryCountRow>(data),\n    );\n    return this;\n  }\n\n  override queryError(error: Error): this {\n    this.summaryClient.setTotalError(error);\n    return this;\n  }\n}\n"]}

package/dist/data-table-explorer/DataTableExplorerCountClient.d.ts

@@ -0,0 +1,28 @@
+import { MosaicClient, type Selection } from '@uwdata/mosaic-core';
+import { type ExprNode, type Query } from '@uwdata/mosaic-sql';
+export type DataTableExplorerCountState = {
+    count?: number;
+    error?: Error;
+    isLoading: boolean;
+};
+type DataTableExplorerCountClientOptions = {
+    filterStable?: boolean;
+    onStateChange: (state: DataTableExplorerCountState) => void;
+    selection?: Selection;
+    tableName: string;
+};
+export declare class DataTableExplorerCountClient extends MosaicClient {
+    private count?;
+    private error?;
+    private readonly isFilterStable;
+    private readonly onStateChange;
+    private readonly tableName;
+    constructor(options: DataTableExplorerCountClientOptions);
+    get filterStable(): boolean;
+    queryPending(): this;
+    query(filter?: Array<ExprNode>): Query;
+    queryResult(data: unknown): this;
+    queryError(error: Error): this;
+}
+export {};
+//# sourceMappingURL=DataTableExplorerCountClient.d.ts.map

package/dist/data-table-explorer/DataTableExplorerCountClient.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableExplorerCountClient.d.ts","sourceRoot":"","sources":["../../src/data-table-explorer/DataTableExplorerCountClient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAE,KAAK,SAAS,EAAC,MAAM,qBAAqB,CAAC;AACjE,OAAO,EAAC,KAAK,QAAQ,EAAE,KAAK,KAAK,EAAC,MAAM,oBAAoB,CAAC;AAG7D,MAAM,MAAM,2BAA2B,GAAG;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,SAAS,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,KAAK,mCAAmC,GAAG;IACzC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,EAAE,CAAC,KAAK,EAAE,2BAA2B,KAAK,IAAI,CAAC;IAC5D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,qBAAa,4BAA6B,SAAQ,YAAY;IAC5D,OAAO,CAAC,KAAK,CAAC,CAAS;IACvB,OAAO,CAAC,KAAK,CAAC,CAAQ;IACtB,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAU;IACzC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA+C;IAC7E,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAS;gBAEvB,OAAO,EAAE,mCAAmC;IAOxD,IAAa,YAAY,IAAI,OAAO,CAEnC;IAEQ,YAAY,IAAI,IAAI;IASpB,KAAK,CAAC,MAAM,GAAE,KAAK,CAAC,QAAQ,CAAM,GAAG,KAAK;IAO1C,WAAW,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI;IAUhC,UAAU,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;CASxC"}

package/dist/data-table-explorer/DataTableExplorerCountClient.js

@@ -0,0 +1,51 @@
+import { MosaicClient } from '@uwdata/mosaic-core';
+import { buildCountQuery, readCountData } from './utils';
+export class DataTableExplorerCountClient extends MosaicClient {
+    count;
+    error;
+    isFilterStable;
+    onStateChange;
+    tableName;
+    constructor(options) {
+        super(options.selection);
+        this.isFilterStable = options.filterStable ?? false;
+        this.onStateChange = options.onStateChange;
+        this.tableName = options.tableName;
+    }
+    get filterStable() {
+        return this.isFilterStable;
+    }
+    queryPending() {
+        this.onStateChange({
+            count: this.count,
+            error: this.error,
+            isLoading: true,
+        });
+        return this;
+    }
+    query(filter = []) {
+        return buildCountQuery({
+            filter,
+            tableName: this.tableName,
+        });
+    }
+    queryResult(data) {
+        this.count = readCountData(data);
+        this.error = undefined;
+        this.onStateChange({
+            count: this.count,
+            isLoading: false,
+        });
+        return this;
+    }
+    queryError(error) {
+        this.error = error;
+        this.onStateChange({
+            count: this.count,
+            error,
+            isLoading: false,
+        });
+        return this;
+    }
+}
+//# sourceMappingURL=DataTableExplorerCountClient.js.map

package/dist/data-table-explorer/DataTableExplorerCountClient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableExplorerCountClient.js","sourceRoot":"","sources":["../../src/data-table-explorer/DataTableExplorerCountClient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAiB,MAAM,qBAAqB,CAAC;AAEjE,OAAO,EAAC,eAAe,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AAevD,MAAM,OAAO,4BAA6B,SAAQ,YAAY;IACpD,KAAK,CAAU;IACf,KAAK,CAAS;IACL,cAAc,CAAU;IACxB,aAAa,CAA+C;IAC5D,SAAS,CAAS;IAEnC,YAAY,OAA4C;QACtD,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QACzB,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC,YAAY,IAAI,KAAK,CAAC;QACpD,IAAI,CAAC,aAAa,GAAG,OAAO,CAAC,aAAa,CAAC;QAC3C,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;IACrC,CAAC;IAED,IAAa,YAAY;QACvB,OAAO,IAAI,CAAC,cAAc,CAAC;IAC7B,CAAC;IAEQ,YAAY;QACnB,IAAI,CAAC,aAAa,CAAC;YACjB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,SAAS,EAAE,IAAI;SAChB,CAAC,CAAC;QACH,OAAO,IAAI,CAAC;IACd,CAAC;IAEQ,KAAK,CAAC,SAA0B,EAAE;QACzC,OAAO,eAAe,CAAC;YACrB,MAAM;YACN,SAAS,EAAE,IAAI,CAAC,SAAS;SAC1B,CAAC,CAAC;IACL,CAAC;IAEQ,WAAW,CAAC,IAAa;QAChC,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;QACjC,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;QACvB,IAAI,CAAC,aAAa,CAAC;YACjB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,SAAS,EAAE,KAAK;SACjB,CAAC,CAAC;QACH,OAAO,IAAI,CAAC;IACd,CAAC;IAEQ,UAAU,CAAC,KAAY;QAC9B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,aAAa,CAAC;YACjB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,KAAK;YACL,SAAS,EAAE,KAAK;SACjB,CAAC,CAAC;QACH,OAAO,IAAI,CAAC;IACd,CAAC;CACF","sourcesContent":["import {MosaicClient, type Selection} from '@uwdata/mosaic-core';\nimport {type ExprNode, type Query} from '@uwdata/mosaic-sql';\nimport {buildCountQuery, readCountData} from './utils';\n\nexport type DataTableExplorerCountState = {\n  count?: number;\n  error?: Error;\n  isLoading: boolean;\n};\n\ntype DataTableExplorerCountClientOptions = {\n  filterStable?: boolean;\n  onStateChange: (state: DataTableExplorerCountState) => void;\n  selection?: Selection;\n  tableName: string;\n};\n\nexport class DataTableExplorerCountClient extends MosaicClient {\n  private count?: number;\n  private error?: Error;\n  private readonly isFilterStable: boolean;\n  private readonly onStateChange: (state: DataTableExplorerCountState) => void;\n  private readonly tableName: string;\n\n  constructor(options: DataTableExplorerCountClientOptions) {\n    super(options.selection);\n    this.isFilterStable = options.filterStable ?? false;\n    this.onStateChange = options.onStateChange;\n    this.tableName = options.tableName;\n  }\n\n  override get filterStable(): boolean {\n    return this.isFilterStable;\n  }\n\n  override queryPending(): this {\n    this.onStateChange({\n      count: this.count,\n      error: this.error,\n      isLoading: true,\n    });\n    return this;\n  }\n\n  override query(filter: Array<ExprNode> = []): Query {\n    return buildCountQuery({\n      filter,\n      tableName: this.tableName,\n    });\n  }\n\n  override queryResult(data: unknown): this {\n    this.count = readCountData(data);\n    this.error = undefined;\n    this.onStateChange({\n      count: this.count,\n      isLoading: false,\n    });\n    return this;\n  }\n\n  override queryError(error: Error): this {\n    this.error = error;\n    this.onStateChange({\n      count: this.count,\n      error,\n      isLoading: false,\n    });\n    return this;\n  }\n}\n"]}

package/dist/data-table-explorer/DataTableExplorerHeader.d.ts

@@ -0,0 +1,7 @@
+import type { UseDataTableExplorerReturn } from './types';
+export type DataTableExplorerHeaderProps = {
+    className?: string;
+    explorer: Pick<UseDataTableExplorerReturn, 'columns' | 'setSorting' | 'sorting'>;
+};
+export declare function DataTableExplorerHeader({ className, explorer, }: DataTableExplorerHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DataTableExplorerHeader.d.ts.map

package/dist/data-table-explorer/DataTableExplorerHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableExplorerHeader.d.ts","sourceRoot":"","sources":["../../src/data-table-explorer/DataTableExplorerHeader.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAKV,0BAA0B,EAC3B,MAAM,SAAS,CAAC;AAGjB,MAAM,MAAM,4BAA4B,GAAG;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,IAAI,CACZ,0BAA0B,EAC1B,SAAS,GAAG,YAAY,GAAG,SAAS,CACrC,CAAC;CACH,CAAC;AAgYF,wBAAgB,uBAAuB,CAAC,EACtC,SAAS,EACT,QAAQ,GACT,EAAE,4BAA4B,2CA6E9B"}

package/dist/data-table-explorer/DataTableExplorerHeader.js

@@ -0,0 +1,195 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Badge, cn, TableHead, TableHeader, TableRow } from '@sqlrooms/ui';
+import { ChevronDownIcon, ChevronUpIcon } from 'lucide-react';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { DATA_TABLE_EXPLORER_DEFAULT_COLUMN_WIDTH_STYLE, DATA_TABLE_EXPLORER_ROW_NUMBER_COLUMN_WIDTH_PX, DATA_TABLE_EXPLORER_ROW_NUMBER_WIDTH_STYLE, DATA_TABLE_EXPLORER_UNSUPPORTED_COLUMN_WIDTH_STYLE, getDataTableExplorerColumnWidthPx, } from './layout';
+import { isDataTableExplorerUnsupportedSummaryType } from './utils';
+const STICKY_ROW_NUMBER_CLASS = 'bg-background sticky left-0 top-0 z-40 border-r px-1 text-center';
+const STICKY_COLUMN_HEADER_CLASS = 'bg-background sticky top-0 z-30 align-top whitespace-nowrap shadow-[inset_0_-1px_0_hsl(var(--border))]';
+function getColumnWidthStyle(column) {
+    return isDataTableExplorerUnsupportedSummaryType(column.field.type)
+        ? DATA_TABLE_EXPLORER_UNSUPPORTED_COLUMN_WIDTH_STYLE
+        : DATA_TABLE_EXPLORER_DEFAULT_COLUMN_WIDTH_STYLE;
+}
+function setNextSortState(currentSorting, columnId, setSorting) {
+    const current = currentSorting.find((entry) => entry.id === columnId);
+    if (!current) {
+        setSorting([{ desc: false, id: columnId }]);
+        return;
+    }
+    if (!current.desc) {
+        setSorting([{ desc: true, id: columnId }]);
+        return;
+    }
+    setSorting([]);
+}
+function formatPercentOfTotal(value) {
+    const maximumFractionDigits = value >= 0.1 ? 0 : value >= 0.01 ? 1 : 2;
+    return Intl.NumberFormat(undefined, {
+        maximumFractionDigits,
+        style: 'percent',
+    }).format(value);
+}
+function CategorySummaryCell({ summary, }) {
+    const [hoveredKey, setHoveredKey] = useState();
+    const totalCount = summary.buckets.reduce((acc, bucket) => acc + bucket.totalCount, 0);
+    const activeBucket = summary.buckets.find((bucket) => bucket.key === hoveredKey || bucket.key === summary.selectedKey);
+    const footerLabel = activeBucket
+        ? `${activeBucket.label} (${activeBucket.totalCount.toLocaleString()} ${activeBucket.totalCount === 1 ? 'row' : 'rows'}, ${formatPercentOfTotal(totalCount > 0 ? activeBucket.totalCount / totalCount : 0)})`
+        : `${summary.bucketCount.toLocaleString()} categories`;
+    return (_jsxs("div", { className: "space-y-0.5 pt-1.5", children: [_jsx("div", { className: "flex h-10 overflow-hidden rounded-sm border", children: summary.buckets.map((bucket) => {
+                    const width = totalCount > 0
+                        ? `${(bucket.totalCount / totalCount) * 100}%`
+                        : '0%';
+                    const fillPct = bucket.totalCount > 0
+                        ? (bucket.filteredCount / bucket.totalCount) * 100
+                        : 0;
+                    const isSelected = summary.selectedKey === bucket.key;
+                    const background = bucket.kind === 'overflow'
+                        ? `repeating-linear-gradient(to right, hsl(var(--border)) 0px, hsl(var(--border)) 2px, transparent 2px, transparent 4px)`
+                        : `linear-gradient(to top, hsl(var(--chart-1)) ${fillPct}%, hsl(var(--muted-foreground) / 0.22) ${fillPct}%, hsl(var(--muted-foreground) / 0.22) 100%)`;
+                    return (_jsx("button", { type: "button", disabled: !bucket.selectable, className: cn('relative flex h-full items-center justify-center overflow-hidden border-r px-0.5 text-[10px] font-normal text-white transition-opacity disabled:cursor-default', isSelected && 'ring-ring ring-1 ring-inset', !bucket.selectable && 'text-muted-foreground'), style: {
+                            background,
+                            flexBasis: width,
+                            flexGrow: bucket.totalCount,
+                        }, onClick: () => summary.toggleValue(bucket.key), onMouseEnter: () => setHoveredKey(bucket.key), onMouseLeave: () => setHoveredKey(undefined), children: _jsx("span", { className: "max-w-full truncate px-1", children: bucket.label }) }, bucket.key));
+                }) }), _jsx("div", { className: "text-muted-foreground truncate text-[10px] font-normal", children: footerLabel })] }));
+}
+const histogramInteractorIds = new WeakMap();
+let nextHistogramInteractorId = 0;
+function getHistogramInteractorId(interactor) {
+    const cachedId = histogramInteractorIds.get(interactor);
+    if (cachedId !== undefined) {
+        return cachedId;
+    }
+    const id = ++nextHistogramInteractorId;
+    histogramInteractorIds.set(interactor, id);
+    return id;
+}
+function createScale(type, domain, range) {
+    const [d0, d1] = domain.map((value) => value instanceof Date ? value.getTime() : value);
+    const [r0, r1] = range;
+    const span = d1 - d0 || 1;
+    const rspan = r1 - r0;
+    return {
+        apply(value) {
+            const numeric = value instanceof Date ? value.getTime() : value;
+            return r0 + ((numeric - d0) / span) * rspan;
+        },
+        domain,
+        invert(value) {
+            const numeric = d0 + ((value - r0) / (rspan || 1)) * span;
+            return type === 'utc' ? new Date(numeric) : numeric;
+        },
+        range,
+        type,
+    };
+}
+function formatDomainValue(value, valueType) {
+    if (valueType === 'date') {
+        const date = value instanceof Date ? value : new Date(value);
+        return date.toISOString().slice(0, 10);
+    }
+    return Intl.NumberFormat(undefined, {
+        maximumFractionDigits: 2,
+    }).format(typeof value === 'number' ? value : value.getTime());
+}
+function HistogramSummaryCell({ summary, }) {
+    const svgRef = useRef(null);
+    const brushRootRef = useRef(null);
+    const initializedBrushRef = useRef(undefined);
+    const layout = useMemo(() => {
+        const width = 122;
+        const height = 40;
+        const margin = { bottom: 4, left: 4, right: 4, top: 2 };
+        const nullBarWidth = summary.totalNullCount > 0 ? 5 : 0;
+        const nullBarGap = nullBarWidth > 0 ? 3 : 0;
+        const totalBins = summary.totalBins.length
+            ? summary.totalBins
+            : summary.filteredBins;
+        const domain = totalBins.length > 0
+            ? [totalBins[0].x0, totalBins[totalBins.length - 1].x1]
+            : null;
+        const totalMax = Math.max(summary.totalNullCount, ...totalBins.map((bin) => bin.length), 1);
+        const xScale = domain
+            ? createScale(summary.valueType === 'date' ? 'utc' : 'linear', domain, [
+                margin.left + nullBarWidth + nullBarGap,
+                width - margin.right,
+            ])
+            : null;
+        const yScale = createScale('linear', [0, totalMax], [height - margin.bottom, margin.top]);
+        return {
+            height,
+            margin,
+            nullBarGap,
+            nullBarWidth,
+            width,
+            xScale,
+            yScale,
+        };
+    }, [summary]);
+    useEffect(() => {
+        const svg = svgRef.current;
+        const brushRoot = brushRootRef.current;
+        const interactor = summary.interactor;
+        if (!svg || !brushRoot || !interactor || !layout.xScale)
+            return;
+        const brushKey = [
+            getHistogramInteractorId(interactor),
+            summary.valueType,
+            layout.xScale.domain
+                .map((value) => (value instanceof Date ? value.getTime() : value))
+                .join(':'),
+            layout.xScale.range.join(':'),
+        ].join('|');
+        if (initializedBrushRef.current === brushKey)
+            return;
+        svg.scale = (channel) => {
+            if (channel === 'x')
+                return layout.xScale;
+            if (channel === 'y')
+                return layout.yScale;
+            return undefined;
+        };
+        brushRoot.replaceChildren();
+        interactor.init(svg, brushRoot);
+        initializedBrushRef.current = brushKey;
+    }, [layout.xScale, layout.yScale, summary.interactor, summary.valueType]);
+    const axisY = layout.height - layout.margin.bottom;
+    const nullBarCenter = layout.margin.left + layout.nullBarWidth / 2;
+    const xAxisStart = layout.xScale?.range[0] ?? layout.margin.left;
+    const xAxisEnd = layout.xScale?.range[1] ?? layout.width - layout.margin.right;
+    return (_jsxs("div", { className: "space-y-0 pt-1.5", children: [_jsxs("svg", { ref: svgRef, width: layout.width, height: layout.height, viewBox: `0 0 ${layout.width} ${layout.height}`, className: "max-w-full overflow-visible", children: [summary.totalNullCount > 0 ? (_jsx("rect", { x: layout.margin.left, y: layout.yScale.apply(summary.totalNullCount), width: layout.nullBarWidth, height: layout.yScale.apply(0) -
+                            layout.yScale.apply(summary.totalNullCount), fill: "hsl(var(--muted-foreground) / 0.22)" })) : null, summary.totalNullCount > 0 ? (_jsx("rect", { x: layout.margin.left, y: layout.yScale.apply(summary.filteredNullCount), width: layout.nullBarWidth, height: layout.yScale.apply(0) -
+                            layout.yScale.apply(summary.filteredNullCount), fill: "hsl(var(--chart-1))", opacity: 0.95 })) : null, summary.totalBins.map((bin, index) => {
+                        const x0 = layout.xScale?.apply(bin.x0) ?? 0;
+                        const x1 = layout.xScale?.apply(bin.x1) ?? 0;
+                        const y = layout.yScale.apply(bin.length);
+                        return (_jsx("rect", { x: x0 + 1, y: y, width: Math.max(x1 - x0 - 1, 1), height: layout.yScale.apply(0) - y, fill: "hsl(var(--muted-foreground) / 0.22)" }, `bg-${index}`));
+                    }), summary.filteredBins.map((bin, index) => {
+                        const x0 = layout.xScale?.apply(bin.x0) ?? 0;
+                        const x1 = layout.xScale?.apply(bin.x1) ?? 0;
+                        const y = layout.yScale.apply(bin.length);
+                        return (_jsx("rect", { x: x0 + 1, y: y, width: Math.max(x1 - x0 - 1, 1), height: layout.yScale.apply(0) - y, fill: "hsl(var(--chart-1))", opacity: 0.95 }, `fg-${index}`));
+                    }), _jsx("line", { x1: xAxisStart, x2: xAxisEnd, y1: axisY, y2: axisY, stroke: "hsl(var(--border))" }), _jsx("line", { x1: xAxisStart, x2: xAxisStart, y1: axisY, y2: axisY + 2.5, stroke: "hsl(var(--border))" }), _jsx("line", { x1: xAxisEnd, x2: xAxisEnd, y1: axisY, y2: axisY + 2.5, stroke: "hsl(var(--border))" }), summary.totalNullCount > 0 ? (_jsx("line", { x1: nullBarCenter, x2: nullBarCenter, y1: axisY, y2: axisY + 2.5, stroke: "hsl(var(--chart-1))" })) : null, _jsx("g", { ref: brushRootRef })] }), _jsxs("div", { className: "text-muted-foreground relative h-3.5 text-[10px] font-normal", children: [summary.totalNullCount > 0 ? (_jsx("span", { className: "absolute -translate-x-1/2", style: { left: nullBarCenter }, children: "\u2205" })) : null, _jsx("span", { className: "absolute", style: { left: xAxisStart }, children: summary.totalBins[0]
+                            ? formatDomainValue(summary.totalBins[0].x0, summary.valueType)
+                            : '0' }), _jsx("span", { className: "absolute -translate-x-full", style: { left: xAxisEnd }, children: summary.totalBins.at(-1)
+                            ? formatDomainValue(summary.totalBins.at(-1).x1, summary.valueType)
+                            : '0' })] })] }));
+}
+function SummaryCell({ column }) {
+    if (column.summary.kind === 'histogram') {
+        return _jsx(HistogramSummaryCell, { summary: column.summary });
+    }
+    if (column.summary.kind === 'category') {
+        return _jsx(CategorySummaryCell, { summary: column.summary });
+    }
+    return (_jsx("div", { className: "text-muted-foreground pt-1.5 text-[10px] font-normal", children: column.summary.label }));
+}
+export function DataTableExplorerHeader({ className, explorer, }) {
+    return (_jsxs(_Fragment, { children: [_jsxs("colgroup", { children: [_jsx("col", { style: { width: DATA_TABLE_EXPLORER_ROW_NUMBER_COLUMN_WIDTH_PX } }), explorer.columns.map((column) => (_jsx("col", { style: { width: getDataTableExplorerColumnWidthPx(column) } }, column.name)))] }), _jsx(TableHeader, { className: cn('sticky top-0 z-30', className), children: _jsxs(TableRow, { children: [_jsx(TableHead, { className: STICKY_ROW_NUMBER_CLASS, style: DATA_TABLE_EXPLORER_ROW_NUMBER_WIDTH_STYLE, children: "#" }), explorer.columns.map((column) => {
+                            const sortState = explorer.sorting.find((entry) => entry.id === column.name);
+                            return (_jsx(TableHead, { className: STICKY_COLUMN_HEADER_CLASS, style: getColumnWidthStyle(column), children: _jsxs("div", { className: "min-w-0", children: [_jsxs("button", { type: "button", className: "group relative flex w-full items-start gap-1.5 pr-4 text-left", onClick: () => setNextSortState(explorer.sorting, column.name, explorer.setSorting), children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "truncate text-[13px] leading-tight font-semibold", children: column.name }), _jsx(Badge, { variant: "outline", className: "mt-0.5 max-w-full truncate px-2 py-0 text-[9px] opacity-60", children: String(column.field.type) })] }), _jsx("span", { className: "text-muted-foreground pointer-events-none absolute top-1 right-0 flex h-4 w-4 items-center justify-center", children: sortState ? (sortState.desc ? (_jsx(ChevronDownIcon, { className: "h-4 w-4" })) : (_jsx(ChevronUpIcon, { className: "h-4 w-4" }))) : (_jsxs("span", { className: "flex h-4 w-4 flex-col items-center justify-center opacity-0 transition-opacity group-hover:opacity-60", children: [_jsx(ChevronUpIcon, { className: "-mb-1 h-3 w-3" }), _jsx(ChevronDownIcon, { className: "-mt-1 h-3 w-3" })] })) })] }), _jsx(SummaryCell, { column: column })] }) }, column.name));
+                        })] }) })] }));
+}
+//# sourceMappingURL=DataTableExplorerHeader.js.map