@devtable/dashboard 4.4.0 → 4.6.0

package/dist/model/{panels → views/view/panels}/index.d.ts

@@ -26,15 +26,15 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
         queryID: import("mobx-state-tree").ISimpleType<string>;
         viz: import("mobx-state-tree").IModelType<{
             type: import("mobx-state-tree").ISimpleType<string>;
-            conf: import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>;
+            conf: import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>;
         }, {
             readonly json: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         } & {
             setType(type: string): void;
-            setConf(conf: import("../..").AnyObject): void;
+            setConf(conf: import("../../../..").AnyObject): void;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
     }, {
         readonly json: {
@@ -52,7 +52,7 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
             queryID: string;
             viz: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         };
     } & {
@@ -87,15 +87,15 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
         queryID: import("mobx-state-tree").ISimpleType<string>;
         viz: import("mobx-state-tree").IModelType<{
             type: import("mobx-state-tree").ISimpleType<string>;
-            conf: import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>;
+            conf: import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>;
         }, {
             readonly json: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         } & {
             setType(type: string): void;
-            setConf(conf: import("../..").AnyObject): void;
+            setConf(conf: import("../../../..").AnyObject): void;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
     }, {
         readonly json: {
@@ -113,7 +113,7 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
             queryID: string;
             viz: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         };
     } & {
@@ -139,7 +139,7 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
         queryID: string;
         viz: {
             type: string;
-            conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+            conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
         };
     }[];
     readonly layouts: {
@@ -195,26 +195,26 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
         queryID: string;
         viz: {
             type: string;
-            conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+            conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
         } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
             readonly json: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         } & {
             setType(type: string): void;
-            setConf(conf: import("../..").AnyObject): void;
+            setConf(conf: import("../../../..").AnyObject): void;
         } & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IModelType<{
             type: import("mobx-state-tree").ISimpleType<string>;
-            conf: import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>;
+            conf: import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>;
         }, {
             readonly json: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         } & {
             setType(type: string): void;
-            setConf(conf: import("../..").AnyObject): void;
+            setConf(conf: import("../../../..").AnyObject): void;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
         readonly json: {
@@ -232,7 +232,7 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
             queryID: string;
             viz: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         };
     } & {
@@ -266,15 +266,15 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
         queryID: import("mobx-state-tree").ISimpleType<string>;
         viz: import("mobx-state-tree").IModelType<{
             type: import("mobx-state-tree").ISimpleType<string>;
-            conf: import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>;
+            conf: import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>;
         }, {
             readonly json: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         } & {
             setType(type: string): void;
-            setConf(conf: import("../..").AnyObject): void;
+            setConf(conf: import("../../../..").AnyObject): void;
         }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
     }, {
         readonly json: {
@@ -292,7 +292,7 @@ export declare const PanelsModel: import("mobx-state-tree").IModelType<{
             queryID: string;
             viz: {
                 type: string;
-                conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+                conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
             };
         };
     } & {

package/dist/model/{panels → views/view/panels}/panel.d.ts

@@ -25,15 +25,15 @@ export declare const PanelModel: import("mobx-state-tree").IModelType<{
     queryID: import("mobx-state-tree").ISimpleType<string>;
     viz: import("mobx-state-tree").IModelType<{
         type: import("mobx-state-tree").ISimpleType<string>;
-        conf: import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>;
+        conf: import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>;
     }, {
         readonly json: {
             type: string;
-            conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+            conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
         };
     } & {
         setType(type: string): void;
-        setConf(conf: import("../..").AnyObject): void;
+        setConf(conf: import("../../../..").AnyObject): void;
     }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
 }, {
     readonly json: {
@@ -51,7 +51,7 @@ export declare const PanelModel: import("mobx-state-tree").IModelType<{
         queryID: string;
         viz: {
             type: string;
-            conf: import("../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../..").AnyObject, import("../..").AnyObject, import("../..").AnyObject>>;
+            conf: import("../../../..").AnyObject & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<import("../../../..").AnyObject, import("../../../..").AnyObject, import("../../../..").AnyObject>>;
         };
     };
 } & {

package/dist/panel/index.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 import { IDashboardPanel } from '../types/dashboard';
+import { ViewModelInstance } from '..';
 interface IPanel extends IDashboardPanel {
+    view: ViewModelInstance;
 }
 export declare const Panel: React.FunctionComponent<IPanel>;
 export {};

package/dist/panel/title-bar.d.ts

@@ -1,2 +1,5 @@
 import React from 'react';
-export declare const PanelTitleBar: React.FunctionComponent<object>;
+import { ViewModelInstance } from '..';
+export declare const PanelTitleBar: React.FunctionComponent<{
+    view: ViewModelInstance;
+}>;

package/dist/plugins/color-manager/color-manager.d.ts

@@ -1,7 +1,9 @@
-import { IColorPaletteItem, ISingleColor } from '~/types/plugin';
+import { IColorInterpolation, IColorPaletteItem, ISingleColor } from '~/types/plugin';
 export interface IColorManager {
     getStaticColors(): ISingleColor[];
+    getColorInterpolations(): IColorInterpolation[];
     register<T extends IColorPaletteItem>(paletteItem: T): void;
     decodeStaticColor(key: string): ISingleColor | undefined;
-    encodeColor(color: ISingleColor): string;
+    encodeColor(color: IColorPaletteItem): string;
+    decodeInterpolation(key: string): IColorInterpolation | undefined;
 }

package/dist/plugins/color-manager/impl.d.ts

@@ -1,10 +1,13 @@
-import { IColorPaletteItem, IPluginManager, ISingleColor } from '~/types/plugin';
+import { IColorInterpolation, IColorPaletteItem, IPluginManager, ISingleColor } from '~/types/plugin';
 import { IColorManager } from '~/plugins/color-manager';
 export declare class ColorManager implements IColorManager {
     protected staticColors: Map<string, ISingleColor>;
+    protected interpolations: Map<string, IColorInterpolation>;
     constructor(pluginManager: IPluginManager);
     getStaticColors(): ISingleColor[];
     register<T extends IColorPaletteItem>(paletteItem: T): void;
     decodeStaticColor(key: string): ISingleColor | undefined;
     encodeColor(color: IColorPaletteItem): string;
+    decodeInterpolation(key: string): IColorInterpolation | undefined;
+    getColorInterpolations(): IColorInterpolation[];
 }

package/dist/plugins/color-manager/multi-step-value-mapper.d.ts

@@ -0,0 +1,9 @@
+import { IValueStep } from '~/types/plugin';
+import { IValueMapper } from './type';
+export declare class MultiStepValueMapper implements IValueMapper {
+    steps: IValueStep[];
+    constructor(steps: IValueStep[]);
+    protected getLinearFunction(p1: IValueStep, p2: IValueStep): (x: number) => number;
+    protected getStepFunctionForValue(value: number): (x: number) => number;
+    mapValue(from: number): number;
+}

package/dist/plugins/color-manager/type.d.ts

@@ -0,0 +1,7 @@
+export interface IValueMapper {
+    /**
+     * Maps any number to a number between 0 and 100
+     * @param from
+     */
+    mapValue(from: number): number;
+}

package/dist/plugins/colors/diverging-color.d.ts

@@ -0,0 +1,2 @@
+import { IColorInterpolation } from '~/types/plugin';
+export declare const createDivergingColorPalette: (left: string[], right: string[]) => IColorInterpolation['getColor'];

package/dist/plugins/colors/index.d.ts

@@ -0,0 +1,9 @@
+import { IColorInterpolation } from '~/types/plugin';
+export { createDivergingColorPalette } from './diverging-color';
+export { createSequentialColorPalette } from './sequential-color';
+export declare const RedGreen: IColorInterpolation;
+export declare const YellowBlue: IColorInterpolation;
+export declare const Red: IColorInterpolation;
+export declare const Green: IColorInterpolation;
+export declare const Blue: IColorInterpolation;
+export declare const Orange: IColorInterpolation;

package/dist/plugins/colors/sequential-color.d.ts

@@ -0,0 +1,2 @@
+import { IColorInterpolation } from '~/types/plugin';
+export declare const createSequentialColorPalette: (colors: string[]) => IColorInterpolation['getColor'];

package/dist/plugins/controls/color-interpolation-select/index.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { IColorManager } from '~/plugins';
+import { IColorInterpolationConfig } from '~/types/plugin';
+export interface IColorInterpolationSelectProps {
+    colorManager: IColorManager;
+    value: IColorInterpolationConfig;
+    onChange?: (value: IColorInterpolationConfig) => void;
+}
+export declare const ColorInterpolationSelect: (props: IColorInterpolationSelectProps) => JSX.Element;

package/dist/plugins/controls/color-mapping-editor/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { IColorInterpolation, IValueStep } from '~/types/plugin';
+export interface IColorMappingEditorProps {
+    steps: IValueStep[];
+    onChange?: (steps: IValueStep[]) => void;
+    interpolation: IColorInterpolation;
+}
+export declare const ColorMappingEditor: React.FunctionComponent<IColorMappingEditorProps>;

package/dist/plugins/controls/color-mapping-editor/style.d.ts

@@ -0,0 +1,6 @@
+export declare const useStyles: (params: void, options?: import("@mantine/core").UseStylesOptions<"palette" | "paletteItem"> | undefined) => {
+    classes: Record<"palette" | "paletteItem", string>;
+    cx: (...args: any) => string;
+    theme: import("@mantine/core").MantineTheme;
+};
+export declare type StylesType = ReturnType<typeof useStyles>;

package/dist/plugins/viz-components/table/components/background-color-select.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { CellBackgroundColorType } from '~/plugins/viz-components/table/type';
+export interface IBackgroundColorSelectProps {
+    value?: CellBackgroundColorType;
+    onChange?: (value: CellBackgroundColorType) => void;
+}
+export declare const BackgroundColorSelect: (props: IBackgroundColorSelectProps) => JSX.Element;

package/dist/plugins/viz-components/table/type.d.ts

@@ -1,13 +1,16 @@
+import { IColorInterpolationConfig } from '~/types/plugin';
 export declare enum ValueType {
     string = "string",
     number = "number",
     eloc = "eloc",
     percentage = "percentage"
 }
+export declare type CellBackgroundColorType = string | IColorInterpolationConfig;
 export interface IColumnConf {
     label: string;
     value_field: string;
     value_type: ValueType;
+    cellBackgroundColor?: CellBackgroundColorType;
 }
 export interface ITableConf {
     id_field: string;
@@ -23,4 +26,5 @@ export declare const DEFAULT_CONFIG: ITableConf;
 export interface ITableCellContext {
     getClickHandler(): (() => void) | undefined;
     isClickable(): boolean;
+    bgColor: string | undefined;
 }

package/dist/style.css

@@ -1 +1 @@
-.viz-root{width:100%;overflow:scroll;padding-top:5px;height:calc(100% - 25px);background-color:#fff}.panel-title-wrapper{text-align:center;transition:background-color .3s ease}.panel-title-wrapper:hover{cursor:pointer;background-color:#6464640d}.panel-root{padding:5px;height:100%;width:100%;max-width:100%;background:transparent;border-radius:5px;box-shadow:0 0 10px #0003}.panel-settings-tabs{width:100%;height:100%}.panel-settings-tabs .mantine-Tabs-panel{height:calc(100% - 25px)}.panel-settings-tabs .mantine-Tabs-tabsListWrapper{flex:0}.panel-settings-tabs .mantine-Tabs-body{flex:1;overflow:scroll}.dashboard-layout{margin-left:-10px;margin-right:-10px}.react-grid-item{padding:0}.remove-panel{position:absolute;right:2px;top:0;cursor:pointer}.code-textarea textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.filter-settings-tabs{width:100%;height:100%}.filter-settings-tabs .mantine-Tabs-panel{height:calc(100% - 25px)}.filter-settings-tabs .mantine-Tabs-tabsListWrapper{flex:0}.filter-settings-tabs .mantine-Tabs-body{flex:1;overflow:scroll}.dashboard-root{overflow:scroll;padding:0 10px 10px}.dashboard-sticky-area{z-index:100;background:white;margin:0 -10px;padding:0 10px 10px}
+.filter-settings-tabs{width:100%;height:100%}.filter-settings-tabs .mantine-Tabs-panel{height:calc(100% - 25px)}.filter-settings-tabs .mantine-Tabs-tabsListWrapper{flex:0}.filter-settings-tabs .mantine-Tabs-body{flex:1;overflow:scroll}.viz-root{width:100%;overflow:scroll;padding-top:5px;height:calc(100% - 25px);background-color:#fff}.panel-title-wrapper{text-align:center;transition:background-color .3s ease}.panel-title-wrapper:hover{cursor:pointer;background-color:#6464640d}.panel-root{padding:5px;height:100%;width:100%;max-width:100%;background:transparent;border-radius:4px;border:1px solid #ced4da}.panel-settings-tabs{width:100%;height:100%}.panel-settings-tabs .mantine-Tabs-panel{height:calc(100% - 25px)}.panel-settings-tabs .mantine-Tabs-tabsListWrapper{flex:0}.panel-settings-tabs .mantine-Tabs-body{flex:1;overflow:scroll}.dashboard-layout{margin-left:-10px;margin-right:-10px}.react-grid-item{padding:0}.remove-panel{position:absolute;right:2px;top:0;cursor:pointer}.code-textarea textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.dashboard-root{overflow:scroll;padding:0 10px 10px;height:100%}.dashboard-sticky-area{z-index:100;background:white;margin:0 -10px;padding:0 10px 10px}

package/dist/types/dashboard.d.ts

@@ -29,11 +29,22 @@ export interface IDashboardDefinition {
     sqlSnippets: SQLSnippetModelInstance[];
     queries: QueryModelInstance[];
 }
+export declare enum EViewComponentType {
+    Division = "div",
+    Modal = "modal"
+}
+export interface IDashboardView {
+    id: string;
+    name: string;
+    type: EViewComponentType;
+    config: Record<string, any>;
+    panels: IDashboardPanel[];
+}
 export interface IDashboard {
     id: string;
     name: string;
     definition: IDashboardDefinition;
-    panels: IDashboardPanel[];
+    views: IDashboardView[];
     filters: FilterModelInstance[];
 }
 export interface IDashboardConfig {

package/dist/types/plugin/index.d.ts

@@ -37,9 +37,14 @@ export interface ISingleColor extends IColorPaletteItem {
     type: 'single';
     value: string;
 }
-export interface ColorInterpolation extends IColorPaletteItem {
+export interface IColorInterpolation extends IColorPaletteItem {
     type: 'interpolation';
-    interpolation: (value: number) => string;
+    displayName: string;
+    /**
+     * Map a value (0-100) to a color
+     * @param value
+     */
+    getColor: (value: number) => string;
 }
 export interface ColorPalette {
     getColor(colorInfo: IColorPaletteItem): (value: unknown) => string;
@@ -184,4 +189,12 @@ export interface IVizInteractionManager {
     removeInteraction(interactionId: string): Promise<void>;
     runInteraction(triggerId: string, payload: Record<string, unknown>): Promise<void>;
 }
+export interface IValueStep {
+    from: number;
+    to: number;
+}
+export interface IColorInterpolationConfig {
+    steps: IValueStep[];
+    interpolation: string;
+}
 export {};

package/dist/view/index.d.ts

@@ -0,0 +1,2 @@
+export * from './main-view';
+export * from './read-only-view';

package/dist/view/layout/index.d.ts

@@ -0,0 +1,2 @@
+export * from './main-layout';
+export * from './read-only-layout';

package/dist/view/layout/main-layout.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { ViewModelInstance } from '~/model';
+interface IMainDashboardLayout {
+    view: ViewModelInstance;
+    className?: string;
+    rowHeight?: number;
+    isDraggable: boolean;
+    isResizable: boolean;
+}
+export declare const MainDashboardLayout: React.FunctionComponent<IMainDashboardLayout>;
+export {};

package/dist/{layout/read-only.d.ts → view/layout/read-only-layout.d.ts}

@@ -1,5 +1,7 @@
 /// <reference types="react" />
+import { ViewModelInstance } from '~/model';
 interface IReadOnlyDashboardLayout {
+    view: ViewModelInstance;
     className?: string;
     rowHeight?: number;
 }

package/dist/view/main-view.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { ViewModelInstance } from '..';
+interface IMainDashboardView {
+    view: ViewModelInstance;
+    saveDashboardChanges: () => void;
+}
+export declare const MainDashboardView: import("react").FunctionComponent<IMainDashboardView>;
+export {};

package/dist/view/read-only-view.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { ViewModelInstance } from '..';
+interface IReadOnlyDashboardView {
+    view: ViewModelInstance;
+}
+export declare const ReadOnlyDashboardView: import("react").FunctionComponent<IReadOnlyDashboardView>;
+export {};

package/dist/view/view-component/preview/division.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+export declare const PreviewViewDivision: (({ children }: {
+    children: ReactNode;
+}) => JSX.Element) & {
+    displayName: string;
+};

package/dist/view/view-component/preview/index.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+import { ViewModelInstance } from '~/model';
+export declare const PreviewViewComponent: (({ view, children }: {
+    view: ViewModelInstance;
+    children: ReactNode;
+}) => JSX.Element) & {
+    displayName: string;
+};

package/dist/view/view-component/preview/modal.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+import { ViewModelInstance } from '~/model';
+export declare const PreviewViewModal: (({ children, view }: {
+    children: ReactNode;
+    view: ViewModelInstance;
+}) => JSX.Element) & {
+    displayName: string;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devtable/dashboard",
-  "version": "4.4.0",
+  "version": "4.6.0",
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public",
@@ -32,6 +32,8 @@
   },
   "dependencies": {
     "@tanstack/react-table": "^8.5.13",
+    "@types/chroma-js": "^2.1.4",
+    "chroma-js": "^2.4.2",
     "eventemitter2": "^6.4.6",
     "file-saver": "2.0.5",
     "jszip": "3.10.1",