@vuu-ui/vuu-chart 4.0.0-alpha.9 → 4.0.0-beta.2

package/package.json

@@ -1,8 +1,7 @@
 {
-  "version": "4.0.0-alpha.9",
+  "version": "4.0.0-beta.2",
   "description": "support for apache echarts using vuu data",
   "main": "./src/index.js",
-  "type": "module",
   "license": "Apache-2.0",
   "scripts": {
     "build:dev": "node ../../scripts/run-build.mjs",
@@ -10,19 +9,19 @@
     "type-defs": "node ../../scripts/build-type-defs.mjs"
   },
   "devDependencies": {
-    "@vuu-ui/vuu-data-types": "4.0.0-alpha.9",
-    "@vuu-ui/vuu-protocol-types": "4.0.0-alpha.9",
-    "@vuu-ui/vuu-data-local": "4.0.0-alpha.9"
+    "@vuu-ui/vuu-data-types": "4.0.0-beta.2",
+    "@vuu-ui/vuu-protocol-types": "4.0.0-beta.2",
+    "@vuu-ui/vuu-data-local": "4.0.0-beta.2"
   },
   "dependencies": {
-    "@salt-ds/styles": "0.2.1",
-    "@salt-ds/window": "0.1.1",
-    "@vuu-ui/vuu-context-menu": "4.0.0-alpha.9",
-    "@vuu-ui/vuu-utils": "4.0.0-alpha.9",
-    "clsx": "^2.0.0"
+    "@salt-ds/styles": "0.4.1",
+    "@salt-ds/window": "0.1.2",
+    "@vuu-ui/vuu-context-menu": "4.0.0-beta.2",
+    "@vuu-ui/vuu-utils": "4.0.0-beta.2",
+    "clsx": "^2.0.0",
+    "echarts": "6.1.0"
   },
   "peerDependencies": {
-    "echarts": "6.0.0",
     "react": "^19.2.3",
     "react-dom": "^19.2.3"
   },
@@ -34,10 +33,12 @@
   "exports": {
     ".": {
       "import": "./src/index.js",
+      "default": "./src/index.js",
       "types": "./types/index.d.ts"
     }
   },
   "module": "./src/index.js",
   "name": "@vuu-ui/vuu-chart",
+  "type": "module",
   "types": "types/index.d.ts"
 }

package/types/Chart.d.ts

@@ -1,4 +1,4 @@
-import { type ChartOptionsProps } from "./useChartOptions";
+import { ChartOptionsProps } from "./useChartOptions";
 import { type MeasuredContainerProps } from "@vuu-ui/vuu-ui-controls";
 type OptionSettings = {
     notMerge: boolean;
@@ -24,5 +24,5 @@ export interface ChartProps extends ChartOptionsProps, Omit<MeasuredContainerPro
     palette?: string[];
     showTooltip?: boolean;
 }
