@devtable/dashboard 2.4.0 → 2.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devtable/dashboard",
-  "version": "2.4.0",
+  "version": "2.5.0",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
@@ -24,9 +24,15 @@
   "scripts": {
     "dev-build": "tsc && vite build --watch",
     "build": "tsc && vite build",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "test": "vitest",
+    "test:ui": "vitest --ui",
+    "coverage": "vitest --coverage"
   },
   "dependencies": {
+    "eventemitter2": "^6.4.6",
+    "file-saver": "2.0.5",
+    "jszip": "3.10.1",
     "popmotion": "^11.0.3"
   },
   "devDependencies": {
@@ -38,17 +44,24 @@
     "@mantine/notifications": "^5.0.2",
     "@mantine/prism": "^5.0.2",
     "@mantine/rte": "^5.0.2",
+    "@testing-library/jest-dom": "^5.16.4",
+    "@testing-library/react": "^13.3.0",
+    "@testing-library/react-hooks": "^8.0.1",
+    "@testing-library/user-event": "^14.3.0",
+    "@types/file-saver": "2.0.5",
     "@types/lodash": "^4.14.182",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@types/react-grid-layout": "^1.3.2",
     "@vitejs/plugin-react": "^1.3.0",
+    "@vitest/ui": "^0.19.1",
     "ahooks": "^3.3.11",
     "axios": "^0.27.2",
     "echarts": "^5.3.2",
     "echarts-for-react": "^3.0.2",
     "echarts-gl": "^2.0.9",
     "echarts-stat": "1.2.0",
+    "jsdom": "^20.0.0",
     "lodash": "^4.17.21",
     "numbro": "^2.3.6",
     "react-grid-layout": "^1.3.4",
@@ -56,8 +69,9 @@
     "rollup-plugin-visualizer": "5.6.0",
     "tabler-icons-react": "^1.48.0",
     "typescript": "^4.6.3",
-    "vite": "^2.9.9",
-    "vite-plugin-dts": "^1.1.1"
+    "vite": "^3.0.3",
+    "vite-plugin-dts": "^1.1.1",
+    "vitest": "^0.19.1"
   },
   "peerDependencies": {
     "@emotion/react": "11.10.0",

package/dist/api-caller/index.d.ts

@@ -1,20 +0,0 @@
-import { ContextInfoContextType, FilterValuesContextType } from '../contexts';
-import { IDashboardDefinition, IQuery } from '../types';
-import { IDataSource } from './types';
-interface IQueryByStaticSQL {
-    type: 'postgresql';
-    key: string;
-    sql: string;
-}
-export declare const queryByStaticSQL: ({ type, key, sql }: IQueryByStaticSQL) => () => Promise<any>;
-interface IQueryBySQL {
-    context: ContextInfoContextType;
-    definitions: IDashboardDefinition;
-    title: string;
-    query?: IQuery;
-    filterValues: FilterValuesContextType;
-}
-export declare const queryBySQL: ({ context, definitions, title, query, filterValues }: IQueryBySQL) => () => Promise<any>;
-export declare type TQuerySources = Record<string, string[]>;
-export declare function listDataSources(): Promise<IDataSource[]>;
-export {};

package/dist/api-caller/request.d.ts

@@ -1,5 +0,0 @@
-import { Method } from 'axios';
-export declare const APIClient: {
-    baseURL: string;
-    getRequest(method: Method): (url: string, data: any, options?: any) => Promise<any>;
-};

package/dist/api-caller/types.d.ts

@@ -1,11 +0,0 @@
-export declare type PaginationResponse<T> = {
-    total: number;
-    offset: number;
-    data: T[];
-};
-export declare type DataSourceType = 'postgresql' | 'mysql' | 'http';
-export interface IDataSource {
-    id: string;
-    type: DataSourceType;
-    key: string;
-}

package/dist/contexts/context-info-context.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-export declare type TimeRangeType = [Date | null, Date | null];
-export declare type ContextInfoContextType = Record<string, TimeRangeType | any | any[]>;
-export declare const initialContextInfoContext: {};
-export declare const ContextInfoContext: React.Context<ContextInfoContextType>;

package/dist/contexts/dashboard-action-context.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-export interface IDashboardActionContext {
-    addPanel: () => void;
-    duplidatePanel: (id: string) => void;
-    removePanelByID: (id: string) => void;
-    viewPanelInFullScreen: (id: string) => void;
-    inFullScreen: boolean;
-}
-export declare const DashboardActionContext: React.Context<IDashboardActionContext>;

package/dist/contexts/definition-context.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { IDashboardDefinition, IQuery, ISQLSnippet } from '../types';
-export interface IDefinitionContext extends IDashboardDefinition {
-    setSQLSnippets: React.Dispatch<React.SetStateAction<ISQLSnippet[]>>;
-    setQueries: React.Dispatch<React.SetStateAction<IQuery[]>>;
-}
-export declare const DefinitionContext: React.Context<IDefinitionContext>;

package/dist/contexts/filter-values-context.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-export declare type FilterValuesContextType = Record<string, any>;
-export declare const initialFilterValuesContext: {};
-export declare const FilterValuesContext: React.Context<FilterValuesContextType>;

package/dist/contexts/index.d.ts

@@ -1,5 +0,0 @@
-export * from './definition-context';
-export * from './context-info-context';
-export * from './filter-values-context';
-export * from './layout-state-context';
-export * from './panel-context';

package/dist/contexts/layout-state-context.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-import { DashboardMode } from '../types/dashboard';
-export interface ILayoutStateContext {
-    layoutFrozen: boolean;
-    freezeLayout: React.Dispatch<React.SetStateAction<boolean>>;
-    mode: DashboardMode;
-    inEditMode: boolean;
-    inLayoutMode: boolean;
-    inUseMode: boolean;
-}
-export declare const LayoutStateContext: React.Context<ILayoutStateContext>;

package/dist/contexts/panel-context.d.ts

@@ -1,17 +0,0 @@
-import React from 'react';
-import { IVizConfig } from '../types/dashboard';
-export interface IPanelContext {
-    id: string;
-    data: any[];
-    loading: boolean;
-    title: string;
-    setTitle: React.Dispatch<React.SetStateAction<string>>;
-    description: string;
-    setDescription: React.Dispatch<React.SetStateAction<string>>;
-    queryID: string;
-    setQueryID: React.Dispatch<React.SetStateAction<string>>;
-    viz: IVizConfig;
-    setViz: React.Dispatch<React.SetStateAction<IVizConfig>>;
-    refreshData: () => void;
-}
-export declare const PanelContext: React.Context<IPanelContext>;

package/dist/definition-editor/data-editor-modal.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-interface IDataEditorModal {
-    opened: boolean;
-    close: () => void;
-}
-export declare function DataEditorModal({ opened, close }: IDataEditorModal): JSX.Element;
-export {};

package/dist/definition-editor/global-variables-guide.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-import { Sx } from '@mantine/core';
-interface IGlobalVariablesGuide {
-    showSQLSnippets?: boolean;
-    sx?: Sx;
-}
-export declare function GlobalVariablesGuide({ showSQLSnippets, sx }: IGlobalVariablesGuide): JSX.Element;
-export {};

package/dist/definition-editor/index.d.ts

@@ -1 +0,0 @@
-export * from './data-editor-modal';

package/dist/definition-editor/query-editor/data-preview.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-export declare function DataPreview({ id }: {
-    id: string;
-}): JSX.Element;

package/dist/definition-editor/query-editor/editor.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-interface IQueryEditor {
-    id: string;
-    setID: React.Dispatch<React.SetStateAction<string>>;
-}
-export declare function QueryEditor({ id, setID }: IQueryEditor): JSX.Element | null;
-export {};

package/dist/definition-editor/query-editor/form.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-import { IQuery } from '../../types';
-interface IQueryForm {
-    value: IQuery;
-    onChange: any;
-}
-export declare function QueryForm({ value, onChange }: IQueryForm): JSX.Element;
-export {};

package/dist/definition-editor/query-editor/index.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-interface IEditQueries {
-}
-export declare function EditQueries({}: IEditQueries): JSX.Element;
-export {};

package/dist/definition-editor/query-editor/preview-sql.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-interface IPreviewSQL {
-    value: string;
-}
-export declare function PreviewSQL({ value }: IPreviewSQL): JSX.Element;
-export {};

package/dist/definition-editor/query-editor/select-or-add-query.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-interface ISelectOrAddQuery {
-    id: string;
-    setID: React.Dispatch<React.SetStateAction<string>>;
-}
-export declare function SelectOrAddQuery({ id, setID }: ISelectOrAddQuery): JSX.Element;
-export {};

package/dist/definition-editor/sql-snippet-editor/editor.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-interface ISQLSnippetsEditor {
-}
-export declare function SQLSnippetsEditor({}: ISQLSnippetsEditor): JSX.Element;
-export {};

package/dist/definition-editor/sql-snippet-editor/index.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-interface IEditSQLSnippets {
-}
-export declare function EditSQLSnippets({}: IEditSQLSnippets): JSX.Element;
-export {};

package/dist/definition-editor/sql-snippet-editor/preview-snippet.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-interface IPreviewSnippet {
-    value: string;
-}
-export declare function PreviewSnippet({ value }: IPreviewSnippet): JSX.Element;
-export {};

package/dist/filter/filter-checkbox/editor.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-import { IFilterConfig_Checkbox } from '../../model/filter/checkbox';
-interface IFilterEditorCheckbox {
-    config: IFilterConfig_Checkbox;
-    index: number;
-}
-export declare const FilterEditorCheckbox: import("react").FunctionComponent<IFilterEditorCheckbox>;
-export {};

package/dist/filter/filter-checkbox/render.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { FilterModelInstance } from '../../model';
-import { IFilterConfig_Checkbox } from '../../model/filter/checkbox';
-interface IFilterCheckbox extends Omit<FilterModelInstance, 'key' | 'type' | 'config'> {
-    config: IFilterConfig_Checkbox;
-    value: any;
-    onChange: (v: any) => void;
-}
-export declare function FilterCheckbox({ label, config: { default_value, ...rest }, value, onChange }: IFilterCheckbox): JSX.Element;
-export {};

package/dist/filter/filter-date-range/editor.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { IFilterConfig_DateRange } from '../../model/filter/date-range';
-interface IFilterEditorDateRange {
-    config: IFilterConfig_DateRange;
-}
-export declare const FilterEditorDateRange: import("react").FunctionComponent<IFilterEditorDateRange>;
-export {};

package/dist/filter/filter-date-range/render.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { FilterModelInstance } from '../../model';
-import { IFilterConfig_DateRange } from '../../model/filter/date-range';
-interface IFilterDateRange extends Omit<FilterModelInstance, 'key' | 'type' | 'config'> {
-    config: IFilterConfig_DateRange;
-    value: any;
-    onChange: (v: any) => void;
-}
-export declare function FilterDateRange({ label, config, value, onChange }: IFilterDateRange): JSX.Element;
-export {};

package/dist/filter/filter-multi-select/editor.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { IFilterConfig_MultiSelect } from '../../model/filter/multi-select';
-interface IFilterEditorMultiSelect {
-    config: IFilterConfig_MultiSelect;
-}
-export declare const FilterEditorMultiSelect: import("react").FunctionComponent<IFilterEditorMultiSelect>;
-export {};

package/dist/filter/filter-multi-select/render.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { FilterModelInstance } from '../../model';
-import { IFilterConfig_MultiSelect } from '../../model/filter/multi-select';
-interface IFilterMultiSelect extends Omit<FilterModelInstance, 'key' | 'type' | 'config'> {
-    config: IFilterConfig_MultiSelect;
-    value: any;
-    onChange: (v: any) => void;
-}
-export declare function FilterMultiSelect({ label, config, value, onChange }: IFilterMultiSelect): JSX.Element;
-export {};

package/dist/filter/filter-query-field/index.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { IFilterOptionQuery } from '../../model/filter/common';
-interface IFilterQueryField {
-    value: IFilterOptionQuery;
-    onChange: (v: IFilterOptionQuery) => void;
-}
-export declare const FilterQueryField: React.FunctionComponent<IFilterQueryField>;
-export {};

package/dist/filter/filter-query-field/select-data-source.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { IFilterOptionQuery } from '../../model/filter/common';
-interface ISelectDataSource {
-    value: IFilterOptionQuery;
-    onChange: (v: IFilterOptionQuery) => void;
-}
-export declare const SelectDataSource: React.FunctionComponent<ISelectDataSource>;
-export {};

package/dist/filter/filter-query-field/test-query.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { IFilterOptionQuery } from '../../model/filter/common';
-interface ITestQuery {
-    query: IFilterOptionQuery;
-}
-export declare const TestQuery: React.FunctionComponent<ITestQuery>;
-export {};

package/dist/filter/filter-select/editor.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { IFilterConfig_Select } from '../../model/filter/select';
-interface IFilterEditorSelect {
-    config: IFilterConfig_Select;
-}
-export declare const FilterEditorSelect: import("react").FunctionComponent<IFilterEditorSelect>;
-export {};

package/dist/filter/filter-select/render.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { FilterModelInstance } from '../../model';
-import { IFilterConfig_Select } from '../../model/filter/select';
-interface IFilterSelect extends Omit<FilterModelInstance, 'key' | 'type' | 'config'> {
-    config: IFilterConfig_Select;
-    value: any;
-    onChange: (v: any) => void;
-}
-export declare function FilterSelect({ label, config, value, onChange }: IFilterSelect): JSX.Element;
-export {};

package/dist/filter/filter-settings/filter-setting.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { FilterModelInstance } from '../../model';
-interface IFilterSetting {
-    filter: FilterModelInstance;
-    index: number;
-}
-export declare const FilterSetting: React.FunctionComponent<IFilterSetting>;
-export {};

package/dist/filter/filter-settings/filter-settings.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { DashboardModelInstance } from '../../model';
-interface FilterSettings {
-    model: DashboardModelInstance;
-}
-export declare const FilterSettings: React.FunctionComponent<FilterSettings>;
-export {};

package/dist/filter/filter-settings/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { DashboardModelInstance } from '../../model';
-interface FilterSettingsModal {
-    opened: boolean;
-    close: () => void;
-    model: DashboardModelInstance;
-}
-export declare function FilterSettingsModal({ opened, close, model }: FilterSettingsModal): JSX.Element;
-export {};

package/dist/filter/filter-settings/preview-filter.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { FilterModelInstance } from '../../model';
-interface IPreviewFilter {
-    filter: FilterModelInstance;
-}
-export declare const PreviewFilter: React.FunctionComponent<IPreviewFilter>;
-export {};

package/dist/filter/filter-text-input/editor.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { IFilterConfig_TextInput } from '../../model/filter/text-input';
-interface IFilterEditorTextInput {
-    config: IFilterConfig_TextInput;
-}
-export declare const FilterEditorTextInput: import("react").FunctionComponent<IFilterEditorTextInput>;
-export {};

package/dist/filter/filter-text-input/render.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { FilterModelInstance } from '../../model';
-import { IFilterConfig_TextInput } from '../../model/filter/text-input';
-interface IFilterTextInput extends Omit<FilterModelInstance, 'key' | 'type' | 'config'> {
-    config: IFilterConfig_TextInput;
-    value: any;
-    onChange: (v: any) => void;
-}
-export declare function FilterTextInput({ label, config, value, onChange }: IFilterTextInput): JSX.Element;
-export {};

package/dist/filter/filter.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { FilterModelInstance } from '../model';
-interface IFilter {
-    filter: FilterModelInstance;
-    value: any;
-    onChange: (v: any) => void;
-}
-export declare const Filter: React.ForwardRefExoticComponent<IFilter & React.RefAttributes<unknown>>;
-export {};

package/dist/filter/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { FilterModelInstance } from '../model';
-interface IFilters {
-    filters: FilterModelInstance[];
-    filterValues: Record<string, any>;
-    setFilterValues: (v: Record<string, any>) => void;
-}
-export declare function Filters({ filters, filterValues, setFilterValues }: IFilters): JSX.Element | null;
-export {};

package/dist/index.d.ts

@@ -1,5 +0,0 @@
-export * from './main';
-export * from './layout';
-export * from './panel';
-export * from './contexts';
-export * from './types';

package/dist/layout/index.d.ts

@@ -1,12 +0,0 @@
-import React from 'react';
-import { IDashboardPanel } from '../types/dashboard';
-interface IDashboardLayout {
-    panels: IDashboardPanel[];
-    setPanels: React.Dispatch<React.SetStateAction<IDashboardPanel[]>>;
-    className?: string;
-    rowHeight?: number;
-    isDraggable: boolean;
-    isResizable: boolean;
-}
-export declare function DashboardLayout({ panels, setPanels, className, rowHeight, isDraggable, isResizable, }: IDashboardLayout): JSX.Element;
-export {};

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

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { IDashboardPanel } from '../types/dashboard';
-interface IReadOnlyDashboardLayout {
-    panels: IDashboardPanel[];
-    className?: string;
-    rowHeight?: number;
-}
-export declare function ReadOnlyDashboardLayout({ panels, className, rowHeight }: IReadOnlyDashboardLayout): JSX.Element;
-export {};

package/dist/main/actions.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-import { DashboardMode } from '../types';
-import { DashboardModelInstance } from '../model';
-interface IDashboardActions {
-    mode: DashboardMode;
-    setMode: React.Dispatch<React.SetStateAction<DashboardMode>>;
-    hasChanges: boolean;
-    saveChanges: () => void;
-    revertChanges: () => void;
-    getCurrentSchema: () => any;
-    model: DashboardModelInstance;
-}
-export declare function DashboardActions({ mode, setMode, hasChanges, saveChanges, revertChanges, getCurrentSchema, model, }: IDashboardActions): JSX.Element;
-export {};

package/dist/main/full-screen-panel.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-import { IDashboardPanel } from '../types';
-export declare function FullScreenPanel({ panel, exitFullScreen }: {
-    panel: IDashboardPanel;
-    exitFullScreen: () => void;
-}): JSX.Element;

package/dist/main/index.d.ts

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

package/dist/main/main.d.ts

@@ -1,12 +0,0 @@
-import React from 'react';
-import { IDashboard, IDashboardConfig } from '../types/dashboard';
-import { ContextInfoContextType } from '../contexts';
-interface IDashboardProps {
-    context: ContextInfoContextType;
-    dashboard: IDashboard;
-    className?: string;
-    update: (dashboard: IDashboard) => Promise<void>;
-    config: IDashboardConfig;
-}
-export declare const Dashboard: React.FunctionComponent<IDashboardProps>;
-export {};

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

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { IDashboard, IDashboardConfig } from '../types/dashboard';
-import { ContextInfoContextType } from '../contexts';
-interface IReadOnlyDashboard {
-    context: ContextInfoContextType;
-    dashboard: IDashboard;
-    className?: string;
-    config: IDashboardConfig;
-}
-export declare function ReadOnlyDashboard({ context, dashboard, className, config }: IReadOnlyDashboard): JSX.Element;
-export {};

package/dist/main/toggle-mode.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { DashboardMode } from '../types/dashboard';
-interface IModeToggler {
-    mode: DashboardMode;
-    setMode: React.Dispatch<React.SetStateAction<DashboardMode>>;
-}
-export declare function ModeToggler({ mode, setMode }: IModeToggler): JSX.Element;
-export {};