@devtable/dashboard 2.0.0 → 2.3.0

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { IDashboardFilter, IFilterConfig_Select } from "../../types";
+interface IFilterSelect extends Omit<IDashboardFilter, '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

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { Control, FieldArrayWithId, UseFormWatch } from "react-hook-form";
+import { IFilterSettingsForm } from "./types";
+interface IFilterSetting {
+    field: FieldArrayWithId<IFilterSettingsForm, "filters", "id">;
+    index: number;
+    control: Control<IFilterSettingsForm, object>;
+    watch: UseFormWatch<IFilterSettingsForm>;
+}
+export declare function FilterSetting({ field, index, control, watch }: IFilterSetting): JSX.Element;
+export {};

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

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { IDashboardFilter } from "../../types";
+interface FilterSettings {
+    filters: IDashboardFilter[];
+    setFilters: (v: IDashboardFilter[]) => void;
+}
+export declare function FilterSettings({ filters, setFilters }: FilterSettings): JSX.Element;
+export {};

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

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { IDashboardFilter } from "../../types";
+interface FilterSettingsModal {
+    opened: boolean;
+    close: () => void;
+    filters: IDashboardFilter[];
+    setFilters: (v: IDashboardFilter[]) => void;
+}
+export declare function FilterSettingsModal({ opened, close, filters, setFilters }: FilterSettingsModal): JSX.Element;
+export {};

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

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { IDashboardFilter } from "../../types";
+import { UseFormWatch } from "react-hook-form";
+import { IFilterSettingsForm } from "./types";
+interface IPreviewFilter {
+    filter: IDashboardFilter;
+    index: number;
+    watch: UseFormWatch<IFilterSettingsForm>;
+}
+export declare function PreviewFilter({ filter, index, watch }: IPreviewFilter): JSX.Element;
+export {};

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

@@ -0,0 +1,4 @@
+import { IDashboardFilter } from "../../types";
+export interface IFilterSettingsForm {
+    filters: IDashboardFilter[];
+}

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

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { Control, FieldArrayWithId } from "react-hook-form";
+import { IFilterSettingsForm } from "../filter-settings/types";
+interface IFilterEditorTextInput {
+    field: FieldArrayWithId<IFilterSettingsForm, "filters", "id">;
+    index: number;
+    control: Control<IFilterSettingsForm, object>;
+}
+export declare function FilterEditorTextInput({ field, index, control }: IFilterEditorTextInput): JSX.Element;
+export {};

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { IDashboardFilter, IFilterConfig_TextInput } from "../../types";
+interface IFilterTextInput extends Omit<IDashboardFilter, '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

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

package/dist/filter/index.d.ts

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

package/dist/main/actions.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { DashboardMode } from "../types";
+import { DashboardMode, IDashboardFilter } from "../types";
 interface IDashboardActions {
     mode: DashboardMode;
     setMode: React.Dispatch<React.SetStateAction<DashboardMode>>;
@@ -7,6 +7,8 @@ interface IDashboardActions {
     saveChanges: () => void;
     revertChanges: () => void;
     getCurrentSchema: () => any;
+    filters: IDashboardFilter[];
+    setFilters: (v: IDashboardFilter[]) => void;
 }
-export declare function DashboardActions({ mode, setMode, hasChanges, saveChanges, revertChanges, getCurrentSchema, }: IDashboardActions): JSX.Element;
+export declare function DashboardActions({ mode, setMode, hasChanges, saveChanges, revertChanges, getCurrentSchema, filters, setFilters, }: IDashboardActions): JSX.Element;
 export {};

package/dist/main/use-filters.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import { IDashboard, IDashboardFilter } from "../types";
+export declare function useFilters(dashboard: IDashboard): {
+    filters: IDashboardFilter[];
+    setFilters: React.Dispatch<React.SetStateAction<IDashboardFilter[]>>;
+    filterValues: Record<string, any>;
+    setFilterValues: React.Dispatch<React.SetStateAction<Record<string, any>>>;
+};

package/dist/panel/panel-description.d.ts

@@ -1,7 +1,5 @@
 /// <reference types="react" />
 interface IDescriptionPopover {
-    position?: 'top' | 'left' | 'bottom' | 'right';
-    trigger?: 'hover' | 'click';
 }
-export declare function DescriptionPopover({ position, trigger }: IDescriptionPopover): JSX.Element | null;
+export declare function DescriptionPopover({}: IDescriptionPopover): JSX.Element | null;
 export {};

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}.mantine-Tabs-root{width:100%;height:calc(100% - 25px);overflow:hidden;display:flex;justify-content:flex-start;flex-direction:column;flex-wrap:nowrap}.mantine-Tabs-tabsListWrapper{flex:0}.mantine-Tabs-body{flex:1;overflow:scroll}.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}
+.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}.mantine-Tabs-root{width:100%;height:calc(100% - 25px);overflow:hidden;display:flex;justify-content:flex-start;flex-direction:column;flex-wrap:nowrap}.mantine-Tabs-tabsListWrapper{flex:0}.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}

package/dist/types/dashboard.d.ts