-export declare const Chart: ({ categoryColumnName, chartSettings, className, config, dataExclusions, dataSource, height, optionSettings, palette, resizeStrategy, showTooltip, style, seriesColumnNames, width, ...htmlAttributes }: ChartProps) => import("react").JSX.Element;
+export declare const Chart: ({ categoryColumnName, chartSettings, className, config, dataExclusions, dataSource, height, optionSettings, palette, resizeStrategy, showTooltip, style, seriesColumnNames, width, ...htmlAttributes }: ChartProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/types/src/Chart.d.ts

@@ -1,28 +0,0 @@
-import { ChartOptionsProps } from "./useChartOptions";
-import { type MeasuredContainerProps } from "@vuu-ui/vuu-ui-controls";
-type OptionSettings = {
-    notMerge: boolean;
-};
-type ChartSettings = {
-    /**
-     * Default value will be svg
-     */
-    renderer: "svg" | "canvas";
-    /**
-     * Enlarges 'click zone' around interactive elements.
-     * Default value true;
-     */
-    useCoarsePointer: boolean;
-};
-export interface ChartProps extends ChartOptionsProps, Omit<MeasuredContainerProps, "children" | "onResize"> {
-    chartSettings?: Partial<ChartSettings>;
-    optionSettings?: OptionSettings;
-    /**
-     * An array of color values that will be assigned, in the order given
-     * to rendered series.
-     */
-    palette?: string[];
-    showTooltip?: boolean;
-}
-export declare const Chart: ({ categoryColumnName, chartSettings, className, config, dataExclusions, dataSource, height, optionSettings, palette, resizeStrategy, showTooltip, style, seriesColumnNames, width, ...htmlAttributes }: ChartProps) => import("react").JSX.Element;
-export {};

package/types/src/ChartSeries.d.ts

@@ -1,32 +0,0 @@
-import { DataSource, DataSourceRow, DataSourceSubscribeCallback } from "@vuu-ui/vuu-data-types";
-import { EventEmitter } from "@vuu-ui/vuu-utils";
-import { Series } from "./chart-types";
-import { ChartConfig, DataExclusionOptions } from "./useChartOptions";
-export type DataSourceValue = {
-    key: string;
-    readonly row: DataSourceRow;
-    value: number | null;
-};
-export type ChartEvents = {
-    update: () => void;
-};
-export interface ChartSeriesConstructorProps {
-    dataExclusions?: DataExclusionOptions;
-    dataSource: DataSource;
-    config: ChartConfig;
-    palette: string[];
-}
-export declare class ChartSeries extends EventEmitter<ChartEvents> {
-    #private;
-    handleData: DataSourceSubscribeCallback;
-    buildCategoriesAndSeries(): void;
-    constructor({ config, dataExclusions, dataSource, palette, }: ChartSeriesConstructorProps);
-    get palette(): (string | undefined)[];
-    get categoryColumn(): string;
-    set categoryColumn(categoryColumn: string);
-    get seriesColumnNames(): string[];
-    set seriesColumnNames(seriesColumnNames: string[]);
-    get categories(): string[];
-    get series(): Series[];
-    private getCategoriesAndSeries;
-}

package/types/src/DataRowMovingWindow.d.ts

@@ -1,23 +0,0 @@
-import { DataSourceRow } from "@vuu-ui/vuu-data-types";
-import { VuuRange } from "@vuu-ui/vuu-protocol-types";
-import { WindowRange } from "@vuu-ui/vuu-utils";
-export declare class MovingDataRowWindow {
-    #private;
-    data: DataSourceRow[];
-    rowCount: number;
-    constructor({ from, to }: VuuRange);
-    setRowCount: (rowCount: number) => void;
-    add(data: DataSourceRow): void;
-    getAtIndex(index: number): DataSourceRow | undefined;
-    getByKey(key: string): DataSourceRow | undefined;
-    isWithinRange(index: number): boolean;
-    setRange({ from, to }: VuuRange): void;
-    get hasData(): boolean;
-    /**
-     * This will throw if there is no data. Check `hasData` first
-     * to guard against this, if not certain.
-     */
-    get firstRow(): DataSourceRow;
-    get range(): WindowRange;
-    get hasAllRowsWithinRange(): boolean;
-}

package/types/src/chart-types.d.ts

@@ -1,42 +0,0 @@
-import { DataSourceValue } from "./ChartSeries";
-export declare const defaultItemColorFunction: ItemColorFunction;
-export type EChartsCallbackParams = {
-    color: string;
-    data: DataSourceValue;
-    dataIndex: number;
-    name: string;
-    /**
-     * This is the Vuu column name
-     */
-    seriesName: string;
-};
-export type SymbolSizeFunction = (value: number, params: EChartsCallbackParams) => number | [number, number];
-export type SymbolSize = number | [number, number] | SymbolSizeFunction;
-export type SymbolType = "emptyCircle" | "circle" | `path://${string}`;
-export type ItemColorFunction = (params: EChartsCallbackParams) => string;
-export interface SeriesBase {
-    data: DataSourceValue[];
-    id: string;
-    itemStyle?: {
-        borderColor?: string;
-        color: string | ItemColorFunction;
-        borderWidth?: number;
-    };
-    label: string;
-    name: string;
-    symbol?: SymbolType;
-    symbolSize: SymbolSize;
-}
-export interface LineSeries extends SeriesBase {
-    connectNulls?: boolean;
-    lineStyle: {
-        color?: string;
-        width: number;
-    };
-    type: "line";
-}
-export interface ScatterSeries extends SeriesBase {
-    type: "scatter";
-}
-export type Series = LineSeries | ScatterSeries;
-export type ChartSelectionModel = "none" | "single" | "single-no-deselect" | "extended";

package/types/src/chartTooltip.d.ts

@@ -1,12 +0,0 @@
-import { DataSourceValue } from "./ChartSeries";
-export interface TooltipParams {
-    axisValueLabel: string;
-    color: string;
-    componentType: string;
-    componentSubType: string;
-    data: DataSourceValue;
-    seriesName: string;
-    seriesType: 'line' | 'scatter';
-    value: number;
-}
-export declare const chartTooltip: (params: TooltipParams[]) => string | undefined;

package/types/src/index.d.ts

@@ -1,5 +0,0 @@
-export { Chart, type ChartProps } from "./Chart";
-export type { ItemColorFunction, LineSeries as Series } from './chart-types';
-export { ChartSeries, type DataSourceValue } from "./ChartSeries";
-export type { ChartContextMenuOptions, ChartMenuLocation } from "./useChartContextMenu";
-export type { ChartConfig, DataExclusionOptions } from './useChartOptions';

package/types/src/useChartContextMenu.d.ts

@@ -1,16 +0,0 @@
-import { DataSourceRow } from "@vuu-ui/vuu-data-types";
-import { ECElementEvent } from "echarts";
-import { ColumnMap } from "@vuu-ui/vuu-utils";
-export type ChartMenuLocation = "canvas" | "series";
-export type ChartContextMenuOptions = {
-    column: string;
-    columnMap: ColumnMap;
-    row: DataSourceRow;
-};
-interface ChartContextMenuHookProps {
-    allowContextMenu?: boolean;
-    categoryColumnName?: string;
-    columnMap: ColumnMap;
-}
-export declare const useChartContextMenu: ({ columnMap, }: ChartContextMenuHookProps) => ({ data, event, seriesName }: ECElementEvent) => void;
-export {};

package/types/src/useChartOptions.d.ts

@@ -1,28 +0,0 @@
-import { DataSource, DataSourceRow } from "@vuu-ui/vuu-data-types";
-import { ColumnMap } from "@vuu-ui/vuu-utils";
-import { type EChartsCoreOption } from "echarts";
-import type { ChartSelectionModel, ItemColorFunction, SymbolSize, SymbolSizeFunction, SymbolType } from "./chart-types";
-export interface ChartConfig {
-    itemColorFunction?: ItemColorFunction;
-    selectionModel?: ChartSelectionModel;
-    symbolSize?: SymbolSize;
-}
-export interface DataExclusionOptions {
-    isExcludedData: (row: DataSourceRow, columnMap: ColumnMap, column: string) => boolean;
-    /**
-     * An embedded SVG path. If provided, will be used to render excluded values.
-     */
-    symbol?: SymbolType;
-}
-export interface ChartOptionsProps {
-    categoryColumnName: string;
-    config: ChartConfig;
-    dataExclusions?: DataExclusionOptions;
-    dataSource: DataSource;
-    itemColorFunction?: ItemColorFunction;
-    palette?: string[];
-    seriesColumnNames: string[];
-    showTooltip?: boolean;
-    symbolSizeFunction?: SymbolSizeFunction;
-}
-export declare const useChartOptions: ({ categoryColumnName, config, dataExclusions, dataSource, itemColorFunction, palette, seriesColumnNames, showTooltip, symbolSizeFunction: symbolSize, }: ChartOptionsProps) => EChartsCoreOption;

package/types/src/useChartSelection.d.ts

@@ -1,14 +0,0 @@
-import { ECElementEvent } from "echarts";
-import { ChartSelectionModel, ItemColorFunction, SymbolSizeFunction } from "./chart-types";
-interface ChartSelectionHookProps {
-    selectionModel?: ChartSelectionModel;
-    categoryColumnName: string;
-}
-export declare const useChartSelection: (_props: ChartSelectionHookProps) => {
-    onClick: ({ data, event, seriesName: column }: ECElementEvent) => void;
-    onMouseOver: ({ data, seriesName }: ECElementEvent) => void;
-    onMouseOut: () => void;
-    itemColorFunction: ItemColorFunction;
-    symbolSizeFunction: SymbolSizeFunction;
-};
-export {};