@@ -1,3 +1,4 @@
+import { IDashboardFilter } from "./filter";
 export interface IVizConfig {
     type: string;
     conf: Record<string, any>;
@@ -41,6 +42,7 @@ export interface IDashboard {
     name: string;
     definition: IDashboardDefinition;
     panels: IDashboardPanel[];
+    filters: IDashboardFilter[];
 }
 export interface IDashboardConfig {
     apiBaseURL: string;

package/dist/types/filter.d.ts

@@ -0,0 +1,39 @@
+export interface IDashboardFilterOption {
+    label: string;
+    value: string;
+}
+export interface IDashboardFilterOptionQuery {
+    type: 'postgresql';
+    key: string;
+    sql: string;
+}
+export interface IFilterConfig_Select {
+    required: boolean;
+    default_value: string;
+    static_options: IDashboardFilterOption[];
+    options_query: IDashboardFilterOptionQuery;
+}
+export interface IFilterConfig_MultiSelect {
+    default_value: string[];
+    static_options: IDashboardFilterOption[];
+    options_query: IDashboardFilterOptionQuery;
+}
+export interface IFilterConfig_TextInput {
+    required: boolean;
+    default_value: string;
+}
+export interface IFilterConfig_DateRange {
+    inputFormat: 'YYYY' | 'YYYY-MM' | 'YYYY-MM-DD';
+    clearable: boolean;
+    required: boolean;
+}
+export interface IFilterConfig_Checkbox {
+    default_value: boolean;
+}
+export interface IDashboardFilter {
+    key: string;
+    label: string;
+    order: number;
+    type: 'select' | 'multi-select' | 'text-input' | 'checkbox' | 'date-range';
+    config: IFilterConfig_Select | IFilterConfig_MultiSelect | IFilterConfig_TextInput | IFilterConfig_DateRange | IFilterConfig_Checkbox;
+}

package/dist/types/index.d.ts

@@ -1,2 +1,3 @@
 export * from './dashboard';
+export * from './filter';
 export * from './viz-panel';

package/dist/utils/sql.d.ts

@@ -1,6 +1,8 @@
-import { ContextInfoContextType } from "../contexts";
+import { ContextInfoContextType, FilterValuesContextType } from "../contexts";
 import { IDashboardDefinition } from "../types";
 export declare function explainSQLSnippet(snippet: string, context: ContextInfoContextType): any;
 export declare function formatSQL(sql: string, params: Record<string, any>): any;
-export declare function getSQLParams(context: ContextInfoContextType, definitions: IDashboardDefinition): Record<string, any> & ContextInfoContextType;
-export declare function explainSQL(sql: string, context: ContextInfoContextType, definitions: IDashboardDefinition): any;
+export declare function getSQLParams(context: ContextInfoContextType, definitions: IDashboardDefinition, filterValues: FilterValuesContextType): Record<string, any> & ContextInfoContextType & {
+    filters: FilterValuesContextType;
+};
+export declare function explainSQL(sql: string, context: ContextInfoContextType, definitions: IDashboardDefinition, filterValues: FilterValuesContextType): any;

package/dist/utils/template/editor.d.ts

@@ -12,5 +12,5 @@ interface ITemplateVariableField {
     onChange: (v: ITemplateVariable) => void;
     data: any[];
 }
-export declare function TemplateVariableField({ value, onChange, data }: ITemplateVariableField): JSX.Element;
+export declare const TemplateVariableField: React.ForwardRefExoticComponent<ITemplateVariableField & React.RefAttributes<unknown>>;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devtable/dashboard",
-  "version": "2.0.0",
+  "version": "2.3.0",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
@@ -22,7 +22,7 @@
     }
   },
   "scripts": {
-    "dev": "vite",
+    "dev-build": "tsc && vite build --watch",
     "build": "tsc && vite build",
     "preview": "vite preview"
   },
@@ -30,14 +30,14 @@
     "popmotion": "^11.0.3"
   },
   "devDependencies": {
-    "@mantine/core": "^4.2.12",
-    "@mantine/dates": "^4.2.12",
-    "@mantine/form": "^4.2.12",
-    "@mantine/hooks": "^4.2.12",
-    "@mantine/modals": "^4.2.12",
-    "@mantine/notifications": "^4.2.12",
-    "@mantine/prism": "^4.2.12",
-    "@mantine/rte": "^4.2.12",
+    "@mantine/core": "^5.0.2",
+    "@mantine/dates": "^5.0.2",
+    "@mantine/form": "^5.0.2",
+    "@mantine/hooks": "^5.0.2",
+    "@mantine/modals": "^5.0.2",
+    "@mantine/notifications": "^5.0.2",
+    "@mantine/prism": "^5.0.2",
+    "@mantine/rte": "^5.0.2",
     "@types/lodash": "^4.14.182",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
@@ -60,14 +60,15 @@
     "vite-plugin-dts": "^1.1.1"
   },
   "peerDependencies": {
-    "@mantine/core": "^4.2.12",
-    "@mantine/dates": "^4.2.12",
-    "@mantine/form": "^4.2.12",
-    "@mantine/hooks": "^4.2.12",
-    "@mantine/modals": "^4.2.12",
-    "@mantine/notifications": "^4.2.12",
-    "@mantine/prism": "^4.2.12",
-    "@mantine/rte": "^4.2.12",
+    "@emotion/react": "11.10.0",
+    "@mantine/core": "^5.0.2",
+    "@mantine/dates": "^5.0.2",
+    "@mantine/form": "^5.0.2",
+    "@mantine/hooks": "^5.0.2",
+    "@mantine/modals": "^5.0.2",
+    "@mantine/notifications": "^5.0.2",
+    "@mantine/prism": "^5.0.2",
+    "@mantine/rte": "^5.0.2",
     "ahooks": "^3.3.11",
     "axios": "^0.27.2",
     "echarts": "^5.3.2",

package/dist/definition-editor/query-editor/context-and-snippets.d.ts

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

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

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

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

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare function SQLSnippetGuide(): JSX.Element;

package/dist/panel/viz/text/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-interface IVizText {
-    conf: any;
-    data: any;
-    width: number;
-    height: number;
-}
-export declare function VizText({ conf: { paragraphs }, data }: IVizText): JSX.Element;
-export {};

package/dist/panel/viz/text/panel.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import { IVizPanelProps } from "../../../types/viz-panel";
-export declare function VizTextPanel({ conf, setConf }: IVizPanelProps): JSX.Element;